impact-nova 1.6.6 → 1.7.0

package/dist/components/ui/data-table/index.js

@@ -1,22 +1,27 @@
-import { DataTable as t, DataTableContent as o, DataTableToolbar as r } from "./data-table.js";
-import { DATA_TABLE_SCOPED_SHEET_HOST_MIN_HEIGHT_PX as l } from "./data-table-constants.js";
-import { DataTableColumnList as b } from "./data-table-column-list.js";
-import { DataTableContext as p, useDataTable as n } from "./data-table-context.js";
-import { DataTableFormatOptions as f } from "./data-table-format-options.js";
-import { DataTableSheet as _, DataTableSheetContent as i, DataTableSheetHeader as C, DataTableSheetTrigger as E } from "./data-table-sheet.js";
-import { DataTableViewOptions as h } from "./data-table-view-options.js";
+import { DataTable as t, DataTableContent as T, DataTableToolbar as o } from "./data-table.js";
+import { DATA_TABLE_SCOPED_SHEET_HOST_MIN_HEIGHT_PX as D, TABLE_VIEWPORT_SHELL_EXPANDED_CLASS as l } from "./data-table-constants.js";
+import { DataTableColumnList as n } from "./data-table-column-list.js";
+import { DataTableContext as E, useDataTable as S } from "./data-table-context.js";
+import { DataTableFormatOptions as m } from "./data-table-format-options.js";
+import { DataTableSheet as x, DataTableSheetContent as f, DataTableSheetHeader as u, DataTableSheetTrigger as C } from "./data-table-sheet.js";
+import { DataTableViewMenuContent as w, DataTableViewMenuDensity as A, DataTableViewMenuSettingsItem as H, DataTableViewMenuTrigger as L, DataTableViewMenuViewportExpand as M } from "./data-table-view-menu.js";
 export {
-  l as DATA_TABLE_SCOPED_SHEET_HOST_MIN_HEIGHT_PX,
+  D as DATA_TABLE_SCOPED_SHEET_HOST_MIN_HEIGHT_PX,
   t as DataTable,
-  b as DataTableColumnList,
-  o as DataTableContent,
-  p as DataTableContext,
-  f as DataTableFormatOptions,
-  _ as DataTableSheet,
-  i as DataTableSheetContent,
-  C as DataTableSheetHeader,
-  E as DataTableSheetTrigger,
-  r as DataTableToolbar,
-  h as DataTableViewOptions,
-  n as useDataTable
+  n as DataTableColumnList,
+  T as DataTableContent,
+  E as DataTableContext,
+  m as DataTableFormatOptions,
+  x as DataTableSheet,
+  f as DataTableSheetContent,
+  u as DataTableSheetHeader,
+  C as DataTableSheetTrigger,
+  o as DataTableToolbar,
+  w as DataTableViewMenuContent,
+  A as DataTableViewMenuDensity,
+  H as DataTableViewMenuSettingsItem,
+  L as DataTableViewMenuTrigger,
+  M as DataTableViewMenuViewportExpand,
+  l as TABLE_VIEWPORT_SHELL_EXPANDED_CLASS,
+  S as useDataTable
 };

package/dist/components/ui/dropdown-menu.js

@@ -93,10 +93,16 @@ const w = l.forwardRef(({ className: a, children: n, checked: o, description: s,
     onSelect: (p) => p.preventDefault(),
     ...i,
     children: [
-      /* @__PURE__ */ t("span", { className: "absolute left-3 flex h-4 w-4 items-center justify-center", children: /* @__PURE__ */ t("div", { className: r(
-        "flex h-4 w-4 items-center justify-center rounded-[4px] border border-stroke transition-colors",
-        o && "bg-brand border-brand text-brand-foreground"
-      ), children: /* @__PURE__ */ t(e.ItemIndicator, { children: /* @__PURE__ */ t(f, { className: "h-3 w-3", strokeWidth: 3 }) }) }) }),
+      /* @__PURE__ */ t("span", { className: "absolute left-3 flex h-4 w-4 items-center justify-center", children: /* @__PURE__ */ t(
+        "div",
+        {
+          className: r(
+            "flex h-4 w-4 items-center justify-center rounded-[4px] border border-stroke transition-colors",
+            o && "bg-brand border-brand text-brand-foreground"
+          ),
+          children: /* @__PURE__ */ t(e.ItemIndicator, { children: /* @__PURE__ */ t(f, { className: "h-3 w-3", strokeWidth: 3 }) })
+        }
+      ) }),
       /* @__PURE__ */ c("div", { className: "flex items-center gap-2", children: [
         d && /* @__PURE__ */ t("span", { className: "flex-shrink-0 text-content-secondary [&>svg]:size-4", children: d }),
         /* @__PURE__ */ c("div", { className: "flex flex-col gap-0.5 justify-center", children: [

package/dist/components/ui/filter-strip/filter-summary.js

@@ -1,85 +1,85 @@
-import { jsxs as l, jsx as e } from "react/jsx-runtime";
-import * as s from "react";
-import { ChevronDown as F, Search as V } from "lucide-react";
-import { cn as b } from "../../../lib/utils.js";
-import { Popover as Y, PopoverTrigger as q, PopoverContent as H } from "../popover.js";
-import { Tooltip as v, TooltipTrigger as g, TooltipContent as y } from "../tooltip.js";
-import { Button as S } from "../button.js";
-import { Separator as w } from "../separator.js";
-import { Tabs as J, TabsList as K, TabsTrigger as N } from "../tabs.js";
-import { Input as U } from "../input.js";
-import { Badge as W } from "../badge.js";
-import { Skeleton as X } from "../skeleton.js";
-import { useImpactNovaI18n as Z } from "../../../i18n/ImpactNovaI18nContext.js";
-const he = ({
-  selectedFilter: c,
-  onSelectedFilterChange: C,
-  savedFilters: T,
-  recentFilters: m,
-  onApplySavedFilter: k,
-  onSavedFilterSearch: p,
-  onSavedFiltersScroll: P,
-  onDropdownOpenChange: A,
-  isLoadingFilterPreferencesList: j = !1,
-  onEditSavedFilter: $,
-  onDeleteSavedFilter: ee,
-  onSetDefaultSavedFilter: te
+import { jsxs as l, jsx as e, Fragment as K } from "react/jsx-runtime";
+import * as i from "react";
+import { ChevronDown as U, Search as W, Trash2 as X, Pencil as Z, Star as ee } from "lucide-react";
+import { cn as c } from "../../../lib/utils.js";
+import { Popover as te, PopoverTrigger as ae, PopoverContent as le } from "../popover.js";
+import { Tooltip as p, TooltipTrigger as f, TooltipContent as h } from "../tooltip.js";
+import { Button as M } from "../button.js";
+import { Separator as I } from "../separator.js";
+import { Tabs as re, TabsList as ne, TabsTrigger as j } from "../tabs.js";
+import { Input as ie } from "../input.js";
+import { Badge as se } from "../badge.js";
+import { Skeleton as oe } from "../skeleton.js";
+import { useImpactNovaI18n as ce } from "../../../i18n/ImpactNovaI18nContext.js";
+const Ce = ({
+  selectedFilter: m,
+  onSelectedFilterChange: O,
+  savedFilters: $,
+  recentFilters: C,
+  onApplySavedFilter: B,
+  onSavedFilterSearch: y,
+  onSavedFiltersScroll: G,
+  onDropdownOpenChange: L,
+  isLoadingFilterPreferencesList: Q = !1,
+  onEditSavedFilter: w,
+  onDeleteSavedFilter: S,
+  onSetDefaultSavedFilter: k
 }) => {
-  const { t: r } = Z(), [d, h] = s.useState(!1), I = (a) => {
-    h(a), A?.(a);
-  }, [u, M] = s.useState(""), [f, O] = s.useState(""), [n, D] = s.useState("All"), [i, x] = s.useState(null);
-  s.useEffect(() => {
+  const { t: r } = ce(), [u, T] = i.useState(!1), _ = (a) => {
+    T(a), L?.(a);
+  }, [P, D] = i.useState(""), [b, E] = i.useState(""), [n, F] = i.useState("All"), [s, A] = i.useState(null);
+  i.useEffect(() => {
     const a = setTimeout(() => {
-      O(u);
+      E(P);
     }, 300);
     return () => clearTimeout(a);
-  }, [u]), s.useEffect(() => {
-    p && p(
-      f,
+  }, [P]), i.useEffect(() => {
+    y && y(
+      b,
       n === "All" ? void 0 : n
     );
-  }, [f, n, p]), s.useEffect(() => {
-    d && x({ label: c });
-  }, [d, c]);
-  const E = (a) => {
-    M(a.target.value);
-  }, G = () => {
-    i && (C?.(i.label), i.savedItem && k?.(i.savedItem), h(!1));
-  }, L = () => {
-    h(!1);
-  }, Q = () => !m || m.length === 0 ? null : /* @__PURE__ */ l("div", { className: "flex flex-col", children: [
+  }, [b, n, y]), i.useEffect(() => {
+    u && A({ label: m });
+  }, [u, m]);
+  const z = (a) => {
+    D(a.target.value);
+  }, R = () => {
+    s && (O?.(s.label), s.savedItem && B?.(s.savedItem), T(!1));
+  }, V = () => {
+    T(!1);
+  }, Y = () => !C || C.length === 0 ? null : /* @__PURE__ */ l("div", { className: "flex flex-col", children: [
     /* @__PURE__ */ e("div", { className: "px-1 py-[6px] text-xs font-medium text-[#60697d] font-['Manrope']", children: "Recent" }),
-    /* @__PURE__ */ e("div", { className: "mb-[6px] flex flex-col", children: m.map((a, t) => {
-      const o = a.map((z) => z.label).join(", "), B = i?.label === o;
+    /* @__PURE__ */ e("div", { className: "mb-[6px] flex flex-col", children: C.map((a, d) => {
+      const o = a.map((N) => N.label).join(", "), x = s?.label === o;
       return /* @__PURE__ */ e(
         "button",
         {
           type: "button",
-          className: b(
+          className: c(
             "flex cursor-pointer flex-row px-3 py-2 rounded-lg hover:bg-[#f5f6fa] w-full text-left bg-transparent border-none",
-            B && "bg-[#edf0ff]"
+            x && "bg-[#edf0ff]"
           ),
-          onClick: () => x({ label: o }),
-          children: /* @__PURE__ */ l(v, { children: [
-            /* @__PURE__ */ e(g, { asChild: !0, children: /* @__PURE__ */ e("span", { className: "text-sm font-['Manrope'] truncate text-[#1f2b4d]", children: o }) }),
-            /* @__PURE__ */ e(y, { variant: "tertiary", side: "right", children: o })
+          onClick: () => A({ label: o }),
+          children: /* @__PURE__ */ l(p, { children: [
+            /* @__PURE__ */ e(f, { asChild: !0, children: /* @__PURE__ */ e("span", { className: "text-sm font-['Manrope'] truncate text-[#1f2b4d]", children: o }) }),
+            /* @__PURE__ */ e(h, { variant: "tertiary", side: "right", children: o })
           ] })
         },
-        t
+        d
       );
     }) }),
-    /* @__PURE__ */ e(w, { className: "mb-2" })
-  ] }), _ = () => {
-    if (j)
-      return /* @__PURE__ */ e("div", { className: "flex max-h-[160px] flex-col overflow-y-auto px-3 py-2 space-y-2", children: [1, 2, 3, 4, 5].map((t) => /* @__PURE__ */ e(X, { className: "h-9 w-full rounded-lg" }, t)) });
-    let a = T?.filter(
+    /* @__PURE__ */ e(I, { className: "mb-2" })
+  ] }), q = () => {
+    if (Q)
+      return /* @__PURE__ */ e("div", { className: "flex max-h-[160px] flex-col overflow-y-auto px-3 py-2 space-y-2", children: [1, 2, 3, 4, 5].map((t) => /* @__PURE__ */ e(oe, { className: "h-9 w-full rounded-lg" }, t)) });
+    let a = $?.filter(
       (t) => n === "All" || t.type === n
     );
-    if (!p && f && (a = a?.filter(
-      (t) => t.label.toLowerCase().includes(f.toLowerCase())
+    if (!y && b && (a = a?.filter(
+      (t) => t.label.toLowerCase().includes(b.toLowerCase())
     )), !a || a.length === 0) {
       let t = "No saved filters found";
-      if (!!f)
+      if (!!b)
         switch (n) {
           case "Personal":
             t = "No personal filters match your search";
@@ -103,118 +103,198 @@ const he = ({
         }
       return /* @__PURE__ */ e("div", { className: "flex flex-col items-center justify-center py-8 text-center min-h-[100px] px-6", children: /* @__PURE__ */ e("span", { className: "text-sm text-[#60697d] font-['Manrope'] leading-relaxed", children: t }) });
     }
-    return /* @__PURE__ */ e(
-      "div",
-      {
-        className: "flex max-h-[160px] flex-col gap-1 overflow-y-auto px-1",
-        onScroll: P,
-        children: a.map((t) => {
-          const o = i?.label === t.label;
-          return /* @__PURE__ */ e(
-            "button",
-            {
-              type: "button",
-              className: b(
-                "flex justify-between cursor-pointer rounded-lg px-3 py-2 text-sm font-medium font-['Manrope'] hover:bg-[#f5f6fa] w-full text-left bg-transparent border-none",
-                o ? "bg-[#edf0ff]" : "text-[#1f2b4d]"
-              ),
-              onClick: () => x({ label: t.label, savedItem: t }),
-              children: /* @__PURE__ */ l(v, { children: [
-                /* @__PURE__ */ e(g, { asChild: !0, children: /* @__PURE__ */ e("span", { className: "truncate", children: t.label }) }),
-                /* @__PURE__ */ e(y, { variant: "tertiary", side: "right", children: t.label })
+    const d = w || S || k, o = a.find((t) => t.isDefault), x = a.filter((t) => !t.isDefault), N = (t, g = !1) => {
+      const J = s?.label === t.label;
+      return /* @__PURE__ */ l(
+        "button",
+        {
+          type: "button",
+          className: c(
+            "group mb-1 flex items-center justify-between cursor-pointer rounded-lg px-3 py-2 text-sm font-medium font-['Manrope'] hover:bg-[#f5f6fa] w-full text-left bg-transparent border-none",
+            J ? "bg-[#edf0ff]" : "text-[#1f2b4d]"
+          ),
+          onClick: () => A({ label: t.label, savedItem: t }),
+          children: [
+            /* @__PURE__ */ l(p, { children: [
+              /* @__PURE__ */ e(f, { asChild: !0, children: /* @__PURE__ */ e("span", { className: "truncate flex-1 min-w-0", children: t.label }) }),
+              /* @__PURE__ */ e(h, { variant: "tertiary", side: "right", children: t.label })
+            ] }),
+            d && /* @__PURE__ */ l("div", { className: c(
+              "flex items-center gap-1 ml-2 transition-opacity shrink-0",
+              g ? "opacity-100" : "opacity-0 pointer-events-none group-hover:opacity-100 group-hover:pointer-events-auto"
+            ), children: [
+              S && /* @__PURE__ */ l(p, { children: [
+                /* @__PURE__ */ e(f, { asChild: !0, children: /* @__PURE__ */ e(
+                  "button",
+                  {
+                    type: "button",
+                    tabIndex: -1,
+                    "aria-label": `${r("filterStrip.deleteFilter")} ${t.label}`,
+                    className: c(
+                      "p-1 rounded transition-colors hover:bg-[#e6e8f0]",
+                      g && "opacity-0 group-hover:opacity-100"
+                    ),
+                    onClick: (v) => {
+                      v.stopPropagation(), S(t);
+                    },
+                    children: /* @__PURE__ */ e(X, { className: "h-3.5 w-3.5 text-[#60697d]" })
+                  }
+                ) }),
+                /* @__PURE__ */ e(h, { variant: "tertiary", side: "top", children: r("filterStrip.deleteFilter") })
+              ] }),
+              w && /* @__PURE__ */ l(p, { children: [
+                /* @__PURE__ */ e(f, { asChild: !0, children: /* @__PURE__ */ e(
+                  "button",
+                  {
+                    type: "button",
+                    tabIndex: -1,
+                    "aria-label": `${r("filterStrip.editFilter")} ${t.label}`,
+                    className: c(
+                      "p-1 rounded transition-colors hover:bg-[#e6e8f0]",
+                      g && "opacity-0 group-hover:opacity-100"
+                    ),
+                    onClick: (v) => {
+                      v.stopPropagation(), w(t);
+                    },
+                    children: /* @__PURE__ */ e(Z, { className: "h-3.5 w-3.5 text-[#60697d]" })
+                  }
+                ) }),
+                /* @__PURE__ */ e(h, { variant: "tertiary", side: "top", children: r("filterStrip.editFilter") })
+              ] }),
+              k && /* @__PURE__ */ l(p, { children: [
+                /* @__PURE__ */ e(f, { asChild: !0, children: /* @__PURE__ */ e(
+                  "button",
+                  {
+                    type: "button",
+                    tabIndex: g ? 0 : -1,
+                    "aria-label": `${t.isDefault ? r("filterStrip.defaultFilter") : r("filterStrip.setAsDefault")} ${t.label}`,
+                    className: "p-1 rounded hover:bg-[#e6e8f0] transition-colors",
+                    onClick: (v) => {
+                      v.stopPropagation(), k(t);
+                    },
+                    children: /* @__PURE__ */ e(
+                      ee,
+                      {
+                        className: c(
+                          "h-3.5 w-3.5",
+                          t.isDefault ? "text-[#E1BC29] fill-[#E1BC29]" : "text-[#60697d]"
+                        )
+                      }
+                    )
+                  }
+                ) }),
+                /* @__PURE__ */ e(h, { variant: "tertiary", side: "top", children: t.isDefault ? r("filterStrip.defaultFilter") : r("filterStrip.setAsDefault") })
               ] })
-            },
-            t.id
-          );
-        })
-      }
-    );
-  }, R = i?.label !== c;
-  return /* @__PURE__ */ l(Y, { open: d, onOpenChange: I, children: [
-    /* @__PURE__ */ e(q, { asChild: !0, children: /* @__PURE__ */ l(
+            ] })
+          ]
+        },
+        t.id
+      );
+    };
+    return /* @__PURE__ */ l("div", { className: "flex flex-col", children: [
+      o && /* @__PURE__ */ l(K, { children: [
+        N(o, !0),
+        x.length > 0 && /* @__PURE__ */ e(I, { className: "my-1" })
+      ] }),
+      x.length > 0 && /* @__PURE__ */ e(
+        "div",
+        {
+          className: "flex max-h-[160px] flex-col overflow-y-auto",
+          onScroll: G,
+          children: x.map((t) => N(t, !1))
+        }
+      )
+    ] });
+  }, H = s?.label !== m;
+  return /* @__PURE__ */ l(te, { open: u, onOpenChange: _, children: [
+    /* @__PURE__ */ e(ae, { asChild: !0, children: /* @__PURE__ */ l(
       "button",
       {
         type: "button",
         className: "flex cursor-pointer items-center gap-2 bg-transparent border-none p-0",
         "aria-label": r("filterStrip.selectFilter"),
-        "aria-expanded": d,
+        "aria-expanded": u,
         "aria-haspopup": "dialog",
         children: [
           /* @__PURE__ */ e("span", { className: "text-sm font-medium text-[#60697d] font-['Manrope']", children: r("filterStrip.filtersApplied") }),
-          /* @__PURE__ */ l(v, { children: [
-            /* @__PURE__ */ e(g, { asChild: !0, children: /* @__PURE__ */ e(
-              W,
+          /* @__PURE__ */ l(p, { children: [
+            /* @__PURE__ */ e(f, { asChild: !0, children: /* @__PURE__ */ e(
+              se,
               {
                 color: "primary",
                 variant: "outline",
-                className: "font-['Manrope'] max-w-[140px]",
-                children: c || r("filterStrip.notSelected")
+                className: "font-['Manrope'] max-w-[140px] inline-block",
+                children: /* @__PURE__ */ e("span", { className: "block truncate", children: m || r("filterStrip.notSelected") })
               }
             ) }),
-            /* @__PURE__ */ e(y, { variant: "tertiary", side: "top", children: c || r("filterStrip.notSelected") })
+            /* @__PURE__ */ e(h, { variant: "tertiary", side: "top", children: m || r("filterStrip.notSelected") })
           ] }),
           /* @__PURE__ */ e(
             "div",
             {
-              className: b(
+              className: c(
                 "flex h-8 w-8 items-center justify-center rounded-lg bg-[#f5f6fa] transition-transform duration-200",
-                d && "rotate-180"
+                u && "rotate-180"
               ),
               "aria-hidden": "true",
-              children: /* @__PURE__ */ e(F, { className: "h-4 w-4 text-[#1f2b4d]" })
+              children: /* @__PURE__ */ e(U, { className: "h-4 w-4 text-[#1f2b4d]" })
             }
           )
         ]
       }
     ) }),
     /* @__PURE__ */ e(
-      H,
+      le,
       {
         align: "start",
         className: "w-[280px] p-0 shadow-[0_0_4px_0_rgba(0,0,0,0.12)] overflow-visible",
         sideOffset: 8,
+        onInteractOutside: (a) => {
+          const d = a.target;
+          (d.closest('[role="dialog"]') || d.closest("[data-radix-dialog-content]")) && a.preventDefault();
+        },
         children: /* @__PURE__ */ l("div", { className: "flex w-full flex-col py-[8px] px-[6px]", children: [
-          Q(),
+          Y(),
           /* @__PURE__ */ l("div", { className: "flex flex-col", children: [
             /* @__PURE__ */ e("div", { className: "px-1 py-[6px] text-xs font-medium text-[#60697d] font-['Manrope']", children: r("filterStrip.savedFilters") }),
             /* @__PURE__ */ l(
-              J,
+              re,
               {
                 value: n,
-                onValueChange: (a) => D(a),
+                onValueChange: (a) => F(a),
                 variant: "outline",
                 size: "sm",
                 className: "w-full px-1",
                 children: [
-                  /* @__PURE__ */ e("div", { className: "py-[8px]", children: /* @__PURE__ */ l(K, { children: [
-                    /* @__PURE__ */ e(N, { value: "All", children: "All" }),
-                    /* @__PURE__ */ e(N, { value: "Global", children: "Global" }),
-                    /* @__PURE__ */ e(N, { value: "Personal", children: "Personal" })
+                  /* @__PURE__ */ e("div", { className: "py-[8px]", children: /* @__PURE__ */ l(ne, { children: [
+                    /* @__PURE__ */ e(j, { value: "All", children: "All" }),
+                    /* @__PURE__ */ e(j, { value: "Global", children: "Global" }),
+                    /* @__PURE__ */ e(j, { value: "Personal", children: "Personal" })
                   ] }) }),
                   /* @__PURE__ */ e("div", { className: "pb-[8px]", children: /* @__PURE__ */ e(
-                    U,
+                    ie,
                     {
-                      prefix: /* @__PURE__ */ e(V, { className: "h-4 w-4 text-gray-500" }),
+                      prefix: /* @__PURE__ */ e(W, { className: "h-4 w-4 text-gray-500" }),
                       placeholder: r("filterStrip.searchFiltersPlaceholder"),
-                      value: u,
-                      onChange: E,
+                      value: P,
+                      onChange: z,
                       className: "h-9 px-1 border-none shadow-none focus-visible:ring-0"
                     }
                   ) }),
-                  /* @__PURE__ */ e("div", { className: "mt-0", children: _() })
+                  /* @__PURE__ */ e("div", { className: "mt-0", children: q() })
                 ]
               }
             )
           ] }),
-          /* @__PURE__ */ e(w, { className: "my-2" }),
+          /* @__PURE__ */ e(I, { className: "my-2" }),
           /* @__PURE__ */ l("div", { className: "flex justify-end gap-2 px-3 pb-1", children: [
-            /* @__PURE__ */ e(S, { variant: "secondary", onClick: L, children: r("prompt.cancel") }),
+            /* @__PURE__ */ e(M, { variant: "secondary", onClick: V, children: r("prompt.cancel") }),
             /* @__PURE__ */ e(
-              S,
+              M,
               {
                 variant: "default",
-                onClick: G,
-                disabled: !R,
+                onClick: R,
+                disabled: !H,
                 children: r("filterStrip.applyFilter")
               }
             )
@@ -225,5 +305,5 @@ const he = ({
   ] });
 };
 export {
-  he as FilterSummary
+  Ce as FilterSummary
 };

package/dist/components/ui/sheet.js

@@ -37,32 +37,53 @@ const R = S(
       side: "right"
     }
   }
-), L = n.forwardRef(({ side: t = "right", className: a, children: s, expandable: c = !1, defaultExpanded: l = !1, onOpenAutoFocus: f, ...u }, g) => {
-  const [d, p] = n.useState(l), m = n.useCallback(() => {
-    p((h) => !h);
-  }, []);
-  return /* @__PURE__ */ e(N.Provider, { value: { isExpanded: d, onExpandToggle: m, expandable: c, side: t || void 0 }, children: /* @__PURE__ */ i(E, { children: [
-    /* @__PURE__ */ e(v, {}),
-    /* @__PURE__ */ e(
-      o.Content,
+), L = n.forwardRef(
+  ({
+    side: t = "right",
+    className: a,
+    children: s,
+    expandable: c = !1,
+    defaultExpanded: l = !1,
+    onOpenAutoFocus: f,
+    ...u
+  }, g) => {
+    const [d, p] = n.useState(l), m = n.useCallback(() => {
+      p((h) => !h);
+    }, []);
+    return /* @__PURE__ */ e(
+      N.Provider,
       {
-        ref: g,
-        "data-component": "sheet-content",
-        onOpenAutoFocus: (h) => {
-          h.preventDefault(), f?.(h);
+        value: {
+          isExpanded: d,
+          onExpandToggle: m,
+          expandable: c,
+          side: t || void 0
         },
-        className: r(
-          R({ side: t }),
-          "flex flex-col p-0 transition-all duration-300",
-          t === "bottom" && (d ? "h-[96vh]" : "h-[40vh]"),
-          a
-        ),
-        ...u,
-        children: s
+        children: /* @__PURE__ */ i(E, { children: [
+          /* @__PURE__ */ e(v, {}),
+          /* @__PURE__ */ e(
+            o.Content,
+            {
+              ref: g,
+              "data-component": "sheet-content",
+              onOpenAutoFocus: (h) => {
+                h.preventDefault(), f?.(h);
+              },
+              className: r(
+                R({ side: t }),
+                "flex flex-col p-0 transition-all duration-300",
+                t === "bottom" && (d ? "h-[96vh]" : "h-[40vh]"),
+                a
+              ),
+              ...u,
+              children: s
+            }
+          )
+        ] })
       }
-    )
-  ] }) });
-});
+    );
+  }
+);
 L.displayName = o.Content.displayName;
 const j = ({
   className: t,
@@ -100,10 +121,18 @@ const j = ({
             /* @__PURE__ */ e(y, { variant: "tertiary", side: "top", children: l ? m : p })
           ] }),
           /* @__PURE__ */ i(x, { children: [
-            /* @__PURE__ */ e(b, { asChild: !0, children: /* @__PURE__ */ i(D, { "data-component": "sheet-close", className: "rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none", "aria-label": d, children: [
-              /* @__PURE__ */ e(T, { className: "h-4 w-4" }),
-              /* @__PURE__ */ e("span", { className: "sr-only", children: d })
-            ] }) }),
+            /* @__PURE__ */ e(b, { asChild: !0, children: /* @__PURE__ */ i(
+              D,
+              {
+                "data-component": "sheet-close",
+                className: "rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none",
+                "aria-label": d,
+                children: [
+                  /* @__PURE__ */ e(T, { className: "h-4 w-4" }),
+                  /* @__PURE__ */ e("span", { className: "sr-only", children: d })
+                ]
+              }
+            ) }),
             /* @__PURE__ */ e(y, { variant: "tertiary", side: "top", children: d })
           ] })
         ] })
@@ -115,13 +144,7 @@ j.displayName = "SheetHeader";
 const O = ({
   className: t,
   ...a
-}) => /* @__PURE__ */ e(
-  "div",
-  {
-    className: r("flex-1 overflow-y-auto p-4", t),
-    ...a
-  }
-);
+}) => /* @__PURE__ */ e("div", { className: r("flex-1 overflow-y-auto p-4", t), ...a });
 O.displayName = "SheetBody";
 const P = ({
   className: t,