Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[docs-infra] Move ApiPage to TS #43149

Merged
merged 11 commits into from
Aug 2, 2024
Merged

[docs-infra] Move ApiPage to TS #43149

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
11 commits
Select commit Hold shift + click to select a range
5e624c1
Enforce typing on data/translations for components/hooks
alexfauquette Aug 2, 2024
0256bf3
link api-docs-builder to the docs
alexfauquette Aug 2, 2024
66278e2
fix slots section
alexfauquette Aug 2, 2024
3438fa7
fix classes section
alexfauquette Aug 2, 2024
29589c7
Allow Heading to specify an enum for hash
alexfauquette Aug 2, 2024
6edfbbf
Avoid returning null as a translation
alexfauquette Aug 2, 2024
e794a30
Move properties to TS
alexfauquette Aug 2, 2024
12cb6c7
Move ApiPage to ts
alexfauquette Aug 2, 2024
2181016
prettier
alexfauquette Aug 2, 2024
69adf77
fix back i18n
alexfauquette Aug 2, 2024
6e30808
drop idea of types translation
alexfauquette Aug 2, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
fix slots section
  • Loading branch information
@alexfauquette
alexfauquette committed Aug 2, 2024
commit 66278e26b8a4ebc536a14f89b3d8da9a036f18d8
16 changes: 8 additions & 8 deletions docs/src/modules/components/ApiPage/list/SlotsList.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -43,22 +43,22 @@ const StyledApiItem = styled(ExpandableApiItem)(
}),
);

type HashParams = { componentName: string; className: string };
type HashParams = { componentName: string; className: string | null; name: string };

export function getHash({ componentName, className }: HashParams) {
return `${componentName}-css-${className}`;
export function getHash({ componentName, className, name }: HashParams) {
return `${componentName}-css-${className ?? name}`;
}

export type SlotsFormatedParams = {
className: string;
export type SlotsFormattedParams = {
className: string | null;
componentName: string;
description?: string;
name: string;
defaultValue?: string;
};

interface SlotsListProps {
slots: SlotsFormatedParams[];
slots: SlotsFormattedParams[];
displayOption: 'collapsed' | 'expanded';
}

Expand All @@ -75,8 +75,8 @@ export default function SlotsList(props: SlotsListProps) {

return (
<StyledApiItem
id={getHash({ componentName, className })}
key={className}
id={getHash({ componentName, className, name })}
key={name}
title={name}
note=""
type="slots"
Expand Down
9 changes: 5 additions & 4 deletions docs/src/modules/components/ApiPage/sections/SlotsSection.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ import * as React from 'react';
import Box from '@mui/material/Box';
import { useTranslate } from '@mui/docs/i18n';
import { SectionTitle } from '@mui/docs/SectionTitle';
import { ComponentApiContent } from '@mui-internal/api-docs-builder';
import ToggleDisplayOption, {
ApiDisplayOptions,
useApiPageOption,
Expand All @@ -11,7 +12,7 @@ import SlotsList from 'docs/src/modules/components/ApiPage/list/SlotsList';
import SlotsTable from 'docs/src/modules/components/ApiPage/table/SlotsTable';

export type SlotsSectionProps = {
componentSlots: { class: string; name: string; default: string }[];
componentSlots: ComponentApiContent['slots'];
slotDescriptions: { [key: string]: string };
componentName: string;
title?: string;
Expand Down Expand Up @@ -42,7 +43,7 @@ export default function SlotsSection(props: SlotsSectionProps) {
return null;
}

const formatedSlots = componentSlots?.map(({ class: className, name, default: defaultValue }) => {
const formattedSlots = componentSlots?.map(({ class: className, name, default: defaultValue }) => {
return {
description: slotDescriptions[name],
className,
Expand All @@ -64,9 +65,9 @@ export default function SlotsSection(props: SlotsSectionProps) {
</Box>
{spreadHint && <p dangerouslySetInnerHTML={{ __html: spreadHint }} />}
{displayOption === 'table' ? (
<SlotsTable slots={formatedSlots} />
<SlotsTable slots={formattedSlots} />
) : (
<SlotsList slots={formatedSlots} displayOption={displayOption} />
<SlotsList slots={formattedSlots} displayOption={displayOption} />
)}
</React.Fragment>
);
Expand Down
6 changes: 3 additions & 3 deletions docs/src/modules/components/ApiPage/table/SlotsTable.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ import {
brandingDarkTheme as darkTheme,
brandingLightTheme as lightTheme,
} from '@mui/docs/branding';
import { SlotsFormatedParams, getHash } from 'docs/src/modules/components/ApiPage/list/SlotsList';
import { SlotsFormattedParams, getHash } from 'docs/src/modules/components/ApiPage/list/SlotsList';
import StyledTableContainer from 'docs/src/modules/components/ApiPage/table/StyledTableContainer';

const StyledTable = styled('table')(
Expand Down Expand Up @@ -69,7 +69,7 @@ const StyledTable = styled('table')(
);

interface SlotsTableProps {
slots: SlotsFormatedParams[];
slots: SlotsFormattedParams[];
}

export default function SlotsTable(props: SlotsTableProps) {
Expand All @@ -92,7 +92,7 @@ export default function SlotsTable(props: SlotsTableProps) {
const { description, className, name, defaultValue, componentName } = params;

return (
<tr key={className} id={getHash({ componentName, className })}>
<tr key={className} id={getHash({ componentName, className, name })}>
<td className="slot-name" style={{ fontWeight: '600' }}>
{name}
</td>
Expand Down