@spark-ui/components 16.2.3 → 17.0.0

package/dist/card/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/card/Backdrop.tsx","../../src/card/Card.styles.tsx","../../src/card/context.tsx","../../src/card/utils.ts","../../src/card/Card.tsx","../../src/card/Content.styles.tsx","../../src/card/Content.tsx","../../src/card/index.ts"],"sourcesContent":["import { makeVariants } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nexport const backdropStyles = cva(\n  [\n    'default:bg-surface default:bg-gradient-to-r absolute inset-x-0 top-0',\n    'h-sz-16',\n    'default:rounded-t-lg',\n    'bg-[length:200%_100%] bg-position-[0%_0%]',\n  ],\n  {\n    variants: {\n      animation: {\n        none: '',\n        pulse: 'animate-standalone-backdrop-pulse',\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: ['default:from-main/dim-4 default:via-main/dim-2 default:to-main/dim-4'],\n        support: ['default:from-support/dim-4 default:via-support/dim-2 default:to-support/dim-4'],\n        accent: ['default:from-accent/dim-4 default:via-accent/dim-2 default:to-accent/dim-4'],\n        basic: ['default:from-basic/dim-4 default:via-basic/dim-2 default:to-basic/dim-4'],\n        success: ['default:from-success/dim-4 default:via-success/dim-2 default:to-success/dim-4'],\n        alert: ['default:from-alert/dim-4 default:via-alert/dim-2 default:to-alert/dim-4'],\n        danger: ['default:from-error/dim-4 default:via-error/dim-2 default:to-error/dim-4'],\n        info: ['default:from-info/dim-4 default:via-info/dim-2 default:to-info/dim-4'],\n        neutral: ['default:from-neutral/dim-4 default:via-neutral/dim-2 default:to-neutral/dim-4'],\n        surface: ['default:from-outline/dim-4 default:via-outline/dim-2 default:to-outline/dim-4'],\n        surfaceInverse: [\n          'default:from-surface/dim-4 default:via-surface/dim-2 default:to-surface/dim-4',\n        ],\n      }),\n    },\n    defaultVariants: {\n      intent: 'main',\n      animation: 'none',\n    },\n  }\n)\n\nexport type BackdropStylesProps = VariantProps<typeof backdropStyles>\n\ninterface BackdropProps extends BackdropStylesProps {\n  className?: string\n}\n\nexport const Backdrop = ({ intent = 'main', animation = 'none', ...props }: BackdropProps) => {\n  return <div className={backdropStyles({ intent, animation })} {...props} />\n}\n\nBackdrop.displayName = 'Card.Backdrop'\n","import { makeVariants, tw } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nexport const cardStyles = cva(\n  [\n    'group relative bg-clip-padding default:rounded-lg focus-visible:u-outline',\n    'disabled:opacity-dim-3 disabled:cursor-not-allowed',\n  ],\n  {\n    variants: {\n      design: {\n        filled: [],\n        outlined: ['border-sm'],\n        tinted: [],\n      },\n      hasBackdrop: {\n        true: ['pt-md'],\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    compoundVariants: [\n      // OUTLINED\n      { intent: 'main', design: 'outlined', class: tw(['border-main']) },\n      { intent: 'support', design: 'outlined', class: tw(['border-support']) },\n      { intent: 'accent', design: 'outlined', class: tw(['border-accent']) },\n      { intent: 'basic', design: 'outlined', class: tw(['border-basic']) },\n      { intent: 'success', design: 'outlined', class: tw(['border-success']) },\n      { intent: 'alert', design: 'outlined', class: tw(['border-alert']) },\n      { intent: 'danger', design: 'outlined', class: tw(['border-error']) },\n      { intent: 'info', design: 'outlined', class: tw(['border-info']) },\n      { intent: 'neutral', design: 'outlined', class: tw(['border-neutral']) },\n      { intent: 'surface', design: 'outlined', class: tw(['border-outline']) },\n    ],\n    defaultVariants: {\n      design: 'filled',\n      intent: 'surface',\n    },\n  }\n)\n\nexport type CardStylesProps = VariantProps<typeof cardStyles>\n","import { createContext, useContext } from 'react'\n\nimport type { CardStylesProps } from './Card.styles'\n\nexport interface CardContextValue {\n  design: CardStylesProps['design']\n  intent: CardStylesProps['intent']\n  hasBackdrop: boolean\n  inset: boolean\n  isInteractive: boolean\n}\n\nconst CardContext = createContext<CardContextValue | undefined>(undefined)\n\nexport const useCardContext = () => {\n  const context = useContext(CardContext)\n  if (!context) {\n    throw new Error('useCardContext must be used within a Card component')\n  }\n\n  return context\n}\n\nexport { CardContext }\n","import { Children, isValidElement, ReactNode } from 'react'\n\nconst MOUSE_EVENTS = [\n  'onClick',\n  'onMouseDown',\n  'onMouseUp',\n  'onMouseEnter',\n  'onMouseLeave',\n  'onMouseMove',\n  'onMouseOver',\n  'onMouseOut',\n  'onDoubleClick',\n  'onContextMenu',\n] as const\n\nexport const hasBackdrop = (children: ReactNode): boolean => {\n  let backdropFound = false\n\n  const searchForBackdrop = (node: ReactNode): void => {\n    if (backdropFound) return\n\n    Children.forEach(node, child => {\n      if (backdropFound) return\n\n      if (isValidElement(child)) {\n        const isBackdropComponent =\n          typeof child.type === 'function' &&\n          (child.type as { displayName?: string }).displayName === 'Card.Backdrop'\n\n        if (isBackdropComponent) {\n          backdropFound = true\n\n          return\n        }\n\n        const hasChildren =\n          child.props && typeof child.props === 'object' && 'children' in child.props\n\n        if (hasChildren) {\n          const childChildren = (child.props as { children: ReactNode }).children\n          if (childChildren !== undefined && childChildren !== null) {\n            searchForBackdrop(childChildren)\n          }\n        }\n      }\n    })\n  }\n\n  searchForBackdrop(children)\n\n  return backdropFound\n}\n\nexport const isInteractive = (\n  children: ReactNode,\n  asChild: boolean | undefined,\n  props: Record<string, any>\n): boolean => {\n  const hasMouseEventHandlers = MOUSE_EVENTS.some(event => event in props)\n\n  if (hasMouseEventHandlers) {\n    return true\n  }\n\n  if (!asChild) {\n    return false\n  }\n\n  const child = Children.only(children)\n\n  if (!isValidElement(child)) {\n    return false\n  }\n\n  const interactiveElements = ['a', 'button']\n  const isInteractiveElement =\n    typeof child.type === 'string' && interactiveElements.includes(child.type)\n\n  if (isInteractiveElement) {\n    return true\n  }\n\n  const childProps = child.props as Record<string, any>\n  const hasChildEventHandlers = MOUSE_EVENTS.some(event => event in childProps)\n\n  return hasChildEventHandlers\n}\n","import { ComponentProps } from 'react'\n\nimport { Slot } from '../slot'\nimport { cardStyles, type CardStylesProps } from './Card.styles'\nimport { CardContext } from './context'\nimport { hasBackdrop, isInteractive } from './utils'\n\nexport interface CardProps extends ComponentProps<'div'>, CardStylesProps {\n  /**\n   * Change the component to the HTML tag or custom component of the only child.\n   */\n  asChild?: boolean\n  /**\n   * Whether the card should have an inset padding.\n   */\n  inset?: boolean\n}\n\nexport const Card = ({\n  children,\n  design = 'filled',\n  intent = 'surface',\n  inset = false,\n  asChild,\n  className,\n  ref,\n  ...props\n}: CardProps) => {\n  const Component = asChild ? Slot : 'div'\n  const backdropDetected = hasBackdrop(children)\n  const interactiveDetected = isInteractive(children, asChild, props)\n\n  return (\n    <CardContext.Provider\n      value={{\n        design,\n        intent,\n        hasBackdrop: backdropDetected,\n        inset,\n        isInteractive: interactiveDetected,\n      }}\n    >\n      <Component\n        data-spark-component=\"card\"\n        data-interactive={interactiveDetected}\n        ref={ref}\n        className={cardStyles({\n          className,\n          design,\n          intent,\n          hasBackdrop: backdropDetected,\n        })}\n        {...props}\n      >\n        {children}\n      </Component>\n    </CardContext.Provider>\n  )\n}\n\nCard.displayName = 'Card'\n","import { makeVariants, tw } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nexport const contentStyles = cva(\n  [\n    'relative h-full default:rounded-lg w-full focus-visible:u-outline',\n    'default:transition-colors default:duration-200 ease-linear',\n  ],\n  {\n    variants: {\n      inset: {\n        false: ['default:p-lg'],\n      },\n      design: {\n        filled: [],\n        outlined: [\n          'default:bg-surface group-focus:bg-surface-hovered group-not-disabled:group-data-[interactive=true]:group-hover:bg-surface-hovered',\n        ],\n        tinted: [],\n      },\n      hasBackdrop: {\n        true: ['rounded-t-[16px_8px] '],\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    compoundVariants: [\n      // FILLED\n      {\n        intent: 'main',\n        design: 'filled',\n        class: tw([\n          'bg-main text-on-main group-focus:bg-main-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-main-hovered',\n        ]),\n      },\n      {\n        intent: 'support',\n        design: 'filled',\n        class: tw([\n          'bg-support text-on-support group-focus:bg-support-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-support-hovered',\n        ]),\n      },\n      {\n        intent: 'accent',\n        design: 'filled',\n        class: tw([\n          'bg-accent text-on-accent group-focus:bg-accent-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-accent-hovered',\n        ]),\n      },\n      {\n        intent: 'basic',\n        design: 'filled',\n        class: tw([\n          'bg-basic text-on-basic group-focus:bg-basic-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-basic-hovered',\n        ]),\n      },\n      {\n        intent: 'success',\n        design: 'filled',\n        class: tw([\n          'bg-success text-on-success group-focus:bg-success-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-success-hovered',\n        ]),\n      },\n      {\n        intent: 'alert',\n        design: 'filled',\n        class: tw([\n          'bg-alert text-on-alert group-focus:bg-alert-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-alert-hovered',\n        ]),\n      },\n      {\n        intent: 'danger',\n        design: 'filled',\n        class: tw([\n          'text-on-error bg-error group-focus:bg-error-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-error-hovered',\n        ]),\n      },\n      {\n        intent: 'info',\n        design: 'filled',\n        class: tw([\n          'text-on-error bg-info group-focus:bg-info-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-info-hovered',\n        ]),\n      },\n      {\n        intent: 'neutral',\n        design: 'filled',\n        class: tw([\n          'bg-neutral text-on-neutral group-focus:bg-neutral-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-neutral-hovered',\n        ]),\n      },\n      {\n        intent: 'surface',\n        design: 'filled',\n        class: tw([\n          'bg-surface text-on-surface group-focus:bg-surface-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-surface-hovered',\n        ]),\n      },\n      // OUTLINED\n      /**\n       * Outlined styles are handled by the Card component (parent)\n       */\n      // TINTED\n      {\n        intent: 'main',\n        design: 'tinted',\n        class: tw([\n          'bg-main-container text-on-main-container group-focus:bg-main-container-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-main-container-hovered',\n        ]),\n      },\n      {\n        intent: 'support',\n        design: 'tinted',\n        class: tw([\n          'bg-support-container text-on-support-container group-focus:bg-support-container-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-support-container-hovered',\n        ]),\n      },\n      {\n        intent: 'accent',\n        design: 'tinted',\n        class: tw([\n          'bg-accent-container text-on-accent-container group-focus:bg-accent-container-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-accent-container-hovered',\n        ]),\n      },\n      {\n        intent: 'basic',\n        design: 'tinted',\n        class: tw([\n          'bg-basic-container text-on-basic-container group-focus:bg-basic-container-hovered',\n        ]),\n      },\n      {\n        intent: 'success',\n        design: 'tinted',\n        class: tw([\n          'bg-success-container text-on-success-container group-focus:bg-success-container-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-success-container-hovered',\n        ]),\n      },\n      {\n        intent: 'alert',\n        design: 'tinted',\n        class: tw([\n          'bg-alert-container text-on-alert-container group-focus:bg-alert-container-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-alert-container-hovered',\n        ]),\n      },\n      {\n        intent: 'danger',\n        design: 'tinted',\n        class: tw([\n          'bg-error-container text-on-error-container group-focus:bg-error-container-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-error-container-hovered',\n        ]),\n      },\n      {\n        intent: 'info',\n        design: 'tinted',\n        class: tw([\n          'bg-info-container text-on-info-container group-focus:bg-info-container-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-info-container-hovered',\n        ]),\n      },\n      {\n        intent: 'neutral',\n        design: 'tinted',\n        class: tw([\n          'bg-neutral-container text-on-neutral-container group-focus:bg-neutral-container-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-neutral-container-hovered',\n        ]),\n      },\n      {\n        intent: 'surface',\n        design: 'tinted',\n        class: tw([\n          'bg-surface text-on-surface group-focus:bg-surface-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-surface-hovered',\n        ]),\n      },\n    ],\n    defaultVariants: {\n      design: 'filled',\n      intent: 'surface',\n      inset: false,\n      hasBackdrop: true,\n    },\n  }\n)\n\nexport type ContentStylesProps = VariantProps<typeof contentStyles>\n","import { ComponentProps } from 'react'\n\nimport { Slot } from '../slot'\nimport { contentStyles } from './Content.styles'\nimport { useCardContext } from './context'\n\nexport interface ContentProps extends ComponentProps<'div'> {\n  /**\n   * Change the component to the HTML tag or custom component of the only child.\n   */\n  asChild?: boolean\n  /**\n   * Whether the card should have an inset padding.\n   */\n  inset?: boolean\n}\n\nexport const Content = ({ children, inset, asChild, className, ref, ...props }: ContentProps) => {\n  const Component = asChild ? Slot : 'div'\n  const { design, intent, hasBackdrop } = useCardContext()\n\n  return (\n    <Component\n      data-spark-component=\"card-content\"\n      ref={ref}\n      className={contentStyles({\n        className,\n        design,\n        intent,\n        inset,\n        hasBackdrop,\n      })}\n      {...props}\n    >\n      {children}\n    </Component>\n  )\n}\n\nContent.displayName = 'Content'\n","import { Backdrop } from './Backdrop'\nimport { Card as Root } from './Card'\nimport { Content } from './Content'\n\nexport const Card: typeof Root & {\n  Content: typeof Content\n  Backdrop: typeof Backdrop\n} = Object.assign(Root, {\n  Content,\n  Backdrop,\n})\n\nCard.displayName = 'Card'\nContent.displayName = 'Card.Content'\nBackdrop.displayName = 'Card.Backdrop'\n\nexport { type CardProps } from './Card'\n"],"names":["backdropStyles","cva","makeVariants","Backdrop","intent","animation","props","jsx","cardStyles","tw","CardContext","createContext","useCardContext","context","useContext","MOUSE_EVENTS","hasBackdrop","children","backdropFound","searchForBackdrop","node","Children","child","isValidElement","childChildren","isInteractive","asChild","event","interactiveElements","childProps","Card","design","inset","className","ref","Component","Slot","backdropDetected","interactiveDetected","contentStyles","Content","Root"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../src/card/Backdrop.tsx","../../src/card/Card.styles.tsx","../../src/card/context.tsx","../../src/card/utils.ts","../../src/card/Card.tsx","../../src/card/Content.styles.tsx","../../src/card/Content.tsx","../../src/card/index.ts"],"sourcesContent":["import { makeVariants } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nexport const backdropStyles = cva(\n  [\n    'default:bg-surface default:bg-gradient-to-r absolute inset-x-0 top-0',\n    'h-sz-16',\n    'default:rounded-t-lg',\n    'bg-[length:200%_100%] bg-position-[0%_0%]',\n  ],\n  {\n    variants: {\n      animation: {\n        none: '',\n        pulse: 'animate-standalone-backdrop-pulse',\n      },\n      intent: makeVariants<\n        'intent',\n        [\n          'main',\n          'support',\n          'accent',\n          'success',\n          'alert',\n          'danger',\n          'info',\n          'neutral',\n          'surface',\n          'surfaceInverse',\n        ]\n      >({\n        main: ['default:from-main/dim-4 default:via-main/dim-2 default:to-main/dim-4'],\n        support: ['default:from-support/dim-4 default:via-support/dim-2 default:to-support/dim-4'],\n        accent: ['default:from-accent/dim-4 default:via-accent/dim-2 default:to-accent/dim-4'],\n        success: ['default:from-success/dim-4 default:via-success/dim-2 default:to-success/dim-4'],\n        alert: ['default:from-alert/dim-4 default:via-alert/dim-2 default:to-alert/dim-4'],\n        danger: ['default:from-error/dim-4 default:via-error/dim-2 default:to-error/dim-4'],\n        info: ['default:from-info/dim-4 default:via-info/dim-2 default:to-info/dim-4'],\n        neutral: ['default:from-neutral/dim-4 default:via-neutral/dim-2 default:to-neutral/dim-4'],\n        surface: ['default:from-outline/dim-4 default:via-outline/dim-2 default:to-outline/dim-4'],\n        surfaceInverse: [\n          'default:from-surface/dim-4 default:via-surface/dim-2 default:to-surface/dim-4',\n        ],\n      }),\n    },\n    defaultVariants: {\n      intent: 'main',\n      animation: 'none',\n    },\n  }\n)\n\nexport type BackdropStylesProps = VariantProps<typeof backdropStyles>\n\ninterface BackdropProps extends BackdropStylesProps {\n  className?: string\n}\n\nexport const Backdrop = ({ intent = 'main', animation = 'none', ...props }: BackdropProps) => {\n  return <div className={backdropStyles({ intent, animation })} {...props} />\n}\n\nBackdrop.displayName = 'Card.Backdrop'\n","import { makeVariants, tw } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nexport const cardStyles = cva(\n  [\n    'group relative bg-clip-padding default:rounded-lg focus-visible:u-outline',\n    'disabled:opacity-dim-3 disabled:cursor-not-allowed',\n  ],\n  {\n    variants: {\n      design: {\n        filled: [],\n        outlined: ['border-sm'],\n        tinted: [],\n      },\n      hasBackdrop: {\n        true: ['pt-md'],\n      },\n      /**\n       * Color scheme of the button.\n       */\n      intent: makeVariants<\n        'intent',\n        [\n          'main',\n          'support',\n          'accent',\n          'success',\n          'alert',\n          'danger',\n          'info',\n          'neutral',\n          'surface',\n          'surfaceInverse',\n        ]\n      >({\n        main: [],\n        support: [],\n        accent: [],\n        success: [],\n        alert: [],\n        danger: [],\n        info: [],\n        neutral: [],\n        surface: [],\n        surfaceInverse: [],\n      }),\n    },\n    compoundVariants: [\n      // OUTLINED\n      { intent: 'main', design: 'outlined', class: tw(['border-main']) },\n      { intent: 'support', design: 'outlined', class: tw(['border-support']) },\n      { intent: 'accent', design: 'outlined', class: tw(['border-accent']) },\n      { intent: 'success', design: 'outlined', class: tw(['border-success']) },\n      { intent: 'alert', design: 'outlined', class: tw(['border-alert']) },\n      { intent: 'danger', design: 'outlined', class: tw(['border-error']) },\n      { intent: 'info', design: 'outlined', class: tw(['border-info']) },\n      { intent: 'neutral', design: 'outlined', class: tw(['border-neutral']) },\n      { intent: 'surface', design: 'outlined', class: tw(['border-outline']) },\n    ],\n    defaultVariants: {\n      design: 'filled',\n      intent: 'surface',\n    },\n  }\n)\n\nexport type CardStylesProps = VariantProps<typeof cardStyles>\n","import { createContext, useContext } from 'react'\n\nimport type { CardStylesProps } from './Card.styles'\n\nexport interface CardContextValue {\n  design: CardStylesProps['design']\n  intent: CardStylesProps['intent']\n  hasBackdrop: boolean\n  inset: boolean\n  isInteractive: boolean\n}\n\nconst CardContext = createContext<CardContextValue | undefined>(undefined)\n\nexport const useCardContext = () => {\n  const context = useContext(CardContext)\n  if (!context) {\n    throw new Error('useCardContext must be used within a Card component')\n  }\n\n  return context\n}\n\nexport { CardContext }\n","import { Children, isValidElement, ReactNode } from 'react'\n\nconst MOUSE_EVENTS = [\n  'onClick',\n  'onMouseDown',\n  'onMouseUp',\n  'onMouseEnter',\n  'onMouseLeave',\n  'onMouseMove',\n  'onMouseOver',\n  'onMouseOut',\n  'onDoubleClick',\n  'onContextMenu',\n] as const\n\nexport const hasBackdrop = (children: ReactNode): boolean => {\n  let backdropFound = false\n\n  const searchForBackdrop = (node: ReactNode): void => {\n    if (backdropFound) return\n\n    Children.forEach(node, child => {\n      if (backdropFound) return\n\n      if (isValidElement(child)) {\n        const isBackdropComponent =\n          typeof child.type === 'function' &&\n          (child.type as { displayName?: string }).displayName === 'Card.Backdrop'\n\n        if (isBackdropComponent) {\n          backdropFound = true\n\n          return\n        }\n\n        const hasChildren =\n          child.props && typeof child.props === 'object' && 'children' in child.props\n\n        if (hasChildren) {\n          const childChildren = (child.props as { children: ReactNode }).children\n          if (childChildren !== undefined && childChildren !== null) {\n            searchForBackdrop(childChildren)\n          }\n        }\n      }\n    })\n  }\n\n  searchForBackdrop(children)\n\n  return backdropFound\n}\n\nexport const isInteractive = (\n  children: ReactNode,\n  asChild: boolean | undefined,\n  props: Record<string, any>\n): boolean => {\n  const hasMouseEventHandlers = MOUSE_EVENTS.some(event => event in props)\n\n  if (hasMouseEventHandlers) {\n    return true\n  }\n\n  if (!asChild) {\n    return false\n  }\n\n  const child = Children.only(children)\n\n  if (!isValidElement(child)) {\n    return false\n  }\n\n  const interactiveElements = ['a', 'button']\n  const isInteractiveElement =\n    typeof child.type === 'string' && interactiveElements.includes(child.type)\n\n  if (isInteractiveElement) {\n    return true\n  }\n\n  const childProps = child.props as Record<string, any>\n  const hasChildEventHandlers = MOUSE_EVENTS.some(event => event in childProps)\n\n  return hasChildEventHandlers\n}\n","import { ComponentProps } from 'react'\n\nimport { Slot } from '../slot'\nimport { cardStyles, type CardStylesProps } from './Card.styles'\nimport { CardContext } from './context'\nimport { hasBackdrop, isInteractive } from './utils'\n\nexport interface CardProps extends ComponentProps<'div'>, CardStylesProps {\n  /**\n   * Change the component to the HTML tag or custom component of the only child.\n   */\n  asChild?: boolean\n  /**\n   * Whether the card should have an inset padding.\n   */\n  inset?: boolean\n}\n\nexport const Card = ({\n  children,\n  design = 'filled',\n  intent = 'surface',\n  inset = false,\n  asChild,\n  className,\n  ref,\n  ...props\n}: CardProps) => {\n  const Component = asChild ? Slot : 'div'\n  const backdropDetected = hasBackdrop(children)\n  const interactiveDetected = isInteractive(children, asChild, props)\n\n  return (\n    <CardContext.Provider\n      value={{\n        design,\n        intent,\n        hasBackdrop: backdropDetected,\n        inset,\n        isInteractive: interactiveDetected,\n      }}\n    >\n      <Component\n        data-spark-component=\"card\"\n        data-interactive={interactiveDetected}\n        ref={ref}\n        className={cardStyles({\n          className,\n          design,\n          intent,\n          hasBackdrop: backdropDetected,\n        })}\n        {...props}\n      >\n        {children}\n      </Component>\n    </CardContext.Provider>\n  )\n}\n\nCard.displayName = 'Card'\n","import { makeVariants, tw } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nexport const contentStyles = cva(\n  [\n    'relative h-full default:rounded-lg w-full focus-visible:u-outline',\n    'default:transition-colors default:duration-200 ease-linear',\n  ],\n  {\n    variants: {\n      inset: {\n        false: ['default:p-lg'],\n      },\n      design: {\n        filled: [],\n        outlined: [\n          'default:bg-surface group-focus:bg-surface-hovered group-not-disabled:group-data-[interactive=true]:group-hover:bg-surface-hovered',\n        ],\n        tinted: [],\n      },\n      hasBackdrop: {\n        true: ['rounded-t-[16px_8px] '],\n      },\n      intent: makeVariants<\n        'intent',\n        [\n          'main',\n          'support',\n          'accent',\n          'success',\n          'alert',\n          'danger',\n          'info',\n          'neutral',\n          'surface',\n          'surfaceInverse',\n        ]\n      >({\n        main: [],\n        support: [],\n        accent: [],\n        success: [],\n        alert: [],\n        danger: [],\n        info: [],\n        neutral: [],\n        surface: [],\n        surfaceInverse: [],\n      }),\n    },\n    compoundVariants: [\n      // FILLED\n      {\n        intent: 'main',\n        design: 'filled',\n        class: tw([\n          'bg-main text-on-main group-focus:bg-main-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-main-hovered',\n        ]),\n      },\n      {\n        intent: 'support',\n        design: 'filled',\n        class: tw([\n          'bg-support text-on-support group-focus:bg-support-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-support-hovered',\n        ]),\n      },\n      {\n        intent: 'accent',\n        design: 'filled',\n        class: tw([\n          'bg-accent text-on-accent group-focus:bg-accent-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-accent-hovered',\n        ]),\n      },\n      {\n        intent: 'success',\n        design: 'filled',\n        class: tw([\n          'bg-success text-on-success group-focus:bg-success-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-success-hovered',\n        ]),\n      },\n      {\n        intent: 'alert',\n        design: 'filled',\n        class: tw([\n          'bg-alert text-on-alert group-focus:bg-alert-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-alert-hovered',\n        ]),\n      },\n      {\n        intent: 'danger',\n        design: 'filled',\n        class: tw([\n          'text-on-error bg-error group-focus:bg-error-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-error-hovered',\n        ]),\n      },\n      {\n        intent: 'info',\n        design: 'filled',\n        class: tw([\n          'text-on-error bg-info group-focus:bg-info-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-info-hovered',\n        ]),\n      },\n      {\n        intent: 'neutral',\n        design: 'filled',\n        class: tw([\n          'bg-neutral text-on-neutral group-focus:bg-neutral-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-neutral-hovered',\n        ]),\n      },\n      {\n        intent: 'surface',\n        design: 'filled',\n        class: tw([\n          'bg-surface text-on-surface group-focus:bg-surface-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-surface-hovered',\n        ]),\n      },\n      // OUTLINED\n      /**\n       * Outlined styles are handled by the Card component (parent)\n       */\n      // TINTED\n      {\n        intent: 'main',\n        design: 'tinted',\n        class: tw([\n          'bg-main-container text-on-main-container group-focus:bg-main-container-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-main-container-hovered',\n        ]),\n      },\n      {\n        intent: 'support',\n        design: 'tinted',\n        class: tw([\n          'bg-support-container text-on-support-container group-focus:bg-support-container-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-support-container-hovered',\n        ]),\n      },\n      {\n        intent: 'accent',\n        design: 'tinted',\n        class: tw([\n          'bg-accent-container text-on-accent-container group-focus:bg-accent-container-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-accent-container-hovered',\n        ]),\n      },\n      {\n        intent: 'success',\n        design: 'tinted',\n        class: tw([\n          'bg-success-container text-on-success-container group-focus:bg-success-container-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-success-container-hovered',\n        ]),\n      },\n      {\n        intent: 'alert',\n        design: 'tinted',\n        class: tw([\n          'bg-alert-container text-on-alert-container group-focus:bg-alert-container-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-alert-container-hovered',\n        ]),\n      },\n      {\n        intent: 'danger',\n        design: 'tinted',\n        class: tw([\n          'bg-error-container text-on-error-container group-focus:bg-error-container-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-error-container-hovered',\n        ]),\n      },\n      {\n        intent: 'info',\n        design: 'tinted',\n        class: tw([\n          'bg-info-container text-on-info-container group-focus:bg-info-container-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-info-container-hovered',\n        ]),\n      },\n      {\n        intent: 'neutral',\n        design: 'tinted',\n        class: tw([\n          'bg-neutral-container text-on-neutral-container group-focus:bg-neutral-container-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-neutral-container-hovered',\n        ]),\n      },\n      {\n        intent: 'surface',\n        design: 'tinted',\n        class: tw([\n          'bg-surface text-on-surface group-focus:bg-surface-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-surface-hovered',\n        ]),\n      },\n    ],\n    defaultVariants: {\n      design: 'filled',\n      intent: 'surface',\n      inset: false,\n      hasBackdrop: true,\n    },\n  }\n)\n\nexport type ContentStylesProps = VariantProps<typeof contentStyles>\n","import { ComponentProps } from 'react'\n\nimport { Slot } from '../slot'\nimport { contentStyles } from './Content.styles'\nimport { useCardContext } from './context'\n\nexport interface ContentProps extends ComponentProps<'div'> {\n  /**\n   * Change the component to the HTML tag or custom component of the only child.\n   */\n  asChild?: boolean\n  /**\n   * Whether the card should have an inset padding.\n   */\n  inset?: boolean\n}\n\nexport const Content = ({ children, inset, asChild, className, ref, ...props }: ContentProps) => {\n  const Component = asChild ? Slot : 'div'\n  const { design, intent, hasBackdrop } = useCardContext()\n\n  return (\n    <Component\n      data-spark-component=\"card-content\"\n      ref={ref}\n      className={contentStyles({\n        className,\n        design,\n        intent,\n        inset,\n        hasBackdrop,\n      })}\n      {...props}\n    >\n      {children}\n    </Component>\n  )\n}\n\nContent.displayName = 'Content'\n","import { Backdrop } from './Backdrop'\nimport { Card as Root } from './Card'\nimport { Content } from './Content'\n\nexport const Card: typeof Root & {\n  Content: typeof Content\n  Backdrop: typeof Backdrop\n} = Object.assign(Root, {\n  Content,\n  Backdrop,\n})\n\nCard.displayName = 'Card'\nContent.displayName = 'Card.Content'\nBackdrop.displayName = 'Card.Backdrop'\n\nexport { type CardProps } from './Card'\n"],"names":["backdropStyles","cva","makeVariants","Backdrop","intent","animation","props","jsx","cardStyles","tw","CardContext","createContext","useCardContext","context","useContext","MOUSE_EVENTS","hasBackdrop","children","backdropFound","searchForBackdrop","node","Children","child","isValidElement","childChildren","isInteractive","asChild","event","interactiveElements","childProps","Card","design","inset","className","ref","Component","Slot","backdropDetected","interactiveDetected","contentStyles","Content","Root"],"mappings":"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"}

package/dist/card/index.mjs

@@ -2,7 +2,7 @@ import { jsx as l } from "react/jsx-runtime";
 import { makeVariants as g, tw as e } from "@spark-ui/internal-utils";
 import { cva as p } from "class-variance-authority";
 import { S as h } from "../Slot-DLY1rJrG.mjs";
-import { createContext as B, useContext as E, Children as x, isValidElement as C } from "react";
+import { createContext as B, useContext as E, Children as C, isValidElement as x } from "react";
 const M = p(
   [
     "default:bg-surface default:bg-gradient-to-r absolute inset-x-0 top-0",
@@ -20,7 +20,6 @@ const M = p(
         main: ["default:from-main/dim-4 default:via-main/dim-2 default:to-main/dim-4"],
         support: ["default:from-support/dim-4 default:via-support/dim-2 default:to-support/dim-4"],
         accent: ["default:from-accent/dim-4 default:via-accent/dim-2 default:to-accent/dim-4"],
-        basic: ["default:from-basic/dim-4 default:via-basic/dim-2 default:to-basic/dim-4"],
         success: ["default:from-success/dim-4 default:via-success/dim-2 default:to-success/dim-4"],
         alert: ["default:from-alert/dim-4 default:via-alert/dim-2 default:to-alert/dim-4"],
         danger: ["default:from-error/dim-4 default:via-error/dim-2 default:to-error/dim-4"],
@@ -61,7 +60,6 @@ const N = p(
         main: [],
         support: [],
         accent: [],
-        basic: [],
         success: [],
         alert: [],
         danger: [],
@@ -76,7 +74,6 @@ const N = p(
       { intent: "main", design: "outlined", class: e(["border-main"]) },
       { intent: "support", design: "outlined", class: e(["border-support"]) },
       { intent: "accent", design: "outlined", class: e(["border-accent"]) },
-      { intent: "basic", design: "outlined", class: e(["border-basic"]) },
       { intent: "success", design: "outlined", class: e(["border-success"]) },
       { intent: "alert", design: "outlined", class: e(["border-alert"]) },
       { intent: "danger", design: "outlined", class: e(["border-error"]) },
@@ -108,8 +105,8 @@ const N = p(
 ], w = (r) => {
   let n = !1;
   const o = (s) => {
-    n || x.forEach(s, (t) => {
-      if (!n && C(t)) {
+    n || C.forEach(s, (t) => {
+      if (!n && x(t)) {
         if (typeof t.type == "function" && t.type.displayName === "Card.Backdrop") {
           n = !0;
           return;
@@ -127,8 +124,8 @@ const N = p(
     return !0;
   if (!n)
     return !1;
-  const t = x.only(r);
-  if (!C(t))
+  const t = C.only(r);
+  if (!x(t))
     return !1;
   const d = ["a", "button"];
   if (typeof t.type == "string" && d.includes(t.type))
@@ -145,7 +142,7 @@ const N = p(
   ref: u,
   ...a
 }) => {
-  const c = t ? h : "div", i = w(r), v = I(r, t, a);
+  const c = t ? h : "div", i = w(r), b = I(r, t, a);
   return /* @__PURE__ */ l(
     k.Provider,
     {
@@ -154,13 +151,13 @@ const N = p(
         intent: o,
         hasBackdrop: i,
         inset: s,
-        isInteractive: v
+        isInteractive: b
       },
       children: /* @__PURE__ */ l(
         c,
         {
           "data-spark-component": "card",
-          "data-interactive": v,
+          "data-interactive": b,
           ref: u,
           className: N({
             className: d,
@@ -200,7 +197,6 @@ const S = p(
         main: [],
         support: [],
         accent: [],
-        basic: [],
         success: [],
         alert: [],
         danger: [],
@@ -236,14 +232,6 @@ const S = p(
           "group-not-disabled:group-data-[interactive=true]:group-hover:bg-accent-hovered"
         ])
       },
-      {
-        intent: "basic",
-        design: "filled",
-        class: e([
-          "bg-basic text-on-basic group-focus:bg-basic-hovered",
-          "group-not-disabled:group-data-[interactive=true]:group-hover:bg-basic-hovered"
-        ])
-      },
       {
         intent: "success",
         design: "filled",
@@ -321,13 +309,6 @@ const S = p(
           "group-not-disabled:group-data-[interactive=true]:group-hover:bg-accent-container-hovered"
         ])
       },
-      {
-        intent: "basic",
-        design: "tinted",
-        class: e([
-          "bg-basic-container text-on-basic-container group-focus:bg-basic-container-hovered"
-        ])
-      },
       {
         intent: "success",
         design: "tinted",
@@ -384,7 +365,7 @@ const S = p(
       hasBackdrop: !0
     }
   }
-), b = ({ children: r, inset: n, asChild: o, className: s, ref: t, ...d }) => {
+), v = ({ children: r, inset: n, asChild: o, className: s, ref: t, ...d }) => {
   const u = o ? h : "div", { design: a, intent: c, hasBackdrop: i } = V();
   return /* @__PURE__ */ l(
     u,
@@ -403,13 +384,13 @@ const S = p(
     }
   );
 };
-b.displayName = "Content";
+v.displayName = "Content";
 const D = Object.assign(y, {
-  Content: b,
+  Content: v,
   Backdrop: f
 });
 D.displayName = "Card";
-b.displayName = "Card.Content";
+v.displayName = "Card.Content";
 f.displayName = "Card.Backdrop";
 export {
   D as Card

package/dist/card/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../../src/card/Backdrop.tsx","../../src/card/Card.styles.tsx","../../src/card/context.tsx","../../src/card/utils.ts","../../src/card/Card.tsx","../../src/card/Content.styles.tsx","../../src/card/Content.tsx","../../src/card/index.ts"],"sourcesContent":["import { makeVariants } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nexport const backdropStyles = cva(\n  [\n    'default:bg-surface default:bg-gradient-to-r absolute inset-x-0 top-0',\n    'h-sz-16',\n    'default:rounded-t-lg',\n    'bg-[length:200%_100%] bg-position-[0%_0%]',\n  ],\n  {\n    variants: {\n      animation: {\n        none: '',\n        pulse: 'animate-standalone-backdrop-pulse',\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: ['default:from-main/dim-4 default:via-main/dim-2 default:to-main/dim-4'],\n        support: ['default:from-support/dim-4 default:via-support/dim-2 default:to-support/dim-4'],\n        accent: ['default:from-accent/dim-4 default:via-accent/dim-2 default:to-accent/dim-4'],\n        basic: ['default:from-basic/dim-4 default:via-basic/dim-2 default:to-basic/dim-4'],\n        success: ['default:from-success/dim-4 default:via-success/dim-2 default:to-success/dim-4'],\n        alert: ['default:from-alert/dim-4 default:via-alert/dim-2 default:to-alert/dim-4'],\n        danger: ['default:from-error/dim-4 default:via-error/dim-2 default:to-error/dim-4'],\n        info: ['default:from-info/dim-4 default:via-info/dim-2 default:to-info/dim-4'],\n        neutral: ['default:from-neutral/dim-4 default:via-neutral/dim-2 default:to-neutral/dim-4'],\n        surface: ['default:from-outline/dim-4 default:via-outline/dim-2 default:to-outline/dim-4'],\n        surfaceInverse: [\n          'default:from-surface/dim-4 default:via-surface/dim-2 default:to-surface/dim-4',\n        ],\n      }),\n    },\n    defaultVariants: {\n      intent: 'main',\n      animation: 'none',\n    },\n  }\n)\n\nexport type BackdropStylesProps = VariantProps<typeof backdropStyles>\n\ninterface BackdropProps extends BackdropStylesProps {\n  className?: string\n}\n\nexport const Backdrop = ({ intent = 'main', animation = 'none', ...props }: BackdropProps) => {\n  return <div className={backdropStyles({ intent, animation })} {...props} />\n}\n\nBackdrop.displayName = 'Card.Backdrop'\n","import { makeVariants, tw } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nexport const cardStyles = cva(\n  [\n    'group relative bg-clip-padding default:rounded-lg focus-visible:u-outline',\n    'disabled:opacity-dim-3 disabled:cursor-not-allowed',\n  ],\n  {\n    variants: {\n      design: {\n        filled: [],\n        outlined: ['border-sm'],\n        tinted: [],\n      },\n      hasBackdrop: {\n        true: ['pt-md'],\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    compoundVariants: [\n      // OUTLINED\n      { intent: 'main', design: 'outlined', class: tw(['border-main']) },\n      { intent: 'support', design: 'outlined', class: tw(['border-support']) },\n      { intent: 'accent', design: 'outlined', class: tw(['border-accent']) },\n      { intent: 'basic', design: 'outlined', class: tw(['border-basic']) },\n      { intent: 'success', design: 'outlined', class: tw(['border-success']) },\n      { intent: 'alert', design: 'outlined', class: tw(['border-alert']) },\n      { intent: 'danger', design: 'outlined', class: tw(['border-error']) },\n      { intent: 'info', design: 'outlined', class: tw(['border-info']) },\n      { intent: 'neutral', design: 'outlined', class: tw(['border-neutral']) },\n      { intent: 'surface', design: 'outlined', class: tw(['border-outline']) },\n    ],\n    defaultVariants: {\n      design: 'filled',\n      intent: 'surface',\n    },\n  }\n)\n\nexport type CardStylesProps = VariantProps<typeof cardStyles>\n","import { createContext, useContext } from 'react'\n\nimport type { CardStylesProps } from './Card.styles'\n\nexport interface CardContextValue {\n  design: CardStylesProps['design']\n  intent: CardStylesProps['intent']\n  hasBackdrop: boolean\n  inset: boolean\n  isInteractive: boolean\n}\n\nconst CardContext = createContext<CardContextValue | undefined>(undefined)\n\nexport const useCardContext = () => {\n  const context = useContext(CardContext)\n  if (!context) {\n    throw new Error('useCardContext must be used within a Card component')\n  }\n\n  return context\n}\n\nexport { CardContext }\n","import { Children, isValidElement, ReactNode } from 'react'\n\nconst MOUSE_EVENTS = [\n  'onClick',\n  'onMouseDown',\n  'onMouseUp',\n  'onMouseEnter',\n  'onMouseLeave',\n  'onMouseMove',\n  'onMouseOver',\n  'onMouseOut',\n  'onDoubleClick',\n  'onContextMenu',\n] as const\n\nexport const hasBackdrop = (children: ReactNode): boolean => {\n  let backdropFound = false\n\n  const searchForBackdrop = (node: ReactNode): void => {\n    if (backdropFound) return\n\n    Children.forEach(node, child => {\n      if (backdropFound) return\n\n      if (isValidElement(child)) {\n        const isBackdropComponent =\n          typeof child.type === 'function' &&\n          (child.type as { displayName?: string }).displayName === 'Card.Backdrop'\n\n        if (isBackdropComponent) {\n          backdropFound = true\n\n          return\n        }\n\n        const hasChildren =\n          child.props && typeof child.props === 'object' && 'children' in child.props\n\n        if (hasChildren) {\n          const childChildren = (child.props as { children: ReactNode }).children\n          if (childChildren !== undefined && childChildren !== null) {\n            searchForBackdrop(childChildren)\n          }\n        }\n      }\n    })\n  }\n\n  searchForBackdrop(children)\n\n  return backdropFound\n}\n\nexport const isInteractive = (\n  children: ReactNode,\n  asChild: boolean | undefined,\n  props: Record<string, any>\n): boolean => {\n  const hasMouseEventHandlers = MOUSE_EVENTS.some(event => event in props)\n\n  if (hasMouseEventHandlers) {\n    return true\n  }\n\n  if (!asChild) {\n    return false\n  }\n\n  const child = Children.only(children)\n\n  if (!isValidElement(child)) {\n    return false\n  }\n\n  const interactiveElements = ['a', 'button']\n  const isInteractiveElement =\n    typeof child.type === 'string' && interactiveElements.includes(child.type)\n\n  if (isInteractiveElement) {\n    return true\n  }\n\n  const childProps = child.props as Record<string, any>\n  const hasChildEventHandlers = MOUSE_EVENTS.some(event => event in childProps)\n\n  return hasChildEventHandlers\n}\n","import { ComponentProps } from 'react'\n\nimport { Slot } from '../slot'\nimport { cardStyles, type CardStylesProps } from './Card.styles'\nimport { CardContext } from './context'\nimport { hasBackdrop, isInteractive } from './utils'\n\nexport interface CardProps extends ComponentProps<'div'>, CardStylesProps {\n  /**\n   * Change the component to the HTML tag or custom component of the only child.\n   */\n  asChild?: boolean\n  /**\n   * Whether the card should have an inset padding.\n   */\n  inset?: boolean\n}\n\nexport const Card = ({\n  children,\n  design = 'filled',\n  intent = 'surface',\n  inset = false,\n  asChild,\n  className,\n  ref,\n  ...props\n}: CardProps) => {\n  const Component = asChild ? Slot : 'div'\n  const backdropDetected = hasBackdrop(children)\n  const interactiveDetected = isInteractive(children, asChild, props)\n\n  return (\n    <CardContext.Provider\n      value={{\n        design,\n        intent,\n        hasBackdrop: backdropDetected,\n        inset,\n        isInteractive: interactiveDetected,\n      }}\n    >\n      <Component\n        data-spark-component=\"card\"\n        data-interactive={interactiveDetected}\n        ref={ref}\n        className={cardStyles({\n          className,\n          design,\n          intent,\n          hasBackdrop: backdropDetected,\n        })}\n        {...props}\n      >\n        {children}\n      </Component>\n    </CardContext.Provider>\n  )\n}\n\nCard.displayName = 'Card'\n","import { makeVariants, tw } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nexport const contentStyles = cva(\n  [\n    'relative h-full default:rounded-lg w-full focus-visible:u-outline',\n    'default:transition-colors default:duration-200 ease-linear',\n  ],\n  {\n    variants: {\n      inset: {\n        false: ['default:p-lg'],\n      },\n      design: {\n        filled: [],\n        outlined: [\n          'default:bg-surface group-focus:bg-surface-hovered group-not-disabled:group-data-[interactive=true]:group-hover:bg-surface-hovered',\n        ],\n        tinted: [],\n      },\n      hasBackdrop: {\n        true: ['rounded-t-[16px_8px] '],\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    compoundVariants: [\n      // FILLED\n      {\n        intent: 'main',\n        design: 'filled',\n        class: tw([\n          'bg-main text-on-main group-focus:bg-main-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-main-hovered',\n        ]),\n      },\n      {\n        intent: 'support',\n        design: 'filled',\n        class: tw([\n          'bg-support text-on-support group-focus:bg-support-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-support-hovered',\n        ]),\n      },\n      {\n        intent: 'accent',\n        design: 'filled',\n        class: tw([\n          'bg-accent text-on-accent group-focus:bg-accent-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-accent-hovered',\n        ]),\n      },\n      {\n        intent: 'basic',\n        design: 'filled',\n        class: tw([\n          'bg-basic text-on-basic group-focus:bg-basic-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-basic-hovered',\n        ]),\n      },\n      {\n        intent: 'success',\n        design: 'filled',\n        class: tw([\n          'bg-success text-on-success group-focus:bg-success-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-success-hovered',\n        ]),\n      },\n      {\n        intent: 'alert',\n        design: 'filled',\n        class: tw([\n          'bg-alert text-on-alert group-focus:bg-alert-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-alert-hovered',\n        ]),\n      },\n      {\n        intent: 'danger',\n        design: 'filled',\n        class: tw([\n          'text-on-error bg-error group-focus:bg-error-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-error-hovered',\n        ]),\n      },\n      {\n        intent: 'info',\n        design: 'filled',\n        class: tw([\n          'text-on-error bg-info group-focus:bg-info-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-info-hovered',\n        ]),\n      },\n      {\n        intent: 'neutral',\n        design: 'filled',\n        class: tw([\n          'bg-neutral text-on-neutral group-focus:bg-neutral-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-neutral-hovered',\n        ]),\n      },\n      {\n        intent: 'surface',\n        design: 'filled',\n        class: tw([\n          'bg-surface text-on-surface group-focus:bg-surface-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-surface-hovered',\n        ]),\n      },\n      // OUTLINED\n      /**\n       * Outlined styles are handled by the Card component (parent)\n       */\n      // TINTED\n      {\n        intent: 'main',\n        design: 'tinted',\n        class: tw([\n          'bg-main-container text-on-main-container group-focus:bg-main-container-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-main-container-hovered',\n        ]),\n      },\n      {\n        intent: 'support',\n        design: 'tinted',\n        class: tw([\n          'bg-support-container text-on-support-container group-focus:bg-support-container-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-support-container-hovered',\n        ]),\n      },\n      {\n        intent: 'accent',\n        design: 'tinted',\n        class: tw([\n          'bg-accent-container text-on-accent-container group-focus:bg-accent-container-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-accent-container-hovered',\n        ]),\n      },\n      {\n        intent: 'basic',\n        design: 'tinted',\n        class: tw([\n          'bg-basic-container text-on-basic-container group-focus:bg-basic-container-hovered',\n        ]),\n      },\n      {\n        intent: 'success',\n        design: 'tinted',\n        class: tw([\n          'bg-success-container text-on-success-container group-focus:bg-success-container-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-success-container-hovered',\n        ]),\n      },\n      {\n        intent: 'alert',\n        design: 'tinted',\n        class: tw([\n          'bg-alert-container text-on-alert-container group-focus:bg-alert-container-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-alert-container-hovered',\n        ]),\n      },\n      {\n        intent: 'danger',\n        design: 'tinted',\n        class: tw([\n          'bg-error-container text-on-error-container group-focus:bg-error-container-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-error-container-hovered',\n        ]),\n      },\n      {\n        intent: 'info',\n        design: 'tinted',\n        class: tw([\n          'bg-info-container text-on-info-container group-focus:bg-info-container-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-info-container-hovered',\n        ]),\n      },\n      {\n        intent: 'neutral',\n        design: 'tinted',\n        class: tw([\n          'bg-neutral-container text-on-neutral-container group-focus:bg-neutral-container-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-neutral-container-hovered',\n        ]),\n      },\n      {\n        intent: 'surface',\n        design: 'tinted',\n        class: tw([\n          'bg-surface text-on-surface group-focus:bg-surface-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-surface-hovered',\n        ]),\n      },\n    ],\n    defaultVariants: {\n      design: 'filled',\n      intent: 'surface',\n      inset: false,\n      hasBackdrop: true,\n    },\n  }\n)\n\nexport type ContentStylesProps = VariantProps<typeof contentStyles>\n","import { ComponentProps } from 'react'\n\nimport { Slot } from '../slot'\nimport { contentStyles } from './Content.styles'\nimport { useCardContext } from './context'\n\nexport interface ContentProps extends ComponentProps<'div'> {\n  /**\n   * Change the component to the HTML tag or custom component of the only child.\n   */\n  asChild?: boolean\n  /**\n   * Whether the card should have an inset padding.\n   */\n  inset?: boolean\n}\n\nexport const Content = ({ children, inset, asChild, className, ref, ...props }: ContentProps) => {\n  const Component = asChild ? Slot : 'div'\n  const { design, intent, hasBackdrop } = useCardContext()\n\n  return (\n    <Component\n      data-spark-component=\"card-content\"\n      ref={ref}\n      className={contentStyles({\n        className,\n        design,\n        intent,\n        inset,\n        hasBackdrop,\n      })}\n      {...props}\n    >\n      {children}\n    </Component>\n  )\n}\n\nContent.displayName = 'Content'\n","import { Backdrop } from './Backdrop'\nimport { Card as Root } from './Card'\nimport { Content } from './Content'\n\nexport const Card: typeof Root & {\n  Content: typeof Content\n  Backdrop: typeof Backdrop\n} = Object.assign(Root, {\n  Content,\n  Backdrop,\n})\n\nCard.displayName = 'Card'\nContent.displayName = 'Card.Content'\nBackdrop.displayName = 'Card.Backdrop'\n\nexport { type CardProps } from './Card'\n"],"names":["backdropStyles","cva","makeVariants","Backdrop","intent","animation","props","jsx","cardStyles","tw","CardContext","createContext","useCardContext","context","useContext","MOUSE_EVENTS","hasBackdrop","children","backdropFound","searchForBackdrop","node","Children","child","isValidElement","childChildren","isInteractive","asChild","event","interactiveElements","childProps","Card","design","inset","className","ref","Component","Slot","backdropDetected","interactiveDetected","contentStyles","Content","Root"],"mappings":";;;;;AAGO,MAAMA,IAAiBC;AAAA,EAC5B;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA;AAAA,EAEF;AAAA,IACE,UAAU;AAAA,MACR,WAAW;AAAA,QACT,MAAM;AAAA,QACN,OAAO;AAAA,MAAA;AAAA,MAET,QAAQC,EAeN;AAAA,QACA,MAAM,CAAC,sEAAsE;AAAA,QAC7E,SAAS,CAAC,+EAA+E;AAAA,QACzF,QAAQ,CAAC,4EAA4E;AAAA,QACrF,OAAO,CAAC,yEAAyE;AAAA,QACjF,SAAS,CAAC,+EAA+E;AAAA,QACzF,OAAO,CAAC,yEAAyE;AAAA,QACjF,QAAQ,CAAC,yEAAyE;AAAA,QAClF,MAAM,CAAC,sEAAsE;AAAA,QAC7E,SAAS,CAAC,+EAA+E;AAAA,QACzF,SAAS,CAAC,+EAA+E;AAAA,QACzF,gBAAgB;AAAA,UACd;AAAA,QAAA;AAAA,MACF,CACD;AAAA,IAAA;AAAA,IAEH,iBAAiB;AAAA,MACf,QAAQ;AAAA,MACR,WAAW;AAAA,IAAA;AAAA,EACb;AAEJ,GAQaC,IAAW,CAAC,EAAE,QAAAC,IAAS,QAAQ,WAAAC,IAAY,QAAQ,GAAGC,QAC1D,gBAAAC,EAAC,OAAA,EAAI,WAAWP,EAAe,EAAE,QAAAI,GAAQ,WAAAC,EAAA,CAAW,GAAI,GAAGC,GAAO;AAG3EH,EAAS,cAAc;AC7DhB,MAAMK,IAAaP;AAAA,EACxB;AAAA,IACE;AAAA,IACA;AAAA,EAAA;AAAA,EAEF;AAAA,IACE,UAAU;AAAA,MACR,QAAQ;AAAA,QACN,QAAQ,CAAA;AAAA,QACR,UAAU,CAAC,WAAW;AAAA,QACtB,QAAQ,CAAA;AAAA,MAAC;AAAA,MAEX,aAAa;AAAA,QACX,MAAM,CAAC,OAAO;AAAA,MAAA;AAAA;AAAA;AAAA;AAAA,MAKhB,QAAQC,EAeN;AAAA,QACA,MAAM,CAAA;AAAA,QACN,SAAS,CAAA;AAAA,QACT,QAAQ,CAAA;AAAA,QACR,OAAO,CAAA;AAAA,QACP,SAAS,CAAA;AAAA,QACT,OAAO,CAAA;AAAA,QACP,QAAQ,CAAA;AAAA,QACR,MAAM,CAAA;AAAA,QACN,SAAS,CAAA;AAAA,QACT,SAAS,CAAA;AAAA,QACT,gBAAgB,CAAA;AAAA,MAAC,CAClB;AAAA,IAAA;AAAA,IAEH,kBAAkB;AAAA;AAAA,MAEhB,EAAE,QAAQ,QAAQ,QAAQ,YAAY,OAAOO,EAAG,CAAC,aAAa,CAAC,EAAA;AAAA,MAC/D,EAAE,QAAQ,WAAW,QAAQ,YAAY,OAAOA,EAAG,CAAC,gBAAgB,CAAC,EAAA;AAAA,MACrE,EAAE,QAAQ,UAAU,QAAQ,YAAY,OAAOA,EAAG,CAAC,eAAe,CAAC,EAAA;AAAA,MACnE,EAAE,QAAQ,SAAS,QAAQ,YAAY,OAAOA,EAAG,CAAC,cAAc,CAAC,EAAA;AAAA,MACjE,EAAE,QAAQ,WAAW,QAAQ,YAAY,OAAOA,EAAG,CAAC,gBAAgB,CAAC,EAAA;AAAA,MACrE,EAAE,QAAQ,SAAS,QAAQ,YAAY,OAAOA,EAAG,CAAC,cAAc,CAAC,EAAA;AAAA,MACjE,EAAE,QAAQ,UAAU,QAAQ,YAAY,OAAOA,EAAG,CAAC,cAAc,CAAC,EAAA;AAAA,MAClE,EAAE,QAAQ,QAAQ,QAAQ,YAAY,OAAOA,EAAG,CAAC,aAAa,CAAC,EAAA;AAAA,MAC/D,EAAE,QAAQ,WAAW,QAAQ,YAAY,OAAOA,EAAG,CAAC,gBAAgB,CAAC,EAAA;AAAA,MACrE,EAAE,QAAQ,WAAW,QAAQ,YAAY,OAAOA,EAAG,CAAC,gBAAgB,CAAC,EAAA;AAAA,IAAE;AAAA,IAEzE,iBAAiB;AAAA,MACf,QAAQ;AAAA,MACR,QAAQ;AAAA,IAAA;AAAA,EACV;AAEJ,GCxDMC,IAAcC,EAA4C,MAAS,GAE5DC,IAAiB,MAAM;AAClC,QAAMC,IAAUC,EAAWJ,CAAW;AACtC,MAAI,CAACG;AACH,UAAM,IAAI,MAAM,qDAAqD;AAGvE,SAAOA;AACT,GCnBME,IAAe;AAAA,EACnB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAEaC,IAAc,CAACC,MAAiC;AAC3D,MAAIC,IAAgB;AAEpB,QAAMC,IAAoB,CAACC,MAA0B;AACnD,IAAIF,KAEJG,EAAS,QAAQD,GAAM,CAAAE,MAAS;AAC9B,UAAI,CAAAJ,KAEAK,EAAeD,CAAK,GAAG;AAKzB,YAHE,OAAOA,EAAM,QAAS,cACrBA,EAAM,KAAkC,gBAAgB,iBAElC;AACvB,UAAAJ,IAAgB;AAEhB;AAAA,QACF;AAKA,YAFEI,EAAM,SAAS,OAAOA,EAAM,SAAU,YAAY,cAAcA,EAAM,OAEvD;AACf,gBAAME,IAAiBF,EAAM,MAAkC;AAC/D,UAAmCE,KAAkB,QACnDL,EAAkBK,CAAa;AAAA,QAEnC;AAAA,MACF;AAAA,IACF,CAAC;AAAA,EACH;AAEA,SAAAL,EAAkBF,CAAQ,GAEnBC;AACT,GAEaO,IAAgB,CAC3BR,GACAS,GACApB,MACY;AAGZ,MAF8BS,EAAa,KAAK,CAAAY,MAASA,KAASrB,CAAK;AAGrE,WAAO;AAGT,MAAI,CAACoB;AACH,WAAO;AAGT,QAAMJ,IAAQD,EAAS,KAAKJ,CAAQ;AAEpC,MAAI,CAACM,EAAeD,CAAK;AACvB,WAAO;AAGT,QAAMM,IAAsB,CAAC,KAAK,QAAQ;AAI1C,MAFE,OAAON,EAAM,QAAS,YAAYM,EAAoB,SAASN,EAAM,IAAI;AAGzE,WAAO;AAGT,QAAMO,IAAaP,EAAM;AAGzB,SAF8BP,EAAa,KAAK,CAAAY,MAASA,KAASE,CAAU;AAG9E,GCpEaC,IAAO,CAAC;AAAA,EACnB,UAAAb;AAAA,EACA,QAAAc,IAAS;AAAA,EACT,QAAA3B,IAAS;AAAA,EACT,OAAA4B,IAAQ;AAAA,EACR,SAAAN;AAAA,EACA,WAAAO;AAAA,EACA,KAAAC;AAAA,EACA,GAAG5B;AACL,MAAiB;AACf,QAAM6B,IAAYT,IAAUU,IAAO,OAC7BC,IAAmBrB,EAAYC,CAAQ,GACvCqB,IAAsBb,EAAcR,GAAUS,GAASpB,CAAK;AAElE,SACE,gBAAAC;AAAA,IAACG,EAAY;AAAA,IAAZ;AAAA,MACC,OAAO;AAAA,QACL,QAAAqB;AAAA,QACA,QAAA3B;AAAA,QACA,aAAaiC;AAAA,QACb,OAAAL;AAAA,QACA,eAAeM;AAAA,MAAA;AAAA,MAGjB,UAAA,gBAAA/B;AAAA,QAAC4B;AAAA,QAAA;AAAA,UACC,wBAAqB;AAAA,UACrB,oBAAkBG;AAAA,UAClB,KAAAJ;AAAA,UACA,WAAW1B,EAAW;AAAA,YACpB,WAAAyB;AAAA,YACA,QAAAF;AAAA,YACA,QAAA3B;AAAA,YACA,aAAaiC;AAAA,UAAA,CACd;AAAA,UACA,GAAG/B;AAAA,UAEH,UAAAW;AAAA,QAAA;AAAA,MAAA;AAAA,IACH;AAAA,EAAA;AAGN;AAEAa,EAAK,cAAc;ACzDZ,MAAMS,IAAgBtC;AAAA,EAC3B;AAAA,IACE;AAAA,IACA;AAAA,EAAA;AAAA,EAEF;AAAA,IACE,UAAU;AAAA,MACR,OAAO;AAAA,QACL,OAAO,CAAC,cAAc;AAAA,MAAA;AAAA,MAExB,QAAQ;AAAA,QACN,QAAQ,CAAA;AAAA,QACR,UAAU;AAAA,UACR;AAAA,QAAA;AAAA,QAEF,QAAQ,CAAA;AAAA,MAAC;AAAA,MAEX,aAAa;AAAA,QACX,MAAM,CAAC,uBAAuB;AAAA,MAAA;AAAA,MAEhC,QAAQC,EAeN;AAAA,QACA,MAAM,CAAA;AAAA,QACN,SAAS,CAAA;AAAA,QACT,QAAQ,CAAA;AAAA,QACR,OAAO,CAAA;AAAA,QACP,SAAS,CAAA;AAAA,QACT,OAAO,CAAA;AAAA,QACP,QAAQ,CAAA;AAAA,QACR,MAAM,CAAA;AAAA,QACN,SAAS,CAAA;AAAA,QACT,SAAS,CAAA;AAAA,QACT,gBAAgB,CAAA;AAAA,MAAC,CAClB;AAAA,IAAA;AAAA,IAEH,kBAAkB;AAAA;AAAA,MAEhB;AAAA,QACE,QAAQ;AAAA,QACR,QAAQ;AAAA,QACR,OAAOO,EAAG;AAAA,UACR;AAAA,UACA;AAAA,QAAA,CACD;AAAA,MAAA;AAAA,MAEH;AAAA,QACE,QAAQ;AAAA,QACR,QAAQ;AAAA,QACR,OAAOA,EAAG;AAAA,UACR;AAAA,UACA;AAAA,QAAA,CACD;AAAA,MAAA;AAAA,MAEH;AAAA,QACE,QAAQ;AAAA,QACR,QAAQ;AAAA,QACR,OAAOA,EAAG;AAAA,UACR;AAAA,UACA;AAAA,QAAA,CACD;AAAA,MAAA;AAAA,MAEH;AAAA,QACE,QAAQ;AAAA,QACR,QAAQ;AAAA,QACR,OAAOA,EAAG;AAAA,UACR;AAAA,UACA;AAAA,QAAA,CACD;AAAA,MAAA;AAAA,MAEH;AAAA,QACE,QAAQ;AAAA,QACR,QAAQ;AAAA,QACR,OAAOA,EAAG;AAAA,UACR;AAAA,UACA;AAAA,QAAA,CACD;AAAA,MAAA;AAAA,MAEH;AAAA,QACE,QAAQ;AAAA,QACR,QAAQ;AAAA,QACR,OAAOA,EAAG;AAAA,UACR;AAAA,UACA;AAAA,QAAA,CACD;AAAA,MAAA;AAAA,MAEH;AAAA,QACE,QAAQ;AAAA,QACR,QAAQ;AAAA,QACR,OAAOA,EAAG;AAAA,UACR;AAAA,UACA;AAAA,QAAA,CACD;AAAA,MAAA;AAAA,MAEH;AAAA,QACE,QAAQ;AAAA,QACR,QAAQ;AAAA,QACR,OAAOA,EAAG;AAAA,UACR;AAAA,UACA;AAAA,QAAA,CACD;AAAA,MAAA;AAAA,MAEH;AAAA,QACE,QAAQ;AAAA,QACR,QAAQ;AAAA,QACR,OAAOA,EAAG;AAAA,UACR;AAAA,UACA;AAAA,QAAA,CACD;AAAA,MAAA;AAAA,MAEH;AAAA,QACE,QAAQ;AAAA,QACR,QAAQ;AAAA,QACR,OAAOA,EAAG;AAAA,UACR;AAAA,UACA;AAAA,QAAA,CACD;AAAA,MAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAOH;AAAA,QACE,QAAQ;AAAA,QACR,QAAQ;AAAA,QACR,OAAOA,EAAG;AAAA,UACR;AAAA,UACA;AAAA,QAAA,CACD;AAAA,MAAA;AAAA,MAEH;AAAA,QACE,QAAQ;AAAA,QACR,QAAQ;AAAA,QACR,OAAOA,EAAG;AAAA,UACR;AAAA,UACA;AAAA,QAAA,CACD;AAAA,MAAA;AAAA,MAEH;AAAA,QACE,QAAQ;AAAA,QACR,QAAQ;AAAA,QACR,OAAOA,EAAG;AAAA,UACR;AAAA,UACA;AAAA,QAAA,CACD;AAAA,MAAA;AAAA,MAEH;AAAA,QACE,QAAQ;AAAA,QACR,QAAQ;AAAA,QACR,OAAOA,EAAG;AAAA,UACR;AAAA,QAAA,CACD;AAAA,MAAA;AAAA,MAEH;AAAA,QACE,QAAQ;AAAA,QACR,QAAQ;AAAA,QACR,OAAOA,EAAG;AAAA,UACR;AAAA,UACA;AAAA,QAAA,CACD;AAAA,MAAA;AAAA,MAEH;AAAA,QACE,QAAQ;AAAA,QACR,QAAQ;AAAA,QACR,OAAOA,EAAG;AAAA,UACR;AAAA,UACA;AAAA,QAAA,CACD;AAAA,MAAA;AAAA,MAEH;AAAA,QACE,QAAQ;AAAA,QACR,QAAQ;AAAA,QACR,OAAOA,EAAG;AAAA,UACR;AAAA,UACA;AAAA,QAAA,CACD;AAAA,MAAA;AAAA,MAEH;AAAA,QACE,QAAQ;AAAA,QACR,QAAQ;AAAA,QACR,OAAOA,EAAG;AAAA,UACR;AAAA,UACA;AAAA,QAAA,CACD;AAAA,MAAA;AAAA,MAEH;AAAA,QACE,QAAQ;AAAA,QACR,QAAQ;AAAA,QACR,OAAOA,EAAG;AAAA,UACR;AAAA,UACA;AAAA,QAAA,CACD;AAAA,MAAA;AAAA,MAEH;AAAA,QACE,QAAQ;AAAA,QACR,QAAQ;AAAA,QACR,OAAOA,EAAG;AAAA,UACR;AAAA,UACA;AAAA,QAAA,CACD;AAAA,MAAA;AAAA,IACH;AAAA,IAEF,iBAAiB;AAAA,MACf,QAAQ;AAAA,MACR,QAAQ;AAAA,MACR,OAAO;AAAA,MACP,aAAa;AAAA,IAAA;AAAA,EACf;AAEJ,GCjNa+B,IAAU,CAAC,EAAE,UAAAvB,GAAU,OAAAe,GAAO,SAAAN,GAAS,WAAAO,GAAW,KAAAC,GAAK,GAAG5B,QAA0B;AAC/F,QAAM6B,IAAYT,IAAUU,IAAO,OAC7B,EAAE,QAAAL,GAAQ,QAAA3B,GAAQ,aAAAY,EAAA,IAAgBJ,EAAA;AAExC,SACE,gBAAAL;AAAA,IAAC4B;AAAA,IAAA;AAAA,MACC,wBAAqB;AAAA,MACrB,KAAAD;AAAA,MACA,WAAWK,EAAc;AAAA,QACvB,WAAAN;AAAA,QACA,QAAAF;AAAA,QACA,QAAA3B;AAAA,QACA,OAAA4B;AAAA,QACA,aAAAhB;AAAA,MAAA,CACD;AAAA,MACA,GAAGV;AAAA,MAEH,UAAAW;AAAA,IAAA;AAAA,EAAA;AAGP;AAEAuB,EAAQ,cAAc;ACnCf,MAAMV,IAGT,OAAO,OAAOW,GAAM;AAAA,EACtB,SAAAD;AAAA,EACA,UAAArC;AACF,CAAC;AAED2B,EAAK,cAAc;AACnBU,EAAQ,cAAc;AACtBrC,EAAS,cAAc;"}
+{"version":3,"file":"index.mjs","sources":["../../src/card/Backdrop.tsx","../../src/card/Card.styles.tsx","../../src/card/context.tsx","../../src/card/utils.ts","../../src/card/Card.tsx","../../src/card/Content.styles.tsx","../../src/card/Content.tsx","../../src/card/index.ts"],"sourcesContent":["import { makeVariants } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nexport const backdropStyles = cva(\n  [\n    'default:bg-surface default:bg-gradient-to-r absolute inset-x-0 top-0',\n    'h-sz-16',\n    'default:rounded-t-lg',\n    'bg-[length:200%_100%] bg-position-[0%_0%]',\n  ],\n  {\n    variants: {\n      animation: {\n        none: '',\n        pulse: 'animate-standalone-backdrop-pulse',\n      },\n      intent: makeVariants<\n        'intent',\n        [\n          'main',\n          'support',\n          'accent',\n          'success',\n          'alert',\n          'danger',\n          'info',\n          'neutral',\n          'surface',\n          'surfaceInverse',\n        ]\n      >({\n        main: ['default:from-main/dim-4 default:via-main/dim-2 default:to-main/dim-4'],\n        support: ['default:from-support/dim-4 default:via-support/dim-2 default:to-support/dim-4'],\n        accent: ['default:from-accent/dim-4 default:via-accent/dim-2 default:to-accent/dim-4'],\n        success: ['default:from-success/dim-4 default:via-success/dim-2 default:to-success/dim-4'],\n        alert: ['default:from-alert/dim-4 default:via-alert/dim-2 default:to-alert/dim-4'],\n        danger: ['default:from-error/dim-4 default:via-error/dim-2 default:to-error/dim-4'],\n        info: ['default:from-info/dim-4 default:via-info/dim-2 default:to-info/dim-4'],\n        neutral: ['default:from-neutral/dim-4 default:via-neutral/dim-2 default:to-neutral/dim-4'],\n        surface: ['default:from-outline/dim-4 default:via-outline/dim-2 default:to-outline/dim-4'],\n        surfaceInverse: [\n          'default:from-surface/dim-4 default:via-surface/dim-2 default:to-surface/dim-4',\n        ],\n      }),\n    },\n    defaultVariants: {\n      intent: 'main',\n      animation: 'none',\n    },\n  }\n)\n\nexport type BackdropStylesProps = VariantProps<typeof backdropStyles>\n\ninterface BackdropProps extends BackdropStylesProps {\n  className?: string\n}\n\nexport const Backdrop = ({ intent = 'main', animation = 'none', ...props }: BackdropProps) => {\n  return <div className={backdropStyles({ intent, animation })} {...props} />\n}\n\nBackdrop.displayName = 'Card.Backdrop'\n","import { makeVariants, tw } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nexport const cardStyles = cva(\n  [\n    'group relative bg-clip-padding default:rounded-lg focus-visible:u-outline',\n    'disabled:opacity-dim-3 disabled:cursor-not-allowed',\n  ],\n  {\n    variants: {\n      design: {\n        filled: [],\n        outlined: ['border-sm'],\n        tinted: [],\n      },\n      hasBackdrop: {\n        true: ['pt-md'],\n      },\n      /**\n       * Color scheme of the button.\n       */\n      intent: makeVariants<\n        'intent',\n        [\n          'main',\n          'support',\n          'accent',\n          'success',\n          'alert',\n          'danger',\n          'info',\n          'neutral',\n          'surface',\n          'surfaceInverse',\n        ]\n      >({\n        main: [],\n        support: [],\n        accent: [],\n        success: [],\n        alert: [],\n        danger: [],\n        info: [],\n        neutral: [],\n        surface: [],\n        surfaceInverse: [],\n      }),\n    },\n    compoundVariants: [\n      // OUTLINED\n      { intent: 'main', design: 'outlined', class: tw(['border-main']) },\n      { intent: 'support', design: 'outlined', class: tw(['border-support']) },\n      { intent: 'accent', design: 'outlined', class: tw(['border-accent']) },\n      { intent: 'success', design: 'outlined', class: tw(['border-success']) },\n      { intent: 'alert', design: 'outlined', class: tw(['border-alert']) },\n      { intent: 'danger', design: 'outlined', class: tw(['border-error']) },\n      { intent: 'info', design: 'outlined', class: tw(['border-info']) },\n      { intent: 'neutral', design: 'outlined', class: tw(['border-neutral']) },\n      { intent: 'surface', design: 'outlined', class: tw(['border-outline']) },\n    ],\n    defaultVariants: {\n      design: 'filled',\n      intent: 'surface',\n    },\n  }\n)\n\nexport type CardStylesProps = VariantProps<typeof cardStyles>\n","import { createContext, useContext } from 'react'\n\nimport type { CardStylesProps } from './Card.styles'\n\nexport interface CardContextValue {\n  design: CardStylesProps['design']\n  intent: CardStylesProps['intent']\n  hasBackdrop: boolean\n  inset: boolean\n  isInteractive: boolean\n}\n\nconst CardContext = createContext<CardContextValue | undefined>(undefined)\n\nexport const useCardContext = () => {\n  const context = useContext(CardContext)\n  if (!context) {\n    throw new Error('useCardContext must be used within a Card component')\n  }\n\n  return context\n}\n\nexport { CardContext }\n","import { Children, isValidElement, ReactNode } from 'react'\n\nconst MOUSE_EVENTS = [\n  'onClick',\n  'onMouseDown',\n  'onMouseUp',\n  'onMouseEnter',\n  'onMouseLeave',\n  'onMouseMove',\n  'onMouseOver',\n  'onMouseOut',\n  'onDoubleClick',\n  'onContextMenu',\n] as const\n\nexport const hasBackdrop = (children: ReactNode): boolean => {\n  let backdropFound = false\n\n  const searchForBackdrop = (node: ReactNode): void => {\n    if (backdropFound) return\n\n    Children.forEach(node, child => {\n      if (backdropFound) return\n\n      if (isValidElement(child)) {\n        const isBackdropComponent =\n          typeof child.type === 'function' &&\n          (child.type as { displayName?: string }).displayName === 'Card.Backdrop'\n\n        if (isBackdropComponent) {\n          backdropFound = true\n\n          return\n        }\n\n        const hasChildren =\n          child.props && typeof child.props === 'object' && 'children' in child.props\n\n        if (hasChildren) {\n          const childChildren = (child.props as { children: ReactNode }).children\n          if (childChildren !== undefined && childChildren !== null) {\n            searchForBackdrop(childChildren)\n          }\n        }\n      }\n    })\n  }\n\n  searchForBackdrop(children)\n\n  return backdropFound\n}\n\nexport const isInteractive = (\n  children: ReactNode,\n  asChild: boolean | undefined,\n  props: Record<string, any>\n): boolean => {\n  const hasMouseEventHandlers = MOUSE_EVENTS.some(event => event in props)\n\n  if (hasMouseEventHandlers) {\n    return true\n  }\n\n  if (!asChild) {\n    return false\n  }\n\n  const child = Children.only(children)\n\n  if (!isValidElement(child)) {\n    return false\n  }\n\n  const interactiveElements = ['a', 'button']\n  const isInteractiveElement =\n    typeof child.type === 'string' && interactiveElements.includes(child.type)\n\n  if (isInteractiveElement) {\n    return true\n  }\n\n  const childProps = child.props as Record<string, any>\n  const hasChildEventHandlers = MOUSE_EVENTS.some(event => event in childProps)\n\n  return hasChildEventHandlers\n}\n","import { ComponentProps } from 'react'\n\nimport { Slot } from '../slot'\nimport { cardStyles, type CardStylesProps } from './Card.styles'\nimport { CardContext } from './context'\nimport { hasBackdrop, isInteractive } from './utils'\n\nexport interface CardProps extends ComponentProps<'div'>, CardStylesProps {\n  /**\n   * Change the component to the HTML tag or custom component of the only child.\n   */\n  asChild?: boolean\n  /**\n   * Whether the card should have an inset padding.\n   */\n  inset?: boolean\n}\n\nexport const Card = ({\n  children,\n  design = 'filled',\n  intent = 'surface',\n  inset = false,\n  asChild,\n  className,\n  ref,\n  ...props\n}: CardProps) => {\n  const Component = asChild ? Slot : 'div'\n  const backdropDetected = hasBackdrop(children)\n  const interactiveDetected = isInteractive(children, asChild, props)\n\n  return (\n    <CardContext.Provider\n      value={{\n        design,\n        intent,\n        hasBackdrop: backdropDetected,\n        inset,\n        isInteractive: interactiveDetected,\n      }}\n    >\n      <Component\n        data-spark-component=\"card\"\n        data-interactive={interactiveDetected}\n        ref={ref}\n        className={cardStyles({\n          className,\n          design,\n          intent,\n          hasBackdrop: backdropDetected,\n        })}\n        {...props}\n      >\n        {children}\n      </Component>\n    </CardContext.Provider>\n  )\n}\n\nCard.displayName = 'Card'\n","import { makeVariants, tw } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nexport const contentStyles = cva(\n  [\n    'relative h-full default:rounded-lg w-full focus-visible:u-outline',\n    'default:transition-colors default:duration-200 ease-linear',\n  ],\n  {\n    variants: {\n      inset: {\n        false: ['default:p-lg'],\n      },\n      design: {\n        filled: [],\n        outlined: [\n          'default:bg-surface group-focus:bg-surface-hovered group-not-disabled:group-data-[interactive=true]:group-hover:bg-surface-hovered',\n        ],\n        tinted: [],\n      },\n      hasBackdrop: {\n        true: ['rounded-t-[16px_8px] '],\n      },\n      intent: makeVariants<\n        'intent',\n        [\n          'main',\n          'support',\n          'accent',\n          'success',\n          'alert',\n          'danger',\n          'info',\n          'neutral',\n          'surface',\n          'surfaceInverse',\n        ]\n      >({\n        main: [],\n        support: [],\n        accent: [],\n        success: [],\n        alert: [],\n        danger: [],\n        info: [],\n        neutral: [],\n        surface: [],\n        surfaceInverse: [],\n      }),\n    },\n    compoundVariants: [\n      // FILLED\n      {\n        intent: 'main',\n        design: 'filled',\n        class: tw([\n          'bg-main text-on-main group-focus:bg-main-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-main-hovered',\n        ]),\n      },\n      {\n        intent: 'support',\n        design: 'filled',\n        class: tw([\n          'bg-support text-on-support group-focus:bg-support-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-support-hovered',\n        ]),\n      },\n      {\n        intent: 'accent',\n        design: 'filled',\n        class: tw([\n          'bg-accent text-on-accent group-focus:bg-accent-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-accent-hovered',\n        ]),\n      },\n      {\n        intent: 'success',\n        design: 'filled',\n        class: tw([\n          'bg-success text-on-success group-focus:bg-success-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-success-hovered',\n        ]),\n      },\n      {\n        intent: 'alert',\n        design: 'filled',\n        class: tw([\n          'bg-alert text-on-alert group-focus:bg-alert-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-alert-hovered',\n        ]),\n      },\n      {\n        intent: 'danger',\n        design: 'filled',\n        class: tw([\n          'text-on-error bg-error group-focus:bg-error-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-error-hovered',\n        ]),\n      },\n      {\n        intent: 'info',\n        design: 'filled',\n        class: tw([\n          'text-on-error bg-info group-focus:bg-info-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-info-hovered',\n        ]),\n      },\n      {\n        intent: 'neutral',\n        design: 'filled',\n        class: tw([\n          'bg-neutral text-on-neutral group-focus:bg-neutral-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-neutral-hovered',\n        ]),\n      },\n      {\n        intent: 'surface',\n        design: 'filled',\n        class: tw([\n          'bg-surface text-on-surface group-focus:bg-surface-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-surface-hovered',\n        ]),\n      },\n      // OUTLINED\n      /**\n       * Outlined styles are handled by the Card component (parent)\n       */\n      // TINTED\n      {\n        intent: 'main',\n        design: 'tinted',\n        class: tw([\n          'bg-main-container text-on-main-container group-focus:bg-main-container-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-main-container-hovered',\n        ]),\n      },\n      {\n        intent: 'support',\n        design: 'tinted',\n        class: tw([\n          'bg-support-container text-on-support-container group-focus:bg-support-container-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-support-container-hovered',\n        ]),\n      },\n      {\n        intent: 'accent',\n        design: 'tinted',\n        class: tw([\n          'bg-accent-container text-on-accent-container group-focus:bg-accent-container-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-accent-container-hovered',\n        ]),\n      },\n      {\n        intent: 'success',\n        design: 'tinted',\n        class: tw([\n          'bg-success-container text-on-success-container group-focus:bg-success-container-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-success-container-hovered',\n        ]),\n      },\n      {\n        intent: 'alert',\n        design: 'tinted',\n        class: tw([\n          'bg-alert-container text-on-alert-container group-focus:bg-alert-container-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-alert-container-hovered',\n        ]),\n      },\n      {\n        intent: 'danger',\n        design: 'tinted',\n        class: tw([\n          'bg-error-container text-on-error-container group-focus:bg-error-container-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-error-container-hovered',\n        ]),\n      },\n      {\n        intent: 'info',\n        design: 'tinted',\n        class: tw([\n          'bg-info-container text-on-info-container group-focus:bg-info-container-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-info-container-hovered',\n        ]),\n      },\n      {\n        intent: 'neutral',\n        design: 'tinted',\n        class: tw([\n          'bg-neutral-container text-on-neutral-container group-focus:bg-neutral-container-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-neutral-container-hovered',\n        ]),\n      },\n      {\n        intent: 'surface',\n        design: 'tinted',\n        class: tw([\n          'bg-surface text-on-surface group-focus:bg-surface-hovered',\n          'group-not-disabled:group-data-[interactive=true]:group-hover:bg-surface-hovered',\n        ]),\n      },\n    ],\n    defaultVariants: {\n      design: 'filled',\n      intent: 'surface',\n      inset: false,\n      hasBackdrop: true,\n    },\n  }\n)\n\nexport type ContentStylesProps = VariantProps<typeof contentStyles>\n","import { ComponentProps } from 'react'\n\nimport { Slot } from '../slot'\nimport { contentStyles } from './Content.styles'\nimport { useCardContext } from './context'\n\nexport interface ContentProps extends ComponentProps<'div'> {\n  /**\n   * Change the component to the HTML tag or custom component of the only child.\n   */\n  asChild?: boolean\n  /**\n   * Whether the card should have an inset padding.\n   */\n  inset?: boolean\n}\n\nexport const Content = ({ children, inset, asChild, className, ref, ...props }: ContentProps) => {\n  const Component = asChild ? Slot : 'div'\n  const { design, intent, hasBackdrop } = useCardContext()\n\n  return (\n    <Component\n      data-spark-component=\"card-content\"\n      ref={ref}\n      className={contentStyles({\n        className,\n        design,\n        intent,\n        inset,\n        hasBackdrop,\n      })}\n      {...props}\n    >\n      {children}\n    </Component>\n  )\n}\n\nContent.displayName = 'Content'\n","import { Backdrop } from './Backdrop'\nimport { Card as Root } from './Card'\nimport { Content } from './Content'\n\nexport const Card: typeof Root & {\n  Content: typeof Content\n  Backdrop: typeof Backdrop\n} = Object.assign(Root, {\n  Content,\n  Backdrop,\n})\n\nCard.displayName = 'Card'\nContent.displayName = 'Card.Content'\nBackdrop.displayName = 'Card.Backdrop'\n\nexport { type CardProps } from './Card'\n"],"names":["backdropStyles","cva","makeVariants","Backdrop","intent","animation","props","jsx","cardStyles","tw","CardContext","createContext","useCardContext","context","useContext","MOUSE_EVENTS","hasBackdrop","children","backdropFound","searchForBackdrop","node","Children","child","isValidElement","childChildren","isInteractive","asChild","event","interactiveElements","childProps","Card","design","inset","className","ref","Component","Slot","backdropDetected","interactiveDetected","contentStyles","Content","Root"],"mappings":"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"}

package/dist/carousel/CarouselPageIndicator.d.ts

@@ -5,7 +5,7 @@ interface Props {
     index: number;
     className?: string;
     unstyled?: boolean;
-    intent?: 'basic' | 'surface';
+    intent?: 'support' | 'surface';
 }
 export declare const CarouselPageIndicator: {
     ({ children, unstyled, index, "aria-label": ariaLabel, className, intent, }: Props): import("react/jsx-runtime").JSX.Element;

package/dist/carousel/index.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const p=require("react/jsx-runtime"),k=require("class-variance-authority"),s=require("react"),se=require("@spark-ui/icons/ArrowVerticalRight"),O=require("../Icon-CF0W0LKr.js"),$=require("../IconButton-D3g86WpZ.js"),oe=require("@spark-ui/icons/ArrowVerticalLeft");function ae(e){const t=s.useRef(new Map),r=s.useRef(null),n=s.useRef(new Map),o=s.useCallback(()=>u=>{u.forEach(d=>{const b=d.isIntersecting,S=d.target;t.current.set(S,b);const h=n.current.get(S);h&&h(b)})},[]),a=s.useCallback(()=>{if(r.current)return r.current;const u=e.current;if(!u)return null;const d=new IntersectionObserver(o(),{root:u,threshold:.2});return r.current=d,d},[e,o]);s.useEffect(()=>{const u=a(),d=t.current,b=n.current;return()=>{u&&(u.disconnect(),d.clear(),b.clear(),r.current=null)}},[a]);const i=s.useCallback((u,d)=>{if(!u)return;const b=a();if(!b){setTimeout(()=>i(u,d),0);return}const S=t.current.get(u)??!0;t.current.set(u,S),n.current.set(u,d),b.observe(u),d(S)},[a]),c=s.useCallback(u=>{if(!u)return;const d=r.current;d&&d.unobserve(u),t.current.delete(u),n.current.delete(u)},[]),g=s.useCallback(u=>u?t.current.get(u)??!0:!0,[]);return{registerSlide:i,unregisterSlide:c,isSlideVisible:g}}function ie(e){const t=s.useRef(()=>{throw new Error("Cannot call an event handler while rendering.")});return s.useLayoutEffect(()=>{t.current=e}),s.useCallback((...r)=>t.current?.(...r),[])}const ce=()=>{const e=s.useRef(!1);return s.useEffect(()=>(e.current=!0,()=>{e.current=!1}),[]),e};function ue(e,t){const r=s.useRef(0),n=s.useRef(null);s.useEffect(()=>{const o=e.current;if(!o)return;const a="onscrollend"in window,i=()=>{t()},c=()=>{n.current&&clearTimeout(n.current),e.current&&(r.current=e.current.scrollLeft,n.current=setTimeout(()=>{e.current&&i()},150))};return a?o.addEventListener("scrollend",i):o.addEventListener("scroll",c),()=>{n.current&&clearTimeout(n.current),a?o.removeEventListener("scrollend",i):o.removeEventListener("scroll",c)}},[t,e])}function le(e,t){s.useLayoutEffect(()=>{const r=e.current;if(!r)return;const n=new ResizeObserver(o=>{for(const a of o)t(a.contentRect.width)});return n.observe(r),()=>n.disconnect()},[e,t])}function de({totalSlides:e,slidesPerMove:t,slidesPerPage:r}){const n=t==="auto"?r:t,o=[],a=Math.floor((e-r)/n)*n;for(let i=0;i<=a;i+=n)o.push(i);return o[o.length-1]!==e-r&&o.push(e-r),o}function q(e){return e?Array.from(e.querySelectorAll('[data-part="item"]')):[]}function _(e,{container:t,slidesPerMove:r,slidesPerPage:n}){return de({totalSlides:q(t).length,slidesPerPage:n,slidesPerMove:r}).includes(e)}function B({container:e,slidesPerMove:t,slidesPerPage:r}){return e?q(e).filter((n,o)=>_(o,{slidesPerMove:t,slidesPerPage:r,container:e})).map(n=>n.offsetLeft):[]}function fe({dotIndex:e,pageState:t,totalPages:r,maxDots:n=5}){if(r<=n)return e===t?"active":"idle";if(t<=Math.floor(n/2))return e>n-1?"hidden":e===t?"active":e===n-1?"edge":"idle";if(t>=r-Math.ceil(n/2)){const i=r-n;return e<i?"hidden":e===t?"active":e===i?"edge":"idle"}const o=t-Math.floor(n/2),a=t+Math.floor(n/2);return e<o||e>a?"hidden":e===t?"active":e===o||e===a?"edge":"idle"}function pe(e=[],{carouselRef:t,slidesPerMove:r,slidesPerPage:n}){const[o,a]=s.useState(e),i=s.useMemo(()=>o,[o]);return le(t,()=>{const c=B({slidesPerMove:r,slidesPerPage:n,container:t.current});JSON.stringify(o)!==JSON.stringify(c)&&a(c)}),[i,a]}const x="carousel",N="ltr",ge=({defaultPage:e,gap:t=16,snapType:r="mandatory",snapStop:n="always",scrollPadding:o=0,slidesPerPage:a=1,slidesPerMove:i="auto",scrollBehavior:c="smooth",loop:g=!1,pagePickerInset:u=!1,maxDots:d=5,page:b,onPageChange:S})=>{const h=s.useId(),[f,I]=s.useState(e||b||0),C=s.useRef(null),M=s.useRef([]),T=ce().current,L=ie(S),{registerSlide:D,unregisterSlide:ee,isSlideVisible:te}=ae(C),[m]=pe([],{carouselRef:C,slidesPerMove:i,slidesPerPage:a}),P=s.useRef(g||f>0),R=s.useRef(g||f<m.length-1);P.current=g||f>0,R.current=g||f<m.length-1;const j=s.useCallback(l=>{l!==f&&(I(l),L?.(l))},[L,f]),y=s.useCallback((l,v)=>{C.current&&(C.current.scrollTo({left:m[l],behavior:v==="instant"?"auto":"smooth"}),j(l))},[j,m]),z=s.useCallback(l=>{if(P){const v=g&&f===0?m.length-1:Math.max(f-1,0);y(v,c),l?.(v)}},[g,m,f,c,y]),A=s.useCallback(l=>{if(R){const v=g&&f===m.length-1?0:Math.min(f+1,m.length-1);y(v,c),l?.(v)}},[g,m,f,c,y]);s.useEffect(()=>{b!=null&&y(b,c)},[b,c,y]),s.useLayoutEffect(()=>{if(e!=null&&!T&&C.current){const l=B({container:C.current,slidesPerMove:i,slidesPerPage:a});C.current.scrollTo({left:l[e],behavior:"instant"})}},[e,T,i,a]);const re=s.useCallback(()=>{if(!C.current||m.length===0)return;const{scrollLeft:l}=C.current,v=m.map(V=>Math.abs(l-V)),E=v.indexOf(Math.min(...v));E!==-1&&j(E)},[m,j]);return ue(C,re),{ref:C,pageIndicatorsRefs:M,gap:t,snapType:r,snapStop:n,scrollPadding:o,slidesPerPage:a,slidesPerMove:i,scrollBehavior:c,loop:g,pagePickerInset:u,maxDots:d,page:f,pageSnapPoints:m,canScrollNext:R.current,canScrollPrev:P.current,scrollTo:y,scrollPrev:z,scrollNext:A,registerSlide:D,unregisterSlide:ee,isSlideVisible:te,getRootProps:()=>({id:`carousel::${h}:`,role:"region","aria-roledescription":"carousel","data-scope":x,"data-part":"root","data-orientation":"horizontal",dir:N,style:{"--slides-per-page":a,"--slide-spacing":`${t}px`,"--slide-item-size":"calc(100% / var(--slides-per-page) - var(--slide-spacing) * (var(--slides-per-page) - 1) / var(--slides-per-page))"}}),getControlProps:()=>({"data-scope":x,"data-part":"control","data-orientation":"horizontal"}),getPrevTriggerProps:()=>({id:`carousel::${h}::prev-trigger`,"aria-controls":`carousel::${h}::item-group`,"data-scope":x,"data-part":"prev-trigger","data-orientation":"horizontal",type:"button",dir:N,disabled:!P.current,onClick:()=>z()}),getNextTriggerProps:()=>({id:`carousel::${h}::next-trigger`,"aria-controls":`carousel::${h}::item-group`,"data-scope":x,"data-part":"next-trigger","data-orientation":"horizontal",type:"button",dir:N,disabled:!R.current,onClick:()=>A()}),getSlidesContainerProps:()=>({id:`carousel::${h}::item-group`,"aria-live":a>1?"off":"polite","data-scope":x,"data-part":"item-group","data-orientation":"horizontal",dir:N,tabIndex:0,style:{display:"grid",gap:"var(--slide-spacing)",scrollSnapType:`x ${r}`,gridAutoFlow:"column",scrollbarWidth:"none",gridAutoColumns:"var(--slide-item-size)",overflowX:"auto"},ref:C}),getSlideProps:({index:l})=>{const v=_(l,{container:C.current,slidesPerMove:i,slidesPerPage:a});return{id:`carousel::${h}::item:${l}`,role:"group","aria-roledescription":"slide","data-scope":x,"data-part":"item","data-index":l,"data-orientation":"horizontal",dir:N,style:{...v&&{scrollSnapAlign:"start",scrollSnapStop:n}}}},getIndicatorGroupProps:()=>({role:"radiogroup",id:`carousel::${h}::indicator-group`,"data-scope":x,"data-part":"indicator-group","data-orientation":"horizontal",dir:N}),getIndicatorProps:({index:l})=>{const v=fe({dotIndex:l,pageState:f,totalPages:m.length,maxDots:d});return{role:"radio",id:`carousel::${h}::indicator:${l}`,"aria-checked":l===f,"data-scope":x,"data-part":"indicator","data-orientation":"horizontal","data-index":l,"data-state":v,tabIndex:l===f?0:-1,onClick:()=>{y(l,c)},onKeyDown:E=>{const V=ne=>{M.current[ne]?.focus()};E.key==="ArrowRight"&&R?A(V):E.key==="ArrowLeft"&&P&&z(V)}}}}},F=s.createContext(null),G=({className:e,snapType:t="mandatory",snapStop:r="always",scrollBehavior:n="smooth",slidesPerMove:o="auto",pagePickerInset:a=!1,slidesPerPage:i=1,loop:c=!1,children:g,gap:u=16,defaultPage:d,page:b,onPageChange:S,maxDots:h=5,...f})=>{const I=ge({defaultPage:d,slidesPerPage:i,slidesPerMove:o,loop:c,gap:u,scrollBehavior:n,snapStop:r,snapType:t,page:b,pagePickerInset:a,onPageChange:S,maxDots:h});return p.jsx(F.Provider,{value:{...I,scrollBehavior:n},children:p.jsx("div",{"data-spark-component":"carousel",className:k.cx("gap-lg relative box-border flex flex-col",e),...I.getRootProps(),...f,children:g})})};G.displayName="Carousel";const w=()=>{const e=s.useContext(F);if(!e)throw Error("useCarouselContext must be used within a Carousel provider");return e},J=({children:e,className:t,...r})=>{const n=w();return p.jsx("div",{"data-spark-component":"carousel-controls",className:k.cx("default:px-lg pointer-events-none absolute inset-0 flex flex-row items-center justify-between",t),...n.getControlProps(),...r,children:e})};J.displayName="Carousel.Controls";const W=({"aria-label":e,...t})=>{const r=w();return p.jsx($.IconButton,{"data-spark-component":"carousel-next-button",...r.getNextTriggerProps(),intent:"surface",design:"filled",className:"pointer-events-auto cursor-pointer shadow-sm disabled:invisible","aria-label":e,...t,children:p.jsx(O.Icon,{children:p.jsx(se.ArrowVerticalRight,{})})})};W.displayName="Carousel.NextButton";const K=({children:e,unstyled:t=!1,index:r,"aria-label":n,className:o,intent:a="basic"})=>{const i=w(),c=s.useRef(null);s.useEffect(()=>{i.pageIndicatorsRefs.current&&(i.pageIndicatorsRefs.current[r]=c.current)});const g=i.getIndicatorProps({index:r});return p.jsx("button",{"data-spark-component":"carousel-page-indicator",ref:c,...g,"aria-label":n,className:k.cx({[k.cx("border-outline group relative flex justify-center border-0 hover:cursor-pointer","m-sm rounded-sm transition-all duration-[200ms] ease-linear","w-sz-8 h-sz-8","data-[state=active]:w-sz-32 data-[state=active]:h-sz-8","data-[state=edge]:w-sz-4 data-[state=edge]:h-sz-4","data-[state=hidden]:m-0 data-[state=hidden]:size-0",a==="surface"?"data-[state=active]:bg-surface bg-surface/dim-2":"data-[state=active]:bg-basic bg-on-surface/dim-2")]:!t},o),children:e},r)};K.displayName="Carousel.PageIndicator";const X=({children:e,className:t})=>{const r=w();return p.jsx(p.Fragment,{children:p.jsx("div",{"data-spark-component":"carousel-page-picker",...r.getIndicatorGroupProps(),className:k.cx("flex-wrap items-center justify-center","default:min-h-sz-16 flex",r.pagePickerInset&&"bottom-sz-12 absolute inset-x-0",t),children:r.pageSnapPoints.length<=1?null:e({...r,pages:Array.from({length:r.pageSnapPoints.length},(n,o)=>o)})})})};X.displayName="Carousel.PagePicker";const H=({"aria-label":e,...t})=>{const r=w();return p.jsx($.IconButton,{"data-spark-component":"carousel-prev-button",...r.getPrevTriggerProps(),intent:"surface",design:"filled",className:"pointer-events-auto cursor-pointer shadow-sm disabled:invisible","aria-label":e,...t,children:p.jsx(O.Icon,{children:p.jsx(oe.ArrowVerticalLeft,{})})})};H.displayName="Carousel.PrevButton";function be(e,t){const[r,n]=s.useState(!0),o=w();return s.useEffect(()=>{const a=e.current;if(!a)return;const{registerSlide:i,unregisterSlide:c}=o;return i(a,n),()=>{c(a)}},[e]),r}const Q=({children:e,index:t=0,totalSlides:r,className:n="",...o})=>{const a=s.useRef(null),i=w(),c=be(a,i.ref);return p.jsx("div",{"data-spark-component":"carousel-slide",ref:a,...i.getSlideProps({index:t,totalSlides:r}),className:k.cx("default:bg-surface relative overflow-hidden",n),"aria-hidden":!c,inert:!c,...o,children:e})};Q.displayName="Carousel.Slide";const U=({children:e,className:t=""})=>{const r=w(),n=s.Children.toArray(e);return p.jsx("div",{"data-spark-component":"carousel-slides",...r.getSlidesContainerProps(),className:k.cx("focus-visible:u-outline relative w-full","[-ms-overflow-style:none] [scrollbar-width:none] [&::-webkit-scrollbar]:hidden",t),children:n.map((o,a)=>s.isValidElement(o)?s.cloneElement(o,{index:a,totalSlides:n.length}):o)})};U.displayName="Carousel.Slides";const Y=({children:e})=>p.jsx("div",{className:"relative flex items-center justify-around p-0",children:e});Y.displayName="Carousel.Viewport";const Z=Object.assign(G,{Controls:J,NextButton:W,PrevButton:H,Slide:Q,Slides:U,Viewport:Y,PagePicker:X,PageIndicator:K});Z.displayName="Carousel";exports.Carousel=Z;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const p=require("react/jsx-runtime"),k=require("class-variance-authority"),s=require("react"),se=require("@spark-ui/icons/ArrowVerticalRight"),O=require("../Icon-C-cNTnzd.js"),$=require("../IconButton-BR1bJSQA.js"),oe=require("@spark-ui/icons/ArrowVerticalLeft");function ae(e){const t=s.useRef(new Map),r=s.useRef(null),n=s.useRef(new Map),o=s.useCallback(()=>u=>{u.forEach(d=>{const b=d.isIntersecting,S=d.target;t.current.set(S,b);const h=n.current.get(S);h&&h(b)})},[]),a=s.useCallback(()=>{if(r.current)return r.current;const u=e.current;if(!u)return null;const d=new IntersectionObserver(o(),{root:u,threshold:.2});return r.current=d,d},[e,o]);s.useEffect(()=>{const u=a(),d=t.current,b=n.current;return()=>{u&&(u.disconnect(),d.clear(),b.clear(),r.current=null)}},[a]);const i=s.useCallback((u,d)=>{if(!u)return;const b=a();if(!b){setTimeout(()=>i(u,d),0);return}const S=t.current.get(u)??!0;t.current.set(u,S),n.current.set(u,d),b.observe(u),d(S)},[a]),c=s.useCallback(u=>{if(!u)return;const d=r.current;d&&d.unobserve(u),t.current.delete(u),n.current.delete(u)},[]),g=s.useCallback(u=>u?t.current.get(u)??!0:!0,[]);return{registerSlide:i,unregisterSlide:c,isSlideVisible:g}}function ie(e){const t=s.useRef(()=>{throw new Error("Cannot call an event handler while rendering.")});return s.useLayoutEffect(()=>{t.current=e}),s.useCallback((...r)=>t.current?.(...r),[])}const ce=()=>{const e=s.useRef(!1);return s.useEffect(()=>(e.current=!0,()=>{e.current=!1}),[]),e};function ue(e,t){const r=s.useRef(0),n=s.useRef(null);s.useEffect(()=>{const o=e.current;if(!o)return;const a="onscrollend"in window,i=()=>{t()},c=()=>{n.current&&clearTimeout(n.current),e.current&&(r.current=e.current.scrollLeft,n.current=setTimeout(()=>{e.current&&i()},150))};return a?o.addEventListener("scrollend",i):o.addEventListener("scroll",c),()=>{n.current&&clearTimeout(n.current),a?o.removeEventListener("scrollend",i):o.removeEventListener("scroll",c)}},[t,e])}function le(e,t){s.useLayoutEffect(()=>{const r=e.current;if(!r)return;const n=new ResizeObserver(o=>{for(const a of o)t(a.contentRect.width)});return n.observe(r),()=>n.disconnect()},[e,t])}function de({totalSlides:e,slidesPerMove:t,slidesPerPage:r}){const n=t==="auto"?r:t,o=[],a=Math.floor((e-r)/n)*n;for(let i=0;i<=a;i+=n)o.push(i);return o[o.length-1]!==e-r&&o.push(e-r),o}function q(e){return e?Array.from(e.querySelectorAll('[data-part="item"]')):[]}function _(e,{container:t,slidesPerMove:r,slidesPerPage:n}){return de({totalSlides:q(t).length,slidesPerPage:n,slidesPerMove:r}).includes(e)}function B({container:e,slidesPerMove:t,slidesPerPage:r}){return e?q(e).filter((n,o)=>_(o,{slidesPerMove:t,slidesPerPage:r,container:e})).map(n=>n.offsetLeft):[]}function fe({dotIndex:e,pageState:t,totalPages:r,maxDots:n=5}){if(r<=n)return e===t?"active":"idle";if(t<=Math.floor(n/2))return e>n-1?"hidden":e===t?"active":e===n-1?"edge":"idle";if(t>=r-Math.ceil(n/2)){const i=r-n;return e<i?"hidden":e===t?"active":e===i?"edge":"idle"}const o=t-Math.floor(n/2),a=t+Math.floor(n/2);return e<o||e>a?"hidden":e===t?"active":e===o||e===a?"edge":"idle"}function pe(e=[],{carouselRef:t,slidesPerMove:r,slidesPerPage:n}){const[o,a]=s.useState(e),i=s.useMemo(()=>o,[o]);return le(t,()=>{const c=B({slidesPerMove:r,slidesPerPage:n,container:t.current});JSON.stringify(o)!==JSON.stringify(c)&&a(c)}),[i,a]}const x="carousel",N="ltr",ge=({defaultPage:e,gap:t=16,snapType:r="mandatory",snapStop:n="always",scrollPadding:o=0,slidesPerPage:a=1,slidesPerMove:i="auto",scrollBehavior:c="smooth",loop:g=!1,pagePickerInset:u=!1,maxDots:d=5,page:b,onPageChange:S})=>{const h=s.useId(),[f,I]=s.useState(e||b||0),C=s.useRef(null),M=s.useRef([]),T=ce().current,L=ie(S),{registerSlide:D,unregisterSlide:ee,isSlideVisible:te}=ae(C),[m]=pe([],{carouselRef:C,slidesPerMove:i,slidesPerPage:a}),P=s.useRef(g||f>0),R=s.useRef(g||f<m.length-1);P.current=g||f>0,R.current=g||f<m.length-1;const j=s.useCallback(l=>{l!==f&&(I(l),L?.(l))},[L,f]),y=s.useCallback((l,v)=>{C.current&&(C.current.scrollTo({left:m[l],behavior:v==="instant"?"auto":"smooth"}),j(l))},[j,m]),z=s.useCallback(l=>{if(P){const v=g&&f===0?m.length-1:Math.max(f-1,0);y(v,c),l?.(v)}},[g,m,f,c,y]),A=s.useCallback(l=>{if(R){const v=g&&f===m.length-1?0:Math.min(f+1,m.length-1);y(v,c),l?.(v)}},[g,m,f,c,y]);s.useEffect(()=>{b!=null&&y(b,c)},[b,c,y]),s.useLayoutEffect(()=>{if(e!=null&&!T&&C.current){const l=B({container:C.current,slidesPerMove:i,slidesPerPage:a});C.current.scrollTo({left:l[e],behavior:"instant"})}},[e,T,i,a]);const re=s.useCallback(()=>{if(!C.current||m.length===0)return;const{scrollLeft:l}=C.current,v=m.map(V=>Math.abs(l-V)),E=v.indexOf(Math.min(...v));E!==-1&&j(E)},[m,j]);return ue(C,re),{ref:C,pageIndicatorsRefs:M,gap:t,snapType:r,snapStop:n,scrollPadding:o,slidesPerPage:a,slidesPerMove:i,scrollBehavior:c,loop:g,pagePickerInset:u,maxDots:d,page:f,pageSnapPoints:m,canScrollNext:R.current,canScrollPrev:P.current,scrollTo:y,scrollPrev:z,scrollNext:A,registerSlide:D,unregisterSlide:ee,isSlideVisible:te,getRootProps:()=>({id:`carousel::${h}:`,role:"region","aria-roledescription":"carousel","data-scope":x,"data-part":"root","data-orientation":"horizontal",dir:N,style:{"--slides-per-page":a,"--slide-spacing":`${t}px`,"--slide-item-size":"calc(100% / var(--slides-per-page) - var(--slide-spacing) * (var(--slides-per-page) - 1) / var(--slides-per-page))"}}),getControlProps:()=>({"data-scope":x,"data-part":"control","data-orientation":"horizontal"}),getPrevTriggerProps:()=>({id:`carousel::${h}::prev-trigger`,"aria-controls":`carousel::${h}::item-group`,"data-scope":x,"data-part":"prev-trigger","data-orientation":"horizontal",type:"button",dir:N,disabled:!P.current,onClick:()=>z()}),getNextTriggerProps:()=>({id:`carousel::${h}::next-trigger`,"aria-controls":`carousel::${h}::item-group`,"data-scope":x,"data-part":"next-trigger","data-orientation":"horizontal",type:"button",dir:N,disabled:!R.current,onClick:()=>A()}),getSlidesContainerProps:()=>({id:`carousel::${h}::item-group`,"aria-live":a>1?"off":"polite","data-scope":x,"data-part":"item-group","data-orientation":"horizontal",dir:N,tabIndex:0,style:{display:"grid",gap:"var(--slide-spacing)",scrollSnapType:`x ${r}`,gridAutoFlow:"column",scrollbarWidth:"none",gridAutoColumns:"var(--slide-item-size)",overflowX:"auto"},ref:C}),getSlideProps:({index:l})=>{const v=_(l,{container:C.current,slidesPerMove:i,slidesPerPage:a});return{id:`carousel::${h}::item:${l}`,role:"group","aria-roledescription":"slide","data-scope":x,"data-part":"item","data-index":l,"data-orientation":"horizontal",dir:N,style:{...v&&{scrollSnapAlign:"start",scrollSnapStop:n}}}},getIndicatorGroupProps:()=>({role:"radiogroup",id:`carousel::${h}::indicator-group`,"data-scope":x,"data-part":"indicator-group","data-orientation":"horizontal",dir:N}),getIndicatorProps:({index:l})=>{const v=fe({dotIndex:l,pageState:f,totalPages:m.length,maxDots:d});return{role:"radio",id:`carousel::${h}::indicator:${l}`,"aria-checked":l===f,"data-scope":x,"data-part":"indicator","data-orientation":"horizontal","data-index":l,"data-state":v,tabIndex:l===f?0:-1,onClick:()=>{y(l,c)},onKeyDown:E=>{const V=ne=>{M.current[ne]?.focus()};E.key==="ArrowRight"&&R?A(V):E.key==="ArrowLeft"&&P&&z(V)}}}}},F=s.createContext(null),G=({className:e,snapType:t="mandatory",snapStop:r="always",scrollBehavior:n="smooth",slidesPerMove:o="auto",pagePickerInset:a=!1,slidesPerPage:i=1,loop:c=!1,children:g,gap:u=16,defaultPage:d,page:b,onPageChange:S,maxDots:h=5,...f})=>{const I=ge({defaultPage:d,slidesPerPage:i,slidesPerMove:o,loop:c,gap:u,scrollBehavior:n,snapStop:r,snapType:t,page:b,pagePickerInset:a,onPageChange:S,maxDots:h});return p.jsx(F.Provider,{value:{...I,scrollBehavior:n},children:p.jsx("div",{"data-spark-component":"carousel",className:k.cx("gap-lg relative box-border flex flex-col",e),...I.getRootProps(),...f,children:g})})};G.displayName="Carousel";const w=()=>{const e=s.useContext(F);if(!e)throw Error("useCarouselContext must be used within a Carousel provider");return e},J=({children:e,className:t,...r})=>{const n=w();return p.jsx("div",{"data-spark-component":"carousel-controls",className:k.cx("default:px-lg pointer-events-none absolute inset-0 flex flex-row items-center justify-between",t),...n.getControlProps(),...r,children:e})};J.displayName="Carousel.Controls";const W=({"aria-label":e,...t})=>{const r=w();return p.jsx($.IconButton,{"data-spark-component":"carousel-next-button",...r.getNextTriggerProps(),intent:"surface",design:"filled",className:"pointer-events-auto cursor-pointer shadow-sm disabled:invisible","aria-label":e,...t,children:p.jsx(O.Icon,{children:p.jsx(se.ArrowVerticalRight,{})})})};W.displayName="Carousel.NextButton";const K=({children:e,unstyled:t=!1,index:r,"aria-label":n,className:o,intent:a="support"})=>{const i=w(),c=s.useRef(null);s.useEffect(()=>{i.pageIndicatorsRefs.current&&(i.pageIndicatorsRefs.current[r]=c.current)});const g=i.getIndicatorProps({index:r});return p.jsx("button",{"data-spark-component":"carousel-page-indicator",ref:c,...g,"aria-label":n,className:k.cx({[k.cx("border-outline group relative flex justify-center border-0 hover:cursor-pointer","m-sm rounded-sm transition-all duration-[200ms] ease-linear","w-sz-8 h-sz-8","data-[state=active]:w-sz-32 data-[state=active]:h-sz-8","data-[state=edge]:w-sz-4 data-[state=edge]:h-sz-4","data-[state=hidden]:m-0 data-[state=hidden]:size-0",a==="surface"?"data-[state=active]:bg-surface bg-surface/dim-2":"data-[state=active]:bg-support bg-on-surface/dim-2")]:!t},o),children:e},r)};K.displayName="Carousel.PageIndicator";const X=({children:e,className:t})=>{const r=w();return p.jsx(p.Fragment,{children:p.jsx("div",{"data-spark-component":"carousel-page-picker",...r.getIndicatorGroupProps(),className:k.cx("flex-wrap items-center justify-center","default:min-h-sz-16 flex",r.pagePickerInset&&"bottom-sz-12 absolute inset-x-0",t),children:r.pageSnapPoints.length<=1?null:e({...r,pages:Array.from({length:r.pageSnapPoints.length},(n,o)=>o)})})})};X.displayName="Carousel.PagePicker";const H=({"aria-label":e,...t})=>{const r=w();return p.jsx($.IconButton,{"data-spark-component":"carousel-prev-button",...r.getPrevTriggerProps(),intent:"surface",design:"filled",className:"pointer-events-auto cursor-pointer shadow-sm disabled:invisible","aria-label":e,...t,children:p.jsx(O.Icon,{children:p.jsx(oe.ArrowVerticalLeft,{})})})};H.displayName="Carousel.PrevButton";function be(e,t){const[r,n]=s.useState(!0),o=w();return s.useEffect(()=>{const a=e.current;if(!a)return;const{registerSlide:i,unregisterSlide:c}=o;return i(a,n),()=>{c(a)}},[e]),r}const Q=({children:e,index:t=0,totalSlides:r,className:n="",...o})=>{const a=s.useRef(null),i=w(),c=be(a,i.ref);return p.jsx("div",{"data-spark-component":"carousel-slide",ref:a,...i.getSlideProps({index:t,totalSlides:r}),className:k.cx("default:bg-surface relative overflow-hidden",n),"aria-hidden":!c,inert:!c,...o,children:e})};Q.displayName="Carousel.Slide";const U=({children:e,className:t=""})=>{const r=w(),n=s.Children.toArray(e);return p.jsx("div",{"data-spark-component":"carousel-slides",...r.getSlidesContainerProps(),className:k.cx("focus-visible:u-outline relative w-full","[-ms-overflow-style:none] [scrollbar-width:none] [&::-webkit-scrollbar]:hidden",t),children:n.map((o,a)=>s.isValidElement(o)?s.cloneElement(o,{index:a,totalSlides:n.length}):o)})};U.displayName="Carousel.Slides";const Y=({children:e})=>p.jsx("div",{className:"relative flex items-center justify-around p-0",children:e});Y.displayName="Carousel.Viewport";const Z=Object.assign(G,{Controls:J,NextButton:W,PrevButton:H,Slide:Q,Slides:U,Viewport:Y,PagePicker:X,PageIndicator:K});Z.displayName="Carousel";exports.Carousel=Z;
 //# sourceMappingURL=index.js.map