@optionfactory/fml 9.0.0-rc13 → 9.0.0-rc15

package/dist/ful.mjs

@@ -560,30 +560,62 @@ class Bindings {
     }
 
     static mutateIn(form, values) {
-        const names = Array.from(form.elements)
-            .map((el) => el.getAttribute('name'))
-            .filter((n) => n);
-        for (const [flattenedKey, value] of Object.entries(Bindings.flatten(values, '', new Set(names)))) {
-            for (const el of form.querySelectorAll(`[name='${CSS.escape(flattenedKey)}']`)) {
+        const named = Bindings.#named(form);
+        for (const [flattenedKey, value] of Object.entries(Bindings.flatten(values, '', new Set(named.keys())))) {
+            for (const el of named.get(flattenedKey) ?? []) {
                 Bindings.mutate(el, value);
             }
         }
     }
 
+    /**
+     * The form's own named controls, by name: `form.elements`, the platform's
+     * association list, so a field in the subtree that belongs to another form
+     * (a nested form built by script, a `form` attribute pointing elsewhere) is
+     * not the caller's to touch, where a subtree query would have reached it.
+     */
+    static #named(form) {
+        const named = new Map();
+        for (const el of form.elements) {
+            const name = el.getAttribute('name');
+            if (!name) {
+                continue;
+            }
+            const bucket = named.get(name);
+            if (bucket) {
+                bucket.push(el);
+            } else {
+                named.set(name, [el]);
+            }
+        }
+        return named;
+    }
+
     static errors(form, es, scrollOnError) {
         //focus management announces the error of the field it lands on through
         //aria-describedby: a live region on top of that would read everything twice,
-        //so the polite announcement exists only when nothing takes the focus
-        form.querySelectorAll('ful-field-error').forEach((el) => {
-            el.setAttribute('aria-live', scrollOnError ? 'off' : 'polite');
-        });
+        //so the polite announcement exists only when nothing takes the focus.
+        //The regions and the banner belong to the form whose subtree holds them
+        //nearest: a nested form's are not this form's to touch
+        const ofForm = (el) => el.closest('form') === form;
+        Array.from(form.querySelectorAll('ful-field-error'))
+            .filter(ofForm)
+            .forEach((el) => {
+                el.setAttribute('aria-live', scrollOnError ? 'off' : 'polite');
+            });
         const pinned = (e) => (e.type === 'FIELD_ERROR' || e.type === 'INVALID_FORMAT') && e.context;
         const fieldErrors = es.filter(pinned);
         const globalErrors = es.filter((e) => !pinned(e));
-        form.querySelectorAll(`[name]`).forEach((el) => {
-            el.setCustomValidity?.('');
-        });
+        const named = Bindings.#named(form);
+        for (const targets of named.values()) {
+            targets.forEach((el) => {
+                el.setCustomValidity?.('');
+            });
+        }
         form.querySelectorAll('ful-errors').forEach((el) => {
+            if (!ofForm(el)) {
+                return;
+            }
             el.setAttribute('role', 'alert');
             el.replaceChildren();
             el.setAttribute('hidden', '');
@@ -594,7 +626,7 @@ class Bindings {
             const parts = name.split('.');
             for (let i = parts.length; i !== 0; --i) {
                 const prefix = parts.slice(0, i).join('.');
-                const targets = form.querySelectorAll(`[name='${CSS.escape(prefix)}']`);
+                const targets = named.get(prefix) ?? [];
                 if (targets.length === 0) {
                     continue;
                 }
@@ -614,6 +646,9 @@ class Bindings {
         });
         const bannered = [...globalErrors, ...unmatched];
         form.querySelectorAll('ful-errors').forEach((el) => {
+            if (!ofForm(el)) {
+                return;
+            }
             const hel = /** @type HTMLElement} */ (el);
             if (bannered.length === 0) {
                 hel.innerText = '';
@@ -628,7 +663,8 @@ class Bindings {
         if (es.length === 0 || !scrollOnError) {
             return;
         }
-        Array.from(form.querySelectorAll(`:invalid`))
+        Array.from(form.elements)
+            .filter((el) => el.matches(':invalid'))
             .sort((a, b) => a.getBoundingClientRect().y - b.getBoundingClientRect().y)[0]
             ?.focus();
     }
@@ -669,6 +705,7 @@ class Field extends ParsedElement {
     /** the role the element internals carry, 'presentation' unless the control is its own */
     static ROLE = 'presentation';
     #control;
+    #pendingFocus = null;
     #described;
     #descriptions = [];
     #errorId = null;
@@ -750,12 +787,17 @@ class Field extends ParsedElement {
             //only where the platform cannot: a control still associated with the
             //form, an author's own input in a slot among them, submits on its own
             //and would otherwise submit twice
-            if (target.form === this.internals.form || !Field.#submitsOnEnter(target)) {
+            if (target.form === this.form || !Field.#submitsOnEnter(target)) {
                 return;
             }
             this._requestSubmit();
         });
         this.replaceChildren(fragment);
+        if (this.#pendingFocus !== null) {
+            const options = this.#pendingFocus;
+            this.#pendingFocus = null;
+            control.focus(options);
+        }
     }
     /**
      * The platform's own rule for which control Enter submits from, measured on
@@ -823,7 +865,11 @@ class Field extends ParsedElement {
         }
     }
     focus(options) {
-        this.#control?.focus(options);
+        if (this.#control) {
+            this.#control.focus(options);
+            return;
+        }
+        this.#pendingFocus = options ?? {};
     }
     /**
      * Clears or reports one validation problem: the text lands on the field's
@@ -850,9 +896,13 @@ class Field extends ParsedElement {
         this.internals.setValidity({ customError: true }, ' ');
         this.#fieldError.innerText = error;
     }
+    /** The form the platform associated the field with, null outside one: a native control's own `form`. */
+    get form() {
+        return this.internals.form;
+    }
     /** Submits the associated form through its first submitter, as Enter on a native control would. */
     _requestSubmit() {
-        const form = this.internals.form;
+        const form = this.form;
         if (!form) {
             return;
         }
@@ -1210,6 +1260,11 @@ class Form extends ParsedElement {
         );
         if (this.declared('clear-invalid-on-change')) {
             this.addEventListener('change', (/** @type any */ evt) => {
+                //a form-associated custom element carries no `form` property of
+                //its own: the owner reads through the internals it attached
+                if ((evt.target.form ?? evt.target.internals?.form) !== this.form) {
+                    return;
+                }
                 evt.target.setCustomValidity?.('');
             });
         }
@@ -1275,8 +1330,9 @@ class Form extends ParsedElement {
             );
             if (e instanceof Failure) {
                 this.errors = e.problems;
+            } else {
+                console.warn('failed to submit form', this, 'reason:', e);
             }
-            console.warn('failed to submit form', this, 'reason:', e);
         } finally {
             this.#submitting = false;
             this.spinner(false);
@@ -1326,6 +1382,9 @@ class Form extends ParsedElement {
         //same way, and a form that only dimmed its button said it to no one
         Attributes.set(this, 'aria-busy', spin ? 'true' : null);
         this.querySelectorAll('ful-spinner').forEach((el) => {
+            if (el.closest('form') !== this.form) {
+                return;
+            }
             const hel = /** @type HTMLElement */ (el);
             if (spin) {
                 this.#announce(hel);
@@ -1336,7 +1395,7 @@ class Form extends ParsedElement {
         });
         this.querySelectorAll('input,button').forEach((el) => {
             const hel = /** @type HTMLButtonElement|HTMLInputElement */ (el);
-            if (hel.type !== 'submit' && hel.type !== 'reset') {
+            if (hel.form !== this.form || (hel.type !== 'submit' && hel.type !== 'reset')) {
                 return;
             }
             if (spin) {
@@ -2177,11 +2236,18 @@ const place = (popover, anchored) => {
     popover.style.bottom = 'auto';
     popover.style.margin = '0';
     if (stretch) {
-        const width = Math.min(box.width, vw - 2 * PAD);
-        popover.style.width = `${width}px`;
+        popover.style.removeProperty('width');
+        popover.style.removeProperty('min-width');
+        popover.style.removeProperty('max-width');
+        const cap = Math.min(parseFloat(computed.maxWidth) || vw, vw - 2 * PAD);
+        popover.style.minWidth = `${Math.min(box.width, vw - 2 * PAD)}px`;
+        popover.style.maxWidth = `${cap}px`;
+        const width = popover.getBoundingClientRect().width;
         popover.style.left = `${clamp(box.left, PAD, vw - width - PAD)}px`;
         const height = popover.getBoundingClientRect().height;
-        popover.style.top = `${clamp(box.bottom + gap.top, PAD, vh - height - PAD)}px`;
+        const below = box.bottom + gap.top;
+        const top = below + height <= vh - PAD ? below : box.top - gap.bottom - height;
+        popover.style.top = `${clamp(top, PAD, vh - height - PAD)}px`;
         return;
     }
     //a popover wraps against the spot it lands on: the width is measured
@@ -2226,7 +2292,9 @@ const unplace = (popover) => {
         'bottom',
         'margin',
         'max-width',
+        'min-width',
         'width',
+        'visibility',
         '--ful-note-callout-inline',
         '--ful-note-callout-block',
     ]) {
@@ -2234,6 +2302,16 @@ const unplace = (popover) => {
     }
 };
 
+const showOncePlaced = (popover, anchored) => {
+    popover.style.visibility = 'hidden';
+    queueMicrotask(() => {
+        if (popover.matches(':popover-open')) {
+            place(popover, anchored);
+        }
+        popover.style.removeProperty('visibility');
+    });
+};
+
 const reflow = () => {
     frame = 0;
     for (const [popover, anchored] of open) {
@@ -2284,8 +2362,10 @@ class Anchors {
      *   the popover, giving toggle and light dismiss with no script of your own
      * @param {boolean} [options.expanded] keeps the invoker's `aria-expanded` in
      *   step with the popover
-     * @param {boolean} [options.stretch] widens the popover to its invoker, which
-     *   is what a combobox dropdown wants
+     * @param {boolean} [options.stretch] widens the popover to at least its
+     *   invoker's width, capped by its own `max-width`, which is what a combobox
+     *   dropdown wants; it flips above the invoker where the viewport leaves no
+     *   room below
      * @param {boolean} [options.handPlace] places here on every platform rather
      *   than only as a fallback, which a popover asks for when it needs to know
      *   where its invoker ended up: the tooltip's note points a callout at it, and
@@ -2332,10 +2412,8 @@ class Anchors {
         }
         const anchored = { invoker, stretch };
         popover.addEventListener('beforetoggle', (/** @type any */ evt) => {
-            //placed before the showing, refined once laid out: the platform's
-            //centered or corner spot never paints
             if (evt.newState === 'open') {
-                place(popover, anchored);
+                showOncePlaced(popover, anchored);
             }
         });
         popover.addEventListener('toggle', (/** @type any */ evt) => {
@@ -2353,6 +2431,52 @@ class Anchors {
             window.addEventListener('resize', schedule);
         }
     }
+    /**
+     * Shows and places a popover beside an anchor, once: the popover shared by
+     * many invokers, each open handing over its own anchor, and an anchor that
+     * is a rectangle rather than an element, one read out of an iframe being
+     * the case a paired invoker could not cover. No pairing, no reflow
+     * following, no close wiring: closing is the caller's, or the platform's
+     * for a light-dismissing popover.
+     *
+     * The placement is the menus' own geometry, below the anchor and
+     * start-aligned, clamped into the viewport; `flip` moves it above the
+     * anchor where the viewport leaves no room below, as the css
+     * `position-try-fallbacks` the paired popovers declare. A popover not
+     * already open is shown and placed before the call returns, so the first
+     * position anybody sees is the right one and the caller can move the focus
+     * into it on the next line.
+     *
+     * @param {HTMLElement} popover the `[popover]` element to show, or an
+     *   already-shown element to place
+     * @param {Element|DOMRect} anchor the element, or the rectangle, to place
+     *   beside
+     * @param {object} [options]
+     * @param {boolean} [options.flip] place above the anchor where no room is
+     *   left below
+     * @param {number} [options.gap] the distance from the anchor, in pixels
+     * @returns {HTMLElement} the popover
+     */
+    static show(popover, anchor, { flip = false, gap = 0 } = {}) {
+        const placeShown = () => {
+            const box = anchor instanceof Element ? anchor.getBoundingClientRect() : anchor;
+            const viewport = document.documentElement;
+            const here = popover.getBoundingClientRect();
+            const below = box.bottom + gap;
+            const above = box.top - gap - here.height;
+            const top = flip && below + here.height > viewport.clientHeight - PAD && above >= PAD ? above : below;
+            popover.style.right = 'auto';
+            popover.style.bottom = 'auto';
+            popover.style.margin = '0';
+            popover.style.left = `${clamp(box.left, PAD, Math.max(PAD, viewport.clientWidth - here.width - PAD))}px`;
+            popover.style.top = `${clamp(top, PAD, Math.max(PAD, viewport.clientHeight - here.height - PAD))}px`;
+        };
+        if (typeof popover.showPopover === 'function' && !popover.matches(':popover-open')) {
+            popover.showPopover();
+        }
+        placeShown();
+        return popover;
+    }
 }
 
 /**
@@ -2642,6 +2766,11 @@ class Dropdown extends ParsedElement {
         //from the host when it gave one, since it has to set aria-controls before
         //this element upgrades
         this.#menu.id = this.declared('listbox') || Attributes.uid('ful-listbox');
+        this.#menu.addEventListener('mousedown', (evt) => {
+            if (evt.target.closest('li')) {
+                evt.preventDefault();
+            }
+        });
         this.#menu.addEventListener('click', (evt) => {
             evt.stopPropagation();
             const li = evt.target.closest('li');
@@ -2649,12 +2778,19 @@ class Dropdown extends ParsedElement {
                 this.hide();
                 return;
             }
+            if (li.matches('[aria-disabled="true"]')) {
+                return;
+            }
             this.#change(li);
         });
         this.replaceChildren(fragment);
     }
     #selected() {
-        return this.#menu?.querySelector('[selected]') ?? this.#menu?.firstElementChild ?? null;
+        return (
+            this.#menu?.querySelector('[selected]:not([aria-disabled="true"])') ??
+            this.#menu?.querySelector('li:not([aria-disabled="true"])') ??
+            null
+        );
     }
     #highlight(li) {
         if (!li) {
@@ -2686,11 +2822,24 @@ class Dropdown extends ParsedElement {
         const data = values.map((entry, index) => ({ index, ...entry }));
         this.#optionstemplate.withOverlay(data).renderTo(this.#menu);
         for (const [index, li] of [...this.#menu.children].entries()) {
-            const picked = keys.some((r) => r == values[index]?.key);
+            const entry = values[index];
+            const picked = keys.some((r) => r == entry?.key);
             li.toggleAttribute('picked', picked);
             //what is picked is what aria-selected means for a listbox: a tint alone
             //says it to whoever can see it and to no one else
             li.setAttribute('aria-selected', picked ? 'true' : 'false');
+            //metadata.disabled refuses the entry, metadata.reason saying why
+            const disabled = !!entry?.metadata?.disabled;
+            if (disabled) {
+                li.setAttribute('aria-disabled', 'true');
+            } else {
+                li.removeAttribute('aria-disabled');
+            }
+            if (disabled && entry.metadata.reason) {
+                li.setAttribute('title', String(entry.metadata.reason));
+            } else {
+                li.removeAttribute('title');
+            }
         }
         this.#empty.toggleAttribute('hidden', values.length !== 0);
         this.#menu.toggleAttribute('hidden', values.length === 0);
@@ -2764,15 +2913,25 @@ class Dropdown extends ParsedElement {
         if (this.shown) {
             const selected = this.#selected();
             const candidate = selected?.[`${forward ? 'next' : 'previous'}ElementSibling`];
-            if (selected && candidate) {
-                this.#highlight(candidate);
+            const target = candidate ? this.#walk(candidate, forward) : null;
+            if (selected && target) {
+                this.#highlight(target);
             }
             return;
         }
         await this.show(loader, keys);
     }
+    #walk(from, forward) {
+        for (let li = from; li; li = li[`${forward ? 'next' : 'previous'}ElementSibling`]) {
+            if (!li.matches('[aria-disabled="true"]')) {
+                return li;
+            }
+        }
+        return null;
+    }
     jump(first) {
-        const target = first ? this.#menu.firstElementChild : this.#menu.lastElementChild;
+        const edge = first ? this.#menu.firstElementChild : this.#menu.lastElementChild;
+        const target = this.#walk(edge, first);
         if (target) {
             this.#highlight(target);
         }
@@ -2782,9 +2941,14 @@ class Dropdown extends ParsedElement {
         if (!selected) {
             return;
         }
-        const lis = Array.from(this.#menu.children);
-        const step = this.#page();
-        const target = lis[Math.max(0, Math.min(lis.length - 1, lis.indexOf(selected) + (forward ? step : -step)))];
+        let target = selected;
+        for (let i = 0; i !== this.#page(); ++i) {
+            const next = this.#walk(target[`${forward ? 'next' : 'previous'}ElementSibling`], forward);
+            if (!next) {
+                break;
+            }
+            target = next;
+        }
         this.#highlight(target);
     }
     #page() {
@@ -2820,6 +2984,12 @@ class Select extends Field {
     //`set value` normalizes a list of one to a single key, and the getter answers a
     //scalar for a single select, so nothing downstream has to know which it was
     static observed = ['multiple:presence', 'item-list:presence', 'value:csv'];
+    unmarshal(attr, str) {
+        if (attr === 'value' && str === '' && !this.hasAttribute('multiple')) {
+            return [''];
+        }
+        return super.unmarshal(attr, str);
+    }
     static slots = true;
     //a manual popover: the combobox keeps the focus on its input and owns
     //the whole lifecycle (typing, arrows, blur, Escape, Tab), so no light
@@ -3913,7 +4083,7 @@ class Table extends ParsedElement {
                 <tbody data-ref="empty" hidden>
                     <tr>
                         <td data-tpl-colspan="schema.length">
-                            <ful-empty data-tpl-if="slots.empty">{{{{ slots.empty }}}}</ful-empty>
+                            <ful-empty data-tpl-if="slots.empty" data-ref="empty-authors"></ful-empty>
                             <ful-empty data-tpl-if="!slots.empty">
                                 <ful-icon data-tpl-if="config.emptyIcon" data-tpl-name="config.emptyIcon" aria-hidden="true"></ful-icon>
                                 {{ #l10n:t('table.no-data') }}
@@ -3956,6 +4126,8 @@ class Table extends ParsedElement {
     #loading;
     #noAutoload;
     #empty;
+    #emptyAuthors;
+    #emptyTemplate;
     #feedback;
     #paginator;
     #sorters;
@@ -4007,6 +4179,9 @@ class Table extends ParsedElement {
         this.#loading = table.querySelector(':scope > tbody[data-ref=loading]');
         this.#noAutoload = table.querySelector(':scope > tbody[data-ref=initial]');
         this.#empty = table.querySelector(':scope > tbody[data-ref=empty]');
+        this.#emptyAuthors = this.#empty.querySelector('ful-empty[data-ref=empty-authors]');
+        this.#emptyTemplate =
+            slots.empty && !Fragments.isBlank(slots.empty) ? Templates.fromFragment(slots.empty) : null;
         this.#feedback = table.querySelector(':scope > tbody[data-ref=feedback]');
         this.#paginator = Nodes.queryChildren(fragment, 'ful-pagination');
         this.replaceChildren(fragment);
@@ -4178,20 +4353,124 @@ class Table extends ParsedElement {
                 .render(),
         );
         this.#empty.toggleAttribute('hidden', pageResponse.data.length !== 0);
+        if (this.#emptyTemplate && pageResponse.data.length === 0) {
+            //rendered per load, the rows' own scope: the empty state can say
+            //whether nothing was ever there or the filters matched nothing
+            this.#emptyAuthors.replaceChildren(
+                this.#emptyTemplate
+                    .withOverlay({ schema: this.#schema, pageRequest, filterRequest, pageResponse })
+                    .render(),
+            );
+        }
         //one move, one repaint: the page and the count are the same state
         this.#paginator.update({ current: pageRequest.page, total: pages });
     }
 }
 
+/** how long a type-ahead buffer stands before the next character starts a new search */
+const TYPEAHEAD_WINDOW = 500;
+
+/**
+ * The keyboard protocol of a menu popover: the focus moving into the menu as it
+ * opens and back to the invoker as it closes, roving focus over the items with
+ * the arrows, Home and End, type-ahead over their text, and Enter and Space
+ * activating the focused one.
+ *
+ * The menu owns what an item is: `items` answers them in the order they are
+ * walked, read on every gesture so a menu that fills itself later needs no
+ * rewiring, and `current` names the one an opening focuses, the first otherwise.
+ *
+ * @param {HTMLElement} invoker the element the menu belongs to, and where the focus goes back
+ * @param {HTMLElement} menu the `[popover]` holding the items
+ * @param {{items: () => HTMLElement[], current?: () => HTMLElement|null|undefined}} conf
+ */
+const wireMenuKeys = (invoker, menu, { items, current = () => null }) => {
+    let typed = '';
+    let typedAt = 0;
+    menu.addEventListener('toggle', (/** @type any */ evt) => {
+        if (evt.newState !== 'open') {
+            //give the invoker back the focus the menu had borrowed, without
+            //stealing it from wherever else the close came from
+            if (menu.contains(document.activeElement)) {
+                invoker.focus();
+            }
+            return;
+        }
+        const all = items();
+        (current() ?? all[0])?.focus();
+    });
+    menu.addEventListener('keydown', (evt) => {
+        const target = /** @type HTMLElement */ (evt.target);
+        const all = items();
+        const item = all.find((candidate) => candidate === target || candidate.contains(target));
+        if (!item) {
+            return;
+        }
+        const at = all.indexOf(item);
+        switch (evt.code) {
+            case 'ArrowDown': {
+                evt.preventDefault();
+                all[(at + 1) % all.length]?.focus();
+                return;
+            }
+            case 'ArrowUp': {
+                evt.preventDefault();
+                all[(at - 1 + all.length) % all.length]?.focus();
+                return;
+            }
+            case 'Home': {
+                evt.preventDefault();
+                all[0]?.focus();
+                return;
+            }
+            case 'End': {
+                evt.preventDefault();
+                all[all.length - 1]?.focus();
+                return;
+            }
+            case 'Enter':
+            case 'Space': {
+                evt.preventDefault();
+                item.click();
+                invoker.focus();
+                return;
+            }
+            case 'Escape': {
+                //the platform's close request hides the menu, the focus is placed
+                //on the invoker before the focused item is detached from it
+                invoker.focus();
+                return;
+            }
+        }
+        if (evt.key.length !== 1 || evt.ctrlKey || evt.altKey || evt.metaKey) {
+            return;
+        }
+        const now = Date.now();
+        typed = now - typedAt > TYPEAHEAD_WINDOW ? evt.key : typed + evt.key;
+        typedAt = now;
+        const wanted = typed.toLowerCase();
+        const repeated = [...wanted].every((character) => character === wanted[0]);
+        const search = repeated ? wanted[0] : wanted;
+        const from = repeated ? at + 1 : at;
+        const found = [...all.slice(from), ...all.slice(0, from)].find((candidate) =>
+            (candidate.textContent ?? '').trim().toLowerCase().startsWith(search),
+        );
+        if (found) {
+            evt.preventDefault();
+            found.focus();
+        }
+    });
+};
+
 /**
  * An invoker button paired with the `ul[popover][role=menu]` that follows it:
  * the chrome behind every filter's operator, sensitivity and boolean value.
  *
  * It fills the menu from a vocabulary, wires it the first time more than one
  * choice survives the whitelist, pins the button to a static glyph when a
- * single one does, owns the roving focus and the Escape/Enter handling, and
- * keeps the button's value, glyph and aria-label in step. A pick that changes
- * the value calls back; the host decides what that means.
+ * single one does, takes the shared menu keyboard protocol, and keeps the
+ * button's value, glyph and aria-label in step. A pick that changes the value
+ * calls back; the host decides what that means.
  *
  * The button's `value` attribute is the store, as it is for a native control:
  * the menu protocol finds the current item by it, and nothing mirrors it.
@@ -4268,6 +4547,13 @@ class ChoiceButton {
     get pinned() {
         return this.#allowed.length < 2;
     }
+    /**
+     * The host's fixed claim: the button and its chrome leave while the value
+     * keeps answering, which is what a fixed operator asks of its glyph.
+     */
+    set fixed(fixed) {
+        this.#button.toggleAttribute('hidden', !!fixed);
+    }
     get value() {
         return this.#button.getAttribute('value');
     }
@@ -4342,64 +4628,10 @@ class ChoiceButton {
         return Array.from(this.#menu.querySelectorAll('li > a'), (a) => /** @type HTMLAnchorElement */ (a));
     }
     #wire() {
-        const button = this.#button;
-        const menu = this.#menu;
-        Anchors.wire(button, menu, { prefix: 'ful-filter-menu', invoke: true, expanded: true });
-        menu.addEventListener('toggle', (/** @type any */ evt) => {
-            if (evt.newState !== 'open') {
-                //give the invoker back the focus the menu had borrowed, without
-                //stealing it from wherever else the close came from
-                if (menu.contains(document.activeElement)) {
-                    button.focus();
-                }
-                return;
-            }
-            const items = this.#items();
-            (items.find((a) => a.getAttribute('value') === this.value) ?? items[0])?.focus();
-        });
-        menu.addEventListener('keydown', (evt) => {
-            const target = /** @type HTMLElement */ (evt.target);
-            const item = /** @type HTMLAnchorElement | null */ (target.closest('li > a'));
-            if (!item) {
-                return;
-            }
-            const items = this.#items();
-            const at = items.indexOf(item);
-            switch (evt.code) {
-                case 'ArrowDown': {
-                    evt.preventDefault();
-                    items[(at + 1) % items.length]?.focus();
-                    break;
-                }
-                case 'ArrowUp': {
-                    evt.preventDefault();
-                    items[(at - 1 + items.length) % items.length]?.focus();
-                    break;
-                }
-                case 'Home': {
-                    evt.preventDefault();
-                    items[0]?.focus();
-                    break;
-                }
-                case 'End': {
-                    evt.preventDefault();
-                    items[items.length - 1]?.focus();
-                    break;
-                }
-                case 'Enter':
-                case 'Space': {
-                    evt.preventDefault();
-                    item.click();
-                    button.focus();
-                    break;
-                }
-                case 'Escape': {
-                    //the platform's close request hides the menu, the focus is placed
-                    //on the invoker before the focused item is detached from it
-                    button.focus();
-                    break;
-                }
-            }
+        Anchors.wire(this.#button, this.#menu, { prefix: 'ful-filter-menu', invoke: true, expanded: true });
+        wireMenuKeys(this.#button, this.#menu, {
+            items: () => this.#items(),
+            current: () => this.#items().find((a) => a.getAttribute('value') === this.value),
         });
     }
 }
@@ -4451,6 +4683,7 @@ const asCriterion = (label, operator, operands) => {
  */
 class CompareFilter extends Input {
     static observed = ['value:json', 'operators:csv'];
+    static attributes = ['operator'];
     static OPERATORS = COMPARE_OPERATORS;
     static DEFAULT_OPERATOR = 'EQ';
     static template = `
@@ -4501,11 +4734,38 @@ class CompareFilter extends Input {
         if (this._operator.value === null) {
             this._showDefaultOperator();
         }
+        this.#fixOperator();
         //the second operand mirrors the claims like the first one does, and the
         //freeze reaches the operator and sensitivity buttons, whose popovers an
         //input's readOnly cannot touch
         return { ...pieces, freeze: this._container, also: [this._value2] };
     }
+    /**
+     * The singular `operator` fixes the operator for the element's life: not a
+     * choice, so no menu and no button, every tuple carrying it. The plural is
+     * the menu's whitelist; declaring both is a confused page and says so,
+     * the singular winning, and an unknown name warns and pins the default.
+     */
+    #fixOperator() {
+        const fixed = this.declared('operator');
+        if (fixed === null) {
+            return;
+        }
+        if (this.hasAttribute('operators')) {
+            console.warn(`${this.localName}: operator fixes what operators offers a menu for, the plural is ignored`, this);
+        }
+        const vocabulary = this._vocabulary();
+        /** @type {string|null} */
+        let preferred = null;
+        if (vocabulary.includes(fixed)) {
+            preferred = fixed;
+        } else {
+            console.warn(`${this.localName}: '${fixed}' is not one of its operators, the default is pinned instead`, this);
+            preferred = this._defaultOperator();
+        }
+        this._operator.allowed = [preferred];
+        this._operator.fixed = true;
+    }
     _showDefaultOperator() {
         const preferred = this._defaultOperator();
         const allowed = this._operator.allowed;
@@ -4542,6 +4802,9 @@ class CompareFilter extends Input {
         return this._operator ? this._operator.allowed : this._declaredOperators;
     }
     set operators(declared) {
+        if (this.declared('operator') !== null) {
+            return;
+        }
         if (!this._operator) {
             this._declaredOperators = ChoiceButton.narrow(declared, this._vocabulary());
             return;
@@ -4645,6 +4908,7 @@ class NumberFilter extends CompareFilter {
 /** The compare filter over text, carrying a case sensitivity beside the operator. */
 class TextFilter extends CompareFilter {
     static observed = ['sensitivities:csv'];
+    static attributes = ['sensitivity'];
     static template = `
         <label>{{{{ slots.default }}}}</label>
         {{{{ slots.info }}}}
@@ -4688,8 +4952,28 @@ class TextFilter extends CompareFilter {
         );
         this._sensitivityButton.allowed = null;
         this._sensitivityButton.value = SENSITIVITIES[0];
+        this.#fixSensitivity();
         return pieces;
     }
+    #fixSensitivity() {
+        const fixed = this.declared('sensitivity');
+        if (fixed === null) {
+            return;
+        }
+        if (this.hasAttribute('sensitivities')) {
+            console.warn('ful-filter-text: sensitivity fixes what sensitivities offers a menu for, the plural is ignored', this);
+        }
+        /** @type {string|null} */
+        let preferred = null;
+        if (SENSITIVITIES.includes(fixed)) {
+            preferred = fixed;
+        } else {
+            console.warn(`ful-filter-text: '${fixed}' is not one of its sensitivities, the default is pinned instead`, this);
+            preferred = 'IGNORE_CASE';
+        }
+        this._sensitivityButton.allowed = [preferred];
+        this._sensitivityButton.fixed = true;
+    }
     _choices() {
         return [...super._choices(), this._sensitivityButton].filter((c) => c);
     }
@@ -4701,6 +4985,9 @@ class TextFilter extends CompareFilter {
         return this._sensitivityButton ? this._sensitivityButton.allowed : this._declaredSensitivities;
     }
     set sensitivities(declared) {
+        if (this.declared('sensitivity') !== null) {
+            return;
+        }
         if (!this._sensitivityButton) {
             this._declaredSensitivities = ChoiceButton.narrow(declared, SENSITIVITIES);
             return;
@@ -4830,6 +5117,15 @@ class BooleanFilter extends Field {
         this._operator.value = this._operator.pinned ? this._operator.allowed[0] : v[0];
         this._value.value = v[1] ?? '';
     }
+    formResetCallback() {
+        super.formResetCallback();
+        if (!this.hasAttribute('value')) {
+            const allowed = this._operator.allowed;
+            this._operator.value = allowed.includes(BooleanFilter.DEFAULT_OPERATOR)
+                ? BooleanFilter.DEFAULT_OPERATOR
+                : allowed[0];
+        }
+    }
     /** @returns {FilterCriterion|null} */
     get criterion() {
         const token = this._value.value;
@@ -5126,6 +5422,15 @@ class Dialog extends ParsedElement {
         this.#body = fragment.querySelector('[data-ref=body]');
         this.#loading = fragment.querySelector('[data-ref=loading]');
         this.#error = fragment.querySelector('[data-ref=error]');
+        //a dialog is a named surface: a reader announces the heading on opening,
+        //which it cannot do unless the heading names the dialog. The name travels
+        //as a reference rather than as aria-label text, so it stays the heading's
+        //own however it is reworded
+        const heading = fragment.querySelector('h2');
+        if (heading) {
+            heading.id ||= Attributes.uid('ful-dialog-title');
+            this.#dialog.setAttribute('aria-labelledby', heading.id);
+        }
         this.#dialog.addEventListener('close', () => {
             const outcome = this.#outcome();
             this.dispatchEvent(new CustomEvent('close', { detail: outcome }));
@@ -5293,6 +5598,87 @@ class Dialog extends ParsedElement {
         this.#loading?.setAttribute('hidden', '');
         this.#body?.removeAttribute('hidden');
     }
+    /**
+     * Asks a question in a dialog of the page's own, resolving with its outcome
+     * and removing the element afterwards: the element stays the author's when
+     * the question lives in the page, while a question asked from a button had
+     * to build, render, show, answer and clean up by hand.
+     *
+     * The body is text or a node: a string is never read as markup, an
+     * `innerHTML` sink being a thing the library does not carry. Each button is
+     * a `[result, label, className?]` tuple rendered as its answer, or a node
+     * the caller has built itself, which is how a button carries anything a
+     * tuple cannot say and how a footer gets a spacer.
+     * @param {string} header
+     * @param {string|Node} body
+     * @param {([string, string, string?]|Node)[]} [buttons]
+     * @param {{ className?: string }} [options] `className` dresses the dialog,
+     *   the way a declared `ful-dialog` is given one to size it
+     * @returns {Promise<DialogOutcome>}
+     */
+    static async ask(header, body, buttons = [], { className } = {}) {
+        const dialog = document.createElement('ful-dialog');
+        dialog.setAttribute('header', header);
+        if (className) {
+            dialog.className = className;
+        }
+        if (typeof body === 'string') {
+            dialog.textContent = body;
+        } else if (body) {
+            dialog.append(body);
+        }
+        //buttons are slotted only when there are any: the acknowledge button
+        //is the answer of a question asked without choices of its own
+        if (buttons.length > 0) {
+            const choices = document.createElement('template');
+            choices.setAttribute('slot', 'buttons');
+            for (const choice of buttons) {
+                if (choice instanceof Node) {
+                    choices.content.append(choice);
+                    continue;
+                }
+                const [result, label, buttonClass] = choice;
+                const button = document.createElement('button');
+                button.type = 'button';
+                button.dataset.result = result;
+                if (buttonClass) {
+                    button.className = buttonClass;
+                }
+                button.textContent = label;
+                choices.content.append(button);
+            }
+            dialog.append(choices);
+        }
+        document.body.append(dialog);
+        try {
+            await Rendering.waitFor(dialog);
+            return await /** @type {Dialog} */ (dialog).ask();
+        } finally {
+            dialog.remove();
+        }
+    }
+    /**
+     * Asks a yes/no question, resolving with the confirm button's answer:
+     * the cancel button, the close button and Escape all answer false, a
+     * dismissal being the negative.
+     * @param {string} header
+     * @param {string|Node} body
+     * @param {{ confirm?: string, cancel?: string }} [labels] overriding the localized defaults
+     * @param {{ className?: string }} [options] as `ask` takes them
+     * @returns {Promise<boolean>}
+     */
+    static async confirm(header, body, labels = {}, options = {}) {
+        const outcome = await Dialog.ask(
+            header,
+            body,
+            [
+                ['cancel', labels.cancel ?? Localization.of().t('dialog.cancel')],
+                ['confirm', labels.confirm ?? Localization.of().t('dialog.confirm'), 'ful-button'],
+            ],
+            options,
+        );
+        return !outcome.dismissed && outcome.result === 'confirm';
+    }
 }
 
 /**
@@ -5305,7 +5691,7 @@ class Dialog extends ParsedElement {
  * it.
  */
 class Drawer extends ParsedElement {
-    static attributes = ['title', 'placement', 'close-on-submit:presence'];
+    static attributes = ['header', 'placement', 'close-on-submit:presence'];
     static slots = true;
     static template = `
         <dialog data-ref="dialog" class="ful-drawer">
@@ -5330,12 +5716,23 @@ class Drawer extends ParsedElement {
     //a save answering with no body at all is still a save
     /** @type {{ dismissed: boolean, response: any }|null} */
     #answer = null;
+    #closing = false;
+    #slideOutEnded = (/** @type AnimationEvent */ e) => {
+        if (e.target === this.#dialog) {
+            this.#closeNow();
+        }
+    };
     render({ slots }) {
         const fragment = this.template()
-            .withOverlay({ slots, title: this.declared('title') ?? '' })
+            .withOverlay({ slots, title: this.declared('header') ?? '' })
             .render();
         this.#dialog = fragment.querySelector('[data-ref=dialog]');
         this.#title = fragment.querySelector('[data-ref=title]');
+        //a named surface, like a dialog: the heading announces the drawer on
+        //opening only where it names it, and the reference survives every
+        //textContent update() writes into the heading
+        this.#title.id ||= Attributes.uid('ful-drawer-title');
+        this.#dialog.setAttribute('aria-labelledby', this.#title.id);
         this.#loading = fragment.querySelector('[data-ref=loading]');
         this.#error = fragment.querySelector('[data-ref=error]');
         this.#content = fragment.querySelector('[data-ref=content]');
@@ -5353,6 +5750,10 @@ class Drawer extends ParsedElement {
                 this.close();
             }
         });
+        this.#dialog.addEventListener('cancel', (e) => {
+            e.preventDefault();
+            this.close();
+        });
         this.#dialog.addEventListener('close', () => {
             this.dispatchEvent(
                 new CustomEvent('close', { detail: this.#answer ?? { dismissed: true, response: null } }),
@@ -5376,23 +5777,23 @@ class Drawer extends ParsedElement {
         this.replaceChildren(fragment);
         wireTargets();
     }
-    get title() {
+    get header() {
         return this.#title.textContent;
     }
-    set title(v) {
+    set header(v) {
         this.#title.textContent = v ?? '';
     }
     /**
-     * Opens the drawer under the given title and waits for the callback: a
+     * Opens the drawer under the given header and waits for the callback: a
      * resolved value paints the content section (which is returned), a
      * rejection paints the problems and travels to the caller, and an update
      * superseded by a newer one paints nothing.
      */
-    async update(title, cb) {
+    async update(header, cb) {
         //the claim detaches any update still in flight: its outcome belongs to
         //an abandoned opening and must neither be painted nor own the drawer
         const claim = this.#updates.take();
-        this.title = title;
+        this.header = header;
         this.#content.replaceChildren();
         this.#restChrome();
         this.#loading.removeAttribute('hidden');
@@ -5438,10 +5839,33 @@ class Drawer extends ParsedElement {
         this.#requests.request(this, this.#content, null, null)?.catch(() => undefined);
     }
     close() {
+        if (this.#closing || !this.#dialog.open) {
+            return;
+        }
+        if (matchMedia('(prefers-reduced-motion: reduce)').matches) {
+            this.#dialog.close();
+            return;
+        }
+        this.#dialog.setAttribute('closing', '');
+        if (this.#dialog.getAnimations().length === 0) {
+            this.#closeNow();
+            return;
+        }
+        this.#closing = true;
+        this.#dialog.addEventListener('animationend', this.#slideOutEnded);
+    }
+    #closeNow() {
+        this.#stopSlidingOut();
         this.#dialog.close();
     }
+    #stopSlidingOut() {
+        this.#closing = false;
+        this.#dialog.removeEventListener('animationend', this.#slideOutEnded);
+        this.#dialog.removeAttribute('closing');
+    }
     /** Shows the modal, answering whether this call is the one that opened it. */
     #show() {
+        this.#stopSlidingOut();
         if (this.#dialog.open) {
             return false;
         }
@@ -5459,6 +5883,65 @@ class Drawer extends ParsedElement {
     }
 }
 
+/**
+ * A menu of commands on the native popover platform: the invoker named by
+ * `for` toggles it and light dismiss and Escape come from the browser, while
+ * the element adds the menu semantics and the keyboard protocol.
+ *
+ * The items are the buttons and links written inside it, kept as they are and
+ * given their menu role and their place in the roving focus. Activation is the
+ * item's own click, which the element only follows by closing.
+ */
+class Menu extends ParsedElement {
+    static attributes = ['for'];
+    render() {
+        const named = this.declared('for');
+        const invoker = named ? document.getElementById(named) : null;
+        if (!invoker) {
+            throw new Error(
+                `ful-menu names no invoker: for="${named ?? ''}" must name an element already in the page when the menu upgrades`,
+            );
+        }
+        this.setAttribute('role', 'menu');
+        if (!this.hasAttribute('popover')) {
+            this.setAttribute('popover', '');
+        }
+        invoker.setAttribute('aria-haspopup', 'menu');
+        Anchors.wire(invoker, this, { prefix: 'ful-menu', invoke: true, expanded: true });
+        wireMenuKeys(invoker, this, { items: () => this.items });
+        this.#mark();
+        this.addEventListener('click', (evt) => {
+            const target = /** @type HTMLElement */ (evt.target);
+            if (this.items.some((item) => item === target || item.contains(target))) {
+                this.hidePopover();
+            }
+        });
+    }
+    /**
+     * The commands, in the order the arrows walk them: the menu's own buttons
+     * and links, minus the disabled and hidden ones, which keep their role and
+     * leave the walk.
+     */
+    get items() {
+        return this.#mark().filter((item) => !item.hasAttribute('disabled') && !item.hasAttribute('hidden'));
+    }
+    /**
+     * Gives every button and link of the menu its item role and takes it out of
+     * the tab order, and answers them. Read on every gesture as well as at the
+     * render, so a menu a page fills or empties later needs no rewiring.
+     */
+    #mark() {
+        const all = /** @type HTMLElement[] */ ([...this.querySelectorAll(':scope > button, :scope > a[href]')]);
+        for (const item of all) {
+            if (!item.hasAttribute('role')) {
+                item.setAttribute('role', 'menuitem');
+            }
+            item.tabIndex = -1;
+        }
+        return all;
+    }
+}
+
 const SEVERITIES = ['info', 'success', 'warning', 'error'];
 
 //the regions alive in the document: the show-toast listener is wired once and
@@ -5488,6 +5971,9 @@ class Toasts extends ParsedElement {
         if (!listenerWired) {
             listenerWired = true;
             document.addEventListener('show-toast', (/** @type any */ e) => {
+                if (!e.detail) {
+                    return;
+                }
                 for (const region of REGIONS) {
                     region.show(e.detail.message, e.detail);
                 }
@@ -5499,8 +5985,13 @@ class Toasts extends ParsedElement {
      * Appends a toast carrying the message (a Failure shows its problems'
      * reasons, one per line), severity picking the theme and the announcement,
      * the toast retiring through its own timer or its dismiss button.
+     *
+     * The timer holds while the toast is hovered or holds the focus, so an
+     * actionable toast waits for its reader: `action` is `{ label, onClick }`,
+     * a button beside the message whose click answers and retires. The same
+     * options travel in the `show-toast` event's detail.
      * @param {any} message
-     * @param {any} [options] severity and timeout
+     * @param {any} [options] severity, timeout and action
      * @returns {HTMLElement}
      */
     show(message, options = {}) {
@@ -5517,14 +6008,13 @@ class Toasts extends ParsedElement {
         icon.setAttribute('name', 'x-lg');
         icon.setAttribute('aria-hidden', 'true');
         dismiss.append(icon);
-        item.append(body, dismiss);
-        item.addEventListener('animationend', () => {
-            if (item.classList.contains('ful-toast-out')) {
-                item.remove();
-            }
-        });
+        item.append(body);
+        let remaining = options.timeout ?? this.#timeout;
+        let startedAt = performance.now();
+        let timer = 0;
         const retire = () => {
-            //the toast may hold the focus, on its own dismiss button: handing it
+            clearTimeout(timer);
+            //the toast may hold the focus, on its own buttons: handing it
             //back to the region keeps the reader somewhere rather than on <body>
             if (item.contains(document.activeElement)) {
                 /** @type HTMLElement */ (this).focus();
@@ -5538,9 +6028,49 @@ class Toasts extends ParsedElement {
                 item.remove();
             }
         };
+        if (options.action?.label) {
+            const action = document.createElement('button');
+            action.type = 'button';
+            action.className = 'ful-toast-action';
+            action.textContent = String(options.action.label);
+            action.addEventListener('click', () => {
+                options.action.onClick?.();
+                retire();
+            });
+            item.append(action);
+        }
+        item.append(dismiss);
+        item.addEventListener('animationend', () => {
+            if (item.classList.contains('ful-toast-out')) {
+                item.remove();
+            }
+        });
+        //the pointer and the focus hold independently: a count rather than a
+        //flag, so the pointer leaving while the focus stays keeps the hold
+        let holds = 0;
+        const hold = () => {
+            if (holds === 0) {
+                clearTimeout(timer);
+                remaining = Math.max(0, remaining - (performance.now() - startedAt));
+            }
+            ++holds;
+        };
+        const release = () => {
+            if (holds === 0) {
+                return;
+            }
+            if (--holds === 0) {
+                startedAt = performance.now();
+                timer = setTimeout(retire, remaining);
+            }
+        };
+        item.addEventListener('mouseenter', hold);
+        item.addEventListener('mouseleave', release);
+        item.addEventListener('focusin', hold);
+        item.addEventListener('focusout', release);
         dismiss.addEventListener('click', retire);
         this.append(item);
-        setTimeout(retire, options.timeout ?? this.#timeout);
+        timer = setTimeout(retire, remaining);
         return item;
     }
 }
@@ -5651,7 +6181,7 @@ class Tabs extends ParsedElement {
         this.#active = index;
         this.reflectTo('active', index);
         if (this.rendered && index !== previous) {
-            this.dispatchEvent(new CustomEvent('change', { detail: { active: index, previous } }));
+            this.dispatchEvent(new CustomEvent('tabs:change', { detail: { active: index, previous } }));
         }
         if (this.#panels.length > 0 && (index !== previous || !this.rendered)) {
             //the activation is the reader's own gesture: the chrome reports a
@@ -5872,6 +6402,8 @@ var en = {
     'info.tooltip': 'More information',
     'dialog.acknowledge': 'Got it',
     'dialog.close': 'Close',
+    'dialog.confirm': 'Confirm',
+    'dialog.cancel': 'Cancel',
     'drawer.close': 'Close',
     'spinner.loading': 'Loading…',
     'toast.region': 'Notifications',
@@ -5914,6 +6446,8 @@ var it = {
     'info.tooltip': 'Maggiori informazioni',
     'dialog.acknowledge': 'Ho capito',
     'dialog.close': 'Chiudi',
+    'dialog.confirm': 'Conferma',
+    'dialog.cancel': 'Annulla',
     'drawer.close': 'Chiudi',
     'spinner.loading': 'Caricamento…',
     'toast.region': 'Notifiche',
@@ -5956,6 +6490,8 @@ var es = {
     'info.tooltip': 'Más información',
     'dialog.acknowledge': 'Entendido',
     'dialog.close': 'Cerrar',
+    'dialog.confirm': 'Confirmar',
+    'dialog.cancel': 'Cancelar',
     'drawer.close': 'Cerrar',
     'spinner.loading': 'Cargando…',
     'toast.region': 'Notificaciones',
@@ -6001,6 +6537,8 @@ var fr = {
     'info.tooltip': 'Plus d’informations',
     'dialog.acknowledge': 'J’ai compris',
     'dialog.close': 'Fermer',
+    'dialog.confirm': 'Confirmer',
+    'dialog.cancel': 'Annuler',
     'drawer.close': 'Fermer',
     'spinner.loading': 'Chargement…',
     'toast.region': 'Notifications',
@@ -6041,7 +6579,7 @@ class Plugin {
         const httpClient =
             this.#httpClient ?? HttpClient.builder().withCsrfToken().withRedirectOnUnauthorized('/').build();
         //the fallback chain is baked here: en, the active language, the consumer's own strings
-        const language = this.#language.split('-')[0];
+        const language = this.#language.split('-')[0].toLowerCase();
         const l10n = { ...BUILTIN.en, ...BUILTIN[language], ...this.#translations };
         registry
             .defineModule('l10n', Localization)
@@ -6049,6 +6587,7 @@ class Plugin {
             .defineElement('ful-tooltip', Tooltip)
             .defineElement('ful-dialog', Dialog)
             .defineElement('ful-drawer', Drawer)
+            .defineElement('ful-menu', Menu)
             .defineElement('ful-toasts', Toasts)
             .defineElement('ful-tabs', Tabs)
             .defineElement('ful-accordion', Accordion)
@@ -6088,5 +6627,5 @@ class Plugin {
     }
 }
 
-export { Accordion, Anchors, AsyncEvents, Bindings, BooleanFilter, Checkbox, Claims, CompareFilter, Dialog, Drawer, Dropdown, Field, Form, FormLoader, InFilter, Input, InputFile, InputInstant, InputLocalDate, InputLocalTime, Instant, InstantFilter, LocalDate, LocalDateFilter, LocalStorage, NumberFilter, Pagination, Plugin, RadioGroup, Select, SelectLoader, SessionStorage, SortButton, Table, TableLoader, TableSchemaParser, Tabs, TextFilter, Timing, Toasts, Tooltip, VersionedLocalStorage, VersionedSessionStorage, Wizard, describable };
+export { Accordion, Anchors, AsyncEvents, Bindings, BooleanFilter, Checkbox, Claims, CompareFilter, Dialog, Drawer, Dropdown, Field, Form, FormLoader, InFilter, Input, InputFile, InputInstant, InputLocalDate, InputLocalTime, Instant, InstantFilter, LocalDate, LocalDateFilter, LocalStorage, Menu, NumberFilter, Pagination, Plugin, RadioGroup, Select, SelectLoader, SessionStorage, SortButton, Table, TableLoader, TableSchemaParser, Tabs, TextFilter, Timing, Toasts, Tooltip, VersionedLocalStorage, VersionedSessionStorage, Wizard, describable };
 //# sourceMappingURL=ful.mjs.map