@exxatdesignux/ui 0.5.3 → 0.5.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@exxatdesignux/ui",
-  "version": "0.5.3",
+  "version": "0.5.4",
   "description": "Exxat shared design system (components, hooks, tokens). Monorepo setup: clone repo then pnpm bootstrap at workspace root — see github.com/ExxatDesign/Exxat-DS-Workspace README.",
   "license": "UNLICENSED",
   "author": "Exxat Design",
@@ -121,7 +121,6 @@
     "tailwind-merge": "^3.5.0",
     "tw-animate-css": "^1.4.0",
     "use-mask-input": "^3.9.0",
-    "vaul": "^1.1.2",
     "zod": "^4.3.6"
   },
   "devDependencies": {

package/src/index.ts

@@ -69,7 +69,6 @@ export * from "./components/ui/context-menu"
 export * from "./components/ui/date-picker-field"
 export * from "./components/ui/dialog"
 export * from "./components/ui/drag-handle-grip"
-export * from "./components/ui/drawer"
 export * from "./components/ui/dropdown-menu"
 export * from "./components/ui/export-drawer"
 export * from "./components/ui/hover-card"

package/template/.cursor/rules/exxat-accessibility.mdc

@@ -17,7 +17,7 @@ alwaysApply: true
 4. **Touch targets (2.5.8):** **≥ 24×24 CSS px** or **24px** spacing — **`min-h-6 min-w-6` / `size-6`** for icon-only; avoid **`size-4`** as sole target.
 5. **Contrast:** normal text **≥ 4.5:1**; UI / focus **≥ 3:1** where required; muted on tinted surfaces use correct surface tokens.
 6. **Minimum text size:** visible product copy **≥ 11px** — **`text-xs`** or larger (**`AGENTS.md` §8.3**, **`app/globals.css`** `--text-xs`).
-7. **Dialogs / sheets / drawers:** must have a **Title** (`DialogTitle` / `SheetTitle` / `DrawerTitle`); **`sr-only`** if hidden.
+7. **Dialogs / sheets:** must have a **Title** (`DialogTitle` / `SheetTitle`); **`sr-only`** if hidden.
 8. **Format hints persistent, not placeholders (SC 3.3.2, 1.3.1).** Fields with required formats — **date, time, phone, currency, GPA, IDs, URLs, unit-bearing numbers** — MUST render the format via **`FormDescription`** (or equivalent `aria-describedby` helper text). Placeholders disappear on focus and **MUST NOT** be the sole carrier. Prefer picker primitives (e.g. `DatePickerField`) over free-text where available.
 9. **Every icon that communicates information MUST have a text alternative** — not just icon-only buttons. Three cases (SC 1.1.1, 3.3.2, 2.4.6):
 

package/template/AGENTS.md

@@ -366,9 +366,9 @@ Follow root **`.cursor/rules/exxat-kbd-shortcuts.mdc`**. Summary:
 - **UI components** (borders, focus rings where required): **≥ 3:1**.
 - **Muted text on tinted surfaces** (e.g. sidebar): use tokens mixed against the **correct surface** (e.g. **`--sidebar`** / `--sidebar-section-label-foreground`), not only `--background`.
 
-### 8.4 Overlays (Dialog / Sheet / Drawer)
+### 8.4 Overlays (Dialog / Sheet)
 
-**MUST:** Provide an accessible **title** — `DialogTitle` / `SheetTitle` / `DrawerTitle`; use **`className="sr-only"`** when the title is visually hidden (align with shadcn patterns in this repo).
+**MUST:** Provide an accessible **title** — `DialogTitle` / `SheetTitle`; use **`className="sr-only"`** when the title is visually hidden (align with shadcn patterns in this repo). Product side panels use **`Sheet`** only (Export, Properties, invite — not a separate Vaul drawer primitive).
 
 ### 8.5 Verification
 

package/template/components/site-header.tsx

@@ -64,7 +64,7 @@ export function SiteHeader({
     <div
       className={cn(
         // Sticky page chrome sits BELOW every Radix overlay (DropdownMenu /
-        // Popover / Select / Dialog / Sheet / Tooltip / Drawer all render at
+        // Popover / Select / Dialog / Sheet / Tooltip all render at
         // z-50). Previously `z-60` here caused the school/product switcher
         // dropdown to open behind the breadcrumb. `z-30` keeps the header
         // above page content (charts, tables, scrolled rows) but below

package/template/docs/HANDBOOK.md

@@ -133,7 +133,7 @@ These are the ones you'll use on >90% of screens. If a screen needs something el
 | KPI strip / band | `KeyMetrics` (`variant="flat"` on hubs) | `packages/ui` |
 | Status chip + icon | `ListHubStatusBadge` + `lib/list-status-badges.ts` | `apps/web/components/` |
 | Board / kanban card | `ListPageBoardCard` + primitives | `packages/ui` |
-| Side overlay | `Sheet` / `Drawer` (NOT toast — `exxat-no-toast.mdc`) | `packages/ui` |
+| Side overlay | `Sheet` floating panels (NOT toast — `exxat-no-toast.mdc`) | `packages/ui` |
 | Persistent banner | `LocalBanner` / `SystemBanner` | `packages/ui` |
 | Inline status / format hint | `FormDescription`, inline `<small>` | `packages/ui` |
 | Tooltip | `Tip` / `Tooltip` | `packages/ui` |

package/template/docs/component-selection-guide.md

@@ -117,7 +117,7 @@ Always ask: **does the user need the hub visible behind them?**
               │                              │
         ┌─ YES ┴ NO ──┐                      │
         ▼              ▼                      ▼
-     Dialog        Drawer / Sheet         Page route
+     Dialog        Sheet panel            Page route
    (AlertDialog,  (TablePropertiesDrawer,  (full create/edit
    delete confirm)  ExportDrawer,           wizard, deep detail)
                    InviteCollaboratorsDrawer)

package/template/docs/consumer-upgrade-checklist.md

@@ -0,0 +1,51 @@
+# Upgrading `@exxatdesignux/ui` (human + AI checklist)
+
+Use this after **`npm install @exxatdesignux/ui@…`** / **`pnpm add @exxatdesignux/ui@…`**. It is copied into **`docs/exxat-ds/`** when you run **`exxat-ui sync-extras`**, so Cursor and other tools can find it beside other DS pattern docs.
+
+## 1. See what changed
+
+| Source | Purpose |
+|--------|---------|
+| **`node_modules/@exxatdesignux/ui/CHANGELOG.md`** | Release notes for the installed version (and peers). |
+| **`npx --package=@exxatdesignux/ui@latest exxat-ui changelog`** | Print the changelog from the package on disk / npx extract. |
+
+## 2. Refresh AI / pattern docs (optional but recommended)
+
+```bash
+npx --package=@exxatdesignux/ui@latest exxat-ui sync-extras
+```
+
+Overwrites only **`.cursor/skills/exxat-*`** and **`docs/exxat-ds/*.md`** (including this file). Does **not** change your app routes or product code.
+
+## 3. Align app code with the reference template
+
+The npm package includes a full Next.js reference under:
+
+**`node_modules/@exxatdesignux/ui/template/`**
+
+Use it when you need to know **what files exist**, **how shims re-export** `@exxatdesignux/ui`, or **what AGENTS / layout** patterns look like for the current release. Porting is manual: diff template vs your repo and apply intentional changes (imports, new components, CSS entrypoints).
+
+## 4. Dependency and Node
+
+- Keep **`@exxatdesignux/ui`** on the same semver your team tested; prefer explicit **`^x.y.z`** or pinned **`x.y.z`**.
+- Match **`engines.node`** in your app to the value declared in **`node_modules/@exxatdesignux/ui/package.json`** (see CHANGELOG if it changed).
+- **≥ 0.5.3:** Remove **`vaul`** from your app `package.json` and delete any `components/ui/drawer.tsx` shim — side panels use **`Sheet`** only (**`.cursor/rules/exxat-no-vaul.mdc`**).
+
+## 5. Consumer UI audit (after sync-extras)
+
+If the app was built before current agent rules, verify:
+
+| Symptom | Fix |
+|---------|-----|
+| Full-width tab bar on list hub | Use **`ListPageTemplate`** view toolbar — **`exxat-tabs-chrome.mdc`** |
+| Full-width Overview / Academics tabs | **`TabsList`** must stay **`w-fit`** — no `w-full` / `flex-1` stretch |
+| Grey custom header buttons | **`PageHeader`** + **`Button`** variants — **`exxat-page-header-actions.mdc`** |
+| Bespoke student popover in table | **`HoverCard`** + shared cells/badges — **`exxat-table-row-preview.mdc`** |
+| Custom hub table / trimmed Add view | **`HubTable`** + **`FULL_HUB_SUPPORTED_VIEWS`** — **`exxat-hub-supported-views.mdc`** |
+
+## 6. Still stuck?
+
+- **`npx --package=@exxatdesignux/ui@latest exxat-ui doctor`** — compares local CLI version vs npm **`latest`**.
+- **`npx --package=@exxatdesignux/ui@latest exxat-ui update`** — install commands and reminders.
+
+Maintainers publish from the design-system monorepo with git tags **`ui-v<version>`**; registry **`latest`** follows those tags.

package/template/docs/drawer-vs-dialog-pattern.md

@@ -1,8 +1,8 @@
-# Drawer vs dialog vs route
+# Sheet panel vs dialog vs route
 
-> **Related:** `docs/data-views-pattern.md` (Page vs drawer), **`AGENTS.md` §6.4**, **`.cursor/rules/exxat-page-vs-drawer.mdc`**. **This doc** splits **drawer/sheet** vs **modal dialog** when both stay on the same route.
+> **Related:** `docs/data-views-pattern.md` (Page vs drawer), **`AGENTS.md` §6.4**, **`.cursor/rules/exxat-page-vs-drawer.mdc`**. **This doc** splits **floating `Sheet` panels** vs **modal dialog** when both stay on the same route.
 
-## Drawer / sheet (side panel)
+## Sheet (side panel — product “drawers”)
 
 **Use when:**
 
@@ -10,7 +10,7 @@
 - The flow is **medium length** — export options, table/column properties, invite collaborators, filters that mirror the grid.
 - **Width** helps — tables of options, multi-field forms that would feel cramped in a narrow dialog.
 
-**Examples in repo:** `TablePropertiesDrawer`, `ExportDrawer`, `InviteCollaboratorsDrawer`, `Drawer` shells that slide from the edge.
+**Implementation:** **`Sheet`** from `@exxatdesignux/ui/components/sheet` with the floating inset pattern (`showOverlay={false}`, `getFloatingSheetInsetProps`) — see `ExportDrawer`, `TablePropertiesDrawer`, `InviteCollaboratorsDrawer`, `LibraryNewFolderSheet`.
 
 **Avoid when:** The task is the **only** thing the user should focus on and the parent would distract (prefer **dialog** for a sharp confirm, or **route** for a full wizard).
 
@@ -24,7 +24,7 @@
 
 **Examples:** `AlertDialog`, confirm-before-remove, “Save changes?” when navigating away.
 
-**Avoid when:** Users need to **reference** the grid or copy values from the page while the panel is open — use a **drawer** or **inline** pattern instead.
+**Avoid when:** Users need to **reference** the grid or copy values from the page while the panel is open — use a **sheet panel** or **inline** pattern instead.
 
 ## Route (new page)
 
@@ -32,7 +32,7 @@ Use when the work is **primary**, **long**, **multi-step**, or deserves its **ow
 
 ## Quick matrix
 
-| Need | Drawer | Dialog | Route |
+| Need | Sheet panel | Dialog | Route |
 | --- | --- | --- | --- |
 | Keep hub visible | Yes | No (blocks) | No |
 | Short confirm / alert | Rare | Yes | Overkill |
@@ -41,8 +41,8 @@ Use when the work is **primary**, **long**, **multi-step**, or deserves its **ow
 
 ## Accessibility
 
-- **Dialog / drawer / sheet:** Must expose a **title** (`DialogTitle`, `SheetTitle`, `DrawerTitle`) — use `sr-only` if visually hidden.
-- **Focus trap** is expected in dialogs; drawers should still **restore focus** on close to the invoking control.
+- **Dialog / sheet:** Must expose a **title** (`DialogTitle`, `SheetTitle`) — use `sr-only` if visually hidden.
+- **Focus trap** is expected in dialogs; sheet panels should still **restore focus** on close to the invoking control.
 
 ## See also
 

package/template/lib/motion-ui.ts

@@ -11,7 +11,7 @@ export const motionHeaderEnter = {
 } as const
 
 /**
- * Sheet / Vaul drawer timing — implemented in `@exxatdesignux/ui` `Sheet` + `Drawer`
- * (`duration-300 ease-out`, shorter slide distance) so all panels animate consistently.
+ * Floating sheet panel timing — implemented in `@exxatdesignux/ui` `Sheet`
+ * (`duration-300 ease-out`) so Export, Properties, and invite panels animate consistently.
  */
 export const motionSheetMs = 300

package/template/package.json

@@ -55,7 +55,6 @@
     "sonner": "^2.0.7",
     "tailwind-merge": "^3.5.0",
     "tw-animate-css": "^1.4.0",
-    "vaul": "^1.1.2",
     "zod": "^4.3.6",
     "zustand": "^5.0.12"
   },

package/tokens/hooks-index.json

@@ -1,7 +1,7 @@
 {
-  "version": "0.5.3",
+  "version": "0.5.4",
   "source": "packages/ui/src/globals.css",
-  "generatedAt": "2026-05-22T09:24:53.662Z",
+  "generatedAt": "2026-05-22T11:42:41.710Z",
   "tokenCount": 197,
   "themeKeys": [
     "tailwind-bridge",

package/dist/components/ui/drawer.d.ts

@@ -1,16 +0,0 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
-import * as React from 'react';
-import { Drawer as Drawer$1 } from 'vaul';
-
-declare function Drawer({ ...props }: React.ComponentProps<typeof Drawer$1.Root>): react_jsx_runtime.JSX.Element;
-declare function DrawerTrigger({ ...props }: React.ComponentProps<typeof Drawer$1.Trigger>): react_jsx_runtime.JSX.Element;
-declare function DrawerPortal({ ...props }: React.ComponentProps<typeof Drawer$1.Portal>): react_jsx_runtime.JSX.Element;
-declare function DrawerClose({ ...props }: React.ComponentProps<typeof Drawer$1.Close>): react_jsx_runtime.JSX.Element;
-declare function DrawerOverlay({ className, ...props }: React.ComponentProps<typeof Drawer$1.Overlay>): react_jsx_runtime.JSX.Element;
-declare function DrawerContent({ className, children, ...props }: React.ComponentProps<typeof Drawer$1.Content>): react_jsx_runtime.JSX.Element;
-declare function DrawerHeader({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
-declare function DrawerFooter({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
-declare function DrawerTitle({ className, ...props }: React.ComponentProps<typeof Drawer$1.Title>): react_jsx_runtime.JSX.Element;
-declare function DrawerDescription({ className, ...props }: React.ComponentProps<typeof Drawer$1.Description>): react_jsx_runtime.JSX.Element;
-
-export { Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger };

package/dist/components/ui/drawer.js

@@ -1,125 +0,0 @@
-"use client";
-import { Drawer as Drawer$1 } from 'vaul';
-import { clsx } from 'clsx';
-import { twMerge } from 'tailwind-merge';
-import { jsx, jsxs } from 'react/jsx-runtime';
-
-function cn(...inputs) {
-  return twMerge(clsx(inputs));
-}
-function Drawer({
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(Drawer$1.Root, { "data-slot": "drawer", ...props });
-}
-function DrawerTrigger({
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(Drawer$1.Trigger, { "data-slot": "drawer-trigger", ...props });
-}
-function DrawerPortal({
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(Drawer$1.Portal, { "data-slot": "drawer-portal", ...props });
-}
-function DrawerClose({
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(Drawer$1.Close, { "data-slot": "drawer-close", ...props });
-}
-function DrawerOverlay({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(
-    Drawer$1.Overlay,
-    {
-      "data-slot": "drawer-overlay",
-      className: cn(
-        "fixed inset-0 z-50 bg-overlay duration-300 ease-out supports-backdrop-filter:backdrop-blur-xs data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0",
-        className
-      ),
-      ...props
-    }
-  );
-}
-function DrawerContent({
-  className,
-  children,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxs(DrawerPortal, { "data-slot": "drawer-portal", children: [
-    /* @__PURE__ */ jsx(DrawerOverlay, {}),
-    /* @__PURE__ */ jsxs(
-      Drawer$1.Content,
-      {
-        "data-slot": "drawer-content",
-        className: cn(
-          "group/drawer-content fixed z-50 flex h-auto flex-col bg-background text-sm duration-300 ease-out outline-none data-[vaul-drawer-direction=bottom]:inset-x-0 data-[vaul-drawer-direction=bottom]:bottom-0 data-[vaul-drawer-direction=bottom]:mt-24 data-[vaul-drawer-direction=bottom]:max-h-[80vh] data-[vaul-drawer-direction=bottom]:rounded-t-xl data-[vaul-drawer-direction=bottom]:border-t data-[vaul-drawer-direction=left]:inset-y-0 data-[vaul-drawer-direction=left]:start-0 data-[vaul-drawer-direction=left]:w-3/4 data-[vaul-drawer-direction=left]:rounded-e-xl data-[vaul-drawer-direction=left]:border-e data-[vaul-drawer-direction=right]:inset-y-0 data-[vaul-drawer-direction=right]:end-0 data-[vaul-drawer-direction=right]:w-3/4 data-[vaul-drawer-direction=right]:rounded-s-xl data-[vaul-drawer-direction=right]:border-s data-[vaul-drawer-direction=top]:inset-x-0 data-[vaul-drawer-direction=top]:top-0 data-[vaul-drawer-direction=top]:mb-24 data-[vaul-drawer-direction=top]:max-h-[80vh] data-[vaul-drawer-direction=top]:rounded-b-xl data-[vaul-drawer-direction=top]:border-b data-[vaul-drawer-direction=left]:sm:max-w-sm data-[vaul-drawer-direction=right]:sm:max-w-sm",
-          className
-        ),
-        ...props,
-        children: [
-          /* @__PURE__ */ jsx("div", { className: "mx-auto mt-4 hidden h-1 w-[100px] shrink-0 rounded-full bg-muted group-data-[vaul-drawer-direction=bottom]/drawer-content:block" }),
-          children
-        ]
-      }
-    )
-  ] });
-}
-function DrawerHeader({ className, ...props }) {
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      "data-slot": "drawer-header",
-      className: cn(
-        "flex flex-col gap-0.5 p-4 group-data-[vaul-drawer-direction=bottom]/drawer-content:text-center group-data-[vaul-drawer-direction=top]/drawer-content:text-center md:gap-0.5 md:text-start",
-        className
-      ),
-      ...props
-    }
-  );
-}
-function DrawerFooter({ className, ...props }) {
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      "data-slot": "drawer-footer",
-      className: cn("mt-auto flex flex-col gap-2 p-4", className),
-      ...props
-    }
-  );
-}
-function DrawerTitle({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(
-    Drawer$1.Title,
-    {
-      "data-slot": "drawer-title",
-      className: cn(
-        "font-heading text-base font-medium text-foreground",
-        className
-      ),
-      ...props
-    }
-  );
-}
-function DrawerDescription({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(
-    Drawer$1.Description,
-    {
-      "data-slot": "drawer-description",
-      className: cn("text-sm text-muted-foreground", className),
-      ...props
-    }
-  );
-}
-
-export { Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger };
-//# sourceMappingURL=drawer.js.map
-//# sourceMappingURL=drawer.js.map

package/dist/components/ui/drawer.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../src/lib/utils.ts","../../../src/components/ui/drawer.tsx"],"names":["DrawerPrimitive"],"mappings":"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","file":"drawer.js","sourcesContent":["import { clsx, type ClassValue } from \"clsx\"\nimport { twMerge } from \"tailwind-merge\"\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs))\n}\n","\"use client\"\n\nimport * as React from \"react\"\nimport { Drawer as DrawerPrimitive } from \"vaul\"\n\nimport { cn } from \"../../lib/utils\"\n\nfunction Drawer({\n  ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Root>) {\n  return <DrawerPrimitive.Root data-slot=\"drawer\" {...props} />\n}\n\nfunction DrawerTrigger({\n  ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Trigger>) {\n  return <DrawerPrimitive.Trigger data-slot=\"drawer-trigger\" {...props} />\n}\n\nfunction DrawerPortal({\n  ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Portal>) {\n  return <DrawerPrimitive.Portal data-slot=\"drawer-portal\" {...props} />\n}\n\nfunction DrawerClose({\n  ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Close>) {\n  return <DrawerPrimitive.Close data-slot=\"drawer-close\" {...props} />\n}\n\nfunction DrawerOverlay({\n  className,\n  ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Overlay>) {\n  return (\n    <DrawerPrimitive.Overlay\n      data-slot=\"drawer-overlay\"\n      className={cn(\n        \"fixed inset-0 z-50 bg-overlay duration-300 ease-out 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        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction DrawerContent({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Content>) {\n  return (\n    <DrawerPortal data-slot=\"drawer-portal\">\n      <DrawerOverlay />\n      <DrawerPrimitive.Content\n        data-slot=\"drawer-content\"\n        className={cn(\n          \"group/drawer-content fixed z-50 flex h-auto flex-col bg-background text-sm duration-300 ease-out outline-none data-[vaul-drawer-direction=bottom]:inset-x-0 data-[vaul-drawer-direction=bottom]:bottom-0 data-[vaul-drawer-direction=bottom]:mt-24 data-[vaul-drawer-direction=bottom]:max-h-[80vh] data-[vaul-drawer-direction=bottom]:rounded-t-xl data-[vaul-drawer-direction=bottom]:border-t data-[vaul-drawer-direction=left]:inset-y-0 data-[vaul-drawer-direction=left]:start-0 data-[vaul-drawer-direction=left]:w-3/4 data-[vaul-drawer-direction=left]:rounded-e-xl data-[vaul-drawer-direction=left]:border-e data-[vaul-drawer-direction=right]:inset-y-0 data-[vaul-drawer-direction=right]:end-0 data-[vaul-drawer-direction=right]:w-3/4 data-[vaul-drawer-direction=right]:rounded-s-xl data-[vaul-drawer-direction=right]:border-s data-[vaul-drawer-direction=top]:inset-x-0 data-[vaul-drawer-direction=top]:top-0 data-[vaul-drawer-direction=top]:mb-24 data-[vaul-drawer-direction=top]:max-h-[80vh] data-[vaul-drawer-direction=top]:rounded-b-xl data-[vaul-drawer-direction=top]:border-b data-[vaul-drawer-direction=left]:sm:max-w-sm data-[vaul-drawer-direction=right]:sm:max-w-sm\",\n          className\n        )}\n        {...props}\n      >\n        <div className=\"mx-auto mt-4 hidden h-1 w-[100px] shrink-0 rounded-full bg-muted group-data-[vaul-drawer-direction=bottom]/drawer-content:block\" />\n        {children}\n      </DrawerPrimitive.Content>\n    </DrawerPortal>\n  )\n}\n\nfunction DrawerHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"drawer-header\"\n      className={cn(\n        \"flex flex-col gap-0.5 p-4 group-data-[vaul-drawer-direction=bottom]/drawer-content:text-center group-data-[vaul-drawer-direction=top]/drawer-content:text-center md:gap-0.5 md:text-start\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction DrawerFooter({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"drawer-footer\"\n      className={cn(\"mt-auto flex flex-col gap-2 p-4\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction DrawerTitle({\n  className,\n  ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Title>) {\n  return (\n    <DrawerPrimitive.Title\n      data-slot=\"drawer-title\"\n      className={cn(\n        \"font-heading text-base font-medium text-foreground\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction DrawerDescription({\n  className,\n  ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Description>) {\n  return (\n    <DrawerPrimitive.Description\n      data-slot=\"drawer-description\"\n      className={cn(\"text-sm text-muted-foreground\", className)}\n      {...props}\n    />\n  )\n}\n\nexport {\n  Drawer,\n  DrawerPortal,\n  DrawerOverlay,\n  DrawerTrigger,\n  DrawerClose,\n  DrawerContent,\n  DrawerHeader,\n  DrawerFooter,\n  DrawerTitle,\n  DrawerDescription,\n}\n"]}

package/src/components/ui/drawer.tsx

@@ -1,134 +0,0 @@
-"use client"
-
-import * as React from "react"
-import { Drawer as DrawerPrimitive } from "vaul"
-
-import { cn } from "../../lib/utils"
-
-function Drawer({
-  ...props
-}: React.ComponentProps<typeof DrawerPrimitive.Root>) {
-  return <DrawerPrimitive.Root data-slot="drawer" {...props} />
-}
-
-function DrawerTrigger({
-  ...props
-}: React.ComponentProps<typeof DrawerPrimitive.Trigger>) {
-  return <DrawerPrimitive.Trigger data-slot="drawer-trigger" {...props} />
-}
-
-function DrawerPortal({
-  ...props
-}: React.ComponentProps<typeof DrawerPrimitive.Portal>) {
-  return <DrawerPrimitive.Portal data-slot="drawer-portal" {...props} />
-}
-
-function DrawerClose({
-  ...props
-}: React.ComponentProps<typeof DrawerPrimitive.Close>) {
-  return <DrawerPrimitive.Close data-slot="drawer-close" {...props} />
-}
-
-function DrawerOverlay({
-  className,
-  ...props
-}: React.ComponentProps<typeof DrawerPrimitive.Overlay>) {
-  return (
-    <DrawerPrimitive.Overlay
-      data-slot="drawer-overlay"
-      className={cn(
-        "fixed inset-0 z-50 bg-overlay duration-300 ease-out supports-backdrop-filter:backdrop-blur-xs data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0",
-        className
-      )}
-      {...props}
-    />
-  )
-}
-
-function DrawerContent({
-  className,
-  children,
-  ...props
-}: React.ComponentProps<typeof DrawerPrimitive.Content>) {
-  return (
-    <DrawerPortal data-slot="drawer-portal">
-      <DrawerOverlay />
-      <DrawerPrimitive.Content
-        data-slot="drawer-content"
-        className={cn(
-          "group/drawer-content fixed z-50 flex h-auto flex-col bg-background text-sm duration-300 ease-out outline-none data-[vaul-drawer-direction=bottom]:inset-x-0 data-[vaul-drawer-direction=bottom]:bottom-0 data-[vaul-drawer-direction=bottom]:mt-24 data-[vaul-drawer-direction=bottom]:max-h-[80vh] data-[vaul-drawer-direction=bottom]:rounded-t-xl data-[vaul-drawer-direction=bottom]:border-t data-[vaul-drawer-direction=left]:inset-y-0 data-[vaul-drawer-direction=left]:start-0 data-[vaul-drawer-direction=left]:w-3/4 data-[vaul-drawer-direction=left]:rounded-e-xl data-[vaul-drawer-direction=left]:border-e data-[vaul-drawer-direction=right]:inset-y-0 data-[vaul-drawer-direction=right]:end-0 data-[vaul-drawer-direction=right]:w-3/4 data-[vaul-drawer-direction=right]:rounded-s-xl data-[vaul-drawer-direction=right]:border-s data-[vaul-drawer-direction=top]:inset-x-0 data-[vaul-drawer-direction=top]:top-0 data-[vaul-drawer-direction=top]:mb-24 data-[vaul-drawer-direction=top]:max-h-[80vh] data-[vaul-drawer-direction=top]:rounded-b-xl data-[vaul-drawer-direction=top]:border-b data-[vaul-drawer-direction=left]:sm:max-w-sm data-[vaul-drawer-direction=right]:sm:max-w-sm",
-          className
-        )}
-        {...props}
-      >
-        <div className="mx-auto mt-4 hidden h-1 w-[100px] shrink-0 rounded-full bg-muted group-data-[vaul-drawer-direction=bottom]/drawer-content:block" />
-        {children}
-      </DrawerPrimitive.Content>
-    </DrawerPortal>
-  )
-}
-
-function DrawerHeader({ className, ...props }: React.ComponentProps<"div">) {
-  return (
-    <div
-      data-slot="drawer-header"
-      className={cn(
-        "flex flex-col gap-0.5 p-4 group-data-[vaul-drawer-direction=bottom]/drawer-content:text-center group-data-[vaul-drawer-direction=top]/drawer-content:text-center md:gap-0.5 md:text-start",
-        className
-      )}
-      {...props}
-    />
-  )
-}
-
-function DrawerFooter({ className, ...props }: React.ComponentProps<"div">) {
-  return (
-    <div
-      data-slot="drawer-footer"
-      className={cn("mt-auto flex flex-col gap-2 p-4", className)}
-      {...props}
-    />
-  )
-}
-
-function DrawerTitle({
-  className,
-  ...props
-}: React.ComponentProps<typeof DrawerPrimitive.Title>) {
-  return (
-    <DrawerPrimitive.Title
-      data-slot="drawer-title"
-      className={cn(
-        "font-heading text-base font-medium text-foreground",
-        className
-      )}
-      {...props}
-    />
-  )
-}
-
-function DrawerDescription({
-  className,
-  ...props
-}: React.ComponentProps<typeof DrawerPrimitive.Description>) {
-  return (
-    <DrawerPrimitive.Description
-      data-slot="drawer-description"
-      className={cn("text-sm text-muted-foreground", className)}
-      {...props}
-    />
-  )
-}
-
-export {
-  Drawer,
-  DrawerPortal,
-  DrawerOverlay,
-  DrawerTrigger,
-  DrawerClose,
-  DrawerContent,
-  DrawerHeader,
-  DrawerFooter,
-  DrawerTitle,
-  DrawerDescription,
-}

package/template/components/ui/drawer.tsx

@@ -1 +0,0 @@
-export * from "@exxatdesignux/ui/components/drawer"