element-book 7.0.2 → 7.0.4

package/dist/data/book-tree/book-tree.d.ts

@@ -12,5 +12,4 @@ export declare function createBookTreeFromEntries({ entries, everythingTitle, ev
     debug: boolean;
 }): BookTree;
 export declare function traverseToImmediateParent(entryOrNode: Readonly<BookEntry> | BookTreeNode, currentTree: Readonly<BookTreeNode>): BookTreeNode | undefined;
-export declare function getSortedNodeChildren(nodeA: Readonly<BookTreeNode>, nodeB: Readonly<BookTreeNode>): number;
 export declare function flattenTree(node: Readonly<BookTreeNode>): BookTreeNode[];

package/dist/data/book-tree/book-tree.js

@@ -122,24 +122,11 @@ export function traverseToImmediateParent(entryOrNode, currentTree) {
     }, currentTree);
     return immediateParentNode;
 }
-export function getSortedNodeChildren(nodeA, nodeB) {
-    if (nodeA.entry.entryType !== nodeB.entry.entryType) {
-        if (isBookEntry(nodeA.entry, BookEntryTypeEnum.ElementExample)) {
-            return -1;
-        }
-        if (isBookEntry(nodeB.entry, BookEntryTypeEnum.ElementExample)) {
-            return 1;
-        }
-    }
-    return nodeA.entry.title.localeCompare(nodeB.entry.title);
-}
 export function flattenTree(node) {
     const hasErrors = !!node.entry.errors.length;
     const childNodes = hasErrors
         ? []
-        : Object.values(node.children)
-            .sort(getSortedNodeChildren)
-            .map((child) => flattenTree(child));
+        : Object.values(node.children).map((child) => flattenTree(child));
     const entries = [
         node,
         ...childNodes,

package/dist/ui/elements/book-nav.element.d.ts

@@ -5,3 +5,4 @@ export declare const BookNav: import("element-vir").DeclarativeElementDefinition
     selectedPath: ReadonlyArray<string> | undefined;
     router: BookRouter | undefined;
 }, {}, {}, `book-nav-${string}`, "book-nav-internal-indent", import("lit-html").HTMLTemplateResult>;
+export declare function scrollSelectedNavElementIntoView(bookNavInstance: typeof BookNav.instanceType): Promise<void>;

package/dist/ui/elements/book-nav.element.js

@@ -1,3 +1,4 @@
+import { checkIfEntirelyInScrollView, waitForAnimationFrame } from '@augment-vir/browser';
 import { areJsonEqual } from '@augment-vir/common';
 import { assign, classMap, css, html, renderIf } from 'element-vir';
 import { Element16Icon, ViraIcon } from 'vira';
@@ -112,3 +113,14 @@ export const BookNav = defineBookElement()({
         `;
     },
 });
+export async function scrollSelectedNavElementIntoView(bookNavInstance) {
+    await waitForAnimationFrame(2);
+    const selected = bookNavInstance.shadowRoot.querySelector('.selected');
+    if (!selected) {
+        throw new Error('Failed to find selected nav tree element.');
+    }
+    if (await checkIfEntirelyInScrollView(selected)) {
+        return;
+    }
+    selected.scrollIntoView({ behavior: 'smooth', block: 'center' });
+}

package/dist/ui/elements/element-book-app/element-book-app.element.js

@@ -8,7 +8,7 @@ import { createBookRouter } from '../../../routing/create-book-router';
 import { colorThemeCssVars, setThemeCssVars } from '../../color-theme/color-theme';
 import { createTheme } from '../../color-theme/create-color-theme';
 import { ChangeRouteEvent } from '../../events/change-route.event';
-import { BookNav } from '../book-nav.element';
+import { BookNav, scrollSelectedNavElementIntoView } from '../book-nav.element';
 import { BookError } from '../common/book-error.element';
 import { BookEntryDisplay } from '../entry-display/book-entry-display.element';
 import { BookPageControls } from '../entry-display/book-page/book-page-controls.element';
@@ -65,6 +65,11 @@ export const ElementBookApp = defineElement()({
             top: 0;
         }
     `,
+    initCallback({ host }) {
+        setTimeout(() => {
+            scrollNav(host);
+        }, 1000);
+    },
     cleanupCallback({ state, updateState }) {
         if (state.router) {
             state.router.removeAllRouteListeners();
@@ -167,6 +172,11 @@ export const ElementBookApp = defineElement()({
                     console.error(`Failed to find '${BookEntryDisplay.tagName}' for scrolling.`);
                 }
                 updateRoutes(event.detail);
+                const navElement = host.shadowRoot.querySelector(BookNav.tagName);
+                if (!(navElement instanceof BookNav)) {
+                    throw new Error(`Failed to find child '${BookNav.tagName}'`);
+                }
+                scrollNav(host);
             })}
                     ${listen(BookPageControls.events.controlValueChange, (event) => {
                 if (!state.treeBasedCurrentControls) {
@@ -221,3 +231,10 @@ export const ElementBookApp = defineElement()({
         }
     },
 });
+async function scrollNav(host) {
+    const navElement = host.shadowRoot.querySelector(BookNav.tagName);
+    if (!(navElement instanceof BookNav)) {
+        throw new Error(`Failed to find child '${BookNav.tagName}'`);
+    }
+    await scrollSelectedNavElementIntoView(navElement);
+}

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "element-book",
-    "version": "7.0.2",
+    "version": "7.0.4",
     "keywords": [
         "book",
         "design system",
@@ -39,18 +39,18 @@
         "test:watch": "web-test-runner --color --watch --config configs/web-test-runner.config.mjs"
     },
     "dependencies": {
-        "@augment-vir/browser": "^15.2.1",
-        "@augment-vir/common": "^15.2.1",
+        "@augment-vir/browser": "^15.3.0",
+        "@augment-vir/common": "^15.3.0",
         "colorjs.io": "0.4.3",
         "element-vir": "^14.0.3",
         "lit-css-vars": "^2.0.3",
         "object-shape-tester": "^0.3.0",
         "spa-router-vir": "^2.1.0",
         "typed-event-target": "^1.2.1",
-        "vira": "^0.5.0"
+        "vira": "^0.5.1"
     },
     "devDependencies": {
-        "@augment-vir/browser-testing": "^15.2.1",
+        "@augment-vir/browser-testing": "^15.3.0",
         "@open-wc/testing": "^3.2.0",
         "@types/chai": "^4.3.5",
         "@types/mocha": "^10.0.1",