@spark-ui/components 17.14.3 → 17.14.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/dist/chip/index.js +1 -1
  2. package/dist/chip/index.js.map +1 -1
  3. package/dist/chip/index.mjs +1 -1
  4. package/dist/chip/index.mjs.map +1 -1
  5. package/package.json +5 -5
package/dist/chip/index.js CHANGED
@@ -1,2 +1,2 @@
1
- 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(`class-variance-authority`),r=require(`react`),i=require(`react/jsx-runtime`),a=require(`@spark-ui/internal-utils`),o=require(`@spark-ui/hooks/use-combined-state`),s=require(`emulate-tab`),c=require(`@spark-ui/icons/Close`);var l=[{design:`outlined`,intent:`main`,class:(0,a.tw)([`enabled:hover:bg-main/dim-5`,`enabled:active:bg-main/dim-5`,`focus-visible:bg-main/dim-5`,`aria-pressed:bg-main-container aria-pressed:text-on-main-container aria-pressed:enabled:hover:bg-main-container/dim-1`,`text-main`])},{design:`outlined`,intent:`support`,class:(0,a.tw)([`enabled:hover:bg-support/dim-5`,`enabled:active:bg-support/dim-5`,`focus-visible:bg-support/dim-5`,`aria-pressed:bg-support-container aria-pressed:text-on-support-container aria-pressed:enabled:hover:bg-support-container/dim-1`,`text-support`])},{intent:`accent`,design:`outlined`,class:(0,a.tw)([`enabled:hover:bg-accent/dim-5`,`enabled:active:bg-accent/dim-5`,`focus-visible:bg-accent/dim-5`,`aria-pressed:bg-accent-container`,`aria-pressed:bg-accent-container aria-pressed:text-on-accent-container aria-pressed:enabled:hover:bg-accent-container/dim-1`,`text-accent`])},{design:`outlined`,intent:`success`,class:(0,a.tw)([`enabled:hover:bg-success/dim-5`,`enabled:active:bg-success/dim-5`,`focus-visible:bg-success/dim-5`,`aria-pressed:bg-success-container aria-pressed:text-on-success-container aria-pressed:enabled:hover:bg-success-container/dim-1`,`text-success`])},{intent:`alert`,design:`outlined`,class:(0,a.tw)([`enabled:hover:bg-alert/dim-5`,`enabled:active:bg-alert/dim-5`,`focus-visible:bg-alert/dim-5`,`aria-pressed:bg-alert-container aria-pressed:text-on-alert-container aria-pressed:enabled:hover:bg-alert-container/dim-1`,`text-alert`])},{design:`outlined`,intent:`danger`,class:(0,a.tw)([`enabled:hover:bg-error/dim-5`,`enabled:active:bg-error/dim-5`,`focus-visible:bg-error/dim-5`,`aria-pressed:bg-error-container aria-pressed:text-on-error-container aria-pressed:enabled:hover:bg-error-container/dim-1`,`text-error`])},{design:`outlined`,intent:`info`,class:(0,a.tw)([`enabled:hover:bg-info/dim-5`,`enabled:active:bg-info/dim-5`,`focus-visible:bg-info/dim-5`,`aria-pressed:bg-info-container aria-pressed:text-on-info-container aria-pressed:enabled:hover:bg-info-container/dim-1`,`text-info`])},{design:`outlined`,intent:`neutral`,class:(0,a.tw)([`enabled:hover:bg-neutral/dim-5`,`enabled:active:bg-neutral/dim-5`,`focus-visible:bg-neutral/dim-5`,`aria-pressed:bg-neutral-container aria-pressed:text-on-neutral-container aria-pressed:enabled:hover:bg-neutral-container/dim-1`,`text-neutral`])},{design:`outlined`,intent:`surface`,class:(0,a.tw)([`enabled:hover:bg-surface/dim-5`,`enabled:active:bg-surface/dim-5`,`focus-visible:bg-surface/dim-5`,`aria-pressed:bg-surface aria-pressed:text-on-surface aria-pressed:enabled:hover:bg-surface-hovered`,`text-surface`])},{design:`outlined`,hasClearButton:!1,class:(0,a.tw)([`px-[calc(var(--spacing-md)-var(--border-width-sm))]`])},{design:`outlined`,hasClearButton:!0,class:(0,a.tw)([`pl-[calc(var(--spacing-md)-var(--border-width-sm))]`])}],u=[{intent:`main`,design:`tinted`,class:(0,a.tw)([`bg-main-container`,`enabled:hover:bg-main-container-hovered`,`enabled:active:bg-main-container-hovered`,`focus-visible:bg-main-container-hovered`,`aria-pressed:bg-main aria-pressed:text-on-main aria-pressed:enabled:hover:bg-main/dim-1`,`text-on-main-container`])},{intent:`support`,design:`tinted`,class:(0,a.tw)([`bg-support-container`,`enabled:hover:bg-support-container-hovered`,`enabled:active:bg-support-container-hovered`,`focus-visible:bg-support-container-hovered`,`aria-pressed:bg-support aria-pressed:text-on-support aria-pressed:enabled:hover:bg-support/dim-1`,`text-on-support-container`])},{intent:`accent`,design:`tinted`,class:(0,a.tw)([`bg-accent-container`,`enabled:hover:bg-accent-container-hovered`,`enabled:active:bg-accent-container-hovered`,`focus-visible:bg-accent-container-hovered`,`aria-pressed:bg-accent aria-pressed:text-on-accent aria-pressed:enabled:hover:bg-accent/dim-1`,`text-on-accent-container`])},{intent:`success`,design:`tinted`,class:(0,a.tw)([`bg-success-container`,`enabled:hover:bg-success-container-hovered`,`enabled:active:bg-success-container-hovered`,`focus-visible:bg-success-container-hovered`,`aria-pressed:bg-success aria-pressed:text-on-success aria-pressed:enabled:hover:bg-success/dim-1`,`text-on-success-container`])},{intent:`alert`,design:`tinted`,class:(0,a.tw)([`bg-alert-container`,`enabled:hover:bg-alert-container-hovered`,`enabled:active:bg-alert-container-hovered`,`focus-visible:bg-alert-container-hovered`,`aria-pressed:bg-alert aria-pressed:text-on-alert aria-pressed:enabled:hover:bg-alert/dim-1`,`text-on-alert-container`])},{intent:`danger`,design:`tinted`,class:(0,a.tw)([`bg-error-container`,`enabled:hover:bg-error-container-hovered`,`enabled:active:bg-error-container-hovered`,`focus-visible:bg-error-container-hovered`,`aria-pressed:bg-error aria-pressed:text-on-error aria-pressed:enabled:hover:bg-error/dim-1`,`text-on-error-container`])},{intent:`info`,design:`tinted`,class:(0,a.tw)([`bg-info-container`,`enabled:hover:bg-info-container-hovered`,`enabled:active:bg-info-container-hovered`,`focus-visible:bg-info-container-hovered`,`aria-pressed:bg-info aria-pressed:text-on-info aria-pressed:enabled:hover:bg-info/dim-1`,`text-on-info-container`])},{intent:`neutral`,design:`tinted`,class:(0,a.tw)([`bg-neutral-container`,`enabled:hover:bg-neutral-container-hovered`,`enabled:active:bg-neutral-container-hovered`,`focus-visible:bg-neutral-container-hovered`,`aria-pressed:bg-neutral aria-pressed:text-on-neutral aria-pressed:enabled:hover:bg-neutral/dim-1`,`text-on-neutral-container`])},{intent:`surface`,design:`tinted`,class:(0,a.tw)([`bg-surface/dim-1`,`enabled:hover:bg-surface-hovered/dim-1`,`enabled:active:bg-surface-hovered/dim-1`,`focus-visible:bg-surface-hovered/dim-1`,`aria-pressed:bg-surface aria-pressed:text-on-surface aria-pressed:enabled:hover:bg-surface-hovered`,`text-on-surface/dim-1`])},{design:`tinted`,hasClearButton:!1,class:(0,a.tw)([`px-md`])},{design:`tinted`,hasClearButton:!0,class:(0,a.tw)([`pl-md`])}],d=[{intent:`main`,design:`dashed`,class:(0,a.tw)([`enabled:hover:bg-main/dim-5`,`enabled:active:bg-main/dim-5`,`focus-visible:bg-main/dim-5`,`aria-pressed:bg-main-container aria-pressed:text-on-main-container aria-pressed:enabled:hover:bg-main-container/dim-1`,`text-main`])},{intent:`support`,design:`dashed`,class:(0,a.tw)([`enabled:hover:bg-support/dim-5`,`enabled:active:bg-support/dim-5`,`focus-visible:bg-support/dim-5`,`aria-pressed:bg-support-container aria-pressed:text-on-support-container aria-pressed:enabled:hover:bg-support-container/dim-1`,`text-support`])},{intent:`accent`,design:`dashed`,class:(0,a.tw)([`enabled:hover:bg-accent/dim-5`,`enabled:active:bg-accent/dim-5`,`focus-visible:bg-accent/dim-5`,`aria-pressed:bg-accent-container aria-pressed:text-on-accent-container aria-pressed:enabled:hover:bg-accent-container/dim-1`,`text-accent`])},{intent:`success`,design:`dashed`,class:(0,a.tw)([`enabled:hover:bg-success/dim-5`,`enabled:active:bg-success/dim-5`,`focus-visible:bg-success/dim-5`,`aria-pressed:bg-success-container aria-pressed:text-on-success-container aria-pressed:enabled:hover:bg-success-container/dim-1`,`text-success`])},{intent:`alert`,design:`dashed`,class:(0,a.tw)([`enabled:hover:bg-alert/dim-5`,`enabled:active:bg-alert/dim-5`,`focus-visible:bg-alert/dim-5`,`aria-pressed:bg-alert-container aria-pressed:text-on-alert-container aria-pressed:enabled:hover:bg-alert-container/dim-1`,`text-alert`])},{intent:`danger`,design:`dashed`,class:(0,a.tw)([`enabled:hover:bg-error/dim-5`,`enabled:active:bg-error/dim-5`,`focus-visible:bg-error/dim-5`,`aria-pressed:bg-error-container aria-pressed:text-on-error-container aria-pressed:enabled:hover:bg-error-container/dim-1`,`text-error`])},{intent:`info`,design:`dashed`,class:(0,a.tw)([`enabled:hover:bg-info/dim-5`,`enabled:active:bg-info/dim-5`,`focus-visible:bg-info/dim-5`,`aria-pressed:bg-info-container aria-pressed:text-on-info-container aria-pressed:enabled:hover:bg-info-container/dim-1`,`text-info`])},{intent:`neutral`,design:`dashed`,class:(0,a.tw)([`enabled:hover:bg-neutral/dim-5`,`enabled:active:bg-neutral/dim-5`,`focus-visible:bg-neutral/dim-5`,`aria-pressed:bg-neutral-container aria-pressed:text-on-neutral-container aria-pressed:enabled:hover:bg-neutral-container/dim-1`,`text-neutral`])},{intent:`surface`,design:`dashed`,class:(0,a.tw)([`enabled:hover:bg-surface/dim-5`,`enabled:active:bg-surface/dim-5`,`focus-visible:bg-surface/dim-5`,`aria-pressed:bg-surface aria-pressed:text-on-surface aria-pressed:enabled:hover:bg-surface-hovered`,`text-surface`])},{design:`dashed`,hasClearButton:!1,class:(0,a.tw)([`px-[calc(var(--spacing-md)-var(--border-width-sm))]`])},{design:`dashed`,hasClearButton:!0,class:(0,a.tw)([`pl-[calc(var(--spacing-md)-var(--border-width-sm))]`])}],f=(0,n.cva)([`box-border inline-flex h-sz-32 flex-nowrap items-center justify-center rounded-chip text-body-1 font-regular`,`focus-visible:u-outline`,`ease-out duration-150`],{variants:{design:(0,a.makeVariants)({outlined:[`bg-transparent border-sm border-solid border-current`],tinted:[``],dashed:[`bg-transparent border-sm border-dashed shadow-none focus-visible:border-outline-high`]}),intent:(0,a.makeVariants)({main:[],support:[],accent:[],success:[],alert:[],danger:[],info:[],neutral:[],surface:[]}),disabled:{true:[`cursor-not-allowed`,`opacity-dim-3`]},hasClearButton:{true:[],false:[]}},compoundVariants:[...l,...u,...d],defaultVariants:{design:`outlined`,intent:`support`}}),p=(0,r.createContext)({}),m=()=>(0,r.useContext)(p)||{},h=e=>e?e.type.displayName:``,g=e=>(...t)=>r.Children.toArray(e).filter(r.isValidElement).find(e=>{let n=h(e);return t.includes(n||``)}),_=({onClick:t,asChild:n,pressed:r,defaultPressed:a,disabled:c,value:l,defaultValue:u,children:d,onClear:f})=>{let[p,m]=(0,o.useCombinedState)(r,a),[h]=(0,o.useCombinedState)(l,u),_=g(d),v=_(`Chip.LeadingIcon`),y=_(`Chip.TrailingIcon`),b=_(`Chip.Content`),x=_(`Chip.ClearButton`),S=(t||p)!==void 0,C=[v,b,x].every(e=>e===void 0)?(0,i.jsx)(`span`,{className:`inline-block grow truncate`,children:d}):(0,i.jsxs)(i.Fragment,{children:[v,b,v===void 0?y:null,x]}),w=e=>{x&&!c&&[`Delete`,`Backspace`].includes(e.key)&&f&&(f(),e.key===`Delete`&&(0,s.emulateTab)(),e.key===`Backspace`&&s.emulateTab.backwards())};return S?{Element:n?e.Slot:`button`,chipProps:{type:`button`,...p!==void 0&&{"aria-pressed":p,"data-state":p?`on`:`off`},onClick:e=>{p!==void 0&&m(!p),t&&t(e,{pressed:p,value:h})},onKeyDown:w,disabled:c,children:C},compoundElements:{leadingIcon:v,trailingIcon:y,content:b,clearButton:x}}:{Element:n?e.Slot:`div`,chipProps:{"aria-disabled":c,children:C,onKeyDown:w},compoundElements:{leadingIcon:v,trailingIcon:y,content:b,clearButton:x}}},v=({design:e=`outlined`,disabled:t,children:n,intent:r=`support`,defaultPressed:a,pressed:o,asChild:s,className:c,onClick:l,onClear:u,ref:d,...m})=>{let{Element:h,chipProps:{children:g,...v},compoundElements:y}=_({asChild:s,pressed:o,defaultPressed:a,onClick:l,disabled:!!t,value:m.value,defaultValue:m.defaultValue,children:n,onClear:u}),{clearButton:b}=y;return(0,i.jsx)(p,{value:{disabled:t,design:e,intent:r,onClear:u},children:(0,i.jsx)(h,{ref:d,className:f({className:c,design:e,disabled:t,intent:r,hasClearButton:!!b}),...v,...m,"data-spark-component":`chip`,children:g})})};v.displayName=`Chip`;var y=(0,n.cva)([`ml-md flex h-full items-center justify-center focus-visible:outline-hidden`],{variants:{disabled:{false:[`cursor-pointer`],true:[`cursor-not-allowed`]},isBordered:{false:[`pr-md`],true:[`pr-[7px]`]},design:{outlined:[],tinted:[],dashed:[]}},compoundVariants:[{design:`outlined`,disabled:!1,class:(0,a.tw)([`hover:opacity-dim-1`])},{design:`outlined`,disabled:!0,class:(0,a.tw)([`opacity-dim-3`])},{design:`tinted`,disabled:!1,class:(0,a.tw)([`hover:opacity-dim-1`])},{design:`tinted`,disabled:!0,class:(0,a.tw)([`opacity-dim-3`])},{design:`dashed`,disabled:!1,class:(0,a.tw)([`hover:opacity-dim-1`])},{design:`dashed`,disabled:!0,class:(0,a.tw)([`opacity-dim-3`])}]}),b=(0,n.cva)([`rounded-full p-sz-2 [font-size:var(--spacing-sz-8)] border-sm`,`focus-visible:u-outline`],{variants:{disabled:{true:[`cursor-not-allowed`],false:[`cursor-pointer`]}},defaultVariants:{disabled:!1}}),x=({children:e=(0,i.jsx)(t.t,{children:(0,i.jsx)(c.Close,{})}),tabIndex:n=0,label:a,ref:o})=>{let{design:s,disabled:l,onClear:u}=m(),d=(0,r.useCallback)(e=>{e.stopPropagation(),!l&&u&&u(e)},[l,u]);return(0,i.jsx)(`span`,{className:y({isBordered:[`outline`,`dashed`].includes(`${s}`),disabled:!!l,design:s}),onClick:d,ref:o,children:(0,i.jsx)(`button`,{tabIndex:n,type:`button`,disabled:!!l,className:b({disabled:l}),"aria-label":a,children:e&&(0,r.cloneElement)(e,{ariaLabel:a})})})};x.displayName=`Chip.ClearButton`;var S=({children:e,className:t,ref:r})=>(0,i.jsx)(`span`,{className:(0,n.cx)(`inline-block grow truncate`,t),ref:r,children:e});S.displayName=`Chip.Content`;var C=({children:e,className:t,ref:r})=>(0,i.jsx)(`span`,{className:(0,n.cx)(`flex h-full items-center justify-center`,t),ref:r,children:e});C.displayName=`Chip.Icon`;var w=({className:e,ref:t,...r})=>(0,i.jsx)(C,{className:(0,n.cx)(`mr-sm`,e),ref:t,...r});w.displayName=`Chip.LeadingIcon`;var T=({className:e,ref:t,...r})=>(0,i.jsx)(C,{className:(0,n.cx)(`ml-md`,e),ref:t,...r});T.displayName=`Chip.TrailingIcon`;var E=Object.assign(v,{Content:S,LeadingIcon:w,TrailingIcon:T,ClearButton:x});E.displayName=`Chip`,E.ClearButton.displayName=`Chip.ClearButton`,E.Content.displayName=`Chip.Content`,E.LeadingIcon.displayName=`Chip.LeadingIcon`,E.TrailingIcon.displayName=`Chip.TrailingIcon`,exports.Chip=E;
1
+ 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(`class-variance-authority`),r=require(`react`),i=require(`react/jsx-runtime`),a=require(`@spark-ui/internal-utils`),o=require(`@spark-ui/hooks/use-combined-state`),s=require(`emulate-tab`),c=require(`@spark-ui/icons/Close`);var l=[{design:`outlined`,intent:`main`,class:(0,a.tw)([`enabled:hover:bg-main/dim-5`,`enabled:active:bg-main/dim-5`,`focus-visible:bg-main/dim-5`,`aria-pressed:bg-main-container aria-pressed:text-on-main-container aria-pressed:enabled:hover:bg-main-container/dim-1`,`text-main`])},{design:`outlined`,intent:`support`,class:(0,a.tw)([`enabled:hover:bg-support/dim-5`,`enabled:active:bg-support/dim-5`,`focus-visible:bg-support/dim-5`,`aria-pressed:bg-support-container aria-pressed:text-on-support-container aria-pressed:enabled:hover:bg-support-container/dim-1`,`text-support`])},{intent:`accent`,design:`outlined`,class:(0,a.tw)([`enabled:hover:bg-accent/dim-5`,`enabled:active:bg-accent/dim-5`,`focus-visible:bg-accent/dim-5`,`aria-pressed:bg-accent-container`,`aria-pressed:bg-accent-container aria-pressed:text-on-accent-container aria-pressed:enabled:hover:bg-accent-container/dim-1`,`text-accent`])},{design:`outlined`,intent:`success`,class:(0,a.tw)([`enabled:hover:bg-success/dim-5`,`enabled:active:bg-success/dim-5`,`focus-visible:bg-success/dim-5`,`aria-pressed:bg-success-container aria-pressed:text-on-success-container aria-pressed:enabled:hover:bg-success-container/dim-1`,`text-success`])},{intent:`alert`,design:`outlined`,class:(0,a.tw)([`enabled:hover:bg-alert/dim-5`,`enabled:active:bg-alert/dim-5`,`focus-visible:bg-alert/dim-5`,`aria-pressed:bg-alert-container aria-pressed:text-on-alert-container aria-pressed:enabled:hover:bg-alert-container/dim-1`,`text-alert`])},{design:`outlined`,intent:`danger`,class:(0,a.tw)([`enabled:hover:bg-error/dim-5`,`enabled:active:bg-error/dim-5`,`focus-visible:bg-error/dim-5`,`aria-pressed:bg-error-container aria-pressed:text-on-error-container aria-pressed:enabled:hover:bg-error-container/dim-1`,`text-error`])},{design:`outlined`,intent:`info`,class:(0,a.tw)([`enabled:hover:bg-info/dim-5`,`enabled:active:bg-info/dim-5`,`focus-visible:bg-info/dim-5`,`aria-pressed:bg-info-container aria-pressed:text-on-info-container aria-pressed:enabled:hover:bg-info-container/dim-1`,`text-info`])},{design:`outlined`,intent:`neutral`,class:(0,a.tw)([`enabled:hover:bg-neutral/dim-5`,`enabled:active:bg-neutral/dim-5`,`focus-visible:bg-neutral/dim-5`,`aria-pressed:bg-neutral-container aria-pressed:text-on-neutral-container aria-pressed:enabled:hover:bg-neutral-container/dim-1`,`text-neutral`])},{design:`outlined`,intent:`surface`,class:(0,a.tw)([`enabled:hover:bg-surface/dim-5`,`enabled:active:bg-surface/dim-5`,`focus-visible:bg-surface/dim-5`,`aria-pressed:bg-surface aria-pressed:text-on-surface aria-pressed:enabled:hover:bg-surface-hovered`,`text-surface`])},{design:`outlined`,hasClearButton:!1,class:(0,a.tw)([`px-[calc(var(--spacing-md)-var(--border-width-sm))]`])},{design:`outlined`,hasClearButton:!0,class:(0,a.tw)([`pl-[calc(var(--spacing-md)-var(--border-width-sm))]`])}],u=[{intent:`main`,design:`tinted`,class:(0,a.tw)([`bg-main-container`,`enabled:hover:bg-main-container-hovered`,`enabled:active:bg-main-container-hovered`,`focus-visible:bg-main-container-hovered`,`aria-pressed:bg-main aria-pressed:text-on-main aria-pressed:enabled:hover:bg-main/dim-1`,`text-on-main-container`])},{intent:`support`,design:`tinted`,class:(0,a.tw)([`bg-support-container`,`enabled:hover:bg-support-container-hovered`,`enabled:active:bg-support-container-hovered`,`focus-visible:bg-support-container-hovered`,`aria-pressed:bg-support aria-pressed:text-on-support aria-pressed:enabled:hover:bg-support/dim-1`,`text-on-support-container`])},{intent:`accent`,design:`tinted`,class:(0,a.tw)([`bg-accent-container`,`enabled:hover:bg-accent-container-hovered`,`enabled:active:bg-accent-container-hovered`,`focus-visible:bg-accent-container-hovered`,`aria-pressed:bg-accent aria-pressed:text-on-accent aria-pressed:enabled:hover:bg-accent/dim-1`,`text-on-accent-container`])},{intent:`success`,design:`tinted`,class:(0,a.tw)([`bg-success-container`,`enabled:hover:bg-success-container-hovered`,`enabled:active:bg-success-container-hovered`,`focus-visible:bg-success-container-hovered`,`aria-pressed:bg-success aria-pressed:text-on-success aria-pressed:enabled:hover:bg-success/dim-1`,`text-on-success-container`])},{intent:`alert`,design:`tinted`,class:(0,a.tw)([`bg-alert-container`,`enabled:hover:bg-alert-container-hovered`,`enabled:active:bg-alert-container-hovered`,`focus-visible:bg-alert-container-hovered`,`aria-pressed:bg-alert aria-pressed:text-on-alert aria-pressed:enabled:hover:bg-alert/dim-1`,`text-on-alert-container`])},{intent:`danger`,design:`tinted`,class:(0,a.tw)([`bg-error-container`,`enabled:hover:bg-error-container-hovered`,`enabled:active:bg-error-container-hovered`,`focus-visible:bg-error-container-hovered`,`aria-pressed:bg-error aria-pressed:text-on-error aria-pressed:enabled:hover:bg-error/dim-1`,`text-on-error-container`])},{intent:`info`,design:`tinted`,class:(0,a.tw)([`bg-info-container`,`enabled:hover:bg-info-container-hovered`,`enabled:active:bg-info-container-hovered`,`focus-visible:bg-info-container-hovered`,`aria-pressed:bg-info aria-pressed:text-on-info aria-pressed:enabled:hover:bg-info/dim-1`,`text-on-info-container`])},{intent:`neutral`,design:`tinted`,class:(0,a.tw)([`bg-neutral-container`,`enabled:hover:bg-neutral-container-hovered`,`enabled:active:bg-neutral-container-hovered`,`focus-visible:bg-neutral-container-hovered`,`aria-pressed:bg-neutral aria-pressed:text-on-neutral aria-pressed:enabled:hover:bg-neutral/dim-1`,`text-on-neutral-container`])},{intent:`surface`,design:`tinted`,class:(0,a.tw)([`bg-surface/dim-1`,`enabled:hover:bg-surface-hovered/dim-1`,`enabled:active:bg-surface-hovered/dim-1`,`focus-visible:bg-surface-hovered/dim-1`,`aria-pressed:bg-surface aria-pressed:text-on-surface aria-pressed:enabled:hover:bg-surface-hovered`,`text-on-surface/dim-1`])},{design:`tinted`,hasClearButton:!1,class:(0,a.tw)([`px-md`])},{design:`tinted`,hasClearButton:!0,class:(0,a.tw)([`pl-md`])}],d=[{intent:`main`,design:`dashed`,class:(0,a.tw)([`enabled:hover:bg-main/dim-5`,`enabled:active:bg-main/dim-5`,`focus-visible:bg-main/dim-5`,`aria-pressed:bg-main-container aria-pressed:text-on-main-container aria-pressed:enabled:hover:bg-main-container/dim-1`,`text-main`])},{intent:`support`,design:`dashed`,class:(0,a.tw)([`enabled:hover:bg-support/dim-5`,`enabled:active:bg-support/dim-5`,`focus-visible:bg-support/dim-5`,`aria-pressed:bg-support-container aria-pressed:text-on-support-container aria-pressed:enabled:hover:bg-support-container/dim-1`,`text-support`])},{intent:`accent`,design:`dashed`,class:(0,a.tw)([`enabled:hover:bg-accent/dim-5`,`enabled:active:bg-accent/dim-5`,`focus-visible:bg-accent/dim-5`,`aria-pressed:bg-accent-container aria-pressed:text-on-accent-container aria-pressed:enabled:hover:bg-accent-container/dim-1`,`text-accent`])},{intent:`success`,design:`dashed`,class:(0,a.tw)([`enabled:hover:bg-success/dim-5`,`enabled:active:bg-success/dim-5`,`focus-visible:bg-success/dim-5`,`aria-pressed:bg-success-container aria-pressed:text-on-success-container aria-pressed:enabled:hover:bg-success-container/dim-1`,`text-success`])},{intent:`alert`,design:`dashed`,class:(0,a.tw)([`enabled:hover:bg-alert/dim-5`,`enabled:active:bg-alert/dim-5`,`focus-visible:bg-alert/dim-5`,`aria-pressed:bg-alert-container aria-pressed:text-on-alert-container aria-pressed:enabled:hover:bg-alert-container/dim-1`,`text-alert`])},{intent:`danger`,design:`dashed`,class:(0,a.tw)([`enabled:hover:bg-error/dim-5`,`enabled:active:bg-error/dim-5`,`focus-visible:bg-error/dim-5`,`aria-pressed:bg-error-container aria-pressed:text-on-error-container aria-pressed:enabled:hover:bg-error-container/dim-1`,`text-error`])},{intent:`info`,design:`dashed`,class:(0,a.tw)([`enabled:hover:bg-info/dim-5`,`enabled:active:bg-info/dim-5`,`focus-visible:bg-info/dim-5`,`aria-pressed:bg-info-container aria-pressed:text-on-info-container aria-pressed:enabled:hover:bg-info-container/dim-1`,`text-info`])},{intent:`neutral`,design:`dashed`,class:(0,a.tw)([`enabled:hover:bg-neutral/dim-5`,`enabled:active:bg-neutral/dim-5`,`focus-visible:bg-neutral/dim-5`,`aria-pressed:bg-neutral-container aria-pressed:text-on-neutral-container aria-pressed:enabled:hover:bg-neutral-container/dim-1`,`text-neutral`])},{intent:`surface`,design:`dashed`,class:(0,a.tw)([`enabled:hover:bg-surface/dim-5`,`enabled:active:bg-surface/dim-5`,`focus-visible:bg-surface/dim-5`,`aria-pressed:bg-surface aria-pressed:text-on-surface aria-pressed:enabled:hover:bg-surface-hovered`,`text-surface`])},{design:`dashed`,hasClearButton:!1,class:(0,a.tw)([`px-[calc(var(--spacing-md)-var(--border-width-sm))]`])},{design:`dashed`,hasClearButton:!0,class:(0,a.tw)([`pl-[calc(var(--spacing-md)-var(--border-width-sm))]`])}],f=(0,n.cva)([`box-border inline-flex h-sz-32 flex-nowrap items-center justify-center rounded-chip text-body-1 font-regular`,`focus-visible:u-outline`,`ease-out duration-150`],{variants:{design:(0,a.makeVariants)({outlined:[`bg-transparent border-sm border-solid border-current`],tinted:[``],dashed:[`bg-transparent border-sm border-dashed shadow-none focus-visible:border-outline-high`]}),intent:(0,a.makeVariants)({main:[],support:[],accent:[],success:[],alert:[],danger:[],info:[],neutral:[],surface:[]}),disabled:{true:[`cursor-not-allowed`,`opacity-dim-3`]},hasClearButton:{true:[],false:[]}},compoundVariants:[...l,...u,...d],defaultVariants:{design:`outlined`,intent:`support`}}),p=(0,r.createContext)({}),m=()=>(0,r.useContext)(p)||{},h=e=>e?e.type.displayName:``,g=e=>(...t)=>r.Children.toArray(e).filter(r.isValidElement).find(e=>{let n=h(e);return t.includes(n||``)}),_=({onClick:t,asChild:n,pressed:r,defaultPressed:a,disabled:c,value:l,defaultValue:u,children:d,onClear:f})=>{let[p,m]=(0,o.useCombinedState)(r,a),[h]=(0,o.useCombinedState)(l,u),_=g(d),v=_(`Chip.LeadingIcon`),y=_(`Chip.TrailingIcon`),b=_(`Chip.Content`),x=_(`Chip.ClearButton`),S=(t||p)!==void 0,C=[v,b,x].every(e=>e===void 0)?(0,i.jsx)(`span`,{className:`inline-block grow truncate`,children:d}):(0,i.jsxs)(i.Fragment,{children:[v,b,x===void 0?y:null,x]}),w=e=>{x&&!c&&[`Delete`,`Backspace`].includes(e.key)&&f&&(f(),e.key===`Delete`&&(0,s.emulateTab)(),e.key===`Backspace`&&s.emulateTab.backwards())};return S?{Element:n?e.Slot:`button`,chipProps:{type:`button`,...p!==void 0&&{"aria-pressed":p,"data-state":p?`on`:`off`},onClick:e=>{p!==void 0&&m(!p),t&&t(e,{pressed:p,value:h})},onKeyDown:w,disabled:c,children:C},compoundElements:{leadingIcon:v,trailingIcon:y,content:b,clearButton:x}}:{Element:n?e.Slot:`div`,chipProps:{"aria-disabled":c,children:C,onKeyDown:w},compoundElements:{leadingIcon:v,trailingIcon:y,content:b,clearButton:x}}},v=({design:e=`outlined`,disabled:t,children:n,intent:r=`support`,defaultPressed:a,pressed:o,asChild:s,className:c,onClick:l,onClear:u,ref:d,...m})=>{let{Element:h,chipProps:{children:g,...v},compoundElements:y}=_({asChild:s,pressed:o,defaultPressed:a,onClick:l,disabled:!!t,value:m.value,defaultValue:m.defaultValue,children:n,onClear:u}),{clearButton:b}=y;return(0,i.jsx)(p,{value:{disabled:t,design:e,intent:r,onClear:u},children:(0,i.jsx)(h,{ref:d,className:f({className:c,design:e,disabled:t,intent:r,hasClearButton:!!b}),...v,...m,"data-spark-component":`chip`,children:g})})};v.displayName=`Chip`;var y=(0,n.cva)([`ml-md flex h-full items-center justify-center focus-visible:outline-hidden`],{variants:{disabled:{false:[`cursor-pointer`],true:[`cursor-not-allowed`]},isBordered:{false:[`pr-md`],true:[`pr-[7px]`]},design:{outlined:[],tinted:[],dashed:[]}},compoundVariants:[{design:`outlined`,disabled:!1,class:(0,a.tw)([`hover:opacity-dim-1`])},{design:`outlined`,disabled:!0,class:(0,a.tw)([`opacity-dim-3`])},{design:`tinted`,disabled:!1,class:(0,a.tw)([`hover:opacity-dim-1`])},{design:`tinted`,disabled:!0,class:(0,a.tw)([`opacity-dim-3`])},{design:`dashed`,disabled:!1,class:(0,a.tw)([`hover:opacity-dim-1`])},{design:`dashed`,disabled:!0,class:(0,a.tw)([`opacity-dim-3`])}]}),b=(0,n.cva)([`rounded-full p-sz-2 [font-size:var(--spacing-sz-8)] border-sm`,`focus-visible:u-outline`],{variants:{disabled:{true:[`cursor-not-allowed`],false:[`cursor-pointer`]}},defaultVariants:{disabled:!1}}),x=({children:e=(0,i.jsx)(t.t,{children:(0,i.jsx)(c.Close,{})}),tabIndex:n=0,label:a,ref:o})=>{let{design:s,disabled:l,onClear:u}=m(),d=(0,r.useCallback)(e=>{e.stopPropagation(),!l&&u&&u(e)},[l,u]);return(0,i.jsx)(`span`,{className:y({isBordered:[`outline`,`dashed`].includes(`${s}`),disabled:!!l,design:s}),onClick:d,ref:o,children:(0,i.jsx)(`button`,{tabIndex:n,type:`button`,disabled:!!l,className:b({disabled:l}),"aria-label":a,children:e&&(0,r.cloneElement)(e,{ariaLabel:a})})})};x.displayName=`Chip.ClearButton`;var S=({children:e,className:t,ref:r})=>(0,i.jsx)(`span`,{className:(0,n.cx)(`inline-block grow truncate`,t),ref:r,children:e});S.displayName=`Chip.Content`;var C=({children:e,className:t,ref:r})=>(0,i.jsx)(`span`,{className:(0,n.cx)(`flex h-full items-center justify-center`,t),ref:r,children:e});C.displayName=`Chip.Icon`;var w=({className:e,ref:t,...r})=>(0,i.jsx)(C,{className:(0,n.cx)(`mr-sm`,e),ref:t,...r});w.displayName=`Chip.LeadingIcon`;var T=({className:e,ref:t,...r})=>(0,i.jsx)(C,{className:(0,n.cx)(`ml-md`,e),ref:t,...r});T.displayName=`Chip.TrailingIcon`;var E=Object.assign(v,{Content:S,LeadingIcon:w,TrailingIcon:T,ClearButton:x});E.displayName=`Chip`,E.ClearButton.displayName=`Chip.ClearButton`,E.Content.displayName=`Chip.Content`,E.LeadingIcon.displayName=`Chip.LeadingIcon`,E.TrailingIcon.displayName=`Chip.TrailingIcon`,exports.Chip=E;
2
2
  //# sourceMappingURL=index.js.map
package/dist/chip/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":[],"sources":["../../src/chip/variants/outlined.ts","../../src/chip/variants/tinted.ts","../../src/chip/variants/dashed.ts","../../src/chip/Chip.styles.tsx","../../src/chip/useChipContext.tsx","../../src/chip/useChipElement.tsx","../../src/chip/Chip.tsx","../../src/chip/ChipClearButton.styles.tsx","../../src/chip/ChipClearButton.tsx","../../src/chip/ChipContent.tsx","../../src/chip/ChipIcon.tsx","../../src/chip/ChipLeadingIcon.tsx","../../src/chip/ChipTrailingIcon.tsx","../../src/chip/index.ts"],"sourcesContent":["import { tw } from '@spark-ui/internal-utils'\n\nexport const outlinedVariants = [\n /** Intents **/\n {\n design: 'outlined',\n intent: 'main',\n class: tw([\n 'enabled:hover:bg-main/dim-5',\n 'enabled:active:bg-main/dim-5',\n 'focus-visible:bg-main/dim-5',\n 'aria-pressed:bg-main-container aria-pressed:text-on-main-container aria-pressed:enabled:hover:bg-main-container/dim-1',\n 'text-main',\n ]),\n },\n {\n design: 'outlined',\n intent: 'support',\n class: tw([\n 'enabled:hover:bg-support/dim-5',\n 'enabled:active:bg-support/dim-5',\n 'focus-visible:bg-support/dim-5',\n 'aria-pressed:bg-support-container aria-pressed:text-on-support-container aria-pressed:enabled:hover:bg-support-container/dim-1',\n 'text-support',\n ]),\n },\n {\n intent: 'accent',\n design: 'outlined',\n class: tw([\n 'enabled:hover:bg-accent/dim-5',\n 'enabled:active:bg-accent/dim-5',\n 'focus-visible:bg-accent/dim-5',\n 'aria-pressed:bg-accent-container',\n 'aria-pressed:bg-accent-container aria-pressed:text-on-accent-container aria-pressed:enabled:hover:bg-accent-container/dim-1',\n 'text-accent',\n ]),\n },\n {\n design: 'outlined',\n intent: 'success',\n class: tw([\n 'enabled:hover:bg-success/dim-5',\n 'enabled:active:bg-success/dim-5',\n 'focus-visible:bg-success/dim-5',\n 'aria-pressed:bg-success-container aria-pressed:text-on-success-container aria-pressed:enabled:hover:bg-success-container/dim-1',\n 'text-success',\n ]),\n },\n {\n intent: 'alert',\n design: 'outlined',\n class: tw([\n 'enabled:hover:bg-alert/dim-5',\n 'enabled:active:bg-alert/dim-5',\n 'focus-visible:bg-alert/dim-5',\n 'aria-pressed:bg-alert-container aria-pressed:text-on-alert-container aria-pressed:enabled:hover:bg-alert-container/dim-1',\n 'text-alert',\n ]),\n },\n {\n design: 'outlined',\n intent: 'danger',\n class: tw([\n 'enabled:hover:bg-error/dim-5',\n 'enabled:active:bg-error/dim-5',\n 'focus-visible:bg-error/dim-5',\n 'aria-pressed:bg-error-container aria-pressed:text-on-error-container aria-pressed:enabled:hover:bg-error-container/dim-1',\n 'text-error',\n ]),\n },\n {\n design: 'outlined',\n intent: 'info',\n class: tw([\n 'enabled:hover:bg-info/dim-5',\n 'enabled:active:bg-info/dim-5',\n 'focus-visible:bg-info/dim-5',\n 'aria-pressed:bg-info-container aria-pressed:text-on-info-container aria-pressed:enabled:hover:bg-info-container/dim-1',\n 'text-info',\n ]),\n },\n {\n design: 'outlined',\n intent: 'neutral',\n class: tw([\n 'enabled:hover:bg-neutral/dim-5',\n 'enabled:active:bg-neutral/dim-5',\n 'focus-visible:bg-neutral/dim-5',\n 'aria-pressed:bg-neutral-container aria-pressed:text-on-neutral-container aria-pressed:enabled:hover:bg-neutral-container/dim-1',\n 'text-neutral',\n ]),\n },\n {\n design: 'outlined',\n intent: 'surface',\n class: tw([\n 'enabled:hover:bg-surface/dim-5',\n 'enabled:active:bg-surface/dim-5',\n 'focus-visible:bg-surface/dim-5',\n 'aria-pressed:bg-surface aria-pressed:text-on-surface aria-pressed:enabled:hover:bg-surface-hovered',\n 'text-surface',\n ]),\n },\n /** Spacings **/\n {\n design: 'outlined',\n hasClearButton: false,\n class: tw(['px-[calc(var(--spacing-md)-var(--border-width-sm))]']),\n },\n {\n design: 'outlined',\n hasClearButton: true,\n class: tw(['pl-[calc(var(--spacing-md)-var(--border-width-sm))]']),\n },\n] as const\n","import { tw } from '@spark-ui/internal-utils'\n\nexport const tintedVariants = [\n /** Intents **/\n {\n intent: 'main',\n design: 'tinted',\n class: tw([\n 'bg-main-container',\n 'enabled:hover:bg-main-container-hovered',\n 'enabled:active:bg-main-container-hovered',\n 'focus-visible:bg-main-container-hovered',\n 'aria-pressed:bg-main aria-pressed:text-on-main aria-pressed:enabled:hover:bg-main/dim-1',\n 'text-on-main-container',\n ]),\n },\n {\n intent: 'support',\n design: 'tinted',\n class: tw([\n 'bg-support-container',\n 'enabled:hover:bg-support-container-hovered',\n 'enabled:active:bg-support-container-hovered',\n 'focus-visible:bg-support-container-hovered',\n 'aria-pressed:bg-support aria-pressed:text-on-support aria-pressed:enabled:hover:bg-support/dim-1',\n 'text-on-support-container',\n ]),\n },\n {\n intent: 'accent',\n design: 'tinted',\n class: tw([\n 'bg-accent-container',\n 'enabled:hover:bg-accent-container-hovered',\n 'enabled:active:bg-accent-container-hovered',\n 'focus-visible:bg-accent-container-hovered',\n 'aria-pressed:bg-accent aria-pressed:text-on-accent aria-pressed:enabled:hover:bg-accent/dim-1',\n 'text-on-accent-container',\n ]),\n },\n {\n intent: 'success',\n design: 'tinted',\n class: tw([\n 'bg-success-container',\n 'enabled:hover:bg-success-container-hovered',\n 'enabled:active:bg-success-container-hovered',\n 'focus-visible:bg-success-container-hovered',\n 'aria-pressed:bg-success aria-pressed:text-on-success aria-pressed:enabled:hover:bg-success/dim-1',\n 'text-on-success-container',\n ]),\n },\n {\n intent: 'alert',\n design: 'tinted',\n class: tw([\n 'bg-alert-container',\n 'enabled:hover:bg-alert-container-hovered',\n 'enabled:active:bg-alert-container-hovered',\n 'focus-visible:bg-alert-container-hovered',\n 'aria-pressed:bg-alert aria-pressed:text-on-alert aria-pressed:enabled:hover:bg-alert/dim-1',\n 'text-on-alert-container',\n ]),\n },\n {\n intent: 'danger',\n design: 'tinted',\n class: tw([\n 'bg-error-container',\n 'enabled:hover:bg-error-container-hovered',\n 'enabled:active:bg-error-container-hovered',\n 'focus-visible:bg-error-container-hovered',\n 'aria-pressed:bg-error aria-pressed:text-on-error aria-pressed:enabled:hover:bg-error/dim-1',\n 'text-on-error-container',\n ]),\n },\n {\n intent: 'info',\n design: 'tinted',\n class: tw([\n 'bg-info-container',\n 'enabled:hover:bg-info-container-hovered',\n 'enabled:active:bg-info-container-hovered',\n 'focus-visible:bg-info-container-hovered',\n 'aria-pressed:bg-info aria-pressed:text-on-info aria-pressed:enabled:hover:bg-info/dim-1',\n 'text-on-info-container',\n ]),\n },\n {\n intent: 'neutral',\n design: 'tinted',\n class: tw([\n 'bg-neutral-container',\n 'enabled:hover:bg-neutral-container-hovered',\n 'enabled:active:bg-neutral-container-hovered',\n 'focus-visible:bg-neutral-container-hovered',\n 'aria-pressed:bg-neutral aria-pressed:text-on-neutral aria-pressed:enabled:hover:bg-neutral/dim-1',\n 'text-on-neutral-container',\n ]),\n },\n {\n intent: 'surface',\n design: 'tinted',\n class: tw([\n 'bg-surface/dim-1',\n 'enabled:hover:bg-surface-hovered/dim-1',\n 'enabled:active:bg-surface-hovered/dim-1',\n 'focus-visible:bg-surface-hovered/dim-1',\n 'aria-pressed:bg-surface aria-pressed:text-on-surface aria-pressed:enabled:hover:bg-surface-hovered',\n 'text-on-surface/dim-1',\n ]),\n },\n /** Spacings **/\n {\n design: 'tinted',\n hasClearButton: false,\n class: tw(['px-md']),\n },\n {\n design: 'tinted',\n hasClearButton: true,\n class: tw(['pl-md']),\n },\n] as const\n","import { tw } from '@spark-ui/internal-utils'\n\nexport const dashedVariants = [\n /** Intents **/\n {\n intent: 'main',\n design: 'dashed',\n class: tw([\n 'enabled:hover:bg-main/dim-5',\n 'enabled:active:bg-main/dim-5',\n 'focus-visible:bg-main/dim-5',\n 'aria-pressed:bg-main-container aria-pressed:text-on-main-container aria-pressed:enabled:hover:bg-main-container/dim-1',\n 'text-main',\n ]),\n },\n {\n intent: 'support',\n design: 'dashed',\n class: tw([\n 'enabled:hover:bg-support/dim-5',\n 'enabled:active:bg-support/dim-5',\n 'focus-visible:bg-support/dim-5',\n 'aria-pressed:bg-support-container aria-pressed:text-on-support-container aria-pressed:enabled:hover:bg-support-container/dim-1',\n 'text-support',\n ]),\n },\n {\n intent: 'accent',\n design: 'dashed',\n class: tw([\n 'enabled:hover:bg-accent/dim-5',\n 'enabled:active:bg-accent/dim-5',\n 'focus-visible:bg-accent/dim-5',\n 'aria-pressed:bg-accent-container aria-pressed:text-on-accent-container aria-pressed:enabled:hover:bg-accent-container/dim-1',\n 'text-accent',\n ]),\n },\n {\n intent: 'success',\n design: 'dashed',\n class: tw([\n 'enabled:hover:bg-success/dim-5',\n 'enabled:active:bg-success/dim-5',\n 'focus-visible:bg-success/dim-5',\n 'aria-pressed:bg-success-container aria-pressed:text-on-success-container aria-pressed:enabled:hover:bg-success-container/dim-1',\n 'text-success',\n ]),\n },\n {\n intent: 'alert',\n design: 'dashed',\n class: tw([\n 'enabled:hover:bg-alert/dim-5',\n 'enabled:active:bg-alert/dim-5',\n 'focus-visible:bg-alert/dim-5',\n 'aria-pressed:bg-alert-container aria-pressed:text-on-alert-container aria-pressed:enabled:hover:bg-alert-container/dim-1',\n 'text-alert',\n ]),\n },\n {\n intent: 'danger',\n design: 'dashed',\n class: tw([\n 'enabled:hover:bg-error/dim-5',\n 'enabled:active:bg-error/dim-5',\n 'focus-visible:bg-error/dim-5',\n 'aria-pressed:bg-error-container aria-pressed:text-on-error-container aria-pressed:enabled:hover:bg-error-container/dim-1',\n 'text-error',\n ]),\n },\n {\n intent: 'info',\n design: 'dashed',\n class: tw([\n 'enabled:hover:bg-info/dim-5',\n 'enabled:active:bg-info/dim-5',\n 'focus-visible:bg-info/dim-5',\n 'aria-pressed:bg-info-container aria-pressed:text-on-info-container aria-pressed:enabled:hover:bg-info-container/dim-1',\n 'text-info',\n ]),\n },\n {\n intent: 'neutral',\n design: 'dashed',\n class: tw([\n 'enabled:hover:bg-neutral/dim-5',\n 'enabled:active:bg-neutral/dim-5',\n 'focus-visible:bg-neutral/dim-5',\n 'aria-pressed:bg-neutral-container aria-pressed:text-on-neutral-container aria-pressed:enabled:hover:bg-neutral-container/dim-1',\n 'text-neutral',\n ]),\n },\n {\n intent: 'surface',\n design: 'dashed',\n class: tw([\n 'enabled:hover:bg-surface/dim-5',\n 'enabled:active:bg-surface/dim-5',\n 'focus-visible:bg-surface/dim-5',\n 'aria-pressed:bg-surface aria-pressed:text-on-surface aria-pressed:enabled:hover:bg-surface-hovered',\n 'text-surface',\n ]),\n },\n /** Spacings **/\n {\n design: 'dashed',\n hasClearButton: false,\n class: tw(['px-[calc(var(--spacing-md)-var(--border-width-sm))]']),\n },\n {\n design: 'dashed',\n hasClearButton: true,\n class: tw(['pl-[calc(var(--spacing-md)-var(--border-width-sm))]']),\n },\n] as const\n","import { makeVariants } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nimport { dashedVariants, outlinedVariants, tintedVariants } from './variants'\n\nexport const chipStyles = cva(\n [\n 'box-border inline-flex h-sz-32 flex-nowrap items-center justify-center rounded-chip text-body-1 font-regular',\n 'focus-visible:u-outline',\n 'ease-out duration-150',\n ],\n {\n variants: {\n /**\n * Main style of the chip.\n *\n * - `filled`: Chip will be plain.\n *\n * - `outlined`: Chip will be transparent with an outline.\n *\n * - `tinted`: Chip will be filled but using a lighter color scheme.\n *\n * - `dashed`: Chip will be transparent with an outline dashed.\n */\n design: makeVariants<'design', ['outlined', 'tinted', 'dashed']>({\n outlined: ['bg-transparent border-sm border-solid border-current'],\n tinted: [''],\n dashed: [\n 'bg-transparent border-sm border-dashed shadow-none focus-visible:border-outline-high',\n ],\n }),\n /**\n * Color scheme of the chip.\n */\n intent: makeVariants<\n 'intent',\n ['main', 'support', 'accent', 'success', 'alert', 'danger', 'info', 'neutral', 'surface']\n >({\n main: [],\n support: [],\n accent: [],\n success: [],\n alert: [],\n danger: [],\n info: [],\n neutral: [],\n surface: [],\n }),\n /**\n * Disable the chip, preventing user interaction and adding opacity.\n */\n disabled: {\n true: ['cursor-not-allowed', 'opacity-dim-3'],\n },\n hasClearButton: {\n true: [],\n false: [],\n },\n // 'pl-[calc(var(--spacing-md)-(var(--border-width-sm)))]'\n },\n compoundVariants: [...outlinedVariants, ...tintedVariants, ...dashedVariants],\n defaultVariants: {\n design: 'outlined',\n intent: 'support',\n },\n }\n)\n\nexport type ChipStylesProps = VariantProps<typeof chipStyles>\n","import { createContext, useContext } from 'react'\n\nimport { type ChipProps } from './Chip'\n\nexport type ChipsContextType = Pick<ChipProps, 'disabled' | 'design' | 'intent' | 'onClear'>\n\nexport const ChipContext = createContext<ChipsContextType>({} as ChipsContextType)\nexport const useChipContext = () => useContext(ChipContext) || {}\n","import { useCombinedState } from '@spark-ui/hooks/use-combined-state'\nimport { emulateTab } from 'emulate-tab'\nimport {\n Children,\n ElementType,\n FC,\n ForwardRefExoticComponent,\n HTMLAttributes,\n isValidElement,\n KeyboardEvent,\n MouseEvent,\n ReactElement,\n ReactNode,\n RefAttributes,\n} from 'react'\n\nimport { Slot } from '../slot'\n\ninterface ReturnedValue {\n Element:\n | ForwardRefExoticComponent<\n HTMLAttributes<HTMLElement> & {\n children?: ReactNode\n } & RefAttributes<HTMLElement>\n >\n | ElementType\n chipProps:\n | {\n type: 'button'\n 'aria-pressed'?: boolean\n 'data-state'?: 'on' | 'off'\n onClick: (event: MouseEvent<HTMLButtonElement>) => void\n onKeyDown?: (event: KeyboardEvent<HTMLButtonElement>) => void\n disabled?: boolean\n children: ReactNode\n }\n | {\n 'aria-disabled'?: boolean\n children: ReactNode\n onKeyDown?: (event: KeyboardEvent<HTMLButtonElement>) => void\n }\n compoundElements: {\n leadingIcon: ReactNode\n trailingIcon: ReactNode\n content: ReactNode\n clearButton: ReactNode\n }\n}\n\nconst getDisplayName = (element?: ReactElement) => {\n return element ? (element.type as FC).displayName : ''\n}\n\nconst findElement =\n (children: ReactNode) =>\n (...values: string[]) => {\n const validChildren = Children.toArray(children).filter(isValidElement)\n\n return validChildren.find(child => {\n const displayName = getDisplayName(child)\n\n return values.includes(displayName || '')\n })\n }\n\nexport const useChipElement = ({\n onClick,\n asChild,\n pressed,\n defaultPressed,\n disabled,\n value,\n defaultValue,\n children,\n onClear,\n}: {\n onClick?: (\n event: MouseEvent<HTMLButtonElement>,\n args: { pressed: boolean; value?: string | number | readonly string[] }\n ) => void\n onKeyDown?: (event: KeyboardEvent<HTMLButtonElement>) => void\n asChild?: boolean\n pressed?: boolean\n defaultPressed?: boolean\n value?: string | number | readonly string[]\n defaultValue?: string | number | readonly string[]\n disabled?: boolean\n children?: ReactNode\n onClear?: (event?: MouseEvent<HTMLButtonElement>) => void\n}): ReturnedValue => {\n const [isPressed, setIsPressed] = useCombinedState<boolean | undefined>(pressed, defaultPressed)\n const [innerValue] = useCombinedState<string | number | readonly string[] | undefined>(\n value,\n defaultValue\n )\n\n const findChipElement = findElement(children)\n\n const leadingIcon = findChipElement('Chip.LeadingIcon')\n const trailingIcon = findChipElement('Chip.TrailingIcon')\n const content = findChipElement('Chip.Content')\n const clearButton = findChipElement('Chip.ClearButton')\n\n const isButton = (onClick || isPressed) !== undefined\n\n const formattedChildren = [leadingIcon, content, clearButton].every(\n element => element === undefined\n ) ? (\n <span className=\"inline-block grow truncate\">{children}</span>\n ) : (\n <>\n {leadingIcon}\n {content}\n {leadingIcon === undefined ? trailingIcon : null}\n {clearButton}\n </>\n )\n\n const onKeyDown = (event: KeyboardEvent<HTMLButtonElement>): void => {\n if (!!clearButton && !disabled && ['Delete', 'Backspace'].includes(event.key)) {\n if (onClear) {\n onClear()\n event.key === 'Delete' && emulateTab()\n event.key === 'Backspace' && emulateTab.backwards()\n }\n }\n }\n\n if (isButton) {\n return {\n Element: asChild ? Slot : 'button',\n chipProps: {\n type: 'button',\n ...(isPressed !== undefined && {\n 'aria-pressed': isPressed,\n 'data-state': isPressed ? 'on' : 'off',\n }),\n onClick: (event: MouseEvent<HTMLButtonElement>): void => {\n isPressed !== undefined && setIsPressed(!isPressed)\n onClick && onClick(event, { pressed: isPressed as boolean, value: innerValue })\n },\n onKeyDown,\n disabled,\n children: formattedChildren,\n },\n compoundElements: {\n leadingIcon,\n trailingIcon,\n content,\n clearButton,\n },\n }\n }\n\n return {\n Element: asChild ? Slot : 'div',\n chipProps: {\n 'aria-disabled': disabled,\n children: formattedChildren,\n onKeyDown,\n },\n compoundElements: {\n leadingIcon,\n trailingIcon,\n content,\n clearButton,\n },\n }\n}\n","import { ComponentPropsWithoutRef, MouseEvent, Ref } from 'react'\n\nimport { chipStyles, type ChipStylesProps } from './Chip.styles'\nimport { ChipContext } from './useChipContext'\nimport { useChipElement } from './useChipElement'\n\ntype ChipPrimitiveProps = Omit<ComponentPropsWithoutRef<'button'>, 'onClick' | 'disabled' | 'type'>\n\nexport interface ChipProps extends ChipPrimitiveProps, Omit<ChipStylesProps, 'hasClearButton'> {\n /**\n * Configures a toggleButton aria-pressed initial value\n */\n defaultPressed?: boolean\n /**\n * Configures a toggleButton aria-pressed value\n */\n pressed?: boolean\n /**\n * Change the component to the HTML tag or custom component of the only child.\n */\n asChild?: boolean\n /**\n * Event handler fired each clicking event\n */\n onClick?: (\n event: MouseEvent<HTMLButtonElement>,\n args: { pressed: boolean; value?: number | string | readonly string[] }\n ) => void\n /**\n * Clear chip handler\n */\n onClear?: (event?: MouseEvent<HTMLButtonElement>) => void\n ref?: Ref<HTMLButtonElement | HTMLDivElement>\n}\n\nexport const Chip = ({\n design = 'outlined',\n disabled,\n children,\n intent = 'support',\n defaultPressed,\n pressed,\n asChild,\n className,\n onClick,\n onClear,\n ref: forwardedRef,\n ...otherProps\n}: ChipProps) => {\n const {\n Element: ChipElement,\n chipProps: { children: formattedChildren, ...chipProps },\n compoundElements,\n } = useChipElement({\n asChild,\n pressed,\n defaultPressed,\n onClick,\n disabled: !!disabled,\n value: otherProps.value,\n defaultValue: otherProps.defaultValue,\n children,\n onClear,\n })\n\n const { clearButton } = compoundElements\n\n return (\n <ChipContext value={{ disabled, design, intent, onClear }}>\n <ChipElement\n ref={forwardedRef}\n className={chipStyles({\n className,\n design,\n disabled,\n intent,\n hasClearButton: !!clearButton,\n })}\n {...{\n ...chipProps,\n ...otherProps,\n }}\n data-spark-component=\"chip\"\n >\n {formattedChildren}\n </ChipElement>\n </ChipContext>\n )\n}\n\nChip.displayName = 'Chip'\n","import { tw } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nexport const chipClearButtonWrapperStyles = cva(\n ['ml-md flex h-full items-center justify-center focus-visible:outline-hidden'],\n {\n variants: {\n disabled: {\n false: ['cursor-pointer'],\n true: ['cursor-not-allowed'],\n },\n isBordered: {\n false: ['pr-md'],\n true: ['pr-[7px]'],\n },\n design: {\n outlined: [],\n tinted: [],\n dashed: [],\n },\n },\n compoundVariants: [\n {\n design: 'outlined',\n disabled: false,\n class: tw(['hover:opacity-dim-1']),\n },\n {\n design: 'outlined',\n disabled: true,\n class: tw(['opacity-dim-3']),\n },\n {\n design: 'tinted',\n disabled: false,\n class: tw(['hover:opacity-dim-1']),\n },\n {\n design: 'tinted',\n disabled: true,\n class: tw(['opacity-dim-3']),\n },\n {\n design: 'dashed',\n disabled: false,\n class: tw(['hover:opacity-dim-1']),\n },\n {\n design: 'dashed',\n disabled: true,\n class: tw(['opacity-dim-3']),\n },\n ],\n }\n)\n\nexport const chipClearButtonStyles = cva(\n ['rounded-full p-sz-2 [font-size:var(--spacing-sz-8)] border-sm', 'focus-visible:u-outline'],\n {\n variants: {\n disabled: {\n true: ['cursor-not-allowed'],\n false: ['cursor-pointer'],\n },\n },\n defaultVariants: {\n disabled: false,\n },\n }\n)\n\nexport type ChipClearButtonStylesProps = VariantProps<typeof chipClearButtonWrapperStyles>\n","import { Close } from '@spark-ui/icons/Close'\nimport {\n cloneElement,\n ComponentPropsWithoutRef,\n MouseEvent,\n ReactElement,\n Ref,\n useCallback,\n} from 'react'\n\nimport { Icon } from '../icon'\nimport {\n chipClearButtonStyles,\n type ChipClearButtonStylesProps,\n chipClearButtonWrapperStyles,\n} from './ChipClearButton.styles'\nimport { useChipContext } from './useChipContext'\n\nexport interface ChipClearButtonProps\n extends ComponentPropsWithoutRef<'span'>, ChipClearButtonStylesProps {\n label: string\n ref?: Ref<HTMLSpanElement>\n}\n\n/**\n * A button to remove or clear the chip. Renders a <button> element wrapped in a <span>.\n */\nexport const ChipClearButton = ({\n children = (\n <Icon>\n <Close />\n </Icon>\n ),\n tabIndex = 0,\n label,\n ref: forwardedRef,\n}: ChipClearButtonProps) => {\n const { design, disabled, onClear } = useChipContext()\n\n const onClearHandler = useCallback(\n (event: MouseEvent<HTMLButtonElement>) => {\n event.stopPropagation()\n !disabled && onClear && onClear(event)\n },\n [disabled, onClear]\n )\n\n return (\n <span\n className={chipClearButtonWrapperStyles({\n isBordered: ['outline', 'dashed'].includes(`${design}`),\n disabled: !!disabled,\n design,\n })}\n onClick={onClearHandler}\n ref={forwardedRef}\n >\n <button\n tabIndex={tabIndex}\n type=\"button\"\n disabled={!!disabled}\n className={chipClearButtonStyles({ disabled })}\n aria-label={label}\n >\n {children && cloneElement(children as ReactElement<HTMLElement>, { ariaLabel: label })}\n </button>\n </span>\n )\n}\n\nChipClearButton.displayName = 'Chip.ClearButton'\n","import { cx } from 'class-variance-authority'\nimport { ComponentPropsWithoutRef, Ref } from 'react'\n\nexport type ChipContentProps = ComponentPropsWithoutRef<'span'> & {\n ref?: Ref<HTMLSpanElement>\n}\n\n/**\n * The main text content of the chip. Renders a <span> element.\n */\nexport const ChipContent = ({ children, className, ref: forwardedRef }: ChipContentProps) => {\n return (\n <span className={cx('inline-block grow truncate', className)} ref={forwardedRef}>\n {children}\n </span>\n )\n}\n\nChipContent.displayName = 'Chip.Content'\n","import { cx } from 'class-variance-authority'\nimport { ComponentPropsWithoutRef, Ref } from 'react'\n\nexport type ChipIconProps = ComponentPropsWithoutRef<'span'> & {\n ref?: Ref<HTMLSpanElement>\n}\n\nexport const ChipIcon = ({ children, className, ref: forwardedRef }: ChipIconProps) => {\n return (\n <span className={cx('flex h-full items-center justify-center', className)} ref={forwardedRef}>\n {children}\n </span>\n )\n}\n\nChipIcon.displayName = 'Chip.Icon'\n","import { cx } from 'class-variance-authority'\nimport { Ref } from 'react'\n\nimport { ChipIcon, type ChipIconProps } from './ChipIcon'\n\nexport type ChipLeadingIconProps = ChipIconProps & {\n ref?: Ref<HTMLSpanElement>\n}\n\n/**\n * An icon displayed at the start of the chip. Renders a <span> element.\n */\nexport const ChipLeadingIcon = ({\n className,\n ref: forwardedRef,\n ...props\n}: ChipLeadingIconProps) => (\n <ChipIcon className={cx('mr-sm', className)} ref={forwardedRef} {...props} />\n)\n\nChipLeadingIcon.displayName = 'Chip.LeadingIcon'\n","import { cx } from 'class-variance-authority'\nimport { Ref } from 'react'\n\nimport { ChipIcon, type ChipIconProps } from './ChipIcon'\n\nexport type ChipTrailingIconProps = ChipIconProps & {\n ref?: Ref<HTMLSpanElement>\n}\n\n/**\n * An icon displayed at the end of the chip. Renders a <span> element.\n */\nexport const ChipTrailingIcon = ({\n className,\n ref: forwardedRef,\n ...props\n}: ChipTrailingIconProps) => (\n <ChipIcon className={cx('ml-md', className)} ref={forwardedRef} {...props} />\n)\n\nChipTrailingIcon.displayName = 'Chip.TrailingIcon'\n","import { Chip as Root } from './Chip'\nimport { ChipClearButton } from './ChipClearButton'\nimport { ChipContent } from './ChipContent'\nimport { ChipLeadingIcon } from './ChipLeadingIcon'\nimport { ChipTrailingIcon } from './ChipTrailingIcon'\n\n/**\n * A compact, interactive element used for input, filtering, or representing attributes.\n */\nexport const Chip: typeof Root & {\n Content: typeof ChipContent\n LeadingIcon: typeof ChipLeadingIcon\n TrailingIcon: typeof ChipTrailingIcon\n ClearButton: typeof ChipClearButton\n} = Object.assign(Root, {\n Content: ChipContent,\n LeadingIcon: ChipLeadingIcon,\n TrailingIcon: ChipTrailingIcon,\n ClearButton: ChipClearButton,\n})\n\nChip.displayName = 'Chip'\nChip.ClearButton.displayName = 'Chip.ClearButton'\nChip.Content.displayName = 'Chip.Content'\nChip.LeadingIcon.displayName = 'Chip.LeadingIcon'\nChip.TrailingIcon.displayName = 'Chip.TrailingIcon'\n\nexport { type ChipClearButtonProps } from './ChipClearButton'\nexport { type ChipContentProps } from './ChipContent'\nexport { type ChipLeadingIconProps } from './ChipLeadingIcon'\nexport { type ChipTrailingIconProps } from './ChipTrailingIcon'\n"],"mappings":"sZAEA,IAAa,EAAmB,CAE9B,CACE,OAAQ,WACR,OAAQ,OACR,OAAA,EAAA,EAAA,IAAU,CACR,8BACA,+BACA,8BACA,wHACA,YACD,CAAC,CACH,CACD,CACE,OAAQ,WACR,OAAQ,UACR,OAAA,EAAA,EAAA,IAAU,CACR,iCACA,kCACA,iCACA,iIACA,eACD,CAAC,CACH,CACD,CACE,OAAQ,SACR,OAAQ,WACR,OAAA,EAAA,EAAA,IAAU,CACR,gCACA,iCACA,gCACA,mCACA,8HACA,cACD,CAAC,CACH,CACD,CACE,OAAQ,WACR,OAAQ,UACR,OAAA,EAAA,EAAA,IAAU,CACR,iCACA,kCACA,iCACA,iIACA,eACD,CAAC,CACH,CACD,CACE,OAAQ,QACR,OAAQ,WACR,OAAA,EAAA,EAAA,IAAU,CACR,+BACA,gCACA,+BACA,2HACA,aACD,CAAC,CACH,CACD,CACE,OAAQ,WACR,OAAQ,SACR,OAAA,EAAA,EAAA,IAAU,CACR,+BACA,gCACA,+BACA,2HACA,aACD,CAAC,CACH,CACD,CACE,OAAQ,WACR,OAAQ,OACR,OAAA,EAAA,EAAA,IAAU,CACR,8BACA,+BACA,8BACA,wHACA,YACD,CAAC,CACH,CACD,CACE,OAAQ,WACR,OAAQ,UACR,OAAA,EAAA,EAAA,IAAU,CACR,iCACA,kCACA,iCACA,iIACA,eACD,CAAC,CACH,CACD,CACE,OAAQ,WACR,OAAQ,UACR,OAAA,EAAA,EAAA,IAAU,CACR,iCACA,kCACA,iCACA,qGACA,eACD,CAAC,CACH,CAED,CACE,OAAQ,WACR,eAAgB,GAChB,OAAA,EAAA,EAAA,IAAU,CAAC,sDAAsD,CAAC,CACnE,CACD,CACE,OAAQ,WACR,eAAgB,GAChB,OAAA,EAAA,EAAA,IAAU,CAAC,sDAAsD,CAAC,CACnE,CACF,CCjHY,EAAiB,CAE5B,CACE,OAAQ,OACR,OAAQ,SACR,OAAA,EAAA,EAAA,IAAU,CACR,oBACA,0CACA,2CACA,0CACA,0FACA,yBACD,CAAC,CACH,CACD,CACE,OAAQ,UACR,OAAQ,SACR,OAAA,EAAA,EAAA,IAAU,CACR,uBACA,6CACA,8CACA,6CACA,mGACA,4BACD,CAAC,CACH,CACD,CACE,OAAQ,SACR,OAAQ,SACR,OAAA,EAAA,EAAA,IAAU,CACR,sBACA,4CACA,6CACA,4CACA,gGACA,2BACD,CAAC,CACH,CACD,CACE,OAAQ,UACR,OAAQ,SACR,OAAA,EAAA,EAAA,IAAU,CACR,uBACA,6CACA,8CACA,6CACA,mGACA,4BACD,CAAC,CACH,CACD,CACE,OAAQ,QACR,OAAQ,SACR,OAAA,EAAA,EAAA,IAAU,CACR,qBACA,2CACA,4CACA,2CACA,6FACA,0BACD,CAAC,CACH,CACD,CACE,OAAQ,SACR,OAAQ,SACR,OAAA,EAAA,EAAA,IAAU,CACR,qBACA,2CACA,4CACA,2CACA,6FACA,0BACD,CAAC,CACH,CACD,CACE,OAAQ,OACR,OAAQ,SACR,OAAA,EAAA,EAAA,IAAU,CACR,oBACA,0CACA,2CACA,0CACA,0FACA,yBACD,CAAC,CACH,CACD,CACE,OAAQ,UACR,OAAQ,SACR,OAAA,EAAA,EAAA,IAAU,CACR,uBACA,6CACA,8CACA,6CACA,mGACA,4BACD,CAAC,CACH,CACD,CACE,OAAQ,UACR,OAAQ,SACR,OAAA,EAAA,EAAA,IAAU,CACR,mBACA,yCACA,0CACA,yCACA,qGACA,wBACD,CAAC,CACH,CAED,CACE,OAAQ,SACR,eAAgB,GAChB,OAAA,EAAA,EAAA,IAAU,CAAC,QAAQ,CAAC,CACrB,CACD,CACE,OAAQ,SACR,eAAgB,GAChB,OAAA,EAAA,EAAA,IAAU,CAAC,QAAQ,CAAC,CACrB,CACF,CCzHY,EAAiB,CAE5B,CACE,OAAQ,OACR,OAAQ,SACR,OAAA,EAAA,EAAA,IAAU,CACR,8BACA,+BACA,8BACA,wHACA,YACD,CAAC,CACH,CACD,CACE,OAAQ,UACR,OAAQ,SACR,OAAA,EAAA,EAAA,IAAU,CACR,iCACA,kCACA,iCACA,iIACA,eACD,CAAC,CACH,CACD,CACE,OAAQ,SACR,OAAQ,SACR,OAAA,EAAA,EAAA,IAAU,CACR,gCACA,iCACA,gCACA,8HACA,cACD,CAAC,CACH,CACD,CA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"}
1
+ {"version":3,"file":"index.js","names":[],"sources":["../../src/chip/variants/outlined.ts","../../src/chip/variants/tinted.ts","../../src/chip/variants/dashed.ts","../../src/chip/Chip.styles.tsx","../../src/chip/useChipContext.tsx","../../src/chip/useChipElement.tsx","../../src/chip/Chip.tsx","../../src/chip/ChipClearButton.styles.tsx","../../src/chip/ChipClearButton.tsx","../../src/chip/ChipContent.tsx","../../src/chip/ChipIcon.tsx","../../src/chip/ChipLeadingIcon.tsx","../../src/chip/ChipTrailingIcon.tsx","../../src/chip/index.ts"],"sourcesContent":["import { tw } from '@spark-ui/internal-utils'\n\nexport const outlinedVariants = [\n /** Intents **/\n {\n design: 'outlined',\n intent: 'main',\n class: tw([\n 'enabled:hover:bg-main/dim-5',\n 'enabled:active:bg-main/dim-5',\n 'focus-visible:bg-main/dim-5',\n 'aria-pressed:bg-main-container aria-pressed:text-on-main-container aria-pressed:enabled:hover:bg-main-container/dim-1',\n 'text-main',\n ]),\n },\n {\n design: 'outlined',\n intent: 'support',\n class: tw([\n 'enabled:hover:bg-support/dim-5',\n 'enabled:active:bg-support/dim-5',\n 'focus-visible:bg-support/dim-5',\n 'aria-pressed:bg-support-container aria-pressed:text-on-support-container aria-pressed:enabled:hover:bg-support-container/dim-1',\n 'text-support',\n ]),\n },\n {\n intent: 'accent',\n design: 'outlined',\n class: tw([\n 'enabled:hover:bg-accent/dim-5',\n 'enabled:active:bg-accent/dim-5',\n 'focus-visible:bg-accent/dim-5',\n 'aria-pressed:bg-accent-container',\n 'aria-pressed:bg-accent-container aria-pressed:text-on-accent-container aria-pressed:enabled:hover:bg-accent-container/dim-1',\n 'text-accent',\n ]),\n },\n {\n design: 'outlined',\n intent: 'success',\n class: tw([\n 'enabled:hover:bg-success/dim-5',\n 'enabled:active:bg-success/dim-5',\n 'focus-visible:bg-success/dim-5',\n 'aria-pressed:bg-success-container aria-pressed:text-on-success-container aria-pressed:enabled:hover:bg-success-container/dim-1',\n 'text-success',\n ]),\n },\n {\n intent: 'alert',\n design: 'outlined',\n class: tw([\n 'enabled:hover:bg-alert/dim-5',\n 'enabled:active:bg-alert/dim-5',\n 'focus-visible:bg-alert/dim-5',\n 'aria-pressed:bg-alert-container aria-pressed:text-on-alert-container aria-pressed:enabled:hover:bg-alert-container/dim-1',\n 'text-alert',\n ]),\n },\n {\n design: 'outlined',\n intent: 'danger',\n class: tw([\n 'enabled:hover:bg-error/dim-5',\n 'enabled:active:bg-error/dim-5',\n 'focus-visible:bg-error/dim-5',\n 'aria-pressed:bg-error-container aria-pressed:text-on-error-container aria-pressed:enabled:hover:bg-error-container/dim-1',\n 'text-error',\n ]),\n },\n {\n design: 'outlined',\n intent: 'info',\n class: tw([\n 'enabled:hover:bg-info/dim-5',\n 'enabled:active:bg-info/dim-5',\n 'focus-visible:bg-info/dim-5',\n 'aria-pressed:bg-info-container aria-pressed:text-on-info-container aria-pressed:enabled:hover:bg-info-container/dim-1',\n 'text-info',\n ]),\n },\n {\n design: 'outlined',\n intent: 'neutral',\n class: tw([\n 'enabled:hover:bg-neutral/dim-5',\n 'enabled:active:bg-neutral/dim-5',\n 'focus-visible:bg-neutral/dim-5',\n 'aria-pressed:bg-neutral-container aria-pressed:text-on-neutral-container aria-pressed:enabled:hover:bg-neutral-container/dim-1',\n 'text-neutral',\n ]),\n },\n {\n design: 'outlined',\n intent: 'surface',\n class: tw([\n 'enabled:hover:bg-surface/dim-5',\n 'enabled:active:bg-surface/dim-5',\n 'focus-visible:bg-surface/dim-5',\n 'aria-pressed:bg-surface aria-pressed:text-on-surface aria-pressed:enabled:hover:bg-surface-hovered',\n 'text-surface',\n ]),\n },\n /** Spacings **/\n {\n design: 'outlined',\n hasClearButton: false,\n class: tw(['px-[calc(var(--spacing-md)-var(--border-width-sm))]']),\n },\n {\n design: 'outlined',\n hasClearButton: true,\n class: tw(['pl-[calc(var(--spacing-md)-var(--border-width-sm))]']),\n },\n] as const\n","import { tw } from '@spark-ui/internal-utils'\n\nexport const tintedVariants = [\n /** Intents **/\n {\n intent: 'main',\n design: 'tinted',\n class: tw([\n 'bg-main-container',\n 'enabled:hover:bg-main-container-hovered',\n 'enabled:active:bg-main-container-hovered',\n 'focus-visible:bg-main-container-hovered',\n 'aria-pressed:bg-main aria-pressed:text-on-main aria-pressed:enabled:hover:bg-main/dim-1',\n 'text-on-main-container',\n ]),\n },\n {\n intent: 'support',\n design: 'tinted',\n class: tw([\n 'bg-support-container',\n 'enabled:hover:bg-support-container-hovered',\n 'enabled:active:bg-support-container-hovered',\n 'focus-visible:bg-support-container-hovered',\n 'aria-pressed:bg-support aria-pressed:text-on-support aria-pressed:enabled:hover:bg-support/dim-1',\n 'text-on-support-container',\n ]),\n },\n {\n intent: 'accent',\n design: 'tinted',\n class: tw([\n 'bg-accent-container',\n 'enabled:hover:bg-accent-container-hovered',\n 'enabled:active:bg-accent-container-hovered',\n 'focus-visible:bg-accent-container-hovered',\n 'aria-pressed:bg-accent aria-pressed:text-on-accent aria-pressed:enabled:hover:bg-accent/dim-1',\n 'text-on-accent-container',\n ]),\n },\n {\n intent: 'success',\n design: 'tinted',\n class: tw([\n 'bg-success-container',\n 'enabled:hover:bg-success-container-hovered',\n 'enabled:active:bg-success-container-hovered',\n 'focus-visible:bg-success-container-hovered',\n 'aria-pressed:bg-success aria-pressed:text-on-success aria-pressed:enabled:hover:bg-success/dim-1',\n 'text-on-success-container',\n ]),\n },\n {\n intent: 'alert',\n design: 'tinted',\n class: tw([\n 'bg-alert-container',\n 'enabled:hover:bg-alert-container-hovered',\n 'enabled:active:bg-alert-container-hovered',\n 'focus-visible:bg-alert-container-hovered',\n 'aria-pressed:bg-alert aria-pressed:text-on-alert aria-pressed:enabled:hover:bg-alert/dim-1',\n 'text-on-alert-container',\n ]),\n },\n {\n intent: 'danger',\n design: 'tinted',\n class: tw([\n 'bg-error-container',\n 'enabled:hover:bg-error-container-hovered',\n 'enabled:active:bg-error-container-hovered',\n 'focus-visible:bg-error-container-hovered',\n 'aria-pressed:bg-error aria-pressed:text-on-error aria-pressed:enabled:hover:bg-error/dim-1',\n 'text-on-error-container',\n ]),\n },\n {\n intent: 'info',\n design: 'tinted',\n class: tw([\n 'bg-info-container',\n 'enabled:hover:bg-info-container-hovered',\n 'enabled:active:bg-info-container-hovered',\n 'focus-visible:bg-info-container-hovered',\n 'aria-pressed:bg-info aria-pressed:text-on-info aria-pressed:enabled:hover:bg-info/dim-1',\n 'text-on-info-container',\n ]),\n },\n {\n intent: 'neutral',\n design: 'tinted',\n class: tw([\n 'bg-neutral-container',\n 'enabled:hover:bg-neutral-container-hovered',\n 'enabled:active:bg-neutral-container-hovered',\n 'focus-visible:bg-neutral-container-hovered',\n 'aria-pressed:bg-neutral aria-pressed:text-on-neutral aria-pressed:enabled:hover:bg-neutral/dim-1',\n 'text-on-neutral-container',\n ]),\n },\n {\n intent: 'surface',\n design: 'tinted',\n class: tw([\n 'bg-surface/dim-1',\n 'enabled:hover:bg-surface-hovered/dim-1',\n 'enabled:active:bg-surface-hovered/dim-1',\n 'focus-visible:bg-surface-hovered/dim-1',\n 'aria-pressed:bg-surface aria-pressed:text-on-surface aria-pressed:enabled:hover:bg-surface-hovered',\n 'text-on-surface/dim-1',\n ]),\n },\n /** Spacings **/\n {\n design: 'tinted',\n hasClearButton: false,\n class: tw(['px-md']),\n },\n {\n design: 'tinted',\n hasClearButton: true,\n class: tw(['pl-md']),\n },\n] as const\n","import { tw } from '@spark-ui/internal-utils'\n\nexport const dashedVariants = [\n /** Intents **/\n {\n intent: 'main',\n design: 'dashed',\n class: tw([\n 'enabled:hover:bg-main/dim-5',\n 'enabled:active:bg-main/dim-5',\n 'focus-visible:bg-main/dim-5',\n 'aria-pressed:bg-main-container aria-pressed:text-on-main-container aria-pressed:enabled:hover:bg-main-container/dim-1',\n 'text-main',\n ]),\n },\n {\n intent: 'support',\n design: 'dashed',\n class: tw([\n 'enabled:hover:bg-support/dim-5',\n 'enabled:active:bg-support/dim-5',\n 'focus-visible:bg-support/dim-5',\n 'aria-pressed:bg-support-container aria-pressed:text-on-support-container aria-pressed:enabled:hover:bg-support-container/dim-1',\n 'text-support',\n ]),\n },\n {\n intent: 'accent',\n design: 'dashed',\n class: tw([\n 'enabled:hover:bg-accent/dim-5',\n 'enabled:active:bg-accent/dim-5',\n 'focus-visible:bg-accent/dim-5',\n 'aria-pressed:bg-accent-container aria-pressed:text-on-accent-container aria-pressed:enabled:hover:bg-accent-container/dim-1',\n 'text-accent',\n ]),\n },\n {\n intent: 'success',\n design: 'dashed',\n class: tw([\n 'enabled:hover:bg-success/dim-5',\n 'enabled:active:bg-success/dim-5',\n 'focus-visible:bg-success/dim-5',\n 'aria-pressed:bg-success-container aria-pressed:text-on-success-container aria-pressed:enabled:hover:bg-success-container/dim-1',\n 'text-success',\n ]),\n },\n {\n intent: 'alert',\n design: 'dashed',\n class: tw([\n 'enabled:hover:bg-alert/dim-5',\n 'enabled:active:bg-alert/dim-5',\n 'focus-visible:bg-alert/dim-5',\n 'aria-pressed:bg-alert-container aria-pressed:text-on-alert-container aria-pressed:enabled:hover:bg-alert-container/dim-1',\n 'text-alert',\n ]),\n },\n {\n intent: 'danger',\n design: 'dashed',\n class: tw([\n 'enabled:hover:bg-error/dim-5',\n 'enabled:active:bg-error/dim-5',\n 'focus-visible:bg-error/dim-5',\n 'aria-pressed:bg-error-container aria-pressed:text-on-error-container aria-pressed:enabled:hover:bg-error-container/dim-1',\n 'text-error',\n ]),\n },\n {\n intent: 'info',\n design: 'dashed',\n class: tw([\n 'enabled:hover:bg-info/dim-5',\n 'enabled:active:bg-info/dim-5',\n 'focus-visible:bg-info/dim-5',\n 'aria-pressed:bg-info-container aria-pressed:text-on-info-container aria-pressed:enabled:hover:bg-info-container/dim-1',\n 'text-info',\n ]),\n },\n {\n intent: 'neutral',\n design: 'dashed',\n class: tw([\n 'enabled:hover:bg-neutral/dim-5',\n 'enabled:active:bg-neutral/dim-5',\n 'focus-visible:bg-neutral/dim-5',\n 'aria-pressed:bg-neutral-container aria-pressed:text-on-neutral-container aria-pressed:enabled:hover:bg-neutral-container/dim-1',\n 'text-neutral',\n ]),\n },\n {\n intent: 'surface',\n design: 'dashed',\n class: tw([\n 'enabled:hover:bg-surface/dim-5',\n 'enabled:active:bg-surface/dim-5',\n 'focus-visible:bg-surface/dim-5',\n 'aria-pressed:bg-surface aria-pressed:text-on-surface aria-pressed:enabled:hover:bg-surface-hovered',\n 'text-surface',\n ]),\n },\n /** Spacings **/\n {\n design: 'dashed',\n hasClearButton: false,\n class: tw(['px-[calc(var(--spacing-md)-var(--border-width-sm))]']),\n },\n {\n design: 'dashed',\n hasClearButton: true,\n class: tw(['pl-[calc(var(--spacing-md)-var(--border-width-sm))]']),\n },\n] as const\n","import { makeVariants } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nimport { dashedVariants, outlinedVariants, tintedVariants } from './variants'\n\nexport const chipStyles = cva(\n [\n 'box-border inline-flex h-sz-32 flex-nowrap items-center justify-center rounded-chip text-body-1 font-regular',\n 'focus-visible:u-outline',\n 'ease-out duration-150',\n ],\n {\n variants: {\n /**\n * Main style of the chip.\n *\n * - `filled`: Chip will be plain.\n *\n * - `outlined`: Chip will be transparent with an outline.\n *\n * - `tinted`: Chip will be filled but using a lighter color scheme.\n *\n * - `dashed`: Chip will be transparent with an outline dashed.\n */\n design: makeVariants<'design', ['outlined', 'tinted', 'dashed']>({\n outlined: ['bg-transparent border-sm border-solid border-current'],\n tinted: [''],\n dashed: [\n 'bg-transparent border-sm border-dashed shadow-none focus-visible:border-outline-high',\n ],\n }),\n /**\n * Color scheme of the chip.\n */\n intent: makeVariants<\n 'intent',\n ['main', 'support', 'accent', 'success', 'alert', 'danger', 'info', 'neutral', 'surface']\n >({\n main: [],\n support: [],\n accent: [],\n success: [],\n alert: [],\n danger: [],\n info: [],\n neutral: [],\n surface: [],\n }),\n /**\n * Disable the chip, preventing user interaction and adding opacity.\n */\n disabled: {\n true: ['cursor-not-allowed', 'opacity-dim-3'],\n },\n hasClearButton: {\n true: [],\n false: [],\n },\n // 'pl-[calc(var(--spacing-md)-(var(--border-width-sm)))]'\n },\n compoundVariants: [...outlinedVariants, ...tintedVariants, ...dashedVariants],\n defaultVariants: {\n design: 'outlined',\n intent: 'support',\n },\n }\n)\n\nexport type ChipStylesProps = VariantProps<typeof chipStyles>\n","import { createContext, useContext } from 'react'\n\nimport { type ChipProps } from './Chip'\n\nexport type ChipsContextType = Pick<ChipProps, 'disabled' | 'design' | 'intent' | 'onClear'>\n\nexport const ChipContext = createContext<ChipsContextType>({} as ChipsContextType)\nexport const useChipContext = () => useContext(ChipContext) || {}\n","import { useCombinedState } from '@spark-ui/hooks/use-combined-state'\nimport { emulateTab } from 'emulate-tab'\nimport {\n Children,\n ElementType,\n FC,\n ForwardRefExoticComponent,\n HTMLAttributes,\n isValidElement,\n KeyboardEvent,\n MouseEvent,\n ReactElement,\n ReactNode,\n RefAttributes,\n} from 'react'\n\nimport { Slot } from '../slot'\n\ninterface ReturnedValue {\n Element:\n | ForwardRefExoticComponent<\n HTMLAttributes<HTMLElement> & {\n children?: ReactNode\n } & RefAttributes<HTMLElement>\n >\n | ElementType\n chipProps:\n | {\n type: 'button'\n 'aria-pressed'?: boolean\n 'data-state'?: 'on' | 'off'\n onClick: (event: MouseEvent<HTMLButtonElement>) => void\n onKeyDown?: (event: KeyboardEvent<HTMLButtonElement>) => void\n disabled?: boolean\n children: ReactNode\n }\n | {\n 'aria-disabled'?: boolean\n children: ReactNode\n onKeyDown?: (event: KeyboardEvent<HTMLButtonElement>) => void\n }\n compoundElements: {\n leadingIcon: ReactNode\n trailingIcon: ReactNode\n content: ReactNode\n clearButton: ReactNode\n }\n}\n\nconst getDisplayName = (element?: ReactElement) => {\n return element ? (element.type as FC).displayName : ''\n}\n\nconst findElement =\n (children: ReactNode) =>\n (...values: string[]) => {\n const validChildren = Children.toArray(children).filter(isValidElement)\n\n return validChildren.find(child => {\n const displayName = getDisplayName(child)\n\n return values.includes(displayName || '')\n })\n }\n\nexport const useChipElement = ({\n onClick,\n asChild,\n pressed,\n defaultPressed,\n disabled,\n value,\n defaultValue,\n children,\n onClear,\n}: {\n onClick?: (\n event: MouseEvent<HTMLButtonElement>,\n args: { pressed: boolean; value?: string | number | readonly string[] }\n ) => void\n onKeyDown?: (event: KeyboardEvent<HTMLButtonElement>) => void\n asChild?: boolean\n pressed?: boolean\n defaultPressed?: boolean\n value?: string | number | readonly string[]\n defaultValue?: string | number | readonly string[]\n disabled?: boolean\n children?: ReactNode\n onClear?: (event?: MouseEvent<HTMLButtonElement>) => void\n}): ReturnedValue => {\n const [isPressed, setIsPressed] = useCombinedState<boolean | undefined>(pressed, defaultPressed)\n const [innerValue] = useCombinedState<string | number | readonly string[] | undefined>(\n value,\n defaultValue\n )\n\n const findChipElement = findElement(children)\n\n const leadingIcon = findChipElement('Chip.LeadingIcon')\n const trailingIcon = findChipElement('Chip.TrailingIcon')\n const content = findChipElement('Chip.Content')\n const clearButton = findChipElement('Chip.ClearButton')\n\n const isButton = (onClick || isPressed) !== undefined\n\n const formattedChildren = [leadingIcon, content, clearButton].every(\n element => element === undefined\n ) ? (\n <span className=\"inline-block grow truncate\">{children}</span>\n ) : (\n <>\n {leadingIcon}\n {content}\n {clearButton === undefined ? trailingIcon : null}\n {clearButton}\n </>\n )\n\n const onKeyDown = (event: KeyboardEvent<HTMLButtonElement>): void => {\n if (!!clearButton && !disabled && ['Delete', 'Backspace'].includes(event.key)) {\n if (onClear) {\n onClear()\n event.key === 'Delete' && emulateTab()\n event.key === 'Backspace' && emulateTab.backwards()\n }\n }\n }\n\n if (isButton) {\n return {\n Element: asChild ? Slot : 'button',\n chipProps: {\n type: 'button',\n ...(isPressed !== undefined && {\n 'aria-pressed': isPressed,\n 'data-state': isPressed ? 'on' : 'off',\n }),\n onClick: (event: MouseEvent<HTMLButtonElement>): void => {\n isPressed !== undefined && setIsPressed(!isPressed)\n onClick && onClick(event, { pressed: isPressed as boolean, value: innerValue })\n },\n onKeyDown,\n disabled,\n children: formattedChildren,\n },\n compoundElements: {\n leadingIcon,\n trailingIcon,\n content,\n clearButton,\n },\n }\n }\n\n return {\n Element: asChild ? Slot : 'div',\n chipProps: {\n 'aria-disabled': disabled,\n children: formattedChildren,\n onKeyDown,\n },\n compoundElements: {\n leadingIcon,\n trailingIcon,\n content,\n clearButton,\n },\n }\n}\n","import { ComponentPropsWithoutRef, MouseEvent, Ref } from 'react'\n\nimport { chipStyles, type ChipStylesProps } from './Chip.styles'\nimport { ChipContext } from './useChipContext'\nimport { useChipElement } from './useChipElement'\n\ntype ChipPrimitiveProps = Omit<ComponentPropsWithoutRef<'button'>, 'onClick' | 'disabled' | 'type'>\n\nexport interface ChipProps extends ChipPrimitiveProps, Omit<ChipStylesProps, 'hasClearButton'> {\n /**\n * Configures a toggleButton aria-pressed initial value\n */\n defaultPressed?: boolean\n /**\n * Configures a toggleButton aria-pressed value\n */\n pressed?: boolean\n /**\n * Change the component to the HTML tag or custom component of the only child.\n */\n asChild?: boolean\n /**\n * Event handler fired each clicking event\n */\n onClick?: (\n event: MouseEvent<HTMLButtonElement>,\n args: { pressed: boolean; value?: number | string | readonly string[] }\n ) => void\n /**\n * Clear chip handler\n */\n onClear?: (event?: MouseEvent<HTMLButtonElement>) => void\n ref?: Ref<HTMLButtonElement | HTMLDivElement>\n}\n\nexport const Chip = ({\n design = 'outlined',\n disabled,\n children,\n intent = 'support',\n defaultPressed,\n pressed,\n asChild,\n className,\n onClick,\n onClear,\n ref: forwardedRef,\n ...otherProps\n}: ChipProps) => {\n const {\n Element: ChipElement,\n chipProps: { children: formattedChildren, ...chipProps },\n compoundElements,\n } = useChipElement({\n asChild,\n pressed,\n defaultPressed,\n onClick,\n disabled: !!disabled,\n value: otherProps.value,\n defaultValue: otherProps.defaultValue,\n children,\n onClear,\n })\n\n const { clearButton } = compoundElements\n\n return (\n <ChipContext value={{ disabled, design, intent, onClear }}>\n <ChipElement\n ref={forwardedRef}\n className={chipStyles({\n className,\n design,\n disabled,\n intent,\n hasClearButton: !!clearButton,\n })}\n {...{\n ...chipProps,\n ...otherProps,\n }}\n data-spark-component=\"chip\"\n >\n {formattedChildren}\n </ChipElement>\n </ChipContext>\n )\n}\n\nChip.displayName = 'Chip'\n","import { tw } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nexport const chipClearButtonWrapperStyles = cva(\n ['ml-md flex h-full items-center justify-center focus-visible:outline-hidden'],\n {\n variants: {\n disabled: {\n false: ['cursor-pointer'],\n true: ['cursor-not-allowed'],\n },\n isBordered: {\n false: ['pr-md'],\n true: ['pr-[7px]'],\n },\n design: {\n outlined: [],\n tinted: [],\n dashed: [],\n },\n },\n compoundVariants: [\n {\n design: 'outlined',\n disabled: false,\n class: tw(['hover:opacity-dim-1']),\n },\n {\n design: 'outlined',\n disabled: true,\n class: tw(['opacity-dim-3']),\n },\n {\n design: 'tinted',\n disabled: false,\n class: tw(['hover:opacity-dim-1']),\n },\n {\n design: 'tinted',\n disabled: true,\n class: tw(['opacity-dim-3']),\n },\n {\n design: 'dashed',\n disabled: false,\n class: tw(['hover:opacity-dim-1']),\n },\n {\n design: 'dashed',\n disabled: true,\n class: tw(['opacity-dim-3']),\n },\n ],\n }\n)\n\nexport const chipClearButtonStyles = cva(\n ['rounded-full p-sz-2 [font-size:var(--spacing-sz-8)] border-sm', 'focus-visible:u-outline'],\n {\n variants: {\n disabled: {\n true: ['cursor-not-allowed'],\n false: ['cursor-pointer'],\n },\n },\n defaultVariants: {\n disabled: false,\n },\n }\n)\n\nexport type ChipClearButtonStylesProps = VariantProps<typeof chipClearButtonWrapperStyles>\n","import { Close } from '@spark-ui/icons/Close'\nimport {\n cloneElement,\n ComponentPropsWithoutRef,\n MouseEvent,\n ReactElement,\n Ref,\n useCallback,\n} from 'react'\n\nimport { Icon } from '../icon'\nimport {\n chipClearButtonStyles,\n type ChipClearButtonStylesProps,\n chipClearButtonWrapperStyles,\n} from './ChipClearButton.styles'\nimport { useChipContext } from './useChipContext'\n\nexport interface ChipClearButtonProps\n extends ComponentPropsWithoutRef<'span'>, ChipClearButtonStylesProps {\n label: string\n ref?: Ref<HTMLSpanElement>\n}\n\n/**\n * A button to remove or clear the chip. Renders a <button> element wrapped in a <span>.\n */\nexport const ChipClearButton = ({\n children = (\n <Icon>\n <Close />\n </Icon>\n ),\n tabIndex = 0,\n label,\n ref: forwardedRef,\n}: ChipClearButtonProps) => {\n const { design, disabled, onClear } = useChipContext()\n\n const onClearHandler = useCallback(\n (event: MouseEvent<HTMLButtonElement>) => {\n event.stopPropagation()\n !disabled && onClear && onClear(event)\n },\n [disabled, onClear]\n )\n\n return (\n <span\n className={chipClearButtonWrapperStyles({\n isBordered: ['outline', 'dashed'].includes(`${design}`),\n disabled: !!disabled,\n design,\n })}\n onClick={onClearHandler}\n ref={forwardedRef}\n >\n <button\n tabIndex={tabIndex}\n type=\"button\"\n disabled={!!disabled}\n className={chipClearButtonStyles({ disabled })}\n aria-label={label}\n >\n {children && cloneElement(children as ReactElement<HTMLElement>, { ariaLabel: label })}\n </button>\n </span>\n )\n}\n\nChipClearButton.displayName = 'Chip.ClearButton'\n","import { cx } from 'class-variance-authority'\nimport { ComponentPropsWithoutRef, Ref } from 'react'\n\nexport type ChipContentProps = ComponentPropsWithoutRef<'span'> & {\n ref?: Ref<HTMLSpanElement>\n}\n\n/**\n * The main text content of the chip. Renders a <span> element.\n */\nexport const ChipContent = ({ children, className, ref: forwardedRef }: ChipContentProps) => {\n return (\n <span className={cx('inline-block grow truncate', className)} ref={forwardedRef}>\n {children}\n </span>\n )\n}\n\nChipContent.displayName = 'Chip.Content'\n","import { cx } from 'class-variance-authority'\nimport { ComponentPropsWithoutRef, Ref } from 'react'\n\nexport type ChipIconProps = ComponentPropsWithoutRef<'span'> & {\n ref?: Ref<HTMLSpanElement>\n}\n\nexport const ChipIcon = ({ children, className, ref: forwardedRef }: ChipIconProps) => {\n return (\n <span className={cx('flex h-full items-center justify-center', className)} ref={forwardedRef}>\n {children}\n </span>\n )\n}\n\nChipIcon.displayName = 'Chip.Icon'\n","import { cx } from 'class-variance-authority'\nimport { Ref } from 'react'\n\nimport { ChipIcon, type ChipIconProps } from './ChipIcon'\n\nexport type ChipLeadingIconProps = ChipIconProps & {\n ref?: Ref<HTMLSpanElement>\n}\n\n/**\n * An icon displayed at the start of the chip. Renders a <span> element.\n */\nexport const ChipLeadingIcon = ({\n className,\n ref: forwardedRef,\n ...props\n}: ChipLeadingIconProps) => (\n <ChipIcon className={cx('mr-sm', className)} ref={forwardedRef} {...props} />\n)\n\nChipLeadingIcon.displayName = 'Chip.LeadingIcon'\n","import { cx } from 'class-variance-authority'\nimport { Ref } from 'react'\n\nimport { ChipIcon, type ChipIconProps } from './ChipIcon'\n\nexport type ChipTrailingIconProps = ChipIconProps & {\n ref?: Ref<HTMLSpanElement>\n}\n\n/**\n * An icon displayed at the end of the chip. Renders a <span> element.\n */\nexport const ChipTrailingIcon = ({\n className,\n ref: forwardedRef,\n ...props\n}: ChipTrailingIconProps) => (\n <ChipIcon className={cx('ml-md', className)} ref={forwardedRef} {...props} />\n)\n\nChipTrailingIcon.displayName = 'Chip.TrailingIcon'\n","import { Chip as Root } from './Chip'\nimport { ChipClearButton } from './ChipClearButton'\nimport { ChipContent } from './ChipContent'\nimport { ChipLeadingIcon } from './ChipLeadingIcon'\nimport { ChipTrailingIcon } from './ChipTrailingIcon'\n\n/**\n * A compact, interactive element used for input, filtering, or representing attributes.\n */\nexport const Chip: typeof Root & {\n Content: typeof ChipContent\n LeadingIcon: typeof ChipLeadingIcon\n TrailingIcon: typeof ChipTrailingIcon\n ClearButton: typeof ChipClearButton\n} = Object.assign(Root, {\n Content: ChipContent,\n LeadingIcon: ChipLeadingIcon,\n TrailingIcon: ChipTrailingIcon,\n ClearButton: ChipClearButton,\n})\n\nChip.displayName = 'Chip'\nChip.ClearButton.displayName = 'Chip.ClearButton'\nChip.Content.displayName = 'Chip.Content'\nChip.LeadingIcon.displayName = 'Chip.LeadingIcon'\nChip.TrailingIcon.displayName = 'Chip.TrailingIcon'\n\nexport { type ChipClearButtonProps } from './ChipClearButton'\nexport { type ChipContentProps } from './ChipContent'\nexport { type ChipLeadingIconProps } from './ChipLeadingIcon'\nexport { type ChipTrailingIconProps } from './ChipTrailingIcon'\n"],"mappings":"sZAEA,IAAa,EAAmB,CAE9B,CACE,OAAQ,WACR,OAAQ,OACR,OAAA,EAAA,EAAA,IAAU,CACR,8BACA,+BACA,8BACA,wHACA,YACD,CAAC,CACH,CACD,CACE,OAAQ,WACR,OAAQ,UACR,OAAA,EAAA,EAAA,IAAU,CACR,iCACA,kCACA,iCACA,iIACA,eACD,CAAC,CACH,CACD,CACE,OAAQ,SACR,OAAQ,WACR,OAAA,EAAA,EAAA,IAAU,CACR,gCACA,iCACA,gCACA,mCACA,8HACA,cACD,CAAC,CACH,CACD,CACE,OAAQ,WACR,OAAQ,UACR,OAAA,EAAA,EAAA,IAAU,CACR,iCACA,kCACA,iCACA,iIACA,eACD,CAAC,CACH,CACD,CACE,OAAQ,QACR,OAAQ,WACR,OAAA,EAAA,EAAA,IAAU,CACR,+BACA,gCACA,+BACA,2HACA,aACD,CAAC,CACH,CACD,CACE,OAAQ,WACR,OAAQ,SACR,OAAA,EAAA,EAAA,IAAU,CACR,+BACA,gCACA,+BACA,2HACA,aACD,CAAC,CACH,CACD,CACE,OAAQ,WACR,OAAQ,OACR,OAAA,EAAA,EAAA,IAAU,CACR,8BACA,+BACA,8BACA,wHACA,YACD,CAAC,CACH,CACD,CACE,OAAQ,WACR,OAAQ,UACR,OAAA,EAAA,EAAA,IAAU,CACR,iCACA,kCACA,iCACA,iIACA,eACD,CAAC,CACH,CACD,CACE,OAAQ,WACR,OAAQ,UACR,OAAA,EAAA,EAAA,IAAU,CACR,iCACA,kCACA,iCACA,qGACA,eACD,CAAC,CACH,CAED,CACE,OAAQ,WACR,eAAgB,GAChB,OAAA,EAAA,EAAA,IAAU,CAAC,sDAAsD,CAAC,CACnE,CACD,CACE,OAAQ,WACR,eAAgB,GAChB,OAAA,EAAA,EAAA,IAAU,CAAC,sDAAsD,CAAC,CACnE,CACF,CCjHY,EAAiB,CAE5B,CACE,OAAQ,OACR,OAAQ,SACR,OAAA,EAAA,EAAA,IAAU,CACR,oBACA,0CACA,2CACA,0CACA,0FACA,yBACD,CAAC,CACH,CACD,CACE,OAAQ,UACR,OAAQ,SACR,OAAA,EAAA,EAAA,IAAU,CACR,uBACA,6CACA,8CACA,6CACA,mGACA,4BACD,CAAC,CACH,CACD,CACE,OAAQ,SACR,OAAQ,SACR,OAAA,EAAA,EAAA,IAAU,CACR,sBACA,4CACA,6CACA,4CACA,gGACA,2BACD,CAAC,CACH,CACD,CACE,OAAQ,UACR,OAAQ,SACR,OAAA,EAAA,EAAA,IAAU,CACR,uBACA,6CACA,8CACA,6CACA,mGACA,4BACD,CAAC,CACH,CACD,CACE,OAAQ,QACR,OAAQ,SACR,OAAA,EAAA,EAAA,IAAU,CACR,qBACA,2CACA,4CACA,2CACA,6FACA,0BACD,CAAC,CACH,CACD,CACE,OAAQ,SACR,OAAQ,SACR,OAAA,EAAA,EAAA,IAAU,CACR,qBACA,2CACA,4CACA,2CACA,6FACA,0BACD,CAAC,CACH,CACD,CACE,OAAQ,OACR,OAAQ,SACR,OAAA,EAAA,EAAA,IAAU,CACR,oBACA,0CACA,2CACA,0CACA,0FACA,yBACD,CAAC,CACH,CACD,CACE,OAAQ,UACR,OAAQ,SACR,OAAA,EAAA,EAAA,IAAU,CACR,uBACA,6CACA,8CACA,6CACA,mGACA,4BACD,CAAC,CACH,CACD,CACE,OAAQ,UACR,OAAQ,SACR,OAAA,EAAA,EAAA,IAAU,CACR,mBACA,yCACA,0CACA,yCACA,qGACA,wBACD,CAAC,CACH,CAED,CACE,OAAQ,SACR,eAAgB,GAChB,OAAA,EAAA,EAAA,IAAU,CAAC,QAAQ,CAAC,CACrB,CACD,CACE,OAAQ,SACR,eAAgB,GAChB,OAAA,EAAA,EAAA,IAAU,CAAC,QAAQ,CAAC,CACrB,CACF,CCzHY,EAAiB,CAE5B,CACE,OAAQ,OACR,OAAQ,SACR,OAAA,EAAA,EAAA,IAAU,CACR,8BACA,+BACA,8BACA,wHACA,YACD,CAAC,CACH,CACD,CACE,OAAQ,UACR,OAAQ,SACR,OAAA,EAAA,EAAA,IAAU,CACR,iCACA,kCACA,iCACA,iIACA,eACD,CAAC,CACH,CACD,CACE,OAAQ,SACR,OAAQ,SACR,OAAA,EAAA,EAAA,IAAU,CACR,gCACA,iCACA,gCACA,8HACA,cACD,CAAC,CACH,CACD,CA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"}
package/dist/chip/index.mjs CHANGED
@@ -399,7 +399,7 @@ var v = [
399
399
  }) : /* @__PURE__ */ f(u, { children: [
400
400
  y,
401
401
  x,
402
- y === void 0 ? b : null,
402
+ S === void 0 ? b : null,
403
403
  S
404
404
  ] }), E = (e) => {
405
405
  S && !a && ["Delete", "Backspace"].includes(e.key) && l && (l(), e.key === "Delete" && g(), e.key === "Backspace" && g.backwards());
package/dist/chip/index.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.mjs","names":[],"sources":["../../src/chip/variants/outlined.ts","../../src/chip/variants/tinted.ts","../../src/chip/variants/dashed.ts","../../src/chip/Chip.styles.tsx","../../src/chip/useChipContext.tsx","../../src/chip/useChipElement.tsx","../../src/chip/Chip.tsx","../../src/chip/ChipClearButton.styles.tsx","../../src/chip/ChipClearButton.tsx","../../src/chip/ChipContent.tsx","../../src/chip/ChipIcon.tsx","../../src/chip/ChipLeadingIcon.tsx","../../src/chip/ChipTrailingIcon.tsx","../../src/chip/index.ts"],"sourcesContent":["import { tw } from '@spark-ui/internal-utils'\n\nexport const outlinedVariants = [\n /** Intents **/\n {\n design: 'outlined',\n intent: 'main',\n class: tw([\n 'enabled:hover:bg-main/dim-5',\n 'enabled:active:bg-main/dim-5',\n 'focus-visible:bg-main/dim-5',\n 'aria-pressed:bg-main-container aria-pressed:text-on-main-container aria-pressed:enabled:hover:bg-main-container/dim-1',\n 'text-main',\n ]),\n },\n {\n design: 'outlined',\n intent: 'support',\n class: tw([\n 'enabled:hover:bg-support/dim-5',\n 'enabled:active:bg-support/dim-5',\n 'focus-visible:bg-support/dim-5',\n 'aria-pressed:bg-support-container aria-pressed:text-on-support-container aria-pressed:enabled:hover:bg-support-container/dim-1',\n 'text-support',\n ]),\n },\n {\n intent: 'accent',\n design: 'outlined',\n class: tw([\n 'enabled:hover:bg-accent/dim-5',\n 'enabled:active:bg-accent/dim-5',\n 'focus-visible:bg-accent/dim-5',\n 'aria-pressed:bg-accent-container',\n 'aria-pressed:bg-accent-container aria-pressed:text-on-accent-container aria-pressed:enabled:hover:bg-accent-container/dim-1',\n 'text-accent',\n ]),\n },\n {\n design: 'outlined',\n intent: 'success',\n class: tw([\n 'enabled:hover:bg-success/dim-5',\n 'enabled:active:bg-success/dim-5',\n 'focus-visible:bg-success/dim-5',\n 'aria-pressed:bg-success-container aria-pressed:text-on-success-container aria-pressed:enabled:hover:bg-success-container/dim-1',\n 'text-success',\n ]),\n },\n {\n intent: 'alert',\n design: 'outlined',\n class: tw([\n 'enabled:hover:bg-alert/dim-5',\n 'enabled:active:bg-alert/dim-5',\n 'focus-visible:bg-alert/dim-5',\n 'aria-pressed:bg-alert-container aria-pressed:text-on-alert-container aria-pressed:enabled:hover:bg-alert-container/dim-1',\n 'text-alert',\n ]),\n },\n {\n design: 'outlined',\n intent: 'danger',\n class: tw([\n 'enabled:hover:bg-error/dim-5',\n 'enabled:active:bg-error/dim-5',\n 'focus-visible:bg-error/dim-5',\n 'aria-pressed:bg-error-container aria-pressed:text-on-error-container aria-pressed:enabled:hover:bg-error-container/dim-1',\n 'text-error',\n ]),\n },\n {\n design: 'outlined',\n intent: 'info',\n class: tw([\n 'enabled:hover:bg-info/dim-5',\n 'enabled:active:bg-info/dim-5',\n 'focus-visible:bg-info/dim-5',\n 'aria-pressed:bg-info-container aria-pressed:text-on-info-container aria-pressed:enabled:hover:bg-info-container/dim-1',\n 'text-info',\n ]),\n },\n {\n design: 'outlined',\n intent: 'neutral',\n class: tw([\n 'enabled:hover:bg-neutral/dim-5',\n 'enabled:active:bg-neutral/dim-5',\n 'focus-visible:bg-neutral/dim-5',\n 'aria-pressed:bg-neutral-container aria-pressed:text-on-neutral-container aria-pressed:enabled:hover:bg-neutral-container/dim-1',\n 'text-neutral',\n ]),\n },\n {\n design: 'outlined',\n intent: 'surface',\n class: tw([\n 'enabled:hover:bg-surface/dim-5',\n 'enabled:active:bg-surface/dim-5',\n 'focus-visible:bg-surface/dim-5',\n 'aria-pressed:bg-surface aria-pressed:text-on-surface aria-pressed:enabled:hover:bg-surface-hovered',\n 'text-surface',\n ]),\n },\n /** Spacings **/\n {\n design: 'outlined',\n hasClearButton: false,\n class: tw(['px-[calc(var(--spacing-md)-var(--border-width-sm))]']),\n },\n {\n design: 'outlined',\n hasClearButton: true,\n class: tw(['pl-[calc(var(--spacing-md)-var(--border-width-sm))]']),\n },\n] as const\n","import { tw } from '@spark-ui/internal-utils'\n\nexport const tintedVariants = [\n /** Intents **/\n {\n intent: 'main',\n design: 'tinted',\n class: tw([\n 'bg-main-container',\n 'enabled:hover:bg-main-container-hovered',\n 'enabled:active:bg-main-container-hovered',\n 'focus-visible:bg-main-container-hovered',\n 'aria-pressed:bg-main aria-pressed:text-on-main aria-pressed:enabled:hover:bg-main/dim-1',\n 'text-on-main-container',\n ]),\n },\n {\n intent: 'support',\n design: 'tinted',\n class: tw([\n 'bg-support-container',\n 'enabled:hover:bg-support-container-hovered',\n 'enabled:active:bg-support-container-hovered',\n 'focus-visible:bg-support-container-hovered',\n 'aria-pressed:bg-support aria-pressed:text-on-support aria-pressed:enabled:hover:bg-support/dim-1',\n 'text-on-support-container',\n ]),\n },\n {\n intent: 'accent',\n design: 'tinted',\n class: tw([\n 'bg-accent-container',\n 'enabled:hover:bg-accent-container-hovered',\n 'enabled:active:bg-accent-container-hovered',\n 'focus-visible:bg-accent-container-hovered',\n 'aria-pressed:bg-accent aria-pressed:text-on-accent aria-pressed:enabled:hover:bg-accent/dim-1',\n 'text-on-accent-container',\n ]),\n },\n {\n intent: 'success',\n design: 'tinted',\n class: tw([\n 'bg-success-container',\n 'enabled:hover:bg-success-container-hovered',\n 'enabled:active:bg-success-container-hovered',\n 'focus-visible:bg-success-container-hovered',\n 'aria-pressed:bg-success aria-pressed:text-on-success aria-pressed:enabled:hover:bg-success/dim-1',\n 'text-on-success-container',\n ]),\n },\n {\n intent: 'alert',\n design: 'tinted',\n class: tw([\n 'bg-alert-container',\n 'enabled:hover:bg-alert-container-hovered',\n 'enabled:active:bg-alert-container-hovered',\n 'focus-visible:bg-alert-container-hovered',\n 'aria-pressed:bg-alert aria-pressed:text-on-alert aria-pressed:enabled:hover:bg-alert/dim-1',\n 'text-on-alert-container',\n ]),\n },\n {\n intent: 'danger',\n design: 'tinted',\n class: tw([\n 'bg-error-container',\n 'enabled:hover:bg-error-container-hovered',\n 'enabled:active:bg-error-container-hovered',\n 'focus-visible:bg-error-container-hovered',\n 'aria-pressed:bg-error aria-pressed:text-on-error aria-pressed:enabled:hover:bg-error/dim-1',\n 'text-on-error-container',\n ]),\n },\n {\n intent: 'info',\n design: 'tinted',\n class: tw([\n 'bg-info-container',\n 'enabled:hover:bg-info-container-hovered',\n 'enabled:active:bg-info-container-hovered',\n 'focus-visible:bg-info-container-hovered',\n 'aria-pressed:bg-info aria-pressed:text-on-info aria-pressed:enabled:hover:bg-info/dim-1',\n 'text-on-info-container',\n ]),\n },\n {\n intent: 'neutral',\n design: 'tinted',\n class: tw([\n 'bg-neutral-container',\n 'enabled:hover:bg-neutral-container-hovered',\n 'enabled:active:bg-neutral-container-hovered',\n 'focus-visible:bg-neutral-container-hovered',\n 'aria-pressed:bg-neutral aria-pressed:text-on-neutral aria-pressed:enabled:hover:bg-neutral/dim-1',\n 'text-on-neutral-container',\n ]),\n },\n {\n intent: 'surface',\n design: 'tinted',\n class: tw([\n 'bg-surface/dim-1',\n 'enabled:hover:bg-surface-hovered/dim-1',\n 'enabled:active:bg-surface-hovered/dim-1',\n 'focus-visible:bg-surface-hovered/dim-1',\n 'aria-pressed:bg-surface aria-pressed:text-on-surface aria-pressed:enabled:hover:bg-surface-hovered',\n 'text-on-surface/dim-1',\n ]),\n },\n /** Spacings **/\n {\n design: 'tinted',\n hasClearButton: false,\n class: tw(['px-md']),\n },\n {\n design: 'tinted',\n hasClearButton: true,\n class: tw(['pl-md']),\n },\n] as const\n","import { tw } from '@spark-ui/internal-utils'\n\nexport const dashedVariants = [\n /** Intents **/\n {\n intent: 'main',\n design: 'dashed',\n class: tw([\n 'enabled:hover:bg-main/dim-5',\n 'enabled:active:bg-main/dim-5',\n 'focus-visible:bg-main/dim-5',\n 'aria-pressed:bg-main-container aria-pressed:text-on-main-container aria-pressed:enabled:hover:bg-main-container/dim-1',\n 'text-main',\n ]),\n },\n {\n intent: 'support',\n design: 'dashed',\n class: tw([\n 'enabled:hover:bg-support/dim-5',\n 'enabled:active:bg-support/dim-5',\n 'focus-visible:bg-support/dim-5',\n 'aria-pressed:bg-support-container aria-pressed:text-on-support-container aria-pressed:enabled:hover:bg-support-container/dim-1',\n 'text-support',\n ]),\n },\n {\n intent: 'accent',\n design: 'dashed',\n class: tw([\n 'enabled:hover:bg-accent/dim-5',\n 'enabled:active:bg-accent/dim-5',\n 'focus-visible:bg-accent/dim-5',\n 'aria-pressed:bg-accent-container aria-pressed:text-on-accent-container aria-pressed:enabled:hover:bg-accent-container/dim-1',\n 'text-accent',\n ]),\n },\n {\n intent: 'success',\n design: 'dashed',\n class: tw([\n 'enabled:hover:bg-success/dim-5',\n 'enabled:active:bg-success/dim-5',\n 'focus-visible:bg-success/dim-5',\n 'aria-pressed:bg-success-container aria-pressed:text-on-success-container aria-pressed:enabled:hover:bg-success-container/dim-1',\n 'text-success',\n ]),\n },\n {\n intent: 'alert',\n design: 'dashed',\n class: tw([\n 'enabled:hover:bg-alert/dim-5',\n 'enabled:active:bg-alert/dim-5',\n 'focus-visible:bg-alert/dim-5',\n 'aria-pressed:bg-alert-container aria-pressed:text-on-alert-container aria-pressed:enabled:hover:bg-alert-container/dim-1',\n 'text-alert',\n ]),\n },\n {\n intent: 'danger',\n design: 'dashed',\n class: tw([\n 'enabled:hover:bg-error/dim-5',\n 'enabled:active:bg-error/dim-5',\n 'focus-visible:bg-error/dim-5',\n 'aria-pressed:bg-error-container aria-pressed:text-on-error-container aria-pressed:enabled:hover:bg-error-container/dim-1',\n 'text-error',\n ]),\n },\n {\n intent: 'info',\n design: 'dashed',\n class: tw([\n 'enabled:hover:bg-info/dim-5',\n 'enabled:active:bg-info/dim-5',\n 'focus-visible:bg-info/dim-5',\n 'aria-pressed:bg-info-container aria-pressed:text-on-info-container aria-pressed:enabled:hover:bg-info-container/dim-1',\n 'text-info',\n ]),\n },\n {\n intent: 'neutral',\n design: 'dashed',\n class: tw([\n 'enabled:hover:bg-neutral/dim-5',\n 'enabled:active:bg-neutral/dim-5',\n 'focus-visible:bg-neutral/dim-5',\n 'aria-pressed:bg-neutral-container aria-pressed:text-on-neutral-container aria-pressed:enabled:hover:bg-neutral-container/dim-1',\n 'text-neutral',\n ]),\n },\n {\n intent: 'surface',\n design: 'dashed',\n class: tw([\n 'enabled:hover:bg-surface/dim-5',\n 'enabled:active:bg-surface/dim-5',\n 'focus-visible:bg-surface/dim-5',\n 'aria-pressed:bg-surface aria-pressed:text-on-surface aria-pressed:enabled:hover:bg-surface-hovered',\n 'text-surface',\n ]),\n },\n /** Spacings **/\n {\n design: 'dashed',\n hasClearButton: false,\n class: tw(['px-[calc(var(--spacing-md)-var(--border-width-sm))]']),\n },\n {\n design: 'dashed',\n hasClearButton: true,\n class: tw(['pl-[calc(var(--spacing-md)-var(--border-width-sm))]']),\n },\n] as const\n","import { makeVariants } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nimport { dashedVariants, outlinedVariants, tintedVariants } from './variants'\n\nexport const chipStyles = cva(\n [\n 'box-border inline-flex h-sz-32 flex-nowrap items-center justify-center rounded-chip text-body-1 font-regular',\n 'focus-visible:u-outline',\n 'ease-out duration-150',\n ],\n {\n variants: {\n /**\n * Main style of the chip.\n *\n * - `filled`: Chip will be plain.\n *\n * - `outlined`: Chip will be transparent with an outline.\n *\n * - `tinted`: Chip will be filled but using a lighter color scheme.\n *\n * - `dashed`: Chip will be transparent with an outline dashed.\n */\n design: makeVariants<'design', ['outlined', 'tinted', 'dashed']>({\n outlined: ['bg-transparent border-sm border-solid border-current'],\n tinted: [''],\n dashed: [\n 'bg-transparent border-sm border-dashed shadow-none focus-visible:border-outline-high',\n ],\n }),\n /**\n * Color scheme of the chip.\n */\n intent: makeVariants<\n 'intent',\n ['main', 'support', 'accent', 'success', 'alert', 'danger', 'info', 'neutral', 'surface']\n >({\n main: [],\n support: [],\n accent: [],\n success: [],\n alert: [],\n danger: [],\n info: [],\n neutral: [],\n surface: [],\n }),\n /**\n * Disable the chip, preventing user interaction and adding opacity.\n */\n disabled: {\n true: ['cursor-not-allowed', 'opacity-dim-3'],\n },\n hasClearButton: {\n true: [],\n false: [],\n },\n // 'pl-[calc(var(--spacing-md)-(var(--border-width-sm)))]'\n },\n compoundVariants: [...outlinedVariants, ...tintedVariants, ...dashedVariants],\n defaultVariants: {\n design: 'outlined',\n intent: 'support',\n },\n }\n)\n\nexport type ChipStylesProps = VariantProps<typeof chipStyles>\n","import { createContext, useContext } from 'react'\n\nimport { type ChipProps } from './Chip'\n\nexport type ChipsContextType = Pick<ChipProps, 'disabled' | 'design' | 'intent' | 'onClear'>\n\nexport const ChipContext = createContext<ChipsContextType>({} as ChipsContextType)\nexport const useChipContext = () => useContext(ChipContext) || {}\n","import { useCombinedState } from '@spark-ui/hooks/use-combined-state'\nimport { emulateTab } from 'emulate-tab'\nimport {\n Children,\n ElementType,\n FC,\n ForwardRefExoticComponent,\n HTMLAttributes,\n isValidElement,\n KeyboardEvent,\n MouseEvent,\n ReactElement,\n ReactNode,\n RefAttributes,\n} from 'react'\n\nimport { Slot } from '../slot'\n\ninterface ReturnedValue {\n Element:\n | ForwardRefExoticComponent<\n HTMLAttributes<HTMLElement> & {\n children?: ReactNode\n } & RefAttributes<HTMLElement>\n >\n | ElementType\n chipProps:\n | {\n type: 'button'\n 'aria-pressed'?: boolean\n 'data-state'?: 'on' | 'off'\n onClick: (event: MouseEvent<HTMLButtonElement>) => void\n onKeyDown?: (event: KeyboardEvent<HTMLButtonElement>) => void\n disabled?: boolean\n children: ReactNode\n }\n | {\n 'aria-disabled'?: boolean\n children: ReactNode\n onKeyDown?: (event: KeyboardEvent<HTMLButtonElement>) => void\n }\n compoundElements: {\n leadingIcon: ReactNode\n trailingIcon: ReactNode\n content: ReactNode\n clearButton: ReactNode\n }\n}\n\nconst getDisplayName = (element?: ReactElement) => {\n return element ? (element.type as FC).displayName : ''\n}\n\nconst findElement =\n (children: ReactNode) =>\n (...values: string[]) => {\n const validChildren = Children.toArray(children).filter(isValidElement)\n\n return validChildren.find(child => {\n const displayName = getDisplayName(child)\n\n return values.includes(displayName || '')\n })\n }\n\nexport const useChipElement = ({\n onClick,\n asChild,\n pressed,\n defaultPressed,\n disabled,\n value,\n defaultValue,\n children,\n onClear,\n}: {\n onClick?: (\n event: MouseEvent<HTMLButtonElement>,\n args: { pressed: boolean; value?: string | number | readonly string[] }\n ) => void\n onKeyDown?: (event: KeyboardEvent<HTMLButtonElement>) => void\n asChild?: boolean\n pressed?: boolean\n defaultPressed?: boolean\n value?: string | number | readonly string[]\n defaultValue?: string | number | readonly string[]\n disabled?: boolean\n children?: ReactNode\n onClear?: (event?: MouseEvent<HTMLButtonElement>) => void\n}): ReturnedValue => {\n const [isPressed, setIsPressed] = useCombinedState<boolean | undefined>(pressed, defaultPressed)\n const [innerValue] = useCombinedState<string | number | readonly string[] | undefined>(\n value,\n defaultValue\n )\n\n const findChipElement = findElement(children)\n\n const leadingIcon = findChipElement('Chip.LeadingIcon')\n const trailingIcon = findChipElement('Chip.TrailingIcon')\n const content = findChipElement('Chip.Content')\n const clearButton = findChipElement('Chip.ClearButton')\n\n const isButton = (onClick || isPressed) !== undefined\n\n const formattedChildren = [leadingIcon, content, clearButton].every(\n element => element === undefined\n ) ? (\n <span className=\"inline-block grow truncate\">{children}</span>\n ) : (\n <>\n {leadingIcon}\n {content}\n {leadingIcon === undefined ? trailingIcon : null}\n {clearButton}\n </>\n )\n\n const onKeyDown = (event: KeyboardEvent<HTMLButtonElement>): void => {\n if (!!clearButton && !disabled && ['Delete', 'Backspace'].includes(event.key)) {\n if (onClear) {\n onClear()\n event.key === 'Delete' && emulateTab()\n event.key === 'Backspace' && emulateTab.backwards()\n }\n }\n }\n\n if (isButton) {\n return {\n Element: asChild ? Slot : 'button',\n chipProps: {\n type: 'button',\n ...(isPressed !== undefined && {\n 'aria-pressed': isPressed,\n 'data-state': isPressed ? 'on' : 'off',\n }),\n onClick: (event: MouseEvent<HTMLButtonElement>): void => {\n isPressed !== undefined && setIsPressed(!isPressed)\n onClick && onClick(event, { pressed: isPressed as boolean, value: innerValue })\n },\n onKeyDown,\n disabled,\n children: formattedChildren,\n },\n compoundElements: {\n leadingIcon,\n trailingIcon,\n content,\n clearButton,\n },\n }\n }\n\n return {\n Element: asChild ? Slot : 'div',\n chipProps: {\n 'aria-disabled': disabled,\n children: formattedChildren,\n onKeyDown,\n },\n compoundElements: {\n leadingIcon,\n trailingIcon,\n content,\n clearButton,\n },\n }\n}\n","import { ComponentPropsWithoutRef, MouseEvent, Ref } from 'react'\n\nimport { chipStyles, type ChipStylesProps } from './Chip.styles'\nimport { ChipContext } from './useChipContext'\nimport { useChipElement } from './useChipElement'\n\ntype ChipPrimitiveProps = Omit<ComponentPropsWithoutRef<'button'>, 'onClick' | 'disabled' | 'type'>\n\nexport interface ChipProps extends ChipPrimitiveProps, Omit<ChipStylesProps, 'hasClearButton'> {\n /**\n * Configures a toggleButton aria-pressed initial value\n */\n defaultPressed?: boolean\n /**\n * Configures a toggleButton aria-pressed value\n */\n pressed?: boolean\n /**\n * Change the component to the HTML tag or custom component of the only child.\n */\n asChild?: boolean\n /**\n * Event handler fired each clicking event\n */\n onClick?: (\n event: MouseEvent<HTMLButtonElement>,\n args: { pressed: boolean; value?: number | string | readonly string[] }\n ) => void\n /**\n * Clear chip handler\n */\n onClear?: (event?: MouseEvent<HTMLButtonElement>) => void\n ref?: Ref<HTMLButtonElement | HTMLDivElement>\n}\n\nexport const Chip = ({\n design = 'outlined',\n disabled,\n children,\n intent = 'support',\n defaultPressed,\n pressed,\n asChild,\n className,\n onClick,\n onClear,\n ref: forwardedRef,\n ...otherProps\n}: ChipProps) => {\n const {\n Element: ChipElement,\n chipProps: { children: formattedChildren, ...chipProps },\n compoundElements,\n } = useChipElement({\n asChild,\n pressed,\n defaultPressed,\n onClick,\n disabled: !!disabled,\n value: otherProps.value,\n defaultValue: otherProps.defaultValue,\n children,\n onClear,\n })\n\n const { clearButton } = compoundElements\n\n return (\n <ChipContext value={{ disabled, design, intent, onClear }}>\n <ChipElement\n ref={forwardedRef}\n className={chipStyles({\n className,\n design,\n disabled,\n intent,\n hasClearButton: !!clearButton,\n })}\n {...{\n ...chipProps,\n ...otherProps,\n }}\n data-spark-component=\"chip\"\n >\n {formattedChildren}\n </ChipElement>\n </ChipContext>\n )\n}\n\nChip.displayName = 'Chip'\n","import { tw } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nexport const chipClearButtonWrapperStyles = cva(\n ['ml-md flex h-full items-center justify-center focus-visible:outline-hidden'],\n {\n variants: {\n disabled: {\n false: ['cursor-pointer'],\n true: ['cursor-not-allowed'],\n },\n isBordered: {\n false: ['pr-md'],\n true: ['pr-[7px]'],\n },\n design: {\n outlined: [],\n tinted: [],\n dashed: [],\n },\n },\n compoundVariants: [\n {\n design: 'outlined',\n disabled: false,\n class: tw(['hover:opacity-dim-1']),\n },\n {\n design: 'outlined',\n disabled: true,\n class: tw(['opacity-dim-3']),\n },\n {\n design: 'tinted',\n disabled: false,\n class: tw(['hover:opacity-dim-1']),\n },\n {\n design: 'tinted',\n disabled: true,\n class: tw(['opacity-dim-3']),\n },\n {\n design: 'dashed',\n disabled: false,\n class: tw(['hover:opacity-dim-1']),\n },\n {\n design: 'dashed',\n disabled: true,\n class: tw(['opacity-dim-3']),\n },\n ],\n }\n)\n\nexport const chipClearButtonStyles = cva(\n ['rounded-full p-sz-2 [font-size:var(--spacing-sz-8)] border-sm', 'focus-visible:u-outline'],\n {\n variants: {\n disabled: {\n true: ['cursor-not-allowed'],\n false: ['cursor-pointer'],\n },\n },\n defaultVariants: {\n disabled: false,\n },\n }\n)\n\nexport type ChipClearButtonStylesProps = VariantProps<typeof chipClearButtonWrapperStyles>\n","import { Close } from '@spark-ui/icons/Close'\nimport {\n cloneElement,\n ComponentPropsWithoutRef,\n MouseEvent,\n ReactElement,\n Ref,\n useCallback,\n} from 'react'\n\nimport { Icon } from '../icon'\nimport {\n chipClearButtonStyles,\n type ChipClearButtonStylesProps,\n chipClearButtonWrapperStyles,\n} from './ChipClearButton.styles'\nimport { useChipContext } from './useChipContext'\n\nexport interface ChipClearButtonProps\n extends ComponentPropsWithoutRef<'span'>, ChipClearButtonStylesProps {\n label: string\n ref?: Ref<HTMLSpanElement>\n}\n\n/**\n * A button to remove or clear the chip. Renders a <button> element wrapped in a <span>.\n */\nexport const ChipClearButton = ({\n children = (\n <Icon>\n <Close />\n </Icon>\n ),\n tabIndex = 0,\n label,\n ref: forwardedRef,\n}: ChipClearButtonProps) => {\n const { design, disabled, onClear } = useChipContext()\n\n const onClearHandler = useCallback(\n (event: MouseEvent<HTMLButtonElement>) => {\n event.stopPropagation()\n !disabled && onClear && onClear(event)\n },\n [disabled, onClear]\n )\n\n return (\n <span\n className={chipClearButtonWrapperStyles({\n isBordered: ['outline', 'dashed'].includes(`${design}`),\n disabled: !!disabled,\n design,\n })}\n onClick={onClearHandler}\n ref={forwardedRef}\n >\n <button\n tabIndex={tabIndex}\n type=\"button\"\n disabled={!!disabled}\n className={chipClearButtonStyles({ disabled })}\n aria-label={label}\n >\n {children && cloneElement(children as ReactElement<HTMLElement>, { ariaLabel: label })}\n </button>\n </span>\n )\n}\n\nChipClearButton.displayName = 'Chip.ClearButton'\n","import { cx } from 'class-variance-authority'\nimport { ComponentPropsWithoutRef, Ref } from 'react'\n\nexport type ChipContentProps = ComponentPropsWithoutRef<'span'> & {\n ref?: Ref<HTMLSpanElement>\n}\n\n/**\n * The main text content of the chip. Renders a <span> element.\n */\nexport const ChipContent = ({ children, className, ref: forwardedRef }: ChipContentProps) => {\n return (\n <span className={cx('inline-block grow truncate', className)} ref={forwardedRef}>\n {children}\n </span>\n )\n}\n\nChipContent.displayName = 'Chip.Content'\n","import { cx } from 'class-variance-authority'\nimport { ComponentPropsWithoutRef, Ref } from 'react'\n\nexport type ChipIconProps = ComponentPropsWithoutRef<'span'> & {\n ref?: Ref<HTMLSpanElement>\n}\n\nexport const ChipIcon = ({ children, className, ref: forwardedRef }: ChipIconProps) => {\n return (\n <span className={cx('flex h-full items-center justify-center', className)} ref={forwardedRef}>\n {children}\n </span>\n )\n}\n\nChipIcon.displayName = 'Chip.Icon'\n","import { cx } from 'class-variance-authority'\nimport { Ref } from 'react'\n\nimport { ChipIcon, type ChipIconProps } from './ChipIcon'\n\nexport type ChipLeadingIconProps = ChipIconProps & {\n ref?: Ref<HTMLSpanElement>\n}\n\n/**\n * An icon displayed at the start of the chip. Renders a <span> element.\n */\nexport const ChipLeadingIcon = ({\n className,\n ref: forwardedRef,\n ...props\n}: ChipLeadingIconProps) => (\n <ChipIcon className={cx('mr-sm', className)} ref={forwardedRef} {...props} />\n)\n\nChipLeadingIcon.displayName = 'Chip.LeadingIcon'\n","import { cx } from 'class-variance-authority'\nimport { Ref } from 'react'\n\nimport { ChipIcon, type ChipIconProps } from './ChipIcon'\n\nexport type ChipTrailingIconProps = ChipIconProps & {\n ref?: Ref<HTMLSpanElement>\n}\n\n/**\n * An icon displayed at the end of the chip. Renders a <span> element.\n */\nexport const ChipTrailingIcon = ({\n className,\n ref: forwardedRef,\n ...props\n}: ChipTrailingIconProps) => (\n <ChipIcon className={cx('ml-md', className)} ref={forwardedRef} {...props} />\n)\n\nChipTrailingIcon.displayName = 'Chip.TrailingIcon'\n","import { Chip as Root } from './Chip'\nimport { ChipClearButton } from './ChipClearButton'\nimport { ChipContent } from './ChipContent'\nimport { ChipLeadingIcon } from './ChipLeadingIcon'\nimport { ChipTrailingIcon } from './ChipTrailingIcon'\n\n/**\n * A compact, interactive element used for input, filtering, or representing attributes.\n */\nexport const Chip: typeof Root & {\n Content: typeof ChipContent\n LeadingIcon: typeof ChipLeadingIcon\n TrailingIcon: typeof ChipTrailingIcon\n ClearButton: typeof ChipClearButton\n} = Object.assign(Root, {\n Content: ChipContent,\n LeadingIcon: ChipLeadingIcon,\n TrailingIcon: ChipTrailingIcon,\n ClearButton: ChipClearButton,\n})\n\nChip.displayName = 'Chip'\nChip.ClearButton.displayName = 'Chip.ClearButton'\nChip.Content.displayName = 'Chip.Content'\nChip.LeadingIcon.displayName = 'Chip.LeadingIcon'\nChip.TrailingIcon.displayName = 'Chip.TrailingIcon'\n\nexport { type ChipClearButtonProps } from './ChipClearButton'\nexport { type ChipContentProps } from './ChipContent'\nexport { type ChipLeadingIconProps } from './ChipLeadingIcon'\nexport { type ChipTrailingIconProps } from './ChipTrailingIcon'\n"],"mappings":";;;;;;;;;;AAEA,IAAa,IAAmB;CAE9B;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CAED;EACE,QAAQ;EACR,gBAAgB;EAChB,OAAO,EAAG,CAAC,sDAAsD,CAAC;EACnE;CACD;EACE,QAAQ;EACR,gBAAgB;EAChB,OAAO,EAAG,CAAC,sDAAsD,CAAC;EACnE;CACF,ECjHY,IAAiB;CAE5B;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CAED;EACE,QAAQ;EACR,gBAAgB;EAChB,OAAO,EAAG,CAAC,QAAQ,CAAC;EACrB;CACD;EACE,QAAQ;EACR,gBAAgB;EAChB,OAAO,EAAG,CAAC,QAAQ,CAAC;EACrB;CACF,ECzHY,IAAiB;CAE5B;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EA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"}
1
+ {"version":3,"file":"index.mjs","names":[],"sources":["../../src/chip/variants/outlined.ts","../../src/chip/variants/tinted.ts","../../src/chip/variants/dashed.ts","../../src/chip/Chip.styles.tsx","../../src/chip/useChipContext.tsx","../../src/chip/useChipElement.tsx","../../src/chip/Chip.tsx","../../src/chip/ChipClearButton.styles.tsx","../../src/chip/ChipClearButton.tsx","../../src/chip/ChipContent.tsx","../../src/chip/ChipIcon.tsx","../../src/chip/ChipLeadingIcon.tsx","../../src/chip/ChipTrailingIcon.tsx","../../src/chip/index.ts"],"sourcesContent":["import { tw } from '@spark-ui/internal-utils'\n\nexport const outlinedVariants = [\n /** Intents **/\n {\n design: 'outlined',\n intent: 'main',\n class: tw([\n 'enabled:hover:bg-main/dim-5',\n 'enabled:active:bg-main/dim-5',\n 'focus-visible:bg-main/dim-5',\n 'aria-pressed:bg-main-container aria-pressed:text-on-main-container aria-pressed:enabled:hover:bg-main-container/dim-1',\n 'text-main',\n ]),\n },\n {\n design: 'outlined',\n intent: 'support',\n class: tw([\n 'enabled:hover:bg-support/dim-5',\n 'enabled:active:bg-support/dim-5',\n 'focus-visible:bg-support/dim-5',\n 'aria-pressed:bg-support-container aria-pressed:text-on-support-container aria-pressed:enabled:hover:bg-support-container/dim-1',\n 'text-support',\n ]),\n },\n {\n intent: 'accent',\n design: 'outlined',\n class: tw([\n 'enabled:hover:bg-accent/dim-5',\n 'enabled:active:bg-accent/dim-5',\n 'focus-visible:bg-accent/dim-5',\n 'aria-pressed:bg-accent-container',\n 'aria-pressed:bg-accent-container aria-pressed:text-on-accent-container aria-pressed:enabled:hover:bg-accent-container/dim-1',\n 'text-accent',\n ]),\n },\n {\n design: 'outlined',\n intent: 'success',\n class: tw([\n 'enabled:hover:bg-success/dim-5',\n 'enabled:active:bg-success/dim-5',\n 'focus-visible:bg-success/dim-5',\n 'aria-pressed:bg-success-container aria-pressed:text-on-success-container aria-pressed:enabled:hover:bg-success-container/dim-1',\n 'text-success',\n ]),\n },\n {\n intent: 'alert',\n design: 'outlined',\n class: tw([\n 'enabled:hover:bg-alert/dim-5',\n 'enabled:active:bg-alert/dim-5',\n 'focus-visible:bg-alert/dim-5',\n 'aria-pressed:bg-alert-container aria-pressed:text-on-alert-container aria-pressed:enabled:hover:bg-alert-container/dim-1',\n 'text-alert',\n ]),\n },\n {\n design: 'outlined',\n intent: 'danger',\n class: tw([\n 'enabled:hover:bg-error/dim-5',\n 'enabled:active:bg-error/dim-5',\n 'focus-visible:bg-error/dim-5',\n 'aria-pressed:bg-error-container aria-pressed:text-on-error-container aria-pressed:enabled:hover:bg-error-container/dim-1',\n 'text-error',\n ]),\n },\n {\n design: 'outlined',\n intent: 'info',\n class: tw([\n 'enabled:hover:bg-info/dim-5',\n 'enabled:active:bg-info/dim-5',\n 'focus-visible:bg-info/dim-5',\n 'aria-pressed:bg-info-container aria-pressed:text-on-info-container aria-pressed:enabled:hover:bg-info-container/dim-1',\n 'text-info',\n ]),\n },\n {\n design: 'outlined',\n intent: 'neutral',\n class: tw([\n 'enabled:hover:bg-neutral/dim-5',\n 'enabled:active:bg-neutral/dim-5',\n 'focus-visible:bg-neutral/dim-5',\n 'aria-pressed:bg-neutral-container aria-pressed:text-on-neutral-container aria-pressed:enabled:hover:bg-neutral-container/dim-1',\n 'text-neutral',\n ]),\n },\n {\n design: 'outlined',\n intent: 'surface',\n class: tw([\n 'enabled:hover:bg-surface/dim-5',\n 'enabled:active:bg-surface/dim-5',\n 'focus-visible:bg-surface/dim-5',\n 'aria-pressed:bg-surface aria-pressed:text-on-surface aria-pressed:enabled:hover:bg-surface-hovered',\n 'text-surface',\n ]),\n },\n /** Spacings **/\n {\n design: 'outlined',\n hasClearButton: false,\n class: tw(['px-[calc(var(--spacing-md)-var(--border-width-sm))]']),\n },\n {\n design: 'outlined',\n hasClearButton: true,\n class: tw(['pl-[calc(var(--spacing-md)-var(--border-width-sm))]']),\n },\n] as const\n","import { tw } from '@spark-ui/internal-utils'\n\nexport const tintedVariants = [\n /** Intents **/\n {\n intent: 'main',\n design: 'tinted',\n class: tw([\n 'bg-main-container',\n 'enabled:hover:bg-main-container-hovered',\n 'enabled:active:bg-main-container-hovered',\n 'focus-visible:bg-main-container-hovered',\n 'aria-pressed:bg-main aria-pressed:text-on-main aria-pressed:enabled:hover:bg-main/dim-1',\n 'text-on-main-container',\n ]),\n },\n {\n intent: 'support',\n design: 'tinted',\n class: tw([\n 'bg-support-container',\n 'enabled:hover:bg-support-container-hovered',\n 'enabled:active:bg-support-container-hovered',\n 'focus-visible:bg-support-container-hovered',\n 'aria-pressed:bg-support aria-pressed:text-on-support aria-pressed:enabled:hover:bg-support/dim-1',\n 'text-on-support-container',\n ]),\n },\n {\n intent: 'accent',\n design: 'tinted',\n class: tw([\n 'bg-accent-container',\n 'enabled:hover:bg-accent-container-hovered',\n 'enabled:active:bg-accent-container-hovered',\n 'focus-visible:bg-accent-container-hovered',\n 'aria-pressed:bg-accent aria-pressed:text-on-accent aria-pressed:enabled:hover:bg-accent/dim-1',\n 'text-on-accent-container',\n ]),\n },\n {\n intent: 'success',\n design: 'tinted',\n class: tw([\n 'bg-success-container',\n 'enabled:hover:bg-success-container-hovered',\n 'enabled:active:bg-success-container-hovered',\n 'focus-visible:bg-success-container-hovered',\n 'aria-pressed:bg-success aria-pressed:text-on-success aria-pressed:enabled:hover:bg-success/dim-1',\n 'text-on-success-container',\n ]),\n },\n {\n intent: 'alert',\n design: 'tinted',\n class: tw([\n 'bg-alert-container',\n 'enabled:hover:bg-alert-container-hovered',\n 'enabled:active:bg-alert-container-hovered',\n 'focus-visible:bg-alert-container-hovered',\n 'aria-pressed:bg-alert aria-pressed:text-on-alert aria-pressed:enabled:hover:bg-alert/dim-1',\n 'text-on-alert-container',\n ]),\n },\n {\n intent: 'danger',\n design: 'tinted',\n class: tw([\n 'bg-error-container',\n 'enabled:hover:bg-error-container-hovered',\n 'enabled:active:bg-error-container-hovered',\n 'focus-visible:bg-error-container-hovered',\n 'aria-pressed:bg-error aria-pressed:text-on-error aria-pressed:enabled:hover:bg-error/dim-1',\n 'text-on-error-container',\n ]),\n },\n {\n intent: 'info',\n design: 'tinted',\n class: tw([\n 'bg-info-container',\n 'enabled:hover:bg-info-container-hovered',\n 'enabled:active:bg-info-container-hovered',\n 'focus-visible:bg-info-container-hovered',\n 'aria-pressed:bg-info aria-pressed:text-on-info aria-pressed:enabled:hover:bg-info/dim-1',\n 'text-on-info-container',\n ]),\n },\n {\n intent: 'neutral',\n design: 'tinted',\n class: tw([\n 'bg-neutral-container',\n 'enabled:hover:bg-neutral-container-hovered',\n 'enabled:active:bg-neutral-container-hovered',\n 'focus-visible:bg-neutral-container-hovered',\n 'aria-pressed:bg-neutral aria-pressed:text-on-neutral aria-pressed:enabled:hover:bg-neutral/dim-1',\n 'text-on-neutral-container',\n ]),\n },\n {\n intent: 'surface',\n design: 'tinted',\n class: tw([\n 'bg-surface/dim-1',\n 'enabled:hover:bg-surface-hovered/dim-1',\n 'enabled:active:bg-surface-hovered/dim-1',\n 'focus-visible:bg-surface-hovered/dim-1',\n 'aria-pressed:bg-surface aria-pressed:text-on-surface aria-pressed:enabled:hover:bg-surface-hovered',\n 'text-on-surface/dim-1',\n ]),\n },\n /** Spacings **/\n {\n design: 'tinted',\n hasClearButton: false,\n class: tw(['px-md']),\n },\n {\n design: 'tinted',\n hasClearButton: true,\n class: tw(['pl-md']),\n },\n] as const\n","import { tw } from '@spark-ui/internal-utils'\n\nexport const dashedVariants = [\n /** Intents **/\n {\n intent: 'main',\n design: 'dashed',\n class: tw([\n 'enabled:hover:bg-main/dim-5',\n 'enabled:active:bg-main/dim-5',\n 'focus-visible:bg-main/dim-5',\n 'aria-pressed:bg-main-container aria-pressed:text-on-main-container aria-pressed:enabled:hover:bg-main-container/dim-1',\n 'text-main',\n ]),\n },\n {\n intent: 'support',\n design: 'dashed',\n class: tw([\n 'enabled:hover:bg-support/dim-5',\n 'enabled:active:bg-support/dim-5',\n 'focus-visible:bg-support/dim-5',\n 'aria-pressed:bg-support-container aria-pressed:text-on-support-container aria-pressed:enabled:hover:bg-support-container/dim-1',\n 'text-support',\n ]),\n },\n {\n intent: 'accent',\n design: 'dashed',\n class: tw([\n 'enabled:hover:bg-accent/dim-5',\n 'enabled:active:bg-accent/dim-5',\n 'focus-visible:bg-accent/dim-5',\n 'aria-pressed:bg-accent-container aria-pressed:text-on-accent-container aria-pressed:enabled:hover:bg-accent-container/dim-1',\n 'text-accent',\n ]),\n },\n {\n intent: 'success',\n design: 'dashed',\n class: tw([\n 'enabled:hover:bg-success/dim-5',\n 'enabled:active:bg-success/dim-5',\n 'focus-visible:bg-success/dim-5',\n 'aria-pressed:bg-success-container aria-pressed:text-on-success-container aria-pressed:enabled:hover:bg-success-container/dim-1',\n 'text-success',\n ]),\n },\n {\n intent: 'alert',\n design: 'dashed',\n class: tw([\n 'enabled:hover:bg-alert/dim-5',\n 'enabled:active:bg-alert/dim-5',\n 'focus-visible:bg-alert/dim-5',\n 'aria-pressed:bg-alert-container aria-pressed:text-on-alert-container aria-pressed:enabled:hover:bg-alert-container/dim-1',\n 'text-alert',\n ]),\n },\n {\n intent: 'danger',\n design: 'dashed',\n class: tw([\n 'enabled:hover:bg-error/dim-5',\n 'enabled:active:bg-error/dim-5',\n 'focus-visible:bg-error/dim-5',\n 'aria-pressed:bg-error-container aria-pressed:text-on-error-container aria-pressed:enabled:hover:bg-error-container/dim-1',\n 'text-error',\n ]),\n },\n {\n intent: 'info',\n design: 'dashed',\n class: tw([\n 'enabled:hover:bg-info/dim-5',\n 'enabled:active:bg-info/dim-5',\n 'focus-visible:bg-info/dim-5',\n 'aria-pressed:bg-info-container aria-pressed:text-on-info-container aria-pressed:enabled:hover:bg-info-container/dim-1',\n 'text-info',\n ]),\n },\n {\n intent: 'neutral',\n design: 'dashed',\n class: tw([\n 'enabled:hover:bg-neutral/dim-5',\n 'enabled:active:bg-neutral/dim-5',\n 'focus-visible:bg-neutral/dim-5',\n 'aria-pressed:bg-neutral-container aria-pressed:text-on-neutral-container aria-pressed:enabled:hover:bg-neutral-container/dim-1',\n 'text-neutral',\n ]),\n },\n {\n intent: 'surface',\n design: 'dashed',\n class: tw([\n 'enabled:hover:bg-surface/dim-5',\n 'enabled:active:bg-surface/dim-5',\n 'focus-visible:bg-surface/dim-5',\n 'aria-pressed:bg-surface aria-pressed:text-on-surface aria-pressed:enabled:hover:bg-surface-hovered',\n 'text-surface',\n ]),\n },\n /** Spacings **/\n {\n design: 'dashed',\n hasClearButton: false,\n class: tw(['px-[calc(var(--spacing-md)-var(--border-width-sm))]']),\n },\n {\n design: 'dashed',\n hasClearButton: true,\n class: tw(['pl-[calc(var(--spacing-md)-var(--border-width-sm))]']),\n },\n] as const\n","import { makeVariants } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nimport { dashedVariants, outlinedVariants, tintedVariants } from './variants'\n\nexport const chipStyles = cva(\n [\n 'box-border inline-flex h-sz-32 flex-nowrap items-center justify-center rounded-chip text-body-1 font-regular',\n 'focus-visible:u-outline',\n 'ease-out duration-150',\n ],\n {\n variants: {\n /**\n * Main style of the chip.\n *\n * - `filled`: Chip will be plain.\n *\n * - `outlined`: Chip will be transparent with an outline.\n *\n * - `tinted`: Chip will be filled but using a lighter color scheme.\n *\n * - `dashed`: Chip will be transparent with an outline dashed.\n */\n design: makeVariants<'design', ['outlined', 'tinted', 'dashed']>({\n outlined: ['bg-transparent border-sm border-solid border-current'],\n tinted: [''],\n dashed: [\n 'bg-transparent border-sm border-dashed shadow-none focus-visible:border-outline-high',\n ],\n }),\n /**\n * Color scheme of the chip.\n */\n intent: makeVariants<\n 'intent',\n ['main', 'support', 'accent', 'success', 'alert', 'danger', 'info', 'neutral', 'surface']\n >({\n main: [],\n support: [],\n accent: [],\n success: [],\n alert: [],\n danger: [],\n info: [],\n neutral: [],\n surface: [],\n }),\n /**\n * Disable the chip, preventing user interaction and adding opacity.\n */\n disabled: {\n true: ['cursor-not-allowed', 'opacity-dim-3'],\n },\n hasClearButton: {\n true: [],\n false: [],\n },\n // 'pl-[calc(var(--spacing-md)-(var(--border-width-sm)))]'\n },\n compoundVariants: [...outlinedVariants, ...tintedVariants, ...dashedVariants],\n defaultVariants: {\n design: 'outlined',\n intent: 'support',\n },\n }\n)\n\nexport type ChipStylesProps = VariantProps<typeof chipStyles>\n","import { createContext, useContext } from 'react'\n\nimport { type ChipProps } from './Chip'\n\nexport type ChipsContextType = Pick<ChipProps, 'disabled' | 'design' | 'intent' | 'onClear'>\n\nexport const ChipContext = createContext<ChipsContextType>({} as ChipsContextType)\nexport const useChipContext = () => useContext(ChipContext) || {}\n","import { useCombinedState } from '@spark-ui/hooks/use-combined-state'\nimport { emulateTab } from 'emulate-tab'\nimport {\n Children,\n ElementType,\n FC,\n ForwardRefExoticComponent,\n HTMLAttributes,\n isValidElement,\n KeyboardEvent,\n MouseEvent,\n ReactElement,\n ReactNode,\n RefAttributes,\n} from 'react'\n\nimport { Slot } from '../slot'\n\ninterface ReturnedValue {\n Element:\n | ForwardRefExoticComponent<\n HTMLAttributes<HTMLElement> & {\n children?: ReactNode\n } & RefAttributes<HTMLElement>\n >\n | ElementType\n chipProps:\n | {\n type: 'button'\n 'aria-pressed'?: boolean\n 'data-state'?: 'on' | 'off'\n onClick: (event: MouseEvent<HTMLButtonElement>) => void\n onKeyDown?: (event: KeyboardEvent<HTMLButtonElement>) => void\n disabled?: boolean\n children: ReactNode\n }\n | {\n 'aria-disabled'?: boolean\n children: ReactNode\n onKeyDown?: (event: KeyboardEvent<HTMLButtonElement>) => void\n }\n compoundElements: {\n leadingIcon: ReactNode\n trailingIcon: ReactNode\n content: ReactNode\n clearButton: ReactNode\n }\n}\n\nconst getDisplayName = (element?: ReactElement) => {\n return element ? (element.type as FC).displayName : ''\n}\n\nconst findElement =\n (children: ReactNode) =>\n (...values: string[]) => {\n const validChildren = Children.toArray(children).filter(isValidElement)\n\n return validChildren.find(child => {\n const displayName = getDisplayName(child)\n\n return values.includes(displayName || '')\n })\n }\n\nexport const useChipElement = ({\n onClick,\n asChild,\n pressed,\n defaultPressed,\n disabled,\n value,\n defaultValue,\n children,\n onClear,\n}: {\n onClick?: (\n event: MouseEvent<HTMLButtonElement>,\n args: { pressed: boolean; value?: string | number | readonly string[] }\n ) => void\n onKeyDown?: (event: KeyboardEvent<HTMLButtonElement>) => void\n asChild?: boolean\n pressed?: boolean\n defaultPressed?: boolean\n value?: string | number | readonly string[]\n defaultValue?: string | number | readonly string[]\n disabled?: boolean\n children?: ReactNode\n onClear?: (event?: MouseEvent<HTMLButtonElement>) => void\n}): ReturnedValue => {\n const [isPressed, setIsPressed] = useCombinedState<boolean | undefined>(pressed, defaultPressed)\n const [innerValue] = useCombinedState<string | number | readonly string[] | undefined>(\n value,\n defaultValue\n )\n\n const findChipElement = findElement(children)\n\n const leadingIcon = findChipElement('Chip.LeadingIcon')\n const trailingIcon = findChipElement('Chip.TrailingIcon')\n const content = findChipElement('Chip.Content')\n const clearButton = findChipElement('Chip.ClearButton')\n\n const isButton = (onClick || isPressed) !== undefined\n\n const formattedChildren = [leadingIcon, content, clearButton].every(\n element => element === undefined\n ) ? (\n <span className=\"inline-block grow truncate\">{children}</span>\n ) : (\n <>\n {leadingIcon}\n {content}\n {clearButton === undefined ? trailingIcon : null}\n {clearButton}\n </>\n )\n\n const onKeyDown = (event: KeyboardEvent<HTMLButtonElement>): void => {\n if (!!clearButton && !disabled && ['Delete', 'Backspace'].includes(event.key)) {\n if (onClear) {\n onClear()\n event.key === 'Delete' && emulateTab()\n event.key === 'Backspace' && emulateTab.backwards()\n }\n }\n }\n\n if (isButton) {\n return {\n Element: asChild ? Slot : 'button',\n chipProps: {\n type: 'button',\n ...(isPressed !== undefined && {\n 'aria-pressed': isPressed,\n 'data-state': isPressed ? 'on' : 'off',\n }),\n onClick: (event: MouseEvent<HTMLButtonElement>): void => {\n isPressed !== undefined && setIsPressed(!isPressed)\n onClick && onClick(event, { pressed: isPressed as boolean, value: innerValue })\n },\n onKeyDown,\n disabled,\n children: formattedChildren,\n },\n compoundElements: {\n leadingIcon,\n trailingIcon,\n content,\n clearButton,\n },\n }\n }\n\n return {\n Element: asChild ? Slot : 'div',\n chipProps: {\n 'aria-disabled': disabled,\n children: formattedChildren,\n onKeyDown,\n },\n compoundElements: {\n leadingIcon,\n trailingIcon,\n content,\n clearButton,\n },\n }\n}\n","import { ComponentPropsWithoutRef, MouseEvent, Ref } from 'react'\n\nimport { chipStyles, type ChipStylesProps } from './Chip.styles'\nimport { ChipContext } from './useChipContext'\nimport { useChipElement } from './useChipElement'\n\ntype ChipPrimitiveProps = Omit<ComponentPropsWithoutRef<'button'>, 'onClick' | 'disabled' | 'type'>\n\nexport interface ChipProps extends ChipPrimitiveProps, Omit<ChipStylesProps, 'hasClearButton'> {\n /**\n * Configures a toggleButton aria-pressed initial value\n */\n defaultPressed?: boolean\n /**\n * Configures a toggleButton aria-pressed value\n */\n pressed?: boolean\n /**\n * Change the component to the HTML tag or custom component of the only child.\n */\n asChild?: boolean\n /**\n * Event handler fired each clicking event\n */\n onClick?: (\n event: MouseEvent<HTMLButtonElement>,\n args: { pressed: boolean; value?: number | string | readonly string[] }\n ) => void\n /**\n * Clear chip handler\n */\n onClear?: (event?: MouseEvent<HTMLButtonElement>) => void\n ref?: Ref<HTMLButtonElement | HTMLDivElement>\n}\n\nexport const Chip = ({\n design = 'outlined',\n disabled,\n children,\n intent = 'support',\n defaultPressed,\n pressed,\n asChild,\n className,\n onClick,\n onClear,\n ref: forwardedRef,\n ...otherProps\n}: ChipProps) => {\n const {\n Element: ChipElement,\n chipProps: { children: formattedChildren, ...chipProps },\n compoundElements,\n } = useChipElement({\n asChild,\n pressed,\n defaultPressed,\n onClick,\n disabled: !!disabled,\n value: otherProps.value,\n defaultValue: otherProps.defaultValue,\n children,\n onClear,\n })\n\n const { clearButton } = compoundElements\n\n return (\n <ChipContext value={{ disabled, design, intent, onClear }}>\n <ChipElement\n ref={forwardedRef}\n className={chipStyles({\n className,\n design,\n disabled,\n intent,\n hasClearButton: !!clearButton,\n })}\n {...{\n ...chipProps,\n ...otherProps,\n }}\n data-spark-component=\"chip\"\n >\n {formattedChildren}\n </ChipElement>\n </ChipContext>\n )\n}\n\nChip.displayName = 'Chip'\n","import { tw } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nexport const chipClearButtonWrapperStyles = cva(\n ['ml-md flex h-full items-center justify-center focus-visible:outline-hidden'],\n {\n variants: {\n disabled: {\n false: ['cursor-pointer'],\n true: ['cursor-not-allowed'],\n },\n isBordered: {\n false: ['pr-md'],\n true: ['pr-[7px]'],\n },\n design: {\n outlined: [],\n tinted: [],\n dashed: [],\n },\n },\n compoundVariants: [\n {\n design: 'outlined',\n disabled: false,\n class: tw(['hover:opacity-dim-1']),\n },\n {\n design: 'outlined',\n disabled: true,\n class: tw(['opacity-dim-3']),\n },\n {\n design: 'tinted',\n disabled: false,\n class: tw(['hover:opacity-dim-1']),\n },\n {\n design: 'tinted',\n disabled: true,\n class: tw(['opacity-dim-3']),\n },\n {\n design: 'dashed',\n disabled: false,\n class: tw(['hover:opacity-dim-1']),\n },\n {\n design: 'dashed',\n disabled: true,\n class: tw(['opacity-dim-3']),\n },\n ],\n }\n)\n\nexport const chipClearButtonStyles = cva(\n ['rounded-full p-sz-2 [font-size:var(--spacing-sz-8)] border-sm', 'focus-visible:u-outline'],\n {\n variants: {\n disabled: {\n true: ['cursor-not-allowed'],\n false: ['cursor-pointer'],\n },\n },\n defaultVariants: {\n disabled: false,\n },\n }\n)\n\nexport type ChipClearButtonStylesProps = VariantProps<typeof chipClearButtonWrapperStyles>\n","import { Close } from '@spark-ui/icons/Close'\nimport {\n cloneElement,\n ComponentPropsWithoutRef,\n MouseEvent,\n ReactElement,\n Ref,\n useCallback,\n} from 'react'\n\nimport { Icon } from '../icon'\nimport {\n chipClearButtonStyles,\n type ChipClearButtonStylesProps,\n chipClearButtonWrapperStyles,\n} from './ChipClearButton.styles'\nimport { useChipContext } from './useChipContext'\n\nexport interface ChipClearButtonProps\n extends ComponentPropsWithoutRef<'span'>, ChipClearButtonStylesProps {\n label: string\n ref?: Ref<HTMLSpanElement>\n}\n\n/**\n * A button to remove or clear the chip. Renders a <button> element wrapped in a <span>.\n */\nexport const ChipClearButton = ({\n children = (\n <Icon>\n <Close />\n </Icon>\n ),\n tabIndex = 0,\n label,\n ref: forwardedRef,\n}: ChipClearButtonProps) => {\n const { design, disabled, onClear } = useChipContext()\n\n const onClearHandler = useCallback(\n (event: MouseEvent<HTMLButtonElement>) => {\n event.stopPropagation()\n !disabled && onClear && onClear(event)\n },\n [disabled, onClear]\n )\n\n return (\n <span\n className={chipClearButtonWrapperStyles({\n isBordered: ['outline', 'dashed'].includes(`${design}`),\n disabled: !!disabled,\n design,\n })}\n onClick={onClearHandler}\n ref={forwardedRef}\n >\n <button\n tabIndex={tabIndex}\n type=\"button\"\n disabled={!!disabled}\n className={chipClearButtonStyles({ disabled })}\n aria-label={label}\n >\n {children && cloneElement(children as ReactElement<HTMLElement>, { ariaLabel: label })}\n </button>\n </span>\n )\n}\n\nChipClearButton.displayName = 'Chip.ClearButton'\n","import { cx } from 'class-variance-authority'\nimport { ComponentPropsWithoutRef, Ref } from 'react'\n\nexport type ChipContentProps = ComponentPropsWithoutRef<'span'> & {\n ref?: Ref<HTMLSpanElement>\n}\n\n/**\n * The main text content of the chip. Renders a <span> element.\n */\nexport const ChipContent = ({ children, className, ref: forwardedRef }: ChipContentProps) => {\n return (\n <span className={cx('inline-block grow truncate', className)} ref={forwardedRef}>\n {children}\n </span>\n )\n}\n\nChipContent.displayName = 'Chip.Content'\n","import { cx } from 'class-variance-authority'\nimport { ComponentPropsWithoutRef, Ref } from 'react'\n\nexport type ChipIconProps = ComponentPropsWithoutRef<'span'> & {\n ref?: Ref<HTMLSpanElement>\n}\n\nexport const ChipIcon = ({ children, className, ref: forwardedRef }: ChipIconProps) => {\n return (\n <span className={cx('flex h-full items-center justify-center', className)} ref={forwardedRef}>\n {children}\n </span>\n )\n}\n\nChipIcon.displayName = 'Chip.Icon'\n","import { cx } from 'class-variance-authority'\nimport { Ref } from 'react'\n\nimport { ChipIcon, type ChipIconProps } from './ChipIcon'\n\nexport type ChipLeadingIconProps = ChipIconProps & {\n ref?: Ref<HTMLSpanElement>\n}\n\n/**\n * An icon displayed at the start of the chip. Renders a <span> element.\n */\nexport const ChipLeadingIcon = ({\n className,\n ref: forwardedRef,\n ...props\n}: ChipLeadingIconProps) => (\n <ChipIcon className={cx('mr-sm', className)} ref={forwardedRef} {...props} />\n)\n\nChipLeadingIcon.displayName = 'Chip.LeadingIcon'\n","import { cx } from 'class-variance-authority'\nimport { Ref } from 'react'\n\nimport { ChipIcon, type ChipIconProps } from './ChipIcon'\n\nexport type ChipTrailingIconProps = ChipIconProps & {\n ref?: Ref<HTMLSpanElement>\n}\n\n/**\n * An icon displayed at the end of the chip. Renders a <span> element.\n */\nexport const ChipTrailingIcon = ({\n className,\n ref: forwardedRef,\n ...props\n}: ChipTrailingIconProps) => (\n <ChipIcon className={cx('ml-md', className)} ref={forwardedRef} {...props} />\n)\n\nChipTrailingIcon.displayName = 'Chip.TrailingIcon'\n","import { Chip as Root } from './Chip'\nimport { ChipClearButton } from './ChipClearButton'\nimport { ChipContent } from './ChipContent'\nimport { ChipLeadingIcon } from './ChipLeadingIcon'\nimport { ChipTrailingIcon } from './ChipTrailingIcon'\n\n/**\n * A compact, interactive element used for input, filtering, or representing attributes.\n */\nexport const Chip: typeof Root & {\n Content: typeof ChipContent\n LeadingIcon: typeof ChipLeadingIcon\n TrailingIcon: typeof ChipTrailingIcon\n ClearButton: typeof ChipClearButton\n} = Object.assign(Root, {\n Content: ChipContent,\n LeadingIcon: ChipLeadingIcon,\n TrailingIcon: ChipTrailingIcon,\n ClearButton: ChipClearButton,\n})\n\nChip.displayName = 'Chip'\nChip.ClearButton.displayName = 'Chip.ClearButton'\nChip.Content.displayName = 'Chip.Content'\nChip.LeadingIcon.displayName = 'Chip.LeadingIcon'\nChip.TrailingIcon.displayName = 'Chip.TrailingIcon'\n\nexport { type ChipClearButtonProps } from './ChipClearButton'\nexport { type ChipContentProps } from './ChipContent'\nexport { type ChipLeadingIconProps } from './ChipLeadingIcon'\nexport { type ChipTrailingIconProps } from './ChipTrailingIcon'\n"],"mappings":";;;;;;;;;;AAEA,IAAa,IAAmB;CAE9B;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CAED;EACE,QAAQ;EACR,gBAAgB;EAChB,OAAO,EAAG,CAAC,sDAAsD,CAAC;EACnE;CACD;EACE,QAAQ;EACR,gBAAgB;EAChB,OAAO,EAAG,CAAC,sDAAsD,CAAC;EACnE;CACF,ECjHY,IAAiB;CAE5B;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CAED;EACE,QAAQ;EACR,gBAAgB;EAChB,OAAO,EAAG,CAAC,QAAQ,CAAC;EACrB;CACD;EACE,QAAQ;EACR,gBAAgB;EAChB,OAAO,EAAG,CAAC,QAAQ,CAAC;EACrB;CACF,ECzHY,IAAiB;CAE5B;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;GACD,CAAC;EACH;CACD;EACE,QAAQ;EACR,QAAQ;EA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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@spark-ui/components",
3
- "version": "17.14.3",
3
+ "version": "17.14.4",
4
4
  "license": "MIT",
5
5
  "description": "Spark (Leboncoin design system) components.",
6
6
  "exports": {
@@ -48,9 +48,9 @@
48
48
  },
49
49
  "dependencies": {
50
50
  "@base-ui/react": "^1.5.0",
51
- "@spark-ui/hooks": "17.14.3",
52
- "@spark-ui/icons": "17.14.3",
53
- "@spark-ui/internal-utils": "17.14.3",
51
+ "@spark-ui/hooks": "17.14.4",
52
+ "@spark-ui/icons": "17.14.4",
53
+ "@spark-ui/internal-utils": "17.14.4",
54
54
  "@zag-js/pagination": "1.30.0",
55
55
  "@zag-js/react": "1.30.0",
56
56
  "class-variance-authority": "0.7.1",
@@ -62,7 +62,7 @@
62
62
  "react-snap-carousel": "0.5.1"
63
63
  },
64
64
  "peerDependencies": {
65
- "@spark-ui/theme-utils": "17.14.3",
65
+ "@spark-ui/theme-utils": "17.14.4",
66
66
  "react": "19.2.4",
67
67
  "react-dom": "19.2.4",
68
68
  "tailwindcss": "4.1.18"