@windmorph/react 0.2.1 → 0.2.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/carousel/carousel-styles.d.ts +6 -15
- package/dist/components/carousel/carousel-styles.js +4 -7
- package/dist/components/carousel/carousel-styles.js.map +1 -1
- package/dist/components/chip/chip-tokens.d.ts +4 -4
- package/dist/components/date-picker/DatePicker.js +11 -4
- package/dist/components/date-picker/DatePicker.js.map +1 -1
- package/dist/components/date-picker/date-picker-styles.d.ts +3 -3
- package/dist/components/date-picker/date-picker-tokens.d.ts +1 -1
- package/dist/components/dialog/dialog-tokens.d.ts +1 -1
- package/dist/components/list/List.d.ts +9 -0
- package/dist/components/list/List.js +7 -4
- package/dist/components/list/List.js.map +1 -1
- package/dist/components/list/list-styles.js +6 -6
- package/dist/components/list/list-styles.js.map +1 -1
- package/dist/components/list/list-tokens.d.ts +1 -1
- package/dist/components/list/list-tokens.js +50 -0
- package/dist/components/list/list-tokens.js.map +1 -1
- package/dist/components/menu/menu-tokens.d.ts +1 -1
- package/dist/components/navigation/NavigationRail.js +52 -15
- package/dist/components/navigation/NavigationRail.js.map +1 -1
- package/dist/components/search/SearchBar.js +19 -34
- package/dist/components/search/SearchBar.js.map +1 -1
- package/dist/components/search/SearchField.d.ts +111 -0
- package/dist/components/search/SearchField.js +128 -0
- package/dist/components/search/SearchField.js.map +1 -0
- package/dist/components/search/search-field-frame.js +36 -0
- package/dist/components/search/search-field-frame.js.map +1 -0
- package/dist/components/search/search-styles.d.ts +58 -0
- package/dist/components/search/search-styles.js +27 -2
- package/dist/components/search/search-styles.js.map +1 -1
- package/dist/components/select/search-list.js +8 -13
- package/dist/components/select/search-list.js.map +1 -1
- package/dist/components/snackbar/snackbar-tokens.d.ts +1 -1
- package/dist/components/text-field/TextField.js +19 -5
- package/dist/components/text-field/TextField.js.map +1 -1
- package/dist/components/toolbar/toolbar-styles.js +2 -2
- package/dist/components/toolbar/toolbar-styles.js.map +1 -1
- package/dist/components/tooltip/tooltip-tokens.d.ts +1 -1
- package/dist/index.d.ts +3 -2
- package/dist/index.js +3 -2
- package/dist/styles/generated/components.css +5 -0
- package/dist/styles.compiled.css +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"List.js","names":[],"sources":["../../../src/components/list/List.tsx"],"sourcesContent":["'use client';\n\nimport {\n Children,\n createContext,\n isValidElement,\n useCallback,\n useContext,\n useEffect,\n useId,\n useLayoutEffect,\n useMemo,\n useRef,\n useState,\n type CSSProperties,\n type InputHTMLAttributes,\n type JSX,\n type KeyboardEvent,\n type LabelHTMLAttributes,\n type MouseEvent,\n type ReactElement,\n type ReactNode,\n type Ref,\n type RefObject,\n} from 'react';\nimport {\n mergeProps,\n mergeRefs,\n useButton,\n useCheckbox,\n useFocusRing,\n useGridList,\n useGridListItem,\n useGridListSection,\n useHover,\n useLink,\n useListBox,\n useListBoxSection,\n useObjectRef,\n useOption,\n useRadio,\n useRadioGroup,\n useTree,\n useTreeItem,\n VisuallyHidden,\n type AriaButtonProps,\n type AriaCheckboxProps,\n type AriaGridListProps,\n type AriaListBoxOptions,\n type AriaRadioGroupProps,\n type AriaTreeOptions,\n type Key,\n} from 'react-aria';\nimport {\n useListState,\n useRadioGroupState,\n useToggleState,\n useTreeState,\n type ListState,\n type Node,\n type RadioGroupState,\n type TreeState,\n} from 'react-stately';\nimport { DomDirectionLocale } from '../../primitives/DomDirectionLocale';\nimport { preventHiddenInputScroll } from '../../primitives/hidden-input-focus';\nimport { TouchTarget } from '../../primitives/TouchTarget';\nimport { useM3Interaction } from '../../primitives/use-m3-interaction';\nimport { CheckboxBox } from '../checkbox/checkbox-box';\nimport { RadioRing } from '../radio/radio-ring';\nimport { CheckIcon, CloseIcon, SwitchThumb, thumbGeometry } from '../switch/switch-thumb';\nimport { switchStyles } from '../switch/switch-styles';\nimport { FOCUSABLE_DISABLED_OPTIONS } from '../../utils/focusable-disabled';\nimport { assertCollectionChildren } from '../../utils/assert-collection-children';\nimport { useKeepPressedInPlace } from '../../utils/keep-pressed-in-place';\nimport { useNearestReveal } from '../../utils/nearest-reveal';\nimport { cn } from '../../utils/cn';\nimport { densityAttribute, type Density } from '../../tokens/density';\nimport { mergeDataTokens } from '../../utils/merge-data-tokens';\nimport { splitRootProps, type RootDOMProps } from '../../utils/root-props';\nimport { warnOnce } from '../../utils/warn-once';\nimport { listStyles, type ListDividers, type ListVariant } from './list-styles';\nimport { ListMediaContext } from './ListMedia';\n\n/** Props of a {@link ListItem}; the React `key` identifies it for `onAction` and selection. */\nexport interface ListItemProps {\n /** The headline. */\n children: ReactNode;\n /** A short line above the headline. */\n overline?: ReactNode;\n /** One or two lines below the headline. */\n supportingText?: ReactNode;\n /** Leading content: an icon, an avatar, a `ListItemImage` or `ListItemVideo`, or a control. */\n leading?: ReactNode;\n /** Trailing content: an icon, short text or a control (in an interactive list it gets focus with ← / →). */\n trailing?: ReactNode;\n /**\n * Makes the item a link. In a list without `onAction` or `selectionMode` the item is a\n * real `<a>`: its own Tab stop, with the browser's link menu and modified clicks, routed\n * through a `RouterProvider` (such as `NextRouterProvider`) on a plain click.\n */\n href?: string;\n /** Marks the link item for the page being shown: `aria-current=\"page\"` and the selected colours. */\n current?: boolean;\n /** A link item's target; `_blank` adds `rel=\"noopener noreferrer\"` unless `rel` is given. */\n target?: string;\n /** A link item's `rel`, e.g. `\"nofollow\"`. */\n rel?: string;\n /** Downloads the link item's file instead of opening it (optionally with a file name). */\n download?: boolean | string;\n /** Plain-text version of the headline, for type-ahead and announcements. */\n textValue?: string;\n /** Accessible name when the headline isn't plain text. */\n 'aria-label'?: string;\n /** Classes for the item, merged after `classNames.item`; consumer classes win. */\n className?: string;\n /**\n * Makes the whole item a switch or a checkbox (Compose's toggleable `ListItem`): pressing\n * anywhere on it toggles it, and it is one control for assistive tech. Not in lists with\n * `onAction`, links or `selectionMode`. Left out, the item is a plain row.\n */\n control?: 'switch' | 'checkbox';\n /** Whether a switch or checkbox item is on (controlled). */\n checked?: boolean;\n /** Whether a switch or checkbox item starts on (uncontrolled). */\n defaultChecked?: boolean;\n /** Called when a switch or checkbox item is toggled. */\n onCheckedChange?: (checked: boolean) => void;\n /** Where the switch, checkbox or radio button sits, at the start or end of the row. @default \"start\", or \"end\" for a switch */\n controlPlacement?: ControlPlacement;\n /** A radio list item's value, or the value a switch or checkbox item posts with its form. */\n value?: string;\n /** The form field name of a switch or checkbox item. */\n name?: string;\n /** Disables the item. @default false */\n disabled?: boolean;\n /**\n * Aligns the content; by default it is centred, and top-aligned in three-line items.\n * @default \"center\", or \"top\" in three-line items\n */\n verticalAlignment?: 'center' | 'top';\n /** Shows ✓ and ✕ in a switch item's thumb. @default false */\n switchIcons?: boolean;\n /** The most lines the headline shows, then \"…\". Left out, the list's `headlineLines` applies. */\n headlineLines?: LineLimit;\n /**\n * The most lines the supporting text shows, then \"…\". Left out, the list's\n * `supportingTextLines` applies.\n */\n supportingTextLines?: LineLimit;\n /**\n * Nested `ListItem`s (each with its own `key`): the item expands and collapses to show\n * them, in a folder-like way (M3's expand interaction). It ends with a chevron, and → / ←\n * expand and collapse it.\n */\n childItems?: ReactElement<ListItemProps> | ReactElement<ListItemProps>[];\n}\n\n/** How many lines a text shows before it ends with \"…\"; the full text stays in the DOM. */\nexport type LineLimit = 1 | 2 | 3;\n\ntype ControlPlacement = 'start' | 'end';\n\n/** A collection node as React Stately's collection builder reads it. */\ninterface ListItemNode {\n type: 'item';\n props?: ListItemProps;\n rendered?: ReactNode;\n textValue?: string;\n 'aria-label'?: string | undefined;\n hasChildNodes?: boolean;\n element?: ReactElement;\n childNodes?: () => Iterable<ListItemNode>;\n}\n\n/**\n * A `ListItem` renders itself only in a plain or radio list, which hand it its place through\n * context. Interactive lists read its props through `getCollectionNode` and never render it.\n */\nfunction ListItemElement(props: ListItemProps): ReactNode {\n const entry = useContext(ListEntryContext);\n const radio = useContext(RadioListContext);\n const plain = useContext(StaticListContext);\n if (!entry) return null;\n if (radio) return <RadioListItem item={props} radio={radio} position={entry.position} />;\n if (plain) return <StaticListItem item={props} list={plain} entry={entry} />;\n return null;\n}\n\n/**\n * Describes the item to React Stately's collection builder, as its `Item` does: the\n * headline is the item's content, and `childItems` are its nested items.\n */\nListItemElement.getCollectionNode = function* getCollectionNode(\n props: ListItemProps,\n): Generator<ListItemNode> {\n const rendered = props.children;\n const textValue =\n props.textValue || (typeof rendered === 'string' ? rendered : '') || props['aria-label'] || '';\n // Once per page: the collection is rebuilt on every render of the list.\n if (!textValue) {\n warnOnce(\n 'list-item-text-value',\n '[@windmorph/react] A ListItem whose headline is not plain text needs a textValue for type-ahead.',\n );\n }\n const children = listItems(props.childItems);\n yield {\n type: 'item',\n props,\n rendered,\n textValue,\n 'aria-label': props['aria-label'],\n hasChildNodes: children.length > 0,\n *childNodes() {\n for (const element of children) yield { type: 'item', element };\n },\n };\n};\n\n/**\n * An item of a {@link List}. Like React Stately's collection `Item`, the list reads its\n * props; identify it with a React `key`.\n */\nexport const ListItem = ListItemElement as unknown as (props: ListItemProps) => JSX.Element;\n\n/** Props of a {@link ListSection}: a subheader, or a name when it shows none. */\nexport type ListSectionProps = {\n /** `ListItem` elements, each with its own `key`. */\n children: ReactElement<ListItemProps> | ReactElement<ListItemProps>[];\n /** Classes for the section, merged after `classNames.section`; consumer classes win. */\n className?: string;\n} & (\n | {\n /** The subheader shown above the section's items, which names the group. */\n title: ReactNode;\n /** Accessible name for the group, instead of the subheader's text. */\n 'aria-label'?: string;\n }\n | {\n title?: undefined;\n /** Accessible name for the group when it shows no subheader. */\n 'aria-label': string;\n }\n);\n\n/** A collection node for a section, as React Stately's `Section` describes it. */\ninterface ListSectionNode {\n type: 'section';\n props: ListSectionProps;\n rendered: ReactNode;\n 'aria-label'?: string | undefined;\n hasChildNodes: true;\n childNodes: () => Iterable<ListItemNode>;\n}\n\n/**\n * A `ListSection` renders itself only in a plain list: its subheader, and its items, each\n * told through context that it sits in this section and where. Interactive lists read it\n * through `getCollectionNode`. It never needs its type compared, so a section created in a\n * Server Component (whose type reaches the client as a lazy client reference) renders the\n * same as one created in the browser.\n */\nfunction ListSectionElement(props: ListSectionProps): ReactNode {\n const entry = useContext(ListEntryContext);\n const plain = useContext(StaticListContext);\n if (useContext(RadioListContext)) {\n throw new Error(\n \"[@windmorph/react] List: a radio list can't hold ListSections. Use one radio list \" +\n 'per group, or a list with selectionMode=\"single\".',\n );\n }\n const register = plain?.registerSection;\n const index = entry?.index;\n // Tells the list this entry is a section, so the loose items around it form their own\n // groups. A layout effect, so the corrected corners are drawn before the first paint.\n useLayoutEffect(() => {\n if (register == null || index == null || entry?.inSection) return undefined;\n return register(index);\n }, [register, index, entry?.inSection]);\n if (!plain || !entry) return null;\n const items = listItems(props.children);\n return (\n <StaticSection section={props} variant={plain.variant} classNames={plain.classNames}>\n {items.map((item, itemIndex) => (\n <ListEntryContext\n key={item.key ?? itemIndex}\n value={{\n index: itemIndex,\n position: position(itemIndex, items.length),\n inSection: true,\n disabled: plain.isKeyDisabled(item.key),\n }}\n >\n {item}\n </ListEntryContext>\n ))}\n </StaticSection>\n );\n}\n\n/** Describes the section to React Stately's collection builder, as its `Section` does. */\nListSectionElement.getCollectionNode = function* getCollectionNode(\n props: ListSectionProps,\n): Generator<ListSectionNode> {\n const children = listItems(props.children);\n yield {\n type: 'section',\n props,\n rendered: props.title,\n 'aria-label': props['aria-label'],\n hasChildNodes: true,\n *childNodes() {\n for (const element of children) yield { type: 'item', element };\n },\n };\n};\n\n/**\n * A labelled group of items in a {@link List}, under a subheader (`title`). Identify it with\n * a React `key`, like its items. Arrow keys move across sections as through one list.\n * Sections go in static, action (grid) and selection (list box) lists, not in radio lists\n * or lists with `childItems`.\n *\n * @example\n * <List aria-label=\"Settings\" onAction={open}>\n * <ListSection key=\"network\" title=\"Network\">\n * <ListItem key=\"wifi\">Wi‑Fi</ListItem>\n * </ListSection>\n * </List>\n */\nexport const ListSection = ListSectionElement as unknown as (\n props: ListSectionProps,\n) => JSX.Element;\n\nexport interface ListClassNames {\n /** The root list element, merged with `className`. */\n root?: string;\n /** Each `ListSection`'s wrapper (its subheader and items). */\n section?: string;\n /** Each `ListSection`'s subheader. */\n subheader?: string;\n /** Each item. */\n item?: string;\n /** Each item's leading content (icon, avatar, media or control). */\n leading?: string;\n /** Each item's text column (overline, headline and supporting text). */\n text?: string;\n /** Each item's overline. */\n overline?: string;\n /** Each item's headline. */\n headline?: string;\n /** Each item's supporting text. */\n supportingText?: string;\n /** Each item's trailing content. */\n trailing?: string;\n /** The drawn switch, checkbox or radio button of an item that is one. */\n control?: string;\n /** The check that marks a selected item in a list with `selectionMode`. */\n selectionIndicator?: string;\n /** The chevron button that expands an item with nested items. */\n expandButton?: string;\n /** Every `ListItemImage` and `ListItemVideo` in the list (to round them, say). */\n media?: string;\n}\n\ntype Naming =\n | {\n /** Accessible name for the list (a list has no visible label of its own). */\n 'aria-label': string;\n }\n | {\n /** The id of the element that names the list, such as a heading above it. */\n 'aria-labelledby': string;\n };\n\ntype ListChild = ReactElement<ListItemProps> | ReactElement<ListSectionProps>;\n\ninterface ListOwnProps extends RootDOMProps {\n /** The root element's id. */\n id?: string;\n /** Flush items, or separate items 2px apart with rounded group corners. @default \"standard\" */\n variant?: ListVariant;\n /** `ListItem` elements, or `ListSection`s of them. */\n children: ListChild | ListChild[];\n /** Called when an item is pressed or Enter is pressed on it. Makes the list interactive. */\n onAction?: (key: Key) => void;\n /** Whether items can be selected: none, one or several. @default \"none\" */\n selectionMode?: 'none' | 'single' | 'multiple';\n /** The keys of the selected items (controlled). */\n selectedKeys?: 'all' | Iterable<Key>;\n /** The keys of the items selected at first (uncontrolled). */\n defaultSelectedKeys?: 'all' | Iterable<Key>;\n /** Called with the selected keys when the selection changes. */\n onSelectionChange?: (keys: Set<Key> | 'all') => void;\n /**\n * The last selected item can be deselected, leaving none. `false` keeps at least one item\n * selected. @default true\n */\n deselectable?: boolean;\n /** The keys of items that can't be pressed or selected. */\n disabledKeys?: Iterable<Key>;\n /**\n * The selected item of a radio list (Compose's single-selection `ListItem`): with `value`,\n * `defaultValue` or `onChange`, the list is a radio group whose items are radio\n * buttons, each with a `value`.\n */\n value?: string | null;\n /** The radio list's initially selected item value (uncontrolled). */\n defaultValue?: string;\n /** Called with the chosen item's value when a radio list's selection changes. */\n onChange?: (value: string) => void;\n /** The form field name of a radio list. */\n name?: string;\n /** A radio list needs a choice before its form submits. @default false */\n required?: boolean;\n /** Disables every item. @default false */\n disabled?: boolean;\n /** Where a radio list's radio buttons sit, at the start or end of each row. @default \"start\" */\n controlPlacement?: ControlPlacement;\n /**\n * M3's dividers between items: `full` width, or `inset` 16dp from each side. Standard\n * lists only (segmented items are already apart). Left out, there are no dividers.\n */\n dividers?: ListDividers;\n /**\n * Selected items show a check at their end besides their colour, so selection never\n * relies on colour alone (M3 lists accessibility). @default true\n */\n selectionIndicator?: boolean;\n /**\n * Web density, `0` to `-3` (M3: a list \"can adjust margins, spacing, or density\"): each step\n * takes 4px off every item (one line 56px at 0, 44px at -3; two lines 72 → 60px; three\n * lines 88 → 76px; items grown by an image or avatar too) and off section subheaders, and\n * the controls inside items follow. Left out, the list takes the density of the nearest\n * `ThemeProvider` or `ThemeScope`. Prefer setting it there, from a setting, since M3 makes\n * density the reader's choice.\n * @default 0\n */\n density?: Density;\n /** The expanded items of a list with `childItems` (controlled). */\n expandedKeys?: Iterable<Key>;\n /** The items expanded at first (uncontrolled). */\n defaultExpandedKeys?: Iterable<Key>;\n /** Called with the expanded keys when an item expands or collapses. */\n onExpandedChange?: (keys: Set<Key>) => void;\n /** The most lines each item's headline shows, then \"…\". M3: one or two. Left out, no limit. */\n headlineLines?: LineLimit;\n /**\n * The most lines each item's supporting text shows, then \"…\". M3: one in a two-line item,\n * two in a three-line item. Left out, no limit.\n */\n supportingTextLines?: LineLimit;\n /** Ref to the root element: a `<ul>`, or a `<div>` grid or listbox when interactive. */\n ref?: Ref<HTMLElement>;\n /** Classes for the root element, merged with `classNames.root`; consumer classes win. */\n className?: string;\n /** Inline styles for the root element. */\n style?: CSSProperties;\n /** Classes for each part, by slot. */\n classNames?: ListClassNames;\n /** `data-*` attributes go to the root. */\n [data: `data-${string}`]: string | number | boolean | undefined;\n}\n\nexport type ListProps = ListOwnProps & Naming;\n\n/** What every item of a list reads from it. */\ninterface ListOptions {\n headlineLines?: LineLimit | undefined;\n supportingTextLines?: LineLimit | undefined;\n dividers?: ListDividers | undefined;\n selectionIndicator?: boolean | undefined;\n}\n\nconst ListOptionsContext = createContext<ListOptions>({});\n\n/**\n * M3 Expressive list: items with a headline, optional overline and supporting text, and\n * leading and trailing content, flush (standard) or segmented into rounded groups.\n *\n * With `selectionMode` it is a list box of options (`listbox` / `option`), and selected items\n * show a check. With `onAction` or links it is an interactive grid list, where ← / → reach\n * trailing controls. Items with `childItems` expand and collapse (a tree grid). Interactive\n * items get state layers and morph their corners on hover, focus, press and selection, and\n * ↑ / ↓ move between them, wrapping at the ends. Otherwise it is a plain `ul`.\n *\n * Items can lead with M3's image or video thumbnail (`ListItemImage`, `ListItemVideo`),\n * limit their lines (`headlineLines`, `supportingTextLines`), and standard lists can draw\n * `dividers`.\n *\n * @example\n * <List variant=\"segmented\" aria-label=\"Settings\" onAction={open}>\n * <ListItem key=\"wifi\" leading={<WifiIcon />} supportingText=\"Connected\">Wi‑Fi</ListItem>\n * <ListItem key=\"bluetooth\" leading={<BluetoothIcon />}>Bluetooth</ListItem>\n * </List>\n */\nexport function List({ density, ...props }: ListProps) {\n const { headlineLines, supportingTextLines, dividers, selectionIndicator, classNames } = props;\n if (dividers != null && props.variant === 'segmented') {\n throw new Error(\n '[@windmorph/react] List: dividers are for standard lists; segmented items are already apart.',\n );\n }\n return (\n <ListOptionsContext\n value={{ headlineLines, supportingTextLines, dividers, selectionIndicator }}\n >\n <ListMediaContext value={classNames?.media}>\n <ListBody {...props} {...densityAttribute(density)} />\n </ListMediaContext>\n </ListOptionsContext>\n );\n}\n\nconst RADIO_ITEM_ERROR =\n '[@windmorph/react] List: every item of a radio list (one with value, defaultValue or ' +\n 'onChange) needs a value, and none can have a control or an href.';\n\nconst CONTROL_ERROR =\n \"[@windmorph/react] List: switch and checkbox items (control) can't be in a list with \" +\n 'onAction, links, selectionMode or childItems. Put them in their own list, or put a ' +\n \"Switch in an item's trailing content.\";\n\nconst EXPANDABLE_SECTIONS_ERROR =\n \"[@windmorph/react] List: a list with childItems can't hold ListSections; nest the \" +\n 'groups as expandable items instead.';\n\n/**\n * Picks the list's kind from its own props and its top-level entries' props; it never looks\n * at an entry's element type. A plain or radio list renders its entries, which place\n * themselves through context (`ListEntryContext`); an interactive list hands them to React\n * Stately's collection builder, which reads each through its `getCollectionNode`.\n */\nfunction ListBody(props: ListProps) {\n const entries = listItems(props.children);\n if (\n props.value !== undefined ||\n props.defaultValue !== undefined ||\n props.onChange !== undefined\n ) {\n return <RadioList {...props} entries={entries} />;\n }\n const selectable = props.selectionMode != null && props.selectionMode !== 'none';\n // A section has no `childItems`, so only a top-level item can make the list expandable;\n // an item inside a section that has them refuses to render (EXPANDABLE_SECTIONS_ERROR).\n const expandable = entries.some((entry) => listItems(entry.props.childItems).length > 0);\n // Links alone don't make a grid list: they render as real anchors in a plain list.\n const interactive = props.onAction != null || selectable || expandable;\n if (!interactive) return <StaticList {...props} entries={entries} />;\n return <InteractiveList {...props} expandable={expandable} />;\n}\n\nfunction itemLines(item: ListItemProps): 1 | 2 | 3 {\n const extra = Number(item.overline != null) + Number(item.supportingText != null);\n return extra === 2 ? 3 : extra === 1 ? 2 : 1;\n}\n\nfunction itemStylesOptions(\n item: ListItemProps,\n variant: ListVariant | undefined,\n interactive: boolean,\n options: ListOptions,\n) {\n const headlineLines = item.headlineLines ?? options.headlineLines;\n const supportingTextLines = item.supportingTextLines ?? options.supportingTextLines;\n return {\n variant,\n interactive,\n lines: itemLines(item),\n ...(item.verticalAlignment && { align: item.verticalAlignment }),\n ...(options.dividers && { dividers: options.dividers }),\n ...(headlineLines && { headlineLines }),\n ...(supportingTextLines && { supportingTextLines }),\n };\n}\n\nfunction itemStyles(\n item: ListItemProps,\n variant: ListVariant | undefined,\n interactive: boolean,\n options: ListOptions,\n) {\n return listStyles(itemStylesOptions(item, variant, interactive, options));\n}\n\n/**\n * The component tokens' hooks (`list-tokens.ts`), on a list's root and on each item, so an\n * item's own state (`data-selected`) picks its colours. On the root, any set the app passed\n * (`props`) follows the list's own.\n */\nfunction tokenAttributes(variant: ListVariant | undefined, props?: object) {\n return {\n 'data-tokens': mergeDataTokens('md-comp-list', props),\n 'data-variant': variant ?? 'standard',\n } as const;\n}\n\n/** An item's token hooks and its `data-slot`. */\nfunction itemAttributes(variant: ListVariant | undefined) {\n return { ...tokenAttributes(variant), 'data-slot': 'item' } as const;\n}\n\nfunction position(index: number, count: number) {\n if (count === 1) return 'only';\n if (index === 0) return 'first';\n return index === count - 1 ? 'last' : 'middle';\n}\n\ninterface ItemIds {\n headline?: string;\n overline?: string;\n supporting?: string;\n}\n\nfunction ItemContent({\n item,\n styles,\n classNames,\n ids,\n control,\n controlPlacement,\n headline,\n sideClassName,\n end,\n textHidden,\n}: {\n item: ListItemProps;\n styles: ReturnType<typeof listStyles>;\n classNames?: ListClassNames;\n ids?: ItemIds;\n control?: ReactNode;\n controlPlacement?: ControlPlacement;\n /** What the list adds after the trailing content: the selection check, the chevron. */\n end?: ReactNode;\n /** Wraps the headline (a link item's anchor). */\n headline?: (children: ReactNode) => ReactNode;\n /** Classes for the leading and trailing content (a link item raises its controls). */\n sideClassName?: string;\n /**\n * Hides the text from assistive tech: a control item's input is already named and\n * described by it, so it would be read twice.\n */\n textHidden?: boolean;\n}) {\n const leading = controlPlacement === 'start' ? control : null;\n const trailing = controlPlacement === 'end' ? control : end;\n return (\n <>\n {(item.leading != null || leading != null) && (\n <span\n ref={(cell) => hideDecorativeIcons(cell)}\n data-slot=\"leading\"\n className={styles.leading({ class: cn(sideClassName, classNames?.leading) })}\n >\n {leading}\n {item.leading}\n </span>\n )}\n <span\n aria-hidden={textHidden || undefined}\n className={styles.text({ class: classNames?.text })}\n >\n {item.overline != null && (\n <span\n id={ids?.overline}\n data-slot=\"overline\"\n className={styles.overline({ class: classNames?.overline })}\n >\n {item.overline}\n </span>\n )}\n <span\n id={ids?.headline}\n data-slot=\"headline\"\n className={styles.headline({ class: classNames?.headline })}\n >\n {headline ? headline(item.children) : item.children}\n </span>\n {item.supportingText != null && (\n <span\n id={ids?.supporting}\n data-slot=\"supporting\"\n className={styles.supporting({ class: classNames?.supportingText })}\n >\n {item.supportingText}\n </span>\n )}\n </span>\n {(item.trailing != null || trailing != null) && (\n <span\n ref={(cell) => hideDecorativeIcons(cell)}\n data-slot=\"trailing\"\n className={styles.trailing({ class: cn(sideClassName, classNames?.trailing) })}\n >\n {item.trailing}\n {trailing}\n </span>\n )}\n </>\n );\n}\n\n/**\n * Hides the bare icons of an item's leading or trailing content from assistive tech: an\n * `<svg>` child with no name of its own (`aria-label`, `aria-labelledby`, `role`, `<title>`)\n * is decorative, since the item's text names the item, and would otherwise be listed as an\n * unnamed image. A ref callback, so it also reaches icons that components render; it runs\n * on every render (no layout reads), so a replaced icon is hidden too.\n */\nfunction hideDecorativeIcons(cell: HTMLElement | null) {\n if (!cell) return;\n for (const svg of cell.querySelectorAll(':scope > svg')) {\n if (\n svg.hasAttribute('aria-label') ||\n svg.hasAttribute('aria-labelledby') ||\n svg.hasAttribute('role') ||\n svg.querySelector(':scope > title')\n ) {\n continue;\n }\n svg.setAttribute('aria-hidden', 'true');\n }\n}\n\n/** What a plain list hands its items and sections. */\ninterface StaticListValue {\n variant?: ListVariant | undefined;\n classNames?: ListClassNames | undefined;\n /** Whether the item with this key is disabled by the list (`disabled`, `disabledKeys`). */\n isKeyDisabled: (key: Key | null) => boolean;\n /** Marks the top-level entry at `index` as a section; returns its cleanup. */\n registerSection: (index: number) => () => void;\n}\n\nconst StaticListContext = createContext<StaticListValue | null>(null);\n\n/** Where an entry of a plain or radio list sits, from the list or section that renders it. */\ninterface ListEntry {\n index: number;\n /** Its position in its group (segmented corners, dividers). */\n position: string;\n /** Whether a `ListSection` holds it. */\n inSection: boolean;\n /** Whether the list disables it by its key. */\n disabled: boolean;\n}\n\nconst ListEntryContext = createContext<ListEntry | null>(null);\n\n/**\n * The positions of a plain list's top-level entries: each run of items between sections is\n * its own group. Sections are known once they've told the list (`registerSection`); before\n * that (the server render and the first client render) every entry counts as an item.\n */\nfunction entryPositions(count: number, sections: ReadonlySet<number>): string[] {\n const positions: string[] = [];\n let start = 0;\n for (let index = 0; index <= count; index += 1) {\n if (index < count && !sections.has(index)) continue;\n for (let item = start; item < index; item += 1) {\n positions[item] = position(item - start, index - start);\n }\n if (index < count) positions[index] = 'only';\n start = index + 1;\n }\n return positions;\n}\n\nfunction StaticList({\n variant,\n disabled,\n classNames,\n className,\n style,\n ref,\n entries,\n ...rest\n}: ListProps & { entries: ReactElement[] }) {\n const { root: data } = splitRootProps(rest);\n const rootTokens = tokenAttributes(variant, data);\n const { 'aria-label': label, 'aria-labelledby': labelledBy } = rest as {\n 'aria-label'?: string;\n 'aria-labelledby'?: string;\n };\n const root = listStyles({ variant }).root({ class: cn(classNames?.root, className) });\n const [sections, setSections] = useState<ReadonlySet<number>>(() => new Set());\n const registerSection = useCallback((index: number) => {\n setSections((current) => (current.has(index) ? current : new Set(current).add(index)));\n return () =>\n setSections((current) => {\n const next = new Set(current);\n next.delete(index);\n return next;\n });\n }, []);\n const disabledKeys = rest.disabledKeys;\n const list = useMemo<StaticListValue>(() => {\n const keys = new Set<Key>(disabledKeys ?? []);\n return {\n variant,\n classNames,\n isKeyDisabled: (key) => Boolean(disabled) || (key != null && keys.has(key)),\n registerSection,\n };\n }, [variant, classNames, disabled, disabledKeys, registerSection]);\n const positions = entryPositions(entries.length, sections);\n return (\n <ul\n {...data}\n {...rootTokens}\n id={rest.id}\n ref={ref as Ref<HTMLUListElement>}\n style={style}\n aria-label={label}\n aria-labelledby={labelledBy}\n onKeyDown={onLinkArrowKeys}\n className={root}\n >\n <StaticListContext value={list}>\n {entries.map((entry, index) => (\n <ListEntryContext\n key={entry.key ?? index}\n value={{\n index,\n position: positions[index]!,\n inSection: false,\n disabled: list.isKeyDisabled(entry.key),\n }}\n >\n {entry}\n </ListEntryContext>\n ))}\n </StaticListContext>\n </ul>\n );\n}\n\n/** An item of a plain list: a link, a switch or checkbox, or a plain row. */\nfunction StaticListItem({\n item,\n list,\n entry,\n}: {\n item: ListItemProps;\n list: StaticListValue;\n entry: ListEntry;\n}) {\n const options = useContext(ListOptionsContext);\n if (entry.inSection && listItems(item.childItems).length > 0) {\n throw new Error(EXPANDABLE_SECTIONS_ERROR);\n }\n const { variant, classNames } = list;\n const isDisabled = Boolean(entry.disabled || item.disabled);\n if (item.href != null) {\n return (\n <LinkItem\n item={item}\n variant={variant}\n classNames={classNames}\n position={entry.position}\n isDisabled={isDisabled}\n />\n );\n }\n if (item.control != null) {\n return (\n <li data-list-entry=\"\">\n <ToggleItem\n item={item}\n control={item.control}\n variant={variant}\n classNames={classNames}\n position={entry.position}\n listDisabled={isDisabled}\n />\n </li>\n );\n }\n const styles = itemStyles(item, variant, false, options);\n return (\n <li\n data-list-entry=\"\"\n data-shape=\"rest\"\n data-position={entry.position}\n {...itemAttributes(variant)}\n className={styles.item({ class: cn(classNames?.item, item.className) })}\n >\n <span className={styles.cell()}>\n <ItemContent item={item} styles={styles} classNames={classNames} />\n </span>\n </li>\n );\n}\n\n/**\n * Arrow keys between a list's links (M3: \"navigate within the list using arrow keys\"):\n * ↑ / ↓ move focus to the previous or next link, wrapping at the ends, and Home / End to\n * the first and last. Each link stays a real anchor and a Tab stop; disabled items have no\n * link and are skipped.\n */\nfunction onLinkArrowKeys(event: KeyboardEvent<HTMLUListElement>) {\n if (event.altKey || event.ctrlKey || event.metaKey || event.shiftKey) return;\n if (!['ArrowUp', 'ArrowDown', 'Home', 'End'].includes(event.key)) return;\n const links = [\n ...event.currentTarget.querySelectorAll<HTMLAnchorElement>('a[href][data-list-link]'),\n ];\n const index = links.indexOf(event.target as HTMLAnchorElement);\n if (index === -1) return;\n const last = links.length - 1;\n const target =\n event.key === 'Home'\n ? 0\n : event.key === 'End'\n ? last\n : event.key === 'ArrowDown'\n ? index === last\n ? 0\n : index + 1\n : index === 0\n ? last\n : index - 1;\n event.preventDefault();\n links[target]!.focus();\n}\n\n/** The collection's top-level nodes as groups: each section, and each run of items. */\nfunction groupNodes(collection: ListState<object>['collection']) {\n const groups: { section: Node<object> | null; items: Node<object>[] }[] = [];\n for (const node of collection) {\n if (node.type === 'section') {\n const items = [...collection.getChildren!(node.key)].filter((child) => child.type === 'item');\n groups.push({ section: node, items });\n continue;\n }\n const last = groups.at(-1);\n if (last?.section === null) last.items.push(node);\n else groups.push({ section: null, items: [node] });\n }\n return groups;\n}\n\n/** The name of a section's group: its `aria-label`, else its subheader. */\nfunction sectionNaming(section: { title?: ReactNode; 'aria-label'?: string }, headingId: string) {\n return section['aria-label'] != null\n ? { 'aria-label': section['aria-label'] }\n : { 'aria-labelledby': headingId };\n}\n\n/** A section of a plain list: a subheader and a nested list named by it. */\nfunction StaticSection({\n section,\n variant,\n classNames,\n children,\n}: {\n section: ListSectionProps;\n variant?: ListVariant | undefined;\n classNames?: ListClassNames | undefined;\n children: ReactNode;\n}) {\n const headingId = useId();\n const styles = listStyles({ variant, titled: section.title != null });\n return (\n <li\n data-slot=\"section\"\n className={styles.section({ class: cn(classNames?.section, section.className) })}\n >\n {section.title != null && (\n <div id={headingId} className={styles.subheader({ class: classNames?.subheader })}>\n {section.title}\n </div>\n )}\n <ul {...sectionNaming(section, headingId)} className={styles.group()}>\n {children}\n </ul>\n </li>\n );\n}\n\ntype InteractiveKind = 'grid' | 'listbox' | 'tree';\n\nfunction InteractiveList(props: ListProps & { expandable: boolean }) {\n return (\n <DomDirectionLocale>\n {(directionRef) => <CollectionList {...props} directionRef={directionRef} />}\n </DomDirectionLocale>\n );\n}\n\n/** Material Symbols \"check\" and \"expand_more\" (Apache-2.0). */\nfunction CheckIcon20() {\n return (\n <svg viewBox=\"0 -960 960 960\" fill=\"currentColor\" aria-hidden=\"true\" focusable=\"false\">\n <path d=\"M382-240 154-468l57-57 171 171 367-367 57 57-424 424Z\" />\n </svg>\n );\n}\n\nfunction ExpandMoreIcon() {\n return (\n <svg viewBox=\"0 -960 960 960\" aria-hidden=\"true\" focusable=\"false\">\n <path d=\"M480-345 240-585l56-56 184 184 184-184 56 56-240 240Z\" />\n </svg>\n );\n}\n\n/**\n * A grid list (`onAction`, links), a list box (selection) or a tree grid (`childItems`),\n * from React Aria's collection hooks. Arrow keys wrap at the ends, as M3 asks.\n */\nfunction CollectionList({\n expandable,\n variant,\n disabled,\n deselectable = true,\n classNames,\n className,\n style,\n ref,\n directionRef,\n ...rest\n}: ListProps & { expandable: boolean; directionRef: (element: HTMLElement | null) => void }) {\n const { root: data, rest: ariaProps } = splitRootProps(rest);\n assertCollectionChildren(rest.children, 'List', 'ListItem elements');\n const scan = useCollectionScan(rest.children);\n if (scan.items.some((item) => item.control != null)) throw new Error(CONTROL_ERROR);\n if (expandable && scan.sectioned) throw new Error(EXPANDABLE_SECTIONS_ERROR);\n const selectable = rest.selectionMode != null && rest.selectionMode !== 'none';\n // A selection list is a list box (M3: \"Container: List box · List item: Option\"); a list\n // whose items also act or link keeps the grid list's separate actions.\n const kind: InteractiveKind = expandable\n ? 'tree'\n : selectable && rest.onAction == null && !scan.items.some((item) => item.href != null)\n ? 'listbox'\n : 'grid';\n const disabledKeys = new Set<Key>(rest.disabledKeys ?? []);\n for (const [key, item] of scan.entries) {\n if (disabled || item.disabled) disabledKeys.add(key);\n }\n const options = {\n ...(ariaProps as unknown as AriaGridListProps<object>),\n disabledKeys: disabledKeys.size > 0 ? disabledKeys : rest.disabledKeys,\n disallowEmptySelection: !deselectable,\n // Disabled items stay focusable (WAI-ARIA APG, \"Focusability of disabled controls\"); each row\n // keeps only its focus handlers, so it can't be pressed, chosen, expanded or followed.\n ...FOCUSABLE_DISABLED_OPTIONS,\n shouldFocusWrap: true,\n };\n const root: CollectionRootProps = {\n options,\n listRef: ref,\n directionRef,\n data: { ...data, ...tokenAttributes(variant, data) },\n style,\n className: listStyles({ variant }).root({ class: cn(classNames?.root, className) }),\n variant,\n classNames,\n };\n if (kind === 'tree') return <TreeList {...root} />;\n if (kind === 'listbox') return <ListBoxList {...root} />;\n return <GridList {...root} />;\n}\n\ninterface CollectionRootProps {\n options: AriaGridListProps<object> & { shouldFocusWrap: boolean };\n listRef: Ref<HTMLElement> | undefined;\n directionRef: (element: HTMLElement | null) => void;\n data: Record<string, unknown>;\n style?: CSSProperties | undefined;\n className: string;\n variant?: ListVariant | undefined;\n classNames?: ListClassNames | undefined;\n}\n\nfunction GridList({\n options,\n listRef,\n directionRef,\n data,\n style,\n className,\n variant,\n classNames,\n}: CollectionRootProps) {\n const rootRef = useObjectRef(listRef as Ref<HTMLDivElement>);\n const state = useListState(options);\n const { gridProps } = useGridList(options, state, rootRef);\n // Arrow keys reveal a row at the nearest position, never centring the page on the list.\n useNearestReveal(rootRef);\n return (\n <div\n {...mergeProps(data, gridProps)}\n ref={(element) => {\n rootRef.current = element;\n directionRef(element);\n }}\n style={style}\n className={className}\n >\n {groupNodes(state.collection).map((group) => {\n const rows = group.items.map((node, index) => (\n <GridListRow\n key={node.key}\n node={node}\n state={state}\n variant={variant}\n classNames={classNames}\n position={position(index, group.items.length)}\n />\n ));\n return group.section ? (\n <GridListSection\n key={group.section.key}\n node={group.section}\n state={state}\n variant={variant}\n classNames={classNames}\n >\n {rows}\n </GridListSection>\n ) : (\n rows\n );\n })}\n </div>\n );\n}\n\n/**\n * A section of a grid list: a row group named by its subheader, a header row holding a row\n * header (React Aria's `GridListSection` structure), then the items' rows.\n */\nfunction GridListSection({\n node,\n state,\n variant,\n classNames,\n children,\n}: {\n node: Node<object>;\n state: ListState<object>;\n variant?: ListVariant | undefined;\n classNames?: ListClassNames | undefined;\n children: ReactNode;\n}) {\n const ref = useRef<HTMLDivElement>(null);\n const section = node.props as ListSectionProps;\n const { rowProps, rowHeaderProps, rowGroupProps } = useGridListSection(\n { 'aria-label': section['aria-label'] },\n state,\n ref,\n );\n const styles = listStyles({ variant, titled: section.title != null });\n return (\n <div\n {...rowGroupProps}\n {...(section['aria-label'] != null && { 'aria-labelledby': undefined })}\n ref={ref}\n className={styles.section({ class: cn(classNames?.section, section.className) })}\n >\n {section.title != null && (\n <div {...rowProps}>\n <div {...rowHeaderProps} className={styles.subheader({ class: classNames?.subheader })}>\n {section.title}\n </div>\n </div>\n )}\n <div role=\"presentation\" className={styles.group()}>\n {children}\n </div>\n </div>\n );\n}\n\n/** Compose's shape precedence: pressed, then selected or focused (16px), then hovered (12px). */\nfunction shapeOf(state: {\n isPressed: boolean;\n isSelected: boolean;\n isFocusVisible: boolean;\n isHovered: boolean;\n isDisabled: boolean;\n}) {\n if ((state.isPressed && !state.isDisabled) || state.isSelected || state.isFocusVisible) {\n return 'active';\n }\n return state.isHovered && !state.isDisabled ? 'hovered' : 'rest';\n}\n\n/** The check a selected item shows at its end, when the list selects and shows it. */\nfunction useSelectionCheck(\n styles: ReturnType<typeof listStyles>,\n selectable: boolean,\n className: string | undefined,\n): ReactNode {\n const { selectionIndicator = true } = useContext(ListOptionsContext);\n if (!selectable || !selectionIndicator) return null;\n return (\n <span\n aria-hidden=\"true\"\n data-selection-indicator=\"\"\n className={styles.selectionIndicator({ class: className })}\n >\n <CheckIcon20 />\n </span>\n );\n}\n\nfunction GridListRow({\n node,\n state,\n variant,\n classNames,\n position: itemPosition,\n}: {\n node: Node<object>;\n state: ListState<object>;\n variant?: ListVariant | undefined;\n classNames?: ListClassNames | undefined;\n position: string;\n}) {\n const item = node.props as ListItemProps;\n const ref = useRef<HTMLDivElement>(null);\n const {\n rowProps: ownRowProps,\n gridCellProps,\n descriptionProps,\n isPressed,\n isSelected,\n } = useGridListItem({ node }, state, ref);\n const isDisabled = state.disabledKeys.has(node.key);\n const rowProps = isDisabled ? focusOnly(ownRowProps) : ownRowProps;\n const { hoverProps, isHovered } = useHover({ isDisabled });\n const { interactionProps, dataAttributes } = useM3Interaction({ isDisabled, isPressed }, ref);\n const isFocusVisible = dataAttributes['data-focus-visible'] != null;\n const shape = shapeOf({ isPressed, isSelected, isFocusVisible, isHovered, isDisabled });\n const options = useContext(ListOptionsContext);\n const styles = itemStyles(item, variant, true, options);\n const check = useSelectionCheck(\n styles,\n state.selectionManager.selectionMode !== 'none',\n classNames?.selectionIndicator,\n );\n return (\n <div\n {...mergeProps(rowProps, hoverProps, interactionProps)}\n {...dataAttributes}\n aria-disabled={isDisabled || undefined}\n ref={ref}\n data-selected={isSelected || undefined}\n data-shape={shape}\n data-position={itemPosition}\n {...itemAttributes(variant)}\n className={styles.item({ class: cn(classNames?.item, item.className) })}\n >\n <div {...gridCellProps} className={styles.cell()}>\n <ItemContent\n item={item}\n styles={styles}\n classNames={classNames}\n ids={{ supporting: descriptionProps.id }}\n end={check}\n />\n </div>\n </div>\n );\n}\n\nconst FOCUSABLE = 'a[href], button, input, select, textarea, [tabindex]:not([tabindex=\"-1\"])';\n\n/**\n * A disabled item's props: its role, ARIA, id, tab index and focus handlers, but no press, key\n * or pointer handlers, so it takes focus (APG) and does nothing else.\n */\nfunction focusOnly<T extends object>(props: T): T {\n return Object.fromEntries(\n Object.entries(props).filter(\n ([name]) => !/^on[A-Z]/.test(name) || name === 'onFocus' || name === 'onBlur',\n ),\n ) as T;\n}\n\n/** A list box of options: M3's single- and multi-select lists on the web. */\nfunction ListBoxList({\n options,\n listRef,\n directionRef,\n data,\n style,\n className,\n variant,\n classNames,\n}: CollectionRootProps) {\n const rootRef = useObjectRef(listRef as Ref<HTMLDivElement>);\n const listBoxOptions = options as unknown as AriaListBoxOptions<object>;\n const state = useListState(listBoxOptions);\n const { listBoxProps } = useListBox(listBoxOptions, state, rootRef);\n useNearestReveal(rootRef);\n return (\n <div\n {...mergeProps(data, listBoxProps)}\n ref={(element) => {\n rootRef.current = element;\n directionRef(element);\n }}\n style={style}\n className={className}\n >\n {groupNodes(state.collection).map((group) => {\n const rows = group.items.map((node, index) => (\n <OptionRow\n key={node.key}\n node={node}\n state={state}\n variant={variant}\n classNames={classNames}\n position={position(index, group.items.length)}\n />\n ));\n return group.section ? (\n <ListBoxSection\n key={group.section.key}\n node={group.section}\n variant={variant}\n classNames={classNames}\n >\n {rows}\n </ListBoxSection>\n ) : (\n rows\n );\n })}\n </div>\n );\n}\n\n/** A section of a list box: a subheader and a group of options named by it. */\nfunction ListBoxSection({\n node,\n variant,\n classNames,\n children,\n}: {\n node: Node<object>;\n variant?: ListVariant | undefined;\n classNames?: ListClassNames | undefined;\n children: ReactNode;\n}) {\n const section = node.props as ListSectionProps;\n const { itemProps, headingProps, groupProps } = useListBoxSection({\n heading: section.title,\n 'aria-label': section['aria-label'],\n });\n const styles = listStyles({ variant, titled: section.title != null });\n return (\n <div\n {...itemProps}\n className={styles.section({ class: cn(classNames?.section, section.className) })}\n >\n {section.title != null && (\n <div {...headingProps} className={styles.subheader({ class: classNames?.subheader })}>\n {section.title}\n </div>\n )}\n <div\n {...groupProps}\n {...(section['aria-label'] != null && { 'aria-labelledby': undefined })}\n className={styles.group()}\n >\n {children}\n </div>\n </div>\n );\n}\n\nfunction OptionRow({\n node,\n state,\n variant,\n classNames,\n position: itemPosition,\n}: {\n node: Node<object>;\n state: ListState<object>;\n variant?: ListVariant | undefined;\n classNames?: ListClassNames | undefined;\n position: string;\n}) {\n const item = node.props as ListItemProps;\n const ref = useRef<HTMLDivElement>(null);\n const {\n optionProps: ownOptionProps,\n isPressed,\n isSelected,\n } = useOption({ key: node.key }, state, ref);\n const isDisabled = state.disabledKeys.has(node.key);\n const optionProps = isDisabled\n ? { ...focusOnly(ownOptionProps), 'aria-disabled': true }\n : ownOptionProps;\n const { hoverProps, isHovered } = useHover({ isDisabled });\n const { interactionProps, dataAttributes } = useM3Interaction({ isDisabled, isPressed }, ref);\n const isFocusVisible = dataAttributes['data-focus-visible'] != null;\n const shape = shapeOf({ isPressed, isSelected, isFocusVisible, isHovered, isDisabled });\n const options = useContext(ListOptionsContext);\n const styles = itemStyles(item, variant, true, options);\n const check = useSelectionCheck(styles, true, classNames?.selectionIndicator);\n useEffect(() => {\n if (process.env.NODE_ENV === 'production') return;\n const nested = ref.current?.querySelector(FOCUSABLE);\n if (nested) {\n console.warn(\n '[@windmorph/react] List: an item of a selection list is one option and must not hold ' +\n 'buttons, links or fields. Give the list onAction to keep separate trailing actions.',\n nested,\n );\n }\n });\n return (\n <div\n {...mergeProps(optionProps, hoverProps, interactionProps)}\n {...dataAttributes}\n // Named by its content: the overline, headline, supporting and trailing text in the\n // order they show, each read once. Naming it by the headline alone (React Aria's\n // default) leaves visible text out of its name (WCAG 2.5.3), and describing it by the\n // supporting text as well would read that twice. Select's options are named the same way.\n aria-labelledby={undefined}\n aria-describedby={undefined}\n ref={ref}\n data-selected={isSelected || undefined}\n data-shape={shape}\n data-position={itemPosition}\n {...itemAttributes(variant)}\n className={styles.item({ class: cn(classNames?.item, item.className) })}\n >\n <span className={styles.cell()}>\n <ItemContent item={item} styles={styles} classNames={classNames} end={check} />\n </span>\n </div>\n );\n}\n\n/** A tree grid: items with `childItems` expand and collapse to show their nested items. */\nfunction TreeList({\n options,\n listRef,\n directionRef,\n data,\n style,\n className,\n variant,\n classNames,\n}: CollectionRootProps) {\n const rootRef = useObjectRef(listRef as Ref<HTMLDivElement>);\n // `options` carries the list's `expandedKeys`, `defaultExpandedKeys` and `onExpandedChange`.\n const treeOptions = options as unknown as AriaTreeOptions<object> &\n Pick<ListProps, 'expandedKeys' | 'defaultExpandedKeys' | 'onExpandedChange'>;\n const state = useTreeState(treeOptions);\n const { gridProps } = useTree(treeOptions, state, rootRef);\n const rows = [...state.collection.getKeys()]\n .map((key) => state.collection.getItem(key))\n .filter((node): node is Node<object> => node?.type === 'item');\n const { shown, onExited, version } = useRowPresence(rows);\n // A press that opens an item while an open item above it folds keeps the pressed row\n // where it was: the page scrolls by the folded height as the rows close.\n const { capture, release } = useKeepPressedInPlace(\n '[role=row]',\n version,\n shown.some((row) => row.exiting),\n );\n const reveal = listStyles({ variant });\n return (\n <div\n {...mergeProps(data, gridProps, {\n onPointerDownCapture: capture,\n onKeyDownCapture: capture,\n onPointerUpCapture: release,\n onKeyUpCapture: release,\n onClickCapture: (event: MouseEvent<HTMLDivElement>) => {\n // A virtual click (assistive tech) presses with no pointer down before it.\n if (event.detail === 0) capture(event);\n release();\n },\n })}\n ref={(element) => {\n rootRef.current = element;\n directionRef(element);\n }}\n style={style}\n className={className}\n >\n {shown.map((row) => (\n <TreeRowReveal\n key={row.node.key}\n row={row}\n onExited={onExited}\n className={reveal.reveal()}\n clipClassName={reveal.revealClip()}\n >\n {row.exiting ? (\n <TreeRowGhost\n node={row.node}\n selectable={state.selectionManager.selectionMode !== 'none'}\n variant={variant}\n classNames={classNames}\n position={row.position}\n />\n ) : (\n <TreeRow\n node={row.node}\n state={state}\n variant={variant}\n classNames={classNames}\n position={row.position}\n />\n )}\n </TreeRowReveal>\n ))}\n </div>\n );\n}\n\n/** Whether the reader asks for reduced motion (read on a change, never on the server). */\nconst prefersReducedMotion = () =>\n typeof window !== 'undefined' &&\n (window.matchMedia?.('(prefers-reduced-motion: reduce)').matches ?? false);\n\n/** A tree row as shown: live, opening in, or gone from the tree and closing. */\ninterface ShownRow {\n node: Node<object>;\n position: string;\n /** Added after the tree first rendered (an item was expanded), so it opens in. */\n appear: boolean;\n /** No longer in the tree (its parent collapsed); shown until it has closed. */\n exiting: boolean;\n}\n\n/**\n * The rows to render: the tree's visible rows, plus rows that just left it (a collapsed\n * item's nested rows) in their old place until their closing transition ends. Rows added\n * after the first render are marked to open in.\n */\nfunction useRowPresence(rows: Node<object>[]) {\n const live = (node: Node<object>, index: number, appear: boolean): ShownRow => ({\n node,\n position: position(index, rows.length),\n appear,\n exiting: false,\n });\n const keys = rows.map((node) => node.key);\n const [presence, setPresence] = useState(() => ({\n keys,\n shown: rows.map((node, index) => live(node, index, false)),\n }));\n let { shown } = presence;\n // Follow the tree while rendering (no effect, no extra paint) whenever its rows change.\n // A collection can be rebuilt with the same rows, so they're compared by key.\n if (keys.length !== presence.keys.length || keys.some((key, i) => key !== presence.keys[i])) {\n const indexOf = new Map(rows.map((node, index) => [node.key, index]));\n const before = new Map(shown.map((row) => [row.node.key, row]));\n const next: ShownRow[] = [];\n let cursor = 0;\n const takeUpTo = (end: number) => {\n for (; cursor <= end; cursor += 1) {\n const node = rows[cursor]!;\n const previous = before.get(node.key);\n next.push(live(node, cursor, previous ? previous.appear : true));\n }\n };\n for (const row of shown) {\n const index = indexOf.get(row.node.key);\n if (index === undefined) next.push({ ...row, exiting: true });\n else if (index >= cursor) takeUpTo(index);\n }\n takeUpTo(rows.length - 1);\n // A switch under reduced motion (2026-10-17): when rows open while others leave, the\n // leaving ones go at once instead of holding their height while they fade, and the\n // opening ones appear at full height and fade in, so the rows below shift once, never\n // twice. A lone fold still fades where it is.\n const opening = next.some((row) => !row.exiting && !before.has(row.node.key));\n shown =\n opening && next.some((row) => row.exiting) && prefersReducedMotion()\n ? next.filter((row) => !row.exiting)\n : next;\n setPresence({ keys, shown });\n }\n const onExited = useCallback(\n (key: Key) =>\n setPresence((current) => ({\n ...current,\n shown: current.shown.filter((row) => !(row.exiting && row.node.key === key)),\n })),\n [],\n );\n // Live rows render the tree's current nodes; leaving rows keep their last ones.\n const current = new Map(rows.map((node) => [node.key, node]));\n return {\n shown: shown.map((row) => (row.exiting ? row : { ...row, node: current.get(row.node.key)! })),\n onExited,\n /** Changes whenever the rows shown change. */\n version: presence,\n };\n}\n\n/**\n * A tree row's wrapper, which opens its height and fades it in when the row appears, and\n * closes it when the row leaves, then lets it go. Nothing in a leaving row can be focused\n * or read.\n */\nfunction TreeRowReveal({\n row,\n onExited,\n className,\n clipClassName,\n children,\n}: {\n row: ShownRow;\n onExited: (key: Key) => void;\n className: string;\n clipClassName: string;\n children: ReactNode;\n}) {\n const ref = useRef<HTMLDivElement>(null);\n const { exiting, node } = row;\n useEffect(() => {\n if (!exiting) return;\n // Wait for the closing transitions, if any run (none without CSS or with no motion).\n const transitions = ref.current?.getAnimations?.() ?? [];\n if (transitions.length === 0) {\n onExited(node.key);\n return;\n }\n let current = true;\n void Promise.allSettled(transitions.map((transition) => transition.finished)).then(() => {\n if (current) onExited(node.key);\n });\n return () => {\n current = false;\n };\n }, [exiting, node.key, onExited]);\n return (\n <div\n ref={ref}\n data-appear={row.appear || undefined}\n data-exiting={exiting || undefined}\n inert={exiting || undefined}\n className={className}\n >\n <div className={clipClassName}>{children}</div>\n </div>\n );\n}\n\n/** A leaving row's picture while it closes: the row at rest, hidden from assistive tech. */\nfunction TreeRowGhost({\n node,\n selectable,\n variant,\n classNames,\n position: itemPosition,\n}: {\n node: Node<object>;\n selectable: boolean;\n variant?: ListVariant | undefined;\n classNames?: ListClassNames | undefined;\n position: string;\n}) {\n const item = node.props as ListItemProps;\n const options = useContext(ListOptionsContext);\n const styles = listStyles({\n ...itemStylesOptions(item, variant, true, options),\n nested: node.level > 0,\n });\n const check = useSelectionCheck(styles, selectable, classNames?.selectionIndicator);\n const chevron = node.hasChildNodes && (\n <span className={styles.expand({ class: classNames?.expandButton })}>\n <ExpandMoreIcon />\n </span>\n );\n return (\n <div\n aria-hidden=\"true\"\n style={{ '--m3-list-level': node.level } as CSSProperties}\n data-shape=\"rest\"\n data-position={itemPosition}\n {...itemAttributes(variant)}\n className={styles.item({ class: cn(classNames?.item, item.className) })}\n >\n <div className={styles.cell()}>\n <ItemContent\n item={item}\n styles={styles}\n classNames={classNames}\n end={\n check || chevron ? (\n <>\n {check}\n {chevron}\n </>\n ) : null\n }\n />\n </div>\n </div>\n );\n}\n\ntype TreeCollection = TreeState<object>['collection'] & {\n getChildren?: (key: Key) => Iterable<Node<object>>;\n};\n\n/**\n * React Aria's tree item reads a row's siblings (for `aria-posinset` and `aria-setsize`)\n * through `collection.getChildren` and each sibling's `nextKey`, which React Stately's\n * `TreeCollection` doesn't provide: its `nextKey` and `index` follow the visible rows, as\n * keyboard navigation needs. While the row's hook runs, this gives the collection the\n * nested items' own order, and the returned function restores it. React Aria keys its\n * per-list data by the state object, so the state itself has to be the one patched.\n */\nfunction withSiblingOrder(state: TreeState<object>, node: Node<object>) {\n const collection = state.collection as TreeCollection;\n const visibleItem = collection.getItem.bind(collection);\n const siblingsOf = (parentKey: Key | null | undefined) =>\n (parentKey == null ? [...collection] : [...(visibleItem(parentKey)?.childNodes ?? [])]).filter(\n (sibling) => sibling.type === 'item',\n );\n const inSiblingOrder = (item: Node<object>): Node<object> => {\n const siblings = siblingsOf(item.parentKey);\n const index = siblings.findIndex((sibling) => sibling.key === item.key);\n return { ...item, index, nextKey: siblings[index + 1]?.key ?? null };\n };\n collection.getItem = (key: Key) => {\n const item = visibleItem(key);\n return item ? inSiblingOrder(item) : null;\n };\n collection.getChildren = (key: Key) => siblingsOf(key).map(inSiblingOrder);\n return {\n node: inSiblingOrder(node),\n restore: () => {\n delete (collection as Partial<TreeCollection>).getItem;\n delete collection.getChildren;\n },\n };\n}\n\nfunction ExpandButton({ props, className }: { props: AriaButtonProps; className: string }) {\n const ref = useRef<HTMLButtonElement>(null);\n const { buttonProps, isPressed } = useButton(props, ref);\n const { interactionProps, dataAttributes } = useM3Interaction(\n { isDisabled: props.isDisabled, isPressed },\n ref,\n );\n return (\n <button\n {...mergeProps(buttonProps, interactionProps)}\n {...dataAttributes}\n ref={ref}\n className={className}\n >\n {/* 48px, but never taller than a one-line item (44px at density -3), so it stays in its row. */}\n <TouchTarget className=\"h-[min(48px,calc(56px+var(--md-sys-density,0)*4px))]\" />\n <ExpandMoreIcon />\n </button>\n );\n}\n\nfunction TreeRow({\n node,\n state,\n variant,\n classNames,\n position: itemPosition,\n}: {\n node: Node<object>;\n state: TreeState<object>;\n variant?: ListVariant | undefined;\n classNames?: ListClassNames | undefined;\n position: string;\n}) {\n const item = node.props as ListItemProps;\n const ref = useRef<HTMLDivElement>(null);\n const siblingOrder = withSiblingOrder(state, node);\n const { rowProps, gridCellProps, descriptionProps, expandButtonProps, isPressed, isSelected } =\n useTreeItem({ node: siblingOrder.node, hasChildItems: node.hasChildNodes }, state, ref);\n siblingOrder.restore();\n const isDisabled = state.disabledKeys.has(node.key);\n const { hoverProps, isHovered } = useHover({ isDisabled });\n const { interactionProps, dataAttributes } = useM3Interaction({ isDisabled, isPressed }, ref);\n const isFocusVisible = dataAttributes['data-focus-visible'] != null;\n const shape = shapeOf({ isPressed, isSelected, isFocusVisible, isHovered, isDisabled });\n const options = useContext(ListOptionsContext);\n const styles = listStyles({\n ...itemStylesOptions(item, variant, true, options),\n nested: node.level > 0,\n });\n const check = useSelectionCheck(\n styles,\n state.selectionManager.selectionMode !== 'none',\n classNames?.selectionIndicator,\n );\n // Only a check or a chevron makes a trailing cell (and its 12px gap).\n const end =\n check != null || node.hasChildNodes ? (\n <>\n {check}\n {node.hasChildNodes && (\n <ExpandButton\n props={{ ...expandButtonProps, isDisabled }}\n className={styles.expand({ class: classNames?.expandButton })}\n />\n )}\n </>\n ) : null;\n return (\n <div\n {...mergeProps(isDisabled ? focusOnly(rowProps) : rowProps, hoverProps, interactionProps)}\n {...dataAttributes}\n aria-disabled={isDisabled || undefined}\n ref={ref}\n style={{ '--m3-list-level': node.level } as CSSProperties}\n data-selected={isSelected || undefined}\n data-shape={shape}\n data-position={itemPosition}\n {...itemAttributes(variant)}\n className={styles.item({ class: cn(classNames?.item, item.className) })}\n >\n <div {...gridCellProps} className={styles.cell()}>\n <ItemContent\n item={item}\n styles={styles}\n classNames={classNames}\n ids={{ supporting: descriptionProps.id }}\n end={end}\n />\n </div>\n </div>\n );\n}\n\n/**\n * The items of an interactive list's collection, as React Stately's collection builder reads\n * them (each entry describes itself through `getCollectionNode`), top-level and in sections,\n * and whether it has sections. The list picks its kind and its disabled keys from these.\n */\nfunction useCollectionScan(children: ReactNode) {\n const { collection } = useListState<object>({\n children: children as AriaGridListProps<object>['children'],\n });\n return useMemo(() => {\n const entries: [Key, ListItemProps][] = [];\n let sectioned = false;\n for (const node of collection) {\n if (node.type === 'section') {\n sectioned = true;\n for (const child of collection.getChildren!(node.key)) {\n if (child.type === 'item') entries.push([child.key, child.props as ListItemProps]);\n }\n } else if (node.type === 'item') {\n entries.push([node.key, node.props as ListItemProps]);\n }\n }\n return { entries, items: entries.map(([, item]) => item), sectioned };\n }, [collection]);\n}\n\n/** Ids that name an item that is a control (its headline) and describe it (the rest). */\nfunction useItemIds(item: ListItemProps) {\n const id = useId();\n const ids: ItemIds = {\n headline: `${id}-headline`,\n ...(item.overline != null && { overline: `${id}-overline` }),\n ...(item.supportingText != null && { supporting: `${id}-supporting` }),\n };\n const described = [ids.overline, ids.supporting].filter(Boolean).join(' ');\n const naming =\n item['aria-label'] != null\n ? { 'aria-label': item['aria-label'] }\n : { 'aria-labelledby': ids.headline };\n return { ids, naming: { ...naming, ...(described && { 'aria-describedby': described }) } };\n}\n\ninterface ToggleItemProps {\n item: ListItemProps;\n control: 'switch' | 'checkbox';\n variant?: ListVariant;\n classNames?: ListClassNames;\n position: string;\n listDisabled?: boolean;\n}\n\n/** A switch or checkbox item: a visually hidden native input, the item as its label. */\nfunction ToggleItem({ item, control, listDisabled, ...view }: ToggleItemProps) {\n const inputRef = useRef<HTMLInputElement>(null);\n const { ids, naming } = useItemIds(item);\n const isDisabled = Boolean(listDisabled || item.disabled);\n const options: AriaCheckboxProps = {\n ...naming,\n children: item.children,\n isSelected: item.checked,\n defaultSelected: item.defaultChecked,\n onChange: item.onCheckedChange,\n isDisabled,\n name: item.name,\n value: item.value,\n };\n const state = useToggleState(options);\n const { inputProps, labelProps, isSelected, isPressed } = useCheckbox(options, state, inputRef);\n return (\n <ControlItem\n {...view}\n item={item}\n ids={ids}\n kind={control}\n // A native checkbox with the switch role, as React Aria's `useSwitch` renders it.\n inputProps={control === 'switch' ? { ...inputProps, role: 'switch' } : inputProps}\n inputRef={inputRef}\n labelProps={labelProps}\n isSelected={isSelected}\n isDisabled={isDisabled}\n isPressed={isPressed}\n placement={item.controlPlacement ?? (control === 'switch' ? 'end' : 'start')}\n />\n );\n}\n\nfunction RadioList({\n variant,\n classNames,\n className,\n style,\n ref,\n value,\n defaultValue,\n onChange,\n name,\n required,\n disabled,\n controlPlacement = 'start',\n entries,\n ...rest\n}: ListProps & { entries: ReactElement[] }) {\n const { root: data } = splitRootProps(rest);\n const { 'aria-label': label, 'aria-labelledby': labelledBy } = rest as {\n 'aria-label'?: string;\n 'aria-labelledby'?: string;\n };\n const options: AriaRadioGroupProps = {\n id: rest.id,\n 'aria-label': label,\n 'aria-labelledby': labelledBy,\n value,\n defaultValue,\n onChange,\n name,\n isRequired: required,\n isDisabled: disabled,\n };\n const state = useRadioGroupState(options);\n const { radioGroupProps } = useRadioGroup(options, state);\n return (\n <div\n {...mergeProps(data, radioGroupProps)}\n {...tokenAttributes(variant, data)}\n ref={ref as Ref<HTMLDivElement>}\n style={style}\n className={listStyles({ variant }).root({ class: cn(classNames?.root, className) })}\n >\n <RadioListContext value={{ state, variant, classNames, controlPlacement }}>\n {entries.map((entry, index) => (\n <ListEntryContext\n key={entry.key ?? index}\n value={{\n index,\n position: position(index, entries.length),\n inSection: false,\n disabled: false,\n }}\n >\n {entry}\n </ListEntryContext>\n ))}\n </RadioListContext>\n </div>\n );\n}\n\n/** What a radio list hands its items. */\ninterface RadioListValue {\n state: RadioGroupState;\n variant?: ListVariant | undefined;\n classNames?: ListClassNames | undefined;\n controlPlacement: ControlPlacement;\n}\n\nconst RadioListContext = createContext<RadioListValue | null>(null);\n\n/** An item of a radio list: a radio button with the item's `value`. */\nfunction RadioListItem({\n item,\n radio,\n position: itemPosition,\n}: {\n item: ListItemProps;\n radio: RadioListValue;\n position: string;\n}) {\n if (item.value == null || item.control != null || item.href != null) {\n throw new Error(RADIO_ITEM_ERROR);\n }\n return (\n <RadioItem\n item={item}\n state={radio.state}\n variant={radio.variant}\n classNames={radio.classNames}\n position={itemPosition}\n placement={item.controlPlacement ?? radio.controlPlacement}\n />\n );\n}\n\nfunction RadioItem({\n item,\n state,\n placement,\n ...view\n}: {\n item: ListItemProps;\n state: RadioGroupState;\n variant?: ListVariant;\n classNames?: ListClassNames;\n position: string;\n placement: ControlPlacement;\n}) {\n const inputRef = useRef<HTMLInputElement>(null);\n const { ids, naming } = useItemIds(item);\n const { inputProps, labelProps, isSelected, isDisabled, isPressed } = useRadio(\n { ...naming, children: item.children, value: item.value ?? '', isDisabled: item.disabled },\n state,\n inputRef,\n );\n return (\n <ControlItem\n {...view}\n item={item}\n ids={ids}\n kind=\"radio\"\n inputProps={inputProps}\n inputRef={inputRef}\n labelProps={labelProps}\n isSelected={isSelected}\n isDisabled={isDisabled}\n isPressed={isPressed}\n placement={placement}\n />\n );\n}\n\n/**\n * An item that is a switch, checkbox or radio button (Compose's toggleable and selectable\n * `ListItem`s): the item is the input's `<label>`, so pressing anywhere on it changes it,\n * with the list item's state layer, shapes and selected colours. The drawn control only\n * shows the state.\n */\nfunction ControlItem({\n item,\n ids,\n kind,\n inputProps,\n inputRef,\n labelProps,\n isSelected,\n isDisabled,\n isPressed,\n placement,\n variant,\n classNames,\n position: itemPosition,\n}: {\n item: ListItemProps;\n ids: ItemIds;\n kind: 'switch' | 'checkbox' | 'radio';\n inputProps: InputHTMLAttributes<HTMLInputElement>;\n inputRef: RefObject<HTMLInputElement | null>;\n labelProps: LabelHTMLAttributes<HTMLLabelElement>;\n isSelected: boolean;\n isDisabled: boolean;\n isPressed: boolean;\n placement: ControlPlacement;\n variant?: ListVariant;\n classNames?: ListClassNames;\n position: string;\n}) {\n const ref = useRef<HTMLLabelElement>(null);\n const hiddenInputRef = useMemo(() => mergeRefs(inputRef, preventHiddenInputScroll), [inputRef]);\n const { interactionProps, dataAttributes, state } = useM3Interaction(\n { isDisabled, isPressed, isSelected, within: true },\n ref,\n );\n // Compose's shape precedence: pressed, then selected or focused (16px), then hovered (12px).\n const shape =\n (isPressed && !isDisabled) || isSelected || state.isFocusVisible\n ? 'active'\n : state.isHovered && !isDisabled\n ? 'hovered'\n : 'rest';\n const options = useContext(ListOptionsContext);\n const styles = itemStyles(item, variant, true, options);\n const controlState = {\n 'data-checked': isSelected || undefined,\n 'data-disabled': isDisabled || undefined,\n };\n return (\n <label\n {...mergeProps(labelProps, interactionProps)}\n {...dataAttributes}\n ref={ref}\n data-shape={shape}\n data-position={itemPosition}\n {...itemAttributes(variant)}\n className={styles.item({ class: cn(classNames?.item, item.className) })}\n >\n <VisuallyHidden elementType=\"span\">\n <input {...inputProps} ref={hiddenInputRef} />\n </VisuallyHidden>\n <span className={styles.cell()}>\n <ItemContent\n item={item}\n styles={styles}\n classNames={classNames}\n ids={ids}\n controlPlacement={placement}\n textHidden\n control={\n <span\n {...controlState}\n aria-hidden=\"true\"\n className={styles.control({ class: classNames?.control })}\n >\n {kind === 'radio' && <RadioRing />}\n {kind === 'checkbox' && <CheckboxBox />}\n {kind === 'switch' && <SwitchTrack selected={isSelected} icons={item.switchIcons} />}\n </span>\n }\n />\n </span>\n </label>\n );\n}\n\n/** A switch's track and thumb, at rest (the item, not the switch, takes the interaction). */\nfunction SwitchTrack({ selected, icons }: { selected: boolean; icons?: boolean }) {\n const styles = switchStyles();\n const icon = icons ? selected ? <CheckIcon /> : <CloseIcon /> : null;\n const { size, center } = thumbGeometry(selected, false, Boolean(icon));\n return (\n <span\n // The switch's component tokens, resolved on its track as on a Switch.\n data-tokens=\"md-comp-switch\"\n data-slot=\"track\"\n className={styles.control()}\n style={\n { '--m3-thumb-size': `${size}px`, '--m3-thumb-center': `${center}px` } as CSSProperties\n }\n >\n <SwitchThumb styles={styles} icon={icon} />\n </span>\n );\n}\n\n/**\n * The `ListItem` elements, flattened from arrays, with the keys they were given. `Children`\n * also unwraps lazy elements, which a server component's items can arrive as (Next's dev\n * server sends some that way), so they're never dropped from the server render.\n */\nfunction listItems(children: ReactNode): ReactElement<ListItemProps>[] {\n const items: ReactElement<ListItemProps>[] = [];\n Children.forEach(children, (node) => {\n if (isValidElement<ListItemProps>(node)) items.push(node);\n });\n return items;\n}\n\n/**\n * A link item: the item holds a real `<a>` on its headline, whose overlay covers the whole\n * item, so the item is the link (the browser's link menu and modified clicks included)\n * while buttons in its leading or trailing content stay separate controls, never nested in\n * the link. The link is named by the headline and described by the overline and supporting\n * text. React Aria's `useLink` routes a plain click through the `RouterProvider`; a disabled\n * item has no `href`.\n */\nfunction LinkItem({\n item,\n variant,\n classNames,\n position: itemPosition,\n isDisabled,\n}: {\n item: ListItemProps;\n variant?: ListVariant;\n classNames?: ListClassNames;\n position: string;\n isDisabled: boolean;\n}) {\n const itemRef = useRef<HTMLLIElement>(null);\n const linkRef = useRef<HTMLAnchorElement>(null);\n const { ids, naming } = useItemIds(item);\n const href = isDisabled ? undefined : item.href;\n const { linkProps, isPressed } = useLink(\n { href, target: item.target, isDisabled, elementType: 'a' },\n linkRef,\n );\n const { focusProps, isFocusVisible } = useFocusRing();\n const current = Boolean(item.current);\n const { interactionProps, dataAttributes, state } = useM3Interaction(\n { isDisabled, isPressed, isSelected: current },\n itemRef,\n );\n // Compose's shape precedence: pressed, then selected or focused (16px), then hovered (12px).\n const shape =\n (isPressed && !isDisabled) || current || isFocusVisible\n ? 'active'\n : state.isHovered && !isDisabled\n ? 'hovered'\n : 'rest';\n const options = useContext(ListOptionsContext);\n const styles = itemStyles(item, variant, true, options);\n const rel = item.rel ?? (item.target === '_blank' ? 'noopener noreferrer' : undefined);\n return (\n <li\n {...interactionProps}\n {...dataAttributes}\n // The link's focus, not a control's in the trailing content, focuses the item.\n data-focused={isFocusVisible || undefined}\n data-focus-visible={isFocusVisible || undefined}\n ref={itemRef}\n data-list-entry=\"\"\n data-shape={shape}\n data-position={itemPosition}\n {...itemAttributes(variant)}\n className={styles.item({ class: cn('relative', classNames?.item, item.className) })}\n >\n <span className={styles.cell()}>\n <ItemContent\n item={item}\n styles={styles}\n classNames={classNames}\n ids={ids}\n sideClassName={styles.raised()}\n headline={(children) => (\n <a\n {...mergeProps(linkProps, focusProps)}\n {...naming}\n ref={linkRef}\n href={href}\n target={item.target}\n rel={rel}\n download={item.download}\n aria-current={current ? 'page' : undefined}\n data-list-link=\"\"\n className={styles.link()}\n >\n {children}\n </a>\n )}\n />\n </span>\n </li>\n );\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"List.js","names":[],"sources":["../../../src/components/list/List.tsx"],"sourcesContent":["'use client';\n\nimport {\n Children,\n createContext,\n isValidElement,\n useCallback,\n useContext,\n useEffect,\n useId,\n useLayoutEffect,\n useMemo,\n useRef,\n useState,\n type CSSProperties,\n type InputHTMLAttributes,\n type JSX,\n type KeyboardEvent,\n type LabelHTMLAttributes,\n type MouseEvent,\n type ReactElement,\n type ReactNode,\n type Ref,\n type RefObject,\n} from 'react';\nimport {\n mergeProps,\n mergeRefs,\n useButton,\n useCheckbox,\n useFocusRing,\n useGridList,\n useGridListItem,\n useGridListSection,\n useHover,\n useLink,\n useListBox,\n useListBoxSection,\n useObjectRef,\n useOption,\n useRadio,\n useRadioGroup,\n useTree,\n useTreeItem,\n VisuallyHidden,\n type AriaButtonProps,\n type AriaCheckboxProps,\n type AriaGridListProps,\n type AriaListBoxOptions,\n type AriaRadioGroupProps,\n type AriaTreeOptions,\n type Key,\n} from 'react-aria';\nimport {\n useListState,\n useRadioGroupState,\n useToggleState,\n useTreeState,\n type ListState,\n type Node,\n type RadioGroupState,\n type TreeState,\n} from 'react-stately';\nimport { DomDirectionLocale } from '../../primitives/DomDirectionLocale';\nimport { preventHiddenInputScroll } from '../../primitives/hidden-input-focus';\nimport { TouchTarget } from '../../primitives/TouchTarget';\nimport { useM3Interaction } from '../../primitives/use-m3-interaction';\nimport { CheckboxBox } from '../checkbox/checkbox-box';\nimport { RadioRing } from '../radio/radio-ring';\nimport { CheckIcon, CloseIcon, SwitchThumb, thumbGeometry } from '../switch/switch-thumb';\nimport { switchStyles } from '../switch/switch-styles';\nimport { FOCUSABLE_DISABLED_OPTIONS } from '../../utils/focusable-disabled';\nimport { assertCollectionChildren } from '../../utils/assert-collection-children';\nimport { useKeepPressedInPlace } from '../../utils/keep-pressed-in-place';\nimport { useNearestReveal } from '../../utils/nearest-reveal';\nimport { cn } from '../../utils/cn';\nimport { densityAttribute, type Density } from '../../tokens/density';\nimport { mergeDataTokens } from '../../utils/merge-data-tokens';\nimport { splitRootProps, type RootDOMProps } from '../../utils/root-props';\nimport { warnOnce } from '../../utils/warn-once';\nimport { listStyles, type ListDividers, type ListVariant } from './list-styles';\nimport { ListMediaContext } from './ListMedia';\n\n/** Props of a {@link ListItem}; the React `key` identifies it for `onAction` and selection. */\nexport interface ListItemProps {\n /** The headline. */\n children: ReactNode;\n /** A short line above the headline. */\n overline?: ReactNode;\n /** One or two lines below the headline. */\n supportingText?: ReactNode;\n /** Leading content: an icon, an avatar, a `ListItemImage` or `ListItemVideo`, or a control. */\n leading?: ReactNode;\n /** Trailing content: an icon, short text or a control (in an interactive list it gets focus with ← / →). */\n trailing?: ReactNode;\n /**\n * Makes the item a link. In a list without `onAction` or `selectionMode` the item is a\n * real `<a>`: its own Tab stop, with the browser's link menu and modified clicks, routed\n * through a `RouterProvider` (such as `NextRouterProvider`) on a plain click.\n */\n href?: string;\n /** Marks the link item for the page being shown: `aria-current=\"page\"` and the selected colours. */\n current?: boolean;\n /** A link item's target; `_blank` adds `rel=\"noopener noreferrer\"` unless `rel` is given. */\n target?: string;\n /** A link item's `rel`, e.g. `\"nofollow\"`. */\n rel?: string;\n /** Downloads the link item's file instead of opening it (optionally with a file name). */\n download?: boolean | string;\n /** Plain-text version of the headline, for type-ahead and announcements. */\n textValue?: string;\n /** Accessible name when the headline isn't plain text. */\n 'aria-label'?: string;\n /** Classes for the item, merged after `classNames.item`; consumer classes win. */\n className?: string;\n /**\n * Makes the whole item a switch or a checkbox (Compose's toggleable `ListItem`): pressing\n * anywhere on it toggles it, and it is one control for assistive tech. Not in lists with\n * `onAction`, links or `selectionMode`. Left out, the item is a plain row.\n */\n control?: 'switch' | 'checkbox';\n /** Whether a switch or checkbox item is on (controlled). */\n checked?: boolean;\n /** Whether a switch or checkbox item starts on (uncontrolled). */\n defaultChecked?: boolean;\n /** Called when a switch or checkbox item is toggled. */\n onCheckedChange?: (checked: boolean) => void;\n /**\n * Whether a switch, checkbox or radio item that's on takes the selected colours and shape\n * (`secondary-container`, 16px corners), as Compose's toggleable and selectable `ListItem`s\n * do. `false` keeps it plain, with only its control showing the state, as a settings row.\n * Either way the whole item stays the control: a press anywhere changes it, with the state\n * layer and a pointer cursor.\n * @default false for a switch, true for a checkbox or a radio button\n */\n selectedWhenChecked?: boolean;\n /** Where the switch, checkbox or radio button sits, at the start or end of the row. @default \"start\", or \"end\" for a switch */\n controlPlacement?: ControlPlacement;\n /** A radio list item's value, or the value a switch or checkbox item posts with its form. */\n value?: string;\n /** The form field name of a switch or checkbox item. */\n name?: string;\n /** Disables the item. @default false */\n disabled?: boolean;\n /**\n * Aligns the content; by default it is centred, and top-aligned in three-line items.\n * @default \"center\", or \"top\" in three-line items\n */\n verticalAlignment?: 'center' | 'top';\n /** Shows ✓ and ✕ in a switch item's thumb. @default false */\n switchIcons?: boolean;\n /** The most lines the headline shows, then \"…\". Left out, the list's `headlineLines` applies. */\n headlineLines?: LineLimit;\n /**\n * The most lines the supporting text shows, then \"…\". Left out, the list's\n * `supportingTextLines` applies.\n */\n supportingTextLines?: LineLimit;\n /**\n * Nested `ListItem`s (each with its own `key`): the item expands and collapses to show\n * them, in a folder-like way (M3's expand interaction). It ends with a chevron, and → / ←\n * expand and collapse it.\n */\n childItems?: ReactElement<ListItemProps> | ReactElement<ListItemProps>[];\n}\n\n/** How many lines a text shows before it ends with \"…\"; the full text stays in the DOM. */\nexport type LineLimit = 1 | 2 | 3;\n\ntype ControlPlacement = 'start' | 'end';\n\n/** A collection node as React Stately's collection builder reads it. */\ninterface ListItemNode {\n type: 'item';\n props?: ListItemProps;\n rendered?: ReactNode;\n textValue?: string;\n 'aria-label'?: string | undefined;\n hasChildNodes?: boolean;\n element?: ReactElement;\n childNodes?: () => Iterable<ListItemNode>;\n}\n\n/**\n * A `ListItem` renders itself only in a plain or radio list, which hand it its place through\n * context. Interactive lists read its props through `getCollectionNode` and never render it.\n */\nfunction ListItemElement(props: ListItemProps): ReactNode {\n const entry = useContext(ListEntryContext);\n const radio = useContext(RadioListContext);\n const plain = useContext(StaticListContext);\n if (!entry) return null;\n if (radio) return <RadioListItem item={props} radio={radio} position={entry.position} />;\n if (plain) return <StaticListItem item={props} list={plain} entry={entry} />;\n return null;\n}\n\n/**\n * Describes the item to React Stately's collection builder, as its `Item` does: the\n * headline is the item's content, and `childItems` are its nested items.\n */\nListItemElement.getCollectionNode = function* getCollectionNode(\n props: ListItemProps,\n): Generator<ListItemNode> {\n const rendered = props.children;\n const textValue =\n props.textValue || (typeof rendered === 'string' ? rendered : '') || props['aria-label'] || '';\n // Once per page: the collection is rebuilt on every render of the list.\n if (!textValue) {\n warnOnce(\n 'list-item-text-value',\n '[@windmorph/react] A ListItem whose headline is not plain text needs a textValue for type-ahead.',\n );\n }\n const children = listItems(props.childItems);\n yield {\n type: 'item',\n props,\n rendered,\n textValue,\n 'aria-label': props['aria-label'],\n hasChildNodes: children.length > 0,\n *childNodes() {\n for (const element of children) yield { type: 'item', element };\n },\n };\n};\n\n/**\n * An item of a {@link List}. Like React Stately's collection `Item`, the list reads its\n * props; identify it with a React `key`.\n */\nexport const ListItem = ListItemElement as unknown as (props: ListItemProps) => JSX.Element;\n\n/** Props of a {@link ListSection}: a subheader, or a name when it shows none. */\nexport type ListSectionProps = {\n /** `ListItem` elements, each with its own `key`. */\n children: ReactElement<ListItemProps> | ReactElement<ListItemProps>[];\n /** Classes for the section, merged after `classNames.section`; consumer classes win. */\n className?: string;\n} & (\n | {\n /** The subheader shown above the section's items, which names the group. */\n title: ReactNode;\n /** Accessible name for the group, instead of the subheader's text. */\n 'aria-label'?: string;\n }\n | {\n title?: undefined;\n /** Accessible name for the group when it shows no subheader. */\n 'aria-label': string;\n }\n);\n\n/** A collection node for a section, as React Stately's `Section` describes it. */\ninterface ListSectionNode {\n type: 'section';\n props: ListSectionProps;\n rendered: ReactNode;\n 'aria-label'?: string | undefined;\n hasChildNodes: true;\n childNodes: () => Iterable<ListItemNode>;\n}\n\n/**\n * A `ListSection` renders itself only in a plain list: its subheader, and its items, each\n * told through context that it sits in this section and where. Interactive lists read it\n * through `getCollectionNode`. It never needs its type compared, so a section created in a\n * Server Component (whose type reaches the client as a lazy client reference) renders the\n * same as one created in the browser.\n */\nfunction ListSectionElement(props: ListSectionProps): ReactNode {\n const entry = useContext(ListEntryContext);\n const plain = useContext(StaticListContext);\n if (useContext(RadioListContext)) {\n throw new Error(\n \"[@windmorph/react] List: a radio list can't hold ListSections. Use one radio list \" +\n 'per group, or a list with selectionMode=\"single\".',\n );\n }\n const register = plain?.registerSection;\n const index = entry?.index;\n // Tells the list this entry is a section, so the loose items around it form their own\n // groups. A layout effect, so the corrected corners are drawn before the first paint.\n useLayoutEffect(() => {\n if (register == null || index == null || entry?.inSection) return undefined;\n return register(index);\n }, [register, index, entry?.inSection]);\n if (!plain || !entry) return null;\n const items = listItems(props.children);\n return (\n <StaticSection section={props} variant={plain.variant} classNames={plain.classNames}>\n {items.map((item, itemIndex) => (\n <ListEntryContext\n key={item.key ?? itemIndex}\n value={{\n index: itemIndex,\n position: position(itemIndex, items.length),\n inSection: true,\n disabled: plain.isKeyDisabled(item.key),\n }}\n >\n {item}\n </ListEntryContext>\n ))}\n </StaticSection>\n );\n}\n\n/** Describes the section to React Stately's collection builder, as its `Section` does. */\nListSectionElement.getCollectionNode = function* getCollectionNode(\n props: ListSectionProps,\n): Generator<ListSectionNode> {\n const children = listItems(props.children);\n yield {\n type: 'section',\n props,\n rendered: props.title,\n 'aria-label': props['aria-label'],\n hasChildNodes: true,\n *childNodes() {\n for (const element of children) yield { type: 'item', element };\n },\n };\n};\n\n/**\n * A labelled group of items in a {@link List}, under a subheader (`title`). Identify it with\n * a React `key`, like its items. Arrow keys move across sections as through one list.\n * Sections go in static, action (grid) and selection (list box) lists, not in radio lists\n * or lists with `childItems`.\n *\n * @example\n * <List aria-label=\"Settings\" onAction={open}>\n * <ListSection key=\"network\" title=\"Network\">\n * <ListItem key=\"wifi\">Wi‑Fi</ListItem>\n * </ListSection>\n * </List>\n */\nexport const ListSection = ListSectionElement as unknown as (\n props: ListSectionProps,\n) => JSX.Element;\n\nexport interface ListClassNames {\n /** The root list element, merged with `className`. */\n root?: string;\n /** Each `ListSection`'s wrapper (its subheader and items). */\n section?: string;\n /** Each `ListSection`'s subheader. */\n subheader?: string;\n /** Each item. */\n item?: string;\n /** Each item's leading content (icon, avatar, media or control). */\n leading?: string;\n /** Each item's text column (overline, headline and supporting text). */\n text?: string;\n /** Each item's overline. */\n overline?: string;\n /** Each item's headline. */\n headline?: string;\n /** Each item's supporting text. */\n supportingText?: string;\n /** Each item's trailing content. */\n trailing?: string;\n /** The drawn switch, checkbox or radio button of an item that is one. */\n control?: string;\n /** The check that marks a selected item in a list with `selectionMode`. */\n selectionIndicator?: string;\n /** The chevron button that expands an item with nested items. */\n expandButton?: string;\n /** Every `ListItemImage` and `ListItemVideo` in the list (to round them, say). */\n media?: string;\n}\n\ntype Naming =\n | {\n /** Accessible name for the list (a list has no visible label of its own). */\n 'aria-label': string;\n }\n | {\n /** The id of the element that names the list, such as a heading above it. */\n 'aria-labelledby': string;\n };\n\ntype ListChild = ReactElement<ListItemProps> | ReactElement<ListSectionProps>;\n\ninterface ListOwnProps extends RootDOMProps {\n /** The root element's id. */\n id?: string;\n /** Flush items, or separate items 2px apart with rounded group corners. @default \"standard\" */\n variant?: ListVariant;\n /** `ListItem` elements, or `ListSection`s of them. */\n children: ListChild | ListChild[];\n /** Called when an item is pressed or Enter is pressed on it. Makes the list interactive. */\n onAction?: (key: Key) => void;\n /** Whether items can be selected: none, one or several. @default \"none\" */\n selectionMode?: 'none' | 'single' | 'multiple';\n /** The keys of the selected items (controlled). */\n selectedKeys?: 'all' | Iterable<Key>;\n /** The keys of the items selected at first (uncontrolled). */\n defaultSelectedKeys?: 'all' | Iterable<Key>;\n /** Called with the selected keys when the selection changes. */\n onSelectionChange?: (keys: Set<Key> | 'all') => void;\n /**\n * The last selected item can be deselected, leaving none. `false` keeps at least one item\n * selected. @default true\n */\n deselectable?: boolean;\n /** The keys of items that can't be pressed or selected. */\n disabledKeys?: Iterable<Key>;\n /**\n * The selected item of a radio list (Compose's single-selection `ListItem`): with `value`,\n * `defaultValue` or `onChange`, the list is a radio group whose items are radio\n * buttons, each with a `value`.\n */\n value?: string | null;\n /** The radio list's initially selected item value (uncontrolled). */\n defaultValue?: string;\n /** Called with the chosen item's value when a radio list's selection changes. */\n onChange?: (value: string) => void;\n /** The form field name of a radio list. */\n name?: string;\n /** A radio list needs a choice before its form submits. @default false */\n required?: boolean;\n /** Disables every item. @default false */\n disabled?: boolean;\n /** Where a radio list's radio buttons sit, at the start or end of each row. @default \"start\" */\n controlPlacement?: ControlPlacement;\n /**\n * M3's dividers between items: `full` width, or `inset` 16dp from each side. Standard\n * lists only (segmented items are already apart). Left out, there are no dividers.\n */\n dividers?: ListDividers;\n /**\n * Selected items show a check at their end besides their colour, so selection never\n * relies on colour alone (M3 lists accessibility). @default true\n */\n selectionIndicator?: boolean;\n /**\n * Web density, `0` to `-3` (M3: a list \"can adjust margins, spacing, or density\"): each step\n * takes 4px off every item (one line 56px at 0, 44px at -3; two lines 72 → 60px; three\n * lines 88 → 76px; items grown by an image or avatar too) and off section subheaders, and\n * the controls inside items follow. Left out, the list takes the density of the nearest\n * `ThemeProvider` or `ThemeScope`. Prefer setting it there, from a setting, since M3 makes\n * density the reader's choice.\n * @default 0\n */\n density?: Density;\n /** The expanded items of a list with `childItems` (controlled). */\n expandedKeys?: Iterable<Key>;\n /** The items expanded at first (uncontrolled). */\n defaultExpandedKeys?: Iterable<Key>;\n /** Called with the expanded keys when an item expands or collapses. */\n onExpandedChange?: (keys: Set<Key>) => void;\n /** The most lines each item's headline shows, then \"…\". M3: one or two. Left out, no limit. */\n headlineLines?: LineLimit;\n /**\n * The most lines each item's supporting text shows, then \"…\". M3: one in a two-line item,\n * two in a three-line item. Left out, no limit.\n */\n supportingTextLines?: LineLimit;\n /** Ref to the root element: a `<ul>`, or a `<div>` grid or listbox when interactive. */\n ref?: Ref<HTMLElement>;\n /** Classes for the root element, merged with `classNames.root`; consumer classes win. */\n className?: string;\n /** Inline styles for the root element. */\n style?: CSSProperties;\n /** Classes for each part, by slot. */\n classNames?: ListClassNames;\n /** `data-*` attributes go to the root. */\n [data: `data-${string}`]: string | number | boolean | undefined;\n}\n\nexport type ListProps = ListOwnProps & Naming;\n\n/** What every item of a list reads from it. */\ninterface ListOptions {\n headlineLines?: LineLimit | undefined;\n supportingTextLines?: LineLimit | undefined;\n dividers?: ListDividers | undefined;\n selectionIndicator?: boolean | undefined;\n}\n\nconst ListOptionsContext = createContext<ListOptions>({});\n\n/**\n * M3 Expressive list: items with a headline, optional overline and supporting text, and\n * leading and trailing content, flush (standard) or segmented into rounded groups.\n *\n * With `selectionMode` it is a list box of options (`listbox` / `option`), and selected items\n * show a check. With `onAction` or links it is an interactive grid list, where ← / → reach\n * trailing controls. Items with `childItems` expand and collapse (a tree grid). Interactive\n * items get state layers and morph their corners on hover, focus, press and selection, and\n * ↑ / ↓ move between them, wrapping at the ends. Otherwise it is a plain `ul`.\n *\n * Items can lead with M3's image or video thumbnail (`ListItemImage`, `ListItemVideo`),\n * limit their lines (`headlineLines`, `supportingTextLines`), and standard lists can draw\n * `dividers`.\n *\n * @example\n * <List variant=\"segmented\" aria-label=\"Settings\" onAction={open}>\n * <ListItem key=\"wifi\" leading={<WifiIcon />} supportingText=\"Connected\">Wi‑Fi</ListItem>\n * <ListItem key=\"bluetooth\" leading={<BluetoothIcon />}>Bluetooth</ListItem>\n * </List>\n */\nexport function List({ density, ...props }: ListProps) {\n const { headlineLines, supportingTextLines, dividers, selectionIndicator, classNames } = props;\n if (dividers != null && props.variant === 'segmented') {\n throw new Error(\n '[@windmorph/react] List: dividers are for standard lists; segmented items are already apart.',\n );\n }\n return (\n <ListOptionsContext\n value={{ headlineLines, supportingTextLines, dividers, selectionIndicator }}\n >\n <ListMediaContext value={classNames?.media}>\n <ListBody {...props} {...densityAttribute(density)} />\n </ListMediaContext>\n </ListOptionsContext>\n );\n}\n\nconst RADIO_ITEM_ERROR =\n '[@windmorph/react] List: every item of a radio list (one with value, defaultValue or ' +\n 'onChange) needs a value, and none can have a control or an href.';\n\nconst CONTROL_ERROR =\n \"[@windmorph/react] List: switch and checkbox items (control) can't be in a list with \" +\n 'onAction, links, selectionMode or childItems. Put them in their own list, or put a ' +\n \"Switch in an item's trailing content.\";\n\nconst EXPANDABLE_SECTIONS_ERROR =\n \"[@windmorph/react] List: a list with childItems can't hold ListSections; nest the \" +\n 'groups as expandable items instead.';\n\n/**\n * Picks the list's kind from its own props and its top-level entries' props; it never looks\n * at an entry's element type. A plain or radio list renders its entries, which place\n * themselves through context (`ListEntryContext`); an interactive list hands them to React\n * Stately's collection builder, which reads each through its `getCollectionNode`.\n */\nfunction ListBody(props: ListProps) {\n const entries = listItems(props.children);\n if (\n props.value !== undefined ||\n props.defaultValue !== undefined ||\n props.onChange !== undefined\n ) {\n return <RadioList {...props} entries={entries} />;\n }\n const selectable = props.selectionMode != null && props.selectionMode !== 'none';\n // A section has no `childItems`, so only a top-level item can make the list expandable;\n // an item inside a section that has them refuses to render (EXPANDABLE_SECTIONS_ERROR).\n const expandable = entries.some((entry) => listItems(entry.props.childItems).length > 0);\n // Links alone don't make a grid list: they render as real anchors in a plain list.\n const interactive = props.onAction != null || selectable || expandable;\n if (!interactive) return <StaticList {...props} entries={entries} />;\n return <InteractiveList {...props} expandable={expandable} />;\n}\n\nfunction itemLines(item: ListItemProps): 1 | 2 | 3 {\n const extra = Number(item.overline != null) + Number(item.supportingText != null);\n return extra === 2 ? 3 : extra === 1 ? 2 : 1;\n}\n\nfunction itemStylesOptions(\n item: ListItemProps,\n variant: ListVariant | undefined,\n interactive: boolean,\n options: ListOptions,\n) {\n const headlineLines = item.headlineLines ?? options.headlineLines;\n const supportingTextLines = item.supportingTextLines ?? options.supportingTextLines;\n return {\n variant,\n interactive,\n lines: itemLines(item),\n ...(item.verticalAlignment && { align: item.verticalAlignment }),\n ...(options.dividers && { dividers: options.dividers }),\n ...(headlineLines && { headlineLines }),\n ...(supportingTextLines && { supportingTextLines }),\n };\n}\n\nfunction itemStyles(\n item: ListItemProps,\n variant: ListVariant | undefined,\n interactive: boolean,\n options: ListOptions,\n) {\n return listStyles(itemStylesOptions(item, variant, interactive, options));\n}\n\n/**\n * The component tokens' hooks (`list-tokens.ts`), on a list's root and on each item, so an\n * item's own state (`data-selected`) picks its colours. On the root, any set the app passed\n * (`props`) follows the list's own.\n */\nfunction tokenAttributes(variant: ListVariant | undefined, props?: object) {\n return {\n 'data-tokens': mergeDataTokens('md-comp-list', props),\n 'data-variant': variant ?? 'standard',\n } as const;\n}\n\n/** An item's token hooks and its `data-slot`. */\nfunction itemAttributes(variant: ListVariant | undefined) {\n return { ...tokenAttributes(variant), 'data-slot': 'item' } as const;\n}\n\nfunction position(index: number, count: number) {\n if (count === 1) return 'only';\n if (index === 0) return 'first';\n return index === count - 1 ? 'last' : 'middle';\n}\n\ninterface ItemIds {\n headline?: string;\n overline?: string;\n supporting?: string;\n}\n\nfunction ItemContent({\n item,\n styles,\n classNames,\n ids,\n control,\n controlPlacement,\n headline,\n sideClassName,\n end,\n textHidden,\n}: {\n item: ListItemProps;\n styles: ReturnType<typeof listStyles>;\n classNames?: ListClassNames;\n ids?: ItemIds;\n control?: ReactNode;\n controlPlacement?: ControlPlacement;\n /** What the list adds after the trailing content: the selection check, the chevron. */\n end?: ReactNode;\n /** Wraps the headline (a link item's anchor). */\n headline?: (children: ReactNode) => ReactNode;\n /** Classes for the leading and trailing content (a link item raises its controls). */\n sideClassName?: string;\n /**\n * Hides the text from assistive tech: a control item's input is already named and\n * described by it, so it would be read twice.\n */\n textHidden?: boolean;\n}) {\n const leading = controlPlacement === 'start' ? control : null;\n const trailing = controlPlacement === 'end' ? control : end;\n return (\n <>\n {(item.leading != null || leading != null) && (\n <span\n ref={(cell) => hideDecorativeIcons(cell)}\n data-slot=\"leading\"\n className={styles.leading({ class: cn(sideClassName, classNames?.leading) })}\n >\n {leading}\n {item.leading}\n </span>\n )}\n <span\n aria-hidden={textHidden || undefined}\n className={styles.text({ class: classNames?.text })}\n >\n {item.overline != null && (\n <span\n id={ids?.overline}\n data-slot=\"overline\"\n className={styles.overline({ class: classNames?.overline })}\n >\n {item.overline}\n </span>\n )}\n <span\n id={ids?.headline}\n data-slot=\"headline\"\n className={styles.headline({ class: classNames?.headline })}\n >\n {headline ? headline(item.children) : item.children}\n </span>\n {item.supportingText != null && (\n <span\n id={ids?.supporting}\n data-slot=\"supporting\"\n className={styles.supporting({ class: classNames?.supportingText })}\n >\n {item.supportingText}\n </span>\n )}\n </span>\n {(item.trailing != null || trailing != null) && (\n <span\n ref={(cell) => hideDecorativeIcons(cell)}\n data-slot=\"trailing\"\n className={styles.trailing({ class: cn(sideClassName, classNames?.trailing) })}\n >\n {item.trailing}\n {trailing}\n </span>\n )}\n </>\n );\n}\n\n/**\n * Hides the bare icons of an item's leading or trailing content from assistive tech: an\n * `<svg>` child with no name of its own (`aria-label`, `aria-labelledby`, `role`, `<title>`)\n * is decorative, since the item's text names the item, and would otherwise be listed as an\n * unnamed image. A ref callback, so it also reaches icons that components render; it runs\n * on every render (no layout reads), so a replaced icon is hidden too.\n */\nfunction hideDecorativeIcons(cell: HTMLElement | null) {\n if (!cell) return;\n for (const svg of cell.querySelectorAll(':scope > svg')) {\n if (\n svg.hasAttribute('aria-label') ||\n svg.hasAttribute('aria-labelledby') ||\n svg.hasAttribute('role') ||\n svg.querySelector(':scope > title')\n ) {\n continue;\n }\n svg.setAttribute('aria-hidden', 'true');\n }\n}\n\n/** What a plain list hands its items and sections. */\ninterface StaticListValue {\n variant?: ListVariant | undefined;\n classNames?: ListClassNames | undefined;\n /** Whether the item with this key is disabled by the list (`disabled`, `disabledKeys`). */\n isKeyDisabled: (key: Key | null) => boolean;\n /** Marks the top-level entry at `index` as a section; returns its cleanup. */\n registerSection: (index: number) => () => void;\n}\n\nconst StaticListContext = createContext<StaticListValue | null>(null);\n\n/** Where an entry of a plain or radio list sits, from the list or section that renders it. */\ninterface ListEntry {\n index: number;\n /** Its position in its group (segmented corners, dividers). */\n position: string;\n /** Whether a `ListSection` holds it. */\n inSection: boolean;\n /** Whether the list disables it by its key. */\n disabled: boolean;\n}\n\nconst ListEntryContext = createContext<ListEntry | null>(null);\n\n/**\n * The positions of a plain list's top-level entries: each run of items between sections is\n * its own group. Sections are known once they've told the list (`registerSection`); before\n * that (the server render and the first client render) every entry counts as an item.\n */\nfunction entryPositions(count: number, sections: ReadonlySet<number>): string[] {\n const positions: string[] = [];\n let start = 0;\n for (let index = 0; index <= count; index += 1) {\n if (index < count && !sections.has(index)) continue;\n for (let item = start; item < index; item += 1) {\n positions[item] = position(item - start, index - start);\n }\n if (index < count) positions[index] = 'only';\n start = index + 1;\n }\n return positions;\n}\n\nfunction StaticList({\n variant,\n disabled,\n classNames,\n className,\n style,\n ref,\n entries,\n ...rest\n}: ListProps & { entries: ReactElement[] }) {\n const { root: data } = splitRootProps(rest);\n const rootTokens = tokenAttributes(variant, data);\n const { 'aria-label': label, 'aria-labelledby': labelledBy } = rest as {\n 'aria-label'?: string;\n 'aria-labelledby'?: string;\n };\n const root = listStyles({ variant }).root({ class: cn(classNames?.root, className) });\n const [sections, setSections] = useState<ReadonlySet<number>>(() => new Set());\n const registerSection = useCallback((index: number) => {\n setSections((current) => (current.has(index) ? current : new Set(current).add(index)));\n return () =>\n setSections((current) => {\n const next = new Set(current);\n next.delete(index);\n return next;\n });\n }, []);\n const disabledKeys = rest.disabledKeys;\n const list = useMemo<StaticListValue>(() => {\n const keys = new Set<Key>(disabledKeys ?? []);\n return {\n variant,\n classNames,\n isKeyDisabled: (key) => Boolean(disabled) || (key != null && keys.has(key)),\n registerSection,\n };\n }, [variant, classNames, disabled, disabledKeys, registerSection]);\n const positions = entryPositions(entries.length, sections);\n return (\n <ul\n {...data}\n {...rootTokens}\n id={rest.id}\n ref={ref as Ref<HTMLUListElement>}\n style={style}\n aria-label={label}\n aria-labelledby={labelledBy}\n onKeyDown={onLinkArrowKeys}\n className={root}\n >\n <StaticListContext value={list}>\n {entries.map((entry, index) => (\n <ListEntryContext\n key={entry.key ?? index}\n value={{\n index,\n position: positions[index]!,\n inSection: false,\n disabled: list.isKeyDisabled(entry.key),\n }}\n >\n {entry}\n </ListEntryContext>\n ))}\n </StaticListContext>\n </ul>\n );\n}\n\n/** An item of a plain list: a link, a switch or checkbox, or a plain row. */\nfunction StaticListItem({\n item,\n list,\n entry,\n}: {\n item: ListItemProps;\n list: StaticListValue;\n entry: ListEntry;\n}) {\n const options = useContext(ListOptionsContext);\n if (entry.inSection && listItems(item.childItems).length > 0) {\n throw new Error(EXPANDABLE_SECTIONS_ERROR);\n }\n const { variant, classNames } = list;\n const isDisabled = Boolean(entry.disabled || item.disabled);\n if (item.href != null) {\n return (\n <LinkItem\n item={item}\n variant={variant}\n classNames={classNames}\n position={entry.position}\n isDisabled={isDisabled}\n />\n );\n }\n if (item.control != null) {\n return (\n <li data-list-entry=\"\">\n <ToggleItem\n item={item}\n control={item.control}\n variant={variant}\n classNames={classNames}\n position={entry.position}\n listDisabled={isDisabled}\n />\n </li>\n );\n }\n const styles = itemStyles(item, variant, false, options);\n return (\n <li\n data-list-entry=\"\"\n data-shape=\"rest\"\n data-position={entry.position}\n {...itemAttributes(variant)}\n className={styles.item({ class: cn(classNames?.item, item.className) })}\n >\n <span className={styles.cell()}>\n <ItemContent item={item} styles={styles} classNames={classNames} />\n </span>\n </li>\n );\n}\n\n/**\n * Arrow keys between a list's links (M3: \"navigate within the list using arrow keys\"):\n * ↑ / ↓ move focus to the previous or next link, wrapping at the ends, and Home / End to\n * the first and last. Each link stays a real anchor and a Tab stop; disabled items have no\n * link and are skipped.\n */\nfunction onLinkArrowKeys(event: KeyboardEvent<HTMLUListElement>) {\n if (event.altKey || event.ctrlKey || event.metaKey || event.shiftKey) return;\n if (!['ArrowUp', 'ArrowDown', 'Home', 'End'].includes(event.key)) return;\n const links = [\n ...event.currentTarget.querySelectorAll<HTMLAnchorElement>('a[href][data-list-link]'),\n ];\n const index = links.indexOf(event.target as HTMLAnchorElement);\n if (index === -1) return;\n const last = links.length - 1;\n const target =\n event.key === 'Home'\n ? 0\n : event.key === 'End'\n ? last\n : event.key === 'ArrowDown'\n ? index === last\n ? 0\n : index + 1\n : index === 0\n ? last\n : index - 1;\n event.preventDefault();\n links[target]!.focus();\n}\n\n/** The collection's top-level nodes as groups: each section, and each run of items. */\nfunction groupNodes(collection: ListState<object>['collection']) {\n const groups: { section: Node<object> | null; items: Node<object>[] }[] = [];\n for (const node of collection) {\n if (node.type === 'section') {\n const items = [...collection.getChildren!(node.key)].filter((child) => child.type === 'item');\n groups.push({ section: node, items });\n continue;\n }\n const last = groups.at(-1);\n if (last?.section === null) last.items.push(node);\n else groups.push({ section: null, items: [node] });\n }\n return groups;\n}\n\n/** The name of a section's group: its `aria-label`, else its subheader. */\nfunction sectionNaming(section: { title?: ReactNode; 'aria-label'?: string }, headingId: string) {\n return section['aria-label'] != null\n ? { 'aria-label': section['aria-label'] }\n : { 'aria-labelledby': headingId };\n}\n\n/** A section of a plain list: a subheader and a nested list named by it. */\nfunction StaticSection({\n section,\n variant,\n classNames,\n children,\n}: {\n section: ListSectionProps;\n variant?: ListVariant | undefined;\n classNames?: ListClassNames | undefined;\n children: ReactNode;\n}) {\n const headingId = useId();\n const styles = listStyles({ variant, titled: section.title != null });\n return (\n <li\n data-slot=\"section\"\n className={styles.section({ class: cn(classNames?.section, section.className) })}\n >\n {section.title != null && (\n <div id={headingId} className={styles.subheader({ class: classNames?.subheader })}>\n {section.title}\n </div>\n )}\n <ul {...sectionNaming(section, headingId)} className={styles.group()}>\n {children}\n </ul>\n </li>\n );\n}\n\ntype InteractiveKind = 'grid' | 'listbox' | 'tree';\n\nfunction InteractiveList(props: ListProps & { expandable: boolean }) {\n return (\n <DomDirectionLocale>\n {(directionRef) => <CollectionList {...props} directionRef={directionRef} />}\n </DomDirectionLocale>\n );\n}\n\n/** Material Symbols \"check\" and \"expand_more\" (Apache-2.0). */\nfunction CheckIcon20() {\n return (\n <svg viewBox=\"0 -960 960 960\" fill=\"currentColor\" aria-hidden=\"true\" focusable=\"false\">\n <path d=\"M382-240 154-468l57-57 171 171 367-367 57 57-424 424Z\" />\n </svg>\n );\n}\n\nfunction ExpandMoreIcon() {\n return (\n <svg viewBox=\"0 -960 960 960\" aria-hidden=\"true\" focusable=\"false\">\n <path d=\"M480-345 240-585l56-56 184 184 184-184 56 56-240 240Z\" />\n </svg>\n );\n}\n\n/**\n * A grid list (`onAction`, links), a list box (selection) or a tree grid (`childItems`),\n * from React Aria's collection hooks. Arrow keys wrap at the ends, as M3 asks.\n */\nfunction CollectionList({\n expandable,\n variant,\n disabled,\n deselectable = true,\n classNames,\n className,\n style,\n ref,\n directionRef,\n ...rest\n}: ListProps & { expandable: boolean; directionRef: (element: HTMLElement | null) => void }) {\n const { root: data, rest: ariaProps } = splitRootProps(rest);\n assertCollectionChildren(rest.children, 'List', 'ListItem elements');\n const scan = useCollectionScan(rest.children);\n if (scan.items.some((item) => item.control != null)) throw new Error(CONTROL_ERROR);\n if (expandable && scan.sectioned) throw new Error(EXPANDABLE_SECTIONS_ERROR);\n const selectable = rest.selectionMode != null && rest.selectionMode !== 'none';\n // A selection list is a list box (M3: \"Container: List box · List item: Option\"); a list\n // whose items also act or link keeps the grid list's separate actions.\n const kind: InteractiveKind = expandable\n ? 'tree'\n : selectable && rest.onAction == null && !scan.items.some((item) => item.href != null)\n ? 'listbox'\n : 'grid';\n const disabledKeys = new Set<Key>(rest.disabledKeys ?? []);\n for (const [key, item] of scan.entries) {\n if (disabled || item.disabled) disabledKeys.add(key);\n }\n const options = {\n ...(ariaProps as unknown as AriaGridListProps<object>),\n disabledKeys: disabledKeys.size > 0 ? disabledKeys : rest.disabledKeys,\n disallowEmptySelection: !deselectable,\n // Disabled items stay focusable (WAI-ARIA APG, \"Focusability of disabled controls\"); each row\n // keeps only its focus handlers, so it can't be pressed, chosen, expanded or followed.\n ...FOCUSABLE_DISABLED_OPTIONS,\n shouldFocusWrap: true,\n };\n const root: CollectionRootProps = {\n options,\n listRef: ref,\n directionRef,\n data: { ...data, ...tokenAttributes(variant, data) },\n style,\n className: listStyles({ variant }).root({ class: cn(classNames?.root, className) }),\n variant,\n classNames,\n };\n if (kind === 'tree') return <TreeList {...root} />;\n if (kind === 'listbox') return <ListBoxList {...root} />;\n return <GridList {...root} />;\n}\n\ninterface CollectionRootProps {\n options: AriaGridListProps<object> & { shouldFocusWrap: boolean };\n listRef: Ref<HTMLElement> | undefined;\n directionRef: (element: HTMLElement | null) => void;\n data: Record<string, unknown>;\n style?: CSSProperties | undefined;\n className: string;\n variant?: ListVariant | undefined;\n classNames?: ListClassNames | undefined;\n}\n\nfunction GridList({\n options,\n listRef,\n directionRef,\n data,\n style,\n className,\n variant,\n classNames,\n}: CollectionRootProps) {\n const rootRef = useObjectRef(listRef as Ref<HTMLDivElement>);\n const state = useListState(options);\n const { gridProps } = useGridList(options, state, rootRef);\n // Arrow keys reveal a row at the nearest position, never centring the page on the list.\n useNearestReveal(rootRef);\n return (\n <div\n {...mergeProps(data, gridProps)}\n ref={(element) => {\n rootRef.current = element;\n directionRef(element);\n }}\n style={style}\n className={className}\n >\n {groupNodes(state.collection).map((group) => {\n const rows = group.items.map((node, index) => (\n <GridListRow\n key={node.key}\n node={node}\n state={state}\n variant={variant}\n classNames={classNames}\n position={position(index, group.items.length)}\n />\n ));\n return group.section ? (\n <GridListSection\n key={group.section.key}\n node={group.section}\n state={state}\n variant={variant}\n classNames={classNames}\n >\n {rows}\n </GridListSection>\n ) : (\n rows\n );\n })}\n </div>\n );\n}\n\n/**\n * A section of a grid list: a row group named by its subheader, a header row holding a row\n * header (React Aria's `GridListSection` structure), then the items' rows.\n */\nfunction GridListSection({\n node,\n state,\n variant,\n classNames,\n children,\n}: {\n node: Node<object>;\n state: ListState<object>;\n variant?: ListVariant | undefined;\n classNames?: ListClassNames | undefined;\n children: ReactNode;\n}) {\n const ref = useRef<HTMLDivElement>(null);\n const section = node.props as ListSectionProps;\n const { rowProps, rowHeaderProps, rowGroupProps } = useGridListSection(\n { 'aria-label': section['aria-label'] },\n state,\n ref,\n );\n const styles = listStyles({ variant, titled: section.title != null });\n return (\n <div\n {...rowGroupProps}\n {...(section['aria-label'] != null && { 'aria-labelledby': undefined })}\n ref={ref}\n className={styles.section({ class: cn(classNames?.section, section.className) })}\n >\n {section.title != null && (\n <div {...rowProps}>\n <div {...rowHeaderProps} className={styles.subheader({ class: classNames?.subheader })}>\n {section.title}\n </div>\n </div>\n )}\n <div role=\"presentation\" className={styles.group()}>\n {children}\n </div>\n </div>\n );\n}\n\n/** Compose's shape precedence: pressed, then selected or focused (16px), then hovered (12px). */\nfunction shapeOf(state: {\n isPressed: boolean;\n isSelected: boolean;\n isFocusVisible: boolean;\n isHovered: boolean;\n isDisabled: boolean;\n}) {\n if ((state.isPressed && !state.isDisabled) || state.isSelected || state.isFocusVisible) {\n return 'active';\n }\n return state.isHovered && !state.isDisabled ? 'hovered' : 'rest';\n}\n\n/** The check a selected item shows at its end, when the list selects and shows it. */\nfunction useSelectionCheck(\n styles: ReturnType<typeof listStyles>,\n selectable: boolean,\n className: string | undefined,\n): ReactNode {\n const { selectionIndicator = true } = useContext(ListOptionsContext);\n if (!selectable || !selectionIndicator) return null;\n return (\n <span\n aria-hidden=\"true\"\n data-selection-indicator=\"\"\n className={styles.selectionIndicator({ class: className })}\n >\n <CheckIcon20 />\n </span>\n );\n}\n\nfunction GridListRow({\n node,\n state,\n variant,\n classNames,\n position: itemPosition,\n}: {\n node: Node<object>;\n state: ListState<object>;\n variant?: ListVariant | undefined;\n classNames?: ListClassNames | undefined;\n position: string;\n}) {\n const item = node.props as ListItemProps;\n const ref = useRef<HTMLDivElement>(null);\n const {\n rowProps: ownRowProps,\n gridCellProps,\n descriptionProps,\n isPressed,\n isSelected,\n } = useGridListItem({ node }, state, ref);\n const isDisabled = state.disabledKeys.has(node.key);\n const rowProps = isDisabled ? focusOnly(ownRowProps) : ownRowProps;\n const { hoverProps, isHovered } = useHover({ isDisabled });\n const { interactionProps, dataAttributes } = useM3Interaction({ isDisabled, isPressed }, ref);\n const isFocusVisible = dataAttributes['data-focus-visible'] != null;\n const shape = shapeOf({ isPressed, isSelected, isFocusVisible, isHovered, isDisabled });\n const options = useContext(ListOptionsContext);\n const styles = itemStyles(item, variant, true, options);\n const check = useSelectionCheck(\n styles,\n state.selectionManager.selectionMode !== 'none',\n classNames?.selectionIndicator,\n );\n return (\n <div\n {...mergeProps(rowProps, hoverProps, interactionProps)}\n {...dataAttributes}\n aria-disabled={isDisabled || undefined}\n ref={ref}\n data-selected={isSelected || undefined}\n data-shape={shape}\n data-position={itemPosition}\n {...itemAttributes(variant)}\n className={styles.item({ class: cn(classNames?.item, item.className) })}\n >\n <div {...gridCellProps} className={styles.cell()}>\n <ItemContent\n item={item}\n styles={styles}\n classNames={classNames}\n ids={{ supporting: descriptionProps.id }}\n end={check}\n />\n </div>\n </div>\n );\n}\n\nconst FOCUSABLE = 'a[href], button, input, select, textarea, [tabindex]:not([tabindex=\"-1\"])';\n\n/**\n * A disabled item's props: its role, ARIA, id, tab index and focus handlers, but no press, key\n * or pointer handlers, so it takes focus (APG) and does nothing else.\n */\nfunction focusOnly<T extends object>(props: T): T {\n return Object.fromEntries(\n Object.entries(props).filter(\n ([name]) => !/^on[A-Z]/.test(name) || name === 'onFocus' || name === 'onBlur',\n ),\n ) as T;\n}\n\n/** A list box of options: M3's single- and multi-select lists on the web. */\nfunction ListBoxList({\n options,\n listRef,\n directionRef,\n data,\n style,\n className,\n variant,\n classNames,\n}: CollectionRootProps) {\n const rootRef = useObjectRef(listRef as Ref<HTMLDivElement>);\n const listBoxOptions = options as unknown as AriaListBoxOptions<object>;\n const state = useListState(listBoxOptions);\n const { listBoxProps } = useListBox(listBoxOptions, state, rootRef);\n useNearestReveal(rootRef);\n return (\n <div\n {...mergeProps(data, listBoxProps)}\n ref={(element) => {\n rootRef.current = element;\n directionRef(element);\n }}\n style={style}\n className={className}\n >\n {groupNodes(state.collection).map((group) => {\n const rows = group.items.map((node, index) => (\n <OptionRow\n key={node.key}\n node={node}\n state={state}\n variant={variant}\n classNames={classNames}\n position={position(index, group.items.length)}\n />\n ));\n return group.section ? (\n <ListBoxSection\n key={group.section.key}\n node={group.section}\n variant={variant}\n classNames={classNames}\n >\n {rows}\n </ListBoxSection>\n ) : (\n rows\n );\n })}\n </div>\n );\n}\n\n/** A section of a list box: a subheader and a group of options named by it. */\nfunction ListBoxSection({\n node,\n variant,\n classNames,\n children,\n}: {\n node: Node<object>;\n variant?: ListVariant | undefined;\n classNames?: ListClassNames | undefined;\n children: ReactNode;\n}) {\n const section = node.props as ListSectionProps;\n const { itemProps, headingProps, groupProps } = useListBoxSection({\n heading: section.title,\n 'aria-label': section['aria-label'],\n });\n const styles = listStyles({ variant, titled: section.title != null });\n return (\n <div\n {...itemProps}\n className={styles.section({ class: cn(classNames?.section, section.className) })}\n >\n {section.title != null && (\n <div {...headingProps} className={styles.subheader({ class: classNames?.subheader })}>\n {section.title}\n </div>\n )}\n <div\n {...groupProps}\n {...(section['aria-label'] != null && { 'aria-labelledby': undefined })}\n className={styles.group()}\n >\n {children}\n </div>\n </div>\n );\n}\n\nfunction OptionRow({\n node,\n state,\n variant,\n classNames,\n position: itemPosition,\n}: {\n node: Node<object>;\n state: ListState<object>;\n variant?: ListVariant | undefined;\n classNames?: ListClassNames | undefined;\n position: string;\n}) {\n const item = node.props as ListItemProps;\n const ref = useRef<HTMLDivElement>(null);\n const {\n optionProps: ownOptionProps,\n isPressed,\n isSelected,\n } = useOption({ key: node.key }, state, ref);\n const isDisabled = state.disabledKeys.has(node.key);\n const optionProps = isDisabled\n ? { ...focusOnly(ownOptionProps), 'aria-disabled': true }\n : ownOptionProps;\n const { hoverProps, isHovered } = useHover({ isDisabled });\n const { interactionProps, dataAttributes } = useM3Interaction({ isDisabled, isPressed }, ref);\n const isFocusVisible = dataAttributes['data-focus-visible'] != null;\n const shape = shapeOf({ isPressed, isSelected, isFocusVisible, isHovered, isDisabled });\n const options = useContext(ListOptionsContext);\n const styles = itemStyles(item, variant, true, options);\n const check = useSelectionCheck(styles, true, classNames?.selectionIndicator);\n useEffect(() => {\n if (process.env.NODE_ENV === 'production') return;\n const nested = ref.current?.querySelector(FOCUSABLE);\n if (nested) {\n console.warn(\n '[@windmorph/react] List: an item of a selection list is one option and must not hold ' +\n 'buttons, links or fields. Give the list onAction to keep separate trailing actions.',\n nested,\n );\n }\n });\n return (\n <div\n {...mergeProps(optionProps, hoverProps, interactionProps)}\n {...dataAttributes}\n // Named by its content: the overline, headline, supporting and trailing text in the\n // order they show, each read once. Naming it by the headline alone (React Aria's\n // default) leaves visible text out of its name (WCAG 2.5.3), and describing it by the\n // supporting text as well would read that twice. Select's options are named the same way.\n aria-labelledby={undefined}\n aria-describedby={undefined}\n ref={ref}\n data-selected={isSelected || undefined}\n data-shape={shape}\n data-position={itemPosition}\n {...itemAttributes(variant)}\n className={styles.item({ class: cn(classNames?.item, item.className) })}\n >\n <span className={styles.cell()}>\n <ItemContent item={item} styles={styles} classNames={classNames} end={check} />\n </span>\n </div>\n );\n}\n\n/** A tree grid: items with `childItems` expand and collapse to show their nested items. */\nfunction TreeList({\n options,\n listRef,\n directionRef,\n data,\n style,\n className,\n variant,\n classNames,\n}: CollectionRootProps) {\n const rootRef = useObjectRef(listRef as Ref<HTMLDivElement>);\n // `options` carries the list's `expandedKeys`, `defaultExpandedKeys` and `onExpandedChange`.\n const treeOptions = options as unknown as AriaTreeOptions<object> &\n Pick<ListProps, 'expandedKeys' | 'defaultExpandedKeys' | 'onExpandedChange'>;\n const state = useTreeState(treeOptions);\n const { gridProps } = useTree(treeOptions, state, rootRef);\n const rows = [...state.collection.getKeys()]\n .map((key) => state.collection.getItem(key))\n .filter((node): node is Node<object> => node?.type === 'item');\n const { shown, onExited, version } = useRowPresence(rows);\n // A press that opens an item while an open item above it folds keeps the pressed row\n // where it was: the page scrolls by the folded height as the rows close.\n const { capture, release } = useKeepPressedInPlace(\n '[role=row]',\n version,\n shown.some((row) => row.exiting),\n );\n const reveal = listStyles({ variant });\n return (\n <div\n {...mergeProps(data, gridProps, {\n onPointerDownCapture: capture,\n onKeyDownCapture: capture,\n onPointerUpCapture: release,\n onKeyUpCapture: release,\n onClickCapture: (event: MouseEvent<HTMLDivElement>) => {\n // A virtual click (assistive tech) presses with no pointer down before it.\n if (event.detail === 0) capture(event);\n release();\n },\n })}\n ref={(element) => {\n rootRef.current = element;\n directionRef(element);\n }}\n style={style}\n className={className}\n >\n {shown.map((row) => (\n <TreeRowReveal\n key={row.node.key}\n row={row}\n onExited={onExited}\n className={reveal.reveal()}\n clipClassName={reveal.revealClip()}\n >\n {row.exiting ? (\n <TreeRowGhost\n node={row.node}\n selectable={state.selectionManager.selectionMode !== 'none'}\n variant={variant}\n classNames={classNames}\n position={row.position}\n />\n ) : (\n <TreeRow\n node={row.node}\n state={state}\n variant={variant}\n classNames={classNames}\n position={row.position}\n />\n )}\n </TreeRowReveal>\n ))}\n </div>\n );\n}\n\n/** Whether the reader asks for reduced motion (read on a change, never on the server). */\nconst prefersReducedMotion = () =>\n typeof window !== 'undefined' &&\n (window.matchMedia?.('(prefers-reduced-motion: reduce)').matches ?? false);\n\n/** A tree row as shown: live, opening in, or gone from the tree and closing. */\ninterface ShownRow {\n node: Node<object>;\n position: string;\n /** Added after the tree first rendered (an item was expanded), so it opens in. */\n appear: boolean;\n /** No longer in the tree (its parent collapsed); shown until it has closed. */\n exiting: boolean;\n}\n\n/**\n * The rows to render: the tree's visible rows, plus rows that just left it (a collapsed\n * item's nested rows) in their old place until their closing transition ends. Rows added\n * after the first render are marked to open in.\n */\nfunction useRowPresence(rows: Node<object>[]) {\n const live = (node: Node<object>, index: number, appear: boolean): ShownRow => ({\n node,\n position: position(index, rows.length),\n appear,\n exiting: false,\n });\n const keys = rows.map((node) => node.key);\n const [presence, setPresence] = useState(() => ({\n keys,\n shown: rows.map((node, index) => live(node, index, false)),\n }));\n let { shown } = presence;\n // Follow the tree while rendering (no effect, no extra paint) whenever its rows change.\n // A collection can be rebuilt with the same rows, so they're compared by key.\n if (keys.length !== presence.keys.length || keys.some((key, i) => key !== presence.keys[i])) {\n const indexOf = new Map(rows.map((node, index) => [node.key, index]));\n const before = new Map(shown.map((row) => [row.node.key, row]));\n const next: ShownRow[] = [];\n let cursor = 0;\n const takeUpTo = (end: number) => {\n for (; cursor <= end; cursor += 1) {\n const node = rows[cursor]!;\n const previous = before.get(node.key);\n next.push(live(node, cursor, previous ? previous.appear : true));\n }\n };\n for (const row of shown) {\n const index = indexOf.get(row.node.key);\n if (index === undefined) next.push({ ...row, exiting: true });\n else if (index >= cursor) takeUpTo(index);\n }\n takeUpTo(rows.length - 1);\n // A switch under reduced motion (2026-10-17): when rows open while others leave, the\n // leaving ones go at once instead of holding their height while they fade, and the\n // opening ones appear at full height and fade in, so the rows below shift once, never\n // twice. A lone fold still fades where it is.\n const opening = next.some((row) => !row.exiting && !before.has(row.node.key));\n shown =\n opening && next.some((row) => row.exiting) && prefersReducedMotion()\n ? next.filter((row) => !row.exiting)\n : next;\n setPresence({ keys, shown });\n }\n const onExited = useCallback(\n (key: Key) =>\n setPresence((current) => ({\n ...current,\n shown: current.shown.filter((row) => !(row.exiting && row.node.key === key)),\n })),\n [],\n );\n // Live rows render the tree's current nodes; leaving rows keep their last ones.\n const current = new Map(rows.map((node) => [node.key, node]));\n return {\n shown: shown.map((row) => (row.exiting ? row : { ...row, node: current.get(row.node.key)! })),\n onExited,\n /** Changes whenever the rows shown change. */\n version: presence,\n };\n}\n\n/**\n * A tree row's wrapper, which opens its height and fades it in when the row appears, and\n * closes it when the row leaves, then lets it go. Nothing in a leaving row can be focused\n * or read.\n */\nfunction TreeRowReveal({\n row,\n onExited,\n className,\n clipClassName,\n children,\n}: {\n row: ShownRow;\n onExited: (key: Key) => void;\n className: string;\n clipClassName: string;\n children: ReactNode;\n}) {\n const ref = useRef<HTMLDivElement>(null);\n const { exiting, node } = row;\n useEffect(() => {\n if (!exiting) return;\n // Wait for the closing transitions, if any run (none without CSS or with no motion).\n const transitions = ref.current?.getAnimations?.() ?? [];\n if (transitions.length === 0) {\n onExited(node.key);\n return;\n }\n let current = true;\n void Promise.allSettled(transitions.map((transition) => transition.finished)).then(() => {\n if (current) onExited(node.key);\n });\n return () => {\n current = false;\n };\n }, [exiting, node.key, onExited]);\n return (\n <div\n ref={ref}\n data-appear={row.appear || undefined}\n data-exiting={exiting || undefined}\n inert={exiting || undefined}\n className={className}\n >\n <div className={clipClassName}>{children}</div>\n </div>\n );\n}\n\n/** A leaving row's picture while it closes: the row at rest, hidden from assistive tech. */\nfunction TreeRowGhost({\n node,\n selectable,\n variant,\n classNames,\n position: itemPosition,\n}: {\n node: Node<object>;\n selectable: boolean;\n variant?: ListVariant | undefined;\n classNames?: ListClassNames | undefined;\n position: string;\n}) {\n const item = node.props as ListItemProps;\n const options = useContext(ListOptionsContext);\n const styles = listStyles({\n ...itemStylesOptions(item, variant, true, options),\n nested: node.level > 0,\n });\n const check = useSelectionCheck(styles, selectable, classNames?.selectionIndicator);\n const chevron = node.hasChildNodes && (\n <span className={styles.expand({ class: classNames?.expandButton })}>\n <ExpandMoreIcon />\n </span>\n );\n return (\n <div\n aria-hidden=\"true\"\n style={{ '--m3-list-level': node.level } as CSSProperties}\n data-shape=\"rest\"\n data-position={itemPosition}\n {...itemAttributes(variant)}\n className={styles.item({ class: cn(classNames?.item, item.className) })}\n >\n <div className={styles.cell()}>\n <ItemContent\n item={item}\n styles={styles}\n classNames={classNames}\n end={\n check || chevron ? (\n <>\n {check}\n {chevron}\n </>\n ) : null\n }\n />\n </div>\n </div>\n );\n}\n\ntype TreeCollection = TreeState<object>['collection'] & {\n getChildren?: (key: Key) => Iterable<Node<object>>;\n};\n\n/**\n * React Aria's tree item reads a row's siblings (for `aria-posinset` and `aria-setsize`)\n * through `collection.getChildren` and each sibling's `nextKey`, which React Stately's\n * `TreeCollection` doesn't provide: its `nextKey` and `index` follow the visible rows, as\n * keyboard navigation needs. While the row's hook runs, this gives the collection the\n * nested items' own order, and the returned function restores it. React Aria keys its\n * per-list data by the state object, so the state itself has to be the one patched.\n */\nfunction withSiblingOrder(state: TreeState<object>, node: Node<object>) {\n const collection = state.collection as TreeCollection;\n const visibleItem = collection.getItem.bind(collection);\n const siblingsOf = (parentKey: Key | null | undefined) =>\n (parentKey == null ? [...collection] : [...(visibleItem(parentKey)?.childNodes ?? [])]).filter(\n (sibling) => sibling.type === 'item',\n );\n const inSiblingOrder = (item: Node<object>): Node<object> => {\n const siblings = siblingsOf(item.parentKey);\n const index = siblings.findIndex((sibling) => sibling.key === item.key);\n return { ...item, index, nextKey: siblings[index + 1]?.key ?? null };\n };\n collection.getItem = (key: Key) => {\n const item = visibleItem(key);\n return item ? inSiblingOrder(item) : null;\n };\n collection.getChildren = (key: Key) => siblingsOf(key).map(inSiblingOrder);\n return {\n node: inSiblingOrder(node),\n restore: () => {\n delete (collection as Partial<TreeCollection>).getItem;\n delete collection.getChildren;\n },\n };\n}\n\nfunction ExpandButton({ props, className }: { props: AriaButtonProps; className: string }) {\n const ref = useRef<HTMLButtonElement>(null);\n const { buttonProps, isPressed } = useButton(props, ref);\n const { interactionProps, dataAttributes } = useM3Interaction(\n { isDisabled: props.isDisabled, isPressed },\n ref,\n );\n return (\n <button\n {...mergeProps(buttonProps, interactionProps)}\n {...dataAttributes}\n ref={ref}\n className={className}\n >\n {/* 48px, but never taller than a one-line item (44px at density -3), so it stays in its row. */}\n <TouchTarget className=\"h-[min(48px,calc(56px+var(--md-sys-density,0)*4px))]\" />\n <ExpandMoreIcon />\n </button>\n );\n}\n\nfunction TreeRow({\n node,\n state,\n variant,\n classNames,\n position: itemPosition,\n}: {\n node: Node<object>;\n state: TreeState<object>;\n variant?: ListVariant | undefined;\n classNames?: ListClassNames | undefined;\n position: string;\n}) {\n const item = node.props as ListItemProps;\n const ref = useRef<HTMLDivElement>(null);\n const siblingOrder = withSiblingOrder(state, node);\n const { rowProps, gridCellProps, descriptionProps, expandButtonProps, isPressed, isSelected } =\n useTreeItem({ node: siblingOrder.node, hasChildItems: node.hasChildNodes }, state, ref);\n siblingOrder.restore();\n const isDisabled = state.disabledKeys.has(node.key);\n const { hoverProps, isHovered } = useHover({ isDisabled });\n const { interactionProps, dataAttributes } = useM3Interaction({ isDisabled, isPressed }, ref);\n const isFocusVisible = dataAttributes['data-focus-visible'] != null;\n const shape = shapeOf({ isPressed, isSelected, isFocusVisible, isHovered, isDisabled });\n const options = useContext(ListOptionsContext);\n const styles = listStyles({\n ...itemStylesOptions(item, variant, true, options),\n nested: node.level > 0,\n });\n const check = useSelectionCheck(\n styles,\n state.selectionManager.selectionMode !== 'none',\n classNames?.selectionIndicator,\n );\n // Only a check or a chevron makes a trailing cell (and its 12px gap).\n const end =\n check != null || node.hasChildNodes ? (\n <>\n {check}\n {node.hasChildNodes && (\n <ExpandButton\n props={{ ...expandButtonProps, isDisabled }}\n className={styles.expand({ class: classNames?.expandButton })}\n />\n )}\n </>\n ) : null;\n return (\n <div\n {...mergeProps(isDisabled ? focusOnly(rowProps) : rowProps, hoverProps, interactionProps)}\n {...dataAttributes}\n aria-disabled={isDisabled || undefined}\n ref={ref}\n style={{ '--m3-list-level': node.level } as CSSProperties}\n data-selected={isSelected || undefined}\n data-shape={shape}\n data-position={itemPosition}\n {...itemAttributes(variant)}\n className={styles.item({ class: cn(classNames?.item, item.className) })}\n >\n <div {...gridCellProps} className={styles.cell()}>\n <ItemContent\n item={item}\n styles={styles}\n classNames={classNames}\n ids={{ supporting: descriptionProps.id }}\n end={end}\n />\n </div>\n </div>\n );\n}\n\n/**\n * The items of an interactive list's collection, as React Stately's collection builder reads\n * them (each entry describes itself through `getCollectionNode`), top-level and in sections,\n * and whether it has sections. The list picks its kind and its disabled keys from these.\n */\nfunction useCollectionScan(children: ReactNode) {\n const { collection } = useListState<object>({\n children: children as AriaGridListProps<object>['children'],\n });\n return useMemo(() => {\n const entries: [Key, ListItemProps][] = [];\n let sectioned = false;\n for (const node of collection) {\n if (node.type === 'section') {\n sectioned = true;\n for (const child of collection.getChildren!(node.key)) {\n if (child.type === 'item') entries.push([child.key, child.props as ListItemProps]);\n }\n } else if (node.type === 'item') {\n entries.push([node.key, node.props as ListItemProps]);\n }\n }\n return { entries, items: entries.map(([, item]) => item), sectioned };\n }, [collection]);\n}\n\n/** Ids that name an item that is a control (its headline) and describe it (the rest). */\nfunction useItemIds(item: ListItemProps) {\n const id = useId();\n const ids: ItemIds = {\n headline: `${id}-headline`,\n ...(item.overline != null && { overline: `${id}-overline` }),\n ...(item.supportingText != null && { supporting: `${id}-supporting` }),\n };\n const described = [ids.overline, ids.supporting].filter(Boolean).join(' ');\n const naming =\n item['aria-label'] != null\n ? { 'aria-label': item['aria-label'] }\n : { 'aria-labelledby': ids.headline };\n return { ids, naming: { ...naming, ...(described && { 'aria-describedby': described }) } };\n}\n\ninterface ToggleItemProps {\n item: ListItemProps;\n control: 'switch' | 'checkbox';\n variant?: ListVariant;\n classNames?: ListClassNames;\n position: string;\n listDisabled?: boolean;\n}\n\n/** A switch or checkbox item: a visually hidden native input, the item as its label. */\nfunction ToggleItem({ item, control, listDisabled, ...view }: ToggleItemProps) {\n const inputRef = useRef<HTMLInputElement>(null);\n const { ids, naming } = useItemIds(item);\n const isDisabled = Boolean(listDisabled || item.disabled);\n const options: AriaCheckboxProps = {\n ...naming,\n children: item.children,\n isSelected: item.checked,\n defaultSelected: item.defaultChecked,\n onChange: item.onCheckedChange,\n isDisabled,\n name: item.name,\n value: item.value,\n };\n const state = useToggleState(options);\n const { inputProps, labelProps, isSelected, isPressed } = useCheckbox(options, state, inputRef);\n return (\n <ControlItem\n {...view}\n item={item}\n ids={ids}\n kind={control}\n // A native checkbox with the switch role, as React Aria's `useSwitch` renders it.\n inputProps={control === 'switch' ? { ...inputProps, role: 'switch' } : inputProps}\n inputRef={inputRef}\n labelProps={labelProps}\n isSelected={isSelected}\n isDisabled={isDisabled}\n isPressed={isPressed}\n placement={item.controlPlacement ?? (control === 'switch' ? 'end' : 'start')}\n />\n );\n}\n\nfunction RadioList({\n variant,\n classNames,\n className,\n style,\n ref,\n value,\n defaultValue,\n onChange,\n name,\n required,\n disabled,\n controlPlacement = 'start',\n entries,\n ...rest\n}: ListProps & { entries: ReactElement[] }) {\n const { root: data } = splitRootProps(rest);\n const { 'aria-label': label, 'aria-labelledby': labelledBy } = rest as {\n 'aria-label'?: string;\n 'aria-labelledby'?: string;\n };\n const options: AriaRadioGroupProps = {\n id: rest.id,\n 'aria-label': label,\n 'aria-labelledby': labelledBy,\n value,\n defaultValue,\n onChange,\n name,\n isRequired: required,\n isDisabled: disabled,\n };\n const state = useRadioGroupState(options);\n const { radioGroupProps } = useRadioGroup(options, state);\n return (\n <div\n {...mergeProps(data, radioGroupProps)}\n {...tokenAttributes(variant, data)}\n ref={ref as Ref<HTMLDivElement>}\n style={style}\n className={listStyles({ variant }).root({ class: cn(classNames?.root, className) })}\n >\n <RadioListContext value={{ state, variant, classNames, controlPlacement }}>\n {entries.map((entry, index) => (\n <ListEntryContext\n key={entry.key ?? index}\n value={{\n index,\n position: position(index, entries.length),\n inSection: false,\n disabled: false,\n }}\n >\n {entry}\n </ListEntryContext>\n ))}\n </RadioListContext>\n </div>\n );\n}\n\n/** What a radio list hands its items. */\ninterface RadioListValue {\n state: RadioGroupState;\n variant?: ListVariant | undefined;\n classNames?: ListClassNames | undefined;\n controlPlacement: ControlPlacement;\n}\n\nconst RadioListContext = createContext<RadioListValue | null>(null);\n\n/** An item of a radio list: a radio button with the item's `value`. */\nfunction RadioListItem({\n item,\n radio,\n position: itemPosition,\n}: {\n item: ListItemProps;\n radio: RadioListValue;\n position: string;\n}) {\n if (item.value == null || item.control != null || item.href != null) {\n throw new Error(RADIO_ITEM_ERROR);\n }\n return (\n <RadioItem\n item={item}\n state={radio.state}\n variant={radio.variant}\n classNames={radio.classNames}\n position={itemPosition}\n placement={item.controlPlacement ?? radio.controlPlacement}\n />\n );\n}\n\nfunction RadioItem({\n item,\n state,\n placement,\n ...view\n}: {\n item: ListItemProps;\n state: RadioGroupState;\n variant?: ListVariant;\n classNames?: ListClassNames;\n position: string;\n placement: ControlPlacement;\n}) {\n const inputRef = useRef<HTMLInputElement>(null);\n const { ids, naming } = useItemIds(item);\n const { inputProps, labelProps, isSelected, isDisabled, isPressed } = useRadio(\n { ...naming, children: item.children, value: item.value ?? '', isDisabled: item.disabled },\n state,\n inputRef,\n );\n return (\n <ControlItem\n {...view}\n item={item}\n ids={ids}\n kind=\"radio\"\n inputProps={inputProps}\n inputRef={inputRef}\n labelProps={labelProps}\n isSelected={isSelected}\n isDisabled={isDisabled}\n isPressed={isPressed}\n placement={placement}\n />\n );\n}\n\n/**\n * An item that is a switch, checkbox or radio button (Compose's toggleable and selectable\n * `ListItem`s): the item is the input's `<label>`, so pressing anywhere on it changes it,\n * with the list item's state layer and shapes. The drawn control shows the state; an item\n * that's on also takes the selected colours and shape unless it's a switch, or it sets\n * `selectedWhenChecked`.\n */\nfunction ControlItem({\n item,\n ids,\n kind,\n inputProps,\n inputRef,\n labelProps,\n isSelected,\n isDisabled,\n isPressed,\n placement,\n variant,\n classNames,\n position: itemPosition,\n}: {\n item: ListItemProps;\n ids: ItemIds;\n kind: 'switch' | 'checkbox' | 'radio';\n inputProps: InputHTMLAttributes<HTMLInputElement>;\n inputRef: RefObject<HTMLInputElement | null>;\n labelProps: LabelHTMLAttributes<HTMLLabelElement>;\n isSelected: boolean;\n isDisabled: boolean;\n isPressed: boolean;\n placement: ControlPlacement;\n variant?: ListVariant;\n classNames?: ListClassNames;\n position: string;\n}) {\n const ref = useRef<HTMLLabelElement>(null);\n const hiddenInputRef = useMemo(() => mergeRefs(inputRef, preventHiddenInputScroll), [inputRef]);\n // A switch row that's on stays plain, as a settings row; Compose's look is an opt-in.\n const looksSelected = isSelected && (item.selectedWhenChecked ?? kind !== 'switch');\n const { interactionProps, dataAttributes, state } = useM3Interaction(\n { isDisabled, isPressed, isSelected: looksSelected, within: true },\n ref,\n );\n // Compose's shape precedence: pressed, then selected or focused (16px), then hovered (12px).\n const shape =\n (isPressed && !isDisabled) || looksSelected || state.isFocusVisible\n ? 'active'\n : state.isHovered && !isDisabled\n ? 'hovered'\n : 'rest';\n const options = useContext(ListOptionsContext);\n const styles = itemStyles(item, variant, true, options);\n const controlState = {\n 'data-checked': isSelected || undefined,\n 'data-disabled': isDisabled || undefined,\n };\n return (\n <label\n {...mergeProps(labelProps, interactionProps)}\n {...dataAttributes}\n ref={ref}\n data-checked={isSelected || undefined}\n data-shape={shape}\n data-position={itemPosition}\n {...itemAttributes(variant)}\n className={styles.item({ class: cn(classNames?.item, item.className) })}\n >\n <VisuallyHidden elementType=\"span\">\n <input {...inputProps} ref={hiddenInputRef} />\n </VisuallyHidden>\n <span className={styles.cell()}>\n <ItemContent\n item={item}\n styles={styles}\n classNames={classNames}\n ids={ids}\n controlPlacement={placement}\n textHidden\n control={\n <span\n {...controlState}\n aria-hidden=\"true\"\n className={styles.control({ class: classNames?.control })}\n >\n {kind === 'radio' && <RadioRing />}\n {kind === 'checkbox' && <CheckboxBox />}\n {kind === 'switch' && <SwitchTrack selected={isSelected} icons={item.switchIcons} />}\n </span>\n }\n />\n </span>\n </label>\n );\n}\n\n/** A switch's track and thumb, at rest (the item, not the switch, takes the interaction). */\nfunction SwitchTrack({ selected, icons }: { selected: boolean; icons?: boolean }) {\n const styles = switchStyles();\n const icon = icons ? selected ? <CheckIcon /> : <CloseIcon /> : null;\n const { size, center } = thumbGeometry(selected, false, Boolean(icon));\n return (\n <span\n // The switch's component tokens, resolved on its track as on a Switch.\n data-tokens=\"md-comp-switch\"\n data-slot=\"track\"\n className={styles.control()}\n style={\n { '--m3-thumb-size': `${size}px`, '--m3-thumb-center': `${center}px` } as CSSProperties\n }\n >\n <SwitchThumb styles={styles} icon={icon} />\n </span>\n );\n}\n\n/**\n * The `ListItem` elements, flattened from arrays, with the keys they were given. `Children`\n * also unwraps lazy elements, which a server component's items can arrive as (Next's dev\n * server sends some that way), so they're never dropped from the server render.\n */\nfunction listItems(children: ReactNode): ReactElement<ListItemProps>[] {\n const items: ReactElement<ListItemProps>[] = [];\n Children.forEach(children, (node) => {\n if (isValidElement<ListItemProps>(node)) items.push(node);\n });\n return items;\n}\n\n/**\n * A link item: the item holds a real `<a>` on its headline, whose overlay covers the whole\n * item, so the item is the link (the browser's link menu and modified clicks included)\n * while buttons in its leading or trailing content stay separate controls, never nested in\n * the link. The link is named by the headline and described by the overline and supporting\n * text. React Aria's `useLink` routes a plain click through the `RouterProvider`; a disabled\n * item has no `href`.\n */\nfunction LinkItem({\n item,\n variant,\n classNames,\n position: itemPosition,\n isDisabled,\n}: {\n item: ListItemProps;\n variant?: ListVariant;\n classNames?: ListClassNames;\n position: string;\n isDisabled: boolean;\n}) {\n const itemRef = useRef<HTMLLIElement>(null);\n const linkRef = useRef<HTMLAnchorElement>(null);\n const { ids, naming } = useItemIds(item);\n const href = isDisabled ? undefined : item.href;\n const { linkProps, isPressed } = useLink(\n { href, target: item.target, isDisabled, elementType: 'a' },\n linkRef,\n );\n const { focusProps, isFocusVisible } = useFocusRing();\n const current = Boolean(item.current);\n const { interactionProps, dataAttributes, state } = useM3Interaction(\n { isDisabled, isPressed, isSelected: current },\n itemRef,\n );\n // Compose's shape precedence: pressed, then selected or focused (16px), then hovered (12px).\n const shape =\n (isPressed && !isDisabled) || current || isFocusVisible\n ? 'active'\n : state.isHovered && !isDisabled\n ? 'hovered'\n : 'rest';\n const options = useContext(ListOptionsContext);\n const styles = itemStyles(item, variant, true, options);\n const rel = item.rel ?? (item.target === '_blank' ? 'noopener noreferrer' : undefined);\n return (\n <li\n {...interactionProps}\n {...dataAttributes}\n // The link's focus, not a control's in the trailing content, focuses the item.\n data-focused={isFocusVisible || undefined}\n data-focus-visible={isFocusVisible || undefined}\n ref={itemRef}\n data-list-entry=\"\"\n data-shape={shape}\n data-position={itemPosition}\n {...itemAttributes(variant)}\n className={styles.item({ class: cn('relative', classNames?.item, item.className) })}\n >\n <span className={styles.cell()}>\n <ItemContent\n item={item}\n styles={styles}\n classNames={classNames}\n ids={ids}\n sideClassName={styles.raised()}\n headline={(children) => (\n <a\n {...mergeProps(linkProps, focusProps)}\n {...naming}\n ref={linkRef}\n href={href}\n target={item.target}\n rel={rel}\n download={item.download}\n aria-current={current ? 'page' : undefined}\n data-list-link=\"\"\n className={styles.link()}\n >\n {children}\n </a>\n )}\n />\n </span>\n </li>\n );\n}\n"],"mappings":"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"}
|
|
@@ -18,33 +18,33 @@ const listStyles = tv({
|
|
|
18
18
|
cell: "grid w-full grid-cols-[auto_minmax(0,1fr)_auto]",
|
|
19
19
|
leading: [
|
|
20
20
|
"col-start-1 me-[12px] flex items-center gap-x-[12px] text-title-medium text-[color:var(--_md-comp-list-list-item-leading-icon-color)] [&>svg]:size-[20px]",
|
|
21
|
-
"group-data-selected/list-item:text-
|
|
21
|
+
"group-data-selected/list-item:text-[color:var(--_md-comp-list-list-item-selected-leading-icon-color)]",
|
|
22
22
|
"group-data-disabled/list-item:text-on-surface/38"
|
|
23
23
|
],
|
|
24
24
|
text: "col-start-2 flex min-w-0 flex-col",
|
|
25
25
|
overline: [
|
|
26
26
|
"text-label-small text-[color:var(--_md-comp-list-list-item-overline-color)]",
|
|
27
|
-
"group-data-selected/list-item:text-
|
|
27
|
+
"group-data-selected/list-item:text-[color:var(--_md-comp-list-list-item-selected-overline-color)]",
|
|
28
28
|
"group-data-disabled/list-item:text-on-surface/38"
|
|
29
29
|
],
|
|
30
30
|
headline: [
|
|
31
31
|
"text-body-large text-[color:var(--_md-comp-list-list-item-label-text-color)]",
|
|
32
|
-
"group-data-selected/list-item:text-
|
|
32
|
+
"group-data-selected/list-item:text-[color:var(--_md-comp-list-list-item-selected-label-text-color)]",
|
|
33
33
|
"group-data-disabled/list-item:text-on-surface/38"
|
|
34
34
|
],
|
|
35
35
|
supporting: [
|
|
36
36
|
"text-body-medium text-[color:var(--_md-comp-list-list-item-supporting-text-color)]",
|
|
37
|
-
"group-data-selected/list-item:text-
|
|
37
|
+
"group-data-selected/list-item:text-[color:var(--_md-comp-list-list-item-selected-supporting-text-color)]",
|
|
38
38
|
"group-data-disabled/list-item:text-on-surface/38"
|
|
39
39
|
],
|
|
40
40
|
trailing: [
|
|
41
41
|
"col-start-3 ms-[12px] flex items-center gap-x-[12px] text-label-small text-[color:var(--_md-comp-list-list-item-trailing-icon-color)] [&>svg]:size-[20px]",
|
|
42
|
-
"group-data-selected/list-item:text-
|
|
42
|
+
"group-data-selected/list-item:text-[color:var(--_md-comp-list-list-item-selected-trailing-icon-color)]",
|
|
43
43
|
"group-data-disabled/list-item:text-on-surface/38"
|
|
44
44
|
],
|
|
45
45
|
selectionIndicator: [
|
|
46
46
|
"inline-flex size-[20px] shrink-0 items-center justify-center opacity-0 [&>svg]:size-full",
|
|
47
|
-
"group-data-selected/list-item:opacity-100 group-data-selected/list-item:text-
|
|
47
|
+
"group-data-selected/list-item:opacity-100 group-data-selected/list-item:text-[color:var(--_md-comp-list-list-item-selected-trailing-icon-color)]",
|
|
48
48
|
"transition-opacity duration-(--md-sys-motion-spring-effects-fast-duration) ease-(--md-sys-motion-spring-effects-fast-easing)"
|
|
49
49
|
],
|
|
50
50
|
expand: [
|