@mlightcad/cad-simple-viewer 1.6.3 → 1.7.1

package/lib/ui/AcUiMobileSessionPanel.js

@@ -0,0 +1,822 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __values = (this && this.__values) || function(o) {
+    var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
+    if (m) return m.call(o);
+    if (o && typeof o.length === "number") return {
+        next: function () {
+            if (o && i >= o.length) o = void 0;
+            return { value: o && o[i++], done: !o };
+        }
+    };
+    throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
+};
+import { ML_UI_MOBILE_MAX_WIDTH, ML_UI_SESSION_PANEL_MAX_WIDTH, ML_UI_SESSION_PANEL_WIDTH } from '../editor/global/AcEdUiLayout';
+import { AcUiHelpPanel } from './AcUiHelpPanel';
+/** DOM id of the injected stylesheet. */
+var STYLE_ID = 'ml-mobile-cmd-styles';
+/** Zeroed metric texts used when no frozen readout is available. */
+var ZERO_TEXTS = {
+    length: '0',
+    angle: '0',
+    dx: '0',
+    dy: '0',
+    x: '0',
+    y: '0'
+};
+/**
+ * Shared phone/pad session chrome: bottom panel with title bar (session
+ * accessory or prompt + help + collapse), message row (prompt + keyword chips
+ * when an accessory owns the title), live metrics or a string field, and ✓/×.
+ *
+ * Compact (collapsed) mode is a single row:
+ * accessory (if any), command message in leftover space, expand, ✓/×.
+ * Metrics, string field, and keyword chips stay hidden.
+ */
+var AcUiMobileSessionPanel = /** @class */ (function () {
+    function AcUiMobileSessionPanel(options) {
+        var _this = this;
+        var _a;
+        this.helpPanel = null;
+        this.callbacks = null;
+        this.open = false;
+        this.collapsed = false;
+        this.showMetrics = false;
+        this.showStringInput = false;
+        this.hasBasePoint = false;
+        this.frozenTexts = null;
+        this.frozenHasBasePoint = false;
+        this.compactPromptRaf = 0;
+        this.host = options.host;
+        this.activeClass = (_a = options.activeClass) !== null && _a !== void 0 ? _a : 'ml-mobile-cmd-active';
+        this.isPhoneLayout = options.isPhoneLayout;
+        this.subscribeLayout = options.subscribeLayout;
+        this.helpDocsUrl = options.helpDocsUrl;
+        this.helpHostOpt = options.helpHost;
+        this.labelsFn = options.labels;
+        AcUiMobileSessionPanel.injectCss();
+        this.root = document.createElement('div');
+        this.root.className = 'ml-mobile-cmd';
+        this.root.hidden = true;
+        this.root.setAttribute('aria-hidden', 'true');
+        this.panel = document.createElement('div');
+        this.panel.className = 'ml-mobile-cmd-panel';
+        this.metricButtons = {
+            length: this.makeMetricButton('length'),
+            angle: this.makeMetricButton('angle'),
+            dx: this.makeMetricButton('dx'),
+            dy: this.makeMetricButton('dy'),
+            x: this.makeMetricButton('x'),
+            y: this.makeMetricButton('y')
+        };
+        this.absStack = document.createElement('div');
+        this.absStack.className = 'ml-mobile-cmd-metric-stack';
+        this.absStack.append(this.metricButtons.x, this.metricButtons.y);
+        this.polarStack = document.createElement('div');
+        this.polarStack.className = 'ml-mobile-cmd-metric-stack';
+        this.polarStack.append(this.metricButtons.length, this.metricButtons.angle);
+        this.deltaStack = document.createElement('div');
+        this.deltaStack.className = 'ml-mobile-cmd-metric-stack';
+        this.deltaStack.append(this.metricButtons.dx, this.metricButtons.dy);
+        this.accessoryEl = document.createElement('div');
+        this.accessoryEl.className = 'ml-mobile-cmd-accessory';
+        this.accessoryEl.hidden = true;
+        this.sinkPointer(this.accessoryEl);
+        this.accessoryEl.addEventListener('click', function (e) {
+            if (!_this.collapsed)
+                return;
+            var target = e.target;
+            if (target === null || target === void 0 ? void 0 : target.closest('button'))
+                return;
+            _this.setCollapsed(false);
+        });
+        this.accessoryContentEl = document.createElement('div');
+        this.accessoryContentEl.className = 'ml-mobile-cmd-accessory-content';
+        this.helpBtn = document.createElement('button');
+        this.helpBtn.type = 'button';
+        this.helpBtn.className = 'ml-mobile-cmd-help';
+        this.helpBtn.innerHTML = helpIcon();
+        this.helpBtn.addEventListener('click', function (e) {
+            e.preventDefault();
+            e.stopPropagation();
+            _this.openHelpPanel();
+        });
+        this.sinkPointer(this.helpBtn);
+        this.collapseBtn = document.createElement('button');
+        this.collapseBtn.type = 'button';
+        this.collapseBtn.className = 'ml-mobile-cmd-collapse';
+        this.collapseBtn.innerHTML = collapseIcon();
+        this.collapseBtn.addEventListener('click', function (e) {
+            e.preventDefault();
+            e.stopPropagation();
+            _this.setCollapsed(!_this.collapsed);
+        });
+        this.sinkPointer(this.collapseBtn);
+        this.titleActions = document.createElement('div');
+        this.titleActions.className = 'ml-mobile-cmd-title-actions';
+        this.titleActions.append(this.helpBtn, this.collapseBtn);
+        this.accessoryEl.append(this.accessoryContentEl, this.titleActions);
+        this.promptEl = document.createElement('div');
+        this.promptEl.className = 'ml-mobile-cmd-prompt';
+        this.promptEl.setAttribute('role', 'status');
+        this.compactActions = document.createElement('div');
+        this.compactActions.className = 'ml-mobile-cmd-actions-compact';
+        this.promptRow = document.createElement('div');
+        this.promptRow.className = 'ml-mobile-cmd-prompt-row';
+        this.chipsEl = document.createElement('div');
+        this.chipsEl.className = 'ml-mobile-cmd-chips';
+        this.promptRow.append(this.promptEl, this.chipsEl);
+        this.accessoryObserver = new MutationObserver(function () {
+            if (_this.open)
+                _this.applyMetricVisibility();
+        });
+        this.accessoryObserver.observe(this.accessoryContentEl, {
+            childList: true
+        });
+        if (typeof ResizeObserver !== 'undefined') {
+            this.compactPromptObserver = new ResizeObserver(function () {
+                _this.scheduleCompactPromptVisibility();
+            });
+            this.compactPromptObserver.observe(this.accessoryEl);
+        }
+        this.cancelBtn = document.createElement('button');
+        this.cancelBtn.type = 'button';
+        this.cancelBtn.className = 'ml-mobile-cmd-cancel';
+        this.cancelBtn.innerHTML = cancelIcon();
+        this.cancelBtn.addEventListener('click', function (e) {
+            var _a;
+            e.preventDefault();
+            e.stopPropagation();
+            (_a = _this.callbacks) === null || _a === void 0 ? void 0 : _a.onCancel();
+        });
+        this.sinkPointer(this.cancelBtn);
+        this.confirmBtn = document.createElement('button');
+        this.confirmBtn.type = 'button';
+        this.confirmBtn.className = 'ml-mobile-cmd-confirm';
+        this.confirmBtn.innerHTML = confirmIcon();
+        this.confirmBtn.addEventListener('click', function (e) {
+            var _a;
+            e.preventDefault();
+            e.stopPropagation();
+            if (_this.confirmBtn.disabled)
+                return;
+            (_a = _this.callbacks) === null || _a === void 0 ? void 0 : _a.onConfirm();
+        });
+        this.sinkPointer(this.confirmBtn);
+        this.absActions = document.createElement('div');
+        this.absActions.className = 'ml-mobile-cmd-actions';
+        this.polarActions = document.createElement('div');
+        this.polarActions.className = 'ml-mobile-cmd-actions';
+        this.deltaActions = document.createElement('div');
+        this.deltaActions.className = 'ml-mobile-cmd-actions';
+        this.sharedActions = document.createElement('div');
+        this.sharedActions.className =
+            'ml-mobile-cmd-actions ml-mobile-cmd-actions-shared';
+        this.absGroup = document.createElement('div');
+        this.absGroup.className = 'ml-mobile-cmd-group ml-mobile-cmd-group-abs';
+        this.absGroup.append(this.absStack, this.absActions);
+        this.polarGroup = document.createElement('div');
+        this.polarGroup.className = 'ml-mobile-cmd-group ml-mobile-cmd-group-polar';
+        this.polarGroup.append(this.polarStack, this.polarActions);
+        this.deltaGroup = document.createElement('div');
+        this.deltaGroup.className = 'ml-mobile-cmd-group ml-mobile-cmd-group-delta';
+        this.deltaGroup.append(this.deltaStack, this.deltaActions);
+        this.stringInput = document.createElement('textarea');
+        this.stringInput.className = 'ml-mobile-cmd-string-input';
+        this.stringInput.rows = 1;
+        this.stringInput.autocomplete = 'off';
+        this.stringInput.spellcheck = false;
+        this.stringInput.addEventListener('input', function () {
+            _this.syncStringInputHeight();
+        });
+        this.stringInput.addEventListener('keydown', function (e) {
+            var _a, _b;
+            // Enter inserts a newline. Ctrl/Cmd+Enter commits (same as ✓).
+            if (e.key === 'Enter' && (e.ctrlKey || e.metaKey)) {
+                e.preventDefault();
+                e.stopPropagation();
+                if (_this.confirmBtn.disabled)
+                    return;
+                (_a = _this.callbacks) === null || _a === void 0 ? void 0 : _a.onConfirm();
+            }
+            else if (e.key === 'Escape') {
+                e.preventDefault();
+                e.stopPropagation();
+                (_b = _this.callbacks) === null || _b === void 0 ? void 0 : _b.onCancel();
+            }
+        });
+        this.sinkPointer(this.stringInput);
+        this.stringActions = document.createElement('div');
+        this.stringActions.className = 'ml-mobile-cmd-actions';
+        this.stringGroup = document.createElement('div');
+        this.stringGroup.className = 'ml-mobile-cmd-group ml-mobile-cmd-group-string';
+        this.stringGroup.hidden = true;
+        this.stringGroup.append(this.stringInput, this.stringActions);
+        this.panel.append(this.accessoryEl, this.promptRow, this.absGroup, this.polarGroup, this.deltaGroup, this.stringGroup, this.sharedActions);
+        this.root.appendChild(this.panel);
+        this.sinkPointer(this.panel);
+        this.host.appendChild(this.root);
+        this.refreshLabels();
+    }
+    Object.defineProperty(AcUiMobileSessionPanel.prototype, "isOpen", {
+        /** Whether the panel is currently shown. */
+        get: function () {
+            return this.open;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(AcUiMobileSessionPanel.prototype, "isCollapsed", {
+        /** Whether the panel is in compact (collapsed) mode. */
+        get: function () {
+            return this.collapsed;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(AcUiMobileSessionPanel.prototype, "accessoryHost", {
+        /** Mount slot for custom session accessories (left of help / collapse). */
+        get: function () {
+            return this.accessoryContentEl;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    /**
+     * Shows the panel for an input session.
+     *
+     * @param state - Prompt, keywords, and metric visibility.
+     * @param callbacks - Confirm / cancel / keyword handlers.
+     */
+    AcUiMobileSessionPanel.prototype.show = function (state, callbacks) {
+        var _this = this;
+        var _a, _b, _c, _d;
+        this.callbacks = callbacks;
+        this.open = true;
+        this.showStringInput = state.showStringInput === true;
+        this.showMetrics = this.showStringInput ? false : state.showMetrics;
+        this.root.hidden = false;
+        this.root.setAttribute('aria-hidden', 'false');
+        this.host.classList.add(this.activeClass);
+        this.promptEl.textContent = stripPromptColon(state.prompt);
+        // String mode: ✓ commits typed text (always enabled). Point / actions:
+        // ✓ is empty-Enter / allowNone.
+        this.confirmBtn.disabled = this.showStringInput ? false : !state.allowNone;
+        this.stringInput.value = (_a = state.stringValue) !== null && _a !== void 0 ? _a : '';
+        this.stringInput.placeholder = (_b = state.stringPlaceholder) !== null && _b !== void 0 ? _b : '';
+        this.prepareAccessory();
+        this.renderChips(state.keywords);
+        if (this.frozenTexts) {
+            this.setMetricTexts(this.frozenTexts, this.frozenHasBasePoint);
+        }
+        else {
+            this.setMetricTexts(ZERO_TEXTS, false);
+        }
+        (_c = this.layoutUnsub) === null || _c === void 0 ? void 0 : _c.call(this);
+        this.layoutUnsub = (_d = this.subscribeLayout) === null || _d === void 0 ? void 0 : _d.call(this, function () {
+            if (_this.open) {
+                _this.applyMetricVisibility();
+                if (_this.showStringInput)
+                    _this.syncStringInputHeight();
+            }
+        });
+        this.applyMetricVisibility();
+        this.refreshLabels();
+        if (this.showStringInput) {
+            this.syncStringInputHeight();
+            // Defer so the soft keyboard opens after the panel paints.
+            requestAnimationFrame(function () {
+                if (_this.open && _this.showStringInput) {
+                    _this.syncStringInputHeight();
+                    _this.stringInput.focus();
+                }
+            });
+        }
+    };
+    /**
+     * Updates prompt / keywords / ✓ without tearing down the session.
+     *
+     * @param partial - Fields to update; omitted fields keep current values.
+     */
+    AcUiMobileSessionPanel.prototype.update = function (partial) {
+        if (!this.open)
+            return;
+        if (partial.prompt != null) {
+            this.promptEl.textContent = stripPromptColon(partial.prompt);
+            if (this.collapsed)
+                this.scheduleCompactPromptVisibility();
+        }
+        if (partial.showStringInput != null) {
+            this.showStringInput = partial.showStringInput;
+            if (this.showStringInput)
+                this.showMetrics = false;
+            this.confirmBtn.disabled = this.showStringInput
+                ? false
+                : partial.allowNone != null
+                    ? !partial.allowNone
+                    : this.confirmBtn.disabled;
+            this.applyMetricVisibility();
+        }
+        if (partial.allowNone != null && !this.showStringInput) {
+            this.confirmBtn.disabled = !partial.allowNone;
+        }
+        if (partial.stringValue != null) {
+            this.stringInput.value = partial.stringValue;
+            this.syncStringInputHeight();
+        }
+        if (partial.stringPlaceholder != null) {
+            this.stringInput.placeholder = partial.stringPlaceholder;
+        }
+        if (partial.keywords) {
+            this.renderChips(partial.keywords);
+            this.applyMetricVisibility();
+        }
+        if (partial.showMetrics != null && !this.showStringInput) {
+            this.showMetrics = partial.showMetrics;
+            this.applyMetricVisibility();
+        }
+    };
+    /** Current value of the session string field (empty when not in string mode). */
+    AcUiMobileSessionPanel.prototype.getStringValue = function () {
+        return this.stringInput.value;
+    };
+    /** Focuses the session string field when string input mode is active. */
+    AcUiMobileSessionPanel.prototype.focusStringInput = function () {
+        if (!this.open || !this.showStringInput)
+            return;
+        this.stringInput.focus();
+    };
+    /**
+     * Sizes the string field from 1 to 3 lines of content. Taller content
+     * scrolls inside a 3-line viewport so the right-hand actions/divider stay
+     * matched to the visible field height.
+     */
+    AcUiMobileSessionPanel.prototype.syncStringInputHeight = function () {
+        if (!this.open || !this.showStringInput)
+            return;
+        var el = this.stringInput;
+        var style = getComputedStyle(el);
+        var fontSize = parseFloat(style.fontSize) || 14;
+        var lineHeight = parseFloat(style.lineHeight) || fontSize * 1.35;
+        var padY = (parseFloat(style.paddingTop) || 0) +
+            (parseFloat(style.paddingBottom) || 0);
+        var borderY = (parseFloat(style.borderTopWidth) || 0) +
+            (parseFloat(style.borderBottomWidth) || 0);
+        var minH = lineHeight + padY + borderY;
+        var maxH = lineHeight * 3 + padY + borderY;
+        // Collapse first so scrollHeight reflects the current value.
+        el.style.height = "".concat(minH, "px");
+        el.style.overflowY = 'hidden';
+        var contentH = el.scrollHeight;
+        var next = Math.min(Math.max(contentH, minH), maxH);
+        el.style.height = "".concat(next, "px");
+        el.style.overflowY = contentH > maxH + 0.5 ? 'auto' : 'hidden';
+    };
+    /**
+     * Pushes live metric values (read-only; buttons stay disabled for keypad hook).
+     *
+     * @param hasBasePoint - Whether relative metrics apply.
+     * @param texts - Formatted strings for display.
+     */
+    AcUiMobileSessionPanel.prototype.setMetrics = function (hasBasePoint, texts) {
+        if (!this.open)
+            return;
+        this.hasBasePoint = hasBasePoint;
+        this.frozenTexts = __assign({}, texts);
+        this.frozenHasBasePoint = hasBasePoint;
+        this.setMetricTexts(texts, hasBasePoint);
+        this.applyMetricVisibility();
+    };
+    /** Expands or collapses the panel into compact mode. */
+    AcUiMobileSessionPanel.prototype.setCollapsed = function (collapsed) {
+        if (this.collapsed === collapsed)
+            return;
+        this.collapsed = collapsed;
+        this.panel.classList.toggle('is-collapsed', collapsed);
+        this.collapseBtn.innerHTML = collapsed ? expandIcon() : collapseIcon();
+        this.refreshCollapseLabel();
+        if (this.open)
+            this.applyMetricVisibility();
+    };
+    /** Shows the accessory / title row (custom content slot + help + collapse). */
+    AcUiMobileSessionPanel.prototype.prepareAccessory = function () {
+        this.accessoryEl.hidden = false;
+        // Remounts can restore widgets after `show()` already ran placement against
+        // an empty slot — re-sync so the prompt stays on the message row.
+        if (this.open)
+            this.applyMetricVisibility();
+    };
+    /** Clears custom accessory content; help / collapse stay while open. */
+    AcUiMobileSessionPanel.prototype.clearAccessory = function () {
+        this.accessoryContentEl.replaceChildren();
+        if (this.open)
+            this.applyMetricVisibility();
+    };
+    /**
+     * Hides the panel without clearing accessory widgets.
+     *
+     * Draw-style (and other) session accessories outlive individual prompts —
+     * `endMobilePrompt` / `beginMobilePrompt` pairs between picks must not wipe
+     * them. Ownership stays with the accessory mount lifecycle
+     * ({@link clearAccessory} via the session-accessory controller).
+     */
+    AcUiMobileSessionPanel.prototype.hide = function () {
+        var _a;
+        this.open = false;
+        this.callbacks = null;
+        this.showStringInput = false;
+        this.stringInput.value = '';
+        this.stringInput.placeholder = '';
+        this.stringInput.style.height = '';
+        this.stringInput.style.overflowY = '';
+        this.accessoryEl.hidden = true;
+        if (this.compactPromptRaf) {
+            cancelAnimationFrame(this.compactPromptRaf);
+            this.compactPromptRaf = 0;
+        }
+        this.setCollapsed(false);
+        (_a = this.layoutUnsub) === null || _a === void 0 ? void 0 : _a.call(this);
+        this.layoutUnsub = undefined;
+        this.root.hidden = true;
+        this.root.setAttribute('aria-hidden', 'true');
+        this.host.classList.remove(this.activeClass);
+    };
+    /** Re-applies metric / action aria labels from {@link labels}. */
+    AcUiMobileSessionPanel.prototype.refreshLabels = function () {
+        var _a;
+        var t = this.labelsFn();
+        this.metricButtons.length.querySelector('.ml-mobile-cmd-metric-label').textContent = t.length;
+        this.metricButtons.angle.querySelector('.ml-mobile-cmd-metric-label').textContent = t.angle;
+        this.metricButtons.dx.querySelector('.ml-mobile-cmd-metric-label').textContent = t.dx;
+        this.metricButtons.dy.querySelector('.ml-mobile-cmd-metric-label').textContent = t.dy;
+        this.metricButtons.x.querySelector('.ml-mobile-cmd-metric-label').textContent = t.x;
+        this.metricButtons.y.querySelector('.ml-mobile-cmd-metric-label').textContent = t.y;
+        this.confirmBtn.setAttribute('aria-label', t.confirm);
+        this.cancelBtn.setAttribute('aria-label', t.cancel);
+        this.helpBtn.setAttribute('aria-label', t.help);
+        this.refreshCollapseLabel();
+        (_a = this.helpPanel) === null || _a === void 0 ? void 0 : _a.setLabels({ title: t.help, back: t.back });
+    };
+    /** Removes DOM. */
+    AcUiMobileSessionPanel.prototype.dispose = function () {
+        var _a, _b, _c;
+        this.hide();
+        if (this.compactPromptRaf) {
+            cancelAnimationFrame(this.compactPromptRaf);
+            this.compactPromptRaf = 0;
+        }
+        (_a = this.compactPromptObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
+        this.compactPromptObserver = undefined;
+        (_b = this.accessoryObserver) === null || _b === void 0 ? void 0 : _b.disconnect();
+        this.accessoryObserver = undefined;
+        (_c = this.helpPanel) === null || _c === void 0 ? void 0 : _c.dispose();
+        this.helpPanel = null;
+        this.root.remove();
+    };
+    /** True when custom session widgets are mounted in the accessory slot. */
+    AcUiMobileSessionPanel.prototype.hasAccessoryWidgets = function () {
+        return this.accessoryContentEl.childElementCount > 0;
+    };
+    /**
+     * Places the command prompt vs session accessory on the title row.
+     *
+     * Expanded:
+     * - No accessory widgets → title shows the prompt; chips stay on the message
+     *   row (second row) when present.
+     * - With accessory widgets → title always shows the accessory; the message
+     *   row shows the prompt and keyword chips together.
+     *
+     * Compact mode keeps a single row:
+     * `[accessory?] [prompt (remaining space)] [expand] [✓ ×]`.
+     * Keyword chips never appear. The prompt uses leftover space only (ellipsis
+     * on overflow) and is hidden when less than one third of the text fits.
+     */
+    AcUiMobileSessionPanel.prototype.syncPromptPlacement = function (collapsed) {
+        var hasWidgets = this.hasAccessoryWidgets();
+        var promptInTitle = !hasWidgets;
+        var hasChips = this.chipsEl.childElementCount > 0;
+        this.panel.classList.toggle('is-prompt-in-title', promptInTitle);
+        this.helpBtn.hidden = collapsed;
+        this.accessoryEl.hidden = false;
+        this.accessoryEl.appendChild(this.titleActions);
+        this.chipsEl.hidden = collapsed || !hasChips;
+        this.promptRow.classList.remove('is-in-title');
+        if (collapsed) {
+            // Compact: prompt sits after accessory content, before expand / actions.
+            this.promptEl.hidden = false;
+            this.accessoryEl.insertBefore(this.promptEl, this.titleActions);
+            this.promptRow.appendChild(this.chipsEl);
+            if (this.promptRow.parentElement === this.accessoryEl) {
+                this.panel.insertBefore(this.promptRow, this.absGroup);
+            }
+            this.promptRow.hidden = true;
+            this.accessoryEl.appendChild(this.compactActions);
+            this.compactActions.append(this.cancelBtn, this.confirmBtn);
+            this.scheduleCompactPromptVisibility();
+            return;
+        }
+        this.promptEl.hidden = false;
+        this.compactActions.replaceChildren();
+        if (this.compactActions.parentElement === this.accessoryEl) {
+            this.compactActions.remove();
+        }
+        this.panel.classList.remove('is-compact-prompt-hidden');
+        // Message row always sits below the title bar as a panel child.
+        if (this.promptRow.parentElement === this.accessoryEl) {
+            this.panel.insertBefore(this.promptRow, this.absGroup);
+        }
+        if (promptInTitle) {
+            // Title: prompt + help/collapse. Chips (if any) stay on the message row.
+            this.accessoryEl.insertBefore(this.promptEl, this.titleActions);
+            this.promptRow.appendChild(this.chipsEl);
+            this.promptRow.hidden = !hasChips;
+        }
+        else {
+            // Title: accessory widgets + help/collapse. Message row: prompt + chips.
+            this.promptRow.append(this.promptEl, this.chipsEl);
+            this.promptRow.hidden = false;
+        }
+    };
+    /** Defers compact prompt show/hide until after flex layout settles. */
+    AcUiMobileSessionPanel.prototype.scheduleCompactPromptVisibility = function () {
+        var _this = this;
+        if (!this.collapsed || !this.open)
+            return;
+        if (this.compactPromptRaf)
+            cancelAnimationFrame(this.compactPromptRaf);
+        this.compactPromptRaf = requestAnimationFrame(function () {
+            _this.compactPromptRaf = 0;
+            _this.syncCompactPromptVisibility();
+        });
+    };
+    /**
+     * In compact mode the prompt only uses leftover width after accessory,
+     * expand, and ✓/×. Hide it when that width is under one third of the full
+     * message text width (partial text uses CSS ellipsis). When hidden, the
+     * accessory stays left-aligned and expand / ✓/× stay right-aligned.
+     *
+     * Avoids temporarily unhiding the prompt to measure — that would thrash
+     * layout and re-enter via {@link ResizeObserver} every frame.
+     */
+    AcUiMobileSessionPanel.prototype.syncCompactPromptVisibility = function () {
+        var _a, _b;
+        if (!this.collapsed || !this.open) {
+            this.panel.classList.remove('is-compact-prompt-hidden');
+            return;
+        }
+        var text = (_b = (_a = this.promptEl.textContent) === null || _a === void 0 ? void 0 : _a.trim()) !== null && _b !== void 0 ? _b : '';
+        if (!text) {
+            this.applyCompactPromptHidden(true);
+            return;
+        }
+        var fullWidth = this.measurePromptTextWidth();
+        if (fullWidth <= 0) {
+            this.applyCompactPromptHidden(false);
+            return;
+        }
+        var available = this.measureCompactPromptAvailableWidth();
+        this.applyCompactPromptHidden(available < fullWidth / 3);
+    };
+    /** Applies compact prompt visibility only when the decision changes. */
+    AcUiMobileSessionPanel.prototype.applyCompactPromptHidden = function (hide) {
+        if (this.promptEl.hidden === hide &&
+            this.panel.classList.contains('is-compact-prompt-hidden') === hide) {
+            return;
+        }
+        this.promptEl.hidden = hide;
+        this.panel.classList.toggle('is-compact-prompt-hidden', hide);
+    };
+    /**
+     * Leftover width for the compact prompt. Uses the live flex slot when the
+     * prompt is visible; otherwise infers space from the row minus siblings so
+     * we never flash the prompt back on just to measure.
+     */
+    AcUiMobileSessionPanel.prototype.measureCompactPromptAvailableWidth = function () {
+        var e_1, _a;
+        var _this = this;
+        if (!this.promptEl.hidden) {
+            return this.promptEl.clientWidth;
+        }
+        var rowWidth = this.accessoryEl.clientWidth;
+        var rowStyle = getComputedStyle(this.accessoryEl);
+        var gap = parseFloat(rowStyle.columnGap || rowStyle.gap || '0') || 0;
+        var siblings = Array.from(this.accessoryEl.children).filter(function (el) { return el !== _this.promptEl && !el.hidden; });
+        var used = 0;
+        try {
+            for (var siblings_1 = __values(siblings), siblings_1_1 = siblings_1.next(); !siblings_1_1.done; siblings_1_1 = siblings_1.next()) {
+                var el = siblings_1_1.value;
+                used += el.getBoundingClientRect().width;
+            }
+        }
+        catch (e_1_1) { e_1 = { error: e_1_1 }; }
+        finally {
+            try {
+                if (siblings_1_1 && !siblings_1_1.done && (_a = siblings_1.return)) _a.call(siblings_1);
+            }
+            finally { if (e_1) throw e_1.error; }
+        }
+        // Showing the prompt inserts one more flex item → one extra gap.
+        return Math.max(0, rowWidth - used - gap * siblings.length);
+    };
+    /** Intrinsic single-line width of the current prompt text. */
+    AcUiMobileSessionPanel.prototype.measurePromptTextWidth = function () {
+        var probe = document.createElement('span');
+        var style = getComputedStyle(this.promptEl);
+        probe.textContent = this.promptEl.textContent;
+        // Prefer longhand font props — `font` shorthand is empty in some engines.
+        var font = style.font ||
+            "".concat(style.fontWeight, " ").concat(style.fontSize, " ").concat(style.fontFamily).trim();
+        probe.style.cssText = [
+            'position:absolute',
+            'visibility:hidden',
+            'pointer-events:none',
+            'white-space:nowrap',
+            "font:".concat(font),
+            "letter-spacing:".concat(style.letterSpacing),
+            "text-transform:".concat(style.textTransform)
+        ].join(';');
+        document.body.appendChild(probe);
+        var width = probe.getBoundingClientRect().width;
+        probe.remove();
+        return width;
+    };
+    AcUiMobileSessionPanel.prototype.refreshCollapseLabel = function () {
+        var t = this.labelsFn();
+        this.collapseBtn.setAttribute('aria-label', this.collapsed ? t.expand : t.collapse);
+        this.collapseBtn.setAttribute('aria-expanded', String(!this.collapsed));
+    };
+    AcUiMobileSessionPanel.prototype.makeMetricButton = function (id) {
+        var btn = document.createElement('button');
+        btn.type = 'button';
+        btn.className = 'ml-mobile-cmd-metric';
+        btn.dataset.metric = id;
+        btn.disabled = true;
+        var label = document.createElement('span');
+        label.className = 'ml-mobile-cmd-metric-label';
+        var value = document.createElement('span');
+        value.className = 'ml-mobile-cmd-metric-value';
+        value.textContent = '0';
+        btn.append(label, value);
+        return btn;
+    };
+    AcUiMobileSessionPanel.prototype.setMetricTexts = function (texts, hasBasePoint) {
+        this.metricButtons.length.querySelector('.ml-mobile-cmd-metric-value').textContent = texts.length;
+        this.metricButtons.angle.querySelector('.ml-mobile-cmd-metric-value').textContent = texts.angle;
+        this.metricButtons.dx.querySelector('.ml-mobile-cmd-metric-value').textContent = texts.dx;
+        this.metricButtons.dy.querySelector('.ml-mobile-cmd-metric-value').textContent = texts.dy;
+        this.metricButtons.x.querySelector('.ml-mobile-cmd-metric-value').textContent = texts.x;
+        this.metricButtons.y.querySelector('.ml-mobile-cmd-metric-value').textContent = texts.y;
+        this.hasBasePoint = hasBasePoint;
+    };
+    AcUiMobileSessionPanel.prototype.applyMetricVisibility = function () {
+        var stringMode = this.showStringInput;
+        var relative = !stringMode && this.showMetrics && this.hasBasePoint;
+        var absolute = !stringMode && this.showMetrics && !this.hasBasePoint;
+        var phone = this.isPhoneLayout();
+        var collapsed = this.collapsed;
+        this.metricButtons.length.hidden = !relative;
+        this.metricButtons.angle.hidden = !relative;
+        this.metricButtons.dx.hidden = !relative;
+        this.metricButtons.dy.hidden = !relative;
+        this.metricButtons.x.hidden = !absolute;
+        this.metricButtons.y.hidden = !absolute;
+        this.panel.classList.toggle('is-relative', relative && !collapsed);
+        this.panel.classList.toggle('is-absolute', absolute && !collapsed);
+        this.panel.classList.toggle('is-string-input', stringMode && !collapsed);
+        this.panel.classList.toggle('is-actions-only', !collapsed && !relative && !absolute && !stringMode);
+        this.panel.classList.toggle('is-collapsed', collapsed);
+        this.polarGroup.hidden = collapsed || !relative;
+        this.deltaGroup.hidden = collapsed || !relative;
+        this.absStack.hidden = !absolute;
+        this.absGroup.hidden = collapsed
+            ? true
+            : stringMode
+                ? true
+                : phone
+                    ? relative
+                    : !absolute;
+        this.stringGroup.hidden = collapsed || !stringMode;
+        this.chipsEl.hidden = collapsed || this.chipsEl.childElementCount === 0;
+        this.syncPromptPlacement(collapsed);
+        if (collapsed) {
+            // Actions already placed by syncPromptPlacement.
+        }
+        else if (stringMode) {
+            if (phone) {
+                this.stringActions.append(this.cancelBtn, this.confirmBtn);
+            }
+            else {
+                this.sharedActions.append(this.cancelBtn, this.confirmBtn);
+            }
+        }
+        else if (phone && relative) {
+            this.polarActions.appendChild(this.cancelBtn);
+            this.deltaActions.appendChild(this.confirmBtn);
+        }
+        else if (phone) {
+            this.absActions.append(this.cancelBtn, this.confirmBtn);
+        }
+        else {
+            this.sharedActions.append(this.cancelBtn, this.confirmBtn);
+        }
+    };
+    AcUiMobileSessionPanel.prototype.renderChips = function (keywords) {
+        var e_2, _a;
+        var _this = this;
+        this.chipsEl.replaceChildren();
+        this.chipsEl.hidden = this.collapsed || keywords.length === 0;
+        var _loop_1 = function (kw) {
+            var chip = document.createElement('button');
+            chip.type = 'button';
+            chip.className = 'ml-mobile-cmd-chip';
+            chip.textContent = kw.displayName;
+            chip.disabled = !kw.enabled;
+            chip.addEventListener('click', function (e) {
+                var _a;
+                e.preventDefault();
+                e.stopPropagation();
+                if (!kw.enabled)
+                    return;
+                (_a = _this.callbacks) === null || _a === void 0 ? void 0 : _a.onKeyword(kw.id);
+            });
+            this_1.sinkPointer(chip);
+            this_1.chipsEl.appendChild(chip);
+        };
+        var this_1 = this;
+        try {
+            for (var keywords_1 = __values(keywords), keywords_1_1 = keywords_1.next(); !keywords_1_1.done; keywords_1_1 = keywords_1.next()) {
+                var kw = keywords_1_1.value;
+                _loop_1(kw);
+            }
+        }
+        catch (e_2_1) { e_2 = { error: e_2_1 }; }
+        finally {
+            try {
+                if (keywords_1_1 && !keywords_1_1.done && (_a = keywords_1.return)) _a.call(keywords_1);
+            }
+            finally { if (e_2) throw e_2.error; }
+        }
+    };
+    AcUiMobileSessionPanel.prototype.openHelpPanel = function () {
+        if (!this.helpPanel) {
+            var host = typeof this.helpHostOpt === 'function'
+                ? this.helpHostOpt()
+                : this.helpHostOpt;
+            this.helpPanel = new AcUiHelpPanel(host ? { host: host } : undefined);
+        }
+        var t = this.labelsFn();
+        this.helpPanel.showDocs({
+            url: this.helpDocsUrl(),
+            labels: { title: t.help, back: t.back }
+        });
+    };
+    AcUiMobileSessionPanel.prototype.sinkPointer = function (el) {
+        el.addEventListener('pointerdown', function (e) {
+            e.stopPropagation();
+        });
+    };
+    AcUiMobileSessionPanel.injectCss = function () {
+        if (typeof document === 'undefined')
+            return;
+        var style = document.getElementById(STYLE_ID);
+        if (!style) {
+            style = document.createElement('style');
+            style.id = STYLE_ID;
+            document.head.appendChild(style);
+        }
+        style.textContent = MOBILE_CMD_CSS;
+    };
+    return AcUiMobileSessionPanel;
+}());
+export { AcUiMobileSessionPanel };
+/** Strips a trailing colon from prompt text. */
+function stripPromptColon(message) {
+    return message.trim().replace(/[：:]\s*$/, '');
+}
+function helpIcon() {
+    return '<svg viewBox="0 0 24 24" width="18" height="18" aria-hidden="true"><path fill="currentColor" d="M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm0 15.2a1.2 1.2 0 1 1 0-2.4 1.2 1.2 0 0 1 0 2.4zm1.6-5.35c-.62.36-1 .9-1 1.55h-1.5c0-1.18.6-2.05 1.45-2.55.62-.36.95-.7.95-1.25 0-.7-.55-1.2-1.4-1.2-.9 0-1.45.5-1.55 1.3H8.9C9.1 7.95 10.35 7 12.1 7c1.85 0 3.15 1.05 3.15 2.55 0 .95-.5 1.7-1.65 2.3z"/></svg>';
+}
+function collapseIcon() {
+    return '<svg viewBox="0 0 24 24" width="18" height="18" aria-hidden="true"><path fill="currentColor" d="M7.41 8.59 12 13.17l4.59-4.58L18 10l-6 6-6-6z"/></svg>';
+}
+function expandIcon() {
+    return '<svg viewBox="0 0 24 24" width="18" height="18" aria-hidden="true"><path fill="currentColor" d="M7.41 15.41 12 10.83l4.59 4.58L18 14l-6-6-6 6z"/></svg>';
+}
+function cancelIcon() {
+    return '<svg viewBox="0 0 24 24" width="18" height="18" aria-hidden="true"><path fill="currentColor" d="M18.3 5.71a1 1 0 0 0-1.41 0L12 10.59 7.11 5.7a1 1 0 0 0-1.41 1.42L10.59 12l-4.9 4.89a1 1 0 1 0 1.42 1.42L12 13.41l4.89 4.9a1 1 0 0 0 1.42-1.42L13.41 12l4.9-4.89a1 1 0 0 0-.01-1.4z"/></svg>';
+}
+function confirmIcon() {
+    return '<svg viewBox="0 0 24 24" width="18" height="18" aria-hidden="true"><path fill="currentColor" d="M9.55 18.2 3.8 12.45l1.4-1.4 4.35 4.36 9.25-9.26 1.4 1.41z"/></svg>';
+}
+/** CSS for the shared mobile session panel. */
+var MOBILE_CMD_CSS = "\n  .ml-mobile-cmd {\n    pointer-events: none;\n  }\n  .ml-mobile-cmd-panel {\n    pointer-events: auto;\n    position: fixed;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    z-index: 40;\n    display: flex;\n    flex-direction: column;\n    gap: 8px;\n    padding: 10px 12px calc(10px + env(safe-area-inset-bottom, 0px));\n    background: var(--ml-ui-bg, rgba(28, 30, 34, 0.96));\n    color: var(--ml-ui-text, #e8eaed);\n    border-top: 1px solid var(--ml-ui-border, rgba(255, 255, 255, 0.12));\n    box-shadow: 0 -8px 24px rgba(0, 0, 0, 0.35);\n    box-sizing: border-box;\n  }\n  .ml-mobile-cmd-panel.is-collapsed {\n    height: calc(\n      var(--ml-mobile-cmd-collapsed-height, 56px) + env(safe-area-inset-bottom, 0px)\n    );\n    min-height: calc(\n      var(--ml-mobile-cmd-collapsed-height, 56px) + env(safe-area-inset-bottom, 0px)\n    );\n    padding: 0 12px env(safe-area-inset-bottom, 0px);\n    gap: 0;\n    justify-content: center;\n  }\n  .ml-mobile-cmd-panel.is-collapsed .ml-mobile-cmd-accessory {\n    padding-bottom: 0;\n    border-bottom: 0;\n    flex: 1;\n    min-width: 0;\n    flex-wrap: nowrap;\n  }\n  /* Accessory keeps intrinsic width; prompt may not steal space from it. */\n  .ml-mobile-cmd-panel.is-collapsed .ml-mobile-cmd-accessory-content {\n    flex: 0 0 auto;\n    min-width: 0;\n  }\n  .ml-mobile-cmd-prompt-row {\n    display: flex;\n    flex-wrap: wrap;\n    align-items: center;\n    gap: 8px;\n    min-width: 0;\n  }\n  .ml-mobile-cmd-prompt-row[hidden] {\n    display: none;\n  }\n  .ml-mobile-cmd-prompt-row:not([hidden]) {\n    box-sizing: border-box;\n    min-height: 32px;\n    padding-top: 4px;\n    padding-bottom: 4px;\n    border-bottom: 1px solid var(--ml-ui-border, rgba(255, 255, 255, 0.12));\n  }\n  .ml-mobile-cmd-prompt {\n    flex: 1 1 10em;\n    min-width: min(100%, 8em);\n    box-sizing: border-box;\n    padding: 0;\n    border: 0;\n    border-radius: 0;\n    background: transparent;\n    color: var(--ml-ui-text, #e8eaed);\n    font-size: 12px;\n    font-weight: 500;\n    line-height: 1.4;\n    white-space: normal;\n    overflow-wrap: anywhere;\n    word-break: break-word;\n  }\n  .ml-mobile-cmd-accessory > .ml-mobile-cmd-prompt {\n    flex: 1 1 auto;\n    min-width: 0;\n  }\n  /* Compact: fill leftover space only; ellipsis when truncated. */\n  .ml-mobile-cmd-panel.is-collapsed .ml-mobile-cmd-prompt {\n    flex: 1 1 0;\n    min-width: 0;\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    overflow-wrap: normal;\n    word-break: normal;\n  }\n  .ml-mobile-cmd-panel.is-collapsed .ml-mobile-cmd-prompt[hidden] {\n    display: none;\n  }\n  .ml-mobile-cmd-panel.is-collapsed .ml-mobile-cmd-chips {\n    display: none !important;\n  }\n  .ml-mobile-cmd-actions-compact {\n    display: none;\n    flex-direction: row;\n    align-items: center;\n    justify-content: center;\n    gap: 8px;\n    flex: 0 0 auto;\n    margin-left: 8px;\n    padding-left: 0;\n    border-left: 0;\n  }\n  .ml-mobile-cmd-panel.is-collapsed .ml-mobile-cmd-actions-compact {\n    display: flex;\n  }\n  .ml-mobile-cmd-panel.is-collapsed .ml-mobile-cmd-help[hidden] {\n    display: none;\n  }\n  .ml-mobile-cmd-panel.is-collapsed .ml-mobile-cmd-title-actions {\n    margin-left: 0;\n    flex: 0 0 auto;\n  }\n  /* No prompt: accessory left, expand + \u2713/\u00D7 right. */\n  .ml-mobile-cmd-panel.is-collapsed.is-compact-prompt-hidden .ml-mobile-cmd-title-actions {\n    margin-left: auto;\n  }\n  .ml-mobile-cmd-group {\n    display: flex;\n    align-items: stretch;\n    gap: 8px;\n    min-width: 0;\n  }\n  .ml-mobile-cmd-group[hidden] {\n    display: none;\n  }\n  .ml-mobile-cmd-string-input {\n    flex: 1;\n    min-width: 0;\n    box-sizing: border-box;\n    margin: 0;\n    padding: 8px 10px;\n    border: 1px solid var(--ml-ui-border, rgba(255, 255, 255, 0.16));\n    border-radius: 8px;\n    background: var(--ml-ui-bg-elevated, rgba(255, 255, 255, 0.06));\n    color: var(--ml-ui-text, #e8eaed);\n    font: inherit;\n    font-size: 14px;\n    line-height: 1.35;\n    outline: none;\n    resize: none;\n    overflow-y: hidden;\n    white-space: pre-wrap;\n    word-break: break-word;\n    /* 1-line floor; JS grows up to 3 lines via syncStringInputHeight. */\n    height: calc(1.35em + 16px + 2px);\n  }\n  .ml-mobile-cmd-string-input:focus {\n    border-color: var(--ml-ui-accent, #08e8de);\n  }\n  .ml-mobile-cmd-string-input::placeholder {\n    color: var(--ml-ui-muted, #9aa0a6);\n  }\n  .ml-mobile-cmd-panel.is-relative .ml-mobile-cmd-group-polar {\n    border-bottom: 1px solid var(--ml-ui-border, rgba(255, 255, 255, 0.12));\n    padding-bottom: 0;\n  }\n  .ml-mobile-cmd-group:not(.ml-mobile-cmd-group-string):not(\n      :has(.ml-mobile-cmd-metric-stack:not([hidden]))\n    ) {\n    justify-content: flex-end;\n  }\n  .ml-mobile-cmd-group-string {\n    align-items: stretch;\n  }\n  .ml-mobile-cmd-group-string .ml-mobile-cmd-actions {\n    align-self: stretch;\n    align-items: center;\n    border-left: 1px solid var(--ml-ui-border, rgba(255, 255, 255, 0.12));\n    padding-left: 12px;\n  }\n  .ml-mobile-cmd-metric-stack {\n    flex: 1;\n    min-width: 0;\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    gap: 2px;\n  }\n  .ml-mobile-cmd-metric-stack[hidden] {\n    display: none;\n  }\n  .ml-mobile-cmd-actions {\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    justify-content: center;\n    gap: 10px;\n    flex: 0 0 auto;\n    align-self: stretch;\n    padding-left: 12px;\n    border-left: 1px solid var(--ml-ui-border, rgba(255, 255, 255, 0.12));\n  }\n  .ml-mobile-cmd-group:not(.ml-mobile-cmd-group-string):not(\n      :has(.ml-mobile-cmd-metric-stack:not([hidden]))\n    )\n    .ml-mobile-cmd-actions {\n    border-left: 0;\n    padding-left: 0;\n  }\n  .ml-mobile-cmd-metric {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    gap: 8px;\n    margin: 0;\n    padding: 2px 0;\n    border: 0;\n    background: transparent;\n    color: inherit;\n    font: inherit;\n    text-align: left;\n    min-height: 28px;\n    min-width: 0;\n    width: 100%;\n  }\n  .ml-mobile-cmd-metric[hidden] {\n    display: none;\n  }\n  .ml-mobile-cmd-metric-label {\n    flex: 0 0 auto;\n    color: var(--ml-ui-muted, #9aa0a6);\n    font-size: 12px;\n  }\n  .ml-mobile-cmd-metric-value {\n    min-width: 0;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n    text-align: right;\n    font-variant-numeric: tabular-nums;\n    font-size: 13px;\n  }\n  .ml-mobile-cmd-accessory {\n    display: flex;\n    flex-wrap: wrap;\n    align-items: center;\n    gap: 8px;\n    min-height: 32px;\n  }\n  .ml-mobile-cmd-accessory:not([hidden]) {\n    padding-bottom: 8px;\n    border-bottom: 1px solid var(--ml-ui-border, rgba(255, 255, 255, 0.12));\n  }\n  .ml-mobile-cmd-accessory[hidden] {\n    display: none;\n  }\n  .ml-mobile-cmd-accessory-content {\n    flex: 1;\n    min-width: 0;\n    display: flex;\n    align-items: center;\n    gap: 8px;\n  }\n  .ml-mobile-cmd-accessory-content:empty {\n    display: none;\n  }\n  .ml-mobile-cmd-title-actions {\n    display: flex;\n    flex: 0 0 auto;\n    align-items: center;\n    gap: 0;\n    margin-left: auto;\n  }\n  .ml-mobile-cmd-help,\n  .ml-mobile-cmd-collapse {\n    box-sizing: border-box;\n    flex: 0 0 auto;\n    margin: 0;\n    width: 32px;\n    height: 32px;\n    padding: 0;\n    border: 0;\n    border-radius: 50%;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    background: transparent;\n    color: var(--ml-ui-muted, #9aa0a6);\n    cursor: pointer;\n    line-height: 0;\n  }\n  .ml-mobile-cmd-help:hover,\n  .ml-mobile-cmd-help:focus-visible,\n  .ml-mobile-cmd-collapse:hover,\n  .ml-mobile-cmd-collapse:focus-visible {\n    color: var(--ml-ui-accent, #08e8de);\n  }\n  .ml-mobile-cmd-help svg,\n  .ml-mobile-cmd-collapse svg {\n    display: block;\n    width: 18px;\n    height: 18px;\n  }\n  .ml-mobile-cmd-chips {\n    display: flex;\n    flex-wrap: wrap;\n    align-items: center;\n    gap: 6px;\n    flex: 0 1 auto;\n    min-width: 0;\n  }\n  .ml-mobile-cmd-chips:not([hidden]) {\n    padding: 0;\n    border: 0;\n  }\n  .ml-mobile-cmd-chips[hidden] {\n    display: none;\n  }\n  .ml-mobile-cmd-chip {\n    min-height: 32px;\n    padding: 4px 10px;\n    border-radius: 16px;\n    border: 1px solid var(--ml-ui-border, rgba(255, 255, 255, 0.16));\n    background: var(--ml-ui-bg-elevated, rgba(255, 255, 255, 0.06));\n    color: var(--ml-ui-accent, #08e8de);\n    font-size: 13px;\n  }\n  .ml-mobile-cmd-chip:disabled {\n    opacity: 0.45;\n  }\n  .ml-mobile-cmd-cancel,\n  .ml-mobile-cmd-confirm {\n    box-sizing: border-box;\n    flex: 0 0 36px;\n    align-self: center;\n    margin: 0;\n    width: 36px;\n    height: 36px;\n    padding: 0;\n    border-radius: 50%;\n    border: 0;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    line-height: 0;\n    cursor: pointer;\n    color: #fff;\n  }\n  .ml-mobile-cmd-cancel svg,\n  .ml-mobile-cmd-confirm svg {\n    display: block;\n    width: 18px;\n    height: 18px;\n  }\n  .ml-mobile-cmd-cancel {\n    background: #5c6370;\n  }\n  .ml-mobile-cmd-confirm {\n    background: var(--ml-ui-accent, #1a8cff);\n  }\n  .ml-mobile-cmd-confirm:disabled {\n    opacity: 0.35;\n    cursor: default;\n  }\n  .ml-mobile-cmd-actions-shared {\n    display: none;\n  }\n  .ml-mobile-cmd-panel.is-collapsed .ml-mobile-cmd-actions-shared {\n    display: none !important;\n  }\n  @media (min-width: ".concat(ML_UI_SESSION_PANEL_WIDTH, "px) {\n    .ml-mobile-cmd-metric-stack {\n      flex-direction: row;\n      align-items: center;\n      gap: 16px;\n    }\n    .ml-mobile-cmd-metric {\n      flex: 1;\n    }\n  }\n  @media (min-width: ").concat(ML_UI_MOBILE_MAX_WIDTH + 1, "px) {\n    .ml-mobile-cmd-panel {\n      left: 50%;\n      right: auto;\n      width: ").concat(ML_UI_SESSION_PANEL_WIDTH, "px;\n      max-width: ").concat(ML_UI_SESSION_PANEL_MAX_WIDTH, ";\n      transform: translateX(-50%);\n      border-radius: 12px 12px 0 0;\n      border: 1px solid var(--ml-ui-border, rgba(255, 255, 255, 0.12));\n      border-bottom: 0;\n    }\n    .ml-mobile-cmd-panel.is-collapsed {\n      width: ").concat(ML_UI_SESSION_PANEL_WIDTH, "px;\n      max-width: ").concat(ML_UI_SESSION_PANEL_MAX_WIDTH, ";\n    }\n    .ml-mobile-cmd-group .ml-mobile-cmd-actions {\n      display: none;\n    }\n    .ml-mobile-cmd-actions-shared {\n      display: flex;\n      flex-direction: row;\n      align-items: center;\n      justify-content: center;\n    }\n    .ml-mobile-cmd-panel.is-absolute .ml-mobile-cmd-group-abs {\n      align-items: center;\n    }\n    .ml-mobile-cmd-panel.is-absolute .ml-mobile-cmd-actions-shared {\n      align-self: center;\n    }\n    .ml-mobile-cmd-panel.is-relative:not([hidden]),\n    .ml-mobile-cmd-panel.is-absolute:not([hidden]) {\n      display: grid;\n      grid-template-columns: 1fr auto;\n      align-items: stretch;\n      row-gap: 0;\n      column-gap: 8px;\n    }\n    .ml-mobile-cmd-panel.is-relative {\n      grid-template-areas:\n        'accessory accessory'\n        'prompt prompt'\n        'polar shared'\n        'delta shared';\n    }\n    .ml-mobile-cmd-panel.is-absolute {\n      grid-template-areas:\n        'accessory accessory'\n        'prompt prompt'\n        'abs shared';\n    }\n    .ml-mobile-cmd-panel.is-string-input {\n      display: grid;\n      grid-template-columns: 1fr auto;\n      align-items: stretch;\n      row-gap: 0;\n      column-gap: 8px;\n      grid-template-areas:\n        'accessory accessory'\n        'prompt prompt'\n        'string shared';\n    }\n    .ml-mobile-cmd-group-polar { grid-area: polar; }\n    .ml-mobile-cmd-group-delta { grid-area: delta; }\n    .ml-mobile-cmd-group-abs { grid-area: abs; }\n    .ml-mobile-cmd-group-string { grid-area: string; }\n    .ml-mobile-cmd-actions-shared { grid-area: shared; }\n    .ml-mobile-cmd-accessory { grid-area: accessory; }\n    .ml-mobile-cmd-prompt-row { grid-area: prompt; }\n    .ml-mobile-cmd-panel.is-string-input .ml-mobile-cmd-group-string {\n      align-items: stretch;\n    }\n    .ml-mobile-cmd-panel.is-string-input .ml-mobile-cmd-actions-shared {\n      align-self: stretch;\n      align-items: center;\n    }\n    .ml-mobile-cmd-panel.is-relative .ml-mobile-cmd-group-polar {\n      padding-bottom: 6px;\n    }\n    .ml-mobile-cmd-panel.is-relative .ml-mobile-cmd-group-delta {\n      padding-top: 6px;\n    }\n    .ml-mobile-cmd-panel.is-actions-only {\n      display: flex;\n      flex-direction: column;\n    }\n    .ml-mobile-cmd-panel.is-actions-only .ml-mobile-cmd-actions-shared {\n      border-left: 0;\n      padding-left: 0;\n      justify-content: flex-end;\n      align-self: flex-end;\n    }\n    .ml-mobile-cmd-panel.is-collapsed {\n      display: flex !important;\n      flex-direction: row;\n      align-items: center;\n      transform: translateX(-50%);\n    }\n  }\n");
+//# sourceMappingURL=AcUiMobileSessionPanel.js.map