@spark-ui/components 13.0.3-beta.0 → 13.0.3

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 (66) hide show
  1. package/dist/accordion/index.d.mts +2 -2
  2. package/dist/accordion/index.d.ts +2 -2
  3. package/dist/accordion/index.js +5 -5
  4. package/dist/accordion/index.js.map +1 -1
  5. package/dist/accordion/index.mjs +5 -5
  6. package/dist/accordion/index.mjs.map +1 -1
  7. package/dist/alert-dialog/index.d.mts +1 -1
  8. package/dist/alert-dialog/index.d.ts +1 -1
  9. package/dist/alert-dialog/index.js +15 -10
  10. package/dist/alert-dialog/index.js.map +1 -1
  11. package/dist/alert-dialog/index.mjs +15 -10
  12. package/dist/alert-dialog/index.mjs.map +1 -1
  13. package/dist/avatar/index.mjs +2 -2
  14. package/dist/carousel/index.mjs +2 -2
  15. package/dist/collapsible/index.d.mts +1 -1
  16. package/dist/collapsible/index.d.ts +1 -1
  17. package/dist/collapsible/index.js +3 -3
  18. package/dist/collapsible/index.js.map +1 -1
  19. package/dist/collapsible/index.mjs +3 -3
  20. package/dist/collapsible/index.mjs.map +1 -1
  21. package/dist/combobox/index.mjs +3 -3
  22. package/dist/dialog/index.mjs +2 -2
  23. package/dist/docgen.json +3098 -3129
  24. package/dist/drawer/index.d.mts +29 -37
  25. package/dist/drawer/index.d.ts +29 -37
  26. package/dist/drawer/index.js +89 -125
  27. package/dist/drawer/index.js.map +1 -1
  28. package/dist/drawer/index.mjs +89 -127
  29. package/dist/drawer/index.mjs.map +1 -1
  30. package/dist/dropdown/index.mjs +2 -2
  31. package/dist/file-upload/index.mjs +3 -3
  32. package/dist/pagination/index.mjs +3 -3
  33. package/dist/popover/index.mjs +1 -1
  34. package/dist/scrolling-list/index.mjs +3 -3
  35. package/dist/snackbar/index.mjs +3 -3
  36. package/dist/stepper/index.mjs +2 -2
  37. package/dist/tabs/index.mjs +3 -3
  38. package/dist/toast/index.d.mts +1 -1
  39. package/dist/toast/index.d.ts +1 -1
  40. package/dist/toast/index.js +3 -3
  41. package/dist/toast/index.js.map +1 -1
  42. package/dist/toast/index.mjs +6 -6
  43. package/dist/toast/index.mjs.map +1 -1
  44. package/package.json +6 -6
  45. package/dist/DialogTrigger-8oDlAJjU.d.mts +0 -142
  46. package/dist/DialogTrigger-8oDlAJjU.d.ts +0 -142
  47. package/dist/DialogTrigger-woU7vsJi.d.mts +0 -142
  48. package/dist/DialogTrigger-woU7vsJi.d.ts +0 -142
  49. package/dist/chunk-2BSBKLHG.mjs +0 -358
  50. package/dist/chunk-2BSBKLHG.mjs.map +0 -1
  51. package/dist/chunk-D7YBYT5H.mjs +0 -308
  52. package/dist/chunk-D7YBYT5H.mjs.map +0 -1
  53. package/dist/chunk-HEKSVWYW.mjs +0 -800
  54. package/dist/chunk-HEKSVWYW.mjs.map +0 -1
  55. package/dist/chunk-TKAU6SMC.mjs +0 -197
  56. package/dist/chunk-TKAU6SMC.mjs.map +0 -1
  57. package/dist/chunk-WA56YHV3.mjs +0 -358
  58. package/dist/chunk-WA56YHV3.mjs.map +0 -1
  59. package/dist/chunk-WLI4EPS6.mjs +0 -358
  60. package/dist/chunk-WLI4EPS6.mjs.map +0 -1
  61. package/dist/chunk-XYK6V3JF.mjs +0 -53
  62. package/dist/chunk-XYK6V3JF.mjs.map +0 -1
  63. package/dist/index-BRKaV3lI.d.mts +0 -93
  64. package/dist/index-BRKaV3lI.d.ts +0 -93
  65. package/dist/index-Cw_DIfiq.d.mts +0 -93
  66. package/dist/index-Cw_DIfiq.d.ts +0 -93
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/button/Button.tsx","../src/button/Button.styles.tsx","../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"],"sourcesContent":["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'>,\n 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's 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 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\nexport const Button = ({\n children,\n design = 'filled',\n disabled = 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 || isLoading\n\n const disabledEventHandlers = useMemo(() => {\n const result: Partial<Record<DOMAttributesEventHandler, () => void>> = {}\n\n if (shouldNotInteract) {\n blockedEventHandlers.forEach(eventHandler => (result[eventHandler] = undefined))\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={!!disabled}\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 && 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","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 font-bold',\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 'basic',\n 'success',\n 'alert',\n 'danger',\n 'info',\n 'neutral',\n 'surface',\n 'surfaceInverse',\n ]\n >({\n main: [],\n support: [],\n accent: [],\n basic: [],\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-lg'],\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 { 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 // Basic\n {\n intent: 'basic',\n design: 'filled',\n class: tw([\n 'bg-basic',\n 'text-on-basic',\n 'hover:bg-basic-hovered',\n 'enabled:active:bg-basic-hovered',\n 'focus-visible:bg-basic-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: 'basic',\n design: 'ghost',\n class: tw([\n 'text-on-basic-container',\n 'hover:bg-basic/dim-5',\n 'enabled:active:bg-basic/dim-5',\n 'focus-visible:bg-basic/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: 'basic',\n design: 'outlined',\n class: tw([\n 'hover:bg-basic/dim-5',\n 'enabled:active:bg-basic/dim-5',\n 'focus-visible:bg-basic/dim-5',\n 'text-basic',\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: 'basic',\n design: 'tinted',\n class: tw([\n 'bg-basic-container',\n 'text-on-basic-container',\n 'hover:bg-basic-container-hovered',\n 'enabled:active:bg-basic-container-hovered',\n 'focus-visible:bg-basic-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: 'basic',\n design: 'contrast',\n class: tw([\n 'text-on-basic-container bg-surface',\n 'hover:bg-basic-container-hovered',\n 'enabled:active:bg-basic-container-hovered',\n 'focus-visible:bg-basic-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"],"mappings":"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","names":["tw","tw","tw","tw"]}
@@ -1,197 +0,0 @@
1
- // src/progress/Progress.tsx
2
- import { cx } from "class-variance-authority";
3
- import { Progress as RadixProgress2 } from "radix-ui";
4
- import { useMemo, useState } from "react";
5
-
6
- // src/progress/ProgressBar.styles.ts
7
- import { cva } from "class-variance-authority";
8
- var progressBarStyles = cva(
9
- ["relative", "h-sz-4 w-full", "transform-gpu overflow-hidden", "bg-on-background/dim-4"],
10
- {
11
- variants: {
12
- shape: {
13
- square: [],
14
- rounded: ["rounded-sm"]
15
- }
16
- }
17
- }
18
- );
19
-
20
- // src/progress/ProgressContext.tsx
21
- import { createContext, useContext } from "react";
22
- var ProgressContext = createContext(null);
23
- var ID_PREFIX = ":progress";
24
- var useProgress = () => {
25
- const context = useContext(ProgressContext);
26
- if (!context) {
27
- throw new Error("useProgress must be used within a Progress provider");
28
- }
29
- return context;
30
- };
31
-
32
- // src/progress/ProgressIndicator.tsx
33
- import { Progress as RadixProgress } from "radix-ui";
34
-
35
- // src/progress/ProgressIndicator.styles.ts
36
- import { cva as cva2 } from "class-variance-authority";
37
- var progressIndicatorStyles = cva2(["h-full w-full", "transition-transform duration-400"], {
38
- variants: {
39
- /**
40
- * Color scheme of the progress component.
41
- */
42
- intent: {
43
- basic: ["bg-basic"],
44
- main: ["bg-main"],
45
- support: ["bg-support"],
46
- accent: ["bg-accent"],
47
- success: ["bg-success"],
48
- alert: ["bg-alert"],
49
- danger: ["bg-error"],
50
- info: ["bg-info"],
51
- neutral: ["bg-neutral"]
52
- },
53
- /**
54
- * Shape of the progress component.
55
- */
56
- shape: {
57
- square: [],
58
- rounded: ["rounded-sm"]
59
- },
60
- /**
61
- * Sets if the progress value is not determinated.
62
- */
63
- isIndeterminate: {
64
- true: ["absolute", "-translate-x-1/2", "animate-standalone-indeterminate-bar"],
65
- false: []
66
- }
67
- }
68
- });
69
-
70
- // src/progress/ProgressIndicator.tsx
71
- import { jsx } from "react/jsx-runtime";
72
- var ProgressIndicator = ({
73
- className,
74
- style,
75
- ref,
76
- ...others
77
- }) => {
78
- const { value, max, intent, shape, isIndeterminate } = useProgress();
79
- const x = (max - value) / max * 100;
80
- return /* @__PURE__ */ jsx(
81
- RadixProgress.ProgressIndicator,
82
- {
83
- "data-spark-component": "progress-indicator",
84
- className: progressIndicatorStyles({ className, intent, shape, isIndeterminate }),
85
- style: { ...style, ...!isIndeterminate && { transform: `translateX(-${x}%)` } },
86
- ref,
87
- ...others
88
- }
89
- );
90
- };
91
- ProgressIndicator.displayName = "Progress.Indicator";
92
-
93
- // src/progress/ProgressBar.tsx
94
- import { jsx as jsx2 } from "react/jsx-runtime";
95
- var ProgressBar = ({
96
- className,
97
- children = /* @__PURE__ */ jsx2(ProgressIndicator, {}),
98
- ref,
99
- ...others
100
- }) => {
101
- const { shape } = useProgress();
102
- return /* @__PURE__ */ jsx2(
103
- "div",
104
- {
105
- "data-spark-component": "progress-bar",
106
- className: progressBarStyles({ className, shape }),
107
- ref,
108
- ...others,
109
- children
110
- }
111
- );
112
- };
113
- ProgressBar.displayName = "Progress.Bar";
114
-
115
- // src/progress/Progress.tsx
116
- import { jsx as jsx3 } from "react/jsx-runtime";
117
- var Progress = ({
118
- className,
119
- value: valueProp,
120
- max = 100,
121
- shape = "square",
122
- intent = "basic",
123
- isIndeterminate = false,
124
- children = /* @__PURE__ */ jsx3(ProgressBar, {}),
125
- ref,
126
- ...others
127
- }) => {
128
- const [labelId, setLabelId] = useState();
129
- const value = useMemo(() => {
130
- return { value: valueProp ?? 0, max, intent, shape, isIndeterminate, onLabelId: setLabelId };
131
- }, [max, valueProp, intent, shape, isIndeterminate, setLabelId]);
132
- return /* @__PURE__ */ jsx3(ProgressContext.Provider, { "data-spark-component": "progress", value, children: /* @__PURE__ */ jsx3(
133
- RadixProgress2.Progress,
134
- {
135
- "data-spark-component": "progress",
136
- ref,
137
- className: cx("gap-sm focus-visible:u-outline flex flex-col", className),
138
- value: valueProp,
139
- "aria-labelledby": labelId,
140
- max,
141
- tabIndex: -1,
142
- ...others,
143
- children
144
- }
145
- ) });
146
- };
147
- Progress.displayName = "Progress";
148
-
149
- // src/progress/ProgressLabel.tsx
150
- import { useMergeRefs } from "@spark-ui/hooks/use-merge-refs";
151
- import { useCallback, useId } from "react";
152
- import { jsx as jsx4 } from "react/jsx-runtime";
153
- var ProgressLabel = ({
154
- id: idProp,
155
- children,
156
- ref: forwardedRef,
157
- ...others
158
- }) => {
159
- const internalID = `${ID_PREFIX}-label-${useId()}`;
160
- const id = idProp || internalID;
161
- const { onLabelId } = useProgress();
162
- const rootRef = useCallback(
163
- (el) => {
164
- onLabelId(el ? id : void 0);
165
- },
166
- [id, onLabelId]
167
- );
168
- const ref = useMergeRefs(forwardedRef, rootRef);
169
- return /* @__PURE__ */ jsx4(
170
- "span",
171
- {
172
- "data-spark-component": "progress-label",
173
- id,
174
- className: "text-body-2 text-on-surface",
175
- ref,
176
- ...others,
177
- children
178
- }
179
- );
180
- };
181
- ProgressLabel.displayName = "Progress.Label";
182
-
183
- // src/progress/index.ts
184
- var Progress2 = Object.assign(Progress, {
185
- Label: ProgressLabel,
186
- Bar: ProgressBar,
187
- Indicator: ProgressIndicator
188
- });
189
- Progress2.displayName = "Progress";
190
- ProgressBar.displayName = "Progress.Bar";
191
- ProgressIndicator.displayName = "Progress.Indicator";
192
- ProgressLabel.displayName = "Progress.Label";
193
-
194
- export {
195
- Progress2 as Progress
196
- };
197
- //# sourceMappingURL=chunk-TKAU6SMC.mjs.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/progress/Progress.tsx","../src/progress/ProgressBar.styles.ts","../src/progress/ProgressContext.tsx","../src/progress/ProgressIndicator.tsx","../src/progress/ProgressIndicator.styles.ts","../src/progress/ProgressBar.tsx","../src/progress/ProgressLabel.tsx","../src/progress/index.ts"],"sourcesContent":["import { cx } from 'class-variance-authority'\nimport { Progress as RadixProgress } from 'radix-ui'\nimport { PropsWithChildren, Ref, useMemo, useState } from 'react'\n\nimport { ProgressBar } from './ProgressBar'\nimport { ProgressContext } from './ProgressContext'\nimport { ProgressIndicatorStylesProps } from './ProgressIndicator.styles'\n\nexport interface ProgressProps\n extends RadixProgress.ProgressProps,\n Pick<ProgressIndicatorStylesProps, 'intent'> {\n shape?: 'square' | 'rounded'\n isIndeterminate?: boolean\n ref?: Ref<HTMLDivElement>\n}\n\nexport const Progress = ({\n className,\n value: valueProp,\n max = 100,\n shape = 'square',\n intent = 'basic',\n isIndeterminate = false,\n children = <ProgressBar />,\n ref,\n ...others\n}: PropsWithChildren<ProgressProps>) => {\n const [labelId, setLabelId] = useState<string>()\n\n const value = useMemo(() => {\n return { value: valueProp ?? 0, max, intent, shape, isIndeterminate, onLabelId: setLabelId }\n }, [max, valueProp, intent, shape, isIndeterminate, setLabelId])\n\n return (\n <ProgressContext.Provider data-spark-component=\"progress\" value={value}>\n <RadixProgress.Progress\n data-spark-component=\"progress\"\n ref={ref}\n className={cx('gap-sm focus-visible:u-outline flex flex-col', className)}\n value={valueProp}\n aria-labelledby={labelId}\n max={max}\n tabIndex={-1}\n {...others}\n >\n {children}\n </RadixProgress.Progress>\n </ProgressContext.Provider>\n )\n}\n\nProgress.displayName = 'Progress'\n","import { cva, VariantProps } from 'class-variance-authority'\n\nexport const progressBarStyles = cva(\n ['relative', 'h-sz-4 w-full', 'transform-gpu overflow-hidden', 'bg-on-background/dim-4'],\n {\n variants: {\n shape: {\n square: [],\n rounded: ['rounded-sm'],\n },\n },\n }\n)\n\nexport type ProgressBarStylesProps = VariantProps<typeof progressBarStyles>\n","import { createContext, useContext } from 'react'\n\nimport { ProgressIndicatorStylesProps } from './ProgressIndicator.styles'\n\nexport interface ProgressContextValue {\n value: number\n max: number\n isIndeterminate: boolean\n shape: 'square' | 'rounded'\n intent: ProgressIndicatorStylesProps['intent']\n onLabelId: (id?: string) => void\n}\n\nexport const ProgressContext = createContext<ProgressContextValue | null>(null)\n\nexport const ID_PREFIX = ':progress'\n\nexport const useProgress = () => {\n const context = useContext(ProgressContext)\n\n if (!context) {\n throw new Error('useProgress must be used within a Progress provider')\n }\n\n return context\n}\n","import { Progress as RadixProgress } from 'radix-ui'\nimport { ComponentPropsWithRef, PropsWithChildren } from 'react'\n\nimport { useProgress } from './ProgressContext'\nimport { progressIndicatorStyles } from './ProgressIndicator.styles'\n\nexport type ProgressIndicatorProps = ComponentPropsWithRef<'div'>\n\nexport const ProgressIndicator = ({\n className,\n style,\n ref,\n ...others\n}: PropsWithChildren<ProgressIndicatorProps>) => {\n const { value, max, intent, shape, isIndeterminate } = useProgress()\n const x = ((max - value) / max) * 100\n\n return (\n <RadixProgress.ProgressIndicator\n data-spark-component=\"progress-indicator\"\n className={progressIndicatorStyles({ className, intent, shape, isIndeterminate })}\n style={{ ...style, ...(!isIndeterminate && { transform: `translateX(-${x}%)` }) }}\n ref={ref}\n {...others}\n />\n )\n}\n\nProgressIndicator.displayName = 'Progress.Indicator'\n","import { cva, VariantProps } from 'class-variance-authority'\n\nexport const progressIndicatorStyles = cva(['h-full w-full', 'transition-transform duration-400'], {\n variants: {\n /**\n * Color scheme of the progress component.\n */\n intent: {\n basic: ['bg-basic'],\n main: ['bg-main'],\n support: ['bg-support'],\n accent: ['bg-accent'],\n success: ['bg-success'],\n alert: ['bg-alert'],\n danger: ['bg-error'],\n info: ['bg-info'],\n neutral: ['bg-neutral'],\n },\n /**\n * Shape of the progress component.\n */\n shape: {\n square: [],\n rounded: ['rounded-sm'],\n },\n /**\n * Sets if the progress value is not determinated.\n */\n isIndeterminate: {\n true: ['absolute', '-translate-x-1/2', 'animate-standalone-indeterminate-bar'],\n false: [],\n },\n },\n})\n\nexport type ProgressIndicatorStylesProps = VariantProps<typeof progressIndicatorStyles>\n","import { ComponentPropsWithRef, PropsWithChildren } from 'react'\n\nimport { progressBarStyles } from './ProgressBar.styles'\nimport { useProgress } from './ProgressContext'\nimport { ProgressIndicator } from './ProgressIndicator'\n\nexport type ProgressBarProps = ComponentPropsWithRef<'div'>\n\nexport const ProgressBar = ({\n className,\n children = <ProgressIndicator />,\n ref,\n ...others\n}: PropsWithChildren<ProgressBarProps>) => {\n const { shape } = useProgress()\n\n return (\n <div\n data-spark-component=\"progress-bar\"\n className={progressBarStyles({ className, shape })}\n ref={ref}\n {...others}\n >\n {children}\n </div>\n )\n}\n\nProgressBar.displayName = 'Progress.Bar'\n","import { useMergeRefs } from '@spark-ui/hooks/use-merge-refs'\nimport { ComponentPropsWithRef, useCallback, useId } from 'react'\n\nimport { ID_PREFIX, useProgress } from './ProgressContext'\n\nexport type ProgressLabelProps = ComponentPropsWithRef<'span'>\n\nexport const ProgressLabel = ({\n id: idProp,\n children,\n ref: forwardedRef,\n ...others\n}: ProgressLabelProps) => {\n const internalID = `${ID_PREFIX}-label-${useId()}`\n const id = idProp || internalID\n\n const { onLabelId } = useProgress()\n const rootRef = useCallback(\n (el: HTMLSpanElement) => {\n onLabelId(el ? id : undefined)\n },\n [id, onLabelId]\n )\n const ref = useMergeRefs(forwardedRef, rootRef)\n\n return (\n <span\n data-spark-component=\"progress-label\"\n id={id}\n className=\"text-body-2 text-on-surface\"\n ref={ref}\n {...others}\n >\n {children}\n </span>\n )\n}\n\nProgressLabel.displayName = 'Progress.Label'\n","import { Progress as Root } from './Progress'\nimport { ProgressBar } from './ProgressBar'\nimport { ProgressIndicator } from './ProgressIndicator'\nimport { ProgressLabel } from './ProgressLabel'\n\nexport const Progress: typeof Root & {\n Label: typeof ProgressLabel\n Bar: typeof ProgressBar\n Indicator: typeof ProgressIndicator\n} = Object.assign(Root, {\n Label: ProgressLabel,\n Bar: ProgressBar,\n Indicator: ProgressIndicator,\n})\n\nProgress.displayName = 'Progress'\nProgressBar.displayName = 'Progress.Bar'\nProgressIndicator.displayName = 'Progress.Indicator'\nProgressLabel.displayName = 'Progress.Label'\n\nexport { type ProgressProps } from './Progress'\nexport { type ProgressBarProps } from './ProgressBar'\nexport { type ProgressLabelProps } from './ProgressLabel'\nexport { type ProgressIndicatorProps } from './ProgressIndicator'\n"],"mappings":"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","names":["RadixProgress","cva","jsx","jsx","RadixProgress","jsx","Progress"]}
@@ -1,358 +0,0 @@
1
- import {
2
- IconButton
3
- } from "./chunk-XYK6V3JF.mjs";
4
- import {
5
- Icon
6
- } from "./chunk-UMUMFMFB.mjs";
7
-
8
- // src/dialog/Dialog.tsx
9
- import { Dialog as RadixDialog } from "radix-ui";
10
- import { useEffect, useRef } from "react";
11
-
12
- // src/dialog/DialogContext.tsx
13
- import { createContext, useContext, useState } from "react";
14
- import { jsx } from "react/jsx-runtime";
15
- var DialogContext = createContext(null);
16
- var DialogProvider = ({
17
- children: childrenProp,
18
- withFade = false
19
- }) => {
20
- const [isFullScreen, setIsFullScreen] = useState(false);
21
- return /* @__PURE__ */ jsx(
22
- DialogContext.Provider,
23
- {
24
- value: {
25
- isFullScreen,
26
- setIsFullScreen,
27
- withFade
28
- },
29
- children: childrenProp
30
- }
31
- );
32
- };
33
- var useDialog = () => {
34
- const context = useContext(DialogContext);
35
- if (!context) {
36
- throw Error("useDialog must be used within a Dialog provider");
37
- }
38
- return context;
39
- };
40
-
41
- // src/dialog/Dialog.tsx
42
- import { jsx as jsx2 } from "react/jsx-runtime";
43
- var Dialog = ({ children, withFade = false, ...rest }) => {
44
- const open = rest.open;
45
- const activeElementRef = useRef(null);
46
- function handleActiveElementFocus() {
47
- if (open && document.activeElement) {
48
- activeElementRef.current = document.activeElement;
49
- }
50
- if (!open) {
51
- setTimeout(() => {
52
- if (!(activeElementRef.current instanceof HTMLElement)) return;
53
- activeElementRef.current.focus();
54
- }, 0);
55
- }
56
- }
57
- useEffect(handleActiveElementFocus, [open]);
58
- return /* @__PURE__ */ jsx2(DialogProvider, { withFade, children: /* @__PURE__ */ jsx2(RadixDialog.Root, { ...rest, children }) });
59
- };
60
- Dialog.displayName = "Dialog.Root";
61
-
62
- // src/dialog/DialogBody.tsx
63
- import { useMergeRefs } from "@spark-ui/hooks/use-merge-refs";
64
- import { useScrollOverflow } from "@spark-ui/hooks/use-scroll-overflow";
65
- import { cx } from "class-variance-authority";
66
- import { useRef as useRef2 } from "react";
67
- import { jsx as jsx3 } from "react/jsx-runtime";
68
- var Body = ({
69
- children,
70
- className,
71
- inset = false,
72
- ref: forwardedRef,
73
- ...rest
74
- }) => {
75
- const scrollAreaRef = useRef2(null);
76
- const ref = useMergeRefs(forwardedRef, scrollAreaRef);
77
- const { withFade } = useDialog();
78
- const overflow = useScrollOverflow(scrollAreaRef);
79
- return /* @__PURE__ */ jsx3(
80
- "div",
81
- {
82
- "data-spark-component": "dialog-body",
83
- ref,
84
- className: cx(
85
- "focus-visible:u-outline relative grow overflow-y-auto outline-hidden",
86
- "transition-all duration-300",
87
- {
88
- ["px-xl py-lg"]: !inset
89
- },
90
- className
91
- ),
92
- style: {
93
- ...withFade && {
94
- 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))",
95
- maskSize: `100% calc(100% + ${overflow.top ? "0px" : "44px"} + ${overflow.bottom ? "0px" : "44px"})`,
96
- maskPosition: `0 ${overflow.top ? "0px" : "-44px"}`
97
- }
98
- },
99
- ...rest,
100
- children
101
- }
102
- );
103
- };
104
- Body.displayName = "Dialog.Body";
105
-
106
- // src/dialog/DialogClose.tsx
107
- import { Dialog as RadixDialog2 } from "radix-ui";
108
- import { jsx as jsx4 } from "react/jsx-runtime";
109
- var Close = (props) => /* @__PURE__ */ jsx4(RadixDialog2.Close, { ...props });
110
- Close.displayName = "Dialog.Close";
111
-
112
- // src/dialog/DialogCloseButton.tsx
113
- import { Close as CloseSVG } from "@spark-ui/icons/Close";
114
- import { cx as cx2 } from "class-variance-authority";
115
- import { jsx as jsx5 } from "react/jsx-runtime";
116
- var Root = ({
117
- "aria-label": ariaLabel,
118
- className,
119
- size = "md",
120
- intent = "neutral",
121
- design = "ghost",
122
- children = /* @__PURE__ */ jsx5(CloseSVG, {}),
123
- ref,
124
- ...rest
125
- }) => {
126
- return /* @__PURE__ */ jsx5(
127
- Close,
128
- {
129
- "data-spark-component": "dialog-close-button",
130
- "data-part": "close",
131
- ref,
132
- className: cx2(["absolute", "top-md", "right-xl"], className),
133
- asChild: true,
134
- ...rest,
135
- children: /* @__PURE__ */ jsx5(IconButton, { intent, size, design, "aria-label": ariaLabel, children: /* @__PURE__ */ jsx5(Icon, { children }) })
136
- }
137
- );
138
- };
139
- var CloseButton = Object.assign(Root, {
140
- id: "CloseButton"
141
- });
142
- Root.displayName = "Dialog.CloseButton";
143
-
144
- // src/dialog/DialogContent.tsx
145
- import { Dialog as RadixDialog3 } from "radix-ui";
146
- import { useEffect as useEffect2 } from "react";
147
-
148
- // src/dialog/DialogContent.styles.tsx
149
- import { cva } from "class-variance-authority";
150
- var dialogContentStyles = cva(
151
- [
152
- "z-modal flex flex-col bg-surface group",
153
- "focus-visible:outline-hidden focus-visible:u-outline",
154
- "[&:not(:has(footer))]:pb-lg",
155
- "[&:not(:has(header))]:pt-lg"
156
- ],
157
- {
158
- variants: {
159
- size: {
160
- fullscreen: "fixed size-full top-0 left-0",
161
- sm: "max-w-sz-480",
162
- md: "max-w-sz-672",
163
- lg: "max-w-sz-864"
164
- },
165
- isNarrow: {
166
- true: [],
167
- false: []
168
- }
169
- },
170
- compoundVariants: [
171
- {
172
- size: ["sm", "md", "lg"],
173
- class: [
174
- "fixed top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2",
175
- "max-h-[80%]",
176
- "shadow-md rounded-lg",
177
- "data-[state=open]:animate-fade-in",
178
- "data-[state=closed]:animate-fade-out"
179
- ]
180
- },
181
- {
182
- size: ["sm", "md", "lg"],
183
- isNarrow: false,
184
- class: ["w-full"]
185
- }
186
- ],
187
- defaultVariants: {
188
- size: "md",
189
- isNarrow: false
190
- }
191
- }
192
- );
193
-
194
- // src/dialog/DialogContent.tsx
195
- import { jsx as jsx6 } from "react/jsx-runtime";
196
- var Content = ({
197
- children,
198
- className,
199
- isNarrow = false,
200
- size = "md",
201
- onInteractOutside,
202
- ref,
203
- ...rest
204
- }) => {
205
- const { setIsFullScreen } = useDialog();
206
- useEffect2(() => {
207
- if (size === "fullscreen") setIsFullScreen(true);
208
- return () => setIsFullScreen(false);
209
- }, [setIsFullScreen, size]);
210
- return /* @__PURE__ */ jsx6(
211
- RadixDialog3.Content,
212
- {
213
- "data-spark-component": "dialog-content",
214
- ref,
215
- className: dialogContentStyles({
216
- className,
217
- isNarrow,
218
- size
219
- }),
220
- onInteractOutside: (e) => {
221
- const isForegroundElement = e.target.closest(".z-toast, .z-popover");
222
- if (isForegroundElement) {
223
- e.preventDefault();
224
- }
225
- onInteractOutside?.(e);
226
- },
227
- ...rest,
228
- children
229
- }
230
- );
231
- };
232
- Content.displayName = "Dialog.Content";
233
-
234
- // src/dialog/DialogDescription.tsx
235
- import { Dialog as RadixDialog4 } from "radix-ui";
236
- import { jsx as jsx7 } from "react/jsx-runtime";
237
- var Description = (props) => /* @__PURE__ */ jsx7(RadixDialog4.Description, { "data-spark-component": "dialog-description", ...props });
238
- Description.displayName = "Dialog.Description";
239
-
240
- // src/dialog/DialogFooter.tsx
241
- import { cx as cx3 } from "class-variance-authority";
242
- import { jsx as jsx8 } from "react/jsx-runtime";
243
- var Footer = ({ children, className, ref, ...rest }) => /* @__PURE__ */ jsx8(
244
- "footer",
245
- {
246
- "data-spark-component": "dialog-footer",
247
- ref,
248
- className: cx3(className, ["px-xl", "py-lg"]),
249
- ...rest,
250
- children
251
- }
252
- );
253
- Footer.displayName = "Dialog.Footer";
254
-
255
- // src/dialog/DialogHeader.tsx
256
- import { cx as cx4 } from "class-variance-authority";
257
- import { jsx as jsx9 } from "react/jsx-runtime";
258
- var Header = ({ children, className, ref, ...rest }) => /* @__PURE__ */ jsx9(
259
- "header",
260
- {
261
- "data-spark-component": "dialog-header",
262
- ref,
263
- className: cx4(className, ["px-xl", "py-lg"]),
264
- ...rest,
265
- children
266
- }
267
- );
268
- Header.displayName = "Dialog.Header";
269
-
270
- // src/dialog/DialogOverlay.tsx
271
- import { cx as cx5 } from "class-variance-authority";
272
- import { Dialog as RadixDialog5 } from "radix-ui";
273
- import { jsx as jsx10 } from "react/jsx-runtime";
274
- var Overlay = ({ className, ref, ...rest }) => {
275
- const { isFullScreen } = useDialog();
276
- return /* @__PURE__ */ jsx10(
277
- RadixDialog5.Overlay,
278
- {
279
- "data-spark-component": "dialog-overlay",
280
- ref,
281
- className: cx5(
282
- isFullScreen ? "hidden" : "fixed",
283
- ["top-0", "left-0", "w-screen", "h-screen", "z-overlay"],
284
- ["bg-overlay/dim-1"],
285
- ["data-[state=open]:animate-fade-in"],
286
- ["data-[state=closed]:animate-fade-out"],
287
- className
288
- ),
289
- ...rest
290
- }
291
- );
292
- };
293
- Overlay.displayName = "Dialog.Overlay";
294
-
295
- // src/dialog/DialogPortal.tsx
296
- import { Dialog as RadixDialog6 } from "radix-ui";
297
- import { jsx as jsx11 } from "react/jsx-runtime";
298
- var Portal = ({ children, ...rest }) => /* @__PURE__ */ jsx11(RadixDialog6.Portal, { ...rest, children });
299
- Portal.displayName = "Dialog.Portal";
300
-
301
- // src/dialog/DialogTitle.tsx
302
- import { cx as cx6 } from "class-variance-authority";
303
- import { Dialog as RadixDialog7 } from "radix-ui";
304
- import { jsx as jsx12 } from "react/jsx-runtime";
305
- var Title = ({ className, ref, ...others }) => {
306
- return /* @__PURE__ */ jsx12(
307
- RadixDialog7.Title,
308
- {
309
- "data-spark-component": "dialog-title",
310
- ref,
311
- className: cx6(
312
- "text-headline-1 text-on-surface",
313
- "group-has-data-[part=close]:pr-3xl",
314
- className
315
- ),
316
- ...others
317
- }
318
- );
319
- };
320
- Title.displayName = "Dialog.Title";
321
-
322
- // src/dialog/DialogTrigger.tsx
323
- import { Dialog as RadixDialog8 } from "radix-ui";
324
- import { jsx as jsx13 } from "react/jsx-runtime";
325
- var Trigger = (props) => /* @__PURE__ */ jsx13(RadixDialog8.Trigger, { "data-spark-component": "dialog-trigger", ...props });
326
- Trigger.displayName = "Dialog.Trigger";
327
-
328
- // src/dialog/index.ts
329
- var Dialog2 = Object.assign(Dialog, {
330
- Trigger,
331
- Portal,
332
- Overlay,
333
- Content,
334
- Header,
335
- Body,
336
- Footer,
337
- Close,
338
- CloseButton,
339
- Title,
340
- Description
341
- });
342
- Dialog2.displayName = "Dialog";
343
- Dialog2.Trigger.displayName = "Dialog.Trigger";
344
- Trigger.displayName = "Dialog.Trigger";
345
- Portal.displayName = "Dialog.Portal";
346
- Overlay.displayName = "Dialog.Overlay";
347
- Content.displayName = "Dialog.Content";
348
- Header.displayName = "Dialog.Header";
349
- Body.displayName = "Dialog.Body";
350
- Footer.displayName = "Dialog.Footer";
351
- CloseButton.displayName = "Dialog.CloseButton";
352
- Title.displayName = "Dialog.Title";
353
- Description.displayName = "Dialog.Description";
354
-
355
- export {
356
- Dialog2 as Dialog
357
- };
358
- //# sourceMappingURL=chunk-WA56YHV3.mjs.map