- Landing page redesign
Designer for the marketing site refresh, June 14.
- API integration sprint
Two developers for the billing API integration, June 21.
<List.Root aria-label="Open projects">
<List.Item variant="outline">
<Item.Media variant="icon"><CalendarCheckIcon /></Item.Media>
<Item.Content>
<Item.Title>Landing page redesign</Item.Title>
</Item.Content>
</List.Item>
</List.Root>List renders a <ul> and List.Item an <li>, taking the same children as
Item. Give the list an aria-label — a screen reader announces
the count, and "list of 12" is only useful if it says a list of what.
API
List.Root
Plus the DOM props of the element it renders. Source: list/components/list-root.tsx.
List.Item
| Prop | Type | Default | |
|---|---|---|---|
size | "default" | "sm" | "xs" | — | |
variant | "default" | "muted" | "outline" | — |
Plus the DOM props of the element it renders. Source: list/components/list-item.tsx.
List.Separator
| Prop | Type | Default | |
|---|---|---|---|
className | string | ((state: SeparatorState) => string | undefined) | — | CSS class applied to the element, or a function that returns a class based on the component's state. |
orientation | Orientation | — | The orientation of the separator. |
render | ComponentRenderFn<HTMLProps, SeparatorState> | ReactElement<unknown, string | JSXElementConstructor<any>> | — | Allows you to replace the component's HTML element
with a different tag, or compose it with another component. Accepts a ReactElement or a function that returns the element to render. |
style | CSSProperties | ((state: SeparatorState) => CSSProperties | undefined) | — | Style applied to the element, or a function that returns a style object based on the component's state. |
Plus the DOM props of the element it renders. Source: list/components/list-separator.tsx.