@spark-ui/components 16.1.1-beta.0 → 16.2.1

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 (76) hide show
  1. package/dist/{Button-BIAkZTRR.js → Button-B6rA3-e5.js} +2 -2
  2. package/dist/{Button-BIAkZTRR.js.map → Button-B6rA3-e5.js.map} +1 -1
  3. package/dist/{Button-DggC4GFM.mjs → Button-DPncfbbM.mjs} +2 -2
  4. package/dist/{Button-DggC4GFM.mjs.map → Button-DPncfbbM.mjs.map} +1 -1
  5. package/dist/{IconButton-Mv9tO1ZH.mjs → IconButton-Bfd-6BAD.mjs} +14 -14
  6. package/dist/IconButton-Bfd-6BAD.mjs.map +1 -0
  7. package/dist/IconButton-D3g86WpZ.js +2 -0
  8. package/dist/IconButton-D3g86WpZ.js.map +1 -0
  9. package/dist/avatar/index.js +1 -1
  10. package/dist/avatar/index.mjs +1 -1
  11. package/dist/button/index.js +1 -1
  12. package/dist/button/index.mjs +1 -1
  13. package/dist/carousel/index.js +1 -1
  14. package/dist/carousel/index.mjs +1 -1
  15. package/dist/checkbox/index.js +1 -1
  16. package/dist/checkbox/index.js.map +1 -1
  17. package/dist/checkbox/index.mjs +30 -30
  18. package/dist/checkbox/index.mjs.map +1 -1
  19. package/dist/chip/index.js +1 -1
  20. package/dist/chip/index.js.map +1 -1
  21. package/dist/chip/index.mjs +1 -1
  22. package/dist/chip/index.mjs.map +1 -1
  23. package/dist/combobox/index.js +1 -1
  24. package/dist/combobox/index.js.map +1 -1
  25. package/dist/combobox/index.mjs +39 -39
  26. package/dist/combobox/index.mjs.map +1 -1
  27. package/dist/dialog/index.js +1 -1
  28. package/dist/dialog/index.mjs +1 -1
  29. package/dist/drawer/index.js +1 -1
  30. package/dist/drawer/index.mjs +1 -1
  31. package/dist/dropdown/index.js +1 -1
  32. package/dist/dropdown/index.js.map +1 -1
  33. package/dist/dropdown/index.mjs +1 -1
  34. package/dist/dropdown/index.mjs.map +1 -1
  35. package/dist/file-upload/index.js +1 -1
  36. package/dist/file-upload/index.mjs +2 -2
  37. package/dist/icon-button/index.js +1 -1
  38. package/dist/icon-button/index.mjs +1 -1
  39. package/dist/input/index.js +1 -1
  40. package/dist/input/index.js.map +1 -1
  41. package/dist/input/index.mjs +6 -6
  42. package/dist/input/index.mjs.map +1 -1
  43. package/dist/pagination/index.js +1 -1
  44. package/dist/pagination/index.mjs +2 -2
  45. package/dist/popover/index.js +1 -1
  46. package/dist/popover/index.mjs +1 -1
  47. package/dist/radio-group/index.js +1 -1
  48. package/dist/radio-group/index.js.map +1 -1
  49. package/dist/radio-group/index.mjs +7 -7
  50. package/dist/radio-group/index.mjs.map +1 -1
  51. package/dist/scrolling-list/index.js +1 -1
  52. package/dist/scrolling-list/index.mjs +2 -2
  53. package/dist/select/index.js +1 -1
  54. package/dist/select/index.js.map +1 -1
  55. package/dist/select/index.mjs +1 -1
  56. package/dist/select/index.mjs.map +1 -1
  57. package/dist/snackbar/index.js +1 -1
  58. package/dist/snackbar/index.mjs +2 -2
  59. package/dist/stepper/index.js +1 -1
  60. package/dist/stepper/index.mjs +1 -1
  61. package/dist/tabs/index.js +1 -1
  62. package/dist/tabs/index.mjs +2 -2
  63. package/dist/tag/index.js +1 -1
  64. package/dist/tag/index.js.map +1 -1
  65. package/dist/tag/index.mjs +6 -6
  66. package/dist/tag/index.mjs.map +1 -1
  67. package/dist/textarea/index.js +1 -1
  68. package/dist/textarea/index.js.map +1 -1
  69. package/dist/textarea/index.mjs +14 -10
  70. package/dist/textarea/index.mjs.map +1 -1
  71. package/dist/toast/index.js +1 -1
  72. package/dist/toast/index.mjs +2 -2
  73. package/package.json +4 -4
  74. package/dist/IconButton-D5fk89W-.js +0 -2
  75. package/dist/IconButton-D5fk89W-.js.map +0 -1
  76. package/dist/IconButton-Mv9tO1ZH.mjs.map +0 -1
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),i=require("radix-ui"),c=require("react"),l=require("class-variance-authority"),V=require("@spark-ui/icons/Close"),E=require("../Icon-CF0W0LKr.js"),S=require("../IconButton-D5fk89W-.js"),y=c.createContext(null),W=":popover",$=({children:e,intent:o})=>{const[r,t]=c.useState(null);return a.jsx(y.Provider,{value:{headerId:r,setHeaderId:t,intent:o},children:e})},u=()=>{const e=c.useContext(y);if(!e)throw Error("usePopover must be used within a Popover provider");return e},N=({children:e,intent:o="surface",modal:r=!1,...t})=>a.jsx($,{intent:o,children:a.jsx(i.Popover.Root,{"data-spark-component":"popover",modal:r,...t,children:e})});N.displayName="Popover";const v=({asChild:e=!1,children:o,ref:r,...t})=>a.jsx(i.Popover.Anchor,{"data-spark-component":"popover-anchor",ref:r,asChild:e,...t,children:o});v.displayName="Popover.Anchor";const f=({asChild:e=!1,width:o=16,height:r=8,className:t,ref:n,...s})=>{const{intent:p}=u(),d=l.cva("visible",{variants:{intent:{surface:"fill-surface",main:"fill-main-container",support:"fill-support-container",accent:"fill-accent-container",basic:"fill-basic-container",success:"fill-success-container",alert:"fill-alert-container",danger:"fill-error-container",info:"fill-info-container",neutral:"fill-neutral-container"}},defaultVariants:{intent:"surface"}});return a.jsx(i.Popover.Arrow,{"data-spark-component":"popover-arrow",ref:n,className:d({intent:p,className:t}),asChild:e,width:o,height:r,...s})};f.displayName="Popover.Arrow";const m=({"aria-label":e,className:o,ref:r,...t})=>a.jsx(i.Popover.Close,{"data-spark-component":"popover-close-button",ref:r,className:l.cx("right-lg top-md absolute",o),asChild:!0,...t,children:a.jsx(S.IconButton,{size:"sm",intent:"neutral",design:"ghost","aria-label":e,children:a.jsx(E.Icon,{children:a.jsx(V.Close,{})})})});m.displayName="Popover.CloseButton";const O=l.cva(["rounded-md","shadow-sm","focus-visible:outline-hidden focus-visible:u-outline","max-h-(--radix-popper-available-height) overflow-y-auto"],{variants:{intent:{surface:"bg-surface text-on-surface",main:"bg-main-container text-on-main-container",support:"bg-support-container text-on-support-container",accent:"bg-accent-container text-on-accent-container",basic:"bg-basic-container text-on-basic-container",success:"bg-success-container text-on-success-container",alert:"bg-alert-container text-on-alert-container",danger:"bg-error-container text-on-error-container",info:"bg-info-container text-on-info-container",neutral:"bg-neutral-container text-on-neutral-container"},matchTriggerWidth:{true:"w-(--radix-popper-anchor-width)"},enforceBoundaries:{true:["max-w-(--radix-popper-available-width)"]},inset:{true:"overflow-hidden",false:"p-lg"},elevation:{dropdown:"z-dropdown",popover:"z-popover"}},compoundVariants:[{inset:!1,class:"has-data-[spark-component=popover-close-button]:pr-3xl"},{enforceBoundaries:!1,matchTriggerWidth:!1,class:"max-w-[min(var(--spacing-sz-384),100vw)]"}],defaultVariants:{matchTriggerWidth:!1,enforceBoundaries:!1,inset:!1,intent:"surface",elevation:"popover"}}),x=({className:e,children:o,matchTriggerWidth:r=!1,align:t="center",arrowPadding:n=16,asChild:s=!1,avoidCollisions:p=!0,"aria-labelledby":d,collisionBoundary:b,collisionPadding:j=0,hideWhenDetached:C=!1,side:I="bottom",sideOffset:A=8,sticky:B="partial",inset:T=!1,elevation:k="popover",ref:q,...H})=>{const{headerId:z,intent:R}=u();return a.jsx(i.Popover.Content,{"aria-labelledby":z||d,className:O({enforceBoundaries:!!b,matchTriggerWidth:r,inset:T,elevation:k,intent:R,className:e}),"data-spark-component":"popover-content",ref:q,align:t,arrowPadding:n,asChild:s,avoidCollisions:p,collisionBoundary:b,collisionPadding:j,hideWhenDetached:C,side:I,sideOffset:A,sticky:B,...H,children:o})};x.displayName="Popover.Content";const P=({children:e,className:o,ref:r,...t})=>{const n=`${W}-header-${c.useId()}`,{setHeaderId:s}=u();return c.useLayoutEffect(()=>(s(n),()=>s(null)),[n,s]),a.jsx("header",{id:n,ref:r,className:l.cx("mb-md text-headline-2",o),...t,children:e})};P.displayName="Popover.Header";const g=({children:e,...o})=>a.jsx(i.Popover.Portal,{...o,children:e});g.displayName="Popover.Portal";const h=({asChild:e=!1,children:o,ref:r,...t})=>a.jsx(i.Popover.Trigger,{"data-spark-component":"popover-trigger",ref:r,asChild:e,...t,children:o});h.displayName="Popover.Trigger";const w=Object.assign(N,{Anchor:v,Arrow:f,CloseButton:m,Content:x,Header:P,Portal:g,Trigger:h});w.displayName="Popover";v.displayName="Popover.Anchor";f.displayName="Popover.Arrow";m.displayName="Popover.CloseButton";x.displayName="Popover.Content";P.displayName="Popover.Header";g.displayName="Popover.Portal";h.displayName="Popover.Trigger";exports.Popover=w;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),i=require("radix-ui"),c=require("react"),l=require("class-variance-authority"),V=require("@spark-ui/icons/Close"),E=require("../Icon-CF0W0LKr.js"),S=require("../IconButton-D3g86WpZ.js"),y=c.createContext(null),W=":popover",$=({children:e,intent:o})=>{const[r,t]=c.useState(null);return a.jsx(y.Provider,{value:{headerId:r,setHeaderId:t,intent:o},children:e})},u=()=>{const e=c.useContext(y);if(!e)throw Error("usePopover must be used within a Popover provider");return e},N=({children:e,intent:o="surface",modal:r=!1,...t})=>a.jsx($,{intent:o,children:a.jsx(i.Popover.Root,{"data-spark-component":"popover",modal:r,...t,children:e})});N.displayName="Popover";const v=({asChild:e=!1,children:o,ref:r,...t})=>a.jsx(i.Popover.Anchor,{"data-spark-component":"popover-anchor",ref:r,asChild:e,...t,children:o});v.displayName="Popover.Anchor";const f=({asChild:e=!1,width:o=16,height:r=8,className:t,ref:n,...s})=>{const{intent:p}=u(),d=l.cva("visible",{variants:{intent:{surface:"fill-surface",main:"fill-main-container",support:"fill-support-container",accent:"fill-accent-container",basic:"fill-basic-container",success:"fill-success-container",alert:"fill-alert-container",danger:"fill-error-container",info:"fill-info-container",neutral:"fill-neutral-container"}},defaultVariants:{intent:"surface"}});return a.jsx(i.Popover.Arrow,{"data-spark-component":"popover-arrow",ref:n,className:d({intent:p,className:t}),asChild:e,width:o,height:r,...s})};f.displayName="Popover.Arrow";const m=({"aria-label":e,className:o,ref:r,...t})=>a.jsx(i.Popover.Close,{"data-spark-component":"popover-close-button",ref:r,className:l.cx("right-lg top-md absolute",o),asChild:!0,...t,children:a.jsx(S.IconButton,{size:"sm",intent:"neutral",design:"ghost","aria-label":e,children:a.jsx(E.Icon,{children:a.jsx(V.Close,{})})})});m.displayName="Popover.CloseButton";const O=l.cva(["rounded-md","shadow-sm","focus-visible:outline-hidden focus-visible:u-outline","max-h-(--radix-popper-available-height) overflow-y-auto"],{variants:{intent:{surface:"bg-surface text-on-surface",main:"bg-main-container text-on-main-container",support:"bg-support-container text-on-support-container",accent:"bg-accent-container text-on-accent-container",basic:"bg-basic-container text-on-basic-container",success:"bg-success-container text-on-success-container",alert:"bg-alert-container text-on-alert-container",danger:"bg-error-container text-on-error-container",info:"bg-info-container text-on-info-container",neutral:"bg-neutral-container text-on-neutral-container"},matchTriggerWidth:{true:"w-(--radix-popper-anchor-width)"},enforceBoundaries:{true:["max-w-(--radix-popper-available-width)"]},inset:{true:"overflow-hidden",false:"p-lg"},elevation:{dropdown:"z-dropdown",popover:"z-popover"}},compoundVariants:[{inset:!1,class:"has-data-[spark-component=popover-close-button]:pr-3xl"},{enforceBoundaries:!1,matchTriggerWidth:!1,class:"max-w-[min(var(--spacing-sz-384),100vw)]"}],defaultVariants:{matchTriggerWidth:!1,enforceBoundaries:!1,inset:!1,intent:"surface",elevation:"popover"}}),x=({className:e,children:o,matchTriggerWidth:r=!1,align:t="center",arrowPadding:n=16,asChild:s=!1,avoidCollisions:p=!0,"aria-labelledby":d,collisionBoundary:b,collisionPadding:j=0,hideWhenDetached:C=!1,side:I="bottom",sideOffset:A=8,sticky:B="partial",inset:T=!1,elevation:k="popover",ref:q,...H})=>{const{headerId:z,intent:R}=u();return a.jsx(i.Popover.Content,{"aria-labelledby":z||d,className:O({enforceBoundaries:!!b,matchTriggerWidth:r,inset:T,elevation:k,intent:R,className:e}),"data-spark-component":"popover-content",ref:q,align:t,arrowPadding:n,asChild:s,avoidCollisions:p,collisionBoundary:b,collisionPadding:j,hideWhenDetached:C,side:I,sideOffset:A,sticky:B,...H,children:o})};x.displayName="Popover.Content";const P=({children:e,className:o,ref:r,...t})=>{const n=`${W}-header-${c.useId()}`,{setHeaderId:s}=u();return c.useLayoutEffect(()=>(s(n),()=>s(null)),[n,s]),a.jsx("header",{id:n,ref:r,className:l.cx("mb-md text-headline-2",o),...t,children:e})};P.displayName="Popover.Header";const g=({children:e,...o})=>a.jsx(i.Popover.Portal,{...o,children:e});g.displayName="Popover.Portal";const h=({asChild:e=!1,children:o,ref:r,...t})=>a.jsx(i.Popover.Trigger,{"data-spark-component":"popover-trigger",ref:r,asChild:e,...t,children:o});h.displayName="Popover.Trigger";const w=Object.assign(N,{Anchor:v,Arrow:f,CloseButton:m,Content:x,Header:P,Portal:g,Trigger:h});w.displayName="Popover";v.displayName="Popover.Anchor";f.displayName="Popover.Arrow";m.displayName="Popover.CloseButton";x.displayName="Popover.Content";P.displayName="Popover.Header";g.displayName="Popover.Portal";h.displayName="Popover.Trigger";exports.Popover=w;
2
2
  //# sourceMappingURL=index.js.map
@@ -4,7 +4,7 @@ import { createContext as V, useState as W, useContext as j, useId as R, useLayo
4
4
  import { cva as P, cx as x } from "class-variance-authority";
5
5
  import { Close as F } from "@spark-ui/icons/Close";
6
6
  import { I as L } from "../Icon-C23-htlD.mjs";
7
- import { I as O } from "../IconButton-Mv9tO1ZH.mjs";
7
+ import { I as O } from "../IconButton-Bfd-6BAD.mjs";
8
8
  const y = V(null), S = ":popover", X = ({
9
9
  children: e,
10
10
  intent: o
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),d=require("class-variance-authority"),s=require("react"),G=require("@spark-ui/components/form-field"),p=require("radix-ui"),y=require("@spark-ui/internal-utils"),k=s.createContext(null),w=()=>{const e=s.useContext(k);if(!e)throw Error("useRadioGroup must be used within a RadioGroup provider");return e},V=d.cva(["relative block","size-3/5","after:absolute","after:left-1/2 after:top-1/2 after:-translate-x-1/2 after:-translate-y-1/2","after:h-0","after:w-0","after:block","after:rounded-[50%]","after:content-['']","after:transition-all","data-[state=checked]:after:size-full"],{variants:{intent:y.makeVariants({main:["after:bg-main"],support:["after:bg-support"],accent:["after:bg-accent"],basic:["after:bg-basic"],neutral:["after:bg-neutral"],success:["after:bg-success"],alert:["after:bg-alert"],error:["after:bg-error"],info:["after:bg-info"]})},defaultVariants:{intent:"basic"}}),I=({intent:e,className:r,ref:t,...o})=>a.jsx(p.RadioGroup.Indicator,{ref:t,className:V({intent:e,className:r}),...o});I.displayName="RadioGroup.RadioIndicator";const L=d.cva(["flex shrink-0 items-center justify-center","rounded-full","border-md","outline-hidden","hover:ring-4","focus-visible:u-outline","disabled:cursor-not-allowed disabled:border-outline/dim-2 disabled:hover:ring-transparent","u-shadow-border-transition","size-sz-24"],{variants:{intent:y.makeVariants({main:["border-outline","data-[state=checked]:border-main","hover:ring-main-container"],support:["border-outline","data-[state=checked]:border-support","hover:ring-support-container"],accent:["border-outline","data-[state=checked]:border-accent","hover:ring-accent-container"],basic:["border-outline","data-[state=checked]:border-basic","hover:ring-basic-container"],neutral:["border-outline","data-[state=checked]:border-neutral","hover:ring-neutral-container"],info:["border-info","data-[state=checked]:border-info","hover:ring-info-container"],success:["border-success","data-[state=checked]:border-success","hover:ring-success-container"],alert:["border-alert","data-[state=checked]:border-alert","hover:ring-alert-container"],error:["border-error","data-[state=checked]:border-error","hover:ring-error-container"]})},defaultVariants:{intent:"basic"}}),j=({intent:e,className:r,ref:t,...o})=>{const{state:i}=G.useFormFieldControl(),n=i??e;return a.jsx(p.RadioGroup.RadioGroupItem,{"data-spark-component":"radio-input",ref:t,className:L({intent:n,className:r}),...o,children:a.jsx(I,{intent:n,forceMount:!0})})};j.displayName="RadioGroup.RadioInput";const z=d.cva("grow",{variants:{disabled:{true:["text-neutral/dim-2","cursor-not-allowed"],false:["cursor-pointer"]}},defaultVariants:{disabled:!1}}),N=({disabled:e,...r})=>a.jsx(p.Label.Root,{"data-spark-component":"radio-label",className:z({disabled:e}),...r});N.displayName="RadioGroup.RadioLabel";const x=":radio",v=({className:e,children:r,id:t,disabled:o,ref:i,...n})=>{const c=`${x}-input-${s.useId()}`,l=`${x}-label-${s.useId()}`,{intent:f,disabled:m,reverse:R}=w(),u=r&&a.jsx(N,{disabled:o||m,htmlFor:t||c,id:l,children:r}),b=a.jsx(j,{ref:i,id:t||c,intent:f,"aria-labelledby":r?l:void 0,...n,disabled:o}),h=R?a.jsxs(a.Fragment,{children:[u,b]}):a.jsxs(a.Fragment,{children:[b,u]});return a.jsx("div",{className:d.cx("gap-md text-body-1 flex items-start",e),children:h})};v.displayName="RadioGroup.Radio";const C=d.cva(["flex"],{variants:{orientation:{vertical:["flex-col","gap-lg"],horizontal:["flex-row","gap-xl"]}}}),S=({intent:e,disabled:r,reverse:t,children:o})=>{const i=s.useMemo(()=>({intent:e,disabled:r,reverse:t}),[e,r,t]);return a.jsx(k.Provider,{value:i,children:o})},q=({orientation:e="vertical",loop:r=!0,intent:t="basic",disabled:o,className:i,required:n,reverse:c=!1,ref:l,...f})=>{const{labelId:m,isInvalid:R,isRequired:u,description:b,name:h}=G.useFormFieldControl(),g=n!==void 0?n:u;return a.jsx(S,{reverse:c,intent:t,disabled:o,children:a.jsx(p.RadioGroup.RadioGroup,{"data-spark-component":"radio-group",className:C({orientation:e,className:i}),name:h,ref:l,disabled:o,orientation:e,loop:r,required:g,"aria-labelledby":m,"aria-invalid":R,"aria-required":g,"aria-describedby":b,...f})})};q.displayName="RadioGroup";const F=Object.assign(q,{Radio:v});F.displayName="RadioGroup";v.displayName="RadioGroup.Radio";exports.RadioGroup=F;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),d=require("class-variance-authority"),s=require("react"),G=require("@spark-ui/components/form-field"),p=require("radix-ui"),y=require("@spark-ui/internal-utils"),k=s.createContext(null),w=()=>{const e=s.useContext(k);if(!e)throw Error("useRadioGroup must be used within a RadioGroup provider");return e},V=d.cva(["relative block","size-3/5","after:absolute","after:left-1/2 after:top-1/2 after:-translate-x-1/2 after:-translate-y-1/2","after:h-0","after:w-0","after:block","after:rounded-[50%]","after:content-['']","after:transition-all","data-[state=checked]:after:size-full"],{variants:{intent:y.makeVariants({main:["after:bg-main"],support:["after:bg-support"],accent:["after:bg-accent"],basic:["after:bg-basic"],neutral:["after:bg-neutral"],success:["after:bg-success"],alert:["after:bg-alert"],error:["after:bg-error"],info:["after:bg-info"]})},defaultVariants:{intent:"basic"}}),I=({intent:e,className:r,ref:t,...o})=>a.jsx(p.RadioGroup.Indicator,{ref:t,className:V({intent:e,className:r}),...o});I.displayName="RadioGroup.RadioIndicator";const L=d.cva(["flex shrink-0 items-center justify-center","rounded-full","border-md","outline-hidden","hover:ring-4","focus-visible:u-outline","disabled:cursor-not-allowed disabled:border-outline/dim-2 disabled:hover:ring-transparent","u-shadow-border-transition","size-sz-24"],{variants:{intent:y.makeVariants({main:["border-outline","data-[state=checked]:border-main","hover:ring-main-container"],support:["border-outline","data-[state=checked]:border-support","hover:ring-support-container"],accent:["border-outline","data-[state=checked]:border-accent","hover:ring-accent-container"],basic:["border-outline","data-[state=checked]:border-basic","hover:ring-basic-container"],neutral:["border-outline","data-[state=checked]:border-neutral","hover:ring-neutral-container"],info:["border-info","data-[state=checked]:border-info","hover:ring-info-container"],success:["border-success","data-[state=checked]:border-success","hover:ring-success-container"],alert:["border-alert","data-[state=checked]:border-alert","hover:ring-alert-container"],error:["border-error","data-[state=checked]:border-error","hover:ring-error-container"]})},defaultVariants:{intent:"basic"}}),j=({intent:e,className:r,ref:t,...o})=>{const{state:i}=G.useFormFieldControl(),n=i??e;return a.jsx(p.RadioGroup.RadioGroupItem,{"data-spark-component":"radio-input",ref:t,className:L({intent:n,className:r}),...o,children:a.jsx(I,{intent:n,forceMount:!0})})};j.displayName="RadioGroup.RadioInput";const z=d.cva("grow",{variants:{disabled:{true:["text-neutral/dim-2","cursor-not-allowed"],false:["cursor-pointer"]}},defaultVariants:{disabled:!1}}),N=({disabled:e,...r})=>a.jsx(p.Label.Root,{"data-spark-component":"radio-label",className:z({disabled:e}),...r});N.displayName="RadioGroup.RadioLabel";const x=":radio",v=({className:e,children:r,id:t,disabled:o,ref:i,...n})=>{const c=`${x}-input-${s.useId()}`,l=`${x}-label-${s.useId()}`,{intent:f,disabled:m,reverse:R}=w(),u=r&&a.jsx(N,{disabled:o||m,htmlFor:t||c,id:l,children:r}),b=a.jsx(j,{ref:i,id:t||c,intent:f,"aria-labelledby":r?l:void 0,...n,disabled:o}),h=R?a.jsxs(a.Fragment,{children:[u,b]}):a.jsxs(a.Fragment,{children:[b,u]});return a.jsx("span",{className:d.cx("gap-md text-body-1 flex items-start",e),children:h})};v.displayName="RadioGroup.Radio";const C=d.cva(["flex"],{variants:{orientation:{vertical:["flex-col","gap-lg"],horizontal:["flex-row","gap-xl"]}}}),S=({intent:e,disabled:r,reverse:t,children:o})=>{const i=s.useMemo(()=>({intent:e,disabled:r,reverse:t}),[e,r,t]);return a.jsx(k.Provider,{value:i,children:o})},q=({orientation:e="vertical",loop:r=!0,intent:t="basic",disabled:o,className:i,required:n,reverse:c=!1,ref:l,...f})=>{const{labelId:m,isInvalid:R,isRequired:u,description:b,name:h}=G.useFormFieldControl(),g=n!==void 0?n:u;return a.jsx(S,{reverse:c,intent:t,disabled:o,children:a.jsx(p.RadioGroup.RadioGroup,{"data-spark-component":"radio-group",className:C({orientation:e,className:i}),name:h,ref:l,disabled:o,orientation:e,loop:r,required:g,"aria-labelledby":m,"aria-invalid":R,"aria-required":g,"aria-describedby":b,...f})})};q.displayName="RadioGroup";const F=Object.assign(q,{Radio:v});F.displayName="RadioGroup";v.displayName="RadioGroup.Radio";exports.RadioGroup=F;
2
2
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../../src/radio-group/RadioGroupContext.tsx","../../src/radio-group/RadioIndicator.styles.ts","../../src/radio-group/RadioIndicator.tsx","../../src/radio-group/RadioInput.styles.ts","../../src/radio-group/RadioInput.tsx","../../src/radio-group/RadioLabel.styles.tsx","../../src/radio-group/RadioLabel.tsx","../../src/radio-group/Radio.tsx","../../src/radio-group/RadioGroup.styles.ts","../../src/radio-group/RadioGroupProvider.tsx","../../src/radio-group/RadioGroup.tsx","../../src/radio-group/index.ts"],"sourcesContent":["import { createContext, useContext } from 'react'\n\nimport type { RadioGroupProps } from './RadioGroup'\nimport type { RadioInputProps } from './RadioInput'\n\nexport type RadioGroupContextState = Pick<RadioInputProps, 'intent' | 'disabled'> &\n Pick<RadioGroupProps, 'reverse'>\n\nexport const RadioGroupContext = createContext<RadioGroupContextState | null>(null)\n\nexport const useRadioGroup = () => {\n const context = useContext(RadioGroupContext)\n\n if (!context) {\n throw Error('useRadioGroup must be used within a RadioGroup provider')\n }\n\n return context\n}\n","import { makeVariants } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nexport const radioIndicatorStyles = cva(\n [\n 'relative block',\n 'size-3/5',\n 'after:absolute',\n 'after:left-1/2 after:top-1/2 after:-translate-x-1/2 after:-translate-y-1/2',\n 'after:h-0',\n 'after:w-0',\n 'after:block',\n 'after:rounded-[50%]',\n \"after:content-['']\",\n 'after:transition-all',\n 'data-[state=checked]:after:size-full',\n ],\n {\n variants: {\n intent: makeVariants<\n 'intent',\n ['main', 'support', 'accent', 'basic', 'success', 'alert', 'error', 'info', 'neutral']\n >({\n main: ['after:bg-main'],\n support: ['after:bg-support'],\n accent: ['after:bg-accent'],\n basic: ['after:bg-basic'],\n neutral: ['after:bg-neutral'],\n success: ['after:bg-success'],\n alert: ['after:bg-alert'],\n error: ['after:bg-error'],\n info: ['after:bg-info'],\n }),\n },\n defaultVariants: {\n intent: 'basic',\n },\n }\n)\n\nexport type RadioIndicatorStylesProps = VariantProps<typeof radioIndicatorStyles>\n","import { RadioGroup as RadixRadioGroup } from 'radix-ui'\nimport { Ref } from 'react'\n\nimport { radioIndicatorStyles, RadioIndicatorStylesProps } from './RadioIndicator.styles'\n\nexport interface RadioIndicatorProps extends RadioIndicatorStylesProps {\n className?: string\n /**\n * Change the component to the HTML tag or custom component of the only child.\n */\n asChild?: boolean\n /**\n * Used to force mounting when more control is needed. Useful when controlling animation with React animation libraries.\n */\n forceMount?: true | undefined\n ref?: Ref<HTMLSpanElement>\n}\n\nexport const RadioIndicator = ({ intent, className, ref, ...others }: RadioIndicatorProps) => {\n return (\n <RadixRadioGroup.Indicator\n ref={ref}\n className={radioIndicatorStyles({ intent, className })}\n {...others}\n />\n )\n}\n\nRadioIndicator.displayName = 'RadioGroup.RadioIndicator'\n","import { makeVariants } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nexport const radioInputVariants = cva(\n [\n 'flex shrink-0 items-center justify-center',\n 'rounded-full',\n 'border-md',\n 'outline-hidden',\n 'hover:ring-4',\n 'focus-visible:u-outline',\n 'disabled:cursor-not-allowed disabled:border-outline/dim-2 disabled:hover:ring-transparent',\n 'u-shadow-border-transition',\n 'size-sz-24',\n ],\n {\n variants: {\n /**\n * Color scheme of the radio input.\n */\n intent: makeVariants<\n 'intent',\n ['main', 'support', 'accent', 'basic', 'success', 'alert', 'error', 'info', 'neutral']\n >({\n main: ['border-outline', 'data-[state=checked]:border-main', 'hover:ring-main-container'],\n support: [\n 'border-outline',\n 'data-[state=checked]:border-support',\n 'hover:ring-support-container',\n ],\n accent: [\n 'border-outline',\n 'data-[state=checked]:border-accent',\n 'hover:ring-accent-container',\n ],\n basic: [\n 'border-outline',\n 'data-[state=checked]:border-basic',\n 'hover:ring-basic-container',\n ],\n neutral: [\n 'border-outline',\n 'data-[state=checked]:border-neutral',\n 'hover:ring-neutral-container',\n ],\n info: ['border-info', 'data-[state=checked]:border-info', 'hover:ring-info-container'],\n success: [\n 'border-success',\n 'data-[state=checked]:border-success',\n 'hover:ring-success-container',\n ],\n alert: ['border-alert', 'data-[state=checked]:border-alert', 'hover:ring-alert-container'],\n error: ['border-error', 'data-[state=checked]:border-error', 'hover:ring-error-container'],\n }),\n },\n defaultVariants: {\n intent: 'basic',\n },\n }\n)\n\nexport type RadioInputVariantsProps = VariantProps<typeof radioInputVariants>\n","import { useFormFieldControl } from '@spark-ui/components/form-field'\nimport { RadioGroup as RadixRadioGroup } from 'radix-ui'\nimport { ButtonHTMLAttributes, Ref } from 'react'\n\nimport { RadioIndicator } from './RadioIndicator'\nimport { radioInputVariants, RadioInputVariantsProps } from './RadioInput.styles'\n\nexport interface RadioInputProps\n extends RadioInputVariantsProps,\n Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'value' | 'onChange'> {\n /**\n * Change the component to the HTML tag or custom component of the only child.\n */\n asChild?: boolean\n /**\n * The value given as data when submitted with a name.\n */\n value: string\n /**\n * When true, prevents the user from interacting with the radio item.\n */\n disabled?: boolean\n /**\n * When true, indicates that the user must check the radio item before the owning form can be submitted.\n */\n required?: boolean\n ref?: Ref<HTMLButtonElement>\n}\n\nexport const RadioInput = ({ intent: intentProp, className, ref, ...others }: RadioInputProps) => {\n const { state } = useFormFieldControl()\n\n const intent = state ?? intentProp\n\n return (\n <RadixRadioGroup.RadioGroupItem\n data-spark-component=\"radio-input\"\n ref={ref}\n className={radioInputVariants({ intent, className })}\n {...others}\n >\n <RadioIndicator intent={intent} forceMount />\n </RadixRadioGroup.RadioGroupItem>\n )\n}\n\nRadioInput.displayName = 'RadioGroup.RadioInput'\n","import { cva, VariantProps } from 'class-variance-authority'\n\nexport const radioLabelStyles = cva('grow', {\n variants: {\n disabled: {\n true: ['text-neutral/dim-2', 'cursor-not-allowed'],\n false: ['cursor-pointer'],\n },\n },\n defaultVariants: {\n disabled: false,\n },\n})\n\nexport type RadioLabelStylesProps = VariantProps<typeof radioLabelStyles>\n","import { Label } from 'radix-ui'\nimport type { HTMLAttributes, PropsWithChildren } from 'react'\n\nimport { radioLabelStyles, RadioLabelStylesProps } from './RadioLabel.styles'\n\nexport interface RadioLabelProps\n extends RadioLabelStylesProps,\n PropsWithChildren<HTMLAttributes<HTMLLabelElement>> {\n /**\n * Change the component to the HTML tag or custom component of the only child.\n */\n asChild?: boolean\n /**\n * The id of the element the label is associated with.\n */\n htmlFor?: string\n /**\n * When true, prevents the user from interacting with the radio item.\n */\n disabled?: boolean\n}\n\nexport const RadioLabel = ({ disabled, ...others }: RadioLabelProps) => {\n return (\n <Label.Root\n data-spark-component=\"radio-label\"\n className={radioLabelStyles({ disabled })}\n {...others}\n />\n )\n}\n\nRadioLabel.displayName = 'RadioGroup.RadioLabel'\n","import { cx } from 'class-variance-authority'\nimport { Ref, useId } from 'react'\n\nimport { useRadioGroup } from './RadioGroupContext'\nimport { RadioInput, RadioInputProps } from './RadioInput'\nimport { RadioLabel } from './RadioLabel'\n\nexport type RadioProps = RadioInputProps & {\n ref?: Ref<HTMLButtonElement>\n}\n\nconst ID_PREFIX = ':radio'\n\nexport const Radio = ({\n className,\n children,\n id,\n disabled: disabledProp,\n ref,\n ...others\n}: RadioProps) => {\n const innerId = `${ID_PREFIX}-input-${useId()}`\n const innerLabelId = `${ID_PREFIX}-label-${useId()}`\n\n const { intent, disabled, reverse } = useRadioGroup()\n\n const radioLabel = children && (\n <RadioLabel disabled={disabledProp || disabled} htmlFor={id || innerId} id={innerLabelId}>\n {children}\n </RadioLabel>\n )\n\n const radioInput = (\n <RadioInput\n ref={ref}\n id={id || innerId}\n intent={intent}\n aria-labelledby={children ? innerLabelId : undefined}\n {...others}\n disabled={disabledProp}\n />\n )\n\n const content = reverse ? (\n <>\n {radioLabel}\n {radioInput}\n </>\n ) : (\n <>\n {radioInput}\n {radioLabel}\n </>\n )\n\n return <div className={cx('gap-md text-body-1 flex items-start', className)}>{content}</div>\n}\n\nRadio.displayName = 'RadioGroup.Radio'\n","import { cva, VariantProps } from 'class-variance-authority'\n\nexport const radioGroupStyles = cva(['flex'], {\n variants: {\n orientation: {\n vertical: ['flex-col', 'gap-lg'],\n horizontal: ['flex-row', 'gap-xl'],\n },\n },\n})\n\nexport type RadioGroupVariantsProps = VariantProps<typeof radioGroupStyles>\n","import { ReactNode, useMemo } from 'react'\n\nimport type { RadioGroupProps } from './RadioGroup'\nimport { RadioGroupContext } from './RadioGroupContext'\nimport type { RadioInputProps } from './RadioInput'\n\nexport interface RadioGroupProviderProps\n extends Pick<RadioInputProps, 'intent' | 'disabled'>,\n Pick<RadioGroupProps, 'reverse'> {\n children: ReactNode\n}\n\nexport const RadioGroupProvider = ({\n intent,\n disabled,\n reverse,\n children,\n}: RadioGroupProviderProps) => {\n const value = useMemo(() => ({ intent, disabled, reverse }), [intent, disabled, reverse])\n\n return <RadioGroupContext.Provider value={value}>{children}</RadioGroupContext.Provider>\n}\n","import { useFormFieldControl } from '@spark-ui/components/form-field'\nimport { RadioGroup as RadixRadioGroup } from 'radix-ui'\nimport { HTMLAttributes, Ref } from 'react'\n\nimport { radioGroupStyles, RadioGroupVariantsProps } from './RadioGroup.styles'\nimport { RadioGroupProvider } from './RadioGroupProvider'\nimport { RadioInputVariantsProps } from './RadioInput.styles'\n\nexport interface RadioGroupProps\n extends RadioGroupVariantsProps,\n Pick<RadioInputVariantsProps, 'intent'>,\n Omit<HTMLAttributes<HTMLDivElement>, 'value' | 'defaultValue' | 'dir' | 'onChange'> {\n /**\n * Change the component to the HTML tag or custom component of the only child.\n */\n asChild?: boolean\n /**\n * The value of the radio item that should be checked when initially rendered. Use when you do not need to control the state of the radio items.\n */\n defaultValue?: string\n /**\n * The controlled value of the radio item to check. Should be used in conjunction with onValueChange.\n */\n value?: string\n /**\n * Event handler called when the value changes.\n */\n onValueChange?: (value: string) => void\n /**\n * When true, prevents the user from interacting with radio items.\n */\n disabled?: boolean\n /**\n * The name of the group. Submitted with its owning form as part of a name/value pair.\n */\n name?: string\n /**\n * When true, indicates that the user must check a radio item before the owning form can be submitted.\n */\n required?: boolean\n /**\n * The orientation of the component.\n */\n orientation?: 'horizontal' | 'vertical'\n /**\n * The reading direction of the radio group.\n */\n dir?: 'ltr' | 'rtl'\n /**\n * When true, keyboard navigation will loop from last item to first, and vice versa.\n */\n loop?: boolean\n /**\n * When true, the label will be placed on the left side of the Radio\n */\n reverse?: boolean\n ref?: Ref<HTMLDivElement>\n}\n\nexport const RadioGroup = ({\n orientation = 'vertical',\n loop = true,\n intent = 'basic',\n disabled,\n className,\n required: requiredProp,\n reverse = false,\n ref,\n ...others\n}: RadioGroupProps) => {\n const { labelId, isInvalid, isRequired, description, name } = useFormFieldControl()\n const required = requiredProp !== undefined ? requiredProp : isRequired\n\n return (\n <RadioGroupProvider reverse={reverse} intent={intent} disabled={disabled}>\n <RadixRadioGroup.RadioGroup\n data-spark-component=\"radio-group\"\n className={radioGroupStyles({ orientation, className })}\n name={name}\n ref={ref}\n disabled={disabled}\n orientation={orientation}\n loop={loop}\n required={required}\n aria-labelledby={labelId}\n aria-invalid={isInvalid}\n aria-required={required}\n aria-describedby={description}\n {...others}\n />\n </RadioGroupProvider>\n )\n}\n\nRadioGroup.displayName = 'RadioGroup'\n","import { Radio } from './Radio'\nimport { RadioGroup as Root } from './RadioGroup'\n\nexport const RadioGroup: typeof Root & {\n Radio: typeof Radio\n} = Object.assign(Root, {\n Radio,\n})\n\nRadioGroup.displayName = 'RadioGroup'\nRadio.displayName = 'RadioGroup.Radio'\n\nexport { type RadioGroupProps } from './RadioGroup'\nexport { type RadioProps } from './Radio'\n"],"names":["RadioGroupContext","createContext","useRadioGroup","context","useContext","radioIndicatorStyles","cva","makeVariants","RadioIndicator","intent","className","ref","others","jsx","RadixRadioGroup","radioInputVariants","RadioInput","intentProp","state","useFormFieldControl","radioLabelStyles","RadioLabel","disabled","Label","ID_PREFIX","Radio","children","id","disabledProp","innerId","useId","innerLabelId","reverse","radioLabel","radioInput","content","jsxs","Fragment","cx","radioGroupStyles","RadioGroupProvider","value","useMemo","RadioGroup","orientation","loop","requiredProp","labelId","isInvalid","isRequired","description","name","required","Root"],"mappings":"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"}
1
+ {"version":3,"file":"index.js","sources":["../../src/radio-group/RadioGroupContext.tsx","../../src/radio-group/RadioIndicator.styles.ts","../../src/radio-group/RadioIndicator.tsx","../../src/radio-group/RadioInput.styles.ts","../../src/radio-group/RadioInput.tsx","../../src/radio-group/RadioLabel.styles.tsx","../../src/radio-group/RadioLabel.tsx","../../src/radio-group/Radio.tsx","../../src/radio-group/RadioGroup.styles.ts","../../src/radio-group/RadioGroupProvider.tsx","../../src/radio-group/RadioGroup.tsx","../../src/radio-group/index.ts"],"sourcesContent":["import { createContext, useContext } from 'react'\n\nimport type { RadioGroupProps } from './RadioGroup'\nimport type { RadioInputProps } from './RadioInput'\n\nexport type RadioGroupContextState = Pick<RadioInputProps, 'intent' | 'disabled'> &\n Pick<RadioGroupProps, 'reverse'>\n\nexport const RadioGroupContext = createContext<RadioGroupContextState | null>(null)\n\nexport const useRadioGroup = () => {\n const context = useContext(RadioGroupContext)\n\n if (!context) {\n throw Error('useRadioGroup must be used within a RadioGroup provider')\n }\n\n return context\n}\n","import { makeVariants } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nexport const radioIndicatorStyles = cva(\n [\n 'relative block',\n 'size-3/5',\n 'after:absolute',\n 'after:left-1/2 after:top-1/2 after:-translate-x-1/2 after:-translate-y-1/2',\n 'after:h-0',\n 'after:w-0',\n 'after:block',\n 'after:rounded-[50%]',\n \"after:content-['']\",\n 'after:transition-all',\n 'data-[state=checked]:after:size-full',\n ],\n {\n variants: {\n intent: makeVariants<\n 'intent',\n ['main', 'support', 'accent', 'basic', 'success', 'alert', 'error', 'info', 'neutral']\n >({\n main: ['after:bg-main'],\n support: ['after:bg-support'],\n accent: ['after:bg-accent'],\n basic: ['after:bg-basic'],\n neutral: ['after:bg-neutral'],\n success: ['after:bg-success'],\n alert: ['after:bg-alert'],\n error: ['after:bg-error'],\n info: ['after:bg-info'],\n }),\n },\n defaultVariants: {\n intent: 'basic',\n },\n }\n)\n\nexport type RadioIndicatorStylesProps = VariantProps<typeof radioIndicatorStyles>\n","import { RadioGroup as RadixRadioGroup } from 'radix-ui'\nimport { Ref } from 'react'\n\nimport { radioIndicatorStyles, RadioIndicatorStylesProps } from './RadioIndicator.styles'\n\nexport interface RadioIndicatorProps extends RadioIndicatorStylesProps {\n className?: string\n /**\n * Change the component to the HTML tag or custom component of the only child.\n */\n asChild?: boolean\n /**\n * Used to force mounting when more control is needed. Useful when controlling animation with React animation libraries.\n */\n forceMount?: true | undefined\n ref?: Ref<HTMLSpanElement>\n}\n\nexport const RadioIndicator = ({ intent, className, ref, ...others }: RadioIndicatorProps) => {\n return (\n <RadixRadioGroup.Indicator\n ref={ref}\n className={radioIndicatorStyles({ intent, className })}\n {...others}\n />\n )\n}\n\nRadioIndicator.displayName = 'RadioGroup.RadioIndicator'\n","import { makeVariants } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nexport const radioInputVariants = cva(\n [\n 'flex shrink-0 items-center justify-center',\n 'rounded-full',\n 'border-md',\n 'outline-hidden',\n 'hover:ring-4',\n 'focus-visible:u-outline',\n 'disabled:cursor-not-allowed disabled:border-outline/dim-2 disabled:hover:ring-transparent',\n 'u-shadow-border-transition',\n 'size-sz-24',\n ],\n {\n variants: {\n /**\n * Color scheme of the radio input.\n */\n intent: makeVariants<\n 'intent',\n ['main', 'support', 'accent', 'basic', 'success', 'alert', 'error', 'info', 'neutral']\n >({\n main: ['border-outline', 'data-[state=checked]:border-main', 'hover:ring-main-container'],\n support: [\n 'border-outline',\n 'data-[state=checked]:border-support',\n 'hover:ring-support-container',\n ],\n accent: [\n 'border-outline',\n 'data-[state=checked]:border-accent',\n 'hover:ring-accent-container',\n ],\n basic: [\n 'border-outline',\n 'data-[state=checked]:border-basic',\n 'hover:ring-basic-container',\n ],\n neutral: [\n 'border-outline',\n 'data-[state=checked]:border-neutral',\n 'hover:ring-neutral-container',\n ],\n info: ['border-info', 'data-[state=checked]:border-info', 'hover:ring-info-container'],\n success: [\n 'border-success',\n 'data-[state=checked]:border-success',\n 'hover:ring-success-container',\n ],\n alert: ['border-alert', 'data-[state=checked]:border-alert', 'hover:ring-alert-container'],\n error: ['border-error', 'data-[state=checked]:border-error', 'hover:ring-error-container'],\n }),\n },\n defaultVariants: {\n intent: 'basic',\n },\n }\n)\n\nexport type RadioInputVariantsProps = VariantProps<typeof radioInputVariants>\n","import { useFormFieldControl } from '@spark-ui/components/form-field'\nimport { RadioGroup as RadixRadioGroup } from 'radix-ui'\nimport { ButtonHTMLAttributes, Ref } from 'react'\n\nimport { RadioIndicator } from './RadioIndicator'\nimport { radioInputVariants, RadioInputVariantsProps } from './RadioInput.styles'\n\nexport interface RadioInputProps\n extends RadioInputVariantsProps,\n Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'value' | 'onChange'> {\n /**\n * Change the component to the HTML tag or custom component of the only child.\n */\n asChild?: boolean\n /**\n * The value given as data when submitted with a name.\n */\n value: string\n /**\n * When true, prevents the user from interacting with the radio item.\n */\n disabled?: boolean\n /**\n * When true, indicates that the user must check the radio item before the owning form can be submitted.\n */\n required?: boolean\n ref?: Ref<HTMLButtonElement>\n}\n\nexport const RadioInput = ({ intent: intentProp, className, ref, ...others }: RadioInputProps) => {\n const { state } = useFormFieldControl()\n\n const intent = state ?? intentProp\n\n return (\n <RadixRadioGroup.RadioGroupItem\n data-spark-component=\"radio-input\"\n ref={ref}\n className={radioInputVariants({ intent, className })}\n {...others}\n >\n <RadioIndicator intent={intent} forceMount />\n </RadixRadioGroup.RadioGroupItem>\n )\n}\n\nRadioInput.displayName = 'RadioGroup.RadioInput'\n","import { cva, VariantProps } from 'class-variance-authority'\n\nexport const radioLabelStyles = cva('grow', {\n variants: {\n disabled: {\n true: ['text-neutral/dim-2', 'cursor-not-allowed'],\n false: ['cursor-pointer'],\n },\n },\n defaultVariants: {\n disabled: false,\n },\n})\n\nexport type RadioLabelStylesProps = VariantProps<typeof radioLabelStyles>\n","import { Label } from 'radix-ui'\nimport type { HTMLAttributes, PropsWithChildren } from 'react'\n\nimport { radioLabelStyles, RadioLabelStylesProps } from './RadioLabel.styles'\n\nexport interface RadioLabelProps\n extends RadioLabelStylesProps,\n PropsWithChildren<HTMLAttributes<HTMLLabelElement>> {\n /**\n * Change the component to the HTML tag or custom component of the only child.\n */\n asChild?: boolean\n /**\n * The id of the element the label is associated with.\n */\n htmlFor?: string\n /**\n * When true, prevents the user from interacting with the radio item.\n */\n disabled?: boolean\n}\n\nexport const RadioLabel = ({ disabled, ...others }: RadioLabelProps) => {\n return (\n <Label.Root\n data-spark-component=\"radio-label\"\n className={radioLabelStyles({ disabled })}\n {...others}\n />\n )\n}\n\nRadioLabel.displayName = 'RadioGroup.RadioLabel'\n","import { cx } from 'class-variance-authority'\nimport { Ref, useId } from 'react'\n\nimport { useRadioGroup } from './RadioGroupContext'\nimport { RadioInput, RadioInputProps } from './RadioInput'\nimport { RadioLabel } from './RadioLabel'\n\nexport type RadioProps = RadioInputProps & {\n ref?: Ref<HTMLButtonElement>\n}\n\nconst ID_PREFIX = ':radio'\n\nexport const Radio = ({\n className,\n children,\n id,\n disabled: disabledProp,\n ref,\n ...others\n}: RadioProps) => {\n const innerId = `${ID_PREFIX}-input-${useId()}`\n const innerLabelId = `${ID_PREFIX}-label-${useId()}`\n\n const { intent, disabled, reverse } = useRadioGroup()\n\n const radioLabel = children && (\n <RadioLabel disabled={disabledProp || disabled} htmlFor={id || innerId} id={innerLabelId}>\n {children}\n </RadioLabel>\n )\n\n const radioInput = (\n <RadioInput\n ref={ref}\n id={id || innerId}\n intent={intent}\n aria-labelledby={children ? innerLabelId : undefined}\n {...others}\n disabled={disabledProp}\n />\n )\n\n const content = reverse ? (\n <>\n {radioLabel}\n {radioInput}\n </>\n ) : (\n <>\n {radioInput}\n {radioLabel}\n </>\n )\n\n return <span className={cx('gap-md text-body-1 flex items-start', className)}>{content}</span>\n}\n\nRadio.displayName = 'RadioGroup.Radio'\n","import { cva, VariantProps } from 'class-variance-authority'\n\nexport const radioGroupStyles = cva(['flex'], {\n variants: {\n orientation: {\n vertical: ['flex-col', 'gap-lg'],\n horizontal: ['flex-row', 'gap-xl'],\n },\n },\n})\n\nexport type RadioGroupVariantsProps = VariantProps<typeof radioGroupStyles>\n","import { ReactNode, useMemo } from 'react'\n\nimport type { RadioGroupProps } from './RadioGroup'\nimport { RadioGroupContext } from './RadioGroupContext'\nimport type { RadioInputProps } from './RadioInput'\n\nexport interface RadioGroupProviderProps\n extends Pick<RadioInputProps, 'intent' | 'disabled'>,\n Pick<RadioGroupProps, 'reverse'> {\n children: ReactNode\n}\n\nexport const RadioGroupProvider = ({\n intent,\n disabled,\n reverse,\n children,\n}: RadioGroupProviderProps) => {\n const value = useMemo(() => ({ intent, disabled, reverse }), [intent, disabled, reverse])\n\n return <RadioGroupContext.Provider value={value}>{children}</RadioGroupContext.Provider>\n}\n","import { useFormFieldControl } from '@spark-ui/components/form-field'\nimport { RadioGroup as RadixRadioGroup } from 'radix-ui'\nimport { HTMLAttributes, Ref } from 'react'\n\nimport { radioGroupStyles, RadioGroupVariantsProps } from './RadioGroup.styles'\nimport { RadioGroupProvider } from './RadioGroupProvider'\nimport { RadioInputVariantsProps } from './RadioInput.styles'\n\nexport interface RadioGroupProps\n extends RadioGroupVariantsProps,\n Pick<RadioInputVariantsProps, 'intent'>,\n Omit<HTMLAttributes<HTMLDivElement>, 'value' | 'defaultValue' | 'dir' | 'onChange'> {\n /**\n * Change the component to the HTML tag or custom component of the only child.\n */\n asChild?: boolean\n /**\n * The value of the radio item that should be checked when initially rendered. Use when you do not need to control the state of the radio items.\n */\n defaultValue?: string\n /**\n * The controlled value of the radio item to check. Should be used in conjunction with onValueChange.\n */\n value?: string\n /**\n * Event handler called when the value changes.\n */\n onValueChange?: (value: string) => void\n /**\n * When true, prevents the user from interacting with radio items.\n */\n disabled?: boolean\n /**\n * The name of the group. Submitted with its owning form as part of a name/value pair.\n */\n name?: string\n /**\n * When true, indicates that the user must check a radio item before the owning form can be submitted.\n */\n required?: boolean\n /**\n * The orientation of the component.\n */\n orientation?: 'horizontal' | 'vertical'\n /**\n * The reading direction of the radio group.\n */\n dir?: 'ltr' | 'rtl'\n /**\n * When true, keyboard navigation will loop from last item to first, and vice versa.\n */\n loop?: boolean\n /**\n * When true, the label will be placed on the left side of the Radio\n */\n reverse?: boolean\n ref?: Ref<HTMLDivElement>\n}\n\nexport const RadioGroup = ({\n orientation = 'vertical',\n loop = true,\n intent = 'basic',\n disabled,\n className,\n required: requiredProp,\n reverse = false,\n ref,\n ...others\n}: RadioGroupProps) => {\n const { labelId, isInvalid, isRequired, description, name } = useFormFieldControl()\n const required = requiredProp !== undefined ? requiredProp : isRequired\n\n return (\n <RadioGroupProvider reverse={reverse} intent={intent} disabled={disabled}>\n <RadixRadioGroup.RadioGroup\n data-spark-component=\"radio-group\"\n className={radioGroupStyles({ orientation, className })}\n name={name}\n ref={ref}\n disabled={disabled}\n orientation={orientation}\n loop={loop}\n required={required}\n aria-labelledby={labelId}\n aria-invalid={isInvalid}\n aria-required={required}\n aria-describedby={description}\n {...others}\n />\n </RadioGroupProvider>\n )\n}\n\nRadioGroup.displayName = 'RadioGroup'\n","import { Radio } from './Radio'\nimport { RadioGroup as Root } from './RadioGroup'\n\nexport const RadioGroup: typeof Root & {\n Radio: typeof Radio\n} = Object.assign(Root, {\n Radio,\n})\n\nRadioGroup.displayName = 'RadioGroup'\nRadio.displayName = 'RadioGroup.Radio'\n\nexport { type RadioGroupProps } from './RadioGroup'\nexport { type RadioProps } from './Radio'\n"],"names":["RadioGroupContext","createContext","useRadioGroup","context","useContext","radioIndicatorStyles","cva","makeVariants","RadioIndicator","intent","className","ref","others","jsx","RadixRadioGroup","radioInputVariants","RadioInput","intentProp","state","useFormFieldControl","radioLabelStyles","RadioLabel","disabled","Label","ID_PREFIX","Radio","children","id","disabledProp","innerId","useId","innerLabelId","reverse","radioLabel","radioInput","content","jsxs","Fragment","cx","radioGroupStyles","RadioGroupProvider","value","useMemo","RadioGroup","orientation","loop","requiredProp","labelId","isInvalid","isRequired","description","name","required","Root"],"mappings":"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"}
@@ -1,4 +1,4 @@
1
- import { jsx as o, jsxs as g, Fragment as G } from "react/jsx-runtime";
1
+ import { jsx as o, jsxs as v, Fragment as G } from "react/jsx-runtime";
2
2
  import { cva as u, cx as F } from "class-variance-authority";
3
3
  import { createContext as V, useContext as j, useId as k, useMemo as C } from "react";
4
4
  import { useFormFieldControl as y } from "@spark-ui/components/form-field";
@@ -154,14 +154,14 @@ const x = ":radio", R = ({
154
154
  ...n,
155
155
  disabled: t
156
156
  }
157
- ), m = f ? /* @__PURE__ */ g(G, { children: [
157
+ ), m = f ? /* @__PURE__ */ v(G, { children: [
158
158
  c,
159
159
  l
160
- ] }) : /* @__PURE__ */ g(G, { children: [
160
+ ] }) : /* @__PURE__ */ v(G, { children: [
161
161
  l,
162
162
  c
163
163
  ] });
164
- return /* @__PURE__ */ o("div", { className: F("gap-md text-body-1 flex items-start", e), children: m });
164
+ return /* @__PURE__ */ o("span", { className: F("gap-md text-body-1 flex items-start", e), children: m });
165
165
  };
166
166
  R.displayName = "RadioGroup.Radio";
167
167
  const O = u(["flex"], {
@@ -190,7 +190,7 @@ const O = u(["flex"], {
190
190
  ref: d,
191
191
  ...b
192
192
  }) => {
193
- const { labelId: p, isInvalid: f, isRequired: c, description: l, name: m } = y(), v = n !== void 0 ? n : c;
193
+ const { labelId: p, isInvalid: f, isRequired: c, description: l, name: m } = y(), g = n !== void 0 ? n : c;
194
194
  return /* @__PURE__ */ o(P, { reverse: s, intent: a, disabled: t, children: /* @__PURE__ */ o(
195
195
  h.RadioGroup,
196
196
  {
@@ -201,10 +201,10 @@ const O = u(["flex"], {
201
201
  disabled: t,
202
202
  orientation: e,
203
203
  loop: r,
204
- required: v,
204
+ required: g,
205
205
  "aria-labelledby": p,
206
206
  "aria-invalid": f,
207
- "aria-required": v,
207
+ "aria-required": g,
208
208
  "aria-describedby": l,
209
209
  ...b
210
210
  }
@@ -1 +1 @@
1
- {"version":3,"file":"index.mjs","sources":["../../src/radio-group/RadioGroupContext.tsx","../../src/radio-group/RadioIndicator.styles.ts","../../src/radio-group/RadioIndicator.tsx","../../src/radio-group/RadioInput.styles.ts","../../src/radio-group/RadioInput.tsx","../../src/radio-group/RadioLabel.styles.tsx","../../src/radio-group/RadioLabel.tsx","../../src/radio-group/Radio.tsx","../../src/radio-group/RadioGroup.styles.ts","../../src/radio-group/RadioGroupProvider.tsx","../../src/radio-group/RadioGroup.tsx","../../src/radio-group/index.ts"],"sourcesContent":["import { createContext, useContext } from 'react'\n\nimport type { RadioGroupProps } from './RadioGroup'\nimport type { RadioInputProps } from './RadioInput'\n\nexport type RadioGroupContextState = Pick<RadioInputProps, 'intent' | 'disabled'> &\n Pick<RadioGroupProps, 'reverse'>\n\nexport const RadioGroupContext = createContext<RadioGroupContextState | null>(null)\n\nexport const useRadioGroup = () => {\n const context = useContext(RadioGroupContext)\n\n if (!context) {\n throw Error('useRadioGroup must be used within a RadioGroup provider')\n }\n\n return context\n}\n","import { makeVariants } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nexport const radioIndicatorStyles = cva(\n [\n 'relative block',\n 'size-3/5',\n 'after:absolute',\n 'after:left-1/2 after:top-1/2 after:-translate-x-1/2 after:-translate-y-1/2',\n 'after:h-0',\n 'after:w-0',\n 'after:block',\n 'after:rounded-[50%]',\n \"after:content-['']\",\n 'after:transition-all',\n 'data-[state=checked]:after:size-full',\n ],\n {\n variants: {\n intent: makeVariants<\n 'intent',\n ['main', 'support', 'accent', 'basic', 'success', 'alert', 'error', 'info', 'neutral']\n >({\n main: ['after:bg-main'],\n support: ['after:bg-support'],\n accent: ['after:bg-accent'],\n basic: ['after:bg-basic'],\n neutral: ['after:bg-neutral'],\n success: ['after:bg-success'],\n alert: ['after:bg-alert'],\n error: ['after:bg-error'],\n info: ['after:bg-info'],\n }),\n },\n defaultVariants: {\n intent: 'basic',\n },\n }\n)\n\nexport type RadioIndicatorStylesProps = VariantProps<typeof radioIndicatorStyles>\n","import { RadioGroup as RadixRadioGroup } from 'radix-ui'\nimport { Ref } from 'react'\n\nimport { radioIndicatorStyles, RadioIndicatorStylesProps } from './RadioIndicator.styles'\n\nexport interface RadioIndicatorProps extends RadioIndicatorStylesProps {\n className?: string\n /**\n * Change the component to the HTML tag or custom component of the only child.\n */\n asChild?: boolean\n /**\n * Used to force mounting when more control is needed. Useful when controlling animation with React animation libraries.\n */\n forceMount?: true | undefined\n ref?: Ref<HTMLSpanElement>\n}\n\nexport const RadioIndicator = ({ intent, className, ref, ...others }: RadioIndicatorProps) => {\n return (\n <RadixRadioGroup.Indicator\n ref={ref}\n className={radioIndicatorStyles({ intent, className })}\n {...others}\n />\n )\n}\n\nRadioIndicator.displayName = 'RadioGroup.RadioIndicator'\n","import { makeVariants } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nexport const radioInputVariants = cva(\n [\n 'flex shrink-0 items-center justify-center',\n 'rounded-full',\n 'border-md',\n 'outline-hidden',\n 'hover:ring-4',\n 'focus-visible:u-outline',\n 'disabled:cursor-not-allowed disabled:border-outline/dim-2 disabled:hover:ring-transparent',\n 'u-shadow-border-transition',\n 'size-sz-24',\n ],\n {\n variants: {\n /**\n * Color scheme of the radio input.\n */\n intent: makeVariants<\n 'intent',\n ['main', 'support', 'accent', 'basic', 'success', 'alert', 'error', 'info', 'neutral']\n >({\n main: ['border-outline', 'data-[state=checked]:border-main', 'hover:ring-main-container'],\n support: [\n 'border-outline',\n 'data-[state=checked]:border-support',\n 'hover:ring-support-container',\n ],\n accent: [\n 'border-outline',\n 'data-[state=checked]:border-accent',\n 'hover:ring-accent-container',\n ],\n basic: [\n 'border-outline',\n 'data-[state=checked]:border-basic',\n 'hover:ring-basic-container',\n ],\n neutral: [\n 'border-outline',\n 'data-[state=checked]:border-neutral',\n 'hover:ring-neutral-container',\n ],\n info: ['border-info', 'data-[state=checked]:border-info', 'hover:ring-info-container'],\n success: [\n 'border-success',\n 'data-[state=checked]:border-success',\n 'hover:ring-success-container',\n ],\n alert: ['border-alert', 'data-[state=checked]:border-alert', 'hover:ring-alert-container'],\n error: ['border-error', 'data-[state=checked]:border-error', 'hover:ring-error-container'],\n }),\n },\n defaultVariants: {\n intent: 'basic',\n },\n }\n)\n\nexport type RadioInputVariantsProps = VariantProps<typeof radioInputVariants>\n","import { useFormFieldControl } from '@spark-ui/components/form-field'\nimport { RadioGroup as RadixRadioGroup } from 'radix-ui'\nimport { ButtonHTMLAttributes, Ref } from 'react'\n\nimport { RadioIndicator } from './RadioIndicator'\nimport { radioInputVariants, RadioInputVariantsProps } from './RadioInput.styles'\n\nexport interface RadioInputProps\n extends RadioInputVariantsProps,\n Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'value' | 'onChange'> {\n /**\n * Change the component to the HTML tag or custom component of the only child.\n */\n asChild?: boolean\n /**\n * The value given as data when submitted with a name.\n */\n value: string\n /**\n * When true, prevents the user from interacting with the radio item.\n */\n disabled?: boolean\n /**\n * When true, indicates that the user must check the radio item before the owning form can be submitted.\n */\n required?: boolean\n ref?: Ref<HTMLButtonElement>\n}\n\nexport const RadioInput = ({ intent: intentProp, className, ref, ...others }: RadioInputProps) => {\n const { state } = useFormFieldControl()\n\n const intent = state ?? intentProp\n\n return (\n <RadixRadioGroup.RadioGroupItem\n data-spark-component=\"radio-input\"\n ref={ref}\n className={radioInputVariants({ intent, className })}\n {...others}\n >\n <RadioIndicator intent={intent} forceMount />\n </RadixRadioGroup.RadioGroupItem>\n )\n}\n\nRadioInput.displayName = 'RadioGroup.RadioInput'\n","import { cva, VariantProps } from 'class-variance-authority'\n\nexport const radioLabelStyles = cva('grow', {\n variants: {\n disabled: {\n true: ['text-neutral/dim-2', 'cursor-not-allowed'],\n false: ['cursor-pointer'],\n },\n },\n defaultVariants: {\n disabled: false,\n },\n})\n\nexport type RadioLabelStylesProps = VariantProps<typeof radioLabelStyles>\n","import { Label } from 'radix-ui'\nimport type { HTMLAttributes, PropsWithChildren } from 'react'\n\nimport { radioLabelStyles, RadioLabelStylesProps } from './RadioLabel.styles'\n\nexport interface RadioLabelProps\n extends RadioLabelStylesProps,\n PropsWithChildren<HTMLAttributes<HTMLLabelElement>> {\n /**\n * Change the component to the HTML tag or custom component of the only child.\n */\n asChild?: boolean\n /**\n * The id of the element the label is associated with.\n */\n htmlFor?: string\n /**\n * When true, prevents the user from interacting with the radio item.\n */\n disabled?: boolean\n}\n\nexport const RadioLabel = ({ disabled, ...others }: RadioLabelProps) => {\n return (\n <Label.Root\n data-spark-component=\"radio-label\"\n className={radioLabelStyles({ disabled })}\n {...others}\n />\n )\n}\n\nRadioLabel.displayName = 'RadioGroup.RadioLabel'\n","import { cx } from 'class-variance-authority'\nimport { Ref, useId } from 'react'\n\nimport { useRadioGroup } from './RadioGroupContext'\nimport { RadioInput, RadioInputProps } from './RadioInput'\nimport { RadioLabel } from './RadioLabel'\n\nexport type RadioProps = RadioInputProps & {\n ref?: Ref<HTMLButtonElement>\n}\n\nconst ID_PREFIX = ':radio'\n\nexport const Radio = ({\n className,\n children,\n id,\n disabled: disabledProp,\n ref,\n ...others\n}: RadioProps) => {\n const innerId = `${ID_PREFIX}-input-${useId()}`\n const innerLabelId = `${ID_PREFIX}-label-${useId()}`\n\n const { intent, disabled, reverse } = useRadioGroup()\n\n const radioLabel = children && (\n <RadioLabel disabled={disabledProp || disabled} htmlFor={id || innerId} id={innerLabelId}>\n {children}\n </RadioLabel>\n )\n\n const radioInput = (\n <RadioInput\n ref={ref}\n id={id || innerId}\n intent={intent}\n aria-labelledby={children ? innerLabelId : undefined}\n {...others}\n disabled={disabledProp}\n />\n )\n\n const content = reverse ? (\n <>\n {radioLabel}\n {radioInput}\n </>\n ) : (\n <>\n {radioInput}\n {radioLabel}\n </>\n )\n\n return <div className={cx('gap-md text-body-1 flex items-start', className)}>{content}</div>\n}\n\nRadio.displayName = 'RadioGroup.Radio'\n","import { cva, VariantProps } from 'class-variance-authority'\n\nexport const radioGroupStyles = cva(['flex'], {\n variants: {\n orientation: {\n vertical: ['flex-col', 'gap-lg'],\n horizontal: ['flex-row', 'gap-xl'],\n },\n },\n})\n\nexport type RadioGroupVariantsProps = VariantProps<typeof radioGroupStyles>\n","import { ReactNode, useMemo } from 'react'\n\nimport type { RadioGroupProps } from './RadioGroup'\nimport { RadioGroupContext } from './RadioGroupContext'\nimport type { RadioInputProps } from './RadioInput'\n\nexport interface RadioGroupProviderProps\n extends Pick<RadioInputProps, 'intent' | 'disabled'>,\n Pick<RadioGroupProps, 'reverse'> {\n children: ReactNode\n}\n\nexport const RadioGroupProvider = ({\n intent,\n disabled,\n reverse,\n children,\n}: RadioGroupProviderProps) => {\n const value = useMemo(() => ({ intent, disabled, reverse }), [intent, disabled, reverse])\n\n return <RadioGroupContext.Provider value={value}>{children}</RadioGroupContext.Provider>\n}\n","import { useFormFieldControl } from '@spark-ui/components/form-field'\nimport { RadioGroup as RadixRadioGroup } from 'radix-ui'\nimport { HTMLAttributes, Ref } from 'react'\n\nimport { radioGroupStyles, RadioGroupVariantsProps } from './RadioGroup.styles'\nimport { RadioGroupProvider } from './RadioGroupProvider'\nimport { RadioInputVariantsProps } from './RadioInput.styles'\n\nexport interface RadioGroupProps\n extends RadioGroupVariantsProps,\n Pick<RadioInputVariantsProps, 'intent'>,\n Omit<HTMLAttributes<HTMLDivElement>, 'value' | 'defaultValue' | 'dir' | 'onChange'> {\n /**\n * Change the component to the HTML tag or custom component of the only child.\n */\n asChild?: boolean\n /**\n * The value of the radio item that should be checked when initially rendered. Use when you do not need to control the state of the radio items.\n */\n defaultValue?: string\n /**\n * The controlled value of the radio item to check. Should be used in conjunction with onValueChange.\n */\n value?: string\n /**\n * Event handler called when the value changes.\n */\n onValueChange?: (value: string) => void\n /**\n * When true, prevents the user from interacting with radio items.\n */\n disabled?: boolean\n /**\n * The name of the group. Submitted with its owning form as part of a name/value pair.\n */\n name?: string\n /**\n * When true, indicates that the user must check a radio item before the owning form can be submitted.\n */\n required?: boolean\n /**\n * The orientation of the component.\n */\n orientation?: 'horizontal' | 'vertical'\n /**\n * The reading direction of the radio group.\n */\n dir?: 'ltr' | 'rtl'\n /**\n * When true, keyboard navigation will loop from last item to first, and vice versa.\n */\n loop?: boolean\n /**\n * When true, the label will be placed on the left side of the Radio\n */\n reverse?: boolean\n ref?: Ref<HTMLDivElement>\n}\n\nexport const RadioGroup = ({\n orientation = 'vertical',\n loop = true,\n intent = 'basic',\n disabled,\n className,\n required: requiredProp,\n reverse = false,\n ref,\n ...others\n}: RadioGroupProps) => {\n const { labelId, isInvalid, isRequired, description, name } = useFormFieldControl()\n const required = requiredProp !== undefined ? requiredProp : isRequired\n\n return (\n <RadioGroupProvider reverse={reverse} intent={intent} disabled={disabled}>\n <RadixRadioGroup.RadioGroup\n data-spark-component=\"radio-group\"\n className={radioGroupStyles({ orientation, className })}\n name={name}\n ref={ref}\n disabled={disabled}\n orientation={orientation}\n loop={loop}\n required={required}\n aria-labelledby={labelId}\n aria-invalid={isInvalid}\n aria-required={required}\n aria-describedby={description}\n {...others}\n />\n </RadioGroupProvider>\n )\n}\n\nRadioGroup.displayName = 'RadioGroup'\n","import { Radio } from './Radio'\nimport { RadioGroup as Root } from './RadioGroup'\n\nexport const RadioGroup: typeof Root & {\n Radio: typeof Radio\n} = Object.assign(Root, {\n Radio,\n})\n\nRadioGroup.displayName = 'RadioGroup'\nRadio.displayName = 'RadioGroup.Radio'\n\nexport { type RadioGroupProps } from './RadioGroup'\nexport { type RadioProps } from './Radio'\n"],"names":["RadioGroupContext","createContext","useRadioGroup","context","useContext","radioIndicatorStyles","cva","makeVariants","RadioIndicator","intent","className","ref","others","jsx","RadixRadioGroup","radioInputVariants","RadioInput","intentProp","state","useFormFieldControl","radioLabelStyles","RadioLabel","disabled","Label","ID_PREFIX","Radio","children","id","disabledProp","innerId","useId","innerLabelId","reverse","radioLabel","radioInput","content","jsxs","Fragment","cx","radioGroupStyles","RadioGroupProvider","value","useMemo","RadioGroup","orientation","loop","requiredProp","labelId","isInvalid","isRequired","description","name","required","Root"],"mappings":"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"}
1
+ {"version":3,"file":"index.mjs","sources":["../../src/radio-group/RadioGroupContext.tsx","../../src/radio-group/RadioIndicator.styles.ts","../../src/radio-group/RadioIndicator.tsx","../../src/radio-group/RadioInput.styles.ts","../../src/radio-group/RadioInput.tsx","../../src/radio-group/RadioLabel.styles.tsx","../../src/radio-group/RadioLabel.tsx","../../src/radio-group/Radio.tsx","../../src/radio-group/RadioGroup.styles.ts","../../src/radio-group/RadioGroupProvider.tsx","../../src/radio-group/RadioGroup.tsx","../../src/radio-group/index.ts"],"sourcesContent":["import { createContext, useContext } from 'react'\n\nimport type { RadioGroupProps } from './RadioGroup'\nimport type { RadioInputProps } from './RadioInput'\n\nexport type RadioGroupContextState = Pick<RadioInputProps, 'intent' | 'disabled'> &\n Pick<RadioGroupProps, 'reverse'>\n\nexport const RadioGroupContext = createContext<RadioGroupContextState | null>(null)\n\nexport const useRadioGroup = () => {\n const context = useContext(RadioGroupContext)\n\n if (!context) {\n throw Error('useRadioGroup must be used within a RadioGroup provider')\n }\n\n return context\n}\n","import { makeVariants } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nexport const radioIndicatorStyles = cva(\n [\n 'relative block',\n 'size-3/5',\n 'after:absolute',\n 'after:left-1/2 after:top-1/2 after:-translate-x-1/2 after:-translate-y-1/2',\n 'after:h-0',\n 'after:w-0',\n 'after:block',\n 'after:rounded-[50%]',\n \"after:content-['']\",\n 'after:transition-all',\n 'data-[state=checked]:after:size-full',\n ],\n {\n variants: {\n intent: makeVariants<\n 'intent',\n ['main', 'support', 'accent', 'basic', 'success', 'alert', 'error', 'info', 'neutral']\n >({\n main: ['after:bg-main'],\n support: ['after:bg-support'],\n accent: ['after:bg-accent'],\n basic: ['after:bg-basic'],\n neutral: ['after:bg-neutral'],\n success: ['after:bg-success'],\n alert: ['after:bg-alert'],\n error: ['after:bg-error'],\n info: ['after:bg-info'],\n }),\n },\n defaultVariants: {\n intent: 'basic',\n },\n }\n)\n\nexport type RadioIndicatorStylesProps = VariantProps<typeof radioIndicatorStyles>\n","import { RadioGroup as RadixRadioGroup } from 'radix-ui'\nimport { Ref } from 'react'\n\nimport { radioIndicatorStyles, RadioIndicatorStylesProps } from './RadioIndicator.styles'\n\nexport interface RadioIndicatorProps extends RadioIndicatorStylesProps {\n className?: string\n /**\n * Change the component to the HTML tag or custom component of the only child.\n */\n asChild?: boolean\n /**\n * Used to force mounting when more control is needed. Useful when controlling animation with React animation libraries.\n */\n forceMount?: true | undefined\n ref?: Ref<HTMLSpanElement>\n}\n\nexport const RadioIndicator = ({ intent, className, ref, ...others }: RadioIndicatorProps) => {\n return (\n <RadixRadioGroup.Indicator\n ref={ref}\n className={radioIndicatorStyles({ intent, className })}\n {...others}\n />\n )\n}\n\nRadioIndicator.displayName = 'RadioGroup.RadioIndicator'\n","import { makeVariants } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nexport const radioInputVariants = cva(\n [\n 'flex shrink-0 items-center justify-center',\n 'rounded-full',\n 'border-md',\n 'outline-hidden',\n 'hover:ring-4',\n 'focus-visible:u-outline',\n 'disabled:cursor-not-allowed disabled:border-outline/dim-2 disabled:hover:ring-transparent',\n 'u-shadow-border-transition',\n 'size-sz-24',\n ],\n {\n variants: {\n /**\n * Color scheme of the radio input.\n */\n intent: makeVariants<\n 'intent',\n ['main', 'support', 'accent', 'basic', 'success', 'alert', 'error', 'info', 'neutral']\n >({\n main: ['border-outline', 'data-[state=checked]:border-main', 'hover:ring-main-container'],\n support: [\n 'border-outline',\n 'data-[state=checked]:border-support',\n 'hover:ring-support-container',\n ],\n accent: [\n 'border-outline',\n 'data-[state=checked]:border-accent',\n 'hover:ring-accent-container',\n ],\n basic: [\n 'border-outline',\n 'data-[state=checked]:border-basic',\n 'hover:ring-basic-container',\n ],\n neutral: [\n 'border-outline',\n 'data-[state=checked]:border-neutral',\n 'hover:ring-neutral-container',\n ],\n info: ['border-info', 'data-[state=checked]:border-info', 'hover:ring-info-container'],\n success: [\n 'border-success',\n 'data-[state=checked]:border-success',\n 'hover:ring-success-container',\n ],\n alert: ['border-alert', 'data-[state=checked]:border-alert', 'hover:ring-alert-container'],\n error: ['border-error', 'data-[state=checked]:border-error', 'hover:ring-error-container'],\n }),\n },\n defaultVariants: {\n intent: 'basic',\n },\n }\n)\n\nexport type RadioInputVariantsProps = VariantProps<typeof radioInputVariants>\n","import { useFormFieldControl } from '@spark-ui/components/form-field'\nimport { RadioGroup as RadixRadioGroup } from 'radix-ui'\nimport { ButtonHTMLAttributes, Ref } from 'react'\n\nimport { RadioIndicator } from './RadioIndicator'\nimport { radioInputVariants, RadioInputVariantsProps } from './RadioInput.styles'\n\nexport interface RadioInputProps\n extends RadioInputVariantsProps,\n Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'value' | 'onChange'> {\n /**\n * Change the component to the HTML tag or custom component of the only child.\n */\n asChild?: boolean\n /**\n * The value given as data when submitted with a name.\n */\n value: string\n /**\n * When true, prevents the user from interacting with the radio item.\n */\n disabled?: boolean\n /**\n * When true, indicates that the user must check the radio item before the owning form can be submitted.\n */\n required?: boolean\n ref?: Ref<HTMLButtonElement>\n}\n\nexport const RadioInput = ({ intent: intentProp, className, ref, ...others }: RadioInputProps) => {\n const { state } = useFormFieldControl()\n\n const intent = state ?? intentProp\n\n return (\n <RadixRadioGroup.RadioGroupItem\n data-spark-component=\"radio-input\"\n ref={ref}\n className={radioInputVariants({ intent, className })}\n {...others}\n >\n <RadioIndicator intent={intent} forceMount />\n </RadixRadioGroup.RadioGroupItem>\n )\n}\n\nRadioInput.displayName = 'RadioGroup.RadioInput'\n","import { cva, VariantProps } from 'class-variance-authority'\n\nexport const radioLabelStyles = cva('grow', {\n variants: {\n disabled: {\n true: ['text-neutral/dim-2', 'cursor-not-allowed'],\n false: ['cursor-pointer'],\n },\n },\n defaultVariants: {\n disabled: false,\n },\n})\n\nexport type RadioLabelStylesProps = VariantProps<typeof radioLabelStyles>\n","import { Label } from 'radix-ui'\nimport type { HTMLAttributes, PropsWithChildren } from 'react'\n\nimport { radioLabelStyles, RadioLabelStylesProps } from './RadioLabel.styles'\n\nexport interface RadioLabelProps\n extends RadioLabelStylesProps,\n PropsWithChildren<HTMLAttributes<HTMLLabelElement>> {\n /**\n * Change the component to the HTML tag or custom component of the only child.\n */\n asChild?: boolean\n /**\n * The id of the element the label is associated with.\n */\n htmlFor?: string\n /**\n * When true, prevents the user from interacting with the radio item.\n */\n disabled?: boolean\n}\n\nexport const RadioLabel = ({ disabled, ...others }: RadioLabelProps) => {\n return (\n <Label.Root\n data-spark-component=\"radio-label\"\n className={radioLabelStyles({ disabled })}\n {...others}\n />\n )\n}\n\nRadioLabel.displayName = 'RadioGroup.RadioLabel'\n","import { cx } from 'class-variance-authority'\nimport { Ref, useId } from 'react'\n\nimport { useRadioGroup } from './RadioGroupContext'\nimport { RadioInput, RadioInputProps } from './RadioInput'\nimport { RadioLabel } from './RadioLabel'\n\nexport type RadioProps = RadioInputProps & {\n ref?: Ref<HTMLButtonElement>\n}\n\nconst ID_PREFIX = ':radio'\n\nexport const Radio = ({\n className,\n children,\n id,\n disabled: disabledProp,\n ref,\n ...others\n}: RadioProps) => {\n const innerId = `${ID_PREFIX}-input-${useId()}`\n const innerLabelId = `${ID_PREFIX}-label-${useId()}`\n\n const { intent, disabled, reverse } = useRadioGroup()\n\n const radioLabel = children && (\n <RadioLabel disabled={disabledProp || disabled} htmlFor={id || innerId} id={innerLabelId}>\n {children}\n </RadioLabel>\n )\n\n const radioInput = (\n <RadioInput\n ref={ref}\n id={id || innerId}\n intent={intent}\n aria-labelledby={children ? innerLabelId : undefined}\n {...others}\n disabled={disabledProp}\n />\n )\n\n const content = reverse ? (\n <>\n {radioLabel}\n {radioInput}\n </>\n ) : (\n <>\n {radioInput}\n {radioLabel}\n </>\n )\n\n return <span className={cx('gap-md text-body-1 flex items-start', className)}>{content}</span>\n}\n\nRadio.displayName = 'RadioGroup.Radio'\n","import { cva, VariantProps } from 'class-variance-authority'\n\nexport const radioGroupStyles = cva(['flex'], {\n variants: {\n orientation: {\n vertical: ['flex-col', 'gap-lg'],\n horizontal: ['flex-row', 'gap-xl'],\n },\n },\n})\n\nexport type RadioGroupVariantsProps = VariantProps<typeof radioGroupStyles>\n","import { ReactNode, useMemo } from 'react'\n\nimport type { RadioGroupProps } from './RadioGroup'\nimport { RadioGroupContext } from './RadioGroupContext'\nimport type { RadioInputProps } from './RadioInput'\n\nexport interface RadioGroupProviderProps\n extends Pick<RadioInputProps, 'intent' | 'disabled'>,\n Pick<RadioGroupProps, 'reverse'> {\n children: ReactNode\n}\n\nexport const RadioGroupProvider = ({\n intent,\n disabled,\n reverse,\n children,\n}: RadioGroupProviderProps) => {\n const value = useMemo(() => ({ intent, disabled, reverse }), [intent, disabled, reverse])\n\n return <RadioGroupContext.Provider value={value}>{children}</RadioGroupContext.Provider>\n}\n","import { useFormFieldControl } from '@spark-ui/components/form-field'\nimport { RadioGroup as RadixRadioGroup } from 'radix-ui'\nimport { HTMLAttributes, Ref } from 'react'\n\nimport { radioGroupStyles, RadioGroupVariantsProps } from './RadioGroup.styles'\nimport { RadioGroupProvider } from './RadioGroupProvider'\nimport { RadioInputVariantsProps } from './RadioInput.styles'\n\nexport interface RadioGroupProps\n extends RadioGroupVariantsProps,\n Pick<RadioInputVariantsProps, 'intent'>,\n Omit<HTMLAttributes<HTMLDivElement>, 'value' | 'defaultValue' | 'dir' | 'onChange'> {\n /**\n * Change the component to the HTML tag or custom component of the only child.\n */\n asChild?: boolean\n /**\n * The value of the radio item that should be checked when initially rendered. Use when you do not need to control the state of the radio items.\n */\n defaultValue?: string\n /**\n * The controlled value of the radio item to check. Should be used in conjunction with onValueChange.\n */\n value?: string\n /**\n * Event handler called when the value changes.\n */\n onValueChange?: (value: string) => void\n /**\n * When true, prevents the user from interacting with radio items.\n */\n disabled?: boolean\n /**\n * The name of the group. Submitted with its owning form as part of a name/value pair.\n */\n name?: string\n /**\n * When true, indicates that the user must check a radio item before the owning form can be submitted.\n */\n required?: boolean\n /**\n * The orientation of the component.\n */\n orientation?: 'horizontal' | 'vertical'\n /**\n * The reading direction of the radio group.\n */\n dir?: 'ltr' | 'rtl'\n /**\n * When true, keyboard navigation will loop from last item to first, and vice versa.\n */\n loop?: boolean\n /**\n * When true, the label will be placed on the left side of the Radio\n */\n reverse?: boolean\n ref?: Ref<HTMLDivElement>\n}\n\nexport const RadioGroup = ({\n orientation = 'vertical',\n loop = true,\n intent = 'basic',\n disabled,\n className,\n required: requiredProp,\n reverse = false,\n ref,\n ...others\n}: RadioGroupProps) => {\n const { labelId, isInvalid, isRequired, description, name } = useFormFieldControl()\n const required = requiredProp !== undefined ? requiredProp : isRequired\n\n return (\n <RadioGroupProvider reverse={reverse} intent={intent} disabled={disabled}>\n <RadixRadioGroup.RadioGroup\n data-spark-component=\"radio-group\"\n className={radioGroupStyles({ orientation, className })}\n name={name}\n ref={ref}\n disabled={disabled}\n orientation={orientation}\n loop={loop}\n required={required}\n aria-labelledby={labelId}\n aria-invalid={isInvalid}\n aria-required={required}\n aria-describedby={description}\n {...others}\n />\n </RadioGroupProvider>\n )\n}\n\nRadioGroup.displayName = 'RadioGroup'\n","import { Radio } from './Radio'\nimport { RadioGroup as Root } from './RadioGroup'\n\nexport const RadioGroup: typeof Root & {\n Radio: typeof Radio\n} = Object.assign(Root, {\n Radio,\n})\n\nRadioGroup.displayName = 'RadioGroup'\nRadio.displayName = 'RadioGroup.Radio'\n\nexport { type RadioGroupProps } from './RadioGroup'\nexport { type RadioProps } from './Radio'\n"],"names":["RadioGroupContext","createContext","useRadioGroup","context","useContext","radioIndicatorStyles","cva","makeVariants","RadioIndicator","intent","className","ref","others","jsx","RadixRadioGroup","radioInputVariants","RadioInput","intentProp","state","useFormFieldControl","radioLabelStyles","RadioLabel","disabled","Label","ID_PREFIX","Radio","children","id","disabledProp","innerId","useId","innerLabelId","reverse","radioLabel","radioInput","content","jsxs","Fragment","cx","radioGroupStyles","RadioGroupProvider","value","useMemo","RadioGroup","orientation","loop","requiredProp","labelId","isInvalid","isRequired","description","name","required","Root"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("react/jsx-runtime"),T=require("@spark-ui/hooks/use-scroll-overflow"),p=require("class-variance-authority"),l=require("react"),O=require("react-snap-carousel"),V=require("../Slot-DQ8z2zsy.js"),z=require("@spark-ui/icons/ArrowVerticalRight"),w=require("../Icon-CF0W0LKr.js"),S=require("../IconButton-D5fk89W-.js"),D=require("@spark-ui/icons/ArrowVerticalLeft"),$=require("../Button-BIAkZTRR.js"),v=l.createContext(null),P=({snapType:s="none",snapStop:n="normal",scrollBehavior:e="smooth",loop:r=!1,gap:t=16,withFade:i=!1,scrollPadding:a=0,children:c,className:f,...d})=>{const o=l.useRef(null),g=l.useRef(null),h=O.useSnapCarousel(),{overflow:j,refresh:b}=T.useScrollOverflow(o,{precisionTreshold:1}),{activePageIndex:A,pages:q,refresh:m}=h,x=q[A],E=x?[x[0]+1,x[x.length-1]+1]:[0,0],y=l.useCallback(()=>{m&&o.current&&setTimeout(()=>{m()},0)},[m]);l.useEffect(()=>{y()},[c,y]),l.useLayoutEffect(()=>{o.current&&requestAnimationFrame(()=>{b()})},[c,b]);const F={...h,snapType:s,snapStop:n,skipKeyboardNavigation:()=>{g.current?.focus()},scrollBehavior:e,visibleItemsRange:E,loop:r,gap:t,withFade:i,scrollPadding:a,scrollAreaRef:o,overflow:j};return u.jsxs(v.Provider,{value:F,children:[u.jsx("div",{"data-spark-component":"scrolling-list",className:p.cx("gap-lg group/scrolling-list relative flex flex-col default:w-full",f),...d,children:c}),u.jsx("span",{ref:g,className:"size-0 overflow-hidden",tabIndex:-1})]})};P.displayName="ScrollingList";const L=({children:s,visibility:n="always",className:e,...r})=>u.jsx("div",{"data-spark-component":"scrolling-list-controls",className:p.cx("default:px-md pointer-events-none absolute inset-0 flex flex-row items-center justify-between overflow-hidden",e),style:{"--scrolling-list-controls-opacity":n==="hover"?"0":"1"},"data-orientation":"horizontal",...r,children:s});L.displayName="ScrollingList.Controls";function K(s,n){const[e,r]=l.useState(!1);return l.useEffect(()=>{const t=c=>{r(!0);const f=c.target,d=n.current;if(f&&d){const o=f.getBoundingClientRect(),g=d.getBoundingClientRect();o.left>=g.left&&o.right<=g.right&&o.top>=g.top&&o.bottom<=g.bottom||f.scrollIntoView({behavior:"smooth",inline:"center",block:"nearest"})}},i=c=>{s.current&&!s.current.contains(c.relatedTarget)&&r(!1)},a=s.current;return a&&(a.addEventListener("focusin",t),a.addEventListener("focusout",i)),()=>{a&&(a.removeEventListener("focusin",t),a.removeEventListener("focusout",i))}},[s,n]),e}const I=({asChild:s=!1,children:n,index:e=0,className:r="",...t})=>{const i=l.useContext(v),a=l.useRef(null),c=i.snapPointIndexes.has(e);K(a,i.scrollAreaRef);const f=s?V.Slot:"div";return u.jsx(f,{"data-spark-component":"scrolling-list-item",role:"listitem",ref:a,className:p.cx("default:w-auto default:shrink-0",{"snap-start":c,"snap-normal":c&&i.snapStop==="normal","snap-always":c&&i.snapStop==="always"},r),...t,children:n})};I.displayName="ScrollingList.Item";function H(...s){return n=>{s.forEach(e=>{typeof e=="function"?e(n):e&&typeof e=="object"&&"current"in e&&(e.current=n)})}}const N=({children:s,ref:n,className:e="",...r})=>{const t=l.useContext(v),i={mandatory:"x mandatory",proximity:"x proximity",none:"none"},a=o=>{!t.loop&&!t.hasPrevPage||(o.preventDefault(),t.goTo(t.hasPrevPage?t.activePageIndex-1:t.pages.length-1,{behavior:t.scrollBehavior}))},c=o=>{!t.loop&&!t.hasNextPage||(o.preventDefault(),t.goTo(t.hasNextPage?t.activePageIndex+1:0,{behavior:t.scrollBehavior}))},f=o=>{o.key==="ArrowLeft"&&a(o),o.key==="ArrowRight"&&c(o)},d={scrollSnapType:i[t.snapType],scrollPaddingInline:"var(--scrolling-list-px)","--scrolling-list-px":`${t.scrollPadding}px`,"--scrolling-list-gap":`${t.gap}px`,...t.withFade&&{maskImage:"linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1) 44px, rgba(0, 0, 0, 1) calc(100% - 44px), rgba(0, 0, 0, 0))",maskSize:`calc(100% + ${t.overflow.left?"0px":"44px"} + ${t.overflow.right?"0px":"44px"}) 100%`,maskPosition:`${t.overflow.left?"0px":"-44px"} 0`}};return u.jsx("div",{"data-spark-component":"scrolling-list-items",id:"scrolling-list-items",role:"list",className:p.cx("relative transition-all duration-300","u-no-scrollbar overflow-x-auto scroll-smooth","w-full gap-(--scrolling-list-gap) default:flex default:flex-row","focus-visible:u-outline",e),ref:H(t.scrollAreaRef,t.scrollRef,n),style:d,onKeyDown:f,...r,children:l.Children.map(s,(o,g)=>l.isValidElement(o)?l.cloneElement(o,{index:g}):o)})};N.displayName="ScrollingList.Items";const k=({"aria-label":s,...n})=>{const e=l.useContext(v),r=()=>{e.hasNextPage?e.next({behavior:e.scrollBehavior}):e.goTo(0,{behavior:e.scrollBehavior})},i=!(e.overflow.left||e.overflow.right)||!e.loop&&!e.overflow.right;return u.jsx(S.IconButton,{"data-spark-component":"scrolling-list-next-button",size:"sm",intent:"surface",design:"filled",className:p.cx("pointer-events-auto opacity-(--scrolling-list-controls-opacity) shadow-sm disabled:invisible","group-hover/scrolling-list:opacity-none focus-visible:opacity-none"),onClick:r,disabled:i,"aria-label":s,"aria-controls":"scrolling-list-items",...n,children:u.jsx(w.Icon,{children:u.jsx(z.ArrowVerticalRight,{})})})};k.displayName="ScrollingList.NextButton";const B=({"aria-label":s,...n})=>{const e=l.useContext(v),r=()=>{e.activePageIndex===0&&(e.scrollAreaRef.current?.scrollLeft||0)>0?e.goTo(0,{behavior:e.scrollBehavior}):e.hasPrevPage?e.prev({behavior:e.scrollBehavior}):e.goTo(e.pages.length-1,{behavior:e.scrollBehavior})},i=!(e.overflow.left||e.overflow.right)||!e.loop&&!e.overflow.left;return u.jsx(S.IconButton,{"data-spark-component":"scrolling-list-prev-button",size:"sm",intent:"surface",design:"filled",className:p.cx("pointer-events-auto opacity-(--scrolling-list-controls-opacity) shadow-sm disabled:invisible","group-hover/scrolling-list:opacity-none focus-visible:opacity-none"),onClick:r,disabled:i,"aria-label":s,"aria-controls":"scrolling-list-items",...n,children:u.jsx(w.Icon,{children:u.jsx(D.ArrowVerticalLeft,{})})})};B.displayName="ScrollingList.PrevButton";const C=({children:s,...n})=>{const e=l.useContext(v);return u.jsx($.Button,{type:"button",design:"tinted",intent:"surface",tabIndex:0,className:p.cx("z-raised absolute top-1/2 left-0 -translate-y-1/2","not-focus-visible:pointer-events-none not-focus-visible:size-0 not-focus-visible:opacity-0"),onClick:e.skipKeyboardNavigation,...n,children:s})};C.displayName="ScrollingList.SkipButton";const R=Object.assign(P,{Controls:L,NextButton:k,PrevButton:B,Item:I,Items:N,SkipButton:C});R.displayName="ScrollingList";exports.ScrollingList=R;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("react/jsx-runtime"),T=require("@spark-ui/hooks/use-scroll-overflow"),p=require("class-variance-authority"),l=require("react"),O=require("react-snap-carousel"),V=require("../Slot-DQ8z2zsy.js"),z=require("@spark-ui/icons/ArrowVerticalRight"),w=require("../Icon-CF0W0LKr.js"),S=require("../IconButton-D3g86WpZ.js"),D=require("@spark-ui/icons/ArrowVerticalLeft"),$=require("../Button-B6rA3-e5.js"),v=l.createContext(null),P=({snapType:s="none",snapStop:n="normal",scrollBehavior:e="smooth",loop:r=!1,gap:t=16,withFade:i=!1,scrollPadding:a=0,children:c,className:f,...d})=>{const o=l.useRef(null),g=l.useRef(null),h=O.useSnapCarousel(),{overflow:j,refresh:b}=T.useScrollOverflow(o,{precisionTreshold:1}),{activePageIndex:A,pages:q,refresh:m}=h,x=q[A],E=x?[x[0]+1,x[x.length-1]+1]:[0,0],y=l.useCallback(()=>{m&&o.current&&setTimeout(()=>{m()},0)},[m]);l.useEffect(()=>{y()},[c,y]),l.useLayoutEffect(()=>{o.current&&requestAnimationFrame(()=>{b()})},[c,b]);const F={...h,snapType:s,snapStop:n,skipKeyboardNavigation:()=>{g.current?.focus()},scrollBehavior:e,visibleItemsRange:E,loop:r,gap:t,withFade:i,scrollPadding:a,scrollAreaRef:o,overflow:j};return u.jsxs(v.Provider,{value:F,children:[u.jsx("div",{"data-spark-component":"scrolling-list",className:p.cx("gap-lg group/scrolling-list relative flex flex-col default:w-full",f),...d,children:c}),u.jsx("span",{ref:g,className:"size-0 overflow-hidden",tabIndex:-1})]})};P.displayName="ScrollingList";const L=({children:s,visibility:n="always",className:e,...r})=>u.jsx("div",{"data-spark-component":"scrolling-list-controls",className:p.cx("default:px-md pointer-events-none absolute inset-0 flex flex-row items-center justify-between overflow-hidden",e),style:{"--scrolling-list-controls-opacity":n==="hover"?"0":"1"},"data-orientation":"horizontal",...r,children:s});L.displayName="ScrollingList.Controls";function K(s,n){const[e,r]=l.useState(!1);return l.useEffect(()=>{const t=c=>{r(!0);const f=c.target,d=n.current;if(f&&d){const o=f.getBoundingClientRect(),g=d.getBoundingClientRect();o.left>=g.left&&o.right<=g.right&&o.top>=g.top&&o.bottom<=g.bottom||f.scrollIntoView({behavior:"smooth",inline:"center",block:"nearest"})}},i=c=>{s.current&&!s.current.contains(c.relatedTarget)&&r(!1)},a=s.current;return a&&(a.addEventListener("focusin",t),a.addEventListener("focusout",i)),()=>{a&&(a.removeEventListener("focusin",t),a.removeEventListener("focusout",i))}},[s,n]),e}const I=({asChild:s=!1,children:n,index:e=0,className:r="",...t})=>{const i=l.useContext(v),a=l.useRef(null),c=i.snapPointIndexes.has(e);K(a,i.scrollAreaRef);const f=s?V.Slot:"div";return u.jsx(f,{"data-spark-component":"scrolling-list-item",role:"listitem",ref:a,className:p.cx("default:w-auto default:shrink-0",{"snap-start":c,"snap-normal":c&&i.snapStop==="normal","snap-always":c&&i.snapStop==="always"},r),...t,children:n})};I.displayName="ScrollingList.Item";function H(...s){return n=>{s.forEach(e=>{typeof e=="function"?e(n):e&&typeof e=="object"&&"current"in e&&(e.current=n)})}}const N=({children:s,ref:n,className:e="",...r})=>{const t=l.useContext(v),i={mandatory:"x mandatory",proximity:"x proximity",none:"none"},a=o=>{!t.loop&&!t.hasPrevPage||(o.preventDefault(),t.goTo(t.hasPrevPage?t.activePageIndex-1:t.pages.length-1,{behavior:t.scrollBehavior}))},c=o=>{!t.loop&&!t.hasNextPage||(o.preventDefault(),t.goTo(t.hasNextPage?t.activePageIndex+1:0,{behavior:t.scrollBehavior}))},f=o=>{o.key==="ArrowLeft"&&a(o),o.key==="ArrowRight"&&c(o)},d={scrollSnapType:i[t.snapType],scrollPaddingInline:"var(--scrolling-list-px)","--scrolling-list-px":`${t.scrollPadding}px`,"--scrolling-list-gap":`${t.gap}px`,...t.withFade&&{maskImage:"linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1) 44px, rgba(0, 0, 0, 1) calc(100% - 44px), rgba(0, 0, 0, 0))",maskSize:`calc(100% + ${t.overflow.left?"0px":"44px"} + ${t.overflow.right?"0px":"44px"}) 100%`,maskPosition:`${t.overflow.left?"0px":"-44px"} 0`}};return u.jsx("div",{"data-spark-component":"scrolling-list-items",id:"scrolling-list-items",role:"list",className:p.cx("relative transition-all duration-300","u-no-scrollbar overflow-x-auto scroll-smooth","w-full gap-(--scrolling-list-gap) default:flex default:flex-row","focus-visible:u-outline",e),ref:H(t.scrollAreaRef,t.scrollRef,n),style:d,onKeyDown:f,...r,children:l.Children.map(s,(o,g)=>l.isValidElement(o)?l.cloneElement(o,{index:g}):o)})};N.displayName="ScrollingList.Items";const k=({"aria-label":s,...n})=>{const e=l.useContext(v),r=()=>{e.hasNextPage?e.next({behavior:e.scrollBehavior}):e.goTo(0,{behavior:e.scrollBehavior})},i=!(e.overflow.left||e.overflow.right)||!e.loop&&!e.overflow.right;return u.jsx(S.IconButton,{"data-spark-component":"scrolling-list-next-button",size:"sm",intent:"surface",design:"filled",className:p.cx("pointer-events-auto opacity-(--scrolling-list-controls-opacity) shadow-sm disabled:invisible","group-hover/scrolling-list:opacity-none focus-visible:opacity-none"),onClick:r,disabled:i,"aria-label":s,"aria-controls":"scrolling-list-items",...n,children:u.jsx(w.Icon,{children:u.jsx(z.ArrowVerticalRight,{})})})};k.displayName="ScrollingList.NextButton";const B=({"aria-label":s,...n})=>{const e=l.useContext(v),r=()=>{e.activePageIndex===0&&(e.scrollAreaRef.current?.scrollLeft||0)>0?e.goTo(0,{behavior:e.scrollBehavior}):e.hasPrevPage?e.prev({behavior:e.scrollBehavior}):e.goTo(e.pages.length-1,{behavior:e.scrollBehavior})},i=!(e.overflow.left||e.overflow.right)||!e.loop&&!e.overflow.left;return u.jsx(S.IconButton,{"data-spark-component":"scrolling-list-prev-button",size:"sm",intent:"surface",design:"filled",className:p.cx("pointer-events-auto opacity-(--scrolling-list-controls-opacity) shadow-sm disabled:invisible","group-hover/scrolling-list:opacity-none focus-visible:opacity-none"),onClick:r,disabled:i,"aria-label":s,"aria-controls":"scrolling-list-items",...n,children:u.jsx(w.Icon,{children:u.jsx(D.ArrowVerticalLeft,{})})})};B.displayName="ScrollingList.PrevButton";const C=({children:s,...n})=>{const e=l.useContext(v);return u.jsx($.Button,{type:"button",design:"tinted",intent:"surface",tabIndex:0,className:p.cx("z-raised absolute top-1/2 left-0 -translate-y-1/2","not-focus-visible:pointer-events-none not-focus-visible:size-0 not-focus-visible:opacity-0"),onClick:e.skipKeyboardNavigation,...n,children:s})};C.displayName="ScrollingList.SkipButton";const R=Object.assign(P,{Controls:L,NextButton:k,PrevButton:B,Item:I,Items:N,SkipButton:C});R.displayName="ScrollingList";exports.ScrollingList=R;
2
2
  //# sourceMappingURL=index.js.map
@@ -6,9 +6,9 @@ import { useSnapCarousel as J } from "react-snap-carousel";
6
6
  import { S as M } from "../Slot-DLY1rJrG.mjs";
7
7
  import { ArrowVerticalRight as Q } from "@spark-ui/icons/ArrowVerticalRight";
8
8
  import { I as P } from "../Icon-C23-htlD.mjs";
9
- import { I as L } from "../IconButton-Mv9tO1ZH.mjs";
9
+ import { I as L } from "../IconButton-Bfd-6BAD.mjs";
10
10
  import { ArrowVerticalLeft as U } from "@spark-ui/icons/ArrowVerticalLeft";
11
- import { B as X } from "../Button-DggC4GFM.mjs";
11
+ import { B as X } from "../Button-DPncfbbM.mjs";
12
12
  const d = $(
13
13
  null
14
14
  ), N = ({
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),ae=require("@spark-ui/components/form-field"),ne=require("@spark-ui/hooks/use-combined-state"),r=require("react"),f=require("class-variance-authority"),M=require("../Icon-CF0W0LKr.js"),oe=require("@spark-ui/icons/ArrowHorizontalDown"),ce=e=>t=>r.Children.toArray(e).filter(r.isValidElement).find(l=>C(l)?.includes(t)),C=e=>e?e.type.displayName:"",T=(e,t=[])=>(r.Children.forEach(e,s=>{if(r.isValidElement(s)){if(C(s)==="Select.Item"||C(s)==="Select.Placeholder"){const l=s.props;t.push({value:l.value,disabled:!!l.disabled,text:l.children})}s.props.children&&T(s.props.children,t)}}),t),F=e=>{const t=new Map;return T(e).forEach(s=>{t.set(s.value,s)}),t},D=r.createContext(null),ie=":select",R=({children:e,defaultValue:t,value:s,onValueChange:l,disabled:o=!1,readOnly:c=!1,state:i,itemsComponent:n,name:d,required:x})=>{const[h,b]=ne.useCombinedState(s,t,l),[S,y]=r.useState(void 0),[m,v]=r.useState(F(n)),[I,p]=r.useState(),_=m.entries().next()?.value?.[1],B=typeof h=="string"?m.get(h):_,J=s!=null,u=ae.useFormFieldControl(),K=u.state||i,Q=`${ie}-field-${r.useId()}`,W=u.id||Q,Y=u.labelId,Z=u.disabled??o,ee=u.readOnly??c,te=u.name??d,se=!!(u.isRequired??x);return r.useEffect(()=>{const V=F(n),k=[...m.values()],N=[...V.values()];(k.length!==N.length||k.some((z,A)=>{const le=z.value!==N[A]?.value,re=z.text!==N[A]?.text;return le||re}))&&v(V)},[e]),a.jsx(D.Provider,{value:{disabled:Z,readOnly:ee,itemsMap:m,state:K,itemsComponent:n,selectedItem:B,setValue:b,isControlled:J,onValueChange:l,ariaLabel:I,setAriaLabel:p,fieldId:W,fieldLabelId:Y,name:te,required:se,placeholder:S,setPlaceholder:y},children:e})},g=()=>{const e=r.useContext(D);if(!e)throw Error("useSelectContext must be used within a Select provider");return e},$=({children:e,...t})=>{const s=ce(e),l=s("Trigger"),o=s("Items");return a.jsx(R,{...t,itemsComponent:o,children:l})};$.displayName="Select";const H=r.createContext(null),de=({children:e})=>{const[t,s]=r.useState("");return a.jsx(H.Provider,{value:{groupLabel:t,setGroupLabel:s},children:e})},U=()=>{const e=r.useContext(H);if(!e)throw Error("useSelectGroupContext must be used within a SelectGroup provider");return e},j=({children:e,ref:t,...s})=>a.jsx(de,{children:a.jsx(ue,{ref:t,...s,children:e})}),ue=({children:e,className:t,ref:s})=>{const{groupLabel:l}=U();return a.jsx("optgroup",{"data-spark-component":"select-group",ref:s,className:f.cx(t),label:l,children:e})};j.displayName="Select.Group";const w=({disabled:e=!1,value:t,children:s,ref:l})=>a.jsx("option",{"data-spark-component":"select-item",ref:l,value:t,disabled:e,children:s},t);w.displayName="Select.Item";const me=f.cva(["absolute left-0 top-0 size-full rounded-lg opacity-0","min-h-sz-44","ring-1 outline-hidden ring-inset focus:ring-2"],{variants:{state:{undefined:"ring-outline focus:ring-outline-high",error:"ring-error",alert:"ring-alert",success:"ring-success"},disabled:{true:"cursor-not-allowed"},readOnly:{true:"cursor-default"}},compoundVariants:[{disabled:!1,state:void 0,class:"hover:ring-outline-high"}]}),P=({children:e,className:t,ref:s,...l})=>{const{state:o,disabled:c,readOnly:i,ariaLabel:n,fieldLabelId:d,isControlled:x,onValueChange:h,selectedItem:b,setValue:S,name:y,required:m,fieldId:v}=g(),I=p=>{x?(p.preventDefault(),h?.(p.target.value)):S(p.target.value)};return a.jsx("select",{"data-spark-component":"select-items",ref:s,disabled:c||i,name:y,required:m,"aria-labelledby":d,...n&&{"aria-label":n},className:me({className:t,state:o,disabled:c,readOnly:i}),value:b?.value,onChange:I,id:v,...l,children:e})};P.displayName="Select.Items";const L=({children:e})=>{const{setGroupLabel:t}=U();return r.useEffect(()=>{t(e)},[e]),null};L.displayName="Select.Label";const E=({children:e})=>a.jsx(M.Icon,{size:"sm",className:"shrink-0",children:e});E.displayName="Select.LeadingIcon";const O=({disabled:e=!1,children:t,ref:s})=>{const{setPlaceholder:l}=g();return r.useEffect(()=>{l(t)},[t]),a.jsx("option",{"data-spark-component":"select-placeholder",ref:s,value:"",disabled:e,children:t},"placeholder")};O.displayName="Select.Placeholder";const pe=f.cva(["relative flex w-full items-center justify-between","min-h-sz-44 rounded-full px-lg","text-body-1","ring-1 outline-hidden ring-inset focus-within:ring-focus"],{variants:{state:{undefined:"ring-outline",error:"ring-error",alert:"ring-alert",success:"ring-success"},disabled:{false:"focus-within:ring-2"},readOnly:{true:""}},compoundVariants:[{readOnly:!1,disabled:!1,class:"bg-surface text-on-surface"},{readOnly:!0,class:"bg-on-surface/dim-5 text-on-surface cursor-default"},{disabled:!0,class:["bg-on-surface/dim-5 text-on-surface/dim-3","cursor-not-allowed"]},{disabled:!1,state:void 0,class:"default:hover:ring-outline-high"}]}),q=({"aria-label":e,children:t,className:s,ref:l})=>{const{disabled:o,readOnly:c,state:i,setAriaLabel:n,itemsComponent:d}=g();return r.useEffect(()=>{e&&n(e)},[e]),a.jsxs("div",{"data-spark-component":"select-trigger",ref:l,className:pe({className:s,state:i,disabled:o,readOnly:c}),children:[a.jsx("span",{className:"gap-md flex items-center justify-start",children:t}),a.jsx(M.Icon,{className:"ml-md shrink-0",size:"sm",children:a.jsx(oe.ArrowHorizontalDown,{})}),d]})};q.displayName="Select.Trigger";const G=({children:e,className:t,placeholder:s,ref:l})=>{const{selectedItem:o,placeholder:c,disabled:i}=g(),n=o?.value==null,d=s||c;return a.jsx("span",{role:"presentation","data-spark-component":"select-value",ref:l,className:f.cx("flex shrink items-center text-left",t),children:a.jsx("span",{className:f.cx("line-clamp-1 flex-1 overflow-hidden break-all text-ellipsis",n&&!i&&"text-on-surface/dim-1"),children:n?d:e||o?.text})})};G.displayName="Select.Value";const X=Object.assign($,{Group:j,Item:w,Items:P,Placeholder:O,Label:L,Trigger:q,Value:G,LeadingIcon:E});X.displayName="Select";j.displayName="Select.Group";P.displayName="Select.Items";w.displayName="Select.Item";O.displayName="Select.Placeholder";L.displayName="Select.Label";q.displayName="Select.Trigger";G.displayName="Select.Value";E.displayName="Select.LeadingIcon";exports.Select=X;exports.SelectProvider=R;exports.useSelectContext=g;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),ae=require("@spark-ui/components/form-field"),ne=require("@spark-ui/hooks/use-combined-state"),r=require("react"),f=require("class-variance-authority"),M=require("../Icon-CF0W0LKr.js"),oe=require("@spark-ui/icons/ArrowHorizontalDown"),ce=e=>t=>r.Children.toArray(e).filter(r.isValidElement).find(l=>C(l)?.includes(t)),C=e=>e?e.type.displayName:"",T=(e,t=[])=>(r.Children.forEach(e,s=>{if(r.isValidElement(s)){if(C(s)==="Select.Item"||C(s)==="Select.Placeholder"){const l=s.props;t.push({value:l.value,disabled:!!l.disabled,text:l.children})}s.props.children&&T(s.props.children,t)}}),t),F=e=>{const t=new Map;return T(e).forEach(s=>{t.set(s.value,s)}),t},D=r.createContext(null),ie=":select",R=({children:e,defaultValue:t,value:s,onValueChange:l,disabled:o=!1,readOnly:c=!1,state:i,itemsComponent:n,name:d,required:x})=>{const[h,b]=ne.useCombinedState(s,t,l),[S,y]=r.useState(void 0),[m,v]=r.useState(F(n)),[I,p]=r.useState(),_=m.entries().next()?.value?.[1],B=typeof h=="string"?m.get(h):_,J=s!=null,u=ae.useFormFieldControl(),K=u.state||i,Q=`${ie}-field-${r.useId()}`,W=u.id||Q,Y=u.labelId,Z=u.disabled??o,ee=u.readOnly??c,te=u.name??d,se=!!(u.isRequired??x);return r.useEffect(()=>{const V=F(n),k=[...m.values()],N=[...V.values()];(k.length!==N.length||k.some((z,A)=>{const le=z.value!==N[A]?.value,re=z.text!==N[A]?.text;return le||re}))&&v(V)},[e]),a.jsx(D.Provider,{value:{disabled:Z,readOnly:ee,itemsMap:m,state:K,itemsComponent:n,selectedItem:B,setValue:b,isControlled:J,onValueChange:l,ariaLabel:I,setAriaLabel:p,fieldId:W,fieldLabelId:Y,name:te,required:se,placeholder:S,setPlaceholder:y},children:e})},g=()=>{const e=r.useContext(D);if(!e)throw Error("useSelectContext must be used within a Select provider");return e},$=({children:e,...t})=>{const s=ce(e),l=s("Trigger"),o=s("Items");return a.jsx(R,{...t,itemsComponent:o,children:l})};$.displayName="Select";const H=r.createContext(null),de=({children:e})=>{const[t,s]=r.useState("");return a.jsx(H.Provider,{value:{groupLabel:t,setGroupLabel:s},children:e})},U=()=>{const e=r.useContext(H);if(!e)throw Error("useSelectGroupContext must be used within a SelectGroup provider");return e},j=({children:e,ref:t,...s})=>a.jsx(de,{children:a.jsx(ue,{ref:t,...s,children:e})}),ue=({children:e,className:t,ref:s})=>{const{groupLabel:l}=U();return a.jsx("optgroup",{"data-spark-component":"select-group",ref:s,className:f.cx(t),label:l,children:e})};j.displayName="Select.Group";const w=({disabled:e=!1,value:t,children:s,ref:l})=>a.jsx("option",{"data-spark-component":"select-item",ref:l,value:t,disabled:e,children:s},t);w.displayName="Select.Item";const me=f.cva(["absolute left-0 top-0 size-full rounded-lg opacity-0","min-h-sz-44","ring-1 outline-hidden ring-inset focus:ring-2"],{variants:{state:{undefined:"ring-outline focus:ring-outline-high",error:"ring-error",alert:"ring-alert",success:"ring-success"},disabled:{true:"cursor-not-allowed"},readOnly:{true:"cursor-default"}},compoundVariants:[{disabled:!1,state:void 0,class:"hover:ring-outline-high"}]}),P=({children:e,className:t,ref:s,...l})=>{const{state:o,disabled:c,readOnly:i,ariaLabel:n,fieldLabelId:d,isControlled:x,onValueChange:h,selectedItem:b,setValue:S,name:y,required:m,fieldId:v}=g(),I=p=>{x?(p.preventDefault(),h?.(p.target.value)):S(p.target.value)};return a.jsx("select",{"data-spark-component":"select-items",ref:s,disabled:c||i,name:y,required:m,"aria-labelledby":d,...n&&{"aria-label":n},className:me({className:t,state:o,disabled:c,readOnly:i}),value:b?.value,onChange:I,id:v,...l,children:e})};P.displayName="Select.Items";const L=({children:e})=>{const{setGroupLabel:t}=U();return r.useEffect(()=>{t(e)},[e]),null};L.displayName="Select.Label";const E=({children:e})=>a.jsx(M.Icon,{size:"sm",className:"shrink-0",children:e});E.displayName="Select.LeadingIcon";const O=({disabled:e=!1,children:t,ref:s})=>{const{setPlaceholder:l}=g();return r.useEffect(()=>{l(t)},[t]),a.jsx("option",{"data-spark-component":"select-placeholder",ref:s,value:"",disabled:e,children:t},"placeholder")};O.displayName="Select.Placeholder";const pe=f.cva(["relative flex w-full items-center justify-between","min-h-sz-44 rounded-lg px-lg","text-body-1","ring-1 outline-hidden ring-inset focus-within:ring-focus"],{variants:{state:{undefined:"ring-outline",error:"ring-error",alert:"ring-alert",success:"ring-success"},disabled:{false:"focus-within:ring-2"},readOnly:{true:""}},compoundVariants:[{readOnly:!1,disabled:!1,class:"bg-surface text-on-surface"},{readOnly:!0,class:"bg-on-surface/dim-5 text-on-surface cursor-default"},{disabled:!0,class:["bg-on-surface/dim-5 text-on-surface/dim-3","cursor-not-allowed"]},{disabled:!1,state:void 0,class:"default:hover:ring-outline-high"}]}),q=({"aria-label":e,children:t,className:s,ref:l})=>{const{disabled:o,readOnly:c,state:i,setAriaLabel:n,itemsComponent:d}=g();return r.useEffect(()=>{e&&n(e)},[e]),a.jsxs("div",{"data-spark-component":"select-trigger",ref:l,className:pe({className:s,state:i,disabled:o,readOnly:c}),children:[a.jsx("span",{className:"gap-md flex items-center justify-start",children:t}),a.jsx(M.Icon,{className:"ml-md shrink-0",size:"sm",children:a.jsx(oe.ArrowHorizontalDown,{})}),d]})};q.displayName="Select.Trigger";const G=({children:e,className:t,placeholder:s,ref:l})=>{const{selectedItem:o,placeholder:c,disabled:i}=g(),n=o?.value==null,d=s||c;return a.jsx("span",{role:"presentation","data-spark-component":"select-value",ref:l,className:f.cx("flex shrink items-center text-left",t),children:a.jsx("span",{className:f.cx("line-clamp-1 flex-1 overflow-hidden break-all text-ellipsis",n&&!i&&"text-on-surface/dim-1"),children:n?d:e||o?.text})})};G.displayName="Select.Value";const X=Object.assign($,{Group:j,Item:w,Items:P,Placeholder:O,Label:L,Trigger:q,Value:G,LeadingIcon:E});X.displayName="Select";j.displayName="Select.Group";P.displayName="Select.Items";w.displayName="Select.Item";O.displayName="Select.Placeholder";L.displayName="Select.Label";q.displayName="Select.Trigger";G.displayName="Select.Value";E.displayName="Select.LeadingIcon";exports.Select=X;exports.SelectProvider=R;exports.useSelectContext=g;
2
2
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../../src/select/utils.ts","../../src/select/SelectContext.tsx","../../src/select/Select.tsx","../../src/select/SelectItemsGroupContext.tsx","../../src/select/SelectGroup.tsx","../../src/select/SelectItem.tsx","../../src/select/SelectItems.tsx","../../src/select/SelectLabel.tsx","../../src/select/SelectLeadingIcon.tsx","../../src/select/SelectPlaceholder.tsx","../../src/select/SelectTrigger.styles.tsx","../../src/select/SelectTrigger.tsx","../../src/select/SelectValue.tsx","../../src/select/index.ts"],"sourcesContent":["import { Children, type FC, isValidElement, type ReactElement, type ReactNode } from 'react'\n\nimport { type ItemProps } from './SelectItem'\nimport { type ItemsMap, type SelectItem } from './types'\n\nexport const findElement = (children: ReactNode) => (name: string) => {\n const validChildren = Children.toArray(children).filter(isValidElement)\n\n return validChildren.find(child => {\n return getElementDisplayName(child)?.includes(name)\n })\n}\n\nconst getElementDisplayName = (element?: ReactElement) => {\n return element ? (element.type as FC & { displayName?: string }).displayName : ''\n}\n\nconst getOrderedItems = (children: ReactNode, result: SelectItem[] = []): SelectItem[] => {\n Children.forEach(children, child => {\n if (!isValidElement(child)) return\n\n if (\n getElementDisplayName(child) === 'Select.Item' ||\n getElementDisplayName(child) === 'Select.Placeholder'\n ) {\n const childProps = child.props as ItemProps\n result.push({\n value: childProps.value,\n disabled: !!childProps.disabled,\n text: childProps.children,\n })\n }\n\n if ((child.props as { children: ReactNode }).children) {\n getOrderedItems((child.props as { children: ReactNode }).children, result)\n }\n })\n\n return result\n}\n\nexport const getItemsFromChildren = (children: ReactNode): ItemsMap => {\n const newMap: ItemsMap = new Map()\n\n getOrderedItems(children).forEach(itemData => {\n newMap.set(itemData.value, itemData)\n })\n\n return newMap\n}\n","import { useFormFieldControl } from '@spark-ui/components/form-field'\nimport { useCombinedState } from '@spark-ui/hooks/use-combined-state'\nimport {\n createContext,\n Dispatch,\n PropsWithChildren,\n ReactElement,\n SetStateAction,\n useContext,\n useEffect,\n useId,\n useState,\n} from 'react'\n\nimport { type ItemsMap, SelectItem } from './types'\nimport { getItemsFromChildren } from './utils'\n\nexport interface SelectContextState {\n itemsMap: ItemsMap\n disabled: boolean\n readOnly: boolean\n state?: 'error' | 'alert' | 'success'\n itemsComponent: ReactElement | undefined\n selectedItem: SelectItem | undefined\n setValue: (value: string) => void\n isControlled: boolean\n onValueChange?: (value: string) => void\n ariaLabel: string | undefined\n setAriaLabel: Dispatch<SetStateAction<string | undefined>>\n fieldId: string\n fieldLabelId: string | undefined\n name: string | undefined\n required: boolean\n placeholder: string | undefined\n setPlaceholder: Dispatch<SetStateAction<string | undefined>>\n}\n\nexport type SelectContextProps = PropsWithChildren<{\n /**\n * Use `state` prop to assign a specific state to the select, choosing from: `error`, `alert` and `success`. By doing so, the outline styles will be updated.\n */\n state?: 'error' | 'alert' | 'success'\n /**\n * When true, prevents the user from interacting with the select.\n */\n disabled?: boolean\n /**\n * Sets the select as interactive or not.\n */\n readOnly?: boolean\n /**\n * The value of the select when initially rendered. Use when you do not need to control the state of the select.\n */\n defaultValue?: string\n /**\n * The controlled value of the select. Should be used in conjunction with `onValueChange`.\n */\n value?: string\n /**\n * Event handler called when the value changes.\n */\n onValueChange?: (value: string) => void\n\n itemsComponent: ReactElement | undefined\n /**\n * This attribute is used to specify the name of the control.\n * If wrapped with a FormField with a name, will be inherited from it.\n */\n name?: string\n /**\n * A Boolean attribute indicating that an option with a non-empty string value must be selected.\n */\n required?: boolean\n}>\n\nconst SelectContext = createContext<SelectContextState | null>(null)\n\nconst ID_PREFIX = ':select'\n\nexport const SelectProvider = ({\n children,\n defaultValue,\n value: valueProp,\n onValueChange,\n disabled: disabledProp = false,\n readOnly: readOnlyProp = false,\n state: stateProp,\n itemsComponent,\n name: nameProp,\n required: requiredProp,\n}: SelectContextProps) => {\n const [value, setValue] = useCombinedState(valueProp, defaultValue, onValueChange)\n const [placeholder, setPlaceholder] = useState<string | undefined>(undefined)\n const [itemsMap, setItemsMap] = useState<ItemsMap>(getItemsFromChildren(itemsComponent))\n const [ariaLabel, setAriaLabel] = useState<string>()\n\n // Computed state\n const firstItem = itemsMap.entries().next()?.value?.[1]\n const selectedItem = typeof value === 'string' ? itemsMap.get(value) : firstItem\n const isControlled = valueProp != null\n\n // Derivated from FormField context\n const field = useFormFieldControl()\n const state = field.state || stateProp\n\n const internalFieldID = `${ID_PREFIX}-field-${useId()}`\n const fieldId = field.id || internalFieldID\n const fieldLabelId = field.labelId\n const disabled = field.disabled ?? disabledProp\n const readOnly = field.readOnly ?? readOnlyProp\n const name = field.name ?? nameProp\n const required = !!(field.isRequired ?? requiredProp)\n\n /**\n * Indices in a Map are set when an element is added to the Map.\n * If for some reason, in the Select:\n * - items order changes\n * - items are added\n * - items are removed\n *\n * The Map must be rebuilt from the new children in order to preserve logical indices.\n *\n */\n useEffect(() => {\n const newMap = getItemsFromChildren(itemsComponent)\n\n const previousItems = [...itemsMap.values()]\n const newItems = [...newMap.values()]\n\n const hasItemsChanges =\n previousItems.length !== newItems.length ||\n previousItems.some((item, index) => {\n const hasUpdatedValue = item.value !== newItems[index]?.value\n const hasUpdatedText = item.text !== newItems[index]?.text\n\n return hasUpdatedValue || hasUpdatedText\n })\n\n if (hasItemsChanges) {\n setItemsMap(newMap)\n }\n }, [children])\n\n return (\n <SelectContext.Provider\n value={{\n disabled,\n readOnly,\n itemsMap,\n state,\n itemsComponent,\n selectedItem,\n setValue,\n isControlled,\n onValueChange,\n ariaLabel,\n setAriaLabel,\n fieldId,\n fieldLabelId,\n name,\n required,\n placeholder,\n setPlaceholder,\n }}\n >\n {children}\n </SelectContext.Provider>\n )\n}\n\nexport const useSelectContext = () => {\n const context = useContext(SelectContext)\n\n if (!context) {\n throw Error('useSelectContext must be used within a Select provider')\n }\n\n return context\n}\n","import { type SelectContextProps, SelectProvider } from './SelectContext'\nimport { findElement } from './utils'\n\nexport type SelectProps = Omit<SelectContextProps, 'itemsComponent'>\n\nexport const Select = ({ children, ...props }: SelectProps) => {\n const finder = findElement(children)\n const trigger = finder('Trigger')\n const items = finder('Items')\n\n return (\n <SelectProvider {...props} itemsComponent={items}>\n {trigger}\n </SelectProvider>\n )\n}\n\nSelect.displayName = 'Select'\n","import { createContext, type PropsWithChildren, useContext, useState } from 'react'\n\nexport interface SelectContextState {\n groupLabel: string\n setGroupLabel: (label: string) => void\n}\n\ntype SelectContextProps = PropsWithChildren\n\nconst SelectGroupContext = createContext<SelectContextState | null>(null)\n\nexport const SelectGroupProvider = ({ children }: SelectContextProps) => {\n const [groupLabel, setGroupLabel] = useState('')\n\n return (\n <SelectGroupContext.Provider value={{ groupLabel, setGroupLabel }}>\n {children}\n </SelectGroupContext.Provider>\n )\n}\n\nexport const useSelectGroupContext = () => {\n const context = useContext(SelectGroupContext)\n\n if (!context) {\n throw Error('useSelectGroupContext must be used within a SelectGroup provider')\n }\n\n return context\n}\n","import { cx } from 'class-variance-authority'\nimport { ReactNode, type Ref } from 'react'\n\nimport { SelectGroupProvider, useSelectGroupContext } from './SelectItemsGroupContext'\n\ninterface GroupProps {\n children: ReactNode\n className?: string\n ref?: Ref<HTMLOptGroupElement>\n}\n\nexport const Group = ({ children, ref: forwardedRef, ...props }: GroupProps) => {\n return (\n <SelectGroupProvider>\n <GroupContent ref={forwardedRef} {...props}>\n {children}\n </GroupContent>\n </SelectGroupProvider>\n )\n}\n\nconst GroupContent = ({ children, className, ref: forwardedRef }: GroupProps) => {\n const { groupLabel } = useSelectGroupContext()\n\n return (\n <optgroup\n data-spark-component=\"select-group\"\n ref={forwardedRef}\n className={cx(className)}\n label={groupLabel}\n >\n {children}\n </optgroup>\n )\n}\n\nGroup.displayName = 'Select.Group'\n","import { type Ref } from 'react'\n\nexport interface ItemProps {\n disabled?: boolean\n value: string\n children: string\n ref?: Ref<HTMLOptionElement>\n}\n\nexport const Item = ({ disabled = false, value, children, ref: forwardedRef }: ItemProps) => {\n return (\n <option\n data-spark-component=\"select-item\"\n ref={forwardedRef}\n key={value}\n value={value}\n disabled={disabled}\n // label\n >\n {children}\n </option>\n )\n}\n\nItem.displayName = 'Select.Item'\n","import { cva } from 'class-variance-authority'\nimport { ChangeEvent, ComponentPropsWithRef, PropsWithChildren } from 'react'\n\nimport { useSelectContext } from './SelectContext'\n\nexport const styles = cva(\n [\n 'absolute left-0 top-0 size-full rounded-lg opacity-0',\n 'min-h-sz-44',\n // outline styles\n 'ring-1 outline-hidden ring-inset focus:ring-2',\n ],\n {\n variants: {\n state: {\n undefined: 'ring-outline focus:ring-outline-high',\n error: 'ring-error',\n alert: 'ring-alert',\n success: 'ring-success',\n },\n disabled: {\n true: 'cursor-not-allowed',\n },\n readOnly: {\n true: 'cursor-default',\n },\n },\n compoundVariants: [\n {\n disabled: false,\n state: undefined,\n class: 'hover:ring-outline-high',\n },\n ],\n }\n)\n\nexport const Items = ({\n children,\n className,\n ref,\n ...rest\n}: PropsWithChildren<ComponentPropsWithRef<'select'>>) => {\n const {\n state,\n disabled,\n readOnly,\n ariaLabel,\n fieldLabelId,\n isControlled,\n onValueChange,\n selectedItem,\n setValue,\n name,\n required,\n fieldId,\n } = useSelectContext()\n\n const handleChange = (event: ChangeEvent<HTMLSelectElement>) => {\n if (isControlled) {\n event.preventDefault()\n onValueChange?.(event.target.value)\n } else {\n setValue(event.target.value)\n }\n }\n\n return (\n <select\n data-spark-component=\"select-items\"\n ref={ref}\n disabled={disabled || readOnly}\n name={name}\n required={required}\n aria-labelledby={fieldLabelId}\n {...(ariaLabel && { 'aria-label': ariaLabel })}\n className={styles({ className, state, disabled, readOnly })}\n value={selectedItem?.value}\n onChange={handleChange}\n id={fieldId}\n {...rest}\n >\n {children}\n </select>\n )\n}\n\nItems.displayName = 'Select.Items'\n","import { useEffect } from 'react'\n\nimport { useSelectGroupContext } from './SelectItemsGroupContext'\n\ninterface LabelProps {\n children: string\n}\n\nexport const Label = ({ children }: LabelProps) => {\n const { setGroupLabel } = useSelectGroupContext()\n\n useEffect(() => {\n setGroupLabel(children)\n }, [children])\n\n return null\n}\n\nLabel.displayName = 'Select.Label'\n","import { ReactElement } from 'react'\n\nimport { Icon } from '../icon'\n\nexport const LeadingIcon = ({ children }: { children: ReactElement }) => {\n return (\n <Icon size={'sm'} className=\"shrink-0\">\n {children}\n </Icon>\n )\n}\n\nLeadingIcon.displayName = 'Select.LeadingIcon'\n","import { type Ref, useEffect } from 'react'\n\nimport { useSelectContext } from './SelectContext'\n\nexport interface PlaceholderProps {\n disabled?: boolean\n children: string\n ref?: Ref<HTMLOptionElement>\n}\n\nexport const Placeholder = ({\n disabled = false,\n children,\n ref: forwardedRef,\n}: PlaceholderProps) => {\n const { setPlaceholder } = useSelectContext()\n\n useEffect(() => {\n setPlaceholder(children)\n }, [children])\n\n return (\n <option\n data-spark-component=\"select-placeholder\"\n ref={forwardedRef}\n key=\"placeholder\"\n value=\"\"\n disabled={disabled}\n >\n {children}\n </option>\n )\n}\n\nPlaceholder.displayName = 'Select.Placeholder'\n","import { cva } from 'class-variance-authority'\n\nexport const styles = cva(\n [\n 'relative flex w-full items-center justify-between',\n 'min-h-sz-44 rounded-full px-lg',\n 'text-body-1',\n // outline styles\n 'ring-1 outline-hidden ring-inset focus-within:ring-focus',\n ],\n {\n variants: {\n state: {\n undefined: 'ring-outline',\n error: 'ring-error',\n alert: 'ring-alert',\n success: 'ring-success',\n },\n disabled: {\n false: 'focus-within:ring-2',\n },\n readOnly: {\n true: '',\n },\n },\n compoundVariants: [\n {\n readOnly: false,\n disabled: false,\n class: 'bg-surface text-on-surface',\n },\n {\n readOnly: true,\n class: 'bg-on-surface/dim-5 text-on-surface cursor-default',\n },\n {\n disabled: true,\n class: ['bg-on-surface/dim-5 text-on-surface/dim-3', 'cursor-not-allowed'],\n },\n {\n disabled: false,\n state: undefined,\n class: 'default:hover:ring-outline-high',\n },\n ],\n }\n)\n","import { ArrowHorizontalDown } from '@spark-ui/icons/ArrowHorizontalDown'\nimport { ReactNode, type Ref, useEffect } from 'react'\n\nimport { Icon } from '../icon'\nimport { useSelectContext } from './SelectContext'\nimport { styles } from './SelectTrigger.styles'\n\ninterface TriggerProps {\n 'aria-label'?: string\n children: ReactNode\n className?: string\n ref?: Ref<HTMLDivElement>\n}\n\n/**\n * This trigger acts as a fake button for the `select` tag.\n * It is not interactive.\n */\nexport const Trigger = ({\n 'aria-label': ariaLabel,\n children,\n className,\n ref: forwardedRef,\n}: TriggerProps) => {\n const { disabled, readOnly, state, setAriaLabel, itemsComponent } = useSelectContext()\n\n useEffect(() => {\n if (ariaLabel) {\n setAriaLabel(ariaLabel)\n }\n }, [ariaLabel])\n\n return (\n <div\n data-spark-component=\"select-trigger\"\n ref={forwardedRef}\n className={styles({ className, state, disabled, readOnly })}\n >\n <span className=\"gap-md flex items-center justify-start\">{children}</span>\n\n <Icon className=\"ml-md shrink-0\" size=\"sm\">\n <ArrowHorizontalDown />\n </Icon>\n\n {itemsComponent}\n </div>\n )\n}\n\nTrigger.displayName = 'Select.Trigger'\n","import { cx } from 'class-variance-authority'\nimport { ReactNode, type Ref } from 'react'\n\nimport { useSelectContext } from './SelectContext'\n\nexport interface ValueProps {\n children?: ReactNode\n className?: string\n /**\n * Optional placeholder value for the trigger.\n * If not specified, the value inside `Select.Placeholder` item will be used.\n */\n placeholder?: string\n ref?: Ref<HTMLSpanElement>\n}\n\nexport const Value = ({\n children,\n className,\n placeholder: customPlaceholder,\n ref: forwardedRef,\n}: ValueProps) => {\n const { selectedItem, placeholder, disabled } = useSelectContext()\n\n const isPlaceholderSelected = selectedItem?.value == null\n const valuePlaceholder = customPlaceholder || placeholder\n\n return (\n <span\n role=\"presentation\"\n data-spark-component=\"select-value\"\n ref={forwardedRef}\n className={cx('flex shrink items-center text-left', className)}\n >\n <span\n className={cx(\n 'line-clamp-1 flex-1 overflow-hidden break-all text-ellipsis',\n isPlaceholderSelected && !disabled && 'text-on-surface/dim-1'\n )}\n >\n {isPlaceholderSelected ? valuePlaceholder : children || selectedItem?.text}\n </span>\n </span>\n )\n}\n\nValue.displayName = 'Select.Value'\n","import { Select as Root } from './Select'\nimport { SelectProvider, useSelectContext } from './SelectContext'\nimport { Group } from './SelectGroup'\nimport { Item } from './SelectItem'\nimport { Items } from './SelectItems'\nimport { Label } from './SelectLabel'\nimport { LeadingIcon } from './SelectLeadingIcon'\nimport { Placeholder } from './SelectPlaceholder'\nimport { Trigger } from './SelectTrigger'\nimport { Value } from './SelectValue'\n\nexport { useSelectContext, SelectProvider }\n\nexport const Select: typeof Root & {\n Group: typeof Group\n Item: typeof Item\n Items: typeof Items\n Placeholder: typeof Placeholder\n Label: typeof Label\n Trigger: typeof Trigger\n Value: typeof Value\n LeadingIcon: typeof LeadingIcon\n} = Object.assign(Root, {\n Group,\n Item,\n Items,\n Placeholder,\n Label,\n Trigger,\n Value,\n LeadingIcon,\n})\n\nSelect.displayName = 'Select'\nGroup.displayName = 'Select.Group'\nItems.displayName = 'Select.Items'\nItem.displayName = 'Select.Item'\nPlaceholder.displayName = 'Select.Placeholder'\nLabel.displayName = 'Select.Label'\nTrigger.displayName = 'Select.Trigger'\nValue.displayName = 'Select.Value'\nLeadingIcon.displayName = 'Select.LeadingIcon'\n"],"names":["findElement","children","name","Children","isValidElement","child","getElementDisplayName","element","getOrderedItems","result","childProps","getItemsFromChildren","newMap","itemData","SelectContext","createContext","ID_PREFIX","SelectProvider","defaultValue","valueProp","onValueChange","disabledProp","readOnlyProp","stateProp","itemsComponent","nameProp","requiredProp","value","setValue","useCombinedState","placeholder","setPlaceholder","useState","itemsMap","setItemsMap","ariaLabel","setAriaLabel","firstItem","selectedItem","isControlled","field","useFormFieldControl","state","internalFieldID","useId","fieldId","fieldLabelId","disabled","readOnly","required","useEffect","previousItems","newItems","item","index","hasUpdatedValue","hasUpdatedText","jsx","useSelectContext","context","useContext","Select","props","finder","trigger","items","SelectGroupContext","SelectGroupProvider","groupLabel","setGroupLabel","useSelectGroupContext","Group","forwardedRef","GroupContent","className","cx","Item","styles","cva","Items","ref","rest","handleChange","event","Label","LeadingIcon","Icon","Placeholder","Trigger","jsxs","ArrowHorizontalDown","Value","customPlaceholder","isPlaceholderSelected","valuePlaceholder","Root"],"mappings":"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"}
1
+ {"version":3,"file":"index.js","sources":["../../src/select/utils.ts","../../src/select/SelectContext.tsx","../../src/select/Select.tsx","../../src/select/SelectItemsGroupContext.tsx","../../src/select/SelectGroup.tsx","../../src/select/SelectItem.tsx","../../src/select/SelectItems.tsx","../../src/select/SelectLabel.tsx","../../src/select/SelectLeadingIcon.tsx","../../src/select/SelectPlaceholder.tsx","../../src/select/SelectTrigger.styles.tsx","../../src/select/SelectTrigger.tsx","../../src/select/SelectValue.tsx","../../src/select/index.ts"],"sourcesContent":["import { Children, type FC, isValidElement, type ReactElement, type ReactNode } from 'react'\n\nimport { type ItemProps } from './SelectItem'\nimport { type ItemsMap, type SelectItem } from './types'\n\nexport const findElement = (children: ReactNode) => (name: string) => {\n const validChildren = Children.toArray(children).filter(isValidElement)\n\n return validChildren.find(child => {\n return getElementDisplayName(child)?.includes(name)\n })\n}\n\nconst getElementDisplayName = (element?: ReactElement) => {\n return element ? (element.type as FC & { displayName?: string }).displayName : ''\n}\n\nconst getOrderedItems = (children: ReactNode, result: SelectItem[] = []): SelectItem[] => {\n Children.forEach(children, child => {\n if (!isValidElement(child)) return\n\n if (\n getElementDisplayName(child) === 'Select.Item' ||\n getElementDisplayName(child) === 'Select.Placeholder'\n ) {\n const childProps = child.props as ItemProps\n result.push({\n value: childProps.value,\n disabled: !!childProps.disabled,\n text: childProps.children,\n })\n }\n\n if ((child.props as { children: ReactNode }).children) {\n getOrderedItems((child.props as { children: ReactNode }).children, result)\n }\n })\n\n return result\n}\n\nexport const getItemsFromChildren = (children: ReactNode): ItemsMap => {\n const newMap: ItemsMap = new Map()\n\n getOrderedItems(children).forEach(itemData => {\n newMap.set(itemData.value, itemData)\n })\n\n return newMap\n}\n","import { useFormFieldControl } from '@spark-ui/components/form-field'\nimport { useCombinedState } from '@spark-ui/hooks/use-combined-state'\nimport {\n createContext,\n Dispatch,\n PropsWithChildren,\n ReactElement,\n SetStateAction,\n useContext,\n useEffect,\n useId,\n useState,\n} from 'react'\n\nimport { type ItemsMap, SelectItem } from './types'\nimport { getItemsFromChildren } from './utils'\n\nexport interface SelectContextState {\n itemsMap: ItemsMap\n disabled: boolean\n readOnly: boolean\n state?: 'error' | 'alert' | 'success'\n itemsComponent: ReactElement | undefined\n selectedItem: SelectItem | undefined\n setValue: (value: string) => void\n isControlled: boolean\n onValueChange?: (value: string) => void\n ariaLabel: string | undefined\n setAriaLabel: Dispatch<SetStateAction<string | undefined>>\n fieldId: string\n fieldLabelId: string | undefined\n name: string | undefined\n required: boolean\n placeholder: string | undefined\n setPlaceholder: Dispatch<SetStateAction<string | undefined>>\n}\n\nexport type SelectContextProps = PropsWithChildren<{\n /**\n * Use `state` prop to assign a specific state to the select, choosing from: `error`, `alert` and `success`. By doing so, the outline styles will be updated.\n */\n state?: 'error' | 'alert' | 'success'\n /**\n * When true, prevents the user from interacting with the select.\n */\n disabled?: boolean\n /**\n * Sets the select as interactive or not.\n */\n readOnly?: boolean\n /**\n * The value of the select when initially rendered. Use when you do not need to control the state of the select.\n */\n defaultValue?: string\n /**\n * The controlled value of the select. Should be used in conjunction with `onValueChange`.\n */\n value?: string\n /**\n * Event handler called when the value changes.\n */\n onValueChange?: (value: string) => void\n\n itemsComponent: ReactElement | undefined\n /**\n * This attribute is used to specify the name of the control.\n * If wrapped with a FormField with a name, will be inherited from it.\n */\n name?: string\n /**\n * A Boolean attribute indicating that an option with a non-empty string value must be selected.\n */\n required?: boolean\n}>\n\nconst SelectContext = createContext<SelectContextState | null>(null)\n\nconst ID_PREFIX = ':select'\n\nexport const SelectProvider = ({\n children,\n defaultValue,\n value: valueProp,\n onValueChange,\n disabled: disabledProp = false,\n readOnly: readOnlyProp = false,\n state: stateProp,\n itemsComponent,\n name: nameProp,\n required: requiredProp,\n}: SelectContextProps) => {\n const [value, setValue] = useCombinedState(valueProp, defaultValue, onValueChange)\n const [placeholder, setPlaceholder] = useState<string | undefined>(undefined)\n const [itemsMap, setItemsMap] = useState<ItemsMap>(getItemsFromChildren(itemsComponent))\n const [ariaLabel, setAriaLabel] = useState<string>()\n\n // Computed state\n const firstItem = itemsMap.entries().next()?.value?.[1]\n const selectedItem = typeof value === 'string' ? itemsMap.get(value) : firstItem\n const isControlled = valueProp != null\n\n // Derivated from FormField context\n const field = useFormFieldControl()\n const state = field.state || stateProp\n\n const internalFieldID = `${ID_PREFIX}-field-${useId()}`\n const fieldId = field.id || internalFieldID\n const fieldLabelId = field.labelId\n const disabled = field.disabled ?? disabledProp\n const readOnly = field.readOnly ?? readOnlyProp\n const name = field.name ?? nameProp\n const required = !!(field.isRequired ?? requiredProp)\n\n /**\n * Indices in a Map are set when an element is added to the Map.\n * If for some reason, in the Select:\n * - items order changes\n * - items are added\n * - items are removed\n *\n * The Map must be rebuilt from the new children in order to preserve logical indices.\n *\n */\n useEffect(() => {\n const newMap = getItemsFromChildren(itemsComponent)\n\n const previousItems = [...itemsMap.values()]\n const newItems = [...newMap.values()]\n\n const hasItemsChanges =\n previousItems.length !== newItems.length ||\n previousItems.some((item, index) => {\n const hasUpdatedValue = item.value !== newItems[index]?.value\n const hasUpdatedText = item.text !== newItems[index]?.text\n\n return hasUpdatedValue || hasUpdatedText\n })\n\n if (hasItemsChanges) {\n setItemsMap(newMap)\n }\n }, [children])\n\n return (\n <SelectContext.Provider\n value={{\n disabled,\n readOnly,\n itemsMap,\n state,\n itemsComponent,\n selectedItem,\n setValue,\n isControlled,\n onValueChange,\n ariaLabel,\n setAriaLabel,\n fieldId,\n fieldLabelId,\n name,\n required,\n placeholder,\n setPlaceholder,\n }}\n >\n {children}\n </SelectContext.Provider>\n )\n}\n\nexport const useSelectContext = () => {\n const context = useContext(SelectContext)\n\n if (!context) {\n throw Error('useSelectContext must be used within a Select provider')\n }\n\n return context\n}\n","import { type SelectContextProps, SelectProvider } from './SelectContext'\nimport { findElement } from './utils'\n\nexport type SelectProps = Omit<SelectContextProps, 'itemsComponent'>\n\nexport const Select = ({ children, ...props }: SelectProps) => {\n const finder = findElement(children)\n const trigger = finder('Trigger')\n const items = finder('Items')\n\n return (\n <SelectProvider {...props} itemsComponent={items}>\n {trigger}\n </SelectProvider>\n )\n}\n\nSelect.displayName = 'Select'\n","import { createContext, type PropsWithChildren, useContext, useState } from 'react'\n\nexport interface SelectContextState {\n groupLabel: string\n setGroupLabel: (label: string) => void\n}\n\ntype SelectContextProps = PropsWithChildren\n\nconst SelectGroupContext = createContext<SelectContextState | null>(null)\n\nexport const SelectGroupProvider = ({ children }: SelectContextProps) => {\n const [groupLabel, setGroupLabel] = useState('')\n\n return (\n <SelectGroupContext.Provider value={{ groupLabel, setGroupLabel }}>\n {children}\n </SelectGroupContext.Provider>\n )\n}\n\nexport const useSelectGroupContext = () => {\n const context = useContext(SelectGroupContext)\n\n if (!context) {\n throw Error('useSelectGroupContext must be used within a SelectGroup provider')\n }\n\n return context\n}\n","import { cx } from 'class-variance-authority'\nimport { ReactNode, type Ref } from 'react'\n\nimport { SelectGroupProvider, useSelectGroupContext } from './SelectItemsGroupContext'\n\ninterface GroupProps {\n children: ReactNode\n className?: string\n ref?: Ref<HTMLOptGroupElement>\n}\n\nexport const Group = ({ children, ref: forwardedRef, ...props }: GroupProps) => {\n return (\n <SelectGroupProvider>\n <GroupContent ref={forwardedRef} {...props}>\n {children}\n </GroupContent>\n </SelectGroupProvider>\n )\n}\n\nconst GroupContent = ({ children, className, ref: forwardedRef }: GroupProps) => {\n const { groupLabel } = useSelectGroupContext()\n\n return (\n <optgroup\n data-spark-component=\"select-group\"\n ref={forwardedRef}\n className={cx(className)}\n label={groupLabel}\n >\n {children}\n </optgroup>\n )\n}\n\nGroup.displayName = 'Select.Group'\n","import { type Ref } from 'react'\n\nexport interface ItemProps {\n disabled?: boolean\n value: string\n children: string\n ref?: Ref<HTMLOptionElement>\n}\n\nexport const Item = ({ disabled = false, value, children, ref: forwardedRef }: ItemProps) => {\n return (\n <option\n data-spark-component=\"select-item\"\n ref={forwardedRef}\n key={value}\n value={value}\n disabled={disabled}\n // label\n >\n {children}\n </option>\n )\n}\n\nItem.displayName = 'Select.Item'\n","import { cva } from 'class-variance-authority'\nimport { ChangeEvent, ComponentPropsWithRef, PropsWithChildren } from 'react'\n\nimport { useSelectContext } from './SelectContext'\n\nexport const styles = cva(\n [\n 'absolute left-0 top-0 size-full rounded-lg opacity-0',\n 'min-h-sz-44',\n // outline styles\n 'ring-1 outline-hidden ring-inset focus:ring-2',\n ],\n {\n variants: {\n state: {\n undefined: 'ring-outline focus:ring-outline-high',\n error: 'ring-error',\n alert: 'ring-alert',\n success: 'ring-success',\n },\n disabled: {\n true: 'cursor-not-allowed',\n },\n readOnly: {\n true: 'cursor-default',\n },\n },\n compoundVariants: [\n {\n disabled: false,\n state: undefined,\n class: 'hover:ring-outline-high',\n },\n ],\n }\n)\n\nexport const Items = ({\n children,\n className,\n ref,\n ...rest\n}: PropsWithChildren<ComponentPropsWithRef<'select'>>) => {\n const {\n state,\n disabled,\n readOnly,\n ariaLabel,\n fieldLabelId,\n isControlled,\n onValueChange,\n selectedItem,\n setValue,\n name,\n required,\n fieldId,\n } = useSelectContext()\n\n const handleChange = (event: ChangeEvent<HTMLSelectElement>) => {\n if (isControlled) {\n event.preventDefault()\n onValueChange?.(event.target.value)\n } else {\n setValue(event.target.value)\n }\n }\n\n return (\n <select\n data-spark-component=\"select-items\"\n ref={ref}\n disabled={disabled || readOnly}\n name={name}\n required={required}\n aria-labelledby={fieldLabelId}\n {...(ariaLabel && { 'aria-label': ariaLabel })}\n className={styles({ className, state, disabled, readOnly })}\n value={selectedItem?.value}\n onChange={handleChange}\n id={fieldId}\n {...rest}\n >\n {children}\n </select>\n )\n}\n\nItems.displayName = 'Select.Items'\n","import { useEffect } from 'react'\n\nimport { useSelectGroupContext } from './SelectItemsGroupContext'\n\ninterface LabelProps {\n children: string\n}\n\nexport const Label = ({ children }: LabelProps) => {\n const { setGroupLabel } = useSelectGroupContext()\n\n useEffect(() => {\n setGroupLabel(children)\n }, [children])\n\n return null\n}\n\nLabel.displayName = 'Select.Label'\n","import { ReactElement } from 'react'\n\nimport { Icon } from '../icon'\n\nexport const LeadingIcon = ({ children }: { children: ReactElement }) => {\n return (\n <Icon size={'sm'} className=\"shrink-0\">\n {children}\n </Icon>\n )\n}\n\nLeadingIcon.displayName = 'Select.LeadingIcon'\n","import { type Ref, useEffect } from 'react'\n\nimport { useSelectContext } from './SelectContext'\n\nexport interface PlaceholderProps {\n disabled?: boolean\n children: string\n ref?: Ref<HTMLOptionElement>\n}\n\nexport const Placeholder = ({\n disabled = false,\n children,\n ref: forwardedRef,\n}: PlaceholderProps) => {\n const { setPlaceholder } = useSelectContext()\n\n useEffect(() => {\n setPlaceholder(children)\n }, [children])\n\n return (\n <option\n data-spark-component=\"select-placeholder\"\n ref={forwardedRef}\n key=\"placeholder\"\n value=\"\"\n disabled={disabled}\n >\n {children}\n </option>\n )\n}\n\nPlaceholder.displayName = 'Select.Placeholder'\n","import { cva } from 'class-variance-authority'\n\nexport const styles = cva(\n [\n 'relative flex w-full items-center justify-between',\n 'min-h-sz-44 rounded-lg px-lg',\n 'text-body-1',\n // outline styles\n 'ring-1 outline-hidden ring-inset focus-within:ring-focus',\n ],\n {\n variants: {\n state: {\n undefined: 'ring-outline',\n error: 'ring-error',\n alert: 'ring-alert',\n success: 'ring-success',\n },\n disabled: {\n false: 'focus-within:ring-2',\n },\n readOnly: {\n true: '',\n },\n },\n compoundVariants: [\n {\n readOnly: false,\n disabled: false,\n class: 'bg-surface text-on-surface',\n },\n {\n readOnly: true,\n class: 'bg-on-surface/dim-5 text-on-surface cursor-default',\n },\n {\n disabled: true,\n class: ['bg-on-surface/dim-5 text-on-surface/dim-3', 'cursor-not-allowed'],\n },\n {\n disabled: false,\n state: undefined,\n class: 'default:hover:ring-outline-high',\n },\n ],\n }\n)\n","import { ArrowHorizontalDown } from '@spark-ui/icons/ArrowHorizontalDown'\nimport { ReactNode, type Ref, useEffect } from 'react'\n\nimport { Icon } from '../icon'\nimport { useSelectContext } from './SelectContext'\nimport { styles } from './SelectTrigger.styles'\n\ninterface TriggerProps {\n 'aria-label'?: string\n children: ReactNode\n className?: string\n ref?: Ref<HTMLDivElement>\n}\n\n/**\n * This trigger acts as a fake button for the `select` tag.\n * It is not interactive.\n */\nexport const Trigger = ({\n 'aria-label': ariaLabel,\n children,\n className,\n ref: forwardedRef,\n}: TriggerProps) => {\n const { disabled, readOnly, state, setAriaLabel, itemsComponent } = useSelectContext()\n\n useEffect(() => {\n if (ariaLabel) {\n setAriaLabel(ariaLabel)\n }\n }, [ariaLabel])\n\n return (\n <div\n data-spark-component=\"select-trigger\"\n ref={forwardedRef}\n className={styles({ className, state, disabled, readOnly })}\n >\n <span className=\"gap-md flex items-center justify-start\">{children}</span>\n\n <Icon className=\"ml-md shrink-0\" size=\"sm\">\n <ArrowHorizontalDown />\n </Icon>\n\n {itemsComponent}\n </div>\n )\n}\n\nTrigger.displayName = 'Select.Trigger'\n","import { cx } from 'class-variance-authority'\nimport { ReactNode, type Ref } from 'react'\n\nimport { useSelectContext } from './SelectContext'\n\nexport interface ValueProps {\n children?: ReactNode\n className?: string\n /**\n * Optional placeholder value for the trigger.\n * If not specified, the value inside `Select.Placeholder` item will be used.\n */\n placeholder?: string\n ref?: Ref<HTMLSpanElement>\n}\n\nexport const Value = ({\n children,\n className,\n placeholder: customPlaceholder,\n ref: forwardedRef,\n}: ValueProps) => {\n const { selectedItem, placeholder, disabled } = useSelectContext()\n\n const isPlaceholderSelected = selectedItem?.value == null\n const valuePlaceholder = customPlaceholder || placeholder\n\n return (\n <span\n role=\"presentation\"\n data-spark-component=\"select-value\"\n ref={forwardedRef}\n className={cx('flex shrink items-center text-left', className)}\n >\n <span\n className={cx(\n 'line-clamp-1 flex-1 overflow-hidden break-all text-ellipsis',\n isPlaceholderSelected && !disabled && 'text-on-surface/dim-1'\n )}\n >\n {isPlaceholderSelected ? valuePlaceholder : children || selectedItem?.text}\n </span>\n </span>\n )\n}\n\nValue.displayName = 'Select.Value'\n","import { Select as Root } from './Select'\nimport { SelectProvider, useSelectContext } from './SelectContext'\nimport { Group } from './SelectGroup'\nimport { Item } from './SelectItem'\nimport { Items } from './SelectItems'\nimport { Label } from './SelectLabel'\nimport { LeadingIcon } from './SelectLeadingIcon'\nimport { Placeholder } from './SelectPlaceholder'\nimport { Trigger } from './SelectTrigger'\nimport { Value } from './SelectValue'\n\nexport { useSelectContext, SelectProvider }\n\nexport const Select: typeof Root & {\n Group: typeof Group\n Item: typeof Item\n Items: typeof Items\n Placeholder: typeof Placeholder\n Label: typeof Label\n Trigger: typeof Trigger\n Value: typeof Value\n LeadingIcon: typeof LeadingIcon\n} = Object.assign(Root, {\n Group,\n Item,\n Items,\n Placeholder,\n Label,\n Trigger,\n Value,\n LeadingIcon,\n})\n\nSelect.displayName = 'Select'\nGroup.displayName = 'Select.Group'\nItems.displayName = 'Select.Items'\nItem.displayName = 'Select.Item'\nPlaceholder.displayName = 'Select.Placeholder'\nLabel.displayName = 'Select.Label'\nTrigger.displayName = 'Select.Trigger'\nValue.displayName = 'Select.Value'\nLeadingIcon.displayName = 'Select.LeadingIcon'\n"],"names":["findElement","children","name","Children","isValidElement","child","getElementDisplayName","element","getOrderedItems","result","childProps","getItemsFromChildren","newMap","itemData","SelectContext","createContext","ID_PREFIX","SelectProvider","defaultValue","valueProp","onValueChange","disabledProp","readOnlyProp","stateProp","itemsComponent","nameProp","requiredProp","value","setValue","useCombinedState","placeholder","setPlaceholder","useState","itemsMap","setItemsMap","ariaLabel","setAriaLabel","firstItem","selectedItem","isControlled","field","useFormFieldControl","state","internalFieldID","useId","fieldId","fieldLabelId","disabled","readOnly","required","useEffect","previousItems","newItems","item","index","hasUpdatedValue","hasUpdatedText","jsx","useSelectContext","context","useContext","Select","props","finder","trigger","items","SelectGroupContext","SelectGroupProvider","groupLabel","setGroupLabel","useSelectGroupContext","Group","forwardedRef","GroupContent","className","cx","Item","styles","cva","Items","ref","rest","handleChange","event","Label","LeadingIcon","Icon","Placeholder","Trigger","jsxs","ArrowHorizontalDown","Value","customPlaceholder","isPlaceholderSelected","valuePlaceholder","Root"],"mappings":"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"}
@@ -215,7 +215,7 @@ E.displayName = "Select.Placeholder";
215
215
  const Se = U(
216
216
  [
217
217
  "relative flex w-full items-center justify-between",
218
- "min-h-sz-44 rounded-full px-lg",
218
+ "min-h-sz-44 rounded-lg px-lg",
219
219
  "text-body-1",
220
220
  // outline styles
221
221
  "ring-1 outline-hidden ring-inset focus-within:ring-focus"