@luzmo/analytics-components-kit 1.0.1-alpha.41 → 1.0.1-alpha.43

package/components/slot-menu/index.js

@@ -18,38 +18,85 @@
  * SOFTWARE.
  * */
 import "../index-CskV_bXp.js";
-import { r as h, x as i, n } from "../property-Dn4zSyxu.js";
-import "../display-settings/index.js";
+import { r as T, x as h, n as u } from "../property-BFMfZY1k.js";
+import { c as O, s as R } from "../index-Cw_HnduG.js";
 import "../slot-menu-list/index.js";
-import { a3 as m, a9 as z, a6 as g, aa as v } from "../luzmo-icons-v9hKZ3HV.js";
-import { l as b } from "../localize-BX7q0S0M.js";
-import { e as d } from "../query-Ddbd72Um.js";
-import { L as f } from "../focusable-BXhQz3_k.js";
-import { S as x, E as y } from "../sized-mixin-BR_Ii7le.js";
-const p = () => {
+import { a7 as C, ae as U, ab as X, ag as Y } from "../luzmo-icons-DnAqAQCX.js";
+import { l as q } from "../localize-BX7q0S0M.js";
+import { e as _ } from "../query-Ddbd72Um.js";
+import { L as A } from "../focusable-Bhf_beoW.js";
+import { S as H, E as j } from "../sized-mixin-CkdMApAU.js";
+const D = () => {
   if (typeof document < "u" && !document.querySelector("style[data-luzmo-vars]")) {
-    const s = document.createElement("style");
-    s.setAttribute("data-luzmo-vars", ""), s.textContent = 'html{--luzmo-animation-duration: 0.15s;--luzmo-border-color: rgba(var(--luzmo-border-color-rgb), 0.1);--luzmo-border-color-hover: rgba(var(--luzmo-border-color-rgb), 0.15);--luzmo-border-color-down: rgba(var(--luzmo-border-color-rgb), 0.3);--luzmo-border-color-focus: rgba(var(--luzmo-border-color-rgb), 0.15);--luzmo-border-color-rgb: 0, 0, 0;--luzmo-border-color-full: rgb(180, 180, 180);--luzmo-border-color-full-hover: rgb(140, 140, 140);--luzmo-border-color-full-down: rgb(110, 110, 110);--luzmo-border-color-full-focus: rgb(140, 140, 140);--luzmo-border-color-disabled: #dddddd;--luzmo-border-radius: 6px;--luzmo-border-radius-s: 4px;--luzmo-border-radius-l: 8px;--luzmo-border-radius-xl: 12px;--luzmo-border-radius-full: 999rem;--luzmo-background-color: #ffffff;--luzmo-background-color-rgb: 255, 255, 255;--luzmo-background-color-disabled: #eeeeee;--luzmo-background-color-hover: #f0f0fc;--luzmo-background-color-down: #f1f1ff;--luzmo-background-color-focus: #f0f0fc;--luzmo-background-color-highlight: rgb(240, 240, 240);--luzmo-background-color-highlight-disabled: rgb(245, 245, 245);--luzmo-background-color-highlight-hover: rgb(225, 225, 225);--luzmo-background-color-highlight-down: rgb(215, 215, 215);--luzmo-background-color-highlight-focus: rgb(225, 225, 225);--luzmo-border-width: 1px;--luzmo-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", Helvetica, Arial, sans-serif;--luzmo-font-size-xs: 10px;--luzmo-font-size-s: 12px;--luzmo-font-size-m: 14px;--luzmo-font-size: 14px;--luzmo-font-size-l: 16px;--luzmo-font-size-xl: 18px;--luzmo-font-size-xxl: 20px;--luzmo-font-style: normal;--luzmo-line-height: normal;--luzmo-font-weight: 400;--luzmo-font-weight-semibold: 500;--luzmo-font-weight-bold: 600;--luzmo-font-color: #333;--luzmo-font-color-hard: #000;--luzmo-font-color-disabled: var(--luzmo-color-disabled);--luzmo-font-color-extra-dimmed: #888;--luzmo-font-color-hover: #333;--luzmo-font-color-down: #111;--luzmo-font-color-focus: #333;--luzmo-primary: #4434ff;--luzmo-primary-hover: #4234e4;--luzmo-primary-down: #392cc7;--luzmo-primary-focus: #4234e4;--luzmo-primary-inverse-color: #ffffff;--luzmo-primary-rgb: 68, 52, 255;--luzmo-secondary: #ff00ff;--luzmo-secondary-hover: #e309e3;--luzmo-secondary-down: #c711c7;--luzmo-secondary-focus: #e309e3;--luzmo-secondary-inverse-color: #ffffff;--luzmo-secondary-rgb: 255, 0, 255;--luzmo-negative-color: #ca221c;--luzmo-negative-color-hover: #b3241f;--luzmo-negative-color-down: #9f231f;--luzmo-negative-color-focus: #b3241f;--luzmo-negative-color-rgb: 202, 34, 28;--luzmo-positive-color: rgb(20, 150, 101);--luzmo-positive-color-hover: rgb(17, 128, 86);--luzmo-positive-color-down: rgb(16, 105, 71);--luzmo-positive-color-focus: rgb(17, 128, 86);--luzmo-positive-color-rgb: 20, 150, 101;--luzmo-selected-color: rgb(110, 110, 110);--luzmo-selected-color-hover: rgb(70, 70, 70);--luzmo-selected-color-down: rgb(40, 40, 40);--luzmo-selected-color-focus: rgb(70, 70, 70);--luzmo-selected-color-hard: #1e1e1e;--luzmo-selected-color-hard-hover: rgb(0, 0, 0);--luzmo-selected-color-hard-down: rgb(0, 0, 0);--luzmo-selected-color-hard-focus: rgb(0, 0, 0);--luzmo-color-informative: #1a77e9;--luzmo-color-informative-rgb: 26, 119, 233;--luzmo-color-disabled: #aaaaaa;--luzmo-spacing-1: 2px;--luzmo-spacing-2: 4px;--luzmo-spacing-3: 8px;--luzmo-spacing-4: 12px;--luzmo-spacing-5: 16px;--luzmo-indicator-gap: 2px;--luzmo-indicator-width: 1px;--luzmo-indicator-color: var(--luzmo-primary);--luzmo-component-height-xxs: 20px;--luzmo-component-height-xs: 24px;--luzmo-component-height-s: 28px;--luzmo-component-height: 32px;--luzmo-component-height-l: 40px;--luzmo-component-height-xl: 48px;--luzmo-component-height-xxl: 64px;--luzmo-icon-size-xxs: 12px;--luzmo-icon-size-xs: 14px;--luzmo-icon-size-s: 16px;--luzmo-icon-size-m: 18px;--luzmo-icon-size-l: 20px;--luzmo-icon-size-xl: 22px;--luzmo-icon-size-xxl: 32px}', document.head.appendChild(s);
+    const r = document.createElement("style");
+    r.setAttribute("data-luzmo-vars", ""), r.textContent = 'html{--luzmo-animation-duration: 0.15s;--luzmo-border-color: rgba(var(--luzmo-border-color-rgb), 0.1);--luzmo-border-color-hover: rgba(var(--luzmo-border-color-rgb), 0.15);--luzmo-border-color-down: rgba(var(--luzmo-border-color-rgb), 0.3);--luzmo-border-color-focus: rgba(var(--luzmo-border-color-rgb), 0.15);--luzmo-border-color-rgb: 0, 0, 0;--luzmo-border-color-full: rgb(180, 180, 180);--luzmo-border-color-full-hover: rgb(140, 140, 140);--luzmo-border-color-full-down: rgb(110, 110, 110);--luzmo-border-color-full-focus: rgb(140, 140, 140);--luzmo-border-color-disabled: #dddddd;--luzmo-border-radius: 6px;--luzmo-border-radius-s: 4px;--luzmo-border-radius-l: 8px;--luzmo-border-radius-xl: 12px;--luzmo-border-radius-full: 999rem;--luzmo-background-color: #ffffff;--luzmo-background-color-rgb: 255, 255, 255;--luzmo-background-color-disabled: #eeeeee;--luzmo-background-color-hover: #f0f0fc;--luzmo-background-color-down: #f1f1ff;--luzmo-background-color-focus: #f0f0fc;--luzmo-background-color-highlight: rgb(240, 240, 240);--luzmo-background-color-highlight-disabled: rgb(245, 245, 245);--luzmo-background-color-highlight-hover: rgb(225, 225, 225);--luzmo-background-color-highlight-down: rgb(215, 215, 215);--luzmo-background-color-highlight-focus: rgb(225, 225, 225);--luzmo-border-width: 1px;--luzmo-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", Helvetica, Arial, sans-serif;--luzmo-font-size-xs: 10px;--luzmo-font-size-s: 12px;--luzmo-font-size-m: 14px;--luzmo-font-size: 14px;--luzmo-font-size-l: 16px;--luzmo-font-size-xl: 18px;--luzmo-font-size-xxl: 20px;--luzmo-font-style: normal;--luzmo-line-height: normal;--luzmo-font-weight: 400;--luzmo-font-weight-semibold: 500;--luzmo-font-weight-bold: 600;--luzmo-font-color: #333;--luzmo-font-color-hard: #000;--luzmo-font-color-disabled: var(--luzmo-color-disabled);--luzmo-font-color-extra-dimmed: #888;--luzmo-font-color-hover: #333;--luzmo-font-color-down: #111;--luzmo-font-color-focus: #333;--luzmo-primary: #4434ff;--luzmo-primary-hover: #4234e4;--luzmo-primary-down: #392cc7;--luzmo-primary-focus: #4234e4;--luzmo-primary-inverse-color: #ffffff;--luzmo-primary-rgb: 68, 52, 255;--luzmo-secondary: #ff00ff;--luzmo-secondary-hover: #e309e3;--luzmo-secondary-down: #c711c7;--luzmo-secondary-focus: #e309e3;--luzmo-secondary-inverse-color: #ffffff;--luzmo-secondary-rgb: 255, 0, 255;--luzmo-negative-color: #ca221c;--luzmo-negative-color-hover: #b3241f;--luzmo-negative-color-down: #9f231f;--luzmo-negative-color-focus: #b3241f;--luzmo-negative-color-rgb: 202, 34, 28;--luzmo-positive-color: rgb(20, 150, 101);--luzmo-positive-color-hover: rgb(17, 128, 86);--luzmo-positive-color-down: rgb(16, 105, 71);--luzmo-positive-color-focus: rgb(17, 128, 86);--luzmo-positive-color-rgb: 20, 150, 101;--luzmo-selected-color: rgb(110, 110, 110);--luzmo-selected-color-hover: rgb(70, 70, 70);--luzmo-selected-color-down: rgb(40, 40, 40);--luzmo-selected-color-focus: rgb(70, 70, 70);--luzmo-selected-color-hard: #1e1e1e;--luzmo-selected-color-hard-hover: rgb(0, 0, 0);--luzmo-selected-color-hard-down: rgb(0, 0, 0);--luzmo-selected-color-hard-focus: rgb(0, 0, 0);--luzmo-color-informative: #1a77e9;--luzmo-color-informative-rgb: 26, 119, 233;--luzmo-color-disabled: #aaaaaa;--luzmo-spacing-1: 2px;--luzmo-spacing-2: 4px;--luzmo-spacing-3: 8px;--luzmo-spacing-4: 12px;--luzmo-spacing-5: 16px;--luzmo-indicator-gap: 2px;--luzmo-indicator-width: 1px;--luzmo-indicator-color: var(--luzmo-primary);--luzmo-component-height-xxs: 20px;--luzmo-component-height-xs: 24px;--luzmo-component-height-s: 28px;--luzmo-component-height: 32px;--luzmo-component-height-l: 40px;--luzmo-component-height-xl: 48px;--luzmo-component-height-xxl: 64px;--luzmo-icon-size-xxs: 12px;--luzmo-icon-size-xs: 14px;--luzmo-icon-size-s: 16px;--luzmo-icon-size-m: 18px;--luzmo-icon-size-l: 20px;--luzmo-icon-size-xl: 22px;--luzmo-icon-size-xxl: 32px}', document.head.appendChild(r);
   }
 };
-p();
-const w = ":host{font-family:var(--luzmo-slot-menu-font-family, var(--luzmo-font-family));font-size:var(--luzmo-slot-menu-font-size, var(--slot-menu-font-size));color:var(--luzmo-slot-menu-font-color, var(--luzmo-font-color));display:block;width:fit-content}luzmo-slot-menu-list{min-width:var(--luzmo-slot-menu-list-min-width, var(--slot-menu-list-min-width));max-width:var(--luzmo-slot-menu-list-max-width, var(--slot-menu-list-max-width))}.slot-contents-container{position:relative;border:var(--luzmo-slot-menu-border-width, var(--luzmo-border-width)) solid var(--luzmo-slot-menu-border-color, var(--luzmo-border-color));border-radius:var(--luzmo-slot-menu-border-radius, var(--luzmo-border-radius));background:var(--luzmo-slot-menu-background-color, var(--luzmo-background-color));border-top-left-radius:0}.slot-contents-container .inner-container{display:flex}.slot-contents-container .inner-container luzmo-display-settings{min-width:var(--luzmo-slot-menu-display-settings-min-width, var(--slot-menu-display-settings-min-width));padding:var(--luzmo-slot-menu-display-settings-vertical-padding, var(--slot-menu-display-settings-vertical-padding)) var(--luzmo-slot-menu-display-settings-horizontal-padding, var(--slot-menu-display-settings-horizontal-padding))}:host([variant=popup]) .slot-contents-container{overflow:hidden;border-top-left-radius:var(--luzmo-slot-menu-border-radius, var(--luzmo-border-radius));--slot-menu-popup-filter: drop-shadow( var( --luzmo-slot-menu-popup-shadow-horizontal, var(--slot-menu-popup-shadow-horizontal) ) var( --luzmo-slot-menu-popup-shadow-vertical, var(--slot-menu-popup-shadow-vertical) ) var( --luzmo-slot-menu-popup-shadow-blur, var(--slot-menu-popup-shadow-blur) ) var( --luzmo-slot-menu-popup-shadow-color, var(--slot-menu-popup-shadow-color) ) );filter:var(--luzmo-slot-menu-popup-filter, var(--slot-menu-popup-filter))}.slot-menu-top-menu{display:flex;align-items:center;border-radius:var(--luzmo-slot-menu-border-radius, var(--luzmo-border-radius));border-bottom-left-radius:0;border-bottom-right-radius:0;overflow:hidden;width:fit-content}.drag-handle{background-color:var(--luzmo-slot-menu-drag-handle-background-color, var(--luzmo-background-color-highlight));cursor:grab;width:fit-content;border:var(--luzmo-slot-menu-border-width, var(--luzmo-border-width)) solid var(--luzmo-slot-menu-border-color, var(--luzmo-background-color-highlight));font-size:var(--luzmo-slot-menu-drag-handle-size, var(--slot-menu-drag-handle-size));padding:var(--luzmo-slot-menu-drag-handle-vertical-padding, var(--slot-menu-drag-handle-vertical-padding)) var(--luzmo-slot-menu-drag-handle-horizontal-padding, var(--slot-menu-drag-handle-horizontal-padding))}.drag-handle:hover{background-color:var(--luzmo-slot-menu-drag-handle-background-color-hover, var(--luzmo-background-color-highlight-hover))}.slot-content-action{display:flex;flex:0 1 auto;max-width:var(--luzmo-slot-menu-top-menu-label-max-width, var(--slot-menu-top-menu-label-max-width));gap:var(--luzmo-slot-menu-label-to-icon-gap, var(--slot-menu-label-to-icon-gap));background-color:var(--luzmo-slot-menu-content-label-background-color, var(--luzmo-primary));color:var(--luzmo-slot-menu-content-label-color, var(--luzmo-primary-inverse-color));border:var(--luzmo-slot-menu-border-width, var(--luzmo-border-width)) solid var(--luzmo-slot-menu-content-label-border-color, var(--luzmo-primary));padding:var(--luzmo-slot-menu-drag-handle-vertical-padding, var(--slot-menu-drag-handle-vertical-padding)) var(--luzmo-slot-menu-drag-handle-horizontal-padding, var(--slot-menu-drag-handle-horizontal-padding))}.slot-content-action:hover{background-color:var(--luzmo-slot-menu-content-label-background-color-hover, var(--luzmo-primary-hover))}.slot-content-action:focus{background-color:var(--luzmo-slot-menu-content-label-background-color-focus, var(--luzmo-primary-focus))}.slot-content-action .slot-content-label{flex:1 1 auto;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.slot-content-action .slot-content-remove{flex:0 0 auto;cursor:pointer}.close{position:absolute;right:1rem;cursor:pointer;top:calc(-2 * var(--luzmo-slot-menu-border-width, var(--luzmo-border-width)));background-color:var(--luzmo-slot-menu-close-button-background-color, var(--luzmo-background-color-highlight));font-size:var(--luzmo-slot-menu-close-button-size, var(--slot-menu-close-button-size));border:var(--luzmo-slot-menu-border-width, var(--luzmo-border-width)) solid var(--luzmo-slot-menu-border-color, var(--luzmo-border-color));border-radius:var(--luzmo-slot-menu-border-radius, var(--luzmo-border-radius));border-top-left-radius:0;border-top-right-radius:0;padding:var(--luzmo-slot-menu-close-button-vertical-padding, var(--slot-menu-close-button-vertical-padding)) var(--luzmo-slot-menu-close-button-horizontal-padding, var(--slot-menu-close-button-horizontal-padding))}.close:hover{background-color:var(--luzmo-slot-menu-close-button-background-color-hover, var(--luzmo-background-color-highlight-hover))}:host{--slot-menu-display-settings-min-width: 19rem;--slot-menu-min-height: calc(var(--luzmo-component-height) * 2);--slot-menu-font-size: var(--luzmo-font-size);--slot-menu-display-settings-horizontal-padding: var(--luzmo-spacing-5);--slot-menu-display-settings-vertical-padding: var(--luzmo-spacing-4);--slot-menu-top-menu-label-max-width: 12rem;--slot-menu-list-min-width: 8rem;--slot-menu-list-max-width: 12rem;--slot-menu-label-to-icon-gap: var(--luzmo-spacing-3);--slot-menu-drag-handle-size: var(--luzmo-font-size);--slot-menu-drag-handle-vertical-padding: var(--luzmo-spacing-2);--slot-menu-drag-handle-horizontal-padding: var(--luzmo-spacing-3);--slot-menu-close-button-size: var(--luzmo-font-size-s);--slot-menu-close-button-vertical-padding: var(--luzmo-spacing-2);--slot-menu-close-button-horizontal-padding: calc( var(--luzmo-spacing-2) + var(--luzmo-spacing-1) );--slot-menu-popup-shadow-horizontal: 0;--slot-menu-popup-shadow-vertical: 1px;--slot-menu-popup-shadow-blur: 4px;--slot-menu-popup-shadow-color: var(--luzmo-border-color)}:host([size=s]){--slot-menu-display-settings-min-width: 16rem;--slot-menu-min-height: calc(var(--luzmo-component-height-s) * 2);--slot-menu-font-size: var(--luzmo-font-size-s);--slot-menu-display-settings-horizontal-padding: var(--luzmo-spacing-4);--slot-menu-display-settings-vertical-padding: var(--luzmo-spacing-3);--slot-menu-top-menu-label-max-width: 10rem;--slot-menu-list-min-width: 6rem;--slot-menu-list-max-width: 10rem;--slot-menu-label-to-icon-gap: var(--luzmo-spacing-2);--slot-menu-drag-handle-size: var(--luzmo-font-size-s);--slot-menu-drag-handle-vertical-padding: var(--luzmo-spacing-2);--slot-menu-drag-handle-horizontal-padding: var(--luzmo-spacing-3);--slot-menu-close-button-size: var(--luzmo-font-size-xs);--slot-menu-close-button-vertical-padding: var(--luzmo-spacing-2);--slot-menu-close-button-horizontal-padding: calc( var(--luzmo-spacing-2) + var(--luzmo-spacing-1) )}:host([size=l]){--slot-menu-display-settings-min-width: 23rem;--slot-menu-min-height: calc(var(--luzmo-component-height-l) * 2);--slot-menu-font-size: var(--luzmo-font-size-l);--slot-menu-display-settings-horizontal-padding: calc( var(--luzmo-spacing-5) + var(--luzmo-spacing-1) );--slot-menu-display-settings-vertical-padding: var(--luzmo-spacing-5);--slot-menu-top-menu-label-max-width: 14rem;--slot-menu-list-min-width: 9rem;--slot-menu-list-max-width: 14rem;--slot-menu-label-to-icon-gap: var(--luzmo-spacing-4);--slot-menu-drag-handle-size: var(--luzmo-font-size-l);--slot-menu-drag-handle-vertical-padding: var(--luzmo-spacing-3);--slot-menu-drag-handle-horizontal-padding: var(--luzmo-spacing-3);--slot-menu-close-button-size: var(--luzmo-font-size);--slot-menu-close-button-vertical-padding: calc( var(--luzmo-spacing-2) + var(--luzmo-spacing-1) );--slot-menu-close-button-horizontal-padding: var(--luzmo-spacing-3)}:host([size=xl]){--slot-menu-display-settings-min-width: 26rem;--slot-menu-min-height: calc(var(--luzmo-component-height-xl) * 2);--slot-menu-font-size: var(--luzmo-font-size-xl);--slot-menu-display-settings-horizontal-padding: calc( var(--luzmo-spacing-5) + var(--luzmo-spacing-2) );--slot-menu-display-settings-vertical-padding: var(--luzmo-spacing-5);--slot-menu-top-menu-label-max-width: 16rem;--slot-menu-list-min-width: 10rem;--slot-menu-list-max-width: 16rem;--slot-menu-label-to-icon-gap: var(--luzmo-spacing-5);--slot-menu-drag-handle-size: var(--luzmo-font-size-xl);--slot-menu-drag-handle-vertical-padding: var(--luzmo-spacing-3);--slot-menu-drag-handle-horizontal-padding: var(--luzmo-spacing-4);--slot-menu-close-button-size: var(--luzmo-font-size-l);--slot-menu-close-button-vertical-padding: var(--luzmo-spacing-3);--slot-menu-close-button-horizontal-padding: var(--luzmo-spacing-3)}";
-var C = Object.defineProperty, e = (s, o, l, r) => {
-  for (var a = void 0, u = s.length - 1, c; u >= 0; u--)
-    (c = s[u]) && (a = c(o, l, a) || a);
-  return a && C(o, l, a), a;
+D();
+function F({
+  element: r,
+  handle: o,
+  boundary: t = document.documentElement,
+  onDragStart: e,
+  onDragEnd: s
+}) {
+  if (!r || !o)
+    throw new Error("makeDraggable: element and handle are required");
+  const a = r.ownerDocument ?? document;
+  let m = -1, k = 0, S = 0, z = 0, v = 0, E = 0, L = 0, b = 0, f = 0;
+  const x = (i) => {
+    if (i.pointerId !== m) return;
+    const c = i.clientX - k, g = i.clientY - S, d = (t ?? document.documentElement).getBoundingClientRect();
+    let p = z + c, w = v + g;
+    p = Math.min(
+      Math.max(p, d.left),
+      d.right - E
+    ), w = Math.min(
+      Math.max(w, d.top),
+      d.bottom - L
+    );
+    const $ = p - z, M = w - v, B = b + $, P = f + M;
+    r.style.transform = `translate3d(${B}px, ${P}px, 0)`;
+  }, y = (i) => {
+    i.pointerId === m && (a.removeEventListener("pointermove", x), a.removeEventListener("pointerup", y), m = -1, s == null || s());
+  }, I = (i) => {
+    var g;
+    if (i.button !== 0) return;
+    m = i.pointerId;
+    const c = r.getBoundingClientRect();
+    z = c.left, v = c.top, E = c.width, L = c.height, k = i.clientX, S = i.clientY;
+    try {
+      const d = (g = a.defaultView) == null ? void 0 : g.getComputedStyle(r);
+      if (d) {
+        const p = new DOMMatrixReadOnly(d.transform);
+        b = p.m41, f = p.m42;
+      }
+    } catch {
+      b = 0, f = 0;
+    }
+    o.setPointerCapture(m), a.addEventListener("pointermove", x), a.addEventListener("pointerup", y), e == null || e();
+  };
+  return o.addEventListener("pointerdown", I), () => {
+    o.removeEventListener("pointerdown", I), a.removeEventListener("pointermove", x), a.removeEventListener("pointerup", y);
+  };
+}
+const N = ":host{font-family:var(--luzmo-slot-menu-font-family, var(--luzmo-font-family));font-size:var(--luzmo-slot-menu-font-size, var(--slot-menu-font-size));color:var(--luzmo-slot-menu-font-color, var(--luzmo-font-color));display:block;width:fit-content}luzmo-slot-menu-list{min-width:var(--luzmo-slot-menu-list-min-width, var(--slot-menu-list-min-width));max-width:var(--luzmo-slot-menu-list-max-width, var(--slot-menu-list-max-width))}.slot-contents-container{position:relative;border:var(--luzmo-slot-menu-border-width, var(--luzmo-border-width)) solid var(--luzmo-slot-menu-border-color, var(--luzmo-border-color));border-radius:var(--luzmo-slot-menu-border-radius, var(--luzmo-border-radius));background:var(--luzmo-slot-menu-background-color, var(--luzmo-background-color));border-top-left-radius:0}.slot-contents-container .inner-container{display:flex}.slot-contents-container .inner-container luzmo-display-settings{min-width:var(--luzmo-slot-menu-display-settings-min-width, var(--slot-menu-display-settings-min-width));padding:var(--luzmo-slot-menu-display-settings-vertical-padding, var(--slot-menu-display-settings-vertical-padding)) var(--luzmo-slot-menu-display-settings-horizontal-padding, var(--slot-menu-display-settings-horizontal-padding))}:host([variant=popup]) .slot-contents-container{overflow:hidden;border-top-left-radius:var(--luzmo-slot-menu-border-radius, var(--luzmo-border-radius));--slot-menu-popup-filter: drop-shadow( var( --luzmo-slot-menu-popup-shadow-horizontal, var(--slot-menu-popup-shadow-horizontal) ) var( --luzmo-slot-menu-popup-shadow-vertical, var(--slot-menu-popup-shadow-vertical) ) var( --luzmo-slot-menu-popup-shadow-blur, var(--slot-menu-popup-shadow-blur) ) var( --luzmo-slot-menu-popup-shadow-color, var(--slot-menu-popup-shadow-color) ) );filter:var(--luzmo-slot-menu-popup-filter, var(--slot-menu-popup-filter))}.slot-menu-top-menu{display:flex;align-items:center;border-radius:var(--luzmo-slot-menu-border-radius, var(--luzmo-border-radius));border-bottom-left-radius:0;border-bottom-right-radius:0;overflow:hidden;width:fit-content}.drag-handle{background-color:var(--luzmo-slot-menu-drag-handle-background-color, var(--luzmo-background-color-highlight));cursor:grab;width:fit-content;border:var(--luzmo-slot-menu-border-width, var(--luzmo-border-width)) solid var(--luzmo-slot-menu-border-color, var(--luzmo-background-color-highlight));font-size:var(--luzmo-slot-menu-drag-handle-size, var(--slot-menu-drag-handle-size));padding:var(--luzmo-slot-menu-drag-handle-vertical-padding, var(--slot-menu-drag-handle-vertical-padding)) var(--luzmo-slot-menu-drag-handle-horizontal-padding, var(--slot-menu-drag-handle-horizontal-padding))}.drag-handle:hover{background-color:var(--luzmo-slot-menu-drag-handle-background-color-hover, var(--luzmo-background-color-highlight-hover))}.slot-content-action{display:flex;flex:0 1 auto;max-width:var(--luzmo-slot-menu-top-menu-label-max-width, var(--slot-menu-top-menu-label-max-width));gap:var(--luzmo-slot-menu-label-to-icon-gap, var(--slot-menu-label-to-icon-gap));background-color:var(--luzmo-slot-menu-content-label-background-color, var(--luzmo-primary));color:var(--luzmo-slot-menu-content-label-color, var(--luzmo-primary-inverse-color));border:var(--luzmo-slot-menu-border-width, var(--luzmo-border-width)) solid var(--luzmo-slot-menu-content-label-border-color, var(--luzmo-primary));padding:var(--luzmo-slot-menu-drag-handle-vertical-padding, var(--slot-menu-drag-handle-vertical-padding)) var(--luzmo-slot-menu-drag-handle-horizontal-padding, var(--slot-menu-drag-handle-horizontal-padding))}.slot-content-action:hover{background-color:var(--luzmo-slot-menu-content-label-background-color-hover, var(--luzmo-primary-hover))}.slot-content-action:focus{background-color:var(--luzmo-slot-menu-content-label-background-color-focus, var(--luzmo-primary-focus))}.slot-content-action .slot-content-label{flex:1 1 auto;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.slot-content-action .slot-content-remove{flex:0 0 auto;cursor:pointer}.close{position:absolute;right:1rem;cursor:pointer;top:calc(-2 * var(--luzmo-slot-menu-border-width, var(--luzmo-border-width)));background-color:var(--luzmo-slot-menu-close-button-background-color, var(--luzmo-background-color-highlight));font-size:var(--luzmo-slot-menu-close-button-size, var(--slot-menu-close-button-size));border:var(--luzmo-slot-menu-border-width, var(--luzmo-border-width)) solid var(--luzmo-slot-menu-border-color, var(--luzmo-border-color));border-radius:var(--luzmo-slot-menu-border-radius, var(--luzmo-border-radius));border-top-left-radius:0;border-top-right-radius:0;padding:var(--luzmo-slot-menu-close-button-vertical-padding, var(--slot-menu-close-button-vertical-padding)) var(--luzmo-slot-menu-close-button-horizontal-padding, var(--slot-menu-close-button-horizontal-padding))}.close:hover{background-color:var(--luzmo-slot-menu-close-button-background-color-hover, var(--luzmo-background-color-highlight-hover))}:host{--slot-menu-display-settings-min-width: 19rem;--slot-menu-min-height: calc(var(--luzmo-component-height) * 2);--slot-menu-font-size: var(--luzmo-font-size);--slot-menu-display-settings-horizontal-padding: var(--luzmo-spacing-5);--slot-menu-display-settings-vertical-padding: var(--luzmo-spacing-4);--slot-menu-top-menu-label-max-width: 12rem;--slot-menu-list-min-width: 8rem;--slot-menu-list-max-width: 12rem;--slot-menu-label-to-icon-gap: var(--luzmo-spacing-3);--slot-menu-drag-handle-size: var(--luzmo-font-size);--slot-menu-drag-handle-vertical-padding: var(--luzmo-spacing-2);--slot-menu-drag-handle-horizontal-padding: var(--luzmo-spacing-3);--slot-menu-close-button-size: var(--luzmo-font-size-s);--slot-menu-close-button-vertical-padding: var(--luzmo-spacing-2);--slot-menu-close-button-horizontal-padding: calc( var(--luzmo-spacing-2) + var(--luzmo-spacing-1) );--slot-menu-popup-shadow-horizontal: 0;--slot-menu-popup-shadow-vertical: 1px;--slot-menu-popup-shadow-blur: 4px;--slot-menu-popup-shadow-color: var(--luzmo-border-color)}:host([size=s]){--slot-menu-display-settings-min-width: 16rem;--slot-menu-min-height: calc(var(--luzmo-component-height-s) * 2);--slot-menu-font-size: var(--luzmo-font-size-s);--slot-menu-display-settings-horizontal-padding: var(--luzmo-spacing-4);--slot-menu-display-settings-vertical-padding: var(--luzmo-spacing-3);--slot-menu-top-menu-label-max-width: 10rem;--slot-menu-list-min-width: 6rem;--slot-menu-list-max-width: 10rem;--slot-menu-label-to-icon-gap: var(--luzmo-spacing-2);--slot-menu-drag-handle-size: var(--luzmo-font-size-s);--slot-menu-drag-handle-vertical-padding: var(--luzmo-spacing-2);--slot-menu-drag-handle-horizontal-padding: var(--luzmo-spacing-3);--slot-menu-close-button-size: var(--luzmo-font-size-xs);--slot-menu-close-button-vertical-padding: var(--luzmo-spacing-2);--slot-menu-close-button-horizontal-padding: calc( var(--luzmo-spacing-2) + var(--luzmo-spacing-1) )}:host([size=l]){--slot-menu-display-settings-min-width: 23rem;--slot-menu-min-height: calc(var(--luzmo-component-height-l) * 2);--slot-menu-font-size: var(--luzmo-font-size-l);--slot-menu-display-settings-horizontal-padding: calc( var(--luzmo-spacing-5) + var(--luzmo-spacing-1) );--slot-menu-display-settings-vertical-padding: var(--luzmo-spacing-5);--slot-menu-top-menu-label-max-width: 14rem;--slot-menu-list-min-width: 9rem;--slot-menu-list-max-width: 14rem;--slot-menu-label-to-icon-gap: var(--luzmo-spacing-4);--slot-menu-drag-handle-size: var(--luzmo-font-size-l);--slot-menu-drag-handle-vertical-padding: var(--luzmo-spacing-3);--slot-menu-drag-handle-horizontal-padding: var(--luzmo-spacing-3);--slot-menu-close-button-size: var(--luzmo-font-size);--slot-menu-close-button-vertical-padding: calc( var(--luzmo-spacing-2) + var(--luzmo-spacing-1) );--slot-menu-close-button-horizontal-padding: var(--luzmo-spacing-3)}:host([size=xl]){--slot-menu-display-settings-min-width: 26rem;--slot-menu-min-height: calc(var(--luzmo-component-height-xl) * 2);--slot-menu-font-size: var(--luzmo-font-size-xl);--slot-menu-display-settings-horizontal-padding: calc( var(--luzmo-spacing-5) + var(--luzmo-spacing-2) );--slot-menu-display-settings-vertical-padding: var(--luzmo-spacing-5);--slot-menu-top-menu-label-max-width: 16rem;--slot-menu-list-min-width: 10rem;--slot-menu-list-max-width: 16rem;--slot-menu-label-to-icon-gap: var(--luzmo-spacing-5);--slot-menu-drag-handle-size: var(--luzmo-font-size-xl);--slot-menu-drag-handle-vertical-padding: var(--luzmo-spacing-3);--slot-menu-drag-handle-horizontal-padding: var(--luzmo-spacing-4);--slot-menu-close-button-size: var(--luzmo-font-size-l);--slot-menu-close-button-vertical-padding: var(--luzmo-spacing-3);--slot-menu-close-button-horizontal-padding: var(--luzmo-spacing-3)}";
+var V = Object.defineProperty, n = (r, o, t, e) => {
+  for (var s = void 0, a = r.length - 1, m; a >= 0; a--)
+    (m = r[a]) && (s = m(o, t, s) || s);
+  return s && V(o, t, s), s;
 };
-class t extends x(f, {
-  validSizes: Object.values(y)
+class l extends H(A, {
+  validSizes: Object.values(j)
 }) {
   constructor() {
-    super(...arguments), this.language = "en", this.contentLanguage = "en", this.slotType = "numeric", this.variant = "draggable", this.slotContents = [], this.measureColumns = [], this._slotListData = [], this._slotContents = [], this._currentSlotContent = {}, this._activeIndex = this.slotIndex ?? 0;
+    super(...arguments), this.language = "en", this.contentLanguage = "en", this.slotType = "numeric", this.variant = "draggable", this.measureColumns = [], this._slotListData = [], this._slotContents = [], this._currentSlotContent = {}, this._activeIndex = this.slotIndex ?? 0;
   }
   static get styles() {
-    return [h(w)];
+    return [T(N)];
   }
   disconnectedCallback() {
-    super.disconnectedCallback();
+    super.disconnectedCallback(), this._cleanupDrag && (this._cleanupDrag(), this._cleanupDrag = void 0);
   }
   _sendChangeEvent() {
     this.dispatchEvent(
@@ -73,27 +120,31 @@ class t extends x(f, {
     );
   }
   willUpdate(o) {
-    var l;
-    o.has("slotContents") && (this._slotContents = structuredClone(this.slotContents), this._slotListData = structuredClone(this.slotContents), this._currentSlotContent = ((l = this._slotContents) == null ? void 0 : l[this.slotIndex ?? this._activeIndex ?? 0]) ?? {});
+    var e, s;
+    const t = ((e = this._store) == null ? void 0 : e.slotContents.get()) ?? [];
+    t !== this._slotContents && (this._slotContents = structuredClone(t), this._slotListData = structuredClone(t), this._currentSlotContent = ((s = this._slotContents) == null ? void 0 : s[this.slotIndex ?? this._activeIndex ?? 0]) ?? {});
   }
   updated() {
     this.updateContentLabel();
   }
   _handleSlotListChange(o) {
-    var r;
+    var e;
     this._slotContents = structuredClone(o.detail.slotContents);
-    const l = o.detail.activeIndex;
-    l !== this._activeIndex && (this._activeIndex = l), this._currentSlotContent = ((r = this._slotContents) == null ? void 0 : r[this.slotIndex ?? this._activeIndex ?? 0]) ?? {}, this.displaySettingsElement.slotContent = this._currentSlotContent, this._slotContents.length <= 1 && this.requestUpdate(), this._sendChangeEvent();
+    const t = o.detail.activeIndex;
+    t !== this._activeIndex && (this._activeIndex = t), this._currentSlotContent = ((e = this._slotContents) == null ? void 0 : e[this.slotIndex ?? this._activeIndex ?? 0]) ?? {}, this.displaySettingsElement.slotContent = this._currentSlotContent, this._slotContents.length <= 1 && this.requestUpdate(), this._store.setContents(this._slotContents), this._sendChangeEvent();
   }
   _handleSlotContentChange(o) {
     this._slotContents[this.slotIndex ?? this._activeIndex] = structuredClone(
       o.detail.slotContent
-    ), this._slotListData = structuredClone(this._slotContents), this.slotMenuListElement && (this.slotMenuListElement.slotContents = this._slotListData), this.updateContentLabel(), this._sendChangeEvent();
+    ), this._slotListData = structuredClone(this._slotContents), this.slotMenuListElement && (this.slotMenuListElement.slotContents = this._slotListData), this.updateContentLabel(), this._store.updateContent(
+      o.detail.slotContent,
+      this.slotIndex ?? this._activeIndex
+    ), this._sendChangeEvent();
   }
   // we set & update the label manually to not lose focus when typing in the display settings bc of rerender
   updateContentLabel() {
     if (this.slotContentLabelElement) {
-      const o = b(
+      const o = q(
         this._slotContents[this.slotIndex ?? this._activeIndex].label,
         this.contentLanguage
       );
@@ -102,8 +153,8 @@ class t extends x(f, {
   }
   removeSlotContent(o) {
     this._slotContents = this._slotContents.filter(
-      (l, r) => r !== o
-    ), this._currentSlotContent = {}, this._sendChangeEvent(), this._sendCloseEvent(), this.requestUpdate();
+      (t, e) => e !== o
+    ), this._currentSlotContent = {}, this._store.setContents(this._slotContents), this._sendChangeEvent(), this._sendCloseEvent(), this.requestUpdate();
   }
   close() {
     this._sendCloseEvent();
@@ -112,27 +163,27 @@ class t extends x(f, {
     this.removeSlotContent(this.slotIndex ?? this._activeIndex);
   }
   render() {
-    var o, l, r;
-    return i`<div class="slot-menu-top-menu">
-        ${this.variant === "draggable" ? i`<div class="drag-handle">${m(z)}</div>` : ""}
-        ${this._slotContents && this._slotContents.length === 1 && this.variant !== "popup" ? i` <div class="slot-content-action">
+    var o, t, e;
+    return h`<div class="slot-menu-top-menu">
+        ${this.variant === "draggable" ? h`<div class="drag-handle">${C(U)}</div>` : ""}
+        ${this._slotContents && this._slotContents.length === 1 && this.variant !== "popup" ? h` <div class="slot-content-action">
               <div class="slot-content-label"></div>
               <div
                 class="slot-content-remove"
                 @click=${this.removeSlotContent.bind(this, 0)}
               >
-                ${m(g)}
+                ${C(X)}
               </div>
             </div>` : ""}
       </div>
       <div
         class="slot-contents-container ${((o = this._slotContents) == null ? void 0 : o.length) > 1 ? "multiple" : ""}"
       >
-        ${this.variant === "popup" ? "" : i`<div class="close" @click=${this.close}>
-              ${m(v)}
+        ${this.variant === "popup" ? "" : h`<div class="close" @click=${this.close}>
+              ${C(Y)}
             </div>`}
         <div class="inner-container">
-          ${((l = this._slotContents) == null ? void 0 : l.length) > 1 && typeof this.slotIndex != "number" ? i`<luzmo-slot-menu-list
+          ${((t = this._slotContents) == null ? void 0 : t.length) > 1 && typeof this.slotIndex != "number" ? h`<luzmo-slot-menu-list
                 .slotContents=${this._slotListData}
                 .activeIndex=${this.slotIndex ?? this._activeIndex}
                 @slot-list-changed=${this._handleSlotListChange}
@@ -143,55 +194,74 @@ class t extends x(f, {
             .contentLanguage=${this.contentLanguage}
             .slotContent=${this._currentSlotContent}
             .slotType=${this.slotType}
+            .periodOverPeriod=${this._currentSlotContent.periodOverPeriod}
             .measureColumns=${this.measureColumns}
-            .showRemoveButton=${this.variant === "popup" && (typeof this.slotIndex == "number" || ((r = this._slotContents) == null ? void 0 : r.length) === 1)}
+            .showRemoveButton=${this.variant === "popup" && (typeof this.slotIndex == "number" || ((e = this._slotContents) == null ? void 0 : e.length) === 1)}
             @slot-content-changed=${this._handleSlotContentChange}
             @remove-slot-content=${this._removeActiveSlotContent}
           ></luzmo-display-settings>
         </div>
       </div>`;
   }
+  firstUpdated(o) {
+    if (this.variant === "draggable" && !this.noDrag) {
+      const t = this.renderRoot.querySelector(
+        ".drag-handle"
+      );
+      if (t) {
+        const e = this.dragBoundary ? document.querySelector(this.dragBoundary) : document.documentElement;
+        this._cleanupDrag = F({
+          element: this,
+          handle: t,
+          boundary: e
+        });
+      }
+    }
+  }
 }
-e([
-  n({ type: String, reflect: !0 })
-], t.prototype, "language");
-e([
-  n({ type: String, attribute: "content-language", reflect: !0 })
-], t.prototype, "contentLanguage");
-e([
-  n({ type: String, attribute: "slot-type", reflect: !0 })
-], t.prototype, "slotType");
-e([
-  n({ type: Boolean, attribute: "no-drag", reflect: !0 })
-], t.prototype, "noDrag");
-e([
-  n({ type: Boolean, attribute: "no-close", reflect: !0 })
-], t.prototype, "noClose");
-e([
-  n({ type: String, reflect: !0 })
-], t.prototype, "variant");
-e([
-  n({ type: Boolean, attribute: "no-top-menu-label", reflect: !0 })
-], t.prototype, "noTopMenuLabel");
-e([
-  n()
-], t.prototype, "slotContents");
-e([
-  n({ type: Array, reflect: !1 })
-], t.prototype, "measureColumns");
-e([
-  n({ type: Number, reflect: !1, attribute: "slot-index" })
-], t.prototype, "slotIndex");
-e([
-  d(".slot-content-label")
-], t.prototype, "slotContentLabelElement");
-e([
-  d("luzmo-display-settings")
-], t.prototype, "displaySettingsElement");
-e([
-  d("luzmo-slot-menu-list")
-], t.prototype, "slotMenuListElement");
-customElements.get("luzmo-slot-menu") || customElements.define("luzmo-slot-menu", t);
+n([
+  u({ type: String, reflect: !0 })
+], l.prototype, "language");
+n([
+  u({ type: String, attribute: "content-language", reflect: !0 })
+], l.prototype, "contentLanguage");
+n([
+  u({ type: String, attribute: "slot-type", reflect: !0 })
+], l.prototype, "slotType");
+n([
+  u({ type: Boolean, attribute: "no-drag", reflect: !0 })
+], l.prototype, "noDrag");
+n([
+  u({ type: Boolean, attribute: "no-close", reflect: !0 })
+], l.prototype, "noClose");
+n([
+  u({ type: String, reflect: !0 })
+], l.prototype, "variant");
+n([
+  u({ type: Boolean, attribute: "no-top-menu-label", reflect: !0 })
+], l.prototype, "noTopMenuLabel");
+n([
+  O({ context: R, subscribe: !0 })
+], l.prototype, "_store");
+n([
+  u({ type: String, attribute: "drag-boundary", reflect: !1 })
+], l.prototype, "dragBoundary");
+n([
+  u({ type: Array, reflect: !1 })
+], l.prototype, "measureColumns");
+n([
+  u({ type: Number, reflect: !1, attribute: "slot-index" })
+], l.prototype, "slotIndex");
+n([
+  _(".slot-content-label")
+], l.prototype, "slotContentLabelElement");
+n([
+  _("luzmo-display-settings")
+], l.prototype, "displaySettingsElement");
+n([
+  _("luzmo-slot-menu-list")
+], l.prototype, "slotMenuListElement");
+customElements.get("luzmo-slot-menu") || customElements.define("luzmo-slot-menu", l);
 export {
-  t as LuzmoSlotMenu
+  l as LuzmoSlotMenu
 };

package/components/slot-menu/slot-menu.d.ts

@@ -44,10 +44,8 @@ export declare class LuzmoSlotMenu extends LuzmoSlotMenu_base {
      * Whether to show the top menu label & delete button
      */
     noTopMenuLabel?: boolean;
-    /**
-     * The contents of the slot
-     */
-    slotContents: any;
+    private _store;
+    dragBoundary?: string;
     /**
      * The list of columns that can be used for the rate aggregation
      */
@@ -63,10 +61,11 @@ export declare class LuzmoSlotMenu extends LuzmoSlotMenu_base {
     _slotContents: any[];
     _currentSlotContent: any;
     _activeIndex: number;
+    private _cleanupDrag?;
     disconnectedCallback(): void;
     private _sendChangeEvent;
     private _sendCloseEvent;
-    protected willUpdate(changedProperties: PropertyValues): void;
+    protected willUpdate(_changedProperties: PropertyValues): void;
     protected updated(): void;
     private _handleSlotListChange;
     private _handleSlotContentChange;
@@ -75,5 +74,6 @@ export declare class LuzmoSlotMenu extends LuzmoSlotMenu_base {
     close(): void;
     _removeActiveSlotContent(): void;
     protected render(): TemplateResult;
+    protected firstUpdated(_changedProperties: PropertyValues): void;
 }
 export {};

package/components/slot-menu-list/index.cjs

@@ -17,7 +17,7 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  * */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const p=require("../property-BCb4Kybn.cjs"),v=require("../get-css-variable-DLiZYZEi.cjs"),C=require("../luzmo-icons-B_3XTuMC.cjs"),_=require("../localize-r7ALOUy_.cjs"),P=require("../query-all-CR2wWKRD.cjs"),j=require("../focusable-BTJYY_Mf.cjs"),k=require("../sized-mixin-BNtmplgF.cjs");var D={large:700};function F(i){i.animate([{backgroundColor:"var(--ds-background-selected, #E9F2FF)"},{}],{duration:D.large,easing:"cubic-bezier(0.25, 0.1, 0.25, 1.0)",iterations:1})}function w(i,t){var e=Object.keys(i);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(i);t&&(o=o.filter(function(s){return Object.getOwnPropertyDescriptor(i,s).enumerable})),e.push.apply(e,o)}return e}function S(i){for(var t=1;t<arguments.length;t++){var e=arguments[t]!=null?arguments[t]:{};t%2?w(Object(e),!0).forEach(function(o){v._defineProperty(i,o,e[o])}):Object.getOwnPropertyDescriptors?Object.defineProperties(i,Object.getOwnPropertyDescriptors(e)):w(Object(e)).forEach(function(o){Object.defineProperty(i,o,Object.getOwnPropertyDescriptor(e,o))})}return i}var L={top:function(t,e){return Math.abs(e.y-t.top)},right:function(t,e){return Math.abs(t.right-e.x)},bottom:function(t,e){return Math.abs(t.bottom-e.y)},left:function(t,e){return Math.abs(e.x-t.left)}},I=Symbol("closestEdge");function $(i,t){var e,o,s=t.element,u=t.input,n=t.allowedEdges,l={x:u.clientX,y:u.clientY},r=s.getBoundingClientRect(),a=n.map(function(c){return{edge:c,value:L[c](r,l)}}),d=(e=(o=a.sort(function(c,b){return c.value-b.value})[0])===null||o===void 0?void 0:o.edge)!==null&&e!==void 0?e:null;return S(S({},i),{},v._defineProperty({},I,d))}function E(i){var t;return(t=i[I])!==null&&t!==void 0?t:null}const M=':host{font-family:var(--luzmo-slot-menu-list-font-family, var(--luzmo-font-family));font-size:var(--luzmo-slot-menu-list-font-size, var(--slot-menu-list-font-size));color:var(--luzmo-slot-menu-listfont-color, var(--luzmo-font-color))}:host{margin:0;padding:0;list-style:none;border-right:var(--luzmo-slot-menu-list-border-right-width, var(--luzmo-border-width)) solid var(--luzmo-slot-menu-list-border-right-color, var(--luzmo-border-color))}:host li{position:relative;cursor:pointer}:host li:hover{background-color:var(--luzmo-slot-menu-list-background-color-hover, var(--slot-menu-list-background-color-hover))}:host .active{background-color:var(--luzmo-slot-menu-list-active-background-color, var(--slot-menu-list-active-background-color));color:var(--luzmo-slot-menu-list-active-color, var(--slot-menu-list-active-color))}:host .active:hover{background-color:var(--luzmo-slot-menu-list-active-background-color-hover, var(--slot-menu-list-active-background-color-hover))}.drop-indicator{position:absolute;left:0;right:0;height:var(--luzmo-slot-menu-list-drop-indicator-height, var(--slot-menu-list-drop-indicator-height));background-color:var(--luzmo-slot-menu-list-drop-indicator-color, var(--slot-menu-list-drop-indicator-color))}.drop-indicator:before{content:"";display:block;width:100%;border:var(--luzmo-slot-menu-list-drop-indicator-height, var(--slot-menu-list-drop-indicator-height)) solid var(--luzmo-slot-menu-list-drop-indicator-color, var(--slot-menu-list-drop-indicator-color));border-radius:50%;position:absolute;background:var(--luzmo-slot-menu-list-drop-indicator-background, var(--luzmo-background-color));left:calc(-.5 * (var(--luzmo-slot-menu-list-drop-indicator-circle-size, var(--slot-menu-list-drop-indicator-circle-size)) + var(--luzmo-slot-menu-list-drop-indicator-height, var(--slot-menu-list-drop-indicator-height))));top:calc(-.5 * (var(--luzmo-slot-menu-list-drop-indicator-circle-size, var(--slot-menu-list-drop-indicator-circle-size)) + var(--luzmo-slot-menu-list-drop-indicator-height, var(--slot-menu-list-drop-indicator-height))));height:var(--luzmo-slot-menu-list-drop-indicator-circle-size, var(--slot-menu-list-drop-indicator-circle-size));width:var(--luzmo-slot-menu-list-drop-indicator-circle-size, var(--slot-menu-list-drop-indicator-circle-size))}.drop-indicator[data-edge=top]{top:calc(-.5 * var(--luzmo-slot-menu-list-drop-indicator-height, var(--slot-menu-list-drop-indicator-height)))}.drop-indicator[data-edge=bottom]{bottom:calc(-.5 * var(--luzmo-slot-menu-list-drop-indicator-height, var(--slot-menu-list-drop-indicator-height)))}.draggable-slot-content{display:flex;justify-content:space-between;gap:var(--luzmo-slot-menu-label-to-icon-gap, var(--slot-menu-label-to-icon-gap));align-items:center}.draggable-slot-content .draggable-slot-content-label,.draggable-slot-content .draggable-slot-content-remove{padding-block-start:var(--luzmo-slot-menu-list-item-vertical-padding, var(--slot-menu-list-item-vertical-padding));padding-block-end:var(--luzmo-slot-menu-list-item-vertical-padding, var(--slot-menu-list-item-vertical-padding))}.draggable-slot-content .draggable-slot-content-label{padding-inline-start:var(--luzmo-slot-menu-list-item-horizontal-padding, var(--slot-menu-list-item-horizontal-padding));flex:1 1 auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.draggable-slot-content .draggable-slot-content-remove{padding-inline-end:var(--luzmo-slot-menu-list-item-horizontal-padding, var(--slot-menu-list-item-horizontal-padding));flex:0 0 auto}:host{--slot-menu-list-active-background-color: var(--luzmo-primary);--slot-menu-list-active-background-color-hover: var(--luzmo-primary-hover);--slot-menu-list-active-color: var(--luzmo-primary-inverse-color);--slot-menu-list-background-color-hover: var(--luzmo-background-color-hover);--slot-menu-list-drop-indicator-color: var(--luzmo-font-color-down);--slot-menu-list-drop-indicator-height: 2px;--slot-menu-list-drop-indicator-circle-size: 4px}:host{--slot-menu-display-settings-min-width: 19rem;--slot-menu-min-height: calc(var(--luzmo-component-height) * 2);--slot-menu-font-size: var(--luzmo-font-size);--slot-menu-list-item-horizontal-padding: var(--luzmo-spacing-4);--slot-menu-list-item-vertical-padding: var(--luzmo-spacing-3);--slot-menu-label-to-icon-gap: var(--luzmo-spacing-3)}:host([size=s]){--slot-menu-display-settings-min-width: 16rem;--slot-menu-min-height: calc(var(--luzmo-component-height-s) * 2);--slot-menu-font-size: var(--luzmo-font-size-s);--slot-menu-list-item-horizontal-padding: var(--luzmo-spacing-3);--slot-menu-list-item-vertical-padding: var(--luzmo-spacing-3);--slot-menu-label-to-icon-gap: var(--luzmo-spacing-2)}:host([size=l]){--slot-menu-display-settings-min-width: 23rem;--slot-menu-min-height: calc(var(--luzmo-component-height-l) * 2);--slot-menu-font-size: var(--luzmo-font-size-l);--slot-menu-list-item-horizontal-padding: var(--luzmo-spacing-5);--slot-menu-list-item-vertical-padding: var(--luzmo-spacing-3);--slot-menu-label-to-icon-gap: var(--luzmo-spacing-4)}:host([size=xl]){--slot-menu-display-settings-min-width: 26rem;--slot-menu-min-height: calc(var(--luzmo-component-height-xl) * 2);--slot-menu-font-size: var(--luzmo-font-size-xl);--slot-menu-list-item-horizontal-padding: var(--luzmo-spacing-5);--slot-menu-list-item-vertical-padding: var(--luzmo-spacing-4);--slot-menu-label-to-icon-gap: var(--luzmo-spacing-5)}';var q=Object.defineProperty,f=(i,t,e,o)=>{for(var s=void 0,u=i.length-1,n;u>=0;u--)(n=i[u])&&(s=n(t,e,s)||s);return s&&q(t,e,s),s};class h extends k.SizedMixin(j.LuzmoElement,{validSizes:Object.values(k.ElementSizes)}){constructor(){super(...arguments),this.language="en",this.contentLanguage="en",this.slotContents=[],this.activeIndex=0,this._sendChangeEvent=()=>{this.dispatchEvent(new CustomEvent("slot-list-changed",{bubbles:!0,composed:!0,cancelable:!0,detail:{slotContents:structuredClone(this.slotContents),activeIndex:this.activeIndex}}))},this._cleanupFns=[],this._attachAll=()=>{[...this._draggableSlotContentElements].forEach(t=>{const e=this._sendChangeEvent.bind(this),o=this,s=v.draggable({element:t,onGenerateDragPreview({nativeSetDragImage:n}){v.setCustomNativeDragPreview({nativeSetDragImage:n,render({container:l}){var d;const r=document.createElement("div");r.classList.add("drag-preview");const a={};[["borderColor","--luzmo-slot-menu-list-border-color","--luzmo-border-color"],["backgroundColor","--luzmo-slot-menu-list-background-color","--luzmo-background-color"],["color","--luzmo-slot-menu-list-font-color","--slot-menu-list-font-color"],["fontSize","--luzmo-slot-menu-list-font-size","--slot-menu-list-font-size"],["horizontalPadding","--luzmo-slot-menu-list-item-horizontal-padding","--slot-menu-list-item-horizontal-padding"],["verticalPadding","--luzmo-slot-menu-list-item-vertical-padding","--slot-menu-list-item-vertical-padding"],["borderRadius","--luzmo-slot-menu-list-border-radius","--luzmo-border-radius"],["fontFamily","--luzmo-slot-menu-list-font-family","--luzmo-font-family"]].forEach(([c,b,y])=>{const m=v.getCssVariableValue(t,b)||v.getCssVariableValue(t,y);a[c]=m}),r.textContent=((d=t.querySelector("[data-task-content]"))==null?void 0:d.textContent)??t.textContent,Object.assign(r.style,{border:`1px solid ${a.borderColor}`,backgroundColor:a.backgroundColor,borderRadius:a.borderRadius,fontFamily:a.fontFamily,fontSize:a.fontSize,color:a.color,paddingInline:`${a.horizontalPadding}`,paddingBlock:`${a.verticalPadding}`}),l.append(r)}})},getInitialData(){var r;const n=t.parentElement;let l=0;return n&&(l=[...((r=n.parentElement)==null?void 0:r.children)??[]].indexOf(n)),{index:l}},onDragStart(){t.style.opacity="0.5"},onDrop(){t.style.opacity="1"}});this._cleanupFns.push(s);const u=v.dropTargetForElements({element:t,canDrop({source:n}){var l;return n.element===t?!1:(l=n==null?void 0:n.element)==null?void 0:l.classList.contains("draggable-slot-content")},getData(n){return $({},{element:t,input:n.input,allowedEdges:["top","bottom"]})},getIsSticky(){return!0},onDragEnter({self:n}){const l=E(n.data);if(!l)return;const r=document.createElement("div");r.classList.add("drop-indicator"),r.dataset.edge=l,t.after(r)},onDrag({self:n}){var a,d,c;const l=E(n.data);if(!l){(a=t.nextElementSibling)==null||a.remove();return}if(((d=t.nextElementSibling)==null?void 0:d.getAttribute("data-edge"))===l)return;(c=t.nextElementSibling)==null||c.remove();const r=document.createElement("div");r.classList.add("drop-indicator"),r.dataset.edge=l,t.after(r)},onDragLeave(){var n;(n=t.nextElementSibling)==null||n.remove()},onDrop({self:n,source:l}){var d,c,b,y;(d=t.nextElementSibling)==null||d.remove();const r=E(n.data),a=n.element.parentElement;if(typeof l.data.index=="number"&&a){let m=[...((c=a.parentElement)==null?void 0:c.children)??[]].indexOf(a);r==="bottom"&&l.data.index>=m&&m<(((y=(b=a==null?void 0:a.parentElement)==null?void 0:b.children)==null?void 0:y.length)??0)-1?m+=1:r==="top"&&m>l.data.index&&(m-=1);const g=o.activeIndex,z=l.data.index,x=m,O=o.slotContents[z];o.slotContents.splice(z,1),o.slotContents.splice(x,0,O),z===g?o.activeIndex=x:z<g&&x>=g?o.activeIndex=g-1:z>g&&x<=g&&(o.activeIndex=g+1)}r&&(F(l.element),o.requestUpdate(),e())}});this._cleanupFns.push(u)})},this._detachAll=()=>{this._cleanupFns.forEach(t=>t()),this._cleanupFns=[]}}static get styles(){return[p.r(M)]}willUpdate(){this._detachAll()}updated(){this._attachAll()}setActiveIndex(t){this.activeIndex=t,this._sendChangeEvent()}removeSlotContent(t){this.slotContents=this.slotContents.filter((e,o)=>o!==t),this.activeIndex===t?this.activeIndex=t:this.slotContents.length>0&&this.activeIndex>t&&this.activeIndex--,this._sendChangeEvent()}render(){const t=this.slotContents.map((e,o)=>{const s=_.localize(e.label,this.contentLanguage);return p.x`<li class=${o===this.activeIndex?"active":""}>
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const p=require("../property-BV1QaY8E.cjs"),v=require("../get-css-variable-DLiZYZEi.cjs"),C=require("../luzmo-icons-Bvm-_ECi.cjs"),_=require("../localize-r7ALOUy_.cjs"),P=require("../query-all-CR2wWKRD.cjs"),j=require("../focusable-B8t8a-WJ.cjs"),k=require("../sized-mixin-C48t6K7U.cjs");var D={large:700};function F(i){i.animate([{backgroundColor:"var(--ds-background-selected, #E9F2FF)"},{}],{duration:D.large,easing:"cubic-bezier(0.25, 0.1, 0.25, 1.0)",iterations:1})}function w(i,t){var e=Object.keys(i);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(i);t&&(o=o.filter(function(s){return Object.getOwnPropertyDescriptor(i,s).enumerable})),e.push.apply(e,o)}return e}function S(i){for(var t=1;t<arguments.length;t++){var e=arguments[t]!=null?arguments[t]:{};t%2?w(Object(e),!0).forEach(function(o){v._defineProperty(i,o,e[o])}):Object.getOwnPropertyDescriptors?Object.defineProperties(i,Object.getOwnPropertyDescriptors(e)):w(Object(e)).forEach(function(o){Object.defineProperty(i,o,Object.getOwnPropertyDescriptor(e,o))})}return i}var L={top:function(t,e){return Math.abs(e.y-t.top)},right:function(t,e){return Math.abs(t.right-e.x)},bottom:function(t,e){return Math.abs(t.bottom-e.y)},left:function(t,e){return Math.abs(e.x-t.left)}},I=Symbol("closestEdge");function $(i,t){var e,o,s=t.element,u=t.input,n=t.allowedEdges,l={x:u.clientX,y:u.clientY},r=s.getBoundingClientRect(),a=n.map(function(c){return{edge:c,value:L[c](r,l)}}),d=(e=(o=a.sort(function(c,b){return c.value-b.value})[0])===null||o===void 0?void 0:o.edge)!==null&&e!==void 0?e:null;return S(S({},i),{},v._defineProperty({},I,d))}function E(i){var t;return(t=i[I])!==null&&t!==void 0?t:null}const M=':host{font-family:var(--luzmo-slot-menu-list-font-family, var(--luzmo-font-family));font-size:var(--luzmo-slot-menu-list-font-size, var(--slot-menu-list-font-size));color:var(--luzmo-slot-menu-listfont-color, var(--luzmo-font-color))}:host{margin:0;padding:0;list-style:none;border-right:var(--luzmo-slot-menu-list-border-right-width, var(--luzmo-border-width)) solid var(--luzmo-slot-menu-list-border-right-color, var(--luzmo-border-color))}:host li{position:relative;cursor:pointer}:host li:hover{background-color:var(--luzmo-slot-menu-list-background-color-hover, var(--slot-menu-list-background-color-hover))}:host .active{background-color:var(--luzmo-slot-menu-list-active-background-color, var(--slot-menu-list-active-background-color));color:var(--luzmo-slot-menu-list-active-color, var(--slot-menu-list-active-color))}:host .active:hover{background-color:var(--luzmo-slot-menu-list-active-background-color-hover, var(--slot-menu-list-active-background-color-hover))}.drop-indicator{position:absolute;left:0;right:0;height:var(--luzmo-slot-menu-list-drop-indicator-height, var(--slot-menu-list-drop-indicator-height));background-color:var(--luzmo-slot-menu-list-drop-indicator-color, var(--slot-menu-list-drop-indicator-color))}.drop-indicator:before{content:"";display:block;width:100%;border:var(--luzmo-slot-menu-list-drop-indicator-height, var(--slot-menu-list-drop-indicator-height)) solid var(--luzmo-slot-menu-list-drop-indicator-color, var(--slot-menu-list-drop-indicator-color));border-radius:50%;position:absolute;background:var(--luzmo-slot-menu-list-drop-indicator-background, var(--luzmo-background-color));left:calc(-.5 * (var(--luzmo-slot-menu-list-drop-indicator-circle-size, var(--slot-menu-list-drop-indicator-circle-size)) + var(--luzmo-slot-menu-list-drop-indicator-height, var(--slot-menu-list-drop-indicator-height))));top:calc(-.5 * (var(--luzmo-slot-menu-list-drop-indicator-circle-size, var(--slot-menu-list-drop-indicator-circle-size)) + var(--luzmo-slot-menu-list-drop-indicator-height, var(--slot-menu-list-drop-indicator-height))));height:var(--luzmo-slot-menu-list-drop-indicator-circle-size, var(--slot-menu-list-drop-indicator-circle-size));width:var(--luzmo-slot-menu-list-drop-indicator-circle-size, var(--slot-menu-list-drop-indicator-circle-size))}.drop-indicator[data-edge=top]{top:calc(-.5 * var(--luzmo-slot-menu-list-drop-indicator-height, var(--slot-menu-list-drop-indicator-height)))}.drop-indicator[data-edge=bottom]{bottom:calc(-.5 * var(--luzmo-slot-menu-list-drop-indicator-height, var(--slot-menu-list-drop-indicator-height)))}.draggable-slot-content{display:flex;justify-content:space-between;gap:var(--luzmo-slot-menu-label-to-icon-gap, var(--slot-menu-label-to-icon-gap));align-items:center}.draggable-slot-content .draggable-slot-content-label,.draggable-slot-content .draggable-slot-content-remove{padding-block-start:var(--luzmo-slot-menu-list-item-vertical-padding, var(--slot-menu-list-item-vertical-padding));padding-block-end:var(--luzmo-slot-menu-list-item-vertical-padding, var(--slot-menu-list-item-vertical-padding))}.draggable-slot-content .draggable-slot-content-label{padding-inline-start:var(--luzmo-slot-menu-list-item-horizontal-padding, var(--slot-menu-list-item-horizontal-padding));flex:1 1 auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.draggable-slot-content .draggable-slot-content-remove{padding-inline-end:var(--luzmo-slot-menu-list-item-horizontal-padding, var(--slot-menu-list-item-horizontal-padding));flex:0 0 auto}:host{--slot-menu-list-active-background-color: var(--luzmo-primary);--slot-menu-list-active-background-color-hover: var(--luzmo-primary-hover);--slot-menu-list-active-color: var(--luzmo-primary-inverse-color);--slot-menu-list-background-color-hover: var(--luzmo-background-color-hover);--slot-menu-list-drop-indicator-color: var(--luzmo-font-color-down);--slot-menu-list-drop-indicator-height: 2px;--slot-menu-list-drop-indicator-circle-size: 4px}:host{--slot-menu-display-settings-min-width: 19rem;--slot-menu-min-height: calc(var(--luzmo-component-height) * 2);--slot-menu-font-size: var(--luzmo-font-size);--slot-menu-list-item-horizontal-padding: var(--luzmo-spacing-4);--slot-menu-list-item-vertical-padding: var(--luzmo-spacing-3);--slot-menu-label-to-icon-gap: var(--luzmo-spacing-3)}:host([size=s]){--slot-menu-display-settings-min-width: 16rem;--slot-menu-min-height: calc(var(--luzmo-component-height-s) * 2);--slot-menu-font-size: var(--luzmo-font-size-s);--slot-menu-list-item-horizontal-padding: var(--luzmo-spacing-3);--slot-menu-list-item-vertical-padding: var(--luzmo-spacing-3);--slot-menu-label-to-icon-gap: var(--luzmo-spacing-2)}:host([size=l]){--slot-menu-display-settings-min-width: 23rem;--slot-menu-min-height: calc(var(--luzmo-component-height-l) * 2);--slot-menu-font-size: var(--luzmo-font-size-l);--slot-menu-list-item-horizontal-padding: var(--luzmo-spacing-5);--slot-menu-list-item-vertical-padding: var(--luzmo-spacing-3);--slot-menu-label-to-icon-gap: var(--luzmo-spacing-4)}:host([size=xl]){--slot-menu-display-settings-min-width: 26rem;--slot-menu-min-height: calc(var(--luzmo-component-height-xl) * 2);--slot-menu-font-size: var(--luzmo-font-size-xl);--slot-menu-list-item-horizontal-padding: var(--luzmo-spacing-5);--slot-menu-list-item-vertical-padding: var(--luzmo-spacing-4);--slot-menu-label-to-icon-gap: var(--luzmo-spacing-5)}';var q=Object.defineProperty,f=(i,t,e,o)=>{for(var s=void 0,u=i.length-1,n;u>=0;u--)(n=i[u])&&(s=n(t,e,s)||s);return s&&q(t,e,s),s};class h extends k.SizedMixin(j.LuzmoElement,{validSizes:Object.values(k.ElementSizes)}){constructor(){super(...arguments),this.language="en",this.contentLanguage="en",this.slotContents=[],this.activeIndex=0,this._sendChangeEvent=()=>{this.dispatchEvent(new CustomEvent("slot-list-changed",{bubbles:!0,composed:!0,cancelable:!0,detail:{slotContents:structuredClone(this.slotContents),activeIndex:this.activeIndex}}))},this._cleanupFns=[],this._attachAll=()=>{[...this._draggableSlotContentElements].forEach(t=>{const e=this._sendChangeEvent.bind(this),o=this,s=v.draggable({element:t,onGenerateDragPreview({nativeSetDragImage:n}){v.setCustomNativeDragPreview({nativeSetDragImage:n,render({container:l}){var d;const r=document.createElement("div");r.classList.add("drag-preview");const a={};[["borderColor","--luzmo-slot-menu-list-border-color","--luzmo-border-color"],["backgroundColor","--luzmo-slot-menu-list-background-color","--luzmo-background-color"],["color","--luzmo-slot-menu-list-font-color","--slot-menu-list-font-color"],["fontSize","--luzmo-slot-menu-list-font-size","--slot-menu-list-font-size"],["horizontalPadding","--luzmo-slot-menu-list-item-horizontal-padding","--slot-menu-list-item-horizontal-padding"],["verticalPadding","--luzmo-slot-menu-list-item-vertical-padding","--slot-menu-list-item-vertical-padding"],["borderRadius","--luzmo-slot-menu-list-border-radius","--luzmo-border-radius"],["fontFamily","--luzmo-slot-menu-list-font-family","--luzmo-font-family"]].forEach(([c,b,y])=>{const m=v.getCssVariableValue(t,b)||v.getCssVariableValue(t,y);a[c]=m}),r.textContent=((d=t.querySelector("[data-task-content]"))==null?void 0:d.textContent)??t.textContent,Object.assign(r.style,{border:`1px solid ${a.borderColor}`,backgroundColor:a.backgroundColor,borderRadius:a.borderRadius,fontFamily:a.fontFamily,fontSize:a.fontSize,color:a.color,paddingInline:`${a.horizontalPadding}`,paddingBlock:`${a.verticalPadding}`}),l.append(r)}})},getInitialData(){var r;const n=t.parentElement;let l=0;return n&&(l=[...((r=n.parentElement)==null?void 0:r.children)??[]].indexOf(n)),{index:l}},onDragStart(){t.style.opacity="0.5"},onDrop(){t.style.opacity="1"}});this._cleanupFns.push(s);const u=v.dropTargetForElements({element:t,canDrop({source:n}){var l;return n.element===t?!1:(l=n==null?void 0:n.element)==null?void 0:l.classList.contains("draggable-slot-content")},getData(n){return $({},{element:t,input:n.input,allowedEdges:["top","bottom"]})},getIsSticky(){return!0},onDragEnter({self:n}){const l=E(n.data);if(!l)return;const r=document.createElement("div");r.classList.add("drop-indicator"),r.dataset.edge=l,t.after(r)},onDrag({self:n}){var a,d,c;const l=E(n.data);if(!l){(a=t.nextElementSibling)==null||a.remove();return}if(((d=t.nextElementSibling)==null?void 0:d.getAttribute("data-edge"))===l)return;(c=t.nextElementSibling)==null||c.remove();const r=document.createElement("div");r.classList.add("drop-indicator"),r.dataset.edge=l,t.after(r)},onDragLeave(){var n;(n=t.nextElementSibling)==null||n.remove()},onDrop({self:n,source:l}){var d,c,b,y;(d=t.nextElementSibling)==null||d.remove();const r=E(n.data),a=n.element.parentElement;if(typeof l.data.index=="number"&&a){let m=[...((c=a.parentElement)==null?void 0:c.children)??[]].indexOf(a);r==="bottom"&&l.data.index>=m&&m<(((y=(b=a==null?void 0:a.parentElement)==null?void 0:b.children)==null?void 0:y.length)??0)-1?m+=1:r==="top"&&m>l.data.index&&(m-=1);const g=o.activeIndex,z=l.data.index,x=m,O=o.slotContents[z];o.slotContents.splice(z,1),o.slotContents.splice(x,0,O),z===g?o.activeIndex=x:z<g&&x>=g?o.activeIndex=g-1:z>g&&x<=g&&(o.activeIndex=g+1)}r&&(F(l.element),o.requestUpdate(),e())}});this._cleanupFns.push(u)})},this._detachAll=()=>{this._cleanupFns.forEach(t=>t()),this._cleanupFns=[]}}static get styles(){return[p.r(M)]}willUpdate(){this._detachAll()}updated(){this._attachAll()}setActiveIndex(t){this.activeIndex=t,this._sendChangeEvent()}removeSlotContent(t){this.slotContents=this.slotContents.filter((e,o)=>o!==t),this.activeIndex===t?this.activeIndex=t:this.slotContents.length>0&&this.activeIndex>t&&this.activeIndex--,this._sendChangeEvent()}render(){const t=this.slotContents.map((e,o)=>{const s=_.localize(e.label,this.contentLanguage);return p.x`<li class=${o===this.activeIndex?"active":""}>
           <div class="draggable-slot-content">
             <div
               class="draggable-slot-content-label"
@@ -29,7 +29,7 @@
               class="draggable-slot-content-remove"
               @click=${this.removeSlotContent.bind(this,o)}
             >
-              ${C.p3(C.C1)}
+              ${C.y3(C.C1)}
             </div>
           </div>
         </li>`});return p.x`<div>${t}</div>`}}f([p.n({type:String,reflect:!0})],h.prototype,"language");f([p.n({type:String,attribute:"content-language",reflect:!0})],h.prototype,"contentLanguage");f([P.r(".draggable-slot-content")],h.prototype,"_draggableSlotContentElements");f([p.n()],h.prototype,"slotContents");f([p.n({type:Number})],h.prototype,"activeIndex");customElements.get("luzmo-slot-menu-list")||customElements.define("luzmo-slot-menu-list",h);exports.LuzmoSlotMenuList=h;

package/components/slot-menu-list/index.js

@@ -17,13 +17,13 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  * */
-import { r as P, x as E, n as x } from "../property-Dn4zSyxu.js";
+import { r as P, x as E, n as x } from "../property-BFMfZY1k.js";
 import { _ as S, d as F, a as j, s as D, g as w } from "../get-css-variable-YlLiVgo8.js";
-import { a3 as $, a6 as L } from "../luzmo-icons-v9hKZ3HV.js";
+import { a7 as $, ab as L } from "../luzmo-icons-DnAqAQCX.js";
 import { l as M } from "../localize-BX7q0S0M.js";
 import { r as A } from "../query-all-Ddzx2fEK.js";
-import { L as R } from "../focusable-BXhQz3_k.js";
-import { S as T, E as q } from "../sized-mixin-BR_Ii7le.js";
+import { L as R } from "../focusable-Bhf_beoW.js";
+import { S as T, E as q } from "../sized-mixin-CkdMApAU.js";
 const _ = () => {
   if (typeof document < "u" && !document.querySelector("style[data-luzmo-vars]")) {
     const r = document.createElement("style");

package/components/{state-vVJlsarL.js → state-BSTa7W6f.js}

@@ -17,7 +17,7 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  * */
-import { n as r } from "./property-Dn4zSyxu.js";
+import { n as r } from "./property-BFMfZY1k.js";
 /**
  * @license
  * Copyright 2017 Google LLC

package/components/{state-BxZEcclm.cjs → state-CuE7TJCY.cjs}

@@ -17,7 +17,7 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  * */
-"use strict";const r=require("./property-BCb4Kybn.cjs");/**
+"use strict";const r=require("./property-BV1QaY8E.cjs");/**
  * @license
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause

package/components/{task-qPJdeXO1.cjs → task-0B-FC3rj.cjs}

@@ -17,7 +17,7 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  * */
-"use strict";const d=require("./property-BCb4Kybn.cjs");/**
+"use strict";const d=require("./property-BV1QaY8E.cjs");/**
  * @license
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause

package/components/{task-PQaVY8Iw.js → task-CDsB8Kbr.js}

@@ -17,7 +17,7 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  * */
-import { f as d } from "./property-Dn4zSyxu.js";
+import { f as d } from "./property-BFMfZY1k.js";
 /**
  * @license
  * Copyright 2017 Google LLC