@hanzo/ui 5.3.23 → 5.3.24

package/dist/index.js

@@ -45,6 +45,41 @@ var ToggleGroupPrimitive = require('@radix-ui/react-toggle-group');
 var NextImage = require('next/image');
 var Link2 = require('next/link');
 var Spline = require('@splinetool/react-spline');
+var _icons = require('@icons');
+var cn$1 = require('@/utils/cn');
+var button = require('@/components/ui/button');
+var Base = require('@/components/sidebar/base');
+var pageTree = require('@/components/sidebar/page-tree');
+var linkItem = require('@/components/sidebar/link-item');
+var searchToggle = require('@/layouts/shared/search-toggle');
+var mergeRefs = require('@/utils/merge-refs');
+var shared = require('@/layouts/shared');
+var linkItem$1 = require('@/layouts/shared/link-item');
+var languageToggle = require('@/layouts/shared/language-toggle');
+var framework = require('@hanzo/docs-core/framework');
+var isActive = require('@/utils/is-active');
+var Link5 = require('@hanzo/docs-core/link');
+var useIsScrollTop = require('@/utils/use-is-scroll-top');
+var tree = require('@/contexts/tree');
+var tabs = require('@/components/sidebar/tabs');
+var dropdown = require('@/components/sidebar/tabs/dropdown');
+var client = require('@/layouts/home/client');
+require('@/components/ui/popover');
+var i18n = require('@/contexts/i18n');
+var breadcrumb = require('@hanzo/docs-core/breadcrumb');
+var collapsible = require('@/components/ui/collapsible');
+var toc = require('@/components/toc');
+var toc$1 = require('@hanzo/docs-core/toc');
+var useFooterItems = require('@/utils/use-footer-items');
+var TocDefault = require('@/components/toc/default');
+var TocClerk = require('@/components/toc/clerk');
+var card = require('@/components/card');
+var callout = require('@/components/callout');
+var heading = require('@/components/heading');
+var codeblock = require('@/components/codeblock');
+var base = require('@/provider/base');
+var next = require('@hanzo/docs-core/framework/next');
+var source_star = require('@hanzo/docs-core/source');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
 
@@ -97,13 +132,30 @@ var ToggleGroupPrimitive__namespace = /*#__PURE__*/_interopNamespace(ToggleGroup
 var NextImage__default = /*#__PURE__*/_interopDefault(NextImage);
 var Link2__default = /*#__PURE__*/_interopDefault(Link2);
 var Spline__default = /*#__PURE__*/_interopDefault(Spline);
+var Base__namespace = /*#__PURE__*/_interopNamespace(Base);
+var Link5__default = /*#__PURE__*/_interopDefault(Link5);
+var TocDefault__namespace = /*#__PURE__*/_interopNamespace(TocDefault);
+var TocClerk__namespace = /*#__PURE__*/_interopNamespace(TocClerk);
+var source_star__namespace = /*#__PURE__*/_interopNamespace(source_star);
 
 var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
 var __export = (target, all) => {
   for (var name in all)
     __defProp(target, name, { get: all[name], enumerable: true });
 };
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget);
 function cn(...inputs) {
   return tailwindMerge.twMerge(clsx.clsx(inputs));
 }
@@ -1532,14 +1584,14 @@ var InputOTPGroup = React2__namespace.forwardRef(({ className, ...props }, ref)
 InputOTPGroup.displayName = "InputOTPGroup";
 var InputOTPSlot = React2__namespace.forwardRef(({ index, className, ...props }, ref) => {
   const inputOTPContext = React2__namespace.useContext(inputOtp.OTPInputContext);
-  const { char, hasFakeCaret, isActive } = inputOTPContext.slots[index];
+  const { char, hasFakeCaret, isActive: isActive3 } = inputOTPContext.slots[index];
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "div",
     {
       ref,
       className: cn(
         "relative flex h-9 w-9 items-center justify-center border-y border-r border-input text-sm shadow-sm transition-all first:rounded-l-md first:border-l last:rounded-r-md",
-        isActive && "z-10 ring-1 ring-ring",
+        isActive3 && "z-10 ring-1 ring-ring",
         className
       ),
       ...props,
@@ -8135,10 +8187,1662 @@ var HanzoIcon = /* @__PURE__ */ __name(({ className }) => {
     }
   );
 }, "HanzoIcon");
+var itemVariants = classVarianceAuthority.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: {
+      variant: {
+        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",
+        button: "transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none"
+      },
+      highlight: {
+        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"
+      }
+    }
+  }
+);
+function getItemOffset(depth) {
+  return `calc(${2 + 3 * depth} * var(--spacing))`;
+}
+__name(getItemOffset, "getItemOffset");
+var Sidebar = Base__namespace.SidebarProvider;
+var SidebarFolder2 = Base__namespace.SidebarFolder;
+var SidebarCollapseTrigger2 = Base__namespace.SidebarCollapseTrigger;
+var SidebarViewport2 = Base__namespace.SidebarViewport;
+var SidebarTrigger2 = Base__namespace.SidebarTrigger;
+function SidebarContent2({
+  ref: refProp,
+  className,
+  children,
+  ...props
+}) {
+  const ref = React2.useRef(null);
+  return /* @__PURE__ */ jsxRuntime.jsx(Base__namespace.SidebarContent, { children: ({ collapsed, hovered, ref: asideRef, ...rest }) => /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        "data-sidebar-placeholder": "",
+        className: "sticky top-(--fd-docs-row-1) z-20 [grid-area:sidebar] pointer-events-none *:pointer-events-auto h-[calc(var(--fd-docs-height)-var(--fd-docs-row-1))] md:layout:[--fd-sidebar-width:268px] max-md:hidden",
+        children: [
+          collapsed && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute start-0 inset-y-0 w-4", ...rest }),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "aside",
+            {
+              id: "nd-sidebar",
+              ref: mergeRefs.mergeRefs(ref, refProp, asideRef),
+              "data-collapsed": collapsed,
+              "data-hovered": collapsed && hovered,
+              className: cn$1.cn(
+                "absolute flex flex-col w-full start-0 inset-y-0 items-end bg-fd-card text-sm border-e duration-250 *:w-(--fd-sidebar-width)",
+                collapsed && [
+                  "inset-y-2 rounded-xl transition-transform border w-(--fd-sidebar-width)",
+                  hovered ? "shadow-lg translate-x-2 rtl:-translate-x-2" : "-translate-x-(--fd-sidebar-width) rtl:translate-x-full"
+                ],
+                ref.current && ref.current.getAttribute("data-collapsed") === "true" !== collapsed && "transition-[width,inset-block,translate,background-color]",
+                className
+              ),
+              ...props,
+              ...rest,
+              children
+            }
+          )
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        "data-sidebar-panel": "",
+        className: cn$1.cn(
+          "fixed flex top-[calc(--spacing(4)+var(--fd-toc-popover-height))] start-4 shadow-lg transition-opacity rounded-xl p-0.5 border bg-fd-muted text-fd-muted-foreground z-10",
+          (!collapsed || hovered) && "pointer-events-none opacity-0"
+        ),
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            SidebarCollapseTrigger2,
+            {
+              className: cn$1.cn(
+                button.buttonVariants({
+                  color: "ghost",
+                  size: "icon-sm",
+                  className: "rounded-lg"
+                })
+              ),
+              children: /* @__PURE__ */ jsxRuntime.jsx(_icons.Sidebar, {})
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(searchToggle.SearchToggle, { className: "rounded-lg", hideIfDisabled: true })
+        ]
+      }
+    )
+  ] }) });
+}
+__name(SidebarContent2, "SidebarContent");
+function SidebarDrawer({
+  children,
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(Base__namespace.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__ */ jsxRuntime.jsx(
+      Base__namespace.SidebarDrawerContent,
+      {
+        className: cn$1.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
+      }
+    )
+  ] });
+}
+__name(SidebarDrawer, "SidebarDrawer");
+function SidebarSeparator2({
+  className,
+  style,
+  children,
+  ...props
+}) {
+  const depth = Base__namespace.useFolderDepth();
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Base__namespace.SidebarSeparator,
+    {
+      className: cn$1.cn("[&_svg]:size-4 [&_svg]:shrink-0", className),
+      style: {
+        paddingInlineStart: getItemOffset(depth),
+        ...style
+      },
+      ...props,
+      children
+    }
+  );
+}
+__name(SidebarSeparator2, "SidebarSeparator");
+function SidebarItem2({
+  className,
+  style,
+  children,
+  ...props
+}) {
+  const depth = Base__namespace.useFolderDepth();
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Base__namespace.SidebarItem,
+    {
+      className: cn$1.cn(
+        itemVariants({ variant: "link", highlight: depth >= 1 }),
+        className
+      ),
+      style: {
+        paddingInlineStart: getItemOffset(depth),
+        ...style
+      },
+      ...props,
+      children
+    }
+  );
+}
+__name(SidebarItem2, "SidebarItem");
+function SidebarFolderTrigger2({
+  className,
+  style,
+  ...props
+}) {
+  const { depth, collapsible } = Base__namespace.useFolder();
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Base__namespace.SidebarFolderTrigger,
+    {
+      className: cn$1.cn(
+        itemVariants({ variant: collapsible ? "button" : null }),
+        "w-full",
+        className
+      ),
+      style: {
+        paddingInlineStart: getItemOffset(depth - 1),
+        ...style
+      },
+      ...props,
+      children: props.children
+    }
+  );
+}
+__name(SidebarFolderTrigger2, "SidebarFolderTrigger");
+function SidebarFolderLink2({
+  className,
+  style,
+  ...props
+}) {
+  const depth = Base__namespace.useFolderDepth();
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Base__namespace.SidebarFolderLink,
+    {
+      className: cn$1.cn(
+        itemVariants({ variant: "link", highlight: depth > 1 }),
+        "w-full",
+        className
+      ),
+      style: {
+        paddingInlineStart: getItemOffset(depth - 1),
+        ...style
+      },
+      ...props,
+      children: props.children
+    }
+  );
+}
+__name(SidebarFolderLink2, "SidebarFolderLink");
+function SidebarFolderContent2({
+  className,
+  children,
+  ...props
+}) {
+  const depth = Base__namespace.useFolderDepth();
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Base__namespace.SidebarFolderContent,
+    {
+      className: cn$1.cn(
+        "relative",
+        depth === 1 && "before:content-[''] before:absolute before:w-px before:inset-y-1 before:bg-fd-border before:start-2.5",
+        className
+      ),
+      ...props,
+      children
+    }
+  );
+}
+__name(SidebarFolderContent2, "SidebarFolderContent");
+var SidebarPageTree = pageTree.createPageTreeRenderer({
+  SidebarFolder: SidebarFolder2,
+  SidebarFolderContent: SidebarFolderContent2,
+  SidebarFolderLink: SidebarFolderLink2,
+  SidebarFolderTrigger: SidebarFolderTrigger2,
+  SidebarItem: SidebarItem2,
+  SidebarSeparator: SidebarSeparator2
+});
+var SidebarLinkItem = linkItem.createLinkItemRenderer({
+  SidebarFolder: SidebarFolder2,
+  SidebarFolderContent: SidebarFolderContent2,
+  SidebarFolderLink: SidebarFolderLink2,
+  SidebarFolderTrigger: SidebarFolderTrigger2,
+  SidebarItem: SidebarItem2
+});
+var LayoutContext = React2.createContext(null);
+function LayoutContextProvider({
+  navTransparentMode = "none",
+  children
+}) {
+  const isTop = useIsScrollTop.useIsScrollTop({ enabled: navTransparentMode === "top" }) ?? true;
+  const isNavTransparent = navTransparentMode === "top" ? isTop : navTransparentMode === "always";
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    LayoutContext,
+    {
+      value: React2.useMemo(
+        () => ({
+          isNavTransparent
+        }),
+        [isNavTransparent]
+      ),
+      children
+    }
+  );
+}
+__name(LayoutContextProvider, "LayoutContextProvider");
+function LayoutHeader(props) {
+  const { isNavTransparent } = React2.use(LayoutContext);
+  return /* @__PURE__ */ jsxRuntime.jsx("header", { "data-transparent": isNavTransparent, ...props, children: props.children });
+}
+__name(LayoutHeader, "LayoutHeader");
+function LayoutBody({
+  className,
+  style,
+  children,
+  ...props
+}) {
+  const { collapsed } = Base.useSidebar();
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      id: "nd-docs-layout",
+      className: cn$1.cn(
+        "grid transition-[grid-template-columns] overflow-x-clip min-h-(--fd-docs-height) auto-cols-auto auto-rows-auto [--fd-docs-height:100dvh] [--fd-header-height:0px] [--fd-toc-popover-height:0px] [--fd-sidebar-width:0px] [--fd-toc-width:0px]",
+        className
+      ),
+      "data-sidebar-collapsed": collapsed,
+      style: {
+        gridTemplate: `"sidebar header toc"
+        "sidebar toc-popover toc"
+        "sidebar main toc" 1fr / minmax(var(--fd-sidebar-col), 1fr) minmax(0, calc(var(--fd-layout-width,97rem) - var(--fd-sidebar-width) - var(--fd-toc-width))) minmax(min-content, 1fr)`,
+        "--fd-docs-row-1": "var(--fd-banner-height, 0px)",
+        "--fd-docs-row-2": "calc(var(--fd-docs-row-1) + var(--fd-header-height))",
+        "--fd-docs-row-3": "calc(var(--fd-docs-row-2) + var(--fd-toc-popover-height))",
+        "--fd-sidebar-col": collapsed ? "0px" : "var(--fd-sidebar-width)",
+        ...style
+      },
+      ...props,
+      children
+    }
+  );
+}
+__name(LayoutBody, "LayoutBody");
+function LayoutTabs({
+  options,
+  ...props
+}) {
+  const pathname = framework.usePathname();
+  const selected = React2.useMemo(() => {
+    return options.findLast((option) => isActive.isTabActive(option, pathname));
+  }, [options, pathname]);
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      ...props,
+      className: cn$1.cn(
+        "flex flex-row items-end gap-6 overflow-auto [grid-area:main]",
+        props.className
+      ),
+      children: options.map((option, i) => /* @__PURE__ */ jsxRuntime.jsx(
+        Link5__default.default,
+        {
+          href: option.url,
+          className: cn$1.cn(
+            "inline-flex border-b-2 border-transparent transition-colors items-center pb-1.5 font-medium gap-2 text-fd-muted-foreground text-sm text-nowrap hover:text-fd-accent-foreground",
+            option.unlisted && selected !== option && "hidden",
+            selected === option && "border-fd-primary text-fd-primary"
+          ),
+          children: option.title
+        },
+        i
+      ))
+    }
+  );
+}
+__name(LayoutTabs, "LayoutTabs");
+var itemVariants2 = classVarianceAuthority.cva(
+  "size-6.5 rounded-full p-1.5 text-fd-muted-foreground",
+  {
+    variants: {
+      active: {
+        true: "bg-fd-accent text-fd-accent-foreground",
+        false: "text-fd-muted-foreground"
+      }
+    }
+  }
+);
+var full = [
+  ["light", _icons.Sun],
+  ["dark", _icons.Moon],
+  ["system", _icons.Airplay]
+];
+function ThemeToggle({
+  className,
+  mode = "light-dark",
+  ...props
+}) {
+  const { setTheme, theme, resolvedTheme } = nextThemes.useTheme();
+  const [mounted, setMounted] = React2.useState(false);
+  React2.useEffect(() => {
+    setMounted(true);
+  }, []);
+  const container = cn$1.cn(
+    "inline-flex items-center rounded-full border p-1",
+    className
+  );
+  if (mode === "light-dark") {
+    const value2 = mounted ? resolvedTheme : null;
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "button",
+      {
+        className: container,
+        "aria-label": `Toggle Theme`,
+        onClick: () => setTheme(value2 === "light" ? "dark" : "light"),
+        "data-theme-toggle": "",
+        children: full.map(([key, Icon2]) => {
+          if (key === "system") return;
+          return /* @__PURE__ */ jsxRuntime.jsx(
+            Icon2,
+            {
+              fill: "currentColor",
+              className: cn$1.cn(itemVariants2({ active: value2 === key }))
+            },
+            key
+          );
+        })
+      }
+    );
+  }
+  const value = mounted ? theme : null;
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: container, "data-theme-toggle": "", ...props, children: full.map(([key, Icon2]) => /* @__PURE__ */ jsxRuntime.jsx(
+    "button",
+    {
+      "aria-label": key,
+      className: cn$1.cn(itemVariants2({ active: value === key })),
+      onClick: () => setTheme(key),
+      children: /* @__PURE__ */ jsxRuntime.jsx(Icon2, { className: "size-full", fill: "currentColor" })
+    },
+    key
+  )) });
+}
+__name(ThemeToggle, "ThemeToggle");
+function DocsLayout({
+  nav: { transparentMode, ...nav } = {},
+  sidebar: {
+    tabs: sidebarTabs,
+    enabled: sidebarEnabled = true,
+    defaultOpenLevel,
+    prefetch,
+    ...sidebarProps
+  } = {},
+  searchToggle: searchToggle$1 = {},
+  themeSwitch = {},
+  tabMode = "auto",
+  i18n = false,
+  children,
+  tree: tree$1,
+  ...props
+}) {
+  const tabs$1 = React2.useMemo(() => {
+    if (Array.isArray(sidebarTabs)) {
+      return sidebarTabs;
+    }
+    if (typeof sidebarTabs === "object") {
+      return tabs.getSidebarTabs(tree$1, sidebarTabs);
+    }
+    if (sidebarTabs !== false) {
+      return tabs.getSidebarTabs(tree$1);
+    }
+    return [];
+  }, [tree$1, sidebarTabs]);
+  const links = shared.resolveLinkItems(props);
+  function sidebar() {
+    const {
+      footer,
+      banner,
+      collapsible = true,
+      component,
+      components,
+      ...rest
+    } = sidebarProps;
+    if (component) return component;
+    const iconLinks = links.filter((item) => item.type === "icon");
+    const viewport = /* @__PURE__ */ jsxRuntime.jsxs(SidebarViewport2, { children: [
+      links.filter((v) => v.type !== "icon").map((item, i, list) => /* @__PURE__ */ jsxRuntime.jsx(
+        SidebarLinkItem,
+        {
+          item,
+          className: cn$1.cn(i === list.length - 1 && "mb-4")
+        },
+        i
+      )),
+      /* @__PURE__ */ jsxRuntime.jsx(SidebarPageTree, { ...components })
+    ] });
+    return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(SidebarContent2, { ...rest, children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-3 p-4 pb-2", children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(
+              Link5__default.default,
+              {
+                href: nav.url ?? "/",
+                className: "inline-flex text-[0.9375rem] items-center gap-2.5 font-medium me-auto",
+                children: nav.title
+              }
+            ),
+            nav.children,
+            collapsible && /* @__PURE__ */ jsxRuntime.jsx(
+              SidebarCollapseTrigger2,
+              {
+                className: cn$1.cn(
+                  button.buttonVariants({
+                    color: "ghost",
+                    size: "icon-sm",
+                    className: "mb-auto text-fd-muted-foreground"
+                  })
+                ),
+                children: /* @__PURE__ */ jsxRuntime.jsx(_icons.Sidebar, {})
+              }
+            )
+          ] }),
+          searchToggle$1.enabled !== false && (searchToggle$1.components?.lg ?? /* @__PURE__ */ jsxRuntime.jsx(searchToggle.LargeSearchToggle, { hideIfDisabled: true })),
+          tabs$1.length > 0 && tabMode === "auto" && /* @__PURE__ */ jsxRuntime.jsx(dropdown.SidebarTabsDropdown, { options: tabs$1 }),
+          banner
+        ] }),
+        viewport,
+        (i18n || iconLinks.length > 0 || themeSwitch?.enabled !== false || footer) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col border-t p-4 pt-2 empty:hidden", children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex text-fd-muted-foreground items-center empty:hidden", children: [
+            i18n && /* @__PURE__ */ jsxRuntime.jsx(languageToggle.LanguageToggle, { children: /* @__PURE__ */ jsxRuntime.jsx(_icons.Languages, { className: "size-4.5" }) }),
+            iconLinks.map((item, i) => /* @__PURE__ */ jsxRuntime.jsx(
+              linkItem$1.LinkItem,
+              {
+                item,
+                className: cn$1.cn(
+                  button.buttonVariants({ size: "icon-sm", color: "ghost" })
+                ),
+                "aria-label": item.label,
+                children: item.icon
+              },
+              i
+            )),
+            themeSwitch.enabled !== false && (themeSwitch.component ?? /* @__PURE__ */ jsxRuntime.jsx(
+              ThemeToggle,
+              {
+                className: "ms-auto p-0",
+                mode: themeSwitch.mode
+              }
+            ))
+          ] }),
+          footer
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs(SidebarDrawer, { children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-3 p-4 pb-2", children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex text-fd-muted-foreground items-center gap-1.5", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-1", children: iconLinks.map((item, i) => /* @__PURE__ */ jsxRuntime.jsx(
+              linkItem$1.LinkItem,
+              {
+                item,
+                className: cn$1.cn(
+                  button.buttonVariants({
+                    size: "icon-sm",
+                    color: "ghost",
+                    className: "p-2"
+                  })
+                ),
+                "aria-label": item.label,
+                children: item.icon
+              },
+              i
+            )) }),
+            i18n && /* @__PURE__ */ jsxRuntime.jsxs(languageToggle.LanguageToggle, { children: [
+              /* @__PURE__ */ jsxRuntime.jsx(_icons.Languages, { className: "size-4.5" }),
+              /* @__PURE__ */ jsxRuntime.jsx(languageToggle.LanguageToggleText, {})
+            ] }),
+            themeSwitch.enabled !== false && (themeSwitch.component ?? /* @__PURE__ */ jsxRuntime.jsx(ThemeToggle, { className: "p-0", mode: themeSwitch.mode })),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              SidebarTrigger2,
+              {
+                className: cn$1.cn(
+                  button.buttonVariants({
+                    color: "ghost",
+                    size: "icon-sm",
+                    className: "p-2"
+                  })
+                ),
+                children: /* @__PURE__ */ jsxRuntime.jsx(_icons.Sidebar, {})
+              }
+            )
+          ] }),
+          tabs$1.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(dropdown.SidebarTabsDropdown, { options: tabs$1 }),
+          banner
+        ] }),
+        viewport,
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col border-t p-4 pt-2 empty:hidden", children: footer })
+      ] })
+    ] });
+  }
+  __name(sidebar, "sidebar");
+  return /* @__PURE__ */ jsxRuntime.jsx(tree.TreeContextProvider, { tree: tree$1, children: /* @__PURE__ */ jsxRuntime.jsx(LayoutContextProvider, { navTransparentMode: transparentMode, children: /* @__PURE__ */ jsxRuntime.jsx(Sidebar, { defaultOpenLevel, prefetch, children: /* @__PURE__ */ jsxRuntime.jsxs(LayoutBody, { ...props.containerProps, children: [
+    nav.enabled !== false && (nav.component ?? /* @__PURE__ */ jsxRuntime.jsxs(
+      LayoutHeader,
+      {
+        id: "nd-subnav",
+        className: "[grid-area:header] sticky top-(--fd-docs-row-1) z-30 flex items-center ps-4 pe-2.5 border-b transition-colors backdrop-blur-sm h-(--fd-header-height) md:hidden max-md:layout:[--fd-header-height:--spacing(14)] data-[transparent=false]:bg-fd-background/80",
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            Link5__default.default,
+            {
+              href: nav.url ?? "/",
+              className: "inline-flex items-center gap-2.5 font-semibold",
+              children: nav.title
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1", children: nav.children }),
+          searchToggle$1.enabled !== false && (searchToggle$1.components?.sm ?? /* @__PURE__ */ jsxRuntime.jsx(searchToggle.SearchToggle, { className: "p-2", hideIfDisabled: true })),
+          sidebarEnabled && /* @__PURE__ */ jsxRuntime.jsx(
+            SidebarTrigger2,
+            {
+              className: cn$1.cn(
+                button.buttonVariants({
+                  color: "ghost",
+                  size: "icon-sm",
+                  className: "p-2"
+                })
+              ),
+              children: /* @__PURE__ */ jsxRuntime.jsx(_icons.Sidebar, {})
+            }
+          )
+        ]
+      }
+    )),
+    sidebarEnabled && sidebar(),
+    tabMode === "top" && tabs$1.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(
+      LayoutTabs,
+      {
+        options: tabs$1,
+        className: "z-10 bg-fd-background border-b px-6 pt-3 xl:px-8 max-md:hidden"
+      }
+    ),
+    children
+  ] }) }) }) });
+}
+__name(DocsLayout, "DocsLayout");
+function HomeLayout(props) {
+  const {
+    nav = {},
+    links,
+    githubUrl,
+    i18n,
+    themeSwitch = {},
+    searchToggle,
+    ...rest
+  } = props;
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "main",
+    {
+      id: "nd-home-layout",
+      ...rest,
+      className: cn$1.cn(
+        "flex flex-1 flex-col [--fd-layout-width:1400px]",
+        rest.className
+      ),
+      children: [
+        nav.enabled !== false && (nav.component ?? /* @__PURE__ */ jsxRuntime.jsx(
+          client.Header,
+          {
+            links,
+            nav,
+            themeSwitch,
+            searchToggle,
+            i18n,
+            githubUrl
+          }
+        )),
+        props.children
+      ]
+    }
+  );
+}
+__name(HomeLayout, "HomeLayout");
+var LayoutContext2 = React2.createContext(null);
 
-Object.defineProperty(exports, "toast", {
-  enumerable: true,
-  get: function () { return sonner.toast; }
+// docs/layouts/docs/page/index.tsx
+var page_exports = {};
+__export(page_exports, {
+  DocsBody: () => DocsBody,
+  DocsDescription: () => DocsDescription,
+  DocsPage: () => DocsPage,
+  DocsTitle: () => DocsTitle,
+  EditOnGitHub: () => EditOnGitHub,
+  PageBreadcrumb: () => PageBreadcrumb,
+  PageLastUpdate: () => PageLastUpdate
+});
+var TocPopoverContext = React2.createContext(null);
+function PageTOCPopover({
+  className,
+  children,
+  ...rest
+}) {
+  const ref = React2.useRef(null);
+  const [open, setOpen] = React2.useState(false);
+  const { isNavTransparent } = React2.use(LayoutContext);
+  const onClick = React2.useEffectEvent((e) => {
+    if (!open) return;
+    if (ref.current && !ref.current.contains(e.target))
+      setOpen(false);
+  });
+  React2.useEffect(() => {
+    window.addEventListener("click", onClick);
+    return () => {
+      window.removeEventListener("click", onClick);
+    };
+  }, []);
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    TocPopoverContext,
+    {
+      value: React2.useMemo(
+        () => ({
+          open,
+          setOpen
+        }),
+        [setOpen, open]
+      ),
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        collapsible.Collapsible,
+        {
+          open,
+          onOpenChange: setOpen,
+          "data-toc-popover": "",
+          className: cn$1.cn(
+            "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)]",
+            className
+          ),
+          ...rest,
+          children: /* @__PURE__ */ jsxRuntime.jsx(
+            "header",
+            {
+              ref,
+              className: cn$1.cn(
+                "border-b backdrop-blur-sm transition-colors",
+                (!isNavTransparent || open) && "bg-fd-background/80",
+                open && "shadow-lg"
+              ),
+              children
+            }
+          )
+        }
+      )
+    }
+  );
+}
+__name(PageTOCPopover, "PageTOCPopover");
+function PageTOCPopoverTrigger({
+  className,
+  ...props
+}) {
+  const { text } = i18n.useI18n();
+  const { open } = React2.use(TocPopoverContext);
+  const items = toc.useTOCItems();
+  const active = toc$1.useActiveAnchor();
+  const selected = React2.useMemo(
+    () => items.findIndex((item) => active === item.url.slice(1)),
+    [items, active]
+  );
+  const path = tree.useTreePath().at(-1);
+  const showItem = selected !== -1 && !open;
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    collapsible.CollapsibleTrigger,
+    {
+      className: cn$1.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
+      ),
+      "data-toc-popover-trigger": "",
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          ProgressCircle,
+          {
+            value: (selected + 1) / Math.max(1, items.length),
+            max: 1,
+            className: cn$1.cn("shrink-0", open && "text-fd-primary")
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "grid flex-1 *:my-auto *:row-start-1 *:col-start-1", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "span",
+            {
+              className: cn$1.cn(
+                "truncate transition-all",
+                open && "text-fd-foreground",
+                showItem && "opacity-0 -translate-y-full pointer-events-none"
+              ),
+              children: path?.name ?? text.toc
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "span",
+            {
+              className: cn$1.cn(
+                "truncate transition-all",
+                !showItem && "opacity-0 translate-y-full pointer-events-none"
+              ),
+              children: items[selected]?.title
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          _icons.ChevronDown,
+          {
+            className: cn$1.cn(
+              "shrink-0 transition-transform mx-0.5",
+              open && "rotate-180"
+            )
+          }
+        )
+      ]
+    }
+  );
+}
+__name(PageTOCPopoverTrigger, "PageTOCPopoverTrigger");
+function clamp(input, min, max) {
+  if (input < min) return min;
+  if (input > max) return max;
+  return input;
+}
+__name(clamp, "clamp");
+function ProgressCircle({
+  value,
+  strokeWidth = 2,
+  size = 24,
+  min = 0,
+  max = 100,
+  ...restSvgProps
+}) {
+  const normalizedValue = clamp(value, min, max);
+  const radius = (size - strokeWidth) / 2;
+  const circumference = 2 * Math.PI * radius;
+  const progress = normalizedValue / max * circumference;
+  const circleProps = {
+    cx: size / 2,
+    cy: size / 2,
+    r: radius,
+    fill: "none",
+    strokeWidth
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "svg",
+    {
+      role: "progressbar",
+      viewBox: `0 0 ${size} ${size}`,
+      "aria-valuenow": normalizedValue,
+      "aria-valuemin": min,
+      "aria-valuemax": max,
+      ...restSvgProps,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("circle", { ...circleProps, className: "stroke-current/25" }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "circle",
+          {
+            ...circleProps,
+            stroke: "currentColor",
+            strokeDasharray: circumference,
+            strokeDashoffset: circumference - progress,
+            strokeLinecap: "round",
+            transform: `rotate(-90 ${size / 2} ${size / 2})`,
+            className: "transition-all"
+          }
+        )
+      ]
+    }
+  );
+}
+__name(ProgressCircle, "ProgressCircle");
+function PageTOCPopoverContent(props) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    collapsible.CollapsibleContent,
+    {
+      "data-toc-popover-content": "",
+      ...props,
+      className: cn$1.cn("flex flex-col px-4 max-h-[50vh] md:px-6", props.className),
+      children: props.children
+    }
+  );
+}
+__name(PageTOCPopoverContent, "PageTOCPopoverContent");
+function PageLastUpdate({
+  date: value,
+  ...props
+}) {
+  const { text } = i18n.useI18n();
+  const [date, setDate] = React2.useState("");
+  React2.useEffect(() => {
+    setDate(value.toLocaleDateString());
+  }, [value]);
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "p",
+    {
+      ...props,
+      className: cn$1.cn("text-sm text-fd-muted-foreground", props.className),
+      children: [
+        text.lastUpdate,
+        " ",
+        date
+      ]
+    }
+  );
+}
+__name(PageLastUpdate, "PageLastUpdate");
+function PageFooter({ items, ...props }) {
+  const footerList = useFooterItems.useFooterItems();
+  const pathname = framework.usePathname();
+  const { previous, next } = React2.useMemo(() => {
+    if (items) return items;
+    const idx = footerList.findIndex(
+      (item) => isActive.isActive(item.url, pathname, false)
+    );
+    if (idx === -1) return {};
+    return {
+      previous: footerList[idx - 1],
+      next: footerList[idx + 1]
+    };
+  }, [footerList, items, pathname]);
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      ...props,
+      className: cn$1.cn(
+        "@container grid gap-4",
+        previous && next ? "grid-cols-2" : "grid-cols-1",
+        props.className
+      ),
+      children: [
+        previous ? /* @__PURE__ */ jsxRuntime.jsx(FooterItem, { item: previous, index: 0 }) : null,
+        next ? /* @__PURE__ */ jsxRuntime.jsx(FooterItem, { item: next, index: 1 }) : null
+      ]
+    }
+  );
+}
+__name(PageFooter, "PageFooter");
+function FooterItem({ item, index }) {
+  const { text } = i18n.useI18n();
+  const Icon2 = index === 0 ? _icons.ChevronLeft : _icons.ChevronRight;
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    Link5__default.default,
+    {
+      href: item.url,
+      className: cn$1.cn(
+        "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",
+        index === 1 && "text-end"
+      ),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(
+          "div",
+          {
+            className: cn$1.cn(
+              "inline-flex items-center gap-1.5 font-medium",
+              index === 1 && "flex-row-reverse"
+            ),
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsx(Icon2, { className: "-mx-1 size-4 shrink-0 rtl:rotate-180" }),
+              /* @__PURE__ */ jsxRuntime.jsx("p", { children: item.name })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-fd-muted-foreground truncate", children: item.description ?? (index === 0 ? text.previousPage : text.nextPage) })
+      ]
+    }
+  );
+}
+__name(FooterItem, "FooterItem");
+function PageBreadcrumb({
+  includeRoot,
+  includeSeparator,
+  includePage,
+  ...props
+}) {
+  const path = tree.useTreePath();
+  const { root } = tree.useTreeContext();
+  const items = React2.useMemo(() => {
+    return breadcrumb.getBreadcrumbItemsFromPath(root, path, {
+      includePage,
+      includeSeparator,
+      includeRoot
+    });
+  }, [includePage, includeRoot, includeSeparator, path, root]);
+  if (items.length === 0) return null;
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      ...props,
+      className: cn$1.cn(
+        "flex items-center gap-1.5 text-sm text-fd-muted-foreground",
+        props.className
+      ),
+      children: items.map((item, i) => {
+        const className = cn$1.cn(
+          "truncate",
+          i === items.length - 1 && "text-fd-primary font-medium"
+        );
+        return /* @__PURE__ */ jsxRuntime.jsxs(React2.Fragment, { children: [
+          i !== 0 && /* @__PURE__ */ jsxRuntime.jsx(_icons.ChevronRight, { className: "size-3.5 shrink-0" }),
+          item.url ? /* @__PURE__ */ jsxRuntime.jsx(
+            Link5__default.default,
+            {
+              href: item.url,
+              className: cn$1.cn(className, "transition-opacity hover:opacity-80"),
+              children: item.name
+            }
+          ) : /* @__PURE__ */ jsxRuntime.jsx("span", { className, children: item.name })
+        ] }, i);
+      })
+    }
+  );
+}
+__name(PageBreadcrumb, "PageBreadcrumb");
+function DocsPage({
+  breadcrumb: {
+    enabled: breadcrumbEnabled = true,
+    component: breadcrumb,
+    ...breadcrumbProps
+  } = {},
+  footer = {},
+  full: full2 = false,
+  tableOfContentPopover: {
+    enabled: tocPopoverEnabled,
+    component: tocPopover,
+    ...tocPopoverOptions
+  } = {},
+  tableOfContent: {
+    enabled: tocEnabled,
+    component: tocReplace,
+    ...tocOptions
+  } = {},
+  toc: toc$1 = [],
+  children
+}) {
+  tocEnabled ?? (tocEnabled = !full2 && (toc$1.length > 0 || tocOptions.footer !== void 0 || tocOptions.header !== void 0));
+  tocPopoverEnabled ?? (tocPopoverEnabled = toc$1.length > 0 || tocPopoverOptions.header !== void 0 || tocPopoverOptions.footer !== void 0);
+  let wrapper = /* @__PURE__ */ __name((children2) => children2, "wrapper");
+  if (tocEnabled || tocPopoverEnabled) {
+    wrapper = /* @__PURE__ */ __name((children2) => /* @__PURE__ */ jsxRuntime.jsx(toc.TOCProvider, { single: tocOptions.single, toc: toc$1, children: children2 }), "wrapper");
+  }
+  return wrapper(
+    /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      tocPopoverEnabled && (tocPopover ?? /* @__PURE__ */ jsxRuntime.jsxs(PageTOCPopover, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(PageTOCPopoverTrigger, {}),
+        /* @__PURE__ */ jsxRuntime.jsxs(PageTOCPopoverContent, { children: [
+          tocPopoverOptions.header,
+          /* @__PURE__ */ jsxRuntime.jsx(toc.TOCScrollArea, { children: tocPopoverOptions.style === "clerk" ? /* @__PURE__ */ jsxRuntime.jsx(TocClerk__namespace.TOCItems, {}) : /* @__PURE__ */ jsxRuntime.jsx(TocDefault__namespace.TOCItems, {}) }),
+          tocPopoverOptions.footer
+        ] })
+      ] })),
+      /* @__PURE__ */ jsxRuntime.jsxs(
+        "article",
+        {
+          id: "nd-page",
+          "data-full": full2,
+          className: cn$1.cn(
+            "flex flex-col w-full max-w-[900px] mx-auto [grid-area:main] px-4 py-6 gap-4 md:px-6 md:pt-8 xl:px-8 xl:pt-14",
+            full2 ? "max-w-[1200px]" : "xl:layout:[--fd-toc-width:268px]"
+          ),
+          children: [
+            breadcrumbEnabled && (breadcrumb ?? /* @__PURE__ */ jsxRuntime.jsx(PageBreadcrumb, { ...breadcrumbProps })),
+            children,
+            footer.enabled !== false && (footer.component ?? /* @__PURE__ */ jsxRuntime.jsx(PageFooter, { items: footer.items }))
+          ]
+        }
+      ),
+      tocEnabled && (tocReplace ?? /* @__PURE__ */ jsxRuntime.jsxs(
+        "div",
+        {
+          id: "nd-toc",
+          className: "sticky top-(--fd-docs-row-1) h-[calc(var(--fd-docs-height)-var(--fd-docs-row-1))] flex flex-col [grid-area:toc] w-(--fd-toc-width) pt-12 pe-4 pb-2 max-xl:hidden",
+          children: [
+            tocOptions.header,
+            /* @__PURE__ */ jsxRuntime.jsxs(
+              "h3",
+              {
+                id: "toc-title",
+                className: "inline-flex items-center gap-1.5 text-sm text-fd-muted-foreground",
+                children: [
+                  /* @__PURE__ */ jsxRuntime.jsx(_icons.Text, { className: "size-4" }),
+                  /* @__PURE__ */ jsxRuntime.jsx(i18n.I18nLabel, { label: "toc" })
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsx(toc.TOCScrollArea, { children: tocOptions.style === "clerk" ? /* @__PURE__ */ jsxRuntime.jsx(TocClerk__namespace.TOCItems, {}) : /* @__PURE__ */ jsxRuntime.jsx(TocDefault__namespace.TOCItems, {}) }),
+            tocOptions.footer
+          ]
+        }
+      ))
+    ] })
+  );
+}
+__name(DocsPage, "DocsPage");
+function EditOnGitHub(props) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "a",
+    {
+      target: "_blank",
+      rel: "noreferrer noopener",
+      ...props,
+      className: cn$1.cn(
+        button.buttonVariants({
+          color: "secondary",
+          size: "sm",
+          className: "gap-1.5 not-prose"
+        }),
+        props.className
+      ),
+      children: props.children ?? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(_icons.Edit, { className: "size-3.5" }),
+        /* @__PURE__ */ jsxRuntime.jsx(i18n.I18nLabel, { label: "editOnGithub" })
+      ] })
+    }
+  );
+}
+__name(EditOnGitHub, "EditOnGitHub");
+function DocsBody({
+  children,
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { ...props, className: cn$1.cn("prose flex-1", className), children });
+}
+__name(DocsBody, "DocsBody");
+function DocsDescription({
+  children,
+  className,
+  ...props
+}) {
+  if (children === void 0) return null;
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "p",
+    {
+      ...props,
+      className: cn$1.cn("mb-8 text-lg text-fd-muted-foreground", className),
+      children
+    }
+  );
+}
+__name(DocsDescription, "DocsDescription");
+function DocsTitle({
+  children,
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx("h1", { ...props, className: cn$1.cn("text-[1.75em] font-semibold", className), children });
+}
+__name(DocsTitle, "DocsTitle");
+
+// docs/layouts/notebook/page/index.tsx
+var page_exports2 = {};
+__export(page_exports2, {
+  DocsBody: () => DocsBody2,
+  DocsDescription: () => DocsDescription2,
+  DocsPage: () => DocsPage2,
+  DocsTitle: () => DocsTitle2,
+  EditOnGitHub: () => EditOnGitHub2,
+  PageBreadcrumb: () => PageBreadcrumb2,
+  PageLastUpdate: () => PageLastUpdate2
+});
+var TocPopoverContext2 = React2.createContext(null);
+function PageTOCPopover2({
+  className,
+  children,
+  ...rest
+}) {
+  const ref = React2.useRef(null);
+  const [open, setOpen] = React2.useState(false);
+  const { isNavTransparent } = React2.use(LayoutContext2);
+  const onClick = React2.useEffectEvent((e) => {
+    if (!open) return;
+    if (ref.current && !ref.current.contains(e.target))
+      setOpen(false);
+  });
+  React2.useEffect(() => {
+    window.addEventListener("click", onClick);
+    return () => {
+      window.removeEventListener("click", onClick);
+    };
+  }, []);
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    TocPopoverContext2,
+    {
+      value: React2.useMemo(
+        () => ({
+          open,
+          setOpen
+        }),
+        [setOpen, open]
+      ),
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        collapsible.Collapsible,
+        {
+          open,
+          onOpenChange: setOpen,
+          "data-toc-popover": "",
+          className: cn$1.cn(
+            "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)]",
+            className
+          ),
+          ...rest,
+          children: /* @__PURE__ */ jsxRuntime.jsx(
+            "header",
+            {
+              ref,
+              className: cn$1.cn(
+                "border-b backdrop-blur-sm transition-colors",
+                (!isNavTransparent || open) && "bg-fd-background/80",
+                open && "shadow-lg"
+              ),
+              children
+            }
+          )
+        }
+      )
+    }
+  );
+}
+__name(PageTOCPopover2, "PageTOCPopover");
+function PageTOCPopoverTrigger2({
+  className,
+  ...props
+}) {
+  const { text } = i18n.useI18n();
+  const { open } = React2.use(TocPopoverContext2);
+  const items = toc.useTOCItems();
+  const active = toc$1.useActiveAnchor();
+  const selected = React2.useMemo(
+    () => items.findIndex((item) => active === item.url.slice(1)),
+    [items, active]
+  );
+  const path = tree.useTreePath().at(-1);
+  const showItem = selected !== -1 && !open;
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    collapsible.CollapsibleTrigger,
+    {
+      className: cn$1.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
+      ),
+      "data-toc-popover-trigger": "",
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          ProgressCircle2,
+          {
+            value: (selected + 1) / Math.max(1, items.length),
+            max: 1,
+            className: cn$1.cn("shrink-0", open && "text-fd-primary")
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "grid flex-1 *:my-auto *:row-start-1 *:col-start-1", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "span",
+            {
+              className: cn$1.cn(
+                "truncate transition-all",
+                open && "text-fd-foreground",
+                showItem && "opacity-0 -translate-y-full pointer-events-none"
+              ),
+              children: path?.name ?? text.toc
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "span",
+            {
+              className: cn$1.cn(
+                "truncate transition-all",
+                !showItem && "opacity-0 translate-y-full pointer-events-none"
+              ),
+              children: items[selected]?.title
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          _icons.ChevronDown,
+          {
+            className: cn$1.cn(
+              "shrink-0 transition-transform mx-0.5",
+              open && "rotate-180"
+            )
+          }
+        )
+      ]
+    }
+  );
+}
+__name(PageTOCPopoverTrigger2, "PageTOCPopoverTrigger");
+function clamp2(input, min, max) {
+  if (input < min) return min;
+  if (input > max) return max;
+  return input;
+}
+__name(clamp2, "clamp");
+function ProgressCircle2({
+  value,
+  strokeWidth = 2,
+  size = 24,
+  min = 0,
+  max = 100,
+  ...restSvgProps
+}) {
+  const normalizedValue = clamp2(value, min, max);
+  const radius = (size - strokeWidth) / 2;
+  const circumference = 2 * Math.PI * radius;
+  const progress = normalizedValue / max * circumference;
+  const circleProps = {
+    cx: size / 2,
+    cy: size / 2,
+    r: radius,
+    fill: "none",
+    strokeWidth
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "svg",
+    {
+      role: "progressbar",
+      viewBox: `0 0 ${size} ${size}`,
+      "aria-valuenow": normalizedValue,
+      "aria-valuemin": min,
+      "aria-valuemax": max,
+      ...restSvgProps,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("circle", { ...circleProps, className: "stroke-current/25" }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "circle",
+          {
+            ...circleProps,
+            stroke: "currentColor",
+            strokeDasharray: circumference,
+            strokeDashoffset: circumference - progress,
+            strokeLinecap: "round",
+            transform: `rotate(-90 ${size / 2} ${size / 2})`,
+            className: "transition-all"
+          }
+        )
+      ]
+    }
+  );
+}
+__name(ProgressCircle2, "ProgressCircle");
+function PageTOCPopoverContent2(props) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    collapsible.CollapsibleContent,
+    {
+      "data-toc-popover-content": "",
+      ...props,
+      className: cn$1.cn("flex flex-col px-4 max-h-[50vh] md:px-6", props.className),
+      children: props.children
+    }
+  );
+}
+__name(PageTOCPopoverContent2, "PageTOCPopoverContent");
+function PageLastUpdate2({
+  date: value,
+  ...props
+}) {
+  const { text } = i18n.useI18n();
+  const [date, setDate] = React2.useState("");
+  React2.useEffect(() => {
+    setDate(value.toLocaleDateString());
+  }, [value]);
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "p",
+    {
+      ...props,
+      className: cn$1.cn("text-sm text-fd-muted-foreground", props.className),
+      children: [
+        text.lastUpdate,
+        " ",
+        date
+      ]
+    }
+  );
+}
+__name(PageLastUpdate2, "PageLastUpdate");
+function PageFooter2({ items, ...props }) {
+  const footerList = useFooterItems.useFooterItems();
+  const pathname = framework.usePathname();
+  const { previous, next } = React2.useMemo(() => {
+    if (items) return items;
+    const idx = footerList.findIndex(
+      (item) => isActive.isActive(item.url, pathname, false)
+    );
+    if (idx === -1) return {};
+    return {
+      previous: footerList[idx - 1],
+      next: footerList[idx + 1]
+    };
+  }, [footerList, items, pathname]);
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      ...props,
+      className: cn$1.cn(
+        "@container grid gap-4",
+        previous && next ? "grid-cols-2" : "grid-cols-1",
+        props.className
+      ),
+      children: [
+        previous ? /* @__PURE__ */ jsxRuntime.jsx(FooterItem2, { item: previous, index: 0 }) : null,
+        next ? /* @__PURE__ */ jsxRuntime.jsx(FooterItem2, { item: next, index: 1 }) : null
+      ]
+    }
+  );
+}
+__name(PageFooter2, "PageFooter");
+function FooterItem2({ item, index }) {
+  const { text } = i18n.useI18n();
+  const Icon2 = index === 0 ? _icons.ChevronLeft : _icons.ChevronRight;
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    Link5__default.default,
+    {
+      href: item.url,
+      className: cn$1.cn(
+        "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",
+        index === 1 && "text-end"
+      ),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(
+          "div",
+          {
+            className: cn$1.cn(
+              "inline-flex items-center gap-1.5 font-medium",
+              index === 1 && "flex-row-reverse"
+            ),
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsx(Icon2, { className: "-mx-1 size-4 shrink-0 rtl:rotate-180" }),
+              /* @__PURE__ */ jsxRuntime.jsx("p", { children: item.name })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-fd-muted-foreground truncate", children: item.description ?? (index === 0 ? text.previousPage : text.nextPage) })
+      ]
+    }
+  );
+}
+__name(FooterItem2, "FooterItem");
+function PageBreadcrumb2({
+  includeRoot,
+  includeSeparator,
+  includePage,
+  ...props
+}) {
+  const path = tree.useTreePath();
+  const { root } = tree.useTreeContext();
+  const items = React2.useMemo(() => {
+    return breadcrumb.getBreadcrumbItemsFromPath(root, path, {
+      includePage,
+      includeSeparator,
+      includeRoot
+    });
+  }, [includePage, includeRoot, includeSeparator, path, root]);
+  if (items.length === 0) return null;
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      ...props,
+      className: cn$1.cn(
+        "flex items-center gap-1.5 text-sm text-fd-muted-foreground",
+        props.className
+      ),
+      children: items.map((item, i) => {
+        const className = cn$1.cn(
+          "truncate",
+          i === items.length - 1 && "text-fd-primary font-medium"
+        );
+        return /* @__PURE__ */ jsxRuntime.jsxs(React2.Fragment, { children: [
+          i !== 0 && /* @__PURE__ */ jsxRuntime.jsx(_icons.ChevronRight, { className: "size-3.5 shrink-0" }),
+          item.url ? /* @__PURE__ */ jsxRuntime.jsx(
+            Link5__default.default,
+            {
+              href: item.url,
+              className: cn$1.cn(className, "transition-opacity hover:opacity-80"),
+              children: item.name
+            }
+          ) : /* @__PURE__ */ jsxRuntime.jsx("span", { className, children: item.name })
+        ] }, i);
+      })
+    }
+  );
+}
+__name(PageBreadcrumb2, "PageBreadcrumb");
+function DocsPage2({
+  breadcrumb: {
+    enabled: breadcrumbEnabled = true,
+    component: breadcrumb,
+    ...breadcrumbProps
+  } = {},
+  footer = {},
+  full: full2 = false,
+  tableOfContentPopover: {
+    enabled: tocPopoverEnabled,
+    component: tocPopover,
+    ...tocPopoverOptions
+  } = {},
+  tableOfContent: {
+    enabled: tocEnabled,
+    component: tocReplace,
+    ...tocOptions
+  } = {},
+  toc: toc$1 = [],
+  children
+}) {
+  tocEnabled ?? (tocEnabled = !full2 && (toc$1.length > 0 || tocOptions.footer !== void 0 || tocOptions.header !== void 0));
+  tocPopoverEnabled ?? (tocPopoverEnabled = toc$1.length > 0 || tocPopoverOptions.header !== void 0 || tocPopoverOptions.footer !== void 0);
+  let wrapper = /* @__PURE__ */ __name((children2) => children2, "wrapper");
+  if (tocEnabled || tocPopoverEnabled) {
+    wrapper = /* @__PURE__ */ __name((children2) => /* @__PURE__ */ jsxRuntime.jsx(toc.TOCProvider, { single: tocOptions.single, toc: toc$1, children: children2 }), "wrapper");
+  }
+  return wrapper(
+    /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      tocPopoverEnabled && (tocPopover ?? /* @__PURE__ */ jsxRuntime.jsxs(PageTOCPopover2, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(PageTOCPopoverTrigger2, {}),
+        /* @__PURE__ */ jsxRuntime.jsxs(PageTOCPopoverContent2, { children: [
+          tocPopoverOptions.header,
+          /* @__PURE__ */ jsxRuntime.jsx(toc.TOCScrollArea, { children: tocPopoverOptions.style === "clerk" ? /* @__PURE__ */ jsxRuntime.jsx(TocClerk__namespace.TOCItems, {}) : /* @__PURE__ */ jsxRuntime.jsx(TocDefault__namespace.TOCItems, {}) }),
+          tocPopoverOptions.footer
+        ] })
+      ] })),
+      /* @__PURE__ */ jsxRuntime.jsxs(
+        "article",
+        {
+          id: "nd-page",
+          "data-full": full2,
+          className: cn$1.cn(
+            "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]",
+            full2 && "*:max-w-[1285px]"
+          ),
+          children: [
+            breadcrumbEnabled && (breadcrumb ?? /* @__PURE__ */ jsxRuntime.jsx(PageBreadcrumb2, { ...breadcrumbProps })),
+            children,
+            footer.enabled !== false && (footer.component ?? /* @__PURE__ */ jsxRuntime.jsx(PageFooter2, { items: footer.items }))
+          ]
+        }
+      ),
+      tocEnabled && (tocReplace ?? /* @__PURE__ */ jsxRuntime.jsxs(
+        "div",
+        {
+          id: "nd-toc",
+          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",
+          children: [
+            tocOptions.header,
+            /* @__PURE__ */ jsxRuntime.jsxs(
+              "h3",
+              {
+                id: "toc-title",
+                className: "inline-flex items-center gap-1.5 text-sm text-fd-muted-foreground",
+                children: [
+                  /* @__PURE__ */ jsxRuntime.jsx(_icons.Text, { className: "size-4" }),
+                  /* @__PURE__ */ jsxRuntime.jsx(i18n.I18nLabel, { label: "toc" })
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsx(toc.TOCScrollArea, { children: tocOptions.style === "clerk" ? /* @__PURE__ */ jsxRuntime.jsx(TocClerk__namespace.TOCItems, {}) : /* @__PURE__ */ jsxRuntime.jsx(TocDefault__namespace.TOCItems, {}) }),
+            tocOptions.footer
+          ]
+        }
+      ))
+    ] })
+  );
+}
+__name(DocsPage2, "DocsPage");
+function EditOnGitHub2(props) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "a",
+    {
+      target: "_blank",
+      rel: "noreferrer noopener",
+      ...props,
+      className: cn$1.cn(
+        button.buttonVariants({
+          color: "secondary",
+          size: "sm",
+          className: "gap-1.5 not-prose"
+        }),
+        props.className
+      ),
+      children: props.children ?? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(_icons.Edit, { className: "size-3.5" }),
+        /* @__PURE__ */ jsxRuntime.jsx(i18n.I18nLabel, { label: "editOnGithub" })
+      ] })
+    }
+  );
+}
+__name(EditOnGitHub2, "EditOnGitHub");
+function DocsBody2({
+  children,
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { ...props, className: cn$1.cn("prose flex-1", className), children });
+}
+__name(DocsBody2, "DocsBody");
+function DocsDescription2({
+  children,
+  className,
+  ...props
+}) {
+  if (children === void 0) return null;
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "p",
+    {
+      ...props,
+      className: cn$1.cn("mb-8 text-lg text-fd-muted-foreground", className),
+      children
+    }
+  );
+}
+__name(DocsDescription2, "DocsDescription");
+function DocsTitle2({
+  children,
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx("h1", { ...props, className: cn$1.cn("text-[1.75em] font-semibold", className), children });
+}
+__name(DocsTitle2, "DocsTitle");
+function DocsPage3({
+  lastUpdate,
+  editOnGithub,
+  children,
+  ...props
+}) {
+  const docsLayoutCtx = React2.use(LayoutContext);
+  const { DocsPage: DocsPage4, EditOnGitHub: EditOnGitHub3, PageLastUpdate: PageLastUpdate3 } = docsLayoutCtx ? page_exports : page_exports2;
+  return /* @__PURE__ */ jsxRuntime.jsxs(DocsPage4, { ...props, children: [
+    children,
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-row flex-wrap items-center justify-between gap-4 empty:hidden", children: [
+      editOnGithub && /* @__PURE__ */ jsxRuntime.jsx(
+        EditOnGitHub3,
+        {
+          href: `https://github.com/${editOnGithub.owner}/${editOnGithub.repo}/blob/${editOnGithub.sha}/${editOnGithub.path.startsWith("/") ? editOnGithub.path.slice(1) : editOnGithub.path}`
+        }
+      ),
+      lastUpdate && /* @__PURE__ */ jsxRuntime.jsx(PageLastUpdate3, { date: new Date(lastUpdate) })
+    ] })
+  ] });
+}
+__name(DocsPage3, "DocsPage");
+function Image5(props) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    framework.Image,
+    {
+      sizes: "(max-width: 768px) 100vw, (max-width: 1200px) 70vw, 900px",
+      ...props,
+      src: props.src,
+      className: cn$1.cn("rounded-lg", props.className)
+    }
+  );
+}
+__name(Image5, "Image");
+function Table2(props) {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative overflow-auto prose-no-margin my-6", children: /* @__PURE__ */ jsxRuntime.jsx("table", { ...props }) });
+}
+__name(Table2, "Table");
+var defaultMdxComponents = {
+  CodeBlockTab: codeblock.CodeBlockTab,
+  CodeBlockTabs: codeblock.CodeBlockTabs,
+  CodeBlockTabsList: codeblock.CodeBlockTabsList,
+  CodeBlockTabsTrigger: codeblock.CodeBlockTabsTrigger,
+  pre: /* @__PURE__ */ __name((props) => /* @__PURE__ */ jsxRuntime.jsx(codeblock.CodeBlock, { ...props, children: /* @__PURE__ */ jsxRuntime.jsx(codeblock.Pre, { children: props.children }) }), "pre"),
+  Card: card.Card,
+  Cards: card.Cards,
+  a: Link5__default.default,
+  img: Image5,
+  h1: /* @__PURE__ */ __name((props) => /* @__PURE__ */ jsxRuntime.jsx(heading.Heading, { as: "h1", ...props }), "h1"),
+  h2: /* @__PURE__ */ __name((props) => /* @__PURE__ */ jsxRuntime.jsx(heading.Heading, { as: "h2", ...props }), "h2"),
+  h3: /* @__PURE__ */ __name((props) => /* @__PURE__ */ jsxRuntime.jsx(heading.Heading, { as: "h3", ...props }), "h3"),
+  h4: /* @__PURE__ */ __name((props) => /* @__PURE__ */ jsxRuntime.jsx(heading.Heading, { as: "h4", ...props }), "h4"),
+  h5: /* @__PURE__ */ __name((props) => /* @__PURE__ */ jsxRuntime.jsx(heading.Heading, { as: "h5", ...props }), "h5"),
+  h6: /* @__PURE__ */ __name((props) => /* @__PURE__ */ jsxRuntime.jsx(heading.Heading, { as: "h6", ...props }), "h6"),
+  table: Table2,
+  Callout: callout.Callout,
+  CalloutContainer: callout.CalloutContainer,
+  CalloutTitle: callout.CalloutTitle,
+  CalloutDescription: callout.CalloutDescription
+};
+function RootProvider({ components, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(next.NextProvider, { Link: components?.Link, Image: components?.Image, children: /* @__PURE__ */ jsxRuntime.jsx(base.RootProvider, { ...props, children: props.children }) });
+}
+__name(RootProvider, "RootProvider");
+
+// docs/source.ts
+var source_exports = {};
+__export(source_exports, {
+  loader: () => source_star.loader
+});
+__reExport(source_exports, source_star__namespace);
+
+Object.defineProperty(exports, "toast", {
+  enumerable: true,
+  get: function () { return sonner.toast; }
+});
+Object.defineProperty(exports, "loader", {
+  enumerable: true,
+  get: function () { return source_star.loader; }
 });
 exports.AIAgentIcon = AIAgentIcon;
 exports.AISearchContentIcon = AISearchContentIcon;
@@ -8252,6 +9956,11 @@ exports.DialogTrigger = DialogTrigger;
 exports.DialogVideoController = dialog_video_controller_default;
 exports.DirectoryTypeIcon = DirectoryTypeIcon;
 exports.DisconnectIcon = DisconnectIcon;
+exports.DocsBody = DocsBody;
+exports.DocsDescription = DocsDescription;
+exports.DocsLayout = DocsLayout;
+exports.DocsPage = DocsPage3;
+exports.DocsTitle = DocsTitle;
 exports.DotsLoader = DotsLoader;
 exports.DownloadIcon = DownloadIcon;
 exports.Drawer = Drawer;
@@ -8304,6 +10013,7 @@ exports.HanzoIcon = HanzoIcon;
 exports.HanzoLogoIcon = HanzoLogoIcon;
 exports.HanzoLogoSoloIcon = HanzoLogoSoloIcon;
 exports.HomeIcon = HomeIcon;
+exports.HomeLayout = HomeLayout;
 exports.HoverCard = HoverCard;
 exports.HoverCardContent = HoverCardContent;
 exports.HoverCardTrigger = HoverCardTrigger;
@@ -8388,6 +10098,7 @@ exports.ReasoningIcon = ReasoningIcon;
 exports.ResizableHandle = ResizableHandle;
 exports.ResizablePanel = ResizablePanel;
 exports.ResizablePanelGroup = ResizablePanelGroup;
+exports.RootProvider = RootProvider;
 exports.SaveIcon = SaveIcon;
 exports.ScheduledTasksComingSoonIcon = ScheduledTasksComingSoonIcon;
 exports.ScheduledTasksIcon = ScheduledTasksIcon;
@@ -8462,6 +10173,7 @@ exports.WebSearchDisabledIcon = WebSearchDisabledIcon;
 exports.WebSearchIcon = WebSearchIcon;
 exports.YouTubeEmbed = youtube_embed_default;
 exports.buttonVariants = buttonVariants;
+exports.defaultMdxComponents = defaultMdxComponents;
 exports.fileIconMap = fileIconMap;
 exports.navigationMenuTriggerStyle = navigationMenuTriggerStyle;
 exports.toggleVariants = toggleVariants;