@jigoooo/shared-ui
Version:
A reusable React component library and design system with TypeScript support, built on Vite for seamless integration and optimized performance.
1,507 lines • 507 kB
JavaScript
var Ff = Object.defineProperty;
var Vf = (t, e, n) => e in t ? Ff(t, e, { enumerable: !0, configurable: !0, writable: !0, value: n }) : t[e] = n;
var U = (t, e, n) => Vf(t, typeof e != "symbol" ? e + "" : e, n);
import * as W from "react";
import ut, { createContext as xt, use as Dl, useRef as Be, useLayoutEffect as ri, useEffect as Ce, useId as ko, useContext as ze, useInsertionEffect as Rl, useMemo as Bt, useCallback as nr, Children as _f, isValidElement as Bf, useState as ye, forwardRef as Nf, Fragment as El, createElement as Gi, Component as Ml } from "react";
import { jsx as S, Fragment as Wt, jsxs as K } from "react/jsx-runtime";
import * as kl from "react-dom";
const $f = {
colors: {
primary: {
900: "#071423",
800: "#0C1F36",
700: "#12304F",
600: "#184068",
500: "#205288",
400: "#2C6CB0",
300: "#4985C1",
200: "#76A3D3",
100: "#A4C3E4",
50: "#D1E2F5"
},
success: {
50: "#e6f9e6",
100: "#c5e9ca",
200: "#9fdaa8",
300: "#76cd85",
400: "#56c26a",
500: "#32b64f",
600: "#28a746",
700: "#1a953a",
800: "#0a842f",
900: "#00641b"
},
warning: {
50: "#fff8e1",
100: "#ffecb3",
200: "#ffe082",
300: "#ffd54f",
400: "#ffca28",
500: "#ffa000",
600: "#ffb300",
700: "#ffa000",
800: "#ff8f00",
900: "#ff6f00"
},
error: {
50: "#fff0f2",
100: "#ffe5e7",
200: "#ffb3b8",
300: "#ff8088",
400: "#ff4d58",
500: "#ff1a2e",
600: "#e60029",
700: "#cc0024",
800: "#b3001f",
900: "#99001a"
}
}
}, Al = xt(null);
function jt() {
const t = Dl(Al);
if (!t)
throw new Error("useThemeContext must be used within a ThemeProvider");
return t;
}
var Tr = { exports: {} }, xi = {};
/**
* @license React
* react-compiler-runtime.production.js
*
* Copyright (c) Meta Platforms, Inc. and affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
var Ss;
function zf() {
if (Ss) return xi;
Ss = 1;
var t = ut.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE;
return xi.c = function(e) {
return t.H.useMemoCache(e);
}, xi;
}
var Si = {}, Ts;
function Wf() {
if (Ts) return Si;
Ts = 1;
var t = {};
/**
* @license React
* react-compiler-runtime.development.js
*
* Copyright (c) Meta Platforms, Inc. and affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
return t.NODE_ENV !== "production" && function() {
var e = ut.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE;
Si.c = function(n) {
var r = e.H;
return r === null && console.error(
`Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:
1. You might have mismatching versions of React and the renderer (such as React DOM)
2. You might be breaking the Rules of Hooks
3. You might have more than one copy of React in the same app
See https://react.dev/link/invalid-hook-call for tips about how to debug and fix this problem.`
), r.useMemoCache(n);
};
}(), Si;
}
var Cs;
function jf() {
if (Cs) return Tr.exports;
Cs = 1;
var t = {};
return t.NODE_ENV === "production" ? Tr.exports = zf() : Tr.exports = Wf(), Tr.exports;
}
var G = jf();
function Ol(t, e) {
const n = {
...t
};
for (const r in e) {
const i = e[r];
i !== void 0 && (i && typeof i == "object" && !Array.isArray(i) && r in n && typeof n[r] == "object" && !Array.isArray(n[r]) ? n[r] = Ol(n[r], i) : n[r] = i);
}
return n;
}
function Hf(t = {}) {
const e = Ol($f, t);
return {
...e,
colors: {
...e.colors,
primaryColor: e.colors.primary[400],
successColor: e.colors.success[400],
warningColor: e.colors.warning[400],
errorColor: e.colors.error[400]
}
};
}
function Vw(t) {
const e = G.c(6), {
theme: n,
children: r
} = t;
let i;
e[0] === Symbol.for("react.memo_cache_sentinel") ? (i = Hf(), e[0] = i) : i = e[0];
const s = n ?? i;
let a;
e[1] !== s ? (a = {
theme: s
}, e[1] = s, e[2] = a) : a = e[2];
let l;
return e[3] !== r || e[4] !== a ? (l = /* @__PURE__ */ S(Al, { value: a, children: r }), e[3] = r, e[4] = a, e[5] = l) : l = e[5], l;
}
const rr = xt({});
function ii(t) {
const e = Be(null);
return e.current === null && (e.current = t()), e.current;
}
const Ao = typeof window < "u", Oo = Ao ? ri : Ce, oi = /* @__PURE__ */ xt(null);
function Io(t, e) {
t.indexOf(e) === -1 && t.push(e);
}
function Lo(t, e) {
const n = t.indexOf(e);
n > -1 && t.splice(n, 1);
}
const Nt = (t, e, n) => n > e ? e : n < t ? t : n;
var Uf = {};
let Bn = () => {
}, $t = () => {
};
Uf.NODE_ENV !== "production" && (Bn = (t, e) => {
!t && typeof console < "u" && console.warn(e);
}, $t = (t, e) => {
if (!t)
throw new Error(e);
});
const zt = {}, Il = (t) => /^-?(?:\d+(?:\.\d+)?|\.\d+)$/u.test(t);
function Ll(t) {
return typeof t == "object" && t !== null;
}
const Fl = (t) => /^0[^.\s]+$/u.test(t);
// @__NO_SIDE_EFFECTS__
function Fo(t) {
let e;
return () => (e === void 0 && (e = t()), e);
}
const ft = /* @__NO_SIDE_EFFECTS__ */ (t) => t, Yf = (t, e) => (n) => e(t(n)), pr = (...t) => t.reduce(Yf), ir = /* @__NO_SIDE_EFFECTS__ */ (t, e, n) => {
const r = e - t;
return r === 0 ? 1 : (n - t) / r;
};
class Vo {
constructor() {
this.subscriptions = [];
}
add(e) {
return Io(this.subscriptions, e), () => Lo(this.subscriptions, e);
}
notify(e, n, r) {
const i = this.subscriptions.length;
if (i)
if (i === 1)
this.subscriptions[0](e, n, r);
else
for (let o = 0; o < i; o++) {
const s = this.subscriptions[o];
s && s(e, n, r);
}
}
getSize() {
return this.subscriptions.length;
}
clear() {
this.subscriptions.length = 0;
}
}
const pt = /* @__NO_SIDE_EFFECTS__ */ (t) => t * 1e3, Mt = /* @__NO_SIDE_EFFECTS__ */ (t) => t / 1e3;
function Vl(t, e) {
return e ? t * (1e3 / e) : 0;
}
const Ps = /* @__PURE__ */ new Set();
function _o(t, e, n) {
t || Ps.has(e) || (console.warn(e), Ps.add(e));
}
const _l = (t, e, n) => (((1 - 3 * n + 3 * e) * t + (3 * n - 6 * e)) * t + 3 * e) * t, Xf = 1e-7, Gf = 12;
function qf(t, e, n, r, i) {
let o, s, a = 0;
do
s = e + (n - e) / 2, o = _l(s, r, i) - t, o > 0 ? n = s : e = s;
while (Math.abs(o) > Xf && ++a < Gf);
return s;
}
function gr(t, e, n, r) {
if (t === e && n === r)
return ft;
const i = (o) => qf(o, 0, 1, t, n);
return (o) => o === 0 || o === 1 ? o : _l(i(o), e, r);
}
const Bl = (t) => (e) => e <= 0.5 ? t(2 * e) / 2 : (2 - t(2 * (1 - e))) / 2, Nl = (t) => (e) => 1 - t(1 - e), $l = /* @__PURE__ */ gr(0.33, 1.53, 0.69, 0.99), Bo = /* @__PURE__ */ Nl($l), zl = /* @__PURE__ */ Bl(Bo), Wl = (t) => (t *= 2) < 1 ? 0.5 * Bo(t) : 0.5 * (2 - Math.pow(2, -10 * (t - 1))), No = (t) => 1 - Math.sin(Math.acos(t)), jl = Nl(No), Hl = Bl(No), Kf = /* @__PURE__ */ gr(0.42, 0, 1, 1), Qf = /* @__PURE__ */ gr(0, 0, 0.58, 1), Ul = /* @__PURE__ */ gr(0.42, 0, 0.58, 1), Zf = (t) => Array.isArray(t) && typeof t[0] != "number", Yl = (t) => Array.isArray(t) && typeof t[0] == "number", Ds = {
linear: ft,
easeIn: Kf,
easeInOut: Ul,
easeOut: Qf,
circIn: No,
circInOut: Hl,
circOut: jl,
backIn: Bo,
backInOut: zl,
backOut: $l,
anticipate: Wl
}, Jf = (t) => typeof t == "string", Rs = (t) => {
if (Yl(t)) {
$t(t.length === 4, "Cubic bezier arrays must contain four numerical values.");
const [e, n, r, i] = t;
return gr(e, n, r, i);
} else if (Jf(t))
return $t(Ds[t] !== void 0, `Invalid easing type '${t}'`), Ds[t];
return t;
}, Cr = [
"setup",
// Compute
"read",
// Read
"resolveKeyframes",
// Write/Read/Write/Read
"preUpdate",
// Compute
"update",
// Compute
"preRender",
// Compute
"render",
// Write
"postRender"
// Compute
];
function ed(t, e) {
let n = /* @__PURE__ */ new Set(), r = /* @__PURE__ */ new Set(), i = !1, o = !1;
const s = /* @__PURE__ */ new WeakSet();
let a = {
delta: 0,
timestamp: 0,
isProcessing: !1
};
function l(u) {
s.has(u) && (c.schedule(u), t()), u(a);
}
const c = {
/**
* Schedule a process to run on the next frame.
*/
schedule: (u, f = !1, h = !1) => {
const g = h && i ? n : r;
return f && s.add(u), g.has(u) || g.add(u), u;
},
/**
* Cancel the provided callback from running on the next frame.
*/
cancel: (u) => {
r.delete(u), s.delete(u);
},
/**
* Execute all schedule callbacks.
*/
process: (u) => {
if (a = u, i) {
o = !0;
return;
}
i = !0, [n, r] = [r, n], n.forEach(l), n.clear(), i = !1, o && (o = !1, c.process(u));
}
};
return c;
}
const td = 40;
function Xl(t, e) {
let n = !1, r = !0;
const i = {
delta: 0,
timestamp: 0,
isProcessing: !1
}, o = () => n = !0, s = Cr.reduce((y, w) => (y[w] = ed(o), y), {}), { setup: a, read: l, resolveKeyframes: c, preUpdate: u, update: f, preRender: h, render: m, postRender: g } = s, p = () => {
const y = zt.useManualTiming ? i.timestamp : performance.now();
n = !1, zt.useManualTiming || (i.delta = r ? 1e3 / 60 : Math.max(Math.min(y - i.timestamp, td), 1)), i.timestamp = y, i.isProcessing = !0, a.process(i), l.process(i), c.process(i), u.process(i), f.process(i), h.process(i), m.process(i), g.process(i), i.isProcessing = !1, n && e && (r = !1, t(p));
}, v = () => {
n = !0, r = !0, i.isProcessing || t(p);
};
return { schedule: Cr.reduce((y, w) => {
const x = s[w];
return y[w] = (C, P = !1, D = !1) => (n || v(), x.schedule(C, P, D)), y;
}, {}), cancel: (y) => {
for (let w = 0; w < Cr.length; w++)
s[Cr[w]].cancel(y);
}, state: i, steps: s };
}
const { schedule: Re, cancel: Qt, state: Ue, steps: Ti } = /* @__PURE__ */ Xl(typeof requestAnimationFrame < "u" ? requestAnimationFrame : ft, !0);
let Ir;
function nd() {
Ir = void 0;
}
const et = {
now: () => (Ir === void 0 && et.set(Ue.isProcessing || zt.useManualTiming ? Ue.timestamp : performance.now()), Ir),
set: (t) => {
Ir = t, queueMicrotask(nd);
}
}, Gl = (t) => (e) => typeof e == "string" && e.startsWith(t), $o = /* @__PURE__ */ Gl("--"), rd = /* @__PURE__ */ Gl("var(--"), zo = (t) => rd(t) ? id.test(t.split("/*")[0].trim()) : !1, id = /var\(--(?:[\w-]+\s*|[\w-]+\s*,(?:\s*[^)(\s]|\s*\((?:[^)(]|\([^)(]*\))*\))+\s*)\)$/iu, Nn = {
test: (t) => typeof t == "number",
parse: parseFloat,
transform: (t) => t
}, or = {
...Nn,
transform: (t) => Nt(0, 1, t)
}, Pr = {
...Nn,
default: 1
}, Zn = (t) => Math.round(t * 1e5) / 1e5, Wo = /-?(?:\d+(?:\.\d+)?|\.\d+)/gu;
function od(t) {
return t == null;
}
const sd = /^(?:#[\da-f]{3,8}|(?:rgb|hsl)a?\((?:-?[\d.]+%?[,\s]+){2}-?[\d.]+%?\s*(?:[,/]\s*)?(?:\b\d+(?:\.\d+)?|\.\d+)?%?\))$/iu, jo = (t, e) => (n) => !!(typeof n == "string" && sd.test(n) && n.startsWith(t) || e && !od(n) && Object.prototype.hasOwnProperty.call(n, e)), ql = (t, e, n) => (r) => {
if (typeof r != "string")
return r;
const [i, o, s, a] = r.match(Wo);
return {
[t]: parseFloat(i),
[e]: parseFloat(o),
[n]: parseFloat(s),
alpha: a !== void 0 ? parseFloat(a) : 1
};
}, ad = (t) => Nt(0, 255, t), Ci = {
...Nn,
transform: (t) => Math.round(ad(t))
}, cn = {
test: /* @__PURE__ */ jo("rgb", "red"),
parse: /* @__PURE__ */ ql("red", "green", "blue"),
transform: ({ red: t, green: e, blue: n, alpha: r = 1 }) => "rgba(" + Ci.transform(t) + ", " + Ci.transform(e) + ", " + Ci.transform(n) + ", " + Zn(or.transform(r)) + ")"
};
function ld(t) {
let e = "", n = "", r = "", i = "";
return t.length > 5 ? (e = t.substring(1, 3), n = t.substring(3, 5), r = t.substring(5, 7), i = t.substring(7, 9)) : (e = t.substring(1, 2), n = t.substring(2, 3), r = t.substring(3, 4), i = t.substring(4, 5), e += e, n += n, r += r, i += i), {
red: parseInt(e, 16),
green: parseInt(n, 16),
blue: parseInt(r, 16),
alpha: i ? parseInt(i, 16) / 255 : 1
};
}
const qi = {
test: /* @__PURE__ */ jo("#"),
parse: ld,
transform: cn.transform
}, yr = /* @__NO_SIDE_EFFECTS__ */ (t) => ({
test: (e) => typeof e == "string" && e.endsWith(t) && e.split(" ").length === 1,
parse: parseFloat,
transform: (e) => `${e}${t}`
}), Gt = /* @__PURE__ */ yr("deg"), kt = /* @__PURE__ */ yr("%"), te = /* @__PURE__ */ yr("px"), cd = /* @__PURE__ */ yr("vh"), ud = /* @__PURE__ */ yr("vw"), Es = {
...kt,
parse: (t) => kt.parse(t) / 100,
transform: (t) => kt.transform(t * 100)
}, Tn = {
test: /* @__PURE__ */ jo("hsl", "hue"),
parse: /* @__PURE__ */ ql("hue", "saturation", "lightness"),
transform: ({ hue: t, saturation: e, lightness: n, alpha: r = 1 }) => "hsla(" + Math.round(t) + ", " + kt.transform(Zn(e)) + ", " + kt.transform(Zn(n)) + ", " + Zn(or.transform(r)) + ")"
}, Xe = {
test: (t) => cn.test(t) || qi.test(t) || Tn.test(t),
parse: (t) => cn.test(t) ? cn.parse(t) : Tn.test(t) ? Tn.parse(t) : qi.parse(t),
transform: (t) => typeof t == "string" ? t : t.hasOwnProperty("red") ? cn.transform(t) : Tn.transform(t)
}, fd = /(?:#[\da-f]{3,8}|(?:rgb|hsl)a?\((?:-?[\d.]+%?[,\s]+){2}-?[\d.]+%?\s*(?:[,/]\s*)?(?:\b\d+(?:\.\d+)?|\.\d+)?%?\))/giu;
function dd(t) {
var e, n;
return isNaN(t) && typeof t == "string" && (((e = t.match(Wo)) == null ? void 0 : e.length) || 0) + (((n = t.match(fd)) == null ? void 0 : n.length) || 0) > 0;
}
const Kl = "number", Ql = "color", hd = "var", md = "var(", Ms = "${}", pd = /var\s*\(\s*--(?:[\w-]+\s*|[\w-]+\s*,(?:\s*[^)(\s]|\s*\((?:[^)(]|\([^)(]*\))*\))+\s*)\)|#[\da-f]{3,8}|(?:rgb|hsl)a?\((?:-?[\d.]+%?[,\s]+){2}-?[\d.]+%?\s*(?:[,/]\s*)?(?:\b\d+(?:\.\d+)?|\.\d+)?%?\)|-?(?:\d+(?:\.\d+)?|\.\d+)/giu;
function sr(t) {
const e = t.toString(), n = [], r = {
color: [],
number: [],
var: []
}, i = [];
let o = 0;
const a = e.replace(pd, (l) => (Xe.test(l) ? (r.color.push(o), i.push(Ql), n.push(Xe.parse(l))) : l.startsWith(md) ? (r.var.push(o), i.push(hd), n.push(l)) : (r.number.push(o), i.push(Kl), n.push(parseFloat(l))), ++o, Ms)).split(Ms);
return { values: n, split: a, indexes: r, types: i };
}
function Zl(t) {
return sr(t).values;
}
function Jl(t) {
const { split: e, types: n } = sr(t), r = e.length;
return (i) => {
let o = "";
for (let s = 0; s < r; s++)
if (o += e[s], i[s] !== void 0) {
const a = n[s];
a === Kl ? o += Zn(i[s]) : a === Ql ? o += Xe.transform(i[s]) : o += i[s];
}
return o;
};
}
const gd = (t) => typeof t == "number" ? 0 : t;
function yd(t) {
const e = Zl(t);
return Jl(t)(e.map(gd));
}
const Zt = {
test: dd,
parse: Zl,
createTransformer: Jl,
getAnimatableNone: yd
};
function Pi(t, e, n) {
return n < 0 && (n += 1), n > 1 && (n -= 1), n < 1 / 6 ? t + (e - t) * 6 * n : n < 1 / 2 ? e : n < 2 / 3 ? t + (e - t) * (2 / 3 - n) * 6 : t;
}
function vd({ hue: t, saturation: e, lightness: n, alpha: r }) {
t /= 360, e /= 100, n /= 100;
let i = 0, o = 0, s = 0;
if (!e)
i = o = s = n;
else {
const a = n < 0.5 ? n * (1 + e) : n + e - n * e, l = 2 * n - a;
i = Pi(l, a, t + 1 / 3), o = Pi(l, a, t), s = Pi(l, a, t - 1 / 3);
}
return {
red: Math.round(i * 255),
green: Math.round(o * 255),
blue: Math.round(s * 255),
alpha: r
};
}
function Br(t, e) {
return (n) => n > 0 ? e : t;
}
const Ae = (t, e, n) => t + (e - t) * n, Di = (t, e, n) => {
const r = t * t, i = n * (e * e - r) + r;
return i < 0 ? 0 : Math.sqrt(i);
}, bd = [qi, cn, Tn], wd = (t) => bd.find((e) => e.test(t));
function ks(t) {
const e = wd(t);
if (Bn(!!e, `'${t}' is not an animatable color. Use the equivalent color code instead.`), !e)
return !1;
let n = e.parse(t);
return e === Tn && (n = vd(n)), n;
}
const As = (t, e) => {
const n = ks(t), r = ks(e);
if (!n || !r)
return Br(t, e);
const i = { ...n };
return (o) => (i.red = Di(n.red, r.red, o), i.green = Di(n.green, r.green, o), i.blue = Di(n.blue, r.blue, o), i.alpha = Ae(n.alpha, r.alpha, o), cn.transform(i));
}, Ki = /* @__PURE__ */ new Set(["none", "hidden"]);
function xd(t, e) {
return Ki.has(t) ? (n) => n <= 0 ? t : e : (n) => n >= 1 ? e : t;
}
function Sd(t, e) {
return (n) => Ae(t, e, n);
}
function Ho(t) {
return typeof t == "number" ? Sd : typeof t == "string" ? zo(t) ? Br : Xe.test(t) ? As : Pd : Array.isArray(t) ? ec : typeof t == "object" ? Xe.test(t) ? As : Td : Br;
}
function ec(t, e) {
const n = [...t], r = n.length, i = t.map((o, s) => Ho(o)(o, e[s]));
return (o) => {
for (let s = 0; s < r; s++)
n[s] = i[s](o);
return n;
};
}
function Td(t, e) {
const n = { ...t, ...e }, r = {};
for (const i in n)
t[i] !== void 0 && e[i] !== void 0 && (r[i] = Ho(t[i])(t[i], e[i]));
return (i) => {
for (const o in r)
n[o] = r[o](i);
return n;
};
}
function Cd(t, e) {
const n = [], r = { color: 0, var: 0, number: 0 };
for (let i = 0; i < e.values.length; i++) {
const o = e.types[i], s = t.indexes[o][r[o]], a = t.values[s] ?? 0;
n[i] = a, r[o]++;
}
return n;
}
const Pd = (t, e) => {
const n = Zt.createTransformer(e), r = sr(t), i = sr(e);
return r.indexes.var.length === i.indexes.var.length && r.indexes.color.length === i.indexes.color.length && r.indexes.number.length >= i.indexes.number.length ? Ki.has(t) && !i.values.length || Ki.has(e) && !r.values.length ? xd(t, e) : pr(ec(Cd(r, i), i.values), n) : (Bn(!0, `Complex values '${t}' and '${e}' too different to mix. Ensure all colors are of the same type, and that each contains the same quantity of number and color values. Falling back to instant transition.`), Br(t, e));
};
function tc(t, e, n) {
return typeof t == "number" && typeof e == "number" && typeof n == "number" ? Ae(t, e, n) : Ho(t)(t, e);
}
const Dd = (t) => {
const e = ({ timestamp: n }) => t(n);
return {
start: (n = !0) => Re.update(e, n),
stop: () => Qt(e),
/**
* If we're processing this frame we can use the
* framelocked timestamp to keep things in sync.
*/
now: () => Ue.isProcessing ? Ue.timestamp : et.now()
};
}, nc = (t, e, n = 10) => {
let r = "";
const i = Math.max(Math.round(e / n), 2);
for (let o = 0; o < i; o++)
r += t(o / (i - 1)) + ", ";
return `linear(${r.substring(0, r.length - 2)})`;
}, Nr = 2e4;
function Uo(t) {
let e = 0;
const n = 50;
let r = t.next(e);
for (; !r.done && e < Nr; )
e += n, r = t.next(e);
return e >= Nr ? 1 / 0 : e;
}
function Rd(t, e = 100, n) {
const r = n({ ...t, keyframes: [0, e] }), i = Math.min(Uo(r), Nr);
return {
type: "keyframes",
ease: (o) => r.next(i * o).value / e,
duration: /* @__PURE__ */ Mt(i)
};
}
const Ed = 5;
function rc(t, e, n) {
const r = Math.max(e - Ed, 0);
return Vl(n - t(r), e - r);
}
const ke = {
// Default spring physics
stiffness: 100,
damping: 10,
mass: 1,
velocity: 0,
// Default duration/bounce-based options
duration: 800,
// in ms
bounce: 0.3,
visualDuration: 0.3,
// in seconds
// Rest thresholds
restSpeed: {
granular: 0.01,
default: 2
},
restDelta: {
granular: 5e-3,
default: 0.5
},
// Limits
minDuration: 0.01,
// in seconds
maxDuration: 10,
// in seconds
minDamping: 0.05,
maxDamping: 1
}, Os = 1e-3;
function Md({ duration: t = ke.duration, bounce: e = ke.bounce, velocity: n = ke.velocity, mass: r = ke.mass }) {
let i, o;
Bn(t <= /* @__PURE__ */ pt(ke.maxDuration), "Spring duration must be 10 seconds or less");
let s = 1 - e;
s = Nt(ke.minDamping, ke.maxDamping, s), t = Nt(ke.minDuration, ke.maxDuration, /* @__PURE__ */ Mt(t)), s < 1 ? (i = (c) => {
const u = c * s, f = u * t, h = u - n, m = Qi(c, s), g = Math.exp(-f);
return Os - h / m * g;
}, o = (c) => {
const f = c * s * t, h = f * n + n, m = Math.pow(s, 2) * Math.pow(c, 2) * t, g = Math.exp(-f), p = Qi(Math.pow(c, 2), s);
return (-i(c) + Os > 0 ? -1 : 1) * ((h - m) * g) / p;
}) : (i = (c) => {
const u = Math.exp(-c * t), f = (c - n) * t + 1;
return -1e-3 + u * f;
}, o = (c) => {
const u = Math.exp(-c * t), f = (n - c) * (t * t);
return u * f;
});
const a = 5 / t, l = Ad(i, o, a);
if (t = /* @__PURE__ */ pt(t), isNaN(l))
return {
stiffness: ke.stiffness,
damping: ke.damping,
duration: t
};
{
const c = Math.pow(l, 2) * r;
return {
stiffness: c,
damping: s * 2 * Math.sqrt(r * c),
duration: t
};
}
}
const kd = 12;
function Ad(t, e, n) {
let r = n;
for (let i = 1; i < kd; i++)
r = r - t(r) / e(r);
return r;
}
function Qi(t, e) {
return t * Math.sqrt(1 - e * e);
}
const Od = ["duration", "bounce"], Id = ["stiffness", "damping", "mass"];
function Is(t, e) {
return e.some((n) => t[n] !== void 0);
}
function Ld(t) {
let e = {
velocity: ke.velocity,
stiffness: ke.stiffness,
damping: ke.damping,
mass: ke.mass,
isResolvedFromDuration: !1,
...t
};
if (!Is(t, Id) && Is(t, Od))
if (t.visualDuration) {
const n = t.visualDuration, r = 2 * Math.PI / (n * 1.2), i = r * r, o = 2 * Nt(0.05, 1, 1 - (t.bounce || 0)) * Math.sqrt(i);
e = {
...e,
mass: ke.mass,
stiffness: i,
damping: o
};
} else {
const n = Md(t);
e = {
...e,
...n,
mass: ke.mass
}, e.isResolvedFromDuration = !0;
}
return e;
}
function $r(t = ke.visualDuration, e = ke.bounce) {
const n = typeof t != "object" ? {
visualDuration: t,
keyframes: [0, 1],
bounce: e
} : t;
let { restSpeed: r, restDelta: i } = n;
const o = n.keyframes[0], s = n.keyframes[n.keyframes.length - 1], a = { done: !1, value: o }, { stiffness: l, damping: c, mass: u, duration: f, velocity: h, isResolvedFromDuration: m } = Ld({
...n,
velocity: -/* @__PURE__ */ Mt(n.velocity || 0)
}), g = h || 0, p = c / (2 * Math.sqrt(l * u)), v = s - o, b = /* @__PURE__ */ Mt(Math.sqrt(l / u)), d = Math.abs(v) < 5;
r || (r = d ? ke.restSpeed.granular : ke.restSpeed.default), i || (i = d ? ke.restDelta.granular : ke.restDelta.default);
let y;
if (p < 1) {
const x = Qi(b, p);
y = (C) => {
const P = Math.exp(-p * b * C);
return s - P * ((g + p * b * v) / x * Math.sin(x * C) + v * Math.cos(x * C));
};
} else if (p === 1)
y = (x) => s - Math.exp(-b * x) * (v + (g + b * v) * x);
else {
const x = b * Math.sqrt(p * p - 1);
y = (C) => {
const P = Math.exp(-p * b * C), D = Math.min(x * C, 300);
return s - P * ((g + p * b * v) * Math.sinh(D) + x * v * Math.cosh(D)) / x;
};
}
const w = {
calculatedDuration: m && f || null,
next: (x) => {
const C = y(x);
if (m)
a.done = x >= f;
else {
let P = x === 0 ? g : 0;
p < 1 && (P = x === 0 ? /* @__PURE__ */ pt(g) : rc(y, x, C));
const D = Math.abs(P) <= r, R = Math.abs(s - C) <= i;
a.done = D && R;
}
return a.value = a.done ? s : C, a;
},
toString: () => {
const x = Math.min(Uo(w), Nr), C = nc((P) => w.next(x * P).value, x, 30);
return x + "ms " + C;
},
toTransition: () => {
}
};
return w;
}
$r.applyToOptions = (t) => {
const e = Rd(t, 100, $r);
return t.ease = e.ease, t.duration = /* @__PURE__ */ pt(e.duration), t.type = "keyframes", t;
};
function Zi({ keyframes: t, velocity: e = 0, power: n = 0.8, timeConstant: r = 325, bounceDamping: i = 10, bounceStiffness: o = 500, modifyTarget: s, min: a, max: l, restDelta: c = 0.5, restSpeed: u }) {
const f = t[0], h = {
done: !1,
value: f
}, m = (D) => a !== void 0 && D < a || l !== void 0 && D > l, g = (D) => a === void 0 ? l : l === void 0 || Math.abs(a - D) < Math.abs(l - D) ? a : l;
let p = n * e;
const v = f + p, b = s === void 0 ? v : s(v);
b !== v && (p = b - f);
const d = (D) => -p * Math.exp(-D / r), y = (D) => b + d(D), w = (D) => {
const R = d(D), E = y(D);
h.done = Math.abs(R) <= c, h.value = h.done ? b : E;
};
let x, C;
const P = (D) => {
m(h.value) && (x = D, C = $r({
keyframes: [h.value, g(h.value)],
velocity: rc(y, D, h.value),
// TODO: This should be passing * 1000
damping: i,
stiffness: o,
restDelta: c,
restSpeed: u
}));
};
return P(0), {
calculatedDuration: null,
next: (D) => {
let R = !1;
return !C && x === void 0 && (R = !0, w(D), P(D)), x !== void 0 && D >= x ? C.next(D - x) : (!R && w(D), h);
}
};
}
function Fd(t, e, n) {
const r = [], i = n || zt.mix || tc, o = t.length - 1;
for (let s = 0; s < o; s++) {
let a = i(t[s], t[s + 1]);
if (e) {
const l = Array.isArray(e) ? e[s] || ft : e;
a = pr(l, a);
}
r.push(a);
}
return r;
}
function Vd(t, e, { clamp: n = !0, ease: r, mixer: i } = {}) {
const o = t.length;
if ($t(o === e.length, "Both input and output ranges must be the same length"), o === 1)
return () => e[0];
if (o === 2 && e[0] === e[1])
return () => e[1];
const s = t[0] === t[1];
t[0] > t[o - 1] && (t = [...t].reverse(), e = [...e].reverse());
const a = Fd(e, r, i), l = a.length, c = (u) => {
if (s && u < t[0])
return e[0];
let f = 0;
if (l > 1)
for (; f < t.length - 2 && !(u < t[f + 1]); f++)
;
const h = /* @__PURE__ */ ir(t[f], t[f + 1], u);
return a[f](h);
};
return n ? (u) => c(Nt(t[0], t[o - 1], u)) : c;
}
function _d(t, e) {
const n = t[t.length - 1];
for (let r = 1; r <= e; r++) {
const i = /* @__PURE__ */ ir(0, e, r);
t.push(Ae(n, 1, i));
}
}
function Bd(t) {
const e = [0];
return _d(e, t.length - 1), e;
}
function Nd(t, e) {
return t.map((n) => n * e);
}
function $d(t, e) {
return t.map(() => e || Ul).splice(0, t.length - 1);
}
function Cn({ duration: t = 300, keyframes: e, times: n, ease: r = "easeInOut" }) {
const i = Zf(r) ? r.map(Rs) : Rs(r), o = {
done: !1,
value: e[0]
}, s = Nd(
// Only use the provided offsets if they're the correct length
// TODO Maybe we should warn here if there's a length mismatch
n && n.length === e.length ? n : Bd(e),
t
), a = Vd(s, e, {
ease: Array.isArray(i) ? i : $d(e, i)
});
return {
calculatedDuration: t,
next: (l) => (o.value = a(l), o.done = l >= t, o)
};
}
const zd = (t) => t !== null;
function Yo(t, { repeat: e, repeatType: n = "loop" }, r, i = 1) {
const o = t.filter(zd), a = i < 0 || e && n !== "loop" && e % 2 === 1 ? 0 : o.length - 1;
return !a || r === void 0 ? o[a] : r;
}
const Wd = {
decay: Zi,
inertia: Zi,
tween: Cn,
keyframes: Cn,
spring: $r
};
function ic(t) {
typeof t.type == "string" && (t.type = Wd[t.type]);
}
class Xo {
constructor() {
this.updateFinished();
}
get finished() {
return this._finished;
}
updateFinished() {
this._finished = new Promise((e) => {
this.resolve = e;
});
}
notifyFinished() {
this.resolve();
}
/**
* Allows the animation to be awaited.
*
* @deprecated Use `finished` instead.
*/
then(e, n) {
return this.finished.then(e, n);
}
}
var jd = {};
const Hd = (t) => t / 100;
class Go extends Xo {
constructor(e) {
super(), this.state = "idle", this.startTime = null, this.isStopped = !1, this.currentTime = 0, this.holdTime = null, this.playbackSpeed = 1, this.stop = () => {
var r, i;
const { motionValue: n } = this.options;
n && n.updatedAt !== et.now() && this.tick(et.now()), this.isStopped = !0, this.state !== "idle" && (this.teardown(), (i = (r = this.options).onStop) == null || i.call(r));
}, this.options = e, this.initAnimation(), this.play(), e.autoplay === !1 && this.pause();
}
initAnimation() {
const { options: e } = this;
ic(e);
const { type: n = Cn, repeat: r = 0, repeatDelay: i = 0, repeatType: o, velocity: s = 0 } = e;
let { keyframes: a } = e;
const l = n || Cn;
jd.NODE_ENV !== "production" && l !== Cn && $t(a.length <= 2, `Only two keyframes currently supported with spring and inertia animations. Trying to animate ${a}`), l !== Cn && typeof a[0] != "number" && (this.mixKeyframes = pr(Hd, tc(a[0], a[1])), a = [0, 100]);
const c = l({ ...e, keyframes: a });
o === "mirror" && (this.mirroredGenerator = l({
...e,
keyframes: [...a].reverse(),
velocity: -s
})), c.calculatedDuration === null && (c.calculatedDuration = Uo(c));
const { calculatedDuration: u } = c;
this.calculatedDuration = u, this.resolvedDuration = u + i, this.totalDuration = this.resolvedDuration * (r + 1) - i, this.generator = c;
}
updateTime(e) {
const n = Math.round(e - this.startTime) * this.playbackSpeed;
this.holdTime !== null ? this.currentTime = this.holdTime : this.currentTime = n;
}
tick(e, n = !1) {
const { generator: r, totalDuration: i, mixKeyframes: o, mirroredGenerator: s, resolvedDuration: a, calculatedDuration: l } = this;
if (this.startTime === null)
return r.next(0);
const { delay: c = 0, keyframes: u, repeat: f, repeatType: h, repeatDelay: m, type: g, onUpdate: p, finalKeyframe: v } = this.options;
this.speed > 0 ? this.startTime = Math.min(this.startTime, e) : this.speed < 0 && (this.startTime = Math.min(e - i / this.speed, this.startTime)), n ? this.currentTime = e : this.updateTime(e);
const b = this.currentTime - c * (this.playbackSpeed >= 0 ? 1 : -1), d = this.playbackSpeed >= 0 ? b < 0 : b > i;
this.currentTime = Math.max(b, 0), this.state === "finished" && this.holdTime === null && (this.currentTime = i);
let y = this.currentTime, w = r;
if (f) {
const D = Math.min(this.currentTime, i) / a;
let R = Math.floor(D), E = D % 1;
!E && D >= 1 && (E = 1), E === 1 && R--, R = Math.min(R, f + 1), !!(R % 2) && (h === "reverse" ? (E = 1 - E, m && (E -= m / a)) : h === "mirror" && (w = s)), y = Nt(0, 1, E) * a;
}
const x = d ? { done: !1, value: u[0] } : w.next(y);
o && (x.value = o(x.value));
let { done: C } = x;
!d && l !== null && (C = this.playbackSpeed >= 0 ? this.currentTime >= i : this.currentTime <= 0);
const P = this.holdTime === null && (this.state === "finished" || this.state === "running" && C);
return P && g !== Zi && (x.value = Yo(u, this.options, v, this.speed)), p && p(x.value), P && this.finish(), x;
}
/**
* Allows the returned animation to be awaited or promise-chained. Currently
* resolves when the animation finishes at all but in a future update could/should
* reject if its cancels.
*/
then(e, n) {
return this.finished.then(e, n);
}
get duration() {
return /* @__PURE__ */ Mt(this.calculatedDuration);
}
get time() {
return /* @__PURE__ */ Mt(this.currentTime);
}
set time(e) {
var n;
e = /* @__PURE__ */ pt(e), this.currentTime = e, this.startTime === null || this.holdTime !== null || this.playbackSpeed === 0 ? this.holdTime = e : this.driver && (this.startTime = this.driver.now() - e / this.playbackSpeed), (n = this.driver) == null || n.start(!1);
}
get speed() {
return this.playbackSpeed;
}
set speed(e) {
this.updateTime(et.now());
const n = this.playbackSpeed !== e;
this.playbackSpeed = e, n && (this.time = /* @__PURE__ */ Mt(this.currentTime));
}
play() {
var i, o;
if (this.isStopped)
return;
const { driver: e = Dd, startTime: n } = this.options;
this.driver || (this.driver = e((s) => this.tick(s))), (o = (i = this.options).onPlay) == null || o.call(i);
const r = this.driver.now();
this.state === "finished" ? (this.updateFinished(), this.startTime = r) : this.holdTime !== null ? this.startTime = r - this.holdTime : this.startTime || (this.startTime = n ?? r), this.state === "finished" && this.speed < 0 && (this.startTime += this.calculatedDuration), this.holdTime = null, this.state = "running", this.driver.start();
}
pause() {
this.state = "paused", this.updateTime(et.now()), this.holdTime = this.currentTime;
}
complete() {
this.state !== "running" && this.play(), this.state = "finished", this.holdTime = null;
}
finish() {
var e, n;
this.notifyFinished(), this.teardown(), this.state = "finished", (n = (e = this.options).onComplete) == null || n.call(e);
}
cancel() {
var e, n;
this.holdTime = null, this.startTime = 0, this.tick(0), this.teardown(), (n = (e = this.options).onCancel) == null || n.call(e);
}
teardown() {
this.state = "idle", this.stopDriver(), this.startTime = this.holdTime = null;
}
stopDriver() {
this.driver && (this.driver.stop(), this.driver = void 0);
}
sample(e) {
return this.startTime = 0, this.tick(e, !0);
}
attachTimeline(e) {
var n;
return this.options.allowFlatten && (this.options.type = "keyframes", this.options.ease = "linear", this.initAnimation()), (n = this.driver) == null || n.stop(), e.observe(this);
}
}
function Ud(t) {
for (let e = 1; e < t.length; e++)
t[e] ?? (t[e] = t[e - 1]);
}
const un = (t) => t * 180 / Math.PI, Ji = (t) => {
const e = un(Math.atan2(t[1], t[0]));
return eo(e);
}, Yd = {
x: 4,
y: 5,
translateX: 4,
translateY: 5,
scaleX: 0,
scaleY: 3,
scale: (t) => (Math.abs(t[0]) + Math.abs(t[3])) / 2,
rotate: Ji,
rotateZ: Ji,
skewX: (t) => un(Math.atan(t[1])),
skewY: (t) => un(Math.atan(t[2])),
skew: (t) => (Math.abs(t[1]) + Math.abs(t[2])) / 2
}, eo = (t) => (t = t % 360, t < 0 && (t += 360), t), Ls = Ji, Fs = (t) => Math.sqrt(t[0] * t[0] + t[1] * t[1]), Vs = (t) => Math.sqrt(t[4] * t[4] + t[5] * t[5]), Xd = {
x: 12,
y: 13,
z: 14,
translateX: 12,
translateY: 13,
translateZ: 14,
scaleX: Fs,
scaleY: Vs,
scale: (t) => (Fs(t) + Vs(t)) / 2,
rotateX: (t) => eo(un(Math.atan2(t[6], t[5]))),
rotateY: (t) => eo(un(Math.atan2(-t[2], t[0]))),
rotateZ: Ls,
rotate: Ls,
skewX: (t) => un(Math.atan(t[4])),
skewY: (t) => un(Math.atan(t[1])),
skew: (t) => (Math.abs(t[1]) + Math.abs(t[4])) / 2
};
function to(t) {
return t.includes("scale") ? 1 : 0;
}
function no(t, e) {
if (!t || t === "none")
return to(e);
const n = t.match(/^matrix3d\(([-\d.e\s,]+)\)$/u);
let r, i;
if (n)
r = Xd, i = n;
else {
const a = t.match(/^matrix\(([-\d.e\s,]+)\)$/u);
r = Yd, i = a;
}
if (!i)
return to(e);
const o = r[e], s = i[1].split(",").map(qd);
return typeof o == "function" ? o(s) : s[o];
}
const Gd = (t, e) => {
const { transform: n = "none" } = getComputedStyle(t);
return no(n, e);
};
function qd(t) {
return parseFloat(t.trim());
}
const $n = [
"transformPerspective",
"x",
"y",
"z",
"translateX",
"translateY",
"translateZ",
"scale",
"scaleX",
"scaleY",
"rotate",
"rotateX",
"rotateY",
"rotateZ",
"skew",
"skewX",
"skewY"
], zn = new Set($n), _s = (t) => t === Nn || t === te, Kd = /* @__PURE__ */ new Set(["x", "y", "z"]), Qd = $n.filter((t) => !Kd.has(t));
function Zd(t) {
const e = [];
return Qd.forEach((n) => {
const r = t.getValue(n);
r !== void 0 && (e.push([n, r.get()]), r.set(n.startsWith("scale") ? 1 : 0));
}), e;
}
const dn = {
// Dimensions
width: ({ x: t }, { paddingLeft: e = "0", paddingRight: n = "0" }) => t.max - t.min - parseFloat(e) - parseFloat(n),
height: ({ y: t }, { paddingTop: e = "0", paddingBottom: n = "0" }) => t.max - t.min - parseFloat(e) - parseFloat(n),
top: (t, { top: e }) => parseFloat(e),
left: (t, { left: e }) => parseFloat(e),
bottom: ({ y: t }, { top: e }) => parseFloat(e) + (t.max - t.min),
right: ({ x: t }, { left: e }) => parseFloat(e) + (t.max - t.min),
// Transform
x: (t, { transform: e }) => no(e, "x"),
y: (t, { transform: e }) => no(e, "y")
};
dn.translateX = dn.x;
dn.translateY = dn.y;
const hn = /* @__PURE__ */ new Set();
let ro = !1, io = !1, oo = !1;
function oc() {
if (io) {
const t = Array.from(hn).filter((r) => r.needsMeasurement), e = new Set(t.map((r) => r.element)), n = /* @__PURE__ */ new Map();
e.forEach((r) => {
const i = Zd(r);
i.length && (n.set(r, i), r.render());
}), t.forEach((r) => r.measureInitialState()), e.forEach((r) => {
r.render();
const i = n.get(r);
i && i.forEach(([o, s]) => {
var a;
(a = r.getValue(o)) == null || a.set(s);
});
}), t.forEach((r) => r.measureEndState()), t.forEach((r) => {
r.suspendedScrollY !== void 0 && window.scrollTo(0, r.suspendedScrollY);
});
}
io = !1, ro = !1, hn.forEach((t) => t.complete(oo)), hn.clear();
}
function sc() {
hn.forEach((t) => {
t.readKeyframes(), t.needsMeasurement && (io = !0);
});
}
function Jd() {
oo = !0, sc(), oc(), oo = !1;
}
class qo {
constructor(e, n, r, i, o, s = !1) {
this.state = "pending", this.isAsync = !1, this.needsMeasurement = !1, this.unresolvedKeyframes = [...e], this.onComplete = n, this.name = r, this.motionValue = i, this.element = o, this.isAsync = s;
}
scheduleResolve() {
this.state = "scheduled", this.isAsync ? (hn.add(this), ro || (ro = !0, Re.read(sc), Re.resolveKeyframes(oc))) : (this.readKeyframes(), this.complete());
}
readKeyframes() {
const { unresolvedKeyframes: e, name: n, element: r, motionValue: i } = this;
if (e[0] === null) {
const o = i == null ? void 0 : i.get(), s = e[e.length - 1];
if (o !== void 0)
e[0] = o;
else if (r && n) {
const a = r.readValue(n, s);
a != null && (e[0] = a);
}
e[0] === void 0 && (e[0] = s), i && o === void 0 && i.set(e[0]);
}
Ud(e);
}
setFinalKeyframe() {
}
measureInitialState() {
}
renderEndStyles() {
}
measureEndState() {
}
complete(e = !1) {
this.state = "complete", this.onComplete(this.unresolvedKeyframes, this.finalKeyframe, e), hn.delete(this);
}
cancel() {
this.state === "scheduled" && (hn.delete(this), this.state = "pending");
}
resume() {
this.state === "pending" && this.scheduleResolve();
}
}
const eh = (t) => t.startsWith("--");
function th(t, e, n) {
eh(e) ? t.style.setProperty(e, n) : t.style[e] = n;
}
const nh = /* @__PURE__ */ Fo(() => window.ScrollTimeline !== void 0), rh = {};
function ih(t, e) {
const n = /* @__PURE__ */ Fo(t);
return () => rh[e] ?? n();
}
const ac = /* @__PURE__ */ ih(() => {
try {
document.createElement("div").animate({ opacity: 0 }, { easing: "linear(0, 1)" });
} catch {
return !1;
}
return !0;
}, "linearEasing"), Kn = ([t, e, n, r]) => `cubic-bezier(${t}, ${e}, ${n}, ${r})`, Bs = {
linear: "linear",
ease: "ease",
easeIn: "ease-in",
easeOut: "ease-out",
easeInOut: "ease-in-out",
circIn: /* @__PURE__ */ Kn([0, 0.65, 0.55, 1]),
circOut: /* @__PURE__ */ Kn([0.55, 0, 1, 0.45]),
backIn: /* @__PURE__ */ Kn([0.31, 0.01, 0.66, -0.59]),
backOut: /* @__PURE__ */ Kn([0.33, 1.53, 0.69, 0.99])
};
function lc(t, e) {
if (t)
return typeof t == "function" ? ac() ? nc(t, e) : "ease-out" : Yl(t) ? Kn(t) : Array.isArray(t) ? t.map((n) => lc(n, e) || Bs.easeOut) : Bs[t];
}
function oh(t, e, n, { delay: r = 0, duration: i = 300, repeat: o = 0, repeatType: s = "loop", ease: a = "easeOut", times: l } = {}, c = void 0) {
const u = {
[e]: n
};
l && (u.offset = l);
const f = lc(a, i);
Array.isArray(f) && (u.easing = f);
const h = {
delay: r,
duration: i,
easing: Array.isArray(f) ? "linear" : f,
fill: "both",
iterations: o + 1,
direction: s === "reverse" ? "alternate" : "normal"
};
return c && (h.pseudoElement = c), t.animate(u, h);
}
function cc(t) {
return typeof t == "function" && "applyToOptions" in t;
}
function sh({ type: t, ...e }) {
return cc(t) && ac() ? t.applyToOptions(e) : (e.duration ?? (e.duration = 300), e.ease ?? (e.ease = "easeOut"), e);
}
class ah extends Xo {
constructor(e) {
if (super(), this.finishedTime = null, this.isStopped = !1, !e)
return;
const { element: n, name: r, keyframes: i, pseudoElement: o, allowFlatten: s = !1, finalKeyframe: a, onComplete: l } = e;
this.isPseudoElement = !!o, this.allowFlatten = s, this.options = e, $t(typeof e.type != "string", `animateMini doesn't support "type" as a string. Did you mean to import { spring } from "motion"?`);
const c = sh(e);
this.animation = oh(n, r, i, c, o), c.autoplay === !1 && this.animation.pause(), this.animation.onfinish = () => {
if (this.finishedTime = this.time, !o) {
const u = Yo(i, this.options, a, this.speed);
this.updateMotionValue ? this.updateMotionValue(u) : th(n, r, u), this.animation.cancel();
}
l == null || l(), this.notifyFinished();
};
}
play() {
this.isStopped || (this.animation.play(), this.state === "finished" && this.updateFinished());
}
pause() {
this.animation.pause();
}
complete() {
var e, n;
(n = (e = this.animation).finish) == null || n.call(e);
}
cancel() {
try {
this.animation.cancel();
} catch {
}
}
stop() {
if (this.isStopped)
return;
this.isStopped = !0;
const { state: e } = this;
e === "idle" || e === "finished" || (this.updateMotionValue ? this.updateMotionValue() : this.commitStyles(), this.isPseudoElement || this.cancel());
}
/**
* WAAPI doesn't natively have any interruption capabilities.
*
* In this method, we commit styles back to the DOM before cancelling
* the animation.
*
* This is designed to be overridden by NativeAnimationExtended, which
* will create a renderless JS animation and sample it twice to calculate
* its current value, "previous" value, and therefore allow
* Motion to also correctly calculate velocity for any subsequent animation
* while deferring the commit until the next animation frame.
*/
commitStyles() {
var e, n;
this.isPseudoElement || (n = (e = this.animation).commitStyles) == null || n.call(e);
}
get duration() {
var n, r;
const e = ((r = (n = this.animation.effect) == null ? void 0 : n.getComputedTiming) == null ? void 0 : r.call(n).duration) || 0;
return /* @__PURE__ */ Mt(Number(e));
}
get time() {
return /* @__PURE__ */ Mt(Number(this.animation.currentTime) || 0);
}
set time(e) {
this.finishedTime = null, this.animation.currentTime = /* @__PURE__ */ pt(e);
}
/**
* The playback speed of the animation.
* 1 = normal speed, 2 = double speed, 0.5 = half speed.
*/
get speed() {
return this.animation.playbackRate;
}
set speed(e) {
e < 0 && (this.finishedTime = null), this.animation.playbackRate = e;
}
get state() {
return this.finishedTime !== null ? "finished" : this.animation.playState;
}
get startTime() {
return Number(this.animation.startTime);
}
set startTime(e) {
this.animation.startTime = e;
}
/**
* Attaches a timeline to the animation, for instance the `ScrollTimeline`.
*/
attachTimeline({ timeline: e, observe: n }) {
var r;
return this.allowFlatten && ((r = this.animation.effect) == null || r.updateTiming({ easing: "linear" })), this.animation.onfinish = null, e && nh() ? (this.animation.timeline = e, ft) : n(this);
}
}
const uc = {
anticipate: Wl,
backInOut: zl,
circInOut: Hl
};
function lh(t) {
return t in uc;
}
function ch(t) {
typeof t.ease == "string" && lh(t.ease) && (t.ease = uc[t.ease]);
}
const Ns = 10;
class uh extends ah {
constructor(e) {
ch(e), ic(e), super(e), e.startTime && (this.startTime = e.startTime), this.options = e;
}
/**
* WAAPI doesn't natively have any interruption capabilities.
*
* Rather than read commited styles back out of the DOM, we can
* create a renderless JS animation and sample it twice to calculate
* its current value, "previous" value, and therefore allow
* Motion to calculate velocity for any subsequent animation.
*/
updateMotionValue(e) {
const { motionValue: n, onUpdate: r, onComplete: i, element: o, ...s } = this.options;
if (!n)
return;
if (e !== void 0) {
n.set(e);
return;
}
const a = new Go({
...s,
autoplay: !1
}), l = /* @__PURE__ */ pt(this.finishedTime ?? this.time);
n.setWithVelocity(a.sample(l - Ns).value, a.sample(l).value, Ns), a.stop();
}
}
const $s = (t, e) => e === "zIndex" ? !1 : !!(typeof t == "number" || Array.isArray(t) || typeof t == "string" && // It's animatable if we have a string
(Zt.test(t) || t === "0") && // And it contains numbers and/or colors
!t.startsWith("url("));
function fh(t) {
const e = t[0];
if (t.length === 1)
return !0;
for (let n = 0; n < t.length; n++)
if (t[n] !== e)
return !0;
}
function dh(t, e, n, r) {
const i = t[0];
if (i === null)
return !1;
if (e === "display" || e === "visibility")
return !0;
const o = t[t.length - 1], s = $s(i, e), a = $s(o, e);
return Bn(s === a, `You are trying to animate ${e} from "${i}" to "${o}". ${i} is not an animatable value - to enable this animation set ${i} to a value animatable to ${o} via the \`style\` property.`), !s || !a ? !1 : fh(t) || (n === "spring" || cc(n)) && r;
}
function Ko(t) {
return Ll(t) && "offsetHeight" in t;
}
const hh = /* @__PURE__ */ new Set([
"opacity",
"clipPath",
"filter",
"transform"
// TODO: Could be re-enabled now we have support for linear() easing
// "background-color"
]), mh = /* @__PURE__ */ Fo(() => Object.hasOwnProperty.call(Element.prototype, "animate"));
function ph(t) {
var c;
const { motionValue: e, name: n, repeatDelay: r, repeatType: i, damping: o, type: s } = t;
if (!Ko((c = e == null ? void 0 : e.owner) == null ? void 0 : c.current))
return !1;
const { onUpdate: a, transformTemplate: l } = e.owner.getProps();
return mh() && n && hh.has(n) && (n !== "transform" || !l) && /**
* If we're outputting values to onUpdate then we can't use WAAPI as there's
* no way to read the value from WAAPI every frame.
*/
!a && !r && i !== "mirror" && o !== 0 && s !== "inertia";
}
const gh = 40;
class yh extends Xo {
constructor({ autoplay: e = !0, delay: n = 0, type: r = "keyframes", repeat: i = 0, repeatDelay: o = 0, repeatType: s = "loop", keyframes: a, name: l, motionValue: c, element: u, ...f }) {
var g;
super(), this.stop = () => {
var p, v;
this._animation && (this._animation.stop(), (p = this.stopTimeline) == null || p.call(this)), (v = this.keyframeResolver) == null || v.cancel();
}, this.createdAt = et.now();
const h = {
autoplay: e,
delay: n,
type: r,
repeat: i,
repeatDelay: o,
repeatType: s,
name: l,
motionValue: c,
element: u,
...f
}, m = (u == null ? void 0 : u.KeyframeResolver) || qo;
this.keyframeResolver = new m(a, (p, v, b) => this.onKeyframesResolved(p, v, h, !b), l, c, u), (g = this.keyframeResolver) == null || g.scheduleResolve();
}
onKeyframesResolved(e, n, r, i) {
this.keyframeResolver = void 0;
const { name: o, type: s, velocity: a, delay: l, isHandoff: c, onUpdate: u } = r;
this.resolvedAt = et.now(), dh(e, o, s, a) || ((zt.instantAnimations || !l) && (u == null || u(Yo(e, r, n))), e[0] = e[e.length - 1], r.duration = 0, r.repeat = 0);
const h = {
startTime: i ? this.resolvedAt ? this.resolvedAt - this.createdAt > gh ? this.resolvedAt : this.createdAt : this.createdAt : void 0,
finalKeyframe: n,
...r,
keyframes: e
}, m = !c && ph(h) ? new uh({
...h,
element: h.motionValue.owner.current
}) : new Go(h);
m.finished.then(() => this.notifyFinished()).catch(ft), this.pendingTimeline && (this.stopTimeline = m.attachTimeline(this.pendingTimeline), this.pendingTimeline = void 0), this._animation = m;
}
get finished() {
return this._animation ? this.animation.finished : this._finished;
}
then(e, n) {
return this.finished.finally(e).then(() => {
});
}
get animation() {
var e;
return this._animation || ((e = this.keyframeResolver) == null || e.resume(), Jd()), this._animation;
}
get duration() {
return this.animation.duration;
}
get time() {
return this.animation.time;
}
set time(e) {
this.animation.time = e;
}
get speed() {
return this.animation.speed;
}
get state() {
return this.animation.state;
}
set speed(e) {
this.animation.speed = e;
}
get startTime() {
return this.animation.startTime;
}
attachTimeline(e) {
return this._animation ? this.stopTimeline = this.animation.attachTimeline(e) : this.pendingTimeline = e, () => this.stop();
}
play() {
this.animation.play();
}
pause() {
this.animation.pause();
}
complete() {
this.animation.complete();
}
cancel() {
var e;
this._animation && this.animation.cancel(), (e = this.keyframeResolver) == null || e.cancel();
}
}
const vh = (
// eslint-disable-next-line redos-detector/no-unsafe-regex -- false positive, as it can match a lot of words
/^var\(--(?:([\w-]+)|([\w-]+), ?([a-zA-Z\d ()%#.,-]+))\)/u
);
function bh(t) {
const e = vh.exec(t);
if (!e)
return [,];
const [, n, r, i] = e;
return [`--${n ?? r}`, i];
}
const wh = 4;
function fc(t, e, n = 1) {
$t(n <= wh, `Max CSS variable fallback depth detected in property "${t}". This may indicate a circular fallback dependency.`);
const [r, i] = bh(t);
if (!r)
return;
const o = window.getComputedStyle(e).getPropertyValue(r);
if (o) {
const s = o.trim();
return Il(s) ? parseFloat(s) : s;
}
return zo(i) ? fc(i, e, n + 1) : i;
}
function Qo(t, e) {
return (t == null ? void 0 : t[e]) ?? (t == null ? void 0 : t.default) ?? t;
}
const dc = /* @__PURE__ */ new Set([
"width",
"height",
"top",
"left",
"right",
"bottom",
...$n
]), xh = {
test: (t) => t ===