@ngrok/mantle 0.28.1 → 0.30.0

package/dist/accordion.d.ts

@@ -2,7 +2,7 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as react from 'react';
 import { ComponentPropsWithoutRef } from 'react';
 import * as AccordionPrimitive from '@radix-ui/react-accordion';
-import { a as IconProps } from './icon-DNrAWl1c.js';
+import { a as IconProps } from './icon-Cu-iYUjr.js';
 import './types-BuKAGhC-.js';
 
 declare const Accordion: react.ForwardRefExoticComponent<ComponentPropsWithoutRef<react.ForwardRefExoticComponent<(AccordionPrimitive.AccordionSingleProps | AccordionPrimitive.AccordionMultipleProps) & react.RefAttributes<HTMLDivElement>>> & react.RefAttributes<HTMLDivElement>>;

package/dist/accordion.js

@@ -1,2 +1,2 @@
-import{a as m}from"./chunk-QG5E42M3.js";import"./chunk-HDPLH5HC.js";import{a as r}from"./chunk-AZ56JGNY.js";import{CaretDown as g}from"@phosphor-icons/react/CaretDown";import*as o from"@radix-ui/react-accordion";import{forwardRef as c}from"react";import{jsx as n}from"react/jsx-runtime";var a=c(({className:e,...i},t)=>n(o.Root,{ref:t,className:r("w-full space-y-2.5",e),...i}));a.displayName="Accordion";var p=o.Item;p.displayName="AccordionItem";var s=c(({className:e,...i},t)=>n(o.Header,{ref:t,className:r("flex items-center gap-2",e),...i}));s.displayName="AccordionHeading";var f=c(({className:e,children:i,...t},d)=>n(o.Trigger,{ref:d,className:r("group flex items-center gap-1.5",e),...t,children:i}));f.displayName="AccordionTrigger";var l=({className:e,...i})=>n(m,{...i,svg:n(g,{weight:"fill"}),className:r("group-data-state-open:rotate-0 -rotate-90",e)}),A=c(({className:e,children:i,...t},d)=>n(o.Content,{ref:d,className:r("data-state-closed:animate-accordion-up data-state-open:animate-accordion-down overflow-hidden pt-4",e),...t,children:i}));A.displayName="AccordionContent";export{a as Accordion,A as AccordionContent,s as AccordionHeading,p as AccordionItem,f as AccordionTrigger,l as AccordionTriggerIcon};
+import{a as m}from"./chunk-XQVVOOLT.js";import"./chunk-HDPLH5HC.js";import{a as r}from"./chunk-AZ56JGNY.js";import{CaretDownIcon as g}from"@phosphor-icons/react/CaretDown";import*as o from"@radix-ui/react-accordion";import{forwardRef as c}from"react";import{jsx as n}from"react/jsx-runtime";var a=c(({className:e,...i},t)=>n(o.Root,{ref:t,className:r("w-full space-y-2.5",e),...i}));a.displayName="Accordion";var p=o.Item;p.displayName="AccordionItem";var s=c(({className:e,...i},t)=>n(o.Header,{ref:t,className:r("flex items-center gap-2",e),...i}));s.displayName="AccordionHeading";var f=c(({className:e,children:i,...t},d)=>n(o.Trigger,{ref:d,className:r("group flex items-center gap-1.5",e),...t,children:i}));f.displayName="AccordionTrigger";var l=({className:e,...i})=>n(m,{...i,svg:n(g,{weight:"fill"}),className:r("group-data-state-open:rotate-0 -rotate-90",e)}),A=c(({className:e,children:i,...t},d)=>n(o.Content,{ref:d,className:r("data-state-closed:animate-accordion-up data-state-open:animate-accordion-down overflow-hidden pt-4",e),...t,children:i}));A.displayName="AccordionContent";export{a as Accordion,A as AccordionContent,s as AccordionHeading,p as AccordionItem,f as AccordionTrigger,l as AccordionTriggerIcon};
 //# sourceMappingURL=accordion.js.map

package/dist/accordion.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/accordion/accordion.tsx"],"sourcesContent":["\"use client\";\n\nimport { CaretDown as CaretDownIcon } from \"@phosphor-icons/react/CaretDown\";\nimport * as AccordionPrimitive from \"@radix-ui/react-accordion\";\nimport {\n\ttype ComponentPropsWithoutRef,\n\ttype ComponentRef,\n\tforwardRef,\n} from \"react\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { Icon, type IconProps } from \"../icon/icon.js\";\n\nconst Accordion = forwardRef<\n\tComponentRef<\"div\">,\n\tComponentPropsWithoutRef<typeof AccordionPrimitive.Root>\n>(({ className, ...props }, ref) => (\n\t<AccordionPrimitive.Root\n\t\tref={ref}\n\t\tclassName={cx(\"w-full space-y-2.5\", className)}\n\t\t{...props}\n\t/>\n));\nAccordion.displayName = \"Accordion\";\n\nconst AccordionItem = AccordionPrimitive.Item;\nAccordionItem.displayName = \"AccordionItem\";\n\nconst AccordionHeading = forwardRef<\n\tComponentRef<\"div\">,\n\tComponentPropsWithoutRef<typeof AccordionPrimitive.Header>\n>(({ className, ...props }, ref) => (\n\t<AccordionPrimitive.Header\n\t\tref={ref}\n\t\tclassName={cx(\"flex items-center gap-2\", className)}\n\t\t{...props}\n\t/>\n));\nAccordionHeading.displayName = \"AccordionHeading\";\n\nconst AccordionTrigger = forwardRef<\n\tComponentRef<\"button\">,\n\tComponentPropsWithoutRef<typeof AccordionPrimitive.Trigger>\n>(({ className, children, ...props }, ref) => (\n\t<AccordionPrimitive.Trigger\n\t\tref={ref}\n\t\tclassName={cx(\"group flex items-center gap-1.5\", className)}\n\t\t{...props}\n\t>\n\t\t{children}\n\t</AccordionPrimitive.Trigger>\n));\nAccordionTrigger.displayName = \"AccordionTrigger\";\n\nconst AccordionTriggerIcon = ({\n\tclassName,\n\t...props\n}: Omit<IconProps, \"svg\">) => (\n\t<Icon\n\t\t{...props}\n\t\tsvg={<CaretDownIcon weight=\"fill\" />}\n\t\tclassName={cx(\"group-data-state-open:rotate-0 -rotate-90\", className)}\n\t/>\n);\n\nconst AccordionContent = forwardRef<\n\tComponentRef<\"div\">,\n\tComponentPropsWithoutRef<typeof AccordionPrimitive.Content>\n>(({ className, children, ...props }, ref) => (\n\t<AccordionPrimitive.Content\n\t\tref={ref}\n\t\tclassName={cx(\n\t\t\t\"data-state-closed:animate-accordion-up data-state-open:animate-accordion-down overflow-hidden pt-4\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t>\n\t\t{children}\n\t</AccordionPrimitive.Content>\n));\nAccordionContent.displayName = \"AccordionContent\";\n\nexport {\n\t//,\n\tAccordion,\n\tAccordionContent,\n\tAccordionHeading,\n\tAccordionItem,\n\tAccordionTrigger,\n\tAccordionTriggerIcon,\n};\n"],"mappings":"4GAEA,OAAS,aAAaA,MAAqB,kCAC3C,UAAYC,MAAwB,4BACpC,OAGC,cAAAC,MACM,QAQN,cAAAC,MAAA,oBAJD,IAAMC,EAAYC,EAGhB,CAAC,CAAE,UAAAC,EAAW,GAAGC,CAAM,EAAGC,IAC3BL,EAAoB,OAAnB,CACA,IAAKK,EACL,UAAWC,EAAG,qBAAsBH,CAAS,EAC5C,GAAGC,EACL,CACA,EACDH,EAAU,YAAc,YAExB,IAAMM,EAAmC,OACzCA,EAAc,YAAc,gBAE5B,IAAMC,EAAmBN,EAGvB,CAAC,CAAE,UAAAC,EAAW,GAAGC,CAAM,EAAGC,IAC3BL,EAAoB,SAAnB,CACA,IAAKK,EACL,UAAWC,EAAG,0BAA2BH,CAAS,EACjD,GAAGC,EACL,CACA,EACDI,EAAiB,YAAc,mBAE/B,IAAMC,EAAmBP,EAGvB,CAAC,CAAE,UAAAC,EAAW,SAAAO,EAAU,GAAGN,CAAM,EAAGC,IACrCL,EAAoB,UAAnB,CACA,IAAKK,EACL,UAAWC,EAAG,kCAAmCH,CAAS,EACzD,GAAGC,EAEH,SAAAM,EACF,CACA,EACDD,EAAiB,YAAc,mBAE/B,IAAME,EAAuB,CAAC,CAC7B,UAAAR,EACA,GAAGC,CACJ,IACCJ,EAACY,EAAA,CACC,GAAGR,EACJ,IAAKJ,EAACa,EAAA,CAAc,OAAO,OAAO,EAClC,UAAWP,EAAG,4CAA6CH,CAAS,EACrE,EAGKW,EAAmBZ,EAGvB,CAAC,CAAE,UAAAC,EAAW,SAAAO,EAAU,GAAGN,CAAM,EAAGC,IACrCL,EAAoB,UAAnB,CACA,IAAKK,EACL,UAAWC,EACV,qGACAH,CACD,EACC,GAAGC,EAEH,SAAAM,EACF,CACA,EACDI,EAAiB,YAAc","names":["CaretDownIcon","AccordionPrimitive","forwardRef","jsx","Accordion","forwardRef","className","props","ref","cx","AccordionItem","AccordionHeading","AccordionTrigger","children","AccordionTriggerIcon","Icon","CaretDownIcon","AccordionContent"]}
+{"version":3,"sources":["../src/components/accordion/accordion.tsx"],"sourcesContent":["\"use client\";\n\nimport { CaretDownIcon } from \"@phosphor-icons/react/CaretDown\";\nimport * as AccordionPrimitive from \"@radix-ui/react-accordion\";\nimport {\n\ttype ComponentPropsWithoutRef,\n\ttype ComponentRef,\n\tforwardRef,\n} from \"react\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { Icon, type IconProps } from \"../icon/icon.js\";\n\nconst Accordion = forwardRef<\n\tComponentRef<\"div\">,\n\tComponentPropsWithoutRef<typeof AccordionPrimitive.Root>\n>(({ className, ...props }, ref) => (\n\t<AccordionPrimitive.Root\n\t\tref={ref}\n\t\tclassName={cx(\"w-full space-y-2.5\", className)}\n\t\t{...props}\n\t/>\n));\nAccordion.displayName = \"Accordion\";\n\nconst AccordionItem = AccordionPrimitive.Item;\nAccordionItem.displayName = \"AccordionItem\";\n\nconst AccordionHeading = forwardRef<\n\tComponentRef<\"div\">,\n\tComponentPropsWithoutRef<typeof AccordionPrimitive.Header>\n>(({ className, ...props }, ref) => (\n\t<AccordionPrimitive.Header\n\t\tref={ref}\n\t\tclassName={cx(\"flex items-center gap-2\", className)}\n\t\t{...props}\n\t/>\n));\nAccordionHeading.displayName = \"AccordionHeading\";\n\nconst AccordionTrigger = forwardRef<\n\tComponentRef<\"button\">,\n\tComponentPropsWithoutRef<typeof AccordionPrimitive.Trigger>\n>(({ className, children, ...props }, ref) => (\n\t<AccordionPrimitive.Trigger\n\t\tref={ref}\n\t\tclassName={cx(\"group flex items-center gap-1.5\", className)}\n\t\t{...props}\n\t>\n\t\t{children}\n\t</AccordionPrimitive.Trigger>\n));\nAccordionTrigger.displayName = \"AccordionTrigger\";\n\nconst AccordionTriggerIcon = ({\n\tclassName,\n\t...props\n}: Omit<IconProps, \"svg\">) => (\n\t<Icon\n\t\t{...props}\n\t\tsvg={<CaretDownIcon weight=\"fill\" />}\n\t\tclassName={cx(\"group-data-state-open:rotate-0 -rotate-90\", className)}\n\t/>\n);\n\nconst AccordionContent = forwardRef<\n\tComponentRef<\"div\">,\n\tComponentPropsWithoutRef<typeof AccordionPrimitive.Content>\n>(({ className, children, ...props }, ref) => (\n\t<AccordionPrimitive.Content\n\t\tref={ref}\n\t\tclassName={cx(\n\t\t\t\"data-state-closed:animate-accordion-up data-state-open:animate-accordion-down overflow-hidden pt-4\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t>\n\t\t{children}\n\t</AccordionPrimitive.Content>\n));\nAccordionContent.displayName = \"AccordionContent\";\n\nexport {\n\t//,\n\tAccordion,\n\tAccordionContent,\n\tAccordionHeading,\n\tAccordionItem,\n\tAccordionTrigger,\n\tAccordionTriggerIcon,\n};\n"],"mappings":"4GAEA,OAAS,iBAAAA,MAAqB,kCAC9B,UAAYC,MAAwB,4BACpC,OAGC,cAAAC,MACM,QAQN,cAAAC,MAAA,oBAJD,IAAMC,EAAYC,EAGhB,CAAC,CAAE,UAAAC,EAAW,GAAGC,CAAM,EAAGC,IAC3BL,EAAoB,OAAnB,CACA,IAAKK,EACL,UAAWC,EAAG,qBAAsBH,CAAS,EAC5C,GAAGC,EACL,CACA,EACDH,EAAU,YAAc,YAExB,IAAMM,EAAmC,OACzCA,EAAc,YAAc,gBAE5B,IAAMC,EAAmBN,EAGvB,CAAC,CAAE,UAAAC,EAAW,GAAGC,CAAM,EAAGC,IAC3BL,EAAoB,SAAnB,CACA,IAAKK,EACL,UAAWC,EAAG,0BAA2BH,CAAS,EACjD,GAAGC,EACL,CACA,EACDI,EAAiB,YAAc,mBAE/B,IAAMC,EAAmBP,EAGvB,CAAC,CAAE,UAAAC,EAAW,SAAAO,EAAU,GAAGN,CAAM,EAAGC,IACrCL,EAAoB,UAAnB,CACA,IAAKK,EACL,UAAWC,EAAG,kCAAmCH,CAAS,EACzD,GAAGC,EAEH,SAAAM,EACF,CACA,EACDD,EAAiB,YAAc,mBAE/B,IAAME,EAAuB,CAAC,CAC7B,UAAAR,EACA,GAAGC,CACJ,IACCJ,EAACY,EAAA,CACC,GAAGR,EACJ,IAAKJ,EAACa,EAAA,CAAc,OAAO,OAAO,EAClC,UAAWP,EAAG,4CAA6CH,CAAS,EACrE,EAGKW,EAAmBZ,EAGvB,CAAC,CAAE,UAAAC,EAAW,SAAAO,EAAU,GAAGN,CAAM,EAAGC,IACrCL,EAAoB,UAAnB,CACA,IAAKK,EACL,UAAWC,EACV,qGACAH,CACD,EACC,GAAGC,EAEH,SAAAM,EACF,CACA,EACDI,EAAiB,YAAc","names":["CaretDownIcon","AccordionPrimitive","forwardRef","jsx","Accordion","forwardRef","className","props","ref","cx","AccordionItem","AccordionHeading","AccordionTrigger","children","AccordionTriggerIcon","Icon","CaretDownIcon","AccordionContent"]}

package/dist/alert-dialog.js

@@ -1,2 +1,2 @@
-import{a as A,b as D,c as y,d as g,e as u,f as C,g as P,h as v}from"./chunk-PBARMKNJ.js";import{g as c}from"./chunk-BF3GF5YV.js";import"./chunk-XN5RN6JW.js";import"./chunk-D3XF6J5A.js";import{b as m}from"./chunk-WFZS67BK.js";import"./chunk-4LSFAAZW.js";import"./chunk-3C5O3AQA.js";import"./chunk-72TJUKMV.js";import"./chunk-QG5E42M3.js";import{a as f}from"./chunk-HDPLH5HC.js";import{a}from"./chunk-AZ56JGNY.js";import{Info as j}from"@phosphor-icons/react/Info";import{Warning as F}from"@phosphor-icons/react/Warning";import{Slot as d}from"@radix-ui/react-slot";import{createContext as H,forwardRef as n,useContext as V,useMemo as k}from"react";import M from"tiny-invariant";import{jsx as i,jsxs as G}from"react/jsx-runtime";var x=H(null);function N(){let t=V(x);return M(t,"AlertDialog child component used outside of AlertDialog parent!"),t}function R({priority:t,...e}){let o=k(()=>({priority:t}),[t]);return i(x.Provider,{value:o,children:i(A,{...e})})}R.displayName="AlertDialog";var $=D,q=y,h=n(({className:t,...e},o)=>i(u,{className:a("data-state-open:animate-in data-state-closed:animate-out data-state-closed:fade-out-0 data-state-open:fade-in-0 bg-overlay fixed inset-0 z-50 backdrop-blur-sm",t),...e,ref:o}));h.displayName="AlertDialogOverlay";var b=n(({className:t,onInteractOutside:e,onPointerDownOutside:o,preferredWidth:l="max-w-md",...r},p)=>G(q,{children:[i(h,{}),i("div",{className:"fixed inset-4 z-50 flex items-center justify-center",children:i(C,{ref:p,className:a("flex w-full flex-1 flex-col items-center gap-4 sm:flex-row sm:items-start","outline-none focus-within:outline-none","p-6","border-dialog bg-dialog rounded-xl border shadow-lg transition-transform duration-200","data-state-closed:animate-out data-state-closed:fade-out-0 data-state-closed:zoom-out-95 data-state-open:animate-in data-state-open:fade-in-0 data-state-open:zoom-in-95",l,t),onInteractOutside:s=>{c(s),e?.(s)},onPointerDownOutside:s=>{c(s),o?.(s)},...r})})]}));b.displayName="AlertDialogContent";var I=n(({asChild:t=!1,className:e,...o},l)=>i(t?d:"div",{className:a("flex-1 space-y-4",e),ref:l,...o}));I.displayName="AlertDialogBody";var W=n(({asChild:t=!1,className:e,...o},l)=>i(t?d:"div",{className:a("flex flex-col space-y-2 text-center sm:text-start",e),...o}));W.displayName="AlertDialogHeader";var O=n(({asChild:t=!1,className:e,...o},l)=>i(t?d:"div",{className:a("flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",e),...o}));O.displayName="AlertDialogFooter";var w=n(({className:t,...e},o)=>i(P,{ref:o,className:a("text-strong text-center text-lg font-medium sm:text-start",t),...e}));w.displayName="AlertDialogTitle";var B=n(({className:t,...e},o)=>i(v,{ref:o,className:a("text-body text-center text-sm font-normal sm:text-start",t),...e}));B.displayName="AlertDialogDescription";var T=n(({appearance:t="filled",...e},o)=>{let l=N(),r="default";return l.priority==="danger"&&(r="danger"),i(m,{appearance:t,priority:r,ref:o,...e})});T.displayName="AlertDialogAction";var z=n(({appearance:t="outlined",className:e,priority:o="neutral",...l},r)=>i(g,{asChild:!0,children:i(m,{appearance:t,className:a("mt-2 sm:mt-0",e),priority:o,ref:r,...l})}));z.displayName="AlertDialogCancel";var S=n(({className:t,svg:e,...o},l)=>{let r=N(),p=r.priority==="danger"?"text-danger-600":"text-accent-600",s=r.priority==="danger"?i(F,{}):i(j,{});return i(f,{ref:l,className:a("size-12 sm:size-7",p,t),svg:e??s,...o})});S.displayName="AlertDialogIcon";var E=g;export{R as AlertDialog,T as AlertDialogAction,I as AlertDialogBody,z as AlertDialogCancel,E as AlertDialogClose,b as AlertDialogContent,B as AlertDialogDescription,O as AlertDialogFooter,W as AlertDialogHeader,S as AlertDialogIcon,w as AlertDialogTitle,$ as AlertDialogTrigger};
+import{a as A,b as D,c as y,d as g,e as u,f as C,g as P,h as v}from"./chunk-PBARMKNJ.js";import{g as c}from"./chunk-3DXMGSDU.js";import"./chunk-XN5RN6JW.js";import"./chunk-D3XF6J5A.js";import{b as m}from"./chunk-VTCWSFFJ.js";import"./chunk-4LSFAAZW.js";import"./chunk-3C5O3AQA.js";import"./chunk-72TJUKMV.js";import"./chunk-XQVVOOLT.js";import{a as f}from"./chunk-HDPLH5HC.js";import{a}from"./chunk-AZ56JGNY.js";import{InfoIcon as j}from"@phosphor-icons/react/Info";import{WarningIcon as F}from"@phosphor-icons/react/Warning";import{Slot as d}from"@radix-ui/react-slot";import{createContext as H,forwardRef as n,useContext as V,useMemo as k}from"react";import M from"tiny-invariant";import{jsx as i,jsxs as G}from"react/jsx-runtime";var x=H(null);function N(){let t=V(x);return M(t,"AlertDialog child component used outside of AlertDialog parent!"),t}function R({priority:t,...e}){let o=k(()=>({priority:t}),[t]);return i(x.Provider,{value:o,children:i(A,{...e})})}R.displayName="AlertDialog";var $=D,q=y,h=n(({className:t,...e},o)=>i(u,{className:a("data-state-open:animate-in data-state-closed:animate-out data-state-closed:fade-out-0 data-state-open:fade-in-0 bg-overlay fixed inset-0 z-50 backdrop-blur-sm",t),...e,ref:o}));h.displayName="AlertDialogOverlay";var b=n(({className:t,onInteractOutside:e,onPointerDownOutside:o,preferredWidth:l="max-w-md",...r},p)=>G(q,{children:[i(h,{}),i("div",{className:"fixed inset-4 z-50 flex items-center justify-center",children:i(C,{ref:p,className:a("flex w-full flex-1 flex-col items-center gap-4 sm:flex-row sm:items-start","outline-none focus-within:outline-none","p-6","border-dialog bg-dialog rounded-xl border shadow-lg transition-transform duration-200","data-state-closed:animate-out data-state-closed:fade-out-0 data-state-closed:zoom-out-95 data-state-open:animate-in data-state-open:fade-in-0 data-state-open:zoom-in-95",l,t),onInteractOutside:s=>{c(s),e?.(s)},onPointerDownOutside:s=>{c(s),o?.(s)},...r})})]}));b.displayName="AlertDialogContent";var I=n(({asChild:t=!1,className:e,...o},l)=>i(t?d:"div",{className:a("flex-1 space-y-4",e),ref:l,...o}));I.displayName="AlertDialogBody";var W=n(({asChild:t=!1,className:e,...o},l)=>i(t?d:"div",{className:a("flex flex-col space-y-2 text-center sm:text-start",e),...o}));W.displayName="AlertDialogHeader";var O=n(({asChild:t=!1,className:e,...o},l)=>i(t?d:"div",{className:a("flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",e),...o}));O.displayName="AlertDialogFooter";var w=n(({className:t,...e},o)=>i(P,{ref:o,className:a("text-strong text-center text-lg font-medium sm:text-start",t),...e}));w.displayName="AlertDialogTitle";var B=n(({className:t,...e},o)=>i(v,{ref:o,className:a("text-body text-center text-sm font-normal sm:text-start",t),...e}));B.displayName="AlertDialogDescription";var T=n(({appearance:t="filled",...e},o)=>{let l=N(),r="default";return l.priority==="danger"&&(r="danger"),i(m,{appearance:t,priority:r,ref:o,...e})});T.displayName="AlertDialogAction";var z=n(({appearance:t="outlined",className:e,priority:o="neutral",...l},r)=>i(g,{asChild:!0,children:i(m,{appearance:t,className:a("mt-2 sm:mt-0",e),priority:o,ref:r,...l})}));z.displayName="AlertDialogCancel";var S=n(({className:t,svg:e,...o},l)=>{let r=N(),p=r.priority==="danger"?"text-danger-600":"text-accent-600",s=r.priority==="danger"?i(F,{}):i(j,{});return i(f,{ref:l,className:a("size-12 sm:size-7",p,t),svg:e??s,...o})});S.displayName="AlertDialogIcon";var E=g;export{R as AlertDialog,T as AlertDialogAction,I as AlertDialogBody,z as AlertDialogCancel,E as AlertDialogClose,b as AlertDialogContent,B as AlertDialogDescription,O as AlertDialogFooter,W as AlertDialogHeader,S as AlertDialogIcon,w as AlertDialogTitle,$ as AlertDialogTrigger};
 //# sourceMappingURL=alert-dialog.js.map

package/dist/alert-dialog.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/alert-dialog/alert-dialog.tsx"],"sourcesContent":["\"use client\";\n\nimport { Info as InfoIcon } from \"@phosphor-icons/react/Info\";\nimport { Warning as WarningIcon } from \"@phosphor-icons/react/Warning\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport {\n\ttype ComponentProps,\n\ttype ComponentPropsWithoutRef,\n\ttype ComponentRef,\n\ttype ReactNode,\n\tcreateContext,\n\tforwardRef,\n\tuseContext,\n\tuseMemo,\n} from \"react\";\nimport invariant from \"tiny-invariant\";\nimport type { WithAsChild } from \"../../types/as-child.js\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport {\n\tButton,\n\ttype ButtonPriority,\n\ttype ButtonProps,\n} from \"../button/button.js\";\nimport * as AlertDialogPrimitive from \"../dialog/primitive.js\";\nimport { SvgOnly } from \"../icon/svg-only.js\";\nimport type { SvgAttributes } from \"../icon/types.js\";\nimport { preventCloseOnPromptInteraction } from \"../toast/toast.js\";\n\nconst priorities = [\"info\", \"danger\"] as const;\ntype Priority = (typeof priorities)[number];\n\ntype AlertDialogContextValue = {\n\tpriority: Priority;\n};\n\nconst AlertDialogContext = createContext<AlertDialogContextValue | null>(null);\n\nfunction useAlertDialogContext() {\n\tconst context = useContext(AlertDialogContext);\n\tinvariant(\n\t\tcontext,\n\t\t\"AlertDialog child component used outside of AlertDialog parent!\",\n\t);\n\treturn context;\n}\n\ntype AlertDialogProps = ComponentProps<typeof AlertDialogPrimitive.Root> & {\n\t/**\n\t * Indicates the importance or impact level of the AlertDialog, affecting its\n\t * color and styling to communicate its purpose to the user.\n\t */\n\tpriority: Priority;\n};\n\n/**\n * A modal dialog that interrupts the user with important content and expects a\n * response.\n * The root stateful component for the Alert Dialog.\n *\n * @see https://mantle.ngrok.com/components/alert-dialog#api-alert-dialog\n *\n * @example\n * ```tsx\n * <AlertDialog priority=\"danger\">\n *   <AlertDialogTrigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Show Danger Alert Dialog\n *     </Button>\n *   </AlertDialogTrigger>\n *   <AlertDialogContent>\n *     <AlertDialogIcon />\n *     <AlertDialogBody>\n *       <AlertDialogHeader>\n *         <AlertDialogTitle>\n *           Are you absolutely sure?\n *         </AlertDialogTitle>\n *         <AlertDialogDescription>\n *           Proident quis nisi tempor irure sunt ut minim occaecat mollit sunt.\n *         </AlertDialogDescription>\n *       </AlertDialogHeader>\n *       <AlertDialogFooter>\n *         <AlertDialogCancel type=\"button\">Cancel</AlertDialogCancel>\n *         <AlertDialogAction type=\"button\">\n *           Continue\n *         </AlertDialogAction>\n *       </AlertDialogFooter>\n *   \t</AlertDialogBody>\n *   </AlertDialogContent>\n * </AlertDialog>\n * ```\n */\nfunction AlertDialog({ priority, ...props }: AlertDialogProps) {\n\tconst context: AlertDialogContextValue = useMemo(\n\t\t() => ({ priority }),\n\t\t[priority],\n\t);\n\n\treturn (\n\t\t<AlertDialogContext.Provider value={context}>\n\t\t\t<AlertDialogPrimitive.Root {...props} />\n\t\t</AlertDialogContext.Provider>\n\t);\n}\nAlertDialog.displayName = \"AlertDialog\";\n\n/**\n * A button that opens the Alert Dialog.\n *\n * @see https://mantle.ngrok.com/components/alert-dialog#api-alert-dialog-trigger\n *\n * @example\n * ```tsx\n * <AlertDialog priority=\"danger\">\n *   <AlertDialogTrigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Show Danger Alert Dialog\n *     </Button>\n *   </AlertDialogTrigger>\n *   <AlertDialogContent>\n *     <AlertDialogIcon />\n *     <AlertDialogBody>\n *       <AlertDialogHeader>\n *         <AlertDialogTitle>\n *           Are you absolutely sure?\n *         </AlertDialogTitle>\n *         <AlertDialogDescription>\n *           Proident quis nisi tempor irure sunt ut minim occaecat mollit sunt.\n *         </AlertDialogDescription>\n *       </AlertDialogHeader>\n *       <AlertDialogFooter>\n *         <AlertDialogCancel type=\"button\">Cancel</AlertDialogCancel>\n *         <AlertDialogAction type=\"button\">\n *           Continue\n *         </AlertDialogAction>\n *       </AlertDialogFooter>\n *   \t</AlertDialogBody>\n *   </AlertDialogContent>\n * </AlertDialog>\n * ```\n */\nconst AlertDialogTrigger = AlertDialogPrimitive.Trigger;\n\n/**\n * The portal for the Alert Dialog.\n *\n * @private\n */\nconst AlertDialogPortal = AlertDialogPrimitive.Portal;\n\n/**\n * A layer that covers the inert portion of the view when the dialog is open.\n *\n * @private\n */\nconst AlertDialogOverlay = forwardRef<\n\tComponentRef<typeof AlertDialogPrimitive.Overlay>,\n\tComponentPropsWithoutRef<typeof AlertDialogPrimitive.Overlay>\n>(({ className, ...props }, ref) => (\n\t<AlertDialogPrimitive.Overlay\n\t\tclassName={cx(\n\t\t\t\"data-state-open:animate-in data-state-closed:animate-out data-state-closed:fade-out-0 data-state-open:fade-in-0 bg-overlay fixed inset-0 z-50 backdrop-blur-sm\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t\tref={ref}\n\t/>\n));\nAlertDialogOverlay.displayName = \"AlertDialogOverlay\";\n\ntype AlertDialogContentProps = ComponentPropsWithoutRef<\n\ttypeof AlertDialogPrimitive.Content\n> & {\n\t/**\n\t * The preferred width of the `AlertDialogContent` as a tailwind `max-w-` class.\n\t *\n\t * By default, a `AlertDialog`'s content width is responsive with a default\n\t * preferred width: the maximum width of the `AlertDialogContent`\n\t *\n\t * @default `max-w-md`\n\t */\n\tpreferredWidth?: `max-w-${string}`;\n};\n\n/**\n * The popover alert dialog container.\n *\n * Renders on top of the overlay and is centered in the viewport.\n *\n * @see https://mantle.ngrok.com/components/alert-dialog#api-alert-dialog-content\n *\n * @example\n * ```tsx\n * <AlertDialog priority=\"danger\">\n *   <AlertDialogTrigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Show Danger Alert Dialog\n *     </Button>\n *   </AlertDialogTrigger>\n *   <AlertDialogContent>\n *     <AlertDialogIcon />\n *     <AlertDialogBody>\n *       <AlertDialogHeader>\n *         <AlertDialogTitle>\n *           Are you absolutely sure?\n *         </AlertDialogTitle>\n *         <AlertDialogDescription>\n *           Proident quis nisi tempor irure sunt ut minim occaecat mollit sunt.\n *         </AlertDialogDescription>\n *       </AlertDialogHeader>\n *       <AlertDialogFooter>\n *         <AlertDialogCancel type=\"button\">Cancel</AlertDialogCancel>\n *         <AlertDialogAction type=\"button\">\n *           Continue\n *         </AlertDialogAction>\n *       </AlertDialogFooter>\n *   \t</AlertDialogBody>\n *   </AlertDialogContent>\n * </AlertDialog>\n * ```\n */\nconst AlertDialogContent = forwardRef<\n\tComponentRef<typeof AlertDialogPrimitive.Content>,\n\tAlertDialogContentProps\n>(\n\t(\n\t\t{\n\t\t\tclassName,\n\t\t\tonInteractOutside,\n\t\t\tonPointerDownOutside,\n\t\t\tpreferredWidth = \"max-w-md\",\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => (\n\t\t<AlertDialogPortal>\n\t\t\t<AlertDialogOverlay />\n\t\t\t<div className=\"fixed inset-4 z-50 flex items-center justify-center\">\n\t\t\t\t<AlertDialogPrimitive.Content\n\t\t\t\t\tref={ref}\n\t\t\t\t\tclassName={cx(\n\t\t\t\t\t\t\"flex w-full flex-1 flex-col items-center gap-4 sm:flex-row sm:items-start\",\n\t\t\t\t\t\t\"outline-none focus-within:outline-none\",\n\t\t\t\t\t\t\"p-6\",\n\t\t\t\t\t\t\"border-dialog bg-dialog rounded-xl border shadow-lg transition-transform duration-200\",\n\t\t\t\t\t\t\"data-state-closed:animate-out data-state-closed:fade-out-0 data-state-closed:zoom-out-95 data-state-open:animate-in data-state-open:fade-in-0 data-state-open:zoom-in-95\",\n\t\t\t\t\t\tpreferredWidth,\n\t\t\t\t\t\tclassName,\n\t\t\t\t\t)}\n\t\t\t\t\tonInteractOutside={(event) => {\n\t\t\t\t\t\tpreventCloseOnPromptInteraction(event);\n\t\t\t\t\t\tonInteractOutside?.(event);\n\t\t\t\t\t}}\n\t\t\t\t\tonPointerDownOutside={(event) => {\n\t\t\t\t\t\tpreventCloseOnPromptInteraction(event);\n\t\t\t\t\t\tonPointerDownOutside?.(event);\n\t\t\t\t\t}}\n\t\t\t\t\t{...props}\n\t\t\t\t/>\n\t\t\t</div>\n\t\t</AlertDialogPortal>\n\t),\n);\nAlertDialogContent.displayName = \"AlertDialogContent\";\n\n/**\n * Contains the main content of the alert dialog.\n *\n * @see https://mantle.ngrok.com/components/alert-dialog#api-alert-dialog-body\n *\n * @example\n * ```tsx\n * <AlertDialog priority=\"danger\">\n *   <AlertDialogTrigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Show Danger Alert Dialog\n *     </Button>\n *   </AlertDialogTrigger>\n *   <AlertDialogContent>\n *     <AlertDialogIcon />\n *     <AlertDialogBody>\n *       <AlertDialogHeader>\n *         <AlertDialogTitle>\n *           Are you absolutely sure?\n *         </AlertDialogTitle>\n *         <AlertDialogDescription>\n *           Proident quis nisi tempor irure sunt ut minim occaecat mollit sunt.\n *         </AlertDialogDescription>\n *       </AlertDialogHeader>\n *       <AlertDialogFooter>\n *         <AlertDialogCancel type=\"button\">Cancel</AlertDialogCancel>\n *         <AlertDialogAction type=\"button\">\n *           Continue\n *         </AlertDialogAction>\n *       </AlertDialogFooter>\n *   \t</AlertDialogBody>\n *   </AlertDialogContent>\n * </AlertDialog>\n * ```\n */\nconst AlertDialogBody = forwardRef<\n\tComponentRef<\"div\">,\n\tComponentProps<\"div\"> & WithAsChild\n>(({ asChild = false, className, ...props }, ref) => {\n\tconst Component = asChild ? Slot : \"div\";\n\n\treturn (\n\t\t<Component\n\t\t\tclassName={cx(\"flex-1 space-y-4\", className)}\n\t\t\tref={ref}\n\t\t\t{...props}\n\t\t/>\n\t);\n});\nAlertDialogBody.displayName = \"AlertDialogBody\";\n\n/**\n * Contains the header content of the dialog, including the title and description.\n *\n * @see https://mantle.ngrok.com/components/alert-dialog#api-alert-dialog-header\n *\n * @example\n * ```tsx\n * <AlertDialog priority=\"danger\">\n *   <AlertDialogTrigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Show Danger Alert Dialog\n *     </Button>\n *   </AlertDialogTrigger>\n *   <AlertDialogContent>\n *     <AlertDialogIcon />\n *     <AlertDialogBody>\n *       <AlertDialogHeader>\n *         <AlertDialogTitle>\n *           Are you absolutely sure?\n *         </AlertDialogTitle>\n *         <AlertDialogDescription>\n *           Proident quis nisi tempor irure sunt ut minim occaecat mollit sunt.\n *         </AlertDialogDescription>\n *       </AlertDialogHeader>\n *       <AlertDialogFooter>\n *         <AlertDialogCancel type=\"button\">Cancel</AlertDialogCancel>\n *         <AlertDialogAction type=\"button\">\n *           Continue\n *         </AlertDialogAction>\n *       </AlertDialogFooter>\n *   \t</AlertDialogBody>\n *   </AlertDialogContent>\n * </AlertDialog>\n * ```\n */\nconst AlertDialogHeader = forwardRef<\n\tComponentRef<\"div\">,\n\tComponentProps<\"div\"> & WithAsChild\n>(({ asChild = false, className, ...props }, ref) => {\n\tconst Component = asChild ? Slot : \"div\";\n\n\treturn (\n\t\t<Component\n\t\t\tclassName={cx(\n\t\t\t\t\"flex flex-col space-y-2 text-center sm:text-start\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n});\nAlertDialogHeader.displayName = \"AlertDialogHeader\";\n\n/**\n * Contains the footer content of the dialog, including the action and cancel buttons.\n *\n * @see https://mantle.ngrok.com/components/alert-dialog#api-alert-dialog-footer\n *\n * @example\n * ```tsx\n * <AlertDialog priority=\"danger\">\n *   <AlertDialogTrigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Show Danger Alert Dialog\n *     </Button>\n *   </AlertDialogTrigger>\n *   <AlertDialogContent>\n *     <AlertDialogIcon />\n *     <AlertDialogBody>\n *       <AlertDialogHeader>\n *         <AlertDialogTitle>\n *           Are you absolutely sure?\n *         </AlertDialogTitle>\n *         <AlertDialogDescription>\n *           Proident quis nisi tempor irure sunt ut minim occaecat mollit sunt.\n *         </AlertDialogDescription>\n *       </AlertDialogHeader>\n *       <AlertDialogFooter>\n *         <AlertDialogCancel type=\"button\">Cancel</AlertDialogCancel>\n *         <AlertDialogAction type=\"button\">\n *           Continue\n *         </AlertDialogAction>\n *       </AlertDialogFooter>\n *   \t</AlertDialogBody>\n *   </AlertDialogContent>\n * </AlertDialog>\n * ```\n */\nconst AlertDialogFooter = forwardRef<\n\tComponentRef<\"div\">,\n\tComponentProps<\"div\"> & WithAsChild\n>(({ asChild = false, className, ...props }, ref) => {\n\tconst Component = asChild ? Slot : \"div\";\n\n\treturn (\n\t\t<Component\n\t\t\tclassName={cx(\n\t\t\t\t\"flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n});\nAlertDialogFooter.displayName = \"AlertDialogFooter\";\n\n/**\n * An accessible name to be announced when the dialog is opened.\n *\n * Alternatively, you can provide `aria-label` or `aria-labelledby` to\n * `AlertDialogContent` and exclude this component.\n *\n * @see https://mantle.ngrok.com/components/alert-dialog#api-alert-dialog-title\n *\n * @example\n * ```tsx\n * <AlertDialog priority=\"danger\">\n *   <AlertDialogTrigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Show Danger Alert Dialog\n *     </Button>\n *   </AlertDialogTrigger>\n *   <AlertDialogContent>\n *     <AlertDialogIcon />\n *     <AlertDialogBody>\n *       <AlertDialogHeader>\n *         <AlertDialogTitle>\n *           Are you absolutely sure?\n *         </AlertDialogTitle>\n *         <AlertDialogDescription>\n *           Proident quis nisi tempor irure sunt ut minim occaecat mollit sunt.\n *         </AlertDialogDescription>\n *       </AlertDialogHeader>\n *       <AlertDialogFooter>\n *         <AlertDialogCancel type=\"button\">Cancel</AlertDialogCancel>\n *         <AlertDialogAction type=\"button\">\n *           Continue\n *         </AlertDialogAction>\n *       </AlertDialogFooter>\n *   \t</AlertDialogBody>\n *   </AlertDialogContent>\n * </AlertDialog>\n * ```\n */\nconst AlertDialogTitle = forwardRef<\n\tComponentRef<typeof AlertDialogPrimitive.Title>,\n\tComponentPropsWithoutRef<typeof AlertDialogPrimitive.Title>\n>(({ className, ...props }, ref) => (\n\t<AlertDialogPrimitive.Title\n\t\tref={ref}\n\t\tclassName={cx(\n\t\t\t\"text-strong text-center text-lg font-medium sm:text-start\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nAlertDialogTitle.displayName = \"AlertDialogTitle\";\n\n/**\n * An accessible description to be announced when the dialog is opened.\n *\n * Alternatively, you can provide `aria-describedby` to `AlertDialogContent` and\n * exclude this component.\n *\n * @see https://mantle.ngrok.com/components/alert-dialog#api-alert-dialog-description\n *\n * @example\n * ```tsx\n * <AlertDialog priority=\"danger\">\n *   <AlertDialogTrigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Show Danger Alert Dialog\n *     </Button>\n *   </AlertDialogTrigger>\n *   <AlertDialogContent>\n *     <AlertDialogIcon />\n *     <AlertDialogBody>\n *       <AlertDialogHeader>\n *         <AlertDialogTitle>\n *           Are you absolutely sure?\n *         </AlertDialogTitle>\n *         <AlertDialogDescription>\n *           Proident quis nisi tempor irure sunt ut minim occaecat mollit sunt.\n *         </AlertDialogDescription>\n *       </AlertDialogHeader>\n *       <AlertDialogFooter>\n *         <AlertDialogCancel type=\"button\">Cancel</AlertDialogCancel>\n *         <AlertDialogAction type=\"button\">\n *           Continue\n *         </AlertDialogAction>\n *       </AlertDialogFooter>\n *   \t</AlertDialogBody>\n *   </AlertDialogContent>\n * </AlertDialog>\n * ```\n */\nconst AlertDialogDescription = forwardRef<\n\tComponentRef<typeof AlertDialogPrimitive.Description>,\n\tComponentPropsWithoutRef<typeof AlertDialogPrimitive.Description>\n>(({ className, ...props }, ref) => (\n\t<AlertDialogPrimitive.Description\n\t\tref={ref}\n\t\tclassName={cx(\n\t\t\t\"text-body text-center text-sm font-normal sm:text-start\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nAlertDialogDescription.displayName = \"AlertDialogDescription\";\n\n/**\n * A button that confirms the Alert Dialog action.\n * Will default to appearance=\"filled\", as well as the priority color from the `AlertDialog`.\n * Does not close the alert dialog by default.\n *\n * These buttons should be distinguished visually from the AlertDialogCancel button.\n *\n * Composes around the mantle Button component.\n *\n * @see https://mantle.ngrok.com/components/alert-dialog#api-alert-dialog-action\n *\n * @example\n * ```tsx\n * <AlertDialog priority=\"danger\">\n *   <AlertDialogTrigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Show Danger Alert Dialog\n *     </Button>\n *   </AlertDialogTrigger>\n *   <AlertDialogContent>\n *     <AlertDialogIcon />\n *     <AlertDialogBody>\n *       <AlertDialogHeader>\n *         <AlertDialogTitle>\n *           Are you absolutely sure?\n *         </AlertDialogTitle>\n *         <AlertDialogDescription>\n *           Proident quis nisi tempor irure sunt ut minim occaecat mollit sunt.\n *         </AlertDialogDescription>\n *       </AlertDialogHeader>\n *       <AlertDialogFooter>\n *         <AlertDialogCancel type=\"button\">Cancel</AlertDialogCancel>\n *         <AlertDialogAction type=\"button\">\n *           Continue\n *         </AlertDialogAction>\n *       </AlertDialogFooter>\n *   \t</AlertDialogBody>\n *   </AlertDialogContent>\n * </AlertDialog>\n * ```\n */\nconst AlertDialogAction = forwardRef<ComponentRef<\"button\">, ButtonProps>(\n\t(\n\t\t{\n\t\t\t//,\n\t\t\tappearance = \"filled\",\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => {\n\t\tconst ctx = useAlertDialogContext();\n\t\tlet buttonPriority: NonNullable<ButtonPriority> = \"default\";\n\t\tif (ctx.priority === \"danger\") {\n\t\t\tbuttonPriority = \"danger\";\n\t\t}\n\n\t\treturn (\n\t\t\t<Button\n\t\t\t\t//\n\t\t\t\tappearance={appearance}\n\t\t\t\tpriority={buttonPriority}\n\t\t\t\tref={ref}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t);\n\t},\n);\nAlertDialogAction.displayName = \"AlertDialogAction\";\n\n/**\n * A button that closes the dialog and cancels the action.\n * Will default to appearance=\"outlined\" and priority=\"neutral\".\n *\n * This button should be distinguished visually from AlertDialogAction buttons.\n *\n * Composes around the mantle Button component.\n *\n * @see https://mantle.ngrok.com/components/alert-dialog#api-alert-dialog-cancel\n *\n * @example\n * ```tsx\n * <AlertDialog priority=\"danger\">\n *   <AlertDialogTrigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Show Danger Alert Dialog\n *     </Button>\n *   </AlertDialogTrigger>\n *   <AlertDialogContent>\n *     <AlertDialogIcon />\n *     <AlertDialogBody>\n *       <AlertDialogHeader>\n *         <AlertDialogTitle>\n *           Are you absolutely sure?\n *         </AlertDialogTitle>\n *         <AlertDialogDescription>\n *           Proident quis nisi tempor irure sunt ut minim occaecat mollit sunt.\n *         </AlertDialogDescription>\n *       </AlertDialogHeader>\n *       <AlertDialogFooter>\n *         <AlertDialogCancel type=\"button\">Cancel</AlertDialogCancel>\n *         <AlertDialogAction type=\"button\">\n *           Continue\n *         </AlertDialogAction>\n *       </AlertDialogFooter>\n *   \t</AlertDialogBody>\n *   </AlertDialogContent>\n * </AlertDialog>\n * ```\n */\nconst AlertDialogCancel = forwardRef<ComponentRef<\"button\">, ButtonProps>(\n\t(\n\t\t{\n\t\t\t//,\n\t\t\tappearance = \"outlined\",\n\t\t\tclassName,\n\t\t\tpriority = \"neutral\",\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => (\n\t\t<AlertDialogPrimitive.Close asChild>\n\t\t\t<Button\n\t\t\t\tappearance={appearance}\n\t\t\t\tclassName={cx(\"mt-2 sm:mt-0\", className)}\n\t\t\t\tpriority={priority}\n\t\t\t\tref={ref}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t</AlertDialogPrimitive.Close>\n\t),\n);\nAlertDialogCancel.displayName = \"AlertDialogCancel\";\n\ntype AlertDialogIconProps = Omit<SvgAttributes, \"children\"> & {\n\tsvg?: ReactNode;\n};\n\n/**\n * An icon that visually represents the priority of the AlertDialog.\n *\n * Defaults to a warning icon for danger priority and an info icon for info\n * priority with the appropriate color.\n *\n * Can be overridden with a custom icon using the `svg` prop.\n *\n * @see https://mantle.ngrok.com/components/alert-dialog#api-alert-dialog-icon\n *\n * @example\n * ```tsx\n * <AlertDialog priority=\"danger\">\n *   <AlertDialogTrigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Show Danger Alert Dialog\n *     </Button>\n *   </AlertDialogTrigger>\n *   <AlertDialogContent>\n *     <AlertDialogIcon />\n *     <AlertDialogBody>\n *       <AlertDialogHeader>\n *         <AlertDialogTitle>\n *           Are you absolutely sure?\n *         </AlertDialogTitle>\n *         <AlertDialogDescription>\n *           Proident quis nisi tempor irure sunt ut minim occaecat mollit sunt.\n *         </AlertDialogDescription>\n *       </AlertDialogHeader>\n *       <AlertDialogFooter>\n *         <AlertDialogCancel type=\"button\">Cancel</AlertDialogCancel>\n *         <AlertDialogAction type=\"button\">\n *           Continue\n *         </AlertDialogAction>\n *       </AlertDialogFooter>\n *   \t</AlertDialogBody>\n *   </AlertDialogContent>\n * </AlertDialog>\n * ```\n */\nconst AlertDialogIcon = forwardRef<ComponentRef<\"svg\">, AlertDialogIconProps>(\n\t({ className, svg, ...props }, ref) => {\n\t\tconst ctx = useAlertDialogContext();\n\t\tconst defaultColor =\n\t\t\tctx.priority === \"danger\" ? \"text-danger-600\" : \"text-accent-600\";\n\t\tconst defaultIcon =\n\t\t\tctx.priority === \"danger\" ? <WarningIcon /> : <InfoIcon />;\n\n\t\treturn (\n\t\t\t<SvgOnly\n\t\t\t\tref={ref}\n\t\t\t\tclassName={cx(\"size-12 sm:size-7\", defaultColor, className)}\n\t\t\t\tsvg={svg ?? defaultIcon}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t);\n\t},\n);\nAlertDialogIcon.displayName = \"AlertDialogIcon\";\n\n/**\n * A button that closes the Alert Dialog. (Unstyled)\n *\n * @see https://mantle.ngrok.com/components/alert-dialog#api-alert-dialog-close\n *\n * @example\n * ```tsx\n * <AlertDialogClose asChild>\n *   <AlertDialogAction\n *   \ttype=\"button\"\n *   \tonClick={() => doThing()}\n *   >\n *   \tDo thing and close\n *   </AlertDialogAction>\n * </AlertDialogClose>\n */\nconst AlertDialogClose = AlertDialogPrimitive.Close;\n\nexport {\n\t//,\n\tAlertDialog,\n\tAlertDialogAction,\n\tAlertDialogBody,\n\tAlertDialogCancel,\n\tAlertDialogClose,\n\tAlertDialogContent,\n\tAlertDialogDescription,\n\tAlertDialogFooter,\n\tAlertDialogHeader,\n\tAlertDialogIcon,\n\tAlertDialogTitle,\n\tAlertDialogTrigger,\n};\n"],"mappings":"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","names":["InfoIcon","WarningIcon","Slot","createContext","forwardRef","useContext","useMemo","invariant","jsx","jsxs","AlertDialogContext","createContext","useAlertDialogContext","context","useContext","invariant","AlertDialog","priority","props","useMemo","jsx","Root","AlertDialogTrigger","Trigger","AlertDialogPortal","Portal","AlertDialogOverlay","forwardRef","className","ref","Overlay","cx","AlertDialogContent","onInteractOutside","onPointerDownOutside","preferredWidth","jsxs","Content","event","preventCloseOnPromptInteraction","AlertDialogBody","asChild","Slot","AlertDialogHeader","AlertDialogFooter","AlertDialogTitle","Title","AlertDialogDescription","Description","AlertDialogAction","appearance","ctx","buttonPriority","Button","AlertDialogCancel","Close","AlertDialogIcon","svg","defaultColor","defaultIcon","WarningIcon","InfoIcon","SvgOnly","AlertDialogClose"]}
+{"version":3,"sources":["../src/components/alert-dialog/alert-dialog.tsx"],"sourcesContent":["\"use client\";\n\nimport { InfoIcon } from \"@phosphor-icons/react/Info\";\nimport { WarningIcon } from \"@phosphor-icons/react/Warning\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport {\n\ttype ComponentProps,\n\ttype ComponentPropsWithoutRef,\n\ttype ComponentRef,\n\ttype ReactNode,\n\tcreateContext,\n\tforwardRef,\n\tuseContext,\n\tuseMemo,\n} from \"react\";\nimport invariant from \"tiny-invariant\";\nimport type { WithAsChild } from \"../../types/as-child.js\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport {\n\tButton,\n\ttype ButtonPriority,\n\ttype ButtonProps,\n} from \"../button/button.js\";\nimport * as AlertDialogPrimitive from \"../dialog/primitive.js\";\nimport { SvgOnly } from \"../icon/svg-only.js\";\nimport type { SvgAttributes } from \"../icon/types.js\";\nimport { preventCloseOnPromptInteraction } from \"../toast/toast.js\";\n\nconst priorities = [\"info\", \"danger\"] as const;\ntype Priority = (typeof priorities)[number];\n\ntype AlertDialogContextValue = {\n\tpriority: Priority;\n};\n\nconst AlertDialogContext = createContext<AlertDialogContextValue | null>(null);\n\nfunction useAlertDialogContext() {\n\tconst context = useContext(AlertDialogContext);\n\tinvariant(\n\t\tcontext,\n\t\t\"AlertDialog child component used outside of AlertDialog parent!\",\n\t);\n\treturn context;\n}\n\ntype AlertDialogProps = ComponentProps<typeof AlertDialogPrimitive.Root> & {\n\t/**\n\t * Indicates the importance or impact level of the AlertDialog, affecting its\n\t * color and styling to communicate its purpose to the user.\n\t */\n\tpriority: Priority;\n};\n\n/**\n * A modal dialog that interrupts the user with important content and expects a\n * response.\n * The root stateful component for the Alert Dialog.\n *\n * @see https://mantle.ngrok.com/components/alert-dialog#api-alert-dialog\n *\n * @example\n * ```tsx\n * <AlertDialog priority=\"danger\">\n *   <AlertDialogTrigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Show Danger Alert Dialog\n *     </Button>\n *   </AlertDialogTrigger>\n *   <AlertDialogContent>\n *     <AlertDialogIcon />\n *     <AlertDialogBody>\n *       <AlertDialogHeader>\n *         <AlertDialogTitle>\n *           Are you absolutely sure?\n *         </AlertDialogTitle>\n *         <AlertDialogDescription>\n *           Proident quis nisi tempor irure sunt ut minim occaecat mollit sunt.\n *         </AlertDialogDescription>\n *       </AlertDialogHeader>\n *       <AlertDialogFooter>\n *         <AlertDialogCancel type=\"button\">Cancel</AlertDialogCancel>\n *         <AlertDialogAction type=\"button\">\n *           Continue\n *         </AlertDialogAction>\n *       </AlertDialogFooter>\n *   \t</AlertDialogBody>\n *   </AlertDialogContent>\n * </AlertDialog>\n * ```\n */\nfunction AlertDialog({ priority, ...props }: AlertDialogProps) {\n\tconst context: AlertDialogContextValue = useMemo(\n\t\t() => ({ priority }),\n\t\t[priority],\n\t);\n\n\treturn (\n\t\t<AlertDialogContext.Provider value={context}>\n\t\t\t<AlertDialogPrimitive.Root {...props} />\n\t\t</AlertDialogContext.Provider>\n\t);\n}\nAlertDialog.displayName = \"AlertDialog\";\n\n/**\n * A button that opens the Alert Dialog.\n *\n * @see https://mantle.ngrok.com/components/alert-dialog#api-alert-dialog-trigger\n *\n * @example\n * ```tsx\n * <AlertDialog priority=\"danger\">\n *   <AlertDialogTrigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Show Danger Alert Dialog\n *     </Button>\n *   </AlertDialogTrigger>\n *   <AlertDialogContent>\n *     <AlertDialogIcon />\n *     <AlertDialogBody>\n *       <AlertDialogHeader>\n *         <AlertDialogTitle>\n *           Are you absolutely sure?\n *         </AlertDialogTitle>\n *         <AlertDialogDescription>\n *           Proident quis nisi tempor irure sunt ut minim occaecat mollit sunt.\n *         </AlertDialogDescription>\n *       </AlertDialogHeader>\n *       <AlertDialogFooter>\n *         <AlertDialogCancel type=\"button\">Cancel</AlertDialogCancel>\n *         <AlertDialogAction type=\"button\">\n *           Continue\n *         </AlertDialogAction>\n *       </AlertDialogFooter>\n *   \t</AlertDialogBody>\n *   </AlertDialogContent>\n * </AlertDialog>\n * ```\n */\nconst AlertDialogTrigger = AlertDialogPrimitive.Trigger;\n\n/**\n * The portal for the Alert Dialog.\n *\n * @private\n */\nconst AlertDialogPortal = AlertDialogPrimitive.Portal;\n\n/**\n * A layer that covers the inert portion of the view when the dialog is open.\n *\n * @private\n */\nconst AlertDialogOverlay = forwardRef<\n\tComponentRef<typeof AlertDialogPrimitive.Overlay>,\n\tComponentPropsWithoutRef<typeof AlertDialogPrimitive.Overlay>\n>(({ className, ...props }, ref) => (\n\t<AlertDialogPrimitive.Overlay\n\t\tclassName={cx(\n\t\t\t\"data-state-open:animate-in data-state-closed:animate-out data-state-closed:fade-out-0 data-state-open:fade-in-0 bg-overlay fixed inset-0 z-50 backdrop-blur-sm\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t\tref={ref}\n\t/>\n));\nAlertDialogOverlay.displayName = \"AlertDialogOverlay\";\n\ntype AlertDialogContentProps = ComponentPropsWithoutRef<\n\ttypeof AlertDialogPrimitive.Content\n> & {\n\t/**\n\t * The preferred width of the `AlertDialogContent` as a tailwind `max-w-` class.\n\t *\n\t * By default, a `AlertDialog`'s content width is responsive with a default\n\t * preferred width: the maximum width of the `AlertDialogContent`\n\t *\n\t * @default `max-w-md`\n\t */\n\tpreferredWidth?: `max-w-${string}`;\n};\n\n/**\n * The popover alert dialog container.\n *\n * Renders on top of the overlay and is centered in the viewport.\n *\n * @see https://mantle.ngrok.com/components/alert-dialog#api-alert-dialog-content\n *\n * @example\n * ```tsx\n * <AlertDialog priority=\"danger\">\n *   <AlertDialogTrigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Show Danger Alert Dialog\n *     </Button>\n *   </AlertDialogTrigger>\n *   <AlertDialogContent>\n *     <AlertDialogIcon />\n *     <AlertDialogBody>\n *       <AlertDialogHeader>\n *         <AlertDialogTitle>\n *           Are you absolutely sure?\n *         </AlertDialogTitle>\n *         <AlertDialogDescription>\n *           Proident quis nisi tempor irure sunt ut minim occaecat mollit sunt.\n *         </AlertDialogDescription>\n *       </AlertDialogHeader>\n *       <AlertDialogFooter>\n *         <AlertDialogCancel type=\"button\">Cancel</AlertDialogCancel>\n *         <AlertDialogAction type=\"button\">\n *           Continue\n *         </AlertDialogAction>\n *       </AlertDialogFooter>\n *   \t</AlertDialogBody>\n *   </AlertDialogContent>\n * </AlertDialog>\n * ```\n */\nconst AlertDialogContent = forwardRef<\n\tComponentRef<typeof AlertDialogPrimitive.Content>,\n\tAlertDialogContentProps\n>(\n\t(\n\t\t{\n\t\t\tclassName,\n\t\t\tonInteractOutside,\n\t\t\tonPointerDownOutside,\n\t\t\tpreferredWidth = \"max-w-md\",\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => (\n\t\t<AlertDialogPortal>\n\t\t\t<AlertDialogOverlay />\n\t\t\t<div className=\"fixed inset-4 z-50 flex items-center justify-center\">\n\t\t\t\t<AlertDialogPrimitive.Content\n\t\t\t\t\tref={ref}\n\t\t\t\t\tclassName={cx(\n\t\t\t\t\t\t\"flex w-full flex-1 flex-col items-center gap-4 sm:flex-row sm:items-start\",\n\t\t\t\t\t\t\"outline-none focus-within:outline-none\",\n\t\t\t\t\t\t\"p-6\",\n\t\t\t\t\t\t\"border-dialog bg-dialog rounded-xl border shadow-lg transition-transform duration-200\",\n\t\t\t\t\t\t\"data-state-closed:animate-out data-state-closed:fade-out-0 data-state-closed:zoom-out-95 data-state-open:animate-in data-state-open:fade-in-0 data-state-open:zoom-in-95\",\n\t\t\t\t\t\tpreferredWidth,\n\t\t\t\t\t\tclassName,\n\t\t\t\t\t)}\n\t\t\t\t\tonInteractOutside={(event) => {\n\t\t\t\t\t\tpreventCloseOnPromptInteraction(event);\n\t\t\t\t\t\tonInteractOutside?.(event);\n\t\t\t\t\t}}\n\t\t\t\t\tonPointerDownOutside={(event) => {\n\t\t\t\t\t\tpreventCloseOnPromptInteraction(event);\n\t\t\t\t\t\tonPointerDownOutside?.(event);\n\t\t\t\t\t}}\n\t\t\t\t\t{...props}\n\t\t\t\t/>\n\t\t\t</div>\n\t\t</AlertDialogPortal>\n\t),\n);\nAlertDialogContent.displayName = \"AlertDialogContent\";\n\n/**\n * Contains the main content of the alert dialog.\n *\n * @see https://mantle.ngrok.com/components/alert-dialog#api-alert-dialog-body\n *\n * @example\n * ```tsx\n * <AlertDialog priority=\"danger\">\n *   <AlertDialogTrigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Show Danger Alert Dialog\n *     </Button>\n *   </AlertDialogTrigger>\n *   <AlertDialogContent>\n *     <AlertDialogIcon />\n *     <AlertDialogBody>\n *       <AlertDialogHeader>\n *         <AlertDialogTitle>\n *           Are you absolutely sure?\n *         </AlertDialogTitle>\n *         <AlertDialogDescription>\n *           Proident quis nisi tempor irure sunt ut minim occaecat mollit sunt.\n *         </AlertDialogDescription>\n *       </AlertDialogHeader>\n *       <AlertDialogFooter>\n *         <AlertDialogCancel type=\"button\">Cancel</AlertDialogCancel>\n *         <AlertDialogAction type=\"button\">\n *           Continue\n *         </AlertDialogAction>\n *       </AlertDialogFooter>\n *   \t</AlertDialogBody>\n *   </AlertDialogContent>\n * </AlertDialog>\n * ```\n */\nconst AlertDialogBody = forwardRef<\n\tComponentRef<\"div\">,\n\tComponentProps<\"div\"> & WithAsChild\n>(({ asChild = false, className, ...props }, ref) => {\n\tconst Component = asChild ? Slot : \"div\";\n\n\treturn (\n\t\t<Component\n\t\t\tclassName={cx(\"flex-1 space-y-4\", className)}\n\t\t\tref={ref}\n\t\t\t{...props}\n\t\t/>\n\t);\n});\nAlertDialogBody.displayName = \"AlertDialogBody\";\n\n/**\n * Contains the header content of the dialog, including the title and description.\n *\n * @see https://mantle.ngrok.com/components/alert-dialog#api-alert-dialog-header\n *\n * @example\n * ```tsx\n * <AlertDialog priority=\"danger\">\n *   <AlertDialogTrigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Show Danger Alert Dialog\n *     </Button>\n *   </AlertDialogTrigger>\n *   <AlertDialogContent>\n *     <AlertDialogIcon />\n *     <AlertDialogBody>\n *       <AlertDialogHeader>\n *         <AlertDialogTitle>\n *           Are you absolutely sure?\n *         </AlertDialogTitle>\n *         <AlertDialogDescription>\n *           Proident quis nisi tempor irure sunt ut minim occaecat mollit sunt.\n *         </AlertDialogDescription>\n *       </AlertDialogHeader>\n *       <AlertDialogFooter>\n *         <AlertDialogCancel type=\"button\">Cancel</AlertDialogCancel>\n *         <AlertDialogAction type=\"button\">\n *           Continue\n *         </AlertDialogAction>\n *       </AlertDialogFooter>\n *   \t</AlertDialogBody>\n *   </AlertDialogContent>\n * </AlertDialog>\n * ```\n */\nconst AlertDialogHeader = forwardRef<\n\tComponentRef<\"div\">,\n\tComponentProps<\"div\"> & WithAsChild\n>(({ asChild = false, className, ...props }, ref) => {\n\tconst Component = asChild ? Slot : \"div\";\n\n\treturn (\n\t\t<Component\n\t\t\tclassName={cx(\n\t\t\t\t\"flex flex-col space-y-2 text-center sm:text-start\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n});\nAlertDialogHeader.displayName = \"AlertDialogHeader\";\n\n/**\n * Contains the footer content of the dialog, including the action and cancel buttons.\n *\n * @see https://mantle.ngrok.com/components/alert-dialog#api-alert-dialog-footer\n *\n * @example\n * ```tsx\n * <AlertDialog priority=\"danger\">\n *   <AlertDialogTrigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Show Danger Alert Dialog\n *     </Button>\n *   </AlertDialogTrigger>\n *   <AlertDialogContent>\n *     <AlertDialogIcon />\n *     <AlertDialogBody>\n *       <AlertDialogHeader>\n *         <AlertDialogTitle>\n *           Are you absolutely sure?\n *         </AlertDialogTitle>\n *         <AlertDialogDescription>\n *           Proident quis nisi tempor irure sunt ut minim occaecat mollit sunt.\n *         </AlertDialogDescription>\n *       </AlertDialogHeader>\n *       <AlertDialogFooter>\n *         <AlertDialogCancel type=\"button\">Cancel</AlertDialogCancel>\n *         <AlertDialogAction type=\"button\">\n *           Continue\n *         </AlertDialogAction>\n *       </AlertDialogFooter>\n *   \t</AlertDialogBody>\n *   </AlertDialogContent>\n * </AlertDialog>\n * ```\n */\nconst AlertDialogFooter = forwardRef<\n\tComponentRef<\"div\">,\n\tComponentProps<\"div\"> & WithAsChild\n>(({ asChild = false, className, ...props }, ref) => {\n\tconst Component = asChild ? Slot : \"div\";\n\n\treturn (\n\t\t<Component\n\t\t\tclassName={cx(\n\t\t\t\t\"flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n});\nAlertDialogFooter.displayName = \"AlertDialogFooter\";\n\n/**\n * An accessible name to be announced when the dialog is opened.\n *\n * Alternatively, you can provide `aria-label` or `aria-labelledby` to\n * `AlertDialogContent` and exclude this component.\n *\n * @see https://mantle.ngrok.com/components/alert-dialog#api-alert-dialog-title\n *\n * @example\n * ```tsx\n * <AlertDialog priority=\"danger\">\n *   <AlertDialogTrigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Show Danger Alert Dialog\n *     </Button>\n *   </AlertDialogTrigger>\n *   <AlertDialogContent>\n *     <AlertDialogIcon />\n *     <AlertDialogBody>\n *       <AlertDialogHeader>\n *         <AlertDialogTitle>\n *           Are you absolutely sure?\n *         </AlertDialogTitle>\n *         <AlertDialogDescription>\n *           Proident quis nisi tempor irure sunt ut minim occaecat mollit sunt.\n *         </AlertDialogDescription>\n *       </AlertDialogHeader>\n *       <AlertDialogFooter>\n *         <AlertDialogCancel type=\"button\">Cancel</AlertDialogCancel>\n *         <AlertDialogAction type=\"button\">\n *           Continue\n *         </AlertDialogAction>\n *       </AlertDialogFooter>\n *   \t</AlertDialogBody>\n *   </AlertDialogContent>\n * </AlertDialog>\n * ```\n */\nconst AlertDialogTitle = forwardRef<\n\tComponentRef<typeof AlertDialogPrimitive.Title>,\n\tComponentPropsWithoutRef<typeof AlertDialogPrimitive.Title>\n>(({ className, ...props }, ref) => (\n\t<AlertDialogPrimitive.Title\n\t\tref={ref}\n\t\tclassName={cx(\n\t\t\t\"text-strong text-center text-lg font-medium sm:text-start\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nAlertDialogTitle.displayName = \"AlertDialogTitle\";\n\n/**\n * An accessible description to be announced when the dialog is opened.\n *\n * Alternatively, you can provide `aria-describedby` to `AlertDialogContent` and\n * exclude this component.\n *\n * @see https://mantle.ngrok.com/components/alert-dialog#api-alert-dialog-description\n *\n * @example\n * ```tsx\n * <AlertDialog priority=\"danger\">\n *   <AlertDialogTrigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Show Danger Alert Dialog\n *     </Button>\n *   </AlertDialogTrigger>\n *   <AlertDialogContent>\n *     <AlertDialogIcon />\n *     <AlertDialogBody>\n *       <AlertDialogHeader>\n *         <AlertDialogTitle>\n *           Are you absolutely sure?\n *         </AlertDialogTitle>\n *         <AlertDialogDescription>\n *           Proident quis nisi tempor irure sunt ut minim occaecat mollit sunt.\n *         </AlertDialogDescription>\n *       </AlertDialogHeader>\n *       <AlertDialogFooter>\n *         <AlertDialogCancel type=\"button\">Cancel</AlertDialogCancel>\n *         <AlertDialogAction type=\"button\">\n *           Continue\n *         </AlertDialogAction>\n *       </AlertDialogFooter>\n *   \t</AlertDialogBody>\n *   </AlertDialogContent>\n * </AlertDialog>\n * ```\n */\nconst AlertDialogDescription = forwardRef<\n\tComponentRef<typeof AlertDialogPrimitive.Description>,\n\tComponentPropsWithoutRef<typeof AlertDialogPrimitive.Description>\n>(({ className, ...props }, ref) => (\n\t<AlertDialogPrimitive.Description\n\t\tref={ref}\n\t\tclassName={cx(\n\t\t\t\"text-body text-center text-sm font-normal sm:text-start\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nAlertDialogDescription.displayName = \"AlertDialogDescription\";\n\n/**\n * A button that confirms the Alert Dialog action.\n * Will default to appearance=\"filled\", as well as the priority color from the `AlertDialog`.\n * Does not close the alert dialog by default.\n *\n * These buttons should be distinguished visually from the AlertDialogCancel button.\n *\n * Composes around the mantle Button component.\n *\n * @see https://mantle.ngrok.com/components/alert-dialog#api-alert-dialog-action\n *\n * @example\n * ```tsx\n * <AlertDialog priority=\"danger\">\n *   <AlertDialogTrigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Show Danger Alert Dialog\n *     </Button>\n *   </AlertDialogTrigger>\n *   <AlertDialogContent>\n *     <AlertDialogIcon />\n *     <AlertDialogBody>\n *       <AlertDialogHeader>\n *         <AlertDialogTitle>\n *           Are you absolutely sure?\n *         </AlertDialogTitle>\n *         <AlertDialogDescription>\n *           Proident quis nisi tempor irure sunt ut minim occaecat mollit sunt.\n *         </AlertDialogDescription>\n *       </AlertDialogHeader>\n *       <AlertDialogFooter>\n *         <AlertDialogCancel type=\"button\">Cancel</AlertDialogCancel>\n *         <AlertDialogAction type=\"button\">\n *           Continue\n *         </AlertDialogAction>\n *       </AlertDialogFooter>\n *   \t</AlertDialogBody>\n *   </AlertDialogContent>\n * </AlertDialog>\n * ```\n */\nconst AlertDialogAction = forwardRef<ComponentRef<\"button\">, ButtonProps>(\n\t(\n\t\t{\n\t\t\t//,\n\t\t\tappearance = \"filled\",\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => {\n\t\tconst ctx = useAlertDialogContext();\n\t\tlet buttonPriority: NonNullable<ButtonPriority> = \"default\";\n\t\tif (ctx.priority === \"danger\") {\n\t\t\tbuttonPriority = \"danger\";\n\t\t}\n\n\t\treturn (\n\t\t\t<Button\n\t\t\t\t//\n\t\t\t\tappearance={appearance}\n\t\t\t\tpriority={buttonPriority}\n\t\t\t\tref={ref}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t);\n\t},\n);\nAlertDialogAction.displayName = \"AlertDialogAction\";\n\n/**\n * A button that closes the dialog and cancels the action.\n * Will default to appearance=\"outlined\" and priority=\"neutral\".\n *\n * This button should be distinguished visually from AlertDialogAction buttons.\n *\n * Composes around the mantle Button component.\n *\n * @see https://mantle.ngrok.com/components/alert-dialog#api-alert-dialog-cancel\n *\n * @example\n * ```tsx\n * <AlertDialog priority=\"danger\">\n *   <AlertDialogTrigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Show Danger Alert Dialog\n *     </Button>\n *   </AlertDialogTrigger>\n *   <AlertDialogContent>\n *     <AlertDialogIcon />\n *     <AlertDialogBody>\n *       <AlertDialogHeader>\n *         <AlertDialogTitle>\n *           Are you absolutely sure?\n *         </AlertDialogTitle>\n *         <AlertDialogDescription>\n *           Proident quis nisi tempor irure sunt ut minim occaecat mollit sunt.\n *         </AlertDialogDescription>\n *       </AlertDialogHeader>\n *       <AlertDialogFooter>\n *         <AlertDialogCancel type=\"button\">Cancel</AlertDialogCancel>\n *         <AlertDialogAction type=\"button\">\n *           Continue\n *         </AlertDialogAction>\n *       </AlertDialogFooter>\n *   \t</AlertDialogBody>\n *   </AlertDialogContent>\n * </AlertDialog>\n * ```\n */\nconst AlertDialogCancel = forwardRef<ComponentRef<\"button\">, ButtonProps>(\n\t(\n\t\t{\n\t\t\t//,\n\t\t\tappearance = \"outlined\",\n\t\t\tclassName,\n\t\t\tpriority = \"neutral\",\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => (\n\t\t<AlertDialogPrimitive.Close asChild>\n\t\t\t<Button\n\t\t\t\tappearance={appearance}\n\t\t\t\tclassName={cx(\"mt-2 sm:mt-0\", className)}\n\t\t\t\tpriority={priority}\n\t\t\t\tref={ref}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t</AlertDialogPrimitive.Close>\n\t),\n);\nAlertDialogCancel.displayName = \"AlertDialogCancel\";\n\ntype AlertDialogIconProps = Omit<SvgAttributes, \"children\"> & {\n\tsvg?: ReactNode;\n};\n\n/**\n * An icon that visually represents the priority of the AlertDialog.\n *\n * Defaults to a warning icon for danger priority and an info icon for info\n * priority with the appropriate color.\n *\n * Can be overridden with a custom icon using the `svg` prop.\n *\n * @see https://mantle.ngrok.com/components/alert-dialog#api-alert-dialog-icon\n *\n * @example\n * ```tsx\n * <AlertDialog priority=\"danger\">\n *   <AlertDialogTrigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Show Danger Alert Dialog\n *     </Button>\n *   </AlertDialogTrigger>\n *   <AlertDialogContent>\n *     <AlertDialogIcon />\n *     <AlertDialogBody>\n *       <AlertDialogHeader>\n *         <AlertDialogTitle>\n *           Are you absolutely sure?\n *         </AlertDialogTitle>\n *         <AlertDialogDescription>\n *           Proident quis nisi tempor irure sunt ut minim occaecat mollit sunt.\n *         </AlertDialogDescription>\n *       </AlertDialogHeader>\n *       <AlertDialogFooter>\n *         <AlertDialogCancel type=\"button\">Cancel</AlertDialogCancel>\n *         <AlertDialogAction type=\"button\">\n *           Continue\n *         </AlertDialogAction>\n *       </AlertDialogFooter>\n *   \t</AlertDialogBody>\n *   </AlertDialogContent>\n * </AlertDialog>\n * ```\n */\nconst AlertDialogIcon = forwardRef<ComponentRef<\"svg\">, AlertDialogIconProps>(\n\t({ className, svg, ...props }, ref) => {\n\t\tconst ctx = useAlertDialogContext();\n\t\tconst defaultColor =\n\t\t\tctx.priority === \"danger\" ? \"text-danger-600\" : \"text-accent-600\";\n\t\tconst defaultIcon =\n\t\t\tctx.priority === \"danger\" ? <WarningIcon /> : <InfoIcon />;\n\n\t\treturn (\n\t\t\t<SvgOnly\n\t\t\t\tref={ref}\n\t\t\t\tclassName={cx(\"size-12 sm:size-7\", defaultColor, className)}\n\t\t\t\tsvg={svg ?? defaultIcon}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t);\n\t},\n);\nAlertDialogIcon.displayName = \"AlertDialogIcon\";\n\n/**\n * A button that closes the Alert Dialog. (Unstyled)\n *\n * @see https://mantle.ngrok.com/components/alert-dialog#api-alert-dialog-close\n *\n * @example\n * ```tsx\n * <AlertDialogClose asChild>\n *   <AlertDialogAction\n *   \ttype=\"button\"\n *   \tonClick={() => doThing()}\n *   >\n *   \tDo thing and close\n *   </AlertDialogAction>\n * </AlertDialogClose>\n */\nconst AlertDialogClose = AlertDialogPrimitive.Close;\n\nexport {\n\t//,\n\tAlertDialog,\n\tAlertDialogAction,\n\tAlertDialogBody,\n\tAlertDialogCancel,\n\tAlertDialogClose,\n\tAlertDialogContent,\n\tAlertDialogDescription,\n\tAlertDialogFooter,\n\tAlertDialogHeader,\n\tAlertDialogIcon,\n\tAlertDialogTitle,\n\tAlertDialogTrigger,\n};\n"],"mappings":"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","names":["InfoIcon","WarningIcon","Slot","createContext","forwardRef","useContext","useMemo","invariant","jsx","jsxs","AlertDialogContext","createContext","useAlertDialogContext","context","useContext","invariant","AlertDialog","priority","props","useMemo","jsx","Root","AlertDialogTrigger","Trigger","AlertDialogPortal","Portal","AlertDialogOverlay","forwardRef","className","ref","Overlay","cx","AlertDialogContent","onInteractOutside","onPointerDownOutside","preferredWidth","jsxs","Content","event","preventCloseOnPromptInteraction","AlertDialogBody","asChild","Slot","AlertDialogHeader","AlertDialogFooter","AlertDialogTitle","Title","AlertDialogDescription","Description","AlertDialogAction","appearance","ctx","buttonPriority","Button","AlertDialogCancel","Close","AlertDialogIcon","svg","defaultColor","defaultIcon","WarningIcon","InfoIcon","SvgOnly","AlertDialogClose"]}

package/dist/alert.d.ts

@@ -1,7 +1,13 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as react from 'react';
 import { ComponentProps, HTMLAttributes, ReactNode } from 'react';
 import { W as WithAsChild } from './as-child-DJ7x3JFV.js';
+import { a as IconButtonProps } from './icon-button-D41yiI7H.js';
 import { S as SvgAttributes } from './types-BuKAGhC-.js';
+import 'class-variance-authority/types';
+import './variant-props-oDo2u-We.js';
+import 'class-variance-authority';
+import './deep-non-nullable-SmpSvoSd.js';
 
 declare const priorities: readonly ["danger", "info", "success", "warning"];
 type Priority = (typeof priorities)[number];
@@ -23,6 +29,7 @@ type AlertProps = ComponentProps<"div"> & {
  *   <AlertIcon />
  *   <AlertContent>
  *     <AlertTitle>Alert Title</AlertTitle>
+ * 	   <AlertDismissIconButton />
  *     <AlertDescription>
  *       Alert description text.
  *     </AlertDescription>
@@ -50,6 +57,7 @@ type AlertIconProps = Omit<SvgAttributes, "children"> & {
  *   <AlertIcon />
  *   <AlertContent>
  *     <AlertTitle>Alert Title</AlertTitle>
+ *     <AlertDismissIconButton />
  *     <AlertDescription>
  *       Alert description text.
  *     </AlertDescription>
@@ -69,6 +77,7 @@ declare const AlertIcon: react.ForwardRefExoticComponent<Omit<AlertIconProps, "r
  *   <AlertIcon />
  *   <AlertContent>
  *     <AlertTitle>Alert Title</AlertTitle>
+ *     <AlertDismissIconButton />
  *     <AlertDescription>
  *       Alert description text.
  *     </AlertDescription>
@@ -88,6 +97,7 @@ declare const AlertContent: react.ForwardRefExoticComponent<Omit<react.DetailedH
  *   <AlertIcon />
  *   <AlertContent>
  *     <AlertTitle>Alert Title</AlertTitle>
+ *     <AlertDismissIconButton />
  *     <AlertDescription>
  *       Alert description text.
  *     </AlertDescription>
@@ -108,6 +118,7 @@ type AlertDescriptionProps = ComponentProps<"p"> & WithAsChild;
  *   <AlertIcon />
  *   <AlertContent>
  *     <AlertTitle>Alert Title</AlertTitle>
+ *     <AlertDismissIconButton />
  *     <AlertDescription>
  *       Alert description text.
  *     </AlertDescription>
@@ -116,5 +127,7 @@ type AlertDescriptionProps = ComponentProps<"p"> & WithAsChild;
  * ```
  */
 declare const AlertDescription: react.ForwardRefExoticComponent<Omit<AlertDescriptionProps, "ref"> & react.RefAttributes<HTMLParagraphElement>>;
+type AlertDismissIconButtonProps = Partial<Omit<IconButtonProps, "icon">>;
+declare const AlertDismissIconButton: ({ size, type, label, appearance, className, ...props }: AlertDismissIconButtonProps) => react_jsx_runtime.JSX.Element;
 
-export { Alert, AlertContent, AlertDescription, AlertIcon, AlertTitle };
+export { Alert, AlertContent, AlertDescription, AlertDismissIconButton, AlertIcon, AlertTitle };

package/dist/alert.js

@@ -1,2 +1,2 @@
-import{a as c}from"./chunk-HDPLH5HC.js";import{a as s}from"./chunk-AZ56JGNY.js";import{CheckCircle as g}from"@phosphor-icons/react/CheckCircle";import{Info as y}from"@phosphor-icons/react/Info";import{Warning as x}from"@phosphor-icons/react/Warning";import{WarningDiamond as v}from"@phosphor-icons/react/WarningDiamond";import{Slot as l}from"@radix-ui/react-slot";import{cva as P}from"class-variance-authority";import{createContext as b,forwardRef as a,useContext as I,useMemo as N}from"react";import h from"tiny-invariant";import{jsx as r}from"react/jsx-runtime";var p=b(null);function R(){let t=I(p);return h(t,"useAlertContext hook used outside of Alert parent!"),t}var w=P("relative flex w-full gap-1.5 rounded-md border p-2.5 text-sm",{variants:{priority:{danger:"border-danger-500/50 bg-danger-500/10 text-danger-700",info:"border-accent-500/50 bg-accent-500/10 text-accent-700",success:"border-success-500/50 bg-success-500/10 text-success-700",warning:"border-warning-500/50 bg-warning-500/10 text-warning-700"}}}),m=a(({className:t,priority:e,...o},n)=>{let i=N(()=>({priority:e}),[e]);return r(p.Provider,{value:i,children:r("div",{ref:n,className:s(w({priority:e}),t),...o})})});m.displayName="Alert";var T={danger:r(x,{}),info:r(y,{}),success:r(g,{}),warning:r(v,{})},d=a(({className:t,svg:e,...o},n)=>{let i=R(),C=T[i.priority];return r(c,{ref:n,className:s("size-5",t),svg:e??C,...o})});d.displayName="AlertIcon";var f=a(({className:t,...e},o)=>r("div",{ref:o,className:s("min-w-0 flex-1",t),...e}));f.displayName="AlertContent";var A=a(({asChild:t=!1,className:e,...o},n)=>r(t?l:"h5",{ref:n,className:s("font-medium",e),...o}));A.displayName="AlertTitle";var u=a(({asChild:t=!1,className:e,...o},n)=>r(t?l:"p",{ref:n,className:s("text-sm",e),...o}));u.displayName="AlertDescription";export{m as Alert,f as AlertContent,u as AlertDescription,d as AlertIcon,A as AlertTitle};
+import{a as m}from"./chunk-BK4P33ZH.js";import"./chunk-4LSFAAZW.js";import"./chunk-3C5O3AQA.js";import"./chunk-72TJUKMV.js";import"./chunk-XQVVOOLT.js";import{a as p}from"./chunk-HDPLH5HC.js";import{a as i}from"./chunk-AZ56JGNY.js";import{CheckCircleIcon as v}from"@phosphor-icons/react/CheckCircle";import{InfoIcon as b}from"@phosphor-icons/react/Info";import{WarningIcon as P}from"@phosphor-icons/react/Warning";import{WarningDiamondIcon as I}from"@phosphor-icons/react/WarningDiamond";import{XIcon as h}from"@phosphor-icons/react/X";import{Slot as d}from"@radix-ui/react-slot";import{cva as N}from"class-variance-authority";import{createContext as w,forwardRef as a,useContext as D,useMemo as R}from"react";import T from"tiny-invariant";import{jsx as o}from"react/jsx-runtime";var u=w(null);function f(){let t=D(u);return T(t,"useAlertContext hook used outside of Alert parent!"),t}var B=N("relative flex w-full gap-1.5 rounded-md border p-2.5 text-sm",{variants:{priority:{danger:"border-danger-500/50 bg-danger-500/10 text-danger-700",info:"border-accent-500/50 bg-accent-500/10 text-accent-700",success:"border-success-500/50 bg-success-500/10 text-success-700",warning:"border-warning-500/50 bg-warning-500/10 text-warning-700"}}}),A=a(({className:t,priority:e,...r},n)=>{let s=R(()=>({priority:e}),[e]);return o(u.Provider,{value:s,children:o("div",{ref:n,className:i(B({priority:e}),t),...r})})});A.displayName="Alert";var H={danger:o(P,{}),info:o(b,{}),success:o(v,{}),warning:o(I,{})},g=a(({className:t,svg:e,...r},n)=>{let s=f(),l=H[s.priority];return o(p,{ref:n,className:i("size-5",t),svg:e??l,...r})});g.displayName="AlertIcon";var x=a(({className:t,...e},r)=>o("div",{ref:r,className:i("min-w-0 flex-1 has-[[data-alert-dismiss]]:pr-6",t),...e}));x.displayName="AlertContent";var y=a(({asChild:t=!1,className:e,...r},n)=>o(t?d:"h5",{ref:n,className:i("font-medium",e),...r}));y.displayName="AlertTitle";var C=a(({asChild:t=!1,className:e,...r},n)=>o(t?d:"p",{ref:n,className:i("text-sm",e),...r}));C.displayName="AlertDescription";var M=({size:t="sm",type:e="button",label:r="Dismiss Alert",appearance:n="ghost",className:s,...l})=>{let c=f();return o(m,{appearance:n,icon:o(h,{}),label:r,size:t,"data-alert-dismiss":!0,className:i("right-1.5 top-1.5 absolute",{"text-danger-700 not-disabled:hover:text-danger-800 not-disabled:active:text-danger-900":c.priority==="danger","text-accent-700 not-disabled:hover:text-accent-800 not-disabled:active:text-accent-900":c.priority==="info","text-success-700 not-disabled:hover:text-success-800 not-disabled:active:text-success-900":c.priority==="success","text-warning-700 not-disabled:hover:text-warning-800 not-disabled:active:text-warning-900":c.priority==="warning"},s),type:e,...l})};export{A as Alert,x as AlertContent,C as AlertDescription,M as AlertDismissIconButton,g as AlertIcon,y as AlertTitle};
 //# sourceMappingURL=alert.js.map

package/dist/alert.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/alert/alert.tsx"],"sourcesContent":["import { CheckCircle as CheckCircleIcon } from \"@phosphor-icons/react/CheckCircle\";\nimport { Info as InfoIcon } from \"@phosphor-icons/react/Info\";\nimport { Warning as WarningIcon } from \"@phosphor-icons/react/Warning\";\nimport { WarningDiamond as WarningDiamondIcon } from \"@phosphor-icons/react/WarningDiamond\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport { cva } from \"class-variance-authority\";\nimport type {\n\tComponentProps,\n\tComponentRef,\n\tHTMLAttributes,\n\tReactNode,\n} from \"react\";\nimport { createContext, forwardRef, useContext, useMemo } from \"react\";\nimport invariant from \"tiny-invariant\";\nimport type { WithAsChild } from \"../../types/index.js\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { SvgOnly } from \"../icon/svg-only.js\";\nimport type { SvgAttributes } from \"../icon/types.js\";\n\nconst priorities = [\n\t//,\n\t\"danger\",\n\t\"info\",\n\t// \"neutral\",\n\t\"success\",\n\t\"warning\",\n] as const;\ntype Priority = (typeof priorities)[number];\n\ntype AlertContextValue = {\n\tpriority: Priority;\n};\n\nconst AlertContext = createContext<AlertContextValue | null>(null);\n\nfunction useAlertContext() {\n\tconst context = useContext(AlertContext);\n\tinvariant(context, \"useAlertContext hook used outside of Alert parent!\");\n\treturn context;\n}\n\nconst alertVariants = cva(\n\t\"relative flex w-full gap-1.5 rounded-md border p-2.5 text-sm\",\n\t{\n\t\tvariants: {\n\t\t\t/**\n\t\t\t * The priority of the Alert. Indicates the importance or impact level of the Alert,\n\t\t\t * affecting its color and styling to communicate its purpose to the user.\n\t\t\t */\n\t\t\tpriority: {\n\t\t\t\tdanger: \"border-danger-500/50 bg-danger-500/10 text-danger-700\",\n\t\t\t\tinfo: \"border-accent-500/50 bg-accent-500/10 text-accent-700\",\n\t\t\t\t// neutral: \"border-neutral-500/50 bg-neutral-500/10 text-neutral-700\",\n\t\t\t\tsuccess: \"border-success-500/50 bg-success-500/10 text-success-700\",\n\t\t\t\twarning: \"border-warning-500/50 bg-warning-500/10 text-warning-700\",\n\t\t\t} as const satisfies Record<Priority, string>,\n\t\t},\n\t},\n);\n\ntype AlertProps = ComponentProps<\"div\"> & {\n\t/**\n\t * Indicates the importance or impact level of the Alert, affecting its\n\t * color and styling to communicate its purpose to the user.\n\t */\n\tpriority: Priority;\n};\n\n/**\n * Displays a callout for user attention. Root container for all Alert sub-components.\n *\n * @see https://mantle.ngrok.com/components/alert#api-alert\n *\n * @example\n * ```tsx\n * <Alert priority=\"info\">\n *   <AlertIcon />\n *   <AlertContent>\n *     <AlertTitle>Alert Title</AlertTitle>\n *     <AlertDescription>\n *       Alert description text.\n *     </AlertDescription>\n *   </AlertContent>\n * </Alert>\n *```\n */\nconst Alert = forwardRef<ComponentRef<\"div\">, AlertProps>(\n\t({ className, priority, ...props }, ref) => {\n\t\tconst context: AlertContextValue = useMemo(\n\t\t\t() => ({ priority }),\n\t\t\t[priority],\n\t\t);\n\n\t\treturn (\n\t\t\t<AlertContext.Provider value={context}>\n\t\t\t\t<div\n\t\t\t\t\tref={ref}\n\t\t\t\t\tclassName={cx(alertVariants({ priority }), className)}\n\t\t\t\t\t{...props}\n\t\t\t\t/>\n\t\t\t</AlertContext.Provider>\n\t\t);\n\t},\n);\nAlert.displayName = \"Alert\";\n\ntype AlertIconProps = Omit<SvgAttributes, \"children\"> & {\n\t/**\n\t * An optional icon that renders in place of the default icon for the Alert priority.\n\t */\n\tsvg?: ReactNode;\n};\n\n/**\n * Default `<AlertIcon>` icons for each priority.\n */\nconst defaultIcons = {\n\tdanger: <WarningIcon />,\n\tinfo: <InfoIcon />,\n\t// neutral: <BellRinging />,\n\tsuccess: <CheckCircleIcon />,\n\twarning: <WarningDiamondIcon />,\n} as const satisfies Record<Priority, ReactNode>;\n\n/**\n * An optional icon that visually represents the priority of the Alert.\n *\n * The default rendered icon be overridden with a custom icon using the `svg` prop.\n *\n * @see https://mantle.ngrok.com/components/alert#api-alert-icon\n *\n * @example\n * ```tsx\n * <Alert priority=\"info\">\n *   <AlertIcon />\n *   <AlertContent>\n *     <AlertTitle>Alert Title</AlertTitle>\n *     <AlertDescription>\n *       Alert description text.\n *     </AlertDescription>\n *   </AlertContent>\n * </Alert>\n * ```\n */\nconst AlertIcon = forwardRef<ComponentRef<\"svg\">, AlertIconProps>(\n\t({ className, svg, ...props }, ref) => {\n\t\tconst ctx = useAlertContext();\n\t\tconst defaultIcon = defaultIcons[ctx.priority];\n\n\t\treturn (\n\t\t\t<SvgOnly\n\t\t\t\tref={ref}\n\t\t\t\tclassName={cx(\"size-5\", className)}\n\t\t\t\tsvg={svg ?? defaultIcon}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t);\n\t},\n);\nAlertIcon.displayName = \"AlertIcon\";\n\n/**\n * The container for the content slot of an alert. Place the title and description as direct children.\n *\n * @see https://mantle.ngrok.com/components/alert#api-alert-content\n *\n * @example\n * ```tsx\n * <Alert priority=\"info\">\n *   <AlertIcon />\n *   <AlertContent>\n *     <AlertTitle>Alert Title</AlertTitle>\n *     <AlertDescription>\n *       Alert description text.\n *     </AlertDescription>\n *   </AlertContent>\n * </Alert>\n *```\n */\nconst AlertContent = forwardRef<ComponentRef<\"div\">, ComponentProps<\"div\">>(\n\t({ className, ...props }, ref) => (\n\t\t<div ref={ref} className={cx(\"min-w-0 flex-1\", className)} {...props} />\n\t),\n);\nAlertContent.displayName = \"AlertContent\";\n\ntype AlertTitleProps = HTMLAttributes<HTMLHeadingElement> & WithAsChild;\n\n/**\n * The title of an alert. Default renders as an h5 element, use asChild to render something else.\n *\n * @see https://mantle.ngrok.com/components/alert#api-alert-title\n *\n * @example\n * ```tsx\n * <Alert priority=\"info\">\n *   <AlertIcon />\n *   <AlertContent>\n *     <AlertTitle>Alert Title</AlertTitle>\n *     <AlertDescription>\n *       Alert description text.\n *     </AlertDescription>\n *   </AlertContent>\n * </Alert>\n *```\n */\nconst AlertTitle = forwardRef<HTMLHeadingElement, AlertTitleProps>(\n\t({ asChild = false, className, ...props }, ref) => {\n\t\tconst Component = asChild ? Slot : \"h5\";\n\n\t\treturn (\n\t\t\t<Component\n\t\t\t\tref={ref}\n\t\t\t\tclassName={cx(\"font-medium\", className)}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t);\n\t},\n);\nAlertTitle.displayName = \"AlertTitle\";\n\ntype AlertDescriptionProps = ComponentProps<\"p\"> & WithAsChild;\n\n/**\n * The optional description of an alert. Default renders as an p element, use asChild to render something else.\n *\n * @see https://mantle.ngrok.com/components/alert#api-alert-description\n *\n * @example\n * ```tsx\n * <Alert priority=\"info\">\n *   <AlertIcon />\n *   <AlertContent>\n *     <AlertTitle>Alert Title</AlertTitle>\n *     <AlertDescription>\n *       Alert description text.\n *     </AlertDescription>\n *   </AlertContent>\n * </Alert>\n * ```\n */\nconst AlertDescription = forwardRef<ComponentRef<\"p\">, AlertDescriptionProps>(\n\t({ asChild = false, className, ...props }, ref) => {\n\t\tconst Component = asChild ? Slot : \"p\";\n\n\t\treturn (\n\t\t\t<Component ref={ref} className={cx(\"text-sm\", className)} {...props} />\n\t\t);\n\t},\n);\nAlertDescription.displayName = \"AlertDescription\";\n\nexport {\n\t//,\n\tAlert,\n\tAlertContent,\n\tAlertDescription,\n\tAlertIcon,\n\tAlertTitle,\n};\n"],"mappings":"gFAAA,OAAS,eAAeA,MAAuB,oCAC/C,OAAS,QAAQC,MAAgB,6BACjC,OAAS,WAAWC,MAAmB,gCACvC,OAAS,kBAAkBC,MAA0B,uCACrD,OAAS,QAAAC,MAAY,uBACrB,OAAS,OAAAC,MAAW,2BAOpB,OAAS,iBAAAC,EAAe,cAAAC,EAAY,cAAAC,EAAY,WAAAC,MAAe,QAC/D,OAAOC,MAAe,iBAkFlB,cAAAC,MAAA,oBA9DJ,IAAMC,EAAeC,EAAwC,IAAI,EAEjE,SAASC,GAAkB,CAC1B,IAAMC,EAAUC,EAAWJ,CAAY,EACvC,OAAAK,EAAUF,EAAS,oDAAoD,EAChEA,CACR,CAEA,IAAMG,EAAgBC,EACrB,+DACA,CACC,SAAU,CAKT,SAAU,CACT,OAAQ,wDACR,KAAM,wDAEN,QAAS,2DACT,QAAS,0DACV,CACD,CACD,CACD,EA4BMC,EAAQC,EACb,CAAC,CAAE,UAAAC,EAAW,SAAAC,EAAU,GAAGC,CAAM,EAAGC,IAAQ,CAC3C,IAAMV,EAA6BW,EAClC,KAAO,CAAE,SAAAH,CAAS,GAClB,CAACA,CAAQ,CACV,EAEA,OACCI,EAACf,EAAa,SAAb,CAAsB,MAAOG,EAC7B,SAAAY,EAAC,OACA,IAAKF,EACL,UAAWG,EAAGV,EAAc,CAAE,SAAAK,CAAS,CAAC,EAAGD,CAAS,EACnD,GAAGE,EACL,EACD,CAEF,CACD,EACAJ,EAAM,YAAc,QAYpB,IAAMS,EAAe,CACpB,OAAQF,EAACG,EAAA,EAAY,EACrB,KAAMH,EAACI,EAAA,EAAS,EAEhB,QAASJ,EAACK,EAAA,EAAgB,EAC1B,QAASL,EAACM,EAAA,EAAmB,CAC9B,EAsBMC,EAAYb,EACjB,CAAC,CAAE,UAAAC,EAAW,IAAAa,EAAK,GAAGX,CAAM,EAAGC,IAAQ,CACtC,IAAMW,EAAMtB,EAAgB,EACtBuB,EAAcR,EAAaO,EAAI,QAAQ,EAE7C,OACCT,EAACW,EAAA,CACA,IAAKb,EACL,UAAWG,EAAG,SAAUN,CAAS,EACjC,IAAKa,GAAOE,EACX,GAAGb,EACL,CAEF,CACD,EACAU,EAAU,YAAc,YAoBxB,IAAMK,EAAelB,EACpB,CAAC,CAAE,UAAAC,EAAW,GAAGE,CAAM,EAAGC,IACzBE,EAAC,OAAI,IAAKF,EAAK,UAAWG,EAAG,iBAAkBN,CAAS,EAAI,GAAGE,EAAO,CAExE,EACAe,EAAa,YAAc,eAsB3B,IAAMC,EAAanB,EAClB,CAAC,CAAE,QAAAoB,EAAU,GAAO,UAAAnB,EAAW,GAAGE,CAAM,EAAGC,IAIzCE,EAHiBc,EAAUC,EAAO,KAGjC,CACA,IAAKjB,EACL,UAAWG,EAAG,cAAeN,CAAS,EACrC,GAAGE,EACL,CAGH,EACAgB,EAAW,YAAc,aAsBzB,IAAMG,EAAmBtB,EACxB,CAAC,CAAE,QAAAoB,EAAU,GAAO,UAAAnB,EAAW,GAAGE,CAAM,EAAGC,IAIzCE,EAHiBc,EAAUC,EAAO,IAGjC,CAAU,IAAKjB,EAAK,UAAWG,EAAG,UAAWN,CAAS,EAAI,GAAGE,EAAO,CAGxE,EACAmB,EAAiB,YAAc","names":["CheckCircleIcon","InfoIcon","WarningIcon","WarningDiamondIcon","Slot","cva","createContext","forwardRef","useContext","useMemo","invariant","jsx","AlertContext","createContext","useAlertContext","context","useContext","invariant","alertVariants","cva","Alert","forwardRef","className","priority","props","ref","useMemo","jsx","cx","defaultIcons","WarningIcon","InfoIcon","CheckCircleIcon","WarningDiamondIcon","AlertIcon","svg","ctx","defaultIcon","SvgOnly","AlertContent","AlertTitle","asChild","Slot","AlertDescription"]}
+{"version":3,"sources":["../src/components/alert/alert.tsx"],"sourcesContent":["import { CheckCircleIcon } from \"@phosphor-icons/react/CheckCircle\";\nimport { InfoIcon } from \"@phosphor-icons/react/Info\";\nimport { WarningIcon } from \"@phosphor-icons/react/Warning\";\nimport { WarningDiamondIcon } from \"@phosphor-icons/react/WarningDiamond\";\nimport { XIcon } from \"@phosphor-icons/react/X\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport { cva } from \"class-variance-authority\";\nimport type {\n\tComponentProps,\n\tComponentRef,\n\tHTMLAttributes,\n\tReactNode,\n} from \"react\";\nimport { createContext, forwardRef, useContext, useMemo } from \"react\";\nimport invariant from \"tiny-invariant\";\nimport type { WithAsChild } from \"../../types/index.js\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { IconButton, type IconButtonProps } from \"../button/icon-button.js\";\nimport { SvgOnly } from \"../icon/svg-only.js\";\nimport type { SvgAttributes } from \"../icon/types.js\";\n\nconst priorities = [\n\t//,\n\t\"danger\",\n\t\"info\",\n\t// \"neutral\",\n\t\"success\",\n\t\"warning\",\n] as const;\ntype Priority = (typeof priorities)[number];\n\ntype AlertContextValue = {\n\tpriority: Priority;\n};\n\nconst AlertContext = createContext<AlertContextValue | null>(null);\n\nfunction useAlertContext() {\n\tconst context = useContext(AlertContext);\n\tinvariant(context, \"useAlertContext hook used outside of Alert parent!\");\n\treturn context;\n}\n\nconst alertVariants = cva(\n\t\"relative flex w-full gap-1.5 rounded-md border p-2.5 text-sm\",\n\t{\n\t\tvariants: {\n\t\t\t/**\n\t\t\t * The priority of the Alert. Indicates the importance or impact level of the Alert,\n\t\t\t * affecting its color and styling to communicate its purpose to the user.\n\t\t\t */\n\t\t\tpriority: {\n\t\t\t\tdanger: \"border-danger-500/50 bg-danger-500/10 text-danger-700\",\n\t\t\t\tinfo: \"border-accent-500/50 bg-accent-500/10 text-accent-700\",\n\t\t\t\t// neutral: \"border-neutral-500/50 bg-neutral-500/10 text-neutral-700\",\n\t\t\t\tsuccess: \"border-success-500/50 bg-success-500/10 text-success-700\",\n\t\t\t\twarning: \"border-warning-500/50 bg-warning-500/10 text-warning-700\",\n\t\t\t} as const satisfies Record<Priority, string>,\n\t\t},\n\t},\n);\n\ntype AlertProps = ComponentProps<\"div\"> & {\n\t/**\n\t * Indicates the importance or impact level of the Alert, affecting its\n\t * color and styling to communicate its purpose to the user.\n\t */\n\tpriority: Priority;\n};\n\n/**\n * Displays a callout for user attention. Root container for all Alert sub-components.\n *\n * @see https://mantle.ngrok.com/components/alert#api-alert\n *\n * @example\n * ```tsx\n * <Alert priority=\"info\">\n *   <AlertIcon />\n *   <AlertContent>\n *     <AlertTitle>Alert Title</AlertTitle>\n * \t   <AlertDismissIconButton />\n *     <AlertDescription>\n *       Alert description text.\n *     </AlertDescription>\n *   </AlertContent>\n * </Alert>\n *```\n */\nconst Alert = forwardRef<ComponentRef<\"div\">, AlertProps>(\n\t({ className, priority, ...props }, ref) => {\n\t\tconst context: AlertContextValue = useMemo(\n\t\t\t() => ({ priority }),\n\t\t\t[priority],\n\t\t);\n\n\t\treturn (\n\t\t\t<AlertContext.Provider value={context}>\n\t\t\t\t<div\n\t\t\t\t\tref={ref}\n\t\t\t\t\tclassName={cx(alertVariants({ priority }), className)}\n\t\t\t\t\t{...props}\n\t\t\t\t/>\n\t\t\t</AlertContext.Provider>\n\t\t);\n\t},\n);\nAlert.displayName = \"Alert\";\n\ntype AlertIconProps = Omit<SvgAttributes, \"children\"> & {\n\t/**\n\t * An optional icon that renders in place of the default icon for the Alert priority.\n\t */\n\tsvg?: ReactNode;\n};\n\n/**\n * Default `<AlertIcon>` icons for each priority.\n */\nconst defaultIcons = {\n\tdanger: <WarningIcon />,\n\tinfo: <InfoIcon />,\n\t// neutral: <BellRinging />,\n\tsuccess: <CheckCircleIcon />,\n\twarning: <WarningDiamondIcon />,\n} as const satisfies Record<Priority, ReactNode>;\n\n/**\n * An optional icon that visually represents the priority of the Alert.\n *\n * The default rendered icon be overridden with a custom icon using the `svg` prop.\n *\n * @see https://mantle.ngrok.com/components/alert#api-alert-icon\n *\n * @example\n * ```tsx\n * <Alert priority=\"info\">\n *   <AlertIcon />\n *   <AlertContent>\n *     <AlertTitle>Alert Title</AlertTitle>\n *     <AlertDismissIconButton />\n *     <AlertDescription>\n *       Alert description text.\n *     </AlertDescription>\n *   </AlertContent>\n * </Alert>\n * ```\n */\nconst AlertIcon = forwardRef<ComponentRef<\"svg\">, AlertIconProps>(\n\t({ className, svg, ...props }, ref) => {\n\t\tconst ctx = useAlertContext();\n\t\tconst defaultIcon = defaultIcons[ctx.priority];\n\n\t\treturn (\n\t\t\t<SvgOnly\n\t\t\t\tref={ref}\n\t\t\t\tclassName={cx(\"size-5\", className)}\n\t\t\t\tsvg={svg ?? defaultIcon}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t);\n\t},\n);\nAlertIcon.displayName = \"AlertIcon\";\n\n/**\n * The container for the content slot of an alert. Place the title and description as direct children.\n *\n * @see https://mantle.ngrok.com/components/alert#api-alert-content\n *\n * @example\n * ```tsx\n * <Alert priority=\"info\">\n *   <AlertIcon />\n *   <AlertContent>\n *     <AlertTitle>Alert Title</AlertTitle>\n *     <AlertDismissIconButton />\n *     <AlertDescription>\n *       Alert description text.\n *     </AlertDescription>\n *   </AlertContent>\n * </Alert>\n *```\n */\nconst AlertContent = forwardRef<ComponentRef<\"div\">, ComponentProps<\"div\">>(\n\t({ className, ...props }, ref) => (\n\t\t<div\n\t\t\tref={ref}\n\t\t\tclassName={cx(\n\t\t\t\t\"min-w-0 flex-1 has-[[data-alert-dismiss]]:pr-6\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t),\n);\nAlertContent.displayName = \"AlertContent\";\n\ntype AlertTitleProps = HTMLAttributes<HTMLHeadingElement> & WithAsChild;\n\n/**\n * The title of an alert. Default renders as an h5 element, use asChild to render something else.\n *\n * @see https://mantle.ngrok.com/components/alert#api-alert-title\n *\n * @example\n * ```tsx\n * <Alert priority=\"info\">\n *   <AlertIcon />\n *   <AlertContent>\n *     <AlertTitle>Alert Title</AlertTitle>\n *     <AlertDismissIconButton />\n *     <AlertDescription>\n *       Alert description text.\n *     </AlertDescription>\n *   </AlertContent>\n * </Alert>\n *```\n */\nconst AlertTitle = forwardRef<HTMLHeadingElement, AlertTitleProps>(\n\t({ asChild = false, className, ...props }, ref) => {\n\t\tconst Component = asChild ? Slot : \"h5\";\n\n\t\treturn (\n\t\t\t<Component\n\t\t\t\tref={ref}\n\t\t\t\tclassName={cx(\"font-medium\", className)}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t);\n\t},\n);\nAlertTitle.displayName = \"AlertTitle\";\n\ntype AlertDescriptionProps = ComponentProps<\"p\"> & WithAsChild;\n\n/**\n * The optional description of an alert. Default renders as an p element, use asChild to render something else.\n *\n * @see https://mantle.ngrok.com/components/alert#api-alert-description\n *\n * @example\n * ```tsx\n * <Alert priority=\"info\">\n *   <AlertIcon />\n *   <AlertContent>\n *     <AlertTitle>Alert Title</AlertTitle>\n *     <AlertDismissIconButton />\n *     <AlertDescription>\n *       Alert description text.\n *     </AlertDescription>\n *   </AlertContent>\n * </Alert>\n * ```\n */\nconst AlertDescription = forwardRef<ComponentRef<\"p\">, AlertDescriptionProps>(\n\t({ asChild = false, className, ...props }, ref) => {\n\t\tconst Component = asChild ? Slot : \"p\";\n\n\t\treturn (\n\t\t\t<Component ref={ref} className={cx(\"text-sm\", className)} {...props} />\n\t\t);\n\t},\n);\nAlertDescription.displayName = \"AlertDescription\";\n\ntype AlertDismissIconButtonProps = Partial<Omit<IconButtonProps, \"icon\">>;\nconst AlertDismissIconButton = ({\n\tsize = \"sm\",\n\ttype = \"button\",\n\tlabel = \"Dismiss Alert\",\n\tappearance = \"ghost\",\n\tclassName,\n\t...props\n}: AlertDismissIconButtonProps) => {\n\tconst ctx = useAlertContext();\n\treturn (\n\t\t<IconButton\n\t\t\tappearance={appearance}\n\t\t\ticon={<XIcon />}\n\t\t\tlabel={label}\n\t\t\tsize={size}\n\t\t\tdata-alert-dismiss\n\t\t\tclassName={cx(\n\t\t\t\t\"right-1.5 top-1.5 absolute\",\n\t\t\t\t{\n\t\t\t\t\t\"text-danger-700 not-disabled:hover:text-danger-800 not-disabled:active:text-danger-900\":\n\t\t\t\t\t\tctx.priority === \"danger\",\n\t\t\t\t\t\"text-accent-700 not-disabled:hover:text-accent-800 not-disabled:active:text-accent-900\":\n\t\t\t\t\t\tctx.priority === \"info\",\n\t\t\t\t\t\"text-success-700 not-disabled:hover:text-success-800 not-disabled:active:text-success-900\":\n\t\t\t\t\t\tctx.priority === \"success\",\n\t\t\t\t\t\"text-warning-700 not-disabled:hover:text-warning-800 not-disabled:active:text-warning-900\":\n\t\t\t\t\t\tctx.priority === \"warning\",\n\t\t\t\t},\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\ttype={type}\n\t\t\t{...props}\n\t\t/>\n\t);\n};\n\nexport {\n\t//,\n\tAlert,\n\tAlertContent,\n\tAlertDescription,\n\tAlertIcon,\n\tAlertTitle,\n\tAlertDismissIconButton,\n};\n"],"mappings":"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","names":["CheckCircleIcon","InfoIcon","WarningIcon","WarningDiamondIcon","XIcon","Slot","cva","createContext","forwardRef","useContext","useMemo","invariant","jsx","AlertContext","createContext","useAlertContext","context","useContext","invariant","alertVariants","cva","Alert","forwardRef","className","priority","props","ref","useMemo","jsx","cx","defaultIcons","WarningIcon","InfoIcon","CheckCircleIcon","WarningDiamondIcon","AlertIcon","svg","ctx","defaultIcon","SvgOnly","AlertContent","AlertTitle","asChild","Slot","AlertDescription","AlertDismissIconButton","size","type","label","appearance","IconButton","XIcon"]}

package/dist/anchor.js

@@ -1,2 +1,2 @@
-import{a as n}from"./chunk-QG5E42M3.js";import"./chunk-HDPLH5HC.js";import{a as m}from"./chunk-AZ56JGNY.js";import{Slot as y}from"@radix-ui/react-slot";import{Children as b,cloneElement as v,forwardRef as N,isValidElement as C}from"react";import x from"tiny-invariant";import{Fragment as T,jsx as t,jsxs as p}from"react/jsx-runtime";var d=r=>m("cursor-pointer rounded bg-transparent text-accent-600 hover:underline focus:outline-none focus-visible:ring focus-visible:ring-focus-accent",r),u=N(({asChild:r,children:s,className:a,rel:l,icon:e,iconPlacement:o="start",...h},g)=>{let A=f(l),c={className:d(a),ref:g,rel:A,...h};if(r){let i=b.only(s);x(C(i),"When using `asChild`, Anchor must be passed a single child as a JSX tag.");let R=i.props?.children;return t(y,{...c,children:v(i,{},p(T,{children:[e&&o==="start"&&t(n,{className:"inline-block mr-1.5",svg:e}),R,e&&o==="end"&&t(n,{className:"inline-block ml-1.5",svg:e})]}))})}return p("a",{...c,children:[e&&o==="start"&&t(n,{className:"inline-block mr-1.5",svg:e}),s,e&&o==="end"&&t(n,{className:"inline-block ml-1.5",svg:e})]})});u.displayName="Anchor";function f(r){return Array.isArray(r)?[...new Set(r)].map(l=>l?.trim()).filter(Boolean).sort().join(" ")||void 0:r?.trim()||void 0}export{u as Anchor,d as anchorClassNames,f as resolveRel};
+import{a as n}from"./chunk-XQVVOOLT.js";import"./chunk-HDPLH5HC.js";import{a as m}from"./chunk-AZ56JGNY.js";import{Slot as y}from"@radix-ui/react-slot";import{Children as b,cloneElement as v,forwardRef as N,isValidElement as C}from"react";import x from"tiny-invariant";import{Fragment as T,jsx as t,jsxs as p}from"react/jsx-runtime";var d=r=>m("cursor-pointer rounded bg-transparent text-accent-600 hover:underline focus:outline-none focus-visible:ring focus-visible:ring-focus-accent",r),u=N(({asChild:r,children:s,className:a,rel:l,icon:e,iconPlacement:o="start",...h},g)=>{let A=f(l),c={className:d(a),ref:g,rel:A,...h};if(r){let i=b.only(s);x(C(i),"When using `asChild`, Anchor must be passed a single child as a JSX tag.");let R=i.props?.children;return t(y,{...c,children:v(i,{},p(T,{children:[e&&o==="start"&&t(n,{className:"inline-block mr-1.5",svg:e}),R,e&&o==="end"&&t(n,{className:"inline-block ml-1.5",svg:e})]}))})}return p("a",{...c,children:[e&&o==="start"&&t(n,{className:"inline-block mr-1.5",svg:e}),s,e&&o==="end"&&t(n,{className:"inline-block ml-1.5",svg:e})]})});u.displayName="Anchor";function f(r){return Array.isArray(r)?[...new Set(r)].map(l=>l?.trim()).filter(Boolean).sort().join(" ")||void 0:r?.trim()||void 0}export{u as Anchor,d as anchorClassNames,f as resolveRel};
 //# sourceMappingURL=anchor.js.map

package/dist/button.js

@@ -1,2 +1,2 @@
-import{a as c}from"./chunk-7XIZZ4HQ.js";import{a as b}from"./chunk-IXWMMIAF.js";import{b as a}from"./chunk-WFZS67BK.js";import"./chunk-4LSFAAZW.js";import"./chunk-3C5O3AQA.js";import"./chunk-72TJUKMV.js";import"./chunk-QG5E42M3.js";import"./chunk-HDPLH5HC.js";import"./chunk-AZ56JGNY.js";export{a as Button,c as ButtonGroup,b as IconButton};
+import{a as c}from"./chunk-7XIZZ4HQ.js";import{a}from"./chunk-BK4P33ZH.js";import{b}from"./chunk-VTCWSFFJ.js";import"./chunk-4LSFAAZW.js";import"./chunk-3C5O3AQA.js";import"./chunk-72TJUKMV.js";import"./chunk-XQVVOOLT.js";import"./chunk-HDPLH5HC.js";import"./chunk-AZ56JGNY.js";export{b as Button,c as ButtonGroup,a as IconButton};
 //# sourceMappingURL=button.js.map

package/dist/calendar.js

@@ -1,2 +1,2 @@
-import{a}from"./chunk-WFZS67BK.js";import"./chunk-4LSFAAZW.js";import"./chunk-3C5O3AQA.js";import"./chunk-72TJUKMV.js";import{a as o}from"./chunk-QG5E42M3.js";import"./chunk-HDPLH5HC.js";import{a as e}from"./chunk-AZ56JGNY.js";import{CaretLeft as m}from"@phosphor-icons/react/CaretLeft";import{CaretRight as p}from"@phosphor-icons/react/CaretRight";import{DayPicker as f}from"react-day-picker";import{jsx as t}from"react/jsx-runtime";function n({className:d,classNames:i,showOutsideDays:l=!1,...r}){return t(f,{animate:!1,components:{Chevron:s=>{let c=s.orientation==="left"?t(m,{}):t(p,{});return t(o,{svg:c,className:"size-4"})}},classNames:{root:e("isolate",d),button_next:e(a({appearance:"ghost",priority:"neutral"}),"size-7 absolute right-0"),button_previous:e(a({appearance:"ghost",priority:"neutral"}),"size-7 absolute left-0"),caption_label:"text-sm font-medium",day:e("overflow-hidden text-center text-sm p-0 relative focus-within:relative focus-within:z-20 size-7 rounded-md",r.mode==="range"?"first:[&:has([aria-selected])]:rounded-l-md last:[&:has([aria-selected])]:rounded-r-md":""),day_button:"day size-full rounded-md [&:not([aria-selected],[disabled])]:hover:bg-filled-accent/15",disabled:"text-muted opacity-50",hidden:"invisible",month:"space-y-4",month_caption:"flex justify-center pt-1 relative items-center",month_grid:"w-full border-collapse space-y-1",months:"flex flex-col sm:flex-row gap-y-4 sm:gap-x-4 sm:gap-y-0 relative max-w-min",nav:"flex items-center absolute inset-x-0 top-1 h-5 justify-between z-10",outside:"day-outside aria-selected:text-on-filled opacity-50 text-muted",range_end:"day-range-end [&:not(.day-range-start)]:rounded-l-none",range_middle:"day-range-middle [&:not([disabled])]:aria-selected:bg-filled-accent/15 aria-selected:text-strong rounded-none [&:not([disabled])]:aria-selected:hover:bg-filled-accent/25",range_start:"day-range-start [&:not(.day-range-end)]:rounded-r-none",selected:"[&:not([disabled])]:bg-filled-accent text-on-filled [&:not([disabled])]:hover:bg-filled-accent",today:"[&:not([aria-selected],_[disabled])]:text-accent-600 font-medium [&:not([aria-selected],_[disabled])]:bg-filled-accent/10 rounded-md",week:"flex w-full mt-1",weekday:"text-body w-7 text-[0.8rem] text-center font-normal",weekdays:"flex",...i},showOutsideDays:l,...r})}n.displayName="Calendar";export{n as Calendar};
+import{a}from"./chunk-VTCWSFFJ.js";import"./chunk-4LSFAAZW.js";import"./chunk-3C5O3AQA.js";import"./chunk-72TJUKMV.js";import{a as r}from"./chunk-XQVVOOLT.js";import"./chunk-HDPLH5HC.js";import{a as e}from"./chunk-AZ56JGNY.js";import{CaretLeftIcon as m}from"@phosphor-icons/react/CaretLeft";import{CaretRightIcon as p}from"@phosphor-icons/react/CaretRight";import{DayPicker as f}from"react-day-picker";import{jsx as t}from"react/jsx-runtime";function n({className:d,classNames:i,showOutsideDays:l=!1,...o}){return t(f,{animate:!1,components:{Chevron:s=>{let c=s.orientation==="left"?t(m,{}):t(p,{});return t(r,{svg:c,className:"size-4"})}},classNames:{root:e("isolate",d),button_next:e(a({appearance:"ghost",priority:"neutral"}),"size-7 absolute right-0"),button_previous:e(a({appearance:"ghost",priority:"neutral"}),"size-7 absolute left-0"),caption_label:"text-sm font-medium",day:e("overflow-hidden text-center text-sm p-0 relative focus-within:relative focus-within:z-20 size-7 rounded-md",o.mode==="range"?"first:[&:has([aria-selected])]:rounded-l-md last:[&:has([aria-selected])]:rounded-r-md":""),day_button:"day size-full rounded-md [&:not([aria-selected],[disabled])]:hover:bg-filled-accent/15",disabled:"text-muted opacity-50",hidden:"invisible",month:"space-y-4",month_caption:"flex justify-center pt-1 relative items-center",month_grid:"w-full border-collapse space-y-1",months:"flex flex-col sm:flex-row gap-y-4 sm:gap-x-4 sm:gap-y-0 relative max-w-min",nav:"flex items-center absolute inset-x-0 top-1 h-5 justify-between z-10",outside:"day-outside aria-selected:text-on-filled opacity-50 text-muted",range_end:"day-range-end [&:not(.day-range-start)]:rounded-l-none",range_middle:"day-range-middle [&:not([disabled])]:aria-selected:bg-filled-accent/15 aria-selected:text-strong rounded-none [&:not([disabled])]:aria-selected:hover:bg-filled-accent/25",range_start:"day-range-start [&:not(.day-range-end)]:rounded-r-none",selected:"[&:not([disabled])]:bg-filled-accent text-on-filled [&:not([disabled])]:hover:bg-filled-accent",today:"[&:not([aria-selected],_[disabled])]:text-accent-600 font-medium [&:not([aria-selected],_[disabled])]:bg-filled-accent/10 rounded-md",week:"flex w-full mt-1",weekday:"text-body w-7 text-[0.8rem] text-center font-normal",weekdays:"flex",...i},showOutsideDays:l,...o})}n.displayName="Calendar";export{n as Calendar};
 //# sourceMappingURL=calendar.js.map

package/dist/calendar.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/calendar/calendar.tsx"],"sourcesContent":["\"use client\";\n\nimport { CaretLeft as CaretLeftIcon } from \"@phosphor-icons/react/CaretLeft\";\nimport { CaretRight as CaretRightIcon } from \"@phosphor-icons/react/CaretRight\";\nimport type { ComponentProps } from \"react\";\nimport { DayPicker } from \"react-day-picker\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { buttonVariants } from \"../button/button.js\";\nimport { Icon } from \"../icon/icon.js\";\n\ntype CalendarProps = ComponentProps<typeof DayPicker>;\n\n/**\n * A calendar component that allows users to select a date or a range of dates.\n *\n * @preview This component is in `preview` mode which means the API is not stable and may change.\n * There may also be bugs! Please file an issue if you find any! <3\n *\n * https://github.com/ngrok-oss/mantle/issues\n */\nfunction Calendar({\n\tclassName,\n\tclassNames,\n\tshowOutsideDays = false,\n\t...props\n}: CalendarProps) {\n\treturn (\n\t\t<DayPicker\n\t\t\tanimate={false}\n\t\t\tcomponents={{\n\t\t\t\tChevron: (iconProps) => {\n\t\t\t\t\tconst icon =\n\t\t\t\t\t\ticonProps.orientation === \"left\" ? (\n\t\t\t\t\t\t\t<CaretLeftIcon />\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<CaretRightIcon />\n\t\t\t\t\t\t);\n\n\t\t\t\t\treturn <Icon svg={icon} className=\"size-4\" />;\n\t\t\t\t},\n\t\t\t}}\n\t\t\tclassNames={{\n\t\t\t\troot: cx(\"isolate\", className),\n\t\t\t\tbutton_next: cx(\n\t\t\t\t\tbuttonVariants({ appearance: \"ghost\", priority: \"neutral\" }),\n\t\t\t\t\t\"size-7 absolute right-0\",\n\t\t\t\t),\n\t\t\t\tbutton_previous: cx(\n\t\t\t\t\tbuttonVariants({ appearance: \"ghost\", priority: \"neutral\" }),\n\t\t\t\t\t\"size-7 absolute left-0\",\n\t\t\t\t),\n\t\t\t\tcaption_label: \"text-sm font-medium\",\n\t\t\t\tday: cx(\n\t\t\t\t\t\"overflow-hidden text-center text-sm p-0 relative focus-within:relative focus-within:z-20 size-7 rounded-md\",\n\t\t\t\t\tprops.mode === \"range\"\n\t\t\t\t\t\t? \"first:[&:has([aria-selected])]:rounded-l-md last:[&:has([aria-selected])]:rounded-r-md\"\n\t\t\t\t\t\t: \"\",\n\t\t\t\t),\n\t\t\t\tday_button:\n\t\t\t\t\t\"day size-full rounded-md [&:not([aria-selected],[disabled])]:hover:bg-filled-accent/15\",\n\t\t\t\tdisabled: \"text-muted opacity-50\",\n\t\t\t\thidden: \"invisible\",\n\t\t\t\tmonth: \"space-y-4\",\n\t\t\t\tmonth_caption: \"flex justify-center pt-1 relative items-center\",\n\t\t\t\tmonth_grid: \"w-full border-collapse space-y-1\",\n\t\t\t\tmonths:\n\t\t\t\t\t\"flex flex-col sm:flex-row gap-y-4 sm:gap-x-4 sm:gap-y-0 relative max-w-min\",\n\t\t\t\tnav: \"flex items-center absolute inset-x-0 top-1 h-5 justify-between z-10\",\n\t\t\t\toutside:\n\t\t\t\t\t\"day-outside aria-selected:text-on-filled opacity-50 text-muted\",\n\t\t\t\trange_end: \"day-range-end [&:not(.day-range-start)]:rounded-l-none\",\n\t\t\t\trange_middle:\n\t\t\t\t\t\"day-range-middle [&:not([disabled])]:aria-selected:bg-filled-accent/15 aria-selected:text-strong rounded-none [&:not([disabled])]:aria-selected:hover:bg-filled-accent/25\",\n\t\t\t\trange_start: \"day-range-start [&:not(.day-range-end)]:rounded-r-none\",\n\t\t\t\tselected:\n\t\t\t\t\t\"[&:not([disabled])]:bg-filled-accent text-on-filled [&:not([disabled])]:hover:bg-filled-accent\",\n\t\t\t\ttoday:\n\t\t\t\t\t\"[&:not([aria-selected],_[disabled])]:text-accent-600 font-medium [&:not([aria-selected],_[disabled])]:bg-filled-accent/10 rounded-md\",\n\t\t\t\tweek: \"flex w-full mt-1\",\n\t\t\t\tweekday: \"text-body w-7 text-[0.8rem] text-center font-normal\",\n\t\t\t\tweekdays: \"flex\",\n\t\t\t\t...classNames,\n\t\t\t}}\n\t\t\tshowOutsideDays={showOutsideDays}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\nCalendar.displayName = \"Calendar\";\n\nexport {\n\t//,\n\tCalendar,\n};\n\nexport type {\n\t//,\n\tCalendarProps,\n};\n\nexport type {\n\t//,\n\tDateRange,\n} from \"react-day-picker\";\n"],"mappings":"mOAEA,OAAS,aAAaA,MAAqB,kCAC3C,OAAS,cAAcC,MAAsB,mCAE7C,OAAS,aAAAC,MAAiB,mBA4BnB,cAAAC,MAAA,oBAbP,SAASC,EAAS,CACjB,UAAAC,EACA,WAAAC,EACA,gBAAAC,EAAkB,GAClB,GAAGC,CACJ,EAAkB,CACjB,OACCL,EAACM,EAAA,CACA,QAAS,GACT,WAAY,CACX,QAAUC,GAAc,CACvB,IAAMC,EACLD,EAAU,cAAgB,OACzBP,EAACS,EAAA,EAAc,EAEfT,EAACU,EAAA,EAAe,EAGlB,OAAOV,EAACW,EAAA,CAAK,IAAKH,EAAM,UAAU,SAAS,CAC5C,CACD,EACA,WAAY,CACX,KAAMI,EAAG,UAAWV,CAAS,EAC7B,YAAaU,EACZC,EAAe,CAAE,WAAY,QAAS,SAAU,SAAU,CAAC,EAC3D,yBACD,EACA,gBAAiBD,EAChBC,EAAe,CAAE,WAAY,QAAS,SAAU,SAAU,CAAC,EAC3D,wBACD,EACA,cAAe,sBACf,IAAKD,EACJ,6GACAP,EAAM,OAAS,QACZ,yFACA,EACJ,EACA,WACC,yFACD,SAAU,wBACV,OAAQ,YACR,MAAO,YACP,cAAe,iDACf,WAAY,mCACZ,OACC,6EACD,IAAK,sEACL,QACC,iEACD,UAAW,yDACX,aACC,4KACD,YAAa,yDACb,SACC,iGACD,MACC,uIACD,KAAM,mBACN,QAAS,sDACT,SAAU,OACV,GAAGF,CACJ,EACA,gBAAiBC,EAChB,GAAGC,EACL,CAEF,CACAJ,EAAS,YAAc","names":["CaretLeftIcon","CaretRightIcon","DayPicker","jsx","Calendar","className","classNames","showOutsideDays","props","DayPicker","iconProps","icon","CaretLeftIcon","CaretRightIcon","Icon","cx","buttonVariants"]}
+{"version":3,"sources":["../src/components/calendar/calendar.tsx"],"sourcesContent":["\"use client\";\n\nimport { CaretLeftIcon } from \"@phosphor-icons/react/CaretLeft\";\nimport { CaretRightIcon } from \"@phosphor-icons/react/CaretRight\";\nimport type { ComponentProps } from \"react\";\nimport { DayPicker } from \"react-day-picker\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { buttonVariants } from \"../button/button.js\";\nimport { Icon } from \"../icon/icon.js\";\n\ntype CalendarProps = ComponentProps<typeof DayPicker>;\n\n/**\n * A calendar component that allows users to select a date or a range of dates.\n *\n * @preview This component is in `preview` mode which means the API is not stable and may change.\n * There may also be bugs! Please file an issue if you find any! <3\n *\n * https://github.com/ngrok-oss/mantle/issues\n */\nfunction Calendar({\n\tclassName,\n\tclassNames,\n\tshowOutsideDays = false,\n\t...props\n}: CalendarProps) {\n\treturn (\n\t\t<DayPicker\n\t\t\tanimate={false}\n\t\t\tcomponents={{\n\t\t\t\tChevron: (iconProps) => {\n\t\t\t\t\tconst icon =\n\t\t\t\t\t\ticonProps.orientation === \"left\" ? (\n\t\t\t\t\t\t\t<CaretLeftIcon />\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<CaretRightIcon />\n\t\t\t\t\t\t);\n\n\t\t\t\t\treturn <Icon svg={icon} className=\"size-4\" />;\n\t\t\t\t},\n\t\t\t}}\n\t\t\tclassNames={{\n\t\t\t\troot: cx(\"isolate\", className),\n\t\t\t\tbutton_next: cx(\n\t\t\t\t\tbuttonVariants({ appearance: \"ghost\", priority: \"neutral\" }),\n\t\t\t\t\t\"size-7 absolute right-0\",\n\t\t\t\t),\n\t\t\t\tbutton_previous: cx(\n\t\t\t\t\tbuttonVariants({ appearance: \"ghost\", priority: \"neutral\" }),\n\t\t\t\t\t\"size-7 absolute left-0\",\n\t\t\t\t),\n\t\t\t\tcaption_label: \"text-sm font-medium\",\n\t\t\t\tday: cx(\n\t\t\t\t\t\"overflow-hidden text-center text-sm p-0 relative focus-within:relative focus-within:z-20 size-7 rounded-md\",\n\t\t\t\t\tprops.mode === \"range\"\n\t\t\t\t\t\t? \"first:[&:has([aria-selected])]:rounded-l-md last:[&:has([aria-selected])]:rounded-r-md\"\n\t\t\t\t\t\t: \"\",\n\t\t\t\t),\n\t\t\t\tday_button:\n\t\t\t\t\t\"day size-full rounded-md [&:not([aria-selected],[disabled])]:hover:bg-filled-accent/15\",\n\t\t\t\tdisabled: \"text-muted opacity-50\",\n\t\t\t\thidden: \"invisible\",\n\t\t\t\tmonth: \"space-y-4\",\n\t\t\t\tmonth_caption: \"flex justify-center pt-1 relative items-center\",\n\t\t\t\tmonth_grid: \"w-full border-collapse space-y-1\",\n\t\t\t\tmonths:\n\t\t\t\t\t\"flex flex-col sm:flex-row gap-y-4 sm:gap-x-4 sm:gap-y-0 relative max-w-min\",\n\t\t\t\tnav: \"flex items-center absolute inset-x-0 top-1 h-5 justify-between z-10\",\n\t\t\t\toutside:\n\t\t\t\t\t\"day-outside aria-selected:text-on-filled opacity-50 text-muted\",\n\t\t\t\trange_end: \"day-range-end [&:not(.day-range-start)]:rounded-l-none\",\n\t\t\t\trange_middle:\n\t\t\t\t\t\"day-range-middle [&:not([disabled])]:aria-selected:bg-filled-accent/15 aria-selected:text-strong rounded-none [&:not([disabled])]:aria-selected:hover:bg-filled-accent/25\",\n\t\t\t\trange_start: \"day-range-start [&:not(.day-range-end)]:rounded-r-none\",\n\t\t\t\tselected:\n\t\t\t\t\t\"[&:not([disabled])]:bg-filled-accent text-on-filled [&:not([disabled])]:hover:bg-filled-accent\",\n\t\t\t\ttoday:\n\t\t\t\t\t\"[&:not([aria-selected],_[disabled])]:text-accent-600 font-medium [&:not([aria-selected],_[disabled])]:bg-filled-accent/10 rounded-md\",\n\t\t\t\tweek: \"flex w-full mt-1\",\n\t\t\t\tweekday: \"text-body w-7 text-[0.8rem] text-center font-normal\",\n\t\t\t\tweekdays: \"flex\",\n\t\t\t\t...classNames,\n\t\t\t}}\n\t\t\tshowOutsideDays={showOutsideDays}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\nCalendar.displayName = \"Calendar\";\n\nexport {\n\t//,\n\tCalendar,\n};\n\nexport type {\n\t//,\n\tCalendarProps,\n};\n\nexport type {\n\t//,\n\tDateRange,\n} from \"react-day-picker\";\n"],"mappings":"mOAEA,OAAS,iBAAAA,MAAqB,kCAC9B,OAAS,kBAAAC,MAAsB,mCAE/B,OAAS,aAAAC,MAAiB,mBA4BnB,cAAAC,MAAA,oBAbP,SAASC,EAAS,CACjB,UAAAC,EACA,WAAAC,EACA,gBAAAC,EAAkB,GAClB,GAAGC,CACJ,EAAkB,CACjB,OACCL,EAACM,EAAA,CACA,QAAS,GACT,WAAY,CACX,QAAUC,GAAc,CACvB,IAAMC,EACLD,EAAU,cAAgB,OACzBP,EAACS,EAAA,EAAc,EAEfT,EAACU,EAAA,EAAe,EAGlB,OAAOV,EAACW,EAAA,CAAK,IAAKH,EAAM,UAAU,SAAS,CAC5C,CACD,EACA,WAAY,CACX,KAAMI,EAAG,UAAWV,CAAS,EAC7B,YAAaU,EACZC,EAAe,CAAE,WAAY,QAAS,SAAU,SAAU,CAAC,EAC3D,yBACD,EACA,gBAAiBD,EAChBC,EAAe,CAAE,WAAY,QAAS,SAAU,SAAU,CAAC,EAC3D,wBACD,EACA,cAAe,sBACf,IAAKD,EACJ,6GACAP,EAAM,OAAS,QACZ,yFACA,EACJ,EACA,WACC,yFACD,SAAU,wBACV,OAAQ,YACR,MAAO,YACP,cAAe,iDACf,WAAY,mCACZ,OACC,6EACD,IAAK,sEACL,QACC,iEACD,UAAW,yDACX,aACC,4KACD,YAAa,yDACb,SACC,iGACD,MACC,uIACD,KAAM,mBACN,QAAS,sDACT,SAAU,OACV,GAAGF,CACJ,EACA,gBAAiBC,EAChB,GAAGC,EACL,CAEF,CACAJ,EAAS,YAAc","names":["CaretLeftIcon","CaretRightIcon","DayPicker","jsx","Calendar","className","classNames","showOutsideDays","props","DayPicker","iconProps","icon","CaretLeftIcon","CaretRightIcon","Icon","cx","buttonVariants"]}

package/dist/chunk-2PHWBRBD.js

@@ -0,0 +1,2 @@
+import{m as r}from"./chunk-GYPSB3OK.js";import{SortAscendingIcon as o}from"@phosphor-icons/react/SortAscending";import{SortDescendingIcon as n}from"@phosphor-icons/react/SortDescending";import{jsx as i}from"react/jsx-runtime";var s=({mode:c,direction:t,...e})=>{switch(c){case"alphanumeric":switch(t){case"asc":return i(o,{...e});case"desc":return i(n,{...e});default:throw new Error(`Invalid alphanumeric sorting direction given: "${t}"`)}case"time":switch(r(t)){case"oldest-to-newest":return i(n,{...e});case"newest-to-oldest":return i(o,{...e});default:throw new Error(`Invalid time sorting direction given: "${t}"`)}}};s.displayName="SortIcon";export{s as a};
+//# sourceMappingURL=chunk-2PHWBRBD.js.map

package/dist/chunk-2PHWBRBD.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/icons/sort.tsx"],"sourcesContent":["import { SortAscendingIcon } from \"@phosphor-icons/react/SortAscending\";\nimport { SortDescendingIcon } from \"@phosphor-icons/react/SortDescending\";\nimport {\n\t$timeSortingDirection,\n\ttype AlphanumericSortingDirection,\n\ttype SortingDirection,\n\ttype SortingMode,\n\ttype TimeSortingDirection,\n} from \"../../utils/sorting/direction.js\";\nimport type { SvgAttributes } from \"../icon/types.js\";\n\ntype Props = SvgAttributes &\n\t(\n\t\t| {\n\t\t\t\tmode: Extract<SortingMode, \"alphanumeric\">;\n\t\t\t\t/**\n\t\t\t\t * Sort by alphanumeric order in \"ascending\" (asc) or \"descending\" (desc) order.\n\t\t\t\t * @example \"asc\" for A-Z, 0-9\n\t\t\t\t * @example \"desc\" for Z-A, 0-9\n\t\t\t\t */\n\t\t\t\tdirection: AlphanumericSortingDirection;\n\t\t  }\n\t\t| {\n\t\t\t\tmode: Extract<SortingMode, \"time\">;\n\t\t\t\t/**\n\t\t\t\t * Sort by time in \"newest-to-oldest\" (descending, desc) or \"oldest-to-newest\" (ascending, asc) order.\n\t\t\t\t * @example \"newest-to-oldest\" for newest first (aka descending, desc)\n\t\t\t\t * @example \"oldest-to-newest\" for oldest first (aka ascending, asc)\n\t\t\t\t */\n\t\t\t\tdirection: TimeSortingDirection | SortingDirection;\n\t\t  }\n\t);\n\n/**\n * A sorting icon that can be used to indicate the sorting direction of a table column or list.\n * It is aware of the sorting mode (alphanumeric or time) and the sorting direction (ascending or descending).\n */\nconst SortIcon = ({ mode, direction, ...props }: Props) => {\n\tswitch (mode) {\n\t\tcase \"alphanumeric\": {\n\t\t\tswitch (direction) {\n\t\t\t\tcase \"asc\":\n\t\t\t\t\treturn <SortAscendingIcon {...props} />;\n\t\t\t\tcase \"desc\":\n\t\t\t\t\treturn <SortDescendingIcon {...props} />;\n\t\t\t\tdefault:\n\t\t\t\t\tthrow new Error(\n\t\t\t\t\t\t`Invalid alphanumeric sorting direction given: \"${direction}\"`,\n\t\t\t\t\t);\n\t\t\t}\n\t\t}\n\t\tcase \"time\": {\n\t\t\tconst timeSortingDirection = $timeSortingDirection(direction);\n\n\t\t\tswitch (timeSortingDirection) {\n\t\t\t\tcase \"oldest-to-newest\":\n\t\t\t\t\treturn <SortDescendingIcon {...props} />;\n\t\t\t\tcase \"newest-to-oldest\":\n\t\t\t\t\treturn <SortAscendingIcon {...props} />;\n\t\t\t\tdefault:\n\t\t\t\t\tthrow new Error(\n\t\t\t\t\t\t`Invalid time sorting direction given: \"${direction}\"`,\n\t\t\t\t\t);\n\t\t\t}\n\t\t}\n\t}\n};\nSortIcon.displayName = \"SortIcon\";\n\nexport {\n\t//,\n\tSortIcon,\n};\n"],"mappings":"wCAAA,OAAS,qBAAAA,MAAyB,sCAClC,OAAS,sBAAAC,MAA0B,uCAyCvB,cAAAC,MAAA,oBALZ,IAAMC,EAAW,CAAC,CAAE,KAAAC,EAAM,UAAAC,EAAW,GAAGC,CAAM,IAAa,CAC1D,OAAQF,EAAM,CACb,IAAK,eACJ,OAAQC,EAAW,CAClB,IAAK,MACJ,OAAOH,EAACK,EAAA,CAAmB,GAAGD,EAAO,EACtC,IAAK,OACJ,OAAOJ,EAACM,EAAA,CAAoB,GAAGF,EAAO,EACvC,QACC,MAAM,IAAI,MACT,kDAAkDD,CAAS,GAC5D,CACF,CAED,IAAK,OAGJ,OAF6BI,EAAsBJ,CAAS,EAE9B,CAC7B,IAAK,mBACJ,OAAOH,EAACM,EAAA,CAAoB,GAAGF,EAAO,EACvC,IAAK,mBACJ,OAAOJ,EAACK,EAAA,CAAmB,GAAGD,EAAO,EACtC,QACC,MAAM,IAAI,MACT,0CAA0CD,CAAS,GACpD,CACF,CAEF,CACD,EACAF,EAAS,YAAc","names":["SortAscendingIcon","SortDescendingIcon","jsx","SortIcon","mode","direction","props","SortAscendingIcon","SortDescendingIcon","$timeSortingDirection"]}

package/dist/chunk-3DXMGSDU.js

@@ -0,0 +1,2 @@
+import{l as P}from"./chunk-XN5RN6JW.js";import{a as p}from"./chunk-XQVVOOLT.js";import{a as s}from"./chunk-AZ56JGNY.js";import{CheckCircleIcon as v}from"@phosphor-icons/react/CheckCircle";import{InfoIcon as h}from"@phosphor-icons/react/Info";import{WarningIcon as C}from"@phosphor-icons/react/Warning";import{WarningDiamondIcon as b}from"@phosphor-icons/react/WarningDiamond";import{Slot as u}from"@radix-ui/react-slot";import{createContext as y,forwardRef as d,useContext as f}from"react";import*as c from"sonner";import{jsx as r,jsxs as A}from"react/jsx-runtime";var B=({className:t,containerAriaLabel:o,dir:e,duration_ms:n=4e3,position:i="top-center",style:a})=>{let m=P();return r(c.Toaster,{className:s("toaster overlay-prompt pointer-events-auto font-sans *:duration-200",t),containerAriaLabel:o,dir:e,duration:n,gap:12,position:i??"top-center",style:a,theme:m,toastOptions:{unstyled:!0}})},g=y("");function _(t,o){return c.toast.custom(e=>r(g.Provider,{value:e,children:t}),{duration:o?.duration_ms,...o?.id?{id:o.id}:{},unstyled:!0})}var T=y({priority:"info"}),j=d(({asChild:t,children:o,className:e,priority:n,...i},a)=>{let m=t?u:"div";return r(T.Provider,{value:{priority:n},children:A(m,{className:s("relative flex items-start gap-2 text-sm","p-3 pl-[0.9375rem]","bg-popover high-contrast:border-popover rounded rounded-r-[0.3125rem] border border-gray-500/35 shadow-lg",e),ref:a,...i,children:[r(w,{priority:n}),o]})})}),D=d(({className:t,svg:o,...e},n)=>{let i=f(T);switch(i.priority){case"danger":return r(p,{className:s("text-danger-600",t),ref:n,svg:o??r(C,{weight:"fill"}),...e});case"warning":return r(p,{className:s("text-warning-600",t),ref:n,svg:o??r(b,{weight:"fill"}),...e});case"success":return r(p,{className:s("text-success-600",t),ref:n,svg:o??r(v,{weight:"fill"}),...e});case"info":return r(p,{className:s("text-accent-600",t),ref:n,svg:r(h,{weight:"fill"}),...e});default:throw new Error(`Unreachable Case: ${i.priority}`)}}),L=d(({asChild:t,className:o,onClick:e,...n},i)=>{let a=f(g);return r(t?u:"button",{className:s("shrink-0","data-[icon-button]:-mr-0.5 data-[icon-button]:-mt-0.5 data-[icon-button]:rounded-sm",o),onClick:l=>{e?.(l),!l.defaultPrevented&&c.toast.dismiss(a)},ref:i,...n})}),z=d(({asChild:t,className:o,...e},n)=>r(t?u:"p",{className:s("text-strong flex-1 text-sm",o),ref:n,...e}));function F(t){t.target instanceof Element&&t.target.closest(".overlay-prompt")&&t.preventDefault()}var x={info:"bg-accent-600",warning:"bg-warning-600",success:"bg-success-600",danger:"bg-danger-600"};function w({className:t,priority:o,...e}){return r("div",{"aria-hidden":!0,className:s("z-1 absolute -inset-px right-auto w-1.5 rounded-l",x[o],t),...e})}export{B as a,_ as b,j as c,D as d,L as e,z as f,F as g};
+//# sourceMappingURL=chunk-3DXMGSDU.js.map

package/dist/chunk-3DXMGSDU.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/toast/toast.tsx"],"sourcesContent":["\"use client\";\n\nimport { CheckCircleIcon } from \"@phosphor-icons/react/CheckCircle\";\nimport { InfoIcon } from \"@phosphor-icons/react/Info\";\nimport { WarningIcon } from \"@phosphor-icons/react/Warning\";\nimport { WarningDiamondIcon } from \"@phosphor-icons/react/WarningDiamond\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport {\n\ttype ComponentProps,\n\ttype ComponentRef,\n\ttype ReactNode,\n\tcreateContext,\n\tforwardRef,\n\tuseContext,\n} from \"react\";\nimport * as ToastPrimitive from \"sonner\";\nimport type { WithAsChild } from \"../../types/as-child.js\";\nimport type { WithStyleProps } from \"../../types/with-style-props.js\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { Icon } from \"../icon/icon.js\";\nimport type { SvgOnlyProps } from \"../icon/svg-only.js\";\nimport { useAppliedTheme } from \"../theme-provider/theme-provider.js\";\n\ntype ToasterPrimitiveProps = ComponentProps<typeof ToastPrimitive.Toaster>;\ntype ToasterPrimitiveTheme = ToasterPrimitiveProps[\"theme\"];\n\ntype ToasterProps = WithStyleProps &\n\tPick<ToasterPrimitiveProps, \"containerAriaLabel\" | \"dir\" | \"position\"> & {\n\t\t/**\n\t\t * Time in milliseconds that should elapse before automatically dismissing toasts.\n\t\t * When set here, this will be the default duration for all toasts.\n\t\t * @default 4000\n\t\t */\n\t\tduration_ms?: number;\n\t};\n\n/**\n * A container for displaying all toasts.\n *\n * Only one `<Toaster />` should be rendered in an app a time, preferably at the\n * root level of the app.\n */\nconst Toaster = ({\n\t//,\n\tclassName,\n\tcontainerAriaLabel,\n\tdir,\n\tduration_ms = 4000,\n\tposition = \"top-center\",\n\tstyle,\n}: ToasterProps) => {\n\tconst theme = useAppliedTheme();\n\n\treturn (\n\t\t<ToastPrimitive.Toaster\n\t\t\tclassName={cx(\n\t\t\t\t\"toaster overlay-prompt pointer-events-auto font-sans *:duration-200\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\tcontainerAriaLabel={containerAriaLabel}\n\t\t\tdir={dir}\n\t\t\tduration={duration_ms}\n\t\t\tgap={12}\n\t\t\tposition={position ?? \"top-center\"}\n\t\t\tstyle={style}\n\t\t\ttheme={theme as ToasterPrimitiveTheme} // we have additional themes that are not in the sonner types, so we need to cast for now\n\t\t\ttoastOptions={{\n\t\t\t\tunstyled: true,\n\t\t\t}}\n\t\t/>\n\t);\n};\n\nconst ToastIdContext = createContext<string | number>(\"\");\n\ntype MakeToastOptions = {\n\t/**\n\t * Time in milliseconds that should elapse before automatically closing the toast.\n\t * Will default to the `<Toaster />`'s `duration_ms` if not provided.\n\t */\n\tduration_ms?: number;\n\t/**\n\t * An optional custom ID for this toast. If not given, a unique ID is provided for you.\n\t */\n\tid?: string;\n};\n\n/**\n * Create a toast. Provide a `<Toast>` component as the `children` to be rendered\n * inside the `<Toaster />` section.\n */\nfunction makeToast(children: ReactNode, options?: MakeToastOptions) {\n\treturn ToastPrimitive.toast.custom(\n\t\t(toastId) => (\n\t\t\t<ToastIdContext.Provider value={toastId}>\n\t\t\t\t{children}\n\t\t\t</ToastIdContext.Provider>\n\t\t),\n\t\t{\n\t\t\t//\n\t\t\tduration: options?.duration_ms,\n\t\t\t// If a custom ID is provided, use it, else use the toastId provided by the sonner library\n\t\t\t// don't set an ID to `undefined` as it breaks the sonner library\n\t\t\t...(options?.id ? { id: options.id } : {}),\n\t\t\tunstyled: true,\n\t\t},\n\t);\n}\n\nconst priorities = [\n\t//,\n\t\"danger\",\n\t\"info\",\n\t\"success\",\n\t\"warning\",\n] as const;\ntype Priority = (typeof priorities)[number];\n\ntype ToastState = {\n\tpriority: Priority;\n};\n\nconst ToastStateContext = createContext<ToastState>({\n\tpriority: \"info\",\n});\n\ntype ToastProps = ComponentProps<\"div\"> &\n\tWithAsChild & {\n\t\tpriority: Priority;\n\t};\n\n/**\n * A succinct message with a priority that is displayed temporarily.\n * Toasts are used to provide feedback to the user without interrupting their workflow.\n */\nconst Toast = forwardRef<ComponentRef<\"div\">, ToastProps>(\n\t({ asChild, children, className, priority, ...props }, ref) => {\n\t\tconst Component = asChild ? Slot : \"div\";\n\n\t\treturn (\n\t\t\t<ToastStateContext.Provider value={{ priority }}>\n\t\t\t\t<Component\n\t\t\t\t\tclassName={cx(\n\t\t\t\t\t\t\"relative flex items-start gap-2 text-sm\",\n\t\t\t\t\t\t\"p-3 pl-[0.9375rem]\",\n\t\t\t\t\t\t\"bg-popover high-contrast:border-popover rounded rounded-r-[0.3125rem] border border-gray-500/35 shadow-lg\",\n\t\t\t\t\t\t/**\n\t\t\t\t\t\t * Do not apply overflow-hidden because we want the priority bar accent\n\t\t\t\t\t\t * to overlap the toast border, else the border flows over the\n\t\t\t\t\t\t * priority bar.\n\t\t\t\t\t\t */\n\t\t\t\t\t\tclassName,\n\t\t\t\t\t)}\n\t\t\t\t\tref={ref}\n\t\t\t\t\t{...props}\n\t\t\t\t>\n\t\t\t\t\t<PriorityBarAccent priority={priority} />\n\t\t\t\t\t{children}\n\t\t\t\t</Component>\n\t\t\t</ToastStateContext.Provider>\n\t\t);\n\t},\n);\n\ntype ToastIconProps = Partial<SvgOnlyProps>;\n\n/**\n * An icon that visually represents the priority of the toast.\n * If you do not provide an icon, the default icon and color for the priority is used.\n */\nconst ToastIcon = forwardRef<ComponentRef<\"svg\">, ToastIconProps>(\n\t({ className, svg, ...props }, ref) => {\n\t\tconst ctx = useContext(ToastStateContext);\n\n\t\tswitch (ctx.priority) {\n\t\t\tcase \"danger\":\n\t\t\t\treturn (\n\t\t\t\t\t<Icon\n\t\t\t\t\t\tclassName={cx(\"text-danger-600\", className)}\n\t\t\t\t\t\tref={ref}\n\t\t\t\t\t\tsvg={svg ?? <WarningIcon weight=\"fill\" />}\n\t\t\t\t\t\t{...props}\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\tcase \"warning\":\n\t\t\t\treturn (\n\t\t\t\t\t<Icon\n\t\t\t\t\t\tclassName={cx(\"text-warning-600\", className)}\n\t\t\t\t\t\tref={ref}\n\t\t\t\t\t\tsvg={svg ?? <WarningDiamondIcon weight=\"fill\" />}\n\t\t\t\t\t\t{...props}\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\tcase \"success\":\n\t\t\t\treturn (\n\t\t\t\t\t<Icon\n\t\t\t\t\t\tclassName={cx(\"text-success-600\", className)}\n\t\t\t\t\t\tref={ref}\n\t\t\t\t\t\tsvg={svg ?? <CheckCircleIcon weight=\"fill\" />}\n\t\t\t\t\t\t{...props}\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\tcase \"info\":\n\t\t\t\treturn (\n\t\t\t\t\t<Icon\n\t\t\t\t\t\t//\n\t\t\t\t\t\tclassName={cx(\"text-accent-600\", className)}\n\t\t\t\t\t\tref={ref}\n\t\t\t\t\t\tsvg={<InfoIcon weight=\"fill\" />}\n\t\t\t\t\t\t{...props}\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\tdefault:\n\t\t\t\tthrow new Error(`Unreachable Case: ${ctx.priority}`);\n\t\t}\n\t},\n);\n\ntype ToastActionProps = ComponentProps<\"button\"> & WithAsChild;\n\n/**\n * A button that dismisses the toast when clicked.\n * You can prevent the toast from being dismissed `onClick` by calling `event.preventDefault()`\n */\nconst ToastAction = forwardRef<ComponentRef<\"button\">, ToastActionProps>(\n\t({ asChild, className, onClick, ...props }, ref) => {\n\t\tconst ctx = useContext(ToastIdContext);\n\n\t\tconst Component = asChild ? Slot : \"button\";\n\n\t\treturn (\n\t\t\t<Component\n\t\t\t\tclassName={cx(\n\t\t\t\t\t//,\n\t\t\t\t\t\"shrink-0\",\n\t\t\t\t\t// 👇 wiggle the bits so that icon buttons toast actions are aligned with the toast icon\n\t\t\t\t\t\"data-[icon-button]:-mr-0.5 data-[icon-button]:-mt-0.5 data-[icon-button]:rounded-sm\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\tonClick={(event) => {\n\t\t\t\t\tonClick?.(event);\n\t\t\t\t\tif (event.defaultPrevented) {\n\t\t\t\t\t\treturn;\n\t\t\t\t\t}\n\t\t\t\t\tToastPrimitive.toast.dismiss(ctx);\n\t\t\t\t}}\n\t\t\t\tref={ref}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t);\n\t},\n);\n\ntype ToastMessageProps = ComponentProps<\"p\"> & WithAsChild;\n\n/**\n * The message content of the toast.\n */\nconst ToastMessage = forwardRef<ComponentRef<\"p\">, ToastMessageProps>(\n\t({ asChild, className, ...props }, ref) => {\n\t\tconst Component = asChild ? Slot : \"p\";\n\n\t\treturn (\n\t\t\t<Component\n\t\t\t\t//\n\t\t\t\tclassName={cx(\"text-strong flex-1 text-sm\", className)}\n\t\t\t\tref={ref}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t);\n\t},\n);\n\nexport {\n\t//,\n\tmakeToast,\n\tToast,\n\tToastAction,\n\tToaster,\n\tToastIcon,\n\tToastMessage,\n};\n\nexport type {\n\t//,\n\tPriority,\n};\n\n/**\n * @private\n *\n * Allows any mantle floating prompt (e.g. toasts and notifications) to be interacted with\n * even when a modaled view (e.g. dialog, sheet, etc) is open and a focus trap is active.\n *\n * Without this, interacting with the prompt would close the modaled view.\n */\nexport function preventCloseOnPromptInteraction(\n\tevent: CustomEvent | PointerEvent | MouseEvent | TouchEvent | FocusEvent,\n) {\n\tif (!(event.target instanceof Element)) {\n\t\treturn;\n\t}\n\n\tif (event.target.closest(\".overlay-prompt\")) {\n\t\tevent.preventDefault();\n\t}\n}\n\nconst priorityBackgroundColor = {\n\tinfo: \"bg-accent-600\",\n\twarning: \"bg-warning-600\",\n\tsuccess: \"bg-success-600\",\n\tdanger: \"bg-danger-600\",\n} as const satisfies Record<Priority, string>;\n\ntype PriorityBarAccentProps = Omit<ComponentProps<\"div\">, \"children\"> & {\n\tpriority: Priority;\n};\n\n/**\n * @private\n *\n * A colored bar that visually represents the priority of the toast.\n */\nfunction PriorityBarAccent({\n\tclassName,\n\tpriority,\n\t...props\n}: PriorityBarAccentProps) {\n\treturn (\n\t\t<div\n\t\t\taria-hidden\n\t\t\tclassName={cx(\n\t\t\t\t//\n\t\t\t\t\"z-1 absolute -inset-px right-auto w-1.5 rounded-l\",\n\t\t\t\tpriorityBackgroundColor[priority],\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n"],"mappings":"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","names":["CheckCircleIcon","InfoIcon","WarningIcon","WarningDiamondIcon","Slot","createContext","forwardRef","useContext","ToastPrimitive","jsx","jsxs","Toaster","className","containerAriaLabel","dir","duration_ms","position","style","theme","useAppliedTheme","cx","ToastIdContext","createContext","makeToast","children","options","toastId","ToastStateContext","createContext","Toast","forwardRef","asChild","children","className","priority","props","ref","Component","Slot","jsx","jsxs","cx","PriorityBarAccent","ToastIcon","svg","ctx","useContext","Icon","WarningIcon","WarningDiamondIcon","CheckCircleIcon","InfoIcon","ToastAction","onClick","ToastIdContext","event","ToastMessage","preventCloseOnPromptInteraction","event","priorityBackgroundColor","PriorityBarAccent","className","priority","props","jsx","cx"]}

package/dist/chunk-72UMV3YP.js

@@ -0,0 +1,2 @@
+import{a as f}from"./chunk-MF2QITTY.js";import{a as n}from"./chunk-AZ56JGNY.js";import{forwardRef as d,useEffect as u,useMemo as h,useRef as v,useState as y}from"react";import{jsx as s}from"react/jsx-runtime";var T=d(({children:t,className:o,...r},e)=>{let a=O();return s("div",{className:n("group/table scrollbar overflow-x-auto rounded-lg border border-card bg-white dark:bg-gray-100 relative w-full",o),"data-sticky-active":a.state.hasOverflow&&!a.state.scrolledToEnd||void 0,"data-x-overflow":a.state.hasOverflow,"data-x-scroll-end":a.state.hasOverflow&&a.state.scrolledToEnd,ref:f(a.ref,e),...r,children:t})});T.displayName="TableRoot";var C=d(({children:t,className:o,...r},e)=>s("table",{ref:e,className:n("table-auto border-collapse caption-bottom w-full min-w-full text-left",o),...r,children:t}));C.displayName="Table";var p=d(({children:t,className:o,...r},e)=>s("thead",{ref:e,className:n("border-b border-card-muted","divide-y divide-card-muted","text-strong bg-base",o),...r,children:t}));p.displayName="TableHead";var w=d(({children:t,className:o,...r},e)=>s("tbody",{className:n("divide-y divide-card-muted","text-body","[thead+&]:border-t [thead+&]:border-card-muted",o),ref:e,...r,children:t}));w.displayName="TableBody";var R=d(({children:t,className:o,...r},e)=>s("tfoot",{ref:e,className:n("bg-gray-50/50 font-medium text-body","border-t border-card-muted","divide-y divide-card-muted",o),...r,children:t}));R.displayName="TableFoot";var N=d(({children:t,className:o,...r},e)=>s("tr",{ref:e,className:n("[&>td]:bg-card [tbody:has(tr:not(:only-child))>&>td]:hover:bg-card-hover",o),...r,children:t}));N.displayName="TableRow";var k=d(({children:t,className:o,...r},e)=>s("th",{ref:e,className:n("h-12 px-4 text-left align-middle text-sm font-medium [&:has([role=checkbox])]:pr-0",o),...r,children:t}));p.displayName="TableHead";var x=d(({children:t,className:o,...r},e)=>s("td",{ref:e,className:n("p-4 align-middle [&:has([role=checkbox])]:pr-0 font-mono text-size-mono",o),...r,children:t}));x.displayName="TableCell";var g=d(({children:t,className:o,...r},e)=>s("caption",{ref:e,className:n("py-4 text-sm text-gray-500","border-t border-card-muted",o),...r,children:t}));g.displayName="TableCaption";function O(){let t=v(null),[o,r]=y({hasOverflow:!1,scrolledToEnd:!1});return u(()=>{let e=t.current;if(!e)return;let a=()=>{let i=e.scrollWidth>e.clientWidth,b=Math.abs(e.scrollWidth-e.scrollLeft-e.clientWidth)<1;r(l=>l.hasOverflow!==i||l.scrolledToEnd!==b?{hasOverflow:i,scrolledToEnd:b}:l)},c=new ResizeObserver(a);c.observe(e);let m=new MutationObserver(a);return m.observe(e,{childList:!0,subtree:!0}),e.addEventListener("scroll",a,{passive:!0}),a(),()=>{c.disconnect(),m.disconnect(),e.removeEventListener("scroll",a)}},[]),h(()=>({ref:t,state:o}),[o])}export{T as a,C as b,p as c,w as d,R as e,N as f,k as g,x as h,g as i};
+//# sourceMappingURL=chunk-72UMV3YP.js.map

package/dist/chunk-72UMV3YP.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/table/table.tsx"],"sourcesContent":["import type { ComponentProps, ComponentRef } from \"react\";\nimport { forwardRef, useEffect, useMemo, useRef, useState } from \"react\";\nimport { composeRefs } from \"../../utils/compose-refs/compose-refs.js\";\nimport { cx } from \"../../utils/cx/cx.js\";\n\n/**\n * The `<TableRoot>` is the root container element for all `<Table>`s.\n * It provides styling and additional functionality, such as horizontal overflow\n * detection.\n *\n * Must be used as the parent of a `<Table>`.\n *\n * @example\n * ```tsx\n * <TableRoot>\n *   <Table>\n *     <TableCaption>A list of your recent invoices.</TableCaption>\n *     <TableHead>\n *       <TableRow>\n *         <TableHeader className=\"w-[100px]\">Invoice</TableHeader>\n *         <TableHeader>Status</TableHeader>\n *         <TableHeader>Method</TableHeader>\n *         <TableHeader className=\"text-right\">Amount</TableHeader>\n *       </TableRow>\n *     </TableHead>\n *     <TableBody>\n *       {invoices.map((invoice) => (\n *         <TableRow key={invoice.invoice}>\n *           <TableCell className=\"font-medium\">{invoice.invoice}</TableCell>\n *           <TableCell>{invoice.paymentStatus}</TableCell>\n *           <TableCell>{invoice.paymentMethod}</TableCell>\n *           <TableCell className=\"text-right\">{invoice.totalAmount}</TableCell>\n *         </TableRow>\n *       ))}\n *     </TableBody>\n *     <TableFoot>\n *       <TableRow>\n *         <TableCell colSpan={3}>Total</TableCell>\n *         <TableCell className=\"text-right\">$2,500.00</TableCell>\n *       </TableRow>\n *     </TableFoot>\n *   </Table>\n * </TableRoot>\n * ```\n *\n * @see https://mantle.ngrok.com/components/table#api-table-root\n */\nconst TableRoot = forwardRef<ComponentRef<\"div\">, ComponentProps<\"div\">>(\n\t({ children, className, ...props }, ref) => {\n\t\tconst horizontalOverflow =\n\t\t\tuseHorizontalOverflowObserver<ComponentRef<\"div\">>();\n\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclassName={cx(\n\t\t\t\t\t\"group/table scrollbar overflow-x-auto rounded-lg border border-card bg-white dark:bg-gray-100 relative w-full\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\tdata-sticky-active={\n\t\t\t\t\t(horizontalOverflow.state.hasOverflow &&\n\t\t\t\t\t\t!horizontalOverflow.state.scrolledToEnd) ||\n\t\t\t\t\tundefined\n\t\t\t\t}\n\t\t\t\tdata-x-overflow={horizontalOverflow.state.hasOverflow}\n\t\t\t\tdata-x-scroll-end={\n\t\t\t\t\thorizontalOverflow.state.hasOverflow &&\n\t\t\t\t\thorizontalOverflow.state.scrolledToEnd\n\t\t\t\t}\n\t\t\t\tref={composeRefs(horizontalOverflow.ref, ref)}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</div>\n\t\t);\n\t},\n);\nTableRoot.displayName = \"TableRoot\";\n\n/**\n * The `<Table>` is a structured way to display data in rows and columns. The API\n * matches the HTML `<table>` element 1:1.\n *\n * Permitted content in this order:\n * 1. optional: `<TableCaption>`\n * 2. 0 or more: `<colgroup>` elements\n * 3. optional: `<TableHead>`\n * 4. either one of the following:\n *    - 0 or more: `<TableBody>`\n *    - 0 or more: `<TableRow>`\n * 5. optional: `<TableFoot>`\n *\n * @description\n * Establishes a table formatting context. Elements inside the `<Table>`\n * generate rectangular boxes. Each box occupies a number of table cells\n * according to the following rules:\n *   1. The row boxes fill the table in the source code order from top to bottom.\n *      Each row box occupies one row of cells.\n *   2. A row group box occupies one or more row boxes.\n *   3. Column boxes are placed next to each other in source code order.\n *      Depending on the value of the dir attribute, the columns are laid in\n *      left-to-right or right-to-left direction. A column box occupies one or\n *      more columns of table cells.\n *   4. A column group box occupies one or more column boxes.\n *   5. A cell box may span over multiple rows and columns. User agents trim\n *      cells to fit in the available number of rows and columns.\n * Table cells do have padding. Boxes that make up a table do not have margins.\n * For more in depth information, see the [MDN documentation](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/table).\n *\n * @example\n * ```tsx\n * <TableRoot>\n *   <Table>\n *     <TableCaption>A list of your recent invoices.</TableCaption>\n *     <TableHead>\n *       <TableRow>\n *         <TableHeader className=\"w-[100px]\">Invoice</TableHeader>\n *         <TableHeader>Status</TableHeader>\n *         <TableHeader>Method</TableHeader>\n *         <TableHeader className=\"text-right\">Amount</TableHeader>\n *       </TableRow>\n *     </TableHead>\n *     <TableBody>\n *       {invoices.map((invoice) => (\n *         <TableRow key={invoice.invoice}>\n *           <TableCell className=\"font-medium\">{invoice.invoice}</TableCell>\n *           <TableCell>{invoice.paymentStatus}</TableCell>\n *           <TableCell>{invoice.paymentMethod}</TableCell>\n *           <TableCell className=\"text-right\">{invoice.totalAmount}</TableCell>\n *         </TableRow>\n *       ))}\n *     </TableBody>\n *     <TableFoot>\n *       <TableRow>\n *         <TableCell colSpan={3}>Total</TableCell>\n *         <TableCell className=\"text-right\">$2,500.00</TableCell>\n *       </TableRow>\n *     </TableFoot>\n *   </Table>\n * </TableRoot>\n * ```\n *\n * @see https://mantle.ngrok.com/components/table#api-table\n */\nconst Table = forwardRef<ComponentRef<\"table\">, ComponentProps<\"table\">>(\n\t({ children, className, ...props }, ref) => {\n\t\treturn (\n\t\t\t<table\n\t\t\t\tref={ref}\n\t\t\t\tclassName={cx(\n\t\t\t\t\t\"table-auto border-collapse caption-bottom w-full min-w-full text-left\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</table>\n\t\t);\n\t},\n);\nTable.displayName = \"Table\";\n\n/**\n * The `<TableHead>` is a container for the table's column headers.\n * Encapsulates a set of `<TableRow>`s, indicating that they comprise the head\n * of a table with information about the table's columns. This is usually in the\n * form of column headers (`<TableHeader>`).\n *\n * Must be used as a child of a `<Table>`. It should only come after any\n * `<TableCaption>` or `<colgroup>` and before any `<TableBody>` or `<TableFoot>`.\n *\n * Permitted Content:\n * 1. 0 or more: `<TableRow>`\n *\n * @example\n * ```tsx\n * <TableRoot>\n *   <Table>\n *     <TableCaption>A list of your recent invoices.</TableCaption>\n *     <TableHead>\n *       <TableRow>\n *         <TableHeader className=\"w-[100px]\">Invoice</TableHeader>\n *         <TableHeader>Status</TableHeader>\n *         <TableHeader>Method</TableHeader>\n *         <TableHeader className=\"text-right\">Amount</TableHeader>\n *       </TableRow>\n *     </TableHead>\n *     <TableBody>\n *       {invoices.map((invoice) => (\n *         <TableRow key={invoice.invoice}>\n *           <TableCell className=\"font-medium\">{invoice.invoice}</TableCell>\n *           <TableCell>{invoice.paymentStatus}</TableCell>\n *           <TableCell>{invoice.paymentMethod}</TableCell>\n *           <TableCell className=\"text-right\">{invoice.totalAmount}</TableCell>\n *         </TableRow>\n *       ))}\n *     </TableBody>\n *     <TableFoot>\n *       <TableRow>\n *         <TableCell colSpan={3}>Total</TableCell>\n *         <TableCell className=\"text-right\">$2,500.00</TableCell>\n *       </TableRow>\n *     </TableFoot>\n *   </Table>\n * </TableRoot>\n * ```\n *\n * @see https://mantle.ngrok.com/components/table#api-table-header\n */\nconst TableHead = forwardRef<ComponentRef<\"thead\">, ComponentProps<\"thead\">>(\n\t({ children, className, ...props }, ref) => (\n\t\t<thead\n\t\t\tref={ref}\n\t\t\tclassName={cx(\n\t\t\t\t//,\n\t\t\t\t\"border-b border-card-muted\",\n\t\t\t\t\"divide-y divide-card-muted\",\n\t\t\t\t\"text-strong bg-base\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{children}\n\t\t</thead>\n\t),\n);\nTableHead.displayName = \"TableHead\";\n\n/**\n * The `<TableBody>` encapsulates a set of `<TableRow>`s, indicating that they\n * comprise the body of a table's (main) data.\n *\n * Must be used as a child of a `<Table>` and only come after any\n * `<TableCaption>`, `<colgroup>`, or `<TableHead>`.\n *\n * Permitted Content:\n * 1. 0 or more: `<TableRow>`\n *\n * @example\n * ```tsx\n * <TableRoot>\n *   <Table>\n *     <TableCaption>A list of your recent invoices.</TableCaption>\n *     <TableHead>\n *       <TableRow>\n *         <TableHeader className=\"w-[100px]\">Invoice</TableHeader>\n *         <TableHeader>Status</TableHeader>\n *         <TableHeader>Method</TableHeader>\n *         <TableHeader className=\"text-right\">Amount</TableHeader>\n *       </TableRow>\n *     </TableHead>\n *     <TableBody>\n *       {invoices.map((invoice) => (\n *         <TableRow key={invoice.invoice}>\n *           <TableCell className=\"font-medium\">{invoice.invoice}</TableCell>\n *           <TableCell>{invoice.paymentStatus}</TableCell>\n *           <TableCell>{invoice.paymentMethod}</TableCell>\n *           <TableCell className=\"text-right\">{invoice.totalAmount}</TableCell>\n *         </TableRow>\n *       ))}\n *     </TableBody>\n *     <TableFoot>\n *       <TableRow>\n *         <TableCell colSpan={3}>Total</TableCell>\n *         <TableCell className=\"text-right\">$2,500.00</TableCell>\n *       </TableRow>\n *     </TableFoot>\n *   </Table>\n * </TableRoot>\n * ```\n *\n * @see https://mantle.ngrok.com/components/table#api-table-body\n */\nconst TableBody = forwardRef<ComponentRef<\"tbody\">, ComponentProps<\"tbody\">>(\n\t({ children, className, ...props }, ref) => (\n\t\t<tbody\n\t\t\tclassName={cx(\n\t\t\t\t//,\n\t\t\t\t\"divide-y divide-card-muted\",\n\t\t\t\t\"text-body\",\n\t\t\t\t\"[thead+&]:border-t [thead+&]:border-card-muted\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\tref={ref}\n\t\t\t{...props}\n\t\t>\n\t\t\t{children}\n\t\t</tbody>\n\t),\n);\nTableBody.displayName = \"TableBody\";\n\n/**\n * The `<TableFoot>` encapsulates a set of `<TableRow>`s, indicating that they\n * comprise the foot of a table with information about the table's columns. This\n * is usually a summary of the columns, e.g., a sum of the given numbers in a\n * column.\n *\n * Must be used as a child of a `<Table>` and only come after any\n * `<TableCaption>`, `<colgroup>`, `<TableHead>`, and `<TableBody>`.\n *\n * Permitted Content:\n * 1. 0 or more: `<TableRow>` elements\n *\n * @example\n * ```tsx\n * <TableRoot>\n *   <Table>\n *     <TableCaption>A list of your recent invoices.</TableCaption>\n *     <TableHead>\n *       <TableRow>\n *         <TableHeader className=\"w-[100px]\">Invoice</TableHeader>\n *         <TableHeader>Status</TableHeader>\n *         <TableHeader>Method</TableHeader>\n *         <TableHeader className=\"text-right\">Amount</TableHeader>\n *       </TableRow>\n *     </TableHead>\n *     <TableBody>\n *       {invoices.map((invoice) => (\n *         <TableRow key={invoice.invoice}>\n *           <TableCell className=\"font-medium\">{invoice.invoice}</TableCell>\n *           <TableCell>{invoice.paymentStatus}</TableCell>\n *           <TableCell>{invoice.paymentMethod}</TableCell>\n *           <TableCell className=\"text-right\">{invoice.totalAmount}</TableCell>\n *         </TableRow>\n *       ))}\n *     </TableBody>\n *     <TableFoot>\n *       <TableRow>\n *         <TableCell colSpan={3}>Total</TableCell>\n *         <TableCell className=\"text-right\">$2,500.00</TableCell>\n *       </TableRow>\n *     </TableFoot>\n *   </Table>\n * </TableRoot>\n * ```\n *\n * @see https://mantle.ngrok.com/components/table#api-table-foot\n */\nconst TableFoot = forwardRef<ComponentRef<\"tfoot\">, ComponentProps<\"tfoot\">>(\n\t({ children, className, ...props }, ref) => (\n\t\t<tfoot\n\t\t\tref={ref}\n\t\t\tclassName={cx(\n\t\t\t\t//,\n\t\t\t\t\"bg-gray-50/50 font-medium text-body\",\n\t\t\t\t\"border-t border-card-muted\",\n\t\t\t\t\"divide-y divide-card-muted\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{children}\n\t\t</tfoot>\n\t),\n);\nTableFoot.displayName = \"TableFoot\";\n\n/**\n * The `<TableRow>` defines a row of cells in a table. The row's cells can then\n * be established using a mix of `<TableCell>` and `<TableHeader>` components.\n *\n * Must be used as a child of a `<TableHead>`, `<TableBody>`, or `<TableFoot>`.\n *\n * Permitted Content:\n * 1. 0 or more: `<TableHeader>` or `<TableCell>`\n *\n * @example\n * ```tsx\n * <TableRoot>\n *   <Table>\n *     <TableCaption>A list of your recent invoices.</TableCaption>\n *     <TableHead>\n *       <TableRow>\n *         <TableHeader className=\"w-[100px]\">Invoice</TableHeader>\n *         <TableHeader>Status</TableHeader>\n *         <TableHeader>Method</TableHeader>\n *         <TableHeader className=\"text-right\">Amount</TableHeader>\n *       </TableRow>\n *     </TableHead>\n *     <TableBody>\n *       {invoices.map((invoice) => (\n *         <TableRow key={invoice.invoice}>\n *           <TableCell className=\"font-medium\">{invoice.invoice}</TableCell>\n *           <TableCell>{invoice.paymentStatus}</TableCell>\n *           <TableCell>{invoice.paymentMethod}</TableCell>\n *           <TableCell className=\"text-right\">{invoice.totalAmount}</TableCell>\n *         </TableRow>\n *       ))}\n *     </TableBody>\n *     <TableFoot>\n *       <TableRow>\n *         <TableCell colSpan={3}>Total</TableCell>\n *         <TableCell className=\"text-right\">$2,500.00</TableCell>\n *       </TableRow>\n *     </TableFoot>\n *   </Table>\n * </TableRoot>\n * ```\n *\n * @see https://mantle.ngrok.com/components/table#api-table-row\n */\nconst TableRow = forwardRef<ComponentRef<\"tr\">, ComponentProps<\"tr\">>(\n\t({ children, className, ...props }, ref) => (\n\t\t<tr\n\t\t\tref={ref}\n\t\t\tclassName={cx(\n\t\t\t\t// \"data-state-selected:bg-gray-200\",\n\t\t\t\t\"[&>td]:bg-card [tbody:has(tr:not(:only-child))>&>td]:hover:bg-card-hover\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{children}\n\t\t</tr>\n\t),\n);\nTableRow.displayName = \"TableRow\";\n\n/**\n * The `<TableHeader>` defines a cell as the header of a group of table cells\n * and may be used as a child of a `<TableRow>`. The exact nature of this group\n * is defined by the scope and headers attributes.\n *\n * Must be used as a child of a `<TableRow>`.\n *\n * Permitted Content:\n * 1. Flow content, but with no header, footer, sectioning content, or heading\n * content descendants.\n *\n * @example\n * ```tsx\n * <TableRoot>\n *   <Table>\n *     <TableCaption>A list of your recent invoices.</TableCaption>\n *     <TableHead>\n *       <TableRow>\n *         <TableHeader className=\"w-[100px]\">Invoice</TableHeader>\n *         <TableHeader>Status</TableHeader>\n *         <TableHeader>Method</TableHeader>\n *         <TableHeader className=\"text-right\">Amount</TableHeader>\n *       </TableRow>\n *     </TableHead>\n *     <TableBody>\n *       {invoices.map((invoice) => (\n *         <TableRow key={invoice.invoice}>\n *           <TableCell className=\"font-medium\">{invoice.invoice}</TableCell>\n *           <TableCell>{invoice.paymentStatus}</TableCell>\n *           <TableCell>{invoice.paymentMethod}</TableCell>\n *           <TableCell className=\"text-right\">{invoice.totalAmount}</TableCell>\n *         </TableRow>\n *       ))}\n *     </TableBody>\n *     <TableFoot>\n *       <TableRow>\n *         <TableCell colSpan={3}>Total</TableCell>\n *         <TableCell className=\"text-right\">$2,500.00</TableCell>\n *       </TableRow>\n *     </TableFoot>\n *   </Table>\n * </TableRoot>\n * ```\n *\n * @see https://mantle.ngrok.com/components/table#api-table-header\n */\nconst TableHeader = forwardRef<ComponentRef<\"th\">, ComponentProps<\"th\">>(\n\t({ children, className, ...props }, ref) => (\n\t\t<th\n\t\t\tref={ref}\n\t\t\tclassName={cx(\n\t\t\t\t\"h-12 px-4 text-left align-middle text-sm font-medium [&:has([role=checkbox])]:pr-0\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{children}\n\t\t</th>\n\t),\n);\nTableHead.displayName = \"TableHead\";\n\n/**\n * The `<TableCell>` defines a cell of a table that contains data and may be\n * used as a child of a `<TableRow>`.\n *\n * Must be used as a child of a `<TableRow>`.\n *\n * Permitted Content:\n * 1. Flow content\n *\n * @example\n * ```tsx\n * <TableRoot>\n *   <Table>\n *     <TableCaption>A list of your recent invoices.</TableCaption>\n *     <TableHead>\n *       <TableRow>\n *         <TableHeader className=\"w-[100px]\">Invoice</TableHeader>\n *         <TableHeader>Status</TableHeader>\n *         <TableHeader>Method</TableHeader>\n *         <TableHeader className=\"text-right\">Amount</TableHeader>\n *       </TableRow>\n *     </TableHead>\n *     <TableBody>\n *       {invoices.map((invoice) => (\n *         <TableRow key={invoice.invoice}>\n *           <TableCell className=\"font-medium\">{invoice.invoice}</TableCell>\n *           <TableCell>{invoice.paymentStatus}</TableCell>\n *           <TableCell>{invoice.paymentMethod}</TableCell>\n *           <TableCell className=\"text-right\">{invoice.totalAmount}</TableCell>\n *         </TableRow>\n *       ))}\n *     </TableBody>\n *     <TableFoot>\n *       <TableRow>\n *         <TableCell colSpan={3}>Total</TableCell>\n *         <TableCell className=\"text-right\">$2,500.00</TableCell>\n *       </TableRow>\n *     </TableFoot>\n *   </Table>\n * </TableRoot>\n * ```\n *\n * @see https://mantle.ngrok.com/components/table#api-table-cell\n */\nconst TableCell = forwardRef<ComponentRef<\"td\">, ComponentProps<\"td\">>(\n\t({ children, className, ...props }, ref) => (\n\t\t<td\n\t\t\tref={ref}\n\t\t\tclassName={cx(\n\t\t\t\t\"p-4 align-middle [&:has([role=checkbox])]:pr-0 font-mono text-size-mono\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{children}\n\t\t</td>\n\t),\n);\nTableCell.displayName = \"TableCell\";\n\n/**\n * The optional `<TableCaption>` specifies the caption (or title) of a table,\n * providing the table an accessible description.\n *\n * If used, must be the first child of a `<Table>`.\n *\n * Permitted Content:\n * 1. Flow content\n *\n * @example\n * ```tsx\n * <TableRoot>\n *   <Table>\n *     <TableCaption>A list of your recent invoices.</TableCaption>\n *     <TableHead>\n *       <TableRow>\n *         <TableHeader className=\"w-[100px]\">Invoice</TableHeader>\n *         <TableHeader>Status</TableHeader>\n *         <TableHeader>Method</TableHeader>\n *         <TableHeader className=\"text-right\">Amount</TableHeader>\n *       </TableRow>\n *     </TableHead>\n *     <TableBody>\n *       {invoices.map((invoice) => (\n *         <TableRow key={invoice.invoice}>\n *           <TableCell className=\"font-medium\">{invoice.invoice}</TableCell>\n *           <TableCell>{invoice.paymentStatus}</TableCell>\n *           <TableCell>{invoice.paymentMethod}</TableCell>\n *           <TableCell className=\"text-right\">{invoice.totalAmount}</TableCell>\n *         </TableRow>\n *       ))}\n *     </TableBody>\n *     <TableFoot>\n *       <TableRow>\n *         <TableCell colSpan={3}>Total</TableCell>\n *         <TableCell className=\"text-right\">$2,500.00</TableCell>\n *       </TableRow>\n *     </TableFoot>\n *   </Table>\n * </TableRoot>\n * ```\n *\n * @see https://mantle.ngrok.com/components/table#api-table-caption\n */\nconst TableCaption = forwardRef<\n\tComponentRef<\"caption\">,\n\tComponentProps<\"caption\">\n>(({ children, className, ...props }, ref) => (\n\t<caption\n\t\tref={ref}\n\t\tclassName={cx(\n\t\t\t\"py-4 text-sm text-gray-500\",\n\t\t\t\"border-t border-card-muted\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t>\n\t\t{children}\n\t</caption>\n));\nTableCaption.displayName = \"TableCaption\";\n\nexport {\n\t//,\n\tTable,\n\tTableBody,\n\tTableCaption,\n\tTableCell,\n\tTableFoot,\n\tTableHead,\n\tTableHeader,\n\tTableRoot,\n\tTableRow,\n};\n\n/**\n * A custom hook that observes the horizontal overflow of an element and determines\n * if it has overflow and if it is scrolled to the end.\n *\n * @private\n */\nfunction useHorizontalOverflowObserver<T extends HTMLElement>() {\n\tconst ref = useRef<T | null>(null);\n\tconst [state, setState] = useState({\n\t\thasOverflow: false,\n\t\tscrolledToEnd: false,\n\t});\n\n\tuseEffect(() => {\n\t\tconst element = ref.current;\n\t\tif (!element) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst checkState = () => {\n\t\t\tconst hasOverflow = element.scrollWidth > element.clientWidth;\n\t\t\tconst scrolledToEnd =\n\t\t\t\tMath.abs(\n\t\t\t\t\telement.scrollWidth - element.scrollLeft - element.clientWidth,\n\t\t\t\t) < 1;\n\n\t\t\tsetState((previous) => {\n\t\t\t\tif (\n\t\t\t\t\tprevious.hasOverflow !== hasOverflow ||\n\t\t\t\t\tprevious.scrolledToEnd !== scrolledToEnd\n\t\t\t\t) {\n\t\t\t\t\treturn { hasOverflow, scrolledToEnd };\n\t\t\t\t}\n\t\t\t\treturn previous; // No state change\n\t\t\t});\n\t\t};\n\n\t\tconst resizeObserver = new ResizeObserver(checkState);\n\t\tresizeObserver.observe(element);\n\n\t\tconst mutationObserver = new MutationObserver(checkState);\n\t\tmutationObserver.observe(element, { childList: true, subtree: true });\n\n\t\telement.addEventListener(\"scroll\", checkState, { passive: true });\n\n\t\tcheckState();\n\n\t\treturn () => {\n\t\t\tresizeObserver.disconnect();\n\t\t\tmutationObserver.disconnect();\n\t\t\telement.removeEventListener(\"scroll\", checkState);\n\t\t};\n\t}, []);\n\n\treturn useMemo(() => ({ ref, state }), [state]);\n}\n"],"mappings":"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","names":["forwardRef","useEffect","useMemo","useRef","useState","jsx","TableRoot","forwardRef","children","className","props","ref","horizontalOverflow","useHorizontalOverflowObserver","cx","composeRefs","Table","TableHead","TableBody","TableFoot","TableRow","TableHeader","TableCell","TableCaption","useHorizontalOverflowObserver","ref","useRef","state","setState","useState","useEffect","element","checkState","hasOverflow","scrolledToEnd","previous","resizeObserver","mutationObserver","useMemo"]}

package/dist/chunk-BK4P33ZH.js

@@ -0,0 +1,2 @@
+import{a as l}from"./chunk-3C5O3AQA.js";import{a as o}from"./chunk-XQVVOOLT.js";import{a as d}from"./chunk-AZ56JGNY.js";import{CircleNotchIcon as I}from"@phosphor-icons/react/CircleNotch";import{Slot as V}from"@radix-ui/react-slot";import{cva as C}from"class-variance-authority";import{Children as H,cloneElement as M,forwardRef as T,isValidElement as E}from"react";import{jsx as t,jsxs as L}from"react/jsx-runtime";var N=C("inline-flex shrink-0 cursor-pointer items-center justify-center rounded-[var(--icon-button-border-radius,0.375rem)] border focus-within:outline-none focus-visible:ring-4 disabled:cursor-default disabled:opacity-50",{variants:{appearance:{ghost:"text-strong focus-visible:ring-focus-accent not-disabled:hover:bg-neutral-500/10 not-disabled:hover:text-strong not-disabled:active:bg-neutral-500/15 not-disabled:active:text-strong border-transparent",outlined:"border-form bg-form text-strong focus-visible:border-accent-600 focus-visible:ring-focus-accent not-disabled:hover:border-neutral-400 not-disabled:hover:bg-form-hover not-disabled:hover:text-strong not-disabled:active:border-neutral-400 not-disabled:active:bg-neutral-500/10 not-disabled:active:text-strong focus-visible:not-disabled:active:border-accent-600"},isLoading:{false:"",true:"opacity-50"},size:{xs:"size-6",sm:"size-7",md:"size-9"}},defaultVariants:{appearance:"outlined",size:"md"}}),A=T(({"aria-disabled":c,appearance:u,asChild:b=!1,children:p,className:m,disabled:f,icon:v,isLoading:e=!1,label:h,size:n,type:g,...y},B)=>{let r=l(c??f??e),i=e?t(I,{className:"animate-spin"}):v,s={"aria-disabled":r,"data-icon-button":!0,"data-loading":e,"data-size":n,className:d("icon-button",N({appearance:u,isLoading:e,size:n}),m),disabled:r,ref:B,...y};if(b){let a=H.only(p),x=E(a);return t(V,{...s,children:x&&M(a,{},t(o,{svg:i}))})}return L("button",{...s,type:g,children:[t("span",{className:"sr-only",children:h}),t(o,{svg:i})]})});A.displayName="IconButton";export{A as a};
+//# sourceMappingURL=chunk-BK4P33ZH.js.map