@pushengineering/umg-web-components 2.0.0

package/dist/node_modules/.pnpm/lit-html@3.1.2/node_modules/lit-html/lit-html.js

@@ -0,0 +1,259 @@
+/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+const y = globalThis, S = y.trustedTypes, I = S ? S.createPolicy("lit-html", { createHTML: (h) => h }) : void 0, L = "$lit$", p = `lit$${(Math.random() + "").slice(9)}$`, W = "?" + p, z = `<${W}>`, v = document, x = () => v.createComment(""), H = (h) => h === null || typeof h != "object" && typeof h != "function", k = Array.isArray, Z = (h) => k(h) || typeof (h == null ? void 0 : h[Symbol.iterator]) == "function", w = `[ 	
+\f\r]`, m = /<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g, B = /-->/g, P = />/g, u = RegExp(`>|${w}(?:([^\\s"'>=/]+)(${w}*=${w}*(?:[^ 	
+\f\r"'\`<>=]|("|')|))|$)`, "g"), R = /'/g, U = /"/g, D = /^(?:script|style|textarea|title)$/i, V = (h) => (t, ...e) => ({ _$litType$: h, strings: t, values: e }), X = V(1), Y = V(2), N = Symbol.for("lit-noChange"), A = Symbol.for("lit-nothing"), j = /* @__PURE__ */ new WeakMap(), g = v.createTreeWalker(v, 129);
+function O(h, t) {
+  if (!Array.isArray(h) || !h.hasOwnProperty("raw"))
+    throw Error("invalid template strings array");
+  return I !== void 0 ? I.createHTML(t) : t;
+}
+const q = (h, t) => {
+  const e = h.length - 1, s = [];
+  let i, o = t === 2 ? "<svg>" : "", n = m;
+  for (let a = 0; a < e; a++) {
+    const r = h[a];
+    let $, _, l = -1, c = 0;
+    for (; c < r.length && (n.lastIndex = c, _ = n.exec(r), _ !== null); )
+      c = n.lastIndex, n === m ? _[1] === "!--" ? n = B : _[1] !== void 0 ? n = P : _[2] !== void 0 ? (D.test(_[2]) && (i = RegExp("</" + _[2], "g")), n = u) : _[3] !== void 0 && (n = u) : n === u ? _[0] === ">" ? (n = i ?? m, l = -1) : _[1] === void 0 ? l = -2 : (l = n.lastIndex - _[2].length, $ = _[1], n = _[3] === void 0 ? u : _[3] === '"' ? U : R) : n === U || n === R ? n = u : n === B || n === P ? n = m : (n = u, i = void 0);
+    const d = n === u && h[a + 1].startsWith("/>") ? " " : "";
+    o += n === m ? r + z : l >= 0 ? (s.push($), r.slice(0, l) + L + r.slice(l) + p + d) : r + p + (l === -2 ? a : d);
+  }
+  return [O(h, o + (h[e] || "<?>") + (t === 2 ? "</svg>" : "")), s];
+};
+class T {
+  constructor({ strings: t, _$litType$: e }, s) {
+    let i;
+    this.parts = [];
+    let o = 0, n = 0;
+    const a = t.length - 1, r = this.parts, [$, _] = q(t, e);
+    if (this.el = T.createElement($, s), g.currentNode = this.el.content, e === 2) {
+      const l = this.el.content.firstChild;
+      l.replaceWith(...l.childNodes);
+    }
+    for (; (i = g.nextNode()) !== null && r.length < a; ) {
+      if (i.nodeType === 1) {
+        if (i.hasAttributes())
+          for (const l of i.getAttributeNames())
+            if (l.endsWith(L)) {
+              const c = _[n++], d = i.getAttribute(l).split(p), C = /([.?@])?(.*)/.exec(c);
+              r.push({ type: 1, index: o, name: C[2], strings: d, ctor: C[1] === "." ? G : C[1] === "?" ? J : C[1] === "@" ? K : M }), i.removeAttribute(l);
+            } else
+              l.startsWith(p) && (r.push({ type: 6, index: o }), i.removeAttribute(l));
+        if (D.test(i.tagName)) {
+          const l = i.textContent.split(p), c = l.length - 1;
+          if (c > 0) {
+            i.textContent = S ? S.emptyScript : "";
+            for (let d = 0; d < c; d++)
+              i.append(l[d], x()), g.nextNode(), r.push({ type: 2, index: ++o });
+            i.append(l[c], x());
+          }
+        }
+      } else if (i.nodeType === 8)
+        if (i.data === W)
+          r.push({ type: 2, index: o });
+        else {
+          let l = -1;
+          for (; (l = i.data.indexOf(p, l + 1)) !== -1; )
+            r.push({ type: 7, index: o }), l += p.length - 1;
+        }
+      o++;
+    }
+  }
+  static createElement(t, e) {
+    const s = v.createElement("template");
+    return s.innerHTML = t, s;
+  }
+}
+function f(h, t, e = h, s) {
+  var n, a;
+  if (t === N)
+    return t;
+  let i = s !== void 0 ? (n = e._$Co) == null ? void 0 : n[s] : e._$Cl;
+  const o = H(t) ? void 0 : t._$litDirective$;
+  return (i == null ? void 0 : i.constructor) !== o && ((a = i == null ? void 0 : i._$AO) == null || a.call(i, !1), o === void 0 ? i = void 0 : (i = new o(h), i._$AT(h, e, s)), s !== void 0 ? (e._$Co ?? (e._$Co = []))[s] = i : e._$Cl = i), i !== void 0 && (t = f(h, i._$AS(h, t.values), i, s)), t;
+}
+class F {
+  constructor(t, e) {
+    this._$AV = [], this._$AN = void 0, this._$AD = t, this._$AM = e;
+  }
+  get parentNode() {
+    return this._$AM.parentNode;
+  }
+  get _$AU() {
+    return this._$AM._$AU;
+  }
+  u(t) {
+    const { el: { content: e }, parts: s } = this._$AD, i = ((t == null ? void 0 : t.creationScope) ?? v).importNode(e, !0);
+    g.currentNode = i;
+    let o = g.nextNode(), n = 0, a = 0, r = s[0];
+    for (; r !== void 0; ) {
+      if (n === r.index) {
+        let $;
+        r.type === 2 ? $ = new b(o, o.nextSibling, this, t) : r.type === 1 ? $ = new r.ctor(o, r.name, r.strings, this, t) : r.type === 6 && ($ = new Q(o, this, t)), this._$AV.push($), r = s[++a];
+      }
+      n !== (r == null ? void 0 : r.index) && (o = g.nextNode(), n++);
+    }
+    return g.currentNode = v, i;
+  }
+  p(t) {
+    let e = 0;
+    for (const s of this._$AV)
+      s !== void 0 && (s.strings !== void 0 ? (s._$AI(t, s, e), e += s.strings.length - 2) : s._$AI(t[e])), e++;
+  }
+}
+class b {
+  get _$AU() {
+    var t;
+    return ((t = this._$AM) == null ? void 0 : t._$AU) ?? this._$Cv;
+  }
+  constructor(t, e, s, i) {
+    this.type = 2, this._$AH = A, this._$AN = void 0, this._$AA = t, this._$AB = e, this._$AM = s, this.options = i, this._$Cv = (i == null ? void 0 : i.isConnected) ?? !0;
+  }
+  get parentNode() {
+    let t = this._$AA.parentNode;
+    const e = this._$AM;
+    return e !== void 0 && (t == null ? void 0 : t.nodeType) === 11 && (t = e.parentNode), t;
+  }
+  get startNode() {
+    return this._$AA;
+  }
+  get endNode() {
+    return this._$AB;
+  }
+  _$AI(t, e = this) {
+    t = f(this, t, e), H(t) ? t === A || t == null || t === "" ? (this._$AH !== A && this._$AR(), this._$AH = A) : t !== this._$AH && t !== N && this._(t) : t._$litType$ !== void 0 ? this.$(t) : t.nodeType !== void 0 ? this.T(t) : Z(t) ? this.k(t) : this._(t);
+  }
+  S(t) {
+    return this._$AA.parentNode.insertBefore(t, this._$AB);
+  }
+  T(t) {
+    this._$AH !== t && (this._$AR(), this._$AH = this.S(t));
+  }
+  _(t) {
+    this._$AH !== A && H(this._$AH) ? this._$AA.nextSibling.data = t : this.T(v.createTextNode(t)), this._$AH = t;
+  }
+  $(t) {
+    var o;
+    const { values: e, _$litType$: s } = t, i = typeof s == "number" ? this._$AC(t) : (s.el === void 0 && (s.el = T.createElement(O(s.h, s.h[0]), this.options)), s);
+    if (((o = this._$AH) == null ? void 0 : o._$AD) === i)
+      this._$AH.p(e);
+    else {
+      const n = new F(i, this), a = n.u(this.options);
+      n.p(e), this.T(a), this._$AH = n;
+    }
+  }
+  _$AC(t) {
+    let e = j.get(t.strings);
+    return e === void 0 && j.set(t.strings, e = new T(t)), e;
+  }
+  k(t) {
+    k(this._$AH) || (this._$AH = [], this._$AR());
+    const e = this._$AH;
+    let s, i = 0;
+    for (const o of t)
+      i === e.length ? e.push(s = new b(this.S(x()), this.S(x()), this, this.options)) : s = e[i], s._$AI(o), i++;
+    i < e.length && (this._$AR(s && s._$AB.nextSibling, i), e.length = i);
+  }
+  _$AR(t = this._$AA.nextSibling, e) {
+    var s;
+    for ((s = this._$AP) == null ? void 0 : s.call(this, !1, !0, e); t && t !== this._$AB; ) {
+      const i = t.nextSibling;
+      t.remove(), t = i;
+    }
+  }
+  setConnected(t) {
+    var e;
+    this._$AM === void 0 && (this._$Cv = t, (e = this._$AP) == null || e.call(this, t));
+  }
+}
+class M {
+  get tagName() {
+    return this.element.tagName;
+  }
+  get _$AU() {
+    return this._$AM._$AU;
+  }
+  constructor(t, e, s, i, o) {
+    this.type = 1, this._$AH = A, this._$AN = void 0, this.element = t, this.name = e, this._$AM = i, this.options = o, s.length > 2 || s[0] !== "" || s[1] !== "" ? (this._$AH = Array(s.length - 1).fill(new String()), this.strings = s) : this._$AH = A;
+  }
+  _$AI(t, e = this, s, i) {
+    const o = this.strings;
+    let n = !1;
+    if (o === void 0)
+      t = f(this, t, e, 0), n = !H(t) || t !== this._$AH && t !== N, n && (this._$AH = t);
+    else {
+      const a = t;
+      let r, $;
+      for (t = o[0], r = 0; r < o.length - 1; r++)
+        $ = f(this, a[s + r], e, r), $ === N && ($ = this._$AH[r]), n || (n = !H($) || $ !== this._$AH[r]), $ === A ? t = A : t !== A && (t += ($ ?? "") + o[r + 1]), this._$AH[r] = $;
+    }
+    n && !i && this.j(t);
+  }
+  j(t) {
+    t === A ? this.element.removeAttribute(this.name) : this.element.setAttribute(this.name, t ?? "");
+  }
+}
+class G extends M {
+  constructor() {
+    super(...arguments), this.type = 3;
+  }
+  j(t) {
+    this.element[this.name] = t === A ? void 0 : t;
+  }
+}
+class J extends M {
+  constructor() {
+    super(...arguments), this.type = 4;
+  }
+  j(t) {
+    this.element.toggleAttribute(this.name, !!t && t !== A);
+  }
+}
+class K extends M {
+  constructor(t, e, s, i, o) {
+    super(t, e, s, i, o), this.type = 5;
+  }
+  _$AI(t, e = this) {
+    if ((t = f(this, t, e, 0) ?? A) === N)
+      return;
+    const s = this._$AH, i = t === A && s !== A || t.capture !== s.capture || t.once !== s.once || t.passive !== s.passive, o = t !== A && (s === A || i);
+    i && this.element.removeEventListener(this.name, this, s), o && this.element.addEventListener(this.name, this, t), this._$AH = t;
+  }
+  handleEvent(t) {
+    var e;
+    typeof this._$AH == "function" ? this._$AH.call(((e = this.options) == null ? void 0 : e.host) ?? this.element, t) : this._$AH.handleEvent(t);
+  }
+}
+class Q {
+  constructor(t, e, s) {
+    this.element = t, this.type = 6, this._$AN = void 0, this._$AM = e, this.options = s;
+  }
+  get _$AU() {
+    return this._$AM._$AU;
+  }
+  _$AI(t) {
+    f(this, t);
+  }
+}
+const E = y.litHtmlPolyfillSupport;
+E == null || E(T, b), (y.litHtmlVersions ?? (y.litHtmlVersions = [])).push("3.1.2");
+const tt = (h, t, e) => {
+  const s = (e == null ? void 0 : e.renderBefore) ?? t;
+  let i = s._$litPart$;
+  if (i === void 0) {
+    const o = (e == null ? void 0 : e.renderBefore) ?? null;
+    s._$litPart$ = i = new b(t.insertBefore(x(), o), o, void 0, e ?? {});
+  }
+  return i._$AI(h), i;
+};
+export {
+  X as html,
+  N as noChange,
+  A as nothing,
+  tt as render,
+  Y as svg
+};

package/dist/packages/web-components/classes/event-manager/event-manager.js

@@ -0,0 +1,50 @@
+class n {
+  /**
+   * Creates an instance of EventManager.
+   *
+   * @constructor
+   * @param {EventTarget} target - The element or object to manage events for.
+   */
+  constructor(t) {
+    this.listeners = /* @__PURE__ */ new Map(), this.target = t;
+  }
+  /**
+   * Adds an event listener to the associated HTMLElement or target object.
+   *
+   * @param {string} eventType - The type of the event to listen for.
+   * @param {EventListenerOrEventListenerObject} handler - The callback function to execute when the event is triggered.
+   * @param {AddEventListenerOptions} [options] - An options object that specifies characteristics about the event listener.
+   * @returns {() => void} - A function to remove the added event listener.
+   */
+  addEventListener(t, e, s) {
+    const i = this.listeners.get(t) || /* @__PURE__ */ new Set();
+    return this.listeners.set(t, i), i.add(e), this.target.addEventListener(t, e, s), () => {
+      this.removeEventListener(t, e, s);
+    };
+  }
+  /**
+   * Removes an event listener from the associated HTMLElement or target object.
+   *
+   * @param {string} eventType - The type of the event for which to remove the listener.
+   * @param {EventListenerOrEventListenerObject} handler - The event listener function to remove.
+   * @param {EventListenerOptions} [options] - An options object that specifies characteristics about the event listener.
+   */
+  removeEventListener(t, e, s) {
+    const i = this.listeners.get(t);
+    i && (i.delete(e), i.size === 0 && this.listeners.delete(t)), this.target.removeEventListener(t, e, s);
+  }
+  /**
+   * Dispatches a custom event on the associated HTMLElement.
+   *
+   * @template T - The type of the event detail.
+   * @param {string} eventType - The type of the custom event.
+   * @param {T} detail - The data associated with the custom event.
+   * @param {CustomEventInit} [options] - An options object that specifies characteristics about the custom event.
+   */
+  dispatchCustomEvent(t, e, s) {
+    this.target.dispatchEvent(new CustomEvent(t, { detail: e, ...s }));
+  }
+}
+export {
+  n as EventManager
+};

package/dist/packages/web-components/classes/index.js

@@ -0,0 +1,4 @@
+import { EventManager as a } from "./event-manager/event-manager.js";
+export {
+  a as EventManager
+};

package/dist/packages/web-components/components/badge/badge.js

@@ -0,0 +1,146 @@
+import "../../../../node_modules/.pnpm/@lit_reactive-element@2.0.4/node_modules/@lit/reactive-element/reactive-element.js";
+import { html as g } from "../../../../node_modules/.pnpm/lit-html@3.1.2/node_modules/lit-html/lit-html.js";
+import { LitElement as c } from "../../../../node_modules/.pnpm/lit-element@4.0.4/node_modules/lit-element/lit-element.js";
+import { customElement as b } from "../../../../node_modules/.pnpm/@lit_reactive-element@2.0.4/node_modules/@lit/reactive-element/decorators/custom-element.js";
+import { property as r } from "../../../../node_modules/.pnpm/@lit_reactive-element@2.0.4/node_modules/@lit/reactive-element/decorators/property.js";
+import { ifDefined as p } from "../../../../node_modules/.pnpm/lit-html@3.1.2/node_modules/lit-html/directives/if-defined.js";
+import { styleMap as n } from "../../../../node_modules/.pnpm/lit-html@3.1.2/node_modules/lit-html/directives/style-map.js";
+import { classMap as h } from "../../../../node_modules/.pnpm/lit-html@3.1.2/node_modules/lit-html/directives/class-map.js";
+import "../box/box.js";
+import "../text/text.js";
+import { global as u } from "../../styles/global.js";
+import { settings as f } from "../../scripts/settings.js";
+import { mergeStyles as y } from "../../scripts/mergeStyles.js";
+import { css as x } from "../../../../node_modules/.pnpm/@lit_reactive-element@2.0.4/node_modules/@lit/reactive-element/css-tag.js";
+var v = Object.defineProperty, $ = Object.getOwnPropertyDescriptor, o = (t, a, d, i) => {
+  for (var s = i > 1 ? void 0 : i ? $(a, d) : a, m = t.length - 1, l; m >= 0; m--)
+    (l = t[m]) && (s = (i ? l(a, d, s) : l(s)) || s);
+  return i && s && v(a, d, s), s;
+};
+const { prefix: z } = f;
+let e = class extends c {
+  constructor() {
+    super(...arguments), this.size = "small", this.border = !1, this.borderRadius = "0";
+  }
+  badgeStyles() {
+    let t = {};
+    return this.colorText && (t = {
+      ...t,
+      "--um-color-badge-text": this.colorText
+    }), this.colorBg && (t = {
+      ...t,
+      "--um-color-badge-bg": this.colorBg
+    }), this.opacity !== void 0 && (t = {
+      ...t,
+      "--um-opacity-badge-bg": this.opacity
+    }), this.borderRadius !== "0" && (t = {
+      ...t,
+      "--um-border-badge-radius": "var(--um-border-radius-" + this.borderRadius + ")"
+    }), t;
+  }
+  badgeClasses() {
+    const t = {};
+    return this.border && (t["badge--border"] = !0), t["badge--size-" + this.size] = !0, t;
+  }
+  render() {
+    return g`
+            <div
+                class="badge${h(this.badgeClasses())}"
+                style="${n(this.badgeStyles())}"
+                part="badge"
+                >
+                <div class="badge__content" part="badge-content">
+                    <umg-box
+                        padding="0"
+                        colorText=${this.colorText ? this.colorText : "255,255,255"}
+                        colorBg=${this.colorBg ? this.colorBg : "0,0,0"}
+                        ?border=${this.border}
+                        borderRadius=${this.borderRadius}
+                        opacity=${p(this.opacity)}
+                        >
+                        <umg-text
+                            as="span"
+                            variant="${p(this.fontSize)}"
+                            fontWeight="${p(this.fontWeight)}"
+                            fontStyle="${p(this.fontStyle)}"
+                            lineHeight="compact"
+                            withoutMargin
+                            >
+                            <slot>Badge label</slot>
+                        </umg-text>
+                    </umg-box>
+                </div>
+            </div>
+        `;
+  }
+};
+e.styles = y([
+  u,
+  x`
+            :host {
+                display: block;
+            }
+            umg-text {
+                letter-spacing: 0.07rem
+            }
+            umg-box {
+                display: block;
+            }
+            .badge ::part(box-content) {
+                display: flex;
+                align-items: center;
+            }
+            .badge ::part(span-text) {
+                display: block;
+            }
+            .badge--size-large ::part(box-content) {
+                height: var(--um-space-48, 3rem);
+                padding: 0 var(--um-space-32, 2rem);
+            }
+            .badge--size-medium ::part(box-content) {
+                height: var(--um-space-40, 2.5rem);
+                padding: 0 var(--um-space-24, 1.5rem);
+            }
+            .badge--size-small ::part(box-content) {
+                height: var(--um-space-32, 2rem);
+                padding: 0 var(--um-space-16, 0.75rem);
+            }
+            .badge--size-slim ::part(box-content) {
+                height: var(--um-space-24, 1.5rem);
+                padding: 0 var(--um-space-12, 0.5rem);
+            }
+        `
+]);
+o([
+  r()
+], e.prototype, "size", 2);
+o([
+  r()
+], e.prototype, "colorBg", 2);
+o([
+  r()
+], e.prototype, "colorText", 2);
+o([
+  r({ type: Boolean })
+], e.prototype, "border", 2);
+o([
+  r()
+], e.prototype, "borderRadius", 2);
+o([
+  r()
+], e.prototype, "opacity", 2);
+o([
+  r()
+], e.prototype, "fontSize", 2);
+o([
+  r()
+], e.prototype, "fontWeight", 2);
+o([
+  r()
+], e.prototype, "fontStyle", 2);
+e = o([
+  b(`${z}-badge`)
+], e);
+export {
+  e as Badge
+};