@epa-wg/custom-element-dist 0.0.24 → 0.0.26

package/dist/custom-element-b7c_7Kz4.js

@@ -0,0 +1,485 @@
+const B = "http://www.w3.org/1999/XSL/Transform", q = "http://www.w3.org/1999/xhtml", ie = "http://exslt.org/common", x = (e, l) => e.getAttribute?.(l), Y = (e) => e.nodeType === 3, oe = (e) => typeof e == "string", re = (e) => e && typeof e.nodeType == "number", S = (e, l) => (e.ownerDocument || e).createTextNode(l), K = (e) => {
+  for (; e.firstChild; ) e.firstChild.remove();
+  return e;
+}, U = (e) => (e.getAttributeNames().map((l) => e.removeAttribute(l)), K(e)), Q = (e) => (e?.setAttribute("xmlns:xsl", B), e), ee = (e) => (e?.setAttribute("xmlns:xhtml", q), Q(e)), te = (e) => /^[_a-zA-Z][-_:a-zA-Z0-9]*$/.test(e), N = (e, l = "", t = document) => {
+  const s = (n) => ((r) => (l && r.append(S(t.ownerDocument || t, l)), r))((t.ownerDocument || t).createElement(n));
+  if (te(e))
+    return s(e);
+  const a = s("dce-object");
+  return a.setAttribute("dce-object-name", e), a;
+}, G = (e, l) => {
+  const t = e.ownerDocument.createElementNS(e.namespaceURI, l);
+  for (let s of e.attributes)
+    t.setAttribute(s.name, s.value);
+  for (; e.firstChild; )
+    t.append(e.firstChild);
+  return t;
+};
+function M(e) {
+  return new DOMParser().parseFromString(e, "application/xml");
+}
+function H(e) {
+  return new XMLSerializer().serializeToString(e);
+}
+function X(e, l, t, s) {
+  const a = (h) => e.ownerDocument.createElement(h), r = ((h, p, u) => (p.append(u = a(h)), u))(l, e);
+  return [...t].forEach((h) => r.append(s(h))), r;
+}
+function ce(e) {
+  return e.slot || (e.setAttribute || (e = N("span", e.textContent.replaceAll(`
+`, ""))), e.setAttribute("slot", "")), e;
+}
+function $(e, l, t) {
+  const s = typeof e;
+  if (s === "string")
+    return N(l, e, t);
+  if (s === "number")
+    return N(l, "" + e, t);
+  if (e instanceof Array) {
+    const n = N("array", "", t);
+    return e.map((r) => n.append($(r, l, t))), n;
+  }
+  if (e instanceof FormData) {
+    const n = N("form-data", "", t);
+    for (const r of e)
+      n.append($(r[1], r[0], t));
+    return n;
+  }
+  const a = N(l, "", t);
+  for (let n in e)
+    re(e[n]) || typeof e[n] == "function" || e[n] instanceof Window || (typeof e[n] != "object" && te(n) ? a.setAttribute(n, e[n]) : a.append($(e[n], n, t)));
+  return a;
+}
+function Z(e) {
+  if (C(e, "*", (l) => [...l.childNodes].filter((t) => t.nodeType === 3 && t.parentNode.localName !== "style" && t.data).forEach((t) => {
+    const s = t.data, a = s.matchAll(/{([^}]*)}/g);
+    if (a) {
+      let n = 0, r = (p) => S(t, p), h = [];
+      if ([...a].forEach((p) => {
+        p.index > n && h.push(r(p.input.substring(n, p.index)));
+        const u = e.querySelector("value-of").cloneNode();
+        u.setAttribute("select", p[1]), h.push(u), n = p.index + p[0].length;
+      }), n < s.length && h.push(r(s.substring(n, s.length))), h.length) {
+        for (let p of h)
+          l.insertBefore(p, t);
+        l.removeChild(t);
+      }
+    }
+  })), "all" in e) {
+    let l = 1;
+    for (let t of e.all)
+      t.setAttribute && !t.tagName.startsWith("xsl:") && t.setAttribute("data-dce-id", "" + l++);
+  }
+  return e;
+}
+function me(e, l = "xsl:stylesheet") {
+  if (e.tagName === l || e.documentElement?.tagName === l)
+    return Z(e);
+  const t = M(`<xsl:stylesheet version="1.0" xmlns:xsl="${B}" xmlns:xhtml="${q}" xmlns:exsl="${ie}" exclude-result-prefixes="exsl" >
+        <xsl:output method="xml" />
+        <xsl:template match="/"><dce-root xmlns="${q}"><xsl:apply-templates select="*"/></dce-root></xsl:template>
+        <xsl:template match="*[name()='template']"><xsl:apply-templates mode="sanitize" select="*|text()"/></xsl:template>
+        <xsl:template match="*"><xsl:apply-templates mode="sanitize" select="*|text()"/></xsl:template>
+        <xsl:template match="*[name()='svg']|*[name()='math']"><xsl:apply-templates mode="sanitize" select="."/></xsl:template>
+        <xsl:template mode="sanitize" match="*[count(text())=1 and count(*)=0]"><xsl:copy><xsl:apply-templates mode="sanitize" select="@*"/><xsl:value-of select="text()"></xsl:value-of></xsl:copy></xsl:template>
+        <xsl:template mode="sanitize" match="xhtml:*[count(text())=1 and count(*)=0]"><xsl:element name="{local-name()}"><xsl:apply-templates mode="sanitize" select="@*"/><xsl:value-of select="text()"></xsl:value-of></xsl:element></xsl:template>
+        <xsl:template mode="sanitize" match="*|@*"><xsl:copy><xsl:apply-templates mode="sanitize" select="*|@*|text()"/></xsl:copy></xsl:template>
+        <xsl:template mode="sanitize" match="text()[normalize-space(.) = '']"/>
+        <xsl:template mode="sanitize" match="text()"><dce-text><xsl:copy/></dce-text></xsl:template>
+        <xsl:template mode="sanitize" match="xsl:value-of|*[name()='slot']"><dce-text><xsl:copy><xsl:apply-templates mode="sanitize" select="*|@*|text()"/></xsl:copy></dce-text></xsl:template>
+        <xsl:template mode="sanitize" match="xhtml:*"><xsl:element name="{local-name()}"><xsl:apply-templates mode="sanitize" select="*|@*|text()"/></xsl:element></xsl:template>
+    </xsl:stylesheet>`), s = new XSLTProcessor(), a = ((i) => {
+    C(i, "script", (y) => y.remove());
+    const c = i.content ?? i.firstElementChild?.content ?? i.body ?? i;
+    ve.forEach((y) => C(c, y, (v) => ge(v, c)));
+    const E = i.firstElementChild?.content || i.content, g = (y) => {
+      const v = M("<xhtml/>"), D = v.importNode(y, !0);
+      return v.replaceChild(D, v.documentElement), ee(D);
+    };
+    if (E) {
+      const y = N("div");
+      return [...E.childNodes].map((v) => y.append(v.cloneNode(!0))), g(y);
+    }
+    return g(i.documentElement || i.body || i);
+  })(e), n = M(
+    `<xsl:stylesheet version="1.0"
+        xmlns:xsl="${B}"
+        xmlns:xhtml="${q}"
+        xmlns:dce="urn:schemas-epa-wg:dce"
+        xmlns:exsl="http://exslt.org/common"
+        exclude-result-prefixes="exsl"
+    >
+    <xsl:template match="ignore">
+        <xsl:choose>
+            <xsl:when test="//attr">{//attr}</xsl:when>
+            <xsl:otherwise>{def}</xsl:otherwise>
+        </xsl:choose><xsl:value-of select="."></xsl:value-of></xsl:template>
+    <xsl:template mode="payload"  match="attributes"></xsl:template>
+    <xsl:template match="/">
+        <xsl:apply-templates mode="payload" select="/datadom/attributes"/>
+    </xsl:template>
+    <xsl:template name="slot" >
+        <xsl:param name="slotname" />
+        <xsl:param name="defaultvalue" />
+        <xsl:choose>
+            <xsl:when test="//payload/*[@slot=$slotname]">
+               <xsl:copy-of select="//payload/*[@slot=$slotname]"/>
+            </xsl:when>
+            <xsl:otherwise>
+                <xsl:copy-of select="$defaultvalue"/>
+            </xsl:otherwise>
+        </xsl:choose>
+    </xsl:template>
+    <xsl:variable name="js-injected-body">
+        <xsl:call-template name="slot" >
+            <xsl:with-param name="slotname" select="''"/>
+            <xsl:with-param name="defaultvalue"/>
+        </xsl:call-template>
+    </xsl:variable>
+</xsl:stylesheet>`
+  );
+  s.importStylesheet(t);
+  const r = s.transformToFragment(a, document), h = (i, c) => i.querySelector(c), p = h(n, 'template[mode="payload"]');
+  if (!r)
+    return console.error("transformation error", { xml: a.outerHTML, xsl: H(t) });
+  const u = [];
+  [...r.querySelectorAll("dce-root>attribute")].forEach((i) => {
+    const c = G(i, "xsl:param"), E = x(i, "name");
+    p.append(c);
+    let g = x(c, "select")?.split("??");
+    g || (g = ["//" + E, `'${c.textContent}'`], U(c), c.setAttribute("name", E));
+    let y;
+    if (g?.length > 1) {
+      c.removeAttribute("select");
+      const v = h(n, 'template[match="ignore"]>choose').cloneNode(!0);
+      U(v.firstElementChild).append(S(v, "{" + g[0] + "}")), U(v.lastElementChild).append(S(v, "{" + g[1] + "}")), v.firstElementChild.setAttribute("test", g[0]), c.append(v), y = v.cloneNode(!0);
+    } else
+      y = G(i, "xsl:value-of");
+    y.removeAttribute("name"), i.append(y), i.removeAttribute("select"), u.push(c);
+  }), [...r.querySelectorAll("[value]")].filter((i) => i.getAttribute("value").match(/\{(.*)\?\?(.*)\}/g)).forEach((i) => {
+    const c = x(i, "value");
+    c && i.setAttribute("value", ye(c));
+  });
+  for (const i of r.childNodes)
+    p.append(n.importNode(i, !0));
+  [...p.getElementsByTagName("xsl:template")].forEach((i) => p.ownerDocument.documentElement.append(i));
+  const P = h(n, 'call-template[name="slot"]'), d = (i) => {
+    const c = P.cloneNode(!0), E = x(i, "name");
+    E && c.firstElementChild.setAttribute("select", `'${E}'`);
+    for (let g of i.childNodes)
+      c.lastElementChild.append(g);
+    return c;
+  };
+  C(p, "slot", (i) => i.parentNode.replaceChild(d(i), i));
+  const m = Z(n);
+  return m.params = u, m;
+}
+async function ue(e) {
+  return await new Promise((t, s) => {
+    const a = new XMLHttpRequest();
+    a.open("GET", e), a.responseType = "document", a.onload = () => {
+      a.readyState === a.DONE && a.status === 200 ? t(a.responseXML?.body || a.responseXML || N("div", a.responseText)) : s(`${a.statusText} - ${e}`);
+    }, a.addEventListener("error", (n) => s(n)), a.send();
+  });
+}
+function de(e, l, t = !1) {
+  if (e === l)
+    return !0;
+  if (typeof e != "object" || e === null || typeof l != "object" || l === null || Object.keys(e).length !== Object.keys(l).length)
+    return t;
+  for (let s in e)
+    if (!(s in l) || !de(e[s], l[s]))
+      return t;
+  return !0;
+}
+const se = (e) => e.split("|").map((l) => l.trim()).filter((l) => l), pe = (e, l) => se(l).map((t) => {
+  let s = e.ownerDocument, a = (n) => (e.append(n), n);
+  if (t.includes("/")) {
+    const n = [], r = s.evaluate(t, e);
+    for (let h; h = r.iterateNext(); )
+      n.push(h);
+    return n;
+  }
+  return [...e.childNodes].find((n) => n.localName === t) || a(N(t, "", s));
+}).flat();
+function J(e, l, t, s) {
+  if (!t.sliceProcessed)
+    return t.sliceProcessed = 1, pe(e, l ?? "").map((a) => {
+      const n = e.ownerDocument, r = t.sliceEventSource, h = t.sliceElement, p = () => [...a.childNodes].filter((u) => u.nodeType === 3 || u.localName === "value" || u.localName === "form-data").map((u) => u.remove());
+      if (r.getAttributeNames().map((u) => a.setAttribute(u, x(r, u))), [...a.childNodes].filter((u) => u.localName === "event").map((u) => u.remove()), "validationMessage" in r && a.setAttribute("validation-message", r.validationMessage), t.type === "init" && p(), a.append($(t, "event", n)), h.hasAttribute("slice-value")) {
+        r.value === void 0 ? a.removeAttribute("value") : a.setAttribute("value", r.value);
+        const u = L(x(h, "slice-value"), a);
+        p(), a.append(S(n, u));
+      } else {
+        if ("elements" in r)
+          return p(), a.append($(new FormData(r), "value", a.ownerDocument)), a;
+        const u = r.value ?? x(r, "value");
+        p(), u == null ? [...a.childNodes].filter((w) => w.localName !== "event").map((w) => w.remove()) : oe(u) ? a.append(S(n, u)) : a.append($(u, "value", a.ownerDocument));
+      }
+      return a;
+    });
+}
+function C(e, l, t) {
+  e.querySelectorAll && [...e.querySelectorAll(l)].forEach(t);
+}
+const fe = async (e, l) => {
+  if (!e || !e.trim())
+    return [l];
+  if (e.startsWith("#"))
+    return ((t) => {
+      const s = t.querySelectorAll(e);
+      return [...s.length ? s : t.getRootNode().querySelectorAll(e)];
+    })(l.parentElement);
+  try {
+    const [t, s] = e.split("#");
+    if (e.charAt(0) === ".")
+      e = new URL(t, l.closest("[base]")?.getAttribute("base") || location).href;
+    else
+      try {
+        e = import.meta.resolve(t), s && (e += "#" + s);
+      } catch (n) {
+        console.error(n.message);
+      }
+    const a = await ue(e);
+    if (l.setAttributeNS("xml", "base", e), s) {
+      const n = a.querySelectorAll("#" + s);
+      return n.length ? [...n] : [l];
+    }
+    return [a];
+  } catch {
+    return [l];
+  }
+};
+function he(e, l) {
+  for (let t of e.attributes)
+    t.namespaceURI ? l.setAttributeNS(t.namespaceURI, t.name, t.value) : l.setAttribute(t.name, t.value), t.name === "value" && (l.value = t.value);
+}
+function le(e, l = 0) {
+  const t = {};
+  for (const s of e.childNodes) {
+    const a = x(s, "data-dce-id") || s.dceId || 0;
+    if (!t[a])
+      a ? t[a] = 1 : (t[a] = s.dceId = ++l, s.setAttribute && s.setAttribute("data-dce-id", s.dceId));
+    else {
+      const n = s.dceId = a + "-" + t[a]++;
+      s.setAttribute && s.setAttribute("data-dce-id", n);
+    }
+    s.childNodes.length && le(s);
+  }
+}
+function xe(e, l, t) {
+  t = 1 * t;
+  for (let s of e.childNodes)
+    if ((s.dceId ?? s.getAttribute("data-dce-id") * 1) > t)
+      return e.insertBefore(l, s);
+  e.append(l);
+}
+function ae(e, l) {
+  if (e.firstElementChild?.localName === "dce-root" && l[0].localName !== "dce-root")
+    return;
+  if (!l.length)
+    return e.firstElementChild?.localName !== "dce-root" && K(e);
+  const t = {};
+  for (let s of e.childNodes)
+    t[s.dceId], Y(s) ? (s.data.trim(), t[s.dceId || 0] = s) : t[x(s, "data-dce-id") || 0] = s;
+  for (let s of [...l]) {
+    const a = x(s, "data-dce-id") || s.dceId, n = t[a];
+    n ? (Y(s) ? n.nodeValue !== s.nodeValue && (n.nodeValue = s.nodeValue) : (he(s, n), (n.childNodes.length || s.childNodes.length) && ae(n, s.childNodes)), delete t[a]) : xe(e, s, a);
+  }
+  for (let s of Object.values(t))
+    s.localName !== "dce-root" && s.remove();
+}
+function be(e, l) {
+  return e.hasAttribute(l) || e.setAttribute(l, crypto.randomUUID()), e.getAttribute(l);
+}
+const ye = (e) => [...e?.matchAll(/([^{}]*)(\{)([^}]+)}([^{}]*)/g)].map((t) => `${t[1]}{${F(t[3])}}${t[4]}`).join(""), F = (e) => {
+  if (!e.trim())
+    return e;
+  const l = e.split("??"), t = l.shift(), s = F(l.join("??"));
+  return l.length ? `concat( ${t} , substring( ${s} , (1+string-length( ${s} )) * string-length( ${t} ) ) )` : e;
+}, L = (e, l) => {
+  const t = e.split("??");
+  if (t.length > 1)
+    return L(t[0], l) || L(t[1], l);
+  e = F(e);
+  const s = l.ownerDocument.evaluate(e, l);
+  switch (s.resultType) {
+    case XPathResult.NUMBER_TYPE:
+      return s.numberValue;
+    case XPathResult.STRING_TYPE:
+      return s.stringValue;
+    case XPathResult.BOOLEAN_TYPE:
+      return s.booleanValue;
+  }
+  let a = "";
+  for (let n; n = s.iterateNext(); )
+    a += n.textContent;
+  return a;
+}, ve = "stylesheet,transform,import,include,strip-space,preserve-space,output,key,decimal-format,namespace-alias,value-of,copy-of,number,apply-templates,apply-imports,for-each,sort,if,choose,when,otherwise,attribute-set,call-template,with-param,variable,param,text,processing-instruction,element,attribute,comment,copy,message,fallback".split(","), ge = (e, l) => {
+  const t = N("xsl:" + e.localName);
+  for (let s of e.attributes)
+    t.setAttribute(s.name, s.value);
+  for (; e.firstChild; )
+    t.append(e.firstChild);
+  if (e.parentElement)
+    e.parentElement.replaceChild(t, e);
+  else {
+    const s = e.parentElement || l, a = [...s.childNodes];
+    a.forEach((n, r) => {
+      n === e && (a[r] = t);
+    }), s.replaceChildren(...a);
+  }
+};
+class Ee extends HTMLElement {
+  static observedAttributes = ["src", "tag", "hidden"];
+  async connectedCallback() {
+    const l = await fe(x(this, "src"), this), t = x(this, "tag"), s = t || "dce-" + crypto.randomUUID();
+    for (const d of l)
+      C(d.templateNode || d.content || d, "style", (m) => {
+        const i = m.closest("slot"), c = i ? `slot[name="${i.name}"]` : "";
+        m.innerHTML = `${s} ${c}{${m.innerHTML}}`, this.append(m);
+      });
+    const a = l.map((d) => me(d)), n = a.map((d, m) => (m = new XSLTProcessor(), m.importStylesheet(d), m));
+    Object.defineProperty(this, "xsltString", { get: () => a.map((d) => H(d)).join(`
+`) });
+    const r = this, h = [...this.templateNode.querySelectorAll("[slice]")], p = h.map((d) => x(d, "slice")).filter((d) => !d.includes("/")).filter((d, m, i) => i.indexOf(d) === m).map(se).flat(), u = a.reduce((d, m) => (m.params && d.push(...m.params), d), []);
+    class w extends HTMLElement {
+      static get observedAttributes() {
+        return u.map((m) => x(m, "name"));
+      }
+      #e = 0;
+      connectedCallback() {
+        let m = this.childNodes;
+        if (this.firstElementChild?.tagName === "TEMPLATE") {
+          this.firstElementChild !== this.lastElementChild && console.error("payload should have TEMPLATE as only child", this.outerHTML);
+          const f = this.firstElementChild;
+          f.remove(), m = f.content.childNodes;
+          for (const o of [...f.content.childNodes])
+            if (o.localName === "style") {
+              const b = be(this, "data-dce-style");
+              o.innerHTML = `${s}[data-dce-style="${b}"]{${o.innerHTML}}`, f.insertAdjacentElement("beforebegin", o);
+            } else
+              o.nodeType === 1 ? f.insertAdjacentElement("beforebegin", o) : o.nodeType === 3 && f.insertAdjacentText("beforebegin", o.data);
+        }
+        const i = M("<datadom/>").documentElement, c = (f, o = "") => ((b) => (o && b.append(S(i, o)), b))(i.ownerDocument.createElement(f)), E = X(i, "payload", m, ce);
+        Q(E), ee(E), this.innerHTML = "";
+        const g = X(i, "attributes", this.attributes, (f) => c(f.nodeName, f.value));
+        X(i, "dataset", Object.keys(this.dataset), (f) => c(f, this.dataset[f]));
+        const y = X(i, "slice", p, (f) => c(f, "")), v = (f) => L(f, y);
+        this.xml = i;
+        const D = [], W = () => {
+          const f = {};
+          for (let o; o = D.pop(); ) {
+            const b = x(o.sliceElement, "slice");
+            f[b] || (J(y, b, o), f[b] = o);
+          }
+          Object.keys(f).length !== 0 && R();
+        };
+        let V;
+        this.onSlice = (f) => {
+          D.push(f), V || (V = setTimeout(() => {
+            W(), V = 0;
+          }, 1));
+        };
+        const R = this.transform = () => {
+          if (this.#e)
+            debugger;
+          this.#e = 1, n.map((o, b) => {
+            const I = o.transformToFragment(i.ownerDocument, document);
+            return I || console.error(`XSLT transformation error. xsl:
+`, H(a[b]), `
+xml:
+`, H(i)), I;
+          }).map((o) => {
+            o && (le(o), ae(this, o.childNodes));
+          }), w.observedAttributes.map((o) => {
+            let b = x(this.firstElementChild, o);
+            b !== x(this, o) && (this.setAttribute(o, b), this.#t(o, b));
+          }), C(this, "[slice],[slice-event]", (o) => {
+            if (!o.dceInitialized) {
+              o.dceInitialized = 1;
+              let b = x(o, "slice-event");
+              o.hasAttribute("custom-validity") && (b += " change submit"), [...new Set((b || "change").split(" "))].forEach((I) => (o.localName === "slice" ? o.parentElement : o).addEventListener(I, (A) => {
+                A.sliceElement = o, A.sliceEventSource = A.currentTarget || A.target;
+                const ne = J(y, x(A.sliceElement, "slice"), A);
+                C(this, "[custom-validity]", (z) => {
+                  if (!z.setCustomValidity)
+                    return;
+                  const _ = x(z, "custom-validity");
+                  try {
+                    const j = _ && L(_, g);
+                    z.setCustomValidity(j === !0 ? "" : j === !1 ? "invalid" : j);
+                  } catch (j) {
+                    console.error(j, "xPath", _);
+                  }
+                });
+                const k = x(o, "custom-validity"), T = k && L(k, g), O = T === !0 ? "" : T;
+                if (k) {
+                  if (o.setCustomValidity ? o.setCustomValidity(O) : o.validationMessage = O, ne.map((z) => z.setAttribute("validation-message", O)), A.type === "submit")
+                    return T === !0 ? void 0 : (setTimeout(R, 1), !!T === T ? (T || A.preventDefault(), T) : T ? (A.preventDefault(), !1) : void 0);
+                  setTimeout(R, 1);
+                }
+                this.onSlice(A);
+              })), (!b || b.includes("init")) && (o.hasAttribute("slice-value") || o.hasAttribute("value") || o.value ? this.onSlice({ type: "init", target: o, sliceElement: o, sliceEventSource: o }) : o.value = v(x(o, "slice")));
+            }
+          }), this.#e = 0;
+        };
+        R(), W();
+      }
+      #t(m, i) {
+        m === "value" && (this.value = i);
+        let c = this.xml.querySelector(`attributes>${m}`);
+        c ? U(c).append(S(c, i)) : (c = N(m, i, this.xml), this.xml.querySelector("attributes").append(c)), this.dispatchEvent(new CustomEvent("change", { bubbles: !0, detail: { [m]: i } }));
+      }
+      attributeChangedCallback(m, i, c) {
+        !this.xml || this.#e || (this.#t(m, c), this.transform());
+      }
+      get dce() {
+        return r;
+      }
+    }
+    const P = (d) => {
+      window.customElements.get(d) !== w && window.customElements.define(d, w);
+    };
+    if (t)
+      P(t);
+    else {
+      const d = s;
+      this.setAttribute("tag", d), P(d);
+      const m = document.createElement(d);
+      this.getAttributeNames().forEach((i) => m.setAttribute(i, this.getAttribute(i))), m.append(...[...this.childNodes].filter((i) => i.localName !== "style")), this.append(m);
+    }
+  }
+  get templateNode() {
+    return this.firstElementChild?.tagName === "TEMPLATE" ? this.firstElementChild.content : this;
+  }
+  get dce() {
+    return this;
+  }
+  get xslt() {
+    return M(this.xsltString);
+  }
+}
+window.customElements.define("custom-element", Ee);
+export {
+  Ee as C,
+  H as a,
+  ue as b,
+  me as c,
+  de as d,
+  pe as e,
+  J as f,
+  le as g,
+  xe as h,
+  ae as i,
+  be as j,
+  ye as k,
+  F as l,
+  he as m,
+  L as n,
+  $ as o,
+  ve as p,
+  ge as q,
+  Z as t,
+  M as x
+};

package/dist/custom-element-bundle.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./custom-element-BDK7dcJN.cjs"),l=require("./http-request-DPrY7mGh.cjs"),t=require("./local-storage-Boafngui.cjs"),a=require("./location-element-2m0gWq_d.cjs");exports.CustomElement=e.CustomElement;exports.appendByDceId=e.appendByDceId;exports.assureSlices=e.assureSlices;exports.assureUID=e.assureUID;exports.assureUnique=e.assureUnique;exports.createXsltFromDom=e.createXsltFromDom;exports.deepEqual=e.deepEqual;exports.default=e.CustomElement;exports.evalCurly=e.evalCurly;exports.event2slice=e.event2slice;exports.merge=e.merge;exports.mergeAttr=e.mergeAttr;exports.obj2node=e.obj2node;exports.tagUid=e.tagUid;exports.toXsl=e.toXsl;exports.xPath=e.xPath;exports.xPathDefaults=e.xPathDefaults;exports.xhrTemplate=e.xhrTemplate;exports.xml2dom=e.xml2dom;exports.xmlString=e.xmlString;exports.xslTags=e.xslTags;exports.HttpRequestElement=l.HttpRequestElement;exports.LocalStorageElement=t.LocalStorageElement;exports.localStorageSetItem=t.localStorageSetItem;exports.LocationElement=a.LocationElement;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./custom-element-CckoVsvO.cjs"),l=require("./http-request-DPrY7mGh.cjs"),t=require("./local-storage-Boafngui.cjs"),a=require("./location-element-DRB7hCwA.cjs");exports.CustomElement=e.CustomElement;exports.appendByDceId=e.appendByDceId;exports.assureSlices=e.assureSlices;exports.assureUID=e.assureUID;exports.assureUnique=e.assureUnique;exports.createXsltFromDom=e.createXsltFromDom;exports.deepEqual=e.deepEqual;exports.default=e.CustomElement;exports.evalCurly=e.evalCurly;exports.event2slice=e.event2slice;exports.merge=e.merge;exports.mergeAttr=e.mergeAttr;exports.obj2node=e.obj2node;exports.tagUid=e.tagUid;exports.toXsl=e.toXsl;exports.xPath=e.xPath;exports.xPathDefaults=e.xPathDefaults;exports.xhrTemplate=e.xhrTemplate;exports.xml2dom=e.xml2dom;exports.xmlString=e.xmlString;exports.xslTags=e.xslTags;exports.HttpRequestElement=l.HttpRequestElement;exports.LocalStorageElement=t.LocalStorageElement;exports.localStorageSetItem=t.localStorageSetItem;exports.LocationElement=a.LocationElement;

package/dist/custom-element-bundle.js

@@ -1,8 +1,8 @@
-import { C as e } from "./custom-element-DqtzLkTG.js";
-import { h as o, e as r, j as l, g as m, c as p, d as x, k as n, f as u, i as c, m as d, o as f, t as g, q as i, n as E, l as S, b as h, x as q, a as D, p as L } from "./custom-element-DqtzLkTG.js";
+import { C as e } from "./custom-element-b7c_7Kz4.js";
+import { h as o, e as r, j as l, g as m, c as p, d as x, k as n, f as u, i as c, m as d, o as f, t as g, q as i, n as E, l as S, b as h, x as q, a as D, p as L } from "./custom-element-b7c_7Kz4.js";
 import { H as I } from "./http-request-BOvP4KTl.js";
 import { L as b, l as j } from "./local-storage-BqDEu2kF.js";
-import { L as y } from "./location-element-nA_wsqBt.js";
+import { L as y } from "./location-element-FJlONi2n.js";
 export {
   e as CustomElement,
   I as HttpRequestElement,

package/dist/demo/a.html

@@ -0,0 +1,60 @@
+<!DOCTYPE html>
+<html lang="en" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:xhtml="http://www.w3.org/1999/xhtml">
+<head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
+    <title>Data slices - Declarative Custom Element implementation demo</title>
+    <link rel="icon" href="./wc-square.svg"/>
+
+    <script type="module" src="../http-request.js"></script>
+    <script type="module" src="../custom-element.js"></script>
+    <style>
+        @import "./demo.css";
+
+        label {
+            display: flex;
+        }
+
+        label:has(input[type="text"],input[type="password"],input:not([type]) ) {
+            flex-direction: column;
+        }
+
+        nav {
+            max-width: 32em;
+        }
+    </style>
+    <!-- https://github.com/mdn/learning-area/blob/main/html/forms/form-validation/custom-error-message.html
+         todo: apply setCustomValidity( warningStr )
+    -->
+
+</head>
+<body>
+
+<fieldset>
+    <legend><b style="color:green">green</b> in instance style can be overridden in payload as <i
+            style="color:red">red</i> in 1st instance
+    </legend>
+    <custom-element tag="dce-3">
+        <template>
+            <u>
+                <slot>is green</slot>
+            </u>
+        </template>
+        <style>dce-3 {
+            color: green
+        }</style>
+    </custom-element>
+   <u>should be</u> <i style="color:red">red</i>:
+    <dce-3 id="dce32">
+        <template>
+            <style> color:red; </style>
+            <u>red</u>
+        </template>
+    </dce-3> <br/>
+    should be GREEN:
+    <dce-3 id="dce31">green</dce-3>
+</fieldset>
+
+<script type="module" src="https://unpkg.com/html-demo-element@1/html-demo-element.js"></script>
+
+</body>
+</html>

package/dist/demo/b.html

@@ -0,0 +1,13 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<dce-root data-dce-id="1" xmlns="http://www.w3.org/1999/xhtml" xmlns:dce="urn:schemas-epa-wg:dce"
+          xmlns:xhtml="http://www.w3.org/1999/xhtml"><u data-dce-id="2" xmlns="">
+    <dce-text data-dce-id="3">
+        <xhtml:span xmlns:xsl="http://www.w3.org/1999/XSL/Transform" slot=""/>
+        <xhtml:style xmlns:xsl="http://www.w3.org/1999/XSL/Transform" slot="" title="ABC">
+            dce-3[data-dce-style="54f96d52-ce70-435d-83c4-b421357d9a17"]{ color:red; }
+        </xhtml:style>
+        <xhtml:span xmlns:xsl="http://www.w3.org/1999/XSL/Transform" slot=""/>
+        <xhtml:u xmlns:xsl="http://www.w3.org/1999/XSL/Transform" slot="">red</xhtml:u>
+        <xhtml:span xmlns:xsl="http://www.w3.org/1999/XSL/Transform" slot=""/>
+    </dce-text>
+</u></dce-root>

package/dist/demo/confused.svg

@@ -0,0 +1,38 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="48" height="48" version="1.0">
+  <title>Confused</title>
+  <defs>
+    <linearGradient id="d">
+      <stop offset="0"/>
+      <stop offset=".5"/>
+      <stop offset=".80000001" stop-opacity=".46666667"/>
+      <stop offset="1" stop-opacity="0"/>
+    </linearGradient>
+    <linearGradient id="a">
+      <stop offset="0" stop-color="#fb0"/>
+      <stop offset=".5" stop-color="#e29d00"/>
+      <stop offset="1" stop-color="#fb0"/>
+    </linearGradient>
+    <linearGradient id="c">
+      <stop offset="0"/>
+      <stop offset="1" stop-opacity="0"/>
+    </linearGradient>
+    <linearGradient id="b">
+      <stop offset="0" stop-color="#ffc"/>
+      <stop offset=".5" stop-color="#fff965"/>
+      <stop offset="1" stop-color="#fc3"/>
+    </linearGradient>
+    <linearGradient xlink:href="#a" id="i" x1="8.0350637" x2="42.788235" y1="32.372219" y2="32.372219" gradientUnits="userSpaceOnUse" spreadMethod="pad"/>
+    <radialGradient xlink:href="#b" id="f" cx="17.986637" cy="16.545853" r="23.978155" fx="17.986637" fy="16.545853" gradientUnits="userSpaceOnUse"/>
+    <radialGradient xlink:href="#c" id="e" cx="53.309223" cy="94.956306" r="63.252911" fx="53.309223" fy="94.956306" gradientTransform="matrix(1 0 0 .34935 0 61.7838)" gradientUnits="userSpaceOnUse"/>
+    <radialGradient xlink:href="#d" id="g" cx="18.71347" cy="21.759708" r="1.8644418" fx="18.71347" fy="21.759708" gradientTransform="matrix(1 0 0 1.77778 0 -16.92422)" gradientUnits="userSpaceOnUse"/>
+  </defs>
+  <path fill="url(#e)" d="M116.56213 94.956306a63.252911 22.097088 0 1 1-126.5058174 0 63.252911 22.097088 0 1 1 126.5058174 0z" opacity=".53200001" transform="matrix(.3162 0 0 .33941 6.936944 8.132618)"/>
+  <path fill="url(#f)" stroke="#fb0" stroke-width="1.43869453" d="M47.094418 23.83131a23.478155 23.478155 0 1 1-46.9563107 0 23.478155 23.478155 0 1 1 46.9563107 0z" transform="translate(4.30185 4.122792) scale(.83409)"/>
+  <path id="h" fill="#fff" fill-opacity="1" fill-rule="nonzero" stroke="#fc0" stroke-dasharray="none" stroke-dashoffset="0" stroke-linejoin="miter" stroke-miterlimit="4" stroke-opacity="1" stroke-width="1" d="M21.682767 18.5142a3.9360437 6.9743929 0 1 1-7.872088 0 3.9360437 6.9743929 0 1 1 7.872088 0z" opacity="1" transform="matrix(1.01507 0 0 1.00354 -.0090285 .916405)"/>
+  <path id="j" fill="url(#g)" fill-opacity="1" fill-rule="nonzero" stroke="none" stroke-dasharray="none" stroke-dashoffset="0" stroke-linejoin="miter" stroke-miterlimit="4" stroke-opacity="1" stroke-width="1" d="M20.577912 21.759708a1.8644418 3.314563 0 1 1-3.728883 0 1.8644418 3.314563 0 1 1 3.728883 0z" opacity="1" transform="translate(-.138107 .535104)"/>
+  <use xlink:href="#h" width="48" height="48" transform="translate(12.50001 -4.4e-7)"/>
+  <path fill="none" stroke="url(#i)" stroke-linecap="round" stroke-width="1.97319973" d="M9.0216636 35.899178c4.7689724-7.457767 10.9544424-9.489956 17.3095664-3.728884 5.404329 4.899155 11.190398 4.350365 15.470406-.656007"/>
+  <path fill="none" stroke="#e2ac00" stroke-linecap="round" stroke-width="1.17813516" d="M15.504748 34.21319c3.012147-3.243177 6.693658.87012 6.693658.87012" opacity=".8"/>
+  <use xlink:href="#j" width="48" height="48" transform="translate(10.78418 -5)"/>
+</svg>