@spark-ui/components 10.22.1 → 11.0.1
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.
- package/package.json +5 -5
- package/dist/DialogTrigger-woU7vsJi.d.ts +0 -142
- package/dist/Input-N8AWWSmt.d.ts +0 -41
- package/dist/InputTrailingIcon-ZZx8PoJy.d.ts +0 -20
- package/dist/LabelRequiredIndicator-DRnCzHMU.d.ts +0 -19
- package/dist/accordion/index.d.ts +0 -73
- package/dist/accordion/index.js +0 -325
- package/dist/accordion/index.js.map +0 -1
- package/dist/alert-dialog/index.d.ts +0 -119
- package/dist/alert-dialog/index.js +0 -1554
- package/dist/alert-dialog/index.js.map +0 -1
- package/dist/avatar/index.d.ts +0 -66
- package/dist/avatar/index.js +0 -1303
- package/dist/avatar/index.js.map +0 -1
- package/dist/badge/index.d.ts +0 -47
- package/dist/badge/index.js +0 -122
- package/dist/badge/index.js.map +0 -1
- package/dist/breadcrumb/index.d.ts +0 -64
- package/dist/breadcrumb/index.js +0 -327
- package/dist/breadcrumb/index.js.map +0 -1
- package/dist/button/index.d.ts +0 -41
- package/dist/button/index.js +0 -935
- package/dist/button/index.js.map +0 -1
- package/dist/card/index.d.ts +0 -61
- package/dist/card/index.js +0 -502
- package/dist/card/index.js.map +0 -1
- package/dist/carousel/index.d.ts +0 -261
- package/dist/carousel/index.js +0 -1801
- package/dist/carousel/index.js.map +0 -1
- package/dist/checkbox/index.d.ts +0 -120
- package/dist/checkbox/index.js +0 -511
- package/dist/checkbox/index.js.map +0 -1
- package/dist/chip/index.d.ts +0 -97
- package/dist/chip/index.js +0 -908
- package/dist/chip/index.js.map +0 -1
- package/dist/collapsible/index.d.ts +0 -43
- package/dist/collapsible/index.js +0 -109
- package/dist/collapsible/index.js.map +0 -1
- package/dist/combobox/index.d.ts +0 -287
- package/dist/combobox/index.js +0 -2588
- package/dist/combobox/index.js.map +0 -1
- package/dist/dialog/index.d.ts +0 -33
- package/dist/dialog/index.js +0 -1389
- package/dist/dialog/index.js.map +0 -1
- package/dist/divider/index.d.ts +0 -61
- package/dist/divider/index.js +0 -224
- package/dist/divider/index.js.map +0 -1
- package/dist/drawer/index.d.ts +0 -152
- package/dist/drawer/index.js +0 -1400
- package/dist/drawer/index.js.map +0 -1
- package/dist/dropdown/index.d.ts +0 -233
- package/dist/dropdown/index.js +0 -2051
- package/dist/dropdown/index.js.map +0 -1
- package/dist/form-field/index.d.ts +0 -186
- package/dist/form-field/index.js +0 -553
- package/dist/form-field/index.js.map +0 -1
- package/dist/icon/index.d.ts +0 -28
- package/dist/icon/index.js +0 -127
- package/dist/icon/index.js.map +0 -1
- package/dist/icon-button/index.d.ts +0 -16
- package/dist/icon-button/index.js +0 -980
- package/dist/icon-button/index.js.map +0 -1
- package/dist/input/index.d.ts +0 -78
- package/dist/input/index.js +0 -724
- package/dist/input/index.js.map +0 -1
- package/dist/kbd/index.d.ts +0 -9
- package/dist/kbd/index.js +0 -47
- package/dist/kbd/index.js.map +0 -1
- package/dist/label/index.d.ts +0 -11
- package/dist/label/index.js +0 -78
- package/dist/label/index.js.map +0 -1
- package/dist/link-box/index.d.ts +0 -34
- package/dist/link-box/index.js +0 -92
- package/dist/link-box/index.js.map +0 -1
- package/dist/pagination/index.d.ts +0 -143
- package/dist/pagination/index.js +0 -1353
- package/dist/pagination/index.js.map +0 -1
- package/dist/popover/index.d.ts +0 -93
- package/dist/popover/index.js +0 -1339
- package/dist/popover/index.js.map +0 -1
- package/dist/portal/index.d.ts +0 -13
- package/dist/portal/index.js +0 -37
- package/dist/portal/index.js.map +0 -1
- package/dist/progress/index.d.ts +0 -48
- package/dist/progress/index.js +0 -223
- package/dist/progress/index.js.map +0 -1
- package/dist/progress-tracker/index.d.ts +0 -80
- package/dist/progress-tracker/index.js +0 -571
- package/dist/progress-tracker/index.js.map +0 -1
- package/dist/radio-group/index.d.ts +0 -100
- package/dist/radio-group/index.js +0 -318
- package/dist/radio-group/index.js.map +0 -1
- package/dist/rating/index.d.ts +0 -78
- package/dist/rating/index.js +0 -363
- package/dist/rating/index.js.map +0 -1
- package/dist/scrolling-list/index.d.ts +0 -118
- package/dist/scrolling-list/index.js +0 -1426
- package/dist/scrolling-list/index.js.map +0 -1
- package/dist/segmented-gauge/index.d.ts +0 -100
- package/dist/segmented-gauge/index.js +0 -277
- package/dist/segmented-gauge/index.js.map +0 -1
- package/dist/select/index.d.ts +0 -167
- package/dist/select/index.js +0 -581
- package/dist/select/index.js.map +0 -1
- package/dist/skeleton/index.d.ts +0 -67
- package/dist/skeleton/index.js +0 -206
- package/dist/skeleton/index.js.map +0 -1
- package/dist/slider/index.d.ts +0 -97
- package/dist/slider/index.js +0 -220
- package/dist/slider/index.js.map +0 -1
- package/dist/slot/index.d.ts +0 -16
- package/dist/slot/index.js +0 -51
- package/dist/slot/index.js.map +0 -1
- package/dist/snackbar/index.d.ts +0 -158
- package/dist/snackbar/index.js +0 -1756
- package/dist/snackbar/index.js.map +0 -1
- package/dist/spinner/index.d.ts +0 -21
- package/dist/spinner/index.js +0 -139
- package/dist/spinner/index.js.map +0 -1
- package/dist/stepper/index.d.ts +0 -81
- package/dist/stepper/index.js +0 -1847
- package/dist/stepper/index.js.map +0 -1
- package/dist/switch/index.d.ts +0 -64
- package/dist/switch/index.js +0 -327
- package/dist/switch/index.js.map +0 -1
- package/dist/tabs/index.d.ts +0 -103
- package/dist/tabs/index.js +0 -1376
- package/dist/tabs/index.js.map +0 -1
- package/dist/tag/index.d.ts +0 -29
- package/dist/tag/index.js +0 -283
- package/dist/tag/index.js.map +0 -1
- package/dist/text-link/index.d.ts +0 -20
- package/dist/text-link/index.js +0 -100
- package/dist/text-link/index.js.map +0 -1
- package/dist/textarea/index.d.ts +0 -57
- package/dist/textarea/index.js +0 -797
- package/dist/textarea/index.js.map +0 -1
- package/dist/toast/index.d.ts +0 -56
- package/dist/toast/index.js +0 -1412
- package/dist/toast/index.js.map +0 -1
- package/dist/visually-hidden/index.d.ts +0 -16
- package/dist/visually-hidden/index.js +0 -67
- package/dist/visually-hidden/index.js.map +0 -1
package/dist/button/index.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/button/index.ts","../../src/button/Button.tsx","../../src/slot/Slot.tsx","../../src/visually-hidden/VisuallyHidden.tsx","../../src/spinner/Spinner.styles.tsx","../../src/spinner/Spinner.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":["export * from './Button'\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'>,\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 { Slot as RadixSlot } from 'radix-ui'\nimport {\n cloneElement,\n HTMLAttributes,\n isValidElement,\n PropsWithChildren,\n ReactNode,\n Ref,\n} from 'react'\n\nexport const Slottable: typeof RadixSlot.Slottable = RadixSlot.Slottable\n\nexport type SlotProps = PropsWithChildren<HTMLAttributes<HTMLElement>> & {\n ref?: Ref<HTMLElement>\n}\n\nexport const Slot = ({ ref, ...props }: SlotProps) => {\n return <RadixSlot.Root ref={ref} {...props} />\n}\n\n/**\n * When using Radix `Slot` component, it will consider its first child to merge its props with.\n * In some cases, you might need to wrap the top child with additional markup without breaking this behaviour.\n */\nexport const wrapPolymorphicSlot = (\n asChild: boolean | undefined,\n children: ReactNode,\n callback: (children: ReactNode) => ReactNode\n) => {\n if (!asChild) return callback(children) // If polymorphic behaviour is not used, we keep the original children\n\n return isValidElement(children)\n ? cloneElement(\n children,\n undefined,\n callback((children.props as { children: ReactNode }).children)\n )\n : null\n}\n","import { HTMLAttributes, PropsWithChildren, Ref } from 'react'\n\nimport { Slot } from '../slot'\n\nexport type VisuallyHiddenProps = PropsWithChildren<HTMLAttributes<HTMLElement>> & {\n /**\n * Change the default rendered element for the one passed as a child, merging their props and behavior.\n */\n asChild?: boolean\n ref?: Ref<HTMLElement>\n}\n\nexport const VisuallyHidden = ({ asChild = false, ref, ...props }: VisuallyHiddenProps) => {\n const Component = asChild ? Slot : 'span'\n\n return (\n <Component\n {...props}\n ref={ref}\n style={{\n // See: https://github.com/twbs/bootstrap/blob/main/scss/mixins/_visually-hidden.scss\n position: 'absolute',\n border: 0,\n width: 1,\n height: 1,\n padding: 0,\n margin: -1,\n overflow: 'hidden',\n clip: 'rect(0, 0, 0, 0)',\n whiteSpace: 'nowrap',\n wordWrap: 'normal',\n ...props.style,\n }}\n />\n )\n}\n\nVisuallyHidden.displayName = 'VisuallyHidden'\n","import { makeVariants } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nconst defaultVariants = {\n intent: 'current',\n size: 'current',\n isBackgroundVisible: false,\n} as const\n\nexport const spinnerStyles = cva(\n ['inline-block', 'border-solid', 'rounded-full', 'border-md', 'animate-spin'],\n {\n variants: {\n /**\n * Use `size` prop to set the size of the spinner. If you want to set the full size for the spinner, don't forget to add a wrapping container with its own size.\n */\n size: {\n current: ['u-current-font-size'],\n sm: ['w-sz-20', 'h-sz-20'],\n md: ['w-sz-28', 'h-sz-28'],\n full: ['w-full', 'h-full'],\n },\n /**\n * Color scheme of the spinner.\n */\n intent: makeVariants<\n 'intent',\n [\n 'current',\n 'main',\n 'support',\n 'accent',\n 'basic',\n 'success',\n 'alert',\n 'error',\n 'info',\n 'neutral',\n ]\n >({\n current: ['border-current'],\n main: ['border-main'],\n support: ['border-support'],\n accent: ['border-accent'],\n basic: ['border-basic'],\n success: ['border-success'],\n alert: ['border-alert'],\n error: ['border-error'],\n info: ['border-info'],\n neutral: ['border-neutral'],\n }),\n /**\n * Size of the button.\n */\n isBackgroundVisible: {\n true: ['border-b-neutral-container', 'border-l-neutral-container'],\n false: ['border-b-transparent', 'border-l-transparent'],\n },\n },\n defaultVariants,\n }\n)\n\nexport type SpinnerStylesProps = VariantProps<typeof spinnerStyles>\n","import { ComponentPropsWithRef, PropsWithChildren } from 'react'\n\nimport { VisuallyHidden } from '../visually-hidden'\nimport { spinnerStyles, SpinnerStylesProps } from './Spinner.styles'\n\nexport interface SpinnerProps extends ComponentPropsWithRef<'div'>, SpinnerStylesProps {\n /**\n * Use `label` prop for accessibility, it is important to add a fallback loading text. This text will be visible to screen readers.\n */\n label?: string\n}\n\nexport const Spinner = ({\n className,\n size = 'current',\n intent = 'current',\n label,\n isBackgroundVisible,\n ref,\n ...others\n}: PropsWithChildren<SpinnerProps>) => {\n return (\n <span\n role=\"status\"\n data-spark-component=\"spinner\"\n ref={ref}\n className={spinnerStyles({ className, size, intent, isBackgroundVisible })}\n {...others}\n >\n {label && <VisuallyHidden>{label}</VisuallyHidden>}\n </span>\n )\n}\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":["import_class_variance_authority","import_react","RadixSlot","import_jsx_runtime","import_jsx_runtime","import_internal_utils","import_class_variance_authority","import_internal_utils","import_internal_utils","import_internal_utils","import_internal_utils","import_internal_utils","import_jsx_runtime"]}
|
package/dist/card/index.d.ts
DELETED
|
@@ -1,61 +0,0 @@
|
|
|
1
|
-
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
-
import * as class_variance_authority_types from 'class-variance-authority/types';
|
|
3
|
-
import { VariantProps } from 'class-variance-authority';
|
|
4
|
-
import { ComponentProps } from 'react';
|
|
5
|
-
|
|
6
|
-
declare const backdropStyles: (props?: ({
|
|
7
|
-
animation?: "none" | "pulse" | null | undefined;
|
|
8
|
-
intent?: "main" | "support" | "accent" | "basic" | "success" | "alert" | "danger" | "info" | "neutral" | "surface" | "surfaceInverse" | null | undefined;
|
|
9
|
-
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
10
|
-
type BackdropStylesProps = VariantProps<typeof backdropStyles>;
|
|
11
|
-
interface BackdropProps extends BackdropStylesProps {
|
|
12
|
-
className?: string;
|
|
13
|
-
}
|
|
14
|
-
declare const Backdrop: {
|
|
15
|
-
({ intent, animation, ...props }: BackdropProps): react_jsx_runtime.JSX.Element;
|
|
16
|
-
displayName: string;
|
|
17
|
-
};
|
|
18
|
-
|
|
19
|
-
declare const cardStyles: (props?: ({
|
|
20
|
-
design?: "filled" | "outlined" | "tinted" | null | undefined;
|
|
21
|
-
hasBackdrop?: boolean | null | undefined;
|
|
22
|
-
intent?: "main" | "support" | "accent" | "basic" | "success" | "alert" | "danger" | "info" | "neutral" | "surface" | "surfaceInverse" | null | undefined;
|
|
23
|
-
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
24
|
-
type CardStylesProps = VariantProps<typeof cardStyles>;
|
|
25
|
-
|
|
26
|
-
interface CardProps extends ComponentProps<'div'>, CardStylesProps {
|
|
27
|
-
/**
|
|
28
|
-
* Change the component to the HTML tag or custom component of the only child.
|
|
29
|
-
*/
|
|
30
|
-
asChild?: boolean;
|
|
31
|
-
/**
|
|
32
|
-
* Whether the card should have an inset padding.
|
|
33
|
-
*/
|
|
34
|
-
inset?: boolean;
|
|
35
|
-
}
|
|
36
|
-
declare const Card$1: {
|
|
37
|
-
({ children, design, intent, inset, asChild, className, ref, ...props }: CardProps): react_jsx_runtime.JSX.Element;
|
|
38
|
-
displayName: string;
|
|
39
|
-
};
|
|
40
|
-
|
|
41
|
-
interface ContentProps extends ComponentProps<'div'> {
|
|
42
|
-
/**
|
|
43
|
-
* Change the component to the HTML tag or custom component of the only child.
|
|
44
|
-
*/
|
|
45
|
-
asChild?: boolean;
|
|
46
|
-
/**
|
|
47
|
-
* Whether the card should have an inset padding.
|
|
48
|
-
*/
|
|
49
|
-
inset?: boolean;
|
|
50
|
-
}
|
|
51
|
-
declare const Content: {
|
|
52
|
-
({ children, inset, asChild, className, ref, ...props }: ContentProps): react_jsx_runtime.JSX.Element;
|
|
53
|
-
displayName: string;
|
|
54
|
-
};
|
|
55
|
-
|
|
56
|
-
declare const Card: typeof Card$1 & {
|
|
57
|
-
Content: typeof Content;
|
|
58
|
-
Backdrop: typeof Backdrop;
|
|
59
|
-
};
|
|
60
|
-
|
|
61
|
-
export { Card, type CardProps };
|
package/dist/card/index.js
DELETED
|
@@ -1,502 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __defProp = Object.defineProperty;
|
|
3
|
-
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
-
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
-
var __export = (target, all) => {
|
|
7
|
-
for (var name in all)
|
|
8
|
-
__defProp(target, name, { get: all[name], enumerable: true });
|
|
9
|
-
};
|
|
10
|
-
var __copyProps = (to, from, except, desc) => {
|
|
11
|
-
if (from && typeof from === "object" || typeof from === "function") {
|
|
12
|
-
for (let key of __getOwnPropNames(from))
|
|
13
|
-
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
14
|
-
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
15
|
-
}
|
|
16
|
-
return to;
|
|
17
|
-
};
|
|
18
|
-
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
|
-
|
|
20
|
-
// src/card/index.ts
|
|
21
|
-
var card_exports = {};
|
|
22
|
-
__export(card_exports, {
|
|
23
|
-
Card: () => Card2
|
|
24
|
-
});
|
|
25
|
-
module.exports = __toCommonJS(card_exports);
|
|
26
|
-
|
|
27
|
-
// src/card/Backdrop.tsx
|
|
28
|
-
var import_internal_utils = require("@spark-ui/internal-utils");
|
|
29
|
-
var import_class_variance_authority = require("class-variance-authority");
|
|
30
|
-
var import_jsx_runtime = require("react/jsx-runtime");
|
|
31
|
-
var backdropStyles = (0, import_class_variance_authority.cva)(
|
|
32
|
-
[
|
|
33
|
-
"default:bg-surface default:bg-gradient-to-r absolute inset-x-0 top-0",
|
|
34
|
-
"h-sz-16",
|
|
35
|
-
"default:rounded-t-lg",
|
|
36
|
-
"bg-[length:200%_100%] bg-position-[0%_0%]"
|
|
37
|
-
],
|
|
38
|
-
{
|
|
39
|
-
variants: {
|
|
40
|
-
animation: {
|
|
41
|
-
none: "",
|
|
42
|
-
pulse: "animate-standalone-backdrop-pulse"
|
|
43
|
-
},
|
|
44
|
-
intent: (0, import_internal_utils.makeVariants)({
|
|
45
|
-
main: ["default:from-main/dim-4 default:via-main/dim-2 default:to-main/dim-4"],
|
|
46
|
-
support: ["default:from-support/dim-4 default:via-support/dim-2 default:to-support/dim-4"],
|
|
47
|
-
accent: ["default:from-accent/dim-4 default:via-accent/dim-2 default:to-accent/dim-4"],
|
|
48
|
-
basic: ["default:from-basic/dim-4 default:via-basic/dim-2 default:to-basic/dim-4"],
|
|
49
|
-
success: ["default:from-success/dim-4 default:via-success/dim-2 default:to-success/dim-4"],
|
|
50
|
-
alert: ["default:from-alert/dim-4 default:via-alert/dim-2 default:to-alert/dim-4"],
|
|
51
|
-
danger: ["default:from-error/dim-4 default:via-error/dim-2 default:to-error/dim-4"],
|
|
52
|
-
info: ["default:from-info/dim-4 default:via-info/dim-2 default:to-info/dim-4"],
|
|
53
|
-
neutral: ["default:from-neutral/dim-4 default:via-neutral/dim-2 default:to-neutral/dim-4"],
|
|
54
|
-
surface: ["default:from-outline/dim-4 default:via-outline/dim-2 default:to-outline/dim-4"],
|
|
55
|
-
surfaceInverse: [
|
|
56
|
-
"default:from-surface/dim-4 default:via-surface/dim-2 default:to-surface/dim-4"
|
|
57
|
-
]
|
|
58
|
-
})
|
|
59
|
-
},
|
|
60
|
-
defaultVariants: {
|
|
61
|
-
intent: "main",
|
|
62
|
-
animation: "none"
|
|
63
|
-
}
|
|
64
|
-
}
|
|
65
|
-
);
|
|
66
|
-
var Backdrop = ({ intent = "main", animation = "none", ...props }) => {
|
|
67
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: backdropStyles({ intent, animation }), ...props });
|
|
68
|
-
};
|
|
69
|
-
Backdrop.displayName = "Card.Backdrop";
|
|
70
|
-
|
|
71
|
-
// src/slot/Slot.tsx
|
|
72
|
-
var import_radix_ui = require("radix-ui");
|
|
73
|
-
var import_react = require("react");
|
|
74
|
-
var import_jsx_runtime2 = require("react/jsx-runtime");
|
|
75
|
-
var Slottable = import_radix_ui.Slot.Slottable;
|
|
76
|
-
var Slot = ({ ref, ...props }) => {
|
|
77
|
-
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_radix_ui.Slot.Root, { ref, ...props });
|
|
78
|
-
};
|
|
79
|
-
|
|
80
|
-
// src/card/Card.styles.tsx
|
|
81
|
-
var import_internal_utils2 = require("@spark-ui/internal-utils");
|
|
82
|
-
var import_class_variance_authority2 = require("class-variance-authority");
|
|
83
|
-
var cardStyles = (0, import_class_variance_authority2.cva)(
|
|
84
|
-
[
|
|
85
|
-
"group relative bg-clip-padding default:rounded-lg focus-visible:u-outline",
|
|
86
|
-
"disabled:opacity-dim-3 disabled:cursor-not-allowed"
|
|
87
|
-
],
|
|
88
|
-
{
|
|
89
|
-
variants: {
|
|
90
|
-
design: {
|
|
91
|
-
filled: [],
|
|
92
|
-
outlined: ["border-sm"],
|
|
93
|
-
tinted: []
|
|
94
|
-
},
|
|
95
|
-
hasBackdrop: {
|
|
96
|
-
true: ["pt-md"]
|
|
97
|
-
},
|
|
98
|
-
/**
|
|
99
|
-
* Color scheme of the button.
|
|
100
|
-
*/
|
|
101
|
-
intent: (0, import_internal_utils2.makeVariants)({
|
|
102
|
-
main: [],
|
|
103
|
-
support: [],
|
|
104
|
-
accent: [],
|
|
105
|
-
basic: [],
|
|
106
|
-
success: [],
|
|
107
|
-
alert: [],
|
|
108
|
-
danger: [],
|
|
109
|
-
info: [],
|
|
110
|
-
neutral: [],
|
|
111
|
-
surface: [],
|
|
112
|
-
surfaceInverse: []
|
|
113
|
-
})
|
|
114
|
-
},
|
|
115
|
-
compoundVariants: [
|
|
116
|
-
// OUTLINED
|
|
117
|
-
{ intent: "main", design: "outlined", class: (0, import_internal_utils2.tw)(["border-main"]) },
|
|
118
|
-
{ intent: "support", design: "outlined", class: (0, import_internal_utils2.tw)(["border-support"]) },
|
|
119
|
-
{ intent: "accent", design: "outlined", class: (0, import_internal_utils2.tw)(["border-accent"]) },
|
|
120
|
-
{ intent: "basic", design: "outlined", class: (0, import_internal_utils2.tw)(["border-basic"]) },
|
|
121
|
-
{ intent: "success", design: "outlined", class: (0, import_internal_utils2.tw)(["border-success"]) },
|
|
122
|
-
{ intent: "alert", design: "outlined", class: (0, import_internal_utils2.tw)(["border-alert"]) },
|
|
123
|
-
{ intent: "danger", design: "outlined", class: (0, import_internal_utils2.tw)(["border-error"]) },
|
|
124
|
-
{ intent: "info", design: "outlined", class: (0, import_internal_utils2.tw)(["border-info"]) },
|
|
125
|
-
{ intent: "neutral", design: "outlined", class: (0, import_internal_utils2.tw)(["border-neutral"]) },
|
|
126
|
-
{ intent: "surface", design: "outlined", class: (0, import_internal_utils2.tw)(["border-outline"]) }
|
|
127
|
-
],
|
|
128
|
-
defaultVariants: {
|
|
129
|
-
design: "filled",
|
|
130
|
-
intent: "surface"
|
|
131
|
-
}
|
|
132
|
-
}
|
|
133
|
-
);
|
|
134
|
-
|
|
135
|
-
// src/card/context.tsx
|
|
136
|
-
var import_react2 = require("react");
|
|
137
|
-
var CardContext = (0, import_react2.createContext)(void 0);
|
|
138
|
-
var useCardContext = () => {
|
|
139
|
-
const context = (0, import_react2.useContext)(CardContext);
|
|
140
|
-
if (!context) {
|
|
141
|
-
throw new Error("useCardContext must be used within a Card component");
|
|
142
|
-
}
|
|
143
|
-
return context;
|
|
144
|
-
};
|
|
145
|
-
|
|
146
|
-
// src/card/utils.ts
|
|
147
|
-
var import_react3 = require("react");
|
|
148
|
-
var MOUSE_EVENTS = [
|
|
149
|
-
"onClick",
|
|
150
|
-
"onMouseDown",
|
|
151
|
-
"onMouseUp",
|
|
152
|
-
"onMouseEnter",
|
|
153
|
-
"onMouseLeave",
|
|
154
|
-
"onMouseMove",
|
|
155
|
-
"onMouseOver",
|
|
156
|
-
"onMouseOut",
|
|
157
|
-
"onDoubleClick",
|
|
158
|
-
"onContextMenu"
|
|
159
|
-
];
|
|
160
|
-
var hasBackdrop = (children) => {
|
|
161
|
-
let backdropFound = false;
|
|
162
|
-
const searchForBackdrop = (node) => {
|
|
163
|
-
if (backdropFound) return;
|
|
164
|
-
import_react3.Children.forEach(node, (child) => {
|
|
165
|
-
if (backdropFound) return;
|
|
166
|
-
if ((0, import_react3.isValidElement)(child)) {
|
|
167
|
-
const isBackdropComponent = typeof child.type === "function" && child.type.displayName === "Card.Backdrop";
|
|
168
|
-
if (isBackdropComponent) {
|
|
169
|
-
backdropFound = true;
|
|
170
|
-
return;
|
|
171
|
-
}
|
|
172
|
-
const hasChildren = child.props && typeof child.props === "object" && "children" in child.props;
|
|
173
|
-
if (hasChildren) {
|
|
174
|
-
const childChildren = child.props.children;
|
|
175
|
-
if (childChildren !== void 0 && childChildren !== null) {
|
|
176
|
-
searchForBackdrop(childChildren);
|
|
177
|
-
}
|
|
178
|
-
}
|
|
179
|
-
}
|
|
180
|
-
});
|
|
181
|
-
};
|
|
182
|
-
searchForBackdrop(children);
|
|
183
|
-
return backdropFound;
|
|
184
|
-
};
|
|
185
|
-
var isInteractive = (children, asChild, props) => {
|
|
186
|
-
const hasMouseEventHandlers = MOUSE_EVENTS.some((event) => event in props);
|
|
187
|
-
if (hasMouseEventHandlers) {
|
|
188
|
-
return true;
|
|
189
|
-
}
|
|
190
|
-
if (!asChild) {
|
|
191
|
-
return false;
|
|
192
|
-
}
|
|
193
|
-
const child = import_react3.Children.only(children);
|
|
194
|
-
if (!(0, import_react3.isValidElement)(child)) {
|
|
195
|
-
return false;
|
|
196
|
-
}
|
|
197
|
-
const interactiveElements = ["a", "button"];
|
|
198
|
-
const isInteractiveElement = typeof child.type === "string" && interactiveElements.includes(child.type);
|
|
199
|
-
if (isInteractiveElement) {
|
|
200
|
-
return true;
|
|
201
|
-
}
|
|
202
|
-
const childProps = child.props;
|
|
203
|
-
const hasChildEventHandlers = MOUSE_EVENTS.some((event) => event in childProps);
|
|
204
|
-
return hasChildEventHandlers;
|
|
205
|
-
};
|
|
206
|
-
|
|
207
|
-
// src/card/Card.tsx
|
|
208
|
-
var import_jsx_runtime3 = require("react/jsx-runtime");
|
|
209
|
-
var Card = ({
|
|
210
|
-
children,
|
|
211
|
-
design = "filled",
|
|
212
|
-
intent = "surface",
|
|
213
|
-
inset = false,
|
|
214
|
-
asChild,
|
|
215
|
-
className,
|
|
216
|
-
ref,
|
|
217
|
-
...props
|
|
218
|
-
}) => {
|
|
219
|
-
const Component = asChild ? Slot : "div";
|
|
220
|
-
const backdropDetected = hasBackdrop(children);
|
|
221
|
-
const interactiveDetected = isInteractive(children, asChild, props);
|
|
222
|
-
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
223
|
-
CardContext.Provider,
|
|
224
|
-
{
|
|
225
|
-
value: {
|
|
226
|
-
design,
|
|
227
|
-
intent,
|
|
228
|
-
hasBackdrop: backdropDetected,
|
|
229
|
-
inset,
|
|
230
|
-
isInteractive: interactiveDetected
|
|
231
|
-
},
|
|
232
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
233
|
-
Component,
|
|
234
|
-
{
|
|
235
|
-
"data-spark-component": "card",
|
|
236
|
-
"data-interactive": interactiveDetected,
|
|
237
|
-
ref,
|
|
238
|
-
className: cardStyles({
|
|
239
|
-
className,
|
|
240
|
-
design,
|
|
241
|
-
intent,
|
|
242
|
-
hasBackdrop: backdropDetected
|
|
243
|
-
}),
|
|
244
|
-
...props,
|
|
245
|
-
children
|
|
246
|
-
}
|
|
247
|
-
)
|
|
248
|
-
}
|
|
249
|
-
);
|
|
250
|
-
};
|
|
251
|
-
Card.displayName = "Card";
|
|
252
|
-
|
|
253
|
-
// src/card/Content.styles.tsx
|
|
254
|
-
var import_internal_utils3 = require("@spark-ui/internal-utils");
|
|
255
|
-
var import_class_variance_authority3 = require("class-variance-authority");
|
|
256
|
-
var contentStyles = (0, import_class_variance_authority3.cva)(
|
|
257
|
-
[
|
|
258
|
-
"relative h-full default:rounded-lg w-full focus-visible:u-outline",
|
|
259
|
-
"default:transition-colors default:duration-200 ease-linear"
|
|
260
|
-
],
|
|
261
|
-
{
|
|
262
|
-
variants: {
|
|
263
|
-
inset: {
|
|
264
|
-
false: ["default:p-lg"]
|
|
265
|
-
},
|
|
266
|
-
design: {
|
|
267
|
-
filled: [],
|
|
268
|
-
outlined: [
|
|
269
|
-
"default:bg-surface group-focus:bg-surface-hovered group-not-disabled:group-data-[interactive=true]:group-hover:bg-surface-hovered"
|
|
270
|
-
],
|
|
271
|
-
tinted: []
|
|
272
|
-
},
|
|
273
|
-
hasBackdrop: {
|
|
274
|
-
true: ["rounded-t-[16px_8px] "]
|
|
275
|
-
},
|
|
276
|
-
intent: (0, import_internal_utils3.makeVariants)({
|
|
277
|
-
main: [],
|
|
278
|
-
support: [],
|
|
279
|
-
accent: [],
|
|
280
|
-
basic: [],
|
|
281
|
-
success: [],
|
|
282
|
-
alert: [],
|
|
283
|
-
danger: [],
|
|
284
|
-
info: [],
|
|
285
|
-
neutral: [],
|
|
286
|
-
surface: [],
|
|
287
|
-
surfaceInverse: []
|
|
288
|
-
})
|
|
289
|
-
},
|
|
290
|
-
compoundVariants: [
|
|
291
|
-
// FILLED
|
|
292
|
-
{
|
|
293
|
-
intent: "main",
|
|
294
|
-
design: "filled",
|
|
295
|
-
class: (0, import_internal_utils3.tw)([
|
|
296
|
-
"bg-main text-on-main group-focus:bg-main-hovered",
|
|
297
|
-
"group-not-disabled:group-data-[interactive=true]:group-hover:bg-main-hovered"
|
|
298
|
-
])
|
|
299
|
-
},
|
|
300
|
-
{
|
|
301
|
-
intent: "support",
|
|
302
|
-
design: "filled",
|
|
303
|
-
class: (0, import_internal_utils3.tw)([
|
|
304
|
-
"bg-support text-on-support group-focus:bg-support-hovered",
|
|
305
|
-
"group-not-disabled:group-data-[interactive=true]:group-hover:bg-support-hovered"
|
|
306
|
-
])
|
|
307
|
-
},
|
|
308
|
-
{
|
|
309
|
-
intent: "accent",
|
|
310
|
-
design: "filled",
|
|
311
|
-
class: (0, import_internal_utils3.tw)([
|
|
312
|
-
"bg-accent text-on-accent group-focus:bg-accent-hovered",
|
|
313
|
-
"group-not-disabled:group-data-[interactive=true]:group-hover:bg-accent-hovered"
|
|
314
|
-
])
|
|
315
|
-
},
|
|
316
|
-
{
|
|
317
|
-
intent: "basic",
|
|
318
|
-
design: "filled",
|
|
319
|
-
class: (0, import_internal_utils3.tw)([
|
|
320
|
-
"bg-basic text-on-basic group-focus:bg-basic-hovered",
|
|
321
|
-
"group-not-disabled:group-data-[interactive=true]:group-hover:bg-basic-hovered"
|
|
322
|
-
])
|
|
323
|
-
},
|
|
324
|
-
{
|
|
325
|
-
intent: "success",
|
|
326
|
-
design: "filled",
|
|
327
|
-
class: (0, import_internal_utils3.tw)([
|
|
328
|
-
"bg-success text-on-success group-focus:bg-success-hovered",
|
|
329
|
-
"group-not-disabled:group-data-[interactive=true]:group-hover:bg-success-hovered"
|
|
330
|
-
])
|
|
331
|
-
},
|
|
332
|
-
{
|
|
333
|
-
intent: "alert",
|
|
334
|
-
design: "filled",
|
|
335
|
-
class: (0, import_internal_utils3.tw)([
|
|
336
|
-
"bg-alert text-on-alert group-focus:bg-alert-hovered",
|
|
337
|
-
"group-not-disabled:group-data-[interactive=true]:group-hover:bg-alert-hovered"
|
|
338
|
-
])
|
|
339
|
-
},
|
|
340
|
-
{
|
|
341
|
-
intent: "danger",
|
|
342
|
-
design: "filled",
|
|
343
|
-
class: (0, import_internal_utils3.tw)([
|
|
344
|
-
"text-on-error bg-error group-focus:bg-error-hovered",
|
|
345
|
-
"group-not-disabled:group-data-[interactive=true]:group-hover:bg-error-hovered"
|
|
346
|
-
])
|
|
347
|
-
},
|
|
348
|
-
{
|
|
349
|
-
intent: "info",
|
|
350
|
-
design: "filled",
|
|
351
|
-
class: (0, import_internal_utils3.tw)([
|
|
352
|
-
"text-on-error bg-info group-focus:bg-info-hovered",
|
|
353
|
-
"group-not-disabled:group-data-[interactive=true]:group-hover:bg-info-hovered"
|
|
354
|
-
])
|
|
355
|
-
},
|
|
356
|
-
{
|
|
357
|
-
intent: "neutral",
|
|
358
|
-
design: "filled",
|
|
359
|
-
class: (0, import_internal_utils3.tw)([
|
|
360
|
-
"bg-neutral text-on-neutral group-focus:bg-neutral-hovered",
|
|
361
|
-
"group-not-disabled:group-data-[interactive=true]:group-hover:bg-neutral-hovered"
|
|
362
|
-
])
|
|
363
|
-
},
|
|
364
|
-
{
|
|
365
|
-
intent: "surface",
|
|
366
|
-
design: "filled",
|
|
367
|
-
class: (0, import_internal_utils3.tw)([
|
|
368
|
-
"bg-surface text-on-surface group-focus:bg-surface-hovered",
|
|
369
|
-
"group-not-disabled:group-data-[interactive=true]:group-hover:bg-surface-hovered"
|
|
370
|
-
])
|
|
371
|
-
},
|
|
372
|
-
// OUTLINED
|
|
373
|
-
/**
|
|
374
|
-
* Outlined styles are handled by the Card component (parent)
|
|
375
|
-
*/
|
|
376
|
-
// TINTED
|
|
377
|
-
{
|
|
378
|
-
intent: "main",
|
|
379
|
-
design: "tinted",
|
|
380
|
-
class: (0, import_internal_utils3.tw)([
|
|
381
|
-
"bg-main-container text-on-main-container group-focus:bg-main-container-hovered",
|
|
382
|
-
"group-not-disabled:group-data-[interactive=true]:group-hover:bg-main-container-hovered"
|
|
383
|
-
])
|
|
384
|
-
},
|
|
385
|
-
{
|
|
386
|
-
intent: "support",
|
|
387
|
-
design: "tinted",
|
|
388
|
-
class: (0, import_internal_utils3.tw)([
|
|
389
|
-
"bg-support-container text-on-support-container group-focus:bg-support-container-hovered",
|
|
390
|
-
"group-not-disabled:group-data-[interactive=true]:group-hover:bg-support-container-hovered"
|
|
391
|
-
])
|
|
392
|
-
},
|
|
393
|
-
{
|
|
394
|
-
intent: "accent",
|
|
395
|
-
design: "tinted",
|
|
396
|
-
class: (0, import_internal_utils3.tw)([
|
|
397
|
-
"bg-accent-container text-on-accent-container group-focus:bg-accent-container-hovered",
|
|
398
|
-
"group-not-disabled:group-data-[interactive=true]:group-hover:bg-accent-container-hovered"
|
|
399
|
-
])
|
|
400
|
-
},
|
|
401
|
-
{
|
|
402
|
-
intent: "basic",
|
|
403
|
-
design: "tinted",
|
|
404
|
-
class: (0, import_internal_utils3.tw)([
|
|
405
|
-
"bg-basic-container text-on-basic-container group-focus:bg-basic-container-hovered"
|
|
406
|
-
])
|
|
407
|
-
},
|
|
408
|
-
{
|
|
409
|
-
intent: "success",
|
|
410
|
-
design: "tinted",
|
|
411
|
-
class: (0, import_internal_utils3.tw)([
|
|
412
|
-
"bg-success-container text-on-success-container group-focus:bg-success-container-hovered",
|
|
413
|
-
"group-not-disabled:group-data-[interactive=true]:group-hover:bg-success-container-hovered"
|
|
414
|
-
])
|
|
415
|
-
},
|
|
416
|
-
{
|
|
417
|
-
intent: "alert",
|
|
418
|
-
design: "tinted",
|
|
419
|
-
class: (0, import_internal_utils3.tw)([
|
|
420
|
-
"bg-alert-container text-on-alert-container group-focus:bg-alert-container-hovered",
|
|
421
|
-
"group-not-disabled:group-data-[interactive=true]:group-hover:bg-alert-container-hovered"
|
|
422
|
-
])
|
|
423
|
-
},
|
|
424
|
-
{
|
|
425
|
-
intent: "danger",
|
|
426
|
-
design: "tinted",
|
|
427
|
-
class: (0, import_internal_utils3.tw)([
|
|
428
|
-
"bg-error-container text-on-error-container group-focus:bg-error-container-hovered",
|
|
429
|
-
"group-not-disabled:group-data-[interactive=true]:group-hover:bg-error-container-hovered"
|
|
430
|
-
])
|
|
431
|
-
},
|
|
432
|
-
{
|
|
433
|
-
intent: "info",
|
|
434
|
-
design: "tinted",
|
|
435
|
-
class: (0, import_internal_utils3.tw)([
|
|
436
|
-
"bg-info-container text-on-info-container group-focus:bg-info-container-hovered",
|
|
437
|
-
"group-not-disabled:group-data-[interactive=true]:group-hover:bg-info-container-hovered"
|
|
438
|
-
])
|
|
439
|
-
},
|
|
440
|
-
{
|
|
441
|
-
intent: "neutral",
|
|
442
|
-
design: "tinted",
|
|
443
|
-
class: (0, import_internal_utils3.tw)([
|
|
444
|
-
"bg-neutral-container text-on-neutral-container group-focus:bg-neutral-container-hovered",
|
|
445
|
-
"group-not-disabled:group-data-[interactive=true]:group-hover:bg-neutral-container-hovered"
|
|
446
|
-
])
|
|
447
|
-
},
|
|
448
|
-
{
|
|
449
|
-
intent: "surface",
|
|
450
|
-
design: "tinted",
|
|
451
|
-
class: (0, import_internal_utils3.tw)([
|
|
452
|
-
"bg-surface text-on-surface group-focus:bg-surface-hovered",
|
|
453
|
-
"group-not-disabled:group-data-[interactive=true]:group-hover:bg-surface-hovered"
|
|
454
|
-
])
|
|
455
|
-
}
|
|
456
|
-
],
|
|
457
|
-
defaultVariants: {
|
|
458
|
-
design: "filled",
|
|
459
|
-
intent: "surface",
|
|
460
|
-
inset: false,
|
|
461
|
-
hasBackdrop: true
|
|
462
|
-
}
|
|
463
|
-
}
|
|
464
|
-
);
|
|
465
|
-
|
|
466
|
-
// src/card/Content.tsx
|
|
467
|
-
var import_jsx_runtime4 = require("react/jsx-runtime");
|
|
468
|
-
var Content = ({ children, inset, asChild, className, ref, ...props }) => {
|
|
469
|
-
const Component = asChild ? Slot : "div";
|
|
470
|
-
const { design, intent, hasBackdrop: hasBackdrop2 } = useCardContext();
|
|
471
|
-
return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
472
|
-
Component,
|
|
473
|
-
{
|
|
474
|
-
"data-spark-component": "card-content",
|
|
475
|
-
ref,
|
|
476
|
-
className: contentStyles({
|
|
477
|
-
className,
|
|
478
|
-
design,
|
|
479
|
-
intent,
|
|
480
|
-
inset,
|
|
481
|
-
hasBackdrop: hasBackdrop2
|
|
482
|
-
}),
|
|
483
|
-
...props,
|
|
484
|
-
children
|
|
485
|
-
}
|
|
486
|
-
);
|
|
487
|
-
};
|
|
488
|
-
Content.displayName = "Content";
|
|
489
|
-
|
|
490
|
-
// src/card/index.ts
|
|
491
|
-
var Card2 = Object.assign(Card, {
|
|
492
|
-
Content,
|
|
493
|
-
Backdrop
|
|
494
|
-
});
|
|
495
|
-
Card2.displayName = "Card";
|
|
496
|
-
Content.displayName = "Card.Content";
|
|
497
|
-
Backdrop.displayName = "Card.Backdrop";
|
|
498
|
-
// Annotate the CommonJS export names for ESM import in node:
|
|
499
|
-
0 && (module.exports = {
|
|
500
|
-
Card
|
|
501
|
-
});
|
|
502
|
-
//# sourceMappingURL=index.js.map
|