@spark-ui/components 14.0.0 → 14.1.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 (56) hide show
  1. package/dist/DialogContent.styles-CziMQtYr.js +2 -0
  2. package/dist/DialogContent.styles-CziMQtYr.js.map +1 -0
  3. package/dist/{DialogContent.styles-BSfXHt21.mjs → DialogContent.styles-Du7_Dkde.mjs} +5 -6
  4. package/dist/DialogContent.styles-Du7_Dkde.mjs.map +1 -0
  5. package/dist/alert-dialog/index.js +1 -1
  6. package/dist/alert-dialog/index.js.map +1 -1
  7. package/dist/alert-dialog/index.mjs +12 -12
  8. package/dist/alert-dialog/index.mjs.map +1 -1
  9. package/dist/circular-meter/CircularMeter.d.ts +34 -0
  10. package/dist/circular-meter/CircularMeter.styles.d.ts +5 -0
  11. package/dist/circular-meter/CircularMeterContent.d.ts +6 -0
  12. package/dist/circular-meter/CircularMeterContext.d.ts +36 -0
  13. package/dist/circular-meter/CircularMeterLabel.d.ts +7 -0
  14. package/dist/circular-meter/CircularMeterTrack.d.ts +8 -0
  15. package/dist/circular-meter/CircularMeterValue.d.ts +7 -0
  16. package/dist/circular-meter/index.d.mts +16 -0
  17. package/dist/circular-meter/index.d.ts +16 -0
  18. package/dist/circular-meter/index.js +2 -0
  19. package/dist/circular-meter/index.js.map +1 -0
  20. package/dist/circular-meter/index.mjs +316 -0
  21. package/dist/circular-meter/index.mjs.map +1 -0
  22. package/dist/circular-meter/useIntersectionAnimation.d.ts +26 -0
  23. package/dist/dialog/index.js +1 -1
  24. package/dist/dialog/index.mjs +1 -1
  25. package/dist/meter/Meter.d.ts +18 -0
  26. package/dist/meter/MeterContext.d.ts +12 -0
  27. package/dist/meter/MeterLabel.d.ts +7 -0
  28. package/dist/meter/MeterTrack.d.ts +7 -0
  29. package/dist/meter/MeterTrack.styles.d.ts +8 -0
  30. package/dist/meter/MeterValue.d.ts +7 -0
  31. package/dist/meter/index.d.mts +13 -0
  32. package/dist/meter/index.d.ts +13 -0
  33. package/dist/meter/index.js +2 -0
  34. package/dist/meter/index.js.map +1 -0
  35. package/dist/meter/index.mjs +177 -0
  36. package/dist/meter/index.mjs.map +1 -0
  37. package/dist/meter/useIntersectionAnimation.d.ts +26 -0
  38. package/dist/progress/Progress.d.ts +14 -6
  39. package/dist/progress/ProgressContext.d.ts +3 -3
  40. package/dist/progress/ProgressIndicator.d.ts +9 -2
  41. package/dist/progress/ProgressLabel.d.ts +3 -2
  42. package/dist/progress/ProgressTrack.d.ts +7 -0
  43. package/dist/progress/ProgressValue.d.ts +7 -0
  44. package/dist/progress/index.d.mts +6 -6
  45. package/dist/progress/index.d.ts +6 -6
  46. package/dist/progress/index.js +1 -1
  47. package/dist/progress/index.js.map +1 -1
  48. package/dist/progress/index.mjs +122 -111
  49. package/dist/progress/index.mjs.map +1 -1
  50. package/package.json +4 -4
  51. package/dist/DialogContent.styles-BSfXHt21.mjs.map +0 -1
  52. package/dist/DialogContent.styles-bBs6l8Cy.js +0 -2
  53. package/dist/DialogContent.styles-bBs6l8Cy.js.map +0 -1
  54. package/dist/progress/ProgressBar.d.ts +0 -6
  55. package/dist/progress/ProgressBar.styles.d.ts +0 -5
  56. package/dist/progress/ProgressIndicator.styles.d.ts +0 -7
@@ -0,0 +1,2 @@
1
+ "use strict";const a=require("class-variance-authority"),e=a.cva(["z-modal flex flex-col bg-surface group transition-all","focus-visible:outline-hidden focus-visible:u-outline","[&:not(:has(footer))]:pb-lg","[&:not(:has(header))]:pt-lg","data-open:animation-duration-400 data-closed:animation-duration-200","data-starting-style:scale-90 data-starting-style:opacity-0","data-ending-style:scale-90 data-ending-style:opacity-0","data-nested-dialog-open:after:pointer-events-none","after:bg-transparent","after:transition-all","after:duration-200","data-nested-dialog-open:after:inset-0","data-nested-dialog-open:after:absolute","data-nested-dialog-open:after:rounded-[inherit]","data-nested-dialog-open:after:bg-overlay/dim-3"],{variants:{size:{fullscreen:"fixed size-full top-0 left-0",sm:"max-w-[min(480px,calc(100vw-2rem))] data-nested-dialog-open:scale-90",md:"max-w-[min(672px,calc(100vw-2rem))] data-nested-dialog-open:scale-90",lg:"max-w-[min(864px,calc(100vw-2rem))] data-nested-dialog-open:scale-90"},isNarrow:{true:["max-w-[calc(100vw-2rem)]"],false:[]}},compoundVariants:[{size:["sm","md","lg"],class:["fixed top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2","max-h-[80%]","shadow-md rounded-lg","data-open:animate-fade-in","data-closed:animate-fade-out"]},{size:["sm","md","lg"],isNarrow:!1,class:["w-full"]}],defaultVariants:{size:"md",isNarrow:!1}});exports.dialogContentStyles=e;
2
+ //# sourceMappingURL=DialogContent.styles-CziMQtYr.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"DialogContent.styles-CziMQtYr.js","sources":["../src/dialog/DialogContent.styles.tsx"],"sourcesContent":["import { cva, VariantProps } from 'class-variance-authority'\n\nexport const dialogContentStyles = cva(\n [\n 'z-modal flex flex-col bg-surface group transition-all',\n 'focus-visible:outline-hidden focus-visible:u-outline',\n '[&:not(:has(footer))]:pb-lg',\n '[&:not(:has(header))]:pt-lg',\n 'data-open:animation-duration-400 data-closed:animation-duration-200',\n 'data-starting-style:scale-90 data-starting-style:opacity-0',\n 'data-ending-style:scale-90 data-ending-style:opacity-0',\n // Nested dialog effect\n 'data-nested-dialog-open:after:pointer-events-none',\n 'after:bg-transparent',\n 'after:transition-all',\n 'after:duration-200',\n 'data-nested-dialog-open:after:inset-0',\n 'data-nested-dialog-open:after:absolute',\n 'data-nested-dialog-open:after:rounded-[inherit]',\n 'data-nested-dialog-open:after:bg-overlay/dim-3',\n ],\n {\n variants: {\n size: {\n fullscreen: 'fixed size-full top-0 left-0',\n sm: 'max-w-[min(480px,calc(100vw-2rem))] data-nested-dialog-open:scale-90',\n md: 'max-w-[min(672px,calc(100vw-2rem))] data-nested-dialog-open:scale-90',\n lg: 'max-w-[min(864px,calc(100vw-2rem))] data-nested-dialog-open:scale-90',\n },\n isNarrow: {\n true: ['max-w-[calc(100vw-2rem)]'],\n false: [],\n },\n },\n compoundVariants: [\n {\n size: ['sm', 'md', 'lg'],\n class: [\n 'fixed top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2',\n 'max-h-[80%]',\n 'shadow-md rounded-lg',\n 'data-open:animate-fade-in',\n 'data-closed:animate-fade-out',\n ],\n },\n {\n size: ['sm', 'md', 'lg'],\n isNarrow: false,\n class: ['w-full'],\n },\n ],\n defaultVariants: {\n size: 'md',\n isNarrow: false,\n },\n }\n)\n\nexport type DialogContentStylesProps = VariantProps<typeof dialogContentStyles>\n"],"names":["dialogContentStyles","cva"],"mappings":"yDAEaA,EAAsBC,EAAAA,IACjC,CACE,wDACA,uDACA,8BACA,8BACA,sEACA,6DACA,yDAEA,oDACA,uBACA,uBACA,qBACA,wCACA,yCACA,kDACA,gDAAA,EAEF,CACE,SAAU,CACR,KAAM,CACJ,WAAY,+BACZ,GAAI,uEACJ,GAAI,uEACJ,GAAI,sEAAA,EAEN,SAAU,CACR,KAAM,CAAC,0BAA0B,EACjC,MAAO,CAAA,CAAC,CACV,EAEF,iBAAkB,CAChB,CACE,KAAM,CAAC,KAAM,KAAM,IAAI,EACvB,MAAO,CACL,2DACA,cACA,uBACA,4BACA,8BAAA,CACF,EAEF,CACE,KAAM,CAAC,KAAM,KAAM,IAAI,EACvB,SAAU,GACV,MAAO,CAAC,QAAQ,CAAA,CAClB,EAEF,gBAAiB,CACf,KAAM,KACN,SAAU,EAAA,CACZ,CAEJ"}
@@ -9,7 +9,6 @@ const t = a(
9
9
  "data-starting-style:scale-90 data-starting-style:opacity-0",
10
10
  "data-ending-style:scale-90 data-ending-style:opacity-0",
11
11
  // Nested dialog effect
12
- "data-nested-dialog-open:scale-90",
13
12
  "data-nested-dialog-open:after:pointer-events-none",
14
13
  "after:bg-transparent",
15
14
  "after:transition-all",
@@ -23,12 +22,12 @@ const t = a(
23
22
  variants: {
24
23
  size: {
25
24
  fullscreen: "fixed size-full top-0 left-0",
26
- sm: "max-w-sz-480",
27
- md: "max-w-sz-672",
28
- lg: "max-w-sz-864"
25
+ sm: "max-w-[min(480px,calc(100vw-2rem))] data-nested-dialog-open:scale-90",
26
+ md: "max-w-[min(672px,calc(100vw-2rem))] data-nested-dialog-open:scale-90",
27
+ lg: "max-w-[min(864px,calc(100vw-2rem))] data-nested-dialog-open:scale-90"
29
28
  },
30
29
  isNarrow: {
31
- true: [],
30
+ true: ["max-w-[calc(100vw-2rem)]"],
32
31
  false: []
33
32
  }
34
33
  },
@@ -58,4 +57,4 @@ const t = a(
58
57
  export {
59
58
  t as d
60
59
  };
61
- //# sourceMappingURL=DialogContent.styles-BSfXHt21.mjs.map
60
+ //# sourceMappingURL=DialogContent.styles-Du7_Dkde.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"DialogContent.styles-Du7_Dkde.mjs","sources":["../src/dialog/DialogContent.styles.tsx"],"sourcesContent":["import { cva, VariantProps } from 'class-variance-authority'\n\nexport const dialogContentStyles = cva(\n [\n 'z-modal flex flex-col bg-surface group transition-all',\n 'focus-visible:outline-hidden focus-visible:u-outline',\n '[&:not(:has(footer))]:pb-lg',\n '[&:not(:has(header))]:pt-lg',\n 'data-open:animation-duration-400 data-closed:animation-duration-200',\n 'data-starting-style:scale-90 data-starting-style:opacity-0',\n 'data-ending-style:scale-90 data-ending-style:opacity-0',\n // Nested dialog effect\n 'data-nested-dialog-open:after:pointer-events-none',\n 'after:bg-transparent',\n 'after:transition-all',\n 'after:duration-200',\n 'data-nested-dialog-open:after:inset-0',\n 'data-nested-dialog-open:after:absolute',\n 'data-nested-dialog-open:after:rounded-[inherit]',\n 'data-nested-dialog-open:after:bg-overlay/dim-3',\n ],\n {\n variants: {\n size: {\n fullscreen: 'fixed size-full top-0 left-0',\n sm: 'max-w-[min(480px,calc(100vw-2rem))] data-nested-dialog-open:scale-90',\n md: 'max-w-[min(672px,calc(100vw-2rem))] data-nested-dialog-open:scale-90',\n lg: 'max-w-[min(864px,calc(100vw-2rem))] data-nested-dialog-open:scale-90',\n },\n isNarrow: {\n true: ['max-w-[calc(100vw-2rem)]'],\n false: [],\n },\n },\n compoundVariants: [\n {\n size: ['sm', 'md', 'lg'],\n class: [\n 'fixed top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2',\n 'max-h-[80%]',\n 'shadow-md rounded-lg',\n 'data-open:animate-fade-in',\n 'data-closed:animate-fade-out',\n ],\n },\n {\n size: ['sm', 'md', 'lg'],\n isNarrow: false,\n class: ['w-full'],\n },\n ],\n defaultVariants: {\n size: 'md',\n isNarrow: false,\n },\n }\n)\n\nexport type DialogContentStylesProps = VariantProps<typeof dialogContentStyles>\n"],"names":["dialogContentStyles","cva"],"mappings":";AAEO,MAAMA,IAAsBC;AAAA,EACjC;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAAA,IAEA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA;AAAA,EAEF;AAAA,IACE,UAAU;AAAA,MACR,MAAM;AAAA,QACJ,YAAY;AAAA,QACZ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,MAAA;AAAA,MAEN,UAAU;AAAA,QACR,MAAM,CAAC,0BAA0B;AAAA,QACjC,OAAO,CAAA;AAAA,MAAC;AAAA,IACV;AAAA,IAEF,kBAAkB;AAAA,MAChB;AAAA,QACE,MAAM,CAAC,MAAM,MAAM,IAAI;AAAA,QACvB,OAAO;AAAA,UACL;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QAAA;AAAA,MACF;AAAA,MAEF;AAAA,QACE,MAAM,CAAC,MAAM,MAAM,IAAI;AAAA,QACvB,UAAU;AAAA,QACV,OAAO,CAAC,QAAQ;AAAA,MAAA;AAAA,IAClB;AAAA,IAEF,iBAAiB;AAAA,MACf,MAAM;AAAA,MACN,UAAU;AAAA,IAAA;AAAA,EACZ;AAEJ;"}
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("react/jsx-runtime"),i=require("@base-ui/react/alert-dialog"),d=require("react"),w=require("../Slot-DQ8z2zsy.js"),A=require("@spark-ui/hooks/use-merge-refs"),P=require("@spark-ui/hooks/use-scroll-overflow"),c=require("class-variance-authority"),O=require("../DialogContent.styles-bBs6l8Cy.js"),y=d.createContext(null),q=({children:e,withFade:t=!1,cancelRef:a})=>l.jsx(y.Provider,{value:{cancelRef:a,withFade:t},children:e}),p=()=>{const e=d.useContext(y);if(!e)throw Error("useAlertDialog must be used within an AlertDialog provider");return e},m=({onOpenChange:e,withFade:t=!1,...a})=>{const o=d.useRef(null),s=e?(n,g)=>{e(n)}:void 0;return l.jsx(q,{withFade:t,cancelRef:o,children:l.jsx(i.AlertDialog.Root,{"data-spark-component":"alert-dialog",onOpenChange:s,...a})})};m.displayName="AlertDialog";function D(e,t){const a=e?w.Slot:t;return e?({...o})=>l.jsx(a,{...o}):void 0}const x=({asChild:e=!1,...t})=>{const a=D(e,"button");return l.jsx(i.AlertDialog.Close,{"data-spark-component":"alert-dialog-action",render:a,...t})};x.displayName="AlertDialog.Action";const f=({children:e,className:t,inset:a=!1,ref:o,...s})=>{const n=d.useRef(null),g=A.useMergeRefs(o,n),{withFade:S}=p(),{overflow:u}=P.useScrollOverflow(n);return l.jsx("div",{"data-spark-component":"alert-dialog-body",ref:g,className:c.cx("focus-visible:u-outline relative grow overflow-y-auto outline-hidden","transition-all duration-300",{"px-xl py-lg":!a},t),style:{...S&&{maskImage:"linear-gradient(to bottom, 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:`100% calc(100% + ${u.top?"0px":"44px"} + ${u.bottom?"0px":"44px"})`,maskPosition:`0 ${u.top?"0px":"-44px"}`}},...s,children:e})};f.displayName="AlertDialog.Body";const N=({asChild:e=!1,ref:t,...a})=>{const{cancelRef:o}=p(),s=A.useMergeRefs(t,o),n=D(e,"button");return l.jsx(i.AlertDialog.Close,{ref:s,"data-spark-component":"alert-dialog-cancel",render:n,...a})};N.displayName="AlertDialog.Cancel";const v=({className:e,ref:t,initialFocus:a,...o})=>{const{cancelRef:s}=p(),n=a!==void 0?a:()=>s.current;return l.jsx(i.AlertDialog.Popup,{ref:t,"data-spark-component":"alert-dialog-content",role:"alertdialog",className:g=>c.cx(O.dialogContentStyles({size:"md",isNarrow:!0}),"min-w-sz-288","transition-all duration-150","data-starting-style:scale-90 data-starting-style:opacity-0","data-ending-style:scale-90 data-ending-style:opacity-0",typeof e=="function"?e(g):e),initialFocus:n,...o})};v.displayName="AlertDialog.Content";const j=e=>l.jsx(i.AlertDialog.Description,{"data-spark-component":"alert-dialog-description",...e});j.displayName="AlertDialog.Description";const C=({children:e,className:t,ref:a,...o})=>l.jsx("footer",{"data-spark-component":"alert-dialog-footer",ref:a,className:c.cx(t,["px-xl","py-lg"]),...o,children:e});C.displayName="AlertDialog.Footer";const b=({children:e,className:t,ref:a,...o})=>l.jsx("header",{"data-spark-component":"alert-dialog-header",ref:a,className:c.cx(t,["px-xl","py-lg"]),...o,children:e});b.displayName="AlertDialog.Header";const k=({className:e,...t})=>l.jsx(i.AlertDialog.Backdrop,{"data-spark-component":"alert-dialog-overlay",className:a=>c.cx("z-overlay fixed top-0 left-0 h-screen w-screen","bg-overlay/dim-1","data-starting-style:animate-fade-in","data-ending-style:animate-fade-out",typeof e=="function"?e(a):e),...t});k.displayName="AlertDialog.Overlay";const R=({className:e,...t})=>l.jsx(i.AlertDialog.Portal,{"data-spark-component":"alert-dialog-portal",className:c.cx(e,"z-modal absolute"),...t});R.displayName="AlertDialog.Portal";const T=({className:e,...t})=>l.jsx(i.AlertDialog.Title,{"data-spark-component":"alert-dialog-title",className:c.cx("text-headline-1 text-on-surface",e),...t});T.displayName="AlertDialog.Title";const h=({asChild:e=!1,...t})=>{const a=D(e,"button");return l.jsx(i.AlertDialog.Trigger,{"data-spark-component":"alert-dialog-trigger",render:a,...t})};h.displayName="AlertDialog.Trigger";const r=Object.assign(m,{Action:x,Body:f,Cancel:N,Content:v,Description:j,Footer:C,Header:b,Overlay:k,Portal:R,Title:T,Trigger:h});r.displayName="AlertDialog";r.Action.displayName="AlertDialog.Action";r.Body.displayName="AlertDialog.Body";r.Cancel.displayName="AlertDialog.Cancel";r.Content.displayName="AlertDialog.Content";r.Description.displayName="AlertDialog.Description";r.Footer.displayName="AlertDialog.Footer";r.Header.displayName="AlertDialog.Header";r.Overlay.displayName="AlertDialog.Overlay";r.Portal.displayName="AlertDialog.Portal";r.Title.displayName="AlertDialog.Title";r.Trigger.displayName="AlertDialog.Trigger";exports.AlertDialog=r;exports.useAlertDialog=p;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("react/jsx-runtime"),i=require("@base-ui/react/alert-dialog"),d=require("react"),S=require("../Slot-DQ8z2zsy.js"),A=require("@spark-ui/hooks/use-merge-refs"),P=require("@spark-ui/hooks/use-scroll-overflow"),c=require("class-variance-authority"),O=require("../DialogContent.styles-CziMQtYr.js"),y=d.createContext(null),q=({children:e,withFade:t=!1,cancelRef:a})=>l.jsx(y.Provider,{value:{cancelRef:a,withFade:t},children:e}),p=()=>{const e=d.useContext(y);if(!e)throw Error("useAlertDialog must be used within an AlertDialog provider");return e},m=({onOpenChange:e,withFade:t=!1,...a})=>{const o=d.useRef(null),s=e?(n,g)=>{e(n)}:void 0;return l.jsx(q,{withFade:t,cancelRef:o,children:l.jsx(i.AlertDialog.Root,{"data-spark-component":"alert-dialog",onOpenChange:s,...a})})};m.displayName="AlertDialog";function D(e,t){const a=e?S.Slot:t;return e?({...o})=>l.jsx(a,{...o}):void 0}const x=({asChild:e=!1,...t})=>{const a=D(e,"button");return l.jsx(i.AlertDialog.Close,{"data-spark-component":"alert-dialog-action",render:a,...t})};x.displayName="AlertDialog.Action";const f=({children:e,className:t,inset:a=!1,ref:o,...s})=>{const n=d.useRef(null),g=A.useMergeRefs(o,n),{withFade:w}=p(),{overflow:u}=P.useScrollOverflow(n);return l.jsx("div",{"data-spark-component":"alert-dialog-body",ref:g,className:c.cx("focus-visible:u-outline relative grow overflow-y-auto outline-hidden","transition-all duration-300",{"px-xl py-lg":!a},t),style:{...w&&{maskImage:"linear-gradient(to bottom, 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:`100% calc(100% + ${u.top?"0px":"44px"} + ${u.bottom?"0px":"44px"})`,maskPosition:`0 ${u.top?"0px":"-44px"}`}},...s,children:e})};f.displayName="AlertDialog.Body";const N=({asChild:e=!1,ref:t,...a})=>{const{cancelRef:o}=p(),s=A.useMergeRefs(t,o),n=D(e,"button");return l.jsx(i.AlertDialog.Close,{ref:s,"data-spark-component":"alert-dialog-cancel",render:n,...a})};N.displayName="AlertDialog.Cancel";const v=({className:e,ref:t,initialFocus:a,...o})=>{const{cancelRef:s}=p(),n=a!==void 0?a:()=>s.current;return l.jsx(i.AlertDialog.Popup,{ref:t,"data-spark-component":"alert-dialog-content",role:"alertdialog",className:g=>c.cx(O.dialogContentStyles({size:"md",isNarrow:!0}),"min-w-[min(288px,calc(100vw-2rem))]","transition-all duration-150","data-starting-style:scale-90 data-starting-style:opacity-0","data-ending-style:scale-90 data-ending-style:opacity-0",typeof e=="function"?e(g):e),initialFocus:n,...o})};v.displayName="AlertDialog.Content";const j=e=>l.jsx(i.AlertDialog.Description,{"data-spark-component":"alert-dialog-description",...e});j.displayName="AlertDialog.Description";const C=({children:e,className:t,ref:a,...o})=>l.jsx("footer",{"data-spark-component":"alert-dialog-footer",ref:a,className:c.cx(t,["px-xl","py-lg"]),...o,children:e});C.displayName="AlertDialog.Footer";const b=({children:e,className:t,ref:a,...o})=>l.jsx("header",{"data-spark-component":"alert-dialog-header",ref:a,className:c.cx(t,["px-xl","py-lg"]),...o,children:e});b.displayName="AlertDialog.Header";const k=({className:e,...t})=>l.jsx(i.AlertDialog.Backdrop,{"data-spark-component":"alert-dialog-overlay",className:a=>c.cx("z-overlay fixed top-0 left-0 h-screen w-screen","bg-overlay/dim-1","data-starting-style:animate-fade-in","data-ending-style:animate-fade-out",typeof e=="function"?e(a):e),...t});k.displayName="AlertDialog.Overlay";const R=({className:e,...t})=>l.jsx(i.AlertDialog.Portal,{"data-spark-component":"alert-dialog-portal",className:c.cx(e,"z-modal absolute"),...t});R.displayName="AlertDialog.Portal";const T=({className:e,...t})=>l.jsx(i.AlertDialog.Title,{"data-spark-component":"alert-dialog-title",className:c.cx("text-headline-1 text-on-surface",e),...t});T.displayName="AlertDialog.Title";const h=({asChild:e=!1,...t})=>{const a=D(e,"button");return l.jsx(i.AlertDialog.Trigger,{"data-spark-component":"alert-dialog-trigger",render:a,...t})};h.displayName="AlertDialog.Trigger";const r=Object.assign(m,{Action:x,Body:f,Cancel:N,Content:v,Description:j,Footer:C,Header:b,Overlay:k,Portal:R,Title:T,Trigger:h});r.displayName="AlertDialog";r.Action.displayName="AlertDialog.Action";r.Body.displayName="AlertDialog.Body";r.Cancel.displayName="AlertDialog.Cancel";r.Content.displayName="AlertDialog.Content";r.Description.displayName="AlertDialog.Description";r.Footer.displayName="AlertDialog.Footer";r.Header.displayName="AlertDialog.Header";r.Overlay.displayName="AlertDialog.Overlay";r.Portal.displayName="AlertDialog.Portal";r.Title.displayName="AlertDialog.Title";r.Trigger.displayName="AlertDialog.Trigger";exports.AlertDialog=r;exports.useAlertDialog=p;
2
2
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../../src/alert-dialog/AlertDialogContext.tsx","../../src/alert-dialog/AlertDialog.tsx","../../src/alert-dialog/useRenderSlot.tsx","../../src/alert-dialog/AlertDialogAction.tsx","../../src/alert-dialog/AlertDialogBody.tsx","../../src/alert-dialog/AlertDialogCancel.tsx","../../src/alert-dialog/AlertDialogContent.tsx","../../src/alert-dialog/AlertDialogDescription.tsx","../../src/alert-dialog/AlertDialogFooter.tsx","../../src/alert-dialog/AlertDialogHeader.tsx","../../src/alert-dialog/AlertDialogOverlay.tsx","../../src/alert-dialog/AlertDialogPortal.tsx","../../src/alert-dialog/AlertDialogTitle.tsx","../../src/alert-dialog/AlertDialogTrigger.tsx","../../src/alert-dialog/index.ts"],"sourcesContent":["import { createContext, MutableRefObject, type ReactNode, useContext } from 'react'\n\nexport interface AlertDialogContextValue {\n cancelRef: MutableRefObject<HTMLButtonElement | null>\n withFade: boolean\n}\n\nexport const AlertDialogContext = createContext<AlertDialogContextValue | null>(null)\n\nexport const AlertDialogProvider = ({\n children,\n withFade = false,\n cancelRef,\n}: {\n children: ReactNode\n withFade?: boolean\n cancelRef: MutableRefObject<HTMLButtonElement | null>\n}) => {\n return (\n <AlertDialogContext.Provider\n value={{\n cancelRef,\n withFade,\n }}\n >\n {children}\n </AlertDialogContext.Provider>\n )\n}\n\nexport const useAlertDialog = () => {\n const context = useContext(AlertDialogContext)\n\n if (!context) {\n throw Error('useAlertDialog must be used within an AlertDialog provider')\n }\n\n return context\n}\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { ComponentProps, Ref, useRef } from 'react'\n\nimport { AlertDialogProvider } from './AlertDialogContext'\n\nexport interface AlertDialogProps\n extends Omit<ComponentProps<typeof BaseAlertDialog.Root>, 'onOpenChange' | 'render'> {\n /**\n * Specifies if the dialog is open or not.\n */\n open?: boolean\n /**\n * Default open state.\n */\n defaultOpen?: boolean\n /**\n * Handler executed on every dialog open state change.\n */\n onOpenChange?: (open: boolean) => void\n /**\n * Specifies if the dialog should have a fade animation on its body (in case it is scrollable).\n */\n withFade?: boolean\n /**\n * Change the default rendered element for the one passed as a child, merging their props and behavior.\n */\n asChild?: boolean\n ref?: Ref<HTMLDivElement>\n}\n\nexport const AlertDialog = ({ onOpenChange, withFade = false, ...props }: AlertDialogProps) => {\n const cancelRef = useRef<HTMLButtonElement | null>(null)\n\n const handleOpenChange = onOpenChange\n ? (open: boolean, _eventDetails: unknown) => {\n onOpenChange(open)\n }\n : undefined\n\n return (\n <AlertDialogProvider withFade={withFade} cancelRef={cancelRef}>\n <BaseAlertDialog.Root\n data-spark-component=\"alert-dialog\"\n onOpenChange={handleOpenChange}\n {...props}\n />\n </AlertDialogProvider>\n )\n}\n\nAlertDialog.displayName = 'AlertDialog'\n","import { Slot } from '../slot'\n\nexport function useRenderSlot(asChild: boolean, defaultTag: string) {\n const Component = asChild ? Slot : defaultTag\n\n return asChild ? ({ ...props }) => <Component {...props} /> : undefined\n}\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { ComponentProps, Ref } from 'react'\n\nimport { useRenderSlot } from './useRenderSlot'\n\nexport interface AlertDialogActionProps\n extends Omit<ComponentProps<typeof BaseAlertDialog.Close>, 'render'> {\n /**\n * Change the default rendered element for the one passed as a child, merging their props and behavior.\n */\n asChild?: boolean\n ref?: Ref<HTMLButtonElement>\n}\n\nexport const AlertDialogAction = ({ asChild = false, ...props }: AlertDialogActionProps) => {\n const renderSlot = useRenderSlot(asChild, 'button')\n\n return (\n <BaseAlertDialog.Close\n data-spark-component=\"alert-dialog-action\"\n render={renderSlot}\n {...props}\n />\n )\n}\n\nAlertDialogAction.displayName = 'AlertDialog.Action'\n","import { useMergeRefs } from '@spark-ui/hooks/use-merge-refs'\nimport { useScrollOverflow } from '@spark-ui/hooks/use-scroll-overflow'\nimport { cx } from 'class-variance-authority'\nimport { type ReactElement, type ReactNode, Ref, useRef } from 'react'\n\nimport { useAlertDialog } from './AlertDialogContext'\n\nexport interface AlertDialogBodyProps {\n children: ReactNode\n className?: string\n tabIndex?: number\n ref?: Ref<HTMLDivElement>\n inset?: boolean\n}\n\nexport const AlertDialogBody = ({\n children,\n className,\n inset = false,\n ref: forwardedRef,\n ...rest\n}: AlertDialogBodyProps): ReactElement => {\n const scrollAreaRef = useRef<HTMLDivElement>(null)\n const ref = useMergeRefs(forwardedRef, scrollAreaRef)\n\n const { withFade } = useAlertDialog()\n const { overflow } = useScrollOverflow(scrollAreaRef)\n\n return (\n <div\n data-spark-component=\"alert-dialog-body\"\n ref={ref}\n className={cx(\n 'focus-visible:u-outline relative grow overflow-y-auto outline-hidden',\n 'transition-all duration-300',\n {\n ['px-xl py-lg']: !inset,\n },\n className\n )}\n style={{\n ...(withFade && {\n maskImage:\n 'linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1) 44px, rgba(0, 0, 0, 1) calc(100% - 44px), rgba(0, 0, 0, 0))',\n maskSize: `100% calc(100% + ${overflow.top ? '0px' : '44px'} + ${overflow.bottom ? '0px' : '44px'})`,\n maskPosition: `0 ${overflow.top ? '0px' : '-44px'}`,\n }),\n }}\n {...rest}\n >\n {children}\n </div>\n )\n}\n\nAlertDialogBody.displayName = 'AlertDialog.Body'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { useMergeRefs } from '@spark-ui/hooks/use-merge-refs'\nimport { ComponentProps, Ref } from 'react'\n\nimport { useAlertDialog } from './AlertDialogContext'\nimport { useRenderSlot } from './useRenderSlot'\n\nexport interface AlertDialogCancelProps\n extends Omit<ComponentProps<typeof BaseAlertDialog.Close>, 'render'> {\n /**\n * Change the default rendered element for the one passed as a child, merging their props and behavior.\n */\n asChild?: boolean\n ref?: Ref<HTMLButtonElement>\n}\n\nexport const AlertDialogCancel = ({\n asChild = false,\n ref: forwardedRef,\n ...props\n}: AlertDialogCancelProps) => {\n const { cancelRef } = useAlertDialog()\n const ref = useMergeRefs(forwardedRef, cancelRef)\n const renderSlot = useRenderSlot(asChild, 'button')\n\n return (\n <BaseAlertDialog.Close\n ref={ref}\n data-spark-component=\"alert-dialog-cancel\"\n render={renderSlot}\n {...props}\n />\n )\n}\n\nAlertDialogCancel.displayName = 'AlertDialog.Cancel'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nimport { dialogContentStyles } from '../dialog/DialogContent.styles'\nimport { useAlertDialog } from './AlertDialogContext'\n\nexport interface AlertDialogContentProps\n extends Omit<ComponentProps<typeof BaseAlertDialog.Popup>, 'render'> {\n ref?: Ref<HTMLDivElement>\n}\n\nexport const AlertDialogContent = ({\n className,\n ref,\n initialFocus,\n ...others\n}: AlertDialogContentProps) => {\n const { cancelRef } = useAlertDialog()\n\n // Default: focus the cancel button when dialog opens\n // Users can override by passing their own initialFocus prop (RefObject, false, true, or function)\n const handleInitialFocus = initialFocus !== undefined ? initialFocus : () => cancelRef.current\n\n return (\n <BaseAlertDialog.Popup\n ref={ref}\n data-spark-component=\"alert-dialog-content\"\n role=\"alertdialog\"\n className={state =>\n cx(\n dialogContentStyles({ size: 'md', isNarrow: true }),\n 'min-w-sz-288',\n // Base UI automatically adds data-[starting-style] and data-[ending-style] attributes\n // Transition with opacity and scale for smooth open/close animations\n 'transition-all duration-150',\n 'data-starting-style:scale-90 data-starting-style:opacity-0',\n 'data-ending-style:scale-90 data-ending-style:opacity-0',\n typeof className === 'function' ? className(state) : className\n )\n }\n initialFocus={handleInitialFocus}\n {...others}\n />\n )\n}\n\nAlertDialogContent.displayName = 'AlertDialog.Content'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface AlertDialogDescriptionProps\n extends Omit<ComponentProps<typeof BaseAlertDialog.Description>, 'render'> {\n ref?: Ref<HTMLParagraphElement>\n}\n\nexport const AlertDialogDescription = (props: AlertDialogDescriptionProps) => {\n return <BaseAlertDialog.Description data-spark-component=\"alert-dialog-description\" {...props} />\n}\n\nAlertDialogDescription.displayName = 'AlertDialog.Description'\n","import { cx } from 'class-variance-authority'\nimport { type ReactElement, type ReactNode, Ref } from 'react'\n\nexport interface AlertDialogFooterProps {\n children: ReactNode\n className?: string\n ref?: Ref<HTMLDivElement>\n}\n\nexport const AlertDialogFooter = ({\n children,\n className,\n ref,\n ...rest\n}: AlertDialogFooterProps): ReactElement => (\n <footer\n data-spark-component=\"alert-dialog-footer\"\n ref={ref}\n className={cx(className, ['px-xl', 'py-lg'])}\n {...rest}\n >\n {children}\n </footer>\n)\n\nAlertDialogFooter.displayName = 'AlertDialog.Footer'\n","import { cx } from 'class-variance-authority'\nimport { type ReactElement, type ReactNode, Ref } from 'react'\n\nexport interface AlertDialogHeaderProps {\n children: ReactNode\n className?: string\n ref?: Ref<HTMLDivElement>\n}\n\nexport const AlertDialogHeader = ({\n children,\n className,\n ref,\n ...rest\n}: AlertDialogHeaderProps): ReactElement => (\n <header\n data-spark-component=\"alert-dialog-header\"\n ref={ref}\n className={cx(className, ['px-xl', 'py-lg'])}\n {...rest}\n >\n {children}\n </header>\n)\n\nAlertDialogHeader.displayName = 'AlertDialog.Header'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface AlertDialogOverlayProps\n extends Omit<ComponentProps<typeof BaseAlertDialog.Backdrop>, 'render'> {\n ref?: Ref<HTMLDivElement>\n}\n\nexport const AlertDialogOverlay = ({ className, ...props }: AlertDialogOverlayProps) => {\n return (\n <BaseAlertDialog.Backdrop\n data-spark-component=\"alert-dialog-overlay\"\n className={state =>\n cx(\n 'z-overlay fixed top-0 left-0 h-screen w-screen',\n 'bg-overlay/dim-1',\n // Base UI automatically adds data-[starting-style] and data-[ending-style] attributes\n 'data-starting-style:animate-fade-in',\n 'data-ending-style:animate-fade-out',\n typeof className === 'function' ? className(state) : className\n )\n }\n {...props}\n />\n )\n}\n\nAlertDialogOverlay.displayName = 'AlertDialog.Overlay'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps } from 'react'\n\nexport type AlertDialogPortalProps = ComponentProps<typeof BaseAlertDialog.Portal>\n\nexport const AlertDialogPortal = ({ className, ...props }: AlertDialogPortalProps) => {\n return (\n <BaseAlertDialog.Portal\n data-spark-component=\"alert-dialog-portal\"\n className={cx(className, 'z-modal absolute')}\n {...props}\n />\n )\n}\n\nAlertDialogPortal.displayName = 'AlertDialog.Portal'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface AlertDialogTitleProps\n extends Omit<ComponentProps<typeof BaseAlertDialog.Title>, 'render'> {\n ref?: Ref<HTMLHeadingElement>\n}\n\nexport const AlertDialogTitle = ({ className, ...props }: AlertDialogTitleProps) => {\n return (\n <BaseAlertDialog.Title\n data-spark-component=\"alert-dialog-title\"\n className={cx('text-headline-1 text-on-surface', className)}\n {...props}\n />\n )\n}\n\nAlertDialogTitle.displayName = 'AlertDialog.Title'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { ComponentProps, Ref } from 'react'\n\nimport { useRenderSlot } from './useRenderSlot'\n\nexport interface AlertDialogTriggerProps\n extends Omit<ComponentProps<typeof BaseAlertDialog.Trigger>, 'render'> {\n /**\n * Change the default rendered element for the one passed as a child, merging their props and behavior.\n */\n asChild?: boolean\n ref?: Ref<HTMLButtonElement>\n}\n\nexport const AlertDialogTrigger = ({ asChild = false, ...props }: AlertDialogTriggerProps) => {\n const renderSlot = useRenderSlot(asChild, 'button')\n\n return (\n <BaseAlertDialog.Trigger\n data-spark-component=\"alert-dialog-trigger\"\n render={renderSlot}\n {...props}\n />\n )\n}\n\nAlertDialogTrigger.displayName = 'AlertDialog.Trigger'\n","import { AlertDialog as Root } from './AlertDialog'\nimport { AlertDialogAction } from './AlertDialogAction'\nimport { AlertDialogBody } from './AlertDialogBody'\nimport { AlertDialogCancel } from './AlertDialogCancel'\nimport { AlertDialogContent } from './AlertDialogContent'\nimport { AlertDialogDescription } from './AlertDialogDescription'\nimport { AlertDialogFooter } from './AlertDialogFooter'\nimport { AlertDialogHeader } from './AlertDialogHeader'\nimport { AlertDialogOverlay } from './AlertDialogOverlay'\nimport { AlertDialogPortal } from './AlertDialogPortal'\nimport { AlertDialogTitle } from './AlertDialogTitle'\nimport { AlertDialogTrigger } from './AlertDialogTrigger'\n\nexport * from './AlertDialog'\nexport { useAlertDialog } from './AlertDialogContext'\nexport { type AlertDialogActionProps } from './AlertDialogAction'\nexport { type AlertDialogBodyProps } from './AlertDialogBody'\nexport { type AlertDialogCancelProps } from './AlertDialogCancel'\nexport { type AlertDialogContentProps } from './AlertDialogContent'\nexport { type AlertDialogDescriptionProps } from './AlertDialogDescription'\nexport { type AlertDialogFooterProps } from './AlertDialogFooter'\nexport { type AlertDialogHeaderProps } from './AlertDialogHeader'\nexport { type AlertDialogOverlayProps } from './AlertDialogOverlay'\nexport { type AlertDialogPortalProps } from './AlertDialogPortal'\nexport { type AlertDialogTitleProps } from './AlertDialogTitle'\nexport { type AlertDialogTriggerProps } from './AlertDialogTrigger'\n\nexport const AlertDialog: typeof Root & {\n Action: typeof AlertDialogAction\n Body: typeof AlertDialogBody\n Cancel: typeof AlertDialogCancel\n Content: typeof AlertDialogContent\n Description: typeof AlertDialogDescription\n Footer: typeof AlertDialogFooter\n Header: typeof AlertDialogHeader\n Overlay: typeof AlertDialogOverlay\n Portal: typeof AlertDialogPortal\n Title: typeof AlertDialogTitle\n Trigger: typeof AlertDialogTrigger\n} = Object.assign(Root, {\n Action: AlertDialogAction,\n Body: AlertDialogBody,\n Cancel: AlertDialogCancel,\n Content: AlertDialogContent,\n Description: AlertDialogDescription,\n Footer: AlertDialogFooter,\n Header: AlertDialogHeader,\n Overlay: AlertDialogOverlay,\n Portal: AlertDialogPortal,\n Title: AlertDialogTitle,\n Trigger: AlertDialogTrigger,\n})\n\nAlertDialog.displayName = 'AlertDialog'\nAlertDialog.Action.displayName = 'AlertDialog.Action'\nAlertDialog.Body.displayName = 'AlertDialog.Body'\nAlertDialog.Cancel.displayName = 'AlertDialog.Cancel'\nAlertDialog.Content.displayName = 'AlertDialog.Content'\nAlertDialog.Description.displayName = 'AlertDialog.Description'\nAlertDialog.Footer.displayName = 'AlertDialog.Footer'\nAlertDialog.Header.displayName = 'AlertDialog.Header'\nAlertDialog.Overlay.displayName = 'AlertDialog.Overlay'\nAlertDialog.Portal.displayName = 'AlertDialog.Portal'\nAlertDialog.Title.displayName = 'AlertDialog.Title'\nAlertDialog.Trigger.displayName = 'AlertDialog.Trigger'\n"],"names":["AlertDialogContext","createContext","AlertDialogProvider","children","withFade","cancelRef","jsx","useAlertDialog","context","useContext","AlertDialog","onOpenChange","props","useRef","handleOpenChange","open","_eventDetails","BaseAlertDialog","useRenderSlot","asChild","defaultTag","Component","Slot","AlertDialogAction","renderSlot","AlertDialogBody","className","inset","forwardedRef","rest","scrollAreaRef","ref","useMergeRefs","overflow","useScrollOverflow","cx","AlertDialogCancel","AlertDialogContent","initialFocus","others","handleInitialFocus","state","dialogContentStyles","AlertDialogDescription","AlertDialogFooter","AlertDialogHeader","AlertDialogOverlay","AlertDialogPortal","AlertDialogTitle","AlertDialogTrigger","Root"],"mappings":"sYAOaA,EAAqBC,EAAAA,cAA8C,IAAI,EAEvEC,EAAsB,CAAC,CAClC,SAAAC,EACA,SAAAC,EAAW,GACX,UAAAC,CACF,IAMIC,EAAAA,IAACN,EAAmB,SAAnB,CACC,MAAO,CACL,UAAAK,EACA,SAAAD,CAAA,EAGD,SAAAD,CAAA,CAAA,EAKMI,EAAiB,IAAM,CAClC,MAAMC,EAAUC,EAAAA,WAAWT,CAAkB,EAE7C,GAAI,CAACQ,EACH,MAAM,MAAM,4DAA4D,EAG1E,OAAOA,CACT,ECRaE,EAAc,CAAC,CAAE,aAAAC,EAAc,SAAAP,EAAW,GAAO,GAAGQ,KAA8B,CAC7F,MAAMP,EAAYQ,EAAAA,OAAiC,IAAI,EAEjDC,EAAmBH,EACrB,CAACI,EAAeC,IAA2B,CACzCL,EAAaI,CAAI,CACnB,EACA,OAEJ,OACET,EAAAA,IAACJ,EAAA,CAAoB,SAAAE,EAAoB,UAAAC,EACvC,SAAAC,EAAAA,IAACW,EAAAA,YAAgB,KAAhB,CACC,uBAAqB,eACrB,aAAcH,EACb,GAAGF,CAAA,CAAA,EAER,CAEJ,EAEAF,EAAY,YAAc,cChDnB,SAASQ,EAAcC,EAAkBC,EAAoB,CAClE,MAAMC,EAAYF,EAAUG,EAAAA,KAAOF,EAEnC,OAAOD,EAAU,CAAC,CAAE,GAAGP,CAAA,IAAYN,MAACe,EAAA,CAAW,GAAGT,CAAA,CAAO,EAAK,MAChE,CCQO,MAAMW,EAAoB,CAAC,CAAE,QAAAJ,EAAU,GAAO,GAAGP,KAAoC,CAC1F,MAAMY,EAAaN,EAAcC,EAAS,QAAQ,EAElD,OACEb,EAAAA,IAACW,EAAAA,YAAgB,MAAhB,CACC,uBAAqB,sBACrB,OAAQO,EACP,GAAGZ,CAAA,CAAA,CAGV,EAEAW,EAAkB,YAAc,qBCXzB,MAAME,EAAkB,CAAC,CAC9B,SAAAtB,EACA,UAAAuB,EACA,MAAAC,EAAQ,GACR,IAAKC,EACL,GAAGC,CACL,IAA0C,CACxC,MAAMC,EAAgBjB,EAAAA,OAAuB,IAAI,EAC3CkB,EAAMC,EAAAA,aAAaJ,EAAcE,CAAa,EAE9C,CAAE,SAAA1B,CAAA,EAAaG,EAAA,EACf,CAAE,SAAA0B,CAAA,EAAaC,EAAAA,kBAAkBJ,CAAa,EAEpD,OACExB,EAAAA,IAAC,MAAA,CACC,uBAAqB,oBACrB,IAAAyB,EACA,UAAWI,EAAAA,GACT,uEACA,8BACA,CACG,cAAgB,CAACR,CAAA,EAEpBD,CAAA,EAEF,MAAO,CACL,GAAItB,GAAY,CACd,UACE,4HACF,SAAU,oBAAoB6B,EAAS,IAAM,MAAQ,MAAM,MAAMA,EAAS,OAAS,MAAQ,MAAM,IACjG,aAAc,KAAKA,EAAS,IAAM,MAAQ,OAAO,EAAA,CACnD,EAED,GAAGJ,EAEH,SAAA1B,CAAA,CAAA,CAGP,EAEAsB,EAAgB,YAAc,mBCvCvB,MAAMW,EAAoB,CAAC,CAChC,QAAAjB,EAAU,GACV,IAAKS,EACL,GAAGhB,CACL,IAA8B,CAC5B,KAAM,CAAE,UAAAP,CAAA,EAAcE,EAAA,EAChBwB,EAAMC,EAAAA,aAAaJ,EAAcvB,CAAS,EAC1CmB,EAAaN,EAAcC,EAAS,QAAQ,EAElD,OACEb,EAAAA,IAACW,EAAAA,YAAgB,MAAhB,CACC,IAAAc,EACA,uBAAqB,sBACrB,OAAQP,EACP,GAAGZ,CAAA,CAAA,CAGV,EAEAwB,EAAkB,YAAc,qBCvBzB,MAAMC,EAAqB,CAAC,CACjC,UAAAX,EACA,IAAAK,EACA,aAAAO,EACA,GAAGC,CACL,IAA+B,CAC7B,KAAM,CAAE,UAAAlC,CAAA,EAAcE,EAAA,EAIhBiC,EAAqBF,IAAiB,OAAYA,EAAe,IAAMjC,EAAU,QAEvF,OACEC,EAAAA,IAACW,EAAAA,YAAgB,MAAhB,CACC,IAAAc,EACA,uBAAqB,uBACrB,KAAK,cACL,UAAWU,GACTN,EAAAA,GACEO,EAAAA,oBAAoB,CAAE,KAAM,KAAM,SAAU,GAAM,EAClD,eAGA,8BACA,6DACA,yDACA,OAAOhB,GAAc,WAAaA,EAAUe,CAAK,EAAIf,CAAA,EAGzD,aAAcc,EACb,GAAGD,CAAA,CAAA,CAGV,EAEAF,EAAmB,YAAc,sBCvC1B,MAAMM,EAA0B/B,SAC7BK,EAAAA,YAAgB,YAAhB,CAA4B,uBAAqB,2BAA4B,GAAGL,EAAO,EAGjG+B,EAAuB,YAAc,0BCH9B,MAAMC,EAAoB,CAAC,CAChC,SAAAzC,EACA,UAAAuB,EACA,IAAAK,EACA,GAAGF,CACL,IACEvB,EAAAA,IAAC,SAAA,CACC,uBAAqB,sBACrB,IAAAyB,EACA,UAAWI,EAAAA,GAAGT,EAAW,CAAC,QAAS,OAAO,CAAC,EAC1C,GAAGG,EAEH,SAAA1B,CAAA,CACH,EAGFyC,EAAkB,YAAc,qBChBzB,MAAMC,EAAoB,CAAC,CAChC,SAAA1C,EACA,UAAAuB,EACA,IAAAK,EACA,GAAGF,CACL,IACEvB,EAAAA,IAAC,SAAA,CACC,uBAAqB,sBACrB,IAAAyB,EACA,UAAWI,EAAAA,GAAGT,EAAW,CAAC,QAAS,OAAO,CAAC,EAC1C,GAAGG,EAEH,SAAA1B,CAAA,CACH,EAGF0C,EAAkB,YAAc,qBChBzB,MAAMC,EAAqB,CAAC,CAAE,UAAApB,EAAW,GAAGd,KAE/CN,EAAAA,IAACW,EAAAA,YAAgB,SAAhB,CACC,uBAAqB,uBACrB,UAAWwB,GACTN,EAAAA,GACE,iDACA,mBAEA,sCACA,qCACA,OAAOT,GAAc,WAAaA,EAAUe,CAAK,EAAIf,CAAA,EAGxD,GAAGd,CAAA,CAAA,EAKVkC,EAAmB,YAAc,sBCtB1B,MAAMC,EAAoB,CAAC,CAAE,UAAArB,EAAW,GAAGd,KAE9CN,EAAAA,IAACW,EAAAA,YAAgB,OAAhB,CACC,uBAAqB,sBACrB,UAAWkB,EAAAA,GAAGT,EAAW,kBAAkB,EAC1C,GAAGd,CAAA,CAAA,EAKVmC,EAAkB,YAAc,qBCPzB,MAAMC,EAAmB,CAAC,CAAE,UAAAtB,EAAW,GAAGd,KAE7CN,EAAAA,IAACW,EAAAA,YAAgB,MAAhB,CACC,uBAAqB,qBACrB,UAAWkB,EAAAA,GAAG,kCAAmCT,CAAS,EACzD,GAAGd,CAAA,CAAA,EAKVoC,EAAiB,YAAc,oBCLxB,MAAMC,EAAqB,CAAC,CAAE,QAAA9B,EAAU,GAAO,GAAGP,KAAqC,CAC5F,MAAMY,EAAaN,EAAcC,EAAS,QAAQ,EAElD,OACEb,EAAAA,IAACW,EAAAA,YAAgB,QAAhB,CACC,uBAAqB,uBACrB,OAAQO,EACP,GAAGZ,CAAA,CAAA,CAGV,EAEAqC,EAAmB,YAAc,sBCC1B,MAAMvC,EAYT,OAAO,OAAOwC,EAAM,CACtB,OAAQ3B,EACR,KAAME,EACN,OAAQW,EACR,QAASC,EACT,YAAaM,EACb,OAAQC,EACR,OAAQC,EACR,QAASC,EACT,OAAQC,EACR,MAAOC,EACP,QAASC,CACX,CAAC,EAEDvC,EAAY,YAAc,cAC1BA,EAAY,OAAO,YAAc,qBACjCA,EAAY,KAAK,YAAc,mBAC/BA,EAAY,OAAO,YAAc,qBACjCA,EAAY,QAAQ,YAAc,sBAClCA,EAAY,YAAY,YAAc,0BACtCA,EAAY,OAAO,YAAc,qBACjCA,EAAY,OAAO,YAAc,qBACjCA,EAAY,QAAQ,YAAc,sBAClCA,EAAY,OAAO,YAAc,qBACjCA,EAAY,MAAM,YAAc,oBAChCA,EAAY,QAAQ,YAAc"}
1
+ {"version":3,"file":"index.js","sources":["../../src/alert-dialog/AlertDialogContext.tsx","../../src/alert-dialog/AlertDialog.tsx","../../src/alert-dialog/useRenderSlot.tsx","../../src/alert-dialog/AlertDialogAction.tsx","../../src/alert-dialog/AlertDialogBody.tsx","../../src/alert-dialog/AlertDialogCancel.tsx","../../src/alert-dialog/AlertDialogContent.tsx","../../src/alert-dialog/AlertDialogDescription.tsx","../../src/alert-dialog/AlertDialogFooter.tsx","../../src/alert-dialog/AlertDialogHeader.tsx","../../src/alert-dialog/AlertDialogOverlay.tsx","../../src/alert-dialog/AlertDialogPortal.tsx","../../src/alert-dialog/AlertDialogTitle.tsx","../../src/alert-dialog/AlertDialogTrigger.tsx","../../src/alert-dialog/index.ts"],"sourcesContent":["import { createContext, MutableRefObject, type ReactNode, useContext } from 'react'\n\nexport interface AlertDialogContextValue {\n cancelRef: MutableRefObject<HTMLButtonElement | null>\n withFade: boolean\n}\n\nexport const AlertDialogContext = createContext<AlertDialogContextValue | null>(null)\n\nexport const AlertDialogProvider = ({\n children,\n withFade = false,\n cancelRef,\n}: {\n children: ReactNode\n withFade?: boolean\n cancelRef: MutableRefObject<HTMLButtonElement | null>\n}) => {\n return (\n <AlertDialogContext.Provider\n value={{\n cancelRef,\n withFade,\n }}\n >\n {children}\n </AlertDialogContext.Provider>\n )\n}\n\nexport const useAlertDialog = () => {\n const context = useContext(AlertDialogContext)\n\n if (!context) {\n throw Error('useAlertDialog must be used within an AlertDialog provider')\n }\n\n return context\n}\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { ComponentProps, Ref, useRef } from 'react'\n\nimport { AlertDialogProvider } from './AlertDialogContext'\n\nexport interface AlertDialogProps\n extends Omit<ComponentProps<typeof BaseAlertDialog.Root>, 'onOpenChange' | 'render'> {\n /**\n * Specifies if the dialog is open or not.\n */\n open?: boolean\n /**\n * Default open state.\n */\n defaultOpen?: boolean\n /**\n * Handler executed on every dialog open state change.\n */\n onOpenChange?: (open: boolean) => void\n /**\n * Specifies if the dialog should have a fade animation on its body (in case it is scrollable).\n */\n withFade?: boolean\n /**\n * Change the default rendered element for the one passed as a child, merging their props and behavior.\n */\n asChild?: boolean\n ref?: Ref<HTMLDivElement>\n}\n\nexport const AlertDialog = ({ onOpenChange, withFade = false, ...props }: AlertDialogProps) => {\n const cancelRef = useRef<HTMLButtonElement | null>(null)\n\n const handleOpenChange = onOpenChange\n ? (open: boolean, _eventDetails: unknown) => {\n onOpenChange(open)\n }\n : undefined\n\n return (\n <AlertDialogProvider withFade={withFade} cancelRef={cancelRef}>\n <BaseAlertDialog.Root\n data-spark-component=\"alert-dialog\"\n onOpenChange={handleOpenChange}\n {...props}\n />\n </AlertDialogProvider>\n )\n}\n\nAlertDialog.displayName = 'AlertDialog'\n","import { Slot } from '../slot'\n\nexport function useRenderSlot(asChild: boolean, defaultTag: string) {\n const Component = asChild ? Slot : defaultTag\n\n return asChild ? ({ ...props }) => <Component {...props} /> : undefined\n}\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { ComponentProps, Ref } from 'react'\n\nimport { useRenderSlot } from './useRenderSlot'\n\nexport interface AlertDialogActionProps\n extends Omit<ComponentProps<typeof BaseAlertDialog.Close>, 'render'> {\n /**\n * Change the default rendered element for the one passed as a child, merging their props and behavior.\n */\n asChild?: boolean\n ref?: Ref<HTMLButtonElement>\n}\n\nexport const AlertDialogAction = ({ asChild = false, ...props }: AlertDialogActionProps) => {\n const renderSlot = useRenderSlot(asChild, 'button')\n\n return (\n <BaseAlertDialog.Close\n data-spark-component=\"alert-dialog-action\"\n render={renderSlot}\n {...props}\n />\n )\n}\n\nAlertDialogAction.displayName = 'AlertDialog.Action'\n","import { useMergeRefs } from '@spark-ui/hooks/use-merge-refs'\nimport { useScrollOverflow } from '@spark-ui/hooks/use-scroll-overflow'\nimport { cx } from 'class-variance-authority'\nimport { type ReactElement, type ReactNode, Ref, useRef } from 'react'\n\nimport { useAlertDialog } from './AlertDialogContext'\n\nexport interface AlertDialogBodyProps {\n children: ReactNode\n className?: string\n tabIndex?: number\n ref?: Ref<HTMLDivElement>\n inset?: boolean\n}\n\nexport const AlertDialogBody = ({\n children,\n className,\n inset = false,\n ref: forwardedRef,\n ...rest\n}: AlertDialogBodyProps): ReactElement => {\n const scrollAreaRef = useRef<HTMLDivElement>(null)\n const ref = useMergeRefs(forwardedRef, scrollAreaRef)\n\n const { withFade } = useAlertDialog()\n const { overflow } = useScrollOverflow(scrollAreaRef)\n\n return (\n <div\n data-spark-component=\"alert-dialog-body\"\n ref={ref}\n className={cx(\n 'focus-visible:u-outline relative grow overflow-y-auto outline-hidden',\n 'transition-all duration-300',\n {\n ['px-xl py-lg']: !inset,\n },\n className\n )}\n style={{\n ...(withFade && {\n maskImage:\n 'linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1) 44px, rgba(0, 0, 0, 1) calc(100% - 44px), rgba(0, 0, 0, 0))',\n maskSize: `100% calc(100% + ${overflow.top ? '0px' : '44px'} + ${overflow.bottom ? '0px' : '44px'})`,\n maskPosition: `0 ${overflow.top ? '0px' : '-44px'}`,\n }),\n }}\n {...rest}\n >\n {children}\n </div>\n )\n}\n\nAlertDialogBody.displayName = 'AlertDialog.Body'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { useMergeRefs } from '@spark-ui/hooks/use-merge-refs'\nimport { ComponentProps, Ref } from 'react'\n\nimport { useAlertDialog } from './AlertDialogContext'\nimport { useRenderSlot } from './useRenderSlot'\n\nexport interface AlertDialogCancelProps\n extends Omit<ComponentProps<typeof BaseAlertDialog.Close>, 'render'> {\n /**\n * Change the default rendered element for the one passed as a child, merging their props and behavior.\n */\n asChild?: boolean\n ref?: Ref<HTMLButtonElement>\n}\n\nexport const AlertDialogCancel = ({\n asChild = false,\n ref: forwardedRef,\n ...props\n}: AlertDialogCancelProps) => {\n const { cancelRef } = useAlertDialog()\n const ref = useMergeRefs(forwardedRef, cancelRef)\n const renderSlot = useRenderSlot(asChild, 'button')\n\n return (\n <BaseAlertDialog.Close\n ref={ref}\n data-spark-component=\"alert-dialog-cancel\"\n render={renderSlot}\n {...props}\n />\n )\n}\n\nAlertDialogCancel.displayName = 'AlertDialog.Cancel'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nimport { dialogContentStyles } from '../dialog/DialogContent.styles'\nimport { useAlertDialog } from './AlertDialogContext'\n\nexport interface AlertDialogContentProps\n extends Omit<ComponentProps<typeof BaseAlertDialog.Popup>, 'render'> {\n ref?: Ref<HTMLDivElement>\n}\n\nexport const AlertDialogContent = ({\n className,\n ref,\n initialFocus,\n ...others\n}: AlertDialogContentProps) => {\n const { cancelRef } = useAlertDialog()\n\n // Default: focus the cancel button when dialog opens\n // Users can override by passing their own initialFocus prop (RefObject, false, true, or function)\n const handleInitialFocus = initialFocus !== undefined ? initialFocus : () => cancelRef.current\n\n return (\n <BaseAlertDialog.Popup\n ref={ref}\n data-spark-component=\"alert-dialog-content\"\n role=\"alertdialog\"\n className={state =>\n cx(\n dialogContentStyles({ size: 'md', isNarrow: true }),\n 'min-w-[min(288px,calc(100vw-2rem))]',\n // Base UI automatically adds data-[starting-style] and data-[ending-style] attributes\n // Transition with opacity and scale for smooth open/close animations\n 'transition-all duration-150',\n 'data-starting-style:scale-90 data-starting-style:opacity-0',\n 'data-ending-style:scale-90 data-ending-style:opacity-0',\n typeof className === 'function' ? className(state) : className\n )\n }\n initialFocus={handleInitialFocus}\n {...others}\n />\n )\n}\n\nAlertDialogContent.displayName = 'AlertDialog.Content'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface AlertDialogDescriptionProps\n extends Omit<ComponentProps<typeof BaseAlertDialog.Description>, 'render'> {\n ref?: Ref<HTMLParagraphElement>\n}\n\nexport const AlertDialogDescription = (props: AlertDialogDescriptionProps) => {\n return <BaseAlertDialog.Description data-spark-component=\"alert-dialog-description\" {...props} />\n}\n\nAlertDialogDescription.displayName = 'AlertDialog.Description'\n","import { cx } from 'class-variance-authority'\nimport { type ReactElement, type ReactNode, Ref } from 'react'\n\nexport interface AlertDialogFooterProps {\n children: ReactNode\n className?: string\n ref?: Ref<HTMLDivElement>\n}\n\nexport const AlertDialogFooter = ({\n children,\n className,\n ref,\n ...rest\n}: AlertDialogFooterProps): ReactElement => (\n <footer\n data-spark-component=\"alert-dialog-footer\"\n ref={ref}\n className={cx(className, ['px-xl', 'py-lg'])}\n {...rest}\n >\n {children}\n </footer>\n)\n\nAlertDialogFooter.displayName = 'AlertDialog.Footer'\n","import { cx } from 'class-variance-authority'\nimport { type ReactElement, type ReactNode, Ref } from 'react'\n\nexport interface AlertDialogHeaderProps {\n children: ReactNode\n className?: string\n ref?: Ref<HTMLDivElement>\n}\n\nexport const AlertDialogHeader = ({\n children,\n className,\n ref,\n ...rest\n}: AlertDialogHeaderProps): ReactElement => (\n <header\n data-spark-component=\"alert-dialog-header\"\n ref={ref}\n className={cx(className, ['px-xl', 'py-lg'])}\n {...rest}\n >\n {children}\n </header>\n)\n\nAlertDialogHeader.displayName = 'AlertDialog.Header'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface AlertDialogOverlayProps\n extends Omit<ComponentProps<typeof BaseAlertDialog.Backdrop>, 'render'> {\n ref?: Ref<HTMLDivElement>\n}\n\nexport const AlertDialogOverlay = ({ className, ...props }: AlertDialogOverlayProps) => {\n return (\n <BaseAlertDialog.Backdrop\n data-spark-component=\"alert-dialog-overlay\"\n className={state =>\n cx(\n 'z-overlay fixed top-0 left-0 h-screen w-screen',\n 'bg-overlay/dim-1',\n // Base UI automatically adds data-[starting-style] and data-[ending-style] attributes\n 'data-starting-style:animate-fade-in',\n 'data-ending-style:animate-fade-out',\n typeof className === 'function' ? className(state) : className\n )\n }\n {...props}\n />\n )\n}\n\nAlertDialogOverlay.displayName = 'AlertDialog.Overlay'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps } from 'react'\n\nexport type AlertDialogPortalProps = ComponentProps<typeof BaseAlertDialog.Portal>\n\nexport const AlertDialogPortal = ({ className, ...props }: AlertDialogPortalProps) => {\n return (\n <BaseAlertDialog.Portal\n data-spark-component=\"alert-dialog-portal\"\n className={cx(className, 'z-modal absolute')}\n {...props}\n />\n )\n}\n\nAlertDialogPortal.displayName = 'AlertDialog.Portal'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface AlertDialogTitleProps\n extends Omit<ComponentProps<typeof BaseAlertDialog.Title>, 'render'> {\n ref?: Ref<HTMLHeadingElement>\n}\n\nexport const AlertDialogTitle = ({ className, ...props }: AlertDialogTitleProps) => {\n return (\n <BaseAlertDialog.Title\n data-spark-component=\"alert-dialog-title\"\n className={cx('text-headline-1 text-on-surface', className)}\n {...props}\n />\n )\n}\n\nAlertDialogTitle.displayName = 'AlertDialog.Title'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { ComponentProps, Ref } from 'react'\n\nimport { useRenderSlot } from './useRenderSlot'\n\nexport interface AlertDialogTriggerProps\n extends Omit<ComponentProps<typeof BaseAlertDialog.Trigger>, 'render'> {\n /**\n * Change the default rendered element for the one passed as a child, merging their props and behavior.\n */\n asChild?: boolean\n ref?: Ref<HTMLButtonElement>\n}\n\nexport const AlertDialogTrigger = ({ asChild = false, ...props }: AlertDialogTriggerProps) => {\n const renderSlot = useRenderSlot(asChild, 'button')\n\n return (\n <BaseAlertDialog.Trigger\n data-spark-component=\"alert-dialog-trigger\"\n render={renderSlot}\n {...props}\n />\n )\n}\n\nAlertDialogTrigger.displayName = 'AlertDialog.Trigger'\n","import { AlertDialog as Root } from './AlertDialog'\nimport { AlertDialogAction } from './AlertDialogAction'\nimport { AlertDialogBody } from './AlertDialogBody'\nimport { AlertDialogCancel } from './AlertDialogCancel'\nimport { AlertDialogContent } from './AlertDialogContent'\nimport { AlertDialogDescription } from './AlertDialogDescription'\nimport { AlertDialogFooter } from './AlertDialogFooter'\nimport { AlertDialogHeader } from './AlertDialogHeader'\nimport { AlertDialogOverlay } from './AlertDialogOverlay'\nimport { AlertDialogPortal } from './AlertDialogPortal'\nimport { AlertDialogTitle } from './AlertDialogTitle'\nimport { AlertDialogTrigger } from './AlertDialogTrigger'\n\nexport * from './AlertDialog'\nexport { useAlertDialog } from './AlertDialogContext'\nexport { type AlertDialogActionProps } from './AlertDialogAction'\nexport { type AlertDialogBodyProps } from './AlertDialogBody'\nexport { type AlertDialogCancelProps } from './AlertDialogCancel'\nexport { type AlertDialogContentProps } from './AlertDialogContent'\nexport { type AlertDialogDescriptionProps } from './AlertDialogDescription'\nexport { type AlertDialogFooterProps } from './AlertDialogFooter'\nexport { type AlertDialogHeaderProps } from './AlertDialogHeader'\nexport { type AlertDialogOverlayProps } from './AlertDialogOverlay'\nexport { type AlertDialogPortalProps } from './AlertDialogPortal'\nexport { type AlertDialogTitleProps } from './AlertDialogTitle'\nexport { type AlertDialogTriggerProps } from './AlertDialogTrigger'\n\nexport const AlertDialog: typeof Root & {\n Action: typeof AlertDialogAction\n Body: typeof AlertDialogBody\n Cancel: typeof AlertDialogCancel\n Content: typeof AlertDialogContent\n Description: typeof AlertDialogDescription\n Footer: typeof AlertDialogFooter\n Header: typeof AlertDialogHeader\n Overlay: typeof AlertDialogOverlay\n Portal: typeof AlertDialogPortal\n Title: typeof AlertDialogTitle\n Trigger: typeof AlertDialogTrigger\n} = Object.assign(Root, {\n Action: AlertDialogAction,\n Body: AlertDialogBody,\n Cancel: AlertDialogCancel,\n Content: AlertDialogContent,\n Description: AlertDialogDescription,\n Footer: AlertDialogFooter,\n Header: AlertDialogHeader,\n Overlay: AlertDialogOverlay,\n Portal: AlertDialogPortal,\n Title: AlertDialogTitle,\n Trigger: AlertDialogTrigger,\n})\n\nAlertDialog.displayName = 'AlertDialog'\nAlertDialog.Action.displayName = 'AlertDialog.Action'\nAlertDialog.Body.displayName = 'AlertDialog.Body'\nAlertDialog.Cancel.displayName = 'AlertDialog.Cancel'\nAlertDialog.Content.displayName = 'AlertDialog.Content'\nAlertDialog.Description.displayName = 'AlertDialog.Description'\nAlertDialog.Footer.displayName = 'AlertDialog.Footer'\nAlertDialog.Header.displayName = 'AlertDialog.Header'\nAlertDialog.Overlay.displayName = 'AlertDialog.Overlay'\nAlertDialog.Portal.displayName = 'AlertDialog.Portal'\nAlertDialog.Title.displayName = 'AlertDialog.Title'\nAlertDialog.Trigger.displayName = 'AlertDialog.Trigger'\n"],"names":["AlertDialogContext","createContext","AlertDialogProvider","children","withFade","cancelRef","jsx","useAlertDialog","context","useContext","AlertDialog","onOpenChange","props","useRef","handleOpenChange","open","_eventDetails","BaseAlertDialog","useRenderSlot","asChild","defaultTag","Component","Slot","AlertDialogAction","renderSlot","AlertDialogBody","className","inset","forwardedRef","rest","scrollAreaRef","ref","useMergeRefs","overflow","useScrollOverflow","cx","AlertDialogCancel","AlertDialogContent","initialFocus","others","handleInitialFocus","state","dialogContentStyles","AlertDialogDescription","AlertDialogFooter","AlertDialogHeader","AlertDialogOverlay","AlertDialogPortal","AlertDialogTitle","AlertDialogTrigger","Root"],"mappings":"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"}
@@ -5,8 +5,8 @@ import { a as F } from "../Slot-D2Bbf8Gw.mjs";
5
5
  import { useMergeRefs as D } from "@spark-ui/hooks/use-merge-refs";
6
6
  import { useScrollOverflow as B } from "@spark-ui/hooks/use-scroll-overflow";
7
7
  import { cx as d } from "class-variance-authority";
8
- import { d as z } from "../DialogContent.styles-BSfXHt21.mjs";
9
- const A = R(null), H = ({
8
+ import { d as H } from "../DialogContent.styles-Du7_Dkde.mjs";
9
+ const A = R(null), $ = ({
10
10
  children: e,
11
11
  withFade: t = !1,
12
12
  cancelRef: a
@@ -19,7 +19,7 @@ const A = R(null), H = ({
19
19
  },
20
20
  children: e
21
21
  }
22
- ), p = () => {
22
+ ), g = () => {
23
23
  const e = S(A);
24
24
  if (!e)
25
25
  throw Error("useAlertDialog must be used within an AlertDialog provider");
@@ -28,7 +28,7 @@ const A = R(null), H = ({
28
28
  const l = y(null), s = e ? (n, c) => {
29
29
  e(n);
30
30
  } : void 0;
31
- return /* @__PURE__ */ o(H, { withFade: t, cancelRef: l, children: /* @__PURE__ */ o(
31
+ return /* @__PURE__ */ o($, { withFade: t, cancelRef: l, children: /* @__PURE__ */ o(
32
32
  i.Root,
33
33
  {
34
34
  "data-spark-component": "alert-dialog",
@@ -61,7 +61,7 @@ const N = ({
61
61
  ref: l,
62
62
  ...s
63
63
  }) => {
64
- const n = y(null), c = D(l, n), { withFade: O } = p(), { overflow: g } = B(n);
64
+ const n = y(null), c = D(l, n), { withFade: O } = g(), { overflow: p } = B(n);
65
65
  return /* @__PURE__ */ o(
66
66
  "div",
67
67
  {
@@ -78,8 +78,8 @@ const N = ({
78
78
  style: {
79
79
  ...O && {
80
80
  maskImage: "linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1) 44px, rgba(0, 0, 0, 1) calc(100% - 44px), rgba(0, 0, 0, 0))",
81
- maskSize: `100% calc(100% + ${g.top ? "0px" : "44px"} + ${g.bottom ? "0px" : "44px"})`,
82
- maskPosition: `0 ${g.top ? "0px" : "-44px"}`
81
+ maskSize: `100% calc(100% + ${p.top ? "0px" : "44px"} + ${p.bottom ? "0px" : "44px"})`,
82
+ maskPosition: `0 ${p.top ? "0px" : "-44px"}`
83
83
  }
84
84
  },
85
85
  ...s,
@@ -93,7 +93,7 @@ const x = ({
93
93
  ref: t,
94
94
  ...a
95
95
  }) => {
96
- const { cancelRef: l } = p(), s = D(t, l), n = m(e, "button");
96
+ const { cancelRef: l } = g(), s = D(t, l), n = m(e, "button");
97
97
  return /* @__PURE__ */ o(
98
98
  i.Close,
99
99
  {
@@ -111,7 +111,7 @@ const v = ({
111
111
  initialFocus: a,
112
112
  ...l
113
113
  }) => {
114
- const { cancelRef: s } = p(), n = a !== void 0 ? a : () => s.current;
114
+ const { cancelRef: s } = g(), n = a !== void 0 ? a : () => s.current;
115
115
  return /* @__PURE__ */ o(
116
116
  i.Popup,
117
117
  {
@@ -119,8 +119,8 @@ const v = ({
119
119
  "data-spark-component": "alert-dialog-content",
120
120
  role: "alertdialog",
121
121
  className: (c) => d(
122
- z({ size: "md", isNarrow: !0 }),
123
- "min-w-sz-288",
122
+ H({ size: "md", isNarrow: !0 }),
123
+ "min-w-[min(288px,calc(100vw-2rem))]",
124
124
  // Base UI automatically adds data-[starting-style] and data-[ending-style] attributes
125
125
  // Transition with opacity and scale for smooth open/close animations
126
126
  "transition-all duration-150",
@@ -241,6 +241,6 @@ r.Title.displayName = "AlertDialog.Title";
241
241
  r.Trigger.displayName = "AlertDialog.Trigger";
242
242
  export {
243
243
  r as AlertDialog,
244
- p as useAlertDialog
244
+ g as useAlertDialog
245
245
  };
246
246
  //# sourceMappingURL=index.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.mjs","sources":["../../src/alert-dialog/AlertDialogContext.tsx","../../src/alert-dialog/AlertDialog.tsx","../../src/alert-dialog/useRenderSlot.tsx","../../src/alert-dialog/AlertDialogAction.tsx","../../src/alert-dialog/AlertDialogBody.tsx","../../src/alert-dialog/AlertDialogCancel.tsx","../../src/alert-dialog/AlertDialogContent.tsx","../../src/alert-dialog/AlertDialogDescription.tsx","../../src/alert-dialog/AlertDialogFooter.tsx","../../src/alert-dialog/AlertDialogHeader.tsx","../../src/alert-dialog/AlertDialogOverlay.tsx","../../src/alert-dialog/AlertDialogPortal.tsx","../../src/alert-dialog/AlertDialogTitle.tsx","../../src/alert-dialog/AlertDialogTrigger.tsx","../../src/alert-dialog/index.ts"],"sourcesContent":["import { createContext, MutableRefObject, type ReactNode, useContext } from 'react'\n\nexport interface AlertDialogContextValue {\n cancelRef: MutableRefObject<HTMLButtonElement | null>\n withFade: boolean\n}\n\nexport const AlertDialogContext = createContext<AlertDialogContextValue | null>(null)\n\nexport const AlertDialogProvider = ({\n children,\n withFade = false,\n cancelRef,\n}: {\n children: ReactNode\n withFade?: boolean\n cancelRef: MutableRefObject<HTMLButtonElement | null>\n}) => {\n return (\n <AlertDialogContext.Provider\n value={{\n cancelRef,\n withFade,\n }}\n >\n {children}\n </AlertDialogContext.Provider>\n )\n}\n\nexport const useAlertDialog = () => {\n const context = useContext(AlertDialogContext)\n\n if (!context) {\n throw Error('useAlertDialog must be used within an AlertDialog provider')\n }\n\n return context\n}\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { ComponentProps, Ref, useRef } from 'react'\n\nimport { AlertDialogProvider } from './AlertDialogContext'\n\nexport interface AlertDialogProps\n extends Omit<ComponentProps<typeof BaseAlertDialog.Root>, 'onOpenChange' | 'render'> {\n /**\n * Specifies if the dialog is open or not.\n */\n open?: boolean\n /**\n * Default open state.\n */\n defaultOpen?: boolean\n /**\n * Handler executed on every dialog open state change.\n */\n onOpenChange?: (open: boolean) => void\n /**\n * Specifies if the dialog should have a fade animation on its body (in case it is scrollable).\n */\n withFade?: boolean\n /**\n * Change the default rendered element for the one passed as a child, merging their props and behavior.\n */\n asChild?: boolean\n ref?: Ref<HTMLDivElement>\n}\n\nexport const AlertDialog = ({ onOpenChange, withFade = false, ...props }: AlertDialogProps) => {\n const cancelRef = useRef<HTMLButtonElement | null>(null)\n\n const handleOpenChange = onOpenChange\n ? (open: boolean, _eventDetails: unknown) => {\n onOpenChange(open)\n }\n : undefined\n\n return (\n <AlertDialogProvider withFade={withFade} cancelRef={cancelRef}>\n <BaseAlertDialog.Root\n data-spark-component=\"alert-dialog\"\n onOpenChange={handleOpenChange}\n {...props}\n />\n </AlertDialogProvider>\n )\n}\n\nAlertDialog.displayName = 'AlertDialog'\n","import { Slot } from '../slot'\n\nexport function useRenderSlot(asChild: boolean, defaultTag: string) {\n const Component = asChild ? Slot : defaultTag\n\n return asChild ? ({ ...props }) => <Component {...props} /> : undefined\n}\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { ComponentProps, Ref } from 'react'\n\nimport { useRenderSlot } from './useRenderSlot'\n\nexport interface AlertDialogActionProps\n extends Omit<ComponentProps<typeof BaseAlertDialog.Close>, 'render'> {\n /**\n * Change the default rendered element for the one passed as a child, merging their props and behavior.\n */\n asChild?: boolean\n ref?: Ref<HTMLButtonElement>\n}\n\nexport const AlertDialogAction = ({ asChild = false, ...props }: AlertDialogActionProps) => {\n const renderSlot = useRenderSlot(asChild, 'button')\n\n return (\n <BaseAlertDialog.Close\n data-spark-component=\"alert-dialog-action\"\n render={renderSlot}\n {...props}\n />\n )\n}\n\nAlertDialogAction.displayName = 'AlertDialog.Action'\n","import { useMergeRefs } from '@spark-ui/hooks/use-merge-refs'\nimport { useScrollOverflow } from '@spark-ui/hooks/use-scroll-overflow'\nimport { cx } from 'class-variance-authority'\nimport { type ReactElement, type ReactNode, Ref, useRef } from 'react'\n\nimport { useAlertDialog } from './AlertDialogContext'\n\nexport interface AlertDialogBodyProps {\n children: ReactNode\n className?: string\n tabIndex?: number\n ref?: Ref<HTMLDivElement>\n inset?: boolean\n}\n\nexport const AlertDialogBody = ({\n children,\n className,\n inset = false,\n ref: forwardedRef,\n ...rest\n}: AlertDialogBodyProps): ReactElement => {\n const scrollAreaRef = useRef<HTMLDivElement>(null)\n const ref = useMergeRefs(forwardedRef, scrollAreaRef)\n\n const { withFade } = useAlertDialog()\n const { overflow } = useScrollOverflow(scrollAreaRef)\n\n return (\n <div\n data-spark-component=\"alert-dialog-body\"\n ref={ref}\n className={cx(\n 'focus-visible:u-outline relative grow overflow-y-auto outline-hidden',\n 'transition-all duration-300',\n {\n ['px-xl py-lg']: !inset,\n },\n className\n )}\n style={{\n ...(withFade && {\n maskImage:\n 'linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1) 44px, rgba(0, 0, 0, 1) calc(100% - 44px), rgba(0, 0, 0, 0))',\n maskSize: `100% calc(100% + ${overflow.top ? '0px' : '44px'} + ${overflow.bottom ? '0px' : '44px'})`,\n maskPosition: `0 ${overflow.top ? '0px' : '-44px'}`,\n }),\n }}\n {...rest}\n >\n {children}\n </div>\n )\n}\n\nAlertDialogBody.displayName = 'AlertDialog.Body'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { useMergeRefs } from '@spark-ui/hooks/use-merge-refs'\nimport { ComponentProps, Ref } from 'react'\n\nimport { useAlertDialog } from './AlertDialogContext'\nimport { useRenderSlot } from './useRenderSlot'\n\nexport interface AlertDialogCancelProps\n extends Omit<ComponentProps<typeof BaseAlertDialog.Close>, 'render'> {\n /**\n * Change the default rendered element for the one passed as a child, merging their props and behavior.\n */\n asChild?: boolean\n ref?: Ref<HTMLButtonElement>\n}\n\nexport const AlertDialogCancel = ({\n asChild = false,\n ref: forwardedRef,\n ...props\n}: AlertDialogCancelProps) => {\n const { cancelRef } = useAlertDialog()\n const ref = useMergeRefs(forwardedRef, cancelRef)\n const renderSlot = useRenderSlot(asChild, 'button')\n\n return (\n <BaseAlertDialog.Close\n ref={ref}\n data-spark-component=\"alert-dialog-cancel\"\n render={renderSlot}\n {...props}\n />\n )\n}\n\nAlertDialogCancel.displayName = 'AlertDialog.Cancel'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nimport { dialogContentStyles } from '../dialog/DialogContent.styles'\nimport { useAlertDialog } from './AlertDialogContext'\n\nexport interface AlertDialogContentProps\n extends Omit<ComponentProps<typeof BaseAlertDialog.Popup>, 'render'> {\n ref?: Ref<HTMLDivElement>\n}\n\nexport const AlertDialogContent = ({\n className,\n ref,\n initialFocus,\n ...others\n}: AlertDialogContentProps) => {\n const { cancelRef } = useAlertDialog()\n\n // Default: focus the cancel button when dialog opens\n // Users can override by passing their own initialFocus prop (RefObject, false, true, or function)\n const handleInitialFocus = initialFocus !== undefined ? initialFocus : () => cancelRef.current\n\n return (\n <BaseAlertDialog.Popup\n ref={ref}\n data-spark-component=\"alert-dialog-content\"\n role=\"alertdialog\"\n className={state =>\n cx(\n dialogContentStyles({ size: 'md', isNarrow: true }),\n 'min-w-sz-288',\n // Base UI automatically adds data-[starting-style] and data-[ending-style] attributes\n // Transition with opacity and scale for smooth open/close animations\n 'transition-all duration-150',\n 'data-starting-style:scale-90 data-starting-style:opacity-0',\n 'data-ending-style:scale-90 data-ending-style:opacity-0',\n typeof className === 'function' ? className(state) : className\n )\n }\n initialFocus={handleInitialFocus}\n {...others}\n />\n )\n}\n\nAlertDialogContent.displayName = 'AlertDialog.Content'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface AlertDialogDescriptionProps\n extends Omit<ComponentProps<typeof BaseAlertDialog.Description>, 'render'> {\n ref?: Ref<HTMLParagraphElement>\n}\n\nexport const AlertDialogDescription = (props: AlertDialogDescriptionProps) => {\n return <BaseAlertDialog.Description data-spark-component=\"alert-dialog-description\" {...props} />\n}\n\nAlertDialogDescription.displayName = 'AlertDialog.Description'\n","import { cx } from 'class-variance-authority'\nimport { type ReactElement, type ReactNode, Ref } from 'react'\n\nexport interface AlertDialogFooterProps {\n children: ReactNode\n className?: string\n ref?: Ref<HTMLDivElement>\n}\n\nexport const AlertDialogFooter = ({\n children,\n className,\n ref,\n ...rest\n}: AlertDialogFooterProps): ReactElement => (\n <footer\n data-spark-component=\"alert-dialog-footer\"\n ref={ref}\n className={cx(className, ['px-xl', 'py-lg'])}\n {...rest}\n >\n {children}\n </footer>\n)\n\nAlertDialogFooter.displayName = 'AlertDialog.Footer'\n","import { cx } from 'class-variance-authority'\nimport { type ReactElement, type ReactNode, Ref } from 'react'\n\nexport interface AlertDialogHeaderProps {\n children: ReactNode\n className?: string\n ref?: Ref<HTMLDivElement>\n}\n\nexport const AlertDialogHeader = ({\n children,\n className,\n ref,\n ...rest\n}: AlertDialogHeaderProps): ReactElement => (\n <header\n data-spark-component=\"alert-dialog-header\"\n ref={ref}\n className={cx(className, ['px-xl', 'py-lg'])}\n {...rest}\n >\n {children}\n </header>\n)\n\nAlertDialogHeader.displayName = 'AlertDialog.Header'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface AlertDialogOverlayProps\n extends Omit<ComponentProps<typeof BaseAlertDialog.Backdrop>, 'render'> {\n ref?: Ref<HTMLDivElement>\n}\n\nexport const AlertDialogOverlay = ({ className, ...props }: AlertDialogOverlayProps) => {\n return (\n <BaseAlertDialog.Backdrop\n data-spark-component=\"alert-dialog-overlay\"\n className={state =>\n cx(\n 'z-overlay fixed top-0 left-0 h-screen w-screen',\n 'bg-overlay/dim-1',\n // Base UI automatically adds data-[starting-style] and data-[ending-style] attributes\n 'data-starting-style:animate-fade-in',\n 'data-ending-style:animate-fade-out',\n typeof className === 'function' ? className(state) : className\n )\n }\n {...props}\n />\n )\n}\n\nAlertDialogOverlay.displayName = 'AlertDialog.Overlay'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps } from 'react'\n\nexport type AlertDialogPortalProps = ComponentProps<typeof BaseAlertDialog.Portal>\n\nexport const AlertDialogPortal = ({ className, ...props }: AlertDialogPortalProps) => {\n return (\n <BaseAlertDialog.Portal\n data-spark-component=\"alert-dialog-portal\"\n className={cx(className, 'z-modal absolute')}\n {...props}\n />\n )\n}\n\nAlertDialogPortal.displayName = 'AlertDialog.Portal'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface AlertDialogTitleProps\n extends Omit<ComponentProps<typeof BaseAlertDialog.Title>, 'render'> {\n ref?: Ref<HTMLHeadingElement>\n}\n\nexport const AlertDialogTitle = ({ className, ...props }: AlertDialogTitleProps) => {\n return (\n <BaseAlertDialog.Title\n data-spark-component=\"alert-dialog-title\"\n className={cx('text-headline-1 text-on-surface', className)}\n {...props}\n />\n )\n}\n\nAlertDialogTitle.displayName = 'AlertDialog.Title'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { ComponentProps, Ref } from 'react'\n\nimport { useRenderSlot } from './useRenderSlot'\n\nexport interface AlertDialogTriggerProps\n extends Omit<ComponentProps<typeof BaseAlertDialog.Trigger>, 'render'> {\n /**\n * Change the default rendered element for the one passed as a child, merging their props and behavior.\n */\n asChild?: boolean\n ref?: Ref<HTMLButtonElement>\n}\n\nexport const AlertDialogTrigger = ({ asChild = false, ...props }: AlertDialogTriggerProps) => {\n const renderSlot = useRenderSlot(asChild, 'button')\n\n return (\n <BaseAlertDialog.Trigger\n data-spark-component=\"alert-dialog-trigger\"\n render={renderSlot}\n {...props}\n />\n )\n}\n\nAlertDialogTrigger.displayName = 'AlertDialog.Trigger'\n","import { AlertDialog as Root } from './AlertDialog'\nimport { AlertDialogAction } from './AlertDialogAction'\nimport { AlertDialogBody } from './AlertDialogBody'\nimport { AlertDialogCancel } from './AlertDialogCancel'\nimport { AlertDialogContent } from './AlertDialogContent'\nimport { AlertDialogDescription } from './AlertDialogDescription'\nimport { AlertDialogFooter } from './AlertDialogFooter'\nimport { AlertDialogHeader } from './AlertDialogHeader'\nimport { AlertDialogOverlay } from './AlertDialogOverlay'\nimport { AlertDialogPortal } from './AlertDialogPortal'\nimport { AlertDialogTitle } from './AlertDialogTitle'\nimport { AlertDialogTrigger } from './AlertDialogTrigger'\n\nexport * from './AlertDialog'\nexport { useAlertDialog } from './AlertDialogContext'\nexport { type AlertDialogActionProps } from './AlertDialogAction'\nexport { type AlertDialogBodyProps } from './AlertDialogBody'\nexport { type AlertDialogCancelProps } from './AlertDialogCancel'\nexport { type AlertDialogContentProps } from './AlertDialogContent'\nexport { type AlertDialogDescriptionProps } from './AlertDialogDescription'\nexport { type AlertDialogFooterProps } from './AlertDialogFooter'\nexport { type AlertDialogHeaderProps } from './AlertDialogHeader'\nexport { type AlertDialogOverlayProps } from './AlertDialogOverlay'\nexport { type AlertDialogPortalProps } from './AlertDialogPortal'\nexport { type AlertDialogTitleProps } from './AlertDialogTitle'\nexport { type AlertDialogTriggerProps } from './AlertDialogTrigger'\n\nexport const AlertDialog: typeof Root & {\n Action: typeof AlertDialogAction\n Body: typeof AlertDialogBody\n Cancel: typeof AlertDialogCancel\n Content: typeof AlertDialogContent\n Description: typeof AlertDialogDescription\n Footer: typeof AlertDialogFooter\n Header: typeof AlertDialogHeader\n Overlay: typeof AlertDialogOverlay\n Portal: typeof AlertDialogPortal\n Title: typeof AlertDialogTitle\n Trigger: typeof AlertDialogTrigger\n} = Object.assign(Root, {\n Action: AlertDialogAction,\n Body: AlertDialogBody,\n Cancel: AlertDialogCancel,\n Content: AlertDialogContent,\n Description: AlertDialogDescription,\n Footer: AlertDialogFooter,\n Header: AlertDialogHeader,\n Overlay: AlertDialogOverlay,\n Portal: AlertDialogPortal,\n Title: AlertDialogTitle,\n Trigger: AlertDialogTrigger,\n})\n\nAlertDialog.displayName = 'AlertDialog'\nAlertDialog.Action.displayName = 'AlertDialog.Action'\nAlertDialog.Body.displayName = 'AlertDialog.Body'\nAlertDialog.Cancel.displayName = 'AlertDialog.Cancel'\nAlertDialog.Content.displayName = 'AlertDialog.Content'\nAlertDialog.Description.displayName = 'AlertDialog.Description'\nAlertDialog.Footer.displayName = 'AlertDialog.Footer'\nAlertDialog.Header.displayName = 'AlertDialog.Header'\nAlertDialog.Overlay.displayName = 'AlertDialog.Overlay'\nAlertDialog.Portal.displayName = 'AlertDialog.Portal'\nAlertDialog.Title.displayName = 'AlertDialog.Title'\nAlertDialog.Trigger.displayName = 'AlertDialog.Trigger'\n"],"names":["AlertDialogContext","createContext","AlertDialogProvider","children","withFade","cancelRef","jsx","useAlertDialog","context","useContext","AlertDialog","onOpenChange","props","useRef","handleOpenChange","open","_eventDetails","BaseAlertDialog","useRenderSlot","asChild","defaultTag","Component","Slot","AlertDialogAction","renderSlot","AlertDialogBody","className","inset","forwardedRef","rest","scrollAreaRef","ref","useMergeRefs","overflow","useScrollOverflow","cx","AlertDialogCancel","AlertDialogContent","initialFocus","others","handleInitialFocus","state","dialogContentStyles","AlertDialogDescription","AlertDialogFooter","AlertDialogHeader","AlertDialogOverlay","AlertDialogPortal","AlertDialogTitle","AlertDialogTrigger","Root"],"mappings":";;;;;;;;AAOO,MAAMA,IAAqBC,EAA8C,IAAI,GAEvEC,IAAsB,CAAC;AAAA,EAClC,UAAAC;AAAA,EACA,UAAAC,IAAW;AAAA,EACX,WAAAC;AACF,MAMI,gBAAAC;AAAA,EAACN,EAAmB;AAAA,EAAnB;AAAA,IACC,OAAO;AAAA,MACL,WAAAK;AAAA,MACA,UAAAD;AAAA,IAAA;AAAA,IAGD,UAAAD;AAAA,EAAA;AAAA,GAKMI,IAAiB,MAAM;AAClC,QAAMC,IAAUC,EAAWT,CAAkB;AAE7C,MAAI,CAACQ;AACH,UAAM,MAAM,4DAA4D;AAG1E,SAAOA;AACT,GCRaE,IAAc,CAAC,EAAE,cAAAC,GAAc,UAAAP,IAAW,IAAO,GAAGQ,QAA8B;AAC7F,QAAMP,IAAYQ,EAAiC,IAAI,GAEjDC,IAAmBH,IACrB,CAACI,GAAeC,MAA2B;AACzC,IAAAL,EAAaI,CAAI;AAAA,EACnB,IACA;AAEJ,SACE,gBAAAT,EAACJ,GAAA,EAAoB,UAAAE,GAAoB,WAAAC,GACvC,UAAA,gBAAAC;AAAA,IAACW,EAAgB;AAAA,IAAhB;AAAA,MACC,wBAAqB;AAAA,MACrB,cAAcH;AAAA,MACb,GAAGF;AAAA,IAAA;AAAA,EAAA,GAER;AAEJ;AAEAF,EAAY,cAAc;AChDnB,SAASQ,EAAcC,GAAkBC,GAAoB;AAClE,QAAMC,IAAYF,IAAUG,IAAOF;AAEnC,SAAOD,IAAU,CAAC,EAAE,GAAGP,EAAA,MAAY,gBAAAN,EAACe,GAAA,EAAW,GAAGT,EAAA,CAAO,IAAK;AAChE;ACQO,MAAMW,IAAoB,CAAC,EAAE,SAAAJ,IAAU,IAAO,GAAGP,QAAoC;AAC1F,QAAMY,IAAaN,EAAcC,GAAS,QAAQ;AAElD,SACE,gBAAAb;AAAA,IAACW,EAAgB;AAAA,IAAhB;AAAA,MACC,wBAAqB;AAAA,MACrB,QAAQO;AAAA,MACP,GAAGZ;AAAA,IAAA;AAAA,EAAA;AAGV;AAEAW,EAAkB,cAAc;ACXzB,MAAME,IAAkB,CAAC;AAAA,EAC9B,UAAAtB;AAAA,EACA,WAAAuB;AAAA,EACA,OAAAC,IAAQ;AAAA,EACR,KAAKC;AAAA,EACL,GAAGC;AACL,MAA0C;AACxC,QAAMC,IAAgBjB,EAAuB,IAAI,GAC3CkB,IAAMC,EAAaJ,GAAcE,CAAa,GAE9C,EAAE,UAAA1B,EAAA,IAAaG,EAAA,GACf,EAAE,UAAA0B,EAAA,IAAaC,EAAkBJ,CAAa;AAEpD,SACE,gBAAAxB;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,wBAAqB;AAAA,MACrB,KAAAyB;AAAA,MACA,WAAWI;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,UACG,eAAgB,CAACR;AAAA,QAAA;AAAA,QAEpBD;AAAA,MAAA;AAAA,MAEF,OAAO;AAAA,QACL,GAAItB,KAAY;AAAA,UACd,WACE;AAAA,UACF,UAAU,oBAAoB6B,EAAS,MAAM,QAAQ,MAAM,MAAMA,EAAS,SAAS,QAAQ,MAAM;AAAA,UACjG,cAAc,KAAKA,EAAS,MAAM,QAAQ,OAAO;AAAA,QAAA;AAAA,MACnD;AAAA,MAED,GAAGJ;AAAA,MAEH,UAAA1B;AAAA,IAAA;AAAA,EAAA;AAGP;AAEAsB,EAAgB,cAAc;ACvCvB,MAAMW,IAAoB,CAAC;AAAA,EAChC,SAAAjB,IAAU;AAAA,EACV,KAAKS;AAAA,EACL,GAAGhB;AACL,MAA8B;AAC5B,QAAM,EAAE,WAAAP,EAAA,IAAcE,EAAA,GAChBwB,IAAMC,EAAaJ,GAAcvB,CAAS,GAC1CmB,IAAaN,EAAcC,GAAS,QAAQ;AAElD,SACE,gBAAAb;AAAA,IAACW,EAAgB;AAAA,IAAhB;AAAA,MACC,KAAAc;AAAA,MACA,wBAAqB;AAAA,MACrB,QAAQP;AAAA,MACP,GAAGZ;AAAA,IAAA;AAAA,EAAA;AAGV;AAEAwB,EAAkB,cAAc;ACvBzB,MAAMC,IAAqB,CAAC;AAAA,EACjC,WAAAX;AAAA,EACA,KAAAK;AAAA,EACA,cAAAO;AAAA,EACA,GAAGC;AACL,MAA+B;AAC7B,QAAM,EAAE,WAAAlC,EAAA,IAAcE,EAAA,GAIhBiC,IAAqBF,MAAiB,SAAYA,IAAe,MAAMjC,EAAU;AAEvF,SACE,gBAAAC;AAAA,IAACW,EAAgB;AAAA,IAAhB;AAAA,MACC,KAAAc;AAAA,MACA,wBAAqB;AAAA,MACrB,MAAK;AAAA,MACL,WAAW,CAAAU,MACTN;AAAA,QACEO,EAAoB,EAAE,MAAM,MAAM,UAAU,IAAM;AAAA,QAClD;AAAA;AAAA;AAAA,QAGA;AAAA,QACA;AAAA,QACA;AAAA,QACA,OAAOhB,KAAc,aAAaA,EAAUe,CAAK,IAAIf;AAAA,MAAA;AAAA,MAGzD,cAAcc;AAAA,MACb,GAAGD;AAAA,IAAA;AAAA,EAAA;AAGV;AAEAF,EAAmB,cAAc;ACvC1B,MAAMM,IAAyB,CAAC/B,wBAC7BK,EAAgB,aAAhB,EAA4B,wBAAqB,4BAA4B,GAAGL,GAAO;AAGjG+B,EAAuB,cAAc;ACH9B,MAAMC,IAAoB,CAAC;AAAA,EAChC,UAAAzC;AAAA,EACA,WAAAuB;AAAA,EACA,KAAAK;AAAA,EACA,GAAGF;AACL,MACE,gBAAAvB;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,wBAAqB;AAAA,IACrB,KAAAyB;AAAA,IACA,WAAWI,EAAGT,GAAW,CAAC,SAAS,OAAO,CAAC;AAAA,IAC1C,GAAGG;AAAA,IAEH,UAAA1B;AAAA,EAAA;AACH;AAGFyC,EAAkB,cAAc;AChBzB,MAAMC,IAAoB,CAAC;AAAA,EAChC,UAAA1C;AAAA,EACA,WAAAuB;AAAA,EACA,KAAAK;AAAA,EACA,GAAGF;AACL,MACE,gBAAAvB;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,wBAAqB;AAAA,IACrB,KAAAyB;AAAA,IACA,WAAWI,EAAGT,GAAW,CAAC,SAAS,OAAO,CAAC;AAAA,IAC1C,GAAGG;AAAA,IAEH,UAAA1B;AAAA,EAAA;AACH;AAGF0C,EAAkB,cAAc;AChBzB,MAAMC,IAAqB,CAAC,EAAE,WAAApB,GAAW,GAAGd,QAE/C,gBAAAN;AAAA,EAACW,EAAgB;AAAA,EAAhB;AAAA,IACC,wBAAqB;AAAA,IACrB,WAAW,CAAAwB,MACTN;AAAA,MACE;AAAA,MACA;AAAA;AAAA,MAEA;AAAA,MACA;AAAA,MACA,OAAOT,KAAc,aAAaA,EAAUe,CAAK,IAAIf;AAAA,IAAA;AAAA,IAGxD,GAAGd;AAAA,EAAA;AAAA;AAKVkC,EAAmB,cAAc;ACtB1B,MAAMC,IAAoB,CAAC,EAAE,WAAArB,GAAW,GAAGd,QAE9C,gBAAAN;AAAA,EAACW,EAAgB;AAAA,EAAhB;AAAA,IACC,wBAAqB;AAAA,IACrB,WAAWkB,EAAGT,GAAW,kBAAkB;AAAA,IAC1C,GAAGd;AAAA,EAAA;AAAA;AAKVmC,EAAkB,cAAc;ACPzB,MAAMC,IAAmB,CAAC,EAAE,WAAAtB,GAAW,GAAGd,QAE7C,gBAAAN;AAAA,EAACW,EAAgB;AAAA,EAAhB;AAAA,IACC,wBAAqB;AAAA,IACrB,WAAWkB,EAAG,mCAAmCT,CAAS;AAAA,IACzD,GAAGd;AAAA,EAAA;AAAA;AAKVoC,EAAiB,cAAc;ACLxB,MAAMC,IAAqB,CAAC,EAAE,SAAA9B,IAAU,IAAO,GAAGP,QAAqC;AAC5F,QAAMY,IAAaN,EAAcC,GAAS,QAAQ;AAElD,SACE,gBAAAb;AAAA,IAACW,EAAgB;AAAA,IAAhB;AAAA,MACC,wBAAqB;AAAA,MACrB,QAAQO;AAAA,MACP,GAAGZ;AAAA,IAAA;AAAA,EAAA;AAGV;AAEAqC,EAAmB,cAAc;ACC1B,MAAMvC,IAYT,OAAO,OAAOwC,GAAM;AAAA,EACtB,QAAQ3B;AAAA,EACR,MAAME;AAAA,EACN,QAAQW;AAAA,EACR,SAASC;AAAA,EACT,aAAaM;AAAA,EACb,QAAQC;AAAA,EACR,QAAQC;AAAA,EACR,SAASC;AAAA,EACT,QAAQC;AAAA,EACR,OAAOC;AAAA,EACP,SAASC;AACX,CAAC;AAEDvC,EAAY,cAAc;AAC1BA,EAAY,OAAO,cAAc;AACjCA,EAAY,KAAK,cAAc;AAC/BA,EAAY,OAAO,cAAc;AACjCA,EAAY,QAAQ,cAAc;AAClCA,EAAY,YAAY,cAAc;AACtCA,EAAY,OAAO,cAAc;AACjCA,EAAY,OAAO,cAAc;AACjCA,EAAY,QAAQ,cAAc;AAClCA,EAAY,OAAO,cAAc;AACjCA,EAAY,MAAM,cAAc;AAChCA,EAAY,QAAQ,cAAc;"}
1
+ {"version":3,"file":"index.mjs","sources":["../../src/alert-dialog/AlertDialogContext.tsx","../../src/alert-dialog/AlertDialog.tsx","../../src/alert-dialog/useRenderSlot.tsx","../../src/alert-dialog/AlertDialogAction.tsx","../../src/alert-dialog/AlertDialogBody.tsx","../../src/alert-dialog/AlertDialogCancel.tsx","../../src/alert-dialog/AlertDialogContent.tsx","../../src/alert-dialog/AlertDialogDescription.tsx","../../src/alert-dialog/AlertDialogFooter.tsx","../../src/alert-dialog/AlertDialogHeader.tsx","../../src/alert-dialog/AlertDialogOverlay.tsx","../../src/alert-dialog/AlertDialogPortal.tsx","../../src/alert-dialog/AlertDialogTitle.tsx","../../src/alert-dialog/AlertDialogTrigger.tsx","../../src/alert-dialog/index.ts"],"sourcesContent":["import { createContext, MutableRefObject, type ReactNode, useContext } from 'react'\n\nexport interface AlertDialogContextValue {\n cancelRef: MutableRefObject<HTMLButtonElement | null>\n withFade: boolean\n}\n\nexport const AlertDialogContext = createContext<AlertDialogContextValue | null>(null)\n\nexport const AlertDialogProvider = ({\n children,\n withFade = false,\n cancelRef,\n}: {\n children: ReactNode\n withFade?: boolean\n cancelRef: MutableRefObject<HTMLButtonElement | null>\n}) => {\n return (\n <AlertDialogContext.Provider\n value={{\n cancelRef,\n withFade,\n }}\n >\n {children}\n </AlertDialogContext.Provider>\n )\n}\n\nexport const useAlertDialog = () => {\n const context = useContext(AlertDialogContext)\n\n if (!context) {\n throw Error('useAlertDialog must be used within an AlertDialog provider')\n }\n\n return context\n}\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { ComponentProps, Ref, useRef } from 'react'\n\nimport { AlertDialogProvider } from './AlertDialogContext'\n\nexport interface AlertDialogProps\n extends Omit<ComponentProps<typeof BaseAlertDialog.Root>, 'onOpenChange' | 'render'> {\n /**\n * Specifies if the dialog is open or not.\n */\n open?: boolean\n /**\n * Default open state.\n */\n defaultOpen?: boolean\n /**\n * Handler executed on every dialog open state change.\n */\n onOpenChange?: (open: boolean) => void\n /**\n * Specifies if the dialog should have a fade animation on its body (in case it is scrollable).\n */\n withFade?: boolean\n /**\n * Change the default rendered element for the one passed as a child, merging their props and behavior.\n */\n asChild?: boolean\n ref?: Ref<HTMLDivElement>\n}\n\nexport const AlertDialog = ({ onOpenChange, withFade = false, ...props }: AlertDialogProps) => {\n const cancelRef = useRef<HTMLButtonElement | null>(null)\n\n const handleOpenChange = onOpenChange\n ? (open: boolean, _eventDetails: unknown) => {\n onOpenChange(open)\n }\n : undefined\n\n return (\n <AlertDialogProvider withFade={withFade} cancelRef={cancelRef}>\n <BaseAlertDialog.Root\n data-spark-component=\"alert-dialog\"\n onOpenChange={handleOpenChange}\n {...props}\n />\n </AlertDialogProvider>\n )\n}\n\nAlertDialog.displayName = 'AlertDialog'\n","import { Slot } from '../slot'\n\nexport function useRenderSlot(asChild: boolean, defaultTag: string) {\n const Component = asChild ? Slot : defaultTag\n\n return asChild ? ({ ...props }) => <Component {...props} /> : undefined\n}\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { ComponentProps, Ref } from 'react'\n\nimport { useRenderSlot } from './useRenderSlot'\n\nexport interface AlertDialogActionProps\n extends Omit<ComponentProps<typeof BaseAlertDialog.Close>, 'render'> {\n /**\n * Change the default rendered element for the one passed as a child, merging their props and behavior.\n */\n asChild?: boolean\n ref?: Ref<HTMLButtonElement>\n}\n\nexport const AlertDialogAction = ({ asChild = false, ...props }: AlertDialogActionProps) => {\n const renderSlot = useRenderSlot(asChild, 'button')\n\n return (\n <BaseAlertDialog.Close\n data-spark-component=\"alert-dialog-action\"\n render={renderSlot}\n {...props}\n />\n )\n}\n\nAlertDialogAction.displayName = 'AlertDialog.Action'\n","import { useMergeRefs } from '@spark-ui/hooks/use-merge-refs'\nimport { useScrollOverflow } from '@spark-ui/hooks/use-scroll-overflow'\nimport { cx } from 'class-variance-authority'\nimport { type ReactElement, type ReactNode, Ref, useRef } from 'react'\n\nimport { useAlertDialog } from './AlertDialogContext'\n\nexport interface AlertDialogBodyProps {\n children: ReactNode\n className?: string\n tabIndex?: number\n ref?: Ref<HTMLDivElement>\n inset?: boolean\n}\n\nexport const AlertDialogBody = ({\n children,\n className,\n inset = false,\n ref: forwardedRef,\n ...rest\n}: AlertDialogBodyProps): ReactElement => {\n const scrollAreaRef = useRef<HTMLDivElement>(null)\n const ref = useMergeRefs(forwardedRef, scrollAreaRef)\n\n const { withFade } = useAlertDialog()\n const { overflow } = useScrollOverflow(scrollAreaRef)\n\n return (\n <div\n data-spark-component=\"alert-dialog-body\"\n ref={ref}\n className={cx(\n 'focus-visible:u-outline relative grow overflow-y-auto outline-hidden',\n 'transition-all duration-300',\n {\n ['px-xl py-lg']: !inset,\n },\n className\n )}\n style={{\n ...(withFade && {\n maskImage:\n 'linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1) 44px, rgba(0, 0, 0, 1) calc(100% - 44px), rgba(0, 0, 0, 0))',\n maskSize: `100% calc(100% + ${overflow.top ? '0px' : '44px'} + ${overflow.bottom ? '0px' : '44px'})`,\n maskPosition: `0 ${overflow.top ? '0px' : '-44px'}`,\n }),\n }}\n {...rest}\n >\n {children}\n </div>\n )\n}\n\nAlertDialogBody.displayName = 'AlertDialog.Body'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { useMergeRefs } from '@spark-ui/hooks/use-merge-refs'\nimport { ComponentProps, Ref } from 'react'\n\nimport { useAlertDialog } from './AlertDialogContext'\nimport { useRenderSlot } from './useRenderSlot'\n\nexport interface AlertDialogCancelProps\n extends Omit<ComponentProps<typeof BaseAlertDialog.Close>, 'render'> {\n /**\n * Change the default rendered element for the one passed as a child, merging their props and behavior.\n */\n asChild?: boolean\n ref?: Ref<HTMLButtonElement>\n}\n\nexport const AlertDialogCancel = ({\n asChild = false,\n ref: forwardedRef,\n ...props\n}: AlertDialogCancelProps) => {\n const { cancelRef } = useAlertDialog()\n const ref = useMergeRefs(forwardedRef, cancelRef)\n const renderSlot = useRenderSlot(asChild, 'button')\n\n return (\n <BaseAlertDialog.Close\n ref={ref}\n data-spark-component=\"alert-dialog-cancel\"\n render={renderSlot}\n {...props}\n />\n )\n}\n\nAlertDialogCancel.displayName = 'AlertDialog.Cancel'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nimport { dialogContentStyles } from '../dialog/DialogContent.styles'\nimport { useAlertDialog } from './AlertDialogContext'\n\nexport interface AlertDialogContentProps\n extends Omit<ComponentProps<typeof BaseAlertDialog.Popup>, 'render'> {\n ref?: Ref<HTMLDivElement>\n}\n\nexport const AlertDialogContent = ({\n className,\n ref,\n initialFocus,\n ...others\n}: AlertDialogContentProps) => {\n const { cancelRef } = useAlertDialog()\n\n // Default: focus the cancel button when dialog opens\n // Users can override by passing their own initialFocus prop (RefObject, false, true, or function)\n const handleInitialFocus = initialFocus !== undefined ? initialFocus : () => cancelRef.current\n\n return (\n <BaseAlertDialog.Popup\n ref={ref}\n data-spark-component=\"alert-dialog-content\"\n role=\"alertdialog\"\n className={state =>\n cx(\n dialogContentStyles({ size: 'md', isNarrow: true }),\n 'min-w-[min(288px,calc(100vw-2rem))]',\n // Base UI automatically adds data-[starting-style] and data-[ending-style] attributes\n // Transition with opacity and scale for smooth open/close animations\n 'transition-all duration-150',\n 'data-starting-style:scale-90 data-starting-style:opacity-0',\n 'data-ending-style:scale-90 data-ending-style:opacity-0',\n typeof className === 'function' ? className(state) : className\n )\n }\n initialFocus={handleInitialFocus}\n {...others}\n />\n )\n}\n\nAlertDialogContent.displayName = 'AlertDialog.Content'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface AlertDialogDescriptionProps\n extends Omit<ComponentProps<typeof BaseAlertDialog.Description>, 'render'> {\n ref?: Ref<HTMLParagraphElement>\n}\n\nexport const AlertDialogDescription = (props: AlertDialogDescriptionProps) => {\n return <BaseAlertDialog.Description data-spark-component=\"alert-dialog-description\" {...props} />\n}\n\nAlertDialogDescription.displayName = 'AlertDialog.Description'\n","import { cx } from 'class-variance-authority'\nimport { type ReactElement, type ReactNode, Ref } from 'react'\n\nexport interface AlertDialogFooterProps {\n children: ReactNode\n className?: string\n ref?: Ref<HTMLDivElement>\n}\n\nexport const AlertDialogFooter = ({\n children,\n className,\n ref,\n ...rest\n}: AlertDialogFooterProps): ReactElement => (\n <footer\n data-spark-component=\"alert-dialog-footer\"\n ref={ref}\n className={cx(className, ['px-xl', 'py-lg'])}\n {...rest}\n >\n {children}\n </footer>\n)\n\nAlertDialogFooter.displayName = 'AlertDialog.Footer'\n","import { cx } from 'class-variance-authority'\nimport { type ReactElement, type ReactNode, Ref } from 'react'\n\nexport interface AlertDialogHeaderProps {\n children: ReactNode\n className?: string\n ref?: Ref<HTMLDivElement>\n}\n\nexport const AlertDialogHeader = ({\n children,\n className,\n ref,\n ...rest\n}: AlertDialogHeaderProps): ReactElement => (\n <header\n data-spark-component=\"alert-dialog-header\"\n ref={ref}\n className={cx(className, ['px-xl', 'py-lg'])}\n {...rest}\n >\n {children}\n </header>\n)\n\nAlertDialogHeader.displayName = 'AlertDialog.Header'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface AlertDialogOverlayProps\n extends Omit<ComponentProps<typeof BaseAlertDialog.Backdrop>, 'render'> {\n ref?: Ref<HTMLDivElement>\n}\n\nexport const AlertDialogOverlay = ({ className, ...props }: AlertDialogOverlayProps) => {\n return (\n <BaseAlertDialog.Backdrop\n data-spark-component=\"alert-dialog-overlay\"\n className={state =>\n cx(\n 'z-overlay fixed top-0 left-0 h-screen w-screen',\n 'bg-overlay/dim-1',\n // Base UI automatically adds data-[starting-style] and data-[ending-style] attributes\n 'data-starting-style:animate-fade-in',\n 'data-ending-style:animate-fade-out',\n typeof className === 'function' ? className(state) : className\n )\n }\n {...props}\n />\n )\n}\n\nAlertDialogOverlay.displayName = 'AlertDialog.Overlay'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps } from 'react'\n\nexport type AlertDialogPortalProps = ComponentProps<typeof BaseAlertDialog.Portal>\n\nexport const AlertDialogPortal = ({ className, ...props }: AlertDialogPortalProps) => {\n return (\n <BaseAlertDialog.Portal\n data-spark-component=\"alert-dialog-portal\"\n className={cx(className, 'z-modal absolute')}\n {...props}\n />\n )\n}\n\nAlertDialogPortal.displayName = 'AlertDialog.Portal'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface AlertDialogTitleProps\n extends Omit<ComponentProps<typeof BaseAlertDialog.Title>, 'render'> {\n ref?: Ref<HTMLHeadingElement>\n}\n\nexport const AlertDialogTitle = ({ className, ...props }: AlertDialogTitleProps) => {\n return (\n <BaseAlertDialog.Title\n data-spark-component=\"alert-dialog-title\"\n className={cx('text-headline-1 text-on-surface', className)}\n {...props}\n />\n )\n}\n\nAlertDialogTitle.displayName = 'AlertDialog.Title'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { ComponentProps, Ref } from 'react'\n\nimport { useRenderSlot } from './useRenderSlot'\n\nexport interface AlertDialogTriggerProps\n extends Omit<ComponentProps<typeof BaseAlertDialog.Trigger>, 'render'> {\n /**\n * Change the default rendered element for the one passed as a child, merging their props and behavior.\n */\n asChild?: boolean\n ref?: Ref<HTMLButtonElement>\n}\n\nexport const AlertDialogTrigger = ({ asChild = false, ...props }: AlertDialogTriggerProps) => {\n const renderSlot = useRenderSlot(asChild, 'button')\n\n return (\n <BaseAlertDialog.Trigger\n data-spark-component=\"alert-dialog-trigger\"\n render={renderSlot}\n {...props}\n />\n )\n}\n\nAlertDialogTrigger.displayName = 'AlertDialog.Trigger'\n","import { AlertDialog as Root } from './AlertDialog'\nimport { AlertDialogAction } from './AlertDialogAction'\nimport { AlertDialogBody } from './AlertDialogBody'\nimport { AlertDialogCancel } from './AlertDialogCancel'\nimport { AlertDialogContent } from './AlertDialogContent'\nimport { AlertDialogDescription } from './AlertDialogDescription'\nimport { AlertDialogFooter } from './AlertDialogFooter'\nimport { AlertDialogHeader } from './AlertDialogHeader'\nimport { AlertDialogOverlay } from './AlertDialogOverlay'\nimport { AlertDialogPortal } from './AlertDialogPortal'\nimport { AlertDialogTitle } from './AlertDialogTitle'\nimport { AlertDialogTrigger } from './AlertDialogTrigger'\n\nexport * from './AlertDialog'\nexport { useAlertDialog } from './AlertDialogContext'\nexport { type AlertDialogActionProps } from './AlertDialogAction'\nexport { type AlertDialogBodyProps } from './AlertDialogBody'\nexport { type AlertDialogCancelProps } from './AlertDialogCancel'\nexport { type AlertDialogContentProps } from './AlertDialogContent'\nexport { type AlertDialogDescriptionProps } from './AlertDialogDescription'\nexport { type AlertDialogFooterProps } from './AlertDialogFooter'\nexport { type AlertDialogHeaderProps } from './AlertDialogHeader'\nexport { type AlertDialogOverlayProps } from './AlertDialogOverlay'\nexport { type AlertDialogPortalProps } from './AlertDialogPortal'\nexport { type AlertDialogTitleProps } from './AlertDialogTitle'\nexport { type AlertDialogTriggerProps } from './AlertDialogTrigger'\n\nexport const AlertDialog: typeof Root & {\n Action: typeof AlertDialogAction\n Body: typeof AlertDialogBody\n Cancel: typeof AlertDialogCancel\n Content: typeof AlertDialogContent\n Description: typeof AlertDialogDescription\n Footer: typeof AlertDialogFooter\n Header: typeof AlertDialogHeader\n Overlay: typeof AlertDialogOverlay\n Portal: typeof AlertDialogPortal\n Title: typeof AlertDialogTitle\n Trigger: typeof AlertDialogTrigger\n} = Object.assign(Root, {\n Action: AlertDialogAction,\n Body: AlertDialogBody,\n Cancel: AlertDialogCancel,\n Content: AlertDialogContent,\n Description: AlertDialogDescription,\n Footer: AlertDialogFooter,\n Header: AlertDialogHeader,\n Overlay: AlertDialogOverlay,\n Portal: AlertDialogPortal,\n Title: AlertDialogTitle,\n Trigger: AlertDialogTrigger,\n})\n\nAlertDialog.displayName = 'AlertDialog'\nAlertDialog.Action.displayName = 'AlertDialog.Action'\nAlertDialog.Body.displayName = 'AlertDialog.Body'\nAlertDialog.Cancel.displayName = 'AlertDialog.Cancel'\nAlertDialog.Content.displayName = 'AlertDialog.Content'\nAlertDialog.Description.displayName = 'AlertDialog.Description'\nAlertDialog.Footer.displayName = 'AlertDialog.Footer'\nAlertDialog.Header.displayName = 'AlertDialog.Header'\nAlertDialog.Overlay.displayName = 'AlertDialog.Overlay'\nAlertDialog.Portal.displayName = 'AlertDialog.Portal'\nAlertDialog.Title.displayName = 'AlertDialog.Title'\nAlertDialog.Trigger.displayName = 'AlertDialog.Trigger'\n"],"names":["AlertDialogContext","createContext","AlertDialogProvider","children","withFade","cancelRef","jsx","useAlertDialog","context","useContext","AlertDialog","onOpenChange","props","useRef","handleOpenChange","open","_eventDetails","BaseAlertDialog","useRenderSlot","asChild","defaultTag","Component","Slot","AlertDialogAction","renderSlot","AlertDialogBody","className","inset","forwardedRef","rest","scrollAreaRef","ref","useMergeRefs","overflow","useScrollOverflow","cx","AlertDialogCancel","AlertDialogContent","initialFocus","others","handleInitialFocus","state","dialogContentStyles","AlertDialogDescription","AlertDialogFooter","AlertDialogHeader","AlertDialogOverlay","AlertDialogPortal","AlertDialogTitle","AlertDialogTrigger","Root"],"mappings":"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"}
@@ -0,0 +1,34 @@
1
+ import { Meter as BaseMeter } from '@base-ui/react/meter';
2
+ import { ComponentProps, PropsWithChildren, Ref } from 'react';
3
+ import { MeterIndicatorStylesProps } from '../meter/MeterTrack.styles';
4
+ import { CircularMeterStylesProps } from './CircularMeter.styles';
5
+ export type CircularMeterSize = 'sm' | 'md' | 'lg' | 'xl';
6
+ export interface CircularMeterProps extends Omit<ComponentProps<typeof BaseMeter.Root>, 'render'>, Pick<MeterIndicatorStylesProps, 'intent'>, CircularMeterStylesProps {
7
+ /**
8
+ * Size of the circle.
9
+ *
10
+ * - `sm`: 24px diameter, 4px stroke width
11
+ * - `md`: 64px diameter, 8px stroke width
12
+ * - `lg`: 96px diameter, 8px stroke width
13
+ * - `xl`: 128px diameter, 8px stroke width
14
+ *
15
+ * Defaults to `md`.
16
+ */
17
+ size?: CircularMeterSize;
18
+ /**
19
+ * Change the default rendered element for the one passed as a child, merging their props and behavior.
20
+ */
21
+ asChild?: boolean;
22
+ ref?: Ref<HTMLDivElement>;
23
+ /**
24
+ * Orientation of the circular meter.
25
+ *
26
+ * - `vertical`: Elements are stacked vertically (default)
27
+ * - `horizontal`: Elements are arranged horizontally
28
+ */
29
+ orientation?: 'vertical' | 'horizontal';
30
+ }
31
+ export declare const CircularMeter: {
32
+ ({ className, value, max, min, size: sizeProp, intent, orientation, children, ref, ...others }: PropsWithChildren<CircularMeterProps>): import("react/jsx-runtime").JSX.Element;
33
+ displayName: string;
34
+ };
@@ -0,0 +1,5 @@
1
+ import { VariantProps } from 'class-variance-authority';
2
+ export declare const circularMeterStyles: (props?: ({
3
+ orientation?: "horizontal" | "vertical" | null | undefined;
4
+ } & import('class-variance-authority/types').ClassProp) | undefined) => string;
5
+ export type CircularMeterStylesProps = VariantProps<typeof circularMeterStyles>;
@@ -0,0 +1,6 @@
1
+ import { ComponentProps, PropsWithChildren } from 'react';
2
+ export type CircularMeterContentProps = ComponentProps<'div'> & PropsWithChildren;
3
+ export declare const CircularMeterContent: {
4
+ ({ className, children, ...others }: CircularMeterContentProps): import("react/jsx-runtime").JSX.Element;
5
+ displayName: string;
6
+ };
@@ -0,0 +1,36 @@
1
+ import { MeterIndicatorStylesProps } from '../meter/MeterTrack.styles';
2
+ import { CircularMeterSize } from './CircularMeter';
3
+ export interface CircularMeterContextValue {
4
+ value: number;
5
+ max: number;
6
+ min: number;
7
+ intent: MeterIndicatorStylesProps['intent'];
8
+ onLabelId: (id?: string) => void;
9
+ /**
10
+ * Size variant of the circular meter.
11
+ */
12
+ sizeProp: CircularMeterSize;
13
+ /**
14
+ * Orientation of the circular meter.
15
+ */
16
+ orientation: 'vertical' | 'horizontal';
17
+ /**
18
+ * Diameter of the SVG circle in pixels.
19
+ */
20
+ size: number;
21
+ /**
22
+ * Radius of the SVG circle in pixels.
23
+ */
24
+ radius: number;
25
+ /**
26
+ * Circumference of the SVG circle in pixels.
27
+ */
28
+ circumference: number;
29
+ /**
30
+ * Stroke width of the SVG circle in pixels.
31
+ */
32
+ strokeWidth: number;
33
+ }
34
+ export declare const CircularMeterContext: import('react').Context<CircularMeterContextValue | null>;
35
+ export declare const ID_PREFIX = ":circular-meter";
36
+ export declare const useCircularMeter: () => CircularMeterContextValue;
@@ -0,0 +1,7 @@
1
+ import { Meter as BaseMeter } from '@base-ui/react/meter';
2
+ import { ComponentProps } from 'react';
3
+ export type CircularMeterLabelProps = Omit<ComponentProps<typeof BaseMeter.Label>, 'render'>;
4
+ export declare const CircularMeterLabel: {
5
+ ({ id: idProp, children, className, ref: forwardedRef, ...others }: CircularMeterLabelProps): import("react/jsx-runtime").JSX.Element;
6
+ displayName: string;
7
+ };
@@ -0,0 +1,8 @@
1
+ import { Meter as BaseMeter } from '@base-ui/react/meter';
2
+ import { ComponentProps, PropsWithChildren } from 'react';
3
+ export declare const useCircularMeterTrack: () => boolean;
4
+ export type CircularMeterTrackProps = Omit<ComponentProps<typeof BaseMeter.Track>, 'render'> & PropsWithChildren;
5
+ export declare const CircularMeterTrack: {
6
+ ({ className, children, ...others }: CircularMeterTrackProps): import("react/jsx-runtime").JSX.Element;
7
+ displayName: string;
8
+ };
@@ -0,0 +1,7 @@
1
+ import { Meter as BaseMeter } from '@base-ui/react/meter';
2
+ import { ComponentProps, PropsWithChildren } from 'react';
3
+ export type CircularMeterValueProps = Omit<ComponentProps<typeof BaseMeter.Value>, 'render'>;
4
+ export declare const CircularMeterValue: {
5
+ ({ className, children, ...others }: PropsWithChildren<CircularMeterValueProps>): import("react/jsx-runtime").JSX.Element;
6
+ displayName: string;
7
+ };
@@ -0,0 +1,16 @@
1
+ import { CircularMeter as Root } from './CircularMeter';
2
+ import { CircularMeterContent } from './CircularMeterContent';
3
+ import { CircularMeterLabel } from './CircularMeterLabel';
4
+ import { CircularMeterTrack } from './CircularMeterTrack';
5
+ import { CircularMeterValue } from './CircularMeterValue';
6
+ export declare const CircularMeter: typeof Root & {
7
+ Content: typeof CircularMeterContent;
8
+ Label: typeof CircularMeterLabel;
9
+ Track: typeof CircularMeterTrack;
10
+ Value: typeof CircularMeterValue;
11
+ };
12
+ export { type CircularMeterProps } from './CircularMeter';
13
+ export { type CircularMeterContentProps } from './CircularMeterContent';
14
+ export { type CircularMeterLabelProps } from './CircularMeterLabel';
15
+ export { type CircularMeterTrackProps } from './CircularMeterTrack';
16
+ export { type CircularMeterValueProps } from './CircularMeterValue';
@@ -0,0 +1,16 @@
1
+ import { CircularMeter as Root } from './CircularMeter';
2
+ import { CircularMeterContent } from './CircularMeterContent';
3
+ import { CircularMeterLabel } from './CircularMeterLabel';
4
+ import { CircularMeterTrack } from './CircularMeterTrack';
5
+ import { CircularMeterValue } from './CircularMeterValue';
6
+ export declare const CircularMeter: typeof Root & {
7
+ Content: typeof CircularMeterContent;
8
+ Label: typeof CircularMeterLabel;
9
+ Track: typeof CircularMeterTrack;
10
+ Value: typeof CircularMeterValue;
11
+ };
12
+ export { type CircularMeterProps } from './CircularMeter';
13
+ export { type CircularMeterContentProps } from './CircularMeterContent';
14
+ export { type CircularMeterLabelProps } from './CircularMeterLabel';
15
+ export { type CircularMeterTrackProps } from './CircularMeterTrack';
16
+ export { type CircularMeterValueProps } from './CircularMeterValue';
@@ -0,0 +1,2 @@
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("react/jsx-runtime"),M=require("@base-ui/react/meter"),m=require("class-variance-authority"),a=require("react"),w=require("@spark-ui/hooks/use-merge-refs"),L=m.cva(["focus-visible:u-outline gap-md flex items-center"],{variants:{orientation:{vertical:["default:flex-col"],horizontal:["default:flex-row"]}},defaultVariants:{orientation:"vertical"}}),N=a.createContext(null),S=":circular-meter",h=()=>{const r=a.useContext(N);if(!r)throw new Error("useCircularMeter must be used within a CircularMeter provider");return r},E={sm:{diameter:24,strokeWidth:4},md:{diameter:64,strokeWidth:8},lg:{diameter:96,strokeWidth:8},xl:{diameter:128,strokeWidth:8}},I=({className:r,value:t,max:i=100,min:s=0,size:o="lg",intent:l="support",orientation:n="vertical",children:e,ref:d,...u})=>{const[f,p]=a.useState(),{diameter:x,strokeWidth:C}=E[o],y=x/2-C/2,b=2*Math.PI*y,g=a.useMemo(()=>({value:t??0,max:i,min:s,intent:l,onLabelId:p,sizeProp:o,orientation:n,size:x,radius:y,circumference:b,strokeWidth:C}),[i,s,t,l,p,o,n,x,y,b,C]);return c.jsx(N.Provider,{value:g,children:c.jsx(M.Meter.Root,{"data-spark-component":"circular-meter",ref:d,className:m.cx(L({orientation:n}),r),style:u.style,value:t,max:i,min:s,"aria-labelledby":f,...u,children:e})})};I.displayName="CircularMeter";const v=({className:r,children:t,...i})=>{const{orientation:s}=h();return c.jsx("div",{"data-spark-component":"circular-meter-content",className:m.cx("gap-xs flex default:flex-col",s==="vertical"&&"default:text-center",r),...i,children:t})};v.displayName="CircularMeter.Content";function q(r,t,i={}){const{threshold:s=.1,rootMargin:o}=i,l=a.useRef(!1),n=a.useRef(t);return a.useEffect(()=>{n.current=t},[t]),a.useEffect(()=>{const e=r.current;if(!e||l.current)return;const d=new IntersectionObserver(u=>{u.forEach(f=>{f.isIntersecting&&!l.current&&requestAnimationFrame(()=>{l.current||(l.current=!0,n.current(),d.disconnect())})})},{threshold:s,rootMargin:o});return d.observe(e),()=>{d.disconnect()}},[r,s,o]),l.current}const R=a.createContext(!1),V=()=>a.useContext(R),A=m.cva([],{variants:{intent:{main:["text-main/dim-4"],support:["text-support/dim-4"],success:["text-success/dim-4"],alert:["text-alert/dim-4"],danger:["text-error/dim-4"],info:["text-info/dim-4"]}}}),O=m.cva([],{variants:{intent:{main:["text-main"],support:["text-support"],success:["text-success"],alert:["text-alert"],danger:["text-error"],info:["text-info"]}}}),k=({className:r,children:t,...i})=>{const{value:s,max:o,min:l,intent:n,size:e,radius:d,circumference:u,strokeWidth:f}=h(),p=(s-l)/(o-l)*100,x=u-p/100*u,C=O({intent:n}),y=a.useRef(null),[b,g]=a.useState(!1);return q(y,()=>{g(!0)}),c.jsx(M.Meter.Track,{"data-spark-component":"circular-meter-track",className:r,...i,children:c.jsx(R.Provider,{value:!0,children:c.jsxs("svg",{ref:y,width:e,height:e,viewBox:`0 0 ${e} ${e}`,children:[c.jsxs("g",{style:{transform:"rotate(-90deg)",transformOrigin:"center"},children:[c.jsx("circle",{cx:e/2,cy:e/2,r:d,fill:"none",stroke:"currentColor",strokeWidth:f,className:A({intent:n})}),c.jsx("circle",{"data-spark-component":"circular-meter-indicator",cx:e/2,cy:e/2,r:d,fill:"none",stroke:"currentColor",strokeWidth:f,strokeLinecap:"round",className:m.cx(C,"ease-standard transition-[stroke-dashoffset] duration-700","motion-reduce:transition-none"),style:{strokeDasharray:u,strokeDashoffset:b?x:u}})]}),t&&c.jsx("foreignObject",{x:8,y:8,width:e-16,height:e-16,children:c.jsx("div",{className:"p-md flex h-full w-full flex-col items-center justify-center rounded-full text-center",style:{width:e-16,height:e-16},children:t})})]})})})};k.displayName="CircularMeter.Track";const W=m.cva([],{variants:{size:{sm:"",md:"",lg:"",xl:""},inside:{true:["default:text-on-surface/dim-1"],false:["default:text-on-surface"]}},compoundVariants:[{size:"sm",inside:!0,class:"default:text-small"},{size:"md",inside:!0,class:"default:text-small "},{size:"lg",inside:!0,class:"default:text-caption"},{size:"xl",inside:!0,class:"default:text-body-2"},{size:"sm",inside:!1,class:"default:text-body-1"},{size:"md",inside:!1,class:"default:text-body-1"},{size:"lg",inside:!1,class:"default:text-body-1"},{size:"xl",inside:!1,class:"default:text-body-1"}],defaultVariants:{size:"lg",inside:!0}}),z=({id:r,children:t,className:i,ref:s,...o})=>{const l=`${S}-label-${a.useId()}`,n=r||l,{onLabelId:e,sizeProp:d}=h(),u=V(),f=a.useCallback(x=>{e(x?n:void 0)},[n,e]),p=w.useMergeRefs(s,f);return c.jsx(M.Meter.Label,{"data-spark-component":"circular-meter-label",id:n,className:W({size:d,inside:u,className:i}),ref:p,...o,children:t})};z.displayName="CircularMeter.Label";const P=m.cva(["default:text-on-surface default:font-bold"],{variants:{size:{sm:"",md:"",lg:"",xl:""},inside:{true:[],false:[]}},compoundVariants:[{size:"sm",inside:!0,class:"default:text-body-2 default:font-bold"},{size:"md",inside:!0,class:"default:text-body-2 default:font-bold"},{size:"lg",inside:!0,class:"default:text-body-1 default:font-bold"},{size:"xl",inside:!0,class:"default:text-display-3"},{size:"sm",inside:!1,class:"default:text-body-1 default:font-bold"},{size:"md",inside:!1,class:"default:text-headline-2"},{size:"lg",inside:!1,class:"default:text-headline-2"},{size:"xl",inside:!1,class:"default:text-display-3"}],defaultVariants:{size:"lg",inside:!0}}),j=({className:r,children:t,...i})=>{const{sizeProp:s}=h(),o=V();return c.jsx(M.Meter.Value,{"data-spark-component":"circular-meter-value",className:P({size:s,inside:o,className:r}),...i,children:t})};j.displayName="CircularMeter.Value";const T=Object.assign(I,{Content:v,Label:z,Track:k,Value:j});T.displayName="CircularMeter";v.displayName="CircularMeter.Content";z.displayName="CircularMeter.Label";k.displayName="CircularMeter.Track";j.displayName="CircularMeter.Value";exports.CircularMeter=T;
2
+ //# sourceMappingURL=index.js.map