@birdapi/velinstyle 1.2.2 → 1.3.0

package/dist/velinstyle-components.iife.js

@@ -2996,6 +2996,13 @@
   __export(velin_theme_toggle_exports, {
     default: () => velin_theme_toggle_default
   });
+  function applyColorScheme(target, slug) {
+    const dark = DARK_THEME_SLUGS.has(slug);
+    if (target === document.documentElement || target === document.body) {
+      target.style.colorScheme = dark ? "dark" : "light";
+    }
+    target.setAttribute("data-velin-color-scheme", dark ? "dark" : "light");
+  }
   function ensureThemeStylesheet(slug, base) {
     if (!slug || BUILTIN_THEMES.has(slug)) return;
     if (loadedThemeStylesheets.has(slug)) return;
@@ -3011,7 +3018,7 @@
     document.head.appendChild(link);
     loadedThemeStylesheets.add(slug);
   }
-  var THEMES, BUILTIN_THEMES, loadedThemeStylesheets, styles6, VelinThemeToggle, velin_theme_toggle_default;
+  var THEMES, BUILTIN_THEMES, DARK_THEME_SLUGS, loadedThemeStylesheets, styles6, VelinThemeToggle, velin_theme_toggle_default;
   var init_velin_theme_toggle = __esm({
     "components/velin-theme-toggle.js"() {
       THEMES = [
@@ -3032,6 +3039,7 @@
         { slug: "sunset", label: "Sunset" }
       ];
       BUILTIN_THEMES = /* @__PURE__ */ new Set(["", "dark"]);
+      DARK_THEME_SLUGS = /* @__PURE__ */ new Set(["dark", "midnight", "neon"]);
       loadedThemeStylesheets = /* @__PURE__ */ new Set();
       styles6 = `
   :host { display: inline-flex; position: relative; }
@@ -3263,6 +3271,7 @@
             this.setAttribute("theme", normalized === "dark" ? "dark" : normalized);
             ensureThemeStylesheet(normalized, this._themesBase);
           }
+          applyColorScheme(this._target, normalized);
           if (persist) {
             if (!normalized) localStorage.removeItem("velin-theme");
             else localStorage.setItem("velin-theme", normalized);
@@ -3270,7 +3279,11 @@
           this._highlightActive();
           this.dispatchEvent(new CustomEvent("velin-theme-change", {
             bubbles: true,
-            detail: { theme: normalized || "light", dark: normalized === "dark", slug: normalized }
+            detail: {
+              theme: normalized || "light",
+              dark: DARK_THEME_SLUGS.has(normalized),
+              slug: normalized
+            }
           }));
         }
         _syncTogglePressed() {
@@ -9677,6 +9690,12 @@
     const classes = /* @__PURE__ */ new Set();
     for (const [name, value] of Object.entries(attrs)) {
       if (value === "false" || value === "off") continue;
+      if (name === "motion" && value && value !== "true") {
+        const presetKey = value;
+        const mapped2 = EFFECT_MAP[presetKey];
+        if (mapped2) mapped2.forEach((c) => classes.add(c));
+        continue;
+      }
       const mapped = EFFECT_MAP[name];
       if (mapped) mapped.forEach((c) => classes.add(c));
       if (name === "slide" && value && value !== "true" && value !== "") {
@@ -9710,12 +9729,20 @@
         "slide-left": ["velin-animate-on-scroll", "velin-animate-on-scroll--slide-left"],
         "slide-right": ["velin-animate-on-scroll", "velin-animate-on-scroll--slide-right"],
         scale: ["velin-animate-on-scroll", "velin-animate-on-scroll--scale"],
+        zoom: ["velin-animate-on-scroll", "velin-animate-on-scroll--scale"],
         parallax: ["velin-parallax"],
         "parallax-slow": ["velin-parallax", "velin-parallax--slow"],
         hover: ["velin-animate-hover"],
         "hover-lift": ["velin-animate-hover"],
+        lift: ["velin-animate-hover"],
         flip: ["velin-animate-scale-in"],
-        blur: ["velin-animate-fade-in"]
+        blur: ["velin-animate-fade-in"],
+        pulse: ["velin-animate-pulse"],
+        shake: ["velin-animate-shake"],
+        bounce: ["velin-animate-bounce"],
+        shimmer: ["velin-skeleton"],
+        heroReveal: ["velin-animate-on-scroll", "velin-animate-on-scroll--fade"],
+        fadeOut: ["velin-animate-fade-out"]
       };
     }
   });
@@ -9778,12 +9805,804 @@
     }
   });
 
+  // core/motion/data/registry.json
+  var registry_default;
+  var init_registry2 = __esm({
+    "core/motion/data/registry.json"() {
+      registry_default = {
+        schema: "velinstyle.motion.registry",
+        version: 1,
+        presets: [
+          {
+            id: "fade",
+            title: "Fade",
+            description: "Opacity entrance; layout-safe default reveal.",
+            kind: "preset",
+            category: "hero",
+            tags: ["entrance"],
+            duration: 400,
+            fps: "60",
+            reducedMotion: true,
+            layoutSafe: true,
+            status: "stable",
+            cssClass: "velin-animate-on-scroll--fade",
+            compatibility: { cssOnly: true, runtime: true, webComponents: true, studio: true, production: true, review: true, cli: true }
+          },
+          {
+            id: "slide",
+            title: "Slide Up",
+            description: "Slide from below into view.",
+            kind: "preset",
+            category: "cards",
+            tags: ["entrance", "slide"],
+            duration: 500,
+            fps: "60",
+            reducedMotion: true,
+            layoutSafe: true,
+            status: "stable",
+            cssClass: "velin-animate-on-scroll--slide-up",
+            compatibility: { cssOnly: true, runtime: true, webComponents: true, studio: true, production: true, review: true, cli: true }
+          },
+          {
+            id: "slide-down",
+            title: "Slide Down",
+            description: "Slide from above into view.",
+            kind: "preset",
+            category: "navigation",
+            tags: ["entrance", "slide"],
+            duration: 500,
+            reducedMotion: true,
+            layoutSafe: true,
+            status: "stable",
+            cssClass: "velin-animate-on-scroll--slide-down",
+            compatibility: { cssOnly: true, runtime: true, webComponents: true, studio: true, production: true, review: true, cli: true }
+          },
+          {
+            id: "slide-left",
+            title: "Slide Left",
+            description: "Slide from the inline-end.",
+            kind: "preset",
+            category: "lists",
+            tags: ["entrance", "slide"],
+            duration: 500,
+            reducedMotion: true,
+            layoutSafe: true,
+            status: "stable",
+            cssClass: "velin-animate-on-scroll--slide-left",
+            compatibility: { cssOnly: true, runtime: true, webComponents: true, studio: true, production: true, review: true, cli: true }
+          },
+          {
+            id: "slide-right",
+            title: "Slide Right",
+            description: "Slide from the inline-start.",
+            kind: "preset",
+            category: "lists",
+            tags: ["entrance", "slide"],
+            duration: 500,
+            reducedMotion: true,
+            layoutSafe: true,
+            status: "stable",
+            cssClass: "velin-animate-on-scroll--slide-right",
+            compatibility: { cssOnly: true, runtime: true, webComponents: true, studio: true, production: true, review: true, cli: true }
+          },
+          {
+            id: "zoom",
+            title: "Zoom / Scale",
+            description: "Scale-in entrance for cards and media.",
+            kind: "preset",
+            category: "media",
+            tags: ["entrance", "scale"],
+            duration: 450,
+            reducedMotion: true,
+            layoutSafe: true,
+            status: "stable",
+            cssClass: "velin-animate-on-scroll--scale",
+            compatibility: { cssOnly: true, runtime: true, webComponents: true, studio: true, production: true, review: true, cli: true }
+          },
+          {
+            id: "blur",
+            title: "Blur In",
+            description: "Soft fade/blur entrance (maps to fade-in utility).",
+            kind: "preset",
+            category: "overlay",
+            tags: ["entrance"],
+            duration: 500,
+            reducedMotion: true,
+            layoutSafe: true,
+            status: "beta",
+            cssClass: "velin-animate-fade-in",
+            compatibility: { cssOnly: true, runtime: true, webComponents: true, studio: true, production: true, review: true, cli: true }
+          },
+          {
+            id: "flip",
+            title: "Flip / Scale In",
+            description: "Attention scale-in for emphasis.",
+            kind: "preset",
+            category: "feedback",
+            tags: ["attention"],
+            duration: 400,
+            reducedMotion: true,
+            layoutSafe: true,
+            status: "beta",
+            cssClass: "velin-animate-scale-in",
+            compatibility: { cssOnly: true, runtime: true, webComponents: true, studio: true, production: true, review: true, cli: true }
+          },
+          {
+            id: "lift",
+            title: "Hover Lift",
+            description: "Subtle lift on hover for interactive cards and buttons.",
+            kind: "preset",
+            category: "buttons",
+            tags: ["hover"],
+            duration: 200,
+            reducedMotion: true,
+            layoutSafe: true,
+            status: "stable",
+            cssClass: "velin-animate-hover",
+            compatibility: { cssOnly: true, runtime: true, webComponents: true, studio: true, production: true, review: true, cli: true }
+          },
+          {
+            id: "pulse",
+            title: "Pulse",
+            description: "Attention pulse; prefer finite loops under performance policy.",
+            kind: "preset",
+            category: "feedback",
+            tags: ["attention"],
+            duration: 1e3,
+            reducedMotion: true,
+            layoutSafe: true,
+            status: "stable",
+            cssClass: "velin-animate-pulse",
+            compatibility: { cssOnly: true, runtime: true, webComponents: true, studio: true, production: true, review: true, cli: true }
+          },
+          {
+            id: "shake",
+            title: "Shake",
+            description: "Error/attention shake feedback.",
+            kind: "preset",
+            category: "forms",
+            tags: ["attention", "feedback"],
+            duration: 400,
+            reducedMotion: true,
+            layoutSafe: true,
+            status: "stable",
+            cssClass: "velin-animate-shake",
+            compatibility: { cssOnly: true, runtime: true, webComponents: true, studio: true, production: true, review: true, cli: true }
+          },
+          {
+            id: "bounce",
+            title: "Bounce",
+            description: "Playful bounce entrance or attention.",
+            kind: "preset",
+            category: "feedback",
+            tags: ["attention"],
+            duration: 600,
+            reducedMotion: true,
+            layoutSafe: true,
+            status: "stable",
+            cssClass: "velin-animate-bounce",
+            compatibility: { cssOnly: true, runtime: true, webComponents: true, studio: true, production: true, review: true, cli: true }
+          },
+          {
+            id: "shimmer",
+            title: "Shimmer",
+            description: "Loading shimmer surface (skeleton companion).",
+            kind: "preset",
+            category: "loading",
+            tags: ["loading"],
+            duration: 1200,
+            reducedMotion: true,
+            layoutSafe: true,
+            status: "stable",
+            cssClass: "velin-skeleton",
+            compatibility: { cssOnly: true, runtime: true, webComponents: true, studio: true, production: true, review: true, cli: true }
+          },
+          {
+            id: "heroReveal",
+            title: "Hero Reveal",
+            description: "Staggered entrance for hero content; layout-safe; reduced-motion fallback.",
+            kind: "preset",
+            category: "hero",
+            tags: ["entrance", "stagger"],
+            duration: 600,
+            fps: "60",
+            reducedMotion: true,
+            layoutSafe: true,
+            status: "stable",
+            cssClass: "velin-animate-on-scroll--fade",
+            compatibility: { cssOnly: true, runtime: true, webComponents: true, studio: true, production: true, review: true, cli: true }
+          },
+          {
+            id: "parallax",
+            title: "Parallax",
+            description: "Scroll-driven parallax shift.",
+            kind: "preset",
+            category: "media",
+            tags: ["scroll"],
+            duration: 0,
+            reducedMotion: true,
+            layoutSafe: false,
+            status: "stable",
+            cssClass: "velin-parallax",
+            compatibility: { cssOnly: true, runtime: true, webComponents: true, studio: true, production: true, review: true, cli: true }
+          },
+          {
+            id: "fadeOut",
+            title: "Fade Out",
+            description: "Exit fade (planned composition with timelines).",
+            kind: "preset",
+            category: "overlay",
+            tags: ["exit"],
+            duration: 300,
+            reducedMotion: true,
+            layoutSafe: true,
+            status: "beta",
+            cssClass: "velin-animate-fade-out",
+            compatibility: { cssOnly: true, runtime: true, webComponents: true, studio: true, production: true, review: true, cli: true }
+          }
+        ],
+        timelines: [
+          {
+            id: "hero-intro",
+            title: "Hero Intro",
+            description: "Title \u2192 subtitle \u2192 buttons \u2192 image",
+            kind: "timeline",
+            category: "hero",
+            steps: ["title", "subtitle", "buttons", "image"],
+            status: "beta",
+            compatibility: { cssOnly: false, runtime: true, webComponents: true, studio: true, production: true, review: true, cli: true }
+          },
+          {
+            id: "card-stagger",
+            title: "Card Stagger",
+            description: "Sequential card entrance labels.",
+            kind: "timeline",
+            category: "cards",
+            steps: ["card-1", "card-2", "card-3"],
+            status: "beta",
+            compatibility: { cssOnly: false, runtime: true, webComponents: true, studio: true, production: true, review: true, cli: true }
+          }
+        ],
+        transitions: [
+          {
+            id: "cross-fade",
+            title: "Cross Fade",
+            description: "Page/view cross-fade (View Transition friendly).",
+            kind: "transition",
+            category: "page",
+            status: "planned",
+            compatibility: { cssOnly: true, runtime: true, webComponents: true, studio: true, production: true, review: true, cli: true }
+          },
+          {
+            id: "modal-enter",
+            title: "Modal Enter",
+            description: "Overlay modal entrance transition.",
+            kind: "transition",
+            category: "modal",
+            status: "planned",
+            compatibility: { cssOnly: true, runtime: true, webComponents: true, studio: true, production: true, review: true, cli: true }
+          },
+          {
+            id: "drawer-enter",
+            title: "Drawer Enter",
+            description: "Drawer slide transition.",
+            kind: "transition",
+            category: "drawer",
+            status: "planned",
+            compatibility: { cssOnly: true, runtime: true, webComponents: true, studio: true, production: true, review: true, cli: true }
+          }
+        ],
+        physics: [
+          {
+            id: "spring",
+            title: "Spring",
+            description: "Spring easing token mapping (runtime simulation later).",
+            kind: "physics",
+            category: "feedback",
+            status: "planned",
+            token: "--velin-ease-spring",
+            compatibility: { cssOnly: true, runtime: false, webComponents: false, studio: true, production: true, review: true, cli: true }
+          },
+          {
+            id: "elastic",
+            title: "Elastic",
+            description: "Elastic easing token mapping.",
+            kind: "physics",
+            category: "feedback",
+            status: "planned",
+            token: "--velin-ease-elastic",
+            compatibility: { cssOnly: true, runtime: false, webComponents: false, studio: true, production: true, review: true, cli: true }
+          }
+        ],
+        composers: [
+          {
+            id: "sequence",
+            title: "Sequence Composer",
+            description: "Ordered fade/wait/slide composition API.",
+            kind: "composer",
+            category: "page",
+            status: "planned",
+            compatibility: { cssOnly: false, runtime: true, webComponents: true, studio: true, production: true, review: true, cli: true }
+          }
+        ],
+        triggers: [
+          { id: "load", title: "Load", description: "Start when document/module initializes.", kind: "trigger", category: "page", status: "stable", compatibility: { cssOnly: false, runtime: true, webComponents: true, studio: true, production: true, review: true, cli: true } },
+          { id: "visible", title: "Visible", description: "Start when element enters the viewport (IntersectionObserver).", kind: "trigger", category: "page", status: "stable", compatibility: { cssOnly: false, runtime: true, webComponents: true, studio: true, production: true, review: true, cli: true } },
+          { id: "hidden", title: "Hidden", description: "Fire when element leaves the viewport. (Planned \u2014 runtime falls back to visible.)", kind: "trigger", category: "page", status: "planned", compatibility: { cssOnly: false, runtime: false, webComponents: true, studio: true, production: true, review: true, cli: true } },
+          { id: "hover", title: "Hover", description: "Pointer enter / hover.", kind: "trigger", category: "buttons", status: "stable", compatibility: { cssOnly: true, runtime: true, webComponents: true, studio: true, production: true, review: true, cli: true } },
+          { id: "focus", title: "Focus", description: "Keyboard/pointer focus.", kind: "trigger", category: "forms", status: "stable", compatibility: { cssOnly: true, runtime: true, webComponents: true, studio: true, production: true, review: true, cli: true } },
+          { id: "click", title: "Click", description: "Pointer activation.", kind: "trigger", category: "buttons", status: "stable", compatibility: { cssOnly: false, runtime: true, webComponents: true, studio: true, production: true, review: true, cli: true } },
+          { id: "scroll", title: "Scroll", description: "Scroll-linked or scroll-progress trigger.", kind: "trigger", category: "page", status: "stable", compatibility: { cssOnly: true, runtime: true, webComponents: true, studio: true, production: true, review: true, cli: true } },
+          { id: "idle", title: "Idle", description: "After user idle timeout. (Planned \u2014 runtime falls back to visible.)", kind: "trigger", category: "feedback", status: "planned", compatibility: { cssOnly: false, runtime: false, webComponents: true, studio: true, production: true, review: true, cli: true } },
+          { id: "media", title: "Media", description: "Match media query condition. (Planned \u2014 runtime falls back to visible.)", kind: "trigger", category: "page", status: "planned", compatibility: { cssOnly: false, runtime: false, webComponents: true, studio: true, production: true, review: true, cli: true } },
+          { id: "container", title: "Container", description: "Container query / size trigger. (Planned \u2014 runtime falls back to visible.)", kind: "trigger", category: "cards", status: "planned", compatibility: { cssOnly: false, runtime: false, webComponents: true, studio: true, production: true, review: true, cli: true } },
+          { id: "theme", title: "Theme", description: "Theme change trigger. (Planned \u2014 runtime falls back to visible.)", kind: "trigger", category: "page", status: "planned", compatibility: { cssOnly: false, runtime: false, webComponents: true, studio: true, production: true, review: true, cli: true } },
+          { id: "custom", title: "Custom", description: "Custom event name via velin-trigger-event. (Planned \u2014 runtime falls back to visible.)", kind: "trigger", category: "page", status: "planned", compatibility: { cssOnly: false, runtime: false, webComponents: true, studio: true, production: true, review: true, cli: true } }
+        ],
+        policies: [
+          { id: "safe", title: "Safe", description: "Default layout-safe motion with capped durations.", kind: "policy", category: "page", status: "stable", maxDurationMs: 800, allowInfinite: false, compatibility: { cssOnly: true, runtime: true, webComponents: true, studio: true, production: true, review: true, cli: true } },
+          { id: "reduced", title: "Reduced", description: "Honors prefers-reduced-motion first; shorten or skip decorative motion.", kind: "policy", category: "page", status: "stable", maxDurationMs: 200, forceReduced: true, compatibility: { cssOnly: true, runtime: true, webComponents: true, studio: true, production: true, review: true, cli: true } },
+          { id: "marketing", title: "Marketing", description: "Expressive hero motion allowed within caps.", kind: "policy", category: "hero", status: "stable", maxDurationMs: 1200, allowInfinite: false, compatibility: { cssOnly: true, runtime: true, webComponents: true, studio: true, production: true, review: true, cli: true } },
+          { id: "minimal", title: "Minimal", description: "Very little motion; feedback only.", kind: "policy", category: "page", status: "stable", maxDurationMs: 300, allowInfinite: false, compatibility: { cssOnly: true, runtime: true, webComponents: true, studio: true, production: true, review: true, cli: true } },
+          { id: "accessibility", title: "Accessibility", description: "Strict reduced-motion + focus-safe interactions.", kind: "policy", category: "page", status: "stable", maxDurationMs: 200, forceReduced: true, compatibility: { cssOnly: true, runtime: true, webComponents: true, studio: true, production: true, review: true, cli: true } },
+          { id: "performance", title: "Performance", description: "FPS-friendly; ban infinite decorative loops.", kind: "policy", category: "page", status: "stable", maxDurationMs: 600, allowInfinite: false, compatibility: { cssOnly: true, runtime: true, webComponents: true, studio: true, production: true, review: true, cli: true } },
+          { id: "disabled", title: "Disabled", description: "All motion off.", kind: "policy", category: "page", status: "stable", disabled: true, compatibility: { cssOnly: true, runtime: true, webComponents: true, studio: true, production: true, review: true, cli: true } }
+        ],
+        blueprints: [
+          { id: "landing", title: "Landing", description: "Hero reveal + staggered sections + CTA hover.", kind: "blueprint", category: "hero", status: "beta", presets: ["heroReveal", "fade", "lift"], timeline: "hero-intro", policy: "marketing", compatibility: { cssOnly: true, runtime: true, webComponents: true, studio: true, production: true, review: true, cli: true } },
+          { id: "dashboard", title: "Dashboard", description: "Minimal card stagger for admin shells.", kind: "blueprint", category: "cards", status: "beta", presets: ["fade", "slide"], timeline: "card-stagger", policy: "minimal", compatibility: { cssOnly: true, runtime: true, webComponents: true, studio: true, production: true, review: true, cli: true } },
+          { id: "pricing", title: "Pricing", description: "Pricing cards with stagger and lift.", kind: "blueprint", category: "cards", status: "beta", presets: ["slide", "lift"], policy: "marketing", compatibility: { cssOnly: true, runtime: true, webComponents: true, studio: true, production: true, review: true, cli: true } },
+          { id: "portfolio", title: "Portfolio", description: "Media zoom + parallax-safe reveals.", kind: "blueprint", category: "media", status: "beta", presets: ["zoom", "fade"], policy: "marketing", compatibility: { cssOnly: true, runtime: true, webComponents: true, studio: true, production: true, review: true, cli: true } },
+          { id: "shop", title: "Shop", description: "Product cards and feedback pulses.", kind: "blueprint", category: "cards", status: "planned", presets: ["fade", "lift"], policy: "safe", compatibility: { cssOnly: true, runtime: true, webComponents: true, studio: true, production: true, review: true, cli: true } },
+          { id: "forum", title: "Forum", description: "List slides and form feedback.", kind: "blueprint", category: "lists", status: "planned", presets: ["slide", "shake"], policy: "safe", compatibility: { cssOnly: true, runtime: true, webComponents: true, studio: true, production: true, review: true, cli: true } },
+          { id: "docs", title: "Docs", description: "Minimal fade for documentation pages.", kind: "blueprint", category: "page", status: "beta", presets: ["fade"], policy: "minimal", compatibility: { cssOnly: true, runtime: true, webComponents: true, studio: true, production: true, review: true, cli: true } },
+          { id: "blog", title: "Blog", description: "Article hero fade and card slides.", kind: "blueprint", category: "hero", status: "planned", presets: ["fade", "slide"], policy: "safe", compatibility: { cssOnly: true, runtime: true, webComponents: true, studio: true, production: true, review: true, cli: true } },
+          { id: "crm", title: "CRM", description: "Table-safe minimal motion.", kind: "blueprint", category: "tables", status: "planned", presets: ["fade"], policy: "performance", compatibility: { cssOnly: true, runtime: true, webComponents: true, studio: true, production: true, review: true, cli: true } },
+          { id: "login", title: "Login", description: "Form feedback and focus-safe motion.", kind: "blueprint", category: "forms", status: "beta", presets: ["fade", "shake"], policy: "accessibility", compatibility: { cssOnly: true, runtime: true, webComponents: true, studio: true, production: true, review: true, cli: true } }
+        ]
+      };
+    }
+  });
+
+  // core/motion/registry.js
+  function loadMotionRegistry(override = null) {
+    if (override) {
+      cached = override;
+      return cached;
+    }
+    return cached || registry_default;
+  }
+  function listMotion(namespace, filter = {}) {
+    const reg = loadMotionRegistry();
+    const key = namespace.endsWith("s") ? namespace : `${namespace}s`;
+    const items = reg[key] || reg[namespace] || [];
+    return items.filter((item) => {
+      if (filter.status && item.status !== filter.status) return false;
+      if (filter.category && item.category !== filter.category) return false;
+      if (filter.tag && !(item.tags || []).includes(filter.tag)) return false;
+      return true;
+    });
+  }
+  function getMotion(namespace, id) {
+    return listMotion(namespace).find((item) => item.id === id) || null;
+  }
+  function getPreset(id) {
+    return getMotion("presets", id);
+  }
+  function getPolicy(id) {
+    return getMotion("policies", id);
+  }
+  function getTrigger(id) {
+    return getMotion("triggers", id);
+  }
+  function getTimeline(id) {
+    return getMotion("timelines", id);
+  }
+  function listPresets(filter) {
+    return listMotion("presets", filter);
+  }
+  function listPolicies(filter) {
+    return listMotion("policies", filter);
+  }
+  function catalogSummary() {
+    const reg = loadMotionRegistry();
+    const counts = {};
+    for (const ns of NAMESPACES) {
+      counts[ns] = (reg[ns] || []).length;
+    }
+    return {
+      schema: reg.schema,
+      version: reg.version,
+      counts,
+      namespaces: NAMESPACES
+    };
+  }
+  function resolvePresetId(id) {
+    if (!id) return null;
+    const direct = getPreset(id);
+    if (direct) return direct;
+    const aliases = {
+      scale: "zoom",
+      "hover-lift": "lift",
+      reveal: "fade"
+    };
+    const mapped = aliases[id];
+    return mapped ? getPreset(mapped) : null;
+  }
+  var cached, NAMESPACES;
+  var init_registry3 = __esm({
+    "core/motion/registry.js"() {
+      init_registry2();
+      cached = registry_default;
+      NAMESPACES = [
+        "presets",
+        "timelines",
+        "transitions",
+        "physics",
+        "composers",
+        "triggers",
+        "policies",
+        "blueprints"
+      ];
+    }
+  });
+
+  // core/motion/triggers.js
+  function readTrigger(el, fallback = "visible") {
+    const raw = (el.getAttribute("velin-trigger") || fallback || "visible").trim().toLowerCase();
+    return raw || fallback;
+  }
+  function bindTrigger(el, triggerId, onFire, opts = {}) {
+    const once = opts.once !== false;
+    const reduced = opts.reduced ?? prefersReducedMotion();
+    const id = (triggerId || "visible").toLowerCase();
+    const meta = getTrigger(id);
+    if (reduced || el.dataset.velinMotion === "off") {
+      onFire();
+      return () => {
+      };
+    }
+    if (meta?.status === "planned" && !TRIGGER_V1.includes(id)) {
+      return bindTrigger(el, "visible", onFire, opts);
+    }
+    let fired = false;
+    const fire = () => {
+      if (once && fired) return;
+      fired = true;
+      onFire();
+    };
+    if (id === "load") {
+      fire();
+      return () => {
+      };
+    }
+    if (id === "visible" || id === "scroll") {
+      return observeInView(el, () => fire());
+    }
+    if (id === "hover") {
+      const enter = () => fire();
+      el.addEventListener("pointerenter", enter);
+      return () => el.removeEventListener("pointerenter", enter);
+    }
+    if (id === "focus") {
+      const onFocus = () => fire();
+      el.addEventListener("focusin", onFocus);
+      return () => el.removeEventListener("focusin", onFocus);
+    }
+    if (id === "click") {
+      const onClick = () => fire();
+      el.addEventListener("click", onClick);
+      return () => el.removeEventListener("click", onClick);
+    }
+    if (id === "hidden") {
+      const stop = observeInView(el, () => {
+      });
+      if (typeof IntersectionObserver === "undefined") return () => {
+      };
+      const io = new IntersectionObserver((entries2) => {
+        for (const entry of entries2) {
+          if (!entry.isIntersecting) fire();
+        }
+      }, { threshold: 0 });
+      io.observe(el);
+      return () => {
+        stop();
+        io.disconnect();
+      };
+    }
+    if (id === "idle") {
+      const ms = Number(el.getAttribute("velin-trigger-delay") || 3e3);
+      const t = setTimeout(fire, ms);
+      return () => clearTimeout(t);
+    }
+    if (id === "media") {
+      const q = el.getAttribute("velin-trigger-media") || "(min-width: 768px)";
+      if (typeof window === "undefined" || !window.matchMedia) {
+        fire();
+        return () => {
+        };
+      }
+      const mql = window.matchMedia(q);
+      const handler = () => {
+        if (mql.matches) fire();
+      };
+      handler();
+      mql.addEventListener?.("change", handler);
+      return () => mql.removeEventListener?.("change", handler);
+    }
+    if (id === "theme") {
+      const root = el.ownerDocument?.documentElement;
+      if (!root || typeof MutationObserver === "undefined") {
+        fire();
+        return () => {
+        };
+      }
+      const mo = new MutationObserver(() => fire());
+      mo.observe(root, { attributes: true, attributeFilter: ["data-velin-theme", "class"] });
+      return () => mo.disconnect();
+    }
+    if (id === "custom") {
+      const evt = el.getAttribute("velin-trigger-event") || "velin:motion";
+      const handler = () => fire();
+      el.addEventListener(evt, handler);
+      return () => el.removeEventListener(evt, handler);
+    }
+    if (id === "container") {
+      return observeInView(el, () => fire());
+    }
+    return observeInView(el, () => fire());
+  }
+  function armMotionElement(el, applyPreset) {
+    applyPreset();
+    const trigger = readTrigger(el, el.hasAttribute("velin-hover") ? "hover" : "visible");
+    if (prefersReducedMotion() || el.dataset.velinMotion === "off") {
+      markVisible(el);
+      return () => {
+      };
+    }
+    if (trigger === "hover" || trigger === "focus") {
+      markVisible(el);
+      return () => {
+      };
+    }
+    if (trigger === "load") {
+      markVisible(el);
+      return () => {
+      };
+    }
+    return bindTrigger(el, trigger, () => markVisible(el));
+  }
+  var TRIGGER_V1, TRIGGER_V2, ALL_TRIGGERS;
+  var init_triggers = __esm({
+    "core/motion/triggers.js"() {
+      init_scheduler();
+      init_effects();
+      init_registry3();
+      TRIGGER_V1 = ["load", "visible", "hover", "focus", "click", "scroll"];
+      TRIGGER_V2 = ["hidden", "idle", "media", "container", "theme", "custom"];
+      ALL_TRIGGERS = [...TRIGGER_V1, ...TRIGGER_V2];
+    }
+  });
+
+  // core/motion/policy.js
+  function resolvePolicy(id = "safe") {
+    return getPolicy(id) || getPolicy("safe");
+  }
+  function shouldDisableMotion(policy) {
+    if (!policy) return prefersReducedMotion();
+    if (policy.disabled) return true;
+    if (policy.forceReduced && prefersReducedMotion()) return true;
+    if (prefersReducedMotion() && policy.id !== "marketing") return true;
+    return false;
+  }
+  function capDuration(ms, policy) {
+    const max = policy?.maxDurationMs ?? 800;
+    if (policy?.disabled) return 0;
+    return Math.min(Number(ms) || 0, max);
+  }
+  function applyMotionVars(el, policy) {
+    const duration = el.getAttribute("velin-duration");
+    const delay2 = el.getAttribute("velin-delay");
+    const ease = el.getAttribute("velin-ease");
+    if (duration) {
+      const capped = capDuration(Number(duration), policy);
+      el.style.setProperty("--velin-motion-duration", `${capped}ms`);
+      el.style.animationDuration = `${capped}ms`;
+    }
+    if (delay2) el.style.animationDelay = `${Number(delay2)}ms`;
+    if (ease) {
+      const map = {
+        spring: "var(--velin-ease-spring)",
+        bounce: "var(--velin-ease-bounce)",
+        elastic: "var(--velin-ease-elastic)",
+        default: "var(--velin-ease-default)"
+      };
+      el.style.animationTimingFunction = map[ease] || ease;
+    }
+    if (policy?.disabled || shouldDisableMotion(policy)) {
+      el.dataset.velinMotion = "off";
+    }
+  }
+  var init_policy = __esm({
+    "core/motion/policy.js"() {
+      init_registry3();
+      init_effects();
+    }
+  });
+
+  // core/motion/timeline.js
+  function runTimeline(timelineId, root, opts = {}) {
+    const tl = getTimeline(timelineId);
+    if (!tl) return { ok: false, error: `Unknown timeline "${timelineId}"`, ran: [] };
+    const stepMs = opts.stepMs ?? 120;
+    const ran = [];
+    if (opts.policyDisabled || prefersReducedMotion()) {
+      for (const step of tl.steps || []) {
+        const el = resolveStep(root, step);
+        if (el) markVisible(el);
+        ran.push(step);
+      }
+      return { ok: true, ran };
+    }
+    let delay2 = 0;
+    for (const step of tl.steps || []) {
+      const el = resolveStep(root, step);
+      if (!el) continue;
+      const d = delay2;
+      delay2 += stepMs;
+      if (typeof window !== "undefined" && window.setTimeout) {
+        window.setTimeout(() => markVisible(el), d);
+      } else {
+        markVisible(el);
+      }
+      ran.push(step);
+    }
+    return { ok: true, ran, timeline: tl };
+  }
+  function resolveStep(root, step) {
+    if (!root?.querySelector) return null;
+    return root.querySelector(`[data-velin-step="${step}"]`) || root.querySelector(`[velin-step="${step}"]`) || root.querySelector(`#${CSS.escape?.(step) || step}`);
+  }
+  function enhanceTimelines(root) {
+    if (!root?.querySelectorAll) return () => {
+    };
+    const nodes = root.querySelectorAll("[velin-timeline]");
+    const teardowns = [];
+    for (const el of nodes) {
+      const id = el.getAttribute("velin-timeline");
+      const result = runTimeline(id, el);
+      teardowns.push(() => result);
+    }
+    return () => {
+    };
+  }
+  var init_timeline = __esm({
+    "core/motion/timeline.js"() {
+      init_registry3();
+      init_effects();
+    }
+  });
+
+  // core/motion/composer.js
+  function fade(ms = 400) {
+    return { type: "fade", ms };
+  }
+  function slide(ms = 500, value = "up") {
+    return { type: "slide", ms, value };
+  }
+  function wait(ms = 200) {
+    return { type: "wait", ms };
+  }
+  function rotate(ms = 400) {
+    return { type: "rotate", ms };
+  }
+  function blur(ms = 400) {
+    return { type: "blur", ms };
+  }
+  function preset(id, ms) {
+    return { type: "preset", preset: id, ms };
+  }
+  async function sequence(steps = [], ctx = {}) {
+    const target = ctx.target || ctx.root;
+    const reduced = prefersReducedMotion();
+    const ran = [];
+    for (const step of steps) {
+      if (step.type === "wait") {
+        if (!reduced && step.ms) await delay(step.ms);
+        ran.push(step);
+        continue;
+      }
+      if (target && typeof target.classList?.add === "function") {
+        if (step.type === "preset" && step.preset) {
+          const p = resolvePresetId(step.preset);
+          if (p?.cssClass) target.classList.add(...String(p.cssClass).split(/\s+/));
+          applyEffects(target, { [step.preset]: "true" });
+        } else if (step.type === "fade") {
+          applyEffects(target, { fade: "true" });
+        } else if (step.type === "slide") {
+          applyEffects(target, { slide: step.value || "up" });
+        } else if (step.type === "blur") {
+          applyEffects(target, { blur: "true" });
+        } else if (step.type === "rotate") {
+          applyEffects(target, { flip: "true" });
+        }
+        markVisible(target);
+      }
+      if (!reduced && step.ms) await delay(step.ms);
+      ran.push(step);
+    }
+    return { ok: true, ran };
+  }
+  function delay(ms) {
+    return new Promise((resolve) => {
+      if (typeof setTimeout === "undefined") return resolve();
+      setTimeout(resolve, ms);
+    });
+  }
+  function enhanceSequences(root) {
+    if (!root?.querySelectorAll) return () => {
+    };
+    const nodes = [...root.querySelectorAll("[velin-motion-sequence]")];
+    for (const section of nodes) {
+      const children = [...section.children];
+      let i = 0;
+      const stepMs = Number(section.getAttribute("velin-sequence-gap") || 120);
+      for (const child of children) {
+        child.classList.add("velin-animate-on-scroll", "velin-animate-on-scroll--fade");
+        if (prefersReducedMotion()) {
+          markVisible(child);
+        } else if (typeof setTimeout !== "undefined") {
+          const delayMs = i * stepMs;
+          setTimeout(() => markVisible(child), delayMs);
+        } else {
+          markVisible(child);
+        }
+        i += 1;
+      }
+    }
+    return () => {
+    };
+  }
+  var Motion;
+  var init_composer = __esm({
+    "core/motion/composer.js"() {
+      init_effects();
+      init_registry3();
+      init_effects();
+      Motion = {
+        sequence,
+        fade,
+        slide,
+        wait,
+        rotate,
+        blur,
+        preset
+      };
+    }
+  });
+
   // core/motion/index.js
+  function createMotionEngine(options = {}) {
+    const policy = resolvePolicy(options.policy || "safe");
+    return {
+      policy,
+      registry: () => loadMotionRegistry(),
+      catalog: catalogSummary,
+      listPresets,
+      listPolicies,
+      init: (opts = {}) => initMotion({ ...opts, policy: policy.id }),
+      Motion
+    };
+  }
   function initMotion(options = {}) {
     const root = options.root || (typeof document !== "undefined" ? document : null);
     if (!root) return () => {
     };
+    const policy = resolvePolicy(
+      options.policy || root.documentElement?.getAttribute?.("data-velin-motion-policy") || root.querySelector?.("[data-velin-motion-policy]")?.getAttribute("data-velin-motion-policy") || "safe"
+    );
     const selector = options.selector || [
+      "[velin-motion]",
       "[velin-reveal]",
       "[velin-fade]",
       "[velin-slide]",
@@ -9793,26 +10612,40 @@
       ".velin-animate-on-scroll"
     ].join(",");
     const elements = root.querySelectorAll(selector);
-    const reduced = prefersReducedMotion();
+    const reduced = shouldDisableMotion(policy) || prefersReducedMotion();
     for (const el of elements) {
       if (el.dataset.velinMotionInit) continue;
       el.dataset.velinMotionInit = "1";
+      applyMotionVars(el, policy);
       const attrs = {};
-      for (const name of MOTION_ATTRS) {
+      const motionPreset = el.getAttribute("velin-motion");
+      if (motionPreset) {
+        attrs.motion = motionPreset;
+        const resolved = resolvePresetId(motionPreset);
+        if (resolved?.id) attrs[resolved.id] = "true";
+      }
+      for (const name of LEGACY_ATTRS) {
         if (el.hasAttribute(name)) attrs[name.replace("velin-", "")] = el.getAttribute(name) || "true";
       }
       applyEffects(el, attrs);
-      if (reduced) {
+      if (reduced || el.dataset.velinMotion === "off") {
         markVisible(el);
         continue;
       }
-      const stop = observeInView(el, (node) => markVisible(node));
+      const stop = armMotionElement(el, () => applyEffects(el, attrs));
       teardownFns.push(stop);
     }
     enhanceStagger(root);
     bindSmoothScroll(root);
+    enhanceTimelines(root);
+    enhanceSequences(root);
     return () => {
-      teardownFns.forEach((fn) => fn());
+      teardownFns.forEach((fn) => {
+        try {
+          fn();
+        } catch {
+        }
+      });
       teardownFns = [];
       disconnectInViewObserver();
     };
@@ -9823,16 +10656,28 @@
       selector: options.selector || ".velin-animate-on-scroll"
     });
   }
-  var MOTION_ATTRS, teardownFns, velinMotion;
+  var LEGACY_ATTRS, teardownFns, velinMotion;
   var init_motion = __esm({
     "core/motion/index.js"() {
       init_scheduler();
       init_effects();
       init_stagger();
       init_scroll();
-      MOTION_ATTRS = ["velin-reveal", "velin-fade", "velin-slide", "velin-scale", "velin-parallax", "velin-hover"];
+      init_triggers();
+      init_policy();
+      init_timeline();
+      init_composer();
+      init_registry3();
+      LEGACY_ATTRS = ["velin-reveal", "velin-fade", "velin-slide", "velin-scale", "velin-parallax", "velin-hover"];
       teardownFns = [];
-      velinMotion = { init: initMotion, observe: observeInView, markVisible, VISIBLE_CLASS };
+      velinMotion = {
+        init: initMotion,
+        observe: observeInView,
+        markVisible,
+        VISIBLE_CLASS,
+        createEngine: createMotionEngine,
+        readTrigger
+      };
     }
   });
 
@@ -9976,7 +10821,7 @@
     }
     return `tx-${(h >>> 0).toString(16)}`;
   }
-  var init_registry2 = __esm({
+  var init_registry4 = __esm({
     "core/transparency/registry.js"() {
     }
   });
@@ -10058,7 +10903,7 @@
   var init_normalize = __esm({
     "core/transparency/normalize.js"() {
       init_claims();
-      init_registry2();
+      init_registry4();
       PROVENANCE_KEYS = [
         "createdBy",
         "createdAt",
@@ -10222,7 +11067,7 @@
     "core/transparency/attach.js"() {
       init_normalize();
       init_renderer();
-      init_registry2();
+      init_registry4();
       defaultRegistry = createRegistry();
       VelinTransparency = {
         attach,
@@ -10455,7 +11300,7 @@
         attach2(el);
       }
     });
-    for (const motion of ["velin-reveal", "velin-fade", "velin-slide", "velin-scale", "velin-parallax", "velin-hover", "velin-stagger", "velin-scroll"]) {
+    for (const motion of ["velin-motion", "velin-trigger", "velin-duration", "velin-delay", "velin-ease", "velin-timeline", "velin-motion-sequence", "velin-reveal", "velin-fade", "velin-slide", "velin-scale", "velin-parallax", "velin-hover", "velin-stagger", "velin-scroll"]) {
       registerAttribute(motion, { enhance() {
       } });
     }
@@ -10486,7 +11331,7 @@
     return [...registry.keys()];
   }
   var registry, enhanced;
-  var init_registry3 = __esm({
+  var init_registry5 = __esm({
     "core/attributes/registry.js"() {
       init_runtime();
       init_motion();
@@ -10506,7 +11351,7 @@
   });
   var init_attributes = __esm({
     "core/attributes/index.js"() {
-      init_registry3();
+      init_registry5();
     }
   });