@orangelogic/design-system 2.69.0 → 2.70.0

package/library/chunks/{animation.DfUHRQry.js → animation.DU8t6mrk.js}

@@ -1,7 +1,7 @@
 import { n as a, C as p } from "./lib-cortex-element.CVMmyPMC.js";
 import { c as m } from "./component.styles.DMSLciL5.js";
 import { c as y } from "./custom-element.L4WJXn1j.js";
-import { w as d } from "./watch.q1sEjPWL.js";
+import { w as d } from "./watch.BCJD77bD.js";
 import { i as b, x as u } from "./lit-element.jLBm65_O.js";
 import { r as g } from "./query-async.CTgXGyQ5.js";
 const h = b`

package/library/chunks/{button.SoX-7UYy.js → button.CAAJPQFu.js}

@@ -1,10 +1,10 @@
 import { n as i, C as v } from "./lib-cortex-element.CVMmyPMC.js";
 import { c as g } from "./component.styles.DMSLciL5.js";
 import { c as C } from "./custom-element.L4WJXn1j.js";
-import { F as x, v as w } from "./form.CO12-VK0.js";
-import { L as $ } from "./i18n.BMRLOAZR.js";
+import { F as x, v as w } from "./form.DgwYWi0O.js";
+import { L as $ } from "./i18n.C0iakJkV.js";
 import { H as S, g as O } from "./slot.j5oheLJC.js";
-import { w as m } from "./watch.q1sEjPWL.js";
+import { w as m } from "./watch.BCJD77bD.js";
 import { r as u } from "./state.CSDxrqLd.js";
 import { e as L } from "./query.BBf1UFkC.js";
 import { e as D } from "./class-map.BiVq-cVR.js";

package/library/chunks/{capitalize.WSkCXkNE.js → capitalize.CNStXZBq.js}

@@ -1,4 +1,4 @@
-import { t as i } from "./toString.CRT5zqEU.js";
+import { t as i } from "./toString.CL_lYXbK.js";
 function R(r, e, u) {
   var o = -1, f = r.length;
   e < 0 && (e = -e > f ? 0 : f + e), u = u > f ? f : u, u < 0 && (u += f), f = e > u ? 0 : u - e >>> 0, e >>>= 0;

package/library/chunks/cardinal.BCA_LB0u.js

@@ -0,0 +1,64 @@
+function s(i, t, _) {
+  i._context.bezierCurveTo(
+    i._x1 + i._k * (i._x2 - i._x0),
+    i._y1 + i._k * (i._y2 - i._y0),
+    i._x2 + i._k * (i._x1 - t),
+    i._y2 + i._k * (i._y1 - _),
+    i._x2,
+    i._y2
+  );
+}
+function e(i, t) {
+  this._context = i, this._k = (1 - t) / 6;
+}
+e.prototype = {
+  areaStart: function() {
+    this._line = 0;
+  },
+  areaEnd: function() {
+    this._line = NaN;
+  },
+  lineStart: function() {
+    this._x0 = this._x1 = this._x2 = this._y0 = this._y1 = this._y2 = NaN, this._point = 0;
+  },
+  lineEnd: function() {
+    switch (this._point) {
+      case 2:
+        this._context.lineTo(this._x2, this._y2);
+        break;
+      case 3:
+        s(this, this._x1, this._y1);
+        break;
+    }
+    (this._line || this._line !== 0 && this._point === 1) && this._context.closePath(), this._line = 1 - this._line;
+  },
+  point: function(i, t) {
+    switch (i = +i, t = +t, this._point) {
+      case 0:
+        this._point = 1, this._line ? this._context.lineTo(i, t) : this._context.moveTo(i, t);
+        break;
+      case 1:
+        this._point = 2, this._x1 = i, this._y1 = t;
+        break;
+      case 2:
+        this._point = 3;
+      // falls through
+      default:
+        s(this, i, t);
+        break;
+    }
+    this._x0 = this._x1, this._x1 = this._x2, this._x2 = i, this._y0 = this._y1, this._y1 = this._y2, this._y2 = t;
+  }
+};
+const o = function i(t) {
+  function _(n) {
+    return new e(n, t);
+  }
+  return _.tension = function(n) {
+    return i(+n);
+  }, _;
+}(0);
+export {
+  o as c,
+  s as p
+};

package/library/chunks/{color-swatch-group.Dx1fbSJx.js → color-swatch-group.CKHyWM8K.js}

@@ -1,15 +1,15 @@
 import z from "../components/space.js";
-import { C as $ } from "./table.5eWm9FfN.js";
+import { C as $ } from "./table.wVHv1Xze.js";
 import { C as k } from "./typography.oDzoLbZS.js";
 import { n as h, C as F } from "./lib-cortex-element.CVMmyPMC.js";
-import { C, a as m } from "./color-swatch.B7XXHxx1.js";
+import { C, a as m } from "./color-swatch.BkpPCXd6.js";
 import { c as A } from "./component.styles.DMSLciL5.js";
-import { D as p } from "./content-builder.Bxi6k2LA.js";
+import { D as p } from "./content-builder.B4Tqoc6M.js";
 import { c as S } from "./custom-element.L4WJXn1j.js";
 import { d as T } from "./debounce.DaHuiSGU.js";
-import { L as E } from "./i18n.BMRLOAZR.js";
-import { w as x } from "./watch.q1sEjPWL.js";
-import { g as D, a as R } from "./responsive.DgQTIrna.js";
+import { L as E } from "./i18n.C0iakJkV.js";
+import { w as x } from "./watch.BCJD77bD.js";
+import { g as D, a as R } from "./responsive.DL-wBD4P.js";
 import { x as l, B as H, i as O } from "./lit-element.jLBm65_O.js";
 import { r as d } from "./state.CSDxrqLd.js";
 import { e as P } from "./query.BBf1UFkC.js";

package/library/chunks/{color-swatch.B7XXHxx1.js → color-swatch.BkpPCXd6.js}

@@ -8,8 +8,8 @@ import { c as F } from "./component.styles.DMSLciL5.js";
 import { c as n, C as h, H as $, l as z } from "./color.vLD2sNTs.js";
 import { c as O } from "./custom-element.L4WJXn1j.js";
 import { d as W } from "./debounce.DaHuiSGU.js";
-import { L as A } from "./i18n.BMRLOAZR.js";
-import { w as i } from "./watch.q1sEjPWL.js";
+import { L as A } from "./i18n.C0iakJkV.js";
+import { w as i } from "./watch.BCJD77bD.js";
 import { i as G, x as u } from "./lit-element.jLBm65_O.js";
 import { r as c } from "./state.CSDxrqLd.js";
 import { e as R } from "./query.BBf1UFkC.js";

package/library/chunks/colorPicker.C4w_vDjh.js

@@ -0,0 +1,527 @@
+import { D as L, q as i, R as m, d as s, x as c, H as A, C as h, w as g, L as R, T, B as y, G as _, b, s as G, c as S, a as x, f as p, bx as D, by as P } from "./am-chart.oZVBmpnn.js";
+import { L as k } from "./LinearGradient.CxfXxvMw.js";
+import { C as M } from "./Circle.tOnnO-F-.js";
+import { E as H } from "./EditableLabel.DPmicdjK.js";
+import { S as B } from "./Slider.FKJwoPq2.js";
+class O extends L {
+  setupDefaultRules() {
+    super.setupDefaultRules();
+    const t = this.rule.bind(this);
+    t("ColorPickerButton").setAll({
+      colorOpacity: 1,
+      width: 35,
+      height: 35,
+      marginRight: 0,
+      cursorOverStyle: "pointer"
+    }), t("Graphics", ["colorpickerbutton", "icon"]).setAll({
+      svgPath: "M 1 14 L 3 16 L 5 14 L 7 14 L 15 6 A 0.6 0.6 90 0 0 11 2 L 3 10 L 3 12 L 1 14 M 7 4 L 13 10",
+      forceInactive: !0,
+      centerX: i,
+      centerY: i,
+      x: i,
+      y: i,
+      strokeOpacity: 0.5
+    }), t("Graphics", ["colorpickerbutton", "nocolor"]).setAll({
+      x: i,
+      y: i,
+      centerX: i,
+      centerY: i,
+      forceInactive: !0,
+      svgPath: "M 5 5 L 25 25 M 25 5 L 5 25"
+    }), t("ColorPicker").setAll({
+      exportable: !1,
+      paddingBottom: 20,
+      paddingTop: 20,
+      paddingLeft: 20,
+      paddingRight: 20,
+      width: 250,
+      position: "absolute",
+      x: i,
+      y: i,
+      centerX: i,
+      centerY: i,
+      background: m.new(this._root, {
+        strokeOpacity: 1,
+        fillOpacity: 1,
+        shadowBlur: 8,
+        shadowColor: s(0),
+        shadowOpacity: 0.3,
+        shadowOffsetX: 2,
+        shadowOffsetY: 2,
+        fill: s(16777215)
+      })
+    }), t("ColorPicker").states.create("hidden", {
+      stateAnimationDuration: 200,
+      opacity: 0,
+      visible: !1
+    }), t("ColorPicker").states.create("default", {
+      stateAnimationDuration: 300
+    }), t("Container", ["colorpicker", "lastcolors"]).setAll({
+      layout: this._root.horizontalLayout,
+      width: c
+    }), t("Circle", ["colorpicker", "circle", "target"]).setAll({
+      radius: 5,
+      fill: s(16777215),
+      stroke: s(16777215),
+      fillOpacity: 1,
+      strokeOpacity: 1,
+      strokeWidth: 2,
+      shadowColor: s(0),
+      shadowOpacity: 1,
+      shadowBlur: 5,
+      shadowOffsetX: 0,
+      shadowOffsetY: 0
+    }), t("Slider", ["colorpicker", "gradient"]).setAll({
+      marginLeft: 15,
+      marginRight: 0
+    }), t("RoundedRectangle", ["colorpicker", "gradient", "scrollbar", "main", "background"]).setAll({
+      fillGradient: k.new(this._root, {
+        rotation: 90,
+        stops: [
+          { color: s(16711680), offset: 0 },
+          { color: s(16776960), offset: 0.17 },
+          { color: s(65280), offset: 0.34 },
+          { color: s(65535), offset: 0.51 },
+          { color: s(255), offset: 0.68 },
+          { color: s(16711935), offset: 0.85 },
+          { color: s(16711680), offset: 1 }
+        ]
+      })
+    }), t("Button", ["colorpicker", "resize"]).setAll({
+      tooltipY: 0,
+      width: 22,
+      height: 22,
+      paddingTop: 0,
+      paddingBottom: 0,
+      paddingLeft: 0,
+      paddingRight: 0
+    }), t("RoundedRectangle", ["colorpicker", "resize", "background"]).setAll({
+      fillOpacity: 1,
+      strokeOpacity: 1,
+      strokeWidth: 2,
+      shadowColor: s(0),
+      shadowOpacity: 1,
+      shadowBlur: 5,
+      shadowOffsetX: 0,
+      shadowOffsetY: 0
+    }), t("Graphics", ["colorpicker", "resize", "button", "icon"]).setAll({
+      forceHidden: !0
+    }), t("Slider", ["colorpicker", "opacity"]).setAll({
+      centerY: i,
+      y: i,
+      width: c
+    }), t("RoundedRectangle", ["colorpicker", "main", "opacity", "background"]).setAll({
+      strokeWidth: 1,
+      strokeOpacity: 0.5
+    }), t("EditableLabel", ["colorpicker", "input"]).setAll({
+      text: "Text",
+      width: c,
+      height: 30,
+      marginLeft: 5,
+      fontSize: "13px",
+      fontFamily: "monospace",
+      oversizedBehavior: "none",
+      textAlign: "center",
+      minWidth: 50
+    }), t("EditableLabel", ["colorpicker", "color", "input"]).setAll({
+      maxChars: 7
+    }), t("RoundedRectangle", ["colorpicker", "background", "input"]).setAll({
+      strokeWidth: 1,
+      cornerRadiusBL: 4,
+      cornerRadiusBR: 4,
+      cornerRadiusTL: 4,
+      cornerRadiusTR: 4,
+      strokeOpacity: 0.25,
+      fillOpacity: 0
+    }), t("Button", ["colorpicker", "pickertool"]).setAll({
+      width: 30,
+      height: 30,
+      marginTop: 0,
+      marginBottom: 0,
+      marginLeft: 0,
+      marginRight: 0,
+      tooltipX: A(90)
+    }), t("Button", ["colorpicker", "pickertool", "nocolor"]).setAll({
+      tooltipText: "No color",
+      marginLeft: 5
+    }), t("Graphics", ["colorpicker", "icon", "nocolor"]).setAll({
+      svgPath: "M 0 0 L 14 14 M 14 0 L 0 14",
+      centerX: i,
+      centerY: i,
+      x: i,
+      y: i
+    }), t("Button", ["colorpicker", "picker"]).setAll({
+      tooltipText: "Pick color from screen"
+    }), t("Graphics", ["picker", "icon"]).setAll({
+      centerX: i,
+      centerY: i,
+      x: i,
+      y: i,
+      svgPath: "M 1 14 L 3 16 L 5 14 L 7 14 L 15 6 A 0.6 0.6 90 0 0 11 2 L 3 10 L 3 12 L 1 14 M 7 4 L 13 10"
+    }), t("Button", ["colorpicker", "button"]).setAll({
+      height: void 0,
+      paddingTop: 1,
+      paddingBottom: 1,
+      width: i
+    }), t("Button", ["colorpicker", "button", "ok"]).setAll({
+      marginLeft: 5
+    }), t("Label", ["colorpicker", "cancel"]).setAll({
+      text: "Cancel",
+      x: i,
+      centerX: i
+    }), t("Label", ["colorpicker", "ok"]).setAll({
+      text: "OK",
+      x: i,
+      centerX: i
+    }), t("Tooltip", ["colorpicker"]).setAll({
+      getFillFromSprite: !1,
+      autoTextColor: !1,
+      paddingBottom: 5,
+      paddingTop: 5,
+      paddingLeft: 7,
+      paddingRight: 7
+    }), t("PointedRectangle", ["colorpicker", "tooltip", "background"]).setAll({
+      fill: s(0),
+      fillOpacity: 0.9,
+      stroke: s(16777215),
+      strokeOpacity: 1
+    }), t("Label", ["colorpicker", "tooltip"]).setAll({
+      fontSize: "12px",
+      fill: s(16777215)
+    });
+  }
+}
+class v extends h {
+  constructor() {
+    super(...arguments), this._clickOverlay = this.children.push(g.new(this._root, {
+      position: "absolute",
+      fillOpacity: 0,
+      interactive: !0,
+      isMeasured: !1,
+      fill: s(0),
+      forceHidden: !0
+    })), this.rectangles = new R(T.new({}), () => m._new(this._root, {}, [this.rectangles.template])), this.gradientsContainer = this.children.push(h.new(this._root, {
+      themeTagsSelf: ["gradientscontainer"],
+      width: c,
+      layout: this._root.horizontalLayout
+    })), this.colorGradientsContainer = this.gradientsContainer.children.push(h.new(this._root, {
+      width: c,
+      layer: 0
+    })), this.colorRectangle = this.colorGradientsContainer.children.push(g.new(this._root, {
+      crisp: !0,
+      themeTags: ["colorrectangle"],
+      width: c,
+      height: c,
+      strokeWidth: 1
+    })), this.colorRectangleWhiteOverlay = this.colorGradientsContainer.children.push(g.new(this._root, {
+      crisp: !0,
+      forceInactive: !0,
+      width: c,
+      height: c
+    })), this.colorRectangleBlackOverlay = this.colorGradientsContainer.children.push(g.new(this._root, {
+      crisp: !0,
+      forceInactive: !0,
+      width: c,
+      height: c
+    })), this.slider = this.gradientsContainer.children.push(B.new(this._root, {
+      orientation: "vertical",
+      themeTags: ["gradient"]
+    })), this.inputContainer = this.children.push(h.new(this._root, {
+      marginTop: 10,
+      layout: this._root.horizontalLayout,
+      width: c
+    })), this.pickerButton = this.inputContainer.children.push(y.new(this._root, {
+      themeTags: ["picker", "pickertool"],
+      toggleKey: "active",
+      icon: _.new(this._root, {
+        themeTags: ["icon"]
+      })
+    })), this.noColorButton = this.inputContainer.children.push(y.new(this._root, {
+      themeTags: ["nocolor", "pickertool"],
+      icon: _.new(this._root, {
+        themeTags: ["icon"]
+      })
+    })), this.colorInput = this.inputContainer.children.push(H.new(this._root, {
+      themeTags: ["input", "color"]
+    })), this.opacityContainer = this.children.push(h.new(this._root, {
+      width: c,
+      marginTop: 10,
+      layout: this._root.horizontalLayout
+    })), this.opacitySlider = this.opacityContainer.children.push(B.new(this._root, {
+      themeTags: ["opacity"],
+      orientation: "horizontal"
+    })), this.targetCircle = this.colorGradientsContainer.children.push(M.new(this._root, {
+      themeTags: ["circle", "target"],
+      isMeasured: !1,
+      forceInactive: !0,
+      position: "absolute",
+      layer: 30
+    })), this.buttonsContainer = this.children.push(h.new(this._root, {
+      marginTop: 10,
+      layout: this._root.horizontalLayout,
+      width: c
+    })), this.cancelButton = this.buttonsContainer.children.push(y.new(this._root, {
+      themeTags: ["cancel"],
+      label: b.new(this._root, {})
+    })), this.okButton = this.buttonsContainer.children.push(y.new(this._root, {
+      themeTags: ["ok"],
+      label: b.new(this._root, {})
+    })), this._isColorDown = !1, this._isPicking = !1, this._isEditing = !1;
+  }
+  /**
+   * @ignore
+   */
+  _afterNew() {
+    this._defaultThemes.push(O.new(this._root)), this.addTag("colorpicker"), super._afterNew(), this.set("tooltip", this._root.systemTooltip), this.cancelButton.events.on("click", () => {
+      this.cancel();
+    }), this.okButton.events.on("click", () => {
+      this.set("colorButton", void 0), this.events.dispatch("colorchanged", {
+        type: "colorchanged",
+        target: this,
+        color: this.get("color"),
+        colorOpacity: this.get("colorOpacity")
+      });
+    });
+    const t = this.root.container;
+    t.events.on("boundschanged", () => {
+      const o = t.width(), e = t.height();
+      this._clickOverlay.setAll({
+        width: o,
+        height: e,
+        x: 0,
+        y: 0
+      });
+    }), this._clickOverlay.events.on("click", () => {
+      !this._isPicking && !this._isEditing ? this.cancel() : this.pickerButton.set("active", !1);
+    }), this.set("layout", this._root.verticalLayout), this.noColorButton.events.on("click", () => {
+      this.set("color", void 0);
+      const o = this.get("colorButton");
+      o && o.setAll({
+        color: void 0,
+        colorOpacity: 1
+      }), this.events.dispatch("colorchanged", {
+        type: "colorchanged",
+        target: this,
+        color: void 0,
+        colorOpacity: 1
+      }), this.set("colorButton", void 0);
+    }), this.colorInput.on("text", (o) => {
+      if (o) {
+        o = o.replace(/[^abcdef0-9#]/ig, ""), o.substring(0, 1) !== "#" && (o = "#" + o);
+        try {
+          this.set("color", s(o));
+        } catch {
+          return;
+        }
+        this.colorInput.set("text", o);
+      }
+    }), this.pickerButton.on("active", (o) => {
+      this._isPicking = !!o, this.set("forceInactive", o);
+    }), G("keyboardevents") && this._disposers.push(S(document, "keyup", (o) => {
+      o.key === "Escape" && this.set("colorButton", void 0);
+    })), this.gradientsContainer.events.on("boundschanged", () => {
+      const o = Math.floor(this.colorGradientsContainer.width());
+      this.colorGradientsContainer.setAll({ width: o, height: o }), this.slider.set("height", o);
+    }), this.targetCircle.setAll({
+      x: this.colorRectangle.width(),
+      y: 0
+    }), this.targetCircle.adapters.add("x", (o) => {
+      if (x(o)) {
+        const e = this.colorRectangle.width();
+        return Math.min(e, Math.max(0, o));
+      }
+    }), this.targetCircle.adapters.add("y", (o) => {
+      if (x(o)) {
+        const e = this.colorRectangle.height();
+        return Math.min(e, Math.max(0, o));
+      }
+    }), this.slider.on("start", () => {
+      this.set("hue", this.slider.get("start", 0));
+    });
+    const r = this.slider.get("background");
+    r && r.set("layer", 0), this.opacitySlider.on("start", () => {
+      this.set("colorOpacity", this.opacitySlider.get("start", 1));
+    });
+    const a = this.opacitySlider.get("background");
+    a && a.set("layer", 0), this.colorRectangle.events.on("pointerdown", (o) => {
+      this._isColorDown = !0, this._handleTargetMove(o), this.set("draggable", !1), this.dragStop(o);
+    }), this.colorRectangle.events.on("globalpointermove", (o) => {
+      if (this._isColorDown && this._handleTargetMove(o), this._isPicking) {
+        const e = this._root.container._display, l = e.getLayer().context, n = e._renderer.resolution, d = l.getImageData(Math.floor(o.point.x * n), Math.floor(o.point.y * n), 1, 1).data, f = p.fromRGB(d[0], d[1], d[2]);
+        this.set("color", f);
+      }
+    }), this.colorRectangle.events.on("globalpointerup", (o) => {
+      this.set("draggable", !0), this.dragStop(o), this._isColorDown = !1;
+    }), this.colorInput.on("active", (o) => {
+      this._isEditing = !!o;
+    });
+  }
+  /**
+   * @ignore
+   */
+  _updateChildren() {
+    var t, r, a, o;
+    if (super._updateChildren(), this.isDirty("colorButton")) {
+      this.pickerButton.set("active", !1);
+      const e = this.get("colorButton");
+      let l = !0;
+      if (e) {
+        this.opacityContainer.set("forceHidden", e.get("disableOpacity")), this._previousColor = e.get("color", e.getPrivate("color")), this._previousOpacity = e.get("colorOpacity");
+        const n = this.parent;
+        n && (n.children.moveValue(this._clickOverlay), n.children.moveValue(this)), l = !1, this.show(), this.set("color", e.get("color", e.getPrivate("color"))), this.set("colorOpacity", e.get("colorOpacity") || 1);
+      } else
+        this.hide();
+      this._clickOverlay.set("forceHidden", l);
+    }
+    if (this.isDirty("hue") && (this._handleDirtyHue(), this._updateColor()), this.isDirty("colorOpacity")) {
+      const e = this.opacitySlider, l = this.get("colorOpacity", 1);
+      e.startGrip.set("tooltipText", "opacity:" + Math.round(l * 100) + "%"), e.startGrip.isDragging() ? e.startGrip.hover() : (e.set("start", l), e.markDirtyKey("start"));
+      const n = this.get("colorButton");
+      n && n.set("colorOpacity", l), this._updateOpacitySliderGrip();
+    }
+    if (this.isDirty("color")) {
+      const e = this.get("color"), l = this._prevColor;
+      let n = !1;
+      if (e && l && e.toCSSHex() === l.toCSSHex() && (n = !0), !n) {
+        if (e) {
+          if (this.targetCircle.show(), !this._isColorDown) {
+            const u = D(e.toHSL());
+            this.setRaw("hue", u.h), this.slider.startGrip.isDragging() || this.slider.set("start", u.h), this.targetCircle.setAll({
+              x: this.colorRectangle.width() * u.s,
+              y: this.colorRectangle.height() * (1 - u.v)
+            });
+          }
+          this.targetCircle.set("fill", e), this._handleDirtyHue(), this.colorInput.set("text", e.toCSSHex().substring(1, 7));
+        } else
+          this.targetCircle.hide(), this.colorInput.set("text", "");
+        this._prevColor = e;
+        const d = this.opacitySlider.get("background");
+        d && d.set("fillGradient", k.new(this._root, {
+          rotation: 0,
+          stops: [
+            { color: e, opacity: 0 },
+            { color: e, opacity: 1 }
+          ]
+        }));
+        const f = this.get("colorButton");
+        f && f.set("color", e), this._updateOpacitySliderGrip();
+      }
+    }
+    if (this.isDirty("backgroundColor")) {
+      const e = this.get("backgroundColor", s(16777215));
+      this.colorRectangle.setAll({
+        stroke: e
+      }), this.colorRectangleBlackOverlay.setAll({
+        stroke: e
+      }), this.colorRectangleWhiteOverlay.setAll({
+        stroke: e
+      }), (t = this.pickerButton.get("background")) === null || t === void 0 || t.states.applyAnimate("default", 0), (r = this.noColorButton.get("background")) === null || r === void 0 || r.states.applyAnimate("default", 0), (a = this.cancelButton.get("background")) === null || a === void 0 || a.states.applyAnimate("default", 0), (o = this.okButton.get("background")) === null || o === void 0 || o.states.applyAnimate("default", 0);
+    }
+  }
+  /**
+   * @ignore
+   */
+  _handleDirtyHue() {
+    var t, r, a;
+    const o = this.slider.get("start", 0), e = p.fromHSL(o, 1, 0.5), l = this.slider.startGrip;
+    this.colorRectangle.setAll({
+      fill: e,
+      stroke: this.get("backgroundColor", s(16777215))
+    });
+    const n = l.get("background");
+    n && (n.set("fill", e), (t = n.states.lookup("default")) === null || t === void 0 || t.set("fill", e), (r = n.states.lookup("hover")) === null || r === void 0 || r.set("fill", e), (a = n.states.lookup("down")) === null || a === void 0 || a.set("fill", e)), this.colorRectangleWhiteOverlay.setAll({
+      fillGradient: k.new(this._root, {
+        rotation: 0,
+        stops: [
+          { color: s(16777215), opacity: 1, offset: 0 },
+          { color: s(16777215), opacity: 0, offset: 1 }
+        ]
+      })
+    }), this.colorRectangleBlackOverlay.setAll({
+      fillGradient: k.new(this._root, {
+        stops: [
+          { color: s(0), opacity: 0, offset: 0 },
+          { color: s(0), opacity: 1, offset: 1 }
+        ]
+      })
+    });
+  }
+  /**
+   * @ignore
+   */
+  _handleTargetMove(t) {
+    const r = this.colorGradientsContainer.toLocal({ x: t.point.x, y: t.point.y });
+    this.targetCircle.setAll({
+      x: r.x,
+      y: r.y
+    }), this._updateColor();
+  }
+  /**
+   * @ignore
+   */
+  _updateColor() {
+    const t = this.targetCircle.x(), r = this.targetCircle.y(), a = this.colorRectangle.height(), o = this.colorRectangle.width(), e = this.slider.get("start", 0);
+    let l = P({ h: e, s: t / o, v: 1 - r / a });
+    this.set("color", p.fromHSL(l.h, l.s, l.l));
+  }
+  /**
+   * @ignore
+   */
+  _updateOpacitySliderGrip() {
+    var t, r, a;
+    const o = this.opacitySlider.startGrip.get("background");
+    if (o) {
+      const e = p.interpolate(this.get("colorOpacity", 1), this.get("backgroundColor", s(16777215)), this.get("color", s(16777215)));
+      o.set("fill", e), (t = o.states.lookup("default")) === null || t === void 0 || t.set("fill", e), (r = o.states.lookup("hover")) === null || r === void 0 || r.set("fill", e), (a = o.states.lookup("down")) === null || a === void 0 || a.set("fill", e);
+    }
+  }
+  /**
+   * Cancels color selection and restores previous color.
+   */
+  cancel() {
+    var t;
+    (t = this.get("colorButton")) === null || t === void 0 || t.setAll({
+      color: this._previousColor,
+      colorOpacity: this._previousOpacity
+    }), this._isEditing = !1, this._isPicking = !1, this.set("color", this._previousColor), this.set("colorButton", void 0);
+  }
+}
+v.className = "ColorPicker";
+v.classNames = h.classNames.concat([v.className]);
+class w extends h {
+  constructor() {
+    super(...arguments), this.noColorGraphics = this.children.push(_.new(this._root, {
+      themeTags: ["nocolor"]
+    })), this.icon = this.children.push(_.new(this._root, {
+      themeTags: ["icon"]
+    }));
+  }
+  _afterNew() {
+    this._defaultThemes.push(O.new(this._root)), this.addTag("colorpickerbutton"), super._afterNew(), this.set("background", m.new(this._root, {
+      themeTags: ["background"]
+    }));
+  }
+  _changed() {
+    if (super._changed(), this.isDirty("color") || this.isPrivateDirty("color") || this.isDirty("colorOpacity") || this.isDirty("backgroundColor")) {
+      let t = this.get("color", this.getPrivate("color")), r = this.get("colorOpacity", 1);
+      t ? this.noColorGraphics.hide() : this.noColorGraphics.show();
+      const a = this.get("backgroundColor", s(16777215));
+      t || (t = a);
+      let o = t, e = -0.1;
+      a.toHSL().l < 0.5 && (e = -e), o = p.lighten(t, e), this.noColorGraphics.set("stroke", o);
+      const l = this.get("background");
+      l && l.setAll({
+        fill: t,
+        stroke: o,
+        fillOpacity: r,
+        strokeOpacity: Math.max(0.2, r)
+      }), this.icon.set("stroke", p.alternative(o, this._root.interfaceColors.get("alternativeText"), this._root.interfaceColors.get("text")));
+    }
+  }
+}
+w.className = "ColorPickerButton";
+w.classNames = h.classNames.concat([w.className]);
+export {
+  v as ColorPicker,
+  w as ColorPickerButton
+};

package/library/chunks/{confirm-popover.327ATuQH.js → confirm-popover.ZD74yDWw.js}

@@ -1,11 +1,11 @@
-import { C as _ } from "./button.SoX-7UYy.js";
-import { C as u, D as h } from "./dialog.eN3RUbwx.js";
+import { C as _ } from "./button.CAAJPQFu.js";
+import { C as u, D as h } from "./dialog.qSV5AjOE.js";
 import g from "../components/dropdown.js";
 import { C as x } from "./typography.oDzoLbZS.js";
 import { n as e, C as b } from "./lib-cortex-element.CVMmyPMC.js";
 import { c as y } from "./component.styles.DMSLciL5.js";
 import { c as w } from "./custom-element.L4WJXn1j.js";
-import { L as $ } from "./i18n.BMRLOAZR.js";
+import { L as $ } from "./i18n.C0iakJkV.js";
 import { i as z, x as d } from "./lit-element.jLBm65_O.js";
 import { e as m } from "./query.BBf1UFkC.js";
 import { e as a } from "./class-map.BiVq-cVR.js";