@luzmo/analytics-components-kit 1.0.1-alpha.91 → 1.0.1-alpha.96

package/components/edit-option-picker/index.cjs

@@ -1,29 +1,10 @@
-/*! * A kit of modern Luzmo Web Components for analytics in your web application.
- * 
- * Copyright © 2025 Luzmo
- * All rights reserved.
- * Luzmo web components (“Luzmo Web Components”)
- * must be used according to the Luzmo Terms of Service.
- * This license allows users with a current active Luzmo account
- * to use the Luzmo Web Components. This license terminates
- * automatically if a user no longer has an active Luzmo account.
- * Please view the Luzmo Terms of Service at: https://www.luzmo.com/information-pages/terms-of-use.
- * 
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
- * SOFTWARE.
- * */
-"use strict";var c=Object.getPrototypeOf;var d=Reflect.get;var h=(i,e,r)=>d(c(i),r,e);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require("@luzmo/lucero/menu");require("@luzmo/lucero/picker");const p=require("lit"),s=require("lit/decorators.js"),m=require("../edit-option-base-tFr8Qg2B.cjs");var y=Object.defineProperty,l=(i,e,r,f)=>{for(var a=void 0,u=i.length-1,n;u>=0;u--)(n=i[u])&&(a=n(e,r,a)||a);return a&&y(e,r,a),a};const o=class o extends m.LuzmoEditOptionBase{constructor(){super(...arguments),this.values={},this.disabled=!1,this.placement="bottom-end"}_handleEvent(e){this.dispatchEvent(new CustomEvent("option-changed",{bubbles:!0,composed:!0,cancelable:!0,detail:{value:typeof this.toValue=="function"?this.toValue(e.detail):e.detail}}))}generateMenuItems(){return p.html`
-      ${Object.entries(this.values).map(([e,r])=>p.html`
+"use strict";var c=Object.getPrototypeOf;var d=Reflect.get;var h=(i,e,r)=>d(c(i),r,e);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require("@luzmo/lucero/menu");require("@luzmo/lucero/picker");const u=require("lit"),s=require("lit/decorators.js"),m=require("../edit-option-base-VhTih9T1.cjs");var y=Object.defineProperty,l=(i,e,r,f)=>{for(var o=void 0,p=i.length-1,n;p>=0;p--)(n=i[p])&&(o=n(e,r,o)||o);return o&&y(e,r,o),o};const a=class a extends m.LuzmoEditOptionBase{constructor(){super(...arguments),this.values={},this.disabled=!1,this.placement="bottom-end"}_handleEvent(e){this.dispatchEvent(new CustomEvent("option-changed",{bubbles:!0,composed:!0,cancelable:!0,detail:{value:typeof this.toValue=="function"?this.toValue(e.detail):e.detail}}))}generateMenuItems(){return u.html`
+      ${Object.entries(this.values).map(([e,r])=>u.html`
           <luzmo-menu-item value=${e}> ${r} </luzmo-menu-item>
         `)}
-    `}renderController(){const e=typeof this.parseValue=="function"?this.parseValue(this.value):this.value,r=typeof this.parseValue=="function"?this.parseValue(this.default):this.default;return p.html`
+    `}renderController(){const e=typeof this.parseValue=="function"?this.parseValue(this.value):this.value,r=typeof this.parseValue=="function"?this.parseValue(this.default):this.default;return u.html`
       <luzmo-picker
-        .value=${e?.length?e:r??""}
+        .value=${e!=null&&e.length?e:r??""}
         .size=${this.size}
         variant="highlight"
         .placement=${this.placement}
@@ -32,4 +13,4 @@
       >
         ${this.generateMenuItems()}
       </luzmo-picker>
-    `}};o.styles=[h(o,o,"styles")];let t=o;l([s.property({type:Object})],t.prototype,"values");l([s.property({type:Boolean,reflect:!0})],t.prototype,"disabled");l([s.property()],t.prototype,"placement");l([s.property({type:String,reflect:!0})],t.prototype,"value");l([s.property()],t.prototype,"parseValue");l([s.property()],t.prototype,"toValue");l([s.property({type:String})],t.prototype,"default");customElements.get("luzmo-edit-option-picker")||customElements.define("luzmo-edit-option-picker",t);exports.LuzmoEditOptionPicker=t;
+    `}};a.styles=[h(a,a,"styles")];let t=a;l([s.property({type:Object})],t.prototype,"values");l([s.property({type:Boolean,reflect:!0})],t.prototype,"disabled");l([s.property()],t.prototype,"placement");l([s.property({type:String,reflect:!0})],t.prototype,"value");l([s.property()],t.prototype,"parseValue");l([s.property()],t.prototype,"toValue");l([s.property({type:String})],t.prototype,"default");customElements.get("luzmo-edit-option-picker")||customElements.define("luzmo-edit-option-picker",t);exports.LuzmoEditOptionPicker=t;

package/components/edit-option-picker/index.js

@@ -24,7 +24,7 @@ import "@luzmo/lucero/menu";
 import "@luzmo/lucero/picker";
 import { html as n } from "lit";
 import { property as r } from "lit/decorators.js";
-import { L as p } from "../edit-option-base-Bh29-Cak.js";
+import { L as p } from "../edit-option-base-DIc7iC-b.js";
 (function() {
   if (typeof document < "u" && !document.querySelector("style[data-luzmo-vars]")) {
     const o = document.createElement("style");
@@ -32,11 +32,11 @@ import { L as p } from "../edit-option-base-Bh29-Cak.js";
   }
 })();
 var f = Object.defineProperty, t = (m, o, l, b) => {
-  for (var u = void 0, i = m.length - 1, c; i >= 0; i--)
-    (c = m[i]) && (u = c(o, l, u) || u);
+  for (var u = void 0, a = m.length - 1, c; a >= 0; a--)
+    (c = m[a]) && (u = c(o, l, u) || u);
   return u && f(o, l, u), u;
 };
-const a = class a extends p {
+const i = class i extends p {
   constructor() {
     super(...arguments), this.values = {}, this.disabled = !1, this.placement = "bottom-end";
   }
@@ -65,7 +65,7 @@ const a = class a extends p {
     const o = typeof this.parseValue == "function" ? this.parseValue(this.value) : this.value, l = typeof this.parseValue == "function" ? this.parseValue(this.default) : this.default;
     return n`
       <luzmo-picker
-        .value=${o?.length ? o : l ?? ""}
+        .value=${o != null && o.length ? o : l ?? ""}
         .size=${this.size}
         variant="highlight"
         .placement=${this.placement}
@@ -77,8 +77,8 @@ const a = class a extends p {
     `;
   }
 };
-a.styles = [s(a, a, "styles")];
-let e = a;
+i.styles = [s(i, i, "styles")];
+let e = i;
 t([
   r({ type: Object })
 ], e.prototype, "values");

package/components/edit-option-position-picker/index.js

@@ -17,26 +17,26 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  * */
-var g = Object.getPrototypeOf;
-var z = Reflect.get;
-var u = (r, o, i) => z(g(r), i, o);
+var z = Object.getPrototypeOf;
+var h = Reflect.get;
+var a = (r, o, i) => h(z(r), i, o);
 import "@luzmo/lucero/text-field";
-import { unsafeCSS as h, html as a } from "lit";
+import { unsafeCSS as b, html as c } from "lit";
 import { property as d } from "lit/decorators.js";
-import { L as b } from "../edit-option-base-Bh29-Cak.js";
+import { L as f } from "../edit-option-base-DIc7iC-b.js";
 (function() {
   if (typeof document < "u" && !document.querySelector("style[data-luzmo-vars]")) {
     const o = document.createElement("style");
     o.setAttribute("data-luzmo-vars", ""), o.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-background-color-alt-1: rgb(250, 250, 250);--luzmo-background-color-alt-2: rgb(239, 239, 239);--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-secondary-outline: rgba(255, 0, 255, 0.2);--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(o);
   }
 })();
-const f = ":host{height:var(--luzmo-edit-option-position-picker-grid-height, var(--edit-option-position-picker-grid-height));display:flex;align-items:center}.luzmo-edit-option{height:var(--luzmo-edit-option-position-picker-grid-height, var(--edit-option-position-picker-grid-height))}.position-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--luzmo-edit-option-position-picker-grid-gap, var(--edit-option-position-picker-grid-gap));width:var(--luzmo-edit-option-position-picker-grid-width, var(--edit-option-position-picker-grid-width));box-sizing:border-box;border:.0625rem solid var(--luzmo-edit-option-position-picker-grid-border-color, var(--luzmo-border-color));padding:var(--luzmo-edit-option-position-picker-grid-padding, var(--edit-option-position-picker-grid-padding));border-radius:var(--luzmo-edit-option-position-picker-grid-border-radius, var(--edit-option-position-picker-grid-border-radius))}.position-item{width:100%;height:var(--luzmo-edit-option-position-picker-item-height, var(--edit-option-position-picker-item-height));box-sizing:border-box;border:.0625rem solid var(--luzmo-edit-option-position-picker-border-color, var(--luzmo-border-color));border-radius:var(--luzmo-edit-option-position-picker-border-radius, var(--edit-option-position-picker-border-radius));background:var(--luzmo-edit-option-position-picker-background, var(--luzmo-background-color-highlight));transition:background-color var(--luzmo-edit-option-position-picker-animation-duration, var(--luzmo-animation-duration)) ease-in-out;cursor:pointer}.position-item:hover{background-color:var(--luzmo-edit-option-position-picker-background-hover, var(--luzmo-background-color-highlight-down))}.position-item.selected,.position-item.selected:hover,.position-item.selected:active,.position-item.selected:focus{background-color:var(--luzmo-edit-option-position-picker-background-selected, var(--luzmo-primary));transition:background-color var(--luzmo-edit-option-position-picker-selected-animation-duration, 0) ease-in-out}.position-item.position-item-not-allowed{opacity:0}:host{--edit-option-position-picker-grid-height: 7rem;--edit-option-position-picker-grid-width: 7rem;--edit-option-position-picker-border-radius: var(--luzmo-border-radius);--edit-option-position-picker-grid-border-radius: var(--luzmo-border-radius);--edit-option-position-picker-grid-padding: .25rem;--edit-option-position-picker-item-height: 1.75rem;--edit-option-position-picker-grid-gap: .25rem}:host([size=s]){--edit-option-position-picker-grid-height: 5.125rem;--edit-option-position-picker-grid-width: 5.625rem;--edit-option-position-picker-border-radius: var(--luzmo-border-radius);--edit-option-position-picker-grid-border-radius: var( --luzmo-border-radius-s );--edit-option-position-picker-grid-padding: .125rem;--edit-option-position-picker-item-height: 1.5rem;--edit-option-position-picker-grid-gap: .125rem}:host([size=l]){--edit-option-position-picker-grid-height: 8rem;--edit-option-position-picker-grid-width: 8rem;--edit-option-position-picker-border-radius: var(--luzmo-border-radius-l);--edit-option-position-picker-grid-border-radius: var( --luzmo-border-radius-l );--edit-option-position-picker-grid-padding: .3rem;--edit-option-position-picker-item-height: 2rem;--edit-option-position-picker-grid-gap: .25rem}:host([size=xl]){--edit-option-position-picker-grid-height: 9rem;--edit-option-position-picker-grid-width: 9rem;--edit-option-position-picker-border-radius: var(--luzmo-border-radius-xl);--edit-option-position-picker-grid-border-radius: var( --luzmo-border-radius-xl );--edit-option-position-picker-grid-padding: .375rem;--edit-option-position-picker-item-height: 2.25rem;--edit-option-position-picker-grid-gap: .275rem}";
-var v = Object.defineProperty, n = (r, o, i, k) => {
-  for (var t = void 0, p = r.length - 1, s; p >= 0; p--)
-    (s = r[p]) && (t = s(o, i, t) || t);
-  return t && v(o, i, t), t;
+const v = ":host{height:var(--luzmo-edit-option-position-picker-grid-height, var(--edit-option-position-picker-grid-height));display:flex;align-items:center}.luzmo-edit-option{height:var(--luzmo-edit-option-position-picker-grid-height, var(--edit-option-position-picker-grid-height))}.position-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--luzmo-edit-option-position-picker-grid-gap, var(--edit-option-position-picker-grid-gap));width:var(--luzmo-edit-option-position-picker-grid-width, var(--edit-option-position-picker-grid-width));box-sizing:border-box;border:.0625rem solid var(--luzmo-edit-option-position-picker-grid-border-color, var(--luzmo-border-color));padding:var(--luzmo-edit-option-position-picker-grid-padding, var(--edit-option-position-picker-grid-padding));border-radius:var(--luzmo-edit-option-position-picker-grid-border-radius, var(--edit-option-position-picker-grid-border-radius))}.position-item{width:100%;height:var(--luzmo-edit-option-position-picker-item-height, var(--edit-option-position-picker-item-height));box-sizing:border-box;border:.0625rem solid var(--luzmo-edit-option-position-picker-border-color, var(--luzmo-border-color));border-radius:var(--luzmo-edit-option-position-picker-border-radius, var(--edit-option-position-picker-border-radius));background:var(--luzmo-edit-option-position-picker-background, var(--luzmo-background-color-highlight));transition:background-color var(--luzmo-edit-option-position-picker-animation-duration, var(--luzmo-animation-duration)) ease-in-out;cursor:pointer}.position-item:hover{background-color:var(--luzmo-edit-option-position-picker-background-hover, var(--luzmo-background-color-highlight-down))}.position-item.selected,.position-item.selected:hover,.position-item.selected:active,.position-item.selected:focus{background-color:var(--luzmo-edit-option-position-picker-background-selected, var(--luzmo-primary));transition:background-color var(--luzmo-edit-option-position-picker-selected-animation-duration, 0) ease-in-out}.position-item.position-item-not-allowed{opacity:0}:host{--edit-option-position-picker-grid-height: 7rem;--edit-option-position-picker-grid-width: 7rem;--edit-option-position-picker-border-radius: var(--luzmo-border-radius);--edit-option-position-picker-grid-border-radius: var(--luzmo-border-radius);--edit-option-position-picker-grid-padding: .25rem;--edit-option-position-picker-item-height: 1.75rem;--edit-option-position-picker-grid-gap: .25rem}:host([size=s]){--edit-option-position-picker-grid-height: 5.125rem;--edit-option-position-picker-grid-width: 5.625rem;--edit-option-position-picker-border-radius: var(--luzmo-border-radius);--edit-option-position-picker-grid-border-radius: var( --luzmo-border-radius-s );--edit-option-position-picker-grid-padding: .125rem;--edit-option-position-picker-item-height: 1.5rem;--edit-option-position-picker-grid-gap: .125rem}:host([size=l]){--edit-option-position-picker-grid-height: 8rem;--edit-option-position-picker-grid-width: 8rem;--edit-option-position-picker-border-radius: var(--luzmo-border-radius-l);--edit-option-position-picker-grid-border-radius: var( --luzmo-border-radius-l );--edit-option-position-picker-grid-padding: .3rem;--edit-option-position-picker-item-height: 2rem;--edit-option-position-picker-grid-gap: .25rem}:host([size=xl]){--edit-option-position-picker-grid-height: 9rem;--edit-option-position-picker-grid-width: 9rem;--edit-option-position-picker-border-radius: var(--luzmo-border-radius-xl);--edit-option-position-picker-grid-border-radius: var( --luzmo-border-radius-xl );--edit-option-position-picker-grid-padding: .375rem;--edit-option-position-picker-item-height: 2.25rem;--edit-option-position-picker-grid-gap: .275rem}";
+var k = Object.defineProperty, n = (r, o, i, p) => {
+  for (var t = void 0, s = r.length - 1, u; s >= 0; s--)
+    (u = r[s]) && (t = u(o, i, t) || t);
+  return t && k(o, i, t), t;
 };
-const m = [
+const g = [
   "topLeft",
   "top",
   "topRight",
@@ -46,9 +46,9 @@ const m = [
   "bottomLeft",
   "bottom",
   "bottomRight"
-], c = m.filter((r) => r !== "center"), l = class l extends b {
+], m = g.filter((r) => r !== "center"), l = class l extends f {
   constructor() {
-    super(...arguments), this.default = "topRight", this.positions = c, this.readonly = !1;
+    super(...arguments), this.default = "topRight", this.positions = m, this.readonly = !1;
   }
   _handleEvent() {
     this.dispatchEvent(
@@ -63,25 +63,29 @@ const m = [
     );
   }
   _handleClick(o) {
-    this.positions?.includes(o) && (this.value = o, this._handleEvent());
+    var i;
+    (i = this.positions) != null && i.includes(o) && (this.value = o, this._handleEvent());
   }
   willUpdate() {
-    this.value = this.value ?? this.default ?? "topRight", this.positions = this.positions ?? c;
+    this.value = this.value ?? this.default ?? "topRight", this.positions = this.positions ?? m;
   }
   // TODO add keyboard navigation & focusable & aria-labels
   renderController() {
-    const o = m.map(
-      (i) => a`
+    const o = g.map(
+      (i) => {
+        var p;
+        return c`
         <div
-          class="position-item ${this.positions?.includes(i) ? "position-item-allowed" : "position-item-not-allowed"} ${this.value === i ? "selected" : ""}"
+          class="position-item ${(p = this.positions) != null && p.includes(i) ? "position-item-allowed" : "position-item-not-allowed"} ${this.value === i ? "selected" : ""}"
           @click=${this._handleClick.bind(this, i)}
         ></div>
-      `
+      `;
+      }
     );
-    return a` <div class="position-grid">${o}</div> `;
+    return c` <div class="position-grid">${o}</div> `;
   }
 };
-l.styles = [u(l, l, "styles"), h(f)];
+l.styles = [a(l, l, "styles"), b(v)];
 let e = l;
 n([
   d({ type: String, reflect: !0 })

package/components/edit-option-positions-number-field/index.js

@@ -17,24 +17,24 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  * */
-import { luzmoIcon as p, luzmoLockOutline as h } from "@luzmo/icons";
+import { luzmoIcon as w, luzmoLockOutline as k } from "@luzmo/icons";
 import "@luzmo/lucero/number-field";
-import { unsafeCSS as f, html as u } from "lit";
-import { property as s, state as b } from "lit/decorators.js";
-import { L as z } from "../edit-option-base-Bh29-Cak.js";
+import { unsafeCSS as S, html as d } from "lit";
+import { property as m, state as C } from "lit/decorators.js";
+import { L as $ } from "../edit-option-base-DIc7iC-b.js";
 (function() {
   if (typeof document < "u" && !document.querySelector("style[data-luzmo-vars]")) {
     const o = document.createElement("style");
     o.setAttribute("data-luzmo-vars", ""), o.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-background-color-alt-1: rgb(250, 250, 250);--luzmo-background-color-alt-2: rgb(239, 239, 239);--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-secondary-outline: rgba(255, 0, 255, 0.2);--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(o);
   }
 })();
-const g = ":host{--edit-option-positions-number-field-container-row-gap: var( --luzmo-spacing-2 );--edit-option-positions-number-field-container-column-gap: var( --luzmo-spacing-2 );--edit-option-positions-number-field-sync-height: calc( var(--luzmo-component-height) * 1.5 )}:host([size=s]){--edit-option-positions-number-field-sync-height: calc( var(--luzmo-component-height-s) * 1.5 )}:host([size=l]){--edit-option-positions-number-field-sync-height: calc( var(--luzmo-component-height-l) * 1.5 )}:host([size=xl]){--edit-option-positions-number-field-sync-height: calc( var(--luzmo-component-height-xl) * 1.5 )}:host{--var: test}.positions-container{max-width:var(--luzmo-edit-option-positions-number-field-container-max-width, var(--edit-option-positions-number-field-container-max-width));display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);row-gap:var(--luzmo-edit-option-positions-number-field-container-row-gap, var(--edit-option-positions-number-field-container-row-gap));column-gap:var(--luzmo-edit-option-positions-number-field-container-column-gap, var(--edit-option-positions-number-field-container-column-gap))}.position,.sync-button{display:flex;align-items:center;justify-content:center}.sync-button{cursor:pointer}.sync-button[position=center].sync{border:var(--luzmo-edit-option-positions-number-field-sync-border-width, var(--luzmo-border-width)) solid var(--luzmo-edit-option-positions-number-field-sync-border-color, var(--luzmo-primary));border-radius:var(--luzmo-edit-option-positions-number-field-sync-border-radius, var(--luzmo-border-radius));height:var(--luzmo-edit-option-positions-number-field-sync-height, var(--edit-option-positions-number-field-sync-height))}.no-sync-center{border:var(--luzmo-edit-option-positions-number-field-no-sync-center-border-width, var(--luzmo-border-width)) solid var(--luzmo-edit-option-positions-number-field-no-sync-center-border-color, var(--luzmo-border-color));border-radius:var(--luzmo-edit-option-positions-number-field-no-sync-center-border-radius, var(--luzmo-border-radius));height:var(--luzmo-edit-option-positions-number-field-sync-height, var(--edit-option-positions-number-field-sync-height));background-color:var(--luzmo-edit-option-positions-number-field-no-sync-center-background-color, var(--luzmo-background-color-highlight))}";
-var y = Object.defineProperty, n = (c, o, i, e) => {
-  for (var t = void 0, l = c.length - 1, a; l >= 0; l--)
-    (a = c[l]) && (t = a(o, i, t) || t);
-  return t && y(o, i, t), t;
+const V = ":host{--edit-option-positions-number-field-container-row-gap: var( --luzmo-spacing-2 );--edit-option-positions-number-field-container-column-gap: var( --luzmo-spacing-2 );--edit-option-positions-number-field-sync-height: calc( var(--luzmo-component-height) * 1.5 )}:host([size=s]){--edit-option-positions-number-field-sync-height: calc( var(--luzmo-component-height-s) * 1.5 )}:host([size=l]){--edit-option-positions-number-field-sync-height: calc( var(--luzmo-component-height-l) * 1.5 )}:host([size=xl]){--edit-option-positions-number-field-sync-height: calc( var(--luzmo-component-height-xl) * 1.5 )}:host{--var: test}.positions-container{max-width:var(--luzmo-edit-option-positions-number-field-container-max-width, var(--edit-option-positions-number-field-container-max-width));display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);row-gap:var(--luzmo-edit-option-positions-number-field-container-row-gap, var(--edit-option-positions-number-field-container-row-gap));column-gap:var(--luzmo-edit-option-positions-number-field-container-column-gap, var(--edit-option-positions-number-field-container-column-gap))}.position,.sync-button{display:flex;align-items:center;justify-content:center}.sync-button{cursor:pointer}.sync-button[position=center].sync{border:var(--luzmo-edit-option-positions-number-field-sync-border-width, var(--luzmo-border-width)) solid var(--luzmo-edit-option-positions-number-field-sync-border-color, var(--luzmo-primary));border-radius:var(--luzmo-edit-option-positions-number-field-sync-border-radius, var(--luzmo-border-radius));height:var(--luzmo-edit-option-positions-number-field-sync-height, var(--edit-option-positions-number-field-sync-height))}.no-sync-center{border:var(--luzmo-edit-option-positions-number-field-no-sync-center-border-width, var(--luzmo-border-width)) solid var(--luzmo-edit-option-positions-number-field-no-sync-center-border-color, var(--luzmo-border-color));border-radius:var(--luzmo-edit-option-positions-number-field-no-sync-center-border-radius, var(--luzmo-border-radius));height:var(--luzmo-edit-option-positions-number-field-sync-height, var(--edit-option-positions-number-field-sync-height));background-color:var(--luzmo-edit-option-positions-number-field-no-sync-center-background-color, var(--luzmo-background-color-highlight))}";
+var _ = Object.defineProperty, u = (b, o, t, r) => {
+  for (var e = void 0, i = b.length - 1, n; i >= 0; i--)
+    (n = b[i]) && (e = n(o, t, e) || e);
+  return e && _(o, t, e), e;
 };
-class r extends z {
+class s extends $ {
   constructor() {
     super(...arguments), this.canSync = !0, this.invalid = !1, this.readonly = !1, this.debounce = 200, this._positions = [
       ["top-left", "top", "top-right"],
@@ -43,13 +43,15 @@ class r extends z {
     ];
   }
   static get styles() {
-    return [f(g)];
+    return [S(V)];
   }
   _calculateSyncedValue() {
+    var r;
     let o;
-    const i = {};
-    return this.positions?.forEach((e) => {
-      i[e] = this.values?.[e] ?? this.positionConfiguration?.[e]?.default ?? 0, o = typeof o == "number" && i[e] ? Math.min(o, i[e]) : i[e];
+    const t = {};
+    return (r = this.positions) == null || r.forEach((e) => {
+      var i, n, l;
+      t[e] = ((i = this.values) == null ? void 0 : i[e]) ?? ((l = (n = this.positionConfiguration) == null ? void 0 : n[e]) == null ? void 0 : l.default) ?? 0, o = typeof o == "number" && t[e] ? Math.min(o, t[e]) : t[e];
     }), o;
   }
   toggleSync() {
@@ -60,64 +62,67 @@ class r extends z {
     }
   }
   _handleEvent(o) {
-    const i = o.target.getAttribute("position"), e = o.target.value;
-    let t = {};
-    if (!(!i || typeof e != "number")) {
-      if (this.canSync && this.sync && i === "center") {
-        this.syncedValue = e;
-        for (const l of this.positions ?? [])
-          t[l] = e;
+    const t = o.target.getAttribute("position"), r = o.target.value;
+    let e = {};
+    if (!(!t || typeof r != "number")) {
+      if (this.canSync && this.sync && t === "center") {
+        this.syncedValue = r;
+        for (const i of this.positions ?? [])
+          e[i] = r;
       } else
-        t = {
+        e = {
           ...this.values,
-          [i]: e
+          [t]: r
         };
       this.debounceTimeout && clearTimeout(this.debounceTimeout), this.debounceTimeout = setTimeout(() => {
-        const l = Object.keys(this.values ?? {}), a = Object.keys(t);
-        let m = !0;
-        l.length !== a.length && (m = !1);
-        for (const d of l)
-          this.values?.[d] !== t[d] && (m = !1);
-        m || (this.dispatchEvent(
+        var c;
+        const i = Object.keys(this.values ?? {}), n = Object.keys(e);
+        let l = !0;
+        i.length !== n.length && (l = !1);
+        for (const a of i)
+          ((c = this.values) == null ? void 0 : c[a]) !== e[a] && (l = !1);
+        l || (this.dispatchEvent(
           new CustomEvent("option-changed", {
             bubbles: !0,
             composed: !0,
             cancelable: !0,
             detail: {
-              values: { ...t }
+              values: { ...e }
             }
           })
-        ), this.values = t);
+        ), this.values = e);
       }, this.debounce ?? 200);
     }
   }
   _renderNumberField(o) {
-    return this.positions?.includes(o) || o === "center" ? this.canSync && (this.sync && o !== "center" || !this.sync && o === "center") ? u`<div
+    var t, r, e, i, n, l, c, a, p, h, f;
+    return (t = this.positions) != null && t.includes(o) || o === "center" ? this.canSync && (this.sync && o !== "center" || !this.sync && o === "center") ? d`<div
           class="sync-button ${this.sync ? "" : "sync"}"
           position=${o}
           @click=${this.toggleSync}
         >
-          ${p(h)}
-        </div>` : !this.canSync && !this.positions?.includes("center") && o === "center" ? u`<div class="no-sync-center"></div>` : u`<div class="position">
+          ${w(k)}
+        </div>` : !this.canSync && !((r = this.positions) != null && r.includes("center")) && o === "center" ? d`<div class="no-sync-center"></div>` : d`<div class="position">
         <luzmo-number-field
           position=${o}
-          .value=${this.sync && this.canSync ? this.syncedValue ?? 0 : this.values?.[o] ?? this.positionConfiguration?.[o]?.default ?? 0}
+          .value=${this.sync && this.canSync ? this.syncedValue ?? 0 : ((e = this.values) == null ? void 0 : e[o]) ?? ((n = (i = this.positionConfiguration) == null ? void 0 : i[o]) == null ? void 0 : n.default) ?? 0}
           .disabled=${this.disabled}
           .size=${this.size}
-          .min=${this.positionConfiguration?.[o]?.min ?? 0}
-          .max=${this.positionConfiguration?.[o]?.max ?? 100}
-          .step=${this.positionConfiguration?.[o]?.step ?? 1}
+          .min=${((c = (l = this.positionConfiguration) == null ? void 0 : l[o]) == null ? void 0 : c.min) ?? 0}
+          .max=${((p = (a = this.positionConfiguration) == null ? void 0 : a[o]) == null ? void 0 : p.max) ?? 100}
+          .step=${((f = (h = this.positionConfiguration) == null ? void 0 : h[o]) == null ? void 0 : f.step) ?? 1}
           .invalid=${this.invalid}
           @change=${this._handleEvent}
           @input=${this._handleEvent}
         >
         </luzmo-number-field>
-      </div>` : u`<div class="position"></div>`;
+      </div>` : d`<div class="position"></div>`;
   }
   firstUpdated() {
-    if (this.canSync && !this.positions?.includes("center")) {
-      const o = this.values?.left ?? this.positionConfiguration?.left?.default, i = this.values?.top ?? this.positionConfiguration?.top?.default, e = this.values?.right ?? this.positionConfiguration?.right?.default, t = this.values?.bottom ?? this.positionConfiguration?.bottom?.default;
-      this.sync = o === i && i === e && e === t;
+    var o, t, r, e, i, n, l, c, a, p, h, f, z;
+    if (this.canSync && !((o = this.positions) != null && o.includes("center"))) {
+      const v = ((t = this.values) == null ? void 0 : t.left) ?? ((e = (r = this.positionConfiguration) == null ? void 0 : r.left) == null ? void 0 : e.default), g = ((i = this.values) == null ? void 0 : i.top) ?? ((l = (n = this.positionConfiguration) == null ? void 0 : n.top) == null ? void 0 : l.default), y = ((c = this.values) == null ? void 0 : c.right) ?? ((p = (a = this.positionConfiguration) == null ? void 0 : a.right) == null ? void 0 : p.default), x = ((h = this.values) == null ? void 0 : h.bottom) ?? ((z = (f = this.positionConfiguration) == null ? void 0 : f.bottom) == null ? void 0 : z.default);
+      this.sync = v === g && g === y && y === x;
     } else
       this.sync = !1;
   }
@@ -126,48 +131,48 @@ class r extends z {
   }
   renderController() {
     this._calculateSyncedValue();
-    const o = this._positions.map((i) => {
-      const e = i.map(
-        (t) => this._renderNumberField(t)
+    const o = this._positions.map((t) => {
+      const r = t.map(
+        (e) => this._renderNumberField(e)
       );
-      return u`${e}`;
+      return d`${r}`;
     });
-    return u`<div class="positions-container-wrapper">
+    return d`<div class="positions-container-wrapper">
       <div class="positions-container">${o}</div>
     </div>`;
   }
 }
-n([
-  s({ type: Array, reflect: !0 })
-], r.prototype, "positions");
-n([
-  s({ type: Object, reflect: !0 })
-], r.prototype, "values");
-n([
-  s({ type: Boolean, reflect: !0, attribute: "can-sync" })
-], r.prototype, "canSync");
-n([
-  s({ type: Object })
-], r.prototype, "positionConfiguration");
-n([
-  s({ type: Boolean, reflect: !0 })
-], r.prototype, "invalid");
-n([
-  s({ type: Boolean, reflect: !0 })
-], r.prototype, "readonly");
-n([
-  s({ type: Number, reflect: !0 })
-], r.prototype, "debounce");
-n([
-  s({ type: Boolean, reflect: !0 })
-], r.prototype, "sync");
-n([
-  b()
-], r.prototype, "syncedValue");
+u([
+  m({ type: Array, reflect: !0 })
+], s.prototype, "positions");
+u([
+  m({ type: Object, reflect: !0 })
+], s.prototype, "values");
+u([
+  m({ type: Boolean, reflect: !0, attribute: "can-sync" })
+], s.prototype, "canSync");
+u([
+  m({ type: Object })
+], s.prototype, "positionConfiguration");
+u([
+  m({ type: Boolean, reflect: !0 })
+], s.prototype, "invalid");
+u([
+  m({ type: Boolean, reflect: !0 })
+], s.prototype, "readonly");
+u([
+  m({ type: Number, reflect: !0 })
+], s.prototype, "debounce");
+u([
+  m({ type: Boolean, reflect: !0 })
+], s.prototype, "sync");
+u([
+  C()
+], s.prototype, "syncedValue");
 customElements.get("luzmo-edit-option-positions-number-field") || customElements.define(
   "luzmo-edit-option-positions-number-field",
-  r
+  s
 );
 export {
-  r as LuzmoEditOptionPositionsNumberField
+  s as LuzmoEditOptionPositionsNumberField
 };

package/components/edit-option-radio-button-group/index.cjs

@@ -1,36 +1,17 @@
-/*! * A kit of modern Luzmo Web Components for analytics in your web application.
- * 
- * Copyright © 2025 Luzmo
- * All rights reserved.
- * Luzmo web components (“Luzmo Web Components”)
- * must be used according to the Luzmo Terms of Service.
- * This license allows users with a current active Luzmo account
- * to use the Luzmo Web Components. This license terminates
- * automatically if a user no longer has an active Luzmo account.
- * Please view the Luzmo Terms of Service at: https://www.luzmo.com/information-pages/terms-of-use.
- * 
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
- * SOFTWARE.
- * */
-"use strict";var h=Object.getPrototypeOf;var y=Reflect.get;var d=(l,t,s)=>y(h(l),s,t);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require("@luzmo/lucero/action-button");require("@luzmo/lucero/action-group");const n=require("lit"),o=require("lit/decorators.js"),v=require("../edit-option-base-tFr8Qg2B.cjs");var f=Object.defineProperty,r=(l,t,s,p)=>{for(var a=void 0,u=l.length-1,c;u>=0;u--)(c=l[u])&&(a=c(t,s,a)||a);return a&&f(t,s,a),a};const i=class i extends v.LuzmoEditOptionBase{constructor(){super(...arguments),this.values={},this.disabled=!1}generateRadioButtons(){const t=Object.entries(this.values).map(([s,p])=>n.html`
-        <luzmo-action-button value=${s} ?disabled=${this.disabled}>
-          ${p}
+"use strict";var h=Object.getPrototypeOf;var y=Reflect.get;var d=(u,e,t)=>y(h(u),t,e);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require("@luzmo/lucero/action-button");require("@luzmo/lucero/action-group");const p=require("lit"),r=require("lit/decorators.js"),v=require("../edit-option-base-VhTih9T1.cjs");var f=Object.defineProperty,a=(u,e,t,i)=>{for(var o=void 0,n=u.length-1,c;n>=0;n--)(c=u[n])&&(o=c(e,t,o)||o);return o&&f(e,t,o),o};const l=class l extends v.LuzmoEditOptionBase{constructor(){super(...arguments),this.values={},this.disabled=!1}generateRadioButtons(){const e=Object.entries(this.values).map(([t,i])=>p.html`
+        <luzmo-action-button value=${t} ?disabled=${this.disabled}>
+          ${i}
         </luzmo-action-button>
-      `);return n.html` ${t} `}_handleEvent(){this.dispatchEvent(new CustomEvent("option-changed",{bubbles:!0,composed:!0,cancelable:!0,detail:{value:typeof this.toValue=="function"?this.toValue(this.actionGroup?.selected?.[0]):this.actionGroup?.selected?.[0]}}))}renderController(){const t=typeof this.parseValue=="function"?this.parseValue(this.value):this.value,s=typeof this.parseValue=="function"?this.parseValue(this.default):this.default;return n.html`
+      `);return p.html` ${e} `}_handleEvent(){var e,t,i,o;this.dispatchEvent(new CustomEvent("option-changed",{bubbles:!0,composed:!0,cancelable:!0,detail:{value:typeof this.toValue=="function"?this.toValue((t=(e=this.actionGroup)==null?void 0:e.selected)==null?void 0:t[0]):(o=(i=this.actionGroup)==null?void 0:i.selected)==null?void 0:o[0]}}))}renderController(){const e=typeof this.parseValue=="function"?this.parseValue(this.value):this.value,t=typeof this.parseValue=="function"?this.parseValue(this.default):this.default;return p.html`
       <luzmo-action-group
         compact
         selects="single"
         emphasized
         @change=${this._handleEvent}
         .size=${this.size}
-        .selected=${t&&this.values[t]?[t]:s&&this.values[s]?[s]:[Object.keys(this.values)[0]]}
+        .selected=${e&&this.values[e]?[e]:t&&this.values[t]?[t]:[Object.keys(this.values)[0]]}
         ?disabled=${this.disabled}
       >
         ${this.generateRadioButtons()}
       </luzmo-action-group>
-    `}};i.styles=[d(i,i,"styles")];let e=i;r([o.property({type:Array})],e.prototype,"values");r([o.property({type:Boolean,reflect:!0})],e.prototype,"disabled");r([o.property({type:String})],e.prototype,"value");r([o.property({type:String})],e.prototype,"default");r([o.property()],e.prototype,"parseValue");r([o.property()],e.prototype,"toValue");r([o.query("luzmo-action-group")],e.prototype,"actionGroup");customElements.get("luzmo-edit-option-radio-button-group")||customElements.define("luzmo-edit-option-radio-button-group",e);exports.LuzmoEditOptionRadioButtonGroup=e;
+    `}};l.styles=[d(l,l,"styles")];let s=l;a([r.property({type:Array})],s.prototype,"values");a([r.property({type:Boolean,reflect:!0})],s.prototype,"disabled");a([r.property({type:String})],s.prototype,"value");a([r.property({type:String})],s.prototype,"default");a([r.property()],s.prototype,"parseValue");a([r.property()],s.prototype,"toValue");a([r.query("luzmo-action-group")],s.prototype,"actionGroup");customElements.get("luzmo-edit-option-radio-button-group")||customElements.define("luzmo-edit-option-radio-button-group",s);exports.LuzmoEditOptionRadioButtonGroup=s;

package/components/edit-option-radio-button-group/index.js

@@ -22,49 +22,50 @@ var p = Reflect.get;
 var d = (i, o, e) => p(z(i), e, o);
 import "@luzmo/lucero/action-button";
 import "@luzmo/lucero/action-group";
-import { html as s } from "lit";
+import { html as m } from "lit";
 import { property as u, query as b } from "lit/decorators.js";
-import { L as f } from "../edit-option-base-Bh29-Cak.js";
+import { L as f } from "../edit-option-base-DIc7iC-b.js";
 (function() {
   if (typeof document < "u" && !document.querySelector("style[data-luzmo-vars]")) {
     const o = document.createElement("style");
     o.setAttribute("data-luzmo-vars", ""), o.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-background-color-alt-1: rgb(250, 250, 250);--luzmo-background-color-alt-2: rgb(239, 239, 239);--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-secondary-outline: rgba(255, 0, 255, 0.2);--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(o);
   }
 })();
-var g = Object.defineProperty, r = (i, o, e, m) => {
-  for (var t = void 0, c = i.length - 1, n; c >= 0; c--)
-    (n = i[c]) && (t = n(o, e, t) || t);
-  return t && g(o, e, t), t;
+var g = Object.defineProperty, t = (i, o, e, a) => {
+  for (var r = void 0, s = i.length - 1, n; s >= 0; s--)
+    (n = i[s]) && (r = n(o, e, r) || r);
+  return r && g(o, e, r), r;
 };
-const a = class a extends f {
+const c = class c extends f {
   constructor() {
     super(...arguments), this.values = {}, this.disabled = !1;
   }
   generateRadioButtons() {
     const o = Object.entries(this.values).map(
-      ([e, m]) => s`
+      ([e, a]) => m`
         <luzmo-action-button value=${e} ?disabled=${this.disabled}>
-          ${m}
+          ${a}
         </luzmo-action-button>
       `
     );
-    return s` ${o} `;
+    return m` ${o} `;
   }
   _handleEvent() {
+    var o, e, a, r;
     this.dispatchEvent(
       new CustomEvent("option-changed", {
         bubbles: !0,
         composed: !0,
         cancelable: !0,
         detail: {
-          value: typeof this.toValue == "function" ? this.toValue(this.actionGroup?.selected?.[0]) : this.actionGroup?.selected?.[0]
+          value: typeof this.toValue == "function" ? this.toValue((e = (o = this.actionGroup) == null ? void 0 : o.selected) == null ? void 0 : e[0]) : (r = (a = this.actionGroup) == null ? void 0 : a.selected) == null ? void 0 : r[0]
         }
       })
     );
   }
   renderController() {
     const o = typeof this.parseValue == "function" ? this.parseValue(this.value) : this.value, e = typeof this.parseValue == "function" ? this.parseValue(this.default) : this.default;
-    return s`
+    return m`
       <luzmo-action-group
         compact
         selects="single"
@@ -79,27 +80,27 @@ const a = class a extends f {
     `;
   }
 };
-a.styles = [d(a, a, "styles")];
-let l = a;
-r([
+c.styles = [d(c, c, "styles")];
+let l = c;
+t([
   u({ type: Array })
 ], l.prototype, "values");
-r([
+t([
   u({ type: Boolean, reflect: !0 })
 ], l.prototype, "disabled");
-r([
+t([
   u({ type: String })
 ], l.prototype, "value");
-r([
+t([
   u({ type: String })
 ], l.prototype, "default");
-r([
+t([
   u()
 ], l.prototype, "parseValue");
-r([
+t([
   u()
 ], l.prototype, "toValue");
-r([
+t([
   b("luzmo-action-group")
 ], l.prototype, "actionGroup");
 customElements.get("luzmo-edit-option-radio-button-group") || customElements.define(