@kanso-labs/kanso-ui 0.30.2 → 0.30.4

package/dist/components/menu/index.d.ts

@@ -1,7 +1,7 @@
 import { OverlayAlign, OverlaySide } from "../../styles/overlay.js";
 import Separator$1 from "../separator/index.js";
 import { ComponentProps, ReactElement, ReactNode } from "react";
-import { MenuItemProps, MenuLoadMoreItemProps, MenuProps, MenuSectionProps, MenuTriggerProps } from "react-aria-components";
+import { ClassNameOrFunction, MenuItemProps, MenuLoadMoreItemProps, MenuProps, MenuSectionProps, MenuTriggerProps, PopoverRenderProps, StyleOrFunction } from "react-aria-components";
 //#region src/components/menu/index.d.ts
 type MenuAlign = OverlayAlign;
 type MenuContentProps<T extends object = object> = {
@@ -9,8 +9,11 @@ type MenuContentProps<T extends object = object> = {
   align?: MenuAlign;
   /** Moves the menu along that side, in pixels. */
   alignOffset?: number;
-  /** A function may compute the class from the menu's render state. */
-  className?: MenuProps<T>['className'];
+  /**
+   * Lands on the surface, which is the element a layout positions. A
+   * function may compute the class from the surface's render state.
+   */
+  className?: ClassNameOrFunction<PopoverRenderProps>;
   /**
    * Where to portal the menu. Defaults to the end of `<body>`, which is right
    * for an app that sets its StyleX theme on `:root`. An app that scopes the
@@ -33,8 +36,8 @@ type MenuContentProps<T extends object = object> = {
   side?: MenuSide;
   /** How far the menu sits from the trigger, in pixels. @default 8 */
   sideOffset?: number;
-  /** A function may compute the style from the menu's render state. */
-  style?: MenuProps<T>['style'];
+  /** Lands on the surface, as `className` does. */
+  style?: StyleOrFunction<PopoverRenderProps>;
 } & Omit<MenuProps<T>, 'className' | 'style'>;
 type MenuItemProps$1<T extends object = object> = {
   /** The item's label — what it does. */

package/dist/components/menu/index.js

@@ -87,7 +87,7 @@ function Menu$1(t0) {
 * element a layout positions.
 */
 function MenuContent(t0) {
-	const $ = c(29);
+	const $ = c(28);
 	let alignOffset;
 	let className;
 	let container;
@@ -131,58 +131,53 @@ function MenuContent(t0) {
 		$[12] = t4;
 	} else t4 = $[12];
 	let t5;
-	if ($[13] === Symbol.for("react.memo_cache_sentinel")) {
-		t5 = mergeStatefulStyles(surfaceStyles, {});
-		$[13] = t5;
-	} else t5 = $[13];
+	if ($[13] !== className || $[14] !== style) {
+		t5 = mergeStatefulStyles(surfaceStyles, {
+			className,
+			style
+		});
+		$[13] = className;
+		$[14] = style;
+		$[15] = t5;
+	} else t5 = $[15];
 	let t6;
-	if ($[14] !== search) {
+	if ($[16] !== search) {
 		t6 = search === void 0 ? null : /* @__PURE__ */ jsx("div", {
 			className: "x9f619 xqf7pud xn60lsn",
 			children: search
 		});
-		$[14] = search;
-		$[15] = t6;
-	} else t6 = $[15];
+		$[16] = search;
+		$[17] = t6;
+	} else t6 = $[17];
 	let t7;
-	if ($[16] !== className || $[17] !== style) {
-		t7 = mergeStatefulStyles({ className: "x9f619 x78zum5 xdt5ytf x1t137rt" }, {
-			className,
-			style
-		});
-		$[16] = className;
-		$[17] = style;
-		$[18] = t7;
-	} else t7 = $[18];
-	let t8;
-	if ($[19] !== props || $[20] !== t7) {
-		t8 = /* @__PURE__ */ jsx(Menu, {
+	if ($[18] !== props) {
+		t7 = /* @__PURE__ */ jsx(Menu, {
 			...props,
-			...t7
+			className: "x9f619 x78zum5 xdt5ytf x1t137rt"
 		});
-		$[19] = props;
-		$[20] = t7;
-		$[21] = t8;
-	} else t8 = $[21];
-	let t9;
-	if ($[22] !== alignOffset || $[23] !== container || $[24] !== sideOffset || $[25] !== t4 || $[26] !== t6 || $[27] !== t8) {
-		t9 = /* @__PURE__ */ jsxs(Popover, {
+		$[18] = props;
+		$[19] = t7;
+	} else t7 = $[19];
+	let t8;
+	if ($[20] !== alignOffset || $[21] !== container || $[22] !== sideOffset || $[23] !== t4 || $[24] !== t5 || $[25] !== t6 || $[26] !== t7) {
+		t8 = /* @__PURE__ */ jsxs(Popover, {
 			crossOffset: alignOffset,
 			offset: sideOffset,
 			placement: t4,
 			UNSTABLE_portalContainer: container,
 			...t5,
-			children: [t6, t8]
+			children: [t6, t7]
 		});
-		$[22] = alignOffset;
-		$[23] = container;
-		$[24] = sideOffset;
-		$[25] = t4;
-		$[26] = t6;
+		$[20] = alignOffset;
+		$[21] = container;
+		$[22] = sideOffset;
+		$[23] = t4;
+		$[24] = t5;
+		$[25] = t6;
+		$[26] = t7;
 		$[27] = t8;
-		$[28] = t9;
-	} else t9 = $[28];
-	return t9;
+	} else t8 = $[27];
+	return t8;
 }
 /**
 * One action. Its slots are the row's: `leading` before the label, the label

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["ComponentProps","ReactElement","ReactNode","MenuItemRenderProps","PopoverRenderProps","MenuItemProps","RACMenuItemProps","MenuLoadMoreItemProps","RACMenuLoadMoreItemProps","MenuProps","RACMenuProps","MenuSectionProps","RACMenuSectionProps","MenuTriggerProps","RACMenuTriggerProps","stylex","Header","Keyboard","Menu","RACMenu","MenuItem","RACMenuItem","MenuLoadMoreItem","RACMenuLoadMoreItem","MenuSection","RACMenuSection","MenuTrigger","RACMenuTrigger","Popover","RACPopover","SubmenuTrigger","RACSubmenuTrigger","Text","OverlayAlign","OverlaySide","CollectionLoadMore","ChevronEndGlyph","RowContent","rowStyles","mergeStatefulStyles","mergeStyles","overlay","placementOf","popupOrigin","colors","radii","sizing","spacing","typography","Separator","MENU_MIN","MENU_MAX","styles","content","kWkggS","kaIpWk","ks0D6T","k7Eaqz","k3XXqK","k8WAf4","$$css","MenuAlign","MenuContentProps","align","alignOffset","className","T","container","Element","search","side","MenuSide","sideOffset","style","Omit","children","leading","shortcut","trailing","MenuLoadMoreProps","label","header","MenuSeparatorProps","MenuSubmenuProps","delay","itemContent","state","isDisabled","isSelected","trailingOf","itemStyles","props","base","menu","interactive","selectedMenu","disabled","t0","$","_c","t1","MenuContent","t2","t3","undefined","t4","t5","Symbol","for","surfaceStyles","t6","t7","t8","t9","T0","textValue","textOf","MenuLoadMore","MenuSeparator","MenuSubmenu","popup","placement","hasSubmenu","Content","Item","LoadMore","Section","Submenu"],"sources":["../../../src/components/menu/index.tsx"],"sourcesContent":["import type { ComponentProps, ReactElement, ReactNode } from 'react';\nimport type { MenuItemRenderProps, PopoverRenderProps, MenuItemProps as RACMenuItemProps, MenuLoadMoreItemProps as RACMenuLoadMoreItemProps, MenuProps as RACMenuProps, MenuSectionProps as RACMenuSectionProps, MenuTriggerProps as RACMenuTriggerProps } from 'react-aria-components';\nimport * as stylex from '@stylexjs/stylex';\nimport { Header, Keyboard, Menu as RACMenu, MenuItem as RACMenuItem, MenuLoadMoreItem as RACMenuLoadMoreItem, MenuSection as RACMenuSection, MenuTrigger as RACMenuTrigger, Popover as RACPopover, SubmenuTrigger as RACSubmenuTrigger, Text } from 'react-aria-components';\nimport type { OverlayAlign, OverlaySide } from '../../styles/overlay';\nimport { CollectionLoadMore } from '../../collection';\nimport { ChevronEndGlyph } from '../../glyphs';\nimport { RowContent } from '../../row';\nimport { rowStyles } from '../../row/styles';\nimport { mergeStatefulStyles, mergeStyles } from '../../styles/merge';\nimport { overlay, placementOf, popupOrigin } from '../../styles/overlay';\nimport '../../tokens/design.tokens.stylex';\nimport { colors, radii, sizing, spacing, typography } from '../../tokens/design.tokens.stylex';\nimport Separator from '../separator';\n\n// The menus page's menu: a surface between 112 and 280 wide with a 4dp\n// corner and 8dp above and below its items, holding rows of the row module's\n// menu variant — 48dp tall, a label-large label, tertiary container when\n// selected. The surface itself is the overlay module's, shared with Popover\n// and Sheet, with the two things the menus page decides differently applied\n// over it: the corner, which is the extra-small step rather than the\n// medium one every other overlay takes, and the container colour, which is\n// the Expressive column's surface container low rather than the baseline's\n// surface container.\n//\n// Six parts, because everything a menu holds takes arbitrary content:\n// `Menu.Content`, `Menu.Item`, `Menu.Section`, `Menu.Separator`,\n// `Menu.Submenu` and `Menu.LoadMore`. A `Button` or `IconButton` placed\n// directly inside `Menu` is the trigger, wired through React Aria's context\n// rather than a part of ours — the same arrangement Sheet and Popover use.\n//\n// Four things are worth knowing about how this maps onto React Aria.\n//\n// **The item's styles are a function of its render state.** StyleX cannot\n// target `[data-selected]` on the element it is styling, so selection,\n// disabled and the rest are read from the state React Aria hands the\n// `className` function, wrapped in `mergeStatefulStyles` so a call site's own\n// `className` survives.\n//\n// **A shortcut goes through React Aria's `Keyboard` slot**, and the label\n// through its `Text` slot. The second is what makes the first work: React\n// Aria points the item's `aria-labelledby` at the labelled text, so a screen\n// reader reads the label alone and announces the keystroke separately. Left\n// as plain content, the item's name is its whole text and the shortcut is\n// read as part of what the item does. The keycap itself is the library's.\n//\n// **A submenu's arrow is drawn from render state, not from a prop.** React\n// Aria reports `hasSubmenu` on the item inside a `SubmenuTrigger`, so an item\n// that opens one gets the chevron without the call site saying so twice. The\n// glyph carries no direction of its own, so the style mirrors it under a\n// right-to-left writing mode.\n//\n// **A menu's children are a collection**, so anything that is not an item is\n// dropped: React Aria walks them looking for items and finds a search input\n// no place to be. `Menu.Content` therefore takes a `search` slot, drawn on\n// the surface above the items — which is also what puts the bar and the\n// items inside one `Autocomplete` when the menu is filtered.\n//\n// **A separator needs no slot from the call site.** React Aria's menu\n// provides the separator context, which is what `Menu.Separator` picks up —\n// that is why Separator moved onto React Aria in Phase 0. What is added here\n// is the menus page's 8dp either side of the rule.\n\nconst MENU_MIN = '112px';\nconst MENU_MAX = '280px';\nconst styles = {\n  content: {\n    kWkggS: \"x1vnz5z6\",\n    kaIpWk: \"x1tfhd1\",\n    ks0D6T: \"x1jkqq1h\",\n    k7Eaqz: \"x1c7vg25\",\n    k3XXqK: \"x1t137rt\",\n    k8WAf4: \"x1cmllll\",\n    $$css: true\n  }\n};\ntype MenuAlign = OverlayAlign;\ntype MenuContentProps<T extends object = object> = {\n  /** Where the menu lines up along that side. @default 'start' */\n  align?: MenuAlign;\n  /** Moves the menu along that side, in pixels. */\n  alignOffset?: number;\n  /** A function may compute the class from the menu's render state. */\n  className?: RACMenuProps<T>['className'];\n  /**\n   * Where to portal the menu. Defaults to the end of `<body>`, which is right\n   * for an app that sets its StyleX theme on `:root`. An app that scopes the\n   * theme to a subtree has to point this at an element inside it, or the menu\n   * renders outside the theme and falls back to the tokens'\n   * `prefers-color-scheme` default.\n   */\n  container?: Element;\n  /**\n   * Content drawn on the surface above the items — a search bar that filters\n   * them, usually. It goes here rather than among the children because a\n   * menu's children are a collection: React Aria walks them for items and\n   * drops anything else, so an input written beside them disappears.\n   *\n   * To filter with it, wrap this whole part in `Autocomplete`, which puts\n   * the bar and the items inside one wrapper.\n   */\n  search?: ReactNode;\n  /** Which side of the trigger the menu opens on. @default 'bottom' */\n  side?: MenuSide;\n  /** How far the menu sits from the trigger, in pixels. @default 8 */\n  sideOffset?: number;\n  /** A function may compute the style from the menu's render state. */\n  style?: RACMenuProps<T>['style'];\n} & Omit<RACMenuProps<T>, 'className' | 'style'>;\ntype MenuItemProps<T extends object = object> = {\n  /** The item's label — what it does. */\n  children?: ReactNode;\n  /** A function may compute the class from the item's render state. */\n  className?: RACMenuItemProps<T>['className'];\n  /** Content before the label, usually an icon. */\n  leading?: ReactNode;\n  /**\n   * The keystroke that runs the item, drawn as a keycap at the end. Goes\n   * through React Aria's keyboard slot, so a screen reader announces it\n   * apart from the label rather than reading the two as one name.\n   */\n  shortcut?: ReactNode;\n  /** A function may compute the style from the item's render state. */\n  style?: RACMenuItemProps<T>['style'];\n  /** Content after the label, before the shortcut. */\n  trailing?: ReactNode;\n} & Omit<RACMenuItemProps<T>, 'children' | 'className' | 'style'>;\ntype MenuLoadMoreProps = Omit<RACMenuLoadMoreItemProps, 'children'> & {\n  /**\n   * What the row says while it is loading. Read by a screen reader; the ring\n   * itself carries no text.\n   * @default 'Loading more'\n   */\n  label?: string;\n};\n\n// `children` is optional here where React Aria makes it required, so the\n// type reads the way Sheet's and Popover's do: a root that composes rather\n// than one that has to be handed something. Sheet does the same for the same\n// reason.\ntype MenuProps = Omit<RACMenuTriggerProps, 'children'> & {\n  /** The trigger, then the `Menu.Content` it opens. */\n  children?: ReactNode;\n};\ntype MenuSectionProps<T extends object = object> = Omit<RACMenuSectionProps<T>, 'children'> & {\n  /**\n   * The items in the section. A section built from data puts React Aria's\n   * `Collection` in here rather than a render function, since the header is\n   * an element beside them.\n   */\n  children?: ReactNode;\n  /**\n   * The section's heading, rendered through React Aria's header so the\n   * section is named by it. A section without one is a group with no name.\n   */\n  header?: ReactNode;\n};\ntype MenuSeparatorProps = Omit<ComponentProps<typeof Separator>, 'orientation'>;\ntype MenuSide = OverlaySide;\ntype MenuSubmenuProps = {\n  /**\n   * The item that opens the submenu, then the `Menu.Content` it opens.\n   * Exactly those two, in that order.\n   */\n  children: ReactElement[];\n  /**\n   * How long the pointer rests on the item before the submenu opens, in\n   * milliseconds.\n   * @default 200\n   */\n  delay?: number;\n};\n\n// What the item draws, from React Aria's render state. Built by a call\n// rather than written inline at the prop, which is what react-perf's\n// no-new-function-as-prop is after; the React Compiler memoises the result\n// on its inputs.\n//\n// The render state decides two things: the chevron, which an item inside a\n// SubmenuTrigger gets without the call site asking twice, and the supporting\n// line's colour, which the row module takes from whether the row is selected\n// or disabled.\nfunction itemContent(children: ReactNode, leading: ReactNode, shortcut: ReactNode, trailing: ReactNode) {\n  return (state: MenuItemRenderProps) => <RowContent isDisabled={state.isDisabled} isSelected={state.isSelected} leading={leading} trailing={trailingOf(state, shortcut, trailing)} variant=\"menu\">\n      <Text slot=\"label\">{children}</Text>\n    </RowContent>;\n}\n\n// StyleX cannot target `[data-selected]` on the element it is styling, so an\n// item's state comes from the render state React Aria hands its className.\n// The order matters: `disabled` is applied last so it wins over both the\n// interactive and the selected branches, and StyleX replaces a property\n// whole, so it takes their hover states with it.\n// No overline, and so no three-line row: the menus page gives one item\n// height and one line of text. `List.Item` and `ListBox.Item` take the prop\n// because the lists page is what they draw, and this row is 48dp rather than\n// that page's 56.\nfunction itemStyles(state: MenuItemRenderProps) {\n  return stylex.props(rowStyles.base, rowStyles.menu, rowStyles.interactive, state.isSelected && rowStyles.selectedMenu, state.isDisabled && rowStyles.disabled);\n}\n\n/**\n * A list of actions opened from a control. Open state is React Aria's: pass\n * `isOpen` with `onOpenChange` to control it, or `defaultOpen` to let it keep\n * its own.\n *\n * A `Button` or `IconButton` placed directly inside opens it; everything the\n * menu shows goes in `Menu.Content`, since the trigger lives in the page\n * while the menu is portalled out to the end of the body.\n *\n * ```tsx\n * <Menu>\n *   <Button>Open</Button>\n *   <Menu.Content aria-label=\"Label\">\n *     <Menu.Item id=\"first\">First item</Menu.Item>\n *   </Menu.Content>\n * </Menu>\n * ```\n */\nfunction Menu({\n  children,\n  ...props\n}: MenuProps) {\n  return <RACMenuTrigger {...props}>{children}</RACMenuTrigger>;\n}\n\n/**\n * The menu itself, and the surface it is drawn on. React Aria names it after\n * the control that opened it, so `aria-label` here is ignored — name the\n * trigger instead.\n *\n * The call site's `className` and `style` land on the surface, which is the\n * element a layout positions.\n */\nfunction MenuContent<T extends object = object>({\n  align = 'start',\n  alignOffset,\n  className,\n  container,\n  search,\n  side = 'bottom',\n  sideOffset = 8,\n  style,\n  ...props\n}: MenuContentProps<T>) {\n  return <RACPopover crossOffset={alignOffset} offset={sideOffset} placement={placementOf(side, align)}\n  // oxlint-disable-next-line typescript/no-deprecated -- its replacement, UNSAFE_PortalProvider, is not exported by react-aria-components\n  UNSTABLE_portalContainer={container} {...mergeStatefulStyles(surfaceStyles, {})}>\n      {search === undefined ? null : <div className=\"x9f619 xqf7pud xn60lsn\">{search}</div>}\n      <RACMenu<T> {...props} {...mergeStatefulStyles({\n      className: \"x9f619 x78zum5 xdt5ytf x1t137rt\"\n    }, {\n      className,\n      style\n    })} />\n    </RACPopover>;\n}\n\n/**\n * One action. Its slots are the row's: `leading` before the label, the label\n * as children, and `trailing` after it, with `shortcut` at the end. An item\n * that opens a submenu draws the chevron itself.\n */\nfunction MenuItem<T extends object = object>({\n  children,\n  leading,\n  shortcut,\n  textValue,\n  trailing,\n  ...props\n}: MenuItemProps<T>) {\n  return <RACMenuItem textValue={textValue ?? textOf(children)} {...props} {...mergeStatefulStyles(itemStyles, props)}>\n      {itemContent(children, leading, shortcut, trailing)}\n    </RACMenuItem>;\n}\n\n/**\n * The row shown while more items are being fetched. React Aria calls\n * `onLoadMore` when it comes into view, and draws it only while `isLoading`.\n */\nfunction MenuLoadMore({\n  label = 'Loading more',\n  ...props\n}: MenuLoadMoreProps) {\n  return <RACMenuLoadMoreItem {...props} {...mergeStyles({\n    className: \"x6s0dn4 x9f619 x78zum5 xl56j7k x1ddmzdj\"\n  }, props)}>\n      <CollectionLoadMore label={label} size=\"20px\" />\n    </RACMenuLoadMoreItem>;\n}\n\n/**\n * A named group of items. `header` names it, and is what a screen reader\n * reads before the items inside.\n */\nfunction MenuSection<T extends object = object>({\n  children,\n  header,\n  ...props\n}: MenuSectionProps<T>) {\n  return <RACMenuSection {...props}>\n      {header === undefined ? null : <Header className=\"x9f619 x1w5n3ug xrgwony x12s497w x1szcwkt xo803ec xyl1r0q xw3mh6e x6gmt8y x790zyz\">{header}</Header>}\n      {children}\n    </RACMenuSection>;\n}\n\n/**\n * A rule between groups of items. It takes its role from the menu around it,\n * so it needs no slot from the call site.\n */\nfunction MenuSeparator(props: MenuSeparatorProps) {\n  return <Separator {...props} {...mergeStyles({\n    className: \"xwpi13i\"\n  }, props)} />;\n}\n\n/**\n * An item that opens a menu of its own. Takes exactly two children: the\n * `Menu.Item` that opens it, then the `Menu.Content` it opens.\n */\nfunction MenuSubmenu(props: MenuSubmenuProps) {\n  return <RACSubmenuTrigger {...props} />;\n}\n\n// The surface grows from the edge it is anchored by, which is what makes it\n// read as coming out of the trigger. Built by a call rather than written\n// inline at the prop, which is what react-perf's no-new-function-as-prop is\n// after.\nfunction surfaceStyles(state: PopoverRenderProps) {\n  return stylex.props(overlay.popup, styles.content, popupOrigin(state.placement));\n}\n\n// What the item is worth as text, for the typeahead React Aria drives from\n// an item's words rather than its element. It reads it off the children when\n// they are a string and finds nothing when they are not — and an item here\n// is always an element, since the row wraps its label. So a plain-string\n// label becomes the text value, and anything else has to say what it is\n// worth through `textValue`.\nfunction textOf(children: ReactNode) {\n  return typeof children === 'string' ? children : undefined;\n}\n\n/** What sits after the label: the call site's content, then the shortcut or\n * the submenu's chevron. */\nfunction trailingOf(state: MenuItemRenderProps, shortcut: ReactNode, trailing: ReactNode) {\n  if (state.hasSubmenu) {\n    return <>\n        {trailing}\n        <ChevronEndGlyph className=\"x1qx5ct2 xw4jnvo x19axjrm x1c071of\" />\n      </>;\n  }\n  if (shortcut === undefined && trailing === undefined) {\n    return undefined;\n  }\n  return <>\n      {trailing}\n      {shortcut === undefined ? null : <Keyboard className=\"x1w5n3ug\">{shortcut}</Keyboard>}\n    </>;\n}\nMenu.Content = MenuContent;\nMenu.Item = MenuItem;\nMenu.LoadMore = MenuLoadMore;\nMenu.Section = MenuSection;\nMenu.Separator = MenuSeparator;\nMenu.Submenu = MenuSubmenu;\nexport type { MenuAlign, MenuContentProps, MenuItemProps, MenuLoadMoreProps, MenuProps, MenuSectionProps, MenuSeparatorProps, MenuSide, MenuSubmenuProps };\nexport default Menu;"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["ComponentProps","ReactElement","ReactNode","ClassNameOrFunction","MenuItemRenderProps","PopoverRenderProps","MenuItemProps","RACMenuItemProps","MenuLoadMoreItemProps","RACMenuLoadMoreItemProps","MenuProps","RACMenuProps","MenuSectionProps","RACMenuSectionProps","MenuTriggerProps","RACMenuTriggerProps","StyleOrFunction","stylex","Header","Keyboard","Menu","RACMenu","MenuItem","RACMenuItem","MenuLoadMoreItem","RACMenuLoadMoreItem","MenuSection","RACMenuSection","MenuTrigger","RACMenuTrigger","Popover","RACPopover","SubmenuTrigger","RACSubmenuTrigger","Text","OverlayAlign","OverlaySide","CollectionLoadMore","ChevronEndGlyph","RowContent","rowStyles","mergeStatefulStyles","mergeStyles","overlay","placementOf","popupOrigin","colors","radii","sizing","spacing","typography","Separator","MENU_MIN","MENU_MAX","styles","content","kWkggS","kaIpWk","ks0D6T","k7Eaqz","k3XXqK","k8WAf4","$$css","MenuAlign","MenuContentProps","align","alignOffset","className","container","Element","search","side","MenuSide","sideOffset","style","Omit","T","children","leading","shortcut","trailing","MenuLoadMoreProps","label","header","MenuSeparatorProps","MenuSubmenuProps","delay","itemContent","state","isDisabled","isSelected","trailingOf","itemStyles","props","base","menu","interactive","selectedMenu","disabled","t0","$","_c","t1","MenuContent","t2","t3","undefined","t4","t5","surfaceStyles","t6","t7","t8","T0","textValue","textOf","MenuLoadMore","MenuSeparator","MenuSubmenu","popup","placement","hasSubmenu","Content","Item","LoadMore","Section","Submenu"],"sources":["../../../src/components/menu/index.tsx"],"sourcesContent":["import type { ComponentProps, ReactElement, ReactNode } from 'react';\nimport type { ClassNameOrFunction, MenuItemRenderProps, PopoverRenderProps, MenuItemProps as RACMenuItemProps, MenuLoadMoreItemProps as RACMenuLoadMoreItemProps, MenuProps as RACMenuProps, MenuSectionProps as RACMenuSectionProps, MenuTriggerProps as RACMenuTriggerProps, StyleOrFunction } from 'react-aria-components';\nimport * as stylex from '@stylexjs/stylex';\nimport { Header, Keyboard, Menu as RACMenu, MenuItem as RACMenuItem, MenuLoadMoreItem as RACMenuLoadMoreItem, MenuSection as RACMenuSection, MenuTrigger as RACMenuTrigger, Popover as RACPopover, SubmenuTrigger as RACSubmenuTrigger, Text } from 'react-aria-components';\nimport type { OverlayAlign, OverlaySide } from '../../styles/overlay';\nimport { CollectionLoadMore } from '../../collection';\nimport { ChevronEndGlyph } from '../../glyphs';\nimport { RowContent } from '../../row';\nimport { rowStyles } from '../../row/styles';\nimport { mergeStatefulStyles, mergeStyles } from '../../styles/merge';\nimport { overlay, placementOf, popupOrigin } from '../../styles/overlay';\nimport '../../tokens/design.tokens.stylex';\nimport { colors, radii, sizing, spacing, typography } from '../../tokens/design.tokens.stylex';\nimport Separator from '../separator';\n\n// The menus page's menu: a surface between 112 and 280 wide with a 4dp\n// corner and 8dp above and below its items, holding rows of the row module's\n// menu variant — 48dp tall, a label-large label, tertiary container when\n// selected. The surface itself is the overlay module's, shared with Popover\n// and Sheet, with the two things the menus page decides differently applied\n// over it: the corner, which is the extra-small step rather than the\n// medium one every other overlay takes, and the container colour, which is\n// the Expressive column's surface container low rather than the baseline's\n// surface container.\n//\n// Six parts, because everything a menu holds takes arbitrary content:\n// `Menu.Content`, `Menu.Item`, `Menu.Section`, `Menu.Separator`,\n// `Menu.Submenu` and `Menu.LoadMore`. A `Button` or `IconButton` placed\n// directly inside `Menu` is the trigger, wired through React Aria's context\n// rather than a part of ours — the same arrangement Sheet and Popover use.\n//\n// Four things are worth knowing about how this maps onto React Aria.\n//\n// **The item's styles are a function of its render state.** StyleX cannot\n// target `[data-selected]` on the element it is styling, so selection,\n// disabled and the rest are read from the state React Aria hands the\n// `className` function, wrapped in `mergeStatefulStyles` so a call site's own\n// `className` survives.\n//\n// **A shortcut goes through React Aria's `Keyboard` slot**, and the label\n// through its `Text` slot. The second is what makes the first work: React\n// Aria points the item's `aria-labelledby` at the labelled text, so a screen\n// reader reads the label alone and announces the keystroke separately. Left\n// as plain content, the item's name is its whole text and the shortcut is\n// read as part of what the item does. The keycap itself is the library's.\n//\n// **A submenu's arrow is drawn from render state, not from a prop.** React\n// Aria reports `hasSubmenu` on the item inside a `SubmenuTrigger`, so an item\n// that opens one gets the chevron without the call site saying so twice. The\n// glyph carries no direction of its own, so the style mirrors it under a\n// right-to-left writing mode.\n//\n// **A menu's children are a collection**, so anything that is not an item is\n// dropped: React Aria walks them looking for items and finds a search input\n// no place to be. `Menu.Content` therefore takes a `search` slot, drawn on\n// the surface above the items — which is also what puts the bar and the\n// items inside one `Autocomplete` when the menu is filtered.\n//\n// **A separator needs no slot from the call site.** React Aria's menu\n// provides the separator context, which is what `Menu.Separator` picks up —\n// that is why Separator moved onto React Aria in Phase 0. What is added here\n// is the menus page's 8dp either side of the rule.\n\nconst MENU_MIN = '112px';\nconst MENU_MAX = '280px';\nconst styles = {\n  content: {\n    kWkggS: \"x1vnz5z6\",\n    kaIpWk: \"x1tfhd1\",\n    ks0D6T: \"x1jkqq1h\",\n    k7Eaqz: \"x1c7vg25\",\n    k3XXqK: \"x1t137rt\",\n    k8WAf4: \"x1cmllll\",\n    $$css: true\n  }\n};\ntype MenuAlign = OverlayAlign;\ntype MenuContentProps<T extends object = object> = {\n  /** Where the menu lines up along that side. @default 'start' */\n  align?: MenuAlign;\n  /** Moves the menu along that side, in pixels. */\n  alignOffset?: number;\n  /**\n   * Lands on the surface, which is the element a layout positions. A\n   * function may compute the class from the surface's render state.\n   */\n  className?: ClassNameOrFunction<PopoverRenderProps>;\n  /**\n   * Where to portal the menu. Defaults to the end of `<body>`, which is right\n   * for an app that sets its StyleX theme on `:root`. An app that scopes the\n   * theme to a subtree has to point this at an element inside it, or the menu\n   * renders outside the theme and falls back to the tokens'\n   * `prefers-color-scheme` default.\n   */\n  container?: Element;\n  /**\n   * Content drawn on the surface above the items — a search bar that filters\n   * them, usually. It goes here rather than among the children because a\n   * menu's children are a collection: React Aria walks them for items and\n   * drops anything else, so an input written beside them disappears.\n   *\n   * To filter with it, wrap this whole part in `Autocomplete`, which puts\n   * the bar and the items inside one wrapper.\n   */\n  search?: ReactNode;\n  /** Which side of the trigger the menu opens on. @default 'bottom' */\n  side?: MenuSide;\n  /** How far the menu sits from the trigger, in pixels. @default 8 */\n  sideOffset?: number;\n  /** Lands on the surface, as `className` does. */\n  style?: StyleOrFunction<PopoverRenderProps>;\n} & Omit<RACMenuProps<T>, 'className' | 'style'>;\ntype MenuItemProps<T extends object = object> = {\n  /** The item's label — what it does. */\n  children?: ReactNode;\n  /** A function may compute the class from the item's render state. */\n  className?: RACMenuItemProps<T>['className'];\n  /** Content before the label, usually an icon. */\n  leading?: ReactNode;\n  /**\n   * The keystroke that runs the item, drawn as a keycap at the end. Goes\n   * through React Aria's keyboard slot, so a screen reader announces it\n   * apart from the label rather than reading the two as one name.\n   */\n  shortcut?: ReactNode;\n  /** A function may compute the style from the item's render state. */\n  style?: RACMenuItemProps<T>['style'];\n  /** Content after the label, before the shortcut. */\n  trailing?: ReactNode;\n} & Omit<RACMenuItemProps<T>, 'children' | 'className' | 'style'>;\ntype MenuLoadMoreProps = Omit<RACMenuLoadMoreItemProps, 'children'> & {\n  /**\n   * What the row says while it is loading. Read by a screen reader; the ring\n   * itself carries no text.\n   * @default 'Loading more'\n   */\n  label?: string;\n};\n\n// `children` is optional here where React Aria makes it required, so the\n// type reads the way Sheet's and Popover's do: a root that composes rather\n// than one that has to be handed something. Sheet does the same for the same\n// reason.\ntype MenuProps = Omit<RACMenuTriggerProps, 'children'> & {\n  /** The trigger, then the `Menu.Content` it opens. */\n  children?: ReactNode;\n};\ntype MenuSectionProps<T extends object = object> = Omit<RACMenuSectionProps<T>, 'children'> & {\n  /**\n   * The items in the section. A section built from data puts React Aria's\n   * `Collection` in here rather than a render function, since the header is\n   * an element beside them.\n   */\n  children?: ReactNode;\n  /**\n   * The section's heading, rendered through React Aria's header so the\n   * section is named by it. A section without one is a group with no name.\n   */\n  header?: ReactNode;\n};\ntype MenuSeparatorProps = Omit<ComponentProps<typeof Separator>, 'orientation'>;\ntype MenuSide = OverlaySide;\ntype MenuSubmenuProps = {\n  /**\n   * The item that opens the submenu, then the `Menu.Content` it opens.\n   * Exactly those two, in that order.\n   */\n  children: ReactElement[];\n  /**\n   * How long the pointer rests on the item before the submenu opens, in\n   * milliseconds.\n   * @default 200\n   */\n  delay?: number;\n};\n\n// What the item draws, from React Aria's render state. Built by a call\n// rather than written inline at the prop, which is what react-perf's\n// no-new-function-as-prop is after; the React Compiler memoises the result\n// on its inputs.\n//\n// The render state decides two things: the chevron, which an item inside a\n// SubmenuTrigger gets without the call site asking twice, and the supporting\n// line's colour, which the row module takes from whether the row is selected\n// or disabled.\nfunction itemContent(children: ReactNode, leading: ReactNode, shortcut: ReactNode, trailing: ReactNode) {\n  return (state: MenuItemRenderProps) => <RowContent isDisabled={state.isDisabled} isSelected={state.isSelected} leading={leading} trailing={trailingOf(state, shortcut, trailing)} variant=\"menu\">\n      <Text slot=\"label\">{children}</Text>\n    </RowContent>;\n}\n\n// StyleX cannot target `[data-selected]` on the element it is styling, so an\n// item's state comes from the render state React Aria hands its className.\n// The order matters: `disabled` is applied last so it wins over both the\n// interactive and the selected branches, and StyleX replaces a property\n// whole, so it takes their hover states with it.\n// No overline, and so no three-line row: the menus page gives one item\n// height and one line of text. `List.Item` and `ListBox.Item` take the prop\n// because the lists page is what they draw, and this row is 48dp rather than\n// that page's 56.\nfunction itemStyles(state: MenuItemRenderProps) {\n  return stylex.props(rowStyles.base, rowStyles.menu, rowStyles.interactive, state.isSelected && rowStyles.selectedMenu, state.isDisabled && rowStyles.disabled);\n}\n\n/**\n * A list of actions opened from a control. Open state is React Aria's: pass\n * `isOpen` with `onOpenChange` to control it, or `defaultOpen` to let it keep\n * its own.\n *\n * A `Button` or `IconButton` placed directly inside opens it; everything the\n * menu shows goes in `Menu.Content`, since the trigger lives in the page\n * while the menu is portalled out to the end of the body.\n *\n * ```tsx\n * <Menu>\n *   <Button>Open</Button>\n *   <Menu.Content aria-label=\"Label\">\n *     <Menu.Item id=\"first\">First item</Menu.Item>\n *   </Menu.Content>\n * </Menu>\n * ```\n */\nfunction Menu({\n  children,\n  ...props\n}: MenuProps) {\n  return <RACMenuTrigger {...props}>{children}</RACMenuTrigger>;\n}\n\n/**\n * The menu itself, and the surface it is drawn on. React Aria names it after\n * the control that opened it, so `aria-label` here is ignored — name the\n * trigger instead.\n *\n * The call site's `className` and `style` land on the surface, which is the\n * element a layout positions.\n */\nfunction MenuContent<T extends object = object>({\n  align = 'start',\n  alignOffset,\n  className,\n  container,\n  search,\n  side = 'bottom',\n  sideOffset = 8,\n  style,\n  ...props\n}: MenuContentProps<T>) {\n  return <RACPopover crossOffset={alignOffset} offset={sideOffset} placement={placementOf(side, align)}\n  // oxlint-disable-next-line typescript/no-deprecated -- its replacement, UNSAFE_PortalProvider, is not exported by react-aria-components\n  UNSTABLE_portalContainer={container} {...mergeStatefulStyles(surfaceStyles, {\n    className,\n    style\n  })}>\n      {search === undefined ? null : <div className=\"x9f619 xqf7pud xn60lsn\">{search}</div>}\n      <RACMenu<T> {...props} className=\"x9f619 x78zum5 xdt5ytf x1t137rt\" />\n    </RACPopover>;\n}\n\n/**\n * One action. Its slots are the row's: `leading` before the label, the label\n * as children, and `trailing` after it, with `shortcut` at the end. An item\n * that opens a submenu draws the chevron itself.\n */\nfunction MenuItem<T extends object = object>({\n  children,\n  leading,\n  shortcut,\n  textValue,\n  trailing,\n  ...props\n}: MenuItemProps<T>) {\n  return <RACMenuItem textValue={textValue ?? textOf(children)} {...props} {...mergeStatefulStyles(itemStyles, props)}>\n      {itemContent(children, leading, shortcut, trailing)}\n    </RACMenuItem>;\n}\n\n/**\n * The row shown while more items are being fetched. React Aria calls\n * `onLoadMore` when it comes into view, and draws it only while `isLoading`.\n */\nfunction MenuLoadMore({\n  label = 'Loading more',\n  ...props\n}: MenuLoadMoreProps) {\n  return <RACMenuLoadMoreItem {...props} {...mergeStyles({\n    className: \"x6s0dn4 x9f619 x78zum5 xl56j7k x1ddmzdj\"\n  }, props)}>\n      <CollectionLoadMore label={label} size=\"20px\" />\n    </RACMenuLoadMoreItem>;\n}\n\n/**\n * A named group of items. `header` names it, and is what a screen reader\n * reads before the items inside.\n */\nfunction MenuSection<T extends object = object>({\n  children,\n  header,\n  ...props\n}: MenuSectionProps<T>) {\n  return <RACMenuSection {...props}>\n      {header === undefined ? null : <Header className=\"x9f619 x1w5n3ug xrgwony x12s497w x1szcwkt xo803ec xyl1r0q xw3mh6e x6gmt8y x790zyz\">{header}</Header>}\n      {children}\n    </RACMenuSection>;\n}\n\n/**\n * A rule between groups of items. It takes its role from the menu around it,\n * so it needs no slot from the call site.\n */\nfunction MenuSeparator(props: MenuSeparatorProps) {\n  return <Separator {...props} {...mergeStyles({\n    className: \"xwpi13i\"\n  }, props)} />;\n}\n\n/**\n * An item that opens a menu of its own. Takes exactly two children: the\n * `Menu.Item` that opens it, then the `Menu.Content` it opens.\n */\nfunction MenuSubmenu(props: MenuSubmenuProps) {\n  return <RACSubmenuTrigger {...props} />;\n}\n\n// The surface grows from the edge it is anchored by, which is what makes it\n// read as coming out of the trigger. Built by a call rather than written\n// inline at the prop, which is what react-perf's no-new-function-as-prop is\n// after.\nfunction surfaceStyles(state: PopoverRenderProps) {\n  return stylex.props(overlay.popup, styles.content, popupOrigin(state.placement));\n}\n\n// What the item is worth as text, for the typeahead React Aria drives from\n// an item's words rather than its element. It reads it off the children when\n// they are a string and finds nothing when they are not — and an item here\n// is always an element, since the row wraps its label. So a plain-string\n// label becomes the text value, and anything else has to say what it is\n// worth through `textValue`.\nfunction textOf(children: ReactNode) {\n  return typeof children === 'string' ? children : undefined;\n}\n\n/** What sits after the label: the call site's content, then the shortcut or\n * the submenu's chevron. */\nfunction trailingOf(state: MenuItemRenderProps, shortcut: ReactNode, trailing: ReactNode) {\n  if (state.hasSubmenu) {\n    return <>\n        {trailing}\n        <ChevronEndGlyph className=\"x1qx5ct2 xw4jnvo x19axjrm x1c071of\" />\n      </>;\n  }\n  if (shortcut === undefined && trailing === undefined) {\n    return undefined;\n  }\n  return <>\n      {trailing}\n      {shortcut === undefined ? null : <Keyboard className=\"x1w5n3ug\">{shortcut}</Keyboard>}\n    </>;\n}\nMenu.Content = MenuContent;\nMenu.Item = MenuItem;\nMenu.LoadMore = MenuLoadMore;\nMenu.Section = MenuSection;\nMenu.Separator = MenuSeparator;\nMenu.Submenu = MenuSubmenu;\nexport type { MenuAlign, MenuContentProps, MenuItemProps, MenuLoadMoreProps, MenuProps, MenuSectionProps, MenuSeparatorProps, MenuSide, MenuSubmenuProps };\nexport default Menu;"],"mappings":"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"}

package/dist/components/navigation-tree/index.js

@@ -24,10 +24,6 @@ const styles = {
 		kmVPX3: "x1717udv",
 		$$css: true
 	},
-	currentAncestor: {
-		k63SB2: "x1bf3uqz",
-		$$css: true
-	},
 	indent: {
 		kZCmMZ: "x1187sqy",
 		$$css: true
@@ -50,6 +46,7 @@ function chevronFor(state) {
 function itemContent(label, leading, supporting, trailing) {
 	return (state) => /* @__PURE__ */ jsx(RowContent, {
 		isDisabled: state.isDisabled,
+		isEmphasized: state.isCurrentAncestor,
 		isSelected: state.isCurrent,
 		leading: leadingFor(state, leading),
 		supporting,
@@ -59,7 +56,7 @@ function itemContent(label, leading, supporting, trailing) {
 	});
 }
 function itemStyles(state) {
-	return props(rowStyles.base, rowStyles.drawer, rowStyles.interactive, styles.indent, state.isCurrentAncestor && styles.currentAncestor, state.isCurrent && rowStyles.selectedDrawer, state.isDisabled && rowStyles.disabled);
+	return props(rowStyles.base, rowStyles.drawer, rowStyles.interactive, styles.indent, state.isCurrent && rowStyles.selectedDrawer, state.isDisabled && rowStyles.disabled);
 }
 /**
 * The caret, then whatever the row was given. Its return type is written out

package/dist/components/navigation-tree/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["ReactNode","NavigationTreeItemRenderProps","NavigationTreeItemProps","RACNavigationTreeItemProps","NavigationTreeProps","RACNavigationTreeProps","stylex","Button","RACButton","NavigationTree","RACNavigationTree","NavigationTreeHeader","RACNavigationTreeHeader","NavigationTreeItem","RACNavigationTreeItem","NavigationTreeItemContent","RACNavigationTreeItemContent","NavigationTreeSection","RACNavigationTreeSection","collectionStyles","ChevronEndGlyph","RowContent","rowStyles","focus","mergeStatefulStyles","mergeStyles","colors","motion","radii","spacing","typography","styles","chevron","kGNEyG","kWkggS","kaIpWk","kMzoRj","kB7OPa","kMwMTN","kkrTdU","k1xSpc","kmuXW","kjj79g","kmVPX3","$$css","currentAncestor","k63SB2","indent","kZCmMZ","NavigationTreeHeaderProps","children","NavigationTreeItemText","Omit","T","className","leading","style","supporting","trailing","label","textValue","NavigationTreeSectionProps","Parameters","header","chevronClassName","props","ring","chevronFor","state","hasChildItems","isExpanded","itemContent","isDisabled","isCurrent","leadingFor","itemStyles","base","drawer","interactive","isCurrentAncestor","selectedDrawer","disabled","$","_c","t0","container","t1","T0","t2","t3","t4","t5","t6","t7","t8","textValueFor","section","undefined","Item","Section"],"sources":["../../../src/components/navigation-tree/index.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport type { NavigationTreeItemRenderProps, NavigationTreeItemProps as RACNavigationTreeItemProps, NavigationTreeProps as RACNavigationTreeProps } from 'react-aria-components';\nimport * as stylex from '@stylexjs/stylex';\nimport { Button as RACButton, NavigationTree as RACNavigationTree, NavigationTreeHeader as RACNavigationTreeHeader, NavigationTreeItem as RACNavigationTreeItem, NavigationTreeItemContent as RACNavigationTreeItemContent, NavigationTreeSection as RACNavigationTreeSection } from 'react-aria-components';\nimport { collectionStyles } from '../../collection/styles';\nimport { ChevronEndGlyph } from '../../glyphs';\nimport { RowContent } from '../../row';\nimport { rowStyles } from '../../row/styles';\nimport { focus } from '../../styles/focus';\nimport { mergeStatefulStyles, mergeStyles } from '../../styles/merge';\nimport '../../tokens/design.tokens.stylex';\nimport { colors, motion, radii, spacing, typography } from '../../tokens/design.tokens.stylex';\n\n// The navigation drawer page's contents: a nested set of links with the\n// current one marked. Each row is the row every list here draws — `src/row`,\n// shared with ListItem, ListBox, List, Tree and Disclosure — under that\n// module's `drawer` variant, which is the page's own 56dp row with a\n// label-large label and a secondary-container pill on the current one.\n//\n// This is Tree's shape over React Aria's navigation primitive, and the\n// difference is what the two are for. A tree selects: rows are chosen and\n// the choice is reported. A navigation tree navigates: each row is a link,\n// and which one is current is decided by matching the route rather than by\n// anything the reader selected. So this takes `selectedRoute` where Tree\n// takes `selectedKeys`, and has no selection at all — React Aria omits every\n// selection prop from it.\n//\n// Three things are this component's own.\n//\n// **A level indents by one caret's width**, exactly as Tree does and for the\n// same reason: React Aria writes the depth on each row as a custom property,\n// and 24dp is the size the drawer page gives its icon, so a level of nesting\n// is as wide as the glyph beside it.\n//\n// **An ancestor of the current row is marked too, and softly.** React Aria\n// reports it, and a drawer whose current row is collapsed out of sight would\n// otherwise show nothing at all. It takes the label's weight rather than the\n// pill, so the trail reads as a trail rather than as a second current row.\n//\n// **The pill's shape is the library's own.** The page gives the active\n// indicator's colour, height and width but keeps its shape behind a token\n// set that does not open to a script — the same gap recorded on the buttons\n// and lists pages. It is drawn as a full pill, which is what the page's own\n// images show and what 56dp of height comes to.\n\nconst styles = {\n  chevron: {\n    kGNEyG: \"x6s0dn4\",\n    kWkggS: \"xjbqb8w\",\n    kaIpWk: \"x1dkaolv\",\n    kMzoRj: \"xc342km\",\n    kB7OPa: \"x9f619\",\n    kMwMTN: \"x1heor9g\",\n    kkrTdU: \"x1ypdohk\",\n    k1xSpc: \"x78zum5\",\n    kmuXW: \"x2lah0s\",\n    kjj79g: \"xl56j7k\",\n    kmVPX3: \"x1717udv\",\n    $$css: true\n  },\n  currentAncestor: {\n    k63SB2: \"x1bf3uqz\",\n    $$css: true\n  },\n  indent: {\n    kZCmMZ: \"x1187sqy\",\n    $$css: true\n  }\n};\ntype NavigationTreeHeaderProps = {\n  /** The section's heading. */\n  children?: ReactNode;\n};\ntype NavigationTreeItemProps<T extends object = object> = NavigationTreeItemText & Omit<RACNavigationTreeItemProps<T>, 'children' | 'className' | 'style' | 'textValue'> & {\n  /** The rows nested under this one, as further `NavigationTree.Item` entries. */\n  children?: ReactNode;\n  /** A function may compute the class from the row's render state. */\n  className?: RACNavigationTreeItemProps<T>['className'];\n  /** Content before the label: an icon. */\n  leading?: ReactNode;\n  /** A function may compute the style from the row's render state. */\n  style?: RACNavigationTreeItemProps<T>['style'];\n  /** A second line under the label, in the muted role. */\n  supporting?: ReactNode;\n  /** Content after the label, such as a count. */\n  trailing?: ReactNode;\n};\n\n// What the row is worth as text, which React Aria requires: a row here wraps\n// its label in elements, so it cannot read one off the children the way a\n// plain-string child would give it. A string label is taken as the value,\n// which is the common case; anything else has to say what it is worth, and\n// this is what makes the compiler ask rather than leaving a row unnamed.\ntype NavigationTreeItemText = {\n  /** The row's label — where it goes. */\n  label: string;\n  /** What typeahead matches the row on. Defaults to the label. */\n  textValue?: string;\n} | {\n  /** The row's label, as something other than a plain string. */\n  label?: ReactNode;\n  /** What typeahead matches the row on, and what names it. */\n  textValue: string;\n};\ntype NavigationTreeProps<T extends object = object> = Omit<RACNavigationTreeProps<T>, 'className' | 'style'> & {\n  /** A function may compute the class from the tree's render state. */\n  className?: RACNavigationTreeProps<T>['className'];\n  /** A function may compute the style from the tree's render state. */\n  style?: RACNavigationTreeProps<T>['style'];\n};\ntype NavigationTreeSectionProps<T extends object = object> = Omit<Parameters<typeof RACNavigationTreeSection<T>>[0], 'children'> & {\n  /**\n   * The rows in the section. A section built from data puts React Aria's\n   * `Collection` in here rather than a render function, since the header is\n   * an element beside them.\n   */\n  children?: ReactNode;\n  /**\n   * The section's heading, rendered through React Aria's header so the\n   * section is named by it. A section without one is a group with no name.\n   */\n  header?: ReactNode;\n};\n\n// The button itself never turns — the glyph inside it does, so the press\n// target stays a square whichever way the row is pointing.\nfunction chevronClassName() {\n  return stylex.props(styles.chevron, focus.ring).className ?? '';\n}\n\n// The caret, or the space it would have taken. Written as a call rather than\n// inline at the prop, which is what react-perf's no-new-function-as-prop and\n// jsx-no-jsx-as-prop are after; the React Compiler memoises the result on\n// its inputs.\n//\n// A leaf gets the space rather than nothing, so its label lines up with the\n// label of a sibling that opens.\nfunction chevronFor(state: NavigationTreeItemRenderProps): ReactNode {\n  if (!state.hasChildItems) {\n    return <span className=\"xxk0z11 x2lah0s xvy4d1p\" />;\n  }\n  return <RACButton className={chevronClassName} slot=\"chevron\">\n      <ChevronEndGlyph {...{\n      0: {\n        className: \"xxk0z11 xvy4d1p x19axjrm x1c071of xkzkux9 x11xpdln xpc4ca7\"\n      },\n      1: {\n        className: \"xxk0z11 xvy4d1p xkzkux9 x11xpdln xpc4ca7 x1y10d4b x1iffjtl\"\n      }\n    }[!!state.isExpanded << 0]} />\n    </RACButton>;\n}\n\n// What a row draws, from React Aria's render state. The caret comes first,\n// then whatever the row was given — one order, always, which is what keeps a\n// column of rows reading down.\nfunction itemContent(label: ReactNode, leading: ReactNode, supporting: ReactNode, trailing: ReactNode) {\n  return (state: NavigationTreeItemRenderProps): ReactNode => <RowContent isDisabled={state.isDisabled} isSelected={state.isCurrent} leading={leadingFor(state, leading)} supporting={supporting} trailing={trailing} variant=\"drawer\">\n      {label}\n    </RowContent>;\n}\n\n// StyleX cannot target `[data-current]` on the element it is styling, so a\n// row's state comes from the render state React Aria hands its className.\n// The order matters: `disabled` is applied last so it wins over both the\n// interactive and the current branches, and StyleX replaces a property\n// whole, so it takes their hover states with it.\n// No overline, and so no three-line row: the navigation drawer page gives\n// one item height and one line of text. `List.Item` and `ListBox.Item` take\n// the prop because the lists page is what they draw; this row follows the\n// drawer's own metrics.\nfunction itemStyles(state: NavigationTreeItemRenderProps) {\n  return stylex.props(rowStyles.base, rowStyles.drawer, rowStyles.interactive, styles.indent, state.isCurrentAncestor && styles.currentAncestor, state.isCurrent && rowStyles.selectedDrawer, state.isDisabled && rowStyles.disabled);\n}\n\n/**\n * The caret, then whatever the row was given. Its return type is written out\n * rather than inferred: `ReactNode` is a union that includes a promise, and\n * a function inferred as returning one has to be `async`.\n */\nfunction leadingFor(state: NavigationTreeItemRenderProps, leading: ReactNode): ReactNode {\n  return <>\n      {chevronFor(state)}\n      {leading}\n    </>;\n}\n\n/**\n * A nested set of links, with the current one marked. Which row is current\n * is React Aria's: give the tree a `selectedRoute` and each row an `href`,\n * and the row whose `href` matches is the current one — its ancestors are\n * marked too, so a collapsed trail still shows where you are.\n *\n * ```tsx\n * <NavigationTree aria-label=\"Label\" selectedRoute=\"#second\">\n *   <NavigationTree.Item href=\"#first\" id=\"first\" label=\"First item\">\n *     <NavigationTree.Item href=\"#second\" id=\"second\" label=\"Second item\" />\n *   </NavigationTree.Item>\n * </NavigationTree>\n * ```\n *\n * There is no selection here, and that is React Aria's design rather than an\n * omission: a navigation tree navigates, so what is current comes from the\n * route rather than from anything the reader picked. `Tree` is the one that\n * selects.\n *\n * The call site's `className` and `style` land on the container, which is\n * the element a layout positions.\n */\nfunction NavigationTree<T extends object>(props: NavigationTreeProps<T>) {\n  return <RACNavigationTree<T> {...props} {...mergeStatefulStyles(stylex.props(collectionStyles.container), props)} />;\n}\n\n/**\n * A named group of rows. `header` names it, and is what a screen reader\n * reads before the rows inside.\n */\nfunction NavigationTreeHeader({\n  children\n}: NavigationTreeHeaderProps) {\n  return <RACNavigationTreeHeader className=\"x9f619 x1w5n3ug xkknnkr x14zspaw x1v9cpvo x155f00i x1lz68p4 xw3mh6e x1clyivc x140yoea\">\n      {children}\n    </RACNavigationTreeHeader>;\n}\n\n/**\n * One row, and the rows under it. Give it an `href` — that is what\n * `selectedRoute` is matched against — and an `id`, which is the key\n * expansion is reported by.\n *\n * Rows nested as `children` are what make it a branch; a row with none is a\n * leaf and draws no caret.\n */\nfunction NavigationTreeItem<T extends object = object>({\n  children,\n  label,\n  leading,\n  supporting,\n  textValue,\n  trailing,\n  ...props\n}: NavigationTreeItemProps<T>) {\n  return <RACNavigationTreeItem<T> textValue={textValueFor(textValue, label)} {...props} {...mergeStatefulStyles(itemStyles, props)}>\n      <RACNavigationTreeItemContent>\n        {itemContent(label, leading, supporting, trailing)}\n      </RACNavigationTreeItemContent>\n      {children}\n    </RACNavigationTreeItem>;\n}\n\n/**\n * A named group of rows, with its heading above them.\n */\nfunction NavigationTreeSection<T extends object = object>({\n  children,\n  header,\n  ...props\n}: NavigationTreeSectionProps<T>) {\n  return <RACNavigationTreeSection<T> {...props} {...mergeStyles(stylex.props(collectionStyles.section), props)}>\n      {header === undefined ? null : <NavigationTreeHeader>{header}</NavigationTreeHeader>}\n      {children}\n    </RACNavigationTreeSection>;\n}\n\n// What React Aria matches typeahead on, and what names the row.\n// `NavigationTreeItemText` makes one of the two a string, so the last branch\n// is unreachable through the public type — it is there because destructuring\n// the two apart is what loses the narrowing, not because a row can arrive\n// without either.\nfunction textValueFor(textValue: string | undefined, label: ReactNode) {\n  if (textValue !== undefined) {\n    return textValue;\n  }\n  return typeof label === 'string' ? label : '';\n}\nNavigationTree.Item = NavigationTreeItem;\nNavigationTree.Section = NavigationTreeSection;\nexport type { NavigationTreeHeaderProps, NavigationTreeItemProps, NavigationTreeProps, NavigationTreeSectionProps };\nexport default NavigationTree;"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["ReactNode","NavigationTreeItemRenderProps","NavigationTreeItemProps","RACNavigationTreeItemProps","NavigationTreeProps","RACNavigationTreeProps","stylex","Button","RACButton","NavigationTree","RACNavigationTree","NavigationTreeHeader","RACNavigationTreeHeader","NavigationTreeItem","RACNavigationTreeItem","NavigationTreeItemContent","RACNavigationTreeItemContent","NavigationTreeSection","RACNavigationTreeSection","collectionStyles","ChevronEndGlyph","RowContent","rowStyles","focus","mergeStatefulStyles","mergeStyles","colors","motion","radii","spacing","typography","styles","chevron","kGNEyG","kWkggS","kaIpWk","kMzoRj","kB7OPa","kMwMTN","kkrTdU","k1xSpc","kmuXW","kjj79g","kmVPX3","$$css","indent","kZCmMZ","NavigationTreeHeaderProps","children","NavigationTreeItemText","Omit","T","className","leading","style","supporting","trailing","label","textValue","NavigationTreeSectionProps","Parameters","header","chevronClassName","props","ring","chevronFor","state","hasChildItems","isExpanded","itemContent","isDisabled","isCurrentAncestor","isCurrent","leadingFor","itemStyles","base","drawer","interactive","selectedDrawer","disabled","$","_c","t0","container","t1","T0","t2","t3","t4","t5","t6","t7","t8","textValueFor","section","undefined","Item","Section"],"sources":["../../../src/components/navigation-tree/index.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport type { NavigationTreeItemRenderProps, NavigationTreeItemProps as RACNavigationTreeItemProps, NavigationTreeProps as RACNavigationTreeProps } from 'react-aria-components';\nimport * as stylex from '@stylexjs/stylex';\nimport { Button as RACButton, NavigationTree as RACNavigationTree, NavigationTreeHeader as RACNavigationTreeHeader, NavigationTreeItem as RACNavigationTreeItem, NavigationTreeItemContent as RACNavigationTreeItemContent, NavigationTreeSection as RACNavigationTreeSection } from 'react-aria-components';\nimport { collectionStyles } from '../../collection/styles';\nimport { ChevronEndGlyph } from '../../glyphs';\nimport { RowContent } from '../../row';\nimport { rowStyles } from '../../row/styles';\nimport { focus } from '../../styles/focus';\nimport { mergeStatefulStyles, mergeStyles } from '../../styles/merge';\nimport '../../tokens/design.tokens.stylex';\nimport { colors, motion, radii, spacing, typography } from '../../tokens/design.tokens.stylex';\n\n// The navigation drawer page's contents: a nested set of links with the\n// current one marked. Each row is the row every list here draws — `src/row`,\n// shared with ListItem, ListBox, List, Tree and Disclosure — under that\n// module's `drawer` variant, which is the page's own 56dp row with a\n// label-large label and a secondary-container pill on the current one.\n//\n// This is Tree's shape over React Aria's navigation primitive, and the\n// difference is what the two are for. A tree selects: rows are chosen and\n// the choice is reported. A navigation tree navigates: each row is a link,\n// and which one is current is decided by matching the route rather than by\n// anything the reader selected. So this takes `selectedRoute` where Tree\n// takes `selectedKeys`, and has no selection at all — React Aria omits every\n// selection prop from it.\n//\n// Three things are this component's own.\n//\n// **A level indents by one caret's width**, exactly as Tree does and for the\n// same reason: React Aria writes the depth on each row as a custom property,\n// and 24dp is the size the drawer page gives its icon, so a level of nesting\n// is as wide as the glyph beside it.\n//\n// **An ancestor of the current row is marked too, and softly.** React Aria\n// reports it, and a drawer whose current row is collapsed out of sight would\n// otherwise show nothing at all. It takes the label's weight rather than the\n// pill, so the trail reads as a trail rather than as a second current row.\n//\n// That weight goes on the label itself, through the row module's\n// `isEmphasized`, and it has to: the row's own `font-weight` never reaches\n// the text, since `RowContent` draws the label in a span stating the\n// label-large role in full, weight included. The pair also has to differ by\n// more than a step — the label's own weight is already the medium one, so a\n// trail set in medium is a trail nobody can see.\n//\n// **The pill's shape is the library's own.** The page gives the active\n// indicator's colour, height and width but keeps its shape behind a token\n// set that does not open to a script — the same gap recorded on the buttons\n// and lists pages. It is drawn as a full pill, which is what the page's own\n// images show and what 56dp of height comes to.\n\nconst styles = {\n  chevron: {\n    kGNEyG: \"x6s0dn4\",\n    kWkggS: \"xjbqb8w\",\n    kaIpWk: \"x1dkaolv\",\n    kMzoRj: \"xc342km\",\n    kB7OPa: \"x9f619\",\n    kMwMTN: \"x1heor9g\",\n    kkrTdU: \"x1ypdohk\",\n    k1xSpc: \"x78zum5\",\n    kmuXW: \"x2lah0s\",\n    kjj79g: \"xl56j7k\",\n    kmVPX3: \"x1717udv\",\n    $$css: true\n  },\n  indent: {\n    kZCmMZ: \"x1187sqy\",\n    $$css: true\n  }\n};\ntype NavigationTreeHeaderProps = {\n  /** The section's heading. */\n  children?: ReactNode;\n};\ntype NavigationTreeItemProps<T extends object = object> = NavigationTreeItemText & Omit<RACNavigationTreeItemProps<T>, 'children' | 'className' | 'style' | 'textValue'> & {\n  /** The rows nested under this one, as further `NavigationTree.Item` entries. */\n  children?: ReactNode;\n  /** A function may compute the class from the row's render state. */\n  className?: RACNavigationTreeItemProps<T>['className'];\n  /** Content before the label: an icon. */\n  leading?: ReactNode;\n  /** A function may compute the style from the row's render state. */\n  style?: RACNavigationTreeItemProps<T>['style'];\n  /** A second line under the label, in the muted role. */\n  supporting?: ReactNode;\n  /** Content after the label, such as a count. */\n  trailing?: ReactNode;\n};\n\n// What the row is worth as text, which React Aria requires: a row here wraps\n// its label in elements, so it cannot read one off the children the way a\n// plain-string child would give it. A string label is taken as the value,\n// which is the common case; anything else has to say what it is worth, and\n// this is what makes the compiler ask rather than leaving a row unnamed.\ntype NavigationTreeItemText = {\n  /** The row's label — where it goes. */\n  label: string;\n  /** What typeahead matches the row on. Defaults to the label. */\n  textValue?: string;\n} | {\n  /** The row's label, as something other than a plain string. */\n  label?: ReactNode;\n  /** What typeahead matches the row on, and what names it. */\n  textValue: string;\n};\ntype NavigationTreeProps<T extends object = object> = Omit<RACNavigationTreeProps<T>, 'className' | 'style'> & {\n  /** A function may compute the class from the tree's render state. */\n  className?: RACNavigationTreeProps<T>['className'];\n  /** A function may compute the style from the tree's render state. */\n  style?: RACNavigationTreeProps<T>['style'];\n};\ntype NavigationTreeSectionProps<T extends object = object> = Omit<Parameters<typeof RACNavigationTreeSection<T>>[0], 'children'> & {\n  /**\n   * The rows in the section. A section built from data puts React Aria's\n   * `Collection` in here rather than a render function, since the header is\n   * an element beside them.\n   */\n  children?: ReactNode;\n  /**\n   * The section's heading, rendered through React Aria's header so the\n   * section is named by it. A section without one is a group with no name.\n   */\n  header?: ReactNode;\n};\n\n// The button itself never turns — the glyph inside it does, so the press\n// target stays a square whichever way the row is pointing.\nfunction chevronClassName() {\n  return stylex.props(styles.chevron, focus.ring).className ?? '';\n}\n\n// The caret, or the space it would have taken. Written as a call rather than\n// inline at the prop, which is what react-perf's no-new-function-as-prop and\n// jsx-no-jsx-as-prop are after; the React Compiler memoises the result on\n// its inputs.\n//\n// A leaf gets the space rather than nothing, so its label lines up with the\n// label of a sibling that opens.\nfunction chevronFor(state: NavigationTreeItemRenderProps): ReactNode {\n  if (!state.hasChildItems) {\n    return <span className=\"xxk0z11 x2lah0s xvy4d1p\" />;\n  }\n  return <RACButton className={chevronClassName} slot=\"chevron\">\n      <ChevronEndGlyph {...{\n      0: {\n        className: \"xxk0z11 xvy4d1p x19axjrm x1c071of xkzkux9 x11xpdln xpc4ca7\"\n      },\n      1: {\n        className: \"xxk0z11 xvy4d1p xkzkux9 x11xpdln xpc4ca7 x1y10d4b x1iffjtl\"\n      }\n    }[!!state.isExpanded << 0]} />\n    </RACButton>;\n}\n\n// What a row draws, from React Aria's render state. The caret comes first,\n// then whatever the row was given — one order, always, which is what keeps a\n// column of rows reading down.\nfunction itemContent(label: ReactNode, leading: ReactNode, supporting: ReactNode, trailing: ReactNode) {\n  return (state: NavigationTreeItemRenderProps): ReactNode => <RowContent isDisabled={state.isDisabled} isEmphasized={state.isCurrentAncestor} isSelected={state.isCurrent} leading={leadingFor(state, leading)} supporting={supporting} trailing={trailing} variant=\"drawer\">\n      {label}\n    </RowContent>;\n}\n\n// StyleX cannot target `[data-current]` on the element it is styling, so a\n// row's state comes from the render state React Aria hands its className.\n// The order matters: `disabled` is applied last so it wins over both the\n// interactive and the current branches, and StyleX replaces a property\n// whole, so it takes their hover states with it.\n// No overline, and so no three-line row: the navigation drawer page gives\n// one item height and one line of text. `List.Item` and `ListBox.Item` take\n// the prop because the lists page is what they draw; this row follows the\n// drawer's own metrics.\nfunction itemStyles(state: NavigationTreeItemRenderProps) {\n  return stylex.props(rowStyles.base, rowStyles.drawer, rowStyles.interactive, styles.indent, state.isCurrent && rowStyles.selectedDrawer, state.isDisabled && rowStyles.disabled);\n}\n\n/**\n * The caret, then whatever the row was given. Its return type is written out\n * rather than inferred: `ReactNode` is a union that includes a promise, and\n * a function inferred as returning one has to be `async`.\n */\nfunction leadingFor(state: NavigationTreeItemRenderProps, leading: ReactNode): ReactNode {\n  return <>\n      {chevronFor(state)}\n      {leading}\n    </>;\n}\n\n/**\n * A nested set of links, with the current one marked. Which row is current\n * is React Aria's: give the tree a `selectedRoute` and each row an `href`,\n * and the row whose `href` matches is the current one — its ancestors are\n * marked too, so a collapsed trail still shows where you are.\n *\n * ```tsx\n * <NavigationTree aria-label=\"Label\" selectedRoute=\"#second\">\n *   <NavigationTree.Item href=\"#first\" id=\"first\" label=\"First item\">\n *     <NavigationTree.Item href=\"#second\" id=\"second\" label=\"Second item\" />\n *   </NavigationTree.Item>\n * </NavigationTree>\n * ```\n *\n * There is no selection here, and that is React Aria's design rather than an\n * omission: a navigation tree navigates, so what is current comes from the\n * route rather than from anything the reader picked. `Tree` is the one that\n * selects.\n *\n * The call site's `className` and `style` land on the container, which is\n * the element a layout positions.\n */\nfunction NavigationTree<T extends object>(props: NavigationTreeProps<T>) {\n  return <RACNavigationTree<T> {...props} {...mergeStatefulStyles(stylex.props(collectionStyles.container), props)} />;\n}\n\n/**\n * A named group of rows. `header` names it, and is what a screen reader\n * reads before the rows inside.\n */\nfunction NavigationTreeHeader({\n  children\n}: NavigationTreeHeaderProps) {\n  return <RACNavigationTreeHeader className=\"x9f619 x1w5n3ug xkknnkr x14zspaw x1v9cpvo x155f00i x1lz68p4 xw3mh6e x1clyivc x140yoea\">\n      {children}\n    </RACNavigationTreeHeader>;\n}\n\n/**\n * One row, and the rows under it. Give it an `href` — that is what\n * `selectedRoute` is matched against — and an `id`, which is the key\n * expansion is reported by.\n *\n * Rows nested as `children` are what make it a branch; a row with none is a\n * leaf and draws no caret.\n */\nfunction NavigationTreeItem<T extends object = object>({\n  children,\n  label,\n  leading,\n  supporting,\n  textValue,\n  trailing,\n  ...props\n}: NavigationTreeItemProps<T>) {\n  return <RACNavigationTreeItem<T> textValue={textValueFor(textValue, label)} {...props} {...mergeStatefulStyles(itemStyles, props)}>\n      <RACNavigationTreeItemContent>\n        {itemContent(label, leading, supporting, trailing)}\n      </RACNavigationTreeItemContent>\n      {children}\n    </RACNavigationTreeItem>;\n}\n\n/**\n * A named group of rows, with its heading above them.\n */\nfunction NavigationTreeSection<T extends object = object>({\n  children,\n  header,\n  ...props\n}: NavigationTreeSectionProps<T>) {\n  return <RACNavigationTreeSection<T> {...props} {...mergeStyles(stylex.props(collectionStyles.section), props)}>\n      {header === undefined ? null : <NavigationTreeHeader>{header}</NavigationTreeHeader>}\n      {children}\n    </RACNavigationTreeSection>;\n}\n\n// What React Aria matches typeahead on, and what names the row.\n// `NavigationTreeItemText` makes one of the two a string, so the last branch\n// is unreachable through the public type — it is there because destructuring\n// the two apart is what loses the narrowing, not because a row can arrive\n// without either.\nfunction textValueFor(textValue: string | undefined, label: ReactNode) {\n  if (textValue !== undefined) {\n    return textValue;\n  }\n  return typeof label === 'string' ? label : '';\n}\nNavigationTree.Item = NavigationTreeItem;\nNavigationTree.Section = NavigationTreeSection;\nexport type { NavigationTreeHeaderProps, NavigationTreeItemProps, NavigationTreeProps, NavigationTreeSectionProps };\nexport default NavigationTree;"],"mappings":"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"}

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

@@ -255,7 +255,7 @@ function LinearTrack(t0) {
 		let t4;
 		if ($[6] !== t3) {
 			t4 = /* @__PURE__ */ jsx("span", {
-				className: "xqu0tyb x9f619 xh8yej3 x13vifvy x10l6tqk x1nf803f xy02sl2 x1c74tu6 xa4qsjk x4hg7df x1esw782 x1hev8vu",
+				className: "xqu0tyb x9f619 xh8yej3 x13vifvy x10l6tqk x1nf803f xy02sl2 x1c74tu6 xa4qsjk x4hg7df x1esw782 xoia761",
 				children: /* @__PURE__ */ jsx("span", { ...t3 })
 			});
 			$[6] = t3;
@@ -270,7 +270,7 @@ function LinearTrack(t0) {
 		let t6;
 		if ($[10] !== t5) {
 			t6 = /* @__PURE__ */ jsx("span", {
-				className: "xqu0tyb x9f619 xh8yej3 x13vifvy x10l6tqk x1nf803f xy02sl2 x1c74tu6 xa4qsjk x1pdi2bj x1esw782 xmvyqo8",
+				className: "xqu0tyb x9f619 xh8yej3 x13vifvy x10l6tqk x1nf803f xy02sl2 x1c74tu6 xa4qsjk x1pdi2bj x1esw782 xnsac6p",
 				children: /* @__PURE__ */ jsx("span", { ...t5 })
 			});
 			$[10] = t5;
@@ -279,7 +279,7 @@ function LinearTrack(t0) {
 		let t7;
 		if ($[12] !== t2 || $[13] !== t4 || $[14] !== t6) {
 			t7 = /* @__PURE__ */ jsxs("div", {
-				className: "xqu0tyb x1dkaolv x9f619 xh8yej3 xb3r6kr x1n2onr6",
+				className: "xqu0tyb x1dkaolv x9f619 xh8yej3 xb3r6kr x1n2onr6 x19axjrm x1c071of",
 				children: [
 					t2,
 					t4,

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["ReactNode","ProgressBarRenderProps","ProgressBarProps","RACProgressBarProps","stylex","ProgressBar","IndicatorTone","IndicatorLabels","IndicatorLine","indicatorStyles","mergeStatefulStyles","colors","radii","CIRCULAR_SIZE","CIRCULAR_SIZE_PX","THICKNESS","GAP","RADIUS","CIRCUMFERENCE","Math","PI","ARC_MS","CYCLE_MS","ROTATE_MS","round","RING_EASING","INDETERMINATE_MS","BUFFER_MS","LINE_SLOWDOWN","RING_SLOWDOWN","primaryTranslate","primaryScale","secondaryTranslate","secondaryScale","buffering","expandArc","travelArc","spin","_temp","kZKoxP","kzqmXN","_temp2","styles","arcActive","kjVXCG","$$css","arcIndeterminate","kkDQuc","k44tkh","ko0y90","kKVMdj","kyAemX","k1ekBW","arcMotion","kIyJzY","kAMwcw","arcTrack","circular","kB7OPa","k1xSpc","k3aq6I","circularIndeterminate","circularSize","size","val","undefined","indeterminateBarInner","kWkggS","kaIpWk","kpwlN0","kVAEAm","indeterminateTrack","primaryBarInner","rootCircular","kGNEyG","secondaryBarInner","trackBuffered","kmuXW","trackBufferedAt","share","ProgressIndicatorProps","buffer","className","label","showValue","style","tone","ProgressIndicatorTone","variant","ProgressIndicatorVariant","Omit","Extract","arcsFor","percentage","active","track","max","strokeDasharray","strokeDashoffset","bufferShare","minValue","maxValue","value","range","buffered","remaining","min","CircularTrack","t0","$","_c","isIndeterminate","inherit","t1","arcs","t2","props","t3","inheritTrack","t4","t5","t6","t7","inheritActive","t8","t9","indicatorContent","state","valueText","LinearTrack","ProgressIndicator","T0","t10","t11","t12","root"],"sources":["../../../src/components/progress-indicator/index.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport type { ProgressBarRenderProps, ProgressBarProps as RACProgressBarProps } from 'react-aria-components';\nimport * as stylex from '@stylexjs/stylex';\nimport { ProgressBar } from 'react-aria-components';\nimport type { IndicatorTone } from '../../indicator/styles';\nimport { IndicatorLabels, IndicatorLine } from '../../indicator';\nimport { indicatorStyles } from '../../indicator/styles';\nimport { mergeStatefulStyles } from '../../styles/merge';\nimport '../../tokens/design.tokens.stylex';\nimport { colors, radii } from '../../tokens/design.tokens.stylex';\n\n// The progress indicators page's two shapes, drawn flat: the page's wavy\n// shape is the Expressive column's alone, and its amplitude and wavelength\n// belong to a variant rather than to this. Both carry the three parts the\n// page's anatomy names — the active indicator in primary, the track in\n// secondary container, and, on the line, the stop indicator in primary at\n// the end — at the page's 4dp thickness, with the 4dp gap its measurements\n// give either side of the track. The ring is the page's default 40dp of the\n// four sizes it draws.\n//\n// The determinate line is a row of those parts, so the active indicator's\n// width is the percentage itself and the track takes what is left. The\n// determinate ring is two arcs of one circle, cut by the dash pattern: the\n// active arc runs from the top for its share of the circumference, and the\n// track picks up 4dp past it and stops 4dp before it comes back round,\n// which is the same gap measured along the curve.\n//\n// The animations are Material's own rather than something assembled from\n// the motion tokens: an indeterminate indicator is a piece of choreography,\n// and one written from scratch reads as a different component beside a\n// Material app. Material Web and Angular Material both descend from the\n// same implementation and agree on every number, so the numbers here are\n// theirs — the line's two bars and their four keyframe sets, the buffer's\n// scrolling dots, the ring's 1333ms arc, its four-arc cycle and its 1568ms\n// rotation, and the 250ms and 500ms a determinate value moves over.\n//\n// Two things are decided differently, both after reading the two of them.\n//\n// The ring is one dashed arc rather than two halves. Material Web draws it\n// as a pair of bordered half-circles, Angular as a pair of clipped SVG\n// circles with a patch over the seam between them; both constructions exist\n// to work around that split, and a single arc whose dash pattern is\n// animated needs neither and shares its geometry with the determinate ring.\n// The three effects it composes are still theirs: the arc grows and shrinks\n// over the arc's duration, its start travels the circle over four of those,\n// and the whole thing turns over the rotation's.\n//\n// Under `prefers-reduced-motion` the motion slows rather than stopping,\n// which is Angular's answer and the better one: an indicator that freezes\n// stops saying the work is going on, and a frozen arc caught at its short\n// end reads as broken. The multipliers are Angular's — two for the line,\n// and a quarter more for the ring.\n//\n// React Aria's `ProgressBar` is the root: it carries the role, the value and\n// its text, and reports the percentage and whether it is indeterminate as\n// render state, which is what everything here is drawn from.\n\n// The circle the arcs are cut from. The radius is the diameter less the\n// stroke, halved, so the stroke sits inside the 40dp box rather than\n// straddling its edge.\n//\n// The thickness and the gap are the same 4dp the shared line is drawn at,\n// written again rather than imported from `src/indicator/styles`: StyleX\n// evaluates the values inside `stylex.create` and `stylex.keyframes` as it\n// compiles, and will not follow an import to a module that is not a theme\n// to reach one — an imported constant fails the transform outright.\nconst CIRCULAR_SIZE = 40;\n// The same value as a length, hoisted rather than built at the parameter.\n// The compiler has no safe reordering for a template literal, so one written\n// as a default parameter skips the whole component around it — which the\n// panic threshold this lands beside turns into a build failure.\nconst CIRCULAR_SIZE_PX = `${CIRCULAR_SIZE}px`;\nconst THICKNESS = 4;\nconst GAP = 4;\nconst RADIUS = (CIRCULAR_SIZE - THICKNESS) / 2;\nconst CIRCUMFERENCE = 2 * Math.PI * RADIUS;\n\n// The ring's timings. The arc is 1333ms; a full cycle is four of them; and\n// the rotation is the arc scaled by 360/306, which is the arc's start\n// rotation plus the circle less the arc's size.\nconst ARC_MS = 1333;\nconst CYCLE_MS = ARC_MS * 4;\nconst ROTATE_MS = Math.round(ARC_MS * 360 / 306);\nconst RING_EASING = 'cubic-bezier(0.4, 0, 0.2, 1)';\n\n// The line's own: 2s for an indeterminate pass, and the 250ms the buffer's\n// dots take to scroll one pitch. What a determinate value moves over is the\n// shared line's, since a meter moves the same way.\nconst INDETERMINATE_MS = 2000;\nconst BUFFER_MS = 250;\n\n// What `prefers-reduced-motion` slows each shape by.\nconst LINE_SLOWDOWN = 2;\nconst RING_SLOWDOWN = 1.25;\n\n// The two bars of the indeterminate line, translated and scaled at once.\nconst primaryTranslate = \"x1pch1fy-B\";\nconst primaryScale = \"xxyp5q1-B\";\nconst secondaryTranslate = \"xzo9tdn-B\";\nconst secondaryScale = \"x1w7bnrt-B\";\n\n// The buffer's dots scroll by one pitch of the pattern and start again.\nconst buffering = \"x19sykc1-B\";\n\n// The arc's own length, written against a path the circle normalises to 100\n// with `pathLength`, so these are percentages of the circumference rather\n// than lengths StyleX would have to work out.\n//\n// Material contracts to 10 degrees of turn and grows to 270. The 270 is 75\n// of the circumference and is written as it is; the 10 is not, because the\n// page's rounded ends change what a short dash draws. A round cap adds half\n// the stroke at each end, so a 10-degree dash on the 40dp ring is 3px of\n// path inside a 7px capsule of 4px stroke — a dot rather than the sliver\n// Material's square-cut ends give at the same angle. 8 is the shortest the\n// cap still draws as an arc, and it is the floor for that reason rather\n// than because the page names it.\nconst expandArc = \"x1t81ys1-B\";\n\n// Where the arc starts. Material turns it in eight increments of 135 degrees\n// rather than at a constant rate, each eased with the same curve the arc's\n// growth uses, so it settles at each position and springs to the next; three\n// full turns over the cycle, under the rotation's own single turn. The\n// numbers here are those angles along a path of 100: 135 degrees is 37.5 of\n// it, and 1080 degrees is 300.\nconst travelArc = \"x26nhu8-B\";\nconst spin = \"x1fy8ia8-B\";\nconst _temp = {\n  kZKoxP: \"xyq6l7l\",\n  kzqmXN: \"x1uyokj7\",\n  \"$$css\": true\n};\nconst _temp2 = {\n  kzqmXN: \"x1uyokj7\",\n  \"$$css\": true\n};\nconst styles = {\n  arcActive: {\n    kjVXCG: \"x1i9vjva\",\n    $$css: true\n  },\n  arcIndeterminate: {\n    kkDQuc: \"x12dwrod\",\n    k44tkh: \"xxx5gdc\",\n    ko0y90: \"x77zgwx\",\n    kKVMdj: \"x14p4i3i\",\n    kyAemX: \"x1582zw4\",\n    kjVXCG: \"x1i9vjva\",\n    k1ekBW: \"x13b0p5u\",\n    $$css: true\n  },\n  arcMotion: {\n    kIyJzY: \"x1wsgiic\",\n    k1ekBW: \"xg0bdzq\",\n    kAMwcw: \"x4ognrn\",\n    $$css: true\n  },\n  arcTrack: {\n    kjVXCG: \"xynoiew\",\n    $$css: true\n  },\n  circular: {\n    kB7OPa: \"x9f619\",\n    k1xSpc: \"x1lliihq\",\n    k3aq6I: \"x9tu13d\",\n    $$css: true\n  },\n  circularIndeterminate: {\n    kkDQuc: \"x7hzzi\",\n    k44tkh: \"x11c9iw4\",\n    ko0y90: \"xa4qsjk\",\n    kKVMdj: \"xpedhrg\",\n    kyAemX: \"x1esw782\",\n    k3aq6I: \"x1c071of\",\n    $$css: true\n  },\n  circularSize: (size: string) => [_temp, {\n    \"--x-blockSize\": (val => typeof val === \"number\" ? val + \"px\" : val != null ? val : undefined)(size),\n    \"--x-inlineSize\": (val => typeof val === \"number\" ? val + \"px\" : val != null ? val : undefined)(size)\n  }],\n  indeterminateBarInner: {\n    kWkggS: \"xnety89\",\n    kaIpWk: \"x1dkaolv\",\n    kB7OPa: \"x9f619\",\n    kpwlN0: \"x10a8y8t\",\n    kVAEAm: \"x10l6tqk\",\n    $$css: true\n  },\n  indeterminateTrack: {\n    kWkggS: \"x15dekr4\",\n    kpwlN0: \"x10a8y8t\",\n    kVAEAm: \"x10l6tqk\",\n    $$css: true\n  },\n  primaryBarInner: {\n    kkDQuc: \"xy02sl2\",\n    k44tkh: \"x1c74tu6\",\n    ko0y90: \"xa4qsjk\",\n    kKVMdj: \"xkj56kq\",\n    kyAemX: \"x1esw782\",\n    $$css: true\n  },\n  rootCircular: {\n    kGNEyG: \"x1cy8zhl\",\n    kzqmXN: \"x14atkfc\",\n    $$css: true\n  },\n  secondaryBarInner: {\n    kkDQuc: \"xy02sl2\",\n    k44tkh: \"x1c74tu6\",\n    ko0y90: \"xa4qsjk\",\n    kKVMdj: \"xnb0dd2\",\n    kyAemX: \"x1esw782\",\n    $$css: true\n  },\n  trackBuffered: {\n    kWkggS: \"x15dekr4\",\n    kZKoxP: \"x5yr21d\",\n    kB7OPa: \"x9f619\",\n    kmuXW: \"x2lah0s\",\n    $$css: true\n  },\n  trackBufferedAt: (share: number) => [_temp2, {\n    \"--x-inlineSize\": (val => typeof val === \"number\" ? val + \"px\" : val != null ? val : undefined)(`${share}%`)\n  }]\n};\ntype ProgressIndicatorProps = {\n  /**\n   * How far the work is loaded ahead of the value — a video's buffered\n   * seconds, a queue's fetched pages. Read on the same scale as `value`: the\n   * track is solid up to it and dotted beyond. Ignored while the indicator\n   * is indeterminate, and left out for work with nothing to buffer.\n   */\n  buffer?: number;\n  /** A function may compute the class from the indicator's render state. */\n  className?: RACProgressBarProps['className'];\n  /**\n   * What the work is, shown above the indicator. A screen reader reads it as\n   * the indicator's name; an indicator whose surroundings name it takes\n   * `aria-label` instead and leaves this out.\n   */\n  label?: ReactNode;\n  /**\n   * Whether the value is shown beside the label. Ignored while the indicator\n   * is indeterminate, which has no value to show.\n   * @default false\n   */\n  showValue?: boolean;\n  /**\n   * How wide the ring is drawn, as a CSS length. Everything inside scales\n   * with it, so `1em` gives a ring the size of the type around it. Ignored\n   * by the line, which fills the width it is given.\n   *\n   * A length rather than a step of the `sm`/`md`/`lg` scale every other\n   * `size` here takes — see AGENTS.md, under Prop vocabularies. A ring sized\n   * to the type around it is what the prop is for, which no fixed scale\n   * gives; the name predates that rule, and changing it is a breaking change\n   * of its own.\n   * @default '40px'\n   */\n  size?: string;\n  /** A function may compute the style from the indicator's render state. */\n  style?: RACProgressBarProps['style'];\n  /**\n   * Which colours it is drawn in. `primary` is the page's own pair — the\n   * active indicator in primary over a secondary container track — and\n   * `inherit` takes the colour around it, for an indicator inside something\n   * that already has one, such as a button, where primary would be the fill.\n   * @default 'primary'\n   */\n  tone?: ProgressIndicatorTone;\n  /**\n   * The line the page draws, or the ring: `linear` fills the width it is\n   * given, `circular` is 40dp across.\n   * @default 'linear'\n   */\n  variant?: ProgressIndicatorVariant;\n} & Omit<RACProgressBarProps, 'children' | 'className' | 'style'>;\n\n// The two of the shared line's four tones an indicator draws. The other two\n// say how a measurement reads, which is a meter's business rather than a\n// running task's.\ntype ProgressIndicatorTone = Extract<IndicatorTone, 'inherit' | 'primary'>;\ntype ProgressIndicatorVariant = 'circular' | 'linear';\n\n// The dashes that cut the two arcs out of one circle. The active arc runs\n// from the top for its share of the circumference; the track picks up 4dp\n// after it and stops 4dp before it comes back round, which is the page's gap\n// measured along the curve.\nfunction arcsFor(percentage: number | undefined) {\n  const active = (percentage ?? 0) / 100 * CIRCUMFERENCE;\n  const track = Math.max(0, CIRCUMFERENCE - active - 2 * GAP);\n  return {\n    active: {\n      strokeDasharray: `${active} ${CIRCUMFERENCE}`,\n      strokeDashoffset: 0\n    },\n    track: {\n      strokeDasharray: `${track} ${CIRCUMFERENCE}`,\n      strokeDashoffset: -(active + GAP)\n    }\n  };\n}\n\n// How much of the track the buffer covers. The buffer is read on the value's\n// scale, and the track holds what the value has not taken, so the solid part\n// is the buffer's share of that remainder.\nfunction bufferShare(buffer: number | undefined, percentage: number | undefined, minValue: number, maxValue: number) {\n  if (buffer === undefined) {\n    return undefined;\n  }\n  const value = percentage ?? 0;\n  const range = maxValue - minValue;\n  const buffered = range === 0 ? 0 : (buffer - minValue) / range * 100;\n  const remaining = 100 - value;\n  if (remaining <= 0) {\n    return 0;\n  }\n  return Math.min(100, Math.max(0, (buffered - value) / remaining * 100));\n}\nfunction CircularTrack({\n  isIndeterminate,\n  percentage,\n  size,\n  tone\n}: {\n  isIndeterminate: boolean;\n  percentage: number | undefined;\n  size: string;\n  tone: ProgressIndicatorTone;\n}) {\n  const inherit = tone === 'inherit';\n  const arcs = arcsFor(percentage);\n  return <svg aria-hidden=\"true\" viewBox={`0 0 ${CIRCULAR_SIZE} ${CIRCULAR_SIZE}`} {...stylex.props(styles.circular, styles.circularSize(size), isIndeterminate && styles.circularIndeterminate)}>\n      {isIndeterminate ? null : <circle cx={CIRCULAR_SIZE / 2} cy={CIRCULAR_SIZE / 2} fill=\"none\" r={RADIUS} strokeDasharray={arcs.track.strokeDasharray} strokeDashoffset={arcs.track.strokeDashoffset} strokeLinecap=\"round\" strokeWidth={THICKNESS} {...stylex.props(styles.arcMotion, styles.arcTrack, inherit && indicatorStyles.inheritTrack)} />}\n      <circle cx={CIRCULAR_SIZE / 2} cy={CIRCULAR_SIZE / 2} fill=\"none\" pathLength={isIndeterminate ? 100 : undefined} r={RADIUS} strokeDasharray={isIndeterminate ? undefined : arcs.active.strokeDasharray} strokeDashoffset={isIndeterminate ? undefined : arcs.active.strokeDashoffset} strokeLinecap=\"round\" strokeWidth={THICKNESS} {...stylex.props(isIndeterminate ? styles.arcIndeterminate : styles.arcMotion, isIndeterminate ? null : styles.arcActive, inherit && indicatorStyles.inheritActive)} />\n    </svg>;\n}\n\n// What the indicator draws, from React Aria's render state. Built by a call\n// rather than written inline at the prop, which is what react-perf's\n// no-new-function-as-prop is after; the React Compiler memoises the result\n// on its inputs.\nfunction indicatorContent(label: ReactNode, showValue: boolean, variant: ProgressIndicatorVariant, buffer: number | undefined, minValue: number, maxValue: number, size: string, tone: ProgressIndicatorTone) {\n  return (state: ProgressBarRenderProps) => <>\n      <IndicatorLabels label={label} value={showValue && !state.isIndeterminate ? state.valueText : undefined} />\n      {variant === 'circular' ? <CircularTrack isIndeterminate={state.isIndeterminate} percentage={state.percentage} size={size} tone={tone} /> : <LinearTrack buffer={bufferShare(buffer, state.percentage, minValue, maxValue)} isIndeterminate={state.isIndeterminate} percentage={state.percentage} tone={tone} />}\n    </>;\n}\nfunction LinearTrack({\n  buffer,\n  isIndeterminate,\n  percentage,\n  tone\n}: {\n  buffer: number | undefined;\n  isIndeterminate: boolean;\n  percentage: number | undefined;\n  tone: ProgressIndicatorTone;\n}) {\n  const inherit = tone === 'inherit';\n  if (isIndeterminate) {\n    return <div className=\"xqu0tyb x1dkaolv x9f619 xh8yej3 xb3r6kr x1n2onr6\">\n        <span {...stylex.props(styles.indeterminateTrack, inherit && indicatorStyles.inheritTrack)} />\n        <span className=\"xqu0tyb x9f619 xh8yej3 x13vifvy x10l6tqk x1nf803f xy02sl2 x1c74tu6 xa4qsjk x4hg7df x1esw782 x1hev8vu\">\n          <span {...stylex.props(styles.indeterminateBarInner, styles.primaryBarInner, inherit && indicatorStyles.inheritActive)} />\n        </span>\n        <span className=\"xqu0tyb x9f619 xh8yej3 x13vifvy x10l6tqk x1nf803f xy02sl2 x1c74tu6 xa4qsjk x1pdi2bj x1esw782 xmvyqo8\">\n          <span {...stylex.props(styles.indeterminateBarInner, styles.secondaryBarInner, inherit && indicatorStyles.inheritActive)} />\n        </span>\n      </div>;\n  }\n  return <IndicatorLine percentage={percentage ?? 0} tone={tone}>\n      {buffer === undefined ? undefined : <>\n          <span {...stylex.props(styles.trackBuffered, styles.trackBufferedAt(buffer))} />\n          <span className=\"x114jyov xs4xyr0 xa4qsjk xwx18z9 x1esw782 x1d6qlk4 x1w3jsh0 xwj9l49 x5yr21d x9f619 x1iyjqo2 xeuugli\" />\n        </>}\n    </IndicatorLine>;\n}\n\n/**\n * Progress through a task, as a line or a ring. Its value is React Aria's:\n * pass `value` between `minValue` and `maxValue`, or leave `value` out and\n * set `isIndeterminate` for work whose length is not known. `formatOptions`\n * says how the value reads, in the locale the page is in, and `buffer` marks\n * how far the work is loaded ahead of it.\n *\n * The call site's `className` and `style` land on the indicator as a whole,\n * which is the element a layout positions.\n */\nfunction ProgressIndicator({\n  buffer,\n  label,\n  maxValue = 100,\n  minValue = 0,\n  showValue = false,\n  size = CIRCULAR_SIZE_PX,\n  tone = 'primary',\n  variant = 'linear',\n  ...props\n}: ProgressIndicatorProps) {\n  return <ProgressBar maxValue={maxValue} minValue={minValue} {...props} {...mergeStatefulStyles(stylex.props(indicatorStyles.root, variant === 'circular' && styles.rootCircular), props)}>\n      {indicatorContent(label, showValue, variant, buffer, minValue, maxValue, size, tone)}\n    </ProgressBar>;\n}\nexport type { ProgressIndicatorProps, ProgressIndicatorTone, ProgressIndicatorVariant };\nexport default ProgressIndicator;"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["ReactNode","ProgressBarRenderProps","ProgressBarProps","RACProgressBarProps","stylex","ProgressBar","IndicatorTone","IndicatorLabels","IndicatorLine","indicatorStyles","mergeStatefulStyles","colors","radii","CIRCULAR_SIZE","CIRCULAR_SIZE_PX","THICKNESS","GAP","RADIUS","CIRCUMFERENCE","Math","PI","ARC_MS","CYCLE_MS","ROTATE_MS","round","RING_EASING","INDETERMINATE_MS","BUFFER_MS","LINE_SLOWDOWN","RING_SLOWDOWN","primaryTranslate","primaryScale","secondaryTranslate","secondaryScale","buffering","expandArc","travelArc","spin","_temp","kZKoxP","kzqmXN","_temp2","styles","arcActive","kjVXCG","$$css","arcIndeterminate","kkDQuc","k44tkh","ko0y90","kKVMdj","kyAemX","k1ekBW","arcMotion","kIyJzY","kAMwcw","arcTrack","circular","kB7OPa","k1xSpc","k3aq6I","circularIndeterminate","circularSize","size","val","undefined","indeterminateBarInner","kWkggS","kaIpWk","kpwlN0","kVAEAm","indeterminateTrack","primaryBarInner","rootCircular","kGNEyG","secondaryBarInner","trackBuffered","kmuXW","trackBufferedAt","share","ProgressIndicatorProps","buffer","className","label","showValue","style","tone","ProgressIndicatorTone","variant","ProgressIndicatorVariant","Omit","Extract","arcsFor","percentage","active","track","max","strokeDasharray","strokeDashoffset","bufferShare","minValue","maxValue","value","range","buffered","remaining","min","CircularTrack","t0","$","_c","isIndeterminate","inherit","t1","arcs","t2","props","t3","inheritTrack","t4","t5","t6","t7","inheritActive","t8","t9","indicatorContent","state","valueText","LinearTrack","ProgressIndicator","T0","t10","t11","t12","root"],"sources":["../../../src/components/progress-indicator/index.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport type { ProgressBarRenderProps, ProgressBarProps as RACProgressBarProps } from 'react-aria-components';\nimport * as stylex from '@stylexjs/stylex';\nimport { ProgressBar } from 'react-aria-components';\nimport type { IndicatorTone } from '../../indicator/styles';\nimport { IndicatorLabels, IndicatorLine } from '../../indicator';\nimport { indicatorStyles } from '../../indicator/styles';\nimport { mergeStatefulStyles } from '../../styles/merge';\nimport '../../tokens/design.tokens.stylex';\nimport { colors, radii } from '../../tokens/design.tokens.stylex';\n\n// The progress indicators page's two shapes, drawn flat: the page's wavy\n// shape is the Expressive column's alone, and its amplitude and wavelength\n// belong to a variant rather than to this. Both carry the three parts the\n// page's anatomy names — the active indicator in primary, the track in\n// secondary container, and, on the line, the stop indicator in primary at\n// the end — at the page's 4dp thickness, with the 4dp gap its measurements\n// give either side of the track. The ring is the page's default 40dp of the\n// four sizes it draws.\n//\n// The determinate line is a row of those parts, so the active indicator's\n// width is the percentage itself and the track takes what is left. The\n// determinate ring is two arcs of one circle, cut by the dash pattern: the\n// active arc runs from the top for its share of the circumference, and the\n// track picks up 4dp past it and stops 4dp before it comes back round,\n// which is the same gap measured along the curve.\n//\n// The animations are Material's own rather than something assembled from\n// the motion tokens: an indeterminate indicator is a piece of choreography,\n// and one written from scratch reads as a different component beside a\n// Material app. Material Web and Angular Material both descend from the\n// same implementation and agree on every number, so the numbers here are\n// theirs — the line's two bars and their four keyframe sets, the buffer's\n// scrolling dots, the ring's 1333ms arc, its four-arc cycle and its 1568ms\n// rotation, and the 250ms and 500ms a determinate value moves over.\n//\n// Two things are decided differently, both after reading the two of them.\n//\n// The ring is one dashed arc rather than two halves. Material Web draws it\n// as a pair of bordered half-circles, Angular as a pair of clipped SVG\n// circles with a patch over the seam between them; both constructions exist\n// to work around that split, and a single arc whose dash pattern is\n// animated needs neither and shares its geometry with the determinate ring.\n// The three effects it composes are still theirs: the arc grows and shrinks\n// over the arc's duration, its start travels the circle over four of those,\n// and the whole thing turns over the rotation's.\n//\n// Under `prefers-reduced-motion` the motion slows rather than stopping,\n// which is Angular's answer and the better one: an indicator that freezes\n// stops saying the work is going on, and a frozen arc caught at its short\n// end reads as broken. The multipliers are Angular's — two for the line,\n// and a quarter more for the ring.\n//\n// React Aria's `ProgressBar` is the root: it carries the role, the value and\n// its text, and reports the percentage and whether it is indeterminate as\n// render state, which is what everything here is drawn from.\n\n// The circle the arcs are cut from. The radius is the diameter less the\n// stroke, halved, so the stroke sits inside the 40dp box rather than\n// straddling its edge.\n//\n// The thickness and the gap are the same 4dp the shared line is drawn at,\n// written again rather than imported from `src/indicator/styles`: StyleX\n// evaluates the values inside `stylex.create` and `stylex.keyframes` as it\n// compiles, and will not follow an import to a module that is not a theme\n// to reach one — an imported constant fails the transform outright.\nconst CIRCULAR_SIZE = 40;\n// The same value as a length, hoisted rather than built at the parameter.\n// The compiler has no safe reordering for a template literal, so one written\n// as a default parameter skips the whole component around it — which the\n// panic threshold this lands beside turns into a build failure.\nconst CIRCULAR_SIZE_PX = `${CIRCULAR_SIZE}px`;\nconst THICKNESS = 4;\nconst GAP = 4;\nconst RADIUS = (CIRCULAR_SIZE - THICKNESS) / 2;\nconst CIRCUMFERENCE = 2 * Math.PI * RADIUS;\n\n// The ring's timings. The arc is 1333ms; a full cycle is four of them; and\n// the rotation is the arc scaled by 360/306, which is the arc's start\n// rotation plus the circle less the arc's size.\nconst ARC_MS = 1333;\nconst CYCLE_MS = ARC_MS * 4;\nconst ROTATE_MS = Math.round(ARC_MS * 360 / 306);\nconst RING_EASING = 'cubic-bezier(0.4, 0, 0.2, 1)';\n\n// The line's own: 2s for an indeterminate pass, and the 250ms the buffer's\n// dots take to scroll one pitch. What a determinate value moves over is the\n// shared line's, since a meter moves the same way.\nconst INDETERMINATE_MS = 2000;\nconst BUFFER_MS = 250;\n\n// What `prefers-reduced-motion` slows each shape by.\nconst LINE_SLOWDOWN = 2;\nconst RING_SLOWDOWN = 1.25;\n\n// The two bars of the indeterminate line, translated and scaled at once.\nconst primaryTranslate = \"x1pch1fy-B\";\nconst primaryScale = \"xxyp5q1-B\";\nconst secondaryTranslate = \"xzo9tdn-B\";\nconst secondaryScale = \"x1w7bnrt-B\";\n\n// The buffer's dots scroll by one pitch of the pattern and start again.\nconst buffering = \"x19sykc1-B\";\n\n// The arc's own length, written against a path the circle normalises to 100\n// with `pathLength`, so these are percentages of the circumference rather\n// than lengths StyleX would have to work out.\n//\n// Material contracts to 10 degrees of turn and grows to 270. The 270 is 75\n// of the circumference and is written as it is; the 10 is not, because the\n// page's rounded ends change what a short dash draws. A round cap adds half\n// the stroke at each end, so a 10-degree dash on the 40dp ring is 3px of\n// path inside a 7px capsule of 4px stroke — a dot rather than the sliver\n// Material's square-cut ends give at the same angle. 8 is the shortest the\n// cap still draws as an arc, and it is the floor for that reason rather\n// than because the page names it.\nconst expandArc = \"x1t81ys1-B\";\n\n// Where the arc starts. Material turns it in eight increments of 135 degrees\n// rather than at a constant rate, each eased with the same curve the arc's\n// growth uses, so it settles at each position and springs to the next; three\n// full turns over the cycle, under the rotation's own single turn. The\n// numbers here are those angles along a path of 100: 135 degrees is 37.5 of\n// it, and 1080 degrees is 300.\nconst travelArc = \"x26nhu8-B\";\nconst spin = \"x1fy8ia8-B\";\nconst _temp = {\n  kZKoxP: \"xyq6l7l\",\n  kzqmXN: \"x1uyokj7\",\n  \"$$css\": true\n};\nconst _temp2 = {\n  kzqmXN: \"x1uyokj7\",\n  \"$$css\": true\n};\nconst styles = {\n  arcActive: {\n    kjVXCG: \"x1i9vjva\",\n    $$css: true\n  },\n  arcIndeterminate: {\n    kkDQuc: \"x12dwrod\",\n    k44tkh: \"xxx5gdc\",\n    ko0y90: \"x77zgwx\",\n    kKVMdj: \"x14p4i3i\",\n    kyAemX: \"x1582zw4\",\n    kjVXCG: \"x1i9vjva\",\n    k1ekBW: \"x13b0p5u\",\n    $$css: true\n  },\n  arcMotion: {\n    kIyJzY: \"x1wsgiic\",\n    k1ekBW: \"xg0bdzq\",\n    kAMwcw: \"x4ognrn\",\n    $$css: true\n  },\n  arcTrack: {\n    kjVXCG: \"xynoiew\",\n    $$css: true\n  },\n  circular: {\n    kB7OPa: \"x9f619\",\n    k1xSpc: \"x1lliihq\",\n    k3aq6I: \"x9tu13d\",\n    $$css: true\n  },\n  circularIndeterminate: {\n    kkDQuc: \"x7hzzi\",\n    k44tkh: \"x11c9iw4\",\n    ko0y90: \"xa4qsjk\",\n    kKVMdj: \"xpedhrg\",\n    kyAemX: \"x1esw782\",\n    k3aq6I: \"x1c071of\",\n    $$css: true\n  },\n  circularSize: (size: string) => [_temp, {\n    \"--x-blockSize\": (val => typeof val === \"number\" ? val + \"px\" : val != null ? val : undefined)(size),\n    \"--x-inlineSize\": (val => typeof val === \"number\" ? val + \"px\" : val != null ? val : undefined)(size)\n  }],\n  indeterminateBarInner: {\n    kWkggS: \"xnety89\",\n    kaIpWk: \"x1dkaolv\",\n    kB7OPa: \"x9f619\",\n    kpwlN0: \"x10a8y8t\",\n    kVAEAm: \"x10l6tqk\",\n    $$css: true\n  },\n  indeterminateTrack: {\n    kWkggS: \"x15dekr4\",\n    kpwlN0: \"x10a8y8t\",\n    kVAEAm: \"x10l6tqk\",\n    $$css: true\n  },\n  primaryBarInner: {\n    kkDQuc: \"xy02sl2\",\n    k44tkh: \"x1c74tu6\",\n    ko0y90: \"xa4qsjk\",\n    kKVMdj: \"xkj56kq\",\n    kyAemX: \"x1esw782\",\n    $$css: true\n  },\n  rootCircular: {\n    kGNEyG: \"x1cy8zhl\",\n    kzqmXN: \"x14atkfc\",\n    $$css: true\n  },\n  secondaryBarInner: {\n    kkDQuc: \"xy02sl2\",\n    k44tkh: \"x1c74tu6\",\n    ko0y90: \"xa4qsjk\",\n    kKVMdj: \"xnb0dd2\",\n    kyAemX: \"x1esw782\",\n    $$css: true\n  },\n  trackBuffered: {\n    kWkggS: \"x15dekr4\",\n    kZKoxP: \"x5yr21d\",\n    kB7OPa: \"x9f619\",\n    kmuXW: \"x2lah0s\",\n    $$css: true\n  },\n  trackBufferedAt: (share: number) => [_temp2, {\n    \"--x-inlineSize\": (val => typeof val === \"number\" ? val + \"px\" : val != null ? val : undefined)(`${share}%`)\n  }]\n};\ntype ProgressIndicatorProps = {\n  /**\n   * How far the work is loaded ahead of the value — a video's buffered\n   * seconds, a queue's fetched pages. Read on the same scale as `value`: the\n   * track is solid up to it and dotted beyond. Ignored while the indicator\n   * is indeterminate, and left out for work with nothing to buffer.\n   */\n  buffer?: number;\n  /** A function may compute the class from the indicator's render state. */\n  className?: RACProgressBarProps['className'];\n  /**\n   * What the work is, shown above the indicator. A screen reader reads it as\n   * the indicator's name; an indicator whose surroundings name it takes\n   * `aria-label` instead and leaves this out.\n   */\n  label?: ReactNode;\n  /**\n   * Whether the value is shown beside the label. Ignored while the indicator\n   * is indeterminate, which has no value to show.\n   * @default false\n   */\n  showValue?: boolean;\n  /**\n   * How wide the ring is drawn, as a CSS length. Everything inside scales\n   * with it, so `1em` gives a ring the size of the type around it. Ignored\n   * by the line, which fills the width it is given.\n   *\n   * A length rather than a step of the `sm`/`md`/`lg` scale every other\n   * `size` here takes — see AGENTS.md, under Prop vocabularies. A ring sized\n   * to the type around it is what the prop is for, which no fixed scale\n   * gives; the name predates that rule, and changing it is a breaking change\n   * of its own.\n   * @default '40px'\n   */\n  size?: string;\n  /** A function may compute the style from the indicator's render state. */\n  style?: RACProgressBarProps['style'];\n  /**\n   * Which colours it is drawn in. `primary` is the page's own pair — the\n   * active indicator in primary over a secondary container track — and\n   * `inherit` takes the colour around it, for an indicator inside something\n   * that already has one, such as a button, where primary would be the fill.\n   * @default 'primary'\n   */\n  tone?: ProgressIndicatorTone;\n  /**\n   * The line the page draws, or the ring: `linear` fills the width it is\n   * given, `circular` is 40dp across.\n   * @default 'linear'\n   */\n  variant?: ProgressIndicatorVariant;\n} & Omit<RACProgressBarProps, 'children' | 'className' | 'style'>;\n\n// The two of the shared line's four tones an indicator draws. The other two\n// say how a measurement reads, which is a meter's business rather than a\n// running task's.\ntype ProgressIndicatorTone = Extract<IndicatorTone, 'inherit' | 'primary'>;\ntype ProgressIndicatorVariant = 'circular' | 'linear';\n\n// The dashes that cut the two arcs out of one circle. The active arc runs\n// from the top for its share of the circumference; the track picks up 4dp\n// after it and stops 4dp before it comes back round, which is the page's gap\n// measured along the curve.\nfunction arcsFor(percentage: number | undefined) {\n  const active = (percentage ?? 0) / 100 * CIRCUMFERENCE;\n  const track = Math.max(0, CIRCUMFERENCE - active - 2 * GAP);\n  return {\n    active: {\n      strokeDasharray: `${active} ${CIRCUMFERENCE}`,\n      strokeDashoffset: 0\n    },\n    track: {\n      strokeDasharray: `${track} ${CIRCUMFERENCE}`,\n      strokeDashoffset: -(active + GAP)\n    }\n  };\n}\n\n// How much of the track the buffer covers. The buffer is read on the value's\n// scale, and the track holds what the value has not taken, so the solid part\n// is the buffer's share of that remainder.\nfunction bufferShare(buffer: number | undefined, percentage: number | undefined, minValue: number, maxValue: number) {\n  if (buffer === undefined) {\n    return undefined;\n  }\n  const value = percentage ?? 0;\n  const range = maxValue - minValue;\n  const buffered = range === 0 ? 0 : (buffer - minValue) / range * 100;\n  const remaining = 100 - value;\n  if (remaining <= 0) {\n    return 0;\n  }\n  return Math.min(100, Math.max(0, (buffered - value) / remaining * 100));\n}\nfunction CircularTrack({\n  isIndeterminate,\n  percentage,\n  size,\n  tone\n}: {\n  isIndeterminate: boolean;\n  percentage: number | undefined;\n  size: string;\n  tone: ProgressIndicatorTone;\n}) {\n  const inherit = tone === 'inherit';\n  const arcs = arcsFor(percentage);\n  return <svg aria-hidden=\"true\" viewBox={`0 0 ${CIRCULAR_SIZE} ${CIRCULAR_SIZE}`} {...stylex.props(styles.circular, styles.circularSize(size), isIndeterminate && styles.circularIndeterminate)}>\n      {isIndeterminate ? null : <circle cx={CIRCULAR_SIZE / 2} cy={CIRCULAR_SIZE / 2} fill=\"none\" r={RADIUS} strokeDasharray={arcs.track.strokeDasharray} strokeDashoffset={arcs.track.strokeDashoffset} strokeLinecap=\"round\" strokeWidth={THICKNESS} {...stylex.props(styles.arcMotion, styles.arcTrack, inherit && indicatorStyles.inheritTrack)} />}\n      <circle cx={CIRCULAR_SIZE / 2} cy={CIRCULAR_SIZE / 2} fill=\"none\" pathLength={isIndeterminate ? 100 : undefined} r={RADIUS} strokeDasharray={isIndeterminate ? undefined : arcs.active.strokeDasharray} strokeDashoffset={isIndeterminate ? undefined : arcs.active.strokeDashoffset} strokeLinecap=\"round\" strokeWidth={THICKNESS} {...stylex.props(isIndeterminate ? styles.arcIndeterminate : styles.arcMotion, isIndeterminate ? null : styles.arcActive, inherit && indicatorStyles.inheritActive)} />\n    </svg>;\n}\n\n// What the indicator draws, from React Aria's render state. Built by a call\n// rather than written inline at the prop, which is what react-perf's\n// no-new-function-as-prop is after; the React Compiler memoises the result\n// on its inputs.\nfunction indicatorContent(label: ReactNode, showValue: boolean, variant: ProgressIndicatorVariant, buffer: number | undefined, minValue: number, maxValue: number, size: string, tone: ProgressIndicatorTone) {\n  return (state: ProgressBarRenderProps) => <>\n      <IndicatorLabels label={label} value={showValue && !state.isIndeterminate ? state.valueText : undefined} />\n      {variant === 'circular' ? <CircularTrack isIndeterminate={state.isIndeterminate} percentage={state.percentage} size={size} tone={tone} /> : <LinearTrack buffer={bufferShare(buffer, state.percentage, minValue, maxValue)} isIndeterminate={state.isIndeterminate} percentage={state.percentage} tone={tone} />}\n    </>;\n}\nfunction LinearTrack({\n  buffer,\n  isIndeterminate,\n  percentage,\n  tone\n}: {\n  buffer: number | undefined;\n  isIndeterminate: boolean;\n  percentage: number | undefined;\n  tone: ProgressIndicatorTone;\n}) {\n  const inherit = tone === 'inherit';\n  if (isIndeterminate) {\n    return <div className=\"xqu0tyb x1dkaolv x9f619 xh8yej3 xb3r6kr x1n2onr6 x19axjrm x1c071of\">\n        <span {...stylex.props(styles.indeterminateTrack, inherit && indicatorStyles.inheritTrack)} />\n        <span className=\"xqu0tyb x9f619 xh8yej3 x13vifvy x10l6tqk x1nf803f xy02sl2 x1c74tu6 xa4qsjk x4hg7df x1esw782 xoia761\">\n          <span {...stylex.props(styles.indeterminateBarInner, styles.primaryBarInner, inherit && indicatorStyles.inheritActive)} />\n        </span>\n        <span className=\"xqu0tyb x9f619 xh8yej3 x13vifvy x10l6tqk x1nf803f xy02sl2 x1c74tu6 xa4qsjk x1pdi2bj x1esw782 xnsac6p\">\n          <span {...stylex.props(styles.indeterminateBarInner, styles.secondaryBarInner, inherit && indicatorStyles.inheritActive)} />\n        </span>\n      </div>;\n  }\n  return <IndicatorLine percentage={percentage ?? 0} tone={tone}>\n      {buffer === undefined ? undefined : <>\n          <span {...stylex.props(styles.trackBuffered, styles.trackBufferedAt(buffer))} />\n          <span className=\"x114jyov xs4xyr0 xa4qsjk xwx18z9 x1esw782 x1d6qlk4 x1w3jsh0 xwj9l49 x5yr21d x9f619 x1iyjqo2 xeuugli\" />\n        </>}\n    </IndicatorLine>;\n}\n\n/**\n * Progress through a task, as a line or a ring. Its value is React Aria's:\n * pass `value` between `minValue` and `maxValue`, or leave `value` out and\n * set `isIndeterminate` for work whose length is not known. `formatOptions`\n * says how the value reads, in the locale the page is in, and `buffer` marks\n * how far the work is loaded ahead of it.\n *\n * The call site's `className` and `style` land on the indicator as a whole,\n * which is the element a layout positions.\n */\nfunction ProgressIndicator({\n  buffer,\n  label,\n  maxValue = 100,\n  minValue = 0,\n  showValue = false,\n  size = CIRCULAR_SIZE_PX,\n  tone = 'primary',\n  variant = 'linear',\n  ...props\n}: ProgressIndicatorProps) {\n  return <ProgressBar maxValue={maxValue} minValue={minValue} {...props} {...mergeStatefulStyles(stylex.props(indicatorStyles.root, variant === 'circular' && styles.rootCircular), props)}>\n      {indicatorContent(label, showValue, variant, buffer, minValue, maxValue, size, tone)}\n    </ProgressBar>;\n}\nexport type { ProgressIndicatorProps, ProgressIndicatorTone, ProgressIndicatorVariant };\nexport default ProgressIndicator;"],"mappings":"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"}

package/dist/components/range-calendar/index.js

@@ -10,7 +10,7 @@ import { CalendarCell, CalendarGrid, CalendarGridBody, RangeCalendar } from "rea
 //#region src/components/range-calendar/index.tsx
 function cellClassName(state) {
 	const isEnd = state.isSelected && (state.isSelectionStart || state.isSelectionEnd);
-	return props(calendarStyles.cell, focus.ring, state.isToday && calendarStyles.cellToday, state.isSelected && calendarStyles.cellInRange, state.isSelected && state.isSelectionStart && calendarStyles.cellRangeStart, state.isSelected && state.isSelectionEnd && calendarStyles.cellRangeEnd, isEnd && calendarStyles.cellSelected, state.isDisabled && calendarStyles.cellDisabled).className ?? "";
+	return props(calendarStyles.cell, focus.ring, state.isToday && calendarStyles.cellToday, state.isSelected && calendarStyles.cellInRange, state.isSelected && state.isSelectionStart && calendarStyles.cellRangeStart, state.isSelected && state.isSelectionEnd && calendarStyles.cellRangeEnd, isEnd && calendarStyles.cellSelected, state.isUnavailable && calendarStyles.cellUnavailable, state.isDisabled && calendarStyles.cellDisabled).className ?? "";
 }
 function gridCell(date) {
 	return /* @__PURE__ */ jsx(CalendarCell, {