@alegendstale/holly-components 2.0.9 → 2.0.10

package/dist/components/responsive-svg/responsive-svg.d.ts

@@ -1,4 +1,4 @@
-import { LitElement, TemplateResult, PropertyValues } from 'lit';
+import { LitElement, TemplateResult } from 'lit';
 type ViewBox = {
     x: number;
     y: number;
@@ -51,10 +51,10 @@ export declare class ResponsiveSvg extends LitElement {
     /** The viewBox dimensions the SVG will use. */
     protected viewBox: ViewBox;
     protected svgClasses(): {};
-    protected willUpdate(_changedProperties: PropertyValues): void;
+    private _widthController;
+    private _heightController;
+    connectedCallback(): void;
     render(): TemplateResult<1> | undefined;
-    /** Applies a part name to all paths in the given element. */
-    private applyPartToPaths;
     /**
      * Gets the viewBox dimensions from an SVG element.
      * @param svg The SVG to get the attribute from.

package/dist/components/responsive-svg/responsive-svg.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"responsive-svg.d.ts","sourceRoot":"","sources":["../../../src/components/responsive-svg/responsive-svg.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAQ,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAQvE,KAAK,OAAO,GAAG;IACd,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAA;CACd,CAAA;AAED,eAAO,MAAM,+BAA+B,+HAKlC,CAAC;AAEX,eAAO,MAAM,iCAAiC,4BAA6B,CAAC;AAE5E,eAAO,MAAM,0BAA0B,+eAG7B,CAAC;AAEX,MAAM,MAAM,wBAAwB,GAAG,OAAO,+BAA+B,CAAC,MAAM,CAAC,CAAC;AACtF,MAAM,MAAM,0BAA0B,GAAG,OAAO,iCAAiC,CAAC,MAAM,CAAC,CAAC;AAC1F,MAAM,MAAM,mBAAmB,GAAG,OAAO,0BAA0B,CAAC,MAAM,CAAC,CAAC;AAC5E,MAAM,MAAM,oBAAoB,GAAG,GAAG,wBAAwB,IAAI,0BAA0B,EAAE,CAAC;AAQ/F;;;;;;;;;;;GAWG;AACH,qBACa,aAAc,SAAQ,UAAU;IAC5C,MAAM,CAAC,MAAM,4BAAY;IAEzB,kDAAkD;IAElD,OAAO,EAAE,OAAO,CAAS;IAEzB,yCAAyC;IAEzC,SAAS,EAAE,OAAO,CAAS;IAE3B,gBAAgB;IAChB,OAAO,CAAC,IAAI,CAAC,CAAiC;IAC9C;;;;OAIG;IACH,IACI,GAAG,CAAC,GAAG,EAAE,UAAU,GAAG,cAAc,CAAC,CAAC,CAAC,GAAG,MAAM,EASnD;IACD,IAAI,GAAG,IAVM,UAAU,GAAG,cAAc,CAAC,CAAC,CAAC,GAAG,MAAM,CAYnD;IAED,gBAAgB;IAChB,OAAO,CAAC,oBAAoB,CAAkC;IAC9D;;;;OAIG;IACH,IACI,mBAAmB,CAAC,GAAG,EAAE,mBAAmB,GAAG,SAAS,EAE3D;IACD,IAAI,mBAAmB,IAHM,mBAAmB,GAAG,SAAS,CAW3D;IAED,+CAA+C;IAC/C,SAAS,CAAC,OAAO,EAAE,OAAO,CAAuC;IAGjE,SAAS,CAAC,UAAU;IAIpB,SAAS,CAAC,UAAU,CAAC,kBAAkB,EAAE,cAAc,GAAG,IAAI;IAkB9D,MAAM;IAwCN,6DAA6D;IAC7D,OAAO,CAAC,gBAAgB;IAaxB;;;;OAIG;IACI,cAAc,CAAC,GAAG,EAAE,UAAU,GAAG,OAAO,GAAG,IAAI;CAMtD;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,gBAAgB,EAAE,aAAa,CAAC;KAChC;CACD"}
+{"version":3,"file":"responsive-svg.d.ts","sourceRoot":"","sources":["../../../src/components/responsive-svg/responsive-svg.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAQ,cAAc,EAAE,MAAM,KAAK,CAAC;AAUvD,KAAK,OAAO,GAAG;IACd,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAA;CACd,CAAA;AAED,eAAO,MAAM,+BAA+B,+HAKlC,CAAC;AAEX,eAAO,MAAM,iCAAiC,4BAA6B,CAAC;AAE5E,eAAO,MAAM,0BAA0B,+eAG7B,CAAC;AAEX,MAAM,MAAM,wBAAwB,GAAG,OAAO,+BAA+B,CAAC,MAAM,CAAC,CAAC;AACtF,MAAM,MAAM,0BAA0B,GAAG,OAAO,iCAAiC,CAAC,MAAM,CAAC,CAAC;AAC1F,MAAM,MAAM,mBAAmB,GAAG,OAAO,0BAA0B,CAAC,MAAM,CAAC,CAAC;AAC5E,MAAM,MAAM,oBAAoB,GAAG,GAAG,wBAAwB,IAAI,0BAA0B,EAAE,CAAC;AAQ/F;;;;;;;;;;;GAWG;AACH,qBACa,aAAc,SAAQ,UAAU;IAC5C,MAAM,CAAC,MAAM,4BAAY;IAEzB,kDAAkD;IAElD,OAAO,EAAE,OAAO,CAAS;IAEzB,yCAAyC;IAEzC,SAAS,EAAE,OAAO,CAAS;IAE3B,gBAAgB;IAChB,OAAO,CAAC,IAAI,CAAC,CAAiC;IAC9C;;;;OAIG;IACH,IAEI,GAAG,CAAC,GAAG,EAAE,UAAU,GAAG,cAAc,CAAC,CAAC,CAAC,GAAG,MAAM,EASnD;IACD,IAAI,GAAG,IAVM,UAAU,GAAG,cAAc,CAAC,CAAC,CAAC,GAAG,MAAM,CAYnD;IAED,gBAAgB;IAChB,OAAO,CAAC,oBAAoB,CAAkC;IAC9D;;;;OAIG;IACH,IACI,mBAAmB,CAAC,GAAG,EAAE,mBAAmB,GAAG,SAAS,EAE3D;IACD,IAAI,mBAAmB,IAHM,mBAAmB,GAAG,SAAS,CAW3D;IAED,+CAA+C;IAC/C,SAAS,CAAC,OAAO,EAAE,OAAO,CAAuC;IAGjE,SAAS,CAAC,UAAU;IAIpB,OAAO,CAAC,gBAAgB,CAEtB;IAEF,OAAO,CAAC,iBAAiB,CAEvB;IAEF,iBAAiB,IAAI,IAAI;IAoBzB,MAAM;IAuCN;;;;OAIG;IACI,cAAc,CAAC,GAAG,EAAE,UAAU,GAAG,OAAO,GAAG,IAAI;CAMtD;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,gBAAgB,EAAE,aAAa,CAAC;KAChC;CACD"}

package/dist/components/responsive-svg/responsive-svg.js

@@ -1,16 +1,18 @@
-import { LitElement as g, html as c } from "lit";
-import { property as a, customElement as v } from "lit/decorators.js";
-import { styleMap as f } from "lit/directives/style-map.js";
-import { parseSVG as u } from "../../utils/basicUtils.js";
-import { classMap as m } from "lit/directives/class-map.js";
-import { isTemplateResult as x } from "lit/directive-helpers.js";
-import y from "./responsive-svg.styles.js";
-var d = Object.defineProperty, w = Object.getOwnPropertyDescriptor, n = (t, e, i, o) => {
-  for (var s = o > 1 ? void 0 : o ? w(e, i) : e, r = t.length - 1, h; r >= 0; r--)
-    (h = t[r]) && (s = (o ? h(e, i, s) : h(s)) || s);
-  return o && s && d(e, i, s), s;
+import { LitElement as g, html as l } from "lit";
+import { property as h, customElement as f } from "lit/decorators.js";
+import { styleMap as m } from "lit/directives/style-map.js";
+import { parseSVG as x } from "../../utils/basicUtils.js";
+import { classMap as u } from "lit/directives/class-map.js";
+import { isTemplateResult as w } from "lit/directive-helpers.js";
+import d from "./responsive-svg.styles.js";
+import { StyleController as c } from "../../controllers/StyleController.js";
+import { exposeParts as y } from "../../decorators/ExposeParts.js";
+var M = Object.defineProperty, A = Object.getOwnPropertyDescriptor, p = (t, e, r, o) => {
+  for (var s = o > 1 ? void 0 : o ? A(e, r) : e, i = t.length - 1, a; i >= 0; i--)
+    (a = t[i]) && (s = (o ? a(e, r, s) : a(s)) || s);
+  return o && s && M(e, r, s), s;
 };
-const l = [
+const v = [
   "none",
   "xMinYMin",
   "xMidYMin",
@@ -21,19 +23,23 @@ const l = [
   "xMinYMax",
   "xMidYMax",
   "xMaxYMax"
-], A = ["meet", "slice"], M = [
-  ...l,
-  ...l.flatMap((t) => A.map((e) => `${t} ${e}`))
-], _ = new Set(M);
-function R(t) {
+], S = ["meet", "slice"], R = [
+  ...v,
+  ...v.flatMap((t) => S.map((e) => `${t} ${e}`))
+], _ = new Set(R);
+function B(t) {
   return _.has(t);
 }
-let p = class extends g {
+let n = class extends g {
   constructor() {
-    super(...arguments), this.autofit = !1, this.svgColors = !1, this.viewBox = { x: 0, y: 0, width: 0, height: 0 };
+    super(...arguments), this.autofit = !1, this.svgColors = !1, this.viewBox = { x: 0, y: 0, width: 0, height: 0 }, this._widthController = new c(this, "--svg-width", (t) => {
+      this.viewBox = { ...this.viewBox, width: parseFloat(t) || 0 };
+    }), this._heightController = new c(this, "--svg-height", (t) => {
+      this.viewBox = { ...this.viewBox, height: parseFloat(t) || 0 };
+    });
   }
   set svg(t) {
-    const e = t instanceof SVGElement || x(t) ? t : u(t);
+    const e = t instanceof SVGElement || w(t) ? t : x(t);
     e instanceof Element && !(e instanceof SVGElement) || (this._svg = e);
   }
   get svg() {
@@ -45,7 +51,7 @@ let p = class extends g {
   get preserveAspectRatio() {
     if (this._preserveAspectRatio == null && this.svg instanceof SVGElement) {
       const t = this.svg.getAttribute("preserveAspectRatio") || "";
-      if (R(t)) return t;
+      if (B(t)) return t;
     }
     return this._preserveAspectRatio || "xMidYMid meet";
   }
@@ -53,33 +59,35 @@ let p = class extends g {
   svgClasses() {
     return {};
   }
-  willUpdate(t) {
-    if (super.willUpdate(t), this.svg instanceof SVGElement) {
-      const e = this.getViewBoxSize(this.svg), i = this.svg.getAttribute("width"), o = this.svg.getAttribute("height");
-      this.viewBox = e ?? { x: 0, y: 0, width: Number(i) || 0, height: Number(o) || 0 };
-    } else {
-      const e = this.style.getPropertyValue("--svg-width"), i = this.style.getPropertyValue("--svg-height");
-      this.viewBox = { x: 0, y: 0, width: parseFloat(e) || 0, height: parseFloat(i) || 0 };
+  connectedCallback() {
+    if (super.connectedCallback(), this.svg instanceof SVGElement) {
+      const t = this.getViewBoxSize(this.svg), e = parseFloat(this.svg.getAttribute("width") || "0"), r = parseFloat(this.svg.getAttribute("height") || "0");
+      this.viewBox = {
+        x: t?.x ?? 0,
+        y: t?.y ?? 0,
+        width: this.viewBox.width || (t?.width ?? e),
+        height: this.viewBox.height || (t?.height ?? r)
+      };
     }
   }
   render() {
-    const t = this.viewBox, e = this.preserveAspectRatio, i = this.svgClasses();
-    if (typeof this.svg == "string") return c`<p style="font-size: initial;">⚠️ SVG Error</p>`;
+    const t = this.viewBox, e = this.preserveAspectRatio, r = this.svgClasses();
+    if (t.height === 0 || t.width === 0) return l`<p style="font-size: initial;">⚠️ SVG ViewBox</p>`;
+    if (typeof this.svg == "string") return l`<p style="font-size: initial;">⚠️ SVG Error</p>`;
     if (this.svg instanceof SVGElement) {
       const s = this.svg.cloneNode(!0);
-      return this.applyPartToPaths(s, "__path"), o(Array.from(s.children), t);
+      return o(Array.from(s.children), t);
     } else return o(this.svg, t);
-    function o(s, r) {
+    function o(s, i) {
       if (s)
-        return c`
+        return l`
 					<svg
-						part="__svg"
-						class=${m(i)}
-						style=${f({
-          "--svg-width-fallback": `${r.width}em`,
-          "--svg-height-fallback": `${r.height}em`
+						class=${u(r)}
+						style=${m({
+          "--svg-width-fallback": `${i.width}em`,
+          "--svg-height-fallback": `${i.height}em`
         })}
-						viewBox="${r.x} ${r.y} ${r.width} ${r.height}"
+						viewBox="${i.x} ${i.y} ${i.width} ${i.height}"
 						preserveAspectRatio=${e}
 						xmlns="http://www.w3.org/2000/svg"
 					>
@@ -88,14 +96,6 @@ let p = class extends g {
 				`;
     }
   }
-  /** Applies a part name to all paths in the given element. */
-  applyPartToPaths(t, e) {
-    if (t instanceof Element) {
-      t.tagName.toLowerCase() === "path" && t.setAttribute("part", e);
-      for (const i of Array.from(t.children))
-        this.applyPartToPaths(i, e);
-    }
-  }
   /**
    * Gets the viewBox dimensions from an SVG element.
    * @param svg The SVG to get the attribute from.
@@ -106,25 +106,26 @@ let p = class extends g {
     return e ? { x: +e[0], y: +e[1], width: +e[2], height: +e[3] } : null;
   }
 };
-p.styles = [y];
-n([
-  a({ type: Boolean, reflect: !0 })
-], p.prototype, "autofit", 2);
-n([
-  a({ type: Boolean, reflect: !0 })
-], p.prototype, "svgColors", 2);
-n([
-  a({ type: Object })
-], p.prototype, "svg", 1);
-n([
-  a({ type: String, reflect: !0 })
-], p.prototype, "preserveAspectRatio", 1);
-p = n([
-  v("responsive-svg")
-], p);
+n.styles = [d];
+p([
+  h({ type: Boolean, reflect: !0 })
+], n.prototype, "autofit", 2);
+p([
+  h({ type: Boolean, reflect: !0 })
+], n.prototype, "svgColors", 2);
+p([
+  y(["svg", "path"]),
+  h({ type: Object })
+], n.prototype, "svg", 1);
+p([
+  h({ type: String, reflect: !0 })
+], n.prototype, "preserveAspectRatio", 1);
+n = p([
+  f("responsive-svg")
+], n);
 export {
-  p as ResponsiveSvg,
-  l as preserveAspectRatioAlignOptions,
-  M as preserveAspectRatioOptions,
-  A as preserveAspectRatioSpacingOptions
+  n as ResponsiveSvg,
+  v as preserveAspectRatioAlignOptions,
+  R as preserveAspectRatioOptions,
+  S as preserveAspectRatioSpacingOptions
 };

package/dist/controllers/ResponsiveController.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ResponsiveController.d.ts","sourceRoot":"","sources":["../../src/controllers/ResponsiveController.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,sBAAsB,EAAE,MAAM,KAAK,CAAC;AAEjE,qBAAa,oBAAqB,YAAW,kBAAkB;IAC9D,QAAQ,EAAE,OAAO,CAAS;IAC1B,OAAO,CAAC,IAAI,CAAyB;IACrC,OAAO,CAAC,cAAc,CAAiB;IACvC,OAAO,CAAC,sBAAsB,CAAuC;gBAEzD,IAAI,EAAE,sBAAsB,EAAE,gBAAgB,GAAE,MAAgB;IAS5E,aAAa,IAAI,IAAI;IAMrB,gBAAgB,IAAI,IAAI;CAGxB"}

package/dist/controllers/StyleController.d.ts

@@ -0,0 +1,12 @@
+import { ReactiveController, ReactiveControllerHost } from 'lit';
+export declare class StyleController implements ReactiveController {
+    private host;
+    private property;
+    private callback?;
+    private observer?;
+    value: string;
+    constructor(host: ReactiveControllerHost & HTMLElement, property: string, callback?: ((val: string) => void) | undefined);
+    hostConnected(): void;
+    hostDisconnected(): void;
+}
+//# sourceMappingURL=StyleController.d.ts.map

package/dist/controllers/StyleController.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StyleController.d.ts","sourceRoot":"","sources":["../../src/controllers/StyleController.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,sBAAsB,EAAE,MAAM,KAAK,CAAC;AAGjE,qBAAa,eAAgB,YAAW,kBAAkB;IAKxD,OAAO,CAAC,IAAI;IACZ,OAAO,CAAC,QAAQ;IAChB,OAAO,CAAC,QAAQ,CAAC;IANlB,OAAO,CAAC,QAAQ,CAAC,CAAgB;IAC1B,KAAK,EAAE,MAAM,CAAM;gBAGjB,IAAI,EAAE,sBAAsB,GAAG,WAAW,EAC1C,QAAQ,EAAE,MAAM,EAChB,QAAQ,CAAC,GAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,aAAA;IAKzC,aAAa;IAkBb,gBAAgB;CAGhB"}

package/dist/controllers/StyleController.js

@@ -0,0 +1,20 @@
+import i from "../node_modules/style-observer/src/style-observer.js";
+import "../node_modules/style-observer/src/element-style-observer.js";
+class l {
+  constructor(s, t, e) {
+    this.host = s, this.property = t, this.callback = e, this.value = "", this.host.addController(this);
+  }
+  hostConnected() {
+    const s = window.getComputedStyle(this.host).getPropertyValue(this.property);
+    this.value = s.trim(), this.callback?.(this.value), this.observer = new i((t) => {
+      const e = t[t.length - 1].value.trim();
+      e !== this.value && (this.value = e, this.callback?.(this.value), this.host.requestUpdate());
+    }), this.observer.observe(this.host, this.property);
+  }
+  hostDisconnected() {
+    this.observer?.unobserve();
+  }
+}
+export {
+  l as StyleController
+};

package/dist/decorators/ExposeParts.d.ts

@@ -0,0 +1,6 @@
+import { ReactiveElement } from 'lit';
+type PartMap = string | Record<string, string>;
+/** Property decorator that exposes parts and updates them when the property changes. */
+export declare function exposeParts<T extends ReactiveElement>(partMap: PartMap[]): (proto: T, key: string & keyof T) => void;
+export {};
+//# sourceMappingURL=ExposeParts.d.ts.map

package/dist/decorators/ExposeParts.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ExposeParts.d.ts","sourceRoot":"","sources":["../../src/decorators/ExposeParts.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAA8C,MAAM,KAAK,CAAC;AAOlF,KAAK,OAAO,GAAG,MAAM,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;AAgD/C,wFAAwF;AACxF,wBAAgB,WAAW,CAAC,CAAC,SAAS,eAAe,EAAE,OAAO,EAAE,OAAO,EAAE,IAChE,OAAO,CAAC,EAAE,KAAK,MAAM,GAAG,MAAM,CAAC,UAWvC"}

package/dist/decorators/ExposeParts.js

@@ -0,0 +1,39 @@
+class n {
+  constructor(t, r, s) {
+    this.host = t, this.getValue = r, this.normalizedMap = {}, t.addController(this);
+    for (const e of s)
+      typeof e == "string" ? this.normalizedMap[e] = e : Object.assign(this.normalizedMap, e);
+  }
+  hostUpdated() {
+    const t = this.getValue();
+    t !== this.lastValue && (this.lastValue = t, this._apply());
+  }
+  /** Applies the parts in the map to the relevant elements. */
+  _apply() {
+    const t = this.host.shadowRoot;
+    if (t)
+      for (const [r, s] of Object.entries(this.normalizedMap)) {
+        const e = t.querySelectorAll(r), i = this._prefix(s);
+        for (const a of e)
+          a.getAttribute("part") !== i && a.setAttribute("part", i);
+      }
+  }
+  /** Sanitizes name (removes CSS selectors), and prefixes partName */
+  _prefix(t) {
+    return `__${t.replace(/[.#]/g, "")}`;
+  }
+}
+function l(o) {
+  return (t, r) => {
+    t.constructor.addInitializer((e) => {
+      new n(
+        e,
+        () => e[r],
+        o
+      );
+    });
+  };
+}
+export {
+  l as exposeParts
+};

package/dist/node_modules/style-observer/src/element-style-observer.js

@@ -0,0 +1,214 @@
+import a from "./util/Bug.js";
+import "./util/bugs/transitionrun-loop.js";
+import "./util/bugs/unregistered-transition.js";
+import "./util/bugs/adopted-style-sheet.js";
+import p from "./util/gentle-register-property.js";
+import d from "./util/MultiWeakMap.js";
+import { toArray as h, getTimesFor as y, wait as u } from "./util.js";
+import g from "./rendered-observer.js";
+const f = globalThis.CSS?.supports?.("transition-behavior", "allow-discrete") ? " allow-discrete" : "";
+globalThis.document && (p("--style-observer-transition", { inherits: !1 }), a.detectAll());
+class O {
+  /**
+   * Observed properties to their old values.
+   * @type {Map<string, string>}
+   */
+  properties;
+  /**
+   * Get the names of all properties currently being observed.
+   * @type { string[] }
+   */
+  get propertyNames() {
+    return [...this.properties.keys()];
+  }
+  /**
+   * The element being observed.
+   * @type {Element}
+   */
+  target;
+  /**
+   * The callback to call when the element's style changes.
+   * @type {StyleObserverCallback}
+   */
+  callback;
+  /**
+   * The observer options.
+   * @type {StyleObserverOptions}
+   */
+  options;
+  /**
+   * Whether the observer has been initialized.
+   * @type {boolean}
+   */
+  #t = !1;
+  /**
+   * @param {Element} target
+   * @param {StyleObserverCallback} callback
+   * @param {StyleObserverOptions} [options]
+   */
+  constructor(t, r, s = {}) {
+    this.constructor.all.add(t, this), this.properties = /* @__PURE__ */ new Map(), this.target = t, this.callback = r, this.options = { properties: [], ...s };
+    let e = h(s.properties);
+    this.renderedObserver = new g((i) => {
+      this.propertyNames.length > 0 && this.handleEvent();
+    }), e.length > 0 && this.observe(e);
+  }
+  /**
+   * Called the first time observe() is called to initialize the target.
+   */
+  #s() {
+    if (this.#t)
+      return;
+    let t = this.constructor.all.get(this.target).size === 1;
+    this.updateTransition({ firstTime: t }), this.#t = !0;
+  }
+  resolveOptions(t) {
+    return Object.assign(c(t), this.options);
+  }
+  /**
+   * Handle a potential property change
+   * @private
+   * @param {TransitionEvent} [event]
+   */
+  async handleEvent(t) {
+    if (t && !this.properties.has(t.propertyName))
+      return;
+    if (a.TRANSITIONRUN_EVENT_LOOP && t?.type === "transitionrun" || this.options.throttle > 0) {
+      let e = a.TRANSITIONRUN_EVENT_LOOP ? "transitionrun" : "transitionstart", i = Math.max(this.options.throttle, 50);
+      if (a.TRANSITIONRUN_EVENT_LOOP) {
+        let n = y(
+          t.propertyName,
+          getComputedStyle(this.target).transition
+        );
+        i = Math.max(i, n.duration + n.delay + 16);
+      }
+      this.target.removeEventListener(e, this), await u(i), this.target.addEventListener(e, this);
+    }
+    let r = getComputedStyle(this.target), s = [];
+    for (let e of this.propertyNames) {
+      let i = r.getPropertyValue(e), n = this.properties.get(e);
+      i !== n && (s.push({ target: this.target, property: e, value: i, oldValue: n }), this.properties.set(e, i));
+    }
+    s.length > 0 && this.callback(s);
+  }
+  /**
+   * Observe the target for changes to one or more CSS properties.
+   * @param {string | string[]} properties
+   * @return {void}
+   */
+  observe(t) {
+    if (t = h(t), t = t.filter((s) => !this.properties.has(s)), t.length === 0)
+      return;
+    this.#s();
+    let r = getComputedStyle(this.target);
+    for (let s of t) {
+      a.UNREGISTERED_TRANSITION && !this.constructor.properties.has(s) && (p(s, void 0, this.target.ownerDocument), this.constructor.properties.add(s));
+      let e = r.getPropertyValue(s);
+      this.properties.set(s, e);
+    }
+    a.TRANSITIONRUN_EVENT_LOOP && (this.target.addEventListener("transitionrun", this), a.all.TRANSITIONRUN_EVENT_LOOP.valuePending?.then((s) => {
+      s || this.target.removeEventListener("transitionrun", this);
+    })), this.target.addEventListener("transitionstart", this), this.target.addEventListener("transitionend", this), this.updateTransitionProperties(), this.renderedObserver.observe(this.target);
+  }
+  /**
+   * Update the `--style-observer-transition` property to include all observed properties.
+   */
+  updateTransitionProperties() {
+    this.setProperty("--style-observer-transition", "");
+    let t = new Set(
+      getComputedStyle(this.target).transitionProperty.split(", ")
+    ), r = [];
+    for (let e of this.constructor.all.get(this.target))
+      r.push(...e.propertyNames);
+    r = [...new Set(r)];
+    let s = r.filter((e) => !t.has(e)).map((e) => `${e} 1ms step-start${f}`).join(", ");
+    this.setProperty("--style-observer-transition", s);
+  }
+  /**
+   * @type { string | undefined }
+   */
+  #e;
+  /**
+   * Update the target's transition property or refresh it if it was overwritten.
+   * @param {object} options
+   * @param {boolean} [options.firstTime] - Whether this is the first time the transition is being set.
+   */
+  updateTransition({ firstTime: t } = {}) {
+    const r = "var(--style-observer-transition, --style-observer-noop)", s = this.getProperty("transition");
+    let e;
+    (t ? s : !s.includes(r)) && (e = this.#e = s), e === void 0 && (t || !this.#e) && (s.includes(r) && this.setProperty("transition", ""), e = getComputedStyle(this.target).transition), e === "all" ? e = "" : e = e.replace(/^none\b/, "");
+    const i = e ? e + ", " : "";
+    this.setProperty("transition", i + r), this.updateTransitionProperties();
+  }
+  /**
+   * Whether the target has an open shadow root (and the modern adoptedStyleSheets API is supported).
+   * @type { boolean }
+   * @private
+   */
+  get _isHost() {
+    return this.target.shadowRoot && !a.ADOPTED_STYLE_SHEET && !Object.isFrozen(this.target.shadowRoot.adoptedStyleSheets);
+  }
+  /**
+   * Shadow style sheet. Only used if _isHost is true.
+   * @type { CSSStyleSheet | undefined }
+   * @private
+   */
+  _shadowSheet;
+  /**
+   * Any styles we've set on the target, for any reason.
+   * @type { Record<string, string> }
+   * @private
+   */
+  _styles = {};
+  /**
+   * Set a CSS property on the target.
+   * @param {string} property
+   * @param {string} value
+   * @param {string} [priority]
+   * @return {void}
+   */
+  setProperty(t, r, s) {
+    let e = this.target.style, i = e;
+    if (this._isHost) {
+      if (!this._shadowSheet && (this._shadowSheet = new CSSStyleSheet(), this._shadowSheet.insertRule(":host { }"), this.target.shadowRoot.adoptedStyleSheets.push(this._shadowSheet), Object.keys(this._styles).length > 0))
+        for (let n in this._styles) {
+          let l = this._styles[n];
+          this.setProperty(n, l), e.getPropertyValue(n) === l && e.removeProperty(n);
+        }
+      i = this._shadowSheet.cssRules[0].style;
+    }
+    i.setProperty(t, r, s), this._styles[t] = this.getProperty(t);
+  }
+  /**
+   * Get a CSS property from the target.
+   * @param {string} property
+   * @return {string}
+   */
+  getProperty(t) {
+    return (this._shadowSheet?.cssRules[0]?.style ?? this.target.style).getPropertyValue(t);
+  }
+  /**
+   * Stop observing a target for changes to one or more CSS properties.
+   * @param { string | string[] } [properties] Properties to stop observing. Defaults to all observed properties.
+   * @return {void}
+   */
+  unobserve(t) {
+    t = h(t), t = t.filter((r) => this.properties.has(r));
+    for (let r of t)
+      this.properties.delete(r);
+    this.properties.size === 0 && (this.target.removeEventListener("transitionrun", this), this.target.removeEventListener("transitionstart", this), this.target.removeEventListener("transitionend", this), this.renderedObserver.unobserve(this.target)), this.updateTransitionProperties();
+  }
+  /** All properties ever observed by this class. */
+  static properties = /* @__PURE__ */ new Set();
+  /**
+   * All instances ever observed by this class.
+   */
+  static all = new d();
+}
+function c(o) {
+  return o ? (typeof o == "string" || Array.isArray(o) ? o = { properties: h(o) } : typeof o == "object" && (o = { properties: [], ...o }), o) : {};
+}
+export {
+  O as default,
+  c as resolveOptions
+};

package/dist/node_modules/style-observer/src/rendered-observer.js

@@ -0,0 +1,46 @@
+class c {
+  /**
+   * All currently observed targets
+   * @type {WeakSet<Element>}
+   */
+  #e = /* @__PURE__ */ new Set();
+  /**
+   * Documents to IntersectionObserver instances
+   * @type {WeakMap<Document, IntersectionObserver>}
+   */
+  #t = /* @__PURE__ */ new WeakMap();
+  constructor(e) {
+    this.callback = e;
+  }
+  /**
+   * Begin observing the presence of an element.
+   * @param {Element} element - The element to observe.
+   */
+  observe(e) {
+    if (this.#e.has(e))
+      return;
+    let t = e.ownerDocument, s = this.#t.get(t);
+    s || (s = new IntersectionObserver(
+      (r) => {
+        this.callback(r.map(({ target: o }) => ({ target: o })));
+      },
+      { root: t.documentElement }
+    ), this.#t.set(t, s)), this.#e.add(e), s.observe(e);
+  }
+  /**
+   * Stop observing the presence of an element.
+   * @param {Element} [element] - The element to stop observing. If not provided, all targets will be unobserved.
+   */
+  unobserve(e) {
+    if (!e) {
+      for (const r of this.#e)
+        this.unobserve(r);
+      return;
+    }
+    let t = e.ownerDocument;
+    this.#t.get(t)?.unobserve(e), this.#e.delete(e);
+  }
+}
+export {
+  c as default
+};

package/dist/node_modules/style-observer/src/style-observer.js

@@ -0,0 +1,98 @@
+import h, { resolveOptions as g } from "./element-style-observer.js";
+import { toArray as n } from "./util.js";
+class p {
+  /**
+   * @type { WeakMap<Element, ElementStyleObserver> }
+   */
+  elementObservers = /* @__PURE__ */ new WeakMap();
+  /**
+   * @param {StyleObserverCallback} callback
+   * @param {StyleObserverOptions | string | string[]} [options]
+   */
+  constructor(t, e) {
+    this.callback = t, e = g(e), e.targets ??= [], e.target && e.targets.push(e.target), this.options = e, this.options.targets.length > 0 && this.options.properties.length > 0 && this.observe(this.options.targets, this.options.properties);
+  }
+  /**
+   * @type {StyleObserverCallback}
+   */
+  changed(t) {
+    this.callback(t);
+  }
+  /**
+   * Observe one or more targets for changes to one or more CSS properties.
+   *
+   * @overload
+   * @param {Element | Element[]} targets
+   * @param {string | string[]} properties
+   * @returns {void}
+   *
+   * @overload
+   * @param {string | string[]} properties
+   * @param {Element | Element[]} targets
+   * @returns {void}
+   *
+   * @overload
+   * @param {...(string | Element | (string | Element)[]) } propertiesOrTargets
+   * @returns {void}
+   */
+  observe(...t) {
+    let { targets: e, properties: r } = l(...t);
+    if (e.length === 0 && (e = this.options.targets), e.length !== 0)
+      for (let i of e) {
+        let s = this.elementObservers.get(i);
+        s || (s = new h(
+          i,
+          (a) => this.changed(a),
+          this.options
+        ), this.elementObservers.set(i, s)), s.observe(r);
+      }
+  }
+  /**
+   * Stop observing one or more targets for changes to one or more CSS properties.
+   *
+   * @overload
+   * @param {Element | Element[]} targets
+   * @param {string | string[]} properties
+   * @returns {void}
+   *
+   * @overload
+   * @param {string | string[]} properties
+   * @param {Element | Element[]} targets
+   * @returns {void}
+   *
+   * @overload
+   * @param {...(string | Element | (string | Element)[]) } propertiesOrTargets
+   * @returns {void}
+   */
+  unobserve(...t) {
+    let { targets: e, properties: r } = l(...t);
+    if (e.length === 0 && (e = this.options.targets), e.length !== 0) {
+      r.length === 0 && (r = this.options.properties);
+      for (let i of e) {
+        let s = this.elementObservers.get(i);
+        s && s.unobserve(r);
+      }
+    }
+  }
+  /**
+   * Update the transition for one or more targets.
+   * @param {Element | Element[]} targets
+   * @returns {void}
+   */
+  updateTransition(t) {
+    for (let e of n(t)) {
+      let r = this.elementObservers.get(e);
+      r && r.updateTransition();
+    }
+  }
+}
+function l(o, t) {
+  let e = [...n(o), ...n(t)];
+  o = [], t = [];
+  for (let r of e)
+    (typeof r == "string" || r instanceof String ? t : o).push(r);
+  return { targets: o, properties: t };
+}
+export {
+  p as default
+};