zudoku 0.3.0-dev.83 → 0.3.0-dev.85

package/src/lib/plugins/markdown/generateRoutes.tsx

@@ -1,7 +1,4 @@
-import { Navigate, type RouteObject } from "react-router-dom";
-import { useTopNavigationItem } from "../../components/context/DevPortalProvider.js";
-import { isPathItem } from "../../components/navigation/util.js";
-import { traverseNavigation } from "../../util/traverseNavigation.js";
+import { type RouteObject } from "react-router-dom";
 
 import {
   MarkdownPluginDefaultOptions,
@@ -11,57 +8,32 @@ import {
 export const generateRoutes = (
   markdownFiles: MarkdownPluginOptions["markdownFiles"],
   defaultOptions?: MarkdownPluginDefaultOptions,
-): RouteObject[] => {
-  const routes = Object.entries(markdownFiles).flatMap(
-    ([file, importPromise]) => {
-      // @todo we can pass in the folder name and then filter the markdown files based on that path
-      const match = file.match(/pages\/(.*).mdx?$/);
-      const path = match?.at(1);
-
-      if (!path) return [];
-
-      const pathSegments = path.split("/");
-      const isIndexFile = pathSegments.at(-1) === "index";
-      const routePath = isIndexFile
-        ? pathSegments.slice(0, -1).join("/")
-        : path;
-
-      return {
-        path: routePath,
-        lazy: async () => {
-          const { MdxPage } = await import("./MdxPage.js");
-          const { default: Component, ...props } = await importPromise();
-          return {
-            element: (
-              <MdxPage
-                mdxComponent={Component}
-                {...props}
-                defaultOptions={defaultOptions}
-              />
-            ),
-          };
-        },
-      } satisfies RouteObject;
-    },
-  );
-
-  const rootRoutes: RouteObject[] = Array.from(
-    new Set(routes.map((route) => route.path.split("/").at(0))),
-  ).map((dir) => ({
-    path: `/${dir}`,
-    element: <Redirect />,
-  }));
-
-  return [...routes, ...rootRoutes];
-};
-
-const Redirect = () => {
-  const navItem = useTopNavigationItem();
-
-  if (!navItem) return null;
-
-  return traverseNavigation(navItem, (node, fullPath) => {
-    if ("children" in node || !isPathItem(node)) return;
-    return <Navigate to={fullPath} replace />;
+): RouteObject[] =>
+  Object.entries(markdownFiles).flatMap(([file, importPromise]) => {
+    // @todo we can pass in the folder name and then filter the markdown files based on that path
+    const match = file.match(/pages\/(.*).mdx?$/);
+    const path = match?.at(1);
+
+    if (!path) return [];
+
+    const pathSegments = path.split("/");
+    const isIndexFile = pathSegments.at(-1) === "index";
+    const routePath = isIndexFile ? pathSegments.slice(0, -1).join("/") : path;
+
+    return {
+      path: routePath,
+      lazy: async () => {
+        const { MdxPage } = await import("./MdxPage.js");
+        const { default: Component, ...props } = await importPromise();
+        return {
+          element: (
+            <MdxPage
+              mdxComponent={Component}
+              {...props}
+              defaultOptions={defaultOptions}
+            />
+          ),
+        };
+      },
+    } satisfies RouteObject;
   });
-};

package/src/lib/plugins/openapi/OperationListItem.tsx

@@ -1,5 +1,6 @@
 import { Heading } from "../../components/Heading.js";
 import { Markdown } from "../../components/Markdown.js";
+import { Card } from "../../ui/Card.js";
 import { Tabs, TabsContent, TabsList, TabsTrigger } from "../../ui/Tabs.js";
 import { groupBy } from "../../util/groupBy.js";
 import { renderIf } from "../../util/renderIf.js";
@@ -28,7 +29,7 @@ export const OperationListItem = ({
   return (
     <div
       key={operation.operationId}
-      className="grid grid-cols-1 lg:grid-cols-[4fr_3fr] gap-8 items-start border-b-2 mb-16 pb-16 border-border"
+      className="grid grid-cols-1 lg:grid-cols-[4fr_3fr] gap-8 items-start border-b-2 mb-16 pb-16"
     >
       <div className="flex flex-col gap-4">
         <Heading level={2} id={operation.slug} registerSidebarAnchor>
@@ -92,14 +93,12 @@ export const OperationListItem = ({
                     {renderIf(
                       response.content?.find((content) => content.schema),
                       (content) => {
-                        return (
-                          <SchemaListView schema={content.schema} name="" />
-                        );
+                        return <SchemaListView schema={content.schema} />;
                       },
                     ) ?? (
-                      <div className="border-border font-mono text-sm border rounded p-4">
+                      <Card className="font-mono text-sm p-4">
                         No response body
-                      </div>
+                      </Card>
                     )}
                   </TabsContent>
                 ))}

package/src/lib/plugins/openapi/ParameterList.tsx

@@ -1,4 +1,5 @@
 import { Heading } from "../../components/Heading.js";
+import { Card } from "../../ui/Card.js";
 import type { ParameterGroup } from "./OperationListItem.js";
 import {
   ParameterListItem,
@@ -18,15 +19,17 @@ export const ParameterList = ({
     <Heading level={3} id={`${id}/${group}-parameters`} className="capitalize">
       {group === "header" ? "Headers" : `${group} Parameters`}
     </Heading>
-    <ul className="list-none m-0 px-0 overflow-hidden border divide-y divide-border rounded">
-      {parameters.map((parameter) => (
-        <ParameterListItem
-          key={`${parameter.name}-${parameter.in}`}
-          parameter={parameter}
-          id={id}
-          group={group}
-        />
-      ))}
-    </ul>
+    <Card>
+      <ul className="list-none m-0 px-0 divide-y ">
+        {parameters.map((parameter) => (
+          <ParameterListItem
+            key={`${parameter.name}-${parameter.in}`}
+            parameter={parameter}
+            id={id}
+            group={group}
+          />
+        ))}
+      </ul>
+    </Card>
   </>
 );

package/src/lib/plugins/openapi/SchemaListView.tsx

@@ -1,7 +1,9 @@
 import { Markdown } from "../../components/Markdown.js";
 import { SchemaObject } from "../../oas/parser/index.js";
+import { Card } from "../../ui/Card.js";
 import { groupBy } from "../../util/groupBy.js";
 import { objectEntries } from "../../util/objectEntries.js";
+import { SchemaListViewItem } from "./SchemaListViewItem.js";
 import { SchemaListViewItemGroup } from "./SchemaListViewItemGroup.js";
 import { SchemaProseClasses } from "./util/prose.js";
 
@@ -34,6 +36,20 @@ export const SchemaListView = ({
         : "optional";
   });
 
+  if (schema.type === "array") {
+    return (
+      <Card className="overflow-hidden">
+        <SchemaListViewItem
+          propertyName={schema.title ?? name}
+          isRequired={true}
+          property={schema}
+          defaultOpen={level === 0}
+          nestingLevel={level}
+        />
+      </Card>
+    );
+  }
+
   return (
     <div className="flex flex-col gap-2.5">
       {(schema.title ?? name) && (
@@ -42,7 +58,7 @@ export const SchemaListView = ({
       {level === 0 && schema.description && (
         <Markdown className={SchemaProseClasses} content={schema.description} />
       )}
-      <ul className="border-border border rounded overflow-hidden">
+      <Card className="overflow-hidden">
         {objectEntries(groups).map(([group, properties]) => (
           <SchemaListViewItemGroup
             key={group}
@@ -53,7 +69,7 @@ export const SchemaListView = ({
             required={schema.required ?? []}
           />
         ))}
-      </ul>
+      </Card>
     </div>
   );
 };

package/src/lib/plugins/openapi/SchemaListViewItem.tsx

@@ -11,27 +11,32 @@ export const SchemaListViewItem = ({
   property,
   nestingLevel,
   isRequired,
+  defaultOpen = false,
 }: {
-  propertyName: string;
+  propertyName?: string;
   isRequired: boolean;
   property: SchemaObject;
   nestingLevel: number;
+  defaultOpen?: boolean;
 }) => {
   if (!property) {
     return <div>no property</div>;
   }
+
+  const title =
+    propertyName || property.title
+      ? [propertyName, property.title].filter(Boolean).join(" ")
+      : null;
+
   return (
     <div
-      key={propertyName}
       className={cn(
         "p-4 bg-border/20 hover:bg-border/30 flex gap-1 flex-col text-sm",
         property.deprecated && "opacity-50",
       )}
     >
       <div className="flex items-center gap-2 relative">
-        <code>
-          {propertyName} {property.title}
-        </code>
+        {title && <code>{title}</code>}
 
         {property.type && (
           <span className="text-muted-foreground">{property.type}</span>
@@ -81,9 +86,13 @@ export const SchemaListViewItem = ({
         // this check is needed because the `items` can be undefined despite the type being defined
         typeof property.items !== "undefined" &&
         property.items.type === "object") ? (
-        <Collapsible.Root className="CollapsibleRoot" defaultOpen={false}>
+        <Collapsible.Root className="CollapsibleRoot" defaultOpen={defaultOpen}>
           <Collapsible.Trigger asChild>
-            <Button variant="ghost" size="sm">
+            <Button
+              variant="ghost"
+              size="sm"
+              className={cn(defaultOpen && "hidden")}
+            >
               Show nested fields
               <ListPlusIcon size={18} className="ml-1.5" />
             </Button>

package/src/lib/plugins/openapi/Sidecar.tsx

@@ -1,13 +1,13 @@
 import { HTTPSnippet } from "@zudoku/httpsnippet";
 import { Fragment, useMemo, useTransition } from "react";
 import { useSearchParams } from "react-router-dom";
+import { TextColorMap } from "../../components/navigation/SidebarBadge.js";
 import { SyntaxHighlight } from "../../components/SyntaxHighlight.js";
 import type { SchemaObject } from "../../oas/parser/index.js";
 import { cn } from "../../util/cn.js";
 import { ColorizedParam } from "./ColorizedParam.js";
 import { useOasConfig } from "./context.js";
 import { graphql } from "./graphql/index.js";
-import { MethodTextColorMap } from "./MethodBadge.js";
 import type { OperationListItemResult } from "./OperationList.js";
 import { PlaygroundDialogWrapper } from "./PlaygroundDialogWrapper.js";
 import { RequestBodySidecarBox } from "./RequestBodySidecarBox.js";
@@ -71,6 +71,17 @@ export const GetServerQuery = graphql(/* GraphQL */ `
 
 const context = { suspense: true };
 
+const methodToColor = {
+  get: TextColorMap.green,
+  post: TextColorMap.blue,
+  put: TextColorMap.yellow,
+  delete: TextColorMap.red,
+  patch: TextColorMap.purple,
+  options: TextColorMap.indigo,
+  head: TextColorMap.gray,
+  trace: TextColorMap.gray,
+};
+
 export const Sidecar = ({
   operation,
 }: {
@@ -83,7 +94,9 @@ export const Sidecar = ({
     context,
   });
   const methodTextColor =
-    MethodTextColorMap[operation.method as keyof typeof MethodTextColorMap];
+    methodToColor[
+      operation.method.toLocaleLowerCase() as keyof typeof methodToColor
+    ] ?? TextColorMap.gray;
 
   const [searchParams, setSearchParams] = useSearchParams();
   const [, startTransition] = useTransition();

package/src/lib/plugins/openapi/index.tsx

@@ -1,10 +1,6 @@
 import { matchPath, useRouteError, type RouteObject } from "react-router-dom";
-import {
-  type DevPortalPlugin,
-  type PluginNavigationCategory,
-} from "../../core/plugins.js";
+import { type DevPortalPlugin } from "../../core/plugins.js";
 import { graphql } from "./graphql/index.js";
-import { MethodBadge } from "./MethodBadge.js";
 import {
   Client as UrqlClient,
   cacheExchange,
@@ -14,10 +10,12 @@ import {
 import { useQuery } from "@tanstack/react-query";
 import { CirclePlayIcon, LogInIcon } from "lucide-react";
 import { createClient } from "zudoku/openapi-worker";
+import type { ResolvedSidebarItem } from "../../../config/validators/ResolvedSidebarSchema.js";
 import { useAuth } from "../../authentication/hook.js";
 import { ErrorPage } from "../../components/ErrorPage.js";
 import { SyntaxHighlight } from "../../components/SyntaxHighlight.js";
 import { Button } from "../../ui/Button.js";
+import { joinPath } from "../../util/joinPath.js";
 import { OasPluginConfig } from "./interfaces.js";
 import type { PlaygroundContentProps } from "./playground/Playground.js";
 import { PlaygroundDialog } from "./playground/PlaygroundDialog.js";
@@ -62,7 +60,7 @@ type InternalOasPluginConfig = { inMemory?: boolean };
 export const openApiPlugin = (
   config: OasPluginConfig & InternalOasPluginConfig,
 ): DevPortalPlugin => {
-  const basePath = config.path ?? "/reference";
+  const basePath = joinPath(config.navigationId ?? "/reference");
 
   const client = config.server
     ? new UrqlClient({
@@ -152,30 +150,26 @@ export const openApiPlugin = (
 
       const categories = data.schema.tags
         .filter((tag) => tag.operations.length > 0)
-        .map<PluginNavigationCategory>((tag) => ({
-          path,
+        .map<ResolvedSidebarItem>((tag) => ({
+          type: "category",
           label: tag.name ?? "",
           collapsible: false,
-          children: tag.operations.map((operation) => ({
-            path: `#${operation.slug}`,
-            muted: !!operation.deprecated,
-            title: operation.summary ?? operation.path,
-            label: (
-              <div className="flex flex-1 min-w-0 justify-between gap-2">
-                <span className="truncate">
-                  {operation.summary ?? operation.path}
-                </span>
-                <MethodBadge method={operation.method} />
-              </div>
-            ),
+          collapsed: false,
+          items: tag.operations.map((operation) => ({
+            type: "link",
+            label: operation.summary ?? operation.path,
+            href: `#${operation.slug}`,
+            badge: {
+              label: operation.method,
+              color: "green",
+            },
           })),
         }));
 
       categories.unshift({
-        path,
+        type: "link",
         label: "Overview",
-        collapsible: false,
-        children: [{ path: "#description", label: "Description" }],
+        href: "#description",
       });
 
       return categories;

package/src/lib/plugins/openapi/interfaces.ts

@@ -5,5 +5,5 @@ type OasSource =
 
 export type OasPluginConfig = {
   server?: string;
-  path?: string;
+  navigationId?: string;
 } & OasSource;

package/src/lib/plugins/openapi/playground/Headers.tsx

@@ -71,7 +71,7 @@ export const Headers = ({
             >
               <XIcon size={16} />
             </button>
-            <div className="col-span-full border-b border-border"></div>
+            <div className="col-span-full border-b"></div>
           </div>
         );
       })}

package/src/lib/plugins/openapi/playground/Playground.tsx

@@ -215,7 +215,7 @@ export const Playground = ({
         <div className="grid grid-cols-2 text-sm h-full">
           <div className="flex flex-col gap-4 p-8 bg-muted/50 after:bg-muted-foreground/20 relative after:absolute after:w-px after:inset-0 after:left-auto">
             <div className="flex gap-2 items-stretch">
-              <div className="flex flex-1 items-center w-full border rounded-md border-border">
+              <div className="flex flex-1 items-center w-full border rounded-md">
                 <div className="border-r p-2 bg-muted rounded-l-md self-stretch font-semibold font-mono">
                   {method.toUpperCase()}
                 </div>

package/src/lib/util/useScrollToAnchor.ts

@@ -1,6 +1,26 @@
 import { useEffect } from "react";
 import { useLocation } from "react-router-dom";
 import { useViewportAnchor } from "../components/context/ViewportAnchorContext.js";
+import { DATA_ANCHOR_ATTR } from "../components/navigation/SidebarItem.js";
+
+const scrollIntoViewIfNeeded = (
+  element: Element | null,
+  options: ScrollIntoViewOptions = { block: "center" },
+) => {
+  if (!element) return;
+
+  const rect = element.getBoundingClientRect();
+  const isInView =
+    rect.top >= 0 &&
+    rect.left >= 0 &&
+    rect.bottom <=
+      (window.innerHeight || document.documentElement.clientHeight) &&
+    rect.right <= (window.innerWidth || document.documentElement.clientWidth);
+
+  if (isInView) return;
+
+  element.scrollIntoView(options);
+};
 
 export const useScrollToAnchor = () => {
   const location = useLocation();
@@ -9,30 +29,31 @@ export const useScrollToAnchor = () => {
   useEffect(() => {
     if (!location.hash) return;
 
-    const hash = location.hash.split("/")[0].slice(1);
+    const hash = decodeURIComponent(location.hash.split("/")[0].slice(1));
 
-    const element = document.getElementById(decodeURIComponent(hash));
-    if (element) {
-      // on page navigation element might be in DOM but not yet scrollable, so wait for a frame
-      requestAnimationFrame(() => {
+    const scrollToElement = () => {
+      const element = document.getElementById(hash);
+      const link = document.querySelector(`[${DATA_ANCHOR_ATTR}="${hash}"]`);
+
+      if (element) {
         element.scrollIntoView();
+        scrollIntoViewIfNeeded(link);
         requestIdleCallback(() => setActiveAnchor(hash));
-      });
-      return;
-    }
+        return true;
+      }
 
-    // on page load, the element might not be available yet
-    const observer = new MutationObserver((_mutations, obs) => {
-      const element = document.getElementById(decodeURIComponent(hash));
-      if (!element) return;
+      return false;
+    };
 
-      element.scrollIntoView();
-      requestIdleCallback(() => setActiveAnchor(hash));
-      obs.disconnect();
-    });
+    if (!scrollToElement()) {
+      const observer = new MutationObserver((_, obs) => {
+        if (!scrollToElement()) return;
+        obs.disconnect();
+      });
 
-    observer.observe(document.body, { childList: true, subtree: true });
+      observer.observe(document.body, { childList: true, subtree: true });
 
-    return () => observer.disconnect();
+      return () => observer.disconnect();
+    }
   }, [location.hash, setActiveAnchor]);
 };

package/dist/lib/components/navigation/SideNavigation.d.ts

@@ -1 +0,0 @@
-export declare const SideNavigation: () => import("react/jsx-runtime").JSX.Element;

package/dist/lib/components/navigation/SideNavigation.js

@@ -1,12 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useRef } from "react";
-import { useNavigation } from "../context/DevPortalProvider.js";
-import { Slotlet } from "../SlotletProvider.js";
-import { SideNavigationCategory } from "./SideNavigationCategory.js";
-import { SideNavigationWrapper } from "./SideNavigationWrapper.js";
-export const SideNavigation = () => {
-    const navRef = useRef(null);
-    const navigation = useNavigation();
-    return (_jsxs(SideNavigationWrapper, { ref: navRef, pushMainContent: navigation.data.items.length > 0, children: [_jsx(Slotlet, { name: "zudoku-before-navigation" }), navigation.data.items.map((category) => (_jsx(SideNavigationCategory, { category: category }, category.label))), _jsx(Slotlet, { name: "zudoku-after-navigation" })] }));
-};
-//# sourceMappingURL=SideNavigation.js.map

package/dist/lib/components/navigation/SideNavigation.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"SideNavigation.js","sourceRoot":"","sources":["../../../../src/lib/components/navigation/SideNavigation.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,aAAa,EAAE,MAAM,iCAAiC,CAAC;AAChE,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAChD,OAAO,EAAE,sBAAsB,EAAE,MAAM,6BAA6B,CAAC;AACrE,OAAO,EAAE,qBAAqB,EAAE,MAAM,4BAA4B,CAAC;AAEnE,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,EAAE;IACjC,MAAM,MAAM,GAAG,MAAM,CAAwB,IAAI,CAAC,CAAC;IACnD,MAAM,UAAU,GAAG,aAAa,EAAE,CAAC;IAEnC,OAAO,CACL,MAAC,qBAAqB,IACpB,GAAG,EAAE,MAAM,EACX,eAAe,EAAE,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,aAEjD,KAAC,OAAO,IAAC,IAAI,EAAC,0BAA0B,GAAG,EAC1C,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,QAAQ,EAAE,EAAE,CAAC,CACvC,KAAC,sBAAsB,IAAsB,QAAQ,EAAE,QAAQ,IAAlC,QAAQ,CAAC,KAAK,CAAwB,CACpE,CAAC,EACF,KAAC,OAAO,IAAC,IAAI,EAAC,yBAAyB,GAAG,IACpB,CACzB,CAAC;AACJ,CAAC,CAAC"}

package/dist/lib/components/navigation/SideNavigationCategory.d.ts

@@ -1,4 +0,0 @@
-import type { NavigationCategory } from "../../core/DevPortalContext.js";
-export declare const SideNavigationCategory: ({ category, }: {
-    category: NavigationCategory;
-}) => import("react/jsx-runtime").JSX.Element;

package/dist/lib/components/navigation/SideNavigationCategory.js

@@ -1,26 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import * as Collapsible from "@radix-ui/react-collapsible";
-import { ChevronRightIcon } from "lucide-react";
-import { useLocation } from "react-router-dom";
-import { cn } from "../../util/cn.js";
-import { joinPath } from "../../util/joinPath.js";
-import { useTopNavigationItem } from "../context/DevPortalProvider.js";
-import { useViewportAnchor } from "../context/ViewportAnchorContext.js";
-import { SideNavigationItem } from "./SideNavigationItem.js";
-import { useNavigationCollapsibleState } from "./useNavigationCollapsibleState.js";
-import { checkHasActiveItem } from "./util.js";
-export const SideNavigationCategory = ({ category, }) => {
-    const { activeAnchor } = useViewportAnchor();
-    const navItem = useTopNavigationItem();
-    const location = useLocation();
-    const isCollapsible = category.collapsible ?? true;
-    const collapsibleProps = useNavigationCollapsibleState({
-        item: category,
-        path: navItem?.path ?? "",
-        defaultOpen: () => !isCollapsible ||
-            category.expanded ||
-            checkHasActiveItem(category, location.pathname, navItem?.path ?? ""),
-    });
-    return (_jsxs(Collapsible.Root, { ...collapsibleProps, children: [category.label.length > 0 ? (_jsx(Collapsible.Trigger, { asChild: isCollapsible, disabled: !isCollapsible, children: _jsxs("h5", { className: cn("flex group items-center justify-between cursor-pointer font-semibold text-foreground/90 px-[--padding-nav-item] py-1.5 rounded-lg transition-colors duration-300 -mx-[--padding-nav-item]", isCollapsible ? "hover:bg-accent" : "cursor-auto"), children: [category.label, isCollapsible && (_jsx(ChevronRightIcon, { className: "group-data-[state=open]:rotate-90 transition", size: 16 }))] }) })) : ("Endpoints"), _jsx(Collapsible.Content, { className: "CollapsibleContent -mx-[--padding-nav-item]", children: _jsx("ul", { className: "space-y-0.5 mt-1.5 mb-4 ms-3", children: category.children.map((item, i) => (_jsx(SideNavigationItem, { category: category, item: item, activeAnchor: activeAnchor, currentTopNavItem: navItem, basePath: joinPath(navItem?.path, category.path) }, i))) }) })] }, category.label));
-};
-//# sourceMappingURL=SideNavigationCategory.js.map

package/dist/lib/components/navigation/SideNavigationCategory.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"SideNavigationCategory.js","sourceRoot":"","sources":["../../../../src/lib/components/navigation/SideNavigationCategory.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,WAAW,MAAM,6BAA6B,CAAC;AAC3D,OAAO,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAChD,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAE/C,OAAO,EAAE,EAAE,EAAE,MAAM,kBAAkB,CAAC;AACtC,OAAO,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAC;AAClD,OAAO,EAAE,oBAAoB,EAAE,MAAM,iCAAiC,CAAC;AACvE,OAAO,EAAE,iBAAiB,EAAE,MAAM,qCAAqC,CAAC;AACxE,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAC7D,OAAO,EAAE,6BAA6B,EAAE,MAAM,oCAAoC,CAAC;AACnF,OAAO,EAAE,kBAAkB,EAAE,MAAM,WAAW,CAAC;AAE/C,MAAM,CAAC,MAAM,sBAAsB,GAAG,CAAC,EACrC,QAAQ,GAGT,EAAE,EAAE;IACH,MAAM,EAAE,YAAY,EAAE,GAAG,iBAAiB,EAAE,CAAC;IAC7C,MAAM,OAAO,GAAG,oBAAoB,EAAE,CAAC;IACvC,MAAM,QAAQ,GAAG,WAAW,EAAE,CAAC;IAE/B,MAAM,aAAa,GAAG,QAAQ,CAAC,WAAW,IAAI,IAAI,CAAC;IAEnD,MAAM,gBAAgB,GAAG,6BAA6B,CAAC;QACrD,IAAI,EAAE,QAAQ;QACd,IAAI,EAAE,OAAO,EAAE,IAAI,IAAI,EAAE;QACzB,WAAW,EAAE,GAAG,EAAE,CAChB,CAAC,aAAa;YACd,QAAQ,CAAC,QAAQ;YACjB,kBAAkB,CAAC,QAAQ,EAAE,QAAQ,CAAC,QAAQ,EAAE,OAAO,EAAE,IAAI,IAAI,EAAE,CAAC;KACvE,CAAC,CAAC;IAEH,OAAO,CACL,MAAC,WAAW,CAAC,IAAI,OAA0B,gBAAgB,aACxD,QAAQ,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CAC3B,KAAC,WAAW,CAAC,OAAO,IAAC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,CAAC,aAAa,YACnE,cACE,SAAS,EAAE,EAAE,CACX,2LAA2L,EAC3L,aAAa,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,aAAa,CAClD,aAEA,QAAQ,CAAC,KAAK,EACd,aAAa,IAAI,CAChB,KAAC,gBAAgB,IACf,SAAS,EAAC,8CAA8C,EACxD,IAAI,EAAE,EAAE,GACR,CACH,IACE,GACe,CACvB,CAAC,CAAC,CAAC,CACF,WAAW,CACZ,EACD,KAAC,WAAW,CAAC,OAAO,IAAC,SAAS,EAAC,6CAA6C,YAE1E,aAAI,SAAS,EAAC,8BAA8B,YACzC,QAAQ,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE,CAAC,CAClC,KAAC,kBAAkB,IAEjB,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAE,IAAI,EACV,YAAY,EAAE,YAAY,EAC1B,iBAAiB,EAAE,OAAO,EAC1B,QAAQ,EAAE,QAAQ,CAAC,OAAO,EAAE,IAAI,EAAE,QAAQ,CAAC,IAAI,CAAC,IAL3C,CAAC,CAMN,CACH,CAAC,GACC,GACe,KAnCD,QAAQ,CAAC,KAAK,CAoClB,CACpB,CAAC;AACJ,CAAC,CAAC"}

package/dist/lib/components/navigation/SideNavigationItem.d.ts

@@ -1,9 +0,0 @@
-import type { NavigationCategory, NavigationCategoryItem, NavigationItem } from "../../core/DevPortalContext.js";
-export declare const DATA_ANCHOR_ATTR = "data-anchor";
-export declare const SideNavigationItem: ({ category, item, activeAnchor, currentTopNavItem, basePath, }: {
-    category: NavigationCategory;
-    item: NavigationCategoryItem;
-    activeAnchor?: string;
-    currentTopNavItem?: NavigationItem;
-    basePath?: string;
-}) => import("react/jsx-runtime").JSX.Element;

package/dist/lib/components/navigation/SideNavigationItem.js

@@ -1,44 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import * as Collapsible from "@radix-ui/react-collapsible";
-import { cva } from "class-variance-authority";
-import { ChevronRightIcon, ExternalLinkIcon } from "lucide-react";
-import { NavLink, useLocation } from "react-router-dom";
-import { cn } from "../../util/cn.js";
-import { joinPath } from "../../util/joinPath.js";
-import { AnchorLink } from "../AnchorLink.js";
-import { useNavigationCollapsibleState } from "./useNavigationCollapsibleState.js";
-import { checkHasActiveItem, isLinkItem, isPathItem } from "./util.js";
-const navigationListItem = cva("flex px-[--padding-nav-item] py-1.5 rounded-lg hover:bg-accent transition-colors duration-300", {
-    variants: {
-        isActive: {
-            true: "text-primary font-medium",
-            false: "text-foreground/80",
-        },
-        isMuted: {
-            true: "text-foreground/30",
-            false: "",
-        },
-    },
-});
-export const DATA_ANCHOR_ATTR = "data-anchor";
-export const SideNavigationItem = ({ category, item, activeAnchor, currentTopNavItem, basePath = "", }) => {
-    const currentPath = isPathItem(item) ? joinPath(basePath, item.path) : "";
-    const location = useLocation();
-    const collapsibleProps = useNavigationCollapsibleState({
-        item,
-        path: currentPath,
-        defaultOpen: () => checkHasActiveItem(item, location.pathname, basePath),
-    });
-    if (isLinkItem(item)) {
-        const classes = cn("flex items-center gap-2", navigationListItem({
-            isActive: item.href === location.pathname,
-        }));
-        return item.href.startsWith("http") ? (_jsxs("a", { className: classes, href: item.href, target: "_blank", rel: "noopener noreferrer", children: [item.label, _jsx(ExternalLinkIcon, { size: 14 })] })) : (_jsx(NavLink, { className: classes, to: item.href, children: item.label }));
-    }
-    const linkContent = (_jsxs("div", { className: "flex justify-between w-full", children: [_jsxs("div", { className: "flex items-center gap-2 truncate w-full", children: [item.icon, typeof item.label !== "string" ? (item.label) : (_jsx("span", { className: "truncate", children: item.label }))] }), item.children && (_jsx(ChevronRightIcon, { size: 16, className: "transition shrink-0 group-data-[state=open]:rotate-90" }))] }));
-    return (_jsx("li", { title: typeof item.label === "string" ? item.label : item.title, children: item.children ? (_jsxs(Collapsible.Root, { ...collapsibleProps, className: "flex flex-col", children: [_jsx(Collapsible.Trigger, { className: cn("group text-start", navigationListItem({ isActive: false })), children: linkContent }), _jsx(Collapsible.Content, { className: "CollapsibleContent ms-[calc(var(--padding-nav-item)*1.125)]", children: _jsx("ul", { className: "mt-1 border-l ps-1.5", children: item.children.map((child) => (_jsx(SideNavigationItem, { category: category, item: child, activeAnchor: activeAnchor, currentTopNavItem: currentTopNavItem, basePath: currentPath }, isPathItem(child) ? child.path : child.href))) }) })] })) : item.path.startsWith("#") ? (_jsx(AnchorLink, { to: item.path, [DATA_ANCHOR_ATTR]: item.path, className: navigationListItem({
-                isActive: item.path.slice(1) === activeAnchor,
-                isMuted: item.muted,
-            }), children: linkContent })) : (_jsx(NavLink, { className: ({ isActive }) => navigationListItem({ isActive }), to: currentPath, children: linkContent })) }));
-};
-//# sourceMappingURL=SideNavigationItem.js.map

package/dist/lib/components/navigation/SideNavigationItem.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"SideNavigationItem.js","sourceRoot":"","sources":["../../../../src/lib/components/navigation/SideNavigationItem.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,WAAW,MAAM,6BAA6B,CAAC;AAC3D,OAAO,EAAE,GAAG,EAAE,MAAM,0BAA0B,CAAC;AAC/C,OAAO,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAClE,OAAO,EAAE,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAOxD,OAAO,EAAE,EAAE,EAAE,MAAM,kBAAkB,CAAC;AACtC,OAAO,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAC;AAClD,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAAE,6BAA6B,EAAE,MAAM,oCAAoC,CAAC;AACnF,OAAO,EAAE,kBAAkB,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,WAAW,CAAC;AAEvE,MAAM,kBAAkB,GAAG,GAAG,CAC5B,+FAA+F,EAC/F;IACE,QAAQ,EAAE;QACR,QAAQ,EAAE;YACR,IAAI,EAAE,0BAA0B;YAChC,KAAK,EAAE,oBAAoB;SAC5B;QACD,OAAO,EAAE;YACP,IAAI,EAAE,oBAAoB;YAC1B,KAAK,EAAE,EAAE;SACV;KACF;CACF,CACF,CAAC;AAEF,MAAM,CAAC,MAAM,gBAAgB,GAAG,aAAa,CAAC;AAE9C,MAAM,CAAC,MAAM,kBAAkB,GAAG,CAAC,EACjC,QAAQ,EACR,IAAI,EACJ,YAAY,EACZ,iBAAiB,EACjB,QAAQ,GAAG,EAAE,GAOd,EAAE,EAAE;IACH,MAAM,WAAW,GAAG,UAAU,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,QAAQ,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;IAC1E,MAAM,QAAQ,GAAG,WAAW,EAAE,CAAC;IAE/B,MAAM,gBAAgB,GAAG,6BAA6B,CAAC;QACrD,IAAI;QACJ,IAAI,EAAE,WAAW;QACjB,WAAW,EAAE,GAAG,EAAE,CAAC,kBAAkB,CAAC,IAAI,EAAE,QAAQ,CAAC,QAAQ,EAAE,QAAQ,CAAC;KACzE,CAAC,CAAC;IAEH,IAAI,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC;QACrB,MAAM,OAAO,GAAG,EAAE,CAChB,yBAAyB,EACzB,kBAAkB,CAAC;YACjB,QAAQ,EAAE,IAAI,CAAC,IAAI,KAAK,QAAQ,CAAC,QAAQ;SAC1C,CAAC,CACH,CAAC;QACF,OAAO,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CACpC,aACE,SAAS,EAAE,OAAO,EAClB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,MAAM,EAAC,QAAQ,EACf,GAAG,EAAC,qBAAqB,aAExB,IAAI,CAAC,KAAK,EACX,KAAC,gBAAgB,IAAC,IAAI,EAAE,EAAE,GAAI,IAC5B,CACL,CAAC,CAAC,CAAC,CACF,KAAC,OAAO,IAAC,SAAS,EAAE,OAAO,EAAE,EAAE,EAAE,IAAI,CAAC,IAAI,YACvC,IAAI,CAAC,KAAK,GACH,CACX,CAAC;IACJ,CAAC;IAED,MAAM,WAAW,GAAG,CAClB,eAAK,SAAS,EAAC,6BAA6B,aAC1C,eAAK,SAAS,EAAC,yCAAyC,aACrD,IAAI,CAAC,IAAI,EACT,OAAO,IAAI,CAAC,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,CAChC,IAAI,CAAC,KAAK,CACX,CAAC,CAAC,CAAC,CACF,eAAM,SAAS,EAAC,UAAU,YAAE,IAAI,CAAC,KAAK,GAAQ,CAC/C,IACG,EACL,IAAI,CAAC,QAAQ,IAAI,CAChB,KAAC,gBAAgB,IACf,IAAI,EAAE,EAAE,EACR,SAAS,EAAC,uDAAuD,GACjE,CACH,IACG,CACP,CAAC;IAEF,OAAO,CACL,aAAI,KAAK,EAAE,OAAO,IAAI,CAAC,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,YAChE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CACf,MAAC,WAAW,CAAC,IAAI,OAAK,gBAAgB,EAAE,SAAS,EAAC,eAAe,aAC/D,KAAC,WAAW,CAAC,OAAO,IAClB,SAAS,EAAE,EAAE,CACX,kBAAkB,EAClB,kBAAkB,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC,CACxC,YAEA,WAAW,GACQ,EACtB,KAAC,WAAW,CAAC,OAAO,IAAC,SAAS,EAAC,6DAA6D,YAC1F,aAAI,SAAS,EAAC,sBAAsB,YACjC,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,CAC5B,KAAC,kBAAkB,IAEjB,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAE,KAAK,EACX,YAAY,EAAE,YAAY,EAC1B,iBAAiB,EAAE,iBAAiB,EACpC,QAAQ,EAAE,WAAW,IALhB,UAAU,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAMhD,CACH,CAAC,GACC,GACe,IACL,CACpB,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAC9B,KAAC,UAAU,IACT,EAAE,EAAE,IAAI,CAAC,IAAI,EACP,CAAC,gBAAgB,CAAC,EAAE,IAAI,CAAC,IAAI,EACnC,SAAS,EAAE,kBAAkB,CAAC;gBAC5B,QAAQ,EAAE,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK,YAAY;gBAC7C,OAAO,EAAE,IAAI,CAAC,KAAK;aACpB,CAAC,YAED,WAAW,GACD,CACd,CAAC,CAAC,CAAC,CACF,KAAC,OAAO,IACN,SAAS,EAAE,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC,kBAAkB,CAAC,EAAE,QAAQ,EAAE,CAAC,EAC7D,EAAE,EAAE,WAAW,YAEd,WAAW,GACJ,CACX,GACE,CACN,CAAC;AACJ,CAAC,CAAC"}

package/dist/lib/components/navigation/SideNavigationWrapper.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"SideNavigationWrapper.js","sourceRoot":"","sources":["../../../../src/lib/components/navigation/SideNavigationWrapper.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAA0B,MAAM,OAAO,CAAC;AAC3D,OAAO,EAAE,EAAE,EAAE,MAAM,kBAAkB,CAAC;AAEtC,MAAM,CAAC,MAAM,qBAAqB,GAAG,UAAU,CAG7C,SAAS,cAAc,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,eAAe,EAAE,EAAE,GAAG;IACrE,OAAO,CACL,iCAKmB,MAAM,CAAC,eAAe,CAAC,EACxC,SAAS,EAAE,EAAE,CACX,iOAAiO,EACjO,SAAS,CACV,EACD,GAAG,EAAE,GAAG,YAEP,QAAQ,GACL,CACP,CAAC;AACJ,CAAC,CAAC,CAAC"}

package/dist/lib/components/navigation/useNavigationCollapsibleState.d.ts

@@ -1,9 +0,0 @@
-import type { CollapsibleProps } from "@radix-ui/react-collapsible";
-import type { NavigationNode } from "../../util/traverseNavigation.js";
-export declare const useNavigationCollapsibleState: ({ item, defaultOpen, path, }: {
-    item: NavigationNode;
-    defaultOpen: () => boolean;
-    path: string;
-}) => Partial<CollapsibleProps> & {
-    "data-animate": boolean;
-};