"use client";
import * as React from 'react';
import { useState, useEffect, useRef, useId, useMemo } from 'react';
import Link from 'next/link';
import Image from 'next/image';
import { useReducedMotion, LayoutGroup, motion } from 'framer-motion';
import { Home, LayoutDashboard, BookUser, CreditCard, FileText, UserCog, Settings, Bell, Megaphone, Settings2, MoreHorizontal, ChevronDown, PanelLeftClose, Search, LogOut } from 'lucide-react';
import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
import { clsx } from 'clsx';
import { twMerge } from 'tailwind-merge';
import { Popover as Popover$1 } from '@base-ui/react/popover';
import { Input as Input$1 } from '@base-ui/react/input';
import { cva } from 'class-variance-authority';

var __defProp = Object.defineProperty;
var __defProps = Object.defineProperties;
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __propIsEnum = Object.prototype.propertyIsEnumerable;
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
var __spreadValues = (a, b) => {
  for (var prop in b || (b = {}))
    if (__hasOwnProp.call(b, prop))
      __defNormalProp(a, prop, b[prop]);
  if (__getOwnPropSymbols)
    for (var prop of __getOwnPropSymbols(b)) {
      if (__propIsEnum.call(b, prop))
        __defNormalProp(a, prop, b[prop]);
    }
  return a;
};
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
var __objRest = (source, exclude) => {
  var target = {};
  for (var prop in source)
    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
      target[prop] = source[prop];
  if (source != null && __getOwnPropSymbols)
    for (var prop of __getOwnPropSymbols(source)) {
      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
        target[prop] = source[prop];
    }
  return target;
};

// src/chrome/app-line-field-dial-preset.tsx
var appLineFieldPattern = {
  lineField: {
    spacing: 4,
    thickness: 1.2,
    topOpacity: 0.18,
    bottomOpacity: 0.15,
    /** Pinstripe tint matches `--theme-background-sidebar` (warm shell gray). */
    tint: "#F9FAFA",
    blur: 0,
    lift: 0
  },
  surface: {
    showPattern: true,
    glowOpacity: 0.2,
    noiseOpacity: 0.08
  }
};
function hexToRgb(hex) {
  const normalized = hex.replace("#", "");
  const expanded = normalized.length === 3 ? normalized.split("").map((character) => `${character}${character}`).join("") : normalized;
  if (!/^[\da-fA-F]{6}$/.test(expanded)) {
    return { r: 148, g: 163, b: 184 };
  }
  return {
    r: Number.parseInt(expanded.slice(0, 2), 16),
    g: Number.parseInt(expanded.slice(2, 4), 16),
    b: Number.parseInt(expanded.slice(4, 6), 16)
  };
}
var DARK_LINE_ALPHA_SCALE = 0.14;
function flatLightStripeColor(pattern, tint) {
  const a = (pattern.lineField.topOpacity + pattern.lineField.bottomOpacity) / 2;
  return `rgba(${tint.r}, ${tint.g}, ${tint.b}, ${a})`;
}
function flatDarkStripeColor(pattern) {
  const a = (pattern.lineField.topOpacity + pattern.lineField.bottomOpacity) / 2 * DARK_LINE_ALPHA_SCALE;
  return `rgba(255, 255, 255, ${a})`;
}
function GroovedHorizontalStripes({
  pattern,
  tint,
  patternOpacity,
  lift,
  mask,
  isDark
}) {
  const stripeColor = isDark ? flatDarkStripeColor(pattern) : flatLightStripeColor(pattern, tint);
  return /* @__PURE__ */ jsx(
    "div",
    {
      className: "absolute inset-0",
      style: {
        transform: lift,
        filter: `blur(${pattern.lineField.blur}px)`,
        backgroundColor: stripeColor,
        opacity: patternOpacity,
        WebkitMaskImage: mask,
        maskImage: mask
      }
    }
  );
}
function LineFieldPatternLayers({
  pattern
}) {
  const tint = hexToRgb(pattern.lineField.tint);
  const lift = `translateY(${pattern.lineField.lift}px)`;
  const mask = `repeating-linear-gradient(to bottom, rgba(0,0,0,1) 0px, rgba(0,0,0,1) ${pattern.lineField.thickness}px, transparent ${pattern.lineField.thickness}px, transparent ${pattern.lineField.spacing}px)`;
  const patternOpacity = pattern.surface.showPattern ? 1 : 0;
  const darkShellLayers = /* @__PURE__ */ jsx(
    GroovedHorizontalStripes,
    {
      pattern,
      tint,
      patternOpacity,
      lift,
      mask,
      isDark: true
    }
  );
  return /* @__PURE__ */ jsxs(
    "div",
    {
      "aria-hidden": true,
      className: "pointer-events-none absolute inset-0 z-0 overflow-hidden",
      suppressHydrationWarning: true,
      children: [
        /* @__PURE__ */ jsx("div", { className: "absolute inset-0 dark:hidden", children: /* @__PURE__ */ jsx(
          GroovedHorizontalStripes,
          {
            pattern,
            tint,
            patternOpacity,
            lift,
            mask,
            isDark: false
          }
        ) }),
        /* @__PURE__ */ jsx("div", { className: "absolute inset-0 hidden dark:block", children: darkShellLayers })
      ]
    }
  );
}
function AppShellLineFieldPattern() {
  return /* @__PURE__ */ jsx(LineFieldPatternLayers, { pattern: appLineFieldPattern });
}
function SidebarLineFieldPattern() {
  return /* @__PURE__ */ jsx(AppShellLineFieldPattern, {});
}
function cn(...inputs) {
  return twMerge(clsx(inputs));
}
var BOUNDARY_PATH = "M2.36575 1.22688C2.60323 1.03206 2.91708 0.957188 3.21693 1.02382L4.93122 1.40478C5.47035 1.52458 5.81028 2.05876 5.69047 2.59789C5.57067 3.13703 5.03649 3.47696 4.49736 3.35715L4.02774 3.25279L4.04157 3.88283C4.05369 4.43498 3.61591 4.89241 3.06376 4.90453C2.51161 4.91665 2.05417 4.47887 2.04205 3.92672L2.00024 2.02196C1.9935 1.71486 2.12827 1.4217 2.36575 1.22688ZM6.30953 2.73546C6.42933 2.19633 6.96351 1.8564 7.50265 1.9762L10.9312 2.73811C11.4704 2.85792 11.8103 3.39209 11.6905 3.93123C11.5707 4.47036 11.0365 4.81029 10.4974 4.69048L7.06878 3.92858C6.52965 3.80877 6.18972 3.27459 6.30953 2.73546ZM12.3095 4.06879C12.4293 3.52966 12.9635 3.18973 13.5026 3.30954L16.9312 4.07144C17.4704 4.19125 17.8103 4.72543 17.6905 5.26456C17.5707 5.80369 17.0365 6.14362 16.4974 6.02382L13.0688 5.26191C12.5297 5.1421 12.1897 4.60793 12.3095 4.06879ZM18.3095 5.40213C18.4293 4.86299 18.9635 4.52306 19.5026 4.64287L21.2169 5.02382C21.7264 5.13703 22.0631 5.62298 21.9902 6.13974L21.7393 7.91752C21.6621 8.46438 21.1563 8.84515 20.6094 8.76798C20.0625 8.69081 19.6818 8.18492 19.7589 7.63806L19.8806 6.77566L19.0688 6.59524C18.5297 6.47544 18.1897 5.94126 18.3095 5.40213ZM3.08258 5.76216C3.63474 5.75004 4.09217 6.18782 4.10429 6.73997L4.18791 10.5495C4.20003 11.1016 3.76225 11.5591 3.2101 11.5712C2.65795 11.5833 2.20052 11.1455 2.18839 10.5934L2.10477 6.78386C2.09265 6.23171 2.53043 5.77428 3.08258 5.76216ZM20.5126 9.45426C21.0594 9.53144 21.4402 10.0373 21.363 10.5842L20.8613 14.1397C20.7841 14.6866 20.2782 15.0674 19.7313 14.9902C19.1845 14.913 18.8037 14.4071 18.8809 13.8603L19.3826 10.3047C19.4598 9.75786 19.9657 9.37709 20.5126 9.45426ZM3.22893 12.4288C3.78108 12.4167 4.23851 12.8545 4.25063 13.4066L4.33425 17.2162C4.34637 17.7683 3.90859 18.2257 3.35644 18.2379C2.80429 18.25 2.34686 17.8122 2.33474 17.2601L2.25111 13.4505C2.23899 12.8984 2.67677 12.4409 3.22893 12.4288ZM19.6345 15.6765C20.1814 15.7537 20.5621 16.2595 20.485 16.8064L20.2341 18.5842C20.176 18.996 19.8691 19.3288 19.4634 19.4201L17.2055 19.928C16.6667 20.0492 16.1317 19.7107 16.0104 19.1719C15.8892 18.6331 16.2278 18.098 16.7666 17.9768L18.3503 17.6205L18.5046 16.5269C18.5818 15.9801 19.0876 15.5993 19.6345 15.6765ZM14.5749 19.4948C14.6961 20.0336 14.3576 20.5687 13.8188 20.6899L9.3031 21.7058C8.76429 21.827 8.22922 21.4885 8.10801 20.9496C7.98679 20.4108 8.32533 19.8758 8.86414 19.7546L13.3798 18.7387C13.9186 18.6175 14.4537 18.956 14.5749 19.4948ZM3.37527 19.0955C3.92742 19.0834 4.38485 19.5212 4.39697 20.0733L4.41196 20.7561L5.47738 20.5165C6.0162 20.3952 6.55127 20.7338 6.67248 21.2726C6.7937 21.8114 6.45516 22.3465 5.91634 22.4677L3.65851 22.9756C3.36589 23.0415 3.05917 22.9725 2.82292 22.7877C2.58668 22.6029 2.44585 22.3218 2.43927 22.022L2.39745 20.1172C2.38533 19.565 2.82312 19.1076 3.37527 19.0955Z";
function BoundaryIcon(_a) {
  var _b = _a, {
    className
  } = _b, props = __objRest(_b, [
    "className"
  ]);
  return /* @__PURE__ */ jsx(
    "svg",
    __spreadProps(__spreadValues({
      viewBox: "0 0 24 24",
      fill: "none",
      xmlns: "http://www.w3.org/2000/svg",
      className: cn("shrink-0", className),
      "aria-hidden": true
    }, props), {
      children: /* @__PURE__ */ jsx(
        "path",
        {
          fill: "currentColor",
          fillRule: "evenodd",
          clipRule: "evenodd",
          d: BOUNDARY_PATH
        }
      )
    })
  );
}
var CAR_WHEEL_LEFT_PATH = "M5.4 15C6.21002 15 6.86667 14.3284 6.86667 13.5C6.86667 12.6716 6.21002 12 5.4 12C4.58998 12 3.93333 12.6716 3.93333 13.5C3.93333 14.3284 4.58998 15 5.4 15Z";
var CAR_WHEEL_RIGHT_PATH = "M19.5778 13.5C19.5778 14.3284 18.9211 15 18.1111 15C17.3011 15 16.6444 14.3284 16.6444 13.5C16.6444 12.6716 17.3011 12 18.1111 12C18.9211 12 19.5778 12.6716 19.5778 13.5Z";
var CAR_BODY_PATH = "M8.95983 4C7.32521 4 5.79875 4.83551 4.89203 6.2265L3.73597 8H1.97778C1.43777 8 1 8.44771 1 9C1 9.55229 1.43777 10 1.97778 10H2.43226L1.82109 10.9376C1.2857 11.7589 1 12.724 1 13.7111V18C1 19.1046 1.87553 20 2.95556 20H5.88889C6.96891 20 7.84444 19.1046 7.84444 18V17.5H16.1556V18C16.1556 19.1046 17.0311 20 18.1111 20H21.0444C22.1245 20 23 19.1046 23 18V13.7111C23 12.724 22.7143 11.7589 22.1789 10.9376L21.5677 10H22.0222C22.5622 10 23 9.55229 23 9C23 8.44771 22.5622 8 22.0222 8H20.264L19.108 6.2265C18.2013 4.83551 16.6748 4 15.0402 4H8.95983ZM6.51915 7.3359C7.06318 6.5013 7.97906 6 8.95983 6H15.0402C16.0209 6 16.9368 6.5013 17.4809 7.3359L18.5235 8.93541C18.1687 9.11664 17.7536 9.23926 17.2161 9.32426C16.1581 9.49159 14.7214 9.49966 12.4695 9.5H12.0194C9.76749 9.49966 8.33075 9.49159 7.27276 9.32426C6.54828 9.20968 6.04598 9.02672 5.61431 8.724L6.51915 7.3359ZM11.3181 11.5047C11.6278 11.5023 11.9368 11.5 12.2444 11.5C12.552 11.5 12.861 11.5023 13.1707 11.5047C14.6202 11.5156 16.0872 11.5266 17.515 11.3008C18.3259 11.1725 19.0047 10.9581 19.6134 10.6074L20.5518 12.047C20.873 12.5398 21.0444 13.1188 21.0444 13.7111V18H18.1111V16.75C18.1111 16.0596 17.5639 15.5 16.8889 15.5H7.11111C6.4361 15.5 5.88889 16.0596 5.88889 16.75V18H2.95556V13.7111C2.95556 13.1188 3.12697 12.5398 3.44821 12.047L4.52955 10.3881C5.22645 10.8718 6.00609 11.1477 6.97391 11.3008C8.40173 11.5266 9.86861 11.5156 11.3181 11.5047Z";
function CarIcon(_a) {
  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
  return /* @__PURE__ */ jsxs(
    "svg",
    __spreadProps(__spreadValues({
      viewBox: "0 0 24 24",
      fill: "none",
      xmlns: "http://www.w3.org/2000/svg",
      className: cn("shrink-0", className),
      "aria-hidden": true
    }, props), {
      children: [
        /* @__PURE__ */ jsx("path", { fill: "currentColor", d: CAR_WHEEL_LEFT_PATH }),
        /* @__PURE__ */ jsx("path", { fill: "currentColor", d: CAR_WHEEL_RIGHT_PATH }),
        /* @__PURE__ */ jsx(
          "path",
          {
            fill: "currentColor",
            fillRule: "evenodd",
            clipRule: "evenodd",
            d: CAR_BODY_PATH
          }
        )
      ]
    })
  );
}
function AccountSelectorChevronsIcon(_a) {
  var _b = _a, {
    className
  } = _b, props = __objRest(_b, [
    "className"
  ]);
  return /* @__PURE__ */ jsxs(
    "svg",
    __spreadProps(__spreadValues({
      viewBox: "0 0 24 24",
      fill: "none",
      xmlns: "http://www.w3.org/2000/svg",
      stroke: "currentColor",
      strokeWidth: "2",
      strokeLinecap: "round",
      strokeLinejoin: "round",
      className: cn("shrink-0", className),
      "aria-hidden": true
    }, props), {
      children: [
        /* @__PURE__ */ jsx("path", { d: "m7 6 5-5 5 5" }),
        /* @__PURE__ */ jsx("path", { d: "m7 18 5 5 5-5" })
      ]
    })
  );
}
var springTransition = {
  type: "spring",
  duration: 0.35,
  bounce: 0
};
function ToggleSwitch({
  value: controlledValue,
  defaultValue,
  onValueChange,
  options,
  size = "default",
  disabled = false,
  className,
  "aria-label": ariaLabel
}) {
  const [internalValue, setInternalValue] = React.useState(
    defaultValue != null ? defaultValue : options[0].value
  );
  const isControlled = controlledValue !== void 0;
  const activeValue = isControlled ? controlledValue : internalValue;
  const layoutId = React.useId();
  const handleSelect = (optionValue) => {
    if (disabled || optionValue === activeValue) return;
    if (!isControlled) {
      setInternalValue(optionValue);
    }
    onValueChange == null ? void 0 : onValueChange(optionValue);
  };
  const handleKeyDown = (event, optionValue) => {
    if (event.key === "Enter" || event.key === " ") {
      event.preventDefault();
      handleSelect(optionValue);
    }
    if (event.key === "ArrowLeft" || event.key === "ArrowRight") {
      event.preventDefault();
      const otherOption = optionValue === options[0].value ? options[1] : options[0];
      handleSelect(otherOption.value);
      const container = event.currentTarget.parentElement;
      const otherButton = container == null ? void 0 : container.querySelector(
        `[data-value="${otherOption.value}"]`
      );
      otherButton == null ? void 0 : otherButton.focus();
    }
  };
  const isSmall = size === "sm";
  const isLarge = size === "lg";
  return /* @__PURE__ */ jsx(LayoutGroup, { children: /* @__PURE__ */ jsx(
    "div",
    {
      "data-slot": "toggle-switch",
      role: "radiogroup",
      "aria-label": ariaLabel,
      "aria-disabled": disabled || void 0,
      className: cn(
        "inline-flex items-center gap-0.5 rounded-[var(--radius-sm)] p-0.5",
        isSmall ? "h-7" : isLarge ? "h-11" : "h-9",
        disabled && "cursor-not-allowed opacity-50",
        className,
        // Track fill: apply after `className` so callers cannot accidentally override with a darker `bg-*` (e.g. sidebar chrome).
        "bg-neutral-200"
      ),
      children: options.map((option) => {
        var _a;
        const isActive = activeValue === option.value;
        return /* @__PURE__ */ jsxs(
          "button",
          {
            type: "button",
            role: "radio",
            "aria-checked": isActive,
            "aria-label": (_a = option.label) != null ? _a : option.value,
            "data-value": option.value,
            "data-active": isActive || void 0,
            disabled,
            tabIndex: isActive ? 0 : -1,
            onClick: () => handleSelect(option.value),
            onKeyDown: (e) => handleKeyDown(e, option.value),
            className: cn(
              "relative z-[1] inline-flex shrink-0 items-center justify-center rounded-[var(--radius-sm)] outline-none",
              "focus-visible:ring-2 focus-visible:ring-ring/50 focus-visible:ring-offset-1 focus-visible:ring-offset-background",
              "transition-colors duration-150",
              "active:scale-[0.97] active:transition-transform active:duration-75",
              "motion-reduce:active:scale-100",
              isSmall ? "min-w-7 h-6 px-1.5" : isLarge ? "min-w-11 h-10 px-3" : "min-w-9 h-8 px-2",
              isActive ? "text-primary" : "text-[var(--theme-icon-secondary)] hover:text-[var(--theme-icon-primary)]",
              disabled ? "pointer-events-none" : "cursor-pointer"
            ),
            children: [
              isActive && /* @__PURE__ */ jsx(
                motion.span,
                {
                  layoutId: `toggle-indicator-${layoutId}`,
                  className: "pointer-events-none absolute inset-0 z-0 rounded-[var(--radius-sm)] bg-[var(--theme-background-page)] shadow-[0px_1px_3px_0px_rgba(0,0,0,0.08),0px_1px_2px_-1px_rgba(0,0,0,0.08)]",
                  transition: springTransition,
                  style: { willChange: "transform" }
                }
              ),
              option.icon != null && /* @__PURE__ */ jsx(
                "span",
                {
                  className: cn(
                    "relative z-[1] [&>svg]:shrink-0",
                    isSmall ? "[&>svg]:size-3.5" : isLarge ? "[&>svg]:size-5" : "[&>svg]:size-[18px]"
                  ),
                  "aria-hidden": true,
                  children: option.icon
                }
              ),
              option.label != null && option.icon == null && /* @__PURE__ */ jsx(
                "span",
                {
                  className: cn(
                    "relative z-[1] font-medium select-none",
                    isSmall ? "text-xs" : isLarge ? "text-base" : "text-sm"
                  ),
                  children: option.label
                }
              )
            ]
          },
          option.value
        );
      })
    }
  ) });
}
function Popover(_a) {
  var props = __objRest(_a, []);
  return /* @__PURE__ */ jsx(Popover$1.Root, __spreadValues({ "data-slot": "popover" }, props));
}
function PopoverTrigger(_a) {
  var props = __objRest(_a, []);
  return /* @__PURE__ */ jsx(Popover$1.Trigger, __spreadValues({ "data-slot": "popover-trigger" }, props));
}
function PopoverContent(_a) {
  var _b = _a, {
    className,
    align = "center",
    alignOffset = 0,
    side = "bottom",
    sideOffset = 4,
    collisionPadding,
    collisionBoundary,
    collisionAvoidance
  } = _b, props = __objRest(_b, [
    "className",
    "align",
    "alignOffset",
    "side",
    "sideOffset",
    "collisionPadding",
    "collisionBoundary",
    "collisionAvoidance"
  ]);
  return /* @__PURE__ */ jsx(Popover$1.Portal, { children: /* @__PURE__ */ jsx(
    Popover$1.Positioner,
    {
      align,
      alignOffset,
      side,
      sideOffset,
      collisionPadding,
      collisionBoundary,
      collisionAvoidance,
      className: "isolate z-50",
      children: /* @__PURE__ */ jsx(
        Popover$1.Popup,
        __spreadValues({
          "data-slot": "popover-content",
          className: cn(
            "z-50 flex w-72 origin-(--transform-origin) flex-col gap-2.5 rounded-sm bg-popover p-2.5 text-sm text-popover-foreground shadow-md ring-1 ring-foreground/10 outline-hidden duration-100 data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-left-2 data-[side=inline-start]:slide-in-from-right-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95",
            className
          )
        }, props)
      )
    }
  ) });
}
cva(
  "text-xs leading-4",
  {
    variants: {
      variant: {
        default: "text-muted-foreground",
        error: "text-destructive",
        success: "text-[var(--theme-text-success)]"
      }
    },
    defaultVariants: {
      variant: "default"
    }
  }
);
var inputContainerVariants = cva(
  "flex w-full items-center overflow-clip rounded-[var(--radius-sm)] transition-[background-color,border-color] duration-150 has-[:focus-within]:transition-none has-[:focus-visible]:border-input-hover has-[:focus-visible]:ring-0 has-[:disabled]:pointer-events-none has-[:disabled]:opacity-50 has-[aria-invalid]:border-destructive has-[aria-invalid]:ring-3 has-[aria-invalid]:ring-destructive/20 dark:has-[aria-invalid]:border-destructive/50 dark:has-[aria-invalid]:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
  {
    variants: {
      inputStyle: {
        default: "border border-border bg-card shadow-none hover:bg-[var(--theme-background-input-hover)] dark:bg-sidebar dark:hover:bg-[var(--theme-background-input-hover)] dark:has-[:disabled]:hover:bg-sidebar dark:has-[:disabled]:bg-input/80",
        soft: "border border-transparent bg-card hover:bg-[var(--theme-background-input-hover)] has-[:disabled]:hover:bg-card dark:bg-sidebar dark:hover:bg-[var(--theme-background-input-hover)] dark:has-[:disabled]:hover:bg-sidebar"
      },
      size: {
        sm: "min-h-8",
        /** Fixed height (not min-height) so flex children cannot grow the row past 36px (e.g. toolbar alignment). */
        lg: "h-9"
      }
    },
    defaultVariants: {
      inputStyle: "default",
      size: "sm"
    }
  }
);
function InputContainer(_a) {
  var _b = _a, {
    className,
    inputStyle = "default",
    size = "sm"
  } = _b, props = __objRest(_b, [
    "className",
    "inputStyle",
    "size"
  ]);
  return /* @__PURE__ */ jsx(
    "div",
    __spreadValues({
      "data-slot": "input-container",
      className: cn(
        inputContainerVariants({ inputStyle, size, className })
      )
    }, props)
  );
}
var inputVariants = cva(
  "w-full min-w-0 bg-transparent text-sm text-foreground outline-none transition-colors placeholder:text-muted-foreground file:inline-flex file:h-6 file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground disabled:pointer-events-none disabled:cursor-not-allowed",
  {
    variants: {
      size: {
        sm: "h-8 px-2.5 py-1",
        /** `py-0` avoids UA + padding stacking past 36px; `leading-5` matches `text-sm` line box. */
        lg: "h-9 px-2.5 py-0 leading-5"
      },
      standalone: {
        true: "rounded-[var(--radius-sm)] border border-border bg-card shadow-none transition-[background-color,border-color] duration-150 hover:bg-[var(--theme-background-input-hover)] focus-visible:transition-none focus-visible:border-input-hover focus-visible:ring-0 disabled:bg-input/50 disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 dark:bg-sidebar dark:hover:bg-[var(--theme-background-input-hover)] dark:disabled:bg-input/80 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40",
        false: "border-none focus-visible:ring-0 focus-visible:ring-offset-0"
      }
    },
    defaultVariants: {
      size: "sm",
      standalone: true
    }
  }
);
function Input(_a) {
  var _b = _a, {
    className,
    type,
    size = "sm",
    standalone = true
  } = _b, props = __objRest(_b, [
    "className",
    "type",
    "size",
    "standalone"
  ]);
  return /* @__PURE__ */ jsx(
    Input$1,
    __spreadValues({
      type,
      "data-slot": "input",
      className: cn(inputVariants({ size, standalone, className }))
    }, props)
  );
}
function InputIcon(_a) {
  var _b = _a, {
    className,
    position = "lead",
    children
  } = _b, props = __objRest(_b, [
    "className",
    "position",
    "children"
  ]);
  return /* @__PURE__ */ jsx(
    "div",
    __spreadProps(__spreadValues({
      "data-slot": "input-icon",
      "data-position": position,
      className: cn(
        "flex shrink-0 items-center justify-center text-muted-foreground",
        position === "lead" ? "pl-2.5" : "pr-2.5",
        className
      )
    }, props), {
      children
    })
  );
}
function filterSidebarAccountsByQuery(accounts, query) {
  const q = query.trim().toLowerCase();
  if (!q) return accounts;
  return accounts.filter(
    (a) => a.primaryText.toLowerCase().includes(q) || a.secondaryText.toLowerCase().includes(q)
  );
}
function getPersonInitialsFromName(primaryText, explicitInitials) {
  var _a, _b;
  const raw = explicitInitials == null ? void 0 : explicitInitials.trim();
  if (raw) {
    return raw.length >= 2 ? raw.slice(0, 2).toUpperCase() : `${(_a = raw[0]) != null ? _a : "?"}${(_b = raw[0]) != null ? _b : "?"}`.toUpperCase();
  }
  const parts = primaryText.trim().split(/\s+/).filter(Boolean);
  if (parts.length === 0) return "??";
  if (parts.length === 1) return parts[0].slice(0, 2).toUpperCase();
  const first = parts[0][0];
  const last = parts[parts.length - 1][0];
  return `${first != null ? first : "?"}${last != null ? last : "?"}`.toUpperCase();
}
var ACCOUNT_CHIP_LABEL_TRANSITION_CLASS = "overflow-hidden transition-[max-width,opacity] duration-200 ease-[cubic-bezier(0.4,0,0.2,1)] motion-reduce:transition-none";
var FOOTER_NAV_MATCH_GAP_CLASS = "transition-[gap] duration-200 ease-[cubic-bezier(0.4,0,0.2,1)] motion-reduce:transition-none";
var ACCOUNT_CHIP_BOX_CLASS = "h-[58px] min-h-[58px]";
function resolveActiveAccount(accounts, activeAccountId) {
  if (activeAccountId) {
    const match = accounts.find((a) => a.id === activeAccountId);
    if (match) {
      return match;
    }
  }
  return accounts[0];
}
function SidebarAccountSwitcher({
  accounts,
  activeAccountId,
  onAccountChange,
  onLogOut,
  collapsed,
  anchorAtFooter = false
}) {
  var _a;
  const [open, setOpen] = useState(false);
  const [searchQuery, setSearchQuery] = useState("");
  const titleId = useId();
  const activeAccount = useMemo(
    () => resolveActiveAccount(accounts, activeAccountId),
    [accounts, activeAccountId]
  );
  const filteredAccounts = useMemo(
    () => filterSidebarAccountsByQuery(accounts, searchQuery),
    [accounts, searchQuery]
  );
  function handleOpenChange(next) {
    setOpen(next);
    if (!next) {
      setSearchQuery("");
    }
  }
  const displayInitials = (_a = activeAccount.initials) != null ? _a : activeAccount.primaryText.slice(0, 2).toUpperCase();
  const footerPersonInitials = useMemo(
    () => getPersonInitialsFromName(activeAccount.primaryText, activeAccount.initials),
    [activeAccount.primaryText, activeAccount.initials]
  );
  const popoverSide = collapsed ? "right" : anchorAtFooter ? "top" : "bottom";
  const useFooterUserChrome = Boolean(anchorAtFooter);
  return /* @__PURE__ */ jsx(
    "div",
    {
      className: cn(
        // Chip stays full-width in both states and shares the nav's side padding,
        // so the collapsed logo lands in the same icon column as the nav rows.
        "flex w-full justify-start",
        anchorAtFooter ? "pl-[var(--spacing-16)] pr-[var(--spacing-16)]" : "px-[var(--spacing-16)]"
      ),
      style: {
        paddingTop: 0,
        paddingBottom: anchorAtFooter ? 0 : "var(--spacing-8)"
      },
      children: /* @__PURE__ */ jsx("div", { className: "w-full min-w-0", children: /* @__PURE__ */ jsxs(Popover, { open, onOpenChange: handleOpenChange, children: [
        /* @__PURE__ */ jsxs(
          PopoverTrigger,
          {
            type: "button",
            title: collapsed ? activeAccount.primaryText : void 0,
            "aria-haspopup": "dialog",
            "aria-expanded": open,
            className: cn(
              "box-border flex cursor-pointer items-center rounded-[var(--radius-md)] transition-colors",
              // Constant `justify-center` + the `flex-1` label below: the logo/
              // avatar stays pinned left while the chip is wide, then glides to
              // center as the label collapses — monotonic, no overshoot.
              useFooterUserChrome ? cn(
                "w-full min-w-0",
                "border-0 bg-transparent pt-[var(--spacing-4)] pl-[var(--spacing-4)] pb-[var(--spacing-4)] pr-[var(--spacing-10)] hover:bg-sidebar-accent",
                "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[color:var(--sidebar-ring)] focus-visible:ring-offset-2 focus-visible:ring-offset-[color:var(--sidebar)]",
                FOOTER_NAV_MATCH_GAP_CLASS,
                "justify-center overflow-hidden",
                collapsed ? "h-[38px] gap-0" : "h-auto min-h-[38px] items-center gap-[var(--spacing-8)]"
              ) : cn(
                "pt-[var(--spacing-8)] px-[var(--spacing-8)] pb-[var(--spacing-8)]",
                "border border-border bg-[var(--theme-background-account-selector)] hover:bg-neutral-100",
                ACCOUNT_CHIP_BOX_CLASS,
                FOOTER_NAV_MATCH_GAP_CLASS,
                "w-full justify-center overflow-hidden",
                collapsed ? "gap-0" : "gap-[var(--spacing-8)]"
              )
            ),
            children: [
              useFooterUserChrome ? /* @__PURE__ */ jsx(
                "div",
                {
                  className: "box-border flex size-[34px] shrink-0 items-center justify-center rounded-full border border-border bg-neutral-800 text-center text-xs font-semibold leading-none text-white antialiased dark:border-neutral-600 dark:bg-neutral-900",
                  "aria-hidden": true,
                  children: footerPersonInitials
                }
              ) : /* @__PURE__ */ jsx(
                "div",
                {
                  className: "relative box-border flex size-10 shrink-0 items-center justify-center overflow-hidden rounded-[var(--radius-md)] border border-border bg-muted text-muted-foreground dark:border-neutral-600",
                  style: { fontSize: "var(--text-sm)" },
                  "aria-hidden": true,
                  children: activeAccount.logoSrc ? /* @__PURE__ */ jsx(
                    Image,
                    {
                      src: activeAccount.logoSrc,
                      alt: "",
                      fill: true,
                      sizes: "40px",
                      unoptimized: true,
                      className: "size-full object-cover object-center"
                    }
                  ) : displayInitials
                }
              ),
              /* @__PURE__ */ jsxs(
                "span",
                {
                  className: cn(
                    "flex min-w-0 flex-1 items-center overflow-hidden text-left",
                    "gap-[var(--spacing-8)]",
                    ACCOUNT_CHIP_LABEL_TRANSITION_CLASS,
                    collapsed ? "max-w-0 opacity-0" : "max-w-full opacity-100"
                  ),
                  "aria-hidden": collapsed,
                  children: [
                    /* @__PURE__ */ jsxs("span", { className: "min-w-0 flex-1 flex flex-col gap-0 self-center", children: [
                      /* @__PURE__ */ jsx(
                        "p",
                        {
                          className: "truncate font-medium leading-[var(--leading-5)]",
                          style: {
                            color: "var(--theme-text-primary)",
                            fontSize: "var(--text-xs)"
                          },
                          children: activeAccount.primaryText
                        }
                      ),
                      /* @__PURE__ */ jsx(
                        "p",
                        {
                          className: cn(
                            "truncate font-normal",
                            useFooterUserChrome && "-mt-0.5"
                          ),
                          style: {
                            color: "var(--theme-text-secondary)",
                            fontSize: "var(--text-xs)"
                          },
                          children: activeAccount.secondaryText
                        }
                      )
                    ] }),
                    useFooterUserChrome ? /* @__PURE__ */ jsx(
                      MoreHorizontal,
                      {
                        className: "size-4 shrink-0 text-muted-foreground",
                        "aria-hidden": true
                      }
                    ) : /* @__PURE__ */ jsx(
                      AccountSelectorChevronsIcon,
                      {
                        className: "size-4 shrink-0 text-muted-foreground",
                        "aria-hidden": true
                      }
                    )
                  ]
                }
              )
            ]
          }
        ),
        /* @__PURE__ */ jsxs(
          PopoverContent,
          {
            side: popoverSide,
            align: "start",
            sideOffset: 6,
            collisionPadding: 12,
            collisionAvoidance: { side: "flip", align: "shift" },
            className: cn(
              "w-[260px] max-w-[min(100vw-2rem,260px)] gap-0 rounded-[var(--radius-md)] border border-border bg-card p-[var(--spacing-8)] shadow-lg ring-0",
              "data-[side=bottom]:slide-in-from-top-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2"
            ),
            children: [
              /* @__PURE__ */ jsx("p", { className: "sr-only", id: titleId, children: "Select account" }),
              /* @__PURE__ */ jsxs(
                "div",
                {
                  className: "flex flex-col gap-[var(--spacing-8)]",
                  role: "dialog",
                  "aria-labelledby": titleId,
                  children: [
                    /* @__PURE__ */ jsxs(InputContainer, { size: "sm", inputStyle: "default", className: "w-full", children: [
                      /* @__PURE__ */ jsx(InputIcon, { position: "lead", children: /* @__PURE__ */ jsx(Search, { className: "size-4 text-muted-foreground", "aria-hidden": true }) }),
                      /* @__PURE__ */ jsx(
                        Input,
                        {
                          type: "search",
                          size: "sm",
                          standalone: false,
                          placeholder: "Search accounts\u2026",
                          value: searchQuery,
                          onChange: (e) => setSearchQuery(e.target.value),
                          autoComplete: "off",
                          "aria-label": "Search accounts"
                        }
                      )
                    ] }),
                    /* @__PURE__ */ jsx(
                      "div",
                      {
                        className: "max-h-[min(50vh,320px)] overflow-y-auto rounded-[var(--radius-md)] border border-border",
                        role: "listbox",
                        "aria-label": "Accounts",
                        children: filteredAccounts.length === 0 ? /* @__PURE__ */ jsx(
                          "p",
                          {
                            className: "px-[var(--spacing-8)] py-[var(--spacing-10)] text-center text-xs text-muted-foreground",
                            role: "status",
                            children: "No accounts match"
                          }
                        ) : filteredAccounts.map((account) => {
                          var _a2;
                          const isSelected = account.id === activeAccount.id;
                          const rowInitials = (_a2 = account.initials) != null ? _a2 : account.primaryText.slice(0, 2).toUpperCase();
                          return /* @__PURE__ */ jsxs(
                            "button",
                            {
                              type: "button",
                              role: "option",
                              "aria-selected": isSelected,
                              onClick: () => {
                                onAccountChange == null ? void 0 : onAccountChange(account.id);
                                setOpen(false);
                              },
                              className: cn(
                                "flex w-full items-center gap-[var(--spacing-8)] px-[var(--spacing-8)] py-[var(--spacing-6)] text-left transition-colors first:rounded-t-[calc(var(--radius-md)-1px)] last:rounded-b-[calc(var(--radius-md)-1px)]",
                                isSelected ? "bg-muted" : "hover:bg-neutral-100"
                              ),
                              children: [
                                /* @__PURE__ */ jsx(
                                  "div",
                                  {
                                    className: "relative box-border flex size-10 shrink-0 items-center justify-center overflow-hidden rounded-[var(--radius-md)] border border-border bg-muted text-muted-foreground dark:border-neutral-600",
                                    style: { fontSize: "var(--text-sm)" },
                                    "aria-hidden": true,
                                    children: account.logoSrc ? /* @__PURE__ */ jsx(
                                      Image,
                                      {
                                        src: account.logoSrc,
                                        alt: "",
                                        fill: true,
                                        sizes: "40px",
                                        unoptimized: true,
                                        className: "size-full object-cover object-center"
                                      }
                                    ) : rowInitials
                                  }
                                ),
                                /* @__PURE__ */ jsxs("span", { className: "min-w-0 flex-1 flex flex-col gap-0 self-center", children: [
                                  /* @__PURE__ */ jsx(
                                    "span",
                                    {
                                      className: "block truncate font-medium leading-[var(--leading-5)]",
                                      style: {
                                        color: "var(--theme-text-primary)",
                                        fontSize: "var(--text-xs)"
                                      },
                                      children: account.primaryText
                                    }
                                  ),
                                  /* @__PURE__ */ jsx(
                                    "span",
                                    {
                                      className: "block truncate font-normal",
                                      style: {
                                        color: "var(--theme-text-secondary)",
                                        fontSize: "var(--text-xs)"
                                      },
                                      children: account.secondaryText
                                    }
                                  )
                                ] })
                              ]
                            },
                            account.id
                          );
                        })
                      }
                    ),
                    onLogOut ? /* @__PURE__ */ jsx("div", { className: "border-t border-border pt-[var(--spacing-6)]", children: /* @__PURE__ */ jsxs(
                      "button",
                      {
                        type: "button",
                        onClick: () => {
                          setOpen(false);
                          onLogOut();
                        },
                        className: "flex w-full items-center gap-[var(--spacing-6)] rounded-[var(--radius-sm)] p-[var(--spacing-6)] text-left text-sm font-medium text-[var(--theme-text-primary)] transition-colors hover:bg-neutral-100",
                        children: [
                          /* @__PURE__ */ jsx(LogOut, { className: "size-4 shrink-0 text-muted-foreground", "aria-hidden": true }),
                          "Log out"
                        ]
                      }
                    ) }) : null
                  ]
                }
              )
            ]
          }
        )
      ] }) })
    }
  );
}
var DEFAULT_SIDEBAR_HOME_HREF = "/";
function getPersonInitialsFromName2(primaryText, explicitInitials) {
  var _a, _b;
  const raw = explicitInitials == null ? void 0 : explicitInitials.trim();
  if (raw) {
    return raw.length >= 2 ? raw.slice(0, 2).toUpperCase() : `${(_a = raw[0]) != null ? _a : "?"}${(_b = raw[0]) != null ? _b : "?"}`.toUpperCase();
  }
  const parts = primaryText.trim().split(/\s+/).filter(Boolean);
  if (parts.length === 0) {
    return "??";
  }
  if (parts.length === 1) {
    return parts[0].slice(0, 2).toUpperCase();
  }
  const first = parts[0][0];
  const last = parts[parts.length - 1][0];
  return `${first != null ? first : "?"}${last != null ? last : "?"}`.toUpperCase();
}
var TOOLBOX_LOGO_VIEWBOX = { width: 225, height: 84 };
var TOOLBOX_LOGO_HEADER_HEIGHT_PX = 40;
var TOOLBOX_LOGO_EXPANDED_WIDTH_PX = TOOLBOX_LOGO_VIEWBOX.width / TOOLBOX_LOGO_VIEWBOX.height * TOOLBOX_LOGO_HEADER_HEIGHT_PX;
var SIDEBAR_LOGO_INTERACTIVE_CLASSNAME = cn(
  "inline-flex items-center gap-2 rounded-[var(--radius-sm)] py-px",
  "outline-none transition-opacity hover:opacity-90",
  "focus-visible:ring-2 focus-visible:ring-[color:var(--sidebar-ring)] focus-visible:ring-offset-2 focus-visible:ring-offset-[color:var(--sidebar)]"
);
var SIDEBAR_WIDTH = 284;
var SIDEBAR_COLLAPSED_WIDTH = 80;
var SIDEBAR_COLLAPSED_ICON_NUDGE_PX = 0;
var SIDEBAR_COLLAPSE_MOTION_CLASS = "duration-200 ease-[cubic-bezier(0.4,0,0.2,1)] motion-reduce:transition-none";
var SIDEBAR_NAV_LABEL_TRANSITION_CLASS = cn(
  "overflow-hidden transition-[max-width,opacity]",
  SIDEBAR_COLLAPSE_MOTION_CLASS
);
var SIDEBAR_NAV_ROW_GAP_TRANSITION_CLASS = cn(
  "transition-[gap]",
  SIDEBAR_COLLAPSE_MOTION_CLASS
);
var SIDEBAR_NAV_ITEM_HEIGHT_CLASS = "h-[36px]";
var SIDEBAR_NAV_ITEM_PADDING_CLASS = "px-[var(--spacing-8)] py-[calc(var(--spacing-8)-1px)]";
var SIDEBAR_NAV_VIEW_ALL_HEIGHT_CLASS = "h-[30px]";
function ToolboxLogoMark({
  className,
  style
}) {
  return /* @__PURE__ */ jsxs(
    "svg",
    {
      className,
      style,
      viewBox: "0 0 225 84",
      fill: "none",
      xmlns: "http://www.w3.org/2000/svg",
      "aria-hidden": true,
      children: [
        /* @__PURE__ */ jsx("path", { d: "M82.543 2C81.0239 2 79.7924 3.23036 79.7924 4.74809V15.1298H84.071V6.27481H140.915V15.1298H145.194V4.74809C145.194 3.23036 143.962 2 142.443 2H82.543Z", fill: "currentColor" }),
        /* @__PURE__ */ jsx("path", { d: "M33.0701 33.0888V37.1902H27.1656V68.2595H22.1046V37.1902H16.2001V33.0888H33.0701Z", fill: "currentColor" }),
        /* @__PURE__ */ jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M49.1286 33.0888H55.3704C58.8569 33.0888 60.6001 34.7369 60.6001 38.033V63.3154C60.6001 66.6115 58.8569 68.2595 55.3704 68.2595H49.1286C45.6046 68.2595 43.8426 66.6115 43.8426 63.3154V38.033C43.8426 34.7369 45.6046 33.0888 49.1286 33.0888ZM55.5391 62.5288V38.8195C55.5391 38.1453 55.4267 37.7146 55.2017 37.5273C54.9768 37.3026 54.5269 37.1902 53.8521 37.1902H50.5906C49.9158 37.1902 49.466 37.3026 49.241 37.5273C49.0536 37.7146 48.9599 38.1453 48.9599 38.8195V62.5288C48.9599 63.203 49.0536 63.6525 49.241 63.8772C49.466 64.0645 49.9158 64.1581 50.5906 64.1581H53.8521C54.5269 64.1581 54.9768 64.0645 55.2017 63.8772C55.4267 63.6525 55.5391 63.203 55.5391 62.5288Z", fill: "currentColor" }),
        /* @__PURE__ */ jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M79.0771 33.0888H85.3189C88.8054 33.0888 90.5486 34.7369 90.5486 38.033V63.3154C90.5486 66.6115 88.8054 68.2595 85.3189 68.2595H79.0771C75.5531 68.2595 73.7911 66.6115 73.7911 63.3154V38.033C73.7911 34.7369 75.5531 33.0888 79.0771 33.0888ZM85.4876 62.5288V38.8195C85.4876 38.1453 85.3752 37.7146 85.1502 37.5273C84.9253 37.3026 84.4754 37.1902 83.8006 37.1902H80.5391C79.8643 37.1902 79.4145 37.3026 79.1895 37.5273C79.0021 37.7146 78.9084 38.1453 78.9084 38.8195V62.5288C78.9084 63.203 79.0021 63.6525 79.1895 63.8772C79.4145 64.0645 79.8643 64.1581 80.5391 64.1581H83.8006C84.4754 64.1581 84.9253 64.0645 85.1502 63.8772C85.3752 63.6525 85.4876 63.203 85.4876 62.5288Z", fill: "currentColor" }),
        /* @__PURE__ */ jsx("path", { d: "M109.082 64.1581H117.798V68.2595H104.021V33.0888H109.082V64.1581Z", fill: "currentColor" }),
        /* @__PURE__ */ jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M128.807 33.0888H141.01C144.534 33.0888 146.296 34.7369 146.296 38.033V46.9661C146.296 48.9512 145.546 50.1123 144.046 50.4494C145.546 50.824 146.296 51.9102 146.296 53.7081V63.3154C146.296 66.6115 144.534 68.2595 141.01 68.2595H128.807V33.0888ZM141.179 46.7414V38.7072C141.179 38.033 141.066 37.6022 140.841 37.4149C140.616 37.1902 140.166 37.0778 139.492 37.0778H133.868V48.3707H139.492C140.166 48.3707 140.616 48.277 140.841 48.0898C141.066 47.865 141.179 47.4156 141.179 46.7414ZM141.179 62.6412V53.989C141.179 53.3148 141.066 52.8841 140.841 52.6968C140.616 52.472 140.166 52.3597 139.492 52.3597H133.868V64.2705H139.492C140.166 64.2705 140.616 64.1769 140.841 63.9896C141.066 63.7649 141.179 63.3154 141.179 62.6412Z", fill: "currentColor" }),
        /* @__PURE__ */ jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M164.694 33.0888H170.936C174.422 33.0888 176.166 34.7369 176.166 38.033V63.3154C176.166 66.6115 174.422 68.2595 170.936 68.2595H164.694C161.17 68.2595 159.408 66.6115 159.408 63.3154V38.033C159.408 34.7369 161.17 33.0888 164.694 33.0888ZM171.105 62.5288V38.8195C171.105 38.1453 170.992 37.7146 170.767 37.5273C170.542 37.3026 170.092 37.1902 169.418 37.1902H166.156C165.481 37.1902 165.031 37.3026 164.807 37.5273C164.619 37.7146 164.525 38.1453 164.525 38.8195V62.5288C164.525 63.203 164.619 63.6525 164.807 63.8772C165.031 64.0645 165.481 64.1581 166.156 64.1581H169.418C170.092 64.1581 170.542 64.0645 170.767 63.8772C170.992 63.6525 171.105 63.203 171.105 62.5288Z", fill: "currentColor" }),
        /* @__PURE__ */ jsx("path", { d: "M199.929 50.2809L207.464 68.2595H201.84L197.117 54.8879L192.393 68.2595H186.939L194.361 50.2809L187.445 33.0888H193.068L197.117 45.7301L201.222 33.0888H206.733L199.929 50.2809Z", fill: "currentColor" }),
        /* @__PURE__ */ jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M6.75053 19.0992C5.23145 19.0992 4 20.3296 4 21.8473V79.2519C4 80.7696 5.23143 82 6.75053 82H218.236C219.755 82 220.986 80.7696 220.986 79.2519V21.8473C220.986 20.3296 219.755 19.0992 218.236 19.0992H6.75053ZM8.2786 77.7252V23.3741H216.708V77.7252H8.2786Z", fill: "currentColor" })
      ]
    }
  );
}
function ToolboxCondensedMark({ className }) {
  return /* @__PURE__ */ jsxs(
    "svg",
    {
      className,
      style: { color: "var(--primary)" },
      viewBox: "0 0 92 84",
      fill: "none",
      xmlns: "http://www.w3.org/2000/svg",
      "aria-hidden": true,
      children: [
        /* @__PURE__ */ jsx(
          "path",
          {
            d: "M25.349 2C23.83 2 22.5985 3.23036 22.5985 4.74809V15.1298H26.8771V6.27481H64.7214V15.1298H69V4.74809C69 3.23036 67.7686 2 66.2495 2H25.349Z",
            fill: "currentColor"
          }
        ),
        /* @__PURE__ */ jsx(
          "path",
          {
            d: "M54.5 33.0888V37.1902H48.5955V68.2595H43.5345V37.1902H37.6301V33.0888H54.5Z",
            fill: "currentColor"
          }
        ),
        /* @__PURE__ */ jsx(
          "path",
          {
            fillRule: "evenodd",
            clipRule: "evenodd",
            d: "M6.75053 19.0992C5.23145 19.0992 4 20.3296 4 21.8473V79.2519C4 80.7696 5.23143 82 6.75053 82H85.2358C86.7549 82 87.9863 80.7696 87.9863 79.2519V21.8473C87.9863 20.3296 86.7549 19.0992 85.2358 19.0992H6.75053ZM8.2786 77.7252V23.3741H83.7077V77.7252H8.2786Z",
            fill: "currentColor"
          }
        )
      ]
    }
  );
}
function SidebarRailIconNudge({
  collapsed,
  className,
  children
}) {
  const prefersReducedMotion = useReducedMotion();
  const shouldNudge = collapsed && !prefersReducedMotion;
  return /* @__PURE__ */ jsx(
    "span",
    {
      className: cn(
        "inline-flex shrink-0 items-center justify-center",
        !prefersReducedMotion && cn("transition-transform", SIDEBAR_COLLAPSE_MOTION_CLASS),
        className
      ),
      style: {
        transform: shouldNudge ? `translateX(${SIDEBAR_COLLAPSED_ICON_NUDGE_PX}px)` : "translateX(0)"
      },
      children
    }
  );
}
function ToolboxLogoMorph({ collapsed }) {
  if (collapsed) {
    return /* @__PURE__ */ jsx("div", { className: "box-border flex h-10 w-10 shrink-0 items-center justify-center", children: /* @__PURE__ */ jsx(ToolboxCondensedMark, { className: "h-10 w-10 text-primary" }) });
  }
  return /* @__PURE__ */ jsx("div", { className: "flex h-10 shrink-0 items-center", children: /* @__PURE__ */ jsx(
    ToolboxLogoMark,
    {
      className: "block h-10 w-auto text-primary",
      style: {
        width: TOOLBOX_LOGO_EXPANDED_WIDTH_PX,
        minWidth: TOOLBOX_LOGO_EXPANDED_WIDTH_PX
      }
    }
  ) });
}
function SidebarLogo({
  children,
  homeHref
}) {
  const isCustomLogo = children != null;
  return /* @__PURE__ */ jsx(
    Link,
    {
      href: homeHref,
      className: cn(SIDEBAR_LOGO_INTERACTIVE_CLASSNAME, "shrink-0 overflow-visible"),
      "aria-label": "Go to Inventory",
      children: isCustomLogo ? children : /* @__PURE__ */ jsx(
        "span",
        {
          className: cn(
            "inline-flex rounded-[var(--radius-sm)]",
            // Soft lift only (no inset highlight — avoids a visible hairline on the glyph)
            "[filter:drop-shadow(0_1px_2px_rgba(15,23,42,0.1))_drop-shadow(0_4px_14px_rgba(15,23,42,0.1))]",
            "dark:[filter:drop-shadow(0_3px_12px_rgba(0,0,0,0.58))]"
          ),
          children: /* @__PURE__ */ jsx(ToolboxLogoMark, { className: "h-10 w-auto text-primary" })
        }
      )
    }
  );
}
function SidebarFoldButton({
  collapsible,
  collapsed,
  onToggle,
  className
}) {
  return /* @__PURE__ */ jsx(
    "button",
    {
      type: "button",
      onClick: onToggle,
      "aria-label": collapsible ? collapsed ? "Expand sidebar" : "Collapse sidebar" : "Collapse sidebar",
      "aria-expanded": collapsible ? !collapsed : void 0,
      className: cn(
        "flex size-6 shrink-0 items-center justify-center rounded-[var(--radius-sm)] text-sidebar-foreground transition-colors hover:bg-sidebar-accent hover:text-sidebar-accent-foreground",
        className
      ),
      children: /* @__PURE__ */ jsx(
        PanelLeftClose,
        {
          className: cn(
            "size-4 transition-transform",
            SIDEBAR_COLLAPSE_MOTION_CLASS,
            collapsed && "rotate-180"
          ),
          "aria-hidden": true
        }
      )
    }
  );
}
var sidebarHeaderShellStyle = {
  paddingBottom: "var(--spacing-16)",
  paddingLeft: "var(--spacing-16)",
  paddingRight: "var(--spacing-16)",
  // 6px above the 24px token — wordmark + fold sit 2px higher than the Atlas panel anchor.
  paddingTop: "calc(var(--spacing-24) - 6px)"
};
function SidebarHeader({
  logo,
  homeHref,
  collapsed,
  showFoldButton,
  collapsible,
  onToggleCollapse,
  onExpandFromCondensedLogo
}) {
  if (logo) {
    return /* @__PURE__ */ jsxs(
      "div",
      {
        className: cn(
          "relative flex w-full shrink-0 items-center",
          collapsed ? "justify-center" : "justify-between"
        ),
        style: sidebarHeaderShellStyle,
        children: [
          /* @__PURE__ */ jsx(SidebarLogo, { homeHref, children: logo }),
          showFoldButton && !collapsed ? /* @__PURE__ */ jsx(
            SidebarFoldButton,
            {
              collapsible,
              collapsed,
              onToggle: onToggleCollapse
            }
          ) : null
        ]
      }
    );
  }
  if (showFoldButton && collapsible) {
    const logoLift = cn(
      "inline-flex rounded-[var(--radius-sm)]",
      "[filter:drop-shadow(0_1px_2px_rgba(15,23,42,0.1))_drop-shadow(0_4px_14px_rgba(15,23,42,0.1))]",
      "dark:[filter:drop-shadow(0_3px_12px_rgba(0,0,0,0.58))]"
    );
    return /* @__PURE__ */ jsxs(
      "div",
      {
        className: "relative w-full shrink-0 overflow-hidden",
        style: sidebarHeaderShellStyle,
        children: [
          /* @__PURE__ */ jsxs(
            "div",
            {
              className: cn(
                "flex h-10 w-full items-center justify-between transition-[opacity,transform]",
                SIDEBAR_COLLAPSE_MOTION_CLASS,
                collapsed ? "opacity-0" : "opacity-100"
              ),
              style: {
                transform: collapsed ? "scale(0.97)" : "scale(1)",
                transformOrigin: "left center"
              },
              "aria-hidden": collapsed,
              inert: collapsed || void 0,
              children: [
                /* @__PURE__ */ jsx(
                  Link,
                  {
                    href: homeHref,
                    "aria-label": "Go to Inventory",
                    "aria-expanded": true,
                    className: cn(SIDEBAR_LOGO_INTERACTIVE_CLASSNAME, "shrink-0"),
                    children: /* @__PURE__ */ jsx("span", { className: logoLift, children: /* @__PURE__ */ jsx(ToolboxLogoMorph, { collapsed: false }) })
                  }
                ),
                /* @__PURE__ */ jsx(
                  SidebarFoldButton,
                  {
                    collapsible,
                    collapsed: false,
                    onToggle: onToggleCollapse,
                    className: "shrink-0"
                  }
                )
              ]
            }
          ),
          /* @__PURE__ */ jsx(
            "div",
            {
              className: cn(
                "absolute inset-0 flex items-center justify-center transition-[opacity,transform]",
                SIDEBAR_COLLAPSE_MOTION_CLASS,
                collapsed ? "opacity-100" : "opacity-0"
              ),
              style: { transform: collapsed ? "scale(1)" : "scale(0.97)" },
              "aria-hidden": !collapsed,
              inert: !collapsed || void 0,
              children: /* @__PURE__ */ jsx(
                "button",
                {
                  type: "button",
                  onClick: onToggleCollapse,
                  "aria-label": "Expand sidebar",
                  "aria-expanded": false,
                  title: "Expand sidebar",
                  className: cn(
                    SIDEBAR_LOGO_INTERACTIVE_CLASSNAME,
                    "box-border flex size-10 items-center justify-center"
                  ),
                  children: /* @__PURE__ */ jsx("span", { className: logoLift, children: /* @__PURE__ */ jsx(ToolboxLogoMorph, { collapsed: true }) })
                }
              )
            }
          )
        ]
      }
    );
  }
  return /* @__PURE__ */ jsxs(
    "div",
    {
      className: cn(
        "relative flex w-full shrink-0 items-center",
        collapsed ? "justify-center" : "justify-between"
      ),
      style: sidebarHeaderShellStyle,
      children: [
        /* @__PURE__ */ jsx(
          Link,
          {
            href: homeHref,
            onClick: collapsible && collapsed && onExpandFromCondensedLogo ? (e) => {
              e.preventDefault();
              onExpandFromCondensedLogo();
            } : void 0,
            className: cn(
              SIDEBAR_LOGO_INTERACTIVE_CLASSNAME,
              collapsed && "box-border flex w-full min-h-10 shrink-0 justify-center [min-width:2.5rem]"
            ),
            "aria-label": collapsible && collapsed ? "Expand sidebar" : "Go to Inventory",
            "aria-expanded": collapsible ? !collapsed : void 0,
            children: /* @__PURE__ */ jsx(
              "span",
              {
                className: cn(
                  "inline-flex rounded-[var(--radius-sm)]",
                  collapsed && "flex w-full max-w-10 justify-center",
                  !collapsed && [
                    "[filter:drop-shadow(0_1px_2px_rgba(15,23,42,0.1))_drop-shadow(0_4px_14px_rgba(15,23,42,0.1))]",
                    "dark:[filter:drop-shadow(0_3px_12px_rgba(0,0,0,0.58))]"
                  ]
                ),
                children: /* @__PURE__ */ jsx(ToolboxLogoMorph, { collapsed })
              }
            )
          }
        ),
        showFoldButton && !collapsed ? /* @__PURE__ */ jsx(
          SidebarFoldButton,
          {
            collapsible,
            collapsed,
            onToggle: onToggleCollapse
          }
        ) : null
      ]
    }
  );
}
function SidebarUserBar({
  user,
  collapsed,
  accounts,
  activeAccountId,
  onAccountChange,
  onLogOut,
  anchorAtFooter = false,
  userFooterTrailing,
  userFooterTrailingInteractive = false
}) {
  var _a;
  if (accounts && accounts.length > 0) {
    return /* @__PURE__ */ jsx(
      "div",
      {
        className: cn(
          "w-full shrink-0",
          anchorAtFooter && "pb-[calc(var(--spacing-10)+var(--spacing-4))]"
        ),
        children: /* @__PURE__ */ jsx(
          SidebarAccountSwitcher,
          {
            accounts,
            activeAccountId,
            onAccountChange,
            onLogOut,
            collapsed,
            anchorAtFooter
          }
        )
      }
    );
  }
  const initials = (_a = user.initials) != null ? _a : user.primaryText.slice(0, 2).toUpperCase();
  const footerPersonInitials = getPersonInitialsFromName2(
    user.primaryText,
    user.initials
  );
  const headerPadding = !anchorAtFooter ? { paddingTop: 0, paddingBottom: "var(--spacing-8)" } : { paddingTop: 0, paddingBottom: 0 };
  const splitFooterTrailing = anchorAtFooter && userFooterTrailingInteractive && !!userFooterTrailing;
  const footerUserButton = /* @__PURE__ */ jsxs(
    "button",
    {
      type: "button",
      title: collapsed ? user.primaryText : void 0,
      className: cn(
        "box-border flex cursor-pointer items-center rounded-[var(--radius-md)] transition-colors",
        // Constant `justify-center` + `flex-1` label: monotonic glide to
        // center on collapse (matches the nav rows), no start↔center snap.
        anchorAtFooter ? cn(
          splitFooterTrailing ? "min-w-0 flex-1" : "w-full min-w-0",
          "border-0 bg-transparent pt-[var(--spacing-4)] pl-[var(--spacing-4)] pb-[var(--spacing-4)] hover:bg-sidebar-accent",
          splitFooterTrailing ? "pr-[var(--spacing-4)]" : "pr-[var(--spacing-10)]",
          "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[color:var(--sidebar-ring)] focus-visible:ring-offset-2 focus-visible:ring-offset-[color:var(--sidebar)]",
          SIDEBAR_NAV_ROW_GAP_TRANSITION_CLASS,
          userFooterTrailing && !splitFooterTrailing ? "overflow-visible" : "overflow-hidden",
          "justify-center",
          collapsed ? "h-[38px] gap-0" : "h-auto min-h-[38px] w-full items-center gap-[var(--spacing-8)]"
        ) : cn(
          "pt-[var(--spacing-8)] px-[var(--spacing-8)] pb-[var(--spacing-8)]",
          "border border-border bg-[var(--theme-background-account-selector)] hover:bg-neutral-100",
          ACCOUNT_CHIP_BOX_CLASS,
          SIDEBAR_NAV_ROW_GAP_TRANSITION_CLASS,
          "w-full justify-center overflow-hidden",
          collapsed ? "gap-0" : "gap-[var(--spacing-8)]"
        )
      ),
      children: [
        anchorAtFooter ? /* @__PURE__ */ jsx(
          "div",
          {
            className: "box-border flex size-[34px] shrink-0 items-center justify-center rounded-full border border-border bg-neutral-800 text-center text-xs font-semibold leading-none text-white antialiased dark:border-neutral-600 dark:bg-neutral-900",
            "aria-hidden": true,
            children: footerPersonInitials
          }
        ) : /* @__PURE__ */ jsx(
          "div",
          {
            className: "relative box-border flex size-10 shrink-0 items-center justify-center overflow-hidden rounded-[var(--radius-md)] border border-border bg-muted text-muted-foreground dark:border-neutral-600",
            style: { fontSize: "var(--text-sm)" },
            "aria-hidden": true,
            children: user.logoSrc ? /* @__PURE__ */ jsx(
              Image,
              {
                src: user.logoSrc,
                alt: "",
                fill: true,
                sizes: "40px",
                unoptimized: true,
                className: "size-full object-cover object-center"
              }
            ) : initials
          }
        ),
        /* @__PURE__ */ jsxs(
          "span",
          {
            className: cn(
              "flex min-w-0 flex-1 items-center overflow-hidden text-left",
              anchorAtFooter && userFooterTrailing && !splitFooterTrailing && "gap-0",
              !(anchorAtFooter && userFooterTrailing && !splitFooterTrailing) && "gap-[var(--spacing-8)]",
              SIDEBAR_NAV_LABEL_TRANSITION_CLASS,
              collapsed ? "max-w-0 opacity-0" : "max-w-full opacity-100"
            ),
            "aria-hidden": collapsed,
            children: [
              /* @__PURE__ */ jsxs("span", { className: "min-w-0 flex-1 flex flex-col gap-0 self-center", children: [
                /* @__PURE__ */ jsx(
                  "p",
                  {
                    className: "truncate font-medium leading-[var(--leading-5)]",
                    style: {
                      color: "var(--theme-text-primary)",
                      fontSize: "var(--text-xs)"
                    },
                    children: user.primaryText
                  }
                ),
                /* @__PURE__ */ jsx(
                  "p",
                  {
                    className: cn(
                      "truncate font-normal",
                      anchorAtFooter && "-mt-0.5"
                    ),
                    style: {
                      color: "var(--theme-text-secondary)",
                      fontSize: "var(--text-xs)"
                    },
                    children: user.secondaryText
                  }
                )
              ] }),
              anchorAtFooter && !userFooterTrailing ? /* @__PURE__ */ jsx(
                MoreHorizontal,
                {
                  className: "size-4 shrink-0 text-muted-foreground",
                  "aria-hidden": true
                }
              ) : null,
              !anchorAtFooter ? /* @__PURE__ */ jsx(
                AccountSelectorChevronsIcon,
                {
                  className: "size-4 shrink-0 text-muted-foreground",
                  "aria-hidden": true
                }
              ) : null
            ]
          }
        ),
        anchorAtFooter && userFooterTrailing && !collapsed && !splitFooterTrailing ? /* @__PURE__ */ jsx("span", { className: "shrink-0 overflow-visible", children: userFooterTrailing }) : null
      ]
    }
  );
  return /* @__PURE__ */ jsxs(
    "div",
    {
      className: cn(
        "w-full shrink-0",
        anchorAtFooter && "pb-[calc(var(--spacing-10)+var(--spacing-4))]"
      ),
      children: [
        /* @__PURE__ */ jsx(
          "div",
          {
            className: cn(
              "flex w-full justify-start pl-[var(--spacing-16)] pr-[var(--spacing-16)]",
              splitFooterTrailing && !collapsed && "items-center"
            ),
            style: headerPadding,
            children: splitFooterTrailing ? /* @__PURE__ */ jsxs(Fragment, { children: [
              footerUserButton,
              !collapsed ? /* @__PURE__ */ jsx("span", { className: "shrink-0 overflow-visible pr-[var(--spacing-4)]", children: userFooterTrailing }) : null
            ] }) : footerUserButton
          }
        ),
        anchorAtFooter && onLogOut ? /* @__PURE__ */ jsx(SidebarFooter, { onLogOut, collapsed }) : null
      ]
    }
  );
}
function SidebarProductSwitcher({
  products,
  activeProductId,
  onProductChange,
  collapsed
}) {
  var _a;
  const [isOpen, setIsOpen] = useState(false);
  const containerRef = useRef(null);
  useEffect(() => {
    if (!isOpen) return;
    function handleClickOutside(event) {
      if (containerRef.current && !containerRef.current.contains(event.target)) {
        setIsOpen(false);
      }
    }
    document.addEventListener("mousedown", handleClickOutside);
    return () => document.removeEventListener("mousedown", handleClickOutside);
  }, [isOpen]);
  const activeProduct = (_a = products.find((p) => p.id === activeProductId)) != null ? _a : products[0];
  const ActiveIcon = activeProduct.icon;
  return /* @__PURE__ */ jsxs(
    "div",
    {
      ref: containerRef,
      className: "relative w-full",
      style: {
        paddingLeft: "var(--spacing-16)",
        paddingRight: "var(--spacing-16)",
        paddingBottom: "var(--spacing-4)"
      },
      children: [
        /* @__PURE__ */ jsxs(
          "button",
          {
            type: "button",
            title: collapsed ? activeProduct.label : void 0,
            onClick: () => {
              if (collapsed) return;
              setIsOpen(!isOpen);
            },
            className: cn(
              "flex h-[36px] w-full min-w-0 items-center rounded-[var(--radius-sm)] px-[var(--spacing-8)] transition-colors hover:bg-muted",
              SIDEBAR_NAV_ROW_GAP_TRANSITION_CLASS,
              "justify-center",
              collapsed ? "gap-0" : "gap-[var(--spacing-6)]"
            ),
            children: [
              /* @__PURE__ */ jsx(
                SidebarRailIconNudge,
                {
                  collapsed,
                  className: "flex size-5 shrink-0 items-center justify-center text-[color:var(--theme-text-primary)]",
                  children: /* @__PURE__ */ jsx(ActiveIcon, { className: "size-[18px]", "aria-hidden": true })
                }
              ),
              /* @__PURE__ */ jsxs(
                "span",
                {
                  className: cn(
                    "flex min-w-0 flex-1 items-center gap-1 overflow-hidden text-left",
                    SIDEBAR_NAV_LABEL_TRANSITION_CLASS,
                    collapsed ? "max-w-0 opacity-0" : "max-w-[min(100vw,14rem)] opacity-100"
                  ),
                  "aria-hidden": collapsed,
                  children: [
                    /* @__PURE__ */ jsx(
                      "span",
                      {
                        className: "min-w-0 flex-1 truncate font-semibold whitespace-nowrap",
                        style: {
                          fontSize: "var(--text-sm)",
                          lineHeight: "var(--leading-5)",
                          color: "var(--theme-text-primary)"
                        },
                        children: activeProduct.label
                      }
                    ),
                    /* @__PURE__ */ jsx(
                      ChevronDown,
                      {
                        className: cn(
                          "size-4 shrink-0 text-muted-foreground transition-transform duration-200",
                          isOpen && "rotate-180"
                        ),
                        "aria-hidden": true
                      }
                    )
                  ]
                }
              )
            ]
          }
        ),
        isOpen && !collapsed && /* @__PURE__ */ jsx("div", { className: "absolute left-[var(--spacing-16)] right-[var(--spacing-16)] top-full z-50 mt-1 overflow-hidden rounded-[var(--radius-sm)] border border-border bg-card shadow-lg", children: products.map((product) => {
          const Icon = product.icon;
          const isActive = product.id === activeProductId;
          return /* @__PURE__ */ jsxs(
            "button",
            {
              type: "button",
              onClick: () => {
                onProductChange == null ? void 0 : onProductChange(product.id);
                setIsOpen(false);
              },
              className: cn(
                "flex w-full items-center gap-[var(--spacing-6)] px-[var(--spacing-8)] py-[var(--spacing-6)] transition-colors",
                isActive ? "bg-muted" : "hover:bg-muted/50"
              ),
              children: [
                /* @__PURE__ */ jsx(
                  "span",
                  {
                    className: "flex size-5 shrink-0 items-center justify-center",
                    style: {
                      color: isActive ? "var(--theme-text-primary)" : "var(--theme-text-secondary)"
                    },
                    children: /* @__PURE__ */ jsx(Icon, { className: "size-[18px]", "aria-hidden": true })
                  }
                ),
                /* @__PURE__ */ jsx(
                  "span",
                  {
                    className: "min-w-0 flex-1 truncate text-left font-medium",
                    style: {
                      fontSize: "var(--text-sm)",
                      color: isActive ? "var(--theme-text-primary)" : "var(--theme-text-secondary)"
                    },
                    children: product.label
                  }
                )
              ]
            },
            product.id
          );
        }) })
      ]
    }
  );
}
function SidebarNavStaticIcon({ src }) {
  if (src === "/boundary.svg") {
    return /* @__PURE__ */ jsx(BoundaryIcon, { className: "size-[18px]" });
  }
  if (src === "/car.svg") {
    return /* @__PURE__ */ jsx(CarIcon, { className: "size-[18px]" });
  }
  return /* @__PURE__ */ jsx(
    Image,
    {
      src,
      alt: "",
      width: 18,
      height: 18,
      unoptimized: true,
      className: "size-[18px] shrink-0 object-contain opacity-90",
      "aria-hidden": true
    }
  );
}
function SidebarNavPrimaryIcon({ item }) {
  if ("iconSrc" in item && item.iconSrc) {
    return /* @__PURE__ */ jsx(SidebarNavStaticIcon, { src: item.iconSrc });
  }
  if ("icon" in item && item.icon) {
    const Icon = item.icon;
    return /* @__PURE__ */ jsx(Icon, { className: "size-[18px]", "aria-hidden": true });
  }
  return null;
}
function SidebarNavItem({
  item,
  onClick,
  collapsed
}) {
  var _a, _b;
  const isActive = (_a = item.isActive) != null ? _a : false;
  const tone = (_b = item.tone) != null ? _b : "default";
  if (tone === "viewAll") {
    const viewAllClasses = cn(
      "flex w-full min-w-0 items-center justify-start rounded-[var(--radius-md)] px-[var(--spacing-8)] text-left transition-colors",
      SIDEBAR_NAV_VIEW_ALL_HEIGHT_CLASS,
      isActive ? "bg-[var(--sidebar-nav-item-active-bg)] font-medium text-sidebar-accent-foreground" : "text-[color:var(--theme-text-secondary)] hover:text-sidebar-accent-foreground"
    );
    const viewAllContent = /* @__PURE__ */ jsx(
      "span",
      {
        className: cn(
          "min-w-0 truncate whitespace-nowrap text-xs font-medium",
          SIDEBAR_NAV_LABEL_TRANSITION_CLASS,
          collapsed ? "max-w-0 opacity-0" : "max-w-[min(100vw,16rem)] opacity-100"
        ),
        style: { lineHeight: "var(--leading-5)" },
        "aria-hidden": collapsed,
        children: item.label
      }
    );
    if (item.href) {
      return /* @__PURE__ */ jsx(
        Link,
        {
          href: item.href,
          onClick,
          className: viewAllClasses,
          title: collapsed ? item.label : void 0,
          "aria-current": isActive ? "page" : void 0,
          children: viewAllContent
        }
      );
    }
    return /* @__PURE__ */ jsx(
      "button",
      {
        type: "button",
        onClick,
        className: viewAllClasses,
        title: collapsed ? item.label : void 0,
        "aria-current": isActive ? "page" : void 0,
        children: viewAllContent
      }
    );
  }
  const hasIcon = "icon" in item && item.icon || "iconSrc" in item && item.iconSrc;
  const reserveIconSpace = tone === "conversation" || hasIcon;
  const content = /* @__PURE__ */ jsxs(Fragment, { children: [
    reserveIconSpace ? /* @__PURE__ */ jsx(
      SidebarRailIconNudge,
      {
        collapsed,
        className: "flex size-5 shrink-0 items-center justify-center",
        children: hasIcon ? /* @__PURE__ */ jsx(SidebarNavPrimaryIcon, { item }) : null
      }
    ) : null,
    /* @__PURE__ */ jsx(
      "span",
      {
        className: cn(
          "min-w-0 truncate text-left font-medium whitespace-nowrap",
          (reserveIconSpace || collapsed) && "flex-1",
          SIDEBAR_NAV_LABEL_TRANSITION_CLASS,
          collapsed ? "max-w-0 opacity-0" : "max-w-[min(100vw,16rem)] opacity-100"
        ),
        style: {
          fontSize: "var(--text-sm)",
          lineHeight: "var(--leading-5)"
        },
        "aria-hidden": collapsed,
        children: item.label
      }
    )
  ] });
  const isExpandedTextOnlyRow = !collapsed && !reserveIconSpace;
  const navRowJustifyClass = isExpandedTextOnlyRow ? "justify-start" : "justify-center";
  const baseClasses = cn(
    "flex w-full min-w-0 items-center rounded-[var(--radius-md)] text-left transition-colors",
    SIDEBAR_NAV_ITEM_PADDING_CLASS,
    SIDEBAR_NAV_ITEM_HEIGHT_CLASS,
    SIDEBAR_NAV_ROW_GAP_TRANSITION_CLASS,
    // Icon / conversation rows use constant `justify-center` (not a start↔center
    // toggle): the `flex-1` label fills the row and pins the icon left while expanded,
    // then yields its slack as it collapses so the icon glides to center monotonically.
    // Text-only expanded rows use `justify-start` and a non-growing label.
    navRowJustifyClass,
    collapsed ? "gap-0" : reserveIconSpace ? "gap-[var(--spacing-6)]" : "gap-0"
  );
  const activeClasses = "bg-[var(--sidebar-nav-item-active-bg)] font-medium text-sidebar-accent-foreground";
  const inactiveClasses = "bg-transparent text-[color:var(--theme-text-secondary)] hover:bg-[var(--sidebar-nav-item-hover-bg)] hover:font-medium hover:text-sidebar-accent-foreground";
  if (item.href) {
    return /* @__PURE__ */ jsx(
      Link,
      {
        href: item.href,
        onClick,
        className: cn(baseClasses, isActive ? activeClasses : inactiveClasses),
        title: collapsed ? item.label : void 0,
        "aria-current": isActive ? "page" : void 0,
        children: content
      }
    );
  }
  return /* @__PURE__ */ jsx(
    "button",
    {
      type: "button",
      onClick,
      className: cn(baseClasses, isActive ? activeClasses : inactiveClasses),
      title: collapsed ? item.label : void 0,
      "aria-current": isActive ? "page" : void 0,
      children: content
    }
  );
}
function SidebarNavSection({
  section,
  onItemClick,
  collapsed,
  paddingTop: paddingTopOverride,
  paddingBottom: paddingBottomOverride
}) {
  return /* @__PURE__ */ jsxs(
    "div",
    {
      className: "flex w-full flex-col gap-[2px]",
      style: {
        paddingLeft: "var(--spacing-16)",
        paddingRight: "var(--spacing-16)",
        paddingTop: paddingTopOverride != null ? paddingTopOverride : "var(--spacing-16)",
        paddingBottom: paddingBottomOverride != null ? paddingBottomOverride : "var(--spacing-16)"
      },
      children: [
        section.title ? /* @__PURE__ */ jsx(
          "div",
          {
            className: cn(
              cn(
                "overflow-hidden px-[var(--spacing-8)] py-[var(--spacing-4)] text-left font-medium transition-opacity",
                SIDEBAR_COLLAPSE_MOTION_CLASS
              ),
              collapsed ? "pointer-events-none select-none opacity-0" : "opacity-100"
            ),
            style: {
              fontSize: "var(--text-xs)",
              lineHeight: "var(--leading-5)",
              color: "var(--theme-text-secondary)"
            },
            "aria-hidden": collapsed,
            children: section.title
          }
        ) : null,
        /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-[2px]", children: section.items.map((item) => {
          var _a;
          return /* @__PURE__ */ jsx(
            SidebarNavItem,
            {
              item,
              collapsed,
              onClick: () => onItemClick == null ? void 0 : onItemClick(item.label)
            },
            (_a = item.id) != null ? _a : item.label
          );
        }) })
      ]
    }
  );
}
function SidebarFooter({
  onLogOut,
  collapsed
}) {
  return /* @__PURE__ */ jsx(
    "div",
    {
      className: "flex w-full shrink-0 items-center gap-[var(--spacing-8)]",
      style: {
        paddingLeft: "var(--spacing-16)",
        paddingRight: "var(--spacing-16)",
        paddingTop: "var(--spacing-8)",
        paddingBottom: "var(--spacing-8)"
      },
      children: /* @__PURE__ */ jsxs(
        "button",
        {
          type: "button",
          onClick: onLogOut,
          title: collapsed ? "Log out" : void 0,
          className: cn(
            "flex min-w-0 flex-1 items-center rounded-[var(--radius-sm)] p-[var(--spacing-6)] transition-colors hover:bg-muted",
            SIDEBAR_NAV_ROW_GAP_TRANSITION_CLASS,
            "justify-center",
            collapsed ? "gap-0" : "gap-[var(--spacing-6)]"
          ),
          style: {
            fontSize: "var(--text-sm)",
            lineHeight: "var(--leading-5)",
            color: "var(--theme-text-primary)"
          },
          children: [
            /* @__PURE__ */ jsx(
              SidebarRailIconNudge,
              {
                collapsed,
                className: "flex size-5 shrink-0 items-center justify-center",
                children: /* @__PURE__ */ jsx(LogOut, { className: "size-[18px]", "aria-hidden": true })
              }
            ),
            /* @__PURE__ */ jsx(
              "span",
              {
                className: cn(
                  "min-w-0 flex-1 truncate font-medium whitespace-nowrap",
                  SIDEBAR_NAV_LABEL_TRANSITION_CLASS,
                  collapsed ? "max-w-0 opacity-0" : "max-w-[10rem] opacity-100"
                ),
                "aria-hidden": collapsed,
                children: "Log out"
              }
            )
          ]
        }
      )
    }
  );
}
function SidebarProductFooterToggle({
  products,
  activeProductId,
  onProductChange
}) {
  if (products.length !== 2) return null;
  const [left, right] = products;
  const LeftIcon = left.icon;
  const RightIcon = right.icon;
  return /* @__PURE__ */ jsx(
    "div",
    {
      className: "flex w-full justify-center",
      style: {
        paddingTop: "var(--spacing-8)",
        paddingBottom: "var(--spacing-4)"
      },
      children: /* @__PURE__ */ jsx(
        ToggleSwitch,
        {
          "aria-label": "Active app module",
          size: "default",
          className: cn(
            "inline-flex h-12 rounded-[12px] bg-neutral-200 p-1",
            "[&_[role=radio]]:h-10 [&_[role=radio]]:min-w-10 [&_[role=radio]]:px-0",
            "[&_[role=radio]]:text-[#6E6E6E] [&_[role=radio][data-active]]:text-[#2E2E2E]"
          ),
          value: activeProductId,
          onValueChange: (value) => onProductChange == null ? void 0 : onProductChange(value),
          options: [
            {
              value: left.id,
              label: left.label,
              icon: /* @__PURE__ */ jsx(LeftIcon, { className: "size-[18px]", "aria-hidden": true })
            },
            {
              value: right.id,
              label: right.label,
              icon: /* @__PURE__ */ jsx(RightIcon, { className: "size-[18px]", "aria-hidden": true })
            }
          ]
        }
      )
    }
  );
}
var defaultMainSections = [
  {
    items: [
      { label: "Home", icon: Home },
      { label: "Dashboard", icon: LayoutDashboard },
      { label: "Customers", icon: BookUser },
      { label: "Billing", icon: CreditCard, isActive: true },
      { label: "Reports", icon: FileText },
      { label: "Staff", icon: UserCog }
    ]
  }
];
var defaultSettingsSections = [
  {
    title: "Settings",
    items: [
      { label: "General", icon: Settings },
      { label: "Alerts", icon: Bell },
      { label: "Marketing", icon: Megaphone },
      { label: "Configurations", icon: Settings2 }
    ]
  }
];
var defaultUser = {
  primaryText: "Lewis Hamilton",
  secondaryText: "Service Manager"
};
function Sidebar({
  className,
  logo,
  homeHref = DEFAULT_SIDEBAR_HOME_HREF,
  user = defaultUser,
  accounts,
  activeAccountId,
  onAccountChange,
  footerAccounts,
  activeFooterAccountId,
  onFooterAccountChange,
  products,
  activeProductId,
  onProductChange,
  showTopProductSwitcher = true,
  showFooterProductToggle = true,
  mainSections = defaultMainSections,
  settingsSections = defaultSettingsSections,
  onNavItemClick,
  onFold,
  onLogOut,
  collapsible = false,
  collapsed,
  defaultCollapsed = false,
  onCollapsedChange,
  expandedWidth = SIDEBAR_WIDTH,
  collapsedWidth = SIDEBAR_COLLAPSED_WIDTH,
  showRightDivider = true,
  showLineFieldPattern = true,
  userFooterTrailing,
  userFooterTrailingInteractive = false,
  userFooterPanel
}) {
  var _a, _b;
  const [internalCollapsed, setInternalCollapsed] = useState(defaultCollapsed);
  const isCollapsed = collapsed != null ? collapsed : internalCollapsed;
  const showFoldButton = true;
  useEffect(() => {
    const root = document.documentElement;
    const widthPx = isCollapsed ? collapsedWidth : expandedWidth;
    root.style.setProperty("--app-shell-sidebar-width", `${widthPx}px`);
    return () => {
      root.style.removeProperty("--app-shell-sidebar-width");
    };
  }, [collapsedWidth, expandedWidth, isCollapsed]);
  function handleToggleCollapse() {
    if (!collapsible) {
      onFold == null ? void 0 : onFold();
      return;
    }
    const next = !isCollapsed;
    if (collapsed == null) {
      setInternalCollapsed(next);
    }
    onCollapsedChange == null ? void 0 : onCollapsedChange(next);
    onFold == null ? void 0 : onFold();
  }
  function handleExpandFromCondensedLogo() {
    if (!collapsible) return;
    if (collapsed == null) {
      setInternalCollapsed(false);
    }
    onCollapsedChange == null ? void 0 : onCollapsedChange(false);
    onFold == null ? void 0 : onFold();
  }
  const hasHeaderAccounts = ((_a = accounts == null ? void 0 : accounts.length) != null ? _a : 0) > 0;
  const hasFooterAccounts = ((_b = footerAccounts == null ? void 0 : footerAccounts.length) != null ? _b : 0) > 0;
  const showFooterUserOnlyChip = !hasHeaderAccounts && !hasFooterAccounts;
  return /* @__PURE__ */ jsxs(
    "aside",
    {
      className: cn(
        "relative isolate flex h-full flex-col bg-shell dark:bg-background",
        showRightDivider && "border-r border-sidebar-border",
        "transition-[width]",
        SIDEBAR_COLLAPSE_MOTION_CLASS,
        className
      ),
      style: { width: isCollapsed ? collapsedWidth : expandedWidth },
      "aria-label": "Main navigation",
      children: [
        showLineFieldPattern ? /* @__PURE__ */ jsx(SidebarLineFieldPattern, {}) : null,
        /* @__PURE__ */ jsxs("div", { className: "relative z-[1] flex h-full min-h-0 flex-1 flex-col", children: [
          /* @__PURE__ */ jsx(
            SidebarHeader,
            {
              logo,
              homeHref,
              collapsed: isCollapsed,
              showFoldButton,
              collapsible,
              onToggleCollapse: handleToggleCollapse,
              onExpandFromCondensedLogo: collapsible ? handleExpandFromCondensedLogo : void 0
            }
          ),
          /* @__PURE__ */ jsxs("div", { className: "flex min-h-0 flex-1 flex-col overflow-y-auto", children: [
            hasHeaderAccounts && /* @__PURE__ */ jsx(
              SidebarUserBar,
              {
                user,
                accounts,
                activeAccountId,
                onAccountChange,
                collapsed: isCollapsed,
                anchorAtFooter: false
              }
            ),
            showTopProductSwitcher && products && activeProductId && /* @__PURE__ */ jsx(
              SidebarProductSwitcher,
              {
                products,
                activeProductId,
                onProductChange,
                collapsed: isCollapsed
              }
            ),
            mainSections.map((section, index) => {
              var _a2;
              return /* @__PURE__ */ jsx(
                SidebarNavSection,
                {
                  section,
                  collapsed: isCollapsed,
                  onItemClick: onNavItemClick,
                  paddingTop: "var(--spacing-8)",
                  paddingBottom: "var(--spacing-8)"
                },
                (_a2 = section.title) != null ? _a2 : `main-${index}`
              );
            }),
            settingsSections.map((section, index) => {
              var _a2;
              return /* @__PURE__ */ jsx(
                SidebarNavSection,
                {
                  section,
                  collapsed: isCollapsed,
                  onItemClick: onNavItemClick,
                  paddingTop: index === 0 ? "var(--spacing-8)" : void 0
                },
                (_a2 = section.title) != null ? _a2 : `settings-${index}`
              );
            })
          ] }),
          showFooterProductToggle && products && activeProductId && !isCollapsed ? /* @__PURE__ */ jsx(
            SidebarProductFooterToggle,
            {
              products,
              activeProductId,
              onProductChange
            }
          ) : null,
          userFooterPanel && !isCollapsed ? /* @__PURE__ */ jsx("div", { className: "shrink-0 border-t border-sidebar-border px-[var(--spacing-16)] py-3", children: userFooterPanel }) : null,
          hasFooterAccounts && /* @__PURE__ */ jsx(
            SidebarUserBar,
            {
              user,
              collapsed: isCollapsed,
              accounts: footerAccounts,
              activeAccountId: activeFooterAccountId,
              onAccountChange: onFooterAccountChange,
              onLogOut,
              anchorAtFooter: true,
              userFooterTrailing,
              userFooterTrailingInteractive
            }
          ),
          showFooterUserOnlyChip && /* @__PURE__ */ jsx(
            SidebarUserBar,
            {
              user,
              collapsed: isCollapsed,
              onLogOut,
              anchorAtFooter: true,
              userFooterTrailing,
              userFooterTrailingInteractive
            }
          )
        ] })
      ]
    }
  );
}

export { SIDEBAR_WIDTH, Sidebar, ToolboxCondensedMark };
//# sourceMappingURL=sidebar.js.map
//# sourceMappingURL=sidebar.js.map