@kanso-labs/react-native-kanso-ui 0.8.0 → 0.10.0

package/dist/components/list/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["ReactElement","ReactNode","Ref","AccessibilityActionEvent","ColorValue","GestureResponderEvent","HostInstance","ListRenderItemInfo","PressableProps","ScrollViewProps","StyleProp","TextStyle","ViewStyle","Key","Node","Selection","SelectionMode","ListState","ListProps","StatelyListProps","Children","createContext","use","useEffect","useMemo","useRef","AccessibilityInfo","FlatList","Text","NativeText","Platform","Pressable","StyleSheet","View","useListState","AutocompleteValue","ResolvedTheme","AutocompleteContext","toggleState","CheckboxBox","resultsFor","useLocaleOf","useMessages","hitSlop","usePressFeedback","hasContent","RowContent","rowContentColor","rowStyleOf","rowStyles","useTheme","composeStyles","themedStyles","useTypeRole","ProgressIndicator","BOX_SLOT","LOADING_DIAMETER","LOAD_OFFSET","IDLE","ListLoadMoreProps","styles","create","box","alignItems","height","justifyContent","width","idle","status","overflow","pointerEvents","position","stylesOf","colors","sizing","spacing","content","paddingVertical","sm","empty","color","onSurfaceVariant","header","paddingBottom","xxs","paddingHorizontal","lg","paddingTop","lead","flexDirection","gap","list","backgroundColor","surface","loading","minHeight","rowSm","onSurface","ListEntry","kind","node","isLoading","label","onLoadMore","scrollOffset","style","testID","Omit","children","item","T","defaultSelectedKeys","Iterable","disabledKeys","disallowEmptySelection","items","onAction","key","onSelectionChange","keys","ref","renderEmptyState","selectedKeys","selectionMode","selectLabel","ListRowProps","id","isDisabled","leading","overline","supporting","textValue","trailing","ListSectionProps","ListValue","ground","loadMore","state","ListContext","List","t0","$","_c","contentContainerStyle","keyboardShouldPersistTaps","props","t1","t2","undefined","emptyState","theme","own","autocomplete","matches","t3","filterOf","filter","t4","t5","t6","entriesOf","entries","loader","rows","sticky","listStyle","messages","t7","flatten","t8","select","t9","value","T0","T1","t10","t11","t12","EmptyState","t13","LoaderRow","t14","loadMoreOf","t15","t16","keyOf","renderEntry","t17","t18","ListLoadMore","_props","getCollectionNode","hasChildNodes","rendered","type","ListRow","ListSection","forEach","child","push","childNodes","element","EmptyRow","headline","noResults","useList","collection","length","getChildren","row","nodes","keptOf","kept","some","String","ListRowNode","onBlur","onFocus","onHoverIn","onHoverOut","onLongPress","onPress","onPressIn","onPressOut","_id","_isDisabled","_textValue","selectionManager","action","acts","checks","disabled","selectable","selected","canSelectItem","isSelected","listAction","isEmpty","feedback","withBox","lines","Symbol","for","bb0","rowStyle","accessibilityActions","name","onAccessibilityAction","selectionActionOf","handlers","pressThen","noop","ring","layer","loadingMore","useLoadingAnnouncement","then","event","ResultsStatus","count","locale","message","useResultsAnnouncement","OS","SectionHeader","title","SelectBox","drawn","nativeEvent","actionName","Error","was","current","announceForAccessibility","Item","LoadMore","Section","_c","NativeText"],"sources":["../../../src/components/list/index.tsx"],"sourcesContent":["import type { ReactElement, ReactNode, Ref } from 'react'\nimport type {\n  AccessibilityActionEvent,\n  ColorValue,\n  GestureResponderEvent,\n  HostInstance,\n  ListRenderItemInfo,\n  PressableProps,\n  ScrollViewProps,\n  StyleProp,\n  TextStyle,\n  ViewStyle,\n} from 'react-native'\nimport type { Key, Node, Selection, SelectionMode } from 'react-stately'\nimport type {\n  ListState,\n  ListProps as StatelyListProps,\n} from 'react-stately/useListState'\n\nimport { Children, createContext, use, useEffect, useMemo, useRef } from 'react'\nimport {\n  AccessibilityInfo,\n  FlatList,\n  Text as NativeText,\n  Platform,\n  Pressable,\n  StyleSheet,\n  View,\n} from 'react-native'\nimport { useListState } from 'react-stately/useListState'\n\nimport type { AutocompleteValue } from '../../autocomplete'\nimport type { ResolvedTheme } from '../../theme/scope'\n\nimport { AutocompleteContext } from '../../autocomplete'\nimport { toggleState } from '../../button'\nimport { CheckboxBox } from '../../control/checkbox-box'\nimport { resultsFor } from '../../i18n'\nimport { useLocaleOf, useMessages } from '../../i18n/provider'\nimport { hitSlop, usePressFeedback } from '../../press'\nimport {\n  hasContent,\n  RowContent,\n  rowContentColor,\n  rowStyleOf,\n  rowStyles,\n} from '../../row'\nimport { useTheme } from '../../theme/scope'\nimport { composeStyles, themedStyles } from '../../theme/styles'\nimport { useTypeRole } from '../../typography/roles'\nimport { ProgressIndicator } from '../progress-indicator'\n\n// kanso-ui's List, from the lists page: a column of the rows ListItem draws,\n// shared through src/row, with selection, an action per row, sections and a\n// row that loads more. It is a `FlatList`, so a long list draws the rows in\n// view and a few screens either side rather than every row it holds.\n//\n// Four things differ from web's, each because a screen reader or a touch on\n// a phone works differently from a keyboard in a browser.\n//\n// **A row is one element to a screen reader.** Web's row is a grid row whose\n// checkbox is a cell a keyboard reaches on its own. VoiceOver and TalkBack\n// read a pressable row as one element and reach nothing inside it, so the\n// row is a button that reports whether it is selected, and selecting it is an\n// accessibility action named by `selectLabel`, which is what web's checkbox\n// is named by. The checkbox is drawn for the eye and hidden from the reader.\n// Under React Native Web the row reports itself pressed instead, as a toggle\n// button does, since a button cannot be selected there.\n//\n// **A press does what React Aria's touch press does.** On a row that selects\n// and has no action, a press selects it. On one with an action, a press runs\n// the action while nothing is selected and selects once something is, and a\n// long press selects; a press on the checkbox selects either way.\n//\n// **Sections are flattened, with sticky headers.** A `FlatList` holds one\n// column of cells, so a section is its header, which stays at the top while\n// its rows scroll under it, and then its rows. The header is a heading to a\n// screen reader rather than the name of a group.\n//\n// **The list is drawn on surface,** the lists page's container colour, which\n// web leaves to the page. A sticky header needs a ground to cover the rows\n// scrolling under it, and it takes the list's, so a `style` giving the list\n// another background gives its headers the same one.\n\n// A checkbox drawn in a row sits in a slot an icon's size, the lists page's\n// 24dp, rather than in the 40dp state layer Checkbox draws it in.\nconst BOX_SLOT = 24\n\n// The ring the loading row draws, a row's icon across.\nconst LOADING_DIAMETER = '24px'\n\n// How far past the visible end of the list `onLoadMore` is called, as a\n// share of the list's visible height, as web's `scrollOffset` defaults.\nconst LOAD_OFFSET = 1\n\n// What the loading row reads when the list has no `List.LoadMore`, which\n// leaves it nothing to draw.\nconst IDLE: ListLoadMoreProps = {}\n\nconst styles = StyleSheet.create({\n  box: {\n    alignItems: 'center',\n    height: BOX_SLOT,\n    justifyContent: 'center',\n    width: BOX_SLOT,\n  },\n  // What `List.LoadMore` leaves while nothing is loading: the live region,\n  // with nothing in it and no height.\n  idle: {\n    height: 0,\n  },\n  // The count a search leaves, which a screen reader hears and no one sees:\n  // out of the flow, and a point across, as web's visually hidden status is.\n  status: {\n    height: 1,\n    overflow: 'hidden',\n    pointerEvents: 'none',\n    position: 'absolute',\n    width: 1,\n  },\n})\n\nconst stylesOf = themedStyles(({ colors, sizing, spacing }: ResolvedTheme) =>\n  StyleSheet.create({\n    // The 8dp above the first row and below the last, as web's container\n    // draws them.\n    content: {\n      paddingVertical: spacing.sm,\n    },\n    empty: {\n      color: colors.onSurfaceVariant,\n    },\n    // The lists page's subhead: title small in on surface variant, at the\n    // row's inline padding so it lines up with the headlines under it, with\n    // more room above than below so it reads as belonging to what follows.\n    header: {\n      color: colors.onSurfaceVariant,\n      paddingBottom: spacing.xxs,\n      paddingHorizontal: spacing.lg,\n      paddingTop: spacing.lg,\n    },\n    // The checkbox beside whatever the row's leading slot was given, a\n    // row's own gap apart.\n    lead: {\n      alignItems: 'center',\n      flexDirection: 'row',\n      gap: spacing.lg,\n    },\n    list: {\n      backgroundColor: colors.surface,\n    },\n    // A row's height for the ring, so the list does not jump when the next\n    // items land.\n    loading: {\n      alignItems: 'center',\n      justifyContent: 'center',\n      minHeight: sizing.rowSm,\n    },\n    // Never seen, but in a pair that reads, for a checker that looks.\n    status: {\n      color: colors.onSurface,\n    },\n  }),\n)\n\n/** One cell of the `FlatList`: a section's header, or a row. */\ntype ListEntry = {\n  readonly kind: 'header' | 'item'\n  readonly node: Node<unknown>\n}\n\ntype ListLoadMoreProps = {\n  /**\n   * Draws the ring in a row of its own while more items are being fetched.\n   * @default false\n   */\n  readonly isLoading?: boolean\n  /**\n   * What a screen reader calls the ring, and hears as it appears. Left out,\n   * it is the word for it in the `I18nProvider`'s language, or the device's\n   * outside one, \"Loading more\" in English.\n   */\n  readonly label?: string\n  /**\n   * Called when the end of the list comes within `scrollOffset` of its\n   * visible end, while nothing is loading. Called once for each length the\n   * list reaches, so a load that adds nothing does not start another.\n   */\n  readonly onLoadMore?: () => void\n  /**\n   * How far past the visible end of the list the next items are asked for,\n   * as a share of the list's visible height.\n   * @default 1\n   */\n  readonly scrollOffset?: number\n  readonly style?: StyleProp<ViewStyle>\n  readonly testID?: string\n}\n\ntype ListProps<T extends object = object> = Omit<\n  ScrollViewProps,\n  'children' | 'role' | 'stickyHeaderIndices' | 'style'\n> & {\n  /**\n   * The rows, each a `List.Item`, `List.Section` or `List.LoadMore`. With\n   * `items`, a function from an item to its part, called for each item in\n   * turn.\n   */\n  readonly children?: ((item: T) => ReactElement) | ReactNode\n  /** The keys selected at first, when the list keeps its own selection. */\n  readonly defaultSelectedKeys?: 'all' | Iterable<Key>\n  /** The keys of the rows drawn disabled, which take no presses. */\n  readonly disabledKeys?: Iterable<Key>\n  /**\n   * Keeps the last selected row selected, so a press on it changes nothing.\n   * @default false\n   */\n  readonly disallowEmptySelection?: boolean\n  /** The entries `children` draws a part for, when it is a function. */\n  readonly items?: Iterable<T>\n  /**\n   * Called with a row's key when a press runs its action. A row's own\n   * `onAction` takes its place for that row.\n   */\n  readonly onAction?: (key: Key) => void\n  /** Called with the selected keys whenever a press changes them. */\n  readonly onSelectionChange?: (keys: Selection) => void\n  readonly ref?: Ref<FlatList>\n  /**\n   * What the list shows when it has no rows and nothing is loading. Left\n   * out, it is a muted row saying \"No results\" in the `I18nProvider`'s\n   * language, or the device's outside one, so the list keeps a row's height.\n   */\n  readonly renderEmptyState?: () => ReactNode\n  /**\n   * The selected keys, for a call site holding the selection itself with\n   * `onSelectionChange`.\n   */\n  readonly selectedKeys?: 'all' | Iterable<Key>\n  /**\n   * Whether rows can be selected: one at a time, several, or none. A list\n   * that selects draws a checkbox on every row.\n   * @default 'none'\n   */\n  readonly selectionMode?: SelectionMode\n  /**\n   * What selecting a row is called, for a screen reader: the accessibility\n   * action each selectable row offers, which is what its checkbox does. The\n   * row's own text is what names the row. Left out, it is the word for it in\n   * the `I18nProvider`'s language, or the device's outside one, \"Select\" in\n   * English.\n   */\n  readonly selectLabel?: string\n  readonly style?: StyleProp<ViewStyle>\n}\n\n// `Row` rather than `Item`, though the part is `List.Item`, for the reason\n// web gives: `ListItemProps` is the standalone ListItem's, and both are\n// exported from the package.\ntype ListRowProps = Omit<\n  PressableProps,\n  'children' | 'disabled' | 'id' | 'role' | 'style'\n> & {\n  /** The row's headline, the one thing it is mostly about. */\n  readonly children?: ReactNode\n  /** The key the row is selected and reported by. Give one to every row. */\n  readonly id?: Key\n  /**\n   * Draws the row disabled, and takes no presses on it, as a key in the\n   * list's `disabledKeys` does.\n   * @default false\n   */\n  readonly isDisabled?: boolean\n  /** Content before the headline: an avatar, an icon. */\n  readonly leading?: ReactNode\n  /**\n   * Called when a press runs the row's action, in place of the list's\n   * `onAction` for this row.\n   */\n  readonly onAction?: () => void\n  /**\n   * A line above the headline, in label small and the muted role. Given\n   * beside `supporting`, it makes the row the three-line item.\n   */\n  readonly overline?: ReactNode\n  readonly ref?: Ref<HostInstance>\n  readonly style?: StyleProp<ViewStyle>\n  /** A second line under the headline, in body medium and the muted role. */\n  readonly supporting?: ReactNode\n  /**\n   * The row's text, read off `children` when they are a plain string, so a\n   * row whose headline is an element passes it.\n   */\n  readonly textValue?: string\n  /** Content after the headline, such as an amount or a control. */\n  readonly trailing?: ReactNode\n}\n\ntype ListSectionProps = {\n  /** The rows in the section. */\n  readonly children?: ReactNode\n  /**\n   * The section's heading, which stays at the top of the list while the\n   * section's rows scroll under it. A section without one is its rows alone.\n   */\n  readonly header?: ReactNode\n  readonly id?: Key\n}\n\n// What the cells of the `FlatList` read from the list they are drawn in.\ntype ListValue = {\n  /** The ground a sticky header covers the rows under it with. */\n  readonly ground: ColorValue\n  /** The `List.LoadMore` the list ends in, if it has one. */\n  readonly loadMore: ListLoadMoreProps | undefined\n  readonly onAction: ((key: Key) => void) | undefined\n  readonly renderEmptyState: () => ReactNode\n  readonly selectLabel: string\n  readonly state: ListState<unknown>\n}\n\nconst ListContext = createContext<ListValue | null>(null)\n\n/**\n * A list of rows, one or more of which can be selected. Selection is React\n * Stately's, as web's is React Aria's: set `selectionMode` to `single` or\n * `multiple`, and pass `selectedKeys` with `onSelectionChange` to control\n * it or `defaultSelectedKeys` to let it keep its own. A list whose rows do\n * something takes `onAction`, or an `onAction` on each row.\n *\n * ```tsx\n * <List aria-label=\"Label\" selectionMode=\"multiple\">\n *   <List.Item id=\"first\" supporting=\"Supporting line\">First item</List.Item>\n * </List>\n * ```\n *\n * ListItem is the row on its own; this is the collection that draws the\n * same row and adds selection, sections and a row that loads more. Composed\n * from parts, `List.Item`, `List.Section` and `List.LoadMore`, which the\n * list draws from their props, so none of them renders anything on its\n * own. Name the list with `aria-label`. It scrolls by itself, so it wants a\n * height to fill: a short list on a page that scrolls takes\n * `scrollEnabled={false}` and is laid out at its full length. `style` and\n * `ref` land on the `FlatList`.\n *\n * Inside an `Autocomplete`, the list shows the rows the search keeps and\n * says how many there are to a screen reader, and a tap on a row reaches it\n * while the keyboard is up.\n */\nfunction List<T extends object = object>({\n  children,\n  contentContainerStyle,\n  defaultSelectedKeys,\n  disabledKeys,\n  disallowEmptySelection,\n  items,\n  keyboardShouldPersistTaps,\n  onAction,\n  onSelectionChange,\n  ref,\n  renderEmptyState = emptyState,\n  selectedKeys,\n  selectionMode = 'none',\n  selectLabel,\n  style,\n  ...props\n}: ListProps<T>) {\n  const theme = useTheme()\n  const own = stylesOf(theme)\n  const autocomplete = use(AutocompleteContext)\n  const matches = autocomplete?.matches\n  const filter = useMemo(\n    () => (matches === undefined ? undefined : filterOf<T>(matches)),\n    [matches],\n  )\n  const state = useListState<T>({\n    // Each part builds its own entry in the collection; see the parts'\n    // `getCollectionNode`. The collection skips what is not an element, as a\n    // ReactNode may be, and asks any element for its entry.\n    // oxlint-disable-next-line typescript/no-unsafe-type-assertion -- see above\n    children: children as StatelyListProps<T>['children'],\n    defaultSelectedKeys,\n    disabledKeys,\n    disallowEmptySelection,\n    filter,\n    items,\n    onSelectionChange,\n    selectedKeys,\n    selectionMode,\n  })\n  const { entries, loader, rows, sticky } = useMemo(\n    () => entriesOf(state),\n    [state],\n  )\n  const listStyle = composeStyles<ViewStyle>(own.list, style)\n  // oxlint-disable-next-line typescript/no-unsafe-assignment -- a node carries the props its part was written with, which React Stately types as `any`\n  const loadMore: ListLoadMoreProps | undefined = loader?.props\n  const isLoading = loadMore?.isLoading ?? false\n  const messages = useMessages()\n  // The list's own ground unless `style` gives it another.\n  const ground =\n    StyleSheet.flatten(style)?.backgroundColor ?? theme.colors.surface\n  const value = useMemo<ListValue>(\n    () => ({\n      ground,\n      loadMore,\n      onAction,\n      renderEmptyState,\n      selectLabel: selectLabel ?? messages.select,\n      state,\n    }),\n    [\n      ground,\n      loadMore,\n      messages,\n      onAction,\n      renderEmptyState,\n      selectLabel,\n      state,\n    ],\n  )\n\n  return (\n    <ListContext value={value}>\n      <FlatList\n        {...props}\n        contentContainerStyle={composeStyles<ViewStyle>(\n          own.content,\n          contentContainerStyle,\n        )}\n        data={entries}\n        keyboardShouldPersistTaps={\n          keyboardShouldPersistTaps ??\n          (autocomplete === null ? undefined : 'handled')\n        }\n        keyExtractor={keyOf}\n        ListEmptyComponent={isLoading ? undefined : EmptyState}\n        ListFooterComponent={loadMore === undefined ? undefined : LoaderRow}\n        onEndReached={loadMore === undefined ? undefined : loadMoreOf(loadMore)}\n        onEndReachedThreshold={loadMore?.scrollOffset ?? LOAD_OFFSET}\n        ref={ref}\n        renderItem={renderEntry}\n        stickyHeaderIndices={sticky}\n        style={listStyle}\n      />\n      {autocomplete === null ? null : <ResultsStatus count={rows} />}\n    </ListContext>\n  )\n}\n\n/**\n * The row shown while more items are being fetched. `onLoadMore` is called\n * as the reader nears the end of the list, and the ring is drawn only while\n * `isLoading`, in a live region, so a screen reader hears it arrive. It\n * goes last, after the rows it loads more of.\n */\nfunction ListLoadMore(_props: ListLoadMoreProps): null {\n  return null\n}\n\nListLoadMore.getCollectionNode = function* getCollectionNode(\n  props: ListLoadMoreProps,\n) {\n  yield { hasChildNodes: false, props, rendered: null, type: 'loader' }\n}\n\n/**\n * One row. Its slots are ListItem's: `leading`, the headline as children,\n * `overline` above it, `supporting` under it, and `trailing`. Give every\n * row an `id`, which is the key selection is reported by. A list that\n * selects draws a checkbox before whatever `leading` holds.\n *\n * The list draws it from its entry in the collection, so it renders nothing\n * on its own. `style`, `ref` and `testID` land on the row.\n */\nfunction ListRow(_props: ListRowProps): null {\n  return null\n}\n\n// The entry the collection holds for a row, as React Stately's own `Item`\n// gives one: keyed by the row's `id`, and carrying the props it is drawn\n// from.\nListRow.getCollectionNode = function* getCollectionNode(props: ListRowProps) {\n  yield {\n    'aria-label': props['aria-label'],\n    hasChildNodes: false,\n    key: props.id,\n    props,\n    rendered: props.children,\n    textValue:\n      props.textValue ??\n      (typeof props.children === 'string' ? props.children : ''),\n    type: 'item',\n  }\n}\n\n/**\n * A group of rows under a heading, which stays at the top of the list while\n * the group's rows scroll under it.\n */\nfunction ListSection(_props: ListSectionProps): null {\n  return null\n}\n\nListSection.getCollectionNode = function* getCollectionNode(\n  props: ListSectionProps,\n) {\n  const children: ReactNode[] = []\n\n  // Walked as React Stately's own Section walks them, which leaves each\n  // child its own key rather than the one `Children.toArray` gives it.\n  Children.forEach(props.children, (child) => {\n    if (child !== null && child !== undefined && child !== false) {\n      children.push(child)\n    }\n  })\n\n  yield {\n    *childNodes() {\n      for (const element of children) {\n        yield { element }\n      }\n    },\n    hasChildNodes: true,\n    key: props.id,\n    props,\n    rendered: props.header,\n    type: 'section',\n  }\n}\n\n/**\n * The muted row a list shows when nothing is in it: a row's box and\n * headline in on surface variant, with no press of its own.\n */\nfunction EmptyRow() {\n  const theme = useTheme()\n  const own = stylesOf(theme)\n  const headline = useTypeRole('bodyLarge')\n  const messages = useMessages()\n\n  return (\n    <View style={rowStyleOf(theme, {})}>\n      <NativeText style={composeStyles<TextStyle>(headline, own.empty)}>\n        {messages.noResults}\n      </NativeText>\n    </View>\n  )\n}\n\n// What the list shows when nothing is in it.\nfunction emptyState() {\n  return <EmptyRow />\n}\n\n// The list's empty state, as the component `ListEmptyComponent` takes.\nfunction EmptyState() {\n  return <>{useList().renderEmptyState()}</>\n}\n\n/**\n * The cells the `FlatList` draws, in order, where the headers among them\n * are, and how many rows there are: the rows outside any section, and each\n * section's header followed by its rows. The row that loads more is drawn\n * after them all.\n */\nfunction entriesOf<T>(state: ListState<T>) {\n  const entries: ListEntry[] = []\n  const sticky: number[] = []\n  let loader: Node<T> | undefined\n  let rows = 0\n\n  for (const node of state.collection) {\n    if (node.type === 'loader') {\n      loader = node\n    } else if (node.type === 'section') {\n      if (hasContent(node.rendered)) {\n        sticky.push(entries.length)\n        entries.push({ kind: 'header', node })\n      }\n      const children =\n        state.collection.getChildren?.(node.key) ??\n        // oxlint-disable-next-line typescript/no-deprecated -- a fallback for a collection without getChildren\n        node.childNodes\n      for (const row of children) {\n        entries.push({ kind: 'item', node: row })\n        rows++\n      }\n    } else {\n      entries.push({ kind: 'item', node })\n      rows++\n    }\n  }\n\n  return { entries, loader, rows, sticky }\n}\n\n/**\n * What a list inside an Autocomplete builds its collection from: the rows\n * the search keeps, each section with a row left in it, and the row that\n * loads more. Each node is copied rather than handed on, as React Stately's\n * ComboBox copies its own, since a collection numbers the nodes it holds.\n */\nfunction filterOf<T>(matches: AutocompleteValue['matches']) {\n  return (nodes: Iterable<Node<T>>) => keptOf(nodes, matches)\n}\n\nfunction keptOf<T>(\n  nodes: Iterable<Node<T>>,\n  matches: AutocompleteValue['matches'],\n): Node<T>[] {\n  const kept: Node<T>[] = []\n\n  for (const node of nodes) {\n    if (node.type === 'section') {\n      // oxlint-disable-next-line typescript/no-deprecated -- a filter is handed the nodes before a collection holds them, so there is none to ask\n      const rows = keptOf(node.childNodes, matches)\n\n      if (rows.some((row) => row.type === 'item')) {\n        // oxlint-disable-next-line typescript/no-deprecated -- the field the collection reads a section's rows from\n        kept.push({ ...node, childNodes: rows })\n      }\n    } else if (node.type !== 'item' || matches(node.textValue, node)) {\n      kept.push({ ...node })\n    }\n  }\n\n  return kept\n}\n\n// A cell's key in the `FlatList`: a header's and a row's apart, since a\n// section's header carries the section's key.\nfunction keyOf({ kind, node }: ListEntry) {\n  return `${kind}:${String(node.key)}`\n}\n\n/**\n * A row: the state layer, the ripple and the focus ring over the checkbox,\n * the leading slot, the lines and the trailing slot, on primary container\n * while selected. A row with nothing to do on a press, in a list that\n * neither selects nor acts, is a `View` that only presents.\n */\nfunction ListRowNode({ node }: { readonly node: Node<unknown> }) {\n  const theme = useTheme()\n  const own = stylesOf(theme)\n  const list = useList()\n\n  // oxlint-disable-next-line typescript/no-unsafe-assignment -- a node carries the props its row was written with, which React Stately types as `any`\n  const {\n    children,\n    id: _id,\n    isDisabled: _isDisabled,\n    leading,\n    onAction,\n    onBlur,\n    onFocus,\n    onHoverIn,\n    onHoverOut,\n    onLongPress,\n    onPress,\n    onPressIn,\n    onPressOut,\n    overline,\n    ref,\n    style,\n    supporting,\n    textValue: _textValue,\n    trailing,\n    ...props\n  }: ListRowProps = node.props\n  const { selectionManager } = list.state\n  const { key } = node\n  // The selection manager reads a row's own `isDisabled` off its entry,\n  // beside the list's `disabledKeys`, so it answers for both.\n  const disabled = selectionManager.isDisabled(key)\n  const checks = selectionManager.selectionMode !== 'none'\n  const selectable = selectionManager.canSelectItem(key)\n  const selected = checks && selectionManager.isSelected(key)\n  const listAction = list.onAction\n  const action =\n    onAction ??\n    (listAction === undefined\n      ? undefined\n      : () => {\n          listAction(key)\n        })\n  // React Aria's rule for a touch press on a row that selects with a\n  // checkbox: the action while nothing is selected, the selection after.\n  const acts = action !== undefined && (!selectable || selectionManager.isEmpty)\n  const select = () => {\n    selectionManager.select(key)\n  }\n  const content = rowContentColor(theme, {\n    isDisabled: disabled,\n    isSelected: selected,\n  })\n  const feedback = usePressFeedback({\n    color: content,\n    disabled,\n    onBlur,\n    onFocus,\n    onHoverIn,\n    onHoverOut,\n    onPressIn,\n    onPressOut,\n  })\n\n  const lead = checks\n    ? withBox(\n        <SelectBox\n          isDisabled={disabled}\n          isSelected={selected}\n          onPress={acts && selectable ? select : undefined}\n        />,\n        leading,\n        own.lead,\n      )\n    : leading\n  const lines = (\n    <RowContent\n      isDisabled={disabled}\n      isSelected={selected}\n      leading={lead}\n      overline={overline}\n      supporting={supporting}\n      trailing={trailing}\n    >\n      {children}\n    </RowContent>\n  )\n  const rowStyle = rowStyleOf(theme, {\n    isSelected: selected,\n    overline,\n    supporting,\n  })\n\n  if (!checks && action === undefined && onPress === undefined) {\n    return (\n      <View\n        aria-disabled={disabled || undefined}\n        ref={ref}\n        style={composeStyles<ViewStyle>(rowStyle, style)}\n        testID={props.testID}\n      >\n        {lines}\n      </View>\n    )\n  }\n\n  return (\n    <Pressable\n      role=\"button\"\n      {...props}\n      {...(checks ? toggleState(selected) : undefined)}\n      {...(selectable\n        ? {\n            accessibilityActions: [{ label: list.selectLabel, name: 'select' }],\n            onAccessibilityAction: selectionActionOf(select),\n          }\n        : undefined)}\n      {...feedback.handlers}\n      disabled={disabled}\n      onLongPress={\n        action !== undefined && selectable\n          ? pressThen(onLongPress, select)\n          : onLongPress\n      }\n      onPress={pressThen(onPress, acts ? action : selectable ? select : noop)}\n      ref={ref}\n      style={composeStyles<ViewStyle>(\n        rowStyle,\n        feedback.ring,\n        feedback.ring === undefined ? undefined : rowStyles.ring,\n        style,\n      )}\n    >\n      {feedback.layer}\n      {lines}\n    </Pressable>\n  )\n}\n\n/**\n * The row `List.LoadMore` draws: a live region, empty while idle and\n * holding the ring while loading. Android and React Native Web say what\n * arrives in it; iOS has no live regions, so the ring's name is said there\n * as it appears.\n */\nfunction LoaderRow() {\n  const own = stylesOf(useTheme())\n  const { isLoading = false, label, style, testID } = useList().loadMore ?? IDLE\n  const messages = useMessages()\n  const name = label ?? messages.loadingMore\n\n  useLoadingAnnouncement(isLoading, name)\n\n  return (\n    <View\n      aria-live=\"polite\"\n      style={composeStyles<ViewStyle>(\n        isLoading ? own.loading : styles.idle,\n        style,\n      )}\n      testID={testID}\n    >\n      {isLoading ? (\n        <ProgressIndicator\n          aria-label={name}\n          diameter={LOADING_DIAMETER}\n          isIndeterminate\n          variant=\"circular\"\n        />\n      ) : null}\n    </View>\n  )\n}\n\n// Asks for more as the reader nears the end, unless a load is under way.\nfunction loadMoreOf({ isLoading = false, onLoadMore }: ListLoadMoreProps) {\n  return () => {\n    if (!isLoading) {\n      onLoadMore?.()\n    }\n  }\n}\n\nfunction noop() {\n  // A press on a row with nothing to do runs the call site's `onPress` alone.\n}\n\n/**\n * The press handler of a row: the call site's own handler, then the row's.\n * Built by a call rather than written inline at the prop, which is what\n * react-perf's no-new-function-as-prop is after.\n */\nfunction pressThen(\n  onPress: PressableProps['onPress'],\n  then: (() => void) | undefined,\n) {\n  return (event: GestureResponderEvent) => {\n    onPress?.(event)\n    then?.()\n  }\n}\n\n// One cell, drawn as the part it came from.\nfunction renderEntry({ item }: ListRenderItemInfo<ListEntry>) {\n  return item.kind === 'header' ? (\n    <SectionHeader node={item.node} />\n  ) : (\n    <ListRowNode node={item.node} />\n  )\n}\n\n/**\n * How many rows a search leaves, said to a screen reader as it changes and\n * never drawn: in a polite live region on Android and under React Native\n * Web, and through `AccessibilityInfo` on iOS, which has no live regions,\n * so nothing is drawn there at all.\n */\nfunction ResultsStatus({ count }: { readonly count: number }) {\n  const own = stylesOf(useTheme())\n  const locale = useLocaleOf(undefined)\n  const message = resultsFor(count, locale)\n\n  useResultsAnnouncement(message)\n\n  if (Platform.OS === 'ios') {\n    return null\n  }\n\n  return (\n    <View aria-live=\"polite\" style={styles.status}>\n      <NativeText style={own.status}>{message}</NativeText>\n    </View>\n  )\n}\n\n/** A section's heading, on the list's ground so the rows pass under it. */\nfunction SectionHeader({ node }: { readonly node: Node<unknown> }) {\n  const own = stylesOf(useTheme())\n  const title = useTypeRole('titleSmall')\n  const { ground } = useList()\n\n  return (\n    <View style={composeStyles<ViewStyle>({ backgroundColor: ground })}>\n      <NativeText\n        role=\"heading\"\n        style={composeStyles<TextStyle>(title, own.header)}\n      >\n        {node.rendered}\n      </NativeText>\n    </View>\n  )\n}\n\n/**\n * The checkbox a selecting row draws, for the eye alone: the row is what a\n * screen reader hears and presses. On a row whose press runs an action, a\n * touch on the box selects instead, through a press of its own the size of\n * a 48dp target, hidden from the reader as the box is.\n */\nfunction SelectBox({\n  isDisabled,\n  isSelected,\n  onPress,\n}: {\n  readonly isDisabled: boolean\n  readonly isSelected: boolean\n  readonly onPress: (() => void) | undefined\n}) {\n  const drawn = (\n    <CheckboxBox\n      isDisabled={isDisabled}\n      isSelected={isSelected}\n      within={BOX_SLOT}\n    />\n  )\n\n  if (onPress === undefined) {\n    return <View style={styles.box}>{drawn}</View>\n  }\n\n  return (\n    <Pressable\n      accessible={false}\n      aria-hidden\n      disabled={isDisabled}\n      focusable={false}\n      hitSlop={hitSlop(BOX_SLOT, BOX_SLOT)}\n      onPress={onPress}\n      style={styles.box}\n      tabIndex={-1}\n    >\n      {drawn}\n    </Pressable>\n  )\n}\n\n// Runs the selection when a screen reader asks for the row's select action.\nfunction selectionActionOf(select: () => void) {\n  return (event: AccessibilityActionEvent) => {\n    if (event.nativeEvent.actionName === 'select') {\n      select()\n    }\n  }\n}\n\n// The list a cell is drawn in. Every cell is the `FlatList`'s, inside the\n// list's own provider, so there always is one.\nfunction useList(): ListValue {\n  const list = use(ListContext)\n\n  if (list === null) {\n    throw new Error('A List part is drawn by the List it is in.')\n  }\n  return list\n}\n\n// Says the ring's name on iOS as it appears. A list loading as it mounts\n// says nothing, as a live region does not read what it was mounted holding.\nfunction useLoadingAnnouncement(isLoading: boolean, label: string) {\n  const was = useRef(isLoading)\n\n  useEffect(() => {\n    if (isLoading && !was.current && Platform.OS === 'ios') {\n      AccessibilityInfo.announceForAccessibility(label)\n    }\n    was.current = isLoading\n  }, [isLoading, label])\n}\n\n// Says how many rows are left on iOS each time the count changes. The count\n// a list mounts with is not said, as a live region does not read what it was\n// mounted holding.\nfunction useResultsAnnouncement(message: string) {\n  const was = useRef(message)\n\n  useEffect(() => {\n    if (message !== was.current && Platform.OS === 'ios') {\n      AccessibilityInfo.announceForAccessibility(message)\n    }\n    was.current = message\n  }, [message])\n}\n\n/**\n * The leading slot of a row that selects: the checkbox, then whatever the\n * row was given, in a row of their own so the two sit side by side.\n */\nfunction withBox(\n  box: ReactElement,\n  leading: ReactNode,\n  style: StyleProp<ViewStyle>,\n): ReactNode {\n  return hasContent(leading) ? (\n    <View style={style}>\n      {box}\n      {leading}\n    </View>\n  ) : (\n    box\n  )\n}\n\nList.Item = ListRow\nList.LoadMore = ListLoadMore\nList.Section = ListSection\n\nexport { List, ListLoadMore, ListRow, ListSection }\nexport type { ListLoadMoreProps, ListProps, ListRowProps, ListSectionProps }\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["CollectionLoadMoreProps","CollectionProps","CollectionRowProps","CollectionSectionProps","Collection","loaderNode","rowNode","sectionNode","ListLoadMoreProps","ListProps","T","ListRowProps","ListSectionProps","List","props","$","_c","t0","ListLoadMore","_props","getCollectionNode","ListRow","ListSection","Item","LoadMore","Section","_c"],"sources":["../../../src/components/list/index.tsx"],"sourcesContent":["import type {\n  CollectionLoadMoreProps,\n  CollectionProps,\n  CollectionRowProps,\n  CollectionSectionProps,\n} from '../../collection'\n\nimport { Collection, loaderNode, rowNode, sectionNode } from '../../collection'\n\n// kanso-ui's List, from the lists page: a column of the rows ListItem draws,\n// with selection, an action per row, sections and a row that loads more.\n// What it draws, and how it differs from web's, is src/collection's, which\n// ListBox draws too; what is List's own is the checkbox on a row that\n// selects, the headers that stick, and the surface it is drawn on.\n\ntype ListLoadMoreProps = CollectionLoadMoreProps\n\ntype ListProps<T extends object = object> = CollectionProps<T>\n\n// `Row` rather than `Item`, though the part is `List.Item`, for the reason\n// web gives: `ListItemProps` is the standalone ListItem's, and both are\n// exported from the package.\ntype ListRowProps = CollectionRowProps\n\ntype ListSectionProps = CollectionSectionProps\n\n/**\n * A list of rows, one or more of which can be selected. Selection is React\n * Stately's, as web's is React Aria's: set `selectionMode` to `single` or\n * `multiple`, and pass `selectedKeys` with `onSelectionChange` to control\n * it or `defaultSelectedKeys` to let it keep its own. A list that selects\n * draws a checkbox on every row. A list whose rows do something takes\n * `onAction`, or an `onAction` on each row.\n *\n * ```tsx\n * <List aria-label=\"Label\" selectionMode=\"multiple\">\n *   <List.Item id=\"first\" supporting=\"Supporting line\">First item</List.Item>\n * </List>\n * ```\n *\n * ListItem is the row on its own; this is the collection that draws the\n * same row and adds selection, sections and a row that loads more. Composed\n * from parts, `List.Item`, `List.Section` and `List.LoadMore`, which the\n * list draws from their props, so none of them renders anything on its\n * own. Name the list with `aria-label`. It scrolls by itself, so it wants a\n * height to fill: a short list on a page that scrolls takes\n * `scrollEnabled={false}` and is laid out at its full length. It is drawn\n * on surface, and a section's header stays at the top while its rows scroll\n * under it. `style` and `ref` land on the `FlatList`.\n *\n * Inside an `Autocomplete`, the list shows the rows the search keeps and\n * says how many there are to a screen reader, and a tap on a row reaches it\n * while the keyboard is up.\n */\nfunction List<T extends object = object>(props: ListProps<T>) {\n  return <Collection {...props} kind=\"list\" />\n}\n\n/**\n * The row shown while more items are being fetched. `onLoadMore` is called\n * as the reader nears the end of the list, and the ring is drawn only while\n * `isLoading`, in a live region, so a screen reader hears it arrive. It\n * goes last, after the rows it loads more of.\n */\nfunction ListLoadMore(_props: ListLoadMoreProps): null {\n  return null\n}\n\nListLoadMore.getCollectionNode = loaderNode\n\n/**\n * One row. Its slots are ListItem's: `leading`, the headline as children,\n * `overline` above it, `supporting` under it, and `trailing`. Give every\n * row an `id`, which is the key selection is reported by. A list that\n * selects draws a checkbox before whatever `leading` holds.\n *\n * The list draws it from its entry in the collection, so it renders nothing\n * on its own. `style`, `ref` and `testID` land on the row.\n */\nfunction ListRow(_props: ListRowProps): null {\n  return null\n}\n\nListRow.getCollectionNode = rowNode\n\n/**\n * A group of rows under a heading, which stays at the top of the list while\n * the group's rows scroll under it.\n */\nfunction ListSection(_props: ListSectionProps): null {\n  return null\n}\n\nListSection.getCollectionNode = sectionNode\n\nList.Item = ListRow\nList.LoadMore = ListLoadMore\nList.Section = ListSection\n\nexport { List, ListLoadMore, ListRow, ListSection }\nexport type { ListLoadMoreProps, ListProps, ListRowProps, ListSectionProps }\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsDA,SAAAa,KAAAC,OAAA;CAAA,MAAAC,IAAAC,EAAA,CAAA;CAAA,IAAAC;CAAA,IAAAF,EAAA,OAAAD,OAAA;EACSG,KAAA,oBAAC,YAAD;GAAW,GAAKH;GAAY,MAAA;EAAM,CAAA;EAAGC,EAAA,KAAAD;EAAAC,EAAA,KAAAE;CAAA,OAAAA,KAAAF,EAAA;CAAA,OAArCE;AAAqC;;;;;;;AAS9C,SAASC,aAAaC,QAAiC;CACrD,OAAO;AACT;AAEAD,aAAaE,oBAAoBf;;;;;;;;;;AAWjC,SAASgB,QAAQF,QAA4B;CAC3C,OAAO;AACT;AAEAE,QAAQD,oBAAoBd;;;;;AAM5B,SAASgB,YAAYH,QAAgC;CACnD,OAAO;AACT;AAEAG,YAAYF,oBAAoBb;AAEhCM,KAAKU,OAAOF;AACZR,KAAKW,WAAWN;AAChBL,KAAKY,UAAUH"}

package/dist/components/list-box/index.d.ts

@@ -0,0 +1,73 @@
+import { CollectionLoadMoreProps, CollectionProps, CollectionRowProps, CollectionSectionProps, loaderNode, rowNode, sectionNode } from "../../collection/index.js";
+//#region src/components/list-box/index.d.ts
+type ListBoxItemProps = CollectionRowProps;
+type ListBoxLoadMoreProps = CollectionLoadMoreProps;
+type ListBoxProps<T extends object = object> = CollectionProps<T>;
+type ListBoxSectionProps = CollectionSectionProps;
+/**
+ * A list of options one or more of which can be selected. Selection is React
+ * Stately's, as web's is React Aria's: set `selectionMode` to `single` or
+ * `multiple`, and pass `selectedKeys` with `onSelectionChange` to control
+ * it or `defaultSelectedKeys` to let it keep its own. A selected option is
+ * drawn on primary container. A list that only responds to a press takes
+ * `onAction`, or an `onAction` on each option.
+ *
+ * ```tsx
+ * <ListBox aria-label="Label" selectionMode="single">
+ *   <ListBox.Item id="first">First item</ListBox.Item>
+ *   <ListBox.Item id="second">Second item</ListBox.Item>
+ * </ListBox>
+ * ```
+ *
+ * Composed from parts, `ListBox.Item`, `ListBox.Section` and
+ * `ListBox.LoadMore`, which the list draws from their props, so none of
+ * them renders anything on its own. Name the list with `aria-label`. It has
+ * no background of its own, so it takes whatever it sits on. It scrolls by
+ * itself, so it wants a height to fill: a short list on a page that scrolls
+ * takes `scrollEnabled={false}` and is laid out at its full length. `style`
+ * and `ref` land on the `FlatList`.
+ *
+ * A list with nothing in it shows a muted "No results" row in place of its
+ * options; pass `renderEmptyState` to draw something else. Inside an
+ * `Autocomplete`, it shows the options the search keeps and says how many
+ * there are to a screen reader.
+ */
+declare function ListBox<T extends object = object>(props: ListBoxProps<T>): import("react").JSX.Element;
+declare namespace ListBox {
+  var Item: typeof ListBoxItem;
+  var LoadMore: typeof ListBoxLoadMore;
+  var Section: typeof ListBoxSection;
+}
+/**
+ * One option. Its slots are ListItem's: `leading`, the headline as children,
+ * `overline` above it, `supporting` under it, and `trailing`. Give every
+ * option an `id`, which is the key selection is reported by.
+ *
+ * The list draws it from its entry in the collection, so it renders nothing
+ * on its own. `style`, `ref` and `testID` land on the option.
+ */
+declare function ListBoxItem(_props: ListBoxItemProps): null;
+declare namespace ListBoxItem {
+  var getCollectionNode: typeof rowNode;
+}
+/**
+ * The row shown while more options are being fetched. `onLoadMore` is
+ * called as the reader nears the end of the list, and the ring is drawn
+ * only while `isLoading`, in a live region, so a screen reader hears it
+ * arrive. It goes last, after the options it loads more of.
+ */
+declare function ListBoxLoadMore(_props: ListBoxLoadMoreProps): null;
+declare namespace ListBoxLoadMore {
+  var getCollectionNode: typeof loaderNode;
+}
+/**
+ * A group of options under a heading, which a screen reader reads before the
+ * options in it.
+ */
+declare function ListBoxSection(_props: ListBoxSectionProps): null;
+declare namespace ListBoxSection {
+  var getCollectionNode: typeof sectionNode;
+}
+//#endregion
+export { ListBox, ListBoxItem, type ListBoxItemProps, ListBoxLoadMore, type ListBoxLoadMoreProps, type ListBoxProps, ListBoxSection, type ListBoxSectionProps };
+//# sourceMappingURL=index.d.ts.map

package/dist/components/list-box/index.js

@@ -0,0 +1,82 @@
+import { Collection, loaderNode, rowNode, sectionNode } from "../../collection/index.js";
+import { c } from "react/compiler-runtime";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/list-box/index.tsx
+/**
+* A list of options one or more of which can be selected. Selection is React
+* Stately's, as web's is React Aria's: set `selectionMode` to `single` or
+* `multiple`, and pass `selectedKeys` with `onSelectionChange` to control
+* it or `defaultSelectedKeys` to let it keep its own. A selected option is
+* drawn on primary container. A list that only responds to a press takes
+* `onAction`, or an `onAction` on each option.
+*
+* ```tsx
+* <ListBox aria-label="Label" selectionMode="single">
+*   <ListBox.Item id="first">First item</ListBox.Item>
+*   <ListBox.Item id="second">Second item</ListBox.Item>
+* </ListBox>
+* ```
+*
+* Composed from parts, `ListBox.Item`, `ListBox.Section` and
+* `ListBox.LoadMore`, which the list draws from their props, so none of
+* them renders anything on its own. Name the list with `aria-label`. It has
+* no background of its own, so it takes whatever it sits on. It scrolls by
+* itself, so it wants a height to fill: a short list on a page that scrolls
+* takes `scrollEnabled={false}` and is laid out at its full length. `style`
+* and `ref` land on the `FlatList`.
+*
+* A list with nothing in it shows a muted "No results" row in place of its
+* options; pass `renderEmptyState` to draw something else. Inside an
+* `Autocomplete`, it shows the options the search keeps and says how many
+* there are to a screen reader.
+*/
+function ListBox(props) {
+	const $ = c(2);
+	let t0;
+	if ($[0] !== props) {
+		t0 = /* @__PURE__ */ jsx(Collection, {
+			...props,
+			kind: "listbox"
+		});
+		$[0] = props;
+		$[1] = t0;
+	} else t0 = $[1];
+	return t0;
+}
+/**
+* One option. Its slots are ListItem's: `leading`, the headline as children,
+* `overline` above it, `supporting` under it, and `trailing`. Give every
+* option an `id`, which is the key selection is reported by.
+*
+* The list draws it from its entry in the collection, so it renders nothing
+* on its own. `style`, `ref` and `testID` land on the option.
+*/
+function ListBoxItem(_props) {
+	return null;
+}
+ListBoxItem.getCollectionNode = rowNode;
+/**
+* The row shown while more options are being fetched. `onLoadMore` is
+* called as the reader nears the end of the list, and the ring is drawn
+* only while `isLoading`, in a live region, so a screen reader hears it
+* arrive. It goes last, after the options it loads more of.
+*/
+function ListBoxLoadMore(_props) {
+	return null;
+}
+ListBoxLoadMore.getCollectionNode = loaderNode;
+/**
+* A group of options under a heading, which a screen reader reads before the
+* options in it.
+*/
+function ListBoxSection(_props) {
+	return null;
+}
+ListBoxSection.getCollectionNode = sectionNode;
+ListBox.Item = ListBoxItem;
+ListBox.LoadMore = ListBoxLoadMore;
+ListBox.Section = ListBoxSection;
+//#endregion
+export { ListBox, ListBoxItem, ListBoxLoadMore, ListBoxSection };
+
+//# sourceMappingURL=index.js.map

package/dist/components/list-box/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["CollectionLoadMoreProps","CollectionProps","CollectionRowProps","CollectionSectionProps","Collection","loaderNode","rowNode","sectionNode","ListBoxItemProps","ListBoxLoadMoreProps","ListBoxProps","T","ListBoxSectionProps","ListBox","props","$","_c","t0","ListBoxItem","_props","getCollectionNode","ListBoxLoadMore","ListBoxSection","Item","LoadMore","Section","_c"],"sources":["../../../src/components/list-box/index.tsx"],"sourcesContent":["import type {\n  CollectionLoadMoreProps,\n  CollectionProps,\n  CollectionRowProps,\n  CollectionSectionProps,\n} from '../../collection'\n\nimport { Collection, loaderNode, rowNode, sectionNode } from '../../collection'\n\n// kanso-ui's ListBox, from the lists page: the selectable list Select and\n// ComboBox put in an overlay. Its options are the rows every list here\n// draws, through src/collection, which List draws too, so the 56dp floor,\n// the lines, the state layers and the disabled treatment are that module's.\n// What is ListBox's own is what web's is: a selected option is marked by its\n// container alone, primary container and on primary container, with no\n// checkbox drawn, and the list has no ground of its own, which is what lets\n// the same one sit on a page and inside a popover. A list that selects more\n// than one and wants a checkbox puts one in an option's trailing slot, as on\n// web, since which of the two affordances a list wants is the list's\n// decision.\n//\n// Its section headers scroll with the options rather than sticking, as\n// web's do: a header that sticks covers the rows under it, and with no\n// ground there is nothing to cover them with.\n\ntype ListBoxItemProps = CollectionRowProps\n\ntype ListBoxLoadMoreProps = CollectionLoadMoreProps\n\ntype ListBoxProps<T extends object = object> = CollectionProps<T>\n\ntype ListBoxSectionProps = CollectionSectionProps\n\n/**\n * A list of options one or more of which can be selected. Selection is React\n * Stately's, as web's is React Aria's: set `selectionMode` to `single` or\n * `multiple`, and pass `selectedKeys` with `onSelectionChange` to control\n * it or `defaultSelectedKeys` to let it keep its own. A selected option is\n * drawn on primary container. A list that only responds to a press takes\n * `onAction`, or an `onAction` on each option.\n *\n * ```tsx\n * <ListBox aria-label=\"Label\" selectionMode=\"single\">\n *   <ListBox.Item id=\"first\">First item</ListBox.Item>\n *   <ListBox.Item id=\"second\">Second item</ListBox.Item>\n * </ListBox>\n * ```\n *\n * Composed from parts, `ListBox.Item`, `ListBox.Section` and\n * `ListBox.LoadMore`, which the list draws from their props, so none of\n * them renders anything on its own. Name the list with `aria-label`. It has\n * no background of its own, so it takes whatever it sits on. It scrolls by\n * itself, so it wants a height to fill: a short list on a page that scrolls\n * takes `scrollEnabled={false}` and is laid out at its full length. `style`\n * and `ref` land on the `FlatList`.\n *\n * A list with nothing in it shows a muted \"No results\" row in place of its\n * options; pass `renderEmptyState` to draw something else. Inside an\n * `Autocomplete`, it shows the options the search keeps and says how many\n * there are to a screen reader.\n */\nfunction ListBox<T extends object = object>(props: ListBoxProps<T>) {\n  return <Collection {...props} kind=\"listbox\" />\n}\n\n/**\n * One option. Its slots are ListItem's: `leading`, the headline as children,\n * `overline` above it, `supporting` under it, and `trailing`. Give every\n * option an `id`, which is the key selection is reported by.\n *\n * The list draws it from its entry in the collection, so it renders nothing\n * on its own. `style`, `ref` and `testID` land on the option.\n */\nfunction ListBoxItem(_props: ListBoxItemProps): null {\n  return null\n}\n\nListBoxItem.getCollectionNode = rowNode\n\n/**\n * The row shown while more options are being fetched. `onLoadMore` is\n * called as the reader nears the end of the list, and the ring is drawn\n * only while `isLoading`, in a live region, so a screen reader hears it\n * arrive. It goes last, after the options it loads more of.\n */\nfunction ListBoxLoadMore(_props: ListBoxLoadMoreProps): null {\n  return null\n}\n\nListBoxLoadMore.getCollectionNode = loaderNode\n\n/**\n * A group of options under a heading, which a screen reader reads before the\n * options in it.\n */\nfunction ListBoxSection(_props: ListBoxSectionProps): null {\n  return null\n}\n\nListBoxSection.getCollectionNode = sectionNode\n\nListBox.Item = ListBoxItem\nListBox.LoadMore = ListBoxLoadMore\nListBox.Section = ListBoxSection\n\nexport { ListBox, ListBoxItem, ListBoxLoadMore, ListBoxSection }\nexport type {\n  ListBoxItemProps,\n  ListBoxLoadMoreProps,\n  ListBoxProps,\n  ListBoxSectionProps,\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6DA,SAAAa,QAAAC,OAAA;CAAA,MAAAC,IAAAC,EAAA,CAAA;CAAA,IAAAC;CAAA,IAAAF,EAAA,OAAAD,OAAA;EACSG,KAAA,oBAAC,YAAD;GAAW,GAAKH;GAAY,MAAA;EAAS,CAAA;EAAGC,EAAA,KAAAD;EAAAC,EAAA,KAAAE;CAAA,OAAAA,KAAAF,EAAA;CAAA,OAAxCE;AAAwC;;;;;;;;;AAWjD,SAASC,YAAYC,QAAgC;CACnD,OAAO;AACT;AAEAD,YAAYE,oBAAoBd;;;;;;;AAQhC,SAASe,gBAAgBF,QAAoC;CAC3D,OAAO;AACT;AAEAE,gBAAgBD,oBAAoBf;;;;;AAMpC,SAASiB,eAAeH,QAAmC;CACzD,OAAO;AACT;AAEAG,eAAeF,oBAAoBb;AAEnCM,QAAQU,OAAOL;AACfL,QAAQW,WAAWH;AACnBR,QAAQY,UAAUH"}

package/dist/components/loading-indicator/index.d.ts

@@ -0,0 +1,32 @@
+import { StyleProp, View, ViewProps, ViewStyle } from "react-native";
+import { ComponentRef, Ref } from "react";
+//#region src/components/loading-indicator/index.d.ts
+type LoadingIndicatorProps = Omit<ViewProps, 'children' | 'style'> & {
+  /**
+   * Draws the shape on a circular container in the primary container pair,
+   * for an indicator drawn over content, such as a list being refreshed or an
+   * image being fetched, where a bare shape would have nothing behind it to
+   * read against.
+   * @default false
+   */
+  readonly contained?: boolean;
+  readonly ref?: Ref<ComponentRef<typeof View>>;
+  readonly style?: StyleProp<ViewStyle>;
+};
+/**
+ * A shape morphing as it turns, for a wait of a few seconds whose length is
+ * not worth showing, where it would otherwise be an indeterminate ring.
+ *
+ * ```tsx
+ * <LoadingIndicator aria-label="Label" />
+ * ```
+ *
+ * A screen reader hears it as a busy progress bar. Name it with
+ * `aria-label`, or `aria-labelledby` where something on the screen already
+ * says what is loading. `style`, `ref` and `testID` land on the container,
+ * which is the view a layout positions.
+ */
+declare function LoadingIndicator({ contained, style, ...props }: LoadingIndicatorProps): import("react").JSX.Element;
+//#endregion
+export { LoadingIndicator, type LoadingIndicatorProps };
+//# sourceMappingURL=index.d.ts.map

package/dist/components/loading-indicator/index.js

@@ -0,0 +1,174 @@
+import { useTheme } from "../../theme/scope.js";
+import { composeStyles, themedStyles } from "../../theme/styles.js";
+import { HIDDEN } from "../../glyphs/hidden.js";
+import { keyframeAt, useLoop } from "../../indicator/motion.js";
+import { TURN, shapePath } from "../../indicator/paths.js";
+import { c } from "react/compiler-runtime";
+import { StyleSheet, View } from "react-native";
+import Animated, { useAnimatedProps, useReducedMotion } from "react-native-reanimated";
+import { jsx } from "react/jsx-runtime";
+import Svg, { Path } from "react-native-svg";
+//#region src/components/loading-indicator/index.tsx
+const SHAPES = {
+	cookie4Sided: "polygon(79% 50%, 79.1% 52%, 79.6% 54.2%, 80.4% 56.5%, 81.5% 59%, 82.5% 61.8%, 82.9% 64.7%, 82.9% 67.5%, 82.4% 70.3%, 81.5% 72.9%, 80.2% 75.3%, 78.5% 77.5%, 76.4% 79.4%, 74.1% 80.9%, 71.6% 82%, 68.9% 82.7%, 66.1% 83%, 63.2% 82.8%, 60.4% 82.1%, 57.7% 80.9%, 55.3% 79.9%, 53.1% 79.3%, 51% 79%, 49% 79%, 46.9% 79.3%, 44.7% 79.9%, 42.3% 81%, 39.6% 82.1%, 36.8% 82.8%, 33.9% 83%, 31.1% 82.7%, 28.4% 82%, 25.9% 80.9%, 23.6% 79.4%, 21.5% 77.5%, 19.8% 75.3%, 18.5% 72.9%, 17.6% 70.3%, 17.1% 67.5%, 17.1% 64.7%, 17.5% 61.8%, 18.5% 59%, 19.6% 56.5%, 20.4% 54.2%, 20.9% 52%, 21% 50%, 20.9% 48%, 20.4% 45.8%, 19.6% 43.5%, 18.5% 41%, 17.5% 38.2%, 17.1% 35.3%, 17.1% 32.5%, 17.6% 29.7%, 18.5% 27.1%, 19.8% 24.7%, 21.5% 22.5%, 23.6% 20.6%, 25.9% 19.1%, 28.4% 18%, 31.1% 17.3%, 33.9% 17%, 36.8% 17.2%, 39.6% 17.9%, 42.3% 19.1%, 44.7% 20.1%, 46.9% 20.7%, 49% 21%, 51% 21%, 53.1% 20.7%, 55.3% 20.1%, 57.7% 19%, 60.4% 17.9%, 63.2% 17.2%, 66.1% 17%, 68.9% 17.3%, 71.6% 18%, 74.1% 19.1%, 76.4% 20.6%, 78.5% 22.5%, 80.2% 24.7%, 81.5% 27.1%, 82.4% 29.7%, 82.9% 32.5%, 82.9% 35.3%, 82.5% 38.2%, 81.5% 41%, 80.4% 43.5%, 79.6% 45.8%, 79.1% 48%)",
+	cookie9Sided: "polygon(82.5% 50%, 81.4% 52.2%, 80.4% 54.3%, 79.9% 56.4%, 79.8% 58.6%, 80.2% 61%, 80.2% 63.4%, 79.6% 65.8%, 78.6% 67.9%, 77.1% 69.7%, 75.2% 71.1%, 72.9% 72.1%, 70.8% 73.1%, 69.1% 74.4%, 67.6% 76.1%, 66.3% 78.3%, 64.7% 80.1%, 62.7% 81.4%, 60.5% 82.3%, 58.1% 82.6%, 55.7% 82.4%, 53.3% 81.7%, 51.1% 81.2%, 48.9% 81.2%, 46.7% 81.7%, 44.3% 82.4%, 41.9% 82.6%, 39.5% 82.3%, 37.3% 81.4%, 35.3% 80.1%, 33.7% 78.3%, 32.4% 76.1%, 30.9% 74.4%, 29.2% 73.1%, 27.1% 72.1%, 24.8% 71.1%, 22.9% 69.7%, 21.4% 67.9%, 20.4% 65.8%, 19.8% 63.4%, 19.8% 61%, 20.2% 58.6%, 20.1% 56.4%, 19.6% 54.3%, 18.6% 52.2%, 17.5% 50%, 17.1% 47.7%, 17.1% 45.4%, 17.7% 43.1%, 18.7% 41%, 20.3% 39.2%, 22.1% 37.6%, 23.4% 35.9%, 24.4% 34%, 24.9% 31.8%, 25.5% 29.5%, 26.6% 27.4%, 28.1% 25.6%, 29.9% 24.2%, 32% 23.3%, 34.3% 22.8%, 36.7% 22.7%, 38.8% 22.4%, 40.8% 21.6%, 42.6% 20.4%, 44.5% 18.9%, 46.6% 17.9%, 48.9% 17.4%, 51.1% 17.4%, 53.4% 17.9%, 55.5% 18.9%, 57.4% 20.4%, 59.2% 21.6%, 61.2% 22.4%, 63.3% 22.7%, 65.7% 22.8%, 68% 23.3%, 70.1% 24.2%, 71.9% 25.6%, 73.4% 27.4%, 74.5% 29.5%, 75.1% 31.8%, 75.6% 34%, 76.6% 35.9%, 77.9% 37.6%, 79.7% 39.2%, 81.3% 41%, 82.3% 43.1%, 82.9% 45.4%, 82.9% 47.7%)",
+	oval: "polygon(80% 50%, 79% 52%, 78.1% 53.9%, 77.1% 55.8%, 76% 57.5%, 75% 59.1%, 73.9% 60.6%, 72.8% 62.1%, 71.7% 63.5%, 70.5% 64.9%, 69.3% 66.2%, 68.1% 67.5%, 66.8% 68.7%, 65.6% 69.9%, 64.2% 71.1%, 62.8% 72.2%, 61.4% 73.3%, 59.9% 74.4%, 58.3% 75.5%, 56.6% 76.6%, 54.9% 77.6%, 53% 78.6%, 51% 79.5%, 48.9% 80.4%, 46.7% 81.2%, 44.4% 81.9%, 41.9% 82.4%, 39.3% 82.8%, 36.7% 83%, 34% 82.9%, 31.2% 82.5%, 28.6% 81.8%, 26.1% 80.6%, 23.8% 79.1%, 21.7% 77.3%, 20.1% 75.1%, 18.8% 72.7%, 17.8% 70.1%, 17.3% 67.4%, 17% 64.7%, 17.1% 62%, 17.4% 59.4%, 17.8% 56.8%, 18.5% 54.4%, 19.2% 52.2%, 20% 50%, 21% 48%, 21.9% 46.1%, 22.9% 44.2%, 24% 42.5%, 25% 40.9%, 26.1% 39.4%, 27.2% 37.9%, 28.3% 36.5%, 29.5% 35.1%, 30.7% 33.8%, 31.9% 32.5%, 33.2% 31.3%, 34.4% 30.1%, 35.8% 28.9%, 37.2% 27.8%, 38.6% 26.7%, 40.1% 25.6%, 41.7% 24.5%, 43.4% 23.4%, 45.1% 22.4%, 47% 21.4%, 49% 20.5%, 51.1% 19.6%, 53.3% 18.8%, 55.6% 18.1%, 58.1% 17.6%, 60.7% 17.2%, 63.3% 17%, 66% 17.1%, 68.8% 17.5%, 71.4% 18.2%, 73.9% 19.4%, 76.2% 20.9%, 78.3% 22.7%, 79.9% 24.9%, 81.2% 27.3%, 82.2% 29.9%, 82.7% 32.6%, 83% 35.3%, 82.9% 38%, 82.6% 40.6%, 82.2% 43.2%, 81.5% 45.6%, 80.8% 47.8%)",
+	pentagon: "polygon(82% 50%, 81.3% 52.2%, 80.6% 54.3%, 79.9% 56.4%, 79.2% 58.4%, 78.5% 60.4%, 77.9% 62.4%, 77.2% 64.5%, 76.5% 66.5%, 75.8% 68.7%, 75% 71%, 74.2% 73.4%, 73.1% 75.7%, 71.6% 77.7%, 69.7% 79.2%, 67.5% 80.3%, 65.1% 80.9%, 62.5% 81%, 60.1% 81%, 57.7% 81%, 55.5% 81%, 53.3% 81%, 51.1% 81%, 48.9% 81%, 46.7% 81%, 44.5% 81%, 42.3% 81%, 39.9% 81%, 37.5% 81%, 34.9% 80.9%, 32.5% 80.3%, 30.3% 79.2%, 28.4% 77.7%, 26.9% 75.7%, 25.8% 73.4%, 25% 71%, 24.2% 68.7%, 23.5% 66.5%, 22.8% 64.5%, 22.1% 62.4%, 21.5% 60.4%, 20.8% 58.4%, 20.1% 56.4%, 19.4% 54.3%, 18.7% 52.2%, 18% 50%, 17.3% 47.7%, 17% 45.4%, 17.3% 43%, 18% 40.8%, 19.2% 38.8%, 20.9% 37%, 22.9% 35.6%, 24.8% 34.2%, 26.6% 33%, 28.3% 31.8%, 29.9% 30.6%, 31.5% 29.5%, 33.1% 28.4%, 34.7% 27.3%, 36.2% 26.1%, 37.8% 25%, 39.4% 23.9%, 41.1% 22.7%, 42.9% 21.4%, 44.8% 20.3%, 46.8% 19.4%, 48.9% 19%, 51.1% 19%, 53.2% 19.4%, 55.2% 20.3%, 57.1% 21.4%, 58.9% 22.7%, 60.6% 23.9%, 62.2% 25%, 63.8% 26.1%, 65.3% 27.3%, 66.9% 28.4%, 68.5% 29.5%, 70.1% 30.6%, 71.7% 31.8%, 73.4% 33%, 75.2% 34.2%, 77.1% 35.6%, 79.1% 37%, 80.8% 38.8%, 82% 40.8%, 82.7% 43%, 83% 45.4%, 82.7% 47.7%)",
+	pill: "polygon(82.6% 50%, 82.1% 52.2%, 81.4% 54.4%, 80.6% 56.5%, 79.7% 58.5%, 78.6% 60.4%, 77.4% 62.2%, 76.1% 63.9%, 74.7% 65.4%, 73.2% 66.9%, 71.8% 68.3%, 70.4% 69.7%, 69% 71.1%, 67.6% 72.5%, 66.2% 73.9%, 64.7% 75.4%, 63.1% 76.8%, 61.3% 78%, 59.5% 79.2%, 57.5% 80.2%, 55.5% 81.1%, 53.3% 81.8%, 51.1% 82.4%, 48.9% 82.7%, 46.5% 83%, 44.2% 82.9%, 41.9% 82.6%, 39.5% 82.2%, 37.2% 81.7%, 34.9% 80.9%, 32.7% 79.9%, 30.6% 78.7%, 28.6% 77.4%, 26.7% 75.9%, 25% 74.2%, 23.4% 72.4%, 21.9% 70.4%, 20.7% 68.3%, 19.6% 66.2%, 18.7% 63.9%, 18% 61.6%, 17.5% 59.3%, 17.2% 57%, 17% 54.6%, 17.1% 52.3%, 17.4% 50%, 17.9% 47.8%, 18.6% 45.6%, 19.4% 43.5%, 20.3% 41.5%, 21.4% 39.6%, 22.6% 37.8%, 23.9% 36.1%, 25.3% 34.6%, 26.8% 33.1%, 28.2% 31.7%, 29.6% 30.3%, 31% 28.9%, 32.4% 27.5%, 33.8% 26.1%, 35.3% 24.6%, 36.9% 23.2%, 38.7% 22%, 40.5% 20.8%, 42.5% 19.8%, 44.5% 18.9%, 46.7% 18.2%, 48.9% 17.6%, 51.1% 17.3%, 53.5% 17%, 55.8% 17.1%, 58.1% 17.4%, 60.5% 17.8%, 62.8% 18.3%, 65.1% 19.1%, 67.3% 20.1%, 69.4% 21.3%, 71.4% 22.6%, 73.3% 24.1%, 75% 25.8%, 76.6% 27.6%, 78.1% 29.6%, 79.3% 31.7%, 80.4% 33.8%, 81.3% 36.1%, 82% 38.4%, 82.5% 40.7%, 82.8% 43%, 83% 45.4%, 82.9% 47.7%)",
+	softBurst: "polygon(76% 50%, 76.5% 51.9%, 78.3% 54%, 80.4% 56.5%, 81.5% 59%, 80.8% 61.2%, 78.3% 62.6%, 75.2% 63.4%, 72.5% 64.1%, 71% 65.3%, 70.4% 67.1%, 70.5% 69.8%, 70.8% 73.1%, 70.2% 75.9%, 68.3% 77.2%, 65.5% 76.9%, 62.5% 75.6%, 60% 74.6%, 58% 74.7%, 56.4% 75.8%, 55% 78.1%, 53.2% 80.9%, 51.1% 82.8%, 48.9% 82.8%, 46.8% 80.8%, 45% 78.1%, 43.6% 75.8%, 42% 74.7%, 40% 74.7%, 37.5% 75.7%, 34.5% 76.9%, 31.6% 77.2%, 29.8% 75.9%, 29.2% 73%, 29.5% 69.8%, 29.6% 67.1%, 29% 65.3%, 27.5% 64.1%, 24.8% 63.4%, 21.6% 62.6%, 19.2% 61.2%, 18.5% 59%, 19.7% 56.4%, 21.8% 54%, 23.5% 51.9%, 24% 50%, 23.5% 48.1%, 21.7% 46%, 19.6% 43.5%, 18.5% 41%, 19.2% 38.8%, 21.7% 37.4%, 24.8% 36.6%, 27.5% 35.9%, 29% 34.7%, 29.6% 32.9%, 29.5% 30.2%, 29.2% 26.9%, 29.8% 24.1%, 31.7% 22.8%, 34.5% 23.1%, 37.5% 24.4%, 40% 25.4%, 42% 25.3%, 43.6% 24.2%, 45% 21.9%, 46.8% 19.1%, 48.9% 17.2%, 51.1% 17.2%, 53.2% 19.2%, 55% 21.9%, 56.4% 24.2%, 58% 25.3%, 60% 25.3%, 62.5% 24.3%, 65.5% 23.1%, 68.4% 22.8%, 70.2% 24.1%, 70.8% 27%, 70.5% 30.2%, 70.4% 32.9%, 71% 34.7%, 72.5% 35.9%, 75.2% 36.6%, 78.4% 37.4%, 80.8% 38.8%, 81.5% 41%, 80.3% 43.6%, 78.2% 46%, 76.5% 48.1%)",
+	sunny: "polygon(83% 50%, 82.5% 52.3%, 80.9% 54.3%, 79.3% 56.2%, 77.8% 58%, 76.4% 59.6%, 75.6% 61.4%, 75.4% 63.5%, 75.2% 65.7%, 75% 68.2%, 74.7% 70.8%, 73.7% 72.9%, 71.9% 74.3%, 69.4% 74.9%, 66.9% 75.1%, 64.6% 75.3%, 62.4% 75.4%, 60.5% 75.9%, 58.8% 77.1%, 57.1% 78.6%, 55.3% 80.1%, 53.3% 81.8%, 51.1% 82.9%, 48.9% 82.9%, 46.7% 81.8%, 44.7% 80.1%, 42.9% 78.6%, 41.2% 77.1%, 39.5% 75.9%, 37.6% 75.4%, 35.4% 75.3%, 33.1% 75.1%, 30.6% 74.9%, 28.1% 74.3%, 26.3% 72.9%, 25.3% 70.8%, 25% 68.2%, 24.8% 65.7%, 24.6% 63.5%, 24.4% 61.4%, 23.6% 59.6%, 22.2% 58%, 20.7% 56.2%, 19.1% 54.3%, 17.5% 52.3%, 17% 50%, 17.5% 47.7%, 19.1% 45.7%, 20.7% 43.8%, 22.2% 42%, 23.6% 40.4%, 24.4% 38.6%, 24.6% 36.5%, 24.8% 34.3%, 25% 31.8%, 25.3% 29.2%, 26.3% 27.1%, 28.1% 25.7%, 30.6% 25.1%, 33.1% 24.9%, 35.4% 24.7%, 37.6% 24.6%, 39.5% 24.1%, 41.2% 22.9%, 42.9% 21.4%, 44.7% 19.9%, 46.7% 18.2%, 48.9% 17.1%, 51.1% 17.1%, 53.3% 18.2%, 55.3% 19.9%, 57.1% 21.4%, 58.8% 22.9%, 60.5% 24.1%, 62.4% 24.6%, 64.6% 24.7%, 66.9% 24.9%, 69.4% 25.1%, 71.9% 25.7%, 73.7% 27.1%, 74.7% 29.2%, 75% 31.8%, 75.2% 34.3%, 75.4% 36.5%, 75.6% 38.6%, 76.4% 40.4%, 77.8% 42%, 79.3% 43.8%, 80.9% 45.7%, 82.5% 47.7%)"
+};
+const SIZE = 48;
+const BOX = 100;
+const CENTRE = BOX / 2;
+const SEQUENCE = [
+	SHAPES.softBurst,
+	SHAPES.cookie9Sided,
+	SHAPES.pentagon,
+	SHAPES.pill,
+	SHAPES.sunny,
+	SHAPES.cookie4Sided,
+	SHAPES.oval
+].map((polygon) => (polygon.match(/\d+(?:\.\d+)?/gu) ?? []).map(Number));
+const MORPH_MS = 650;
+const MORPH_CYCLE_MS = MORPH_MS * SEQUENCE.length;
+const QUARTERS = 4;
+const TURN_CYCLE_MS = MORPH_MS * QUARTERS;
+const SPIN_MS = 4666;
+const SLOWDOWN = 1.25;
+const SPRING = [
+	0,
+	.054,
+	.185,
+	.352,
+	.527,
+	.69,
+	.827,
+	.934,
+	1.011,
+	1.06,
+	1.086,
+	1.095,
+	1.091,
+	1.079,
+	1.063,
+	1.047,
+	1.031,
+	1.018,
+	1.007,
+	1,
+	.995,
+	.992,
+	.991,
+	.991,
+	.992,
+	.994,
+	1
+].map((value, index, samples) => [index / (samples.length - 1), value]);
+const AnimatedPath = Animated.createAnimatedComponent(Path);
+const stylesOf = themedStyles(({ colors, radii }) => StyleSheet.create({
+	contained: { backgroundColor: colors.primaryContainer },
+	root: {
+		alignItems: "center",
+		borderRadius: radii.circle,
+		flexShrink: 0,
+		height: SIZE,
+		justifyContent: "center",
+		width: SIZE
+	}
+}));
+/**
+* A shape morphing as it turns, for a wait of a few seconds whose length is
+* not worth showing, where it would otherwise be an indeterminate ring.
+*
+* ```tsx
+* <LoadingIndicator aria-label="Label" />
+* ```
+*
+* A screen reader hears it as a busy progress bar. Name it with
+* `aria-label`, or `aria-labelledby` where something on the screen already
+* says what is loading. `style`, `ref` and `testID` land on the container,
+* which is the view a layout positions.
+*/
+function LoadingIndicator(t0) {
+	const $ = c(14);
+	let props;
+	let style;
+	let t1;
+	if ($[0] !== t0) {
+		({contained: t1, style, ...props} = t0);
+		$[0] = t0;
+		$[1] = props;
+		$[2] = style;
+		$[3] = t1;
+	} else {
+		props = $[1];
+		style = $[2];
+		t1 = $[3];
+	}
+	const contained = t1 === void 0 ? false : t1;
+	const theme = useTheme();
+	const own = stylesOf(theme);
+	const slowdown = useReducedMotion() ? SLOWDOWN : 1;
+	const morph = useLoop(MORPH_CYCLE_MS * slowdown, true);
+	const turn = useLoop(TURN_CYCLE_MS * slowdown, true);
+	let t2;
+	if ($[4] !== slowdown) {
+		t2 = Math.round(SPIN_MS * slowdown);
+		$[4] = slowdown;
+		$[5] = t2;
+	} else t2 = $[5];
+	const spin = useLoop(t2, true);
+	const shape = useAnimatedProps(() => {
+		"worklet";
+		const morphed = morph.get() * SEQUENCE.length;
+		const from = Math.min(Math.floor(morphed), SEQUENCE.length - 1);
+		const turned = turn.get() * QUARTERS;
+		const quarter = Math.floor(turned);
+		const angle = TURN * ((quarter + keyframeAt(SPRING, turned - quarter)) / QUARTERS + spin.get());
+		return { d: shapePath(SEQUENCE[from], SEQUENCE[(from + 1) % SEQUENCE.length], keyframeAt(SPRING, morphed - from), angle, CENTRE) };
+	});
+	const T0 = View;
+	const t3 = true;
+	const t4 = true;
+	const t5 = "progressbar";
+	const t6 = composeStyles(own.root, contained ? own.contained : void 0, style);
+	const t7 = contained ? theme.colors.onPrimaryContainer : theme.colors.primary;
+	let t8;
+	if ($[6] !== shape || $[7] !== t7) {
+		t8 = /* @__PURE__ */ jsx(Svg, {
+			...HIDDEN,
+			height: SIZE,
+			viewBox: `0 0 ${BOX} ${BOX}`,
+			width: SIZE,
+			children: /* @__PURE__ */ jsx(AnimatedPath, {
+				animatedProps: shape,
+				fill: t7
+			})
+		});
+		$[6] = shape;
+		$[7] = t7;
+		$[8] = t8;
+	} else t8 = $[8];
+	let t9;
+	if ($[9] !== T0 || $[10] !== props || $[11] !== t6 || $[12] !== t8) {
+		t9 = /* @__PURE__ */ jsx(T0, {
+			accessible: t3,
+			"aria-busy": t4,
+			role: t5,
+			...props,
+			style: t6,
+			children: t8
+		});
+		$[9] = T0;
+		$[10] = props;
+		$[11] = t6;
+		$[12] = t8;
+		$[13] = t9;
+	} else t9 = $[13];
+	return t9;
+}
+//#endregion
+export { LoadingIndicator };
+
+//# sourceMappingURL=index.js.map

package/dist/components/loading-indicator/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["ComponentRef","Ref","StyleProp","ViewProps","ViewStyle","StyleSheet","View","Animated","useAnimatedProps","useReducedMotion","Svg","Path","Keyframe","HIDDEN","keyframeAt","useLoop","shapePath","TURN","useTheme","composeStyles","themedStyles","LoadingIndicatorProps","Omit","contained","ref","style","SHAPES","cookie4Sided","cookie9Sided","oval","pentagon","pill","softBurst","sunny","const","SIZE","BOX","CENTRE","SEQUENCE","map","polygon","match","Number","MORPH_MS","MORPH_CYCLE_MS","length","QUARTERS","TURN_CYCLE_MS","SPIN_MS","SLOWDOWN","SPRING","value","index","samples","AnimatedPath","createAnimatedComponent","stylesOf","colors","radii","create","backgroundColor","primaryContainer","root","alignItems","borderRadius","circle","flexShrink","height","justifyContent","width","LoadingIndicator","t0","$","_c","props","t1","undefined","theme","own","reduceMotion","slowdown","morph","turn","t2","Math","round","spin","shape","morphed","get","from","min","floor","turned","quarter","angle","d","T0","t3","t4","t5","t6","t7","onPrimaryContainer","primary","t8","t9","_c"],"sources":["../../../src/components/loading-indicator/index.tsx"],"sourcesContent":["import type { ComponentRef, Ref } from 'react'\nimport type { StyleProp, ViewProps, ViewStyle } from 'react-native'\n\nimport { StyleSheet, View } from 'react-native'\nimport Animated, {\n  useAnimatedProps,\n  useReducedMotion,\n} from 'react-native-reanimated'\nimport Svg, { Path } from 'react-native-svg'\n\nimport type { Keyframe } from '../../indicator/motion'\n\nimport { HIDDEN } from '../../glyphs/hidden'\nimport { keyframeAt, useLoop } from '../../indicator/motion'\nimport { shapePath, TURN } from '../../indicator/paths'\nimport { useTheme } from '../../theme/scope'\nimport { composeStyles, themedStyles } from '../../theme/styles'\n\n// The loading indicator page's indicator, as kanso-ui's LoadingIndicator\n// draws it, at https://m3.material.io/components/loading-indicator/specs: a\n// shape that morphs through a sequence of seven while it turns, for a wait\n// short enough that how long it takes is not worth showing. It is\n// indeterminate: it says that something is happening, and a screen reader\n// hears it as a busy progress bar with no value.\n//\n// The page's tokens are a 48dp container with a full corner and a 38dp\n// active indicator inside it. Uncontained, the container is transparent and\n// the shape is primary; contained, the container is primary container and\n// the shape on primary container, for an indicator drawn over content rather\n// than beside it.\n//\n// The seven shapes are web's, in the page's order: soft burst, nine-sided\n// cookie, pentagon, pill, sunny, four-sided cookie and oval. Each is the\n// polygon Material's own shape library builds for it, traced as 90 points at\n// 4° steps round its centre and scaled so the widest still fits the 38dp\n// indicator at every angle it turns through. They are web's `clip-path`\n// polygons as written, in percentages of the container, which an svg drawn\n// over the container on a 100-unit box reads as they stand. Web interpolates\n// one polygon into the next; here the path is built each frame from the two\n// shapes either side of the clock, point by point, which is the same\n// interpolation drawn on the UI thread.\n//\n// The timing is web's too. Each morph takes the 650ms interval it starts, on\n// a spring of damping ratio 0.6 and stiffness 200 that overshoots by about a\n// tenth and settles inside the interval, and every morph turns the shape a\n// further quarter on the same spring, over a constant turn of the whole every\n// 4666ms. The spring is web's samples of it, read off the morph's clock, so\n// each morph lands on its shape exactly as the next interval starts and the\n// cycle of seven loops back to the first; a spring run by Reanimated's\n// physics settles by a threshold rather than on the interval, and would drift\n// off the beat the quarter turns keep. The quarter turns run on a cycle of\n// their own, four to a full turn, beside the morph's cycle of seven.\n//\n// Under reduced motion it slows rather than stopping, as the progress\n// indicator's ring does and for its reason: an indicator that freezes stops\n// saying the work is going on. The multiplier is the ring's.\n\ntype LoadingIndicatorProps = Omit<ViewProps, 'children' | 'style'> & {\n  /**\n   * Draws the shape on a circular container in the primary container pair,\n   * for an indicator drawn over content, such as a list being refreshed or an\n   * image being fetched, where a bare shape would have nothing behind it to\n   * read against.\n   * @default false\n   */\n  readonly contained?: boolean\n  readonly ref?: Ref<ComponentRef<typeof View>>\n  readonly style?: StyleProp<ViewStyle>\n}\n\nconst SHAPES = {\n  cookie4Sided:\n    'polygon(79% 50%, 79.1% 52%, 79.6% 54.2%, 80.4% 56.5%, 81.5% 59%, 82.5% 61.8%, 82.9% 64.7%, 82.9% 67.5%, 82.4% 70.3%, 81.5% 72.9%, 80.2% 75.3%, 78.5% 77.5%, 76.4% 79.4%, 74.1% 80.9%, 71.6% 82%, 68.9% 82.7%, 66.1% 83%, 63.2% 82.8%, 60.4% 82.1%, 57.7% 80.9%, 55.3% 79.9%, 53.1% 79.3%, 51% 79%, 49% 79%, 46.9% 79.3%, 44.7% 79.9%, 42.3% 81%, 39.6% 82.1%, 36.8% 82.8%, 33.9% 83%, 31.1% 82.7%, 28.4% 82%, 25.9% 80.9%, 23.6% 79.4%, 21.5% 77.5%, 19.8% 75.3%, 18.5% 72.9%, 17.6% 70.3%, 17.1% 67.5%, 17.1% 64.7%, 17.5% 61.8%, 18.5% 59%, 19.6% 56.5%, 20.4% 54.2%, 20.9% 52%, 21% 50%, 20.9% 48%, 20.4% 45.8%, 19.6% 43.5%, 18.5% 41%, 17.5% 38.2%, 17.1% 35.3%, 17.1% 32.5%, 17.6% 29.7%, 18.5% 27.1%, 19.8% 24.7%, 21.5% 22.5%, 23.6% 20.6%, 25.9% 19.1%, 28.4% 18%, 31.1% 17.3%, 33.9% 17%, 36.8% 17.2%, 39.6% 17.9%, 42.3% 19.1%, 44.7% 20.1%, 46.9% 20.7%, 49% 21%, 51% 21%, 53.1% 20.7%, 55.3% 20.1%, 57.7% 19%, 60.4% 17.9%, 63.2% 17.2%, 66.1% 17%, 68.9% 17.3%, 71.6% 18%, 74.1% 19.1%, 76.4% 20.6%, 78.5% 22.5%, 80.2% 24.7%, 81.5% 27.1%, 82.4% 29.7%, 82.9% 32.5%, 82.9% 35.3%, 82.5% 38.2%, 81.5% 41%, 80.4% 43.5%, 79.6% 45.8%, 79.1% 48%)',\n  cookie9Sided:\n    'polygon(82.5% 50%, 81.4% 52.2%, 80.4% 54.3%, 79.9% 56.4%, 79.8% 58.6%, 80.2% 61%, 80.2% 63.4%, 79.6% 65.8%, 78.6% 67.9%, 77.1% 69.7%, 75.2% 71.1%, 72.9% 72.1%, 70.8% 73.1%, 69.1% 74.4%, 67.6% 76.1%, 66.3% 78.3%, 64.7% 80.1%, 62.7% 81.4%, 60.5% 82.3%, 58.1% 82.6%, 55.7% 82.4%, 53.3% 81.7%, 51.1% 81.2%, 48.9% 81.2%, 46.7% 81.7%, 44.3% 82.4%, 41.9% 82.6%, 39.5% 82.3%, 37.3% 81.4%, 35.3% 80.1%, 33.7% 78.3%, 32.4% 76.1%, 30.9% 74.4%, 29.2% 73.1%, 27.1% 72.1%, 24.8% 71.1%, 22.9% 69.7%, 21.4% 67.9%, 20.4% 65.8%, 19.8% 63.4%, 19.8% 61%, 20.2% 58.6%, 20.1% 56.4%, 19.6% 54.3%, 18.6% 52.2%, 17.5% 50%, 17.1% 47.7%, 17.1% 45.4%, 17.7% 43.1%, 18.7% 41%, 20.3% 39.2%, 22.1% 37.6%, 23.4% 35.9%, 24.4% 34%, 24.9% 31.8%, 25.5% 29.5%, 26.6% 27.4%, 28.1% 25.6%, 29.9% 24.2%, 32% 23.3%, 34.3% 22.8%, 36.7% 22.7%, 38.8% 22.4%, 40.8% 21.6%, 42.6% 20.4%, 44.5% 18.9%, 46.6% 17.9%, 48.9% 17.4%, 51.1% 17.4%, 53.4% 17.9%, 55.5% 18.9%, 57.4% 20.4%, 59.2% 21.6%, 61.2% 22.4%, 63.3% 22.7%, 65.7% 22.8%, 68% 23.3%, 70.1% 24.2%, 71.9% 25.6%, 73.4% 27.4%, 74.5% 29.5%, 75.1% 31.8%, 75.6% 34%, 76.6% 35.9%, 77.9% 37.6%, 79.7% 39.2%, 81.3% 41%, 82.3% 43.1%, 82.9% 45.4%, 82.9% 47.7%)',\n  oval: 'polygon(80% 50%, 79% 52%, 78.1% 53.9%, 77.1% 55.8%, 76% 57.5%, 75% 59.1%, 73.9% 60.6%, 72.8% 62.1%, 71.7% 63.5%, 70.5% 64.9%, 69.3% 66.2%, 68.1% 67.5%, 66.8% 68.7%, 65.6% 69.9%, 64.2% 71.1%, 62.8% 72.2%, 61.4% 73.3%, 59.9% 74.4%, 58.3% 75.5%, 56.6% 76.6%, 54.9% 77.6%, 53% 78.6%, 51% 79.5%, 48.9% 80.4%, 46.7% 81.2%, 44.4% 81.9%, 41.9% 82.4%, 39.3% 82.8%, 36.7% 83%, 34% 82.9%, 31.2% 82.5%, 28.6% 81.8%, 26.1% 80.6%, 23.8% 79.1%, 21.7% 77.3%, 20.1% 75.1%, 18.8% 72.7%, 17.8% 70.1%, 17.3% 67.4%, 17% 64.7%, 17.1% 62%, 17.4% 59.4%, 17.8% 56.8%, 18.5% 54.4%, 19.2% 52.2%, 20% 50%, 21% 48%, 21.9% 46.1%, 22.9% 44.2%, 24% 42.5%, 25% 40.9%, 26.1% 39.4%, 27.2% 37.9%, 28.3% 36.5%, 29.5% 35.1%, 30.7% 33.8%, 31.9% 32.5%, 33.2% 31.3%, 34.4% 30.1%, 35.8% 28.9%, 37.2% 27.8%, 38.6% 26.7%, 40.1% 25.6%, 41.7% 24.5%, 43.4% 23.4%, 45.1% 22.4%, 47% 21.4%, 49% 20.5%, 51.1% 19.6%, 53.3% 18.8%, 55.6% 18.1%, 58.1% 17.6%, 60.7% 17.2%, 63.3% 17%, 66% 17.1%, 68.8% 17.5%, 71.4% 18.2%, 73.9% 19.4%, 76.2% 20.9%, 78.3% 22.7%, 79.9% 24.9%, 81.2% 27.3%, 82.2% 29.9%, 82.7% 32.6%, 83% 35.3%, 82.9% 38%, 82.6% 40.6%, 82.2% 43.2%, 81.5% 45.6%, 80.8% 47.8%)',\n  pentagon:\n    'polygon(82% 50%, 81.3% 52.2%, 80.6% 54.3%, 79.9% 56.4%, 79.2% 58.4%, 78.5% 60.4%, 77.9% 62.4%, 77.2% 64.5%, 76.5% 66.5%, 75.8% 68.7%, 75% 71%, 74.2% 73.4%, 73.1% 75.7%, 71.6% 77.7%, 69.7% 79.2%, 67.5% 80.3%, 65.1% 80.9%, 62.5% 81%, 60.1% 81%, 57.7% 81%, 55.5% 81%, 53.3% 81%, 51.1% 81%, 48.9% 81%, 46.7% 81%, 44.5% 81%, 42.3% 81%, 39.9% 81%, 37.5% 81%, 34.9% 80.9%, 32.5% 80.3%, 30.3% 79.2%, 28.4% 77.7%, 26.9% 75.7%, 25.8% 73.4%, 25% 71%, 24.2% 68.7%, 23.5% 66.5%, 22.8% 64.5%, 22.1% 62.4%, 21.5% 60.4%, 20.8% 58.4%, 20.1% 56.4%, 19.4% 54.3%, 18.7% 52.2%, 18% 50%, 17.3% 47.7%, 17% 45.4%, 17.3% 43%, 18% 40.8%, 19.2% 38.8%, 20.9% 37%, 22.9% 35.6%, 24.8% 34.2%, 26.6% 33%, 28.3% 31.8%, 29.9% 30.6%, 31.5% 29.5%, 33.1% 28.4%, 34.7% 27.3%, 36.2% 26.1%, 37.8% 25%, 39.4% 23.9%, 41.1% 22.7%, 42.9% 21.4%, 44.8% 20.3%, 46.8% 19.4%, 48.9% 19%, 51.1% 19%, 53.2% 19.4%, 55.2% 20.3%, 57.1% 21.4%, 58.9% 22.7%, 60.6% 23.9%, 62.2% 25%, 63.8% 26.1%, 65.3% 27.3%, 66.9% 28.4%, 68.5% 29.5%, 70.1% 30.6%, 71.7% 31.8%, 73.4% 33%, 75.2% 34.2%, 77.1% 35.6%, 79.1% 37%, 80.8% 38.8%, 82% 40.8%, 82.7% 43%, 83% 45.4%, 82.7% 47.7%)',\n  pill: 'polygon(82.6% 50%, 82.1% 52.2%, 81.4% 54.4%, 80.6% 56.5%, 79.7% 58.5%, 78.6% 60.4%, 77.4% 62.2%, 76.1% 63.9%, 74.7% 65.4%, 73.2% 66.9%, 71.8% 68.3%, 70.4% 69.7%, 69% 71.1%, 67.6% 72.5%, 66.2% 73.9%, 64.7% 75.4%, 63.1% 76.8%, 61.3% 78%, 59.5% 79.2%, 57.5% 80.2%, 55.5% 81.1%, 53.3% 81.8%, 51.1% 82.4%, 48.9% 82.7%, 46.5% 83%, 44.2% 82.9%, 41.9% 82.6%, 39.5% 82.2%, 37.2% 81.7%, 34.9% 80.9%, 32.7% 79.9%, 30.6% 78.7%, 28.6% 77.4%, 26.7% 75.9%, 25% 74.2%, 23.4% 72.4%, 21.9% 70.4%, 20.7% 68.3%, 19.6% 66.2%, 18.7% 63.9%, 18% 61.6%, 17.5% 59.3%, 17.2% 57%, 17% 54.6%, 17.1% 52.3%, 17.4% 50%, 17.9% 47.8%, 18.6% 45.6%, 19.4% 43.5%, 20.3% 41.5%, 21.4% 39.6%, 22.6% 37.8%, 23.9% 36.1%, 25.3% 34.6%, 26.8% 33.1%, 28.2% 31.7%, 29.6% 30.3%, 31% 28.9%, 32.4% 27.5%, 33.8% 26.1%, 35.3% 24.6%, 36.9% 23.2%, 38.7% 22%, 40.5% 20.8%, 42.5% 19.8%, 44.5% 18.9%, 46.7% 18.2%, 48.9% 17.6%, 51.1% 17.3%, 53.5% 17%, 55.8% 17.1%, 58.1% 17.4%, 60.5% 17.8%, 62.8% 18.3%, 65.1% 19.1%, 67.3% 20.1%, 69.4% 21.3%, 71.4% 22.6%, 73.3% 24.1%, 75% 25.8%, 76.6% 27.6%, 78.1% 29.6%, 79.3% 31.7%, 80.4% 33.8%, 81.3% 36.1%, 82% 38.4%, 82.5% 40.7%, 82.8% 43%, 83% 45.4%, 82.9% 47.7%)',\n  softBurst:\n    'polygon(76% 50%, 76.5% 51.9%, 78.3% 54%, 80.4% 56.5%, 81.5% 59%, 80.8% 61.2%, 78.3% 62.6%, 75.2% 63.4%, 72.5% 64.1%, 71% 65.3%, 70.4% 67.1%, 70.5% 69.8%, 70.8% 73.1%, 70.2% 75.9%, 68.3% 77.2%, 65.5% 76.9%, 62.5% 75.6%, 60% 74.6%, 58% 74.7%, 56.4% 75.8%, 55% 78.1%, 53.2% 80.9%, 51.1% 82.8%, 48.9% 82.8%, 46.8% 80.8%, 45% 78.1%, 43.6% 75.8%, 42% 74.7%, 40% 74.7%, 37.5% 75.7%, 34.5% 76.9%, 31.6% 77.2%, 29.8% 75.9%, 29.2% 73%, 29.5% 69.8%, 29.6% 67.1%, 29% 65.3%, 27.5% 64.1%, 24.8% 63.4%, 21.6% 62.6%, 19.2% 61.2%, 18.5% 59%, 19.7% 56.4%, 21.8% 54%, 23.5% 51.9%, 24% 50%, 23.5% 48.1%, 21.7% 46%, 19.6% 43.5%, 18.5% 41%, 19.2% 38.8%, 21.7% 37.4%, 24.8% 36.6%, 27.5% 35.9%, 29% 34.7%, 29.6% 32.9%, 29.5% 30.2%, 29.2% 26.9%, 29.8% 24.1%, 31.7% 22.8%, 34.5% 23.1%, 37.5% 24.4%, 40% 25.4%, 42% 25.3%, 43.6% 24.2%, 45% 21.9%, 46.8% 19.1%, 48.9% 17.2%, 51.1% 17.2%, 53.2% 19.2%, 55% 21.9%, 56.4% 24.2%, 58% 25.3%, 60% 25.3%, 62.5% 24.3%, 65.5% 23.1%, 68.4% 22.8%, 70.2% 24.1%, 70.8% 27%, 70.5% 30.2%, 70.4% 32.9%, 71% 34.7%, 72.5% 35.9%, 75.2% 36.6%, 78.4% 37.4%, 80.8% 38.8%, 81.5% 41%, 80.3% 43.6%, 78.2% 46%, 76.5% 48.1%)',\n  sunny:\n    'polygon(83% 50%, 82.5% 52.3%, 80.9% 54.3%, 79.3% 56.2%, 77.8% 58%, 76.4% 59.6%, 75.6% 61.4%, 75.4% 63.5%, 75.2% 65.7%, 75% 68.2%, 74.7% 70.8%, 73.7% 72.9%, 71.9% 74.3%, 69.4% 74.9%, 66.9% 75.1%, 64.6% 75.3%, 62.4% 75.4%, 60.5% 75.9%, 58.8% 77.1%, 57.1% 78.6%, 55.3% 80.1%, 53.3% 81.8%, 51.1% 82.9%, 48.9% 82.9%, 46.7% 81.8%, 44.7% 80.1%, 42.9% 78.6%, 41.2% 77.1%, 39.5% 75.9%, 37.6% 75.4%, 35.4% 75.3%, 33.1% 75.1%, 30.6% 74.9%, 28.1% 74.3%, 26.3% 72.9%, 25.3% 70.8%, 25% 68.2%, 24.8% 65.7%, 24.6% 63.5%, 24.4% 61.4%, 23.6% 59.6%, 22.2% 58%, 20.7% 56.2%, 19.1% 54.3%, 17.5% 52.3%, 17% 50%, 17.5% 47.7%, 19.1% 45.7%, 20.7% 43.8%, 22.2% 42%, 23.6% 40.4%, 24.4% 38.6%, 24.6% 36.5%, 24.8% 34.3%, 25% 31.8%, 25.3% 29.2%, 26.3% 27.1%, 28.1% 25.7%, 30.6% 25.1%, 33.1% 24.9%, 35.4% 24.7%, 37.6% 24.6%, 39.5% 24.1%, 41.2% 22.9%, 42.9% 21.4%, 44.7% 19.9%, 46.7% 18.2%, 48.9% 17.1%, 51.1% 17.1%, 53.3% 18.2%, 55.3% 19.9%, 57.1% 21.4%, 58.8% 22.9%, 60.5% 24.1%, 62.4% 24.6%, 64.6% 24.7%, 66.9% 24.9%, 69.4% 25.1%, 71.9% 25.7%, 73.7% 27.1%, 74.7% 29.2%, 75% 31.8%, 75.2% 34.3%, 75.4% 36.5%, 75.6% 38.6%, 76.4% 40.4%, 77.8% 42%, 79.3% 43.8%, 80.9% 45.7%, 82.5% 47.7%)',\n} as const\n\n// The container's side, and the box the shapes' percentages are read on.\nconst SIZE = 48\nconst BOX = 100\nconst CENTRE = BOX / 2\n\n// The shapes in the order they morph through, each as its points' numbers,\n// x then y, read out of its polygon.\nconst SEQUENCE = [\n  SHAPES.softBurst,\n  SHAPES.cookie9Sided,\n  SHAPES.pentagon,\n  SHAPES.pill,\n  SHAPES.sunny,\n  SHAPES.cookie4Sided,\n  SHAPES.oval,\n].map((polygon) => (polygon.match(/\\d+(?:\\.\\d+)?/gu) ?? []).map(Number))\n\n// One morph's interval, the morph's cycle through all seven, and the quarter\n// turns' cycle of four.\nconst MORPH_MS = 650\nconst MORPH_CYCLE_MS = MORPH_MS * SEQUENCE.length\nconst QUARTERS = 4\nconst TURN_CYCLE_MS = MORPH_MS * QUARTERS\nconst SPIN_MS = 4666\n\n// What reduced motion slows every animation by.\nconst SLOWDOWN = 1.25\n\n// The spring, sampled every 25ms of the 650ms interval, as web's `linear()`\n// writes it. It is within half a percent of rest by the end, and the last\n// sample is rest itself, so a morph lands exactly on its shape before the\n// next begins.\nconst SPRING: readonly Keyframe[] = [\n  0, 0.054, 0.185, 0.352, 0.527, 0.69, 0.827, 0.934, 1.011, 1.06, 1.086, 1.095,\n  1.091, 1.079, 1.063, 1.047, 1.031, 1.018, 1.007, 1, 0.995, 0.992, 0.991,\n  0.991, 0.992, 0.994, 1,\n].map((value, index, samples): Keyframe => [\n  index / (samples.length - 1),\n  value,\n])\n\nconst AnimatedPath = Animated.createAnimatedComponent(Path)\n\nconst stylesOf = themedStyles(({ colors, radii }) =>\n  StyleSheet.create({\n    contained: { backgroundColor: colors.primaryContainer },\n    root: {\n      alignItems: 'center',\n      borderRadius: radii.circle,\n      flexShrink: 0,\n      height: SIZE,\n      justifyContent: 'center',\n      width: SIZE,\n    },\n  }),\n)\n\n/**\n * A shape morphing as it turns, for a wait of a few seconds whose length is\n * not worth showing, where it would otherwise be an indeterminate ring.\n *\n * ```tsx\n * <LoadingIndicator aria-label=\"Label\" />\n * ```\n *\n * A screen reader hears it as a busy progress bar. Name it with\n * `aria-label`, or `aria-labelledby` where something on the screen already\n * says what is loading. `style`, `ref` and `testID` land on the container,\n * which is the view a layout positions.\n */\nfunction LoadingIndicator({\n  contained = false,\n  style,\n  ...props\n}: LoadingIndicatorProps) {\n  const theme = useTheme()\n  const own = stylesOf(theme)\n  const reduceMotion = useReducedMotion()\n  const slowdown = reduceMotion ? SLOWDOWN : 1\n  const morph = useLoop(MORPH_CYCLE_MS * slowdown, true)\n  const turn = useLoop(TURN_CYCLE_MS * slowdown, true)\n  const spin = useLoop(Math.round(SPIN_MS * slowdown), true)\n\n  // The shape between the two either side of the morph's clock, turned by\n  // the quarter turns gone and the one under way, on top of the spin. A\n  // clock that reaches its end is on the last shape's way back to the first,\n  // which is where it starts again.\n  const shape = useAnimatedProps(() => {\n    'worklet'\n    const morphed = morph.get() * SEQUENCE.length\n    const from = Math.min(Math.floor(morphed), SEQUENCE.length - 1)\n    const turned = turn.get() * QUARTERS\n    const quarter = Math.floor(turned)\n    const angle =\n      TURN *\n      ((quarter + keyframeAt(SPRING, turned - quarter)) / QUARTERS + spin.get())\n\n    return {\n      d: shapePath(\n        SEQUENCE[from],\n        SEQUENCE[(from + 1) % SEQUENCE.length],\n        keyframeAt(SPRING, morphed - from),\n        angle,\n        CENTRE,\n      ),\n    }\n  })\n\n  return (\n    <View\n      accessible\n      aria-busy\n      role=\"progressbar\"\n      {...props}\n      style={composeStyles<ViewStyle>(\n        own.root,\n        contained ? own.contained : undefined,\n        style,\n      )}\n    >\n      <Svg {...HIDDEN} height={SIZE} viewBox={`0 0 ${BOX} ${BOX}`} width={SIZE}>\n        <AnimatedPath\n          animatedProps={shape}\n          fill={\n            contained ? theme.colors.onPrimaryContainer : theme.colors.primary\n          }\n        />\n      </Svg>\n    </View>\n  )\n}\n\nexport { LoadingIndicator }\nexport type { LoadingIndicatorProps }\n"],"mappings":"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"}

package/dist/components/menu/index.js

@@ -6,8 +6,8 @@ import { rowContentColor, rowStyles } from "../../row/styles.js";
 import { RowContent, rowStyleOf } from "../../row/index.js";
 import { useMessages } from "../../i18n/provider.js";
 import { CheckGlyph, ChevronEndGlyph } from "../../glyphs/index.js";
-import { refsOf } from "../../ref/index.js";
 import { useOpenLink } from "../../router/index.js";
+import { refsOf } from "../../ref/index.js";
 import { ButtonSlotContext } from "../../button/slots.js";
 import { ProgressIndicator } from "../progress-indicator/index.js";
 import { DismissLayer, PANEL_ORIGINS, useBackToClose, useFocusOnPlaced, usePanelMotion, useReturnFocus } from "../../overlay/panel.js";