@hanzo/docs-base-ui 16.4.8 → 16.5.3

package/dist/layouts/notebook/page/client.js

@@ -1,20 +1,20 @@
 'use client';
 
-import { i18n_exports } from "../../../contexts/i18n.js";
-import { tree_exports } from "../../../contexts/tree.js";
+import { useI18n } from "../../../contexts/i18n.js";
+import { cn } from "../../../utils/cn.js";
+import { useTreeContext, useTreePath } from "../../../contexts/tree.js";
+import { isActive } from "../../../utils/urls.js";
 import { Collapsible, CollapsibleContent, CollapsibleTrigger } from "../../../components/ui/collapsible.js";
-import { toc_exports } from "../../../components/toc/index.js";
+import { useTOCItems } from "../../../components/toc/index.js";
+import { useFooterItems } from "../../../utils/use-footer-items.js";
 import { LayoutContext } from "../client.js";
-import Link from "@hanzo/docs-core/link";
+import { Fragment, createContext, use, useEffect, useEffectEvent, useMemo, useRef, useState } from "react";
 import { usePathname } from "@hanzo/docs-core/framework";
-import { cn } from "@hanzo/docs-ui/cn";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+import Link from "@hanzo/docs-core/link";
 import { ChevronDown, ChevronLeft, ChevronRight } from "lucide-react";
-import { Fragment as Fragment$1, createContext, use, useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { getBreadcrumbItemsFromPath } from "@hanzo/docs-core/breadcrumb";
-import { isActive } from "@hanzo/docs-radix-ui/urls";
 import { useActiveAnchor } from "@hanzo/docs-core/toc";
-import { useFooterItems } from "@hanzo/docs-radix-ui/hooks/use-footer-items";
 
 //#region src/layouts/notebook/page/client.tsx
 const TocPopoverContext = createContext(null);
@@ -22,16 +22,16 @@ function PageTOCPopover({ className, children, ...rest }) {
 	const ref = useRef(null);
 	const [open, setOpen] = useState(false);
 	const { isNavTransparent } = use(LayoutContext);
-	const onClick = useCallback((e) => {
+	const onClick = useEffectEvent((e) => {
 		if (!open) return;
 		if (ref.current && !ref.current.contains(e.target)) setOpen(false);
-	}, [open]);
+	});
 	useEffect(() => {
 		window.addEventListener("click", onClick);
 		return () => {
 			window.removeEventListener("click", onClick);
 		};
-	}, [onClick]);
+	}, []);
 	return /* @__PURE__ */ jsx(TocPopoverContext, {
 		value: useMemo(() => ({
 			open,
@@ -52,12 +52,12 @@ function PageTOCPopover({ className, children, ...rest }) {
 	});
 }
 function PageTOCPopoverTrigger({ className, ...props }) {
-	const { text } = (0, i18n_exports.useI18n)();
+	const { text } = useI18n();
 	const { open } = use(TocPopoverContext);
-	const items = (0, toc_exports.useTOCItems)();
+	const items = useTOCItems();
 	const active = useActiveAnchor();
 	const selected = useMemo(() => items.findIndex((item) => active === item.url.slice(1)), [items, active]);
-	const path = (0, tree_exports.useTreePath)().at(-1);
+	const path = useTreePath().at(-1);
 	const showItem = selected !== -1 && !open;
 	return /* @__PURE__ */ jsxs(CollapsibleTrigger, {
 		className: cn("flex w-full h-10 items-center text-sm text-fd-muted-foreground gap-2.5 px-4 py-2.5 text-start focus-visible:outline-none [&_svg]:size-4 md:px-6", className),
@@ -130,7 +130,7 @@ function PageTOCPopoverContent(props) {
 	});
 }
 function PageLastUpdate({ date: value, ...props }) {
-	const { text } = (0, i18n_exports.useI18n)();
+	const { text } = useI18n();
 	const [date, setDate] = useState("");
 	useEffect(() => {
 		setDate(value.toLocaleDateString());
@@ -161,7 +161,7 @@ function PageFooter({ items, children, className, ...props }) {
 		items,
 		pathname
 	]);
-	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsxs("div", {
+	return /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsxs("div", {
 		className: cn("@container grid gap-4", previous && next ? "grid-cols-2" : "grid-cols-1", className),
 		...props,
 		children: [previous && /* @__PURE__ */ jsx(FooterItem, {
@@ -174,7 +174,7 @@ function PageFooter({ items, children, className, ...props }) {
 	}), children] });
 }
 function FooterItem({ item, index }) {
-	const { text } = (0, i18n_exports.useI18n)();
+	const { text } = useI18n();
 	const Icon = index === 0 ? ChevronLeft : ChevronRight;
 	return /* @__PURE__ */ jsxs(Link, {
 		href: item.url,
@@ -189,8 +189,8 @@ function FooterItem({ item, index }) {
 	});
 }
 function PageBreadcrumb({ includeRoot, includeSeparator, includePage, ...props }) {
-	const path = (0, tree_exports.useTreePath)();
-	const { root } = (0, tree_exports.useTreeContext)();
+	const path = useTreePath();
+	const { root } = useTreeContext();
 	const items = useMemo(() => {
 		return getBreadcrumbItemsFromPath(root, path, {
 			includePage,
@@ -210,7 +210,7 @@ function PageBreadcrumb({ includeRoot, includeSeparator, includePage, ...props }
 		className: cn("flex items-center gap-1.5 text-sm text-fd-muted-foreground", props.className),
 		children: items.map((item, i) => {
 			const className = cn("truncate", i === items.length - 1 && "text-fd-primary font-medium");
-			return /* @__PURE__ */ jsxs(Fragment$1, { children: [i !== 0 && /* @__PURE__ */ jsx(ChevronRight, { className: "size-3.5 shrink-0" }), item.url ? /* @__PURE__ */ jsx(Link, {
+			return /* @__PURE__ */ jsxs(Fragment, { children: [i !== 0 && /* @__PURE__ */ jsx(ChevronRight, { className: "size-3.5 shrink-0" }), item.url ? /* @__PURE__ */ jsx(Link, {
 				href: item.url,
 				className: cn(className, "transition-opacity hover:opacity-80"),
 				children: item.name

package/dist/layouts/notebook/page/client.js.map

@@ -1 +1 @@
-{"version":3,"file":"client.js","names":["Fragment"],"sources":["../../../../src/layouts/notebook/page/client.tsx"],"sourcesContent":["'use client';\n\nimport {\n  type ComponentProps,\n  createContext,\n  Fragment,\n  use,\n  useEffect,\n  useCallback,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { ChevronDown, ChevronLeft, ChevronRight } from 'lucide-react';\nimport Link from '@hanzo/docs-core/link';\nimport { cn } from '@hanzo/docs-ui/cn';\nimport { useI18n } from '@/contexts/i18n';\nimport { useTreeContext, useTreePath } from '@/contexts/tree';\nimport type * as PageTree from '@hanzo/docs-core/page-tree';\nimport { usePathname } from '@hanzo/docs-core/framework';\nimport { type BreadcrumbOptions, getBreadcrumbItemsFromPath } from '@hanzo/docs-core/breadcrumb';\nimport { isActive } from '@hanzo/docs-radix-ui/urls';\nimport { Collapsible, CollapsibleContent, CollapsibleTrigger } from '@/components/ui/collapsible';\nimport { useTOCItems } from '@/components/toc';\nimport { useActiveAnchor } from '@hanzo/docs-core/toc';\nimport { LayoutContext } from '../client';\nimport { useFooterItems } from '@hanzo/docs-radix-ui/hooks/use-footer-items';\n\nconst TocPopoverContext = createContext<{\n  open: boolean;\n  setOpen: (open: boolean) => void;\n} | null>(null);\n\nexport function PageTOCPopover({ className, children, ...rest }: ComponentProps<'div'>) {\n  const ref = useRef<HTMLElement>(null);\n  const [open, setOpen] = useState(false);\n  const { isNavTransparent } = use(LayoutContext)!;\n\n  const onClick = useCallback((e: Event) => {\n    if (!open) return;\n\n    if (ref.current && !ref.current.contains(e.target as HTMLElement)) setOpen(false);\n  }, [open]);\n\n  useEffect(() => {\n    window.addEventListener('click', onClick);\n\n    return () => {\n      window.removeEventListener('click', onClick);\n    };\n  }, [onClick]);\n\n  return (\n    <TocPopoverContext\n      value={useMemo(\n        () => ({\n          open,\n          setOpen,\n        }),\n        [setOpen, open],\n      )}\n    >\n      <Collapsible\n        open={open}\n        onOpenChange={setOpen}\n        data-toc-popover=\"\"\n        className={cn(\n          'sticky top-(--fd-docs-row-2) z-10 [grid-area:toc-popover] h-(--fd-toc-popover-height) xl:hidden max-xl:layout:[--fd-toc-popover-height:--spacing(10)]',\n          className,\n        )}\n        {...rest}\n      >\n        <header\n          ref={ref}\n          className={cn(\n            'border-b backdrop-blur-sm transition-colors',\n            (!isNavTransparent || open) && 'bg-fd-background/80',\n            open && 'shadow-lg',\n          )}\n        >\n          {children}\n        </header>\n      </Collapsible>\n    </TocPopoverContext>\n  );\n}\n\nexport function PageTOCPopoverTrigger({ className, ...props }: ComponentProps<'button'>) {\n  const { text } = useI18n();\n  const { open } = use(TocPopoverContext)!;\n  const items = useTOCItems();\n  const active = useActiveAnchor();\n  const selected = useMemo(\n    () => items.findIndex((item) => active === item.url.slice(1)),\n    [items, active],\n  );\n  const path = useTreePath().at(-1);\n  const showItem = selected !== -1 && !open;\n\n  return (\n    <CollapsibleTrigger\n      className={cn(\n        'flex w-full h-10 items-center text-sm text-fd-muted-foreground gap-2.5 px-4 py-2.5 text-start focus-visible:outline-none [&_svg]:size-4 md:px-6',\n        className,\n      )}\n      data-toc-popover-trigger=\"\"\n      {...props}\n    >\n      <ProgressCircle\n        value={(selected + 1) / Math.max(1, items.length)}\n        max={1}\n        className={cn('shrink-0', open && 'text-fd-primary')}\n      />\n      <span className=\"grid flex-1 *:my-auto *:row-start-1 *:col-start-1\">\n        <span\n          className={cn(\n            'truncate transition-all',\n            open && 'text-fd-foreground',\n            showItem && 'opacity-0 -translate-y-full pointer-events-none',\n          )}\n        >\n          {path?.name ?? text.toc}\n        </span>\n        <span\n          className={cn(\n            'truncate transition-all',\n            !showItem && 'opacity-0 translate-y-full pointer-events-none',\n          )}\n        >\n          {items[selected]?.title}\n        </span>\n      </span>\n      <ChevronDown className={cn('shrink-0 transition-transform mx-0.5', open && 'rotate-180')} />\n    </CollapsibleTrigger>\n  );\n}\n\ninterface ProgressCircleProps extends Omit<React.ComponentProps<'svg'>, 'strokeWidth'> {\n  value: number;\n  strokeWidth?: number;\n  size?: number;\n  min?: number;\n  max?: number;\n}\n\nfunction clamp(input: number, min: number, max: number): number {\n  if (input < min) return min;\n  if (input > max) return max;\n  return input;\n}\n\nfunction ProgressCircle({\n  value,\n  strokeWidth = 2,\n  size = 24,\n  min = 0,\n  max = 100,\n  ...restSvgProps\n}: ProgressCircleProps) {\n  const normalizedValue = clamp(value, min, max);\n  const radius = (size - strokeWidth) / 2;\n  const circumference = 2 * Math.PI * radius;\n  const progress = (normalizedValue / max) * circumference;\n  const circleProps = {\n    cx: size / 2,\n    cy: size / 2,\n    r: radius,\n    fill: 'none',\n    strokeWidth,\n  };\n\n  return (\n    <svg\n      role=\"progressbar\"\n      viewBox={`0 0 ${size} ${size}`}\n      aria-valuenow={normalizedValue}\n      aria-valuemin={min}\n      aria-valuemax={max}\n      {...restSvgProps}\n    >\n      <circle {...circleProps} className=\"stroke-current/25\" />\n      <circle\n        {...circleProps}\n        stroke=\"currentColor\"\n        strokeDasharray={circumference}\n        strokeDashoffset={circumference - progress}\n        strokeLinecap=\"round\"\n        transform={`rotate(-90 ${size / 2} ${size / 2})`}\n        className=\"transition-all\"\n      />\n    </svg>\n  );\n}\n\nexport function PageTOCPopoverContent(props: ComponentProps<'div'>) {\n  return (\n    <CollapsibleContent\n      data-toc-popover-content=\"\"\n      {...props}\n      className={cn('flex flex-col px-4 max-h-[50vh] md:px-6', props.className)}\n    >\n      {props.children}\n    </CollapsibleContent>\n  );\n}\n\nexport function PageLastUpdate({\n  date: value,\n  ...props\n}: Omit<ComponentProps<'p'>, 'children'> & { date: Date }) {\n  const { text } = useI18n();\n  const [date, setDate] = useState('');\n\n  useEffect(() => {\n    // to the timezone of client\n    setDate(value.toLocaleDateString());\n  }, [value]);\n\n  return (\n    <p {...props} className={cn('text-sm text-fd-muted-foreground', props.className)}>\n      {text.lastUpdate} {date}\n    </p>\n  );\n}\n\ntype Item = Pick<PageTree.Item, 'name' | 'description' | 'url'>;\nexport interface FooterProps extends ComponentProps<'div'> {\n  /**\n   * Items including information for the next and previous page\n   */\n  items?: {\n    previous?: Item;\n    next?: Item;\n  };\n}\n\nexport function PageFooter({ items, children, className, ...props }: FooterProps) {\n  const footerList = useFooterItems();\n  const pathname = usePathname();\n  const { previous, next } = useMemo(() => {\n    if (items) return items;\n\n    const idx = footerList.findIndex((item) => isActive(item.url, pathname, false));\n\n    if (idx === -1) return {};\n    return {\n      previous: footerList[idx - 1],\n      next: footerList[idx + 1],\n    };\n  }, [footerList, items, pathname]);\n\n  return (\n    <>\n      <div\n        className={cn(\n          '@container grid gap-4',\n          previous && next ? 'grid-cols-2' : 'grid-cols-1',\n          className,\n        )}\n        {...props}\n      >\n        {previous && <FooterItem item={previous} index={0} />}\n        {next && <FooterItem item={next} index={1} />}\n      </div>\n      {children}\n    </>\n  );\n}\n\nfunction FooterItem({ item, index }: { item: Item; index: 0 | 1 }) {\n  const { text } = useI18n();\n  const Icon = index === 0 ? ChevronLeft : ChevronRight;\n\n  return (\n    <Link\n      href={item.url}\n      className={cn(\n        'flex flex-col gap-2 rounded-lg border p-4 text-sm transition-colors hover:bg-fd-accent/80 hover:text-fd-accent-foreground @max-lg:col-span-full',\n        index === 1 && 'text-end',\n      )}\n    >\n      <div\n        className={cn(\n          'inline-flex items-center gap-1.5 font-medium',\n          index === 1 && 'flex-row-reverse',\n        )}\n      >\n        <Icon className=\"-mx-1 size-4 shrink-0 rtl:rotate-180\" />\n        <p>{item.name}</p>\n      </div>\n      <p className=\"text-fd-muted-foreground truncate\">\n        {item.description ?? (index === 0 ? text.previousPage : text.nextPage)}\n      </p>\n    </Link>\n  );\n}\n\nexport type BreadcrumbProps = BreadcrumbOptions & ComponentProps<'div'>;\n\nexport function PageBreadcrumb({\n  includeRoot,\n  includeSeparator,\n  includePage,\n  ...props\n}: BreadcrumbProps) {\n  const path = useTreePath();\n  const { root } = useTreeContext();\n  const items = useMemo(() => {\n    return getBreadcrumbItemsFromPath(root, path, {\n      includePage,\n      includeSeparator,\n      includeRoot,\n    });\n  }, [includePage, includeRoot, includeSeparator, path, root]);\n\n  if (items.length === 0) return null;\n\n  return (\n    <div\n      {...props}\n      className={cn('flex items-center gap-1.5 text-sm text-fd-muted-foreground', props.className)}\n    >\n      {items.map((item, i) => {\n        const className = cn('truncate', i === items.length - 1 && 'text-fd-primary font-medium');\n\n        return (\n          <Fragment key={i}>\n            {i !== 0 && <ChevronRight className=\"size-3.5 shrink-0\" />}\n            {item.url ? (\n              <Link\n                href={item.url}\n                className={cn(className, 'transition-opacity hover:opacity-80')}\n              >\n                {item.name}\n              </Link>\n            ) : (\n              <span className={className}>{item.name}</span>\n            )}\n          </Fragment>\n        );\n      })}\n    </div>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"client.js","names":[],"sources":["../../../../src/layouts/notebook/page/client.tsx"],"sourcesContent":["'use client';\n\nimport {\n  type ComponentProps,\n  createContext,\n  Fragment,\n  use,\n  useEffect,\n  useEffectEvent,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { ChevronDown, ChevronLeft, ChevronRight } from 'lucide-react';\nimport Link from '@hanzo/docs-core/link';\nimport { cn } from '@/utils/cn';\nimport { useI18n } from '@/contexts/i18n';\nimport { useTreeContext, useTreePath } from '@/contexts/tree';\nimport type * as PageTree from '@hanzo/docs-core/page-tree';\nimport { usePathname } from '@hanzo/docs-core/framework';\nimport { type BreadcrumbOptions, getBreadcrumbItemsFromPath } from '@hanzo/docs-core/breadcrumb';\nimport { isActive } from '@/utils/urls';\nimport { Collapsible, CollapsibleContent, CollapsibleTrigger } from '@/components/ui/collapsible';\nimport { useTOCItems } from '@/components/toc';\nimport { useActiveAnchor } from '@hanzo/docs-core/toc';\nimport { LayoutContext } from '../client';\nimport { useFooterItems } from '@/utils/use-footer-items';\n\nconst TocPopoverContext = createContext<{\n  open: boolean;\n  setOpen: (open: boolean) => void;\n} | null>(null);\n\nexport function PageTOCPopover({ className, children, ...rest }: ComponentProps<'div'>) {\n  const ref = useRef<HTMLElement>(null);\n  const [open, setOpen] = useState(false);\n  const { isNavTransparent } = use(LayoutContext)!;\n\n  const onClick = useEffectEvent((e: Event) => {\n    if (!open) return;\n\n    if (ref.current && !ref.current.contains(e.target as HTMLElement)) setOpen(false);\n  });\n\n  useEffect(() => {\n    window.addEventListener('click', onClick);\n\n    return () => {\n      window.removeEventListener('click', onClick);\n    };\n  }, []);\n\n  return (\n    <TocPopoverContext\n      value={useMemo(\n        () => ({\n          open,\n          setOpen,\n        }),\n        [setOpen, open],\n      )}\n    >\n      <Collapsible\n        open={open}\n        onOpenChange={setOpen}\n        data-toc-popover=\"\"\n        className={cn(\n          'sticky top-(--fd-docs-row-2) z-10 [grid-area:toc-popover] h-(--fd-toc-popover-height) xl:hidden max-xl:layout:[--fd-toc-popover-height:--spacing(10)]',\n          className,\n        )}\n        {...rest}\n      >\n        <header\n          ref={ref}\n          className={cn(\n            'border-b backdrop-blur-sm transition-colors',\n            (!isNavTransparent || open) && 'bg-fd-background/80',\n            open && 'shadow-lg',\n          )}\n        >\n          {children}\n        </header>\n      </Collapsible>\n    </TocPopoverContext>\n  );\n}\n\nexport function PageTOCPopoverTrigger({ className, ...props }: ComponentProps<'button'>) {\n  const { text } = useI18n();\n  const { open } = use(TocPopoverContext)!;\n  const items = useTOCItems();\n  const active = useActiveAnchor();\n  const selected = useMemo(\n    () => items.findIndex((item) => active === item.url.slice(1)),\n    [items, active],\n  );\n  const path = useTreePath().at(-1);\n  const showItem = selected !== -1 && !open;\n\n  return (\n    <CollapsibleTrigger\n      className={cn(\n        'flex w-full h-10 items-center text-sm text-fd-muted-foreground gap-2.5 px-4 py-2.5 text-start focus-visible:outline-none [&_svg]:size-4 md:px-6',\n        className,\n      )}\n      data-toc-popover-trigger=\"\"\n      {...props}\n    >\n      <ProgressCircle\n        value={(selected + 1) / Math.max(1, items.length)}\n        max={1}\n        className={cn('shrink-0', open && 'text-fd-primary')}\n      />\n      <span className=\"grid flex-1 *:my-auto *:row-start-1 *:col-start-1\">\n        <span\n          className={cn(\n            'truncate transition-all',\n            open && 'text-fd-foreground',\n            showItem && 'opacity-0 -translate-y-full pointer-events-none',\n          )}\n        >\n          {path?.name ?? text.toc}\n        </span>\n        <span\n          className={cn(\n            'truncate transition-all',\n            !showItem && 'opacity-0 translate-y-full pointer-events-none',\n          )}\n        >\n          {items[selected]?.title}\n        </span>\n      </span>\n      <ChevronDown className={cn('shrink-0 transition-transform mx-0.5', open && 'rotate-180')} />\n    </CollapsibleTrigger>\n  );\n}\n\ninterface ProgressCircleProps extends Omit<React.ComponentProps<'svg'>, 'strokeWidth'> {\n  value: number;\n  strokeWidth?: number;\n  size?: number;\n  min?: number;\n  max?: number;\n}\n\nfunction clamp(input: number, min: number, max: number): number {\n  if (input < min) return min;\n  if (input > max) return max;\n  return input;\n}\n\nfunction ProgressCircle({\n  value,\n  strokeWidth = 2,\n  size = 24,\n  min = 0,\n  max = 100,\n  ...restSvgProps\n}: ProgressCircleProps) {\n  const normalizedValue = clamp(value, min, max);\n  const radius = (size - strokeWidth) / 2;\n  const circumference = 2 * Math.PI * radius;\n  const progress = (normalizedValue / max) * circumference;\n  const circleProps = {\n    cx: size / 2,\n    cy: size / 2,\n    r: radius,\n    fill: 'none',\n    strokeWidth,\n  };\n\n  return (\n    <svg\n      role=\"progressbar\"\n      viewBox={`0 0 ${size} ${size}`}\n      aria-valuenow={normalizedValue}\n      aria-valuemin={min}\n      aria-valuemax={max}\n      {...restSvgProps}\n    >\n      <circle {...circleProps} className=\"stroke-current/25\" />\n      <circle\n        {...circleProps}\n        stroke=\"currentColor\"\n        strokeDasharray={circumference}\n        strokeDashoffset={circumference - progress}\n        strokeLinecap=\"round\"\n        transform={`rotate(-90 ${size / 2} ${size / 2})`}\n        className=\"transition-all\"\n      />\n    </svg>\n  );\n}\n\nexport function PageTOCPopoverContent(props: ComponentProps<'div'>) {\n  return (\n    <CollapsibleContent\n      data-toc-popover-content=\"\"\n      {...props}\n      className={cn('flex flex-col px-4 max-h-[50vh] md:px-6', props.className)}\n    >\n      {props.children}\n    </CollapsibleContent>\n  );\n}\n\nexport function PageLastUpdate({\n  date: value,\n  ...props\n}: Omit<ComponentProps<'p'>, 'children'> & { date: Date }) {\n  const { text } = useI18n();\n  const [date, setDate] = useState('');\n\n  useEffect(() => {\n    // to the timezone of client\n    setDate(value.toLocaleDateString());\n  }, [value]);\n\n  return (\n    <p {...props} className={cn('text-sm text-fd-muted-foreground', props.className)}>\n      {text.lastUpdate} {date}\n    </p>\n  );\n}\n\ntype Item = Pick<PageTree.Item, 'name' | 'description' | 'url'>;\nexport interface FooterProps extends ComponentProps<'div'> {\n  /**\n   * Items including information for the next and previous page\n   */\n  items?: {\n    previous?: Item;\n    next?: Item;\n  };\n}\n\nexport function PageFooter({ items, children, className, ...props }: FooterProps) {\n  const footerList = useFooterItems();\n  const pathname = usePathname();\n  const { previous, next } = useMemo(() => {\n    if (items) return items;\n\n    const idx = footerList.findIndex((item) => isActive(item.url, pathname, false));\n\n    if (idx === -1) return {};\n    return {\n      previous: footerList[idx - 1],\n      next: footerList[idx + 1],\n    };\n  }, [footerList, items, pathname]);\n\n  return (\n    <>\n      <div\n        className={cn(\n          '@container grid gap-4',\n          previous && next ? 'grid-cols-2' : 'grid-cols-1',\n          className,\n        )}\n        {...props}\n      >\n        {previous && <FooterItem item={previous} index={0} />}\n        {next && <FooterItem item={next} index={1} />}\n      </div>\n      {children}\n    </>\n  );\n}\n\nfunction FooterItem({ item, index }: { item: Item; index: 0 | 1 }) {\n  const { text } = useI18n();\n  const Icon = index === 0 ? ChevronLeft : ChevronRight;\n\n  return (\n    <Link\n      href={item.url}\n      className={cn(\n        'flex flex-col gap-2 rounded-lg border p-4 text-sm transition-colors hover:bg-fd-accent/80 hover:text-fd-accent-foreground @max-lg:col-span-full',\n        index === 1 && 'text-end',\n      )}\n    >\n      <div\n        className={cn(\n          'inline-flex items-center gap-1.5 font-medium',\n          index === 1 && 'flex-row-reverse',\n        )}\n      >\n        <Icon className=\"-mx-1 size-4 shrink-0 rtl:rotate-180\" />\n        <p>{item.name}</p>\n      </div>\n      <p className=\"text-fd-muted-foreground truncate\">\n        {item.description ?? (index === 0 ? text.previousPage : text.nextPage)}\n      </p>\n    </Link>\n  );\n}\n\nexport type BreadcrumbProps = BreadcrumbOptions & ComponentProps<'div'>;\n\nexport function PageBreadcrumb({\n  includeRoot,\n  includeSeparator,\n  includePage,\n  ...props\n}: BreadcrumbProps) {\n  const path = useTreePath();\n  const { root } = useTreeContext();\n  const items = useMemo(() => {\n    return getBreadcrumbItemsFromPath(root, path, {\n      includePage,\n      includeSeparator,\n      includeRoot,\n    });\n  }, [includePage, includeRoot, includeSeparator, path, root]);\n\n  if (items.length === 0) return null;\n\n  return (\n    <div\n      {...props}\n      className={cn('flex items-center gap-1.5 text-sm text-fd-muted-foreground', props.className)}\n    >\n      {items.map((item, i) => {\n        const className = cn('truncate', i === items.length - 1 && 'text-fd-primary font-medium');\n\n        return (\n          <Fragment key={i}>\n            {i !== 0 && <ChevronRight className=\"size-3.5 shrink-0\" />}\n            {item.url ? (\n              <Link\n                href={item.url}\n                className={cn(className, 'transition-opacity hover:opacity-80')}\n              >\n                {item.name}\n              </Link>\n            ) : (\n              <span className={className}>{item.name}</span>\n            )}\n          </Fragment>\n        );\n      })}\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/layouts/notebook/page/index.d.ts

@@ -1,6 +1,6 @@
 import { BreadcrumbProps, FooterProps, PageBreadcrumb, PageLastUpdate } from "./client.js";
-import * as react_jsx_runtime65 from "react/jsx-runtime";
 import { ComponentProps, ReactNode } from "react";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
 import { AnchorProviderProps, TOCItemType } from "@hanzo/docs-core/toc";
 
 //#region src/layouts/notebook/page/index.d.ts
@@ -81,7 +81,7 @@ declare function DocsPage({
   children,
   className
 }: DocsPageProps): ReactNode;
-declare function EditOnGitHub(props: ComponentProps<'a'>): react_jsx_runtime65.JSX.Element;
+declare function EditOnGitHub(props: ComponentProps<'a'>): react_jsx_runtime0.JSX.Element;
 /**
  * Add typography styles
  */
@@ -89,17 +89,17 @@ declare function DocsBody({
   children,
   className,
   ...props
-}: ComponentProps<'div'>): react_jsx_runtime65.JSX.Element;
+}: ComponentProps<'div'>): react_jsx_runtime0.JSX.Element;
 declare function DocsDescription({
   children,
   className,
   ...props
-}: ComponentProps<'p'>): react_jsx_runtime65.JSX.Element | null;
+}: ComponentProps<'p'>): react_jsx_runtime0.JSX.Element | null;
 declare function DocsTitle({
   children,
   className,
   ...props
-}: ComponentProps<'h1'>): react_jsx_runtime65.JSX.Element;
+}: ComponentProps<'h1'>): react_jsx_runtime0.JSX.Element;
 //#endregion
 export { DocsBody, DocsDescription, DocsPage, DocsPageProps, DocsTitle, EditOnGitHub, PageBreadcrumb, PageLastUpdate };
 //# sourceMappingURL=index.d.ts.map

package/dist/layouts/notebook/page/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","names":[],"sources":["../../../../src/layouts/notebook/page/index.tsx"],"sourcesContent":[],"mappings":";;;;;;UAmBU,iBAAA,SAA0B;;aAEvB;AAPgE;AAK1B,UAKzC,aAAA,SAAsB,WAEnB,CAFmB;EAKf,OAAA,EAAA,OAAa;EACtB,SAAA,EAJK,SAIL;;AACW,UAFF,aAAA,CAEE;EACe,GAAA,CAAA,EAF1B,WAE0B,EAAA;EAAR,cAAA,CAAA,EADP,OACO,CADC,qBACD,CAAA;EAYH,qBAAA,CAAA,EAZG,OAYH,CAZW,4BAYX,CAAA;EAAR;;;;;EAiBV,IAAA,CAAA,EAAA,OAAA;EAA6B;;;EASvB,UAAA,CAAA,EA1BI,OA0BJ,CA1BY,iBA0BZ,CAAA;EAGE;;AAAS;AAUtB;;EAC8D,MAAA,CAAA,EAjCnD,OAiCmD,CAjC3C,aAiC2C,CAAA;EACzC,QAAA,CAAA,EAhCR,SAgCQ;EAA0B;;;EAIhC,SAAA,CAAA,EAAA,MAAA;;KA5BV,qBAAA,GAAwB,IA+BuB,CA/BlB,mBA+BkB,EAAA,QAAA,CAAA,GAAA;EAClD;;;EAGC,MAAA,CAAA,EA/BQ,SA+BR;EAAa;;AA4EhB;EA4BgB,MAAA,CAAA,EAlIL,SAkIa;EAAG,OAAA,EAAA,OAAA;EAAU,SAAA,EA/HxB,SA+HwB;EAAuB;;;EAQ5C,KAAA,CAAA,EAAA,QAAA,GAAe,OAAA;CAAG;KA/H7B,4BAAA,GAA+B,IA+HQ,CA/HH,qBA+HG,EAAA,QAAA,CAAA;AAAuB,iBA7HnD,QAAA,CA6HmD;EAAA,UAAA,EAAA;IAAA,OAAA,EA5H1C,iBA4H0C;IAAA,SAAA,EA5HL,UA4HK;IAAA,GAAA;EAAA,CAAA;EAAA,MAAA,EAAA;IAAA,OAAA,EA3H9C,aA2H8C;IAAA,SAAA,EA3HpB,aA2HoB;IAAA,GAAA;EAAA,CAAA;EAAA,IAAA;EAAA,qBAAA,EAAA;IAAA,OAAA,EAxHtD,iBAwHsD;IAAA,SAAA,EAvHpD,UAuHoD;IAAA,GAAA;EAAA,CAAA;EAAA,cAAA,EAAA;IAAA,OAAA,EApHtC,UAoHsC;IAAA,SAAA,EApHf,UAoHe;IAAA,GAAA;EAAA,CAAA;EAAA,GAAA;EAAA,QAAA;EAAA;AAAA,CAAA,EAhHhE,aAgHgE,CAAA,EAhHnD,SAgHmD;AAAmB,iBApCtE,YAAA,CAoCsE,KAAA,EApClD,cAoCkD,CAAA,GAAA,CAAA,CAAA,EApC/B,mBAAA,CAAA,GAAA,CAAA,OAoC+B;;AAWtF;;AAAsC,iBAnBtB,QAAA,CAmBsB;EAAA,QAAA;EAAA,SAAA;EAAA,GAAA;AAAA,CAAA,EAnBsB,cAmBtB,CAAA,KAAA,CAAA,CAAA,EAnB2C,mBAAA,CAAA,GAAA,CAAA,OAmB3C;AAAuB,iBAX7C,eAAA,CAW6C;EAAA,QAAA;EAAA,SAAA;EAAA,GAAA;AAAA,CAAA,EAXM,cAWN,CAAA,GAAA,CAAA,CAAA,EAXyB,mBAAA,CAAA,GAAA,CAAA,OAAA,GAWzB,IAAA;AAAoB,iBAAjE,SAAA,CAAiE;EAAA,QAAA;EAAA,SAAA;EAAA,GAAA;AAAA,CAAA,EAApB,cAAoB,CAAA,IAAA,CAAA,CAAA,EAAA,mBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../../../src/layouts/notebook/page/index.tsx"],"mappings":";;;;;;UAmBU,iBAAA,SAA0B,eAAA;EAClC,OAAA;EACA,SAAA,EAAW,SAAA;AAAA;AAAA,UAGH,aAAA,SAAsB,WAAA;EAC9B,OAAA;EACA,SAAA,EAAW,SAAA;AAAA;AAAA,UAGI,aAAA;EACf,GAAA,GAAM,WAAA;EACN,cAAA,GAAiB,OAAA,CAAQ,qBAAA;EACzB,qBAAA,GAAwB,OAAA,CAAQ,4BAAA;EAXZ;AAAA;;;;EAkBpB,IAAA;EAdA;;;EAmBA,UAAA,GAAa,OAAA,CAAQ,iBAAA;EAlBD;AAGtB;;;;EAsBE,MAAA,GAAS,OAAA,CAAQ,aAAA;EAEjB,QAAA,GAAW,SAAA;EArBqB;;;EA0BhC,SAAA;AAAA;AAAA,KAGG,qBAAA,GAAwB,IAAA,CAAK,mBAAA;EARrB;;;EAYX,MAAA,GAAS,SAAA;EAnCH;;;EAwCN,MAAA,GAAS,SAAA;EAET,OAAA;EACA,SAAA,EAAW,SAAA;EAzCqB;;;EA8ChC,KAAA;AAAA;AAAA,KAGG,4BAAA,GAA+B,IAAA,CAAK,qBAAA;AAAA,iBAEzB,QAAA,CAAA;EACd,UAAA;IAAc,OAAA,EAAS,iBAAA;IAA0B,SAAA,EAAW,UAAA;IAAA,GAAe;EAAA;EAC3E,MAAA;IAAU,OAAA,EAAS,aAAA;IAAe,SAAA,EAAW,aAAA;IAAA,GAAkB;EAAA;EAC/D,IAAA;EACA,qBAAA;IACE,OAAA,EAAS,iBAAA;IACT,SAAA,EAAW,UAAA;IAAA,GACR;EAAA;EAEL,cAAA;IAAkB,OAAA,EAAS,UAAA;IAAY,SAAA,EAAW,UAAA;IAAA,GAAe;EAAA;EACjE,GAAA;EACA,QAAA;EACA;AAAA,GACC,aAAA,GAAa,SAAA;AAAA,iBA4EA,YAAA,CAAa,KAAA,EAAO,cAAA,QAAmB,kBAAA,CAAA,GAAA,CAAA,OAAA;;;;iBA4BvC,QAAA,CAAA;EAAW,QAAA;EAAU,SAAA;EAAA,GAAc;AAAA,GAAS,cAAA,UAAqB,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAQjE,eAAA,CAAA;EAAkB,QAAA;EAAU,SAAA;EAAA,GAAc;AAAA,GAAS,cAAA,QAAmB,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAWtE,SAAA,CAAA;EAAY,QAAA;EAAU,SAAA;EAAA,GAAc;AAAA,GAAS,cAAA,SAAoB,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/layouts/notebook/page/index.js

@@ -1,11 +1,11 @@
-import { __exportAll } from "../../../_virtual/rolldown_runtime.js";
+import { __exportAll } from "../../../_virtual/_rolldown/runtime.js";
+import { I18nLabel } from "../../../contexts/i18n.js";
+import { cn } from "../../../utils/cn.js";
 import { buttonVariants } from "../../../components/ui/button.js";
-import { i18n_exports } from "../../../contexts/i18n.js";
-import { toc_exports } from "../../../components/toc/index.js";
-import { default_exports } from "../../../components/toc/default.js";
-import { clerk_exports } from "../../../components/toc/clerk.js";
+import { TOCProvider, TOCScrollArea } from "../../../components/toc/index.js";
+import { TOCItems } from "../../../components/toc/default.js";
+import { TOCItems as TOCItems$1 } from "../../../components/toc/clerk.js";
 import { PageBreadcrumb, PageFooter, PageLastUpdate, PageTOCPopover, PageTOCPopoverContent, PageTOCPopoverTrigger } from "./client.js";
-import { cn } from "@hanzo/docs-ui/cn";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { Edit, Text } from "lucide-react";
 
@@ -22,16 +22,16 @@ var page_exports = /* @__PURE__ */ __exportAll({
 function DocsPage({ breadcrumb: { enabled: breadcrumbEnabled = true, component: breadcrumb, ...breadcrumbProps } = {}, footer: { enabled: footerEnabled, component: footerReplace, ...footerProps } = {}, full = false, tableOfContentPopover: { enabled: tocPopoverEnabled, component: tocPopover, ...tocPopoverOptions } = {}, tableOfContent: { enabled: tocEnabled, component: tocReplace, ...tocOptions } = {}, toc = [], children, className }) {
 	tocEnabled ??= !full && (toc.length > 0 || tocOptions.footer !== void 0 || tocOptions.header !== void 0);
 	tocPopoverEnabled ??= toc.length > 0 || tocPopoverOptions.header !== void 0 || tocPopoverOptions.footer !== void 0;
-	let wrapper = (children$1) => children$1;
-	if (tocEnabled || tocPopoverEnabled) wrapper = (children$1) => /* @__PURE__ */ jsx(toc_exports.TOCProvider, {
+	let wrapper = (children) => children;
+	if (tocEnabled || tocPopoverEnabled) wrapper = (children) => /* @__PURE__ */ jsx(TOCProvider, {
 		single: tocOptions.single,
 		toc,
-		children: children$1
+		children
 	});
 	return wrapper(/* @__PURE__ */ jsxs(Fragment, { children: [
 		tocPopoverEnabled && (tocPopover ?? /* @__PURE__ */ jsxs(PageTOCPopover, { children: [/* @__PURE__ */ jsx(PageTOCPopoverTrigger, {}), /* @__PURE__ */ jsxs(PageTOCPopoverContent, { children: [
 			tocPopoverOptions.header,
-			/* @__PURE__ */ jsx(toc_exports.TOCScrollArea, { children: tocPopoverOptions.style === "clerk" ? /* @__PURE__ */ jsx(clerk_exports.TOCItems, {}) : /* @__PURE__ */ jsx(default_exports.TOCItems, {}) }),
+			/* @__PURE__ */ jsx(TOCScrollArea, { children: tocPopoverOptions.style === "clerk" ? /* @__PURE__ */ jsx(TOCItems$1, {}) : /* @__PURE__ */ jsx(TOCItems, {}) }),
 			tocPopoverOptions.footer
 		] })] })),
 		/* @__PURE__ */ jsxs("article", {
@@ -52,9 +52,9 @@ function DocsPage({ breadcrumb: { enabled: breadcrumbEnabled = true, component:
 				/* @__PURE__ */ jsxs("h3", {
 					id: "toc-title",
 					className: "inline-flex items-center gap-1.5 text-sm text-fd-muted-foreground",
-					children: [/* @__PURE__ */ jsx(Text, { className: "size-4" }), /* @__PURE__ */ jsx(i18n_exports.I18nLabel, { label: "toc" })]
+					children: [/* @__PURE__ */ jsx(Text, { className: "size-4" }), /* @__PURE__ */ jsx(I18nLabel, { label: "toc" })]
 				}),
-				/* @__PURE__ */ jsx(toc_exports.TOCScrollArea, { children: tocOptions.style === "clerk" ? /* @__PURE__ */ jsx(clerk_exports.TOCItems, {}) : /* @__PURE__ */ jsx(default_exports.TOCItems, {}) }),
+				/* @__PURE__ */ jsx(TOCScrollArea, { children: tocOptions.style === "clerk" ? /* @__PURE__ */ jsx(TOCItems$1, {}) : /* @__PURE__ */ jsx(TOCItems, {}) }),
 				tocOptions.footer
 			]
 		}))
@@ -70,7 +70,7 @@ function EditOnGitHub(props) {
 			size: "sm",
 			className: "gap-1.5 not-prose"
 		}), props.className),
-		children: props.children ?? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Edit, { className: "size-3.5" }), /* @__PURE__ */ jsx(i18n_exports.I18nLabel, { label: "editOnGithub" })] })
+		children: props.children ?? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Edit, { className: "size-3.5" }), /* @__PURE__ */ jsx(I18nLabel, { label: "editOnGithub" })] })
 	});
 }
 /**

package/dist/layouts/notebook/page/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["children","TOCProvider","TOCScrollArea","TocClerk","TocDefault","I18nLabel"],"sources":["../../../../src/layouts/notebook/page/index.tsx"],"sourcesContent":["import type { ComponentProps, ReactNode } from 'react';\nimport { cn } from '@hanzo/docs-ui/cn';\nimport { buttonVariants } from '@/components/ui/button';\nimport { Edit, Text } from 'lucide-react';\nimport { I18nLabel } from '@/contexts/i18n';\nimport {\n  type BreadcrumbProps,\n  type FooterProps,\n  PageBreadcrumb,\n  PageFooter,\n  PageTOCPopover,\n  PageTOCPopoverContent,\n  PageTOCPopoverTrigger,\n} from './client';\nimport type { AnchorProviderProps, TOCItemType } from '@hanzo/docs-core/toc';\nimport * as TocDefault from '@/components/toc/default';\nimport * as TocClerk from '@/components/toc/clerk';\nimport { TOCProvider, TOCScrollArea } from '@/components/toc';\n\ninterface BreadcrumbOptions extends BreadcrumbProps {\n  enabled: boolean;\n  component: ReactNode;\n}\n\ninterface FooterOptions extends FooterProps {\n  enabled: boolean;\n  component: ReactNode;\n}\n\nexport interface DocsPageProps {\n  toc?: TOCItemType[];\n  tableOfContent?: Partial<TableOfContentOptions>;\n  tableOfContentPopover?: Partial<TableOfContentPopoverOptions>;\n\n  /**\n   * Extend the page to fill all available space\n   *\n   * @defaultValue false\n   */\n  full?: boolean;\n\n  /**\n   * Replace or disable breadcrumb\n   */\n  breadcrumb?: Partial<BreadcrumbOptions>;\n\n  /**\n   * Footer navigation, located under the page body.\n   *\n   * You can specify `footer.children` to add extra components under the footer.\n   */\n  footer?: Partial<FooterOptions>;\n\n  children?: ReactNode;\n\n  /**\n   * Apply class names to the `#nd-page` container.\n   */\n  className?: string;\n}\n\ntype TableOfContentOptions = Pick<AnchorProviderProps, 'single'> & {\n  /**\n   * Custom content in TOC container, before the main TOC\n   */\n  header?: ReactNode;\n\n  /**\n   * Custom content in TOC container, after the main TOC\n   */\n  footer?: ReactNode;\n\n  enabled: boolean;\n  component: ReactNode;\n\n  /**\n   * @defaultValue 'normal'\n   */\n  style?: 'normal' | 'clerk';\n};\n\ntype TableOfContentPopoverOptions = Omit<TableOfContentOptions, 'single'>;\n\nexport function DocsPage({\n  breadcrumb: { enabled: breadcrumbEnabled = true, component: breadcrumb, ...breadcrumbProps } = {},\n  footer: { enabled: footerEnabled, component: footerReplace, ...footerProps } = {},\n  full = false,\n  tableOfContentPopover: {\n    enabled: tocPopoverEnabled,\n    component: tocPopover,\n    ...tocPopoverOptions\n  } = {},\n  tableOfContent: { enabled: tocEnabled, component: tocReplace, ...tocOptions } = {},\n  toc = [],\n  children,\n  className,\n}: DocsPageProps) {\n  // disable TOC on full mode, you can still enable it with `enabled` option.\n  tocEnabled ??=\n    !full && (toc.length > 0 || tocOptions.footer !== undefined || tocOptions.header !== undefined);\n\n  tocPopoverEnabled ??=\n    toc.length > 0 ||\n    tocPopoverOptions.header !== undefined ||\n    tocPopoverOptions.footer !== undefined;\n\n  let wrapper = (children: ReactNode) => children;\n\n  if (tocEnabled || tocPopoverEnabled) {\n    wrapper = (children) => (\n      <TOCProvider single={tocOptions.single} toc={toc}>\n        {children}\n      </TOCProvider>\n    );\n  }\n\n  return wrapper(\n    <>\n      {tocPopoverEnabled &&\n        (tocPopover ?? (\n          <PageTOCPopover>\n            <PageTOCPopoverTrigger />\n            <PageTOCPopoverContent>\n              {tocPopoverOptions.header}\n              <TOCScrollArea>\n                {tocPopoverOptions.style === 'clerk' ? (\n                  <TocClerk.TOCItems />\n                ) : (\n                  <TocDefault.TOCItems />\n                )}\n              </TOCScrollArea>\n              {tocPopoverOptions.footer}\n            </PageTOCPopoverContent>\n          </PageTOCPopover>\n        ))}\n      <article\n        id=\"nd-page\"\n        data-full={full}\n        className={cn(\n          'flex flex-col [grid-area:main] px-4 py-6 gap-4 md:px-6 md:pt-8 xl:px-8 xl:pt-14 *:max-w-[900px]',\n          full && '*:max-w-[1285px]',\n          className,\n        )}\n      >\n        {breadcrumbEnabled && (breadcrumb ?? <PageBreadcrumb {...breadcrumbProps} />)}\n        {children}\n        {footerEnabled !== false && (footerReplace ?? <PageFooter {...footerProps} />)}\n      </article>\n      {tocEnabled &&\n        (tocReplace ?? (\n          <div\n            id=\"nd-toc\"\n            className=\"sticky top-(--fd-docs-row-3) [grid-area:toc] h-[calc(var(--fd-docs-height)-var(--fd-docs-row-3))] flex flex-col w-(--fd-toc-width) pt-12 pe-4 pb-2 xl:layout:[--fd-toc-width:268px] max-xl:hidden\"\n          >\n            {tocOptions.header}\n            <h3\n              id=\"toc-title\"\n              className=\"inline-flex items-center gap-1.5 text-sm text-fd-muted-foreground\"\n            >\n              <Text className=\"size-4\" />\n              <I18nLabel label=\"toc\" />\n            </h3>\n            <TOCScrollArea>\n              {tocOptions.style === 'clerk' ? <TocClerk.TOCItems /> : <TocDefault.TOCItems />}\n            </TOCScrollArea>\n            {tocOptions.footer}\n          </div>\n        ))}\n    </>,\n  );\n}\n\nexport function EditOnGitHub(props: ComponentProps<'a'>) {\n  return (\n    <a\n      target=\"_blank\"\n      rel=\"noreferrer noopener\"\n      {...props}\n      className={cn(\n        buttonVariants({\n          color: 'secondary',\n          size: 'sm',\n          className: 'gap-1.5 not-prose',\n        }),\n        props.className,\n      )}\n    >\n      {props.children ?? (\n        <>\n          <Edit className=\"size-3.5\" />\n          <I18nLabel label=\"editOnGithub\" />\n        </>\n      )}\n    </a>\n  );\n}\n\n/**\n * Add typography styles\n */\nexport function DocsBody({ children, className, ...props }: ComponentProps<'div'>) {\n  return (\n    <div {...props} className={cn('prose flex-1', className)}>\n      {children}\n    </div>\n  );\n}\n\nexport function DocsDescription({ children, className, ...props }: ComponentProps<'p'>) {\n  // Don't render if no description provided\n  if (children === undefined) return null;\n\n  return (\n    <p {...props} className={cn('mb-8 text-lg text-fd-muted-foreground', className)}>\n      {children}\n    </p>\n  );\n}\n\nexport function DocsTitle({ children, className, ...props }: ComponentProps<'h1'>) {\n  return (\n    <h1 {...props} className={cn('text-[1.75em] font-semibold', className)}>\n      {children}\n    </h1>\n  );\n}\n\nexport { PageLastUpdate, PageBreadcrumb } from './client';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAmFA,SAAgB,SAAS,EACvB,YAAY,EAAE,SAAS,oBAAoB,MAAM,WAAW,YAAY,GAAG,oBAAoB,EAAE,EACjG,QAAQ,EAAE,SAAS,eAAe,WAAW,eAAe,GAAG,gBAAgB,EAAE,EACjF,OAAO,OACP,uBAAuB,EACrB,SAAS,mBACT,WAAW,YACX,GAAG,sBACD,EAAE,EACN,gBAAgB,EAAE,SAAS,YAAY,WAAW,YAAY,GAAG,eAAe,EAAE,EAClF,MAAM,EAAE,EACR,UACA,aACgB;AAEhB,gBACE,CAAC,SAAS,IAAI,SAAS,KAAK,WAAW,WAAW,UAAa,WAAW,WAAW;AAEvF,uBACE,IAAI,SAAS,KACb,kBAAkB,WAAW,UAC7B,kBAAkB,WAAW;CAE/B,IAAI,WAAW,eAAwBA;AAEvC,KAAI,cAAc,kBAChB,YAAW,eACT,oBAACC;EAAY,QAAQ,WAAW;EAAa;YAC1CD;GACW;AAIlB,QAAO,QACL;EACG,sBACE,cACC,qBAAC,6BACC,oBAAC,0BAAwB,EACzB,qBAAC;GACE,kBAAkB;GACnB,oBAACE,uCACE,kBAAkB,UAAU,UAC3B,oBAACC,cAAS,aAAW,GAErB,oBAACC,gBAAW,aAAW,GAEX;GACf,kBAAkB;MACG,IACT;EAErB,qBAAC;GACC,IAAG;GACH,aAAW;GACX,WAAW,GACT,mGACA,QAAQ,oBACR,UACD;;IAEA,sBAAsB,cAAc,oBAAC,kBAAe,GAAI,kBAAmB;IAC3E;IACA,kBAAkB,UAAU,iBAAiB,oBAAC,cAAW,GAAI,cAAe;;IACrE;EACT,eACE,cACC,qBAAC;GACC,IAAG;GACH,WAAU;;IAET,WAAW;IACZ,qBAAC;KACC,IAAG;KACH,WAAU;gBAEV,oBAAC,QAAK,WAAU,WAAW,EAC3B,oBAACC,0BAAU,OAAM,QAAQ;MACtB;IACL,oBAACH,uCACE,WAAW,UAAU,UAAU,oBAACC,cAAS,aAAW,GAAG,oBAACC,gBAAW,aAAW,GACjE;IACf,WAAW;;IACR;KAET,CACJ;;AAGH,SAAgB,aAAa,OAA4B;AACvD,QACE,oBAAC;EACC,QAAO;EACP,KAAI;EACJ,GAAI;EACJ,WAAW,GACT,eAAe;GACb,OAAO;GACP,MAAM;GACN,WAAW;GACZ,CAAC,EACF,MAAM,UACP;YAEA,MAAM,YACL,4CACE,oBAAC,QAAK,WAAU,aAAa,EAC7B,oBAACC,0BAAU,OAAM,iBAAiB,IACjC;GAEH;;;;;AAOR,SAAgB,SAAS,EAAE,UAAU,WAAW,GAAG,SAAgC;AACjF,QACE,oBAAC;EAAI,GAAI;EAAO,WAAW,GAAG,gBAAgB,UAAU;EACrD;GACG;;AAIV,SAAgB,gBAAgB,EAAE,UAAU,WAAW,GAAG,SAA8B;AAEtF,KAAI,aAAa,OAAW,QAAO;AAEnC,QACE,oBAAC;EAAE,GAAI;EAAO,WAAW,GAAG,yCAAyC,UAAU;EAC5E;GACC;;AAIR,SAAgB,UAAU,EAAE,UAAU,WAAW,GAAG,SAA+B;AACjF,QACE,oBAAC;EAAG,GAAI;EAAO,WAAW,GAAG,+BAA+B,UAAU;EACnE;GACE"}
+{"version":3,"file":"index.js","names":["TocClerk.TOCItems","TocDefault.TOCItems"],"sources":["../../../../src/layouts/notebook/page/index.tsx"],"sourcesContent":["import type { ComponentProps, ReactNode } from 'react';\nimport { cn } from '@/utils/cn';\nimport { buttonVariants } from '@/components/ui/button';\nimport { Edit, Text } from 'lucide-react';\nimport { I18nLabel } from '@/contexts/i18n';\nimport {\n  type BreadcrumbProps,\n  type FooterProps,\n  PageBreadcrumb,\n  PageFooter,\n  PageTOCPopover,\n  PageTOCPopoverContent,\n  PageTOCPopoverTrigger,\n} from './client';\nimport type { AnchorProviderProps, TOCItemType } from '@hanzo/docs-core/toc';\nimport * as TocDefault from '@/components/toc/default';\nimport * as TocClerk from '@/components/toc/clerk';\nimport { TOCProvider, TOCScrollArea } from '@/components/toc';\n\ninterface BreadcrumbOptions extends BreadcrumbProps {\n  enabled: boolean;\n  component: ReactNode;\n}\n\ninterface FooterOptions extends FooterProps {\n  enabled: boolean;\n  component: ReactNode;\n}\n\nexport interface DocsPageProps {\n  toc?: TOCItemType[];\n  tableOfContent?: Partial<TableOfContentOptions>;\n  tableOfContentPopover?: Partial<TableOfContentPopoverOptions>;\n\n  /**\n   * Extend the page to fill all available space\n   *\n   * @defaultValue false\n   */\n  full?: boolean;\n\n  /**\n   * Replace or disable breadcrumb\n   */\n  breadcrumb?: Partial<BreadcrumbOptions>;\n\n  /**\n   * Footer navigation, located under the page body.\n   *\n   * You can specify `footer.children` to add extra components under the footer.\n   */\n  footer?: Partial<FooterOptions>;\n\n  children?: ReactNode;\n\n  /**\n   * Apply class names to the `#nd-page` container.\n   */\n  className?: string;\n}\n\ntype TableOfContentOptions = Pick<AnchorProviderProps, 'single'> & {\n  /**\n   * Custom content in TOC container, before the main TOC\n   */\n  header?: ReactNode;\n\n  /**\n   * Custom content in TOC container, after the main TOC\n   */\n  footer?: ReactNode;\n\n  enabled: boolean;\n  component: ReactNode;\n\n  /**\n   * @defaultValue 'normal'\n   */\n  style?: 'normal' | 'clerk';\n};\n\ntype TableOfContentPopoverOptions = Omit<TableOfContentOptions, 'single'>;\n\nexport function DocsPage({\n  breadcrumb: { enabled: breadcrumbEnabled = true, component: breadcrumb, ...breadcrumbProps } = {},\n  footer: { enabled: footerEnabled, component: footerReplace, ...footerProps } = {},\n  full = false,\n  tableOfContentPopover: {\n    enabled: tocPopoverEnabled,\n    component: tocPopover,\n    ...tocPopoverOptions\n  } = {},\n  tableOfContent: { enabled: tocEnabled, component: tocReplace, ...tocOptions } = {},\n  toc = [],\n  children,\n  className,\n}: DocsPageProps) {\n  // disable TOC on full mode, you can still enable it with `enabled` option.\n  tocEnabled ??=\n    !full && (toc.length > 0 || tocOptions.footer !== undefined || tocOptions.header !== undefined);\n\n  tocPopoverEnabled ??=\n    toc.length > 0 ||\n    tocPopoverOptions.header !== undefined ||\n    tocPopoverOptions.footer !== undefined;\n\n  let wrapper = (children: ReactNode) => children;\n\n  if (tocEnabled || tocPopoverEnabled) {\n    wrapper = (children) => (\n      <TOCProvider single={tocOptions.single} toc={toc}>\n        {children}\n      </TOCProvider>\n    );\n  }\n\n  return wrapper(\n    <>\n      {tocPopoverEnabled &&\n        (tocPopover ?? (\n          <PageTOCPopover>\n            <PageTOCPopoverTrigger />\n            <PageTOCPopoverContent>\n              {tocPopoverOptions.header}\n              <TOCScrollArea>\n                {tocPopoverOptions.style === 'clerk' ? (\n                  <TocClerk.TOCItems />\n                ) : (\n                  <TocDefault.TOCItems />\n                )}\n              </TOCScrollArea>\n              {tocPopoverOptions.footer}\n            </PageTOCPopoverContent>\n          </PageTOCPopover>\n        ))}\n      <article\n        id=\"nd-page\"\n        data-full={full}\n        className={cn(\n          'flex flex-col [grid-area:main] px-4 py-6 gap-4 md:px-6 md:pt-8 xl:px-8 xl:pt-14 *:max-w-[900px]',\n          full && '*:max-w-[1285px]',\n          className,\n        )}\n      >\n        {breadcrumbEnabled && (breadcrumb ?? <PageBreadcrumb {...breadcrumbProps} />)}\n        {children}\n        {footerEnabled !== false && (footerReplace ?? <PageFooter {...footerProps} />)}\n      </article>\n      {tocEnabled &&\n        (tocReplace ?? (\n          <div\n            id=\"nd-toc\"\n            className=\"sticky top-(--fd-docs-row-3) [grid-area:toc] h-[calc(var(--fd-docs-height)-var(--fd-docs-row-3))] flex flex-col w-(--fd-toc-width) pt-12 pe-4 pb-2 xl:layout:[--fd-toc-width:268px] max-xl:hidden\"\n          >\n            {tocOptions.header}\n            <h3\n              id=\"toc-title\"\n              className=\"inline-flex items-center gap-1.5 text-sm text-fd-muted-foreground\"\n            >\n              <Text className=\"size-4\" />\n              <I18nLabel label=\"toc\" />\n            </h3>\n            <TOCScrollArea>\n              {tocOptions.style === 'clerk' ? <TocClerk.TOCItems /> : <TocDefault.TOCItems />}\n            </TOCScrollArea>\n            {tocOptions.footer}\n          </div>\n        ))}\n    </>,\n  );\n}\n\nexport function EditOnGitHub(props: ComponentProps<'a'>) {\n  return (\n    <a\n      target=\"_blank\"\n      rel=\"noreferrer noopener\"\n      {...props}\n      className={cn(\n        buttonVariants({\n          color: 'secondary',\n          size: 'sm',\n          className: 'gap-1.5 not-prose',\n        }),\n        props.className,\n      )}\n    >\n      {props.children ?? (\n        <>\n          <Edit className=\"size-3.5\" />\n          <I18nLabel label=\"editOnGithub\" />\n        </>\n      )}\n    </a>\n  );\n}\n\n/**\n * Add typography styles\n */\nexport function DocsBody({ children, className, ...props }: ComponentProps<'div'>) {\n  return (\n    <div {...props} className={cn('prose flex-1', className)}>\n      {children}\n    </div>\n  );\n}\n\nexport function DocsDescription({ children, className, ...props }: ComponentProps<'p'>) {\n  // Don't render if no description provided\n  if (children === undefined) return null;\n\n  return (\n    <p {...props} className={cn('mb-8 text-lg text-fd-muted-foreground', className)}>\n      {children}\n    </p>\n  );\n}\n\nexport function DocsTitle({ children, className, ...props }: ComponentProps<'h1'>) {\n  return (\n    <h1 {...props} className={cn('text-[1.75em] font-semibold', className)}>\n      {children}\n    </h1>\n  );\n}\n\nexport { PageLastUpdate, PageBreadcrumb } from './client';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAmFA,SAAgB,SAAS,EACvB,YAAY,EAAE,SAAS,oBAAoB,MAAM,WAAW,YAAY,GAAG,oBAAoB,EAAE,EACjG,QAAQ,EAAE,SAAS,eAAe,WAAW,eAAe,GAAG,gBAAgB,EAAE,EACjF,OAAO,OACP,uBAAuB,EACrB,SAAS,mBACT,WAAW,YACX,GAAG,sBACD,EAAE,EACN,gBAAgB,EAAE,SAAS,YAAY,WAAW,YAAY,GAAG,eAAe,EAAE,EAClF,MAAM,EAAE,EACR,UACA,aACgB;AAEhB,gBACE,CAAC,SAAS,IAAI,SAAS,KAAK,WAAW,WAAW,UAAa,WAAW,WAAW;AAEvF,uBACE,IAAI,SAAS,KACb,kBAAkB,WAAW,UAC7B,kBAAkB,WAAW;CAE/B,IAAI,WAAW,aAAwB;AAEvC,KAAI,cAAc,kBAChB,YAAW,aACT,oBAAC;EAAY,QAAQ,WAAW;EAAa;EAC1C;GACW;AAIlB,QAAO,QACL;EACG,sBACE,cACC,qBAAC,6BACC,oBAAC,0BAAwB,EACzB,qBAAC;GACE,kBAAkB;GACnB,oBAAC,2BACE,kBAAkB,UAAU,UAC3B,oBAACA,eAAoB,GAErB,oBAACC,aAAsB,GAEX;GACf,kBAAkB;MACG,IACT;EAErB,qBAAC;GACC,IAAG;GACH,aAAW;GACX,WAAW,GACT,mGACA,QAAQ,oBACR,UACD;;IAEA,sBAAsB,cAAc,oBAAC,kBAAe,GAAI,kBAAmB;IAC3E;IACA,kBAAkB,UAAU,iBAAiB,oBAAC,cAAW,GAAI,cAAe;;IACrE;EACT,eACE,cACC,qBAAC;GACC,IAAG;GACH,WAAU;;IAET,WAAW;IACZ,qBAAC;KACC,IAAG;KACH,WAAU;gBAEV,oBAAC,QAAK,WAAU,WAAW,EAC3B,oBAAC,aAAU,OAAM,QAAQ;MACtB;IACL,oBAAC,2BACE,WAAW,UAAU,UAAU,oBAACD,eAAoB,GAAG,oBAACC,aAAsB,GACjE;IACf,WAAW;;IACR;KAET,CACJ;;AAGH,SAAgB,aAAa,OAA4B;AACvD,QACE,oBAAC;EACC,QAAO;EACP,KAAI;EACJ,GAAI;EACJ,WAAW,GACT,eAAe;GACb,OAAO;GACP,MAAM;GACN,WAAW;GACZ,CAAC,EACF,MAAM,UACP;YAEA,MAAM,YACL,4CACE,oBAAC,QAAK,WAAU,aAAa,EAC7B,oBAAC,aAAU,OAAM,iBAAiB,IACjC;GAEH;;;;;AAOR,SAAgB,SAAS,EAAE,UAAU,WAAW,GAAG,SAAgC;AACjF,QACE,oBAAC;EAAI,GAAI;EAAO,WAAW,GAAG,gBAAgB,UAAU;EACrD;GACG;;AAIV,SAAgB,gBAAgB,EAAE,UAAU,WAAW,GAAG,SAA8B;AAEtF,KAAI,aAAa,OAAW,QAAO;AAEnC,QACE,oBAAC;EAAE,GAAI;EAAO,WAAW,GAAG,yCAAyC,UAAU;EAC5E;GACC;;AAIR,SAAgB,UAAU,EAAE,UAAU,WAAW,GAAG,SAA+B;AACjF,QACE,oBAAC;EAAG,GAAI;EAAO,WAAW,GAAG,+BAA+B,UAAU;EACnE;GACE"}

package/dist/layouts/notebook/sidebar.d.ts

@@ -1,9 +1,10 @@
 import { SidebarCollapseTrigger as SidebarCollapseTrigger$1, SidebarDrawerContent, SidebarFolder as SidebarFolder$1, SidebarFolderContent as SidebarFolderContent$1, SidebarFolderLink as SidebarFolderLink$1, SidebarFolderTrigger as SidebarFolderTrigger$1, SidebarItem as SidebarItem$1, SidebarProvider, SidebarTrigger as SidebarTrigger$1, SidebarViewport as SidebarViewport$1 } from "../../components/sidebar/base.js";
+import { LinkItemType } from "../../utils/link-item.js";
 import { SidebarPageTreeComponents } from "../../components/sidebar/page-tree.js";
-import { cn } from "@hanzo/docs-ui/cn";
-import * as react_jsx_runtime33 from "react/jsx-runtime";
-import * as react2 from "react";
+import "../shared/index.js";
+import * as react from "react";
 import { ComponentProps } from "react";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
 
 //#region src/layouts/notebook/sidebar.d.ts
 declare const Sidebar: typeof SidebarProvider, SidebarFolder: typeof SidebarFolder$1, SidebarCollapseTrigger: typeof SidebarCollapseTrigger$1, SidebarViewport: typeof SidebarViewport$1, SidebarTrigger: typeof SidebarTrigger$1;
@@ -12,48 +13,48 @@ declare function SidebarContent({
   className,
   children,
   ...props
-}: ComponentProps<'aside'>): react_jsx_runtime33.JSX.Element;
+}: ComponentProps<'aside'>): react_jsx_runtime0.JSX.Element;
 declare function SidebarDrawer({
   children,
   className,
   ...props
-}: ComponentProps<typeof SidebarDrawerContent>): react_jsx_runtime33.JSX.Element;
+}: ComponentProps<typeof SidebarDrawerContent>): react_jsx_runtime0.JSX.Element;
 declare function SidebarSeparator({
   className,
   style,
   children,
   ...props
-}: ComponentProps<'p'>): react_jsx_runtime33.JSX.Element;
+}: ComponentProps<'p'>): react_jsx_runtime0.JSX.Element;
 declare function SidebarItem({
   className,
   style,
   children,
   ...props
-}: ComponentProps<typeof SidebarItem$1>): react_jsx_runtime33.JSX.Element;
+}: ComponentProps<typeof SidebarItem$1>): react_jsx_runtime0.JSX.Element;
 declare function SidebarFolderTrigger({
   className,
   style,
   ...props
-}: ComponentProps<typeof SidebarFolderTrigger$1>): react_jsx_runtime33.JSX.Element;
+}: ComponentProps<typeof SidebarFolderTrigger$1>): react_jsx_runtime0.JSX.Element;
 declare function SidebarFolderLink({
   className,
   style,
   ...props
-}: ComponentProps<typeof SidebarFolderLink$1>): react_jsx_runtime33.JSX.Element;
+}: ComponentProps<typeof SidebarFolderLink$1>): react_jsx_runtime0.JSX.Element;
 declare function SidebarFolderContent({
   className,
   children,
   ...props
-}: ComponentProps<typeof SidebarFolderContent$1>): react_jsx_runtime33.JSX.Element;
-declare const SidebarPageTree: (components: Partial<SidebarPageTreeComponents>) => react_jsx_runtime33.JSX.Element;
+}: ComponentProps<typeof SidebarFolderContent$1>): react_jsx_runtime0.JSX.Element;
+declare const SidebarPageTree: (components: Partial<SidebarPageTreeComponents>) => react_jsx_runtime0.JSX.Element;
 declare const SidebarLinkItem: ({
   item,
   ...props
-}: react2.HTMLAttributes<HTMLElement> & {
-  item: Exclude<cn, {
+}: react.HTMLAttributes<HTMLElement> & {
+  item: Exclude<LinkItemType, {
     type: "icon";
   }>;
-}) => react_jsx_runtime33.JSX.Element;
+}) => react_jsx_runtime0.JSX.Element;
 //#endregion
 export { Sidebar, SidebarCollapseTrigger, SidebarContent, SidebarDrawer, SidebarFolder, SidebarFolderContent, SidebarFolderLink, SidebarFolderTrigger, SidebarItem, SidebarLinkItem, SidebarPageTree, SidebarSeparator, SidebarTrigger, SidebarViewport };
 //# sourceMappingURL=sidebar.d.ts.map

package/dist/layouts/notebook/sidebar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"sidebar.d.ts","names":[],"sources":["../../../src/layouts/notebook/sidebar.tsx"],"sourcesContent":[],"mappings":";;;;;;;;cA+BmB,gBAAO,uCACX,gDACS,kDACP,0CACD;iBAGA,cAAA;OACT;;;;GAIJ,0BAAuB,mBAAA,CAAA,GAAA,CAAA;iBA+CV,aAAA;;;;GAIb,sBAAsB,wBAA0B,mBAAA,CAAA,GAAA,CAAA;iBAiBnC,gBAAA;;;;;GAA2D,sBAAmB,mBAAA,CAAA,GAAA,CAAA;iBAiB9E,WAAA;;;;;GAKb,sBAAsB,iBAAiB,mBAAA,CAAA,GAAA,CAAA;AAtGvB,iBAuHH,oBAAA,CAvHU;EAAA,SAAA;EAAA,KAAA;EAAA,GAAA;AAAA,CAAA,EA2HvB,cA3HuB,CAAA,OA2HD,sBA3HC,CAAA,CAAA,EA2HyB,mBAAA,CAAA,GAAA,CAAA,OA3HzB;AAAA,iBAkJV,iBAAA,CAlJU;EAAA,SAAA;EAAA,KAAA;EAAA,GAAA;AAAA,CAAA,EAsJvB,cAtJuB,CAAA,OAsJD,mBAtJC,CAAA,CAAA,EAsJsB,mBAAA,CAAA,GAAA,CAAA,OAtJtB;AACX,iBAsKC,oBAAA,CAtKD;EAAA,SAAA;EAAA,QAAA;EAAA,GAAA;AAAA,CAAA,EA0KZ,cA1KY,CAAA,OA0KU,sBA1KV,CAAA,CAAA,EA0KoC,mBAAA,CAAA,GAAA,CAAA,OA1KpC;AACS,cA4LX,eA5LW,EAAA,CAAA,UAAA,EA4LI,OA5LJ,CAmMtB,yBAAA,CAnMsB,EAAA,GA4LI,mBAAA,CAAA,GAAA,CAAA,OA5LJ;AACP,cAoMJ,eApMI,EAAA,CAAA;EAAA,IAAA;EAAA,GAAA;CAAA,EAoMW,MAAA,CAAA,cApMX,CAoMW,WApMX,CAAA,GAAA;EACD,IAAA,SAAA,GAAA,EAAA;IACR,IAAA,EAAA,MAAA;EAJN,CAAA,CAAA;qCACA"}
+{"version":3,"file":"sidebar.d.ts","names":[],"sources":["../../../src/layouts/notebook/sidebar.tsx"],"mappings":";;;;;;;;;cA+BmB,OAAA,SAAO,eAAA,EAAA,aAAA,SACX,eAAA,EAAA,sBAAA,SACS,wBAAA,EAAA,eAAA,SACP,iBAAA,EAAA,cAAA,SACD,gBAAA;AAAA,iBAGA,cAAA,CAAA;EACd,GAAA,EAAK,OAAA;EACL,SAAA;EACA,QAAA;EAAA,GACG;AAAA,GACF,cAAA,YAAuB,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBA+CV,aAAA,CAAA;EACd,QAAA;EACA,SAAA;EAAA,GACG;AAAA,GACF,cAAA,QAAsB,oBAAA,IAA0B,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAiBnC,gBAAA,CAAA;EAAmB,SAAA;EAAW,KAAA;EAAO,QAAA;EAAA,GAAa;AAAA,GAAS,cAAA,QAAmB,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAiB9E,WAAA,CAAA;EACd,SAAA;EACA,KAAA;EACA,QAAA;EAAA,GACG;AAAA,GACF,cAAA,QAAsB,aAAA,IAAiB,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAiB1B,oBAAA,CAAA;EACd,SAAA;EACA,KAAA;EAAA,GACG;AAAA,GACF,cAAA,QAAsB,sBAAA,IAA0B,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAuBnC,iBAAA,CAAA;EACd,SAAA;EACA,KAAA;EAAA,GACG;AAAA,GACF,cAAA,QAAsB,mBAAA,IAAuB,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAiBhC,oBAAA,CAAA;EACd,SAAA;EACA,QAAA;EAAA,GACG;AAAA,GACF,cAAA,QAAsB,sBAAA,IAA0B,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,cAmBtC,eAAA,GAAe,UAAA,EAAA,OAAA,CAO1B,yBAAA,MAP0B,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,cASf,eAAA;EAAe,IAAA;EAAA,GAAA;AAAA,GAAA,KAAA,CAAA,cAAA,CAAA,WAAA;gBAAA,YAAA"}

package/dist/layouts/notebook/sidebar.js

@@ -1,14 +1,14 @@
 'use client';
 
+import { cn } from "../../utils/cn.js";
+import { mergeRefs } from "../../utils/merge-refs.js";
 import { SidebarContent as SidebarContent$1, SidebarDrawerContent, SidebarDrawerOverlay, SidebarFolderContent as SidebarFolderContent$1, SidebarFolderLink as SidebarFolderLink$1, SidebarFolderTrigger as SidebarFolderTrigger$1, SidebarItem as SidebarItem$1, SidebarSeparator as SidebarSeparator$1, base_exports, useFolder, useFolderDepth } from "../../components/sidebar/base.js";
 import { LayoutContext } from "./client.js";
 import { createLinkItemRenderer } from "../../components/sidebar/link-item.js";
 import { createPageTreeRenderer } from "../../components/sidebar/page-tree.js";
-import { cn } from "@hanzo/docs-ui/cn";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { use, useRef } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { cva } from "class-variance-authority";
-import { mergeRefs } from "@hanzo/docs-ui/merge-refs";
 
 //#region src/layouts/notebook/sidebar.tsx
 const itemVariants = cva("relative flex flex-row items-center gap-2 rounded-lg p-2 text-start text-fd-muted-foreground wrap-anywhere [&_svg]:size-4 [&_svg]:shrink-0", { variants: {
@@ -44,7 +44,7 @@ function SidebarContent({ ref: refProp, className, children, ...props }) {
 	}) });
 }
 function SidebarDrawer({ children, className, ...props }) {
-	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(SidebarDrawerOverlay, { className: "fixed z-40 inset-0 backdrop-blur-xs data-[state=open]:animate-fd-fade-in data-[state=closed]:animate-fd-fade-out" }), /* @__PURE__ */ jsx(SidebarDrawerContent, {
+	return /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(SidebarDrawerOverlay, { className: "fixed z-40 inset-0 backdrop-blur-xs data-[state=open]:animate-fd-fade-in data-[state=closed]:animate-fd-fade-out" }), /* @__PURE__ */ jsx(SidebarDrawerContent, {
 		className: cn("fixed text-[0.9375rem] flex flex-col shadow-lg border-s end-0 inset-y-0 w-[85%] max-w-[380px] z-40 bg-fd-background data-[state=open]:animate-fd-sidebar-in data-[state=closed]:animate-fd-sidebar-out", className),
 		...props,
 		children

package/dist/layouts/notebook/sidebar.js.map

@@ -1 +1 @@
-{"version":3,"file":"sidebar.js","names":["Base","Base.SidebarContent","Base.SidebarDrawerOverlay","Base.SidebarDrawerContent","Base.useFolderDepth","Base.SidebarSeparator","Base.SidebarItem","Base.useFolder","Base.SidebarFolderTrigger","Base.SidebarFolderLink","Base.SidebarFolderContent"],"sources":["../../../src/layouts/notebook/sidebar.tsx"],"sourcesContent":["'use client';\nimport * as Base from '@/components/sidebar/base';\nimport { cn } from '@hanzo/docs-ui/cn';\nimport { type ComponentProps, use, useRef } from 'react';\nimport { cva } from 'class-variance-authority';\nimport { LayoutContext } from './client';\nimport { createPageTreeRenderer } from '@/components/sidebar/page-tree';\nimport { createLinkItemRenderer } from '@/components/sidebar/link-item';\nimport { mergeRefs } from '@hanzo/docs-ui/merge-refs';\n\nconst itemVariants = cva(\n  'relative flex flex-row items-center gap-2 rounded-lg p-2 text-start text-fd-muted-foreground wrap-anywhere [&_svg]:size-4 [&_svg]:shrink-0',\n  {\n    variants: {\n      variant: {\n        link: 'transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none data-[active=true]:bg-fd-primary/10 data-[active=true]:text-fd-primary data-[active=true]:hover:transition-colors',\n        button:\n          'transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none',\n      },\n      highlight: {\n        true: \"data-[active=true]:before:content-[''] data-[active=true]:before:bg-fd-primary data-[active=true]:before:absolute data-[active=true]:before:w-px data-[active=true]:before:inset-y-2.5 data-[active=true]:before:start-2.5\",\n      },\n    },\n  },\n);\n\nfunction getItemOffset(depth: number) {\n  return `calc(${2 + 3 * depth} * var(--spacing))`;\n}\n\nexport const {\n  SidebarProvider: Sidebar,\n  SidebarFolder,\n  SidebarCollapseTrigger,\n  SidebarViewport,\n  SidebarTrigger,\n} = Base;\n\nexport function SidebarContent({\n  ref: refProp,\n  className,\n  children,\n  ...props\n}: ComponentProps<'aside'>) {\n  const { navMode } = use(LayoutContext)!;\n  const ref = useRef<HTMLElement>(null);\n\n  return (\n    <Base.SidebarContent>\n      {({ collapsed, hovered, ref: asideRef, ...rest }) => (\n        <div\n          data-sidebar-placeholder=\"\"\n          className={cn(\n            'sticky z-20 [grid-area:sidebar] pointer-events-none *:pointer-events-auto md:layout:[--fd-sidebar-width:268px] max-md:hidden',\n            navMode === 'auto'\n              ? 'top-(--fd-docs-row-1) h-[calc(var(--fd-docs-height)-var(--fd-docs-row-1))]'\n              : 'top-(--fd-docs-row-2) h-[calc(var(--fd-docs-height)-var(--fd-docs-row-2))]',\n          )}\n        >\n          {collapsed && <div className=\"absolute start-0 inset-y-0 w-4\" {...rest} />}\n          <aside\n            id=\"nd-sidebar\"\n            ref={mergeRefs(ref, refProp, asideRef)}\n            data-collapsed={collapsed}\n            data-hovered={collapsed && hovered}\n            className={cn(\n              'absolute flex flex-col w-full start-0 inset-y-0 items-end text-sm duration-250 *:w-(--fd-sidebar-width)',\n              navMode === 'auto' && 'bg-fd-card border-e',\n              collapsed && [\n                'inset-y-2 rounded-xl bg-fd-card transition-transform border w-(--fd-sidebar-width)',\n                hovered\n                  ? 'shadow-lg translate-x-2 rtl:-translate-x-2'\n                  : '-translate-x-(--fd-sidebar-width) rtl:translate-x-full',\n              ],\n              ref.current &&\n                (ref.current.getAttribute('data-collapsed') === 'true') !== collapsed &&\n                'transition-[width,inset-block,translate,background-color]',\n              className,\n            )}\n            {...props}\n            {...rest}\n          >\n            {children}\n          </aside>\n        </div>\n      )}\n    </Base.SidebarContent>\n  );\n}\n\nexport function SidebarDrawer({\n  children,\n  className,\n  ...props\n}: ComponentProps<typeof Base.SidebarDrawerContent>) {\n  return (\n    <>\n      <Base.SidebarDrawerOverlay className=\"fixed z-40 inset-0 backdrop-blur-xs data-[state=open]:animate-fd-fade-in data-[state=closed]:animate-fd-fade-out\" />\n      <Base.SidebarDrawerContent\n        className={cn(\n          'fixed text-[0.9375rem] flex flex-col shadow-lg border-s end-0 inset-y-0 w-[85%] max-w-[380px] z-40 bg-fd-background data-[state=open]:animate-fd-sidebar-in data-[state=closed]:animate-fd-sidebar-out',\n          className,\n        )}\n        {...props}\n      >\n        {children}\n      </Base.SidebarDrawerContent>\n    </>\n  );\n}\n\nexport function SidebarSeparator({ className, style, children, ...props }: ComponentProps<'p'>) {\n  const depth = Base.useFolderDepth();\n\n  return (\n    <Base.SidebarSeparator\n      className={cn('[&_svg]:size-4 [&_svg]:shrink-0', className)}\n      style={{\n        paddingInlineStart: getItemOffset(depth),\n        ...style,\n      }}\n      {...props}\n    >\n      {children}\n    </Base.SidebarSeparator>\n  );\n}\n\nexport function SidebarItem({\n  className,\n  style,\n  children,\n  ...props\n}: ComponentProps<typeof Base.SidebarItem>) {\n  const depth = Base.useFolderDepth();\n\n  return (\n    <Base.SidebarItem\n      className={cn(itemVariants({ variant: 'link', highlight: depth >= 1 }), className)}\n      style={{\n        paddingInlineStart: getItemOffset(depth),\n        ...style,\n      }}\n      {...props}\n    >\n      {children}\n    </Base.SidebarItem>\n  );\n}\n\nexport function SidebarFolderTrigger({\n  className,\n  style,\n  ...props\n}: ComponentProps<typeof Base.SidebarFolderTrigger>) {\n  const { depth, collapsible } = Base.useFolder()!;\n\n  return (\n    <Base.SidebarFolderTrigger\n      className={(s) =>\n        cn(\n          itemVariants({ variant: collapsible ? 'button' : null }),\n          'w-full',\n          typeof className === 'function' ? className(s) : className,\n        )\n      }\n      style={{\n        paddingInlineStart: getItemOffset(depth - 1),\n        ...style,\n      }}\n      {...props}\n    >\n      {props.children}\n    </Base.SidebarFolderTrigger>\n  );\n}\n\nexport function SidebarFolderLink({\n  className,\n  style,\n  ...props\n}: ComponentProps<typeof Base.SidebarFolderLink>) {\n  const depth = Base.useFolderDepth();\n\n  return (\n    <Base.SidebarFolderLink\n      className={cn(itemVariants({ variant: 'link', highlight: depth > 1 }), 'w-full', className)}\n      style={{\n        paddingInlineStart: getItemOffset(depth - 1),\n        ...style,\n      }}\n      {...props}\n    >\n      {props.children}\n    </Base.SidebarFolderLink>\n  );\n}\n\nexport function SidebarFolderContent({\n  className,\n  children,\n  ...props\n}: ComponentProps<typeof Base.SidebarFolderContent>) {\n  const depth = Base.useFolderDepth();\n\n  return (\n    <Base.SidebarFolderContent\n      className={(s) =>\n        cn(\n          'relative',\n          depth === 1 &&\n            \"before:content-[''] before:absolute before:w-px before:inset-y-1 before:bg-fd-border before:start-2.5\",\n          typeof className === 'function' ? className(s) : className,\n        )\n      }\n      {...props}\n    >\n      {children}\n    </Base.SidebarFolderContent>\n  );\n}\nexport const SidebarPageTree = createPageTreeRenderer({\n  SidebarFolder,\n  SidebarFolderContent,\n  SidebarFolderLink,\n  SidebarFolderTrigger,\n  SidebarItem,\n  SidebarSeparator,\n});\n\nexport const SidebarLinkItem = createLinkItemRenderer({\n  SidebarFolder,\n  SidebarFolderContent,\n  SidebarFolderLink,\n  SidebarFolderTrigger,\n  SidebarItem,\n});\n"],"mappings":"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"}
+{"version":3,"file":"sidebar.js","names":["Base","Base.SidebarContent","Base.SidebarDrawerOverlay","Base.SidebarDrawerContent","Base.useFolderDepth","Base.SidebarSeparator","Base.SidebarItem","Base.useFolder","Base.SidebarFolderTrigger","Base.SidebarFolderLink","Base.SidebarFolderContent"],"sources":["../../../src/layouts/notebook/sidebar.tsx"],"sourcesContent":["'use client';\nimport * as Base from '@/components/sidebar/base';\nimport { cn } from '@/utils/cn';\nimport { type ComponentProps, use, useRef } from 'react';\nimport { cva } from 'class-variance-authority';\nimport { LayoutContext } from './client';\nimport { createPageTreeRenderer } from '@/components/sidebar/page-tree';\nimport { createLinkItemRenderer } from '@/components/sidebar/link-item';\nimport { mergeRefs } from '@/utils/merge-refs';\n\nconst itemVariants = cva(\n  'relative flex flex-row items-center gap-2 rounded-lg p-2 text-start text-fd-muted-foreground wrap-anywhere [&_svg]:size-4 [&_svg]:shrink-0',\n  {\n    variants: {\n      variant: {\n        link: 'transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none data-[active=true]:bg-fd-primary/10 data-[active=true]:text-fd-primary data-[active=true]:hover:transition-colors',\n        button:\n          'transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none',\n      },\n      highlight: {\n        true: \"data-[active=true]:before:content-[''] data-[active=true]:before:bg-fd-primary data-[active=true]:before:absolute data-[active=true]:before:w-px data-[active=true]:before:inset-y-2.5 data-[active=true]:before:start-2.5\",\n      },\n    },\n  },\n);\n\nfunction getItemOffset(depth: number) {\n  return `calc(${2 + 3 * depth} * var(--spacing))`;\n}\n\nexport const {\n  SidebarProvider: Sidebar,\n  SidebarFolder,\n  SidebarCollapseTrigger,\n  SidebarViewport,\n  SidebarTrigger,\n} = Base;\n\nexport function SidebarContent({\n  ref: refProp,\n  className,\n  children,\n  ...props\n}: ComponentProps<'aside'>) {\n  const { navMode } = use(LayoutContext)!;\n  const ref = useRef<HTMLElement>(null);\n\n  return (\n    <Base.SidebarContent>\n      {({ collapsed, hovered, ref: asideRef, ...rest }) => (\n        <div\n          data-sidebar-placeholder=\"\"\n          className={cn(\n            'sticky z-20 [grid-area:sidebar] pointer-events-none *:pointer-events-auto md:layout:[--fd-sidebar-width:268px] max-md:hidden',\n            navMode === 'auto'\n              ? 'top-(--fd-docs-row-1) h-[calc(var(--fd-docs-height)-var(--fd-docs-row-1))]'\n              : 'top-(--fd-docs-row-2) h-[calc(var(--fd-docs-height)-var(--fd-docs-row-2))]',\n          )}\n        >\n          {collapsed && <div className=\"absolute start-0 inset-y-0 w-4\" {...rest} />}\n          <aside\n            id=\"nd-sidebar\"\n            ref={mergeRefs(ref, refProp, asideRef)}\n            data-collapsed={collapsed}\n            data-hovered={collapsed && hovered}\n            className={cn(\n              'absolute flex flex-col w-full start-0 inset-y-0 items-end text-sm duration-250 *:w-(--fd-sidebar-width)',\n              navMode === 'auto' && 'bg-fd-card border-e',\n              collapsed && [\n                'inset-y-2 rounded-xl bg-fd-card transition-transform border w-(--fd-sidebar-width)',\n                hovered\n                  ? 'shadow-lg translate-x-2 rtl:-translate-x-2'\n                  : '-translate-x-(--fd-sidebar-width) rtl:translate-x-full',\n              ],\n              ref.current &&\n                (ref.current.getAttribute('data-collapsed') === 'true') !== collapsed &&\n                'transition-[width,inset-block,translate,background-color]',\n              className,\n            )}\n            {...props}\n            {...rest}\n          >\n            {children}\n          </aside>\n        </div>\n      )}\n    </Base.SidebarContent>\n  );\n}\n\nexport function SidebarDrawer({\n  children,\n  className,\n  ...props\n}: ComponentProps<typeof Base.SidebarDrawerContent>) {\n  return (\n    <>\n      <Base.SidebarDrawerOverlay className=\"fixed z-40 inset-0 backdrop-blur-xs data-[state=open]:animate-fd-fade-in data-[state=closed]:animate-fd-fade-out\" />\n      <Base.SidebarDrawerContent\n        className={cn(\n          'fixed text-[0.9375rem] flex flex-col shadow-lg border-s end-0 inset-y-0 w-[85%] max-w-[380px] z-40 bg-fd-background data-[state=open]:animate-fd-sidebar-in data-[state=closed]:animate-fd-sidebar-out',\n          className,\n        )}\n        {...props}\n      >\n        {children}\n      </Base.SidebarDrawerContent>\n    </>\n  );\n}\n\nexport function SidebarSeparator({ className, style, children, ...props }: ComponentProps<'p'>) {\n  const depth = Base.useFolderDepth();\n\n  return (\n    <Base.SidebarSeparator\n      className={cn('[&_svg]:size-4 [&_svg]:shrink-0', className)}\n      style={{\n        paddingInlineStart: getItemOffset(depth),\n        ...style,\n      }}\n      {...props}\n    >\n      {children}\n    </Base.SidebarSeparator>\n  );\n}\n\nexport function SidebarItem({\n  className,\n  style,\n  children,\n  ...props\n}: ComponentProps<typeof Base.SidebarItem>) {\n  const depth = Base.useFolderDepth();\n\n  return (\n    <Base.SidebarItem\n      className={cn(itemVariants({ variant: 'link', highlight: depth >= 1 }), className)}\n      style={{\n        paddingInlineStart: getItemOffset(depth),\n        ...style,\n      }}\n      {...props}\n    >\n      {children}\n    </Base.SidebarItem>\n  );\n}\n\nexport function SidebarFolderTrigger({\n  className,\n  style,\n  ...props\n}: ComponentProps<typeof Base.SidebarFolderTrigger>) {\n  const { depth, collapsible } = Base.useFolder()!;\n\n  return (\n    <Base.SidebarFolderTrigger\n      className={(s) =>\n        cn(\n          itemVariants({ variant: collapsible ? 'button' : null }),\n          'w-full',\n          typeof className === 'function' ? className(s) : className,\n        )\n      }\n      style={{\n        paddingInlineStart: getItemOffset(depth - 1),\n        ...style,\n      }}\n      {...props}\n    >\n      {props.children}\n    </Base.SidebarFolderTrigger>\n  );\n}\n\nexport function SidebarFolderLink({\n  className,\n  style,\n  ...props\n}: ComponentProps<typeof Base.SidebarFolderLink>) {\n  const depth = Base.useFolderDepth();\n\n  return (\n    <Base.SidebarFolderLink\n      className={cn(itemVariants({ variant: 'link', highlight: depth > 1 }), 'w-full', className)}\n      style={{\n        paddingInlineStart: getItemOffset(depth - 1),\n        ...style,\n      }}\n      {...props}\n    >\n      {props.children}\n    </Base.SidebarFolderLink>\n  );\n}\n\nexport function SidebarFolderContent({\n  className,\n  children,\n  ...props\n}: ComponentProps<typeof Base.SidebarFolderContent>) {\n  const depth = Base.useFolderDepth();\n\n  return (\n    <Base.SidebarFolderContent\n      className={(s) =>\n        cn(\n          'relative',\n          depth === 1 &&\n            \"before:content-[''] before:absolute before:w-px before:inset-y-1 before:bg-fd-border before:start-2.5\",\n          typeof className === 'function' ? className(s) : className,\n        )\n      }\n      {...props}\n    >\n      {children}\n    </Base.SidebarFolderContent>\n  );\n}\nexport const SidebarPageTree = createPageTreeRenderer({\n  SidebarFolder,\n  SidebarFolderContent,\n  SidebarFolderLink,\n  SidebarFolderTrigger,\n  SidebarItem,\n  SidebarSeparator,\n});\n\nexport const SidebarLinkItem = createLinkItemRenderer({\n  SidebarFolder,\n  SidebarFolderContent,\n  SidebarFolderLink,\n  SidebarFolderTrigger,\n  SidebarItem,\n});\n"],"mappings":"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"}

package/dist/layouts/shared/index.d.ts

@@ -1,9 +1,8 @@
-import * as react_jsx_runtime79 from "react/jsx-runtime";
-import * as react4 from "react";
+import { ButtonItemType, CustomItemType, IconItemType, LinkItem, LinkItemType, MainItemType, MenuItemType } from "../../utils/link-item.js";
+import * as react from "react";
 import { ComponentProps, ReactNode } from "react";
-import { LinkItemType } from "@hanzo/docs-radix-ui/link-item";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
 import { I18nConfig } from "@hanzo/docs-core/i18n";
-export * from "@hanzo/docs-radix-ui/link-item";
 
 //#region src/layouts/shared/index.d.ts
 interface NavOptions {
@@ -63,7 +62,15 @@ declare function resolveLinkItems({
 declare function renderTitleNav({
   title,
   url
-}: Partial<NavOptions>, props: ComponentProps<'a'>): string | number | bigint | boolean | react_jsx_runtime79.JSX.Element | Iterable<ReactNode> | Promise<string | number | bigint | boolean | react4.ReactPortal | react4.ReactElement<unknown, string | react4.JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | null | undefined;
+}: Partial<NavOptions>, props: ComponentProps<'a'>): string | number | bigint | boolean | react_jsx_runtime0.JSX.Element | Iterable<ReactNode> | Promise<string | number | bigint | boolean | react.ReactPortal | react.ReactElement<unknown, string | react.JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | null | undefined;
+declare function useLinkItems({
+  githubUrl,
+  links
+}: Pick<BaseLayoutProps, 'links' | 'githubUrl'>): {
+  navItems: LinkItemType[];
+  menuItems: LinkItemType[];
+  all: LinkItemType[];
+};
 //#endregion
-export { BaseLayoutProps, NavOptions, renderTitleNav, resolveLinkItems };
+export { BaseLayoutProps, ButtonItemType, CustomItemType, IconItemType, LinkItem, LinkItemType, MainItemType, MenuItemType, NavOptions, renderTitleNav, resolveLinkItems, useLinkItems };
 //# sourceMappingURL=index.d.ts.map

package/dist/layouts/shared/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","names":[],"sources":["../../../src/layouts/shared/index.tsx"],"sourcesContent":[],"mappings":";;;;;;;;UAKiB,UAAA;;aAEJ;UAEH,qBAAqB,wBAAwB;;;AAJvD;;EAIU,GAAA,CAAA,EAAA,MAAA;EAAqB;;;;AAkB/B;EAGgB,eAAA,CAAA,EAAA,QAAA,GAAA,KAAA,GAAA,MAAA;EAON,QAAA,CAAA,EAbG,SAaH;;AADM,UATC,eAAA,CASD;EAFC,WAAA,CAAA,EAAA;IAaE,OAAA,CAAA,EAAA,OAAA;IAOT,SAAA,CAAA,EAxBM,SAwBN;IAIM,IAAA,CAAA,EAAA,YAAA,GAAA,mBAAA;EAAR,CAAA;EAEK,YAAA,CAAA,EA1BI,OA0BJ,CAAA;IAAS,OAAA,EAAA,OAAA;IAMN,UAAA,EA9BA,OA8BgB,CAAA;MAC9B,EAAA,EA9BQ,SA8BR;MACA,EAAA,EA9BQ,SA8BR;IACM,CAAA,CAAA;EAAL,CAAA,CAAA;EAA+C;;AAoBlD;;;EACgC,IAAA,CAAA,EAAA,OAAA,GA3Cb,UA2Ca;EAAR;;;EACI,SAAA,CAAA,EAAA,MAAA;EAAA,KAAA,CAAA,EArClB,YAqCkB,EAAA;EAAA;;;EAAA,GAAA,CAAA,EAjCpB,OAiCoB,CAjCZ,UAiCY,CAAA;EAAA,QAAA,CAAA,EA/Bf,SA+Be;;;;;iBAzBZ,gBAAA;;;GAGb,KAAK,0CAA0C;iBAoBlC,cAAA;;;GACQ,QAAQ,oBACvB,2DAAmB,mBAAA,CAAA,GAAA,CAAA,OAAA,GAAA,SAAA,aAAA,6CAAA,MAAA,CAAA,WAAA,GAAA,MAAA,CAAA,+BAAA,MAAA,CAAA,8BAAA,SAAA"}
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../../src/layouts/shared/index.tsx"],"mappings":";;;;;;;UAKiB,UAAA;EACf,OAAA;EACA,SAAA,EAAW,SAAA;EAEX,KAAA,GAAQ,SAAA,KAAc,KAAA,EAAO,cAAA,UAAwB,SAAA;EAJtC;;;;EAUf,GAAA;EAN6B;;;;;EAa7B,eAAA;EAEA,QAAA,GAAW,SAAA;AAAA;AAAA,UAGI,eAAA;EACf,WAAA;IACE,OAAA;IACA,SAAA,GAAY,SAAA;IACZ,IAAA;EAAA;EAGF,YAAA,GAAe,OAAA;IACb,OAAA;IACA,UAAA,EAAY,OAAA;MACV,EAAA,EAAI,SAAA;MACJ,EAAA,EAAI,SAAA;IAAA;EAAA;;;;;;EASR,IAAA,aAAiB,UAAA;EAAA;;;EAKjB,SAAA;EAEA,KAAA,GAAQ,YAAA;EAMY;;;EAFpB,GAAA,GAAM,OAAA,CAAQ,UAAA;EAEd,QAAA,GAAW,SAAA;AAAA;;;;iBAMG,gBAAA,CAAA;EACd,KAAA;EACA;AAAA,GACC,IAAA,CAAK,eAAA,2BAA0C,YAAA;AAAA,iBAoBlC,cAAA,CAAA;EACZ,KAAA;EAAO;AAAA,GAAa,OAAA,CAAQ,UAAA,GAC9B,KAAA,EAAO,cAAA,6CAAmB,kBAAA,CAAA,GAAA,CAAA,OAAA,GAAA,QAAA,CAAA,SAAA,IAAA,OAAA,sCAAA,KAAA,CAAA,WAAA,GAAA,KAAA,CAAA,YAAA,mBAAA,KAAA,CAAA,qBAAA,SAAA,QAAA,CAAA,SAAA;AAAA,iBAUZ,YAAA,CAAA;EAAe,SAAA;EAAW;AAAA,GAAS,IAAA,CAAK,eAAA"}

package/dist/layouts/shared/index.js

@@ -1,5 +1,6 @@
-import Link from "@hanzo/docs-core/link";
+import { useMemo } from "react";
 import { jsx } from "react/jsx-runtime";
+import Link from "@hanzo/docs-core/link";
 
 //#region src/layouts/shared/index.tsx
 /**
@@ -33,7 +34,33 @@ function renderTitleNav({ title, url = "/" }, props) {
 		children: title
 	});
 }
+function useLinkItems({ githubUrl, links }) {
+	return useMemo(() => {
+		const all = resolveLinkItems({
+			links,
+			githubUrl
+		});
+		const navItems = [];
+		const menuItems = [];
+		for (const item of all) switch (item.on ?? "all") {
+			case "menu":
+				menuItems.push(item);
+				break;
+			case "nav":
+				navItems.push(item);
+				break;
+			default:
+				navItems.push(item);
+				menuItems.push(item);
+		}
+		return {
+			navItems,
+			menuItems,
+			all
+		};
+	}, [links, githubUrl]);
+}
 
 //#endregion
-export { renderTitleNav, resolveLinkItems };
+export { renderTitleNav, resolveLinkItems, useLinkItems };
 //# sourceMappingURL=index.js.map