@pibit.ai/cure-design-system 0.6.18 → 0.6.20

package/dist/patterns/breadcrumbs/breadcrumb-item.d.ts

@@ -0,0 +1,16 @@
+import { FC, ReactNode } from 'react';
+import { BreadcrumbProps as AriaBreadcrumbProps } from 'react-aria-components';
+import { BreadcrumbType } from './context';
+export interface BreadcrumbItemProps extends AriaBreadcrumbProps {
+    href?: string;
+    divider?: "chevron" | "slash";
+    type?: BreadcrumbType;
+    isEllipsis?: boolean;
+    children?: ReactNode;
+    icon?: FC<{
+        className?: string;
+    }> | ReactNode;
+    onClick?: () => void;
+}
+export declare const BreadcrumbItem: ({ href, icon, divider, type, isEllipsis, children, onClick, ...otherProps }: BreadcrumbItemProps) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=breadcrumb-item.d.ts.map

package/dist/patterns/breadcrumbs/breadcrumb-item.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"breadcrumb-item.d.ts","sourceRoot":"","sources":["../../../src/patterns/breadcrumbs/breadcrumb-item.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,EAAE,EAAE,KAAK,SAAS,EAA8B,MAAM,OAAO,CAAC;AAE5E,OAAO,EAEL,KAAK,eAAe,IAAI,mBAAmB,EAE5C,MAAM,uBAAuB,CAAC;AAG/B,OAAO,EAAE,KAAK,cAAc,EAAsB,MAAM,WAAW,CAAC;AAkFpE,MAAM,WAAW,mBAAoB,SAAQ,mBAAmB;IAC9D,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,SAAS,GAAG,OAAO,CAAC;IAC9B,IAAI,CAAC,EAAE,cAAc,CAAC;IACtB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,IAAI,CAAC,EAAE,EAAE,CAAC;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,GAAG,SAAS,CAAC;IAC9C,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,eAAO,MAAM,cAAc,GAAI,6EAS5B,mBAAmB,4CAqDrB,CAAC"}

package/dist/patterns/breadcrumbs/breadcrumb-item.js

@@ -0,0 +1,120 @@
+import { jsx as e, jsxs as p, Fragment as f } from "react/jsx-runtime";
+import { useContext as g, isValidElement as v } from "react";
+import { SlashDivider as d, ChevronRight as b } from "@untitledui/icons";
+import { Breadcrumb as y, Link as _ } from "react-aria-components";
+import { cx as l } from "../../utils/cn.js";
+import { isReactComponent as q } from "../../utils/is-react-component.js";
+import { BreadcrumbsContext as N } from "./context.js";
+const o = {
+  text: {
+    root: "",
+    icon: "text-fg-quaternary group-hover:text-fg-quaternary_hover",
+    label: "text-quaternary group-hover:text-tertiary_hover max-w-40",
+    current: {
+      root: "",
+      icon: "text-primary group-hover:text-primary_hover",
+      label: "text-primary group-hover:text-primary_hover"
+    }
+  },
+  button: {
+    root: "p-1 hover:bg-primary_hover",
+    icon: "text-fg-quaternary group-hover:text-fg-quaternary_hover",
+    label: "px-1 text-quaternary group-hover:text-tertiary_hover",
+    current: {
+      root: "bg-primary_hover",
+      icon: "text-fg-quaternary_hover",
+      label: "text-fg-tertiary_hover"
+    }
+  }
+}, h = ({
+  href: a,
+  children: s,
+  icon: t,
+  type: r = "text",
+  current: i,
+  className: m,
+  ...n
+}) => /* @__PURE__ */ p(
+  a ? _ : "button",
+  {
+    ...n,
+    href: a,
+    className: l(
+      "group inline-flex cursor-pointer items-center justify-center gap-1 rounded-md outline-focus-ring transition duration-100 ease-linear focus-visible:outline-2 focus-visible:outline-offset-2 in-current:max-w-full",
+      o[r].root,
+      i && o[r].current.root,
+      !a && !n.onClick && "cursor-default",
+      m
+    ),
+    children: [
+      q(t) && /* @__PURE__ */ e(
+        t,
+        {
+          className: l(
+            "size-5 transition-inherit-all",
+            o[r].icon,
+            i && o[r].current.icon
+          )
+        }
+      ),
+      v(t) && t,
+      s && /* @__PURE__ */ e(
+        "span",
+        {
+          className: l(
+            "text-sm font-medium whitespace-nowrap transition-inherit-all in-current:truncate",
+            o[r].label,
+            i && o[r].current.label
+          ),
+          children: s
+        }
+      )
+    ]
+  }
+), R = ({
+  href: a,
+  icon: s,
+  divider: t,
+  type: r,
+  isEllipsis: i,
+  children: m,
+  onClick: n,
+  ...c
+}) => {
+  const u = g(N);
+  return r = u.type || "text", t = u.divider || "chevron", /* @__PURE__ */ e(
+    y,
+    {
+      ...c,
+      className: l(
+        "flex items-center current:overflow-hidden",
+        "gap-0.5 md:gap-0.5"
+      ),
+      children: ({ isCurrent: x }) => /* @__PURE__ */ p(f, { children: [
+        i ? /* @__PURE__ */ e(
+          h,
+          {
+            "aria-label": "See all breadcrumb items",
+            type: r === "text-line" ? "text" : r,
+            onClick: n,
+            children: "..."
+          }
+        ) : /* @__PURE__ */ e(
+          h,
+          {
+            href: a,
+            icon: s,
+            current: x,
+            type: r === "text-line" ? "text" : r,
+            onClick: n,
+            children: m
+          }
+        ),
+        !x && /* @__PURE__ */ e("div", { className: "shrink-0 text-fg-quaternary", children: t === "slash" ? /* @__PURE__ */ e(d, { className: "size-2.5 stroke-3" }) : /* @__PURE__ */ e(b, { className: "size-4" }) })
+      ] })
+    }
+  );
+};
+export {
+  R as BreadcrumbItem
+};

package/dist/patterns/breadcrumbs/breadcrumbs.d.ts

@@ -0,0 +1,20 @@
+import { ReactNode } from 'react';
+import { BreadcrumbType } from './context';
+export interface BreadcrumbsProps {
+    divider?: "chevron" | "slash";
+    children: ReactNode;
+    type?: BreadcrumbType;
+    className?: string;
+    /**
+     * The maximum number of visible items. If the number of items
+     * exceeds this value, the breadcrumbs will collapse into a single
+     * item with an ellipsis that can be expanded.
+     */
+    maxVisibleItems?: number;
+}
+declare const Breadcrumbs: {
+    ({ children, divider, type, className, maxVisibleItems, }: BreadcrumbsProps): import("react/jsx-runtime").JSX.Element;
+    Item: ({ href, icon, divider, type, isEllipsis, children, onClick, ...otherProps }: import('./breadcrumb-item').BreadcrumbItemProps) => import("react/jsx-runtime").JSX.Element;
+};
+export { Breadcrumbs };
+//# sourceMappingURL=breadcrumbs.d.ts.map

package/dist/patterns/breadcrumbs/breadcrumbs.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"breadcrumbs.d.ts","sourceRoot":"","sources":["../../../src/patterns/breadcrumbs/breadcrumbs.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,KAAK,SAAS,EAAY,MAAM,OAAO,CAAC;AAIxD,OAAO,EAAE,KAAK,cAAc,EAAsB,MAAM,WAAW,CAAC;AAQpE,MAAM,WAAW,gBAAgB;IAC/B,OAAO,CAAC,EAAE,SAAS,GAAG,OAAO,CAAC;IAC9B,QAAQ,EAAE,SAAS,CAAC;IACpB,IAAI,CAAC,EAAE,cAAc,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;OAIG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B;AASD,QAAA,MAAM,WAAW;+DAMd,gBAAgB;;CAwClB,CAAC;AAIF,OAAO,EAAE,WAAW,EAAE,CAAC"}

package/dist/patterns/breadcrumbs/breadcrumbs.js

@@ -0,0 +1,39 @@
+import { jsx as t } from "react/jsx-runtime";
+import h, { useState as g } from "react";
+import { Breadcrumbs as x } from "react-aria-components";
+import { cx as n } from "../../utils/cn.js";
+import { BreadcrumbItem as l } from "./breadcrumb-item.js";
+import { BreadcrumbsContext as B } from "./context.js";
+const v = {
+  text: "gap-0.5 md:gap-0.5",
+  "text-line": "pl-2 gap-1.25 md:gap-1.25 py-2 after:pointer-events-none after:absolute after:inset-0 after:border-b after:border-t after:border-secondary",
+  button: "gap-0.5 md:gap-0.5"
+}, C = ({
+  children: c,
+  divider: a = "slash",
+  type: s = "text",
+  className: i,
+  maxVisibleItems: r = 4
+}) => {
+  const [m, d] = g(!1), p = (() => {
+    const e = h.Children.toArray(c);
+    if (!r || e.length <= r || m)
+      return e;
+    const f = e.slice(0, Math.ceil(r / 2)), o = Math.floor((r - 1) / 2), u = o > 0 ? e.slice(-o) : [], b = /* @__PURE__ */ t(
+      l,
+      {
+        isEllipsis: !0,
+        divider: a,
+        type: s,
+        onClick: () => d(!0)
+      },
+      "ellipsis"
+    );
+    return [...f, b, ...u];
+  })();
+  return /* @__PURE__ */ t("nav", { "aria-label": "Breadcrumbs", className: n("min-w-0", i), children: /* @__PURE__ */ t(B.Provider, { value: { divider: a, type: s }, children: /* @__PURE__ */ t(x, { className: n("relative flex", v[s]), children: p }) }) });
+};
+C.Item = l;
+export {
+  C as Breadcrumbs
+};

package/dist/patterns/breadcrumbs/context.d.ts

@@ -0,0 +1,6 @@
+export type BreadcrumbType = "text" | "text-line" | "button";
+export declare const BreadcrumbsContext: import('react').Context<{
+    divider: "chevron" | "slash";
+    type: BreadcrumbType;
+}>;
+//# sourceMappingURL=context.d.ts.map

package/dist/patterns/breadcrumbs/context.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../../../src/patterns/breadcrumbs/context.ts"],"names":[],"mappings":"AAEA,MAAM,MAAM,cAAc,GAAG,MAAM,GAAG,WAAW,GAAG,QAAQ,CAAC;AAE7D,eAAO,MAAM,kBAAkB;aACpB,SAAS,GAAG,OAAO;UACtB,cAAc;EAIpB,CAAC"}

package/dist/patterns/breadcrumbs/context.js

@@ -0,0 +1,8 @@
+import { createContext as t } from "react";
+const r = t({
+  divider: "slash",
+  type: "text"
+});
+export {
+  r as BreadcrumbsContext
+};

package/dist/patterns/breadcrumbs/index.d.ts

@@ -0,0 +1,4 @@
+export { Breadcrumbs, type BreadcrumbsProps } from './breadcrumbs';
+export type { BreadcrumbItemProps } from './breadcrumb-item';
+export type { BreadcrumbType } from './context';
+//# sourceMappingURL=index.d.ts.map

package/dist/patterns/breadcrumbs/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/patterns/breadcrumbs/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,KAAK,gBAAgB,EAAE,MAAM,eAAe,CAAC;AACnE,YAAY,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AAC7D,YAAY,EAAE,cAAc,EAAE,MAAM,WAAW,CAAC"}

package/dist/patterns/page-header/index.d.ts

@@ -0,0 +1,2 @@
+export { PageHeader, type PageHeaderProps, type PageHeaderBreadcrumb, } from './page-header';
+//# sourceMappingURL=index.d.ts.map

package/dist/patterns/page-header/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/patterns/page-header/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,UAAU,EACV,KAAK,eAAe,EACpB,KAAK,oBAAoB,GAC1B,MAAM,eAAe,CAAC"}

package/dist/patterns/page-header/page-header.d.ts

@@ -0,0 +1,18 @@
+import { ReactNode } from 'react';
+export interface PageHeaderBreadcrumb {
+    label: ReactNode;
+    href?: string;
+    onClick?: () => void;
+}
+export interface PageHeaderProps {
+    /** The trail, root first. One crumb renders as the page title, in a taller header. */
+    breadcrumbs?: PageHeaderBreadcrumb[];
+    /** Shows a two-segment shimmer in place of the crumbs. */
+    breadcrumbsLoading?: boolean;
+    /** Right-hand side, e.g. a notifications button and the account menu. */
+    actions?: ReactNode;
+    className?: string;
+    children?: ReactNode;
+}
+export declare function PageHeader({ breadcrumbs, breadcrumbsLoading, actions, className, children, }: PageHeaderProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=page-header.d.ts.map

package/dist/patterns/page-header/page-header.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"page-header.d.ts","sourceRoot":"","sources":["../../../src/patterns/page-header/page-header.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAYvC,MAAM,WAAW,oBAAoB;IACnC,KAAK,EAAE,SAAS,CAAC;IACjB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,MAAM,WAAW,eAAe;IAC9B,sFAAsF;IACtF,WAAW,CAAC,EAAE,oBAAoB,EAAE,CAAC;IACrC,0DAA0D;IAC1D,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,yEAAyE;IACzE,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,wBAAgB,UAAU,CAAC,EACzB,WAAgB,EAChB,kBAAkB,EAClB,OAAO,EACP,SAAS,EACT,QAAQ,GACT,EAAE,eAAe,2CAmDjB"}

package/dist/patterns/page-header/page-header.js

@@ -0,0 +1,52 @@
+import { jsxs as a, jsx as e } from "react/jsx-runtime";
+import { cx as s } from "../../utils/cn.js";
+import { ShimmerLine as n } from "../../primitives/shimmer/shimmer.js";
+import { Breadcrumbs as m } from "../breadcrumbs/breadcrumbs.js";
+function w({
+  breadcrumbs: t = [],
+  breadcrumbsLoading: c,
+  actions: h,
+  className: x,
+  children: d
+}) {
+  const i = t.length === 1;
+  return /* @__PURE__ */ a(
+    "header",
+    {
+      className: s(
+        "flex items-center justify-between mx-6 relative z-50",
+        i ? "mt-6 py-2" : "py-1.5",
+        x
+      ),
+      children: [
+        /* @__PURE__ */ e("div", { className: "flex-1 min-w-0", children: c ? /* @__PURE__ */ a("div", { className: "flex items-center gap-1.5", "aria-hidden": !0, children: [
+          /* @__PURE__ */ e(n, { width: "56px", height: "14px", className: "rounded" }),
+          /* @__PURE__ */ e("span", { className: "text-tertiary text-xs", children: "/" }),
+          /* @__PURE__ */ e(n, { width: "120px", height: "14px", className: "rounded" })
+        ] }) : t.length > 0 ? /* @__PURE__ */ e(m, { children: t.map((l, r) => /* @__PURE__ */ e(
+          m.Item,
+          {
+            href: l.href,
+            onClick: l.onClick,
+            children: /* @__PURE__ */ e(
+              "span",
+              {
+                className: s(
+                  "whitespace-nowrap overflow-hidden text-ellipsis w-full block",
+                  r === t.length - 1 ? i ? "text-lg font-semibold text-primary" : "text-xs" : "text-tertiary text-xs"
+                ),
+                children: l.label
+              }
+            )
+          },
+          r
+        )) }) : null }),
+        /* @__PURE__ */ e("div", { className: "flex items-center gap-3.5 ml-4", children: h }),
+        d
+      ]
+    }
+  );
+}
+export {
+  w as PageHeader
+};

package/dist/patterns/sub-sidebar/index.d.ts

@@ -0,0 +1,3 @@
+export { SubSidebar, type SubSidebarProps } from './sub-sidebar';
+export type { SubSidebarConfig, SubSidebarSection, SubSidebarItem, SubSidebarChildItem, SubSidebarLinkProps, SubSidebarGuard, } from './types';
+//# sourceMappingURL=index.d.ts.map

package/dist/patterns/sub-sidebar/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/patterns/sub-sidebar/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,MAAM,eAAe,CAAC;AACjE,YAAY,EACV,gBAAgB,EAChB,iBAAiB,EACjB,cAAc,EACd,mBAAmB,EACnB,mBAAmB,EACnB,eAAe,GAChB,MAAM,SAAS,CAAC"}

package/dist/patterns/sub-sidebar/sub-sidebar.d.ts

@@ -0,0 +1,20 @@
+import { ReactNode } from 'react';
+import { SubSidebarConfig, SubSidebarGuard, SubSidebarLinkProps } from './types';
+export interface SubSidebarProps {
+    /**
+     * Keep it stable (memoize it): a group holding the active link re-opens whenever `config.sections` changes
+     * identity, so an inline config re-opens it on every parent render.
+     */
+    config: SubSidebarConfig;
+    /** The current location's path, e.g. `useLocation().pathname`. */
+    currentPath: string;
+    isCollapsed: boolean;
+    onCollapsedChange: (collapsed: boolean) => void;
+    /** Renders each link. Default: a plain `<a href>`. */
+    renderLink?: (props: SubSidebarLinkProps) => ReactNode;
+    /** Permission check for sections, items and child links. Default: everything renders. */
+    guard?: SubSidebarGuard;
+    className?: string;
+}
+export declare const SubSidebar: ({ config, currentPath, isCollapsed, onCollapsedChange, renderLink, guard, className, }: SubSidebarProps) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=sub-sidebar.d.ts.map

package/dist/patterns/sub-sidebar/sub-sidebar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sub-sidebar.d.ts","sourceRoot":"","sources":["../../../src/patterns/sub-sidebar/sub-sidebar.tsx"],"names":[],"mappings":"AAAA,OAAO,EAKL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAQf,OAAO,KAAK,EACV,gBAAgB,EAChB,eAAe,EAEf,mBAAmB,EACpB,MAAM,SAAS,CAAC;AAajB,MAAM,WAAW,eAAe;IAC9B;;;OAGG;IACH,MAAM,EAAE,gBAAgB,CAAC;IACzB,kEAAkE;IAClE,WAAW,EAAE,MAAM,CAAC;IACpB,WAAW,EAAE,OAAO,CAAC;IACrB,iBAAiB,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;IAChD,sDAAsD;IACtD,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,mBAAmB,KAAK,SAAS,CAAC;IACvD,yFAAyF;IACzF,KAAK,CAAC,EAAE,eAAe,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAcD,eAAO,MAAM,UAAU,GAAI,wFAQxB,eAAe,4CAmZjB,CAAC"}

package/dist/patterns/sub-sidebar/sub-sidebar.js

@@ -0,0 +1,285 @@
+import { jsxs as o, jsx as r, Fragment as S } from "react/jsx-runtime";
+import { useState as A, useEffect as z, Fragment as u } from "react";
+import { Minus as F, Plus as I } from "@untitledui/icons";
+import { CollapseLeft as D } from "../../primitives/custom-icon/icons/collapse-left.js";
+import { CollapseRight as H } from "../../primitives/custom-icon/icons/collapse-right.js";
+import { cx as n } from "../../utils/cn.js";
+import { ButtonUtility as K } from "../../primitives/button/button-utility.js";
+const T = ({
+  href: i,
+  className: c,
+  children: d
+}) => /* @__PURE__ */ r("a", { href: i, className: c, children: d }), $ = (i, c) => c, U = ({
+  config: i,
+  currentPath: c,
+  isCollapsed: d,
+  onCollapsedChange: k,
+  renderLink: x = T,
+  guard: h = $,
+  className: C
+}) => {
+  const [E, b] = A(/* @__PURE__ */ new Set()), y = (a) => c === a || c.startsWith(a + "/"), m = (a) => a.map((t) => t.href).filter((t) => !!t).filter(y).sort((t, l) => l.length - t.length)[0] ?? null, w = () => {
+    var e;
+    const a = !d;
+    k(a), (e = i.onToggleCollapse) == null || e.call(i, a);
+  };
+  z(() => {
+    const a = /* @__PURE__ */ new Set();
+    i.sections.forEach((e) => {
+      e.items.forEach((t) => {
+        var l;
+        if ((l = t.items) != null && l.length && m(t.items) !== null) {
+          const p = t.href || t.label;
+          a.add(p);
+        }
+      });
+    }), b((e) => {
+      const t = new Set(e);
+      return a.forEach((l) => t.add(l)), t;
+    });
+  }, [c, i.sections]);
+  const f = (a) => {
+    const e = a.href || a.label;
+    b((t) => {
+      const l = new Set(t);
+      return l.has(e) ? l.delete(e) : l.add(e), l;
+    });
+  }, v = (a) => {
+    var e;
+    return (e = a.items) != null && e.length && m(a.items) !== null ? !0 : a.href ? y(a.href) : !1;
+  }, j = (a, e) => m(e) === a;
+  return /* @__PURE__ */ o(
+    "div",
+    {
+      className: n(
+        "h-full flex-shrink-0 bg-white border-r border-[#EDEFF4] relative transition-all duration-300 ease-in-out",
+        d ? "w-0 border-r-0" : i.width || "w-[296px]",
+        C
+      ),
+      children: [
+        i.collapsible !== !1 && d && /* @__PURE__ */ r(
+          "button",
+          {
+            onClick: w,
+            className: "absolute -right-5 top-5 z-20 flex h-6 w-6 items-center justify-center transition-all duration-300 cursor-pointer",
+            "aria-label": "Expand sidebar",
+            children: /* @__PURE__ */ r(
+              H,
+              {
+                color: "var(--color-fg-quaternary)",
+                className: "h-4 w-4 text-gray-400 hover:text-gray-600"
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ o(
+          "div",
+          {
+            className: n(
+              "pl-4 h-full flex flex-col overflow-hidden transition-opacity duration-300",
+              d ? "opacity-0 pointer-events-none" : "opacity-100"
+            ),
+            inert: d,
+            children: [
+              i.title && /* @__PURE__ */ o("div", { className: "pt-6 pb-4 relative flex-shrink-0 flex items-center justify-between", children: [
+                /* @__PURE__ */ r("h2", { className: "pl-1.5 text-primary font-semibold text-md leading-7 whitespace-nowrap", children: i.title }),
+                i.collapsible !== !1 && /* @__PURE__ */ r(
+                  "button",
+                  {
+                    onClick: w,
+                    className: "flex h-5 w-5 items-center justify-center transition-all duration-300 hover:scale-110 cursor-pointer",
+                    "aria-label": "Collapse sidebar",
+                    children: /* @__PURE__ */ r(
+                      D,
+                      {
+                        color: "var(--color-fg-quaternary)",
+                        className: "h-4 w-4 text-gray-400 hover:text-gray-600"
+                      }
+                    )
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ r("nav", { className: "flex-1 pb-4 pr-2 overflow-y-auto overflow-x-hidden", children: i.sections.map((a) => /* @__PURE__ */ r(u, { children: h(
+                (a == null ? void 0 : a.permissions) || [],
+                /* @__PURE__ */ o("div", { className: n("mb-6"), children: [
+                  /* @__PURE__ */ r("div", { className: "py-0.5 px-2", children: /* @__PURE__ */ r("p", { className: "font-medium text-[10px] text-[var(--color-text-tertiary)] uppercase tracking-[1.3px] whitespace-nowrap", children: a.label }) }),
+                  /* @__PURE__ */ r("ul", { className: "space-y-1", children: a.items.map((e) => {
+                    const t = e.href || e.label, l = E.has(t), N = e.items && e.items.length > 0, p = v(e);
+                    return N ? /* @__PURE__ */ r(u, { children: h(
+                      e.permissions || [],
+                      /* @__PURE__ */ o(
+                        "li",
+                        {
+                          className: n(
+                            e.disabled && "opacity-30 cursor-not-allowed",
+                            "text-xs"
+                          ),
+                          children: [
+                            /* @__PURE__ */ o(
+                              "div",
+                              {
+                                className: n(
+                                  "flex items-center justify-between px-1 py-2 rounded-md transition-colors cursor-pointer",
+                                  p ? "bg-active text-primary font-medium" : "text-primary hover:bg-active",
+                                  e.disabled ? "cursor-not-allowed" : ""
+                                ),
+                                role: "button",
+                                tabIndex: e.disabled ? -1 : 0,
+                                "aria-expanded": l,
+                                "aria-disabled": e.disabled || void 0,
+                                onClick: (s) => {
+                                  s.stopPropagation(), !e.disabled && f(e);
+                                },
+                                onKeyDown: (s) => {
+                                  if (s.target === s.currentTarget && (s.key === "Enter" || s.key === " ")) {
+                                    if (s.stopPropagation(), e.disabled) return;
+                                    f(e);
+                                  }
+                                },
+                                children: [
+                                  /* @__PURE__ */ r("span", { className: "whitespace-nowrap text-primary font-medium", children: e.label }),
+                                  /* @__PURE__ */ r(
+                                    K,
+                                    {
+                                      onClick: (s) => {
+                                        s.stopPropagation(), !e.disabled && f(e);
+                                      },
+                                      className: n(
+                                        "rounded-md bg-secondary",
+                                        e.disabled ? "cursor-not-allowed" : ""
+                                      ),
+                                      size: "xs",
+                                      "aria-label": `${l ? "Collapse" : "Expand"} ${e.label}`,
+                                      icon: l ? /* @__PURE__ */ r(F, { size: 12 }) : /* @__PURE__ */ r(I, { size: 12 })
+                                    }
+                                  )
+                                ]
+                              }
+                            ),
+                            l && h(
+                              e.permissions || [],
+                              /* @__PURE__ */ o("ul", { className: "mt-0.5 ml-4 space-y-0.5 relative", children: [
+                                /* @__PURE__ */ r("div", { className: "absolute left-2 top-[15px] bottom-[15px] w-px bg-[var(--color-utility-gray-200)]" }),
+                                e.items.map((s) => {
+                                  const g = j(
+                                    s.href,
+                                    e.items
+                                  );
+                                  return /* @__PURE__ */ r(u, { children: h(
+                                    s.permissions || [],
+                                    /* @__PURE__ */ r("li", { className: "relative", children: x({
+                                      href: s.href,
+                                      className: n(
+                                        "flex items-center pl-6 pr-2 py-2 rounded-md transition-colors relative",
+                                        g ? "text-primary font-medium" : "text-primary hover:bg-active"
+                                      ),
+                                      children: /* @__PURE__ */ o(S, { children: [
+                                        /* @__PURE__ */ r(
+                                          "div",
+                                          {
+                                            className: n(
+                                              "absolute left-1.5 top-1/2 -translate-y-1/2 w-1.5 h-1.5 rounded-full z-10",
+                                              g ? "bg-[var(--color-fg-primary)]" : "bg-[var(--color-utility-gray-200)]"
+                                            )
+                                          }
+                                        ),
+                                        /* @__PURE__ */ r("span", { className: "whitespace-nowrap", children: s.label })
+                                      ] })
+                                    }) }),
+                                    null
+                                  ) }, s.href);
+                                })
+                              ] }),
+                              null
+                            )
+                          ]
+                        }
+                      ),
+                      null
+                    ) }, t) : /* @__PURE__ */ r(u, { children: h(
+                      e.permissions || [],
+                      /* @__PURE__ */ r(
+                        "li",
+                        {
+                          className: n(
+                            e.disabled && "opacity-30 cursor-not-allowed",
+                            "text-xs"
+                          ),
+                          children: e.href ? e.disabled ? /* @__PURE__ */ r(
+                            "span",
+                            {
+                              className: n(
+                                "flex items-center justify-between px-2 py-2 rounded-md transition-colors cursor-not-allowed",
+                                p ? "bg-active text-primary" : "text-primary"
+                              ),
+                              "aria-disabled": "true",
+                              children: /* @__PURE__ */ r("span", { className: "whitespace-nowrap font-medium", children: e.label })
+                            }
+                          ) : x({
+                            href: e.href,
+                            className: n(
+                              "flex items-center justify-between px-2 py-2 rounded-md transition-colors",
+                              p ? "bg-active text-primary" : "text-primary hover:bg-active",
+                              e.disabled ? "opacity-30 cursor-not-allowed" : ""
+                            ),
+                            children: /* @__PURE__ */ r("span", { className: "whitespace-nowrap font-medium", children: e.label })
+                          }) : /* @__PURE__ */ r(
+                            "div",
+                            {
+                              onClick: () => {
+                                var s;
+                                return !e.disabled && ((s = e.onClick) == null ? void 0 : s.call(e));
+                              },
+                              className: n(
+                                "w-full flex items-center justify-between px-2 py-2 rounded-md text-sm transition-colors cursor-pointer",
+                                p ? "bg-active text-primary font-medium" : "text-primary hover:bg-active",
+                                e.disabled ? "opacity-30 cursor-not-allowed" : ""
+                              ),
+                              children: /* @__PURE__ */ r("span", { className: "whitespace-nowrap", children: e.label })
+                            }
+                          )
+                        }
+                      ),
+                      e.showDisabled ? /* @__PURE__ */ r(
+                        "span",
+                        {
+                          className: n(
+                            "flex items-center justify-between opacity-30 px-2 py-2 rounded-md transition-colors cursor-not-allowed text-xs whitespace-nowrap font-medium",
+                            p ? "bg-active text-primary" : "text-primary"
+                          ),
+                          "aria-disabled": "true",
+                          children: e.label
+                        }
+                      ) : null
+                    ) }, t);
+                  }) })
+                ] }),
+                a.showDisabled ? /* @__PURE__ */ o("div", { className: n("mb-6"), children: [
+                  /* @__PURE__ */ r("div", { className: "py-0.5 px-2", children: /* @__PURE__ */ r("p", { className: "font-medium text-[10px] text-[var(--color-text-tertiary)] uppercase tracking-[1.3px] whitespace-nowrap", children: a.label }) }),
+                  /* @__PURE__ */ r("ul", { className: "", children: a.items.map((e) => {
+                    const t = e.href || e.label, l = v(e);
+                    return /* @__PURE__ */ r(
+                      "span",
+                      {
+                        className: n(
+                          "flex items-center justify-between opacity-30 px-2 py-2 rounded-md transition-colors cursor-not-allowed text-xs whitespace-nowrap font-medium",
+                          l ? "bg-active text-primary" : "text-primary"
+                        ),
+                        "aria-disabled": "true",
+                        children: e.label
+                      },
+                      t
+                    );
+                  }) })
+                ] }) : null
+              ) }, a.id)) })
+            ]
+          }
+        )
+      ]
+    }
+  );
+};
+export {
+  U as SubSidebar
+};