@publish.os/nextjs 0.0.1-alpha.6 → 0.0.1-alpha.7

package/dist/kernel/components/blocks/sidebar-node.js

@@ -1,32 +1,10 @@
-// src/utils/cn.ts
-import { clsx } from "clsx";
-import { extendTailwindMerge } from "tailwind-merge";
-var twMerge = extendTailwindMerge({
-  extend: {
-    classGroups: {
-      z: [
-        "z-content",
-        "z-nav",
-        "z-overlay",
-        "z-modal",
-        "z-search",
-        "z-toast",
-        "z-progress"
-      ]
-    }
-  }
-});
-function cn(...inputs) {
-  return twMerge(clsx(inputs));
-}
-
-// src/kernel/components/blocks/sidebar-node.tsx
+// src/components/block/navigation/sidebar-node.tsx
+import { FrameworkChevronRightIcon as ChevronRight } from "@publish.os/nextjs/kernel/framework-icons";
+import { cn } from "@publish.os/nextjs/utils/cn";
 import { cva } from "class-variance-authority";
-import { ChevronRight } from "lucide-react";
 import NextLink from "next/link";
 import { jsx, jsxs } from "react/jsx-runtime";
-var SIDEBAR_NODE_VARIANT = "base";
-var depthClassByDepth = {
+var SIDEBAR_NODE_VARIANT = "base", depthClassByDepth = {
   0: "pl-2",
   1: "pl-5",
   2: "pl-8",
@@ -40,8 +18,7 @@ var depthClassByDepth = {
   10: "pl-32",
   11: "pl-[140px]",
   12: "pl-[152px]"
-};
-var sidebarSectionVariants = cva(
+}, sidebarSectionVariants = cva(
   "mb-2 mt-6 flex min-h-5 items-center gap-2 pr-2 text-[11px] font-semibold uppercase leading-4 tracking-wide text-foreground-3 first:mt-0",
   {
     variants: {
@@ -51,8 +28,7 @@ var sidebarSectionVariants = cva(
       }
     }
   }
-);
-var sidebarNodeVariants = cva(
+), sidebarNodeVariants = cva(
   [
     "group/sidebar-row relative flex min-h-8 w-full min-w-0 items-center gap-2 rounded-button py-1.5 pr-2 text-left text-[13px] leading-5",
     "transition-[background-color,color,box-shadow] duration-200 ease-out"
@@ -77,7 +53,7 @@ var sidebarNodeVariants = cva(
       }
     },
     defaultVariants: {
-      interactive: false,
+      interactive: !1,
       variant: "base"
     }
   }
@@ -86,10 +62,8 @@ function isExternalHref(href) {
   return /^[a-z][a-z0-9+.-]*:/i.test(href) && !href.startsWith("mailto:") && !href.startsWith("tel:") || href.startsWith("//");
 }
 function mergeRel(rel) {
-  const values = new Set((rel ?? "").split(/\s+/).filter(Boolean));
-  values.add("noopener");
-  values.add("noreferrer");
-  return Array.from(values).join(" ");
+  let values = new Set((rel ?? "").split(/\s+/).filter(Boolean));
+  return values.add("noopener"), values.add("noreferrer"), Array.from(values).join(" ");
 }
 function Caret({ active, expanded }) {
   return /* @__PURE__ */ jsx(
@@ -159,20 +133,17 @@ function SidebarLink({
   parentExpanded,
   ...props
 }) {
-  const commonProps = {
+  let commonProps = {
     "aria-current": active ? "page" : void 0,
     className: cn(
-      "block rounded-button focus-visible:outline-2 focus-visible:outline-offset-0 focus-visible:outline-focus-ring",
+      "block rounded-button focus-visible:outline-2 focus-visible:outline-offset-0 focus-visible:outline-focus-stroke",
       className
     ),
     onClick,
     tabIndex: parentExpanded ? void 0 : -1,
     ...props
   };
-  if (isExternalHref(href)) {
-    return /* @__PURE__ */ jsx("a", { href, rel: mergeRel(void 0), target: "_blank", ...commonProps, children });
-  }
-  return /* @__PURE__ */ jsx(NextLink, { href, ...commonProps, children });
+  return isExternalHref(href) ? /* @__PURE__ */ jsx("a", { href, rel: mergeRel(void 0), target: "_blank", ...commonProps, children }) : /* @__PURE__ */ jsx(NextLink, { href, ...commonProps, children });
 }
 function SidebarNode({
   activeState,
@@ -180,65 +151,55 @@ function SidebarNode({
   children,
   contentId,
   depth,
-  expanded = false,
+  expanded = !1,
   href,
-  isExpandable = false,
+  isExpandable = !1,
   node,
   onLinkClick,
   onToggle,
   parentExpanded,
   title
 }) {
-  const isActive = activeState === "path-active";
-  const isChildActive = activeState === "child-path-active";
-  const active = isActive || isChildActive;
-  const isExternalLinkNode = node.type === "link" && href ? isExternalHref(href) : false;
-  if (node.type === "section") {
-    return /* @__PURE__ */ jsxs("li", { children: [
-      /* @__PURE__ */ jsx(
-        "div",
-        {
-          className: cn(
-            sidebarSectionVariants({ variant: SIDEBAR_NODE_VARIANT }),
-            depthClassByDepth[depth]
-          ),
-          children: title
-        }
-      ),
-      children
-    ] });
-  }
-  if (node.type === "folder") {
-    return /* @__PURE__ */ jsxs("li", { className: "select-none", children: [
-      /* @__PURE__ */ jsx(
-        "button",
-        {
-          "aria-controls": contentId,
-          "aria-expanded": expanded,
-          className: "block w-full rounded-button focus-visible:outline-2 focus-visible:outline-offset-0 focus-visible:outline-focus-ring",
-          onClick: onToggle,
-          tabIndex: parentExpanded ? void 0 : -1,
-          type: "button",
-          children: /* @__PURE__ */ jsxs(
-            RowInner,
-            {
-              activeItemRef,
-              activeState,
-              depth,
-              interactive: true,
-              children: [
-                /* @__PURE__ */ jsx(RowText, { title }),
-                isExpandable ? /* @__PURE__ */ jsx(Caret, { active, expanded }) : null
-              ]
-            }
-          )
-        }
-      ),
-      children
-    ] });
-  }
-  if (!href) return null;
-  return /* @__PURE__ */ jsxs("li", { className: "select-none", children: [
+  let isActive = activeState === "path-active", active = isActive || activeState === "child-path-active", isExternalLinkNode = node.type === "link" && href ? isExternalHref(href) : !1;
+  return node.type === "section" ? /* @__PURE__ */ jsxs("li", { children: [
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: cn(
+          sidebarSectionVariants({ variant: SIDEBAR_NODE_VARIANT }),
+          depthClassByDepth[depth]
+        ),
+        children: title
+      }
+    ),
+    children
+  ] }) : node.type === "folder" ? /* @__PURE__ */ jsxs("li", { className: "select-none", children: [
+    /* @__PURE__ */ jsx(
+      "button",
+      {
+        "aria-controls": contentId,
+        "aria-expanded": expanded,
+        className: "block w-full rounded-button focus-visible:outline-2 focus-visible:outline-offset-0 focus-visible:outline-focus-stroke",
+        onClick: onToggle,
+        tabIndex: parentExpanded ? void 0 : -1,
+        type: "button",
+        children: /* @__PURE__ */ jsxs(
+          RowInner,
+          {
+            activeItemRef,
+            activeState,
+            depth,
+            interactive: !0,
+            children: [
+              /* @__PURE__ */ jsx(RowText, { title }),
+              isExpandable ? /* @__PURE__ */ jsx(Caret, { active, expanded }) : null
+            ]
+          }
+        )
+      }
+    ),
+    children
+  ] }) : href ? /* @__PURE__ */ jsxs("li", { className: "select-none", children: [
     /* @__PURE__ */ jsx(
       SidebarLink,
       {
@@ -254,7 +215,7 @@ function SidebarNode({
             activeItemRef,
             activeState,
             depth,
-            interactive: false,
+            interactive: !1,
             children: [
               /* @__PURE__ */ jsx(RowText, { title }),
               isExpandable ? /* @__PURE__ */ jsx(Caret, { active, expanded }) : null,
@@ -265,7 +226,7 @@ function SidebarNode({
       }
     ),
     children
-  ] });
+  ] }) : null;
 }
 export {
   SidebarNode

package/dist/kernel/components/blocks/sidebar.d.ts

@@ -1,27 +1,9 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { TreeNode } from '@publish.os/nextjs/types';
-import { Ref, ReactNode, MouseEvent } from 'react';
+import { ReactNode } from 'react';
+import { a as SidebarTreeNode } from '../../../sidebar-types-Bgchdfd6.js';
+export { b as SidebarActiveState, c as SidebarDepth, S as SidebarNodePrimitiveProps } from '../../../sidebar-types-Bgchdfd6.js';
+import '../../../types-DHBm7-j6.js';
 
-type SidebarTreeNode = TreeNode & {
-    children?: SidebarTreeNode[];
-};
-type SidebarActiveState = "path-active" | "child-path-active";
-type SidebarDepth = 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;
-type SidebarNodePrimitiveProps = {
-    activeState?: SidebarActiveState;
-    activeItemRef?: Ref<HTMLDivElement>;
-    children?: ReactNode;
-    contentId?: string;
-    depth: SidebarDepth;
-    expanded?: boolean;
-    href?: string;
-    isExpandable?: boolean;
-    node: SidebarTreeNode;
-    onLinkClick?: (event: MouseEvent<HTMLAnchorElement>) => void;
-    onToggle?: () => void;
-    parentExpanded: boolean;
-    title: string;
-};
 type SidebarProps = {
     className?: string;
     currentPath?: string;
@@ -30,4 +12,4 @@ type SidebarProps = {
 };
 declare function Sidebar({ className, currentPath, title, tree }: SidebarProps): react_jsx_runtime.JSX.Element;
 
-export { Sidebar, type SidebarActiveState, type SidebarDepth, type SidebarNodePrimitiveProps, type SidebarProps, type SidebarTreeNode };
+export { Sidebar, type SidebarProps, SidebarTreeNode };

package/dist/kernel/components/blocks/sidebar.js

@@ -1,32 +1,9 @@
 "use client";
 
-// src/kernel/components/blocks/sidebar.tsx
-import { SidebarNode } from "./sidebar-node.js";
-import { ScrollArea } from "../ui/scroll-area.js";
-
-// src/utils/cn.ts
-import { clsx } from "clsx";
-import { extendTailwindMerge } from "tailwind-merge";
-var twMerge = extendTailwindMerge({
-  extend: {
-    classGroups: {
-      z: [
-        "z-content",
-        "z-nav",
-        "z-overlay",
-        "z-modal",
-        "z-search",
-        "z-toast",
-        "z-progress"
-      ]
-    }
-  }
-});
-function cn(...inputs) {
-  return twMerge(clsx(inputs));
-}
-
-// src/kernel/components/blocks/sidebar.tsx
+// src/components/block/navigation/sidebar.tsx
+import { SidebarNode } from "@publish.os/nextjs/kernel/components/blocks/sidebar-node";
+import { ScrollArea } from "@publish.os/nextjs/kernel/components/ui/scroll-area";
+import { cn } from "@publish.os/nextjs/utils/cn";
 import { usePathname } from "next/navigation";
 import {
   memo,
@@ -41,58 +18,45 @@ import {
 import { jsx, jsxs } from "react/jsx-runtime";
 function normalizePath(path) {
   if (!path) return "";
-  const [withoutQuery = ""] = path.split(/[?#]/);
-  if (withoutQuery === "/") return "/";
-  return withoutQuery.replace(/\/+$/g, "");
+  let [withoutQuery = ""] = path.split(/[?#]/);
+  return withoutQuery === "/" ? "/" : withoutQuery.replace(/\/+$/g, "");
 }
 function isExternalHref(href) {
   return /^[a-z][a-z0-9+.-]*:/i.test(href) || href.startsWith("//");
 }
 function nodeHref(node) {
   if (node.type === "link") return node.href;
-  if ("path" in node && typeof node.path === "string") return node.path;
-  return void 0;
+  if ("path" in node && typeof node.path == "string") return node.path;
 }
 function nodeChildren(node) {
   return Array.isArray(node.children) ? node.children : [];
 }
 function nodeKey(node, parentKey) {
-  const prefix = parentKey ? `${parentKey}/` : "";
-  if (node.type === "page") return `${prefix}page:${node.fileID}`;
-  if (node.type === "link") return `${prefix}link:${node.id}`;
-  return `${prefix}${node.type}:${node.id}`;
+  let prefix = parentKey ? `${parentKey}/` : "";
+  return node.type === "page" ? `${prefix}page:${node.fileID}` : node.type === "link" ? `${prefix}link:${node.id}` : `${prefix}${node.type}:${node.id}`;
 }
 function isActivePath(path, currentPath) {
-  if (!path || isExternalHref(path)) return false;
-  const normalizedPath = normalizePath(path);
-  const normalizedCurrentPath = normalizePath(currentPath);
-  if (!normalizedPath) return false;
-  return normalizedCurrentPath === normalizedPath || normalizedCurrentPath.startsWith(`${normalizedPath}/`);
+  if (!path || isExternalHref(path)) return !1;
+  let normalizedPath = normalizePath(path), normalizedCurrentPath = normalizePath(currentPath);
+  return normalizedPath ? normalizedCurrentPath === normalizedPath || normalizedCurrentPath.startsWith(`${normalizedPath}/`) : !1;
 }
 function isExactActivePath(path, currentPath) {
-  if (!path || isExternalHref(path)) return false;
-  return normalizePath(path) === normalizePath(currentPath);
+  return !path || isExternalHref(path) ? !1 : normalizePath(path) === normalizePath(currentPath);
 }
 function createActiveIndex({
   currentPath,
   tree
 }) {
-  const activeIndex = /* @__PURE__ */ new Map();
+  let activeIndex = /* @__PURE__ */ new Map();
   function visit(node) {
-    const href = nodeHref(node);
-    const exactActive = isExactActivePath(href, currentPath);
-    const pathActive = node.type === "page" && isActivePath(href, currentPath);
-    const childActive = nodeChildren(node).some(visit);
-    const activeState = exactActive ? "path-active" : childActive || pathActive ? "child-path-active" : void 0;
-    activeIndex.set(node, {
+    let href = nodeHref(node), exactActive = isExactActivePath(href, currentPath), pathActive = node.type === "page" && isActivePath(href, currentPath), childActive = nodeChildren(node).some(visit), activeState = exactActive ? "path-active" : childActive || pathActive ? "child-path-active" : void 0;
+    return activeIndex.set(node, {
       activeState,
       initiallyExpanded: exactActive || pathActive || childActive
-    });
-    return exactActive || pathActive || childActive;
+    }), exactActive || pathActive || childActive;
   }
-  for (const node of tree) {
+  for (let node of tree)
     visit(node);
-  }
   return activeIndex;
 }
 function safeIdPart(value) {
@@ -102,7 +66,7 @@ function nodeContentId({
   instanceId,
   node
 }) {
-  const key = "path" in node && node.path ? node.path : node.type === "page" ? node.fileID : node.id;
+  let key = "path" in node && node.path ? node.path : node.type === "page" ? node.fileID : node.id;
   return `sidebar-${safeIdPart(instanceId)}-${safeIdPart(key)}`;
 }
 function clampDepth(depth) {
@@ -120,7 +84,7 @@ function ExpandableChildren({
   parentExpanded,
   renderChildren
 }) {
-  const childFocusable = parentExpanded && expanded;
+  let childFocusable = parentExpanded && expanded;
   return /* @__PURE__ */ jsx(
     "div",
     {
@@ -158,41 +122,16 @@ var SidebarTreeItem = memo(function SidebarTreeItem2({
   node,
   parentExpanded
 }) {
-  const nodes = nodeChildren(node);
-  const href = nodeHref(node);
-  const activeInfo = activeIndex.get(node);
-  const activeState = activeInfo?.activeState;
-  const initiallyExpanded = Boolean(activeInfo?.initiallyExpanded);
-  const isExpandable = nodes.length > 0 && (node.type === "folder" || node.type === "page");
-  const [expanded, setExpanded] = useState(initiallyExpanded);
-  const [renderChildren, setRenderChildren] = useState(initiallyExpanded);
-  const interactedRef = useRef(false);
-  const lastPathRef = useRef(normalizePath(currentPath));
-  const contentId = nodeContentId({ instanceId, node });
+  let nodes = nodeChildren(node), href = nodeHref(node), activeInfo = activeIndex.get(node), activeState = activeInfo?.activeState, initiallyExpanded = !!activeInfo?.initiallyExpanded, isExpandable = nodes.length > 0 && (node.type === "folder" || node.type === "page"), [expanded, setExpanded] = useState(initiallyExpanded), [renderChildren, setRenderChildren] = useState(initiallyExpanded), interactedRef = useRef(!1), lastPathRef = useRef(normalizePath(currentPath)), contentId = nodeContentId({ instanceId, node });
   useEffect(() => {
-    const normalizedCurrentPath = normalizePath(currentPath);
-    const pathChanged = lastPathRef.current !== normalizedCurrentPath;
-    if (pathChanged) {
-      interactedRef.current = false;
-      lastPathRef.current = normalizedCurrentPath;
-    }
-    if (initiallyExpanded && !expanded && !interactedRef.current) {
-      setRenderChildren(true);
-      startTransition(() => setExpanded(true));
-    }
+    let normalizedCurrentPath = normalizePath(currentPath);
+    lastPathRef.current !== normalizedCurrentPath && (interactedRef.current = !1, lastPathRef.current = normalizedCurrentPath), initiallyExpanded && !expanded && !interactedRef.current && (setRenderChildren(!0), startTransition(() => setExpanded(!0)));
   }, [currentPath, expanded, initiallyExpanded]);
-  const toggleExpanded = useCallback(() => {
-    interactedRef.current = true;
-    setRenderChildren(true);
-    setExpanded((value) => !value);
-  }, []);
-  const expandOnNavigate = useCallback(() => {
-    interactedRef.current = true;
-    setRenderChildren(true);
-    setExpanded(true);
-  }, []);
-  const pageWithChildrenLinkClick = node.type === "page" && nodes.length > 0 ? expandOnNavigate : void 0;
-  const children = isExpandable && nodes.length > 0 ? /* @__PURE__ */ jsx(
+  let toggleExpanded = useCallback(() => {
+    interactedRef.current = !0, setRenderChildren(!0), setExpanded((value) => !value);
+  }, []), expandOnNavigate = useCallback(() => {
+    interactedRef.current = !0, setRenderChildren(!0), setExpanded(!0);
+  }, []), pageWithChildrenLinkClick = node.type === "page" && nodes.length > 0 ? expandOnNavigate : void 0, children = isExpandable && nodes.length > 0 ? /* @__PURE__ */ jsx(
     ExpandableChildren,
     {
       activeIndex,
@@ -240,26 +179,19 @@ var SidebarTreeItem = memo(function SidebarTreeItem2({
   );
 });
 function Sidebar({ className, currentPath, title, tree }) {
-  const pathname = usePathname();
-  const resolvedCurrentPath = pathname ?? currentPath ?? "";
-  const instanceId = useId();
-  const activeItemRef = useRef(null);
-  const activeIndex = useMemo(
+  let resolvedCurrentPath = usePathname() ?? currentPath ?? "", instanceId = useId(), activeItemRef = useRef(null), activeIndex = useMemo(
     () => createActiveIndex({ currentPath: resolvedCurrentPath, tree }),
     [resolvedCurrentPath, tree]
   );
-  useEffect(() => {
-    const scrollPath = resolvedCurrentPath;
-    const frame = window.requestAnimationFrame(() => {
-      if (!scrollPath) return;
-      activeItemRef.current?.scrollIntoView({
+  return useEffect(() => {
+    let scrollPath = resolvedCurrentPath, frame = window.requestAnimationFrame(() => {
+      scrollPath && activeItemRef.current?.scrollIntoView({
         block: "nearest",
         inline: "nearest"
       });
     });
     return () => window.cancelAnimationFrame(frame);
-  }, [resolvedCurrentPath]);
-  return /* @__PURE__ */ jsxs(
+  }, [resolvedCurrentPath]), /* @__PURE__ */ jsxs(
     "nav",
     {
       "aria-label": "Documentation navigation",
@@ -273,7 +205,7 @@ function Sidebar({ className, currentPath, title, tree }) {
           ScrollArea,
           {
             className: "min-h-0 flex-1",
-            corner: true,
+            corner: !0,
             mask: { height: 24 },
             scrollbarClassName: "opacity-0 transition-opacity data-[hovering]:opacity-100 data-[scrolling]:opacity-100",
             variant: "gradient",
@@ -287,7 +219,7 @@ function Sidebar({ className, currentPath, title, tree }) {
                 instanceId,
                 itemKey: nodeKey(node, ""),
                 node,
-                parentExpanded: true
+                parentExpanded: !0
               },
               nodeKey(node, "")
             )) })

package/dist/kernel/components/blocks/theme-toggle.d.ts

@@ -1,6 +1,10 @@
-export { ThemeToggle } from '../ui/theme-toggle.js';
-import 'react/jsx-runtime';
-import '../ui/button.js';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { a as ButtonProps } from '../../../button-CFdx-ohV.js';
 import 'class-variance-authority/types';
 import 'class-variance-authority';
 import 'react';
+
+type ThemeToggleProps = Omit<ButtonProps, "children" | "iconOnly" | "leftIcon" | "loading" | "rightIcon">;
+declare function ThemeToggle({ className, onClick, size, title, type, variant, ...props }: ThemeToggleProps): react_jsx_runtime.JSX.Element;
+
+export { ThemeToggle };

package/dist/kernel/components/blocks/theme-toggle.js

@@ -1,7 +1,7 @@
 "use client";
 
-// src/kernel/components/blocks/theme-toggle.tsx
-import { ThemeToggle } from "../ui/theme-toggle.js";
+// src/components/block/theme-toggle.tsx
+import { ThemeToggle } from "@publish.os/nextjs/kernel/components/ui/theme-toggle";
 export {
   ThemeToggle
 };