@lo-tek/interfaces 0.42.0 → 0.43.0

package/dist/react.js

@@ -1,51 +1,9 @@
-import { accordion } from "./components/css/accordion/accordion.js";
-import { alert } from "./components/css/alert/alert.js";
-import { avatar } from "./components/css/avatar/avatar.js";
-import { badge } from "./components/css/badge/badge.js";
-import { breadcrumbs } from "./components/css/breadcrumbs/breadcrumbs.js";
-import { button } from "./components/css/button/button.js";
-import { card } from "./components/css/card/card.js";
-import { checkbox } from "./components/css/checkbox/checkbox.js";
-import { divider } from "./components/css/divider/divider.js";
-import { errorText } from "./components/css/error-text/error-text.js";
-import { fieldset, legend } from "./components/css/fieldset/fieldset.js";
-import { fileUpload } from "./components/css/file-upload/file-upload.js";
-import { heading } from "./components/css/heading/heading.js";
-import { helpText } from "./components/css/help-text/help-text.js";
-import { icon } from "./components/css/icon/icon.js";
-import { input } from "./components/css/input/input.js";
-import { label } from "./components/css/label/label.js";
-import { link } from "./components/css/link/link.js";
-import { list } from "./components/css/list/list.js";
-import { pagination } from "./components/css/pagination/pagination.js";
-import { paragraph } from "./components/css/paragraph/paragraph.js";
-import { progress } from "./components/css/progress/progress.js";
-import { radio } from "./components/css/radio/radio.js";
-import { search } from "./components/css/search/search.js";
-import { select } from "./components/css/select/select.js";
-import { fieldStates, isFieldState, isRequiredMarker, managedNames, rememberManaged, requiredMarkers, } from "./components/css/shared.js";
-import { skeleton } from "./components/css/skeleton/skeleton.js";
-import { skipLink } from "./components/css/skip-link/skip-link.js";
-import { spinner } from "./components/css/spinner/spinner.js";
-import { srOnly } from "./components/css/sr-only/sr-only.js";
-import { steps } from "./components/css/steps/steps.js";
-import { switchControl } from "./components/css/switch/switch.js";
-import { table, tableSort } from "./components/css/table/table.js";
-import { tag } from "./components/css/tag/tag.js";
-import { textarea } from "./components/css/textarea/textarea.js";
-import { toggleGroup } from "./components/css/toggle-group/toggle-group.js";
-import { tooltip } from "./components/css/tooltip/tooltip.js";
-import { dialog } from "./components/frame/dialog/dialog.js";
-import { errorSummary } from "./components/frame/error-summary/error-summary.js";
-import { computeFieldAttributes, createFieldId, } from "./components/frame/field/field-core.js";
-import { popover } from "./components/frame/popover/popover.js";
-import { sessionTimeout } from "./components/frame/session-timeout/session-timeout.js";
-import { suggestion } from "./components/frame/suggestion/suggestion.js";
+import { managedNames, rememberManaged } from "./components/css/shared.js";
+import { createFieldId } from "./components/frame/field/field-core.js";
 import { tabsWithState, } from "./components/frame/tabs/tabs.js";
 import { termWithState } from "./components/frame/term/term.js";
-import { connectionStatus } from "./components/standalone/connection-status/connection-status.js";
-import { toast } from "./components/standalone/toast/toast.js";
 import { setAttributes as setHtmlAttributes } from "./dom.js";
+import { lt as html } from "./lt.js";
 /**
  * The attributes that have another name in React.
  *
@@ -118,16 +76,48 @@ export function setAttributes(element, ...sets) {
     setHtmlAttributes(element, ...sets.map((set) => toHtmlAttributes(set)));
 }
 /**
- * Wraps a builder function so the return value gets the React names.
- *
- * The signature is written as an intersection type so TypeScript can infer
- * both the options type and the extra fields attached to the function, that
- * is `variants`, `isVariant` and the others, in one go.
+ * The result with the React names. A set is recognised by what
+ * `attributes()` notes on every set a builder function makes, not by its
+ * shape, so a compound whose parts are all absent is not taken for one.
+ */
+function toReactResult(value) {
+    if (Array.isArray(value))
+        return value.map(toReactResult);
+    if (!value || typeof value !== "object")
+        return value;
+    if (managedNames(value))
+        return toReactAttributes(value);
+    return Object.fromEntries(Object.entries(value).map(([name, child]) => [name, toReactResult(child)]));
+}
+/**
+ * Wraps a builder function so the result gets the React names, and keeps
+ * what hangs on the function: `variants`, `isVariant` and the others.
  */
 function forReact(fn) {
-    const wrapped = (options) => toReactAttributes(fn(options));
+    const wrapped = (...args) => toReactResult(fn(...args));
     return Object.assign(wrapped, fn);
 }
+/**
+ * A guard on `lt`, such as `isState`: it builds nothing, and passes through
+ * as the same function. Named `is` and a capital letter, as every guard in
+ * the package is.
+ */
+const isGuard = (name) => /^is[A-Z]/.test(name);
+/**
+ * What stands by hand in `lt` below: the two that give the whole state, and
+ * `setAttributes`, which takes an element and builds nothing.
+ */
+const BY_HAND = ["tabs", "term", "setAttributes"];
+function everyBuilder() {
+    const result = {};
+    for (const [name, value] of Object.entries(html))
+        if (!BY_HAND.includes(name))
+            result[name] =
+                typeof value === "function" && !isGuard(name)
+                    ? forReact(value)
+                    : value;
+    return result;
+}
 /**
  * Re-exported from the main entry point.
  *
@@ -138,173 +128,23 @@ function forReact(fn) {
  * also in an app without a server.
  */
 export { createFieldId };
+/**
+ * Every builder function from the main entry, with the React names. A new
+ * component comes along by itself; only the exceptions stand here.
+ */
 export const lt = {
-    accordion: forReact(accordion),
-    alert: forReact(alert),
-    avatar: forReact(avatar),
-    badge: forReact(badge),
-    breadcrumbs: forReact(breadcrumbs),
-    button: forReact(button),
-    card: forReact(card),
-    checkbox: forReact(checkbox),
-    divider: forReact(divider),
-    errorText: forReact(errorText),
-    fieldset: forReact(fieldset),
-    heading: forReact(heading),
-    fileUpload: forReact(fileUpload),
-    helpText: forReact(helpText),
-    icon: forReact(icon),
-    input: forReact(input),
-    label: forReact(label),
-    legend: forReact(legend),
-    link: forReact(link),
-    list: forReact(list),
-    pagination: forReact(pagination),
-    paragraph: forReact(paragraph),
-    radio: forReact(radio),
-    search: forReact(search),
-    select: forReact(select),
-    skeleton: forReact(skeleton),
-    skipLink: forReact(skipLink),
-    progress: forReact(progress),
-    spinner: forReact(spinner),
-    srOnly: forReact(srOnly),
-    steps: forReact(steps),
-    switch: forReact(switchControl),
-    toggleGroup: forReact(toggleGroup),
-    tooltip: forReact(tooltip),
-    table: forReact(table),
-    tableSort: Object.assign((options) => {
-        const built = tableSort(options);
-        return {
-            header: built.header,
-            button: toReactAttributes(built.button),
-        };
-    }, { isDirection: tableSort.isDirection }),
-    tag: forReact(tag),
-    textarea: forReact(textarea),
-    /**
-     * Wires a whole field, with `className` and `htmlFor` on the label.
-     *
-     * `control`, `help` and `error` have no keys that need renaming, and are
-     * therefore the same in both entry points.
-     */
-    field: (options) => {
-        const field = computeFieldAttributes(options);
-        return { ...field, label: toReactAttributes(field.label) };
-    },
-    /**
-     * The compound builder functions return one attribute set per element,
-     * and each set must be renamed on its own. `host` has `tabindex`, and the
-     * panels in `lt.tabs()` have both `tabindex` and `class`.
-     */
-    errorSummary: (options = {}) => {
-        const built = errorSummary(options);
-        return {
-            host: toReactAttributes(built.host),
-            title: toReactAttributes(built.title),
-        };
-    },
-    dialog: Object.assign((options) => {
-        const built = dialog(options);
-        return {
-            host: built.host,
-            dialog: toReactAttributes(built.dialog),
-            header: toReactAttributes(built.header),
-            title: toReactAttributes(built.title),
-            subtitle: toReactAttributes(built.subtitle),
-            body: toReactAttributes(built.body),
-            footer: toReactAttributes(built.footer),
-        };
-    }, {
-        dialog: dialog.dialog,
-        header: dialog.header,
-        title: dialog.title,
-        subtitle: dialog.subtitle,
-        body: dialog.body,
-        footer: dialog.footer,
-        colors: dialog.colors,
-        isColor: dialog.isColor,
-    }),
-    popover: Object.assign((options) => {
-        const built = popover(options);
-        return {
-            host: built.host,
-            trigger: toReactAttributes(built.trigger),
-            panel: toReactAttributes(built.panel),
-        };
-    }, { isPlacement: popover.isPlacement }),
+    ...everyBuilder(),
     /**
      * The whole state, not just the links: React reports a mismatch for every
      * attribute the component writes on an element React has rendered. See
      * `tabsWithState`.
      */
-    tabs: (options) => {
-        const built = tabsWithState(options);
-        return {
-            list: toReactAttributes(built.list),
-            item: toReactAttributes(built.item),
-            tabs: built.tabs.map(toReactAttributes),
-            panels: built.panels.map(toReactAttributes),
-        };
-    },
+    tabs: (options) => toReactResult(tabsWithState(options)),
     /**
      * With `aria-expanded`, which `<lt-term>` writes: React reports a mismatch
      * for an attribute it did not render. See `termWithState`.
      */
-    term: (options) => {
-        const built = termWithState(options);
-        return {
-            word: toReactAttributes(built.word),
-            entry: toReactAttributes(built.entry),
-        };
-    },
-    suggestion: (options) => {
-        const built = suggestion(options);
-        return {
-            ...built,
-            label: toReactAttributes(built.label),
-            control: toReactAttributes(built.control),
-            list: toReactAttributes(built.list),
-            options: built.options.map(toReactAttributes),
-            empty: toReactAttributes(built.empty),
-            status: toReactAttributes(built.status),
-            value: toReactAttributes(built.value),
-        };
-    },
-    toast: (options = {}) => {
-        const built = toast(options);
-        return {
-            host: toReactAttributes(built.host),
-            message: toReactAttributes(built.message),
-            close: toReactAttributes(built.close),
-        };
-    },
-    sessionTimeout: Object.assign((options) => {
-        const built = sessionTimeout(options);
-        return {
-            host: toReactAttributes(built.host),
-            dialog: toReactAttributes(built.dialog),
-            title: toReactAttributes(built.title),
-            text: toReactAttributes(built.text),
-            count: toReactAttributes(built.count),
-            live: toReactAttributes(built.live),
-            actions: toReactAttributes(built.actions),
-            extend: toReactAttributes(built.extend),
-            logout: toReactAttributes(built.logout),
-        };
-    }, {
-        dialog: sessionTimeout.dialog,
-        title: sessionTimeout.title,
-        text: sessionTimeout.text,
-        count: sessionTimeout.count,
-        actions: sessionTimeout.actions,
-    }),
-    connectionStatus: forReact(connectionStatus),
+    term: (options) => toReactResult(termWithState(options)),
     setAttributes,
-    states: fieldStates,
-    isState: isFieldState,
-    markers: requiredMarkers,
-    isMarker: isRequiredMarker,
 };
 //# sourceMappingURL=react.js.map

package/dist/react.js.map

@@ -1 +1 @@
-{"version":3,"file":"react.js","sourceRoot":"","sources":["../src/react.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"react.js","sourceRoot":"","sources":["../src/react.ts"],"names":[],"mappings":"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"}

package/manifest/manifest.json

@@ -1,7 +1,7 @@
 {
   "$schema": "./manifest.schema.json",
   "schemaVersion": 1,
-  "version": "0.42.0",
+  "version": "0.43.0",
   "textLanguage": "en",
   "elements": {
     "lt-field": {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lo-tek/interfaces",
-  "version": "0.42.0",
+  "version": "0.43.0",
   "description": "Framework-agnostic design system: tokens, CSS components and web components.",
   "license": "MIT",
   "author": "August Søberg-Klyver",
@@ -367,14 +367,14 @@
     "access": "public"
   },
   "scripts": {
-    "generate": "bun scripts/generate-matrix.ts && bun scripts/generate-tokens.ts && bun scripts/generate-tailwind.ts && bun scripts/generate-vocabulary.ts && bun scripts/generate-agent.ts && bun scripts/generate-manifest.ts",
+    "generate": "bun scripts/extract-recipes.ts && bun scripts/generate-matrix.ts && bun scripts/generate-tokens.ts && bun scripts/generate-tailwind.ts && bun scripts/generate-vocabulary.ts && bun scripts/generate-agent.ts && bun scripts/generate-manifest.ts",
     "build:css": "bun scripts/build-css.ts",
     "pack": "bun run core && rm -rf dist && tsc -b --force && bun run build:css && npm pack --ignore-scripts",
     "build:browser": "tsc -b && bun run build:css",
     "vocabulary": "bun scripts/generate-vocabulary.ts",
     "check:vocabulary": "bun scripts/check-vocabulary.ts",
     "core": "bun ../core/scripts/build.ts && mkdir -p core && cp ../core/dist/lotek-core.wasm ../core/dist/lotek.wasm core/",
-    "build": "bun run core && bun run generate && rm -rf dist && tsc -b --force && bun run build:css && bun run check:exports && bun run check:server && bun run check:types && bun run check:writes && bun run check:test-files && bun run check:texts && bun run check:identifiers && bun run check:agent && bun run check:vocabulary && bun run check:css-witness && bun run check:wording && bun run check:cli && bun run check:version && bun run check:package",
+    "build": "bun run core && bun run generate && rm -rf dist && tsc -b --force && bun run build:css && bun run check:exports && bun run check:server && bun run check:types && bun run check:writes && bun run check:layers && bun run check:test-files && bun run check:texts && bun run check:identifiers && bun run check:agent && bun run check:vocabulary && bun run check:css-witness && bun run check:wording && bun run check:cli && bun run check:version && bun run check:package",
     "typecheck": "tsc --noEmit",
     "typecheck:tests": "tsc --noEmit -p tsconfig.tests.json",
     "test:browser": "vitest --config vitest.config.ts --run",
@@ -391,6 +391,7 @@
     "check:package": "publint",
     "prepublishOnly": "bun run build",
     "check:writes": "bun scripts/check-writes.ts",
+    "check:layers": "bun scripts/check-layers.ts",
     "check:test-files": "bun scripts/check-test-files.ts",
     "check:identifiers": "bun scripts/check-identifiers.ts",
     "typecheck:scripts": "tsc --noEmit -p scripts/tsconfig.json",
@@ -411,7 +412,10 @@
     "publint": "^0.3.24",
     "react": "19",
     "react-dom": "19",
+    "remark-mdx": "3.1.1",
+    "remark-parse": "11.0.0",
     "tailwindcss": "4.3.0",
+    "unified": "11.0.5",
     "vite": "7.3.7",
     "vitest": "4.1.12"
   }

package/src/components/frame/dialog/lt-dialog.ts

@@ -2,12 +2,17 @@ import {
   addClass,
   defineElement,
   HostElement,
+  hasName,
   isServerControlled,
+  nameFromHeading,
+  ownership,
+  restoreModalOpen,
   SERVER_CONTROLLED,
   setAttr,
   setFlag,
   uniqueId,
   warnAboutMarkup,
+  watcher,
 } from "../../host-element.js"
 import {
   DIALOG_BODY_CLASS,
@@ -89,7 +94,23 @@ const upgradeChecked = new WeakSet<HTMLDialogElement>()
 export class LtDialog extends HostElement {
   static observedAttributes = ["open", SERVER_CONTROLLED] as const
 
-  private observer?: MutationObserver
+  private readonly watch = watcher(
+    (records) => {
+      const swapped = records.some(
+        (record) => record.type === "childList" && record.target === this,
+      )
+      if (swapped) this.sync()
+      else this.rewire()
+    },
+    {
+      childList: true,
+      subtree: true,
+      attributes: true,
+      // `aria-label` too: removed, the dialog is named after its title
+      // again, and without it here the dialog was left without a name.
+      attributeFilter: ["class", "id", "aria-labelledby", "aria-label"],
+    },
+  )
   /**
    * A separate observer for `open` on the `<dialog>` itself.
    *
@@ -98,9 +119,12 @@ export class LtDialog extends HostElement {
    * an observer running all of `sync()` there would have seen a host still
    * saying "open" and a dialog that was not modal, and opened it again before
    * `close` was handled. This one does only one thing: it puts the attribute
-   * back on a dialog that is still in the top layer.
+   * back on a dialog that is still in the top layer. It is started again on
+   * a dialog the server replaced.
    */
-  private openObserver?: MutationObserver
+  private readonly openWatch = watcher(() => this.repairOpen(), {
+    attributeFilter: ["open"],
+  })
   private dialogElement?: HTMLDialogElement
   /**
    * What the component last reported, so it reports only when the state
@@ -148,29 +172,13 @@ export class LtDialog extends HostElement {
      * and opened it again before the close was handled. Every write compares
      * first, or the observer would trigger itself.
      */
-    this.observer = new MutationObserver((records) => {
-      const swapped = records.some(
-        (record) => record.type === "childList" && record.target === this,
-      )
-      if (swapped) this.sync()
-      else this.rewire()
-    })
-    this.observer.observe(this, {
-      childList: true,
-      subtree: true,
-      attributes: true,
-      // `aria-label` too: removed, the dialog is named after its title
-      // again, and without it here the dialog was left without a name.
-      attributeFilter: ["class", "id", "aria-labelledby", "aria-label"],
-    })
+    this.watch.start(this)
     this.sync()
   }
 
   disconnectedCallback(): void {
-    this.observer?.disconnect()
-    this.observer = undefined
-    this.openObserver?.disconnect()
-    this.openObserver = undefined
+    this.watch.stop()
+    this.openWatch.stop()
     this.dialogElement?.removeEventListener("close", this.handleClose)
     this.dialogElement = undefined
   }
@@ -191,6 +199,13 @@ export class LtDialog extends HostElement {
 
   /** The id the component gave the heading, so a patch gets the same one back. */
   private titleId?: string
+  /**
+   * The `aria-labelledby` the component wrote on the `<dialog>`. Another
+   * value there is the server's, and stays; the component's own follows the
+   * title, so a patch that replaces the title does not leave the name
+   * pointing at an id that is gone.
+   */
+  private readonly own = ownership()
 
   /** The wiring alone, for an attribute record. See the observer. */
   private rewire(): void {
@@ -230,8 +245,7 @@ export class LtDialog extends HostElement {
   private nameless(dialog: HTMLDialogElement): boolean {
     return (
       dialog.childElementCount > 0 &&
-      !dialog.hasAttribute("aria-labelledby") &&
-      !dialog.hasAttribute("aria-label") &&
+      !hasName(dialog) &&
       this.headingOf(dialog) === null
     )
   }
@@ -248,22 +262,27 @@ export class LtDialog extends HostElement {
   private wire(dialog: HTMLDialogElement): void {
     addClass(dialog, DIALOG_CLASS)
 
-    const named = dialog.getAttribute("aria-labelledby")
-    if (named) {
+    const name = nameFromHeading(this.own, this, dialog, () => {
+      const title = this.headingOf(dialog)
+      if (!title) return null
+      addClass(title, DIALOG_TITLE_CLASS)
+      if (!title.id) {
+        this.titleId ??= uniqueId("lt-dialog-title")
+        setAttr(title, "id", this.titleId)
+      }
+      return title.id
+    })
+    if (name === "server") {
       // The attribute can list several ids. The title is the first one that
       // is inside the dialog.
+      const named = (dialog.getAttribute("aria-labelledby") ?? "").trim()
       const root = this.getRootNode() as Document | ShadowRoot
       const title = named
         .split(/\s+/)
         .map((id) => root.getElementById?.(id) ?? null)
         .find((element) => element !== null && dialog.contains(element))
       if (title) addClass(title, DIALOG_TITLE_CLASS)
-      return
-    }
-    if (dialog.hasAttribute("aria-label")) return
-
-    const title = this.headingOf(dialog)
-    if (!title) {
+    } else if (name === "none") {
       warnAboutMarkup(
         this,
         "the dialog has no name: it has no aria-labelledby, no " +
@@ -275,14 +294,7 @@ export class LtDialog extends HostElement {
           return now !== null && this.nameless(now)
         },
       )
-      return
     }
-    addClass(title, DIALOG_TITLE_CLASS)
-    if (!title.id) {
-      this.titleId ??= uniqueId("lt-dialog-title")
-      setAttr(title, "id", this.titleId)
-    }
-    setAttr(dialog, "aria-labelledby", title.id)
   }
 
   private notify(open: boolean, returnValue = ""): void {
@@ -316,14 +328,10 @@ export class LtDialog extends HostElement {
    */
   private repairOpen(): void {
     const dialog = this.dialogElement
-    if (!dialog?.isConnected || !dialog.matches(":modal") || dialog.open) {
-      return
-    }
-
     // The attribute must come back either way: without it `close()` does
     // nothing, and the dialog stayed in the top layer, invisible, with the
     // rest of the page inert.
-    setAttr(dialog, "open", "")
+    if (!dialog || !restoreModalOpen(dialog)) return
     if (!isServerControlled(this)) return
 
     /*
@@ -370,8 +378,7 @@ export class LtDialog extends HostElement {
       // listener stayed attached to a detached node for as long as the host
       // lived.
       if (!dialog) {
-        this.openObserver?.disconnect()
-        this.openObserver = undefined
+        this.openWatch.stop()
         this.dialogElement?.removeEventListener("close", this.handleClose)
         this.dialogElement = undefined
       }
@@ -384,7 +391,8 @@ export class LtDialog extends HostElement {
         // If the component is detached, a morph is building the server's
         // version in a separate tree, and there is nothing to report. An
         // empty element is a region the server has not filled yet.
-        () => this.childElementCount > 0 && this.dialog === null,
+        () => this.dialog === null,
+        { silentWhenEmpty: true },
       )
       return
     }
@@ -397,9 +405,7 @@ export class LtDialog extends HostElement {
       this.dialogElement = dialog
       dialog.addEventListener("close", this.handleClose)
 
-      this.openObserver?.disconnect()
-      this.openObserver = new MutationObserver(() => this.repairOpen())
-      this.openObserver.observe(dialog, { attributeFilter: ["open"] })
+      this.openWatch.start(dialog)
     }
 
     this.repairOpen()