element-book 6.0.2 → 7.0.0

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

@@ -0,0 +1,56 @@
+import { randomString } from '@augment-vir/browser';
+import { isRuntimeTypeOf } from '@augment-vir/common';
+import { fuzzySearch } from '../../util/fuzzy-search';
+const searchJoin = randomString(32);
+function createBreadcrumbsSearchKey(breadcrumbs) {
+    return breadcrumbs.join(searchJoin);
+}
+function getFullTreeKeysToInclude(breadcrumbs) {
+    if (!breadcrumbs.length) {
+        return [];
+    }
+    const currentKey = createBreadcrumbsSearchKey(breadcrumbs);
+    const ancestorKeys = getFullTreeKeysToInclude(breadcrumbs.slice(0, -1));
+    return [
+        currentKey,
+        ...ancestorKeys,
+    ];
+}
+const errorQueries = [
+    'error',
+    'errors',
+];
+function isSearchingForErrors(searchQuery) {
+    return errorQueries.includes(searchQuery);
+}
+export function searchFlattenedNodes({ flattenedNodes, searchQuery, }) {
+    const includeInSearchResults = {};
+    flattenedNodes.forEach((treeNode) => {
+        const matchesErrors = treeNode.entry.errors.length && isSearchingForErrors(searchQuery);
+        const shouldInclude = fuzzySearch({
+            searchIn: [
+                treeNode.entry.title,
+                ...treeNode.entry.descriptionParagraphs,
+            ]
+                .join(' ')
+                .toLowerCase(),
+            searchQuery: searchQuery.toLowerCase(),
+        }) || matchesErrors;
+        if (shouldInclude) {
+            const keysToInclude = getFullTreeKeysToInclude(treeNode.fullUrlBreadcrumbs);
+            keysToInclude.forEach((keyToInclude) => (includeInSearchResults[keyToInclude] = true));
+        }
+        else {
+            const currentNodeKey = createBreadcrumbsSearchKey(treeNode.fullUrlBreadcrumbs);
+            includeInSearchResults[currentNodeKey] = false;
+        }
+    });
+    return flattenedNodes.filter((treeNode) => {
+        const inSearchResultsKey = createBreadcrumbsSearchKey(treeNode.fullUrlBreadcrumbs);
+        const shouldInclude = includeInSearchResults[inSearchResultsKey];
+        if (!isRuntimeTypeOf(shouldInclude, 'boolean')) {
+            throw new Error(`Failed to find '${treeNode.fullUrlBreadcrumbs.join(' > ')}' in includeInSearchResults.`);
+        }
+        return shouldInclude;
+    });
+}

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

@@ -0,0 +1,4 @@
+import { BookEntry } from '../book-entry/book-entry';
+import { BookTree } from './book-tree-node';
+export declare function getTreeFromCache(entries: ReadonlyArray<BookEntry>): BookTree | undefined;
+export declare function addTreeToCache(entries: ReadonlyArray<BookEntry>, tree: BookTree): void;

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

@@ -0,0 +1,8 @@
+import { getOrSetFromMap } from '@augment-vir/common';
+const treeCache = new Map();
+export function getTreeFromCache(entries) {
+    return treeCache.get(entries);
+}
+export function addTreeToCache(entries, tree) {
+    getOrSetFromMap(treeCache, entries, () => tree);
+}

package/dist/index.d.ts

@@ -1,9 +1,8 @@
-export * from './data/element-book-entry/element-book-chapter/element-book-chapter';
-export * from './data/element-book-entry/element-book-entry';
-export * from './data/element-book-entry/element-book-page/element-book-page';
-export * from './data/element-book-entry/element-book-page/element-book-page-controls/element-book-page-control';
-export * from './data/element-book-entry/element-book-page/element-book-page-controls/element-book-page-control-type';
-export * from './data/element-book-entry/element-book-page/element-book-page-example';
+export * from './data/book-entry/book-element-example/book-element-example';
+export * from './data/book-entry/book-page/book-page';
+export * from './data/book-entry/book-page/book-page-controls';
+export * from './data/book-entry/book-page/define-book-page';
+export * from './data/book-entry/url-breadcrumbs';
 export * from './ui/elements/element-book-app/element-book-app-slots';
 export * from './ui/elements/element-book-app/element-book-app.element';
 export * from './ui/elements/element-book-app/element-book-config';

package/dist/index.js

@@ -1,9 +1,8 @@
-export * from './data/element-book-entry/element-book-chapter/element-book-chapter';
-export * from './data/element-book-entry/element-book-entry';
-export * from './data/element-book-entry/element-book-page/element-book-page';
-export * from './data/element-book-entry/element-book-page/element-book-page-controls/element-book-page-control';
-export * from './data/element-book-entry/element-book-page/element-book-page-controls/element-book-page-control-type';
-export * from './data/element-book-entry/element-book-page/element-book-page-example';
+export * from './data/book-entry/book-element-example/book-element-example';
+export * from './data/book-entry/book-page/book-page';
+export * from './data/book-entry/book-page/book-page-controls';
+export * from './data/book-entry/book-page/define-book-page';
+export * from './data/book-entry/url-breadcrumbs';
 export * from './ui/elements/element-book-app/element-book-app-slots';
 export * from './ui/elements/element-book-app/element-book-app.element';
 export * from './ui/elements/element-book-app/element-book-config';

package/dist/routing/book-routing.d.ts

@@ -0,0 +1,10 @@
+import { FullRoute, SpaRouter } from 'spa-router-vir';
+export declare enum BookMainRoute {
+    Search = "search",
+    Book = "book"
+}
+export type ValidBookPaths = [BookMainRoute.Search, string] | [BookMainRoute.Book, ...string[]];
+export type BookFullRoute = Required<Readonly<FullRoute<ValidBookPaths, undefined | Record<string, string>, undefined>>>;
+export declare function extractSearchQuery(paths: Readonly<ValidBookPaths>): string;
+export declare const defaultBookFullRoute: Readonly<BookFullRoute>;
+export type BookRouter = BookFullRoute extends FullRoute<infer Paths, infer Search, infer Hash> ? Readonly<SpaRouter<Paths, Search, Hash>> : never;

package/dist/routing/book-routing.js

@@ -0,0 +1,18 @@
+export var BookMainRoute;
+(function (BookMainRoute) {
+    BookMainRoute["Search"] = "search";
+    BookMainRoute["Book"] = "book";
+})(BookMainRoute || (BookMainRoute = {}));
+export function extractSearchQuery(paths) {
+    if (paths[0] === BookMainRoute.Book) {
+        return '';
+    }
+    else {
+        return paths[1] ? decodeURIComponent(paths[1]) : '';
+    }
+}
+export const defaultBookFullRoute = {
+    hash: undefined,
+    paths: [BookMainRoute.Book],
+    search: undefined,
+};

package/dist/routing/create-book-router.d.ts

@@ -0,0 +1,2 @@
+import { BookRouter } from './book-routing';
+export declare function createBookRouter(baseRoute: string | undefined): BookRouter;

package/dist/routing/{create-element-book-router.js → create-book-router.js}

@@ -1,7 +1,7 @@
 import { isEnumValue } from '@augment-vir/common';
 import { createSpaRouter } from 'spa-router-vir';
-import { defaultElementBookFullRoute, ElementBookMainRoute, } from './element-book-routing';
-export function createElementBookRouter(baseRoute) {
+import { BookMainRoute, defaultBookFullRoute } from './book-routing';
+export function createBookRouter(baseRoute) {
     return createSpaRouter({
         routeBase: baseRoute,
         routeSanitizer(rawRoute) {
@@ -16,19 +16,19 @@ export function createElementBookRouter(baseRoute) {
 }
 function sanitizePaths(paths) {
     const firstPath = paths[0];
-    if (!isEnumValue(firstPath, ElementBookMainRoute)) {
-        return defaultElementBookFullRoute.paths;
+    if (!isEnumValue(firstPath, BookMainRoute)) {
+        return defaultBookFullRoute.paths;
     }
-    else if (firstPath === ElementBookMainRoute.Book) {
+    else if (firstPath === BookMainRoute.Book) {
         return [
-            ElementBookMainRoute.Book,
+            BookMainRoute.Book,
             ...paths.slice(1),
         ];
     }
-    else if (firstPath === ElementBookMainRoute.Search) {
+    else if (firstPath === BookMainRoute.Search) {
         if (!paths[1]) {
             return [
-                ElementBookMainRoute.Book,
+                BookMainRoute.Book,
                 ...paths.slice(1),
             ];
         }

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

@@ -0,0 +1,5 @@
+import { BookFullRoute, BookRouter } from '../../routing/book-routing';
+export declare const BookBreadcrumbs: import("element-vir").DeclarativeElementDefinition<"book-breadcrumbs", {
+    currentRoute: Readonly<BookFullRoute>;
+    router: BookRouter;
+}, {}, {}, `book-breadcrumbs-${string}`, `book-breadcrumbs-${string}`, import("lit-html").HTMLTemplateResult | import("lit-html").HTMLTemplateResult[]>;

package/dist/ui/elements/{element-book-breadcrumbs.element.js → book-breadcrumbs.element.js}

@@ -1,9 +1,9 @@
 import { assign, css, html } from 'element-vir';
-import { ElementBookMainRoute, } from '../../routing/element-book-routing';
-import { ElementBookRouteLink } from './common/element-book-route-link.element';
-import { defineElementBookElement } from './define-book-element';
-export const ElementBookBreadcrumbs = defineElementBookElement()({
-    tagName: 'element-book-breadcrumbs',
+import { BookMainRoute } from '../../routing/book-routing';
+import { BookRouteLink } from './common/book-route-link.element';
+import { defineBookElement } from './define-book-element';
+export const BookBreadcrumbs = defineBookElement()({
+    tagName: 'book-breadcrumbs',
     styles: css `
         :host {
             display: flex;
@@ -30,13 +30,13 @@ export const ElementBookBreadcrumbs = defineElementBookElement()({
                       <span class="spacer">&gt;</span>
                   `;
             return html `
-                <${ElementBookRouteLink}
-                    ${assign(ElementBookRouteLink, {
+                <${BookRouteLink}
+                    ${assign(BookRouteLink, {
                 route: {
                     hash: undefined,
                     search: undefined,
                     paths: [
-                        ElementBookMainRoute.Book,
+                        BookMainRoute.Book,
                         ...fullPathSoFar,
                     ],
                 },
@@ -44,7 +44,7 @@ export const ElementBookBreadcrumbs = defineElementBookElement()({
             })}
                 >
                     ${currentPath}
-                </${ElementBookRouteLink}>
+                </${BookRouteLink}>
                 ${spacer}
             `;
         });

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

@@ -0,0 +1,7 @@
+import { BookTreeNode } from '../../data/book-tree/book-tree-node';
+import { BookRouter } from '../../routing/book-routing';
+export declare const BookNav: import("element-vir").DeclarativeElementDefinition<"book-nav", {
+    flattenedNodes: ReadonlyArray<Readonly<BookTreeNode>>;
+    selectedPath: ReadonlyArray<string> | undefined;
+    router: BookRouter | undefined;
+}, {}, {}, `book-nav-${string}`, "book-nav-internal-indent", import("lit-html").HTMLTemplateResult>;

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

@@ -0,0 +1,114 @@
+import { areJsonEqual } from '@augment-vir/common';
+import { assign, classMap, css, html, renderIf } from 'element-vir';
+import { Element16Icon, ViraIcon } from 'vira';
+import { BookEntryTypeEnum } from '../../data/book-entry/book-entry-type';
+import { isBookTreeNode } from '../../data/book-tree/book-tree';
+import { BookMainRoute } from '../../routing/book-routing';
+import { colorThemeCssVars } from '../color-theme/color-theme';
+import { BookRouteLink } from './common/book-route-link.element';
+import { defineBookElement } from './define-book-element';
+import { ElementBookSlotName } from './element-book-app/element-book-app-slots';
+export const BookNav = defineBookElement()({
+    tagName: 'book-nav',
+    cssVars: {
+        'book-nav-internal-indent': '0',
+    },
+    styles: ({ cssVars }) => css `
+        :host {
+            display: flex;
+            flex-direction: column;
+            padding: 16px 0;
+            background-color: ${colorThemeCssVars['element-book-page-background-faint-level-2-color'].value};
+        }
+
+        .title-row:hover {
+            background-color: ${colorThemeCssVars['element-book-nav-hover-background-color'].value};
+            color: ${colorThemeCssVars['element-book-nav-hover-foreground-color'].value};
+        }
+
+        .title-row:active {
+            background-color: ${colorThemeCssVars['element-book-nav-active-background-color']
+        .value};
+            color: ${colorThemeCssVars['element-book-nav-active-foreground-color'].value};
+        }
+
+        .title-row {
+            display: block;
+            ${BookRouteLink.cssVars['book-route-link-anchor-padding']
+        .name}: 1px 24px 1px calc(calc(16px * ${cssVars['book-nav-internal-indent']
+        .value}) + 8px);
+        }
+
+        ul {
+            list-style: none;
+            padding: 0;
+            margin: 0;
+        }
+
+        .selected,
+        .selected:hover {
+            background-color: ${colorThemeCssVars['element-book-nav-selected-background-color']
+        .value};
+            color: ${colorThemeCssVars['element-book-nav-selected-foreground-color'].value};
+            pointer-events: none;
+        }
+
+        .title-text {
+            white-space: nowrap;
+            padding: 1px 0;
+            text-overflow: ellipsis;
+            display: flex;
+            gap: 8px;
+            align-items: center;
+            font-size: 16px;
+        }
+
+        ${ViraIcon} {
+            display: inline-flex;
+            color: ${colorThemeCssVars['element-book-accent-icon-color'].value};
+        }
+    `,
+    renderCallback({ inputs }) {
+        const navTreeTemplates = inputs.flattenedNodes.map((treeNode) => {
+            const liStyle = css `
+                --book-nav-internal-indent: ${treeNode.fullUrlBreadcrumbs.length};
+            `;
+            return html `
+                <li style=${liStyle}>
+                    <${BookRouteLink}
+                        ${assign(BookRouteLink, {
+                router: inputs.router,
+                route: {
+                    paths: [
+                        BookMainRoute.Book,
+                        ...treeNode.fullUrlBreadcrumbs,
+                    ],
+                },
+            })}
+                        class=${classMap({
+                'title-row': true,
+                selected: inputs.selectedPath
+                    ? areJsonEqual(inputs.selectedPath, treeNode.fullUrlBreadcrumbs)
+                    : false,
+            })}
+                    >
+                        <div class="title-text">
+                            ${renderIf(isBookTreeNode(treeNode, BookEntryTypeEnum.ElementExample), html `
+                                    <${ViraIcon}
+                                        ${assign(ViraIcon, { icon: Element16Icon })}
+                                    ></${ViraIcon}>
+                                `)}
+                            ${treeNode.entry.title}
+                        </div>
+                    </${BookRouteLink}>
+                </li>
+            `;
+        });
+        return html `
+            <slot name=${ElementBookSlotName.NavHeader}></slot>
+            <ul>
+                ${navTreeTemplates}
+            </ul>
+        `;
+    },
+});

package/dist/ui/elements/common/book-error.element.d.ts

@@ -0,0 +1,3 @@
+export declare const BookError: import("element-vir").DeclarativeElementDefinition<"book-error", {
+    message: string | ReadonlyArray<string>;
+}, {}, {}, `book-error-${string}`, `book-error-${string}`, import("lit-html").HTMLTemplateResult[]>;

package/dist/ui/elements/common/book-error.element.js

@@ -0,0 +1,27 @@
+import { isRuntimeTypeOf } from '@augment-vir/common';
+import { css, html } from 'element-vir';
+import { defineBookElement } from '../define-book-element';
+export const BookError = defineBookElement()({
+    tagName: 'book-error',
+    styles: css `
+        :host {
+            display: flex;
+            flex-direction: column;
+            color: red;
+            font-weight: bold;
+        }
+
+        p {
+            margin: 0;
+            padding: 0;
+        }
+    `,
+    renderCallback({ inputs }) {
+        const paragraphs = isRuntimeTypeOf(inputs.message, 'array')
+            ? inputs.message
+            : [inputs.message];
+        return paragraphs.map((paragraph) => html `
+                    <p>${paragraph}</p>
+                `);
+    },
+});

package/dist/ui/elements/common/book-route-link.element.d.ts

@@ -0,0 +1,5 @@
+import { BookFullRoute, BookRouter } from '../../../routing/book-routing';
+export declare const BookRouteLink: import("element-vir").DeclarativeElementDefinition<"book-route-link", {
+    route: Partial<BookFullRoute>;
+    router: BookRouter | undefined;
+}, {}, {}, `book-route-link-${string}`, "book-route-link-anchor-padding", import("lit-html").HTMLTemplateResult>;

package/dist/ui/elements/common/{element-book-route-link.element.js → book-route-link.element.js}

@@ -1,17 +1,17 @@
 import { css, html, listen } from 'element-vir';
 import { shouldMouseEventTriggerRoutes } from 'spa-router-vir';
 import { ChangeRouteEvent } from '../../events/change-route.event';
-import { defineElementBookElement } from '../define-book-element';
-export const ElementBookRouteLink = defineElementBookElement()({
-    tagName: 'element-book-route-link',
+import { defineBookElement } from '../define-book-element';
+export const BookRouteLink = defineBookElement()({
+    tagName: 'book-route-link',
     cssVars: {
-        'element-book-route-link-anchor-padding': '',
+        'book-route-link-anchor-padding': '',
     },
     styles: ({ cssVars }) => css `
         a {
             box-sizing: border-box;
             display: block;
-            padding: ${cssVars['element-book-route-link-anchor-padding'].value};
+            padding: ${cssVars['book-route-link-anchor-padding'].value};
             text-decoration: inherit;
             color: inherit;
             height: 100%;

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

@@ -1,2 +1,2 @@
-export type BookTagName = `element-book-${string}`;
-export declare const defineElementBookElement: <InputsGeneric extends {}>() => <TagName extends `element-book-${string}`, StateInit extends {}, EventsInit extends {}, HostClassKeys extends `${TagName}-${string}`, CssVarKeys extends `${TagName}-${string}`, RenderOutput extends any>(inputs: import("element-vir").DeclarativeElementInit<TagName, InputsGeneric, StateInit, EventsInit, HostClassKeys, CssVarKeys, RenderOutput>) => import("element-vir").DeclarativeElementDefinition<TagName, InputsGeneric, StateInit, EventsInit, HostClassKeys, CssVarKeys, RenderOutput>, defineElementBookElementNoInputs: <TagName_1 extends `element-book-${string}`, Inputs extends {}, StateInit_1 extends {}, EventsInit_1 extends {}, HostClassKeys_1 extends `${TagName_1}-${string}`, CssVarKeys_1 extends `${TagName_1}-${string}`, RenderOutput_1 extends any>(inputs: import("element-vir").DeclarativeElementInit<TagName_1, Inputs, StateInit_1, EventsInit_1, HostClassKeys_1, CssVarKeys_1, RenderOutput_1>) => import("element-vir").DeclarativeElementDefinition<TagName_1, Inputs, StateInit_1, EventsInit_1, HostClassKeys_1, CssVarKeys_1, RenderOutput_1>;
+export type BookTagName = `book-${string}`;
+export declare const defineBookElement: <InputsGeneric extends {}>() => <TagName extends `book-${string}`, StateInit extends {}, EventsInit extends {}, HostClassKeys extends `${TagName}-${string}`, CssVarKeys extends `${TagName}-${string}`, RenderOutput extends any>(inputs: import("element-vir").DeclarativeElementInit<TagName, InputsGeneric, StateInit, EventsInit, HostClassKeys, CssVarKeys, RenderOutput>) => import("element-vir").DeclarativeElementDefinition<TagName, InputsGeneric, StateInit, EventsInit, HostClassKeys, CssVarKeys, RenderOutput>, defineBookElementNoInputs: <TagName_1 extends `book-${string}`, Inputs extends {}, StateInit_1 extends {}, EventsInit_1 extends {}, HostClassKeys_1 extends `${TagName_1}-${string}`, CssVarKeys_1 extends `${TagName_1}-${string}`, RenderOutput_1 extends any>(inputs: import("element-vir").DeclarativeElementInit<TagName_1, Inputs, StateInit_1, EventsInit_1, HostClassKeys_1, CssVarKeys_1, RenderOutput_1>) => import("element-vir").DeclarativeElementDefinition<TagName_1, Inputs, StateInit_1, EventsInit_1, HostClassKeys_1, CssVarKeys_1, RenderOutput_1>;

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

@@ -1,2 +1,2 @@
 import { wrapDefineElement } from 'element-vir';
-export const { defineElement: defineElementBookElement, defineElementNoInputs: defineElementBookElementNoInputs, } = wrapDefineElement();
+export const { defineElement: defineBookElement, defineElementNoInputs: defineBookElementNoInputs } = wrapDefineElement();

package/dist/ui/elements/element-book-app/element-book-app-slots.d.ts

@@ -1,4 +1,4 @@
 export declare enum ElementBookSlotName {
-    Footer = "element-book-footer",
-    NavHeader = "element-book-nav-header"
+    Footer = "book-footer",
+    NavHeader = "book-nav-header"
 }

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

@@ -1,5 +1,5 @@
 export var ElementBookSlotName;
 (function (ElementBookSlotName) {
-    ElementBookSlotName["Footer"] = "element-book-footer";
-    ElementBookSlotName["NavHeader"] = "element-book-nav-header";
+    ElementBookSlotName["Footer"] = "book-footer";
+    ElementBookSlotName["NavHeader"] = "book-nav-header";
 })(ElementBookSlotName || (ElementBookSlotName = {}));

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

@@ -1,3 +1,4 @@
+import { CurrentControls } from '../../../data/book-entry/book-page/current-controls';
 import { ColorTheme } from '../../color-theme/color-theme';
 import { ThemeConfig } from '../../color-theme/create-color-theme';
 import { ElementBookConfig } from './element-book-config';
@@ -6,9 +7,13 @@ type ColorThemeState = {
     theme: ColorTheme;
 };
 export declare const ElementBookApp: import("element-vir").DeclarativeElementDefinition<"element-book-app", ElementBookConfig, {
-    currentRoute: Readonly<Required<Readonly<import("spa-router-vir").FullRoute<import("../../../routing/element-book-routing").ValidElementBookPaths, Record<string, string> | undefined, undefined>>>>;
-    router: Readonly<import("spa-router-vir").SpaRouter<import("../../../routing/element-book-routing").ValidElementBookPaths, Record<string, string> | undefined, undefined>> | undefined;
+    currentRoute: Readonly<Required<Readonly<import("spa-router-vir").FullRoute<import("../../../routing/book-routing").ValidBookPaths, Record<string, string> | undefined, undefined>>>>;
+    router: Readonly<import("spa-router-vir").SpaRouter<import("../../../routing/book-routing").ValidBookPaths, Record<string, string> | undefined, undefined>> | undefined;
     colors: ColorThemeState;
+    treeBasedCurrentControls: {
+        trigger: ElementBookConfig['entries'];
+        currentControls: CurrentControls;
+    } | undefined;
 }, {
     pathUpdate: import("element-vir").DefinedTypedEventNameDefinition<readonly string[]>;
 }, "element-book-app-", "element-book-app-", import("lit-html").HTMLTemplateResult>;