@orangelogic/design-system 2.78.0 → 2.79.0-ci.2

package/library/chunks/icon-button.BuhCp--_.js

@@ -0,0 +1,149 @@
+import { n as r, C as g } from "./lib-cortex-element.CVMmyPMC.js";
+import { c as p } from "./component.styles.CRO4Odto.js";
+import { c as h } from "./custom-element.L4WJXn1j.js";
+import { L as m } from "./i18n.BUW7B9hr.js";
+import { r as f } from "./state.CSDxrqLd.js";
+import { e as v } from "./query.BBf1UFkC.js";
+import { e as y } from "./class-map.BiVq-cVR.js";
+import { o as c } from "./if-defined.BRoBj_Rp.js";
+import { n as k } from "./when.Dr1es41R.js";
+import { i as d, u as b } from "./static.UA3G1Deq.js";
+import _ from "../components/icon.js";
+import w from "../components/spinner.js";
+import { i as z } from "./lit-element.jLBm65_O.js";
+var x = /* @__PURE__ */ ((o) => (o.Large = "large", o.Medium = "medium", o.Small = "small", o.XLarge = "x-large", o))(x || {});
+const $ = z`:host{color:var(--cx-color-neutral-600);--group-divider-color:#80808054;display:inline-block}.icon-button{border-radius:var(--cx-border-radius-medium);font-size:inherit;color:inherit;padding:var(--cx-spacing-x-small);cursor:pointer;transition:var(--cx-transition-x-fast) color;background:0 0;border:none;flex:none;align-items:center;display:flex;position:relative}.icon-button:focus{outline:none}.icon-button--disabled{opacity:.5;cursor:default}.icon-button:focus-visible{outline:var(--cx-focus-ring);outline-offset:var(--cx-focus-ring-offset)}.icon-button__icon{pointer-events:none;margin:auto}.icon-button--small{font-size:var(--cx-font-size-x-small);padding:var(--cx-spacing-2x-small);min-height:var(--cx-input-height-small);min-width:var(--cx-input-height-small)}.icon-button--medium{font-size:var(--cx-font-size-large);padding:var(--cx-spacing-2x-small);min-height:var(--cx-input-height-medium);min-width:var(--cx-input-height-medium)}.icon-button--large{font-size:var(--cx-font-size-large);padding:var(--cx-spacing-x-small);min-height:var(--cx-input-height-large);min-width:var(--cx-input-width-large)}.icon-button--x-large{font-size:var(--cx-font-size-large);padding:var(--cx-spacing-small);min-height:var(--cx-input-height-x-large);min-width:var(--cx-input-height-x-large)}.icon-button.icon-button--default{background-color:var(--cx-color-neutral-100);border-color:var(--cx-color-neutral-100);color:var(--cx-color-neutral)}.icon-button.icon-button--default:hover:not(.icon-button--disabled),.icon-button.icon-button--default.icon-button--focused:not(.icon-button--disabled){background-color:var(--cx-color-neutral-200);border-color:var(--cx-color-neutral-200);color:var(--cx-color-neutral)}.icon-button.icon-button--default:active:not(.icon-button--disabled){background-color:var(--cx-color-neutral-300);border-color:var(--cx-color-neutral-300);color:var(--cx-color-neutral)}.icon-button.icon-button--primary{background-color:var(--cx-color-primary);border-color:var(--cx-color-primary);color:var(--cx-color-neutral-0)}.icon-button.icon-button--primary:hover:not(.icon-button--disabled),.icon-button.icon-button--primary.icon-button--focused:not(.icon-button--disabled){background-color:var(--cx-color-primary-500);border-color:var(--cx-color-primary-500);color:var(--cx-color-neutral-0)}.icon-button.icon-button--primary:active:not(.icon-button--disabled){background-color:var(--cx-color-primary-700);border-color:var(--cx-color-primary-700);color:var(--cx-color-neutral-0)}.icon-button.icon-button--success{background-color:var(--cx-color-success);border-color:var(--cx-color-success);color:var(--cx-color-neutral-0)}.icon-button.icon-button--success:hover:not(.icon-button--disabled),.icon-button.icon-button--success.icon-button--focused:not(.icon-button--disabled){background-color:var(--cx-color-success-500);border-color:var(--cx-color-success-500);color:var(--cx-color-neutral-0)}.icon-button.icon-button--success:active:not(.icon-button--disabled){background-color:var(--cx-color-success-700);border-color:var(--cx-color-success-700);color:var(--cx-color-neutral-0)}.icon-button.icon-button--warning{background-color:var(--cx-color-warning);border-color:var(--cx-color-warning);color:var(--cx-color-neutral-0)}.icon-button.icon-button--warning:hover:not(.icon-button--disabled),.icon-button.icon-button--warning.icon-button--focused:not(.icon-button--disabled){background-color:var(--cx-color-warning-500);border-color:var(--cx-color-warning-500);color:var(--cx-color-neutral-0)}.icon-button.icon-button--warning:active:not(.icon-button--disabled){background-color:var(--cx-color-warning-700);border-color:var(--cx-color-warning-700);color:var(--cx-color-neutral-0)}.icon-button.icon-button--danger{background-color:var(--cx-color-danger);border-color:var(--cx-color-danger);color:var(--cx-color-neutral-0)}.icon-button.icon-button--danger:hover:not(.icon-button--disabled),.icon-button.icon-button--danger.icon-button--focused:not(.icon-button--disabled){background-color:var(--cx-color-danger-500);border-color:var(--cx-color-danger-500);color:var(--cx-color-neutral-0)}.icon-button.icon-button--danger:active:not(.icon-button--disabled){background-color:var(--cx-color-danger-700);border-color:var(--cx-color-danger-700);color:var(--cx-color-neutral-0)}.icon-button.icon-button--custom,.icon-button.icon-button--custom:hover:not(.icon-button--disabled),.icon-button.icon-button--custom.icon-button--focused:not(.icon-button--disabled),.icon-button.icon-button--custom:active:not(.icon-button--disabled){background-color:var(--background-color);border-color:var(--background-color);color:var(--color)}.icon-button--outline{border:solid var(--cx-input-border-width);border-color:var(--cx-input-border-color);background:0 0}.icon-button--outline.icon-button--default{border-color:var(--cx-input-border-color);color:var(--cx-color-neutral)}.icon-button--outline.icon-button--default:hover:not(.icon-button--disabled),.icon-button--outline.icon-button--default.icon-button--focused:not(.icon-button--disabled),.icon-button--outline.icon-button--default.icon-button--checked:not(.icon-button--disabled){border-color:var(--cx-color-neutral-300);background-color:var(--cx-color-neutral-100);color:var(--cx-color-neutral)}.icon-button--outline.icon-button--default:active:not(.icon-button--disabled){border-color:var(--cx-color-neutral-300);background-color:var(--cx-color-neutral-200);color:var(--cx-color-neutral)}.icon-button--outline.icon-button--primary{border-color:var(--cx-color-primary);color:var(--cx-color-primary)}.icon-button--outline.icon-button--primary:hover:not(.icon-button--disabled),.icon-button--outline.icon-button--primary.icon-button--focused:not(.icon-button--disabled),.icon-button--outline.icon-button--primary.icon-button--checked:not(.icon-button--disabled){background-color:var(--cx-color-primary-500);color:var(--cx-color-neutral-0)}.icon-button--outline.icon-button--primary:active:not(.icon-button--disabled){border-color:var(--cx-color-primary-700);background-color:var(--cx-color-primary-700);color:var(--cx-color-neutral-0)}.icon-button--outline.icon-button--success{border-color:var(--cx-color-success);color:var(--cx-color-success)}.icon-button--outline.icon-button--success:hover:not(.icon-button--disabled),.icon-button--outline.icon-button--success.icon-button--focused:not(.icon-button--disabled),.icon-button--outline.icon-button--success.icon-button--checked:not(.icon-button--disabled){background-color:var(--cx-color-success-500);color:var(--cx-color-neutral-0)}.icon-button--outline.icon-button--success:active:not(.icon-button--disabled){border-color:var(--cx-color-success);background-color:var(--cx-color-success);color:var(--cx-color-neutral-0)}.icon-button--outline.icon-button--warning{border-color:var(--cx-color-warning);color:var(--cx-color-warning)}.icon-button--outline.icon-button--warning:hover:not(.icon-button--disabled),.icon-button--outline.icon-button--warning.icon-button--focused:not(.icon-button--disabled),.icon-button--outline.icon-button--warning.icon-button--checked:not(.icon-button--disabled){background-color:var(--cx-color-warning-500);color:var(--cx-color-neutral-0)}.icon-button--outline.icon-button--warning:active:not(.icon-button--disabled){border-color:var(--cx-color-warning-700);background-color:var(--cx-color-warning-700);color:var(--cx-color-neutral-0)}.icon-button--outline.icon-button--danger{border-color:var(--cx-color-danger);color:var(--cx-color-danger)}.icon-button--outline.icon-button--danger:hover:not(.icon-button--disabled),.icon-button--outline.icon-button--danger.icon-button--focused:not(.icon-button--disabled),.icon-button--outline.icon-button--danger.icon-button--checked:not(.icon-button--disabled){background-color:var(--cx-color-danger-500);color:var(--cx-color-neutral-0)}.icon-button--outline.icon-button--danger:active:not(.icon-button--disabled){border-color:var(--cx-color-danger-700);background-color:var(--cx-color-danger-700);color:var(--cx-color-neutral-0)}.icon-button--tertiary{color:var(--cx-color-neutral);background-color:#0000;border-color:#0000}.icon-button--tertiary:hover:not(.icon-button--disabled),.icon-button--tertiary.icon-button--focused:not(.icon-button--disabled){background-color:var(--cx-color-neutral-100);color:var(--cx-color-neutral);border-color:#0000}.icon-button--tertiary:focus-visible:not(.icon-button--disabled){background-color:var(--cx-color-neutral-200);color:var(--cx-color-neutral);border-color:#0000}.icon-button--tertiary:active:not(.icon-button--disabled){background-color:var(--cx-color-neutral-300);color:var(--cx-color-neutral);border-color:#0000}.icon-button--circle{border-radius:var(--cx-border-radius-circle)}:host([data-cx-button-group__button--first]:not([data-cx-button-group__button--last])) .icon-button{border-start-end-radius:0;border-end-end-radius:0}:host([data-cx-button-group__button--inner]) .icon-button{border-radius:0}:host([data-cx-button-group__button--last]:not([data-cx-button-group__button--first])) .icon-button{border-start-start-radius:0;border-end-start-radius:0}:host([data-cx-button-group__button]:not([data-cx-button-group__button--first])){margin-inline-start:calc(-1 * var(--cx-input-border-width))}:host([data-cx-button-group__button]:not([data-cx-button-group__button--first],[data-cx-button-group__button--radio],[variant=default]):not(:hover)) .icon-button:after{content:"";top:0;inset-inline-start:0;border-left:solid 1px var(--group-divider-color);mix-blend-mode:multiply;position:absolute;bottom:0}:host([data-cx-button-group__button--hover]){z-index:1}:host([data-cx-button-group__button--focus]),:host([data-cx-button-group__button][checked]){z-index:2}.icon-button ::slotted(cx-badge){pointer-events:none;translate:50% -50%;top:0!important;left:unset!important;position:absolute!important;right:0!important}.icon-button--rtl ::slotted(cx-badge){left:0;right:auto;translate:-50% -50%}.icon-button--small ::slotted(cx-badge){--padding:.1em .32em;--font-size:var(--cx-font-size-x-small)}.icon-button--medium ::slotted(cx-badge){--font-size:var(--cx-font-size-small)}.icon-button--large ::slotted(cx-badge),.icon-button--x-large ::slotted(cx-badge){--font-size:var(--cx-font-size-medium)}.icon-button__icon-container{justify-content:center;align-items:center;width:100%;height:100%;line-height:1;display:flex;position:relative}.icon-button--loading{cursor:wait;position:relative}.icon-button--loading cx-spinner{--indicator-color:currentColor;width:1em;height:1em;font-size:1em;position:absolute;top:calc(50% - .5em);left:calc(50% - .5em)}`;
+var C = Object.defineProperty, S = Object.getOwnPropertyDescriptor, n = (o, i, l, a) => {
+  for (var e = a > 1 ? void 0 : a ? S(i, l) : i, u = o.length - 1, s; u >= 0; u--)
+    (s = o[u]) && (e = (a ? s(i, l, e) : s(e)) || e);
+  return a && e && C(i, l, e), e;
+};
+let t = class extends g {
+  constructor() {
+    super(...arguments), this.localize = new m(this), this.hasFocus = !1, this.variant = "outlined", this.buttonVariant = "text", this.label = "", this.disabled = !1, this.loading = !1, this.iconClass = "", this.size = x.Medium, this.outline = !1, this.circle = !1;
+  }
+  connectedUpdatedCallback() {
+    this.syncStyles(), this.styleObserver = new MutationObserver(() => this.syncStyles()), this.styleObserver.observe(this, {
+      attributeFilter: ["style"],
+      attributes: !0
+    });
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback(), this.styleObserver?.disconnect();
+  }
+  syncStyles() {
+    const o = this.style.fontSize;
+    o && this.button && (this.icon.style.setProperty("--font-size", o), this.button.style.fontSize = "inherit", this.style.fontSize = "");
+  }
+  handleBlur() {
+    this.hasFocus = !1, this.emit("cx-blur");
+  }
+  handleFocus() {
+    this.hasFocus = !0, this.emit("cx-focus");
+  }
+  handleClick(o) {
+    this.disabled && (o.preventDefault(), o.stopPropagation());
+  }
+  /** Simulates a click on the icon button. */
+  click() {
+    this.button.click();
+  }
+  /** Sets focus on the icon button. */
+  focus(o) {
+    this.button.focus(o);
+  }
+  /** Removes focus from the icon button. */
+  blur() {
+    this.button.blur();
+  }
+  render() {
+    const o = !!this.href, i = o ? d`a` : d`button`;
+    return b`<${i} part="base" class=${y({
+      "icon-button": !0,
+      "icon-button--circle": this.circle,
+      "icon-button--custom": !!this.src,
+      "icon-button--danger": this.buttonVariant === "danger",
+      "icon-button--default": this.buttonVariant === "default" || this.buttonVariant === "neutral",
+      "icon-button--disabled": !o && this.disabled,
+      "icon-button--focused": this.hasFocus,
+      "icon-button--large": this.size === "large",
+      "icon-button--loading": this.loading,
+      "icon-button--medium": this.size === "medium",
+      "icon-button--outline": this.outline,
+      "icon-button--primary": this.buttonVariant === "primary",
+      "icon-button--rtl": this.localize.dir() === "rtl",
+      "icon-button--small": this.size === "small",
+      "icon-button--success": this.buttonVariant === "success",
+      "icon-button--tertiary": this.buttonVariant === "tertiary",
+      "icon-button--text": this.buttonVariant === "text",
+      "icon-button--warning": this.buttonVariant === "warning",
+      "icon-button--x-large": this.size === "x-large"
+    })} ?disabled=${c(o ? void 0 : this.disabled)} type=${c(o ? void 0 : "button")} href=${c(o ? this.href : void 0)} target=${c(o ? this.target : void 0)} download=${c(o ? this.download : void 0)} rel=${c(
+      o && this.target ? "noreferrer noopener" : void 0
+    )} role=${c(o ? void 0 : "button")} aria-disabled=${this.disabled || this.loading ? "true" : "false"} aria-label=${this.label} tabindex=${this.disabled || this.loading ? "-1" : "0"} aria-busy=${this.loading ? "true" : "false"} @blur=${this.handleBlur} @focus=${this.handleFocus} @click=${this.handleClick}><div class="icon-button__icon-container">${k(
+      this.loading,
+      () => b`<cx-spinner part="spinner" role="status" aria-live="polite"></cx-spinner>`,
+      () => b`<cx-icon class="icon-button__icon" icon-class=${c(this.iconClass)} name=${c(this.name)} variant=${this.variant} src=${c(this.src)} aria-hidden="true" part="icon"></cx-icon>`
+    )}<slot name="badge"></slot></div></${i}>`;
+  }
+};
+t.styles = [p, $];
+t.dependencies = { "cx-icon": _, "cx-spinner": w };
+n([
+  v(".icon-button")
+], t.prototype, "button", 2);
+n([
+  v(".icon-button__icon")
+], t.prototype, "icon", 2);
+n([
+  f()
+], t.prototype, "hasFocus", 2);
+n([
+  r()
+], t.prototype, "name", 2);
+n([
+  r({ type: String })
+], t.prototype, "variant", 2);
+n([
+  r({ attribute: "button-variant", reflect: !0, type: String })
+], t.prototype, "buttonVariant", 2);
+n([
+  r()
+], t.prototype, "src", 2);
+n([
+  r()
+], t.prototype, "href", 2);
+n([
+  r()
+], t.prototype, "target", 2);
+n([
+  r()
+], t.prototype, "download", 2);
+n([
+  r()
+], t.prototype, "label", 2);
+n([
+  r({ reflect: !0, type: Boolean })
+], t.prototype, "disabled", 2);
+n([
+  r({ reflect: !0, type: Boolean })
+], t.prototype, "loading", 2);
+n([
+  r({ attribute: "icon-class", type: String })
+], t.prototype, "iconClass", 2);
+n([
+  r({ reflect: !0 })
+], t.prototype, "size", 2);
+n([
+  r({ reflect: !0, type: Boolean })
+], t.prototype, "outline", 2);
+n([
+  r({ reflect: !0, type: Boolean })
+], t.prototype, "circle", 2);
+t = n([
+  h("cx-icon-button")
+], t);
+export {
+  t as C,
+  x as I
+};

package/library/chunks/iframe.BQFZQMTe.js

@@ -0,0 +1,73 @@
+import { n as r, C as d } from "./lib-cortex-element.CVMmyPMC.js";
+import { c as h } from "./component.styles.CRO4Odto.js";
+import { c as y } from "./custom-element.L4WJXn1j.js";
+import { L as u } from "./i18n.BUW7B9hr.js";
+import { w as g } from "./watch.BCJD77bD.js";
+import { i as v, x as p } from "./lit-element.jLBm65_O.js";
+import { e as b } from "./query.BBf1UFkC.js";
+import { e as x } from "./class-map.BiVq-cVR.js";
+import { o as f } from "./if-defined.BRoBj_Rp.js";
+import { n as w } from "./when.Dr1es41R.js";
+var m = /* @__PURE__ */ ((o) => (o.Eager = "eager", o.Lazy = "lazy", o))(m || {});
+const _ = v`:host{--background-color:#f5f5f5;width:100%;height:var(--height,500px);isolation:isolate;display:block}.iframe{width:100%;height:100%;display:block;position:relative}.iframe--empty:before{color:#fff;content:attr(data-empty-text);font-family:var(--cx-font-sans);font-size:var(--cx-font-size-large);font-weight:var(--cx-font-weight-semibold);text-align:center;text-shadow:.05em .05em .1em #000;vertical-align:middle;z-index:1;background-color:#000;justify-content:center;align-items:center;width:100%;height:100%;line-height:1;display:flex;position:absolute}.iframe__overlay{z-index:1;background-color:#0000;width:100%;height:100%;display:none;position:absolute;top:0;left:0}.iframe__view{background-color:var(--background-color);border-radius:var(--cx-border-radius-small);border:none;width:100%;height:100%;display:block}.iframe__spinner{--track-width:6px;z-index:2;font-size:4rem;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}`;
+var z = Object.defineProperty, $ = Object.getOwnPropertyDescriptor, t = (o, a, s, l) => {
+  for (var i = l > 1 ? void 0 : l ? $(a, s) : a, n = o.length - 1, c; n >= 0; n--)
+    (c = o[n]) && (i = (l ? c(a, s, i) : c(i)) || i);
+  return l && i && z(a, s, i), i;
+};
+let e = class extends d {
+  constructor() {
+    super(...arguments), this.localize = new u(this), this.src = "", this.iframeTitle = "Embedded content", this.iframeLoading = m.Lazy, this.allow = "", this.sandbox = "", this.referrerPolicy = "", this.canFullscreen = !1, this.loading = !1;
+  }
+  async handleCanFullscreenChange() {
+    await this.updateComplete, this.iframe && (this.iframe.src = "", this.iframe.src = this.src);
+  }
+  render() {
+    return p`<div part="base" data-empty-text=${this.localize.term("noSourceUrlProvided")} class=${x({
+      iframe: !0,
+      "iframe--empty": !this.src && !this.loading
+    })}>${w(
+      this.loading,
+      () => p`<cx-spinner class="iframe__spinner"></cx-spinner>`
+    )}<div part="overlay" class="iframe__overlay" aria-hidden="true"></div><iframe part="view" class="iframe__view" allow=${f(this.allow || void 0)} loading=${this.iframeLoading} referrerpolicy=${f(this.referrerPolicy || void 0)} sandbox=${f(this.sandbox || void 0)} src=${this.src} title=${this.iframeTitle} ?allowfullscreen=${this.canFullscreen}></iframe></div>`;
+  }
+};
+e.styles = [h, _];
+e.dependencies = {};
+t([
+  b("iframe")
+], e.prototype, "iframe", 2);
+t([
+  r({ reflect: !0, type: String })
+], e.prototype, "src", 2);
+t([
+  r({ attribute: "iframe-title", reflect: !0, type: String })
+], e.prototype, "iframeTitle", 2);
+t([
+  r({ attribute: "iframe-loading", reflect: !0, type: String })
+], e.prototype, "iframeLoading", 2);
+t([
+  r({ reflect: !0, type: String })
+], e.prototype, "allow", 2);
+t([
+  r({ reflect: !0, type: String })
+], e.prototype, "sandbox", 2);
+t([
+  r({ attribute: "referrer-policy", reflect: !0, type: String })
+], e.prototype, "referrerPolicy", 2);
+t([
+  r({ attribute: "can-fullscreen", reflect: !0, type: Boolean })
+], e.prototype, "canFullscreen", 2);
+t([
+  r({ reflect: !0, type: Boolean })
+], e.prototype, "loading", 2);
+t([
+  g("canFullscreen")
+], e.prototype, "handleCanFullscreenChange", 1);
+e = t([
+  y("cx-iframe")
+], e);
+export {
+  e as C,
+  m as a
+};

package/library/chunks/{image.DHBgKeJp.js → image.4eLWAZ3-.js}

@@ -3,7 +3,7 @@ import { C as Re, n as m } from "./lib-cortex-element.CVMmyPMC.js";
 import { r as H } from "./state.CSDxrqLd.js";
 import { e as X } from "./query.BBf1UFkC.js";
 import { E as He, b as de, a as $e } from "./index.Cpamj0jB.js";
-import { c as We } from "./component.styles.DMSLciL5.js";
+import { c as We } from "./component.styles.CRO4Odto.js";
 import { c as Ae } from "./custom-element.L4WJXn1j.js";
 import { d as Oe } from "./debounce.DaHuiSGU.js";
 import { L as Me } from "./i18n.BUW7B9hr.js";
@@ -229,24 +229,7 @@ class A extends S {
     this.handleResizeDragging(t, !1, !1);
   }
   renderResizer() {
-    return T`
-      <div
-        class="resizer resizer--top-left"
-        @mousedown=${this.handleResizeDraggingTopLeft}
-      ></div>
-      <div
-        class="resizer resizer--top-right"
-        @mousedown=${this.handleResizeDraggingTopRight}
-      ></div>
-      <div
-        class="resizer resizer--bottom-left"
-        @mousedown=${this.handleResizeDraggingBottomLeft}
-      ></div>
-      <div
-        class="resizer resizer--bottom-right"
-        @mousedown=${this.handleResizeDraggingBottomRight}
-      ></div>
-    `;
+    return T`<div class="resizer resizer--top-left" @mousedown=${this.handleResizeDraggingTopLeft}></div><div class="resizer resizer--top-right" @mousedown=${this.handleResizeDraggingTopRight}></div><div class="resizer resizer--bottom-left" @mousedown=${this.handleResizeDraggingBottomLeft}></div><div class="resizer resizer--bottom-right" @mousedown=${this.handleResizeDraggingBottomRight}></div>`;
   }
 }
 O([
@@ -276,39 +259,7 @@ O([
 O([
   H()
 ], A.prototype, "resizeSize");
-const _e = se`
-  .resizer {
-    background-color: var(--cx-color-primary);
-    width: 8px;
-    height: 8px;
-    position: absolute;
-    z-index: 100;
-  }
-
-  .resizer--top-left {
-    top: calc(-1px - var(--border-width, 0px));
-    left: calc(-1px - var(--border-width, 0px));
-    cursor: nw-resize;
-  }
-
-  .resizer--top-right {
-    top: calc(-1px - var(--border-width, 0px));
-    right: calc(-1px - var(--border-width, 0px));
-    cursor: ne-resize;
-  }
-
-  .resizer--bottom-left {
-    bottom: calc(-1px - var(--border-width, 0px));
-    left: calc(-1px - var(--border-width, 0px));
-    cursor: sw-resize;
-  }
-
-  .resizer--bottom-right {
-    bottom: calc(-1px - var(--border-width, 0px));
-    right: calc(-1px - var(--border-width, 0px));
-    cursor: se-resize;
-  }
-`;
+const _e = se`.resizer{background-color:var(--cx-color-primary);z-index:100;width:8px;height:8px;position:absolute}.resizer--top-left{top:calc(-1px - var(--border-width,0px));left:calc(-1px - var(--border-width,0px));cursor:nw-resize}.resizer--top-right{top:calc(-1px - var(--border-width,0px));right:calc(-1px - var(--border-width,0px));cursor:ne-resize}.resizer--bottom-left{bottom:calc(-1px - var(--border-width,0px));left:calc(-1px - var(--border-width,0px));cursor:sw-resize}.resizer--bottom-right{bottom:calc(-1px - var(--border-width,0px));right:calc(-1px - var(--border-width,0px));cursor:se-resize}`;
 var U = /* @__PURE__ */ ((e) => (e.Automatic = "automatic", e.Manual = "manual", e))(U || {});
 /*! medium-zoom 1.1.0 | MIT License | https://github.com/francoischalifour/medium-zoom */
 var B = Object.assign || function(e) {
@@ -565,129 +516,7 @@ function Ke(e, t) {
 }
 var Je = ".medium-zoom-overlay{position:fixed;top:0;right:0;bottom:0;left:0;opacity:0;transition:opacity .3s;will-change:opacity}.medium-zoom--opened .medium-zoom-overlay{cursor:pointer;cursor:zoom-out;opacity:1}.medium-zoom-image{cursor:pointer;cursor:zoom-in;transition:transform .3s cubic-bezier(.2,0,.2,1)!important}.medium-zoom-image--hidden{visibility:hidden}.medium-zoom-image--opened{position:relative;cursor:pointer;cursor:zoom-out;will-change:transform}";
 Ke(Je);
-const Ge = se`
-  :host([effect='jump']) .container,
-  :host([effect='text-reveal']) .container,
-  :host([effect='zoom']) .container {
-    overflow: initial;
-  }
-
-  :host([effect='jump']) .highlighter {
-    transition:
-      all var(--transition-duration, 0.5s) var(--easing, linear),
-      transform var(--transition-transform-duration, 0.5s) var(--easing, linear);
-  }
-
-  :host([effect='jump']) .highlighter:hover {
-    transform: translateY(
-      calc(var(--highlightable-item-effect-jump-distance, 0) * -1)
-    );
-  }
-
-  .highlighter--effect-text-reveal,
-  :host([effect='zoom']) .highlighter--zoom-style-within-borders {
-    overflow: hidden;
-  }
-
-  :host([effect='zoom'][zoom-style='pop-out']) .highlighter:hover {
-    z-index: 3;
-    animation: none;
-  }
-
-  :host([effect='zoom'][zoom-style='pop-out']) .highlighter:not(:hover) {
-    animation: drop-z var(--transition-transform-duration) forwards;
-  }
-
-  @keyframes drop-z {
-    0% {
-      z-index: 2;
-    }
-
-    99% {
-      z-index: 2;
-    }
-
-    100% {
-      z-index: 0;
-    }
-  }
-
-  .highlighter--can-hover:hover::after,
-  .highlighter--selected::after,
-  .highlighter--color-overlay::after {
-    content: '';
-    position: absolute;
-    pointer-events: none;
-    width: 100%;
-    height: 100%;
-    top: 0;
-    left: 0;
-    transition: all var(--transition-duration, 0.5s) var(--easing, linear);
-  }
-
-  .highlighter--can-hover:hover::after,
-  .highlighter--selected::after {
-    outline: 2px solid var(--cx-color-primary);
-  }
-
-  .highlighter--border:hover .image {
-    border-color: var(
-      --highlightable-item-highlight-border-color,
-      var(--cx-color-primary)
-    );
-  }
-
-  .highlighter--color-overlay::after {
-    border-radius: var(--border-radius, none);
-  }
-
-  .highlighter--color-overlay:hover::after {
-    background-color: var(
-      --highlightable-item-highlight-color-overlay-color,
-      transparent
-    );
-  }
-
-  .highlighter--drop-shadow:hover .image {
-    box-shadow: var(--highlightable-item-highlight-drop-shadow, none);
-  }
-
-  .highlighter--background:hover .highlightable-item {
-    --content-background-color: var(
-      --highlightable-item-highlight-background,
-      transparent
-    );
-    --highlightable-item-background-color: var(
-      --highlightable-item-highlight-background,
-      transparent
-    );
-  }
-
-  .highlighter--opacity {
-    opacity: var(--highlightable-item-highlight-opacity, 1);
-  }
-
-  :host([effect='zoom'][zoom-style='within-borders']) .highlighter .image,
-  :host([effect='zoom'][zoom-style='pop-out']) .highlighter {
-    transition: transform var(--transition-transform-duration, 0.5s)
-      var(--easing, linear);
-  }
-
-  :host([effect='zoom'][zoom-style='within-borders']) .highlighter:hover .image,
-  :host([effect='zoom'][zoom-style='pop-out']) .highlighter:hover {
-    transform: scale(var(--highlightable-item-effect-zoom-scale, 1));
-  }
-
-  .highlightable-item {
-    transition:
-      background-color var(--transition-duration, 0.5s) var(--easing, linear),
-      border-color var(--transition-duration, 0.5s) var(--easing, linear),
-      box-shadow var(--transition-duration, 0.5s) var(--easing, linear),
-      opacity var(--transition-duration, 0.5s) var(--easing, linear),
-      transform var(--transition-transform-duration, 0.5s) var(--easing, linear),
-      visibility var(--transition-duration, 0.5s) var(--easing, linear);
-  }
-`, Qe = se`
+const Ge = se`:host([effect=jump]) .container,:host([effect=text-reveal]) .container,:host([effect=zoom]) .container{overflow:initial}:host([effect=jump]) .highlighter{transition:all var(--transition-duration,.5s) var(--easing,linear), transform var(--transition-transform-duration,.5s) var(--easing,linear)}:host([effect=jump]) .highlighter:hover{transform:translateY(calc(var(--highlightable-item-effect-jump-distance,0) * -1))}.highlighter--effect-text-reveal,:host([effect=zoom]) .highlighter--zoom-style-within-borders{overflow:hidden}:host([effect=zoom][zoom-style=pop-out]) .highlighter:hover{z-index:3;animation:none}:host([effect=zoom][zoom-style=pop-out]) .highlighter:not(:hover){animation:drop-z var(--transition-transform-duration) forwards}@keyframes drop-z{0%{z-index:2}99%{z-index:2}to{z-index:0}}.highlighter--can-hover:hover:after,.highlighter--selected:after,.highlighter--color-overlay:after{content:"";pointer-events:none;width:100%;height:100%;transition:all var(--transition-duration,.5s) var(--easing,linear);position:absolute;top:0;left:0}.highlighter--can-hover:hover:after,.highlighter--selected:after{outline:2px solid var(--cx-color-primary)}.highlighter--border:hover .image{border-color:var(--highlightable-item-highlight-border-color,var(--cx-color-primary))}.highlighter--color-overlay:after{border-radius:var(--border-radius,none)}.highlighter--color-overlay:hover:after{background-color:var(--highlightable-item-highlight-color-overlay-color,transparent)}.highlighter--drop-shadow:hover .image{box-shadow:var(--highlightable-item-highlight-drop-shadow,none)}.highlighter--background:hover .highlightable-item{--content-background-color:var(--highlightable-item-highlight-background,transparent);--highlightable-item-background-color:var(--highlightable-item-highlight-background,transparent)}.highlighter--opacity{opacity:var(--highlightable-item-highlight-opacity,1)}:host([effect=zoom][zoom-style=within-borders]) .highlighter .image,:host([effect=zoom][zoom-style=pop-out]) .highlighter{transition:transform var(--transition-transform-duration,.5s) var(--easing,linear)}:host([effect=zoom][zoom-style=within-borders]) .highlighter:hover .image,:host([effect=zoom][zoom-style=pop-out]) .highlighter:hover{transform:scale(var(--highlightable-item-effect-zoom-scale,1))}.highlightable-item{transition:background-color var(--transition-duration,.5s) var(--easing,linear), border-color var(--transition-duration,.5s) var(--easing,linear), box-shadow var(--transition-duration,.5s) var(--easing,linear), opacity var(--transition-duration,.5s) var(--easing,linear), transform var(--transition-transform-duration,.5s) var(--easing,linear), visibility var(--transition-duration,.5s) var(--easing,linear)}`, Qe = se`
   :host {
     --justify-content: flex-start;
     --border-radius: 0px;
@@ -1066,123 +895,38 @@ let l = class extends A {
   }
   renderContent() {
     const e = this.currentSrc, t = this.currentAltValue;
-    return T`
-      <div
-        part="content"
-        slot="anchor"
-        class=${j(this.highlighterClass)}
-      >
-        <img
-          part="image"
-          class=${j(this.imageClass)}
-          src=${e || this.placeholder}
-          alt=${t}
-          aria-label=${t}
-          crossorigin="anonymous"
-          @load=${this.handleLoad}
-          @error=${this.handleError}
-          loading=${this.htmlLoading}
-        />
-      </div>
-    `;
+    return T`<div part="content" slot="anchor" class=${j(this.highlighterClass)}><img part="image" class=${j(this.imageClass)} src=${e || this.placeholder} alt=${t} aria-label=${t} crossorigin="anonymous" @load=${this.handleLoad} @error=${this.handleError} loading=${this.htmlLoading}></div>`;
   }
   render() {
     const e = this.hasZoomAction, t = this.currentAltValue, o = !this.currentSrc && !this.placeholder;
-    return T`<div
-      part="base"
-      class=${j({
+    return T`<div part="base" class=${j({
       container: !0,
       "container--empty": o,
       "container--loading": this.loading,
       "container--resizing": this.resizable && this.isResizeActive
-    })}
-      style=${je({
+    })} style=${je({
       "--easing": this.easeCSSVariable
-    })}
-      data-empty-label=${this.localize.term("emptyImage")}
-      @click=${this.startResizing}
-      @keydown=${this.handleKeyDown}
-    >
-      <cx-resize-observer @cx-resize=${this.handleResize}>
-        <div
-          part="highlighter"
-          tabindex=${De(this.highlighterTabindex)}
-          role=${this.highlighterRole}
-          aria-label=${t}
-          aria-roledescription=${this.localize.term("image")}
-          class=${j(o ? {} : this.getHighlighterClass())}
-          @click=${this.handleClickAction}
-          @mouseenter=${this.handleMouseEnter}
-          @mouseleave=${this.handleMouseLeave}
-          @blur=${this.handleBlur}
-        >
-          ${V(
+    })} data-empty-label=${this.localize.term("emptyImage")} @click=${this.startResizing} @keydown=${this.handleKeyDown}><cx-resize-observer @cx-resize=${this.handleResize}><div part="highlighter" tabindex=${De(this.highlighterTabindex)} role=${this.highlighterRole} aria-label=${t} aria-roledescription=${this.localize.term("image")} class=${j(o ? {} : this.getHighlighterClass())} @click=${this.handleClickAction} @mouseenter=${this.handleMouseEnter} @mouseleave=${this.handleMouseLeave} @blur=${this.handleBlur}>${V(
       o,
       () => Le,
       () => V(
         this.effect === Y.Jump || this.effect === Y.Zoom,
-        () => T`
-                  <cx-popup
-                    class="popup-container"
-                    strategy="absolute"
-                    active
-                    placement="center"
-                    sync="both"
-                  >
-                    ${this.renderContent()}
-                  </cx-popup>
-                `,
+        () => T`<cx-popup class="popup-container" strategy="absolute" active placement="center" sync="both">${this.renderContent()}</cx-popup>`,
         () => this.renderContent()
       )
-    )}
-          <div class="zoom-image-container">
-            ${V(
+    )}<div class="zoom-image-container">${V(
       e,
-      () => T`<img
-                  part="zoom-image"
-                  class=${j({
+      () => T`<img part="zoom-image" class=${j({
         "zoom-image": !0,
         "zoom-image--hidden": !this.isZoomed
-      })}
-                  src=${this.currentSrc || this.placeholder}
-                  alt=""
-                  aria-hidden="true"
-                  decoding="async"
-                  draggable="false"
-                  crossorigin="anonymous"
-                />`
-    )}
-          </div>
-          ${V(
+      })} src=${this.currentSrc || this.placeholder} alt="" aria-hidden="true" decoding="async" draggable="false" crossorigin="anonymous">`
+    )}</div>${V(
       this.skeleton && !this.isLoaded && !this.isError || this.loading,
-      () => T`
-                <slot name="skeleton" part="skeleton">
-                  <div
-                    class=${j({
+      () => T`<slot name="skeleton" part="skeleton"><div class=${j({
         skeleton: !0
-      })}
-                  >
-                    <cx-skeleton effect="sheen"></cx-skeleton>
-                  </div>
-                </slot>
-              `
+      })}><cx-skeleton effect="sheen"></cx-skeleton></div></slot>`
     )}
-          ${V(this.isError && this.fallback, () => T`
-              <slot name="fallback" part="fallback">
-                <cx-space
-                  class=${j({ fallback: !0 })}
-                  direction="column"
-                  align-items="center"
-                  justify-content="center"
-                >
-                  <cx-icon name="hide_image" part="fallback-icon"> </cx-icon>
-                </cx-space>
-              </slot>
-            `)}
-        </div>
-      </cx-resize-observer>
-      ${V(this.resizable && this.isResizeActive, () => this.renderResizer())}
-    </div>`;
+          ${V(this.isError && this.fallback, () => T`<slot name="fallback" part="fallback"><cx-space class=${j({ fallback: !0 })} direction="column" align-items="center" justify-content="center"><cx-icon name="hide_image" part="fallback-icon"> </cx-icon></cx-space></slot>`)}</div></cx-resize-observer>${V(this.resizable && this.isResizeActive, () => this.renderResizer())}</div>`;
   }
 };
 l.styles = [We, _e, Qe];

package/library/chunks/{index.BkoLctE9.js → index.C9khsiad.js}

@@ -1,20 +1,20 @@
-import { G as A, r as T, C as b, b as H, L as X, T as Y, R as Z, m as I, aw as j, a as N, f as k, x as y, H as J, ak as x, e as q, h as V, j as z, E as B } from "./am-chart.oZVBmpnn.js";
-import { ay as it, aJ as rt, B as ot, aT as nt, aS as ht, aE as lt, al as ct, az as gt, ae as dt, a2 as pt, aM as mt, ag as ft, aN as ut, aA as yt, aB as _t, aO as xt, aC as Ct, an as wt, aL as Pt, M as kt, aP as bt, P as Nt, aK as Lt, aD as Dt, w as Tt, a8 as vt, aF as Mt, J as Rt, S as Gt, n as St, aR as Ot, D as Wt, aG as Ft, aI as Ht, aH as It, d as At, aQ as Vt, q as zt, ax as Bt } from "./am-chart.oZVBmpnn.js";
-import { B as Xt, E as Yt, L as Zt, M as jt, S as Jt } from "./SpriteResizer.-qJDgug8.js";
-import { L as K } from "./ProgressPie.4mPA6xqm.js";
-import { C as Kt, a as Qt, N as Ut, O as $t, P as te } from "./ProgressPie.4mPA6xqm.js";
-import { C as se } from "./Circle.tOnnO-F-.js";
-import { P as ie } from "./Polygon.Dr-GV2hn.js";
-import { a as oe, Z as ne } from "./ZoomTools.cgwuIB0e.js";
-import { L as Q } from "./LinearGradient.CxfXxvMw.js";
-import { E as le } from "./EditableLabel.DPmicdjK.js";
-import { P as ge } from "./Picture.BNASYM-P.js";
-import { R as pe, a as me } from "./RadialLabel.HfsGiN4x.js";
-import { T as ue } from "./Triangle.BECgi7mc.js";
-import { S as _e } from "./Scrollbar.Bgg-RhjP.js";
-import { S as Ce } from "./Slider.FKJwoPq2.js";
-import { S as Pe } from "./Slice.Dm56LTKj.js";
-import { G as E } from "./Gradient.BrDBLm8v.js";
+import { G as A, r as T, C as b, b as H, L as X, T as Y, R as Z, m as I, aw as j, a as N, f as k, x as y, H as J, ak as x, e as q, h as V, j as z, E as B } from "./am-chart.H2jnOzFc.js";
+import { ay as it, aJ as rt, B as ot, aT as nt, aS as ht, aE as lt, al as ct, az as gt, ae as dt, a2 as pt, aM as mt, ag as ft, aN as ut, aA as yt, aB as _t, aO as xt, aC as Ct, an as wt, aL as Pt, M as kt, aP as bt, P as Nt, aK as Lt, aD as Dt, w as Tt, a8 as vt, aF as Mt, J as Rt, S as Gt, n as St, aR as Ot, D as Wt, aG as Ft, aI as Ht, aH as It, d as At, aQ as Vt, q as zt, ax as Bt } from "./am-chart.H2jnOzFc.js";
+import { B as Xt, E as Yt, L as Zt, M as jt, S as Jt } from "./SpriteResizer.DFnmcy0h.js";
+import { L as K } from "./ProgressPie.DlCwXN17.js";
+import { C as Kt, a as Qt, N as Ut, O as $t, P as te } from "./ProgressPie.DlCwXN17.js";
+import { C as se } from "./Circle.DBa5Ok8V.js";
+import { P as ie } from "./Polygon.BwMvXN2H.js";
+import { a as oe, Z as ne } from "./ZoomTools.D5JPehoL.js";
+import { L as Q } from "./LinearGradient.B1z9AGUt.js";
+import { E as le } from "./EditableLabel.BWeq6fgX.js";
+import { P as ge } from "./Picture.YSPC0l0Q.js";
+import { R as pe, a as me } from "./RadialLabel.DyVOf2K8.js";
+import { T as ue } from "./Triangle.BaOef7HV.js";
+import { S as _e } from "./Scrollbar.BdZVb_Z-.js";
+import { S as Ce } from "./Slider.C20No2z5.js";
+import { S as Pe } from "./Slice.DiEswWa6.js";
+import { G as E } from "./Gradient.CdcsPIru.js";
 class v extends A {
   _beforeChanged() {
     super._beforeChanged(), (this.isDirty("radius") || this.isDirty("innerRadius") || this.isDirty("spikes")) && (this._clear = !0);

package/library/chunks/{json.BjaT7cyo.js → json.zyETMOw-.js}

@@ -1,6 +1,6 @@
-import { E as d, ab as z, e as p, aL as y, y as c, T as o, az as b, f as S, P as m, bq as u, a as O, a9 as x, z as h } from "./am-chart.oZVBmpnn.js";
-import { bs as C } from "./am-chart.oZVBmpnn.js";
-import { G as k } from "./Gradient.BrDBLm8v.js";
+import { E as d, ab as z, e as p, aL as y, y as c, T as o, az as b, f as S, P as m, bq as u, a as O, a9 as x, z as h } from "./am-chart.H2jnOzFc.js";
+import { bs as C } from "./am-chart.H2jnOzFc.js";
+import { G as k } from "./Gradient.CdcsPIru.js";
 class _ extends d {
   constructor() {
     super(...arguments), this._refs = {};