@editora/ui-core 0.1.9 → 0.1.12

package/dist/number-ticker.esm.js

@@ -0,0 +1,749 @@
+import { E as M } from "./ElementBase-909688f3.mjs";
+const y = 1200, A = 0, I = "ease-out", O = "decimal", v = 0, S = 0.4, F = 6, L = /* @__PURE__ */ new Set([
+  "linear",
+  "ease-in",
+  "ease-out",
+  "ease-in-out",
+  "spring",
+  "bounce",
+  "overshoot"
+]), N = /* @__PURE__ */ new Set(["decimal", "currency"]), $ = /* @__PURE__ */ new Set(["symbol", "narrowSymbol", "code", "name"]), R = /* @__PURE__ */ new Set(["standard", "compact"]), G = /* @__PURE__ */ new Set(["short", "long"]), U = /* @__PURE__ */ new Set(["auto", "always", "exceptZero", "never"]), H = /* @__PURE__ */ new Set(["interpolate", "odometer"]), Q = /* @__PURE__ */ new Set(["immediate", "visible"]), q = /* @__PURE__ */ new Set(["start", "end", "center"]), a = {
+  sm: {
+    fontSize: "14px",
+    letterSpacing: "-0.02em",
+    lineHeight: "1"
+  },
+  md: {
+    fontSize: "22px",
+    letterSpacing: "-0.04em",
+    lineHeight: "0.98"
+  },
+  lg: {
+    fontSize: "36px",
+    letterSpacing: "-0.05em",
+    lineHeight: "0.94"
+  },
+  xl: {
+    fontSize: "56px",
+    letterSpacing: "-0.06em",
+    lineHeight: "0.9"
+  }
+}, B = ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9"], Y = `
+  :host {
+    --ui-number-ticker-color: var(--ui-color-text, var(--ui-text, #0f172a));
+    --ui-number-ticker-accent: var(--ui-color-primary, var(--ui-primary, #2563eb));
+    --ui-number-ticker-font-size: ${a.md.fontSize};
+    --ui-number-ticker-font-weight: 780;
+    --ui-number-ticker-letter-spacing: ${a.md.letterSpacing};
+    --ui-number-ticker-line-height: ${a.md.lineHeight};
+    --ui-number-ticker-align: start;
+    --ui-number-ticker-roll-duration: 520ms;
+    --ui-number-ticker-roll-ease: cubic-bezier(0.22, 1, 0.36, 1);
+    --ui-number-ticker-transition:
+      color 180ms cubic-bezier(0.2, 0.9, 0.24, 1),
+      text-shadow 180ms cubic-bezier(0.2, 0.9, 0.24, 1);
+
+    display: inline-grid;
+    min-inline-size: 0;
+    color: var(--ui-number-ticker-color);
+    font-family: "IBM Plex Sans", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
+    font-variant-numeric: tabular-nums lining-nums;
+    box-sizing: border-box;
+  }
+
+  :host([size="sm"]),
+  :host([size="1"]) {
+    --ui-number-ticker-font-size: ${a.sm.fontSize};
+    --ui-number-ticker-letter-spacing: ${a.sm.letterSpacing};
+    --ui-number-ticker-line-height: ${a.sm.lineHeight};
+  }
+
+  :host([size="md"]),
+  :host([size="2"]) {
+    --ui-number-ticker-font-size: ${a.md.fontSize};
+    --ui-number-ticker-letter-spacing: ${a.md.letterSpacing};
+    --ui-number-ticker-line-height: ${a.md.lineHeight};
+  }
+
+  :host([size="lg"]),
+  :host([size="3"]) {
+    --ui-number-ticker-font-size: ${a.lg.fontSize};
+    --ui-number-ticker-letter-spacing: ${a.lg.letterSpacing};
+    --ui-number-ticker-line-height: ${a.lg.lineHeight};
+  }
+
+  :host([size="xl"]),
+  :host([size="4"]) {
+    --ui-number-ticker-font-size: ${a.xl.fontSize};
+    --ui-number-ticker-letter-spacing: ${a.xl.letterSpacing};
+    --ui-number-ticker-line-height: ${a.xl.lineHeight};
+  }
+
+  :host([tone="neutral"]) {
+    --ui-number-ticker-color: #64748b;
+  }
+
+  :host([tone="info"]) {
+    --ui-number-ticker-color: #0ea5e9;
+  }
+
+  :host([tone="success"]) {
+    --ui-number-ticker-color: var(--ui-color-success, #16a34a);
+  }
+
+  :host([tone="warning"]) {
+    --ui-number-ticker-color: var(--ui-color-warning, #d97706);
+  }
+
+  :host([tone="danger"]) {
+    --ui-number-ticker-color: var(--ui-color-danger, #dc2626);
+  }
+
+  :host([align="left"]),
+  :host([align="start"]) {
+    --ui-number-ticker-align: start;
+  }
+
+  :host([align="center"]) {
+    --ui-number-ticker-align: center;
+  }
+
+  :host([align="right"]),
+  :host([align="end"]) {
+    --ui-number-ticker-align: end;
+  }
+
+  :host([monospace]) .value {
+    font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, "Liberation Mono", monospace;
+  }
+
+  :host([tabular="false"]) {
+    font-variant-numeric: lining-nums proportional-nums;
+  }
+
+  .ticker {
+    display: inline-flex;
+    justify-content: var(--ui-number-ticker-align);
+    align-items: baseline;
+    min-inline-size: 0;
+  }
+
+  .value {
+    display: inline-flex;
+    align-items: baseline;
+    min-inline-size: 0;
+    color: var(--ui-number-ticker-color);
+    font-size: var(--ui-number-ticker-font-size);
+    font-weight: var(--ui-number-ticker-font-weight);
+    line-height: var(--ui-number-ticker-line-height);
+    letter-spacing: var(--ui-number-ticker-letter-spacing);
+    white-space: nowrap;
+    text-wrap: nowrap;
+    text-shadow:
+      0 1px 0 color-mix(in srgb, #ffffff 52%, transparent),
+      0 12px 30px color-mix(in srgb, var(--ui-number-ticker-accent) 8%, transparent);
+    transition: var(--ui-number-ticker-transition);
+  }
+
+  .value[data-mode="odometer"] {
+    align-items: center;
+    gap: 0.02em;
+  }
+
+  .char {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    min-inline-size: 0;
+  }
+
+  .symbol {
+    opacity: 0.88;
+  }
+
+  .digit {
+    display: inline-flex;
+    align-items: center;
+    block-size: 1em;
+    overflow: hidden;
+    contain: content;
+  }
+
+  .digit-window {
+    display: inline-flex;
+    block-size: 1em;
+    overflow: hidden;
+    transform: translateZ(0);
+  }
+
+  .digit-track {
+    display: grid;
+    grid-auto-rows: 1em;
+    will-change: transform;
+    transition-property: transform;
+    transition-duration: var(--ui-number-ticker-roll-duration);
+    transition-timing-function: var(--ui-number-ticker-roll-ease);
+    transition-delay: var(--ui-number-ticker-digit-delay, 0ms);
+    transform: translate3d(0, calc(var(--ui-number-ticker-digit-value, 0) * -1em), 0);
+  }
+
+  .digit-track > span {
+    display: grid;
+    place-items: center;
+    block-size: 1em;
+    inline-size: 0.72em;
+  }
+
+  :host([data-state="waiting"]) .value {
+    opacity: 0.92;
+  }
+
+  :host([data-animation="odometer"][data-direction="up"]) .digit-track {
+    transition-duration: min(calc(var(--ui-number-ticker-roll-duration) + 40ms), 900ms);
+  }
+
+  :host([data-direction="up"]) .value {
+    text-shadow:
+      0 1px 0 color-mix(in srgb, #ffffff 52%, transparent),
+      0 14px 34px color-mix(in srgb, var(--ui-number-ticker-accent) 12%, transparent);
+  }
+
+  :host([data-direction="down"]) .value {
+    text-shadow:
+      0 1px 0 color-mix(in srgb, #ffffff 52%, transparent),
+      0 10px 24px color-mix(in srgb, var(--ui-number-ticker-accent) 7%, transparent);
+  }
+
+  @media (prefers-contrast: more) {
+    .value {
+      text-shadow: none;
+    }
+  }
+
+  @media (forced-colors: active) {
+    :host {
+      --ui-number-ticker-color: CanvasText;
+      --ui-number-ticker-accent: CanvasText;
+    }
+
+    .value {
+      forced-color-adjust: none;
+      text-shadow: none;
+    }
+  }
+`;
+class W extends M {
+  constructor() {
+    super(), this._valueEl = null, this._frame = null, this._currentValue = 0, this._animationFrom = 0, this._animationTo = 0, this._animationDuration = y, this._animationDelay = A, this._animationStartTime = 0, this._pausedElapsed = 0, this._animationPrepared = !1, this._initialized = !1, this._hovering = !1, this._focusWithin = !1, this._formatter = new Intl.NumberFormat(), this._mediaQuery = null, this._customFormatter = null, this._intersectionObserver = null, this._observerThreshold = S, this._isVisible = !0, this._visibilityGatePending = !1, this._tick = this._tick.bind(this), this._onPointerEnter = this._onPointerEnter.bind(this), this._onPointerLeave = this._onPointerLeave.bind(this), this._onFocusIn = this._onFocusIn.bind(this), this._onFocusOut = this._onFocusOut.bind(this), this._onReducedMotionChange = this._onReducedMotionChange.bind(this), this._onVisibilityChange = this._onVisibilityChange.bind(this);
+  }
+  static get observedAttributes() {
+    return [
+      "value",
+      "from",
+      "duration",
+      "delay",
+      "easing",
+      "animation",
+      "locale",
+      "format-style",
+      "currency",
+      "currency-display",
+      "notation",
+      "compact-display",
+      "fraction-digits",
+      "use-grouping",
+      "sign-display",
+      "prefix",
+      "suffix",
+      "size",
+      "tone",
+      "align",
+      "font-size",
+      "font-weight",
+      "letter-spacing",
+      "color",
+      "tabular",
+      "monospace",
+      "paused",
+      "pause-on-hover",
+      "pause-on-focus",
+      "trigger",
+      "visibility-threshold",
+      "stagger",
+      "stagger-from"
+    ];
+  }
+  get formatter() {
+    return this._customFormatter;
+  }
+  set formatter(t) {
+    this._customFormatter = typeof t == "function" ? t : null, this._valueEl && this._renderValue(this._currentValue);
+  }
+  shouldRenderOnAttributeChange() {
+    return !1;
+  }
+  connectedCallback() {
+    this._bindReducedMotion(), super.connectedCallback(), this.hasAttribute("aria-live") || this.setAttribute("aria-live", "off"), this.addEventListener("pointerenter", this._onPointerEnter), this.addEventListener("pointerleave", this._onPointerLeave), this.addEventListener("focusin", this._onFocusIn), this.addEventListener("focusout", this._onFocusOut), this._syncVisibilityObserver(), this._syncFromAttributes(!1);
+  }
+  disconnectedCallback() {
+    if (this.removeEventListener("pointerenter", this._onPointerEnter), this.removeEventListener("pointerleave", this._onPointerLeave), this.removeEventListener("focusin", this._onFocusIn), this.removeEventListener("focusout", this._onFocusOut), this._mediaQuery) {
+      try {
+        this._mediaQuery.removeEventListener("change", this._onReducedMotionChange);
+      } catch {
+        this._mediaQuery.removeListener(this._onReducedMotionChange);
+      }
+      this._mediaQuery = null;
+    }
+    this._disconnectVisibilityObserver(), this._stopAnimation(), super.disconnectedCallback();
+  }
+  play() {
+    this.removeAttribute("paused"), this._syncFromAttributes(!1);
+  }
+  pause() {
+    this.setAttribute("paused", ""), this._syncFromAttributes(!1);
+  }
+  refresh() {
+    m(this.getAttribute("trigger")) === "visible" && (this._visibilityGatePending = !0), this._syncFromAttributes(!0);
+  }
+  finish() {
+    const t = this._resolvedTargetValue();
+    this._stopAnimation(), this._animationPrepared = !1, this._visibilityGatePending = !1, this._currentValue = t, this._renderValue(t), this._setDirection(this._resolvedBaseValue(), t), this._setState("completed");
+  }
+  attributeChangedCallback(t, i, n) {
+    super.attributeChangedCallback(t, i, n), !(!t || i === n || !this.isConnected || !this._valueEl) && ((t === "trigger" || t === "visibility-threshold") && (t === "trigger" && m(n ?? null) === "visible" && !this._initialized && (this._visibilityGatePending = !0), this._syncVisibilityObserver()), this._syncFromAttributes(t === "from"));
+  }
+  render() {
+    this.setContent(`
+      <style>${Y}</style>
+      <span class="ticker" part="root">
+        <span class="value" part="value"></span>
+      </span>
+    `), this._valueEl = this.root.querySelector(".value"), this._syncFromAttributes(!this._initialized);
+  }
+  _syncFromAttributes(t) {
+    if (!this._valueEl)
+      return;
+    this._syncStyleOverrides(), this._syncVisibilityObserver(), this._formatter = this._createFormatter(), this._syncMotionPresentation();
+    const i = this._resolvedTargetValue(), n = this._resolvedBaseValue();
+    !this._initialized || t ? (this._currentValue = n, this._renderValue(n), m(this.getAttribute("trigger")) === "visible" && (this._visibilityGatePending = !0)) : this._renderValue(this._currentValue), this._setDirection(t ? n : this._currentValue, i), this._syncPlayback(i, n, t), this._initialized = !0;
+  }
+  _syncPlayback(t, i, n) {
+    const r = this._prefersReducedMotion(), s = this._effectivePaused();
+    if (this._visibilityGatePending) {
+      if (!this._isVisible) {
+        this._stopAnimation(), this._animationPrepared = !1, this._currentValue = i, this._renderValue(i), this._setState(s ? "paused" : "waiting");
+        return;
+      }
+      this._visibilityGatePending = !1;
+    }
+    if (r) {
+      this._stopAnimation(), this._animationPrepared = !1, this._currentValue = t, this._renderValue(t), this._setState(s ? "paused" : "completed");
+      return;
+    }
+    if (s) {
+      (n || !this._animationPrepared) && !o(i, t) && this._prepareAnimation(i, t), this._pauseAnimation(), this._setState("paused");
+      return;
+    }
+    if (o(this._currentValue, t)) {
+      this._stopAnimation(), this._animationPrepared = !1, this._currentValue = t, this._renderValue(t), this._setState("completed");
+      return;
+    }
+    if (n || !this._animationPrepared || !o(t, this._animationTo)) {
+      const d = n ? i : this._currentValue;
+      this._prepareAnimation(d, t);
+    }
+    this._resumeAnimation();
+  }
+  _prepareAnimation(t, i) {
+    if (this._stopAnimation(), this._animationFrom = t, this._animationTo = i, this._animationDuration = Math.max(0, p(this.getAttribute("duration"), y)), this._animationDelay = Math.max(0, p(this.getAttribute("delay"), A)), this._animationStartTime = 0, this._pausedElapsed = 0, this._animationPrepared = !o(t, i), this._setDirection(t, i), this._syncMotionPresentation(), !this._animationPrepared || this._animationDuration === 0) {
+      this._currentValue = i, this._renderValue(i), this._setState("completed");
+      return;
+    }
+    this._renderValue(t);
+  }
+  _resumeAnimation() {
+    !this._animationPrepared || this._frame != null || !this.isConnected || (this._setState("running"), this._frame = this._requestFrame(this._tick));
+  }
+  _pauseAnimation() {
+    this._frame != null && (this._cancelFrame(this._frame), this._frame = null), this._animationPrepared && this._animationStartTime > 0 && (this._pausedElapsed = performance.now() - this._animationStartTime);
+  }
+  _stopAnimation() {
+    this._frame != null && (this._cancelFrame(this._frame), this._frame = null), this._animationStartTime = 0, this._pausedElapsed = 0;
+  }
+  _tick(t) {
+    if (this._frame = null, this._effectivePaused()) {
+      this._pauseAnimation(), this._setState("paused");
+      return;
+    }
+    if (!this._animationPrepared) {
+      this._setState("completed");
+      return;
+    }
+    this._animationStartTime === 0 && (this._animationStartTime = t - this._pausedElapsed);
+    const i = Math.max(0, t - this._animationStartTime);
+    if (i < this._animationDelay) {
+      this._renderValue(this._animationFrom), this._setState("running"), this._frame = this._requestFrame(this._tick);
+      return;
+    }
+    const n = c((i - this._animationDelay) / Math.max(this._animationDuration, 1), 0, 1), r = nt(x(this.getAttribute("easing")), n), s = this._animationFrom + (this._animationTo - this._animationFrom) * r;
+    if (this._currentValue = s, this._renderValue(s), n >= 1) {
+      this._animationPrepared = !1, this._animationStartTime = 0, this._pausedElapsed = 0, this._currentValue = this._animationTo, this._renderValue(this._animationTo), this._setState("completed");
+      return;
+    }
+    this._setState("running"), this._frame = this._requestFrame(this._tick);
+  }
+  _renderValue(t) {
+    if (!this._valueEl)
+      return;
+    const i = this._formatValue(t), n = j(this.getAttribute("animation"));
+    this.setAttribute("data-animation", n), this._valueEl.setAttribute("data-mode", n), n === "odometer" ? this._renderOdometer(i) : this._valueEl.textContent = i, this.setAttribute("data-value", t.toFixed(6)), this.setAttribute("data-rendered", i), this.hasAttribute("aria-label") || this.setAttribute("aria-label", i);
+  }
+  _renderOdometer(t) {
+    if (!this._valueEl)
+      return;
+    const i = document.createDocumentFragment(), n = Array.from(t).filter(V).length;
+    let r = 0;
+    const s = Math.max(0, p(this.getAttribute("stagger"), 0)), d = Z(this.getAttribute("stagger-from"));
+    for (const f of Array.from(t)) {
+      if (V(f)) {
+        const u = document.createElement("span");
+        u.className = "char digit", u.setAttribute("part", "digit"), u.style.setProperty(
+          "--ui-number-ticker-digit-delay",
+          `${ot(r, n, s, d)}ms`
+        );
+        const _ = document.createElement("span");
+        _.className = "digit-window";
+        const h = document.createElement("span");
+        h.className = "digit-track", h.style.setProperty("--ui-number-ticker-digit-value", String(Number(f)));
+        for (const C of B) {
+          const g = document.createElement("span");
+          g.textContent = C, h.appendChild(g);
+        }
+        _.appendChild(h), u.appendChild(_), i.appendChild(u), r += 1;
+        continue;
+      }
+      const l = document.createElement("span");
+      l.className = "char symbol", l.setAttribute("part", "symbol"), l.textContent = f, i.appendChild(l);
+    }
+    this._valueEl.replaceChildren(i);
+  }
+  _formatValue(t) {
+    const i = this.getAttribute("prefix") || "", n = this.getAttribute("suffix") || "", r = this._formatter.format(t), s = `${i}${r}${n}`;
+    if (this._customFormatter)
+      try {
+        return String(
+          this._customFormatter(t, {
+            formatted: s,
+            intl: r,
+            value: t,
+            prefix: i,
+            suffix: n,
+            locale: this.getAttribute("locale") || void 0,
+            formatStyle: k(this.getAttribute("format-style")),
+            currency: this.getAttribute("currency") || void 0,
+            notation: w(this.getAttribute("notation")),
+            signDisplay: z(this.getAttribute("sign-display")),
+            fractionDigits: D(
+              this.getAttribute("fraction-digits"),
+              this.getAttribute("value"),
+              this.getAttribute("from")
+            )
+          })
+        );
+      } catch {
+        return s;
+      }
+    return s;
+  }
+  _createFormatter() {
+    const t = k(this.getAttribute("format-style")), i = this.getAttribute("locale") || void 0, n = D(
+      this.getAttribute("fraction-digits"),
+      this.getAttribute("value"),
+      this.getAttribute("from")
+    ), r = {
+      style: t,
+      useGrouping: et(this.getAttribute("use-grouping"), !0),
+      signDisplay: z(this.getAttribute("sign-display")),
+      notation: w(this.getAttribute("notation"))
+    };
+    n != null ? (r.minimumFractionDigits = n, r.maximumFractionDigits = n) : t === "decimal" && (r.minimumFractionDigits = v, r.maximumFractionDigits = v), r.notation === "compact" && (r.compactDisplay = X(this.getAttribute("compact-display"))), t === "currency" && (r.currency = J(this.getAttribute("currency")), r.currencyDisplay = K(this.getAttribute("currency-display")));
+    try {
+      return new Intl.NumberFormat(i, r);
+    } catch {
+      const s = {
+        style: t === "currency" && r.currency ? "currency" : "decimal",
+        useGrouping: r.useGrouping,
+        signDisplay: r.signDisplay,
+        notation: r.notation,
+        minimumFractionDigits: r.minimumFractionDigits,
+        maximumFractionDigits: r.maximumFractionDigits
+      };
+      return s.notation === "compact" && (s.compactDisplay = r.compactDisplay), s.style === "currency" && r.currency && (s.currency = r.currency, s.currencyDisplay = r.currencyDisplay), new Intl.NumberFormat(void 0, s);
+    }
+  }
+  _syncStyleOverrides() {
+    E(this.style, "--ui-number-ticker-font-size", this.getAttribute("font-size")), P(this.style, "--ui-number-ticker-font-weight", this.getAttribute("font-weight")), E(this.style, "--ui-number-ticker-letter-spacing", this.getAttribute("letter-spacing")), P(this.style, "--ui-number-ticker-color", this.getAttribute("color"));
+  }
+  _syncMotionPresentation() {
+    this.style.setProperty(
+      "--ui-number-ticker-roll-duration",
+      `${Math.round(c(this._animationDuration * 0.55, 180, 900))}ms`
+    ), this.style.setProperty("--ui-number-ticker-roll-ease", at(x(this.getAttribute("easing"))));
+  }
+  _resolvedTargetValue() {
+    return b(this.getAttribute("value"), 0);
+  }
+  _resolvedBaseValue() {
+    return b(this.getAttribute("from"), 0);
+  }
+  _effectivePaused() {
+    return !!(this.hasAttribute("paused") || this.hasAttribute("pause-on-hover") && this._hovering || this.hasAttribute("pause-on-focus") && this._focusWithin);
+  }
+  _setState(t) {
+    this.setAttribute("data-state", t);
+  }
+  _setDirection(t, i) {
+    const n = o(t, i) ? "flat" : i > t ? "up" : "down";
+    this.setAttribute("data-direction", n);
+  }
+  _onPointerEnter() {
+    this._hovering = !0, this.hasAttribute("pause-on-hover") && this._syncFromAttributes(!1);
+  }
+  _onPointerLeave() {
+    this._hovering = !1, this.hasAttribute("pause-on-hover") && this._syncFromAttributes(!1);
+  }
+  _onFocusIn() {
+    this._focusWithin = !0, this.hasAttribute("pause-on-focus") && this._syncFromAttributes(!1);
+  }
+  _onFocusOut(t) {
+    const i = t.relatedTarget;
+    this._focusWithin = !!(i && this.contains(i)), this.hasAttribute("pause-on-focus") && this._syncFromAttributes(!1);
+  }
+  _bindReducedMotion() {
+    if (!(this._mediaQuery || typeof window > "u" || typeof window.matchMedia != "function")) {
+      this._mediaQuery = window.matchMedia("(prefers-reduced-motion: reduce)");
+      try {
+        this._mediaQuery.addEventListener("change", this._onReducedMotionChange);
+      } catch {
+        this._mediaQuery.addListener(this._onReducedMotionChange);
+      }
+    }
+  }
+  _onReducedMotionChange() {
+    this._syncFromAttributes(!1);
+  }
+  _syncVisibilityObserver() {
+    const t = m(this.getAttribute("trigger")), i = c(b(this.getAttribute("visibility-threshold"), S), 0, 1);
+    if (t !== "visible" || typeof IntersectionObserver != "function") {
+      this._disconnectVisibilityObserver(), this._isVisible = !0, this._observerThreshold = i;
+      return;
+    }
+    this._intersectionObserver && o(this._observerThreshold, i) || (this._disconnectVisibilityObserver(), this._observerThreshold = i, this._isVisible = !1, this._intersectionObserver = new IntersectionObserver(this._onVisibilityChange, {
+      threshold: ut(i)
+    }), this._intersectionObserver.observe(this));
+  }
+  _disconnectVisibilityObserver() {
+    this._intersectionObserver && (this._intersectionObserver.disconnect(), this._intersectionObserver = null);
+  }
+  _onVisibilityChange(t) {
+    const i = t[t.length - 1];
+    if (!i)
+      return;
+    const n = i.isIntersecting && i.intersectionRatio >= this._observerThreshold, r = n && !this._isVisible;
+    this._isVisible = n, r && this._visibilityGatePending && this._syncFromAttributes(!1);
+  }
+  _prefersReducedMotion() {
+    var t;
+    return !!((t = this._mediaQuery) != null && t.matches);
+  }
+  _requestFrame(t) {
+    return typeof requestAnimationFrame == "function" ? requestAnimationFrame(t) : window.setTimeout(() => t(performance.now()), 16);
+  }
+  _cancelFrame(t) {
+    if (typeof cancelAnimationFrame == "function") {
+      cancelAnimationFrame(t);
+      return;
+    }
+    window.clearTimeout(t);
+  }
+}
+function k(e) {
+  return e != null && N.has(e) ? e : O;
+}
+function j(e) {
+  return e != null && H.has(e) ? e : "interpolate";
+}
+function m(e) {
+  return e != null && Q.has(e) ? e : "immediate";
+}
+function Z(e) {
+  return e != null && q.has(e) ? e : "start";
+}
+function x(e) {
+  return e != null && L.has(e) ? e : I;
+}
+function K(e) {
+  return e != null && $.has(e) ? e : "symbol";
+}
+function w(e) {
+  return e != null && R.has(e) ? e : "standard";
+}
+function X(e) {
+  return e != null && G.has(e) ? e : "short";
+}
+function z(e) {
+  return e != null && U.has(e) ? e : "auto";
+}
+function J(e) {
+  const t = e == null ? void 0 : e.trim().toUpperCase();
+  return t && /^[A-Z]{3}$/.test(t) ? t : "USD";
+}
+function b(e, t) {
+  if (e == null || e.trim() === "")
+    return t;
+  const i = Number.parseFloat(e);
+  return Number.isFinite(i) ? i : t;
+}
+function p(e, t) {
+  if (e == null || e.trim() === "")
+    return t;
+  const i = e.trim().toLowerCase();
+  return /^-?\d+(\.\d+)?$/.test(i) || /^-?\d+(\.\d+)?ms$/.test(i) ? Number.parseFloat(i) : /^-?\d+(\.\d+)?s$/.test(i) ? Number.parseFloat(i) * 1e3 : t;
+}
+function tt(e, t) {
+  if (e == null || e.trim() === "")
+    return t;
+  const i = Number.parseInt(e, 10);
+  return Number.isFinite(i) ? i : t;
+}
+function et(e, t) {
+  if (e == null)
+    return t;
+  const i = e.trim().toLowerCase();
+  return i ? i === "false" || i === "0" || i === "off" || i === "no" ? !1 : i === "true" || i === "1" || i === "on" || i === "yes" ? !0 : t : !0;
+}
+function it(e) {
+  if (e == null || e.trim() === "")
+    return null;
+  const t = e.trim().split(/\s+/).filter(Boolean);
+  return t.length ? t.map((i) => /^-?\d+(\.\d+)?$/.test(i) ? `${i}px` : i).join(" ") : null;
+}
+function E(e, t, i) {
+  const n = it(i);
+  if (n == null) {
+    e.removeProperty(t);
+    return;
+  }
+  e.setProperty(t, n);
+}
+function P(e, t, i) {
+  const n = i == null ? void 0 : i.trim();
+  if (!n) {
+    e.removeProperty(t);
+    return;
+  }
+  e.setProperty(t, n);
+}
+function T(e) {
+  var n;
+  if (e == null)
+    return 0;
+  const t = e.trim();
+  if (!t)
+    return 0;
+  const i = t.match(/^-?\d+(?:\.(\d+))?$/);
+  return ((n = i == null ? void 0 : i[1]) == null ? void 0 : n.length) || 0;
+}
+function D(e, t, i) {
+  const n = c(tt(e, -1), -1, F);
+  if (n >= 0)
+    return n;
+  const r = c(Math.max(T(t), T(i)), 0, F);
+  return r > 0 ? r : null;
+}
+function nt(e, t) {
+  switch (e) {
+    case "linear":
+      return t;
+    case "ease-in":
+      return t * t * t;
+    case "ease-in-out":
+      return t < 0.5 ? 4 * t * t * t : 1 - Math.pow(-2 * t + 2, 3) / 2;
+    case "spring":
+      return 1 - Math.cos(t * Math.PI * 4.5) * Math.exp(-t * 6);
+    case "bounce":
+      return rt(t);
+    case "overshoot":
+      return st(t);
+    case "ease-out":
+    default:
+      return 1 - Math.pow(1 - t, 3);
+  }
+}
+function rt(e) {
+  if (e < 1 / 2.75)
+    return 7.5625 * e * e;
+  if (e < 2 / 2.75) {
+    const r = e - 0.5454545454545454;
+    return 7.5625 * r * r + 0.75;
+  }
+  if (e < 2.5 / 2.75) {
+    const r = e - 0.8181818181818182;
+    return 7.5625 * r * r + 0.9375;
+  }
+  const n = e - 2.625 / 2.75;
+  return 7.5625 * n * n + 0.984375;
+}
+function st(e) {
+  return 1 + 2.70158 * Math.pow(e - 1, 3) + 1.70158 * Math.pow(e - 1, 2);
+}
+function at(e) {
+  switch (e) {
+    case "linear":
+      return "linear";
+    case "ease-in":
+      return "cubic-bezier(0.55, 0.085, 0.68, 0.53)";
+    case "ease-in-out":
+      return "cubic-bezier(0.65, 0, 0.35, 1)";
+    case "spring":
+      return "cubic-bezier(0.34, 1.56, 0.64, 1)";
+    case "bounce":
+      return "cubic-bezier(0.35, 1.4, 0.35, 1)";
+    case "overshoot":
+      return "cubic-bezier(0.2, 1.24, 0.3, 1)";
+    case "ease-out":
+    default:
+      return "cubic-bezier(0.22, 1, 0.36, 1)";
+  }
+}
+function ot(e, t, i, n) {
+  if (i <= 0 || t <= 1)
+    return 0;
+  switch (n) {
+    case "end":
+      return (t - e - 1) * i;
+    case "center": {
+      const r = (t - 1) / 2;
+      return Math.abs(e - r) * i;
+    }
+    case "start":
+    default:
+      return e * i;
+  }
+}
+function ut(e) {
+  return e <= 0 ? [0] : [0, e, 1];
+}
+function V(e) {
+  return /^[0-9]$/.test(e);
+}
+function c(e, t, i) {
+  return Math.min(i, Math.max(t, e));
+}
+function o(e, t) {
+  return Math.abs(e - t) < 1e-5;
+}
+typeof customElements < "u" && !customElements.get("ui-number-ticker") && customElements.define("ui-number-ticker", W);
+export {
+  W as UINumberTicker
+};