@uselets/ui 2.0.0 → 2.0.1

package/dist/components/alert-dialog.d.ts

@@ -14,6 +14,8 @@ export type AlertDialogContentProps = AsChildPrimitiveProps<typeof AlertDialog$1
    * @default 'md'
    */
   size?: 'sm' | 'md';
+  /** Props passed to the overlay rendered behind the dialog. */
+  overlayProps?: AlertDialogOverlayProps;
 };
 export type AlertDialogHeaderProps = React.ComponentProps<'div'>;
 export type AlertDialogFooterProps = React.ComponentProps<'div'>;
@@ -25,8 +27,8 @@ export type AlertDialogCancelProps = Omit<AsChildPrimitiveProps<typeof AlertDial
 declare function AlertDialog({ ...props }: AlertDialogProps): React.JSX.Element;
 declare function AlertDialogTrigger({ asChild, children, ...props }: AlertDialogTriggerProps): React.JSX.Element;
 declare function AlertDialogPortal({ ...props }: AlertDialogPortalProps): React.JSX.Element;
-declare function AlertDialogOverlay({ className, asChild, children, ...props }: AlertDialogOverlayProps): React.JSX.Element;
-declare function AlertDialogContent({ className, size, keepMounted, asChild, children, ...props }: AlertDialogContentProps): React.JSX.Element;
+declare function AlertDialogOverlay({ className, forceRender, asChild, children, ...props }: AlertDialogOverlayProps): React.JSX.Element;
+declare function AlertDialogContent({ className, size, overlayProps, keepMounted, asChild, children, ...props }: AlertDialogContentProps): React.JSX.Element;
 declare function AlertDialogHeader({ className, ...props }: AlertDialogHeaderProps): React.JSX.Element;
 declare function AlertDialogFooter({ className, ...props }: AlertDialogFooterProps): React.JSX.Element;
 declare function AlertDialogMedia({ className, ...props }: AlertDialogMediaProps): React.JSX.Element;

package/dist/components/alert-dialog.js

@@ -1,2 +1,2 @@
-import"../rolldown-runtime-BhWHdk3m.js";import{toAsChildRenderProps as e}from"../lib/as-child.js";import{cn as t}from"../lib/utils.js";import{t as n}from"../resolve-class-name-BurP8ngI.js";import{Button as r}from"./button.js";import{jsx as i,jsxs as a}from"react/jsx-runtime";import{AlertDialog as o}from"@base-ui/react/alert-dialog";function AlertDialog({...e}){return/* @__PURE__ */ i(o.Root,{"data-slot":`alert-dialog`,...e})}function AlertDialogTrigger({asChild:t,children:n,...r}){return/* @__PURE__ */ i(o.Trigger,{"data-slot":`alert-dialog-trigger`,...r,...e(t,n)})}function AlertDialogPortal({...e}){return/* @__PURE__ */ i(o.Portal,{"data-slot":`alert-dialog-portal`,...e})}function AlertDialogOverlay({className:r,asChild:a,children:s,...c}){return/* @__PURE__ */ i(o.Backdrop,{"data-slot":`alert-dialog-overlay`,className:e=>t(`fixed inset-0 z-50 bg-black/10 duration-100 supports-backdrop-filter:backdrop-blur-xs data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0`,n(r,e)),...c,...e(a,s)})}function AlertDialogContent({className:r,size:s=`md`,keepMounted:c,asChild:l,children:u,...d}){return/* @__PURE__ */ a(AlertDialogPortal,{keepMounted:c,children:[/* @__PURE__ */ i(AlertDialogOverlay,{}),/* @__PURE__ */ i(o.Popup,{"data-slot":`alert-dialog-content`,"data-size":s,className:e=>t(`group/alert-dialog-content fixed top-1/2 left-1/2 z-50 grid w-full -translate-x-1/2 -translate-y-1/2 gap-4 rounded-xl bg-background p-4 ring-1 ring-foreground/10 duration-100 outline-none data-[size=md]:max-w-xs data-[size=sm]:max-w-xs data-[size=md]:sm:max-w-sm data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95`,n(r,e)),...d,...e(l,u)})]})}function AlertDialogHeader({className:e,...n}){return/* @__PURE__ */ i(`div`,{"data-slot":`alert-dialog-header`,className:t(`grid grid-rows-[auto_1fr] place-items-center gap-1.5 text-center has-data-[slot=alert-dialog-media]:grid-rows-[auto_auto_1fr] has-data-[slot=alert-dialog-media]:gap-x-4 sm:group-data-[size=md]/alert-dialog-content:place-items-start sm:group-data-[size=md]/alert-dialog-content:text-left sm:group-data-[size=md]/alert-dialog-content:has-data-[slot=alert-dialog-media]:grid-rows-[auto_1fr]`,e),...n})}function AlertDialogFooter({className:e,...n}){return/* @__PURE__ */ i(`div`,{"data-slot":`alert-dialog-footer`,className:t(`-mx-4 -mb-4 flex flex-col-reverse gap-2 rounded-b-xl border-t bg-muted/50 p-4 group-data-[size=sm]/alert-dialog-content:grid group-data-[size=sm]/alert-dialog-content:grid-cols-2 sm:flex-row sm:justify-end`,e),...n})}function AlertDialogMedia({className:e,...n}){return/* @__PURE__ */ i(`div`,{"data-slot":`alert-dialog-media`,className:t(`mb-2 inline-flex size-10 items-center justify-center rounded-md bg-muted sm:group-data-[size=md]/alert-dialog-content:row-span-2 *:[svg:not([class*='size-'])]:size-6`,e),...n})}function AlertDialogTitle({className:r,asChild:a,children:s,...c}){return/* @__PURE__ */ i(o.Title,{"data-slot":`alert-dialog-title`,className:e=>t(`text-base font-medium sm:group-data-[size=md]/alert-dialog-content:group-has-data-[slot=alert-dialog-media]/alert-dialog-content:col-start-2`,n(r,e)),...c,...e(a,s)})}function AlertDialogDescription({className:r,asChild:a,children:s,...c}){return/* @__PURE__ */ i(o.Description,{"data-slot":`alert-dialog-description`,className:e=>t(`text-sm text-balance text-muted-foreground md:text-pretty *:[a]:underline *:[a]:underline-offset-3 *:[a]:hover:text-foreground`,n(r,e)),...c,...e(a,s)})}function AlertDialogAction({className:e,variant:n=`solid`,color:a=`primary`,size:s=`md`,asChild:c,children:l,...u}){let d={variant:n,color:a,size:s,className:t(e)};return/* @__PURE__ */ i(o.Close,{"data-slot":`alert-dialog-action`,render:c?/* @__PURE__ */ i(r,{...d,asChild:!0,children:l}):/* @__PURE__ */ i(r,{...d}),...u,children:c?void 0:l})}function AlertDialogCancel({className:e,variant:n=`outline`,color:a=`primary`,size:s=`md`,asChild:c,children:l,...u}){let d={variant:n,color:a,size:s,className:t(e)};return/* @__PURE__ */ i(o.Close,{"data-slot":`alert-dialog-cancel`,render:c?/* @__PURE__ */ i(r,{...d,asChild:!0,children:l}):/* @__PURE__ */ i(r,{...d}),...u,children:c?void 0:l})}export{AlertDialog,AlertDialogAction,AlertDialogCancel,AlertDialogContent,AlertDialogDescription,AlertDialogFooter,AlertDialogHeader,AlertDialogMedia,AlertDialogOverlay,AlertDialogPortal,AlertDialogTitle,AlertDialogTrigger};
+import"../rolldown-runtime-BhWHdk3m.js";import{toAsChildRenderProps as e}from"../lib/as-child.js";import{cn as t}from"../lib/utils.js";import{t as n}from"../resolve-class-name-BurP8ngI.js";import{Button as r}from"./button.js";import{jsx as i,jsxs as a}from"react/jsx-runtime";import{AlertDialog as o}from"@base-ui/react/alert-dialog";function AlertDialog({...e}){return/* @__PURE__ */ i(o.Root,{"data-slot":`alert-dialog`,...e})}function AlertDialogTrigger({asChild:t,children:n,...r}){return/* @__PURE__ */ i(o.Trigger,{"data-slot":`alert-dialog-trigger`,...r,...e(t,n)})}function AlertDialogPortal({...e}){return/* @__PURE__ */ i(o.Portal,{"data-slot":`alert-dialog-portal`,...e})}function AlertDialogOverlay({className:r,forceRender:a=!0,asChild:s,children:c,...l}){return/* @__PURE__ */ i(o.Backdrop,{"data-slot":`alert-dialog-overlay`,forceRender:a,className:e=>t(`fixed inset-0 z-50 bg-black/10 duration-100 supports-backdrop-filter:backdrop-blur-xs data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0`,n(r,e)),...l,...e(s,c)})}function AlertDialogContent({className:r,size:s=`md`,overlayProps:c,keepMounted:l,asChild:u,children:d,...f}){return/* @__PURE__ */ a(AlertDialogPortal,{keepMounted:l,children:[/* @__PURE__ */ i(AlertDialogOverlay,{...c}),/* @__PURE__ */ i(o.Popup,{"data-slot":`alert-dialog-content`,"data-size":s,className:e=>t(`group/alert-dialog-content fixed top-1/2 left-1/2 z-50 grid w-full -translate-x-1/2 -translate-y-1/2 gap-4 rounded-xl bg-background p-4 ring-1 ring-foreground/10 duration-100 outline-none data-[size=md]:max-w-xs data-[size=sm]:max-w-xs data-[size=md]:sm:max-w-sm data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95`,n(r,e)),...f,...e(u,d)})]})}function AlertDialogHeader({className:e,...n}){return/* @__PURE__ */ i(`div`,{"data-slot":`alert-dialog-header`,className:t(`grid grid-rows-[auto_1fr] place-items-center gap-1.5 text-center has-data-[slot=alert-dialog-media]:grid-rows-[auto_auto_1fr] has-data-[slot=alert-dialog-media]:gap-x-4 sm:group-data-[size=md]/alert-dialog-content:place-items-start sm:group-data-[size=md]/alert-dialog-content:text-left sm:group-data-[size=md]/alert-dialog-content:has-data-[slot=alert-dialog-media]:grid-rows-[auto_1fr]`,e),...n})}function AlertDialogFooter({className:e,...n}){return/* @__PURE__ */ i(`div`,{"data-slot":`alert-dialog-footer`,className:t(`-mx-4 -mb-4 flex flex-col-reverse gap-2 rounded-b-xl border-t bg-muted/50 p-4 group-data-[size=sm]/alert-dialog-content:grid group-data-[size=sm]/alert-dialog-content:grid-cols-2 sm:flex-row sm:justify-end`,e),...n})}function AlertDialogMedia({className:e,...n}){return/* @__PURE__ */ i(`div`,{"data-slot":`alert-dialog-media`,className:t(`mb-2 inline-flex size-10 items-center justify-center rounded-md bg-muted sm:group-data-[size=md]/alert-dialog-content:row-span-2 *:[svg:not([class*='size-'])]:size-6`,e),...n})}function AlertDialogTitle({className:r,asChild:a,children:s,...c}){return/* @__PURE__ */ i(o.Title,{"data-slot":`alert-dialog-title`,className:e=>t(`text-base font-medium sm:group-data-[size=md]/alert-dialog-content:group-has-data-[slot=alert-dialog-media]/alert-dialog-content:col-start-2`,n(r,e)),...c,...e(a,s)})}function AlertDialogDescription({className:r,asChild:a,children:s,...c}){return/* @__PURE__ */ i(o.Description,{"data-slot":`alert-dialog-description`,className:e=>t(`text-sm text-balance text-muted-foreground md:text-pretty *:[a]:underline *:[a]:underline-offset-3 *:[a]:hover:text-foreground`,n(r,e)),...c,...e(a,s)})}function AlertDialogAction({className:e,variant:n=`solid`,color:a=`primary`,size:s=`md`,asChild:c,children:l,...u}){let d={variant:n,color:a,size:s,className:t(e)};return/* @__PURE__ */ i(o.Close,{"data-slot":`alert-dialog-action`,render:c?/* @__PURE__ */ i(r,{...d,asChild:!0,children:l}):/* @__PURE__ */ i(r,{...d}),...u,children:c?void 0:l})}function AlertDialogCancel({className:e,variant:n=`outline`,color:a=`primary`,size:s=`md`,asChild:c,children:l,...u}){let d={variant:n,color:a,size:s,className:t(e)};return/* @__PURE__ */ i(o.Close,{"data-slot":`alert-dialog-cancel`,render:c?/* @__PURE__ */ i(r,{...d,asChild:!0,children:l}):/* @__PURE__ */ i(r,{...d}),...u,children:c?void 0:l})}export{AlertDialog,AlertDialogAction,AlertDialogCancel,AlertDialogContent,AlertDialogDescription,AlertDialogFooter,AlertDialogHeader,AlertDialogMedia,AlertDialogOverlay,AlertDialogPortal,AlertDialogTitle,AlertDialogTrigger};
 //# sourceMappingURL=alert-dialog.js.map

package/dist/components/alert-dialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"alert-dialog.js","names":["AlertDialogPrimitive","resolveClassName","AlertDialog$1","props","toAsChildRenderProps","asChild","children","cn","className","state","size","buttonProps","Button"],"sources":["../../src/components/alert-dialog.tsx"],"sourcesContent":["import type * as React from 'react'\n\nimport { AlertDialog as AlertDialogPrimitive } from '@base-ui/react/alert-dialog'\n\nimport { type AsChildPrimitiveProps, toAsChildRenderProps } from '../lib/as-child'\nimport { cn } from '../lib/utils'\nimport { resolveClassName } from '../utils/resolve-class-name'\nimport { Button } from './button'\n\nexport type AlertDialogProps = React.ComponentProps<typeof AlertDialogPrimitive.Root>\n\nexport type AlertDialogTriggerProps = AsChildPrimitiveProps<typeof AlertDialogPrimitive.Trigger>\n\nexport type AlertDialogPortalProps = React.ComponentProps<typeof AlertDialogPrimitive.Portal>\n\nexport type AlertDialogOverlayProps = AsChildPrimitiveProps<typeof AlertDialogPrimitive.Backdrop>\n\nexport type AlertDialogContentProps = AsChildPrimitiveProps<typeof AlertDialogPrimitive.Popup> &\n  Pick<AlertDialogPortalProps, 'keepMounted'> & {\n    /**\n     * Width of the dialog; `md` also places `AlertDialogMedia` next to the text on larger screens.\n     * @default 'md'\n     */\n    size?: 'sm' | 'md'\n  }\n\nexport type AlertDialogHeaderProps = React.ComponentProps<'div'>\n\nexport type AlertDialogFooterProps = React.ComponentProps<'div'>\n\nexport type AlertDialogMediaProps = React.ComponentProps<'div'>\n\nexport type AlertDialogTitleProps = AsChildPrimitiveProps<typeof AlertDialogPrimitive.Title>\n\nexport type AlertDialogDescriptionProps = AsChildPrimitiveProps<typeof AlertDialogPrimitive.Description>\n\nexport type AlertDialogActionProps = Omit<AsChildPrimitiveProps<typeof AlertDialogPrimitive.Close>, 'className'> &\n  Pick<React.ComponentProps<typeof Button>, 'className' | 'variant' | 'color' | 'size'>\n\nexport type AlertDialogCancelProps = Omit<AsChildPrimitiveProps<typeof AlertDialogPrimitive.Close>, 'className'> &\n  Pick<React.ComponentProps<typeof Button>, 'className' | 'variant' | 'color' | 'size'>\n\nfunction AlertDialog({ ...props }: AlertDialogProps) {\n  return <AlertDialogPrimitive.Root data-slot=\"alert-dialog\" {...props} />\n}\n\nfunction AlertDialogTrigger({ asChild, children, ...props }: AlertDialogTriggerProps) {\n  return (\n    <AlertDialogPrimitive.Trigger\n      data-slot=\"alert-dialog-trigger\"\n      {...props}\n      {...toAsChildRenderProps(asChild, children)}\n    />\n  )\n}\n\nfunction AlertDialogPortal({ ...props }: AlertDialogPortalProps) {\n  return <AlertDialogPrimitive.Portal data-slot=\"alert-dialog-portal\" {...props} />\n}\n\nfunction AlertDialogOverlay({ className, asChild, children, ...props }: AlertDialogOverlayProps) {\n  return (\n    <AlertDialogPrimitive.Backdrop\n      data-slot=\"alert-dialog-overlay\"\n      className={(state) =>\n        cn(\n          'fixed inset-0 z-50 bg-black/10 duration-100 supports-backdrop-filter:backdrop-blur-xs data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0',\n          resolveClassName(className, state)\n        )\n      }\n      {...props}\n      {...toAsChildRenderProps(asChild, children)}\n    />\n  )\n}\n\nfunction AlertDialogContent({\n  className,\n  size = 'md',\n  keepMounted,\n  asChild,\n  children,\n  ...props\n}: AlertDialogContentProps) {\n  return (\n    <AlertDialogPortal keepMounted={keepMounted}>\n      <AlertDialogOverlay />\n      <AlertDialogPrimitive.Popup\n        data-slot=\"alert-dialog-content\"\n        data-size={size}\n        className={(state) =>\n          cn(\n            'group/alert-dialog-content fixed top-1/2 left-1/2 z-50 grid w-full -translate-x-1/2 -translate-y-1/2 gap-4 rounded-xl bg-background p-4 ring-1 ring-foreground/10 duration-100 outline-none data-[size=md]:max-w-xs data-[size=sm]:max-w-xs data-[size=md]:sm:max-w-sm data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95',\n            resolveClassName(className, state)\n          )\n        }\n        {...props}\n        {...toAsChildRenderProps(asChild, children)}\n      />\n    </AlertDialogPortal>\n  )\n}\n\nfunction AlertDialogHeader({ className, ...props }: AlertDialogHeaderProps) {\n  return (\n    <div\n      data-slot=\"alert-dialog-header\"\n      className={cn(\n        'grid grid-rows-[auto_1fr] place-items-center gap-1.5 text-center has-data-[slot=alert-dialog-media]:grid-rows-[auto_auto_1fr] has-data-[slot=alert-dialog-media]:gap-x-4 sm:group-data-[size=md]/alert-dialog-content:place-items-start sm:group-data-[size=md]/alert-dialog-content:text-left sm:group-data-[size=md]/alert-dialog-content:has-data-[slot=alert-dialog-media]:grid-rows-[auto_1fr]',\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction AlertDialogFooter({ className, ...props }: AlertDialogFooterProps) {\n  return (\n    <div\n      data-slot=\"alert-dialog-footer\"\n      className={cn(\n        '-mx-4 -mb-4 flex flex-col-reverse gap-2 rounded-b-xl border-t bg-muted/50 p-4 group-data-[size=sm]/alert-dialog-content:grid group-data-[size=sm]/alert-dialog-content:grid-cols-2 sm:flex-row sm:justify-end',\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction AlertDialogMedia({ className, ...props }: AlertDialogMediaProps) {\n  return (\n    <div\n      data-slot=\"alert-dialog-media\"\n      className={cn(\n        \"mb-2 inline-flex size-10 items-center justify-center rounded-md bg-muted sm:group-data-[size=md]/alert-dialog-content:row-span-2 *:[svg:not([class*='size-'])]:size-6\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction AlertDialogTitle({ className, asChild, children, ...props }: AlertDialogTitleProps) {\n  return (\n    <AlertDialogPrimitive.Title\n      data-slot=\"alert-dialog-title\"\n      className={(state) =>\n        cn(\n          'text-base font-medium sm:group-data-[size=md]/alert-dialog-content:group-has-data-[slot=alert-dialog-media]/alert-dialog-content:col-start-2',\n          resolveClassName(className, state)\n        )\n      }\n      {...props}\n      {...toAsChildRenderProps(asChild, children)}\n    />\n  )\n}\n\nfunction AlertDialogDescription({ className, asChild, children, ...props }: AlertDialogDescriptionProps) {\n  return (\n    <AlertDialogPrimitive.Description\n      data-slot=\"alert-dialog-description\"\n      className={(state) =>\n        cn(\n          'text-sm text-balance text-muted-foreground md:text-pretty *:[a]:underline *:[a]:underline-offset-3 *:[a]:hover:text-foreground',\n          resolveClassName(className, state)\n        )\n      }\n      {...props}\n      {...toAsChildRenderProps(asChild, children)}\n    />\n  )\n}\n\nfunction AlertDialogAction({\n  className,\n  variant = 'solid',\n  color = 'primary',\n  size = 'md',\n  asChild,\n  children,\n  ...props\n}: AlertDialogActionProps) {\n  const buttonProps = { variant, color, size, className: cn(className) }\n\n  // With `asChild`, the Button merges the close behavior into the consumer's element instead of a <button>.\n  return (\n    <AlertDialogPrimitive.Close\n      data-slot=\"alert-dialog-action\"\n      render={\n        asChild ? (\n          <Button {...buttonProps} asChild>\n            {children}\n          </Button>\n        ) : (\n          <Button {...buttonProps} />\n        )\n      }\n      {...props}\n    >\n      {asChild ? undefined : children}\n    </AlertDialogPrimitive.Close>\n  )\n}\n\nfunction AlertDialogCancel({\n  className,\n  variant = 'outline',\n  color = 'primary',\n  size = 'md',\n  asChild,\n  children,\n  ...props\n}: AlertDialogCancelProps) {\n  const buttonProps = { variant, color, size, className: cn(className) }\n\n  // With `asChild`, the Button merges the close behavior into the consumer's element instead of a <button>.\n  return (\n    <AlertDialogPrimitive.Close\n      data-slot=\"alert-dialog-cancel\"\n      render={\n        asChild ? (\n          <Button {...buttonProps} asChild>\n            {children}\n          </Button>\n        ) : (\n          <Button {...buttonProps} />\n        )\n      }\n      {...props}\n    >\n      {asChild ? undefined : children}\n    </AlertDialogPrimitive.Close>\n  )\n}\n\nexport {\n  AlertDialog,\n  AlertDialogAction,\n  AlertDialogCancel,\n  AlertDialogContent,\n  AlertDialogDescription,\n  AlertDialogFooter,\n  AlertDialogHeader,\n  AlertDialogMedia,\n  AlertDialogOverlay,\n  AlertDialogPortal,\n  AlertDialogTitle,\n  AlertDialogTrigger\n}\n"],"mappings":"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"}
+{"version":3,"file":"alert-dialog.js","names":["AlertDialogPrimitive","resolveClassName","AlertDialog$1","props","toAsChildRenderProps","asChild","children","cn","className","state","overlayProps","size","buttonProps","Button"],"sources":["../../src/components/alert-dialog.tsx"],"sourcesContent":["import type * as React from 'react'\n\nimport { AlertDialog as AlertDialogPrimitive } from '@base-ui/react/alert-dialog'\n\nimport { type AsChildPrimitiveProps, toAsChildRenderProps } from '../lib/as-child'\nimport { cn } from '../lib/utils'\nimport { resolveClassName } from '../utils/resolve-class-name'\nimport { Button } from './button'\n\nexport type AlertDialogProps = React.ComponentProps<typeof AlertDialogPrimitive.Root>\n\nexport type AlertDialogTriggerProps = AsChildPrimitiveProps<typeof AlertDialogPrimitive.Trigger>\n\nexport type AlertDialogPortalProps = React.ComponentProps<typeof AlertDialogPrimitive.Portal>\n\nexport type AlertDialogOverlayProps = AsChildPrimitiveProps<typeof AlertDialogPrimitive.Backdrop>\n\nexport type AlertDialogContentProps = AsChildPrimitiveProps<typeof AlertDialogPrimitive.Popup> &\n  Pick<AlertDialogPortalProps, 'keepMounted'> & {\n    /**\n     * Width of the dialog; `md` also places `AlertDialogMedia` next to the text on larger screens.\n     * @default 'md'\n     */\n    size?: 'sm' | 'md'\n    /** Props passed to the overlay rendered behind the dialog. */\n    overlayProps?: AlertDialogOverlayProps\n  }\n\nexport type AlertDialogHeaderProps = React.ComponentProps<'div'>\n\nexport type AlertDialogFooterProps = React.ComponentProps<'div'>\n\nexport type AlertDialogMediaProps = React.ComponentProps<'div'>\n\nexport type AlertDialogTitleProps = AsChildPrimitiveProps<typeof AlertDialogPrimitive.Title>\n\nexport type AlertDialogDescriptionProps = AsChildPrimitiveProps<typeof AlertDialogPrimitive.Description>\n\nexport type AlertDialogActionProps = Omit<AsChildPrimitiveProps<typeof AlertDialogPrimitive.Close>, 'className'> &\n  Pick<React.ComponentProps<typeof Button>, 'className' | 'variant' | 'color' | 'size'>\n\nexport type AlertDialogCancelProps = Omit<AsChildPrimitiveProps<typeof AlertDialogPrimitive.Close>, 'className'> &\n  Pick<React.ComponentProps<typeof Button>, 'className' | 'variant' | 'color' | 'size'>\n\nfunction AlertDialog({ ...props }: AlertDialogProps) {\n  return <AlertDialogPrimitive.Root data-slot=\"alert-dialog\" {...props} />\n}\n\nfunction AlertDialogTrigger({ asChild, children, ...props }: AlertDialogTriggerProps) {\n  return (\n    <AlertDialogPrimitive.Trigger\n      data-slot=\"alert-dialog-trigger\"\n      {...props}\n      {...toAsChildRenderProps(asChild, children)}\n    />\n  )\n}\n\nfunction AlertDialogPortal({ ...props }: AlertDialogPortalProps) {\n  return <AlertDialogPrimitive.Portal data-slot=\"alert-dialog-portal\" {...props} />\n}\n\nfunction AlertDialogOverlay({ className, forceRender = true, asChild, children, ...props }: AlertDialogOverlayProps) {\n  return (\n    <AlertDialogPrimitive.Backdrop\n      data-slot=\"alert-dialog-overlay\"\n      forceRender={forceRender}\n      className={(state) =>\n        cn(\n          'fixed inset-0 z-50 bg-black/10 duration-100 supports-backdrop-filter:backdrop-blur-xs data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0',\n          resolveClassName(className, state)\n        )\n      }\n      {...props}\n      {...toAsChildRenderProps(asChild, children)}\n    />\n  )\n}\n\nfunction AlertDialogContent({\n  className,\n  size = 'md',\n  overlayProps,\n  keepMounted,\n  asChild,\n  children,\n  ...props\n}: AlertDialogContentProps) {\n  return (\n    <AlertDialogPortal keepMounted={keepMounted}>\n      <AlertDialogOverlay {...overlayProps} />\n      <AlertDialogPrimitive.Popup\n        data-slot=\"alert-dialog-content\"\n        data-size={size}\n        className={(state) =>\n          cn(\n            'group/alert-dialog-content fixed top-1/2 left-1/2 z-50 grid w-full -translate-x-1/2 -translate-y-1/2 gap-4 rounded-xl bg-background p-4 ring-1 ring-foreground/10 duration-100 outline-none data-[size=md]:max-w-xs data-[size=sm]:max-w-xs data-[size=md]:sm:max-w-sm data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95',\n            resolveClassName(className, state)\n          )\n        }\n        {...props}\n        {...toAsChildRenderProps(asChild, children)}\n      />\n    </AlertDialogPortal>\n  )\n}\n\nfunction AlertDialogHeader({ className, ...props }: AlertDialogHeaderProps) {\n  return (\n    <div\n      data-slot=\"alert-dialog-header\"\n      className={cn(\n        'grid grid-rows-[auto_1fr] place-items-center gap-1.5 text-center has-data-[slot=alert-dialog-media]:grid-rows-[auto_auto_1fr] has-data-[slot=alert-dialog-media]:gap-x-4 sm:group-data-[size=md]/alert-dialog-content:place-items-start sm:group-data-[size=md]/alert-dialog-content:text-left sm:group-data-[size=md]/alert-dialog-content:has-data-[slot=alert-dialog-media]:grid-rows-[auto_1fr]',\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction AlertDialogFooter({ className, ...props }: AlertDialogFooterProps) {\n  return (\n    <div\n      data-slot=\"alert-dialog-footer\"\n      className={cn(\n        '-mx-4 -mb-4 flex flex-col-reverse gap-2 rounded-b-xl border-t bg-muted/50 p-4 group-data-[size=sm]/alert-dialog-content:grid group-data-[size=sm]/alert-dialog-content:grid-cols-2 sm:flex-row sm:justify-end',\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction AlertDialogMedia({ className, ...props }: AlertDialogMediaProps) {\n  return (\n    <div\n      data-slot=\"alert-dialog-media\"\n      className={cn(\n        \"mb-2 inline-flex size-10 items-center justify-center rounded-md bg-muted sm:group-data-[size=md]/alert-dialog-content:row-span-2 *:[svg:not([class*='size-'])]:size-6\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction AlertDialogTitle({ className, asChild, children, ...props }: AlertDialogTitleProps) {\n  return (\n    <AlertDialogPrimitive.Title\n      data-slot=\"alert-dialog-title\"\n      className={(state) =>\n        cn(\n          'text-base font-medium sm:group-data-[size=md]/alert-dialog-content:group-has-data-[slot=alert-dialog-media]/alert-dialog-content:col-start-2',\n          resolveClassName(className, state)\n        )\n      }\n      {...props}\n      {...toAsChildRenderProps(asChild, children)}\n    />\n  )\n}\n\nfunction AlertDialogDescription({ className, asChild, children, ...props }: AlertDialogDescriptionProps) {\n  return (\n    <AlertDialogPrimitive.Description\n      data-slot=\"alert-dialog-description\"\n      className={(state) =>\n        cn(\n          'text-sm text-balance text-muted-foreground md:text-pretty *:[a]:underline *:[a]:underline-offset-3 *:[a]:hover:text-foreground',\n          resolveClassName(className, state)\n        )\n      }\n      {...props}\n      {...toAsChildRenderProps(asChild, children)}\n    />\n  )\n}\n\nfunction AlertDialogAction({\n  className,\n  variant = 'solid',\n  color = 'primary',\n  size = 'md',\n  asChild,\n  children,\n  ...props\n}: AlertDialogActionProps) {\n  const buttonProps = { variant, color, size, className: cn(className) }\n\n  // With `asChild`, the Button merges the close behavior into the consumer's element instead of a <button>.\n  return (\n    <AlertDialogPrimitive.Close\n      data-slot=\"alert-dialog-action\"\n      render={\n        asChild ? (\n          <Button {...buttonProps} asChild>\n            {children}\n          </Button>\n        ) : (\n          <Button {...buttonProps} />\n        )\n      }\n      {...props}\n    >\n      {asChild ? undefined : children}\n    </AlertDialogPrimitive.Close>\n  )\n}\n\nfunction AlertDialogCancel({\n  className,\n  variant = 'outline',\n  color = 'primary',\n  size = 'md',\n  asChild,\n  children,\n  ...props\n}: AlertDialogCancelProps) {\n  const buttonProps = { variant, color, size, className: cn(className) }\n\n  // With `asChild`, the Button merges the close behavior into the consumer's element instead of a <button>.\n  return (\n    <AlertDialogPrimitive.Close\n      data-slot=\"alert-dialog-cancel\"\n      render={\n        asChild ? (\n          <Button {...buttonProps} asChild>\n            {children}\n          </Button>\n        ) : (\n          <Button {...buttonProps} />\n        )\n      }\n      {...props}\n    >\n      {asChild ? undefined : children}\n    </AlertDialogPrimitive.Close>\n  )\n}\n\nexport {\n  AlertDialog,\n  AlertDialogAction,\n  AlertDialogCancel,\n  AlertDialogContent,\n  AlertDialogDescription,\n  AlertDialogFooter,\n  AlertDialogHeader,\n  AlertDialogMedia,\n  AlertDialogOverlay,\n  AlertDialogPortal,\n  AlertDialogTitle,\n  AlertDialogTrigger\n}\n"],"mappings":"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"}

package/dist/components/dialog.d.ts

@@ -32,6 +32,8 @@ export type DialogContentProps = AsChildPrimitiveProps<typeof Dialog$1.Popup> &
   showCloseButton?: boolean;
   /** Ref to the overlay element rendered behind the dialog. */
   overlayRef?: React.Ref<HTMLDivElement>;
+  /** Props passed to the overlay rendered behind the dialog. */
+  overlayProps?: DialogOverlayProps;
 };
 export type DialogHeaderProps = React.ComponentProps<'div'>;
 export type DialogBodyProps = React.ComponentProps<'div'>;
@@ -48,8 +50,8 @@ declare function Dialog({ size, dismissible, disablePointerDismissal, onOpenChan
 declare function DialogTrigger({ asChild, children, ...props }: DialogTriggerProps): React.JSX.Element;
 declare function DialogPortal({ ...props }: DialogPortalProps): React.JSX.Element;
 declare function DialogClose({ asChild, children, ...props }: DialogCloseProps): React.JSX.Element;
-declare function DialogOverlay({ className, onClick, asChild, children, ...props }: DialogOverlayProps): React.JSX.Element;
-declare function DialogContent({ className, children, showCloseButton, overlayRef, keepMounted, asChild, ...props }: DialogContentProps): React.JSX.Element;
+declare function DialogOverlay({ className, onClick, forceRender, asChild, children, ...props }: DialogOverlayProps): React.JSX.Element;
+declare function DialogContent({ className, children, showCloseButton, overlayRef, overlayProps, keepMounted, asChild, ...props }: DialogContentProps): React.JSX.Element;
 declare function DialogHeader({ className, ...props }: DialogHeaderProps): React.JSX.Element;
 declare function DialogBody({ className, ...props }: DialogBodyProps): React.JSX.Element;
 declare function DialogFooter({ className, showCloseButton, children, ...props }: DialogFooterProps): React.JSX.Element;

package/dist/components/dialog.js

@@ -1,2 +1,2 @@
-import"../rolldown-runtime-BhWHdk3m.js";import{toAsChildRenderProps as e}from"../lib/as-child.js";import{cn as t,stopPropagationHandler as n}from"../lib/utils.js";import{t as r}from"../resolve-class-name-BurP8ngI.js";import{Button as i}from"./button.js";import{IconX as a}from"@tabler/icons-react";import*as o from"react";import{jsx as s,jsxs as c}from"react/jsx-runtime";import{cva as l}from"class-variance-authority";import{Dialog as u}from"@base-ui/react/dialog";const d=l([`bg-background ring-foreground/10 fixed top-1/2 left-1/2 z-50 w-full -translate-x-1/2 -translate-y-1/2 outline-none`,`flex flex-col gap-4 rounded-xl p-4 text-sm ring-1 duration-100`,`max-w-[calc(100%-2rem)] max-h-[calc(100dvh-2rem)] overflow-hidden`,`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`],{variants:{size:{sm:`sm:max-w-sm`,md:`sm:max-w-md`,lg:`sm:max-w-lg`,xl:`sm:max-w-xl`,"2xl":`sm:max-w-2xl`,"3xl":`sm:max-w-3xl`,full:`w-screen h-screen max-w-none max-h-screen rounded-none sm:max-w-none`}},defaultVariants:{size:`md`}}),f=o.createContext({size:`md`});function Dialog({size:e=`md`,dismissible:t=!0,disablePointerDismissal:n,onOpenChange:r,...i}){let a=o.useMemo(()=>({size:e}),[e]);return/* @__PURE__ */ s(f.Provider,{value:a,children:/* @__PURE__ */ s(u.Root,{"data-slot":`dialog`,disablePointerDismissal:!t||n,onOpenChange:(e,n)=>{!t&&n.reason===`escape-key`?n.cancel():r?.(e,n)},...i})})}function DialogTrigger({asChild:t,children:n,...r}){return/* @__PURE__ */ s(u.Trigger,{"data-slot":`dialog-trigger`,...r,...e(t,n)})}function DialogPortal({...e}){return/* @__PURE__ */ s(u.Portal,{"data-slot":`dialog-portal`,...e})}function DialogClose({asChild:t,children:n,...r}){return/* @__PURE__ */ s(u.Close,{"data-slot":`dialog-close`,...r,...e(t,n)})}function DialogOverlay({className:i,onClick:a,asChild:o,children:c,...l}){return/* @__PURE__ */ s(u.Backdrop,{"data-slot":`dialog-overlay`,className:e=>t(`bg-black/10 fixed inset-0 isolate z-50`,`data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0`,`duration-100 supports-backdrop-filter:backdrop-blur-xs`,r(i,e)),onClick:n(a),...l,...e(o,c)})}function DialogContent({className:l,children:p,showCloseButton:m=!0,overlayRef:h,keepMounted:g,asChild:_,...v}){let{size:y}=o.useContext(f);return/* @__PURE__ */ c(DialogPortal,{keepMounted:g,children:[/* @__PURE__ */ s(DialogOverlay,{ref:h}),/* @__PURE__ */ c(u.Popup,{"data-slot":`dialog-content`,className:e=>t(d({size:y}),r(l,e)),...v,...e(_,p),onClick:n(v.onClick),onSubmit:n(v.onSubmit),children:[!_&&p,m&&!_&&/* @__PURE__ */ c(u.Close,{"data-slot":`dialog-close`,render:/* @__PURE__ */ s(i,{variant:`ghost`,className:`absolute top-2 right-2`,size:`icon-sm`}),children:[/* @__PURE__ */ s(a,{}),/* @__PURE__ */ s(`span`,{className:`sr-only`,children:`Close`})]})]})]})}function DialogHeader({className:e,...n}){return/* @__PURE__ */ s(`div`,{"data-slot":`dialog-header`,className:t(`gap-2 flex flex-col shrink-0`,e),...n})}function DialogBody({className:e,...n}){return/* @__PURE__ */ s(`div`,{"data-slot":`dialog-body`,className:t(`-mx-4 px-4 flex-1 overflow-y-auto`,e),...n})}function DialogFooter({className:e,showCloseButton:n=!1,children:r,...a}){return/* @__PURE__ */ c(`div`,{"data-slot":`dialog-footer`,className:t(`bg-muted/50 -mx-4 -mb-4 rounded-b-xl border-t p-4 shrink-0`,`flex flex-col-reverse gap-2 sm:flex-row sm:justify-end`,e),...a,children:[r,n&&/* @__PURE__ */ s(u.Close,{render:/* @__PURE__ */ s(i,{variant:`outline`}),children:`Close`})]})}function DialogTitle({className:n,asChild:i,children:a,...o}){return/* @__PURE__ */ s(u.Title,{"data-slot":`dialog-title`,className:e=>t(`text-base leading-none font-medium`,r(n,e)),...o,...e(i,a)})}function DialogDescription({className:n,asChild:i,children:a,...o}){return/* @__PURE__ */ s(u.Description,{"data-slot":`dialog-description`,className:e=>t(`text-muted-foreground text-sm`,`*:[a]:underline *:[a]:underline-offset-3 *:[a]:hover:text-foreground`,r(n,e)),...o,...e(i,a)})}export{Dialog,DialogBody,DialogClose,DialogContent,DialogDescription,DialogFooter,DialogHeader,DialogOverlay,DialogPortal,DialogTitle,DialogTrigger};
+import"../rolldown-runtime-BhWHdk3m.js";import{toAsChildRenderProps as e}from"../lib/as-child.js";import{cn as t,stopPropagationHandler as n}from"../lib/utils.js";import{t as r}from"../resolve-class-name-BurP8ngI.js";import{Button as i}from"./button.js";import{IconX as a}from"@tabler/icons-react";import*as o from"react";import{jsx as s,jsxs as c}from"react/jsx-runtime";import{cva as l}from"class-variance-authority";import{Dialog as u}from"@base-ui/react/dialog";const d=l([`bg-background ring-foreground/10 fixed top-1/2 left-1/2 z-50 w-full -translate-x-1/2 -translate-y-1/2 outline-none`,`flex flex-col gap-4 rounded-xl p-4 text-sm ring-1 duration-100`,`max-w-[calc(100%-2rem)] max-h-[calc(100dvh-2rem)] overflow-hidden`,`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`],{variants:{size:{sm:`sm:max-w-sm`,md:`sm:max-w-md`,lg:`sm:max-w-lg`,xl:`sm:max-w-xl`,"2xl":`sm:max-w-2xl`,"3xl":`sm:max-w-3xl`,full:`w-screen h-screen max-w-none max-h-screen rounded-none sm:max-w-none`}},defaultVariants:{size:`md`}}),f=o.createContext({size:`md`});function Dialog({size:e=`md`,dismissible:t=!0,disablePointerDismissal:n,onOpenChange:r,...i}){let a=o.useMemo(()=>({size:e}),[e]);return/* @__PURE__ */ s(f.Provider,{value:a,children:/* @__PURE__ */ s(u.Root,{"data-slot":`dialog`,disablePointerDismissal:!t||n,onOpenChange:(e,n)=>{!t&&n.reason===`escape-key`?n.cancel():r?.(e,n)},...i})})}function DialogTrigger({asChild:t,children:n,...r}){return/* @__PURE__ */ s(u.Trigger,{"data-slot":`dialog-trigger`,...r,...e(t,n)})}function DialogPortal({...e}){return/* @__PURE__ */ s(u.Portal,{"data-slot":`dialog-portal`,...e})}function DialogClose({asChild:t,children:n,...r}){return/* @__PURE__ */ s(u.Close,{"data-slot":`dialog-close`,...r,...e(t,n)})}function DialogOverlay({className:i,onClick:a,forceRender:o=!0,asChild:c,children:l,...d}){return/* @__PURE__ */ s(u.Backdrop,{"data-slot":`dialog-overlay`,forceRender:o,className:e=>t(`bg-black/10 fixed inset-0 isolate z-50`,`data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0`,`duration-100 supports-backdrop-filter:backdrop-blur-xs`,r(i,e)),onClick:n(a),...d,...e(c,l)})}function DialogContent({className:l,children:p,showCloseButton:m=!0,overlayRef:h,overlayProps:g,keepMounted:_,asChild:v,...y}){let{size:b}=o.useContext(f);return/* @__PURE__ */ c(DialogPortal,{keepMounted:_,children:[/* @__PURE__ */ s(DialogOverlay,{...g,ref:h??g?.ref}),/* @__PURE__ */ c(u.Popup,{"data-slot":`dialog-content`,className:e=>t(d({size:b}),r(l,e)),...y,...e(v,p),onClick:n(y.onClick),onSubmit:n(y.onSubmit),children:[!v&&p,m&&!v&&/* @__PURE__ */ c(u.Close,{"data-slot":`dialog-close`,render:/* @__PURE__ */ s(i,{variant:`ghost`,className:`absolute top-2 right-2`,size:`icon-sm`}),children:[/* @__PURE__ */ s(a,{}),/* @__PURE__ */ s(`span`,{className:`sr-only`,children:`Close`})]})]})]})}function DialogHeader({className:e,...n}){return/* @__PURE__ */ s(`div`,{"data-slot":`dialog-header`,className:t(`gap-2 flex flex-col shrink-0`,e),...n})}function DialogBody({className:e,...n}){return/* @__PURE__ */ s(`div`,{"data-slot":`dialog-body`,className:t(`-mx-4 px-4 flex-1 overflow-y-auto`,e),...n})}function DialogFooter({className:e,showCloseButton:n=!1,children:r,...a}){return/* @__PURE__ */ c(`div`,{"data-slot":`dialog-footer`,className:t(`bg-muted/50 -mx-4 -mb-4 rounded-b-xl border-t p-4 shrink-0`,`flex flex-col-reverse gap-2 sm:flex-row sm:justify-end`,e),...a,children:[r,n&&/* @__PURE__ */ s(u.Close,{render:/* @__PURE__ */ s(i,{variant:`outline`}),children:`Close`})]})}function DialogTitle({className:n,asChild:i,children:a,...o}){return/* @__PURE__ */ s(u.Title,{"data-slot":`dialog-title`,className:e=>t(`text-base leading-none font-medium`,r(n,e)),...o,...e(i,a)})}function DialogDescription({className:n,asChild:i,children:a,...o}){return/* @__PURE__ */ s(u.Description,{"data-slot":`dialog-description`,className:e=>t(`text-muted-foreground text-sm`,`*:[a]:underline *:[a]:underline-offset-3 *:[a]:hover:text-foreground`,r(n,e)),...o,...e(i,a)})}export{Dialog,DialogBody,DialogClose,DialogContent,DialogDescription,DialogFooter,DialogHeader,DialogOverlay,DialogPortal,DialogTitle,DialogTrigger};
 //# sourceMappingURL=dialog.js.map

package/dist/components/dialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"dialog.js","names":["DialogPrimitive","resolveClassName","React","Dialog$1","dialogContentVariants","cva","DialogContext","props","contextValue","size","dismissible","disablePointerDismissal","eventDetails","onOpenChange","open","toAsChildRenderProps","asChild","children","cn","className","state","stopPropagationHandler","onClick","overlayRef","showCloseButton","Button","IconX"],"sources":["../../src/components/dialog.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Dialog as DialogPrimitive } from '@base-ui/react/dialog'\nimport { IconX } from '@tabler/icons-react'\nimport { cva, type VariantProps } from 'class-variance-authority'\n\nimport { type AsChildPrimitiveProps, toAsChildRenderProps } from '../lib/as-child'\nimport { cn, stopPropagationHandler } from '../lib/utils'\nimport { resolveClassName } from '../utils/resolve-class-name'\nimport { Button } from './button'\n\nconst dialogContentVariants = cva(\n  [\n    'bg-background ring-foreground/10 fixed top-1/2 left-1/2 z-50 w-full -translate-x-1/2 -translate-y-1/2 outline-none',\n    'flex flex-col gap-4 rounded-xl p-4 text-sm ring-1 duration-100',\n    'max-w-[calc(100%-2rem)] max-h-[calc(100dvh-2rem)] overflow-hidden',\n    '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'\n  ],\n  {\n    variants: {\n      size: {\n        sm: 'sm:max-w-sm',\n        md: 'sm:max-w-md',\n        lg: 'sm:max-w-lg',\n        xl: 'sm:max-w-xl',\n        '2xl': 'sm:max-w-2xl',\n        '3xl': 'sm:max-w-3xl',\n        full: 'w-screen h-screen max-w-none max-h-screen rounded-none sm:max-w-none'\n      }\n    },\n    defaultVariants: {\n      size: 'md'\n    }\n  }\n)\n\ntype DialogSize = NonNullable<VariantProps<typeof dialogContentVariants>['size']>\ntype DialogContextValue = { size: DialogSize }\nconst DialogContext = React.createContext<DialogContextValue>({ size: 'md' })\n\nexport type DialogProps = React.ComponentProps<typeof DialogPrimitive.Root> & {\n  /**\n   * Dialog width. `full` fills the whole viewport.\n   * @default 'md'\n   */\n  size?: DialogSize\n  /**\n   * When `false`, clicking outside and pressing Esc no longer close the dialog. The close button and `DialogClose` still work.\n   * @default true\n   */\n  dismissible?: boolean\n}\nexport type DialogTriggerProps = AsChildPrimitiveProps<typeof DialogPrimitive.Trigger>\nexport type DialogPortalProps = React.ComponentProps<typeof DialogPrimitive.Portal>\nexport type DialogCloseProps = AsChildPrimitiveProps<typeof DialogPrimitive.Close>\nexport type DialogOverlayProps = AsChildPrimitiveProps<typeof DialogPrimitive.Backdrop>\nexport type DialogContentProps = AsChildPrimitiveProps<typeof DialogPrimitive.Popup> &\n  Pick<DialogPortalProps, 'keepMounted'> & {\n    /**\n     * Shows the X button in the top-right corner.\n     * @default true\n     */\n    showCloseButton?: boolean\n    /** Ref to the overlay element rendered behind the dialog. */\n    overlayRef?: React.Ref<HTMLDivElement>\n  }\nexport type DialogHeaderProps = React.ComponentProps<'div'>\nexport type DialogBodyProps = React.ComponentProps<'div'>\nexport type DialogFooterProps = React.ComponentProps<'div'> & {\n  /**\n   * Adds an outline \"Close\" button after the footer actions.\n   * @default false\n   */\n  showCloseButton?: boolean\n}\nexport type DialogTitleProps = AsChildPrimitiveProps<typeof DialogPrimitive.Title>\nexport type DialogDescriptionProps = AsChildPrimitiveProps<typeof DialogPrimitive.Description>\n\nfunction Dialog({ size = 'md', dismissible = true, disablePointerDismissal, onOpenChange, ...props }: DialogProps) {\n  const contextValue = React.useMemo<DialogContextValue>(() => ({ size }), [size])\n\n  return (\n    <DialogContext.Provider value={contextValue}>\n      <DialogPrimitive.Root\n        data-slot=\"dialog\"\n        disablePointerDismissal={!dismissible || disablePointerDismissal}\n        onOpenChange={(open, eventDetails) => {\n          if (!dismissible && eventDetails.reason === 'escape-key') {\n            eventDetails.cancel()\n            return\n          }\n          onOpenChange?.(open, eventDetails)\n        }}\n        {...props}\n      />\n    </DialogContext.Provider>\n  )\n}\n\nfunction DialogTrigger({ asChild, children, ...props }: DialogTriggerProps) {\n  return <DialogPrimitive.Trigger data-slot=\"dialog-trigger\" {...props} {...toAsChildRenderProps(asChild, children)} />\n}\n\nfunction DialogPortal({ ...props }: DialogPortalProps) {\n  return <DialogPrimitive.Portal data-slot=\"dialog-portal\" {...props} />\n}\n\nfunction DialogClose({ asChild, children, ...props }: DialogCloseProps) {\n  return <DialogPrimitive.Close data-slot=\"dialog-close\" {...props} {...toAsChildRenderProps(asChild, children)} />\n}\n\nfunction DialogOverlay({ className, onClick, asChild, children, ...props }: DialogOverlayProps) {\n  return (\n    <DialogPrimitive.Backdrop\n      data-slot=\"dialog-overlay\"\n      className={(state) =>\n        cn(\n          'bg-black/10 fixed inset-0 isolate z-50',\n          'data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0',\n          'duration-100 supports-backdrop-filter:backdrop-blur-xs',\n          resolveClassName(className, state)\n        )\n      }\n      onClick={stopPropagationHandler(onClick)}\n      {...props}\n      {...toAsChildRenderProps(asChild, children)}\n    />\n  )\n}\n\nfunction DialogContent({\n  className,\n  children,\n  showCloseButton = true,\n  overlayRef,\n  keepMounted,\n  asChild,\n  ...props\n}: DialogContentProps) {\n  const { size } = React.useContext(DialogContext)\n\n  return (\n    <DialogPortal keepMounted={keepMounted}>\n      <DialogOverlay ref={overlayRef} />\n      <DialogPrimitive.Popup\n        data-slot=\"dialog-content\"\n        className={(state) => cn(dialogContentVariants({ size }), resolveClassName(className, state))}\n        {...props}\n        {...toAsChildRenderProps(asChild, children)}\n        // React events bubble through the fiber tree, not the DOM, so a portaled Popup still\n        // reaches any ancestor's onClick/onSubmit even though it renders outside it in the DOM.\n        onClick={stopPropagationHandler(props.onClick)}\n        onSubmit={stopPropagationHandler(props.onSubmit)}\n      >\n        {!asChild && children}\n        {showCloseButton && !asChild && (\n          <DialogPrimitive.Close\n            data-slot=\"dialog-close\"\n            render={<Button variant=\"ghost\" className=\"absolute top-2 right-2\" size=\"icon-sm\" />}\n          >\n            <IconX />\n            <span className=\"sr-only\">Close</span>\n          </DialogPrimitive.Close>\n        )}\n      </DialogPrimitive.Popup>\n    </DialogPortal>\n  )\n}\n\nfunction DialogHeader({ className, ...props }: DialogHeaderProps) {\n  return <div data-slot=\"dialog-header\" className={cn('gap-2 flex flex-col shrink-0', className)} {...props} />\n}\n\nfunction DialogBody({ className, ...props }: DialogBodyProps) {\n  return <div data-slot=\"dialog-body\" className={cn('-mx-4 px-4 flex-1 overflow-y-auto', className)} {...props} />\n}\n\nfunction DialogFooter({ className, showCloseButton = false, children, ...props }: DialogFooterProps) {\n  return (\n    <div\n      data-slot=\"dialog-footer\"\n      className={cn(\n        'bg-muted/50 -mx-4 -mb-4 rounded-b-xl border-t p-4 shrink-0',\n        'flex flex-col-reverse gap-2 sm:flex-row sm:justify-end',\n        className\n      )}\n      {...props}\n    >\n      {children}\n      {showCloseButton && <DialogPrimitive.Close render={<Button variant=\"outline\" />}>Close</DialogPrimitive.Close>}\n    </div>\n  )\n}\n\nfunction DialogTitle({ className, asChild, children, ...props }: DialogTitleProps) {\n  return (\n    <DialogPrimitive.Title\n      data-slot=\"dialog-title\"\n      className={(state) => cn('text-base leading-none font-medium', resolveClassName(className, state))}\n      {...props}\n      {...toAsChildRenderProps(asChild, children)}\n    />\n  )\n}\n\nfunction DialogDescription({ className, asChild, children, ...props }: DialogDescriptionProps) {\n  return (\n    <DialogPrimitive.Description\n      data-slot=\"dialog-description\"\n      className={(state) =>\n        cn(\n          'text-muted-foreground text-sm',\n          '*:[a]:underline *:[a]:underline-offset-3 *:[a]:hover:text-foreground',\n          resolveClassName(className, state)\n        )\n      }\n      {...props}\n      {...toAsChildRenderProps(asChild, children)}\n    />\n  )\n}\n\nexport {\n  Dialog,\n  DialogBody,\n  DialogClose,\n  DialogContent,\n  DialogDescription,\n  DialogFooter,\n  DialogHeader,\n  DialogOverlay,\n  DialogPortal,\n  DialogTitle,\n  DialogTrigger\n}\n"],"mappings":"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"}
+{"version":3,"file":"dialog.js","names":["DialogPrimitive","resolveClassName","React","Dialog$1","dialogContentVariants","cva","DialogContext","props","contextValue","size","dismissible","disablePointerDismissal","eventDetails","onOpenChange","open","toAsChildRenderProps","asChild","children","cn","className","state","stopPropagationHandler","onClick","overlayProps","overlayRef","showCloseButton","Button","IconX"],"sources":["../../src/components/dialog.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Dialog as DialogPrimitive } from '@base-ui/react/dialog'\nimport { IconX } from '@tabler/icons-react'\nimport { cva, type VariantProps } from 'class-variance-authority'\n\nimport { type AsChildPrimitiveProps, toAsChildRenderProps } from '../lib/as-child'\nimport { cn, stopPropagationHandler } from '../lib/utils'\nimport { resolveClassName } from '../utils/resolve-class-name'\nimport { Button } from './button'\n\nconst dialogContentVariants = cva(\n  [\n    'bg-background ring-foreground/10 fixed top-1/2 left-1/2 z-50 w-full -translate-x-1/2 -translate-y-1/2 outline-none',\n    'flex flex-col gap-4 rounded-xl p-4 text-sm ring-1 duration-100',\n    'max-w-[calc(100%-2rem)] max-h-[calc(100dvh-2rem)] overflow-hidden',\n    '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'\n  ],\n  {\n    variants: {\n      size: {\n        sm: 'sm:max-w-sm',\n        md: 'sm:max-w-md',\n        lg: 'sm:max-w-lg',\n        xl: 'sm:max-w-xl',\n        '2xl': 'sm:max-w-2xl',\n        '3xl': 'sm:max-w-3xl',\n        full: 'w-screen h-screen max-w-none max-h-screen rounded-none sm:max-w-none'\n      }\n    },\n    defaultVariants: {\n      size: 'md'\n    }\n  }\n)\n\ntype DialogSize = NonNullable<VariantProps<typeof dialogContentVariants>['size']>\ntype DialogContextValue = { size: DialogSize }\nconst DialogContext = React.createContext<DialogContextValue>({ size: 'md' })\n\nexport type DialogProps = React.ComponentProps<typeof DialogPrimitive.Root> & {\n  /**\n   * Dialog width. `full` fills the whole viewport.\n   * @default 'md'\n   */\n  size?: DialogSize\n  /**\n   * When `false`, clicking outside and pressing Esc no longer close the dialog. The close button and `DialogClose` still work.\n   * @default true\n   */\n  dismissible?: boolean\n}\nexport type DialogTriggerProps = AsChildPrimitiveProps<typeof DialogPrimitive.Trigger>\nexport type DialogPortalProps = React.ComponentProps<typeof DialogPrimitive.Portal>\nexport type DialogCloseProps = AsChildPrimitiveProps<typeof DialogPrimitive.Close>\nexport type DialogOverlayProps = AsChildPrimitiveProps<typeof DialogPrimitive.Backdrop>\nexport type DialogContentProps = AsChildPrimitiveProps<typeof DialogPrimitive.Popup> &\n  Pick<DialogPortalProps, 'keepMounted'> & {\n    /**\n     * Shows the X button in the top-right corner.\n     * @default true\n     */\n    showCloseButton?: boolean\n    /** Ref to the overlay element rendered behind the dialog. */\n    overlayRef?: React.Ref<HTMLDivElement>\n    /** Props passed to the overlay rendered behind the dialog. */\n    overlayProps?: DialogOverlayProps\n  }\nexport type DialogHeaderProps = React.ComponentProps<'div'>\nexport type DialogBodyProps = React.ComponentProps<'div'>\nexport type DialogFooterProps = React.ComponentProps<'div'> & {\n  /**\n   * Adds an outline \"Close\" button after the footer actions.\n   * @default false\n   */\n  showCloseButton?: boolean\n}\nexport type DialogTitleProps = AsChildPrimitiveProps<typeof DialogPrimitive.Title>\nexport type DialogDescriptionProps = AsChildPrimitiveProps<typeof DialogPrimitive.Description>\n\nfunction Dialog({ size = 'md', dismissible = true, disablePointerDismissal, onOpenChange, ...props }: DialogProps) {\n  const contextValue = React.useMemo<DialogContextValue>(() => ({ size }), [size])\n\n  return (\n    <DialogContext.Provider value={contextValue}>\n      <DialogPrimitive.Root\n        data-slot=\"dialog\"\n        disablePointerDismissal={!dismissible || disablePointerDismissal}\n        onOpenChange={(open, eventDetails) => {\n          if (!dismissible && eventDetails.reason === 'escape-key') {\n            eventDetails.cancel()\n            return\n          }\n          onOpenChange?.(open, eventDetails)\n        }}\n        {...props}\n      />\n    </DialogContext.Provider>\n  )\n}\n\nfunction DialogTrigger({ asChild, children, ...props }: DialogTriggerProps) {\n  return <DialogPrimitive.Trigger data-slot=\"dialog-trigger\" {...props} {...toAsChildRenderProps(asChild, children)} />\n}\n\nfunction DialogPortal({ ...props }: DialogPortalProps) {\n  return <DialogPrimitive.Portal data-slot=\"dialog-portal\" {...props} />\n}\n\nfunction DialogClose({ asChild, children, ...props }: DialogCloseProps) {\n  return <DialogPrimitive.Close data-slot=\"dialog-close\" {...props} {...toAsChildRenderProps(asChild, children)} />\n}\n\nfunction DialogOverlay({ className, onClick, forceRender = true, asChild, children, ...props }: DialogOverlayProps) {\n  return (\n    <DialogPrimitive.Backdrop\n      data-slot=\"dialog-overlay\"\n      forceRender={forceRender}\n      className={(state) =>\n        cn(\n          'bg-black/10 fixed inset-0 isolate z-50',\n          'data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0',\n          'duration-100 supports-backdrop-filter:backdrop-blur-xs',\n          resolveClassName(className, state)\n        )\n      }\n      onClick={stopPropagationHandler(onClick)}\n      {...props}\n      {...toAsChildRenderProps(asChild, children)}\n    />\n  )\n}\n\nfunction DialogContent({\n  className,\n  children,\n  showCloseButton = true,\n  overlayRef,\n  overlayProps,\n  keepMounted,\n  asChild,\n  ...props\n}: DialogContentProps) {\n  const { size } = React.useContext(DialogContext)\n\n  return (\n    <DialogPortal keepMounted={keepMounted}>\n      <DialogOverlay {...overlayProps} ref={overlayRef ?? overlayProps?.ref} />\n      <DialogPrimitive.Popup\n        data-slot=\"dialog-content\"\n        className={(state) => cn(dialogContentVariants({ size }), resolveClassName(className, state))}\n        {...props}\n        {...toAsChildRenderProps(asChild, children)}\n        // React events bubble through the fiber tree, not the DOM, so a portaled Popup still\n        // reaches any ancestor's onClick/onSubmit even though it renders outside it in the DOM.\n        onClick={stopPropagationHandler(props.onClick)}\n        onSubmit={stopPropagationHandler(props.onSubmit)}\n      >\n        {!asChild && children}\n        {showCloseButton && !asChild && (\n          <DialogPrimitive.Close\n            data-slot=\"dialog-close\"\n            render={<Button variant=\"ghost\" className=\"absolute top-2 right-2\" size=\"icon-sm\" />}\n          >\n            <IconX />\n            <span className=\"sr-only\">Close</span>\n          </DialogPrimitive.Close>\n        )}\n      </DialogPrimitive.Popup>\n    </DialogPortal>\n  )\n}\n\nfunction DialogHeader({ className, ...props }: DialogHeaderProps) {\n  return <div data-slot=\"dialog-header\" className={cn('gap-2 flex flex-col shrink-0', className)} {...props} />\n}\n\nfunction DialogBody({ className, ...props }: DialogBodyProps) {\n  return <div data-slot=\"dialog-body\" className={cn('-mx-4 px-4 flex-1 overflow-y-auto', className)} {...props} />\n}\n\nfunction DialogFooter({ className, showCloseButton = false, children, ...props }: DialogFooterProps) {\n  return (\n    <div\n      data-slot=\"dialog-footer\"\n      className={cn(\n        'bg-muted/50 -mx-4 -mb-4 rounded-b-xl border-t p-4 shrink-0',\n        'flex flex-col-reverse gap-2 sm:flex-row sm:justify-end',\n        className\n      )}\n      {...props}\n    >\n      {children}\n      {showCloseButton && <DialogPrimitive.Close render={<Button variant=\"outline\" />}>Close</DialogPrimitive.Close>}\n    </div>\n  )\n}\n\nfunction DialogTitle({ className, asChild, children, ...props }: DialogTitleProps) {\n  return (\n    <DialogPrimitive.Title\n      data-slot=\"dialog-title\"\n      className={(state) => cn('text-base leading-none font-medium', resolveClassName(className, state))}\n      {...props}\n      {...toAsChildRenderProps(asChild, children)}\n    />\n  )\n}\n\nfunction DialogDescription({ className, asChild, children, ...props }: DialogDescriptionProps) {\n  return (\n    <DialogPrimitive.Description\n      data-slot=\"dialog-description\"\n      className={(state) =>\n        cn(\n          'text-muted-foreground text-sm',\n          '*:[a]:underline *:[a]:underline-offset-3 *:[a]:hover:text-foreground',\n          resolveClassName(className, state)\n        )\n      }\n      {...props}\n      {...toAsChildRenderProps(asChild, children)}\n    />\n  )\n}\n\nexport {\n  Dialog,\n  DialogBody,\n  DialogClose,\n  DialogContent,\n  DialogDescription,\n  DialogFooter,\n  DialogHeader,\n  DialogOverlay,\n  DialogPortal,\n  DialogTitle,\n  DialogTrigger\n}\n"],"mappings":"kdAWA,MAAMI,EAAwBC,EAC5B,CACE,qHACA,iEACA,oEACA,sIACF,EACA,CACE,SAAU,CACR,KAAM,CACJ,GAAI,cACJ,GAAI,cACJ,GAAI,cACJ,GAAI,cACJ,MAAO,eACP,MAAO,eACP,KAAM,sEACR,CACF,EACA,gBAAiB,CACf,KAAM,IACR,CACF,CACF,EAIMC,EAAgBJ,EAAM,cAAkC,CAAE,KAAM,IAAK,CAAC,EA0C5E,SAAS,OAAO,CAAE,OAAO,KAAM,cAAc,GAAM,0BAAyB,eAAc,GAAGK,GAAsB,CACjH,IAAMC,EAAeN,EAAM,aAAmC,CAAE,MAAK,GAAI,CAACO,CAAI,CAAC,EAE/E,MACE,kBAACH,EAAc,SAAf,CAAwB,MAAOE,EAC7B,SAAA,kBAACR,EAAgB,KAAjB,CACE,YAAU,SACV,wBAAyB,CAACU,GAAeC,EACzC,cAAe,EAAM,IAAiB,CAChC,CAACD,GAAeE,EAAa,SAAW,aAC1CA,EAAa,OAAO,EAGtBC,IAAeC,EAAMF,CAAY,CACnC,EACA,GAAIL,CACL,CAAA,CACqB,CAAA,CAE5B,CAEA,SAAS,cAAc,CAAE,UAAS,WAAU,GAAGA,GAA6B,CAC1E,MAAO,kBAACP,EAAgB,QAAjB,CAAyB,YAAU,iBAAiB,GAAIO,EAAO,GAAIQ,EAAqBC,EAASC,CAAQ,CAAI,CAAA,CACtH,CAEA,SAAS,aAAa,CAAE,GAAGV,GAA4B,CACrD,MAAO,kBAACP,EAAgB,OAAjB,CAAwB,YAAU,gBAAgB,GAAIO,CAAQ,CAAA,CACvE,CAEA,SAAS,YAAY,CAAE,UAAS,WAAU,GAAGA,GAA2B,CACtE,MAAO,kBAACP,EAAgB,MAAjB,CAAuB,YAAU,eAAe,GAAIO,EAAO,GAAIQ,EAAqBC,EAASC,CAAQ,CAAI,CAAA,CAClH,CAEA,SAAS,cAAc,CAAE,YAAW,UAAS,cAAc,GAAM,UAAS,WAAU,GAAGV,GAA6B,CAClH,MACE,kBAACP,EAAgB,SAAjB,CACE,YAAU,iBACG,cACb,UAAY,GACVkB,EACE,yCACA,0FACA,yDACAjB,EAAiBkB,EAAWC,CAAK,CACnC,EAEF,QAASC,EAAuBC,CAAO,EACvC,GAAIf,EACJ,GAAIQ,EAAqBC,EAASC,CAAQ,CAC3C,CAAA,CAEL,CAEA,SAAS,cAAc,CACrB,YACA,WACA,kBAAkB,GAClB,aACA,eACA,cACA,UACA,GAAGV,GACkB,CACrB,GAAM,CAAE,QAASL,EAAM,WAAWI,CAAa,EAE/C,MACE,kBAAC,aAAD,CAA2B,cAA3B,SAAA,CACE,kBAAC,cAAD,CAAe,GAAIiB,EAAc,IAAKC,GAAcD,GAAc,GAAM,CAAA,EACxE,kBAACvB,EAAgB,MAAjB,CACE,YAAU,iBACV,UAAY,GAAUkB,EAAGd,EAAsB,CAAE,MAAK,CAAC,EAAGH,EAAiBkB,EAAWC,CAAK,CAAC,EAC5F,GAAIb,EACJ,GAAIQ,EAAqBC,EAASC,CAAQ,EAG1C,QAASI,EAAuBd,EAAM,OAAO,EAC7C,SAAUc,EAAuBd,EAAM,QAAQ,EARjD,SAAA,CAUG,CAACS,GAAWC,EACZQ,GAAmB,CAACT,GACnB,kBAAChB,EAAgB,MAAjB,CACE,YAAU,eACV,OAAQ,kBAAC0B,EAAD,CAAQ,QAAQ,QAAQ,UAAU,yBAAyB,KAAK,SAAW,CAAA,EAFrF,SAAA,CAIE,kBAACC,EAAD,CAAQ,CAAA,EACR,kBAAC,OAAD,CAAM,UAAU,UAAU,SAAA,OAAW,CAAA,CAChB,CAEJ,CAAA,CAAA,CACX,CAAA,CAAA,GAElB,CAEA,SAAS,aAAa,CAAE,YAAW,GAAGpB,GAA4B,CAChE,MAAO,kBAAC,MAAD,CAAK,YAAU,gBAAgB,UAAWW,EAAG,+BAAgCC,CAAS,EAAG,GAAIZ,CAAQ,CAAA,CAC9G,CAEA,SAAS,WAAW,CAAE,YAAW,GAAGA,GAA0B,CAC5D,MAAO,kBAAC,MAAD,CAAK,YAAU,cAAc,UAAWW,EAAG,oCAAqCC,CAAS,EAAG,GAAIZ,CAAQ,CAAA,CACjH,CAEA,SAAS,aAAa,CAAE,YAAW,kBAAkB,GAAO,WAAU,GAAGA,GAA4B,CACnG,MACE,kBAAC,MAAD,CACE,YAAU,gBACV,UAAWW,EACT,6DACA,yDACAC,CACF,EACA,GAAIZ,EAPN,SAAA,CASGU,EACAQ,GAAmB,kBAACzB,EAAgB,MAAjB,CAAuB,OAAQ,kBAAC0B,EAAD,CAAQ,QAAQ,SAAW,CAAA,EAAG,SAAA,OAA4B,CAAA,CAC1G,GAET,CAEA,SAAS,YAAY,CAAE,YAAW,UAAS,WAAU,GAAGnB,GAA2B,CACjF,MACE,kBAACP,EAAgB,MAAjB,CACE,YAAU,eACV,UAAY,GAAUkB,EAAG,qCAAsCjB,EAAiBkB,EAAWC,CAAK,CAAC,EACjG,GAAIb,EACJ,GAAIQ,EAAqBC,EAASC,CAAQ,CAC3C,CAAA,CAEL,CAEA,SAAS,kBAAkB,CAAE,YAAW,UAAS,WAAU,GAAGV,GAAiC,CAC7F,MACE,kBAACP,EAAgB,YAAjB,CACE,YAAU,qBACV,UAAY,GACVkB,EACE,gCACA,uEACAjB,EAAiBkB,EAAWC,CAAK,CACnC,EAEF,GAAIb,EACJ,GAAIQ,EAAqBC,EAASC,CAAQ,CAC3C,CAAA,CAEL"}

package/dist/components/drawer.d.ts

@@ -49,7 +49,7 @@ declare function Drawer({ size, direction, dismissible, disablePointerDismissal,
 declare function DrawerTrigger({ asChild, children, ...props }: DrawerTriggerProps): React.JSX.Element;
 declare function DrawerPortal({ ...props }: DrawerPortalProps): React.JSX.Element;
 declare function DrawerClose({ asChild, children, ...props }: DrawerCloseProps): React.JSX.Element;
-declare function DrawerOverlay({ className, onClick, asChild, children, ...props }: DrawerOverlayProps): React.JSX.Element;
+declare function DrawerOverlay({ className, onClick, forceRender, asChild, children, ...props }: DrawerOverlayProps): React.JSX.Element;
 declare function DrawerContent({ className, children, showCloseButton, overlayProps, keepMounted, asChild, ...props }: DrawerContentProps): React.JSX.Element;
 declare function DrawerHeader({ className, ...props }: DrawerHeaderProps): React.JSX.Element;
 declare function DrawerBody({ className, ...props }: DrawerBodyProps): React.JSX.Element;

package/dist/components/drawer.js

@@ -1,2 +1,2 @@
-import"../rolldown-runtime-BhWHdk3m.js";import{toAsChildRenderProps as e}from"../lib/as-child.js";import{cn as t,stopPropagationHandler as n}from"../lib/utils.js";import{t as r}from"../resolve-class-name-BurP8ngI.js";import{Button as i}from"./button.js";import{IconX as a}from"@tabler/icons-react";import*as o from"react";import{jsx as s,jsxs as c}from"react/jsx-runtime";import{cva as l}from"class-variance-authority";import{Dialog as u}from"@base-ui/react/dialog";const d=l([`bg-background flex h-auto flex-col text-sm fixed z-50 outline-none duration-200`,`data-open:animate-in data-closed:animate-out`],{variants:{direction:{top:`inset-x-0 top-0 rounded-b-xl border-b data-closed:slide-out-to-top data-open:slide-in-from-top-10`,right:`inset-y-0 right-0 rounded-l-xl border-l data-closed:slide-out-to-right data-open:slide-in-from-right-10`,bottom:`inset-x-0 bottom-0 rounded-t-xl border-t data-closed:slide-out-to-bottom data-open:slide-in-from-bottom-10`,left:`inset-y-0 left-0 rounded-r-xl border-r data-closed:slide-out-to-left data-open:slide-in-from-left-10`},size:{sm:``,md:``,lg:``,xl:``,"2xl":``,"3xl":``,full:``}},compoundVariants:[{direction:[`left`,`right`],size:`sm`,className:`w-3/4 sm:max-w-sm`},{direction:[`left`,`right`],size:`md`,className:`w-4/5 sm:max-w-md`},{direction:[`left`,`right`],size:`lg`,className:`w-[90%] sm:max-w-lg`},{direction:[`left`,`right`],size:`xl`,className:`w-[90%] sm:max-w-195`},{direction:[`left`,`right`],size:`2xl`,className:`w-[90%] sm:max-w-240`},{direction:[`left`,`right`],size:`3xl`,className:`w-[90%] sm:max-w-300`},{direction:[`left`,`right`],size:`full`,className:`w-full`},{direction:`top`,size:`sm`,className:`mb-24 h-full max-h-96`},{direction:`top`,size:`md`,className:`mb-20 h-full max-h-112`},{direction:`top`,size:`lg`,className:`mb-12 h-full max-h-128`},{direction:`top`,size:`xl`,className:`mb-12 h-full max-h-195`},{direction:`top`,size:`2xl`,className:`mb-12 h-full max-h-240`},{direction:`top`,size:`3xl`,className:`mb-12 h-full max-h-300`},{direction:`top`,size:`full`,className:`mb-0 h-full`},{direction:`bottom`,size:`sm`,className:`mt-24 h-full max-h-96`},{direction:`bottom`,size:`md`,className:`mt-20 h-full max-h-112`},{direction:`bottom`,size:`lg`,className:`mt-12 h-full max-h-128`},{direction:`bottom`,size:`xl`,className:`mt-12 h-full max-h-195`},{direction:`bottom`,size:`2xl`,className:`mt-12 h-full max-h-240`},{direction:`bottom`,size:`3xl`,className:`mt-12 h-full max-h-300`},{direction:`bottom`,size:`full`,className:`mt-0 h-full`}],defaultVariants:{direction:`right`,size:`md`}}),f=o.createContext({size:`md`,direction:`right`});function Drawer({size:e=`md`,direction:t=`right`,dismissible:n=!0,disablePointerDismissal:r,onOpenChange:i,...a}){let c=o.useMemo(()=>({size:e,direction:t}),[e,t]);return/* @__PURE__ */ s(f.Provider,{value:c,children:/* @__PURE__ */ s(u.Root,{"data-slot":`drawer`,disablePointerDismissal:!n||r,onOpenChange:(e,t)=>{!n&&t.reason===`escape-key`?t.cancel():i?.(e,t)},...a})})}function DrawerTrigger({asChild:t,children:n,...r}){return/* @__PURE__ */ s(u.Trigger,{"data-slot":`drawer-trigger`,...r,...e(t,n)})}function DrawerPortal({...e}){return/* @__PURE__ */ s(u.Portal,{"data-slot":`drawer-portal`,...e})}function DrawerClose({asChild:t,children:n,...r}){return/* @__PURE__ */ s(u.Close,{"data-slot":`drawer-close`,...r,...e(t,n)})}function DrawerOverlay({className:i,onClick:a,asChild:o,children:c,...l}){return/* @__PURE__ */ s(u.Backdrop,{"data-slot":`drawer-overlay`,className:e=>t(`bg-black/10 fixed inset-0 z-50 duration-200`,`data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0`,`supports-backdrop-filter:backdrop-blur-xs`,r(i,e)),onClick:n(a),...l,...e(o,c)})}function DrawerContent({className:l,children:p,showCloseButton:m=!0,overlayProps:h,keepMounted:g,asChild:_,...v}){let{size:y,direction:b}=o.useContext(f);return/* @__PURE__ */ c(DrawerPortal,{keepMounted:g,children:[/* @__PURE__ */ s(DrawerOverlay,{...h}),/* @__PURE__ */ c(u.Popup,{"data-slot":`drawer-content`,className:e=>t(d({size:y,direction:b}),r(l,e)),...v,...e(_,p),onClick:n(v.onClick),onSubmit:n(v.onSubmit),children:[!_&&p,m&&!_&&/* @__PURE__ */ c(u.Close,{"data-slot":`drawer-close`,render:/* @__PURE__ */ s(i,{variant:`ghost`,className:`absolute top-3 right-3`,size:`icon-sm`}),children:[/* @__PURE__ */ s(a,{}),/* @__PURE__ */ s(`span`,{className:`sr-only`,children:`Close`})]})]})]})}function DrawerHeader({className:e,...n}){let{direction:r}=o.useContext(f);return/* @__PURE__ */ s(`div`,{"data-slot":`drawer-header`,className:t(`p-4 flex flex-col gap-0.5 md:gap-0.5`,(r===`top`||r===`bottom`)&&`text-center md:text-left`,e),...n})}function DrawerBody({className:e,...n}){return/* @__PURE__ */ s(`div`,{"data-slot":`drawer-body`,className:t(`px-4 pb-4 flex-1 min-h-0 overflow-y-auto`,e),...n})}function DrawerFooter({className:e,...n}){return/* @__PURE__ */ s(`div`,{"data-slot":`drawer-footer`,className:t(`gap-2 p-4 mt-auto flex flex-col sm:flex-row sm:justify-end`,e),...n})}function DrawerTitle({className:n,asChild:i,children:a,...o}){return/* @__PURE__ */ s(u.Title,{"data-slot":`drawer-title`,className:e=>t(`text-foreground text-base font-medium`,r(n,e)),...o,...e(i,a)})}function DrawerDescription({className:n,asChild:i,children:a,...o}){return/* @__PURE__ */ s(u.Description,{"data-slot":`drawer-description`,className:e=>t(`text-muted-foreground text-sm`,r(n,e)),...o,...e(i,a)})}export{Drawer,DrawerBody,DrawerClose,DrawerContent,DrawerDescription,DrawerFooter,DrawerHeader,DrawerOverlay,DrawerPortal,DrawerTitle,DrawerTrigger};
+import"../rolldown-runtime-BhWHdk3m.js";import{toAsChildRenderProps as e}from"../lib/as-child.js";import{cn as t,stopPropagationHandler as n}from"../lib/utils.js";import{t as r}from"../resolve-class-name-BurP8ngI.js";import{Button as i}from"./button.js";import{IconX as a}from"@tabler/icons-react";import*as o from"react";import{jsx as s,jsxs as c}from"react/jsx-runtime";import{cva as l}from"class-variance-authority";import{Dialog as u}from"@base-ui/react/dialog";const d=l([`bg-background flex h-auto flex-col text-sm fixed z-50 outline-none duration-200`,`data-open:animate-in data-closed:animate-out`],{variants:{direction:{top:`inset-x-0 top-0 rounded-b-xl border-b data-closed:slide-out-to-top data-open:slide-in-from-top-10`,right:`inset-y-0 right-0 rounded-l-xl border-l data-closed:slide-out-to-right data-open:slide-in-from-right-10`,bottom:`inset-x-0 bottom-0 rounded-t-xl border-t data-closed:slide-out-to-bottom data-open:slide-in-from-bottom-10`,left:`inset-y-0 left-0 rounded-r-xl border-r data-closed:slide-out-to-left data-open:slide-in-from-left-10`},size:{sm:``,md:``,lg:``,xl:``,"2xl":``,"3xl":``,full:``}},compoundVariants:[{direction:[`left`,`right`],size:`sm`,className:`w-3/4 sm:max-w-sm`},{direction:[`left`,`right`],size:`md`,className:`w-4/5 sm:max-w-md`},{direction:[`left`,`right`],size:`lg`,className:`w-[90%] sm:max-w-lg`},{direction:[`left`,`right`],size:`xl`,className:`w-[90%] sm:max-w-195`},{direction:[`left`,`right`],size:`2xl`,className:`w-[90%] sm:max-w-240`},{direction:[`left`,`right`],size:`3xl`,className:`w-[90%] sm:max-w-300`},{direction:[`left`,`right`],size:`full`,className:`w-full`},{direction:`top`,size:`sm`,className:`mb-24 h-full max-h-96`},{direction:`top`,size:`md`,className:`mb-20 h-full max-h-112`},{direction:`top`,size:`lg`,className:`mb-12 h-full max-h-128`},{direction:`top`,size:`xl`,className:`mb-12 h-full max-h-195`},{direction:`top`,size:`2xl`,className:`mb-12 h-full max-h-240`},{direction:`top`,size:`3xl`,className:`mb-12 h-full max-h-300`},{direction:`top`,size:`full`,className:`mb-0 h-full`},{direction:`bottom`,size:`sm`,className:`mt-24 h-full max-h-96`},{direction:`bottom`,size:`md`,className:`mt-20 h-full max-h-112`},{direction:`bottom`,size:`lg`,className:`mt-12 h-full max-h-128`},{direction:`bottom`,size:`xl`,className:`mt-12 h-full max-h-195`},{direction:`bottom`,size:`2xl`,className:`mt-12 h-full max-h-240`},{direction:`bottom`,size:`3xl`,className:`mt-12 h-full max-h-300`},{direction:`bottom`,size:`full`,className:`mt-0 h-full`}],defaultVariants:{direction:`right`,size:`md`}}),f=o.createContext({size:`md`,direction:`right`});function Drawer({size:e=`md`,direction:t=`right`,dismissible:n=!0,disablePointerDismissal:r,onOpenChange:i,...a}){let c=o.useMemo(()=>({size:e,direction:t}),[e,t]);return/* @__PURE__ */ s(f.Provider,{value:c,children:/* @__PURE__ */ s(u.Root,{"data-slot":`drawer`,disablePointerDismissal:!n||r,onOpenChange:(e,t)=>{!n&&t.reason===`escape-key`?t.cancel():i?.(e,t)},...a})})}function DrawerTrigger({asChild:t,children:n,...r}){return/* @__PURE__ */ s(u.Trigger,{"data-slot":`drawer-trigger`,...r,...e(t,n)})}function DrawerPortal({...e}){return/* @__PURE__ */ s(u.Portal,{"data-slot":`drawer-portal`,...e})}function DrawerClose({asChild:t,children:n,...r}){return/* @__PURE__ */ s(u.Close,{"data-slot":`drawer-close`,...r,...e(t,n)})}function DrawerOverlay({className:i,onClick:a,forceRender:o=!0,asChild:c,children:l,...d}){return/* @__PURE__ */ s(u.Backdrop,{"data-slot":`drawer-overlay`,forceRender:o,className:e=>t(`bg-black/10 fixed inset-0 z-50 duration-200`,`data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0`,`supports-backdrop-filter:backdrop-blur-xs`,r(i,e)),onClick:n(a),...d,...e(c,l)})}function DrawerContent({className:l,children:p,showCloseButton:m=!0,overlayProps:h,keepMounted:g,asChild:_,...v}){let{size:y,direction:b}=o.useContext(f);return/* @__PURE__ */ c(DrawerPortal,{keepMounted:g,children:[/* @__PURE__ */ s(DrawerOverlay,{...h}),/* @__PURE__ */ c(u.Popup,{"data-slot":`drawer-content`,className:e=>t(d({size:y,direction:b}),r(l,e)),...v,...e(_,p),onClick:n(v.onClick),onSubmit:n(v.onSubmit),children:[!_&&p,m&&!_&&/* @__PURE__ */ c(u.Close,{"data-slot":`drawer-close`,render:/* @__PURE__ */ s(i,{variant:`ghost`,className:`absolute top-3 right-3`,size:`icon-sm`}),children:[/* @__PURE__ */ s(a,{}),/* @__PURE__ */ s(`span`,{className:`sr-only`,children:`Close`})]})]})]})}function DrawerHeader({className:e,...n}){let{direction:r}=o.useContext(f);return/* @__PURE__ */ s(`div`,{"data-slot":`drawer-header`,className:t(`p-4 flex flex-col gap-0.5 md:gap-0.5`,(r===`top`||r===`bottom`)&&`text-center md:text-left`,e),...n})}function DrawerBody({className:e,...n}){return/* @__PURE__ */ s(`div`,{"data-slot":`drawer-body`,className:t(`px-4 pb-4 flex-1 min-h-0 overflow-y-auto`,e),...n})}function DrawerFooter({className:e,...n}){return/* @__PURE__ */ s(`div`,{"data-slot":`drawer-footer`,className:t(`gap-2 p-4 mt-auto flex flex-col sm:flex-row sm:justify-end`,e),...n})}function DrawerTitle({className:n,asChild:i,children:a,...o}){return/* @__PURE__ */ s(u.Title,{"data-slot":`drawer-title`,className:e=>t(`text-foreground text-base font-medium`,r(n,e)),...o,...e(i,a)})}function DrawerDescription({className:n,asChild:i,children:a,...o}){return/* @__PURE__ */ s(u.Description,{"data-slot":`drawer-description`,className:e=>t(`text-muted-foreground text-sm`,r(n,e)),...o,...e(i,a)})}export{Drawer,DrawerBody,DrawerClose,DrawerContent,DrawerDescription,DrawerFooter,DrawerHeader,DrawerOverlay,DrawerPortal,DrawerTitle,DrawerTrigger};
 //# sourceMappingURL=drawer.js.map

package/dist/components/drawer.js.map

@@ -1 +1 @@
-{"version":3,"file":"drawer.js","names":["DrawerPrimitive","resolveClassName","React","drawerContentVariants","cva","DrawerContext","props","contextValue","size","direction","Dialog","dismissible","disablePointerDismissal","eventDetails","onOpenChange","open","toAsChildRenderProps","asChild","children","cn","className","state","stopPropagationHandler","onClick","overlayProps","showCloseButton","Button","IconX"],"sources":["../../src/components/drawer.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Dialog as DrawerPrimitive } from '@base-ui/react/dialog'\nimport { IconX } from '@tabler/icons-react'\nimport { cva, type VariantProps } from 'class-variance-authority'\n\nimport { type AsChildPrimitiveProps, toAsChildRenderProps } from '../lib/as-child'\nimport { cn, stopPropagationHandler } from '../lib/utils'\nimport { resolveClassName } from '../utils/resolve-class-name'\nimport { Button } from './button'\n\nconst drawerContentVariants = cva(\n  [\n    'bg-background flex h-auto flex-col text-sm fixed z-50 outline-none duration-200',\n    'data-open:animate-in data-closed:animate-out'\n  ],\n  {\n    variants: {\n      direction: {\n        top: 'inset-x-0 top-0 rounded-b-xl border-b data-closed:slide-out-to-top data-open:slide-in-from-top-10',\n        right:\n          'inset-y-0 right-0 rounded-l-xl border-l data-closed:slide-out-to-right data-open:slide-in-from-right-10',\n        bottom:\n          'inset-x-0 bottom-0 rounded-t-xl border-t data-closed:slide-out-to-bottom data-open:slide-in-from-bottom-10',\n        left: 'inset-y-0 left-0 rounded-r-xl border-r data-closed:slide-out-to-left data-open:slide-in-from-left-10'\n      },\n      size: {\n        sm: '',\n        md: '',\n        lg: '',\n        xl: '',\n        '2xl': '',\n        '3xl': '',\n        full: ''\n      }\n    },\n    compoundVariants: [\n      { direction: ['left', 'right'], size: 'sm', className: 'w-3/4 sm:max-w-sm' },\n      { direction: ['left', 'right'], size: 'md', className: 'w-4/5 sm:max-w-md' },\n      { direction: ['left', 'right'], size: 'lg', className: 'w-[90%] sm:max-w-lg' },\n      { direction: ['left', 'right'], size: 'xl', className: 'w-[90%] sm:max-w-195' },\n      { direction: ['left', 'right'], size: '2xl', className: 'w-[90%] sm:max-w-240' },\n      { direction: ['left', 'right'], size: '3xl', className: 'w-[90%] sm:max-w-300' },\n      { direction: ['left', 'right'], size: 'full', className: 'w-full' },\n      { direction: 'top', size: 'sm', className: 'mb-24 h-full max-h-96' },\n      { direction: 'top', size: 'md', className: 'mb-20 h-full max-h-112' },\n      { direction: 'top', size: 'lg', className: 'mb-12 h-full max-h-128' },\n      { direction: 'top', size: 'xl', className: 'mb-12 h-full max-h-195' },\n      { direction: 'top', size: '2xl', className: 'mb-12 h-full max-h-240' },\n      { direction: 'top', size: '3xl', className: 'mb-12 h-full max-h-300' },\n      { direction: 'top', size: 'full', className: 'mb-0 h-full' },\n      { direction: 'bottom', size: 'sm', className: 'mt-24 h-full max-h-96' },\n      { direction: 'bottom', size: 'md', className: 'mt-20 h-full max-h-112' },\n      { direction: 'bottom', size: 'lg', className: 'mt-12 h-full max-h-128' },\n      { direction: 'bottom', size: 'xl', className: 'mt-12 h-full max-h-195' },\n      { direction: 'bottom', size: '2xl', className: 'mt-12 h-full max-h-240' },\n      { direction: 'bottom', size: '3xl', className: 'mt-12 h-full max-h-300' },\n      { direction: 'bottom', size: 'full', className: 'mt-0 h-full' }\n    ],\n    defaultVariants: {\n      direction: 'right',\n      size: 'md'\n    }\n  }\n)\n\ntype DrawerDirection = NonNullable<VariantProps<typeof drawerContentVariants>['direction']>\ntype DrawerSize = NonNullable<VariantProps<typeof drawerContentVariants>['size']>\ntype DrawerContextValue = { size: DrawerSize; direction: DrawerDirection }\nconst DrawerContext = React.createContext<DrawerContextValue>({ size: 'md', direction: 'right' })\n\nexport type DrawerProps = React.ComponentProps<typeof DrawerPrimitive.Root> & {\n  /**\n   * Panel width for `left`/`right`, or height for `top`/`bottom`. `full` fills the whole viewport.\n   * @default 'md'\n   */\n  size?: DrawerSize\n  /**\n   * Edge the drawer slides in from.\n   * @default 'right'\n   */\n  direction?: DrawerDirection\n  /**\n   * When `false`, clicking outside and pressing Esc no longer close the drawer. The close button and `DrawerClose` still work.\n   * @default true\n   */\n  dismissible?: boolean\n}\nexport type DrawerTriggerProps = AsChildPrimitiveProps<typeof DrawerPrimitive.Trigger>\nexport type DrawerPortalProps = React.ComponentProps<typeof DrawerPrimitive.Portal>\nexport type DrawerCloseProps = AsChildPrimitiveProps<typeof DrawerPrimitive.Close>\nexport type DrawerOverlayProps = AsChildPrimitiveProps<typeof DrawerPrimitive.Backdrop>\nexport type DrawerContentProps = AsChildPrimitiveProps<typeof DrawerPrimitive.Popup> &\n  Pick<DrawerPortalProps, 'keepMounted'> & {\n    /**\n     * Shows the X button in the top-right corner.\n     * @default true\n     */\n    showCloseButton?: boolean\n    /** Props passed to the overlay rendered behind the drawer. */\n    overlayProps?: DrawerOverlayProps\n  }\nexport type DrawerHeaderProps = React.ComponentProps<'div'>\nexport type DrawerBodyProps = React.ComponentProps<'div'>\nexport type DrawerFooterProps = React.ComponentProps<'div'>\nexport type DrawerTitleProps = AsChildPrimitiveProps<typeof DrawerPrimitive.Title>\nexport type DrawerDescriptionProps = AsChildPrimitiveProps<typeof DrawerPrimitive.Description>\n\nfunction Drawer({\n  size = 'md',\n  direction = 'right',\n  dismissible = true,\n  disablePointerDismissal,\n  onOpenChange,\n  ...props\n}: DrawerProps) {\n  const contextValue = React.useMemo<DrawerContextValue>(() => ({ size, direction }), [size, direction])\n\n  return (\n    <DrawerContext.Provider value={contextValue}>\n      <DrawerPrimitive.Root\n        data-slot=\"drawer\"\n        disablePointerDismissal={!dismissible || disablePointerDismissal}\n        onOpenChange={(open, eventDetails) => {\n          if (!dismissible && eventDetails.reason === 'escape-key') {\n            eventDetails.cancel()\n            return\n          }\n          onOpenChange?.(open, eventDetails)\n        }}\n        {...props}\n      />\n    </DrawerContext.Provider>\n  )\n}\n\nfunction DrawerTrigger({ asChild, children, ...props }: DrawerTriggerProps) {\n  return <DrawerPrimitive.Trigger data-slot=\"drawer-trigger\" {...props} {...toAsChildRenderProps(asChild, children)} />\n}\n\nfunction DrawerPortal({ ...props }: DrawerPortalProps) {\n  return <DrawerPrimitive.Portal data-slot=\"drawer-portal\" {...props} />\n}\n\nfunction DrawerClose({ asChild, children, ...props }: DrawerCloseProps) {\n  return <DrawerPrimitive.Close data-slot=\"drawer-close\" {...props} {...toAsChildRenderProps(asChild, children)} />\n}\n\nfunction DrawerOverlay({ className, onClick, asChild, children, ...props }: DrawerOverlayProps) {\n  return (\n    <DrawerPrimitive.Backdrop\n      data-slot=\"drawer-overlay\"\n      className={(state) =>\n        cn(\n          'bg-black/10 fixed inset-0 z-50 duration-200',\n          'data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0',\n          'supports-backdrop-filter:backdrop-blur-xs',\n          resolveClassName(className, state)\n        )\n      }\n      onClick={stopPropagationHandler(onClick)}\n      {...props}\n      {...toAsChildRenderProps(asChild, children)}\n    />\n  )\n}\n\nfunction DrawerContent({\n  className,\n  children,\n  showCloseButton = true,\n  overlayProps,\n  keepMounted,\n  asChild,\n  ...props\n}: DrawerContentProps) {\n  const { size, direction } = React.useContext(DrawerContext)\n\n  return (\n    <DrawerPortal keepMounted={keepMounted}>\n      <DrawerOverlay {...overlayProps} />\n      <DrawerPrimitive.Popup\n        data-slot=\"drawer-content\"\n        className={(state) => cn(drawerContentVariants({ size, direction }), resolveClassName(className, state))}\n        {...props}\n        {...toAsChildRenderProps(asChild, children)}\n        // React events bubble through the fiber tree, not the DOM, so a portaled Popup still\n        // reaches any ancestor's onClick/onSubmit even though it renders outside it in the DOM.\n        onClick={stopPropagationHandler(props.onClick)}\n        onSubmit={stopPropagationHandler(props.onSubmit)}\n      >\n        {!asChild && children}\n        {showCloseButton && !asChild && (\n          <DrawerPrimitive.Close\n            data-slot=\"drawer-close\"\n            render={<Button variant=\"ghost\" className=\"absolute top-3 right-3\" size=\"icon-sm\" />}\n          >\n            <IconX />\n            <span className=\"sr-only\">Close</span>\n          </DrawerPrimitive.Close>\n        )}\n      </DrawerPrimitive.Popup>\n    </DrawerPortal>\n  )\n}\n\nfunction DrawerHeader({ className, ...props }: DrawerHeaderProps) {\n  const { direction } = React.useContext(DrawerContext)\n  const isVertical = direction === 'top' || direction === 'bottom'\n\n  return (\n    <div\n      data-slot=\"drawer-header\"\n      className={cn('p-4 flex flex-col gap-0.5 md:gap-0.5', isVertical && 'text-center md:text-left', className)}\n      {...props}\n    />\n  )\n}\n\nfunction DrawerBody({ className, ...props }: DrawerBodyProps) {\n  return (\n    <div data-slot=\"drawer-body\" className={cn('px-4 pb-4 flex-1 min-h-0 overflow-y-auto', className)} {...props} />\n  )\n}\n\nfunction DrawerFooter({ className, ...props }: DrawerFooterProps) {\n  return (\n    <div\n      data-slot=\"drawer-footer\"\n      className={cn('gap-2 p-4 mt-auto flex flex-col sm:flex-row sm:justify-end', className)}\n      {...props}\n    />\n  )\n}\n\nfunction DrawerTitle({ className, asChild, children, ...props }: DrawerTitleProps) {\n  return (\n    <DrawerPrimitive.Title\n      data-slot=\"drawer-title\"\n      className={(state) => cn('text-foreground text-base font-medium', resolveClassName(className, state))}\n      {...props}\n      {...toAsChildRenderProps(asChild, children)}\n    />\n  )\n}\n\nfunction DrawerDescription({ className, asChild, children, ...props }: DrawerDescriptionProps) {\n  return (\n    <DrawerPrimitive.Description\n      data-slot=\"drawer-description\"\n      className={(state) => cn('text-muted-foreground text-sm', resolveClassName(className, state))}\n      {...props}\n      {...toAsChildRenderProps(asChild, children)}\n    />\n  )\n}\n\nexport {\n  Drawer,\n  DrawerBody,\n  DrawerClose,\n  DrawerContent,\n  DrawerDescription,\n  DrawerFooter,\n  DrawerHeader,\n  DrawerOverlay,\n  DrawerPortal,\n  DrawerTitle,\n  DrawerTrigger\n}\n"],"mappings":"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"}
+{"version":3,"file":"drawer.js","names":["DrawerPrimitive","resolveClassName","React","drawerContentVariants","cva","DrawerContext","props","contextValue","size","direction","Dialog","dismissible","disablePointerDismissal","eventDetails","onOpenChange","open","toAsChildRenderProps","asChild","children","cn","className","state","stopPropagationHandler","onClick","overlayProps","showCloseButton","Button","IconX"],"sources":["../../src/components/drawer.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Dialog as DrawerPrimitive } from '@base-ui/react/dialog'\nimport { IconX } from '@tabler/icons-react'\nimport { cva, type VariantProps } from 'class-variance-authority'\n\nimport { type AsChildPrimitiveProps, toAsChildRenderProps } from '../lib/as-child'\nimport { cn, stopPropagationHandler } from '../lib/utils'\nimport { resolveClassName } from '../utils/resolve-class-name'\nimport { Button } from './button'\n\nconst drawerContentVariants = cva(\n  [\n    'bg-background flex h-auto flex-col text-sm fixed z-50 outline-none duration-200',\n    'data-open:animate-in data-closed:animate-out'\n  ],\n  {\n    variants: {\n      direction: {\n        top: 'inset-x-0 top-0 rounded-b-xl border-b data-closed:slide-out-to-top data-open:slide-in-from-top-10',\n        right:\n          'inset-y-0 right-0 rounded-l-xl border-l data-closed:slide-out-to-right data-open:slide-in-from-right-10',\n        bottom:\n          'inset-x-0 bottom-0 rounded-t-xl border-t data-closed:slide-out-to-bottom data-open:slide-in-from-bottom-10',\n        left: 'inset-y-0 left-0 rounded-r-xl border-r data-closed:slide-out-to-left data-open:slide-in-from-left-10'\n      },\n      size: {\n        sm: '',\n        md: '',\n        lg: '',\n        xl: '',\n        '2xl': '',\n        '3xl': '',\n        full: ''\n      }\n    },\n    compoundVariants: [\n      { direction: ['left', 'right'], size: 'sm', className: 'w-3/4 sm:max-w-sm' },\n      { direction: ['left', 'right'], size: 'md', className: 'w-4/5 sm:max-w-md' },\n      { direction: ['left', 'right'], size: 'lg', className: 'w-[90%] sm:max-w-lg' },\n      { direction: ['left', 'right'], size: 'xl', className: 'w-[90%] sm:max-w-195' },\n      { direction: ['left', 'right'], size: '2xl', className: 'w-[90%] sm:max-w-240' },\n      { direction: ['left', 'right'], size: '3xl', className: 'w-[90%] sm:max-w-300' },\n      { direction: ['left', 'right'], size: 'full', className: 'w-full' },\n      { direction: 'top', size: 'sm', className: 'mb-24 h-full max-h-96' },\n      { direction: 'top', size: 'md', className: 'mb-20 h-full max-h-112' },\n      { direction: 'top', size: 'lg', className: 'mb-12 h-full max-h-128' },\n      { direction: 'top', size: 'xl', className: 'mb-12 h-full max-h-195' },\n      { direction: 'top', size: '2xl', className: 'mb-12 h-full max-h-240' },\n      { direction: 'top', size: '3xl', className: 'mb-12 h-full max-h-300' },\n      { direction: 'top', size: 'full', className: 'mb-0 h-full' },\n      { direction: 'bottom', size: 'sm', className: 'mt-24 h-full max-h-96' },\n      { direction: 'bottom', size: 'md', className: 'mt-20 h-full max-h-112' },\n      { direction: 'bottom', size: 'lg', className: 'mt-12 h-full max-h-128' },\n      { direction: 'bottom', size: 'xl', className: 'mt-12 h-full max-h-195' },\n      { direction: 'bottom', size: '2xl', className: 'mt-12 h-full max-h-240' },\n      { direction: 'bottom', size: '3xl', className: 'mt-12 h-full max-h-300' },\n      { direction: 'bottom', size: 'full', className: 'mt-0 h-full' }\n    ],\n    defaultVariants: {\n      direction: 'right',\n      size: 'md'\n    }\n  }\n)\n\ntype DrawerDirection = NonNullable<VariantProps<typeof drawerContentVariants>['direction']>\ntype DrawerSize = NonNullable<VariantProps<typeof drawerContentVariants>['size']>\ntype DrawerContextValue = { size: DrawerSize; direction: DrawerDirection }\nconst DrawerContext = React.createContext<DrawerContextValue>({ size: 'md', direction: 'right' })\n\nexport type DrawerProps = React.ComponentProps<typeof DrawerPrimitive.Root> & {\n  /**\n   * Panel width for `left`/`right`, or height for `top`/`bottom`. `full` fills the whole viewport.\n   * @default 'md'\n   */\n  size?: DrawerSize\n  /**\n   * Edge the drawer slides in from.\n   * @default 'right'\n   */\n  direction?: DrawerDirection\n  /**\n   * When `false`, clicking outside and pressing Esc no longer close the drawer. The close button and `DrawerClose` still work.\n   * @default true\n   */\n  dismissible?: boolean\n}\nexport type DrawerTriggerProps = AsChildPrimitiveProps<typeof DrawerPrimitive.Trigger>\nexport type DrawerPortalProps = React.ComponentProps<typeof DrawerPrimitive.Portal>\nexport type DrawerCloseProps = AsChildPrimitiveProps<typeof DrawerPrimitive.Close>\nexport type DrawerOverlayProps = AsChildPrimitiveProps<typeof DrawerPrimitive.Backdrop>\nexport type DrawerContentProps = AsChildPrimitiveProps<typeof DrawerPrimitive.Popup> &\n  Pick<DrawerPortalProps, 'keepMounted'> & {\n    /**\n     * Shows the X button in the top-right corner.\n     * @default true\n     */\n    showCloseButton?: boolean\n    /** Props passed to the overlay rendered behind the drawer. */\n    overlayProps?: DrawerOverlayProps\n  }\nexport type DrawerHeaderProps = React.ComponentProps<'div'>\nexport type DrawerBodyProps = React.ComponentProps<'div'>\nexport type DrawerFooterProps = React.ComponentProps<'div'>\nexport type DrawerTitleProps = AsChildPrimitiveProps<typeof DrawerPrimitive.Title>\nexport type DrawerDescriptionProps = AsChildPrimitiveProps<typeof DrawerPrimitive.Description>\n\nfunction Drawer({\n  size = 'md',\n  direction = 'right',\n  dismissible = true,\n  disablePointerDismissal,\n  onOpenChange,\n  ...props\n}: DrawerProps) {\n  const contextValue = React.useMemo<DrawerContextValue>(() => ({ size, direction }), [size, direction])\n\n  return (\n    <DrawerContext.Provider value={contextValue}>\n      <DrawerPrimitive.Root\n        data-slot=\"drawer\"\n        disablePointerDismissal={!dismissible || disablePointerDismissal}\n        onOpenChange={(open, eventDetails) => {\n          if (!dismissible && eventDetails.reason === 'escape-key') {\n            eventDetails.cancel()\n            return\n          }\n          onOpenChange?.(open, eventDetails)\n        }}\n        {...props}\n      />\n    </DrawerContext.Provider>\n  )\n}\n\nfunction DrawerTrigger({ asChild, children, ...props }: DrawerTriggerProps) {\n  return <DrawerPrimitive.Trigger data-slot=\"drawer-trigger\" {...props} {...toAsChildRenderProps(asChild, children)} />\n}\n\nfunction DrawerPortal({ ...props }: DrawerPortalProps) {\n  return <DrawerPrimitive.Portal data-slot=\"drawer-portal\" {...props} />\n}\n\nfunction DrawerClose({ asChild, children, ...props }: DrawerCloseProps) {\n  return <DrawerPrimitive.Close data-slot=\"drawer-close\" {...props} {...toAsChildRenderProps(asChild, children)} />\n}\n\nfunction DrawerOverlay({ className, onClick, forceRender = true, asChild, children, ...props }: DrawerOverlayProps) {\n  return (\n    <DrawerPrimitive.Backdrop\n      data-slot=\"drawer-overlay\"\n      forceRender={forceRender}\n      className={(state) =>\n        cn(\n          'bg-black/10 fixed inset-0 z-50 duration-200',\n          'data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0',\n          'supports-backdrop-filter:backdrop-blur-xs',\n          resolveClassName(className, state)\n        )\n      }\n      onClick={stopPropagationHandler(onClick)}\n      {...props}\n      {...toAsChildRenderProps(asChild, children)}\n    />\n  )\n}\n\nfunction DrawerContent({\n  className,\n  children,\n  showCloseButton = true,\n  overlayProps,\n  keepMounted,\n  asChild,\n  ...props\n}: DrawerContentProps) {\n  const { size, direction } = React.useContext(DrawerContext)\n\n  return (\n    <DrawerPortal keepMounted={keepMounted}>\n      <DrawerOverlay {...overlayProps} />\n      <DrawerPrimitive.Popup\n        data-slot=\"drawer-content\"\n        className={(state) => cn(drawerContentVariants({ size, direction }), resolveClassName(className, state))}\n        {...props}\n        {...toAsChildRenderProps(asChild, children)}\n        // React events bubble through the fiber tree, not the DOM, so a portaled Popup still\n        // reaches any ancestor's onClick/onSubmit even though it renders outside it in the DOM.\n        onClick={stopPropagationHandler(props.onClick)}\n        onSubmit={stopPropagationHandler(props.onSubmit)}\n      >\n        {!asChild && children}\n        {showCloseButton && !asChild && (\n          <DrawerPrimitive.Close\n            data-slot=\"drawer-close\"\n            render={<Button variant=\"ghost\" className=\"absolute top-3 right-3\" size=\"icon-sm\" />}\n          >\n            <IconX />\n            <span className=\"sr-only\">Close</span>\n          </DrawerPrimitive.Close>\n        )}\n      </DrawerPrimitive.Popup>\n    </DrawerPortal>\n  )\n}\n\nfunction DrawerHeader({ className, ...props }: DrawerHeaderProps) {\n  const { direction } = React.useContext(DrawerContext)\n  const isVertical = direction === 'top' || direction === 'bottom'\n\n  return (\n    <div\n      data-slot=\"drawer-header\"\n      className={cn('p-4 flex flex-col gap-0.5 md:gap-0.5', isVertical && 'text-center md:text-left', className)}\n      {...props}\n    />\n  )\n}\n\nfunction DrawerBody({ className, ...props }: DrawerBodyProps) {\n  return (\n    <div data-slot=\"drawer-body\" className={cn('px-4 pb-4 flex-1 min-h-0 overflow-y-auto', className)} {...props} />\n  )\n}\n\nfunction DrawerFooter({ className, ...props }: DrawerFooterProps) {\n  return (\n    <div\n      data-slot=\"drawer-footer\"\n      className={cn('gap-2 p-4 mt-auto flex flex-col sm:flex-row sm:justify-end', className)}\n      {...props}\n    />\n  )\n}\n\nfunction DrawerTitle({ className, asChild, children, ...props }: DrawerTitleProps) {\n  return (\n    <DrawerPrimitive.Title\n      data-slot=\"drawer-title\"\n      className={(state) => cn('text-foreground text-base font-medium', resolveClassName(className, state))}\n      {...props}\n      {...toAsChildRenderProps(asChild, children)}\n    />\n  )\n}\n\nfunction DrawerDescription({ className, asChild, children, ...props }: DrawerDescriptionProps) {\n  return (\n    <DrawerPrimitive.Description\n      data-slot=\"drawer-description\"\n      className={(state) => cn('text-muted-foreground text-sm', resolveClassName(className, state))}\n      {...props}\n      {...toAsChildRenderProps(asChild, children)}\n    />\n  )\n}\n\nexport {\n  Drawer,\n  DrawerBody,\n  DrawerClose,\n  DrawerContent,\n  DrawerDescription,\n  DrawerFooter,\n  DrawerHeader,\n  DrawerOverlay,\n  DrawerPortal,\n  DrawerTitle,\n  DrawerTrigger\n}\n"],"mappings":"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"}

package/dist/skills/uselets-ui/references/component-catalog.md

@@ -106,7 +106,7 @@ Unless noted otherwise, each module also exports its public `*Props` types from
   - Notes: alert surface with `default` and `destructive` variants
 - `alert-dialog`
   - Exports: `AlertDialog`, `AlertDialogAction`, `AlertDialogCancel`, `AlertDialogContent`, `AlertDialogDescription`, `AlertDialogFooter`, `AlertDialogHeader`, `AlertDialogMedia`, `AlertDialogOverlay`, `AlertDialogPortal`, `AlertDialogTitle`, `AlertDialogTrigger`
-  - Notes: confirmation dialog composition
+  - Notes: confirmation dialog composition. `AlertDialogContent.overlayProps?: AlertDialogOverlayProps` forwards props to the overlay it renders. `AlertDialogOverlay.forceRender` defaults to `true`, so an alert dialog opened inside a `Dialog`/`Drawer` keeps its own overlay; pass `forceRender={false}` (directly or via `overlayProps`) to skip it
 - `badge`
   - Exports: `Badge`, `badgeVariants`
   - Notes: pill-shaped tag with `size: 'xs' | 'sm' | 'md' | 'lg' | 'xl'` (default `md`), `solid`/`secondary`/`outline`/`subtle` variants, `color: UIColor` (`primary` default), and `asChild`
@@ -204,13 +204,13 @@ Unless noted otherwise, each module also exports its public `*Props` types from
 
 - `dialog`
   - Exports: `Dialog`, `DialogBody`, `DialogClose`, `DialogContent`, `DialogDescription`, `DialogFooter`, `DialogHeader`, `DialogOverlay`, `DialogPortal`, `DialogTitle`, `DialogTrigger`
-  - Notes: `Dialog` supports `size: 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | 'full'` with default `md`; `full` occupies the entire viewport. `DialogContent` caps its height at `calc(100dvh - 2rem)` and lays out children as a flex column. For long content, wrap the middle in `DialogBody` (`flex-1 overflow-y-auto`) so the body scrolls while `DialogHeader` and `DialogFooter` remain pinned; for short content, omit `DialogBody`. `DialogContent.showCloseButton` defaults to `true`; `DialogFooter.showCloseButton` defaults to `false`. `Dialog.dismissible` defaults to `true`; set it to `false` to prevent closing via outside click and Esc (the close button and `DialogClose` still work). `DialogOverlay` and `DialogContent` stop `click`/`submit` propagation to ancestor elements by default, since portals move them elsewhere in the DOM but React still propagates their synthetic events through the component tree
+  - Notes: `Dialog` supports `size: 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | 'full'` with default `md`; `full` occupies the entire viewport. `DialogContent` caps its height at `calc(100dvh - 2rem)` and lays out children as a flex column. For long content, wrap the middle in `DialogBody` (`flex-1 overflow-y-auto`) so the body scrolls while `DialogHeader` and `DialogFooter` remain pinned; for short content, omit `DialogBody`. `DialogContent.showCloseButton` defaults to `true`; `DialogFooter.showCloseButton` defaults to `false`. `Dialog.dismissible` defaults to `true`; set it to `false` to prevent closing via outside click and Esc (the close button and `DialogClose` still work). `DialogOverlay` and `DialogContent` stop `click`/`submit` propagation to ancestor elements by default, since portals move them elsewhere in the DOM but React still propagates their synthetic events through the component tree. `DialogContent.overlayProps?: DialogOverlayProps` forwards props to the overlay it renders (`overlayRef` still works and takes precedence over `overlayProps.ref`). `DialogOverlay.forceRender` defaults to `true`, so a dialog opened inside another `Dialog`/`Drawer`/`AlertDialog` keeps its own overlay; pass `forceRender={false}` (directly or via `overlayProps`) to skip it
 - `direction`
   - Exports: `DirectionProvider`, `useDirection`, types `DirectionProviderProps`, `TextDirection`
   - Notes: `DirectionProvider.direction: 'ltr' | 'rtl'` (default `'ltr'`) sets the text direction for keyboard navigation (`Tabs`, `ToggleGroup`, `RadioGroup`, `DropdownMenu`), `Slider`, `ScrollArea`, `Select`, `NavigationMenu`, `Combobox` and popup positioning. A `dir` prop/attribute on those components does not change their behavior; wrap the RTL subtree (or the app) in `DirectionProvider` and also set `dir` on the HTML for text layout. `useDirection()` reads the current direction
 - `drawer`
   - Exports: `Drawer`, `DrawerBody`, `DrawerClose`, `DrawerContent`, `DrawerDescription`, `DrawerFooter`, `DrawerHeader`, `DrawerOverlay`, `DrawerPortal`, `DrawerTitle`, `DrawerTrigger`
-  - Notes: `Drawer` supports `size: 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | 'full'` with default `md`; `DrawerBody` provides padded auto-scroll content; `DrawerFooter` stacks actions on mobile and aligns them to the end on larger breakpoints; `DrawerContent.showCloseButton` controls the automatic close button and defaults to `true`. `Drawer.dismissible` defaults to `true`; set it to `false` to prevent closing via outside click and Esc (the close button and `DrawerClose` still work). `Drawer.direction: 'top' | 'right' | 'bottom' | 'left'` (default: `right`) controls which edge the drawer slides in from. `DrawerOverlay` and `DrawerContent` stop `click`/`submit` propagation to ancestor elements by default, since portals move them elsewhere in the DOM but React still propagates their synthetic events through the component tree
+  - Notes: `Drawer` supports `size: 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | 'full'` with default `md`; `DrawerBody` provides padded auto-scroll content; `DrawerFooter` stacks actions on mobile and aligns them to the end on larger breakpoints; `DrawerContent.showCloseButton` controls the automatic close button and defaults to `true`. `Drawer.dismissible` defaults to `true`; set it to `false` to prevent closing via outside click and Esc (the close button and `DrawerClose` still work). `Drawer.direction: 'top' | 'right' | 'bottom' | 'left'` (default: `right`) controls which edge the drawer slides in from. `DrawerOverlay` and `DrawerContent` stop `click`/`submit` propagation to ancestor elements by default, since portals move them elsewhere in the DOM but React still propagates their synthetic events through the component tree. `DrawerContent.overlayProps?: DrawerOverlayProps` forwards props to the overlay it renders. `DrawerOverlay.forceRender` defaults to `true`, so a drawer opened inside another `Drawer`/`Dialog` keeps its own overlay; pass `forceRender={false}` (directly or via `overlayProps`) to skip it
 - `popover`
   - Exports: `Popover`, `PopoverClose`, `PopoverContent`, `PopoverDescription`, `PopoverHeader`, `PopoverTitle`, `PopoverTrigger`
   - Notes: `PopoverContent` accepts `side`, `sideOffset`, `align`, `alignOffset`, and `anchor` (element, ref, or virtual element) to position against something other than the trigger; there is no `PopoverAnchor` component. `Popover.modal: boolean | 'trap-focus'` (default `false`) traps focus only when a `PopoverClose` (supports `asChild`) is rendered inside `PopoverContent`; without it, `modal` still blocks outside clicks and page scroll but `Tab` leaves the popup. Hide the close with `className="sr-only"` when there is no visible close button

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uselets/ui",
-  "version": "2.0.0",
+  "version": "2.0.1",
   "type": "module",
   "license": "UNLICENSED",
   "private": false,

package/skills/uselets-ui/references/component-catalog.md

@@ -106,7 +106,7 @@ Unless noted otherwise, each module also exports its public `*Props` types from
   - Notes: alert surface with `default` and `destructive` variants
 - `alert-dialog`
   - Exports: `AlertDialog`, `AlertDialogAction`, `AlertDialogCancel`, `AlertDialogContent`, `AlertDialogDescription`, `AlertDialogFooter`, `AlertDialogHeader`, `AlertDialogMedia`, `AlertDialogOverlay`, `AlertDialogPortal`, `AlertDialogTitle`, `AlertDialogTrigger`
-  - Notes: confirmation dialog composition
+  - Notes: confirmation dialog composition. `AlertDialogContent.overlayProps?: AlertDialogOverlayProps` forwards props to the overlay it renders. `AlertDialogOverlay.forceRender` defaults to `true`, so an alert dialog opened inside a `Dialog`/`Drawer` keeps its own overlay; pass `forceRender={false}` (directly or via `overlayProps`) to skip it
 - `badge`
   - Exports: `Badge`, `badgeVariants`
   - Notes: pill-shaped tag with `size: 'xs' | 'sm' | 'md' | 'lg' | 'xl'` (default `md`), `solid`/`secondary`/`outline`/`subtle` variants, `color: UIColor` (`primary` default), and `asChild`
@@ -204,13 +204,13 @@ Unless noted otherwise, each module also exports its public `*Props` types from
 
 - `dialog`
   - Exports: `Dialog`, `DialogBody`, `DialogClose`, `DialogContent`, `DialogDescription`, `DialogFooter`, `DialogHeader`, `DialogOverlay`, `DialogPortal`, `DialogTitle`, `DialogTrigger`
-  - Notes: `Dialog` supports `size: 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | 'full'` with default `md`; `full` occupies the entire viewport. `DialogContent` caps its height at `calc(100dvh - 2rem)` and lays out children as a flex column. For long content, wrap the middle in `DialogBody` (`flex-1 overflow-y-auto`) so the body scrolls while `DialogHeader` and `DialogFooter` remain pinned; for short content, omit `DialogBody`. `DialogContent.showCloseButton` defaults to `true`; `DialogFooter.showCloseButton` defaults to `false`. `Dialog.dismissible` defaults to `true`; set it to `false` to prevent closing via outside click and Esc (the close button and `DialogClose` still work). `DialogOverlay` and `DialogContent` stop `click`/`submit` propagation to ancestor elements by default, since portals move them elsewhere in the DOM but React still propagates their synthetic events through the component tree
+  - Notes: `Dialog` supports `size: 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | 'full'` with default `md`; `full` occupies the entire viewport. `DialogContent` caps its height at `calc(100dvh - 2rem)` and lays out children as a flex column. For long content, wrap the middle in `DialogBody` (`flex-1 overflow-y-auto`) so the body scrolls while `DialogHeader` and `DialogFooter` remain pinned; for short content, omit `DialogBody`. `DialogContent.showCloseButton` defaults to `true`; `DialogFooter.showCloseButton` defaults to `false`. `Dialog.dismissible` defaults to `true`; set it to `false` to prevent closing via outside click and Esc (the close button and `DialogClose` still work). `DialogOverlay` and `DialogContent` stop `click`/`submit` propagation to ancestor elements by default, since portals move them elsewhere in the DOM but React still propagates their synthetic events through the component tree. `DialogContent.overlayProps?: DialogOverlayProps` forwards props to the overlay it renders (`overlayRef` still works and takes precedence over `overlayProps.ref`). `DialogOverlay.forceRender` defaults to `true`, so a dialog opened inside another `Dialog`/`Drawer`/`AlertDialog` keeps its own overlay; pass `forceRender={false}` (directly or via `overlayProps`) to skip it
 - `direction`
   - Exports: `DirectionProvider`, `useDirection`, types `DirectionProviderProps`, `TextDirection`
   - Notes: `DirectionProvider.direction: 'ltr' | 'rtl'` (default `'ltr'`) sets the text direction for keyboard navigation (`Tabs`, `ToggleGroup`, `RadioGroup`, `DropdownMenu`), `Slider`, `ScrollArea`, `Select`, `NavigationMenu`, `Combobox` and popup positioning. A `dir` prop/attribute on those components does not change their behavior; wrap the RTL subtree (or the app) in `DirectionProvider` and also set `dir` on the HTML for text layout. `useDirection()` reads the current direction
 - `drawer`
   - Exports: `Drawer`, `DrawerBody`, `DrawerClose`, `DrawerContent`, `DrawerDescription`, `DrawerFooter`, `DrawerHeader`, `DrawerOverlay`, `DrawerPortal`, `DrawerTitle`, `DrawerTrigger`
-  - Notes: `Drawer` supports `size: 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | 'full'` with default `md`; `DrawerBody` provides padded auto-scroll content; `DrawerFooter` stacks actions on mobile and aligns them to the end on larger breakpoints; `DrawerContent.showCloseButton` controls the automatic close button and defaults to `true`. `Drawer.dismissible` defaults to `true`; set it to `false` to prevent closing via outside click and Esc (the close button and `DrawerClose` still work). `Drawer.direction: 'top' | 'right' | 'bottom' | 'left'` (default: `right`) controls which edge the drawer slides in from. `DrawerOverlay` and `DrawerContent` stop `click`/`submit` propagation to ancestor elements by default, since portals move them elsewhere in the DOM but React still propagates their synthetic events through the component tree
+  - Notes: `Drawer` supports `size: 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | 'full'` with default `md`; `DrawerBody` provides padded auto-scroll content; `DrawerFooter` stacks actions on mobile and aligns them to the end on larger breakpoints; `DrawerContent.showCloseButton` controls the automatic close button and defaults to `true`. `Drawer.dismissible` defaults to `true`; set it to `false` to prevent closing via outside click and Esc (the close button and `DrawerClose` still work). `Drawer.direction: 'top' | 'right' | 'bottom' | 'left'` (default: `right`) controls which edge the drawer slides in from. `DrawerOverlay` and `DrawerContent` stop `click`/`submit` propagation to ancestor elements by default, since portals move them elsewhere in the DOM but React still propagates their synthetic events through the component tree. `DrawerContent.overlayProps?: DrawerOverlayProps` forwards props to the overlay it renders. `DrawerOverlay.forceRender` defaults to `true`, so a drawer opened inside another `Drawer`/`Dialog` keeps its own overlay; pass `forceRender={false}` (directly or via `overlayProps`) to skip it
 - `popover`
   - Exports: `Popover`, `PopoverClose`, `PopoverContent`, `PopoverDescription`, `PopoverHeader`, `PopoverTitle`, `PopoverTrigger`
   - Notes: `PopoverContent` accepts `side`, `sideOffset`, `align`, `alignOffset`, and `anchor` (element, ref, or virtual element) to position against something other than the trigger; there is no `PopoverAnchor` component. `Popover.modal: boolean | 'trap-focus'` (default `false`) traps focus only when a `PopoverClose` (supports `asChild`) is rendered inside `PopoverContent`; without it, `modal` still blocks outside clicks and page scroll but `Tab` leaves the popup. Hide the close with `className="sr-only"` when there is no visible close button