@mastra/playground-ui 61.0.0-alpha.6 → 61.0.0

package/dist/main-sidebar-link-active-JtKNF9hx.js

@@ -1,781 +0,0 @@
-import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import { MenuIcon, ChevronRightIcon, PanelLeftIcon } from 'lucide-react';
-import { focusRing, controlStateColorTransition } from './primitives/transitions.es.js';
-import { quietTextHover, quietTextHoverInGroup } from './primitives/typography.es.js';
-import { c as cn } from './cn-65Adrsfj.js';
-import { S as ScrollArea, a as ScrollAreaViewport } from './scroll-area-CfoN8Hpp.js';
-import React__default, { useRef, useEffect, useCallback } from 'react';
-import { c as cva } from './index-Dubp6Qv4.js';
-import { controlHeight } from './primitives/control-size.es.js';
-import { surfaceStateLayerStyle, surfaceGroupStateLayerStyle, overlaySurfaceStyle } from './primitives/raised-surface.es.js';
-import { VisuallyHidden } from '@radix-ui/react-visually-hidden';
-import { T as Tooltip, c as TooltipTrigger, a as TooltipContent } from './tooltip-DsQPiynb.js';
-import { D as Drawer, d as DrawerContent, c as DrawerClose, o as DrawerTitle, e as DrawerDescription } from './drawer-BI3B_krl.js';
-import { ResizeHandleIndicator } from './primitives/resize-handle-indicator.es.js';
-import { K as Kbd } from './kbd-BDVTQHD_.js';
-
-const MainSidebarContext = React__default.createContext(null);
-const MobileDrawerContext = React__default.createContext(null);
-function useMaybeSidebarState() {
-  return React__default.useContext(MainSidebarContext);
-}
-function useMainSidebar() {
-  const ctx = React__default.useContext(MainSidebarContext);
-  const drawer = React__default.useContext(MobileDrawerContext);
-  if (!ctx || !drawer) {
-    throw new Error("useMainSidebar must be used within a MainSidebarProvider.");
-  }
-  return { ...ctx, ...drawer };
-}
-function useMaybeSidebar() {
-  const ctx = React__default.useContext(MainSidebarContext);
-  const drawer = React__default.useContext(MobileDrawerContext);
-  if (!ctx || !drawer) return null;
-  return { ...ctx, ...drawer };
-}
-function useMobileDrawer() {
-  const drawer = React__default.useContext(MobileDrawerContext);
-  if (!drawer) throw new Error("useMobileDrawer must be used within a MainSidebarProvider.");
-  return drawer;
-}
-
-function MainSidebarMobileTrigger({
-  className,
-  icon,
-  "aria-label": ariaLabel = "Open navigation menu",
-  onClick,
-  ...props
-}) {
-  const { isMobile, mobileTriggerRef, setOpenMobile } = useMainSidebar();
-  return /* @__PURE__ */ jsx(
-    "button",
-    {
-      ref: mobileTriggerRef,
-      type: "button",
-      "aria-label": ariaLabel,
-      "aria-hidden": !isMobile,
-      tabIndex: isMobile ? 0 : -1,
-      "data-mobile-only": true,
-      ...props,
-      onClick: (event) => {
-        onClick?.(event);
-        if (!event.defaultPrevented) setOpenMobile(true);
-      },
-      className: cn(
-        "inline-flex size-10 items-center justify-center rounded-md",
-        // compound selector, not `in-*` — its `:where()` ties with a consumer's later `.inline-flex`
-        "[[data-sidebar-mobile='false']_&]:hidden",
-        "[[data-sidebar-mobile-present='true']_&]:invisible",
-        quietTextHover,
-        "hover:bg-fill-subtle",
-        focusRing,
-        className
-      ),
-      children: icon ?? /* @__PURE__ */ jsx(MenuIcon, { className: "size-5" })
-    }
-  );
-}
-
-function MainSidebarNav({
-  "aria-label": ariaLabel = "Main",
-  children,
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx("nav", { "aria-label": ariaLabel, className: cn("flex min-h-0 flex-1 flex-col", className), ...props, children: /* @__PURE__ */ jsx(ScrollArea, { className: "min-h-0 flex-1", mask: { top: "3rem", bottom: "5rem" }, children: /* @__PURE__ */ jsx(ScrollAreaViewport, { className: "px-0.5", children }) }) });
-}
-
-function MainSidebarNavLabel({ children, className, state: stateProp, ...rest }) {
-  const ctx = useMaybeSidebarState();
-  const state = stateProp ?? ctx?.state ?? "default";
-  if (state === "collapsed") {
-    return /* @__PURE__ */ jsx(VisuallyHidden, { children });
-  }
-  return /* @__PURE__ */ jsx("span", { ...rest, className: cn("min-w-0 flex-1 truncate text-left", className), children });
-}
-
-const navItemVariants = cva("flex min-w-0 cursor-pointer items-center rounded-lg text-label whitespace-nowrap", {
-  variants: {
-    size: {
-      sm: controlHeight.sm,
-      md: controlHeight.md,
-      lg: controlHeight.lg
-    }
-  },
-  defaultVariants: {
-    size: "md"
-  }
-});
-const nestedExpandedItemClasses = (level) => {
-  if (level <= 0) return "gap-2 py-1 px-3";
-  if (level === 1) return `gap-2 py-1 pr-3 pl-8 ${controlHeight.md}`;
-  if (level === 2) return `gap-2 py-1 pr-3 pl-10 ${controlHeight.md}`;
-  return `gap-2 py-1 pr-3 pl-12 ${controlHeight.md}`;
-};
-const idleSurface = cn("rounded-lg text-muted-foreground hover:text-foreground", surfaceStateLayerStyle);
-const activeSurface = "bg-fill text-foreground";
-const featuredSurface = cn(
-  "my-2 border border-transparent bg-brand-green text-black hover:text-black hover:brightness-95"
-);
-const navRowSurfaceClasses = ({ isActive, isFeatured }) => cn(idleSurface, isActive && activeSurface, isFeatured && featuredSurface);
-const navItemLayoutClasses = ({ isCollapsed, level = 0, size }) => cn(
-  navItemVariants({ size }),
-  "w-full justify-start",
-  controlStateColorTransition,
-  "[&_svg]:size-4 [&_svg]:shrink-0",
-  focusRing,
-  !isCollapsed && nestedExpandedItemClasses(level),
-  isCollapsed && "gap-0 px-[13.5px] py-0"
-);
-const navItemClasses = ({ isActive, isCollapsed, isFeatured, level, size } = {}) => cn(navItemLayoutClasses({ isCollapsed, level, size }), navRowSurfaceClasses({ isActive, isFeatured }));
-
-function MainSidebarNavLink({
-  link,
-  state: stateProp,
-  children,
-  isActive,
-  size,
-  render,
-  action,
-  className,
-  LinkComponent: LinkProp,
-  level: levelProp,
-  subItems,
-  asChild = false,
-  ...props
-}) {
-  if (render && asChild) {
-    throw new Error("MainSidebarNavLink accepts either `render` or `asChild`, not both.");
-  }
-  const ctx = useMaybeSidebarState();
-  const state = stateProp ?? ctx?.state ?? "default";
-  const Link = LinkProp ?? ctx?.LinkComponent ?? "a";
-  const isCollapsed = state === "collapsed";
-  const isFeatured = link?.variant === "featured";
-  const level = levelProp ?? (link?.indent ? 1 : 0);
-  const rowAction = isCollapsed ? void 0 : action;
-  const itemClassName = rowAction ? cn(navItemLayoutClasses({ level, size }), "flex-1 pr-1") : cn(navItemClasses({ isActive, isCollapsed, isFeatured, level, size }), link?.opensView && !isCollapsed && "pr-1");
-  return /* @__PURE__ */ jsxs("li", { ...props, className: cn("relative flex min-w-0 flex-col", className), children: [
-    /* @__PURE__ */ jsx(NavRowBody, { action: rowAction, surfaceClassName: navRowSurfaceClasses({ isActive, isFeatured }), children: /* @__PURE__ */ jsx(NavRowTooltip, { label: navTooltipLabel(link, isCollapsed), children: navInteractiveRow({ render, asChild, children, link, state, Link, isActive, className: itemClassName }) }) }),
-    !isCollapsed && subItems
-  ] });
-}
-function navInteractiveRow({
-  render,
-  asChild,
-  children,
-  link,
-  state,
-  Link,
-  isActive,
-  className
-}) {
-  const current = isActive ? "page" : void 0;
-  const caret = link?.opensView && state !== "collapsed" ? /* @__PURE__ */ jsx(ChevronRightIcon, { "aria-hidden": "true", className: "!size-3.5" }) : null;
-  if (render || asChild) {
-    const slotted = render ?? children;
-    if (!React__default.isValidElement(slotted)) {
-      throw new Error(
-        "MainSidebarNavLink requires a valid React element child when `asChild` is true so it can apply `SlottedNavChildProps` and merge `itemClassName`."
-      );
-    }
-    return React__default.cloneElement(slotted, {
-      className: cn(className, slotted.props.className),
-      "aria-current": current,
-      children: /* @__PURE__ */ jsxs(Fragment, { children: [
-        slotted.props.children,
-        caret
-      ] })
-    });
-  }
-  if (!link) return children;
-  const externalParams = /^(https?:)?\/\//.test(link.url) ? { target: "_blank", rel: "noreferrer" } : {};
-  return /* @__PURE__ */ jsxs(Link, { href: link.url, ...externalParams, "aria-current": current, className, children: [
-    link.icon,
-    /* @__PURE__ */ jsx(MainSidebarNavLabel, { state, children: link.name }),
-    children,
-    caret
-  ] });
-}
-function navTooltipLabel(link, isCollapsed) {
-  if (!link) return void 0;
-  if (link.tooltipMsg) return isCollapsed ? `${link.name} | ${link.tooltipMsg}` : link.tooltipMsg;
-  return isCollapsed ? link.name : void 0;
-}
-function NavRowTooltip({ label, children }) {
-  if (!React__default.isValidElement(children)) return children;
-  return /* @__PURE__ */ jsxs(Tooltip, { disabled: !label, children: [
-    /* @__PURE__ */ jsx(TooltipTrigger, { render: children }),
-    label ? /* @__PURE__ */ jsx(TooltipContent, { side: "right", align: "center", sideOffset: 16, children: label }) : null
-  ] });
-}
-function NavRowBody({
-  action,
-  surfaceClassName,
-  children
-}) {
-  if (!action) return children;
-  return /* @__PURE__ */ jsxs("div", { className: cn("flex min-w-0 items-center pr-1", surfaceClassName), children: [
-    children,
-    action
-  ] });
-}
-
-function MainSidebarNavList({ className, children, ...props }) {
-  return /* @__PURE__ */ jsx("ul", { className: cn("grid grid-cols-[minmax(0,1fr)] content-center items-start gap-0.5", className), ...props, children });
-}
-
-function MainSidebarNavSection({ className, children, ...props }) {
-  return /* @__PURE__ */ jsx("section", { className: cn("relative grid grid-cols-[minmax(0,1fr)] content-center items-start", className), ...props, children });
-}
-
-function MainSidebarNavSeparator({ className, ...props }) {
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      role: "separator",
-      "aria-orientation": "horizontal",
-      className: cn(
-        "relative min-h-5",
-        '[&:after]:absolute [&:after]:inset-x-3 [&:after]:top-1/2 [&:after]:block [&:after]:h-0 [&:after]:border-t [&:after]:border-border [&:after]:content-[""]',
-        className
-      ),
-      ...props
-    }
-  );
-}
-
-const KEYBOARD_STEP = 10;
-const DRAG_THRESHOLD = 5;
-function MainSidebarRoot({ children, className, mobileMode = "drawer" }) {
-  const {
-    state,
-    width,
-    minWidth,
-    maxWidth,
-    collapseBelow,
-    collapsedWidth,
-    isMobile,
-    openMobile,
-    mobileTriggerRef,
-    setOpenMobile,
-    setMobileDrawerPresent,
-    setWidth,
-    collapse,
-    expand,
-    commit,
-    toggleSidebar,
-    setGestureActive
-  } = useMainSidebar();
-  const isCollapsed = state === "collapsed";
-  const isHidden = isCollapsed && collapsedWidth === 0;
-  const draggedRef = useRef(false);
-  const dragCleanupRef = useRef(null);
-  useEffect(() => {
-    return () => {
-      dragCleanupRef.current?.();
-      dragCleanupRef.current = null;
-    };
-  }, []);
-  const onPointerDown = useCallback(
-    (event) => {
-      if (event.button !== 0) return;
-      event.preventDefault();
-      draggedRef.current = false;
-      setGestureActive(true);
-      const startX = event.clientX;
-      const handle = event.currentTarget;
-      const pointerId = event.pointerId;
-      try {
-        handle.setPointerCapture(pointerId);
-      } catch {
-      }
-      const sidebarEl = handle.parentElement;
-      const sidebarLeft = sidebarEl ? sidebarEl.getBoundingClientRect().left : 0;
-      const prevCursor = document.body.style.cursor;
-      const prevUserSelect = document.body.style.userSelect;
-      const onMove = (ev) => {
-        if (ev.pointerId !== pointerId) return;
-        const dx = ev.clientX - startX;
-        if (!draggedRef.current) {
-          if (Math.abs(dx) <= DRAG_THRESHOLD) return;
-          draggedRef.current = true;
-          document.body.style.cursor = "col-resize";
-          document.body.style.userSelect = "none";
-        }
-        const cursorWidth = ev.clientX - sidebarLeft;
-        if (collapseBelow > 0 && cursorWidth < collapseBelow) {
-          collapse();
-          return;
-        }
-        expand();
-        setWidth(cursorWidth);
-      };
-      const cleanup = (ev) => {
-        if (ev && ev.pointerId !== pointerId) return;
-        window.removeEventListener("pointermove", onMove);
-        window.removeEventListener("pointerup", cleanup);
-        window.removeEventListener("pointercancel", cleanup);
-        document.body.style.cursor = prevCursor;
-        document.body.style.userSelect = prevUserSelect;
-        setGestureActive(false);
-        commit();
-        dragCleanupRef.current = null;
-      };
-      dragCleanupRef.current = () => cleanup();
-      window.addEventListener("pointermove", onMove);
-      window.addEventListener("pointerup", cleanup);
-      window.addEventListener("pointercancel", cleanup);
-    },
-    [collapseBelow, setWidth, expand, collapse, commit, setGestureActive]
-  );
-  const onClick = useCallback(() => {
-    if (draggedRef.current) {
-      draggedRef.current = false;
-      return;
-    }
-    toggleSidebar();
-  }, [toggleSidebar]);
-  const onKeyDown = useCallback(
-    (event) => {
-      switch (event.key) {
-        case "Enter":
-        case " ": {
-          event.preventDefault();
-          toggleSidebar();
-          return;
-        }
-        case "ArrowLeft": {
-          event.preventDefault();
-          if (isCollapsed) return;
-          setWidth(width - KEYBOARD_STEP);
-          commit();
-          return;
-        }
-        case "ArrowRight": {
-          event.preventDefault();
-          if (isCollapsed) {
-            expand();
-            commit();
-            return;
-          }
-          setWidth(width + KEYBOARD_STEP);
-          commit();
-          return;
-        }
-        case "Home": {
-          event.preventDefault();
-          expand();
-          setWidth(minWidth);
-          commit();
-          return;
-        }
-        case "End": {
-          event.preventDefault();
-          expand();
-          setWidth(maxWidth);
-          commit();
-          return;
-        }
-      }
-    },
-    [isCollapsed, width, minWidth, maxWidth, setWidth, expand, commit, toggleSidebar]
-  );
-  const closeOnAnchor = useCallback(
-    (event) => {
-      if (!(event.target instanceof Element)) return;
-      const anchor = event.target.closest("a");
-      if (!anchor || !anchor.hasAttribute("href")) return;
-      if (event.button !== 0 || event.metaKey || event.ctrlKey || event.shiftKey || event.altKey) return;
-      if (anchor.target === "_blank" || anchor.hasAttribute("download")) return;
-      setOpenMobile(false);
-    },
-    [setOpenMobile]
-  );
-  if (isMobile) {
-    return /* @__PURE__ */ jsx(
-      Drawer,
-      {
-        side: "left",
-        open: openMobile,
-        onOpenChange: setOpenMobile,
-        onOpenChangeComplete: (open) => {
-          if (!open) setMobileDrawerPresent(false);
-        },
-        children: /* @__PURE__ */ jsxs(
-          DrawerContent,
-          {
-            "data-mobile-mode": mobileMode,
-            finalFocus: mobileTriggerRef,
-            showCloseButton: mobileMode === "drawer",
-            className: cn(
-              "border-0 bg-sidebar text-foreground",
-              mobileMode === "takeover" ? "w-[calc(100%-3.5rem)] max-w-none overflow-visible rounded-l-none rounded-r-3xl pt-[env(safe-area-inset-top)] pb-[env(safe-area-inset-bottom)]" : "w-3/4 max-w-(--sidebar-width-mobile) overflow-hidden rounded-none",
-              className
-            ),
-            children: [
-              mobileMode === "takeover" ? /* @__PURE__ */ jsx(DrawerClose, { asChild: true, children: /* @__PURE__ */ jsx(
-                "button",
-                {
-                  type: "button",
-                  "aria-label": "Close",
-                  className: "group absolute top-2 -right-12 z-10 inline-flex size-11 touch-manipulation items-center justify-center transition-opacity duration-fast group-data-[ending-style]/popup:opacity-0 focus-visible:outline-hidden motion-reduce:duration-0",
-                  children: /* @__PURE__ */ jsx(
-                    "span",
-                    {
-                      className: cn(
-                        overlaySurfaceStyle,
-                        quietTextHoverInGroup,
-                        surfaceGroupStateLayerStyle,
-                        "inline-flex size-9 items-center justify-center rounded-full backdrop-blur-sm group-focus-visible:ring-1 group-focus-visible:ring-border-focus"
-                      ),
-                      children: /* @__PURE__ */ jsx(MenuIcon, { className: "size-4" })
-                    }
-                  )
-                }
-              ) }) : null,
-              /* @__PURE__ */ jsx(VisuallyHidden, { asChild: true, children: /* @__PURE__ */ jsx(DrawerTitle, { children: "Navigation" }) }),
-              /* @__PURE__ */ jsx(VisuallyHidden, { asChild: true, children: /* @__PURE__ */ jsx(DrawerDescription, { children: "Primary site navigation drawer" }) }),
-              /* @__PURE__ */ jsx(
-                "div",
-                {
-                  onClick: closeOnAnchor,
-                  className: cn(
-                    "flex h-full min-h-0 flex-col overflow-hidden py-2",
-                    mobileMode === "takeover" ? "px-4" : "px-3"
-                  ),
-                  children
-                }
-              )
-            ]
-          }
-        )
-      }
-    );
-  }
-  const currentWidth = isCollapsed ? collapsedWidth : width;
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      className: cn(
-        "sidebar-layout group/sidebar t-resize relative min-h-0 shrink-0 self-stretch bg-sidebar text-foreground",
-        "w-(--sidebar-width)",
-        "in-data-[sidebar-gesture=active]:transition-none",
-        className,
-        isHidden && "border-r-0 border-transparent"
-      ),
-      children: [
-        /* @__PURE__ */ jsx(
-          "div",
-          {
-            className: cn(
-              "flex h-full min-h-0 flex-col overflow-hidden",
-              "transition-opacity duration-200 motion-reduce:transition-none",
-              "px-2",
-              isHidden && "pointer-events-none px-0 opacity-0"
-            ),
-            children
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          "div",
-          {
-            role: "separator",
-            "aria-orientation": "vertical",
-            "aria-valuenow": isCollapsed ? void 0 : currentWidth,
-            "aria-valuemin": isCollapsed ? void 0 : minWidth,
-            "aria-valuemax": isCollapsed ? void 0 : maxWidth,
-            "aria-valuetext": isCollapsed ? "collapsed" : `${currentWidth} pixels`,
-            "aria-label": `Resize sidebar. Arrow keys to resize, Enter to ${isCollapsed ? "expand" : "collapse"}.`,
-            tabIndex: 0,
-            onPointerDown,
-            onClick,
-            onKeyDown,
-            className: cn(
-              "group absolute top-0 -right-1 z-10 h-full w-2 cursor-col-resize touch-none",
-              "flex items-center justify-center",
-              "focus-visible:outline-hidden"
-            ),
-            children: /* @__PURE__ */ jsx(
-              ResizeHandleIndicator,
-              {
-                className: cn(
-                  "via-foreground/30 group-hover:opacity-100",
-                  "group-focus-visible:via-border-focus group-focus-visible:opacity-100",
-                  "in-data-[sidebar-gesture=active]:via-foreground/45 in-data-[sidebar-gesture=active]:opacity-100"
-                )
-              }
-            )
-          }
-        )
-      ]
-    }
-  );
-}
-
-function MainSidebarTrigger({ className, onClick, ...props }) {
-  const { desktopState, toggleSidebar } = useMainSidebar();
-  const isCollapsed = desktopState === "collapsed";
-  return /* @__PURE__ */ jsxs(Tooltip, { children: [
-    /* @__PURE__ */ jsx(
-      TooltipTrigger,
-      {
-        render: /* @__PURE__ */ jsx(
-          "button",
-          {
-            type: "button",
-            "aria-label": "Toggle sidebar",
-            "aria-expanded": !isCollapsed,
-            ...props,
-            onClick: (event) => {
-              onClick?.(event);
-              if (!event.defaultPrevented) toggleSidebar();
-            },
-            className: cn(
-              "flex items-center justify-center rounded-md text-muted-foreground",
-              "size-7",
-              !isCollapsed && "ml-auto",
-              "hover:bg-fill-subtle hover:text-foreground",
-              "transition-colors duration-normal ease-out-custom motion-reduce:transition-none",
-              focusRing,
-              "[&_svg]:size-4 [&_svg]:text-muted-foreground [&:hover_svg]:text-foreground",
-              className
-            ),
-            children: /* @__PURE__ */ jsx(PanelLeftIcon, {})
-          }
-        )
-      }
-    ),
-    /* @__PURE__ */ jsx(TooltipContent, { children: /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-1.5", children: [
-      "Toggle Sidebar",
-      /* @__PURE__ */ jsx(Kbd, { size: "xs", className: "bg-muted text-muted-foreground", children: "[" })
-    ] }) })
-  ] });
-}
-
-const SIDEBAR_STATE_KEY = "sidebar:state";
-const SIDEBAR_WIDTH_KEY = "sidebar:width";
-const SIDEBAR_WIDTH_VAR = "--sidebar-width";
-const clamp = (v, lo, hi) => Math.min(hi, Math.max(lo, v));
-const useIsoLayoutEffect = typeof window !== "undefined" ? React__default.useLayoutEffect : React__default.useEffect;
-function MainSidebarProvider({
-  children,
-  defaultState = "default",
-  defaultWidth = 240,
-  minWidth = 200,
-  maxWidth = 480,
-  collapseBelow,
-  collapsedWidth = 64,
-  disableKeyboardShortcut = true,
-  storageKey,
-  mobileBreakpoint = 1024,
-  mobileWidth = 360,
-  LinkComponent
-}) {
-  const safeMin = Math.max(0, Math.min(minWidth, maxWidth));
-  const safeMax = Math.max(safeMin, maxWidth);
-  const safeCollapsed = Math.max(0, Math.min(collapsedWidth, safeMax));
-  const safeDefault = clamp(defaultWidth, safeMin, safeMax);
-  const safeCollapseBelow = collapseBelow ?? safeMin;
-  const stateStorageKey = storageKey ? `${storageKey}:${SIDEBAR_STATE_KEY}` : SIDEBAR_STATE_KEY;
-  const widthStorageKey = storageKey ? `${storageKey}:${SIDEBAR_WIDTH_KEY}` : SIDEBAR_WIDTH_KEY;
-  const readInitial = () => {
-    if (typeof window === "undefined") return { state: defaultState, width: safeDefault };
-    try {
-      let nextState = defaultState;
-      let nextWidth = safeDefault;
-      const storedState = window.localStorage.getItem(stateStorageKey);
-      if (storedState === "collapsed" || storedState === "default") nextState = storedState;
-      const storedWidth = window.localStorage.getItem(widthStorageKey);
-      if (storedWidth !== null) {
-        const parsed = Number(storedWidth);
-        if (Number.isFinite(parsed)) nextWidth = clamp(parsed, safeMin, safeMax);
-      }
-      return { state: nextState, width: nextWidth };
-    } catch {
-      return { state: defaultState, width: safeDefault };
-    }
-  };
-  const initialRef = React__default.useRef(null);
-  if (initialRef.current === null) initialRef.current = readInitial();
-  const initial = initialRef.current;
-  const [state, setState] = React__default.useState(initial.state);
-  const [width, setWidthState] = React__default.useState(initial.width);
-  const [isMobile, setIsMobile] = React__default.useState(false);
-  const [openMobile, setOpenMobileState] = React__default.useState(false);
-  const [mobileDrawerPresent, setMobileDrawerPresent] = React__default.useState(false);
-  const openMobileRef = React__default.useRef(false);
-  const mobileTriggerRef = React__default.useRef(null);
-  const widthRef = React__default.useRef(initial.width);
-  const stateRef = React__default.useRef(initial.state);
-  stateRef.current = state;
-  const scopeRef = React__default.useRef(null);
-  React__default.useEffect(() => {
-    if (typeof window === "undefined") return;
-    const mq = window.matchMedia(`(max-width: ${mobileBreakpoint - 1}px)`);
-    const update = () => setIsMobile(mq.matches);
-    update();
-    mq.addEventListener("change", update);
-    return () => mq.removeEventListener("change", update);
-  }, [mobileBreakpoint]);
-  const setOpenMobile = React__default.useCallback((open) => {
-    openMobileRef.current = open;
-    if (open) setMobileDrawerPresent(true);
-    setOpenMobileState(open);
-  }, []);
-  React__default.useEffect(() => {
-    if (!isMobile && openMobile) {
-      setOpenMobile(false);
-      setMobileDrawerPresent(false);
-    }
-  }, [isMobile, openMobile, setOpenMobile]);
-  const writeCssVar = React__default.useCallback((px) => {
-    const el = scopeRef.current;
-    if (el) el.style.setProperty(SIDEBAR_WIDTH_VAR, `${px}px`);
-  }, []);
-  useIsoLayoutEffect(() => {
-    writeCssVar(state === "collapsed" ? safeCollapsed : widthRef.current);
-  }, [state, safeCollapsed, writeCssVar]);
-  const persistState = React__default.useCallback(
-    (next) => {
-      try {
-        window.localStorage.setItem(stateStorageKey, next);
-      } catch {
-      }
-    },
-    [stateStorageKey]
-  );
-  const toggleSidebar = React__default.useCallback(() => {
-    if (isMobile) {
-      setOpenMobile(!openMobileRef.current);
-      return;
-    }
-    setState((prev) => {
-      const next = prev === "default" ? "collapsed" : "default";
-      stateRef.current = next;
-      persistState(next);
-      return next;
-    });
-  }, [isMobile, persistState, setOpenMobile]);
-  const setWidth = React__default.useCallback(
-    (next) => {
-      const clamped = clamp(next, safeMin, safeMax);
-      widthRef.current = clamped;
-      writeCssVar(clamped);
-    },
-    [safeMin, safeMax, writeCssVar]
-  );
-  const collapse = React__default.useCallback(() => {
-    stateRef.current = "collapsed";
-    persistState("collapsed");
-    setState("collapsed");
-  }, [persistState]);
-  const expand = React__default.useCallback(() => {
-    stateRef.current = "default";
-    persistState("default");
-    setState("default");
-  }, [persistState]);
-  const commit = React__default.useCallback(() => {
-    setWidthState(widthRef.current);
-    try {
-      window.localStorage.setItem(stateStorageKey, stateRef.current);
-      window.localStorage.setItem(widthStorageKey, String(widthRef.current));
-    } catch {
-    }
-  }, [stateStorageKey, widthStorageKey]);
-  const setGestureActive = React__default.useCallback((active) => {
-    const el = scopeRef.current;
-    if (!el) return;
-    if (active) el.setAttribute("data-sidebar-gesture", "active");
-    else el.removeAttribute("data-sidebar-gesture");
-  }, []);
-  React__default.useEffect(() => {
-    if (disableKeyboardShortcut) return;
-    const onKeyDown = (ev) => {
-      if (ev.code !== "KeyB") return;
-      if (!(ev.metaKey || ev.ctrlKey)) return;
-      if (ev.altKey || ev.shiftKey) return;
-      if (ev.target instanceof HTMLElement) {
-        const tag = ev.target.tagName;
-        if (tag === "INPUT" || tag === "TEXTAREA" || tag === "SELECT") return;
-        if (ev.target.isContentEditable) return;
-      }
-      ev.preventDefault();
-      toggleSidebar();
-    };
-    window.addEventListener("keydown", onKeyDown);
-    return () => window.removeEventListener("keydown", onKeyDown);
-  }, [disableKeyboardShortcut, toggleSidebar]);
-  const effectiveState = isMobile ? "default" : state;
-  const contextValue = React__default.useMemo(
-    () => ({
-      state: effectiveState,
-      desktopState: state,
-      width,
-      minWidth: safeMin,
-      maxWidth: safeMax,
-      collapseBelow: safeCollapseBelow,
-      collapsedWidth: safeCollapsed,
-      isMobile,
-      toggleSidebar,
-      setWidth,
-      collapse,
-      expand,
-      commit,
-      setGestureActive,
-      LinkComponent
-    }),
-    [
-      effectiveState,
-      state,
-      width,
-      safeMin,
-      safeMax,
-      safeCollapseBelow,
-      safeCollapsed,
-      isMobile,
-      toggleSidebar,
-      setWidth,
-      collapse,
-      expand,
-      commit,
-      setGestureActive,
-      LinkComponent
-    ]
-  );
-  const drawerValue = React__default.useMemo(
-    () => ({ openMobile, mobileTriggerRef, setOpenMobile, setMobileDrawerPresent }),
-    [openMobile, setOpenMobile]
-  );
-  const scopeStyle = {
-    [SIDEBAR_WIDTH_VAR]: `${initial.state === "collapsed" ? safeCollapsed : initial.width}px`,
-    "--sidebar-width-mobile": `${mobileWidth}px`,
-    display: "contents"
-  };
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      ref: scopeRef,
-      "data-sidebar-scope": true,
-      "data-sidebar-state": state,
-      "data-sidebar-mobile": isMobile ? "true" : "false",
-      "data-sidebar-mobile-present": mobileDrawerPresent ? "true" : "false",
-      style: scopeStyle,
-      suppressHydrationWarning: true,
-      children: /* @__PURE__ */ jsx(MainSidebarContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx(MobileDrawerContext.Provider, { value: drawerValue, children }) })
-    }
-  );
-}
-
-function getIsLinkActive(link, pathname, siblings = []) {
-  const matches = (url) => pathname === url || pathname.startsWith(url + "/");
-  const flattenLinks = (links) => links.flatMap((item) => [item, ...flattenLinks(item.children ?? [])]);
-  if (!matches(link.url)) return false;
-  const competingLinks = [...flattenLinks(link.children ?? []), ...flattenLinks(siblings)];
-  return !competingLinks.some(
-    (other) => other.url !== link.url && other.url.length > link.url.length && matches(other.url)
-  );
-}
-
-export { MainSidebarNavSection as M, MainSidebarNavSeparator as a, MainSidebarNavList as b, MainSidebarNavLink as c, MainSidebarRoot as d, MainSidebarMobileTrigger as e, MainSidebarTrigger as f, MainSidebarNavLabel as g, MainSidebarNav as h, MainSidebarProvider as i, getIsLinkActive as j, useMainSidebar as k, useMaybeSidebar as l, useMobileDrawer as m, navItemClasses as n, useMaybeSidebarState as u };
-//# sourceMappingURL=main-sidebar-link-active-JtKNF9hx.js.map