@ngrok/mantle 0.52.7 → 0.52.9

package/dist/alert-dialog.d.ts

@@ -6,7 +6,7 @@ import * as react from 'react';
 import { ComponentProps, ReactNode } from 'react';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { W as WithAsChild } from './as-child-DJ7x3JFV.js';
-import { R as Root$1 } from './primitive-BUbUB7RS.js';
+import { R as Root$1 } from './primitive-CBR_XmVa.js';
 import { S as SvgAttributes } from './types-BuKAGhC-.js';
 
 declare const priorities: readonly ["info", "danger"];

package/dist/alert-dialog.js

@@ -1,2 +1,2 @@
-import{a as y,b as A,c as u,d,e as D,f as C,g as P,h as v}from"./chunk-PX63EGR2.js";import{d as c}from"./chunk-RH46OJYB.js";import"./chunk-THKAHLEP.js";import"./chunk-6J7D73WA.js";import{a as m}from"./chunk-T5U5KWUW.js";import"./chunk-4LSFAAZW.js";import"./chunk-72TJUKMV.js";import"./chunk-3C5O3AQA.js";import"./chunk-I6T6YV2L.js";import{a as g}from"./chunk-NPTDRQT5.js";import{a}from"./chunk-AZ56JGNY.js";import{InfoIcon as H}from"@phosphor-icons/react/Info";import{WarningIcon as k}from"@phosphor-icons/react/Warning";import{Slot as f}from"@radix-ui/react-slot";import{createContext as M,forwardRef as n,useContext as $,useMemo as q}from"react";import E from"tiny-invariant";import{jsx as i,jsxs as J}from"react/jsx-runtime";var x=M(null);function N(){let t=$(x);return E(t,"AlertDialog child component used outside of AlertDialog parent!"),t}function h({priority:t,...e}){let o=q(()=>({priority:t}),[t]);return i(x.Provider,{value:o,children:i(y,{...e})})}h.displayName="AlertDialog";var R=A;R.displayName="AlertDialogTrigger";var b=u;b.displayName="AlertDialogPortal";var W=n(({className:t,...e},o)=>i(D,{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-xs",t),...e,ref:o}));W.displayName="AlertDialogOverlay";var I=n(({className:t,onInteractOutside:e,onPointerDownOutside:o,preferredWidth:l="max-w-md",...r},p)=>J(b,{children:[i(W,{}),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-hidden focus-within:outline-hidden","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})})]}));I.displayName="AlertDialogContent";var O=n(({asChild:t=!1,className:e,...o},l)=>i(t?f:"div",{className:a("flex-1 space-y-4",e),ref:l,...o}));O.displayName="AlertDialogBody";var w=n(({asChild:t=!1,className:e,...o},l)=>i(t?f:"div",{className:a("flex flex-col space-y-2 text-center sm:text-start",e),...o}));w.displayName="AlertDialogHeader";var B=n(({asChild:t=!1,className:e,...o},l)=>i(t?f:"div",{className:a("flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",e),...o}));B.displayName="AlertDialogFooter";var T=n(({className:t,...e},o)=>i(P,{ref:o,className:a("text-strong text-center text-lg font-medium sm:text-start",t),...e}));T.displayName="AlertDialogTitle";var z=n(({className:t,...e},o)=>i(v,{ref:o,className:a("text-body text-center text-sm font-normal sm:text-start",t),...e}));z.displayName="AlertDialogDescription";var S=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})});S.displayName="AlertDialogAction";var j=n(({appearance:t="outlined",className:e,priority:o="neutral",...l},r)=>i(d,{asChild:!0,children:i(m,{appearance:t,className:a("mt-2 sm:mt-0",e),priority:o,ref:r,...l})}));j.displayName="AlertDialogCancel";var V=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(k,{}):i(H,{});return i(g,{ref:l,className:a("size-12 sm:size-7",p,t),svg:e??s,...o})});V.displayName="AlertDialogIcon";var F=d;F.displayName="AlertDialogClose";var G={Root:h,Action:S,Body:O,Cancel:j,Close:F,Content:I,Description:z,Footer:B,Header:w,Icon:V,Title:T,Trigger:R};export{G as AlertDialog};
+import{a as y,b as A,c as u,d,e as D,f as C,g as P,h as v}from"./chunk-VIKPHWPP.js";import{d as c}from"./chunk-RH46OJYB.js";import"./chunk-THKAHLEP.js";import"./chunk-6J7D73WA.js";import{a as m}from"./chunk-T5U5KWUW.js";import"./chunk-4LSFAAZW.js";import"./chunk-72TJUKMV.js";import"./chunk-3C5O3AQA.js";import"./chunk-I6T6YV2L.js";import{a as g}from"./chunk-NPTDRQT5.js";import{a}from"./chunk-AZ56JGNY.js";import{InfoIcon as H}from"@phosphor-icons/react/Info";import{WarningIcon as k}from"@phosphor-icons/react/Warning";import{Slot as f}from"@radix-ui/react-slot";import{createContext as M,forwardRef as n,useContext as $,useMemo as q}from"react";import E from"tiny-invariant";import{jsx as i,jsxs as J}from"react/jsx-runtime";var x=M(null);function N(){let t=$(x);return E(t,"AlertDialog child component used outside of AlertDialog parent!"),t}function h({priority:t,...e}){let o=q(()=>({priority:t}),[t]);return i(x.Provider,{value:o,children:i(y,{...e})})}h.displayName="AlertDialog";var R=A;R.displayName="AlertDialogTrigger";var b=u;b.displayName="AlertDialogPortal";var W=n(({className:t,...e},o)=>i(D,{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-xs",t),...e,ref:o}));W.displayName="AlertDialogOverlay";var I=n(({className:t,onInteractOutside:e,onPointerDownOutside:o,preferredWidth:l="max-w-md",...r},p)=>J(b,{children:[i(W,{}),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-hidden focus-within:outline-hidden","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})})]}));I.displayName="AlertDialogContent";var O=n(({asChild:t=!1,className:e,...o},l)=>i(t?f:"div",{className:a("flex-1 space-y-4",e),ref:l,...o}));O.displayName="AlertDialogBody";var w=n(({asChild:t=!1,className:e,...o},l)=>i(t?f:"div",{className:a("flex flex-col space-y-2 text-center sm:text-start",e),...o}));w.displayName="AlertDialogHeader";var B=n(({asChild:t=!1,className:e,...o},l)=>i(t?f:"div",{className:a("flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",e),...o}));B.displayName="AlertDialogFooter";var T=n(({className:t,...e},o)=>i(P,{ref:o,className:a("text-strong text-center text-lg font-medium sm:text-start",t),...e}));T.displayName="AlertDialogTitle";var z=n(({className:t,...e},o)=>i(v,{ref:o,className:a("text-body text-center text-sm font-normal sm:text-start",t),...e}));z.displayName="AlertDialogDescription";var S=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})});S.displayName="AlertDialogAction";var j=n(({appearance:t="outlined",className:e,priority:o="neutral",...l},r)=>i(d,{asChild:!0,children:i(m,{appearance:t,className:a("mt-2 sm:mt-0",e),priority:o,ref:r,...l})}));j.displayName="AlertDialogCancel";var V=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(k,{}):i(H,{});return i(g,{ref:l,className:a("size-12 sm:size-7",p,t),svg:e??s,...o})});V.displayName="AlertDialogIcon";var F=d;F.displayName="AlertDialogClose";var G={Root:h,Action:S,Body:O,Cancel:j,Close:F,Content:I,Description:z,Footer:B,Header:w,Icon:V,Title:T,Trigger:R};export{G as AlertDialog};
 //# sourceMappingURL=alert-dialog.js.map

package/dist/chunk-VIKPHWPP.js

@@ -0,0 +1,2 @@
+import*as e from"@radix-ui/react-dialog";import{Slot as m}from"@radix-ui/react-slot";import{createContext as v,forwardRef as n,useContext as s,useEffect as D,useState as c}from"react";import{jsx as o}from"react/jsx-runtime";var l=v({hasDescription:!1,setHasDescription:()=>{}});function g(i){let[t,r]=c(!1);return o(l.Provider,{value:{hasDescription:t,setHasDescription:r},children:o(e.Root,{...i})})}g.displayName="DialogPrimitiveRoot";var f=e.Trigger;f.displayName="DialogPrimitiveTrigger";var P=e.Portal;P.displayName="DialogPrimitivePortal";var d=e.Close;d.displayName="DialogPrimitiveClose";var u=n((i,t)=>o(e.Overlay,{"data-overlay":!0,ref:t,...i}));u.displayName="DialogPrimitiveOverlay";var y=n((i,t)=>{let r=s(l);return o(e.Content,{ref:t,...r.hasDescription?{}:{"aria-describedby":void 0},...i})});y.displayName="DialogPrimitiveContent";var x=e.Title,C=n(({asChild:i,children:t,...r},p)=>{let a=s(l);return D(()=>(a.setHasDescription(!0),()=>a.setHasDescription(!1)),[a]),o(e.Description,{ref:p,asChild:!0,children:o(i?m:"div",{...r,children:t})})});C.displayName="DialogPrimitiveDescription";function T(i){return i instanceof HTMLElement?i.hasAttribute("data-overlay"):!1}export{g as a,f as b,P as c,d,u as e,y as f,x as g,C as h,T as i};
+//# sourceMappingURL=chunk-VIKPHWPP.js.map

package/dist/chunk-VIKPHWPP.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/dialog/primitive.tsx"],"sourcesContent":["\"use client\";\n\nimport * as DialogPrimitive from \"@radix-ui/react-dialog\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport {\n\ttype ComponentPropsWithoutRef,\n\ttype ComponentRef,\n\tcreateContext,\n\tforwardRef,\n\tuseContext,\n\tuseEffect,\n\tuseState,\n} from \"react\";\n\ntype InternalDialogContextValue = {\n\thasDescription: boolean;\n\tsetHasDescription: (value: boolean) => void;\n};\n\nconst InternalDialogContext = createContext<InternalDialogContextValue>({\n\thasDescription: false,\n\tsetHasDescription: () => {},\n});\n\nfunction Root(props: ComponentPropsWithoutRef<typeof DialogPrimitive.Root>) {\n\tconst [hasDescription, setHasDescription] = useState(false);\n\n\treturn (\n\t\t<InternalDialogContext.Provider\n\t\t\tvalue={{ hasDescription, setHasDescription }}\n\t\t>\n\t\t\t<DialogPrimitive.Root {...props} />\n\t\t</InternalDialogContext.Provider>\n\t);\n}\nRoot.displayName = \"DialogPrimitiveRoot\";\n\nconst Trigger = DialogPrimitive.Trigger;\nTrigger.displayName = \"DialogPrimitiveTrigger\";\n\nconst Portal = DialogPrimitive.Portal;\nPortal.displayName = \"DialogPrimitivePortal\";\n\nconst Close = DialogPrimitive.Close;\nClose.displayName = \"DialogPrimitiveClose\";\n\nconst Overlay = forwardRef<\n\tComponentRef<typeof DialogPrimitive.Overlay>,\n\tComponentPropsWithoutRef<typeof DialogPrimitive.Overlay>\n>((props, ref) => (\n\t<DialogPrimitive.Overlay\n\t\t/**\n\t\t * Mark the overlay with a data attribute so we can target it, e.g. in\n\t\t * event handlers\n\t\t */\n\t\tdata-overlay\n\t\tref={ref}\n\t\t{...props}\n\t/>\n));\nOverlay.displayName = \"DialogPrimitiveOverlay\";\n\n/**\n * The main content container of the dialog primitive.\n * This is a low-level primitive used by higher-level dialog components.\n */\nconst Content = forwardRef<\n\tComponentRef<\"div\">,\n\tComponentPropsWithoutRef<typeof DialogPrimitive.Content>\n>((props, ref) => {\n\tconst ctx = useContext(InternalDialogContext);\n\n\treturn (\n\t\t<DialogPrimitive.Content\n\t\t\tref={ref}\n\t\t\t// If there's no description, we remove the default applied aria-describedby attribute from radix dialog\n\t\t\t{...(!ctx.hasDescription ? { \"aria-describedby\": undefined } : {})}\n\t\t\t{...props}\n\t\t/>\n\t);\n});\nContent.displayName = \"DialogPrimitiveContent\";\n\nconst Title = DialogPrimitive.Title;\n\n/**\n * An accessible description for the dialog primitive.\n * This is a low-level primitive used by higher-level dialog components.\n * Renders as a `div` by default, but can be changed to any other element using the `asChild` prop.\n */\nconst Description = forwardRef<\n\tComponentRef<\"div\">,\n\tComponentPropsWithoutRef<typeof DialogPrimitive.Description>\n>(({ asChild, children, ...props }, ref) => {\n\tconst ctx = useContext(InternalDialogContext);\n\n\tuseEffect(() => {\n\t\tctx.setHasDescription(true);\n\t\treturn () => ctx.setHasDescription(false);\n\t}, [ctx]);\n\n\tconst Component = asChild ? Slot : \"div\";\n\n\treturn (\n\t\t<DialogPrimitive.Description ref={ref} asChild>\n\t\t\t<Component {...props}>{children}</Component>\n\t\t</DialogPrimitive.Description>\n\t);\n});\nDescription.displayName = \"DialogPrimitiveDescription\";\n\n/**\n * Type guard to check if the event target is the overlay component\n */\nfunction isDialogOverlayTarget(target: EventTarget | null): boolean {\n\tif (target instanceof HTMLElement) {\n\t\treturn target.hasAttribute(\"data-overlay\");\n\t}\n\treturn false;\n}\n\nexport {\n\t//,\n\tRoot,\n\tTrigger,\n\tPortal,\n\tClose,\n\tOverlay,\n\tContent,\n\tDescription,\n\tTitle,\n\tisDialogOverlayTarget,\n};\n"],"mappings":"AAEA,UAAYA,MAAqB,yBACjC,OAAS,QAAAC,MAAY,uBACrB,OAGC,iBAAAC,EACA,cAAAC,EACA,cAAAC,EACA,aAAAC,EACA,YAAAC,MACM,QAmBJ,cAAAC,MAAA,oBAZH,IAAMC,EAAwBN,EAA0C,CACvE,eAAgB,GAChB,kBAAmB,IAAM,CAAC,CAC3B,CAAC,EAED,SAASO,EAAKC,EAA8D,CAC3E,GAAM,CAACC,EAAgBC,CAAiB,EAAIN,EAAS,EAAK,EAE1D,OACCC,EAACC,EAAsB,SAAtB,CACA,MAAO,CAAE,eAAAG,EAAgB,kBAAAC,CAAkB,EAE3C,SAAAL,EAAiB,OAAhB,CAAsB,GAAGG,EAAO,EAClC,CAEF,CACAD,EAAK,YAAc,sBAEnB,IAAMI,EAA0B,UAChCA,EAAQ,YAAc,yBAEtB,IAAMC,EAAyB,SAC/BA,EAAO,YAAc,wBAErB,IAAMC,EAAwB,QAC9BA,EAAM,YAAc,uBAEpB,IAAMC,EAAUb,EAGd,CAACO,EAAOO,IACTV,EAAiB,UAAhB,CAKA,eAAY,GACZ,IAAKU,EACJ,GAAGP,EACL,CACA,EACDM,EAAQ,YAAc,yBAMtB,IAAME,EAAUf,EAGd,CAACO,EAAOO,IAAQ,CACjB,IAAME,EAAMf,EAAWI,CAAqB,EAE5C,OACCD,EAAiB,UAAhB,CACA,IAAKU,EAEJ,GAAKE,EAAI,eAAqD,CAAC,EAArC,CAAE,mBAAoB,MAAU,EAC1D,GAAGT,EACL,CAEF,CAAC,EACDQ,EAAQ,YAAc,yBAEtB,IAAME,EAAwB,QAOxBC,EAAclB,EAGlB,CAAC,CAAE,QAAAmB,EAAS,SAAAC,EAAU,GAAGb,CAAM,EAAGO,IAAQ,CAC3C,IAAME,EAAMf,EAAWI,CAAqB,EAE5C,OAAAH,EAAU,KACTc,EAAI,kBAAkB,EAAI,EACnB,IAAMA,EAAI,kBAAkB,EAAK,GACtC,CAACA,CAAG,CAAC,EAKPZ,EAAiB,cAAhB,CAA4B,IAAKU,EAAK,QAAO,GAC7C,SAAAV,EAJgBe,EAAUrB,EAAO,MAIhC,CAAW,GAAGS,EAAQ,SAAAa,EAAS,EACjC,CAEF,CAAC,EACDF,EAAY,YAAc,6BAK1B,SAASG,EAAsBC,EAAqC,CACnE,OAAIA,aAAkB,YACdA,EAAO,aAAa,cAAc,EAEnC,EACR","names":["DialogPrimitive","Slot","createContext","forwardRef","useContext","useEffect","useState","jsx","InternalDialogContext","Root","props","hasDescription","setHasDescription","Trigger","Portal","Close","Overlay","ref","Content","ctx","Title","Description","asChild","children","isDialogOverlayTarget","target"]}

package/dist/combobox.js

@@ -1,2 +1,2 @@
-import{b as f}from"./chunk-J6ZF5J72.js";import{a as s}from"./chunk-AZ56JGNY.js";import*as i from"@ariakit/react";import{Slot as l}from"@radix-ui/react-slot";import{createContext as I,forwardRef as b}from"react";import{jsx as t}from"react/jsx-runtime";var c=({children:o,...e})=>t(i.ComboboxProvider,{...e,children:o});c.displayName="Combobox";var x=b(({"aria-invalid":o,autoComplete:e="list",autoSelect:a="always",className:n,validation:r,...m},d)=>{let p=o!=null&&o!=="false"?"error":typeof r=="function"?r():r;return t(i.Combobox,{"aria-invalid":o??p==="error",autoComplete:e,autoSelect:a,className:s("pointer-coarse:text-base h-9 text-sm","bg-form relative block w-full rounded-md border px-3 py-2 border-form text-strong","placeholder:text-placeholder","aria-disabled:opacity-50","hover:border-neutral-400","focus:outline-hidden focus:ring-4 aria-expanded:ring-4","focus:border-accent-600 focus:ring-focus-accent aria-expanded:border-accent-600 aria-expanded:ring-focus-accent","data-validation-success:border-success-600 data-validation-success:focus:border-success-600 data-validation-success:focus:ring-focus-success data-validation-success:aria-expanded:border-success-600 data-validation-success:aria-expanded:ring-focus-success","data-validation-warning:border-warning-600 data-validation-warning:focus:border-warning-600 data-validation-warning:focus:ring-focus-warning data-validation-warning:aria-expanded:border-warning-600 data-validation-warning:aria-expanded:ring-focus-warning","data-validation-error:border-danger-600 data-validation-error:focus:border-danger-600 data-validation-error:focus:ring-focus-danger data-validation-error:aria-expanded:border-danger-600 data-validation-error:aria-expanded:ring-focus-danger","autofill:shadow-[var(--color-blue-50)] autofill:bg-blue-50 autofill:[-webkit-text-fill-color:var(--text-color-strong)]",n),"data-validation":p||void 0,ref:d,...m})});x.displayName="ComboboxInput";var C=b(({asChild:o=!1,children:e,className:a,sameWidth:n=!0,unmountOnHide:r=!0,...m},d)=>t(i.ComboboxPopover,{className:s("border-popover bg-popover relative z-50 max-h-96 min-w-[8rem] overflow-hidden rounded-md border shadow-md p-1 my-1",a),ref:d,render:o?({ref:u,...p})=>t(l,{ref:u,...p}):void 0,sameWidth:n,unmountOnHide:r,...m,children:e}));C.displayName="ComboboxContent";var w=I(void 0),v=b(({asChild:o=!1,children:e,className:a,focusOnHover:n=!0,value:r,...m},d)=>t(w.Provider,{value:r,children:t(i.ComboboxItem,{className:s("cursor-pointer rounded px-2 py-1.5 text-sm flex min-w-0 gap-2 items-center","data-active-item:bg-popover-hover","aria-disabled:opacity-50",a),focusOnHover:n,ref:d,render:o?({ref:u,...p})=>t(l,{ref:u,...p}):void 0,value:r,...m,children:e})}));v.displayName="ComboboxItem";var P=b(({asChild:o=!1,children:e,className:a,...n},r)=>t(i.ComboboxGroup,{className:s("",a),ref:r,render:o?({ref:m,...d})=>t(l,{ref:m,...d}):void 0,...n,children:e}));P.displayName="ComboboxGroup";var y=b(({asChild:o=!1,children:e,className:a,...n},r)=>t(i.ComboboxGroupLabel,{className:s("text-muted px-2 py-1 text-xs font-medium",a),ref:r,render:o?({ref:m,...d})=>t(l,{ref:m,...d}):void 0,...n,children:e}));y.displayName="ComboboxGroupLabel";var g=b(({asChild:o=!1,className:e,...a},n)=>t(i.ComboboxItemValue,{className:s("*:data-[user-value]:font-bold flex-1 shrink-0 text-strong font-normal",e),ref:n,render:o?({ref:r,...m})=>t(l,{ref:r,...m}):void 0,...a}));g.displayName="ComboboxItemValue";var h=b(({className:o,...e},a)=>t(f,{ref:a,className:s("-mx-1.25 my-1 w-auto",o),...e}));h.displayName="ComboboxSeparator";var G={Root:c,Content:C,Group:P,GroupLabel:y,Input:x,Item:v,ItemValue:g,Separator:h};export{G as Combobox};
+import{b as f}from"./chunk-J6ZF5J72.js";import{a as s}from"./chunk-AZ56JGNY.js";import*as i from"@ariakit/react";import{Slot as l}from"@radix-ui/react-slot";import{createContext as I,forwardRef as b}from"react";import{jsx as t}from"react/jsx-runtime";var c=({children:o,...e})=>t(i.ComboboxProvider,{...e,children:o});c.displayName="Combobox";var x=b(({"aria-invalid":o,autoComplete:e="list",autoSelect:a="always",className:n,validation:r,...m},d)=>{let p=o!=null&&o!=="false"?"error":typeof r=="function"?r():r;return t(i.Combobox,{"aria-invalid":o??p==="error",autoComplete:e,autoSelect:a,className:s("pointer-coarse:text-base h-9 text-sm","bg-form relative block w-full rounded-md border px-3 py-2 border-form text-strong","placeholder:text-placeholder","aria-disabled:opacity-50","hover:border-neutral-400","focus:outline-hidden focus:ring-4 aria-expanded:ring-4","focus:border-accent-600 focus:ring-focus-accent aria-expanded:border-accent-600 aria-expanded:ring-focus-accent","data-validation-success:border-success-600 data-validation-success:focus:border-success-600 data-validation-success:focus:ring-focus-success data-validation-success:aria-expanded:border-success-600 data-validation-success:aria-expanded:ring-focus-success","data-validation-warning:border-warning-600 data-validation-warning:focus:border-warning-600 data-validation-warning:focus:ring-focus-warning data-validation-warning:aria-expanded:border-warning-600 data-validation-warning:aria-expanded:ring-focus-warning","data-validation-error:border-danger-600 data-validation-error:focus:border-danger-600 data-validation-error:focus:ring-focus-danger data-validation-error:aria-expanded:border-danger-600 data-validation-error:aria-expanded:ring-focus-danger","autofill:shadow-[var(--color-blue-50)] autofill:bg-blue-50 autofill:[-webkit-text-fill-color:var(--text-color-strong)]",n),"data-validation":p||void 0,ref:d,...m})});x.displayName="ComboboxInput";var C=b(({asChild:o=!1,children:e,className:a,sameWidth:n=!0,unmountOnHide:r=!0,...m},d)=>t(i.ComboboxPopover,{className:s("border-popover bg-popover relative z-50 max-h-96 min-w-[8rem] scrollbar overflow-y-scroll overflow-x-hidden rounded-md border shadow-md p-1 my-2 focus:outline-hidden",a),ref:d,render:o?({ref:u,...p})=>t(l,{ref:u,...p}):void 0,sameWidth:n,unmountOnHide:r,...m,children:e}));C.displayName="ComboboxContent";var w=I(void 0),v=b(({asChild:o=!1,children:e,className:a,focusOnHover:n=!0,value:r,...m},d)=>t(w.Provider,{value:r,children:t(i.ComboboxItem,{className:s("cursor-pointer rounded px-2 py-1.5 text-sm flex min-w-0 gap-2 items-center","data-active-item:bg-popover-hover","aria-disabled:opacity-50",a),focusOnHover:n,ref:d,render:o?({ref:u,...p})=>t(l,{ref:u,...p}):void 0,value:r,...m,children:e})}));v.displayName="ComboboxItem";var P=b(({asChild:o=!1,children:e,className:a,...n},r)=>t(i.ComboboxGroup,{className:s("",a),ref:r,render:o?({ref:m,...d})=>t(l,{ref:m,...d}):void 0,...n,children:e}));P.displayName="ComboboxGroup";var y=b(({asChild:o=!1,children:e,className:a,...n},r)=>t(i.ComboboxGroupLabel,{className:s("text-muted px-2 py-1 text-xs font-medium",a),ref:r,render:o?({ref:m,...d})=>t(l,{ref:m,...d}):void 0,...n,children:e}));y.displayName="ComboboxGroupLabel";var g=b(({asChild:o=!1,className:e,...a},n)=>t(i.ComboboxItemValue,{className:s("*:data-[user-value]:font-bold flex-1 shrink-0 text-strong font-normal",e),ref:n,render:o?({ref:r,...m})=>t(l,{ref:r,...m}):void 0,...a}));g.displayName="ComboboxItemValue";var h=b(({className:o,...e},a)=>t(f,{ref:a,className:s("-mx-1.25 my-1 w-auto",o),...e}));h.displayName="ComboboxSeparator";var G={Root:c,Content:C,Group:P,GroupLabel:y,Input:x,Item:v,ItemValue:g,Separator:h};export{G as Combobox};
 //# sourceMappingURL=combobox.js.map

package/dist/combobox.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/combobox/combobox.tsx"],"sourcesContent":["\"use client\";\n\nimport * as Primitive from \"@ariakit/react\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport {\n\ttype ComponentPropsWithoutRef,\n\ttype ComponentRef,\n\ttype ElementRef,\n\tcreateContext,\n\tforwardRef,\n} from \"react\";\nimport type { WithAsChild } from \"../../types/as-child.js\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport type { WithValidation } from \"../input/types.js\";\nimport { Separator } from \"../separator/separator.js\";\n\ntype ComboboxProps = Primitive.ComboboxProviderProps;\n\n/**\n * Root component for a combobox. Provides a combobox store that controls the state of Combobox components.\n *\n * @example\n * <Combobox.Root>\n *   <Combobox.Input />\n *   <Combobox.Content>\n *     <Combobox.Item value=\"Apple\" />\n *     <Combobox.Item value=\"Banana\" />\n *   </Combobox.Content>\n * </Combobox.Root>\n */\nconst Root = ({ children, ...props }: ComboboxProps) => {\n\treturn (\n\t\t<Primitive.ComboboxProvider {...props}>\n\t\t\t{children}\n\t\t</Primitive.ComboboxProvider>\n\t);\n};\nRoot.displayName = \"Combobox\";\n\ntype ComboboxInputProps = Omit<\n\tPrimitive.ComboboxProps,\n\t\"render\" // we don't support a render prop for the combobox input\n> &\n\tWithValidation;\n\n/**\n * Renders a combobox input element that can be used to filter a list of items.\n *\n * @example\n * <Combobox.Root>\n *   <Combobox.Input />\n *   <Combobox.Content>\n *     <Combobox.Item value=\"Apple\" />\n *     <Combobox.Item value=\"Banana\" />\n *   </Combobox.Content>\n * </Combobox.Root>\n */\nconst Input = forwardRef<ComponentRef<\"input\">, ComboboxInputProps>(\n\t(\n\t\t{\n\t\t\t\"aria-invalid\": _ariaInvalid,\n\t\t\tautoComplete = \"list\",\n\t\t\tautoSelect = \"always\",\n\t\t\tclassName,\n\t\t\tvalidation: _validation,\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => {\n\t\tconst isInvalid = _ariaInvalid != null && _ariaInvalid !== \"false\";\n\t\tconst validation = isInvalid\n\t\t\t? \"error\"\n\t\t\t: typeof _validation === \"function\"\n\t\t\t\t? _validation()\n\t\t\t\t: _validation;\n\t\tconst ariaInvalid = _ariaInvalid ?? validation === \"error\";\n\n\t\treturn (\n\t\t\t<Primitive.Combobox\n\t\t\t\taria-invalid={ariaInvalid}\n\t\t\t\tautoComplete={autoComplete}\n\t\t\t\tautoSelect={autoSelect}\n\t\t\t\tclassName={cx(\n\t\t\t\t\t\"pointer-coarse:text-base h-9 text-sm\",\n\t\t\t\t\t\"bg-form relative block w-full rounded-md border px-3 py-2 border-form text-strong\",\n\t\t\t\t\t\"placeholder:text-placeholder\",\n\t\t\t\t\t\"aria-disabled:opacity-50\",\n\t\t\t\t\t\"hover:border-neutral-400\",\n\t\t\t\t\t\"focus:outline-hidden focus:ring-4 aria-expanded:ring-4\",\n\t\t\t\t\t\"focus:border-accent-600 focus:ring-focus-accent aria-expanded:border-accent-600 aria-expanded:ring-focus-accent\",\n\t\t\t\t\t\"data-validation-success:border-success-600 data-validation-success:focus:border-success-600 data-validation-success:focus:ring-focus-success data-validation-success:aria-expanded:border-success-600 data-validation-success:aria-expanded:ring-focus-success\",\n\t\t\t\t\t\"data-validation-warning:border-warning-600 data-validation-warning:focus:border-warning-600 data-validation-warning:focus:ring-focus-warning data-validation-warning:aria-expanded:border-warning-600 data-validation-warning:aria-expanded:ring-focus-warning\",\n\t\t\t\t\t\"data-validation-error:border-danger-600 data-validation-error:focus:border-danger-600 data-validation-error:focus:ring-focus-danger data-validation-error:aria-expanded:border-danger-600 data-validation-error:aria-expanded:ring-focus-danger\",\n\t\t\t\t\t\"autofill:shadow-[var(--color-blue-50)] autofill:bg-blue-50 autofill:[-webkit-text-fill-color:var(--text-color-strong)]\", // Autofill styling on the input itself and any children with autofill styling\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\tdata-validation={validation || undefined}\n\t\t\t\tref={ref}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t);\n\t},\n);\nInput.displayName = \"ComboboxInput\";\n\ntype ComboboxContentProps = Omit<Primitive.ComboboxPopoverProps, \"render\"> &\n\tWithAsChild;\n\n/**\n * Renders a popover that contains combobox content, e.g. Combobox.Items, Combobox.Groups, and Combobox.Separators.\n *\n * @example\n * <Combobox.Root>\n *   <Combobox.Input />\n *   <Combobox.Content>\n *     <Combobox.Item value=\"Apple\" />\n *     <Combobox.Item value=\"Banana\" />\n *   </Combobox.Content>\n * </Combobox.Root>\n */\nconst Content = forwardRef<\n\tComponentRef<typeof Primitive.ComboboxPopover>,\n\tComboboxContentProps\n>(\n\t(\n\t\t{\n\t\t\tasChild = false,\n\t\t\tchildren,\n\t\t\tclassName,\n\t\t\tsameWidth = true,\n\t\t\tunmountOnHide = true,\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => {\n\t\treturn (\n\t\t\t<Primitive.ComboboxPopover\n\t\t\t\tclassName={cx(\n\t\t\t\t\t\"border-popover bg-popover relative z-50 max-h-96 min-w-[8rem] overflow-hidden rounded-md border shadow-md p-1 my-1\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\tref={ref}\n\t\t\t\trender={\n\t\t\t\t\tasChild\n\t\t\t\t\t\t? ({ ref, ...childProps }) => <Slot ref={ref} {...childProps} />\n\t\t\t\t\t\t: undefined\n\t\t\t\t}\n\t\t\t\tsameWidth={sameWidth}\n\t\t\t\tunmountOnHide={unmountOnHide}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</Primitive.ComboboxPopover>\n\t\t);\n\t},\n);\nContent.displayName = \"ComboboxContent\";\n\ntype ComboboxItemProps = Omit<Primitive.ComboboxItemProps, \"render\"> &\n\tWithAsChild;\n\nconst ComboboxItemValueContext = createContext<string | undefined>(undefined);\n\n/**\n * Renders a combobox item inside a Combobox.Content component.\n *\n * @example\n * <Combobox.Root>\n *   <Combobox.Input />\n *   <Combobox.Content>\n *     <Combobox.Item value=\"Apple\" />\n *     <Combobox.Item value=\"Banana\" />\n *     <Combobox.Item value=\"Orange\" />\n *   </Combobox.Content>\n * </Combobox.Root>\n */\nconst Item = forwardRef<\n\tComponentRef<typeof Primitive.ComboboxItem>,\n\tComboboxItemProps\n>(\n\t(\n\t\t{\n\t\t\tasChild = false,\n\t\t\tchildren,\n\t\t\tclassName,\n\t\t\tfocusOnHover = true,\n\t\t\tvalue,\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => {\n\t\treturn (\n\t\t\t<ComboboxItemValueContext.Provider value={value}>\n\t\t\t\t<Primitive.ComboboxItem\n\t\t\t\t\tclassName={cx(\n\t\t\t\t\t\t\"cursor-pointer rounded px-2 py-1.5 text-sm flex min-w-0 gap-2 items-center\",\n\t\t\t\t\t\t\"data-active-item:bg-popover-hover\",\n\t\t\t\t\t\t\"aria-disabled:opacity-50\",\n\t\t\t\t\t\tclassName,\n\t\t\t\t\t)}\n\t\t\t\t\tfocusOnHover={focusOnHover}\n\t\t\t\t\tref={ref}\n\t\t\t\t\trender={\n\t\t\t\t\t\tasChild\n\t\t\t\t\t\t\t? ({ ref, ...childProps }) => <Slot ref={ref} {...childProps} />\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t\tvalue={value}\n\t\t\t\t\t{...props}\n\t\t\t\t>\n\t\t\t\t\t{children}\n\t\t\t\t</Primitive.ComboboxItem>\n\t\t\t</ComboboxItemValueContext.Provider>\n\t\t);\n\t},\n);\nItem.displayName = \"ComboboxItem\";\n\ntype ComboboxGroupProps = Omit<Primitive.ComboboxGroupProps, \"render\"> &\n\tWithAsChild;\n\n/**\n * Renders a group for Combobox.Item elements.\n *\n * Optionally, a Combobox.GroupLabel can be rendered as a child to provide a label for the group.\n *\n * You should only reach for this component when it semantically makes sense to group items together, such as when a label is needed.\n *\n * @example\n * <Combobox.Root>\n *   <Combobox.Input />\n *   <Combobox.Content>\n *     <Combobox.Group>\n *       <Combobox.GroupLabel>Fruits</Combobox.GroupLabel>\n *       <Combobox.Item value=\"Apple\" />\n *       <Combobox.Item value=\"Banana\" />\n *     </Combobox.Group>\n *   </Combobox.Content>\n * </Combobox.Root>\n */\nconst Group = forwardRef<\n\tComponentRef<typeof Primitive.ComboboxGroup>,\n\tComboboxGroupProps\n>(({ asChild = false, children, className, ...props }, ref) => {\n\treturn (\n\t\t<Primitive.ComboboxGroup\n\t\t\tclassName={cx(\"\", className)}\n\t\t\tref={ref}\n\t\t\trender={\n\t\t\t\tasChild\n\t\t\t\t\t? ({ ref, ...childProps }) => <Slot ref={ref} {...childProps} />\n\t\t\t\t\t: undefined\n\t\t\t}\n\t\t\t{...props}\n\t\t>\n\t\t\t{children}\n\t\t</Primitive.ComboboxGroup>\n\t);\n});\nGroup.displayName = \"ComboboxGroup\";\n\ntype ComboboxGroupLabelProps = Omit<\n\tPrimitive.ComboboxGroupLabelProps,\n\t\"render\"\n> &\n\tWithAsChild;\n\n/**\n * Renders a label in a combobox group.\n *\n * This component should be wrapped with Combobox.Group so the aria-labelledby is correctly set on the group element.\n *\n * You should only reach for this component when it semantically makes sense to group items together, such as when a label is needed.\n *\n * @example\n * <Combobox.Root>\n *   <Combobox.Input />\n *   <Combobox.Content>\n *     <Combobox.Group>\n *       <Combobox.GroupLabel>Fruits</Combobox.GroupLabel>\n *       <Combobox.Item value=\"Apple\" />\n *       <Combobox.Item value=\"Banana\" />\n *     </Combobox.Group>\n *   </Combobox.Content>\n * </Combobox.Root>\n */\nconst GroupLabel = forwardRef<\n\tComponentRef<typeof Primitive.ComboboxGroupLabel>,\n\tComboboxGroupLabelProps\n>(({ asChild = false, children, className, ...props }, ref) => {\n\treturn (\n\t\t<Primitive.ComboboxGroupLabel\n\t\t\tclassName={cx(\"text-muted px-2 py-1 text-xs font-medium\", className)}\n\t\t\tref={ref}\n\t\t\trender={\n\t\t\t\tasChild\n\t\t\t\t\t? ({ ref, ...childProps }) => <Slot ref={ref} {...childProps} />\n\t\t\t\t\t: undefined\n\t\t\t}\n\t\t\t{...props}\n\t\t>\n\t\t\t{children}\n\t\t</Primitive.ComboboxGroupLabel>\n\t);\n});\nGroupLabel.displayName = \"ComboboxGroupLabel\";\n\ntype ComboboxItemValueProps = Omit<\n\tPrimitive.ComboboxItemValueProps<\"span\">,\n\t\"render\"\n> &\n\tWithAsChild;\n\n/**\n * Highlights the match between the current Combobox.Input value (userValue) and parent Combobox.Item value.\n *\n * Renders a span element with the combobox item value as children.\n * The value is split into span elements.\n * Portions of the value matching the user input will have a data-user-value attribute, while the rest will have a data-autocomplete-value attribute.\n *\n * Should only be used as a child of Combobox.Item.\n * The item value is automatically set to the value of the closest Combobox.Item component's value prop.\n * The user input value is automatically set to the combobox store's value state.\n * Both values can be overridden by providing the value and userValue props, respectively.\n *\n * @example\n * <Combobox.Root>\n *   <Combobox.Input />\n *   <Combobox.Content>\n *     <Combobox.Item value=\"Apple\">\n *       🍎\n *       <Combobox.ItemValue />\n *     </Combobox.Item>\n *     <Combobox.Item value=\"Banana\">\n *       🍌\n *       <Combobox.ItemValue />\n *     </Combobox.Item>\n *   </Combobox.Content>\n * </Combobox.Root>\n */\nconst ItemValue = forwardRef<\n\tComponentRef<typeof Primitive.ComboboxItemValue>,\n\tComboboxItemValueProps\n>(({ asChild = false, className, ...props }, ref) => {\n\treturn (\n\t\t<Primitive.ComboboxItemValue\n\t\t\tclassName={cx(\n\t\t\t\t\"*:data-[user-value]:font-bold flex-1 shrink-0 text-strong font-normal\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\tref={ref}\n\t\t\trender={\n\t\t\t\tasChild\n\t\t\t\t\t? ({ ref, ...childProps }) => <Slot ref={ref} {...childProps} />\n\t\t\t\t\t: undefined\n\t\t\t}\n\t\t\t{...props}\n\t\t/>\n\t);\n});\nItemValue.displayName = \"ComboboxItemValue\";\n\n/**\n * Renders a separator between Combobox.Items or Combobox.Groups.\n *\n * @example\n * <Combobox.Root>\n *   <Combobox.Input />\n *   <Combobox.Content>\n *     <Combobox.Group>\n *       <Combobox.Item value=\"Apple\" />\n *       <Combobox.Item value=\"Banana\" />\n *     </Combobox.Group>\n *     <Combobox.Separator />\n *     <Combobox.Item>\n *       Click me!\n *     </Combobox.Item>\n *   </Combobox.Content>\n * </Combobox.Root>\n */\nconst ComboboxSeparatorComponent = forwardRef<\n\tElementRef<typeof Separator>,\n\tComponentPropsWithoutRef<typeof Separator>\n>(({ className, ...props }, ref) => (\n\t<Separator\n\t\tref={ref}\n\t\tclassName={cx(\"-mx-1.25 my-1 w-auto\", className)}\n\t\t{...props}\n\t/>\n));\nComboboxSeparatorComponent.displayName = \"ComboboxSeparator\";\n\n/**\n * Fill in a React input field with autocomplete & autosuggest functionalities.\n * Choose from a list of suggested values with full keyboard support.\n * This component is based on the WAI-ARIA Combobox Pattern and is powered by the\n * ariakit Combobox.\n *\n * @see https://www.w3.org/WAI/ARIA/apg/patterns/combobox/\n * @see https://ariakit.org/components/combobox\n *\n * @see https://mantle.ngrok.com/components/combobox\n *\n * @example\n * <Combobox.Root>\n *   <Combobox.Input />\n *   <Combobox.Content>\n *     <Combobox.Item value=\"Apple\" />\n *     <Combobox.Item value=\"Banana\" />\n *   </Combobox.Content>\n * </Combobox.Root>\n */\nconst Combobox = {\n\t/**\n\t * Root component for a combobox. Provides a combobox store that controls the state of Combobox components.\n\t *\n\t * @see https://mantle.ngrok.com/components/combobox#api-combobox-root\n\t *\n\t * @example\n\t * ```tsx\n\t * <Combobox.Root>\n\t *   <Combobox.Input />\n\t *   <Combobox.Content>\n\t *     <Combobox.Item value=\"Apple\" />\n\t *     <Combobox.Item value=\"Banana\" />\n\t *   </Combobox.Content>\n\t * </Combobox.Root>\n\t * ```\n\t */\n\tRoot,\n\t/**\n\t * Renders a popover that contains combobox content, e.g. Combobox.Items, Combobox.Groups, and Combobox.Separators.\n\t *\n\t * @see https://mantle.ngrok.com/components/combobox#api-combobox-content\n\t *\n\t * @example\n\t * ```tsx\n\t * <Combobox.Root>\n\t *   <Combobox.Input />\n\t *   <Combobox.Content>\n\t *     <Combobox.Item value=\"Apple\" />\n\t *     <Combobox.Item value=\"Banana\" />\n\t *   </Combobox.Content>\n\t * </Combobox.Root>\n\t * ```\n\t */\n\tContent,\n\t/**\n\t * Renders a group for Combobox.Item elements.\n\t *\n\t * @see https://mantle.ngrok.com/components/combobox#api-combobox-group\n\t *\n\t * @example\n\t * ```tsx\n\t * <Combobox.Root>\n\t *   <Combobox.Input />\n\t *   <Combobox.Content>\n\t *     <Combobox.Group>\n\t *       <Combobox.GroupLabel>Fruits</Combobox.GroupLabel>\n\t *       <Combobox.Item value=\"Apple\" />\n\t *       <Combobox.Item value=\"Banana\" />\n\t *     </Combobox.Group>\n\t *   </Combobox.Content>\n\t * </Combobox.Root>\n\t * ```\n\t */\n\tGroup,\n\t/**\n\t * Renders a label in a combobox group.\n\t *\n\t * @see https://mantle.ngrok.com/components/combobox#api-combobox-group-label\n\t *\n\t * @example\n\t * ```tsx\n\t * <Combobox.Root>\n\t *   <Combobox.Input />\n\t *   <Combobox.Content>\n\t *     <Combobox.Group>\n\t *       <Combobox.GroupLabel>Fruits</Combobox.GroupLabel>\n\t *       <Combobox.Item value=\"Apple\" />\n\t *       <Combobox.Item value=\"Banana\" />\n\t *     </Combobox.Group>\n\t *   </Combobox.Content>\n\t * </Combobox.Root>\n\t * ```\n\t */\n\tGroupLabel,\n\t/**\n\t * Renders a combobox input element that can be used to filter a list of items.\n\t *\n\t * @see https://mantle.ngrok.com/components/combobox#api-combobox-input\n\t *\n\t * @example\n\t * ```tsx\n\t * <Combobox.Root>\n\t *   <Combobox.Input />\n\t *   <Combobox.Content>\n\t *     <Combobox.Item value=\"Apple\" />\n\t *     <Combobox.Item value=\"Banana\" />\n\t *   </Combobox.Content>\n\t * </Combobox.Root>\n\t * ```\n\t */\n\tInput,\n\t/**\n\t * Renders a combobox item inside a Combobox.Content component.\n\t *\n\t * @see https://mantle.ngrok.com/components/combobox#api-combobox-item\n\t *\n\t * @example\n\t * ```tsx\n\t * <Combobox.Root>\n\t *   <Combobox.Input />\n\t *   <Combobox.Content>\n\t *     <Combobox.Item value=\"Apple\" />\n\t *     <Combobox.Item value=\"Banana\" />\n\t *     <Combobox.Item value=\"Orange\" />\n\t *   </Combobox.Content>\n\t * </Combobox.Root>\n\t * ```\n\t */\n\tItem,\n\t/**\n\t * Highlights the match between the current Combobox.Input value and parent Combobox.Item value.\n\t *\n\t * @see https://mantle.ngrok.com/components/combobox#api-combobox-item-value\n\t *\n\t * @example\n\t * ```tsx\n\t * <Combobox.Root>\n\t *   <Combobox.Input />\n\t *   <Combobox.Content>\n\t *     <Combobox.Item value=\"Apple\">\n\t *       🍎\n\t *       <Combobox.ItemValue />\n\t *     </Combobox.Item>\n\t *     <Combobox.Item value=\"Banana\">\n\t *       🍌\n\t *       <Combobox.ItemValue />\n\t *     </Combobox.Item>\n\t *   </Combobox.Content>\n\t * </Combobox.Root>\n\t * ```\n\t */\n\tItemValue,\n\t/**\n\t * Renders a separator between Combobox.Items or Combobox.Groups.\n\t *\n\t * @see https://mantle.ngrok.com/components/combobox#api-combobox-separator\n\t *\n\t * @example\n\t * ```tsx\n\t * <Combobox.Root>\n\t *   <Combobox.Input />\n\t *   <Combobox.Content>\n\t *     <Combobox.Group>\n\t *       <Combobox.Item value=\"Apple\" />\n\t *       <Combobox.Item value=\"Banana\" />\n\t *     </Combobox.Group>\n\t *     <Combobox.Separator />\n\t *     <Combobox.Item>\n\t *       Click me!\n\t *     </Combobox.Item>\n\t *   </Combobox.Content>\n\t * </Combobox.Root>\n\t * ```\n\t */\n\tSeparator: ComboboxSeparatorComponent,\n} as const;\n\nexport {\n\t//,\n\tCombobox,\n};\n"],"mappings":"gFAEA,UAAYA,MAAe,iBAC3B,OAAS,QAAAC,MAAY,uBACrB,OAIC,iBAAAC,EACA,cAAAC,MACM,QAsBL,cAAAC,MAAA,oBAFF,IAAMC,EAAO,CAAC,CAAE,SAAAC,EAAU,GAAGC,CAAM,IAEjCH,EAAW,mBAAV,CAA4B,GAAGG,EAC9B,SAAAD,EACF,EAGFD,EAAK,YAAc,WAoBnB,IAAMG,EAAQC,EACb,CACC,CACC,eAAgBC,EAChB,aAAAC,EAAe,OACf,WAAAC,EAAa,SACb,UAAAC,EACA,WAAYC,EACZ,GAAGP,CACJ,EACAQ,IACI,CAEJ,IAAMC,EADYN,GAAgB,MAAQA,IAAiB,QAExD,QACA,OAAOI,GAAgB,WACtBA,EAAY,EACZA,EAGJ,OACCV,EAAW,WAAV,CACA,eAJkBM,GAAgBM,IAAe,QAKjD,aAAcL,EACd,WAAYC,EACZ,UAAWK,EACV,uCACA,oFACA,+BACA,2BACA,2BACA,yDACA,kHACA,iQACA,iQACA,kPACA,yHACAJ,CACD,EACA,kBAAiBG,GAAc,OAC/B,IAAKD,EACJ,GAAGR,EACL,CAEF,CACD,EACAC,EAAM,YAAc,gBAiBpB,IAAMU,EAAUT,EAIf,CACC,CACC,QAAAU,EAAU,GACV,SAAAb,EACA,UAAAO,EACA,UAAAO,EAAY,GACZ,cAAAC,EAAgB,GAChB,GAAGd,CACJ,EACAQ,IAGCX,EAAW,kBAAV,CACA,UAAWa,EACV,qHACAJ,CACD,EACA,IAAKE,EACL,OACCI,EACG,CAAC,CAAE,IAAAJ,EAAK,GAAGO,CAAW,IAAMlB,EAACmB,EAAA,CAAK,IAAKR,EAAM,GAAGO,EAAY,EAC5D,OAEJ,UAAWF,EACX,cAAeC,EACd,GAAGd,EAEH,SAAAD,EACF,CAGH,EACAY,EAAQ,YAAc,kBAKtB,IAAMM,EAA2BC,EAAkC,MAAS,EAetEC,EAAOjB,EAIZ,CACC,CACC,QAAAU,EAAU,GACV,SAAAb,EACA,UAAAO,EACA,aAAAc,EAAe,GACf,MAAAC,EACA,GAAGrB,CACJ,EACAQ,IAGCX,EAACoB,EAAyB,SAAzB,CAAkC,MAAOI,EACzC,SAAAxB,EAAW,eAAV,CACA,UAAWa,EACV,6EACA,oCACA,2BACAJ,CACD,EACA,aAAcc,EACd,IAAKZ,EACL,OACCI,EACG,CAAC,CAAE,IAAAJ,EAAK,GAAGO,CAAW,IAAMlB,EAACmB,EAAA,CAAK,IAAKR,EAAM,GAAGO,EAAY,EAC5D,OAEJ,MAAOM,EACN,GAAGrB,EAEH,SAAAD,EACF,EACD,CAGH,EACAoB,EAAK,YAAc,eAwBnB,IAAMG,EAAQpB,EAGZ,CAAC,CAAE,QAAAU,EAAU,GAAO,SAAAb,EAAU,UAAAO,EAAW,GAAGN,CAAM,EAAGQ,IAErDX,EAAW,gBAAV,CACA,UAAWa,EAAG,GAAIJ,CAAS,EAC3B,IAAKE,EACL,OACCI,EACG,CAAC,CAAE,IAAAJ,EAAK,GAAGO,CAAW,IAAMlB,EAACmB,EAAA,CAAK,IAAKR,EAAM,GAAGO,EAAY,EAC5D,OAEH,GAAGf,EAEH,SAAAD,EACF,CAED,EACDuB,EAAM,YAAc,gBA2BpB,IAAMC,EAAarB,EAGjB,CAAC,CAAE,QAAAU,EAAU,GAAO,SAAAb,EAAU,UAAAO,EAAW,GAAGN,CAAM,EAAGQ,IAErDX,EAAW,qBAAV,CACA,UAAWa,EAAG,2CAA4CJ,CAAS,EACnE,IAAKE,EACL,OACCI,EACG,CAAC,CAAE,IAAAJ,EAAK,GAAGO,CAAW,IAAMlB,EAACmB,EAAA,CAAK,IAAKR,EAAM,GAAGO,EAAY,EAC5D,OAEH,GAAGf,EAEH,SAAAD,EACF,CAED,EACDwB,EAAW,YAAc,qBAmCzB,IAAMC,EAAYtB,EAGhB,CAAC,CAAE,QAAAU,EAAU,GAAO,UAAAN,EAAW,GAAGN,CAAM,EAAGQ,IAE3CX,EAAW,oBAAV,CACA,UAAWa,EACV,wEACAJ,CACD,EACA,IAAKE,EACL,OACCI,EACG,CAAC,CAAE,IAAAJ,EAAK,GAAGO,CAAW,IAAMlB,EAACmB,EAAA,CAAK,IAAKR,EAAM,GAAGO,EAAY,EAC5D,OAEH,GAAGf,EACL,CAED,EACDwB,EAAU,YAAc,oBAoBxB,IAAMC,EAA6BvB,EAGjC,CAAC,CAAE,UAAAI,EAAW,GAAGN,CAAM,EAAGQ,IAC3BX,EAAC6B,EAAA,CACA,IAAKlB,EACL,UAAWE,EAAG,uBAAwBJ,CAAS,EAC9C,GAAGN,EACL,CACA,EACDyB,EAA2B,YAAc,oBAsBzC,IAAME,EAAW,CAiBhB,KAAA7B,EAiBA,QAAAa,EAoBA,MAAAW,EAoBA,WAAAC,EAiBA,MAAAtB,EAkBA,KAAAkB,EAuBA,UAAAK,EAuBA,UAAWC,CACZ","names":["Primitive","Slot","createContext","forwardRef","jsx","Root","children","props","Input","forwardRef","_ariaInvalid","autoComplete","autoSelect","className","_validation","ref","validation","cx","Content","asChild","sameWidth","unmountOnHide","childProps","Slot","ComboboxItemValueContext","createContext","Item","focusOnHover","value","Group","GroupLabel","ItemValue","ComboboxSeparatorComponent","Separator","Combobox"]}
+{"version":3,"sources":["../src/components/combobox/combobox.tsx"],"sourcesContent":["\"use client\";\n\nimport * as Primitive from \"@ariakit/react\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport {\n\ttype ComponentPropsWithoutRef,\n\ttype ComponentRef,\n\ttype ElementRef,\n\tcreateContext,\n\tforwardRef,\n} from \"react\";\nimport type { WithAsChild } from \"../../types/as-child.js\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport type { WithValidation } from \"../input/types.js\";\nimport { Separator } from \"../separator/separator.js\";\n\ntype ComboboxProps = Primitive.ComboboxProviderProps;\n\n/**\n * Root component for a combobox. Provides a combobox store that controls the state of Combobox components.\n *\n * @example\n * <Combobox.Root>\n *   <Combobox.Input />\n *   <Combobox.Content>\n *     <Combobox.Item value=\"Apple\" />\n *     <Combobox.Item value=\"Banana\" />\n *   </Combobox.Content>\n * </Combobox.Root>\n */\nconst Root = ({ children, ...props }: ComboboxProps) => {\n\treturn (\n\t\t<Primitive.ComboboxProvider {...props}>\n\t\t\t{children}\n\t\t</Primitive.ComboboxProvider>\n\t);\n};\nRoot.displayName = \"Combobox\";\n\ntype ComboboxInputProps = Omit<\n\tPrimitive.ComboboxProps,\n\t\"render\" // we don't support a render prop for the combobox input\n> &\n\tWithValidation;\n\n/**\n * Renders a combobox input element that can be used to filter a list of items.\n *\n * @example\n * <Combobox.Root>\n *   <Combobox.Input />\n *   <Combobox.Content>\n *     <Combobox.Item value=\"Apple\" />\n *     <Combobox.Item value=\"Banana\" />\n *   </Combobox.Content>\n * </Combobox.Root>\n */\nconst Input = forwardRef<ComponentRef<\"input\">, ComboboxInputProps>(\n\t(\n\t\t{\n\t\t\t\"aria-invalid\": _ariaInvalid,\n\t\t\tautoComplete = \"list\",\n\t\t\tautoSelect = \"always\",\n\t\t\tclassName,\n\t\t\tvalidation: _validation,\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => {\n\t\tconst isInvalid = _ariaInvalid != null && _ariaInvalid !== \"false\";\n\t\tconst validation = isInvalid\n\t\t\t? \"error\"\n\t\t\t: typeof _validation === \"function\"\n\t\t\t\t? _validation()\n\t\t\t\t: _validation;\n\t\tconst ariaInvalid = _ariaInvalid ?? validation === \"error\";\n\n\t\treturn (\n\t\t\t<Primitive.Combobox\n\t\t\t\taria-invalid={ariaInvalid}\n\t\t\t\tautoComplete={autoComplete}\n\t\t\t\tautoSelect={autoSelect}\n\t\t\t\tclassName={cx(\n\t\t\t\t\t\"pointer-coarse:text-base h-9 text-sm\",\n\t\t\t\t\t\"bg-form relative block w-full rounded-md border px-3 py-2 border-form text-strong\",\n\t\t\t\t\t\"placeholder:text-placeholder\",\n\t\t\t\t\t\"aria-disabled:opacity-50\",\n\t\t\t\t\t\"hover:border-neutral-400\",\n\t\t\t\t\t\"focus:outline-hidden focus:ring-4 aria-expanded:ring-4\",\n\t\t\t\t\t\"focus:border-accent-600 focus:ring-focus-accent aria-expanded:border-accent-600 aria-expanded:ring-focus-accent\",\n\t\t\t\t\t\"data-validation-success:border-success-600 data-validation-success:focus:border-success-600 data-validation-success:focus:ring-focus-success data-validation-success:aria-expanded:border-success-600 data-validation-success:aria-expanded:ring-focus-success\",\n\t\t\t\t\t\"data-validation-warning:border-warning-600 data-validation-warning:focus:border-warning-600 data-validation-warning:focus:ring-focus-warning data-validation-warning:aria-expanded:border-warning-600 data-validation-warning:aria-expanded:ring-focus-warning\",\n\t\t\t\t\t\"data-validation-error:border-danger-600 data-validation-error:focus:border-danger-600 data-validation-error:focus:ring-focus-danger data-validation-error:aria-expanded:border-danger-600 data-validation-error:aria-expanded:ring-focus-danger\",\n\t\t\t\t\t\"autofill:shadow-[var(--color-blue-50)] autofill:bg-blue-50 autofill:[-webkit-text-fill-color:var(--text-color-strong)]\", // Autofill styling on the input itself and any children with autofill styling\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\tdata-validation={validation || undefined}\n\t\t\t\tref={ref}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t);\n\t},\n);\nInput.displayName = \"ComboboxInput\";\n\ntype ComboboxContentProps = Omit<Primitive.ComboboxPopoverProps, \"render\"> &\n\tWithAsChild;\n\n/**\n * Renders a popover that contains combobox content, e.g. Combobox.Items, Combobox.Groups, and Combobox.Separators.\n *\n * @example\n * <Combobox.Root>\n *   <Combobox.Input />\n *   <Combobox.Content>\n *     <Combobox.Item value=\"Apple\" />\n *     <Combobox.Item value=\"Banana\" />\n *   </Combobox.Content>\n * </Combobox.Root>\n */\nconst Content = forwardRef<\n\tComponentRef<typeof Primitive.ComboboxPopover>,\n\tComboboxContentProps\n>(\n\t(\n\t\t{\n\t\t\tasChild = false,\n\t\t\tchildren,\n\t\t\tclassName,\n\t\t\tsameWidth = true,\n\t\t\tunmountOnHide = true,\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => {\n\t\treturn (\n\t\t\t<Primitive.ComboboxPopover\n\t\t\t\tclassName={cx(\n\t\t\t\t\t\"border-popover bg-popover relative z-50 max-h-96 min-w-[8rem] scrollbar overflow-y-scroll overflow-x-hidden rounded-md border shadow-md p-1 my-2 focus:outline-hidden\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\tref={ref}\n\t\t\t\trender={\n\t\t\t\t\tasChild\n\t\t\t\t\t\t? ({ ref, ...childProps }) => <Slot ref={ref} {...childProps} />\n\t\t\t\t\t\t: undefined\n\t\t\t\t}\n\t\t\t\tsameWidth={sameWidth}\n\t\t\t\tunmountOnHide={unmountOnHide}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</Primitive.ComboboxPopover>\n\t\t);\n\t},\n);\nContent.displayName = \"ComboboxContent\";\n\ntype ComboboxItemProps = Omit<Primitive.ComboboxItemProps, \"render\"> &\n\tWithAsChild;\n\nconst ComboboxItemValueContext = createContext<string | undefined>(undefined);\n\n/**\n * Renders a combobox item inside a Combobox.Content component.\n *\n * @example\n * <Combobox.Root>\n *   <Combobox.Input />\n *   <Combobox.Content>\n *     <Combobox.Item value=\"Apple\" />\n *     <Combobox.Item value=\"Banana\" />\n *     <Combobox.Item value=\"Orange\" />\n *   </Combobox.Content>\n * </Combobox.Root>\n */\nconst Item = forwardRef<\n\tComponentRef<typeof Primitive.ComboboxItem>,\n\tComboboxItemProps\n>(\n\t(\n\t\t{\n\t\t\tasChild = false,\n\t\t\tchildren,\n\t\t\tclassName,\n\t\t\tfocusOnHover = true,\n\t\t\tvalue,\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => {\n\t\treturn (\n\t\t\t<ComboboxItemValueContext.Provider value={value}>\n\t\t\t\t<Primitive.ComboboxItem\n\t\t\t\t\tclassName={cx(\n\t\t\t\t\t\t\"cursor-pointer rounded px-2 py-1.5 text-sm flex min-w-0 gap-2 items-center\",\n\t\t\t\t\t\t\"data-active-item:bg-popover-hover\",\n\t\t\t\t\t\t\"aria-disabled:opacity-50\",\n\t\t\t\t\t\tclassName,\n\t\t\t\t\t)}\n\t\t\t\t\tfocusOnHover={focusOnHover}\n\t\t\t\t\tref={ref}\n\t\t\t\t\trender={\n\t\t\t\t\t\tasChild\n\t\t\t\t\t\t\t? ({ ref, ...childProps }) => <Slot ref={ref} {...childProps} />\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t\tvalue={value}\n\t\t\t\t\t{...props}\n\t\t\t\t>\n\t\t\t\t\t{children}\n\t\t\t\t</Primitive.ComboboxItem>\n\t\t\t</ComboboxItemValueContext.Provider>\n\t\t);\n\t},\n);\nItem.displayName = \"ComboboxItem\";\n\ntype ComboboxGroupProps = Omit<Primitive.ComboboxGroupProps, \"render\"> &\n\tWithAsChild;\n\n/**\n * Renders a group for Combobox.Item elements.\n *\n * Optionally, a Combobox.GroupLabel can be rendered as a child to provide a label for the group.\n *\n * You should only reach for this component when it semantically makes sense to group items together, such as when a label is needed.\n *\n * @example\n * <Combobox.Root>\n *   <Combobox.Input />\n *   <Combobox.Content>\n *     <Combobox.Group>\n *       <Combobox.GroupLabel>Fruits</Combobox.GroupLabel>\n *       <Combobox.Item value=\"Apple\" />\n *       <Combobox.Item value=\"Banana\" />\n *     </Combobox.Group>\n *   </Combobox.Content>\n * </Combobox.Root>\n */\nconst Group = forwardRef<\n\tComponentRef<typeof Primitive.ComboboxGroup>,\n\tComboboxGroupProps\n>(({ asChild = false, children, className, ...props }, ref) => {\n\treturn (\n\t\t<Primitive.ComboboxGroup\n\t\t\tclassName={cx(\"\", className)}\n\t\t\tref={ref}\n\t\t\trender={\n\t\t\t\tasChild\n\t\t\t\t\t? ({ ref, ...childProps }) => <Slot ref={ref} {...childProps} />\n\t\t\t\t\t: undefined\n\t\t\t}\n\t\t\t{...props}\n\t\t>\n\t\t\t{children}\n\t\t</Primitive.ComboboxGroup>\n\t);\n});\nGroup.displayName = \"ComboboxGroup\";\n\ntype ComboboxGroupLabelProps = Omit<\n\tPrimitive.ComboboxGroupLabelProps,\n\t\"render\"\n> &\n\tWithAsChild;\n\n/**\n * Renders a label in a combobox group.\n *\n * This component should be wrapped with Combobox.Group so the aria-labelledby is correctly set on the group element.\n *\n * You should only reach for this component when it semantically makes sense to group items together, such as when a label is needed.\n *\n * @example\n * <Combobox.Root>\n *   <Combobox.Input />\n *   <Combobox.Content>\n *     <Combobox.Group>\n *       <Combobox.GroupLabel>Fruits</Combobox.GroupLabel>\n *       <Combobox.Item value=\"Apple\" />\n *       <Combobox.Item value=\"Banana\" />\n *     </Combobox.Group>\n *   </Combobox.Content>\n * </Combobox.Root>\n */\nconst GroupLabel = forwardRef<\n\tComponentRef<typeof Primitive.ComboboxGroupLabel>,\n\tComboboxGroupLabelProps\n>(({ asChild = false, children, className, ...props }, ref) => {\n\treturn (\n\t\t<Primitive.ComboboxGroupLabel\n\t\t\tclassName={cx(\"text-muted px-2 py-1 text-xs font-medium\", className)}\n\t\t\tref={ref}\n\t\t\trender={\n\t\t\t\tasChild\n\t\t\t\t\t? ({ ref, ...childProps }) => <Slot ref={ref} {...childProps} />\n\t\t\t\t\t: undefined\n\t\t\t}\n\t\t\t{...props}\n\t\t>\n\t\t\t{children}\n\t\t</Primitive.ComboboxGroupLabel>\n\t);\n});\nGroupLabel.displayName = \"ComboboxGroupLabel\";\n\ntype ComboboxItemValueProps = Omit<\n\tPrimitive.ComboboxItemValueProps<\"span\">,\n\t\"render\"\n> &\n\tWithAsChild;\n\n/**\n * Highlights the match between the current Combobox.Input value (userValue) and parent Combobox.Item value.\n *\n * Renders a span element with the combobox item value as children.\n * The value is split into span elements.\n * Portions of the value matching the user input will have a data-user-value attribute, while the rest will have a data-autocomplete-value attribute.\n *\n * Should only be used as a child of Combobox.Item.\n * The item value is automatically set to the value of the closest Combobox.Item component's value prop.\n * The user input value is automatically set to the combobox store's value state.\n * Both values can be overridden by providing the value and userValue props, respectively.\n *\n * @example\n * <Combobox.Root>\n *   <Combobox.Input />\n *   <Combobox.Content>\n *     <Combobox.Item value=\"Apple\">\n *       🍎\n *       <Combobox.ItemValue />\n *     </Combobox.Item>\n *     <Combobox.Item value=\"Banana\">\n *       🍌\n *       <Combobox.ItemValue />\n *     </Combobox.Item>\n *   </Combobox.Content>\n * </Combobox.Root>\n */\nconst ItemValue = forwardRef<\n\tComponentRef<typeof Primitive.ComboboxItemValue>,\n\tComboboxItemValueProps\n>(({ asChild = false, className, ...props }, ref) => {\n\treturn (\n\t\t<Primitive.ComboboxItemValue\n\t\t\tclassName={cx(\n\t\t\t\t\"*:data-[user-value]:font-bold flex-1 shrink-0 text-strong font-normal\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\tref={ref}\n\t\t\trender={\n\t\t\t\tasChild\n\t\t\t\t\t? ({ ref, ...childProps }) => <Slot ref={ref} {...childProps} />\n\t\t\t\t\t: undefined\n\t\t\t}\n\t\t\t{...props}\n\t\t/>\n\t);\n});\nItemValue.displayName = \"ComboboxItemValue\";\n\n/**\n * Renders a separator between Combobox.Items or Combobox.Groups.\n *\n * @example\n * <Combobox.Root>\n *   <Combobox.Input />\n *   <Combobox.Content>\n *     <Combobox.Group>\n *       <Combobox.Item value=\"Apple\" />\n *       <Combobox.Item value=\"Banana\" />\n *     </Combobox.Group>\n *     <Combobox.Separator />\n *     <Combobox.Item>\n *       Click me!\n *     </Combobox.Item>\n *   </Combobox.Content>\n * </Combobox.Root>\n */\nconst ComboboxSeparatorComponent = forwardRef<\n\tElementRef<typeof Separator>,\n\tComponentPropsWithoutRef<typeof Separator>\n>(({ className, ...props }, ref) => (\n\t<Separator\n\t\tref={ref}\n\t\tclassName={cx(\"-mx-1.25 my-1 w-auto\", className)}\n\t\t{...props}\n\t/>\n));\nComboboxSeparatorComponent.displayName = \"ComboboxSeparator\";\n\n/**\n * Fill in a React input field with autocomplete & autosuggest functionalities.\n * Choose from a list of suggested values with full keyboard support.\n * This component is based on the WAI-ARIA Combobox Pattern and is powered by the\n * ariakit Combobox.\n *\n * @see https://www.w3.org/WAI/ARIA/apg/patterns/combobox/\n * @see https://ariakit.org/components/combobox\n *\n * @see https://mantle.ngrok.com/components/combobox\n *\n * @example\n * <Combobox.Root>\n *   <Combobox.Input />\n *   <Combobox.Content>\n *     <Combobox.Item value=\"Apple\" />\n *     <Combobox.Item value=\"Banana\" />\n *   </Combobox.Content>\n * </Combobox.Root>\n */\nconst Combobox = {\n\t/**\n\t * Root component for a combobox. Provides a combobox store that controls the state of Combobox components.\n\t *\n\t * @see https://mantle.ngrok.com/components/combobox#api-combobox-root\n\t *\n\t * @example\n\t * ```tsx\n\t * <Combobox.Root>\n\t *   <Combobox.Input />\n\t *   <Combobox.Content>\n\t *     <Combobox.Item value=\"Apple\" />\n\t *     <Combobox.Item value=\"Banana\" />\n\t *   </Combobox.Content>\n\t * </Combobox.Root>\n\t * ```\n\t */\n\tRoot,\n\t/**\n\t * Renders a popover that contains combobox content, e.g. Combobox.Items, Combobox.Groups, and Combobox.Separators.\n\t *\n\t * @see https://mantle.ngrok.com/components/combobox#api-combobox-content\n\t *\n\t * @example\n\t * ```tsx\n\t * <Combobox.Root>\n\t *   <Combobox.Input />\n\t *   <Combobox.Content>\n\t *     <Combobox.Item value=\"Apple\" />\n\t *     <Combobox.Item value=\"Banana\" />\n\t *   </Combobox.Content>\n\t * </Combobox.Root>\n\t * ```\n\t */\n\tContent,\n\t/**\n\t * Renders a group for Combobox.Item elements.\n\t *\n\t * @see https://mantle.ngrok.com/components/combobox#api-combobox-group\n\t *\n\t * @example\n\t * ```tsx\n\t * <Combobox.Root>\n\t *   <Combobox.Input />\n\t *   <Combobox.Content>\n\t *     <Combobox.Group>\n\t *       <Combobox.GroupLabel>Fruits</Combobox.GroupLabel>\n\t *       <Combobox.Item value=\"Apple\" />\n\t *       <Combobox.Item value=\"Banana\" />\n\t *     </Combobox.Group>\n\t *   </Combobox.Content>\n\t * </Combobox.Root>\n\t * ```\n\t */\n\tGroup,\n\t/**\n\t * Renders a label in a combobox group.\n\t *\n\t * @see https://mantle.ngrok.com/components/combobox#api-combobox-group-label\n\t *\n\t * @example\n\t * ```tsx\n\t * <Combobox.Root>\n\t *   <Combobox.Input />\n\t *   <Combobox.Content>\n\t *     <Combobox.Group>\n\t *       <Combobox.GroupLabel>Fruits</Combobox.GroupLabel>\n\t *       <Combobox.Item value=\"Apple\" />\n\t *       <Combobox.Item value=\"Banana\" />\n\t *     </Combobox.Group>\n\t *   </Combobox.Content>\n\t * </Combobox.Root>\n\t * ```\n\t */\n\tGroupLabel,\n\t/**\n\t * Renders a combobox input element that can be used to filter a list of items.\n\t *\n\t * @see https://mantle.ngrok.com/components/combobox#api-combobox-input\n\t *\n\t * @example\n\t * ```tsx\n\t * <Combobox.Root>\n\t *   <Combobox.Input />\n\t *   <Combobox.Content>\n\t *     <Combobox.Item value=\"Apple\" />\n\t *     <Combobox.Item value=\"Banana\" />\n\t *   </Combobox.Content>\n\t * </Combobox.Root>\n\t * ```\n\t */\n\tInput,\n\t/**\n\t * Renders a combobox item inside a Combobox.Content component.\n\t *\n\t * @see https://mantle.ngrok.com/components/combobox#api-combobox-item\n\t *\n\t * @example\n\t * ```tsx\n\t * <Combobox.Root>\n\t *   <Combobox.Input />\n\t *   <Combobox.Content>\n\t *     <Combobox.Item value=\"Apple\" />\n\t *     <Combobox.Item value=\"Banana\" />\n\t *     <Combobox.Item value=\"Orange\" />\n\t *   </Combobox.Content>\n\t * </Combobox.Root>\n\t * ```\n\t */\n\tItem,\n\t/**\n\t * Highlights the match between the current Combobox.Input value and parent Combobox.Item value.\n\t *\n\t * @see https://mantle.ngrok.com/components/combobox#api-combobox-item-value\n\t *\n\t * @example\n\t * ```tsx\n\t * <Combobox.Root>\n\t *   <Combobox.Input />\n\t *   <Combobox.Content>\n\t *     <Combobox.Item value=\"Apple\">\n\t *       🍎\n\t *       <Combobox.ItemValue />\n\t *     </Combobox.Item>\n\t *     <Combobox.Item value=\"Banana\">\n\t *       🍌\n\t *       <Combobox.ItemValue />\n\t *     </Combobox.Item>\n\t *   </Combobox.Content>\n\t * </Combobox.Root>\n\t * ```\n\t */\n\tItemValue,\n\t/**\n\t * Renders a separator between Combobox.Items or Combobox.Groups.\n\t *\n\t * @see https://mantle.ngrok.com/components/combobox#api-combobox-separator\n\t *\n\t * @example\n\t * ```tsx\n\t * <Combobox.Root>\n\t *   <Combobox.Input />\n\t *   <Combobox.Content>\n\t *     <Combobox.Group>\n\t *       <Combobox.Item value=\"Apple\" />\n\t *       <Combobox.Item value=\"Banana\" />\n\t *     </Combobox.Group>\n\t *     <Combobox.Separator />\n\t *     <Combobox.Item>\n\t *       Click me!\n\t *     </Combobox.Item>\n\t *   </Combobox.Content>\n\t * </Combobox.Root>\n\t * ```\n\t */\n\tSeparator: ComboboxSeparatorComponent,\n} as const;\n\nexport {\n\t//,\n\tCombobox,\n};\n"],"mappings":"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","names":["Primitive","Slot","createContext","forwardRef","jsx","Root","children","props","Input","forwardRef","_ariaInvalid","autoComplete","autoSelect","className","_validation","ref","validation","cx","Content","asChild","sameWidth","unmountOnHide","childProps","Slot","ComboboxItemValueContext","createContext","Item","focusOnHover","value","Group","GroupLabel","ItemValue","ComboboxSeparatorComponent","Separator","Combobox"]}

package/dist/dialog.d.ts

@@ -3,7 +3,8 @@ import { ComponentProps } from 'react';
 import * as _radix_ui_react_dialog from '@radix-ui/react-dialog';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { a as IconButtonProps } from './icon-button-D4BTvC7F.js';
-import { R as Root } from './primitive-BUbUB7RS.js';
+import { R as Root } from './primitive-CBR_XmVa.js';
+export { i as isDialogOverlayTarget } from './primitive-CBR_XmVa.js';
 import 'class-variance-authority/types';
 import './as-child-DJ7x3JFV.js';
 import './variant-props-oDo2u-We.js';
@@ -326,7 +327,7 @@ declare const Dialog: {
      * </Dialog.Root>
      * ```
      */
-    readonly Overlay: react.ForwardRefExoticComponent<Omit<_radix_ui_react_dialog.DialogOverlayProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+    readonly Overlay: react.ForwardRefExoticComponent<Omit<Omit<_radix_ui_react_dialog.DialogOverlayProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
     /**
      * The portal container for the dialog.
      *

package/dist/dialog.js

@@ -1,2 +1,2 @@
-import{a as f,b as P,c as D,d as m,e as u,f as v,g as y,h as C}from"./chunk-PX63EGR2.js";import{d as p}from"./chunk-RH46OJYB.js";import"./chunk-THKAHLEP.js";import"./chunk-6J7D73WA.js";import{c as g}from"./chunk-XTCU7MXB.js";import"./chunk-4LSFAAZW.js";import"./chunk-72TJUKMV.js";import"./chunk-3C5O3AQA.js";import"./chunk-I6T6YV2L.js";import"./chunk-NPTDRQT5.js";import{a}from"./chunk-AZ56JGNY.js";import{XIcon as k}from"@phosphor-icons/react/X";import{forwardRef as r}from"react";import{jsx as e,jsxs as H}from"react/jsx-runtime";var x=f;x.displayName="Dialog";var N=P;N.displayName="DialogTrigger";var d=D;d.displayName="DialogPortal";var b=m;b.displayName="DialogClose";var c=r(({className:o,...t},i)=>e(u,{ref:i,className:a("bg-overlay data-state-closed:animate-out data-state-closed:fade-out-0 data-state-open:animate-in data-state-open:fade-in-0 fixed inset-0 z-50 backdrop-blur-xs",o),...t}));c.displayName="DialogOverlay";var h=r(({children:o,className:t,onInteractOutside:i,onPointerDownOutside:l,preferredWidth:s="max-w-lg",...W},z)=>H(d,{children:[e(c,{}),e("div",{className:"fixed inset-4 z-50 flex items-center justify-center",children:e(v,{className:a("flex max-h-full w-full flex-1 flex-col","outline-hidden focus-within:outline-hidden","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",s,t),onInteractOutside:n=>{p(n),i?.(n)},onPointerDownOutside:n=>{p(n),l?.(n)},ref:z,...W,children:o})})]}));h.displayName="DialogContent";var R=({className:o,children:t,...i})=>e("div",{className:a("border-dialog-muted text-strong relative flex shrink-0 items-center justify-between gap-2 border-b px-6 py-4","has-[.icon-button]:pr-4",o),...i,children:t});R.displayName="DialogHeader";var w=({size:o="md",type:t="button",label:i="Close Dialog",appearance:l="ghost",...s})=>e(m,{asChild:!0,children:e(g,{appearance:l,icon:e(k,{}),label:i,size:o,type:t,...s})});w.displayName="DialogCloseIconButton";var I=({className:o,...t})=>e("div",{className:a("scrollbar text-body flex-1 overflow-y-auto p-6",o),...t});I.displayName="DialogBody";var B=({className:o,...t})=>e("div",{className:a("border-dialog-muted flex shrink-0 flex-row-reverse gap-2 border-t px-6 py-4",o),...t});B.displayName="DialogFooter";var O=r(({className:o,...t},i)=>e(y,{ref:i,className:a("text-strong truncate text-lg font-medium",o),...t}));O.displayName="DialogTitle";var T=r(({className:o,...t},i)=>e(C,{ref:i,className:a("text-muted",o),...t}));T.displayName="DialogDescription";var F={Root:x,Body:I,Close:b,CloseIconButton:w,Content:h,Description:T,Footer:B,Header:R,Overlay:c,Portal:d,Title:O,Trigger:N};export{F as Dialog};
+import{a as f,b as D,c as P,d as m,e as v,f as y,g as u,h as C,i as k}from"./chunk-VIKPHWPP.js";import{d as p}from"./chunk-RH46OJYB.js";import"./chunk-THKAHLEP.js";import"./chunk-6J7D73WA.js";import{c}from"./chunk-XTCU7MXB.js";import"./chunk-4LSFAAZW.js";import"./chunk-72TJUKMV.js";import"./chunk-3C5O3AQA.js";import"./chunk-I6T6YV2L.js";import"./chunk-NPTDRQT5.js";import{a}from"./chunk-AZ56JGNY.js";import{XIcon as F}from"@phosphor-icons/react/X";import{forwardRef as n}from"react";import{jsx as e,jsxs as j}from"react/jsx-runtime";var x=f;x.displayName="Dialog";var N=D;N.displayName="DialogTrigger";var d=P;d.displayName="DialogPortal";var b=m;b.displayName="DialogClose";var g=n(({className:o,...t},i)=>e(v,{ref:i,className:a("bg-overlay data-state-closed:animate-out data-state-closed:fade-out-0 data-state-open:animate-in data-state-open:fade-in-0 fixed inset-0 z-50 backdrop-blur-xs",o),...t}));g.displayName="DialogOverlay";var h=n(({children:o,className:t,onInteractOutside:i,onPointerDownOutside:l,preferredWidth:s="max-w-lg",...W},z)=>j(d,{children:[e(g,{}),e("div",{className:"fixed inset-4 z-50 flex items-center justify-center",children:e(y,{className:a("flex max-h-full w-full flex-1 flex-col","outline-hidden focus-within:outline-hidden","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",s,t),onInteractOutside:r=>{p(r),i?.(r)},onPointerDownOutside:r=>{p(r),l?.(r)},ref:z,...W,children:o})})]}));h.displayName="DialogContent";var R=({className:o,children:t,...i})=>e("div",{className:a("border-dialog-muted text-strong relative flex shrink-0 items-center justify-between gap-2 border-b px-6 py-4","has-[.icon-button]:pr-4",o),...i,children:t});R.displayName="DialogHeader";var w=({size:o="md",type:t="button",label:i="Close Dialog",appearance:l="ghost",...s})=>e(m,{asChild:!0,children:e(c,{appearance:l,icon:e(F,{}),label:i,size:o,type:t,...s})});w.displayName="DialogCloseIconButton";var I=({className:o,...t})=>e("div",{className:a("scrollbar text-body flex-1 overflow-y-auto p-6",o),...t});I.displayName="DialogBody";var B=({className:o,...t})=>e("div",{className:a("border-dialog-muted flex shrink-0 flex-row-reverse gap-2 border-t px-6 py-4",o),...t});B.displayName="DialogFooter";var O=n(({className:o,...t},i)=>e(u,{ref:i,className:a("text-strong truncate text-lg font-medium",o),...t}));O.displayName="DialogTitle";var T=n(({className:o,...t},i)=>e(C,{ref:i,className:a("text-muted",o),...t}));T.displayName="DialogDescription";var H={Root:x,Body:I,Close:b,CloseIconButton:w,Content:h,Description:T,Footer:B,Header:R,Overlay:g,Portal:d,Title:O,Trigger:N};export{H as Dialog,k as isDialogOverlayTarget};
 //# sourceMappingURL=dialog.js.map

package/dist/dialog.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/dialog/dialog.tsx"],"sourcesContent":["import { XIcon } from \"@phosphor-icons/react/X\";\nimport type {\n\tComponentProps,\n\tComponentPropsWithoutRef,\n\tComponentRef,\n} from \"react\";\nimport { forwardRef } from \"react\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { IconButton, type IconButtonProps } from \"../button/icon-button.js\";\nimport { preventCloseOnPromptInteraction } from \"../toast/toast.js\";\nimport * as DialogPrimitive from \"./primitive.js\";\n\n/**\n * A window overlaid on either the primary window or another dialog window.\n * The root stateful component for the Dialog.\n *\n * @see https://mantle.ngrok.com/components/dialog#api-dialog\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n *   <Dialog.Trigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Open Dialog\n *     </Button>\n *   </Dialog.Trigger>\n *   <Dialog.Content>\n *     <Dialog.Header>\n *       <Dialog.Title>Dialog Title</Dialog.Title>\n *       <Dialog.CloseIconButton />\n *     </Dialog.Header>\n *     <Dialog.Body>\n *       <p>This is the dialog content.</p>\n *     </Dialog.Body>\n *     <Dialog.Footer>\n *       <Button type=\"button\" appearance=\"outlined\">\n *         Cancel\n *       </Button>\n *       <Button type=\"button\" appearance=\"filled\">\n *         Save\n *       </Button>\n *     </Dialog.Footer>\n *   </Dialog.Content>\n * </Dialog.Root>\n * ```\n */\nconst Root = DialogPrimitive.Root;\nRoot.displayName = \"Dialog\";\n\n/**\n * A button that opens the dialog.\n *\n * @see https://mantle.ngrok.com/components/dialog#api-dialog-trigger\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n *   <Dialog.Trigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Open Dialog\n *     </Button>\n *   </Dialog.Trigger>\n *   <Dialog.Content>\n *     <Dialog.Header>\n *       <Dialog.Title>Dialog Title</Dialog.Title>\n *     </Dialog.Header>\n *     <Dialog.Body>\n *       <p>This is the dialog content.</p>\n *     </Dialog.Body>\n *   </Dialog.Content>\n * </Dialog.Root>\n * ```\n */\nconst Trigger = DialogPrimitive.Trigger;\nTrigger.displayName = \"DialogTrigger\";\n\nconst Portal = DialogPrimitive.Portal;\nPortal.displayName = \"DialogPortal\";\n\nconst Close = DialogPrimitive.Close;\nClose.displayName = \"DialogClose\";\n\nconst Overlay = forwardRef<\n\tComponentRef<\"div\">,\n\tComponentPropsWithoutRef<typeof DialogPrimitive.Overlay>\n>(({ className, ...props }, ref) => (\n\t<DialogPrimitive.Overlay\n\t\tref={ref}\n\t\tclassName={cx(\n\t\t\t\"bg-overlay data-state-closed:animate-out data-state-closed:fade-out-0 data-state-open:animate-in data-state-open:fade-in-0 fixed inset-0 z-50 backdrop-blur-xs\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nOverlay.displayName = \"DialogOverlay\";\n\ntype ContentProps = ComponentPropsWithoutRef<typeof DialogPrimitive.Content> & {\n\t/**\n\t * The preferred width of the `Dialog.Content` as a tailwind `max-w-` class.\n\t *\n\t * By default, a `Dialog`'s content width is responsive with a default\n\t * preferred width: the maximum width of the `Dialog.Content`\n\t *\n\t * @default `max-w-lg`\n\t */\n\tpreferredWidth?: `max-w-${string}`;\n};\n\n/**\n * The container for the dialog content.\n * Renders on top of the overlay and is centered in the viewport.\n *\n * @see https://mantle.ngrok.com/components/dialog#api-dialog-content\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n *   <Dialog.Trigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Open Dialog\n *     </Button>\n *   </Dialog.Trigger>\n *   <Dialog.Content>\n *     <Dialog.Header>\n *       <Dialog.Title>Dialog Title</Dialog.Title>\n *       <Dialog.CloseIconButton />\n *     </Dialog.Header>\n *     <Dialog.Body>\n *       <p>This is the dialog content.</p>\n *     </Dialog.Body>\n *     <Dialog.Footer>\n *       <Button type=\"button\" appearance=\"outlined\">\n *         Cancel\n *       </Button>\n *       <Button type=\"button\" appearance=\"filled\">\n *         Save\n *       </Button>\n *     </Dialog.Footer>\n *   </Dialog.Content>\n * </Dialog.Root>\n * ```\n */\nconst Content = forwardRef<ComponentRef<\"div\">, ContentProps>(\n\t(\n\t\t{\n\t\t\tchildren,\n\t\t\tclassName,\n\t\t\tonInteractOutside,\n\t\t\tonPointerDownOutside,\n\t\t\tpreferredWidth = \"max-w-lg\",\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => (\n\t\t<Portal>\n\t\t\t<Overlay />\n\t\t\t<div className=\"fixed inset-4 z-50 flex items-center justify-center\">\n\t\t\t\t<DialogPrimitive.Content\n\t\t\t\t\tclassName={cx(\n\t\t\t\t\t\t\"flex max-h-full w-full flex-1 flex-col\",\n\t\t\t\t\t\t\"outline-hidden focus-within:outline-hidden\",\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\tref={ref}\n\t\t\t\t\t{...props}\n\t\t\t\t>\n\t\t\t\t\t{children}\n\t\t\t\t</DialogPrimitive.Content>\n\t\t\t</div>\n\t\t</Portal>\n\t),\n);\nContent.displayName = \"DialogContent\";\n\n/**\n * Contains the header content of the dialog, including the title and close button.\n *\n * @see https://mantle.ngrok.com/components/dialog#api-dialog-header\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n *   <Dialog.Trigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Open Dialog\n *     </Button>\n *   </Dialog.Trigger>\n *   <Dialog.Content>\n *     <Dialog.Header>\n *       <Dialog.Title>Dialog Title</Dialog.Title>\n *       <Dialog.CloseIconButton />\n *     </Dialog.Header>\n *     <Dialog.Body>\n *       <p>This is the dialog content.</p>\n *     </Dialog.Body>\n *   </Dialog.Content>\n * </Dialog.Root>\n * ```\n */\nconst Header = ({ className, children, ...props }: ComponentProps<\"div\">) => (\n\t<div\n\t\tclassName={cx(\n\t\t\t\"border-dialog-muted text-strong relative flex shrink-0 items-center justify-between gap-2 border-b px-6 py-4\",\n\t\t\t\"has-[.icon-button]:pr-4\", // when there are actions in the header, shorten the padding\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t>\n\t\t{children}\n\t</div>\n);\nHeader.displayName = \"DialogHeader\";\n\ntype CloseIconButtonProps = Partial<Omit<IconButtonProps, \"icon\">>;\n\n/**\n * An icon button that closes the dialog when clicked.\n *\n * @see https://mantle.ngrok.com/components/dialog#api-dialog-close-icon-button\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n *   <Dialog.Trigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Open Dialog\n *     </Button>\n *   </Dialog.Trigger>\n *   <Dialog.Content>\n *     <Dialog.Header>\n *       <Dialog.Title>Dialog Title</Dialog.Title>\n *       <Dialog.CloseIconButton />\n *     </Dialog.Header>\n *     <Dialog.Body>\n *       <p>This is the dialog content.</p>\n *     </Dialog.Body>\n *   </Dialog.Content>\n * </Dialog.Root>\n * ```\n */\nconst CloseIconButton = ({\n\tsize = \"md\",\n\ttype = \"button\",\n\tlabel = \"Close Dialog\",\n\tappearance = \"ghost\",\n\t...props\n}: CloseIconButtonProps) => (\n\t<DialogPrimitive.Close asChild>\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\ttype={type}\n\t\t\t{...props}\n\t\t/>\n\t</DialogPrimitive.Close>\n);\nCloseIconButton.displayName = \"DialogCloseIconButton\";\n\n/**\n * Contains the main content of the dialog.\n *\n * @see https://mantle.ngrok.com/components/dialog#api-dialog-body\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n *   <Dialog.Trigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Open Dialog\n *     </Button>\n *   </Dialog.Trigger>\n *   <Dialog.Content>\n *     <Dialog.Header>\n *       <Dialog.Title>Dialog Title</Dialog.Title>\n *     </Dialog.Header>\n *     <Dialog.Body>\n *       <p>This is the dialog content.</p>\n *     </Dialog.Body>\n *   </Dialog.Content>\n * </Dialog.Root>\n * ```\n */\nconst Body = ({ className, ...props }: ComponentProps<\"div\">) => (\n\t<div\n\t\tclassName={cx(\"scrollbar text-body flex-1 overflow-y-auto p-6\", className)}\n\t\t{...props}\n\t/>\n);\nBody.displayName = \"DialogBody\";\n\n/**\n * Contains the footer content of the dialog, including action buttons.\n *\n * @see https://mantle.ngrok.com/components/dialog#api-dialog-footer\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n *   <Dialog.Trigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Open Dialog\n *     </Button>\n *   </Dialog.Trigger>\n *   <Dialog.Content>\n *     <Dialog.Header>\n *       <Dialog.Title>Dialog Title</Dialog.Title>\n *     </Dialog.Header>\n *     <Dialog.Body>\n *       <p>This is the dialog content.</p>\n *     </Dialog.Body>\n *     <Dialog.Footer>\n *       <Button type=\"button\" appearance=\"outlined\">\n *         Cancel\n *       </Button>\n *       <Button type=\"button\" appearance=\"filled\">\n *         Save\n *       </Button>\n *     </Dialog.Footer>\n *   </Dialog.Content>\n * </Dialog.Root>\n * ```\n */\nconst Footer = ({ className, ...props }: ComponentProps<\"div\">) => (\n\t<div\n\t\tclassName={cx(\n\t\t\t\"border-dialog-muted flex shrink-0 flex-row-reverse gap-2 border-t px-6 py-4\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n);\nFooter.displayName = \"DialogFooter\";\n\n/**\n * An accessible name to be announced when the dialog is opened.\n *\n * @see https://mantle.ngrok.com/components/dialog#api-dialog-title\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n *   <Dialog.Trigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Open Dialog\n *     </Button>\n *   </Dialog.Trigger>\n *   <Dialog.Content>\n *     <Dialog.Header>\n *       <Dialog.Title>Dialog Title</Dialog.Title>\n *       <Dialog.CloseIconButton />\n *     </Dialog.Header>\n *     <Dialog.Body>\n *       <p>This is the dialog content.</p>\n *     </Dialog.Body>\n *   </Dialog.Content>\n * </Dialog.Root>\n * ```\n */\nconst Title = forwardRef<\n\tComponentRef<typeof DialogPrimitive.Title>,\n\tComponentPropsWithoutRef<typeof DialogPrimitive.Title>\n>(({ className, ...props }, ref) => (\n\t<DialogPrimitive.Title\n\t\tref={ref}\n\t\tclassName={cx(\"text-strong truncate text-lg font-medium\", className)}\n\t\t{...props}\n\t/>\n));\nTitle.displayName = \"DialogTitle\";\n\n/**\n * An accessible description to be announced when the dialog is opened.\n * Renders as a `div` by default, but can be changed to any other element using\n * the `asChild` prop.\n *\n * @see https://mantle.ngrok.com/components/dialog#api-dialog-description\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n *   <Dialog.Trigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Open Dialog\n *     </Button>\n *   </Dialog.Trigger>\n *   <Dialog.Content>\n *     <Dialog.Header>\n *       <Dialog.Title>Dialog Title</Dialog.Title>\n *       <Dialog.Description>\n *         This is an optional description.\n *       </Dialog.Description>\n *     </Dialog.Header>\n *     <Dialog.Body>\n *       <p>This is the dialog content.</p>\n *     </Dialog.Body>\n *   </Dialog.Content>\n * </Dialog.Root>\n * ```\n */\nconst Description = forwardRef<\n\tComponentRef<typeof DialogPrimitive.Description>,\n\tComponentPropsWithoutRef<typeof DialogPrimitive.Description>\n>(({ className, ...props }, ref) => (\n\t<DialogPrimitive.Description\n\t\tref={ref}\n\t\tclassName={cx(\"text-muted\", className)}\n\t\t{...props}\n\t/>\n));\nDescription.displayName = \"DialogDescription\";\n\n/**\n * A window overlaid on either the primary window or another dialog window.\n *\n * @see https://mantle.ngrok.com/components/dialog\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n *   <Dialog.Trigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Open Dialog\n *     </Button>\n *   </Dialog.Trigger>\n *   <Dialog.Content>\n *     <Dialog.Header>\n *       <Dialog.Title>Dialog Title</Dialog.Title>\n *       <Dialog.CloseIconButton />\n *     </Dialog.Header>\n *     <Dialog.Body>\n *       <p>This is the dialog content.</p>\n *     </Dialog.Body>\n *     <Dialog.Footer>\n *       <Button type=\"button\" appearance=\"outlined\">\n *         Cancel\n *       </Button>\n *       <Button type=\"button\" appearance=\"filled\">\n *         Save\n *       </Button>\n *     </Dialog.Footer>\n *   </Dialog.Content>\n * </Dialog.Root>\n * ```\n */\nconst Dialog = {\n\t/**\n\t * A window overlaid on either the primary window or another dialog window.\n\t * The root stateful component for the Dialog.\n\t *\n\t * @see https://mantle.ngrok.com/components/dialog#api-dialog\n\t *\n\t * @example\n\t * ```tsx\n\t * <Dialog.Root>\n\t *   <Dialog.Trigger asChild>\n\t *     <Button type=\"button\" appearance=\"outlined\">\n\t *       Open Dialog\n\t *     </Button>\n\t *   </Dialog.Trigger>\n\t *   <Dialog.Content>\n\t *     <Dialog.Header>\n\t *       <Dialog.Title>Dialog Title</Dialog.Title>\n\t *       <Dialog.CloseIconButton />\n\t *     </Dialog.Header>\n\t *     <Dialog.Body>\n\t *       <p>This is the dialog content.</p>\n\t *     </Dialog.Body>\n\t *     <Dialog.Footer>\n\t *       <Button type=\"button\" appearance=\"outlined\">\n\t *         Cancel\n\t *       </Button>\n\t *       <Button type=\"button\" appearance=\"filled\">\n\t *         Save\n\t *       </Button>\n\t *     </Dialog.Footer>\n\t *   </Dialog.Content>\n\t * </Dialog.Root>\n\t * ```\n\t */\n\tRoot,\n\t/**\n\t * Contains the main content of the dialog.\n\t *\n\t * @see https://mantle.ngrok.com/components/dialog#api-dialog-body\n\t *\n\t * @example\n\t * ```tsx\n\t * <Dialog.Root>\n\t *   <Dialog.Trigger asChild>\n\t *     <Button type=\"button\" appearance=\"outlined\">\n\t *       Open Dialog\n\t *     </Button>\n\t *   </Dialog.Trigger>\n\t *   <Dialog.Content>\n\t *     <Dialog.Header>\n\t *       <Dialog.Title>Dialog Title</Dialog.Title>\n\t *     </Dialog.Header>\n\t *     <Dialog.Body>\n\t *       <p>This is the dialog content.</p>\n\t *     </Dialog.Body>\n\t *   </Dialog.Content>\n\t * </Dialog.Root>\n\t * ```\n\t */\n\tBody,\n\t/**\n\t * A button that closes the dialog when clicked.\n\t *\n\t * @see https://mantle.ngrok.com/components/dialog#api-dialog-close\n\t *\n\t * @example\n\t * ```tsx\n\t * <Dialog.Root>\n\t *   <Dialog.Trigger asChild>\n\t *     <Button type=\"button\">Open Dialog</Button>\n\t *   </Dialog.Trigger>\n\t *   <Dialog.Content>\n\t *     <Dialog.Header>\n\t *       <Dialog.Title>Confirm Action</Dialog.Title>\n\t *     </Dialog.Header>\n\t *     <Dialog.Body>\n\t *       <Text>Are you sure you want to proceed?</Text>\n\t *     </Dialog.Body>\n\t *     <Dialog.Footer>\n\t *       <Dialog.Close asChild>\n\t *         <Button type=\"button\" appearance=\"outlined\">Cancel</Button>\n\t *       </Dialog.Close>\n\t *       <Button type=\"submit\">Confirm</Button>\n\t *     </Dialog.Footer>\n\t *   </Dialog.Content>\n\t * </Dialog.Root>\n\t * ```\n\t */\n\tClose,\n\t/**\n\t * An icon button that closes the dialog when clicked.\n\t *\n\t * @see https://mantle.ngrok.com/components/dialog#api-dialog-close-icon-button\n\t *\n\t * @example\n\t * ```tsx\n\t * <Dialog.Root>\n\t *   <Dialog.Trigger asChild>\n\t *     <Button type=\"button\" appearance=\"outlined\">\n\t *       Open Dialog\n\t *     </Button>\n\t *   </Dialog.Trigger>\n\t *   <Dialog.Content>\n\t *     <Dialog.Header>\n\t *       <Dialog.Title>Dialog Title</Dialog.Title>\n\t *       <Dialog.CloseIconButton />\n\t *     </Dialog.Header>\n\t *     <Dialog.Body>\n\t *       <p>This is the dialog content.</p>\n\t *     </Dialog.Body>\n\t *   </Dialog.Content>\n\t * </Dialog.Root>\n\t * ```\n\t */\n\tCloseIconButton,\n\t/**\n\t * The container for the dialog content.\n\t * Renders on top of the overlay and is centered in the viewport.\n\t *\n\t * @see https://mantle.ngrok.com/components/dialog#api-dialog-content\n\t *\n\t * @example\n\t * ```tsx\n\t * <Dialog.Root>\n\t *   <Dialog.Trigger asChild>\n\t *     <Button type=\"button\" appearance=\"outlined\">\n\t *       Open Dialog\n\t *     </Button>\n\t *   </Dialog.Trigger>\n\t *   <Dialog.Content>\n\t *     <Dialog.Header>\n\t *       <Dialog.Title>Dialog Title</Dialog.Title>\n\t *       <Dialog.CloseIconButton />\n\t *     </Dialog.Header>\n\t *     <Dialog.Body>\n\t *       <p>This is the dialog content.</p>\n\t *     </Dialog.Body>\n\t *     <Dialog.Footer>\n\t *       <Button type=\"button\" appearance=\"outlined\">\n\t *         Cancel\n\t *       </Button>\n\t *       <Button type=\"button\" appearance=\"filled\">\n\t *         Save\n\t *       </Button>\n\t *     </Dialog.Footer>\n\t *   </Dialog.Content>\n\t * </Dialog.Root>\n\t * ```\n\t */\n\tContent,\n\t/**\n\t * An accessible description to be announced when the dialog is opened.\n\t *\n\t * @see https://mantle.ngrok.com/components/dialog#api-dialog-description\n\t *\n\t * @example\n\t * ```tsx\n\t * <Dialog.Root>\n\t *   <Dialog.Trigger asChild>\n\t *     <Button type=\"button\" appearance=\"outlined\">\n\t *       Open Dialog\n\t *     </Button>\n\t *   </Dialog.Trigger>\n\t *   <Dialog.Content>\n\t *     <Dialog.Header>\n\t *       <Dialog.Title>Dialog Title</Dialog.Title>\n\t *       <Dialog.Description>\n\t *         This is an optional description.\n\t *       </Dialog.Description>\n\t *     </Dialog.Header>\n\t *     <Dialog.Body>\n\t *       <p>This is the dialog content.</p>\n\t *     </Dialog.Body>\n\t *   </Dialog.Content>\n\t * </Dialog.Root>\n\t * ```\n\t */\n\tDescription,\n\t/**\n\t * Contains the footer content of the dialog, including action buttons.\n\t *\n\t * @see https://mantle.ngrok.com/components/dialog#api-dialog-footer\n\t *\n\t * @example\n\t * ```tsx\n\t * <Dialog.Root>\n\t *   <Dialog.Trigger asChild>\n\t *     <Button type=\"button\" appearance=\"outlined\">\n\t *       Open Dialog\n\t *     </Button>\n\t *   </Dialog.Trigger>\n\t *   <Dialog.Content>\n\t *     <Dialog.Header>\n\t *       <Dialog.Title>Dialog Title</Dialog.Title>\n\t *     </Dialog.Header>\n\t *     <Dialog.Body>\n\t *       <p>This is the dialog content.</p>\n\t *     </Dialog.Body>\n\t *     <Dialog.Footer>\n\t *       <Button type=\"button\" appearance=\"outlined\">\n\t *         Cancel\n\t *       </Button>\n\t *       <Button type=\"button\" appearance=\"filled\">\n\t *         Save\n\t *       </Button>\n\t *     </Dialog.Footer>\n\t *   </Dialog.Content>\n\t * </Dialog.Root>\n\t * ```\n\t */\n\tFooter,\n\t/**\n\t * Contains the header content of the dialog, including the title and close button.\n\t *\n\t * @see https://mantle.ngrok.com/components/dialog#api-dialog-header\n\t *\n\t * @example\n\t * ```tsx\n\t * <Dialog.Root>\n\t *   <Dialog.Trigger asChild>\n\t *     <Button type=\"button\" appearance=\"outlined\">\n\t *       Open Dialog\n\t *     </Button>\n\t *   </Dialog.Trigger>\n\t *   <Dialog.Content>\n\t *     <Dialog.Header>\n\t *       <Dialog.Title>Dialog Title</Dialog.Title>\n\t *       <Dialog.CloseIconButton />\n\t *     </Dialog.Header>\n\t *     <Dialog.Body>\n\t *       <p>This is the dialog content.</p>\n\t *     </Dialog.Body>\n\t *   </Dialog.Content>\n\t * </Dialog.Root>\n\t * ```\n\t */\n\tHeader,\n\t/**\n\t * The overlay backdrop for the dialog.\n\t *\n\t * @see https://mantle.ngrok.com/components/dialog#api-dialog-overlay\n\t *\n\t * @example\n\t * ```tsx\n\t * <Dialog.Root>\n\t *   <Dialog.Portal>\n\t *     <Dialog.Overlay />\n\t *     <Dialog.Content>\n\t *       <Dialog.Header>\n\t *         <Dialog.Title>Dialog Title</Dialog.Title>\n\t *       </Dialog.Header>\n\t *       <Dialog.Body>\n\t *         <Text>Dialog content here.</Text>\n\t *       </Dialog.Body>\n\t *     </Dialog.Content>\n\t *   </Dialog.Portal>\n\t * </Dialog.Root>\n\t * ```\n\t */\n\tOverlay,\n\t/**\n\t * The portal container for the dialog.\n\t *\n\t * @see https://mantle.ngrok.com/components/dialog#api-dialog-portal\n\t *\n\t * @example\n\t * ```tsx\n\t * <Dialog.Root>\n\t *   <Dialog.Trigger asChild>\n\t *     <Button type=\"button\">Open Dialog</Button>\n\t *   </Dialog.Trigger>\n\t *   <Dialog.Portal>\n\t *     <Dialog.Overlay />\n\t *     <Dialog.Content>\n\t *       <Dialog.Header>\n\t *         <Dialog.Title>Portal Dialog</Dialog.Title>\n\t *       </Dialog.Header>\n\t *       <Dialog.Body>\n\t *         <Text>This dialog is rendered in a portal.</Text>\n\t *       </Dialog.Body>\n\t *     </Dialog.Content>\n\t *   </Dialog.Portal>\n\t * </Dialog.Root>\n\t * ```\n\t */\n\tPortal,\n\t/**\n\t * An accessible name to be announced when the dialog is opened.\n\t *\n\t * @see https://mantle.ngrok.com/components/dialog#api-dialog-title\n\t *\n\t * @example\n\t * ```tsx\n\t * <Dialog.Root>\n\t *   <Dialog.Trigger asChild>\n\t *     <Button type=\"button\" appearance=\"outlined\">\n\t *       Open Dialog\n\t *     </Button>\n\t *   </Dialog.Trigger>\n\t *   <Dialog.Content>\n\t *     <Dialog.Header>\n\t *       <Dialog.Title>Dialog Title</Dialog.Title>\n\t *       <Dialog.CloseIconButton />\n\t *     </Dialog.Header>\n\t *     <Dialog.Body>\n\t *       <p>This is the dialog content.</p>\n\t *     </Dialog.Body>\n\t *   </Dialog.Content>\n\t * </Dialog.Root>\n\t * ```\n\t */\n\tTitle,\n\t/**\n\t * A button that opens the dialog.\n\t *\n\t * @see https://mantle.ngrok.com/components/dialog#api-dialog-trigger\n\t *\n\t * @example\n\t * ```tsx\n\t * <Dialog.Root>\n\t *   <Dialog.Trigger asChild>\n\t *     <Button type=\"button\" appearance=\"outlined\">\n\t *       Open Dialog\n\t *     </Button>\n\t *   </Dialog.Trigger>\n\t *   <Dialog.Content>\n\t *     <Dialog.Header>\n\t *       <Dialog.Title>Dialog Title</Dialog.Title>\n\t *     </Dialog.Header>\n\t *     <Dialog.Body>\n\t *       <p>This is the dialog content.</p>\n\t *     </Dialog.Body>\n\t *   </Dialog.Content>\n\t * </Dialog.Root>\n\t * ```\n\t */\n\tTrigger,\n} as const;\n\nexport {\n\t//,\n\tDialog,\n};\n"],"mappings":"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","names":["XIcon","forwardRef","jsx","jsxs","Root","Trigger","Portal","Close","Overlay","forwardRef","className","props","ref","cx","Content","children","onInteractOutside","onPointerDownOutside","preferredWidth","event","preventCloseOnPromptInteraction","Header","CloseIconButton","size","type","label","appearance","IconButton","XIcon","Body","Footer","Title","Description","Dialog"]}
+{"version":3,"sources":["../src/components/dialog/dialog.tsx"],"sourcesContent":["import { XIcon } from \"@phosphor-icons/react/X\";\nimport type {\n\tComponentProps,\n\tComponentPropsWithoutRef,\n\tComponentRef,\n} from \"react\";\nimport { forwardRef } from \"react\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { IconButton, type IconButtonProps } from \"../button/icon-button.js\";\nimport { preventCloseOnPromptInteraction } from \"../toast/toast.js\";\nimport * as DialogPrimitive from \"./primitive.js\";\n\n/**\n * A window overlaid on either the primary window or another dialog window.\n * The root stateful component for the Dialog.\n *\n * @see https://mantle.ngrok.com/components/dialog#api-dialog\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n *   <Dialog.Trigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Open Dialog\n *     </Button>\n *   </Dialog.Trigger>\n *   <Dialog.Content>\n *     <Dialog.Header>\n *       <Dialog.Title>Dialog Title</Dialog.Title>\n *       <Dialog.CloseIconButton />\n *     </Dialog.Header>\n *     <Dialog.Body>\n *       <p>This is the dialog content.</p>\n *     </Dialog.Body>\n *     <Dialog.Footer>\n *       <Button type=\"button\" appearance=\"outlined\">\n *         Cancel\n *       </Button>\n *       <Button type=\"button\" appearance=\"filled\">\n *         Save\n *       </Button>\n *     </Dialog.Footer>\n *   </Dialog.Content>\n * </Dialog.Root>\n * ```\n */\nconst Root = DialogPrimitive.Root;\nRoot.displayName = \"Dialog\";\n\n/**\n * A button that opens the dialog.\n *\n * @see https://mantle.ngrok.com/components/dialog#api-dialog-trigger\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n *   <Dialog.Trigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Open Dialog\n *     </Button>\n *   </Dialog.Trigger>\n *   <Dialog.Content>\n *     <Dialog.Header>\n *       <Dialog.Title>Dialog Title</Dialog.Title>\n *     </Dialog.Header>\n *     <Dialog.Body>\n *       <p>This is the dialog content.</p>\n *     </Dialog.Body>\n *   </Dialog.Content>\n * </Dialog.Root>\n * ```\n */\nconst Trigger = DialogPrimitive.Trigger;\nTrigger.displayName = \"DialogTrigger\";\n\nconst Portal = DialogPrimitive.Portal;\nPortal.displayName = \"DialogPortal\";\n\nconst Close = DialogPrimitive.Close;\nClose.displayName = \"DialogClose\";\n\nconst Overlay = forwardRef<\n\tComponentRef<\"div\">,\n\tComponentPropsWithoutRef<typeof DialogPrimitive.Overlay>\n>(({ className, ...props }, ref) => (\n\t<DialogPrimitive.Overlay\n\t\tref={ref}\n\t\tclassName={cx(\n\t\t\t\"bg-overlay data-state-closed:animate-out data-state-closed:fade-out-0 data-state-open:animate-in data-state-open:fade-in-0 fixed inset-0 z-50 backdrop-blur-xs\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nOverlay.displayName = \"DialogOverlay\";\n\ntype ContentProps = ComponentPropsWithoutRef<typeof DialogPrimitive.Content> & {\n\t/**\n\t * The preferred width of the `Dialog.Content` as a tailwind `max-w-` class.\n\t *\n\t * By default, a `Dialog`'s content width is responsive with a default\n\t * preferred width: the maximum width of the `Dialog.Content`\n\t *\n\t * @default `max-w-lg`\n\t */\n\tpreferredWidth?: `max-w-${string}`;\n};\n\n/**\n * The container for the dialog content.\n * Renders on top of the overlay and is centered in the viewport.\n *\n * @see https://mantle.ngrok.com/components/dialog#api-dialog-content\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n *   <Dialog.Trigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Open Dialog\n *     </Button>\n *   </Dialog.Trigger>\n *   <Dialog.Content>\n *     <Dialog.Header>\n *       <Dialog.Title>Dialog Title</Dialog.Title>\n *       <Dialog.CloseIconButton />\n *     </Dialog.Header>\n *     <Dialog.Body>\n *       <p>This is the dialog content.</p>\n *     </Dialog.Body>\n *     <Dialog.Footer>\n *       <Button type=\"button\" appearance=\"outlined\">\n *         Cancel\n *       </Button>\n *       <Button type=\"button\" appearance=\"filled\">\n *         Save\n *       </Button>\n *     </Dialog.Footer>\n *   </Dialog.Content>\n * </Dialog.Root>\n * ```\n */\nconst Content = forwardRef<ComponentRef<\"div\">, ContentProps>(\n\t(\n\t\t{\n\t\t\tchildren,\n\t\t\tclassName,\n\t\t\tonInteractOutside,\n\t\t\tonPointerDownOutside,\n\t\t\tpreferredWidth = \"max-w-lg\",\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => (\n\t\t<Portal>\n\t\t\t<Overlay />\n\t\t\t<div className=\"fixed inset-4 z-50 flex items-center justify-center\">\n\t\t\t\t<DialogPrimitive.Content\n\t\t\t\t\tclassName={cx(\n\t\t\t\t\t\t\"flex max-h-full w-full flex-1 flex-col\",\n\t\t\t\t\t\t\"outline-hidden focus-within:outline-hidden\",\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\tref={ref}\n\t\t\t\t\t{...props}\n\t\t\t\t>\n\t\t\t\t\t{children}\n\t\t\t\t</DialogPrimitive.Content>\n\t\t\t</div>\n\t\t</Portal>\n\t),\n);\nContent.displayName = \"DialogContent\";\n\n/**\n * Contains the header content of the dialog, including the title and close button.\n *\n * @see https://mantle.ngrok.com/components/dialog#api-dialog-header\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n *   <Dialog.Trigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Open Dialog\n *     </Button>\n *   </Dialog.Trigger>\n *   <Dialog.Content>\n *     <Dialog.Header>\n *       <Dialog.Title>Dialog Title</Dialog.Title>\n *       <Dialog.CloseIconButton />\n *     </Dialog.Header>\n *     <Dialog.Body>\n *       <p>This is the dialog content.</p>\n *     </Dialog.Body>\n *   </Dialog.Content>\n * </Dialog.Root>\n * ```\n */\nconst Header = ({ className, children, ...props }: ComponentProps<\"div\">) => (\n\t<div\n\t\tclassName={cx(\n\t\t\t\"border-dialog-muted text-strong relative flex shrink-0 items-center justify-between gap-2 border-b px-6 py-4\",\n\t\t\t\"has-[.icon-button]:pr-4\", // when there are actions in the header, shorten the padding\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t>\n\t\t{children}\n\t</div>\n);\nHeader.displayName = \"DialogHeader\";\n\ntype CloseIconButtonProps = Partial<Omit<IconButtonProps, \"icon\">>;\n\n/**\n * An icon button that closes the dialog when clicked.\n *\n * @see https://mantle.ngrok.com/components/dialog#api-dialog-close-icon-button\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n *   <Dialog.Trigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Open Dialog\n *     </Button>\n *   </Dialog.Trigger>\n *   <Dialog.Content>\n *     <Dialog.Header>\n *       <Dialog.Title>Dialog Title</Dialog.Title>\n *       <Dialog.CloseIconButton />\n *     </Dialog.Header>\n *     <Dialog.Body>\n *       <p>This is the dialog content.</p>\n *     </Dialog.Body>\n *   </Dialog.Content>\n * </Dialog.Root>\n * ```\n */\nconst CloseIconButton = ({\n\tsize = \"md\",\n\ttype = \"button\",\n\tlabel = \"Close Dialog\",\n\tappearance = \"ghost\",\n\t...props\n}: CloseIconButtonProps) => (\n\t<DialogPrimitive.Close asChild>\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\ttype={type}\n\t\t\t{...props}\n\t\t/>\n\t</DialogPrimitive.Close>\n);\nCloseIconButton.displayName = \"DialogCloseIconButton\";\n\n/**\n * Contains the main content of the dialog.\n *\n * @see https://mantle.ngrok.com/components/dialog#api-dialog-body\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n *   <Dialog.Trigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Open Dialog\n *     </Button>\n *   </Dialog.Trigger>\n *   <Dialog.Content>\n *     <Dialog.Header>\n *       <Dialog.Title>Dialog Title</Dialog.Title>\n *     </Dialog.Header>\n *     <Dialog.Body>\n *       <p>This is the dialog content.</p>\n *     </Dialog.Body>\n *   </Dialog.Content>\n * </Dialog.Root>\n * ```\n */\nconst Body = ({ className, ...props }: ComponentProps<\"div\">) => (\n\t<div\n\t\tclassName={cx(\"scrollbar text-body flex-1 overflow-y-auto p-6\", className)}\n\t\t{...props}\n\t/>\n);\nBody.displayName = \"DialogBody\";\n\n/**\n * Contains the footer content of the dialog, including action buttons.\n *\n * @see https://mantle.ngrok.com/components/dialog#api-dialog-footer\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n *   <Dialog.Trigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Open Dialog\n *     </Button>\n *   </Dialog.Trigger>\n *   <Dialog.Content>\n *     <Dialog.Header>\n *       <Dialog.Title>Dialog Title</Dialog.Title>\n *     </Dialog.Header>\n *     <Dialog.Body>\n *       <p>This is the dialog content.</p>\n *     </Dialog.Body>\n *     <Dialog.Footer>\n *       <Button type=\"button\" appearance=\"outlined\">\n *         Cancel\n *       </Button>\n *       <Button type=\"button\" appearance=\"filled\">\n *         Save\n *       </Button>\n *     </Dialog.Footer>\n *   </Dialog.Content>\n * </Dialog.Root>\n * ```\n */\nconst Footer = ({ className, ...props }: ComponentProps<\"div\">) => (\n\t<div\n\t\tclassName={cx(\n\t\t\t\"border-dialog-muted flex shrink-0 flex-row-reverse gap-2 border-t px-6 py-4\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n);\nFooter.displayName = \"DialogFooter\";\n\n/**\n * An accessible name to be announced when the dialog is opened.\n *\n * @see https://mantle.ngrok.com/components/dialog#api-dialog-title\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n *   <Dialog.Trigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Open Dialog\n *     </Button>\n *   </Dialog.Trigger>\n *   <Dialog.Content>\n *     <Dialog.Header>\n *       <Dialog.Title>Dialog Title</Dialog.Title>\n *       <Dialog.CloseIconButton />\n *     </Dialog.Header>\n *     <Dialog.Body>\n *       <p>This is the dialog content.</p>\n *     </Dialog.Body>\n *   </Dialog.Content>\n * </Dialog.Root>\n * ```\n */\nconst Title = forwardRef<\n\tComponentRef<typeof DialogPrimitive.Title>,\n\tComponentPropsWithoutRef<typeof DialogPrimitive.Title>\n>(({ className, ...props }, ref) => (\n\t<DialogPrimitive.Title\n\t\tref={ref}\n\t\tclassName={cx(\"text-strong truncate text-lg font-medium\", className)}\n\t\t{...props}\n\t/>\n));\nTitle.displayName = \"DialogTitle\";\n\n/**\n * An accessible description to be announced when the dialog is opened.\n * Renders as a `div` by default, but can be changed to any other element using\n * the `asChild` prop.\n *\n * @see https://mantle.ngrok.com/components/dialog#api-dialog-description\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n *   <Dialog.Trigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Open Dialog\n *     </Button>\n *   </Dialog.Trigger>\n *   <Dialog.Content>\n *     <Dialog.Header>\n *       <Dialog.Title>Dialog Title</Dialog.Title>\n *       <Dialog.Description>\n *         This is an optional description.\n *       </Dialog.Description>\n *     </Dialog.Header>\n *     <Dialog.Body>\n *       <p>This is the dialog content.</p>\n *     </Dialog.Body>\n *   </Dialog.Content>\n * </Dialog.Root>\n * ```\n */\nconst Description = forwardRef<\n\tComponentRef<typeof DialogPrimitive.Description>,\n\tComponentPropsWithoutRef<typeof DialogPrimitive.Description>\n>(({ className, ...props }, ref) => (\n\t<DialogPrimitive.Description\n\t\tref={ref}\n\t\tclassName={cx(\"text-muted\", className)}\n\t\t{...props}\n\t/>\n));\nDescription.displayName = \"DialogDescription\";\n\n/**\n * A window overlaid on either the primary window or another dialog window.\n *\n * @see https://mantle.ngrok.com/components/dialog\n *\n * @example\n * ```tsx\n * <Dialog.Root>\n *   <Dialog.Trigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Open Dialog\n *     </Button>\n *   </Dialog.Trigger>\n *   <Dialog.Content>\n *     <Dialog.Header>\n *       <Dialog.Title>Dialog Title</Dialog.Title>\n *       <Dialog.CloseIconButton />\n *     </Dialog.Header>\n *     <Dialog.Body>\n *       <p>This is the dialog content.</p>\n *     </Dialog.Body>\n *     <Dialog.Footer>\n *       <Button type=\"button\" appearance=\"outlined\">\n *         Cancel\n *       </Button>\n *       <Button type=\"button\" appearance=\"filled\">\n *         Save\n *       </Button>\n *     </Dialog.Footer>\n *   </Dialog.Content>\n * </Dialog.Root>\n * ```\n */\nconst Dialog = {\n\t/**\n\t * A window overlaid on either the primary window or another dialog window.\n\t * The root stateful component for the Dialog.\n\t *\n\t * @see https://mantle.ngrok.com/components/dialog#api-dialog\n\t *\n\t * @example\n\t * ```tsx\n\t * <Dialog.Root>\n\t *   <Dialog.Trigger asChild>\n\t *     <Button type=\"button\" appearance=\"outlined\">\n\t *       Open Dialog\n\t *     </Button>\n\t *   </Dialog.Trigger>\n\t *   <Dialog.Content>\n\t *     <Dialog.Header>\n\t *       <Dialog.Title>Dialog Title</Dialog.Title>\n\t *       <Dialog.CloseIconButton />\n\t *     </Dialog.Header>\n\t *     <Dialog.Body>\n\t *       <p>This is the dialog content.</p>\n\t *     </Dialog.Body>\n\t *     <Dialog.Footer>\n\t *       <Button type=\"button\" appearance=\"outlined\">\n\t *         Cancel\n\t *       </Button>\n\t *       <Button type=\"button\" appearance=\"filled\">\n\t *         Save\n\t *       </Button>\n\t *     </Dialog.Footer>\n\t *   </Dialog.Content>\n\t * </Dialog.Root>\n\t * ```\n\t */\n\tRoot,\n\t/**\n\t * Contains the main content of the dialog.\n\t *\n\t * @see https://mantle.ngrok.com/components/dialog#api-dialog-body\n\t *\n\t * @example\n\t * ```tsx\n\t * <Dialog.Root>\n\t *   <Dialog.Trigger asChild>\n\t *     <Button type=\"button\" appearance=\"outlined\">\n\t *       Open Dialog\n\t *     </Button>\n\t *   </Dialog.Trigger>\n\t *   <Dialog.Content>\n\t *     <Dialog.Header>\n\t *       <Dialog.Title>Dialog Title</Dialog.Title>\n\t *     </Dialog.Header>\n\t *     <Dialog.Body>\n\t *       <p>This is the dialog content.</p>\n\t *     </Dialog.Body>\n\t *   </Dialog.Content>\n\t * </Dialog.Root>\n\t * ```\n\t */\n\tBody,\n\t/**\n\t * A button that closes the dialog when clicked.\n\t *\n\t * @see https://mantle.ngrok.com/components/dialog#api-dialog-close\n\t *\n\t * @example\n\t * ```tsx\n\t * <Dialog.Root>\n\t *   <Dialog.Trigger asChild>\n\t *     <Button type=\"button\">Open Dialog</Button>\n\t *   </Dialog.Trigger>\n\t *   <Dialog.Content>\n\t *     <Dialog.Header>\n\t *       <Dialog.Title>Confirm Action</Dialog.Title>\n\t *     </Dialog.Header>\n\t *     <Dialog.Body>\n\t *       <Text>Are you sure you want to proceed?</Text>\n\t *     </Dialog.Body>\n\t *     <Dialog.Footer>\n\t *       <Dialog.Close asChild>\n\t *         <Button type=\"button\" appearance=\"outlined\">Cancel</Button>\n\t *       </Dialog.Close>\n\t *       <Button type=\"submit\">Confirm</Button>\n\t *     </Dialog.Footer>\n\t *   </Dialog.Content>\n\t * </Dialog.Root>\n\t * ```\n\t */\n\tClose,\n\t/**\n\t * An icon button that closes the dialog when clicked.\n\t *\n\t * @see https://mantle.ngrok.com/components/dialog#api-dialog-close-icon-button\n\t *\n\t * @example\n\t * ```tsx\n\t * <Dialog.Root>\n\t *   <Dialog.Trigger asChild>\n\t *     <Button type=\"button\" appearance=\"outlined\">\n\t *       Open Dialog\n\t *     </Button>\n\t *   </Dialog.Trigger>\n\t *   <Dialog.Content>\n\t *     <Dialog.Header>\n\t *       <Dialog.Title>Dialog Title</Dialog.Title>\n\t *       <Dialog.CloseIconButton />\n\t *     </Dialog.Header>\n\t *     <Dialog.Body>\n\t *       <p>This is the dialog content.</p>\n\t *     </Dialog.Body>\n\t *   </Dialog.Content>\n\t * </Dialog.Root>\n\t * ```\n\t */\n\tCloseIconButton,\n\t/**\n\t * The container for the dialog content.\n\t * Renders on top of the overlay and is centered in the viewport.\n\t *\n\t * @see https://mantle.ngrok.com/components/dialog#api-dialog-content\n\t *\n\t * @example\n\t * ```tsx\n\t * <Dialog.Root>\n\t *   <Dialog.Trigger asChild>\n\t *     <Button type=\"button\" appearance=\"outlined\">\n\t *       Open Dialog\n\t *     </Button>\n\t *   </Dialog.Trigger>\n\t *   <Dialog.Content>\n\t *     <Dialog.Header>\n\t *       <Dialog.Title>Dialog Title</Dialog.Title>\n\t *       <Dialog.CloseIconButton />\n\t *     </Dialog.Header>\n\t *     <Dialog.Body>\n\t *       <p>This is the dialog content.</p>\n\t *     </Dialog.Body>\n\t *     <Dialog.Footer>\n\t *       <Button type=\"button\" appearance=\"outlined\">\n\t *         Cancel\n\t *       </Button>\n\t *       <Button type=\"button\" appearance=\"filled\">\n\t *         Save\n\t *       </Button>\n\t *     </Dialog.Footer>\n\t *   </Dialog.Content>\n\t * </Dialog.Root>\n\t * ```\n\t */\n\tContent,\n\t/**\n\t * An accessible description to be announced when the dialog is opened.\n\t *\n\t * @see https://mantle.ngrok.com/components/dialog#api-dialog-description\n\t *\n\t * @example\n\t * ```tsx\n\t * <Dialog.Root>\n\t *   <Dialog.Trigger asChild>\n\t *     <Button type=\"button\" appearance=\"outlined\">\n\t *       Open Dialog\n\t *     </Button>\n\t *   </Dialog.Trigger>\n\t *   <Dialog.Content>\n\t *     <Dialog.Header>\n\t *       <Dialog.Title>Dialog Title</Dialog.Title>\n\t *       <Dialog.Description>\n\t *         This is an optional description.\n\t *       </Dialog.Description>\n\t *     </Dialog.Header>\n\t *     <Dialog.Body>\n\t *       <p>This is the dialog content.</p>\n\t *     </Dialog.Body>\n\t *   </Dialog.Content>\n\t * </Dialog.Root>\n\t * ```\n\t */\n\tDescription,\n\t/**\n\t * Contains the footer content of the dialog, including action buttons.\n\t *\n\t * @see https://mantle.ngrok.com/components/dialog#api-dialog-footer\n\t *\n\t * @example\n\t * ```tsx\n\t * <Dialog.Root>\n\t *   <Dialog.Trigger asChild>\n\t *     <Button type=\"button\" appearance=\"outlined\">\n\t *       Open Dialog\n\t *     </Button>\n\t *   </Dialog.Trigger>\n\t *   <Dialog.Content>\n\t *     <Dialog.Header>\n\t *       <Dialog.Title>Dialog Title</Dialog.Title>\n\t *     </Dialog.Header>\n\t *     <Dialog.Body>\n\t *       <p>This is the dialog content.</p>\n\t *     </Dialog.Body>\n\t *     <Dialog.Footer>\n\t *       <Button type=\"button\" appearance=\"outlined\">\n\t *         Cancel\n\t *       </Button>\n\t *       <Button type=\"button\" appearance=\"filled\">\n\t *         Save\n\t *       </Button>\n\t *     </Dialog.Footer>\n\t *   </Dialog.Content>\n\t * </Dialog.Root>\n\t * ```\n\t */\n\tFooter,\n\t/**\n\t * Contains the header content of the dialog, including the title and close button.\n\t *\n\t * @see https://mantle.ngrok.com/components/dialog#api-dialog-header\n\t *\n\t * @example\n\t * ```tsx\n\t * <Dialog.Root>\n\t *   <Dialog.Trigger asChild>\n\t *     <Button type=\"button\" appearance=\"outlined\">\n\t *       Open Dialog\n\t *     </Button>\n\t *   </Dialog.Trigger>\n\t *   <Dialog.Content>\n\t *     <Dialog.Header>\n\t *       <Dialog.Title>Dialog Title</Dialog.Title>\n\t *       <Dialog.CloseIconButton />\n\t *     </Dialog.Header>\n\t *     <Dialog.Body>\n\t *       <p>This is the dialog content.</p>\n\t *     </Dialog.Body>\n\t *   </Dialog.Content>\n\t * </Dialog.Root>\n\t * ```\n\t */\n\tHeader,\n\t/**\n\t * The overlay backdrop for the dialog.\n\t *\n\t * @see https://mantle.ngrok.com/components/dialog#api-dialog-overlay\n\t *\n\t * @example\n\t * ```tsx\n\t * <Dialog.Root>\n\t *   <Dialog.Portal>\n\t *     <Dialog.Overlay />\n\t *     <Dialog.Content>\n\t *       <Dialog.Header>\n\t *         <Dialog.Title>Dialog Title</Dialog.Title>\n\t *       </Dialog.Header>\n\t *       <Dialog.Body>\n\t *         <Text>Dialog content here.</Text>\n\t *       </Dialog.Body>\n\t *     </Dialog.Content>\n\t *   </Dialog.Portal>\n\t * </Dialog.Root>\n\t * ```\n\t */\n\tOverlay,\n\t/**\n\t * The portal container for the dialog.\n\t *\n\t * @see https://mantle.ngrok.com/components/dialog#api-dialog-portal\n\t *\n\t * @example\n\t * ```tsx\n\t * <Dialog.Root>\n\t *   <Dialog.Trigger asChild>\n\t *     <Button type=\"button\">Open Dialog</Button>\n\t *   </Dialog.Trigger>\n\t *   <Dialog.Portal>\n\t *     <Dialog.Overlay />\n\t *     <Dialog.Content>\n\t *       <Dialog.Header>\n\t *         <Dialog.Title>Portal Dialog</Dialog.Title>\n\t *       </Dialog.Header>\n\t *       <Dialog.Body>\n\t *         <Text>This dialog is rendered in a portal.</Text>\n\t *       </Dialog.Body>\n\t *     </Dialog.Content>\n\t *   </Dialog.Portal>\n\t * </Dialog.Root>\n\t * ```\n\t */\n\tPortal,\n\t/**\n\t * An accessible name to be announced when the dialog is opened.\n\t *\n\t * @see https://mantle.ngrok.com/components/dialog#api-dialog-title\n\t *\n\t * @example\n\t * ```tsx\n\t * <Dialog.Root>\n\t *   <Dialog.Trigger asChild>\n\t *     <Button type=\"button\" appearance=\"outlined\">\n\t *       Open Dialog\n\t *     </Button>\n\t *   </Dialog.Trigger>\n\t *   <Dialog.Content>\n\t *     <Dialog.Header>\n\t *       <Dialog.Title>Dialog Title</Dialog.Title>\n\t *       <Dialog.CloseIconButton />\n\t *     </Dialog.Header>\n\t *     <Dialog.Body>\n\t *       <p>This is the dialog content.</p>\n\t *     </Dialog.Body>\n\t *   </Dialog.Content>\n\t * </Dialog.Root>\n\t * ```\n\t */\n\tTitle,\n\t/**\n\t * A button that opens the dialog.\n\t *\n\t * @see https://mantle.ngrok.com/components/dialog#api-dialog-trigger\n\t *\n\t * @example\n\t * ```tsx\n\t * <Dialog.Root>\n\t *   <Dialog.Trigger asChild>\n\t *     <Button type=\"button\" appearance=\"outlined\">\n\t *       Open Dialog\n\t *     </Button>\n\t *   </Dialog.Trigger>\n\t *   <Dialog.Content>\n\t *     <Dialog.Header>\n\t *       <Dialog.Title>Dialog Title</Dialog.Title>\n\t *     </Dialog.Header>\n\t *     <Dialog.Body>\n\t *       <p>This is the dialog content.</p>\n\t *     </Dialog.Body>\n\t *   </Dialog.Content>\n\t * </Dialog.Root>\n\t * ```\n\t */\n\tTrigger,\n} as const;\n\nexport {\n\t//,\n\tDialog,\n};\n"],"mappings":"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","names":["XIcon","forwardRef","jsx","jsxs","Root","Trigger","Portal","Close","Overlay","forwardRef","className","props","ref","cx","Content","children","onInteractOutside","onPointerDownOutside","preferredWidth","event","preventCloseOnPromptInteraction","Header","CloseIconButton","size","type","label","appearance","IconButton","XIcon","Body","Footer","Title","Description","Dialog"]}

package/dist/{primitive-BUbUB7RS.d.ts → primitive-CBR_XmVa.d.ts}

@@ -6,5 +6,9 @@ declare function Root(props: ComponentPropsWithoutRef<typeof _radix_ui_react_dia
 declare namespace Root {
     var displayName: string;
 }
+/**
+ * Type guard to check if the event target is the overlay component
+ */
+declare function isDialogOverlayTarget(target: EventTarget | null): boolean;
 
-export { Root as R };
+export { Root as R, isDialogOverlayTarget as i };

package/dist/sheet.d.ts

@@ -5,7 +5,7 @@ import * as react from 'react';
 import { HTMLAttributes } from 'react';
 import { VariantProps } from 'class-variance-authority';
 import { a as IconButtonProps } from './icon-button-D4BTvC7F.js';
-import { R as Root } from './primitive-BUbUB7RS.js';
+import { R as Root } from './primitive-CBR_XmVa.js';
 import './as-child-DJ7x3JFV.js';
 import './variant-props-oDo2u-We.js';
 import './deep-non-nullable-SmpSvoSd.js';

package/dist/sheet.js

@@ -1,2 +1,2 @@
-import{a as u,b as v,c as S,d as m,e as p,f as d,g as h,h as f}from"./chunk-PX63EGR2.js";import{d as c}from"./chunk-RH46OJYB.js";import"./chunk-THKAHLEP.js";import"./chunk-6J7D73WA.js";import{c as y}from"./chunk-XTCU7MXB.js";import"./chunk-4LSFAAZW.js";import"./chunk-72TJUKMV.js";import"./chunk-3C5O3AQA.js";import"./chunk-I6T6YV2L.js";import"./chunk-NPTDRQT5.js";import{a}from"./chunk-AZ56JGNY.js";import{XIcon as W}from"@phosphor-icons/react/X";import{cva as E}from"class-variance-authority";import{forwardRef as s}from"react";import{jsx as o,jsxs as z}from"react/jsx-runtime";var P=u;P.displayName="Sheet";var C=v;C.displayName="SheetTrigger";var g=m;g.displayName="SheetClose";var N=S;N.displayName="SheetPortal";var b=s(({className:e,...t},i)=>o(p,{className:a("bg-overlay data-state-closed:animate-out data-state-closed:fade-out-0 data-state-open:animate-in data-state-open:fade-in-0 fixed inset-0 z-40 backdrop-blur-xs",e),...t,ref:i}));b.displayName=p.displayName;var V=E("bg-dialog border-dialog inset-y-0 h-full w-full fixed z-40 flex flex-col shadow-lg outline-hidden transition ease-in-out focus-within:outline-hidden data-state-closed:duration-100 data-state-closed:animate-out data-state-open:duration-100 data-state-open:animate-in",{variants:{side:{left:"data-state-closed:slide-out-to-left data-state-open:slide-in-from-left left-0 border-r",right:"data-state-closed:slide-out-to-right data-state-open:slide-in-from-right right-0 border-l"}},defaultVariants:{side:"right"}}),x=s(({children:e,className:t,onInteractOutside:i,onPointerDownOutside:r,preferredWidth:l="sm:max-w-[30rem]",side:B="right",...O},A)=>z(N,{children:[o(b,{}),o(d,{className:a(V({side:B}),l,t),onInteractOutside:n=>{c(n),i?.(n)},onPointerDownOutside:n=>{c(n),r?.(n)},ref:A,...O,children:e})]}));x.displayName=d.displayName;var T=({size:e="md",type:t="button",label:i="Close Sheet",appearance:r="ghost",...l})=>o(m,{asChild:!0,children:o(y,{appearance:r,icon:o(W,{}),label:i,size:e,type:t,...l})});T.displayName="SheetCloseIconButton";var R=({className:e,...t})=>o("div",{className:a("scrollbar text-body flex-1 overflow-y-auto p-6",e),...t});R.displayName="SheetBody";var H=({className:e,...t})=>o("div",{className:a("border-dialog-muted flex shrink-0 flex-col gap-2 border-b py-4 pl-6 pr-4","has-[.icon-button]:pr-4",e),...t});H.displayName="SheetHeader";var D=({className:e,...t})=>o("div",{className:a("border-dialog-muted flex shrink-0 justify-end gap-2 border-t px-6 py-2.5",e),...t});D.displayName="SheetFooter";var L=s(({className:e,...t},i)=>o(h,{ref:i,className:a("text-strong flex-1 truncate text-lg font-medium",e),...t}));L.displayName=h.displayName;var M=s(({children:e,className:t,...i},r)=>o("div",{className:a("flex items-center justify-between gap-2",t),...i,ref:r,children:e}));M.displayName="SheetTitleGroup";var I=s(({className:e,...t},i)=>o(f,{ref:i,className:a("text-body text-sm",e),...t}));I.displayName=f.displayName;var w=s(({children:e,className:t,...i},r)=>o("div",{className:a("flex h-full items-center gap-2",t),...i,ref:r,children:e}));w.displayName="SheetActions";var k={Root:P,Actions:w,Body:R,Close:g,CloseIconButton:T,Content:x,Description:I,Footer:D,Header:H,Title:L,TitleGroup:M,Trigger:C};export{k as Sheet};
+import{a as u,b as v,c as S,d as m,e as p,f as d,g as h,h as f}from"./chunk-VIKPHWPP.js";import{d as c}from"./chunk-RH46OJYB.js";import"./chunk-THKAHLEP.js";import"./chunk-6J7D73WA.js";import{c as y}from"./chunk-XTCU7MXB.js";import"./chunk-4LSFAAZW.js";import"./chunk-72TJUKMV.js";import"./chunk-3C5O3AQA.js";import"./chunk-I6T6YV2L.js";import"./chunk-NPTDRQT5.js";import{a}from"./chunk-AZ56JGNY.js";import{XIcon as W}from"@phosphor-icons/react/X";import{cva as E}from"class-variance-authority";import{forwardRef as s}from"react";import{jsx as o,jsxs as z}from"react/jsx-runtime";var P=u;P.displayName="Sheet";var C=v;C.displayName="SheetTrigger";var g=m;g.displayName="SheetClose";var N=S;N.displayName="SheetPortal";var b=s(({className:e,...t},i)=>o(p,{className:a("bg-overlay data-state-closed:animate-out data-state-closed:fade-out-0 data-state-open:animate-in data-state-open:fade-in-0 fixed inset-0 z-40 backdrop-blur-xs",e),...t,ref:i}));b.displayName=p.displayName;var V=E("bg-dialog border-dialog inset-y-0 h-full w-full fixed z-40 flex flex-col shadow-lg outline-hidden transition ease-in-out focus-within:outline-hidden data-state-closed:duration-100 data-state-closed:animate-out data-state-open:duration-100 data-state-open:animate-in",{variants:{side:{left:"data-state-closed:slide-out-to-left data-state-open:slide-in-from-left left-0 border-r",right:"data-state-closed:slide-out-to-right data-state-open:slide-in-from-right right-0 border-l"}},defaultVariants:{side:"right"}}),x=s(({children:e,className:t,onInteractOutside:i,onPointerDownOutside:r,preferredWidth:l="sm:max-w-[30rem]",side:B="right",...O},A)=>z(N,{children:[o(b,{}),o(d,{className:a(V({side:B}),l,t),onInteractOutside:n=>{c(n),i?.(n)},onPointerDownOutside:n=>{c(n),r?.(n)},ref:A,...O,children:e})]}));x.displayName=d.displayName;var T=({size:e="md",type:t="button",label:i="Close Sheet",appearance:r="ghost",...l})=>o(m,{asChild:!0,children:o(y,{appearance:r,icon:o(W,{}),label:i,size:e,type:t,...l})});T.displayName="SheetCloseIconButton";var R=({className:e,...t})=>o("div",{className:a("scrollbar text-body flex-1 overflow-y-auto p-6",e),...t});R.displayName="SheetBody";var H=({className:e,...t})=>o("div",{className:a("border-dialog-muted flex shrink-0 flex-col gap-2 border-b py-4 pl-6 pr-4","has-[.icon-button]:pr-4",e),...t});H.displayName="SheetHeader";var D=({className:e,...t})=>o("div",{className:a("border-dialog-muted flex shrink-0 justify-end gap-2 border-t px-6 py-2.5",e),...t});D.displayName="SheetFooter";var L=s(({className:e,...t},i)=>o(h,{ref:i,className:a("text-strong flex-1 truncate text-lg font-medium",e),...t}));L.displayName=h.displayName;var M=s(({children:e,className:t,...i},r)=>o("div",{className:a("flex items-center justify-between gap-2",t),...i,ref:r,children:e}));M.displayName="SheetTitleGroup";var I=s(({className:e,...t},i)=>o(f,{ref:i,className:a("text-body text-sm",e),...t}));I.displayName=f.displayName;var w=s(({children:e,className:t,...i},r)=>o("div",{className:a("flex h-full items-center gap-2",t),...i,ref:r,children:e}));w.displayName="SheetActions";var k={Root:P,Actions:w,Body:R,Close:g,CloseIconButton:T,Content:x,Description:I,Footer:D,Header:H,Title:L,TitleGroup:M,Trigger:C};export{k as Sheet};
 //# sourceMappingURL=sheet.js.map

package/package.json

@@ -3,7 +3,7 @@
   "description": "mantle is ngrok's UI library and design system.",
   "author": "ngrok",
   "license": "MIT",
-  "version": "0.52.7",
+  "version": "0.52.9",
   "homepage": "https://mantle.ngrok.com",
   "repository": {
     "type": "git",
@@ -26,7 +26,7 @@
   },
   "dependencies": {
     "@ariakit/react": "0.4.18",
-    "@headlessui/react": "2.2.7",
+    "@headlessui/react": "2.2.8",
     "@radix-ui/react-accordion": "1.2.12",
     "@radix-ui/react-dialog": "1.1.15",
     "@radix-ui/react-dropdown-menu": "2.1.16",
@@ -58,12 +58,12 @@
     "@types/prismjs": "1.26.5",
     "@types/react": "18.3.24",
     "@types/react-dom": "18.3.7",
-    "browserslist": "4.25.4",
+    "browserslist": "4.26.0",
     "date-fns": "4.1.0",
     "jsdom": "26.1.0",
     "react": "18.3.1",
     "react-dom": "18.3.1",
-    "react-router": "7.8.2",
+    "react-router": "7.9.1",
     "tailwindcss": "4.1.13",
     "tsup": "8.5.0",
     "typescript": "5.9.2",

package/dist/chunk-PX63EGR2.js

@@ -1,2 +0,0 @@
-import*as i from"@radix-ui/react-dialog";import{Slot as m}from"@radix-ui/react-slot";import{createContext as D,forwardRef as s,useContext as l,useEffect as c,useState as v}from"react";import{jsx as r}from"react/jsx-runtime";var a=D({hasDescription:!1,setHasDescription:()=>{}});function g(e){let[t,o]=v(!1);return r(a.Provider,{value:{hasDescription:t,setHasDescription:o},children:r(i.Root,{...e})})}g.displayName="DialogPrimitiveRoot";var P=i.Trigger;P.displayName="DialogPrimitiveTrigger";var f=i.Portal;f.displayName="DialogPrimitivePortal";var d=i.Close;d.displayName="DialogPrimitiveClose";var C=i.Overlay;C.displayName="DialogPrimitiveOverlay";var u=s((e,t)=>{let o=l(a);return r(i.Content,{ref:t,...o.hasDescription?{}:{"aria-describedby":void 0},...e})});u.displayName="DialogPrimitiveContent";var b=i.Title,y=s(({asChild:e,children:t,...o},p)=>{let n=l(a);return c(()=>(n.setHasDescription(!0),()=>n.setHasDescription(!1)),[n]),r(i.Description,{ref:p,asChild:!0,children:r(e?m:"div",{...o,children:t})})});y.displayName="DialogPrimitiveDescription";export{g as a,P as b,f as c,d,C as e,u as f,b as g,y as h};
-//# sourceMappingURL=chunk-PX63EGR2.js.map

package/dist/chunk-PX63EGR2.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/dialog/primitive.tsx"],"sourcesContent":["\"use client\";\n\nimport * as DialogPrimitive from \"@radix-ui/react-dialog\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport {\n\ttype ComponentPropsWithoutRef,\n\ttype ComponentRef,\n\tcreateContext,\n\tforwardRef,\n\tuseContext,\n\tuseEffect,\n\tuseState,\n} from \"react\";\n\ntype InternalDialogContextValue = {\n\thasDescription: boolean;\n\tsetHasDescription: (value: boolean) => void;\n};\n\nconst InternalDialogContext = createContext<InternalDialogContextValue>({\n\thasDescription: false,\n\tsetHasDescription: () => {},\n});\n\nfunction Root(props: ComponentPropsWithoutRef<typeof DialogPrimitive.Root>) {\n\tconst [hasDescription, setHasDescription] = useState(false);\n\n\treturn (\n\t\t<InternalDialogContext.Provider\n\t\t\tvalue={{ hasDescription, setHasDescription }}\n\t\t>\n\t\t\t<DialogPrimitive.Root {...props} />\n\t\t</InternalDialogContext.Provider>\n\t);\n}\nRoot.displayName = \"DialogPrimitiveRoot\";\n\nconst Trigger = DialogPrimitive.Trigger;\nTrigger.displayName = \"DialogPrimitiveTrigger\";\n\nconst Portal = DialogPrimitive.Portal;\nPortal.displayName = \"DialogPrimitivePortal\";\n\nconst Close = DialogPrimitive.Close;\nClose.displayName = \"DialogPrimitiveClose\";\n\nconst Overlay = DialogPrimitive.Overlay;\nOverlay.displayName = \"DialogPrimitiveOverlay\";\n\n/**\n * The main content container of the dialog primitive.\n * This is a low-level primitive used by higher-level dialog components.\n */\nconst Content = forwardRef<\n\tComponentRef<\"div\">,\n\tComponentPropsWithoutRef<typeof DialogPrimitive.Content>\n>((props, ref) => {\n\tconst ctx = useContext(InternalDialogContext);\n\n\treturn (\n\t\t<DialogPrimitive.Content\n\t\t\tref={ref}\n\t\t\t// If there's no description, we remove the default applied aria-describedby attribute from radix dialog\n\t\t\t{...(!ctx.hasDescription ? { \"aria-describedby\": undefined } : {})}\n\t\t\t{...props}\n\t\t/>\n\t);\n});\nContent.displayName = \"DialogPrimitiveContent\";\n\nconst Title = DialogPrimitive.Title;\n\n/**\n * An accessible description for the dialog primitive.\n * This is a low-level primitive used by higher-level dialog components.\n * Renders as a `div` by default, but can be changed to any other element using the `asChild` prop.\n */\nconst Description = forwardRef<\n\tComponentRef<\"div\">,\n\tComponentPropsWithoutRef<typeof DialogPrimitive.Description>\n>(({ asChild, children, ...props }, ref) => {\n\tconst ctx = useContext(InternalDialogContext);\n\n\tuseEffect(() => {\n\t\tctx.setHasDescription(true);\n\t\treturn () => ctx.setHasDescription(false);\n\t}, [ctx]);\n\n\tconst Component = asChild ? Slot : \"div\";\n\n\treturn (\n\t\t<DialogPrimitive.Description ref={ref} asChild>\n\t\t\t<Component {...props}>{children}</Component>\n\t\t</DialogPrimitive.Description>\n\t);\n});\nDescription.displayName = \"DialogPrimitiveDescription\";\n\nexport {\n\t//,\n\tRoot,\n\tTrigger,\n\tPortal,\n\tClose,\n\tOverlay,\n\tContent,\n\tDescription,\n\tTitle,\n};\n"],"mappings":"AAEA,UAAYA,MAAqB,yBACjC,OAAS,QAAAC,MAAY,uBACrB,OAGC,iBAAAC,EACA,cAAAC,EACA,cAAAC,EACA,aAAAC,EACA,YAAAC,MACM,QAmBJ,cAAAC,MAAA,oBAZH,IAAMC,EAAwBN,EAA0C,CACvE,eAAgB,GAChB,kBAAmB,IAAM,CAAC,CAC3B,CAAC,EAED,SAASO,EAAKC,EAA8D,CAC3E,GAAM,CAACC,EAAgBC,CAAiB,EAAIN,EAAS,EAAK,EAE1D,OACCC,EAACC,EAAsB,SAAtB,CACA,MAAO,CAAE,eAAAG,EAAgB,kBAAAC,CAAkB,EAE3C,SAAAL,EAAiB,OAAhB,CAAsB,GAAGG,EAAO,EAClC,CAEF,CACAD,EAAK,YAAc,sBAEnB,IAAMI,EAA0B,UAChCA,EAAQ,YAAc,yBAEtB,IAAMC,EAAyB,SAC/BA,EAAO,YAAc,wBAErB,IAAMC,EAAwB,QAC9BA,EAAM,YAAc,uBAEpB,IAAMC,EAA0B,UAChCA,EAAQ,YAAc,yBAMtB,IAAMC,EAAUd,EAGd,CAACO,EAAOQ,IAAQ,CACjB,IAAMC,EAAMf,EAAWI,CAAqB,EAE5C,OACCD,EAAiB,UAAhB,CACA,IAAKW,EAEJ,GAAKC,EAAI,eAAqD,CAAC,EAArC,CAAE,mBAAoB,MAAU,EAC1D,GAAGT,EACL,CAEF,CAAC,EACDO,EAAQ,YAAc,yBAEtB,IAAMG,EAAwB,QAOxBC,EAAclB,EAGlB,CAAC,CAAE,QAAAmB,EAAS,SAAAC,EAAU,GAAGb,CAAM,EAAGQ,IAAQ,CAC3C,IAAMC,EAAMf,EAAWI,CAAqB,EAE5C,OAAAH,EAAU,KACTc,EAAI,kBAAkB,EAAI,EACnB,IAAMA,EAAI,kBAAkB,EAAK,GACtC,CAACA,CAAG,CAAC,EAKPZ,EAAiB,cAAhB,CAA4B,IAAKW,EAAK,QAAO,GAC7C,SAAAX,EAJgBe,EAAUrB,EAAO,MAIhC,CAAW,GAAGS,EAAQ,SAAAa,EAAS,EACjC,CAEF,CAAC,EACDF,EAAY,YAAc","names":["DialogPrimitive","Slot","createContext","forwardRef","useContext","useEffect","useState","jsx","InternalDialogContext","Root","props","hasDescription","setHasDescription","Trigger","Portal","Close","Overlay","Content","ref","ctx","Title","Description","asChild","children"]}