admin-ui-starter-kit 0.1.0

package/dist/showcase/assets/overlays-Lu16yJWM.js

@@ -0,0 +1,393 @@
+import{n as e,r as t}from"./chunk-CilyBKbf.js";import{br as n,cr as r,gr as i,lr as a,r as o,sr as s,t as c,vr as l}from"./example-DPfw-R7_.js";import{t as u}from"./badge-check-oP2z_95u.js";import{t as d}from"./circle-alert-DfQp_X3_.js";import{t as f}from"./circle-check-BkqQe1tv.js";import{t as p}from"./circle-check-big-BXxHUhuc.js";import{t as m}from"./circle-question-mark-BgS4fb6N.js";import{t as h}from"./credit-card--5vg7bQy.js";import{t as g}from"./file-text-DokBif5V.js";import{t as _}from"./info-DyB6KH3Z.js";import{t as v}from"./send-BhjEdZ06.js";import{t as y}from"./settings-Duj7gAZe.js";import{t as b}from"./shield-alert-DgZ6UO46.js";import{t as x}from"./sparkles-C-fyahzv.js";import{t as S}from"./trash-2-B0_GprQM.js";import{t as C}from"./user-plus-9WRYjS04.js";import{t as w}from"./x-t42iKYpL.js";import{D as T,O as E,a as D,k as O}from"./index-B-Z7p0So.js";import{t as k}from"./props-table-BzUnIcv-.js";import{r as A,t as j}from"./avatar-DR2mqPpY.js";var M=t(O(),1),N=350,P=0;function F(){if(P===0){let e=window.innerWidth-document.documentElement.clientWidth;document.body.style.setProperty(`--overlay-scrollbar-width`,`${e}px`),document.documentElement.setAttribute(`data-overlay-scroll-locked`,``)}P+=1;let e=!1;return()=>{e||(e=!0,P=Math.max(0,P-1),!(P>0)&&(document.documentElement.removeAttribute(`data-overlay-scroll-locked`),document.body.style.removeProperty(`--overlay-scrollbar-width`)))}}function ee({open:e,onOpenChange:t,onClose:n,closeOnEscape:r=!0,closeOnBackdropClick:i=!0,initialFocusRef:a}={}){let o=(0,M.useRef)(null),[s,c]=(0,M.useState)(!1),[l,u]=(0,M.useState)(!1),d=(0,M.useRef)(null),f=(0,M.useRef)(null),p=(0,M.useRef)(null),m=(0,M.useRef)(null),h=(0,M.useRef)(null),g=(0,M.useRef)(!1),_=e!==void 0,v=_?e:s,y=(0,M.useRef)(v);y.current=v;let b=(0,M.useRef)(l);b.current=l;let x=(0,M.useCallback)(e=>{_||c(e),t?.(e),e||n?.()},[_,t,n]),S=(0,M.useCallback)(()=>{p.current&&=(clearTimeout(p.current),null),m.current&&=(m.current(),null)},[]),C=(0,M.useCallback)(()=>{S(),g.current=!0;let e=d.current;d.current=null;let t=f.current;f.current=null;try{e?.()}catch{}try{x(!1)}catch{}u(!1);let n=o.current;n&&n.classList.remove(`closing`);try{t?.focus()}catch{}},[S,x]),w=(0,M.useCallback)(()=>{y.current||b.current||(f.current=document.activeElement,d.current=F(),x(!0),h.current=requestAnimationFrame(()=>{h.current=null,a?.current?a.current.focus():o.current?.focus()}))},[x,a]),T=(0,M.useCallback)(()=>{let e=o.current;if(!(!e||!y.current||b.current))if(u(!0),e.classList.add(`closing`),e.offsetHeight,getComputedStyle(e).animationName!==`none`){let t=()=>{C()};e.addEventListener(`animationend`,t,{once:!0}),m.current=()=>{e.removeEventListener(`animationend`,t)},p.current=setTimeout(()=>{C()},N)}else C()},[C]),E=(0,M.useCallback)(()=>{v?T():w()},[v,w,T]),D=(0,M.useCallback)(e=>{e.key===`Escape`&&r&&(e.preventDefault(),e.stopPropagation(),T())},[r,T]),O=(0,M.useCallback)(()=>{i&&T()},[i,T]);return(0,M.useEffect)(()=>{if(v&&!l)f.current||=document.activeElement,d.current||=F(),h.current!==null&&cancelAnimationFrame(h.current),h.current=requestAnimationFrame(()=>{h.current=null,a?.current?a.current.focus():o.current?.focus()});else if(!v){if(g.current){g.current=!1;return}if(d.current&&=(d.current(),null),l){S(),u(!1);let e=o.current;e&&e.classList.remove(`closing`)}if(f.current){try{f.current.focus()}catch{}f.current=null}}return()=>{h.current!==null&&(cancelAnimationFrame(h.current),h.current=null)}},[v,l,a,S]),(0,M.useEffect)(()=>()=>{S(),h.current!==null&&(cancelAnimationFrame(h.current),h.current=null),d.current&&=(d.current(),null)},[S]),{dialogRef:o,isOpen:v,isClosing:l,openDialog:w,closeDialog:T,toggleDialog:E,dialogProps:{ref:o,open:v,onKeyDown:D},handleBackdropClick:O}}var I={confirm:`Confirm`,cancel:`Cancel`,close:`Close`,loading:`Loading...`},te={confirm:`Continue`,cancel:`Cancel`,close:`Close`,loading:`Loading...`};function ne({closeDialog:e,onConfirm:t,onAsyncConfirm:n,closeOnAsyncComplete:r=!0,confirmVariant:i=`primary`,isLoading:a=!1,formId:o,onCancel:s,customStrings:c,emphasis:l=!1,tone:u=`default`,onError:d}){let f=T(I,c),[p,m]=(0,M.useState)(!1),h=(0,M.useCallback)(async()=>{if(t){t(),e();return}if(n){m(!0);try{await n(),r&&e()}catch(e){d?.(e)}finally{m(!1)}return}e()},[t,n,r,e,d]),g=(0,M.useCallback)(()=>{s?.(),e()},[s,e]),_=(0,M.useCallback)(async()=>{if(!o)return;let e=document.getElementById(o);e instanceof HTMLFormElement&&e.requestSubmit()},[o]);return{strings:f,isExecuting:p,handleConfirm:h,handleCancel:g,finalConfirmVariant:(0,M.useMemo)(()=>l?u===`error`?`error`:u===`warning`?`warning`:u===`success`?`success`:i??`primary`:i??`primary`,[l,u,i]),confirmButtonOnClick:o?_:h,effectiveLoading:p||a}}var re=t(E(),1),L=D(),R={xs:`max-w-xs`,sm:`max-w-sm`,md:`max-w-md`,lg:`max-w-lg`,xl:`max-w-xl`,"2xl":`max-w-2xl`,"3xl":`max-w-3xl`,"4xl":`max-w-4xl`,"5xl":`max-w-5xl`,full:`max-w-[calc(100vw-2rem)]`},z={default:{icon:(0,L.jsx)(m,{className:`text-muted-foreground h-5 w-5`}),classes:``},error:{icon:(0,L.jsx)(d,{className:`text-destructive h-5 w-5`}),classes:`border-destructive/50`},warning:{icon:(0,L.jsx)(n,{className:`text-warning h-5 w-5`}),classes:`border-warning/50`},info:{icon:(0,L.jsx)(_,{className:`text-info h-5 w-5`}),classes:`border-info/50`},success:{icon:(0,L.jsx)(p,{className:`text-success h-5 w-5`}),classes:`border-success/50`}};function B({open:e,onOpenChange:t,onClose:n,children:r,title:a,description:s,className:c,contentClassName:u,initialFocusRef:d,closeOnEscape:f=!0,closeOnBackdropClick:p=!0,strings:m,showCancel:h=!0,showConfirm:g=!0,onCancel:_,onConfirm:v,onAsyncConfirm:y,closeOnAsyncComplete:b=!0,confirmVariant:x=`primary`,confirmStyle:S=`solid`,isLoading:C=!1,formId:T,footer:E,emphasis:D=!1,tone:O=`default`,showIcon:k=!1,alertMessage:A,size:j=`lg`,trigger:N}){let P=(0,M.useId)(),F=(0,M.useId)(),I=a?P:void 0,te=s?F:void 0,{isOpen:B,isClosing:V,openDialog:H,closeDialog:ie,dialogProps:ae,handleBackdropClick:U}=ee({open:e,onOpenChange:t,onClose:n,closeOnEscape:f,closeOnBackdropClick:p,initialFocusRef:d}),{strings:W,finalConfirmVariant:oe,confirmButtonOnClick:se,effectiveLoading:G,handleCancel:K}=ne({closeDialog:ie,onConfirm:v,onAsyncConfirm:y,closeOnAsyncComplete:b,confirmVariant:x,isLoading:C,formId:T,onCancel:_,customStrings:m,emphasis:D,tone:O}),q=z[O],J=!!(r||A),Y=h||g||E,X=N&&(0,M.isValidElement)(N)?(0,M.cloneElement)(N,{onClick:e=>{let t=N.props.onClick;t?.(e),H()}}):N?(0,L.jsx)(`span`,{role:`button`,tabIndex:0,onClick:H,onKeyDown:e=>{(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),H())},className:`cursor-pointer`,children:N}):null;return!B&&!V&&!N?null:(0,L.jsxs)(L.Fragment,{children:[X,!!(B||V)&&(0,re.createPortal)((0,L.jsxs)(`div`,{className:`fixed inset-0 z-50 flex items-center justify-center p-4`,children:[(0,L.jsx)(`div`,{className:l(`absolute inset-0 bg-foreground/50 backdrop-blur-[1px]`,`transition-opacity duration-200`,V?`opacity-0`:`animate-in fade-in-0 duration-200`),onClick:U,"aria-hidden":`true`}),(0,L.jsxs)(`dialog`,{...ae,className:l(`relative z-10 m-0 p-0`,`rounded-lg border shadow-lg`,`bg-background text-foreground`,`max-h-[90vh] w-full`,`flex flex-col`,R[j],`animate-in fade-in-0 zoom-in-95 duration-200`,`[&.closing]:animate-out [&.closing]:fade-out-0 [&.closing]:zoom-out-95 [&.closing]:duration-150`,`outline-none focus-visible:outline-none`,D&&q.classes,c),"aria-modal":`true`,role:`dialog`,"aria-labelledby":I,"aria-describedby":te,children:[(0,L.jsx)(`button`,{type:`button`,onClick:ie,className:l(`absolute right-3 top-3 z-10 inline-flex size-7 items-center justify-center rounded-md`,`text-muted-foreground transition-colors`,`hover:bg-muted hover:text-foreground`,`focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background`,`disabled:pointer-events-none`),"aria-label":W.close,children:(0,L.jsx)(w,{className:`h-4 w-4`})}),!!(a||s)&&(0,L.jsxs)(`div`,{className:l(`flex gap-3 px-6 pb-4 pt-6`,k&&`items-start`),children:[!!k&&(0,L.jsx)(`div`,{className:`shrink-0 pt-0.5`,children:q.icon}),(0,L.jsxs)(`div`,{className:`min-w-0 flex-1`,children:[!!a&&(0,L.jsx)(i,{id:P,tag:`div`,size:`lg`,weight:`semibold`,className:`pr-6`,children:a}),!!s&&(0,L.jsx)(i,{id:F,tag:`p`,type:`secondary`,className:`mt-1`,children:s})]})]}),!!J&&(0,L.jsxs)(`div`,{className:l(`flex-1 overflow-auto px-6`,a||s?`pb-6`:`py-6`,u),children:[!!A&&(0,L.jsx)(`div`,{className:l(`mb-4 rounded-md border p-3`,O===`error`&&`border-destructive/30 bg-destructive/5`,O===`warning`&&`border-warning/40 bg-warning/10`,O===`info`&&`border-info/40 bg-info/10`,O===`success`&&`border-success/40 bg-success/10`,O===`default`&&`border-border bg-muted/40`),children:(0,L.jsx)(i,{tag:`p`,children:A})}),r]}),!!Y&&(0,L.jsx)(`div`,{className:`border-t px-6 py-4`,children:E??(0,L.jsxs)(`div`,{className:`flex flex-col-reverse gap-3 sm:flex-row sm:justify-end`,children:[!!h&&(0,L.jsx)(o,{type:`button`,variant:`secondary`,buttonStyle:`outline`,onClick:K,children:W.cancel}),!!g&&(0,L.jsx)(o,{type:`button`,variant:oe,buttonStyle:S,onClick:se,loading:G,loadingLabels:{loading:W.loading},children:W.confirm})]})})]})]}),document.body)]})}var V=(0,M.memo)(B);V.displayName=`Dialog`;var H={xs:`max-w-xs`,sm:`max-w-sm`,md:`max-w-md`,lg:`max-w-lg`,xl:`max-w-xl`,"2xl":`max-w-2xl`,"3xl":`max-w-3xl`,"4xl":`max-w-4xl`,"5xl":`max-w-5xl`,full:`max-w-[calc(100vw-2rem)]`},ie={right:{position:`fixed top-0 right-0 bottom-0`,size:`h-full`,animation:`animate-in slide-in-from-right duration-300 [&.closing]:animate-out [&.closing]:slide-out-to-right [&.closing]:duration-200`,rounded:`rounded-l-xl`},left:{position:`fixed top-0 left-0 bottom-0`,size:`h-full`,animation:`animate-in slide-in-from-left duration-300 [&.closing]:animate-out [&.closing]:slide-out-to-left [&.closing]:duration-200`,rounded:`rounded-r-xl`},top:{position:`fixed top-0 left-0 right-0`,size:`w-full`,animation:`animate-in slide-in-from-top duration-300 [&.closing]:animate-out [&.closing]:slide-out-to-top [&.closing]:duration-200`,rounded:`rounded-b-xl`},bottom:{position:`fixed bottom-0 left-0 right-0`,size:`w-full`,animation:`animate-in slide-in-from-bottom duration-300 [&.closing]:animate-out [&.closing]:slide-out-to-bottom [&.closing]:duration-200`,rounded:`rounded-t-xl`}},ae={default:(0,L.jsx)(m,{className:`text-muted-foreground h-5 w-5`}),error:(0,L.jsx)(d,{className:`text-destructive h-5 w-5`}),warning:(0,L.jsx)(n,{className:`text-warning h-5 w-5`}),info:(0,L.jsx)(_,{className:`text-info h-5 w-5`}),success:(0,L.jsx)(p,{className:`text-success h-5 w-5`})};function U({open:e,onOpenChange:t,onClose:n,children:r,title:a,description:s,className:c,contentClassName:u,initialFocusRef:d,closeOnEscape:f=!0,closeOnBackdropClick:p=!0,strings:m,showCancel:h=!0,showConfirm:g=!0,onCancel:_,onConfirm:v,onAsyncConfirm:y,closeOnAsyncComplete:b=!0,confirmVariant:x=`primary`,confirmStyle:S=`solid`,isLoading:C=!1,formId:T,footer:E,emphasis:D=!1,tone:O=`default`,showIcon:k=!1,alertMessage:A,direction:j=`right`,width:N=`lg`,showFooter:P=!0,trigger:F}){let I=(0,M.useId)(),te=(0,M.useId)(),R=a?I:void 0,z=s?te:void 0,{isOpen:B,isClosing:V,openDialog:U,closeDialog:W,dialogProps:oe,handleBackdropClick:se}=ee({open:e,onOpenChange:t,onClose:n,closeOnEscape:f,closeOnBackdropClick:p,initialFocusRef:d}),{strings:G,finalConfirmVariant:K,confirmButtonOnClick:q,effectiveLoading:J,handleCancel:Y}=ne({closeDialog:W,onConfirm:v,onAsyncConfirm:y,closeOnAsyncComplete:b,confirmVariant:x,isLoading:C,formId:T,onCancel:_,customStrings:m,emphasis:D,tone:O}),X=ie[j],Z=j===`left`||j===`right`,ce=!!(r||A),le=P&&(h||g||E),ue=F&&(0,M.isValidElement)(F)?(0,M.cloneElement)(F,{onClick:e=>{let t=F.props.onClick;t?.(e),U()}}):F?(0,L.jsx)(`span`,{role:`button`,tabIndex:0,onClick:U,onKeyDown:e=>{(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),U())},className:`cursor-pointer`,children:F}):null;return!B&&!V&&!F?null:(0,L.jsxs)(L.Fragment,{children:[ue,!!(B||V)&&(0,re.createPortal)((0,L.jsxs)(`div`,{className:`fixed inset-0 z-50`,children:[(0,L.jsx)(`div`,{className:l(`absolute inset-0 bg-foreground/50 backdrop-blur-[1px]`,`transition-opacity duration-300`,V?`opacity-0`:`animate-in fade-in-0 duration-300`),onClick:se,"aria-hidden":`true`}),(0,L.jsxs)(`dialog`,{...oe,className:l(`inset-auto m-0 p-0`,X.position,X.size,`border shadow-xl`,`bg-background text-foreground`,X.rounded,Z&&`w-full`,Z&&H[N],!Z&&`max-h-[85vh]`,X.animation,`outline-none focus-visible:outline-none`,`flex flex-col`,c),"aria-modal":`true`,role:`dialog`,"aria-labelledby":R,"aria-describedby":z,children:[(0,L.jsx)(`button`,{type:`button`,onClick:W,className:l(`absolute right-4 top-4 z-10 inline-flex size-7 items-center justify-center rounded-md`,`text-muted-foreground transition-colors`,`hover:bg-muted hover:text-foreground`,`focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background`,`disabled:pointer-events-none`),"aria-label":G.close,children:(0,L.jsx)(w,{className:`h-4 w-4`})}),!!(a||s)&&(0,L.jsxs)(`div`,{className:`flex items-start gap-3 px-6 pb-4 pt-6`,children:[!!k&&(0,L.jsx)(`div`,{className:`shrink-0 pt-0.5`,children:ae[O]}),(0,L.jsxs)(`div`,{className:`min-w-0 flex-1 pr-6`,children:[!!a&&(0,L.jsx)(i,{id:I,tag:`div`,size:`lg`,weight:`semibold`,children:a}),!!s&&(0,L.jsx)(i,{id:te,tag:`p`,type:`secondary`,className:`mt-1`,children:s})]})]}),!!ce&&(0,L.jsxs)(`div`,{className:l(`flex-1 overflow-auto px-6`,a||s?`pb-6`:`py-6`,u),children:[!!A&&(0,L.jsx)(`div`,{className:l(`mb-4 rounded-md border p-3`,O===`error`&&`border-destructive/30 bg-destructive/5`,O===`warning`&&`border-warning/40 bg-warning/10`,O===`info`&&`border-info/40 bg-info/10`,O===`success`&&`border-success/40 bg-success/10`,O===`default`&&`border-border bg-muted/40`),children:(0,L.jsx)(i,{tag:`p`,children:A})}),r]}),!!le&&(0,L.jsx)(`div`,{className:`border-t px-6 py-4`,children:E??(0,L.jsxs)(`div`,{className:`flex flex-col-reverse gap-3 sm:flex-row sm:justify-end`,children:[!!h&&(0,L.jsx)(o,{type:`button`,variant:`secondary`,buttonStyle:`outline`,onClick:Y,children:G.cancel}),!!g&&(0,L.jsx)(o,{type:`button`,variant:K,buttonStyle:S,onClick:q,loading:J,loadingLabels:{loading:G.loading},children:G.confirm})]})})]})]}),document.body)]})}var W=(0,M.memo)(U);W.displayName=`Drawer`;var oe={default:{icon:(0,L.jsx)(m,{className:`h-6 w-6`}),iconColor:`text-muted-foreground`},error:{icon:(0,L.jsx)(d,{className:`h-6 w-6`}),iconColor:`text-destructive`},warning:{icon:(0,L.jsx)(n,{className:`h-6 w-6`}),iconColor:`text-warning`},info:{icon:(0,L.jsx)(_,{className:`h-6 w-6`}),iconColor:`text-info`},success:{icon:(0,L.jsx)(p,{className:`h-6 w-6`}),iconColor:`text-success`}};function se({open:e,onOpenChange:t,onClose:n,children:r,title:a,description:s,className:c,contentClassName:u,initialFocusRef:d,closeOnEscape:f=!0,closeOnBackdropClick:p=!1,strings:m,showCancel:h=!0,showConfirm:g=!0,onCancel:_,onConfirm:v,onAsyncConfirm:y,closeOnAsyncComplete:b=!0,confirmVariant:x,confirmStyle:S=`solid`,isLoading:C=!1,formId:w,footer:E,tone:D=`default`,showIcon:O=!0,trigger:k,destructive:A=!1}){let j=(0,M.useId)(),N=(0,M.useId)(),P=a?j:void 0,F=s?N:void 0,{isOpen:I,isClosing:R,openDialog:z,closeDialog:B,dialogProps:V,handleBackdropClick:H}=ee({open:e,onOpenChange:t,onClose:n,closeOnEscape:f,closeOnBackdropClick:p,initialFocusRef:d}),ie=T(te,m),ae=(0,M.useMemo)(()=>A?`error`:x||{default:`primary`,error:`error`,warning:`warning`,info:`primary`,success:`success`}[D],[A,x,D]),{strings:U,confirmButtonOnClick:W,effectiveLoading:se,handleCancel:G}=ne({closeDialog:B,onConfirm:v,onAsyncConfirm:y,closeOnAsyncComplete:b,confirmVariant:ae,isLoading:C,formId:w,onCancel:_,customStrings:ie}),K=oe[D],q=k&&(0,M.isValidElement)(k)?(0,M.cloneElement)(k,{onClick:e=>{let t=k.props.onClick;t?.(e),z()}}):k?(0,L.jsx)(`span`,{role:`button`,tabIndex:0,onClick:z,onKeyDown:e=>{(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),z())},className:`cursor-pointer`,children:k}):null;return!I&&!R&&!k?null:(0,L.jsxs)(L.Fragment,{children:[q,!!(I||R)&&(0,re.createPortal)((0,L.jsxs)(`div`,{className:`fixed inset-0 z-50 flex items-center justify-center p-4`,children:[(0,L.jsx)(`div`,{className:l(`absolute inset-0 bg-foreground/50 backdrop-blur-[1px]`,`transition-opacity duration-200`,R?`opacity-0`:`animate-in fade-in-0 duration-200`),onClick:H,"aria-hidden":`true`}),(0,L.jsxs)(`dialog`,{...V,className:l(`relative z-10 m-0 w-full max-w-md p-0`,`max-h-[90vh] flex flex-col`,`rounded-lg border shadow-lg`,`bg-background text-foreground`,`animate-in fade-in-0 zoom-in-95 duration-200`,`[&.closing]:animate-out [&.closing]:fade-out-0 [&.closing]:zoom-out-95 [&.closing]:duration-150`,`outline-none focus-visible:outline-none`,c),role:`alertdialog`,"aria-modal":`true`,"aria-labelledby":P,"aria-describedby":F,children:[(0,L.jsxs)(`div`,{className:`flex-1 overflow-auto p-6`,children:[!!O&&(0,L.jsx)(`div`,{className:l(`mx-auto mb-4 flex h-12 w-12 items-center justify-center rounded-full`,D===`error`&&`bg-destructive/10`,D===`warning`&&`bg-warning/15`,D===`info`&&`bg-info/15`,D===`success`&&`bg-success/15`,D===`default`&&`bg-muted`),children:(0,L.jsx)(`span`,{className:K.iconColor,children:K.icon})}),!!a&&(0,L.jsx)(i,{id:j,tag:`div`,size:`lg`,weight:`semibold`,align:`center`,children:a}),!!s&&(0,L.jsx)(i,{id:N,tag:`p`,type:`secondary`,align:`center`,className:`mt-2`,children:s}),!!r&&(0,L.jsx)(`div`,{className:l(`mt-4`,u),children:r})]}),!!(h||g||E)&&(0,L.jsx)(`div`,{className:`border-t px-6 py-4`,children:E??(0,L.jsxs)(`div`,{className:`flex flex-col-reverse gap-3 sm:flex-row sm:justify-end`,children:[!!h&&(0,L.jsx)(o,{type:`button`,variant:`secondary`,buttonStyle:`outline`,onClick:G,className:`w-full sm:w-auto`,children:U.cancel}),!!g&&(0,L.jsx)(o,{type:`button`,variant:ae,buttonStyle:S,onClick:W,loading:se,loadingLabels:{loading:U.loading},className:`w-full sm:w-auto`,children:U.confirm})]})})]})]}),document.body)]})}var G=(0,M.memo)(se);G.displayName=`AlertDialog`;var K=e({APISurface:()=>q,AlertDialogConfirmationPatterns:()=>le,BestPractices:()=>ue,DialogDefault:()=>J,DialogEmphasisTones:()=>Y,DialogFormPattern:()=>Z,DialogRichContent:()=>X,Drawer4Directions:()=>ce});function q(){return(0,L.jsx)(L.Fragment,{children:(0,L.jsxs)(i,{type:`secondary`,children:[`All overlays accept the same core props: `,(0,L.jsx)(`code`,{className:`rounded bg-muted px-1 py-0.5 text-xs`,children:`{ open, onOpenChange, onClose, title, description, onConfirm, onCancel, onAsyncConfirm, tone, emphasis, alertMessage, footer, isLoading }`}),`. Backed by the native `,(0,L.jsx)(`code`,{className:`rounded bg-muted px-1 py-0.5 text-xs`,children:`<dialog>`}),` element for proper focus trapping, ESC handling, and accessibility — no extra portal libraries.`]})})}function J(){let[e,t]=(0,M.useState)(!1);return(0,L.jsxs)(L.Fragment,{children:[(0,L.jsx)(`div`,{className:`flex flex-wrap gap-3`,children:(0,L.jsx)(o,{variant:`primary`,icon:y,onClick:()=>t(!0),children:`Open dialog`})}),(0,L.jsx)(V,{open:e,onOpenChange:t,title:`Save workspace settings?`,description:`Changes will apply immediately for everyone on the team. You can edit them again later from Settings → Workspace.`,onConfirm:()=>t(!1)})]})}function Y(){let[e,t]=(0,M.useState)(!1),[n,r]=(0,M.useState)(!1),[i,a]=(0,M.useState)(!1);return(0,L.jsxs)(L.Fragment,{children:[(0,L.jsxs)(`div`,{className:`flex flex-wrap gap-3`,children:[(0,L.jsx)(o,{variant:`primary`,icon:_,onClick:()=>t(!0),children:`Info`}),(0,L.jsx)(o,{variant:`warning`,icon:d,onClick:()=>r(!0),children:`Warning`}),(0,L.jsx)(o,{variant:`success`,icon:f,onClick:()=>a(!0),children:`Success`})]}),(0,L.jsx)(V,{open:e,onOpenChange:t,title:`New beta feature available`,description:`The redesigned analytics dashboard is live for early-access workspaces. Try it out and let us know what works.`,tone:`info`,emphasis:!0,confirmVariant:`primary`,onConfirm:()=>t(!1)}),(0,L.jsx)(V,{open:n,onOpenChange:r,title:`Reset workspace?`,description:`This resets all custom views and starred items for your team. Members will see the default layout next sign-in.`,tone:`warning`,emphasis:!0,confirmVariant:`warning`,alertMessage:`Reset is irreversible — exports of custom views are not generated automatically.`,onConfirm:()=>r(!1)}),(0,L.jsx)(V,{open:i,onOpenChange:a,title:`Subscription activated`,description:`Your team is on the Pro Annual plan until May 12, 2027. The first invoice has been emailed to your billing contact.`,tone:`success`,emphasis:!0,confirmVariant:`success`,onConfirm:()=>a(!1)})]})}function X(){let[e,t]=(0,M.useState)(!1);return(0,L.jsxs)(L.Fragment,{children:[(0,L.jsx)(`div`,{className:`flex flex-wrap gap-3`,children:(0,L.jsx)(o,{variant:`primary`,icon:C,onClick:()=>t(!0),children:`Invite teammate`})}),(0,L.jsx)(V,{open:e,onOpenChange:t,title:`Invite to workspace`,description:`They'll get an email with a link to join your workspace as an Editor.`,size:`md`,onConfirm:()=>t(!1),children:(0,L.jsxs)(`div`,{className:`space-y-3`,children:[(0,L.jsxs)(`div`,{className:`rounded-lg border border-border bg-muted/30 p-3`,children:[(0,L.jsx)(i,{size:`xxs`,type:`secondary`,weight:`medium`,className:`uppercase tracking-wider`,children:`Invitation preview`}),(0,L.jsxs)(`div`,{className:`mt-2 flex items-center gap-3`,children:[(0,L.jsx)(j,{className:`size-9`,children:(0,L.jsx)(A,{className:`bg-primary/10 text-primary text-xs font-semibold`,children:`YO`})}),(0,L.jsxs)(`div`,{className:`flex-1 min-w-0`,children:[(0,L.jsx)(i,{weight:`semibold`,children:`You invited stefan@example.com`}),(0,L.jsx)(i,{size:`xs`,type:`secondary`,children:`Editor · Read & write access`})]})]})]}),(0,L.jsx)(`div`,{className:`space-y-2`,children:[{icon:u,label:`Can edit pages and components`},{icon:u,label:`Can manage their own API keys`},{icon:u,label:`Cannot manage billing or members`}].map(e=>(0,L.jsxs)(`div`,{className:`flex items-center gap-2`,children:[(0,L.jsx)(e.icon,{className:`size-3.5 shrink-0 text-success`,"aria-hidden":`true`}),(0,L.jsx)(i,{size:`xs`,type:`secondary`,children:e.label})]},e.label))})]})})]})}function Z(){let[e,t]=(0,M.useState)(!1);return(0,L.jsxs)(L.Fragment,{children:[(0,L.jsx)(`div`,{className:`flex flex-wrap gap-3`,children:(0,L.jsx)(o,{variant:`primary`,icon:h,onClick:()=>t(!0),children:`Add payment method`})}),(0,L.jsx)(V,{open:e,onOpenChange:t,title:`Add a payment method`,description:`We'll authorize a 0.00 USD transaction to verify the card.`,formId:`payment-form`,size:`md`,children:(0,L.jsxs)(`form`,{id:`payment-form`,onSubmit:e=>{e.preventDefault(),t(!1)},className:`space-y-3`,children:[(0,L.jsxs)(`label`,{className:`block`,children:[(0,L.jsx)(i,{tag:`span`,size:`xs`,weight:`medium`,className:`block mb-1`,children:`Card number`}),(0,L.jsx)(`input`,{type:`text`,placeholder:`4242 4242 4242 4242`,className:`w-full rounded-md border border-border bg-background px-3 py-2 font-mono text-sm tabular-nums outline-none focus:border-ring focus:ring-2 focus:ring-ring/30`})]}),(0,L.jsxs)(`div`,{className:`grid grid-cols-2 gap-3`,children:[(0,L.jsxs)(`label`,{className:`block`,children:[(0,L.jsx)(i,{tag:`span`,size:`xs`,weight:`medium`,className:`block mb-1`,children:`Expiry`}),(0,L.jsx)(`input`,{type:`text`,placeholder:`MM / YY`,className:`w-full rounded-md border border-border bg-background px-3 py-2 font-mono text-sm tabular-nums outline-none focus:border-ring focus:ring-2 focus:ring-ring/30`})]}),(0,L.jsxs)(`label`,{className:`block`,children:[(0,L.jsx)(i,{tag:`span`,size:`xs`,weight:`medium`,className:`block mb-1`,children:`CVC`}),(0,L.jsx)(`input`,{type:`text`,placeholder:`123`,className:`w-full rounded-md border border-border bg-background px-3 py-2 font-mono text-sm tabular-nums outline-none focus:border-ring focus:ring-2 focus:ring-ring/30`})]})]})]})})]})}function ce(){let[e,t]=(0,M.useState)(!1),[n,r]=(0,M.useState)(!1),[s,c]=(0,M.useState)(!1),[l,u]=(0,M.useState)(!1);return(0,L.jsxs)(L.Fragment,{children:[(0,L.jsxs)(`div`,{className:`flex flex-wrap gap-3`,children:[(0,L.jsx)(o,{variant:`secondary`,buttonStyle:`outline`,onClick:()=>t(!0),children:`Right · booking detail`}),(0,L.jsx)(o,{variant:`secondary`,buttonStyle:`outline`,onClick:()=>r(!0),children:`Left · navigation`}),(0,L.jsx)(o,{variant:`secondary`,buttonStyle:`outline`,onClick:()=>c(!0),children:`Bottom · sheet`}),(0,L.jsx)(o,{variant:`secondary`,buttonStyle:`outline`,onClick:()=>u(!0),children:`Right · no footer`})]}),(0,L.jsx)(W,{open:e,onOpenChange:t,direction:`right`,title:`Booking #BKG-2026-0412`,description:`Inspect, edit, or cancel a booking from the side drawer — keeps the table visible behind.`,onConfirm:()=>t(!1),children:(0,L.jsxs)(`div`,{className:`space-y-4`,children:[(0,L.jsxs)(`div`,{className:`rounded-lg border border-border bg-muted/30 p-3`,children:[(0,L.jsxs)(`div`,{className:`flex items-center justify-between`,children:[(0,L.jsx)(i,{size:`xxs`,type:`secondary`,weight:`medium`,className:`uppercase tracking-wider`,children:`Status`}),(0,L.jsx)(a,{variant:`success`,children:`Paid`})]}),(0,L.jsx)(i,{tag:`div`,size:`lg`,weight:`bold`,className:`mt-1 tabular-nums`,children:`180.00 USD`})]}),(0,L.jsx)(`div`,{className:`space-y-2`,children:[[`Customer`,`Sarah Smitha`],[`Experience`,`Spa Day Voucher`],[`Date`,`Apr 18, 2026 · 14:00`],[`Guests`,`2`]].map(([e,t])=>(0,L.jsxs)(`div`,{className:`flex items-center justify-between border-b border-border/50 py-1.5 last:border-0`,children:[(0,L.jsx)(i,{size:`xs`,type:`secondary`,children:e}),(0,L.jsx)(i,{weight:`medium`,children:t})]},e))})]})}),(0,L.jsx)(W,{open:n,onOpenChange:r,direction:`left`,title:`Workspace`,description:`Quick-jump to common pages.`,showCancel:!1,showConfirm:!1,children:(0,L.jsx)(`nav`,{className:`space-y-1`,children:[{icon:g,label:`Bookings`},{icon:C,label:`Customers`},{icon:h,label:`Invoices`},{icon:y,label:`Settings`}].map(e=>(0,L.jsxs)(`button`,{className:`flex w-full items-center gap-3 rounded-md px-3 py-2 text-left transition-colors hover:bg-muted/50`,children:[(0,L.jsx)(e.icon,{className:`size-4 text-muted-foreground`}),(0,L.jsx)(i,{children:e.label})]},e.label))})}),(0,L.jsx)(W,{open:s,onOpenChange:c,direction:`bottom`,title:`Quick actions`,onConfirm:()=>c(!1),children:(0,L.jsx)(`div`,{className:`grid grid-cols-2 gap-2 sm:grid-cols-4`,children:[{icon:v,label:`Send invoice`},{icon:C,label:`Add customer`},{icon:h,label:`Record payment`},{icon:g,label:`New booking`}].map(e=>(0,L.jsxs)(`button`,{className:`flex flex-col items-center gap-2 rounded-lg border border-border bg-card px-3 py-4 transition-colors hover:bg-muted/40`,children:[(0,L.jsx)(`span`,{className:`inline-flex size-9 items-center justify-center rounded-lg bg-primary/10 text-primary`,children:(0,L.jsx)(e.icon,{className:`size-4`})}),(0,L.jsx)(i,{size:`xs`,weight:`medium`,align:`center`,children:e.label})]},e.label))})}),(0,L.jsx)(W,{open:l,onOpenChange:u,direction:`right`,title:`Help & shortcuts`,description:`No footer — useful for read-only side panels.`,showCancel:!1,showConfirm:!1,children:(0,L.jsxs)(i,{type:`secondary`,children:[`Hide the footer entirely with `,(0,L.jsx)(`code`,{className:`rounded bg-muted px-1 py-0.5 text-xs`,children:`showCancel={false}`}),` + `,(0,L.jsx)(`code`,{className:`rounded bg-muted px-1 py-0.5 text-xs`,children:`showConfirm={false}`}),` for read-only side panels (help, settings, audit logs).`]})})]})}function le(){let[e,t]=(0,M.useState)(!1),[n,r]=(0,M.useState)(!1),[i,a]=(0,M.useState)(!1),[s,c]=(0,M.useState)(!1);return(0,L.jsxs)(L.Fragment,{children:[(0,L.jsxs)(`div`,{className:`flex flex-wrap gap-3`,children:[(0,L.jsx)(o,{variant:`primary`,icon:v,onClick:()=>t(!0),children:`Send invoice`}),(0,L.jsx)(o,{variant:`error`,icon:S,onClick:()=>r(!0),children:`Delete`}),(0,L.jsx)(o,{variant:`warning`,buttonStyle:`outline`,icon:d,onClick:()=>a(!0),children:`Discard unsaved`}),(0,L.jsx)(o,{variant:`secondary`,buttonStyle:`outline`,icon:b,onClick:()=>c(!0),children:`Sign out`})]}),(0,L.jsx)(G,{open:e,onOpenChange:t,title:`Send invoice now?`,description:`The customer will be emailed the PDF and a Stripe payment link. You can cancel any time before they pay.`,tone:`info`,onConfirm:()=>t(!1)}),(0,L.jsx)(G,{open:n,onOpenChange:r,title:`Delete this booking?`,description:`The booking, its payment, and all associated notes will be removed. This cannot be undone.`,destructive:!0,onConfirm:()=>r(!1)}),(0,L.jsx)(G,{open:i,onOpenChange:a,title:`Discard unsaved changes?`,description:`You have edits that haven't been saved yet. Leave the page and lose them?`,tone:`warning`,onConfirm:()=>a(!1)}),(0,L.jsx)(G,{open:s,onOpenChange:c,title:`Sign out of this device?`,description:`You'll need to sign in again next time you visit.`,onConfirm:()=>c(!1)})]})}function ue(){return(0,L.jsx)(L.Fragment,{children:(0,L.jsxs)(`div`,{className:`space-y-2 text-sm text-muted-foreground`,children:[(0,L.jsxs)(`div`,{className:`flex items-start gap-2`,children:[(0,L.jsx)(m,{className:`size-4 shrink-0 mt-0.5 text-info`,"aria-hidden":`true`}),(0,L.jsxs)(i,{children:[(0,L.jsx)(`strong`,{className:`text-foreground font-semibold`,children:`Dialog`}),` for changes that affect content — settings, confirmations, edit forms.`]})]}),(0,L.jsxs)(`div`,{className:`flex items-start gap-2`,children:[(0,L.jsx)(m,{className:`size-4 shrink-0 mt-0.5 text-info`,"aria-hidden":`true`}),(0,L.jsxs)(i,{children:[(0,L.jsx)(`strong`,{className:`text-foreground font-semibold`,children:`Drawer`}),` for content that lives next to the current view — record details, filters, navigation.`]})]}),(0,L.jsxs)(`div`,{className:`flex items-start gap-2`,children:[(0,L.jsx)(m,{className:`size-4 shrink-0 mt-0.5 text-info`,"aria-hidden":`true`}),(0,L.jsxs)(i,{children:[(0,L.jsx)(`strong`,{className:`text-foreground font-semibold`,children:`AlertDialog`}),` for binary decisions that block other actions until resolved — destructive ops, sign-out, unsaved changes.`]})]}),(0,L.jsxs)(`div`,{className:`flex items-start gap-2`,children:[(0,L.jsx)(x,{className:`size-4 shrink-0 mt-0.5 text-primary`,"aria-hidden":`true`}),(0,L.jsxs)(i,{children:[(0,L.jsx)(`strong`,{className:`text-foreground font-semibold`,children:`Async confirms`}),` — pass `,(0,L.jsx)(`code`,{className:`rounded bg-muted px-1 py-0.5 text-xs`,children:`onAsyncConfirm`}),` instead of `,(0,L.jsx)(`code`,{className:`rounded bg-muted px-1 py-0.5 text-xs`,children:`onConfirm`}),` to show a loading state while the action runs and auto-close on success.`]})]})]})})}var Q=`import { useState } from 'react';
+import {
+	AlertCircle,
+	BadgeCheck,
+	CheckCircle2,
+	CreditCard,
+	FileText,
+	HelpCircle,
+	Info,
+	Send,
+	Settings,
+	ShieldAlert,
+	Sparkles,
+	Trash2,
+	UserPlus,
+} from 'lucide-react';
+import { Avatar, AvatarFallback } from '@/components/base/display/avatar';
+import { Badge } from '@/components/base/badge';
+import { Button } from '@/components/base/buttons';
+import { Text } from '@/components/typography';
+import { AlertDialog, Dialog, Drawer } from '@/components/features/overlays';
+
+export function APISurface() {
+	return (
+		<>
+			<Text type="secondary">
+								All overlays accept the same core props: <code className="rounded bg-muted px-1 py-0.5 text-xs">{'{ open, onOpenChange, onClose, title, description, onConfirm, onCancel, onAsyncConfirm, tone, emphasis, alertMessage, footer, isLoading }'}</code>. Backed by the native <code className="rounded bg-muted px-1 py-0.5 text-xs">{'<dialog>'}</code> element for proper focus trapping, ESC handling, and accessibility — no extra portal libraries.
+							</Text>
+		</>
+	);
+}
+
+export function DialogDefault() {
+	// Dialog state
+		const [defaultOpen, setDefaultOpen] = useState(false);
+	return (
+		<>
+			<div className="flex flex-wrap gap-3">
+								<Button variant="primary" icon={Settings} onClick={() => setDefaultOpen(true)}>Open dialog</Button>
+							</div>
+							<Dialog
+								open={defaultOpen}
+								onOpenChange={setDefaultOpen}
+								title="Save workspace settings?"
+								description="Changes will apply immediately for everyone on the team. You can edit them again later from Settings → Workspace."
+								onConfirm={() => setDefaultOpen(false)}
+							/>
+		</>
+	);
+}
+
+export function DialogEmphasisTones() {
+	const [emphasisInfoOpen, setEmphasisInfoOpen] = useState(false);
+	const [emphasisWarningOpen, setEmphasisWarningOpen] = useState(false);
+	const [emphasisSuccessOpen, setEmphasisSuccessOpen] = useState(false);
+	return (
+		<>
+			<div className="flex flex-wrap gap-3">
+								<Button variant="primary" icon={Info} onClick={() => setEmphasisInfoOpen(true)}>Info</Button>
+								<Button variant="warning" icon={AlertCircle} onClick={() => setEmphasisWarningOpen(true)}>Warning</Button>
+								<Button variant="success" icon={CheckCircle2} onClick={() => setEmphasisSuccessOpen(true)}>Success</Button>
+							</div>
+							<Dialog
+								open={emphasisInfoOpen}
+								onOpenChange={setEmphasisInfoOpen}
+								title="New beta feature available"
+								description="The redesigned analytics dashboard is live for early-access workspaces. Try it out and let us know what works."
+								tone="info"
+								emphasis
+								confirmVariant="primary"
+								onConfirm={() => setEmphasisInfoOpen(false)}
+							/>
+							<Dialog
+								open={emphasisWarningOpen}
+								onOpenChange={setEmphasisWarningOpen}
+								title="Reset workspace?"
+								description="This resets all custom views and starred items for your team. Members will see the default layout next sign-in."
+								tone="warning"
+								emphasis
+								confirmVariant="warning"
+								alertMessage="Reset is irreversible — exports of custom views are not generated automatically."
+								onConfirm={() => setEmphasisWarningOpen(false)}
+							/>
+							<Dialog
+								open={emphasisSuccessOpen}
+								onOpenChange={setEmphasisSuccessOpen}
+								title="Subscription activated"
+								description="Your team is on the Pro Annual plan until May 12, 2027. The first invoice has been emailed to your billing contact."
+								tone="success"
+								emphasis
+								confirmVariant="success"
+								onConfirm={() => setEmphasisSuccessOpen(false)}
+							/>
+		</>
+	);
+}
+
+export function DialogRichContent() {
+	const [richContentOpen, setRichContentOpen] = useState(false);
+	return (
+		<>
+			<div className="flex flex-wrap gap-3">
+								<Button variant="primary" icon={UserPlus} onClick={() => setRichContentOpen(true)}>Invite teammate</Button>
+							</div>
+							<Dialog
+								open={richContentOpen}
+								onOpenChange={setRichContentOpen}
+								title="Invite to workspace"
+								description="They'll get an email with a link to join your workspace as an Editor."
+								size="md"
+								onConfirm={() => setRichContentOpen(false)}
+							>
+								<div className="space-y-3">
+									<div className="rounded-lg border border-border bg-muted/30 p-3">
+										<Text size="xxs" type="secondary" weight="medium" className="uppercase tracking-wider">Invitation preview</Text>
+										<div className="mt-2 flex items-center gap-3">
+											<Avatar className="size-9">
+												<AvatarFallback className="bg-primary/10 text-primary text-xs font-semibold">YO</AvatarFallback>
+											</Avatar>
+											<div className="flex-1 min-w-0">
+												<Text weight="semibold">You invited stefan@example.com</Text>
+												<Text size="xs" type="secondary">Editor · Read & write access</Text>
+											</div>
+										</div>
+									</div>
+									<div className="space-y-2">
+										{[
+											{ icon: BadgeCheck, label: 'Can edit pages and components' },
+											{ icon: BadgeCheck, label: 'Can manage their own API keys' },
+											{ icon: BadgeCheck, label: 'Cannot manage billing or members' },
+										].map((row) => (
+											<div key={row.label} className="flex items-center gap-2">
+												<row.icon className="size-3.5 shrink-0 text-success" aria-hidden="true" />
+												<Text size="xs" type="secondary">{row.label}</Text>
+											</div>
+										))}
+									</div>
+								</div>
+							</Dialog>
+		</>
+	);
+}
+
+export function DialogFormPattern() {
+	const [formOpen, setFormOpen] = useState(false);
+	return (
+		<>
+			<div className="flex flex-wrap gap-3">
+								<Button variant="primary" icon={CreditCard} onClick={() => setFormOpen(true)}>Add payment method</Button>
+							</div>
+							<Dialog
+								open={formOpen}
+								onOpenChange={setFormOpen}
+								title="Add a payment method"
+								description="We'll authorize a 0.00 USD transaction to verify the card."
+								formId="payment-form"
+								size="md"
+							>
+								<form
+									id="payment-form"
+									onSubmit={(e) => {
+										e.preventDefault();
+										setFormOpen(false);
+									}}
+									className="space-y-3"
+								>
+									<label className="block">
+										<Text tag="span" size="xs" weight="medium" className="block mb-1">Card number</Text>
+										<input
+											type="text"
+											placeholder="4242 4242 4242 4242"
+											className="w-full rounded-md border border-border bg-background px-3 py-2 font-mono text-sm tabular-nums outline-none focus:border-ring focus:ring-2 focus:ring-ring/30"
+										/>
+									</label>
+									<div className="grid grid-cols-2 gap-3">
+										<label className="block">
+											<Text tag="span" size="xs" weight="medium" className="block mb-1">Expiry</Text>
+											<input
+												type="text"
+												placeholder="MM / YY"
+												className="w-full rounded-md border border-border bg-background px-3 py-2 font-mono text-sm tabular-nums outline-none focus:border-ring focus:ring-2 focus:ring-ring/30"
+											/>
+										</label>
+										<label className="block">
+											<Text tag="span" size="xs" weight="medium" className="block mb-1">CVC</Text>
+											<input
+												type="text"
+												placeholder="123"
+												className="w-full rounded-md border border-border bg-background px-3 py-2 font-mono text-sm tabular-nums outline-none focus:border-ring focus:ring-2 focus:ring-ring/30"
+											/>
+										</label>
+									</div>
+								</form>
+							</Dialog>
+		</>
+	);
+}
+
+export function Drawer4Directions() {
+	// Drawer state
+		const [drawerRightOpen, setDrawerRightOpen] = useState(false);
+	const [drawerLeftOpen, setDrawerLeftOpen] = useState(false);
+	const [drawerBottomOpen, setDrawerBottomOpen] = useState(false);
+	const [drawerCustomOpen, setDrawerCustomOpen] = useState(false);
+	return (
+		<>
+			<div className="flex flex-wrap gap-3">
+								<Button variant="secondary" buttonStyle="outline" onClick={() => setDrawerRightOpen(true)}>Right · booking detail</Button>
+								<Button variant="secondary" buttonStyle="outline" onClick={() => setDrawerLeftOpen(true)}>Left · navigation</Button>
+								<Button variant="secondary" buttonStyle="outline" onClick={() => setDrawerBottomOpen(true)}>Bottom · sheet</Button>
+								<Button variant="secondary" buttonStyle="outline" onClick={() => setDrawerCustomOpen(true)}>Right · no footer</Button>
+							</div>
+
+							<Drawer
+								open={drawerRightOpen}
+								onOpenChange={setDrawerRightOpen}
+								direction="right"
+								title="Booking #BKG-2026-0412"
+								description="Inspect, edit, or cancel a booking from the side drawer — keeps the table visible behind."
+								onConfirm={() => setDrawerRightOpen(false)}
+							>
+								<div className="space-y-4">
+									<div className="rounded-lg border border-border bg-muted/30 p-3">
+										<div className="flex items-center justify-between">
+											<Text size="xxs" type="secondary" weight="medium" className="uppercase tracking-wider">Status</Text>
+											<Badge variant="success">Paid</Badge>
+										</div>
+										<Text tag="div" size="lg" weight="bold" className="mt-1 tabular-nums">180.00 USD</Text>
+									</div>
+									<div className="space-y-2">
+										{[
+											['Customer', 'Sarah Smitha'],
+											['Experience', 'Spa Day Voucher'],
+											['Date', 'Apr 18, 2026 · 14:00'],
+											['Guests', '2'],
+										].map(([k, v]) => (
+											<div key={k} className="flex items-center justify-between border-b border-border/50 py-1.5 last:border-0">
+												<Text size="xs" type="secondary">{k}</Text>
+												<Text weight="medium">{v}</Text>
+											</div>
+										))}
+									</div>
+								</div>
+							</Drawer>
+
+							<Drawer
+								open={drawerLeftOpen}
+								onOpenChange={setDrawerLeftOpen}
+								direction="left"
+								title="Workspace"
+								description="Quick-jump to common pages."
+								showCancel={false}
+								showConfirm={false}
+							>
+								<nav className="space-y-1">
+									{[
+										{ icon: FileText, label: 'Bookings' },
+										{ icon: UserPlus, label: 'Customers' },
+										{ icon: CreditCard, label: 'Invoices' },
+										{ icon: Settings, label: 'Settings' },
+									].map((item) => (
+										<button key={item.label} className="flex w-full items-center gap-3 rounded-md px-3 py-2 text-left transition-colors hover:bg-muted/50">
+											<item.icon className="size-4 text-muted-foreground" />
+											<Text>{item.label}</Text>
+										</button>
+									))}
+								</nav>
+							</Drawer>
+
+							<Drawer
+								open={drawerBottomOpen}
+								onOpenChange={setDrawerBottomOpen}
+								direction="bottom"
+								title="Quick actions"
+								onConfirm={() => setDrawerBottomOpen(false)}
+							>
+								<div className="grid grid-cols-2 gap-2 sm:grid-cols-4">
+									{[
+										{ icon: Send, label: 'Send invoice' },
+										{ icon: UserPlus, label: 'Add customer' },
+										{ icon: CreditCard, label: 'Record payment' },
+										{ icon: FileText, label: 'New booking' },
+									].map((a) => (
+										<button key={a.label} className="flex flex-col items-center gap-2 rounded-lg border border-border bg-card px-3 py-4 transition-colors hover:bg-muted/40">
+											<span className="inline-flex size-9 items-center justify-center rounded-lg bg-primary/10 text-primary">
+												<a.icon className="size-4" />
+											</span>
+											<Text size="xs" weight="medium" align="center">{a.label}</Text>
+										</button>
+									))}
+								</div>
+							</Drawer>
+
+							<Drawer
+								open={drawerCustomOpen}
+								onOpenChange={setDrawerCustomOpen}
+								direction="right"
+								title="Help & shortcuts"
+								description="No footer — useful for read-only side panels."
+								showCancel={false}
+								showConfirm={false}
+							>
+								<Text type="secondary">
+									Hide the footer entirely with <code className="rounded bg-muted px-1 py-0.5 text-xs">{'showCancel={false}'}</code> + <code className="rounded bg-muted px-1 py-0.5 text-xs">{'showConfirm={false}'}</code> for read-only side panels (help, settings, audit logs).
+								</Text>
+							</Drawer>
+		</>
+	);
+}
+
+export function AlertDialogConfirmationPatterns() {
+	// AlertDialog state
+		const [confirmOpen, setConfirmOpen] = useState(false);
+	const [destructiveOpen, setDestructiveOpen] = useState(false);
+	const [unsavedOpen, setUnsavedOpen] = useState(false);
+	const [logoutOpen, setLogoutOpen] = useState(false);
+	return (
+		<>
+			<div className="flex flex-wrap gap-3">
+								<Button variant="primary" icon={Send} onClick={() => setConfirmOpen(true)}>Send invoice</Button>
+								<Button variant="error" icon={Trash2} onClick={() => setDestructiveOpen(true)}>Delete</Button>
+								<Button variant="warning" buttonStyle="outline" icon={AlertCircle} onClick={() => setUnsavedOpen(true)}>Discard unsaved</Button>
+								<Button variant="secondary" buttonStyle="outline" icon={ShieldAlert} onClick={() => setLogoutOpen(true)}>Sign out</Button>
+							</div>
+
+							<AlertDialog
+								open={confirmOpen}
+								onOpenChange={setConfirmOpen}
+								title="Send invoice now?"
+								description="The customer will be emailed the PDF and a Stripe payment link. You can cancel any time before they pay."
+								tone="info"
+								onConfirm={() => setConfirmOpen(false)}
+							/>
+							<AlertDialog
+								open={destructiveOpen}
+								onOpenChange={setDestructiveOpen}
+								title="Delete this booking?"
+								description="The booking, its payment, and all associated notes will be removed. This cannot be undone."
+								destructive
+								onConfirm={() => setDestructiveOpen(false)}
+							/>
+							<AlertDialog
+								open={unsavedOpen}
+								onOpenChange={setUnsavedOpen}
+								title="Discard unsaved changes?"
+								description="You have edits that haven't been saved yet. Leave the page and lose them?"
+								tone="warning"
+								onConfirm={() => setUnsavedOpen(false)}
+							/>
+							<AlertDialog
+								open={logoutOpen}
+								onOpenChange={setLogoutOpen}
+								title="Sign out of this device?"
+								description="You'll need to sign in again next time you visit."
+								onConfirm={() => setLogoutOpen(false)}
+							/>
+		</>
+	);
+}
+
+export function BestPractices() {
+	return (
+		<>
+			<div className="space-y-2 text-sm text-muted-foreground">
+								<div className="flex items-start gap-2">
+									<HelpCircle className="size-4 shrink-0 mt-0.5 text-info" aria-hidden="true" />
+									<Text>
+										<strong className="text-foreground font-semibold">Dialog</strong> for changes that affect content — settings, confirmations, edit forms.
+									</Text>
+								</div>
+								<div className="flex items-start gap-2">
+									<HelpCircle className="size-4 shrink-0 mt-0.5 text-info" aria-hidden="true" />
+									<Text>
+										<strong className="text-foreground font-semibold">Drawer</strong> for content that lives next to the current view — record details, filters, navigation.
+									</Text>
+								</div>
+								<div className="flex items-start gap-2">
+									<HelpCircle className="size-4 shrink-0 mt-0.5 text-info" aria-hidden="true" />
+									<Text>
+										<strong className="text-foreground font-semibold">AlertDialog</strong> for binary decisions that block other actions until resolved — destructive ops, sign-out, unsaved changes.
+									</Text>
+								</div>
+								<div className="flex items-start gap-2">
+									<Sparkles className="size-4 shrink-0 mt-0.5 text-primary" aria-hidden="true" />
+									<Text>
+										<strong className="text-foreground font-semibold">Async confirms</strong> — pass <code className="rounded bg-muted px-1 py-0.5 text-xs">onAsyncConfirm</code> instead of <code className="rounded bg-muted px-1 py-0.5 text-xs">onConfirm</code> to show a loading state while the action runs and auto-close on success.
+									</Text>
+								</div>
+							</div>
+		</>
+	);
+}
+`;function de(e){let t={h4:`h4`,...e.components};return K||$(`Examples`,!1),q||$(`Examples.APISurface`,!0),le||$(`Examples.AlertDialogConfirmationPatterns`,!0),ue||$(`Examples.BestPractices`,!0),J||$(`Examples.DialogDefault`,!0),Y||$(`Examples.DialogEmphasisTones`,!0),Z||$(`Examples.DialogFormPattern`,!0),X||$(`Examples.DialogRichContent`,!0),ce||$(`Examples.Drawer4Directions`,!0),(0,L.jsxs)(r,{title:`Features · Overlays`,description:`Native <dialog>-backed Dialog, Drawer (4 directions), and AlertDialog. Same emphasis/tone system, focus management, async-confirm flow, and confirm/cancel ergonomics across all three. Callback-driven so they slot into any framework.`,layer:`features`,status:`ready`,children:[(0,L.jsxs)(s,{title:`Examples`,id:`examples`,children:[(0,L.jsx)(c,{name:`APISurface`,source:Q,children:(0,L.jsx)(q,{})}),(0,L.jsx)(c,{name:`DialogDefault`,source:Q,children:(0,L.jsx)(J,{})}),(0,L.jsx)(c,{name:`DialogEmphasisTones`,source:Q,children:(0,L.jsx)(Y,{})}),(0,L.jsx)(c,{name:`DialogRichContent`,source:Q,children:(0,L.jsx)(X,{})}),(0,L.jsx)(c,{name:`DialogFormPattern`,source:Q,children:(0,L.jsx)(Z,{})}),(0,L.jsx)(c,{name:`Drawer4Directions`,source:Q,children:(0,L.jsx)(ce,{})}),(0,L.jsx)(c,{name:`AlertDialogConfirmationPatterns`,source:Q,children:(0,L.jsx)(le,{})}),(0,L.jsx)(c,{name:`BestPractices`,source:Q,children:(0,L.jsx)(ue,{})})]}),(0,L.jsxs)(s,{title:`API`,id:`api`,children:[(0,L.jsx)(t.h4,{children:`AlertDialog`}),(0,L.jsx)(k,{component:`AlertDialog`}),(0,L.jsx)(t.h4,{children:`Dialog`}),(0,L.jsx)(k,{component:`Dialog`}),(0,L.jsx)(t.h4,{children:`Drawer`}),(0,L.jsx)(k,{component:`Drawer`})]})]})}function fe(e={}){let{wrapper:t}=e.components||{};return t?(0,L.jsx)(t,{...e,children:(0,L.jsx)(de,{...e})}):de(e)}function $(e,t){throw Error(`Expected `+(t?`component`:`object`)+" `"+e+"` to be defined: you likely forgot to import, pass, or provide it.")}export{fe as default};

package/dist/showcase/assets/package-BIa1hPVQ.js

@@ -0,0 +1 @@
+import{r as e}from"./index-B-Z7p0So.js";var t=e(`package`,[[`path`,{d:`M11 21.73a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73z`,key:`1a0edw`}],[`path`,{d:`M12 22V12`,key:`d0xqtd`}],[`polyline`,{points:`3.29 7 12 12 20.71 7`,key:`ousv84`}],[`path`,{d:`m7.5 4.27 9 5.15`,key:`1c824w`}]]);export{t};

package/dist/showcase/assets/page-action-button-C5NiQHnP.js

@@ -0,0 +1 @@
+import{r as e}from"./chunk-CilyBKbf.js";import{In as t,vr as n}from"./example-DPfw-R7_.js";import{a as r,k as i}from"./index-B-Z7p0So.js";var a=e(i(),1),o=r(),s={xs:`xs`,sm:`sm`,base:`default`},c={xs:`h-7 px-2.5 text-xs`,sm:`h-8 px-3 text-xs`,base:`h-9 px-3.5 text-sm`},l=a.forwardRef(({variant:e=`secondary`,size:r,className:i,...a},l)=>{let u=e===`error`?`error`:e,d=r??`sm`;return(0,o.jsx)(t,{ref:l,variant:u,buttonStyle:`solid`,size:s[d],className:n(`page-action-button--component`,c[d],`shadow-none`,i),...a})});l.displayName=`PageActionButton`;export{l as t};

package/dist/showcase/assets/page-header-Cwf9DuhD.js

@@ -0,0 +1 @@
+import{r as e}from"./chunk-CilyBKbf.js";import{gr as t,hr as n,lr as r,r as i,vr as a}from"./example-DPfw-R7_.js";import{t as o}from"./arrow-left-BKx9qNX6.js";import{a as s,k as c}from"./index-B-Z7p0So.js";import{t as l}from"./separator-CZ_sPWQj.js";var u=e(c(),1),d=s(),f=({href:e,children:t,disabled:n,external:r,rel:i,target:a,...o})=>!e||n?(0,d.jsx)(`span`,{...o,children:t}):(0,d.jsx)(`a`,{href:e,target:a??(r?`_blank`:void 0),rel:i??(r?`noopener noreferrer`:void 0),...o,children:t});function p({renderLink:e,LinkComponent:t}={}){return e||(t?({active:e,disabled:n,external:r,children:i,...a})=>n||!a.href?(0,d.jsx)(`span`,{className:a.className,children:i}):(0,d.jsx)(t,{...a,children:i}):f)}function m({renderLink:e,LinkComponent:t}={}){return(0,u.useMemo)(()=>p({renderLink:e,LinkComponent:t}),[e,t])}var h={h1:`border-0 pb-0 text-xl`,h2:`border-0 pb-0 text-lg`,h3:`text-base`,h4:`text-sm`,h5:`text-sm`,h6:`text-sm`};function g({title:e,description:s,headingTag:c=`h3`,backHref:u,onBack:f,backLabel:p=`Back`,titleBadges:g=[],actions:_,slots:v,renderLink:y,LinkComponent:b,className:x,contentClassName:S,actionsClassName:C,titleClassName:w,descriptionClassName:T}){let E=m({renderLink:y,LinkComponent:b}),D=u||f?(0,d.jsxs)(`div`,{className:`flex items-center gap-1.5 pt-1`,children:[u&&!f?E({href:u,"aria-label":p,children:(0,d.jsxs)(i,{variant:`secondary`,buttonStyle:`ghost`,size:`icon-xs`,className:`h-7 w-7 rounded p-1`,children:[(0,d.jsx)(o,{className:`size-4`,"aria-hidden":`true`}),(0,d.jsx)(`span`,{className:`sr-only`,children:p})]})}):(0,d.jsx)(i,{type:`button`,variant:`secondary`,buttonStyle:`ghost`,size:`icon-xs`,className:`h-7 w-7 rounded p-1`,onClick:f,"aria-label":p,children:(0,d.jsx)(o,{className:`size-4`,"aria-hidden":`true`})}),(0,d.jsx)(l,{orientation:`vertical`,className:`h-7`})]}):null;return(0,d.jsxs)(`header`,{className:a(`flex w-full flex-col gap-4 md:flex-row md:items-start md:justify-between`,x),children:[(0,d.jsxs)(`div`,{className:`flex min-w-0 flex-1 items-start gap-3`,children:[v?.back??D,(0,d.jsxs)(`div`,{className:`flex min-w-0 flex-1 flex-col gap-0.5`,children:[v?.beforeTitle,(0,d.jsxs)(`div`,{className:a(`flex max-w-[475px] flex-col gap-0.5`,S),children:[(0,d.jsxs)(`div`,{className:`flex flex-wrap items-center gap-3`,children:[(0,d.jsx)(n,{tag:c,containerClassName:`space-y-0`,className:a(h[c],w),children:e}),g.length>0&&(0,d.jsx)(`div`,{className:`flex items-center gap-1.5`,children:g.map((e,t)=>(0,d.jsx)(r,{variant:e.variant??`secondary`,children:e.label},e.key??t))})]}),!!s&&(0,d.jsx)(t,{size:`xs`,type:`secondary`,className:T,children:s}),v?.afterDescription]})]})]}),v?.actions??(!!_&&(0,d.jsx)(`div`,{className:a(`shrink-0`,C),children:_}))]})}export{m as n,g as t};

package/dist/showcase/assets/pagination-9iSNmdCx.js

@@ -0,0 +1 @@
+import"./chunk-CilyBKbf.js";import{Ln as e,vr as t}from"./example-DPfw-R7_.js";import{t as n}from"./chevron-left-DIs3WYNO.js";import{t as r}from"./chevron-right-BNy0Or0x.js";import{t as i}from"./ellipsis-CgqPlt6Z.js";import{a,k as o}from"./index-B-Z7p0So.js";o();var s=a();function c({className:e,...n}){return(0,s.jsx)(`nav`,{role:`navigation`,"aria-label":`pagination`,"data-slot":`pagination`,className:t(`mx-auto flex w-full justify-center`,e),...n})}function l({className:e,...n}){return(0,s.jsx)(`ul`,{"data-slot":`pagination-content`,className:t(`gap-1 flex items-center`,e),...n})}function u({...e}){return(0,s.jsx)(`li`,{"data-slot":`pagination-item`,...e})}function d({className:n,isActive:r,size:i=`icon`,...a}){return(0,s.jsx)(e,{variant:r?`outline`:`ghost`,size:i,className:t(n),nativeButton:!1,render:(0,s.jsx)(`a`,{"aria-current":r?`page`:void 0,"data-slot":`pagination-link`,"data-active":r,...a})})}function f({className:e,text:r=`Previous`,...i}){return(0,s.jsxs)(d,{"aria-label":`Go to previous page`,size:`default`,className:t(`pl-2!`,e),...i,children:[(0,s.jsx)(n,{"data-icon":`inline-start`}),(0,s.jsx)(`span`,{className:`hidden sm:block`,children:r})]})}function p({className:e,text:n=`Next`,...i}){return(0,s.jsxs)(d,{"aria-label":`Go to next page`,size:`default`,className:t(`pr-2!`,e),...i,children:[(0,s.jsx)(`span`,{className:`hidden sm:block`,children:n}),(0,s.jsx)(r,{"data-icon":`inline-end`})]})}function m({className:e,...n}){return(0,s.jsxs)(`span`,{"aria-hidden":!0,"data-slot":`pagination-ellipsis`,className:t(`size-9 items-center justify-center [&_svg:not([class*='size-'])]:size-4 flex items-center justify-center`,e),...n,children:[(0,s.jsx)(i,{}),(0,s.jsx)(`span`,{className:`sr-only`,children:`More pages`})]})}export{d as a,u as i,l as n,p as o,m as r,f as s,c as t};

package/dist/showcase/assets/pagination-MjniF-7j.js

@@ -0,0 +1,42 @@
+import{n as e}from"./chunk-CilyBKbf.js";import{cr as t,sr as n,t as r}from"./example-DPfw-R7_.js";import{a as i}from"./index-B-Z7p0So.js";import{a,i as o,n as s,o as c,r as l,s as u,t as d}from"./pagination-9iSNmdCx.js";var f=e({Default:()=>m}),p=i();function m(){return(0,p.jsx)(p.Fragment,{children:(0,p.jsx)(d,{children:(0,p.jsxs)(s,{children:[(0,p.jsx)(o,{children:(0,p.jsx)(u,{href:`#`})}),(0,p.jsx)(o,{children:(0,p.jsx)(a,{href:`#`,children:`1`})}),(0,p.jsx)(o,{children:(0,p.jsx)(a,{href:`#`,isActive:!0,children:`2`})}),(0,p.jsx)(o,{children:(0,p.jsx)(a,{href:`#`,children:`3`})}),(0,p.jsx)(o,{children:(0,p.jsx)(l,{})}),(0,p.jsx)(o,{children:(0,p.jsx)(a,{href:`#`,children:`12`})}),(0,p.jsx)(o,{children:(0,p.jsx)(c,{href:`#`})})]})})})}var h=`import {
+	Pagination,
+	PaginationContent,
+	PaginationEllipsis,
+	PaginationItem,
+	PaginationLink,
+	PaginationNext,
+	PaginationPrevious,
+} from '@/components/ui/pagination';
+
+export function Default() {
+	return (
+		<>
+			<Pagination>
+								<PaginationContent>
+									<PaginationItem>
+										<PaginationPrevious href="#" />
+									</PaginationItem>
+									<PaginationItem>
+										<PaginationLink href="#">1</PaginationLink>
+									</PaginationItem>
+									<PaginationItem>
+										<PaginationLink href="#" isActive>2</PaginationLink>
+									</PaginationItem>
+									<PaginationItem>
+										<PaginationLink href="#">3</PaginationLink>
+									</PaginationItem>
+									<PaginationItem>
+										<PaginationEllipsis />
+									</PaginationItem>
+									<PaginationItem>
+										<PaginationLink href="#">12</PaginationLink>
+									</PaginationItem>
+									<PaginationItem>
+										<PaginationNext href="#" />
+									</PaginationItem>
+								</PaginationContent>
+							</Pagination>
+		</>
+	);
+}
+`;function g(e){return f||v(`Examples`,!1),m||v(`Examples.Default`,!0),(0,p.jsx)(t,{title:`UI · Pagination`,description:`Manual composition of pagination controls.`,layer:`ui`,status:`ready`,children:(0,p.jsx)(n,{title:`Examples`,id:`examples`,children:(0,p.jsx)(r,{name:`Default`,source:h,children:(0,p.jsx)(m,{})})})})}function _(e={}){let{wrapper:t}=e.components||{};return t?(0,p.jsx)(t,{...e,children:(0,p.jsx)(g,{...e})}):g(e)}function v(e,t){throw Error(`Expected `+(t?`component`:`object`)+" `"+e+"` to be defined: you likely forgot to import, pass, or provide it.")}export{_ as default};

package/dist/showcase/assets/paperclip-CaNLUOIA.js

@@ -0,0 +1 @@
+import{r as e}from"./index-B-Z7p0So.js";var t=e(`paperclip`,[[`path`,{d:`m16 6-8.414 8.586a2 2 0 0 0 2.829 2.829l8.414-8.586a4 4 0 1 0-5.657-5.657l-8.379 8.551a6 6 0 1 0 8.485 8.485l8.379-8.551`,key:`1miecu`}]]);export{t};

package/dist/showcase/assets/pencil-DTLGPoc_.js

@@ -0,0 +1 @@
+import{r as e}from"./index-B-Z7p0So.js";var t=e(`pencil`,[[`path`,{d:`M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z`,key:`1a8usu`}],[`path`,{d:`m15 5 4 4`,key:`1mk7zo`}]]);export{t};

package/dist/showcase/assets/phone-XvU6LndA.js

@@ -0,0 +1 @@
+import{r as e}from"./index-B-Z7p0So.js";var t=e(`phone`,[[`path`,{d:`M13.832 16.568a1 1 0 0 0 1.213-.303l.355-.465A2 2 0 0 1 17 15h3a2 2 0 0 1 2 2v3a2 2 0 0 1-2 2A18 18 0 0 1 2 4a2 2 0 0 1 2-2h3a2 2 0 0 1 2 2v3a2 2 0 0 1-.8 1.6l-.468.351a1 1 0 0 0-.292 1.233 14 14 0 0 0 6.392 6.384`,key:`9njp5v`}]]);export{t};

package/dist/showcase/assets/plus-BDSCn8ol.js

@@ -0,0 +1 @@
+import{r as e}from"./index-B-Z7p0So.js";var t=e(`plus`,[[`path`,{d:`M5 12h14`,key:`1ays0h`}],[`path`,{d:`M12 5v14`,key:`s699le`}]]);export{t};

package/dist/showcase/assets/popover-CvhuubS6.js

@@ -0,0 +1 @@
+import{r as e}from"./chunk-CilyBKbf.js";import{A as t,Bt as n,C as r,E as i,F as a,Gn as o,J as s,Jn as c,K as l,L as u,M as d,Mn as f,N as p,O as m,P as h,Qn as g,S as _,W as v,X as y,Xn as b,Y as x,Yt as S,Z as C,Zn as w,b as T,d as E,et as D,f as O,g as k,gn as A,in as j,it as M,j as N,jn as P,k as F,kn as I,l as L,nt as R,p as ee,rr as z,u as B,v as V,vr as H,w as U,x as W,y as G,z as K,zn as q}from"./example-DPfw-R7_.js";import{O as J,a as te,k as ne}from"./index-B-Z7p0So.js";import{a as re,i as ie,r as ae,t as oe}from"./useOpenInteractionType-CGeqRuuY.js";import{t as se}from"./useRole-DSPUSyVX.js";import{t as ce}from"./inertValue-NU_Amr-x.js";import{s as le}from"./composite-mol0-2zZ.js";import{t as ue}from"./ToolbarRootContext-iF4ctnIz.js";import{t as de}from"./useAnchoredPopupScrollLock-Cu2ZwN7Z.js";import{t as fe}from"./useTriggerFocusGuards-BwZ1HD24.js";var Y=e(ne()),X=Y.createContext(void 0);function Z(e){let t=Y.useContext(X);if(t===void 0&&!e)throw Error(c(47));return t}var pe=e(J());function me(){return{...m(),disabled:!1,modal:!1,focusManagerModal:!1,instantType:void 0,openMethod:null,openChangeReason:null,titleElementId:void 0,descriptionElementId:void 0,stickIfOpen:!0,nested:!1,openOnHover:!1,closeDelay:0,hasViewport:!1}}var he={...F,disabled:v(e=>e.disabled),instantType:v(e=>e.instantType),openMethod:v(e=>e.openMethod),openChangeReason:v(e=>e.openChangeReason),modal:v(e=>e.modal),focusManagerModal:v(e=>e.focusManagerModal),stickIfOpen:v(e=>e.stickIfOpen),titleElementId:v(e=>e.titleElementId),descriptionElementId:v(e=>e.descriptionElementId),openOnHover:v(e=>e.openOnHover),closeDelay:v(e=>e.closeDelay),hasViewport:v(e=>e.hasViewport)},ge=class e extends K{constructor(e){let n={...me(),...e};n.open&&e?.mounted===void 0&&(n.mounted=!0),super(n,{popupRef:Y.createRef(),backdropRef:Y.createRef(),internalBackdropRef:Y.createRef(),onOpenChange:void 0,onOpenChangeComplete:void 0,triggerFocusTargetRef:Y.createRef(),beforeContentFocusGuardRef:Y.createRef(),stickIfOpenTimeout:new I,triggerElements:new t},he)}setOpen=(e,t)=>{let n=t.reason===A,r=t.reason===`trigger-press`&&t.event.detail===0,i=!e&&(t.reason===`escape-key`||t.reason==null);if(t.preventUnmountOnClose=()=>{this.set(`preventUnmountingOnClose`,!0)},this.context.onOpenChange?.(e,t),t.isCanceled)return;this.state.floatingRootContext.dispatchOpenChange(e,t);let a=()=>{let n={open:e,openChangeReason:t.reason},r=t.trigger?.id??null;(r||e)&&(n.activeTriggerId=r,n.activeTriggerElement=t.trigger??null),this.update(n)};n?(this.set(`stickIfOpen`,!0),this.context.stickIfOpenTimeout.start(500,()=>{this.set(`stickIfOpen`,!1)}),pe.flushSync(a)):a(),r||i?this.set(`instantType`,r?`click`:`dismiss`):t.reason===`focus-out`?this.set(`instantType`,`focus`):this.set(`instantType`,void 0)};static useStore(t,n){let r=g(()=>new e(n)).current,i=t??r;return P(r.disposeEffect),i}disposeEffect=()=>this.context.stickIfOpenTimeout.disposeEffect()},Q=te();function $({props:e}){let{children:t,open:n,defaultOpen:r=!1,onOpenChange:a,onOpenChangeComplete:o,modal:s=!1,handle:c,triggerId:u,defaultTriggerId:p=null}=e,m=ge.useStore(c?.store,{modal:s,open:r,openProp:n,activeTriggerId:p,triggerIdProp:u});f(()=>{n===void 0&&m.state.open===!1&&r===!0&&m.update({open:!0,activeTriggerId:p})}),m.useControlledProp(`openProp`,n),m.useControlledProp(`triggerIdProp`,u);let h=m.useState(`open`),g=m.useState(`payload`);m.useContextCallback(`onOpenChange`,a),m.useContextCallback(`onOpenChangeComplete`,o);let{openMethod:v,triggerProps:y}=oe(h);N(m);let{forceUnmount:b}=d(h,m,()=>{m.update({stickIfOpen:!0,openChangeReason:null})});Y.useEffect(()=>{h||m.context.stickIfOpenTimeout.clear()},[m,h]);let x=Y.useCallback(()=>{m.setOpen(!1,S(j))},[m]);Y.useImperativeHandle(e.actionsRef,()=>({unmount:b,close:x}),[b,x]);let w=i({popupStore:m,onOpenChange:m.setOpen}),{getReferenceProps:T,getFloatingProps:E,getTriggerProps:D}=_([l(w,{outsidePressEvent:{mouse:s===`trap-focus`?`sloppy`:`intentional`,touch:`sloppy`}}),se(w)]),O=Y.useMemo(()=>T(y),[T,y]),k=Y.useMemo(()=>D(y),[D,y]),A=Y.useMemo(()=>E(),[E]);m.useSyncedValues({modal:s,openMethod:v,activeTriggerProps:O,inactiveTriggerProps:k,popupProps:A,floatingRootContext:w,nested:C()!=null});let M=Y.useMemo(()=>({store:m}),[m]);return(0,Q.jsx)(X.Provider,{value:M,children:typeof t==`function`?t({payload:g}):t})}function _e(e){return Z(!0)?(0,Q.jsx)($,{props:e}):(0,Q.jsx)(x,{children:(0,Q.jsx)($,{props:e})})}var ve=Y.forwardRef(function(e,t){let{render:i,className:a,disabled:s=!1,nativeButton:l=!0,handle:u,payload:d,openOnHover:f=!1,delay:m=300,closeDelay:h=0,id:g,style:v,...y}=e,b=Z(!0),x=u?.store??b?.store;if(!x)throw Error(c(74));let S=k(g),C=x.useState(`isTriggerActive`,S),w=x.useState(`floatingRootContext`),E=x.useState(`isOpenedByTrigger`,S),D=Y.useRef(null),{registerTrigger:O,isMountedByThisTrigger:A}=p(S,D,x,{payload:d,disabled:s,openOnHover:f,closeDelay:h}),j=x.useState(`openChangeReason`),M=x.useState(`stickIfOpen`),N=x.useState(`openMethod`),P=x.useState(`focusManagerModal`),F=r(w,{enabled:w!=null&&f&&(N!==`touch`||j!==`trigger-press`),mouseOnly:!0,move:!1,handleClose:W(),restMs:m,delay:{close:h},triggerElementRef:D,isActiveTrigger:C,isClosing:()=>x.select(`transitionStatus`)===`ending`}),I=_([ie(w,{enabled:w!=null,stickIfOpen:M})]),L=x.useState(`triggerProps`,A),ee={disabled:s,open:E},{getButtonProps:z,buttonRef:B}=o({disabled:s,native:l}),V=Y.useMemo(()=>({open(e){return e&&j===`trigger-press`?G.open(e):T.open(e)}}),[j]),H=q(`button`,e,{state:ee,ref:[B,t,O,D],props:[I.getReferenceProps(),F,L,{[R]:``,id:S},y,z],stateAttributesMapping:V}),{preFocusGuardRef:U,handlePreFocusGuardFocus:K,handleFocusTargetFocus:J}=fe(x,D);return C&&!P?(0,Q.jsxs)(Y.Fragment,{children:[(0,Q.jsx)(n,{ref:U,onFocus:K}),(0,Q.jsx)(Y.Fragment,{children:H},S),(0,Q.jsx)(n,{ref:x.context.triggerFocusTargetRef,onFocus:J})]}):(0,Q.jsx)(Y.Fragment,{children:H},S)}),ye=Y.createContext(void 0);function be(){let e=Y.useContext(ye);if(e===void 0)throw Error(c(45));return e}var xe=Y.forwardRef(function(e,t){let{keepMounted:n=!1,...r}=e,{store:i}=Z();return i.useState(`mounted`)||n?(0,Q.jsx)(ye.Provider,{value:n,children:(0,Q.jsx)(D,{ref:t,...r})}):null}),Se=Y.createContext(void 0);function Ce(){let e=Y.useContext(Se);if(!e)throw Error(c(46));return e}var we=Y.forwardRef(function(e,t){let{render:n,className:r,anchor:i,positionMethod:o=`absolute`,side:c=`bottom`,align:l=`center`,sideOffset:u=0,alignOffset:d=0,collisionBoundary:f=`clipping-ancestors`,collisionPadding:p=5,arrowPadding:m=5,sticky:h=!1,disableAnchorTracking:g=!1,collisionAvoidance:_=M,style:v,...x}=e,{store:S}=Z(),C=be(),w=y(),T=S.useState(`floatingRootContext`),E=S.useState(`mounted`),D=S.useState(`open`),k=S.useState(`openChangeReason`),A=S.useState(`activeTriggerElement`),j=S.useState(`modal`),N=S.useState(`openMethod`),P=S.useState(`positionerElement`),F=S.useState(`instantType`),I=S.useState(`transitionStatus`),L=S.useState(`hasViewport`),R=Y.useRef(null),z=a(P,!1,!1),V=O({anchor:i,floatingRootContext:T,positionMethod:o,mounted:E,side:c,sideOffset:u,align:l,alignOffset:d,arrowPadding:m,collisionBoundary:f,collisionPadding:p,sticky:h,disableAnchorTracking:g,keepMounted:C,nodeId:w,collisionAvoidance:_,adaptiveOrigin:L?ee:void 0}),H=T.useState(`domReferenceElement`);b(()=>{let e=H,t=R.current;if(e&&(R.current=e),t&&e&&e!==t){S.set(`instantType`,void 0);let e=new AbortController;return z(()=>{S.set(`instantType`,`trigger-change`)},e.signal),()=>{e.abort()}}},[H,z,S]);let U={open:D,side:V.side,align:V.align,anchorHidden:V.anchorHidden,instant:F};de(D&&j===!0&&k!==`trigger-hover`,N===`touch`,P,A);let W=Y.useCallback(e=>{S.set(`positionerElement`,e)},[S]),G=B(e,U,{styles:V.positionerStyles,transitionStatus:I,props:x,refs:[t,W],hidden:!E,inert:!D});return(0,Q.jsxs)(Se.Provider,{value:V,children:[E&&j===!0&&k!==`trigger-hover`&&(0,Q.jsx)(ae,{ref:S.context.internalBackdropRef,inert:ce(!D),cutout:A}),(0,Q.jsx)(s,{id:w,children:G})]})}),Te=Y.createContext(void 0);function Ee(){let[e,t]=Y.useState(0),n=w(()=>(t(e=>e+1),()=>{t(e=>Math.max(0,e-1))}));return{context:Y.useMemo(()=>({register:n}),[n]),hasClosePart:e>0}}function De(e){let{value:t,children:n}=e;return(0,Q.jsx)(Te.Provider,{value:t,children:n})}var Oe={...V,...u},ke=Y.forwardRef(function(e,t){let{className:n,render:r,initialFocus:i,finalFocus:a,style:o,...s}=e,{store:c}=Z(),l=Ce(),u=ue(!0)!=null,{context:d,hasClosePart:f}=Ee(),p=c.useState(`open`),m=c.useState(`openMethod`),g=c.useState(`instantType`),_=c.useState(`transitionStatus`),v=c.useState(`popupProps`),y=c.useState(`titleElementId`),b=c.useState(`descriptionElementId`),x=c.useState(`modal`),S=c.useState(`mounted`),C=c.useState(`openChangeReason`),w=c.useState(`activeTriggerElement`),T=c.useState(`floatingRootContext`);h({open:p,ref:c.context.popupRef,onComplete(){p&&c.context.onOpenChangeComplete?.(!0)}});let D=c.useState(`disabled`),O=c.useState(`openOnHover`),k=c.useState(`closeDelay`);U(T,{enabled:O&&!D,closeDelay:k});function A(e){return e===`touch`?c.context.popupRef.current:!0}let j=i===void 0?A:i,M={open:p,side:l.side,align:l.align,instant:g,transitionStatus:_},N=x!==!1&&f;c.useSyncedValue(`focusManagerModal`,N);let P=Y.useCallback(e=>{c.set(`popupElement`,e)},[c]),F=q(`div`,e,{state:M,ref:[t,c.context.popupRef,P],props:[v,{"aria-labelledby":y,"aria-describedby":b,onKeyDown(e){u&&le.has(e.key)&&e.stopPropagation()}},E(_),s],stateAttributesMapping:Oe});return(0,Q.jsx)(re,{context:T,openInteractionType:m,modal:N,disabled:!S||C===`trigger-hover`,initialFocus:j,returnFocus:a,restoreFocus:`popup`,previousFocusableElement:z(w)?w:void 0,nextFocusableElement:c.context.triggerFocusTargetRef,beforeContentFocusGuardRef:c.context.beforeContentFocusGuardRef,children:(0,Q.jsx)(De,{value:d,children:F})})});function Ae({...e}){return(0,Q.jsx)(_e,{"data-slot":`popover`,...e})}function je({asChild:e=!1,nativeButton:t,render:n,children:r,...i}){let a=e?(0,Q.jsx)(L,{}):void 0,o=typeof n==`function`?((e,t)=>{let{nativeButton:r,...i}=e;return n(i,t)}):n,s=!0;e&&Y.isValidElement(r)&&(s=typeof r.type==`string`?r.type===`button`:!(`href`in(r.props??{})));let c=t??(e?s:!0);return(0,Q.jsx)(ve,{"data-slot":`popover-trigger`,render:a??o,nativeButton:c,...i,children:r})}function Me({className:e,align:t=`center`,alignOffset:n=0,side:r=`bottom`,sideOffset:i=4,disablePortal:a=!1,onOpenAutoFocus:o,onInteractOutside:s,...c}){let l=(0,Q.jsx)(we,{align:t,alignOffset:n,side:r,sideOffset:i,className:`isolate z-50`,children:(0,Q.jsx)(ke,{"data-slot":`popover-content`,className:H(`bg-popover text-popover-foreground data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-95 data-open:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 ring-foreground/10 flex flex-col gap-4 rounded-md p-4 text-sm shadow-md ring-1 duration-100 data-[side=inline-start]:slide-in-from-right-2 data-[side=inline-end]:slide-in-from-left-2 z-50 w-72 origin-(--transform-origin) outline-hidden`,e),...c})});return a?l:(0,Q.jsx)(xe,{children:l})}export{Me as n,je as r,Ae as t};

package/dist/showcase/assets/popover-DUQqLZN2.js

@@ -0,0 +1 @@
+import"./chunk-CilyBKbf.js";import{vr as e}from"./example-DPfw-R7_.js";import{a as t,k as n}from"./index-B-Z7p0So.js";import{n as r}from"./popover-CvhuubS6.js";n();var i=t();function a({className:t,sideOffset:n=6,style:a,...o}){return(0,i.jsx)(r,{sideOffset:n,className:e(`popover--component`,`p-(--popover-content-pad)`,`border border-border/60 shadow-md ring-0`,t),style:a,...o})}export{a as t};

package/dist/showcase/assets/popover-menu-DVGBuFpL.js

@@ -0,0 +1 @@
+import"./chunk-CilyBKbf.js";import{gr as e,vr as t,xr as n}from"./example-DPfw-R7_.js";import{a as r,k as i}from"./index-B-Z7p0So.js";import{r as a,t as o}from"./popover-CvhuubS6.js";import{t as s}from"./popover-DUQqLZN2.js";import{i as c}from"./command-DZqmBolX.js";import{a as l,i as u,n as d,r as f,t as p}from"./command-BsHudlBe.js";i();var m={searchPlaceholder:`Search…`,empty:`No results.`,loading:`Loading…`},h=r();function g({trigger:r,items:i,onSelect:g,open:_,onOpenChange:v,search:y=!0,searchValue:b,onSearchChange:x,loading:S=!1,header:C,footer:w,empty:T,loadingSlot:E,renderItem:D,strings:O,align:k=`start`,sideOffset:A,contentClassName:j}){let M={...m,...O};return(0,h.jsxs)(o,{open:_,onOpenChange:v,children:[(0,h.jsx)(a,{render:r}),(0,h.jsx)(s,{align:k,sideOffset:A,className:t(`popover-menu--component`,`w-56 p-0 overflow-hidden`,j),children:(0,h.jsxs)(p,{shouldFilter:!x,children:[!!C&&(0,h.jsx)(`div`,{className:`border-b border-border/60 px-3 py-2`,children:C}),!!y&&(0,h.jsx)(c,{placeholder:M.searchPlaceholder,value:b,onValueChange:x}),(0,h.jsxs)(l,{children:[!!S&&(E??(0,h.jsxs)(`div`,{className:`flex items-center justify-center gap-2 py-3 text-muted-foreground`,children:[(0,h.jsx)(n,{className:`size-3.5 animate-spin`,"aria-hidden":`true`}),(0,h.jsx)(e,{tag:`span`,size:`xs`,type:`secondary`,children:M.loading})]})),(0,h.jsx)(d,{children:T??M.empty}),i.length>0&&(0,h.jsx)(f,{children:i.map(t=>(0,h.jsx)(u,{value:t.searchValue??t.value,onSelect:()=>g(t),disabled:t.disabled,"data-checked":t.selected||void 0,className:`data-[checked=true]:**:[svg]:text-primary`,children:D?D(t,{isHighlighted:!1}):(0,h.jsxs)(h.Fragment,{children:[!!t.icon&&(0,h.jsx)(`span`,{className:`text-muted-foreground shrink-0`,children:t.icon}),(0,h.jsxs)(`div`,{className:`flex min-w-0 flex-1 flex-col leading-tight`,children:[(0,h.jsx)(e,{tag:`span`,size:`xs`,weight:t.selected?`medium`:`regular`,className:`truncate`,children:t.label}),!!t.description&&(0,h.jsx)(e,{tag:`span`,size:`xxs`,type:`secondary`,className:`mt-0.5 truncate`,children:t.description})]})]})},t.value))})]}),!!w&&(0,h.jsx)(`div`,{className:`border-t border-border/60 px-3 py-2`,children:w})]})})]})}g.displayName=`PopoverMenu`;export{g as t};

package/dist/showcase/assets/progress-BQopCRpV.js

@@ -0,0 +1 @@
+import{r as e}from"./chunk-CilyBKbf.js";import{Jn as t,Kt as n,Vt as r,vr as i,zn as a}from"./example-DPfw-R7_.js";import{a as o,k as s}from"./index-B-Z7p0So.js";import{r as c,t as l}from"./valueToPercent-CDF3aNnc.js";var u=e(s()),d=u.createContext(void 0);function f(){let e=u.useContext(d);if(e===void 0)throw Error(t(51));return e}var p=function(e){return e.complete=`data-complete`,e.indeterminate=`data-indeterminate`,e.progressing=`data-progressing`,e}({}),m={status(e){return e===`progressing`?{[p.progressing]:``}:e===`complete`?{[p.complete]:``}:e===`indeterminate`?{[p.indeterminate]:``}:null}},h=o();function g(e,t){return t==null?`indeterminate progress`:e||`${t}%`}var _=u.forwardRef(function(e,t){let{format:i,getAriaValueText:o=g,locale:s,max:l=100,min:f=0,value:p,render:_,className:v,children:y,style:b,...x}=e,[S,C]=u.useState(),w=n(i),T=`indeterminate`;Number.isFinite(p)&&(T=p===l?`complete`:`progressing`);let E=c(p,s,w.current),D=u.useMemo(()=>({status:T}),[T]),O={"aria-labelledby":S,"aria-valuemax":l,"aria-valuemin":f,"aria-valuenow":p??void 0,"aria-valuetext":o(E,p),role:`progressbar`,children:(0,h.jsxs)(u.Fragment,{children:[y,(0,h.jsx)(`span`,{role:`presentation`,style:r,children:`x`})]})},k=u.useMemo(()=>({formattedValue:E,max:l,min:f,setLabelId:C,state:D,status:T,value:p}),[E,l,f,C,D,T,p]),A=a(`div`,e,{state:D,ref:t,props:[O,x],stateAttributesMapping:m});return(0,h.jsx)(d.Provider,{value:k,children:A})}),v=u.forwardRef(function(e,t){let{render:n,className:r,style:i,...o}=e,{state:s}=f();return a(`div`,e,{state:s,ref:t,props:o,stateAttributesMapping:m})}),y=u.forwardRef(function(e,t){let{render:n,className:r,style:i,...o}=e,{max:s,min:c,value:d,state:p}=f(),h=Number.isFinite(d)&&d!==null?l(d,c,s):null;return a(`div`,e,{state:p,ref:t,props:[{style:u.useCallback(()=>h==null?{}:{insetInlineStart:0,height:`inherit`,width:`${h}%`},[h])()},o],stateAttributesMapping:m})});function b({className:e,children:t,value:n,...r}){return(0,h.jsxs)(_,{value:n,"data-slot":`progress`,className:i(`flex flex-wrap gap-3`,e),...r,children:[t,(0,h.jsx)(x,{children:(0,h.jsx)(S,{})})]})}function x({className:e,...t}){return(0,h.jsx)(v,{className:i(`bg-muted h-1.5 rounded-full relative flex w-full items-center overflow-x-hidden`,e),"data-slot":`progress-track`,...t})}function S({className:e,...t}){return(0,h.jsx)(y,{"data-slot":`progress-indicator`,className:i(`bg-primary h-full transition-all`,e),...t})}export{b as t};

package/dist/showcase/assets/progress-CvSUR260.js

@@ -0,0 +1,18 @@
+import{n as e}from"./chunk-CilyBKbf.js";import{cr as t,sr as n,t as r}from"./example-DPfw-R7_.js";import{a as i}from"./index-B-Z7p0So.js";import{t as a}from"./progress-BQopCRpV.js";import{t as o}from"./PreviewLayout-BHemtKEf.js";var s=e({Values:()=>l}),c=i();function l(){return(0,c.jsx)(c.Fragment,{children:(0,c.jsx)(o,{children:[0,25,50,75,100].map(e=>(0,c.jsxs)(`div`,{className:`space-y-1`,children:[(0,c.jsxs)(`div`,{className:`text-xs text-muted-foreground`,children:[e,`%`]}),(0,c.jsx)(a,{value:e})]},e))})})}var u=`import { Progress } from '@/components/ui/progress';
+import { Col } from '../../PreviewLayout';
+
+export function Values() {
+	return (
+		<>
+			<Col>
+								{[0, 25, 50, 75, 100].map((v) => (
+									<div key={v} className="space-y-1">
+										<div className="text-xs text-muted-foreground">{v}%</div>
+										<Progress value={v} />
+									</div>
+								))}
+							</Col>
+		</>
+	);
+}
+`;function d(e){return s||p(`Examples`,!1),l||p(`Examples.Values`,!0),(0,c.jsx)(t,{title:`UI · Progress`,description:`Linear progress bar at varying values.`,layer:`ui`,status:`ready`,children:(0,c.jsx)(n,{title:`Examples`,id:`examples`,children:(0,c.jsx)(r,{name:`Values`,source:u,children:(0,c.jsx)(l,{})})})})}function f(e={}){let{wrapper:t}=e.components||{};return t?(0,c.jsx)(t,{...e,children:(0,c.jsx)(d,{...e})}):d(e)}function p(e,t){throw Error(`Expected `+(t?`component`:`object`)+" `"+e+"` to be defined: you likely forgot to import, pass, or provide it.")}export{f as default};

package/dist/showcase/assets/props-table-BzUnIcv-.js

@@ -0,0 +1 @@
+import{r as e}from"./chunk-CilyBKbf.js";import{gr as t,vr as n}from"./example-DPfw-R7_.js";import{a as r,k as i}from"./index-B-Z7p0So.js";var a=e(i(),1),o=``+new URL(`props.generated-BqPfiNI-.json`,import.meta.url).href,s=r(),c=null;function l(){return c||=fetch(o).then(async e=>{if(!e.ok)throw Error(`Unable to load props metadata: ${e.status}`);return e.json()}),c}function u({component:e,className:r}){let[i,o]=(0,a.useState)(null),[c,u]=(0,a.useState)(null);if((0,a.useEffect)(()=>{let e=!0;return l().then(t=>{e&&o(t)}).catch(t=>{e&&u(t instanceof Error?t:Error(String(t)))}),()=>{e=!1}},[]),c)return(0,s.jsx)(`div`,{className:n(`props-table--component rounded-md border border-warning/30 bg-warning/5 p-3`,r),children:(0,s.jsx)(t,{size:`xs`,type:`secondary`,children:c.message})});if(!i)return(0,s.jsx)(t,{size:`xs`,type:`secondary`,className:n(`props-table--component`,r),children:`Loading props metadata...`});let d=i[e];if(!d)return(0,s.jsx)(`div`,{className:n(`props-table--component rounded-md border border-warning/30 bg-warning/5 p-3`,r),children:(0,s.jsxs)(t,{size:`xs`,type:`secondary`,children:[`No props metadata for `,(0,s.jsx)(`code`,{className:`font-mono`,children:e}),`. Run`,` `,(0,s.jsx)(`code`,{className:`font-mono`,children:`npm run docs:generate-props`}),`.`]})});let f=Object.values(d.props).sort((e,t)=>e.required&&!t.required?-1:!e.required&&t.required?1:e.name.localeCompare(t.name));return f.length===0?(0,s.jsx)(t,{size:`xs`,type:`secondary`,className:n(`props-table--component`,r),children:`This component has no documented props.`}):(0,s.jsx)(`div`,{className:n(`props-table--component overflow-x-auto rounded-md border border-border`,r),children:(0,s.jsxs)(`table`,{className:`w-full border-collapse text-xs`,children:[(0,s.jsx)(`thead`,{className:`props-table--head bg-muted/40 text-left`,children:(0,s.jsxs)(`tr`,{children:[(0,s.jsx)(`th`,{className:`px-3 py-2 font-semibold`,children:`Prop`}),(0,s.jsx)(`th`,{className:`px-3 py-2 font-semibold`,children:`Type`}),(0,s.jsx)(`th`,{className:`px-3 py-2 font-semibold`,children:`Default`}),(0,s.jsx)(`th`,{className:`px-3 py-2 font-semibold`,children:`Description`})]})}),(0,s.jsx)(`tbody`,{className:`props-table--body`,children:f.map(e=>(0,s.jsxs)(`tr`,{className:`border-t border-border align-top`,children:[(0,s.jsxs)(`td`,{className:`px-3 py-2 font-mono`,children:[e.name,e.required&&(0,s.jsx)(`span`,{className:`ml-0.5 text-destructive`,children:`*`})]}),(0,s.jsx)(`td`,{className:`px-3 py-2 font-mono text-muted-foreground`,children:e.type}),(0,s.jsx)(`td`,{className:`px-3 py-2 font-mono text-muted-foreground`,children:e.defaultValue??`—`}),(0,s.jsx)(`td`,{className:`px-3 py-2 text-muted-foreground`,children:e.description||`—`})]},e.name))})]})})}export{u as t};