52: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"] 53: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"] 54:T7b79,"use client"; import { blur, duration, ease, spring } from "@/lib/motion"; import { cn } from "@/lib/utils"; import { cva } from "class-variance-authority"; import { ChevronDownIcon } from "lucide-react"; import { type AnimationPlaybackControls, animate, LayoutGroup, motion, useMotionValue, useReducedMotion, } from "motion/react"; import { NavigationMenu as NavigationMenuPrimitive, Slot } from "radix-ui"; import { type ComponentProps, createContext, type Ref, type RefObject, useCallback, useContext, useEffect, useId, useLayoutEffect, useMemo, useRef, useState, } from "react"; import { createPortal } from "react-dom"; /* * Navigation Menu, built on Radix Navigation Menu (roadmap, 2026-10-16: "A top bar with rich dropdown panels"). * A nav landmark of links and disclosure buttons, each button opening a panel of links. Hover opens after a * short delay; click, Enter and Space toggle; ArrowDown opens and moves into the panel; Escape closes and hands * focus back to the trigger; Tab runs through the open panel's links. * - One highlight glides between the top-level items (layoutId on spring.snappy, scoped to each menu). It * follows the mouse, rests on the open trigger otherwise, and fades out where it was when neither applies. * - The panels share one viewport, a floating surface under the list. Moving between triggers, its width and * height glide to the next panel's size (a CSS transition on the size Radix measures, duration-base on * ease-out), while the new panel slides 12px in from the side you moved towards through the blur and the * old one slides out the other way. * - The viewport comes through the blur from the list (popover-in, from its top edge) and leaves quickly * (popover-out). An optional caret on its top edge points at the open trigger and slides along with it. * - Each trigger's chevron turns over while its panel is open (spring.snappy). * - Inside a panel, one highlight glides between the links too (the same layoutId pill, one per panel), on * hover and on keyboard focus, and fades out where it was when you leave. Opening the menu, the links rise * into place through the blur, 0.05s apart; switching panels they slide in with the panel instead. * - Nothing animates on first paint. With reduced motion everything appears and moves at once. */ /** How far a panel slides in from (and out towards) the side you moved, in px: Tabs' distance */ const SLIDE = 12; type Highlight = { /** The item the highlight sits in, or null when there's none */ item: string | null; /** False while it fades out in the item it was last in */ shown: boolean; /** * Counts appearances from nothing. Each has its own layoutId, so the highlight fades in where it appears * rather than flying over from where it last faded out. */ appearance: number; /** The first item of an appearance fades the highlight in; the items after it glide it */ fresh: boolean; }; type MenuContextValue = { /** The open item, or "" when the menu is closed */ value: string; setValue: (value: string) => void; viewport: boolean; horizontal: boolean; reduce: boolean; highlight: Highlight; /** The mouse is over an item, or has left it */ hover: (item: string) => void; unhover: (item: string) => void; /** The highlight's fade-out has finished: remove it */ settle: () => void; /** The trigger's corner radius as a number, so motion keeps the highlight's corners true as it changes width */ radius: number | undefined; setRadius: (radius: number) => void; root: RefObject; /** Each trigger by its item, for the caret */ triggers: RefObject>; /** Where the caret renders: after the viewport, so it paints over the viewport's top border */ slot: HTMLElement | null; setSlot: (node: HTMLElement | null) => void; }; const MenuContext = createContext(null); /** The item a trigger or panel belongs to */ const ItemContext = createContext(null); type PanelContextValue = { highlight: Highlight; settle: () => void; reduce: boolean; /** The mouse is over a link, or has left it */ point: (link: string) => void; unpoint: (link: string) => void; /** A link has keyboard focus, or has lost it */ focus: (link: string) => void; blur: (link: string) => void; }; /** Inside a panel, links are rows that share one gliding highlight; in the list, they look like triggers */ const PanelContext = createContext(null); /** How far the links rise into place as the menu opens, in px (the library's swap) */ const RISE = 6; /** Links come in 0.05s apart, like items in a list (motion.md) */ const STAGGER = 0.05; /** * Hands a node to our ref and to the caller's. Stable: a new callback each render would make React detach the * ref (null) and attach it again after the children's layout effects, so the caret, measuring in its own * layout effect, found no root and stayed at the menu's left edge (2026-10-21). */ function useMergedRef(own: { current: T | null }, theirs?: Ref) { return useCallback( (node: T | null) => { own.current = node; if (typeof theirs === "function") theirs(node); else if (theirs) (theirs as { current: T | null }).current = node; }, [own, theirs], ); } /** A node's left offset inside an ancestor, in layout pixels (zoom and transforms don't count) */ function offsetWithin(node: HTMLElement, ancestor: HTMLElement) { let left = 0; let current: HTMLElement | null = node; while (current && current !== ancestor) { left += current.offsetLeft; current = current.offsetParent as HTMLElement | null; } return left; } /** * Where the highlight is. `target` is the hovered item, or else the open one. A new target glides the * highlight there; none fades it out in place; back on an item while it's still fading, it glides on from there. */ function useHighlight(target: string | null, reduce: boolean) { const [highlight, setHighlight] = useState({ item: target, shown: target !== null, appearance: 0, fresh: false, }); const [last, setLast] = useState(target); // Follows the target in the same render, so the highlight never trails a frame behind the open trigger if (target !== last) { setLast(target); setHighlight((current) => { // With reduced motion there's no fade to wait for if (target === null) return reduce ? { ...current, item: null, shown: false } : { ...current, shown: false }; if (current.item === null) return { item: target, shown: true, appearance: current.appearance + 1, fresh: true }; return { ...current, item: target, shown: true, fresh: false }; }); } const settle = useCallback(() => { setHighlight((current) => (current.shown ? current : { ...current, item: null })); }, []); return { highlight, settle }; } export type NavigationMenuProps = ComponentProps & { /** * Panels open in one shared viewport under the list, which glides between their sizes. Turn it off to open * each panel under its own trigger instead. */ viewport?: boolean; }; /** * A site's navigation: a nav landmark (Radix names it "Main"; pass aria-label for another name). Holds the open * item, controlled or not, so the highlight, the panels and the caret know which one is open. */ function NavigationMenu({ value, defaultValue, onValueChange, viewport = true, orientation = "horizontal", className, children, ref, ...props }: NavigationMenuProps) { const reduce = useReducedMotion() ?? false; const [internal, setInternal] = useState(defaultValue ?? ""); const current = value ?? internal; const root = useRef(null); const setRef = useMergedRef(root, ref); const triggers = useRef(new Map()); const [slot, setSlot] = useState(null); const [radius, setRadius] = useState(); const [hovered, setHovered] = useState(null); const { highlight, settle } = useHighlight(hovered ?? (current || null), reduce); const setValue = useCallback( (next: string) => { setInternal(next); onValueChange?.(next); }, [onValueChange], ); const hover = useCallback((item: string) => setHovered(item), []); const unhover = useCallback( (item: string) => setHovered((currentItem) => (currentItem === item ? null : currentItem)), [], ); const menu = useMemo( () => ({ value: current, setValue, viewport, horizontal: orientation === "horizontal", reduce, highlight, hover, unhover, settle, radius, setRadius, root, triggers, slot, setSlot, }), [current, setValue, viewport, orientation, reduce, highlight, hover, unhover, settle, radius, slot], ); return ( {children} {viewport ? : null} ); } /** * The row of items. Its own layer, so the highlight passes behind every label as it glides. Without the * viewport the panels open inside that layer, so it rises to the popover level while one is there. */ function NavigationMenuList({ className, children, ...props }: ComponentProps) { const groupId = useId(); return ( {children} ); } /** * The highlight, inside the item that has it. Items aren't stacking contexts: it joins the list's layer (the * list is `isolate`), so it passes behind every label whichever way it glides. A fill, so it only fades. */ function ItemHighlight({ item }: { item: string }) { const menu = useContext(MenuContext); const node = useRef(null); const here = menu?.highlight.item === item; const radius = menu?.radius; const setRadius = menu?.setRadius; // Read once from the class, then motion keeps the corners true while the highlight changes width useLayoutEffect(() => { if (here && radius === undefined && node.current && setRadius) setRadius(Number.parseFloat(getComputedStyle(node.current).borderTopLeftRadius) || 0); }, [here, radius, setRadius]); if (!menu || !here) return null; const { highlight, reduce, settle } = menu; return ( { if (!highlight.shown) settle(); }} /> ); } /** One item of the list: a trigger with its panel, or a link */ function NavigationMenuItem({ className, value, children, onPointerEnter, onPointerLeave, ...props }: ComponentProps) { const menu = useContext(MenuContext); const auto = useId(); // Radix makes its own when there's none; ours is the same idea, so we know which item is open const item = value || auto; return ( { onPointerEnter?.(event); // Mouse only: on touch the highlight just marks the open trigger. Never on a disabled trigger. if (event.pointerType !== "mouse" || event.currentTarget.querySelector(":scope > [data-disabled]")) return; menu?.hover(item); }} onPointerLeave={(event) => { onPointerLeave?.(event); if (event.pointerType === "mouse") menu?.unhover(item); }} {...props} > {children} ); } /** * The look of a top-level item: a trigger, or a link in the list. Flat: the hover and open fill is the * gliding highlight, not a background of its own. Muted labels turn foreground on hover, open or current. */ const navigationMenuTriggerStyle = cva([ "relative inline-flex h-(--size-control-md) w-max cursor-pointer items-center justify-center gap-1 rounded-md px-3 text-sm font-medium whitespace-nowrap", "text-muted-foreground transition-colors duration-(--duration-fast) ease-out hover:text-foreground data-active:text-foreground data-[state=open]:text-foreground", "outline-ring focus-visible:outline-(length:--focus-ring-width) focus-visible:outline-offset-(--focus-ring-offset)", "disabled:pointer-events-none disabled:opacity-(--opacity-disabled)", "[&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-(--size-icon-md)", ]); /** The button that opens an item's panel. Its chevron turns over while the panel is open. */ function NavigationMenuTrigger({ className, children, onKeyDown, ref, ...props }: ComponentProps) { const menu = useContext(MenuContext); const item = useContext(ItemContext); const open = menu !== null && item !== null && menu.value === item; const node = useRef(null); const setRef = useMergedRef(node, ref); const entering = useRef(false); const triggers = menu?.triggers; // Known to the caret, which slides to the open trigger useLayoutEffect(() => { const trigger = node.current; const map = triggers?.current; if (!trigger || !map || item === null) return; map.set(item, trigger); return () => { if (map.get(item) === trigger) map.delete(item); }; }, [triggers, item]); // Opened with ArrowDown: once the panel is in, move into it the way Radix does for ArrowDown on an open // trigger (its own handler also gives the links back their tab order) useEffect(() => { if (!open || !entering.current) return; entering.current = false; const frame = requestAnimationFrame(() => node.current?.dispatchEvent(new KeyboardEvent("keydown", { key: "ArrowDown", bubbles: true })), ); return () => cancelAnimationFrame(frame); }, [open]); return ( { onKeyDown?.(event); if (event.defaultPrevented || !menu || item === null) return; // On a closed trigger, Radix would move to the next one; opening is what ArrowDown means here if (event.key === "ArrowDown" && menu.horizontal && !open) { event.preventDefault(); entering.current = true; menu.setValue(item); } }} {...props} > {children} ); } type PanelProps = ComponentProps<"div"> & { viewport: boolean; leaving: boolean; onLeft: () => void; /** Set by Radix: the side the panel enters from or leaves towards (from-start, to-end...) */ "data-motion"?: string | null; }; /** * The panel's own element: Radix renders the content through it (asChild), handing over its attributes. In the * viewport it plays the slide; without one it's a floating surface of its own, under its trigger. */ function NavigationMenuPanel({ viewport, leaving, onLeft, className, children, ref, ...props }: PanelProps) { const menu = useContext(MenuContext); const reduce = menu?.reduce ?? false; const node = useRef(null); const setRef = useMergedRef(node, ref); const fresh = useRef(true); const side = props["data-motion"]; // One highlight for the panel's links: the one under the mouse, else the one with keyboard focus const groupId = useId(); const [pointed, setPointed] = useState(null); const [focused, setFocused] = useState(null); const { highlight, settle } = useHighlight(pointed ?? focused, reduce); const panel = useMemo( () => ({ highlight, settle, reduce, point: (link) => setPointed(link), unpoint: (link) => setPointed((current) => (current === link ? null : current)), focus: (link) => setFocused(link), blur: (link) => setFocused((current) => (current === link ? null : current)), }), [highlight, settle, reduce], ); // Before the first paint, so a panel never flashes in place before it slides // biome-ignore lint/correctness/useExhaustiveDependencies: only arriving or leaving starts a slide useLayoutEffect(() => { const panel = node.current; const first = fresh.current; fresh.current = false; if (!panel || !viewport || reduce) return; // Radix's start and end are the left and right of the screen (it flips them for right-to-left pages) const towards = side?.endsWith("start") ? -1 : 1; let live = true; let running: AnimationPlaybackControls | undefined; if (leaving) { // Slides out the other way through the blur, quicker than the new panel comes in, so the two barely overlap const exit = animate( panel, { opacity: 0, x: towards * SLIDE, filter: blur.hidden }, { duration: duration.fast, ease: ease.out }, ); exit.then(() => { if (live) onLeft(); }); running = exit; } else if (first && !side) { // Opening the menu (not switching panels): the links rise into place through the blur, in turn const links = Array.from(panel.querySelectorAll("[data-slot=navigation-menu-link]")); const rises = links.map((link, index) => animate( link, { opacity: [0, 1], y: [RISE, 0], filter: [blur.hidden, blur.shown] }, { duration: duration.slow, ease: ease.out, delay: index * STAGGER }, ), ); const clear = () => { for (const link of links) for (const property of ["opacity", "transform", "filter"]) link.style.removeProperty(property); }; Promise.all(rises).then(() => { if (live) clear(); }); return () => { live = false; for (const rise of rises) rise.stop(); clear(); }; } else if (side === "from-start" || side === "from-end") { // A panel that was sliding away and is wanted back turns round from where it is const entrance = animate( panel, first ? { opacity: [0, 1], x: [towards * SLIDE, 0], filter: [blur.hidden, blur.shown] } : { opacity: 1, x: 0, filter: blur.shown }, { duration: duration.base, ease: ease.out }, ); // A filter left behind would make a stacking context and a containing block round the links entrance.then(() => { if (live) panel.style.removeProperty("filter"); }); running = entrance; } return () => { live = false; running?.stop(); }; }, [leaving, side]); return (

{children}

); } export type NavigationMenuContentProps = Omit< ComponentProps, "forceMount" | "asChild" >; /** * A trigger's panel. Give what's inside a width (`w-md`, a grid), so the viewport knows the size to glide to. */ function NavigationMenuContent({ className, children, ref, ...props }: NavigationMenuContentProps) { const menu = useContext(MenuContext); const item = useContext(ItemContext); const viewport = menu?.viewport ?? true; const active = menu !== null && item !== null && menu.value === item; // Moving to another panel in the viewport, this one stays mounted while it slides away. When the menu closes // it goes with the viewport instead. const switching = viewport && !(menu?.reduce ?? false) && (menu?.value ?? "") !== ""; const [was, setWas] = useState(active); const [leaving, setLeaving] = useState(false); if (was !== active) { setWas(active); setLeaving(!active && switching); } else if (leaving && !switching) setLeaving(false); const left = useCallback(() => setLeaving(false), []); return ( {children} ); } /** A panel row: a title over a muted description. The hover fill is the panel's gliding highlight. */ const panelLinkClasses = [ "relative flex flex-col gap-1 rounded-md p-3 text-sm outline-ring transition-colors duration-(--duration-fast) ease-out", "hover:text-accent-foreground data-active:bg-accent/50 data-active:text-accent-foreground", "focus-visible:outline-(length:--focus-ring-width) focus-visible:outline-offset-(--focus-ring-offset)", "[&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-(--size-icon-md) [&_svg:not([class*='text-'])]:text-muted-foreground", ]; /** * A link. In the list it looks like a trigger; inside a panel it's a row. Selecting it closes the menu. Use * asChild with your router's link, and `active` for the current page. */ function NavigationMenuLink({ className, children, onPointerEnter, onPointerLeave, onFocus, onBlur, ...props }: ComponentProps) { const panel = useContext(PanelContext); const link = useId(); if (!panel) return ( {children} ); return ( { onPointerEnter?.(event); // Mouse only: a tap goes straight to the page if (event.pointerType === "mouse") panel.point(link); }} onPointerLeave={(event) => { onPointerLeave?.(event); if (event.pointerType === "mouse") panel.unpoint(link); }} onFocus={(event) => { onFocus?.(event); panel.focus(link); }} onBlur={(event) => { onBlur?.(event); panel.blur(link); }} {...props} > {/* With asChild the child (your router's link) becomes the row, and the highlight goes inside it */} {children} ); } /** * The panel's highlight, inside the link that has it. Links aren't stacking contexts: it joins the panel's * layer (the panel is `isolate`), so it passes behind every row's text. A fill, so it only fades. */ function PanelHighlight({ link }: { link: string }) { const panel = useContext(PanelContext); if (!panel || panel.highlight.item !== link) return null; const { highlight, reduce, settle } = panel; return ( { if (!highlight.shown) settle(); }} /> ); } /** * The floating surface the panels open in, under the list. NavigationMenu renders it unless `viewport` is * false. Its width and height are Radix's measure of the open panel; changing panels, they glide there. */ function NavigationMenuViewport({ className, ...props }: ComponentProps) { const menu = useContext(MenuContext); return ( // Spans the menu and centres the viewport under it. Only the viewport takes the pointer.

{/* After the viewport, so the caret paints over its top border */}

); } /** The caret itself, on the viewport's top edge */ function Caret({ menu, className }: { menu: MenuContextValue; className?: string }) { const { value, reduce, root, triggers, slot } = menu; const open = value !== ""; const x = useMotionValue(0); // It has a place in this opening: from here on it slides; the first place of an opening it jumps to const placed = useRef(false); useLayoutEffect(() => { if (!open) { placed.current = false; return; } let last: number | undefined; const place = (glide: boolean) => { const trigger = triggers.current.get(value); const box = root.current; if (!trigger || !box || !slot) return; // Offsets, not on-screen boxes, so a zoomed or scaled page doesn't double the trip const centre = offsetWithin(trigger, box) + trigger.offsetWidth / 2 - offsetWithin(slot, box); if (centre === last) return; last = centre; // jump() resets the speed, so a later slide never starts with the jump counted as velocity if (glide && placed.current && !reduce) animate(x, centre, spring.snappy); else x.jump(centre); placed.current = true; }; place(true); // Fonts loading or the page resizing move the triggers: follow without sliding const observer = new ResizeObserver(() => place(false)); if (root.current) observer.observe(root.current); return () => observer.disconnect(); }, [open, value, reduce, root, triggers, slot, x]); useEffect(() => () => x.stop(), [x]); return ( ); } /** * A caret on the viewport's top edge, pointing at the open trigger; it slides along when another opens. Place * it in NavigationMenuList, as on shadcn. It needs the viewport, so it renders nothing with `viewport={false}`. */ function NavigationMenuIndicator({ className }: { className?: string }) { const menu = useContext(MenuContext); if (!menu?.slot) return null; return createPortal(, menu.slot); } export { NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, NavigationMenuViewport, navigationMenuTriggerStyle, }; 51:["$","div",null,{"className":"mt-3 flex min-h-0 min-w-0 flex-1 flex-col gap-3","children":[["$","div",null,{"className":"flex shrink-0 items-start gap-3","children":[["$","div",null,{"className":"flex max-h-28 min-w-0 flex-1 flex-wrap items-center gap-2 overflow-y-auto","children":[["$","ul",null,{"className":"flex min-w-0 flex-wrap gap-2","aria-label":"Package dependencies","children":[["$","li","class-variance-authority@^0.7.1",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/class-variance-authority","target":"_blank","rel":"noopener noreferrer","className":"flex max-w-full min-w-0 items-center gap-1.5 rounded-md border px-2 py-1.5 text-xs","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3 shrink-0","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"min-w-0 break-all text-xs font-medium","children":"class-variance-authority@^0.7.1"}]]}]}],["$","li","lucide-react@^1.52.0",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/lucide-react","target":"_blank","rel":"noopener noreferrer","className":"flex max-w-full min-w-0 items-center gap-1.5 rounded-md border px-2 py-1.5 text-xs","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3 shrink-0","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"min-w-0 break-all text-xs font-medium","children":"lucide-react@^1.52.0"}]]}]}],["$","li","motion@^14.0.0",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/motion","target":"_blank","rel":"noopener noreferrer","className":"flex max-w-full min-w-0 items-center gap-1.5 rounded-md border px-2 py-1.5 text-xs","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3 shrink-0","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"min-w-0 break-all text-xs font-medium","children":"motion@^14.0.0"}]]}]}],["$","li","radix-ui@^1.7.0",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/radix-ui","target":"_blank","rel":"noopener noreferrer","className":"flex max-w-full min-w-0 items-center gap-1.5 rounded-md border px-2 py-1.5 text-xs","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3 shrink-0","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"min-w-0 break-all text-xs font-medium","children":"radix-ui@^1.7.0"}]]}]}]]}],["$","$L52",null,{"namespace":"@fewtone","registryDependencies":["https://ui.fewtone.com/r/tokens.json","https://ui.fewtone.com/r/motion.json"]}]]}],null]}],["$","$L53",null,{"files":[{"path":"registry/fewtone/ui/navigation-menu.tsx","content":"$54","type":"registry:ui"}],"className":"h-[70svh] min-h-80"}]]}]