@vanillaskyai/video 0.1.0

package/dist/chunk-XB7LH4J2.js

@@ -0,0 +1,301 @@
+import {
+  resolveDensity
+} from "./chunk-FNAEQ7QO.js";
+import {
+  resolveVideoTimeline
+} from "./chunk-SPVTJH3F.js";
+import {
+  getTemplateDefaults
+} from "./chunk-73NTSFFI.js";
+
+// src/player/video-frame.tsx
+import { createElement, Suspense } from "react";
+
+// src/visual-system/layout.ts
+function getDimensions(orientation = "portrait") {
+  return orientation === "landscape" ? { width: 1920, height: 1080, aspectRatio: "16 / 9" } : { width: 1080, height: 1920, aspectRatio: "9 / 16" };
+}
+function getSafeZone(orientation = "portrait") {
+  return orientation === "landscape" ? { top: 108, bottom: 108, left: 192, right: 192 } : { top: 100, bottom: 100, left: 60, right: 60 };
+}
+function scaleSafeZone(zone, factor) {
+  if (factor === 1) return zone;
+  return {
+    top: Math.round(zone.top * factor),
+    bottom: Math.round(zone.bottom * factor),
+    left: Math.round(zone.left * factor),
+    right: Math.round(zone.right * factor)
+  };
+}
+
+// src/player/video-frame.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+var SCENE_TRANSITION_SECONDS = 0.3;
+var CONTIGUITY_ULP_FACTOR = 4;
+function clamp01(value) {
+  return Math.max(0, Math.min(1, value));
+}
+function supportsContinuousTransition(value) {
+  return value === "crossfade" || value === "fade";
+}
+function rangesAreContiguous(left, right) {
+  const scale = Math.max(1, Math.abs(left.end), Math.abs(right.start));
+  const ulpTolerance = Number.EPSILON * scale * CONTIGUITY_ULP_FACTOR;
+  return Math.abs(left.end - right.start) <= ulpTolerance;
+}
+function brandBackground(config) {
+  const background = config.style.brand.background;
+  return background.type === "solid" ? background.color : `linear-gradient(135deg, ${background.colors[0]}, ${background.colors[1]})`;
+}
+function brandBackgroundFallback(config) {
+  const background = config.style.brand.background;
+  return background.type === "solid" ? background.color : background.colors[0];
+}
+function sceneBackgroundChanges(left, right) {
+  const mediaUrl = (range) => String(range.scene.variables.mediaType || "auto") === "gradient" ? "" : String(range.scene.variables.mediaUrl || "");
+  return mediaUrl(left) !== mediaUrl(right);
+}
+function SceneLayer({
+  kit,
+  config,
+  range,
+  progress,
+  motionProgress,
+  width,
+  height,
+  playing,
+  layer,
+  opacity,
+  interactive,
+  zIndex
+}) {
+  const template = kit.getTemplate(range.scene.templateId);
+  const duration = range.end - range.start;
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-scene-layer": layer,
+      "data-layer-scene-id": range.scene.id,
+      "data-layer-template-id": range.scene.templateId,
+      "aria-hidden": interactive ? void 0 : true,
+      ...interactive ? {} : { inert: "inert" },
+      style: {
+        position: "absolute",
+        inset: 0,
+        opacity,
+        zIndex,
+        pointerEvents: interactive ? "auto" : "none",
+        // A changed-media transition can expose an incoming template's true
+        // initial frame. Values that would be false placeholders at progress
+        // zero opt into this inherited guard.
+        "--vanillasky-transition-semantic-visibility": layer === "incoming" ? "hidden" : "visible"
+      },
+      children: template ? /* @__PURE__ */ jsx(Suspense, { fallback: /* @__PURE__ */ jsx(
+        "div",
+        {
+          "data-template-loading": range.scene.templateId,
+          style: { position: "absolute", inset: 0 }
+        }
+      ), children: createElement(template.component, {
+        variables: { ...getTemplateDefaults(template.schema), ...range.scene.variables },
+        style: config.style,
+        progress,
+        motionProgress,
+        beatIntensity: 0,
+        width,
+        height,
+        textArchetype: range.scene.textArchetype ?? config.style.defaultTextArchetype,
+        backgroundEffect: range.scene.backgroundEffect ?? config.style.defaultBackgroundEffect,
+        safeZone: scaleSafeZone(
+          getSafeZone(config.orientation),
+          resolveDensity(config.style.density).safeZoneScale
+        ),
+        sceneDuration: duration,
+        isPlaying: playing
+      }) }) : /* @__PURE__ */ jsxs("div", { style: { width, height, background: "#090712", color: "#fff" }, children: [
+        "Unsupported template: ",
+        range.scene.templateId
+      ] })
+    }
+  );
+}
+function VideoFrame({
+  kit,
+  config,
+  time,
+  width,
+  height,
+  playing = false,
+  className,
+  style
+}) {
+  const timeline = resolveVideoTimeline(config);
+  const lastRange = timeline.at(-1);
+  const foundIndex = timeline.findIndex((range) => time >= range.start && time < range.end);
+  const afterEnd = lastRange && time >= lastRange.end;
+  const activeIndex = foundIndex >= 0 ? foundIndex : afterEnd ? timeline.length - 1 : -1;
+  const active = activeIndex >= 0 ? timeline[activeIndex] : void 0;
+  if (!active) {
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        "data-video-frame": timeline.length === 0 ? "empty" : "gap",
+        className,
+        style: { width, height, background: brandBackground(config), ...style }
+      }
+    );
+  }
+  if (!kit.getTemplate(active.scene.templateId)) {
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        "data-video-frame": "unsupported",
+        "data-template-id": active.scene.templateId,
+        className,
+        style: { width, height, background: "#090712", color: "#fff", ...style },
+        children: [
+          "Unsupported template: ",
+          active.scene.templateId
+        ]
+      }
+    );
+  }
+  const duration = active.end - active.start;
+  const rawProgress = clamp01((time - active.start) / duration);
+  const transitionEnabled = supportsContinuousTransition(config.style.defaultTransition);
+  const next = activeIndex < timeline.length - 1 ? timeline[activeIndex + 1] : void 0;
+  const activeTemplate = kit.getTemplate(active.scene.templateId);
+  const nextTemplate = next ? kit.getTemplate(next.scene.templateId) : void 0;
+  const contiguousNext = next && rangesAreContiguous(active, next) && activeTemplate.usesGlobalTransition && activeTemplate.transitionTiming && nextTemplate?.usesGlobalTransition && nextTemplate.transitionTiming ? next : void 0;
+  const activeTiming = activeTemplate.transitionTiming;
+  const nextTiming = nextTemplate?.transitionTiming;
+  const eligibleNextTransition = Boolean(
+    transitionEnabled && contiguousNext && activeTiming && nextTiming && sceneBackgroundChanges(active, contiguousNext)
+  );
+  const blendDuration = Math.min(
+    SCENE_TRANSITION_SECONDS,
+    Math.max(0, duration)
+  );
+  const blendStart = active.end - blendDuration;
+  const blendEnd = blendStart + blendDuration;
+  const previewingNext = Boolean(
+    eligibleNextTransition && time >= blendStart && time < blendEnd
+  );
+  const blendProgress = previewingNext && blendDuration > 0 ? Math.round(clamp01((time - blendStart) / blendDuration) * 1e6) / 1e6 : 0;
+  const progress = rawProgress;
+  const motionProgress = afterEnd && activeTiming ? activeTiming.holdProgress : rawProgress;
+  const canvas = getDimensions(config.orientation);
+  const scale = Math.min(width / canvas.width, height / canvas.height);
+  const canvasLeft = (width - canvas.width * scale) / 2;
+  const canvasTop = (height - canvas.height * scale) / 2;
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-video-frame": "ready",
+      "data-scene-id": active.scene.id,
+      "data-template-id": active.scene.templateId,
+      className,
+      style: {
+        width,
+        height,
+        position: "relative",
+        overflow: "hidden",
+        background: brandBackground(config),
+        ...style
+      },
+      children: /* @__PURE__ */ jsxs(
+        "div",
+        {
+          "data-video-canvas": "true",
+          style: {
+            position: "absolute",
+            left: canvasLeft,
+            top: canvasTop,
+            width: canvas.width,
+            height: canvas.height,
+            transform: `scale(${scale})`,
+            transformOrigin: "top left"
+          },
+          children: [
+            /* @__PURE__ */ jsx(
+              "div",
+              {
+                "data-player-background": "brand",
+                "aria-hidden": "true",
+                style: {
+                  position: "absolute",
+                  inset: 0,
+                  background: brandBackground(config),
+                  backgroundColor: brandBackgroundFallback(config),
+                  pointerEvents: "none"
+                }
+              }
+            ),
+            previewingNext && contiguousNext && nextTiming ? [
+              /* @__PURE__ */ jsx(
+                SceneLayer,
+                {
+                  kit,
+                  config,
+                  range: active,
+                  progress,
+                  motionProgress,
+                  width: canvas.width,
+                  height: canvas.height,
+                  playing,
+                  layer: "outgoing",
+                  opacity: 1 - blendProgress,
+                  interactive: true,
+                  zIndex: 1
+                },
+                active.scene.id
+              ),
+              /* @__PURE__ */ jsx(
+                SceneLayer,
+                {
+                  kit,
+                  config,
+                  range: contiguousNext,
+                  progress: 0,
+                  motionProgress: 0,
+                  width: canvas.width,
+                  height: canvas.height,
+                  playing: false,
+                  layer: "incoming",
+                  opacity: blendProgress,
+                  interactive: false,
+                  zIndex: 2
+                },
+                contiguousNext.scene.id
+              )
+            ] : [
+              /* @__PURE__ */ jsx(
+                SceneLayer,
+                {
+                  kit,
+                  config,
+                  range: active,
+                  progress,
+                  motionProgress,
+                  width: canvas.width,
+                  height: canvas.height,
+                  playing,
+                  layer: "active",
+                  opacity: 1,
+                  interactive: true,
+                  zIndex: 1
+                },
+                active.scene.id
+              )
+            ]
+          ]
+        }
+      )
+    }
+  );
+}
+
+export {
+  getDimensions,
+  VideoFrame
+};

package/dist/chunk-XGRA2MUV.js

@@ -0,0 +1,242 @@
+// src/protocol/background.ts
+var BACKGROUND_PRESETS = {
+  cosmic: { type: "gradient", colors: ["#8711C1", "#2167E3"] },
+  horizon: { type: "gradient", colors: ["#5967C4", "#133A94"] },
+  twilight: { type: "gradient", colors: ["#0C1740", "#3D1B66"] },
+  meadow: { type: "gradient", colors: ["#348756", "#54B6CA"] },
+  velvet: { type: "gradient", colors: ["#76030F", "#121B67"] },
+  flamingo: { type: "gradient", colors: ["#C72D50", "#3E3B92"] },
+  peach: { type: "gradient", colors: ["#B45A4A", "#AD336D"] },
+  saffron: { type: "gradient", colors: ["#F3696E", "#F8A902"] },
+  black: { type: "solid", color: "#000000" },
+  midnight: { type: "solid", color: "#070B20" },
+  aubergine: { type: "solid", color: "#170A2E" },
+  coal: { type: "solid", color: "#0A0A0A" },
+  navy: { type: "solid", color: "#0A2240" }
+};
+var DEFAULT_BACKGROUND_PRESET = "cosmic";
+var DEFAULT_COLORS = {
+  primary: "#00E5A0",
+  secondary: "#006BE5",
+  foreground: "#FFFFFF",
+  surface: "#0A0A14",
+  surfaceElevated: "#14152A",
+  muted: "#A7A6B0"
+};
+var HEX_COLOR = /^#[0-9a-f]{6}$/i;
+var MINIMUM_TEXT_CONTRAST = 4.5;
+function normalizeColor(value, path) {
+  if (!HEX_COLOR.test(value)) throw new Error(`${path} must be a hex color`);
+  return value.toUpperCase();
+}
+function resolveBackground(input) {
+  if (input == null || typeof input === "string") {
+    const preset = BACKGROUND_PRESETS[input ?? DEFAULT_BACKGROUND_PRESET];
+    return preset.type === "solid" ? { type: "solid", color: preset.color } : { type: "gradient", colors: [...preset.colors] };
+  }
+  if ("color" in input) {
+    return { type: "solid", color: normalizeColor(input.color, "brand.background.color") };
+  }
+  return {
+    type: "gradient",
+    colors: [
+      normalizeColor(input.colors[0], "brand.background.colors[0]"),
+      normalizeColor(input.colors[1], "brand.background.colors[1]")
+    ]
+  };
+}
+function channel(value) {
+  const normalized = value / 255;
+  return normalized <= 0.04045 ? normalized / 12.92 : ((normalized + 0.055) / 1.055) ** 2.4;
+}
+function luminance(color) {
+  return 0.2126 * channel(Number.parseInt(color.slice(1, 3), 16)) + 0.7152 * channel(Number.parseInt(color.slice(3, 5), 16)) + 0.0722 * channel(Number.parseInt(color.slice(5, 7), 16));
+}
+function gradientLuminanceAt(colors, progress) {
+  const channels = colors.map((color) => [1, 3, 5].map((offset) => Number.parseInt(color.slice(offset, offset + 2), 16)));
+  return 0.2126 * channel(channels[0][0] + (channels[1][0] - channels[0][0]) * progress) + 0.7152 * channel(channels[0][1] + (channels[1][1] - channels[0][1]) * progress) + 0.0722 * channel(channels[0][2] + (channels[1][2] - channels[0][2]) * progress);
+}
+function backgroundLuminanceRange(background) {
+  if (background.type === "solid") {
+    const value = luminance(background.color);
+    return [value, value];
+  }
+  const start = luminance(background.colors[0]);
+  const end = luminance(background.colors[1]);
+  let left = 0;
+  let right = 1;
+  for (let iteration = 0; iteration < 64; iteration += 1) {
+    const first = left + (right - left) / 3;
+    const second = right - (right - left) / 3;
+    if (gradientLuminanceAt(background.colors, first) <= gradientLuminanceAt(background.colors, second)) {
+      right = second;
+    } else {
+      left = first;
+    }
+  }
+  const minimum = Math.min(start, end, gradientLuminanceAt(background.colors, (left + right) / 2));
+  return [minimum, Math.max(start, end)];
+}
+function minimumBackgroundContrast(background, foreground) {
+  const foregroundLuminance = luminance(foreground);
+  const [minimum, maximum] = backgroundLuminanceRange(background);
+  if (foregroundLuminance < minimum) {
+    return (minimum + 0.05) / (foregroundLuminance + 0.05);
+  }
+  if (foregroundLuminance > maximum) {
+    return (foregroundLuminance + 0.05) / (maximum + 0.05);
+  }
+  return 1;
+}
+function resolveForeground(input, background) {
+  const supplied = input?.colors?.foreground;
+  if (supplied != null) return normalizeColor(supplied, "brand.colors.foreground");
+  const candidates = ["#FFFFFF", "#000000"];
+  const foreground = candidates.map((color) => ({ color, contrast: minimumBackgroundContrast(background, color) })).sort((left, right) => right.contrast - left.contrast)[0];
+  if (foreground.contrast < MINIMUM_TEXT_CONTRAST) {
+    throw new Error(
+      "brand.colors.foreground is required because neither black nor white contrasts with the entire background; choose a background with one consistently readable foreground"
+    );
+  }
+  return foreground.color;
+}
+function validateResolvedBrandContrast(brand, path) {
+  const contrast = minimumBackgroundContrast(brand.background, brand.colors.foreground);
+  if (contrast < MINIMUM_TEXT_CONTRAST) {
+    throw new Error(
+      `${path}.colors.foreground must have at least 4.5:1 contrast across ${path}.background (minimum ${contrast.toFixed(2)}:1); choose a different foreground or background)`
+    );
+  }
+}
+function resolveVideoBrand(input) {
+  validateBrandInput(input, "brand");
+  const background = resolveBackground(input?.background);
+  const colors = Object.fromEntries(Object.entries({
+    ...DEFAULT_COLORS,
+    ...input?.colors,
+    foreground: resolveForeground(input, background)
+  }).map(([name, value]) => [name, normalizeColor(value, `brand.colors.${name}`)]));
+  const brand = {
+    ...input?.name?.trim() ? { name: input.name.trim() } : {},
+    ...input?.logoUrl?.trim() ? { logoUrl: input.logoUrl.trim() } : {},
+    font: input?.font?.trim() || "Inter",
+    scriptFont: input?.scriptFont?.trim() || "Caveat",
+    background,
+    colors
+  };
+  validateResolvedBrandContrast(brand, "brand");
+  return brand;
+}
+function isBackgroundPreset(value) {
+  return Object.prototype.hasOwnProperty.call(BACKGROUND_PRESETS, value);
+}
+function validateBrandBackgroundInput(value, path) {
+  if (typeof value === "string") {
+    if (!isBackgroundPreset(value)) throw new Error(`${path} preset is unsupported`);
+    return;
+  }
+  if (!value || typeof value !== "object" || Array.isArray(value)) {
+    throw new Error(`${path} must be a preset or custom color object`);
+  }
+  const background = value;
+  const keys = Object.keys(background);
+  if (keys.length !== 1 || keys[0] !== "color" && keys[0] !== "colors") {
+    throw new Error(`${path} must contain either color or colors`);
+  }
+  if ("color" in background) {
+    if (typeof background.color !== "string") throw new Error(`${path}.color must be a hex color`);
+    normalizeColor(background.color, `${path}.color`);
+    return;
+  }
+  if (!Array.isArray(background.colors) || background.colors.length !== 2 || background.colors.some((color) => typeof color !== "string")) {
+    throw new Error(`${path}.colors must contain two colors`);
+  }
+  background.colors.forEach((color, index) => normalizeColor(color, `${path}.colors[${index}]`));
+}
+function validateBrandInput(value, path) {
+  if (value == null) return;
+  if (typeof value !== "object" || Array.isArray(value)) throw new Error(`${path} must be an object`);
+  const input = value;
+  const allowed = /* @__PURE__ */ new Set(["name", "logoUrl", "font", "scriptFont", "background", "colors"]);
+  for (const key of Object.keys(input)) {
+    if (!allowed.has(key)) throw new Error(`${path} contains unsupported field ${key}`);
+  }
+  for (const key of ["name", "logoUrl", "font", "scriptFont"]) {
+    if (input[key] != null && (typeof input[key] !== "string" || !input[key].trim())) {
+      throw new Error(`${path}.${key} must be a non-empty string`);
+    }
+  }
+  if (input.background != null) validateBrandBackgroundInput(input.background, `${path}.background`);
+  if (input.colors != null) {
+    if (typeof input.colors !== "object" || Array.isArray(input.colors)) {
+      throw new Error(`${path}.colors must be an object`);
+    }
+    const colors = input.colors;
+    const colorNames = new Set(Object.keys(DEFAULT_COLORS));
+    for (const [name, color] of Object.entries(colors)) {
+      if (!colorNames.has(name)) throw new Error(`${path}.colors contains unsupported field ${name}`);
+      if (typeof color !== "string") throw new Error(`${path}.colors.${name} must be a hex color`);
+      normalizeColor(color, `${path}.colors.${name}`);
+    }
+  }
+}
+function validateVideoBrand(value, path) {
+  if (!value || typeof value !== "object" || Array.isArray(value)) {
+    throw new Error(`${path} must be an object`);
+  }
+  const brand = value;
+  const allowed = /* @__PURE__ */ new Set(["name", "logoUrl", "font", "scriptFont", "background", "colors"]);
+  for (const key of Object.keys(brand)) {
+    if (!allowed.has(key)) throw new Error(`${path} contains unsupported field ${key}`);
+  }
+  for (const key of ["font", "scriptFont"]) {
+    if (typeof brand[key] !== "string" || !brand[key].trim()) {
+      throw new Error(`${path}.${key} must be a non-empty string`);
+    }
+  }
+  for (const key of ["name", "logoUrl"]) {
+    if (brand[key] != null && (typeof brand[key] !== "string" || !brand[key].trim())) {
+      throw new Error(`${path}.${key} must be a non-empty string`);
+    }
+  }
+  if (!brand.background || typeof brand.background !== "object" || Array.isArray(brand.background)) {
+    throw new Error(`${path}.background must be an object`);
+  }
+  const background = brand.background;
+  if (background.type === "solid") {
+    if (Object.keys(background).some((key) => key !== "type" && key !== "color")) {
+      throw new Error(`${path}.background contains unsupported fields`);
+    }
+    if (typeof background.color !== "string") throw new Error(`${path}.background.color must be a hex color`);
+    normalizeColor(background.color, `${path}.background.color`);
+  } else if (background.type === "gradient") {
+    if (Object.keys(background).some((key) => key !== "type" && key !== "colors")) {
+      throw new Error(`${path}.background contains unsupported fields`);
+    }
+    if (!Array.isArray(background.colors) || background.colors.length !== 2 || background.colors.some((color) => typeof color !== "string")) {
+      throw new Error(`${path}.background.colors must contain two colors`);
+    }
+    background.colors.forEach((color, index) => normalizeColor(color, `${path}.background.colors[${index}]`));
+  } else {
+    throw new Error(`${path}.background.type is unsupported`);
+  }
+  if (!brand.colors || typeof brand.colors !== "object" || Array.isArray(brand.colors)) {
+    throw new Error(`${path}.colors must be an object`);
+  }
+  const colors = brand.colors;
+  const requiredColors = Object.keys(DEFAULT_COLORS);
+  for (const name of requiredColors) {
+    if (typeof colors[name] !== "string") throw new Error(`${path}.colors.${name} must be a hex color`);
+    normalizeColor(colors[name], `${path}.colors.${name}`);
+  }
+  for (const name of Object.keys(colors)) {
+    if (!requiredColors.includes(name)) throw new Error(`${path}.colors contains unsupported field ${name}`);
+  }
+  validateResolvedBrandContrast(brand, path);
+}
+
+export {
+  resolveVideoBrand,
+  validateBrandInput,
+  validateVideoBrand
+};

package/dist/chunk-XTOXFMLM.js

@@ -0,0 +1,105 @@
+// src/visual-system/motion/curves.ts
+function cubicBezier(x1, y1, x2, y2) {
+  const cx = 3 * x1;
+  const bx = 3 * (x2 - x1) - cx;
+  const ax = 1 - cx - bx;
+  const cy = 3 * y1;
+  const by = 3 * (y2 - y1) - cy;
+  const ay = 1 - cy - by;
+  const sampleX = (t) => ((ax * t + bx) * t + cx) * t;
+  const sampleY = (t) => ((ay * t + by) * t + cy) * t;
+  const sampleDX = (t) => (3 * ax * t + 2 * bx) * t + cx;
+  return (x) => {
+    if (x <= 0) return 0;
+    if (x >= 1) return 1;
+    let t = x;
+    for (let i = 0; i < 8; i++) {
+      const err = sampleX(t) - x;
+      if (Math.abs(err) < 1e-6) return sampleY(t);
+      const d = sampleDX(t);
+      if (Math.abs(d) < 1e-6) break;
+      t -= err / d;
+    }
+    let lo = 0;
+    let hi = 1;
+    t = x;
+    for (let i = 0; i < 24; i++) {
+      const v = sampleX(t);
+      if (Math.abs(v - x) < 1e-6) break;
+      if (v < x) lo = t;
+      else hi = t;
+      t = (lo + hi) / 2;
+    }
+    return sampleY(t);
+  };
+}
+var Easing = {
+  /** Easing.bezier(0.16, 1, 0.3, 1) — the canonical curve syntax from docs/motion-library.md. */
+  bezier: cubicBezier,
+  // Curves
+  linear: (t) => t,
+  quad: (t) => t * t,
+  cubic: (t) => t * t * t,
+  sin: (t) => 1 - Math.cos(t * Math.PI / 2),
+  exp: (t) => t === 0 ? 0 : Math.pow(2, 10 * (t - 1)),
+  circle: (t) => 1 - Math.sqrt(1 - t * t),
+  // Directional modifiers
+  in: (fn) => fn,
+  out: (fn) => (t) => 1 - fn(1 - t),
+  inOut: (fn) => (t) => t < 0.5 ? fn(t * 2) / 2 : 1 - fn((1 - t) * 2) / 2
+};
+function interpolate(value, inputRange, outputRange, options) {
+  const { easing, extrapolateLeft = "extend", extrapolateRight = "extend" } = options ?? {};
+  let i = 0;
+  for (; i < inputRange.length - 2; i++) {
+    if (value < inputRange[i + 1]) break;
+  }
+  const inputMin = inputRange[i];
+  const inputMax = inputRange[i + 1];
+  const outputMin = outputRange[i];
+  const outputMax = outputRange[i + 1];
+  let t = inputMax === inputMin ? 0 : (value - inputMin) / (inputMax - inputMin);
+  if (t < 0 && extrapolateLeft === "clamp") t = 0;
+  if (t > 1 && extrapolateRight === "clamp") t = 1;
+  if (easing && t >= 0 && t <= 1) {
+    t = easing(t);
+  }
+  return outputMin + t * (outputMax - outputMin);
+}
+var SPRING_SMOOTH = { damping: 26, stiffness: 170 };
+var SPRING_SNAPPY = { damping: 20, stiffness: 300 };
+var SPRING_BOUNCY = { damping: 10, stiffness: 180 };
+var SPRING_CRISP = { damping: 14, stiffness: 320 };
+function spring(progress, config) {
+  if (progress <= 0) return 0;
+  if (progress >= 1) {
+    const { damping: damping2 = 26 } = config ?? {};
+    if (damping2 >= 20) return 1;
+  }
+  const { damping = 26, stiffness = 170, mass = 1 } = config ?? {};
+  const omega = Math.sqrt(stiffness / mass);
+  const zeta = damping / (2 * Math.sqrt(stiffness * mass));
+  const t = progress * 3.5;
+  let value;
+  if (zeta < 1) {
+    const omegaD = omega * Math.sqrt(1 - zeta * zeta);
+    value = 1 - Math.exp(-zeta * omega * t) * (Math.cos(omegaD * t) + zeta * omega / omegaD * Math.sin(omegaD * t));
+  } else if (zeta === 1) {
+    value = 1 - Math.exp(-omega * t) * (1 + omega * t);
+  } else {
+    const s1 = -omega * (zeta + Math.sqrt(zeta * zeta - 1));
+    const s2 = -omega * (zeta - Math.sqrt(zeta * zeta - 1));
+    value = 1 + (s1 * Math.exp(s2 * t) - s2 * Math.exp(s1 * t)) / (s2 - s1);
+  }
+  return value;
+}
+
+export {
+  Easing,
+  interpolate,
+  SPRING_SMOOTH,
+  SPRING_SNAPPY,
+  SPRING_BOUNCY,
+  SPRING_CRISP,
+  spring
+};