@lo-tek/interfaces 0.39.0 → 0.41.0

package/dist/components/frame/term/lt-term.js

@@ -0,0 +1,530 @@
+import { addClass, defineElement, HostElement, place, setAttr, warnAboutMarkup, } from "../../host-element.js";
+import { TERM_CLASS, TERM_ENTRY_CLASS } from "./term.js";
+export const LT_TERM_TAG = "lt-term";
+/**
+ * The parts the web component finds, as selectors relative to the element.
+ * The entry is not among them: it is in the glossary, somewhere else on the
+ * page, and is found by the id the link points to.
+ */
+export const LT_TERM_PARTS = {
+    word: "a[href^='#']",
+};
+/** How long the mouse rests on the word before the card opens. */
+const OPEN_DELAY = 300;
+/**
+ * How long the card waits for the mouse after it leaves the word or the
+ * card. The two are separate boxes, one of them in the top layer, so the
+ * pointer leaves the one before it reaches the other.
+ */
+const CLOSE_DELAY = 200;
+/**
+ * Which `<lt-term>` shows an entry right now. Several words can explain
+ * themselves with the same entry, and the entry is one element, so only one
+ * of them can have it open. The one that opens takes it from the other.
+ */
+const shownBy = new WeakMap();
+/**
+ * An entry is a `<div>` in a `<dl>` with a `<dt>` and a `<dd>`: the form HTML
+ * allows for grouping a term with its description. A `<dt>` alone cannot be
+ * the card, since the description is a sibling of it, not a child.
+ */
+function isEntry(element) {
+    return (element.localName === "div" &&
+        element.parentElement?.localName === "dl" &&
+        element.querySelector(":scope > dt") !== null &&
+        element.querySelector(":scope > dd") !== null);
+}
+/**
+ * The ids the link's `href` can mean, as the browser tries them: the
+ * fragment as written, then decoded. Empty when there is no fragment.
+ */
+function fragmentsOf(word) {
+    const href = word.getAttribute("href") ?? "";
+    if (!href.startsWith("#") || href.length < 2)
+        return [];
+    const raw = href.slice(1);
+    try {
+        const decoded = decodeURIComponent(raw);
+        return decoded === raw ? [raw] : [raw, decoded];
+    }
+    catch {
+        return [raw];
+    }
+}
+/**
+ * The `aria-details` the component wrote, per link. A value that is still
+ * there is the component's to change when `href` points elsewhere; any
+ * other value is the server's word, and stays.
+ */
+const detailsWritten = new WeakMap();
+/**
+ * A word in the text that shows its explanation from a glossary on the same
+ * page, in a card by the word.
+ *
+ * The markup is a link to the entry, and that is all it is without
+ * JavaScript: a click goes to the glossary. The web component makes the
+ * entry itself the card. It sets `popover="manual"` on the entry while the
+ * card is open, so the entry goes into the top layer by the word, and takes
+ * it off again when it closes, so the entry is back in its place in the
+ * glossary. Nothing is copied: the text is sent once, the links in it are
+ * the real ones, and the component writes no id, since the server wrote the
+ * one the link points to.
+ *
+ * The mouse opens the card after a short rest on the word, and the card stays
+ * while the pointer is on the word or in the card. A click, a tap or Enter
+ * opens it and pins it, so it stays until Escape, a click outside, another
+ * click on the word, or the word scrolling out of view. A link clicked with a
+ * modifier key is left to the browser.
+ *
+ * The component writes `aria-details` on the link when it is missing, and
+ * `aria-expanded` from whether the card is open. It puts both back when a
+ * patch removes them, and while the card is open it also puts back what it
+ * set on the entry.
+ *
+ * ```html
+ * <p>Datastar keeps <lt-term><a class="lt-term" href="#term-signal">signals</a></lt-term> in the browser.</p>
+ * <dl>
+ *   <div id="term-signal"><dt>Signal</dt><dd>A value Datastar keeps in the browser.</dd></div>
+ * </dl>
+ * ```
+ */
+export class LtTerm extends HostElement {
+    constructor() {
+        super(...arguments);
+        /** The entry the link points to, from the last round, or `null`. */
+        this.target = null;
+        this.shown = "no";
+        /** What the component put on the entry, to take off again when it closes. */
+        this.addedPopover = false;
+        this.addedClass = false;
+        this.handleClick = (event) => {
+            if (event.defaultPrevented || event.button !== 0)
+                return;
+            // A new tab, a new window, a download: the reader wants the link.
+            if (event.metaKey || event.ctrlKey || event.shiftKey || event.altKey)
+                return;
+            if (!this.target)
+                return;
+            // Not a jump to the glossary, and the address stays as it is.
+            event.preventDefault();
+            if (this.shown === "pinned")
+                this.close();
+            else
+                this.show("pinned");
+        };
+        /*
+         * Only the mouse. A tap gives `pointerenter` with `pointerType` "touch"
+         * before the click, and opening on it would have the click close the card
+         * again, or pin one the reader never saw being opened by hover.
+         */
+        this.handlePointerEnter = (event) => {
+            if (event.pointerType !== "mouse")
+                return;
+            clearTimeout(this.closeTimer);
+            if (this.shown !== "no" || !this.target)
+                return;
+            clearTimeout(this.openTimer);
+            this.openTimer = setTimeout(() => {
+                if (this.shown === "no")
+                    this.show("hover");
+            }, OPEN_DELAY);
+        };
+        this.handlePointerLeave = (event) => {
+            if (event.pointerType !== "mouse")
+                return;
+            clearTimeout(this.openTimer);
+            if (this.shown === "hover")
+                this.closeSoon();
+        };
+        // The pointer in the card keeps it, so the reader can select text and
+        // follow the links in it.
+        this.handleCardEnter = (event) => {
+            if (event.pointerType === "mouse")
+                clearTimeout(this.closeTimer);
+        };
+        this.handleCardLeave = (event) => {
+            if (event.pointerType === "mouse" && this.shown === "hover")
+                this.closeSoon();
+        };
+        this.handleOutsideClick = (event) => {
+            // `composedPath()` and not `target`, which is retargeted to the shadow
+            // host when the component is in a shadow root.
+            const target = event.composedPath()[0];
+            if (!(target instanceof Node))
+                return;
+            if (this.word?.contains(target) || this.entry?.contains(target))
+                return;
+            this.close();
+        };
+        this.handleKeydown = (event) => {
+            if (event.key !== "Escape" || !this.isOpen() || event.defaultPrevented)
+                return;
+            // A modal dialog opened over the card closes on its own press.
+            for (const node of event.composedPath()) {
+                if (node === this)
+                    break;
+                if (node instanceof HTMLDialogElement &&
+                    node.matches(":modal") &&
+                    !node.contains(this)) {
+                    return;
+                }
+            }
+            event.preventDefault();
+            // From the path and not `activeElement`, which a shadow root answers
+            // with null when the focus is outside it. Back to the word when the
+            // focus was on it, in the card, or nowhere: on `<body>`, or on a dialog
+            // or a `<main>` the word is in. From a field elsewhere it stays.
+            const target = event.composedPath()[0];
+            const back = target instanceof Node &&
+                (target === this.word ||
+                    (this.entry?.contains(target) ?? false) ||
+                    target.contains(this));
+            this.close();
+            // Focus goes back to the word, without scrolling the page to it.
+            if (back)
+                this.word?.focus({ preventScroll: true });
+        };
+        /**
+         * Under the word, or over it when there is no room. A word that wraps
+         * over two lines has two boxes, and the card goes under the last.
+         *
+         * On a narrow screen the stylesheet makes the card a sheet across the
+         * window, and says so with `--lt-term-sheet`, which is the stylesheet's
+         * to set and not the page's. The sheet goes at the bottom, unless it
+         * would cover the word: then at the top.
+         */
+        this.reposition = () => {
+            const entry = this.entry;
+            const word = this.word;
+            if (!entry || !word)
+                return;
+            const boxes = word.getClientRects();
+            const anchor = boxes[boxes.length - 1] ?? word.getBoundingClientRect();
+            const card = entry.getBoundingClientRect();
+            const style = getComputedStyle(entry);
+            let top;
+            let left;
+            if (style.getPropertyValue("--lt-term-sheet").trim() === "1") {
+                // At the bottom when the word is clear of it, otherwise at the top
+                // when the word is clear of that. A word in the middle under a tall
+                // sheet is covered either way, and the sheet goes on the side away
+                // from it.
+                const bottom = document.documentElement.clientHeight - card.height;
+                if (anchor.bottom <= bottom)
+                    top = bottom;
+                else if (anchor.top >= card.height)
+                    top = 0;
+                else
+                    top =
+                        anchor.top + anchor.height / 2 >
+                            document.documentElement.clientHeight / 2
+                            ? 0
+                            : bottom;
+                left = 0;
+            }
+            else {
+                // The space under the word is `--lt-term-gap`, which the stylesheet
+                // puts in `scroll-margin-block-start`: there the browser has worked
+                // it out in pixels, whatever unit the page gave it.
+                const gap = Number.parseFloat(style.scrollMarginBlockStart) || 0;
+                const rtl = word.matches(":dir(rtl)");
+                ({ top, left } = place(anchor, card, true, rtl, gap));
+            }
+            top = Math.round(top);
+            if (entry.style.getPropertyValue("--lt-term-top") !== `${top}px`)
+                entry.style.setProperty("--lt-term-top", `${top}px`);
+            if (entry.style.getPropertyValue("--lt-term-left") !== `${left}px`)
+                entry.style.setProperty("--lt-term-left", `${left}px`);
+        };
+    }
+    static watch(term) {
+        const root = term.getRootNode();
+        let entry = LtTerm.roots.get(root);
+        if (!entry) {
+            const terms = new Set();
+            const observer = new MutationObserver((records) => {
+                // Text alone, such as a countdown or a filtered list, cannot make
+                // or take an entry: only an element or an id can.
+                const elements = (nodes) => [...nodes].some((n) => n.nodeType === Node.ELEMENT_NODE);
+                const matters = records.some((r) => r.type === "attributes" ||
+                    elements(r.addedNodes) ||
+                    elements(r.removedNodes));
+                if (matters)
+                    for (const t of terms)
+                        t.sync();
+            });
+            // Only nodes and ids: everything the component writes is something
+            // else, so its own writes never call it.
+            observer.observe(root, {
+                childList: true,
+                subtree: true,
+                attributes: true,
+                attributeFilter: ["id"],
+            });
+            entry = { observer, terms };
+            LtTerm.roots.set(root, entry);
+        }
+        entry.terms.add(term);
+        term.watched = root;
+    }
+    static unwatch(term) {
+        if (!term.watched)
+            return;
+        const entry = LtTerm.roots.get(term.watched);
+        entry?.terms.delete(term);
+        if (entry && entry.terms.size === 0) {
+            entry.observer.disconnect();
+            LtTerm.roots.delete(term.watched);
+        }
+        term.watched = undefined;
+    }
+    connectedCallback() {
+        this.observer = new MutationObserver(() => this.sync());
+        this.observer.observe(this, {
+            childList: true,
+            subtree: true,
+            attributes: true,
+            // `class` too: the component sets `lt-term` on a link without it, and
+            // a morph takes it again.
+            attributeFilter: ["href", "class", "aria-details", "aria-expanded"],
+        });
+        LtTerm.watch(this);
+        this.sync();
+    }
+    disconnectedCallback() {
+        this.close();
+        this.observer?.disconnect();
+        this.observer = undefined;
+        LtTerm.unwatch(this);
+        this.detachWord();
+    }
+    /**
+     * Whether the card is open, by the mouse or pinned. A method and not a
+     * getter: React 19 sets a property with the same name as an attribute,
+     * and a getter without a setter throws.
+     */
+    isOpen() {
+        return this.shown !== "no";
+    }
+    root() {
+        return this.getRootNode();
+    }
+    /** The link that belongs to this element, not to an `<lt-term>` inside it. */
+    findWord() {
+        return ([...this.querySelectorAll(LT_TERM_PARTS.word)].find((word) => word.closest(this.localName) === this) ?? null);
+    }
+    findTarget(word) {
+        const root = this.root();
+        for (const id of fragmentsOf(word)) {
+            const found = root.getElementById?.(id);
+            if (found)
+                return found;
+        }
+        return null;
+    }
+    sync() {
+        const word = this.findWord();
+        if (!word) {
+            warnAboutMarkup(this, 'found no link: an <a> with an href to the glossary entry, such as href="#term-signal". Without it there is no word to explain.', () => this.childElementCount > 0 && this.findWord() === null);
+            this.close();
+            this.detachWord();
+            return;
+        }
+        if (this.word !== word) {
+            this.detachWord();
+            word.addEventListener("click", this.handleClick);
+            word.addEventListener("pointerenter", this.handlePointerEnter);
+            word.addEventListener("pointerleave", this.handlePointerLeave);
+            this.word = word;
+            // An open card follows the new link out of view, not the removed one,
+            // which counts as out of view at once.
+            if (this.visibility) {
+                this.visibility.disconnect();
+                this.visibility.observe(word);
+            }
+        }
+        addClass(word, TERM_CLASS);
+        const found = this.findTarget(word);
+        const entry = found && isEntry(found) ? found : null;
+        this.target = entry;
+        if (!found) {
+            warnAboutMarkup(this, "the link points to an id the page does not have. The word stays a plain link; give the glossary entry the id in href.", () => {
+                const now = this.findWord();
+                return now !== null && this.findTarget(now) === null;
+            });
+        }
+        else if (!entry) {
+            warnAboutMarkup(this, "the link points to something that is not a glossary entry: a <div> in a <dl> with a <dt> and a <dd>. The word stays a plain link; put the id on the <div>.", () => {
+                const now = this.findWord();
+                const target = now ? this.findTarget(now) : null;
+                return target !== null && !isEntry(target);
+            });
+        }
+        // `aria-details` the server wrote is its word, also when it points
+        // elsewhere. What the component wrote follows the entry, and goes with it.
+        const details = word.getAttribute("aria-details");
+        if (details === null || details === detailsWritten.get(word)) {
+            setAttr(word, "aria-details", entry?.id ?? null);
+            if (entry)
+                detailsWritten.set(word, entry.id);
+            else
+                detailsWritten.delete(word);
+        }
+        if (!entry) {
+            // Not an entry, so nothing expands. The link still goes where it points.
+            setAttr(word, "aria-expanded", null);
+            if (this.entry)
+                this.close();
+            return;
+        }
+        setAttr(word, "aria-expanded", String(this.isOpen()));
+        if (!this.isOpen())
+            return;
+        if (this.entry !== entry) {
+            // A patch replaced the entry while it was open. The new one is the
+            // card now; the old one is gone, and took the top layer with it.
+            if (this.entry)
+                this.release(this.entry);
+            this.display(entry);
+        }
+        else {
+            // The same entry, perhaps stripped of what the component set on it.
+            this.display(entry);
+        }
+    }
+    detachWord() {
+        this.word?.removeEventListener("click", this.handleClick);
+        this.word?.removeEventListener("pointerenter", this.handlePointerEnter);
+        this.word?.removeEventListener("pointerleave", this.handlePointerLeave);
+        this.word = undefined;
+    }
+    /** Opens the card, by the mouse or pinned. */
+    show(mode) {
+        this.clearTimers();
+        const entry = this.target;
+        if (!entry || !this.word)
+            return;
+        const other = shownBy.get(entry);
+        if (other && other !== this)
+            other.close();
+        this.shown = mode;
+        this.display(entry);
+        setAttr(this.word, "aria-expanded", "true");
+    }
+    /** Puts the entry in the top layer by the word, and keeps it there. */
+    display(entry) {
+        if (this.entry !== entry) {
+            this.entry = entry;
+            this.addedPopover = false;
+            this.addedClass = false;
+            entry.addEventListener("pointerenter", this.handleCardEnter);
+            entry.addEventListener("pointerleave", this.handleCardLeave);
+        }
+        shownBy.set(entry, this);
+        if (!entry.hasAttribute("popover")) {
+            setAttr(entry, "popover", "manual");
+            this.addedPopover = true;
+        }
+        if (!entry.classList.contains(TERM_ENTRY_CLASS)) {
+            addClass(entry, TERM_ENTRY_CLASS);
+            this.addedClass = true;
+        }
+        if (!entry.matches(":popover-open"))
+            entry.showPopover();
+        this.reposition();
+        if (!this.outside) {
+            this.outside = new MutationObserver(() => this.sync());
+            document.addEventListener("click", this.handleOutsideClick, true);
+            // In the capture phase: a card in an open popover is closer than the
+            // popover, and closes first. The popover leaves a used press alone.
+            document.addEventListener("keydown", this.handleKeydown, true);
+            window.addEventListener("resize", this.reposition);
+            window.addEventListener("scroll", this.reposition, true);
+            this.visibility = new IntersectionObserver((records) => {
+                // Out of view: the reader has moved on. Scrolling alone does not
+                // close the card, so a reader who scrolls a little keeps it.
+                if (records.some((record) => !record.isIntersecting))
+                    this.close();
+            });
+            if (this.word)
+                this.visibility.observe(this.word);
+        }
+        // Observed again for every entry, which may be a new node. A replaced
+        // entry is seen by the observer on the root.
+        this.outside.observe(entry, {
+            attributes: true,
+            attributeFilter: ["popover", "class", "style", "id"],
+        });
+    }
+    /** Takes the entry out of the top layer and back to its place in the glossary. */
+    release(entry) {
+        entry.removeEventListener("pointerenter", this.handleCardEnter);
+        entry.removeEventListener("pointerleave", this.handleCardLeave);
+        if (shownBy.get(entry) === this)
+            shownBy.delete(entry);
+        if (entry.matches(":popover-open"))
+            entry.hidePopover();
+        if (this.addedPopover)
+            setAttr(entry, "popover", null);
+        if (this.addedClass && entry.classList.contains(TERM_ENTRY_CLASS)) {
+            const rest = [...entry.classList]
+                .filter((name) => name !== TERM_ENTRY_CLASS)
+                .join(" ");
+            setAttr(entry, "class", rest === "" ? null : rest);
+        }
+        entry.style.removeProperty("--lt-term-top");
+        entry.style.removeProperty("--lt-term-left");
+        if (entry.getAttribute("style") === "")
+            setAttr(entry, "style", null);
+        this.addedPopover = false;
+        this.addedClass = false;
+    }
+    /** Closes the card, and moves focus to the word if it was in the card. */
+    close() {
+        this.clearTimers();
+        const entry = this.entry;
+        const hadFocus = entry?.contains(this.root().activeElement ?? null) ?? false;
+        this.shown = "no";
+        this.entry = undefined;
+        this.outside?.disconnect();
+        this.outside = undefined;
+        this.visibility?.disconnect();
+        this.visibility = undefined;
+        document.removeEventListener("click", this.handleOutsideClick, true);
+        document.removeEventListener("keydown", this.handleKeydown, true);
+        window.removeEventListener("resize", this.reposition);
+        window.removeEventListener("scroll", this.reposition, true);
+        if (entry)
+            this.release(entry);
+        if (this.word && this.target)
+            setAttr(this.word, "aria-expanded", "false");
+        if (hadFocus)
+            this.word?.focus({ preventScroll: true });
+    }
+    clearTimers() {
+        clearTimeout(this.openTimer);
+        clearTimeout(this.closeTimer);
+        this.openTimer = undefined;
+        this.closeTimer = undefined;
+    }
+    closeSoon() {
+        clearTimeout(this.closeTimer);
+        this.closeTimer = setTimeout(() => {
+            if (this.shown === "hover")
+                this.close();
+        }, CLOSE_DELAY);
+    }
+}
+LtTerm.observedAttributes = [];
+/**
+ * One observer per document or shadow root, shared by every `<lt-term>`
+ * in it. The entry is in the glossary, outside the element, and a patch
+ * there can give it its id, take it, or replace it: the word must then
+ * say again whether it expands. An observer per word on the whole page
+ * would be one per word in the text.
+ */
+LtTerm.roots = new WeakMap();
+export function defineLtTerm(tagName = LT_TERM_TAG) {
+    defineElement(tagName, LtTerm);
+}
+//# sourceMappingURL=lt-term.js.map

package/dist/components/frame/term/lt-term.js.map

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

package/dist/components/frame/term/term.d.ts

@@ -0,0 +1,55 @@
+export declare const TERM_CLASS: "lt-term";
+export declare const TERM_ENTRY_CLASS: "lt-term__entry";
+export type TermOptions = {
+    /**
+     * Id of the entry in the glossary: the `<div>` around the `<dt>` and
+     * `<dd>`. The word links to it, and the web component shows the entry
+     * itself as the card. Make it from the term, such as `term-signal`, so it
+     * is the same on every render.
+     */
+    id: string;
+};
+export type TermAttributes = {
+    word: {
+        class: typeof TERM_CLASS;
+        href: string;
+        "aria-details": string;
+    };
+    entry: {
+        class: typeof TERM_ENTRY_CLASS;
+        id: string;
+    };
+};
+/**
+ * The attributes for a word in the text that is explained in a glossary on
+ * the same page.
+ *
+ * Only what holds without JavaScript: the word is a link to the entry, and
+ * `aria-details` says the entry explains it. `<lt-term>` around the link
+ * opens the entry as a card by the word, and writes `aria-expanded`.
+ *
+ * ```ts
+ * const signal = lt.term({ id: "term-signal" })
+ * ```
+ * ```html
+ * <p>Datastar keeps <lt-term><a {...signal.word}>signals</a></lt-term> in the browser.</p>
+ * <dl>
+ *   <div {...signal.entry}><dt>Signal</dt><dd>A value Datastar keeps in the browser.</dd></div>
+ * </dl>
+ * ```
+ */
+export declare function term({ id }: TermOptions): TermAttributes;
+/**
+ * `lt.term()` with the state `<lt-term>` writes, for `/react`.
+ *
+ * React reports a mismatch for every attribute a web component writes on an
+ * element React has rendered. `aria-expanded="false"` is there from the
+ * start, so the web component has nothing to write before React hydrates.
+ */
+export declare function termWithState(options: TermOptions): {
+    word: TermAttributes["word"] & {
+        "aria-expanded": "false";
+    };
+    entry: TermAttributes["entry"];
+};
+//# sourceMappingURL=term.d.ts.map

package/dist/components/frame/term/term.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"term.d.ts","sourceRoot":"","sources":["../../../../src/components/frame/term/term.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,UAAU,EAAG,SAAkB,CAAA;AAC5C,eAAO,MAAM,gBAAgB,EAAG,gBAAyB,CAAA;AAEzD,MAAM,MAAM,WAAW,GAAG;IACxB;;;;;OAKG;IACH,EAAE,EAAE,MAAM,CAAA;CACX,CAAA;AAED,MAAM,MAAM,cAAc,GAAG;IAC3B,IAAI,EAAE;QACJ,KAAK,EAAE,OAAO,UAAU,CAAA;QACxB,IAAI,EAAE,MAAM,CAAA;QACZ,cAAc,EAAE,MAAM,CAAA;KACvB,CAAA;IACD,KAAK,EAAE;QACL,KAAK,EAAE,OAAO,gBAAgB,CAAA;QAC9B,EAAE,EAAE,MAAM,CAAA;KACX,CAAA;CACF,CAAA;AAED;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,IAAI,CAAC,EAAE,EAAE,EAAE,EAAE,WAAW,GAAG,cAAc,CAoBxD;AAED;;;;;;GAMG;AACH,wBAAgB,aAAa,CAAC,OAAO,EAAE,WAAW,GAAG;IACnD,IAAI,EAAE,cAAc,CAAC,MAAM,CAAC,GAAG;QAAE,eAAe,EAAE,OAAO,CAAA;KAAE,CAAA;IAC3D,KAAK,EAAE,cAAc,CAAC,OAAO,CAAC,CAAA;CAC/B,CASA"}

package/dist/components/frame/term/term.js

@@ -0,0 +1,55 @@
+import { attributes } from "../../css/shared.js";
+export const TERM_CLASS = "lt-term";
+export const TERM_ENTRY_CLASS = "lt-term__entry";
+/**
+ * The attributes for a word in the text that is explained in a glossary on
+ * the same page.
+ *
+ * Only what holds without JavaScript: the word is a link to the entry, and
+ * `aria-details` says the entry explains it. `<lt-term>` around the link
+ * opens the entry as a card by the word, and writes `aria-expanded`.
+ *
+ * ```ts
+ * const signal = lt.term({ id: "term-signal" })
+ * ```
+ * ```html
+ * <p>Datastar keeps <lt-term><a {...signal.word}>signals</a></lt-term> in the browser.</p>
+ * <dl>
+ *   <div {...signal.entry}><dt>Signal</dt><dd>A value Datastar keeps in the browser.</dd></div>
+ * </dl>
+ * ```
+ */
+export function term({ id }) {
+    // A made-up id would point at nothing: the entry is in the glossary, and
+    // only the template knows its id.
+    if (typeof id !== "string" || id.trim() === "") {
+        throw new Error("lt.term(): id is required. It is the id of the entry in the glossary, " +
+            'such as "term-signal".');
+    }
+    return {
+        word: attributes({
+            class: TERM_CLASS,
+            href: `#${id}`,
+            "aria-details": id,
+        }),
+        entry: attributes({
+            class: TERM_ENTRY_CLASS,
+            id,
+        }),
+    };
+}
+/**
+ * `lt.term()` with the state `<lt-term>` writes, for `/react`.
+ *
+ * React reports a mismatch for every attribute a web component writes on an
+ * element React has rendered. `aria-expanded="false"` is there from the
+ * start, so the web component has nothing to write before React hydrates.
+ */
+export function termWithState(options) {
+    const built = term(options);
+    return {
+        word: attributes({ ...built.word, "aria-expanded": "false" }, built.word),
+        entry: built.entry,
+    };
+}
+//# sourceMappingURL=term.js.map