@djangocfg/ui-tools 2.1.292 → 2.1.293

package/dist/index.cjs

@@ -263,7 +263,7 @@ function OpenapiLoadingFallback() {
 }
 chunkWGEGR3DF_cjs.__name(OpenapiLoadingFallback, "OpenapiLoadingFallback");
 var LazyDocsLayout = createLazyComponent(
-  () => import('./DocsLayout-5WTQR3BR.cjs').then((mod) => ({ default: mod.DocsLayout })),
+  () => import('./DocsLayout-PLWQJBGU.cjs').then((mod) => ({ default: mod.DocsLayout })),
   {
     displayName: "LazyDocsLayout",
     fallback: /* @__PURE__ */ jsxRuntime.jsx(OpenapiLoadingFallback, {})
@@ -418,7 +418,7 @@ function LottiePlayer(props) {
 }
 chunkWGEGR3DF_cjs.__name(LottiePlayer, "LottiePlayer");
 var DocsLayout = React.lazy(
-  () => import('./DocsLayout-5WTQR3BR.cjs').then((mod) => ({ default: mod.DocsLayout }))
+  () => import('./DocsLayout-PLWQJBGU.cjs').then((mod) => ({ default: mod.DocsLayout }))
 );
 var LoadingFallback7 = /* @__PURE__ */ chunkWGEGR3DF_cjs.__name(() => /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-center min-h-[400px]", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-muted-foreground", children: "Loading API Playground..." }) }), "LoadingFallback");
 var Playground = /* @__PURE__ */ chunkWGEGR3DF_cjs.__name(({ config }) => {

package/dist/index.mjs

@@ -238,7 +238,7 @@ function OpenapiLoadingFallback() {
 }
 __name(OpenapiLoadingFallback, "OpenapiLoadingFallback");
 var LazyDocsLayout = createLazyComponent(
-  () => import('./DocsLayout-YZR5RLCJ.mjs').then((mod) => ({ default: mod.DocsLayout })),
+  () => import('./DocsLayout-XB55R7YG.mjs').then((mod) => ({ default: mod.DocsLayout })),
   {
     displayName: "LazyDocsLayout",
     fallback: /* @__PURE__ */ jsx(OpenapiLoadingFallback, {})
@@ -393,7 +393,7 @@ function LottiePlayer(props) {
 }
 __name(LottiePlayer, "LottiePlayer");
 var DocsLayout = lazy(
-  () => import('./DocsLayout-YZR5RLCJ.mjs').then((mod) => ({ default: mod.DocsLayout }))
+  () => import('./DocsLayout-XB55R7YG.mjs').then((mod) => ({ default: mod.DocsLayout }))
 );
 var LoadingFallback7 = /* @__PURE__ */ __name(() => /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center min-h-[400px]", children: /* @__PURE__ */ jsx("div", { className: "text-muted-foreground", children: "Loading API Playground..." }) }), "LoadingFallback");
 var Playground = /* @__PURE__ */ __name(({ config }) => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@djangocfg/ui-tools",
-  "version": "2.1.292",
+  "version": "2.1.293",
   "description": "Heavy React tools with lazy loading - for Electron, Vite, CRA, Next.js apps",
   "keywords": [
     "ui-tools",
@@ -91,8 +91,8 @@
     "check": "tsc --noEmit"
   },
   "peerDependencies": {
-    "@djangocfg/i18n": "^2.1.292",
-    "@djangocfg/ui-core": "^2.1.292",
+    "@djangocfg/i18n": "^2.1.293",
+    "@djangocfg/ui-core": "^2.1.293",
     "consola": "^3.4.2",
     "lodash-es": "^4.18.1",
     "lucide-react": "^0.545.0",
@@ -140,10 +140,10 @@
     "@maplibre/maplibre-gl-geocoder": "^1.7.0"
   },
   "devDependencies": {
-    "@djangocfg/i18n": "^2.1.292",
+    "@djangocfg/i18n": "^2.1.293",
     "@djangocfg/playground": "workspace:*",
-    "@djangocfg/typescript-config": "^2.1.292",
-    "@djangocfg/ui-core": "^2.1.292",
+    "@djangocfg/typescript-config": "^2.1.293",
+    "@djangocfg/ui-core": "^2.1.293",
     "@types/lodash-es": "^4.17.12",
     "@types/mapbox__mapbox-gl-draw": "^1.4.8",
     "@types/node": "^24.7.2",

package/src/tools/OpenapiViewer/components/DocsLayout/Sidebar/EndpointRow.tsx

@@ -1,6 +1,6 @@
 'use client';
 
-import React from 'react';
+import React, { useEffect, useRef } from 'react';
 
 import { Tooltip, TooltipContent, TooltipTrigger } from '@djangocfg/ui-core/components';
 import { cn } from '@djangocfg/ui-core/lib';
@@ -35,10 +35,21 @@ export const EndpointRow = React.memo(function EndpointRow({
     // in ``.`` which looks like punctuation noise when stacked in a list.
     const displayLabel = row.label.replace(/\.$/, '');
 
+    // Keep the active row visible inside the sidebar's scroll container.
+    // ``block: 'nearest'`` is a no-op when the row is already in view,
+    // so this only fires when the user scrolled the docs far enough to
+    // push the highlighted endpoint above/below the sidebar viewport.
+    const buttonRef = useRef<HTMLButtonElement | null>(null);
+    useEffect(() => {
+        if (!row.isActive || !buttonRef.current) return;
+        buttonRef.current.scrollIntoView({ block: 'nearest', inline: 'nearest' });
+    }, [row.isActive]);
+
     return (
         <Tooltip delayDuration={350}>
             <TooltipTrigger asChild>
                 <button
+                    ref={buttonRef}
                     onClick={() => onNavigate(row.anchor, row.schemaId)}
                     aria-current={row.isActive ? 'location' : undefined}
                     className={cn(

package/src/tools/OpenapiViewer/components/DocsLayout/Sidebar/SidebarBody.tsx

@@ -24,7 +24,7 @@ export function SidebarBody({ body, onNavigate }: SidebarBodyProps) {
             );
         }
         return (
-            <nav className="py-1.5">
+            <nav className="pt-1.5 pb-[10vh]">
                 {body.categories.map((cat) => (
                     <CategoryBlock key={cat.key} category={cat} onNavigate={onNavigate} />
                 ))}