motionary 7.3.0 → 7.4.0

package/docs/ROADMAP.md

@@ -5,7 +5,7 @@
 - ✅ **v7.1** — 音乐可视化：频谱柱、波形、节拍脉冲、唱片旋转；新组件 音乐播放器、音量旋钮、均衡器。
 - ✅ **v7.2** — 数据可视化动效：柱状 / 折线 / 环形 / 桑基图入场与数值过渡；新组件 仪表盘（Gauge）、迷你走势图（Sparkline）、KPI 指标卡。
 - ✅ **v7.3** — 电商动效：飞入购物车、价格翻牌、库存脉冲、优惠券撕开；新组件 购物车抽屉、商品图库、限时倒计时。
-- **v7.4** — 聊天 / 社交：输入中气泡、表情回应飘升、已读回执、消息撤回；新组件 消息列表、头像叠放、通知铃铛。
+- ✅ **v7.4** — 聊天 / 社交：输入中气泡、表情回应飘升、已读回执、消息撤回；新组件 消息列表、头像叠放、通知铃铛。
 - **v7.5** — 游戏化：成就解锁、经验条、宝箱开启、幸运转盘；新组件 排行榜、徽章墙、抽奖机。
 - **v7.6** — 地图与地理：路线绘制、旋转地球、标记脉冲、飞线；新组件 3D 地球、位置卡片。
 - **v7.7** — 表单动效：抖动校验、浮动标签、密码强度、成功勾选；新组件 动效输入框、验证码（OTP）输入、上传进度。

package/docs/components.md

@@ -803,6 +803,30 @@ cart.add({ id: 'tee', name: 'T-shirt', price: 24, img: 'tee.jpg' }); cart.toggle
 - `<usa-countdown to seconds units labels label>`: `left`, `start()`, `stop()`; `usa:tick`, `usa:done`; `splitTime(sec)`.
 - Shop: `fly-to-cart` (`to`, `duration`, `lift`) · `price-flip` (`stagger`, `duration`; `data-from`) · `stock-pulse` (`color`, `period`) · `sale-shine` · `badge-pop`; `arcPath(ax, ay, bx, by, lift, steps)`.
 
+### v7.4 Widgets: message list, reactions, notification bell, presence (`components/widgets`) + chat & social motion (`motionary/fx/social`)
+
+```html
+<usa-message-list><p data-from="Ada">Hi! 👋</p><p data-me>Hey Ada</p></usa-message-list>
+<usa-reactions emojis="👍,❤️,😂,🎉" counts="3,1,0,2"></usa-reactions>
+<usa-notification-bell><li data-time="2m">Ada liked your post</li></usa-notification-bell>
+<usa-presence name="Ada Lovelace" status="online" speaking></usa-presence>
+
+<usa-fx effect="typing-dots" trigger="load"><span class="bubble"></span></usa-fx>
+<usa-fx effect="reaction-burst" trigger="click"><button>❤️</button></usa-fx>
+```
+```js
+import { defineWidgets } from 'motionary/components/widgets';
+import { registerSocialPack } from 'motionary/fx/social';
+defineWidgets(); registerSocialPack();
+list.typing('Ada'); list.push({ from: 'Ada', text: 'Ship it?' });
+bell.notify({ text: 'New follower', time: 'now' }); avatar.status = 'away';
+```
+- `<usa-message-list label>`: `messages`, `push(msg)`, `typing(name | false)`; `usa:message`.
+- `<usa-reactions emojis counts picker>`: `counts`, `mine`, `toggle(emoji, on?)`; `usa:react`; `parseReactions()`.
+- `<usa-notification-bell label>`: `unread`, `notices`, `open`, `notify()`, `markAllRead()`, `ring()`; `usa:notify`, `usa:read`.
+- `<usa-presence name src status speaking story>`: `status`; `PRESENCE_STATES`, `initials()`.
+- Social: `typing-dots` (`color`, `period`) · `message-in` (`side`, `duration`) · `reaction-burst` (`emoji`, `count`, `spread`) · `read-receipt` (`color`) · `mention-glow` (`color`); `fanAngles(n, spread)`.
+
 ## 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.3.0",
+  "version": "7.4.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",
@@ -228,6 +228,16 @@
         "default": "./dist/components/fx-shop.cjs"
       }
     },
+    "./fx/social": {
+      "import": {
+        "types": "./dist/components/fx-social.d.ts",
+        "default": "./dist/components/fx-social.js"
+      },
+      "require": {
+        "types": "./dist/components/fx-social.d.cts",
+        "default": "./dist/components/fx-social.cjs"
+      }
+    },
     "./components/reveal": {
       "import": {
         "types": "./dist/components/reveal.d.ts",
@@ -688,6 +698,16 @@
         "default": "./dist/components/fx-shop.cjs"
       }
     },
+    "./components/fx-social": {
+      "import": {
+        "types": "./dist/components/fx-social.d.ts",
+        "default": "./dist/components/fx-social.js"
+      },
+      "require": {
+        "types": "./dist/components/fx-social.d.cts",
+        "default": "./dist/components/fx-social.cjs"
+      }
+    },
     "./components/lite": {
       "import": {
         "types": "./dist/components/lite.d.ts",