@orangelogic/design-system 2.19.0-pr77202.21

package/library/chunks/animation.DPqSuC7g.js

@@ -0,0 +1,999 @@
+import { i as p, n as a, C as m, x as y, c as b } from "./custom-element.fmLrnDZr.js";
+import { c as u } from "./component.styles.DtouHn2g.js";
+import { w as d } from "./watch.BCJD77bD.js";
+import { r as g } from "./query-async.CTgXGyQ5.js";
+const h = p`
+  :host {
+    display: contents;
+  }
+`, x = [
+  {
+    easing: "cubic-bezier(0.215, 0.61, 0.355, 1)",
+    offset: 0,
+    transform: "translate3d(0, 0, 0)"
+  },
+  {
+    easing: "cubic-bezier(0.215, 0.61, 0.355, 1)",
+    offset: 0.2,
+    transform: "translate3d(0, 0, 0)"
+  },
+  {
+    easing: "cubic-bezier(0.755, 0.05, 0.855, 0.06)",
+    offset: 0.4,
+    transform: "translate3d(0, -30px, 0) scaleY(1.1)"
+  },
+  {
+    easing: "cubic-bezier(0.755, 0.05, 0.855, 0.06)",
+    offset: 0.43,
+    transform: "translate3d(0, -30px, 0) scaleY(1.1)"
+  },
+  {
+    easing: "cubic-bezier(0.215, 0.61, 0.355, 1)",
+    offset: 0.53,
+    transform: "translate3d(0, 0, 0)"
+  },
+  {
+    easing: "cubic-bezier(0.755, 0.05, 0.855, 0.06)",
+    offset: 0.7,
+    transform: "translate3d(0, -15px, 0) scaleY(1.05)"
+  },
+  {
+    offset: 0.8,
+    transform: "translate3d(0, 0, 0) scaleY(0.95)",
+    "transition-timing-function": "cubic-bezier(0.215, 0.61, 0.355, 1)"
+  },
+  { offset: 0.9, transform: "translate3d(0, -4px, 0) scaleY(1.02)" },
+  {
+    easing: "cubic-bezier(0.215, 0.61, 0.355, 1)",
+    offset: 1,
+    transform: "translate3d(0, 0, 0)"
+  }
+], z = [
+  { offset: 0, opacity: "1" },
+  { offset: 0.25, opacity: "0" },
+  { offset: 0.5, opacity: "1" },
+  { offset: 0.75, opacity: "0" },
+  { offset: 1, opacity: "1" }
+], O = [
+  { offset: 0, transform: "translateX(0)" },
+  { offset: 0.065, transform: "translateX(-6px) rotateY(-9deg)" },
+  { offset: 0.185, transform: "translateX(5px) rotateY(7deg)" },
+  { offset: 0.315, transform: "translateX(-3px) rotateY(-5deg)" },
+  { offset: 0.435, transform: "translateX(2px) rotateY(3deg)" },
+  { offset: 0.5, transform: "translateX(0)" }
+], I = [
+  { offset: 0, transform: "scale(1)" },
+  { offset: 0.14, transform: "scale(1.3)" },
+  { offset: 0.28, transform: "scale(1)" },
+  { offset: 0.42, transform: "scale(1.3)" },
+  { offset: 0.7, transform: "scale(1)" }
+], k = [
+  { offset: 0, transform: "translate3d(0, 0, 0)" },
+  { offset: 0.111, transform: "translate3d(0, 0, 0)" },
+  { offset: 0.222, transform: "skewX(-12.5deg) skewY(-12.5deg)" },
+  { offset: 0.33299999999999996, transform: "skewX(6.25deg) skewY(6.25deg)" },
+  { offset: 0.444, transform: "skewX(-3.125deg) skewY(-3.125deg)" },
+  { offset: 0.555, transform: "skewX(1.5625deg) skewY(1.5625deg)" },
+  {
+    offset: 0.6659999999999999,
+    transform: "skewX(-0.78125deg) skewY(-0.78125deg)"
+  },
+  { offset: 0.777, transform: "skewX(0.390625deg) skewY(0.390625deg)" },
+  { offset: 0.888, transform: "skewX(-0.1953125deg) skewY(-0.1953125deg)" },
+  { offset: 1, transform: "translate3d(0, 0, 0)" }
+], v = [
+  { offset: 0, transform: "scale3d(1, 1, 1)" },
+  { offset: 0.5, transform: "scale3d(1.05, 1.05, 1.05)" },
+  { offset: 1, transform: "scale3d(1, 1, 1)" }
+], w = [
+  { offset: 0, transform: "scale3d(1, 1, 1)" },
+  { offset: 0.3, transform: "scale3d(1.25, 0.75, 1)" },
+  { offset: 0.4, transform: "scale3d(0.75, 1.25, 1)" },
+  { offset: 0.5, transform: "scale3d(1.15, 0.85, 1)" },
+  { offset: 0.65, transform: "scale3d(0.95, 1.05, 1)" },
+  { offset: 0.75, transform: "scale3d(1.05, 0.95, 1)" },
+  { offset: 1, transform: "scale3d(1, 1, 1)" }
+], X = [
+  { offset: 0, transform: "translate3d(0, 0, 0)" },
+  { offset: 0.1, transform: "translate3d(-10px, 0, 0)" },
+  { offset: 0.2, transform: "translate3d(10px, 0, 0)" },
+  { offset: 0.3, transform: "translate3d(-10px, 0, 0)" },
+  { offset: 0.4, transform: "translate3d(10px, 0, 0)" },
+  { offset: 0.5, transform: "translate3d(-10px, 0, 0)" },
+  { offset: 0.6, transform: "translate3d(10px, 0, 0)" },
+  { offset: 0.7, transform: "translate3d(-10px, 0, 0)" },
+  { offset: 0.8, transform: "translate3d(10px, 0, 0)" },
+  { offset: 0.9, transform: "translate3d(-10px, 0, 0)" },
+  { offset: 1, transform: "translate3d(0, 0, 0)" }
+], Y = [
+  { offset: 0, transform: "translate3d(0, 0, 0)" },
+  { offset: 0.1, transform: "translate3d(-10px, 0, 0)" },
+  { offset: 0.2, transform: "translate3d(10px, 0, 0)" },
+  { offset: 0.3, transform: "translate3d(-10px, 0, 0)" },
+  { offset: 0.4, transform: "translate3d(10px, 0, 0)" },
+  { offset: 0.5, transform: "translate3d(-10px, 0, 0)" },
+  { offset: 0.6, transform: "translate3d(10px, 0, 0)" },
+  { offset: 0.7, transform: "translate3d(-10px, 0, 0)" },
+  { offset: 0.8, transform: "translate3d(10px, 0, 0)" },
+  { offset: 0.9, transform: "translate3d(-10px, 0, 0)" },
+  { offset: 1, transform: "translate3d(0, 0, 0)" }
+], R = [
+  { offset: 0, transform: "translate3d(0, 0, 0)" },
+  { offset: 0.1, transform: "translate3d(0, -10px, 0)" },
+  { offset: 0.2, transform: "translate3d(0, 10px, 0)" },
+  { offset: 0.3, transform: "translate3d(0, -10px, 0)" },
+  { offset: 0.4, transform: "translate3d(0, 10px, 0)" },
+  { offset: 0.5, transform: "translate3d(0, -10px, 0)" },
+  { offset: 0.6, transform: "translate3d(0, 10px, 0)" },
+  { offset: 0.7, transform: "translate3d(0, -10px, 0)" },
+  { offset: 0.8, transform: "translate3d(0, 10px, 0)" },
+  { offset: 0.9, transform: "translate3d(0, -10px, 0)" },
+  { offset: 1, transform: "translate3d(0, 0, 0)" }
+], C = [
+  { offset: 0.2, transform: "rotate3d(0, 0, 1, 15deg)" },
+  { offset: 0.4, transform: "rotate3d(0, 0, 1, -10deg)" },
+  { offset: 0.6, transform: "rotate3d(0, 0, 1, 5deg)" },
+  { offset: 0.8, transform: "rotate3d(0, 0, 1, -5deg)" },
+  { offset: 1, transform: "rotate3d(0, 0, 1, 0deg)" }
+], S = [
+  { offset: 0, transform: "scale3d(1, 1, 1)" },
+  { offset: 0.1, transform: "scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg)" },
+  { offset: 0.2, transform: "scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg)" },
+  { offset: 0.3, transform: "scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg)" },
+  { offset: 0.4, transform: "scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg)" },
+  { offset: 0.5, transform: "scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg)" },
+  { offset: 0.6, transform: "scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg)" },
+  { offset: 0.7, transform: "scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg)" },
+  { offset: 0.8, transform: "scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg)" },
+  { offset: 0.9, transform: "scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg)" },
+  { offset: 1, transform: "scale3d(1, 1, 1)" }
+], L = [
+  { offset: 0, transform: "translate3d(0, 0, 0)" },
+  {
+    offset: 0.15,
+    transform: "translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg)"
+  },
+  { offset: 0.3, transform: "translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg)" },
+  {
+    offset: 0.45,
+    transform: "translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg)"
+  },
+  { offset: 0.6, transform: "translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg)" },
+  {
+    offset: 0.75,
+    transform: "translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg)"
+  },
+  { offset: 1, transform: "translate3d(0, 0, 0)" }
+], D = [
+  { offset: 0, opacity: "0.7", transform: "translateY(-1200px) scale(0.7)" },
+  { offset: 0.8, opacity: "0.7", transform: "translateY(0px) scale(0.7)" },
+  { offset: 1, opacity: "1", transform: "scale(1)" }
+], A = [
+  { offset: 0, opacity: "0.7", transform: "translateX(-2000px) scale(0.7)" },
+  { offset: 0.8, opacity: "0.7", transform: "translateX(0px) scale(0.7)" },
+  { offset: 1, opacity: "1", transform: "scale(1)" }
+], B = [
+  { offset: 0, opacity: "0.7", transform: "translateX(2000px) scale(0.7)" },
+  { offset: 0.8, opacity: "0.7", transform: "translateX(0px) scale(0.7)" },
+  { offset: 1, opacity: "1", transform: "scale(1)" }
+], U = [
+  { offset: 0, opacity: "0.7", transform: "translateY(1200px) scale(0.7)" },
+  { offset: 0.8, opacity: "0.7", transform: "translateY(0px) scale(0.7)" },
+  { offset: 1, opacity: "1", transform: "scale(1)" }
+], E = [
+  { offset: 0, opacity: "1", transform: "scale(1)" },
+  { offset: 0.2, opacity: "0.7", transform: "translateY(0px) scale(0.7)" },
+  { offset: 1, opacity: "0.7", transform: "translateY(700px) scale(0.7)" }
+], T = [
+  { offset: 0, opacity: "1", transform: "scale(1)" },
+  { offset: 0.2, opacity: "0.7", transform: "translateX(0px) scale(0.7)" },
+  { offset: 1, opacity: "0.7", transform: "translateX(-2000px) scale(0.7)" }
+], _ = [
+  { offset: 0, opacity: "1", transform: "scale(1)" },
+  { offset: 0.2, opacity: "0.7", transform: "translateX(0px) scale(0.7)" },
+  { offset: 1, opacity: "0.7", transform: "translateX(2000px) scale(0.7)" }
+], P = [
+  { offset: 0, opacity: "1", transform: "scale(1)" },
+  { offset: 0.2, opacity: "0.7", transform: "translateY(0px) scale(0.7)" },
+  { offset: 1, opacity: "0.7", transform: "translateY(-700px) scale(0.7)" }
+], Q = [
+  { offset: 0, opacity: "0", transform: "scale3d(0.3, 0.3, 0.3)" },
+  { easing: "cubic-bezier(0.215, 0.61, 0.355, 1)", offset: 0 },
+  { offset: 0.2, transform: "scale3d(1.1, 1.1, 1.1)" },
+  { easing: "cubic-bezier(0.215, 0.61, 0.355, 1)", offset: 0.2 },
+  { offset: 0.4, transform: "scale3d(0.9, 0.9, 0.9)" },
+  { easing: "cubic-bezier(0.215, 0.61, 0.355, 1)", offset: 0.4 },
+  { offset: 0.6, opacity: "1", transform: "scale3d(1.03, 1.03, 1.03)" },
+  { easing: "cubic-bezier(0.215, 0.61, 0.355, 1)", offset: 0.6 },
+  { offset: 0.8, transform: "scale3d(0.97, 0.97, 0.97)" },
+  { easing: "cubic-bezier(0.215, 0.61, 0.355, 1)", offset: 0.8 },
+  { offset: 1, opacity: "1", transform: "scale3d(1, 1, 1)" },
+  { easing: "cubic-bezier(0.215, 0.61, 0.355, 1)", offset: 1 }
+], j = [
+  {
+    offset: 0,
+    opacity: "0",
+    transform: "translate3d(0, -3000px, 0) scaleY(3)"
+  },
+  { easing: "cubic-bezier(0.215, 0.61, 0.355, 1)", offset: 0 },
+  {
+    offset: 0.6,
+    opacity: "1",
+    transform: "translate3d(0, 25px, 0) scaleY(0.9)"
+  },
+  { easing: "cubic-bezier(0.215, 0.61, 0.355, 1)", offset: 0.6 },
+  { offset: 0.75, transform: "translate3d(0, -10px, 0) scaleY(0.95)" },
+  { easing: "cubic-bezier(0.215, 0.61, 0.355, 1)", offset: 0.75 },
+  { offset: 0.9, transform: "translate3d(0, 5px, 0) scaleY(0.985)" },
+  { easing: "cubic-bezier(0.215, 0.61, 0.355, 1)", offset: 0.9 },
+  { offset: 1, transform: "translate3d(0, 0, 0)" },
+  { easing: "cubic-bezier(0.215, 0.61, 0.355, 1)", offset: 1 }
+], N = [
+  {
+    offset: 0,
+    opacity: "0",
+    transform: "translate3d(-3000px, 0, 0) scaleX(3)"
+  },
+  { easing: "cubic-bezier(0.215, 0.61, 0.355, 1)", offset: 0 },
+  { offset: 0.6, opacity: "1", transform: "translate3d(25px, 0, 0) scaleX(1)" },
+  { easing: "cubic-bezier(0.215, 0.61, 0.355, 1)", offset: 0.6 },
+  { offset: 0.75, transform: "translate3d(-10px, 0, 0) scaleX(0.98)" },
+  { easing: "cubic-bezier(0.215, 0.61, 0.355, 1)", offset: 0.75 },
+  { offset: 0.9, transform: "translate3d(5px, 0, 0) scaleX(0.995)" },
+  { easing: "cubic-bezier(0.215, 0.61, 0.355, 1)", offset: 0.9 },
+  { offset: 1, transform: "translate3d(0, 0, 0)" },
+  { easing: "cubic-bezier(0.215, 0.61, 0.355, 1)", offset: 1 }
+], F = [
+  { offset: 0, opacity: "0", transform: "translate3d(3000px, 0, 0) scaleX(3)" },
+  { easing: "cubic-bezier(0.215, 0.61, 0.355, 1)", offset: 0 },
+  {
+    offset: 0.6,
+    opacity: "1",
+    transform: "translate3d(-25px, 0, 0) scaleX(1)"
+  },
+  { easing: "cubic-bezier(0.215, 0.61, 0.355, 1)", offset: 0.6 },
+  { offset: 0.75, transform: "translate3d(10px, 0, 0) scaleX(0.98)" },
+  { easing: "cubic-bezier(0.215, 0.61, 0.355, 1)", offset: 0.75 },
+  { offset: 0.9, transform: "translate3d(-5px, 0, 0) scaleX(0.995)" },
+  { easing: "cubic-bezier(0.215, 0.61, 0.355, 1)", offset: 0.9 },
+  { offset: 1, transform: "translate3d(0, 0, 0)" },
+  { easing: "cubic-bezier(0.215, 0.61, 0.355, 1)", offset: 1 }
+], M = [
+  { offset: 0, opacity: "0", transform: "translate3d(0, 3000px, 0) scaleY(5)" },
+  { easing: "cubic-bezier(0.215, 0.61, 0.355, 1)", offset: 0 },
+  {
+    offset: 0.6,
+    opacity: "1",
+    transform: "translate3d(0, -20px, 0) scaleY(0.9)"
+  },
+  { easing: "cubic-bezier(0.215, 0.61, 0.355, 1)", offset: 0.6 },
+  { offset: 0.75, transform: "translate3d(0, 10px, 0) scaleY(0.95)" },
+  { easing: "cubic-bezier(0.215, 0.61, 0.355, 1)", offset: 0.75 },
+  { offset: 0.9, transform: "translate3d(0, -5px, 0) scaleY(0.985)" },
+  { easing: "cubic-bezier(0.215, 0.61, 0.355, 1)", offset: 0.9 },
+  { offset: 1, transform: "translate3d(0, 0, 0)" },
+  { easing: "cubic-bezier(0.215, 0.61, 0.355, 1)", offset: 1 }
+], $ = [
+  { offset: 0.2, transform: "scale3d(0.9, 0.9, 0.9)" },
+  { offset: 0.5, opacity: "1", transform: "scale3d(1.1, 1.1, 1.1)" },
+  { offset: 0.55, opacity: "1", transform: "scale3d(1.1, 1.1, 1.1)" },
+  { offset: 1, opacity: "0", transform: "scale3d(0.3, 0.3, 0.3)" }
+], q = [
+  { offset: 0.2, transform: "translate3d(0, 10px, 0) scaleY(0.985)" },
+  {
+    offset: 0.4,
+    opacity: "1",
+    transform: "translate3d(0, -20px, 0) scaleY(0.9)"
+  },
+  {
+    offset: 0.45,
+    opacity: "1",
+    transform: "translate3d(0, -20px, 0) scaleY(0.9)"
+  },
+  { offset: 1, opacity: "0", transform: "translate3d(0, 2000px, 0) scaleY(3)" }
+], G = [
+  {
+    offset: 0.2,
+    opacity: "1",
+    transform: "translate3d(20px, 0, 0) scaleX(0.9)"
+  },
+  {
+    offset: 1,
+    opacity: "0",
+    transform: "translate3d(-2000px, 0, 0) scaleX(2)"
+  }
+], H = [
+  {
+    offset: 0.2,
+    opacity: "1",
+    transform: "translate3d(-20px, 0, 0) scaleX(0.9)"
+  },
+  { offset: 1, opacity: "0", transform: "translate3d(2000px, 0, 0) scaleX(2)" }
+], J = [
+  { offset: 0.2, transform: "translate3d(0, -10px, 0) scaleY(0.985)" },
+  {
+    offset: 0.4,
+    opacity: "1",
+    transform: "translate3d(0, 20px, 0) scaleY(0.9)"
+  },
+  {
+    offset: 0.45,
+    opacity: "1",
+    transform: "translate3d(0, 20px, 0) scaleY(0.9)"
+  },
+  {
+    offset: 1,
+    opacity: "0",
+    transform: "translate3d(0, -2000px, 0) scaleY(3)"
+  }
+], K = [
+  { offset: 0, opacity: "0" },
+  { offset: 1, opacity: "1" }
+], V = [
+  { offset: 0, opacity: "0", transform: "translate3d(-100%, 100%, 0)" },
+  { offset: 1, opacity: "1", transform: "translate3d(0, 0, 0)" }
+], W = [
+  { offset: 0, opacity: "0", transform: "translate3d(100%, 100%, 0)" },
+  { offset: 1, opacity: "1", transform: "translate3d(0, 0, 0)" }
+], Z = [
+  { offset: 0, opacity: "0", transform: "translate3d(0, -100%, 0)" },
+  { offset: 1, opacity: "1", transform: "translate3d(0, 0, 0)" }
+], tt = [
+  { offset: 0, opacity: "0", transform: "translate3d(0, -2000px, 0)" },
+  { offset: 1, opacity: "1", transform: "translate3d(0, 0, 0)" }
+], et = [
+  { offset: 0, opacity: "0", transform: "translate3d(-100%, 0, 0)" },
+  { offset: 1, opacity: "1", transform: "translate3d(0, 0, 0)" }
+], at = [
+  { offset: 0, opacity: "0", transform: "translate3d(-2000px, 0, 0)" },
+  { offset: 1, opacity: "1", transform: "translate3d(0, 0, 0)" }
+], st = [
+  { offset: 0, opacity: "0", transform: "translate3d(100%, 0, 0)" },
+  { offset: 1, opacity: "1", transform: "translate3d(0, 0, 0)" }
+], ot = [
+  { offset: 0, opacity: "0", transform: "translate3d(2000px, 0, 0)" },
+  { offset: 1, opacity: "1", transform: "translate3d(0, 0, 0)" }
+], rt = [
+  { offset: 0, opacity: "0", transform: "translate3d(-100%, -100%, 0)" },
+  { offset: 1, opacity: "1", transform: "translate3d(0, 0, 0)" }
+], ft = [
+  { offset: 0, opacity: "0", transform: "translate3d(100%, -100%, 0)" },
+  { offset: 1, opacity: "1", transform: "translate3d(0, 0, 0)" }
+], nt = [
+  { offset: 0, opacity: "0", transform: "translate3d(0, 100%, 0)" },
+  { offset: 1, opacity: "1", transform: "translate3d(0, 0, 0)" }
+], it = [
+  { offset: 0, opacity: "0", transform: "translate3d(0, 2000px, 0)" },
+  { offset: 1, opacity: "1", transform: "translate3d(0, 0, 0)" }
+], ct = [
+  { offset: 0, opacity: "1" },
+  { offset: 1, opacity: "0" }
+], dt = [
+  { offset: 0, opacity: "1", transform: "translate3d(0, 0, 0)" },
+  { offset: 1, opacity: "0", transform: "translate3d(-100%, 100%, 0)" }
+], lt = [
+  { offset: 0, opacity: "1", transform: "translate3d(0, 0, 0)" },
+  { offset: 1, opacity: "0", transform: "translate3d(100%, 100%, 0)" }
+], pt = [
+  { offset: 0, opacity: "1" },
+  { offset: 1, opacity: "0", transform: "translate3d(0, 100%, 0)" }
+], mt = [
+  { offset: 0, opacity: "1" },
+  { offset: 1, opacity: "0", transform: "translate3d(0, 2000px, 0)" }
+], yt = [
+  { offset: 0, opacity: "1" },
+  { offset: 1, opacity: "0", transform: "translate3d(-100%, 0, 0)" }
+], bt = [
+  { offset: 0, opacity: "1" },
+  { offset: 1, opacity: "0", transform: "translate3d(-2000px, 0, 0)" }
+], ut = [
+  { offset: 0, opacity: "1" },
+  { offset: 1, opacity: "0", transform: "translate3d(100%, 0, 0)" }
+], gt = [
+  { offset: 0, opacity: "1" },
+  { offset: 1, opacity: "0", transform: "translate3d(2000px, 0, 0)" }
+], ht = [
+  { offset: 0, opacity: "1", transform: "translate3d(0, 0, 0)" },
+  { offset: 1, opacity: "0", transform: "translate3d(-100%, -100%, 0)" }
+], xt = [
+  { offset: 0, opacity: "1", transform: "translate3d(0, 0, 0)" },
+  { offset: 1, opacity: "0", transform: "translate3d(100%, -100%, 0)" }
+], zt = [
+  { offset: 0, opacity: "1" },
+  { offset: 1, opacity: "0", transform: "translate3d(0, -100%, 0)" }
+], Ot = [
+  { offset: 0, opacity: "1" },
+  { offset: 1, opacity: "0", transform: "translate3d(0, -2000px, 0)" }
+], It = [
+  {
+    easing: "ease-out",
+    offset: 0,
+    transform: "perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg)"
+  },
+  {
+    easing: "ease-out",
+    offset: 0.4,
+    transform: `perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
+      rotate3d(0, 1, 0, -190deg)`
+  },
+  {
+    easing: "ease-in",
+    offset: 0.5,
+    transform: `perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
+      rotate3d(0, 1, 0, -170deg)`
+  },
+  {
+    easing: "ease-in",
+    offset: 0.8,
+    transform: `perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0)
+      rotate3d(0, 1, 0, 0deg)`
+  },
+  {
+    easing: "ease-in",
+    offset: 1,
+    transform: "perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg)"
+  }
+], kt = [
+  {
+    easing: "ease-in",
+    offset: 0,
+    opacity: "0",
+    transform: "perspective(400px) rotate3d(1, 0, 0, 90deg)"
+  },
+  {
+    easing: "ease-in",
+    offset: 0.4,
+    transform: "perspective(400px) rotate3d(1, 0, 0, -20deg)"
+  },
+  {
+    offset: 0.6,
+    opacity: "1",
+    transform: "perspective(400px) rotate3d(1, 0, 0, 10deg)"
+  },
+  { offset: 0.8, transform: "perspective(400px) rotate3d(1, 0, 0, -5deg)" },
+  { offset: 1, transform: "perspective(400px)" }
+], vt = [
+  {
+    easing: "ease-in",
+    offset: 0,
+    opacity: "0",
+    transform: "perspective(400px) rotate3d(0, 1, 0, 90deg)"
+  },
+  {
+    easing: "ease-in",
+    offset: 0.4,
+    transform: "perspective(400px) rotate3d(0, 1, 0, -20deg)"
+  },
+  {
+    offset: 0.6,
+    opacity: "1",
+    transform: "perspective(400px) rotate3d(0, 1, 0, 10deg)"
+  },
+  { offset: 0.8, transform: "perspective(400px) rotate3d(0, 1, 0, -5deg)" },
+  { offset: 1, transform: "perspective(400px)" }
+], wt = [
+  { offset: 0, transform: "perspective(400px)" },
+  {
+    offset: 0.3,
+    opacity: "1",
+    transform: "perspective(400px) rotate3d(1, 0, 0, -20deg)"
+  },
+  {
+    offset: 1,
+    opacity: "0",
+    transform: "perspective(400px) rotate3d(1, 0, 0, 90deg)"
+  }
+], Xt = [
+  { offset: 0, transform: "perspective(400px)" },
+  {
+    offset: 0.3,
+    opacity: "1",
+    transform: "perspective(400px) rotate3d(0, 1, 0, -15deg)"
+  },
+  {
+    offset: 1,
+    opacity: "0",
+    transform: "perspective(400px) rotate3d(0, 1, 0, 90deg)"
+  }
+], Yt = [
+  {
+    offset: 0,
+    opacity: "0",
+    transform: "translate3d(-100%, 0, 0) skewX(30deg)"
+  },
+  { offset: 0.6, opacity: "1", transform: "skewX(-20deg)" },
+  { offset: 0.8, transform: "skewX(5deg)" },
+  { offset: 1, transform: "translate3d(0, 0, 0)" }
+], Rt = [
+  {
+    offset: 0,
+    opacity: "0",
+    transform: "translate3d(100%, 0, 0) skewX(-30deg)"
+  },
+  { offset: 0.6, opacity: "1", transform: "skewX(20deg)" },
+  { offset: 0.8, transform: "skewX(-5deg)" },
+  { offset: 1, transform: "translate3d(0, 0, 0)" }
+], Ct = [
+  { offset: 0, opacity: "1" },
+  {
+    offset: 1,
+    opacity: "0",
+    transform: "translate3d(-100%, 0, 0) skewX(-30deg)"
+  }
+], St = [
+  { offset: 0, opacity: "1" },
+  {
+    offset: 1,
+    opacity: "0",
+    transform: "translate3d(100%, 0, 0) skewX(30deg)"
+  }
+], Lt = [
+  { offset: 0, opacity: "0", transform: "rotate3d(0, 0, 1, -200deg)" },
+  { offset: 1, opacity: "1", transform: "translate3d(0, 0, 0)" }
+], Dt = [
+  { offset: 0, opacity: "0", transform: "rotate3d(0, 0, 1, -45deg)" },
+  { offset: 1, opacity: "1", transform: "translate3d(0, 0, 0)" }
+], At = [
+  { offset: 0, opacity: "0", transform: "rotate3d(0, 0, 1, 45deg)" },
+  { offset: 1, opacity: "1", transform: "translate3d(0, 0, 0)" }
+], Bt = [
+  { offset: 0, opacity: "0", transform: "rotate3d(0, 0, 1, 45deg)" },
+  { offset: 1, opacity: "1", transform: "translate3d(0, 0, 0)" }
+], Ut = [
+  { offset: 0, opacity: "0", transform: "rotate3d(0, 0, 1, -90deg)" },
+  { offset: 1, opacity: "1", transform: "translate3d(0, 0, 0)" }
+], Et = [
+  { offset: 0, opacity: "1" },
+  { offset: 1, opacity: "0", transform: "rotate3d(0, 0, 1, 200deg)" }
+], Tt = [
+  { offset: 0, opacity: "1" },
+  { offset: 1, opacity: "0", transform: "rotate3d(0, 0, 1, 45deg)" }
+], _t = [
+  { offset: 0, opacity: "1" },
+  { offset: 1, opacity: "0", transform: "rotate3d(0, 0, 1, -45deg)" }
+], Pt = [
+  { offset: 0, opacity: "1" },
+  { offset: 1, opacity: "0", transform: "rotate3d(0, 0, 1, -45deg)" }
+], Qt = [
+  { offset: 0, opacity: "1" },
+  { offset: 1, opacity: "0", transform: "rotate3d(0, 0, 1, 90deg)" }
+], jt = [
+  { offset: 0, transform: "translate3d(0, -100%, 0)", visibility: "visible" },
+  { offset: 1, transform: "translate3d(0, 0, 0)" }
+], Nt = [
+  { offset: 0, transform: "translate3d(-100%, 0, 0)", visibility: "visible" },
+  { offset: 1, transform: "translate3d(0, 0, 0)" }
+], Ft = [
+  { offset: 0, transform: "translate3d(100%, 0, 0)", visibility: "visible" },
+  { offset: 1, transform: "translate3d(0, 0, 0)" }
+], Mt = [
+  { offset: 0, transform: "translate3d(0, 100%, 0)", visibility: "visible" },
+  { offset: 1, transform: "translate3d(0, 0, 0)" }
+], $t = [
+  { offset: 0, transform: "translate3d(0, 0, 0)" },
+  { offset: 1, transform: "translate3d(0, 100%, 0)", visibility: "hidden" }
+], qt = [
+  { offset: 0, transform: "translate3d(0, 0, 0)" },
+  { offset: 1, transform: "translate3d(-100%, 0, 0)", visibility: "hidden" }
+], Gt = [
+  { offset: 0, transform: "translate3d(0, 0, 0)" },
+  { offset: 1, transform: "translate3d(100%, 0, 0)", visibility: "hidden" }
+], Ht = [
+  { offset: 0, transform: "translate3d(0, 0, 0)" },
+  { offset: 1, transform: "translate3d(0, -100%, 0)", visibility: "hidden" }
+], Jt = [
+  { easing: "ease-in-out", offset: 0 },
+  { easing: "ease-in-out", offset: 0.2, transform: "rotate3d(0, 0, 1, 80deg)" },
+  {
+    easing: "ease-in-out",
+    offset: 0.4,
+    opacity: "1",
+    transform: "rotate3d(0, 0, 1, 60deg)"
+  },
+  { easing: "ease-in-out", offset: 0.6, transform: "rotate3d(0, 0, 1, 80deg)" },
+  {
+    easing: "ease-in-out",
+    offset: 0.8,
+    opacity: "1",
+    transform: "rotate3d(0, 0, 1, 60deg)"
+  },
+  { offset: 1, opacity: "0", transform: "translate3d(0, 700px, 0)" }
+], Kt = [
+  {
+    offset: 0,
+    opacity: "0",
+    transform: "scale(0.1) rotate(30deg)",
+    "transform-origin": "center bottom"
+  },
+  { offset: 0.5, transform: "rotate(-10deg)" },
+  { offset: 0.7, transform: "rotate(3deg)" },
+  { offset: 1, opacity: "1", transform: "scale(1)" }
+], Vt = [
+  {
+    offset: 0,
+    opacity: "0",
+    transform: "translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg)"
+  },
+  { offset: 1, opacity: "1", transform: "translate3d(0, 0, 0)" }
+], Wt = [
+  { offset: 0, opacity: "1" },
+  {
+    offset: 1,
+    opacity: "0",
+    transform: "translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg)"
+  }
+], Zt = [
+  { offset: 0, opacity: "0", transform: "scale3d(0.3, 0.3, 0.3)" },
+  { offset: 0.5, opacity: "1" }
+], te = [
+  {
+    easing: "cubic-bezier(0.55, 0.055, 0.675, 0.19)",
+    offset: 0,
+    opacity: "0",
+    transform: "scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0)"
+  },
+  {
+    easing: "cubic-bezier(0.175, 0.885, 0.32, 1)",
+    offset: 0.6,
+    opacity: "1",
+    transform: "scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0)"
+  }
+], ee = [
+  {
+    easing: "cubic-bezier(0.55, 0.055, 0.675, 0.19)",
+    offset: 0,
+    opacity: "0",
+    transform: "scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0)"
+  },
+  {
+    easing: "cubic-bezier(0.175, 0.885, 0.32, 1)",
+    offset: 0.6,
+    opacity: "1",
+    transform: "scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0)"
+  }
+], ae = [
+  {
+    easing: "cubic-bezier(0.55, 0.055, 0.675, 0.19)",
+    offset: 0,
+    opacity: "0",
+    transform: "scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0)"
+  },
+  {
+    easing: "cubic-bezier(0.175, 0.885, 0.32, 1)",
+    offset: 0.6,
+    opacity: "1",
+    transform: "scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0)"
+  }
+], se = [
+  {
+    easing: "cubic-bezier(0.55, 0.055, 0.675, 0.19)",
+    offset: 0,
+    opacity: "0",
+    transform: "scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0)"
+  },
+  {
+    easing: "cubic-bezier(0.175, 0.885, 0.32, 1)",
+    offset: 0.6,
+    opacity: "1",
+    transform: "scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0)"
+  }
+], oe = [
+  { offset: 0, opacity: "1" },
+  { offset: 0.5, opacity: "0", transform: "scale3d(0.3, 0.3, 0.3)" },
+  { offset: 1, opacity: "0" }
+], re = [
+  {
+    easing: "cubic-bezier(0.55, 0.055, 0.675, 0.19)",
+    offset: 0.4,
+    opacity: "1",
+    transform: "scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0)"
+  },
+  {
+    easing: "cubic-bezier(0.175, 0.885, 0.32, 1)",
+    offset: 1,
+    opacity: "0",
+    transform: "scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0)"
+  }
+], fe = [
+  {
+    offset: 0.4,
+    opacity: "1",
+    transform: "scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0)"
+  },
+  {
+    offset: 1,
+    opacity: "0",
+    transform: "scale(0.1) translate3d(-2000px, 0, 0)"
+  }
+], ne = [
+  {
+    offset: 0.4,
+    opacity: "1",
+    transform: "scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0)"
+  },
+  {
+    offset: 1,
+    opacity: "0",
+    transform: "scale(0.1) translate3d(2000px, 0, 0)"
+  }
+], ie = [
+  {
+    easing: "cubic-bezier(0.55, 0.055, 0.675, 0.19)",
+    offset: 0.4,
+    opacity: "1",
+    transform: "scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0)"
+  },
+  {
+    easing: "cubic-bezier(0.175, 0.885, 0.32, 1)",
+    offset: 1,
+    opacity: "0",
+    transform: "scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0)"
+  }
+], l = {
+  ease: "ease",
+  easeIn: "ease-in",
+  easeInBack: "cubic-bezier(0.6, -0.28, 0.735, 0.045)",
+  easeInCirc: "cubic-bezier(0.6, 0.04, 0.98, 0.335)",
+  easeInCubic: "cubic-bezier(0.55, 0.055, 0.675, 0.19)",
+  easeInExpo: "cubic-bezier(0.95, 0.05, 0.795, 0.035)",
+  easeInOut: "ease-in-out",
+  easeInOutBack: "cubic-bezier(0.68, -0.55, 0.265, 1.55)",
+  easeInOutCirc: "cubic-bezier(0.785, 0.135, 0.15, 0.86)",
+  easeInOutCubic: "cubic-bezier(0.645, 0.045, 0.355, 1)",
+  easeInOutExpo: "cubic-bezier(1, 0, 0, 1)",
+  easeInOutQuad: "cubic-bezier(0.455, 0.03, 0.515, 0.955)",
+  easeInOutQuart: "cubic-bezier(0.77, 0, 0.175, 1)",
+  easeInOutQuint: "cubic-bezier(0.86, 0, 0.07, 1)",
+  easeInOutSine: "cubic-bezier(0.445, 0.05, 0.55, 0.95)",
+  easeInQuad: "cubic-bezier(0.55, 0.085, 0.68, 0.53)",
+  easeInQuart: "cubic-bezier(0.895, 0.03, 0.685, 0.22)",
+  easeInQuint: "cubic-bezier(0.755, 0.05, 0.855, 0.06)",
+  easeInSine: "cubic-bezier(0.47, 0, 0.745, 0.715)",
+  easeOut: "ease-out",
+  easeOutBack: "cubic-bezier(0.175, 0.885, 0.32, 1.275)",
+  easeOutCirc: "cubic-bezier(0.075, 0.82, 0.165, 1)",
+  easeOutCubic: "cubic-bezier(0.215, 0.61, 0.355, 1)",
+  easeOutExpo: "cubic-bezier(0.19, 1, 0.22, 1)",
+  easeOutQuad: "cubic-bezier(0.25, 0.46, 0.45, 0.94)",
+  easeOutQuart: "cubic-bezier(0.165, 0.84, 0.44, 1)",
+  easeOutQuint: "cubic-bezier(0.23, 1, 0.32, 1)",
+  easeOutSine: "cubic-bezier(0.39, 0.575, 0.565, 1)",
+  linear: "linear"
+}, ce = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  backInDown: D,
+  backInLeft: A,
+  backInRight: B,
+  backInUp: U,
+  backOutDown: E,
+  backOutLeft: T,
+  backOutRight: _,
+  backOutUp: P,
+  bounce: x,
+  bounceIn: Q,
+  bounceInDown: j,
+  bounceInLeft: N,
+  bounceInRight: F,
+  bounceInUp: M,
+  bounceOut: $,
+  bounceOutDown: q,
+  bounceOutLeft: G,
+  bounceOutRight: H,
+  bounceOutUp: J,
+  easings: l,
+  fadeIn: K,
+  fadeInBottomLeft: V,
+  fadeInBottomRight: W,
+  fadeInDown: Z,
+  fadeInDownBig: tt,
+  fadeInLeft: et,
+  fadeInLeftBig: at,
+  fadeInRight: st,
+  fadeInRightBig: ot,
+  fadeInTopLeft: rt,
+  fadeInTopRight: ft,
+  fadeInUp: nt,
+  fadeInUpBig: it,
+  fadeOut: ct,
+  fadeOutBottomLeft: dt,
+  fadeOutBottomRight: lt,
+  fadeOutDown: pt,
+  fadeOutDownBig: mt,
+  fadeOutLeft: yt,
+  fadeOutLeftBig: bt,
+  fadeOutRight: ut,
+  fadeOutRightBig: gt,
+  fadeOutTopLeft: ht,
+  fadeOutTopRight: xt,
+  fadeOutUp: zt,
+  fadeOutUpBig: Ot,
+  flash: z,
+  flip: It,
+  flipInX: kt,
+  flipInY: vt,
+  flipOutX: wt,
+  flipOutY: Xt,
+  headShake: O,
+  heartBeat: I,
+  hinge: Jt,
+  jackInTheBox: Kt,
+  jello: k,
+  lightSpeedInLeft: Yt,
+  lightSpeedInRight: Rt,
+  lightSpeedOutLeft: Ct,
+  lightSpeedOutRight: St,
+  pulse: v,
+  rollIn: Vt,
+  rollOut: Wt,
+  rotateIn: Lt,
+  rotateInDownLeft: Dt,
+  rotateInDownRight: At,
+  rotateInUpLeft: Bt,
+  rotateInUpRight: Ut,
+  rotateOut: Et,
+  rotateOutDownLeft: Tt,
+  rotateOutDownRight: _t,
+  rotateOutUpLeft: Pt,
+  rotateOutUpRight: Qt,
+  rubberBand: w,
+  shake: X,
+  shakeX: Y,
+  shakeY: R,
+  slideInDown: jt,
+  slideInLeft: Nt,
+  slideInRight: Ft,
+  slideInUp: Mt,
+  slideOutDown: $t,
+  slideOutLeft: qt,
+  slideOutRight: Gt,
+  slideOutUp: Ht,
+  swing: C,
+  tada: S,
+  wobble: L,
+  zoomIn: Zt,
+  zoomInDown: te,
+  zoomInLeft: ee,
+  zoomInRight: ae,
+  zoomInUp: se,
+  zoomOut: oe,
+  zoomOutDown: re,
+  zoomOutLeft: fe,
+  zoomOutRight: ne,
+  zoomOutUp: ie
+}, Symbol.toStringTag, { value: "Module" }));
+var de = Object.defineProperty, le = Object.getOwnPropertyDescriptor, e = (f, s, n, o) => {
+  for (var r = o > 1 ? void 0 : o ? le(s, n) : s, i = f.length - 1, c; i >= 0; i--)
+    (c = f[i]) && (r = (o ? c(s, n, r) : c(r)) || r);
+  return o && r && de(s, n, r), r;
+};
+let t = class extends m {
+  constructor() {
+    super(), this.hasStarted = !1, this.name = "none", this.play = !1, this.delay = 0, this.direction = "normal", this.duration = 1e3, this.easing = "linear", this.endDelay = 0, this.fill = "auto", this.iterations = 1 / 0, this.iterationStart = 0, this.playbackRate = 1, this.handleAnimationFinish = this.handleAnimationFinish.bind(this), this.handleAnimationCancel = this.handleAnimationCancel.bind(this);
+  }
+  /** Gets and sets the current animation time. */
+  get currentTime() {
+    return this.animation?.currentTime ?? 0;
+  }
+  set currentTime(f) {
+    this.animation && (this.animation.currentTime = f);
+  }
+  connectedCallback() {
+    super.connectedCallback(), this.createAnimation();
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback(), this.destroyAnimation();
+  }
+  handleAnimationFinish() {
+    this.play = !1, this.hasStarted = !1, this.emit("cx-finish");
+  }
+  handleAnimationCancel() {
+    this.play = !1, this.hasStarted = !1, this.emit("cx-cancel");
+  }
+  handleSlotChange() {
+    this.destroyAnimation(), this.createAnimation();
+  }
+  async createAnimation() {
+    const f = l[this.easing] ?? this.easing, s = this.keyframes ?? ce[this.name], o = (await this.defaultSlot).assignedElements()[0];
+    return !o || !s ? !1 : (this.destroyAnimation(), this.animation = o.animate(s, {
+      delay: this.delay,
+      direction: this.direction,
+      duration: this.duration,
+      easing: f,
+      endDelay: this.endDelay,
+      fill: this.fill,
+      iterationStart: this.iterationStart,
+      iterations: this.iterations
+    }), this.animation.playbackRate = this.playbackRate, this.animation.addEventListener("cancel", this.handleAnimationCancel), this.animation.addEventListener("finish", this.handleAnimationFinish), this.play ? (this.hasStarted = !0, this.emit("cx-start")) : this.animation.pause(), !0);
+  }
+  destroyAnimation() {
+    this.animation && (this.animation.cancel(), this.animation.removeEventListener("cancel", this.handleAnimationCancel), this.animation.removeEventListener("finish", this.handleAnimationFinish), this.hasStarted = !1);
+  }
+  handleAnimationChange() {
+    this.hasUpdated && this.createAnimation();
+  }
+  handlePlayChange() {
+    return this.animation ? (this.play && !this.hasStarted && (this.hasStarted = !0, this.emit("cx-start")), this.play ? this.animation.play() : this.animation.pause(), !0) : !1;
+  }
+  handlePlaybackRateChange() {
+    this.animation && (this.animation.playbackRate = this.playbackRate);
+  }
+  /** Clears all keyframe effects caused by this animation and aborts its playback. */
+  cancel() {
+    this.animation?.cancel();
+  }
+  /** Sets the playback time to the end of the animation corresponding to the current playback direction. */
+  finish() {
+    this.animation?.finish();
+  }
+  render() {
+    return y` <slot @slotchange=${this.handleSlotChange}></slot> `;
+  }
+};
+t.styles = [u, h];
+e([
+  g("slot")
+], t.prototype, "defaultSlot", 2);
+e([
+  a()
+], t.prototype, "name", 2);
+e([
+  a({ reflect: !0, type: Boolean })
+], t.prototype, "play", 2);
+e([
+  a({ type: Number })
+], t.prototype, "delay", 2);
+e([
+  a()
+], t.prototype, "direction", 2);
+e([
+  a({ type: Number })
+], t.prototype, "duration", 2);
+e([
+  a()
+], t.prototype, "easing", 2);
+e([
+  a({ attribute: "end-delay", type: Number })
+], t.prototype, "endDelay", 2);
+e([
+  a()
+], t.prototype, "fill", 2);
+e([
+  a({ type: Number })
+], t.prototype, "iterations", 2);
+e([
+  a({ attribute: "iteration-start", type: Number })
+], t.prototype, "iterationStart", 2);
+e([
+  a({ attribute: "keyframes" })
+], t.prototype, "keyframes", 2);
+e([
+  a({ attribute: "playback-rate", type: Number })
+], t.prototype, "playbackRate", 2);
+e([
+  d([
+    "name",
+    "delay",
+    "direction",
+    "duration",
+    "easing",
+    "endDelay",
+    "fill",
+    "iterations",
+    "iterationsStart",
+    "keyframes"
+  ])
+], t.prototype, "handleAnimationChange", 1);
+e([
+  d("play")
+], t.prototype, "handlePlayChange", 1);
+e([
+  d("playbackRate")
+], t.prototype, "handlePlaybackRateChange", 1);
+t = e([
+  b("cx-animation")
+], t);
+export {
+  t as C,
+  ce as a,
+  l as e
+};