refactor(motion): simplify to default and reduced

2026-03-20 16:44:24 +08:00
parent 9009ce4853
commit 142f4a399a
8 changed files with 92 additions and 322 deletions
@@ -162,9 +162,10 @@ Examples:
 - `glass`
 - `pixel`

-### Motion Pack
+### Motion Mode

-Motion pack defines interaction feel:
+Motion mode defines whether the system uses its standard interaction vocabulary or its
+reduced-motion fallback:

 - durations
 - easing
@@ -174,9 +175,8 @@ Motion pack defines interaction feel:

 Examples:

- `calm`
- `micro`
- `spring`
+- `default`
+- `reduced`

 ### Layout Pattern

@@ -218,7 +218,7 @@ The existing token groups remain the baseline:
 Add a new root attribute:

 ```html
-<html data-theme="minimal" data-skin="glass" data-motion="micro">
+<html data-theme="morandi" data-skin="glass" data-motion="default">
 ```

 `data-skin` should be the runtime contract for component appearance.
@@ -422,17 +422,14 @@ Minimum contract:
 ```ts
 type ThemeName = "morandi" | "earth" | "brand";
 type SkinName = "minimal" | "glass" | "pixel";
-type MotionPackName = "calm" | "snappy" | "spring";
-type MotionAccessibilityName = "system" | "full" | "reduced";
+type MotionModeName = "default" | "reduced";
 ```

 Likely helpers:

 - `setTheme(theme, root?)`
 - `setSkin(skin, root?)`
- `setMotionPack(pack, root?)`
- `setMotionAccessibility(mode, root?)`
- `setMotionMode(mode, root?)` as a backward-compatible alias for accessibility mode
+- `setMotionMode(mode, root?)`

 Provider shape if needed:

@@ -440,8 +437,7 @@ Provider shape if needed:
 <StyleProvider
  theme="morandi"
  skin="glass"
-  motionPack="spring"
-  motionAccessibility="system"
+  motionMode="default"
 >
  <App />
 </StyleProvider>
@@ -615,13 +611,12 @@ As of 2026-03-20, the project is at this point:
  and `Skeleton`
 - screenshot-friendly validation surface added in `Foundation/Style Matrix`
 - scoped `data-motion="reduced"` now works for nested docs wrappers
- motion now uses real packs through `data-motion-pack`
- reduced motion remains available as a separate accessibility override layer
+- motion now uses a single `default` mode plus a `reduced` override through `data-motion`
 - shared skin-aware treatment now extends across the broader component library surface,
  including controls, menus, overlays, feedback, and data-heavy patterns
 - package consumers can now import a single combined stylesheet from
  `@ai-ui/ui/styles.css`

 The original Phase 0-5 implementation sequence is now complete. Further work should be
-treated as iteration: refining skins, expanding motion packs, or hardening package and
+treated as iteration: refining skins, shaping the default motion language, or hardening package and
 registry distribution.