@dsh-plugin/dsh-ui-experience 1.0.0-dev.43486821486 → 1.0.0-dev.43487914661

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/README.md +7 -4
  2. package/lib/client.js +14 -12
  3. package/package.json +1 -1
package/README.md CHANGED
@@ -116,12 +116,14 @@ token 的值按原样写入 CSS 变量,因此 `color-mix(...)` 这类表达式
116
116
 
117
117
  | 用途 | M3 | M3E |
118
118
  | --- | --- | --- |
119
- | 位移(transform、宽高、内外距、gap、圆角…) | `cubic-bezier(0.2, 0, 0, 1)` | 声明时长 ≤200ms 用 `cubic-bezier(0.42, 1.67, 0.21, 0.9)`,否则用 `cubic-bezier(0.38, 1.21, 0.22, 1)` |
120
- | 效果(颜色、透明度、阴影、滤镜…) | `cubic-bezier(0.2, 0, 0, 1)` | `cubic-bezier(0.34, 0.8, 0.34, 1)` |
119
+ | 位移(transform、宽高、内外距、gap、圆角…) | `cubic-bezier(0.05, 0.7, 0.1, 1)`(emphasized decelerate) | 声明时长 ≤200ms 用 `cubic-bezier(0.42, 1.67, 0.21, 0.9)`,否则用 `cubic-bezier(0.38, 1.21, 0.22, 1)` |
120
+ | 效果(颜色、透明度、阴影、滤镜…) | `cubic-bezier(0.2, 0, 0, 1)`(standard) | `cubic-bezier(0.34, 0.8, 0.34, 1)` |
121
121
 
122
- M3E 的两条位移曲线带过冲,峰值分别为 1.092 与 1.014;效果曲线不过冲。这正是 M3E 的设计意图:物体移动有惯性,颜色过冲会闪出调色板里不存在的颜色。所以位移与效果的曲线必须分开,关闭「位移与效果使用不同曲线」后一律用效果曲线。
122
+ 两族都把「移动」和「效果」分开,原因在 M3E 上最直观:它的两条位移曲线带过冲,峰值分别为 1.092 与 1.014,效果曲线不过冲。物体移动有惯性,颜色过冲则会闪出调色板里不存在的颜色。M3 的分离幅度小些,但方向一致——加速段的 decelerate 曲线只给移动,其余走 standard。
123
123
 
124
- M3 族的 standard 与 emphasized 在 CSS 的三次贝塞尔下都退化为同一个值(M3 的 emphasized 是五次贝塞尔,`cubic-bezier()` 表达不了),因此 M3 族整个界面只有一条曲线,这是规范本身的形状,不是实现偷懒。
124
+ 关闭「位移与效果使用不同曲线」后,两族都退化为只用效果曲线。
125
+
126
+ M3 的 emphasized 整体是一条五次贝塞尔,`cubic-bezier()` 表达不了;这里用的是它减速段的等价三次形式,也正是 Material 官方 web token 里的 `emphasized-decelerate` 取值。
125
127
 
126
128
  ### 为什么是改写 CSSOM,而不是注入覆盖样式表
127
129
 
@@ -176,6 +178,7 @@ M3 族的 standard 与 emphasized 在 CSS 的三次贝塞尔下都退化为同
176
178
  - M3 动效的「位移 / 效果」判定依据属性名与关键帧内容,不分析属性的实际取值变化;判定不出来的情况(例如只由 `all` 声明的过渡)按效果处理,宁可不给过冲。
177
179
  - 跨源样式表里的规则无法改写,只会在日志中记录。
178
180
  - 本层只改写曲线与时长,不新增、不改写关键帧本身;DSH 没定义的动效不会因此出现。
181
+ - 浏览器半在刷新页面时重载,宿主半只在进程重启时重载。两者版本不一致时(刚升级插件但没重启 DSH),M3 动效行会保持无操作并在控制台记录一行原因,配色功能不受影响。
179
182
 
180
183
  ## 样式基线
181
184
 
package/lib/client.js CHANGED
@@ -77,7 +77,7 @@
77
77
  "border-bottom-left-radius",
78
78
  "border-bottom-right-radius"
79
79
  ]);
80
- var CURVE_M3_SPATIAL = "cubic-bezier(0.2, 0, 0, 1)";
80
+ var CURVE_M3_SPATIAL = "cubic-bezier(0.05, 0.7, 0.1, 1)";
81
81
  var CURVE_M3_EFFECTS = "cubic-bezier(0.2, 0, 0, 1)";
82
82
  var CURVE_M3E_SPATIAL_FAST = "cubic-bezier(0.42, 1.67, 0.21, 0.9)";
83
83
  var CURVE_M3E_SPATIAL = "cubic-bezier(0.38, 1.21, 0.22, 1)";
@@ -166,7 +166,7 @@
166
166
  }
167
167
  function curveFor(mode, domain, spatialSplit, originalMs) {
168
168
  if (mode === "m3") {
169
- return domain === "spatial" ? CURVE_M3_SPATIAL : CURVE_M3_EFFECTS;
169
+ return spatialSplit && domain === "spatial" ? CURVE_M3_SPATIAL : CURVE_M3_EFFECTS;
170
170
  }
171
171
  if (mode === "m3e" && spatialSplit && domain === "spatial") {
172
172
  return originalMs !== void 0 && originalMs <= FAST_SPATIAL_MAX_MS ? CURVE_M3E_SPATIAL_FAST : CURVE_M3E_SPATIAL;
@@ -653,6 +653,7 @@
653
653
  let idleTick = 0;
654
654
  let lastRpcProblem = "";
655
655
  let lastPaletteProblem = "";
656
+ let motionUnsupported = false;
656
657
  let paintedWidth = "";
657
658
  let disposeOverride;
658
659
  let borderSheet;
@@ -734,18 +735,23 @@
734
735
  return envelope.value;
735
736
  };
736
737
  const adopt = (answer) => {
738
+ const motionAnswer = answer.motion ?? MOTION_OFF;
739
+ if (answer.motion === void 0 && !motionUnsupported) {
740
+ motionUnsupported = true;
741
+ console.error("ui-experience: this host build predates the motion settings; the M3 motion row stays inert until DSH restarts");
742
+ }
737
743
  if (answer.paths.colors !== view.paths.colors || answer.paths.tokens !== view.paths.tokens || answer.borderWidth !== view.borderWidth) {
738
744
  publish({ paths: answer.paths, borderWidth: answer.borderWidth });
739
745
  }
740
- if (motionDiffers(view.motion, answer.motion)) {
741
- publish({ motion: answer.motion });
742
- if (bootstrapped) applyMotion(answer.motion);
746
+ if (motionDiffers(view.motion, motionAnswer)) {
747
+ publish({ motion: motionAnswer });
748
+ if (bootstrapped) applyMotion(motionAnswer);
743
749
  }
744
750
  if (!bootstrapped) {
745
751
  bootstrapped = true;
746
752
  setBootAttribute(answer.active);
747
753
  publish({ active: answer.active });
748
- applyMotion(answer.motion);
754
+ applyMotion(motionAnswer);
749
755
  } else if (!writing && view.active !== answer.active) {
750
756
  publish({ active: answer.active });
751
757
  if (answer.active) {
@@ -952,11 +958,10 @@
952
958
  }, segment.label))
953
959
  );
954
960
  };
955
- const checkbox = (id, checked, set, label, hint, disabled) => h(
961
+ const checkbox = (checked, set, label, hint, disabled) => h(
956
962
  "label",
957
- { className: "dsh-uix-check", htmlFor: id },
963
+ { className: "dsh-uix-check" },
958
964
  h("input", {
959
- id,
960
965
  type: "checkbox",
961
966
  checked,
962
967
  disabled,
@@ -1108,7 +1113,6 @@
1108
1113
  "div",
1109
1114
  { className: "dsh-uix-form" },
1110
1115
  checkbox(
1111
- "dsh-uix-motion-split",
1112
1116
  current.spatialSplit,
1113
1117
  (next) => {
1114
1118
  void saveMotion({ spatialSplit: next });
@@ -1118,7 +1122,6 @@
1118
1122
  locked
1119
1123
  ),
1120
1124
  checkbox(
1121
- "dsh-uix-motion-quantize",
1122
1125
  current.quantize,
1123
1126
  (next) => {
1124
1127
  void saveMotion({ quantize: next });
@@ -1128,7 +1131,6 @@
1128
1131
  locked
1129
1132
  ),
1130
1133
  checkbox(
1131
- "dsh-uix-motion-reduced",
1132
1134
  current.reduced === "always",
1133
1135
  (next) => {
1134
1136
  void saveMotion({ reduced: next ? "always" : "system" });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@dsh-plugin/dsh-ui-experience",
3
- "version": "1.0.0-dev.43486821486",
3
+ "version": "1.0.0-dev.43487914661",
4
4
  "type": "module",
5
5
  "description": "UI experience enhancements for DeepSeek Harness: follow the system matugen Material You palette as the interface theme, and rewrite interface motion onto Material 3 / Material 3 Expressive curves.",
6
6
  "license": "MIT",