@spark-ui/components 17.15.0 → 17.15.2-beta.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (67) hide show
  1. package/dist/accordion/index.js +1 -1
  2. package/dist/accordion/index.js.map +1 -1
  3. package/dist/accordion/index.mjs +1 -1
  4. package/dist/accordion/index.mjs.map +1 -1
  5. package/dist/avatar/index.js +1 -1
  6. package/dist/avatar/index.mjs +1 -1
  7. package/dist/button/index.js +1 -1
  8. package/dist/button/index.mjs +1 -1
  9. package/dist/{button-jlscsCw0.js → button-BNLF5thC.js} +2 -2
  10. package/dist/{button-jlscsCw0.js.map → button-BNLF5thC.js.map} +1 -1
  11. package/dist/{button-CzHtbgj7.mjs → button-CQswIokg.mjs} +2 -2
  12. package/dist/{button-CzHtbgj7.mjs.map → button-CQswIokg.mjs.map} +1 -1
  13. package/dist/carousel/index.js +1 -1
  14. package/dist/carousel/index.mjs +1 -1
  15. package/dist/combobox/index.js +1 -1
  16. package/dist/combobox/index.mjs +2 -2
  17. package/dist/dialog/index.js +1 -1
  18. package/dist/dialog/index.mjs +1 -1
  19. package/dist/drawer/index.js +1 -1
  20. package/dist/drawer/index.mjs +1 -1
  21. package/dist/dropdown/index.js +1 -1
  22. package/dist/dropdown/index.mjs +1 -1
  23. package/dist/file-upload/index.js +1 -1
  24. package/dist/file-upload/index.mjs +2 -2
  25. package/dist/icon-button/index.js +1 -1
  26. package/dist/icon-button/index.mjs +1 -1
  27. package/dist/icon-button-BhRYDk-N.js +2 -0
  28. package/dist/{icon-button-Iv9kq84M.js.map → icon-button-BhRYDk-N.js.map} +1 -1
  29. package/dist/{icon-button-BLG7VjR7.mjs → icon-button-Mq9ENaLm.mjs} +3 -3
  30. package/dist/{icon-button-BLG7VjR7.mjs.map → icon-button-Mq9ENaLm.mjs.map} +1 -1
  31. package/dist/input/index.js +1 -1
  32. package/dist/input/index.mjs +1 -1
  33. package/dist/{input-cKdm2R3n.mjs → input-CXQMncfN.mjs} +5 -5
  34. package/dist/input-CXQMncfN.mjs.map +1 -0
  35. package/dist/input-Dj8YT6P3.js +2 -0
  36. package/dist/input-Dj8YT6P3.js.map +1 -0
  37. package/dist/pagination/index.js +1 -1
  38. package/dist/pagination/index.mjs +2 -2
  39. package/dist/popover/index.js +1 -1
  40. package/dist/popover/index.mjs +1 -1
  41. package/dist/{popover-qoueDrzR.js → popover-BIbJW9tD.js} +2 -2
  42. package/dist/{popover-qoueDrzR.js.map → popover-BIbJW9tD.js.map} +1 -1
  43. package/dist/{popover-Ds6xXjgT.mjs → popover-D3xDdjH2.mjs} +2 -2
  44. package/dist/{popover-Ds6xXjgT.mjs.map → popover-D3xDdjH2.mjs.map} +1 -1
  45. package/dist/scrolling-list/index.js +1 -1
  46. package/dist/scrolling-list/index.mjs +2 -2
  47. package/dist/stepper/index.js +1 -1
  48. package/dist/stepper/index.mjs +2 -2
  49. package/dist/table/index.js +1 -1
  50. package/dist/table/index.mjs +1 -1
  51. package/dist/tabs/index.js +1 -1
  52. package/dist/tabs/index.mjs +3 -3
  53. package/dist/tag/index.js +1 -1
  54. package/dist/tag/index.js.map +1 -1
  55. package/dist/tag/index.mjs +1 -1
  56. package/dist/tag/index.mjs.map +1 -1
  57. package/dist/textarea/index.js +1 -1
  58. package/dist/textarea/index.js.map +1 -1
  59. package/dist/textarea/index.mjs +2 -2
  60. package/dist/textarea/index.mjs.map +1 -1
  61. package/dist/toast/index.js +1 -1
  62. package/dist/toast/index.mjs +2 -2
  63. package/package.json +5 -5
  64. package/dist/icon-button-Iv9kq84M.js +0 -2
  65. package/dist/input-BSCMbnO4.js +0 -2
  66. package/dist/input-BSCMbnO4.js.map +0 -1
  67. package/dist/input-cKdm2R3n.mjs.map +0 -1
package/dist/{button-CzHtbgj7.mjs.map → button-CQswIokg.mjs.map} RENAMED
@@ -1 +1 @@
1
- {"version":3,"file":"button-CzHtbgj7.mjs","names":[],"sources":["../src/button/variants/filled.ts","../src/button/variants/ghost.ts","../src/button/variants/outlined.ts","../src/button/variants/tinted.ts","../src/button/variants/contrast.ts","../src/button/Button.styles.tsx","../src/button/Button.tsx"],"sourcesContent":["import { tw } from '@spark-ui/internal-utils'\n\nexport const filledVariants = [\n // Main\n {\n intent: 'main',\n design: 'filled',\n class: tw([\n 'bg-main',\n 'text-on-main',\n 'hover:bg-main-hovered',\n 'enabled:active:bg-main-hovered',\n 'focus-visible:bg-main-hovered',\n ]),\n },\n // Support\n {\n intent: 'support',\n design: 'filled',\n class: tw([\n 'bg-support',\n 'text-on-support',\n 'hover:bg-support-hovered',\n 'enabled:active:bg-support-hovered',\n 'focus-visible:bg-support-hovered',\n ]),\n },\n // Accent\n {\n intent: 'accent',\n design: 'filled',\n class: tw([\n 'bg-accent',\n 'text-on-accent',\n 'hover:bg-accent-hovered',\n 'enabled:active:bg-accent-hovered',\n 'focus-visible:bg-accent-hovered',\n ]),\n },\n // AI\n {\n intent: 'ai',\n design: 'filled',\n class: tw([\n 'bg-ai',\n 'text-on-ai',\n 'hover:bg-ai-hovered',\n 'enabled:active:bg-ai-hovered',\n 'focus-visible:bg-ai-hovered',\n ]),\n },\n // Success\n {\n intent: 'success',\n design: 'filled',\n class: tw([\n 'bg-success',\n 'text-on-success',\n 'hover:bg-success-hovered',\n 'enabled:active:bg-success-hovered',\n 'focus-visible:bg-success-hovered',\n ]),\n },\n // Alert\n {\n intent: 'alert',\n design: 'filled',\n class: tw([\n 'bg-alert',\n 'text-on-alert',\n 'hover:bg-alert-hovered',\n 'enabled:active:bg-alert-hovered',\n 'focus-visible:bg-alert-hovered',\n ]),\n },\n // Danger\n {\n intent: 'danger',\n design: 'filled',\n class: tw([\n 'text-on-error bg-error',\n 'hover:bg-error-hovered enabled:active:bg-error-hovered',\n 'focus-visible:bg-error-hovered',\n ]),\n },\n // Info\n {\n intent: 'info',\n design: 'filled',\n class: tw([\n 'text-on-error bg-info',\n 'hover:bg-info-hovered enabled:active:bg-info-hovered',\n 'focus-visible:bg-info-hovered',\n ]),\n },\n // Neutral\n {\n intent: 'neutral',\n design: 'filled',\n class: tw([\n 'bg-neutral',\n 'text-on-neutral',\n 'hover:bg-neutral-hovered',\n 'enabled:active:bg-neutral-hovered',\n 'focus-visible:bg-neutral-hovered',\n ]),\n },\n // Surface\n {\n intent: 'surface',\n design: 'filled',\n class: tw([\n 'bg-surface',\n 'text-on-surface',\n 'hover:bg-surface-hovered',\n 'enabled:active:bg-surface-hovered',\n 'focus-visible:bg-surface-hovered',\n ]),\n },\n {\n intent: 'surfaceInverse',\n design: 'filled',\n class: tw([\n 'bg-surface-inverse',\n 'text-on-surface-inverse',\n 'hover:bg-surface-inverse-hovered',\n 'enabled:active:bg-surface-inverse-hovered',\n 'focus-visible:bg-surface-inverse-hovered',\n ]),\n },\n] as const\n","import { tw } from '@spark-ui/internal-utils'\n\nexport const ghostVariants = [\n {\n intent: 'main',\n design: 'ghost',\n class: tw([\n 'text-on-main-container',\n 'hover:bg-main/dim-5',\n 'enabled:active:bg-main/dim-5',\n 'focus-visible:bg-main/dim-5',\n ]),\n },\n {\n intent: 'support',\n design: 'ghost',\n class: tw([\n 'text-on-support-container',\n 'hover:bg-support/dim-5',\n 'enabled:active:bg-support/dim-5',\n 'focus-visible:bg-support/dim-5',\n ]),\n },\n {\n intent: 'accent',\n design: 'ghost',\n class: tw([\n 'text-on-accent-container',\n 'hover:bg-accent/dim-5',\n 'enabled:active:bg-accent/dim-5',\n 'focus-visible:bg-accent/dim-5',\n ]),\n },\n {\n intent: 'ai',\n design: 'ghost',\n class: tw([\n 'text-on-ai-container',\n 'hover:bg-ai/dim-5',\n 'enabled:active:bg-ai/dim-5',\n 'focus-visible:bg-ai/dim-5',\n ]),\n },\n {\n intent: 'success',\n design: 'ghost',\n class: tw([\n 'text-on-success-container',\n 'hover:bg-success/dim-5',\n 'enabled:active:bg-success/dim-5',\n 'focus-visible:bg-success/dim-5',\n ]),\n },\n {\n intent: 'alert',\n design: 'ghost',\n class: tw([\n 'text-on-alert-container',\n 'hover:bg-alert/dim-5',\n 'enabled:active:bg-alert/dim-5',\n 'focus-visible:bg-alert/dim-5',\n ]),\n },\n {\n intent: 'danger',\n design: 'ghost',\n class: tw([\n 'text-on-error-container',\n 'hover:bg-error/dim-5',\n 'enabled:active:bg-error/dim-5',\n 'focus-visible:bg-error/dim-5',\n ]),\n },\n {\n intent: 'info',\n design: 'ghost',\n class: tw([\n 'text-on-info-container',\n 'hover:bg-info/dim-5',\n 'enabled:active:bg-info/dim-5',\n 'focus-visible:bg-info/dim-5',\n ]),\n },\n {\n intent: 'neutral',\n design: 'ghost',\n class: tw([\n 'text-on-neutral-container',\n 'hover:bg-neutral/dim-5',\n 'enabled:active:bg-neutral/dim-5',\n 'focus-visible:bg-neutral/dim-5',\n ]),\n },\n {\n intent: 'surface',\n design: 'ghost',\n class: tw([\n 'text-surface',\n 'hover:bg-surface/dim-5',\n 'enabled:active:bg-surface/dim-5',\n 'focus-visible:bg-surface/dim-5',\n ]),\n },\n {\n intent: 'surfaceInverse',\n design: 'ghost',\n class: tw([\n 'text-surface-inverse',\n 'hover:bg-surface-inverse/dim-5',\n 'enabled:active:bg-surface-inverse/dim-5',\n 'focus-visible:bg-surface-inverse/dim-5',\n ]),\n },\n] as const\n","import { tw } from '@spark-ui/internal-utils'\n\nexport const outlinedVariants = [\n {\n intent: 'main',\n design: 'outlined',\n class: tw([\n 'hover:bg-main/dim-5',\n 'enabled:active:bg-main/dim-5',\n 'focus-visible:bg-main/dim-5',\n 'text-main',\n ]),\n },\n {\n intent: 'support',\n design: 'outlined',\n class: tw([\n 'hover:bg-support/dim-5',\n 'enabled:active:bg-support/dim-5',\n 'focus-visible:bg-support/dim-5',\n 'text-support',\n ]),\n },\n {\n intent: 'accent',\n design: 'outlined',\n class: tw([\n 'hover:bg-accent/dim-5',\n 'enabled:active:bg-accent/dim-5',\n 'focus-visible:bg-accent/dim-5',\n 'text-accent',\n ]),\n },\n {\n intent: 'ai',\n design: 'outlined',\n class: tw([\n 'hover:bg-ai/dim-5',\n 'enabled:active:bg-ai/dim-5',\n 'focus-visible:bg-ai/dim-5',\n 'text-ai',\n ]),\n },\n {\n intent: 'success',\n design: 'outlined',\n class: tw([\n 'hover:bg-success/dim-5',\n 'enabled:active:bg-success/dim-5',\n 'focus-visible:bg-success/dim-5',\n 'text-success',\n ]),\n },\n {\n intent: 'alert',\n design: 'outlined',\n class: tw([\n 'hover:bg-alert/dim-5',\n 'enabled:active:bg-alert/dim-5',\n 'focus-visible:bg-alert/dim-5',\n 'text-alert',\n ]),\n },\n {\n intent: 'danger',\n design: 'outlined',\n class: tw([\n 'hover:bg-error/dim-5',\n 'enabled:active:bg-error/dim-5',\n 'focus-visible:bg-error/dim-5',\n 'text-error',\n ]),\n },\n {\n intent: 'info',\n design: 'outlined',\n class: tw([\n 'hover:bg-info/dim-5',\n 'enabled:active:bg-info/dim-5',\n 'focus-visible:bg-info/dim-5',\n 'text-info',\n ]),\n },\n {\n intent: 'neutral',\n design: 'outlined',\n class: tw([\n 'hover:bg-neutral/dim-5',\n 'enabled:active:bg-neutral/dim-5',\n 'focus-visible:bg-neutral/dim-5',\n 'text-neutral',\n ]),\n },\n {\n intent: 'surface',\n design: 'outlined',\n class: tw([\n 'hover:bg-surface/dim-5',\n 'enabled:active:bg-surface/dim-5',\n 'focus-visible:bg-surface/dim-5',\n 'text-surface',\n ]),\n },\n {\n intent: 'surfaceInverse',\n design: 'outlined',\n class: tw([\n 'hover:bg-surface-inverse/dim-5',\n 'enabled:active:bg-surface-inverse/dim-5',\n 'focus-visible:bg-surface-inverse/dim-5',\n 'text-surface-inverse',\n ]),\n },\n] as const\n","import { tw } from '@spark-ui/internal-utils'\n\nexport const tintedVariants = [\n {\n intent: 'main',\n design: 'tinted',\n class: tw([\n 'bg-main-container',\n 'text-on-main-container',\n 'hover:bg-main-container-hovered',\n 'enabled:active:bg-main-container-hovered',\n 'focus-visible:bg-main-container-hovered',\n ]),\n },\n {\n intent: 'support',\n design: 'tinted',\n class: tw([\n 'bg-support-container',\n 'text-on-support-container',\n 'hover:bg-support-container-hovered',\n 'enabled:active:bg-support-container-hovered',\n 'focus-visible:bg-support-container-hovered',\n ]),\n },\n {\n intent: 'accent',\n design: 'tinted',\n class: tw([\n 'bg-accent-container',\n 'text-on-accent-container',\n 'hover:bg-accent-container-hovered',\n 'enabled:active:bg-accent-container-hovered',\n 'focus-visible:bg-accent-container-hovered',\n ]),\n },\n {\n intent: 'ai',\n design: 'tinted',\n class: tw([\n 'bg-ai-container',\n 'text-on-ai-container',\n 'hover:bg-ai-container-hovered',\n 'enabled:active:bg-ai-container-hovered',\n 'focus-visible:bg-ai-container-hovered',\n ]),\n },\n {\n intent: 'success',\n design: 'tinted',\n class: tw([\n 'bg-success-container',\n 'text-on-success-container',\n 'hover:bg-success-container-hovered',\n 'enabled:active:bg-success-container-hovered',\n 'focus-visible:bg-success-container-hovered',\n ]),\n },\n {\n intent: 'alert',\n design: 'tinted',\n class: tw([\n 'bg-alert-container',\n 'text-on-alert-container',\n 'hover:bg-alert-container-hovered',\n 'enabled:active:bg-alert-container-hovered',\n 'focus-visible:bg-alert-container-hovered',\n ]),\n },\n {\n intent: 'danger',\n design: 'tinted',\n class: tw([\n 'bg-error-container',\n 'text-on-error-container',\n 'hover:bg-error-container-hovered',\n 'enabled:active:bg-error-container-hovered',\n 'focus-visible:bg-error-container-hovered',\n ]),\n },\n {\n intent: 'info',\n design: 'tinted',\n class: tw([\n 'bg-info-container',\n 'text-on-info-container',\n 'hover:bg-info-container-hovered',\n 'enabled:active:bg-info-container-hovered',\n 'focus-visible:bg-info-container-hovered',\n ]),\n },\n {\n intent: 'neutral',\n design: 'tinted',\n class: tw([\n 'bg-neutral-container',\n 'text-on-neutral-container',\n 'hover:bg-neutral-container-hovered',\n 'enabled:active:bg-neutral-container-hovered',\n 'focus-visible:bg-neutral-container-hovered',\n ]),\n },\n {\n intent: 'surface',\n design: 'tinted',\n class: tw([\n 'bg-surface',\n 'text-on-surface',\n 'hover:bg-surface-hovered',\n 'enabled:active:bg-surface-hovered',\n 'focus-visible:bg-surface-hovered',\n ]),\n },\n {\n intent: 'surfaceInverse',\n design: 'tinted',\n class: tw([\n 'bg-surface-inverse',\n 'text-on-surface-inverse',\n 'hover:bg-surface-inverse-hovered',\n 'enabled:active:bg-surface-inverse-hovered',\n 'focus-visible:bg-surface-inverse-hovered',\n ]),\n },\n] as const\n","import { tw } from '@spark-ui/internal-utils'\n\nexport const contrastVariants = [\n {\n intent: 'main',\n design: 'contrast',\n class: tw([\n 'text-on-main-contaier bg-surface',\n 'hover:bg-main-container-hovered',\n 'enabled:active:bg-main-container-hovered',\n 'focus-visible:bg-main-container-hovered',\n ]),\n },\n {\n intent: 'support',\n design: 'contrast',\n class: tw([\n 'text-on-support-container bg-surface',\n 'hover:bg-support-container-hovered',\n 'enabled:active:bg-support-container-hovered',\n 'focus-visible:bg-support-container-hovered',\n ]),\n },\n {\n intent: 'accent',\n design: 'contrast',\n class: tw([\n 'text-on-accent-container bg-surface',\n 'hover:bg-accent-container-hovered',\n 'enabled:active:bg-accent-container-hovered',\n 'focus-visible:bg-accent-container-hovered',\n ]),\n },\n {\n intent: 'ai',\n design: 'contrast',\n class: tw([\n 'text-on-ai-container bg-surface',\n 'hover:bg-ai-container-hovered',\n 'enabled:active:bg-ai-container-hovered',\n 'focus-visible:bg-ai-container-hovered',\n ]),\n },\n {\n intent: 'success',\n design: 'contrast',\n class: tw([\n 'text-on-success-container bg-surface',\n 'hover:bg-success-container-hovered',\n 'enabled:active:bg-success-container-hovered',\n 'focus-visible:bg-success-container-hovered',\n ]),\n },\n {\n intent: 'alert',\n design: 'contrast',\n class: tw([\n 'text-on-alert-container bg-surface',\n 'hover:bg-alert-container-hovered',\n 'enabled:active:bg-alert-container-hovered',\n 'focus-visible:bg-alert-container-hovered',\n ]),\n },\n {\n intent: 'danger',\n design: 'contrast',\n class: tw([\n 'text-on-error-container bg-surface',\n 'hover:bg-error-container-hovered',\n 'enabled:active:bg-error-container-hovered',\n 'focus-visible:bg-error-container-hovered',\n ]),\n },\n {\n intent: 'info',\n design: 'contrast',\n class: tw([\n 'text-on-info-container bg-surface',\n 'hover:bg-info-container-hovered',\n 'enabled:active:bg-info-container-hovered',\n 'focus-visible:bg-info-container-hovered',\n ]),\n },\n {\n intent: 'neutral',\n design: 'contrast',\n class: tw([\n 'text-on-neutral-container bg-surface',\n 'hover:bg-neutral-container-hovered',\n 'enabled:active:bg-neutral-container-hovered',\n 'focus-visible:bg-neutral-container-hovered',\n ]),\n },\n {\n intent: 'surface',\n design: 'contrast',\n class: tw([\n 'text-on-surface bg-surface',\n 'hover:bg-surface-hovered',\n 'enabled:active:bg-surface-hovered',\n 'focus-visible:bg-surface-hovered',\n ]),\n },\n {\n intent: 'surfaceInverse',\n design: 'contrast',\n class: tw([\n 'text-on-surface-inverse bg-surface-inverse',\n 'hover:bg-surface-inverse-hovered',\n 'enabled:active:bg-surface-inverse-hovered',\n 'focus-visible:bg-surface-inverse-hovered',\n ]),\n },\n] as const\n","import { makeVariants } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nimport {\n contrastVariants,\n filledVariants,\n ghostVariants,\n outlinedVariants,\n tintedVariants,\n} from './variants'\n\nexport const buttonStyles = cva(\n [\n 'u-shadow-border-transition',\n 'box-border inline-flex items-center justify-center gap-md whitespace-nowrap',\n 'default:px-lg',\n 'text-body-1-highlight',\n 'focus-visible:u-outline',\n ],\n {\n variants: {\n /**\n * Main style of the button.\n *\n * - `filled`: Button will be plain.\n *\n * - `outlined`: Button will be transparent with an outline.\n *\n * - `tinted`: Button will be filled but using a lighter color scheme.\n *\n * - `ghost`: Button will look like a link. No borders, plain text.\n *\n * - `contrast`: Button will be surface filled. No borders, plain text.\n *\n */\n design: makeVariants<'design', ['filled', 'outlined', 'tinted', 'ghost', 'contrast']>({\n filled: [],\n outlined: ['bg-transparent', 'border-sm', 'border-current'],\n tinted: [],\n ghost: ['default:-mx-md px-md hover:bg-main/dim-5'],\n contrast: [],\n }),\n underline: {\n true: ['underline'],\n },\n /**\n * Color scheme of the button.\n */\n intent: makeVariants<\n 'intent',\n [\n 'main',\n 'support',\n 'accent',\n 'ai',\n 'success',\n 'alert',\n 'danger',\n 'info',\n 'neutral',\n 'surface',\n 'surfaceInverse',\n ]\n >({\n main: [],\n support: [],\n accent: [],\n ai: [],\n success: [],\n alert: [],\n danger: [],\n info: [],\n neutral: [],\n surface: [],\n surfaceInverse: [],\n }),\n /**\n * Size of the button.\n */\n size: makeVariants<'size', ['sm', 'md', 'lg']>({\n sm: ['min-w-sz-32', 'h-sz-32'],\n md: ['min-w-sz-44', 'h-sz-44'],\n lg: ['min-w-sz-56', 'h-sz-56'],\n }),\n /**\n * Shape of the button.\n */\n shape: makeVariants<'shape', ['rounded', 'square', 'pill']>({\n rounded: ['rounded-button'],\n square: ['rounded-0'],\n pill: ['rounded-full'],\n }),\n /**\n * Disable the button, preventing user interaction and adding opacity.\n */\n disabled: {\n true: ['cursor-not-allowed', 'opacity-dim-3'],\n false: ['cursor-pointer'],\n },\n },\n compoundVariants: [\n ...filledVariants,\n ...outlinedVariants,\n ...tintedVariants,\n ...ghostVariants,\n ...contrastVariants,\n ],\n defaultVariants: {\n design: 'filled',\n intent: 'main',\n size: 'md',\n shape: 'rounded',\n },\n }\n)\n\nexport type ButtonStylesProps = VariantProps<typeof buttonStyles>\n","import { cx } from 'class-variance-authority'\nimport { ComponentPropsWithoutRef, type DOMAttributes, Ref, useMemo } from 'react'\n\nimport { Slot, wrapPolymorphicSlot } from '../slot'\nimport { Spinner, type SpinnerProps } from '../spinner'\nimport { buttonStyles, type ButtonStylesProps } from './Button.styles'\n\nexport interface ButtonProps\n extends Omit<ComponentPropsWithoutRef<'button'>, 'disabled'>, ButtonStylesProps {\n /**\n * Change the component to the HTML tag or custom component of the only child.\n */\n asChild?: boolean\n /**\n * Display a spinner to indicate to the user that the button is loading something after they interacted with it.\n */\n isLoading?: boolean\n /**\n * If your loading state should only display a spinner, it is better to specify a label for it (a11y).\n */\n loadingLabel?: string\n /**\n * If your loading state should also display a label, you can use this prop instead of `loadingLabel`.\n * **Please note that using this can result in layout shifting when the Button goes from loading state to normal state.**\n */\n loadingText?: string\n /**\n * When true, the button is non-interactive and has disabled styling but stays focusable (uses\n * `aria-disabled` instead of native `disabled`). Use for cases where the user should be able to\n * focus the control to discover why it is disabled (e.g. form submit, bulk bar actions).\n */\n ariaDisabled?: boolean\n ref?: Ref<HTMLButtonElement>\n}\n\ntype DOMAttributesEventHandler = keyof Omit<\n DOMAttributes<HTMLButtonElement>,\n 'children' | 'dangerouslySetInnerHTML'\n>\n\nconst blockedEventHandlers: DOMAttributesEventHandler[] = [\n 'onClick',\n 'onMouseDown',\n 'onMouseUp',\n 'onMouseEnter',\n 'onMouseLeave',\n 'onMouseOver',\n 'onMouseOut',\n 'onKeyDown',\n 'onKeyPress',\n 'onKeyUp',\n 'onSubmit',\n]\n\n/**\n * A clickable element that triggers an action or event when activated by the user.\n */\nexport const Button = ({\n children,\n design = 'filled',\n disabled = false,\n ariaDisabled = false,\n intent = 'main',\n isLoading = false,\n loadingLabel,\n loadingText,\n shape = 'rounded',\n size = 'md',\n asChild,\n className,\n underline = false,\n ref,\n ...others\n}: ButtonProps) => {\n const Component = asChild ? Slot : 'button'\n\n const shouldNotInteract = !!disabled || !!ariaDisabled || isLoading\n const useNativeDisabled = !!disabled && !ariaDisabled\n\n const disabledEventHandlers = useMemo(() => {\n const result: Partial<Record<DOMAttributesEventHandler, (e: React.SyntheticEvent) => void>> = {}\n\n if (shouldNotInteract) {\n blockedEventHandlers.forEach(key => {\n result[key] = (e: React.SyntheticEvent) => {\n // Allow Tab to move focus away from the button\n if (e.type === 'keydown' && (e as React.KeyboardEvent).key === 'Tab') return\n /*\n Setting handlers to `undefined` (e.g. `result[eventHandler] = undefined`) only blocks JS-level handlers, it does not prevent native browser behavior.\n Calling preventDefault() here also blocks native form submission when type=\"submit\", since the browser triggers it from the click chain.\n */\n e.preventDefault()\n }\n })\n }\n\n return result\n }, [shouldNotInteract])\n\n const spinnerProps = {\n size: 'current' as SpinnerProps['size'],\n className: loadingText ? 'inline-block' : 'absolute',\n ...(loadingLabel && { 'aria-label': loadingLabel }),\n }\n\n return (\n <Component\n data-spark-component=\"button\"\n {...(Component === 'button' && { type: 'button' })}\n ref={ref}\n className={buttonStyles({\n className,\n design,\n disabled: shouldNotInteract,\n intent,\n shape,\n size,\n underline,\n })}\n disabled={useNativeDisabled}\n aria-disabled={shouldNotInteract ? true : undefined}\n aria-busy={isLoading}\n aria-live={isLoading ? 'assertive' : 'off'}\n {...others}\n {...disabledEventHandlers}\n >\n {wrapPolymorphicSlot(asChild, children, slotted =>\n isLoading ? (\n <>\n <Spinner {...spinnerProps} />\n {loadingText}\n\n <div\n aria-hidden\n className={cx('gap-md', loadingText ? 'hidden' : 'inline-flex opacity-0')}\n >\n {slotted}\n </div>\n </>\n ) : (\n slotted\n )\n )}\n </Component>\n )\n}\n\nButton.displayName = 'Button'\n"],"mappings":";;;;;;;AAEA,IAAa,IAAiB;CAE5B;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CAED;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CAED;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CAED;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CAED;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CAED;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CAED;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACD,CAAC;EACH;CAED;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACD,CAAC;EACH;CAED;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CAED;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACF,EChIY,IAAgB;CAC3B;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACF,EC/GY,IAAmB;CAC9B;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACF,EC/GY,IAAiB;CAC5B;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACF,EC1HY,IAAmB;CAC9B;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACF,ECtGY,IAAe,EAC1B;CACE;CACA;CACA;CACA;CACA;CACD,EACD;CACE,UAAU;EAeR,QAAQ,EAA8E;GACpF,QAAQ,EAAE;GACV,UAAU;IAAC;IAAkB;IAAa;IAAiB;GAC3D,QAAQ,EAAE;GACV,OAAO,CAAC,2CAA2C;GACnD,UAAU,EAAE;GACb,CAAC;EACF,WAAW,EACT,MAAM,CAAC,YAAY,EACpB;EAID,QAAQ,EAeN;GACA,MAAM,EAAE;GACR,SAAS,EAAE;GACX,QAAQ,EAAE;GACV,IAAI,EAAE;GACN,SAAS,EAAE;GACX,OAAO,EAAE;GACT,QAAQ,EAAE;GACV,MAAM,EAAE;GACR,SAAS,EAAE;GACX,SAAS,EAAE;GACX,gBAAgB,EAAE;GACnB,CAAC;EAIF,MAAM,EAAyC;GAC7C,IAAI,CAAC,eAAe,UAAU;GAC9B,IAAI,CAAC,eAAe,UAAU;GAC9B,IAAI,CAAC,eAAe,UAAU;GAC/B,CAAC;EAIF,OAAO,EAAqD;GAC1D,SAAS,CAAC,iBAAiB;GAC3B,QAAQ,CAAC,YAAY;GACrB,MAAM,CAAC,eAAe;GACvB,CAAC;EAIF,UAAU;GACR,MAAM,CAAC,sBAAsB,gBAAgB;GAC7C,OAAO,CAAC,iBAAiB;GAC1B;EACF;CACD,kBAAkB;EAChB,GAAG;EACH,GAAG;EACH,GAAG;EACH,GAAG;EACH,GAAG;EACJ;CACD,iBAAiB;EACf,QAAQ;EACR,QAAQ;EACR,MAAM;EACN,OAAO;EACR;CACF,CACF,EC1EK,IAAoD;CACxD;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACD,EAKY,KAAU,EACrB,aACA,YAAS,UACT,cAAW,IACX,kBAAe,IACf,YAAS,QACT,eAAY,IACZ,iBACA,gBACA,WAAQ,WACR,UAAO,MACP,YACA,cACA,eAAY,IACZ,QACA,GAAG,QACc;CACjB,IAAM,IAAY,IAAU,IAAO,UAE7B,IAAoB,CAAC,CAAC,KAAY,CAAC,CAAC,KAAgB,GACpD,IAAoB,CAAC,CAAC,KAAY,CAAC,GAEnC,IAAwB,QAAc;EAC1C,IAAM,IAAwF,EAAE;AAgBhG,SAdI,KACF,EAAqB,SAAQ,MAAO;AAClC,KAAO,MAAQ,MAA4B;AAErC,MAAE,SAAS,aAAc,EAA0B,QAAQ,SAK/D,EAAE,gBAAgB;;IAEpB,EAGG;IACN,CAAC,EAAkB,CAAC,EAEjB,IAAe;EACnB,MAAM;EACN,WAAW,IAAc,iBAAiB;EAC1C,GAAI,KAAgB,EAAE,cAAc,GAAc;EACnD;AAED,QACE,kBAAC,GAAD;EACE,wBAAqB;EACrB,GAAK,MAAc,YAAY,EAAE,MAAM,UAAU;EAC5C;EACL,WAAW,EAAa;GACtB;GACA;GACA,UAAU;GACV;GACA;GACA;GACA;GACD,CAAC;EACF,UAAU;EACV,iBAAe,IAAoB,KAAO,KAAA;EAC1C,aAAW;EACX,aAAW,IAAY,cAAc;EACrC,GAAI;EACJ,GAAI;YAEH,EAAoB,GAAS,IAAU,MACtC,IACE,kBAAA,GAAA,EAAA,UAAA;GACE,kBAAC,GAAD,EAAS,GAAI,GAAgB,CAAA;GAC5B;GAED,kBAAC,OAAD;IACE,eAAA;IACA,WAAW,EAAG,UAAU,IAAc,WAAW,wBAAwB;cAExE;IACG,CAAA;GACL,EAAA,CAAA,GAEH,EAEH;EACS,CAAA;;AAIhB,EAAO,cAAc"}
1
+ {"version":3,"file":"button-CQswIokg.mjs","names":[],"sources":["../src/button/variants/filled.ts","../src/button/variants/ghost.ts","../src/button/variants/outlined.ts","../src/button/variants/tinted.ts","../src/button/variants/contrast.ts","../src/button/Button.styles.tsx","../src/button/Button.tsx"],"sourcesContent":["import { tw } from '@spark-ui/internal-utils'\n\nexport const filledVariants = [\n // Main\n {\n intent: 'main',\n design: 'filled',\n class: tw([\n 'bg-main',\n 'text-on-main',\n 'hover:bg-main-hovered',\n 'enabled:active:bg-main-hovered',\n 'focus-visible:bg-main-hovered',\n ]),\n },\n // Support\n {\n intent: 'support',\n design: 'filled',\n class: tw([\n 'bg-support',\n 'text-on-support',\n 'hover:bg-support-hovered',\n 'enabled:active:bg-support-hovered',\n 'focus-visible:bg-support-hovered',\n ]),\n },\n // Accent\n {\n intent: 'accent',\n design: 'filled',\n class: tw([\n 'bg-accent',\n 'text-on-accent',\n 'hover:bg-accent-hovered',\n 'enabled:active:bg-accent-hovered',\n 'focus-visible:bg-accent-hovered',\n ]),\n },\n // AI\n {\n intent: 'ai',\n design: 'filled',\n class: tw([\n 'bg-ai',\n 'text-on-ai',\n 'hover:bg-ai-hovered',\n 'enabled:active:bg-ai-hovered',\n 'focus-visible:bg-ai-hovered',\n ]),\n },\n // Success\n {\n intent: 'success',\n design: 'filled',\n class: tw([\n 'bg-success',\n 'text-on-success',\n 'hover:bg-success-hovered',\n 'enabled:active:bg-success-hovered',\n 'focus-visible:bg-success-hovered',\n ]),\n },\n // Alert\n {\n intent: 'alert',\n design: 'filled',\n class: tw([\n 'bg-alert',\n 'text-on-alert',\n 'hover:bg-alert-hovered',\n 'enabled:active:bg-alert-hovered',\n 'focus-visible:bg-alert-hovered',\n ]),\n },\n // Danger\n {\n intent: 'danger',\n design: 'filled',\n class: tw([\n 'text-on-error bg-error',\n 'hover:bg-error-hovered enabled:active:bg-error-hovered',\n 'focus-visible:bg-error-hovered',\n ]),\n },\n // Info\n {\n intent: 'info',\n design: 'filled',\n class: tw([\n 'text-on-error bg-info',\n 'hover:bg-info-hovered enabled:active:bg-info-hovered',\n 'focus-visible:bg-info-hovered',\n ]),\n },\n // Neutral\n {\n intent: 'neutral',\n design: 'filled',\n class: tw([\n 'bg-neutral',\n 'text-on-neutral',\n 'hover:bg-neutral-hovered',\n 'enabled:active:bg-neutral-hovered',\n 'focus-visible:bg-neutral-hovered',\n ]),\n },\n // Surface\n {\n intent: 'surface',\n design: 'filled',\n class: tw([\n 'bg-surface',\n 'text-on-surface',\n 'hover:bg-surface-hovered',\n 'enabled:active:bg-surface-hovered',\n 'focus-visible:bg-surface-hovered',\n ]),\n },\n {\n intent: 'surfaceInverse',\n design: 'filled',\n class: tw([\n 'bg-surface-inverse',\n 'text-on-surface-inverse',\n 'hover:bg-surface-inverse-hovered',\n 'enabled:active:bg-surface-inverse-hovered',\n 'focus-visible:bg-surface-inverse-hovered',\n ]),\n },\n] as const\n","import { tw } from '@spark-ui/internal-utils'\n\nexport const ghostVariants = [\n {\n intent: 'main',\n design: 'ghost',\n class: tw([\n 'text-on-main-container',\n 'hover:bg-main/dim-5',\n 'enabled:active:bg-main/dim-5',\n 'focus-visible:bg-main/dim-5',\n ]),\n },\n {\n intent: 'support',\n design: 'ghost',\n class: tw([\n 'text-on-support-container',\n 'hover:bg-support/dim-5',\n 'enabled:active:bg-support/dim-5',\n 'focus-visible:bg-support/dim-5',\n ]),\n },\n {\n intent: 'accent',\n design: 'ghost',\n class: tw([\n 'text-on-accent-container',\n 'hover:bg-accent/dim-5',\n 'enabled:active:bg-accent/dim-5',\n 'focus-visible:bg-accent/dim-5',\n ]),\n },\n {\n intent: 'ai',\n design: 'ghost',\n class: tw([\n 'text-on-ai-container',\n 'hover:bg-ai/dim-5',\n 'enabled:active:bg-ai/dim-5',\n 'focus-visible:bg-ai/dim-5',\n ]),\n },\n {\n intent: 'success',\n design: 'ghost',\n class: tw([\n 'text-on-success-container',\n 'hover:bg-success/dim-5',\n 'enabled:active:bg-success/dim-5',\n 'focus-visible:bg-success/dim-5',\n ]),\n },\n {\n intent: 'alert',\n design: 'ghost',\n class: tw([\n 'text-on-alert-container',\n 'hover:bg-alert/dim-5',\n 'enabled:active:bg-alert/dim-5',\n 'focus-visible:bg-alert/dim-5',\n ]),\n },\n {\n intent: 'danger',\n design: 'ghost',\n class: tw([\n 'text-on-error-container',\n 'hover:bg-error/dim-5',\n 'enabled:active:bg-error/dim-5',\n 'focus-visible:bg-error/dim-5',\n ]),\n },\n {\n intent: 'info',\n design: 'ghost',\n class: tw([\n 'text-on-info-container',\n 'hover:bg-info/dim-5',\n 'enabled:active:bg-info/dim-5',\n 'focus-visible:bg-info/dim-5',\n ]),\n },\n {\n intent: 'neutral',\n design: 'ghost',\n class: tw([\n 'text-on-neutral-container',\n 'hover:bg-neutral/dim-5',\n 'enabled:active:bg-neutral/dim-5',\n 'focus-visible:bg-neutral/dim-5',\n ]),\n },\n {\n intent: 'surface',\n design: 'ghost',\n class: tw([\n 'text-surface',\n 'hover:bg-surface/dim-5',\n 'enabled:active:bg-surface/dim-5',\n 'focus-visible:bg-surface/dim-5',\n ]),\n },\n {\n intent: 'surfaceInverse',\n design: 'ghost',\n class: tw([\n 'text-surface-inverse',\n 'hover:bg-surface-inverse/dim-5',\n 'enabled:active:bg-surface-inverse/dim-5',\n 'focus-visible:bg-surface-inverse/dim-5',\n ]),\n },\n] as const\n","import { tw } from '@spark-ui/internal-utils'\n\nexport const outlinedVariants = [\n {\n intent: 'main',\n design: 'outlined',\n class: tw([\n 'hover:bg-main/dim-5',\n 'enabled:active:bg-main/dim-5',\n 'focus-visible:bg-main/dim-5',\n 'text-main',\n ]),\n },\n {\n intent: 'support',\n design: 'outlined',\n class: tw([\n 'hover:bg-support/dim-5',\n 'enabled:active:bg-support/dim-5',\n 'focus-visible:bg-support/dim-5',\n 'text-support',\n ]),\n },\n {\n intent: 'accent',\n design: 'outlined',\n class: tw([\n 'hover:bg-accent/dim-5',\n 'enabled:active:bg-accent/dim-5',\n 'focus-visible:bg-accent/dim-5',\n 'text-accent',\n ]),\n },\n {\n intent: 'ai',\n design: 'outlined',\n class: tw([\n 'hover:bg-ai/dim-5',\n 'enabled:active:bg-ai/dim-5',\n 'focus-visible:bg-ai/dim-5',\n 'text-ai',\n ]),\n },\n {\n intent: 'success',\n design: 'outlined',\n class: tw([\n 'hover:bg-success/dim-5',\n 'enabled:active:bg-success/dim-5',\n 'focus-visible:bg-success/dim-5',\n 'text-success',\n ]),\n },\n {\n intent: 'alert',\n design: 'outlined',\n class: tw([\n 'hover:bg-alert/dim-5',\n 'enabled:active:bg-alert/dim-5',\n 'focus-visible:bg-alert/dim-5',\n 'text-alert',\n ]),\n },\n {\n intent: 'danger',\n design: 'outlined',\n class: tw([\n 'hover:bg-error/dim-5',\n 'enabled:active:bg-error/dim-5',\n 'focus-visible:bg-error/dim-5',\n 'text-error',\n ]),\n },\n {\n intent: 'info',\n design: 'outlined',\n class: tw([\n 'hover:bg-info/dim-5',\n 'enabled:active:bg-info/dim-5',\n 'focus-visible:bg-info/dim-5',\n 'text-info',\n ]),\n },\n {\n intent: 'neutral',\n design: 'outlined',\n class: tw([\n 'hover:bg-neutral/dim-5',\n 'enabled:active:bg-neutral/dim-5',\n 'focus-visible:bg-neutral/dim-5',\n 'text-neutral',\n ]),\n },\n {\n intent: 'surface',\n design: 'outlined',\n class: tw([\n 'hover:bg-surface/dim-5',\n 'enabled:active:bg-surface/dim-5',\n 'focus-visible:bg-surface/dim-5',\n 'text-surface',\n ]),\n },\n {\n intent: 'surfaceInverse',\n design: 'outlined',\n class: tw([\n 'hover:bg-surface-inverse/dim-5',\n 'enabled:active:bg-surface-inverse/dim-5',\n 'focus-visible:bg-surface-inverse/dim-5',\n 'text-surface-inverse',\n ]),\n },\n] as const\n","import { tw } from '@spark-ui/internal-utils'\n\nexport const tintedVariants = [\n {\n intent: 'main',\n design: 'tinted',\n class: tw([\n 'bg-main-container',\n 'text-on-main-container',\n 'hover:bg-main-container-hovered',\n 'enabled:active:bg-main-container-hovered',\n 'focus-visible:bg-main-container-hovered',\n ]),\n },\n {\n intent: 'support',\n design: 'tinted',\n class: tw([\n 'bg-support-container',\n 'text-on-support-container',\n 'hover:bg-support-container-hovered',\n 'enabled:active:bg-support-container-hovered',\n 'focus-visible:bg-support-container-hovered',\n ]),\n },\n {\n intent: 'accent',\n design: 'tinted',\n class: tw([\n 'bg-accent-container',\n 'text-on-accent-container',\n 'hover:bg-accent-container-hovered',\n 'enabled:active:bg-accent-container-hovered',\n 'focus-visible:bg-accent-container-hovered',\n ]),\n },\n {\n intent: 'ai',\n design: 'tinted',\n class: tw([\n 'bg-ai-container',\n 'text-on-ai-container',\n 'hover:bg-ai-container-hovered',\n 'enabled:active:bg-ai-container-hovered',\n 'focus-visible:bg-ai-container-hovered',\n ]),\n },\n {\n intent: 'success',\n design: 'tinted',\n class: tw([\n 'bg-success-container',\n 'text-on-success-container',\n 'hover:bg-success-container-hovered',\n 'enabled:active:bg-success-container-hovered',\n 'focus-visible:bg-success-container-hovered',\n ]),\n },\n {\n intent: 'alert',\n design: 'tinted',\n class: tw([\n 'bg-alert-container',\n 'text-on-alert-container',\n 'hover:bg-alert-container-hovered',\n 'enabled:active:bg-alert-container-hovered',\n 'focus-visible:bg-alert-container-hovered',\n ]),\n },\n {\n intent: 'danger',\n design: 'tinted',\n class: tw([\n 'bg-error-container',\n 'text-on-error-container',\n 'hover:bg-error-container-hovered',\n 'enabled:active:bg-error-container-hovered',\n 'focus-visible:bg-error-container-hovered',\n ]),\n },\n {\n intent: 'info',\n design: 'tinted',\n class: tw([\n 'bg-info-container',\n 'text-on-info-container',\n 'hover:bg-info-container-hovered',\n 'enabled:active:bg-info-container-hovered',\n 'focus-visible:bg-info-container-hovered',\n ]),\n },\n {\n intent: 'neutral',\n design: 'tinted',\n class: tw([\n 'bg-neutral-container',\n 'text-on-neutral-container',\n 'hover:bg-neutral-container-hovered',\n 'enabled:active:bg-neutral-container-hovered',\n 'focus-visible:bg-neutral-container-hovered',\n ]),\n },\n {\n intent: 'surface',\n design: 'tinted',\n class: tw([\n 'bg-surface',\n 'text-on-surface',\n 'hover:bg-surface-hovered',\n 'enabled:active:bg-surface-hovered',\n 'focus-visible:bg-surface-hovered',\n ]),\n },\n {\n intent: 'surfaceInverse',\n design: 'tinted',\n class: tw([\n 'bg-surface-inverse',\n 'text-on-surface-inverse',\n 'hover:bg-surface-inverse-hovered',\n 'enabled:active:bg-surface-inverse-hovered',\n 'focus-visible:bg-surface-inverse-hovered',\n ]),\n },\n] as const\n","import { tw } from '@spark-ui/internal-utils'\n\nexport const contrastVariants = [\n {\n intent: 'main',\n design: 'contrast',\n class: tw([\n 'text-on-main-contaier bg-surface',\n 'hover:bg-main-container-hovered',\n 'enabled:active:bg-main-container-hovered',\n 'focus-visible:bg-main-container-hovered',\n ]),\n },\n {\n intent: 'support',\n design: 'contrast',\n class: tw([\n 'text-on-support-container bg-surface',\n 'hover:bg-support-container-hovered',\n 'enabled:active:bg-support-container-hovered',\n 'focus-visible:bg-support-container-hovered',\n ]),\n },\n {\n intent: 'accent',\n design: 'contrast',\n class: tw([\n 'text-on-accent-container bg-surface',\n 'hover:bg-accent-container-hovered',\n 'enabled:active:bg-accent-container-hovered',\n 'focus-visible:bg-accent-container-hovered',\n ]),\n },\n {\n intent: 'ai',\n design: 'contrast',\n class: tw([\n 'text-on-ai-container bg-surface',\n 'hover:bg-ai-container-hovered',\n 'enabled:active:bg-ai-container-hovered',\n 'focus-visible:bg-ai-container-hovered',\n ]),\n },\n {\n intent: 'success',\n design: 'contrast',\n class: tw([\n 'text-on-success-container bg-surface',\n 'hover:bg-success-container-hovered',\n 'enabled:active:bg-success-container-hovered',\n 'focus-visible:bg-success-container-hovered',\n ]),\n },\n {\n intent: 'alert',\n design: 'contrast',\n class: tw([\n 'text-on-alert-container bg-surface',\n 'hover:bg-alert-container-hovered',\n 'enabled:active:bg-alert-container-hovered',\n 'focus-visible:bg-alert-container-hovered',\n ]),\n },\n {\n intent: 'danger',\n design: 'contrast',\n class: tw([\n 'text-on-error-container bg-surface',\n 'hover:bg-error-container-hovered',\n 'enabled:active:bg-error-container-hovered',\n 'focus-visible:bg-error-container-hovered',\n ]),\n },\n {\n intent: 'info',\n design: 'contrast',\n class: tw([\n 'text-on-info-container bg-surface',\n 'hover:bg-info-container-hovered',\n 'enabled:active:bg-info-container-hovered',\n 'focus-visible:bg-info-container-hovered',\n ]),\n },\n {\n intent: 'neutral',\n design: 'contrast',\n class: tw([\n 'text-on-neutral-container bg-surface',\n 'hover:bg-neutral-container-hovered',\n 'enabled:active:bg-neutral-container-hovered',\n 'focus-visible:bg-neutral-container-hovered',\n ]),\n },\n {\n intent: 'surface',\n design: 'contrast',\n class: tw([\n 'text-on-surface bg-surface',\n 'hover:bg-surface-hovered',\n 'enabled:active:bg-surface-hovered',\n 'focus-visible:bg-surface-hovered',\n ]),\n },\n {\n intent: 'surfaceInverse',\n design: 'contrast',\n class: tw([\n 'text-on-surface-inverse bg-surface-inverse',\n 'hover:bg-surface-inverse-hovered',\n 'enabled:active:bg-surface-inverse-hovered',\n 'focus-visible:bg-surface-inverse-hovered',\n ]),\n },\n] as const\n","import { makeVariants } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nimport {\n contrastVariants,\n filledVariants,\n ghostVariants,\n outlinedVariants,\n tintedVariants,\n} from './variants'\n\nexport const buttonStyles = cva(\n [\n 'u-shadow-border-transition',\n 'box-border inline-flex items-center justify-center gap-md whitespace-nowrap',\n 'default:px-lg',\n 'text-body-1-highlight',\n 'focus-visible:u-outline',\n ],\n {\n variants: {\n /**\n * Main style of the button.\n *\n * - `filled`: Button will be plain.\n *\n * - `outlined`: Button will be transparent with an outline.\n *\n * - `tinted`: Button will be filled but using a lighter color scheme.\n *\n * - `ghost`: Button will look like a link. No borders, plain text.\n *\n * - `contrast`: Button will be surface filled. No borders, plain text.\n *\n */\n design: makeVariants<'design', ['filled', 'outlined', 'tinted', 'ghost', 'contrast']>({\n filled: [],\n outlined: ['bg-transparent', 'border-sm', 'border-current'],\n tinted: [],\n ghost: ['default:-mx-md px-md hover:bg-main/dim-5'],\n contrast: [],\n }),\n underline: {\n true: ['underline'],\n },\n /**\n * Color scheme of the button.\n */\n intent: makeVariants<\n 'intent',\n [\n 'main',\n 'support',\n 'accent',\n 'ai',\n 'success',\n 'alert',\n 'danger',\n 'info',\n 'neutral',\n 'surface',\n 'surfaceInverse',\n ]\n >({\n main: [],\n support: [],\n accent: [],\n ai: [],\n success: [],\n alert: [],\n danger: [],\n info: [],\n neutral: [],\n surface: [],\n surfaceInverse: [],\n }),\n /**\n * Size of the button.\n */\n size: makeVariants<'size', ['sm', 'md', 'lg']>({\n sm: ['min-w-sz-32', 'h-sz-32'],\n md: ['min-w-sz-44', 'h-sz-44'],\n lg: ['min-w-sz-56', 'h-sz-56'],\n }),\n /**\n * Shape of the button.\n */\n shape: makeVariants<'shape', ['rounded', 'square', 'pill']>({\n rounded: ['rounded-button'],\n square: ['rounded-0'],\n pill: ['rounded-full'],\n }),\n /**\n * Disable the button, preventing user interaction and adding opacity.\n */\n disabled: {\n true: ['cursor-not-allowed', 'opacity-dim-3'],\n false: ['cursor-pointer'],\n },\n },\n compoundVariants: [\n ...filledVariants,\n ...outlinedVariants,\n ...tintedVariants,\n ...ghostVariants,\n ...contrastVariants,\n ],\n defaultVariants: {\n design: 'filled',\n intent: 'main',\n size: 'md',\n shape: 'rounded',\n },\n }\n)\n\nexport type ButtonStylesProps = VariantProps<typeof buttonStyles>\n","import { cx } from 'class-variance-authority'\nimport { ComponentPropsWithoutRef, type DOMAttributes, Ref, useMemo } from 'react'\n\nimport { Slot, wrapPolymorphicSlot } from '../slot'\nimport { Spinner, type SpinnerProps } from '../spinner'\nimport { buttonStyles, type ButtonStylesProps } from './Button.styles'\n\nexport interface ButtonProps\n extends Omit<ComponentPropsWithoutRef<'button'>, 'disabled'>, ButtonStylesProps {\n /**\n * Change the component to the HTML tag or custom component of the only child.\n */\n asChild?: boolean\n /**\n * Display a spinner to indicate to the user that the button is loading something after they interacted with it.\n */\n isLoading?: boolean\n /**\n * If your loading state should only display a spinner, it is better to specify a label for it (a11y).\n */\n loadingLabel?: string\n /**\n * If your loading state should also display a label, you can use this prop instead of `loadingLabel`.\n * **Please note that using this can result in layout shifting when the Button goes from loading state to normal state.**\n */\n loadingText?: string\n /**\n * When true, the button is non-interactive and has disabled styling but stays focusable (uses\n * `aria-disabled` instead of native `disabled`). Use for cases where the user should be able to\n * focus the control to discover why it is disabled (e.g. form submit, bulk bar actions).\n */\n ariaDisabled?: boolean\n ref?: Ref<HTMLButtonElement>\n}\n\ntype DOMAttributesEventHandler = keyof Omit<\n DOMAttributes<HTMLButtonElement>,\n 'children' | 'dangerouslySetInnerHTML'\n>\n\nconst blockedEventHandlers: DOMAttributesEventHandler[] = [\n 'onClick',\n 'onMouseDown',\n 'onMouseUp',\n 'onMouseEnter',\n 'onMouseLeave',\n 'onMouseOver',\n 'onMouseOut',\n 'onKeyDown',\n 'onKeyPress',\n 'onKeyUp',\n 'onSubmit',\n]\n\n/**\n * A clickable element that triggers an action or event when activated by the user.\n */\nexport const Button = ({\n children,\n design = 'filled',\n disabled = false,\n ariaDisabled = false,\n intent = 'main',\n isLoading = false,\n loadingLabel,\n loadingText,\n shape = 'pill',\n size = 'md',\n asChild,\n className,\n underline = false,\n ref,\n ...others\n}: ButtonProps) => {\n const Component = asChild ? Slot : 'button'\n\n const shouldNotInteract = !!disabled || !!ariaDisabled || isLoading\n const useNativeDisabled = !!disabled && !ariaDisabled\n\n const disabledEventHandlers = useMemo(() => {\n const result: Partial<Record<DOMAttributesEventHandler, (e: React.SyntheticEvent) => void>> = {}\n\n if (shouldNotInteract) {\n blockedEventHandlers.forEach(key => {\n result[key] = (e: React.SyntheticEvent) => {\n // Allow Tab to move focus away from the button\n if (e.type === 'keydown' && (e as React.KeyboardEvent).key === 'Tab') return\n /*\n Setting handlers to `undefined` (e.g. `result[eventHandler] = undefined`) only blocks JS-level handlers, it does not prevent native browser behavior.\n Calling preventDefault() here also blocks native form submission when type=\"submit\", since the browser triggers it from the click chain.\n */\n e.preventDefault()\n }\n })\n }\n\n return result\n }, [shouldNotInteract])\n\n const spinnerProps = {\n size: 'current' as SpinnerProps['size'],\n className: loadingText ? 'inline-block' : 'absolute',\n ...(loadingLabel && { 'aria-label': loadingLabel }),\n }\n\n return (\n <Component\n data-spark-component=\"button\"\n {...(Component === 'button' && { type: 'button' })}\n ref={ref}\n className={buttonStyles({\n className,\n design,\n disabled: shouldNotInteract,\n intent,\n shape,\n size,\n underline,\n })}\n disabled={useNativeDisabled}\n aria-disabled={shouldNotInteract ? true : undefined}\n aria-busy={isLoading}\n aria-live={isLoading ? 'assertive' : 'off'}\n {...others}\n {...disabledEventHandlers}\n >\n {wrapPolymorphicSlot(asChild, children, slotted =>\n isLoading ? (\n <>\n <Spinner {...spinnerProps} />\n {loadingText}\n\n <div\n aria-hidden\n className={cx('gap-md', loadingText ? 'hidden' : 'inline-flex opacity-0')}\n >\n {slotted}\n </div>\n </>\n ) : (\n slotted\n )\n )}\n </Component>\n )\n}\n\nButton.displayName = 'Button'\n"],"mappings":";;;;;;;AAEA,IAAa,IAAiB;CAE5B;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CAED;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CAED;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CAED;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CAED;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CAED;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CAED;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACD,CAAC;EACH;CAED;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACD,CAAC;EACH;CAED;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CAED;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACF,EChIY,IAAgB;CAC3B;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACF,EC/GY,IAAmB;CAC9B;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACF,EC/GY,IAAiB;CAC5B;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACF,EC1HY,IAAmB;CAC9B;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACD,CAAC;EACH;CACF,ECtGY,IAAe,EAC1B;CACE;CACA;CACA;CACA;CACA;CACD,EACD;CACE,UAAU;EAeR,QAAQ,EAA8E;GACpF,QAAQ,EAAE;GACV,UAAU;IAAC;IAAkB;IAAa;IAAiB;GAC3D,QAAQ,EAAE;GACV,OAAO,CAAC,2CAA2C;GACnD,UAAU,EAAE;GACb,CAAC;EACF,WAAW,EACT,MAAM,CAAC,YAAY,EACpB;EAID,QAAQ,EAeN;GACA,MAAM,EAAE;GACR,SAAS,EAAE;GACX,QAAQ,EAAE;GACV,IAAI,EAAE;GACN,SAAS,EAAE;GACX,OAAO,EAAE;GACT,QAAQ,EAAE;GACV,MAAM,EAAE;GACR,SAAS,EAAE;GACX,SAAS,EAAE;GACX,gBAAgB,EAAE;GACnB,CAAC;EAIF,MAAM,EAAyC;GAC7C,IAAI,CAAC,eAAe,UAAU;GAC9B,IAAI,CAAC,eAAe,UAAU;GAC9B,IAAI,CAAC,eAAe,UAAU;GAC/B,CAAC;EAIF,OAAO,EAAqD;GAC1D,SAAS,CAAC,iBAAiB;GAC3B,QAAQ,CAAC,YAAY;GACrB,MAAM,CAAC,eAAe;GACvB,CAAC;EAIF,UAAU;GACR,MAAM,CAAC,sBAAsB,gBAAgB;GAC7C,OAAO,CAAC,iBAAiB;GAC1B;EACF;CACD,kBAAkB;EAChB,GAAG;EACH,GAAG;EACH,GAAG;EACH,GAAG;EACH,GAAG;EACJ;CACD,iBAAiB;EACf,QAAQ;EACR,QAAQ;EACR,MAAM;EACN,OAAO;EACR;CACF,CACF,EC1EK,IAAoD;CACxD;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACD,EAKY,KAAU,EACrB,aACA,YAAS,UACT,cAAW,IACX,kBAAe,IACf,YAAS,QACT,eAAY,IACZ,iBACA,gBACA,WAAQ,QACR,UAAO,MACP,YACA,cACA,eAAY,IACZ,QACA,GAAG,QACc;CACjB,IAAM,IAAY,IAAU,IAAO,UAE7B,IAAoB,CAAC,CAAC,KAAY,CAAC,CAAC,KAAgB,GACpD,IAAoB,CAAC,CAAC,KAAY,CAAC,GAEnC,IAAwB,QAAc;EAC1C,IAAM,IAAwF,EAAE;AAgBhG,SAdI,KACF,EAAqB,SAAQ,MAAO;AAClC,KAAO,MAAQ,MAA4B;AAErC,MAAE,SAAS,aAAc,EAA0B,QAAQ,SAK/D,EAAE,gBAAgB;;IAEpB,EAGG;IACN,CAAC,EAAkB,CAAC,EAEjB,IAAe;EACnB,MAAM;EACN,WAAW,IAAc,iBAAiB;EAC1C,GAAI,KAAgB,EAAE,cAAc,GAAc;EACnD;AAED,QACE,kBAAC,GAAD;EACE,wBAAqB;EACrB,GAAK,MAAc,YAAY,EAAE,MAAM,UAAU;EAC5C;EACL,WAAW,EAAa;GACtB;GACA;GACA,UAAU;GACV;GACA;GACA;GACA;GACD,CAAC;EACF,UAAU;EACV,iBAAe,IAAoB,KAAO,KAAA;EAC1C,aAAW;EACX,aAAW,IAAY,cAAc;EACrC,GAAI;EACJ,GAAI;YAEH,EAAoB,GAAS,IAAU,MACtC,IACE,kBAAA,GAAA,EAAA,UAAA;GACE,kBAAC,GAAD,EAAS,GAAI,GAAgB,CAAA;GAC5B;GAED,kBAAC,OAAD;IACE,eAAA;IACA,WAAW,EAAG,UAAU,IAAc,WAAW,wBAAwB;cAExE;IACG,CAAA;GACL,EAAA,CAAA,GAEH,EAEH;EACS,CAAA;;AAIhB,EAAO,cAAc"}
package/dist/carousel/index.js CHANGED
@@ -1,2 +1,2 @@
1
- Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`../chunk-C91j1N6u.js`);const e=require(`../icon-CRPcdgYp.js`),t=require(`../icon-button-Iv9kq84M.js`);let n=require(`class-variance-authority`),r=require(`react`),i=require(`react/jsx-runtime`),a=require(`@spark-ui/icons/ArrowVerticalRight`),o=require(`@spark-ui/icons/ArrowVerticalLeft`);function s(e){let t=(0,r.useRef)(new Map),n=(0,r.useRef)(null),i=(0,r.useRef)(new Map),a=(0,r.useCallback)(()=>e=>{e.forEach(e=>{let n=e.isIntersecting,r=e.target;t.current.set(r,n);let a=i.current.get(r);a&&a(n)})},[]),o=(0,r.useCallback)(()=>{if(n.current)return n.current;let t=e.current;if(!t)return null;let r=new IntersectionObserver(a(),{root:t,threshold:.2});return n.current=r,r},[e,a]);(0,r.useEffect)(()=>{let e=o(),r=t.current,a=i.current;return()=>{e&&(e.disconnect(),r.clear(),a.clear(),n.current=null)}},[o]);let s=(0,r.useCallback)((e,n)=>{if(!e)return;let r=o();if(!r){setTimeout(()=>s(e,n),0);return}let a=t.current.get(e)??!0;t.current.set(e,a),i.current.set(e,n),r.observe(e),n(a)},[o]);return{registerSlide:s,unregisterSlide:(0,r.useCallback)(e=>{if(!e)return;let r=n.current;r&&r.unobserve(e),t.current.delete(e),i.current.delete(e)},[]),isSlideVisible:(0,r.useCallback)(e=>e?t.current.get(e)??!0:!0,[])}}function c(e){let t=(0,r.useRef)(()=>{throw Error(`Cannot call an event handler while rendering.`)});return(0,r.useLayoutEffect)(()=>{t.current=e}),(0,r.useCallback)((...e)=>t.current?.(...e),[])}var l=()=>{let e=(0,r.useRef)(!1);return(0,r.useEffect)(()=>(e.current=!0,()=>{e.current=!1}),[]),e};function u(e,t){let n=(0,r.useRef)(0),i=(0,r.useRef)(null);(0,r.useEffect)(()=>{let r=e.current;if(!r)return;let a=`onscrollend`in window,o=()=>{t()},s=()=>{i.current&&clearTimeout(i.current),e.current&&(n.current=e.current.scrollLeft,i.current=setTimeout(()=>{e.current&&o()},150))};return a?r.addEventListener(`scrollend`,o):r.addEventListener(`scroll`,s),()=>{i.current&&clearTimeout(i.current),a?r.removeEventListener(`scrollend`,o):r.removeEventListener(`scroll`,s)}},[t,e])}function d(e,t){(0,r.useLayoutEffect)(()=>{let n=e.current;if(!n)return;let r=new ResizeObserver(e=>{for(let n of e)t(n.contentRect.width)});return r.observe(n),()=>r.disconnect()},[e,t])}function f({totalSlides:e,slidesPerMove:t,slidesPerPage:n}){let r=t===`auto`?n:t,i=[],a=Math.floor((e-n)/r)*r;for(let e=0;e<=a;e+=r)i.push(e);return i[i.length-1]!==e-n&&i.push(e-n),i}function p(e){return e?Array.from(e.querySelectorAll(`[data-part="item"]`)):[]}function m(e,{container:t,slidesPerMove:n,slidesPerPage:r}){return f({totalSlides:p(t).length,slidesPerPage:r,slidesPerMove:n}).includes(e)}function h({container:e,slidesPerMove:t,slidesPerPage:n}){return e?p(e).filter((r,i)=>m(i,{slidesPerMove:t,slidesPerPage:n,container:e})).map(e=>e.offsetLeft):[]}function g({dotIndex:e,pageState:t,totalPages:n,maxDots:r=5}){if(n<=r)return e===t?`active`:`idle`;if(t<=Math.floor(r/2))return e>r-1?`hidden`:e===t?`active`:e===r-1?`edge`:`idle`;if(t>=n-Math.ceil(r/2)){let i=n-r;return e<i?`hidden`:e===t?`active`:e===i?`edge`:`idle`}let i=t-Math.floor(r/2),a=t+Math.floor(r/2);return e<i||e>a?`hidden`:e===t?`active`:e===i||e===a?`edge`:`idle`}function _(e=[],{carouselRef:t,slidesPerMove:n,slidesPerPage:i}){let[a,o]=(0,r.useState)(e),s=(0,r.useMemo)(()=>a,[a]);return d(t,()=>{let e=h({slidesPerMove:n,slidesPerPage:i,container:t.current});JSON.stringify(a)!==JSON.stringify(e)&&o(e)}),[s,o]}var v=`carousel`,y=`ltr`,b=({defaultPage:e,gap:t=16,snapType:n=`mandatory`,snapStop:i=`always`,scrollPadding:a=0,slidesPerPage:o=1,slidesPerMove:d=`auto`,scrollBehavior:f=`smooth`,loop:p=!1,pagePickerInset:b=!1,maxDots:x=5,page:S,onPageChange:C})=>{let w=(0,r.useId)(),[T,E]=(0,r.useState)(e||S||0),D=(0,r.useRef)(null),O=(0,r.useRef)([]),k=l().current,A=c(C),{registerSlide:j,unregisterSlide:M,isSlideVisible:N}=s(D),[P]=_([],{carouselRef:D,slidesPerMove:d,slidesPerPage:o}),F=(0,r.useRef)(p||T>0),I=(0,r.useRef)(p||T<P.length-1);F.current=p||T>0,I.current=p||T<P.length-1;let L=(0,r.useCallback)(e=>{e!==T&&(E(e),A?.(e))},[A,T]),R=(0,r.useCallback)((e,t)=>{D.current&&(D.current.scrollTo({left:P[e],behavior:t===`instant`?`auto`:`smooth`}),L(e))},[L,P]),z=(0,r.useCallback)(e=>{if(F){let t=p&&T===0?P.length-1:Math.max(T-1,0);R(t,f),e?.(t)}},[p,P,T,f,R]),B=(0,r.useCallback)(e=>{if(I){let t=p&&T===P.length-1?0:Math.min(T+1,P.length-1);R(t,f),e?.(t)}},[p,P,T,f,R]);return(0,r.useEffect)(()=>{S!=null&&R(S,f)},[S,f,R]),(0,r.useLayoutEffect)(()=>{if(e!=null&&!k&&D.current){let t=h({container:D.current,slidesPerMove:d,slidesPerPage:o});D.current.scrollTo({left:t[e],behavior:`instant`})}},[e,k,d,o]),u(D,(0,r.useCallback)(()=>{if(!D.current||P.length===0)return;let{scrollLeft:e}=D.current,t=P.map(t=>Math.abs(e-t)),n=t.indexOf(Math.min(...t));n!==-1&&L(n)},[P,L])),{ref:D,pageIndicatorsRefs:O,gap:t,snapType:n,snapStop:i,scrollPadding:a,slidesPerPage:o,slidesPerMove:d,scrollBehavior:f,loop:p,pagePickerInset:b,maxDots:x,page:T,pageSnapPoints:P,canScrollNext:I.current,canScrollPrev:F.current,scrollTo:R,scrollPrev:z,scrollNext:B,registerSlide:j,unregisterSlide:M,isSlideVisible:N,getRootProps:()=>({id:`carousel::${w}:`,role:`region`,"aria-roledescription":`carousel`,"data-scope":v,"data-part":`root`,"data-orientation":`horizontal`,dir:y,style:{"--slides-per-page":o,"--slide-spacing":`${t}px`,"--slide-item-size":`calc(100% / var(--slides-per-page) - var(--slide-spacing) * (var(--slides-per-page) - 1) / var(--slides-per-page))`}}),getControlProps:()=>({"data-scope":v,"data-part":`control`,"data-orientation":`horizontal`}),getPrevTriggerProps:()=>({id:`carousel::${w}::prev-trigger`,"aria-controls":`carousel::${w}::item-group`,"data-scope":v,"data-part":`prev-trigger`,"data-orientation":`horizontal`,type:`button`,dir:y,disabled:!F.current,onClick:()=>z()}),getNextTriggerProps:()=>({id:`carousel::${w}::next-trigger`,"aria-controls":`carousel::${w}::item-group`,"data-scope":v,"data-part":`next-trigger`,"data-orientation":`horizontal`,type:`button`,dir:y,disabled:!I.current,onClick:()=>B()}),getSlidesContainerProps:()=>({id:`carousel::${w}::item-group`,"aria-live":o>1?`off`:`polite`,"data-scope":v,"data-part":`item-group`,"data-orientation":`horizontal`,dir:y,tabIndex:0,style:{display:`grid`,gap:`var(--slide-spacing)`,scrollSnapType:`x ${n}`,gridAutoFlow:`column`,scrollbarWidth:`none`,gridAutoColumns:`var(--slide-item-size)`,overflowX:`auto`},ref:D}),getSlideProps:({index:e})=>{let t=m(e,{container:D.current,slidesPerMove:d,slidesPerPage:o});return{id:`carousel::${w}::item:${e}`,role:`group`,"aria-roledescription":`slide`,"data-scope":v,"data-part":`item`,"data-index":e,"data-orientation":`horizontal`,dir:y,style:{...t&&{scrollSnapAlign:`start`,scrollSnapStop:i}}}},getIndicatorGroupProps:()=>({role:`radiogroup`,id:`carousel::${w}::indicator-group`,"data-scope":v,"data-part":`indicator-group`,"data-orientation":`horizontal`,dir:y}),getIndicatorProps:({index:e})=>{let t=g({dotIndex:e,pageState:T,totalPages:P.length,maxDots:x});return{role:`radio`,id:`carousel::${w}::indicator:${e}`,"aria-checked":e===T,"data-scope":v,"data-part":`indicator`,"data-orientation":`horizontal`,"data-index":e,"data-state":t,tabIndex:e===T?0:-1,onClick:()=>{R(e,f)},onKeyDown:e=>{let t=e=>{O.current[e]?.focus()};e.key===`ArrowRight`&&I?B(t):e.key===`ArrowLeft`&&F&&z(t)}}}}},x=(0,r.createContext)(null),S=({className:e,snapType:t=`mandatory`,snapStop:r=`always`,scrollBehavior:a=`smooth`,slidesPerMove:o=`auto`,pagePickerInset:s=!1,slidesPerPage:c=1,loop:l=!1,children:u,gap:d=16,defaultPage:f,page:p,onPageChange:m,maxDots:h=5,...g})=>{let _=b({defaultPage:f,slidesPerPage:c,slidesPerMove:o,loop:l,gap:d,scrollBehavior:a,snapStop:r,snapType:t,page:p,pagePickerInset:s,onPageChange:m,maxDots:h});return(0,i.jsx)(x,{value:{..._,scrollBehavior:a},children:(0,i.jsx)(`div`,{"data-spark-component":`carousel`,className:(0,n.cx)(`gap-lg relative box-border flex flex-col`,e),..._.getRootProps(),...g,children:u})})};S.displayName=`Carousel`;var C=()=>{let e=(0,r.useContext)(x);if(!e)throw Error(`useCarouselContext must be used within a Carousel provider`);return e},w=({children:e,className:t,...r})=>{let a=C();return(0,i.jsx)(`div`,{"data-spark-component":`carousel-controls`,className:(0,n.cx)(`default:px-lg pointer-events-none absolute inset-0 flex flex-row items-center justify-between`,t),...a.getControlProps(),...r,children:e})};w.displayName=`Carousel.Controls`;var T=({"aria-label":n,...r})=>(0,i.jsx)(t.t,{"data-spark-component":`carousel-next-button`,...C().getNextTriggerProps(),intent:`surface`,design:`filled`,className:`pointer-events-auto cursor-pointer shadow-sm disabled:invisible`,"aria-label":n,...r,children:(0,i.jsx)(e.t,{children:(0,i.jsx)(a.ArrowVerticalRight,{})})});T.displayName=`Carousel.NextButton`;var E=({children:e,unstyled:t=!1,index:a,"aria-label":o,className:s,intent:c=`support`})=>{let l=C(),u=(0,r.useRef)(null);return(0,r.useEffect)(()=>{l.pageIndicatorsRefs.current&&(l.pageIndicatorsRefs.current[a]=u.current)}),(0,i.jsx)(`button`,{"data-spark-component":`carousel-page-indicator`,ref:u,...l.getIndicatorProps({index:a}),"aria-label":o,className:(0,n.cx)({[(0,n.cx)(`border-outline group relative flex justify-center border-0 hover:cursor-pointer`,`m-sm rounded-sm transition-all duration-[200ms] ease-linear`,`w-sz-8 h-sz-8`,`data-[state=active]:w-sz-32 data-[state=active]:h-sz-8`,`data-[state=edge]:w-sz-4 data-[state=edge]:h-sz-4`,`data-[state=hidden]:m-0 data-[state=hidden]:size-0`,c===`surface`?`data-[state=active]:bg-surface bg-surface/dim-2`:`data-[state=active]:bg-support bg-on-surface/dim-2`)]:!t},s),children:e},a)};E.displayName=`Carousel.PageIndicator`;var D=({children:e,className:t})=>{let r=C();return(0,i.jsx)(i.Fragment,{children:(0,i.jsx)(`div`,{"data-spark-component":`carousel-page-picker`,...r.getIndicatorGroupProps(),className:(0,n.cx)(`flex-wrap items-center justify-center`,`default:min-h-sz-16 flex`,r.pagePickerInset&&`bottom-sz-12 absolute inset-x-0`,t),children:r.pageSnapPoints.length<=1?null:e({...r,pages:Array.from({length:r.pageSnapPoints.length},(e,t)=>t)})})})};D.displayName=`Carousel.PagePicker`;var O=({"aria-label":n,...r})=>(0,i.jsx)(t.t,{"data-spark-component":`carousel-prev-button`,...C().getPrevTriggerProps(),intent:`surface`,design:`filled`,className:`pointer-events-auto cursor-pointer shadow-sm disabled:invisible`,"aria-label":n,...r,children:(0,i.jsx)(e.t,{children:(0,i.jsx)(o.ArrowVerticalLeft,{})})});O.displayName=`Carousel.PrevButton`;function k(e,t){let[n,i]=(0,r.useState)(!0),a=C();return(0,r.useEffect)(()=>{let t=e.current;if(!t)return;let{registerSlide:n,unregisterSlide:r}=a;return n(t,i),()=>{r(t)}},[e]),n}var A=({children:e,index:t=0,totalSlides:a,className:o=``,...s})=>{let c=(0,r.useRef)(null),l=C(),u=k(c,l.ref);return(0,i.jsx)(`div`,{"data-spark-component":`carousel-slide`,ref:c,...l.getSlideProps({index:t,totalSlides:a}),className:(0,n.cx)(`default:bg-surface relative overflow-hidden`,o),"aria-hidden":!u,inert:!u,...s,children:e})};A.displayName=`Carousel.Slide`;var j=({children:e,className:t=``})=>{let a=C(),o=r.Children.toArray(e);return(0,i.jsx)(`div`,{"data-spark-component":`carousel-slides`,...a.getSlidesContainerProps(),className:(0,n.cx)(`focus-visible:u-outline relative w-full`,`[-ms-overflow-style:none] [scrollbar-width:none] [&::-webkit-scrollbar]:hidden`,t),children:o.map((e,t)=>(0,r.isValidElement)(e)?(0,r.cloneElement)(e,{index:t,totalSlides:o.length}):e)})};j.displayName=`Carousel.Slides`;var M=({children:e})=>(0,i.jsx)(`div`,{className:`relative flex items-center justify-around p-0`,children:e});M.displayName=`Carousel.Viewport`;var N=Object.assign(S,{Controls:w,NextButton:T,PrevButton:O,Slide:A,Slides:j,Viewport:M,PagePicker:D,PageIndicator:E});N.displayName=`Carousel`,exports.Carousel=N;
1
+ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`../chunk-C91j1N6u.js`);const e=require(`../icon-CRPcdgYp.js`),t=require(`../icon-button-BhRYDk-N.js`);let n=require(`class-variance-authority`),r=require(`react`),i=require(`react/jsx-runtime`),a=require(`@spark-ui/icons/ArrowVerticalRight`),o=require(`@spark-ui/icons/ArrowVerticalLeft`);function s(e){let t=(0,r.useRef)(new Map),n=(0,r.useRef)(null),i=(0,r.useRef)(new Map),a=(0,r.useCallback)(()=>e=>{e.forEach(e=>{let n=e.isIntersecting,r=e.target;t.current.set(r,n);let a=i.current.get(r);a&&a(n)})},[]),o=(0,r.useCallback)(()=>{if(n.current)return n.current;let t=e.current;if(!t)return null;let r=new IntersectionObserver(a(),{root:t,threshold:.2});return n.current=r,r},[e,a]);(0,r.useEffect)(()=>{let e=o(),r=t.current,a=i.current;return()=>{e&&(e.disconnect(),r.clear(),a.clear(),n.current=null)}},[o]);let s=(0,r.useCallback)((e,n)=>{if(!e)return;let r=o();if(!r){setTimeout(()=>s(e,n),0);return}let a=t.current.get(e)??!0;t.current.set(e,a),i.current.set(e,n),r.observe(e),n(a)},[o]);return{registerSlide:s,unregisterSlide:(0,r.useCallback)(e=>{if(!e)return;let r=n.current;r&&r.unobserve(e),t.current.delete(e),i.current.delete(e)},[]),isSlideVisible:(0,r.useCallback)(e=>e?t.current.get(e)??!0:!0,[])}}function c(e){let t=(0,r.useRef)(()=>{throw Error(`Cannot call an event handler while rendering.`)});return(0,r.useLayoutEffect)(()=>{t.current=e}),(0,r.useCallback)((...e)=>t.current?.(...e),[])}var l=()=>{let e=(0,r.useRef)(!1);return(0,r.useEffect)(()=>(e.current=!0,()=>{e.current=!1}),[]),e};function u(e,t){let n=(0,r.useRef)(0),i=(0,r.useRef)(null);(0,r.useEffect)(()=>{let r=e.current;if(!r)return;let a=`onscrollend`in window,o=()=>{t()},s=()=>{i.current&&clearTimeout(i.current),e.current&&(n.current=e.current.scrollLeft,i.current=setTimeout(()=>{e.current&&o()},150))};return a?r.addEventListener(`scrollend`,o):r.addEventListener(`scroll`,s),()=>{i.current&&clearTimeout(i.current),a?r.removeEventListener(`scrollend`,o):r.removeEventListener(`scroll`,s)}},[t,e])}function d(e,t){(0,r.useLayoutEffect)(()=>{let n=e.current;if(!n)return;let r=new ResizeObserver(e=>{for(let n of e)t(n.contentRect.width)});return r.observe(n),()=>r.disconnect()},[e,t])}function f({totalSlides:e,slidesPerMove:t,slidesPerPage:n}){let r=t===`auto`?n:t,i=[],a=Math.floor((e-n)/r)*r;for(let e=0;e<=a;e+=r)i.push(e);return i[i.length-1]!==e-n&&i.push(e-n),i}function p(e){return e?Array.from(e.querySelectorAll(`[data-part="item"]`)):[]}function m(e,{container:t,slidesPerMove:n,slidesPerPage:r}){return f({totalSlides:p(t).length,slidesPerPage:r,slidesPerMove:n}).includes(e)}function h({container:e,slidesPerMove:t,slidesPerPage:n}){return e?p(e).filter((r,i)=>m(i,{slidesPerMove:t,slidesPerPage:n,container:e})).map(e=>e.offsetLeft):[]}function g({dotIndex:e,pageState:t,totalPages:n,maxDots:r=5}){if(n<=r)return e===t?`active`:`idle`;if(t<=Math.floor(r/2))return e>r-1?`hidden`:e===t?`active`:e===r-1?`edge`:`idle`;if(t>=n-Math.ceil(r/2)){let i=n-r;return e<i?`hidden`:e===t?`active`:e===i?`edge`:`idle`}let i=t-Math.floor(r/2),a=t+Math.floor(r/2);return e<i||e>a?`hidden`:e===t?`active`:e===i||e===a?`edge`:`idle`}function _(e=[],{carouselRef:t,slidesPerMove:n,slidesPerPage:i}){let[a,o]=(0,r.useState)(e),s=(0,r.useMemo)(()=>a,[a]);return d(t,()=>{let e=h({slidesPerMove:n,slidesPerPage:i,container:t.current});JSON.stringify(a)!==JSON.stringify(e)&&o(e)}),[s,o]}var v=`carousel`,y=`ltr`,b=({defaultPage:e,gap:t=16,snapType:n=`mandatory`,snapStop:i=`always`,scrollPadding:a=0,slidesPerPage:o=1,slidesPerMove:d=`auto`,scrollBehavior:f=`smooth`,loop:p=!1,pagePickerInset:b=!1,maxDots:x=5,page:S,onPageChange:C})=>{let w=(0,r.useId)(),[T,E]=(0,r.useState)(e||S||0),D=(0,r.useRef)(null),O=(0,r.useRef)([]),k=l().current,A=c(C),{registerSlide:j,unregisterSlide:M,isSlideVisible:N}=s(D),[P]=_([],{carouselRef:D,slidesPerMove:d,slidesPerPage:o}),F=(0,r.useRef)(p||T>0),I=(0,r.useRef)(p||T<P.length-1);F.current=p||T>0,I.current=p||T<P.length-1;let L=(0,r.useCallback)(e=>{e!==T&&(E(e),A?.(e))},[A,T]),R=(0,r.useCallback)((e,t)=>{D.current&&(D.current.scrollTo({left:P[e],behavior:t===`instant`?`auto`:`smooth`}),L(e))},[L,P]),z=(0,r.useCallback)(e=>{if(F){let t=p&&T===0?P.length-1:Math.max(T-1,0);R(t,f),e?.(t)}},[p,P,T,f,R]),B=(0,r.useCallback)(e=>{if(I){let t=p&&T===P.length-1?0:Math.min(T+1,P.length-1);R(t,f),e?.(t)}},[p,P,T,f,R]);return(0,r.useEffect)(()=>{S!=null&&R(S,f)},[S,f,R]),(0,r.useLayoutEffect)(()=>{if(e!=null&&!k&&D.current){let t=h({container:D.current,slidesPerMove:d,slidesPerPage:o});D.current.scrollTo({left:t[e],behavior:`instant`})}},[e,k,d,o]),u(D,(0,r.useCallback)(()=>{if(!D.current||P.length===0)return;let{scrollLeft:e}=D.current,t=P.map(t=>Math.abs(e-t)),n=t.indexOf(Math.min(...t));n!==-1&&L(n)},[P,L])),{ref:D,pageIndicatorsRefs:O,gap:t,snapType:n,snapStop:i,scrollPadding:a,slidesPerPage:o,slidesPerMove:d,scrollBehavior:f,loop:p,pagePickerInset:b,maxDots:x,page:T,pageSnapPoints:P,canScrollNext:I.current,canScrollPrev:F.current,scrollTo:R,scrollPrev:z,scrollNext:B,registerSlide:j,unregisterSlide:M,isSlideVisible:N,getRootProps:()=>({id:`carousel::${w}:`,role:`region`,"aria-roledescription":`carousel`,"data-scope":v,"data-part":`root`,"data-orientation":`horizontal`,dir:y,style:{"--slides-per-page":o,"--slide-spacing":`${t}px`,"--slide-item-size":`calc(100% / var(--slides-per-page) - var(--slide-spacing) * (var(--slides-per-page) - 1) / var(--slides-per-page))`}}),getControlProps:()=>({"data-scope":v,"data-part":`control`,"data-orientation":`horizontal`}),getPrevTriggerProps:()=>({id:`carousel::${w}::prev-trigger`,"aria-controls":`carousel::${w}::item-group`,"data-scope":v,"data-part":`prev-trigger`,"data-orientation":`horizontal`,type:`button`,dir:y,disabled:!F.current,onClick:()=>z()}),getNextTriggerProps:()=>({id:`carousel::${w}::next-trigger`,"aria-controls":`carousel::${w}::item-group`,"data-scope":v,"data-part":`next-trigger`,"data-orientation":`horizontal`,type:`button`,dir:y,disabled:!I.current,onClick:()=>B()}),getSlidesContainerProps:()=>({id:`carousel::${w}::item-group`,"aria-live":o>1?`off`:`polite`,"data-scope":v,"data-part":`item-group`,"data-orientation":`horizontal`,dir:y,tabIndex:0,style:{display:`grid`,gap:`var(--slide-spacing)`,scrollSnapType:`x ${n}`,gridAutoFlow:`column`,scrollbarWidth:`none`,gridAutoColumns:`var(--slide-item-size)`,overflowX:`auto`},ref:D}),getSlideProps:({index:e})=>{let t=m(e,{container:D.current,slidesPerMove:d,slidesPerPage:o});return{id:`carousel::${w}::item:${e}`,role:`group`,"aria-roledescription":`slide`,"data-scope":v,"data-part":`item`,"data-index":e,"data-orientation":`horizontal`,dir:y,style:{...t&&{scrollSnapAlign:`start`,scrollSnapStop:i}}}},getIndicatorGroupProps:()=>({role:`radiogroup`,id:`carousel::${w}::indicator-group`,"data-scope":v,"data-part":`indicator-group`,"data-orientation":`horizontal`,dir:y}),getIndicatorProps:({index:e})=>{let t=g({dotIndex:e,pageState:T,totalPages:P.length,maxDots:x});return{role:`radio`,id:`carousel::${w}::indicator:${e}`,"aria-checked":e===T,"data-scope":v,"data-part":`indicator`,"data-orientation":`horizontal`,"data-index":e,"data-state":t,tabIndex:e===T?0:-1,onClick:()=>{R(e,f)},onKeyDown:e=>{let t=e=>{O.current[e]?.focus()};e.key===`ArrowRight`&&I?B(t):e.key===`ArrowLeft`&&F&&z(t)}}}}},x=(0,r.createContext)(null),S=({className:e,snapType:t=`mandatory`,snapStop:r=`always`,scrollBehavior:a=`smooth`,slidesPerMove:o=`auto`,pagePickerInset:s=!1,slidesPerPage:c=1,loop:l=!1,children:u,gap:d=16,defaultPage:f,page:p,onPageChange:m,maxDots:h=5,...g})=>{let _=b({defaultPage:f,slidesPerPage:c,slidesPerMove:o,loop:l,gap:d,scrollBehavior:a,snapStop:r,snapType:t,page:p,pagePickerInset:s,onPageChange:m,maxDots:h});return(0,i.jsx)(x,{value:{..._,scrollBehavior:a},children:(0,i.jsx)(`div`,{"data-spark-component":`carousel`,className:(0,n.cx)(`gap-lg relative box-border flex flex-col`,e),..._.getRootProps(),...g,children:u})})};S.displayName=`Carousel`;var C=()=>{let e=(0,r.useContext)(x);if(!e)throw Error(`useCarouselContext must be used within a Carousel provider`);return e},w=({children:e,className:t,...r})=>{let a=C();return(0,i.jsx)(`div`,{"data-spark-component":`carousel-controls`,className:(0,n.cx)(`default:px-lg pointer-events-none absolute inset-0 flex flex-row items-center justify-between`,t),...a.getControlProps(),...r,children:e})};w.displayName=`Carousel.Controls`;var T=({"aria-label":n,...r})=>(0,i.jsx)(t.t,{"data-spark-component":`carousel-next-button`,...C().getNextTriggerProps(),intent:`surface`,design:`filled`,className:`pointer-events-auto cursor-pointer shadow-sm disabled:invisible`,"aria-label":n,...r,children:(0,i.jsx)(e.t,{children:(0,i.jsx)(a.ArrowVerticalRight,{})})});T.displayName=`Carousel.NextButton`;var E=({children:e,unstyled:t=!1,index:a,"aria-label":o,className:s,intent:c=`support`})=>{let l=C(),u=(0,r.useRef)(null);return(0,r.useEffect)(()=>{l.pageIndicatorsRefs.current&&(l.pageIndicatorsRefs.current[a]=u.current)}),(0,i.jsx)(`button`,{"data-spark-component":`carousel-page-indicator`,ref:u,...l.getIndicatorProps({index:a}),"aria-label":o,className:(0,n.cx)({[(0,n.cx)(`border-outline group relative flex justify-center border-0 hover:cursor-pointer`,`m-sm rounded-sm transition-all duration-[200ms] ease-linear`,`w-sz-8 h-sz-8`,`data-[state=active]:w-sz-32 data-[state=active]:h-sz-8`,`data-[state=edge]:w-sz-4 data-[state=edge]:h-sz-4`,`data-[state=hidden]:m-0 data-[state=hidden]:size-0`,c===`surface`?`data-[state=active]:bg-surface bg-surface/dim-2`:`data-[state=active]:bg-support bg-on-surface/dim-2`)]:!t},s),children:e},a)};E.displayName=`Carousel.PageIndicator`;var D=({children:e,className:t})=>{let r=C();return(0,i.jsx)(i.Fragment,{children:(0,i.jsx)(`div`,{"data-spark-component":`carousel-page-picker`,...r.getIndicatorGroupProps(),className:(0,n.cx)(`flex-wrap items-center justify-center`,`default:min-h-sz-16 flex`,r.pagePickerInset&&`bottom-sz-12 absolute inset-x-0`,t),children:r.pageSnapPoints.length<=1?null:e({...r,pages:Array.from({length:r.pageSnapPoints.length},(e,t)=>t)})})})};D.displayName=`Carousel.PagePicker`;var O=({"aria-label":n,...r})=>(0,i.jsx)(t.t,{"data-spark-component":`carousel-prev-button`,...C().getPrevTriggerProps(),intent:`surface`,design:`filled`,className:`pointer-events-auto cursor-pointer shadow-sm disabled:invisible`,"aria-label":n,...r,children:(0,i.jsx)(e.t,{children:(0,i.jsx)(o.ArrowVerticalLeft,{})})});O.displayName=`Carousel.PrevButton`;function k(e,t){let[n,i]=(0,r.useState)(!0),a=C();return(0,r.useEffect)(()=>{let t=e.current;if(!t)return;let{registerSlide:n,unregisterSlide:r}=a;return n(t,i),()=>{r(t)}},[e]),n}var A=({children:e,index:t=0,totalSlides:a,className:o=``,...s})=>{let c=(0,r.useRef)(null),l=C(),u=k(c,l.ref);return(0,i.jsx)(`div`,{"data-spark-component":`carousel-slide`,ref:c,...l.getSlideProps({index:t,totalSlides:a}),className:(0,n.cx)(`default:bg-surface relative overflow-hidden`,o),"aria-hidden":!u,inert:!u,...s,children:e})};A.displayName=`Carousel.Slide`;var j=({children:e,className:t=``})=>{let a=C(),o=r.Children.toArray(e);return(0,i.jsx)(`div`,{"data-spark-component":`carousel-slides`,...a.getSlidesContainerProps(),className:(0,n.cx)(`focus-visible:u-outline relative w-full`,`[-ms-overflow-style:none] [scrollbar-width:none] [&::-webkit-scrollbar]:hidden`,t),children:o.map((e,t)=>(0,r.isValidElement)(e)?(0,r.cloneElement)(e,{index:t,totalSlides:o.length}):e)})};j.displayName=`Carousel.Slides`;var M=({children:e})=>(0,i.jsx)(`div`,{className:`relative flex items-center justify-around p-0`,children:e});M.displayName=`Carousel.Viewport`;var N=Object.assign(S,{Controls:w,NextButton:T,PrevButton:O,Slide:A,Slides:j,Viewport:M,PagePicker:D,PageIndicator:E});N.displayName=`Carousel`,exports.Carousel=N;
2
2
  //# sourceMappingURL=index.js.map
package/dist/carousel/index.mjs CHANGED
@@ -1,5 +1,5 @@
1
1
  import { t as e } from "../icon-D05Uqh8_.mjs";
2
- import { t } from "../icon-button-BLG7VjR7.mjs";
2
+ import { t } from "../icon-button-Mq9ENaLm.mjs";
3
3
  import { cx as n } from "class-variance-authority";
4
4
  import { Children as r, cloneElement as i, createContext as a, isValidElement as o, useCallback as s, useContext as c, useEffect as l, useId as u, useLayoutEffect as d, useMemo as f, useRef as p, useState as m } from "react";
5
5
  import { Fragment as h, jsx as g } from "react/jsx-runtime";
package/dist/combobox/index.js CHANGED
@@ -1,2 +1,2 @@
1
- Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`../chunk-C91j1N6u.js`);const e=require(`../visually-hidden/index.js`),t=require(`../icon-CRPcdgYp.js`),n=require(`../spinner-DFUoYvmm.js`),r=require(`../icon-button-Iv9kq84M.js`),i=require(`../popover-qoueDrzR.js`);let a=require(`class-variance-authority`),o=require(`react`),s=require(`react/jsx-runtime`),c=require(`@spark-ui/icons/ArrowHorizontalDown`),l=require(`@spark-ui/hooks/use-merge-refs`),u=require(`@spark-ui/components/form-field`),d=require(`@spark-ui/icons/Check`),f=require(`@spark-ui/hooks/use-combined-state`),p=require(`downshift`),m=require(`@spark-ui/icons/DeleteOutline`);function h(e,t){let n=0;for(let[r]of e.entries()){if(r===t)return n;n++}return-1}var g=(e,t)=>{let n=0;for(let r of e.keys()){if(n===t)return r;n++}},_=(e,t)=>{let n=g(e,t);return n===void 0?void 0:e.get(n)},v=e=>e?e.type.displayName:``,y=(e,t=[])=>(o.Children.forEach(e,e=>{if((0,o.isValidElement)(e)){if(v(e)===`Combobox.Item`){let n=e.props;t.push({value:n.value,disabled:!!n.disabled,text:x(n.children)})}e.props.children&&y(e.props.children,t)}}),t),b=e=>{if(!e)return``;for(let t of o.Children.toArray(e))if((0,o.isValidElement)(t)){let e=t;if(v(e)===`Combobox.ItemText`)return e.props.children;let n=b(e.props.children);if(n)return n}return``},x=e=>typeof e==`string`?e:b(e),S=e=>{let t=new Map;return y(e).forEach(e=>{t.set(e.value,e)}),t},C=(e,t)=>o.Children.toArray(e).some(e=>(0,o.isValidElement)(e)?v(e)===t?!0:e.props.children?C(e.props.children,t):!1:!1),w=(e,t)=>o.Children.toArray(e).filter(o.isValidElement).find(e=>t===v(e)||``),T=({multiselect:e,selectedItems:t,allowCustomValue:n=!1,setSelectedItems:r,triggerAreaRef:i,items:a})=>(o,{changes:s,type:c})=>{let l=i.current?.contains?.(document.activeElement);switch(c){case p.useCombobox.stateChangeTypes.InputClick:return{...s,isOpen:!0};case p.useCombobox.stateChangeTypes.InputKeyDownEnter:case p.useCombobox.stateChangeTypes.ItemClick:{let n={...s};return s.selectedItem!=null&&(n.inputValue=``,n.isOpen=!0,n.highlightedIndex=h(a,s.selectedItem.value),r(e.selectedItems.some(e=>e.value===s.selectedItem?.value)?t.filter(e=>e.value!==s.selectedItem?.value):[...t,s.selectedItem])),n}case p.useCombobox.stateChangeTypes.ToggleButtonClick:return{...s,inputValue:n?s.inputValue:``};case p.useCombobox.stateChangeTypes.InputChange:return{...s,selectedItem:s.highlightedIndex===-1?null:s.selectedItem};case p.useCombobox.stateChangeTypes.InputBlur:return{...s,inputValue:n?s.inputValue:``,isOpen:l};default:return s}},ee=({filteredItems:e,allowCustomValue:t=!1,setSelectedItem:n})=>(r,{changes:i,type:a})=>{let o=e.find(e=>e.text.toLowerCase()===r.inputValue.toLowerCase());switch(a){case p.useCombobox.stateChangeTypes.InputKeyDownEscape:return i.selectedItem||n(null),i;case p.useCombobox.stateChangeTypes.ItemClick:case p.useCombobox.stateChangeTypes.InputKeyDownEnter:return i.selectedItem&&n(i.selectedItem),i;case p.useCombobox.stateChangeTypes.InputClick:return{...i,isOpen:!0};case p.useCombobox.stateChangeTypes.ToggleButtonClick:case p.useCombobox.stateChangeTypes.InputBlur:return t?i:r.inputValue===``?(n(null),{...i,selectedItem:null}):o?(n(o),{...i,selectedItem:o,inputValue:o.text}):r.selectedItem?{...i,inputValue:r.selectedItem.text}:{...i,inputValue:``};default:return i}},E=(0,o.createContext)(null),D=(e,t)=>t?new Map(Array.from(e).filter(([e,{text:n}])=>n.toLowerCase().includes(t.toLowerCase()))):e,O=`:combobox`,k=({children:e,state:t,allowCustomValue:n=!1,filtering:r=`auto`,disabled:a=!1,multiple:c=!1,readOnly:l=!1,wrap:d=!0,value:m,defaultValue:h,onValueChange:g,open:v,defaultOpen:y,onOpenChange:b,isLoading:x})=>{let w=(0,o.useRef)(!1),[k,A]=(0,o.useState)(``),[j,M]=(0,o.useState)(r===`strict`),N=(0,o.useRef)(null),P=(0,o.useRef)(null),[F,te]=(0,o.useState)(null),[I]=(0,f.useCombinedState)(m,h),L=r===`strict`||r===`auto`&&j,[R,z]=(0,o.useState)(S(e)),[B,V]=(0,o.useState)(L?D(R,k):R),[H,U]=(0,o.useState)(R.get(I)||null),[W,ne]=(0,o.useState)(I?[...R.values()].filter(e=>I.includes(e.value)):[]),G=e=>{M(!1),e?.value!==H?.value&&(U(e),setTimeout(()=>{g?.(e?.value)},0))},K=e=>{ne(e),setTimeout(()=>{g?.(e.map(e=>e.value))},0)};(0,o.useEffect)(()=>{if(!w.current){w.current=!0;return}if(c){let e=I.reduce((e,t)=>{let n=R.get(t);return n?[...e,n]:e},[]);ne(I?e:[])}else U(R.get(I)||null)},[c?JSON.stringify(I):I]);let q=(0,u.useFormFieldControl)(),J=`${O}-label-${(0,o.useId)()}`,Y=`${O}-field-${(0,o.useId)()}`,X=q.id||Y,Z=q.labelId||J,re=q.state||t,Q=q.disabled??a,ie=q.readOnly??l,[ae,$]=(0,o.useState)(C(e,`Combobox.Popover`)),[oe,se]=(0,o.useState)(!1),[ce,le]=(0,o.useState)(`mouse`);(0,o.useEffect)(()=>{V(L?D(R,k):R)},[k,R]);let ue=(0,p.useMultipleSelection)({selectedItems:W,stateReducer:(e,{type:t,changes:n})=>{let r=p.useMultipleSelection.stateChangeTypes;switch(t){case r.SelectedItemKeyDownBackspace:case r.SelectedItemKeyDownDelete:{K(n.selectedItems||[]);let i;return i=t===r.SelectedItemKeyDownDelete?e?.activeIndex===n.selectedItems?.length?-1:e.activeIndex:(n?.activeIndex||0)-1>=0?e.activeIndex-1:n?.activeIndex,{...n,activeIndex:i}}case r.SelectedItemClick:return P.current&&P.current.focus(),{...n,activeIndex:-1};case r.FunctionRemoveSelectedItem:return{...n,activeIndex:-1};case r.DropdownKeyDownNavigationPrevious:return fe.closeMenu(),n;default:return n}}}),de=Array.from(B.values());(0,o.useEffect)(()=>{F?.(k||``)},[k]);let fe=(0,p.useCombobox)({inputId:X,items:de,selectedItem:c?void 0:H,id:X,labelId:Z,inputValue:k,onInputValueChange:({inputValue:e})=>{A(e),L&&V(D(R,e||``))},initialIsOpen:y,...v!=null&&{isOpen:v},onIsOpenChange:e=>{e.isOpen!=null&&b?.(e.isOpen)},itemToString:e=>e?.text,isItemDisabled:e=>{let t=!!k&&!de.some(t=>e.value===t.value);return e.disabled||t},stateReducer:c?T({multiselect:ue,selectedItems:W,allowCustomValue:n,setSelectedItems:K,triggerAreaRef:N,items:R}):ee({allowCustomValue:n,setSelectedItem:G,filteredItems:[...B.values()]}),scrollIntoView:e=>{e&&e.scrollIntoView({block:`nearest`})}});(0,o.useEffect)(()=>{let t=S(e),n=[...R.values()],r=[...t.values()];(n.length!==r.length||n.some((e,t)=>{let n=e.value!==r[t]?.value,i=e.text!==r[t]?.text;return n||i}))&&z(t)},[e]);let[pe,me]=ae?[i.t,{open:!0}]:[o.Fragment,{}];return(0,s.jsx)(E,{value:{itemsMap:R,filteredItemsMap:B,highlightedItem:_(B,fe.highlightedIndex),multiple:c,disabled:Q,readOnly:ie,areSelectedItemsInTrigger:oe,setAreSelectedItemsInTrigger:se,hasPopover:ae,setHasPopover:$,state:re,lastInteractionType:ce,setLastInteractionType:le,wrap:d,innerInputRef:P,triggerAreaRef:N,...fe,...ue,setInputValue:A,selectItem:G,setSelectedItems:K,isLoading:x,setOnInputValueChange:te,isTyping:j,setIsTyping:M},children:(0,s.jsx)(pe,{...me,children:e})})},A=()=>{let e=(0,o.useContext)(E);if(!e)throw Error(`useComboboxContext must be used within a Combobox provider`);return e},j=({children:e,...t})=>(0,s.jsx)(k,{...t,children:e});j.displayName=`Combobox`;var M=({className:e,tabIndex:n=-1,onClick:r,ref:i,...o})=>{let c=A();return(0,s.jsx)(`button`,{ref:i,className:(0,a.cx)(e,`h-sz-44 text-neutral hover:text-neutral-hovered`),tabIndex:n,onClick:e=>{e.stopPropagation(),c.multiple?c.setSelectedItems([]):c.selectItem(null),c.setInputValue(``),c.innerInputRef.current&&c.innerInputRef.current.focus(),r&&r(e)},type:`button`,...o,children:(0,s.jsx)(t.t,{size:`sm`,children:(0,s.jsx)(m.DeleteOutline,{})})})};M.displayName=`Combobox.ClearButton`;var N=({className:e,closedLabel:n,openedLabel:i,intent:o=`neutral`,design:u=`ghost`,size:d=`sm`,ref:f,...p})=>{let m=A(),{ref:h,...g}=m.getToggleButtonProps({disabled:m.disabled||m.readOnly,onClick:e=>{e.stopPropagation()}}),_=g[`aria-expanded`];return(0,s.jsx)(r.t,{ref:(0,l.useMergeRefs)(f,h),className:(0,a.cx)(e,`ml-sm mt-[calc((44px-32px)/2)]`),intent:o,design:u,size:d,...g,...p,"aria-label":_?i:n,disabled:m.disabled,children:(0,s.jsx)(t.t,{className:(0,a.cx)(`shrink-0`,`rotate-0 transition duration-100 ease-in`,{"rotate-180":_}),size:`sm`,children:(0,s.jsx)(c.ArrowHorizontalDown,{})})})};N.displayName=`Combobox.Disclosure`;var P=({className:e,children:t,ref:n})=>A().filteredItemsMap.size===0?(0,s.jsx)(`div`,{ref:n,className:(0,a.cx)(`px-lg py-md text-body-1 text-on-surface/dim-1`,e),children:t}):null;P.displayName=`Combobox.Empty`;var F=(0,o.createContext)(null),te=({children:e})=>(0,s.jsx)(F,{value:{groupLabelId:`${O}-group-label-${(0,o.useId)()}`},children:e}),I=()=>{let e=(0,o.useContext)(F);if(!e)throw Error(`useComboboxGroupContext must be used within a ComboboxGroup provider`);return e},L=({children:e,ref:t,...n})=>(0,s.jsx)(te,{children:(0,s.jsx)(R,{ref:t,...n,children:e})}),R=({children:e,className:t,ref:n})=>{let r=A(),i=I();return o.Children.toArray(e).some(e=>(0,o.isValidElement)(e)&&r.filteredItemsMap.get(e.props.value))?(0,s.jsx)(`div`,{ref:n,role:`group`,"aria-labelledby":i.groupLabelId,className:(0,a.cx)(t),children:e}):null};L.displayName=`Combobox.Group`;var z=({"aria-label":t,className:n,placeholder:r,value:c,defaultValue:d,onValueChange:p,ref:m,...h})=>{let g=A(),_=(0,u.useFormFieldControl)(),[v]=(0,f.useCombinedState)(c,d),{isInvalid:y,description:b}=_;(0,o.useEffect)(()=>{v!=null&&g.setInputValue(v)},[v]),(0,o.useEffect)(()=>{p&&g.setOnInputValueChange(()=>p),!g.multiple&&g.selectedItem&&g.setInputValue(g.selectedItem.text)},[]);let x=g.hasPopover?i.t.Trigger:o.Fragment,S=g.hasPopover?{asChild:!0,type:void 0}:{},C=g.getDropdownProps(),w=(0,l.useMergeRefs)(m,g.innerInputRef,C.ref),T=g.getInputProps({disabled:g.disabled||g.readOnly,...C,onKeyDown:e=>{C.onKeyDown?.(e),g.setLastInteractionType(`keyboard`),g.setIsTyping(!0)},onChange:e=>{g.setInputValue(e.target.value)},ref:w}),ee=g.multiple?!g.areSelectedItemsInTrigger||g.selectedItems.length===0:g.selectedItem===null;function E(e,t){return n=>{e?.(n),t?.(n)}}let D={onBlur:E(h.onBlur,T.onBlur),onChange:E(h.onChange,T.onChange),onClick:E(h.onClick,T.onClick),onKeyDown:E(h.onKeyDown,T.onKeyDown)};return(0,s.jsxs)(s.Fragment,{children:[t&&(0,s.jsx)(e.VisuallyHidden,{children:(0,s.jsx)(`label`,{...g.getLabelProps(),children:t})}),(0,s.jsx)(x,{...S,children:(0,s.jsx)(`input`,{"data-spark-component":`combobox-input`,type:`text`,...ee&&{placeholder:r},className:(0,a.cx)(`max-w-full shrink-0 grow basis-[80px]`,`h-sz-28 bg-surface px-sm text-body-1 text-ellipsis outline-hidden`,`disabled:text-on-surface/dim-3 disabled:cursor-not-allowed disabled:bg-transparent`,`read-only:text-on-surface read-only:cursor-default read-only:bg-transparent`,n),...h,...T,...D,value:g.inputValue,"aria-label":t,disabled:g.disabled,readOnly:g.readOnly,"aria-invalid":y,"aria-describedby":b})})]})};z.displayName=`Combobox.Input`;var B=(0,o.createContext)(null),V=({value:e,disabled:t=!1,children:n})=>{let r=A(),[i,a]=(0,o.useState)(void 0),c=h(r.filteredItemsMap,e),l={disabled:t,value:e,text:x(n)};return(0,s.jsx)(B,{value:{textId:i,setTextId:a,isSelected:r.multiple?r.selectedItems.some(t=>t.value===e):r.selectedItem?.value===e,itemData:l,index:c,disabled:t},children:n})},H=()=>{let e=(0,o.useContext)(B);if(!e)throw Error(`useComboboxItemContext must be used within a ComboboxItem provider`);return e},U=({children:e,ref:t,...n})=>{let{value:r,disabled:i}=n;return(0,s.jsx)(V,{value:r,disabled:i,children:(0,s.jsx)(ne,{ref:t,...n,children:e})})},W=(0,a.cva)(`px-lg py-md text-body-1`,{variants:{selected:{true:`font-bold`},disabled:{true:`opacity-dim-3 cursor-not-allowed`,false:`cursor-pointer`},highlighted:{true:``},interactionType:{mouse:``,keyboard:``}},compoundVariants:[{highlighted:!0,interactionType:`mouse`,class:`bg-surface-hovered`},{highlighted:!0,interactionType:`keyboard`,class:`u-outline`}]}),ne=({className:e,disabled:t=!1,value:n,children:r,ref:i,...o})=>{let c=A(),u=H(),d=!!c.filteredItemsMap.get(n),{ref:f,...p}=c.getItemProps({item:u.itemData,index:u.index}),m=(0,l.useMergeRefs)(i,f);return d?(0,s.jsx)(`li`,{ref:m,className:(0,a.cx)(W({selected:u.isSelected,disabled:t,highlighted:c.highlightedItem?.value===n,interactionType:c.lastInteractionType,className:e})),...p,...o,"aria-selected":u.isSelected,"aria-labelledby":u.textId,children:r},n):null};U.displayName=`Combobox.Item`;var G=({className:e,children:n,label:r,ref:i})=>{let{disabled:o,isSelected:c}=H(),l=n||(0,s.jsx)(t.t,{size:`sm`,children:(0,s.jsx)(d.Check,{"aria-label":r})});return(0,s.jsx)(`span`,{ref:i,className:(0,a.cx)(`min-h-sz-16 min-w-sz-16 flex`,o&&`opacity-dim-3`,e),children:c&&l})};G.displayName=`Combobox.ItemIndicator`;var K=({children:e,className:t,ref:r,...i})=>{let c=A(),{ref:u,...d}=c.getMenuProps({onMouseMove:()=>{c.setLastInteractionType(`mouse`)}}),f=(0,o.useRef)(null),p=(0,l.useMergeRefs)(r,u,f),m=c.hasPopover?c.isOpen:!0,h=c.hasPopover&&!m;return(0,o.useLayoutEffect)(()=>{f.current?.parentElement&&(f.current.parentElement.style.pointerEvents=h?`none`:``,f.current.style.pointerEvents=h?`none`:``)},[h]),(0,s.jsx)(`ul`,{ref:p,className:(0,a.cx)(t,`flex flex-col`,m?`block`:`pointer-events-none invisible opacity-0`,c.hasPopover&&`p-lg`,c.isLoading&&`items-center overflow-y-auto`),...i,...d,"aria-busy":c.isLoading,"data-spark-component":`combobox-items`,children:c.isLoading?(0,s.jsx)(n.t,{size:`sm`}):e})};K.displayName=`Combobox.Items`;var q=({children:e,className:t,ref:n})=>{let r=`${O}-item-text-${(0,o.useId)()}`,{setTextId:i}=H();return(0,o.useEffect)(()=>(i(r),()=>i(void 0))),(0,s.jsx)(`span`,{id:r,className:(0,a.cx)(`inline`,t),ref:n,children:e})};q.displayName=`Combobox.ItemText`;var J=({children:e,className:t,ref:n})=>(0,s.jsx)(`div`,{ref:n,id:I().groupLabelId,className:(0,a.cx)(`px-md py-sm text-body-2 text-neutral italic`,t),children:e});J.displayName=`Combobox.Label`;var Y=({children:e})=>(0,s.jsx)(t.t,{size:`sm`,className:`h-sz-44 shrink-0`,children:e});Y.displayName=`Combobox.LeadingIcon`;var X=({children:e,matchTriggerWidth:t=!0,sideOffset:n=4,className:r,ref:c,...l})=>{let u=A();return(0,o.useEffect)(()=>(u.setHasPopover(!0),()=>u.setHasPopover(!1)),[]),(0,s.jsx)(i.t.Content,{ref:c,inset:!0,asChild:!0,matchTriggerWidth:t,className:(0,a.cx)(`z-dropdown! relative`,r),sideOffset:n,onOpenAutoFocus:e=>{e.preventDefault()},...l,"data-spark-component":`combobox-popover`,children:e})};X.displayName=`Combobox.Popover`;var Z=({children:e,...t})=>(0,s.jsx)(i.t.Portal,{...t,children:e});Z.displayName=`Combobox.Portal`;var re=({item:e,index:n})=>{let r=A(),i=!r.disabled&&!r.readOnly,o=e=>{let t=e.target;r.lastInteractionType===`keyboard`&&t.scrollIntoView({behavior:`smooth`,block:`nearest`,inline:`nearest`})},{disabled:c,...l}=r.getSelectedItemProps({disabled:r.disabled||r.readOnly,selectedItem:e,index:n});return(0,s.jsxs)(c?`button`:`span`,{role:`presentation`,"data-spark-component":`combobox-selected-item`,className:(0,a.cx)(`h-sz-28 bg-neutral-container flex items-center rounded-md align-middle`,`text-body-2 text-on-neutral-container`,`disabled:opacity-dim-3 disabled:cursor-not-allowed`,`focus-visible:u-outline-inset outline-hidden`,{"px-md":!i,"pl-md":i}),...l,tabIndex:-1,...c&&{disabled:!0},onFocus:o,children:[(0,s.jsx)(`span`,{className:(0,a.cx)(`line-clamp-1 overflow-x-hidden leading-normal break-all text-ellipsis`,{"w-max":!r.wrap}),children:e.text}),r.disabled,i&&(0,s.jsx)(`button`,{type:`button`,tabIndex:-1,"aria-hidden":!0,className:`px-md h-full cursor-pointer`,onClick:t=>{t.stopPropagation();let n=r.selectedItems.filter(t=>t.value!==e.value);r.setSelectedItems(n),r.innerInputRef.current&&r.innerInputRef.current.focus({preventScroll:!0})},children:(0,s.jsx)(t.t,{size:`sm`,children:(0,s.jsx)(m.DeleteOutline,{})})})]},`selected-item-${n}`)},Q=()=>{let e=A();return e.multiple&&e.selectedItems.length?(0,s.jsx)(s.Fragment,{children:e.selectedItems.map((e,t)=>(0,s.jsx)(re,{item:e,index:t},e.value))}):null};Q.displayName=`Combobox.SelectedItems`;var ie=(0,a.cva)([`flex items-start gap-md min-h-sz-44 text-body-1`,`h-fit rounded-input px-lg`,`ring-1 outline-hidden ring-inset focus-within:ring-2 focus-within:ring-focus`],{variants:{allowWrap:{true:``,false:`h-sz-44`},state:{undefined:`ring-outline`,error:`ring-error`,alert:`ring-alert`,success:`ring-success`},disabled:{true:`cursor-not-allowed border-outline bg-on-surface/dim-5 text-on-surface/dim-3`},readOnly:{true:`cursor-default bg-on-surface/dim-5 text-on-surface`}},compoundVariants:[{disabled:!1,state:void 0,class:`default:hover:ring-outline-high`},{disabled:!1,readOnly:!1,class:`bg-surface text-on-surface cursor-text`}],defaultVariants:{state:void 0,disabled:!1,readOnly:!1}}),ae=(e,t)=>{let n=(0,o.useRef)(null);(0,o.useEffect)(()=>{let r=()=>{let i=e.current?.scrollWidth||null;n.current&&i&&i>n.current&&t(),n.current=i,requestAnimationFrame(r)},i=requestAnimationFrame(r);return()=>cancelAnimationFrame(i)},[e])},$=({className:e,children:t,ref:n})=>{let r=A(),c=(0,u.useFormFieldControl)(),d=w(t,`Combobox.LeadingIcon`),f=w(t,`Combobox.SelectedItems`),p=w(t,`Combobox.Input`),m=w(t,`Combobox.ClearButton`),h=w(t,`Combobox.Disclosure`),[g,_]=r.hasPopover?[i.t.Anchor,{asChild:!0,type:void 0}]:[o.Fragment,{}],v=(0,l.useMergeRefs)(n,r.triggerAreaRef),y=(0,o.useRef)(null),b=c.disabled||r.disabled,x=c.readOnly||r.readOnly,S=!!m&&!b&&!x,C=()=>{if(y.current&&!r.wrap){let{scrollWidth:e,clientWidth:t}=y.current;y.current.scrollLeft=e-t}};ae(y,C);let T=!!f;return(0,o.useEffect)(()=>{r.setAreSelectedItemsInTrigger(T)},[T]),(0,o.useEffect)(()=>{let e=new ResizeObserver(C);return y.current&&e.observe(y.current),()=>{e.disconnect()}},[]),(0,s.jsx)(s.Fragment,{children:(0,s.jsx)(g,{..._,children:(0,s.jsxs)(`div`,{ref:v,className:ie({className:e,state:r.state,disabled:b,readOnly:x,allowWrap:r.wrap}),onClick:()=>{!r.isOpen&&!b&&!x&&(r.openMenu(),r.innerInputRef.current&&r.innerInputRef.current.focus())},children:[d,(0,s.jsxs)(`div`,{ref:y,className:(0,a.cx)(`min-w-none gap-sm py-md inline-flex grow items-start`,r.wrap?`flex-wrap`:`u-no-scrollbar overflow-x-auto p-[2px]`),children:[f,p]}),S&&m,h]})})})};$.displayName=`Combobox.Trigger`;var oe=Object.assign(j,{Group:L,Item:U,Items:K,ItemText:q,ItemIndicator:G,Label:J,Popover:X,Trigger:$,LeadingIcon:Y,Empty:P,Input:z,Disclosure:N,SelectedItems:Q,ClearButton:M,Portal:Z});oe.displayName=`Combobox`,L.displayName=`Combobox.Group`,K.displayName=`Combobox.Items`,U.displayName=`Combobox.Item`,q.displayName=`Combobox.ItemText`,G.displayName=`Combobox.ItemIndicator`,J.displayName=`Combobox.Label`,X.displayName=`Combobox.Popover`,$.displayName=`Combobox.Trigger`,Y.displayName=`Combobox.LeadingIcon`,P.displayName=`Combobox.Empty`,z.displayName=`Combobox.Input`,N.displayName=`Combobox.Disclosure`,Q.displayName=`Combobox.SelectedItems`,M.displayName=`Combobox.ClearButton`,Z.displayName=`Combobox.Portal`,exports.Combobox=oe,exports.ComboboxProvider=k,exports.useComboboxContext=A;
1
+ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`../chunk-C91j1N6u.js`);const e=require(`../visually-hidden/index.js`),t=require(`../icon-CRPcdgYp.js`),n=require(`../spinner-DFUoYvmm.js`),r=require(`../icon-button-BhRYDk-N.js`),i=require(`../popover-BIbJW9tD.js`);let a=require(`class-variance-authority`),o=require(`react`),s=require(`react/jsx-runtime`),c=require(`@spark-ui/icons/ArrowHorizontalDown`),l=require(`@spark-ui/hooks/use-merge-refs`),u=require(`@spark-ui/components/form-field`),d=require(`@spark-ui/icons/Check`),f=require(`@spark-ui/hooks/use-combined-state`),p=require(`downshift`),m=require(`@spark-ui/icons/DeleteOutline`);function h(e,t){let n=0;for(let[r]of e.entries()){if(r===t)return n;n++}return-1}var g=(e,t)=>{let n=0;for(let r of e.keys()){if(n===t)return r;n++}},_=(e,t)=>{let n=g(e,t);return n===void 0?void 0:e.get(n)},v=e=>e?e.type.displayName:``,y=(e,t=[])=>(o.Children.forEach(e,e=>{if((0,o.isValidElement)(e)){if(v(e)===`Combobox.Item`){let n=e.props;t.push({value:n.value,disabled:!!n.disabled,text:x(n.children)})}e.props.children&&y(e.props.children,t)}}),t),b=e=>{if(!e)return``;for(let t of o.Children.toArray(e))if((0,o.isValidElement)(t)){let e=t;if(v(e)===`Combobox.ItemText`)return e.props.children;let n=b(e.props.children);if(n)return n}return``},x=e=>typeof e==`string`?e:b(e),S=e=>{let t=new Map;return y(e).forEach(e=>{t.set(e.value,e)}),t},C=(e,t)=>o.Children.toArray(e).some(e=>(0,o.isValidElement)(e)?v(e)===t?!0:e.props.children?C(e.props.children,t):!1:!1),w=(e,t)=>o.Children.toArray(e).filter(o.isValidElement).find(e=>t===v(e)||``),T=({multiselect:e,selectedItems:t,allowCustomValue:n=!1,setSelectedItems:r,triggerAreaRef:i,items:a})=>(o,{changes:s,type:c})=>{let l=i.current?.contains?.(document.activeElement);switch(c){case p.useCombobox.stateChangeTypes.InputClick:return{...s,isOpen:!0};case p.useCombobox.stateChangeTypes.InputKeyDownEnter:case p.useCombobox.stateChangeTypes.ItemClick:{let n={...s};return s.selectedItem!=null&&(n.inputValue=``,n.isOpen=!0,n.highlightedIndex=h(a,s.selectedItem.value),r(e.selectedItems.some(e=>e.value===s.selectedItem?.value)?t.filter(e=>e.value!==s.selectedItem?.value):[...t,s.selectedItem])),n}case p.useCombobox.stateChangeTypes.ToggleButtonClick:return{...s,inputValue:n?s.inputValue:``};case p.useCombobox.stateChangeTypes.InputChange:return{...s,selectedItem:s.highlightedIndex===-1?null:s.selectedItem};case p.useCombobox.stateChangeTypes.InputBlur:return{...s,inputValue:n?s.inputValue:``,isOpen:l};default:return s}},ee=({filteredItems:e,allowCustomValue:t=!1,setSelectedItem:n})=>(r,{changes:i,type:a})=>{let o=e.find(e=>e.text.toLowerCase()===r.inputValue.toLowerCase());switch(a){case p.useCombobox.stateChangeTypes.InputKeyDownEscape:return i.selectedItem||n(null),i;case p.useCombobox.stateChangeTypes.ItemClick:case p.useCombobox.stateChangeTypes.InputKeyDownEnter:return i.selectedItem&&n(i.selectedItem),i;case p.useCombobox.stateChangeTypes.InputClick:return{...i,isOpen:!0};case p.useCombobox.stateChangeTypes.ToggleButtonClick:case p.useCombobox.stateChangeTypes.InputBlur:return t?i:r.inputValue===``?(n(null),{...i,selectedItem:null}):o?(n(o),{...i,selectedItem:o,inputValue:o.text}):r.selectedItem?{...i,inputValue:r.selectedItem.text}:{...i,inputValue:``};default:return i}},E=(0,o.createContext)(null),D=(e,t)=>t?new Map(Array.from(e).filter(([e,{text:n}])=>n.toLowerCase().includes(t.toLowerCase()))):e,O=`:combobox`,k=({children:e,state:t,allowCustomValue:n=!1,filtering:r=`auto`,disabled:a=!1,multiple:c=!1,readOnly:l=!1,wrap:d=!0,value:m,defaultValue:h,onValueChange:g,open:v,defaultOpen:y,onOpenChange:b,isLoading:x})=>{let w=(0,o.useRef)(!1),[k,A]=(0,o.useState)(``),[j,M]=(0,o.useState)(r===`strict`),N=(0,o.useRef)(null),P=(0,o.useRef)(null),[F,te]=(0,o.useState)(null),[I]=(0,f.useCombinedState)(m,h),L=r===`strict`||r===`auto`&&j,[R,z]=(0,o.useState)(S(e)),[B,V]=(0,o.useState)(L?D(R,k):R),[H,U]=(0,o.useState)(R.get(I)||null),[W,ne]=(0,o.useState)(I?[...R.values()].filter(e=>I.includes(e.value)):[]),G=e=>{M(!1),e?.value!==H?.value&&(U(e),setTimeout(()=>{g?.(e?.value)},0))},K=e=>{ne(e),setTimeout(()=>{g?.(e.map(e=>e.value))},0)};(0,o.useEffect)(()=>{if(!w.current){w.current=!0;return}if(c){let e=I.reduce((e,t)=>{let n=R.get(t);return n?[...e,n]:e},[]);ne(I?e:[])}else U(R.get(I)||null)},[c?JSON.stringify(I):I]);let q=(0,u.useFormFieldControl)(),J=`${O}-label-${(0,o.useId)()}`,Y=`${O}-field-${(0,o.useId)()}`,X=q.id||Y,Z=q.labelId||J,re=q.state||t,Q=q.disabled??a,ie=q.readOnly??l,[ae,$]=(0,o.useState)(C(e,`Combobox.Popover`)),[oe,se]=(0,o.useState)(!1),[ce,le]=(0,o.useState)(`mouse`);(0,o.useEffect)(()=>{V(L?D(R,k):R)},[k,R]);let ue=(0,p.useMultipleSelection)({selectedItems:W,stateReducer:(e,{type:t,changes:n})=>{let r=p.useMultipleSelection.stateChangeTypes;switch(t){case r.SelectedItemKeyDownBackspace:case r.SelectedItemKeyDownDelete:{K(n.selectedItems||[]);let i;return i=t===r.SelectedItemKeyDownDelete?e?.activeIndex===n.selectedItems?.length?-1:e.activeIndex:(n?.activeIndex||0)-1>=0?e.activeIndex-1:n?.activeIndex,{...n,activeIndex:i}}case r.SelectedItemClick:return P.current&&P.current.focus(),{...n,activeIndex:-1};case r.FunctionRemoveSelectedItem:return{...n,activeIndex:-1};case r.DropdownKeyDownNavigationPrevious:return fe.closeMenu(),n;default:return n}}}),de=Array.from(B.values());(0,o.useEffect)(()=>{F?.(k||``)},[k]);let fe=(0,p.useCombobox)({inputId:X,items:de,selectedItem:c?void 0:H,id:X,labelId:Z,inputValue:k,onInputValueChange:({inputValue:e})=>{A(e),L&&V(D(R,e||``))},initialIsOpen:y,...v!=null&&{isOpen:v},onIsOpenChange:e=>{e.isOpen!=null&&b?.(e.isOpen)},itemToString:e=>e?.text,isItemDisabled:e=>{let t=!!k&&!de.some(t=>e.value===t.value);return e.disabled||t},stateReducer:c?T({multiselect:ue,selectedItems:W,allowCustomValue:n,setSelectedItems:K,triggerAreaRef:N,items:R}):ee({allowCustomValue:n,setSelectedItem:G,filteredItems:[...B.values()]}),scrollIntoView:e=>{e&&e.scrollIntoView({block:`nearest`})}});(0,o.useEffect)(()=>{let t=S(e),n=[...R.values()],r=[...t.values()];(n.length!==r.length||n.some((e,t)=>{let n=e.value!==r[t]?.value,i=e.text!==r[t]?.text;return n||i}))&&z(t)},[e]);let[pe,me]=ae?[i.t,{open:!0}]:[o.Fragment,{}];return(0,s.jsx)(E,{value:{itemsMap:R,filteredItemsMap:B,highlightedItem:_(B,fe.highlightedIndex),multiple:c,disabled:Q,readOnly:ie,areSelectedItemsInTrigger:oe,setAreSelectedItemsInTrigger:se,hasPopover:ae,setHasPopover:$,state:re,lastInteractionType:ce,setLastInteractionType:le,wrap:d,innerInputRef:P,triggerAreaRef:N,...fe,...ue,setInputValue:A,selectItem:G,setSelectedItems:K,isLoading:x,setOnInputValueChange:te,isTyping:j,setIsTyping:M},children:(0,s.jsx)(pe,{...me,children:e})})},A=()=>{let e=(0,o.useContext)(E);if(!e)throw Error(`useComboboxContext must be used within a Combobox provider`);return e},j=({children:e,...t})=>(0,s.jsx)(k,{...t,children:e});j.displayName=`Combobox`;var M=({className:e,tabIndex:n=-1,onClick:r,ref:i,...o})=>{let c=A();return(0,s.jsx)(`button`,{ref:i,className:(0,a.cx)(e,`h-sz-44 text-neutral hover:text-neutral-hovered`),tabIndex:n,onClick:e=>{e.stopPropagation(),c.multiple?c.setSelectedItems([]):c.selectItem(null),c.setInputValue(``),c.innerInputRef.current&&c.innerInputRef.current.focus(),r&&r(e)},type:`button`,...o,children:(0,s.jsx)(t.t,{size:`sm`,children:(0,s.jsx)(m.DeleteOutline,{})})})};M.displayName=`Combobox.ClearButton`;var N=({className:e,closedLabel:n,openedLabel:i,intent:o=`neutral`,design:u=`ghost`,size:d=`sm`,ref:f,...p})=>{let m=A(),{ref:h,...g}=m.getToggleButtonProps({disabled:m.disabled||m.readOnly,onClick:e=>{e.stopPropagation()}}),_=g[`aria-expanded`];return(0,s.jsx)(r.t,{ref:(0,l.useMergeRefs)(f,h),className:(0,a.cx)(e,`ml-sm mt-[calc((44px-32px)/2)]`),intent:o,design:u,size:d,...g,...p,"aria-label":_?i:n,disabled:m.disabled,children:(0,s.jsx)(t.t,{className:(0,a.cx)(`shrink-0`,`rotate-0 transition duration-100 ease-in`,{"rotate-180":_}),size:`sm`,children:(0,s.jsx)(c.ArrowHorizontalDown,{})})})};N.displayName=`Combobox.Disclosure`;var P=({className:e,children:t,ref:n})=>A().filteredItemsMap.size===0?(0,s.jsx)(`div`,{ref:n,className:(0,a.cx)(`px-lg py-md text-body-1 text-on-surface/dim-1`,e),children:t}):null;P.displayName=`Combobox.Empty`;var F=(0,o.createContext)(null),te=({children:e})=>(0,s.jsx)(F,{value:{groupLabelId:`${O}-group-label-${(0,o.useId)()}`},children:e}),I=()=>{let e=(0,o.useContext)(F);if(!e)throw Error(`useComboboxGroupContext must be used within a ComboboxGroup provider`);return e},L=({children:e,ref:t,...n})=>(0,s.jsx)(te,{children:(0,s.jsx)(R,{ref:t,...n,children:e})}),R=({children:e,className:t,ref:n})=>{let r=A(),i=I();return o.Children.toArray(e).some(e=>(0,o.isValidElement)(e)&&r.filteredItemsMap.get(e.props.value))?(0,s.jsx)(`div`,{ref:n,role:`group`,"aria-labelledby":i.groupLabelId,className:(0,a.cx)(t),children:e}):null};L.displayName=`Combobox.Group`;var z=({"aria-label":t,className:n,placeholder:r,value:c,defaultValue:d,onValueChange:p,ref:m,...h})=>{let g=A(),_=(0,u.useFormFieldControl)(),[v]=(0,f.useCombinedState)(c,d),{isInvalid:y,description:b}=_;(0,o.useEffect)(()=>{v!=null&&g.setInputValue(v)},[v]),(0,o.useEffect)(()=>{p&&g.setOnInputValueChange(()=>p),!g.multiple&&g.selectedItem&&g.setInputValue(g.selectedItem.text)},[]);let x=g.hasPopover?i.t.Trigger:o.Fragment,S=g.hasPopover?{asChild:!0,type:void 0}:{},C=g.getDropdownProps(),w=(0,l.useMergeRefs)(m,g.innerInputRef,C.ref),T=g.getInputProps({disabled:g.disabled||g.readOnly,...C,onKeyDown:e=>{C.onKeyDown?.(e),g.setLastInteractionType(`keyboard`),g.setIsTyping(!0)},onChange:e=>{g.setInputValue(e.target.value)},ref:w}),ee=g.multiple?!g.areSelectedItemsInTrigger||g.selectedItems.length===0:g.selectedItem===null;function E(e,t){return n=>{e?.(n),t?.(n)}}let D={onBlur:E(h.onBlur,T.onBlur),onChange:E(h.onChange,T.onChange),onClick:E(h.onClick,T.onClick),onKeyDown:E(h.onKeyDown,T.onKeyDown)};return(0,s.jsxs)(s.Fragment,{children:[t&&(0,s.jsx)(e.VisuallyHidden,{children:(0,s.jsx)(`label`,{...g.getLabelProps(),children:t})}),(0,s.jsx)(x,{...S,children:(0,s.jsx)(`input`,{"data-spark-component":`combobox-input`,type:`text`,...ee&&{placeholder:r},className:(0,a.cx)(`max-w-full shrink-0 grow basis-[80px]`,`h-sz-28 bg-surface px-sm text-body-1 text-ellipsis outline-hidden`,`disabled:text-on-surface/dim-3 disabled:cursor-not-allowed disabled:bg-transparent`,`read-only:text-on-surface read-only:cursor-default read-only:bg-transparent`,n),...h,...T,...D,value:g.inputValue,"aria-label":t,disabled:g.disabled,readOnly:g.readOnly,"aria-invalid":y,"aria-describedby":b})})]})};z.displayName=`Combobox.Input`;var B=(0,o.createContext)(null),V=({value:e,disabled:t=!1,children:n})=>{let r=A(),[i,a]=(0,o.useState)(void 0),c=h(r.filteredItemsMap,e),l={disabled:t,value:e,text:x(n)};return(0,s.jsx)(B,{value:{textId:i,setTextId:a,isSelected:r.multiple?r.selectedItems.some(t=>t.value===e):r.selectedItem?.value===e,itemData:l,index:c,disabled:t},children:n})},H=()=>{let e=(0,o.useContext)(B);if(!e)throw Error(`useComboboxItemContext must be used within a ComboboxItem provider`);return e},U=({children:e,ref:t,...n})=>{let{value:r,disabled:i}=n;return(0,s.jsx)(V,{value:r,disabled:i,children:(0,s.jsx)(ne,{ref:t,...n,children:e})})},W=(0,a.cva)(`px-lg py-md text-body-1`,{variants:{selected:{true:`font-bold`},disabled:{true:`opacity-dim-3 cursor-not-allowed`,false:`cursor-pointer`},highlighted:{true:``},interactionType:{mouse:``,keyboard:``}},compoundVariants:[{highlighted:!0,interactionType:`mouse`,class:`bg-surface-hovered`},{highlighted:!0,interactionType:`keyboard`,class:`u-outline`}]}),ne=({className:e,disabled:t=!1,value:n,children:r,ref:i,...o})=>{let c=A(),u=H(),d=!!c.filteredItemsMap.get(n),{ref:f,...p}=c.getItemProps({item:u.itemData,index:u.index}),m=(0,l.useMergeRefs)(i,f);return d?(0,s.jsx)(`li`,{ref:m,className:(0,a.cx)(W({selected:u.isSelected,disabled:t,highlighted:c.highlightedItem?.value===n,interactionType:c.lastInteractionType,className:e})),...p,...o,"aria-selected":u.isSelected,"aria-labelledby":u.textId,children:r},n):null};U.displayName=`Combobox.Item`;var G=({className:e,children:n,label:r,ref:i})=>{let{disabled:o,isSelected:c}=H(),l=n||(0,s.jsx)(t.t,{size:`sm`,children:(0,s.jsx)(d.Check,{"aria-label":r})});return(0,s.jsx)(`span`,{ref:i,className:(0,a.cx)(`min-h-sz-16 min-w-sz-16 flex`,o&&`opacity-dim-3`,e),children:c&&l})};G.displayName=`Combobox.ItemIndicator`;var K=({children:e,className:t,ref:r,...i})=>{let c=A(),{ref:u,...d}=c.getMenuProps({onMouseMove:()=>{c.setLastInteractionType(`mouse`)}}),f=(0,o.useRef)(null),p=(0,l.useMergeRefs)(r,u,f),m=c.hasPopover?c.isOpen:!0,h=c.hasPopover&&!m;return(0,o.useLayoutEffect)(()=>{f.current?.parentElement&&(f.current.parentElement.style.pointerEvents=h?`none`:``,f.current.style.pointerEvents=h?`none`:``)},[h]),(0,s.jsx)(`ul`,{ref:p,className:(0,a.cx)(t,`flex flex-col`,m?`block`:`pointer-events-none invisible opacity-0`,c.hasPopover&&`p-lg`,c.isLoading&&`items-center overflow-y-auto`),...i,...d,"aria-busy":c.isLoading,"data-spark-component":`combobox-items`,children:c.isLoading?(0,s.jsx)(n.t,{size:`sm`}):e})};K.displayName=`Combobox.Items`;var q=({children:e,className:t,ref:n})=>{let r=`${O}-item-text-${(0,o.useId)()}`,{setTextId:i}=H();return(0,o.useEffect)(()=>(i(r),()=>i(void 0))),(0,s.jsx)(`span`,{id:r,className:(0,a.cx)(`inline`,t),ref:n,children:e})};q.displayName=`Combobox.ItemText`;var J=({children:e,className:t,ref:n})=>(0,s.jsx)(`div`,{ref:n,id:I().groupLabelId,className:(0,a.cx)(`px-md py-sm text-body-2 text-neutral italic`,t),children:e});J.displayName=`Combobox.Label`;var Y=({children:e})=>(0,s.jsx)(t.t,{size:`sm`,className:`h-sz-44 shrink-0`,children:e});Y.displayName=`Combobox.LeadingIcon`;var X=({children:e,matchTriggerWidth:t=!0,sideOffset:n=4,className:r,ref:c,...l})=>{let u=A();return(0,o.useEffect)(()=>(u.setHasPopover(!0),()=>u.setHasPopover(!1)),[]),(0,s.jsx)(i.t.Content,{ref:c,inset:!0,asChild:!0,matchTriggerWidth:t,className:(0,a.cx)(`z-dropdown! relative`,r),sideOffset:n,onOpenAutoFocus:e=>{e.preventDefault()},...l,"data-spark-component":`combobox-popover`,children:e})};X.displayName=`Combobox.Popover`;var Z=({children:e,...t})=>(0,s.jsx)(i.t.Portal,{...t,children:e});Z.displayName=`Combobox.Portal`;var re=({item:e,index:n})=>{let r=A(),i=!r.disabled&&!r.readOnly,o=e=>{let t=e.target;r.lastInteractionType===`keyboard`&&t.scrollIntoView({behavior:`smooth`,block:`nearest`,inline:`nearest`})},{disabled:c,...l}=r.getSelectedItemProps({disabled:r.disabled||r.readOnly,selectedItem:e,index:n});return(0,s.jsxs)(c?`button`:`span`,{role:`presentation`,"data-spark-component":`combobox-selected-item`,className:(0,a.cx)(`h-sz-28 bg-neutral-container flex items-center rounded-md align-middle`,`text-body-2 text-on-neutral-container`,`disabled:opacity-dim-3 disabled:cursor-not-allowed`,`focus-visible:u-outline-inset outline-hidden`,{"px-md":!i,"pl-md":i}),...l,tabIndex:-1,...c&&{disabled:!0},onFocus:o,children:[(0,s.jsx)(`span`,{className:(0,a.cx)(`line-clamp-1 overflow-x-hidden leading-normal break-all text-ellipsis`,{"w-max":!r.wrap}),children:e.text}),r.disabled,i&&(0,s.jsx)(`button`,{type:`button`,tabIndex:-1,"aria-hidden":!0,className:`px-md h-full cursor-pointer`,onClick:t=>{t.stopPropagation();let n=r.selectedItems.filter(t=>t.value!==e.value);r.setSelectedItems(n),r.innerInputRef.current&&r.innerInputRef.current.focus({preventScroll:!0})},children:(0,s.jsx)(t.t,{size:`sm`,children:(0,s.jsx)(m.DeleteOutline,{})})})]},`selected-item-${n}`)},Q=()=>{let e=A();return e.multiple&&e.selectedItems.length?(0,s.jsx)(s.Fragment,{children:e.selectedItems.map((e,t)=>(0,s.jsx)(re,{item:e,index:t},e.value))}):null};Q.displayName=`Combobox.SelectedItems`;var ie=(0,a.cva)([`flex items-start gap-md min-h-sz-44 text-body-1`,`h-fit rounded-input px-lg`,`ring-1 outline-hidden ring-inset focus-within:ring-2 focus-within:ring-focus`],{variants:{allowWrap:{true:``,false:`h-sz-44`},state:{undefined:`ring-outline`,error:`ring-error`,alert:`ring-alert`,success:`ring-success`},disabled:{true:`cursor-not-allowed border-outline bg-on-surface/dim-5 text-on-surface/dim-3`},readOnly:{true:`cursor-default bg-on-surface/dim-5 text-on-surface`}},compoundVariants:[{disabled:!1,state:void 0,class:`default:hover:ring-outline-high`},{disabled:!1,readOnly:!1,class:`bg-surface text-on-surface cursor-text`}],defaultVariants:{state:void 0,disabled:!1,readOnly:!1}}),ae=(e,t)=>{let n=(0,o.useRef)(null);(0,o.useEffect)(()=>{let r=()=>{let i=e.current?.scrollWidth||null;n.current&&i&&i>n.current&&t(),n.current=i,requestAnimationFrame(r)},i=requestAnimationFrame(r);return()=>cancelAnimationFrame(i)},[e])},$=({className:e,children:t,ref:n})=>{let r=A(),c=(0,u.useFormFieldControl)(),d=w(t,`Combobox.LeadingIcon`),f=w(t,`Combobox.SelectedItems`),p=w(t,`Combobox.Input`),m=w(t,`Combobox.ClearButton`),h=w(t,`Combobox.Disclosure`),[g,_]=r.hasPopover?[i.t.Anchor,{asChild:!0,type:void 0}]:[o.Fragment,{}],v=(0,l.useMergeRefs)(n,r.triggerAreaRef),y=(0,o.useRef)(null),b=c.disabled||r.disabled,x=c.readOnly||r.readOnly,S=!!m&&!b&&!x,C=()=>{if(y.current&&!r.wrap){let{scrollWidth:e,clientWidth:t}=y.current;y.current.scrollLeft=e-t}};ae(y,C);let T=!!f;return(0,o.useEffect)(()=>{r.setAreSelectedItemsInTrigger(T)},[T]),(0,o.useEffect)(()=>{let e=new ResizeObserver(C);return y.current&&e.observe(y.current),()=>{e.disconnect()}},[]),(0,s.jsx)(s.Fragment,{children:(0,s.jsx)(g,{..._,children:(0,s.jsxs)(`div`,{ref:v,className:ie({className:e,state:r.state,disabled:b,readOnly:x,allowWrap:r.wrap}),onClick:()=>{!r.isOpen&&!b&&!x&&(r.openMenu(),r.innerInputRef.current&&r.innerInputRef.current.focus())},children:[d,(0,s.jsxs)(`div`,{ref:y,className:(0,a.cx)(`min-w-none gap-sm py-md inline-flex grow items-start`,r.wrap?`flex-wrap`:`u-no-scrollbar overflow-x-auto p-[2px]`),children:[f,p]}),S&&m,h]})})})};$.displayName=`Combobox.Trigger`;var oe=Object.assign(j,{Group:L,Item:U,Items:K,ItemText:q,ItemIndicator:G,Label:J,Popover:X,Trigger:$,LeadingIcon:Y,Empty:P,Input:z,Disclosure:N,SelectedItems:Q,ClearButton:M,Portal:Z});oe.displayName=`Combobox`,L.displayName=`Combobox.Group`,K.displayName=`Combobox.Items`,U.displayName=`Combobox.Item`,q.displayName=`Combobox.ItemText`,G.displayName=`Combobox.ItemIndicator`,J.displayName=`Combobox.Label`,X.displayName=`Combobox.Popover`,$.displayName=`Combobox.Trigger`,Y.displayName=`Combobox.LeadingIcon`,P.displayName=`Combobox.Empty`,z.displayName=`Combobox.Input`,N.displayName=`Combobox.Disclosure`,Q.displayName=`Combobox.SelectedItems`,M.displayName=`Combobox.ClearButton`,Z.displayName=`Combobox.Portal`,exports.Combobox=oe,exports.ComboboxProvider=k,exports.useComboboxContext=A;
2
2
  //# sourceMappingURL=index.js.map
package/dist/combobox/index.mjs CHANGED
@@ -1,8 +1,8 @@
1
1
  import { VisuallyHidden as e } from "../visually-hidden/index.mjs";
2
2
  import { t } from "../icon-D05Uqh8_.mjs";
3
3
  import { t as n } from "../spinner-DULLiM6a.mjs";
4
- import { t as r } from "../icon-button-BLG7VjR7.mjs";
5
- import { t as i } from "../popover-Ds6xXjgT.mjs";
4
+ import { t as r } from "../icon-button-Mq9ENaLm.mjs";
5
+ import { t as i } from "../popover-D3xDdjH2.mjs";
6
6
  import { cva as a, cx as o } from "class-variance-authority";
7
7
  import { Children as s, Fragment as c, createContext as l, isValidElement as u, useContext as d, useEffect as f, useId as p, useLayoutEffect as m, useRef as h, useState as g } from "react";
8
8
  import { Fragment as _, jsx as v, jsxs as y } from "react/jsx-runtime";
package/dist/dialog/index.js CHANGED
@@ -1,2 +1,2 @@
1
- Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`../chunk-C91j1N6u.js`);const e=require(`../icon-CRPcdgYp.js`),t=require(`../DialogContent.styles-CAhJtUud.js`),n=require(`../icon-button-Iv9kq84M.js`),r=require(`../useRenderSlot-C4UVWhDN.js`);let i=require(`class-variance-authority`),a=require(`react`),o=require(`react/jsx-runtime`),s=require(`@spark-ui/hooks/use-merge-refs`),c=require(`@spark-ui/hooks/use-scroll-overflow`),l=require(`@spark-ui/icons/Close`),u=require(`@base-ui/react/dialog`);var d=(0,a.createContext)(null),f=({children:e,withFade:t=!1})=>{let[n,r]=(0,a.useState)(!1);return(0,o.jsx)(d,{value:{isFullScreen:n,setIsFullScreen:r,withFade:t},children:e})},p=()=>{let e=(0,a.useContext)(d);if(!e)throw Error(`useDialog must be used within a Dialog provider`);return e},m=({withFade:e=!1,onOpenChange:t,...n})=>{let r=t?(e,n)=>{t(e)}:void 0;return(0,o.jsx)(f,{withFade:e,children:(0,o.jsx)(u.Dialog.Root,{"data-spark-component":`dialog`,onOpenChange:r,...n})})};m.createHandle=u.Dialog.createHandle,m.displayName=`Dialog.Root`;var h=({children:e,className:t,inset:n=!1,ref:r,...l})=>{let u=(0,a.useRef)(null),d=(0,s.useMergeRefs)(r,u),{withFade:f}=p(),{overflow:m}=(0,c.useScrollOverflow)(u);return(0,o.jsx)(`div`,{"data-spark-component":`dialog-body`,ref:d,className:(0,i.cx)(`focus-visible:u-outline relative grow overflow-y-auto outline-hidden`,`transition-all duration-300`,{"px-xl py-lg":!n},t),style:{...f&&{maskImage:`linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1) 44px, rgba(0, 0, 0, 1) calc(100% - 44px), rgba(0, 0, 0, 0))`,maskSize:`100% calc(100% + ${m.top?`0px`:`44px`} + ${m.bottom?`0px`:`44px`})`,maskPosition:`0 ${m.top?`0px`:`-44px`}`}},...l,children:e})};h.displayName=`Dialog.Body`;var g=({asChild:e=!1,...t})=>{let n=r.t(e,`button`);return(0,o.jsx)(u.Dialog.Close,{"data-spark-component":`dialog-close`,render:n,...t})},_=({"aria-label":t,className:r,size:a=`md`,intent:s=`neutral`,design:c=`ghost`,children:u=(0,o.jsx)(l.Close,{}),ref:d,...f})=>(0,o.jsx)(g,{"data-spark-component":`dialog-close-button`,"data-part":`close`,ref:d,className:(0,i.cx)([`absolute`,`top-md`,`right-xl`],r),asChild:!0,...f,children:(0,o.jsx)(n.t,{intent:s,size:a,design:c,"aria-label":t,children:(0,o.jsx)(e.t,{children:u})})}),v=Object.assign(_,{id:`CloseButton`});_.displayName=`Dialog.CloseButton`;var y=({className:e,isNarrow:n=!1,size:r=`md`,ref:s,...c})=>{let{setIsFullScreen:l}=p();return(0,a.useEffect)(()=>(r===`fullscreen`&&l(!0),()=>l(!1)),[l,r]),(0,o.jsx)(u.Dialog.Popup,{ref:s,"data-spark-component":`dialog-content`,role:`dialog`,className:a=>(0,i.cx)(t.t({isNarrow:n,size:r,className:typeof e==`function`?e(a):e})),...c})};y.displayName=`Dialog.Content`;var b=e=>(0,o.jsx)(u.Dialog.Description,{"data-spark-component":`dialog-description`,...e});b.displayName=`Dialog.Description`;var x=({children:e,className:t,ref:n,...r})=>(0,o.jsx)(`footer`,{"data-spark-component":`dialog-footer`,ref:n,className:(0,i.cx)(t,[`px-xl`,`py-lg`]),...r,children:e});x.displayName=`Dialog.Footer`;var S=({children:e,className:t,ref:n,...r})=>(0,o.jsx)(`header`,{"data-spark-component":`dialog-header`,ref:n,className:(0,i.cx)(t,[`px-xl`,`py-lg`]),...r,children:e});S.displayName=`Dialog.Header`;var C=({className:e,...t})=>(0,o.jsx)(u.Dialog.Backdrop,{"data-spark-component":`dialog-overlay`,className:t=>(0,i.cx)(`z-overlay size-screen fixed inset-0`,`bg-overlay/dim-1`,`data-starting-style:animate-fade-in`,`data-ending-style:animate-fade-out`,typeof e==`function`?e(t):e),...t});C.displayName=`Dialog.Overlay`;var w=({className:e,...t})=>(0,o.jsx)(u.Dialog.Portal,{"data-spark-component":`dialog-portal`,className:(0,i.cx)(e,`z-modal absolute`),...t});w.displayName=`Dialog.Portal`;var T=({className:e,ref:t,...n})=>(0,o.jsx)(u.Dialog.Title,{"data-spark-component":`dialog-title`,ref:t,className:(0,i.cx)(`text-headline-1 text-on-surface`,`group-has-data-[part=close]:pr-3xl`,e),...n});T.displayName=`Dialog.Title`;var E=({asChild:e=!1,...t})=>{let n=r.t(e,`button`);return(0,o.jsx)(u.Dialog.Trigger,{"data-spark-component":`dialog-trigger`,render:n,...t})};E.displayName=`Dialog.Trigger`;var D=Object.assign(m,{Trigger:E,Portal:w,Overlay:C,Content:y,Header:S,Body:h,Footer:x,Close:g,CloseButton:v,Title:T,Description:b});D.displayName=`Dialog`,exports.Dialog=D;
1
+ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`../chunk-C91j1N6u.js`);const e=require(`../icon-CRPcdgYp.js`),t=require(`../DialogContent.styles-CAhJtUud.js`),n=require(`../icon-button-BhRYDk-N.js`),r=require(`../useRenderSlot-C4UVWhDN.js`);let i=require(`class-variance-authority`),a=require(`react`),o=require(`react/jsx-runtime`),s=require(`@spark-ui/hooks/use-merge-refs`),c=require(`@spark-ui/hooks/use-scroll-overflow`),l=require(`@spark-ui/icons/Close`),u=require(`@base-ui/react/dialog`);var d=(0,a.createContext)(null),f=({children:e,withFade:t=!1})=>{let[n,r]=(0,a.useState)(!1);return(0,o.jsx)(d,{value:{isFullScreen:n,setIsFullScreen:r,withFade:t},children:e})},p=()=>{let e=(0,a.useContext)(d);if(!e)throw Error(`useDialog must be used within a Dialog provider`);return e},m=({withFade:e=!1,onOpenChange:t,...n})=>{let r=t?(e,n)=>{t(e)}:void 0;return(0,o.jsx)(f,{withFade:e,children:(0,o.jsx)(u.Dialog.Root,{"data-spark-component":`dialog`,onOpenChange:r,...n})})};m.createHandle=u.Dialog.createHandle,m.displayName=`Dialog.Root`;var h=({children:e,className:t,inset:n=!1,ref:r,...l})=>{let u=(0,a.useRef)(null),d=(0,s.useMergeRefs)(r,u),{withFade:f}=p(),{overflow:m}=(0,c.useScrollOverflow)(u);return(0,o.jsx)(`div`,{"data-spark-component":`dialog-body`,ref:d,className:(0,i.cx)(`focus-visible:u-outline relative grow overflow-y-auto outline-hidden`,`transition-all duration-300`,{"px-xl py-lg":!n},t),style:{...f&&{maskImage:`linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1) 44px, rgba(0, 0, 0, 1) calc(100% - 44px), rgba(0, 0, 0, 0))`,maskSize:`100% calc(100% + ${m.top?`0px`:`44px`} + ${m.bottom?`0px`:`44px`})`,maskPosition:`0 ${m.top?`0px`:`-44px`}`}},...l,children:e})};h.displayName=`Dialog.Body`;var g=({asChild:e=!1,...t})=>{let n=r.t(e,`button`);return(0,o.jsx)(u.Dialog.Close,{"data-spark-component":`dialog-close`,render:n,...t})},_=({"aria-label":t,className:r,size:a=`md`,intent:s=`neutral`,design:c=`ghost`,children:u=(0,o.jsx)(l.Close,{}),ref:d,...f})=>(0,o.jsx)(g,{"data-spark-component":`dialog-close-button`,"data-part":`close`,ref:d,className:(0,i.cx)([`absolute`,`top-md`,`right-xl`],r),asChild:!0,...f,children:(0,o.jsx)(n.t,{intent:s,size:a,design:c,"aria-label":t,children:(0,o.jsx)(e.t,{children:u})})}),v=Object.assign(_,{id:`CloseButton`});_.displayName=`Dialog.CloseButton`;var y=({className:e,isNarrow:n=!1,size:r=`md`,ref:s,...c})=>{let{setIsFullScreen:l}=p();return(0,a.useEffect)(()=>(r===`fullscreen`&&l(!0),()=>l(!1)),[l,r]),(0,o.jsx)(u.Dialog.Popup,{ref:s,"data-spark-component":`dialog-content`,role:`dialog`,className:a=>(0,i.cx)(t.t({isNarrow:n,size:r,className:typeof e==`function`?e(a):e})),...c})};y.displayName=`Dialog.Content`;var b=e=>(0,o.jsx)(u.Dialog.Description,{"data-spark-component":`dialog-description`,...e});b.displayName=`Dialog.Description`;var x=({children:e,className:t,ref:n,...r})=>(0,o.jsx)(`footer`,{"data-spark-component":`dialog-footer`,ref:n,className:(0,i.cx)(t,[`px-xl`,`py-lg`]),...r,children:e});x.displayName=`Dialog.Footer`;var S=({children:e,className:t,ref:n,...r})=>(0,o.jsx)(`header`,{"data-spark-component":`dialog-header`,ref:n,className:(0,i.cx)(t,[`px-xl`,`py-lg`]),...r,children:e});S.displayName=`Dialog.Header`;var C=({className:e,...t})=>(0,o.jsx)(u.Dialog.Backdrop,{"data-spark-component":`dialog-overlay`,className:t=>(0,i.cx)(`z-overlay size-screen fixed inset-0`,`bg-overlay/dim-1`,`data-starting-style:animate-fade-in`,`data-ending-style:animate-fade-out`,typeof e==`function`?e(t):e),...t});C.displayName=`Dialog.Overlay`;var w=({className:e,...t})=>(0,o.jsx)(u.Dialog.Portal,{"data-spark-component":`dialog-portal`,className:(0,i.cx)(e,`z-modal absolute`),...t});w.displayName=`Dialog.Portal`;var T=({className:e,ref:t,...n})=>(0,o.jsx)(u.Dialog.Title,{"data-spark-component":`dialog-title`,ref:t,className:(0,i.cx)(`text-headline-1 text-on-surface`,`group-has-data-[part=close]:pr-3xl`,e),...n});T.displayName=`Dialog.Title`;var E=({asChild:e=!1,...t})=>{let n=r.t(e,`button`);return(0,o.jsx)(u.Dialog.Trigger,{"data-spark-component":`dialog-trigger`,render:n,...t})};E.displayName=`Dialog.Trigger`;var D=Object.assign(m,{Trigger:E,Portal:w,Overlay:C,Content:y,Header:S,Body:h,Footer:x,Close:g,CloseButton:v,Title:T,Description:b});D.displayName=`Dialog`,exports.Dialog=D;
2
2
  //# sourceMappingURL=index.js.map
package/dist/dialog/index.mjs CHANGED
@@ -1,6 +1,6 @@
1
1
  import { t as e } from "../icon-D05Uqh8_.mjs";
2
2
  import { t } from "../DialogContent.styles-BSxCCi-u.mjs";
3
- import { t as n } from "../icon-button-BLG7VjR7.mjs";
3
+ import { t as n } from "../icon-button-Mq9ENaLm.mjs";
4
4
  import { t as r } from "../useRenderSlot-DKIwoqpO.mjs";
5
5
  import { cx as i } from "class-variance-authority";
6
6
  import { createContext as a, useContext as o, useEffect as s, useRef as c, useState as l } from "react";
package/dist/drawer/index.js CHANGED
@@ -1,2 +1,2 @@
1
- Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`../chunk-C91j1N6u.js`);const e=require(`../icon-CRPcdgYp.js`),t=require(`../icon-button-Iv9kq84M.js`),n=require(`../useRenderSlot-C4UVWhDN.js`);let r=require(`class-variance-authority`),i=require(`react`),a=require(`react/jsx-runtime`),o=require(`@spark-ui/hooks/use-merge-refs`),s=require(`@spark-ui/hooks/use-scroll-overflow`),c=require(`@spark-ui/icons/Close`),l=require(`@base-ui/react/dialog`);var u=(0,i.createContext)(null),d=({children:e,withFade:t=!1})=>(0,a.jsx)(u,{value:{withFade:t},children:e}),f=()=>{let e=(0,i.useContext)(u);if(!e)throw Error(`useDrawer must be used within a Drawer provider`);return e},p=({onOpenChange:e,withFade:t=!1,...n})=>{let r=e?(t,n)=>{e(t)}:void 0;return(0,a.jsx)(d,{withFade:t,children:(0,a.jsx)(l.Dialog.Root,{"data-spark-component":`drawer`,onOpenChange:r,...n})})};p.displayName=`Drawer.Root`;var m=(0,r.cva)([`grow`,`overflow-y-auto`,`outline-hidden`,`focus-visible:u-outline`],{variants:{inset:{true:``,false:`px-xl py-lg`}},defaultVariants:{inset:!1}}),h=({children:e,inset:t=!1,className:n,ref:r,...c})=>{let l=(0,i.useRef)(null),u=(0,o.useMergeRefs)(r,l),{withFade:d}=f(),{overflow:p}=(0,s.useScrollOverflow)(l);return(0,a.jsx)(`div`,{"data-spark-component":`drawer-body`,ref:u,className:m({inset:t,className:n}),style:{...d&&{maskImage:`linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1) 44px, rgba(0, 0, 0, 1) calc(100% - 44px), rgba(0, 0, 0, 0))`,maskSize:`100% calc(100% + ${p.top?`0px`:`44px`} + ${p.bottom?`0px`:`44px`})`,maskPosition:`0 ${p.top?`0px`:`-44px`}`}},...c,children:e})};h.displayName=`Drawer.Body`;var g=({asChild:e=!1,...t})=>{let r=n.t(e,`button`);return(0,a.jsx)(l.Dialog.Close,{"data-spark-component":`drawer-close`,render:r,...t})};g.displayName=`Drawer.Close`;var _=({"aria-label":n,className:i,size:o=`md`,intent:s=`neutral`,design:l=`ghost`,children:u=(0,a.jsx)(c.Close,{}),ref:d,...f})=>(0,a.jsx)(g,{"data-spark-component":`drawer-close-button`,ref:d,className:(0,r.cx)([`absolute`,`top-sm`,`right-xl`],i),asChild:!0,...f,children:(0,a.jsx)(t.t,{intent:s,size:o,design:l,"aria-label":n,children:(0,a.jsx)(e.t,{children:u})})});_.displayName=`Drawer.CloseButton`;var v=(0,r.cva)([`fixed z-modal flex flex-col bg-surface shadow-md`,`data-open:animation-duration-400 data-closed:animation-duration-200`,`data-nested-dialog-open:after:pointer-events-none`,`after:bg-transparent`,`after:transition-all`,`after:duration-200`,`data-nested-dialog-open:after:inset-0`,`data-nested-dialog-open:after:absolute`,`data-nested-dialog-open:after:rounded-[inherit]`,`data-nested-dialog-open:after:bg-overlay/dim-3`],{variants:{size:{sm:``,md:``,lg:``,fluid:``,fullscreen:`h-screen w-screen`},side:{right:[`inset-y-0 right-0`,`data-open:animate-slide-in-right `,`data-closed:animate-slide-out-right`],left:[`inset-y-0 left-0`,`data-open:animate-slide-in-left`,`data-closed:animate-slide-out-left`],top:[`top-0 left-0`,`w-screen`,`data-open:animate-slide-in-top`,`data-closed:animate-slide-out-top`],bottom:[`bottom-0 left-0`,`w-screen`,`data-open:animate-slide-in-bottom`,`data-closed:animate-slide-out-bottom`]}},compoundVariants:[{side:[`right`,`left`],size:`sm`,class:[`w-sz-480`,`max-w-full`]},{side:[`right`,`left`],size:`md`,class:[`w-sz-672`,`max-w-full`]},{side:[`right`,`left`],size:`lg`,class:[`w-sz-864`,`max-w-full`]},{side:[`left`,`right`],size:`fluid`,class:[`w-auto`,`max-w-full`]},{side:[`top`,`bottom`],size:`sm`,class:[`h-sz-480`,`max-h-full`]},{side:[`top`,`bottom`],size:`md`,class:[`h-sz-672`,`max-h-full`]},{side:[`top`,`bottom`],size:`lg`,class:[`h-sz-864`,`max-h-full`]},{side:[`top`,`bottom`],size:`fluid`,class:[`h-auto`,`max-h-full`]}],defaultVariants:{side:`right`,size:`md`}}),y=({className:e,size:t=`md`,side:n=`right`,ref:i,...o})=>(0,a.jsx)(l.Dialog.Popup,{ref:i,"data-spark-component":`drawer-content`,role:`dialog`,className:i=>(0,r.cx)(v({size:t,side:n,className:typeof e==`function`?e(i):e})),...o});y.displayName=`Drawer.Content`;var b=e=>(0,a.jsx)(l.Dialog.Description,{"data-spark-component":`drawer-description`,...e});b.displayName=`Drawer.Description`;var x=({className:e,ref:t,...n})=>(0,a.jsx)(`footer`,{"data-spark-component":`drawer-footer`,ref:t,className:(0,r.cx)([`px-xl`,`py-lg`],e),...n});x.displayName=`Drawer.Footer`;var S=({children:e,className:t,ref:n,...i})=>(0,a.jsx)(`header`,{"data-spark-component":`drawer-header`,ref:n,className:(0,r.cx)([`px-xl`,`py-lg`],t),...i,children:e});S.displayName=`Dialog.Header`;var C=({className:e,...t})=>(0,a.jsx)(l.Dialog.Backdrop,{"data-spark-component":`drawer-overlay`,className:t=>(0,r.cx)(`z-overlay fixed top-0 left-0 h-screen w-screen`,`bg-overlay/dim-1`,`data-starting-style:animate-fade-in`,`data-ending-style:animate-fade-out`,typeof e==`function`?e(t):e),...t});C.displayName=`Drawer.Overlay`;var w=({className:e,...t})=>(0,a.jsx)(l.Dialog.Portal,{"data-spark-component":`drawer-portal`,className:(0,r.cx)(e,`z-modal absolute`),...t});w.displayName=`Drawer.Portal`;var T=({className:e,...t})=>(0,a.jsx)(l.Dialog.Title,{"data-spark-component":`drawer-title`,className:(0,r.cx)(`text-headline-2 text-on-surface`,e),...t});T.displayName=`Drawer.Title`;var E=({asChild:e=!1,...t})=>{let r=n.t(e,`button`);return(0,a.jsx)(l.Dialog.Trigger,{"data-spark-component":`drawer-trigger`,render:r,...t})};E.displayName=`Drawer.Trigger`;var D=Object.assign(p,{Trigger:E,Portal:w,Overlay:C,Content:y,Header:S,Body:h,Footer:x,Close:g,CloseButton:_,Title:T,Description:b});D.displayName=`Drawer`,E.displayName=`Drawer.Trigger`,w.displayName=`Drawer.Portal`,C.displayName=`Drawer.Overlay`,y.displayName=`Drawer.Content`,S.displayName=`Drawer.Header`,h.displayName=`Drawer.Body`,x.displayName=`Drawer.Footer`,g.displayName=`Drawer.Close`,_.displayName=`Drawer.CloseButton`,T.displayName=`Drawer.Title`,b.displayName=`Drawer.Description`,exports.Drawer=D;
1
+ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`../chunk-C91j1N6u.js`);const e=require(`../icon-CRPcdgYp.js`),t=require(`../icon-button-BhRYDk-N.js`),n=require(`../useRenderSlot-C4UVWhDN.js`);let r=require(`class-variance-authority`),i=require(`react`),a=require(`react/jsx-runtime`),o=require(`@spark-ui/hooks/use-merge-refs`),s=require(`@spark-ui/hooks/use-scroll-overflow`),c=require(`@spark-ui/icons/Close`),l=require(`@base-ui/react/dialog`);var u=(0,i.createContext)(null),d=({children:e,withFade:t=!1})=>(0,a.jsx)(u,{value:{withFade:t},children:e}),f=()=>{let e=(0,i.useContext)(u);if(!e)throw Error(`useDrawer must be used within a Drawer provider`);return e},p=({onOpenChange:e,withFade:t=!1,...n})=>{let r=e?(t,n)=>{e(t)}:void 0;return(0,a.jsx)(d,{withFade:t,children:(0,a.jsx)(l.Dialog.Root,{"data-spark-component":`drawer`,onOpenChange:r,...n})})};p.displayName=`Drawer.Root`;var m=(0,r.cva)([`grow`,`overflow-y-auto`,`outline-hidden`,`focus-visible:u-outline`],{variants:{inset:{true:``,false:`px-xl py-lg`}},defaultVariants:{inset:!1}}),h=({children:e,inset:t=!1,className:n,ref:r,...c})=>{let l=(0,i.useRef)(null),u=(0,o.useMergeRefs)(r,l),{withFade:d}=f(),{overflow:p}=(0,s.useScrollOverflow)(l);return(0,a.jsx)(`div`,{"data-spark-component":`drawer-body`,ref:u,className:m({inset:t,className:n}),style:{...d&&{maskImage:`linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1) 44px, rgba(0, 0, 0, 1) calc(100% - 44px), rgba(0, 0, 0, 0))`,maskSize:`100% calc(100% + ${p.top?`0px`:`44px`} + ${p.bottom?`0px`:`44px`})`,maskPosition:`0 ${p.top?`0px`:`-44px`}`}},...c,children:e})};h.displayName=`Drawer.Body`;var g=({asChild:e=!1,...t})=>{let r=n.t(e,`button`);return(0,a.jsx)(l.Dialog.Close,{"data-spark-component":`drawer-close`,render:r,...t})};g.displayName=`Drawer.Close`;var _=({"aria-label":n,className:i,size:o=`md`,intent:s=`neutral`,design:l=`ghost`,children:u=(0,a.jsx)(c.Close,{}),ref:d,...f})=>(0,a.jsx)(g,{"data-spark-component":`drawer-close-button`,ref:d,className:(0,r.cx)([`absolute`,`top-sm`,`right-xl`],i),asChild:!0,...f,children:(0,a.jsx)(t.t,{intent:s,size:o,design:l,"aria-label":n,children:(0,a.jsx)(e.t,{children:u})})});_.displayName=`Drawer.CloseButton`;var v=(0,r.cva)([`fixed z-modal flex flex-col bg-surface shadow-md`,`data-open:animation-duration-400 data-closed:animation-duration-200`,`data-nested-dialog-open:after:pointer-events-none`,`after:bg-transparent`,`after:transition-all`,`after:duration-200`,`data-nested-dialog-open:after:inset-0`,`data-nested-dialog-open:after:absolute`,`data-nested-dialog-open:after:rounded-[inherit]`,`data-nested-dialog-open:after:bg-overlay/dim-3`],{variants:{size:{sm:``,md:``,lg:``,fluid:``,fullscreen:`h-screen w-screen`},side:{right:[`inset-y-0 right-0`,`data-open:animate-slide-in-right `,`data-closed:animate-slide-out-right`],left:[`inset-y-0 left-0`,`data-open:animate-slide-in-left`,`data-closed:animate-slide-out-left`],top:[`top-0 left-0`,`w-screen`,`data-open:animate-slide-in-top`,`data-closed:animate-slide-out-top`],bottom:[`bottom-0 left-0`,`w-screen`,`data-open:animate-slide-in-bottom`,`data-closed:animate-slide-out-bottom`]}},compoundVariants:[{side:[`right`,`left`],size:`sm`,class:[`w-sz-480`,`max-w-full`]},{side:[`right`,`left`],size:`md`,class:[`w-sz-672`,`max-w-full`]},{side:[`right`,`left`],size:`lg`,class:[`w-sz-864`,`max-w-full`]},{side:[`left`,`right`],size:`fluid`,class:[`w-auto`,`max-w-full`]},{side:[`top`,`bottom`],size:`sm`,class:[`h-sz-480`,`max-h-full`]},{side:[`top`,`bottom`],size:`md`,class:[`h-sz-672`,`max-h-full`]},{side:[`top`,`bottom`],size:`lg`,class:[`h-sz-864`,`max-h-full`]},{side:[`top`,`bottom`],size:`fluid`,class:[`h-auto`,`max-h-full`]}],defaultVariants:{side:`right`,size:`md`}}),y=({className:e,size:t=`md`,side:n=`right`,ref:i,...o})=>(0,a.jsx)(l.Dialog.Popup,{ref:i,"data-spark-component":`drawer-content`,role:`dialog`,className:i=>(0,r.cx)(v({size:t,side:n,className:typeof e==`function`?e(i):e})),...o});y.displayName=`Drawer.Content`;var b=e=>(0,a.jsx)(l.Dialog.Description,{"data-spark-component":`drawer-description`,...e});b.displayName=`Drawer.Description`;var x=({className:e,ref:t,...n})=>(0,a.jsx)(`footer`,{"data-spark-component":`drawer-footer`,ref:t,className:(0,r.cx)([`px-xl`,`py-lg`],e),...n});x.displayName=`Drawer.Footer`;var S=({children:e,className:t,ref:n,...i})=>(0,a.jsx)(`header`,{"data-spark-component":`drawer-header`,ref:n,className:(0,r.cx)([`px-xl`,`py-lg`],t),...i,children:e});S.displayName=`Dialog.Header`;var C=({className:e,...t})=>(0,a.jsx)(l.Dialog.Backdrop,{"data-spark-component":`drawer-overlay`,className:t=>(0,r.cx)(`z-overlay fixed top-0 left-0 h-screen w-screen`,`bg-overlay/dim-1`,`data-starting-style:animate-fade-in`,`data-ending-style:animate-fade-out`,typeof e==`function`?e(t):e),...t});C.displayName=`Drawer.Overlay`;var w=({className:e,...t})=>(0,a.jsx)(l.Dialog.Portal,{"data-spark-component":`drawer-portal`,className:(0,r.cx)(e,`z-modal absolute`),...t});w.displayName=`Drawer.Portal`;var T=({className:e,...t})=>(0,a.jsx)(l.Dialog.Title,{"data-spark-component":`drawer-title`,className:(0,r.cx)(`text-headline-2 text-on-surface`,e),...t});T.displayName=`Drawer.Title`;var E=({asChild:e=!1,...t})=>{let r=n.t(e,`button`);return(0,a.jsx)(l.Dialog.Trigger,{"data-spark-component":`drawer-trigger`,render:r,...t})};E.displayName=`Drawer.Trigger`;var D=Object.assign(p,{Trigger:E,Portal:w,Overlay:C,Content:y,Header:S,Body:h,Footer:x,Close:g,CloseButton:_,Title:T,Description:b});D.displayName=`Drawer`,E.displayName=`Drawer.Trigger`,w.displayName=`Drawer.Portal`,C.displayName=`Drawer.Overlay`,y.displayName=`Drawer.Content`,S.displayName=`Drawer.Header`,h.displayName=`Drawer.Body`,x.displayName=`Drawer.Footer`,g.displayName=`Drawer.Close`,_.displayName=`Drawer.CloseButton`,T.displayName=`Drawer.Title`,b.displayName=`Drawer.Description`,exports.Drawer=D;
2
2
  //# sourceMappingURL=index.js.map
package/dist/drawer/index.mjs CHANGED
@@ -1,5 +1,5 @@
1
1
  import { t as e } from "../icon-D05Uqh8_.mjs";
2
- import { t } from "../icon-button-BLG7VjR7.mjs";
2
+ import { t } from "../icon-button-Mq9ENaLm.mjs";
3
3
  import { t as n } from "../useRenderSlot-DKIwoqpO.mjs";
4
4
  import { cva as r, cx as i } from "class-variance-authority";
5
5
  import { createContext as a, useContext as o, useRef as s } from "react";
package/dist/dropdown/index.js CHANGED
@@ -1,2 +1,2 @@
1
- Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`../chunk-C91j1N6u.js`);const e=require(`../visually-hidden/index.js`),t=require(`../icon-CRPcdgYp.js`),n=require(`../popover-qoueDrzR.js`);let r=require(`class-variance-authority`),i=require(`react`),a=require(`react/jsx-runtime`),o=require(`@spark-ui/icons/ArrowHorizontalDown`),s=require(`@spark-ui/hooks/use-merge-refs`),c=require(`@spark-ui/components/form-field`),l=require(`@spark-ui/icons/Check`),u=require(`downshift`);var d=({itemsMap:e,defaultValue:t,value:n,onValueChange:r,open:i,onOpenChange:a,defaultOpen:o,multiple:s,id:c,labelId:l})=>{let d=[...e.values()],f=(0,u.useMultipleSelection)({selectedItems:n!=null&&s?d.filter(e=>s?n.includes(e.value):n===e.value):void 0,initialSelectedItems:t!=null&&s?d.filter(e=>s?t.includes(e.value):t===e.value):void 0,onSelectedItemsChange:({selectedItems:e})=>{e!=null&&s&&r?.(e.map(e=>e.value))}});return{...(0,u.useSelect)({items:d,isItemDisabled:e=>e.disabled,itemToString:e=>e?e.text:``,id:c,labelId:l,isOpen:i,onIsOpenChange:({isOpen:e})=>{e!=null&&a?.(e)},initialIsOpen:o??!1,stateReducer:(e,{changes:t,type:n})=>{if(!s)return t;let{selectedItems:r,removeSelectedItem:i,addSelectedItem:a}=f;switch(n){case u.useSelect.stateChangeTypes.ToggleButtonKeyDownEnter:case u.useSelect.stateChangeTypes.ToggleButtonKeyDownSpaceButton:case u.useSelect.stateChangeTypes.ItemClick:return t.selectedItem!=null&&(r.some(e=>e.value===t.selectedItem?.value)?i(t.selectedItem):a(t.selectedItem)),{...t,isOpen:!0,highlightedIndex:e.highlightedIndex};default:return t}},selectedItem:n!=null&&!s?e.get(n)||null:void 0,initialSelectedItem:(t!=null||n!=null)&&!s?e.get(t)||null:void 0,onSelectedItemChange:({selectedItem:e})=>{e?.value!=null&&!s&&r?.(e?.value)},scrollIntoView:e=>{e&&e.scrollIntoView({block:`nearest`})}}),...f,selectedItems:[...new Set(f.selectedItems)]}};function f(e,t){let n=0;for(let[r]of e.entries()){if(r===t)return n;n++}return-1}var p=(e,t)=>{let n=0;for(let r of e.keys()){if(n===t)return r;n++}},m=(e,t)=>{let n=p(e,t);return n===void 0?void 0:e.get(n)},h=e=>e?e.type.displayName:``,g=(e,t=[])=>(i.Children.forEach(e,e=>{if((0,i.isValidElement)(e)){if(h(e)===`Dropdown.Item`){let n=e.props;t.push({value:n.value,disabled:!!n.disabled,text:_(n.children)})}e.props.children&&g(e.props.children,t)}}),t),_=(e,t=``)=>typeof e==`string`?e:(i.Children.forEach(e,e=>{(0,i.isValidElement)(e)&&(h(e)===`Dropdown.ItemText`&&(t=e.props.children),e.props.children&&_(e.props.children,t))}),t),v=e=>{let t=new Map;return g(e).forEach(e=>{t.set(e.value,e)}),t},y=(e,t)=>i.Children.toArray(e).some(e=>(0,i.isValidElement)(e)?h(e)===t?!0:e.props.children?y(e.props.children,t):!1:!1),b=(0,i.createContext)(null),x=`:dropdown`,S=({children:e,defaultValue:t,value:r,onValueChange:o,open:s,onOpenChange:l,defaultOpen:u,multiple:f=!1,disabled:p=!1,readOnly:h=!1,state:g})=>{let[_,S]=(0,i.useState)(v(e)),[C,w]=(0,i.useState)(y(e,`Dropdown.Popover`)),[T,E]=(0,i.useState)(`mouse`),D=(0,c.useFormFieldControl)(),O=D.state||g,k=`${x}-label-${(0,i.useId)()}`,A=`${x}-input-${(0,i.useId)()}`,j=D.id||A,M=D.labelId||k,N=D.disabled??p,P=D.readOnly??h,F=d({itemsMap:_,defaultValue:t,value:r,onValueChange:o,open:s,onOpenChange:l,defaultOpen:u,multiple:f,id:j,labelId:M});(0,i.useEffect)(()=>{let t=v(e),n=[..._.values()],r=[...t.values()];(n.length!==r.length||n.some((e,t)=>{let n=e.value!==r[t]?.value,i=e.text!==r[t]?.text;return n||i}))&&S(t)},[e]);let[I,L]=C?[n.t,{open:!0}]:[i.Fragment,{}];return(0,a.jsx)(b,{value:{multiple:f,disabled:N,readOnly:P,...F,itemsMap:_,highlightedItem:m(_,F.highlightedIndex),hasPopover:C,setHasPopover:w,state:O,lastInteractionType:T,setLastInteractionType:E},children:(0,a.jsx)(I,{...L,children:e})})},C=()=>{let e=(0,i.useContext)(b);if(!e)throw Error(`useDropdownContext must be used within a Dropdown provider`);return e},w=({children:e,...t})=>(0,a.jsx)(S,{...t,children:e});w.displayName=`Dropdown`;var T=({className:e,ref:t})=>(0,a.jsx)(`div`,{ref:t,className:(0,r.cx)(`my-md border-b-sm border-outline`,e)});T.displayName=`Dropdown.Divider`;var E=(0,i.createContext)(null),D=({children:e})=>(0,a.jsx)(E,{value:{labelId:`${x}-group-label-${(0,i.useId)()}`},children:e}),O=()=>{let e=(0,i.useContext)(E);if(!e)throw Error(`useDropdownGroupContext must be used within a DropdownGroup provider`);return e},k=({children:e,ref:t,...n})=>(0,a.jsx)(D,{children:(0,a.jsx)(A,{ref:t,...n,children:e})}),A=({children:e,className:t,ref:n})=>{let{labelId:i}=O();return(0,a.jsx)(`div`,{ref:n,role:`group`,"aria-labelledby":i,className:(0,r.cx)(t),children:e})};k.displayName=`Dropdown.Group`;var j=(0,i.createContext)(null),M=({value:e,disabled:t=!1,children:n})=>{let{multiple:r,itemsMap:o,selectedItem:s,selectedItems:c}=C(),[l,u]=(0,i.useState)(void 0),d=f(o,e),p={disabled:t,value:e,text:_(n)};return(0,a.jsx)(j,{value:{textId:l,setTextId:u,isSelected:r?c.some(t=>t.value===e):s?.value===e,itemData:p,index:d,disabled:t},children:n})},N=()=>{let e=(0,i.useContext)(j);if(!e)throw Error(`useDropdownItemContext must be used within a DropdownItem provider`);return e},P=({children:e,ref:t,...n})=>{let{value:r,disabled:i}=n;return(0,a.jsx)(M,{value:r,disabled:i,children:(0,a.jsx)(I,{ref:t,...n,children:e})})},F=(0,r.cva)(`px-lg py-md text-body-1`,{variants:{selected:{true:`font-bold`},disabled:{true:`opacity-dim-3 cursor-not-allowed`,false:`cursor-pointer`},highlighted:{true:``},interactionType:{mouse:``,keyboard:``}},compoundVariants:[{highlighted:!0,interactionType:`mouse`,class:`bg-surface-hovered`},{highlighted:!0,interactionType:`keyboard`,class:`u-outline`}]}),I=({className:e,disabled:t=!1,value:n,children:i,ref:o})=>{let{getItemProps:c,highlightedItem:l,lastInteractionType:u}=C(),{textId:d,index:f,itemData:p,isSelected:m}=N(),h=l?.value===n,{ref:g,..._}=c({item:p,index:f});return(0,a.jsx)(`li`,{ref:(0,s.useMergeRefs)(o,g),className:(0,r.cx)(F({selected:m,disabled:t,highlighted:h,interactionType:u,className:e})),..._,"aria-selected":m,"aria-labelledby":d,children:i},n)};P.displayName=`Dropdown.Item`;var L=({className:e,children:n,label:i,ref:o})=>{let{disabled:s,isSelected:c}=N(),u=n||(0,a.jsx)(t.t,{size:`sm`,children:(0,a.jsx)(l.Check,{"aria-label":i})});return(0,a.jsx)(`span`,{ref:o,className:(0,r.cx)(`min-h-sz-16 min-w-sz-16 flex`,s&&`opacity-dim-3`,e),children:c&&u})};L.displayName=`Dropdown.ItemIndicator`;var R=({children:e,className:t,ref:n,...o})=>{let{isOpen:c,getMenuProps:l,hasPopover:u,setLastInteractionType:d}=C(),{ref:f,...p}=l({onMouseMove:()=>{d(`mouse`)}}),m=(0,i.useRef)(null),h=(0,s.useMergeRefs)(n,f,m);return(0,i.useLayoutEffect)(()=>{u&&m.current&&m.current.parentElement&&(m.current.parentElement.style.pointerEvents=c?``:`none`,m.current.style.pointerEvents=c?``:`none`)},[c,u]),(0,a.jsx)(`ul`,{ref:h,className:(0,r.cx)(t,`flex flex-col`,c?`pointer-events-auto! block`:`pointer-events-none invisible absolute max-h-0 min-h-0 overflow-hidden opacity-0`,u&&c&&`p-lg`),...o,...p,"data-spark-component":`dropdown-items`,children:e})};R.displayName=`Dropdown.Items`;var z=({children:e,ref:t})=>{let n=`${x}-item-text-${(0,i.useId)()}`,{setTextId:o}=N();return(0,i.useEffect)(()=>(o(n),()=>o(void 0))),(0,a.jsx)(`span`,{id:n,className:(0,r.cx)(`inline`),ref:t,children:e})};z.displayName=`Dropdown.ItemText`;var B=({children:e,className:t,ref:n})=>{let{labelId:i}=O();return(0,a.jsx)(`div`,{ref:n,id:i,className:(0,r.cx)(`px-md py-sm text-body-2 text-neutral italic`,t),children:e})};B.displayName=`Dropdown.Label`;var V=({children:e})=>(0,a.jsx)(t.t,{size:`sm`,className:`shrink-0`,children:e});V.displayName=`Dropdown.LeadingIcon`;var H=({children:e,matchTriggerWidth:t=!0,sideOffset:o=4,className:s,elevation:c=`dropdown`,ref:l,...u})=>{let d=C();return(0,i.useEffect)(()=>(d.setHasPopover(!0),()=>d.setHasPopover(!1)),[]),(0,a.jsx)(n.t.Content,{ref:l,inset:!0,asChild:!0,matchTriggerWidth:t,elevation:c,className:(0,r.cx)(`relative`,s),sideOffset:o,onOpenAutoFocus:e=>{e.preventDefault()},...u,"data-spark-component":`dropdown-popover`,children:e})};H.displayName=`Dropdown.Popover`;var U=({children:e,...t})=>(0,a.jsx)(n.t.Portal,{...t,children:e});U.displayName=`Dropdown.Portal`;var W=(0,r.cva)([`flex w-full items-center justify-between`,`min-h-sz-44 rounded-input bg-surface text-on-surface px-lg`,`text-body-1`,`ring-1 outline-hidden ring-inset focus:ring-2 focus:ring-focus`],{variants:{state:{undefined:`ring-outline`,error:`ring-error`,alert:`ring-alert`,success:`ring-success`},disabled:{true:`disabled:bg-on-surface/dim-5 cursor-not-allowed text-on-surface/dim-3`},readOnly:{true:`disabled:bg-on-surface/dim-5 cursor-not-allowed text-on-surface/dim-3`}},compoundVariants:[{disabled:!1,state:void 0,class:`default:hover:ring-outline-high`}]}),G=({"aria-label":c,children:l,className:u,ref:d})=>{let{getToggleButtonProps:f,getDropdownProps:p,getLabelProps:m,hasPopover:h,disabled:g,readOnly:_,state:v,setLastInteractionType:y,isOpen:b}=C(),[x,S]=h?[n.t.Trigger,{asChild:!0}]:[i.Fragment,{}],{ref:w,...T}=f({...p(),onKeyDown:e=>{y(`keyboard`),e.key===`Escape`&&b&&e.stopPropagation()}}),E=T[`aria-expanded`],D=(0,s.useMergeRefs)(d,w);return(0,a.jsxs)(a.Fragment,{children:[c&&(0,a.jsx)(e.VisuallyHidden,{children:(0,a.jsx)(`label`,{...m(),children:c})}),(0,a.jsx)(x,{...S,children:(0,a.jsxs)(`button`,{type:`button`,ref:D,disabled:g||_,className:W({className:u,state:v,disabled:g,readOnly:_}),...T,"data-spark-component":`dropdown-trigger`,children:[(0,a.jsx)(`span`,{className:`gap-md flex items-center justify-start`,children:l}),(0,a.jsx)(t.t,{className:(0,r.cx)(`ml-md shrink-0 rotate-0 transition duration-100 ease-in`,{"rotate-180":E}),size:`sm`,children:(0,a.jsx)(o.ArrowHorizontalDown,{})})]})})]})};G.displayName=`Dropdown.Trigger`;var K=({children:e,className:t,placeholder:n,ref:i})=>{let{selectedItem:o,multiple:s,selectedItems:c}=C(),l=!!(s?c.length:o),u=s?c[0]?.text:o?.text,d=c.length>1?`, +${c.length-1}`:``;return(0,a.jsxs)(`span`,{ref:i,className:(0,r.cx)(`flex shrink items-center text-left`,t),children:[(0,a.jsx)(`span`,{className:(0,r.cx)(`line-clamp-1 flex-1 overflow-hidden break-all text-ellipsis`,!l&&`text-on-surface/dim-1`),children:l?e||u:n}),d&&(0,a.jsx)(`span`,{children:d})]})};K.displayName=`Dropdown.Value`;var q=Object.assign(w,{Group:k,Item:P,Items:R,ItemText:z,ItemIndicator:L,Label:B,Popover:H,Divider:T,Trigger:G,Value:K,LeadingIcon:V,Portal:U});q.displayName=`Dropdown`,k.displayName=`Dropdown.Group`,R.displayName=`Dropdown.Items`,P.displayName=`Dropdown.Item`,z.displayName=`Dropdown.ItemText`,L.displayName=`Dropdown.ItemIndicator`,B.displayName=`Dropdown.Label`,H.displayName=`Dropdown.Popover`,T.displayName=`Dropdown.Divider`,G.displayName=`Dropdown.Trigger`,K.displayName=`Dropdown.Value`,V.displayName=`Dropdown.LeadingIcon`,U.displayName=`Dropdown.Portal`,exports.Dropdown=q,exports.DropdownProvider=S,exports.useDropdownContext=C;
1
+ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`../chunk-C91j1N6u.js`);const e=require(`../visually-hidden/index.js`),t=require(`../icon-CRPcdgYp.js`),n=require(`../popover-BIbJW9tD.js`);let r=require(`class-variance-authority`),i=require(`react`),a=require(`react/jsx-runtime`),o=require(`@spark-ui/icons/ArrowHorizontalDown`),s=require(`@spark-ui/hooks/use-merge-refs`),c=require(`@spark-ui/components/form-field`),l=require(`@spark-ui/icons/Check`),u=require(`downshift`);var d=({itemsMap:e,defaultValue:t,value:n,onValueChange:r,open:i,onOpenChange:a,defaultOpen:o,multiple:s,id:c,labelId:l})=>{let d=[...e.values()],f=(0,u.useMultipleSelection)({selectedItems:n!=null&&s?d.filter(e=>s?n.includes(e.value):n===e.value):void 0,initialSelectedItems:t!=null&&s?d.filter(e=>s?t.includes(e.value):t===e.value):void 0,onSelectedItemsChange:({selectedItems:e})=>{e!=null&&s&&r?.(e.map(e=>e.value))}});return{...(0,u.useSelect)({items:d,isItemDisabled:e=>e.disabled,itemToString:e=>e?e.text:``,id:c,labelId:l,isOpen:i,onIsOpenChange:({isOpen:e})=>{e!=null&&a?.(e)},initialIsOpen:o??!1,stateReducer:(e,{changes:t,type:n})=>{if(!s)return t;let{selectedItems:r,removeSelectedItem:i,addSelectedItem:a}=f;switch(n){case u.useSelect.stateChangeTypes.ToggleButtonKeyDownEnter:case u.useSelect.stateChangeTypes.ToggleButtonKeyDownSpaceButton:case u.useSelect.stateChangeTypes.ItemClick:return t.selectedItem!=null&&(r.some(e=>e.value===t.selectedItem?.value)?i(t.selectedItem):a(t.selectedItem)),{...t,isOpen:!0,highlightedIndex:e.highlightedIndex};default:return t}},selectedItem:n!=null&&!s?e.get(n)||null:void 0,initialSelectedItem:(t!=null||n!=null)&&!s?e.get(t)||null:void 0,onSelectedItemChange:({selectedItem:e})=>{e?.value!=null&&!s&&r?.(e?.value)},scrollIntoView:e=>{e&&e.scrollIntoView({block:`nearest`})}}),...f,selectedItems:[...new Set(f.selectedItems)]}};function f(e,t){let n=0;for(let[r]of e.entries()){if(r===t)return n;n++}return-1}var p=(e,t)=>{let n=0;for(let r of e.keys()){if(n===t)return r;n++}},m=(e,t)=>{let n=p(e,t);return n===void 0?void 0:e.get(n)},h=e=>e?e.type.displayName:``,g=(e,t=[])=>(i.Children.forEach(e,e=>{if((0,i.isValidElement)(e)){if(h(e)===`Dropdown.Item`){let n=e.props;t.push({value:n.value,disabled:!!n.disabled,text:_(n.children)})}e.props.children&&g(e.props.children,t)}}),t),_=(e,t=``)=>typeof e==`string`?e:(i.Children.forEach(e,e=>{(0,i.isValidElement)(e)&&(h(e)===`Dropdown.ItemText`&&(t=e.props.children),e.props.children&&_(e.props.children,t))}),t),v=e=>{let t=new Map;return g(e).forEach(e=>{t.set(e.value,e)}),t},y=(e,t)=>i.Children.toArray(e).some(e=>(0,i.isValidElement)(e)?h(e)===t?!0:e.props.children?y(e.props.children,t):!1:!1),b=(0,i.createContext)(null),x=`:dropdown`,S=({children:e,defaultValue:t,value:r,onValueChange:o,open:s,onOpenChange:l,defaultOpen:u,multiple:f=!1,disabled:p=!1,readOnly:h=!1,state:g})=>{let[_,S]=(0,i.useState)(v(e)),[C,w]=(0,i.useState)(y(e,`Dropdown.Popover`)),[T,E]=(0,i.useState)(`mouse`),D=(0,c.useFormFieldControl)(),O=D.state||g,k=`${x}-label-${(0,i.useId)()}`,A=`${x}-input-${(0,i.useId)()}`,j=D.id||A,M=D.labelId||k,N=D.disabled??p,P=D.readOnly??h,F=d({itemsMap:_,defaultValue:t,value:r,onValueChange:o,open:s,onOpenChange:l,defaultOpen:u,multiple:f,id:j,labelId:M});(0,i.useEffect)(()=>{let t=v(e),n=[..._.values()],r=[...t.values()];(n.length!==r.length||n.some((e,t)=>{let n=e.value!==r[t]?.value,i=e.text!==r[t]?.text;return n||i}))&&S(t)},[e]);let[I,L]=C?[n.t,{open:!0}]:[i.Fragment,{}];return(0,a.jsx)(b,{value:{multiple:f,disabled:N,readOnly:P,...F,itemsMap:_,highlightedItem:m(_,F.highlightedIndex),hasPopover:C,setHasPopover:w,state:O,lastInteractionType:T,setLastInteractionType:E},children:(0,a.jsx)(I,{...L,children:e})})},C=()=>{let e=(0,i.useContext)(b);if(!e)throw Error(`useDropdownContext must be used within a Dropdown provider`);return e},w=({children:e,...t})=>(0,a.jsx)(S,{...t,children:e});w.displayName=`Dropdown`;var T=({className:e,ref:t})=>(0,a.jsx)(`div`,{ref:t,className:(0,r.cx)(`my-md border-b-sm border-outline`,e)});T.displayName=`Dropdown.Divider`;var E=(0,i.createContext)(null),D=({children:e})=>(0,a.jsx)(E,{value:{labelId:`${x}-group-label-${(0,i.useId)()}`},children:e}),O=()=>{let e=(0,i.useContext)(E);if(!e)throw Error(`useDropdownGroupContext must be used within a DropdownGroup provider`);return e},k=({children:e,ref:t,...n})=>(0,a.jsx)(D,{children:(0,a.jsx)(A,{ref:t,...n,children:e})}),A=({children:e,className:t,ref:n})=>{let{labelId:i}=O();return(0,a.jsx)(`div`,{ref:n,role:`group`,"aria-labelledby":i,className:(0,r.cx)(t),children:e})};k.displayName=`Dropdown.Group`;var j=(0,i.createContext)(null),M=({value:e,disabled:t=!1,children:n})=>{let{multiple:r,itemsMap:o,selectedItem:s,selectedItems:c}=C(),[l,u]=(0,i.useState)(void 0),d=f(o,e),p={disabled:t,value:e,text:_(n)};return(0,a.jsx)(j,{value:{textId:l,setTextId:u,isSelected:r?c.some(t=>t.value===e):s?.value===e,itemData:p,index:d,disabled:t},children:n})},N=()=>{let e=(0,i.useContext)(j);if(!e)throw Error(`useDropdownItemContext must be used within a DropdownItem provider`);return e},P=({children:e,ref:t,...n})=>{let{value:r,disabled:i}=n;return(0,a.jsx)(M,{value:r,disabled:i,children:(0,a.jsx)(I,{ref:t,...n,children:e})})},F=(0,r.cva)(`px-lg py-md text-body-1`,{variants:{selected:{true:`font-bold`},disabled:{true:`opacity-dim-3 cursor-not-allowed`,false:`cursor-pointer`},highlighted:{true:``},interactionType:{mouse:``,keyboard:``}},compoundVariants:[{highlighted:!0,interactionType:`mouse`,class:`bg-surface-hovered`},{highlighted:!0,interactionType:`keyboard`,class:`u-outline`}]}),I=({className:e,disabled:t=!1,value:n,children:i,ref:o})=>{let{getItemProps:c,highlightedItem:l,lastInteractionType:u}=C(),{textId:d,index:f,itemData:p,isSelected:m}=N(),h=l?.value===n,{ref:g,..._}=c({item:p,index:f});return(0,a.jsx)(`li`,{ref:(0,s.useMergeRefs)(o,g),className:(0,r.cx)(F({selected:m,disabled:t,highlighted:h,interactionType:u,className:e})),..._,"aria-selected":m,"aria-labelledby":d,children:i},n)};P.displayName=`Dropdown.Item`;var L=({className:e,children:n,label:i,ref:o})=>{let{disabled:s,isSelected:c}=N(),u=n||(0,a.jsx)(t.t,{size:`sm`,children:(0,a.jsx)(l.Check,{"aria-label":i})});return(0,a.jsx)(`span`,{ref:o,className:(0,r.cx)(`min-h-sz-16 min-w-sz-16 flex`,s&&`opacity-dim-3`,e),children:c&&u})};L.displayName=`Dropdown.ItemIndicator`;var R=({children:e,className:t,ref:n,...o})=>{let{isOpen:c,getMenuProps:l,hasPopover:u,setLastInteractionType:d}=C(),{ref:f,...p}=l({onMouseMove:()=>{d(`mouse`)}}),m=(0,i.useRef)(null),h=(0,s.useMergeRefs)(n,f,m);return(0,i.useLayoutEffect)(()=>{u&&m.current&&m.current.parentElement&&(m.current.parentElement.style.pointerEvents=c?``:`none`,m.current.style.pointerEvents=c?``:`none`)},[c,u]),(0,a.jsx)(`ul`,{ref:h,className:(0,r.cx)(t,`flex flex-col`,c?`pointer-events-auto! block`:`pointer-events-none invisible absolute max-h-0 min-h-0 overflow-hidden opacity-0`,u&&c&&`p-lg`),...o,...p,"data-spark-component":`dropdown-items`,children:e})};R.displayName=`Dropdown.Items`;var z=({children:e,ref:t})=>{let n=`${x}-item-text-${(0,i.useId)()}`,{setTextId:o}=N();return(0,i.useEffect)(()=>(o(n),()=>o(void 0))),(0,a.jsx)(`span`,{id:n,className:(0,r.cx)(`inline`),ref:t,children:e})};z.displayName=`Dropdown.ItemText`;var B=({children:e,className:t,ref:n})=>{let{labelId:i}=O();return(0,a.jsx)(`div`,{ref:n,id:i,className:(0,r.cx)(`px-md py-sm text-body-2 text-neutral italic`,t),children:e})};B.displayName=`Dropdown.Label`;var V=({children:e})=>(0,a.jsx)(t.t,{size:`sm`,className:`shrink-0`,children:e});V.displayName=`Dropdown.LeadingIcon`;var H=({children:e,matchTriggerWidth:t=!0,sideOffset:o=4,className:s,elevation:c=`dropdown`,ref:l,...u})=>{let d=C();return(0,i.useEffect)(()=>(d.setHasPopover(!0),()=>d.setHasPopover(!1)),[]),(0,a.jsx)(n.t.Content,{ref:l,inset:!0,asChild:!0,matchTriggerWidth:t,elevation:c,className:(0,r.cx)(`relative`,s),sideOffset:o,onOpenAutoFocus:e=>{e.preventDefault()},...u,"data-spark-component":`dropdown-popover`,children:e})};H.displayName=`Dropdown.Popover`;var U=({children:e,...t})=>(0,a.jsx)(n.t.Portal,{...t,children:e});U.displayName=`Dropdown.Portal`;var W=(0,r.cva)([`flex w-full items-center justify-between`,`min-h-sz-44 rounded-input bg-surface text-on-surface px-lg`,`text-body-1`,`ring-1 outline-hidden ring-inset focus:ring-2 focus:ring-focus`],{variants:{state:{undefined:`ring-outline`,error:`ring-error`,alert:`ring-alert`,success:`ring-success`},disabled:{true:`disabled:bg-on-surface/dim-5 cursor-not-allowed text-on-surface/dim-3`},readOnly:{true:`disabled:bg-on-surface/dim-5 cursor-not-allowed text-on-surface/dim-3`}},compoundVariants:[{disabled:!1,state:void 0,class:`default:hover:ring-outline-high`}]}),G=({"aria-label":c,children:l,className:u,ref:d})=>{let{getToggleButtonProps:f,getDropdownProps:p,getLabelProps:m,hasPopover:h,disabled:g,readOnly:_,state:v,setLastInteractionType:y,isOpen:b}=C(),[x,S]=h?[n.t.Trigger,{asChild:!0}]:[i.Fragment,{}],{ref:w,...T}=f({...p(),onKeyDown:e=>{y(`keyboard`),e.key===`Escape`&&b&&e.stopPropagation()}}),E=T[`aria-expanded`],D=(0,s.useMergeRefs)(d,w);return(0,a.jsxs)(a.Fragment,{children:[c&&(0,a.jsx)(e.VisuallyHidden,{children:(0,a.jsx)(`label`,{...m(),children:c})}),(0,a.jsx)(x,{...S,children:(0,a.jsxs)(`button`,{type:`button`,ref:D,disabled:g||_,className:W({className:u,state:v,disabled:g,readOnly:_}),...T,"data-spark-component":`dropdown-trigger`,children:[(0,a.jsx)(`span`,{className:`gap-md flex items-center justify-start`,children:l}),(0,a.jsx)(t.t,{className:(0,r.cx)(`ml-md shrink-0 rotate-0 transition duration-100 ease-in`,{"rotate-180":E}),size:`sm`,children:(0,a.jsx)(o.ArrowHorizontalDown,{})})]})})]})};G.displayName=`Dropdown.Trigger`;var K=({children:e,className:t,placeholder:n,ref:i})=>{let{selectedItem:o,multiple:s,selectedItems:c}=C(),l=!!(s?c.length:o),u=s?c[0]?.text:o?.text,d=c.length>1?`, +${c.length-1}`:``;return(0,a.jsxs)(`span`,{ref:i,className:(0,r.cx)(`flex shrink items-center text-left`,t),children:[(0,a.jsx)(`span`,{className:(0,r.cx)(`line-clamp-1 flex-1 overflow-hidden break-all text-ellipsis`,!l&&`text-on-surface/dim-1`),children:l?e||u:n}),d&&(0,a.jsx)(`span`,{children:d})]})};K.displayName=`Dropdown.Value`;var q=Object.assign(w,{Group:k,Item:P,Items:R,ItemText:z,ItemIndicator:L,Label:B,Popover:H,Divider:T,Trigger:G,Value:K,LeadingIcon:V,Portal:U});q.displayName=`Dropdown`,k.displayName=`Dropdown.Group`,R.displayName=`Dropdown.Items`,P.displayName=`Dropdown.Item`,z.displayName=`Dropdown.ItemText`,L.displayName=`Dropdown.ItemIndicator`,B.displayName=`Dropdown.Label`,H.displayName=`Dropdown.Popover`,T.displayName=`Dropdown.Divider`,G.displayName=`Dropdown.Trigger`,K.displayName=`Dropdown.Value`,V.displayName=`Dropdown.LeadingIcon`,U.displayName=`Dropdown.Portal`,exports.Dropdown=q,exports.DropdownProvider=S,exports.useDropdownContext=C;
2
2
  //# sourceMappingURL=index.js.map
package/dist/dropdown/index.mjs CHANGED
@@ -1,6 +1,6 @@
1
1
  import { VisuallyHidden as e } from "../visually-hidden/index.mjs";
2
2
  import { t } from "../icon-D05Uqh8_.mjs";
3
- import { t as n } from "../popover-Ds6xXjgT.mjs";
3
+ import { t as n } from "../popover-D3xDdjH2.mjs";
4
4
  import { cva as r, cx as i } from "class-variance-authority";
5
5
  import { Children as a, Fragment as o, createContext as s, isValidElement as c, useContext as l, useEffect as u, useId as d, useLayoutEffect as f, useRef as p, useState as m } from "react";
6
6
  import { Fragment as h, jsx as g, jsxs as _ } from "react/jsx-runtime";
package/dist/file-upload/index.js CHANGED
@@ -1,2 +1,2 @@
1
- Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`../chunk-C91j1N6u.js`),t=require(`../slot/index.js`),n=require(`../icon-CRPcdgYp.js`),r=require(`../button-jlscsCw0.js`),i=require(`../icon-button-Iv9kq84M.js`),a=require(`../progress-DBD2FiQ1.js`);let o=require(`class-variance-authority`),s=require(`react`);s=e.t(s);let c=require(`react/jsx-runtime`),l=require(`@spark-ui/components/form-field`),u=require(`@spark-ui/hooks/use-combined-state`),d=require(`@spark-ui/icons/Close`),f=require(`@spark-ui/icons/CvOutline`),p=require(`@spark-ui/icons/FilePdfOutline`),m=require(`@spark-ui/icons/ImageOutline`),h=require(`@spark-ui/icons/PlayOutline`),g=require(`@spark-ui/icons/WarningOutline`);var _={TOO_MANY_FILES:`TOO_MANY_FILES`,FILE_INVALID_TYPE:`FILE_INVALID_TYPE`,FILE_TOO_LARGE:`FILE_TOO_LARGE`,FILE_TOO_SMALL:`FILE_TOO_SMALL`,FILE_INVALID:`FILE_INVALID`,FILE_EXISTS:`FILE_EXISTS`};function v(e,t){return t?t.split(`,`).map(e=>e.trim()).some(t=>{if(t.includes(`/`)){if(t.endsWith(`/*`)){let n=t.slice(0,-2);return e.type.startsWith(n+`/`)}return e.type===t}if(t.startsWith(`.`)){let n=t.toLowerCase();return e.name.toLowerCase().endsWith(n)}let n=`.`+t.toLowerCase();return e.name.toLowerCase().endsWith(n)}):!0}function y(e,t,n,r){let i=r||b();return t!==void 0&&e.size<t?{valid:!1,error:`File "${e.name}" is too small. Minimum size is ${x(t,i)}.`}:n!==void 0&&e.size>n?{valid:!1,error:`File "${e.name}" is too large. Maximum size is ${x(n,i)}.`}:{valid:!0}}function b(){return typeof navigator<`u`&&navigator.language?navigator.language:`en`}function x(e,t){let n=t||b(),r=n;if(n.length===2&&(r=n===`fr`?`fr-FR`:`en-US`),e===0)return new Intl.NumberFormat(r,{style:`unit`,unit:`byte`,unitDisplay:`long`,minimumFractionDigits:0,maximumFractionDigits:0}).format(0);let i=1024,a=Math.floor(Math.log(e)/Math.log(i)),o=[`byte`,`kilobyte`,`megabyte`,`gigabyte`][a]||`byte`,s=e/i**+a,c=a===0?`long`:`short`;return new Intl.NumberFormat(r,{style:`unit`,unit:o,unitDisplay:c,minimumFractionDigits:0,maximumFractionDigits:2}).format(s)}function S(e){let t=e.type.toLowerCase(),n=e.name.toLowerCase();return t.startsWith(`image/`)||/\.(jpg|jpeg|png|gif|bmp|webp|svg|ico)$/i.test(n)?(0,s.createElement)(m.ImageOutline):t===`application/pdf`||n.endsWith(`.pdf`)?(0,s.createElement)(p.FilePdfOutline):t.startsWith(`video/`)||/\.(mp4|avi|mov|wmv|flv|webm|mkv)$/i.test(n)?(0,s.createElement)(h.PlayOutline):(0,s.createElement)(f.CvOutline)}function C(e){if(!e)return!1;if(e.tabIndex>=0)return!0;let t=String(e.contentEditable)===`true`;return e instanceof HTMLInputElement||e instanceof HTMLButtonElement||e instanceof HTMLSelectElement||e instanceof HTMLTextAreaElement||e instanceof HTMLAnchorElement&&!!e.href||t}function w(e,t){for(let t of e)if(C(t))return t;return t.current?t.current:null}function T({defaultValue:e=[],value:t,onFileAccept:n,onFileReject:r,onFileChange:i,multiple:a=!0,accept:o,maxFiles:c,maxFileSize:l,minFileSize:d,disabled:f=!1,readOnly:p=!1,locale:m}){let h=m||(typeof navigator<`u`&&navigator.language?navigator.language:`en`),[g,b]=(0,u.useCombinedState)(t,e),x=g??[],S=b,[C,w]=(0,s.useState)([]);return{files:x,rejectedFiles:C,addFiles:e=>{if(f||p)return;w([]);let t=[],s=(e,t)=>t.some(t=>t.name===e.name&&t.size===e.size),u=(e,n)=>{let r=t.find(t=>t.file.name===e.name&&t.file.size===e.size);r?r.errors.includes(n)||r.errors.push(n):t.push({file:e,errors:[n]})};S(f=>{let p=f??[],m=c===void 0?void 0:c-p.length;m!==void 0&&m<=0&&e.forEach(e=>{u(e,_.TOO_MANY_FILES)});let g=e;o&&(e.filter(e=>!v(e,o)).forEach(e=>{u(e,_.FILE_INVALID_TYPE)}),g=e.filter(e=>v(e,o)));let b=g;(d!==void 0||l!==void 0)&&(b=g.filter(e=>y(e,d,l,h).valid?!0:(l!==void 0&&e.size>l?u(e,_.FILE_TOO_LARGE):d!==void 0&&e.size<d?u(e,_.FILE_TOO_SMALL):u(e,_.FILE_INVALID),!1)));let x=new Map,S=b.filter(e=>{let t=`${e.name}-${e.size}`;return s(e,p)||x.has(t)?(u(e,_.FILE_EXISTS),!1):(x.set(t,e),!0)}),C=a?S:S.slice(0,1);m!==void 0&&(m<=0?C=[]:C.length>m&&(C.forEach(e=>{u(e,_.TOO_MANY_FILES)}),C=[]));let T=a?[...p,...C]:C,E=[...t];return w(E),C.length>0&&n&&n({files:C}),E.length>0&&r&&r({files:E}),i&&i({acceptedFiles:T,rejectedFiles:E}),T})},removeFile:e=>{f||p||S(t=>{let n=(t??[]).filter((t,n)=>n!==e),r=C;return c!==void 0&&n.length<c&&(r=C.filter(e=>!e.errors.includes(_.TOO_MANY_FILES)),w(r)),i&&i({acceptedFiles:n,rejectedFiles:r}),n})},removeRejectedFile:e=>{f||p||w(t=>t.filter((t,n)=>n!==e))},clearFiles:()=>{f||p||(S([]),w([]),i&&i({acceptedFiles:[],rejectedFiles:[]}))},clearRejectedFiles:()=>{w([])},maxFilesReached:c!==void 0&&x.length>=c}}var E=(0,s.createContext)(null),D=`:file-upload`,O=({asChild:e=!1,children:t,defaultValue:n=[],value:r,onFileAccept:i,onFileReject:a,onFileChange:o,multiple:u=!0,accept:d,maxFiles:f,maxFileSize:p,minFileSize:m,disabled:h=!1,readOnly:g=!1,locale:_})=>{let v=(0,l.useFormFieldControl)(),y=(0,s.useId)(),b=v.id||`${D}-${y}`,x=v.name,S=(0,s.useRef)(null),C=(0,s.useRef)(null),w=(0,s.useRef)(null),O=(0,s.useRef)([]),k=(0,s.useRef)([]),A=v.disabled??h,j=v.readOnly??g,{files:M,rejectedFiles:N,addFiles:P,removeFile:F,removeRejectedFile:I,clearFiles:L,clearRejectedFiles:R,maxFilesReached:z}=T({defaultValue:n,value:r,onFileAccept:i,onFileReject:a,onFileChange:o,multiple:u,accept:d,maxFiles:f,maxFileSize:p,minFileSize:m,disabled:A,readOnly:j,locale:_});return(0,c.jsx)(E,{value:{inputRef:S,files:M,rejectedFiles:N,addFiles:P,removeFile:F,removeRejectedFile:I,clearFiles:()=>{L(),O.current=[]},clearRejectedFiles:()=>{R(),k.current=[]},triggerRef:C,dropzoneRef:w,deleteButtonRefs:O,rejectedFileDeleteButtonRefs:k,multiple:u,maxFiles:f,maxFilesReached:z,disabled:A,readOnly:j,locale:_||(typeof navigator<`u`&&navigator.language?navigator.language:`en`),description:v.description,isInvalid:v.isInvalid,isRequired:v.isRequired},children:(0,c.jsxs)(`div`,{className:`relative`,children:[t,(0,c.jsx)(`input`,{ref:S,type:`file`,tabIndex:-1,id:b,multiple:u,name:x,accept:d,disabled:A,readOnly:j&&!A,required:v.isRequired,"aria-invalid":v.isInvalid,"aria-describedby":v.description,"aria-label":v.labelId?void 0:`Upload files`,className:`sr-only`,onChange:e=>{if(e.target.files&&!A&&!j){P(Array.from(e.target.files));try{e.target.value=``}catch{}}}})]})})};O.displayName=`FileUpload`;var k=()=>{let e=(0,s.useContext)(E);if(!e)throw Error(`useFileUploadContext must be used within a FileUpload provider`);return e},A=({className:e,file:t,onClick:r,...a})=>{let{removeFile:l,triggerRef:u,dropzoneRef:f,deleteButtonRefs:p,inputRef:m,disabled:h,readOnly:g,files:_}=k(),v=(0,s.useRef)(null),y=_.findIndex(e=>e.name===t.name&&e.size===t.size);return(0,c.jsx)(i.t,{ref:e=>{if(v.current=e,e){for(;p.current.length<=y;)p.current.push(null);p.current[y]=e}else p.current[y]&&(p.current[y]=null)},"data-spark-component":`file-upload-item-delete-trigger`,className:(0,o.cx)(e),onClick:e=>{h||g||(l(y),requestAnimationFrame(()=>{let e=p.current.filter(Boolean);if(e.length>0){let t=e[Math.min(y,e.length-1)];t&&t.focus()}else{let e=w([u.current,f.current],m);e&&e.focus()}}),r?.(e))},disabled:h||g,size:`sm`,design:`contrast`,intent:`surface`,...a,children:(0,c.jsx)(n.t,{size:`sm`,children:(0,c.jsx)(d.Close,{})})})};A.displayName=`FileUpload.ItemDeleteTrigger`;var j=({className:e,file:t,uploadProgress:r,deleteButtonAriaLabel:i,progressAriaLabel:l,...u})=>{let{locale:d}=k(),[f,p]=(0,s.useState)(r!==void 0);(0,s.useEffect)(()=>{p(r!==void 0)},[r]);let m=(0,s.useCallback)(()=>{p(!1)},[]);return(0,c.jsxs)(`li`,{"data-spark-component":`file-upload-accepted-file`,className:(0,o.cx)(`relative`,`default:bg-surface default:border-sm default:border-outline default:p-md default:rounded-md`,`gap-md flex items-center justify-between default:w-full`,e),...u,children:[(0,c.jsx)(`div`,{className:`size-sz-36 bg-support-container flex items-center justify-center rounded-md`,children:(0,c.jsx)(n.t,{size:`md`,children:S(t)})}),(0,c.jsxs)(`div`,{className:`gap-md relative flex min-w-0 flex-1 flex-row items-center justify-between self-stretch`,children:[(0,c.jsx)(`p`,{className:`text-body-2 truncate font-medium`,children:t.name}),(0,c.jsx)(`p`,{className:`text-caption opacity-dim-1`,children:x(t.size,d)}),f&&r!==void 0&&(0,c.jsx)(`div`,{className:`absolute bottom-0 left-0 w-full`,children:(0,c.jsx)(a.t,{value:r,max:100,"aria-label":l,onComplete:m})})]}),(0,c.jsx)(A,{"aria-label":i,file:t})]})};j.displayName=`FileUpload.AcceptedFile`;var M=({children:e})=>{let{files:t=[],rejectedFiles:n=[],locale:r}=k();return(0,c.jsx)(c.Fragment,{children:e({acceptedFiles:t,rejectedFiles:n,formatFileSize:x,locale:r})})};M.displayName=`FileUpload.Context`;var N=(0,s.createContext)(!1),P=()=>(0,s.useContext)(N);function F({children:e,className:t,unstyled:n=!1}){let r=k(),i=(0,s.useRef)(null);if(!r)throw Error(`FileUploadDropzone must be used inside <FileUpload>`);let a=e=>{if(e.preventDefault(),e.stopPropagation(),e.currentTarget.setAttribute(`data-drag-over`,`false`),r.disabled||r.readOnly)return;let t=e.dataTransfer.files,n=[];t&&(n=Array.isArray(t)?[...t]:Array.from(t)),n.length>0&&r.addFiles(n)},l=()=>{!r.disabled&&!r.readOnly&&r.inputRef.current?.click()},u=e=>{(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),!r.disabled&&!r.readOnly&&r.inputRef.current?.click())},d=r.disabled||r.readOnly;return(0,c.jsx)(N,{value:!0,children:(0,c.jsx)(`div`,{ref:e=>{i.current=e,r.dropzoneRef&&(r.dropzoneRef.current=e)},role:`button`,tabIndex:d?-1:0,"aria-disabled":r.disabled?!0:void 0,"aria-describedby":r.description,"aria-invalid":r.isInvalid,"aria-required":r.isRequired,onClick:l,onKeyDown:u,onDrop:a,onDragOver:e=>{e.preventDefault()},className:n?t:(0,o.cx)(`default:bg-surface default:border-sm default:border-outline default:relative default:rounded-lg default:border-dashed`,`gap-lg flex flex-col items-center justify-center text-center`,`default:p-xl`,`transition-colors duration-200`,!d&&`default:hover:bg-surface-hovered`,`data-[drag-over=true]:border-outline-high data-[drag-over=true]:bg-surface-hovered data-[drag-over=true]:border-solid`,r.disabled&&`cursor-not-allowed opacity-50`,r.readOnly&&!r.disabled&&`cursor-default`,t),onDragEnter:e=>{d||e.currentTarget.setAttribute(`data-drag-over`,`true`)},onDragLeave:e=>{e.currentTarget.setAttribute(`data-drag-over`,`false`)},children:e})})}F.displayName=`FileUploadDropzone`;var I=({className:e,file:t,fallback:n=`📄`,...r})=>{let[i,a]=(0,s.useState)(!1),[l,u]=(0,s.useState)(!1),[d,f]=(0,s.useState)(null),p=t.type.startsWith(`image/`);return(0,s.useEffect)(()=>{if(!p){f(null);return}let e=URL.createObjectURL(t);return f(e),()=>{URL.revokeObjectURL(e)}},[t,p]),!p||i?(0,c.jsx)(`div`,{"data-spark-component":`file-upload-preview-image`,className:(0,o.cx)(`bg-neutral-container flex items-center justify-center rounded-md`,e),...r,children:n}):(0,c.jsxs)(`div`,{"data-spark-component":`file-upload-preview-image`,className:(0,o.cx)(`bg-neutral-container overflow-hidden`,e),...r,children:[(0,c.jsx)(`img`,{src:d,alt:t.name,className:(0,o.cx)(`size-full object-cover`,!l&&`opacity-0`),onLoad:()=>u(!0),onError:()=>a(!0)}),!l&&(0,c.jsx)(`div`,{className:`absolute inset-0 flex items-center justify-center`,children:n})]})};I.displayName=`FileUpload.PreviewImage`;var L=({className:e,rejectedFile:t,onClick:r,...a})=>{let{removeRejectedFile:l,triggerRef:u,dropzoneRef:f,rejectedFileDeleteButtonRefs:p,inputRef:m,disabled:h,readOnly:g,rejectedFiles:_}=k(),v=(0,s.useRef)(null),y=_.findIndex(e=>e.file.name===t.file.name&&e.file.size===t.file.size);return(0,c.jsx)(i.t,{ref:e=>{if(v.current=e,e){for(;p.current.length<=y;)p.current.push(null);p.current[y]=e}else p.current[y]&&(p.current[y]=null)},"data-spark-component":`file-upload-rejected-file-delete-trigger`,className:(0,o.cx)(e),onClick:e=>{h||g||(l(y),requestAnimationFrame(()=>{let e=p.current.filter(Boolean);if(e.length>0){let t=e[Math.min(y,e.length-1)];t&&t.focus()}else{let e=w([u.current,f.current],m);e&&e.focus()}}),r?.(e))},disabled:h||g,size:`sm`,design:`contrast`,intent:`surface`,...a,children:(0,c.jsx)(n.t,{size:`sm`,children:(0,c.jsx)(d.Close,{})})})};L.displayName=`FileUpload.RejectedFileDeleteTrigger`;var R=({className:e,rejectedFile:t,renderError:r,deleteButtonAriaLabel:i,...a})=>{let{locale:s}=k();return(0,c.jsxs)(`li`,{"data-spark-component":`file-upload-rejected-file`,className:(0,o.cx)(`relative`,`default:bg-surface default:border-sm default:border-outline default:p-md default:rounded-md`,`gap-md flex items-center justify-between default:w-full`,`border-error border-md`,e),...a,children:[(0,c.jsx)(`div`,{className:`size-sz-36 bg-error-container flex items-center justify-center rounded-md`,children:(0,c.jsx)(n.t,{size:`md`,className:`text-error`,children:(0,c.jsx)(g.WarningOutline,{})})}),(0,c.jsx)(`div`,{className:`min-w-0 flex-1`,children:(0,c.jsxs)(`div`,{className:`gap-md flex flex-col`,children:[(0,c.jsxs)(`div`,{className:`gap-md flex flex-row items-center justify-between`,children:[(0,c.jsx)(`p`,{className:`text-body-2 truncate font-medium`,children:t.file.name}),(0,c.jsx)(`p`,{className:`text-caption opacity-dim-1`,children:x(t.file.size,s)})]}),(0,c.jsx)(`div`,{className:`gap-xs flex flex-col`,children:t.errors.map((e,t)=>(0,c.jsx)(`div`,{className:`text-caption text-error`,"data-error-code":e,children:r(e)},t))})]})}),(0,c.jsx)(L,{"aria-label":i,rejectedFile:t})]})};R.displayName=`FileUpload.RejectedFile`;var z=({className:e,children:n,asChild:i=!1,unstyled:a=!1,design:s=`filled`,intent:l=`support`,size:u=`md`,shape:d=`rounded`,ref:f,...p})=>{let{inputRef:m,triggerRef:h,disabled:g,readOnly:_,description:v,isInvalid:y,isRequired:b}=k(),x=P(),S=e=>{e.stopPropagation(),e.preventDefault(),!g&&!_&&m.current?.click()},C=e=>{h&&(h.current=e),f&&(typeof f==`function`?f(e):f.current=e)},w,T;return x?(w=`span`,T={ref:C,"data-spark-component":`file-upload-trigger`,className:a?e:r.n({design:s,intent:l,size:u,shape:d,disabled:g||_,className:e})}):(w=i?t.Slot:a?`button`:r.t,T={ref:C,type:`button`,design:s,intent:l,size:u,shape:d,"data-spark-component":`file-upload-trigger`,className:(0,o.cx)(e),disabled:g||_,onClick:S,"aria-describedby":v,"aria-invalid":y,"aria-required":b,...p}),(0,c.jsx)(w,{...T,children:n})};z.displayName=`FileUpload.Trigger`;var B=Object.assign(O,{Trigger:z,Dropzone:F,Context:M,AcceptedFile:j,RejectedFile:R,PreviewImage:I,ItemDeleteTrigger:A,RejectedFileDeleteTrigger:L});B.displayName=`FileUpload`,z.displayName=`FileUpload.Trigger`,F.displayName=`FileUpload.Dropzone`,M.displayName=`FileUpload.Context`,A.displayName=`FileUpload.ItemDeleteTrigger`,I.displayName=`FileUpload.PreviewImage`,j.displayName=`FileUpload.AcceptedFile`,R.displayName=`FileUpload.RejectedFile`,L.displayName=`FileUpload.RejectedFileDeleteTrigger`,exports.FILE_UPLOAD_ERRORS=_,exports.FileUpload=B;
1
+ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`../chunk-C91j1N6u.js`),t=require(`../slot/index.js`),n=require(`../icon-CRPcdgYp.js`),r=require(`../button-BNLF5thC.js`),i=require(`../icon-button-BhRYDk-N.js`),a=require(`../progress-DBD2FiQ1.js`);let o=require(`class-variance-authority`),s=require(`react`);s=e.t(s);let c=require(`react/jsx-runtime`),l=require(`@spark-ui/components/form-field`),u=require(`@spark-ui/hooks/use-combined-state`),d=require(`@spark-ui/icons/Close`),f=require(`@spark-ui/icons/CvOutline`),p=require(`@spark-ui/icons/FilePdfOutline`),m=require(`@spark-ui/icons/ImageOutline`),h=require(`@spark-ui/icons/PlayOutline`),g=require(`@spark-ui/icons/WarningOutline`);var _={TOO_MANY_FILES:`TOO_MANY_FILES`,FILE_INVALID_TYPE:`FILE_INVALID_TYPE`,FILE_TOO_LARGE:`FILE_TOO_LARGE`,FILE_TOO_SMALL:`FILE_TOO_SMALL`,FILE_INVALID:`FILE_INVALID`,FILE_EXISTS:`FILE_EXISTS`};function v(e,t){return t?t.split(`,`).map(e=>e.trim()).some(t=>{if(t.includes(`/`)){if(t.endsWith(`/*`)){let n=t.slice(0,-2);return e.type.startsWith(n+`/`)}return e.type===t}if(t.startsWith(`.`)){let n=t.toLowerCase();return e.name.toLowerCase().endsWith(n)}let n=`.`+t.toLowerCase();return e.name.toLowerCase().endsWith(n)}):!0}function y(e,t,n,r){let i=r||b();return t!==void 0&&e.size<t?{valid:!1,error:`File "${e.name}" is too small. Minimum size is ${x(t,i)}.`}:n!==void 0&&e.size>n?{valid:!1,error:`File "${e.name}" is too large. Maximum size is ${x(n,i)}.`}:{valid:!0}}function b(){return typeof navigator<`u`&&navigator.language?navigator.language:`en`}function x(e,t){let n=t||b(),r=n;if(n.length===2&&(r=n===`fr`?`fr-FR`:`en-US`),e===0)return new Intl.NumberFormat(r,{style:`unit`,unit:`byte`,unitDisplay:`long`,minimumFractionDigits:0,maximumFractionDigits:0}).format(0);let i=1024,a=Math.floor(Math.log(e)/Math.log(i)),o=[`byte`,`kilobyte`,`megabyte`,`gigabyte`][a]||`byte`,s=e/i**+a,c=a===0?`long`:`short`;return new Intl.NumberFormat(r,{style:`unit`,unit:o,unitDisplay:c,minimumFractionDigits:0,maximumFractionDigits:2}).format(s)}function S(e){let t=e.type.toLowerCase(),n=e.name.toLowerCase();return t.startsWith(`image/`)||/\.(jpg|jpeg|png|gif|bmp|webp|svg|ico)$/i.test(n)?(0,s.createElement)(m.ImageOutline):t===`application/pdf`||n.endsWith(`.pdf`)?(0,s.createElement)(p.FilePdfOutline):t.startsWith(`video/`)||/\.(mp4|avi|mov|wmv|flv|webm|mkv)$/i.test(n)?(0,s.createElement)(h.PlayOutline):(0,s.createElement)(f.CvOutline)}function C(e){if(!e)return!1;if(e.tabIndex>=0)return!0;let t=String(e.contentEditable)===`true`;return e instanceof HTMLInputElement||e instanceof HTMLButtonElement||e instanceof HTMLSelectElement||e instanceof HTMLTextAreaElement||e instanceof HTMLAnchorElement&&!!e.href||t}function w(e,t){for(let t of e)if(C(t))return t;return t.current?t.current:null}function T({defaultValue:e=[],value:t,onFileAccept:n,onFileReject:r,onFileChange:i,multiple:a=!0,accept:o,maxFiles:c,maxFileSize:l,minFileSize:d,disabled:f=!1,readOnly:p=!1,locale:m}){let h=m||(typeof navigator<`u`&&navigator.language?navigator.language:`en`),[g,b]=(0,u.useCombinedState)(t,e),x=g??[],S=b,[C,w]=(0,s.useState)([]);return{files:x,rejectedFiles:C,addFiles:e=>{if(f||p)return;w([]);let t=[],s=(e,t)=>t.some(t=>t.name===e.name&&t.size===e.size),u=(e,n)=>{let r=t.find(t=>t.file.name===e.name&&t.file.size===e.size);r?r.errors.includes(n)||r.errors.push(n):t.push({file:e,errors:[n]})};S(f=>{let p=f??[],m=c===void 0?void 0:c-p.length;m!==void 0&&m<=0&&e.forEach(e=>{u(e,_.TOO_MANY_FILES)});let g=e;o&&(e.filter(e=>!v(e,o)).forEach(e=>{u(e,_.FILE_INVALID_TYPE)}),g=e.filter(e=>v(e,o)));let b=g;(d!==void 0||l!==void 0)&&(b=g.filter(e=>y(e,d,l,h).valid?!0:(l!==void 0&&e.size>l?u(e,_.FILE_TOO_LARGE):d!==void 0&&e.size<d?u(e,_.FILE_TOO_SMALL):u(e,_.FILE_INVALID),!1)));let x=new Map,S=b.filter(e=>{let t=`${e.name}-${e.size}`;return s(e,p)||x.has(t)?(u(e,_.FILE_EXISTS),!1):(x.set(t,e),!0)}),C=a?S:S.slice(0,1);m!==void 0&&(m<=0?C=[]:C.length>m&&(C.forEach(e=>{u(e,_.TOO_MANY_FILES)}),C=[]));let T=a?[...p,...C]:C,E=[...t];return w(E),C.length>0&&n&&n({files:C}),E.length>0&&r&&r({files:E}),i&&i({acceptedFiles:T,rejectedFiles:E}),T})},removeFile:e=>{f||p||S(t=>{let n=(t??[]).filter((t,n)=>n!==e),r=C;return c!==void 0&&n.length<c&&(r=C.filter(e=>!e.errors.includes(_.TOO_MANY_FILES)),w(r)),i&&i({acceptedFiles:n,rejectedFiles:r}),n})},removeRejectedFile:e=>{f||p||w(t=>t.filter((t,n)=>n!==e))},clearFiles:()=>{f||p||(S([]),w([]),i&&i({acceptedFiles:[],rejectedFiles:[]}))},clearRejectedFiles:()=>{w([])},maxFilesReached:c!==void 0&&x.length>=c}}var E=(0,s.createContext)(null),D=`:file-upload`,O=({asChild:e=!1,children:t,defaultValue:n=[],value:r,onFileAccept:i,onFileReject:a,onFileChange:o,multiple:u=!0,accept:d,maxFiles:f,maxFileSize:p,minFileSize:m,disabled:h=!1,readOnly:g=!1,locale:_})=>{let v=(0,l.useFormFieldControl)(),y=(0,s.useId)(),b=v.id||`${D}-${y}`,x=v.name,S=(0,s.useRef)(null),C=(0,s.useRef)(null),w=(0,s.useRef)(null),O=(0,s.useRef)([]),k=(0,s.useRef)([]),A=v.disabled??h,j=v.readOnly??g,{files:M,rejectedFiles:N,addFiles:P,removeFile:F,removeRejectedFile:I,clearFiles:L,clearRejectedFiles:R,maxFilesReached:z}=T({defaultValue:n,value:r,onFileAccept:i,onFileReject:a,onFileChange:o,multiple:u,accept:d,maxFiles:f,maxFileSize:p,minFileSize:m,disabled:A,readOnly:j,locale:_});return(0,c.jsx)(E,{value:{inputRef:S,files:M,rejectedFiles:N,addFiles:P,removeFile:F,removeRejectedFile:I,clearFiles:()=>{L(),O.current=[]},clearRejectedFiles:()=>{R(),k.current=[]},triggerRef:C,dropzoneRef:w,deleteButtonRefs:O,rejectedFileDeleteButtonRefs:k,multiple:u,maxFiles:f,maxFilesReached:z,disabled:A,readOnly:j,locale:_||(typeof navigator<`u`&&navigator.language?navigator.language:`en`),description:v.description,isInvalid:v.isInvalid,isRequired:v.isRequired},children:(0,c.jsxs)(`div`,{className:`relative`,children:[t,(0,c.jsx)(`input`,{ref:S,type:`file`,tabIndex:-1,id:b,multiple:u,name:x,accept:d,disabled:A,readOnly:j&&!A,required:v.isRequired,"aria-invalid":v.isInvalid,"aria-describedby":v.description,"aria-label":v.labelId?void 0:`Upload files`,className:`sr-only`,onChange:e=>{if(e.target.files&&!A&&!j){P(Array.from(e.target.files));try{e.target.value=``}catch{}}}})]})})};O.displayName=`FileUpload`;var k=()=>{let e=(0,s.useContext)(E);if(!e)throw Error(`useFileUploadContext must be used within a FileUpload provider`);return e},A=({className:e,file:t,onClick:r,...a})=>{let{removeFile:l,triggerRef:u,dropzoneRef:f,deleteButtonRefs:p,inputRef:m,disabled:h,readOnly:g,files:_}=k(),v=(0,s.useRef)(null),y=_.findIndex(e=>e.name===t.name&&e.size===t.size);return(0,c.jsx)(i.t,{ref:e=>{if(v.current=e,e){for(;p.current.length<=y;)p.current.push(null);p.current[y]=e}else p.current[y]&&(p.current[y]=null)},"data-spark-component":`file-upload-item-delete-trigger`,className:(0,o.cx)(e),onClick:e=>{h||g||(l(y),requestAnimationFrame(()=>{let e=p.current.filter(Boolean);if(e.length>0){let t=e[Math.min(y,e.length-1)];t&&t.focus()}else{let e=w([u.current,f.current],m);e&&e.focus()}}),r?.(e))},disabled:h||g,size:`sm`,design:`contrast`,intent:`surface`,...a,children:(0,c.jsx)(n.t,{size:`sm`,children:(0,c.jsx)(d.Close,{})})})};A.displayName=`FileUpload.ItemDeleteTrigger`;var j=({className:e,file:t,uploadProgress:r,deleteButtonAriaLabel:i,progressAriaLabel:l,...u})=>{let{locale:d}=k(),[f,p]=(0,s.useState)(r!==void 0);(0,s.useEffect)(()=>{p(r!==void 0)},[r]);let m=(0,s.useCallback)(()=>{p(!1)},[]);return(0,c.jsxs)(`li`,{"data-spark-component":`file-upload-accepted-file`,className:(0,o.cx)(`relative`,`default:bg-surface default:border-sm default:border-outline default:p-md default:rounded-md`,`gap-md flex items-center justify-between default:w-full`,e),...u,children:[(0,c.jsx)(`div`,{className:`size-sz-36 bg-support-container flex items-center justify-center rounded-md`,children:(0,c.jsx)(n.t,{size:`md`,children:S(t)})}),(0,c.jsxs)(`div`,{className:`gap-md relative flex min-w-0 flex-1 flex-row items-center justify-between self-stretch`,children:[(0,c.jsx)(`p`,{className:`text-body-2 truncate font-medium`,children:t.name}),(0,c.jsx)(`p`,{className:`text-caption opacity-dim-1`,children:x(t.size,d)}),f&&r!==void 0&&(0,c.jsx)(`div`,{className:`absolute bottom-0 left-0 w-full`,children:(0,c.jsx)(a.t,{value:r,max:100,"aria-label":l,onComplete:m})})]}),(0,c.jsx)(A,{"aria-label":i,file:t})]})};j.displayName=`FileUpload.AcceptedFile`;var M=({children:e})=>{let{files:t=[],rejectedFiles:n=[],locale:r}=k();return(0,c.jsx)(c.Fragment,{children:e({acceptedFiles:t,rejectedFiles:n,formatFileSize:x,locale:r})})};M.displayName=`FileUpload.Context`;var N=(0,s.createContext)(!1),P=()=>(0,s.useContext)(N);function F({children:e,className:t,unstyled:n=!1}){let r=k(),i=(0,s.useRef)(null);if(!r)throw Error(`FileUploadDropzone must be used inside <FileUpload>`);let a=e=>{if(e.preventDefault(),e.stopPropagation(),e.currentTarget.setAttribute(`data-drag-over`,`false`),r.disabled||r.readOnly)return;let t=e.dataTransfer.files,n=[];t&&(n=Array.isArray(t)?[...t]:Array.from(t)),n.length>0&&r.addFiles(n)},l=()=>{!r.disabled&&!r.readOnly&&r.inputRef.current?.click()},u=e=>{(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),!r.disabled&&!r.readOnly&&r.inputRef.current?.click())},d=r.disabled||r.readOnly;return(0,c.jsx)(N,{value:!0,children:(0,c.jsx)(`div`,{ref:e=>{i.current=e,r.dropzoneRef&&(r.dropzoneRef.current=e)},role:`button`,tabIndex:d?-1:0,"aria-disabled":r.disabled?!0:void 0,"aria-describedby":r.description,"aria-invalid":r.isInvalid,"aria-required":r.isRequired,onClick:l,onKeyDown:u,onDrop:a,onDragOver:e=>{e.preventDefault()},className:n?t:(0,o.cx)(`default:bg-surface default:border-sm default:border-outline default:relative default:rounded-lg default:border-dashed`,`gap-lg flex flex-col items-center justify-center text-center`,`default:p-xl`,`transition-colors duration-200`,!d&&`default:hover:bg-surface-hovered`,`data-[drag-over=true]:border-outline-high data-[drag-over=true]:bg-surface-hovered data-[drag-over=true]:border-solid`,r.disabled&&`cursor-not-allowed opacity-50`,r.readOnly&&!r.disabled&&`cursor-default`,t),onDragEnter:e=>{d||e.currentTarget.setAttribute(`data-drag-over`,`true`)},onDragLeave:e=>{e.currentTarget.setAttribute(`data-drag-over`,`false`)},children:e})})}F.displayName=`FileUploadDropzone`;var I=({className:e,file:t,fallback:n=`📄`,...r})=>{let[i,a]=(0,s.useState)(!1),[l,u]=(0,s.useState)(!1),[d,f]=(0,s.useState)(null),p=t.type.startsWith(`image/`);return(0,s.useEffect)(()=>{if(!p){f(null);return}let e=URL.createObjectURL(t);return f(e),()=>{URL.revokeObjectURL(e)}},[t,p]),!p||i?(0,c.jsx)(`div`,{"data-spark-component":`file-upload-preview-image`,className:(0,o.cx)(`bg-neutral-container flex items-center justify-center rounded-md`,e),...r,children:n}):(0,c.jsxs)(`div`,{"data-spark-component":`file-upload-preview-image`,className:(0,o.cx)(`bg-neutral-container overflow-hidden`,e),...r,children:[(0,c.jsx)(`img`,{src:d,alt:t.name,className:(0,o.cx)(`size-full object-cover`,!l&&`opacity-0`),onLoad:()=>u(!0),onError:()=>a(!0)}),!l&&(0,c.jsx)(`div`,{className:`absolute inset-0 flex items-center justify-center`,children:n})]})};I.displayName=`FileUpload.PreviewImage`;var L=({className:e,rejectedFile:t,onClick:r,...a})=>{let{removeRejectedFile:l,triggerRef:u,dropzoneRef:f,rejectedFileDeleteButtonRefs:p,inputRef:m,disabled:h,readOnly:g,rejectedFiles:_}=k(),v=(0,s.useRef)(null),y=_.findIndex(e=>e.file.name===t.file.name&&e.file.size===t.file.size);return(0,c.jsx)(i.t,{ref:e=>{if(v.current=e,e){for(;p.current.length<=y;)p.current.push(null);p.current[y]=e}else p.current[y]&&(p.current[y]=null)},"data-spark-component":`file-upload-rejected-file-delete-trigger`,className:(0,o.cx)(e),onClick:e=>{h||g||(l(y),requestAnimationFrame(()=>{let e=p.current.filter(Boolean);if(e.length>0){let t=e[Math.min(y,e.length-1)];t&&t.focus()}else{let e=w([u.current,f.current],m);e&&e.focus()}}),r?.(e))},disabled:h||g,size:`sm`,design:`contrast`,intent:`surface`,...a,children:(0,c.jsx)(n.t,{size:`sm`,children:(0,c.jsx)(d.Close,{})})})};L.displayName=`FileUpload.RejectedFileDeleteTrigger`;var R=({className:e,rejectedFile:t,renderError:r,deleteButtonAriaLabel:i,...a})=>{let{locale:s}=k();return(0,c.jsxs)(`li`,{"data-spark-component":`file-upload-rejected-file`,className:(0,o.cx)(`relative`,`default:bg-surface default:border-sm default:border-outline default:p-md default:rounded-md`,`gap-md flex items-center justify-between default:w-full`,`border-error border-md`,e),...a,children:[(0,c.jsx)(`div`,{className:`size-sz-36 bg-error-container flex items-center justify-center rounded-md`,children:(0,c.jsx)(n.t,{size:`md`,className:`text-error`,children:(0,c.jsx)(g.WarningOutline,{})})}),(0,c.jsx)(`div`,{className:`min-w-0 flex-1`,children:(0,c.jsxs)(`div`,{className:`gap-md flex flex-col`,children:[(0,c.jsxs)(`div`,{className:`gap-md flex flex-row items-center justify-between`,children:[(0,c.jsx)(`p`,{className:`text-body-2 truncate font-medium`,children:t.file.name}),(0,c.jsx)(`p`,{className:`text-caption opacity-dim-1`,children:x(t.file.size,s)})]}),(0,c.jsx)(`div`,{className:`gap-xs flex flex-col`,children:t.errors.map((e,t)=>(0,c.jsx)(`div`,{className:`text-caption text-error`,"data-error-code":e,children:r(e)},t))})]})}),(0,c.jsx)(L,{"aria-label":i,rejectedFile:t})]})};R.displayName=`FileUpload.RejectedFile`;var z=({className:e,children:n,asChild:i=!1,unstyled:a=!1,design:s=`filled`,intent:l=`support`,size:u=`md`,shape:d=`rounded`,ref:f,...p})=>{let{inputRef:m,triggerRef:h,disabled:g,readOnly:_,description:v,isInvalid:y,isRequired:b}=k(),x=P(),S=e=>{e.stopPropagation(),e.preventDefault(),!g&&!_&&m.current?.click()},C=e=>{h&&(h.current=e),f&&(typeof f==`function`?f(e):f.current=e)},w,T;return x?(w=`span`,T={ref:C,"data-spark-component":`file-upload-trigger`,className:a?e:r.n({design:s,intent:l,size:u,shape:d,disabled:g||_,className:e})}):(w=i?t.Slot:a?`button`:r.t,T={ref:C,type:`button`,design:s,intent:l,size:u,shape:d,"data-spark-component":`file-upload-trigger`,className:(0,o.cx)(e),disabled:g||_,onClick:S,"aria-describedby":v,"aria-invalid":y,"aria-required":b,...p}),(0,c.jsx)(w,{...T,children:n})};z.displayName=`FileUpload.Trigger`;var B=Object.assign(O,{Trigger:z,Dropzone:F,Context:M,AcceptedFile:j,RejectedFile:R,PreviewImage:I,ItemDeleteTrigger:A,RejectedFileDeleteTrigger:L});B.displayName=`FileUpload`,z.displayName=`FileUpload.Trigger`,F.displayName=`FileUpload.Dropzone`,M.displayName=`FileUpload.Context`,A.displayName=`FileUpload.ItemDeleteTrigger`,I.displayName=`FileUpload.PreviewImage`,j.displayName=`FileUpload.AcceptedFile`,R.displayName=`FileUpload.RejectedFile`,L.displayName=`FileUpload.RejectedFileDeleteTrigger`,exports.FILE_UPLOAD_ERRORS=_,exports.FileUpload=B;
2
2
  //# sourceMappingURL=index.js.map
package/dist/file-upload/index.mjs CHANGED
@@ -1,7 +1,7 @@
1
1
  import { Slot as e } from "../slot/index.mjs";
2
2
  import { t } from "../icon-D05Uqh8_.mjs";
3
- import { n, t as r } from "../button-CzHtbgj7.mjs";
4
- import { t as i } from "../icon-button-BLG7VjR7.mjs";
3
+ import { n, t as r } from "../button-CQswIokg.mjs";
4
+ import { t as i } from "../icon-button-Mq9ENaLm.mjs";
5
5
  import { t as a } from "../progress-BfpWgeE1.mjs";
6
6
  import { cx as o } from "class-variance-authority";
7
7
  import { createContext as s, createElement as c, useCallback as l, useContext as u, useEffect as d, useId as f, useRef as p, useState as m } from "react";
package/dist/icon-button/index.js CHANGED
@@ -1 +1 @@
1
- Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`../icon-button-Iv9kq84M.js`);exports.IconButton=e.t;
1
+ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`../icon-button-BhRYDk-N.js`);exports.IconButton=e.t;
package/dist/icon-button/index.mjs CHANGED
@@ -1,2 +1,2 @@
1
- import { t as e } from "../icon-button-BLG7VjR7.mjs";
1
+ import { t as e } from "../icon-button-Mq9ENaLm.mjs";
2
2
  export { e as IconButton };
package/dist/icon-button-BhRYDk-N.js ADDED
@@ -0,0 +1,2 @@
1
+ require(`./chunk-C91j1N6u.js`);const e=require(`./button-BNLF5thC.js`);let t=require(`class-variance-authority`),n=require(`react/jsx-runtime`),r=require(`@spark-ui/internal-utils`);var i=(0,t.cva)([`pl-0 pr-0`],{variants:{size:(0,r.makeVariants)({sm:[`text-body-1`],md:[`text-body-1`],lg:[`text-display-3`]})}}),a=({design:t=`filled`,disabled:r=!1,intent:a=`main`,shape:o=`pill`,size:s=`md`,className:c,ref:l,...u})=>(0,n.jsx)(e.t,{"data-spark-component":`icon-button`,ref:l,className:i({size:s,className:c}),design:t,disabled:r,intent:a,shape:o,size:s,...u});a.displayName=`IconButton`,Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return a}});
2
+ //# sourceMappingURL=icon-button-BhRYDk-N.js.map