@spark-ui/components 17.13.2 → 17.14.0

package/dist/accordion/Accordion.d.ts

@@ -16,6 +16,11 @@ export interface AccordionProps extends ExtentedBaseUIInterface {
      */
     multiple?: boolean;
     design?: 'filled' | 'outlined';
+    /**
+     * Change the color scheme of the accordion
+     * @default surface
+     */
+    intent?: 'surface' | 'support';
     ref?: Ref<HTMLDivElement>;
     /**
      * The controlled value (always an array of strings)
@@ -30,11 +35,12 @@ export interface AccordionProps extends ExtentedBaseUIInterface {
      */
     onValueChange?: (value: string[]) => void;
 }
-export declare function Accordion({ asChild, children, design, hiddenUntilFound, multiple, className, ref, value, defaultValue, onValueChange, ...props }: AccordionProps): import("react/jsx-runtime").JSX.Element;
+export declare function Accordion({ asChild, children, design, intent, hiddenUntilFound, multiple, className, ref, value, defaultValue, onValueChange, ...props }: AccordionProps): import("react/jsx-runtime").JSX.Element;
 export declare namespace Accordion {
     var displayName: string;
 }
 export declare const useAccordionContext: () => {
     design: "filled" | "outlined";
+    intent: "surface" | "support";
 };
 export {};

package/dist/accordion/index.js

@@ -1,2 +1,2 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`../chunk-C91j1N6u.js`);const e=require(`../slot/index.js`),t=require(`../icon-CRPcdgYp.js`);let n=require(`@base-ui/react/accordion`),r=require(`class-variance-authority`),i=require(`react`),a=require(`react/jsx-runtime`),o=require(`@spark-ui/icons/ArrowHorizontalDown`);function s(t,n){let r=t?e.Slot:n;return t?({...e})=>(0,a.jsx)(r,{...e}):void 0}var c=(0,i.createContext)(null);function l({asChild:e=!1,children:t,design:i=`outlined`,hiddenUntilFound:o=!0,multiple:l=!1,className:u,ref:d,value:f,defaultValue:p,onValueChange:m,...h}){let g=s(e,`div`),_=m?e=>{m(Array.isArray(e)?e:[e])}:void 0;return(0,a.jsx)(c,{value:{design:i},children:(0,a.jsx)(n.Accordion.Root,{"data-spark-component":`accordion`,ref:d,multiple:l,hiddenUntilFound:o,className:(0,r.cx)(`bg-surface h-fit rounded-lg`,u),render:g,value:f,defaultValue:p,onValueChange:_,...h,children:t})})}l.displayName=`Accordion`;var u=()=>{let e=(0,i.useContext)(c);if(!e)throw Error(`useAccordionContext must be used within a Accordion provider`);return e},d=({asChild:e=!1,className:t,children:i,ref:o,...c})=>{let l=u(),d=s(e,`div`);return(0,a.jsx)(n.Accordion.Item,{ref:o,"data-spark-component":`accordion-item`,render:d,className:(0,r.cx)(`relative first:rounded-t-lg last:rounded-b-lg`,`not-last:border-b-0`,{"border-sm border-outline":l.design===`outlined`},t),...c,children:i})};d.displayName=`Accordion.Item`;var f=({asChild:e=!1,className:t,children:i,ref:o,...c})=>{let l=s(e,`div`);return(0,a.jsx)(n.Accordion.Panel,{ref:o,"data-spark-component":`accordion-item-content`,className:(0,r.cx)(`[&>:first-child]:p-lg overflow-hidden`,`h-[var(--accordion-panel-height)] transition-all duration-200 data-[ending-style]:h-0 data-[starting-style]:h-0`,`text-body-1 text-on-surface`,t),render:l,...c,children:i})};f.displayName=`Accordion.ItemContent`;var p=({asChild:t=!1,children:n,className:i,ref:o})=>(0,a.jsx)(t?e.Slot:`h3`,{ref:o,"data-spark-component":`accordion-item-header`,className:(0,r.cx)(`rounded-[inherit]`,i),children:n});p.displayName=`Accordion.ItemHeader`;var m=({asChild:e=!1,children:i,className:c,ref:l,...u})=>{let d=s(e,`button`);return(0,a.jsxs)(n.Accordion.Trigger,{ref:l,"data-spark-component":`accordion-item-trigger`,render:d,className:(0,r.cx)(`group`,`gap-lg min-h-sz-48 relative flex items-center justify-between`,`px-lg py-md text-headline-2 text-on-surface data-[panel-open]:rounded-b-0 w-full rounded-[inherit] text-left`,`hover:enabled:bg-surface-hovered focus:bg-surface-hovered`,`focus-visible:u-outline focus-visible:z-raised focus-visible:outline-hidden`,`disabled:opacity-dim-3 cursor-pointer disabled:cursor-not-allowed`,c),...u,children:[(0,a.jsx)(`div`,{className:`gap-lg flex grow items-center`,children:i}),(0,a.jsx)(t.t,{intent:`neutral`,className:(0,r.cx)(`shrink-0 rotate-0 duration-100 ease-in motion-reduce:transition-none`,`group-data-[panel-open]:rotate-180`),size:`sm`,children:(0,a.jsx)(o.ArrowHorizontalDown,{})})]})};m.displayName=`Accordion.ItemTrigger`;var h=Object.assign(l,{Item:d,ItemHeader:p,ItemTrigger:m,ItemContent:f});h.displayName=`Accordion`,d.displayName=`Item`,p.displayName=`ItemHeader`,m.displayName=`Accordion.Trigger`,f.displayName=`Accordion.Content`,exports.Accordion=h;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`../chunk-C91j1N6u.js`);const e=require(`../slot/index.js`),t=require(`../icon-CRPcdgYp.js`);let n=require(`@base-ui/react/accordion`),r=require(`class-variance-authority`),i=require(`react`),a=require(`react/jsx-runtime`),o=require(`@spark-ui/icons/ArrowHorizontalDown`);function s(t,n){let r=t?e.Slot:n;return t?({...e})=>(0,a.jsx)(r,{...e}):void 0}var c=(0,i.createContext)(null);function l({asChild:e=!1,children:t,design:i=`outlined`,intent:o=`surface`,hiddenUntilFound:l=!0,multiple:u=!1,className:d,ref:f,value:p,defaultValue:m,onValueChange:h,...g}){let _=s(e,`div`),v=h?e=>{h(Array.isArray(e)?e:[e])}:void 0;return(0,a.jsx)(c,{value:{design:i,intent:o},children:(0,a.jsx)(n.Accordion.Root,{"data-spark-component":`accordion`,ref:f,multiple:u,hiddenUntilFound:l,className:(0,r.cx)(`bg-surface h-fit rounded-lg`,d),render:_,value:p,defaultValue:m,onValueChange:v,...g,children:t})})}l.displayName=`Accordion`;var u=()=>{let e=(0,i.useContext)(c);if(!e)throw Error(`useAccordionContext must be used within a Accordion provider`);return e},d=({asChild:e=!1,className:t,children:i,ref:o,...c})=>{let l=u(),d=s(e,`div`);return(0,a.jsx)(n.Accordion.Item,{ref:o,"data-spark-component":`accordion-item`,render:d,className:(0,r.cx)(`relative first:rounded-t-lg last:rounded-b-lg`,`not-last:border-b-0`,{"border-sm border-outline":l.design===`outlined`},t),...c,children:i})};d.displayName=`Accordion.Item`;var f=({asChild:e=!1,className:t,children:i,ref:o,...c})=>{let l=s(e,`div`);return(0,a.jsx)(n.Accordion.Panel,{ref:o,"data-spark-component":`accordion-item-content`,className:(0,r.cx)(`[&>:first-child]:p-lg overflow-hidden`,`h-[var(--accordion-panel-height)] transition-all duration-200 data-[ending-style]:h-0 data-[starting-style]:h-0`,`text-body-1 text-on-surface`,t),render:l,...c,children:i})};f.displayName=`Accordion.ItemContent`;var p=({asChild:t=!1,children:n,className:i,ref:o})=>(0,a.jsx)(t?e.Slot:`h3`,{ref:o,"data-spark-component":`accordion-item-header`,className:(0,r.cx)(`rounded-[inherit]`,i),children:n});p.displayName=`Accordion.ItemHeader`;var m=({asChild:e=!1,children:i,className:c,ref:l,...d})=>{let f=s(e,`button`),{intent:p}=u();return(0,a.jsxs)(n.Accordion.Trigger,{ref:l,"data-spark-component":`accordion-item-trigger`,render:f,className:(0,r.cx)(`group`,`gap-lg min-h-sz-48 relative flex items-center justify-between`,`px-lg py-md text-headline-2 data-panel-open:rounded-b-0 w-full rounded-[inherit] text-left`,`focus-visible:u-outline focus-visible:z-raised focus-visible:outline-hidden`,`data-disabled:opacity-dim-3 cursor-pointer data-disabled:cursor-not-allowed`,p===`surface`&&`bg-surface text-on-surface hover:enabled:bg-surface-hovered focus:bg-surface-hovered`,p===`support`&&`bg-support-container text-on-support-container hover:enabled:bg-support-container-hovered focus:bg-support-container-hovered`,c),...d,children:[(0,a.jsx)(`div`,{className:`gap-lg flex grow items-center`,children:i}),(0,a.jsx)(t.t,{intent:`neutral`,className:(0,r.cx)(`shrink-0 rotate-0 duration-100 ease-in motion-reduce:transition-none`,`group-data-panel-open:rotate-180`),size:`sm`,children:(0,a.jsx)(o.ArrowHorizontalDown,{})})]})};m.displayName=`Accordion.ItemTrigger`;var h=Object.assign(l,{Item:d,ItemHeader:p,ItemTrigger:m,ItemContent:f});h.displayName=`Accordion`,d.displayName=`Item`,p.displayName=`ItemHeader`,m.displayName=`Accordion.Trigger`,f.displayName=`Accordion.Content`,exports.Accordion=h;
 //# sourceMappingURL=index.js.map

package/dist/accordion/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../src/accordion/useRenderSlot.tsx","../../src/accordion/Accordion.tsx","../../src/accordion/AccordionItem.tsx","../../src/accordion/AccordionItemContent.tsx","../../src/accordion/AccordionItemHeader.tsx","../../src/accordion/AccordionItemTrigger.tsx","../../src/accordion/index.ts"],"sourcesContent":["import { Slot } from '../slot'\n\nexport function useRenderSlot(asChild: boolean, defaultTag: string) {\n  const Component = asChild ? Slot : defaultTag\n\n  return asChild ? ({ ...props }) => <Component {...props} /> : undefined\n}\n","import { Accordion as BaseAccordion } from '@base-ui/react/accordion'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, createContext, Ref, useContext } from 'react'\n\nimport { useRenderSlot } from './useRenderSlot'\n\ntype BaseAccordionRootProps = ComponentProps<typeof BaseAccordion.Root<string | string[]>>\n\ntype ExtentedBaseUIInterface = Omit<\n  BaseAccordionRootProps,\n  'multiple' | 'render' | 'value' | 'defaultValue' | 'onValueChange'\n>\n\nexport interface AccordionProps extends ExtentedBaseUIInterface {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild?: boolean\n  /**\n   * Whether the accordion items are disabled\n   */\n  disabled?: boolean\n  /**\n   * Whether multiple items can be open at the same time.\n   */\n  multiple?: boolean\n  design?: 'filled' | 'outlined'\n  ref?: Ref<HTMLDivElement>\n  /**\n   * The controlled value (always an array of strings)\n   */\n  value?: string[]\n  /**\n   * The default value (always an array of strings)\n   */\n  defaultValue?: string[]\n  /**\n   * Callback when the value changes (always receives an array of strings)\n   */\n  onValueChange?: (value: string[]) => void\n}\n\nconst AccordionContext = createContext<{\n  design: 'filled' | 'outlined'\n} | null>(null)\n\nexport function Accordion({\n  asChild = false,\n  children,\n  design = 'outlined',\n  hiddenUntilFound = true,\n  multiple = false,\n  className,\n  ref,\n  value,\n  defaultValue,\n  onValueChange,\n  ...props\n}: AccordionProps) {\n  const renderSlot = useRenderSlot(asChild, 'div')\n\n  // Wrap the onValueChange to always provide string[]\n  const handleValueChange = onValueChange\n    ? (newValue: string | string[]) => {\n        // Base UI returns string when multiple=false, string[] when multiple=true\n        // We normalize to always return string[]\n        const normalizedValue = Array.isArray(newValue) ? newValue : [newValue]\n        onValueChange(normalizedValue)\n      }\n    : undefined\n\n  return (\n    <AccordionContext value={{ design }}>\n      <BaseAccordion.Root\n        data-spark-component=\"accordion\"\n        ref={ref}\n        multiple={multiple}\n        hiddenUntilFound={hiddenUntilFound}\n        className={cx('bg-surface h-fit rounded-lg', className)}\n        render={renderSlot}\n        value={value as any}\n        defaultValue={defaultValue as any}\n        onValueChange={handleValueChange as any}\n        {...props}\n      >\n        {children}\n      </BaseAccordion.Root>\n    </AccordionContext>\n  )\n}\n\nAccordion.displayName = 'Accordion'\n\nexport const useAccordionContext = () => {\n  const context = useContext(AccordionContext)\n\n  if (!context) {\n    throw Error('useAccordionContext must be used within a Accordion provider')\n  }\n\n  return context\n}\n","import { Accordion as BaseAccordion } from '@base-ui/react/accordion'\nimport { cx } from 'class-variance-authority'\nimport { type ComponentProps, Ref } from 'react'\n\nimport { useAccordionContext } from './Accordion'\nimport { useRenderSlot } from './useRenderSlot'\n\ntype ExtentedZagInterface = Omit<ComponentProps<typeof BaseAccordion.Item>, 'render'>\n\nexport interface AccordionItemProps extends ExtentedZagInterface {\n  asChild?: boolean\n  ref?: Ref<HTMLDivElement>\n}\n\n/**\n * Groups an accordion header with the corresponding panel. Renders a <div> element.\n */\nexport const Item = ({\n  asChild = false,\n  className,\n  children,\n  ref,\n  ...props\n}: AccordionItemProps) => {\n  const accordion = useAccordionContext()\n\n  const renderSlot = useRenderSlot(asChild, 'div')\n\n  return (\n    <BaseAccordion.Item\n      ref={ref}\n      data-spark-component=\"accordion-item\"\n      render={renderSlot}\n      className={cx(\n        'relative first:rounded-t-lg last:rounded-b-lg',\n        'not-last:border-b-0',\n        { 'border-sm border-outline': accordion.design === 'outlined' },\n        className\n      )}\n      {...props}\n    >\n      {children}\n    </BaseAccordion.Item>\n  )\n}\n\nItem.displayName = 'Accordion.Item'\n","import { Accordion as BaseAccordion } from '@base-ui/react/accordion'\nimport { cx } from 'class-variance-authority'\nimport { type ComponentProps, Ref } from 'react'\n\nimport { useRenderSlot } from './useRenderSlot'\n\ntype ExtentedZagInterface = Omit<ComponentProps<typeof BaseAccordion.Panel>, 'render'>\n\nexport interface AccordionItemContentProps extends ExtentedZagInterface {\n  asChild?: boolean\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const ItemContent = ({\n  asChild = false,\n  className,\n  children,\n  ref,\n  ...props\n}: AccordionItemContentProps) => {\n  const renderSlot = useRenderSlot(asChild, 'div')\n\n  return (\n    <BaseAccordion.Panel\n      ref={ref}\n      data-spark-component=\"accordion-item-content\"\n      className={cx(\n        '[&>:first-child]:p-lg overflow-hidden',\n        'h-[var(--accordion-panel-height)] transition-all duration-200 data-[ending-style]:h-0 data-[starting-style]:h-0',\n        'text-body-1 text-on-surface',\n        className\n      )}\n      render={renderSlot}\n      {...props}\n    >\n      {children}\n    </BaseAccordion.Panel>\n  )\n}\n\nItemContent.displayName = 'Accordion.ItemContent'\n","import { cx } from 'class-variance-authority'\nimport { type ComponentProps, Ref } from 'react'\n\nimport { Slot } from '../slot'\n\nexport interface AccordionItemHeaderProps extends ComponentProps<'h3'> {\n  asChild?: boolean\n  ref?: Ref<HTMLHeadingElement>\n}\n\nexport const ItemHeader = ({\n  asChild = false,\n  children,\n  className,\n  ref,\n}: AccordionItemHeaderProps) => {\n  const Component = asChild ? Slot : 'h3'\n\n  return (\n    <Component\n      ref={ref}\n      data-spark-component=\"accordion-item-header\"\n      className={cx('rounded-[inherit]', className)}\n    >\n      {children}\n    </Component>\n  )\n}\n\nItemHeader.displayName = 'Accordion.ItemHeader'\n","import { Accordion as BaseAccordion } from '@base-ui/react/accordion'\nimport { ArrowHorizontalDown } from '@spark-ui/icons/ArrowHorizontalDown'\nimport { cx } from 'class-variance-authority'\nimport { type ComponentProps, Ref } from 'react'\n\nimport { Icon } from '../icon'\nimport { useRenderSlot } from './useRenderSlot'\n\ntype ExtentedZagInterface = Omit<ComponentProps<typeof BaseAccordion.Trigger>, 'render'>\n\nexport interface AccordionItemTriggerProps extends ExtentedZagInterface {\n  asChild?: boolean\n  ref?: Ref<HTMLButtonElement>\n}\n\nexport const ItemTrigger = ({\n  asChild = false,\n  children,\n  className,\n  ref,\n  ...props\n}: AccordionItemTriggerProps) => {\n  const renderSlot = useRenderSlot(asChild, 'button')\n\n  return (\n    <BaseAccordion.Trigger\n      ref={ref}\n      data-spark-component=\"accordion-item-trigger\"\n      render={renderSlot}\n      className={cx(\n        'group',\n        'gap-lg min-h-sz-48 relative flex items-center justify-between',\n        'px-lg py-md text-headline-2 text-on-surface data-[panel-open]:rounded-b-0 w-full rounded-[inherit] text-left',\n        'hover:enabled:bg-surface-hovered focus:bg-surface-hovered',\n        'focus-visible:u-outline focus-visible:z-raised focus-visible:outline-hidden',\n        'disabled:opacity-dim-3 cursor-pointer disabled:cursor-not-allowed',\n        className\n      )}\n      {...props}\n    >\n      <div className=\"gap-lg flex grow items-center\">{children}</div>\n      <Icon\n        intent=\"neutral\"\n        className={cx(\n          'shrink-0 rotate-0 duration-100 ease-in motion-reduce:transition-none',\n          'group-data-[panel-open]:rotate-180'\n        )}\n        size=\"sm\"\n      >\n        <ArrowHorizontalDown />\n      </Icon>\n    </BaseAccordion.Trigger>\n  )\n}\n\nItemTrigger.displayName = 'Accordion.ItemTrigger'\n","import { Accordion as Root } from './Accordion'\nimport { Item } from './AccordionItem'\nimport { ItemContent } from './AccordionItemContent'\nimport { ItemHeader } from './AccordionItemHeader'\nimport { ItemTrigger } from './AccordionItemTrigger'\n\n/**\n * A vertically stacked set of expandable sections that allow users to show and hide content.\n */\nexport const Accordion: typeof Root & {\n  Item: typeof Item\n  ItemHeader: typeof ItemHeader\n  ItemTrigger: typeof ItemTrigger\n  ItemContent: typeof ItemContent\n} = Object.assign(Root, {\n  Item,\n  ItemHeader,\n  ItemTrigger,\n  ItemContent,\n})\n\nAccordion.displayName = 'Accordion'\nItem.displayName = 'Item'\nItemHeader.displayName = 'ItemHeader'\nItemTrigger.displayName = 'Accordion.Trigger'\nItemContent.displayName = 'Accordion.Content'\n\nexport { type AccordionProps } from './Accordion'\nexport { type AccordionItemHeaderProps } from './AccordionItemHeader'\nexport { type AccordionItemContentProps } from './AccordionItemContent'\nexport { type AccordionItemTriggerProps } from './AccordionItemTrigger'\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":[],"sources":["../../src/accordion/useRenderSlot.tsx","../../src/accordion/Accordion.tsx","../../src/accordion/AccordionItem.tsx","../../src/accordion/AccordionItemContent.tsx","../../src/accordion/AccordionItemHeader.tsx","../../src/accordion/AccordionItemTrigger.tsx","../../src/accordion/index.ts"],"sourcesContent":["import { Slot } from '../slot'\n\nexport function useRenderSlot(asChild: boolean, defaultTag: string) {\n  const Component = asChild ? Slot : defaultTag\n\n  return asChild ? ({ ...props }) => <Component {...props} /> : undefined\n}\n","import { Accordion as BaseAccordion } from '@base-ui/react/accordion'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, createContext, Ref, useContext } from 'react'\n\nimport { useRenderSlot } from './useRenderSlot'\n\ntype BaseAccordionRootProps = ComponentProps<typeof BaseAccordion.Root<string | string[]>>\n\ntype ExtentedBaseUIInterface = Omit<\n  BaseAccordionRootProps,\n  'multiple' | 'render' | 'value' | 'defaultValue' | 'onValueChange'\n>\n\nexport interface AccordionProps extends ExtentedBaseUIInterface {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild?: boolean\n  /**\n   * Whether the accordion items are disabled\n   */\n  disabled?: boolean\n  /**\n   * Whether multiple items can be open at the same time.\n   */\n  multiple?: boolean\n  design?: 'filled' | 'outlined'\n  /**\n   * Change the color scheme of the accordion\n   * @default surface\n   */\n  intent?: 'surface' | 'support'\n  ref?: Ref<HTMLDivElement>\n  /**\n   * The controlled value (always an array of strings)\n   */\n  value?: string[]\n  /**\n   * The default value (always an array of strings)\n   */\n  defaultValue?: string[]\n  /**\n   * Callback when the value changes (always receives an array of strings)\n   */\n  onValueChange?: (value: string[]) => void\n}\n\nconst AccordionContext = createContext<{\n  design: 'filled' | 'outlined'\n  intent: 'surface' | 'support'\n} | null>(null)\n\nexport function Accordion({\n  asChild = false,\n  children,\n  design = 'outlined',\n  intent = 'surface',\n  hiddenUntilFound = true,\n  multiple = false,\n  className,\n  ref,\n  value,\n  defaultValue,\n  onValueChange,\n  ...props\n}: AccordionProps) {\n  const renderSlot = useRenderSlot(asChild, 'div')\n\n  // Wrap the onValueChange to always provide string[]\n  const handleValueChange = onValueChange\n    ? (newValue: string | string[]) => {\n        // Base UI returns string when multiple=false, string[] when multiple=true\n        // We normalize to always return string[]\n        const normalizedValue = Array.isArray(newValue) ? newValue : [newValue]\n        onValueChange(normalizedValue)\n      }\n    : undefined\n\n  return (\n    <AccordionContext value={{ design, intent }}>\n      <BaseAccordion.Root\n        data-spark-component=\"accordion\"\n        ref={ref}\n        multiple={multiple}\n        hiddenUntilFound={hiddenUntilFound}\n        className={cx('bg-surface h-fit rounded-lg', className)}\n        render={renderSlot}\n        value={value as any}\n        defaultValue={defaultValue as any}\n        onValueChange={handleValueChange as any}\n        {...props}\n      >\n        {children}\n      </BaseAccordion.Root>\n    </AccordionContext>\n  )\n}\n\nAccordion.displayName = 'Accordion'\n\nexport const useAccordionContext = () => {\n  const context = useContext(AccordionContext)\n\n  if (!context) {\n    throw Error('useAccordionContext must be used within a Accordion provider')\n  }\n\n  return context\n}\n","import { Accordion as BaseAccordion } from '@base-ui/react/accordion'\nimport { cx } from 'class-variance-authority'\nimport { type ComponentProps, Ref } from 'react'\n\nimport { useAccordionContext } from './Accordion'\nimport { useRenderSlot } from './useRenderSlot'\n\ntype ExtentedZagInterface = Omit<ComponentProps<typeof BaseAccordion.Item>, 'render'>\n\nexport interface AccordionItemProps extends ExtentedZagInterface {\n  asChild?: boolean\n  ref?: Ref<HTMLDivElement>\n}\n\n/**\n * Groups an accordion header with the corresponding panel. Renders a <div> element.\n */\nexport const Item = ({\n  asChild = false,\n  className,\n  children,\n  ref,\n  ...props\n}: AccordionItemProps) => {\n  const accordion = useAccordionContext()\n\n  const renderSlot = useRenderSlot(asChild, 'div')\n\n  return (\n    <BaseAccordion.Item\n      ref={ref}\n      data-spark-component=\"accordion-item\"\n      render={renderSlot}\n      className={cx(\n        'relative first:rounded-t-lg last:rounded-b-lg',\n        'not-last:border-b-0',\n        { 'border-sm border-outline': accordion.design === 'outlined' },\n        className\n      )}\n      {...props}\n    >\n      {children}\n    </BaseAccordion.Item>\n  )\n}\n\nItem.displayName = 'Accordion.Item'\n","import { Accordion as BaseAccordion } from '@base-ui/react/accordion'\nimport { cx } from 'class-variance-authority'\nimport { type ComponentProps, Ref } from 'react'\n\nimport { useRenderSlot } from './useRenderSlot'\n\ntype ExtentedZagInterface = Omit<ComponentProps<typeof BaseAccordion.Panel>, 'render'>\n\nexport interface AccordionItemContentProps extends ExtentedZagInterface {\n  asChild?: boolean\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const ItemContent = ({\n  asChild = false,\n  className,\n  children,\n  ref,\n  ...props\n}: AccordionItemContentProps) => {\n  const renderSlot = useRenderSlot(asChild, 'div')\n\n  return (\n    <BaseAccordion.Panel\n      ref={ref}\n      data-spark-component=\"accordion-item-content\"\n      className={cx(\n        '[&>:first-child]:p-lg overflow-hidden',\n        'h-[var(--accordion-panel-height)] transition-all duration-200 data-[ending-style]:h-0 data-[starting-style]:h-0',\n        'text-body-1 text-on-surface',\n        className\n      )}\n      render={renderSlot}\n      {...props}\n    >\n      {children}\n    </BaseAccordion.Panel>\n  )\n}\n\nItemContent.displayName = 'Accordion.ItemContent'\n","import { cx } from 'class-variance-authority'\nimport { type ComponentProps, Ref } from 'react'\n\nimport { Slot } from '../slot'\n\nexport interface AccordionItemHeaderProps extends ComponentProps<'h3'> {\n  asChild?: boolean\n  ref?: Ref<HTMLHeadingElement>\n}\n\nexport const ItemHeader = ({\n  asChild = false,\n  children,\n  className,\n  ref,\n}: AccordionItemHeaderProps) => {\n  const Component = asChild ? Slot : 'h3'\n\n  return (\n    <Component\n      ref={ref}\n      data-spark-component=\"accordion-item-header\"\n      className={cx('rounded-[inherit]', className)}\n    >\n      {children}\n    </Component>\n  )\n}\n\nItemHeader.displayName = 'Accordion.ItemHeader'\n","import { Accordion as BaseAccordion } from '@base-ui/react/accordion'\nimport { ArrowHorizontalDown } from '@spark-ui/icons/ArrowHorizontalDown'\nimport { cx } from 'class-variance-authority'\nimport { type ComponentProps, Ref } from 'react'\n\nimport { Icon } from '../icon'\nimport { useAccordionContext } from './Accordion'\nimport { useRenderSlot } from './useRenderSlot'\n\ntype ExtentedZagInterface = Omit<ComponentProps<typeof BaseAccordion.Trigger>, 'render'>\n\nexport interface AccordionItemTriggerProps extends ExtentedZagInterface {\n  asChild?: boolean\n  ref?: Ref<HTMLButtonElement>\n}\n\nexport const ItemTrigger = ({\n  asChild = false,\n  children,\n  className,\n  ref,\n  ...props\n}: AccordionItemTriggerProps) => {\n  const renderSlot = useRenderSlot(asChild, 'button')\n  const { intent } = useAccordionContext()\n\n  return (\n    <BaseAccordion.Trigger\n      ref={ref}\n      data-spark-component=\"accordion-item-trigger\"\n      render={renderSlot}\n      className={cx(\n        'group',\n        'gap-lg min-h-sz-48 relative flex items-center justify-between',\n        'px-lg py-md text-headline-2 data-panel-open:rounded-b-0 w-full rounded-[inherit] text-left',\n        'focus-visible:u-outline focus-visible:z-raised focus-visible:outline-hidden',\n        'data-disabled:opacity-dim-3 cursor-pointer data-disabled:cursor-not-allowed',\n        intent === 'surface' &&\n          'bg-surface text-on-surface hover:enabled:bg-surface-hovered focus:bg-surface-hovered',\n        intent === 'support' &&\n          'bg-support-container text-on-support-container hover:enabled:bg-support-container-hovered focus:bg-support-container-hovered',\n        className\n      )}\n      {...props}\n    >\n      <div className=\"gap-lg flex grow items-center\">{children}</div>\n      <Icon\n        intent=\"neutral\"\n        className={cx(\n          'shrink-0 rotate-0 duration-100 ease-in motion-reduce:transition-none',\n          'group-data-panel-open:rotate-180'\n        )}\n        size=\"sm\"\n      >\n        <ArrowHorizontalDown />\n      </Icon>\n    </BaseAccordion.Trigger>\n  )\n}\n\nItemTrigger.displayName = 'Accordion.ItemTrigger'\n","import { Accordion as Root } from './Accordion'\nimport { Item } from './AccordionItem'\nimport { ItemContent } from './AccordionItemContent'\nimport { ItemHeader } from './AccordionItemHeader'\nimport { ItemTrigger } from './AccordionItemTrigger'\n\n/**\n * A vertically stacked set of expandable sections that allow users to show and hide content.\n */\nexport const Accordion: typeof Root & {\n  Item: typeof Item\n  ItemHeader: typeof ItemHeader\n  ItemTrigger: typeof ItemTrigger\n  ItemContent: typeof ItemContent\n} = Object.assign(Root, {\n  Item,\n  ItemHeader,\n  ItemTrigger,\n  ItemContent,\n})\n\nAccordion.displayName = 'Accordion'\nItem.displayName = 'Item'\nItemHeader.displayName = 'ItemHeader'\nItemTrigger.displayName = 'Accordion.Trigger'\nItemContent.displayName = 'Accordion.Content'\n\nexport { type AccordionProps } from './Accordion'\nexport { type AccordionItemHeaderProps } from './AccordionItemHeader'\nexport { type AccordionItemContentProps } from './AccordionItemContent'\nexport { type AccordionItemTriggerProps } from './AccordionItemTrigger'\n"],"mappings":"2VAEA,SAAgB,EAAc,EAAkB,EAAoB,CAClE,IAAM,EAAY,EAAU,EAAA,KAAO,EAEnC,OAAO,GAAW,CAAE,GAAG,MAAY,EAAA,EAAA,KAAC,EAAD,CAAW,GAAI,EAAS,CAAA,CAAG,IAAA,GC0ChE,IAAM,GAAA,EAAA,EAAA,eAGI,KAAK,CAEf,SAAgB,EAAU,CACxB,UAAU,GACV,WACA,SAAS,WACT,SAAS,UACT,mBAAmB,GACnB,WAAW,GACX,YACA,MACA,QACA,eACA,gBACA,GAAG,GACc,CACjB,IAAM,EAAa,EAAc,EAAS,MAAM,CAG1C,EAAoB,EACrB,GAAgC,CAI/B,EADwB,MAAM,QAAQ,EAAS,CAAG,EAAW,CAAC,EAAS,CACzC,EAEhC,IAAA,GAEJ,OACE,EAAA,EAAA,KAAC,EAAD,CAAkB,MAAO,CAAE,SAAQ,SAAQ,WACzC,EAAA,EAAA,KAAC,EAAA,UAAc,KAAf,CACE,uBAAqB,YAChB,MACK,WACQ,mBAClB,WAAA,EAAA,EAAA,IAAc,8BAA+B,EAAU,CACvD,OAAQ,EACD,QACO,eACd,cAAe,EACf,GAAI,EAEH,WACkB,CAAA,CACJ,CAAA,CAIvB,EAAU,YAAc,YAExB,IAAa,MAA4B,CACvC,IAAM,GAAA,EAAA,EAAA,YAAqB,EAAiB,CAE5C,GAAI,CAAC,EACH,MAAM,MAAM,+DAA+D,CAG7E,OAAO,GC1FI,GAAQ,CACnB,UAAU,GACV,YACA,WACA,MACA,GAAG,KACqB,CACxB,IAAM,EAAY,GAAqB,CAEjC,EAAa,EAAc,EAAS,MAAM,CAEhD,OACE,EAAA,EAAA,KAAC,EAAA,UAAc,KAAf,CACO,MACL,uBAAqB,iBACrB,OAAQ,EACR,WAAA,EAAA,EAAA,IACE,gDACA,sBACA,CAAE,2BAA4B,EAAU,SAAW,WAAY,CAC/D,EACD,CACD,GAAI,EAEH,WACkB,CAAA,EAIzB,EAAK,YAAc,iBCjCnB,IAAa,GAAe,CAC1B,UAAU,GACV,YACA,WACA,MACA,GAAG,KAC4B,CAC/B,IAAM,EAAa,EAAc,EAAS,MAAM,CAEhD,OACE,EAAA,EAAA,KAAC,EAAA,UAAc,MAAf,CACO,MACL,uBAAqB,yBACrB,WAAA,EAAA,EAAA,IACE,wCACA,kHACA,8BACA,EACD,CACD,OAAQ,EACR,GAAI,EAEH,WACmB,CAAA,EAI1B,EAAY,YAAc,wBC9B1B,IAAa,GAAc,CACzB,UAAU,GACV,WACA,YACA,UAKE,EAAA,EAAA,KAHgB,EAAU,EAAA,KAAO,KAGjC,CACO,MACL,uBAAqB,wBACrB,WAAA,EAAA,EAAA,IAAc,oBAAqB,EAAU,CAE5C,WACS,CAAA,CAIhB,EAAW,YAAc,uBCbzB,IAAa,GAAe,CAC1B,UAAU,GACV,WACA,YACA,MACA,GAAG,KAC4B,CAC/B,IAAM,EAAa,EAAc,EAAS,SAAS,CAC7C,CAAE,UAAW,GAAqB,CAExC,OACE,EAAA,EAAA,MAAC,EAAA,UAAc,QAAf,CACO,MACL,uBAAqB,yBACrB,OAAQ,EACR,WAAA,EAAA,EAAA,IACE,QACA,gEACA,6FACA,8EACA,8EACA,IAAW,WACT,uFACF,IAAW,WACT,+HACF,EACD,CACD,GAAI,WAhBN,EAkBE,EAAA,EAAA,KAAC,MAAD,CAAK,UAAU,gCAAiC,WAAe,CAAA,EAC/D,EAAA,EAAA,KAAC,EAAA,EAAD,CACE,OAAO,UACP,WAAA,EAAA,EAAA,IACE,uEACA,mCACD,CACD,KAAK,eAEL,EAAA,EAAA,KAAC,EAAA,oBAAD,EAAuB,CAAA,CAClB,CAAA,CACe,IAI5B,EAAY,YAAc,wBCnD1B,IAAa,EAKT,OAAO,OAAO,EAAM,CACtB,OACA,aACA,cACA,cACD,CAAC,CAEF,EAAU,YAAc,YACxB,EAAK,YAAc,OACnB,EAAW,YAAc,aACzB,EAAY,YAAc,oBAC1B,EAAY,YAAc"}

package/dist/accordion/index.mjs

@@ -13,23 +13,26 @@ function l(t, n) {
 //#endregion
 //#region src/accordion/Accordion.tsx
 var u = i(null);
-function d({ asChild: e = !1, children: t, design: i = "outlined", hiddenUntilFound: a = !0, multiple: s = !1, className: c, ref: d, value: f, defaultValue: p, onValueChange: m, ...h }) {
-	let g = l(e, "div"), _ = m ? (e) => {
-		m(Array.isArray(e) ? e : [e]);
+function d({ asChild: e = !1, children: t, design: i = "outlined", intent: a = "surface", hiddenUntilFound: s = !0, multiple: c = !1, className: d, ref: f, value: p, defaultValue: m, onValueChange: h, ...g }) {
+	let _ = l(e, "div"), v = h ? (e) => {
+		h(Array.isArray(e) ? e : [e]);
 	} : void 0;
 	return /* @__PURE__ */ o(u, {
-		value: { design: i },
+		value: {
+			design: i,
+			intent: a
+		},
 		children: /* @__PURE__ */ o(n.Root, {
 			"data-spark-component": "accordion",
-			ref: d,
-			multiple: s,
-			hiddenUntilFound: a,
-			className: r("bg-surface h-fit rounded-lg", c),
-			render: g,
-			value: f,
-			defaultValue: p,
-			onValueChange: _,
-			...h,
+			ref: f,
+			multiple: c,
+			hiddenUntilFound: s,
+			className: r("bg-surface h-fit rounded-lg", d),
+			render: _,
+			value: p,
+			defaultValue: m,
+			onValueChange: v,
+			...g,
 			children: t
 		})
 	});
@@ -77,19 +80,19 @@ h.displayName = "Accordion.ItemHeader";
 //#endregion
 //#region src/accordion/AccordionItemTrigger.tsx
 var g = ({ asChild: e = !1, children: i, className: a, ref: u, ...d }) => {
-	let f = l(e, "button");
+	let p = l(e, "button"), { intent: m } = f();
 	return /* @__PURE__ */ s(n.Trigger, {
 		ref: u,
 		"data-spark-component": "accordion-item-trigger",
-		render: f,
-		className: r("group", "gap-lg min-h-sz-48 relative flex items-center justify-between", "px-lg py-md text-headline-2 text-on-surface data-[panel-open]:rounded-b-0 w-full rounded-[inherit] text-left", "hover:enabled:bg-surface-hovered focus:bg-surface-hovered", "focus-visible:u-outline focus-visible:z-raised focus-visible:outline-hidden", "disabled:opacity-dim-3 cursor-pointer disabled:cursor-not-allowed", a),
+		render: p,
+		className: r("group", "gap-lg min-h-sz-48 relative flex items-center justify-between", "px-lg py-md text-headline-2 data-panel-open:rounded-b-0 w-full rounded-[inherit] text-left", "focus-visible:u-outline focus-visible:z-raised focus-visible:outline-hidden", "data-disabled:opacity-dim-3 cursor-pointer data-disabled:cursor-not-allowed", m === "surface" && "bg-surface text-on-surface hover:enabled:bg-surface-hovered focus:bg-surface-hovered", m === "support" && "bg-support-container text-on-support-container hover:enabled:bg-support-container-hovered focus:bg-support-container-hovered", a),
 		...d,
 		children: [/* @__PURE__ */ o("div", {
 			className: "gap-lg flex grow items-center",
 			children: i
 		}), /* @__PURE__ */ o(t, {
 			intent: "neutral",
-			className: r("shrink-0 rotate-0 duration-100 ease-in motion-reduce:transition-none", "group-data-[panel-open]:rotate-180"),
+			className: r("shrink-0 rotate-0 duration-100 ease-in motion-reduce:transition-none", "group-data-panel-open:rotate-180"),
 			size: "sm",
 			children: /* @__PURE__ */ o(c, {})
 		})]

package/dist/accordion/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","names":[],"sources":["../../src/accordion/useRenderSlot.tsx","../../src/accordion/Accordion.tsx","../../src/accordion/AccordionItem.tsx","../../src/accordion/AccordionItemContent.tsx","../../src/accordion/AccordionItemHeader.tsx","../../src/accordion/AccordionItemTrigger.tsx","../../src/accordion/index.ts"],"sourcesContent":["import { Slot } from '../slot'\n\nexport function useRenderSlot(asChild: boolean, defaultTag: string) {\n  const Component = asChild ? Slot : defaultTag\n\n  return asChild ? ({ ...props }) => <Component {...props} /> : undefined\n}\n","import { Accordion as BaseAccordion } from '@base-ui/react/accordion'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, createContext, Ref, useContext } from 'react'\n\nimport { useRenderSlot } from './useRenderSlot'\n\ntype BaseAccordionRootProps = ComponentProps<typeof BaseAccordion.Root<string | string[]>>\n\ntype ExtentedBaseUIInterface = Omit<\n  BaseAccordionRootProps,\n  'multiple' | 'render' | 'value' | 'defaultValue' | 'onValueChange'\n>\n\nexport interface AccordionProps extends ExtentedBaseUIInterface {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild?: boolean\n  /**\n   * Whether the accordion items are disabled\n   */\n  disabled?: boolean\n  /**\n   * Whether multiple items can be open at the same time.\n   */\n  multiple?: boolean\n  design?: 'filled' | 'outlined'\n  ref?: Ref<HTMLDivElement>\n  /**\n   * The controlled value (always an array of strings)\n   */\n  value?: string[]\n  /**\n   * The default value (always an array of strings)\n   */\n  defaultValue?: string[]\n  /**\n   * Callback when the value changes (always receives an array of strings)\n   */\n  onValueChange?: (value: string[]) => void\n}\n\nconst AccordionContext = createContext<{\n  design: 'filled' | 'outlined'\n} | null>(null)\n\nexport function Accordion({\n  asChild = false,\n  children,\n  design = 'outlined',\n  hiddenUntilFound = true,\n  multiple = false,\n  className,\n  ref,\n  value,\n  defaultValue,\n  onValueChange,\n  ...props\n}: AccordionProps) {\n  const renderSlot = useRenderSlot(asChild, 'div')\n\n  // Wrap the onValueChange to always provide string[]\n  const handleValueChange = onValueChange\n    ? (newValue: string | string[]) => {\n        // Base UI returns string when multiple=false, string[] when multiple=true\n        // We normalize to always return string[]\n        const normalizedValue = Array.isArray(newValue) ? newValue : [newValue]\n        onValueChange(normalizedValue)\n      }\n    : undefined\n\n  return (\n    <AccordionContext value={{ design }}>\n      <BaseAccordion.Root\n        data-spark-component=\"accordion\"\n        ref={ref}\n        multiple={multiple}\n        hiddenUntilFound={hiddenUntilFound}\n        className={cx('bg-surface h-fit rounded-lg', className)}\n        render={renderSlot}\n        value={value as any}\n        defaultValue={defaultValue as any}\n        onValueChange={handleValueChange as any}\n        {...props}\n      >\n        {children}\n      </BaseAccordion.Root>\n    </AccordionContext>\n  )\n}\n\nAccordion.displayName = 'Accordion'\n\nexport const useAccordionContext = () => {\n  const context = useContext(AccordionContext)\n\n  if (!context) {\n    throw Error('useAccordionContext must be used within a Accordion provider')\n  }\n\n  return context\n}\n","import { Accordion as BaseAccordion } from '@base-ui/react/accordion'\nimport { cx } from 'class-variance-authority'\nimport { type ComponentProps, Ref } from 'react'\n\nimport { useAccordionContext } from './Accordion'\nimport { useRenderSlot } from './useRenderSlot'\n\ntype ExtentedZagInterface = Omit<ComponentProps<typeof BaseAccordion.Item>, 'render'>\n\nexport interface AccordionItemProps extends ExtentedZagInterface {\n  asChild?: boolean\n  ref?: Ref<HTMLDivElement>\n}\n\n/**\n * Groups an accordion header with the corresponding panel. Renders a <div> element.\n */\nexport const Item = ({\n  asChild = false,\n  className,\n  children,\n  ref,\n  ...props\n}: AccordionItemProps) => {\n  const accordion = useAccordionContext()\n\n  const renderSlot = useRenderSlot(asChild, 'div')\n\n  return (\n    <BaseAccordion.Item\n      ref={ref}\n      data-spark-component=\"accordion-item\"\n      render={renderSlot}\n      className={cx(\n        'relative first:rounded-t-lg last:rounded-b-lg',\n        'not-last:border-b-0',\n        { 'border-sm border-outline': accordion.design === 'outlined' },\n        className\n      )}\n      {...props}\n    >\n      {children}\n    </BaseAccordion.Item>\n  )\n}\n\nItem.displayName = 'Accordion.Item'\n","import { Accordion as BaseAccordion } from '@base-ui/react/accordion'\nimport { cx } from 'class-variance-authority'\nimport { type ComponentProps, Ref } from 'react'\n\nimport { useRenderSlot } from './useRenderSlot'\n\ntype ExtentedZagInterface = Omit<ComponentProps<typeof BaseAccordion.Panel>, 'render'>\n\nexport interface AccordionItemContentProps extends ExtentedZagInterface {\n  asChild?: boolean\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const ItemContent = ({\n  asChild = false,\n  className,\n  children,\n  ref,\n  ...props\n}: AccordionItemContentProps) => {\n  const renderSlot = useRenderSlot(asChild, 'div')\n\n  return (\n    <BaseAccordion.Panel\n      ref={ref}\n      data-spark-component=\"accordion-item-content\"\n      className={cx(\n        '[&>:first-child]:p-lg overflow-hidden',\n        'h-[var(--accordion-panel-height)] transition-all duration-200 data-[ending-style]:h-0 data-[starting-style]:h-0',\n        'text-body-1 text-on-surface',\n        className\n      )}\n      render={renderSlot}\n      {...props}\n    >\n      {children}\n    </BaseAccordion.Panel>\n  )\n}\n\nItemContent.displayName = 'Accordion.ItemContent'\n","import { cx } from 'class-variance-authority'\nimport { type ComponentProps, Ref } from 'react'\n\nimport { Slot } from '../slot'\n\nexport interface AccordionItemHeaderProps extends ComponentProps<'h3'> {\n  asChild?: boolean\n  ref?: Ref<HTMLHeadingElement>\n}\n\nexport const ItemHeader = ({\n  asChild = false,\n  children,\n  className,\n  ref,\n}: AccordionItemHeaderProps) => {\n  const Component = asChild ? Slot : 'h3'\n\n  return (\n    <Component\n      ref={ref}\n      data-spark-component=\"accordion-item-header\"\n      className={cx('rounded-[inherit]', className)}\n    >\n      {children}\n    </Component>\n  )\n}\n\nItemHeader.displayName = 'Accordion.ItemHeader'\n","import { Accordion as BaseAccordion } from '@base-ui/react/accordion'\nimport { ArrowHorizontalDown } from '@spark-ui/icons/ArrowHorizontalDown'\nimport { cx } from 'class-variance-authority'\nimport { type ComponentProps, Ref } from 'react'\n\nimport { Icon } from '../icon'\nimport { useRenderSlot } from './useRenderSlot'\n\ntype ExtentedZagInterface = Omit<ComponentProps<typeof BaseAccordion.Trigger>, 'render'>\n\nexport interface AccordionItemTriggerProps extends ExtentedZagInterface {\n  asChild?: boolean\n  ref?: Ref<HTMLButtonElement>\n}\n\nexport const ItemTrigger = ({\n  asChild = false,\n  children,\n  className,\n  ref,\n  ...props\n}: AccordionItemTriggerProps) => {\n  const renderSlot = useRenderSlot(asChild, 'button')\n\n  return (\n    <BaseAccordion.Trigger\n      ref={ref}\n      data-spark-component=\"accordion-item-trigger\"\n      render={renderSlot}\n      className={cx(\n        'group',\n        'gap-lg min-h-sz-48 relative flex items-center justify-between',\n        'px-lg py-md text-headline-2 text-on-surface data-[panel-open]:rounded-b-0 w-full rounded-[inherit] text-left',\n        'hover:enabled:bg-surface-hovered focus:bg-surface-hovered',\n        'focus-visible:u-outline focus-visible:z-raised focus-visible:outline-hidden',\n        'disabled:opacity-dim-3 cursor-pointer disabled:cursor-not-allowed',\n        className\n      )}\n      {...props}\n    >\n      <div className=\"gap-lg flex grow items-center\">{children}</div>\n      <Icon\n        intent=\"neutral\"\n        className={cx(\n          'shrink-0 rotate-0 duration-100 ease-in motion-reduce:transition-none',\n          'group-data-[panel-open]:rotate-180'\n        )}\n        size=\"sm\"\n      >\n        <ArrowHorizontalDown />\n      </Icon>\n    </BaseAccordion.Trigger>\n  )\n}\n\nItemTrigger.displayName = 'Accordion.ItemTrigger'\n","import { Accordion as Root } from './Accordion'\nimport { Item } from './AccordionItem'\nimport { ItemContent } from './AccordionItemContent'\nimport { ItemHeader } from './AccordionItemHeader'\nimport { ItemTrigger } from './AccordionItemTrigger'\n\n/**\n * A vertically stacked set of expandable sections that allow users to show and hide content.\n */\nexport const Accordion: typeof Root & {\n  Item: typeof Item\n  ItemHeader: typeof ItemHeader\n  ItemTrigger: typeof ItemTrigger\n  ItemContent: typeof ItemContent\n} = Object.assign(Root, {\n  Item,\n  ItemHeader,\n  ItemTrigger,\n  ItemContent,\n})\n\nAccordion.displayName = 'Accordion'\nItem.displayName = 'Item'\nItemHeader.displayName = 'ItemHeader'\nItemTrigger.displayName = 'Accordion.Trigger'\nItemContent.displayName = 'Accordion.Content'\n\nexport { type AccordionProps } from './Accordion'\nexport { type AccordionItemHeaderProps } from './AccordionItemHeader'\nexport { type AccordionItemContentProps } from './AccordionItemContent'\nexport { type AccordionItemTriggerProps } from './AccordionItemTrigger'\n"],"mappings":";;;;;;;;AAEA,SAAgB,EAAc,GAAkB,GAAoB;CAClE,IAAM,IAAY,IAAU,IAAO;AAEnC,QAAO,KAAW,EAAE,GAAG,QAAY,kBAAC,GAAD,EAAW,GAAI,GAAS,CAAA,GAAG,KAAA;;;;ACqChE,IAAM,IAAmB,EAEf,KAAK;AAEf,SAAgB,EAAU,EACxB,aAAU,IACV,aACA,YAAS,YACT,sBAAmB,IACnB,cAAW,IACX,cACA,QACA,UACA,iBACA,kBACA,GAAG,KACc;CACjB,IAAM,IAAa,EAAc,GAAS,MAAM,EAG1C,IAAoB,KACrB,MAAgC;AAI/B,IADwB,MAAM,QAAQ,EAAS,GAAG,IAAW,CAAC,EAAS,CACzC;KAEhC,KAAA;AAEJ,QACE,kBAAC,GAAD;EAAkB,OAAO,EAAE,WAAQ;YACjC,kBAAC,EAAc,MAAf;GACE,wBAAqB;GAChB;GACK;GACQ;GAClB,WAAW,EAAG,+BAA+B,EAAU;GACvD,QAAQ;GACD;GACO;GACd,eAAe;GACf,GAAI;GAEH;GACkB,CAAA;EACJ,CAAA;;AAIvB,EAAU,cAAc;AAExB,IAAa,UAA4B;CACvC,IAAM,IAAU,EAAW,EAAiB;AAE5C,KAAI,CAAC,EACH,OAAM,MAAM,+DAA+D;AAG7E,QAAO;GCnFI,KAAQ,EACnB,aAAU,IACV,cACA,aACA,QACA,GAAG,QACqB;CACxB,IAAM,IAAY,GAAqB,EAEjC,IAAa,EAAc,GAAS,MAAM;AAEhD,QACE,kBAAC,EAAc,MAAf;EACO;EACL,wBAAqB;EACrB,QAAQ;EACR,WAAW,EACT,iDACA,uBACA,EAAE,4BAA4B,EAAU,WAAW,YAAY,EAC/D,EACD;EACD,GAAI;EAEH;EACkB,CAAA;;AAIzB,EAAK,cAAc;;;ACjCnB,IAAa,KAAe,EAC1B,aAAU,IACV,cACA,aACA,QACA,GAAG,QAC4B;CAC/B,IAAM,IAAa,EAAc,GAAS,MAAM;AAEhD,QACE,kBAAC,EAAc,OAAf;EACO;EACL,wBAAqB;EACrB,WAAW,EACT,yCACA,mHACA,+BACA,EACD;EACD,QAAQ;EACR,GAAI;EAEH;EACmB,CAAA;;AAI1B,EAAY,cAAc;;;AC9B1B,IAAa,KAAc,EACzB,aAAU,IACV,aACA,cACA,aAKE,kBAHgB,IAAU,IAAO,MAGjC;CACO;CACL,wBAAqB;CACrB,WAAW,EAAG,qBAAqB,EAAU;CAE5C;CACS,CAAA;AAIhB,EAAW,cAAc;;;ACdzB,IAAa,KAAe,EAC1B,aAAU,IACV,aACA,cACA,QACA,GAAG,QAC4B;CAC/B,IAAM,IAAa,EAAc,GAAS,SAAS;AAEnD,QACE,kBAAC,EAAc,SAAf;EACO;EACL,wBAAqB;EACrB,QAAQ;EACR,WAAW,EACT,SACA,iEACA,gHACA,6DACA,+EACA,qEACA,EACD;EACD,GAAI;YAbN,CAeE,kBAAC,OAAD;GAAK,WAAU;GAAiC;GAAe,CAAA,EAC/D,kBAAC,GAAD;GACE,QAAO;GACP,WAAW,EACT,wEACA,qCACD;GACD,MAAK;aAEL,kBAAC,GAAD,EAAuB,CAAA;GAClB,CAAA,CACe;;;AAI5B,EAAY,cAAc;;;AC9C1B,IAAa,IAKT,OAAO,OAAO,GAAM;CACtB;CACA;CACA;CACA;CACD,CAAC;AAEF,EAAU,cAAc,aACxB,EAAK,cAAc,QACnB,EAAW,cAAc,cACzB,EAAY,cAAc,qBAC1B,EAAY,cAAc"}
+{"version":3,"file":"index.mjs","names":[],"sources":["../../src/accordion/useRenderSlot.tsx","../../src/accordion/Accordion.tsx","../../src/accordion/AccordionItem.tsx","../../src/accordion/AccordionItemContent.tsx","../../src/accordion/AccordionItemHeader.tsx","../../src/accordion/AccordionItemTrigger.tsx","../../src/accordion/index.ts"],"sourcesContent":["import { Slot } from '../slot'\n\nexport function useRenderSlot(asChild: boolean, defaultTag: string) {\n  const Component = asChild ? Slot : defaultTag\n\n  return asChild ? ({ ...props }) => <Component {...props} /> : undefined\n}\n","import { Accordion as BaseAccordion } from '@base-ui/react/accordion'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, createContext, Ref, useContext } from 'react'\n\nimport { useRenderSlot } from './useRenderSlot'\n\ntype BaseAccordionRootProps = ComponentProps<typeof BaseAccordion.Root<string | string[]>>\n\ntype ExtentedBaseUIInterface = Omit<\n  BaseAccordionRootProps,\n  'multiple' | 'render' | 'value' | 'defaultValue' | 'onValueChange'\n>\n\nexport interface AccordionProps extends ExtentedBaseUIInterface {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild?: boolean\n  /**\n   * Whether the accordion items are disabled\n   */\n  disabled?: boolean\n  /**\n   * Whether multiple items can be open at the same time.\n   */\n  multiple?: boolean\n  design?: 'filled' | 'outlined'\n  /**\n   * Change the color scheme of the accordion\n   * @default surface\n   */\n  intent?: 'surface' | 'support'\n  ref?: Ref<HTMLDivElement>\n  /**\n   * The controlled value (always an array of strings)\n   */\n  value?: string[]\n  /**\n   * The default value (always an array of strings)\n   */\n  defaultValue?: string[]\n  /**\n   * Callback when the value changes (always receives an array of strings)\n   */\n  onValueChange?: (value: string[]) => void\n}\n\nconst AccordionContext = createContext<{\n  design: 'filled' | 'outlined'\n  intent: 'surface' | 'support'\n} | null>(null)\n\nexport function Accordion({\n  asChild = false,\n  children,\n  design = 'outlined',\n  intent = 'surface',\n  hiddenUntilFound = true,\n  multiple = false,\n  className,\n  ref,\n  value,\n  defaultValue,\n  onValueChange,\n  ...props\n}: AccordionProps) {\n  const renderSlot = useRenderSlot(asChild, 'div')\n\n  // Wrap the onValueChange to always provide string[]\n  const handleValueChange = onValueChange\n    ? (newValue: string | string[]) => {\n        // Base UI returns string when multiple=false, string[] when multiple=true\n        // We normalize to always return string[]\n        const normalizedValue = Array.isArray(newValue) ? newValue : [newValue]\n        onValueChange(normalizedValue)\n      }\n    : undefined\n\n  return (\n    <AccordionContext value={{ design, intent }}>\n      <BaseAccordion.Root\n        data-spark-component=\"accordion\"\n        ref={ref}\n        multiple={multiple}\n        hiddenUntilFound={hiddenUntilFound}\n        className={cx('bg-surface h-fit rounded-lg', className)}\n        render={renderSlot}\n        value={value as any}\n        defaultValue={defaultValue as any}\n        onValueChange={handleValueChange as any}\n        {...props}\n      >\n        {children}\n      </BaseAccordion.Root>\n    </AccordionContext>\n  )\n}\n\nAccordion.displayName = 'Accordion'\n\nexport const useAccordionContext = () => {\n  const context = useContext(AccordionContext)\n\n  if (!context) {\n    throw Error('useAccordionContext must be used within a Accordion provider')\n  }\n\n  return context\n}\n","import { Accordion as BaseAccordion } from '@base-ui/react/accordion'\nimport { cx } from 'class-variance-authority'\nimport { type ComponentProps, Ref } from 'react'\n\nimport { useAccordionContext } from './Accordion'\nimport { useRenderSlot } from './useRenderSlot'\n\ntype ExtentedZagInterface = Omit<ComponentProps<typeof BaseAccordion.Item>, 'render'>\n\nexport interface AccordionItemProps extends ExtentedZagInterface {\n  asChild?: boolean\n  ref?: Ref<HTMLDivElement>\n}\n\n/**\n * Groups an accordion header with the corresponding panel. Renders a <div> element.\n */\nexport const Item = ({\n  asChild = false,\n  className,\n  children,\n  ref,\n  ...props\n}: AccordionItemProps) => {\n  const accordion = useAccordionContext()\n\n  const renderSlot = useRenderSlot(asChild, 'div')\n\n  return (\n    <BaseAccordion.Item\n      ref={ref}\n      data-spark-component=\"accordion-item\"\n      render={renderSlot}\n      className={cx(\n        'relative first:rounded-t-lg last:rounded-b-lg',\n        'not-last:border-b-0',\n        { 'border-sm border-outline': accordion.design === 'outlined' },\n        className\n      )}\n      {...props}\n    >\n      {children}\n    </BaseAccordion.Item>\n  )\n}\n\nItem.displayName = 'Accordion.Item'\n","import { Accordion as BaseAccordion } from '@base-ui/react/accordion'\nimport { cx } from 'class-variance-authority'\nimport { type ComponentProps, Ref } from 'react'\n\nimport { useRenderSlot } from './useRenderSlot'\n\ntype ExtentedZagInterface = Omit<ComponentProps<typeof BaseAccordion.Panel>, 'render'>\n\nexport interface AccordionItemContentProps extends ExtentedZagInterface {\n  asChild?: boolean\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const ItemContent = ({\n  asChild = false,\n  className,\n  children,\n  ref,\n  ...props\n}: AccordionItemContentProps) => {\n  const renderSlot = useRenderSlot(asChild, 'div')\n\n  return (\n    <BaseAccordion.Panel\n      ref={ref}\n      data-spark-component=\"accordion-item-content\"\n      className={cx(\n        '[&>:first-child]:p-lg overflow-hidden',\n        'h-[var(--accordion-panel-height)] transition-all duration-200 data-[ending-style]:h-0 data-[starting-style]:h-0',\n        'text-body-1 text-on-surface',\n        className\n      )}\n      render={renderSlot}\n      {...props}\n    >\n      {children}\n    </BaseAccordion.Panel>\n  )\n}\n\nItemContent.displayName = 'Accordion.ItemContent'\n","import { cx } from 'class-variance-authority'\nimport { type ComponentProps, Ref } from 'react'\n\nimport { Slot } from '../slot'\n\nexport interface AccordionItemHeaderProps extends ComponentProps<'h3'> {\n  asChild?: boolean\n  ref?: Ref<HTMLHeadingElement>\n}\n\nexport const ItemHeader = ({\n  asChild = false,\n  children,\n  className,\n  ref,\n}: AccordionItemHeaderProps) => {\n  const Component = asChild ? Slot : 'h3'\n\n  return (\n    <Component\n      ref={ref}\n      data-spark-component=\"accordion-item-header\"\n      className={cx('rounded-[inherit]', className)}\n    >\n      {children}\n    </Component>\n  )\n}\n\nItemHeader.displayName = 'Accordion.ItemHeader'\n","import { Accordion as BaseAccordion } from '@base-ui/react/accordion'\nimport { ArrowHorizontalDown } from '@spark-ui/icons/ArrowHorizontalDown'\nimport { cx } from 'class-variance-authority'\nimport { type ComponentProps, Ref } from 'react'\n\nimport { Icon } from '../icon'\nimport { useAccordionContext } from './Accordion'\nimport { useRenderSlot } from './useRenderSlot'\n\ntype ExtentedZagInterface = Omit<ComponentProps<typeof BaseAccordion.Trigger>, 'render'>\n\nexport interface AccordionItemTriggerProps extends ExtentedZagInterface {\n  asChild?: boolean\n  ref?: Ref<HTMLButtonElement>\n}\n\nexport const ItemTrigger = ({\n  asChild = false,\n  children,\n  className,\n  ref,\n  ...props\n}: AccordionItemTriggerProps) => {\n  const renderSlot = useRenderSlot(asChild, 'button')\n  const { intent } = useAccordionContext()\n\n  return (\n    <BaseAccordion.Trigger\n      ref={ref}\n      data-spark-component=\"accordion-item-trigger\"\n      render={renderSlot}\n      className={cx(\n        'group',\n        'gap-lg min-h-sz-48 relative flex items-center justify-between',\n        'px-lg py-md text-headline-2 data-panel-open:rounded-b-0 w-full rounded-[inherit] text-left',\n        'focus-visible:u-outline focus-visible:z-raised focus-visible:outline-hidden',\n        'data-disabled:opacity-dim-3 cursor-pointer data-disabled:cursor-not-allowed',\n        intent === 'surface' &&\n          'bg-surface text-on-surface hover:enabled:bg-surface-hovered focus:bg-surface-hovered',\n        intent === 'support' &&\n          'bg-support-container text-on-support-container hover:enabled:bg-support-container-hovered focus:bg-support-container-hovered',\n        className\n      )}\n      {...props}\n    >\n      <div className=\"gap-lg flex grow items-center\">{children}</div>\n      <Icon\n        intent=\"neutral\"\n        className={cx(\n          'shrink-0 rotate-0 duration-100 ease-in motion-reduce:transition-none',\n          'group-data-panel-open:rotate-180'\n        )}\n        size=\"sm\"\n      >\n        <ArrowHorizontalDown />\n      </Icon>\n    </BaseAccordion.Trigger>\n  )\n}\n\nItemTrigger.displayName = 'Accordion.ItemTrigger'\n","import { Accordion as Root } from './Accordion'\nimport { Item } from './AccordionItem'\nimport { ItemContent } from './AccordionItemContent'\nimport { ItemHeader } from './AccordionItemHeader'\nimport { ItemTrigger } from './AccordionItemTrigger'\n\n/**\n * A vertically stacked set of expandable sections that allow users to show and hide content.\n */\nexport const Accordion: typeof Root & {\n  Item: typeof Item\n  ItemHeader: typeof ItemHeader\n  ItemTrigger: typeof ItemTrigger\n  ItemContent: typeof ItemContent\n} = Object.assign(Root, {\n  Item,\n  ItemHeader,\n  ItemTrigger,\n  ItemContent,\n})\n\nAccordion.displayName = 'Accordion'\nItem.displayName = 'Item'\nItemHeader.displayName = 'ItemHeader'\nItemTrigger.displayName = 'Accordion.Trigger'\nItemContent.displayName = 'Accordion.Content'\n\nexport { type AccordionProps } from './Accordion'\nexport { type AccordionItemHeaderProps } from './AccordionItemHeader'\nexport { type AccordionItemContentProps } from './AccordionItemContent'\nexport { type AccordionItemTriggerProps } from './AccordionItemTrigger'\n"],"mappings":";;;;;;;;AAEA,SAAgB,EAAc,GAAkB,GAAoB;CAClE,IAAM,IAAY,IAAU,IAAO;AAEnC,QAAO,KAAW,EAAE,GAAG,QAAY,kBAAC,GAAD,EAAW,GAAI,GAAS,CAAA,GAAG,KAAA;;;;AC0ChE,IAAM,IAAmB,EAGf,KAAK;AAEf,SAAgB,EAAU,EACxB,aAAU,IACV,aACA,YAAS,YACT,YAAS,WACT,sBAAmB,IACnB,cAAW,IACX,cACA,QACA,UACA,iBACA,kBACA,GAAG,KACc;CACjB,IAAM,IAAa,EAAc,GAAS,MAAM,EAG1C,IAAoB,KACrB,MAAgC;AAI/B,IADwB,MAAM,QAAQ,EAAS,GAAG,IAAW,CAAC,EAAS,CACzC;KAEhC,KAAA;AAEJ,QACE,kBAAC,GAAD;EAAkB,OAAO;GAAE;GAAQ;GAAQ;YACzC,kBAAC,EAAc,MAAf;GACE,wBAAqB;GAChB;GACK;GACQ;GAClB,WAAW,EAAG,+BAA+B,EAAU;GACvD,QAAQ;GACD;GACO;GACd,eAAe;GACf,GAAI;GAEH;GACkB,CAAA;EACJ,CAAA;;AAIvB,EAAU,cAAc;AAExB,IAAa,UAA4B;CACvC,IAAM,IAAU,EAAW,EAAiB;AAE5C,KAAI,CAAC,EACH,OAAM,MAAM,+DAA+D;AAG7E,QAAO;GC1FI,KAAQ,EACnB,aAAU,IACV,cACA,aACA,QACA,GAAG,QACqB;CACxB,IAAM,IAAY,GAAqB,EAEjC,IAAa,EAAc,GAAS,MAAM;AAEhD,QACE,kBAAC,EAAc,MAAf;EACO;EACL,wBAAqB;EACrB,QAAQ;EACR,WAAW,EACT,iDACA,uBACA,EAAE,4BAA4B,EAAU,WAAW,YAAY,EAC/D,EACD;EACD,GAAI;EAEH;EACkB,CAAA;;AAIzB,EAAK,cAAc;;;ACjCnB,IAAa,KAAe,EAC1B,aAAU,IACV,cACA,aACA,QACA,GAAG,QAC4B;CAC/B,IAAM,IAAa,EAAc,GAAS,MAAM;AAEhD,QACE,kBAAC,EAAc,OAAf;EACO;EACL,wBAAqB;EACrB,WAAW,EACT,yCACA,mHACA,+BACA,EACD;EACD,QAAQ;EACR,GAAI;EAEH;EACmB,CAAA;;AAI1B,EAAY,cAAc;;;AC9B1B,IAAa,KAAc,EACzB,aAAU,IACV,aACA,cACA,aAKE,kBAHgB,IAAU,IAAO,MAGjC;CACO;CACL,wBAAqB;CACrB,WAAW,EAAG,qBAAqB,EAAU;CAE5C;CACS,CAAA;AAIhB,EAAW,cAAc;;;ACbzB,IAAa,KAAe,EAC1B,aAAU,IACV,aACA,cACA,QACA,GAAG,QAC4B;CAC/B,IAAM,IAAa,EAAc,GAAS,SAAS,EAC7C,EAAE,cAAW,GAAqB;AAExC,QACE,kBAAC,EAAc,SAAf;EACO;EACL,wBAAqB;EACrB,QAAQ;EACR,WAAW,EACT,SACA,iEACA,8FACA,+EACA,+EACA,MAAW,aACT,wFACF,MAAW,aACT,gIACF,EACD;EACD,GAAI;YAhBN,CAkBE,kBAAC,OAAD;GAAK,WAAU;GAAiC;GAAe,CAAA,EAC/D,kBAAC,GAAD;GACE,QAAO;GACP,WAAW,EACT,wEACA,mCACD;GACD,MAAK;aAEL,kBAAC,GAAD,EAAuB,CAAA;GAClB,CAAA,CACe;;;AAI5B,EAAY,cAAc;;;ACnD1B,IAAa,IAKT,OAAO,OAAO,GAAM;CACtB;CACA;CACA;CACA;CACD,CAAC;AAEF,EAAU,cAAc,aACxB,EAAK,cAAc,QACnB,EAAW,cAAc,cACzB,EAAY,cAAc,qBAC1B,EAAY,cAAc"}

package/dist/badge/BadgeItem.styles.d.ts

@@ -1,6 +1,6 @@
 import { VariantProps } from 'class-variance-authority';
 export declare const styles: (props?: ({
-    intent?: "main" | "alert" | "support" | "accent" | "success" | "info" | "neutral" | "danger" | "surface" | null | undefined;
+    intent?: "main" | "alert" | "surface" | "support" | "accent" | "success" | "info" | "neutral" | "danger" | null | undefined;
     size?: "sm" | "md" | null | undefined;
     type?: "relative" | "standalone" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;

package/dist/button/Button.styles.d.ts

@@ -2,7 +2,7 @@ import { VariantProps } from 'class-variance-authority';
 export declare const buttonStyles: (props?: ({
     design?: "filled" | "outlined" | "ghost" | "tinted" | "contrast" | null | undefined;
     underline?: boolean | null | undefined;
-    intent?: "main" | "alert" | "support" | "accent" | "success" | "info" | "neutral" | "danger" | "surface" | "surfaceInverse" | null | undefined;
+    intent?: "main" | "alert" | "surface" | "support" | "accent" | "success" | "info" | "neutral" | "danger" | "surfaceInverse" | null | undefined;
     size?: "sm" | "md" | "lg" | null | undefined;
     shape?: "square" | "rounded" | "pill" | null | undefined;
     disabled?: boolean | null | undefined;

package/dist/card/Backdrop.d.ts

@@ -1,7 +1,7 @@
 import { VariantProps } from 'class-variance-authority';
 export declare const backdropStyles: (props?: ({
     animation?: "none" | "pulse" | null | undefined;
-    intent?: "main" | "alert" | "support" | "accent" | "success" | "info" | "neutral" | "danger" | "surface" | "surfaceInverse" | null | undefined;
+    intent?: "main" | "alert" | "surface" | "support" | "accent" | "success" | "info" | "neutral" | "danger" | "surfaceInverse" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 export type BackdropStylesProps = VariantProps<typeof backdropStyles>;
 interface BackdropProps extends BackdropStylesProps {

package/dist/card/Card.styles.d.ts

@@ -1,6 +1,6 @@
 import { VariantProps } from 'class-variance-authority';
 export declare const cardStyles: (props?: ({
     design?: "outlined" | "tinted" | null | undefined;
-    intent?: "main" | "alert" | "support" | "accent" | "success" | "info" | "neutral" | "danger" | "surface" | null | undefined;
+    intent?: "main" | "alert" | "surface" | "support" | "accent" | "success" | "info" | "neutral" | "danger" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 export type CardStylesProps = VariantProps<typeof cardStyles>;

package/dist/card/Content.styles.d.ts

@@ -3,6 +3,6 @@ export declare const contentStyles: (props?: ({
     inset?: boolean | null | undefined;
     design?: "outlined" | "tinted" | null | undefined;
     hasType?: boolean | null | undefined;
-    intent?: "main" | "alert" | "support" | "accent" | "success" | "info" | "neutral" | "danger" | "surface" | null | undefined;
+    intent?: "main" | "alert" | "surface" | "support" | "accent" | "success" | "info" | "neutral" | "danger" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 export type ContentStylesProps = VariantProps<typeof contentStyles>;

package/dist/card/Type.d.ts

@@ -1,7 +1,7 @@
 import { VariantProps } from 'class-variance-authority';
 import { ComponentProps, ReactNode } from 'react';
 export declare const typeStyles: (props?: ({
-    intent?: "main" | "alert" | "support" | "accent" | "success" | "info" | "neutral" | "danger" | "surface" | null | undefined;
+    intent?: "main" | "alert" | "surface" | "support" | "accent" | "success" | "info" | "neutral" | "danger" | null | undefined;
     design?: "outlined" | "tinted" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 type TypeStylesProps = VariantProps<typeof typeStyles>;

package/dist/checkbox/CheckboxInput.styles.d.ts

@@ -1,5 +1,5 @@
 import { VariantProps } from 'class-variance-authority';
 export declare const checkboxInputStyles: (props?: ({
-    intent?: "main" | "alert" | "error" | "support" | "accent" | "success" | "info" | "neutral" | null | undefined;
+    intent?: "main" | "alert" | "support" | "error" | "accent" | "success" | "info" | "neutral" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 export type CheckboxInputStylesProps = VariantProps<typeof checkboxInputStyles>;

package/dist/chip/Chip.styles.d.ts

@@ -1,7 +1,7 @@
 import { VariantProps } from 'class-variance-authority';
 export declare const chipStyles: (props?: ({
     design?: "outlined" | "dashed" | "tinted" | null | undefined;
-    intent?: "main" | "alert" | "support" | "accent" | "success" | "info" | "neutral" | "danger" | "surface" | null | undefined;
+    intent?: "main" | "alert" | "surface" | "support" | "accent" | "success" | "info" | "neutral" | "danger" | null | undefined;
     disabled?: boolean | null | undefined;
     hasClearButton?: boolean | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;

package/dist/icon/Icon.styles.d.ts

@@ -1,6 +1,6 @@
 import { VariantProps } from 'class-variance-authority';
 export declare const iconStyles: (props?: ({
-    intent?: "main" | "current" | "alert" | "error" | "support" | "accent" | "success" | "info" | "neutral" | null | undefined;
+    intent?: "main" | "current" | "alert" | "support" | "error" | "accent" | "success" | "info" | "neutral" | null | undefined;
     size?: "current" | "sm" | "md" | "lg" | "xl" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 export type IconVariantsProps = VariantProps<typeof iconStyles>;

package/dist/menu/MenuItemStyles.d.ts

@@ -1,5 +1,5 @@
 import { VariantProps } from 'class-variance-authority';
 export declare const menuItemStyles: (props?: ({
-    intent?: "main" | "alert" | "support" | "accent" | "success" | "info" | "neutral" | "danger" | "surface" | null | undefined;
+    intent?: "main" | "alert" | "surface" | "support" | "accent" | "success" | "info" | "neutral" | "danger" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 export type MenuItemStylesProps = VariantProps<typeof menuItemStyles>;

package/dist/popover/PopoverContent.styles.d.ts

@@ -1,6 +1,6 @@
 import { VariantProps } from 'class-variance-authority';
 export declare const styles: (props?: ({
-    intent?: "main" | "alert" | "support" | "accent" | "success" | "info" | "neutral" | "danger" | "surface" | null | undefined;
+    intent?: "main" | "alert" | "surface" | "support" | "accent" | "success" | "info" | "neutral" | "danger" | null | undefined;
     matchTriggerWidth?: boolean | null | undefined;
     enforceBoundaries?: boolean | null | undefined;
     inset?: boolean | null | undefined;

package/dist/radio-group/RadioIndicator.styles.d.ts

@@ -1,5 +1,5 @@
 import { VariantProps } from 'class-variance-authority';
 export declare const radioIndicatorStyles: (props?: ({
-    intent?: "main" | "alert" | "error" | "support" | "accent" | "success" | "info" | "neutral" | null | undefined;
+    intent?: "main" | "alert" | "support" | "error" | "accent" | "success" | "info" | "neutral" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 export type RadioIndicatorStylesProps = VariantProps<typeof radioIndicatorStyles>;

package/dist/radio-group/RadioInput.styles.d.ts

@@ -1,5 +1,5 @@
 import { VariantProps } from 'class-variance-authority';
 export declare const radioInputVariants: (props?: ({
-    intent?: "main" | "alert" | "error" | "support" | "accent" | "success" | "info" | "neutral" | null | undefined;
+    intent?: "main" | "alert" | "support" | "error" | "accent" | "success" | "info" | "neutral" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 export type RadioInputVariantsProps = VariantProps<typeof radioInputVariants>;

package/dist/slider/SliderThumb.styles.d.ts

@@ -1,5 +1,5 @@
 import { VariantProps } from 'class-variance-authority';
 export declare const thumbVariants: (props?: ({
-    intent?: "main" | "alert" | "error" | "support" | "accent" | "success" | "info" | "neutral" | null | undefined;
+    intent?: "main" | "alert" | "support" | "error" | "accent" | "success" | "info" | "neutral" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 export type SliderThumbVariantsProps = VariantProps<typeof thumbVariants>;

package/dist/slider/SliderTrack.styles.d.ts

@@ -1,6 +1,6 @@
 import { VariantProps } from 'class-variance-authority';
 export declare const trackVariants: (props?: import('class-variance-authority/types').ClassProp | undefined) => string;
 export declare const rangeVariants: (props?: ({
-    intent?: "main" | "alert" | "error" | "support" | "accent" | "success" | "info" | "neutral" | null | undefined;
+    intent?: "main" | "alert" | "support" | "error" | "accent" | "success" | "info" | "neutral" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 export type SliderRangeVariantsProps = VariantProps<typeof rangeVariants>;

package/dist/spinner/Spinner.styles.d.ts

@@ -1,7 +1,7 @@
 import { VariantProps } from 'class-variance-authority';
 export declare const spinnerStyles: (props?: ({
     size?: "current" | "sm" | "md" | "full" | null | undefined;
-    intent?: "main" | "current" | "alert" | "error" | "support" | "accent" | "success" | "info" | "neutral" | null | undefined;
+    intent?: "main" | "current" | "alert" | "support" | "error" | "accent" | "success" | "info" | "neutral" | null | undefined;
     isBackgroundVisible?: boolean | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 export type SpinnerStylesProps = VariantProps<typeof spinnerStyles>;

package/dist/switch/SwitchInput.styles.d.ts

@@ -1,7 +1,7 @@
 import { VariantProps } from 'class-variance-authority';
 export declare const styles: (props?: ({
     size?: "sm" | "md" | null | undefined;
-    intent?: "main" | "alert" | "error" | "support" | "accent" | "success" | "info" | "neutral" | null | undefined;
+    intent?: "main" | "alert" | "support" | "error" | "accent" | "success" | "info" | "neutral" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 export type StylesProps = VariantProps<typeof styles>;
 export declare const thumbWrapperStyles: (props?: ({

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" | "success" | "info" | "neutral" | "danger" | "surface" | null | undefined;
+    intent?: "main" | "alert" | "surface" | "support" | "accent" | "success" | "info" | "neutral" | "danger" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 export type TagStylesProps = VariantProps<typeof tagStyles>;

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

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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@spark-ui/components",
-  "version": "17.13.2",
+  "version": "17.14.0",
   "license": "MIT",
   "description": "Spark (Leboncoin design system) components.",
   "exports": {
@@ -48,9 +48,9 @@
   },
   "dependencies": {
     "@base-ui/react": "^1.5.0",
-    "@spark-ui/hooks": "17.13.2",
-    "@spark-ui/icons": "17.13.2",
-    "@spark-ui/internal-utils": "17.13.2",
+    "@spark-ui/hooks": "17.14.0",
+    "@spark-ui/icons": "17.14.0",
+    "@spark-ui/internal-utils": "17.14.0",
     "@zag-js/pagination": "1.30.0",
     "@zag-js/react": "1.30.0",
     "class-variance-authority": "0.7.1",
@@ -62,7 +62,7 @@
     "react-snap-carousel": "0.5.1"
   },
   "peerDependencies": {
-    "@spark-ui/theme-utils": "17.13.2",
+    "@spark-ui/theme-utils": "17.14.0",
     "react": "19.2.4",
     "react-dom": "19.2.4",
     "tailwindcss": "4.1.18"