@spark-ui/components 17.15.8 → 17.16.0

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 (57) hide show
  1. package/dist/avatar/index.js +1 -1
  2. package/dist/avatar/index.mjs +1 -1
  3. package/dist/button/Button.appearance-styles.d.ts +8 -0
  4. package/dist/button/Button.d.ts +16 -2
  5. package/dist/button/Button.styles.d.ts +1 -1
  6. package/dist/button/index.js +1 -1
  7. package/dist/button/index.mjs +1 -1
  8. package/dist/button-D0s-21qo.js +2 -0
  9. package/dist/button-D0s-21qo.js.map +1 -0
  10. package/dist/{button-DbwdRRfP.mjs → button-DwLTXeJX.mjs} +144 -44
  11. package/dist/button-DwLTXeJX.mjs.map +1 -0
  12. package/dist/carousel/index.js +1 -1
  13. package/dist/carousel/index.mjs +1 -1
  14. package/dist/combobox/index.js +1 -1
  15. package/dist/combobox/index.mjs +2 -2
  16. package/dist/dialog/index.js +1 -1
  17. package/dist/dialog/index.mjs +1 -1
  18. package/dist/drawer/index.js +1 -1
  19. package/dist/drawer/index.mjs +1 -1
  20. package/dist/dropdown/index.js +1 -1
  21. package/dist/dropdown/index.mjs +1 -1
  22. package/dist/file-upload/index.js +1 -1
  23. package/dist/file-upload/index.mjs +2 -2
  24. package/dist/icon-button/IconButton.d.ts +1 -1
  25. package/dist/icon-button/index.js +1 -1
  26. package/dist/icon-button/index.mjs +1 -1
  27. package/dist/{icon-button-DwFo4BqM.mjs → icon-button-C1ThqdK1.mjs} +13 -12
  28. package/dist/icon-button-C1ThqdK1.mjs.map +1 -0
  29. package/dist/icon-button-DRFf308H.js +2 -0
  30. package/dist/icon-button-DRFf308H.js.map +1 -0
  31. package/dist/pagination/index.js +1 -1
  32. package/dist/pagination/index.mjs +2 -2
  33. package/dist/popover/index.js +1 -1
  34. package/dist/popover/index.mjs +1 -1
  35. package/dist/{popover-CCJsQHFh.mjs → popover-CGhSHQzb.mjs} +2 -2
  36. package/dist/{popover-CCJsQHFh.mjs.map → popover-CGhSHQzb.mjs.map} +1 -1
  37. package/dist/{popover-DLE5r0tL.js → popover-DVz0JvON.js} +2 -2
  38. package/dist/{popover-DLE5r0tL.js.map → popover-DVz0JvON.js.map} +1 -1
  39. package/dist/scrolling-list/index.js +1 -1
  40. package/dist/scrolling-list/index.mjs +2 -2
  41. package/dist/stepper/index.js +1 -1
  42. package/dist/stepper/index.mjs +1 -1
  43. package/dist/table/index.js +1 -1
  44. package/dist/table/index.js.map +1 -1
  45. package/dist/table/index.mjs +14 -14
  46. package/dist/table/index.mjs.map +1 -1
  47. package/dist/tabs/index.js +1 -1
  48. package/dist/tabs/index.mjs +3 -3
  49. package/dist/toast/index.js +1 -1
  50. package/dist/toast/index.mjs +2 -2
  51. package/package.json +5 -5
  52. package/dist/button-DbwdRRfP.mjs.map +0 -1
  53. package/dist/button-jPMfDNvm.js +0 -2
  54. package/dist/button-jPMfDNvm.js.map +0 -1
  55. package/dist/icon-button-DWaNkUqV.js +0 -2
  56. package/dist/icon-button-DWaNkUqV.js.map +0 -1
  57. package/dist/icon-button-DwFo4BqM.mjs.map +0 -1
@@ -1,2 +1,2 @@
1
- Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../rolldown-runtime-CMqjfN_6.js"),t=require("../slot/index.js"),n=require("../icon-DY4l9nsc.js"),r=require("../button-jPMfDNvm.js"),i=require("../icon-button-DWaNkUqV.js");let a=require("class-variance-authority"),o=require("react");o=e.t(o);let s=require("react/jsx-runtime"),c=require("@spark-ui/icons/Close"),l=require("@base-ui/react/toast"),u=require("@spark-ui/icons/AlertFill"),d=require("@spark-ui/icons/InfoFill"),f=require("@spark-ui/icons/ValidFill"),p=require("@spark-ui/icons/WarningFill");var m=(0,a.cva)([`gap-lg p-md flex w-max !w-[min(400px,calc(100vw-2rem))] flex-col rounded-lg border-md`,`absolute right-0 bottom-0 left-auto mr-0`,`bg-clip-padding shadow-md select-none`,`focus-visible:ring-focus focus-visible:ring-2 focus-visible:outline-none`,`z-[calc(1000-var(--toast-index))]`,`after:absolute after:bottom-full after:left-0 after:h-[calc(var(--gap)+1px)] after:w-full after:content-['']`,`[transform:translateX(var(--toast-swipe-movement-x))_translateY(calc(var(--toast-swipe-movement-y)+calc(min(var(--toast-index),10)*-16px)))_scale(calc(max(0,1-(var(--toast-index)*0.1))))]`,`ease-standard [transition-property:opacity,transform]`,`duration-400`,`data-[starting-style]:[transform:translateY(150%)]`,`data-[expanded]:[transform:translateX(var(--toast-swipe-movement-x))_translateY(calc(var(--toast-offset-y)*-1+calc(var(--toast-index)*var(--gap)*-1)+var(--toast-swipe-movement-y)))]`,`data-[ending-style]:duration-250`,`data-[ending-style]:opacity-0`,`data-[ending-style]:data-[swipe-direction=down]:[transform:translateY(calc(var(--toast-swipe-movement-y)+150%))]`,`data-[ending-style]:data-[swipe-direction=right]:[transform:translateX(calc(var(--toast-swipe-movement-x)+150%))_translateY(var(--offset-y))]`,`data-[expanded]:data-[ending-style]:data-[swipe-direction=right]:[transform:translateX(calc(var(--toast-swipe-movement-x)+150%))_translateY(var(--offset-y))]`,`data-[limited]:opacity-0`],{variants:{design:{filled:``,tinted:``},intent:{success:``,alert:``,error:``,info:``,neutral:``,main:``,support:``,accent:``,surface:``,surfaceInverse:``}},compoundVariants:[{design:`filled`,intent:`success`,class:[`bg-success text-on-success border-success`]},{design:`filled`,intent:`alert`,class:[`bg-alert text-on-alert border-alert`]},{design:`filled`,intent:`error`,class:[`bg-error text-on-error border-error`]},{design:`filled`,intent:`info`,class:[`bg-info text-on-info border-info`]},{design:`filled`,intent:`neutral`,class:[`bg-neutral text-on-neutral border-neutral`]},{design:`filled`,intent:`main`,class:[`bg-main text-on-main border-main`]},{design:`filled`,intent:`support`,class:[`bg-support text-on-support border-support`]},{design:`filled`,intent:`accent`,class:[`bg-accent text-on-accent border-accent`]},{design:`filled`,intent:`surface`,class:[`bg-surface text-on-surface border-surface`]},{design:`filled`,intent:`surfaceInverse`,class:[`bg-surface-inverse text-on-surface-inverse border-surface-inverse`]},{design:`tinted`,intent:`success`,class:[`bg-success-container text-on-success-container border-success`]},{design:`tinted`,intent:`alert`,class:[`bg-alert-container text-on-alert-container border-alert`]},{design:`tinted`,intent:`error`,class:[`bg-error-container text-on-error-container border-error`]},{design:`tinted`,intent:`info`,class:[`bg-info-container text-on-info-container border-info`]},{design:`tinted`,intent:`neutral`,class:[`bg-neutral-container text-on-neutral-container border-neutral`]},{design:`tinted`,intent:`main`,class:[`bg-main-container text-on-main-container border-main`]},{design:`tinted`,intent:`support`,class:[`bg-support-container text-on-support-container border-support`]},{design:`tinted`,intent:`accent`,class:[`bg-accent-container text-on-accent-container border-accent`]},{design:`tinted`,intent:`surface`,class:[`bg-surface text-on-surface border-surface`]},{design:`tinted`,intent:`surfaceInverse`,class:[`bg-surface-inverse text-on-surface-inverse border-surface-inverse`]}],defaultVariants:{design:`filled`,intent:`neutral`}});function h(e){return e===`surfaceInverse`?`surface`:e===`surface`?`surfaceInverse`:e===`error`?`danger`:e}function g(e){return e===`surfaceInverse`?`surfaceInverse`:e===`surface`?`surface`:e===`error`?`danger`:e}var _=(e,{toastDesign:t,toastIntent:n})=>{if(!e)return{};let{design:r,intent:i,className:o,onClick:s,...c}=e;return{design:r??t,intent:i??h(n),className:(0,a.cx)(`ml-auto`,o),onClick:s,...c}},v=(e,t,n)=>({swipeDirection:[`down`,`right`],toast:e,className:(0,a.cx)(m({design:t,intent:n})),style:{"--gap":`var(--spacing-md)`,"--offset-y":`calc(var(--toast-offset-y) * -1 + (var(--toast-index) * var(--gap) * -1) + var(--toast-swipe-movement-y))`}});function y(e){switch(e){case`info`:return(0,s.jsx)(d.InfoFill,{});case`success`:return(0,s.jsx)(f.ValidFill,{});case`alert`:return(0,s.jsx)(p.WarningFill,{});case`error`:return(0,s.jsx)(u.AlertFill,{});default:return(0,s.jsx)(d.InfoFill,{})}}function b({toast:e}){let{icon:t,intent:o=`info`,design:u,action:d,isClosable:f,closeLabel:p=`Close`,compact:m=!1}=e.data??{},h=`tinted`,b=d?.close?l.Toast.Close:l.Toast.Action,x=_(d,{toastDesign:h,toastIntent:o}),S=v(e,h,o),C=t??y(o),w=e=>f?(0,s.jsx)(l.Toast.Close,{className:e,render:(0,s.jsx)(i.t,{"aria-label":p,design:h,intent:g(o),size:`md`}),children:(0,s.jsx)(n.t,{children:(0,s.jsx)(c.Close,{})})}):null,T=()=>{let t=e.data?.title??e.title,n=!!(e.data?.description??e.description);return typeof t!=`string`&&t!==void 0?(0,s.jsx)(l.Toast.Title,{className:n?`text-headline-2`:`text-body-1`,render:(0,s.jsx)(`div`,{}),children:t}):(0,s.jsx)(l.Toast.Title,{className:n?`text-headline-2`:`text-body-1`})},E=()=>{let t=e.data?.description??e.description;return t?typeof t==`string`?(0,s.jsx)(l.Toast.Description,{className:`text-body-1`}):(0,s.jsx)(l.Toast.Description,{className:`text-body-1`,render:(0,s.jsx)(`div`,{}),children:t}):null};return(0,s.jsx)(l.Toast.Root,{...S,children:(0,s.jsxs)(`div`,{className:(0,a.cx)(`flex`,m?`gap-lg items-center`:`gap-md flex-col`),children:[(0,s.jsxs)(`div`,{className:`gap-lg p-md flex grow items-center`,children:[(0,s.jsx)(n.t,{size:`md`,children:C}),(0,s.jsxs)(`div`,{className:(0,a.cx)(`gap-sm flex flex-col`,m&&`flex-1`,!m&&f&&`pr-3xl`),children:[T(),E()]})]}),(0,s.jsxs)(`div`,{className:(0,a.cx)(`flex`),children:[d&&(0,s.jsx)(b,{render:(0,s.jsx)(r.t,{...x}),children:d.label}),m&&w()]}),!m&&w(`top-md right-md absolute`)]})},e.id)}function x(){let e=l.Toast.useToastManager(),t=o.useRef(e);return t.current=e,o.useMemo(()=>({get toasts(){return t.current.toasts},add:e=>t.current.add(e),update:(e,n)=>t.current.update(e,n),close:e=>t.current.close(e),promise:(e,n)=>t.current.promise(e,n),closeAll:()=>t.current.toasts.forEach(({id:e})=>t.current.close(e))}),[])}function S(){let{toasts:e}=x();return e.map(e=>(0,s.jsx)(b,{toast:e},e.id))}function C({children:e,limit:t=3,...n}){return(0,s.jsxs)(l.Toast.Provider,{limit:t,...n,children:[(0,s.jsx)(l.Toast.Portal,{children:(0,s.jsx)(l.Toast.Viewport,{className:(0,a.cx)(`z-toast right-lg bottom-lg text-on-surfa- fixed top-auto mx-auto flex w-fit flex-col items-end`),children:(0,s.jsx)(S,{})})}),e]})}function w({children:e,onClick:n,asChild:r=!1,title:i,description:a,timeout:o=5e3,design:c=`filled`,intent:l=`neutral`,isClosable:u=!0,icon:d,action:f,compact:p,priority:m=`low`}){let h=x(),g=r?t.Slot:`button`;function _(e){n?.(e),h.add({title:i,description:a,timeout:o,priority:m,data:{design:c,intent:l,isClosable:u,...d&&{icon:d},action:f,...p!==void 0&&{compact:p}}})}return(0,s.jsx)(g,{...!r&&{type:`button`},onClick:_,children:e})}var T=l.Toast.createToastManager;exports.ToastProvider=C,exports.ToastTrigger=w,exports.createToastManager=T,exports.useToastManager=x;
1
+ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../rolldown-runtime-CMqjfN_6.js"),t=require("../slot/index.js"),n=require("../icon-DY4l9nsc.js"),r=require("../button-D0s-21qo.js"),i=require("../icon-button-DRFf308H.js");let a=require("class-variance-authority"),o=require("react");o=e.t(o);let s=require("react/jsx-runtime"),c=require("@spark-ui/icons/Close"),l=require("@base-ui/react/toast"),u=require("@spark-ui/icons/AlertFill"),d=require("@spark-ui/icons/InfoFill"),f=require("@spark-ui/icons/ValidFill"),p=require("@spark-ui/icons/WarningFill");var m=(0,a.cva)([`gap-lg p-md flex w-max !w-[min(400px,calc(100vw-2rem))] flex-col rounded-lg border-md`,`absolute right-0 bottom-0 left-auto mr-0`,`bg-clip-padding shadow-md select-none`,`focus-visible:ring-focus focus-visible:ring-2 focus-visible:outline-none`,`z-[calc(1000-var(--toast-index))]`,`after:absolute after:bottom-full after:left-0 after:h-[calc(var(--gap)+1px)] after:w-full after:content-['']`,`[transform:translateX(var(--toast-swipe-movement-x))_translateY(calc(var(--toast-swipe-movement-y)+calc(min(var(--toast-index),10)*-16px)))_scale(calc(max(0,1-(var(--toast-index)*0.1))))]`,`ease-standard [transition-property:opacity,transform]`,`duration-400`,`data-[starting-style]:[transform:translateY(150%)]`,`data-[expanded]:[transform:translateX(var(--toast-swipe-movement-x))_translateY(calc(var(--toast-offset-y)*-1+calc(var(--toast-index)*var(--gap)*-1)+var(--toast-swipe-movement-y)))]`,`data-[ending-style]:duration-250`,`data-[ending-style]:opacity-0`,`data-[ending-style]:data-[swipe-direction=down]:[transform:translateY(calc(var(--toast-swipe-movement-y)+150%))]`,`data-[ending-style]:data-[swipe-direction=right]:[transform:translateX(calc(var(--toast-swipe-movement-x)+150%))_translateY(var(--offset-y))]`,`data-[expanded]:data-[ending-style]:data-[swipe-direction=right]:[transform:translateX(calc(var(--toast-swipe-movement-x)+150%))_translateY(var(--offset-y))]`,`data-[limited]:opacity-0`],{variants:{design:{filled:``,tinted:``},intent:{success:``,alert:``,error:``,info:``,neutral:``,main:``,support:``,accent:``,surface:``,surfaceInverse:``}},compoundVariants:[{design:`filled`,intent:`success`,class:[`bg-success text-on-success border-success`]},{design:`filled`,intent:`alert`,class:[`bg-alert text-on-alert border-alert`]},{design:`filled`,intent:`error`,class:[`bg-error text-on-error border-error`]},{design:`filled`,intent:`info`,class:[`bg-info text-on-info border-info`]},{design:`filled`,intent:`neutral`,class:[`bg-neutral text-on-neutral border-neutral`]},{design:`filled`,intent:`main`,class:[`bg-main text-on-main border-main`]},{design:`filled`,intent:`support`,class:[`bg-support text-on-support border-support`]},{design:`filled`,intent:`accent`,class:[`bg-accent text-on-accent border-accent`]},{design:`filled`,intent:`surface`,class:[`bg-surface text-on-surface border-surface`]},{design:`filled`,intent:`surfaceInverse`,class:[`bg-surface-inverse text-on-surface-inverse border-surface-inverse`]},{design:`tinted`,intent:`success`,class:[`bg-success-container text-on-success-container border-success`]},{design:`tinted`,intent:`alert`,class:[`bg-alert-container text-on-alert-container border-alert`]},{design:`tinted`,intent:`error`,class:[`bg-error-container text-on-error-container border-error`]},{design:`tinted`,intent:`info`,class:[`bg-info-container text-on-info-container border-info`]},{design:`tinted`,intent:`neutral`,class:[`bg-neutral-container text-on-neutral-container border-neutral`]},{design:`tinted`,intent:`main`,class:[`bg-main-container text-on-main-container border-main`]},{design:`tinted`,intent:`support`,class:[`bg-support-container text-on-support-container border-support`]},{design:`tinted`,intent:`accent`,class:[`bg-accent-container text-on-accent-container border-accent`]},{design:`tinted`,intent:`surface`,class:[`bg-surface text-on-surface border-surface`]},{design:`tinted`,intent:`surfaceInverse`,class:[`bg-surface-inverse text-on-surface-inverse border-surface-inverse`]}],defaultVariants:{design:`filled`,intent:`neutral`}});function h(e){return e===`surfaceInverse`?`surface`:e===`surface`?`surfaceInverse`:e===`error`?`danger`:e}function g(e){return e===`surfaceInverse`?`surfaceInverse`:e===`surface`?`surface`:e===`error`?`danger`:e}var _=(e,{toastDesign:t,toastIntent:n})=>{if(!e)return{};let{design:r,intent:i,className:o,onClick:s,...c}=e;return{design:r??t,intent:i??h(n),className:(0,a.cx)(`ml-auto`,o),onClick:s,...c}},v=(e,t,n)=>({swipeDirection:[`down`,`right`],toast:e,className:(0,a.cx)(m({design:t,intent:n})),style:{"--gap":`var(--spacing-md)`,"--offset-y":`calc(var(--toast-offset-y) * -1 + (var(--toast-index) * var(--gap) * -1) + var(--toast-swipe-movement-y))`}});function y(e){switch(e){case`info`:return(0,s.jsx)(d.InfoFill,{});case`success`:return(0,s.jsx)(f.ValidFill,{});case`alert`:return(0,s.jsx)(p.WarningFill,{});case`error`:return(0,s.jsx)(u.AlertFill,{});default:return(0,s.jsx)(d.InfoFill,{})}}function b({toast:e}){let{icon:t,intent:o=`info`,design:u,action:d,isClosable:f,closeLabel:p=`Close`,compact:m=!1}=e.data??{},h=`tinted`,b=d?.close?l.Toast.Close:l.Toast.Action,x=_(d,{toastDesign:h,toastIntent:o}),S=v(e,h,o),C=t??y(o),w=e=>f?(0,s.jsx)(l.Toast.Close,{className:e,render:(0,s.jsx)(i.t,{"aria-label":p,design:h,intent:g(o),size:`md`}),children:(0,s.jsx)(n.t,{children:(0,s.jsx)(c.Close,{})})}):null,T=()=>{let t=e.data?.title??e.title,n=!!(e.data?.description??e.description);return typeof t!=`string`&&t!==void 0?(0,s.jsx)(l.Toast.Title,{className:n?`text-headline-2`:`text-body-1`,render:(0,s.jsx)(`div`,{}),children:t}):(0,s.jsx)(l.Toast.Title,{className:n?`text-headline-2`:`text-body-1`})},E=()=>{let t=e.data?.description??e.description;return t?typeof t==`string`?(0,s.jsx)(l.Toast.Description,{className:`text-body-1`}):(0,s.jsx)(l.Toast.Description,{className:`text-body-1`,render:(0,s.jsx)(`div`,{}),children:t}):null};return(0,s.jsx)(l.Toast.Root,{...S,children:(0,s.jsxs)(`div`,{className:(0,a.cx)(`flex`,m?`gap-lg items-center`:`gap-md flex-col`),children:[(0,s.jsxs)(`div`,{className:`gap-lg p-md flex grow items-center`,children:[(0,s.jsx)(n.t,{size:`md`,children:C}),(0,s.jsxs)(`div`,{className:(0,a.cx)(`gap-sm flex flex-col`,m&&`flex-1`,!m&&f&&`pr-3xl`),children:[T(),E()]})]}),(0,s.jsxs)(`div`,{className:(0,a.cx)(`flex`),children:[d&&(0,s.jsx)(b,{render:(0,s.jsx)(r.t,{...x}),children:d.label}),m&&w()]}),!m&&w(`top-md right-md absolute`)]})},e.id)}function x(){let e=l.Toast.useToastManager(),t=o.useRef(e);return t.current=e,o.useMemo(()=>({get toasts(){return t.current.toasts},add:e=>t.current.add(e),update:(e,n)=>t.current.update(e,n),close:e=>t.current.close(e),promise:(e,n)=>t.current.promise(e,n),closeAll:()=>t.current.toasts.forEach(({id:e})=>t.current.close(e))}),[])}function S(){let{toasts:e}=x();return e.map(e=>(0,s.jsx)(b,{toast:e},e.id))}function C({children:e,limit:t=3,...n}){return(0,s.jsxs)(l.Toast.Provider,{limit:t,...n,children:[(0,s.jsx)(l.Toast.Portal,{children:(0,s.jsx)(l.Toast.Viewport,{className:(0,a.cx)(`z-toast right-lg bottom-lg text-on-surfa- fixed top-auto mx-auto flex w-fit flex-col items-end`),children:(0,s.jsx)(S,{})})}),e]})}function w({children:e,onClick:n,asChild:r=!1,title:i,description:a,timeout:o=5e3,design:c=`filled`,intent:l=`neutral`,isClosable:u=!0,icon:d,action:f,compact:p,priority:m=`low`}){let h=x(),g=r?t.Slot:`button`;function _(e){n?.(e),h.add({title:i,description:a,timeout:o,priority:m,data:{design:c,intent:l,isClosable:u,...d&&{icon:d},action:f,...p!==void 0&&{compact:p}}})}return(0,s.jsx)(g,{...!r&&{type:`button`},onClick:_,children:e})}var T=l.Toast.createToastManager;exports.ToastProvider=C,exports.ToastTrigger=w,exports.createToastManager=T,exports.useToastManager=x;
2
2
  //# sourceMappingURL=index.js.map
@@ -1,7 +1,7 @@
1
1
  import { Slot as e } from "../slot/index.mjs";
2
2
  import { t } from "../icon-Bs-39J-H.mjs";
3
- import { t as n } from "../button-DbwdRRfP.mjs";
4
- import { t as r } from "../icon-button-DwFo4BqM.mjs";
3
+ import { t as n } from "../button-DwLTXeJX.mjs";
4
+ import { t as r } from "../icon-button-C1ThqdK1.mjs";
5
5
  import { cva as i, cx as a } from "class-variance-authority";
6
6
  import * as o from "react";
7
7
  import { jsx as s, jsxs as c } from "react/jsx-runtime";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@spark-ui/components",
3
- "version": "17.15.8",
3
+ "version": "17.16.0",
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.15.8",
52
- "@spark-ui/icons": "17.15.8",
53
- "@spark-ui/internal-utils": "17.15.8",
51
+ "@spark-ui/hooks": "17.16.0",
52
+ "@spark-ui/icons": "17.16.0",
53
+ "@spark-ui/internal-utils": "17.16.0",
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.15.8",
65
+ "@spark-ui/theme-utils": "17.16.0",
66
66
  "react": "19.2.4",
67
67
  "react-dom": "19.2.4",
68
68
  "tailwindcss": "4.1.18"
@@ -1 +0,0 @@
1
- {"version":3,"file":"button-DbwdRRfP.mjs","names":[],"sources":["../src/button/variants/filled.ts","../src/button/variants/ghost.ts","../src/button/variants/outlined.ts","../src/button/variants/tinted.ts","../src/button/variants/contrast.ts","../src/button/Button.styles.tsx","../src/button/Button.tsx"],"sourcesContent":["import { tw } from '@spark-ui/internal-utils'\n\nexport const filledVariants = [\n // Main\n {\n intent: 'main',\n design: 'filled',\n class: tw([\n 'bg-main',\n 'text-on-main',\n 'hover:bg-main-hovered',\n 'enabled:active:bg-main-hovered',\n 'focus-visible:bg-main-hovered',\n ]),\n },\n // Support\n {\n intent: 'support',\n design: 'filled',\n class: tw([\n 'bg-support',\n 'text-on-support',\n 'hover:bg-support-hovered',\n 'enabled:active:bg-support-hovered',\n 'focus-visible:bg-support-hovered',\n ]),\n },\n // Accent\n {\n intent: 'accent',\n design: 'filled',\n class: tw([\n 'bg-accent',\n 'text-on-accent',\n 'hover:bg-accent-hovered',\n 'enabled:active:bg-accent-hovered',\n 'focus-visible:bg-accent-hovered',\n ]),\n },\n // AI\n {\n intent: 'ai',\n design: 'filled',\n class: tw([\n 'bg-ai',\n 'text-on-ai',\n 'hover:bg-ai-hovered',\n 'enabled:active:bg-ai-hovered',\n 'focus-visible:bg-ai-hovered',\n ]),\n },\n // Success\n {\n intent: 'success',\n design: 'filled',\n class: tw([\n 'bg-success',\n 'text-on-success',\n 'hover:bg-success-hovered',\n 'enabled:active:bg-success-hovered',\n 'focus-visible:bg-success-hovered',\n ]),\n },\n // Alert\n {\n intent: 'alert',\n design: 'filled',\n class: tw([\n 'bg-alert',\n 'text-on-alert',\n 'hover:bg-alert-hovered',\n 'enabled:active:bg-alert-hovered',\n 'focus-visible:bg-alert-hovered',\n ]),\n },\n // Danger\n {\n intent: 'danger',\n design: 'filled',\n class: tw([\n 'text-on-error bg-error',\n 'hover:bg-error-hovered enabled:active:bg-error-hovered',\n 'focus-visible:bg-error-hovered',\n ]),\n },\n // Info\n {\n intent: 'info',\n design: 'filled',\n class: tw([\n 'text-on-error bg-info',\n 'hover:bg-info-hovered enabled:active:bg-info-hovered',\n 'focus-visible:bg-info-hovered',\n ]),\n },\n // Neutral\n {\n intent: 'neutral',\n design: 'filled',\n class: tw([\n 'bg-neutral',\n 'text-on-neutral',\n 'hover:bg-neutral-hovered',\n 'enabled:active:bg-neutral-hovered',\n 'focus-visible:bg-neutral-hovered',\n ]),\n },\n // Surface\n {\n intent: 'surface',\n design: 'filled',\n class: tw([\n 'bg-surface',\n 'text-on-surface',\n 'hover:bg-surface-hovered',\n 'enabled:active:bg-surface-hovered',\n 'focus-visible:bg-surface-hovered',\n ]),\n },\n {\n intent: 'surfaceInverse',\n design: 'filled',\n class: tw([\n 'bg-surface-inverse',\n 'text-on-surface-inverse',\n 'hover:bg-surface-inverse-hovered',\n 'enabled:active:bg-surface-inverse-hovered',\n 'focus-visible:bg-surface-inverse-hovered',\n ]),\n },\n] as const\n","import { tw } from '@spark-ui/internal-utils'\n\nexport const ghostVariants = [\n {\n intent: 'main',\n design: 'ghost',\n class: tw([\n 'text-on-main-container',\n 'hover:bg-main/dim-5',\n 'enabled:active:bg-main/dim-5',\n 'focus-visible:bg-main/dim-5',\n ]),\n },\n {\n intent: 'support',\n design: 'ghost',\n class: tw([\n 'text-on-support-container',\n 'hover:bg-support/dim-5',\n 'enabled:active:bg-support/dim-5',\n 'focus-visible:bg-support/dim-5',\n ]),\n },\n {\n intent: 'accent',\n design: 'ghost',\n class: tw([\n 'text-on-accent-container',\n 'hover:bg-accent/dim-5',\n 'enabled:active:bg-accent/dim-5',\n 'focus-visible:bg-accent/dim-5',\n ]),\n },\n {\n intent: 'ai',\n design: 'ghost',\n class: tw([\n 'text-on-ai-container',\n 'hover:bg-ai/dim-5',\n 'enabled:active:bg-ai/dim-5',\n 'focus-visible:bg-ai/dim-5',\n ]),\n },\n {\n intent: 'success',\n design: 'ghost',\n class: tw([\n 'text-on-success-container',\n 'hover:bg-success/dim-5',\n 'enabled:active:bg-success/dim-5',\n 'focus-visible:bg-success/dim-5',\n ]),\n },\n {\n intent: 'alert',\n design: 'ghost',\n class: tw([\n 'text-on-alert-container',\n 'hover:bg-alert/dim-5',\n 'enabled:active:bg-alert/dim-5',\n 'focus-visible:bg-alert/dim-5',\n ]),\n },\n {\n intent: 'danger',\n design: 'ghost',\n class: tw([\n 'text-on-error-container',\n 'hover:bg-error/dim-5',\n 'enabled:active:bg-error/dim-5',\n 'focus-visible:bg-error/dim-5',\n ]),\n },\n {\n intent: 'info',\n design: 'ghost',\n class: tw([\n 'text-on-info-container',\n 'hover:bg-info/dim-5',\n 'enabled:active:bg-info/dim-5',\n 'focus-visible:bg-info/dim-5',\n ]),\n },\n {\n intent: 'neutral',\n design: 'ghost',\n class: tw([\n 'text-on-neutral-container',\n 'hover:bg-neutral/dim-5',\n 'enabled:active:bg-neutral/dim-5',\n 'focus-visible:bg-neutral/dim-5',\n ]),\n },\n {\n intent: 'surface',\n design: 'ghost',\n class: tw([\n 'text-surface',\n 'hover:bg-surface/dim-5',\n 'enabled:active:bg-surface/dim-5',\n 'focus-visible:bg-surface/dim-5',\n ]),\n },\n {\n intent: 'surfaceInverse',\n design: 'ghost',\n class: tw([\n 'text-surface-inverse',\n 'hover:bg-surface-inverse/dim-5',\n 'enabled:active:bg-surface-inverse/dim-5',\n 'focus-visible:bg-surface-inverse/dim-5',\n ]),\n },\n] as const\n","import { tw } from '@spark-ui/internal-utils'\n\nexport const outlinedVariants = [\n {\n intent: 'main',\n design: 'outlined',\n class: tw([\n 'hover:bg-main/dim-5',\n 'enabled:active:bg-main/dim-5',\n 'focus-visible:bg-main/dim-5',\n 'text-main',\n ]),\n },\n {\n intent: 'support',\n design: 'outlined',\n class: tw([\n 'hover:bg-support/dim-5',\n 'enabled:active:bg-support/dim-5',\n 'focus-visible:bg-support/dim-5',\n 'text-support',\n ]),\n },\n {\n intent: 'accent',\n design: 'outlined',\n class: tw([\n 'hover:bg-accent/dim-5',\n 'enabled:active:bg-accent/dim-5',\n 'focus-visible:bg-accent/dim-5',\n 'text-accent',\n ]),\n },\n {\n intent: 'ai',\n design: 'outlined',\n class: tw([\n 'hover:bg-ai/dim-5',\n 'enabled:active:bg-ai/dim-5',\n 'focus-visible:bg-ai/dim-5',\n 'text-ai',\n ]),\n },\n {\n intent: 'success',\n design: 'outlined',\n class: tw([\n 'hover:bg-success/dim-5',\n 'enabled:active:bg-success/dim-5',\n 'focus-visible:bg-success/dim-5',\n 'text-success',\n ]),\n },\n {\n intent: 'alert',\n design: 'outlined',\n class: tw([\n 'hover:bg-alert/dim-5',\n 'enabled:active:bg-alert/dim-5',\n 'focus-visible:bg-alert/dim-5',\n 'text-alert',\n ]),\n },\n {\n intent: 'danger',\n design: 'outlined',\n class: tw([\n 'hover:bg-error/dim-5',\n 'enabled:active:bg-error/dim-5',\n 'focus-visible:bg-error/dim-5',\n 'text-error',\n ]),\n },\n {\n intent: 'info',\n design: 'outlined',\n class: tw([\n 'hover:bg-info/dim-5',\n 'enabled:active:bg-info/dim-5',\n 'focus-visible:bg-info/dim-5',\n 'text-info',\n ]),\n },\n {\n intent: 'neutral',\n design: 'outlined',\n class: tw([\n 'hover:bg-neutral/dim-5',\n 'enabled:active:bg-neutral/dim-5',\n 'focus-visible:bg-neutral/dim-5',\n 'text-neutral',\n ]),\n },\n {\n intent: 'surface',\n design: 'outlined',\n class: tw([\n 'hover:bg-surface/dim-5',\n 'enabled:active:bg-surface/dim-5',\n 'focus-visible:bg-surface/dim-5',\n 'text-surface',\n ]),\n },\n {\n intent: 'surfaceInverse',\n design: 'outlined',\n class: tw([\n 'hover:bg-surface-inverse/dim-5',\n 'enabled:active:bg-surface-inverse/dim-5',\n 'focus-visible:bg-surface-inverse/dim-5',\n 'text-surface-inverse',\n ]),\n },\n] as const\n","import { tw } from '@spark-ui/internal-utils'\n\nexport const tintedVariants = [\n {\n intent: 'main',\n design: 'tinted',\n class: tw([\n 'bg-main-container',\n 'text-on-main-container',\n 'hover:bg-main-container-hovered',\n 'enabled:active:bg-main-container-hovered',\n 'focus-visible:bg-main-container-hovered',\n ]),\n },\n {\n intent: 'support',\n design: 'tinted',\n class: tw([\n 'bg-support-container',\n 'text-on-support-container',\n 'hover:bg-support-container-hovered',\n 'enabled:active:bg-support-container-hovered',\n 'focus-visible:bg-support-container-hovered',\n ]),\n },\n {\n intent: 'accent',\n design: 'tinted',\n class: tw([\n 'bg-accent-container',\n 'text-on-accent-container',\n 'hover:bg-accent-container-hovered',\n 'enabled:active:bg-accent-container-hovered',\n 'focus-visible:bg-accent-container-hovered',\n ]),\n },\n {\n intent: 'ai',\n design: 'tinted',\n class: tw([\n 'bg-ai-container',\n 'text-on-ai-container',\n 'hover:bg-ai-container-hovered',\n 'enabled:active:bg-ai-container-hovered',\n 'focus-visible:bg-ai-container-hovered',\n ]),\n },\n {\n intent: 'success',\n design: 'tinted',\n class: tw([\n 'bg-success-container',\n 'text-on-success-container',\n 'hover:bg-success-container-hovered',\n 'enabled:active:bg-success-container-hovered',\n 'focus-visible:bg-success-container-hovered',\n ]),\n },\n {\n intent: 'alert',\n design: 'tinted',\n class: tw([\n 'bg-alert-container',\n 'text-on-alert-container',\n 'hover:bg-alert-container-hovered',\n 'enabled:active:bg-alert-container-hovered',\n 'focus-visible:bg-alert-container-hovered',\n ]),\n },\n {\n intent: 'danger',\n design: 'tinted',\n class: tw([\n 'bg-error-container',\n 'text-on-error-container',\n 'hover:bg-error-container-hovered',\n 'enabled:active:bg-error-container-hovered',\n 'focus-visible:bg-error-container-hovered',\n ]),\n },\n {\n intent: 'info',\n design: 'tinted',\n class: tw([\n 'bg-info-container',\n 'text-on-info-container',\n 'hover:bg-info-container-hovered',\n 'enabled:active:bg-info-container-hovered',\n 'focus-visible:bg-info-container-hovered',\n ]),\n },\n {\n intent: 'neutral',\n design: 'tinted',\n class: tw([\n 'bg-neutral-container',\n 'text-on-neutral-container',\n 'hover:bg-neutral-container-hovered',\n 'enabled:active:bg-neutral-container-hovered',\n 'focus-visible:bg-neutral-container-hovered',\n ]),\n },\n {\n intent: 'surface',\n design: 'tinted',\n class: tw([\n 'bg-surface',\n 'text-on-surface',\n 'hover:bg-surface-hovered',\n 'enabled:active:bg-surface-hovered',\n 'focus-visible:bg-surface-hovered',\n ]),\n },\n {\n intent: 'surfaceInverse',\n design: 'tinted',\n class: tw([\n 'bg-surface-inverse',\n 'text-on-surface-inverse',\n 'hover:bg-surface-inverse-hovered',\n 'enabled:active:bg-surface-inverse-hovered',\n 'focus-visible:bg-surface-inverse-hovered',\n ]),\n },\n] as const\n","import { tw } from '@spark-ui/internal-utils'\n\nexport const contrastVariants = [\n {\n intent: 'main',\n design: 'contrast',\n class: tw([\n 'text-on-main-contaier bg-surface',\n 'hover:bg-main-container-hovered',\n 'enabled:active:bg-main-container-hovered',\n 'focus-visible:bg-main-container-hovered',\n ]),\n },\n {\n intent: 'support',\n design: 'contrast',\n class: tw([\n 'text-on-support-container bg-surface',\n 'hover:bg-support-container-hovered',\n 'enabled:active:bg-support-container-hovered',\n 'focus-visible:bg-support-container-hovered',\n ]),\n },\n {\n intent: 'accent',\n design: 'contrast',\n class: tw([\n 'text-on-accent-container bg-surface',\n 'hover:bg-accent-container-hovered',\n 'enabled:active:bg-accent-container-hovered',\n 'focus-visible:bg-accent-container-hovered',\n ]),\n },\n {\n intent: 'ai',\n design: 'contrast',\n class: tw([\n 'text-on-ai-container bg-surface',\n 'hover:bg-ai-container-hovered',\n 'enabled:active:bg-ai-container-hovered',\n 'focus-visible:bg-ai-container-hovered',\n ]),\n },\n {\n intent: 'success',\n design: 'contrast',\n class: tw([\n 'text-on-success-container bg-surface',\n 'hover:bg-success-container-hovered',\n 'enabled:active:bg-success-container-hovered',\n 'focus-visible:bg-success-container-hovered',\n ]),\n },\n {\n intent: 'alert',\n design: 'contrast',\n class: tw([\n 'text-on-alert-container bg-surface',\n 'hover:bg-alert-container-hovered',\n 'enabled:active:bg-alert-container-hovered',\n 'focus-visible:bg-alert-container-hovered',\n ]),\n },\n {\n intent: 'danger',\n design: 'contrast',\n class: tw([\n 'text-on-error-container bg-surface',\n 'hover:bg-error-container-hovered',\n 'enabled:active:bg-error-container-hovered',\n 'focus-visible:bg-error-container-hovered',\n ]),\n },\n {\n intent: 'info',\n design: 'contrast',\n class: tw([\n 'text-on-info-container bg-surface',\n 'hover:bg-info-container-hovered',\n 'enabled:active:bg-info-container-hovered',\n 'focus-visible:bg-info-container-hovered',\n ]),\n },\n {\n intent: 'neutral',\n design: 'contrast',\n class: tw([\n 'text-on-neutral-container bg-surface',\n 'hover:bg-neutral-container-hovered',\n 'enabled:active:bg-neutral-container-hovered',\n 'focus-visible:bg-neutral-container-hovered',\n ]),\n },\n {\n intent: 'surface',\n design: 'contrast',\n class: tw([\n 'text-on-surface bg-surface',\n 'hover:bg-surface-hovered',\n 'enabled:active:bg-surface-hovered',\n 'focus-visible:bg-surface-hovered',\n ]),\n },\n {\n intent: 'surfaceInverse',\n design: 'contrast',\n class: tw([\n 'text-on-surface-inverse bg-surface-inverse',\n 'hover:bg-surface-inverse-hovered',\n 'enabled:active:bg-surface-inverse-hovered',\n 'focus-visible:bg-surface-inverse-hovered',\n ]),\n },\n] as const\n","import { makeVariants } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nimport {\n contrastVariants,\n filledVariants,\n ghostVariants,\n outlinedVariants,\n tintedVariants,\n} from './variants'\n\nexport const buttonStyles = cva(\n [\n 'u-shadow-border-transition',\n 'box-border inline-flex items-center justify-center gap-md whitespace-nowrap',\n 'default:px-lg',\n 'text-body-1-highlight',\n 'focus-visible:u-outline',\n ],\n {\n variants: {\n /**\n * Main style of the button.\n *\n * - `filled`: Button will be plain.\n *\n * - `outlined`: Button will be transparent with an outline.\n *\n * - `tinted`: Button will be filled but using a lighter color scheme.\n *\n * - `ghost`: Button will look like a link. No borders, plain text.\n *\n * - `contrast`: Button will be surface filled. No borders, plain text.\n *\n */\n design: makeVariants<'design', ['filled', 'outlined', 'tinted', 'ghost', 'contrast']>({\n filled: [],\n outlined: ['bg-transparent', 'border-sm', 'border-current'],\n tinted: [],\n ghost: ['default:-mx-md px-md hover:bg-main/dim-5'],\n contrast: [],\n }),\n underline: {\n true: ['underline'],\n },\n /**\n * Color scheme of the button.\n */\n intent: makeVariants<\n 'intent',\n [\n 'main',\n 'support',\n 'accent',\n 'ai',\n 'success',\n 'alert',\n 'danger',\n 'info',\n 'neutral',\n 'surface',\n 'surfaceInverse',\n ]\n >({\n main: [],\n support: [],\n accent: [],\n ai: [],\n success: [],\n alert: [],\n danger: [],\n info: [],\n neutral: [],\n surface: [],\n surfaceInverse: [],\n }),\n /**\n * Size of the button.\n */\n size: makeVariants<'size', ['sm', 'md', 'lg']>({\n sm: ['min-w-sz-32', 'h-sz-32'],\n md: ['min-w-sz-44', 'h-sz-44'],\n lg: ['min-w-sz-56', 'h-sz-56'],\n }),\n /**\n * Shape of the button.\n */\n shape: makeVariants<'shape', ['rounded', 'square', 'pill']>({\n rounded: ['rounded-button'],\n square: ['rounded-0'],\n pill: ['rounded-full'],\n }),\n /**\n * Disable the button, preventing user interaction and adding opacity.\n */\n disabled: {\n true: ['cursor-not-allowed', 'opacity-dim-3'],\n false: ['cursor-pointer'],\n },\n },\n compoundVariants: [\n ...filledVariants,\n ...outlinedVariants,\n ...tintedVariants,\n ...ghostVariants,\n ...contrastVariants,\n ],\n defaultVariants: {\n design: 'filled',\n intent: 'main',\n size: 'md',\n shape: 'rounded',\n },\n }\n)\n\nexport type ButtonStylesProps = VariantProps<typeof buttonStyles>\n","import { cx } from 'class-variance-authority'\nimport { ComponentPropsWithoutRef, type DOMAttributes, Ref, useMemo } from 'react'\n\nimport { Slot, wrapPolymorphicSlot } from '../slot'\nimport { Spinner, type SpinnerProps } from '../spinner'\nimport { buttonStyles, type ButtonStylesProps } from './Button.styles'\n\nexport interface ButtonProps\n extends Omit<ComponentPropsWithoutRef<'button'>, 'disabled'>, ButtonStylesProps {\n /**\n * Change the component to the HTML tag or custom component of the only child.\n */\n asChild?: boolean\n /**\n * Display a spinner to indicate to the user that the button is loading something after they interacted with it.\n */\n isLoading?: boolean\n /**\n * If your loading state should only display a spinner, it is better to specify a label for it (a11y).\n */\n loadingLabel?: string\n /**\n * If your loading state should also display a label, you can use this prop instead of `loadingLabel`.\n * **Please note that using this can result in layout shifting when the Button goes from loading state to normal state.**\n */\n loadingText?: string\n /**\n * When true, the button is non-interactive and has disabled styling but stays focusable (uses\n * `aria-disabled` instead of native `disabled`). Use for cases where the user should be able to\n * focus the control to discover why it is disabled (e.g. form submit, bulk bar actions).\n */\n ariaDisabled?: boolean\n ref?: Ref<HTMLButtonElement>\n}\n\ntype DOMAttributesEventHandler = keyof Omit<\n DOMAttributes<HTMLButtonElement>,\n 'children' | 'dangerouslySetInnerHTML'\n>\n\nconst blockedEventHandlers: DOMAttributesEventHandler[] = [\n 'onClick',\n 'onMouseDown',\n 'onMouseUp',\n 'onMouseEnter',\n 'onMouseLeave',\n 'onMouseOver',\n 'onMouseOut',\n 'onKeyDown',\n 'onKeyPress',\n 'onKeyUp',\n 'onSubmit',\n]\n\n/**\n * A clickable element that triggers an action or event when activated by the user.\n */\nexport const Button = ({\n children,\n design = 'filled',\n disabled = false,\n ariaDisabled = false,\n intent = 'main',\n isLoading = false,\n loadingLabel,\n loadingText,\n shape = 'pill',\n size = 'md',\n asChild,\n className,\n underline = false,\n ref,\n ...others\n}: ButtonProps) => {\n const Component = asChild ? Slot : 'button'\n\n const shouldNotInteract = !!disabled || !!ariaDisabled || isLoading\n const useNativeDisabled = !!disabled && !ariaDisabled\n\n const disabledEventHandlers = useMemo(() => {\n const result: Partial<Record<DOMAttributesEventHandler, (e: React.SyntheticEvent) => void>> = {}\n\n if (shouldNotInteract) {\n blockedEventHandlers.forEach(key => {\n result[key] = (e: React.SyntheticEvent) => {\n // Allow Tab to move focus away from the button\n if (e.type === 'keydown' && (e as React.KeyboardEvent).key === 'Tab') return\n /*\n Setting handlers to `undefined` (e.g. `result[eventHandler] = undefined`) only blocks JS-level handlers, it does not prevent native browser behavior.\n Calling preventDefault() here also blocks native form submission when type=\"submit\", since the browser triggers it from the click chain.\n */\n e.preventDefault()\n }\n })\n }\n\n return result\n }, [shouldNotInteract])\n\n const spinnerProps = {\n size: 'current' as SpinnerProps['size'],\n className: loadingText ? 'inline-block' : 'absolute',\n ...(loadingLabel && { 'aria-label': loadingLabel }),\n }\n\n return (\n <Component\n data-spark-component=\"button\"\n {...(Component === 'button' && { type: 'button' })}\n ref={ref}\n className={buttonStyles({\n className,\n design,\n disabled: shouldNotInteract,\n intent,\n shape,\n size,\n underline,\n })}\n disabled={useNativeDisabled}\n aria-disabled={shouldNotInteract ? true : undefined}\n aria-busy={isLoading}\n aria-live={isLoading ? 'assertive' : 'off'}\n {...others}\n {...disabledEventHandlers}\n >\n {wrapPolymorphicSlot(asChild, children, slotted =>\n isLoading ? (\n <>\n <Spinner {...spinnerProps} />\n {loadingText}\n\n <div\n aria-hidden\n className={cx('gap-md', loadingText ? 'hidden' : 'inline-flex opacity-0')}\n >\n {slotted}\n </div>\n </>\n ) : (\n slotted\n )\n )}\n </Component>\n )\n}\n\nButton.displayName = 'Button'\n"],"mappings":";;;;;;;AAEA,IAAa,IAAiB;CAE5B;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;EACF,CAAC;CACH;CAEA;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;EACF,CAAC;CACH;CAEA;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;EACF,CAAC;CACH;CAEA;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;EACF,CAAC;CACH;CAEA;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;EACF,CAAC;CACH;CAEA;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;EACF,CAAC;CACH;CAEA;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;EACF,CAAC;CACH;CAEA;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;EACF,CAAC;CACH;CAEA;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;EACF,CAAC;CACH;CAEA;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;EACF,CAAC;CACH;CACA;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;EACF,CAAC;CACH;AACF,GChIa,IAAgB;CAC3B;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;EACF,CAAC;CACH;CACA;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;EACF,CAAC;CACH;CACA;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;EACF,CAAC;CACH;CACA;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;EACF,CAAC;CACH;CACA;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;EACF,CAAC;CACH;CACA;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;EACF,CAAC;CACH;CACA;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;EACF,CAAC;CACH;CACA;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;EACF,CAAC;CACH;CACA;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;EACF,CAAC;CACH;CACA;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;EACF,CAAC;CACH;CACA;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;EACF,CAAC;CACH;AACF,GC/Ga,IAAmB;CAC9B;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;EACF,CAAC;CACH;CACA;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;EACF,CAAC;CACH;CACA;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;EACF,CAAC;CACH;CACA;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;EACF,CAAC;CACH;CACA;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;EACF,CAAC;CACH;CACA;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;EACF,CAAC;CACH;CACA;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;EACF,CAAC;CACH;CACA;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;EACF,CAAC;CACH;CACA;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;EACF,CAAC;CACH;CACA;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;EACF,CAAC;CACH;CACA;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;EACF,CAAC;CACH;AACF,GC/Ga,IAAiB;CAC5B;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;EACF,CAAC;CACH;CACA;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;EACF,CAAC;CACH;CACA;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;EACF,CAAC;CACH;CACA;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;EACF,CAAC;CACH;CACA;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;EACF,CAAC;CACH;CACA;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;EACF,CAAC;CACH;CACA;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;EACF,CAAC;CACH;CACA;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;EACF,CAAC;CACH;CACA;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;EACF,CAAC;CACH;CACA;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;EACF,CAAC;CACH;CACA;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;GACA;EACF,CAAC;CACH;AACF,GC1Ha,IAAmB;CAC9B;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG;GACR;GACA;GACA;GACA;EACF,CAAC;CACH;CACA;EACE,QAAQ;EACR,QAAQ;EACR,OAAO,EAAG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"}
@@ -1,2 +0,0 @@
1
- const e=require("./slot/index.js"),t=require("./spinner-CmPypfJR.js");let n=require("class-variance-authority"),r=require("react"),i=require("react/jsx-runtime"),a=require("@spark-ui/internal-utils");var o=[{intent:`main`,design:`filled`,class:(0,a.tw)([`bg-main`,`text-on-main`,`hover:bg-main-hovered`,`enabled:active:bg-main-hovered`,`focus-visible:bg-main-hovered`])},{intent:`support`,design:`filled`,class:(0,a.tw)([`bg-support`,`text-on-support`,`hover:bg-support-hovered`,`enabled:active:bg-support-hovered`,`focus-visible:bg-support-hovered`])},{intent:`accent`,design:`filled`,class:(0,a.tw)([`bg-accent`,`text-on-accent`,`hover:bg-accent-hovered`,`enabled:active:bg-accent-hovered`,`focus-visible:bg-accent-hovered`])},{intent:`ai`,design:`filled`,class:(0,a.tw)([`bg-ai`,`text-on-ai`,`hover:bg-ai-hovered`,`enabled:active:bg-ai-hovered`,`focus-visible:bg-ai-hovered`])},{intent:`success`,design:`filled`,class:(0,a.tw)([`bg-success`,`text-on-success`,`hover:bg-success-hovered`,`enabled:active:bg-success-hovered`,`focus-visible:bg-success-hovered`])},{intent:`alert`,design:`filled`,class:(0,a.tw)([`bg-alert`,`text-on-alert`,`hover:bg-alert-hovered`,`enabled:active:bg-alert-hovered`,`focus-visible:bg-alert-hovered`])},{intent:`danger`,design:`filled`,class:(0,a.tw)([`text-on-error bg-error`,`hover:bg-error-hovered enabled:active:bg-error-hovered`,`focus-visible:bg-error-hovered`])},{intent:`info`,design:`filled`,class:(0,a.tw)([`text-on-error bg-info`,`hover:bg-info-hovered enabled:active:bg-info-hovered`,`focus-visible:bg-info-hovered`])},{intent:`neutral`,design:`filled`,class:(0,a.tw)([`bg-neutral`,`text-on-neutral`,`hover:bg-neutral-hovered`,`enabled:active:bg-neutral-hovered`,`focus-visible:bg-neutral-hovered`])},{intent:`surface`,design:`filled`,class:(0,a.tw)([`bg-surface`,`text-on-surface`,`hover:bg-surface-hovered`,`enabled:active:bg-surface-hovered`,`focus-visible:bg-surface-hovered`])},{intent:`surfaceInverse`,design:`filled`,class:(0,a.tw)([`bg-surface-inverse`,`text-on-surface-inverse`,`hover:bg-surface-inverse-hovered`,`enabled:active:bg-surface-inverse-hovered`,`focus-visible:bg-surface-inverse-hovered`])}],s=[{intent:`main`,design:`ghost`,class:(0,a.tw)([`text-on-main-container`,`hover:bg-main/dim-5`,`enabled:active:bg-main/dim-5`,`focus-visible:bg-main/dim-5`])},{intent:`support`,design:`ghost`,class:(0,a.tw)([`text-on-support-container`,`hover:bg-support/dim-5`,`enabled:active:bg-support/dim-5`,`focus-visible:bg-support/dim-5`])},{intent:`accent`,design:`ghost`,class:(0,a.tw)([`text-on-accent-container`,`hover:bg-accent/dim-5`,`enabled:active:bg-accent/dim-5`,`focus-visible:bg-accent/dim-5`])},{intent:`ai`,design:`ghost`,class:(0,a.tw)([`text-on-ai-container`,`hover:bg-ai/dim-5`,`enabled:active:bg-ai/dim-5`,`focus-visible:bg-ai/dim-5`])},{intent:`success`,design:`ghost`,class:(0,a.tw)([`text-on-success-container`,`hover:bg-success/dim-5`,`enabled:active:bg-success/dim-5`,`focus-visible:bg-success/dim-5`])},{intent:`alert`,design:`ghost`,class:(0,a.tw)([`text-on-alert-container`,`hover:bg-alert/dim-5`,`enabled:active:bg-alert/dim-5`,`focus-visible:bg-alert/dim-5`])},{intent:`danger`,design:`ghost`,class:(0,a.tw)([`text-on-error-container`,`hover:bg-error/dim-5`,`enabled:active:bg-error/dim-5`,`focus-visible:bg-error/dim-5`])},{intent:`info`,design:`ghost`,class:(0,a.tw)([`text-on-info-container`,`hover:bg-info/dim-5`,`enabled:active:bg-info/dim-5`,`focus-visible:bg-info/dim-5`])},{intent:`neutral`,design:`ghost`,class:(0,a.tw)([`text-on-neutral-container`,`hover:bg-neutral/dim-5`,`enabled:active:bg-neutral/dim-5`,`focus-visible:bg-neutral/dim-5`])},{intent:`surface`,design:`ghost`,class:(0,a.tw)([`text-surface`,`hover:bg-surface/dim-5`,`enabled:active:bg-surface/dim-5`,`focus-visible:bg-surface/dim-5`])},{intent:`surfaceInverse`,design:`ghost`,class:(0,a.tw)([`text-surface-inverse`,`hover:bg-surface-inverse/dim-5`,`enabled:active:bg-surface-inverse/dim-5`,`focus-visible:bg-surface-inverse/dim-5`])}],c=[{intent:`main`,design:`outlined`,class:(0,a.tw)([`hover:bg-main/dim-5`,`enabled:active:bg-main/dim-5`,`focus-visible:bg-main/dim-5`,`text-main`])},{intent:`support`,design:`outlined`,class:(0,a.tw)([`hover:bg-support/dim-5`,`enabled:active:bg-support/dim-5`,`focus-visible:bg-support/dim-5`,`text-support`])},{intent:`accent`,design:`outlined`,class:(0,a.tw)([`hover:bg-accent/dim-5`,`enabled:active:bg-accent/dim-5`,`focus-visible:bg-accent/dim-5`,`text-accent`])},{intent:`ai`,design:`outlined`,class:(0,a.tw)([`hover:bg-ai/dim-5`,`enabled:active:bg-ai/dim-5`,`focus-visible:bg-ai/dim-5`,`text-ai`])},{intent:`success`,design:`outlined`,class:(0,a.tw)([`hover:bg-success/dim-5`,`enabled:active:bg-success/dim-5`,`focus-visible:bg-success/dim-5`,`text-success`])},{intent:`alert`,design:`outlined`,class:(0,a.tw)([`hover:bg-alert/dim-5`,`enabled:active:bg-alert/dim-5`,`focus-visible:bg-alert/dim-5`,`text-alert`])},{intent:`danger`,design:`outlined`,class:(0,a.tw)([`hover:bg-error/dim-5`,`enabled:active:bg-error/dim-5`,`focus-visible:bg-error/dim-5`,`text-error`])},{intent:`info`,design:`outlined`,class:(0,a.tw)([`hover:bg-info/dim-5`,`enabled:active:bg-info/dim-5`,`focus-visible:bg-info/dim-5`,`text-info`])},{intent:`neutral`,design:`outlined`,class:(0,a.tw)([`hover:bg-neutral/dim-5`,`enabled:active:bg-neutral/dim-5`,`focus-visible:bg-neutral/dim-5`,`text-neutral`])},{intent:`surface`,design:`outlined`,class:(0,a.tw)([`hover:bg-surface/dim-5`,`enabled:active:bg-surface/dim-5`,`focus-visible:bg-surface/dim-5`,`text-surface`])},{intent:`surfaceInverse`,design:`outlined`,class:(0,a.tw)([`hover:bg-surface-inverse/dim-5`,`enabled:active:bg-surface-inverse/dim-5`,`focus-visible:bg-surface-inverse/dim-5`,`text-surface-inverse`])}],l=[{intent:`main`,design:`tinted`,class:(0,a.tw)([`bg-main-container`,`text-on-main-container`,`hover:bg-main-container-hovered`,`enabled:active:bg-main-container-hovered`,`focus-visible:bg-main-container-hovered`])},{intent:`support`,design:`tinted`,class:(0,a.tw)([`bg-support-container`,`text-on-support-container`,`hover:bg-support-container-hovered`,`enabled:active:bg-support-container-hovered`,`focus-visible:bg-support-container-hovered`])},{intent:`accent`,design:`tinted`,class:(0,a.tw)([`bg-accent-container`,`text-on-accent-container`,`hover:bg-accent-container-hovered`,`enabled:active:bg-accent-container-hovered`,`focus-visible:bg-accent-container-hovered`])},{intent:`ai`,design:`tinted`,class:(0,a.tw)([`bg-ai-container`,`text-on-ai-container`,`hover:bg-ai-container-hovered`,`enabled:active:bg-ai-container-hovered`,`focus-visible:bg-ai-container-hovered`])},{intent:`success`,design:`tinted`,class:(0,a.tw)([`bg-success-container`,`text-on-success-container`,`hover:bg-success-container-hovered`,`enabled:active:bg-success-container-hovered`,`focus-visible:bg-success-container-hovered`])},{intent:`alert`,design:`tinted`,class:(0,a.tw)([`bg-alert-container`,`text-on-alert-container`,`hover:bg-alert-container-hovered`,`enabled:active:bg-alert-container-hovered`,`focus-visible:bg-alert-container-hovered`])},{intent:`danger`,design:`tinted`,class:(0,a.tw)([`bg-error-container`,`text-on-error-container`,`hover:bg-error-container-hovered`,`enabled:active:bg-error-container-hovered`,`focus-visible:bg-error-container-hovered`])},{intent:`info`,design:`tinted`,class:(0,a.tw)([`bg-info-container`,`text-on-info-container`,`hover:bg-info-container-hovered`,`enabled:active:bg-info-container-hovered`,`focus-visible:bg-info-container-hovered`])},{intent:`neutral`,design:`tinted`,class:(0,a.tw)([`bg-neutral-container`,`text-on-neutral-container`,`hover:bg-neutral-container-hovered`,`enabled:active:bg-neutral-container-hovered`,`focus-visible:bg-neutral-container-hovered`])},{intent:`surface`,design:`tinted`,class:(0,a.tw)([`bg-surface`,`text-on-surface`,`hover:bg-surface-hovered`,`enabled:active:bg-surface-hovered`,`focus-visible:bg-surface-hovered`])},{intent:`surfaceInverse`,design:`tinted`,class:(0,a.tw)([`bg-surface-inverse`,`text-on-surface-inverse`,`hover:bg-surface-inverse-hovered`,`enabled:active:bg-surface-inverse-hovered`,`focus-visible:bg-surface-inverse-hovered`])}],u=[{intent:`main`,design:`contrast`,class:(0,a.tw)([`text-on-main-contaier bg-surface`,`hover:bg-main-container-hovered`,`enabled:active:bg-main-container-hovered`,`focus-visible:bg-main-container-hovered`])},{intent:`support`,design:`contrast`,class:(0,a.tw)([`text-on-support-container bg-surface`,`hover:bg-support-container-hovered`,`enabled:active:bg-support-container-hovered`,`focus-visible:bg-support-container-hovered`])},{intent:`accent`,design:`contrast`,class:(0,a.tw)([`text-on-accent-container bg-surface`,`hover:bg-accent-container-hovered`,`enabled:active:bg-accent-container-hovered`,`focus-visible:bg-accent-container-hovered`])},{intent:`ai`,design:`contrast`,class:(0,a.tw)([`text-on-ai-container bg-surface`,`hover:bg-ai-container-hovered`,`enabled:active:bg-ai-container-hovered`,`focus-visible:bg-ai-container-hovered`])},{intent:`success`,design:`contrast`,class:(0,a.tw)([`text-on-success-container bg-surface`,`hover:bg-success-container-hovered`,`enabled:active:bg-success-container-hovered`,`focus-visible:bg-success-container-hovered`])},{intent:`alert`,design:`contrast`,class:(0,a.tw)([`text-on-alert-container bg-surface`,`hover:bg-alert-container-hovered`,`enabled:active:bg-alert-container-hovered`,`focus-visible:bg-alert-container-hovered`])},{intent:`danger`,design:`contrast`,class:(0,a.tw)([`text-on-error-container bg-surface`,`hover:bg-error-container-hovered`,`enabled:active:bg-error-container-hovered`,`focus-visible:bg-error-container-hovered`])},{intent:`info`,design:`contrast`,class:(0,a.tw)([`text-on-info-container bg-surface`,`hover:bg-info-container-hovered`,`enabled:active:bg-info-container-hovered`,`focus-visible:bg-info-container-hovered`])},{intent:`neutral`,design:`contrast`,class:(0,a.tw)([`text-on-neutral-container bg-surface`,`hover:bg-neutral-container-hovered`,`enabled:active:bg-neutral-container-hovered`,`focus-visible:bg-neutral-container-hovered`])},{intent:`surface`,design:`contrast`,class:(0,a.tw)([`text-on-surface bg-surface`,`hover:bg-surface-hovered`,`enabled:active:bg-surface-hovered`,`focus-visible:bg-surface-hovered`])},{intent:`surfaceInverse`,design:`contrast`,class:(0,a.tw)([`text-on-surface-inverse bg-surface-inverse`,`hover:bg-surface-inverse-hovered`,`enabled:active:bg-surface-inverse-hovered`,`focus-visible:bg-surface-inverse-hovered`])}],d=(0,n.cva)([`u-shadow-border-transition`,`box-border inline-flex items-center justify-center gap-md whitespace-nowrap`,`default:px-lg`,`text-body-1-highlight`,`focus-visible:u-outline`],{variants:{design:(0,a.makeVariants)({filled:[],outlined:[`bg-transparent`,`border-sm`,`border-current`],tinted:[],ghost:[`default:-mx-md px-md hover:bg-main/dim-5`],contrast:[]}),underline:{true:[`underline`]},intent:(0,a.makeVariants)({main:[],support:[],accent:[],ai:[],success:[],alert:[],danger:[],info:[],neutral:[],surface:[],surfaceInverse:[]}),size:(0,a.makeVariants)({sm:[`min-w-sz-32`,`h-sz-32`],md:[`min-w-sz-44`,`h-sz-44`],lg:[`min-w-sz-56`,`h-sz-56`]}),shape:(0,a.makeVariants)({rounded:[`rounded-button`],square:[`rounded-0`],pill:[`rounded-full`]}),disabled:{true:[`cursor-not-allowed`,`opacity-dim-3`],false:[`cursor-pointer`]}},compoundVariants:[...o,...c,...l,...s,...u],defaultVariants:{design:`filled`,intent:`main`,size:`md`,shape:`rounded`}}),f=[`onClick`,`onMouseDown`,`onMouseUp`,`onMouseEnter`,`onMouseLeave`,`onMouseOver`,`onMouseOut`,`onKeyDown`,`onKeyPress`,`onKeyUp`,`onSubmit`],p=({children:a,design:o=`filled`,disabled:s=!1,ariaDisabled:c=!1,intent:l=`main`,isLoading:u=!1,loadingLabel:p,loadingText:m,shape:h=`pill`,size:g=`md`,asChild:_,className:v,underline:y=!1,ref:b,...x})=>{let S=_?e.Slot:`button`,C=!!s||!!c||u,w=!!s&&!c,T=(0,r.useMemo)(()=>{let e={};return C&&f.forEach(t=>{e[t]=e=>{e.type===`keydown`&&e.key===`Tab`||e.preventDefault()}}),e},[C]),E={size:`current`,className:m?`inline-block`:`absolute`,...p&&{"aria-label":p}};return(0,i.jsx)(S,{"data-spark-component":`button`,...S===`button`&&{type:`button`},ref:b,className:d({className:v,design:o,disabled:C,intent:l,shape:h,size:g,underline:y}),disabled:w,"aria-disabled":C?!0:void 0,"aria-busy":u,"aria-live":u?`assertive`:`off`,...x,...T,children:e.wrapPolymorphicSlot(_,a,e=>u?(0,i.jsxs)(i.Fragment,{children:[(0,i.jsx)(t.t,{...E}),m,(0,i.jsx)(`div`,{"aria-hidden":!0,className:(0,n.cx)(`gap-md`,m?`hidden`:`inline-flex opacity-0`),children:e})]}):e)})};p.displayName=`Button`,Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return d}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return p}});
2
- //# sourceMappingURL=button-jPMfDNvm.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"button-jPMfDNvm.js","names":[],"sources":["../src/button/variants/filled.ts","../src/button/variants/ghost.ts","../src/button/variants/outlined.ts","../src/button/variants/tinted.ts","../src/button/variants/contrast.ts","../src/button/Button.styles.tsx","../src/button/Button.tsx"],"sourcesContent":["import { tw } from '@spark-ui/internal-utils'\n\nexport const filledVariants = [\n // Main\n {\n intent: 'main',\n design: 'filled',\n class: tw([\n 'bg-main',\n 'text-on-main',\n 'hover:bg-main-hovered',\n 'enabled:active:bg-main-hovered',\n 'focus-visible:bg-main-hovered',\n ]),\n },\n // Support\n {\n intent: 'support',\n design: 'filled',\n class: tw([\n 'bg-support',\n 'text-on-support',\n 'hover:bg-support-hovered',\n 'enabled:active:bg-support-hovered',\n 'focus-visible:bg-support-hovered',\n ]),\n },\n // Accent\n {\n intent: 'accent',\n design: 'filled',\n class: tw([\n 'bg-accent',\n 'text-on-accent',\n 'hover:bg-accent-hovered',\n 'enabled:active:bg-accent-hovered',\n 'focus-visible:bg-accent-hovered',\n ]),\n },\n // AI\n {\n intent: 'ai',\n design: 'filled',\n class: tw([\n 'bg-ai',\n 'text-on-ai',\n 'hover:bg-ai-hovered',\n 'enabled:active:bg-ai-hovered',\n 'focus-visible:bg-ai-hovered',\n ]),\n },\n // Success\n {\n intent: 'success',\n design: 'filled',\n class: tw([\n 'bg-success',\n 'text-on-success',\n 'hover:bg-success-hovered',\n 'enabled:active:bg-success-hovered',\n 'focus-visible:bg-success-hovered',\n ]),\n },\n // Alert\n {\n intent: 'alert',\n design: 'filled',\n class: tw([\n 'bg-alert',\n 'text-on-alert',\n 'hover:bg-alert-hovered',\n 'enabled:active:bg-alert-hovered',\n 'focus-visible:bg-alert-hovered',\n ]),\n },\n // Danger\n {\n intent: 'danger',\n design: 'filled',\n class: tw([\n 'text-on-error bg-error',\n 'hover:bg-error-hovered enabled:active:bg-error-hovered',\n 'focus-visible:bg-error-hovered',\n ]),\n },\n // Info\n {\n intent: 'info',\n design: 'filled',\n class: tw([\n 'text-on-error bg-info',\n 'hover:bg-info-hovered enabled:active:bg-info-hovered',\n 'focus-visible:bg-info-hovered',\n ]),\n },\n // Neutral\n {\n intent: 'neutral',\n design: 'filled',\n class: tw([\n 'bg-neutral',\n 'text-on-neutral',\n 'hover:bg-neutral-hovered',\n 'enabled:active:bg-neutral-hovered',\n 'focus-visible:bg-neutral-hovered',\n ]),\n },\n // Surface\n {\n intent: 'surface',\n design: 'filled',\n class: tw([\n 'bg-surface',\n 'text-on-surface',\n 'hover:bg-surface-hovered',\n 'enabled:active:bg-surface-hovered',\n 'focus-visible:bg-surface-hovered',\n ]),\n },\n {\n intent: 'surfaceInverse',\n design: 'filled',\n class: tw([\n 'bg-surface-inverse',\n 'text-on-surface-inverse',\n 'hover:bg-surface-inverse-hovered',\n 'enabled:active:bg-surface-inverse-hovered',\n 'focus-visible:bg-surface-inverse-hovered',\n ]),\n },\n] as const\n","import { tw } from '@spark-ui/internal-utils'\n\nexport const ghostVariants = [\n {\n intent: 'main',\n design: 'ghost',\n class: tw([\n 'text-on-main-container',\n 'hover:bg-main/dim-5',\n 'enabled:active:bg-main/dim-5',\n 'focus-visible:bg-main/dim-5',\n ]),\n },\n {\n intent: 'support',\n design: 'ghost',\n class: tw([\n 'text-on-support-container',\n 'hover:bg-support/dim-5',\n 'enabled:active:bg-support/dim-5',\n 'focus-visible:bg-support/dim-5',\n ]),\n },\n {\n intent: 'accent',\n design: 'ghost',\n class: tw([\n 'text-on-accent-container',\n 'hover:bg-accent/dim-5',\n 'enabled:active:bg-accent/dim-5',\n 'focus-visible:bg-accent/dim-5',\n ]),\n },\n {\n intent: 'ai',\n design: 'ghost',\n class: tw([\n 'text-on-ai-container',\n 'hover:bg-ai/dim-5',\n 'enabled:active:bg-ai/dim-5',\n 'focus-visible:bg-ai/dim-5',\n ]),\n },\n {\n intent: 'success',\n design: 'ghost',\n class: tw([\n 'text-on-success-container',\n 'hover:bg-success/dim-5',\n 'enabled:active:bg-success/dim-5',\n 'focus-visible:bg-success/dim-5',\n ]),\n },\n {\n intent: 'alert',\n design: 'ghost',\n class: tw([\n 'text-on-alert-container',\n 'hover:bg-alert/dim-5',\n 'enabled:active:bg-alert/dim-5',\n 'focus-visible:bg-alert/dim-5',\n ]),\n },\n {\n intent: 'danger',\n design: 'ghost',\n class: tw([\n 'text-on-error-container',\n 'hover:bg-error/dim-5',\n 'enabled:active:bg-error/dim-5',\n 'focus-visible:bg-error/dim-5',\n ]),\n },\n {\n intent: 'info',\n design: 'ghost',\n class: tw([\n 'text-on-info-container',\n 'hover:bg-info/dim-5',\n 'enabled:active:bg-info/dim-5',\n 'focus-visible:bg-info/dim-5',\n ]),\n },\n {\n intent: 'neutral',\n design: 'ghost',\n class: tw([\n 'text-on-neutral-container',\n 'hover:bg-neutral/dim-5',\n 'enabled:active:bg-neutral/dim-5',\n 'focus-visible:bg-neutral/dim-5',\n ]),\n },\n {\n intent: 'surface',\n design: 'ghost',\n class: tw([\n 'text-surface',\n 'hover:bg-surface/dim-5',\n 'enabled:active:bg-surface/dim-5',\n 'focus-visible:bg-surface/dim-5',\n ]),\n },\n {\n intent: 'surfaceInverse',\n design: 'ghost',\n class: tw([\n 'text-surface-inverse',\n 'hover:bg-surface-inverse/dim-5',\n 'enabled:active:bg-surface-inverse/dim-5',\n 'focus-visible:bg-surface-inverse/dim-5',\n ]),\n },\n] as const\n","import { tw } from '@spark-ui/internal-utils'\n\nexport const outlinedVariants = [\n {\n intent: 'main',\n design: 'outlined',\n class: tw([\n 'hover:bg-main/dim-5',\n 'enabled:active:bg-main/dim-5',\n 'focus-visible:bg-main/dim-5',\n 'text-main',\n ]),\n },\n {\n intent: 'support',\n design: 'outlined',\n class: tw([\n 'hover:bg-support/dim-5',\n 'enabled:active:bg-support/dim-5',\n 'focus-visible:bg-support/dim-5',\n 'text-support',\n ]),\n },\n {\n intent: 'accent',\n design: 'outlined',\n class: tw([\n 'hover:bg-accent/dim-5',\n 'enabled:active:bg-accent/dim-5',\n 'focus-visible:bg-accent/dim-5',\n 'text-accent',\n ]),\n },\n {\n intent: 'ai',\n design: 'outlined',\n class: tw([\n 'hover:bg-ai/dim-5',\n 'enabled:active:bg-ai/dim-5',\n 'focus-visible:bg-ai/dim-5',\n 'text-ai',\n ]),\n },\n {\n intent: 'success',\n design: 'outlined',\n class: tw([\n 'hover:bg-success/dim-5',\n 'enabled:active:bg-success/dim-5',\n 'focus-visible:bg-success/dim-5',\n 'text-success',\n ]),\n },\n {\n intent: 'alert',\n design: 'outlined',\n class: tw([\n 'hover:bg-alert/dim-5',\n 'enabled:active:bg-alert/dim-5',\n 'focus-visible:bg-alert/dim-5',\n 'text-alert',\n ]),\n },\n {\n intent: 'danger',\n design: 'outlined',\n class: tw([\n 'hover:bg-error/dim-5',\n 'enabled:active:bg-error/dim-5',\n 'focus-visible:bg-error/dim-5',\n 'text-error',\n ]),\n },\n {\n intent: 'info',\n design: 'outlined',\n class: tw([\n 'hover:bg-info/dim-5',\n 'enabled:active:bg-info/dim-5',\n 'focus-visible:bg-info/dim-5',\n 'text-info',\n ]),\n },\n {\n intent: 'neutral',\n design: 'outlined',\n class: tw([\n 'hover:bg-neutral/dim-5',\n 'enabled:active:bg-neutral/dim-5',\n 'focus-visible:bg-neutral/dim-5',\n 'text-neutral',\n ]),\n },\n {\n intent: 'surface',\n design: 'outlined',\n class: tw([\n 'hover:bg-surface/dim-5',\n 'enabled:active:bg-surface/dim-5',\n 'focus-visible:bg-surface/dim-5',\n 'text-surface',\n ]),\n },\n {\n intent: 'surfaceInverse',\n design: 'outlined',\n class: tw([\n 'hover:bg-surface-inverse/dim-5',\n 'enabled:active:bg-surface-inverse/dim-5',\n 'focus-visible:bg-surface-inverse/dim-5',\n 'text-surface-inverse',\n ]),\n },\n] as const\n","import { tw } from '@spark-ui/internal-utils'\n\nexport const tintedVariants = [\n {\n intent: 'main',\n design: 'tinted',\n class: tw([\n 'bg-main-container',\n 'text-on-main-container',\n 'hover:bg-main-container-hovered',\n 'enabled:active:bg-main-container-hovered',\n 'focus-visible:bg-main-container-hovered',\n ]),\n },\n {\n intent: 'support',\n design: 'tinted',\n class: tw([\n 'bg-support-container',\n 'text-on-support-container',\n 'hover:bg-support-container-hovered',\n 'enabled:active:bg-support-container-hovered',\n 'focus-visible:bg-support-container-hovered',\n ]),\n },\n {\n intent: 'accent',\n design: 'tinted',\n class: tw([\n 'bg-accent-container',\n 'text-on-accent-container',\n 'hover:bg-accent-container-hovered',\n 'enabled:active:bg-accent-container-hovered',\n 'focus-visible:bg-accent-container-hovered',\n ]),\n },\n {\n intent: 'ai',\n design: 'tinted',\n class: tw([\n 'bg-ai-container',\n 'text-on-ai-container',\n 'hover:bg-ai-container-hovered',\n 'enabled:active:bg-ai-container-hovered',\n 'focus-visible:bg-ai-container-hovered',\n ]),\n },\n {\n intent: 'success',\n design: 'tinted',\n class: tw([\n 'bg-success-container',\n 'text-on-success-container',\n 'hover:bg-success-container-hovered',\n 'enabled:active:bg-success-container-hovered',\n 'focus-visible:bg-success-container-hovered',\n ]),\n },\n {\n intent: 'alert',\n design: 'tinted',\n class: tw([\n 'bg-alert-container',\n 'text-on-alert-container',\n 'hover:bg-alert-container-hovered',\n 'enabled:active:bg-alert-container-hovered',\n 'focus-visible:bg-alert-container-hovered',\n ]),\n },\n {\n intent: 'danger',\n design: 'tinted',\n class: tw([\n 'bg-error-container',\n 'text-on-error-container',\n 'hover:bg-error-container-hovered',\n 'enabled:active:bg-error-container-hovered',\n 'focus-visible:bg-error-container-hovered',\n ]),\n },\n {\n intent: 'info',\n design: 'tinted',\n class: tw([\n 'bg-info-container',\n 'text-on-info-container',\n 'hover:bg-info-container-hovered',\n 'enabled:active:bg-info-container-hovered',\n 'focus-visible:bg-info-container-hovered',\n ]),\n },\n {\n intent: 'neutral',\n design: 'tinted',\n class: tw([\n 'bg-neutral-container',\n 'text-on-neutral-container',\n 'hover:bg-neutral-container-hovered',\n 'enabled:active:bg-neutral-container-hovered',\n 'focus-visible:bg-neutral-container-hovered',\n ]),\n },\n {\n intent: 'surface',\n design: 'tinted',\n class: tw([\n 'bg-surface',\n 'text-on-surface',\n 'hover:bg-surface-hovered',\n 'enabled:active:bg-surface-hovered',\n 'focus-visible:bg-surface-hovered',\n ]),\n },\n {\n intent: 'surfaceInverse',\n design: 'tinted',\n class: tw([\n 'bg-surface-inverse',\n 'text-on-surface-inverse',\n 'hover:bg-surface-inverse-hovered',\n 'enabled:active:bg-surface-inverse-hovered',\n 'focus-visible:bg-surface-inverse-hovered',\n ]),\n },\n] as const\n","import { tw } from '@spark-ui/internal-utils'\n\nexport const contrastVariants = [\n {\n intent: 'main',\n design: 'contrast',\n class: tw([\n 'text-on-main-contaier bg-surface',\n 'hover:bg-main-container-hovered',\n 'enabled:active:bg-main-container-hovered',\n 'focus-visible:bg-main-container-hovered',\n ]),\n },\n {\n intent: 'support',\n design: 'contrast',\n class: tw([\n 'text-on-support-container bg-surface',\n 'hover:bg-support-container-hovered',\n 'enabled:active:bg-support-container-hovered',\n 'focus-visible:bg-support-container-hovered',\n ]),\n },\n {\n intent: 'accent',\n design: 'contrast',\n class: tw([\n 'text-on-accent-container bg-surface',\n 'hover:bg-accent-container-hovered',\n 'enabled:active:bg-accent-container-hovered',\n 'focus-visible:bg-accent-container-hovered',\n ]),\n },\n {\n intent: 'ai',\n design: 'contrast',\n class: tw([\n 'text-on-ai-container bg-surface',\n 'hover:bg-ai-container-hovered',\n 'enabled:active:bg-ai-container-hovered',\n 'focus-visible:bg-ai-container-hovered',\n ]),\n },\n {\n intent: 'success',\n design: 'contrast',\n class: tw([\n 'text-on-success-container bg-surface',\n 'hover:bg-success-container-hovered',\n 'enabled:active:bg-success-container-hovered',\n 'focus-visible:bg-success-container-hovered',\n ]),\n },\n {\n intent: 'alert',\n design: 'contrast',\n class: tw([\n 'text-on-alert-container bg-surface',\n 'hover:bg-alert-container-hovered',\n 'enabled:active:bg-alert-container-hovered',\n 'focus-visible:bg-alert-container-hovered',\n ]),\n },\n {\n intent: 'danger',\n design: 'contrast',\n class: tw([\n 'text-on-error-container bg-surface',\n 'hover:bg-error-container-hovered',\n 'enabled:active:bg-error-container-hovered',\n 'focus-visible:bg-error-container-hovered',\n ]),\n },\n {\n intent: 'info',\n design: 'contrast',\n class: tw([\n 'text-on-info-container bg-surface',\n 'hover:bg-info-container-hovered',\n 'enabled:active:bg-info-container-hovered',\n 'focus-visible:bg-info-container-hovered',\n ]),\n },\n {\n intent: 'neutral',\n design: 'contrast',\n class: tw([\n 'text-on-neutral-container bg-surface',\n 'hover:bg-neutral-container-hovered',\n 'enabled:active:bg-neutral-container-hovered',\n 'focus-visible:bg-neutral-container-hovered',\n ]),\n },\n {\n intent: 'surface',\n design: 'contrast',\n class: tw([\n 'text-on-surface bg-surface',\n 'hover:bg-surface-hovered',\n 'enabled:active:bg-surface-hovered',\n 'focus-visible:bg-surface-hovered',\n ]),\n },\n {\n intent: 'surfaceInverse',\n design: 'contrast',\n class: tw([\n 'text-on-surface-inverse bg-surface-inverse',\n 'hover:bg-surface-inverse-hovered',\n 'enabled:active:bg-surface-inverse-hovered',\n 'focus-visible:bg-surface-inverse-hovered',\n ]),\n },\n] as const\n","import { makeVariants } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nimport {\n contrastVariants,\n filledVariants,\n ghostVariants,\n outlinedVariants,\n tintedVariants,\n} from './variants'\n\nexport const buttonStyles = cva(\n [\n 'u-shadow-border-transition',\n 'box-border inline-flex items-center justify-center gap-md whitespace-nowrap',\n 'default:px-lg',\n 'text-body-1-highlight',\n 'focus-visible:u-outline',\n ],\n {\n variants: {\n /**\n * Main style of the button.\n *\n * - `filled`: Button will be plain.\n *\n * - `outlined`: Button will be transparent with an outline.\n *\n * - `tinted`: Button will be filled but using a lighter color scheme.\n *\n * - `ghost`: Button will look like a link. No borders, plain text.\n *\n * - `contrast`: Button will be surface filled. No borders, plain text.\n *\n */\n design: makeVariants<'design', ['filled', 'outlined', 'tinted', 'ghost', 'contrast']>({\n filled: [],\n outlined: ['bg-transparent', 'border-sm', 'border-current'],\n tinted: [],\n ghost: ['default:-mx-md px-md hover:bg-main/dim-5'],\n contrast: [],\n }),\n underline: {\n true: ['underline'],\n },\n /**\n * Color scheme of the button.\n */\n intent: makeVariants<\n 'intent',\n [\n 'main',\n 'support',\n 'accent',\n 'ai',\n 'success',\n 'alert',\n 'danger',\n 'info',\n 'neutral',\n 'surface',\n 'surfaceInverse',\n ]\n >({\n main: [],\n support: [],\n accent: [],\n ai: [],\n success: [],\n alert: [],\n danger: [],\n info: [],\n neutral: [],\n surface: [],\n surfaceInverse: [],\n }),\n /**\n * Size of the button.\n */\n size: makeVariants<'size', ['sm', 'md', 'lg']>({\n sm: ['min-w-sz-32', 'h-sz-32'],\n md: ['min-w-sz-44', 'h-sz-44'],\n lg: ['min-w-sz-56', 'h-sz-56'],\n }),\n /**\n * Shape of the button.\n */\n shape: makeVariants<'shape', ['rounded', 'square', 'pill']>({\n rounded: ['rounded-button'],\n square: ['rounded-0'],\n pill: ['rounded-full'],\n }),\n /**\n * Disable the button, preventing user interaction and adding opacity.\n */\n disabled: {\n true: ['cursor-not-allowed', 'opacity-dim-3'],\n false: ['cursor-pointer'],\n },\n },\n compoundVariants: [\n ...filledVariants,\n ...outlinedVariants,\n ...tintedVariants,\n ...ghostVariants,\n ...contrastVariants,\n ],\n defaultVariants: {\n design: 'filled',\n intent: 'main',\n size: 'md',\n shape: 'rounded',\n },\n }\n)\n\nexport type ButtonStylesProps = VariantProps<typeof buttonStyles>\n","import { cx } from 'class-variance-authority'\nimport { ComponentPropsWithoutRef, type DOMAttributes, Ref, useMemo } from 'react'\n\nimport { Slot, wrapPolymorphicSlot } from '../slot'\nimport { Spinner, type SpinnerProps } from '../spinner'\nimport { buttonStyles, type ButtonStylesProps } from './Button.styles'\n\nexport interface ButtonProps\n extends Omit<ComponentPropsWithoutRef<'button'>, 'disabled'>, ButtonStylesProps {\n /**\n * Change the component to the HTML tag or custom component of the only child.\n */\n asChild?: boolean\n /**\n * Display a spinner to indicate to the user that the button is loading something after they interacted with it.\n */\n isLoading?: boolean\n /**\n * If your loading state should only display a spinner, it is better to specify a label for it (a11y).\n */\n loadingLabel?: string\n /**\n * If your loading state should also display a label, you can use this prop instead of `loadingLabel`.\n * **Please note that using this can result in layout shifting when the Button goes from loading state to normal state.**\n */\n loadingText?: string\n /**\n * When true, the button is non-interactive and has disabled styling but stays focusable (uses\n * `aria-disabled` instead of native `disabled`). Use for cases where the user should be able to\n * focus the control to discover why it is disabled (e.g. form submit, bulk bar actions).\n */\n ariaDisabled?: boolean\n ref?: Ref<HTMLButtonElement>\n}\n\ntype DOMAttributesEventHandler = keyof Omit<\n DOMAttributes<HTMLButtonElement>,\n 'children' | 'dangerouslySetInnerHTML'\n>\n\nconst blockedEventHandlers: DOMAttributesEventHandler[] = [\n 'onClick',\n 'onMouseDown',\n 'onMouseUp',\n 'onMouseEnter',\n 'onMouseLeave',\n 'onMouseOver',\n 'onMouseOut',\n 'onKeyDown',\n 'onKeyPress',\n 'onKeyUp',\n 'onSubmit',\n]\n\n/**\n * A clickable element that triggers an action or event when activated by the user.\n */\nexport const Button = ({\n children,\n design = 'filled',\n disabled = false,\n ariaDisabled = false,\n intent = 'main',\n isLoading = false,\n loadingLabel,\n loadingText,\n shape = 'pill',\n size = 'md',\n asChild,\n className,\n underline = false,\n ref,\n ...others\n}: ButtonProps) => {\n const Component = asChild ? Slot : 'button'\n\n const shouldNotInteract = !!disabled || !!ariaDisabled || isLoading\n const useNativeDisabled = !!disabled && !ariaDisabled\n\n const disabledEventHandlers = useMemo(() => {\n const result: Partial<Record<DOMAttributesEventHandler, (e: React.SyntheticEvent) => void>> = {}\n\n if (shouldNotInteract) {\n blockedEventHandlers.forEach(key => {\n result[key] = (e: React.SyntheticEvent) => {\n // Allow Tab to move focus away from the button\n if (e.type === 'keydown' && (e as React.KeyboardEvent).key === 'Tab') return\n /*\n Setting handlers to `undefined` (e.g. `result[eventHandler] = undefined`) only blocks JS-level handlers, it does not prevent native browser behavior.\n Calling preventDefault() here also blocks native form submission when type=\"submit\", since the browser triggers it from the click chain.\n */\n e.preventDefault()\n }\n })\n }\n\n return result\n }, [shouldNotInteract])\n\n const spinnerProps = {\n size: 'current' as SpinnerProps['size'],\n className: loadingText ? 'inline-block' : 'absolute',\n ...(loadingLabel && { 'aria-label': loadingLabel }),\n }\n\n return (\n <Component\n data-spark-component=\"button\"\n {...(Component === 'button' && { type: 'button' })}\n ref={ref}\n className={buttonStyles({\n className,\n design,\n disabled: shouldNotInteract,\n intent,\n shape,\n size,\n underline,\n })}\n disabled={useNativeDisabled}\n aria-disabled={shouldNotInteract ? true : undefined}\n aria-busy={isLoading}\n aria-live={isLoading ? 'assertive' : 'off'}\n {...others}\n {...disabledEventHandlers}\n >\n {wrapPolymorphicSlot(asChild, children, slotted =>\n isLoading ? (\n <>\n <Spinner {...spinnerProps} />\n {loadingText}\n\n <div\n aria-hidden\n className={cx('gap-md', loadingText ? 'hidden' : 'inline-flex opacity-0')}\n >\n {slotted}\n </div>\n </>\n ) : (\n slotted\n )\n )}\n </Component>\n )\n}\n\nButton.displayName = 'Button'\n"],"mappings":"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"}
@@ -1,2 +0,0 @@
1
- const e=require("./button-jPMfDNvm.js");let t=require("class-variance-authority"),n=require("react/jsx-runtime"),r=require("@spark-ui/internal-utils");var i=(0,t.cva)([`pl-0 pr-0`],{variants:{size:(0,r.makeVariants)({sm:[`text-body-1`],md:[`text-body-1`],lg:[`text-display-3`]})}}),a=({design:t=`filled`,disabled:r=!1,intent:a=`main`,shape:o=`pill`,size:s=`md`,className:c,ref:l,...u})=>(0,n.jsx)(e.t,{"data-spark-component":`icon-button`,ref:l,className:i({size:s,className:c}),design:t,disabled:r,intent:a,shape:o,size:s,...u});a.displayName=`IconButton`,Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return a}});
2
- //# sourceMappingURL=icon-button-DWaNkUqV.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"icon-button-DWaNkUqV.js","names":[],"sources":["../src/icon-button/IconButton.styles.tsx","../src/icon-button/IconButton.tsx"],"sourcesContent":["import { makeVariants } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\n// override the Button component's px-lg padding by using a more specific class selector (pl-0 pr-0)\nexport const iconButtonStyles = cva(['pl-0 pr-0'], {\n variants: {\n /**\n * Sets the size of the icon.\n */\n size: makeVariants<'size', ['sm', 'md', 'lg']>({\n sm: ['text-body-1'],\n md: ['text-body-1'],\n lg: ['text-display-3'],\n }),\n },\n})\n\nexport type IconButtonStylesProps = VariantProps<typeof iconButtonStyles>\n","import { Ref } from 'react'\n\nimport { Button, ButtonProps } from '../button'\nimport { iconButtonStyles } from './IconButton.styles'\n\nexport interface IconButtonProps extends Omit<ButtonProps, 'loadingText'> {\n 'aria-label': string\n ref?: Ref<HTMLButtonElement>\n}\n\n/**\n * A button component that contains only an icon without text label.\n */\nexport const IconButton = ({\n design = 'filled',\n disabled = false,\n intent = 'main',\n shape = 'pill',\n size = 'md',\n className,\n ref,\n ...others\n}: IconButtonProps) => {\n return (\n <Button\n data-spark-component=\"icon-button\"\n ref={ref}\n className={iconButtonStyles({ size, className })}\n design={design}\n disabled={disabled}\n intent={intent}\n shape={shape}\n size={size}\n {...others}\n />\n )\n}\n\nIconButton.displayName = 'IconButton'\n"],"mappings":"uJAIA,IAAa,GAAA,EAAA,EAAA,IAAA,CAAuB,CAAC,WAAW,EAAG,CACjD,SAAU,CAIR,MAAA,EAAA,EAAA,aAAA,CAA+C,CAC7C,GAAI,CAAC,aAAa,EAClB,GAAI,CAAC,aAAa,EAClB,GAAI,CAAC,gBAAgB,CACvB,CAAC,CACH,CACF,CAAC,ECFY,GAAc,CACzB,SAAS,SACT,WAAW,GACX,SAAS,OACT,QAAQ,OACR,OAAO,KACP,YACA,MACA,GAAG,MAGD,EAAA,EAAA,IAAA,CAAC,EAAA,EAAD,CACE,uBAAqB,cAChB,MACL,UAAW,EAAiB,CAAE,OAAM,WAAU,CAAC,EACvC,SACE,WACF,SACD,QACD,OACN,GAAI,CACL,CAAA,EAIL,EAAW,YAAc"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"icon-button-DwFo4BqM.mjs","names":[],"sources":["../src/icon-button/IconButton.styles.tsx","../src/icon-button/IconButton.tsx"],"sourcesContent":["import { makeVariants } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\n// override the Button component's px-lg padding by using a more specific class selector (pl-0 pr-0)\nexport const iconButtonStyles = cva(['pl-0 pr-0'], {\n variants: {\n /**\n * Sets the size of the icon.\n */\n size: makeVariants<'size', ['sm', 'md', 'lg']>({\n sm: ['text-body-1'],\n md: ['text-body-1'],\n lg: ['text-display-3'],\n }),\n },\n})\n\nexport type IconButtonStylesProps = VariantProps<typeof iconButtonStyles>\n","import { Ref } from 'react'\n\nimport { Button, ButtonProps } from '../button'\nimport { iconButtonStyles } from './IconButton.styles'\n\nexport interface IconButtonProps extends Omit<ButtonProps, 'loadingText'> {\n 'aria-label': string\n ref?: Ref<HTMLButtonElement>\n}\n\n/**\n * A button component that contains only an icon without text label.\n */\nexport const IconButton = ({\n design = 'filled',\n disabled = false,\n intent = 'main',\n shape = 'pill',\n size = 'md',\n className,\n ref,\n ...others\n}: IconButtonProps) => {\n return (\n <Button\n data-spark-component=\"icon-button\"\n ref={ref}\n className={iconButtonStyles({ size, className })}\n design={design}\n disabled={disabled}\n intent={intent}\n shape={shape}\n size={size}\n {...others}\n />\n )\n}\n\nIconButton.displayName = 'IconButton'\n"],"mappings":";;;;;AAIA,IAAa,IAAmB,EAAI,CAAC,WAAW,GAAG,EACjD,UAAU,EAIR,MAAM,EAAyC;CAC7C,IAAI,CAAC,aAAa;CAClB,IAAI,CAAC,aAAa;CAClB,IAAI,CAAC,gBAAgB;AACvB,CAAC,EACH,EACF,CAAC,GCFY,KAAc,EACzB,YAAS,UACT,cAAW,IACX,YAAS,QACT,WAAQ,QACR,UAAO,MACP,cACA,QACA,GAAG,QAGD,kBAAC,GAAD;CACE,wBAAqB;CAChB;CACL,WAAW,EAAiB;EAAE;EAAM;CAAU,CAAC;CACvC;CACE;CACF;CACD;CACD;CACN,GAAI;AACL,CAAA;AAIL,EAAW,cAAc"}