@spark-ui/components 16.2.3 → 17.0.0

package/dist/tabs/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../../src/tabs/TabsContext.tsx","../../src/tabs/TabsRoot.styles.ts","../../src/tabs/Tabs.tsx","../../src/tabs/TabsContent.styles.ts","../../src/tabs/TabsContent.tsx","../../src/tabs/TabsList.styles.ts","../../src/tabs/useResizeObserver.ts","../../src/tabs/TabsList.tsx","../../src/tabs/TabsPopoverAbstraction.tsx","../../src/tabs/TabsTrigger.styles.ts","../../src/tabs/TabsTrigger.tsx","../../src/tabs/index.ts"],"sourcesContent":["import { Tabs as RadixTabs } from 'radix-ui'\nimport { createContext, useContext } from 'react'\n\nimport type { TabsTriggerVariantsProps } from './TabsTrigger.styles'\n\nexport type TabsContextInterface = TabsTriggerVariantsProps &\n  Pick<RadixTabs.TabsProps, 'orientation'> & {\n    forceMount?: boolean\n  }\n\nexport const TabsContext = createContext<TabsContextInterface>({} as TabsContextInterface)\n\nexport const useTabsContext = () => {\n  const context = useContext(TabsContext)\n\n  if (!context) {\n    throw Error('useTabsContext must be used within a TabsContext Provider')\n  }\n\n  return context\n}\n","import { cva } from 'class-variance-authority'\n\nexport const rootStyles = cva([\n  'flex',\n  'data-[orientation=horizontal]:flex-col',\n  'data-[orientation=vertical]:flex-row',\n  'max-w-full',\n])\n","import { Tabs as RadixTabs } from 'radix-ui'\nimport { type PropsWithChildren, Ref } from 'react'\n\nimport { TabsContext } from './TabsContext'\nimport { rootStyles } from './TabsRoot.styles'\nimport type { TabsTriggerVariantsProps } from './TabsTrigger.styles'\n\nexport interface TabsProps\n  extends Omit<RadixTabs.TabsProps, 'activationMode'>,\n    PropsWithChildren<Omit<TabsTriggerVariantsProps, 'orientation'>> {\n  /**\n   * Change the component to the HTML tag or custom component of the only child. This will merge the original component props with the props of the supplied element/component and change the underlying DOM node.\n   * @default false\n   */\n  asChild?: boolean\n  /**\n   * Whether to keep inactive tabs content in the DOM.\n   * @default false\n   */\n  forceMount?: boolean\n  ref?: Ref<HTMLDivElement>\n}\n\n/**\n * @deprecated\n */\nexport type TabsRootProps = TabsProps\n\nexport const Tabs = ({\n  intent = 'basic',\n  size = 'md',\n  /**\n   * Default Radix Primitive values\n   * see https://www.radix-ui.com/docs/primitives/components/tabs#root\n   */\n  asChild = false,\n  forceMount = false,\n  orientation = 'horizontal',\n  children,\n  className,\n  ref,\n  ...rest\n}: TabsProps) => {\n  return (\n    <TabsContext.Provider\n      value={{\n        intent,\n        size,\n        orientation,\n        forceMount,\n      }}\n    >\n      <RadixTabs.Root\n        ref={ref}\n        asChild={asChild}\n        orientation={orientation}\n        className={rootStyles({ className })}\n        data-spark-component=\"tabs\"\n        activationMode=\"automatic\"\n        {...rest}\n      >\n        {children}\n      </RadixTabs.Root>\n    </TabsContext.Provider>\n  )\n}\n\nTabs.displayName = 'Tabs'\n","import { cva } from 'class-variance-authority'\n\nexport const contentStyles = cva(['w-full p-lg', 'focus-visible:u-outline-inset'], {\n  variants: {\n    forceMount: {\n      true: 'data-[state=inactive]:hidden',\n      false: '',\n    },\n  },\n})\n","import { Tabs as RadixTabs } from 'radix-ui'\nimport { type PropsWithChildren, Ref } from 'react'\n\nimport { contentStyles } from './TabsContent.styles'\nimport { useTabsContext } from './TabsContext'\n\nexport interface TabsContentProps\n  extends PropsWithChildren<Omit<RadixTabs.TabsContentProps, 'forceMount'>> {\n  /**\n   * A unique value that associates the content with a trigger.\n   */\n  value: string\n  /**\n   * Change the component to the HTML tag or custom component of the only child. This will merge the original component props with the props of the supplied element/component and change the underlying DOM node.\n   * @default false\n   */\n  asChild?: boolean\n  /**\n   * Used to force mounting when more control is needed. Useful when controlling animation with React animation libraries.\n   */\n  forceMount?: true\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const TabsContent = ({\n  /**\n   * Default Radix Primitive values\n   * see https://www.radix-ui.com/docs/primitives/components/tabs#content\n   */\n  children,\n  asChild = false,\n  className,\n  ref,\n  ...rest\n}: TabsContentProps) => {\n  const { forceMount } = useTabsContext()\n\n  return (\n    <RadixTabs.Content\n      data-spark-component=\"tabs-content\"\n      ref={ref}\n      forceMount={forceMount || rest.forceMount}\n      className={contentStyles({ className, forceMount })}\n      asChild={asChild}\n      {...rest}\n    >\n      {children}\n    </RadixTabs.Content>\n  )\n}\n\nTabsContent.displayName = 'Tabs.Content'\n","import { cva } from 'class-variance-authority'\n\nexport const wrapperStyles = cva(['relative flex'])\n\nexport const listStyles = cva([\n  'flex w-full',\n  'data-[orientation=horizontal]:flex-row',\n  'data-[orientation=vertical]:flex-col',\n  'overflow-y-hidden u-no-scrollbar data-[orientation=vertical]:overflow-x-hidden',\n  'after:flex after:shrink after:grow after:border-outline',\n  'data-[orientation=horizontal]:after:border-b-sm',\n  'data-[orientation=vertical]:after:border-r-sm',\n])\n\nexport const navigationArrowStyles = cva([\n  'h-auto! flex-none',\n  'border-b-sm border-outline',\n  'outline-hidden',\n  'focus-visible:border-none focus-visible:bg-surface-hovered focus-visible:u-outline-inset!',\n])\n","import { type RefObject, useEffect, useRef, useState } from 'react'\n\ninterface Size {\n  width?: number\n  height?: number\n}\n\ntype ResizeCallback = (entry?: ResizeObserverEntry) => void\n\nexport const useResizeObserver = <T extends HTMLElement>(\n  target: RefObject<T | null> | T | null,\n  onResize?: ResizeCallback\n): Size => {\n  const [size, setSize] = useState<Size>({ width: undefined, height: undefined })\n  const resizeObserverRef = useRef<ResizeObserver>(null)\n  const resizeCallbackRef = useRef<ResizeCallback | undefined>(onResize)\n\n  useEffect(() => {\n    resizeCallbackRef.current = onResize\n  }, [onResize])\n\n  useEffect(() => {\n    const targetElm = target && 'current' in target ? target.current : target\n    if (!targetElm || resizeObserverRef.current) {\n      return\n    }\n\n    resizeObserverRef.current = new ResizeObserver(([entry]) => {\n      const { inlineSize: width, blockSize: height } = entry?.borderBoxSize?.[0] ?? {}\n      resizeCallbackRef.current?.(entry)\n\n      setSize({ width, height })\n    })\n\n    resizeObserverRef.current.observe(targetElm as unknown as HTMLElement)\n\n    return () => {\n      resizeObserverRef.current &&\n        resizeObserverRef.current.unobserve(targetElm as unknown as HTMLElement)\n    }\n  }, [target, resizeObserverRef, resizeCallbackRef])\n\n  return size\n}\n","/* eslint-disable max-lines-per-function */\nimport { ArrowVerticalLeft } from '@spark-ui/icons/ArrowVerticalLeft'\nimport { ArrowVerticalRight } from '@spark-ui/icons/ArrowVerticalRight'\nimport { Tabs as RadixTabs } from 'radix-ui'\nimport { type ReactElement, Ref, useEffect, useRef, useState } from 'react'\n\nimport { Button } from '../button'\nimport { Icon } from '../icon'\nimport { useTabsContext } from './TabsContext'\nimport { listStyles, navigationArrowStyles, wrapperStyles } from './TabsList.styles'\nimport { useResizeObserver } from './useResizeObserver'\n\nexport interface TabsListProps extends Omit<RadixTabs.TabsListProps, 'children'> {\n  /**\n   * Change the component to the HTML tag or custom component of the only child. This will merge the original component props with the props of the supplied element/component and change the underlying DOM node.\n   * @default false\n   */\n  asChild?: boolean\n  /**\n   * When true, keyboard navigation will loop from last tab to first, and vice versa.\n   * @default false\n   */\n  loop?: boolean\n  children: ReactElement[] | ReactElement\n  ref?: Ref<HTMLDivElement>\n}\n\ntype ArrowState = 'visible' | 'hidden' | 'disabled'\n\nexport const TabsList = ({\n  /**\n   * Default Radix Primitive values\n   * see https://www.radix-ui.com/docs/primitives/components/tabs#list\n   */\n  asChild = false,\n  loop = false,\n  children,\n  className,\n  ref,\n  ...rest\n}: TabsListProps) => {\n  const wrapperRef = useRef<HTMLDivElement>(null)\n  const innerRef = useRef(null)\n  const listRef = ref || innerRef\n  const { orientation } = useTabsContext()\n\n  const { width } = useResizeObserver(wrapperRef)\n\n  const [arrows, setArrows] = useState<Record<'prev' | 'next', ArrowState>>({\n    prev: 'hidden',\n    next: 'hidden',\n  })\n\n  useEffect(() => {\n    /**\n     * Show/hide arrows\n     */\n    if (typeof listRef === 'function' || !listRef.current) {\n      return\n    }\n\n    if (orientation !== 'horizontal') {\n      setArrows({ prev: 'hidden', next: 'hidden' })\n    } else {\n      setArrows({\n        prev: listRef.current.scrollWidth > listRef.current.clientWidth ? 'visible' : 'hidden',\n        next: listRef.current.scrollWidth > listRef.current.clientWidth ? 'visible' : 'hidden',\n      })\n    }\n  }, [orientation, listRef, width])\n\n  useEffect(() => {\n    /**\n     * Enable/disable arrows\n     */\n    if (typeof listRef === 'function' || !listRef.current || arrows.prev === 'hidden' || loop) {\n      return\n    }\n\n    const toggleArrowsVisibility = (target: HTMLDivElement) => {\n      setArrows({\n        prev: target.scrollLeft > 0 ? 'visible' : 'disabled',\n        next: target.scrollLeft + target.clientWidth < target.scrollWidth ? 'visible' : 'disabled',\n      })\n    }\n\n    const currentList = listRef.current\n\n    toggleArrowsVisibility(currentList)\n\n    currentList.addEventListener('scroll', ({ target }) =>\n      toggleArrowsVisibility(target as HTMLDivElement)\n    )\n\n    return () =>\n      currentList.removeEventListener('scroll', ({ target }) =>\n        toggleArrowsVisibility(target as HTMLDivElement)\n      )\n  }, [listRef, arrows.prev, loop])\n\n  const handlePrevClick = () => {\n    if (typeof listRef === 'function' || !listRef.current) {\n      return\n    }\n\n    const shouldLoopForward = loop && listRef.current.scrollLeft <= 0\n\n    listRef.current.scrollTo({\n      left: shouldLoopForward\n        ? listRef.current.scrollLeft + listRef.current.scrollWidth - listRef.current.clientWidth\n        : listRef.current.scrollLeft - listRef.current.clientWidth,\n      behavior: 'smooth',\n    })\n  }\n\n  const handleNextClick = () => {\n    if (typeof listRef === 'function' || !listRef.current) {\n      return\n    }\n\n    const shouldLoopBackward =\n      loop &&\n      listRef.current.scrollLeft + listRef.current.clientWidth >= listRef.current.scrollWidth\n\n    listRef.current.scrollTo({\n      left: shouldLoopBackward ? 0 : listRef.current.scrollLeft + listRef.current.clientWidth,\n      behavior: 'smooth',\n    })\n  }\n\n  return (\n    <div className={wrapperStyles({ className })} ref={wrapperRef}>\n      {arrows.prev !== 'hidden' && (\n        <Button\n          shape=\"square\"\n          intent=\"surface\"\n          size=\"sm\"\n          className={navigationArrowStyles()}\n          onClick={handlePrevClick}\n          disabled={arrows.prev === 'disabled'}\n          aria-label=\"Scroll left\"\n        >\n          <Icon>\n            <ArrowVerticalLeft />\n          </Icon>\n        </Button>\n      )}\n\n      <RadixTabs.List\n        data-spark-component=\"tabs-list\"\n        ref={listRef}\n        className={listStyles()}\n        asChild={asChild}\n        loop={loop}\n        {...rest}\n      >\n        {children}\n      </RadixTabs.List>\n\n      {arrows.next !== 'hidden' && (\n        <Button\n          shape=\"square\"\n          intent=\"surface\"\n          size=\"sm\"\n          className={navigationArrowStyles()}\n          onClick={handleNextClick}\n          disabled={arrows.next === 'disabled'}\n          aria-label=\"Scroll right\"\n        >\n          <Icon>\n            <ArrowVerticalRight />\n          </Icon>\n        </Button>\n      )}\n    </div>\n  )\n}\n\nTabsList.displayName = 'Tabs.List'\n","import { useMergeRefs } from '@spark-ui/hooks/use-merge-refs'\nimport { MoreMenuHorizontal } from '@spark-ui/icons/MoreMenuHorizontal'\nimport { cx } from 'class-variance-authority'\nimport {\n  type ComponentType,\n  createContext,\n  forwardRef,\n  type ReactNode,\n  type RefObject,\n  useContext,\n  useMemo,\n} from 'react'\n\nimport { Icon } from '../icon'\nimport { IconButton } from '../icon-button'\nimport { Popover as SparkPopover } from '../popover'\nimport type { PopoverProps } from '../popover/Popover'\nimport type { ContentProps as PopoverContentProps } from '../popover/PopoverContent'\nimport type { TriggerProps as PopoverTriggerProps } from '../popover/PopoverTrigger'\n\ninterface TabsPopoverContextValue {\n  popoverSide: 'right' | 'bottom'\n  popoverTriggerRef: RefObject<HTMLButtonElement | null>\n}\n\nconst TabsPopoverContext = createContext<TabsPopoverContextValue | undefined>(undefined)\n\nconst useTabsPopoverContext = () => {\n  const context = useContext(TabsPopoverContext)\n  if (!context) {\n    throw new Error('TabsPopover components must be used within TabsPopover')\n  }\n\n  return context\n}\n\n// Trigger component that uses context\ninterface TabsPopoverTriggerProps extends Omit<PopoverTriggerProps, 'asChild' | 'children'> {\n  'aria-label': string\n  children?: ReactNode\n}\n\nconst TabsPopoverTrigger = forwardRef<HTMLButtonElement, TabsPopoverTriggerProps>(\n  ({ 'aria-label': ariaLabel, children: iconChildren, ...triggerProps }, forwardedRef) => {\n    const { popoverTriggerRef } = useTabsPopoverContext()\n    const mergedRef = useMergeRefs(forwardedRef, popoverTriggerRef)\n\n    return (\n      <SparkPopover.Trigger asChild {...triggerProps}>\n        <IconButton\n          ref={mergedRef}\n          size=\"sm\"\n          intent=\"surfaceInverse\"\n          design=\"ghost\"\n          aria-label={ariaLabel}\n          tabIndex={-1}\n        >\n          <Icon>{iconChildren || <MoreMenuHorizontal />}</Icon>\n        </IconButton>\n      </SparkPopover.Trigger>\n    )\n  }\n)\n\nTabsPopoverTrigger.displayName = 'Popover.Trigger'\n\n// Content component that uses context\nconst TabsPopoverContent = forwardRef<HTMLDivElement, PopoverContentProps>(\n  ({ side, align = 'start', className, ...contentProps }, ref) => {\n    const { popoverSide } = useTabsPopoverContext()\n    const mergedClassName = cx('gap-sm flex flex-col', className)\n\n    return (\n      <SparkPopover.Content\n        ref={ref}\n        {...contentProps}\n        side={side ?? popoverSide}\n        align={align}\n        className={mergedClassName}\n      />\n    )\n  }\n)\n\nTabsPopoverContent.displayName = 'Popover.Content'\n\n// Export types\nexport type TabsPopoverTriggerComponent = typeof TabsPopoverTrigger\nexport type TabsPopoverContentComponent = typeof TabsPopoverContent\n\n// Create a type that extends SparkPopover but overrides Content and Trigger\n// Use ComponentType for JSX compatibility and Omit to exclude only Content and Trigger,\n// then add them back with the overridden types\nexport type ConfiguredPopoverComponent = ComponentType<PopoverProps> &\n  Omit<typeof SparkPopover, 'Content' | 'Trigger'> & {\n    Content: TabsPopoverContentComponent\n    Trigger: TabsPopoverTriggerComponent\n  }\n\ninterface PopoverAbstractionProps {\n  popoverSide: 'right' | 'bottom'\n  popoverTriggerRef: RefObject<HTMLButtonElement | null>\n  children: (Popover: ConfiguredPopoverComponent) => ReactNode\n}\n\nexport const Popover = ({ popoverSide, popoverTriggerRef, children }: PopoverAbstractionProps) => {\n  const contextValue = useMemo(\n    () => ({ popoverSide, popoverTriggerRef }),\n    [popoverSide, popoverTriggerRef]\n  )\n\n  const PopoverWrapper: typeof SparkPopover = ((props: PopoverProps) => (\n    <TabsPopoverContext.Provider value={contextValue}>\n      <SparkPopover {...props}>{props.children}</SparkPopover>\n    </TabsPopoverContext.Provider>\n  )) as typeof SparkPopover\n\n  const PopoverComponent = Object.assign(PopoverWrapper, SparkPopover, {\n    Content: TabsPopoverContent,\n    Trigger: TabsPopoverTrigger,\n  }) as ConfiguredPopoverComponent\n\n  return (\n    <TabsPopoverContext.Provider value={contextValue}>\n      {children(PopoverComponent)}\n    </TabsPopoverContext.Provider>\n  )\n}\n\nPopover.displayName = 'Popover'\n","import { makeVariants } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nexport const triggerVariants = cva(\n  [\n    'px-md',\n    'relative flex flex-none items-center',\n    'border-outline',\n    'hover:not-disabled:bg-surface-hovered',\n    'after:absolute',\n    'data-[state=active]:font-bold',\n    'data-[state=inactive]:not-disabled:cursor-pointer',\n    'data-[orientation=horizontal]:border-b-sm data-[orientation=horizontal]:after:inset-x-0 data-[orientation=horizontal]:after:bottom-[-1px] data-[orientation=horizontal]:after:h-sz-2',\n    'data-[orientation=vertical]:border-r-sm data-[orientation=vertical]:after:inset-y-0 data-[orientation=vertical]:after:right-[-1px] data-[orientation=vertical]:after:w-sz-2',\n    'focus-visible:border-none focus-visible:bg-surface-hovered focus-visible:u-outline-inset',\n    'disabled:cursor-not-allowed disabled:opacity-dim-3',\n    'gap-md [&>*:first-child]:ml-md [&>*:last-child]:mr-md',\n    '[&>svg:last-child:first-child]:mx-auto',\n  ],\n  {\n    variants: {\n      /**\n       * Change the color scheme of the tabs\n       * @default basic\n       */\n      intent: makeVariants<'intent', ['main', 'support', 'basic']>({\n        main: ['data-[state=active]:text-main data-[state=active]:after:bg-main'],\n        support: ['data-[state=active]:text-support data-[state=active]:after:bg-support'],\n        basic: ['data-[state=active]:text-basic data-[state=active]:after:bg-basic'],\n      }),\n      /**\n       * Change the size of the tabs\n       * @default md\n       */\n      size: {\n        xs: ['h-sz-32 min-w-sz-32 text-caption'],\n        sm: ['h-sz-36 min-w-sz-36 text-body-2'],\n        md: ['h-sz-40 min-w-sz-40 text-body-1'],\n      },\n      hasMenu: {\n        true: 'pr-3xl',\n      },\n      orientation: {\n        horizontal: '',\n        vertical: '',\n      },\n    },\n    compoundVariants: [\n      {\n        hasMenu: true,\n        orientation: 'vertical',\n        class: 'w-full',\n      },\n    ],\n    defaultVariants: {\n      intent: 'basic',\n      size: 'md',\n      hasMenu: false,\n      orientation: 'horizontal',\n    },\n  }\n)\n\nexport type TabsTriggerVariantsProps = VariantProps<typeof triggerVariants>\n","import { useMergeRefs } from '@spark-ui/hooks/use-merge-refs'\nimport { Tabs as RadixTabs } from 'radix-ui'\nimport { type FocusEvent, type KeyboardEvent, type ReactNode, Ref, useRef } from 'react'\n\nimport { useTabsContext } from './TabsContext'\nimport { type ConfiguredPopoverComponent, Popover } from './TabsPopoverAbstraction'\nimport { triggerVariants } from './TabsTrigger.styles'\n\nexport interface TabsTriggerProps extends RadixTabs.TabsTriggerProps {\n  /**\n   * A unique value that associates the trigger with a content.\n   */\n  value: string\n  /**\n   * Change the component to the HTML tag or custom component of the only child. This will merge the original component props with the props of the supplied element/component and change the underlying DOM node.\n   * @default false\n   */\n  asChild?: boolean\n  /**\n   * When true, prevents the user from interacting with the tab.\n   * @default false\n   */\n  disabled?: boolean\n  /**\n   * Function that receives a pre-configured Popover component and returns the popover structure.\n   * @example\n   * renderMenu={({ Popover }) => (\n   *   <Popover>\n   *     <Popover.Trigger aria-label=\"Options\">\n   *       <CustomIcon />\n   *     </Popover.Trigger>\n   *     <Popover.Content>\n   *       <Button>Action</Button>\n   *     </Popover.Content>\n   *   </Popover>\n   * )}\n   */\n  renderMenu?: (props: { Popover: ConfiguredPopoverComponent }) => ReactNode\n  ref?: Ref<HTMLButtonElement>\n}\n\nexport const TabsTrigger = ({\n  /**\n   * Default Radix Primitive values\n   * see https://www.radix-ui.com/docs/primitives/components/tabs#trigger\n   */\n  asChild = false,\n  value,\n  disabled = false,\n  children,\n  className,\n  ref,\n  onKeyDown,\n  renderMenu,\n  ...rest\n}: TabsTriggerProps) => {\n  const { intent, size, orientation } = useTabsContext()\n  const popoverTriggerRef = useRef<HTMLButtonElement>(null)\n  const tabsTriggerRef = useRef<HTMLButtonElement>(null)\n\n  // Combine internal ref with forwarded ref\n  const mergedRef = useMergeRefs(ref, tabsTriggerRef)\n\n  const handleKeyDown = (e: KeyboardEvent<HTMLButtonElement>) => {\n    // Handle Shift+F10 for popover\n    if (e.key === 'F10' && e.shiftKey && renderMenu && popoverTriggerRef.current) {\n      e.preventDefault()\n      popoverTriggerRef.current.click()\n    }\n\n    // Call original onKeyDown if provided\n    onKeyDown?.(e)\n  }\n\n  const hasMenu = !!renderMenu\n  const popoverSide = orientation === 'vertical' ? 'right' : 'bottom'\n\n  const trigger = (\n    <RadixTabs.Trigger\n      data-spark-component=\"tabs-trigger\"\n      ref={mergedRef}\n      className={triggerVariants({\n        intent,\n        size,\n        hasMenu,\n        orientation: orientation ?? 'horizontal',\n        className,\n      })}\n      asChild={asChild}\n      disabled={disabled}\n      value={value}\n      onFocus={({ target }: FocusEvent<HTMLButtonElement>) =>\n        target.scrollIntoView({\n          behavior: 'smooth',\n          block: 'nearest',\n          inline: 'nearest',\n        })\n      }\n      onKeyDown={handleKeyDown}\n      aria-haspopup={hasMenu ? 'true' : undefined}\n      {...rest}\n    >\n      {children}\n    </RadixTabs.Trigger>\n  )\n\n  if (!hasMenu) {\n    return trigger\n  }\n\n  return (\n    <div className={orientation === 'vertical' ? 'relative w-full' : 'relative'}>\n      {trigger}\n      <div className=\"right-md mr-md pointer-events-auto absolute top-1/2 -translate-y-1/2\">\n        <Popover popoverSide={popoverSide} popoverTriggerRef={popoverTriggerRef}>\n          {PopoverAbstraction => renderMenu?.({ Popover: PopoverAbstraction })}\n        </Popover>\n      </div>\n    </div>\n  )\n}\n\nTabsTrigger.displayName = 'Tabs.Trigger'\n","import { Tabs as Root } from './Tabs'\nimport { TabsContent as Content } from './TabsContent'\nimport { TabsList as List } from './TabsList'\nimport { TabsTrigger as Trigger } from './TabsTrigger'\n\nexport const Tabs: typeof Root & {\n  List: typeof List\n  Trigger: typeof Trigger\n  Content: typeof Content\n} = Object.assign(Root, {\n  List,\n  Trigger,\n  Content,\n})\n\nTabs.displayName = 'Tabs'\nList.displayName = 'Tabs.List'\nTrigger.displayName = 'Tabs.Trigger'\nContent.displayName = 'Tabs.Content'\n\nexport { type TabsContentProps } from './TabsContent'\nexport { type TabsListProps } from './TabsList'\nexport { type TabsProps, type TabsRootProps } from './Tabs'\nexport { type TabsTriggerProps } from './TabsTrigger'\n"],"names":["TabsContext","createContext","useTabsContext","context","useContext","rootStyles","cva","Tabs","intent","size","asChild","forceMount","orientation","children","className","ref","rest","jsx","RadixTabs","contentStyles","TabsContent","wrapperStyles","listStyles","navigationArrowStyles","useResizeObserver","target","onResize","setSize","useState","resizeObserverRef","useRef","resizeCallbackRef","useEffect","targetElm","entry","width","height","TabsList","loop","wrapperRef","innerRef","listRef","arrows","setArrows","toggleArrowsVisibility","currentList","handlePrevClick","shouldLoopForward","handleNextClick","shouldLoopBackward","jsxs","Button","Icon","ArrowVerticalLeft","ArrowVerticalRight","TabsPopoverContext","useTabsPopoverContext","TabsPopoverTrigger","forwardRef","ariaLabel","iconChildren","triggerProps","forwardedRef","popoverTriggerRef","mergedRef","useMergeRefs","SparkPopover","IconButton","MoreMenuHorizontal","TabsPopoverContent","side","align","contentProps","popoverSide","mergedClassName","cx","Popover","contextValue","useMemo","PopoverComponent","props","triggerVariants","makeVariants","TabsTrigger","value","disabled","onKeyDown","renderMenu","tabsTriggerRef","handleKeyDown","e","hasMenu","trigger","PopoverAbstraction","Root","List","Trigger","Content"],"mappings":"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"}
+{"version":3,"file":"index.mjs","sources":["../../src/tabs/TabsContext.tsx","../../src/tabs/TabsRoot.styles.ts","../../src/tabs/Tabs.tsx","../../src/tabs/TabsContent.styles.ts","../../src/tabs/TabsContent.tsx","../../src/tabs/TabsList.styles.ts","../../src/tabs/useResizeObserver.ts","../../src/tabs/TabsList.tsx","../../src/tabs/TabsPopoverAbstraction.tsx","../../src/tabs/TabsTrigger.styles.ts","../../src/tabs/TabsTrigger.tsx","../../src/tabs/index.ts"],"sourcesContent":["import { Tabs as RadixTabs } from 'radix-ui'\nimport { createContext, useContext } from 'react'\n\nimport type { TabsTriggerVariantsProps } from './TabsTrigger.styles'\n\nexport type TabsContextInterface = TabsTriggerVariantsProps &\n  Pick<RadixTabs.TabsProps, 'orientation'> & {\n    forceMount?: boolean\n  }\n\nexport const TabsContext = createContext<TabsContextInterface>({} as TabsContextInterface)\n\nexport const useTabsContext = () => {\n  const context = useContext(TabsContext)\n\n  if (!context) {\n    throw Error('useTabsContext must be used within a TabsContext Provider')\n  }\n\n  return context\n}\n","import { cva } from 'class-variance-authority'\n\nexport const rootStyles = cva([\n  'flex',\n  'data-[orientation=horizontal]:flex-col',\n  'data-[orientation=vertical]:flex-row',\n  'max-w-full',\n])\n","import { Tabs as RadixTabs } from 'radix-ui'\nimport { type PropsWithChildren, Ref } from 'react'\n\nimport { TabsContext } from './TabsContext'\nimport { rootStyles } from './TabsRoot.styles'\nimport type { TabsTriggerVariantsProps } from './TabsTrigger.styles'\n\nexport interface TabsProps\n  extends Omit<RadixTabs.TabsProps, 'activationMode'>,\n    PropsWithChildren<Omit<TabsTriggerVariantsProps, 'orientation'>> {\n  /**\n   * Change the component to the HTML tag or custom component of the only child. This will merge the original component props with the props of the supplied element/component and change the underlying DOM node.\n   * @default false\n   */\n  asChild?: boolean\n  /**\n   * Whether to keep inactive tabs content in the DOM.\n   * @default false\n   */\n  forceMount?: boolean\n  ref?: Ref<HTMLDivElement>\n}\n\n/**\n * @deprecated\n */\nexport type TabsRootProps = TabsProps\n\nexport const Tabs = ({\n  intent = 'support',\n  size = 'md',\n  /**\n   * Default Radix Primitive values\n   * see https://www.radix-ui.com/docs/primitives/components/tabs#root\n   */\n  asChild = false,\n  forceMount = false,\n  orientation = 'horizontal',\n  children,\n  className,\n  ref,\n  ...rest\n}: TabsProps) => {\n  return (\n    <TabsContext.Provider\n      value={{\n        intent,\n        size,\n        orientation,\n        forceMount,\n      }}\n    >\n      <RadixTabs.Root\n        ref={ref}\n        asChild={asChild}\n        orientation={orientation}\n        className={rootStyles({ className })}\n        data-spark-component=\"tabs\"\n        activationMode=\"automatic\"\n        {...rest}\n      >\n        {children}\n      </RadixTabs.Root>\n    </TabsContext.Provider>\n  )\n}\n\nTabs.displayName = 'Tabs'\n","import { cva } from 'class-variance-authority'\n\nexport const contentStyles = cva(['w-full p-lg', 'focus-visible:u-outline-inset'], {\n  variants: {\n    forceMount: {\n      true: 'data-[state=inactive]:hidden',\n      false: '',\n    },\n  },\n})\n","import { Tabs as RadixTabs } from 'radix-ui'\nimport { type PropsWithChildren, Ref } from 'react'\n\nimport { contentStyles } from './TabsContent.styles'\nimport { useTabsContext } from './TabsContext'\n\nexport interface TabsContentProps\n  extends PropsWithChildren<Omit<RadixTabs.TabsContentProps, 'forceMount'>> {\n  /**\n   * A unique value that associates the content with a trigger.\n   */\n  value: string\n  /**\n   * Change the component to the HTML tag or custom component of the only child. This will merge the original component props with the props of the supplied element/component and change the underlying DOM node.\n   * @default false\n   */\n  asChild?: boolean\n  /**\n   * Used to force mounting when more control is needed. Useful when controlling animation with React animation libraries.\n   */\n  forceMount?: true\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const TabsContent = ({\n  /**\n   * Default Radix Primitive values\n   * see https://www.radix-ui.com/docs/primitives/components/tabs#content\n   */\n  children,\n  asChild = false,\n  className,\n  ref,\n  ...rest\n}: TabsContentProps) => {\n  const { forceMount } = useTabsContext()\n\n  return (\n    <RadixTabs.Content\n      data-spark-component=\"tabs-content\"\n      ref={ref}\n      forceMount={forceMount || rest.forceMount}\n      className={contentStyles({ className, forceMount })}\n      asChild={asChild}\n      {...rest}\n    >\n      {children}\n    </RadixTabs.Content>\n  )\n}\n\nTabsContent.displayName = 'Tabs.Content'\n","import { cva } from 'class-variance-authority'\n\nexport const wrapperStyles = cva(['relative flex'])\n\nexport const listStyles = cva([\n  'flex w-full',\n  'data-[orientation=horizontal]:flex-row',\n  'data-[orientation=vertical]:flex-col',\n  'overflow-y-hidden u-no-scrollbar data-[orientation=vertical]:overflow-x-hidden',\n  'after:flex after:shrink after:grow after:border-outline',\n  'data-[orientation=horizontal]:after:border-b-sm',\n  'data-[orientation=vertical]:after:border-r-sm',\n])\n\nexport const navigationArrowStyles = cva([\n  'h-auto! flex-none',\n  'border-b-sm border-outline',\n  'outline-hidden',\n  'focus-visible:border-none focus-visible:bg-surface-hovered focus-visible:u-outline-inset!',\n])\n","import { type RefObject, useEffect, useRef, useState } from 'react'\n\ninterface Size {\n  width?: number\n  height?: number\n}\n\ntype ResizeCallback = (entry?: ResizeObserverEntry) => void\n\nexport const useResizeObserver = <T extends HTMLElement>(\n  target: RefObject<T | null> | T | null,\n  onResize?: ResizeCallback\n): Size => {\n  const [size, setSize] = useState<Size>({ width: undefined, height: undefined })\n  const resizeObserverRef = useRef<ResizeObserver>(null)\n  const resizeCallbackRef = useRef<ResizeCallback | undefined>(onResize)\n\n  useEffect(() => {\n    resizeCallbackRef.current = onResize\n  }, [onResize])\n\n  useEffect(() => {\n    const targetElm = target && 'current' in target ? target.current : target\n    if (!targetElm || resizeObserverRef.current) {\n      return\n    }\n\n    resizeObserverRef.current = new ResizeObserver(([entry]) => {\n      const { inlineSize: width, blockSize: height } = entry?.borderBoxSize?.[0] ?? {}\n      resizeCallbackRef.current?.(entry)\n\n      setSize({ width, height })\n    })\n\n    resizeObserverRef.current.observe(targetElm as unknown as HTMLElement)\n\n    return () => {\n      resizeObserverRef.current &&\n        resizeObserverRef.current.unobserve(targetElm as unknown as HTMLElement)\n    }\n  }, [target, resizeObserverRef, resizeCallbackRef])\n\n  return size\n}\n","/* eslint-disable max-lines-per-function */\nimport { ArrowVerticalLeft } from '@spark-ui/icons/ArrowVerticalLeft'\nimport { ArrowVerticalRight } from '@spark-ui/icons/ArrowVerticalRight'\nimport { Tabs as RadixTabs } from 'radix-ui'\nimport { type ReactElement, Ref, useEffect, useRef, useState } from 'react'\n\nimport { Button } from '../button'\nimport { Icon } from '../icon'\nimport { useTabsContext } from './TabsContext'\nimport { listStyles, navigationArrowStyles, wrapperStyles } from './TabsList.styles'\nimport { useResizeObserver } from './useResizeObserver'\n\nexport interface TabsListProps extends Omit<RadixTabs.TabsListProps, 'children'> {\n  /**\n   * Change the component to the HTML tag or custom component of the only child. This will merge the original component props with the props of the supplied element/component and change the underlying DOM node.\n   * @default false\n   */\n  asChild?: boolean\n  /**\n   * When true, keyboard navigation will loop from last tab to first, and vice versa.\n   * @default false\n   */\n  loop?: boolean\n  children: ReactElement[] | ReactElement\n  ref?: Ref<HTMLDivElement>\n}\n\ntype ArrowState = 'visible' | 'hidden' | 'disabled'\n\nexport const TabsList = ({\n  /**\n   * Default Radix Primitive values\n   * see https://www.radix-ui.com/docs/primitives/components/tabs#list\n   */\n  asChild = false,\n  loop = false,\n  children,\n  className,\n  ref,\n  ...rest\n}: TabsListProps) => {\n  const wrapperRef = useRef<HTMLDivElement>(null)\n  const innerRef = useRef(null)\n  const listRef = ref || innerRef\n  const { orientation } = useTabsContext()\n\n  const { width } = useResizeObserver(wrapperRef)\n\n  const [arrows, setArrows] = useState<Record<'prev' | 'next', ArrowState>>({\n    prev: 'hidden',\n    next: 'hidden',\n  })\n\n  useEffect(() => {\n    /**\n     * Show/hide arrows\n     */\n    if (typeof listRef === 'function' || !listRef.current) {\n      return\n    }\n\n    if (orientation !== 'horizontal') {\n      setArrows({ prev: 'hidden', next: 'hidden' })\n    } else {\n      setArrows({\n        prev: listRef.current.scrollWidth > listRef.current.clientWidth ? 'visible' : 'hidden',\n        next: listRef.current.scrollWidth > listRef.current.clientWidth ? 'visible' : 'hidden',\n      })\n    }\n  }, [orientation, listRef, width])\n\n  useEffect(() => {\n    /**\n     * Enable/disable arrows\n     */\n    if (typeof listRef === 'function' || !listRef.current || arrows.prev === 'hidden' || loop) {\n      return\n    }\n\n    const toggleArrowsVisibility = (target: HTMLDivElement) => {\n      setArrows({\n        prev: target.scrollLeft > 0 ? 'visible' : 'disabled',\n        next: target.scrollLeft + target.clientWidth < target.scrollWidth ? 'visible' : 'disabled',\n      })\n    }\n\n    const currentList = listRef.current\n\n    toggleArrowsVisibility(currentList)\n\n    currentList.addEventListener('scroll', ({ target }) =>\n      toggleArrowsVisibility(target as HTMLDivElement)\n    )\n\n    return () =>\n      currentList.removeEventListener('scroll', ({ target }) =>\n        toggleArrowsVisibility(target as HTMLDivElement)\n      )\n  }, [listRef, arrows.prev, loop])\n\n  const handlePrevClick = () => {\n    if (typeof listRef === 'function' || !listRef.current) {\n      return\n    }\n\n    const shouldLoopForward = loop && listRef.current.scrollLeft <= 0\n\n    listRef.current.scrollTo({\n      left: shouldLoopForward\n        ? listRef.current.scrollLeft + listRef.current.scrollWidth - listRef.current.clientWidth\n        : listRef.current.scrollLeft - listRef.current.clientWidth,\n      behavior: 'smooth',\n    })\n  }\n\n  const handleNextClick = () => {\n    if (typeof listRef === 'function' || !listRef.current) {\n      return\n    }\n\n    const shouldLoopBackward =\n      loop &&\n      listRef.current.scrollLeft + listRef.current.clientWidth >= listRef.current.scrollWidth\n\n    listRef.current.scrollTo({\n      left: shouldLoopBackward ? 0 : listRef.current.scrollLeft + listRef.current.clientWidth,\n      behavior: 'smooth',\n    })\n  }\n\n  return (\n    <div className={wrapperStyles({ className })} ref={wrapperRef}>\n      {arrows.prev !== 'hidden' && (\n        <Button\n          shape=\"square\"\n          intent=\"surface\"\n          size=\"sm\"\n          className={navigationArrowStyles()}\n          onClick={handlePrevClick}\n          disabled={arrows.prev === 'disabled'}\n          aria-label=\"Scroll left\"\n        >\n          <Icon>\n            <ArrowVerticalLeft />\n          </Icon>\n        </Button>\n      )}\n\n      <RadixTabs.List\n        data-spark-component=\"tabs-list\"\n        ref={listRef}\n        className={listStyles()}\n        asChild={asChild}\n        loop={loop}\n        {...rest}\n      >\n        {children}\n      </RadixTabs.List>\n\n      {arrows.next !== 'hidden' && (\n        <Button\n          shape=\"square\"\n          intent=\"surface\"\n          size=\"sm\"\n          className={navigationArrowStyles()}\n          onClick={handleNextClick}\n          disabled={arrows.next === 'disabled'}\n          aria-label=\"Scroll right\"\n        >\n          <Icon>\n            <ArrowVerticalRight />\n          </Icon>\n        </Button>\n      )}\n    </div>\n  )\n}\n\nTabsList.displayName = 'Tabs.List'\n","import { useMergeRefs } from '@spark-ui/hooks/use-merge-refs'\nimport { MoreMenuHorizontal } from '@spark-ui/icons/MoreMenuHorizontal'\nimport { cx } from 'class-variance-authority'\nimport {\n  type ComponentType,\n  createContext,\n  forwardRef,\n  type ReactNode,\n  type RefObject,\n  useContext,\n  useMemo,\n} from 'react'\n\nimport { Icon } from '../icon'\nimport { IconButton } from '../icon-button'\nimport { Popover as SparkPopover } from '../popover'\nimport type { PopoverProps } from '../popover/Popover'\nimport type { ContentProps as PopoverContentProps } from '../popover/PopoverContent'\nimport type { TriggerProps as PopoverTriggerProps } from '../popover/PopoverTrigger'\n\ninterface TabsPopoverContextValue {\n  popoverSide: 'right' | 'bottom'\n  popoverTriggerRef: RefObject<HTMLButtonElement | null>\n}\n\nconst TabsPopoverContext = createContext<TabsPopoverContextValue | undefined>(undefined)\n\nconst useTabsPopoverContext = () => {\n  const context = useContext(TabsPopoverContext)\n  if (!context) {\n    throw new Error('TabsPopover components must be used within TabsPopover')\n  }\n\n  return context\n}\n\n// Trigger component that uses context\ninterface TabsPopoverTriggerProps extends Omit<PopoverTriggerProps, 'asChild' | 'children'> {\n  'aria-label': string\n  children?: ReactNode\n}\n\nconst TabsPopoverTrigger = forwardRef<HTMLButtonElement, TabsPopoverTriggerProps>(\n  ({ 'aria-label': ariaLabel, children: iconChildren, ...triggerProps }, forwardedRef) => {\n    const { popoverTriggerRef } = useTabsPopoverContext()\n    const mergedRef = useMergeRefs(forwardedRef, popoverTriggerRef)\n\n    return (\n      <SparkPopover.Trigger asChild {...triggerProps}>\n        <IconButton\n          ref={mergedRef}\n          size=\"sm\"\n          intent=\"surfaceInverse\"\n          design=\"ghost\"\n          aria-label={ariaLabel}\n          tabIndex={-1}\n        >\n          <Icon>{iconChildren || <MoreMenuHorizontal />}</Icon>\n        </IconButton>\n      </SparkPopover.Trigger>\n    )\n  }\n)\n\nTabsPopoverTrigger.displayName = 'Popover.Trigger'\n\n// Content component that uses context\nconst TabsPopoverContent = forwardRef<HTMLDivElement, PopoverContentProps>(\n  ({ side, align = 'start', className, ...contentProps }, ref) => {\n    const { popoverSide } = useTabsPopoverContext()\n    const mergedClassName = cx('gap-sm flex flex-col', className)\n\n    return (\n      <SparkPopover.Content\n        ref={ref}\n        {...contentProps}\n        side={side ?? popoverSide}\n        align={align}\n        className={mergedClassName}\n      />\n    )\n  }\n)\n\nTabsPopoverContent.displayName = 'Popover.Content'\n\n// Export types\nexport type TabsPopoverTriggerComponent = typeof TabsPopoverTrigger\nexport type TabsPopoverContentComponent = typeof TabsPopoverContent\n\n// Create a type that extends SparkPopover but overrides Content and Trigger\n// Use ComponentType for JSX compatibility and Omit to exclude only Content and Trigger,\n// then add them back with the overridden types\nexport type ConfiguredPopoverComponent = ComponentType<PopoverProps> &\n  Omit<typeof SparkPopover, 'Content' | 'Trigger'> & {\n    Content: TabsPopoverContentComponent\n    Trigger: TabsPopoverTriggerComponent\n  }\n\ninterface PopoverAbstractionProps {\n  popoverSide: 'right' | 'bottom'\n  popoverTriggerRef: RefObject<HTMLButtonElement | null>\n  children: (Popover: ConfiguredPopoverComponent) => ReactNode\n}\n\nexport const Popover = ({ popoverSide, popoverTriggerRef, children }: PopoverAbstractionProps) => {\n  const contextValue = useMemo(\n    () => ({ popoverSide, popoverTriggerRef }),\n    [popoverSide, popoverTriggerRef]\n  )\n\n  const PopoverWrapper: typeof SparkPopover = ((props: PopoverProps) => (\n    <TabsPopoverContext.Provider value={contextValue}>\n      <SparkPopover {...props}>{props.children}</SparkPopover>\n    </TabsPopoverContext.Provider>\n  )) as typeof SparkPopover\n\n  const PopoverComponent = Object.assign(PopoverWrapper, SparkPopover, {\n    Content: TabsPopoverContent,\n    Trigger: TabsPopoverTrigger,\n  }) as ConfiguredPopoverComponent\n\n  return (\n    <TabsPopoverContext.Provider value={contextValue}>\n      {children(PopoverComponent)}\n    </TabsPopoverContext.Provider>\n  )\n}\n\nPopover.displayName = 'Popover'\n","import { makeVariants } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nexport const triggerVariants = cva(\n  [\n    'px-md',\n    'relative flex flex-none items-center',\n    'border-outline',\n    'hover:not-disabled:bg-surface-hovered',\n    'after:absolute',\n    'data-[state=active]:font-bold',\n    'data-[state=inactive]:not-disabled:cursor-pointer',\n    'data-[orientation=horizontal]:border-b-sm data-[orientation=horizontal]:after:inset-x-0 data-[orientation=horizontal]:after:bottom-[-1px] data-[orientation=horizontal]:after:h-sz-2',\n    'data-[orientation=vertical]:border-r-sm data-[orientation=vertical]:after:inset-y-0 data-[orientation=vertical]:after:right-[-1px] data-[orientation=vertical]:after:w-sz-2',\n    'focus-visible:border-none focus-visible:bg-surface-hovered focus-visible:u-outline-inset',\n    'disabled:cursor-not-allowed disabled:opacity-dim-3',\n    'gap-md [&>*:first-child]:ml-md [&>*:last-child]:mr-md',\n    '[&>svg:last-child:first-child]:mx-auto',\n  ],\n  {\n    variants: {\n      /**\n       * Change the color scheme of the tabs\n       * @default support\n       */\n      intent: makeVariants<'intent', ['main', 'support']>({\n        main: ['data-[state=active]:text-main data-[state=active]:after:bg-main'],\n        support: ['data-[state=active]:text-support data-[state=active]:after:bg-support'],\n      }),\n      /**\n       * Change the size of the tabs\n       * @default md\n       */\n      size: {\n        xs: ['h-sz-32 min-w-sz-32 text-caption'],\n        sm: ['h-sz-36 min-w-sz-36 text-body-2'],\n        md: ['h-sz-40 min-w-sz-40 text-body-1'],\n      },\n      hasMenu: {\n        true: 'pr-3xl',\n      },\n      orientation: {\n        horizontal: '',\n        vertical: '',\n      },\n    },\n    compoundVariants: [\n      {\n        hasMenu: true,\n        orientation: 'vertical',\n        class: 'w-full',\n      },\n    ],\n    defaultVariants: {\n      intent: 'support',\n      size: 'md',\n      hasMenu: false,\n      orientation: 'horizontal',\n    },\n  }\n)\n\nexport type TabsTriggerVariantsProps = VariantProps<typeof triggerVariants>\n","import { useMergeRefs } from '@spark-ui/hooks/use-merge-refs'\nimport { Tabs as RadixTabs } from 'radix-ui'\nimport { type FocusEvent, type KeyboardEvent, type ReactNode, Ref, useRef } from 'react'\n\nimport { useTabsContext } from './TabsContext'\nimport { type ConfiguredPopoverComponent, Popover } from './TabsPopoverAbstraction'\nimport { triggerVariants } from './TabsTrigger.styles'\n\nexport interface TabsTriggerProps extends RadixTabs.TabsTriggerProps {\n  /**\n   * A unique value that associates the trigger with a content.\n   */\n  value: string\n  /**\n   * Change the component to the HTML tag or custom component of the only child. This will merge the original component props with the props of the supplied element/component and change the underlying DOM node.\n   * @default false\n   */\n  asChild?: boolean\n  /**\n   * When true, prevents the user from interacting with the tab.\n   * @default false\n   */\n  disabled?: boolean\n  /**\n   * Function that receives a pre-configured Popover component and returns the popover structure.\n   * @example\n   * renderMenu={({ Popover }) => (\n   *   <Popover>\n   *     <Popover.Trigger aria-label=\"Options\">\n   *       <CustomIcon />\n   *     </Popover.Trigger>\n   *     <Popover.Content>\n   *       <Button>Action</Button>\n   *     </Popover.Content>\n   *   </Popover>\n   * )}\n   */\n  renderMenu?: (props: { Popover: ConfiguredPopoverComponent }) => ReactNode\n  ref?: Ref<HTMLButtonElement>\n}\n\nexport const TabsTrigger = ({\n  /**\n   * Default Radix Primitive values\n   * see https://www.radix-ui.com/docs/primitives/components/tabs#trigger\n   */\n  asChild = false,\n  value,\n  disabled = false,\n  children,\n  className,\n  ref,\n  onKeyDown,\n  renderMenu,\n  ...rest\n}: TabsTriggerProps) => {\n  const { intent, size, orientation } = useTabsContext()\n  const popoverTriggerRef = useRef<HTMLButtonElement>(null)\n  const tabsTriggerRef = useRef<HTMLButtonElement>(null)\n\n  // Combine internal ref with forwarded ref\n  const mergedRef = useMergeRefs(ref, tabsTriggerRef)\n\n  const handleKeyDown = (e: KeyboardEvent<HTMLButtonElement>) => {\n    // Handle Shift+F10 for popover\n    if (e.key === 'F10' && e.shiftKey && renderMenu && popoverTriggerRef.current) {\n      e.preventDefault()\n      popoverTriggerRef.current.click()\n    }\n\n    // Call original onKeyDown if provided\n    onKeyDown?.(e)\n  }\n\n  const hasMenu = !!renderMenu\n  const popoverSide = orientation === 'vertical' ? 'right' : 'bottom'\n\n  const trigger = (\n    <RadixTabs.Trigger\n      data-spark-component=\"tabs-trigger\"\n      ref={mergedRef}\n      className={triggerVariants({\n        intent,\n        size,\n        hasMenu,\n        orientation: orientation ?? 'horizontal',\n        className,\n      })}\n      asChild={asChild}\n      disabled={disabled}\n      value={value}\n      onFocus={({ target }: FocusEvent<HTMLButtonElement>) =>\n        target.scrollIntoView({\n          behavior: 'smooth',\n          block: 'nearest',\n          inline: 'nearest',\n        })\n      }\n      onKeyDown={handleKeyDown}\n      aria-haspopup={hasMenu ? 'true' : undefined}\n      {...rest}\n    >\n      {children}\n    </RadixTabs.Trigger>\n  )\n\n  if (!hasMenu) {\n    return trigger\n  }\n\n  return (\n    <div className={orientation === 'vertical' ? 'relative w-full' : 'relative'}>\n      {trigger}\n      <div className=\"right-md mr-md pointer-events-auto absolute top-1/2 -translate-y-1/2\">\n        <Popover popoverSide={popoverSide} popoverTriggerRef={popoverTriggerRef}>\n          {PopoverAbstraction => renderMenu?.({ Popover: PopoverAbstraction })}\n        </Popover>\n      </div>\n    </div>\n  )\n}\n\nTabsTrigger.displayName = 'Tabs.Trigger'\n","import { Tabs as Root } from './Tabs'\nimport { TabsContent as Content } from './TabsContent'\nimport { TabsList as List } from './TabsList'\nimport { TabsTrigger as Trigger } from './TabsTrigger'\n\nexport const Tabs: typeof Root & {\n  List: typeof List\n  Trigger: typeof Trigger\n  Content: typeof Content\n} = Object.assign(Root, {\n  List,\n  Trigger,\n  Content,\n})\n\nTabs.displayName = 'Tabs'\nList.displayName = 'Tabs.List'\nTrigger.displayName = 'Tabs.Trigger'\nContent.displayName = 'Tabs.Content'\n\nexport { type TabsContentProps } from './TabsContent'\nexport { type TabsListProps } from './TabsList'\nexport { type TabsProps, type TabsRootProps } from './Tabs'\nexport { type TabsTriggerProps } from './TabsTrigger'\n"],"names":["TabsContext","createContext","useTabsContext","context","useContext","rootStyles","cva","Tabs","intent","size","asChild","forceMount","orientation","children","className","ref","rest","jsx","RadixTabs","contentStyles","TabsContent","wrapperStyles","listStyles","navigationArrowStyles","useResizeObserver","target","onResize","setSize","useState","resizeObserverRef","useRef","resizeCallbackRef","useEffect","targetElm","entry","width","height","TabsList","loop","wrapperRef","innerRef","listRef","arrows","setArrows","toggleArrowsVisibility","currentList","handlePrevClick","shouldLoopForward","handleNextClick","shouldLoopBackward","jsxs","Button","Icon","ArrowVerticalLeft","ArrowVerticalRight","TabsPopoverContext","useTabsPopoverContext","TabsPopoverTrigger","forwardRef","ariaLabel","iconChildren","triggerProps","forwardedRef","popoverTriggerRef","mergedRef","useMergeRefs","SparkPopover","IconButton","MoreMenuHorizontal","TabsPopoverContent","side","align","contentProps","popoverSide","mergedClassName","cx","Popover","contextValue","useMemo","PopoverComponent","props","triggerVariants","makeVariants","TabsTrigger","value","disabled","onKeyDown","renderMenu","tabsTriggerRef","handleKeyDown","e","hasMenu","trigger","PopoverAbstraction","Root","List","Trigger","Content"],"mappings":"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"}

package/dist/tag/Tag.styles.d.ts

@@ -3,6 +3,6 @@ export declare const tagStyles: (props?: ({
     design?: "filled" | "outlined" | "tinted" | null | undefined;
     size?: "md" | "lg" | null | undefined;
     shape?: "square" | "rounded" | "pill" | null | undefined;
-    intent?: "main" | "alert" | "support" | "accent" | "basic" | "success" | "info" | "neutral" | "danger" | "surface" | null | undefined;
+    intent?: "main" | "alert" | "support" | "accent" | "success" | "info" | "neutral" | "danger" | "surface" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 export type TagStylesProps = VariantProps<typeof tagStyles>;

package/dist/tag/index.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const d=require("react/jsx-runtime"),u=require("../Slot-DQ8z2zsy.js"),t=require("@spark-ui/internal-utils"),g=require("class-variance-authority"),b=[{intent:"main",design:"filled",class:t.tw(["bg-main","text-on-main"])},{intent:"support",design:"filled",class:t.tw(["bg-support","text-on-support"])},{intent:"accent",design:"filled",class:t.tw(["bg-accent","text-on-accent"])},{intent:"basic",design:"filled",class:t.tw(["bg-basic","text-on-basic"])},{intent:"success",design:"filled",class:t.tw(["bg-success","text-on-success"])},{intent:"alert",design:"filled",class:t.tw(["bg-alert","text-on-alert"])},{intent:"danger",design:"filled",class:t.tw(["bg-error","text-on-error"])},{intent:"info",design:"filled",class:t.tw(["bg-info","text-on-info"])},{intent:"neutral",design:"filled",class:t.tw(["bg-neutral","text-on-neutral"])},{intent:"surface",design:"filled",class:t.tw(["bg-surface","text-on-surface"])}],f=[{intent:"main",design:"outlined",class:t.tw(["text-main"])},{intent:"support",design:"outlined",class:t.tw(["text-support"])},{intent:"accent",design:"outlined",class:t.tw(["text-accent"])},{intent:"basic",design:"outlined",class:t.tw(["text-basic"])},{intent:"success",design:"outlined",class:t.tw(["text-success"])},{intent:"alert",design:"outlined",class:t.tw(["text-alert"])},{intent:"danger",design:"outlined",class:t.tw(["text-error"])},{intent:"info",design:"outlined",class:t.tw(["text-info"])},{intent:"neutral",design:"outlined",class:t.tw(["text-neutral"])}],p=[{intent:"main",design:"tinted",class:t.tw(["bg-main-container","text-on-main-container"])},{intent:"support",design:"tinted",class:t.tw(["bg-support-container","text-on-support-container"])},{intent:"accent",design:"tinted",class:t.tw(["bg-accent-container","text-on-accent-container"])},{intent:"basic",design:"tinted",class:t.tw(["bg-basic-container","text-on-basic-container"])},{intent:"success",design:"tinted",class:t.tw(["bg-success-container","text-on-success-container"])},{intent:"alert",design:"tinted",class:t.tw(["bg-alert-container","text-on-alert-container"])},{intent:"danger",design:"tinted",class:t.tw(["bg-error-container","text-on-error-container"])},{intent:"info",design:"tinted",class:t.tw(["bg-info-container","text-on-info-container"])},{intent:"neutral",design:"tinted",class:t.tw(["bg-neutral-container","text-on-neutral-container"])}],x=g.cva(["box-border default:inline-flex default:w-fit items-center justify-center gap-sm whitespace-nowrap","text-caption font-bold","px-md"],{variants:{design:t.makeVariants({filled:[],outlined:["border-sm","border-current"],tinted:[]}),size:t.makeVariants({md:["h-sz-20"],lg:["h-sz-24"]}),shape:t.makeVariants({square:[],rounded:["rounded-md"],pill:["rounded-full"]}),intent:t.makeVariants({main:[],support:[],accent:[],basic:[],success:[],alert:[],danger:[],info:[],neutral:[],surface:[]})},compoundVariants:[...b,...f,...p],defaultVariants:{design:"filled",intent:"basic",size:"md",shape:"pill"}}),w=({design:n="filled",intent:e="basic",size:s="md",shape:i="pill",asChild:a,className:c,ref:r,...l})=>{const o=a?u.Slot:"span";return d.jsx(o,{"data-spark-component":"tag",ref:r,className:x({className:c,design:n,intent:e,size:s,shape:i}),...l})};exports.Tag=w;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const d=require("react/jsx-runtime"),u=require("../Slot-DQ8z2zsy.js"),t=require("@spark-ui/internal-utils"),g=require("class-variance-authority"),p=[{intent:"main",design:"filled",class:t.tw(["bg-main","text-on-main"])},{intent:"support",design:"filled",class:t.tw(["bg-support","text-on-support"])},{intent:"accent",design:"filled",class:t.tw(["bg-accent","text-on-accent"])},{intent:"success",design:"filled",class:t.tw(["bg-success","text-on-success"])},{intent:"alert",design:"filled",class:t.tw(["bg-alert","text-on-alert"])},{intent:"danger",design:"filled",class:t.tw(["bg-error","text-on-error"])},{intent:"info",design:"filled",class:t.tw(["bg-info","text-on-info"])},{intent:"neutral",design:"filled",class:t.tw(["bg-neutral","text-on-neutral"])},{intent:"surface",design:"filled",class:t.tw(["bg-surface","text-on-surface"])}],f=[{intent:"main",design:"outlined",class:t.tw(["text-main"])},{intent:"support",design:"outlined",class:t.tw(["text-support"])},{intent:"accent",design:"outlined",class:t.tw(["text-accent"])},{intent:"success",design:"outlined",class:t.tw(["text-success"])},{intent:"alert",design:"outlined",class:t.tw(["text-alert"])},{intent:"danger",design:"outlined",class:t.tw(["text-error"])},{intent:"info",design:"outlined",class:t.tw(["text-info"])},{intent:"neutral",design:"outlined",class:t.tw(["text-neutral"])}],x=[{intent:"main",design:"tinted",class:t.tw(["bg-main-container","text-on-main-container"])},{intent:"support",design:"tinted",class:t.tw(["bg-support-container","text-on-support-container"])},{intent:"accent",design:"tinted",class:t.tw(["bg-accent-container","text-on-accent-container"])},{intent:"success",design:"tinted",class:t.tw(["bg-success-container","text-on-success-container"])},{intent:"alert",design:"tinted",class:t.tw(["bg-alert-container","text-on-alert-container"])},{intent:"danger",design:"tinted",class:t.tw(["bg-error-container","text-on-error-container"])},{intent:"info",design:"tinted",class:t.tw(["bg-info-container","text-on-info-container"])},{intent:"neutral",design:"tinted",class:t.tw(["bg-neutral-container","text-on-neutral-container"])}],w=g.cva(["box-border default:inline-flex default:w-fit items-center justify-center gap-sm whitespace-nowrap","text-caption font-bold","px-md"],{variants:{design:t.makeVariants({filled:[],outlined:["border-sm","border-current"],tinted:[]}),size:t.makeVariants({md:["h-sz-20"],lg:["h-sz-24"]}),shape:t.makeVariants({square:[],rounded:["rounded-md"],pill:["rounded-full"]}),intent:t.makeVariants({main:[],support:[],accent:[],success:[],alert:[],danger:[],info:[],neutral:[],surface:[]})},compoundVariants:[...p,...f,...x],defaultVariants:{design:"filled",intent:"support",size:"md",shape:"pill"}}),m=({design:n="filled",intent:e="support",size:s="md",shape:i="pill",asChild:a,className:r,ref:c,...l})=>{const o=a?u.Slot:"span";return d.jsx(o,{"data-spark-component":"tag",ref:c,className:w({className:r,design:n,intent:e,size:s,shape:i}),...l})};exports.Tag=m;
 //# sourceMappingURL=index.js.map

package/dist/tag/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/tag/variants/filled.ts","../../src/tag/variants/outlined.ts","../../src/tag/variants/tinted.ts","../../src/tag/Tag.styles.tsx","../../src/tag/Tag.tsx"],"sourcesContent":["import { tw } from '@spark-ui/internal-utils'\n\nexport const filledVariants = [\n  {\n    intent: 'main',\n    design: 'filled',\n    class: tw(['bg-main', 'text-on-main']),\n  },\n  {\n    intent: 'support',\n    design: 'filled',\n    class: tw(['bg-support', 'text-on-support']),\n  },\n  {\n    intent: 'accent',\n    design: 'filled',\n    class: tw(['bg-accent', 'text-on-accent']),\n  },\n  {\n    intent: 'basic',\n    design: 'filled',\n    class: tw(['bg-basic', 'text-on-basic']),\n  },\n  {\n    intent: 'success',\n    design: 'filled',\n    class: tw(['bg-success', 'text-on-success']),\n  },\n  {\n    intent: 'alert',\n    design: 'filled',\n    class: tw(['bg-alert', 'text-on-alert']),\n  },\n  {\n    intent: 'danger',\n    design: 'filled',\n    class: tw(['bg-error', 'text-on-error']),\n  },\n  {\n    intent: 'info',\n    design: 'filled',\n    class: tw(['bg-info', 'text-on-info']),\n  },\n  {\n    intent: 'neutral',\n    design: 'filled',\n    class: tw(['bg-neutral', 'text-on-neutral']),\n  },\n  {\n    intent: 'surface',\n    design: 'filled',\n    class: tw(['bg-surface', 'text-on-surface']),\n  },\n] as const\n","import { tw } from '@spark-ui/internal-utils'\n\nexport const outlinedVariants = [\n  {\n    intent: 'main',\n    design: 'outlined',\n    class: tw(['text-main']),\n  },\n  {\n    intent: 'support',\n    design: 'outlined',\n    class: tw(['text-support']),\n  },\n  {\n    intent: 'accent',\n    design: 'outlined',\n    class: tw(['text-accent']),\n  },\n  {\n    intent: 'basic',\n    design: 'outlined',\n    class: tw(['text-basic']),\n  },\n  {\n    intent: 'success',\n    design: 'outlined',\n    class: tw(['text-success']),\n  },\n  {\n    intent: 'alert',\n    design: 'outlined',\n    class: tw(['text-alert']),\n  },\n  {\n    intent: 'danger',\n    design: 'outlined',\n    class: tw(['text-error']),\n  },\n  {\n    intent: 'info',\n    design: 'outlined',\n    class: tw(['text-info']),\n  },\n  {\n    intent: 'neutral',\n    design: 'outlined',\n    class: tw(['text-neutral']),\n  },\n] as const\n","import { tw } from '@spark-ui/internal-utils'\n\nexport const tintedVariants = [\n  {\n    intent: 'main',\n    design: 'tinted',\n    class: tw(['bg-main-container', 'text-on-main-container']),\n  },\n  {\n    intent: 'support',\n    design: 'tinted',\n    class: tw(['bg-support-container', 'text-on-support-container']),\n  },\n  {\n    intent: 'accent',\n    design: 'tinted',\n    class: tw(['bg-accent-container', 'text-on-accent-container']),\n  },\n  {\n    intent: 'basic',\n    design: 'tinted',\n    class: tw(['bg-basic-container', 'text-on-basic-container']),\n  },\n  {\n    intent: 'success',\n    design: 'tinted',\n    class: tw(['bg-success-container', 'text-on-success-container']),\n  },\n  {\n    intent: 'alert',\n    design: 'tinted',\n    class: tw(['bg-alert-container', 'text-on-alert-container']),\n  },\n  {\n    intent: 'danger',\n    design: 'tinted',\n    class: tw(['bg-error-container', 'text-on-error-container']),\n  },\n  {\n    intent: 'info',\n    design: 'tinted',\n    class: tw(['bg-info-container', 'text-on-info-container']),\n  },\n  {\n    intent: 'neutral',\n    design: 'tinted',\n    class: tw(['bg-neutral-container', 'text-on-neutral-container']),\n  },\n] as const\n","import { makeVariants } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nimport { filledVariants, outlinedVariants, tintedVariants } from './variants'\n\nexport const tagStyles = cva(\n  [\n    'box-border default:inline-flex default:w-fit items-center justify-center gap-sm whitespace-nowrap',\n    'text-caption font-bold',\n    'px-md',\n  ],\n  {\n    variants: {\n      /**\n       * Main style of the tag.\n       * - `filled`: Tag will be plain.\n       * - `outlined`: Tag will have a surface background with an colored outline/text.\n       * - `tinted`: Tag will be filled but using a lighter color scheme.\n       */\n      design: makeVariants<'design', ['filled', 'outlined', 'tinted']>({\n        filled: [],\n        outlined: ['border-sm', 'border-current'],\n        tinted: [],\n      }),\n      size: makeVariants<'size', ['md', 'lg']>({\n        md: ['h-sz-20'],\n        lg: ['h-sz-24'],\n      }),\n      shape: makeVariants<'shape', ['square', 'rounded', 'pill']>({\n        square: [],\n        rounded: ['rounded-md'],\n        pill: ['rounded-full'],\n      }),\n      /**\n       * Color scheme of the tag.\n       */\n      intent: makeVariants<\n        'intent',\n        [\n          'main',\n          'support',\n          'accent',\n          'basic',\n          'success',\n          'alert',\n          'info',\n          'neutral',\n          'danger',\n          'surface',\n        ]\n      >({\n        main: [],\n        support: [],\n        accent: [],\n        basic: [],\n        success: [],\n        alert: [],\n        danger: [],\n        info: [],\n        neutral: [],\n        surface: [],\n      }),\n    },\n    compoundVariants: [...filledVariants, ...outlinedVariants, ...tintedVariants],\n    defaultVariants: {\n      design: 'filled',\n      intent: 'basic',\n      size: 'md',\n      shape: 'pill',\n    },\n  }\n)\n\nexport type TagStylesProps = VariantProps<typeof tagStyles>\n","import { ButtonHTMLAttributes, type PropsWithChildren, Ref } from 'react'\n\nimport { Slot } from '../slot'\nimport { tagStyles, type TagStylesProps } from './Tag.styles'\n\ninterface BaseTagProps\n  extends PropsWithChildren<ButtonHTMLAttributes<HTMLSpanElement>>,\n    TagStylesProps {\n  /**\n   * Change the component to the HTML tag or custom component of the only child.\n   */\n  asChild?: boolean\n}\n\ninterface FilteredDesignIntent<\n  Design extends TagProps['design'],\n  K extends TagStylesProps['intent'] | never = never,\n> {\n  design?: Design\n  intent?: Exclude<TagStylesProps['intent'], K>\n  ref?: Ref<HTMLButtonElement>\n}\n\nexport type ValidTagDesignIntent =\n  | FilteredDesignIntent<'tinted', 'surface'>\n  | FilteredDesignIntent<'outlined', 'surface'>\n  | FilteredDesignIntent<'filled'>\n\nexport type TagProps = BaseTagProps & ValidTagDesignIntent\n\nexport const Tag = ({\n  design = 'filled',\n  intent = 'basic',\n  size = 'md',\n  shape = 'pill',\n  asChild,\n  className,\n  ref,\n  ...others\n}: TagProps) => {\n  const Component = asChild ? Slot : 'span'\n\n  return (\n    <Component\n      data-spark-component=\"tag\"\n      ref={ref}\n      className={tagStyles({\n        className,\n        design,\n        intent,\n        size,\n        shape,\n      })}\n      {...others}\n    />\n  )\n}\n"],"names":["filledVariants","tw","outlinedVariants","tintedVariants","tagStyles","cva","makeVariants","Tag","design","intent","size","shape","asChild","className","ref","others","Component","Slot","jsx"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../src/tag/variants/filled.ts","../../src/tag/variants/outlined.ts","../../src/tag/variants/tinted.ts","../../src/tag/Tag.styles.tsx","../../src/tag/Tag.tsx"],"sourcesContent":["import { tw } from '@spark-ui/internal-utils'\n\nexport const filledVariants = [\n  {\n    intent: 'main',\n    design: 'filled',\n    class: tw(['bg-main', 'text-on-main']),\n  },\n  {\n    intent: 'support',\n    design: 'filled',\n    class: tw(['bg-support', 'text-on-support']),\n  },\n  {\n    intent: 'accent',\n    design: 'filled',\n    class: tw(['bg-accent', 'text-on-accent']),\n  },\n  {\n    intent: 'success',\n    design: 'filled',\n    class: tw(['bg-success', 'text-on-success']),\n  },\n  {\n    intent: 'alert',\n    design: 'filled',\n    class: tw(['bg-alert', 'text-on-alert']),\n  },\n  {\n    intent: 'danger',\n    design: 'filled',\n    class: tw(['bg-error', 'text-on-error']),\n  },\n  {\n    intent: 'info',\n    design: 'filled',\n    class: tw(['bg-info', 'text-on-info']),\n  },\n  {\n    intent: 'neutral',\n    design: 'filled',\n    class: tw(['bg-neutral', 'text-on-neutral']),\n  },\n  {\n    intent: 'surface',\n    design: 'filled',\n    class: tw(['bg-surface', 'text-on-surface']),\n  },\n] as const\n","import { tw } from '@spark-ui/internal-utils'\n\nexport const outlinedVariants = [\n  {\n    intent: 'main',\n    design: 'outlined',\n    class: tw(['text-main']),\n  },\n  {\n    intent: 'support',\n    design: 'outlined',\n    class: tw(['text-support']),\n  },\n  {\n    intent: 'accent',\n    design: 'outlined',\n    class: tw(['text-accent']),\n  },\n  {\n    intent: 'success',\n    design: 'outlined',\n    class: tw(['text-success']),\n  },\n  {\n    intent: 'alert',\n    design: 'outlined',\n    class: tw(['text-alert']),\n  },\n  {\n    intent: 'danger',\n    design: 'outlined',\n    class: tw(['text-error']),\n  },\n  {\n    intent: 'info',\n    design: 'outlined',\n    class: tw(['text-info']),\n  },\n  {\n    intent: 'neutral',\n    design: 'outlined',\n    class: tw(['text-neutral']),\n  },\n] as const\n","import { tw } from '@spark-ui/internal-utils'\n\nexport const tintedVariants = [\n  {\n    intent: 'main',\n    design: 'tinted',\n    class: tw(['bg-main-container', 'text-on-main-container']),\n  },\n  {\n    intent: 'support',\n    design: 'tinted',\n    class: tw(['bg-support-container', 'text-on-support-container']),\n  },\n  {\n    intent: 'accent',\n    design: 'tinted',\n    class: tw(['bg-accent-container', 'text-on-accent-container']),\n  },\n  {\n    intent: 'success',\n    design: 'tinted',\n    class: tw(['bg-success-container', 'text-on-success-container']),\n  },\n  {\n    intent: 'alert',\n    design: 'tinted',\n    class: tw(['bg-alert-container', 'text-on-alert-container']),\n  },\n  {\n    intent: 'danger',\n    design: 'tinted',\n    class: tw(['bg-error-container', 'text-on-error-container']),\n  },\n  {\n    intent: 'info',\n    design: 'tinted',\n    class: tw(['bg-info-container', 'text-on-info-container']),\n  },\n  {\n    intent: 'neutral',\n    design: 'tinted',\n    class: tw(['bg-neutral-container', 'text-on-neutral-container']),\n  },\n] as const\n","import { makeVariants } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nimport { filledVariants, outlinedVariants, tintedVariants } from './variants'\n\nexport const tagStyles = cva(\n  [\n    'box-border default:inline-flex default:w-fit items-center justify-center gap-sm whitespace-nowrap',\n    'text-caption font-bold',\n    'px-md',\n  ],\n  {\n    variants: {\n      /**\n       * Main style of the tag.\n       * - `filled`: Tag will be plain.\n       * - `outlined`: Tag will have a surface background with an colored outline/text.\n       * - `tinted`: Tag will be filled but using a lighter color scheme.\n       */\n      design: makeVariants<'design', ['filled', 'outlined', 'tinted']>({\n        filled: [],\n        outlined: ['border-sm', 'border-current'],\n        tinted: [],\n      }),\n      size: makeVariants<'size', ['md', 'lg']>({\n        md: ['h-sz-20'],\n        lg: ['h-sz-24'],\n      }),\n      shape: makeVariants<'shape', ['square', 'rounded', 'pill']>({\n        square: [],\n        rounded: ['rounded-md'],\n        pill: ['rounded-full'],\n      }),\n      /**\n       * Color scheme of the tag.\n       */\n      intent: makeVariants<\n        'intent',\n        ['main', 'support', 'accent', 'success', 'alert', 'info', 'neutral', 'danger', 'surface']\n      >({\n        main: [],\n        support: [],\n        accent: [],\n        success: [],\n        alert: [],\n        danger: [],\n        info: [],\n        neutral: [],\n        surface: [],\n      }),\n    },\n    compoundVariants: [...filledVariants, ...outlinedVariants, ...tintedVariants],\n    defaultVariants: {\n      design: 'filled',\n      intent: 'support',\n      size: 'md',\n      shape: 'pill',\n    },\n  }\n)\n\nexport type TagStylesProps = VariantProps<typeof tagStyles>\n","import { ButtonHTMLAttributes, type PropsWithChildren, Ref } from 'react'\n\nimport { Slot } from '../slot'\nimport { tagStyles, type TagStylesProps } from './Tag.styles'\n\ninterface BaseTagProps\n  extends PropsWithChildren<ButtonHTMLAttributes<HTMLSpanElement>>,\n    TagStylesProps {\n  /**\n   * Change the component to the HTML tag or custom component of the only child.\n   */\n  asChild?: boolean\n}\n\ninterface FilteredDesignIntent<\n  Design extends TagProps['design'],\n  K extends TagStylesProps['intent'] | never = never,\n> {\n  design?: Design\n  intent?: Exclude<TagStylesProps['intent'], K>\n  ref?: Ref<HTMLButtonElement>\n}\n\nexport type ValidTagDesignIntent =\n  | FilteredDesignIntent<'tinted', 'surface'>\n  | FilteredDesignIntent<'outlined', 'surface'>\n  | FilteredDesignIntent<'filled'>\n\nexport type TagProps = BaseTagProps & ValidTagDesignIntent\n\nexport const Tag = ({\n  design = 'filled',\n  intent = 'support',\n  size = 'md',\n  shape = 'pill',\n  asChild,\n  className,\n  ref,\n  ...others\n}: TagProps) => {\n  const Component = asChild ? Slot : 'span'\n\n  return (\n    <Component\n      data-spark-component=\"tag\"\n      ref={ref}\n      className={tagStyles({\n        className,\n        design,\n        intent,\n        size,\n        shape,\n      })}\n      {...others}\n    />\n  )\n}\n"],"names":["filledVariants","tw","outlinedVariants","tintedVariants","tagStyles","cva","makeVariants","Tag","design","intent","size","shape","asChild","className","ref","others","Component","Slot","jsx"],"mappings":"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"}

package/dist/tag/index.mjs

@@ -1,8 +1,8 @@
 import { jsx as d } from "react/jsx-runtime";
-import { S as g } from "../Slot-DLY1rJrG.mjs";
+import { S as u } from "../Slot-DLY1rJrG.mjs";
 import { tw as t, makeVariants as n } from "@spark-ui/internal-utils";
-import { cva as u } from "class-variance-authority";
-const f = [
+import { cva as g } from "class-variance-authority";
+const p = [
   {
     intent: "main",
     design: "filled",
@@ -18,11 +18,6 @@ const f = [
     design: "filled",
     class: t(["bg-accent", "text-on-accent"])
   },
-  {
-    intent: "basic",
-    design: "filled",
-    class: t(["bg-basic", "text-on-basic"])
-  },
   {
     intent: "success",
     design: "filled",
@@ -53,7 +48,7 @@ const f = [
     design: "filled",
     class: t(["bg-surface", "text-on-surface"])
   }
-], p = [
+], f = [
   {
     intent: "main",
     design: "outlined",
@@ -69,11 +64,6 @@ const f = [
     design: "outlined",
     class: t(["text-accent"])
   },
-  {
-    intent: "basic",
-    design: "outlined",
-    class: t(["text-basic"])
-  },
   {
     intent: "success",
     design: "outlined",
@@ -99,7 +89,7 @@ const f = [
     design: "outlined",
     class: t(["text-neutral"])
   }
-], b = [
+], m = [
   {
     intent: "main",
     design: "tinted",
@@ -115,11 +105,6 @@ const f = [
     design: "tinted",
     class: t(["bg-accent-container", "text-on-accent-container"])
   },
-  {
-    intent: "basic",
-    design: "tinted",
-    class: t(["bg-basic-container", "text-on-basic-container"])
-  },
   {
     intent: "success",
     design: "tinted",
@@ -145,7 +130,7 @@ const f = [
     design: "tinted",
     class: t(["bg-neutral-container", "text-on-neutral-container"])
   }
-], x = u(
+], x = g(
   [
     "box-border default:inline-flex default:w-fit items-center justify-center gap-sm whitespace-nowrap",
     "text-caption font-bold",
@@ -180,7 +165,6 @@ const f = [
         main: [],
         support: [],
         accent: [],
-        basic: [],
         success: [],
         alert: [],
         danger: [],
@@ -189,36 +173,36 @@ const f = [
         surface: []
       })
     },
-    compoundVariants: [...f, ...p, ...b],
+    compoundVariants: [...p, ...f, ...m],
     defaultVariants: {
       design: "filled",
-      intent: "basic",
+      intent: "support",
       size: "md",
       shape: "pill"
     }
   }
 ), S = ({
   design: e = "filled",
-  intent: s = "basic",
+  intent: s = "support",
   size: i = "md",
   shape: a = "pill",
-  asChild: c,
-  className: o,
+  asChild: o,
+  className: r,
   ref: l,
-  ...r
+  ...c
 }) => /* @__PURE__ */ d(
-  c ? g : "span",
+  o ? u : "span",
   {
     "data-spark-component": "tag",
     ref: l,
     className: x({
-      className: o,
+      className: r,
       design: e,
       intent: s,
       size: i,
       shape: a
     }),
-    ...r
+    ...c
   }
 );
 export {

package/dist/tag/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../../src/tag/variants/filled.ts","../../src/tag/variants/outlined.ts","../../src/tag/variants/tinted.ts","../../src/tag/Tag.styles.tsx","../../src/tag/Tag.tsx"],"sourcesContent":["import { tw } from '@spark-ui/internal-utils'\n\nexport const filledVariants = [\n  {\n    intent: 'main',\n    design: 'filled',\n    class: tw(['bg-main', 'text-on-main']),\n  },\n  {\n    intent: 'support',\n    design: 'filled',\n    class: tw(['bg-support', 'text-on-support']),\n  },\n  {\n    intent: 'accent',\n    design: 'filled',\n    class: tw(['bg-accent', 'text-on-accent']),\n  },\n  {\n    intent: 'basic',\n    design: 'filled',\n    class: tw(['bg-basic', 'text-on-basic']),\n  },\n  {\n    intent: 'success',\n    design: 'filled',\n    class: tw(['bg-success', 'text-on-success']),\n  },\n  {\n    intent: 'alert',\n    design: 'filled',\n    class: tw(['bg-alert', 'text-on-alert']),\n  },\n  {\n    intent: 'danger',\n    design: 'filled',\n    class: tw(['bg-error', 'text-on-error']),\n  },\n  {\n    intent: 'info',\n    design: 'filled',\n    class: tw(['bg-info', 'text-on-info']),\n  },\n  {\n    intent: 'neutral',\n    design: 'filled',\n    class: tw(['bg-neutral', 'text-on-neutral']),\n  },\n  {\n    intent: 'surface',\n    design: 'filled',\n    class: tw(['bg-surface', 'text-on-surface']),\n  },\n] as const\n","import { tw } from '@spark-ui/internal-utils'\n\nexport const outlinedVariants = [\n  {\n    intent: 'main',\n    design: 'outlined',\n    class: tw(['text-main']),\n  },\n  {\n    intent: 'support',\n    design: 'outlined',\n    class: tw(['text-support']),\n  },\n  {\n    intent: 'accent',\n    design: 'outlined',\n    class: tw(['text-accent']),\n  },\n  {\n    intent: 'basic',\n    design: 'outlined',\n    class: tw(['text-basic']),\n  },\n  {\n    intent: 'success',\n    design: 'outlined',\n    class: tw(['text-success']),\n  },\n  {\n    intent: 'alert',\n    design: 'outlined',\n    class: tw(['text-alert']),\n  },\n  {\n    intent: 'danger',\n    design: 'outlined',\n    class: tw(['text-error']),\n  },\n  {\n    intent: 'info',\n    design: 'outlined',\n    class: tw(['text-info']),\n  },\n  {\n    intent: 'neutral',\n    design: 'outlined',\n    class: tw(['text-neutral']),\n  },\n] as const\n","import { tw } from '@spark-ui/internal-utils'\n\nexport const tintedVariants = [\n  {\n    intent: 'main',\n    design: 'tinted',\n    class: tw(['bg-main-container', 'text-on-main-container']),\n  },\n  {\n    intent: 'support',\n    design: 'tinted',\n    class: tw(['bg-support-container', 'text-on-support-container']),\n  },\n  {\n    intent: 'accent',\n    design: 'tinted',\n    class: tw(['bg-accent-container', 'text-on-accent-container']),\n  },\n  {\n    intent: 'basic',\n    design: 'tinted',\n    class: tw(['bg-basic-container', 'text-on-basic-container']),\n  },\n  {\n    intent: 'success',\n    design: 'tinted',\n    class: tw(['bg-success-container', 'text-on-success-container']),\n  },\n  {\n    intent: 'alert',\n    design: 'tinted',\n    class: tw(['bg-alert-container', 'text-on-alert-container']),\n  },\n  {\n    intent: 'danger',\n    design: 'tinted',\n    class: tw(['bg-error-container', 'text-on-error-container']),\n  },\n  {\n    intent: 'info',\n    design: 'tinted',\n    class: tw(['bg-info-container', 'text-on-info-container']),\n  },\n  {\n    intent: 'neutral',\n    design: 'tinted',\n    class: tw(['bg-neutral-container', 'text-on-neutral-container']),\n  },\n] as const\n","import { makeVariants } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nimport { filledVariants, outlinedVariants, tintedVariants } from './variants'\n\nexport const tagStyles = cva(\n  [\n    'box-border default:inline-flex default:w-fit items-center justify-center gap-sm whitespace-nowrap',\n    'text-caption font-bold',\n    'px-md',\n  ],\n  {\n    variants: {\n      /**\n       * Main style of the tag.\n       * - `filled`: Tag will be plain.\n       * - `outlined`: Tag will have a surface background with an colored outline/text.\n       * - `tinted`: Tag will be filled but using a lighter color scheme.\n       */\n      design: makeVariants<'design', ['filled', 'outlined', 'tinted']>({\n        filled: [],\n        outlined: ['border-sm', 'border-current'],\n        tinted: [],\n      }),\n      size: makeVariants<'size', ['md', 'lg']>({\n        md: ['h-sz-20'],\n        lg: ['h-sz-24'],\n      }),\n      shape: makeVariants<'shape', ['square', 'rounded', 'pill']>({\n        square: [],\n        rounded: ['rounded-md'],\n        pill: ['rounded-full'],\n      }),\n      /**\n       * Color scheme of the tag.\n       */\n      intent: makeVariants<\n        'intent',\n        [\n          'main',\n          'support',\n          'accent',\n          'basic',\n          'success',\n          'alert',\n          'info',\n          'neutral',\n          'danger',\n          'surface',\n        ]\n      >({\n        main: [],\n        support: [],\n        accent: [],\n        basic: [],\n        success: [],\n        alert: [],\n        danger: [],\n        info: [],\n        neutral: [],\n        surface: [],\n      }),\n    },\n    compoundVariants: [...filledVariants, ...outlinedVariants, ...tintedVariants],\n    defaultVariants: {\n      design: 'filled',\n      intent: 'basic',\n      size: 'md',\n      shape: 'pill',\n    },\n  }\n)\n\nexport type TagStylesProps = VariantProps<typeof tagStyles>\n","import { ButtonHTMLAttributes, type PropsWithChildren, Ref } from 'react'\n\nimport { Slot } from '../slot'\nimport { tagStyles, type TagStylesProps } from './Tag.styles'\n\ninterface BaseTagProps\n  extends PropsWithChildren<ButtonHTMLAttributes<HTMLSpanElement>>,\n    TagStylesProps {\n  /**\n   * Change the component to the HTML tag or custom component of the only child.\n   */\n  asChild?: boolean\n}\n\ninterface FilteredDesignIntent<\n  Design extends TagProps['design'],\n  K extends TagStylesProps['intent'] | never = never,\n> {\n  design?: Design\n  intent?: Exclude<TagStylesProps['intent'], K>\n  ref?: Ref<HTMLButtonElement>\n}\n\nexport type ValidTagDesignIntent =\n  | FilteredDesignIntent<'tinted', 'surface'>\n  | FilteredDesignIntent<'outlined', 'surface'>\n  | FilteredDesignIntent<'filled'>\n\nexport type TagProps = BaseTagProps & ValidTagDesignIntent\n\nexport const Tag = ({\n  design = 'filled',\n  intent = 'basic',\n  size = 'md',\n  shape = 'pill',\n  asChild,\n  className,\n  ref,\n  ...others\n}: TagProps) => {\n  const Component = asChild ? Slot : 'span'\n\n  return (\n    <Component\n      data-spark-component=\"tag\"\n      ref={ref}\n      className={tagStyles({\n        className,\n        design,\n        intent,\n        size,\n        shape,\n      })}\n      {...others}\n    />\n  )\n}\n"],"names":["filledVariants","tw","outlinedVariants","tintedVariants","tagStyles","cva","makeVariants","Tag","design","intent","size","shape","asChild","className","ref","others","jsx","Slot"],"mappings":"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"}
+{"version":3,"file":"index.mjs","sources":["../../src/tag/variants/filled.ts","../../src/tag/variants/outlined.ts","../../src/tag/variants/tinted.ts","../../src/tag/Tag.styles.tsx","../../src/tag/Tag.tsx"],"sourcesContent":["import { tw } from '@spark-ui/internal-utils'\n\nexport const filledVariants = [\n  {\n    intent: 'main',\n    design: 'filled',\n    class: tw(['bg-main', 'text-on-main']),\n  },\n  {\n    intent: 'support',\n    design: 'filled',\n    class: tw(['bg-support', 'text-on-support']),\n  },\n  {\n    intent: 'accent',\n    design: 'filled',\n    class: tw(['bg-accent', 'text-on-accent']),\n  },\n  {\n    intent: 'success',\n    design: 'filled',\n    class: tw(['bg-success', 'text-on-success']),\n  },\n  {\n    intent: 'alert',\n    design: 'filled',\n    class: tw(['bg-alert', 'text-on-alert']),\n  },\n  {\n    intent: 'danger',\n    design: 'filled',\n    class: tw(['bg-error', 'text-on-error']),\n  },\n  {\n    intent: 'info',\n    design: 'filled',\n    class: tw(['bg-info', 'text-on-info']),\n  },\n  {\n    intent: 'neutral',\n    design: 'filled',\n    class: tw(['bg-neutral', 'text-on-neutral']),\n  },\n  {\n    intent: 'surface',\n    design: 'filled',\n    class: tw(['bg-surface', 'text-on-surface']),\n  },\n] as const\n","import { tw } from '@spark-ui/internal-utils'\n\nexport const outlinedVariants = [\n  {\n    intent: 'main',\n    design: 'outlined',\n    class: tw(['text-main']),\n  },\n  {\n    intent: 'support',\n    design: 'outlined',\n    class: tw(['text-support']),\n  },\n  {\n    intent: 'accent',\n    design: 'outlined',\n    class: tw(['text-accent']),\n  },\n  {\n    intent: 'success',\n    design: 'outlined',\n    class: tw(['text-success']),\n  },\n  {\n    intent: 'alert',\n    design: 'outlined',\n    class: tw(['text-alert']),\n  },\n  {\n    intent: 'danger',\n    design: 'outlined',\n    class: tw(['text-error']),\n  },\n  {\n    intent: 'info',\n    design: 'outlined',\n    class: tw(['text-info']),\n  },\n  {\n    intent: 'neutral',\n    design: 'outlined',\n    class: tw(['text-neutral']),\n  },\n] as const\n","import { tw } from '@spark-ui/internal-utils'\n\nexport const tintedVariants = [\n  {\n    intent: 'main',\n    design: 'tinted',\n    class: tw(['bg-main-container', 'text-on-main-container']),\n  },\n  {\n    intent: 'support',\n    design: 'tinted',\n    class: tw(['bg-support-container', 'text-on-support-container']),\n  },\n  {\n    intent: 'accent',\n    design: 'tinted',\n    class: tw(['bg-accent-container', 'text-on-accent-container']),\n  },\n  {\n    intent: 'success',\n    design: 'tinted',\n    class: tw(['bg-success-container', 'text-on-success-container']),\n  },\n  {\n    intent: 'alert',\n    design: 'tinted',\n    class: tw(['bg-alert-container', 'text-on-alert-container']),\n  },\n  {\n    intent: 'danger',\n    design: 'tinted',\n    class: tw(['bg-error-container', 'text-on-error-container']),\n  },\n  {\n    intent: 'info',\n    design: 'tinted',\n    class: tw(['bg-info-container', 'text-on-info-container']),\n  },\n  {\n    intent: 'neutral',\n    design: 'tinted',\n    class: tw(['bg-neutral-container', 'text-on-neutral-container']),\n  },\n] as const\n","import { makeVariants } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nimport { filledVariants, outlinedVariants, tintedVariants } from './variants'\n\nexport const tagStyles = cva(\n  [\n    'box-border default:inline-flex default:w-fit items-center justify-center gap-sm whitespace-nowrap',\n    'text-caption font-bold',\n    'px-md',\n  ],\n  {\n    variants: {\n      /**\n       * Main style of the tag.\n       * - `filled`: Tag will be plain.\n       * - `outlined`: Tag will have a surface background with an colored outline/text.\n       * - `tinted`: Tag will be filled but using a lighter color scheme.\n       */\n      design: makeVariants<'design', ['filled', 'outlined', 'tinted']>({\n        filled: [],\n        outlined: ['border-sm', 'border-current'],\n        tinted: [],\n      }),\n      size: makeVariants<'size', ['md', 'lg']>({\n        md: ['h-sz-20'],\n        lg: ['h-sz-24'],\n      }),\n      shape: makeVariants<'shape', ['square', 'rounded', 'pill']>({\n        square: [],\n        rounded: ['rounded-md'],\n        pill: ['rounded-full'],\n      }),\n      /**\n       * Color scheme of the tag.\n       */\n      intent: makeVariants<\n        'intent',\n        ['main', 'support', 'accent', 'success', 'alert', 'info', 'neutral', 'danger', 'surface']\n      >({\n        main: [],\n        support: [],\n        accent: [],\n        success: [],\n        alert: [],\n        danger: [],\n        info: [],\n        neutral: [],\n        surface: [],\n      }),\n    },\n    compoundVariants: [...filledVariants, ...outlinedVariants, ...tintedVariants],\n    defaultVariants: {\n      design: 'filled',\n      intent: 'support',\n      size: 'md',\n      shape: 'pill',\n    },\n  }\n)\n\nexport type TagStylesProps = VariantProps<typeof tagStyles>\n","import { ButtonHTMLAttributes, type PropsWithChildren, Ref } from 'react'\n\nimport { Slot } from '../slot'\nimport { tagStyles, type TagStylesProps } from './Tag.styles'\n\ninterface BaseTagProps\n  extends PropsWithChildren<ButtonHTMLAttributes<HTMLSpanElement>>,\n    TagStylesProps {\n  /**\n   * Change the component to the HTML tag or custom component of the only child.\n   */\n  asChild?: boolean\n}\n\ninterface FilteredDesignIntent<\n  Design extends TagProps['design'],\n  K extends TagStylesProps['intent'] | never = never,\n> {\n  design?: Design\n  intent?: Exclude<TagStylesProps['intent'], K>\n  ref?: Ref<HTMLButtonElement>\n}\n\nexport type ValidTagDesignIntent =\n  | FilteredDesignIntent<'tinted', 'surface'>\n  | FilteredDesignIntent<'outlined', 'surface'>\n  | FilteredDesignIntent<'filled'>\n\nexport type TagProps = BaseTagProps & ValidTagDesignIntent\n\nexport const Tag = ({\n  design = 'filled',\n  intent = 'support',\n  size = 'md',\n  shape = 'pill',\n  asChild,\n  className,\n  ref,\n  ...others\n}: TagProps) => {\n  const Component = asChild ? Slot : 'span'\n\n  return (\n    <Component\n      data-spark-component=\"tag\"\n      ref={ref}\n      className={tagStyles({\n        className,\n        design,\n        intent,\n        size,\n        shape,\n      })}\n      {...others}\n    />\n  )\n}\n"],"names":["filledVariants","tw","outlinedVariants","tintedVariants","tagStyles","cva","makeVariants","Tag","design","intent","size","shape","asChild","className","ref","others","jsx","Slot"],"mappings":"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"}

package/dist/tag/variants/filled.d.ts

@@ -10,10 +10,6 @@ export declare const filledVariants: readonly [{
     readonly intent: "accent";
     readonly design: "filled";
     readonly class: string[];
-}, {
-    readonly intent: "basic";
-    readonly design: "filled";
-    readonly class: string[];
 }, {
     readonly intent: "success";
     readonly design: "filled";

package/dist/tag/variants/outlined.d.ts

@@ -10,10 +10,6 @@ export declare const outlinedVariants: readonly [{
     readonly intent: "accent";
     readonly design: "outlined";
     readonly class: string[];
-}, {
-    readonly intent: "basic";
-    readonly design: "outlined";
-    readonly class: string[];
 }, {
     readonly intent: "success";
     readonly design: "outlined";

package/dist/tag/variants/tinted.d.ts

@@ -10,10 +10,6 @@ export declare const tintedVariants: readonly [{
     readonly intent: "accent";
     readonly design: "tinted";
     readonly class: string[];
-}, {
-    readonly intent: "basic";
-    readonly design: "tinted";
-    readonly class: string[];
 }, {
     readonly intent: "success";
     readonly design: "tinted";

package/dist/text-link/TextLink.d.ts

@@ -1,7 +1,7 @@
 import { VariantProps } from 'class-variance-authority';
 import { ComponentPropsWithRef } from 'react';
 declare const textLinkStyles: (props?: ({
-    intent?: "main" | "current" | "alert" | "support" | "accent" | "basic" | "success" | "info" | "neutral" | "danger" | null | undefined;
+    intent?: "main" | "current" | "alert" | "support" | "accent" | "success" | "info" | "neutral" | "danger" | null | undefined;
     bold?: boolean | null | undefined;
     underline?: boolean | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;

package/dist/text-link/index.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../TextLink-C3xDLsbC.js");exports.TextLink=e.TextLink;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../TextLink-5MvP0P8D.js");exports.TextLink=e.TextLink;
 //# sourceMappingURL=index.js.map

package/dist/text-link/index.mjs

@@ -1,4 +1,4 @@
-import { T as r } from "../TextLink-D7mOCjY_.mjs";
+import { T as r } from "../TextLink-Cc_LeVcx.mjs";
 export {
   r as TextLink
 };

package/dist/toast/Toast.styles.d.ts

@@ -1,7 +1,7 @@
 import { VariantProps } from 'class-variance-authority';
 export declare const toastStyles: (props?: ({
     design?: "filled" | "tinted" | null | undefined;
-    intent?: "main" | "alert" | "error" | "support" | "accent" | "basic" | "success" | "info" | "neutral" | "surface" | "surfaceInverse" | null | undefined;
+    intent?: "main" | "alert" | "error" | "support" | "accent" | "success" | "info" | "neutral" | "surface" | "surfaceInverse" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 export declare const snackbarItemVariantContent: (props?: ({
     actionOnNewline?: boolean | null | undefined;

package/dist/toast/index.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),r=require("@base-ui/react/toast"),_=require("../Slot-DQ8z2zsy.js"),c=require("class-variance-authority"),I=require("../Button-B6rA3-e5.js"),w=require("../Icon-CF0W0LKr.js"),N=require("../IconButton-D3g86WpZ.js"),q=require("@spark-ui/icons/AlertFill"),C=require("@spark-ui/icons/Close"),h=require("@spark-ui/icons/InfoFill"),P=require("@spark-ui/icons/ValidFill"),M=require("@spark-ui/icons/WarningFill"),D=require("react");function F(e){const s=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const n in e)if(n!=="default"){const l=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(s,n,l.get?l:{enumerable:!0,get:()=>e[n]})}}return s.default=e,Object.freeze(s)}const B=F(D),O=c.cva(["gap-lg p-md flex w-max !w-[min(400px,calc(100vw-2rem))] flex-col rounded-lg border-md","absolute right-0 bottom-0 left-auto mr-0","bg-clip-padding shadow-md select-none","focus-visible:ring-focus focus-visible:ring-2 focus-visible:outline-none","z-[calc(1000-var(--toast-index))]","after:absolute after:bottom-full after:left-0 after:h-[calc(var(--gap)+1px)] after:w-full after:content-['']","[transform:translateX(var(--toast-swipe-movement-x))_translateY(calc(var(--toast-swipe-movement-y)+calc(min(var(--toast-index),10)*-16px)))_scale(calc(max(0,1-(var(--toast-index)*0.1))))]","ease-standard [transition-property:opacity,transform]","duration-400","data-[starting-style]:[transform:translateY(150%)]","data-[expanded]:[transform:translateX(var(--toast-swipe-movement-x))_translateY(calc(var(--toast-offset-y)*-1+calc(var(--toast-index)*var(--gap)*-1)+var(--toast-swipe-movement-y)))]","data-[ending-style]:duration-250","data-[ending-style]:opacity-0","data-[ending-style]:data-[swipe-direction=down]:[transform:translateY(calc(var(--toast-swipe-movement-y)+150%))]","data-[ending-style]:data-[swipe-direction=right]:[transform:translateX(calc(var(--toast-swipe-movement-x)+150%))_translateY(var(--offset-y))]","data-[expanded]:data-[ending-style]:data-[swipe-direction=right]:[transform:translateX(calc(var(--toast-swipe-movement-x)+150%))_translateY(var(--offset-y))]","data-[limited]:opacity-0"],{variants:{design:{filled:"",tinted:""},intent:{success:"",alert:"",error:"",info:"",neutral:"",main:"",basic:"",support:"",accent:"",surface:"",surfaceInverse:""}},compoundVariants:[{design:"filled",intent:"success",class:["bg-success text-on-success border-success"]},{design:"filled",intent:"alert",class:["bg-alert text-on-alert border-alert"]},{design:"filled",intent:"error",class:["bg-error text-on-error border-error"]},{design:"filled",intent:"info",class:["bg-info text-on-info border-info"]},{design:"filled",intent:"neutral",class:["bg-neutral text-on-neutral border-neutral"]},{design:"filled",intent:"main",class:["bg-main text-on-main border-main"]},{design:"filled",intent:"basic",class:["bg-basic text-on-basic border-basic"]},{design:"filled",intent:"support",class:["bg-support text-on-support border-support"]},{design:"filled",intent:"accent",class:["bg-accent text-on-accent border-accent"]},{design:"filled",intent:"surface",class:["bg-surface text-on-surface border-surface"]},{design:"filled",intent:"surfaceInverse",class:["bg-surface-inverse text-on-surface-inverse border-surface-inverse"]},{design:"tinted",intent:"success",class:["bg-success-container text-on-success-container border-success"]},{design:"tinted",intent:"alert",class:["bg-alert-container text-on-alert-container border-alert"]},{design:"tinted",intent:"error",class:["bg-error-container text-on-error-container border-error"]},{design:"tinted",intent:"info",class:["bg-info-container text-on-info-container border-info"]},{design:"tinted",intent:"neutral",class:["bg-neutral-container text-on-neutral-container border-neutral"]},{design:"tinted",intent:"main",class:["bg-main-container text-on-main-container border-main"]},{design:"tinted",intent:"basic",class:["bg-basic-container text-on-basic-container border-basic"]},{design:"tinted",intent:"support",class:["bg-support-container text-on-support-container border-support"]},{design:"tinted",intent:"accent",class:["bg-accent-container text-on-accent-container border-accent"]},{design:"tinted",intent:"surface",class:["bg-surface text-on-surface border-surface"]},{design:"tinted",intent:"surfaceInverse",class:["bg-surface-inverse text-on-surface-inverse border-surface-inverse"]}],defaultVariants:{design:"filled",intent:"neutral"}});c.cva(["inline-grid items-center","col-start-1 row-start-1","pl-md pr-lg"],{variants:{actionOnNewline:{true:["grid-rows-[52px_1fr_52px]","grid-cols-[min-content_1fr_min-content]","[grid-template-areas:'icon_message_close'_'._message_.'_'action_action_action']"],false:["grid-cols-[min-content_1fr_min-content_min-content]","[grid-template-areas:'icon_message_action_close']"]}},defaultVariants:{actionOnNewline:!1}});function A(e){return e==="surfaceInverse"?"surface":e==="surface"?"surfaceInverse":e==="error"?"danger":e}function S(e){return e==="surfaceInverse"?"surfaceInverse":e==="surface"?"surface":e==="error"?"danger":e}const V=(e,{toastDesign:s,toastIntent:n})=>{if(!e)return{};const{design:l,intent:i,className:d,onClick:u,...o}=e;return{design:l??s,intent:i??A(n),className:c.cx("ml-auto",d),onClick:u,...o}},Y=(e,s,n)=>({swipeDirection:["down","right"],toast:e,className:c.cx(O({design:s,intent:n})),style:{"--gap":"var(--spacing-md)","--offset-y":"calc(var(--toast-offset-y) * -1 + (var(--toast-index) * var(--gap) * -1) + var(--toast-swipe-movement-y))"}});function z(e){switch(e){case"info":return t.jsx(h.InfoFill,{});case"success":return t.jsx(P.ValidFill,{});case"alert":return t.jsx(M.WarningFill,{});case"error":return t.jsx(q.AlertFill,{});case"main":case"support":case"accent":case"basic":case"neutral":case"surface":case"surfaceInverse":default:return t.jsx(h.InfoFill,{})}}function R({toast:e}){const{icon:s,intent:n="info",design:l,action:i,isClosable:d,closeLabel:u="Close",compact:o=!1}=e.data??{},f="tinted",g=i?.close?r.Toast.Close:r.Toast.Action,p=V(i,{toastDesign:f,toastIntent:n}),x=Y(e,f,n),b=s??z(n),m=a=>d?t.jsx(r.Toast.Close,{className:a,render:t.jsx(N.IconButton,{"aria-label":u,design:f,intent:S(n),size:"md"}),children:t.jsx(w.Icon,{children:t.jsx(C.Close,{})})}):null,v=()=>{const a=e.data?.title??e.title,y=!!(e.data?.description??e.description);return typeof a!="string"&&a!==void 0?t.jsx(r.Toast.Title,{className:y?"text-headline-2":"text-body-1",render:t.jsx("div",{}),children:a}):t.jsx(r.Toast.Title,{className:y?"text-headline-2":"text-body-1"})},T=()=>{const a=e.data?.description??e.description;return a?typeof a!="string"?t.jsx(r.Toast.Description,{className:"text-body-1",render:t.jsx("div",{}),children:a}):t.jsx(r.Toast.Description,{className:"text-body-1"}):null};return t.jsx(r.Toast.Root,{...x,children:t.jsxs("div",{className:c.cx("flex",o?"gap-lg items-center":"gap-md flex-col"),children:[t.jsxs("div",{className:"gap-lg p-md flex grow items-center",children:[t.jsx(w.Icon,{size:"md",children:b}),t.jsxs("div",{className:c.cx("gap-sm flex flex-col",o&&"flex-1",!o&&d&&"pr-3xl"),children:[v(),T()]})]}),t.jsxs("div",{className:c.cx("flex"),children:[i&&t.jsx(g,{render:t.jsx(I.Button,{...p}),children:i.label}),o&&m()]}),!o&&m("top-md right-md absolute")]})},e.id)}function j(){const e=r.Toast.useToastManager(),s=B.useCallback(()=>{e.toasts.forEach(({id:n})=>e.close(n))},[e]);return{...e,closeAll:s}}function k(){const{toasts:e}=j();return e.map(s=>t.jsx(R,{toast:s},s.id))}function X({children:e,limit:s=3,...n}){return t.jsxs(r.Toast.Provider,{limit:s,...n,children:[t.jsx(r.Toast.Portal,{children:t.jsx(r.Toast.Viewport,{className:c.cx("z-toast right-lg bottom-lg text-on-surfa- fixed top-auto mx-auto flex w-fit flex-col items-end"),children:t.jsx(k,{})})}),e]})}function L({children:e,onClick:s,asChild:n=!1,title:l,description:i,timeout:d=5e3,design:u="filled",intent:o="neutral",isClosable:f=!0,icon:g,action:p,compact:x,priority:b="low"}){const m=j(),v=n?_.Slot:"button";function T(a){s?.(a),m.add({title:l,description:i,timeout:d,priority:b,data:{design:u,intent:o,isClosable:f,...g&&{icon:g},action:p,...x!==void 0&&{compact:x}}})}return t.jsx(v,{...!n&&{type:"button"},onClick:T,children:e})}const W=r.Toast.createToastManager;exports.ToastProvider=X;exports.ToastTrigger=L;exports.createToastManager=W;exports.useToastManager=j;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),s=require("@base-ui/react/toast"),_=require("../Slot-DQ8z2zsy.js"),c=require("class-variance-authority"),I=require("../Button-FZceRWG2.js"),w=require("../Icon-C-cNTnzd.js"),N=require("../IconButton-BR1bJSQA.js"),q=require("@spark-ui/icons/AlertFill"),C=require("@spark-ui/icons/Close"),h=require("@spark-ui/icons/InfoFill"),P=require("@spark-ui/icons/ValidFill"),M=require("@spark-ui/icons/WarningFill"),D=require("react");function F(e){const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const n in e)if(n!=="default"){const l=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(r,n,l.get?l:{enumerable:!0,get:()=>e[n]})}}return r.default=e,Object.freeze(r)}const B=F(D),O=c.cva(["gap-lg p-md flex w-max !w-[min(400px,calc(100vw-2rem))] flex-col rounded-lg border-md","absolute right-0 bottom-0 left-auto mr-0","bg-clip-padding shadow-md select-none","focus-visible:ring-focus focus-visible:ring-2 focus-visible:outline-none","z-[calc(1000-var(--toast-index))]","after:absolute after:bottom-full after:left-0 after:h-[calc(var(--gap)+1px)] after:w-full after:content-['']","[transform:translateX(var(--toast-swipe-movement-x))_translateY(calc(var(--toast-swipe-movement-y)+calc(min(var(--toast-index),10)*-16px)))_scale(calc(max(0,1-(var(--toast-index)*0.1))))]","ease-standard [transition-property:opacity,transform]","duration-400","data-[starting-style]:[transform:translateY(150%)]","data-[expanded]:[transform:translateX(var(--toast-swipe-movement-x))_translateY(calc(var(--toast-offset-y)*-1+calc(var(--toast-index)*var(--gap)*-1)+var(--toast-swipe-movement-y)))]","data-[ending-style]:duration-250","data-[ending-style]:opacity-0","data-[ending-style]:data-[swipe-direction=down]:[transform:translateY(calc(var(--toast-swipe-movement-y)+150%))]","data-[ending-style]:data-[swipe-direction=right]:[transform:translateX(calc(var(--toast-swipe-movement-x)+150%))_translateY(var(--offset-y))]","data-[expanded]:data-[ending-style]:data-[swipe-direction=right]:[transform:translateX(calc(var(--toast-swipe-movement-x)+150%))_translateY(var(--offset-y))]","data-[limited]:opacity-0"],{variants:{design:{filled:"",tinted:""},intent:{success:"",alert:"",error:"",info:"",neutral:"",main:"",support:"",accent:"",surface:"",surfaceInverse:""}},compoundVariants:[{design:"filled",intent:"success",class:["bg-success text-on-success border-success"]},{design:"filled",intent:"alert",class:["bg-alert text-on-alert border-alert"]},{design:"filled",intent:"error",class:["bg-error text-on-error border-error"]},{design:"filled",intent:"info",class:["bg-info text-on-info border-info"]},{design:"filled",intent:"neutral",class:["bg-neutral text-on-neutral border-neutral"]},{design:"filled",intent:"main",class:["bg-main text-on-main border-main"]},{design:"filled",intent:"support",class:["bg-support text-on-support border-support"]},{design:"filled",intent:"accent",class:["bg-accent text-on-accent border-accent"]},{design:"filled",intent:"surface",class:["bg-surface text-on-surface border-surface"]},{design:"filled",intent:"surfaceInverse",class:["bg-surface-inverse text-on-surface-inverse border-surface-inverse"]},{design:"tinted",intent:"success",class:["bg-success-container text-on-success-container border-success"]},{design:"tinted",intent:"alert",class:["bg-alert-container text-on-alert-container border-alert"]},{design:"tinted",intent:"error",class:["bg-error-container text-on-error-container border-error"]},{design:"tinted",intent:"info",class:["bg-info-container text-on-info-container border-info"]},{design:"tinted",intent:"neutral",class:["bg-neutral-container text-on-neutral-container border-neutral"]},{design:"tinted",intent:"main",class:["bg-main-container text-on-main-container border-main"]},{design:"tinted",intent:"support",class:["bg-support-container text-on-support-container border-support"]},{design:"tinted",intent:"accent",class:["bg-accent-container text-on-accent-container border-accent"]},{design:"tinted",intent:"surface",class:["bg-surface text-on-surface border-surface"]},{design:"tinted",intent:"surfaceInverse",class:["bg-surface-inverse text-on-surface-inverse border-surface-inverse"]}],defaultVariants:{design:"filled",intent:"neutral"}});c.cva(["inline-grid items-center","col-start-1 row-start-1","pl-md pr-lg"],{variants:{actionOnNewline:{true:["grid-rows-[52px_1fr_52px]","grid-cols-[min-content_1fr_min-content]","[grid-template-areas:'icon_message_close'_'._message_.'_'action_action_action']"],false:["grid-cols-[min-content_1fr_min-content_min-content]","[grid-template-areas:'icon_message_action_close']"]}},defaultVariants:{actionOnNewline:!1}});function A(e){return e==="surfaceInverse"?"surface":e==="surface"?"surfaceInverse":e==="error"?"danger":e}function S(e){return e==="surfaceInverse"?"surfaceInverse":e==="surface"?"surface":e==="error"?"danger":e}const V=(e,{toastDesign:r,toastIntent:n})=>{if(!e)return{};const{design:l,intent:i,className:d,onClick:u,...o}=e;return{design:l??r,intent:i??A(n),className:c.cx("ml-auto",d),onClick:u,...o}},Y=(e,r,n)=>({swipeDirection:["down","right"],toast:e,className:c.cx(O({design:r,intent:n})),style:{"--gap":"var(--spacing-md)","--offset-y":"calc(var(--toast-offset-y) * -1 + (var(--toast-index) * var(--gap) * -1) + var(--toast-swipe-movement-y))"}});function z(e){switch(e){case"info":return t.jsx(h.InfoFill,{});case"success":return t.jsx(P.ValidFill,{});case"alert":return t.jsx(M.WarningFill,{});case"error":return t.jsx(q.AlertFill,{});case"main":case"support":case"accent":case"neutral":case"surface":case"surfaceInverse":default:return t.jsx(h.InfoFill,{})}}function R({toast:e}){const{icon:r,intent:n="info",design:l,action:i,isClosable:d,closeLabel:u="Close",compact:o=!1}=e.data??{},f="tinted",g=i?.close?s.Toast.Close:s.Toast.Action,p=V(i,{toastDesign:f,toastIntent:n}),x=Y(e,f,n),b=r??z(n),m=a=>d?t.jsx(s.Toast.Close,{className:a,render:t.jsx(N.IconButton,{"aria-label":u,design:f,intent:S(n),size:"md"}),children:t.jsx(w.Icon,{children:t.jsx(C.Close,{})})}):null,v=()=>{const a=e.data?.title??e.title,y=!!(e.data?.description??e.description);return typeof a!="string"&&a!==void 0?t.jsx(s.Toast.Title,{className:y?"text-headline-2":"text-body-1",render:t.jsx("div",{}),children:a}):t.jsx(s.Toast.Title,{className:y?"text-headline-2":"text-body-1"})},T=()=>{const a=e.data?.description??e.description;return a?typeof a!="string"?t.jsx(s.Toast.Description,{className:"text-body-1",render:t.jsx("div",{}),children:a}):t.jsx(s.Toast.Description,{className:"text-body-1"}):null};return t.jsx(s.Toast.Root,{...x,children:t.jsxs("div",{className:c.cx("flex",o?"gap-lg items-center":"gap-md flex-col"),children:[t.jsxs("div",{className:"gap-lg p-md flex grow items-center",children:[t.jsx(w.Icon,{size:"md",children:b}),t.jsxs("div",{className:c.cx("gap-sm flex flex-col",o&&"flex-1",!o&&d&&"pr-3xl"),children:[v(),T()]})]}),t.jsxs("div",{className:c.cx("flex"),children:[i&&t.jsx(g,{render:t.jsx(I.Button,{...p}),children:i.label}),o&&m()]}),!o&&m("top-md right-md absolute")]})},e.id)}function j(){const e=s.Toast.useToastManager(),r=B.useCallback(()=>{e.toasts.forEach(({id:n})=>e.close(n))},[e]);return{...e,closeAll:r}}function k(){const{toasts:e}=j();return e.map(r=>t.jsx(R,{toast:r},r.id))}function X({children:e,limit:r=3,...n}){return t.jsxs(s.Toast.Provider,{limit:r,...n,children:[t.jsx(s.Toast.Portal,{children:t.jsx(s.Toast.Viewport,{className:c.cx("z-toast right-lg bottom-lg text-on-surfa- fixed top-auto mx-auto flex w-fit flex-col items-end"),children:t.jsx(k,{})})}),e]})}function L({children:e,onClick:r,asChild:n=!1,title:l,description:i,timeout:d=5e3,design:u="filled",intent:o="neutral",isClosable:f=!0,icon:g,action:p,compact:x,priority:b="low"}){const m=j(),v=n?_.Slot:"button";function T(a){r?.(a),m.add({title:l,description:i,timeout:d,priority:b,data:{design:u,intent:o,isClosable:f,...g&&{icon:g},action:p,...x!==void 0&&{compact:x}}})}return t.jsx(v,{...!n&&{type:"button"},onClick:T,children:e})}const W=s.Toast.createToastManager;exports.ToastProvider=X;exports.ToastTrigger=L;exports.createToastManager=W;exports.useToastManager=j;
 //# sourceMappingURL=index.js.map