@editora/ui-core 0.1.18 → 0.1.20

package/dist/placement-grid.esm.js

@@ -1,5 +1,5 @@
-import { E as v } from "./ElementBase-909688f3.mjs";
-const w = {
+import { E as b } from "./ElementBase-YlTLMsGk.mjs";
+const _ = {
   sm: "var(--ui-breakpoint-sm, 640px)",
   md: "var(--ui-breakpoint-md, 768px)",
   lg: "var(--ui-breakpoint-lg, 1024px)",
@@ -20,13 +20,13 @@ const w = {
   "aligncontent",
   "justifycontent",
   "placecontent"
-], A = {
+], v = {
   xs: "var(--ui-space-xs, 4px)",
   sm: "var(--ui-space-sm, 8px)",
   md: "var(--ui-space-md, 12px)",
   lg: "var(--ui-space-lg, 20px)",
   xl: "var(--ui-space-xl, 28px)"
-}, I = [
+}, w = [
   "data-row",
   "data-column",
   "data-row-span",
@@ -35,7 +35,7 @@ const w = {
   "data-selected",
   "data-disabled",
   "hidden"
-], y = `
+], A = `
   :host {
     --ui-placement-display: grid;
     --ui-placement-columns: 1fr;
@@ -132,12 +132,10 @@ const w = {
     }
   }
 `;
-function b(c) {
-  if (!c)
-    return null;
-  const t = c.trim();
-  if (!t.startsWith("{"))
-    return null;
+function f(u) {
+  if (!u) return null;
+  const t = u.trim();
+  if (!t.startsWith("{")) return null;
   try {
     const e = JSON.parse(t);
     return !e || typeof e != "object" ? null : e;
@@ -145,17 +143,16 @@ function b(c) {
     return null;
   }
 }
-function h(c) {
-  return A[c] || c;
+function h(u) {
+  return v[u] || u;
 }
-function d(c) {
-  if (!c)
-    return null;
-  const t = Number.parseInt(c, 10);
+function d(u) {
+  if (!u) return null;
+  const t = Number.parseInt(u, 10);
   return !Number.isFinite(t) || t < 1 ? null : t;
 }
-function _(c, t) {
-  switch (c) {
+function g(u, t) {
+  switch (u) {
     case "display":
       return { "--ui-placement-display": t };
     case "columns":
@@ -190,7 +187,7 @@ function _(c, t) {
       return {};
   }
 }
-class x extends v {
+class I extends b {
   constructor() {
     super(...arguments), this._lastClassname = "", this._appliedInlineProps = /* @__PURE__ */ new Set(), this._mutationObserver = null, this._suppressMutations = !1, this._focusedValue = null, this._dragItem = null, this._dragOverItem = null, this._onKeyDownBound = (t) => this._onKeyDown(t), this._onClickBound = (t) => this._onClick(t), this._onDragStartBound = (t) => this._onDragStart(t), this._onDragOverBound = (t) => this._onDragOver(t), this._onDropBound = (t) => this._onDrop(t), this._onDragEndBound = () => this._clearDragState();
   }
@@ -201,8 +198,7 @@ class x extends v {
     super.connectedCallback(), this._observeMutations(), this.addEventListener("keydown", this._onKeyDownBound), this.addEventListener("click", this._onClickBound), this.addEventListener("dragstart", this._onDragStartBound), this.addEventListener("dragover", this._onDragOverBound), this.addEventListener("drop", this._onDropBound), this.addEventListener("dragend", this._onDragEndBound);
   }
   disconnectedCallback() {
-    var t;
-    this.removeEventListener("keydown", this._onKeyDownBound), this.removeEventListener("click", this._onClickBound), this.removeEventListener("dragstart", this._onDragStartBound), this.removeEventListener("dragover", this._onDragOverBound), this.removeEventListener("drop", this._onDropBound), this.removeEventListener("dragend", this._onDragEndBound), (t = this._mutationObserver) == null || t.disconnect(), this._mutationObserver = null, this._clearDragState(), super.disconnectedCallback();
+    this.removeEventListener("keydown", this._onKeyDownBound), this.removeEventListener("click", this._onClickBound), this.removeEventListener("dragstart", this._onDragStartBound), this.removeEventListener("dragover", this._onDragOverBound), this.removeEventListener("drop", this._onDropBound), this.removeEventListener("dragend", this._onDragEndBound), this._mutationObserver?.disconnect(), this._mutationObserver = null, this._clearDragState(), super.disconnectedCallback();
   }
   refresh() {
     this.requestRender();
@@ -212,8 +208,8 @@ class x extends v {
     e && this._setFocusedItem(e, !0);
   }
   moveItem(t, e, s) {
-    const a = this._resolveItem(t);
-    a && this._moveItemTo(a, Math.max(1, e), Math.max(1, s), "api");
+    const r = this._resolveItem(t);
+    r && this._moveItemTo(r, Math.max(1, e), Math.max(1, s), "api");
   }
   _observeMutations() {
     this._mutationObserver || (this._mutationObserver = new MutationObserver(() => {
@@ -222,7 +218,7 @@ class x extends v {
       childList: !0,
       subtree: !0,
       attributes: !0,
-      attributeFilter: [...I]
+      attributeFilter: [...w]
     }));
   }
   _syncLegacyClassname() {
@@ -236,11 +232,10 @@ class x extends v {
   _applyInlineStyles() {
     this._appliedInlineProps.forEach((t) => this.style.removeProperty(t)), this._appliedInlineProps.clear(), p.forEach((t) => {
       const e = this.getAttribute(t);
-      if (!e || b(e))
-        return;
-      const s = _(t, e);
-      Object.entries(s).forEach(([a, n]) => {
-        this.style.setProperty(a, n), this._appliedInlineProps.add(a);
+      if (!e || f(e)) return;
+      const s = g(t, e);
+      Object.entries(s).forEach(([r, i]) => {
+        this.style.setProperty(r, i), this._appliedInlineProps.add(r);
       });
     });
   }
@@ -251,23 +246,22 @@ class x extends v {
       lg: {},
       xl: {}
     };
-    p.forEach((r) => {
-      const l = this.getAttribute(r), i = b(l);
-      if (!i)
-        return;
-      const o = (u, m) => {
-        Object.assign(u, _(r, m));
+    p.forEach((a) => {
+      const o = this.getAttribute(a), n = f(o);
+      if (!n) return;
+      const l = (c, m) => {
+        Object.assign(c, g(a, m));
       };
-      typeof i.initial == "string" && o(t, i.initial), typeof i.sm == "string" && o(e.sm, i.sm), typeof i.md == "string" && o(e.md, i.md), typeof i.lg == "string" && o(e.lg, i.lg), typeof i.xl == "string" && o(e.xl, i.xl);
+      typeof n.initial == "string" && l(t, n.initial), typeof n.sm == "string" && l(e.sm, n.sm), typeof n.md == "string" && l(e.md, n.md), typeof n.lg == "string" && l(e.lg, n.lg), typeof n.xl == "string" && l(e.xl, n.xl);
     });
-    const s = (r, l) => {
-      const i = Object.entries(l);
-      return i.length ? `${r} { ${i.map(([o, u]) => `${o}: ${u};`).join(" ")} }` : "";
-    }, a = [], n = s(":host", t);
-    return n && a.push(n), Object.keys(e).forEach((r) => {
-      const l = s(":host", e[r]);
-      l && a.push(`@media (min-width: ${w[r]}) { ${l} }`);
-    }), a.join(`
+    const s = (a, o) => {
+      const n = Object.entries(o);
+      return n.length ? `${a} { ${n.map(([l, c]) => `${l}: ${c};`).join(" ")} }` : "";
+    }, r = [], i = s(":host", t);
+    return i && r.push(i), Object.keys(e).forEach((a) => {
+      const o = s(":host", e[a]);
+      o && r.push(`@media (min-width: ${_[a]}) { ${o} }`);
+    }), r.join(`
 `);
   }
   _items() {
@@ -285,21 +279,21 @@ class x extends v {
   _computeItems() {
     const t = this._fallbackColumnCount();
     let e = 0;
-    return this._items().map((s, a) => {
-      let n = d(s.getAttribute("data-row")), r = d(s.getAttribute("data-column"));
-      const l = d(s.getAttribute("data-row-span")) || 1, i = d(s.getAttribute("data-column-span")) || 1;
-      if (n == null || r == null) {
-        const o = e++, u = Math.floor(o / t) + 1, m = o % t + 1;
-        n == null && (n = u), r == null && (r = m);
+    return this._items().map((s, r) => {
+      let i = d(s.getAttribute("data-row")), a = d(s.getAttribute("data-column"));
+      const o = d(s.getAttribute("data-row-span")) || 1, n = d(s.getAttribute("data-column-span")) || 1;
+      if (i == null || a == null) {
+        const l = e++, c = Math.floor(l / t) + 1, m = l % t + 1;
+        i == null && (i = c), a == null && (a = m);
       }
       return {
         el: s,
-        index: a,
-        row: n,
-        column: r,
-        rowSpan: l,
-        columnSpan: i,
-        value: s.getAttribute("data-value") || s.id || String(a),
+        index: r,
+        row: i,
+        column: a,
+        rowSpan: o,
+        columnSpan: n,
+        value: s.getAttribute("data-value") || s.id || String(r),
         disabled: s.hasAttribute("disabled") || s.hasAttribute("data-disabled"),
         selected: s.hasAttribute("data-selected")
       };
@@ -327,143 +321,126 @@ class x extends v {
     )) : this.hasAttribute("data-ui-placement-role") && (this.removeAttribute("role"), this.removeAttribute("data-ui-placement-role"), this.removeAttribute("aria-rowcount"), this.removeAttribute("aria-colcount"));
   }
   _setFocusedItem(t, e = !1) {
-    const s = this._items(), a = t || s[0] || null;
-    this._focusedValue = a && (a.getAttribute("data-value") || a.id) || null, s.forEach((n) => {
-      this._isInteractive() ? n.tabIndex = n === a ? 0 : -1 : n.removeAttribute("tabindex");
-    }), e && a && a.focus({ preventScroll: !0 });
+    const s = this._items(), r = t || s[0] || null;
+    this._focusedValue = r && (r.getAttribute("data-value") || r.id) || null, s.forEach((i) => {
+      this._isInteractive() ? i.tabIndex = i === r ? 0 : -1 : i.removeAttribute("tabindex");
+    }), e && r && r.focus({ preventScroll: !0 });
   }
   _syncItems() {
-    var s, a;
     const t = this._computeItems(), e = this._order() === "row-major" ? this._sortMeta(t) : t;
     this._suppressMutations = !0;
     try {
       this._order() === "row-major" && e.forEach((r) => this.appendChild(r.el)), this._syncHostSemantics(e);
-      const n = ((s = e.find((r) => r.value === this._focusedValue)) == null ? void 0 : s.el) || ((a = e[0]) == null ? void 0 : a.el) || null;
+      const s = e.find((r) => r.value === this._focusedValue)?.el || e[0]?.el || null;
       e.forEach((r) => {
         r.el.style.gridColumn = `${r.column} / span ${r.columnSpan}`, r.el.style.gridRow = `${r.row} / span ${r.rowSpan}`, r.el.style.minInlineSize = "0", r.el.style.boxSizing = "border-box", this._isInteractive() ? (r.el.hasAttribute("role") || r.el.setAttribute("role", "gridcell"), r.el.setAttribute("aria-rowindex", String(r.row)), r.el.setAttribute("aria-colindex", String(r.column)), r.columnSpan > 1 ? r.el.setAttribute("aria-colspan", String(r.columnSpan)) : r.el.removeAttribute("aria-colspan"), r.rowSpan > 1 ? r.el.setAttribute("aria-rowspan", String(r.rowSpan)) : r.el.removeAttribute("aria-rowspan"), r.selected ? r.el.setAttribute("aria-selected", "true") : r.el.removeAttribute("aria-selected"), r.disabled ? r.el.setAttribute("aria-disabled", "true") : r.el.removeAttribute("aria-disabled")) : (r.el.removeAttribute("aria-rowindex"), r.el.removeAttribute("aria-colindex"), r.el.removeAttribute("aria-rowspan"), r.el.removeAttribute("aria-colspan"), r.el.removeAttribute("aria-selected"), r.el.removeAttribute("aria-disabled")), this._isDraggable() && !r.disabled ? (r.el.setAttribute("data-draggable", ""), r.el.setAttribute("draggable", "true")) : (r.el.removeAttribute("data-draggable"), r.el.removeAttribute("draggable"));
-      }), this._setFocusedItem(n, !1);
+      }), this._setFocusedItem(s, !1);
     } finally {
       this._suppressMutations = !1;
     }
   }
   _findItemFromTarget(t) {
-    if (!(t instanceof Element))
-      return null;
+    if (!(t instanceof Element)) return null;
     const e = t.closest("[data-ui-placement-item]");
     return e instanceof HTMLElement && this.contains(e) ? e : null;
   }
   _metaForItem(t) {
     return this._computeItems().find((e) => e.el === t) || null;
   }
-  _intervalsOverlap(t, e, s, a) {
-    const n = t + e - 1, r = s + a - 1;
-    return t <= r && s <= n;
+  _intervalsOverlap(t, e, s, r) {
+    const i = t + e - 1, a = s + r - 1;
+    return t <= a && s <= i;
   }
   _findNeighbor(t, e) {
-    var r, l;
-    const s = this._computeItems().filter((i) => !i.disabled && i.el !== t.el);
-    if (!s.length)
-      return null;
-    const a = s.filter((i) => e === "left" || e === "right" ? this._intervalsOverlap(t.row, t.rowSpan, i.row, i.rowSpan) ? e === "left" ? i.column < t.column : i.column > t.column : !1 : this._intervalsOverlap(t.column, t.columnSpan, i.column, i.columnSpan) ? e === "up" ? i.row < t.row : i.row > t.row : !1);
-    if (!a.length) {
-      const i = this._order() === "row-major" ? this._sortMeta(this._computeItems()) : this._computeItems(), o = i.findIndex((m) => m.el === t.el);
-      return ((r = i[o + (e === "left" || e === "up" ? -1 : 1)]) == null ? void 0 : r.el) || null;
+    const s = this._computeItems().filter((a) => !a.disabled && a.el !== t.el);
+    if (!s.length) return null;
+    const r = s.filter((a) => e === "left" || e === "right" ? this._intervalsOverlap(t.row, t.rowSpan, a.row, a.rowSpan) ? e === "left" ? a.column < t.column : a.column > t.column : !1 : this._intervalsOverlap(t.column, t.columnSpan, a.column, a.columnSpan) ? e === "up" ? a.row < t.row : a.row > t.row : !1);
+    if (!r.length) {
+      const a = this._order() === "row-major" ? this._sortMeta(this._computeItems()) : this._computeItems(), o = a.findIndex((l) => l.el === t.el);
+      return a[o + (e === "left" || e === "up" ? -1 : 1)]?.el || null;
     }
-    return ((l = a.sort((i, o) => {
+    return r.sort((a, o) => {
       if (e === "left" || e === "right") {
-        const f = Math.abs(i.column - t.column), g = Math.abs(o.column - t.column);
-        return f !== g ? f - g : Math.abs(i.row - t.row) - Math.abs(o.row - t.row);
+        const c = Math.abs(a.column - t.column), m = Math.abs(o.column - t.column);
+        return c !== m ? c - m : Math.abs(a.row - t.row) - Math.abs(o.row - t.row);
       }
-      const u = Math.abs(i.row - t.row), m = Math.abs(o.row - t.row);
-      return u !== m ? u - m : Math.abs(i.column - t.column) - Math.abs(o.column - t.column);
-    })[0]) == null ? void 0 : l.el) || null;
+      const n = Math.abs(a.row - t.row), l = Math.abs(o.row - t.row);
+      return n !== l ? n - l : Math.abs(a.column - t.column) - Math.abs(o.column - t.column);
+    })[0]?.el || null;
   }
-  _moveItemTo(t, e, s, a) {
-    const n = this._metaForItem(t);
-    !n || n.disabled || (t.setAttribute("data-row", String(e)), t.setAttribute("data-column", String(s)), this.dispatchEvent(
+  _moveItemTo(t, e, s, r) {
+    const i = this._metaForItem(t);
+    !i || i.disabled || (t.setAttribute("data-row", String(e)), t.setAttribute("data-column", String(s)), this.dispatchEvent(
       new CustomEvent("itemmove", {
         bubbles: !0,
         composed: !0,
         detail: {
-          value: n.value,
-          reason: a,
-          from: { row: n.row, column: n.column },
+          value: i.value,
+          reason: r,
+          from: { row: i.row, column: i.column },
           to: { row: e, column: s }
         }
       })
     ), this.requestRender());
   }
   _swapItems(t, e, s) {
-    const a = this._metaForItem(t), n = this._metaForItem(e);
-    !a || !n || (t.setAttribute("data-row", String(n.row)), t.setAttribute("data-column", String(n.column)), e.setAttribute("data-row", String(a.row)), e.setAttribute("data-column", String(a.column)), this.dispatchEvent(
+    const r = this._metaForItem(t), i = this._metaForItem(e);
+    !r || !i || (t.setAttribute("data-row", String(i.row)), t.setAttribute("data-column", String(i.column)), e.setAttribute("data-row", String(r.row)), e.setAttribute("data-column", String(r.column)), this.dispatchEvent(
       new CustomEvent("itemmove", {
         bubbles: !0,
         composed: !0,
         detail: {
-          value: a.value,
-          targetValue: n.value,
+          value: r.value,
+          targetValue: i.value,
           reason: s,
-          from: { row: a.row, column: a.column },
-          to: { row: n.row, column: n.column }
+          from: { row: r.row, column: r.column },
+          to: { row: i.row, column: i.column }
         }
       })
     ), this.requestRender());
   }
   _onClick(t) {
-    if (!this._isInteractive())
-      return;
+    if (!this._isInteractive()) return;
     const e = this._findItemFromTarget(t.target);
     e && this._setFocusedItem(e, !1);
   }
   _onKeyDown(t) {
-    var l, i;
-    if (!this._isInteractive())
-      return;
+    if (!this._isInteractive()) return;
     const e = this._findItemFromTarget(t.target);
-    if (!e)
-      return;
+    if (!e) return;
     const s = this._metaForItem(e);
-    if (!s || s.disabled)
-      return;
-    const a = t.key, n = a === "ArrowLeft" || a === "ArrowRight" || a === "ArrowUp" || a === "ArrowDown";
-    if (t.altKey && this._isDraggable() && n) {
+    if (!s || s.disabled) return;
+    const r = t.key, i = r === "ArrowLeft" || r === "ArrowRight" || r === "ArrowUp" || r === "ArrowDown";
+    if (t.altKey && this._isDraggable() && i) {
       t.preventDefault();
-      const o = a === "ArrowDown" ? 1 : a === "ArrowUp" ? -1 : 0, u = a === "ArrowRight" ? 1 : a === "ArrowLeft" ? -1 : 0;
-      this._moveItemTo(e, Math.max(1, s.row + o), Math.max(1, s.column + u), "keyboard"), this._setFocusedItem(e, !0);
+      const o = r === "ArrowDown" ? 1 : r === "ArrowUp" ? -1 : 0, n = r === "ArrowRight" ? 1 : r === "ArrowLeft" ? -1 : 0;
+      this._moveItemTo(e, Math.max(1, s.row + o), Math.max(1, s.column + n), "keyboard"), this._setFocusedItem(e, !0);
       return;
     }
-    let r = null;
-    if (a === "ArrowLeft")
-      r = this._findNeighbor(s, "left");
-    else if (a === "ArrowRight")
-      r = this._findNeighbor(s, "right");
-    else if (a === "ArrowUp")
-      r = this._findNeighbor(s, "up");
-    else if (a === "ArrowDown")
-      r = this._findNeighbor(s, "down");
-    else if (a === "Home")
-      r = ((l = (this._order() === "row-major" ? this._sortMeta(this._computeItems()) : this._computeItems())[0]) == null ? void 0 : l.el) || null;
-    else if (a === "End") {
+    let a = null;
+    if (r === "ArrowLeft") a = this._findNeighbor(s, "left");
+    else if (r === "ArrowRight") a = this._findNeighbor(s, "right");
+    else if (r === "ArrowUp") a = this._findNeighbor(s, "up");
+    else if (r === "ArrowDown") a = this._findNeighbor(s, "down");
+    else if (r === "Home") a = (this._order() === "row-major" ? this._sortMeta(this._computeItems()) : this._computeItems())[0]?.el || null;
+    else if (r === "End") {
       const o = this._order() === "row-major" ? this._sortMeta(this._computeItems()) : this._computeItems();
-      r = ((i = o[o.length - 1]) == null ? void 0 : i.el) || null;
+      a = o[o.length - 1]?.el || null;
     }
-    r && (t.preventDefault(), this._setFocusedItem(r, !0));
+    a && (t.preventDefault(), this._setFocusedItem(a, !0));
   }
   _onDragStart(t) {
-    if (!this._isDraggable())
-      return;
+    if (!this._isDraggable()) return;
     const e = this._findItemFromTarget(t.target);
     !e || e.hasAttribute("data-disabled") || (this._dragItem = e, e.setAttribute("data-dragging", ""), t.dataTransfer && (t.dataTransfer.effectAllowed = "move", t.dataTransfer.setData("text/plain", e.getAttribute("data-value") || e.id || "")));
   }
   _onDragOver(t) {
-    if (!this._dragItem)
-      return;
+    if (!this._dragItem) return;
     const e = this._findItemFromTarget(t.target);
     !e || e === this._dragItem || (t.preventDefault(), this._dragOverItem && this._dragOverItem !== e && this._dragOverItem.removeAttribute("data-drag-over"), this._dragOverItem = e, e.setAttribute("data-drag-over", ""));
   }
   _onDrop(t) {
-    if (!this._dragItem)
-      return;
+    if (!this._dragItem) return;
     const e = this._findItemFromTarget(t.target);
     t.preventDefault(), e && e !== this._dragItem && (this._swapItems(this._dragItem, e, "pointer"), this._setFocusedItem(this._dragItem, !1)), this._clearDragState();
   }
@@ -473,14 +450,14 @@ class x extends v {
   render() {
     this._syncLegacyClassname(), this._applyInlineStyles(), this._syncItems();
     const t = this._buildResponsiveCss();
-    this.setContent(`<style>${y}${t ? `
+    this.setContent(`<style>${A}${t ? `
 ${t}` : ""}</style><slot></slot>`);
   }
   shouldRenderOnAttributeChange(t, e, s) {
     return !0;
   }
 }
-typeof customElements < "u" && !customElements.get("ui-placement-grid") && customElements.define("ui-placement-grid", x);
+typeof customElements < "u" && !customElements.get("ui-placement-grid") && customElements.define("ui-placement-grid", I);
 export {
-  x as UIPlacementGrid
+  I as UIPlacementGrid
 };

package/dist/plugin-panel.cjs.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("./ElementBase-1b301e7f.js"),l=`
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("./ElementBase-EV6mVBUV.js"),o=`
   :host {
     position: fixed;
     display: block;
@@ -114,18 +114,18 @@
       transition: none !important;
     }
   }
-`;class o extends s.ElementBase{constructor(){super(...arguments),this._onDocumentKeyDown=e=>{e.key!=="Escape"||!this.hasAttribute("open")||!this.hasAttribute("dismissible")||(e.preventDefault(),this.closePanel())}}static get observedAttributes(){return["open","position","headless","title","description","dismissible","size"]}connectedCallback(){super.connectedCallback(),document.addEventListener("keydown",this._onDocumentKeyDown)}disconnectedCallback(){document.removeEventListener("keydown",this._onDocumentKeyDown),super.disconnectedCallback()}openPanel(){this.setAttribute("open","")}closePanel(){this.removeAttribute("open")}togglePanel(){this.hasAttribute("open")?this.closePanel():this.openPanel()}attributeChangedCallback(e,t,n){if(t!==n&&(this.isConnected&&this.requestRender(),e==="open"&&t!==n)){const i=n!=null;this.dispatchEvent(new CustomEvent(i?"open":"close",{bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("open-change",{detail:{open:i},bubbles:!0,composed:!0}))}}render(){const e=this.getAttribute("title"),t=this.getAttribute("description"),n=this.hasAttribute("dismissible"),i=this.getAttribute("size")||"md";this.setContent(`
-      <style>${l}</style>
-      <aside class="panel" part="panel" role="complementary" aria-label="${e||"Plugin panel"}" data-size="${i}">
-        ${e||t||n?`
+`;class a extends s.ElementBase{constructor(){super(...arguments),this._onDocumentKeyDown=e=>{e.key!=="Escape"||!this.hasAttribute("open")||!this.hasAttribute("dismissible")||(e.preventDefault(),this.closePanel())}}static get observedAttributes(){return["open","position","headless","title","description","dismissible","size"]}connectedCallback(){super.connectedCallback(),document.addEventListener("keydown",this._onDocumentKeyDown)}disconnectedCallback(){document.removeEventListener("keydown",this._onDocumentKeyDown),super.disconnectedCallback()}openPanel(){this.setAttribute("open","")}closePanel(){this.removeAttribute("open")}togglePanel(){this.hasAttribute("open")?this.closePanel():this.openPanel()}attributeChangedCallback(e,t,i){if(t!==i&&(this.isConnected&&this.requestRender(),e==="open"&&t!==i)){const n=i!=null;this.dispatchEvent(new CustomEvent(n?"open":"close",{bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("open-change",{detail:{open:n},bubbles:!0,composed:!0}))}}render(){const e=this.getAttribute("title"),t=this.getAttribute("description"),i=this.hasAttribute("dismissible"),n=this.getAttribute("size")||"md";this.setContent(`
+      <style>${o}</style>
+      <aside class="panel" part="panel" role="complementary" aria-label="${e||"Plugin panel"}" data-size="${n}">
+        ${e||t||i?`
           <header class="header" part="header" style="display:flex;align-items:flex-start;gap:10px;padding:12px 14px 0;">
             <div style="min-width:0;display:grid;gap:4px;flex:1 1 auto;">
               ${e?`<strong part="title" style="font-size:14px;line-height:1.3;">${e}</strong>`:""}
               ${t?`<p part="description" style="margin:0;font-size:12px;line-height:1.4;color:var(--ui-color-muted, #64748b);">${t}</p>`:""}
             </div>
-            ${n?'<button type="button" class="dismiss" part="dismiss-button" aria-label="Close panel" style="border:none;background:transparent;color:inherit;cursor:pointer;font:inherit;padding:4px 6px;">Close</button>':""}
+            ${i?'<button type="button" class="dismiss" part="dismiss-button" aria-label="Close panel" style="border:none;background:transparent;color:inherit;cursor:pointer;font:inherit;padding:4px 6px;">Close</button>':""}
           </header>
         `:""}
         <slot></slot>
       </aside>
-    `);const a=this.root.querySelector(".dismiss");a==null||a.addEventListener("click",()=>this.closePanel(),{once:!0})}}typeof customElements<"u"&&!customElements.get("ui-plugin-panel")&&customElements.define("ui-plugin-panel",o);exports.UIPluginPanel=o;
+    `),this.root.querySelector(".dismiss")?.addEventListener("click",()=>this.closePanel(),{once:!0})}}typeof customElements<"u"&&!customElements.get("ui-plugin-panel")&&customElements.define("ui-plugin-panel",a);exports.UIPluginPanel=a;

package/dist/plugin-panel.esm.js

@@ -1,4 +1,4 @@
-import { E as o } from "./ElementBase-909688f3.mjs";
+import { E as a } from "./ElementBase-YlTLMsGk.mjs";
 const s = `
   :host {
     position: fixed;
@@ -116,7 +116,7 @@ const s = `
     }
   }
 `;
-class r extends o {
+class o extends a {
   constructor() {
     super(...arguments), this._onDocumentKeyDown = (e) => {
       e.key !== "Escape" || !this.hasAttribute("open") || !this.hasAttribute("dismissible") || (e.preventDefault(), this.closePanel());
@@ -140,34 +140,32 @@ class r extends o {
   togglePanel() {
     this.hasAttribute("open") ? this.closePanel() : this.openPanel();
   }
-  attributeChangedCallback(e, t, n) {
-    if (t !== n && (this.isConnected && this.requestRender(), e === "open" && t !== n)) {
-      const i = n != null;
-      this.dispatchEvent(new CustomEvent(i ? "open" : "close", { bubbles: !0, composed: !0 })), this.dispatchEvent(new CustomEvent("open-change", { detail: { open: i }, bubbles: !0, composed: !0 }));
+  attributeChangedCallback(e, t, i) {
+    if (t !== i && (this.isConnected && this.requestRender(), e === "open" && t !== i)) {
+      const n = i != null;
+      this.dispatchEvent(new CustomEvent(n ? "open" : "close", { bubbles: !0, composed: !0 })), this.dispatchEvent(new CustomEvent("open-change", { detail: { open: n }, bubbles: !0, composed: !0 }));
     }
   }
   render() {
-    const e = this.getAttribute("title"), t = this.getAttribute("description"), n = this.hasAttribute("dismissible"), i = this.getAttribute("size") || "md";
+    const e = this.getAttribute("title"), t = this.getAttribute("description"), i = this.hasAttribute("dismissible"), n = this.getAttribute("size") || "md";
     this.setContent(`
       <style>${s}</style>
-      <aside class="panel" part="panel" role="complementary" aria-label="${e || "Plugin panel"}" data-size="${i}">
-        ${e || t || n ? `
+      <aside class="panel" part="panel" role="complementary" aria-label="${e || "Plugin panel"}" data-size="${n}">
+        ${e || t || i ? `
           <header class="header" part="header" style="display:flex;align-items:flex-start;gap:10px;padding:12px 14px 0;">
             <div style="min-width:0;display:grid;gap:4px;flex:1 1 auto;">
               ${e ? `<strong part="title" style="font-size:14px;line-height:1.3;">${e}</strong>` : ""}
               ${t ? `<p part="description" style="margin:0;font-size:12px;line-height:1.4;color:var(--ui-color-muted, #64748b);">${t}</p>` : ""}
             </div>
-            ${n ? '<button type="button" class="dismiss" part="dismiss-button" aria-label="Close panel" style="border:none;background:transparent;color:inherit;cursor:pointer;font:inherit;padding:4px 6px;">Close</button>' : ""}
+            ${i ? '<button type="button" class="dismiss" part="dismiss-button" aria-label="Close panel" style="border:none;background:transparent;color:inherit;cursor:pointer;font:inherit;padding:4px 6px;">Close</button>' : ""}
           </header>
         ` : ""}
         <slot></slot>
       </aside>
-    `);
-    const a = this.root.querySelector(".dismiss");
-    a == null || a.addEventListener("click", () => this.closePanel(), { once: !0 });
+    `), this.root.querySelector(".dismiss")?.addEventListener("click", () => this.closePanel(), { once: !0 });
   }
 }
-typeof customElements < "u" && !customElements.get("ui-plugin-panel") && customElements.define("ui-plugin-panel", r);
+typeof customElements < "u" && !customElements.get("ui-plugin-panel") && customElements.define("ui-plugin-panel", o);
 export {
-  r as UIPluginPanel
+  o as UIPluginPanel
 };

package/dist/popover.cjs.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const h=require("./ElementBase-1b301e7f.js"),f=require("./portal-c69756c0.js"),b=require("./dismissable-layer-193e3bed.js"),g=require("./positioner-33529bb8.js"),m=`
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const h=require("./ElementBase-EV6mVBUV.js"),f=require("./portal-DgpQ3Jo1.js"),b=require("./dismissable-layer-DNfrKA20.js"),g=require("./positioner-D_fqyx_j.js"),m=`
   .popover-shell {
     --ui-popover-accent: var(--ui-color-primary, var(--ui-primary, #2563eb));
     --ui-popover-bg:
@@ -283,4 +283,4 @@
       box-shadow: none;
     }
   }
-`;class d extends h.ElementBase{constructor(){super(),this._portalEl=null,this._panelEl=null,this._positioner=null,this._layer=null,this._isOpen=!1,this._restoreFocusEl=null,this._contentObserver=null,this._hostObserver=null,this._syncPortalScheduled=!1,this._onHostClick=this._handleHostClick.bind(this)}static get observedAttributes(){return["open","placement","offset","flip","shift","close-on-escape","close-on-outside","variant","tone","size","radius","elevation"]}attributeChangedCallback(e,t,r){var o;if(t!==r){if(e==="open"){this._syncOpenState();return}this._isOpen&&((o=this._portalEl)!=null&&o.isConnected)&&(e==="placement"||e==="offset"||e==="flip"||e==="shift"||e==="variant"||e==="tone"||e==="size"||e==="radius"||e==="elevation"?this._mountPortal():(e==="close-on-escape"||e==="close-on-outside")&&this._syncDismissableLayer())}}connectedCallback(){super.connectedCallback(),this.addEventListener("click",this._onHostClick),this._observeHost(),this._syncOpenState()}disconnectedCallback(){var e;this.removeEventListener("click",this._onHostClick),(e=this._hostObserver)==null||e.disconnect(),this._hostObserver=null,this._teardownPortal(),super.disconnectedCallback()}_handleHostClick(e){const t=this._getTrigger();if(!t)return;const r=typeof e.composedPath=="function"?e.composedPath():[],o=e.target instanceof Node?e.target:null;(r.includes(t)||!!o&&(t===o||t.contains(o)))&&this.toggle()}open(){this.setAttribute("open","")}close(){this.removeAttribute("open")}toggle(){this.hasAttribute("open")?this.close():this.open()}updatePosition(){var e;(e=this._positioner)==null||e.update()}_getTrigger(){return this.querySelector('[slot="trigger"]')}_buildPortalContent(){const e=document.createElement("div");e.className="popover-shell",e.style.pointerEvents="auto";const t=this.getAttribute("variant");t&&(e.dataset.variant=t);const r=this.getAttribute("tone");r&&(e.dataset.tone=r);const o=this.getAttribute("size");o&&(e.dataset.size=o);const i=this.getAttribute("elevation");i&&(e.dataset.elevation=i);const s=this.getAttribute("radius");if(s&&s.trim()){const p=s.trim(),v=/^-?\d+(\.\d+)?$/.test(p)?`${p}px`:p;e.style.setProperty("--ui-popover-radius",v)}const l=document.createElement("style");l.textContent=m,e.appendChild(l);const a=document.createElement("div");a.className="panel show",this._panelEl=a;const c=document.createElement("div");c.className="arrow",a.appendChild(c);const u=this.querySelector('[slot="content"]'),n=document.createElement("div");return n.className="content",u&&n.appendChild(u.cloneNode(!0)),a.appendChild(n),e.appendChild(a),e}_getContentSource(){return this.querySelector('[slot="content"]')}_placement(){const e=this.getAttribute("placement");return e||"bottom"}_offset(){const e=Number(this.getAttribute("offset"));return Number.isFinite(e)?e:8}_closeOnEscape(){return this.getAttribute("close-on-escape")!=="false"}_closeOnOutside(){return this.getAttribute("close-on-outside")!=="false"}_syncDismissableLayer(){var t;const e=this._getTrigger();!e||!this._panelEl||((t=this._layer)==null||t.destroy(),this._layer=b.createDismissableLayer({node:this._panelEl,trigger:e,closeOnEscape:this._closeOnEscape(),closeOnPointerOutside:this._closeOnOutside(),onDismiss:()=>this.close()}))}_teardownPortal(){var e,t,r,o;if((e=this._contentObserver)==null||e.disconnect(),this._contentObserver=null,(t=this._layer)==null||t.destroy(),this._layer=null,(r=this._positioner)==null||r.destroy(),this._positioner=null,this._panelEl=null,(o=this._portalEl)!=null&&o.parentElement)try{this._portalEl.parentElement.removeChild(this._portalEl)}catch{}this._portalEl=null}_schedulePortalSync(){this._syncPortalScheduled||!this._isOpen||(this._syncPortalScheduled=!0,queueMicrotask(()=>{this._syncPortalScheduled=!1,this._isOpen&&this._mountPortal()}))}_observeContent(){var t;(t=this._contentObserver)==null||t.disconnect(),this._contentObserver=null;const e=this._getContentSource();!e||typeof MutationObserver>"u"||(this._contentObserver=new MutationObserver(()=>this._schedulePortalSync()),this._contentObserver.observe(e,{attributes:!0,childList:!0,characterData:!0,subtree:!0}))}_observeHost(){var e;(e=this._hostObserver)==null||e.disconnect(),this._hostObserver=null,!(typeof MutationObserver>"u")&&(this._hostObserver=new MutationObserver(()=>this._schedulePortalSync()),this._hostObserver.observe(this,{childList:!0,subtree:!1}))}_mountPortal(){const e=this._getTrigger();if(!e)return;this._teardownPortal(),this._portalEl=this._buildPortalContent();const t=f.createPortalContainer();t&&(t.appendChild(this._portalEl),this._observeContent(),this._positioner=g.createPositioner({anchor:e,floating:this._portalEl,placement:this._placement(),offset:this._offset(),shift:this.getAttribute("shift")!=="false",flip:this.getAttribute("flip")!=="false",arrow:this._portalEl.querySelector(".arrow")}),this._syncDismissableLayer())}_syncOpenState(){var i;const e=this.hasAttribute("open");if(e===this._isOpen){e&&(!this._portalEl||!this._portalEl.isConnected?this._mountPortal():(i=this._positioner)==null||i.update());return}if(this._isOpen=e,e){this._restoreFocusEl=document.activeElement instanceof HTMLElement?document.activeElement:null,this._mountPortal(),this.dispatchEvent(new CustomEvent("open",{bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("open-change",{detail:{open:!0},bubbles:!0,composed:!0}));return}this._teardownPortal(),this.dispatchEvent(new CustomEvent("close",{bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("open-change",{detail:{open:!1},bubbles:!0,composed:!0}));const t=this._getTrigger(),r=this._restoreFocusEl;this._restoreFocusEl=null;const o=(t&&t.isConnected?t:r)||null;if(o&&o.isConnected)try{o.focus()}catch{}}render(){this.setContent('<slot name="trigger"></slot>')}shouldRenderOnAttributeChange(e,t,r){return!1}}typeof customElements<"u"&&!customElements.get("ui-popover")&&customElements.define("ui-popover",d);exports.UIPopover=d;
+`;class d extends h.ElementBase{constructor(){super(),this._portalEl=null,this._panelEl=null,this._positioner=null,this._layer=null,this._isOpen=!1,this._restoreFocusEl=null,this._contentObserver=null,this._hostObserver=null,this._syncPortalScheduled=!1,this._onHostClick=this._handleHostClick.bind(this)}static get observedAttributes(){return["open","placement","offset","flip","shift","close-on-escape","close-on-outside","variant","tone","size","radius","elevation"]}attributeChangedCallback(e,t,r){if(t!==r){if(e==="open"){this._syncOpenState();return}this._isOpen&&this._portalEl?.isConnected&&(e==="placement"||e==="offset"||e==="flip"||e==="shift"||e==="variant"||e==="tone"||e==="size"||e==="radius"||e==="elevation"?this._mountPortal():(e==="close-on-escape"||e==="close-on-outside")&&this._syncDismissableLayer())}}connectedCallback(){super.connectedCallback(),this.addEventListener("click",this._onHostClick),this._observeHost(),this._syncOpenState()}disconnectedCallback(){this.removeEventListener("click",this._onHostClick),this._hostObserver?.disconnect(),this._hostObserver=null,this._teardownPortal(),super.disconnectedCallback()}_handleHostClick(e){const t=this._getTrigger();if(!t)return;const r=typeof e.composedPath=="function"?e.composedPath():[],o=e.target instanceof Node?e.target:null;(r.includes(t)||o&&(t===o||t.contains(o)))&&this.toggle()}open(){this.setAttribute("open","")}close(){this.removeAttribute("open")}toggle(){this.hasAttribute("open")?this.close():this.open()}updatePosition(){this._positioner?.update()}_getTrigger(){return this.querySelector('[slot="trigger"]')}_buildPortalContent(){const e=document.createElement("div");e.className="popover-shell",e.style.pointerEvents="auto";const t=this.getAttribute("variant");t&&(e.dataset.variant=t);const r=this.getAttribute("tone");r&&(e.dataset.tone=r);const o=this.getAttribute("size");o&&(e.dataset.size=o);const a=this.getAttribute("elevation");a&&(e.dataset.elevation=a);const s=this.getAttribute("radius");if(s&&s.trim()){const p=s.trim(),v=/^-?\d+(\.\d+)?$/.test(p)?`${p}px`:p;e.style.setProperty("--ui-popover-radius",v)}const l=document.createElement("style");l.textContent=m,e.appendChild(l);const i=document.createElement("div");i.className="panel show",this._panelEl=i;const c=document.createElement("div");c.className="arrow",i.appendChild(c);const u=this.querySelector('[slot="content"]'),n=document.createElement("div");return n.className="content",u&&n.appendChild(u.cloneNode(!0)),i.appendChild(n),e.appendChild(i),e}_getContentSource(){return this.querySelector('[slot="content"]')}_placement(){const e=this.getAttribute("placement");return e||"bottom"}_offset(){const e=Number(this.getAttribute("offset"));return Number.isFinite(e)?e:8}_closeOnEscape(){return this.getAttribute("close-on-escape")!=="false"}_closeOnOutside(){return this.getAttribute("close-on-outside")!=="false"}_syncDismissableLayer(){const e=this._getTrigger();!e||!this._panelEl||(this._layer?.destroy(),this._layer=b.createDismissableLayer({node:this._panelEl,trigger:e,closeOnEscape:this._closeOnEscape(),closeOnPointerOutside:this._closeOnOutside(),onDismiss:()=>this.close()}))}_teardownPortal(){if(this._contentObserver?.disconnect(),this._contentObserver=null,this._layer?.destroy(),this._layer=null,this._positioner?.destroy(),this._positioner=null,this._panelEl=null,this._portalEl?.parentElement)try{this._portalEl.parentElement.removeChild(this._portalEl)}catch{}this._portalEl=null}_schedulePortalSync(){this._syncPortalScheduled||!this._isOpen||(this._syncPortalScheduled=!0,queueMicrotask(()=>{this._syncPortalScheduled=!1,this._isOpen&&this._mountPortal()}))}_observeContent(){this._contentObserver?.disconnect(),this._contentObserver=null;const e=this._getContentSource();!e||typeof MutationObserver>"u"||(this._contentObserver=new MutationObserver(()=>this._schedulePortalSync()),this._contentObserver.observe(e,{attributes:!0,childList:!0,characterData:!0,subtree:!0}))}_observeHost(){this._hostObserver?.disconnect(),this._hostObserver=null,!(typeof MutationObserver>"u")&&(this._hostObserver=new MutationObserver(()=>this._schedulePortalSync()),this._hostObserver.observe(this,{childList:!0,subtree:!1}))}_mountPortal(){const e=this._getTrigger();if(!e)return;this._teardownPortal(),this._portalEl=this._buildPortalContent();const t=f.createPortalContainer();t&&(t.appendChild(this._portalEl),this._observeContent(),this._positioner=g.createPositioner({anchor:e,floating:this._portalEl,placement:this._placement(),offset:this._offset(),shift:this.getAttribute("shift")!=="false",flip:this.getAttribute("flip")!=="false",arrow:this._portalEl.querySelector(".arrow")}),this._syncDismissableLayer())}_syncOpenState(){const e=this.hasAttribute("open");if(e===this._isOpen){e&&(!this._portalEl||!this._portalEl.isConnected?this._mountPortal():this._positioner?.update());return}if(this._isOpen=e,e){this._restoreFocusEl=document.activeElement instanceof HTMLElement?document.activeElement:null,this._mountPortal(),this.dispatchEvent(new CustomEvent("open",{bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("open-change",{detail:{open:!0},bubbles:!0,composed:!0}));return}this._teardownPortal(),this.dispatchEvent(new CustomEvent("close",{bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("open-change",{detail:{open:!1},bubbles:!0,composed:!0}));const t=this._getTrigger(),r=this._restoreFocusEl;this._restoreFocusEl=null;const o=(t&&t.isConnected?t:r)||null;if(o&&o.isConnected)try{o.focus()}catch{}}render(){this.setContent('<slot name="trigger"></slot>')}shouldRenderOnAttributeChange(e,t,r){return!1}}typeof customElements<"u"&&!customElements.get("ui-popover")&&customElements.define("ui-popover",d);exports.UIPopover=d;