@muibook/components 14.0.0 → 14.0.2

package/dist/esm/components/mui-prompt/index.js

@@ -18,7 +18,7 @@ import "../mui-rule/index.js";
 import "../mui-prompt-toggle/index.js";
 class k extends HTMLElement {
   constructor() {
-    super(), this.triggerEl = null, this.previewShellEl = null, this.previewRowEl = null, this.previewSlotEl = null, this.previewResizeObserver = null, this.fanAnimations = /* @__PURE__ */ new Map(), this.pendingColorFade = !1, this.lastDebugPayload = '{"event":"idle"}', this.enforceActionVariants = () => {
+    super(), this.triggerEl = null, this.previewShellEl = null, this.previewRowEl = null, this.previewSlotEl = null, this.previewResizeObserver = null, this.fanAnimations = /* @__PURE__ */ new Map(), this.pendingColorFade = !1, this.lastDebugPayload = '{"event":"idle"}', this.lightDomObserver = null, this.onActionsSlotChange = () => this.updateActionsLayout(), this.enforceActionVariants = () => {
       if (!this.shadowRoot) return;
       const e = Array.from(this.shadowRoot.querySelectorAll('slot[name="actions"], slot[name="actions-trigger"], slot[name="actions-right"]')), o = (r, s) => {
         if (!s || r.tagName.toLowerCase() !== "mui-button") return;
@@ -32,13 +32,13 @@ class k extends HTMLElement {
         const s = r.name === "actions";
         r.assignedElements({ flatten: !0 }).forEach((a) => {
           [a, ...Array.from(a.querySelectorAll("*"))].forEach((c) => {
-            const u = c.tagName.toLowerCase();
-            if (u === "mui-button") {
+            const h = c.tagName.toLowerCase();
+            if (h === "mui-button") {
               c.setAttribute("variant", "tertiary"), o(c, s);
               return;
             }
-            u === "mui-dropdown" && c.querySelectorAll('[slot="action"]').forEach((h) => {
-              h instanceof HTMLElement && h.tagName.toLowerCase() === "mui-button" && (h.setAttribute("variant", "tertiary"), o(h, s));
+            h === "mui-dropdown" && c.querySelectorAll('[slot="action"]').forEach((u) => {
+              u instanceof HTMLElement && u.tagName.toLowerCase() === "mui-button" && (u.setAttribute("variant", "tertiary"), o(u, s));
             });
           });
         });
@@ -48,9 +48,9 @@ class k extends HTMLElement {
     }, this.onPaste = (t) => {
       const e = t, o = e.clipboardData;
       if (!o) return;
-      const r = Array.from(o.files || []), s = o.getData("text/plain") || "", i = s.trim(), a = i.length > 0, l = a ? this.detectMediaUrl(i) : null, c = this.getAttribute("preview-overflow-to-preview") !== "false", u = this.getAttribute("preview-threshold-chars"), p = Number.isFinite(Number.parseInt(u || "", 10)) ? Math.max(1, Number.parseInt(u || "", 10)) : 220, h = a ? this.detectBadge(i) : "", m = h !== "" && h !== "Insightful", b = c && a && (!!(l != null && l.url) || i.length >= p || m), g = r.length > 0;
-      if (!g && !a) return;
-      (g || b) && e.preventDefault();
+      const r = Array.from(o.files || []), s = o.getData("text/plain") || "", i = s.trim(), a = i.length > 0, l = a ? this.detectMediaUrl(i) : null, c = this.getAttribute("preview-overflow-to-preview") !== "false", h = this.getAttribute("preview-threshold-chars"), p = Number.isFinite(Number.parseInt(h || "", 10)) ? Math.max(1, Number.parseInt(h || "", 10)) : 220, u = a ? this.detectBadge(i) : "", m = u !== "" && u !== "Insightful", g = c && a && (!!(l != null && l.url) || i.length >= p || m), b = r.length > 0;
+      if (!b && !a) return;
+      (b || g) && e.preventDefault();
       const v = r.map((d) => ({
         kind: d.type.startsWith("image/") ? "image" : d.type.startsWith("video/") ? "video" : d.type.startsWith("audio/") ? "audio" : "file",
         mimeType: d.type || "",
@@ -61,7 +61,7 @@ class k extends HTMLElement {
         preview: d.name || "Pasted file",
         value: d.name || ""
       }));
-      b && i && (l != null && l.url ? v.unshift({
+      g && i && (l != null && l.url ? v.unshift({
         kind: l.kind === "image" ? "image" : "text",
         mimeType: l.mimeType,
         badge: l.badge,
@@ -77,8 +77,8 @@ class k extends HTMLElement {
         source: "paste",
         items: v,
         text: s || "",
-        textBadge: (l == null ? void 0 : l.badge) || h,
-        overflowed: b,
+        textBadge: (l == null ? void 0 : l.badge) || u,
+        overflowed: g,
         thresholdChars: p
       });
     }, this.onInput = (t) => {
@@ -240,12 +240,12 @@ class k extends HTMLElement {
       )
     ).flatMap((r) => r.assignedElements({ flatten: !0 })).forEach((r) => {
       [r, ...Array.from(r.querySelectorAll("*"))].forEach((i) => {
-        const l = i.tagName.toLowerCase() === "mui-prompt-toggle", c = i.hasAttribute("context-toggle"), u = i.hasAttribute("context-active") || i.hasAttribute("context-close") || i.hasAttribute("context-chip") || i.hasAttribute("context-spinner");
+        const l = i.tagName.toLowerCase() === "mui-prompt-toggle", c = i.hasAttribute("context-toggle"), h = i.hasAttribute("context-active") || i.hasAttribute("context-close") || i.hasAttribute("context-chip") || i.hasAttribute("context-spinner");
         if (l) {
           i.setAttribute("mode", t);
           return;
         }
-        if (c || u) {
+        if (c || h) {
           i.hasAttribute("context-chip") && i.tagName.toLowerCase() === "mui-chip" && !i.hasAttribute("variant") && i.setAttribute("variant", "ghost");
           const p = c ? t === "icon" : t === "chip";
           i.toggleAttribute("hidden", !p), i.style.display = p ? "inline-flex" : "none";
@@ -253,12 +253,25 @@ class k extends HTMLElement {
       });
     });
   }
+  hasTruthyFlagAttribute(t) {
+    const e = this.getAttribute(t);
+    return e !== null && e !== "false";
+  }
+  shouldUseFanModeByActions() {
+    if (!this.shadowRoot) return !1;
+    const t = this.shadowRoot.querySelector('slot[name="actions"]');
+    return t ? t.assignedElements({ flatten: !0 }).filter(
+      (o) => !o.hasAttribute("hidden")
+    ).length > 0 : !1;
+  }
+  isFanModeEnabled() {
+    return this.hasTruthyFlagAttribute("actions-fan") ? !0 : this.shouldUseFanModeByActions();
+  }
   ensureFanMode() {
-    this.hasAttribute("fan-open") && !this.hasAttribute("actions-fan") && this.setAttribute("actions-fan", "");
   }
   connectedCallback() {
     var e;
-    this.hasAttribute("context-mode") || this.setAttribute("context-mode", "icon"), this.ensureFanMode(), this.render(), this.bindEvents(), this.updateActionsLayout();
+    this.hasAttribute("context-mode") || this.setAttribute("context-mode", "icon"), this.ensureFanMode(), this.render(), this.bindEvents(), this.updateActionsLayout(), queueMicrotask(() => this.updateActionsLayout()), requestAnimationFrame(() => this.updateActionsLayout()), requestAnimationFrame(() => requestAnimationFrame(() => this.updateActionsLayout()));
     const t = (e = this.shadowRoot) == null ? void 0 : e.querySelector("textarea");
     t && (this.syncTextareaHeight(t), requestAnimationFrame(() => this.syncTextareaHeight(t)));
   }
@@ -421,10 +434,10 @@ class k extends HTMLElement {
     t == null || t.focus();
   }
   syncTextareaHeight(t) {
-    const o = Number.parseInt(this.getAttribute("rows") || String(3), 10) || 3, r = Math.max(o + 6, 10), s = getComputedStyle(t), a = (Number.parseFloat(s.fontSize) || 16) * 1.55, l = Number.parseFloat(s.paddingTop) || 0, c = Number.parseFloat(s.paddingBottom) || 0, u = Number.parseFloat(s.borderTopWidth) || 0, p = Number.parseFloat(s.borderBottomWidth) || 0, h = l + c + u + p, m = 3 * a + h, b = r * a + h;
+    const o = Number.parseInt(this.getAttribute("rows") || String(3), 10) || 3, r = Math.max(o + 6, 10), s = getComputedStyle(t), a = (Number.parseFloat(s.fontSize) || 16) * 1.55, l = Number.parseFloat(s.paddingTop) || 0, c = Number.parseFloat(s.paddingBottom) || 0, h = Number.parseFloat(s.borderTopWidth) || 0, p = Number.parseFloat(s.borderBottomWidth) || 0, u = l + c + h + p, m = 3 * a + u, g = r * a + u;
     t.style.height = "auto";
-    const g = t.scrollHeight, v = Math.max(m, Math.min(g, b));
-    t.style.height = `${Math.ceil(v)}px`, t.style.overflowY = g > b ? "auto" : "hidden";
+    const b = t.scrollHeight, v = Math.max(m, Math.min(b, g));
+    t.style.height = `${Math.ceil(v)}px`, t.style.overflowY = b > g ? "auto" : "hidden";
   }
   detectBadge(t) {
     const e = t.trim();
@@ -482,18 +495,24 @@ class k extends HTMLElement {
     return null;
   }
   bindEvents() {
+    var i;
     if (!this.shadowRoot) return;
     this.unbindEvents();
     const t = this.shadowRoot.querySelector("textarea");
     t == null || t.addEventListener("input", this.onInput), t == null || t.addEventListener("keydown", this.onKeyDown), t == null || t.addEventListener("paste", this.onPaste), t == null || t.addEventListener("focus", this.onTextareaFocus);
     const e = this.shadowRoot.querySelector('slot[name="actions"]'), o = this.shadowRoot.querySelector('slot[name="actions-trigger"]'), r = this.shadowRoot.querySelector('slot[name="actions-right"]'), s = this.shadowRoot.querySelector("#promptDefaultSubmitAction");
-    e == null || e.addEventListener("slotchange", () => this.updateActionsLayout()), o == null || o.addEventListener("slotchange", () => this.updateActionsLayout()), r == null || r.addEventListener("slotchange", () => this.updateActionsLayout()), s == null || s.addEventListener("click", this.onDefaultSubmitClick), this.addEventListener("prompt-preview-open", this.onPreviewOpen), this.addEventListener("click", this.onContextToggleClick), this.addEventListener("dismiss", this.onContextChipDismiss), this.syncErrorVisibility(), this.bindPreviewOverflow(), this.bindActionTrigger(), this.syncLoadingState();
+    e == null || e.addEventListener("slotchange", this.onActionsSlotChange), o == null || o.addEventListener("slotchange", this.onActionsSlotChange), r == null || r.addEventListener("slotchange", this.onActionsSlotChange), typeof MutationObserver < "u" && ((i = this.lightDomObserver) == null || i.disconnect(), this.lightDomObserver = new MutationObserver(() => this.updateActionsLayout()), this.lightDomObserver.observe(this, {
+      childList: !0,
+      subtree: !0,
+      attributes: !0,
+      attributeFilter: ["slot", "hidden"]
+    })), s == null || s.addEventListener("click", this.onDefaultSubmitClick), this.addEventListener("prompt-preview-open", this.onPreviewOpen), this.addEventListener("click", this.onContextToggleClick), this.addEventListener("dismiss", this.onContextChipDismiss), this.syncErrorVisibility(), this.bindPreviewOverflow(), this.bindActionTrigger(), this.syncLoadingState();
   }
   unbindEvents() {
-    var o, r, s;
+    var i, a, l, c;
     if (!this.shadowRoot) return;
-    const t = this.shadowRoot.querySelector("textarea"), e = this.shadowRoot.querySelector("#promptDefaultSubmitAction");
-    t == null || t.removeEventListener("input", this.onInput), t == null || t.removeEventListener("keydown", this.onKeyDown), t == null || t.removeEventListener("paste", this.onPaste), t == null || t.removeEventListener("focus", this.onTextareaFocus), e == null || e.removeEventListener("click", this.onDefaultSubmitClick), this.removeEventListener("prompt-preview-open", this.onPreviewOpen), this.removeEventListener("click", this.onContextToggleClick), this.removeEventListener("dismiss", this.onContextChipDismiss), this.triggerEl && (this.triggerEl.removeEventListener("click", this.toggleFanOpen), this.triggerEl = null), (o = this.previewRowEl) == null || o.removeEventListener("scroll", this.onPreviewScroll), (r = this.previewSlotEl) == null || r.removeEventListener("slotchange", this.onPreviewSlotChange), (s = this.previewResizeObserver) == null || s.disconnect(), this.previewResizeObserver = null, this.previewShellEl = null, this.previewRowEl = null, this.previewSlotEl = null;
+    const t = this.shadowRoot.querySelector("textarea"), e = this.shadowRoot.querySelector('slot[name="actions"]'), o = this.shadowRoot.querySelector('slot[name="actions-trigger"]'), r = this.shadowRoot.querySelector('slot[name="actions-right"]'), s = this.shadowRoot.querySelector("#promptDefaultSubmitAction");
+    t == null || t.removeEventListener("input", this.onInput), t == null || t.removeEventListener("keydown", this.onKeyDown), t == null || t.removeEventListener("paste", this.onPaste), t == null || t.removeEventListener("focus", this.onTextareaFocus), s == null || s.removeEventListener("click", this.onDefaultSubmitClick), e == null || e.removeEventListener("slotchange", this.onActionsSlotChange), o == null || o.removeEventListener("slotchange", this.onActionsSlotChange), r == null || r.removeEventListener("slotchange", this.onActionsSlotChange), this.removeEventListener("prompt-preview-open", this.onPreviewOpen), this.removeEventListener("click", this.onContextToggleClick), this.removeEventListener("dismiss", this.onContextChipDismiss), this.triggerEl && (this.triggerEl.removeEventListener("click", this.toggleFanOpen), this.triggerEl = null), (i = this.previewRowEl) == null || i.removeEventListener("scroll", this.onPreviewScroll), (a = this.previewSlotEl) == null || a.removeEventListener("slotchange", this.onPreviewSlotChange), (l = this.previewResizeObserver) == null || l.disconnect(), this.previewResizeObserver = null, (c = this.lightDomObserver) == null || c.disconnect(), this.lightDomObserver = null, this.previewShellEl = null, this.previewRowEl = null, this.previewSlotEl = null;
   }
   bindPreviewOverflow() {
     var t, e;
@@ -540,7 +559,7 @@ class k extends HTMLElement {
   openInternalPreviewDialog(t) {
     var y;
     if (!this.shadowRoot) return;
-    const e = this.shadowRoot.querySelector("#promptAutoPreviewDialog"), o = this.shadowRoot.querySelector("#promptAutoPreviewTitle"), r = this.shadowRoot.querySelector("#promptAutoPreviewCode"), s = this.shadowRoot.querySelector("#promptAutoPreviewImage"), i = this.shadowRoot.querySelector("#promptAutoPreviewMedia"), a = this.shadowRoot.querySelector("#promptAutoPreviewMediaUrl"), l = this.normalizePreviewDetail(t), c = this.getAttribute("preview-dialog-title") || l.label, u = l.value, p = l.bgImage, h = l.badge, m = u ? this.detectMediaUrl(u) : null, b = !p && u.length > 0 && (h === "VIDEO" || h === "MUSIC"), g = !p && (!!(m && (m.kind === "video" || m.kind === "audio")) || b), v = p.length > 0, d = u.length > 0, w = (() => {
+    const e = this.shadowRoot.querySelector("#promptAutoPreviewDialog"), o = this.shadowRoot.querySelector("#promptAutoPreviewTitle"), r = this.shadowRoot.querySelector("#promptAutoPreviewCode"), s = this.shadowRoot.querySelector("#promptAutoPreviewImage"), i = this.shadowRoot.querySelector("#promptAutoPreviewMedia"), a = this.shadowRoot.querySelector("#promptAutoPreviewMediaUrl"), l = this.normalizePreviewDetail(t), c = this.getAttribute("preview-dialog-title") || l.label, h = l.value, p = l.bgImage, u = l.badge, m = h ? this.detectMediaUrl(h) : null, g = !p && h.length > 0 && (u === "VIDEO" || u === "MUSIC"), b = !p && (!!(m && (m.kind === "video" || m.kind === "audio")) || g), v = p.length > 0, d = h.length > 0, w = (() => {
       if (!m || m.kind !== "audio") return !1;
       try {
         const f = new URL(m.url);
@@ -557,16 +576,16 @@ class k extends HTMLElement {
         return "Audio";
       }
     })();
-    if (!(!v && !d && !g)) {
-      if (this.setAttribute("preview-dialog-value", u), this.setAttribute("preview-dialog-image", p), this.setAttribute("preview-dialog-type", h || (v ? "IMG" : "CODE")), o && (o.textContent = c), g ? e == null || e.setAttribute("content-max-height", "none") : e == null || e.removeAttribute("content-max-height"), v)
+    if (!(!v && !d && !b)) {
+      if (this.setAttribute("preview-dialog-value", h), this.setAttribute("preview-dialog-image", p), this.setAttribute("preview-dialog-type", u || (v ? "IMG" : "CODE")), o && (o.textContent = c), b ? e == null || e.setAttribute("content-max-height", "none") : e == null || e.removeAttribute("content-max-height"), v)
         a && a.setAttribute("hidden", ""), s && (s.setAttribute("src", p), s.removeAttribute("hidden")), i && i.setAttribute("hidden", ""), r && r.setAttribute("hidden", "");
-      else if (g && m) {
+      else if (b && m) {
         if (a) {
           const f = w;
           a.textContent = f ? n : m.url, f ? (a.setAttribute("href", m.url), a.setAttribute("target", "_blank"), a.setAttribute("rel", "noopener noreferrer")) : (a.removeAttribute("href"), a.removeAttribute("target"), a.removeAttribute("rel")), a.toggleAttribute("hidden", !f);
         }
         i && (i.setAttribute("src", m.url), i.removeAttribute("type"), i.removeAttribute("prefer-native-controls"), i.removeAttribute("hidden")), r && r.setAttribute("hidden", ""), s && (s.removeAttribute("src"), s.setAttribute("hidden", ""));
-      } else b ? (a && (a.textContent = u, a.toggleAttribute("hidden", !0)), i && (i.setAttribute("src", u), i.setAttribute("type", h === "VIDEO" ? "video" : "audio"), i.removeAttribute("prefer-native-controls"), i.removeAttribute("hidden")), r && r.setAttribute("hidden", ""), s && (s.removeAttribute("src"), s.setAttribute("hidden", ""))) : (a && a.setAttribute("hidden", ""), r && (r.textContent = this.formatPreviewCode(u, h), r.removeAttribute("hidden")), i && (i.removeAttribute("src"), i.removeAttribute("prefer-native-controls"), i.setAttribute("hidden", "")), s && (s.removeAttribute("src"), s.setAttribute("hidden", "")));
+      } else g ? (a && (a.textContent = h, a.toggleAttribute("hidden", !0)), i && (i.setAttribute("src", h), i.setAttribute("type", u === "VIDEO" ? "video" : "audio"), i.removeAttribute("prefer-native-controls"), i.removeAttribute("hidden")), r && r.setAttribute("hidden", ""), s && (s.removeAttribute("src"), s.setAttribute("hidden", ""))) : (a && a.setAttribute("hidden", ""), r && (r.textContent = this.formatPreviewCode(h, u), r.removeAttribute("hidden")), i && (i.removeAttribute("src"), i.removeAttribute("prefer-native-controls"), i.setAttribute("hidden", "")), s && (s.removeAttribute("src"), s.setAttribute("hidden", "")));
       (y = e == null ? void 0 : e.open) == null || y.call(e);
     }
   }
@@ -579,7 +598,7 @@ class k extends HTMLElement {
     return t.tagName.toLowerCase() === "mui-prompt-toggle" || t.hasAttribute("context-toggle") ? !0 : !!t.querySelector("[context-toggle]");
   }
   bindActionTrigger() {
-    if (!this.shadowRoot || !this.hasAttribute("actions-fan")) return;
+    if (!this.shadowRoot || !this.isFanModeEnabled()) return;
     const t = this.shadowRoot.querySelector('slot[name="actions"]'), e = this.shadowRoot.querySelector('slot[name="actions-trigger"]'), o = this.shadowRoot.querySelector("#promptDefaultActionsTrigger");
     if (!t) return;
     this.triggerEl && (this.triggerEl.removeEventListener("click", this.toggleFanOpen), this.triggerEl = null);
@@ -616,28 +635,26 @@ class k extends HTMLElement {
   updateActionsLayout() {
     if (!this.shadowRoot) return;
     this.syncContextModeUI();
-    const t = this.shadowRoot.querySelector('slot[name="actions"]'), e = this.shadowRoot.querySelector('slot[name="actions-trigger"]'), o = this.shadowRoot.querySelector("#promptDefaultActionsTrigger"), r = this.shadowRoot.querySelector(".actions-separator");
+    const t = this.shadowRoot.querySelector('slot[name="actions"]'), e = this.shadowRoot.querySelector('slot[name="actions-trigger"]'), o = this.shadowRoot.querySelector("#promptDefaultActionsTrigger");
     if (!t) return;
-    const s = ((e == null ? void 0 : e.assignedElements({ flatten: !0 })) || []).filter(
+    const r = ((e == null ? void 0 : e.assignedElements({ flatten: !0 })) || []).filter(
       (n) => !n.hasAttribute("hidden")
-    ), i = t.assignedElements({ flatten: !0 }).filter(
+    ), s = t.assignedElements({ flatten: !0 }).filter(
       (n) => !n.hasAttribute("hidden")
-    ), a = i.length > 0, l = this.shadowRoot.querySelector(".actions-slot-left");
-    l && (l.style.display = a ? "inline-flex" : "none");
-    const c = s.length === 0 && i.length === 1 && this.isContextOnlyAction(i[0]);
+    ), i = s.length > 0, a = this.shadowRoot.querySelector(".actions-slot-left");
+    a && (a.style.display = i ? "inline-flex" : "none");
+    const l = r.length === 0 && s.length === 1 && this.isContextOnlyAction(s[0]);
     if (o) {
-      const n = !a || c;
+      const n = !i || l;
       o.toggleAttribute("hidden", n), o.style.display = n ? "none" : "inline-flex";
     }
-    const u = c ? null : s.find((n) => n.hasAttribute("fan-trigger")) || s[0] || o || i.find((n) => n.hasAttribute("fan-trigger")) || i[0] || null, p = i.filter((n) => n !== u), h = u ? [u, ...p] : i, m = this.shadowRoot.querySelector('slot[name="actions-right"]'), b = (m == null ? void 0 : m.assignedElements({ flatten: !0 })) || [], g = this.hasAttribute("actions-fan"), v = this.hasAttribute("fan-open"), d = 100, w = "calc(var(--action-icon-only-size-medium) + var(--space-100))";
-    if (r) {
-      const n = g && v && i.length > 0;
-      r.toggleAttribute("hidden", !n), r.style.display = n ? "inline-flex" : "none";
-    }
-    this.enforceActionVariants(), h.forEach((n, y) => {
+    const c = l ? null : r.find((n) => n.hasAttribute("fan-trigger")) || r[0] || o || s.find((n) => n.hasAttribute("fan-trigger")) || s[0] || null, h = s.filter((n) => n !== c), p = c ? [c, ...h] : s, u = this.shadowRoot.querySelector('slot[name="actions-right"]'), m = (u == null ? void 0 : u.assignedElements({ flatten: !0 })) || [], g = h.length > 0;
+    this.toggleAttribute("has-actions", i), this.toggleAttribute("has-extra-actions", g);
+    const b = i || this.hasTruthyFlagAttribute("actions-fan"), v = this.hasAttribute("fan-open"), d = 100, w = "calc(var(--action-icon-only-size-medium) + var(--space-100))";
+    this.enforceActionVariants(), p.forEach((n, y) => {
       n.style.transition = `transform ${d}ms ease, opacity ${d}ms ease`, n.style.zIndex = "";
       const f = this.fanAnimations.get(n);
-      if (f && (f.cancel(), this.fanAnimations.delete(n)), !g) {
+      if (f && (f.cancel(), this.fanAnimations.delete(n)), !b) {
         this.setFanItemInert(n, !1), n.style.transitionDelay = "", n.style.transform = "", n.style.opacity = "", n.style.pointerEvents = "", n.style.filter = "";
         return;
       }
@@ -674,23 +691,23 @@ class k extends HTMLElement {
           n.style.pointerEvents = "", this.setFanItemInert(n, !1);
         });
       });
-    }), b.forEach((n) => {
+    }), m.forEach((n) => {
       n.style.transition = "", n.style.zIndex = "";
     }), this.bindActionTrigger(), this.syncTriggerIconState();
   }
   render() {
     if (!this.shadowRoot) return;
-    const t = this.getAttribute("placeholder") || "Reply to Mui...", e = this.getAttribute("value") || "", o = this.getAttribute("rows") || "3", r = this.hasAttribute("disabled"), s = this.getAttribute("preview-dialog-width") || "560px", i = this.getAttribute("color-top-start") || "", a = this.getAttribute("color-top-mid") || "", l = this.getAttribute("color-top-end") || "", c = this.getAttribute("color-top-accent") || "", p = (this.getAttribute("color-layout") || "default").toLowerCase() === "swap", h = p ? l || "var(--prompt-color-top-end, var(--green-500))" : i || "var(--prompt-color-top-start, var(--blue-500))", m = p ? c || "var(--prompt-color-top-accent, var(--orange-500))" : a || "var(--prompt-color-top-mid, var(--blue-500))", b = p ? i || "var(--prompt-color-top-start, var(--blue-500))" : l || "var(--prompt-color-top-end, var(--green-500))", g = p ? a || "var(--prompt-color-top-mid, var(--blue-500))" : c || "var(--prompt-color-top-accent, var(--orange-500))", v = this.getAttribute("aria-label"), d = this.getAttribute("aria-labelledby"), w = this.getAttribute("aria-describedby"), n = !v && !d ? "Prompt input" : "", y = (this.getAttribute("error-message") || "").trim(), f = y;
+    const t = this.getAttribute("placeholder") || "Reply to Mui...", e = this.getAttribute("value") || "", o = this.getAttribute("rows") || "3", r = this.hasAttribute("disabled"), s = this.getAttribute("preview-dialog-width") || "560px", i = this.getAttribute("color-top-start") || "", a = this.getAttribute("color-top-mid") || "", l = this.getAttribute("color-top-end") || "", c = this.getAttribute("color-top-accent") || "", p = (this.getAttribute("color-layout") || "default").toLowerCase() === "swap", u = p ? l || "var(--prompt-color-top-end, var(--green-500))" : i || "var(--prompt-color-top-start, var(--blue-500))", m = p ? c || "var(--prompt-color-top-accent, var(--orange-500))" : a || "var(--prompt-color-top-mid, var(--blue-500))", g = p ? i || "var(--prompt-color-top-start, var(--blue-500))" : l || "var(--prompt-color-top-end, var(--green-500))", b = p ? a || "var(--prompt-color-top-mid, var(--blue-500))" : c || "var(--prompt-color-top-accent, var(--orange-500))", v = this.getAttribute("aria-label"), d = this.getAttribute("aria-labelledby"), w = this.getAttribute("aria-describedby"), n = !v && !d ? "Prompt input" : "", y = (this.getAttribute("error-message") || "").trim(), f = y;
     this.shadowRoot.innerHTML = /*html*/
     `
       <style>
         :host {
           display: block;
           --prompt-action-radius: var(--chip-radius-small, var(--radius-400));
-          --_prompt-color-top-start-source: ${h};
+          --_prompt-color-top-start-source: ${u};
           --_prompt-color-top-mid-source: ${m};
-          --_prompt-color-top-end-source: ${b};
-          --_prompt-color-top-accent-source: ${g};
+          --_prompt-color-top-end-source: ${g};
+          --_prompt-color-top-accent-source: ${b};
           --_prompt-accent-primary: var(--prompt-accent-primary, var(--prompt-spectrum-start, var(--blue-500)));
           --_prompt-accent-secondary: var(--prompt-accent-secondary, var(--blue-500));
           --_prompt-accent-mid: color-mix(in srgb, var(--_prompt-accent-primary) 52%, var(--_prompt-accent-secondary) 48%);
@@ -1259,13 +1276,6 @@ class k extends HTMLElement {
           pointer-events: none;
           margin-inline-end: var(--space-100);
         }
-        .actions-separator {
-          margin-inline: var(--space-200);
-          pointer-events: none;
-        }
-        .actions-separator[hidden] {
-          display: none !important;
-        }
         .actions-slot mui-button {
           --action-radius-x-small: var(--prompt-action-radius);
           --action-radius-small: var(--prompt-action-radius);
@@ -1434,7 +1444,6 @@ class k extends HTMLElement {
               </mui-icon-toggle>
             </mui-button>
           </slot>
-          <mui-rule class="actions-separator" direction="vertical" length="var(--space-400)" weight="var(--stroke-size-100)" aria-hidden="true"></mui-rule>
           <slot name="actions"></slot>
         </div>
       <div class="actions-slot actions-slot-right">

package/dist/esm/css/mui-brand.css

@@ -1,6 +1,6 @@
 
 /* ================================================================================================== */
-/*  Don't edit directly • Generated on Fri, 27 Feb 2026 03:21:56 GMT • muibook.com                                        */
+/*  Don't edit directly • Generated on Fri, 27 Feb 2026 06:15:52 GMT • muibook.com                                        */
 /* ================================================================================================== */
 
 /* ================================================================================================== */