@openleaf-editor/ui 0.1.0-beta.2 → 0.1.0-beta.3

package/dist/overflow.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"overflow.d.ts","sourceRoot":"","sources":["../src/overflow.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAKH,qBAAa,eAAe;;gBAOd,OAAO,EAAE,WAAW,EAAE,IAAI,EAAE,WAAW,EAAE,GAAG,EAAE,QAAQ;IAmClE,QAAQ,IAAI,IAAI;IAKhB,OAAO,IAAI,IAAI;IAQf,MAAM,IAAI,IAAI;CA6Ef"}
+{"version":3,"file":"overflow.d.ts","sourceRoot":"","sources":["../src/overflow.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkCG;AAUH,qBAAa,eAAe;;gBAiBd,OAAO,EAAE,WAAW,EAAE,IAAI,EAAE,WAAW,EAAE,GAAG,EAAE,QAAQ,EAAE,QAAQ,CAAC,EAAE,MAAM,IAAI;IA+CzF,kEAAkE;IAClE,QAAQ,IAAI,IAAI;IA6BhB,OAAO,IAAI,IAAI;IAcf,MAAM,IAAI,IAAI;CAyLf"}

package/dist/overflow.js

@@ -1,135 +1,320 @@
 /**
- * Collapse overflowing toolbar groups into a "More" menu.
+ * Collapse overflowing toolbar groups into a "More" panel.
  *
  * Wrapping is the default for a reason: a control that moved behind a click is
  * a control the author does not have. Overflow is therefore opt-in. When it is
- * on, groups that do not fit the current width are hidden in the bar and
- * offered in a menu at the end, so a narrow CMS sidebar still has every item
+ * on, groups that do not fit the current width are moved out of the bar and
+ * offered in a panel at the end, so a narrow CMS sidebar still has every item
  * without a two-row bar.
+ *
+ * ## Why the real controls move rather than being cloned
+ *
+ * The first implementation cloned each control into a `role="menu"`. Cloning a
+ * live control produces a listener-free copy that has to forward every
+ * interaction back to an original it can only find by id, duplicates that id
+ * and the accessible name, and goes stale the moment the caret moves -- three
+ * bugs that only exist because there were two of everything. Moving the group
+ * node itself has none of them: the control in the panel IS the control, so it
+ * carries its own listeners, its own state and its own accessible name, and
+ * nothing can drift.
+ *
+ * ## The keyboard pattern
+ *
+ * The panel is a vertical `role="toolbar"`, not a `role="menu"`: a menu owns a
+ * content model of `menuitem` children, and a `<select>` is not one -- the
+ * default bar has four. So the panel is the same widget as the bar it came
+ * from, turned ninety degrees, and it keeps the same contract: one tab stop,
+ * arrow keys to move, Home/End to the ends, Escape back to the trigger. Tab
+ * closes, because a panel a keyboard user can walk out of and leave open is the
+ * failure mode of every hand-rolled popup.
+ *
+ * Up/Down are taken from a `<select>` inside the panel the same way Left/Right
+ * are taken from one in the bar; Alt+Down still opens its list, and typeahead
+ * still selects. Home/End are left to the select, which uses them for its own
+ * first and last option.
  */
 import { t } from './i18n.js';
 import { iconElement } from './icons.js';
+/** Focusable controls, matching what the toolbar's own roving walks. */
+const FOCUSABLE = 'button.ol-btn, select.ol-select';
+let panelCounter = 0;
 export class ToolbarOverflow {
     #toolbar;
     #host;
+    #doc;
     #more;
-    #menu;
+    #panel;
     #observer = null;
-    constructor(toolbar, host, doc) {
+    #onLayout;
+    /**
+     * A pending coalesced layout.
+     *
+     * A ResizeObserver fires once per observed element, so a ten-group bar paid
+     * for ten layouts in one frame. One rAF collapses them, and the frame is
+     * cancelled on destroy so a queued layout cannot run against a torn-down bar.
+     */
+    #frame = null;
+    constructor(toolbar, host, doc, onLayout) {
         this.#toolbar = toolbar;
         this.#host = host;
+        this.#doc = doc;
+        this.#onLayout = onLayout;
         toolbar.classList.add('ol-toolbar--overflow');
+        this.#panel = doc.createElement('div');
+        this.#panel.className = 'ol-menu ol-overflow-menu';
+        this.#panel.id = `ol-overflow-${(panelCounter += 1)}`;
+        this.#panel.setAttribute('role', 'toolbar');
+        this.#panel.setAttribute('aria-orientation', 'vertical');
+        this.#panel.setAttribute('aria-label', t('More formatting'));
+        this.#panel.hidden = true;
+        this.#panel.addEventListener('keydown', this.#onKeydown);
         this.#more = doc.createElement('button');
         this.#more.type = 'button';
         this.#more.className = 'ol-btn ol-overflow-more';
         this.#more.setAttribute('aria-label', t('More'));
-        this.#more.setAttribute('aria-haspopup', 'true');
+        // Not `aria-haspopup`: none of its values describes a toolbar, and "true"
+        // means menu, which is what this deliberately is not. Expanded plus a
+        // pointer at the panel is the honest relationship.
         this.#more.setAttribute('aria-expanded', 'false');
+        this.#more.setAttribute('aria-controls', this.#panel.id);
         this.#more.hidden = true;
         this.#more.appendChild(iconElement('more', doc));
-        this.#menu = doc.createElement('div');
-        this.#menu.className = 'ol-menu ol-overflow-menu';
-        this.#menu.setAttribute('role', 'menu');
-        this.#menu.hidden = true;
+        this.#more.addEventListener('mousedown', (event) => event.preventDefault());
         this.#more.addEventListener('click', () => {
-            const open = this.#menu.hidden;
-            this.#menu.hidden = !open;
-            this.#more.setAttribute('aria-expanded', open ? 'true' : 'false');
+            if (this.#panel.hidden)
+                this.#open();
+            else
+                this.#close(true);
         });
-        host.appendChild(this.#menu);
+        // Immediately after the bar, never at the end of the editor: appended to the
+        // host it landed after the editable region, so Tab from More walked into the
+        // content and the panel could only be reached by going backwards.
+        if (toolbar.parentNode)
+            toolbar.after(this.#panel);
+        else
+            host.appendChild(this.#panel);
         toolbar.appendChild(this.#more);
         if (typeof ResizeObserver !== 'undefined') {
-            this.#observer = new ResizeObserver(() => this.layout());
+            this.#observer = new ResizeObserver(() => this.#schedule());
             this.#observer.observe(toolbar);
         }
         this.layout();
     }
+    /** Re-home the trigger after the toolbar rebuilt its children. */
     reattach() {
+        // The groups in the panel belong to the render that was just thrown away.
+        // Restoring them would put two of every control in the bar.
+        this.#panel.replaceChildren();
         if (!this.#more.isConnected)
             this.#toolbar.appendChild(this.#more);
         this.layout();
     }
+    /**
+     * Coalesce resize notifications into one layout per frame.
+     *
+     * The observer watches the very element `layout` resizes, so an unthrottled
+     * callback fed itself: hiding a group changes the bar's size, which notifies
+     * the observer, which lays out again. A frame is the right budget for work
+     * whose only purpose is deciding what the next paint shows.
+     */
+    #schedule() {
+        if (this.#frame !== null)
+            return;
+        const win = this.#toolbar.ownerDocument.defaultView;
+        if (!win?.requestAnimationFrame) {
+            this.layout();
+            return;
+        }
+        this.#frame = win.requestAnimationFrame(() => {
+            this.#frame = null;
+            this.layout();
+        });
+    }
     destroy() {
+        // A queued frame outlives destroy() and would lay out a torn-down bar.
+        if (this.#frame !== null) {
+            this.#toolbar.ownerDocument.defaultView?.cancelAnimationFrame(this.#frame);
+            this.#frame = null;
+        }
         this.#observer?.disconnect();
+        this.#close();
+        this.#restore();
         this.#more.remove();
-        this.#menu.remove();
+        this.#panel.remove();
         this.#toolbar.classList.remove('ol-toolbar--overflow');
-        for (const group of this.#groups())
-            group.hidden = false;
     }
     layout() {
-        const groups = this.#groups();
-        for (const group of groups)
-            group.hidden = false;
-        this.#more.hidden = true;
-        this.#menu.hidden = true;
-        this.#menu.replaceChildren();
+        this.#restore();
+        // Revealed BEFORE the reads, not after the compute. The trigger takes a
+        // width and a gap in the row the moment it is shown, and it cannot be
+        // measured while hidden -- `display: none` reports 0. Showing it here means
+        // its footprint is inside the same `scrollWidth` as everything else, so the
+        // arithmetic needs no second measurement and no second layout pass.
+        //
+        // Measured every time rather than cached: the width follows
+        // `--openleaf-button-size`, which a skin or an integrator token changes at
+        // runtime (compact is 28px, the default 32px, coarse-pointer 40px), so a
+        // value pinned at first layout goes quietly wrong on the next density
+        // change.
+        this.#more.hidden = false;
+        this.#close();
+        // READ. Every measurement is taken here, while the bar is fully expanded,
+        // because a width read after a style write forces the browser to lay the
+        // whole bar out again. The old loop alternated the two once per group, so a
+        // ten-group bar paid for ten layouts -- from a ResizeObserver watching the
+        // element it was resizing.
         const budget = this.#toolbar.clientWidth;
-        if (budget === 0)
+        const groups = this.#groups();
+        const total = this.#toolbar.scrollWidth;
+        const widths = groups.map((group) => group.offsetWidth);
+        const moreWidth = this.#more.offsetWidth;
+        const gap = Number.parseFloat(this.#toolbar.ownerDocument.defaultView?.getComputedStyle(this.#toolbar).columnGap ?? '') || 0;
+        if (budget === 0) {
+            this.#more.hidden = true;
             return;
-        const overflowing = [];
-        for (let i = groups.length - 1; i >= 0; i -= 1) {
-            const fits = this.#toolbar.scrollWidth <= budget + 1;
-            if (fits)
-                break;
-            const group = groups[i];
-            if (!group)
-                break;
-            group.hidden = true;
-            overflowing.unshift(group);
         }
-        if (overflowing.length === 0)
+        // COMPUTE. In overflow mode the bar is a nowrap flex row with one uniform
+        // gap, so moving the last k groups out takes exactly their widths and k
+        // gaps off the scroll width. Nothing has to be re-measured between them.
+        //
+        // The trigger's footprint has to come back OUT to answer "does this bar
+        // overflow at all", because a bar that fits never shows one -- and charging
+        // it for a button it will not show would collapse a group for nothing.
+        const trigger = moreWidth > 0 ? moreWidth + gap : 0;
+        if (total - trigger <= budget + 1) {
+            this.#more.hidden = true;
             return;
-        this.#more.hidden = false;
-        for (const group of overflowing) {
-            for (const control of group.querySelectorAll('[aria-label], select')) {
-                const item = control.cloneNode(true);
-                item.removeAttribute('tabindex');
-                // cloneNode copies the option elements but not the select's current
-                // value, which the toolbar sets as a property rather than an attribute.
-                // Without this the menu opens showing the first option instead of the
-                // block the caret is actually in.
-                if (control instanceof HTMLSelectElement && item instanceof HTMLSelectElement) {
-                    item.value = control.value;
-                }
-                this.#menu.appendChild(item);
-            }
         }
-        // Cloning controls duplicates listener-less buttons. Activation on a clone is
-        // forwarded to the original, which still owns the command.
-        this.#menu.onclick = (event) => {
-            const target = event.target;
-            // A <select> is driven by `change`, not `click`. Forwarding a click here
-            // fired before any option was chosen and carried no value with it.
-            if (target?.closest('select'))
-                return;
-            const clone = target?.closest('[data-ol-id]');
-            if (!clone)
-                return;
-            const original = this.#toolbar.querySelector(`[data-ol-id="${clone.dataset['olId']}"]`);
-            original?.click();
-            this.#close();
-        };
-        // The clone has no listeners of its own, so a chosen value has to be written
-        // onto the real control and announced there. Clicking the original was the
-        // previous behaviour and never carried the value, so headings and custom
-        // formats could not be applied from the overflow menu at all.
-        this.#menu.onchange = (event) => {
-            const clone = event.target;
-            if (!(clone instanceof HTMLSelectElement))
-                return;
-            const original = this.#toolbar.querySelector('select');
-            if (!original)
-                return;
-            original.value = clone.value;
-            original.dispatchEvent(new Event('change', { bubbles: true }));
-            this.#close();
-        };
+        // Past here the trigger stays, so `total` -- which already includes it -- is
+        // the right starting point. Leaving it out is what let a bar stay
+        // overflowing by roughly the width of the More button: the groups fit, then
+        // revealing the trigger pushed the row back over its budget, and it
+        // converged only on the next ResizeObserver pass, with a visible flash in
+        // between.
+        let used = total;
+        let count = 0;
+        while (used > budget + 1 && count < groups.length) {
+            used -= (widths[groups.length - 1 - count] ?? 0) + gap;
+            count += 1;
+        }
+        if (count === 0) {
+            this.#more.hidden = true;
+            return;
+        }
+        // WRITE. Backwards, inserted at the front, so the panel keeps the bar's
+        // order. The controls themselves move -- they are not cloned -- which is
+        // what makes the panel operable rather than a picture of the bar.
+        for (let i = groups.length - 1; i >= groups.length - count; i -= 1) {
+            const group = groups[i];
+            if (group)
+                this.#panel.insertBefore(group, this.#panel.firstChild);
+        }
+        // The trigger is already visible -- revealed before the reads, above. And
+        // there are no separator elements to hide: the divider is a border on the
+        // group, so a group that moved into the panel takes its own rule with it
+        // and cannot leave one stranded at the end of the bar.
+        this.#onLayout?.();
         void this.#host;
     }
-    #close() {
-        this.#menu.hidden = true;
+    /* -------------------------------------------------------------- *
+     * Open, close, and the keyboard
+     * -------------------------------------------------------------- */
+    #open() {
+        this.#panel.hidden = false;
+        this.#more.setAttribute('aria-expanded', 'true');
+        this.#position();
+        this.#doc.addEventListener('pointerdown', this.#onPointerDown, true);
+        this.#doc.defaultView?.addEventListener('scroll', this.#onViewportChange, true);
+        this.#doc.defaultView?.addEventListener('resize', this.#onViewportChange);
+        this.#focus(0);
+    }
+    #close(returnFocus = false) {
+        if (this.#panel.hidden)
+            return;
+        this.#panel.hidden = true;
         this.#more.setAttribute('aria-expanded', 'false');
+        this.#doc.removeEventListener('pointerdown', this.#onPointerDown, true);
+        this.#doc.defaultView?.removeEventListener('scroll', this.#onViewportChange, true);
+        this.#doc.defaultView?.removeEventListener('resize', this.#onViewportChange);
+        if (returnFocus)
+            this.#more.focus();
+    }
+    /**
+     * Under the trigger, in viewport coordinates and clamped to it.
+     *
+     * Fixed rather than absolute because the bar may sit inside a host with
+     * `overflow: hidden`, which is the case the whole feature exists for.
+     */
+    #position() {
+        const rect = this.#more.getBoundingClientRect();
+        const box = this.#panel.getBoundingClientRect();
+        const view = this.#doc.defaultView;
+        const width = view?.innerWidth ?? 0;
+        const height = view?.innerHeight ?? 0;
+        const below = rect.bottom + 4;
+        const top = below + box.height > height ? Math.max(4, rect.top - box.height - 4) : below;
+        this.#panel.style.position = 'fixed';
+        this.#panel.style.left = `${Math.round(Math.max(4, Math.min(rect.left, width - box.width - 4)))}px`;
+        this.#panel.style.top = `${Math.round(top)}px`;
+    }
+    #focusables() {
+        return [...this.#panel.querySelectorAll(FOCUSABLE)];
+    }
+    #focus(index) {
+        const items = this.#focusables();
+        if (items.length === 0)
+            return;
+        const next = items[(index + items.length) % items.length];
+        for (const item of items)
+            item.tabIndex = item === next ? 0 : -1;
+        next?.focus();
+    }
+    #onKeydown = (event) => {
+        const target = event.target;
+        if (event.key === 'Escape' || event.key === 'Tab') {
+            event.preventDefault();
+            this.#close(true);
+            return;
+        }
+        const items = this.#focusables();
+        const index = items.indexOf(target);
+        if (index < 0)
+            return;
+        if (event.key === 'ArrowDown' || event.key === 'ArrowUp') {
+            // Alt+Down is how a keyboard user opens a native select's list.
+            if (event.altKey)
+                return;
+            event.preventDefault();
+            this.#focus(index + (event.key === 'ArrowDown' ? 1 : -1));
+            return;
+        }
+        if (event.key === 'Home' || event.key === 'End') {
+            // Left to the select, which uses them for its own first and last option.
+            if (target?.tagName === 'SELECT')
+                return;
+            event.preventDefault();
+            this.#focus(event.key === 'Home' ? 0 : items.length - 1);
+        }
+    };
+    #onPointerDown = (event) => {
+        const target = event.target;
+        if (!(target instanceof Node))
+            return;
+        if (this.#panel.contains(target) || this.#more.contains(target))
+            return;
+        this.#close();
+    };
+    #onViewportChange = () => this.#close();
+    /* -------------------------------------------------------------- *
+     * Moving groups back and forth
+     * -------------------------------------------------------------- */
+    #restore() {
+        for (const group of [...this.#panel.children])
+            this.#toolbar.appendChild(group);
+        // Overflow always takes a suffix of the groups, so appending in panel order
+        // puts them back where they were. The trigger stays last.
+        if (this.#more.isConnected)
+            this.#toolbar.appendChild(this.#more);
     }
     #groups() {
         return [...this.#toolbar.querySelectorAll(':scope > .ol-group')];

package/dist/overflow.js.map

@@ -1 +1 @@
-{"version":3,"file":"overflow.js","sourceRoot":"","sources":["../src/overflow.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"overflow.js","sourceRoot":"","sources":["../src/overflow.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkCG;AAEH,OAAO,EAAE,CAAC,EAAE,MAAM,WAAW,CAAA;AAC7B,OAAO,EAAE,WAAW,EAAE,MAAM,YAAY,CAAA;AAExC,wEAAwE;AACxE,MAAM,SAAS,GAAG,iCAAiC,CAAA;AAEnD,IAAI,YAAY,GAAG,CAAC,CAAA;AAEpB,MAAM,OAAO,eAAe;IAC1B,QAAQ,CAAa;IACrB,KAAK,CAAa;IAClB,IAAI,CAAU;IACd,KAAK,CAAmB;IACxB,MAAM,CAAgB;IACtB,SAAS,GAA0B,IAAI,CAAA;IACvC,SAAS,CAA0B;IACnC;;;;;;OAMG;IACH,MAAM,GAAkB,IAAI,CAAA;IAE5B,YAAY,OAAoB,EAAE,IAAiB,EAAE,GAAa,EAAE,QAAqB;QACvF,IAAI,CAAC,QAAQ,GAAG,OAAO,CAAA;QACvB,IAAI,CAAC,KAAK,GAAG,IAAI,CAAA;QACjB,IAAI,CAAC,IAAI,GAAG,GAAG,CAAA;QACf,IAAI,CAAC,SAAS,GAAG,QAAQ,CAAA;QACzB,OAAO,CAAC,SAAS,CAAC,GAAG,CAAC,sBAAsB,CAAC,CAAA;QAE7C,IAAI,CAAC,MAAM,GAAG,GAAG,CAAC,aAAa,CAAC,KAAK,CAAC,CAAA;QACtC,IAAI,CAAC,MAAM,CAAC,SAAS,GAAG,0BAA0B,CAAA;QAClD,IAAI,CAAC,MAAM,CAAC,EAAE,GAAG,eAAe,CAAC,YAAY,IAAI,CAAC,CAAC,EAAE,CAAA;QACrD,IAAI,CAAC,MAAM,CAAC,YAAY,CAAC,MAAM,EAAE,SAAS,CAAC,CAAA;QAC3C,IAAI,CAAC,MAAM,CAAC,YAAY,CAAC,kBAAkB,EAAE,UAAU,CAAC,CAAA;QACxD,IAAI,CAAC,MAAM,CAAC,YAAY,CAAC,YAAY,EAAE,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAA;QAC5D,IAAI,CAAC,MAAM,CAAC,MAAM,GAAG,IAAI,CAAA;QACzB,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,UAAU,CAAC,CAAA;QAExD,IAAI,CAAC,KAAK,GAAG,GAAG,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAA;QACxC,IAAI,CAAC,KAAK,CAAC,IAAI,GAAG,QAAQ,CAAA;QAC1B,IAAI,CAAC,KAAK,CAAC,SAAS,GAAG,yBAAyB,CAAA;QAChD,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,YAAY,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC,CAAA;QAChD,0EAA0E;QAC1E,sEAAsE;QACtE,mDAAmD;QACnD,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,eAAe,EAAE,OAAO,CAAC,CAAA;QACjD,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,eAAe,EAAE,IAAI,CAAC,MAAM,CAAC,EAAE,CAAC,CAAA;QACxD,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,IAAI,CAAA;QACxB,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,WAAW,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC,CAAA;QAChD,IAAI,CAAC,KAAK,CAAC,gBAAgB,CAAC,WAAW,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,cAAc,EAAE,CAAC,CAAA;QAC3E,IAAI,CAAC,KAAK,CAAC,gBAAgB,CAAC,OAAO,EAAE,GAAG,EAAE;YACxC,IAAI,IAAI,CAAC,MAAM,CAAC,MAAM;gBAAE,IAAI,CAAC,KAAK,EAAE,CAAA;;gBAC/B,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,CAAA;QACxB,CAAC,CAAC,CAAA;QAEF,6EAA6E;QAC7E,6EAA6E;QAC7E,kEAAkE;QAClE,IAAI,OAAO,CAAC,UAAU;YAAE,OAAO,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,CAAA;;YAC7C,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,MAAM,CAAC,CAAA;QAClC,OAAO,CAAC,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;QAE/B,IAAI,OAAO,cAAc,KAAK,WAAW,EAAE,CAAC;YAC1C,IAAI,CAAC,SAAS,GAAG,IAAI,cAAc,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,SAAS,EAAE,CAAC,CAAA;YAC3D,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC,OAAO,CAAC,CAAA;QACjC,CAAC;QACD,IAAI,CAAC,MAAM,EAAE,CAAA;IACf,CAAC;IAED,kEAAkE;IAClE,QAAQ;QACN,0EAA0E;QAC1E,4DAA4D;QAC5D,IAAI,CAAC,MAAM,CAAC,eAAe,EAAE,CAAA;QAC7B,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,WAAW;YAAE,IAAI,CAAC,QAAQ,CAAC,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;QAClE,IAAI,CAAC,MAAM,EAAE,CAAA;IACf,CAAC;IAED;;;;;;;OAOG;IACH,SAAS;QACP,IAAI,IAAI,CAAC,MAAM,KAAK,IAAI;YAAE,OAAM;QAChC,MAAM,GAAG,GAAG,IAAI,CAAC,QAAQ,CAAC,aAAa,CAAC,WAAW,CAAA;QACnD,IAAI,CAAC,GAAG,EAAE,qBAAqB,EAAE,CAAC;YAChC,IAAI,CAAC,MAAM,EAAE,CAAA;YACb,OAAM;QACR,CAAC;QACD,IAAI,CAAC,MAAM,GAAG,GAAG,CAAC,qBAAqB,CAAC,GAAG,EAAE;YAC3C,IAAI,CAAC,MAAM,GAAG,IAAI,CAAA;YAClB,IAAI,CAAC,MAAM,EAAE,CAAA;QACf,CAAC,CAAC,CAAA;IACJ,CAAC;IAED,OAAO;QACL,uEAAuE;QACvE,IAAI,IAAI,CAAC,MAAM,KAAK,IAAI,EAAE,CAAC;YACzB,IAAI,CAAC,QAAQ,CAAC,aAAa,CAAC,WAAW,EAAE,oBAAoB,CAAC,IAAI,CAAC,MAAM,CAAC,CAAA;YAC1E,IAAI,CAAC,MAAM,GAAG,IAAI,CAAA;QACpB,CAAC;QACD,IAAI,CAAC,SAAS,EAAE,UAAU,EAAE,CAAA;QAC5B,IAAI,CAAC,MAAM,EAAE,CAAA;QACb,IAAI,CAAC,QAAQ,EAAE,CAAA;QACf,IAAI,CAAC,KAAK,CAAC,MAAM,EAAE,CAAA;QACnB,IAAI,CAAC,MAAM,CAAC,MAAM,EAAE,CAAA;QACpB,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAC,MAAM,CAAC,sBAAsB,CAAC,CAAA;IACxD,CAAC;IAED,MAAM;QACJ,IAAI,CAAC,QAAQ,EAAE,CAAA;QACf,wEAAwE;QACxE,sEAAsE;QACtE,4EAA4E;QAC5E,4EAA4E;QAC5E,oEAAoE;QACpE,EAAE;QACF,4DAA4D;QAC5D,2EAA2E;QAC3E,yEAAyE;QACzE,sEAAsE;QACtE,UAAU;QACV,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,KAAK,CAAA;QACzB,IAAI,CAAC,MAAM,EAAE,CAAA;QAEb,0EAA0E;QAC1E,yEAAyE;QACzE,4EAA4E;QAC5E,2EAA2E;QAC3E,2BAA2B;QAC3B,MAAM,MAAM,GAAG,IAAI,CAAC,QAAQ,CAAC,WAAW,CAAA;QACxC,MAAM,MAAM,GAAG,IAAI,CAAC,OAAO,EAAE,CAAA;QAC7B,MAAM,KAAK,GAAG,IAAI,CAAC,QAAQ,CAAC,WAAW,CAAA;QACvC,MAAM,MAAM,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,WAAW,CAAC,CAAA;QACvD,MAAM,SAAS,GAAG,IAAI,CAAC,KAAK,CAAC,WAAW,CAAA;QACxC,MAAM,GAAG,GACP,MAAM,CAAC,UAAU,CACf,IAAI,CAAC,QAAQ,CAAC,aAAa,CAAC,WAAW,EAAE,gBAAgB,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,SAAS,IAAI,EAAE,CACzF,IAAI,CAAC,CAAA;QAER,IAAI,MAAM,KAAK,CAAC,EAAE,CAAC;YACjB,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,IAAI,CAAA;YACxB,OAAM;QACR,CAAC;QAED,0EAA0E;QAC1E,wEAAwE;QACxE,yEAAyE;QACzE,EAAE;QACF,wEAAwE;QACxE,4EAA4E;QAC5E,uEAAuE;QACvE,MAAM,OAAO,GAAG,SAAS,GAAG,CAAC,CAAC,CAAC,CAAC,SAAS,GAAG,GAAG,CAAC,CAAC,CAAC,CAAC,CAAA;QACnD,IAAI,KAAK,GAAG,OAAO,IAAI,MAAM,GAAG,CAAC,EAAE,CAAC;YAClC,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,IAAI,CAAA;YACxB,OAAM;QACR,CAAC;QAED,6EAA6E;QAC7E,kEAAkE;QAClE,4EAA4E;QAC5E,oEAAoE;QACpE,0EAA0E;QAC1E,WAAW;QACX,IAAI,IAAI,GAAG,KAAK,CAAA;QAChB,IAAI,KAAK,GAAG,CAAC,CAAA;QACb,OAAO,IAAI,GAAG,MAAM,GAAG,CAAC,IAAI,KAAK,GAAG,MAAM,CAAC,MAAM,EAAE,CAAC;YAClD,IAAI,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,MAAM,GAAG,CAAC,GAAG,KAAK,CAAC,IAAI,CAAC,CAAC,GAAG,GAAG,CAAA;YACtD,KAAK,IAAI,CAAC,CAAA;QACZ,CAAC;QACD,IAAI,KAAK,KAAK,CAAC,EAAE,CAAC;YAChB,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,IAAI,CAAA;YACxB,OAAM;QACR,CAAC;QAED,wEAAwE;QACxE,yEAAyE;QACzE,kEAAkE;QAClE,KAAK,IAAI,CAAC,GAAG,MAAM,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC,IAAI,MAAM,CAAC,MAAM,GAAG,KAAK,EAAE,CAAC,IAAI,CAAC,EAAE,CAAC;YACnE,MAAM,KAAK,GAAG,MAAM,CAAC,CAAC,CAAC,CAAA;YACvB,IAAI,KAAK;gBAAE,IAAI,CAAC,MAAM,CAAC,YAAY,CAAC,KAAK,EAAE,IAAI,CAAC,MAAM,CAAC,UAAU,CAAC,CAAA;QACpE,CAAC;QAED,0EAA0E;QAC1E,0EAA0E;QAC1E,yEAAyE;QACzE,uDAAuD;QACvD,IAAI,CAAC,SAAS,EAAE,EAAE,CAAA;QAClB,KAAK,IAAI,CAAC,KAAK,CAAA;IACjB,CAAC;IAED;;wEAEoE;IAEpE,KAAK;QACH,IAAI,CAAC,MAAM,CAAC,MAAM,GAAG,KAAK,CAAA;QAC1B,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,eAAe,EAAE,MAAM,CAAC,CAAA;QAChD,IAAI,CAAC,SAAS,EAAE,CAAA;QAChB,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,aAAa,EAAE,IAAI,CAAC,cAAc,EAAE,IAAI,CAAC,CAAA;QACpE,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE,gBAAgB,CAAC,QAAQ,EAAE,IAAI,CAAC,iBAAiB,EAAE,IAAI,CAAC,CAAA;QAC/E,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE,gBAAgB,CAAC,QAAQ,EAAE,IAAI,CAAC,iBAAiB,CAAC,CAAA;QACzE,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,CAAA;IAChB,CAAC;IAED,MAAM,CAAC,WAAW,GAAG,KAAK;QACxB,IAAI,IAAI,CAAC,MAAM,CAAC,MAAM;YAAE,OAAM;QAC9B,IAAI,CAAC,MAAM,CAAC,MAAM,GAAG,IAAI,CAAA;QACzB,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,eAAe,EAAE,OAAO,CAAC,CAAA;QACjD,IAAI,CAAC,IAAI,CAAC,mBAAmB,CAAC,aAAa,EAAE,IAAI,CAAC,cAAc,EAAE,IAAI,CAAC,CAAA;QACvE,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE,mBAAmB,CAAC,QAAQ,EAAE,IAAI,CAAC,iBAAiB,EAAE,IAAI,CAAC,CAAA;QAClF,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE,mBAAmB,CAAC,QAAQ,EAAE,IAAI,CAAC,iBAAiB,CAAC,CAAA;QAC5E,IAAI,WAAW;YAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,CAAA;IACrC,CAAC;IAED;;;;;OAKG;IACH,SAAS;QACP,MAAM,IAAI,GAAG,IAAI,CAAC,KAAK,CAAC,qBAAqB,EAAE,CAAA;QAC/C,MAAM,GAAG,GAAG,IAAI,CAAC,MAAM,CAAC,qBAAqB,EAAE,CAAA;QAC/C,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC,WAAW,CAAA;QAClC,MAAM,KAAK,GAAG,IAAI,EAAE,UAAU,IAAI,CAAC,CAAA;QACnC,MAAM,MAAM,GAAG,IAAI,EAAE,WAAW,IAAI,CAAC,CAAA;QACrC,MAAM,KAAK,GAAG,IAAI,CAAC,MAAM,GAAG,CAAC,CAAA;QAC7B,MAAM,GAAG,GAAG,KAAK,GAAG,GAAG,CAAC,MAAM,GAAG,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,GAAG,GAAG,GAAG,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAA;QACxF,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,QAAQ,GAAG,OAAO,CAAA;QACpC,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI,GAAG,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,IAAI,EAAE,KAAK,GAAG,GAAG,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CAAA;QACnG,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,GAAG,GAAG,GAAG,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CAAA;IAChD,CAAC;IAED,WAAW;QACT,OAAO,CAAC,GAAG,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAc,SAAS,CAAC,CAAC,CAAA;IAClE,CAAC;IAED,MAAM,CAAC,KAAa;QAClB,MAAM,KAAK,GAAG,IAAI,CAAC,WAAW,EAAE,CAAA;QAChC,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC;YAAE,OAAM;QAC9B,MAAM,IAAI,GAAG,KAAK,CAAC,CAAC,KAAK,GAAG,KAAK,CAAC,MAAM,CAAC,GAAG,KAAK,CAAC,MAAM,CAAC,CAAA;QACzD,KAAK,MAAM,IAAI,IAAI,KAAK;YAAE,IAAI,CAAC,QAAQ,GAAG,IAAI,KAAK,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAA;QAChE,IAAI,EAAE,KAAK,EAAE,CAAA;IACf,CAAC;IAED,UAAU,GAAG,CAAC,KAAoB,EAAQ,EAAE;QAC1C,MAAM,MAAM,GAAG,KAAK,CAAC,MAA4B,CAAA;QACjD,IAAI,KAAK,CAAC,GAAG,KAAK,QAAQ,IAAI,KAAK,CAAC,GAAG,KAAK,KAAK,EAAE,CAAC;YAClD,KAAK,CAAC,cAAc,EAAE,CAAA;YACtB,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,CAAA;YACjB,OAAM;QACR,CAAC;QACD,MAAM,KAAK,GAAG,IAAI,CAAC,WAAW,EAAE,CAAA;QAChC,MAAM,KAAK,GAAG,KAAK,CAAC,OAAO,CAAC,MAAqB,CAAC,CAAA;QAClD,IAAI,KAAK,GAAG,CAAC;YAAE,OAAM;QACrB,IAAI,KAAK,CAAC,GAAG,KAAK,WAAW,IAAI,KAAK,CAAC,GAAG,KAAK,SAAS,EAAE,CAAC;YACzD,gEAAgE;YAChE,IAAI,KAAK,CAAC,MAAM;gBAAE,OAAM;YACxB,KAAK,CAAC,cAAc,EAAE,CAAA;YACtB,IAAI,CAAC,MAAM,CAAC,KAAK,GAAG,CAAC,KAAK,CAAC,GAAG,KAAK,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAA;YACzD,OAAM;QACR,CAAC;QACD,IAAI,KAAK,CAAC,GAAG,KAAK,MAAM,IAAI,KAAK,CAAC,GAAG,KAAK,KAAK,EAAE,CAAC;YAChD,yEAAyE;YACzE,IAAI,MAAM,EAAE,OAAO,KAAK,QAAQ;gBAAE,OAAM;YACxC,KAAK,CAAC,cAAc,EAAE,CAAA;YACtB,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,GAAG,KAAK,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAA;QAC1D,CAAC;IACH,CAAC,CAAA;IAED,cAAc,GAAG,CAAC,KAAY,EAAQ,EAAE;QACtC,MAAM,MAAM,GAAG,KAAK,CAAC,MAAM,CAAA;QAC3B,IAAI,CAAC,CAAC,MAAM,YAAY,IAAI,CAAC;YAAE,OAAM;QACrC,IAAI,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,MAAM,CAAC,IAAI,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,MAAM,CAAC;YAAE,OAAM;QACvE,IAAI,CAAC,MAAM,EAAE,CAAA;IACf,CAAC,CAAA;IAED,iBAAiB,GAAG,GAAS,EAAE,CAAC,IAAI,CAAC,MAAM,EAAE,CAAA;IAE7C;;wEAEoE;IAEpE,QAAQ;QACN,KAAK,MAAM,KAAK,IAAI,CAAC,GAAG,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC;YAAE,IAAI,CAAC,QAAQ,CAAC,WAAW,CAAC,KAAK,CAAC,CAAA;QAC/E,4EAA4E;QAC5E,0DAA0D;QAC1D,IAAI,IAAI,CAAC,KAAK,CAAC,WAAW;YAAE,IAAI,CAAC,QAAQ,CAAC,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;IACnE,CAAC;IAED,OAAO;QACL,OAAO,CAAC,GAAG,IAAI,CAAC,QAAQ,CAAC,gBAAgB,CAAc,oBAAoB,CAAC,CAAC,CAAA;IAC/E,CAAC;CACF"}

package/dist/registry.d.ts

@@ -19,27 +19,42 @@
 import type { Command, EditorState } from 'prosemirror-state';
 import type { EditorView } from 'prosemirror-view';
 import type { IconName } from './icons.js';
+import type { FormatSpec } from '@openleaf-editor/core';
 /** What a custom `run` handler receives. */
 export interface ToolbarContext {
     view: EditorView;
+    /**
+     * The id this item was registered under.
+     *
+     * A custom control must put it in `data-ol-id`, which is what the toolbar
+     * reads back to restore focus across a re-render. Every custom control in the
+     * tree wrote its human LABEL there instead, so focus restoration silently
+     * failed for all of them -- passing the id here is what makes getting it right
+     * the default rather than something each plugin has to remember.
+     */
+    id?: string;
     /** The `<openleaf-editor>` element, for dispatching events or hosting dialogs. */
     host: HTMLElement;
+    /** Extra host-defined block formats available to select controls. */
+    formats?: readonly FormatSpec[];
 }
 /**
  * A control a `custom` item builds for itself.
  *
  * The contract is narrow on purpose. A custom item owns its own markup, so it
  * can be a colour grid or a table-size picker, but it does not get to own the
- * toolbar's keyboard model: the element it returns must contain exactly one
- * focusable `button.ol-btn`, because that is what the roving tabindex walks. A
- * control with two focusable buttons in the bar would make the toolbar two tab
- * stops where the author expects one; a control with none would be unreachable
- * by keyboard. Anything else the control needs -- a popover, a grid of swatches
- * -- belongs outside the toolbar element, in the top layer or on the host.
+ * toolbar's keyboard model. Button-like custom controls participate in the
+ * roving tabindex through one `button.ol-btn`; select controls identify their
+ * native focus target with `focusable`. A control with two focusable elements
+ * in the bar would make the toolbar two tab stops where the author expects one.
+ * Anything else the control needs -- a popover, a grid of swatches -- belongs
+ * outside the toolbar element, in the top layer or on the host.
  */
 export interface ToolbarControl {
     /** The element placed in the toolbar. */
     el: HTMLElement;
+    /** Focus target when the control is not a standard toolbar button. */
+    focusable?: HTMLElement;
     /**
      * Reflect the editor state. Called on every transaction, so it must be cheap
      * and must not throw; a throw is caught and logged once, like a predicate.
@@ -48,6 +63,11 @@ export interface ToolbarControl {
     /** Release listeners, and remove anything the control put in the document. */
     destroy?: () => void;
 }
+/** One choice in a `type: 'select'` toolbar item. */
+export interface ToolbarSelectOption {
+    value: string;
+    label: string;
+}
 export interface ToolbarItemSpec {
     /** Stable id used in the `toolbar` layout attribute. */
     id: string;
@@ -55,17 +75,22 @@ export interface ToolbarItemSpec {
      * What kind of control this is.
      *
      * `button` is the common case. `custom` hands the item a chance to build its
+     * own DOM through `render`, which is how the colour picker and block-type
+     * select exist without id-specific branches in the toolbar.
+     *
+     * `select` and `custom` both build through `render`; the distinct name keeps
+     * the public declaration honest about the control users will receive.
      * own DOM through `render`, which is how the colour picker exists at all: a
      * swatch grid is not a button, and modelling it as one would have meant
-     * special-casing it in the toolbar by id, the way the block-type `select`
-     * still is.
+     * special-casing it in the toolbar by id.
      *
-     * `select` remains unimplemented, and the block-type control is special-cased
-     * by id rather than being one. Declaring it logs a warning rather than
-     * rendering a plausible-looking button that is not the control asked for.
+     * `select` builds a native `<select>` from `options` / `getValue` /
+     * `applyValue`. The block-type control stays special-cased by id because it
+     * owns formats the host injects at mount time; everything else that is a
+     * preset list (font family, size, line height) uses this type.
      */
     type?: 'button' | 'select' | 'custom';
-    /** Accessible name. Kept constant across states -- the platform announces pressed. */
+    /** Accessible name. Use `labelFor` when the same control does insert versus edit. */
     label: string;
     icon?: IconName;
     /**
@@ -78,10 +103,38 @@ export interface ToolbarItemSpec {
     /** For items needing more than the editor state -- dialogs, mode switches. */
     run?: (ctx: ToolbarContext) => void;
     /**
-     * For `type: 'custom'`: build the control. Required for that type, ignored
-     * otherwise.
+     * For `type: 'custom'` or `type: 'select'`: build the control.
      */
     render?: (ctx: ToolbarContext) => ToolbarControl;
+    /**
+     * For `type: 'select'`: the choices shown. Required for that type. An empty
+     * `value` is the "Default" / clear option.
+     */
+    options?: readonly ToolbarSelectOption[];
+    /**
+     * For `type: 'select'`: the value that matches the selection. Empty string
+     * means no explicit formatting (the Default option).
+     */
+    getValue?: (state: EditorState) => string;
+    /**
+     * For `type: 'select'`: turn a chosen value into a command. Empty string
+     * clears.
+     */
+    applyValue?: (value: string) => Command;
+    /**
+     * Optional CSS modifier for a select (e.g. `wide` for long font names).
+     * Becomes `ol-select--{mod}` on the element.
+     */
+    selectMod?: string;
+    /**
+     * Accessible name that depends on the selection.
+     *
+     * `label` stays the default. Use this when the same control does two
+     * different things -- insert versus edit -- so the name can say which.
+     * Do not use it to bake "pressed" into a toggle; the platform already
+     * announces that.
+     */
+    labelFor?: (state: EditorState) => string;
     isActive?: (state: EditorState) => boolean;
     /** Defaults to asking `command` whether it would apply. */
     isEnabled?: (state: EditorState) => boolean;
@@ -104,10 +157,11 @@ export declare function clearToolbarItems(): void;
  * Order reasoning: history sits leftmost because it is the control an author
  * reaches for under stress and muscle memory puts it at the start of the bar in
  * every office application. Block type comes next because choosing what a
- * paragraph *is* precedes decorating it. Then character marks, then block
- * structure, then insertions, and finally source view -- the one control that
- * changes the editor's mode rather than the document, kept away from the rest
- * so it is not hit by accident.
+ * paragraph *is* precedes decorating it. Font family, size and line height sit
+ * beside it as the next layer of look. Then character marks, alignment, indent,
+ * lists, insertions, and finally source view -- the one control that changes
+ * the editor's mode rather than the document, kept away from the rest so it is
+ * not hit by accident.
  */
 export declare const DEFAULT_LAYOUT: string;
 /**

package/dist/registry.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"registry.d.ts","sourceRoot":"","sources":["../src/registry.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;GAiBG;AAEH,OAAO,KAAK,EAAE,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAA;AAC7D,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAA;AAClD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAE1C,4CAA4C;AAC5C,MAAM,WAAW,cAAc;IAC7B,IAAI,EAAE,UAAU,CAAA;IAChB,kFAAkF;IAClF,IAAI,EAAE,WAAW,CAAA;CAClB;AAED;;;;;;;;;;;GAWG;AACH,MAAM,WAAW,cAAc;IAC7B,yCAAyC;IACzC,EAAE,EAAE,WAAW,CAAA;IACf;;;OAGG;IACH,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,KAAK,IAAI,CAAA;IACrC,8EAA8E;IAC9E,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;CACrB;AAED,MAAM,WAAW,eAAe;IAC9B,wDAAwD;IACxD,EAAE,EAAE,MAAM,CAAA;IACV;;;;;;;;;;;;OAYG;IACH,IAAI,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,QAAQ,CAAA;IACrC,sFAAsF;IACtF,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,CAAC,EAAE,QAAQ,CAAA;IACf;;;OAGG;IACH,IAAI,CAAC,EAAE,QAAQ,GAAG,QAAQ,CAAA;IAC1B,mFAAmF;IACnF,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,8EAA8E;IAC9E,GAAG,CAAC,EAAE,CAAC,GAAG,EAAE,cAAc,KAAK,IAAI,CAAA;IACnC;;;OAGG;IACH,MAAM,CAAC,EAAE,CAAC,GAAG,EAAE,cAAc,KAAK,cAAc,CAAA;IAChD,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,KAAK,OAAO,CAAA;IAC1C,2DAA2D;IAC3D,SAAS,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,KAAK,OAAO,CAAA;IAC3C,oEAAoE;IACpE,QAAQ,CAAC,EAAE,MAAM,CAAA;CAClB;AAcD,wBAAgB,gBAAgB,CAAC,QAAQ,EAAE,MAAM,IAAI,GAAG,MAAM,IAAI,CAGjE;AAcD;;;GAGG;AACH,wBAAgB,mBAAmB,CAAC,IAAI,EAAE,eAAe,GAAG,IAAI,CAG/D;AAED,wBAAgB,cAAc,CAAC,EAAE,EAAE,MAAM,GAAG,eAAe,GAAG,SAAS,CAEtE;AAED,wBAAgB,eAAe,IAAI,eAAe,EAAE,CAEnD;AAED,gDAAgD;AAChD,wBAAgB,iBAAiB,IAAI,IAAI,CAGxC;AAED;;;;;;;;;;GAUG;AACH,eAAO,MAAM,cAAc,QAGgE,CAAA;AAE3F;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,kBAAkB,QAG9B,CAAA"}
+{"version":3,"file":"registry.d.ts","sourceRoot":"","sources":["../src/registry.ts"],"names":[],"mappings":"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"}