@kanso-labs/kanso-ui 0.40.6 → 0.40.8

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","ReactNode","RefAttributes","FocusableElement","ToastRegionProps","RACToastRegionProps","ToastRegionRenderProps","stylex","Button","RACButton","UNSTABLE_Toast","RACToast","UNSTABLE_ToastContent","RACToastContent","UNSTABLE_ToastQueue","RACToastQueue","UNSTABLE_ToastRegion","RACToastRegion","Text","CloseGlyph","useRipple","layers","mergeStatefulStyles","colors","motion","radii","shadows","sizing","spacing","stateLayerOpacity","typography","MESSAGE_MS","UNTIL_CLOSED","WIDE","rise","FORCED_COLORS","styles","action","kMwMTN","kMv6JI","kGuDYH","k63SB2","kb6lSQ","kLWn49","k8WAf4","kg3NbH","$$css","close","kZKoxP","kzqmXN","kmVPX3","control","kGNEyG","kWkggS","kaIpWk","kMzoRj","kB7OPa","kkrTdU","k1xSpc","kmuXW","kjj79g","kjBf7l","kInvED","k3XXqK","kMeerF","kVQacm","kVAEAm","controlFocused","controlHovered","controlPressed","SnackbarAction","label","onPress","SnackbarMessage","message","showCloseButton","SnackbarOptions","onClose","timeout","SnackbarProps","className","closeLabel","queue","SnackbarQueue","style","Omit","SnackbarToastItem","rac","constructor","maxVisibleToasts","add","options","undefined","clear","key","actionPress","closeToast","controlClassName","StyleXStyles","state","isFocusVisible","isHovered","isPressed","props","Snackbar","t0","$","T0","t1","t2","t3","t4","t5","snackbarContent","SnackbarButton","children","ripple","handlers","surface","toast","SnackbarControls","SnackbarToast","content","Queue","SnackbarRegionRenderProps","RACToastQueue","stylex.props","_c","RACToastRegion","RACButton","RACToastContent","RACToast"],"sources":["../../../src/components/snackbar/index.tsx"],"sourcesContent":["'use client';\n\nimport type { ReactNode, RefAttributes } from 'react';\nimport type { FocusableElement, ToastRegionProps as RACToastRegionProps, ToastRegionRenderProps } from 'react-aria-components';\nimport * as stylex from '@stylexjs/stylex';\nimport { Button as RACButton, UNSTABLE_Toast as RACToast, UNSTABLE_ToastContent as RACToastContent, UNSTABLE_ToastQueue as RACToastQueue, UNSTABLE_ToastRegion as RACToastRegion, Text } from 'react-aria-components';\nimport { CloseGlyph } from '../../glyphs';\nimport { useRipple } from '../../hooks/useRipple';\nimport '../../styles/layers.stylex';\nimport { layers } from '../../styles/layers.stylex';\nimport { mergeStatefulStyles } from '../../styles/merge';\nimport '../../tokens/design.tokens.stylex';\nimport { colors, motion, radii, shadows, sizing, spacing, stateLayerOpacity, typography } from '../../tokens/design.tokens.stylex';\n\n// The snackbar page's brief message at the bottom of the screen, with an\n// optional action beside it and an optional close button after that. The\n// page's container is the inverse surface at a 4dp corner and elevation 3,\n// its supporting text is body-medium in inverse on surface, its action label\n// is inverse primary, and its close icon takes the supporting text's colour.\n// The measurements are the page's too: 8dp of margin from the edges of the\n// screen, 8dp of padding inside the container with another 8dp either side\n// of the message, 14dp above and below on a single line, and between 320 and\n// 576dp wide above the page's 600dp breakpoint — full width below it.\n//\n// One at a time. The page shows a single snackbar and replaces it rather\n// than stacking, which is `maxVisibleToasts: 1` on the queue.\n//\n// React Aria's toast is the behaviour: the region is a landmark that holds\n// the message, moves focus into it for a keyboard, and pauses every timer\n// while it is hovered or focused, so a message never expires while it is\n// being read or acted on.\n//\n// Three things are decided here rather than taken from React Aria or from\n// the page.\n//\n// **The queue is ours, not React Aria's.** React Aria's toast is still\n// `UNSTABLE_`, and `SnackbarQueue` is what keeps that name out of a\n// consumer's code — an upstream rename is this file rather than every call\n// site. It wraps their queue, defaults it to one visible message, and takes\n// the message and its options as one call.\n//\n// **The action and the close button are drawn here rather than through\n// Button and IconButton.** The page colours them inverse primary and inverse\n// on surface, which no variant of either carries, and a colour pushed in\n// from outside through `className` is the merge hazard AGENTS.md describes:\n// StyleX decides between two atomic classes by their order in the compiled\n// stylesheet, not by the order they are applied. Both are React Aria's\n// `Button` with the same ripple and the same state layers, over\n// `currentColor` so each takes the colour the snackbar gives it.\n//\n// **There is no `container` prop.** Every other overlay here takes one,\n// because React Aria's `Modal` and `Popover` accept a portal container, and\n// `src/components/portal-container.test.tsx` is what keeps that true.\n// Its toast region does not: it reads a portal provider that\n// `react-aria-components` does not export, so the region always lands at the\n// end of `<body>`. An app that scopes its StyleX theme to a subtree has to\n// put the theme on `:root` for the snackbar to be drawn in it.\n\n// How long a message is shown when the call site names no `timeout`. The\n// specs page gives no duration, so these come from the snackbar's guidelines\n// and accessibility pages.\n//\n// A message alone leaves after five seconds. The pages allow four to ten, and\n// React Aria's toast docs set five as the least a reader should be given.\n//\n// A message with an action stays until the action is taken or something\n// closes it, as the pages ask of every actionable snackbar. No timer can know\n// how long a reader needs to act: a screen reader user hears the message\n// first and has to reach the region before the action is any use, and the\n// pause while the region is hovered or focused only starts once they have.\n// Android's snackbar can keep shorter defaults because the platform lengthens\n// them from each user's accessibility settings, and the web has no such\n// setting to read.\nconst MESSAGE_MS = 5000;\nconst UNTIL_CLOSED = 0;\n\n// Below the page's 600dp breakpoint the snackbar runs the width of the\n// screen; above it, it takes between 320 and 576.\nconst WIDE = '@media (min-width: 600px)';\n\n// The page's own is a fade. It rises a little as it arrives too, which is\n// what the page draws and what says the message came from the edge of the\n// screen rather than appearing over it.\nconst rise = \"x15b941j-B\";\n\n// Windows High Contrast and the rest of the forced-colours modes. Spelled\n// here rather than imported, for the reason src/field/styles.ts records: the\n// StyleX compiler resolves a constant across files only out of a `.stylex.ts`\n// module, and the generated one holds design tokens rather than queries.\nconst FORCED_COLORS = '@media (forced-colors: active)';\nconst styles = {\n  action: {\n    kMwMTN: \"x16bex6i\",\n    kMv6JI: \"xkknnkr\",\n    kGuDYH: \"x14zspaw\",\n    k63SB2: \"x1v9cpvo\",\n    kb6lSQ: \"x155f00i\",\n    kLWn49: \"x1lz68p4\",\n    k8WAf4: \"x1cmllll\",\n    kg3NbH: \"x18fpw6u\",\n    $$css: true\n  },\n  close: {\n    kZKoxP: \"xbg5kjn\",\n    kMwMTN: \"x1girmi0\",\n    kzqmXN: \"xoqf9c6\",\n    kmVPX3: \"x1717udv\",\n    $$css: true\n  },\n  control: {\n    kGNEyG: \"x6s0dn4\",\n    kWkggS: \"xjbqb8w\",\n    kaIpWk: \"x1dkaolv\",\n    kMzoRj: \"xc342km\",\n    kB7OPa: \"x9f619\",\n    kkrTdU: \"x1ypdohk\",\n    k1xSpc: \"x3nfvp2\",\n    kmuXW: \"x2lah0s\",\n    kjj79g: \"xl56j7k\",\n    kjBf7l: \"x14ytart\",\n    kInvED: \"x1hl8ikr\",\n    k3XXqK: \"x9v5kkp x1t137rt\",\n    kMeerF: \"x1de99jn\",\n    kVQacm: \"xb3r6kr\",\n    kVAEAm: \"x1n2onr6\",\n    $$css: true\n  },\n  controlFocused: {\n    kWkggS: \"x1mbb5iu\",\n    $$css: true\n  },\n  controlHovered: {\n    kWkggS: \"x930l3l\",\n    $$css: true\n  },\n  controlPressed: {\n    kWkggS: \"xsykwg8\",\n    $$css: true\n  }\n};\ntype SnackbarAction = {\n  /** What the action says. The page gives it a single word where it can. */\n  label: string;\n  /** Run when the action is pressed, just before the snackbar closes. */\n  onPress: () => void;\n};\n\n/** What a snackbar carries: its message, and what may sit beside it. */\ntype SnackbarMessage = {\n  action: SnackbarAction | undefined;\n  message: ReactNode;\n  showCloseButton: boolean;\n};\ntype SnackbarOptions = {\n  /**\n   * A single action shown after the message. Pressing it runs `onPress` and\n   * closes the snackbar, which is what the page draws.\n   */\n  action?: SnackbarAction;\n  /** Run when the snackbar closes, however it was closed. */\n  onClose?: () => void;\n  /**\n   * Whether a close button is shown at the end. The page draws one for a\n   * message a reader may want out of the way before it expires.\n   *\n   * Named for what it draws rather than `isDismissable`, which on `Sheet`,\n   * `Dialog` and React Aria's modals is whether a press outside them closes\n   * them — a snackbar has no outside to press.\n   * @default false\n   */\n  showCloseButton?: boolean;\n  /**\n   * How long the snackbar is shown, in milliseconds. Defaults to five seconds\n   * for a message alone. A message with an action defaults to `0` and stays\n   * until the action is taken or something closes it, as Material Design asks\n   * of an actionable snackbar, since a reader may need longer to reach the\n   * action than any timer allows. The timer is paused while the region is\n   * hovered or focused, so a message never expires while it is being read.\n   *\n   * `0` is the page's indefinite length: the snackbar stays until something\n   * closes it. Give one of those an action or `showCloseButton`, or there is no\n   * way to be rid of it.\n   */\n  timeout?: number;\n};\ntype SnackbarProps = {\n  /**\n   * What a screen reader calls the region holding the snackbar. Left out,\n   * React Aria names the region itself: a count of the messages it holds, in\n   * the reader's own locale — \"1 notification.\" in English, and one of some\n   * thirty languages otherwise. Pass a name only to replace that, and pass a\n   * translated one, since whatever is passed is read as written.\n   */\n  'aria-label'?: string;\n  /** A function may compute the class from the region's render state. */\n  className?: RACToastRegionProps<SnackbarMessage>['className'];\n  /**\n   * What a screen reader calls the button that dismisses a snackbar. It sits\n   * here rather than on a message's own options because it does not vary by\n   * message, so putting it there would make every `add` call repeat it. Left\n   * out, React Aria names it in the reader's locale — \"Close\" in English.\n   */\n  closeLabel?: string;\n  /** The queue the region shows messages from. */\n  queue: SnackbarQueue;\n  /** A function may compute the style from the region's render state. */\n  style?: RACToastRegionProps<SnackbarMessage>['style'];\n} & Omit<RACToastRegionProps<SnackbarMessage>, 'children' | 'className' | 'queue' | 'style'>;\n\n// One entry of the queue, as React Aria hands it to the region's render\n// function. Taken from its render state rather than imported from\n// `react-stately`, which this package does not depend on.\ntype SnackbarToastItem = ToastRegionRenderProps<SnackbarMessage>['visibleToasts'][number];\n\n/**\n * The queue a snackbar is shown from. Make one where the app can reach it —\n * a module of its own is the usual place — mount `Snackbar` once with it,\n * and call `add` from anywhere.\n *\n * ```ts\n * const messages = new Snackbar.Queue()\n * messages.add('Label', { action: { label: 'Undo', onPress: undo } })\n * ```\n *\n * It wraps React Aria's toast queue rather than exposing it, which is what\n * keeps that API's `UNSTABLE_` name out of a consumer's code.\n */\nclass SnackbarQueue {\n  /**\n   * React Aria's queue, which `Snackbar` subscribes to. Not part of the\n   * package's API — read it and an upstream release may break the call site.\n   */\n  readonly rac: RACToastQueue<SnackbarMessage>;\n  constructor() {\n    // One at a time, which is what the page shows: a second message replaces\n    // the first rather than stacking under it.\n    this.rac = new RACToastQueue<SnackbarMessage>({\n      maxVisibleToasts: 1\n    });\n  }\n\n  /**\n   * Shows a message, and returns the key that closes it.\n   */\n  add(message: ReactNode, options: SnackbarOptions = {}) {\n    const {\n      action,\n      onClose,\n      showCloseButton = false,\n      timeout\n    } = options;\n    return this.rac.add({\n      action,\n      message,\n      showCloseButton\n    }, {\n      onClose,\n      timeout: timeout ?? (action === undefined ? MESSAGE_MS : UNTIL_CLOSED)\n    });\n  }\n\n  /** Closes every snackbar, shown or waiting. */\n  clear() {\n    this.rac.clear();\n  }\n\n  /** Closes one snackbar, by the key `add` returned. */\n  close(key: string) {\n    this.rac.close(key);\n  }\n}\n\n// The three handlers the snackbar hands to something below it, each built by\n// a call 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 on\n// its inputs.\nfunction actionPress(action: SnackbarAction, close: () => void) {\n  return () => {\n    action.onPress();\n    close();\n  };\n}\nfunction closeToast(queue: SnackbarQueue, key: string) {\n  return () => {\n    queue.close(key);\n  };\n}\n\n// A control's classes, from its own render state — see `controlFocused`.\nfunction controlClassName(style: stylex.StyleXStyles) {\n  return (state: {\n    isFocusVisible: boolean;\n    isHovered: boolean;\n    isPressed: boolean;\n  }) => stylex.props(styles.control, style, state.isHovered && styles.controlHovered, state.isFocusVisible && styles.controlFocused, state.isPressed && styles.controlPressed).className ?? '';\n}\n\n/**\n * A brief message at the bottom of the screen, with an optional action. Mount\n * one of these with a `Snackbar.Queue`, and call the queue's `add` to show a\n * message from anywhere.\n *\n * ```tsx\n * const messages = new Snackbar.Queue()\n *\n * <Snackbar queue={messages} />\n * ```\n *\n * The region is portalled to the end of `<body>` and renders nothing while\n * the queue is empty. It is one region rather than one per message, so mount\n * it once, near the root.\n *\n * The call site's `className` and `style` land on that region, which is the\n * element a layout positions.\n */\nfunction Snackbar({\n  closeLabel,\n  queue,\n  ...props\n}: RefAttributes<HTMLDivElement> & SnackbarProps) {\n  return <RACToastRegion<SnackbarMessage> queue={queue.rac} {...props} {...mergeStatefulStyles({\n    className: \"x6s0dn4 x9f619 x78zum5 xdt5ytf x126z3so x1ey2m1c x17y0mx6 x1t137rt x1u7mh7p xi7mcox xbpsoft xq5vm52 x47corl xixxii4 x1bk8fjm\"\n  }, props)}>\n      {snackbarContent(queue, closeLabel)}\n    </RACToastRegion>;\n}\n\n/**\n * One of the snackbar's two controls. React Aria's `Button` rather than the\n * library's, for the colour reason in the comment at the top of this file;\n * the ripple and the state layers are the same ones every other control\n * here draws, over `currentColor`.\n */\nfunction SnackbarButton({\n  children,\n  style,\n  ...props\n}: {\n  'aria-label'?: string;\n  children: ReactNode;\n  onPress?: () => void;\n  slot?: string;\n  style: stylex.StyleXStyles;\n}) {\n  const ripple = useRipple<FocusableElement>();\n  return <RACButton {...ripple.handlers} {...props} className={controlClassName(style)}>\n      {children}\n      {ripple.surface}\n    </RACButton>;\n}\nfunction snackbarContent(queue: SnackbarQueue, closeLabel: string | undefined) {\n  return ({\n    toast\n  }: {\n    toast: SnackbarToastItem;\n  }) => <SnackbarToast close={closeToast(queue, toast.key)} closeLabel={closeLabel} toast={toast} />;\n}\n\n/** The action, the close button, or nothing, after the message. */\nfunction SnackbarControls({\n  action,\n  close,\n  closeLabel,\n  showCloseButton\n}: {\n  action: SnackbarAction | undefined;\n  close: () => void;\n  closeLabel: string | undefined;\n  showCloseButton: boolean;\n}) {\n  return <>\n      {action === undefined ? null : <SnackbarButton onPress={actionPress(action, close)} style={styles.action}>\n          {action.label}\n        </SnackbarButton>}\n      {showCloseButton ? <SnackbarButton aria-label={closeLabel} slot=\"close\" style={styles.close}>\n          <CloseGlyph className=\"xxk0z11 xvy4d1p\" />\n        </SnackbarButton> : null}\n    </>;\n}\n\n/** One snackbar: its message, then whatever sits after it. */\nfunction SnackbarToast({\n  close,\n  closeLabel,\n  toast\n}: {\n  close: () => void;\n  closeLabel: string | undefined;\n  toast: SnackbarToastItem;\n}) {\n  const {\n    action,\n    message,\n    showCloseButton\n  } = toast.content;\n  return <RACToast toast={toast} className=\"x6s0dn4 x1n1nwrg x1u6grsq x1dwmuk9 x16dv9tl x1c5gpgi x1w1tqly x1tfhd1 xx61lck x13rsnn2 x1udv5rz x9f619 x78zum5 xh8yej3 x1x1rfll xlx31pv x1dry9sr xeuugli xuq8xha x1ulcdur x1hl8ikr x9v5kkp x1t137rt x1de99jn xt970qd xn60lsn x67bb7w\">\n      <RACToastContent className=\"x9f619 x1girmi0 x1iyjqo2 xpo2rfv x193rfdd x1hews6w xn43zvd xv61bfh xz158ff xeuugli xxlmvz2\">\n        <Text slot=\"title\">{message}</Text>\n      </RACToastContent>\n      <SnackbarControls action={action} close={close} closeLabel={closeLabel} showCloseButton={showCloseButton} />\n    </RACToast>;\n}\nSnackbar.Queue = SnackbarQueue;\n\n// The queue is reached as `Snackbar.Queue` rather than exported beside the\n// component: this file would otherwise export something that is not a\n// component, which is what turns fast refresh off for it.\nexport type { SnackbarAction, SnackbarMessage, SnackbarOptions, SnackbarProps, SnackbarQueue, ToastRegionRenderProps as SnackbarRegionRenderProps };\nexport default Snackbar;"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["c","_c","ReactNode","RefAttributes","FocusableElement","ToastRegionProps","RACToastRegionProps","ToastRegionRenderProps","stylex","Button","RACButton","UNSTABLE_Toast","RACToast","UNSTABLE_ToastContent","RACToastContent","UNSTABLE_ToastQueue","RACToastQueue","UNSTABLE_ToastRegion","RACToastRegion","Text","CloseGlyph","useBottomEdgeClearance","useRipple","layers","mergeStatefulStyles","colors","motion","radii","shadows","sizing","spacing","stateLayerOpacity","typography","MESSAGE_MS","UNTIL_CLOSED","WIDE","rise","FORCED_COLORS","_temp","krVfgx","kGO01o","styles","action","kMwMTN","kMv6JI","kGuDYH","k63SB2","kb6lSQ","kLWn49","k8WAf4","kg3NbH","$$css","close","kZKoxP","kzqmXN","kmVPX3","control","kGNEyG","kWkggS","kaIpWk","kMzoRj","kB7OPa","kkrTdU","k1xSpc","kmuXW","kjj79g","kjBf7l","kInvED","k3XXqK","kMeerF","kVQacm","kVAEAm","controlFocused","controlHovered","controlPressed","region","kXwgrk","kOIVth","kkqhue","kLKAdn","kE3dHu","kpe85a","kfzvcC","kY2c9j","risen","clearance","val","undefined","SnackbarAction","label","onPress","SnackbarMessage","message","showCloseButton","SnackbarOptions","onClose","timeout","SnackbarProps","className","closeLabel","queue","SnackbarQueue","style","Omit","SnackbarToastItem","rac","constructor","maxVisibleToasts","add","options","clear","key","actionPress","closeToast","controlClassName","StyleXStyles","state","isFocusVisible","isHovered","isPressed","props","Snackbar","t0","$","T0","t1","t2","t3","snackbarContent","t4","SnackbarButton","children","ripple","handlers","surface","toast","SnackbarControls","SnackbarToast","content","Queue","SnackbarRegionRenderProps","RACToastQueue","stylex.props","_c","props","RACToastRegion","RACButton","RACToastContent","RACToast"],"sources":["../../../src/components/snackbar/index.tsx"],"sourcesContent":["'use client';\n\nimport type { ReactNode, RefAttributes } from 'react';\nimport type { FocusableElement, ToastRegionProps as RACToastRegionProps, ToastRegionRenderProps } from 'react-aria-components';\nimport * as stylex from '@stylexjs/stylex';\nimport { Button as RACButton, UNSTABLE_Toast as RACToast, UNSTABLE_ToastContent as RACToastContent, UNSTABLE_ToastQueue as RACToastQueue, UNSTABLE_ToastRegion as RACToastRegion, Text } from 'react-aria-components';\nimport { CloseGlyph } from '../../glyphs';\nimport { useBottomEdgeClearance } from '../../hooks/useBottomEdge';\nimport { useRipple } from '../../hooks/useRipple';\nimport '../../styles/layers.stylex';\nimport { layers } from '../../styles/layers.stylex';\nimport { mergeStatefulStyles } from '../../styles/merge';\nimport '../../tokens/design.tokens.stylex';\nimport { colors, motion, radii, shadows, sizing, spacing, stateLayerOpacity, typography } from '../../tokens/design.tokens.stylex';\n\n// The snackbar page's brief message at the bottom of the screen, with an\n// optional action beside it and an optional close button after that. The\n// page's container is the inverse surface at a 4dp corner and elevation 3,\n// its supporting text is body-medium in inverse on surface, its action label\n// is inverse primary, and its close icon takes the supporting text's colour.\n// The measurements are the page's too: 8dp of margin from the edges of the\n// screen, 8dp of padding inside the container with another 8dp either side\n// of the message, 14dp above and below on a single line, and between 320 and\n// 576dp wide above the page's 600dp breakpoint — full width below it.\n//\n// One at a time. The page shows a single snackbar and replaces it rather\n// than stacking, which is `maxVisibleToasts: 1` on the queue.\n//\n// React Aria's toast is the behaviour: the region is a landmark that holds\n// the message, moves focus into it for a keyboard, and pauses every timer\n// while it is hovered or focused, so a message never expires while it is\n// being read or acted on.\n//\n// Three things are decided here rather than taken from React Aria or from\n// the page.\n//\n// **The queue is ours, not React Aria's.** React Aria's toast is still\n// `UNSTABLE_`, and `SnackbarQueue` is what keeps that name out of a\n// consumer's code — an upstream rename is this file rather than every call\n// site. It wraps their queue, defaults it to one visible message, and takes\n// the message and its options as one call.\n//\n// **The action and the close button are drawn here rather than through\n// Button and IconButton.** The page colours them inverse primary and inverse\n// on surface, which no variant of either carries, and a colour pushed in\n// from outside through `className` is the merge hazard AGENTS.md describes:\n// StyleX decides between two atomic classes by their order in the compiled\n// stylesheet, not by the order they are applied. Both are React Aria's\n// `Button` with the same ripple and the same state layers, over\n// `currentColor` so each takes the colour the snackbar gives it.\n//\n// **There is no `container` prop.** Every other overlay here takes one,\n// because React Aria's `Modal` and `Popover` accept a portal container, and\n// `src/components/portal-container.test.tsx` is what keeps that true.\n// Its toast region does not: it reads a portal provider that\n// `react-aria-components` does not export, so the region always lands at the\n// end of `<body>`. An app that scopes its StyleX theme to a subtree has to\n// put the theme on `:root` for the snackbar to be drawn in it.\n\n// How long a message is shown when the call site names no `timeout`. The\n// specs page gives no duration, so these come from the snackbar's guidelines\n// and accessibility pages.\n//\n// A message alone leaves after five seconds. The pages allow four to ten, and\n// React Aria's toast docs set five as the least a reader should be given.\n//\n// A message with an action stays until the action is taken or something\n// closes it, as the pages ask of every actionable snackbar. No timer can know\n// how long a reader needs to act: a screen reader user hears the message\n// first and has to reach the region before the action is any use, and the\n// pause while the region is hovered or focused only starts once they have.\n// Android's snackbar can keep shorter defaults because the platform lengthens\n// them from each user's accessibility settings, and the web has no such\n// setting to read.\nconst MESSAGE_MS = 5000;\nconst UNTIL_CLOSED = 0;\n\n// Below the page's 600dp breakpoint the snackbar runs the width of the\n// screen; above it, it takes between 320 and 576.\nconst WIDE = '@media (min-width: 600px)';\n\n// The page's own is a fade. It rises a little as it arrives too, which is\n// what the page draws and what says the message came from the edge of the\n// screen rather than appearing over it.\nconst rise = \"x15b941j-B\";\n\n// Windows High Contrast and the rest of the forced-colours modes. Spelled\n// here rather than imported, for the reason src/field/styles.ts records: the\n// StyleX compiler resolves a constant across files only out of a `.stylex.ts`\n// module, and the generated one holds design tokens rather than queries.\nconst FORCED_COLORS = '@media (forced-colors: active)';\nconst _temp = {\n  krVfgx: \"xiicpxy\",\n  kGO01o: \"xqf7pud\",\n  \"$$css\": true\n};\nconst styles = {\n  action: {\n    kMwMTN: \"x16bex6i\",\n    kMv6JI: \"xkknnkr\",\n    kGuDYH: \"x14zspaw\",\n    k63SB2: \"x1v9cpvo\",\n    kb6lSQ: \"x155f00i\",\n    kLWn49: \"x1lz68p4\",\n    k8WAf4: \"x1cmllll\",\n    kg3NbH: \"x18fpw6u\",\n    $$css: true\n  },\n  close: {\n    kZKoxP: \"xbg5kjn\",\n    kMwMTN: \"x1girmi0\",\n    kzqmXN: \"xoqf9c6\",\n    kmVPX3: \"x1717udv\",\n    $$css: true\n  },\n  control: {\n    kGNEyG: \"x6s0dn4\",\n    kWkggS: \"xjbqb8w\",\n    kaIpWk: \"x1dkaolv\",\n    kMzoRj: \"xc342km\",\n    kB7OPa: \"x9f619\",\n    kkrTdU: \"x1ypdohk\",\n    k1xSpc: \"x3nfvp2\",\n    kmuXW: \"x2lah0s\",\n    kjj79g: \"xl56j7k\",\n    kjBf7l: \"x14ytart\",\n    kInvED: \"x1hl8ikr\",\n    k3XXqK: \"x9v5kkp x1t137rt\",\n    kMeerF: \"x1de99jn\",\n    kVQacm: \"xb3r6kr\",\n    kVAEAm: \"x1n2onr6\",\n    $$css: true\n  },\n  controlFocused: {\n    kWkggS: \"x1mbb5iu\",\n    $$css: true\n  },\n  controlHovered: {\n    kWkggS: \"x930l3l\",\n    $$css: true\n  },\n  controlPressed: {\n    kWkggS: \"xsykwg8\",\n    $$css: true\n  },\n  region: {\n    kGNEyG: \"x6s0dn4\",\n    kB7OPa: \"x9f619\",\n    k1xSpc: \"x78zum5\",\n    kXwgrk: \"xdt5ytf\",\n    kOIVth: \"x126z3so\",\n    krVfgx: \"x1ey2m1c\",\n    kkqhue: \"x17y0mx6\",\n    k3XXqK: \"x1t137rt\",\n    kGO01o: \"x1u7mh7p\",\n    kLKAdn: \"xi7mcox\",\n    kE3dHu: \"xbpsoft\",\n    kpe85a: \"xq5vm52\",\n    kfzvcC: \"x47corl\",\n    kVAEAm: \"xixxii4\",\n    kY2c9j: \"x1bk8fjm\",\n    $$css: true\n  },\n  risen: (clearance: string) => [_temp, {\n    \"--x-insetBlockEnd\": (val => typeof val === \"number\" ? val + \"px\" : val != null ? val : undefined)(clearance)\n  }]\n};\ntype SnackbarAction = {\n  /** What the action says. The page gives it a single word where it can. */\n  label: string;\n  /** Run when the action is pressed, just before the snackbar closes. */\n  onPress: () => void;\n};\n\n/** What a snackbar carries: its message, and what may sit beside it. */\ntype SnackbarMessage = {\n  action: SnackbarAction | undefined;\n  message: ReactNode;\n  showCloseButton: boolean;\n};\ntype SnackbarOptions = {\n  /**\n   * A single action shown after the message. Pressing it runs `onPress` and\n   * closes the snackbar, which is what the page draws.\n   */\n  action?: SnackbarAction;\n  /** Run when the snackbar closes, however it was closed. */\n  onClose?: () => void;\n  /**\n   * Whether a close button is shown at the end. The page draws one for a\n   * message a reader may want out of the way before it expires.\n   *\n   * Named for what it draws rather than `isDismissable`, which on `Sheet`,\n   * `Dialog` and React Aria's modals is whether a press outside them closes\n   * them — a snackbar has no outside to press.\n   * @default false\n   */\n  showCloseButton?: boolean;\n  /**\n   * How long the snackbar is shown, in milliseconds. Defaults to five seconds\n   * for a message alone. A message with an action defaults to `0` and stays\n   * until the action is taken or something closes it, as Material Design asks\n   * of an actionable snackbar, since a reader may need longer to reach the\n   * action than any timer allows. The timer is paused while the region is\n   * hovered or focused, so a message never expires while it is being read.\n   *\n   * `0` is the page's indefinite length: the snackbar stays until something\n   * closes it. Give one of those an action or `showCloseButton`, or there is no\n   * way to be rid of it.\n   */\n  timeout?: number;\n};\ntype SnackbarProps = {\n  /**\n   * What a screen reader calls the region holding the snackbar. Left out,\n   * React Aria names the region itself: a count of the messages it holds, in\n   * the reader's own locale — \"1 notification.\" in English, and one of some\n   * thirty languages otherwise. Pass a name only to replace that, and pass a\n   * translated one, since whatever is passed is read as written.\n   */\n  'aria-label'?: string;\n  /** A function may compute the class from the region's render state. */\n  className?: RACToastRegionProps<SnackbarMessage>['className'];\n  /**\n   * What a screen reader calls the button that dismisses a snackbar. It sits\n   * here rather than on a message's own options because it does not vary by\n   * message, so putting it there would make every `add` call repeat it. Left\n   * out, React Aria names it in the reader's locale — \"Close\" in English.\n   */\n  closeLabel?: string;\n  /** The queue the region shows messages from. */\n  queue: SnackbarQueue;\n  /** A function may compute the style from the region's render state. */\n  style?: RACToastRegionProps<SnackbarMessage>['style'];\n} & Omit<RACToastRegionProps<SnackbarMessage>, 'children' | 'className' | 'queue' | 'style'>;\n\n// One entry of the queue, as React Aria hands it to the region's render\n// function. Taken from its render state rather than imported from\n// `react-stately`, which this package does not depend on.\ntype SnackbarToastItem = ToastRegionRenderProps<SnackbarMessage>['visibleToasts'][number];\n\n/**\n * The queue a snackbar is shown from. Make one where the app can reach it —\n * a module of its own is the usual place — mount `Snackbar` once with it,\n * and call `add` from anywhere.\n *\n * ```ts\n * const messages = new Snackbar.Queue()\n * messages.add('Label', { action: { label: 'Undo', onPress: undo } })\n * ```\n *\n * It wraps React Aria's toast queue rather than exposing it, which is what\n * keeps that API's `UNSTABLE_` name out of a consumer's code.\n */\nclass SnackbarQueue {\n  /**\n   * React Aria's queue, which `Snackbar` subscribes to. Not part of the\n   * package's API — read it and an upstream release may break the call site.\n   */\n  readonly rac: RACToastQueue<SnackbarMessage>;\n  constructor() {\n    // One at a time, which is what the page shows: a second message replaces\n    // the first rather than stacking under it.\n    this.rac = new RACToastQueue<SnackbarMessage>({\n      maxVisibleToasts: 1\n    });\n  }\n\n  /**\n   * Shows a message, and returns the key that closes it.\n   */\n  add(message: ReactNode, options: SnackbarOptions = {}) {\n    const {\n      action,\n      onClose,\n      showCloseButton = false,\n      timeout\n    } = options;\n    return this.rac.add({\n      action,\n      message,\n      showCloseButton\n    }, {\n      onClose,\n      timeout: timeout ?? (action === undefined ? MESSAGE_MS : UNTIL_CLOSED)\n    });\n  }\n\n  /** Closes every snackbar, shown or waiting. */\n  clear() {\n    this.rac.clear();\n  }\n\n  /** Closes one snackbar, by the key `add` returned. */\n  close(key: string) {\n    this.rac.close(key);\n  }\n}\n\n// The three handlers the snackbar hands to something below it, each built by\n// a call 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 on\n// its inputs.\nfunction actionPress(action: SnackbarAction, close: () => void) {\n  return () => {\n    action.onPress();\n    close();\n  };\n}\nfunction closeToast(queue: SnackbarQueue, key: string) {\n  return () => {\n    queue.close(key);\n  };\n}\n\n// A control's classes, from its own render state — see `controlFocused`.\nfunction controlClassName(style: stylex.StyleXStyles) {\n  return (state: {\n    isFocusVisible: boolean;\n    isHovered: boolean;\n    isPressed: boolean;\n  }) => stylex.props(styles.control, style, state.isHovered && styles.controlHovered, state.isFocusVisible && styles.controlFocused, state.isPressed && styles.controlPressed).className ?? '';\n}\n\n/**\n * A brief message at the bottom of the screen, with an optional action. Mount\n * one of these with a `Snackbar.Queue`, and call the queue's `add` to show a\n * message from anywhere.\n *\n * ```tsx\n * const messages = new Snackbar.Queue()\n *\n * <Snackbar queue={messages} />\n * ```\n *\n * The region is portalled to the end of `<body>` and renders nothing while\n * the queue is empty. It is one region rather than one per message, so mount\n * it once, near the root.\n *\n * The call site's `className` and `style` land on that region, which is the\n * element a layout positions.\n *\n * While a full-screen `Dialog` or a `Sheet` with a footer is open, the region\n * rises to sit above those actions rather than over them, since they share\n * the bottom edge of the window and the snackbar is drawn above both.\n */\nfunction Snackbar({\n  closeLabel,\n  queue,\n  ...props\n}: RefAttributes<HTMLDivElement> & SnackbarProps) {\n  const clearance = useBottomEdgeClearance();\n  return <RACToastRegion<SnackbarMessage> queue={queue.rac} {...props} {...mergeStatefulStyles(stylex.props(styles.region, clearance > 0 && styles.risen(`${clearance}px`)), props)}>\n      {snackbarContent(queue, closeLabel)}\n    </RACToastRegion>;\n}\n\n/**\n * One of the snackbar's two controls. React Aria's `Button` rather than the\n * library's, for the colour reason in the comment at the top of this file;\n * the ripple and the state layers are the same ones every other control\n * here draws, over `currentColor`.\n */\nfunction SnackbarButton({\n  children,\n  style,\n  ...props\n}: {\n  'aria-label'?: string;\n  children: ReactNode;\n  onPress?: () => void;\n  slot?: string;\n  style: stylex.StyleXStyles;\n}) {\n  const ripple = useRipple<FocusableElement>();\n  return <RACButton {...ripple.handlers} {...props} className={controlClassName(style)}>\n      {children}\n      {ripple.surface}\n    </RACButton>;\n}\nfunction snackbarContent(queue: SnackbarQueue, closeLabel: string | undefined) {\n  return ({\n    toast\n  }: {\n    toast: SnackbarToastItem;\n  }) => <SnackbarToast close={closeToast(queue, toast.key)} closeLabel={closeLabel} toast={toast} />;\n}\n\n/** The action, the close button, or nothing, after the message. */\nfunction SnackbarControls({\n  action,\n  close,\n  closeLabel,\n  showCloseButton\n}: {\n  action: SnackbarAction | undefined;\n  close: () => void;\n  closeLabel: string | undefined;\n  showCloseButton: boolean;\n}) {\n  return <>\n      {action === undefined ? null : <SnackbarButton onPress={actionPress(action, close)} style={styles.action}>\n          {action.label}\n        </SnackbarButton>}\n      {showCloseButton ? <SnackbarButton aria-label={closeLabel} slot=\"close\" style={styles.close}>\n          <CloseGlyph className=\"xxk0z11 xvy4d1p\" />\n        </SnackbarButton> : null}\n    </>;\n}\n\n/** One snackbar: its message, then whatever sits after it. */\nfunction SnackbarToast({\n  close,\n  closeLabel,\n  toast\n}: {\n  close: () => void;\n  closeLabel: string | undefined;\n  toast: SnackbarToastItem;\n}) {\n  const {\n    action,\n    message,\n    showCloseButton\n  } = toast.content;\n  return <RACToast toast={toast} className=\"x6s0dn4 x1n1nwrg x1u6grsq x1dwmuk9 x16dv9tl x1c5gpgi x1w1tqly x1tfhd1 xx61lck x13rsnn2 x1udv5rz x9f619 x78zum5 xh8yej3 x1x1rfll xlx31pv x1dry9sr xeuugli xuq8xha x1ulcdur x1hl8ikr x9v5kkp x1t137rt x1de99jn xt970qd xn60lsn x67bb7w\">\n      <RACToastContent className=\"x9f619 x1girmi0 x1iyjqo2 xpo2rfv x193rfdd x1hews6w xn43zvd xv61bfh xz158ff xeuugli xxlmvz2\">\n        <Text slot=\"title\">{message}</Text>\n      </RACToastContent>\n      <SnackbarControls action={action} close={close} closeLabel={closeLabel} showCloseButton={showCloseButton} />\n    </RACToast>;\n}\nSnackbar.Queue = SnackbarQueue;\n\n// The queue is reached as `Snackbar.Queue` rather than exported beside the\n// component: this file would otherwise export something that is not a\n// component, which is what turns fast refresh off for it.\nexport type { SnackbarAction, SnackbarMessage, SnackbarOptions, SnackbarProps, SnackbarQueue, ToastRegionRenderProps as SnackbarRegionRenderProps };\nexport default Snackbar;"],"mappings":"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"}

package/dist/components/tree/index.js

@@ -263,11 +263,11 @@ function TreeLoadMore(t0) {
 	let t1;
 	let t2;
 	if ($[0] !== t0) {
-		const { label: t3, ...props$2 } = t0;
+		const { label: t3, ...props$1 } = t0;
 		label = t3;
 		T0 = TreeLoadMoreItem;
-		t1 = props$2;
-		t2 = mergeStatefulStyles(props(collectionStyles.loading), props$2);
+		t1 = props$1;
+		t2 = mergeStatefulStyles(props(collectionStyles.loading), props$1);
 		$[0] = t0;
 		$[1] = T0;
 		$[2] = label;
@@ -314,12 +314,12 @@ function TreeSection$1(t0) {
 	let t1;
 	let t2;
 	if ($[0] !== t0) {
-		const { children: t3, header: t4, ...props$1 } = t0;
+		const { children: t3, header: t4, ...props$2 } = t0;
 		children = t3;
 		header = t4;
 		T0 = TreeSection;
-		t1 = props$1;
-		t2 = mergeStyles(props(collectionStyles.section), props$1);
+		t1 = props$2;
+		t2 = mergeStyles(props(collectionStyles.section), props$2);
 		$[0] = t0;
 		$[1] = T0;
 		$[2] = children;