@nl-design-system-community/clippy-components 1.1.0 → 2.0.0

package/dist/clippy-font-combobox/index.d.ts

@@ -1,7 +1,8 @@
 import { ClippyCombobox } from '../clippy-combobox';
 type Option = {
     label: string;
-    value: string | Array<string>;
+    value: string[];
+    description?: string;
     cssUrl?: string;
 };
 declare const tag = "clippy-font-combobox";
@@ -12,10 +13,15 @@ declare global {
 }
 export declare class ClippyFontCombobox extends ClippyCombobox<Option> {
     #private;
+    allow: (typeof ClippyCombobox.allowances)[number];
     readonly listboxElement?: Element;
+    set value(value: Option['value'] | null);
+    get value(): Option['value'] | null;
     fetchAdditionalOptions(query: string): Promise<Option[]>;
-    valueToQuery(value: Option['value']): string;
-    renderEntry(option: Option, _index: number): import('lit').TemplateResult<1>;
+    valueToQuery(value: Option['value'] | null): string;
+    queryToValue(query: string): string[];
+    getOptionForValue(value: Option['value'] | null): Option | undefined;
+    renderEntry({ cssUrl, description, label, value }: Option, index: number): import('lit').TemplateResult<1>;
 }
 export {};
 //# sourceMappingURL=index.d.ts.map

package/dist/clippy-font-combobox/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/clippy-font-combobox/index.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AAEpD,KAAK,MAAM,GAAG;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC,CAAC;IAC9B,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AAEF,QAAA,MAAM,GAAG,yBAAyB,CAAC;AAEnC,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,CAAC,GAAG,CAAC,EAAE,kBAAkB,CAAC;KAC3B;CACF;AAED,qBACa,kBAAmB,SAAQ,cAAc,CAAC,MAAM,CAAC;;IAI5D,QAAQ,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IAEnB,sBAAsB,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO,CAAC,MAAM,EAAE,CAAC;IAgC9D,YAAY,CAAC,KAAK,EAAE,MAAM,CAAC,OAAO,CAAC,GAAG,MAAM;IAI5C,WAAW,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM;CAWpD"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/clippy-font-combobox/index.ts"],"names":[],"mappings":"AAMA,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AAGpD,KAAK,MAAM,GAAG;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,EAAE,CAAC;IAChB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AAKF,QAAA,MAAM,GAAG,yBAAyB,CAAC;AAEnC,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,CAAC,GAAG,CAAC,EAAE,kBAAkB,CAAC;KAC3B;CACF;AAED,qBACa,kBAAmB,SAAQ,cAAc,CAAC,MAAM,CAAC;;IAEnD,KAAK,EAAE,CAAC,OAAO,cAAc,CAAC,UAAU,CAAC,CAAC,MAAM,CAAC,CAAoB;IAI9E,QAAQ,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IAElC,IACa,KAAK,CAAC,KAAK,EAAE,MAAM,CAAC,OAAO,CAAC,GAAG,IAAI,EAG/C;IAED,IAAa,KAAK,IAAI,MAAM,CAAC,OAAO,CAAC,GAAG,IAAI,CAE3C;IAEc,sBAAsB,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO,CAAC,MAAM,EAAE,CAAC;IAiC9D,YAAY,CAAC,KAAK,EAAE,MAAM,CAAC,OAAO,CAAC,GAAG,IAAI,GAAG,MAAM;IAOnD,YAAY,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,EAAE;IAKrC,iBAAiB,CAAC,KAAK,EAAE,MAAM,CAAC,OAAO,CAAC,GAAG,IAAI,GAAG,MAAM,GAAG,SAAS;IAIpE,WAAW,CAAC,EAAE,MAAM,EAAE,WAAW,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM;CAalF"}

package/dist/clippy-font-combobox/index.js

@@ -1,58 +1,112 @@
-import { html as _ } from "lit";
-import { query as b, customElement as w } from "lit/decorators.js";
-import { ref as E } from "lit/directives/ref.js";
-import { styleMap as x } from "lit/directives/style-map.js";
-import { ClippyCombobox as C } from "../clippy-combobox/index.js";
-var A = Object.defineProperty, O = Object.getOwnPropertyDescriptor, m = (t) => {
-  throw TypeError(t);
-}, u = (t, e, r, o) => {
-  for (var s = o > 1 ? void 0 : o ? O(e, r) : e, i = t.length - 1, n; i >= 0; i--)
-    (n = t[i]) && (s = (o ? n(e, r, s) : n(s)) || s);
-  return o && s && A(e, r, s), s;
-}, y = (t, e, r) => e.has(t) || m("Cannot " + r), a = (t, e, r) => (y(t, e, "read from private field"), r ? r.call(t) : e.get(t)), p = (t, e, r) => e.has(t) ? m("Cannot add the same private member more than once") : e instanceof WeakSet ? e.add(t) : e.set(t, r), v = (t, e, r, o) => (y(t, e, "write to private field"), e.set(t, r), r), c, l, f;
-const g = "clippy-font-combobox";
-let h = class extends C {
+import { s as safeCustomElement } from "../decorators-Cq82_-g_.js";
+import { nothing, html } from "lit";
+import { property, query } from "lit/decorators.js";
+import { ifDefined } from "lit/directives/if-defined.js";
+import { ref } from "lit/directives/ref.js";
+import { styleMap } from "lit/directives/style-map.js";
+import { ClippyCombobox } from "../clippy-combobox/index.js";
+import { allowedValuesConverter, arrayFromCommaList } from "../lib/converters/index.js";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __typeError = (msg) => {
+  throw TypeError(msg);
+};
+var __decorateClass = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
+  for (var i = decorators.length - 1, decorator; i >= 0; i--)
+    if (decorator = decorators[i])
+      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
+  if (kind && result) __defProp(target, key, result);
+  return result;
+};
+var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot " + msg);
+var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
+var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
+var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), member.set(obj, value), value);
+var _additional, _intersectionObserver, _loadFontsInView;
+const defaultAllowance = "other";
+const tag = "clippy-font-combobox";
+let ClippyFontCombobox = class extends ClippyCombobox {
   constructor() {
-    super(...arguments), p(this, c), p(this, l), p(this, f, (t) => {
-      for (const e of t) {
-        const { intersectionRatio: r, target: o } = e;
-        if (r > 0 && o instanceof HTMLElement) {
-          const s = o.dataset.cssUrl || "", i = document.querySelector(`[href="${s}"]`);
-          if (s && !i) {
-            const n = document.createElement("link");
-            n.setAttribute("rel", "stylesheet"), n.setAttribute("href", s), document.head.appendChild(n);
+    super(...arguments);
+    this.allow = defaultAllowance;
+    __privateAdd(this, _additional);
+    __privateAdd(this, _intersectionObserver);
+    __privateAdd(this, _loadFontsInView, (entries) => {
+      for (const entry of entries) {
+        const { intersectionRatio, target } = entry;
+        if (intersectionRatio > 0 && target instanceof HTMLElement) {
+          const cssUrl = target.dataset["cssUrl"] || "";
+          const stylesheets = document.querySelector(`[href="${cssUrl}"]`);
+          if (cssUrl && !stylesheets) {
+            const link = document.createElement("link");
+            link.setAttribute("rel", "stylesheet");
+            link.setAttribute("href", cssUrl);
+            document.head.appendChild(link);
           }
-          a(this, l)?.unobserve(o);
+          __privateGet(this, _intersectionObserver)?.unobserve(target);
         }
       }
     });
   }
-  async fetchAdditionalOptions(t) {
-    v(this, c, a(this, c) ?? await import("../external-GSP7IGqN.js").then(({ default: r }) => r));
-    const e = a(this, c).filter((r) => r.label.includes(t));
-    return e.length && v(this, l, a(this, l) ?? new IntersectionObserver(a(this, f), {
-      root: this.listboxElement
-    })), e;
+  set value(value) {
+    super.value = value;
+    this.query = this.valueToQuery(value);
+  }
+  get value() {
+    return super.value;
+  }
+  async fetchAdditionalOptions(query2) {
+    __privateSet(this, _additional, __privateGet(this, _additional) ?? await import("../external-BCrp-PaG.js").then(({ default: items }) => items));
+    const filter = this.filter(query2);
+    const options = __privateGet(this, _additional).filter(filter);
+    if (options.length) {
+      __privateSet(this, _intersectionObserver, __privateGet(this, _intersectionObserver) ?? new IntersectionObserver(__privateGet(this, _loadFontsInView), {
+        root: this.listboxElement
+      }));
+    }
+    return options;
   }
-  valueToQuery(t) {
-    return Array.isArray(t) ? t[0] : t.split(",")[0];
+  valueToQuery(value) {
+    if (value === null) {
+      return "";
+    }
+    return Array.isArray(value) ? value[0] : value;
   }
-  renderEntry(t, e) {
-    const { cssUrl: r, label: o, value: s } = t, i = { fontFamily: s.toString(), fontSizeAdjust: 0.5 };
-    return _`<span ${E((d) => {
-      d && a(this, l) && a(this, l).observe(d);
-    })} style=${x(i)} data-css-url=${r}> ${o} </span>`;
+  queryToValue(query2) {
+    return this.options.find((option) => option.value[0] === query2)?.value ?? [query2];
+  }
+  getOptionForValue(value) {
+    return this.options.find((option) => option.value.every((entry, index) => value?.[index] === entry));
+  }
+  renderEntry({ cssUrl, description, label, value }, index) {
+    const styles = { fontFamily: value.toString(), fontSizeAdjust: 0.5 };
+    const observeElement = (element) => {
+      if (element && __privateGet(this, _intersectionObserver)) {
+        __privateGet(this, _intersectionObserver).observe(element);
+      }
+    };
+    return html`
+      <div ${ref(observeElement)} style=${styleMap(styles)} data-css-url=${ifDefined(cssUrl)}>${label}</div>
+      ${description && index !== void 0 ? html`<div>${description}</div>` : nothing}
+    `;
   }
 };
-c = /* @__PURE__ */ new WeakMap();
-l = /* @__PURE__ */ new WeakMap();
-f = /* @__PURE__ */ new WeakMap();
-u([
-  b("[role=listbox]")
-], h.prototype, "listboxElement", 2);
-h = u([
-  w(g)
-], h);
+_additional = /* @__PURE__ */ new WeakMap();
+_intersectionObserver = /* @__PURE__ */ new WeakMap();
+_loadFontsInView = /* @__PURE__ */ new WeakMap();
+__decorateClass([
+  property({ converter: allowedValuesConverter(ClippyCombobox.allowances, defaultAllowance) })
+], ClippyFontCombobox.prototype, "allow", 2);
+__decorateClass([
+  query("[role=listbox]")
+], ClippyFontCombobox.prototype, "listboxElement", 2);
+__decorateClass([
+  property({ converter: arrayFromCommaList })
+], ClippyFontCombobox.prototype, "value", 1);
+ClippyFontCombobox = __decorateClass([
+  safeCustomElement(tag)
+], ClippyFontCombobox);
 export {
-  h as ClippyFontCombobox
+  ClippyFontCombobox
 };

package/dist/clippy-heading/index.d.ts

@@ -0,0 +1,14 @@
+import { LitElement } from 'lit';
+declare const tag = "clippy-heading";
+export declare class ClippyHeading extends LitElement {
+    level: number;
+    static readonly styles: import('lit').CSSResult[];
+    render(): import('lit').TemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        [tag]: ClippyHeading;
+    }
+}
+export {};
+//# sourceMappingURL=index.d.ts.map

package/dist/clippy-heading/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/clippy-heading/index.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,UAAU,EAAa,MAAM,KAAK,CAAC;AAI5C,QAAA,MAAM,GAAG,mBAAmB,CAAC;AAE7B,qBACa,aAAc,SAAQ,UAAU;IACf,KAAK,SAAK;IAEtC,gBAAyB,MAAM,4BAA2B;IAEjD,MAAM;CAKhB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,CAAC,GAAG,CAAC,EAAE,aAAa,CAAC;KACtB;CACF"}

package/dist/clippy-heading/index.js

@@ -0,0 +1,268 @@
+import { s as safeCustomElement } from "../decorators-Cq82_-g_.js";
+import { unsafeCSS, LitElement } from "lit";
+import { property } from "lit/decorators.js";
+const headingCss = ".nl-heading{break-after:avoid;break-inside:avoid}.nl-heading--level-1{color:var(--nl-heading-level-1-color, inherit);font-family:var(--nl-heading-level-1-font-family);font-size:var(--nl-heading-level-1-font-size, revert);font-weight:var(--nl-heading-level-1-font-weight, bold);line-height:var(--nl-heading-level-1-line-height);margin-block-end:var(--nl-heading-level-1-margin-block-end, revert);margin-block-start:var(--nl-heading-level-1-margin-block-start, revert)}.nl-heading--level-2{color:var(--nl-heading-level-2-color, inherit);font-family:var(--nl-heading-level-2-font-family);font-size:var(--nl-heading-level-2-font-size, revert);font-weight:var(--nl-heading-level-2-font-weight, bold);line-height:var(--nl-heading-level-2-line-height);margin-block-end:var(--nl-heading-level-2-margin-block-end, revert);margin-block-start:var(--nl-heading-level-2-margin-block-start, revert)}.nl-heading--level-3{color:var(--nl-heading-level-3-color, inherit);font-family:var(--nl-heading-level-3-font-family);font-size:var(--nl-heading-level-3-font-size, revert);font-weight:var(--nl-heading-level-3-font-weight, bold);line-height:var(--nl-heading-level-3-line-height);margin-block-end:var(--nl-heading-level-3-margin-block-end, revert);margin-block-start:var(--nl-heading-level-3-margin-block-start, revert)}.nl-heading--level-4{color:var(--nl-heading-level-4-color, inherit);font-family:var(--nl-heading-level-4-font-family);font-size:var(--nl-heading-level-4-font-size, revert);font-weight:var(--nl-heading-level-4-font-weight, bold);line-height:var(--nl-heading-level-4-line-height);margin-block-end:var(--nl-heading-level-4-margin-block-end, revert);margin-block-start:var(--nl-heading-level-4-margin-block-start, revert)}.nl-heading--level-5{color:var(--nl-heading-level-5-color, inherit);font-family:var(--nl-heading-level-5-font-family);font-size:var(--nl-heading-level-5-font-size, revert);font-weight:var(--nl-heading-level-5-font-weight, bold);line-height:var(--nl-heading-level-5-line-height);margin-block-end:var(--nl-heading-level-5-margin-block-end, revert);margin-block-start:var(--nl-heading-level-5-margin-block-start, revert)}.nl-heading--level-6{color:var(--nl-heading-level-6-color, inherit);font-family:var(--nl-heading-level-6-font-family);font-size:var(--nl-heading-level-6-font-size, revert);font-weight:var(--nl-heading-level-6-font-weight, bold);line-height:var(--nl-heading-level-6-line-height);margin-block-end:var(--nl-heading-level-6-margin-block-end, revert);margin-block-start:var(--nl-heading-level-6-margin-block-start, revert)}/*# sourceMappingURL=heading.css.map */\n";
+const t = globalThis, i = (t2) => t2, s$1 = t.trustedTypes, e = s$1 ? s$1.createPolicy("lit-html", { createHTML: (t2) => t2 }) : void 0, h = "$lit$", o$1 = `lit$${Math.random().toFixed(9).slice(2)}$`, n$1 = "?" + o$1, r = `<${n$1}>`, l$1 = document, c = () => l$1.createComment(""), a$1 = (t2) => null === t2 || "object" != typeof t2 && "function" != typeof t2, u$1 = Array.isArray, d = (t2) => u$1(t2) || "function" == typeof t2?.[Symbol.iterator], f = "[ 	\n\f\r]", v = /<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g, _ = /-->/g, m = />/g, p = RegExp(`>|${f}(?:([^\\s"'>=/]+)(${f}*=${f}*(?:[^ 	
+\f\r"'\`<>=]|("|')|))|$)`, "g"), g = /'/g, $ = /"/g, y = /^(?:script|style|textarea|title)$/i, x = (t2) => (i2, ...s2) => ({ _$litType$: t2, strings: i2, values: s2 }), b = x(1), E = /* @__PURE__ */ Symbol.for("lit-noChange"), A = /* @__PURE__ */ Symbol.for("lit-nothing"), C = /* @__PURE__ */ new WeakMap(), P = l$1.createTreeWalker(l$1, 129);
+function V(t2, i2) {
+  if (!u$1(t2) || !t2.hasOwnProperty("raw")) throw Error("invalid template strings array");
+  return void 0 !== e ? e.createHTML(i2) : i2;
+}
+const N = (t2, i2) => {
+  const s2 = t2.length - 1, e2 = [];
+  let n2, l2 = 2 === i2 ? "<svg>" : 3 === i2 ? "<math>" : "", c2 = v;
+  for (let i3 = 0; i3 < s2; i3++) {
+    const s3 = t2[i3];
+    let a2, u2, d2 = -1, f2 = 0;
+    for (; f2 < s3.length && (c2.lastIndex = f2, u2 = c2.exec(s3), null !== u2); ) f2 = c2.lastIndex, c2 === v ? "!--" === u2[1] ? c2 = _ : void 0 !== u2[1] ? c2 = m : void 0 !== u2[2] ? (y.test(u2[2]) && (n2 = RegExp("</" + u2[2], "g")), c2 = p) : void 0 !== u2[3] && (c2 = p) : c2 === p ? ">" === u2[0] ? (c2 = n2 ?? v, d2 = -1) : void 0 === u2[1] ? d2 = -2 : (d2 = c2.lastIndex - u2[2].length, a2 = u2[1], c2 = void 0 === u2[3] ? p : '"' === u2[3] ? $ : g) : c2 === $ || c2 === g ? c2 = p : c2 === _ || c2 === m ? c2 = v : (c2 = p, n2 = void 0);
+    const x2 = c2 === p && t2[i3 + 1].startsWith("/>") ? " " : "";
+    l2 += c2 === v ? s3 + r : d2 >= 0 ? (e2.push(a2), s3.slice(0, d2) + h + s3.slice(d2) + o$1 + x2) : s3 + o$1 + (-2 === d2 ? i3 : x2);
+  }
+  return [V(t2, l2 + (t2[s2] || "<?>") + (2 === i2 ? "</svg>" : 3 === i2 ? "</math>" : "")), e2];
+};
+class S {
+  constructor({ strings: t2, _$litType$: i2 }, e2) {
+    let r2;
+    this.parts = [];
+    let l2 = 0, a2 = 0;
+    const u2 = t2.length - 1, d2 = this.parts, [f2, v2] = N(t2, i2);
+    if (this.el = S.createElement(f2, e2), P.currentNode = this.el.content, 2 === i2 || 3 === i2) {
+      const t3 = this.el.content.firstChild;
+      t3.replaceWith(...t3.childNodes);
+    }
+    for (; null !== (r2 = P.nextNode()) && d2.length < u2; ) {
+      if (1 === r2.nodeType) {
+        if (r2.hasAttributes()) for (const t3 of r2.getAttributeNames()) if (t3.endsWith(h)) {
+          const i3 = v2[a2++], s2 = r2.getAttribute(t3).split(o$1), e3 = /([.?@])?(.*)/.exec(i3);
+          d2.push({ type: 1, index: l2, name: e3[2], strings: s2, ctor: "." === e3[1] ? I : "?" === e3[1] ? L : "@" === e3[1] ? z : H }), r2.removeAttribute(t3);
+        } else t3.startsWith(o$1) && (d2.push({ type: 6, index: l2 }), r2.removeAttribute(t3));
+        if (y.test(r2.tagName)) {
+          const t3 = r2.textContent.split(o$1), i3 = t3.length - 1;
+          if (i3 > 0) {
+            r2.textContent = s$1 ? s$1.emptyScript : "";
+            for (let s2 = 0; s2 < i3; s2++) r2.append(t3[s2], c()), P.nextNode(), d2.push({ type: 2, index: ++l2 });
+            r2.append(t3[i3], c());
+          }
+        }
+      } else if (8 === r2.nodeType) if (r2.data === n$1) d2.push({ type: 2, index: l2 });
+      else {
+        let t3 = -1;
+        for (; -1 !== (t3 = r2.data.indexOf(o$1, t3 + 1)); ) d2.push({ type: 7, index: l2 }), t3 += o$1.length - 1;
+      }
+      l2++;
+    }
+  }
+  static createElement(t2, i2) {
+    const s2 = l$1.createElement("template");
+    return s2.innerHTML = t2, s2;
+  }
+}
+function M(t2, i2, s2 = t2, e2) {
+  if (i2 === E) return i2;
+  let h2 = void 0 !== e2 ? s2._$Co?.[e2] : s2._$Cl;
+  const o2 = a$1(i2) ? void 0 : i2._$litDirective$;
+  return h2?.constructor !== o2 && (h2?._$AO?.(false), void 0 === o2 ? h2 = void 0 : (h2 = new o2(t2), h2._$AT(t2, s2, e2)), void 0 !== e2 ? (s2._$Co ??= [])[e2] = h2 : s2._$Cl = h2), void 0 !== h2 && (i2 = M(t2, h2._$AS(t2, i2.values), h2, e2)), i2;
+}
+class R {
+  constructor(t2, i2) {
+    this._$AV = [], this._$AN = void 0, this._$AD = t2, this._$AM = i2;
+  }
+  get parentNode() {
+    return this._$AM.parentNode;
+  }
+  get _$AU() {
+    return this._$AM._$AU;
+  }
+  u(t2) {
+    const { el: { content: i2 }, parts: s2 } = this._$AD, e2 = (t2?.creationScope ?? l$1).importNode(i2, true);
+    P.currentNode = e2;
+    let h2 = P.nextNode(), o2 = 0, n2 = 0, r2 = s2[0];
+    for (; void 0 !== r2; ) {
+      if (o2 === r2.index) {
+        let i3;
+        2 === r2.type ? i3 = new k(h2, h2.nextSibling, this, t2) : 1 === r2.type ? i3 = new r2.ctor(h2, r2.name, r2.strings, this, t2) : 6 === r2.type && (i3 = new Z(h2, this, t2)), this._$AV.push(i3), r2 = s2[++n2];
+      }
+      o2 !== r2?.index && (h2 = P.nextNode(), o2++);
+    }
+    return P.currentNode = l$1, e2;
+  }
+  p(t2) {
+    let i2 = 0;
+    for (const s2 of this._$AV) void 0 !== s2 && (void 0 !== s2.strings ? (s2._$AI(t2, s2, i2), i2 += s2.strings.length - 2) : s2._$AI(t2[i2])), i2++;
+  }
+}
+class k {
+  get _$AU() {
+    return this._$AM?._$AU ?? this._$Cv;
+  }
+  constructor(t2, i2, s2, e2) {
+    this.type = 2, this._$AH = A, this._$AN = void 0, this._$AA = t2, this._$AB = i2, this._$AM = s2, this.options = e2, this._$Cv = e2?.isConnected ?? true;
+  }
+  get parentNode() {
+    let t2 = this._$AA.parentNode;
+    const i2 = this._$AM;
+    return void 0 !== i2 && 11 === t2?.nodeType && (t2 = i2.parentNode), t2;
+  }
+  get startNode() {
+    return this._$AA;
+  }
+  get endNode() {
+    return this._$AB;
+  }
+  _$AI(t2, i2 = this) {
+    t2 = M(this, t2, i2), a$1(t2) ? t2 === A || null == t2 || "" === t2 ? (this._$AH !== A && this._$AR(), this._$AH = A) : t2 !== this._$AH && t2 !== E && this._(t2) : void 0 !== t2._$litType$ ? this.$(t2) : void 0 !== t2.nodeType ? this.T(t2) : d(t2) ? this.k(t2) : this._(t2);
+  }
+  O(t2) {
+    return this._$AA.parentNode.insertBefore(t2, this._$AB);
+  }
+  T(t2) {
+    this._$AH !== t2 && (this._$AR(), this._$AH = this.O(t2));
+  }
+  _(t2) {
+    this._$AH !== A && a$1(this._$AH) ? this._$AA.nextSibling.data = t2 : this.T(l$1.createTextNode(t2)), this._$AH = t2;
+  }
+  $(t2) {
+    const { values: i2, _$litType$: s2 } = t2, e2 = "number" == typeof s2 ? this._$AC(t2) : (void 0 === s2.el && (s2.el = S.createElement(V(s2.h, s2.h[0]), this.options)), s2);
+    if (this._$AH?._$AD === e2) this._$AH.p(i2);
+    else {
+      const t3 = new R(e2, this), s3 = t3.u(this.options);
+      t3.p(i2), this.T(s3), this._$AH = t3;
+    }
+  }
+  _$AC(t2) {
+    let i2 = C.get(t2.strings);
+    return void 0 === i2 && C.set(t2.strings, i2 = new S(t2)), i2;
+  }
+  k(t2) {
+    u$1(this._$AH) || (this._$AH = [], this._$AR());
+    const i2 = this._$AH;
+    let s2, e2 = 0;
+    for (const h2 of t2) e2 === i2.length ? i2.push(s2 = new k(this.O(c()), this.O(c()), this, this.options)) : s2 = i2[e2], s2._$AI(h2), e2++;
+    e2 < i2.length && (this._$AR(s2 && s2._$AB.nextSibling, e2), i2.length = e2);
+  }
+  _$AR(t2 = this._$AA.nextSibling, s2) {
+    for (this._$AP?.(false, true, s2); t2 !== this._$AB; ) {
+      const s3 = i(t2).nextSibling;
+      i(t2).remove(), t2 = s3;
+    }
+  }
+  setConnected(t2) {
+    void 0 === this._$AM && (this._$Cv = t2, this._$AP?.(t2));
+  }
+}
+class H {
+  get tagName() {
+    return this.element.tagName;
+  }
+  get _$AU() {
+    return this._$AM._$AU;
+  }
+  constructor(t2, i2, s2, e2, h2) {
+    this.type = 1, this._$AH = A, this._$AN = void 0, this.element = t2, this.name = i2, this._$AM = e2, this.options = h2, s2.length > 2 || "" !== s2[0] || "" !== s2[1] ? (this._$AH = Array(s2.length - 1).fill(new String()), this.strings = s2) : this._$AH = A;
+  }
+  _$AI(t2, i2 = this, s2, e2) {
+    const h2 = this.strings;
+    let o2 = false;
+    if (void 0 === h2) t2 = M(this, t2, i2, 0), o2 = !a$1(t2) || t2 !== this._$AH && t2 !== E, o2 && (this._$AH = t2);
+    else {
+      const e3 = t2;
+      let n2, r2;
+      for (t2 = h2[0], n2 = 0; n2 < h2.length - 1; n2++) r2 = M(this, e3[s2 + n2], i2, n2), r2 === E && (r2 = this._$AH[n2]), o2 ||= !a$1(r2) || r2 !== this._$AH[n2], r2 === A ? t2 = A : t2 !== A && (t2 += (r2 ?? "") + h2[n2 + 1]), this._$AH[n2] = r2;
+    }
+    o2 && !e2 && this.j(t2);
+  }
+  j(t2) {
+    t2 === A ? this.element.removeAttribute(this.name) : this.element.setAttribute(this.name, t2 ?? "");
+  }
+}
+class I extends H {
+  constructor() {
+    super(...arguments), this.type = 3;
+  }
+  j(t2) {
+    this.element[this.name] = t2 === A ? void 0 : t2;
+  }
+}
+class L extends H {
+  constructor() {
+    super(...arguments), this.type = 4;
+  }
+  j(t2) {
+    this.element.toggleAttribute(this.name, !!t2 && t2 !== A);
+  }
+}
+class z extends H {
+  constructor(t2, i2, s2, e2, h2) {
+    super(t2, i2, s2, e2, h2), this.type = 5;
+  }
+  _$AI(t2, i2 = this) {
+    if ((t2 = M(this, t2, i2, 0) ?? A) === E) return;
+    const s2 = this._$AH, e2 = t2 === A && s2 !== A || t2.capture !== s2.capture || t2.once !== s2.once || t2.passive !== s2.passive, h2 = t2 !== A && (s2 === A || e2);
+    e2 && this.element.removeEventListener(this.name, this, s2), h2 && this.element.addEventListener(this.name, this, t2), this._$AH = t2;
+  }
+  handleEvent(t2) {
+    "function" == typeof this._$AH ? this._$AH.call(this.options?.host ?? this.element, t2) : this._$AH.handleEvent(t2);
+  }
+}
+class Z {
+  constructor(t2, i2, s2) {
+    this.element = t2, this.type = 6, this._$AN = void 0, this._$AM = i2, this.options = s2;
+  }
+  get _$AU() {
+    return this._$AM._$AU;
+  }
+  _$AI(t2) {
+    M(this, t2);
+  }
+}
+const B = t.litHtmlPolyfillSupport;
+B?.(S, k), (t.litHtmlVersions ??= []).push("3.3.2");
+const a = /* @__PURE__ */ Symbol.for(""), o = (t2) => {
+  if (t2?.r === a) return t2?._$litStatic$;
+}, s = (t2) => ({ _$litStatic$: t2, r: a }), l = /* @__PURE__ */ new Map(), n = (t2) => (r2, ...e2) => {
+  const a2 = e2.length;
+  let s2, i2;
+  const n2 = [], u2 = [];
+  let c2, $2 = 0, f2 = false;
+  for (; $2 < a2; ) {
+    for (c2 = r2[$2]; $2 < a2 && void 0 !== (i2 = e2[$2], s2 = o(i2)); ) c2 += s2 + r2[++$2], f2 = true;
+    $2 !== a2 && u2.push(i2), n2.push(c2), $2++;
+  }
+  if ($2 === a2 && n2.push(r2[a2]), f2) {
+    const t3 = n2.join("$$lit$$");
+    void 0 === (r2 = l.get(t3)) && (n2.raw = n2, l.set(t3, r2 = n2)), e2 = u2;
+  }
+  return t2(r2, ...e2);
+}, u = n(b);
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __decorateClass = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
+  for (var i2 = decorators.length - 1, decorator; i2 >= 0; i2--)
+    if (decorator = decorators[i2])
+      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
+  if (kind && result) __defProp(target, key, result);
+  return result;
+};
+const tag = "clippy-heading";
+let ClippyHeading = class extends LitElement {
+  constructor() {
+    super(...arguments);
+    this.level = 1;
+  }
+  render() {
+    const safeLevel = Math.min(6, Math.max(1, Number(this.level) || 1));
+    const tag2 = s(`h${safeLevel}`);
+    return u`<${tag2} class="nl-heading nl-heading--level-${safeLevel}"><slot></slot></${tag2}>`;
+  }
+};
+ClippyHeading.styles = [unsafeCSS(headingCss)];
+__decorateClass([
+  property({ type: Number })
+], ClippyHeading.prototype, "level", 2);
+ClippyHeading = __decorateClass([
+  safeCustomElement(tag)
+], ClippyHeading);
+export {
+  ClippyHeading
+};

package/dist/clippy-html-image/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/clippy-html-image/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAMvC,qBACa,eAAgB,SAAQ,UAAU;IAC7C,gBAAyB,MAAM,4BAAY;IAG3C,OAAO,CAAC,QAAQ,CAAC,SAAS,CAAC,CAAkB;IAG7C,OAAO,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAiB;IAEzC,OAAO,CAAC,QAAQ,CAAC,OAAO,CAA+C;IACvE,OAAO,CAAC,QAAQ,CAAC,CAAmB;IAE3B,iBAAiB;IAYjB,OAAO;IAOP,oBAAoB;IAM7B,OAAO,CAAC,QAAQ,CAAC,iBAAiB,CAEhC;IAEF,OAAO,CAAC,gBAAgB;IAaf,MAAM;CAShB"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/clippy-html-image/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAQvC,qBACa,eAAgB,SAAQ,UAAU;IAC7C,gBAAyB,MAAM,4BAAY;IAG3C,OAAO,CAAC,QAAQ,CAAC,SAAS,CAAC,CAAkB;IAG7C,OAAO,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAiB;IAEzC,OAAO,CAAC,QAAQ,CAAC,OAAO,CAA+C;IACvE,OAAO,CAAC,QAAQ,CAAC,CAAmB;IAE3B,iBAAiB;IAYjB,OAAO;IAOP,oBAAoB;IAM7B,OAAO,CAAC,QAAQ,CAAC,iBAAiB,CAEhC;IAEF,OAAO,CAAC,gBAAgB;IAaf,MAAM;CAShB"}

package/dist/clippy-html-image/index.js

@@ -1,6 +1,7 @@
-import { css as d, LitElement as h, html as c } from "lit";
-import { query as b, customElement as u } from "lit/decorators.js";
-const p = d`
+import { s as safeCustomElement } from "../decorators-Cq82_-g_.js";
+import { css, LitElement, html } from "lit";
+import { query } from "lit/decorators.js";
+const styles = css`
   :host {
     cursor: default;
     forced-color-adjust: none;
@@ -11,37 +12,59 @@ const p = d`
     display: none;
   }
 `;
-var m = Object.defineProperty, v = Object.getOwnPropertyDescriptor, n = (a, t, o, s) => {
-  for (var e = s > 1 ? void 0 : s ? v(t, o) : t, i = a.length - 1, r; i >= 0; i--)
-    (r = a[i]) && (e = (s ? r(t, o, e) : r(e)) || e);
-  return s && e && m(t, o, e), e;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __decorateClass = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
+  for (var i = decorators.length - 1, decorator; i >= 0; i--)
+    if (decorator = decorators[i])
+      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
+  if (kind && result) __defProp(target, key, result);
+  return result;
 };
-let g = 0, l = class extends h {
+let labelCounter = 0;
+const tag = "clippy-html-image";
+let ClippyHtmlImage = class extends LitElement {
   constructor() {
-    super(...arguments), this.labelId = `clippy-html-image-label-${++g}`, this.onLabelSlotChange = () => {
+    super(...arguments);
+    this.labelId = `clippy-html-image-label-${++labelCounter}`;
+    this.onLabelSlotChange = () => {
       this.updateLabelledBy();
     };
   }
   connectedCallback() {
-    super.connectedCallback(), this.observer = new MutationObserver(() => {
+    super.connectedCallback();
+    this.observer = new MutationObserver(() => {
       this.updateLabelledBy();
-    }), this.observer.observe(this, {
-      childList: !0,
-      subtree: !0
+    });
+    this.observer.observe(this, {
+      childList: true,
+      subtree: true
     });
   }
   updated() {
-    this.updateLabelledBy(), this.labelSlot && this.labelSlot.addEventListener("slotchange", this.onLabelSlotChange);
+    this.updateLabelledBy();
+    if (this.labelSlot) {
+      this.labelSlot.addEventListener("slotchange", this.onLabelSlotChange);
+    }
   }
   disconnectedCallback() {
-    super.disconnectedCallback(), this.observer?.disconnect(), this.labelSlot?.removeEventListener("slotchange", this.onLabelSlotChange);
+    super.disconnectedCallback();
+    this.observer?.disconnect();
+    this.labelSlot?.removeEventListener("slotchange", this.onLabelSlotChange);
   }
   updateLabelledBy() {
     if (!this.labelSlot || !this.imgDiv) return;
-    this.labelSlot.assignedNodes({ flatten: !0 }).length > 0 ? this.imgDiv.setAttribute("aria-labelledby", this.labelId) : this.imgDiv.removeAttribute("aria-labelledby");
+    const nodes = this.labelSlot.assignedNodes({ flatten: true });
+    const hasLabel = nodes.length > 0;
+    if (hasLabel) {
+      this.imgDiv.setAttribute("aria-labelledby", this.labelId);
+    } else {
+      this.imgDiv.removeAttribute("aria-labelledby");
+    }
   }
   render() {
-    return c`<div role="img">
+    return html`<div role="img">
         <div inert>
           <slot></slot>
         </div>
@@ -49,16 +72,16 @@ let g = 0, l = class extends h {
       <slot id=${this.labelId} name="label" @slotchange=${this.onLabelSlotChange}></slot>`;
   }
 };
-l.styles = [p];
-n([
-  b('slot[name="label"]')
-], l.prototype, "labelSlot", 2);
-n([
-  b('[role="img"]')
-], l.prototype, "imgDiv", 2);
-l = n([
-  u("clippy-html-image")
-], l);
+ClippyHtmlImage.styles = [styles];
+__decorateClass([
+  query('slot[name="label"]')
+], ClippyHtmlImage.prototype, "labelSlot", 2);
+__decorateClass([
+  query('[role="img"]')
+], ClippyHtmlImage.prototype, "imgDiv", 2);
+ClippyHtmlImage = __decorateClass([
+  safeCustomElement(tag)
+], ClippyHtmlImage);
 export {
-  l as ClippyHtmlImage
+  ClippyHtmlImage
 };

package/dist/clippy-icon/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/clippy-icon/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAIvC,QAAA,MAAM,GAAG,gBAAgB,CAAC;AAE1B;;;;;;;;;;;GAWG;AACH,qBACa,UAAW,SAAQ,UAAU;IACxC,gBAAyB,MAAM,4BAAgB;IAEtC,MAAM;IAIN,iBAAiB;CAO3B;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,CAAC,GAAG,CAAC,EAAE,UAAU,CAAC;KACnB;CACF"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/clippy-icon/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAGvC,QAAA,MAAM,GAAG,gBAAgB,CAAC;AAE1B;;;;;;;;;;;GAWG;AACH,qBACa,UAAW,SAAQ,UAAU;IACxC,gBAAyB,MAAM,4BAAgB;IAEtC,MAAM;IAIN,iBAAiB;CAO3B;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,CAAC,GAAG,CAAC,EAAE,UAAU,CAAC;KACnB;CACF"}