motionary 7.0.0 → 7.1.0

package/docs/ROADMAP.md

@@ -2,7 +2,7 @@
 
 7.0 已发布：移除 6.9 弃用项、按效果包拆分入口（`motionary/fx/*`）、着色器背景默认 WebGPU（自动回退 WebGL2 → Canvas 2D），`motionary` 与 `use-scroll-animate` 同时成为 npm `latest`。下面是 7.1 → 8.0 的计划，每个版本一个特效主题 + 一组新的动画组件。
 
-- **v7.1** — 音乐可视化：频谱柱、波形、节拍脉冲、唱片旋转；新组件 音乐播放器、音量旋钮、均衡器。
+- ✅ **v7.1** — 音乐可视化：频谱柱、波形、节拍脉冲、唱片旋转；新组件 音乐播放器、音量旋钮、均衡器。
 - **v7.2** — 数据可视化动效：柱状 / 折线 / 环形 / 桑基图入场与数值过渡；新组件 仪表盘（Gauge）、迷你走势图（Sparkline）、KPI 指标卡。
 - **v7.3** — 电商动效：飞入购物车、价格翻牌、库存脉冲、优惠券撕开；新组件 购物车抽屉、商品图库、限时倒计时。
 - **v7.4** — 聊天 / 社交：输入中气泡、表情回应飘升、已读回执、消息撤回；新组件 消息列表、头像叠放、通知铃铛。

package/docs/components.md

@@ -728,6 +728,31 @@ document.querySelector('.hero').dataset.usaBackend;          // 'webgpu' | 'webg
 - `glslToWgsl(body)` translates the 6.x shader-body dialect (vec / float / int declarations, constructors, literals, `for` loops, `u_c0…u_ptr` uniforms) and throws on unsupported constructs (ternaries, `mod`, `discard`) so the effect falls back to WebGL2; `ShaderSpec.wgsl` overrides it.
 - Removed in 7.0: `registerFx2`, `FX2_PACKS`, the version-suffixed 6.x registrars, `<usa-tooltip>`, `<usa-toggle>` — see [upgrading-7.md](./upgrading-7.md).
 
+### v7.1 Widgets: music player, volume knob, equalizer, lyrics (`components/widgets`) + music visualization (`motionary/fx/music`)
+
+```html
+<usa-music-player id="p" title="Night Drive" artist="Motionary" cover="cover.jpg"><audio src="track.mp3"></audio></usa-music-player>
+<usa-lyrics for="p"><script type="text/plain">[00:01.00] First line
+[00:04.50] Second line</script></usa-lyrics>
+<usa-volume-knob value="60"></usa-volume-knob>
+<usa-equalizer preset="rock"></usa-equalizer>
+
+<usa-fx effect="radial-spectrum" trigger="load"><section>…</section></usa-fx>
+<usa-fx effect="vinyl-spin" trigger="load"><img src="album.jpg" alt="…"></usa-fx>
+```
+```js
+import { defineWidgets } from 'motionary/components/widgets';
+import { registerMusicPack } from 'motionary/fx/music';
+import { enableAudio } from 'motionary/components/effects';
+defineWidgets(); registerMusicPack();
+enableAudio(document.querySelector('audio'));   // optional: without it the visuals use a synthetic signal
+```
+- `<usa-music-player title artist cover src duration>`: `playing`, `currentTime`, `duration`, `play()`, `pause()`, `toggle()`, `seek(s)`; `usa:play | pause | seek | prev | next`.
+- `<usa-volume-knob value min max label>`: `value`; `usa:input`, `usa:change`.
+- `<usa-equalizer bands preset>`: `values`, `applyPreset(name)`; `usa:change` (`{ values }`); `EQ_PRESETS`.
+- `<usa-lyrics for time>`: `time`, `lines`; `usa:seek` (`{ time }`); `parseLRC(text)`.
+- Music: `waveform-scope` · `radial-spectrum` (`bars`) · `spectrum-mirror` (`bars`, `gap`) · `sound-particles` (`max`) · `beat-bounce` (`amount`) · `vinyl-spin` (`rpm`); `syntheticSample(t)`, `musicSample(t)`.
+
 ## 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": "motionary",
-  "version": "7.0.0",
+  "version": "7.1.0",
   "description": "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",
@@ -198,6 +198,16 @@
         "default": "./dist/components/marketplace.cjs"
       }
     },
+    "./fx/music": {
+      "import": {
+        "types": "./dist/components/fx-music.d.ts",
+        "default": "./dist/components/fx-music.js"
+      },
+      "require": {
+        "types": "./dist/components/fx-music.d.cts",
+        "default": "./dist/components/fx-music.cjs"
+      }
+    },
     "./components/reveal": {
       "import": {
         "types": "./dist/components/reveal.d.ts",
@@ -628,6 +638,16 @@
         "default": "./dist/components/marketplace.cjs"
       }
     },
+    "./components/fx-music": {
+      "import": {
+        "types": "./dist/components/fx-music.d.ts",
+        "default": "./dist/components/fx-music.js"
+      },
+      "require": {
+        "types": "./dist/components/fx-music.d.cts",
+        "default": "./dist/components/fx-music.cjs"
+      }
+    },
     "./components/lite": {
       "import": {
         "types": "./dist/components/lite.d.ts",