use-scroll-animate 8.0.0 → 8.2.0

package/docs/ROADMAP.md

@@ -2,8 +2,8 @@
 
 8.0 已发布：统一时间线引擎（`motionary/engine` —— 所有组件、特效与帧循环共享一个时钟，可整体暂停、变速、编排）、SSR 水合动画（`ssrHead()` + `hydrateMotion()` / `<usa-hydrate>`）、移除 7.9 弃用的 `<usa-rating>`；`motionary` 与 `use-scroll-animate` 同时成为 npm `latest`。下面是 8.1 → 9.0 的计划，每个版本一个特效主题 + 一组新的动画组件，x.9 版本负责下一个大版本的弃用与迁移工具。
 
-- **v8.1** — 节日特效包：烟花、新春（灯笼、福字、鞭炮）、圣诞飘雪、万圣节；新组件 节日横幅、红包。
-- **v8.2** — 复古风：像素化、CRT 显示器、VHS 噪点、Y2K；新组件 复古按钮、终端窗口。
+- ✅ **v8.1** — 节日特效包：烟花、新春（灯笼、福字、鞭炮）、圣诞飘雪、万圣节；新组件 节日横幅、红包。
+- ✅ **v8.2** — 复古风：像素化、CRT 显示器、VHS 噪点、Y2K；新组件 复古按钮、终端窗口。
 - **v8.3** — 自然有机：水波涟漪、藤蔓生长、花朵绽放；新组件 有机卡片、液态导航。
 - **v8.4** — 赛博 / 科幻：HUD 线框、扫描线、全息投影；新组件 HUD 面板、雷达扫描。
 - **v8.5** — 纸张与手绘：折纸、铅笔素描、水彩晕染；新组件 便利贴墙、手绘图表。

package/docs/components.md

@@ -961,6 +961,48 @@ hydrateMotion(document, { stagger: 60 });
 - `hydrateMotion(root, { stagger, duration, preset, easing })` → timeline; `ssrHead(nonce)`, `HYDRATION_CSS`, `HYDRATE_PRESETS`.
 - `<usa-clock-control speeds label>`: `rate`, `paused`; `usa:change`. `<usa-hydrate effect stagger duration>`: `replay()`, `timeline`; `usa:hydrated`.
 
+### v8.1 Widgets: red envelope, festival banner (`components/widgets`) + festival packs (`motionary/fx/festival`)
+
+```html
+<usa-red-envelope amount="88.88" from="Grandma" message="恭喜发财"></usa-red-envelope>
+<usa-festival-banner theme="lunar" dismissible>🧧 Happy Lunar New Year — 20% off all week</usa-festival-banner>
+
+<usa-fx effect="firework-burst" trigger="click"><button>Celebrate</button></usa-fx>
+<usa-fx effect="xmas-snow" trigger="loop"><div class="card">Season’s greetings</div></usa-fx>
+```
+```js
+import { defineWidgets } from 'motionary/components/widgets';
+import { registerFestivalPack } from 'motionary/fx/festival';
+defineWidgets(); registerFestivalPack();
+envelope.addEventListener('usa:open', (e) => console.log(e.detail.amount));
+```
+- `<usa-red-envelope amount currency message from opened>`: `open()`, `close()`, `opened`; `usa:open` { amount }.
+- `<usa-festival-banner theme label dismissible>`: `theme`, `dismiss()`; `usa:dismiss`; `FESTIVAL_THEMES`.
+- Festival: `firework-burst` (`bursts`, `colors`) · `lantern-rise` (`sway`) · `xmas-snow` (`flakes`) · `spooky-float` (`cycles`); `sparkVectors(n, radius, seed)`.
+
+### v8.2 Widgets: terminal, retro buttons (`components/widgets`) + retro pack (`motionary/fx/retro`)
+
+```html
+<usa-terminal title="zsh" theme="green">
+  <p data-cmd>npm i motionary</p>
+  <p>added 1 package in 2s</p>
+</usa-terminal>
+<usa-retro-button variant="pixel">Start</usa-retro-button>
+<usa-retro-button variant="win95">OK</usa-retro-button>
+
+<usa-fx effect="crt-power" trigger="enter"><img src="screen.png" alt=""></usa-fx>
+<usa-fx effect="vhs-glitch" trigger="hover"><h2>REWIND</h2></usa-fx>
+```
+```js
+import { defineWidgets } from 'motionary/components/widgets';
+import { registerRetroPack } from 'motionary/fx/retro';
+defineWidgets(); registerRetroPack();
+term.addEventListener('usa:done', () => term.replay());
+```
+- `<usa-terminal title prompt theme speed loop>`: `replay()`, `skip()`; `usa:done`.
+- `<usa-retro-button variant type disabled name value>`: `button`, `variant`; `RETRO_VARIANTS`.
+- Retro: `pixelate-in` (`steps`) · `crt-power` · `vhs-glitch` (`intensity`) · `y2k-shine` (`color`); `pixelSteps(steps)`.
+
 ## Frameworks
 
 Custom elements work in every framework. Register once (e.g. in your entry file), then use the tags.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "use-scroll-animate",
-  "version": "8.0.0",
+  "version": "8.2.0",
   "description": "Compatibility alias of motionary (same build). The project was renamed to Motionary — install `motionary` instead. Motionary (formerly use-scroll-animate): dependency-free scroll animations + 94 animated Web Components — 214 scroll-reveal presets, card/click/button morphs, physics, page transitions, generative & sound-reactive backgrounds, cursor/gesture effects, themes, micro-interactions, <usa-player>, WebGL. React, Vue, Svelte, Solid, Angular or plain HTML.",
   "type": "module",
   "main": "./dist/index.cjs",
@@ -288,6 +288,26 @@
         "default": "./dist/components/fx-ai.cjs"
       }
     },
+    "./fx/festival": {
+      "import": {
+        "types": "./dist/components/fx-festival.d.ts",
+        "default": "./dist/components/fx-festival.js"
+      },
+      "require": {
+        "types": "./dist/components/fx-festival.d.cts",
+        "default": "./dist/components/fx-festival.cjs"
+      }
+    },
+    "./fx/retro": {
+      "import": {
+        "types": "./dist/components/fx-retro.d.ts",
+        "default": "./dist/components/fx-retro.js"
+      },
+      "require": {
+        "types": "./dist/components/fx-retro.d.cts",
+        "default": "./dist/components/fx-retro.cjs"
+      }
+    },
     "./components/reveal": {
       "import": {
         "types": "./dist/components/reveal.d.ts",
@@ -808,6 +828,26 @@
         "default": "./dist/components/engine.cjs"
       }
     },
+    "./components/fx-festival": {
+      "import": {
+        "types": "./dist/components/fx-festival.d.ts",
+        "default": "./dist/components/fx-festival.js"
+      },
+      "require": {
+        "types": "./dist/components/fx-festival.d.cts",
+        "default": "./dist/components/fx-festival.cjs"
+      }
+    },
+    "./components/fx-retro": {
+      "import": {
+        "types": "./dist/components/fx-retro.d.ts",
+        "default": "./dist/components/fx-retro.js"
+      },
+      "require": {
+        "types": "./dist/components/fx-retro.d.cts",
+        "default": "./dist/components/fx-retro.cjs"
+      }
+    },
     "./components/lite": {
       "import": {
         "types": "./dist/components/lite.d.ts",