@supersoniks/concorde 5.1.1 → 5.1.3

package/src/docs/search/markdown-renderer.ts

@@ -16,12 +16,34 @@ export class DocsMakdownRenderer extends Subscriber(LitElement) {
     marked.use(gfmHeadingId());
     this.noShadowDom = "";
     super.connectedCallback();
+    this.addEventListener("click", this.onDocLinkClick);
   }
+
+  disconnectedCallback() {
+    this.removeEventListener("click", this.onDocLinkClick);
+    super.disconnectedCallback();
+  }
+
+  /** Markdown `[…](/docs/…)` links use plain `<a>` — pushState so the SPA does not full-reload. */
+  private onDocLinkClick = (e: Event) => {
+    const a = (e.target as Element | null)?.closest?.("a");
+    if (!a || a.target === "_blank" || a.hasAttribute("download")) return;
+    const href = a.getAttribute("href");
+    if (!href || href.startsWith("http") || href.startsWith("mailto:")) return;
+    if (!(href.startsWith("/docs/") || href.startsWith("/core/"))) return;
+    e.preventDefault();
+    history.pushState(null, "", href);
+  };
   @property() anchor = "";
   private _text = "";
   set text(value: string) {
     this._text = parseMarkdownWithSonicCode(
-      (markdown) => marked.parse(markdown) as string,
+      // Tables scroll in a wrapper, so they keep their full width on phones
+      (markdown) =>
+        (marked.parse(markdown) as string).replace(
+          /<table>[\s\S]*?<\/table>/g,
+          (table) => `<div class="docs-table-scroll">${table}</div>`,
+        ),
       value,
     );
     this.requestUpdate();
@@ -45,16 +67,17 @@ export class DocsMakdownRenderer extends Subscriber(LitElement) {
   appendImport() {
     if (this.querySelector("h1 + sonic-code")) return;
 
-    const locationHash = document.location.hash;
-    // Only real component pages (core/components/…), not any URL mentioning "components"
-    const isComponent = parseDocsLocation(locationHash).url.startsWith(
-      "core/components/",
+    const { url } = parseDocsLocation(
+      document.location.pathname + document.location.search + document.location.hash,
     );
+    // Only real component pages (core/components/…), not any URL mentioning "components"
+    const isComponent = url.startsWith("core/components/");
 
     if (isComponent) {
-      const split = locationHash.split("/");
-      const componentName = split.filter((name) => name.endsWith(".md")).pop();
-      const extractComponentName = componentName?.replace(".md", "");
+      const extractComponentName = url
+        .split("/")
+        .pop()
+        ?.replace(/\.mdx?$/, "");
 
       const markup = `<sonic-code language="javascript" class="mb-8"
       ><template> import '@supersoniks/concorde/${extractComponentName}'; </template>

package/src/docs/search/page.ts

@@ -8,12 +8,15 @@ const tagName = "docs-page"; // For Astro.build
 @customElement(tagName)
 export class DocsPage extends Subscriber(LitElement) {
   connectedCallback() {
-    this.setAttribute(
-      "serviceURL",
-      document.location.pathname.replace(/\/index.html$/, "")
-    );
-    this.markDownsURL = this.getAncestorAttributeValue("markDownsURL");
-    if (this.markDownsURL.lastIndexOf("/") != this.markDownsURL.length - 1) {
+    // Markdown is at the public pathname + `.md` (e.g. `/docs/…/start.md`).
+    // Fetch from site root via API serviceURL = origin; never relative to the
+    // current pushState path.
+    this.setAttribute("serviceURL", "");
+    this.markDownsURL = this.getAncestorAttributeValue("markDownsURL") || "";
+    if (
+      this.markDownsURL &&
+      this.markDownsURL.lastIndexOf("/") != this.markDownsURL.length - 1
+    ) {
       this.markDownsURL += "/";
     }
     super.connectedCallback();

package/src/docs/search/search.ts

@@ -1,95 +1,151 @@
-import { html, LitElement, nothing } from "lit";
+import { css, html, LitElement, nothing } from "lit";
 import { customElement, state, property } from "lit/decorators.js";
 import { PublisherManager } from "@supersoniks/concorde/utils";
 import { tailwind } from "../tailwind";
 import search from "./docs-search.json";
 import "@supersoniks/concorde/core/components/ui/divider/divider";
 import "@supersoniks/concorde/core/components/ui/icon/icon";
-import "@supersoniks/concorde/core/components/ui/menu/menu";
+import "@supersoniks/concorde/core/components/ui/menu/menu-item";
 import "@supersoniks/concorde/core/components/ui/pop/pop";
 import { customScroll } from "@supersoniks/concorde/core/components/ui/_css/scroll";
+import { unsafeHTML } from "lit/directives/unsafe-html.js";
 
 import { FormElementInterface } from "@supersoniks/concorde/core/mixins/FormElement";
 import { Pop } from "@supersoniks/concorde/core/components/ui/pop/pop";
+import { docsPagePath } from "../docs-location";
+
+type SearchItem = { href: string; part: string; search: string; index: number };
+type SearchGroup = { title: string; href: string | null; items: SearchItem[] };
+
+/** Max sections listed under each page, and characters shown around a match. */
+const MAX_ITEMS_PER_PAGE = 3;
+const SNIPPET_RADIUS = 60;
 
 const tagName = "docs-search"; // For Astro.build
 const win: any = window;
 const fuzzysort = win.fuzzysort;
 @customElement(tagName)
 export class DocsSearch extends LitElement {
-  static styles = [tailwind, customScroll];
+  static styles = [
+    tailwind,
+    customScroll,
+    css`
+      .snippet mark {
+        background: none;
+        color: var(--sc-info);
+        font-weight: 600;
+      }
+    `,
+  ];
   @state({ type: Boolean }) hidePopMenu = false;
+  @state() results: SearchGroup[] = [];
+  @state() query = "";
   @property({ type: Boolean }) setFocus = false;
   search(val) {
-    // if (!val || val.length < 3) {
-    //   this.hidePopMenu = true;
-    //   return null;
-    // } else this.hidePopMenu = false;
-    PublisherManager.get("searchSelection").selection = null;
-    const searchResult = fuzzysort.go(val, search, { key: "search" });
-    const resultForList: Array<any> = [];
-    const titlesToContent: Map<string, any> = new Map();
+    this.query = (val ?? "").toString();
+    if (!this.query.trim()) {
+      this.results = [];
+      (this.shadowRoot?.querySelector("sonic-pop") as Pop)?.show();
+      return;
+    }
+    const searchResult = fuzzysort.go(this.query, search, {
+      key: "search",
+      limit: 60,
+    });
+    const groups: Map<string, SearchGroup> = new Map();
+    const found = new Set<string>();
 
-    const found: Array<string> = [];
     for (const result of searchResult) {
       if (result.score < -100000) continue;
-
       const obj = result.obj;
-
       for (const file in obj.files) {
         for (const part in obj.files[file].hashes) {
+          if (found.has(file + ":" + part)) continue;
+          found.add(file + ":" + part);
           const hash = obj.files[file].hashes[part];
-          if (found.includes(file + ":" + part)) continue;
-          found.push(file + ":" + part);
           const title = obj.files[file].title;
-          const subItem = {
-            href: "#" + file + "/" + part,
-            part: hash.title || "...",
-            search:
-              hash.type == "page" ? "Page" : this.getResultSearchString(result),
-            index: search.indexOf(obj),
-            template: hash.type == "page" ? "page" : null,
-          };
-          if (!titlesToContent.has(title)) {
-            const item: any = {
-              title: title,
-              items: [subItem],
-            };
-            titlesToContent.set(title, item);
-            resultForList.push(item);
-          } else {
-            const item = titlesToContent.get(title);
-            item.items.push(subItem);
+          // file is e.g. docs/getting-started/start.md — public pathname routes
+          const publicPath = docsPagePath(file);
+          const baseName = publicPath.split("/").pop() || "";
+          const href =
+            hash.type === "page" || part === baseName
+              ? publicPath
+              : `${publicPath}#${part}`;
+          let group = groups.get(title);
+          if (!group) {
+            group = { title, href: null, items: [] };
+            groups.set(title, group);
+          }
+          if (hash.type == "page") {
+            group.href = href;
+            continue;
           }
+          group.items.push({
+            href,
+            part: hash.title || title,
+            search: this.getResultSearchString(result),
+            index: search.indexOf(obj),
+          });
         }
       }
     }
-    (this.shadowRoot?.querySelector("sonic-pop") as Pop)?.show();
-    // this.hidePopMenu = resultForList.length == 0;
-    for (const item of resultForList) {
-      item.items.sort((a, b) => a.index - b.index);
+    for (const group of groups.values()) {
+      group.items.sort((a, b) => a.index - b.index);
+      group.items = group.items.slice(0, MAX_ITEMS_PER_PAGE);
+      group.href ??= group.items[0]?.href ?? null;
     }
-    PublisherManager.get("searchResult").set(resultForList);
+    this.results = [...groups.values()];
+    (this.shadowRoot?.querySelector("sonic-pop") as Pop)?.show();
   }
+
+  /**
+   * Close the header search overlay after choosing a result.
+   * Capture phase: menu-item pushState calls stopPropagation on bubble.
+   * pushState itself does not fire popstate, so the header cannot rely on that.
+   */
+  private closeAfterNavigate = (e: Event) => {
+    const item = e.composedPath().find((n): n is HTMLElement => {
+      if (!(n instanceof HTMLElement) || n.tagName !== "SONIC-MENU-ITEM") {
+        return false;
+      }
+      const href = (n as HTMLElement & { href?: string }).href;
+      return Boolean(href || n.getAttribute("href"));
+    });
+    if (!item) return;
+    (this.shadowRoot?.querySelector("sonic-pop") as Pop | null)?.hide();
+    this.dispatchEvent(
+      new CustomEvent("docs-search-close", { bubbles: true, composed: true }),
+    );
+  };
+  /** Text around the first match, matched characters highlighted. */
   getResultSearchString(result: any) {
-    const p = result.p;
-    const str = result.target
-      .split("")
-      .map((value, index) =>
-        p.includes(index)
-          ? "<span class='font-bold' style='color:var(--sc-info)'>" +
-            value +
-            "</span>"
-          : value,
-      )
-      .join("");
-    return str;
+    const p: number[] = Array.from(
+      fuzzysort.indexes?.(result) ?? result.indexes ?? result.p ?? [],
+    );
+    const target: string = result.target.replace(/\s/g, " ");
+    const first = p.length ? Math.min(...p) : 0;
+    const from = Math.max(0, first - SNIPPET_RADIUS);
+    const to = Math.min(target.length, first + SNIPPET_RADIUS * 2);
+    // The index already holds HTML entities: only escape raw tags.
+    const escape = (c: string) => (c === "<" ? "&lt;" : c === ">" ? "&gt;" : c);
+    let str = "";
+    for (let i = from; i < to; i++) {
+      const c = escape(target[i]);
+      str += p.includes(i) ? `<mark>${c}</mark>` : c;
+    }
+    return (from > 0 ? "…" : "") + str + (to < target.length ? "…" : "");
   }
   connectedCallback() {
     PublisherManager.get("docsSearch").search.onAssign((v) => this.search(v));
+    this.addEventListener("click", this.closeAfterNavigate, true);
     super.connectedCallback();
   }
 
+  disconnectedCallback() {
+    this.removeEventListener("click", this.closeAfterNavigate, true);
+    super.disconnectedCallback();
+  }
+
   firstUpdated() {
     if (this.setFocus) {
       setTimeout(() => {
@@ -125,81 +181,57 @@ export class DocsSearch extends LitElement {
         ${this.hidePopMenu
           ? nothing
           : html`
-              <sonic-menu
+              <div
                 slot="content"
-                class="max-w-[30rem] lg:max-w-[35rem] max-h-[50svh] overflow-auto  custom-scroll !left-0 !top-0 !relative"
+                class="w-[30rem] lg:w-[35rem] max-w-[calc(100vw-2rem)] max-h-[60svh] overflow-auto custom-scroll py-2"
               >
-                <sonic-list displayContents dataProvider="searchResult">
-                  <template>
-                    <div class="my-4">
-                      <div class="ml-3 mr-3 mb-1">
-                        <sonic-value
-                          key="title"
-                          class="font-bold text-lg "
-                        ></sonic-value>
-                      </div>
-                      <sonic-list subDataProvider="items">
-                        <template data-value="page">
-                          <sonic-menu-item
-                            formDataProvider="searchSelection"
-                            data-keyboard-nav="search-results doc-search"
-                            class="mt-1"
-                          >
-                            <sonic-icon
-                              slot="prefix"
-                              size="lg"
-                              library="heroicons"
-                              name="book-open"
-                            ></sonic-icon>
-                            <div>
-                              <sonic-value
-                                key="search"
-                                class="block font-medium "
-                              ></sonic-value>
-                            </div>
-                            <sonic-icon
-                              slot="suffix"
-                              size="lg"
-                              library="heroicons"
-                              name="chevron-right"
-                              class="opacity-40"
-                            ></sonic-icon>
-                          </sonic-menu-item>
-                        </template>
-                        <template>
-                          <sonic-menu-item
-                            formDataProvider="searchSelection"
-                            data-keyboard-nav="search-results doc-search"
-                            class="mt-1"
-                          >
-                            <div>
-                              <sonic-badge size="xs" ellipsis class="mb-1">
-                                <sonic-value
-                                  key="part"
-                                  class="block "
-                                ></sonic-value>
-                              </sonic-badge>
-                              <sonic-value
-                                key="search"
-                                class="block text-sm  font-normal pl-[.75rem]"
-                              ></sonic-value>
-                            </div>
-                            <sonic-icon
-                              slot="suffix"
-                              size="lg"
-                              library="heroicons"
-                              name="chevron-right"
-                              class="opacity-40"
-                            ></sonic-icon>
-                          </sonic-menu-item>
-                        </template>
-                      </sonic-list>
-                    </div>
-                  </template>
-                </sonic-list>
-              </sonic-menu>
+                ${this.results.length
+                  ? this.results.map((group) => this.renderGroup(group))
+                  : this.query.trim()
+                    ? html`<p class="px-3 py-2 text-sm text-neutral-500">
+                        No results
+                      </p>`
+                    : html`<p class="px-3 py-2 text-sm text-neutral-500">
+                        Type to search the documentation.
+                      </p>`}
+              </div>
             `}
       </sonic-pop>
     `;
   }
+
+  renderGroup(group: SearchGroup) {
+    return html`
+      <section class="py-1">
+        <sonic-menu-item
+          pushState
+          href=${group.href ?? nothing}
+          data-keyboard-nav="search-results doc-search"
+          size="sm"
+          class="w-full font-semibold"
+          ><span class="font-semibold">${group.title}</span></sonic-menu-item
+        >
+        ${group.items.map(
+          (item) => html`
+            <sonic-menu-item
+              pushState
+              href=${item.href}
+              data-keyboard-nav="search-results doc-search"
+              size="sm"
+              class="w-full"
+            >
+              <span class="block min-w-0 pl-3 text-left font-normal">
+                <span class="block truncate text-xs text-neutral-500"
+                  >${item.part}</span
+                >
+                <span class="snippet block text-sm line-clamp-2"
+                  >${unsafeHTML(item.search)}</span
+                >
+              </span>
+            </sonic-menu-item>
+          `,
+        )}
+      </section>
+    `;
+  }
 }

package/src/docs/tailwind/css/docs/content.css

@@ -19,14 +19,13 @@ docs-markdown-renderer :is(h1, h2, h3, h4)[id] {
 docs-page.prose :where(img) {
   max-width: 100%;
 }
+/* Markdown tables keep 100% width; the wrapper scrolls when columns overflow */
+docs-page .docs-table-scroll {
+  overflow-x: auto;
+}
 /* Wide demos (fixed min-width groups…) scroll instead of widening the page on phones */
 @media (max-width: 639px) {
   docs-page sonic-code > div {
     overflow-x: auto;
   }
-  /* tables stay 100% wide on larger screens; on phones they scroll */
-  docs-page.prose :where(table) {
-    display: block;
-    overflow-x: auto;
-  }
 }

package/src/tsconfig.json

@@ -1074,6 +1074,9 @@
       "./utils/HTML": [
         "/sites/concorde/src/core/utils/HTML.ts"
       ],
+      "./utils/LocationHandler.spec": [
+        "/sites/concorde/src/core/utils/LocationHandler.spec.ts"
+      ],
       "./utils/LocationHandler": [
         "/sites/concorde/src/core/utils/LocationHandler.ts"
       ],
@@ -1185,6 +1188,9 @@
       "./undefined/docs-source-raw": [
         "/sites/concorde/src/docs/components/docs-source-raw.ts"
       ],
+      "./docs-location.spec": [
+        "/sites/concorde/src/docs/docs-location.spec.ts"
+      ],
       "./docs-location": [
         "/sites/concorde/src/docs/docs-location.ts"
       ],
@@ -1215,11 +1221,8 @@
       "./example/docs-boarding-pass-demo": [
         "/sites/concorde/src/docs/example/docs-boarding-pass-demo.ts"
       ],
-      "./example/docs-input-autocomplete-demos": [
-        "/sites/concorde/src/docs/example/docs-input-autocomplete-demos.ts"
-      ],
-      "./example/docs-joke-demos": [
-        "/sites/concorde/src/docs/example/docs-joke-demos.ts"
+      "./example/docs-flight-demos": [
+        "/sites/concorde/src/docs/example/docs-flight-demos.ts"
       ],
       "./example/docs-jsonata-demos": [
         "/sites/concorde/src/docs/example/docs-jsonata-demos.ts"
@@ -1275,6 +1278,9 @@
       "./mock-api/fixtures": [
         "/sites/concorde/src/docs/mock-api/fixtures.ts"
       ],
+      "./mock-api/flights": [
+        "/sites/concorde/src/docs/mock-api/flights.ts"
+      ],
       "./mock-api/register": [
         "/sites/concorde/src/docs/mock-api/register.ts"
       ],

package/src/tsconfig.tsbuildinfo

@@ -1 +1 @@
-{"root":["./components.ts","./concorde-loaded.ts","./dataprovider.ts","./decorators.ts","./directives.ts","./index.ts","./mixins.ts","./utils.ts","./core/core.ts","./core/_types/endpoint.ts","./core/_types/key.ts","./core/_types/types.ts","./core/components/functional/functional.ts","./core/components/functional/date/date.ts","./core/components/functional/example/example.ts","./core/components/functional/fetch/fetch.ts","./core/components/functional/if/if.test.ts","./core/components/functional/if/if.ts","./core/components/functional/jsonata/jsonata.spec.ts","./core/components/functional/jsonata/jsonata.ts","./core/components/functional/list/list.demo.ts","./core/components/functional/list/list.spec.ts","./core/components/functional/list/list.ts","./core/components/functional/mix/mix.ts","./core/components/functional/queue/queue.demo.ts","./core/components/functional/queue/queue.ts","./core/components/functional/router/redirect.ts","./core/components/functional/router/router.demo.ts","./core/components/functional/router/router.spec.ts","./core/components/functional/router/router.ts","./core/components/functional/sdui/SDUIDescriptorTransformer.ts","./core/components/functional/sdui/component-catalog.spec.ts","./core/components/functional/sdui/sdui-action.spec.ts","./core/components/functional/sdui/sdui-dom-snapshot.ts","./core/components/functional/sdui/sdui-incremental.spec.ts","./core/components/functional/sdui/sdui-partial.spec.ts","./core/components/functional/sdui/sdui-partial.ts","./core/components/functional/sdui/sdui-safe.spec.ts","./core/components/functional/sdui/sdui-safe.ts","./core/components/functional/sdui/sdui-utils.ts","./core/components/functional/sdui/sdui.regression.spec.ts","./core/components/functional/sdui/sdui.ts","./core/components/functional/sdui/types.ts","./core/components/functional/sdui/__fixtures__/descriptors.ts","./core/components/functional/sonic-scope/sonic-scope.ts","./core/components/functional/states/states.demo.ts","./core/components/functional/states/states.spec.ts","./core/components/functional/states/states.ts","./core/components/functional/submit/submit.ts","./core/components/functional/subscriber/subscriber.ts","./core/components/functional/translation/translation.ts","./core/components/functional/value/value.ts","./core/components/ui/ui.ts","./core/components/ui/_css/align.ts","./core/components/ui/_css/rounded.ts","./core/components/ui/_css/scroll.ts","./core/components/ui/_css/shadow.ts","./core/components/ui/_css/size.ts","./core/components/ui/_css/type.ts","./core/components/ui/_i18n/ui-aria-labels.ts","./core/components/ui/alert/alert.spec.ts","./core/components/ui/alert/alert.ts","./core/components/ui/alert-messages/alert-messages.ts","./core/components/ui/badge/badge.ts","./core/components/ui/button/button.ts","./core/components/ui/captcha/altchaStyles.ts","./core/components/ui/captcha/captcha.ts","./core/components/ui/card/card-footer.ts","./core/components/ui/card/card-header-descripton.ts","./core/components/ui/card/card-header.ts","./core/components/ui/card/card-main.ts","./core/components/ui/card/card.ts","./core/components/ui/divider/divider.ts","./core/components/ui/form/checkbox/checkbox.ts","./core/components/ui/form/css/form-control.ts","./core/components/ui/form/fieldset/fieldset.ts","./core/components/ui/form/fieldset/legend-description.ts","./core/components/ui/form/fieldset/legend.ts","./core/components/ui/form/form-actions/form-actions.ts","./core/components/ui/form/form-layout/form-layout.ts","./core/components/ui/form/input/input.ts","./core/components/ui/form/input/password-helper.ts","./core/components/ui/form/input/same-value-helper.ts","./core/components/ui/form/input-autocomplete/input-autocomplete.ts","./core/components/ui/form/radio/radio.ts","./core/components/ui/form/select/select.ts","./core/components/ui/form/switch/switch.ts","./core/components/ui/form/textarea/textarea.ts","./core/components/ui/group/group.ts","./core/components/ui/icon/icon.stories.ts","./core/components/ui/icon/icon.ts","./core/components/ui/icon/icons.ts","./core/components/ui/image/image.ts","./core/components/ui/link/link.ts","./core/components/ui/loader/loader.stories.ts","./core/components/ui/loader/loader.ts","./core/components/ui/loader/styles/fixed.ts","./core/components/ui/loader/styles/inline.ts","./core/components/ui/menu/menu-item.ts","./core/components/ui/menu/menu.ts","./core/components/ui/modal/modal-actions.ts","./core/components/ui/modal/modal-close.ts","./core/components/ui/modal/modal-content.ts","./core/components/ui/modal/modal-subtitle.ts","./core/components/ui/modal/modal-title.ts","./core/components/ui/modal/modal-utils.ts","./core/components/ui/modal/modal.ts","./core/components/ui/pop/pop.ts","./core/components/ui/progress/progress.ts","./core/components/ui/table/table-caption.ts","./core/components/ui/table/table-tbody.ts","./core/components/ui/table/table-td.ts","./core/components/ui/table/table-tfoot.ts","./core/components/ui/table/table-th.ts","./core/components/ui/table/table-thead.ts","./core/components/ui/table/table-tr.ts","./core/components/ui/table/table.ts","./core/components/ui/theme/theme.ts","./core/components/ui/theme/theme-collection/auto.ts","./core/components/ui/theme/theme-collection/core-variables.ts","./core/components/ui/theme/theme-collection/dark.ts","./core/components/ui/theme/theme-collection/light.ts","./core/components/ui/toast/dismissed.ts","./core/components/ui/toast/message-subscriber.ts","./core/components/ui/toast/render-content.ts","./core/components/ui/toast/toast-item.ts","./core/components/ui/toast/toast.ts","./core/components/ui/toast/types.ts","./core/components/ui/tooltip/tooltip.ts","./core/decorators/Subscriber.ts","./core/decorators/api.post.spec.ts","./core/decorators/api.spec.ts","./core/decorators/api.ts","./core/decorators/lifecycle.ts","./core/decorators/subscriber/ancestorAttribute.spec.ts","./core/decorators/subscriber/ancestorAttribute.ts","./core/decorators/subscriber/autoFill.ts","./core/decorators/subscriber/autoSubscribe.ts","./core/decorators/subscriber/bind.ts","./core/decorators/subscriber/common.ts","./core/decorators/subscriber/derive.ts","./core/decorators/subscriber/dynamicPath.spec.ts","./core/decorators/subscriber/dynamicPath.ts","./core/decorators/subscriber/dynamicPropertyWatch.spec.ts","./core/decorators/subscriber/dynamicPropertyWatch.ts","./core/decorators/subscriber/handle.disambig.spec.ts","./core/decorators/subscriber/handle.skip.spec.ts","./core/decorators/subscriber/handle.ts","./core/decorators/subscriber/onAssign.ts","./core/decorators/subscriber/publish.spec.ts","./core/decorators/subscriber/publish.ts","./core/decorators/subscriber/publisherPath.ts","./core/decorators/subscriber/subscribe.spec.ts","./core/decorators/subscriber/subscribe.ts","./core/directives/DataProvider.sub.spec.ts","./core/directives/DataProvider.ts","./core/directives/Wording.ts","./core/mixins/Fetcher.ts","./core/mixins/FormCheckable.ts","./core/mixins/FormElement.ts","./core/mixins/FormInput.ts","./core/mixins/Subscriber.ts","./core/mixins/TemplatesContainer.ts","./core/mixins/mixins.ts","./core/utils/AncestorAttributeObserver.ts","./core/utils/Arrays.ts","./core/utils/DataBindObserver.ts","./core/utils/Electron.ts","./core/utils/Format.ts","./core/utils/HTML.ts","./core/utils/LocationHandler.ts","./core/utils/Objects.ts","./core/utils/PublisherProxy.ts","./core/utils/SafariScrollGuard.ts","./core/utils/Utils.ts","./core/utils/aesCrypto.ts","./core/utils/api.spec.ts","./core/utils/api.ts","./core/utils/dataProviderKey.spec.ts","./core/utils/dataProviderKey.ts","./core/utils/derive.spec.ts","./core/utils/derive.ts","./core/utils/dismissed.ts","./core/utils/dpOptions.spec.ts","./core/utils/endpoint.spec.ts","./core/utils/endpoint.ts","./core/utils/jsonataHelpers.ts","./core/utils/jsonataRuntime.ts","./core/utils/positioning.spec.ts","./core/utils/positioning.ts","./core/utils/publisherPathKey.spec.ts","./core/utils/route.spec.ts","./core/utils/route.ts","./core/utils/url-pattern.ts","./test-utils/TestUtils.ts"],"version":"5.9.2"}
+{"root":["./components.ts","./concorde-loaded.ts","./dataprovider.ts","./decorators.ts","./directives.ts","./index.ts","./mixins.ts","./utils.ts","./core/core.ts","./core/_types/endpoint.ts","./core/_types/key.ts","./core/_types/types.ts","./core/components/functional/functional.ts","./core/components/functional/date/date.ts","./core/components/functional/example/example.ts","./core/components/functional/fetch/fetch.ts","./core/components/functional/if/if.test.ts","./core/components/functional/if/if.ts","./core/components/functional/jsonata/jsonata.spec.ts","./core/components/functional/jsonata/jsonata.ts","./core/components/functional/list/list.demo.ts","./core/components/functional/list/list.spec.ts","./core/components/functional/list/list.ts","./core/components/functional/mix/mix.ts","./core/components/functional/queue/queue.demo.ts","./core/components/functional/queue/queue.ts","./core/components/functional/router/redirect.ts","./core/components/functional/router/router.demo.ts","./core/components/functional/router/router.spec.ts","./core/components/functional/router/router.ts","./core/components/functional/sdui/SDUIDescriptorTransformer.ts","./core/components/functional/sdui/component-catalog.spec.ts","./core/components/functional/sdui/sdui-action.spec.ts","./core/components/functional/sdui/sdui-dom-snapshot.ts","./core/components/functional/sdui/sdui-incremental.spec.ts","./core/components/functional/sdui/sdui-partial.spec.ts","./core/components/functional/sdui/sdui-partial.ts","./core/components/functional/sdui/sdui-safe.spec.ts","./core/components/functional/sdui/sdui-safe.ts","./core/components/functional/sdui/sdui-utils.ts","./core/components/functional/sdui/sdui.regression.spec.ts","./core/components/functional/sdui/sdui.ts","./core/components/functional/sdui/types.ts","./core/components/functional/sdui/__fixtures__/descriptors.ts","./core/components/functional/sonic-scope/sonic-scope.ts","./core/components/functional/states/states.demo.ts","./core/components/functional/states/states.spec.ts","./core/components/functional/states/states.ts","./core/components/functional/submit/submit.ts","./core/components/functional/subscriber/subscriber.ts","./core/components/functional/translation/translation.ts","./core/components/functional/value/value.ts","./core/components/ui/ui.ts","./core/components/ui/_css/align.ts","./core/components/ui/_css/rounded.ts","./core/components/ui/_css/scroll.ts","./core/components/ui/_css/shadow.ts","./core/components/ui/_css/size.ts","./core/components/ui/_css/type.ts","./core/components/ui/_i18n/ui-aria-labels.ts","./core/components/ui/alert/alert.spec.ts","./core/components/ui/alert/alert.ts","./core/components/ui/alert-messages/alert-messages.ts","./core/components/ui/badge/badge.ts","./core/components/ui/button/button.ts","./core/components/ui/captcha/altchaStyles.ts","./core/components/ui/captcha/captcha.ts","./core/components/ui/card/card-footer.ts","./core/components/ui/card/card-header-descripton.ts","./core/components/ui/card/card-header.ts","./core/components/ui/card/card-main.ts","./core/components/ui/card/card.ts","./core/components/ui/divider/divider.ts","./core/components/ui/form/checkbox/checkbox.ts","./core/components/ui/form/css/form-control.ts","./core/components/ui/form/fieldset/fieldset.ts","./core/components/ui/form/fieldset/legend-description.ts","./core/components/ui/form/fieldset/legend.ts","./core/components/ui/form/form-actions/form-actions.ts","./core/components/ui/form/form-layout/form-layout.ts","./core/components/ui/form/input/input.ts","./core/components/ui/form/input/password-helper.ts","./core/components/ui/form/input/same-value-helper.ts","./core/components/ui/form/input-autocomplete/input-autocomplete.ts","./core/components/ui/form/radio/radio.ts","./core/components/ui/form/select/select.ts","./core/components/ui/form/switch/switch.ts","./core/components/ui/form/textarea/textarea.ts","./core/components/ui/group/group.ts","./core/components/ui/icon/icon.stories.ts","./core/components/ui/icon/icon.ts","./core/components/ui/icon/icons.ts","./core/components/ui/image/image.ts","./core/components/ui/link/link.ts","./core/components/ui/loader/loader.stories.ts","./core/components/ui/loader/loader.ts","./core/components/ui/loader/styles/fixed.ts","./core/components/ui/loader/styles/inline.ts","./core/components/ui/menu/menu-item.ts","./core/components/ui/menu/menu.ts","./core/components/ui/modal/modal-actions.ts","./core/components/ui/modal/modal-close.ts","./core/components/ui/modal/modal-content.ts","./core/components/ui/modal/modal-subtitle.ts","./core/components/ui/modal/modal-title.ts","./core/components/ui/modal/modal-utils.ts","./core/components/ui/modal/modal.ts","./core/components/ui/pop/pop.ts","./core/components/ui/progress/progress.ts","./core/components/ui/table/table-caption.ts","./core/components/ui/table/table-tbody.ts","./core/components/ui/table/table-td.ts","./core/components/ui/table/table-tfoot.ts","./core/components/ui/table/table-th.ts","./core/components/ui/table/table-thead.ts","./core/components/ui/table/table-tr.ts","./core/components/ui/table/table.ts","./core/components/ui/theme/theme.ts","./core/components/ui/theme/theme-collection/auto.ts","./core/components/ui/theme/theme-collection/core-variables.ts","./core/components/ui/theme/theme-collection/dark.ts","./core/components/ui/theme/theme-collection/light.ts","./core/components/ui/toast/dismissed.ts","./core/components/ui/toast/message-subscriber.ts","./core/components/ui/toast/render-content.ts","./core/components/ui/toast/toast-item.ts","./core/components/ui/toast/toast.ts","./core/components/ui/toast/types.ts","./core/components/ui/tooltip/tooltip.ts","./core/decorators/Subscriber.ts","./core/decorators/api.post.spec.ts","./core/decorators/api.spec.ts","./core/decorators/api.ts","./core/decorators/lifecycle.ts","./core/decorators/subscriber/ancestorAttribute.spec.ts","./core/decorators/subscriber/ancestorAttribute.ts","./core/decorators/subscriber/autoFill.ts","./core/decorators/subscriber/autoSubscribe.ts","./core/decorators/subscriber/bind.ts","./core/decorators/subscriber/common.ts","./core/decorators/subscriber/derive.ts","./core/decorators/subscriber/dynamicPath.spec.ts","./core/decorators/subscriber/dynamicPath.ts","./core/decorators/subscriber/dynamicPropertyWatch.spec.ts","./core/decorators/subscriber/dynamicPropertyWatch.ts","./core/decorators/subscriber/handle.disambig.spec.ts","./core/decorators/subscriber/handle.skip.spec.ts","./core/decorators/subscriber/handle.ts","./core/decorators/subscriber/onAssign.ts","./core/decorators/subscriber/publish.spec.ts","./core/decorators/subscriber/publish.ts","./core/decorators/subscriber/publisherPath.ts","./core/decorators/subscriber/subscribe.spec.ts","./core/decorators/subscriber/subscribe.ts","./core/directives/DataProvider.sub.spec.ts","./core/directives/DataProvider.ts","./core/directives/Wording.ts","./core/mixins/Fetcher.ts","./core/mixins/FormCheckable.ts","./core/mixins/FormElement.ts","./core/mixins/FormInput.ts","./core/mixins/Subscriber.ts","./core/mixins/TemplatesContainer.ts","./core/mixins/mixins.ts","./core/utils/AncestorAttributeObserver.ts","./core/utils/Arrays.ts","./core/utils/DataBindObserver.ts","./core/utils/Electron.ts","./core/utils/Format.ts","./core/utils/HTML.ts","./core/utils/LocationHandler.spec.ts","./core/utils/LocationHandler.ts","./core/utils/Objects.ts","./core/utils/PublisherProxy.ts","./core/utils/SafariScrollGuard.ts","./core/utils/Utils.ts","./core/utils/aesCrypto.ts","./core/utils/api.spec.ts","./core/utils/api.ts","./core/utils/dataProviderKey.spec.ts","./core/utils/dataProviderKey.ts","./core/utils/derive.spec.ts","./core/utils/derive.ts","./core/utils/dismissed.ts","./core/utils/dpOptions.spec.ts","./core/utils/endpoint.spec.ts","./core/utils/endpoint.ts","./core/utils/jsonataHelpers.ts","./core/utils/jsonataRuntime.ts","./core/utils/positioning.spec.ts","./core/utils/positioning.ts","./core/utils/publisherPathKey.spec.ts","./core/utils/route.spec.ts","./core/utils/route.ts","./core/utils/url-pattern.ts","./test-utils/TestUtils.ts"],"version":"5.9.2"}

package/vite.config.mts

@@ -7,6 +7,7 @@ import { configDefaults } from "vitest/config";
 import path from "path";
 import fs from "fs";
 import { docsMockApiVitePlugin } from "./scripts/docs-mock-api-vite-plugin";
+import { docsMarkdownVitePlugin } from "./scripts/docs-markdown-vite-plugin";
 import { docsOpenInEditorPlugin } from "./scripts/docs-open-in-editor-plugin";
 
 function CustomHmr() {
@@ -90,7 +91,11 @@ export default defineConfig({
       },
     },
   },
-  base: "./",
+  // Docs SPA uses pathname routes (`/docs/...`); relative `./` breaks asset URLs on deep paths.
+  base:
+    libName === "docs" || process.env.npm_lifecycle_event === "dev"
+      ? "/"
+      : "./",
   test: {
     globals: true,
     environment: "jsdom",
@@ -129,7 +134,11 @@ export default defineConfig({
       include: ["src/**/*.css", "src/**/*.css?*"],
     }),
     ...(enableDocsMockApi
-      ? [docsMockApiVitePlugin(), docsOpenInEditorPlugin()]
+      ? [
+          docsMarkdownVitePlugin(),
+          docsMockApiVitePlugin(),
+          docsOpenInEditorPlugin(),
+        ]
       : []),
   ],
 });