@cryptlex/web-components 1.3.4 → 1.4.0

package/dist/components/key-value-card/key-value-card.es.js

@@ -0,0 +1,87 @@
+import { jsxs as m, jsx as t } from "react/jsx-runtime";
+import { Badge as c } from "../ui/badge.es.js";
+import "../ui/accordion.es.js";
+import "../ui/avatar.es.js";
+import "../ui/breadcrumb.es.js";
+import "../ui/button.es.js";
+import "../ui/calendar.es.js";
+import { Card as l, CardHeader as d, CardTitle as f, CardContent as h } from "../ui/card.es.js";
+import "../ui/chart.es.js";
+import "../ui/checkbox.es.js";
+import "@radix-ui/react-collapsible";
+import "../ui/command.es.js";
+import { CopyButton as u } from "../ui/copy-button.es.js";
+import "../ui/dialog.es.js";
+import "../ui/drawer.es.js";
+import "../ui/dropdown-menu.es.js";
+import "../ui/form.es.js";
+import "../ui/input.es.js";
+import "../ui/input-otp.es.js";
+import "../ui/label.es.js";
+import { Link as x } from "@tanstack/react-router";
+import "lucide-react";
+import "../ui/mutli-select.es.js";
+import "../ui/navigation-menu.es.js";
+import "../ui/pagination.es.js";
+import "../ui/password-input.es.js";
+import "../ui/popover.es.js";
+import "../ui/radio-group.es.js";
+import "react";
+import "../ui/select.es.js";
+import "../ui/separator.es.js";
+import "../ui/sheet.es.js";
+import "../ui/sidebar.es.js";
+import { Skeleton as y } from "../ui/skeleton.es.js";
+import "sonner";
+import "../ui/table.es.js";
+import "../ui/tabs.es.js";
+import "../ui/tooltip.es.js";
+import { FormatDate as w } from "../data-table/table-utils/date.es.js";
+const ir = ({ data: e, label: s, fields: n }) => {
+  const a = (p, r) => {
+    if (p.transform)
+      return p.transform(r);
+    if (!r)
+      return "-";
+    switch (p.type) {
+      case "link":
+        return /* @__PURE__ */ t(x, { to: r, children: r });
+      case "copyButton":
+        return /* @__PURE__ */ t(u, { value: r });
+      case "date":
+        return /* @__PURE__ */ t("span", { children: w(r) });
+      case "yesno":
+        return /* @__PURE__ */ t("span", { children: r ? "Yes" : "No" });
+      case "badge":
+        return /* @__PURE__ */ t("div", { className: "flex flex-wrap gap-1", children: Array.isArray(r) ? r.map((o, i) => /* @__PURE__ */ t(c, { variant: "secondary", children: typeof o == "object" ? (o == null ? void 0 : o.name) || (o == null ? void 0 : o.id) : o }, i)) : r });
+      case "boolean":
+        return /* @__PURE__ */ t("span", { children: r.toString() });
+      default:
+        return /* @__PURE__ */ t("span", { children: r });
+    }
+  };
+  return /* @__PURE__ */ m(l, { children: [
+    /* @__PURE__ */ t(d, { children: /* @__PURE__ */ t(f, { children: s }) }),
+    /* @__PURE__ */ t(h, { children: /* @__PURE__ */ t("div", { className: "flex flex-col gap-2", children: e ? n.map((p) => {
+      const r = p.accessor ? p.accessor.split(".").reduce(
+        (o, i) => o && i in o ? o[i] : void 0,
+        e
+      ) : null;
+      return /* @__PURE__ */ m(
+        "div",
+        {
+          className: "flex w-full flex-col md:flex-row justify-between first:pt-0 last:pb-0",
+          children: [
+            /* @__PURE__ */ t("p", { className: "text-sm flex w-full justify-start col-span-1", children: p.display }),
+            /* @__PURE__ */ t("div", { className: "text-sm flex w-full justify-start text-wrap break-all", children: a(p, r) })
+          ]
+        },
+        p.display
+      );
+    }) : n.map((p, r) => /* @__PURE__ */ t(y, { className: "h-12 w-full" }, r)) }) })
+  ] });
+};
+export {
+  ir as KeyValueCard
+};
+//# sourceMappingURL=key-value-card.es.js.map

package/dist/components/key-value-card/key-value-card.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"key-value-card.es.js","sources":["../../../lib/components/key-value-card/key-value-card.tsx"],"sourcesContent":["import { Badge } from '@/components/ui/badge';\nimport {\n  Card,\n  CardContent,\n  CardHeader,\n  CardTitle,\n  CopyButton,\n  FormatDate,\n  Skeleton,\n} from '@/index';\nimport { Link } from '@tanstack/react-router';\n\n// Utility type to handle nested keys (dot notation) in any object\ntype NestedKeyOf<T> = T extends object\n  ? {\n      [K in keyof T]: K extends string | number\n        ? `${K & string}` | `${K & string}.${NestedKeyOf<T[K]>}`\n        : never;\n    }[keyof T]\n  : never;\n\n// DisplayField type that works with nested keys\nexport type DisplayField<T> = {\n  display: string;\n  accessor: NestedKeyOf<T>;\n  type?: 'text' | 'badge' | 'boolean' | 'date' | 'yesno' | 'copyButton' | 'link'; // Field types\n  transform?: (value: any) => React.ReactNode;\n};\n\nexport interface KeyValueCardProps<T> {\n  data: T; // Ensure data is of type T\n  label: string;\n  fields: DisplayField<T>[];\n  className?: string;\n}\n\nexport const KeyValueCard = <T extends {}>({ data, label, fields }: KeyValueCardProps<T>) => {\n  const renderValue = (field: DisplayField<T>, value: any) => {\n    if (field.transform) {\n      return field.transform(value);\n    }\n    if (!value) {\n      return '-';\n    }\n    switch (field.type) {\n      case 'link':\n        return <Link to={value}>{value}</Link>;\n      case 'copyButton':\n        return <CopyButton value={value} />;\n      case 'date':\n        return <span>{FormatDate(value)}</span>;\n      case 'yesno':\n        return <span>{value ? 'Yes' : 'No'}</span>;\n      case 'badge':\n        return (\n          <div className=\"flex flex-wrap gap-1\">\n            {Array.isArray(value)\n              ? value.map((item, index) => (\n                  <Badge key={index} variant=\"secondary\">\n                    {typeof item === 'object' ? item?.name || item?.id : item}\n                  </Badge>\n                ))\n              : value}\n          </div>\n        );\n\n      case 'boolean':\n        return <span>{value.toString()}</span>;\n      default:\n        return <span>{value}</span>;\n    }\n  };\n\n  return (\n    <Card>\n      <CardHeader>\n        <CardTitle>{label}</CardTitle>\n      </CardHeader>\n      <CardContent>\n        <div className=\"flex flex-col gap-2\">\n          {data\n            ? fields.map((field) => {\n                // TODO: improve this\n                const value = field.accessor\n                  ? field.accessor\n                      .split('.')\n                      .reduce(\n                        (obj, key) => (obj && key in obj ? obj[key] : undefined),\n                        data as Record<string, any>,\n                      )\n                  : null;\n\n                return (\n                  <div\n                    key={field.display}\n                    className=\"flex w-full flex-col md:flex-row justify-between first:pt-0 last:pb-0\"\n                  >\n                    <p className=\"text-sm flex w-full justify-start col-span-1\">{field.display}</p>\n                    <div className=\"text-sm flex w-full justify-start text-wrap break-all\">\n                      {renderValue(field, value)}\n                    </div>\n                  </div>\n                );\n              })\n            : fields.map((_, index) => <Skeleton key={index} className=\"h-12 w-full\" />)}\n        </div>\n      </CardContent>\n    </Card>\n  );\n};\n"],"names":["KeyValueCard","data","label","fields","renderValue","field","value","jsx","Link","CopyButton","FormatDate","item","index","Badge","Card","CardHeader","CardTitle","CardContent","obj","key","jsxs","_","Skeleton"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoCO,MAAMA,KAAe,CAAe,EAAE,MAAAC,GAAM,OAAAC,GAAO,QAAAC,QAAmC;AACrF,QAAAC,IAAc,CAACC,GAAwBC,MAAe;AAC1D,QAAID,EAAM;AACD,aAAAA,EAAM,UAAUC,CAAK;AAE9B,QAAI,CAACA;AACI,aAAA;AAET,YAAQD,EAAM,MAAM;AAAA,MAClB,KAAK;AACH,eAAQ,gBAAAE,EAAAC,GAAA,EAAK,IAAIF,GAAQ,UAAMA,GAAA;AAAA,MACjC,KAAK;AACI,eAAA,gBAAAC,EAACE,KAAW,OAAAH,GAAc;AAAA,MACnC,KAAK;AACH,eAAQ,gBAAAC,EAAA,QAAA,EAAM,UAAWG,EAAAJ,CAAK,GAAE;AAAA,MAClC,KAAK;AACH,eAAQ,gBAAAC,EAAA,QAAA,EAAM,UAAQD,IAAA,QAAQ,MAAK;AAAA,MACrC,KAAK;AACH,eACG,gBAAAC,EAAA,OAAA,EAAI,WAAU,wBACZ,UAAM,MAAA,QAAQD,CAAK,IAChBA,EAAM,IAAI,CAACK,GAAMC,MACf,gBAAAL,EAACM,GAAkB,EAAA,SAAQ,aACxB,UAAA,OAAOF,KAAS,YAAWA,KAAA,gBAAAA,EAAM,UAAQA,KAAA,gBAAAA,EAAM,MAAKA,EAD3C,GAAAC,CAEZ,CACD,IACDN,GACN;AAAA,MAGJ,KAAK;AACH,eAAQ,gBAAAC,EAAA,QAAA,EAAM,UAAMD,EAAA,SAAA,GAAW;AAAA,MACjC;AACS,eAAA,gBAAAC,EAAC,UAAM,UAAMD,EAAA,CAAA;AAAA,IAAA;AAAA,EAE1B;AAEA,2BACGQ,GACC,EAAA,UAAA;AAAA,IAAA,gBAAAP,EAACQ,GACC,EAAA,UAAA,gBAAAR,EAACS,GAAW,EAAA,UAAAd,EAAM,CAAA,GACpB;AAAA,IACA,gBAAAK,EAACU,GACC,EAAA,UAAA,gBAAAV,EAAC,OAAI,EAAA,WAAU,uBACZ,UACGN,IAAAE,EAAO,IAAI,CAACE,MAAU;AAEpB,YAAMC,IAAQD,EAAM,WAChBA,EAAM,SACH,MAAM,GAAG,EACT;AAAA,QACC,CAACa,GAAKC,MAASD,KAAOC,KAAOD,IAAMA,EAAIC,CAAG,IAAI;AAAA,QAC9ClB;AAAA,MAAA,IAEJ;AAGF,aAAA,gBAAAmB;AAAA,QAAC;AAAA,QAAA;AAAA,UAEC,WAAU;AAAA,UAEV,UAAA;AAAA,YAAA,gBAAAb,EAAC,KAAE,EAAA,WAAU,gDAAgD,UAAAF,EAAM,SAAQ;AAAA,8BAC1E,OAAI,EAAA,WAAU,yDACZ,UAAYD,EAAAC,GAAOC,CAAK,EAC3B,CAAA;AAAA,UAAA;AAAA,QAAA;AAAA,QANKD,EAAM;AAAA,MAOb;AAAA,IAEH,CAAA,IACDF,EAAO,IAAI,CAACkB,GAAGT,MAAW,gBAAAL,EAAAe,GAAA,EAAqB,WAAU,cAAA,GAAjBV,CAA+B,CAAE,EAC/E,CAAA,EACF,CAAA;AAAA,EAAA,GACF;AAEJ;"}

package/dist/components/sidebar/app-layout.es.js

@@ -1,33 +1,35 @@
-import { jsxs as t, jsx as r } from "react/jsx-runtime";
-import { SideBar as p } from "./sidebar.es.js";
-import { SidebarProvider as l, SidebarTrigger as c } from "../ui/sidebar.es.js";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
+import { BreadCrumbs as p } from "./breadcrumb.es.js";
+import { SideBar as l } from "./sidebar.es.js";
+import { SidebarProvider as a, SidebarTrigger as c } from "../ui/sidebar.es.js";
 import "../ui/accordion.es.js";
-import { Avatar as a, AvatarImage as n, AvatarFallback as d } from "../ui/avatar.es.js";
+import { Avatar as n, AvatarImage as d, AvatarFallback as f } from "../ui/avatar.es.js";
 import "../ui/badge.es.js";
 import "../ui/breadcrumb.es.js";
-import { Button as s } from "../ui/button.es.js";
+import "../ui/button.es.js";
 import "../ui/calendar.es.js";
 import "../ui/card.es.js";
 import "../ui/chart.es.js";
 import "../ui/checkbox.es.js";
 import "@radix-ui/react-collapsible";
 import "../ui/command.es.js";
+import { LogOut as h } from "lucide-react";
+import "react";
 import "../ui/dialog.es.js";
 import "../ui/drawer.es.js";
-import { DropdownMenu as h, DropdownMenuTrigger as f, DropdownMenuContent as g, DropdownMenuItem as v } from "../ui/dropdown-menu.es.js";
+import { DropdownMenu as s, DropdownMenuTrigger as v, DropdownMenuContent as x, DropdownMenuItem as g } from "../ui/dropdown-menu.es.js";
 import "../ui/form.es.js";
 import "../ui/input.es.js";
 import "../ui/input-otp.es.js";
 import "../ui/label.es.js";
-import { logout as x } from "../../utils/index.es.js";
-import { LogOut as N } from "lucide-react";
+import { logout as N } from "../../utils/index.es.js";
+import { Outlet as b } from "@tanstack/react-router";
 import "../ui/mutli-select.es.js";
 import "../ui/navigation-menu.es.js";
 import "../ui/pagination.es.js";
 import "../ui/password-input.es.js";
 import "../ui/popover.es.js";
 import "../ui/radio-group.es.js";
-import "react";
 import "../ui/select.es.js";
 import "../ui/separator.es.js";
 import "../ui/sheet.es.js";
@@ -35,49 +37,41 @@ import "sonner";
 import "../ui/table.es.js";
 import "../ui/tabs.es.js";
 import "../ui/tooltip.es.js";
-import { Outlet as w } from "@tanstack/react-router";
-function mr({ data: e, user: o }) {
-  var i, m;
-  return /* @__PURE__ */ t("div", { className: "h-screen", children: [
-    /* @__PURE__ */ t(l, { children: [
-      /* @__PURE__ */ r(p, { data: e }),
-      /* @__PURE__ */ t("div", { className: "flex flex-col h-screen w-full overflow-auto", children: [
-        /* @__PURE__ */ t("header", { className: "h-[7vh] sticky top-0 bg-card flex items-center justify-between p-4 pl-0 border-b  z-10", children: [
-          /* @__PURE__ */ t("div", { className: "flex gap-1 items-center", children: [
-            /* @__PURE__ */ r(c, {}),
+function er({ data: e, user: o }) {
+  var t, m;
+  return /* @__PURE__ */ r("div", { className: "h-dvh flex", children: /* @__PURE__ */ i(a, { children: [
+    /* @__PURE__ */ r(l, { data: e }),
+    /* @__PURE__ */ i("div", { className: "flex flex-col h-screen w-full overflow-auto", children: [
+      /* @__PURE__ */ i("header", { className: "h-[7vh] sticky top-0 bg-card flex items-center justify-between p-4 pl-0 border-b z-10", children: [
+        /* @__PURE__ */ r("div", { className: "flex gap-1 items-center", children: /* @__PURE__ */ r(c, {}) }),
+        /* @__PURE__ */ i(s, { children: [
+          /* @__PURE__ */ r(v, { asChild: !0, children: /* @__PURE__ */ r("div", { className: "cursor-pointer", children: /* @__PURE__ */ i(n, { className: "justify-center items-center", children: [
             /* @__PURE__ */ r(
-              "img",
+              d,
               {
-                src: "https://assets.cryptlex.com/images/logos/cryptlex-logo.svg",
-                alt: "logo",
-                className: "m-0"
+                src: (o == null ? void 0 : o.logoUrl) ?? "https://app.dev.cryptlex.com/favicon.ico",
+                alt: "icon"
               }
-            )
-          ] }),
-          /* @__PURE__ */ t(h, { children: [
-            /* @__PURE__ */ r(f, { asChild: !0, children: /* @__PURE__ */ r("div", { className: "cursor-pointer", children: /* @__PURE__ */ t(a, { className: "justify-center  items-center", children: [
-              /* @__PURE__ */ r(
-                n,
-                {
-                  src: (o == null ? void 0 : o.logoUrl) ?? "https://app.dev.cryptlex.com/favicon.ico",
-                  alt: "icon"
-                }
-              ),
-              /* @__PURE__ */ t(d, { className: "uppercase", children: [
-                (i = o == null ? void 0 : o.firstName) == null ? void 0 : i.charAt(0),
-                (m = o == null ? void 0 : o.lastName) == null ? void 0 : m.charAt(0)
-              ] })
-            ] }) }) }),
-            /* @__PURE__ */ r(g, { children: /* @__PURE__ */ r(v, { children: /* @__PURE__ */ r(s, { icon: N, onClick: () => x(), children: "Log Out" }) }) })
-          ] })
-        ] }),
-        /* @__PURE__ */ r("div", { className: "flex-1 overflow-auto p-4", children: /* @__PURE__ */ r(w, {}) })
+            ),
+            /* @__PURE__ */ i(f, { children: [
+              (t = o == null ? void 0 : o.firstName) == null ? void 0 : t.charAt(0),
+              (m = o == null ? void 0 : o.lastName) == null ? void 0 : m.charAt(0)
+            ] })
+          ] }) }) }),
+          /* @__PURE__ */ r(x, { children: /* @__PURE__ */ i(g, { onClick: () => N(), children: [
+            /* @__PURE__ */ r(h, {}),
+            " Logout"
+          ] }) })
+        ] })
+      ] }),
+      /* @__PURE__ */ i("div", { className: "flex-1 flex flex-col overflow-auto", children: [
+        /* @__PURE__ */ r("div", { className: "p-4 pb-0", children: /* @__PURE__ */ r(p, {}) }),
+        /* @__PURE__ */ r("div", { className: "flex-1 p-4 pt-2", children: /* @__PURE__ */ r(b, {}) })
       ] })
-    ] }),
-    " "
-  ] });
+    ] })
+  ] }) });
 }
 export {
-  mr as AppLayout
+  er as AppLayout
 };
 //# sourceMappingURL=app-layout.es.js.map

package/dist/components/sidebar/app-layout.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"app-layout.es.js","sources":["../../../lib/components/sidebar/app-layout.tsx"],"sourcesContent":["import type { NavItem } from '@/components/sidebar/nav-main';\nimport { SideBar } from '@/components/sidebar/sidebar';\nimport { SidebarProvider, SidebarTrigger } from '@/components/ui/sidebar';\nimport {\n  Avatar,\n  AvatarFallback,\n  AvatarImage,\n  Button,\n  DropdownMenu,\n  DropdownMenuContent,\n  DropdownMenuItem,\n  DropdownMenuTrigger,\n  logout,\n} from '@/index';\nimport { Outlet } from '@tanstack/react-router';\nimport { LogOut } from 'lucide-react';\n\nexport interface AppLayoutProps {\n  data: NavItem[]; // Navigation items\n  user?: {\n    firstName?: string;\n    lastName?: string;\n    logoUrl?: string;\n  }; // Optional user information\n}\n\nexport function AppLayout({ data, user }: AppLayoutProps) {\n  return (\n    <div className=\"h-screen\">\n      <SidebarProvider>\n        {/* Sidebar */}\n        <SideBar data={data} />\n\n        {/* Main Content */}\n        <div className=\"flex flex-col h-screen w-full overflow-auto\">\n          {/* Header */}\n          <header className=\"h-[7vh] sticky top-0 bg-card flex items-center justify-between p-4 pl-0 border-b  z-10\">\n            {/* Sidebar Trigger */}\n            <div className=\"flex gap-1 items-center\">\n              <SidebarTrigger />\n              {/* //TODO: Will be replaced with dynamic url */}\n              <img\n                src=\"https://assets.cryptlex.com/images/logos/cryptlex-logo.svg\"\n                alt=\"logo\"\n                className=\"m-0\"\n              />\n            </div>\n\n            {/* User Dropdown */}\n            <DropdownMenu>\n              <DropdownMenuTrigger asChild>\n                <div className=\"cursor-pointer\">\n                  {/* //TODO: Image url to be replaced by the dynamic url from /account/config */}\n                  <Avatar className=\"justify-center  items-center\">\n                    <AvatarImage\n                      src={user?.logoUrl ?? 'https://app.dev.cryptlex.com/favicon.ico'}\n                      alt=\"icon\"\n                    />\n                    <AvatarFallback className=\"uppercase\">\n                      {user?.firstName?.charAt(0)}\n                      {user?.lastName?.charAt(0)}\n                    </AvatarFallback>\n                  </Avatar>\n                </div>\n              </DropdownMenuTrigger>\n\n              <DropdownMenuContent>\n                <DropdownMenuItem>\n                  <Button icon={LogOut} onClick={() => logout()}>\n                    Log Out\n                  </Button>\n                </DropdownMenuItem>\n              </DropdownMenuContent>\n            </DropdownMenu>\n          </header>\n\n          {/* Scrollable Content */}\n          <div className=\"flex-1 overflow-auto p-4\">\n            <Outlet />\n          </div>\n        </div>\n      </SidebarProvider>{' '}\n    </div>\n  );\n}\n"],"names":["AppLayout","data","user","jsxs","SidebarProvider","jsx","SideBar","SidebarTrigger","DropdownMenu","DropdownMenuTrigger","Avatar","AvatarImage","AvatarFallback","_a","_b","DropdownMenuContent","DropdownMenuItem","Button","LogOut","logout","Outlet"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0BO,SAASA,GAAU,EAAE,MAAAC,GAAM,MAAAC,KAAwB;;AAEtD,SAAA,gBAAAC,EAAC,OAAI,EAAA,WAAU,YACb,UAAA;AAAA,IAAA,gBAAAA,EAACC,GAEC,EAAA,UAAA;AAAA,MAAA,gBAAAC,EAACC,KAAQ,MAAAL,GAAY;AAAA,MAGrB,gBAAAE,EAAC,OAAI,EAAA,WAAU,+CAEb,UAAA;AAAA,QAAC,gBAAAA,EAAA,UAAA,EAAO,WAAU,0FAEhB,UAAA;AAAA,UAAC,gBAAAA,EAAA,OAAA,EAAI,WAAU,2BACb,UAAA;AAAA,YAAA,gBAAAE,EAACE,GAAe,EAAA;AAAA,YAEhB,gBAAAF;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,KAAI;AAAA,gBACJ,KAAI;AAAA,gBACJ,WAAU;AAAA,cAAA;AAAA,YAAA;AAAA,UACZ,GACF;AAAA,4BAGCG,GACC,EAAA,UAAA;AAAA,YAAC,gBAAAH,EAAAI,GAAA,EAAoB,SAAO,IAC1B,UAAC,gBAAAJ,EAAA,OAAA,EAAI,WAAU,kBAEb,UAAA,gBAAAF,EAACO,GAAO,EAAA,WAAU,gCAChB,UAAA;AAAA,cAAA,gBAAAL;AAAA,gBAACM;AAAA,gBAAA;AAAA,kBACC,MAAKT,KAAA,gBAAAA,EAAM,YAAW;AAAA,kBACtB,KAAI;AAAA,gBAAA;AAAA,cACN;AAAA,cACA,gBAAAC,EAACS,GAAe,EAAA,WAAU,aACvB,UAAA;AAAA,iBAAMC,IAAAX,KAAA,gBAAAA,EAAA,cAAA,gBAAAW,EAAW,OAAO;AAAA,iBACxBC,IAAAZ,KAAA,gBAAAA,EAAM,aAAN,gBAAAY,EAAgB,OAAO;AAAA,cAAC,EAC3B,CAAA;AAAA,YAAA,EACF,CAAA,EACF,CAAA,GACF;AAAA,YAEC,gBAAAT,EAAAU,GAAA,EACC,UAAC,gBAAAV,EAAAW,GAAA,EACC,4BAACC,GAAO,EAAA,MAAMC,GAAQ,SAAS,MAAMC,EAAA,GAAU,UAAA,UAAA,CAE/C,GACF,EACF,CAAA;AAAA,UAAA,EACF,CAAA;AAAA,QAAA,GACF;AAAA,0BAGC,OAAI,EAAA,WAAU,4BACb,UAAA,gBAAAd,EAACe,KAAO,EACV,CAAA;AAAA,MAAA,EACF,CAAA;AAAA,IAAA,GACF;AAAA,IAAmB;AAAA,EAAA,GACrB;AAEJ;"}
+{"version":3,"file":"app-layout.es.js","sources":["../../../lib/components/sidebar/app-layout.tsx"],"sourcesContent":["import { BreadCrumbs } from '@/components/sidebar/breadcrumb';\nimport type { NavItem } from '@/components/sidebar/nav-main';\nimport { SideBar } from '@/components/sidebar/sidebar';\nimport { SidebarProvider, SidebarTrigger } from '@/components/ui/sidebar';\nimport {\n  Avatar,\n  AvatarFallback,\n  AvatarImage,\n  DropdownMenu,\n  DropdownMenuContent,\n  DropdownMenuItem,\n  DropdownMenuTrigger,\n  logout,\n} from '@/index';\nimport { Outlet } from '@tanstack/react-router';\nimport { LogOut } from 'lucide-react';\n\nexport interface AppLayoutProps {\n  data: NavItem[]; // Navigation items\n  user?: {\n    firstName?: string;\n    lastName?: string;\n    logoUrl?: string;\n  }; // Optional user information\n}\n\nexport function AppLayout({ data, user }: AppLayoutProps) {\n  return (\n    <div className=\"h-dvh flex\">\n      <SidebarProvider>\n        {/* Sidebar */}\n        <SideBar data={data} />\n\n        {/* Main Content */}\n        <div className=\"flex flex-col h-screen w-full overflow-auto\">\n          {/* Header */}\n          <header className=\"h-[7vh] sticky top-0 bg-card flex items-center justify-between p-4 pl-0 border-b z-10\">\n            {/* Sidebar Trigger */}\n            <div className=\"flex gap-1 items-center\">\n              <SidebarTrigger />\n            </div>\n\n            {/* User Dropdown */}\n            <DropdownMenu>\n              <DropdownMenuTrigger asChild>\n                <div className=\"cursor-pointer\">\n                  <Avatar className=\"justify-center items-center\">\n                    <AvatarImage\n                      src={user?.logoUrl ?? 'https://app.dev.cryptlex.com/favicon.ico'}\n                      alt=\"icon\"\n                    />\n                    <AvatarFallback>\n                      {user?.firstName?.charAt(0)}\n                      {user?.lastName?.charAt(0)}\n                    </AvatarFallback>\n                  </Avatar>\n                </div>\n              </DropdownMenuTrigger>\n\n              <DropdownMenuContent>\n                <DropdownMenuItem onClick={() => logout()}>\n                  <LogOut /> Logout\n                </DropdownMenuItem>\n              </DropdownMenuContent>\n            </DropdownMenu>\n          </header>\n\n          {/* Scrollable Content */}\n          <div className=\"flex-1 flex flex-col overflow-auto\">\n            <div className=\"p-4 pb-0\">\n              <BreadCrumbs />\n            </div>\n            <div className=\"flex-1 p-4 pt-2\">\n              <Outlet />\n            </div>\n          </div>\n        </div>\n      </SidebarProvider>\n    </div>\n  );\n}\n"],"names":["AppLayout","data","user","jsx","SidebarProvider","SideBar","jsxs","SidebarTrigger","DropdownMenu","DropdownMenuTrigger","Avatar","AvatarImage","AvatarFallback","_a","_b","DropdownMenuContent","DropdownMenuItem","logout","LogOut","BreadCrumbs","Outlet"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0BO,SAASA,GAAU,EAAE,MAAAC,GAAM,MAAAC,KAAwB;;AACxD,SACG,gBAAAC,EAAA,OAAA,EAAI,WAAU,cACb,4BAACC,GAEC,EAAA,UAAA;AAAA,IAAA,gBAAAD,EAACE,KAAQ,MAAAJ,GAAY;AAAA,IAGrB,gBAAAK,EAAC,OAAI,EAAA,WAAU,+CAEb,UAAA;AAAA,MAAC,gBAAAA,EAAA,UAAA,EAAO,WAAU,yFAEhB,UAAA;AAAA,QAAA,gBAAAH,EAAC,OAAI,EAAA,WAAU,2BACb,UAAA,gBAAAA,EAACI,IAAe,CAAA,GAClB;AAAA,0BAGCC,GACC,EAAA,UAAA;AAAA,UAAC,gBAAAL,EAAAM,GAAA,EAAoB,SAAO,IAC1B,UAAC,gBAAAN,EAAA,OAAA,EAAI,WAAU,kBACb,UAAA,gBAAAG,EAACI,GAAO,EAAA,WAAU,+BAChB,UAAA;AAAA,YAAA,gBAAAP;AAAA,cAACQ;AAAA,cAAA;AAAA,gBACC,MAAKT,KAAA,gBAAAA,EAAM,YAAW;AAAA,gBACtB,KAAI;AAAA,cAAA;AAAA,YACN;AAAA,8BACCU,GACE,EAAA,UAAA;AAAA,eAAMC,IAAAX,KAAA,gBAAAA,EAAA,cAAA,gBAAAW,EAAW,OAAO;AAAA,eACxBC,IAAAZ,KAAA,gBAAAA,EAAM,aAAN,gBAAAY,EAAgB,OAAO;AAAA,YAAC,EAC3B,CAAA;AAAA,UAAA,EACF,CAAA,EACF,CAAA,GACF;AAAA,4BAECC,GACC,EAAA,UAAA,gBAAAT,EAACU,KAAiB,SAAS,MAAMC,EAC/B,GAAA,UAAA;AAAA,YAAA,gBAAAd,EAACe,GAAO,EAAA;AAAA,YAAE;AAAA,UAAA,EAAA,CACZ,EACF,CAAA;AAAA,QAAA,EACF,CAAA;AAAA,MAAA,GACF;AAAA,MAGA,gBAAAZ,EAAC,OAAI,EAAA,WAAU,sCACb,UAAA;AAAA,QAAA,gBAAAH,EAAC,OAAI,EAAA,WAAU,YACb,UAAA,gBAAAA,EAACgB,IAAY,CAAA,GACf;AAAA,0BACC,OAAI,EAAA,WAAU,mBACb,UAAA,gBAAAhB,EAACiB,KAAO,EACV,CAAA;AAAA,MAAA,EACF,CAAA;AAAA,IAAA,EACF,CAAA;AAAA,EAAA,EAAA,CACF,EACF,CAAA;AAEJ;"}

package/dist/components/sidebar/breadcrumb.es.js

@@ -0,0 +1,58 @@
+import { jsx as t, jsxs as a } from "react/jsx-runtime";
+import "../ui/accordion.es.js";
+import "../ui/avatar.es.js";
+import "../ui/badge.es.js";
+import { Breadcrumb as s, BreadcrumbList as u, BreadcrumbItem as d, BreadcrumbLink as c, BreadcrumbSeparator as h } from "../ui/breadcrumb.es.js";
+import "../ui/button.es.js";
+import "../ui/calendar.es.js";
+import "../ui/card.es.js";
+import "../ui/chart.es.js";
+import "../ui/checkbox.es.js";
+import "@radix-ui/react-collapsible";
+import "../ui/command.es.js";
+import "lucide-react";
+import l from "react";
+import "../ui/dialog.es.js";
+import "../ui/drawer.es.js";
+import "../ui/dropdown-menu.es.js";
+import "../ui/form.es.js";
+import "../ui/input.es.js";
+import "../ui/input-otp.es.js";
+import "../ui/label.es.js";
+import { Link as b, useLocation as f } from "@tanstack/react-router";
+import "../ui/mutli-select.es.js";
+import "../ui/navigation-menu.es.js";
+import "../ui/pagination.es.js";
+import "../ui/password-input.es.js";
+import "../ui/popover.es.js";
+import "../ui/radio-group.es.js";
+import "../ui/select.es.js";
+import "../ui/separator.es.js";
+import "../ui/sheet.es.js";
+import "../ui/sidebar.es.js";
+import "sonner";
+import "../ui/table.es.js";
+import "../ui/tabs.es.js";
+import "../ui/tooltip.es.js";
+function B() {
+  return { breadcrumb_routes: f().pathname.split("/").filter((r) => r && r.length > 0).reduce((r, p) => {
+    var e;
+    const n = ((e = r[r.length - 1]) == null ? void 0 : e.path) ?? "";
+    return r.push({ name: p, path: `${n}/${p}` }), r;
+  }, []) };
+}
+function rr({}) {
+  const { breadcrumb_routes: i } = B();
+  return /* @__PURE__ */ t(s, { children: /* @__PURE__ */ t(u, { children: i.map((o, m) => {
+    const r = m === i.length - 1;
+    return /* @__PURE__ */ a(l.Fragment, { children: [
+      /* @__PURE__ */ t(d, { children: r ? o.name.split("-").join(" ") : /* @__PURE__ */ t(c, { asChild: !0, children: /* @__PURE__ */ t(b, { to: o.path, children: o.name.split("-").join(" ") }) }) }),
+      !r && /* @__PURE__ */ t(h, {})
+    ] }, o.path);
+  }) }) });
+}
+export {
+  rr as BreadCrumbs,
+  B as useBreadCrumbs
+};
+//# sourceMappingURL=breadcrumb.es.js.map

package/dist/components/sidebar/breadcrumb.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"breadcrumb.es.js","sources":["../../../lib/components/sidebar/breadcrumb.tsx"],"sourcesContent":["import {\n  Breadcrumb,\n  BreadcrumbItem,\n  BreadcrumbLink,\n  BreadcrumbList,\n  BreadcrumbSeparator,\n} from '@/index';\nimport { Link, useLocation } from '@tanstack/react-router';\nimport React from 'react';\nexport function useBreadCrumbs() {\n  const current = useLocation();\n\n  const routeHistory = current.pathname.split('/').filter((x) => x && x.length > 0);\n\n  const breadcrumb_routes = routeHistory.reduce((acc: { name: string; path: string }[], route) => {\n    const prev_path = acc[acc.length - 1]?.path ?? '';\n    acc.push({ name: route, path: `${prev_path}/${route}` });\n    return acc;\n  }, []);\n  return { breadcrumb_routes };\n}\n\ninterface BreadCrumbsProps {}\n\nexport function BreadCrumbs({}: BreadCrumbsProps) {\n  const { breadcrumb_routes } = useBreadCrumbs();\n\n  return (\n    <Breadcrumb>\n      <BreadcrumbList>\n        {breadcrumb_routes.map((crumb, index) => {\n          const isLast = index === breadcrumb_routes.length - 1;\n          return (\n            <React.Fragment key={crumb.path}>\n              <BreadcrumbItem>\n                {isLast ? (\n                  crumb.name.split('-').join(' ')\n                ) : (\n                  <BreadcrumbLink asChild>\n                    <Link to={crumb.path}>{crumb.name.split('-').join(' ')}</Link>\n                  </BreadcrumbLink>\n                )}\n              </BreadcrumbItem>\n              {!isLast && <BreadcrumbSeparator />}\n            </React.Fragment>\n          );\n        })}\n      </BreadcrumbList>\n    </Breadcrumb>\n  );\n}\n"],"names":["useBreadCrumbs","useLocation","x","acc","route","prev_path","_a","BreadCrumbs","breadcrumb_routes","jsx","Breadcrumb","BreadcrumbList","crumb","index","isLast","jsxs","React","BreadcrumbItem","BreadcrumbLink","Link","BreadcrumbSeparator"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASO,SAASA,IAAiB;AAU/B,SAAO,EAAE,mBATOC,EAAY,EAEC,SAAS,MAAM,GAAG,EAAE,OAAO,CAACC,MAAMA,KAAKA,EAAE,SAAS,CAAC,EAEzC,OAAO,CAACC,GAAuCC,MAAU;;AAC9F,UAAMC,MAAYC,IAAAH,EAAIA,EAAI,SAAS,CAAC,MAAlB,gBAAAG,EAAqB,SAAQ;AAC3C,WAAAH,EAAA,KAAK,EAAE,MAAMC,GAAO,MAAM,GAAGC,CAAS,IAAID,CAAK,GAAA,CAAI,GAChDD;AAAA,EACT,GAAG,EAAE,EACsB;AAC7B;AAIgB,SAAAI,GAAY,CAAA,GAAsB;AAC1C,QAAA,EAAE,mBAAAC,EAAkB,IAAIR,EAAe;AAG3C,SAAA,gBAAAS,EAACC,KACC,UAAC,gBAAAD,EAAAE,GAAA,EACE,YAAkB,IAAI,CAACC,GAAOC,MAAU;AACjC,UAAAC,IAASD,MAAUL,EAAkB,SAAS;AAElD,WAAA,gBAAAO,EAACC,EAAM,UAAN,EACC,UAAA;AAAA,MAAA,gBAAAP,EAACQ,GACE,EAAA,UAAAH,IACCF,EAAM,KAAK,MAAM,GAAG,EAAE,KAAK,GAAG,IAE7B,gBAAAH,EAAAS,GAAA,EAAe,SAAO,IACrB,UAAC,gBAAAT,EAAAU,GAAA,EAAK,IAAIP,EAAM,MAAO,UAAAA,EAAM,KAAK,MAAM,GAAG,EAAE,KAAK,GAAG,EAAE,CAAA,EACzD,CAAA,GAEJ;AAAA,MACC,CAACE,KAAU,gBAAAL,EAACW,GAAoB,CAAA,CAAA;AAAA,IAAA,EAAA,GAVdR,EAAM,IAW3B;AAAA,EAAA,CAEH,GACH,EACF,CAAA;AAEJ;"}

package/dist/components/sidebar/nav-main.es.js

@@ -1,76 +1,90 @@
-import { jsx as l, jsxs as r } from "react/jsx-runtime";
-import { Collapsible as u, CollapsibleTrigger as b, CollapsibleContent as p } from "../ui/collapsible.es.js";
-import { useSidebar as g, SidebarGroup as S, SidebarMenu as f, SidebarMenuItem as o, SidebarMenuButton as i, SidebarMenuSub as C, SidebarMenuSubItem as m, SidebarMenuSubButton as N } from "../ui/sidebar.es.js";
-import { Link as t } from "@tanstack/react-router";
-import { ChevronRight as v } from "lucide-react";
-import { useState as M } from "react";
-function T({ items: c }) {
-  const { setOpen: d } = g(), [a, s] = M(null), h = (e) => {
-    s((n) => n === e ? null : e);
-  };
-  return /* @__PURE__ */ l(S, { children: /* @__PURE__ */ l(f, { children: c.map(
-    (e) => e.chidren && e.chidren.length > 0 ? /* @__PURE__ */ l(
-      u,
+import { jsx as e, jsxs as r } from "react/jsx-runtime";
+import { Collapsible as S, CollapsibleTrigger as x, CollapsibleContent as C } from "../ui/collapsible.es.js";
+import { useSidebar as v, SidebarGroup as m, SidebarMenu as M, SidebarMenuItem as p, SidebarMenuButton as u, SidebarMenuSub as w, SidebarMenuSubItem as y, SidebarMenuSubButton as P } from "../ui/sidebar.es.js";
+import { useMatches as k, Link as b } from "@tanstack/react-router";
+import { ChevronRight as $ } from "lucide-react";
+import { useState as j, useEffect as A } from "react";
+function G({ items: i }) {
+  const { setOpen: f } = v(), [h, d] = j(null), s = k(), o = s.length > 0 ? s[s.length - 1].pathname : "", n = (l) => l.children ? l.children.some((a) => o.startsWith(a.path)) : !1, g = (l) => o.startsWith(l.path) || n(l);
+  A(() => {
+    i.forEach((l) => {
+      n(l) && d(l.label);
+    });
+  }, [o]);
+  const N = (l) => {
+    d((a) => a === l ? null : l);
+  }, c = `
+    w-full rounded-md px-2 py-1.5
+    transition-colors duration-200
+    hover:bg-neutral-4 focus-visible:bg-neutral-4
+    text-neutral-10 hover:text-neutral-10
+    no-underline
+    flex items-center gap-2
+  `, t = "bg-neutral-4 font-bold";
+  return /* @__PURE__ */ e(m, { children: /* @__PURE__ */ e(M, { className: "flex flex-col gap-1", children: i.map(
+    (l) => l.children && l.display && l.children.length > 0 ? /* @__PURE__ */ e(
+      S,
       {
         asChild: !0,
-        open: a === e.label,
-        className: "group/collapsible",
-        children: /* @__PURE__ */ r(o, { children: [
-          /* @__PURE__ */ l(b, { asChild: !0, children: /* @__PURE__ */ r(
-            i,
+        open: h === l.label || n(l),
+        className: "group/collapsible w-full",
+        children: /* @__PURE__ */ r(p, { children: [
+          /* @__PURE__ */ e(x, { asChild: !0, children: /* @__PURE__ */ r(
+            u,
             {
-              tooltip: e.label,
+              tooltip: l.label,
               onClick: () => {
-                d(!0), h(e.label);
+                f(!0), N(l.label);
               },
-              className: "hover:bg-neutral-5",
+              className: `${c} ${g(l) ? t : ""}`,
               children: [
-                e.icon && /* @__PURE__ */ l(e.icon, {}),
-                /* @__PURE__ */ l("span", { children: e.label }),
-                /* @__PURE__ */ l(
-                  v,
+                l.icon && /* @__PURE__ */ e(l.icon, { className: "h-4 w-4" }),
+                /* @__PURE__ */ e("span", { className: "flex-1", children: l.label }),
+                /* @__PURE__ */ e(
+                  $,
                   {
-                    className: `ml-auto transition-transform duration-200 ${a === e.label ? "rotate-90" : ""}`
+                    className: `h-4 w-4 transition-transform duration-200 ${h === l.label || n(l) ? "rotate-90" : ""}`
                   }
                 )
               ]
             }
           ) }),
-          /* @__PURE__ */ l(p, { children: /* @__PURE__ */ l(C, { children: e.chidren.map((n) => /* @__PURE__ */ l(m, { children: /* @__PURE__ */ l(N, { asChild: !0, children: /* @__PURE__ */ r(
-            t,
-            {
-              activeProps: {
-                className: "bg-neutral-4 font-bold"
-              },
-              className: "text-neutral-10 no-underline  hover:bg-neutral-5",
-              to: n.path,
-              children: [
-                n.icon && /* @__PURE__ */ l(n.icon, {}),
-                /* @__PURE__ */ l("span", { children: n.label })
-              ]
-            }
-          ) }) }, n.label)) }) })
+          /* @__PURE__ */ e(C, { children: /* @__PURE__ */ e(w, { className: "w-full flex flex-col gap-1", children: l.children.map(
+            (a) => a.display && /* @__PURE__ */ e(y, { children: /* @__PURE__ */ e(P, { asChild: !0, children: /* @__PURE__ */ r(
+              b,
+              {
+                to: a.path,
+                className: c,
+                activeProps: {
+                  className: t
+                },
+                children: [
+                  a.icon && /* @__PURE__ */ e(a.icon, { className: "h-4 w-4" }),
+                  /* @__PURE__ */ e("span", { children: a.label })
+                ]
+              }
+            ) }) }, a.label)
+          ) }) })
         ] })
       },
-      e.label
-    ) : /* @__PURE__ */ l(o, { children: /* @__PURE__ */ l(i, { asChild: !0, tooltip: e.label, children: /* @__PURE__ */ r(
-      t,
+      l.label
+    ) : l.display && /* @__PURE__ */ e(p, { children: /* @__PURE__ */ e(u, { asChild: !0, tooltip: l.label, children: /* @__PURE__ */ r(
+      b,
       {
+        to: l.path,
+        className: c,
         activeProps: {
-          className: "bg-neutral-4 font-bold"
-          // Add active styling here
+          className: t
         },
-        className: "no-underline text-neutral-10 flex items-center hover:bg-neutral-5",
-        to: e.path,
         children: [
-          e.icon && /* @__PURE__ */ l(e.icon, {}),
-          /* @__PURE__ */ l("span", { children: e.label })
+          l.icon && /* @__PURE__ */ e(l.icon, { className: "h-4 w-4" }),
+          /* @__PURE__ */ e("span", { children: l.label })
         ]
       }
-    ) }) }, e.label)
+    ) }) }, l.label)
   ) }) });
 }
 export {
-  T as NavMain
+  G as NavMain
 };
 //# sourceMappingURL=nav-main.es.js.map

package/dist/components/sidebar/nav-main.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"nav-main.es.js","sources":["../../../lib/components/sidebar/nav-main.tsx"],"sourcesContent":["import { Collapsible, CollapsibleContent, CollapsibleTrigger } from '@/components/ui/collapsible';\nimport {\n  SidebarGroup,\n  SidebarMenu,\n  SidebarMenuButton,\n  SidebarMenuItem,\n  SidebarMenuSub,\n  SidebarMenuSubButton,\n  SidebarMenuSubItem,\n  useSidebar,\n} from '@/components/ui/sidebar';\nimport { Link } from '@tanstack/react-router';\nimport { ChevronRight, type LucideIcon } from 'lucide-react';\nimport { useState } from 'react';\n\nexport type NavItem = {\n  path: string;\n  label: string;\n  display: boolean;\n  icon: LucideIcon;\n  chidren?: { path: string; label: string; icon: LucideIcon; display: boolean }[];\n};\n\nexport function NavMain({ items }: { items: NavItem[] }) {\n  const { setOpen } = useSidebar();\n  const [openItem, setOpenItem] = useState<string | null>(null); // Tracks the currently open item\n\n  const handleToggle = (title: string) => {\n    setOpenItem((prev) => (prev === title ? null : title)); // Toggle the open state\n  };\n\n  return (\n    <SidebarGroup>\n      <SidebarMenu>\n        {items.map((item) =>\n          item.chidren && item.chidren.length > 0 ? (\n            <Collapsible\n              key={item.label}\n              asChild\n              open={openItem === item.label}\n              className=\"group/collapsible\"\n            >\n              <SidebarMenuItem>\n                <CollapsibleTrigger asChild>\n                  <SidebarMenuButton\n                    tooltip={item.label}\n                    onClick={() => {\n                      setOpen(true);\n                      handleToggle(item.label);\n                    }}\n                    className=\"hover:bg-neutral-5\"\n                  >\n                    {item.icon && <item.icon />}\n                    <span>{item.label}</span>\n                    <ChevronRight\n                      className={`ml-auto transition-transform duration-200 ${\n                        openItem === item.label ? 'rotate-90' : ''\n                      }`}\n                    />\n                  </SidebarMenuButton>\n                </CollapsibleTrigger>\n                <CollapsibleContent>\n                  <SidebarMenuSub>\n                    {item.chidren.map((subItem) => (\n                      <SidebarMenuSubItem key={subItem.label}>\n                        <SidebarMenuSubButton asChild>\n                          <Link\n                            activeProps={{\n                              className: 'bg-neutral-4 font-bold',\n                            }}\n                            className=\"text-neutral-10 no-underline  hover:bg-neutral-5\"\n                            to={subItem.path}\n                          >\n                            {subItem.icon && <subItem.icon />}\n                            <span>{subItem.label}</span>\n                          </Link>\n                        </SidebarMenuSubButton>\n                      </SidebarMenuSubItem>\n                    ))}\n                  </SidebarMenuSub>\n                </CollapsibleContent>\n              </SidebarMenuItem>\n            </Collapsible>\n          ) : (\n            <SidebarMenuItem key={item.label}>\n              <SidebarMenuButton asChild tooltip={item.label}>\n                <Link\n                  activeProps={{\n                    className: 'bg-neutral-4 font-bold', // Add active styling here\n                  }}\n                  className=\"no-underline text-neutral-10 flex items-center hover:bg-neutral-5\"\n                  to={item.path}\n                >\n                  {item.icon && <item.icon />}\n                  <span>{item.label}</span>\n                </Link>\n              </SidebarMenuButton>\n            </SidebarMenuItem>\n          ),\n        )}\n      </SidebarMenu>\n    </SidebarGroup>\n  );\n}\n"],"names":["NavMain","items","setOpen","useSidebar","openItem","setOpenItem","useState","handleToggle","title","prev","jsx","SidebarGroup","SidebarMenu","item","Collapsible","SidebarMenuItem","CollapsibleTrigger","jsxs","SidebarMenuButton","ChevronRight","CollapsibleContent","SidebarMenuSub","subItem","SidebarMenuSubItem","SidebarMenuSubButton","Link"],"mappings":";;;;;;AAuBgB,SAAAA,EAAQ,EAAE,OAAAC,KAA+B;AACjD,QAAA,EAAE,SAAAC,EAAQ,IAAIC,EAAW,GACzB,CAACC,GAAUC,CAAW,IAAIC,EAAwB,IAAI,GAEtDC,IAAe,CAACC,MAAkB;AACtC,IAAAH,EAAY,CAACI,MAAUA,MAASD,IAAQ,OAAOA,CAAM;AAAA,EACvD;AAEA,SACG,gBAAAE,EAAAC,GAAA,EACC,UAAC,gBAAAD,EAAAE,GAAA,EACE,UAAMX,EAAA;AAAA,IAAI,CAACY,MACVA,EAAK,WAAWA,EAAK,QAAQ,SAAS,IACpC,gBAAAH;AAAA,MAACI;AAAA,MAAA;AAAA,QAEC,SAAO;AAAA,QACP,MAAMV,MAAaS,EAAK;AAAA,QACxB,WAAU;AAAA,QAEV,4BAACE,GACC,EAAA,UAAA;AAAA,UAAC,gBAAAL,EAAAM,GAAA,EAAmB,SAAO,IACzB,UAAA,gBAAAC;AAAA,YAACC;AAAA,YAAA;AAAA,cACC,SAASL,EAAK;AAAA,cACd,SAAS,MAAM;AACb,gBAAAX,EAAQ,EAAI,GACZK,EAAaM,EAAK,KAAK;AAAA,cACzB;AAAA,cACA,WAAU;AAAA,cAET,UAAA;AAAA,gBAAAA,EAAK,QAAQ,gBAAAH,EAACG,EAAK,MAAL,CAAA,CAAU;AAAA,gBACzB,gBAAAH,EAAC,QAAM,EAAA,UAAAG,EAAK,MAAM,CAAA;AAAA,gBAClB,gBAAAH;AAAA,kBAACS;AAAA,kBAAA;AAAA,oBACC,WAAW,6CACTf,MAAaS,EAAK,QAAQ,cAAc,EAC1C;AAAA,kBAAA;AAAA,gBAAA;AAAA,cACF;AAAA,YAAA;AAAA,UAAA,GAEJ;AAAA,UACC,gBAAAH,EAAAU,GAAA,EACC,UAAC,gBAAAV,EAAAW,GAAA,EACE,YAAK,QAAQ,IAAI,CAACC,MAChB,gBAAAZ,EAAAa,GAAA,EACC,UAAC,gBAAAb,EAAAc,GAAA,EAAqB,SAAO,IAC3B,UAAA,gBAAAP;AAAA,YAACQ;AAAA,YAAA;AAAA,cACC,aAAa;AAAA,gBACX,WAAW;AAAA,cACb;AAAA,cACA,WAAU;AAAA,cACV,IAAIH,EAAQ;AAAA,cAEX,UAAA;AAAA,gBAAAA,EAAQ,QAAQ,gBAAAZ,EAACY,EAAQ,MAAR,CAAA,CAAa;AAAA,gBAC/B,gBAAAZ,EAAC,QAAM,EAAA,UAAAY,EAAQ,MAAM,CAAA;AAAA,cAAA;AAAA,YAAA;AAAA,aAEzB,EAZuB,GAAAA,EAAQ,KAajC,CACD,EACH,CAAA,EACF,CAAA;AAAA,QAAA,EACF,CAAA;AAAA,MAAA;AAAA,MA5CKT,EAAK;AAAA,IA6CZ,sBAECE,GACC,EAAA,UAAA,gBAAAL,EAACQ,KAAkB,SAAO,IAAC,SAASL,EAAK,OACvC,UAAA,gBAAAI;AAAA,MAACQ;AAAA,MAAA;AAAA,QACC,aAAa;AAAA,UACX,WAAW;AAAA;AAAA,QACb;AAAA,QACA,WAAU;AAAA,QACV,IAAIZ,EAAK;AAAA,QAER,UAAA;AAAA,UAAAA,EAAK,QAAQ,gBAAAH,EAACG,EAAK,MAAL,CAAA,CAAU;AAAA,UACzB,gBAAAH,EAAC,QAAM,EAAA,UAAAG,EAAK,MAAM,CAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA,GAEtB,EAZoB,GAAAA,EAAK,KAa3B;AAAA,KAGN,EACF,CAAA;AAEJ;"}
+{"version":3,"file":"nav-main.es.js","sources":["../../../lib/components/sidebar/nav-main.tsx"],"sourcesContent":["import { Collapsible, CollapsibleContent, CollapsibleTrigger } from '@/components/ui/collapsible';\nimport {\n  SidebarGroup,\n  SidebarMenu,\n  SidebarMenuButton,\n  SidebarMenuItem,\n  SidebarMenuSub,\n  SidebarMenuSubButton,\n  SidebarMenuSubItem,\n  useSidebar,\n} from '@/components/ui/sidebar';\nimport { Link, useMatches } from '@tanstack/react-router';\nimport { ChevronRight, type LucideIcon } from 'lucide-react';\nimport { useEffect, useState } from 'react';\n\nexport type NavItem = {\n  path: string;\n  label: string;\n  display: boolean;\n  icon: LucideIcon;\n  children?: { path: string; label: string; icon: LucideIcon; display: boolean }[];\n};\n\nexport function NavMain({ items }: { items: NavItem[] }) {\n  const { setOpen } = useSidebar();\n  const [openItem, setOpenItem] = useState<string | null>(null);\n  const matches = useMatches();\n  const currentPath = matches.length > 0 ? matches[matches.length - 1].pathname : '';\n\n  const isChildActive = (item: NavItem) => {\n    if (!item.children) return false;\n    return item.children.some((child) => currentPath.startsWith(child.path));\n  };\n\n  const isParentActive = (item: NavItem) => {\n    return currentPath.startsWith(item.path) || isChildActive(item);\n  };\n\n  // Set initial open state based on active paths\n  useEffect(() => {\n    items.forEach((item) => {\n      if (isChildActive(item)) {\n        setOpenItem(item.label);\n      }\n    });\n  }, [currentPath]); // Re-run when path changes\n\n  const handleToggle = (title: string) => {\n    setOpenItem((prev) => (prev === title ? null : title));\n  };\n\n  const commonLinkStyles = `\n    w-full rounded-md px-2 py-1.5\n    transition-colors duration-200\n    hover:bg-neutral-4 focus-visible:bg-neutral-4\n    text-neutral-10 hover:text-neutral-10\n    no-underline\n    flex items-center gap-2\n  `;\n\n  const activeStyles = `bg-neutral-4 font-bold`;\n\n  return (\n    <SidebarGroup>\n      <SidebarMenu className=\"flex flex-col gap-1\">\n        {items.map((item) =>\n          item.children && item.display && item.children.length > 0 ? (\n            <Collapsible\n              key={item.label}\n              asChild\n              open={openItem === item.label || isChildActive(item)}\n              className=\"group/collapsible w-full\"\n            >\n              <SidebarMenuItem>\n                <CollapsibleTrigger asChild>\n                  <SidebarMenuButton\n                    tooltip={item.label}\n                    onClick={() => {\n                      setOpen(true);\n                      handleToggle(item.label);\n                    }}\n                    className={`${commonLinkStyles} ${isParentActive(item) ? activeStyles : ''}`}\n                  >\n                    {item.icon && <item.icon className=\"h-4 w-4\" />}\n                    <span className=\"flex-1\">{item.label}</span>\n                    <ChevronRight\n                      className={`h-4 w-4 transition-transform duration-200 ${\n                        openItem === item.label || isChildActive(item) ? 'rotate-90' : ''\n                      }`}\n                    />\n                  </SidebarMenuButton>\n                </CollapsibleTrigger>\n                <CollapsibleContent>\n                  <SidebarMenuSub className=\"w-full flex flex-col gap-1\">\n                    {item.children.map(\n                      (subItem) =>\n                        subItem.display && (\n                          <SidebarMenuSubItem key={subItem.label}>\n                            <SidebarMenuSubButton asChild>\n                              <Link\n                                to={subItem.path}\n                                className={commonLinkStyles}\n                                activeProps={{\n                                  className: activeStyles,\n                                }}\n                              >\n                                {subItem.icon && <subItem.icon className=\"h-4 w-4\" />}\n                                <span>{subItem.label}</span>\n                              </Link>\n                            </SidebarMenuSubButton>\n                          </SidebarMenuSubItem>\n                        ),\n                    )}\n                  </SidebarMenuSub>\n                </CollapsibleContent>\n              </SidebarMenuItem>\n            </Collapsible>\n          ) : (\n            item.display && (\n              <SidebarMenuItem key={item.label}>\n                <SidebarMenuButton asChild tooltip={item.label}>\n                  <Link\n                    to={item.path}\n                    className={commonLinkStyles}\n                    activeProps={{\n                      className: activeStyles,\n                    }}\n                  >\n                    {item.icon && <item.icon className=\"h-4 w-4\" />}\n                    <span>{item.label}</span>\n                  </Link>\n                </SidebarMenuButton>\n              </SidebarMenuItem>\n            )\n          ),\n        )}\n      </SidebarMenu>\n    </SidebarGroup>\n  );\n}\n"],"names":["NavMain","items","setOpen","useSidebar","openItem","setOpenItem","useState","matches","useMatches","currentPath","isChildActive","item","child","isParentActive","useEffect","handleToggle","title","prev","commonLinkStyles","activeStyles","SidebarGroup","jsx","SidebarMenu","Collapsible","SidebarMenuItem","CollapsibleTrigger","jsxs","SidebarMenuButton","ChevronRight","CollapsibleContent","SidebarMenuSub","subItem","SidebarMenuSubItem","SidebarMenuSubButton","Link"],"mappings":";;;;;;AAuBgB,SAAAA,EAAQ,EAAE,OAAAC,KAA+B;AACjD,QAAA,EAAE,SAAAC,EAAQ,IAAIC,EAAW,GACzB,CAACC,GAAUC,CAAW,IAAIC,EAAwB,IAAI,GACtDC,IAAUC,EAAW,GACrBC,IAAcF,EAAQ,SAAS,IAAIA,EAAQA,EAAQ,SAAS,CAAC,EAAE,WAAW,IAE1EG,IAAgB,CAACC,MAChBA,EAAK,WACHA,EAAK,SAAS,KAAK,CAACC,MAAUH,EAAY,WAAWG,EAAM,IAAI,CAAC,IAD5C,IAIvBC,IAAiB,CAACF,MACfF,EAAY,WAAWE,EAAK,IAAI,KAAKD,EAAcC,CAAI;AAIhE,EAAAG,EAAU,MAAM;AACR,IAAAb,EAAA,QAAQ,CAACU,MAAS;AAClB,MAAAD,EAAcC,CAAI,KACpBN,EAAYM,EAAK,KAAK;AAAA,IACxB,CACD;AAAA,EAAA,GACA,CAACF,CAAW,CAAC;AAEV,QAAAM,IAAe,CAACC,MAAkB;AACtC,IAAAX,EAAY,CAACY,MAAUA,MAASD,IAAQ,OAAOA,CAAM;AAAA,EACvD,GAEME,IAAmB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,KASnBC,IAAe;AAErB,2BACGC,GACC,EAAA,UAAA,gBAAAC,EAACC,GAAY,EAAA,WAAU,uBACpB,UAAMrB,EAAA;AAAA,IAAI,CAACU,MACVA,EAAK,YAAYA,EAAK,WAAWA,EAAK,SAAS,SAAS,IACtD,gBAAAU;AAAA,MAACE;AAAA,MAAA;AAAA,QAEC,SAAO;AAAA,QACP,MAAMnB,MAAaO,EAAK,SAASD,EAAcC,CAAI;AAAA,QACnD,WAAU;AAAA,QAEV,4BAACa,GACC,EAAA,UAAA;AAAA,UAAC,gBAAAH,EAAAI,GAAA,EAAmB,SAAO,IACzB,UAAA,gBAAAC;AAAA,YAACC;AAAA,YAAA;AAAA,cACC,SAAShB,EAAK;AAAA,cACd,SAAS,MAAM;AACb,gBAAAT,EAAQ,EAAI,GACZa,EAAaJ,EAAK,KAAK;AAAA,cACzB;AAAA,cACA,WAAW,GAAGO,CAAgB,IAAIL,EAAeF,CAAI,IAAIQ,IAAe,EAAE;AAAA,cAEzE,UAAA;AAAA,gBAAAR,EAAK,QAAS,gBAAAU,EAAAV,EAAK,MAAL,EAAU,WAAU,WAAU;AAAA,gBAC5C,gBAAAU,EAAA,QAAA,EAAK,WAAU,UAAU,YAAK,OAAM;AAAA,gBACrC,gBAAAA;AAAA,kBAACO;AAAA,kBAAA;AAAA,oBACC,WAAW,6CACTxB,MAAaO,EAAK,SAASD,EAAcC,CAAI,IAAI,cAAc,EACjE;AAAA,kBAAA;AAAA,gBAAA;AAAA,cACF;AAAA,YAAA;AAAA,UAAA,GAEJ;AAAA,4BACCkB,GACC,EAAA,UAAA,gBAAAR,EAACS,KAAe,WAAU,8BACvB,YAAK,SAAS;AAAA,YACb,CAACC,MACCA,EAAQ,6BACLC,GACC,EAAA,UAAA,gBAAAX,EAACY,GAAqB,EAAA,SAAO,IAC3B,UAAA,gBAAAP;AAAA,cAACQ;AAAA,cAAA;AAAA,gBACC,IAAIH,EAAQ;AAAA,gBACZ,WAAWb;AAAA,gBACX,aAAa;AAAA,kBACX,WAAWC;AAAA,gBACb;AAAA,gBAEC,UAAA;AAAA,kBAAAY,EAAQ,QAAS,gBAAAV,EAAAU,EAAQ,MAAR,EAAa,WAAU,WAAU;AAAA,kBACnD,gBAAAV,EAAC,QAAM,EAAA,UAAAU,EAAQ,MAAM,CAAA;AAAA,gBAAA;AAAA,cAAA;AAAA,YAAA,GAEzB,EAZuB,GAAAA,EAAQ,KAajC;AAAA,aAGR,EACF,CAAA;AAAA,QAAA,EACF,CAAA;AAAA,MAAA;AAAA,MA/CKpB,EAAK;AAAA,IAAA,IAkDZA,EAAK,WACF,gBAAAU,EAAAG,GAAA,EACC,UAAC,gBAAAH,EAAAM,GAAA,EAAkB,SAAO,IAAC,SAAShB,EAAK,OACvC,UAAA,gBAAAe;AAAA,MAACQ;AAAA,MAAA;AAAA,QACC,IAAIvB,EAAK;AAAA,QACT,WAAWO;AAAA,QACX,aAAa;AAAA,UACX,WAAWC;AAAA,QACb;AAAA,QAEC,UAAA;AAAA,UAAAR,EAAK,QAAS,gBAAAU,EAAAV,EAAK,MAAL,EAAU,WAAU,WAAU;AAAA,UAC7C,gBAAAU,EAAC,QAAM,EAAA,UAAAV,EAAK,MAAM,CAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA,GAEtB,EAZoB,GAAAA,EAAK,KAa3B;AAAA,KAIR,EACF,CAAA;AAEJ;"}

package/dist/components/static-data-table/data-table.es.js

@@ -1,10 +1,10 @@
 import { jsx as e, jsxs as n } from "react/jsx-runtime";
-import { Table as s, TableHeader as x, TableRow as p, TableCell as a, TableBody as f } from "../ui/table.es.js";
-import { Badge as g } from "lucide-react";
+import { Badge as s } from "../ui/badge.es.js";
+import { Table as x, TableHeader as f, TableRow as m, TableCell as a, TableBody as g } from "../ui/table.es.js";
 import { getResourceDisplayName as u, getValueFromData as v } from "../data-table/table-utils/constants.es.js";
-function b({ accessors: d, data: m, affectedData: t }) {
-  return /* @__PURE__ */ e("div", { className: "relative overflow-hidden border max-h-[50vh]", children: /* @__PURE__ */ e("div", { className: "overflow-y-auto max-h-[50vh]", children: /* @__PURE__ */ n(s, { children: [
-    /* @__PURE__ */ e(x, { className: "text-left align-middle uppercase sticky top-0 z-10 bg-card", children: /* @__PURE__ */ n(p, { children: [
+function b({ accessors: d, data: o, affectedData: t }) {
+  return /* @__PURE__ */ e("div", { className: "relative overflow-hidden border max-h-[50vh]", children: /* @__PURE__ */ e("div", { className: "overflow-y-auto max-h-[50vh]", children: /* @__PURE__ */ n(x, { children: [
+    /* @__PURE__ */ e(f, { className: "text-left align-middle sticky top-0 z-10 bg-card", children: /* @__PURE__ */ n(m, { children: [
       d.map((r) => /* @__PURE__ */ e(
         a,
         {
@@ -15,13 +15,13 @@ function b({ accessors: d, data: m, affectedData: t }) {
       )),
       t && /* @__PURE__ */ e(a, { className: "px-4 py-2 text-left text-sm font-medium cursor-pointer whitespace-nowrap bg-card", children: "Affected" })
     ] }) }),
-    /* @__PURE__ */ e(f, { children: m.map((r, o) => /* @__PURE__ */ n(p, { children: [
+    /* @__PURE__ */ e(g, { children: o.map((r, p) => /* @__PURE__ */ n(m, { children: [
       d.map((l) => {
         const c = r[l];
-        return Array.isArray(c) ? /* @__PURE__ */ e(a, { className: "flex gap-4", children: c.map((i, h) => /* @__PURE__ */ e(g, { children: (i == null ? void 0 : i.name) || i }, h)) }, String(l)) : /* @__PURE__ */ e(a, { children: v(r, l) }, String(l));
+        return Array.isArray(c) ? /* @__PURE__ */ e(a, { className: "flex gap-4", children: c.map((i, h) => /* @__PURE__ */ e(s, { children: (i == null ? void 0 : i.name) || i }, h)) }, String(l)) : /* @__PURE__ */ e(a, { children: v(r, l) }, String(l));
       }),
       t && /* @__PURE__ */ e(a, { children: t.includes(r) ? /* @__PURE__ */ e("span", { className: "text-success-10", children: "✔" }) : /* @__PURE__ */ e("span", { className: "text-destructive", children: "✖" }) })
-    ] }, o)) })
+    ] }, p)) })
   ] }) }) });
 }
 export {

package/dist/components/static-data-table/data-table.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"data-table.es.js","sources":["../../../lib/components/static-data-table/data-table.tsx"],"sourcesContent":["import { getResourceDisplayName, getValueFromData } from '@/components/data-table';\nimport { Table, TableBody, TableCell, TableHeader, TableRow } from '@/components/ui/table';\nimport { Badge } from 'lucide-react';\n\nexport interface StaticDataTableProps<T> {\n  accessors: (keyof T)[];\n  data: T[];\n  affectedData?: T[];\n}\n\nexport function StaticDataTable<T>({ accessors, data, affectedData }: StaticDataTableProps<T>) {\n  return (\n    <div className=\"relative overflow-hidden border max-h-[50vh]\">\n      <div className=\"overflow-y-auto max-h-[50vh]\">\n        <Table>\n          <TableHeader className=\"text-left align-middle uppercase sticky top-0 z-10 bg-card\">\n            <TableRow>\n              {accessors.map((accessor) => (\n                <TableCell\n                  key={String(accessor)}\n                  className=\"px-4 py-2 text-left text-sm font-medium cursor-pointer whitespace-nowrap bg-card\"\n                >\n                  {getResourceDisplayName(String(accessor), 'admin-portal')}\n                </TableCell>\n              ))}\n              {affectedData && (\n                <TableCell className=\"px-4 py-2 text-left text-sm font-medium cursor-pointer whitespace-nowrap bg-card\">\n                  Affected\n                </TableCell>\n              )}\n            </TableRow>\n          </TableHeader>\n          <TableBody>\n            {data.map((item, index) => (\n              <TableRow key={index}>\n                {accessors.map((accessor) => {\n                  const value = item[accessor];\n                  // Handle arrays (e.g., userGroups) with badges\n                  if (Array.isArray(value)) {\n                    return (\n                      <TableCell key={String(accessor)} className=\"flex gap-4\">\n                        {value.map((subItem, subIndex) => (\n                          <Badge key={subIndex}>{subItem?.name || subItem}</Badge>\n                        ))}\n                      </TableCell>\n                    );\n                  }\n                  // Handle other data types\n                  return (\n                    <TableCell key={String(accessor)}>{getValueFromData(item, accessor)}</TableCell>\n                  );\n                })}\n                {affectedData && (\n                  <TableCell>\n                    {affectedData.includes(item) ? (\n                      <span className=\"text-success-10\">✔</span>\n                    ) : (\n                      <span className=\"text-destructive\">✖</span>\n                    )}\n                  </TableCell>\n                )}\n              </TableRow>\n            ))}\n          </TableBody>\n        </Table>\n      </div>\n    </div>\n  );\n}\n"],"names":["StaticDataTable","accessors","data","affectedData","jsx","jsxs","Table","TableHeader","TableRow","accessor","TableCell","getResourceDisplayName","TableBody","item","index","value","subItem","subIndex","Badge","getValueFromData"],"mappings":";;;;AAUO,SAASA,EAAmB,EAAE,WAAAC,GAAW,MAAAC,GAAM,cAAAC,KAAyC;AAE3F,SAAA,gBAAAC,EAAC,SAAI,WAAU,gDACb,4BAAC,OAAI,EAAA,WAAU,gCACb,UAAA,gBAAAC,EAACC,GACC,EAAA,UAAA;AAAA,IAAA,gBAAAF,EAACG,GAAY,EAAA,WAAU,8DACrB,UAAA,gBAAAF,EAACG,GACE,EAAA,UAAA;AAAA,MAAUP,EAAA,IAAI,CAACQ,MACd,gBAAAL;AAAA,QAACM;AAAA,QAAA;AAAA,UAEC,WAAU;AAAA,UAET,UAAuBC,EAAA,OAAOF,CAAQ,GAAG,cAAc;AAAA,QAAA;AAAA,QAHnD,OAAOA,CAAQ;AAAA,MAAA,CAKvB;AAAA,MACAN,KACC,gBAAAC,EAACM,GAAU,EAAA,WAAU,oFAAmF,UAExG,WAAA,CAAA;AAAA,IAAA,EAAA,CAEJ,EACF,CAAA;AAAA,IACA,gBAAAN,EAACQ,KACE,UAAKV,EAAA,IAAI,CAACW,GAAMC,wBACdN,GACE,EAAA,UAAA;AAAA,MAAUP,EAAA,IAAI,CAACQ,MAAa;AACrB,cAAAM,IAAQF,EAAKJ,CAAQ;AAEvB,eAAA,MAAM,QAAQM,CAAK,sBAElBL,GAAiC,EAAA,WAAU,cACzC,UAAMK,EAAA,IAAI,CAACC,GAASC,wBAClBC,GAAsB,EAAA,WAAAF,KAAA,gBAAAA,EAAS,SAAQA,EAA5B,GAAAC,CAAoC,CACjD,EAHa,GAAA,OAAOR,CAAQ,CAI/B,IAKF,gBAAAL,EAACM,KAAkC,UAAiBS,EAAAN,GAAMJ,CAAQ,EAAlD,GAAA,OAAOA,CAAQ,CAAqC;AAAA,MAAA,CAEvE;AAAA,MACAN,KACE,gBAAAC,EAAAM,GAAA,EACE,YAAa,SAASG,CAAI,IACxB,gBAAAT,EAAA,QAAA,EAAK,WAAU,mBAAkB,eAAC,IAEnC,gBAAAA,EAAC,UAAK,WAAU,oBAAmB,cAAC,CAAA,EAExC,CAAA;AAAA,IAAA,EAzBW,GAAAU,CA2Bf,CACD,EACH,CAAA;AAAA,EAAA,EACF,CAAA,EACF,CAAA,GACF;AAEJ;"}
+{"version":3,"file":"data-table.es.js","sources":["../../../lib/components/static-data-table/data-table.tsx"],"sourcesContent":["import { getResourceDisplayName, getValueFromData } from '@/components/data-table';\nimport { Badge } from '@/components/ui/badge';\nimport { Table, TableBody, TableCell, TableHeader, TableRow } from '@/components/ui/table';\n\n\nexport interface StaticDataTableProps<T> {\n  accessors: (keyof T)[];\n  data: T[];\n  affectedData?: T[];\n}\n\nexport function StaticDataTable<T>({ accessors, data, affectedData }: StaticDataTableProps<T>) {\n  return (\n    <div className=\"relative overflow-hidden border max-h-[50vh]\">\n      <div className=\"overflow-y-auto max-h-[50vh]\">\n        <Table>\n          <TableHeader className=\"text-left align-middle sticky top-0 z-10 bg-card\">\n            <TableRow>\n              {accessors.map((accessor) => (\n                <TableCell\n                  key={String(accessor)}\n                  className=\"px-4 py-2 text-left text-sm font-medium cursor-pointer whitespace-nowrap bg-card\"\n                >\n                  {getResourceDisplayName(String(accessor), 'admin-portal')}\n                </TableCell>\n              ))}\n              {affectedData && (\n                <TableCell className=\"px-4 py-2 text-left text-sm font-medium cursor-pointer whitespace-nowrap bg-card\">\n                  Affected\n                </TableCell>\n              )}\n            </TableRow>\n          </TableHeader>\n          <TableBody>\n            {data.map((item, index) => (\n              <TableRow key={index}>\n                {accessors.map((accessor) => {\n                  const value = item[accessor];\n                  // Handle arrays (e.g., userGroups) with badges\n                  if (Array.isArray(value)) {\n                    return (\n                      <TableCell key={String(accessor)} className=\"flex gap-4\">\n                        {value.map((subItem, subIndex) => (\n                          <Badge key={subIndex}>{subItem?.name || subItem}</Badge>\n                        ))}\n                      </TableCell>\n                    );\n                  }\n                  // Handle other data types\n                  return (\n                    <TableCell key={String(accessor)}>{getValueFromData(item, accessor)}</TableCell>\n                  );\n                })}\n                {affectedData && (\n                  <TableCell>\n                    {affectedData.includes(item) ? (\n                      <span className=\"text-success-10\">✔</span>\n                    ) : (\n                      <span className=\"text-destructive\">✖</span>\n                    )}\n                  </TableCell>\n                )}\n              </TableRow>\n            ))}\n          </TableBody>\n        </Table>\n      </div>\n    </div>\n  );\n}\n"],"names":["StaticDataTable","accessors","data","affectedData","jsx","jsxs","Table","TableHeader","TableRow","accessor","TableCell","getResourceDisplayName","TableBody","item","index","value","subItem","subIndex","Badge","getValueFromData"],"mappings":";;;;AAWO,SAASA,EAAmB,EAAE,WAAAC,GAAW,MAAAC,GAAM,cAAAC,KAAyC;AAE3F,SAAA,gBAAAC,EAAC,SAAI,WAAU,gDACb,4BAAC,OAAI,EAAA,WAAU,gCACb,UAAA,gBAAAC,EAACC,GACC,EAAA,UAAA;AAAA,IAAA,gBAAAF,EAACG,GAAY,EAAA,WAAU,oDACrB,UAAA,gBAAAF,EAACG,GACE,EAAA,UAAA;AAAA,MAAUP,EAAA,IAAI,CAACQ,MACd,gBAAAL;AAAA,QAACM;AAAA,QAAA;AAAA,UAEC,WAAU;AAAA,UAET,UAAuBC,EAAA,OAAOF,CAAQ,GAAG,cAAc;AAAA,QAAA;AAAA,QAHnD,OAAOA,CAAQ;AAAA,MAAA,CAKvB;AAAA,MACAN,KACC,gBAAAC,EAACM,GAAU,EAAA,WAAU,oFAAmF,UAExG,WAAA,CAAA;AAAA,IAAA,EAAA,CAEJ,EACF,CAAA;AAAA,IACA,gBAAAN,EAACQ,KACE,UAAKV,EAAA,IAAI,CAACW,GAAMC,wBACdN,GACE,EAAA,UAAA;AAAA,MAAUP,EAAA,IAAI,CAACQ,MAAa;AACrB,cAAAM,IAAQF,EAAKJ,CAAQ;AAEvB,eAAA,MAAM,QAAQM,CAAK,sBAElBL,GAAiC,EAAA,WAAU,cACzC,UAAMK,EAAA,IAAI,CAACC,GAASC,wBAClBC,GAAsB,EAAA,WAAAF,KAAA,gBAAAA,EAAS,SAAQA,EAA5B,GAAAC,CAAoC,CACjD,EAHa,GAAA,OAAOR,CAAQ,CAI/B,IAKF,gBAAAL,EAACM,KAAkC,UAAiBS,EAAAN,GAAMJ,CAAQ,EAAlD,GAAA,OAAOA,CAAQ,CAAqC;AAAA,MAAA,CAEvE;AAAA,MACAN,KACE,gBAAAC,EAAAM,GAAA,EACE,YAAa,SAASG,CAAI,IACxB,gBAAAT,EAAA,QAAA,EAAK,WAAU,mBAAkB,eAAC,IAEnC,gBAAAA,EAAC,UAAK,WAAU,oBAAmB,cAAC,CAAA,EAExC,CAAA;AAAA,IAAA,EAzBW,GAAAU,CA2Bf,CACD,EACH,CAAA;AAAA,EAAA,EACF,CAAA,EACF,CAAA,GACF;AAEJ;"}

package/dist/components/ui/avatar.es.js

@@ -26,7 +26,7 @@ const i = t.forwardRef(({ className: e, ...l }, r) => /* @__PURE__ */ s(
   {
     ref: r,
     className: m(
-      "flex h-full w-full items-center justify-center rounded-full bg-muted",
+      "flex h-full w-full items-center justify-center uppercase rounded-full bg-muted",
       e
     ),
     ...l

package/dist/components/ui/avatar.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"avatar.es.js","sources":["../../../lib/components/ui/avatar.tsx"],"sourcesContent":["'use client';\nimport * as AvatarPrimitive from '@radix-ui/react-avatar';\nimport * as React from 'react';\n\nimport { cn } from '@/utils';\n\nconst Avatar = React.forwardRef<\n  React.ElementRef<typeof AvatarPrimitive.Root>,\n  React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Root>\n>(({ className, ...props }, ref) => (\n  <AvatarPrimitive.Root\n    ref={ref}\n    className={cn('relative flex h-10 w-10 shrink-0 overflow-hidden rounded-full', className)}\n    {...props}\n  />\n));\nAvatar.displayName = AvatarPrimitive.Root.displayName;\n\nconst AvatarImage = React.forwardRef<\n  React.ElementRef<typeof AvatarPrimitive.Image>,\n  React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Image>\n>(({ className, ...props }, ref) => (\n  <AvatarPrimitive.Image\n    ref={ref}\n    className={cn('aspect-square h-full w-full', className)}\n    {...props}\n  />\n));\nAvatarImage.displayName = AvatarPrimitive.Image.displayName;\n\nconst AvatarFallback = React.forwardRef<\n  React.ElementRef<typeof AvatarPrimitive.Fallback>,\n  React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Fallback>\n>(({ className, ...props }, ref) => (\n  <AvatarPrimitive.Fallback\n    ref={ref}\n    className={cn(\n      'flex h-full w-full items-center justify-center rounded-full bg-muted',\n      className,\n    )}\n    {...props}\n  />\n));\nAvatarFallback.displayName = AvatarPrimitive.Fallback.displayName;\n\nexport { Avatar, AvatarFallback, AvatarImage };\n"],"names":["Avatar","React","className","props","ref","jsx","AvatarPrimitive","cn","AvatarImage","AvatarFallback"],"mappings":";;;;;AAMM,MAAAA,IAASC,EAAM,WAGnB,CAAC,EAAE,WAAAC,GAAW,GAAGC,EAAM,GAAGC,MAC1B,gBAAAC;AAAA,EAACC,EAAgB;AAAA,EAAhB;AAAA,IACC,KAAAF;AAAA,IACA,WAAWG,EAAG,iEAAiEL,CAAS;AAAA,IACvF,GAAGC;AAAA,EAAA;AACN,CACD;AACDH,EAAO,cAAcM,EAAgB,KAAK;AAEpC,MAAAE,IAAcP,EAAM,WAGxB,CAAC,EAAE,WAAAC,GAAW,GAAGC,EAAM,GAAGC,MAC1B,gBAAAC;AAAA,EAACC,EAAgB;AAAA,EAAhB;AAAA,IACC,KAAAF;AAAA,IACA,WAAWG,EAAG,+BAA+BL,CAAS;AAAA,IACrD,GAAGC;AAAA,EAAA;AACN,CACD;AACDK,EAAY,cAAcF,EAAgB,MAAM;AAE1C,MAAAG,IAAiBR,EAAM,WAG3B,CAAC,EAAE,WAAAC,GAAW,GAAGC,EAAM,GAAGC,MAC1B,gBAAAC;AAAA,EAACC,EAAgB;AAAA,EAAhB;AAAA,IACC,KAAAF;AAAA,IACA,WAAWG;AAAA,MACT;AAAA,MACAL;AAAA,IACF;AAAA,IACC,GAAGC;AAAA,EAAA;AACN,CACD;AACDM,EAAe,cAAcH,EAAgB,SAAS;"}
+{"version":3,"file":"avatar.es.js","sources":["../../../lib/components/ui/avatar.tsx"],"sourcesContent":["'use client';\nimport * as AvatarPrimitive from '@radix-ui/react-avatar';\nimport * as React from 'react';\n\nimport { cn } from '@/utils';\n\nconst Avatar = React.forwardRef<\n  React.ElementRef<typeof AvatarPrimitive.Root>,\n  React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Root>\n>(({ className, ...props }, ref) => (\n  <AvatarPrimitive.Root\n    ref={ref}\n    className={cn('relative flex h-10 w-10 shrink-0 overflow-hidden rounded-full', className)}\n    {...props}\n  />\n));\nAvatar.displayName = AvatarPrimitive.Root.displayName;\n\nconst AvatarImage = React.forwardRef<\n  React.ElementRef<typeof AvatarPrimitive.Image>,\n  React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Image>\n>(({ className, ...props }, ref) => (\n  <AvatarPrimitive.Image\n    ref={ref}\n    className={cn('aspect-square h-full w-full', className)}\n    {...props}\n  />\n));\nAvatarImage.displayName = AvatarPrimitive.Image.displayName;\n\nconst AvatarFallback = React.forwardRef<\n  React.ElementRef<typeof AvatarPrimitive.Fallback>,\n  React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Fallback>\n>(({ className, ...props }, ref) => (\n  <AvatarPrimitive.Fallback\n    ref={ref}\n    className={cn(\n      'flex h-full w-full items-center justify-center uppercase rounded-full bg-muted',\n      className,\n    )}\n    {...props}\n  />\n));\nAvatarFallback.displayName = AvatarPrimitive.Fallback.displayName;\n\nexport { Avatar, AvatarFallback, AvatarImage };\n"],"names":["Avatar","React","className","props","ref","jsx","AvatarPrimitive","cn","AvatarImage","AvatarFallback"],"mappings":";;;;;AAMM,MAAAA,IAASC,EAAM,WAGnB,CAAC,EAAE,WAAAC,GAAW,GAAGC,EAAM,GAAGC,MAC1B,gBAAAC;AAAA,EAACC,EAAgB;AAAA,EAAhB;AAAA,IACC,KAAAF;AAAA,IACA,WAAWG,EAAG,iEAAiEL,CAAS;AAAA,IACvF,GAAGC;AAAA,EAAA;AACN,CACD;AACDH,EAAO,cAAcM,EAAgB,KAAK;AAEpC,MAAAE,IAAcP,EAAM,WAGxB,CAAC,EAAE,WAAAC,GAAW,GAAGC,EAAM,GAAGC,MAC1B,gBAAAC;AAAA,EAACC,EAAgB;AAAA,EAAhB;AAAA,IACC,KAAAF;AAAA,IACA,WAAWG,EAAG,+BAA+BL,CAAS;AAAA,IACrD,GAAGC;AAAA,EAAA;AACN,CACD;AACDK,EAAY,cAAcF,EAAgB,MAAM;AAE1C,MAAAG,IAAiBR,EAAM,WAG3B,CAAC,EAAE,WAAAC,GAAW,GAAGC,EAAM,GAAGC,MAC1B,gBAAAC;AAAA,EAACC,EAAgB;AAAA,EAAhB;AAAA,IACC,KAAAF;AAAA,IACA,WAAWG;AAAA,MACT;AAAA,MACAL;AAAA,IACF;AAAA,IACC,GAAGC;AAAA,EAAA;AACN,CACD;AACDM,EAAe,cAAcH,EAAgB,SAAS;"}