@orangelogic/design-system 2.0.0-29DUO2-beta-3 → 2.0.0-29IORR-beta-2

package/library/components/dropdown.js

@@ -1,12 +1,12 @@
 import { n as s, C as w } from "../chunks/lib-cortex-element.CVMmyPMC.js";
-import { c as b } from "../chunks/component.styles.DMSLciL5.js";
+import { c as b } from "../chunks/component.styles.CRO4Odto.js";
 import { s as c, a as u } from "../chunks/animate.El-MpOws.js";
 import { c as x } from "../chunks/custom-element.L4WJXn1j.js";
 import { w as m } from "../chunks/event.mFzZi4sr.js";
-import { L as v } from "../chunks/i18n.C0iakJkV.js";
+import { L as v } from "../chunks/i18n.BFqTRDCA.js";
 import { H as k } from "../chunks/slot.j5oheLJC.js";
 import { g as f } from "../chunks/tabbable.CcMz3mIL.js";
-import { w as E } from "../chunks/watch.q1sEjPWL.js";
+import { w as E } from "../chunks/watch.BCJD77bD.js";
 import { i as C, x as D } from "../chunks/lit-element.jLBm65_O.js";
 import { e as h } from "../chunks/query.BBf1UFkC.js";
 import { e as T } from "../chunks/class-map.BiVq-cVR.js";
@@ -15,80 +15,14 @@ import { s as y, g } from "../chunks/animation-registry.HmpwNuGH.js";
 import _ from "./input.js";
 import d from "./menu.js";
 import L from "./popup.js";
-import S from "./textarea.js";
-const A = C`
-  :host {
-    display: inline-block;
-    --panel-padding: 0px;
-    --panel-overflow: auto;
-  }
-
-  .dropdown::part(popup) {
-    z-index: var(--cx-z-index-dropdown);
-  }
-
-  .dropdown[data-current-placement^='top']::part(popup) {
-    transform-origin: bottom;
-  }
-
-  .dropdown[data-current-placement^='bottom']::part(popup) {
-    transform-origin: top;
-  }
-
-  .dropdown[data-current-placement^='left']::part(popup) {
-    transform-origin: right;
-  }
-
-  .dropdown[data-current-placement^='right']::part(popup) {
-    transform-origin: left;
-  }
-
-  .dropdown__trigger {
-    display: block;
-  }
-
-  .dropdown__panel {
-    display: block;
-    padding: var(--panel-padding);
-    background-color: var(--cx-panel-background-color);
-    border: var(--cx-panel-border-width) solid var(--cx-panel-border-color);
-    font-family: var(--cx-font-sans);
-    font-size: var(--cx-font-size-medium);
-    font-weight: var(--cx-font-weight-regular);
-    box-shadow: var(--cx-shadow-large);
-    border-radius: var(--cx-border-radius-large);
-    pointer-events: none;
-    max-height: min(
-      var(--auto-size-available-height),
-      var(--max-height, var(--auto-size-available-height))
-    );
-    overflow: var(--panel-overflow, auto);
-  }
-
-  .dropdown--open .dropdown__panel {
-    pointer-events: all;
-  }
-
-  /* When users slot a menu, make sure it conforms to the popup's auto-size */
-  ::slotted(cx-menu) {
-    max-width: min(100%, var(--auto-size-available-width)) !important;
-    border: none;
-  }
-
-  /**
-   * Fix for tooltip of a dropdown trigger.
-   * See https://github.com/shoelace-style/shoelace/discussions/1961
-   */
-  .dropdown__trigger::slotted(cx-tooltip) {
-    display: inline-block;
-  }
-`;
-var K = Object.defineProperty, P = Object.getOwnPropertyDescriptor, n = (e, t, o, a) => {
-  for (var r = a > 1 ? void 0 : a ? P(t, o) : t, p = e.length - 1, l; p >= 0; p--)
-    (l = e[p]) && (r = (a ? l(t, o, r) : l(r)) || r);
-  return a && r && K(t, o, r), r;
+import A from "./textarea.js";
+const S = C`:host{--panel-padding:0px;--panel-overflow:auto;display:inline-block}.dropdown::part(popup){z-index:var(--cx-z-index-dropdown)}.dropdown[data-current-placement^=top]::part(popup){transform-origin:bottom}.dropdown[data-current-placement^=bottom]::part(popup){transform-origin:top}.dropdown[data-current-placement^=left]::part(popup){transform-origin:100%}.dropdown[data-current-placement^=right]::part(popup){transform-origin:0}.dropdown__trigger{display:block}.dropdown__panel{padding:var(--panel-padding);background-color:var(--cx-panel-background-color);border:var(--cx-panel-border-width) solid var(--cx-panel-border-color);font-family:var(--cx-font-sans);font-size:var(--cx-font-size-medium);font-weight:var(--cx-font-weight-regular);box-shadow:var(--cx-shadow-large);border-radius:var(--cx-border-radius-large);pointer-events:none;max-height:min(var(--auto-size-available-height), var(--max-height,var(--auto-size-available-height)));overflow:var(--panel-overflow,auto);display:block}.dropdown--open .dropdown__panel{pointer-events:all}::slotted(cx-menu){border:none;max-width:min(100%, var(--auto-size-available-width))!important}.dropdown__trigger::slotted(cx-tooltip){display:inline-block}`;
+var K = Object.defineProperty, P = Object.getOwnPropertyDescriptor, n = (e, t, i, a) => {
+  for (var r = a > 1 ? void 0 : a ? P(t, i) : t, p = e.length - 1, l; p >= 0; p--)
+    (l = e[p]) && (r = (a ? l(t, i, r) : l(r)) || r);
+  return a && r && K(t, i, r), r;
 };
-let i = class extends w {
+let o = class extends w {
   constructor() {
     super(), this.localize = new v(this), this.hasSlotController = new k(this, "[default]"), this.open = !1, this.placement = "bottom-start", this.disabled = !1, this.stayOpenOnSelect = !1, this.distance = 0, this.skidding = 0, this.hoist = !1, this.sync = void 0, this.autoWidthFactor = 1, this.ignoredKeys = [], this.noFlip = !1, this.flipPadding = 10, this.handleKeyDown = this.handleKeyDown.bind(this), this.handleDocumentKeyDown = this.handleDocumentKeyDown.bind(this), this.handleDocumentMouseDown = this.handleDocumentMouseDown.bind(this), this.handlePanelSelect = this.handlePanelSelect.bind(this);
   }
@@ -125,14 +59,14 @@ let i = class extends w {
     })) : (this.show(), this.focusOnTrigger());
   }
   async handleTriggerKeyDown(e) {
-    if (this.ignoredKeys.includes(e.key) || [" ", "Enter"].includes(e.key) && e.key === " " && (e.target instanceof _ || e.target instanceof S || e.target instanceof HTMLInputElement || e.target instanceof HTMLTextAreaElement))
+    if (this.ignoredKeys.includes(e.key) || [" ", "Enter"].includes(e.key) && e.key === " " && (e.target instanceof _ || e.target instanceof A || e.target instanceof HTMLInputElement || e.target instanceof HTMLTextAreaElement))
       return;
     const t = this.getMenu();
     if (t) {
-      const o = t.getAllItems(), a = o[0], r = o.at(-1);
+      const i = t.getAllItems(), a = i[0], r = i.at(-1);
       ["ArrowDown", "ArrowUp", "Home", "End", "Enter", " "].includes(
         e.key
-      ) && (e.preventDefault(), this.open || (this.show(), await this.updateComplete), o.length > 0 && (typeof t.checkVisibility == "function" && !t?.checkVisibility() && await new Promise((p) => {
+      ) && (e.preventDefault(), this.open || (this.show(), await this.updateComplete), i.length > 0 && (typeof t.checkVisibility == "function" && !t?.checkVisibility() && await new Promise((p) => {
         this.popup.addEventListener("cx-opened", p);
       }), this.updateComplete.then(() => {
         (e.key === "ArrowDown" || e.key === "Home" || e.key === "Enter" || e.key === " ") && (t.setCurrentItem(a), a.focus()), r && (e.key === "ArrowUp" || e.key === "End") && (t.setCurrentItem(r), r.focus());
@@ -161,18 +95,18 @@ let i = class extends w {
     }).find(
       (a) => f(a).start
     );
-    let o;
+    let i;
     if (t) {
       switch (t.tagName.toLowerCase()) {
         // Shoelace buttons have to update the internal button so it's announced correctly by screen readers
         case "cx-button":
         case "cx-icon-button":
-          o = t.button;
+          i = t.button;
           break;
         default:
-          o = t;
+          i = t;
       }
-      o.setAttribute("aria-haspopup", "true"), o.setAttribute("aria-expanded", this.open ? "true" : "false");
+      i.setAttribute("aria-haspopup", "true"), i.setAttribute("aria-expanded", this.open ? "true" : "false");
     }
   }
   blurTrigger() {
@@ -181,18 +115,18 @@ let i = class extends w {
     }).find(
       (a) => f(a).start
     );
-    let o;
+    let i;
     if (t) {
       switch (t.tagName.toLowerCase()) {
         // Shoelace buttons have to update the internal button so it's announced correctly by screen readers
         case "cx-button":
         case "cx-icon-button":
-          o = t.button;
+          i = t.button;
           break;
         default:
-          o = t;
+          i = t;
       }
-      o.blur();
+      i.blur();
     }
   }
   /** Shows the dropdown panel. */
@@ -230,103 +164,67 @@ let i = class extends w {
       const { keyframes: e, options: t } = g(this, "dropdown.show", {
         dir: this.localize.dir()
       });
-      await u(this.popup.popup, e, t), this.emit("cx-after-show"), this.panel.assignedElements().forEach(async (o) => {
-        o instanceof d && o.variant === "multiple" && (await o.updateComplete, o.adjustMenuSize(0));
+      await u(this.popup.popup, e, t), this.emit("cx-after-show"), this.panel.assignedElements().forEach(async (i) => {
+        i instanceof d && i.variant === "multiple" && (await i.updateComplete, i.adjustMenuSize(0));
       });
     } else {
       this.emit("cx-hide"), this.removeOpenListeners(), await c(this);
       const { keyframes: e, options: t } = g(this, "dropdown.hide", {
         dir: this.localize.dir()
       });
-      await u(this.popup.popup, e, t), this.panel.hidden = !0, this.popup.active = !1, this.emit("cx-after-hide"), this.panel.assignedElements().forEach(async (o) => {
-        o instanceof d && o.variant === "multiple" && o.resetActiveMenu();
+      await u(this.popup.popup, e, t), this.panel.hidden = !0, this.popup.active = !1, this.emit("cx-after-hide"), this.panel.assignedElements().forEach(async (i) => {
+        i instanceof d && i.variant === "multiple" && i.resetActiveMenu();
       });
     }
   }
   render() {
-    return D`
-      <cx-popup
-        part="base"
-        exportparts="popup:base__popup"
-        id="dropdown"
-        placement=${this.placement}
-        distance=${this.distance}
-        skidding=${this.skidding}
-        strategy=${this.hoist ? "overlay" : "absolute"}
-        ?flip=${!this.noFlip}
-        shift
-        auto-size="both"
-        auto-size-padding="10"
-        flip-padding=${this.flipPadding}
-        sync=${O(this.sync ? this.sync : void 0)}
-        class=${T({
+    return D`<cx-popup part="base" exportparts="popup:base__popup" id="dropdown" placement=${this.placement} distance=${this.distance} skidding=${this.skidding} strategy=${this.hoist ? "overlay" : "absolute"} ?flip=${!this.noFlip} shift auto-size="both" auto-size-padding="10" flip-padding=${this.flipPadding} sync=${O(this.sync ? this.sync : void 0)} class=${T({
       dropdown: !0,
       "dropdown--open": this.open
-    })}
-        auto-width-factor=${this.autoWidthFactor}
-      >
-        <slot
-          name="trigger"
-          slot="anchor"
-          part="trigger"
-          class="dropdown__trigger"
-          @click=${this.handleTriggerClick}
-          @keydown=${this.handleTriggerKeyDown}
-          @keyup=${this.handleTriggerKeyUp}
-          @slotchange=${this.handleTriggerSlotChange}
-        ></slot>
-
-        <div
-          aria-hidden=${this.open && this.hasSlotController.test("[default]") ? "false" : "true"}
-          aria-labelledby="dropdown"
-        >
-          <slot part="panel" class="dropdown__panel"></slot>
-        </div>
-      </cx-popup>
-    `;
+    })} auto-width-factor=${this.autoWidthFactor}><slot name="trigger" slot="anchor" part="trigger" class="dropdown__trigger" @click=${this.handleTriggerClick} @keydown=${this.handleTriggerKeyDown} @keyup=${this.handleTriggerKeyUp} @slotchange=${this.handleTriggerSlotChange}></slot><div aria-hidden=${this.open && this.hasSlotController.test("[default]") ? "false" : "true"} aria-labelledby="dropdown"><slot part="panel" class="dropdown__panel"></slot></div></cx-popup>`;
   }
 };
-i.styles = [b, A];
-i.dependencies = { "cx-popup": L };
+o.styles = [b, S];
+o.dependencies = { "cx-popup": L };
 n([
   h(".dropdown")
-], i.prototype, "popup", 2);
+], o.prototype, "popup", 2);
 n([
   h(".dropdown__trigger")
-], i.prototype, "trigger", 2);
+], o.prototype, "trigger", 2);
 n([
   h(".dropdown__panel")
-], i.prototype, "panel", 2);
+], o.prototype, "panel", 2);
 n([
   s({ reflect: !0, type: Boolean })
-], i.prototype, "open", 2);
+], o.prototype, "open", 2);
 n([
   s({ reflect: !0 })
-], i.prototype, "placement", 2);
+], o.prototype, "placement", 2);
 n([
   s({ reflect: !0, type: Boolean })
-], i.prototype, "disabled", 2);
+], o.prototype, "disabled", 2);
 n([
   s({ attribute: "stay-open-on-select", reflect: !0, type: Boolean })
-], i.prototype, "stayOpenOnSelect", 2);
+], o.prototype, "stayOpenOnSelect", 2);
 n([
   s({ attribute: "containing-element" })
-], i.prototype, "containingElement", 2);
+], o.prototype, "containingElement", 2);
 n([
   s({ type: Number })
-], i.prototype, "distance", 2);
+], o.prototype, "distance", 2);
 n([
   s({ type: Number })
-], i.prototype, "skidding", 2);
+], o.prototype, "skidding", 2);
 n([
   s({ type: Boolean })
-], i.prototype, "hoist", 2);
+], o.prototype, "hoist", 2);
 n([
   s({ reflect: !0 })
-], i.prototype, "sync", 2);
+], o.prototype, "sync", 2);
 n([
   s({ attribute: "auto-width-factor" })
-], i.prototype, "autoWidthFactor", 2);
+], o.prototype, "autoWidthFactor", 2);
 n([
   s({
     attribute: "ignored-keys",
@@ -336,19 +234,19 @@ n([
     },
     type: String
   })
-], i.prototype, "ignoredKeys", 2);
+], o.prototype, "ignoredKeys", 2);
 n([
   s({ attribute: "no-flip", reflect: !0, type: Boolean })
-], i.prototype, "noFlip", 2);
+], o.prototype, "noFlip", 2);
 n([
   s({ attribute: "flip-padding", type: Number })
-], i.prototype, "flipPadding", 2);
+], o.prototype, "flipPadding", 2);
 n([
   E("open", { waitUntilFirstUpdate: !0 })
-], i.prototype, "handleOpenChange", 1);
-i = n([
+], o.prototype, "handleOpenChange", 1);
+o = n([
   x("cx-dropdown")
-], i);
+], o);
 y("dropdown.show", {
   keyframes: [
     { opacity: 0, scale: 0.9 },
@@ -364,5 +262,5 @@ y("dropdown.hide", {
   options: { duration: 100, easing: "ease" }
 });
 export {
-  i as default
+  o as default
 };

package/library/components/dynamic-select.js

@@ -1,19 +1,19 @@
-import { C as y } from "../chunks/button.KnE3mcyM.js";
-import b from "./icon-button.js";
-import { C as l, a as g } from "../chunks/option.DnpkE8Xi.js";
+import { C as y } from "../chunks/button.CauAHfdl.js";
+import { C as b } from "../chunks/icon-button.rKe0N4VB.js";
+import { C as l, a as g } from "../chunks/option.COnEtd3X.js";
 import $ from "./select.js";
 import { n as o, C as v } from "../chunks/lib-cortex-element.CVMmyPMC.js";
 import { c as x } from "../chunks/custom-element.L4WJXn1j.js";
 import { d as O } from "../chunks/debounce.DaHuiSGU.js";
-import { L as w } from "../chunks/i18n.C0iakJkV.js";
-import { w as f } from "../chunks/watch.q1sEjPWL.js";
+import { L as w } from "../chunks/i18n.BFqTRDCA.js";
+import { w as f } from "../chunks/watch.BCJD77bD.js";
 import { x as h } from "../chunks/lit-element.jLBm65_O.js";
 import { r as p } from "../chunks/state.CSDxrqLd.js";
 import { e as C } from "../chunks/query.BBf1UFkC.js";
 import { o as d } from "../chunks/if-defined.BRoBj_Rp.js";
 import { c as B } from "../chunks/repeat.DbF2p5ae.js";
 import { n as m } from "../chunks/when.Dr1es41R.js";
-import { b as S, a as E } from "../chunks/_baseUniq.Df-fLIBx.js";
+import { b as S, a as E } from "../chunks/_baseUniq.BUihBa8c.js";
 function T(i, r) {
   return i && i.length ? S(i, E(r)) : [];
 }
@@ -88,81 +88,16 @@ let t = class extends v {
   }
   render() {
     const i = this.noDropdown || this.noDropdownOnEmpty && !this.options.length;
-    return h`
-      <cx-select
-        ?allow-freetext=${this.allowFreetext}
-        auto-size-padding=${this.autosizePadding}
-        ?clearable=${this.clearable}
-        data-id=${d(this.dataset.id || void 0)}
-        data-label=${d(this.dataset.label || void 0)}
-        ?disabled=${this.disabled}
-        ?filled=${this.filled}
-        ?force-on-change=${this.forceOnChange}
-        form=${this.form}
-        .syncElement=${this.syncElement}
-        ?free-width=${this.freeWidth}
-        .getOptionValue=${this.getOptionValue}
-        .setOptionCurrent=${this.setOptionCurrent}
-        .setOptionSelected=${this.setOptionSelected}
-        help-text=${this.helpText}
-        ?hoist=${this.hoist}
-        input-behavior=${this.inputBehavior}
-        label=${this.label}
-        max-options-visible=${this.maxOptionsVisible}
-        name=${this.name}
-        ?multiple=${this.multiple}
-        ?open=${this.open}
-        ?pill=${this.pill}
-        placeholder=${this.placeholder}
-        ?required=${this.required}
-        size=${this.size}
-        ?stay-open-on-select=${this.stayOpenOnSelect}
-        ?no-flip=${this.noFlip}
-        ?use-tag=${this.useTag}
-        value=${this.value}
-        @input=${this.useSearchTerm ? this.handleInputChange : void 0}
-        ?no-reset-current=${this.noResetCurrent}
-        ?no-select-on-enter=${this.noSelectOnEnter}
-        ?no-dropdown=${i}
-        ?loading=${this.loading}
-        ?allow-default-mouse-down=${this.allowDefaultMouseDown}
-        @cx-change=${this.customChangeEvent ? this.handleCustomChange : void 0}
-      >
-        ${m(this.iconName, () => h`<cx-icon-button
-            class="icon-button"
-            tabindex="-1"
-            label=${this.localize.term("search")}
-            name=${this.iconName}
-            slot="prefix"
-          ></cx-icon-button>`)}
+    return h`<cx-select ?allow-freetext=${this.allowFreetext} auto-size-padding=${this.autosizePadding} ?clearable=${this.clearable} data-id=${d(this.dataset.id || void 0)} data-label=${d(this.dataset.label || void 0)} ?disabled=${this.disabled} ?filled=${this.filled} ?force-on-change=${this.forceOnChange} form=${this.form} .syncElement=${this.syncElement} ?free-width=${this.freeWidth} .getOptionValue=${this.getOptionValue} .setOptionCurrent=${this.setOptionCurrent} .setOptionSelected=${this.setOptionSelected} help-text=${this.helpText} ?hoist=${this.hoist} input-behavior=${this.inputBehavior} label=${this.label} max-options-visible=${this.maxOptionsVisible} name=${this.name} ?multiple=${this.multiple} ?open=${this.open} ?pill=${this.pill} placeholder=${this.placeholder} ?required=${this.required} size=${this.size} ?stay-open-on-select=${this.stayOpenOnSelect} ?no-flip=${this.noFlip} ?use-tag=${this.useTag} value=${this.value} @input=${this.useSearchTerm ? this.handleInputChange : void 0} ?no-reset-current=${this.noResetCurrent} ?no-select-on-enter=${this.noSelectOnEnter} ?no-dropdown=${i} ?loading=${this.loading} ?allow-default-mouse-down=${this.allowDefaultMouseDown} @cx-change=${this.customChangeEvent ? this.handleCustomChange : void 0}>${m(this.iconName, () => h`<cx-icon-button class="icon-button" tabindex="-1" label=${this.localize.term("search")} name=${this.iconName} slot="prefix"></cx-icon-button>`)}
         ${B(
       this.options,
       (r) => r.value ?? "",
-      (r) => h`
-              <cx-option
-                value=${r.value ?? ""}
-                ?disabled=${r.disabled}
-                show-check
-                check-placement=${g.Right}
-              >
-                ${r.label ?? r.value ?? ""}
-              </cx-option>
-            `
+      (r) => h`<cx-option value=${r.value ?? ""} ?disabled=${r.disabled} show-check check-placement=${g.Right}>${r.label ?? r.value ?? ""}</cx-option>`
     )}
         ${m(
       this.hasMore,
-      () => h`<cx-option value="load-more" class="tree-item__actions">
-              <cx-button
-                variant="text"
-                ?loading=${this.loading}
-                @click=${this.handleLoadMore}
-              >
-                ${this.localize.term("more")}
-              </cx-button>
-            </cx-option>`
-    )}
-      </cx-select>
-    `;
+      () => h`<cx-option value="load-more" class="tree-item__actions"><cx-button variant="text" ?loading=${this.loading} @click=${this.handleLoadMore}>${this.localize.term("more")}</cx-button></cx-option>`
+    )}</cx-select>`;
   }
 };
 t.dependencies = {

package/library/components/e-chart.js

@@ -1,10 +1,10 @@
 import IP from "./resize-observer.js";
 import EP from "./spinner.js";
 import { n as lm, C as PP } from "../chunks/lib-cortex-element.CVMmyPMC.js";
-import { c as NP } from "../chunks/component.styles.DMSLciL5.js";
+import { c as NP } from "../chunks/component.styles.CRO4Odto.js";
 import { c as RP } from "../chunks/custom-element.L4WJXn1j.js";
-import { L as kP } from "../chunks/i18n.C0iakJkV.js";
-import { w as OP } from "../chunks/watch.q1sEjPWL.js";
+import { L as kP } from "../chunks/i18n.BFqTRDCA.js";
+import { w as OP } from "../chunks/watch.BCJD77bD.js";
 import { i as VP, x as A_ } from "../chunks/lit-element.jLBm65_O.js";
 import { e as BP } from "../chunks/query.BBf1UFkC.js";
 import { e as zP } from "../chunks/class-map.BiVq-cVR.js";
@@ -47589,38 +47589,7 @@ _t(PG);
 _t(Tq);
 _t(Cq);
 _t(hH);
-const Mq = VP`
-  :host {
-    display: block;
-    height: 100%;
-    width: 100%;
-  }
-
-  .e-chart {
-    height: 100%;
-  }
-
-  .e-chart--loading {
-    opacity: 0;
-    visibility: hidden;
-  }
-
-  .e-chart-loading {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    position: absolute;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-    z-index: 1;
-  }
-
-  .e-chart__spinner {
-    font-size: var(--cx-font-size-2x-large);
-  }
-`;
+const Mq = VP`:host{width:100%;height:100%;display:block}.e-chart{height:100%}.e-chart--loading{opacity:0;visibility:hidden}.e-chart-loading{z-index:1;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:absolute;top:0;left:0}.e-chart__spinner{font-size:var(--cx-font-size-2x-large)}`;
 function dl(r) {
   if (typeof r == "number" && !Number.isNaN(r))
     return r;
@@ -47858,25 +47827,13 @@ let Ja = class extends PP {
     });
   }
   render() {
-    return A_`
-      <cx-resize-observer @cx-resize=${this.handleResize}>
-        ${GP(
+    return A_`<cx-resize-observer @cx-resize=${this.handleResize}>${GP(
       this.loading,
-      () => A_`
-            <div class="e-chart-loading">
-              <cx-spinner class="e-chart__spinner"></cx-spinner>
-            </div>
-          `
-    )}
-        <div
-          class=${zP({
+      () => A_`<div class="e-chart-loading"><cx-spinner class="e-chart__spinner"></cx-spinner></div>`
+    )}<div class=${zP({
       "e-chart": !0,
       "e-chart--loading": this.loading ?? !1
-    })}
-          part="base"
-        ></div>
-      </cx-resize-observer>
-    `;
+    })} part="base"></div></cx-resize-observer>`;
   }
 };
 _r = /* @__PURE__ */ new WeakMap();

package/library/components/element-clamp.js

@@ -1,72 +1,17 @@
 import { n as a, C as b } from "../chunks/lib-cortex-element.CVMmyPMC.js";
-import { c as w } from "../chunks/component.styles.DMSLciL5.js";
+import { c as w } from "../chunks/component.styles.CRO4Odto.js";
 import { s as d, a as c, b as m } from "../chunks/animate.El-MpOws.js";
 import { c as x } from "../chunks/custom-element.L4WJXn1j.js";
 import { w as u } from "../chunks/event.mFzZi4sr.js";
-import { L as v } from "../chunks/i18n.C0iakJkV.js";
-import { w as y } from "../chunks/watch.q1sEjPWL.js";
+import { L as v } from "../chunks/i18n.BFqTRDCA.js";
+import { w as y } from "../chunks/watch.BCJD77bD.js";
 import { i as C, x as f } from "../chunks/lit-element.jLBm65_O.js";
 import { r as k } from "../chunks/state.CSDxrqLd.js";
 import { e as E } from "../chunks/query.BBf1UFkC.js";
 import { e as H } from "../chunks/class-map.BiVq-cVR.js";
 import { a as p, g } from "../chunks/animation-registry.HmpwNuGH.js";
-import { C as B } from "../chunks/button.KnE3mcyM.js";
-const T = C`
-  :host {
-    display: block;
-    overflow: hidden;
-    --toggler-color: var(--cx-color-primary);
-  }
-
-  .element-clamp {
-    overflow-anchor: none;
-  }
-
-  .element-clamp--disabled {
-    opacity: 0.5;
-  }
-
-  .element-clamp-icon {
-    flex: 0 0 auto;
-    display: flex;
-    align-items: center;
-    transition: var(--cx-transition-medium) rotate ease;
-  }
-
-  .details--open .element-clamp-icon {
-    rotate: 90deg;
-  }
-
-  .details--open.details--rtl .element-clamp-icon {
-    rotate: -90deg;
-  }
-
-  .element-clamp--open slot[name='expand-icon'],
-  .element-clamp:not(.element-clamp--open) slot[name='collapse-icon'] {
-    display: none;
-  }
-
-  .element-clamp__content {
-    display: block;
-    overflow: hidden;
-  }
-
-  .toggler {
-    display: block;
-    margin-top: var(--cx-spacing-2x-small);
-  }
-
-  .toggler::part(base) {
-    color: var(--toggler-color);
-    font-weight: var(--cx-font-weight-medium);
-    text-transform: none;
-    width: auto;
-  }
-
-  .toggler::part(label) {
-    padding-left: 0;
-  }
-`;
+import { C as B } from "../chunks/button.CauAHfdl.js";
+const T = C`:host{--toggler-color:var(--cx-color-primary);display:block;overflow:hidden}.element-clamp{overflow-anchor:none}.element-clamp--disabled{opacity:.5}.element-clamp-icon{transition:var(--cx-transition-medium) rotate ease;flex:none;align-items:center;display:flex}.details--open .element-clamp-icon{rotate:90deg}.details--open.details--rtl .element-clamp-icon{rotate:-90deg}.element-clamp--open slot[name=expand-icon],.element-clamp:not(.element-clamp--open) slot[name=collapse-icon]{display:none}.element-clamp__content{display:block;overflow:hidden}.toggler{margin-top:var(--cx-spacing-2x-small);display:block}.toggler::part(base){color:var(--toggler-color);font-weight:var(--cx-font-weight-medium);text-transform:none;width:auto}.toggler::part(label){padding-left:0}`;
 var z = Object.defineProperty, O = Object.getOwnPropertyDescriptor, n = (e, t, i, r) => {
   for (var s = r > 1 ? void 0 : r ? O(t, i) : t, h = e.length - 1, l; h >= 0; h--)
     (l = e[h]) && (s = (r ? l(t, i, s) : l(s)) || s);
@@ -186,30 +131,12 @@ let o = class extends b {
   }
   render() {
     const e = this.localize.dir() === "rtl", t = this.open ? this.showLessText : this.showMoreText;
-    return f`
-      <div
-        part="base"
-        class=${H({
+    return f`<div part="base" class=${H({
       "element-clamp": !0,
       "element-clamp--disabled": this.disabled,
       "element-clamp--open": this.open,
       "element-clamp--rtl": e
-    })}
-        @click=${this.showMore ? void 0 : this.handleClick}
-      >
-        <slot part="content" id="content" class="element-clamp__content"></slot>
-        ${this.showButton ? f`<cx-button
-              part="toggler"
-              size="small"
-              variant="text"
-              class="toggler"
-              title=""
-              @click=${this.handleClick}
-            >
-              ${t}
-            </cx-button>` : ""}
-      </div>
-    `;
+    })} @click=${this.showMore ? void 0 : this.handleClick}><slot part="content" id="content" class="element-clamp__content"></slot>${this.showButton ? f`<cx-button part="toggler" size="small" variant="text" class="toggler" @click=${this.handleClick}>${t}</cx-button>` : ""}</div>`;
   }
 };
 o.styles = [w, T];