"use client";
import { jsx as n, jsxs as W, Fragment as De } from "react/jsx-runtime";
import _, { forwardRef as x, useState as P, useCallback as w, useMemo as Z, createContext as G, useRef as D, useEffect as U, useContext as L, useId as Le } from "react";
import { CaretRightIcon as Be } from "@phosphor-icons/react";
import { u as ee } from "./link-provider-mn2voeohon7cj9o4.js";
import { a as ze, T as Oe } from "./tooltip-mooldq78tg77ekvv.js";
import { c as s } from "./vendor-styling-ofvnbcuht98q88oo.js";
import { bC as Fe, bD as Pe, bE as Ve, bF as We, bG as He } from "./vendor-base-ui-elpbzr8xeffrz4h2.js";
const st = {
  variant: {
    sidebar: {
      classes: "",
      description: "Standard sidebar with border separator"
    },
    floating: {
      classes: "",
      description: "Floating sidebar with shadow and rounded corners"
    },
    inset: {
      classes: "",
      description: "Inset sidebar within the content area"
    }
  },
  collapsible: {
    icon: {
      classes: "",
      description: "Collapses to show icons only"
    },
    offcanvas: {
      classes: "",
      description: "Slides off screen when collapsed"
    },
    none: {
      classes: "",
      description: "Cannot be collapsed"
    }
  },
  side: {
    left: {
      classes: "",
      description: "Left-aligned sidebar"
    },
    right: {
      classes: "",
      description: "Right-aligned sidebar"
    }
  }
}, J = {
  variant: "sidebar",
  collapsible: "icon",
  side: "left"
}, ot = {
  width: {
    expanded: "16.25rem",
    icon: "57px"
  },
  mobile: {
    breakpoint: 768
  }
}, Ke = "16.25rem", Xe = "57px", Ge = "cubic-bezier(0.77, 0, 0.175, 1)", Ue = 250, $e = 768, qe = 'a[href], button:not([disabled]), input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"])';
function je(t = $e) {
  const [a, e] = P(() => typeof window > "u" ? !1 : window.matchMedia(`(max-width: ${t - 1}px)`).matches);
  return U(() => {
    const i = window.matchMedia(`(max-width: ${t - 1}px)`), o = () => e(i.matches);
    return i.addEventListener("change", o), e(i.matches), () => i.removeEventListener("change", o);
  }, [t]), a;
}
const te = G(null);
function V() {
  const t = L(te);
  if (!t)
    throw new Error("useSidebar must be used within a Sidebar.Provider");
  return t;
}
const Ye = 256, Je = 200, Qe = 480;
function ae({
  defaultOpen: t = !0,
  open: a,
  onOpenChange: e,
  variant: i = J.variant,
  side: o = J.side,
  collapsible: h = J.collapsible,
  resizable: l = !1,
  defaultWidth: u = Ye,
  minWidth: c = Je,
  maxWidth: d = Qe,
  onWidthChange: r,
  contained: p = !1,
  peekable: f = !1,
  animationDuration: g = Ue,
  mobileBreakpoint: S,
  children: k,
  className: M,
  style: v
}) {
  const b = je(S), [y, T] = P(!1), [C, E] = P(u), [I, R] = P(!1), [B, N] = P(!1), z = b && a !== void 0 ? a : y, H = w(
    (A) => {
      T(A), b && a !== void 0 && e?.(A);
    },
    [b, a, e]
  ), Q = w(
    (A) => {
      const K = Math.min(d, Math.max(c, A));
      E(K), r?.(K);
    },
    [c, d, r]
  ), [$, q] = P(t), m = a ?? $, O = w(
    (A) => {
      const K = typeof A == "function" ? A(m) : A;
      e?.(K), q(K);
    },
    [e, m]
  ), j = w(() => {
    b ? H(!z) : (N(!1), O((A) => !A));
  }, [b, z, H, O]), F = w(() => {
    f && !m && !b && N(!0);
  }, [f, m, b]), Ee = w(() => {
    N(!1);
  }, []), Y = B ? "peeking" : m ? "expanded" : "collapsed", _e = l ? `${C}px` : Ke, Te = Z(
    () => ({
      state: Y,
      open: m,
      setOpen: O,
      openMobile: z,
      setOpenMobile: H,
      isMobile: b,
      toggleSidebar: j,
      variant: i,
      side: o,
      collapsible: h,
      width: C,
      resizable: l,
      minWidth: c,
      maxWidth: d,
      isResizing: I,
      setIsResizing: R,
      setWidth: Q,
      isPeeking: B,
      peekable: f,
      startPeek: F,
      stopPeek: Ee,
      contained: p,
      animationDuration: g
    }),
    [Y, m, z, b, C, I, B]
  );
  return /* @__PURE__ */ n(te.Provider, { value: Te, children: /* @__PURE__ */ n(
    "div",
    {
      "data-sidebar-wrapper": "",
      "data-state": Y,
      "data-side": o,
      style: {
        "--sidebar-width": _e,
        "--sidebar-width-icon": Xe,
        "--sidebar-animation-duration": `${g}ms`,
        "--sidebar-easing": Ge,
        ...v
      },
      className: s(
        "group/sidebar-wrapper relative isolate flex w-full [--sidebar-bg:var(--color-kumo-base)] [--sidebar-active-bg:var(--color-kumo-tint)]",
        !p && !b && "min-h-svh",
        "has-data-[variant=inset]:bg-kumo-recessed",
        I && "select-none",
        M
      ),
      children: k
    }
  ) });
}
ae.displayName = "Sidebar.Provider";
const ie = x(
  ({ className: t, contentClassName: a, children: e, ...i }, o) => {
    const {
      state: h,
      open: l,
      isMobile: u,
      openMobile: c,
      setOpenMobile: d,
      side: r,
      variant: p,
      collapsible: f,
      isResizing: g,
      resizable: S,
      width: k,
      isPeeking: M,
      startPeek: v,
      stopPeek: b,
      contained: y
    } = V(), T = w(
      (m) => {
        m && (c ? m.removeAttribute("inert") : m.setAttribute("inert", ""));
      },
      [c]
    ), C = w(
      (m) => {
        T(m), typeof o == "function" ? o(m) : o && (o.current = m);
      },
      [o, T]
    ), E = D(null), I = D(null), R = D(!1);
    U(() => {
      if (!u || !c) return;
      const m = (O) => {
        O.key === "Escape" && (R.current = !0, d(!1));
      };
      return document.addEventListener("keydown", m), () => {
        document.removeEventListener("keydown", m);
      };
    }, [u, c, d]), U(() => {
      u && (c ? (E.current = document.activeElement, R.current = !1, requestAnimationFrame(() => {
        (I.current?.querySelector(
          qe
        ) ?? I.current)?.focus();
      })) : R.current && E.current instanceof HTMLElement && (E.current.focus(), R.current = !1, E.current = null));
    }, [u, c]);
    const B = w(
      (m) => {
        m.currentTarget.contains(m.relatedTarget) || b();
      },
      [b]
    );
    if (f === "none")
      return /* @__PURE__ */ n(
        "aside",
        {
          ref: o,
          "data-state": "expanded",
          "data-side": r,
          "data-variant": p,
          "data-sidebar": "sidebar",
          style: {
            width: "var(--sidebar-width)",
            minWidth: "var(--sidebar-width)",
            maxWidth: "var(--sidebar-width)"
          },
          className: s(
            "relative flex h-full shrink-0 grow-0 flex-col overflow-hidden bg-(--sidebar-bg) text-kumo-default",
            p === "sidebar" && (r === "left" ? "border-r border-kumo-line" : "border-l border-kumo-line"),
            p === "floating" && "m-2 rounded-lg border border-kumo-line shadow-lg",
            t
          ),
          ...i,
          children: e
        }
      );
    if (u)
      return /* @__PURE__ */ W(De, { children: [
        /* @__PURE__ */ n(
          "div",
          {
            "data-sidebar-backdrop": "",
            className: s(
              y ? "absolute inset-0 z-40 bg-kumo-recessed" : "fixed inset-0 z-40 bg-kumo-recessed",
              "transition-opacity duration-(--sidebar-animation-duration) ease-(--sidebar-easing)",
              "motion-reduce:transition-none",
              c ? "opacity-80" : "opacity-0 pointer-events-none"
            ),
            onClick: () => {
              R.current = !0, d(!1);
            },
            "aria-hidden": "true"
          }
        ),
        /* @__PURE__ */ n(
          "nav",
          {
            ref: (m) => {
              C(m), I.current = m;
            },
            tabIndex: -1,
            "aria-label": "Navigation",
            "aria-hidden": !c,
            "data-state": c ? "expanded" : "collapsed",
            "data-side": r,
            "data-variant": p,
            "data-collapsible": f,
            "data-sidebar": "sidebar",
            "data-mobile": "true",
            className: s(
              y ? "group/sidebar absolute inset-y-0 z-50 flex w-(--sidebar-width) flex-col overflow-hidden" : "group/sidebar fixed inset-y-0 z-50 flex w-(--sidebar-width) flex-col overflow-hidden",
              "border-r border-kumo-line bg-(--sidebar-bg) text-kumo-default",
              "transition-transform duration-(--sidebar-animation-duration) ease-(--sidebar-easing)",
              "motion-reduce:transition-none",
              r === "left" && "left-0",
              r === "right" && "right-0",
              r === "left" && (c ? "translate-x-0" : "-translate-x-full"),
              r === "right" && (c ? "translate-x-0" : "translate-x-full"),
              t
            ),
            ...i,
            children: e
          }
        )
      ] });
    const N = f === "icon" ? "var(--sidebar-width-icon)" : "0px", z = S ? `${k}px` : "var(--sidebar-width)", H = l ? z : N, $ = l || M ? z : N, q = p === "sidebar" ? r === "left" ? "border-r border-kumo-line" : "border-l border-kumo-line" : p === "floating" ? "border border-kumo-line" : "";
    return /* @__PURE__ */ n(
      "aside",
      {
        ref: o,
        "data-state": h,
        "data-side": r,
        "data-variant": p,
        "data-collapsible": f,
        "data-sidebar": "sidebar",
        style: { width: H },
        className: s(
          "group/sidebar relative h-full shrink-0 grow-0",
          "overflow-visible",
          // allow content container to overlay when peeking
          "transition-[width] duration-(--sidebar-animation-duration) ease-(--sidebar-easing)",
          "motion-reduce:transition-none",
          g && "transition-none!",
          p === "floating" && "m-2 rounded-lg shadow-lg",
          t
        ),
        ...i,
        children: /* @__PURE__ */ n(ze, { children: (() => {
          const m = _.Children.toArray(e), O = m.filter(
            (F) => _.isValidElement(F) && F.type?.displayName === "Sidebar.Footer"
          ), j = m.filter(
            (F) => !_.isValidElement(F) || F.type?.displayName !== "Sidebar.Footer"
          );
          return /* @__PURE__ */ W(
            "div",
            {
              "data-sidebar": "content-container",
              style: { width: $ },
              className: s(
                "flex h-full flex-col",
                "min-w-0 overflow-hidden whitespace-nowrap",
                "bg-(--sidebar-bg) text-kumo-default",
                q,
                "transition-[width] duration-(--sidebar-animation-duration) ease-(--sidebar-easing)",
                "motion-reduce:transition-none",
                g && "transition-none!",
                !l && s(
                  y ? "absolute" : "fixed",
                  "inset-y-0 z-40",
                  r === "left" && "left-0",
                  r === "right" && "right-0"
                ),
                l && "relative",
                a
              ),
              children: [
                /* @__PURE__ */ n(
                  "div",
                  {
                    "data-sidebar": "peek-zone",
                    className: "flex flex-1 flex-col min-h-0",
                    onMouseEnter: v,
                    onMouseLeave: b,
                    onFocus: v,
                    onBlur: B,
                    children: j
                  }
                ),
                O
              ]
            }
          );
        })() })
      }
    );
  }
);
ie.displayName = "Sidebar";
const ne = x(({ className: t, ...a }, e) => /* @__PURE__ */ n(
  "div",
  {
    ref: e,
    "data-sidebar": "header",
    className: s(
      "flex h-[58px] shrink-0 items-center gap-1 border-b border-kumo-line",
      "px-3 overflow-hidden",
      t
    ),
    ...a
  }
));
ne.displayName = "Sidebar.Header";
const re = x(({ className: t, children: a, ...e }, i) => /* @__PURE__ */ W(
  Fe,
  {
    ref: i,
    "data-sidebar": "content",
    className: s("relative min-w-0 flex-1 overflow-hidden", t),
    ...e,
    children: [
      /* @__PURE__ */ n(
        Pe,
        {
          tabIndex: -1,
          className: s(
            "h-full px-[11px] py-3 group-not-data-[state=collapsed]/sidebar:px-3.5",
            "transition-[padding] duration-(--sidebar-animation-duration)",
            "overflow-x-hidden!",
            // Scroll fade via CSS mask driven by Base UI overflow CSS variables
            "[mask-image:linear-gradient(to_bottom,transparent_0,black_min(24px,var(--scroll-area-overflow-y-start,24px)),black_calc(100%-min(24px,var(--scroll-area-overflow-y-end,24px))),transparent_100%)]"
          ),
          children: /* @__PURE__ */ n(Ve, { className: "flex min-w-0! flex-col", children: a })
        }
      ),
      /* @__PURE__ */ n(
        We,
        {
          orientation: "vertical",
          className: s(
            "flex w-1.5 touch-none select-none p-px",
            "opacity-0 transition-opacity duration-150",
            "data-[scrolling]:opacity-100 data-[hovering]:opacity-100"
          ),
          children: /* @__PURE__ */ n(He, { className: "flex-1 rounded-full bg-kumo-line" })
        }
      )
    ]
  }
));
re.displayName = "Sidebar.Content";
const se = x(({ className: t, ...a }, e) => /* @__PURE__ */ n(
  "div",
  {
    ref: e,
    "data-sidebar": "footer",
    className: s(
      "flex h-12 shrink-0 items-center gap-4 overflow-hidden whitespace-nowrap border-t border-kumo-line",
      "px-[11px] group-not-data-[state=collapsed]/sidebar:px-4",
      "bg-(--sidebar-bg)",
      "w-(--sidebar-width)",
      "transition-[width,padding] duration-(--sidebar-animation-duration) ease-(--sidebar-easing)",
      "motion-reduce:transition-none",
      "sticky bottom-0",
      "group-data-[state=collapsed]/sidebar:w-(--sidebar-width-icon) bg-clip-padding",
      "group-data-[state=collapsed]/sidebar:border-r group-data-[state=collapsed]/sidebar:border-kumo-line",
      t
    ),
    ...a
  }
));
se.displayName = "Sidebar.Footer";
const oe = x(({ className: t, children: a, ...e }, i) => /* @__PURE__ */ n(
  "div",
  {
    ref: i,
    "data-sidebar": "group",
    className: s("flex min-w-0 flex-col gap-y-px", t),
    ...e,
    children: a
  }
));
oe.displayName = "Sidebar.Group";
const de = x(({ className: t, children: a, ...e }, i) => /* @__PURE__ */ n(
  "div",
  {
    ref: i,
    "data-sidebar": "group-label",
    className: s(
      // Grid-rows for smooth collapse animation
      "grid overflow-hidden",
      "transition-[grid-template-rows,margin,border-color] duration-(--sidebar-animation-duration) ease-(--sidebar-easing)",
      // Mobile: no collapse animation — sidebar is always expanded
      "group-data-[mobile=true]/sidebar:transition-none",
      // Collapsed: spacer with divider line between icon groups
      "grid-rows-[0fr] my-3 border-b border-kumo-line",
      // First group: no spacer or divider needed
      "[[data-sidebar=group]:first-child_&]:my-0 [[data-sidebar=group]:first-child_&]:border-transparent",
      // Expanded: reveal the label text
      "group-not-data-[state=collapsed]/sidebar:grid-rows-[1fr] group-not-data-[state=collapsed]/sidebar:my-0 group-not-data-[state=collapsed]/sidebar:border-transparent",
      // Mobile: always show labels (sidebar content is always expanded on mobile)
      "group-data-[mobile=true]/sidebar:grid-rows-[1fr] group-data-[mobile=true]/sidebar:my-0 group-data-[mobile=true]/sidebar:border-transparent",
      t
    ),
    ...e,
    children: /* @__PURE__ */ n("div", { className: "min-h-0 min-w-0", children: /* @__PURE__ */ n(
      "div",
      {
        className: s(
          "truncate px-3 mt-4 mb-2 text-sm font-medium text-kumo-subtle",
          // First group: less top margin
          "[[data-sidebar=group]:first-child_&]:mt-2"
        ),
        children: a
      }
    ) })
  }
));
de.displayName = "Sidebar.GroupLabel";
const le = G(!1), ce = G(!1), ue = x(({ className: t, ...a }, e) => /* @__PURE__ */ n(
  "ul",
  {
    ref: e,
    "data-sidebar": "menu",
    className: s(
      "m-0 flex min-w-0 list-none flex-col items-stretch gap-y-px p-0",
      t
    ),
    ...a
  }
));
ue.displayName = "Sidebar.Menu";
const be = x(({ className: t, children: a, ...e }, i) => /* @__PURE__ */ n(le.Provider, { value: !0, children: /* @__PURE__ */ n(
  "li",
  {
    ref: i,
    "data-sidebar": "menu-item",
    className: s(
      "relative group-data-[state=collapsed]/sidebar:overflow-hidden",
      t
    ),
    ...e,
    children: a
  }
) }));
be.displayName = "Sidebar.MenuItem";
const me = x(
  ({
    className: t,
    icon: a,
    active: e = !1,
    size: i = "base",
    href: o,
    target: h,
    tooltip: l,
    children: u,
    ...c
  }, d) => {
    const { state: r, peekable: p } = V(), f = ee(), g = L(le), S = a ? _.isValidElement(a) ? a : /* @__PURE__ */ n(
      a,
      {
        className: s(
          "shrink-0 opacity-40",
          i === "base" ? "size-4" : "size-3.5"
        )
      }
    ) : null, k = /* @__PURE__ */ W(
      "div",
      {
        className: s(
          "flex flex-1 items-center min-w-0 gap-3",
          "translate-x-[-3px] group-not-data-[state=collapsed]/sidebar:translate-x-0",
          "transition-transform duration-(--sidebar-animation-duration)"
        ),
        children: [
          S,
          /* @__PURE__ */ n(
            "span",
            {
              className: s(
                "flex flex-1 items-center gap-2 min-w-0 text-left overflow-hidden"
              ),
              children: _.Children.map(
                u,
                (y) => typeof y == "string" || typeof y == "number" ? /* @__PURE__ */ n("span", { className: "truncate", children: y }) : y
              )
            }
          )
        ]
      }
    ), M = s(
      // Layout
      "group/menu-button relative flex w-full min-w-0 items-center gap-2.5 rounded-lg outline-none cursor-pointer",
      "before:absolute before:inset-x-0 before:-inset-y-px",
      // Sizing
      i === "base" && "min-h-8.5 px-3 py-0 text-sm font-medium",
      i === "sm" && "min-h-7 px-2 py-0 text-sm",
      "text-kumo-default",
      "transition-[color,box-shadow,outline] duration-(--sidebar-animation-duration)",
      !e && "hover:bg-(--sidebar-active-bg)",
      // Active state
      e && "bg-(--sidebar-active-bg)",
      // When a child sub-button is active, don't show active styling on the parent trigger
      "has-[[data-active]]:bg-transparent has-[[data-active]]:hover:bg-(--sidebar-active-bg)",
      // Focus
      "focus:outline-none focus-visible:text-kumo-strong focus-visible:bg-(--sidebar-active-bg)",
      t
    );
    let v;
    return o ? v = /* @__PURE__ */ n(
      f,
      {
        ref: d,
        className: s(M, "no-underline!"),
        href: o,
        to: o,
        target: h,
        "data-active": e || void 0,
        "data-sidebar": "menu-button",
        "data-kumo-component": "Sidebar",
        "data-kumo-part": "menu-button-link",
        "data-size": i,
        onClick: c.onClick,
        children: k
      }
    ) : v = /* @__PURE__ */ n(
      "button",
      {
        ref: d,
        type: "button",
        className: M,
        "data-active": e || void 0,
        "data-sidebar": "menu-button",
        "data-kumo-component": "Sidebar",
        "data-kumo-part": "menu-button",
        "data-size": i,
        ...c,
        children: k
      }
    ), l && (v = /* @__PURE__ */ n(
      Oe,
      {
        content: l,
        disabled: !(r === "collapsed" && !p),
        side: "right",
        render: v
      }
    )), g ? v : /* @__PURE__ */ n(
      "li",
      {
        "data-sidebar": "menu-item",
        className: "relative group-data-[state=collapsed]/sidebar:overflow-hidden",
        children: v
      }
    );
  }
);
me.displayName = "Sidebar.MenuButton";
const pe = x(({ className: t, ...a }, e) => /* @__PURE__ */ n(
  "span",
  {
    ref: e,
    "data-sidebar": "menu-badge",
    className: s(
      "inline-flex shrink-0 items-center rounded-full border border-dashed border-kumo-line",
      "select-none px-1.5 py-0.5 text-[11px]/none font-medium text-kumo-strong",
      // Hidden when collapsed
      "group-data-[state=collapsed]/sidebar:hidden",
      t
    ),
    ...a
  }
));
pe.displayName = "Sidebar.MenuBadge";
const fe = x(({ className: t, children: a, ...e }, i) => /* @__PURE__ */ W(
  "ul",
  {
    ref: i,
    "data-sidebar": "menu-sub",
    className: s(
      "relative m-0 flex min-w-0 list-none flex-col gap-y-px p-0 pl-7 pr-0 overflow-hidden",
      t
    ),
    ...e,
    children: [
      /* @__PURE__ */ n("div", { className: "absolute left-[19px] inset-y-px w-px bg-kumo-line z-10" }),
      a
    ]
  }
));
fe.displayName = "Sidebar.MenuSub";
const ge = x(({ className: t, children: a, ...e }, i) => /* @__PURE__ */ n(ce.Provider, { value: !0, children: /* @__PURE__ */ n(
  "li",
  {
    ref: i,
    "data-sidebar": "menu-sub-item",
    className: s("relative", t),
    ...e,
    children: a
  }
) }));
ge.displayName = "Sidebar.MenuSubItem";
const he = x(({ className: t, active: a = !1, href: e, target: i, children: o, ...h }, l) => {
  const u = ee(), c = L(ce), d = s(
    "group/menu-button relative flex w-full min-w-0 items-center gap-2 rounded-lg min-h-8.5 px-3 py-0 text-sm font-medium outline-none cursor-pointer",
    "before:absolute before:inset-x-0 before:-inset-y-px",
    "text-kumo-default transition-[color] duration-150",
    !a && "hover:bg-(--sidebar-active-bg)",
    a && "bg-(--sidebar-active-bg)",
    "focus:outline-none focus-visible:text-kumo-strong focus-visible:bg-(--sidebar-active-bg)",
    t
  ), r = /* @__PURE__ */ n("span", { className: "flex flex-1 items-center gap-2 min-w-0 text-left overflow-hidden", children: _.Children.map(
    o,
    (f) => typeof f == "string" || typeof f == "number" ? /* @__PURE__ */ n("span", { className: "truncate", children: f }) : f
  ) });
  let p;
  return e ? p = /* @__PURE__ */ n(
    u,
    {
      ref: l,
      className: s(d, "no-underline!"),
      href: e,
      to: e,
      target: i,
      "data-active": a || void 0,
      "data-sidebar": "menu-sub-button",
      "data-kumo-component": "Sidebar",
      "data-kumo-part": "menu-sub-button-link",
      onClick: h.onClick,
      children: r
    }
  ) : p = /* @__PURE__ */ n(
    "button",
    {
      ref: l,
      type: "button",
      className: d,
      "data-active": a || void 0,
      "data-sidebar": "menu-sub-button",
      "data-kumo-component": "Sidebar",
      "data-kumo-part": "menu-sub-button",
      ...h,
      children: r
    }
  ), c ? p : /* @__PURE__ */ n("li", { "data-sidebar": "menu-sub-item", className: "relative", children: p });
});
he.displayName = "Sidebar.MenuSubButton";
const ve = x(({ className: t, ...a }, e) => /* @__PURE__ */ n(
  "div",
  {
    ref: e,
    "data-sidebar": "separator",
    className: s("my-3 px-2", t),
    ...a,
    children: /* @__PURE__ */ n("div", { className: "border-b border-kumo-line" })
  }
));
ve.displayName = "Sidebar.Separator";
function xe({ className: t }) {
  const { open: a } = V();
  return /* @__PURE__ */ W(
    "svg",
    {
      width: "18",
      height: "18",
      viewBox: "0 0 24 24",
      fill: "none",
      "aria-hidden": "true",
      focusable: "false",
      stroke: "currentColor",
      strokeWidth: "1.5",
      strokeLinecap: "round",
      className: s("shrink-0", t),
      children: [
        /* @__PURE__ */ n("path", { d: "M21.25 6.72v10.56a2.97 2.97 0 0 1-2.97 2.97H5.72a2.97 2.97 0 0 1-2.97-2.97V6.72a2.97 2.97 0 0 1 2.97-2.97h12.56a2.97 2.97 0 0 1 2.97 2.97" }),
        /* @__PURE__ */ n(
          "path",
          {
            d: "M6.25 7.25v9.5",
            className: s(
              "transition-transform duration-(--sidebar-animation-duration) ease-(--sidebar-easing)",
              a ? "translate-x-px" : "translate-x-[10.5px]"
            )
          }
        )
      ]
    }
  );
}
xe.displayName = "Sidebar.PanelIcon";
const we = x(({ className: t, children: a, onClick: e, ...i }, o) => {
  const { open: h, toggleSidebar: l } = V();
  return /* @__PURE__ */ n(
    "button",
    {
      ref: o,
      type: "button",
      "data-sidebar": "trigger",
      "data-kumo-component": "Sidebar",
      "data-kumo-part": "trigger",
      "aria-expanded": h,
      "aria-label": h ? "Collapse sidebar" : "Expand sidebar",
      className: s(
        "flex shrink-0 size-8.5 justify-center items-center rounded-lg cursor-pointer",
        "text-kumo-subtle hover:text-kumo-default hover:bg-(--sidebar-active-bg)",
        "focus:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-kumo-brand",
        t
      ),
      onClick: (u) => {
        e?.(u), l();
      },
      ...i,
      children: a ?? /* @__PURE__ */ n(xe, {})
    }
  );
});
we.displayName = "Sidebar.Trigger";
const Se = x(({ className: t, ...a }, e) => {
  const { toggleSidebar: i } = V();
  return /* @__PURE__ */ n(
    "button",
    {
      ref: e,
      type: "button",
      "data-sidebar": "rail",
      "data-kumo-component": "Sidebar",
      "data-kumo-part": "rail",
      "aria-label": "Toggle sidebar",
      tabIndex: -1,
      className: s(
        "absolute inset-y-0 z-1 hidden w-4 -translate-x-1/2 cursor-pointer transition-all",
        "after:absolute after:inset-y-0 after:left-1/2 after:w-0.5",
        "hover:after:bg-kumo-brand/20",
        "group-data-[side=left]/sidebar-wrapper:right-0",
        "group-data-[side=right]/sidebar-wrapper:left-0",
        "sm:flex",
        t
      ),
      onClick: i,
      ...a
    }
  );
});
Se.displayName = "Sidebar.Rail";
const ye = x(({ className: t, ...a }, e) => {
  const {
    side: i,
    resizable: o,
    setIsResizing: h,
    setWidth: l,
    setOpen: u,
    open: c,
    minWidth: d,
    width: r,
    maxWidth: p
  } = V(), f = D(0), g = D(0), S = D(!1);
  if (!o) return null;
  const k = 10, M = (b) => {
    b.preventDefault(), h(!0), f.current = b.clientX, S.current = !c;
    const T = b.currentTarget.closest(
      "[data-sidebar-wrapper]"
    )?.querySelector("[data-sidebar='sidebar']");
    g.current = T?.getBoundingClientRect().width ?? 0;
    const C = () => {
      h(!1), document.removeEventListener("pointermove", E), document.removeEventListener("pointerup", I);
    }, E = (R) => {
      const B = i === "left" ? R.clientX - f.current : f.current - R.clientX, N = g.current + B;
      if (S.current) {
        N >= d && (S.current = !1, u(!0), l(N));
        return;
      }
      if (N < d) {
        u(!1), S.current = !0;
        return;
      }
      l(N);
    }, I = () => {
      C();
    };
    document.addEventListener("pointermove", E), document.addEventListener("pointerup", I);
  }, v = (b) => {
    const y = i === "left" ? "ArrowRight" : "ArrowLeft", T = i === "left" ? "ArrowLeft" : "ArrowRight";
    if (b.key === y)
      b.preventDefault(), c ? l(Math.min(r + k, p)) : (u(!0), l(d));
    else if (b.key === T) {
      b.preventDefault();
      const C = r - k;
      C < d ? u(!1) : l(C);
    } else b.key === "Home" ? (b.preventDefault(), u(!1)) : b.key === "End" && (b.preventDefault(), u(!0), l(p));
  };
  return /* @__PURE__ */ n(
    "button",
    {
      ref: e,
      type: "button",
      "aria-label": "Resize sidebar",
      tabIndex: 0,
      "data-sidebar": "resize-handle",
      className: s(
        // Hit area inside the sidebar edge; thin visual line pinned to the edge via ::after
        "absolute inset-y-0 z-2 hidden w-3 cursor-col-resize sm:block",
        "after:absolute after:inset-y-0 after:w-0.5",
        "after:bg-transparent after:transition-colors",
        "hover:after:bg-kumo-hairline active:after:bg-kumo-hairline focus-visible:after:bg-kumo-hairline",
        "focus:outline-none",
        i === "left" && "right-0 after:right-0",
        i === "right" && "left-0 after:left-0",
        t
      ),
      onPointerDown: M,
      onKeyDown: v,
      ...a
    }
  );
});
ye.displayName = "Sidebar.ResizeHandle";
const X = G({
  contentId: "",
  isOpen: !0,
  isCollapsible: !1,
  autoScrollOnOpen: !1,
  toggle: () => {
  }
}), ke = x(
  ({
    defaultOpen: t = !1,
    open: a,
    onOpenChange: e,
    autoScrollOnOpen: i = !1,
    className: o,
    children: h,
    ...l
  }, u) => {
    const [c, d] = P(t), r = a ?? c, p = Le(), f = D(!1), g = w(() => {
      const v = !r;
      d(v), e?.(v), f.current = !1;
    }, [r, e]), S = Z(
      () => ({
        contentId: p,
        isOpen: r,
        isCollapsible: !0,
        autoScrollOnOpen: i,
        toggle: g
      }),
      [p, r, i, g]
    ), k = w(
      (v) => {
        !r && v.target.matches(":focus-visible") && (f.current = !0, d(!0), e?.(!0));
      },
      [r, e]
    ), M = w(
      (v) => {
        f.current && !v.currentTarget.contains(v.relatedTarget) && !v.currentTarget.querySelector("[data-active]") && (f.current = !1, d(!1), e?.(!1));
      },
      [e]
    );
    return /* @__PURE__ */ n(X.Provider, { value: S, children: /* @__PURE__ */ n(
      "div",
      {
        ref: u,
        "data-open": r || void 0,
        className: s("min-w-0", o),
        onFocus: k,
        onBlur: M,
        ...l,
        children: h
      }
    ) });
  }
);
ke.displayName = "Sidebar.Collapsible";
function Ne({ render: t }) {
  const { contentId: a, isOpen: e, toggle: i } = L(X);
  return _.cloneElement(t, {
    "aria-expanded": e,
    "aria-controls": a,
    "data-open": e || void 0,
    onClick: (o) => {
      const h = t.props.onClick;
      h?.(o), i();
    }
  });
}
Ne.displayName = "Sidebar.CollapsibleTrigger";
const Me = x(({ className: t, children: a, ...e }, i) => {
  const { contentId: o, isOpen: h } = L(
    X
  ), { state: l, animationDuration: u } = V(), { autoScrollOnOpen: c } = L(X), d = D(null), r = h && l !== "collapsed";
  U(() => {
    if (!r || !c) return;
    const g = window.setTimeout(() => {
      const S = window.matchMedia(
        "(prefers-reduced-motion: reduce)"
      ).matches;
      d.current?.scrollIntoView({
        block: "nearest",
        behavior: S ? "auto" : "smooth"
      });
    }, u);
    return () => window.clearTimeout(g);
  }, [r, c, u]);
  const p = w(
    (g) => {
      g && (r ? g.removeAttribute("inert") : g.setAttribute("inert", ""));
    },
    [r]
  ), f = w(
    (g) => {
      d.current = g, p(g), typeof i == "function" ? i(g) : i && (i.current = g);
    },
    [i, p]
  );
  return /* @__PURE__ */ n(
    "div",
    {
      ref: f,
      id: o,
      role: "region",
      "aria-hidden": !r,
      className: s(
        "grid",
        "transition-[grid-template-rows] duration-(--sidebar-animation-duration) ease-(--sidebar-easing)",
        "motion-reduce:transition-none",
        r ? "grid-rows-[1fr]" : "grid-rows-[0fr]",
        t
      ),
      ...e,
      children: /* @__PURE__ */ n("div", { className: "overflow-hidden", children: a })
    }
  );
});
Me.displayName = "Sidebar.CollapsibleContent";
function Ce({ className: t }) {
  const { isOpen: a, isCollapsible: e } = L(X);
  return /* @__PURE__ */ n(
    Be,
    {
      size: 12,
      weight: "bold",
      className: s(
        "ml-auto shrink-0 opacity-40 group-hover/menu-button:opacity-100 transition-[transform,rotate,opacity] duration-200",
        e && a && "rotate-90",
        // Hidden when sidebar is collapsed
        "group-data-[state=collapsed]/sidebar:hidden",
        t
      )
    }
  );
}
Ce.displayName = "Sidebar.MenuChevron";
const Ie = G(""), Re = x(
  ({
    activeKey: t,
    direction: a = "left",
    className: e,
    children: i,
    ...o
  }, h) => {
    const u = _.Children.toArray(i).findIndex(
      (r) => _.isValidElement(r) && r.props.value === t
    ), c = typeof window < "u" && window.matchMedia("(prefers-reduced-motion: reduce)").matches, d = u > 0 ? `-${u * 100}%` : "0%";
    return /* @__PURE__ */ n(Ie.Provider, { value: t, children: /* @__PURE__ */ n(
      "div",
      {
        ref: h,
        "data-sidebar": "sliding-views",
        className: s(
          "flex flex-1 min-h-0 max-w-(--sidebar-width) overflow-hidden",
          e
        ),
        ...o,
        children: /* @__PURE__ */ n(
          "div",
          {
            className: "flex min-h-0 w-full shrink-0",
            style: {
              transform: `translateX(${d})`,
              transition: c ? "none" : "transform var(--sidebar-animation-duration) var(--sidebar-easing)"
            },
            children: i
          }
        )
      }
    ) });
  }
);
Re.displayName = "Sidebar.SlidingViews";
const Ae = x(
  ({ value: t, className: a, children: e, ...i }, o) => {
    const l = L(Ie) === t, u = w(
      (d) => {
        d && (l ? d.removeAttribute("inert") : d.setAttribute("inert", ""));
      },
      [l]
    ), c = w(
      (d) => {
        u(d), typeof o == "function" ? o(d) : o && (o.current = d);
      },
      [o, u]
    );
    return /* @__PURE__ */ n(
      "div",
      {
        ref: c,
        "data-sidebar": "sliding-view",
        "data-value": t,
        "aria-hidden": !l,
        className: s(
          "flex w-full shrink-0 flex-col min-h-0",
          !l && "pointer-events-none",
          a
        ),
        ...i,
        children: e
      }
    );
  }
);
Ae.displayName = "Sidebar.SlidingView";
const dt = Object.assign(ie, {
  Provider: ae,
  Header: ne,
  Content: re,
  Footer: se,
  Group: oe,
  GroupLabel: de,
  Menu: ue,
  MenuItem: be,
  MenuButton: me,
  MenuBadge: pe,
  MenuSub: fe,
  MenuSubItem: ge,
  MenuSubButton: he,
  Separator: ve,
  Trigger: we,
  Rail: Se,
  ResizeHandle: ye,
  MenuChevron: Ce,
  Collapsible: ke,
  CollapsibleTrigger: Ne,
  CollapsibleContent: Me,
  SlidingViews: Re,
  SlidingView: Ae
});
export {
  ot as A,
  st as K,
  dt as S,
  ae as a,
  ie as b,
  ne as c,
  re as d,
  se as e,
  oe as f,
  de as g,
  ue as h,
  be as i,
  me as j,
  pe as k,
  fe as l,
  ge as m,
  he as n,
  ve as o,
  we as p,
  Se as q,
  ye as r,
  Ce as s,
  ke as t,
  Ne as u,
  Me as v,
  Re as w,
  Ae as x,
  V as y,
  J as z
};
//# sourceMappingURL=sidebar-7whsl7qwrw5b6ip8.js.map
