50:I[707087,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"RegistryDependencies"] 51:I[314491,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"FilesView"] 52:T843d,"use client" import * as React from "react" import { mergeProps } from "@base-ui/react/merge-props" import { Separator as SeparatorPrimitive } from "@base-ui/react/separator" import { useRender } from "@base-ui/react/use-render" import { IconLayoutSidebar } from "@tabler/icons-react" import { cva, type VariantProps } from "class-variance-authority" import { cn } from "cn" import { useComposedRef } from "@/hooks/use-composed-ref" import { matchesHotkey } from "@/lib/hotkey" import { Button } from "@/components/ui/button" import { Input } from "@/components/ui/input" import { Sheet, SheetContent, SheetHeader, SheetTitle, } from "@/components/ui/sheet" import { Skeleton } from "@/components/ui/skeleton" import { createTooltipHandle, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, type TooltipContentProps, } from "@/components/ui/tooltip" type ClassName = string | ((state: State) => string | undefined) | undefined function mergeClassName(base: string, className: ClassName) { return typeof className === "function" ? (state: State) => cn(base, className(state)) : cn(base, className) } const SIDEBAR_KEYBOARD_SHORTCUT = "mod+b" const mobileQuery = "(max-width: 767px)" function subscribeMobile(onChange: () => void) { if (typeof window.matchMedia !== "function") { return () => {} } const media = window.matchMedia(mobileQuery) media.addEventListener("change", onChange) return () => media.removeEventListener("change", onChange) } function getMobile() { return typeof window.matchMedia === "function" ? window.matchMedia(mobileQuery).matches : false } function useIsMobile() { return React.useSyncExternalStore(subscribeMobile, getMobile, () => false) } const shortcutOwners = new Map() function focusOwnsShortcut(wrapper: Element, shortcut: string) { const focused = document.activeElement let owner = focused instanceof Element ? focused.closest("[data-slot=sidebar-wrapper]") : null while (owner) { if (shortcutOwners.get(owner) === shortcut) { return owner === wrapper } owner = owner.parentElement?.closest("[data-slot=sidebar-wrapper]") ?? null } return true } function isEditable(target: EventTarget | null) { return target instanceof HTMLElement && target.isContentEditable } type SidebarState = "expanded" | "collapsed" type SidebarContextProps = { state: SidebarState open: boolean setOpen: (open: boolean | ((open: boolean) => boolean)) => void openMobile: boolean setOpenMobile: (open: boolean | ((open: boolean) => boolean)) => void isMobile: boolean toggleSidebar: () => void } const SidebarContext = React.createContext(null) const SidebarWrapperContext = React.createContext<{ sidebarId: string wrapperRef: React.RefObject returnFocusRef: React.RefObject } | null>(null) const SidebarTooltipContext = React.createContext > | null>(null) function useSidebar() { const context = React.useContext(SidebarContext) if (!context) { throw new Error("useSidebar must be used within a SidebarProvider.") } return context } function useSidebarWrapper() { const context = React.useContext(SidebarWrapperContext) if (!context) { throw new Error("Sidebar must be used within a SidebarProvider.") } return context } type SidebarProviderProps = React.ComponentProps<"div"> & { defaultOpen?: boolean open?: boolean onOpenChange?: (open: boolean) => void keyboardShortcut?: string | null } function SidebarProvider({ defaultOpen = true, open: openProp, onOpenChange, keyboardShortcut = SIDEBAR_KEYBOARD_SHORTCUT, className, children, ref, ...props }: SidebarProviderProps) { const isMobile = useIsMobile() const sidebarId = React.useId() const [wrapperRef, setWrapperRef] = useComposedRef(ref) const [openMobile, setOpenMobileState] = React.useState(false) const [wasMobile, setWasMobile] = React.useState(isMobile) if (isMobile !== wasMobile) { setWasMobile(isMobile) if (!isMobile) { setOpenMobileState(false) } } const [uncontrolledOpen, setUncontrolledOpen] = React.useState(defaultOpen) const open = openProp ?? uncontrolledOpen const openRef = React.useRef(open) const controlledRef = React.useRef(openProp !== undefined) const onOpenChangeRef = React.useRef(onOpenChange) React.useLayoutEffect(() => { openRef.current = open controlledRef.current = openProp !== undefined onOpenChangeRef.current = onOpenChange }) const setOpen = React.useCallback( (value: boolean | ((open: boolean) => boolean)) => { const next = typeof value === "function" ? value(openRef.current) : value if (next === openRef.current) { return } openRef.current = next if (!controlledRef.current) { setUncontrolledOpen(next) } onOpenChangeRef.current?.(next) }, [] ) const returnFocusRef = React.useRef(null) const setOpenMobile = React.useCallback( (value: boolean | ((open: boolean) => boolean)) => { const focused = document.activeElement if (!focused?.closest("[data-mobile=true]")) { returnFocusRef.current = focused instanceof HTMLElement && focused !== document.body ? focused : null } setOpenMobileState(value) }, [] ) const toggleSidebar = React.useCallback(() => { if (isMobile) { setOpenMobile((value) => !value) } else { setOpen((value) => !value) } }, [isMobile, setOpen, setOpenMobile]) const toggleRef = React.useRef(toggleSidebar) React.useLayoutEffect(() => { toggleRef.current = toggleSidebar }) React.useEffect(() => { const wrapper = wrapperRef.current if (!keyboardShortcut || !wrapper) { return } shortcutOwners.set(wrapper, keyboardShortcut) const handleKeyDown = (event: KeyboardEvent) => { if ( event.defaultPrevented || event.repeat || isEditable(event.target) || !matchesHotkey(event, keyboardShortcut) || !focusOwnsShortcut(wrapper, keyboardShortcut) ) { return } event.preventDefault() toggleRef.current() } window.addEventListener("keydown", handleKeyDown) return () => { window.removeEventListener("keydown", handleKeyDown) shortcutOwners.delete(wrapper) } }, [keyboardShortcut]) const state: SidebarState = open ? "expanded" : "collapsed" const contextValue = React.useMemo( () => ({ state, open, setOpen, isMobile, openMobile, setOpenMobile, toggleSidebar, }), [state, open, setOpen, isMobile, openMobile, setOpenMobile, toggleSidebar] ) const wrapperValue = React.useMemo( () => ({ sidebarId, wrapperRef, returnFocusRef }), [sidebarId] ) return (

*>[data-slot=sidebar][data-variant=inset]]:bg-sidebar has-[>[data-slot=sidebar][data-variant=inset]]:bg-sidebar", className )} {...props} > {children}

) } function SidebarTooltips({ side, children, }: { side: "left" | "right" children: React.ReactNode }) { const [handle] = React.useState(() => createTooltipHandle()) return ( {children} {({ payload }) => ( {payload as React.ReactNode} )} ) } function isLinkNavigation(event: React.MouseEvent) { if ( event.button !== 0 || event.metaKey || event.ctrlKey || event.shiftKey || event.altKey || !(event.target instanceof Element) ) { return false } const link = event.target.closest("a[href]") return ( link instanceof HTMLAnchorElement && link.getAttribute("aria-disabled") !== "true" && !link.hasAttribute("download") && (link.target === "" || link.target === "_self") ) } type SidebarProps = React.ComponentProps<"div"> & { side?: "left" | "right" variant?: "sidebar" | "floating" | "inset" | "plain" collapsible?: "offcanvas" | "icon" | "none" } function Sidebar({ side = "left", variant = "sidebar", collapsible = "offcanvas", className, children, dir, ...props }: SidebarProps) { const { isMobile, state, openMobile, setOpenMobile } = useSidebar() const { sidebarId, wrapperRef, returnFocusRef } = useSidebarWrapper() const containerRef = React.useRef(null) const hidden = collapsible === "offcanvas" && state === "collapsed" React.useLayoutEffect(() => { const container = containerRef.current const focused = document.activeElement if (!hidden || !container || !focused || !container.contains(focused)) { return } const trigger = Array.from( document.querySelectorAll("[data-slot=sidebar-trigger]") ).find((node) => node.getAttribute("aria-controls") === sidebarId) if (trigger) { trigger.focus({ preventScroll: true }) } else if (focused instanceof HTMLElement) { focused.blur() } }, [hidden, sidebarId]) const syncMobileWidth = React.useCallback( (popup: HTMLDivElement | null) => { const wrapper = wrapperRef.current if (!popup || !wrapper) { return } const width = getComputedStyle(wrapper) .getPropertyValue("--sidebar-width-mobile") .trim() popup.style.setProperty("--sidebar-width", width || "18rem") }, [wrapperRef] ) if (collapsible === "none") { return (

{children}

) } if (isMobile) { return ( setOpenMobile(open)}> { const previous = returnFocusRef.current if (previous?.isConnected) { return previous } return ( wrapperRef.current?.querySelector( "[data-slot=sidebar-trigger]" ) ?? true ) }} dir={dir} side={side} showCloseButton={false} data-sidebar="sidebar" data-slot="sidebar" data-mobile="true" className="w-[calc(var(--sidebar-width)+var(--bleed))] max-w-[calc(100%-3rem+var(--bleed))] gap-0 bg-sidebar text-sidebar-foreground" onClick={(event) => { if (isLinkNavigation(event)) { setOpenMobile(false) } }} > Sidebar

{children}

) } const detached = variant === "floating" || variant === "inset" return ( ) } function SidebarTrigger({ className, onClick, children, ...props }: React.ComponentProps) { const { toggleSidebar, open, openMobile, isMobile } = useSidebar() const { sidebarId } = useSidebarWrapper() return ( ) } function SidebarRail({ className, onClick, ...props }: React.ComponentProps<"button">) { const { toggleSidebar } = useSidebar() return (