@cloudvoyant/helix-react 0.11.0-rc.202608270956.10f653f

package/dist/index.cjs

@@ -0,0 +1,1425 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+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 __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.ts
+var index_exports = {};
+__export(index_exports, {
+  Badge: () => Badge,
+  Button: () => Button,
+  Card: () => Card,
+  CardBody: () => CardBody,
+  CardCover: () => CardCover,
+  CardDescription: () => CardDescription,
+  CardFooter: () => CardFooter,
+  CardHeader: () => CardHeader,
+  CardTitle: () => CardTitle,
+  Center: () => Center,
+  Col: () => Col,
+  Container: () => Container,
+  HStack: () => HStack,
+  Item: () => Item,
+  Navbar: () => Navbar,
+  NavbarActions: () => NavbarActions,
+  NavbarActivationArea: () => NavbarActivationArea,
+  NavbarBrand: () => NavbarBrand,
+  NavbarMenu: () => NavbarMenu,
+  NavbarMenuContent: () => NavbarMenuContent,
+  NavbarMenuIndicator: () => NavbarMenuIndicator,
+  NavbarMenuItem: () => NavbarMenuItem,
+  NavbarMenuLink: () => NavbarMenuLink,
+  NavbarMenuList: () => NavbarMenuList,
+  NavbarMenuTrigger: () => NavbarMenuTrigger,
+  NavbarMenuViewport: () => NavbarMenuViewport,
+  NavbarMenuViewportPositioner: () => import_navigation_menu.NavigationMenuViewportPositioner,
+  NavbarMobileMenu: () => NavbarMobileMenu,
+  NavbarMobileMenuContent: () => NavbarMobileMenuContent,
+  NavbarMobileMenuTrigger: () => NavbarMobileMenuTrigger,
+  NavbarMobileOverlay: () => NavbarMobileOverlay,
+  NavbarProvider: () => NavbarProvider,
+  NavbarTrigger: () => NavbarTrigger,
+  Pagination: () => Pagination,
+  PaginationEllipsis: () => PaginationEllipsis,
+  PaginationItem: () => PaginationItem,
+  PaginationItems: () => PaginationItems,
+  PaginationNext: () => PaginationNext,
+  PaginationPrevious: () => PaginationPrevious,
+  Row: () => Row,
+  Scroll: () => Scroll,
+  Sidebar: () => Root,
+  SidebarContent: () => Content,
+  SidebarFooter: () => Footer,
+  SidebarGroup: () => Group,
+  SidebarGroupAction: () => GroupAction,
+  SidebarHeader: () => Header,
+  SidebarInput: () => Input,
+  SidebarInset: () => Inset,
+  SidebarMenu: () => Menu,
+  SidebarMenuAction: () => MenuAction,
+  SidebarMenuBadge: () => MenuBadge,
+  SidebarMenuButton: () => MenuButton,
+  SidebarMenuItem: () => MenuItem,
+  SidebarMenuLink: () => MenuLink,
+  SidebarMenuSkeleton: () => MenuSkeleton,
+  SidebarMenuSub: () => MenuSub,
+  SidebarMenuSubButton: () => MenuSubButton,
+  SidebarMenuSubItem: () => MenuSubItem,
+  SidebarProvider: () => Provider,
+  SidebarRail: () => Rail,
+  SidebarSeparator: () => Separator,
+  SidebarTrigger: () => Trigger,
+  Splitter: () => Splitter,
+  SplitterPanel: () => SplitterPanel,
+  SplitterResizeTrigger: () => SplitterResizeTrigger,
+  SplitterResizeTriggerIndicator: () => SplitterResizeTriggerIndicator,
+  Stack: () => Stack,
+  Tabs: () => Tabs,
+  TabsContent: () => TabsContent,
+  TabsList: () => TabsList,
+  TabsTrigger: () => TabsTrigger,
+  ToggleButton: () => ToggleButton,
+  ToggleButtonIndicator: () => ToggleButtonIndicator,
+  VStack: () => VStack,
+  navbarMenuTriggerStyle: () => import_helix44.navbarMenuTriggerStyle,
+  useNavbar: () => useNavbar,
+  useSidebar: () => useSidebar,
+  useTabs: () => useTabs
+});
+module.exports = __toCommonJS(index_exports);
+
+// src/button.tsx
+var import_factory = require("@ark-ui/react/factory");
+var import_helix = require("@cloudvoyant/helix");
+var import_jsx_runtime = require("react/jsx-runtime");
+function Button({ className, variant, color, size, type = "button", ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_factory.ark.button, { type, className: (0, import_helix.cn)((0, import_helix.buttonVariants)({ variant, color, size }), className), ...props });
+}
+
+// src/toggle-button.tsx
+var import_toggle = require("@ark-ui/react/toggle");
+var import_helix2 = require("@cloudvoyant/helix");
+var import_jsx_runtime2 = require("react/jsx-runtime");
+function ToggleButton({ className, variant, size, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_toggle.ToggleRoot, { className: (0, import_helix2.cn)((0, import_helix2.toggleButtonVariants)({ variant, size }), className), ...props });
+}
+function ToggleButtonIndicator(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_toggle.ToggleIndicator, { ...props });
+}
+
+// src/badge.tsx
+var import_factory2 = require("@ark-ui/react/factory");
+var import_helix3 = require("@cloudvoyant/helix");
+var import_jsx_runtime3 = require("react/jsx-runtime");
+function Badge({ className, variant, color, size, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_factory2.ark.span, { className: (0, import_helix3.cn)((0, import_helix3.badgeVariants)({ variant, color, size }), className), ...props });
+}
+
+// src/container.tsx
+var import_factory3 = require("@ark-ui/react/factory");
+var import_helix4 = require("@cloudvoyant/helix");
+var import_jsx_runtime4 = require("react/jsx-runtime");
+function Container({ className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_factory3.ark.div, { className: (0, import_helix4.cn)(import_helix4.containerBase, className), ...props });
+}
+
+// src/row.tsx
+var import_factory4 = require("@ark-ui/react/factory");
+var import_helix5 = require("@cloudvoyant/helix");
+var import_jsx_runtime5 = require("react/jsx-runtime");
+function Row({ className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_factory4.ark.div, { className: (0, import_helix5.cn)(import_helix5.rowBase, className), ...props });
+}
+
+// src/col.tsx
+var import_factory5 = require("@ark-ui/react/factory");
+var import_helix6 = require("@cloudvoyant/helix");
+var import_jsx_runtime6 = require("react/jsx-runtime");
+function Col({ className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_factory5.ark.div, { className: (0, import_helix6.cn)(import_helix6.colBase, className), ...props });
+}
+
+// src/center.tsx
+var import_factory6 = require("@ark-ui/react/factory");
+var import_helix7 = require("@cloudvoyant/helix");
+var import_jsx_runtime7 = require("react/jsx-runtime");
+function Center({ className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_factory6.ark.div, { className: (0, import_helix7.cn)(import_helix7.centerBase, className), ...props });
+}
+
+// src/item.tsx
+var import_factory7 = require("@ark-ui/react/factory");
+var import_helix8 = require("@cloudvoyant/helix");
+var import_jsx_runtime8 = require("react/jsx-runtime");
+function Item({ className, variant, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_factory7.ark.div, { className: (0, import_helix8.cn)((0, import_helix8.itemVariants)({ variant }), className), ...props });
+}
+
+// src/card/root.tsx
+var import_factory8 = require("@ark-ui/react/factory");
+var import_helix9 = require("@cloudvoyant/helix");
+
+// src/card/context.ts
+var import_react = require("react");
+var CardOrientationContext = (0, import_react.createContext)("vertical");
+function useCardOrientation() {
+  return (0, import_react.useContext)(CardOrientationContext);
+}
+
+// src/card/root.tsx
+var import_jsx_runtime9 = require("react/jsx-runtime");
+function Card({ className, variant, size, orientation, children, ...props }) {
+  const resolvedOrientation = orientation ?? "vertical";
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(CardOrientationContext.Provider, { value: resolvedOrientation, children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_factory8.ark.div, { className: (0, import_helix9.cn)((0, import_helix9.cardVariants)({ variant, size, orientation: resolvedOrientation }), className), ...props, children }) });
+}
+
+// src/card/header.tsx
+var import_factory9 = require("@ark-ui/react/factory");
+var import_helix10 = require("@cloudvoyant/helix");
+var import_jsx_runtime10 = require("react/jsx-runtime");
+function CardHeader({ className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_factory9.ark.div, { className: (0, import_helix10.cn)(import_helix10.cardHeaderBase, className), ...props });
+}
+
+// src/card/body.tsx
+var import_factory10 = require("@ark-ui/react/factory");
+var import_helix11 = require("@cloudvoyant/helix");
+var import_jsx_runtime11 = require("react/jsx-runtime");
+function CardBody({ className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_factory10.ark.div, { className: (0, import_helix11.cn)(import_helix11.cardBodyBase, className), ...props });
+}
+
+// src/card/footer.tsx
+var import_factory11 = require("@ark-ui/react/factory");
+var import_helix12 = require("@cloudvoyant/helix");
+var import_jsx_runtime12 = require("react/jsx-runtime");
+function CardFooter({ className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_factory11.ark.div, { className: (0, import_helix12.cn)(import_helix12.cardFooterBase, className), ...props });
+}
+
+// src/card/title.tsx
+var import_factory12 = require("@ark-ui/react/factory");
+var import_helix13 = require("@cloudvoyant/helix");
+var import_jsx_runtime13 = require("react/jsx-runtime");
+function CardTitle({ className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_factory12.ark.h3, { className: (0, import_helix13.cn)(import_helix13.cardTitleBase, className), ...props });
+}
+
+// src/card/description.tsx
+var import_factory13 = require("@ark-ui/react/factory");
+var import_helix14 = require("@cloudvoyant/helix");
+var import_jsx_runtime14 = require("react/jsx-runtime");
+function CardDescription({ className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_factory13.ark.p, { className: (0, import_helix14.cn)(import_helix14.cardDescriptionBase, className), ...props });
+}
+
+// src/card/cover.tsx
+var import_factory14 = require("@ark-ui/react/factory");
+var import_helix15 = require("@cloudvoyant/helix");
+var import_jsx_runtime15 = require("react/jsx-runtime");
+function CardCover({ className, variant, orientation, ...props }) {
+  const contextOrientation = useCardOrientation();
+  return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+    import_factory14.ark.div,
+    {
+      className: (0, import_helix15.cn)((0, import_helix15.cardCoverVariants)({ variant, orientation: orientation ?? contextOrientation }), className),
+      ...props
+    }
+  );
+}
+
+// src/stack.tsx
+var import_factory15 = require("@ark-ui/react/factory");
+var import_helix16 = require("@cloudvoyant/helix");
+var import_jsx_runtime16 = require("react/jsx-runtime");
+function Stack({ className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_factory15.ark.div, { className: (0, import_helix16.cn)(import_helix16.stackBase, className), ...props });
+}
+function HStack({ className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_factory15.ark.div, { className: (0, import_helix16.cn)(import_helix16.hstackBase, className), ...props });
+}
+function VStack({ className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_factory15.ark.div, { className: (0, import_helix16.cn)(import_helix16.vstackBase, className), ...props });
+}
+
+// src/scroll.tsx
+var import_scroll_area = require("@ark-ui/react/scroll-area");
+var import_helix17 = require("@cloudvoyant/helix");
+var import_jsx_runtime17 = require("react/jsx-runtime");
+function Scroll({
+  className,
+  orientation = "vertical",
+  contentClassName,
+  thumbClassName,
+  viewportClassName,
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_scroll_area.ScrollAreaRoot, { className: (0, import_helix17.cn)(import_helix17.scrollRootBase, className), ...props, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_scroll_area.ScrollAreaViewport, { className: (0, import_helix17.cn)(import_helix17.scrollViewportBase, viewportClassName), children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_scroll_area.ScrollAreaContent, { className: (0, import_helix17.cn)(import_helix17.scrollContentBase, contentClassName), children }) }),
+    (orientation === "vertical" || orientation === "both") && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_scroll_area.ScrollAreaScrollbar, { orientation: "vertical", className: import_helix17.scrollScrollbarBase, children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_scroll_area.ScrollAreaThumb, { className: (0, import_helix17.cn)(import_helix17.scrollThumbBase, thumbClassName) }) }),
+    (orientation === "horizontal" || orientation === "both") && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_scroll_area.ScrollAreaScrollbar, { orientation: "horizontal", className: import_helix17.scrollScrollbarBase, children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_scroll_area.ScrollAreaThumb, { className: (0, import_helix17.cn)(import_helix17.scrollThumbBase, thumbClassName) }) }),
+    orientation === "both" && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_scroll_area.ScrollAreaCorner, { className: import_helix17.scrollCornerBase })
+  ] });
+}
+
+// src/splitter.tsx
+var import_splitter = require("@ark-ui/react/splitter");
+var import_helix18 = require("@cloudvoyant/helix");
+var import_jsx_runtime18 = require("react/jsx-runtime");
+function Splitter({ className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_splitter.SplitterRoot, { className: (0, import_helix18.cn)(import_helix18.splitterRootBase, className), ...props });
+}
+function SplitterPanel({ className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_splitter.SplitterPanel, { className: (0, import_helix18.cn)(import_helix18.splitterPanelBase, className), ...props });
+}
+function SplitterResizeTrigger({ className, children, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_splitter.SplitterResizeTrigger, { className: (0, import_helix18.cn)(import_helix18.splitterResizeTriggerBase, className), ...props, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { "aria-hidden": true, "data-part": "separator", className: import_helix18.splitterResizeTriggerSeparatorBase }),
+    children
+  ] });
+}
+function SplitterResizeTriggerIndicator({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+    import_splitter.SplitterResizeTriggerIndicator,
+    {
+      className: (0, import_helix18.cn)(import_helix18.splitterResizeTriggerIndicatorBase, className),
+      ...props
+    }
+  );
+}
+
+// src/sidebar/Provider.tsx
+var React2 = __toESM(require("react"), 1);
+var import_helix19 = require("@cloudvoyant/helix");
+
+// src/sidebar/context.ts
+var React = __toESM(require("react"), 1);
+var SidebarContext = React.createContext(null);
+function useSidebar() {
+  const context = React.useContext(SidebarContext);
+  if (!context) {
+    throw new Error("useSidebar must be used within a SidebarProvider.");
+  }
+  return context;
+}
+
+// src/sidebar/Provider.tsx
+var import_jsx_runtime19 = require("react/jsx-runtime");
+var SIDEBAR_COOKIE_NAME = "sidebar_state";
+var SIDEBAR_COOKIE_MAX_AGE = 60 * 60 * 24 * 7;
+function useIsMobile() {
+  const [isMobile, setIsMobile] = React2.useState(false);
+  const [isMobileSet, setIsMobileSet] = React2.useState(false);
+  React2.useEffect(() => {
+    const mql = window.matchMedia("(max-width: 767px)");
+    const onChange = () => {
+      setIsMobile(window.innerWidth < 768);
+      setIsMobileSet(true);
+    };
+    onChange();
+    mql.addEventListener("change", onChange);
+    return () => mql.removeEventListener("change", onChange);
+  }, []);
+  return isMobile && isMobileSet;
+}
+function Provider({
+  defaultOpen = true,
+  open: openProp,
+  onOpenChange: setOpenProp,
+  className,
+  style,
+  children,
+  ...props
+}) {
+  const isMobile = useIsMobile();
+  const [openMobile, setOpenMobile] = React2.useState(false);
+  const [_open, _setOpen] = React2.useState(defaultOpen);
+  const open = openProp ?? _open;
+  const setOpen = React2.useCallback(
+    (value) => {
+      const openState = typeof value === "function" ? value(open) : value;
+      if (setOpenProp) {
+        setOpenProp(openState);
+      } else {
+        _setOpen(openState);
+      }
+      if (typeof document !== "undefined") {
+        document.cookie = `${SIDEBAR_COOKIE_NAME}=${openState}; path=/; max-age=${SIDEBAR_COOKIE_MAX_AGE}`;
+      }
+    },
+    [setOpenProp, open]
+  );
+  const toggleSidebar = React2.useCallback(() => {
+    return isMobile ? setOpenMobile((open2) => !open2) : setOpen((open2) => !open2);
+  }, [isMobile, setOpen, setOpenMobile]);
+  React2.useEffect(() => {
+    if (openProp !== void 0) return;
+    if (typeof document === "undefined") return;
+    const cookie = document.cookie.split("; ").find((row) => row.startsWith(`${SIDEBAR_COOKIE_NAME}=`));
+    if (cookie) {
+      _setOpen(cookie.split("=")[1] === "true");
+    }
+  }, [openProp]);
+  React2.useEffect(() => {
+    const handleKeyDown = (event) => {
+      if (event.key === import_helix19.SIDEBAR_KEYBOARD_SHORTCUT && (event.metaKey || event.ctrlKey)) {
+        event.preventDefault();
+        toggleSidebar();
+      }
+    };
+    window.addEventListener("keydown", handleKeyDown);
+    return () => window.removeEventListener("keydown", handleKeyDown);
+  }, [toggleSidebar]);
+  const state = open ? "expanded" : "collapsed";
+  const contextValue = React2.useMemo(
+    () => ({
+      state,
+      open,
+      setOpen,
+      isMobile,
+      openMobile,
+      setOpenMobile,
+      toggleSidebar
+    }),
+    [state, open, setOpen, isMobile, openMobile, setOpenMobile, toggleSidebar]
+  );
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(SidebarContext.Provider, { value: contextValue, children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+    Row,
+    {
+      "data-slot": "sidebar-wrapper",
+      style: {
+        "--sidebar-width": import_helix19.SIDEBAR_WIDTH,
+        "--sidebar-width-icon": import_helix19.SIDEBAR_WIDTH_ICON,
+        ...style
+      },
+      className: (0, import_helix19.cn)(import_helix19.sidebarStyles.wrapperClass, className),
+      ...props,
+      children
+    }
+  ) });
+}
+
+// src/sidebar/Root.tsx
+var import_drawer = require("@ark-ui/react/drawer");
+var import_helix20 = require("@cloudvoyant/helix");
+var import_jsx_runtime20 = require("react/jsx-runtime");
+function Root({
+  side = "left",
+  variant = "sidebar",
+  collapsible = "offcanvas",
+  className,
+  children,
+  ...props
+}) {
+  const { isMobile, state, openMobile, setOpenMobile } = useSidebar();
+  if (collapsible === "none") {
+    return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+      Col,
+      {
+        "data-slot": "sidebar",
+        "data-sidebar": "sidebar",
+        className: (0, import_helix20.cn)("h-full w-(--sidebar-width) bg-sidebar text-sidebar-foreground", className),
+        ...props,
+        children
+      }
+    );
+  }
+  if (isMobile) {
+    return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
+      import_drawer.DrawerRoot,
+      {
+        open: openMobile,
+        onOpenChange: (details) => setOpenMobile(details.open),
+        ...props,
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_drawer.DrawerBackdrop, {}),
+          /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_drawer.DrawerPositioner, { className: "w-(--sidebar-width)", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
+            import_drawer.DrawerContent,
+            {
+              "data-sidebar": "sidebar",
+              "data-slot": "sidebar",
+              "data-mobile": "true",
+              className: (0, import_helix20.cn)("w-(--sidebar-width) bg-sidebar p-0 text-sidebar-foreground", className),
+              style: { "--sidebar-width": import_helix20.SIDEBAR_WIDTH_MOBILE },
+              children: [
+                /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_drawer.DrawerTitle, { className: "sr-only", children: "Sidebar" }),
+                /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_drawer.DrawerDescription, { className: "sr-only", children: "Displays the mobile sidebar." }),
+                /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_drawer.DrawerCloseTrigger, { className: "hidden" }),
+                /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Col, { className: "h-full w-full", children })
+              ]
+            }
+          ) })
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
+    "div",
+    {
+      className: "group peer hidden text-sidebar-foreground md:block",
+      "data-state": state,
+      "data-collapsible": state === "collapsed" ? collapsible : "",
+      "data-variant": variant,
+      "data-side": side,
+      "data-slot": "sidebar",
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+          "div",
+          {
+            "data-slot": "sidebar-gap",
+            className: (0, import_helix20.cn)(
+              import_helix20.sidebarStyles.gapClass,
+              side === "right" && "rotate-180",
+              variant === "floating" || variant === "inset" ? "group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4)))]" : "group-data-[collapsible=icon]:w-(--sidebar-width-icon)"
+            )
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+          "div",
+          {
+            "data-slot": "sidebar-container",
+            className: (0, import_helix20.cn)(
+              import_helix20.sidebarStyles.containerClass,
+              side === "left" ? "left-0 group-data-[collapsible=offcanvas]:left-[calc(var(--sidebar-width)*-1)]" : "right-0 group-data-[collapsible=offcanvas]:right-[calc(var(--sidebar-width)*-1)]",
+              variant === "floating" || variant === "inset" ? "p-2 group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4))+2px)]" : "group-data-[collapsible=icon]:w-(--sidebar-width-icon) group-data-[side=left]:border-r group-data-[side=right]:border-l",
+              className
+            ),
+            ...props,
+            children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+              "div",
+              {
+                "data-sidebar": "sidebar",
+                "data-slot": "sidebar-inner",
+                "data-variant": variant,
+                className: (0, import_helix20.cn)(import_helix20.sidebarStyles.innerClass),
+                children
+              }
+            )
+          }
+        )
+      ]
+    }
+  );
+}
+
+// src/sidebar/Header.tsx
+var import_helix21 = require("@cloudvoyant/helix");
+var import_jsx_runtime21 = require("react/jsx-runtime");
+function Header({ className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+    Col,
+    {
+      "data-slot": "sidebar-header",
+      "data-sidebar": "header",
+      className: (0, import_helix21.cn)(import_helix21.sidebarStyles.headerClass, className),
+      ...props
+    }
+  );
+}
+
+// src/sidebar/Footer.tsx
+var import_helix22 = require("@cloudvoyant/helix");
+var import_jsx_runtime22 = require("react/jsx-runtime");
+function Footer({ className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+    Col,
+    {
+      "data-slot": "sidebar-footer",
+      "data-sidebar": "footer",
+      className: (0, import_helix22.cn)(import_helix22.sidebarStyles.footerClass, className),
+      ...props
+    }
+  );
+}
+
+// src/sidebar/Separator.tsx
+var import_factory16 = require("@ark-ui/react/factory");
+var import_helix23 = require("@cloudvoyant/helix");
+var import_jsx_runtime23 = require("react/jsx-runtime");
+function Separator({ className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+    import_factory16.ark.div,
+    {
+      "data-slot": "sidebar-separator",
+      "data-sidebar": "separator",
+      role: "separator",
+      className: (0, import_helix23.cn)(import_helix23.sidebarStyles.separatorClass, className),
+      ...props
+    }
+  );
+}
+
+// src/sidebar/Content.tsx
+var import_helix24 = require("@cloudvoyant/helix");
+var import_jsx_runtime24 = require("react/jsx-runtime");
+function Content({ className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+    Col,
+    {
+      "data-slot": "sidebar-content",
+      "data-sidebar": "content",
+      className: (0, import_helix24.cn)(import_helix24.sidebarStyles.contentClass, className),
+      ...props
+    }
+  );
+}
+
+// src/sidebar/Group.tsx
+var import_helix25 = require("@cloudvoyant/helix");
+var import_jsx_runtime25 = require("react/jsx-runtime");
+function Group({ label, className, children, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(Col, { "data-slot": "sidebar-group", "data-sidebar": "group", className: (0, import_helix25.cn)(import_helix25.sidebarStyles.groupClass, className), ...props, children: [
+    label && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { "data-slot": "sidebar-group-label", "data-sidebar": "group-label", className: (0, import_helix25.cn)(import_helix25.sidebarStyles.groupLabelClass), children: label }),
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { "data-slot": "sidebar-group-content", "data-sidebar": "group-content", className: (0, import_helix25.cn)(import_helix25.sidebarStyles.groupContentClass), children })
+  ] });
+}
+
+// src/sidebar/GroupAction.tsx
+var import_factory17 = require("@ark-ui/react/factory");
+var import_helix26 = require("@cloudvoyant/helix");
+var import_jsx_runtime26 = require("react/jsx-runtime");
+function GroupAction({ className, asChild = false, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+    import_factory17.ark.button,
+    {
+      "data-slot": "sidebar-group-action",
+      "data-sidebar": "group-action",
+      asChild,
+      type: "button",
+      className: (0, import_helix26.cn)(import_helix26.sidebarStyles.groupActionClass, className),
+      ...props
+    }
+  );
+}
+
+// src/sidebar/Menu.tsx
+var import_factory18 = require("@ark-ui/react/factory");
+var import_helix27 = require("@cloudvoyant/helix");
+var import_jsx_runtime27 = require("react/jsx-runtime");
+function Menu({ className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+    import_factory18.ark.ul,
+    {
+      "data-slot": "sidebar-menu",
+      "data-sidebar": "menu",
+      className: (0, import_helix27.cn)(import_helix27.sidebarStyles.menuClass, className),
+      ...props
+    }
+  );
+}
+
+// src/sidebar/MenuItem.tsx
+var import_factory19 = require("@ark-ui/react/factory");
+var import_helix28 = require("@cloudvoyant/helix");
+var import_jsx_runtime28 = require("react/jsx-runtime");
+function MenuItem({ className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+    import_factory19.ark.li,
+    {
+      "data-slot": "sidebar-menu-item",
+      "data-sidebar": "menu-item",
+      className: (0, import_helix28.cn)(import_helix28.sidebarStyles.menuItemClass, className),
+      ...props
+    }
+  );
+}
+
+// src/sidebar/MenuButton.tsx
+var import_factory20 = require("@ark-ui/react/factory");
+var import_tooltip = require("@ark-ui/react/tooltip");
+var import_helix29 = require("@cloudvoyant/helix");
+var import_jsx_runtime29 = require("react/jsx-runtime");
+function MenuButton({
+  asChild = false,
+  isActive = false,
+  variant = "default",
+  size = "default",
+  tooltip,
+  className,
+  children,
+  ...props
+}) {
+  const { isMobile, state } = useSidebar();
+  const button = /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+    import_factory20.ark.button,
+    {
+      "data-slot": "sidebar-menu-button",
+      "data-sidebar": "menu-button",
+      "data-size": size,
+      "data-active": isActive,
+      asChild,
+      type: "button",
+      className: (0, import_helix29.cn)((0, import_helix29.sidebarMenuButtonVariants)({ variant, size }), className),
+      ...props,
+      children
+    }
+  );
+  if (!tooltip || state !== "collapsed" || isMobile) {
+    return button;
+  }
+  const tooltipContent = typeof tooltip === "string" ? { children: tooltip } : tooltip;
+  return /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(import_tooltip.TooltipRoot, { openDelay: 0, positioning: { placement: "right", gutter: 8 }, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_tooltip.TooltipTrigger, { asChild: true, children: button }),
+    /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_tooltip.TooltipPositioner, { children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_tooltip.TooltipContent, { className: (0, import_helix29.cn)(import_helix29.sidebarStyles.tooltipContentClass), ...tooltipContent }) })
+  ] });
+}
+
+// src/sidebar/MenuLink.tsx
+var import_helix30 = require("@cloudvoyant/helix");
+var import_jsx_runtime30 = require("react/jsx-runtime");
+function MenuLink({ icon, href, onClick, isActive, variant, size, tooltip, className, children }) {
+  const content = /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_jsx_runtime30.Fragment, { children: [
+    icon,
+    children != null && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("span", { children })
+  ] });
+  return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("li", { "data-slot": "sidebar-menu-item", "data-sidebar": "menu-item", className: (0, import_helix30.cn)(import_helix30.sidebarStyles.menuItemClass), children: href != null ? /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(MenuButton, { asChild: true, isActive, variant, size, tooltip, className, children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("a", { href, onClick, children: content }) }) : /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(MenuButton, { isActive, variant, size, tooltip, className, onClick, children: content }) });
+}
+
+// src/sidebar/MenuAction.tsx
+var import_factory21 = require("@ark-ui/react/factory");
+var import_helix31 = require("@cloudvoyant/helix");
+var import_jsx_runtime31 = require("react/jsx-runtime");
+function MenuAction({
+  className,
+  asChild = false,
+  showOnHover = false,
+  ...props
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+    import_factory21.ark.button,
+    {
+      "data-slot": "sidebar-menu-action",
+      "data-sidebar": "menu-action",
+      asChild,
+      type: "button",
+      className: (0, import_helix31.cn)(
+        import_helix31.sidebarStyles.menuActionClass,
+        showOnHover && "group-focus-within/menu-item:opacity-100 group-hover/menu-item:opacity-100 peer-data-[active=true]/menu-button:text-sidebar-accent-foreground data-[state=open]:opacity-100 md:opacity-0",
+        className
+      ),
+      ...props
+    }
+  );
+}
+
+// src/sidebar/MenuBadge.tsx
+var import_factory22 = require("@ark-ui/react/factory");
+var import_helix32 = require("@cloudvoyant/helix");
+var import_jsx_runtime32 = require("react/jsx-runtime");
+function MenuBadge({ className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+    import_factory22.ark.div,
+    {
+      "data-slot": "sidebar-menu-badge",
+      "data-sidebar": "menu-badge",
+      className: (0, import_helix32.cn)(import_helix32.sidebarStyles.menuBadgeClass, className),
+      ...props
+    }
+  );
+}
+
+// src/sidebar/MenuSkeleton.tsx
+var React3 = __toESM(require("react"), 1);
+var import_factory23 = require("@ark-ui/react/factory");
+var import_helix33 = require("@cloudvoyant/helix");
+var import_jsx_runtime33 = require("react/jsx-runtime");
+function MenuSkeleton({ className, showIcon = false, ...props }) {
+  const width = React3.useMemo(() => `${Math.floor(Math.random() * 40) + 50}%`, []);
+  return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(
+    import_factory23.ark.div,
+    {
+      "data-slot": "sidebar-menu-skeleton",
+      "data-sidebar": "menu-skeleton",
+      className: (0, import_helix33.cn)(import_helix33.sidebarStyles.menuSkeletonClass, className),
+      ...props,
+      children: [
+        showIcon && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+          import_factory23.ark.div,
+          {
+            className: "size-4 shrink-0 animate-pulse rounded-md bg-sidebar-accent",
+            "data-sidebar": "menu-skeleton-icon"
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+          import_factory23.ark.div,
+          {
+            className: "h-4 max-w-(--skeleton-width) flex-1 animate-pulse rounded-md bg-sidebar-accent",
+            "data-sidebar": "menu-skeleton-text",
+            style: { "--skeleton-width": width }
+          }
+        )
+      ]
+    }
+  );
+}
+
+// src/sidebar/MenuSub.tsx
+var import_factory24 = require("@ark-ui/react/factory");
+var import_helix34 = require("@cloudvoyant/helix");
+var import_jsx_runtime34 = require("react/jsx-runtime");
+function MenuSub({ className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
+    import_factory24.ark.ul,
+    {
+      "data-slot": "sidebar-menu-sub",
+      "data-sidebar": "menu-sub",
+      className: (0, import_helix34.cn)(import_helix34.sidebarStyles.menuSubClass, className),
+      ...props
+    }
+  );
+}
+
+// src/sidebar/MenuSubItem.tsx
+var import_factory25 = require("@ark-ui/react/factory");
+var import_helix35 = require("@cloudvoyant/helix");
+var import_jsx_runtime35 = require("react/jsx-runtime");
+function MenuSubItem({ className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
+    import_factory25.ark.li,
+    {
+      "data-slot": "sidebar-menu-sub-item",
+      "data-sidebar": "menu-sub-item",
+      className: (0, import_helix35.cn)(import_helix35.sidebarStyles.menuSubItemClass, className),
+      ...props
+    }
+  );
+}
+
+// src/sidebar/MenuSubButton.tsx
+var import_factory26 = require("@ark-ui/react/factory");
+var import_helix36 = require("@cloudvoyant/helix");
+var import_jsx_runtime36 = require("react/jsx-runtime");
+function MenuSubButton({
+  asChild = false,
+  size = "md",
+  isActive = false,
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
+    import_factory26.ark.a,
+    {
+      "data-slot": "sidebar-menu-sub-button",
+      "data-sidebar": "menu-sub-button",
+      "data-size": size,
+      "data-active": isActive,
+      asChild,
+      className: (0, import_helix36.cn)(import_helix36.sidebarStyles.menuSubButtonClass, className),
+      ...props
+    }
+  );
+}
+
+// src/sidebar/Trigger.tsx
+var import_factory27 = require("@ark-ui/react/factory");
+var import_helix37 = require("@cloudvoyant/helix");
+var import_jsx_runtime37 = require("react/jsx-runtime");
+function Trigger({ className, onClick, children, ...props }) {
+  const { toggleSidebar } = useSidebar();
+  return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
+    import_factory27.ark.button,
+    {
+      "data-sidebar": "trigger",
+      "data-slot": "sidebar-trigger",
+      type: "button",
+      "aria-label": "Toggle Sidebar",
+      className: (0, import_helix37.cn)(import_helix37.sidebarStyles.triggerClass, className),
+      onClick: (event) => {
+        onClick?.(event);
+        toggleSidebar();
+      },
+      ...props,
+      children
+    }
+  );
+}
+
+// src/sidebar/Rail.tsx
+var import_factory28 = require("@ark-ui/react/factory");
+var import_helix38 = require("@cloudvoyant/helix");
+var import_jsx_runtime38 = require("react/jsx-runtime");
+function Rail({ className, ...props }) {
+  const { toggleSidebar } = useSidebar();
+  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
+    import_factory28.ark.button,
+    {
+      "data-sidebar": "rail",
+      "data-slot": "sidebar-rail",
+      type: "button",
+      "aria-label": "Toggle Sidebar",
+      tabIndex: -1,
+      onClick: toggleSidebar,
+      title: "Toggle Sidebar",
+      className: (0, import_helix38.cn)(import_helix38.sidebarStyles.railClass, className),
+      ...props
+    }
+  );
+}
+
+// src/sidebar/Inset.tsx
+var import_factory29 = require("@ark-ui/react/factory");
+var import_helix39 = require("@cloudvoyant/helix");
+var import_jsx_runtime39 = require("react/jsx-runtime");
+function Inset({ className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_factory29.ark.main, { "data-slot": "sidebar-inset", className: (0, import_helix39.cn)(import_helix39.sidebarStyles.insetClass, className), ...props });
+}
+
+// src/sidebar/Input.tsx
+var import_factory30 = require("@ark-ui/react/factory");
+var import_helix40 = require("@cloudvoyant/helix");
+var import_jsx_runtime40 = require("react/jsx-runtime");
+function Input({ className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
+    import_factory30.ark.input,
+    {
+      "data-slot": "sidebar-input",
+      "data-sidebar": "input",
+      className: (0, import_helix40.cn)(import_helix40.sidebarStyles.inputClass, className),
+      ...props
+    }
+  );
+}
+
+// src/tabs.tsx
+var import_tabs = require("@ark-ui/react/tabs");
+var import_helix41 = require("@cloudvoyant/helix");
+var import_jsx_runtime41 = require("react/jsx-runtime");
+function Tabs({ className, lazyMount = true, unmountOnExit = true, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+    import_tabs.TabsRoot,
+    {
+      lazyMount,
+      unmountOnExit,
+      className: (0, import_helix41.cn)(import_helix41.tabsRootBase, className),
+      ...props
+    }
+  );
+}
+function TabsList({ variant = "default", className, children, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(import_tabs.TabList, { className: (0, import_helix41.cn)(import_helix41.tabsListBase, (0, import_helix41.tabsListVariants)({ variant }), className), ...props, children: [
+    children,
+    /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_tabs.TabIndicator, { className: (0, import_helix41.cn)(import_helix41.tabsIndicatorBase, (0, import_helix41.tabsIndicatorVariants)({ variant })) })
+  ] });
+}
+function TabsTrigger({ className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_tabs.TabTrigger, { className: (0, import_helix41.cn)(import_helix41.tabsTriggerBase, className), ...props });
+}
+function TabsContent({ className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_tabs.TabContent, { className: (0, import_helix41.cn)(import_helix41.tabsContentBase, className), ...props });
+}
+var useTabs = import_tabs.useTabsContext;
+
+// src/pagination.tsx
+var import_pagination = require("@ark-ui/react/pagination");
+var import_factory31 = require("@ark-ui/react/factory");
+var import_helix42 = require("@cloudvoyant/helix");
+var import_jsx_runtime42 = require("react/jsx-runtime");
+function Pagination({ className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_pagination.PaginationRoot, { className: (0, import_helix42.cn)(import_helix42.paginationRootBase, className), ...props });
+}
+function PaginationPrevious(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_pagination.PaginationPrevTrigger, { asChild: true, ...props, children: /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(import_factory31.ark.button, { className: (0, import_helix42.cn)(import_helix42.paginationTriggerBase), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+      "svg",
+      {
+        viewBox: "0 0 24 24",
+        fill: "none",
+        stroke: "currentColor",
+        strokeWidth: "2",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        "aria-hidden": "true",
+        children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("path", { d: "m15 18-6-6 6-6" })
+      }
+    ),
+    "Previous"
+  ] }) });
+}
+function PaginationNext(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_pagination.PaginationNextTrigger, { asChild: true, ...props, children: /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(import_factory31.ark.button, { className: (0, import_helix42.cn)(import_helix42.paginationTriggerBase), children: [
+    "Next",
+    /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+      "svg",
+      {
+        viewBox: "0 0 24 24",
+        fill: "none",
+        stroke: "currentColor",
+        strokeWidth: "2",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        "aria-hidden": "true",
+        children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("path", { d: "m9 18 6-6-6-6" })
+      }
+    )
+  ] }) });
+}
+function PaginationItem({ className, children, ...rest }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_pagination.PaginationItem, { asChild: true, ...rest, children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_factory31.ark.button, { className: (0, import_helix42.cn)(import_helix42.paginationItemBase, className), children }) });
+}
+function PaginationItems() {
+  return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_pagination.PaginationContext, { children: ({ pages }) => pages.map(
+    (page, index) => page.type === "page" ? /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(PaginationItem, { type: "page", value: page.value, children: page.value }, page.value) : /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(PaginationEllipsis, { index }, `ellipsis-${index}`)
+  ) });
+}
+function PaginationEllipsis({ className, ...rest }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_pagination.PaginationEllipsis, { className: (0, import_helix42.cn)(import_helix42.paginationEllipsisBase, className), ...rest, children: /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
+    "svg",
+    {
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      "aria-hidden": "true",
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("circle", { cx: "12", cy: "12", r: "1" }),
+        /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("circle", { cx: "19", cy: "12", r: "1" }),
+        /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("circle", { cx: "5", cy: "12", r: "1" })
+      ]
+    }
+  ) });
+}
+
+// src/navbar.tsx
+var React4 = __toESM(require("react"), 1);
+var import_factory32 = require("@ark-ui/react/factory");
+var import_portal = require("@ark-ui/react/portal");
+var import_collapsible = require("@ark-ui/react/collapsible");
+var import_dialog = require("@ark-ui/react/dialog");
+var import_navigation_menu = require("@ark-ui/react/navigation-menu");
+var import_helix43 = require("@cloudvoyant/helix");
+var import_helix44 = require("@cloudvoyant/helix");
+var import_jsx_runtime43 = require("react/jsx-runtime");
+var SCROLL_THRESHOLD = 24;
+function resolveScrollContainer(el) {
+  for (let n = el; n; n = n.parentElement) {
+    const oy = getComputedStyle(n).overflowY;
+    if (oy === "auto" || oy === "scroll" || oy === "overlay") return n;
+  }
+  return null;
+}
+var NavbarContext = React4.createContext(null);
+function useNavbar() {
+  const context = React4.useContext(NavbarContext);
+  if (!context) {
+    throw new Error("Navbar parts must be used within a NavbarProvider.");
+  }
+  return context;
+}
+function useNavbarSlot(key, children) {
+  const { setSlot } = useNavbar();
+  React4.useLayoutEffect(() => {
+    setSlot(key, children);
+  }, [key, children, setSlot]);
+}
+var NavbarMenuStyleContext = React4.createContext({
+  density: "relaxed",
+  variant: "default",
+  inContent: false
+});
+function NavbarProvider({
+  defaultOpen = false,
+  children
+}) {
+  const id = React4.useId();
+  const [open, setOpen] = React4.useState(defaultOpen);
+  const [scrolled, setScrolled] = React4.useState(false);
+  const [hovered, setHovered] = React4.useState(false);
+  const [slots, setSlots] = React4.useState({
+    brand: null,
+    actions: null
+  });
+  const portalRef = React4.useRef(null);
+  const setSlot = React4.useCallback((key, node) => {
+    setSlots((prev) => prev[key] === node ? prev : { ...prev, [key]: node });
+  }, []);
+  const contextValue = React4.useMemo(
+    () => ({
+      id,
+      open,
+      setOpen,
+      scrolled,
+      setScrolled,
+      hovered,
+      setHovered,
+      slots,
+      setSlot,
+      portalRef,
+      // Baseline config; the Navbar header overrides these with its props.
+      variant: "sticky",
+      floating: false,
+      density: "relaxed"
+    }),
+    [id, open, scrolled, hovered, slots, setSlot]
+  );
+  return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(NavbarContext.Provider, { value: contextValue, children });
+}
+function Navbar({
+  variant = "sticky",
+  floating = false,
+  density = "relaxed",
+  className,
+  children,
+  ...props
+}) {
+  const base = useNavbar();
+  const headerRef = React4.useRef(null);
+  const { setScrolled, setHovered } = base;
+  React4.useEffect(() => {
+    const target = resolveScrollContainer(headerRef.current) ?? window;
+    const getY = () => target === window ? window.scrollY : target.scrollTop;
+    const onScroll = () => setScrolled(getY() > SCROLL_THRESHOLD);
+    onScroll();
+    target.addEventListener("scroll", onScroll, { passive: true });
+    return () => target.removeEventListener("scroll", onScroll);
+  }, [setScrolled]);
+  const value = React4.useMemo(
+    () => ({ ...base, variant, floating, density }),
+    [base, variant, floating, density]
+  );
+  const hidden = variant === "hide" && base.scrolled && !base.hovered;
+  const shrunk = variant === "shrink" && base.scrolled;
+  React4.useLayoutEffect(() => {
+    base.portalRef.current = headerRef.current?.parentElement ?? null;
+  });
+  React4.useEffect(() => {
+    if (!base.open) return;
+    const el = resolveScrollContainer(headerRef.current) ?? document.documentElement;
+    const prev = el.style.overflow;
+    el.style.overflow = "hidden";
+    return () => {
+      el.style.overflow = prev;
+    };
+  }, [base.open]);
+  return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(NavbarContext.Provider, { value, children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
+    "header",
+    {
+      ref: headerRef,
+      "data-slot": "navbar",
+      "data-scrolled": base.scrolled || void 0,
+      "data-hidden": hidden || void 0,
+      "data-shrunk": shrunk || void 0,
+      className: (0, import_helix43.cn)(
+        (0, import_helix43.navbarVariants)({ variant, floating }),
+        import_helix43.navbarContainerBase,
+        (0, import_helix43.navbarDensityVariants)({ density }),
+        shrunk && import_helix43.navbarShrunkBase,
+        className
+      ),
+      onMouseEnter: () => setHovered(true),
+      onMouseLeave: () => setHovered(false),
+      ...props,
+      children
+    }
+  ) });
+}
+function NavbarActivationArea({ className, children, ...props }) {
+  const { setHovered } = useNavbar();
+  return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
+    import_factory32.ark.div,
+    {
+      "data-slot": "navbar-activation-area",
+      className: (0, import_helix43.cn)(import_helix43.navbarActivationAreaBase, className),
+      onMouseEnter: () => setHovered(true),
+      onMouseLeave: () => setHovered(false),
+      ...props,
+      children
+    }
+  );
+}
+function NavbarBrand({ className, children, ...props }) {
+  useNavbarSlot("brand", children);
+  return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_factory32.ark.div, { "data-slot": "navbar-brand", className: (0, import_helix43.cn)(import_helix43.navbarBrandBase, className), ...props, children });
+}
+function NavbarMenu({
+  placement = "center",
+  className,
+  children,
+  ...props
+}) {
+  const { scrolled, density, variant } = useNavbar();
+  const menuDensity = density === "compact" || variant === "shrink" && scrolled ? "compact" : "relaxed";
+  return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(NavbarMenuStyleContext.Provider, { value: { density: menuDensity, variant: "default", inContent: false }, children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
+    import_factory32.ark.div,
+    {
+      "data-slot": "navbar-menu",
+      "data-placement": placement,
+      className: (0, import_helix43.cn)(import_helix43.navbarMenuBase, (0, import_helix43.navbarMenuPlacementVariants)({ placement }), className),
+      children: /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(import_navigation_menu.NavigationMenuRoot, { "data-density": menuDensity, className: (0, import_helix43.cn)(import_helix43.navbarMenuRootBase), ...props, children: [
+        children,
+        /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_navigation_menu.NavigationMenuViewportPositioner, { className: (0, import_helix43.cn)(import_helix43.navbarMenuViewportPositionerBase), children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_navigation_menu.NavigationMenuViewport, { className: (0, import_helix43.cn)(import_helix43.navbarMenuViewportBase) }) })
+      ] })
+    }
+  ) });
+}
+function NavbarMenuList({ className, children, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_navigation_menu.NavigationMenuList, { className: (0, import_helix43.cn)(import_helix43.navbarMenuListBase, className), ...props, children });
+}
+function NavbarMenuItem({
+  variant = "default",
+  className,
+  ...props
+}) {
+  const { density } = React4.useContext(NavbarMenuStyleContext);
+  return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(NavbarMenuStyleContext.Provider, { value: { density, variant, inContent: false }, children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_navigation_menu.NavigationMenuItem, { "data-variant": variant, className: (0, import_helix43.cn)(import_helix43.navbarMenuItemBase, className), ...props }) });
+}
+function NavbarMenuTrigger({ asChild, className, children, ...props }) {
+  const { density, variant } = React4.useContext(NavbarMenuStyleContext);
+  const chevron = /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
+    "svg",
+    {
+      className: "relative top-[1px] ml-1 size-3 transition duration-300 group-data-[state=open]:rotate-180",
+      "aria-hidden": "true",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("path", { d: "m6 9 6 6 6-6" })
+    }
+  );
+  return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_navigation_menu.NavigationMenuTrigger, { asChild, className: (0, import_helix43.cn)((0, import_helix43.navbarMenuTriggerStyle)({ density, variant }), className), ...props, children: asChild ? children : /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(import_jsx_runtime43.Fragment, { children: [
+    children,
+    chevron
+  ] }) });
+}
+function NavbarMenuContent({ className, children, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(NavbarMenuStyleContext.Provider, { value: { density: "relaxed", variant: "default", inContent: true }, children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_navigation_menu.NavigationMenuContent, { className: (0, import_helix43.cn)(import_helix43.navbarMenuContentBase, className), ...props, children }) });
+}
+function NavbarMenuLink({ className, children, ...props }) {
+  const { density, variant, inContent } = React4.useContext(NavbarMenuStyleContext);
+  const classes = inContent ? (0, import_helix43.cn)(import_helix43.navbarMenuLinkBase, className) : (0, import_helix43.cn)((0, import_helix43.navbarMenuTriggerStyle)({ density, variant }), className);
+  return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_navigation_menu.NavigationMenuLink, { className: classes, ...props, children });
+}
+function NavbarMobileMenu({ className, children, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_collapsible.CollapsibleRoot, { "data-slot": "navbar-mobile-menu", className: (0, import_helix43.cn)("group", className), ...props, children });
+}
+function NavbarMobileMenuTrigger({ className, children, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_collapsible.CollapsibleTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(
+    "button",
+    {
+      type: "button",
+      "data-slot": "navbar-mobile-menu-trigger",
+      className: (0, import_helix43.cn)(import_helix43.navbarMobileMenuTriggerBase, className),
+      ...props,
+      children: [
+        children,
+        /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
+          "svg",
+          {
+            className: "size-4 transition-transform duration-200 group-data-[state=open]:rotate-180",
+            "aria-hidden": "true",
+            viewBox: "0 0 24 24",
+            fill: "none",
+            stroke: "currentColor",
+            strokeWidth: "2",
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("path", { d: "m6 9 6 6 6-6" })
+          }
+        )
+      ]
+    }
+  ) });
+}
+function NavbarMobileMenuContent({ className, children, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_collapsible.CollapsibleContent, { children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { "data-slot": "navbar-mobile-menu-content", className: (0, import_helix43.cn)(import_helix43.navbarMobileMenuContentBase, className), ...props, children }) });
+}
+function NavbarMenuViewport({ className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_navigation_menu.NavigationMenuViewport, { className: (0, import_helix43.cn)(import_helix43.navbarMenuViewportBase, className), ...props });
+}
+function NavbarMenuIndicator({ className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_navigation_menu.NavigationMenuIndicator, { className: (0, import_helix43.cn)(import_helix43.navbarMenuIndicatorBase, className), ...props });
+}
+function NavbarActions({ className, children, ...props }) {
+  useNavbarSlot("actions", children);
+  return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_factory32.ark.div, { "data-slot": "navbar-actions", className: (0, import_helix43.cn)(import_helix43.navbarActionsBase, className), ...props, children });
+}
+function NavbarTrigger({
+  className,
+  children,
+  "aria-label": ariaLabel,
+  ...props
+}) {
+  const { id, open, setOpen, floating } = useNavbar();
+  return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
+    "button",
+    {
+      type: "button",
+      "data-slot": "navbar-trigger",
+      "aria-expanded": open,
+      "aria-controls": id,
+      "aria-label": ariaLabel ?? "Toggle navigation menu",
+      className: (0, import_helix43.cn)((0, import_helix43.navbarTriggerVariants)({ floating }), "md:hidden", className),
+      onClick: () => setOpen(!open),
+      ...props,
+      children: children ?? /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(
+        "svg",
+        {
+          className: "size-4",
+          viewBox: "0 0 24 24",
+          fill: "none",
+          stroke: "currentColor",
+          strokeWidth: "2",
+          strokeLinecap: "round",
+          strokeLinejoin: "round",
+          "aria-hidden": "true",
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("line", { x1: "4", x2: "20", y1: "6", y2: "6" }),
+            /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("line", { x1: "4", x2: "20", y1: "12", y2: "12" }),
+            /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("line", { x1: "4", x2: "20", y1: "18", y2: "18" })
+          ]
+        }
+      )
+    }
+  );
+}
+function NavbarMobileOverlay({ className, children, ...props }) {
+  const { id, open, setOpen, slots, floating, portalRef } = useNavbar();
+  React4.useEffect(() => {
+    if (!open) return;
+    const onKeydown = (event) => {
+      if (event.key === "Escape") setOpen(false);
+    };
+    document.addEventListener("keydown", onKeydown);
+    return () => document.removeEventListener("keydown", onKeydown);
+  }, [open, setOpen]);
+  return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_portal.Portal, { container: portalRef, children: /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(import_dialog.DialogRoot, { open, lazyMount: true, unmountOnExit: true, onOpenChange: ({ open: open2 }) => setOpen(open2), preventScroll: false, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_dialog.DialogBackdrop, { className: "absolute inset-0 z-[100] bg-background/60 backdrop-blur-sm" }),
+    /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_dialog.DialogPositioner, { className: "absolute inset-0 z-[100]", children: /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(import_dialog.DialogContent, { id, "data-slot": "navbar-mobile-overlay", className: (0, import_helix43.cn)(import_helix43.navbarMobileContentBase, className), ...props, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_dialog.DialogTitle, { className: "sr-only", children: "Navigation menu" }),
+      /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_dialog.DialogDescription, { className: "sr-only", children: "Mobile navigation menu" }),
+      /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { className: import_helix43.navbarMobileHeaderBase, children: [
+        slots.brand,
+        /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_dialog.DialogCloseTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("button", { type: "button", "aria-label": "Close navigation menu", className: (0, import_helix43.cn)((0, import_helix43.navbarTriggerVariants)({ floating })), children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
+          "svg",
+          {
+            className: "size-4",
+            viewBox: "0 0 24 24",
+            fill: "none",
+            stroke: "currentColor",
+            strokeWidth: "2",
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            "aria-hidden": "true",
+            children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("path", { d: "M18 6 6 18M6 6l12 12" })
+          }
+        ) }) })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: import_helix43.navbarMobileMenuBase, children }),
+      slots.actions ? /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: import_helix43.navbarMobileActionsBase, children: slots.actions }) : null
+    ] }) })
+  ] }) });
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Badge,
+  Button,
+  Card,
+  CardBody,
+  CardCover,
+  CardDescription,
+  CardFooter,
+  CardHeader,
+  CardTitle,
+  Center,
+  Col,
+  Container,
+  HStack,
+  Item,
+  Navbar,
+  NavbarActions,
+  NavbarActivationArea,
+  NavbarBrand,
+  NavbarMenu,
+  NavbarMenuContent,
+  NavbarMenuIndicator,
+  NavbarMenuItem,
+  NavbarMenuLink,
+  NavbarMenuList,
+  NavbarMenuTrigger,
+  NavbarMenuViewport,
+  NavbarMenuViewportPositioner,
+  NavbarMobileMenu,
+  NavbarMobileMenuContent,
+  NavbarMobileMenuTrigger,
+  NavbarMobileOverlay,
+  NavbarProvider,
+  NavbarTrigger,
+  Pagination,
+  PaginationEllipsis,
+  PaginationItem,
+  PaginationItems,
+  PaginationNext,
+  PaginationPrevious,
+  Row,
+  Scroll,
+  Sidebar,
+  SidebarContent,
+  SidebarFooter,
+  SidebarGroup,
+  SidebarGroupAction,
+  SidebarHeader,
+  SidebarInput,
+  SidebarInset,
+  SidebarMenu,
+  SidebarMenuAction,
+  SidebarMenuBadge,
+  SidebarMenuButton,
+  SidebarMenuItem,
+  SidebarMenuLink,
+  SidebarMenuSkeleton,
+  SidebarMenuSub,
+  SidebarMenuSubButton,
+  SidebarMenuSubItem,
+  SidebarProvider,
+  SidebarRail,
+  SidebarSeparator,
+  SidebarTrigger,
+  Splitter,
+  SplitterPanel,
+  SplitterResizeTrigger,
+  SplitterResizeTriggerIndicator,
+  Stack,
+  Tabs,
+  TabsContent,
+  TabsList,
+  TabsTrigger,
+  ToggleButton,
+  ToggleButtonIndicator,
+  VStack,
+  navbarMenuTriggerStyle,
+  useNavbar,
+  useSidebar,
+  useTabs
+});