@yaoxiu/marketing-dsl 1.5.2 → 2.1.0

package/dist/docs/index.js

@@ -1,4 +1,4 @@
-import { TRACK_EVENT_PATTERN, DSL_VERSION, ACTION_TYPES, NODE_TYPES, ALLOWED_STYLE_KEYS, CLOSE_POSITIONS } from '../chunk-FKZKLCVV.js';
+import { TRACK_EVENT_PATTERN, DEFAULT_USER_FIELDS, USER_FIELD_LABELS, DSL_VERSION, ACTION_TYPES, NODE_TYPES, ALLOWED_STYLE_KEYS, CLOSE_POSITIONS } from '../chunk-7TWWOK7Q.js';
 
 // src/docs/reconcile.ts
 function pickTokens(rows, columnIndex) {
@@ -238,6 +238,16 @@ countdown_end          // \u5012\u8BA1\u65F6\u5F52\u96F6`
         tone: "info",
         text: "\u66DD\u5149\u57CB\u70B9\u7B49\u6570\u636E\u6E90\u8FD4\u56DE\u540E\u624D\u89E6\u53D1\u2014\u2014\u6570\u636E\u6CA1\u56DE\u6765\u65F6\u5F39\u7A97\u6839\u672C\u6CA1\u6E32\u67D3\uFF0C\u8FD9\u65F6\u5019\u4E0A\u62A5\u66DD\u5149\u4F1A\u628A\u8F6C\u5316\u7387\u7B97\u4F4E\u3002\u591A\u89C6\u56FE\u4E0B\u6BCF\u5C42\u5404\u57CB\u5404\u7684\uFF0C\u53EF\u4EE5\u5206\u522B\u7EDF\u8BA1\u300C\u516C\u544A\u6761\u66DD\u5149\u300D\u548C\u300C\u70B9\u5F00\u540E\u7684\u5F39\u7A97\u66DD\u5149\u300D\u3002"
       },
+      {
+        t: "note",
+        tone: "warn",
+        text: "**\u8FD9\u4E24\u4E2A\u94A9\u5B50\u91CC\u7684 `track` \u4E0D\u4F1A\u88AB\u7B97\u6210\u70B9\u51FB\u3002** \u4E0A\u62A5\u7684 `event` \u662F\u7269\u6599\u751F\u547D\u5468\u671F\u7684\u56FA\u5B9A\u4E09\u503C\uFF08\u66DD\u5149 / \u70B9\u51FB / \u5173\u95ED\uFF09\uFF0C\u524D\u53F0\u6309**\u65F6\u673A**\u51B3\u5B9A\u62A5\u54EA\u4E00\u4E2A\uFF1A`onShow` \u91CC\u7684\u57CB\u70B9\u540D\u5E76\u8FDB\u90A3\u6761\u66DD\u5149\u3001`onClose` \u91CC\u7684\u57CB\u70B9\u540D\u5E76\u8FDB\u90A3\u6761\u5173\u95ED\uFF0C\u90FD\u4F5C\u4E3A\u9644\u52A0\u5B57\u6BB5\u4E0A\u62A5\uFF0C\u8FD0\u8425\u5728\u540E\u7AEF\u7167\u6837\u770B\u5F97\u5230\uFF0C\u53EA\u662F\u4E0D\u4F1A\u6C61\u67D3\u70B9\u51FB\u91CF\u3002\u771F\u6B63\u7B97\u70B9\u51FB\u7684\u53EA\u6709\u300C\u7528\u6237\u70B9\u4E86\u5E26 `action` \u7684\u8282\u70B9\u300D\u3002"
+      },
+      {
+        t: "note",
+        tone: "info",
+        text: "\u540C\u7406\uFF0C\u4E00\u6B21\u70B9\u51FB\u91CC\u5199 `sequence: [track, navigate]`\uFF08\u5148\u57CB\u70B9\u518D\u8DF3\u8F6C\uFF09**\u53EA\u4E0A\u62A5\u4E00\u6761\u70B9\u51FB**\uFF0C\u4E0D\u662F\u4E24\u6761\u2014\u2014\u4E0A\u62A5\u6309\u300C\u4E00\u6B21\u624B\u52BF\u300D\u8BA1\u6570\uFF0C\u4E0D\u6309\u52A8\u4F5C\u4E2A\u6570\u8BA1\u6570\u3002\u653E\u5FC3\u6309\u9700\u8981\u4E32\u52A8\u4F5C\u3002"
+      },
       { t: "h3", text: "\u516C\u544A\u6761 / Banner \u600E\u4E48\u5173" },
       {
         t: "p",
@@ -261,7 +271,49 @@ countdown_end          // \u5012\u8BA1\u65F6\u5F52\u96F6`
       {
         t: "note",
         tone: "info",
-        text: "\u6574\u6761\u516C\u544A\u6761\u53EF\u70B9\u3001\u884C\u672B\u53C8\u6709 \xD7 \u65F6\u4E0D\u7528\u62C5\u5FC3\u51B2\u7A81\uFF1A\u5185\u5C42\u8282\u70B9\u6709\u81EA\u5DF1\u7684 `action` \u5C31\u4E0D\u4F1A\u518D\u5192\u6CE1\u7ED9\u5916\u5C42\uFF0C\u70B9 \xD7 \u53EA\u4F1A\u5173\u95ED\uFF0C\u4E0D\u4F1A\u540C\u65F6\u89E6\u53D1\u5916\u5C42\u7684\u8DF3\u8F6C\u6216\u5F39\u7A97\u3002"
+        text: "\u6574\u6761\u516C\u544A\u6761\u53EF\u70B9\u3001\u884C\u672B\u53C8\u6709 \xD7 \u65F6\u4E0D\u7528\u62C5\u5FC3\u51B2\u7A81\uFF1A\u5185\u5C42\u8282\u70B9\u6709\u81EA\u5DF1\u7684 `action` \u5C31\u4E0D\u4F1A\u518D\u5192\u6CE1\u7ED9\u5916\u5C42\uFF0C\u70B9 \xD7 \u53EA\u4F1A\u5173\u95ED\uFF0C\u4E0D\u4F1A\u540C\u65F6\u89E6\u53D1\u5916\u5C42\u7684\u8DF3\u8F6C\u6216\u5F39\u7A97\u3002\u4E0D\u8FC7**\u4E0D\u5EFA\u8BAE\u628A\u6574\u6761\u516C\u544A\u6761\u505A\u6210\u53EF\u70B9**\u2014\u2014\u7528\u6237\u60F3\u9009\u4E2D\u6587\u6848\u590D\u5236\u65F6\u4F1A\u8BEF\u89E6\u53D1\uFF0C\u628A\u6253\u5F00\u5165\u53E3\u6536\u5728\u53F3\u4FA7\u6309\u94AE\u4E0A\u66F4\u7A33\u3002"
+      },
+      { t: "h3", text: "\u57CB\u70B9\u5199\u5728\u54EA\uFF0C\u51B3\u5B9A\u5B83\u88AB\u7B97\u6210\u4EC0\u4E48\uFF08\u91CD\u8981\uFF09" },
+      {
+        t: "p",
+        text: "\u4E0A\u62A5\u7ED9\u540E\u7AEF\u7684\u4E8B\u4EF6\u53EA\u6709\u4E09\u79CD\uFF1A`exposure` \u66DD\u5149 / `click` \u70B9\u51FB / `close` \u5173\u95ED\u3002\u4F60\u914D\u7684 `track` **\u4E0D\u662F**\u7B2C\u56DB\u79CD\u4E8B\u4EF6\uFF0C\u5B83\u662F\u5F80\u8FD9\u4E09\u79CD\u91CC\u9644\u52A0\u300C\u4F60\u8D77\u7684\u540D\u5B57\u300D\u3002\u540C\u4E00\u4E2A `track` \u5199\u5728\u4E0D\u540C\u4F4D\u7F6E\uFF0C\u5F52\u5C5E\u5B8C\u5168\u4E0D\u540C\uFF1A"
+      },
+      {
+        t: "table",
+        head: ["track \u5199\u5728\u54EA", "\u7B97\u6210\u4EC0\u4E48", "\u4F60\u914D\u7684\u4E8B\u4EF6\u540D\u53BB\u54EA"],
+        rows: [
+          [
+            "\u8282\u70B9\u7684 `action` \u91CC\uFF08\u7528\u6237\u70B9\u4E86\u5B83\uFF09",
+            "\u4E00\u6761 `click`",
+            "`extra.name`\uFF1B\u540C\u4E00\u6B21\u70B9\u51FB\u91CC\u914D\u7684\u8DF3\u8F6C\u5730\u5740\u5E76\u8FDB `extra.url`"
+          ],
+          ["`stage.onShow`", "**\u4E0D\u7B97\u70B9\u51FB**\uFF0C\u5E76\u8FDB\u90A3\u6761\u66DD\u5149", "`exposure` \u7684 `extra.name`"],
+          [
+            "`stage.onClose`",
+            "**\u4E0D\u7B97\u70B9\u51FB**\uFF0C\u5E76\u8FDB\u90A3\u6761\u5173\u95ED",
+            "`close` \u7684 `extra.name`\uFF08`reason` \u4ECD\u662F\u5173\u95ED\u539F\u56E0\uFF09"
+          ],
+          [
+            "\u5173\u95ED\u6309\u94AE\u7684 `action` \u91CC\uFF08\u548C `close` \u5199\u5728\u540C\u4E00\u4E2A `sequence`\uFF09",
+            "**\u4E0D\u7B97\u70B9\u51FB**\uFF0C\u5E76\u8FDB\u90A3\u6761\u5173\u95ED",
+            "`close` \u7684 `extra.name`"
+          ]
+        ]
+      },
+      {
+        t: "note",
+        tone: "warn",
+        text: "**\u4E00\u6B21\u70B9\u51FB\u53EA\u4EA7\u751F\u4E00\u6761 `click`\u3002**\u300C\u5148\u57CB\u70B9\u518D\u8DF3\u8F6C\u300D\u8FD9\u79CD\u6700\u5E38\u89C1\u7684 `sequence` \u5199\u6CD5\uFF0C\u4E24\u4E2A\u52A8\u4F5C\u4F1A\u5408\u5E76\u6210\u4E00\u6761\u4E0A\u62A5\uFF0C\u4E0D\u4F1A\u88AB\u7B97\u6210\u4E24\u6B21\u70B9\u51FB\u2014\u2014\u6240\u4EE5\u653E\u5FC3\u6309\u7B2C 11 \u8282\u5F00\u5934\u90A3\u4E2A\u4F8B\u5B50\u5199\u3002"
+      },
+      {
+        t: "note",
+        tone: "warn",
+        text: '**\u5173\u95ED\u52A8\u4F5C\u4E0D\u4EA7\u751F\u70B9\u51FB\u3002**\u53EA\u8981\u8FD9\u4E00\u4E0B\u6267\u884C\u4E86 `close` / `closeAll`\uFF0C\u5B83\u7684\u672C\u8D28\u5C31\u662F\u300C\u5173\u6389\u5B83\u300D\u800C\u4E0D\u662F\u300C\u70B9\u4E86\u5B83\u300D\u2014\u2014\u540E\u7AEF\u7B97\u70B9\u51FB\u7387\u65F6\u5206\u6BCD\u662F\u66DD\u5149\u3001\u5206\u5B50\u662F\u70B9\u51FB\uFF0C\u628A\u5173\u95ED\u7B97\u8FDB\u70B9\u51FB\u4F1A\u8BA9\u70B9\u51FB\u7387\u865A\u9AD8\u3002\u4F60\u914D\u5728\u5173\u95ED\u6309\u94AE\u4E0A\u7684\u57CB\u70B9\u540D\u4E0D\u4F1A\u4E22\uFF0C\u5B83\u8FDB\u4E86 `close` \u7684 `extra`\u3002\u60F3\u533A\u5206\u300C\u4ECE\u54EA\u4E2A\u5165\u53E3\u5173\u7684\u300D\uFF0C\u66F4\u63A8\u8350\u7528 `close` \u52A8\u4F5C\u7684 `reason`\uFF08\u5982 `reason: "user-dismiss"`\uFF09\u3002'
+      },
+      {
+        t: "note",
+        tone: "warn",
+        text: "**\u591A\u89C6\u56FE\u91CC\u300C\u5173\u6389\u67D0\u4E00\u5C42\u300D\u76EE\u524D\u4E0D\u4EA7\u751F\u4EFB\u4F55\u4E0A\u62A5\u3002**\u6BD4\u5982\u516C\u544A\u6761\u70B9\u5F00\u5F39\u7A97\u540E\u53C8\u5173\u6389\u5F39\u7A97\uFF0C\u6B64\u65F6\u7269\u6599\u5E76\u6CA1\u6709\u5173\uFF08\u516C\u544A\u6761\u8FD8\u5728\u9875\u9762\u4E0A\uFF09\uFF0C\u6240\u4EE5\u65E2\u6CA1\u6709 `click` \u4E5F\u6CA1\u6709 `close`\u3002\u4F60\u5728\u90A3\u4E00\u5C42\u914D\u7684 `onClose` \u57CB\u70B9\u7B49\u4E0D\u5230\u6570\u636E\u2014\u2014\u8FD9\u662F\u5F53\u524D\u4E0A\u62A5\u6A21\u578B\u7684\u5DF2\u77E5\u7A7A\u767D\uFF0C\u9700\u8981\u7EDF\u8BA1\u300C\u6253\u5F00\u540E\u53C8\u5173\u6389\u300D\u7684\u8F6C\u5316\uFF0C\u5148\u627E\u524D\u7AEF / \u540E\u7AEF\u4E00\u8D77\u5B9A\u53E3\u5F84\uFF0C\u522B\u6307\u671B\u914D\u4E86\u5C31\u6709\u3002"
       }
     ]
   }
@@ -282,7 +334,7 @@ var sections2 = [
         t: "code",
         code: `{
   "type": "countdown",
-  "to": "{{ user.trialEndAt }}",
+  "to": "{{ user.serviceExpireTime }}",
   "precision": "cs",          // "s" \u6BCF\u79D2\uFF08\u9ED8\u8BA4\uFF09| "cs" \u5398\u79D2\uFF0C\u9010\u5E27\u5237\u65B0
   "as": "cd",                 // \u6CE8\u5165\u7684\u53D8\u91CF\u540D\uFF0C\u9ED8\u8BA4 cd
   "style": { "align": "center", "gap": 6 },
@@ -354,7 +406,7 @@ var sections2 = [
           ["\u4E2D\u6587", '`"2026\u5E749\u67081\u65E5"` `"2026\u5E749\u67081\u65E5 18\u70B9"` `"2026\u5E749\u67081\u65E5 18\u70B930\u5206"`'],
           ["\u63A5\u53E3\u8FD4\u56DE\u7684\u683C\u5F0F", '`"2026-09-01T18:00:00Z"` `"2026-09-01T18:00:00+08:00"`'],
           ["\u65F6\u95F4\u6233\uFF08\u6BEB\u79D2\uFF09", "`1786949074954`"],
-          ["\u4ECE\u6570\u636E\u91CC\u53D6", '`"{{ user.trialEndAt }}"`']
+          ["\u4ECE\u6570\u636E\u91CC\u53D6", '`"{{ user.serviceExpireTime }}"`']
         ]
       },
       {
@@ -377,6 +429,10 @@ var sections2 = [
 var countdown_default = sections2;
 
 // src/docs/sections/data-state.ts
+var userFieldRows = DEFAULT_USER_FIELDS.map((field) => [
+  `\`user.${field}\``,
+  USER_FIELD_LABELS[field] || ""
+]);
 var sections3 = [
   {
     id: "data",
@@ -408,6 +464,11 @@ var sections3 = [
         t: "p",
         text: "\u6570\u636E\u6CA1\u56DE\u6765\u3001\u6216\u8005\u62C9\u5931\u8D25\uFF0C\u5F39\u7A97\u90FD**\u4E0D\u4F1A\u6E32\u67D3**\uFF08\u4E0D\u5F39\u7A7A\u58F3\uFF09\u3002\u6240\u4EE5\u4E0D\u7528\u5728 DSL \u91CC\u5904\u7406\u52A0\u8F7D\u6001\u3002"
       },
+      {
+        t: "note",
+        tone: "warn",
+        text: "**\u8FD9\u6761\u7684\u53E6\u4E00\u9762**\uFF1A\u586B\u4E86\u4E00\u4E2A\u5BBF\u4E3B\u6CA1\u6CE8\u518C\u7684\u6570\u636E\u6E90\u540D\uFF0C\u6574\u4EFD\u7269\u6599\u5C31\u4E00\u76F4\u662F\u7A7A\u7684\u2014\u2014\u9875\u9762\u4E0A\u4EC0\u4E48\u90FD\u4E0D\u51FA\u73B0\uFF0C\u4E5F\u4E0D\u4F1A\u62A5\u9519\u7ED9\u7528\u6237\u770B\u3002\u8C03\u8BD5\u53F0\u91CC\u9884\u89C8\u6B63\u5E38\u4E0D\u4EE3\u8868\u7EBF\u4E0A\u4E5F\u6B63\u5E38\uFF1A\u6570\u636E\u6E90\u662F**\u6309\u9875\u9762\u6CE8\u518C**\u7684\uFF0CA \u9875\u9762\u80FD\u7528\u7684\u6E90 B \u9875\u9762\u672A\u5FC5\u6709\u3002\u914D\u597D\u4E4B\u540E\u4E00\u5B9A\u8981\u5728\u76EE\u6807\u9875\u9762\u4E0A\u771F\u8DD1\u4E00\u904D\uFF0C\u522B\u53EA\u5728\u8C03\u8BD5\u53F0\u91CC\u770B\u3002"
+      },
       { t: "h3", text: "state\uFF1A\u5C40\u90E8\u72B6\u6001" },
       {
         t: "p",
@@ -449,12 +510,26 @@ var sections3 = [
         rows: [
           ["`plans` \u7B49", "`data` \u7684\u5B57\u6BB5\u76F4\u63A5\u63D0\u5230\u9876\u5C42"],
           ["`state.xxx`", "\u5F53\u524D\u5C40\u90E8\u72B6\u6001"],
-          ["`user.xxx`", "\u5BBF\u4E3B\u9875\u9762\u6CE8\u5165\u7684\u7528\u6237\u4FE1\u606F\uFF08\u7248\u672C\u3001\u5230\u671F\u5929\u6570\u3001\u5E97\u94FA\u540D\u2026\uFF09\uFF0C\u4E0D\u7528\u53D1\u8BF7\u6C42"],
+          [
+            "`user.xxx`",
+            "\u5BBF\u4E3B\u9875\u9762\u6CE8\u5165\u7684\u767B\u5F55\u7528\u6237\u4FE1\u606F\uFF08\u7248\u672C\u3001\u5269\u4F59\u5929\u6570\u3001\u5E97\u94FA\u540D\u2026\uFF09\uFF0C\u4E0D\u7528\u53D1\u8BF7\u6C42\uFF0C\u5B57\u6BB5\u6E05\u5355\u89C1\u4E0B"
+          ],
           ["`current` \u7B49", "`derived` \u63A8\u5BFC\u51FA\u6765\u7684\u522B\u540D"],
           ["`item` / `index`", "\u4EC5\u5728 `repeat` \u7684 `template` \u5185\u53EF\u7528"],
           ["`cd.xxx`", "\u4EC5\u5728 `countdown` \u7684 `children` \u5185\u53EF\u7528"]
         ]
       },
+      { t: "h3", text: "user.xxx\uFF1A\u53EF\u7528\u5B57\u6BB5\u6E05\u5355" },
+      {
+        t: "p",
+        text: "`user` \u662F\u5BBF\u4E3B\u6CE8\u5165\u7684\u767B\u5F55\u7528\u6237\u4FE1\u606F\uFF0C**\u53EA\u6709\u4E0B\u9762\u8FD9\u4E9B\u5B57\u6BB5**\uFF0C\u5B57\u6BB5\u540D\u5168\u5E73\u53F0\u901A\u7528\u3002\u5199\u522B\u7684\u540D\u5B57\uFF08\u5982 `user.expireDays`\uFF09\u4E0D\u4F1A\u62A5\u9519\uFF0C\u53EA\u4F1A\u6C42\u503C\u4E3A\u7A7A\u2014\u2014\u9875\u9762\u4E0A\u5C31\u662F\u4E00\u5904\u7A7A\u767D\u3001\u5012\u8BA1\u65F6\u5F52\u96F6\uFF0C\u6240\u4EE5\u4FDD\u5B58\u524D\u4F1A\u6309\u8FD9\u5F20\u8868\u6821\u9A8C\u4E00\u904D\u3002"
+      },
+      { t: "table", head: ["\u5B57\u6BB5", "\u542B\u4E49"], rows: userFieldRows },
+      {
+        t: "note",
+        tone: "warn",
+        text: "\u5012\u8BA1\u65F6\u7684 `to` \u8981\u7528 `{{ user.serviceExpireTime }}`\uFF08\u5230\u671F\u65F6\u95F4\u70B9\uFF09\uFF0C\u4E0D\u662F `{{ user.remainDays }}`\uFF08\u5269\u4F59\u5929\u6570\uFF0C\u662F\u4E2A\u6570\u5B57\uFF0C\u53EA\u80FD\u5199\u5728\u6587\u6848\u91CC\uFF09\u3002"
+      },
       { t: "h3", text: "\u5728\u54EA\u4E9B\u5730\u65B9\u80FD\u5199 {{ }}" },
       {
         t: "p",
@@ -491,7 +566,7 @@ var sections3 = [
   "visibleWhen": "current.gift != ''" }
 
 // \u53EA\u5BF9\u65B0\u7528\u6237\u663E\u793A
-{ "type": "text", "content": "\u65B0\u4EBA\u4E13\u4EAB", "visibleWhen": "user.isNew" }`
+{ "type": "text", "content": "\u65B0\u4EBA\u4E13\u4EAB", "visibleWhen": "user.isNewUser" }`
       },
       { t: "h3", text: "\u5207 tab \u65F6\u6574\u4F53\u6362\u80A4 / \u6362\u5E03\u5C40" },
       {
@@ -890,6 +965,11 @@ var sections6 = [
         t: "p",
         text: "\u5706\u89D2\u88C1\u5207\u53EA\u4F5C\u7528\u4E8E\u5F39\u7A97\u5185\u5BB9\uFF0C\u5173\u95ED\u6309\u94AE\u5728\u88C1\u5207\u5C42\u4E4B\u5916\uFF0C\u6240\u4EE5 `offset` \u5199\u8D1F\u503C\u65F6\u4E0D\u4F1A\u88AB\u88C1\u6389\u3002\u4E24\u79CD\u5E38\u89C1\u505A\u6CD5\uFF1A"
       },
+      {
+        t: "note",
+        tone: "warn",
+        text: "**\u4E24\u4E2A\u503C\u8981\u540C\u5411**\uFF1A`[x, y]` \u8981\u4E48\u90FD\u662F\u6B63\u6570\uFF08\u8D34\u5728\u5F39\u7A97\u5185\u4FA7\uFF09\uFF0C\u8981\u4E48\u90FD\u662F\u8D1F\u6570\uFF08\u6311\u5230\u5F39\u7A97\u5916\u4FA7\uFF09\u3002\u5199\u6210 `[-12, 12]` \u8FD9\u79CD\u4E00\u8D1F\u4E00\u6B63\uFF0C\u6309\u94AE\u4F1A\u6A2A\u8DE8\u5F39\u7A97\u8FB9\u7F18\u2014\u2014\u6A2A\u5411\u6311\u51FA\u53BB\u4E00\u534A\u3001\u7EB5\u5411\u53C8\u7F29\u5728\u91CC\u9762\uFF0C\u770B\u7740\u5C31\u662F\u8D34\u6B6A\u4E86\u3002"
+      },
       {
         t: "code",
         code: `// \u53F3\u4E0A\u89D2\u5916\u4FA7
@@ -909,6 +989,35 @@ var sections6 = [
         t: "note",
         tone: "warn",
         text: "\u653E\u5230\u5916\u9762\u65F6\u8BB0\u5F97\u7559\u51FA\u7A7A\u95F4\uFF1A\u5F39\u7A97\u56DB\u5468\u6709 20px \u5185\u8FB9\u8DDD\uFF0C\u8D85\u8FC7\u8FD9\u4E2A\u8DDD\u79BB\u5728\u5C0F\u5C4F\u4E0A\u53EF\u80FD\u8D34\u8FB9\u3002\u5728\u8C03\u8BD5\u53F0\u91CC\u628A\u9884\u89C8\u7F29\u653E\u5207\u5230 100% \u786E\u8BA4\u4E00\u4E0B\u3002"
+      },
+      { t: "h3", text: "banner \u7684\u5BBD\u9AD8\u6BD4\uFF1A\u4E0D\u80FD\u5C0F\u4E8E 12:1" },
+      {
+        t: "p",
+        text: "\u6574\u56FE banner \u9760\u6839\u8282\u70B9\u7684 `aspectRatio` \u7EF4\u6301\u7B49\u6BD4\uFF08\u5199\u6B7B\u9AD8\u5EA6\u7684\u8BDD\u5751\u4F4D\u4E00\u5BBD\uFF0C\u56FE\u5C31\u88AB\u6A2A\u5411\u62C9\u53D8\u5F62\uFF09\u3002\u4F46\u6BD4\u4F8B\u8D8A\u65B9\uFF0C\u5728\u5BBD\u5C4F\u4E0A\u7B97\u51FA\u6765\u8D8A\u9AD8\u2014\u2014**\u6BD4\u4F8B\u5C0F\u4E8E 12:1 \u7684\u914D\u7F6E\u4FDD\u5B58\u65F6\u4F1A\u88AB\u62E6\u4E0B**\u3002"
+      },
+      {
+        t: "table",
+        head: ["\u5BBD\u9AD8\u6BD4", "1800px \u5BBD\u7684\u5751\u4F4D\u91CC\u6709\u591A\u9AD8", "\u7ED3\u679C"],
+        rows: [
+          ["`960 / 56`\uFF08\u224817:1\uFF09", "\u7EA6 105px", "\u2705 \u4E00\u6761\u901A\u680F\u63D0\u793A"],
+          ["`24 / 1`", "\u7EA6 75px", "\u2705 \u66F4\u6241\uFF0C\u89C6\u89C9\u66F4\u8F7B"],
+          ["`1200 / 300`\uFF084:1\uFF09", "\u7EA6 451px", "\u274C \u5403\u6389\u9996\u5C4F\u4E00\u5927\u5757"]
+        ]
+      },
+      {
+        t: "note",
+        tone: "info",
+        text: "banner \u5751\u4F4D\u5E38\u9A7B\u5728\u9875\u9762\u9876\u90E8\u3001\u4E0D\u8DDF\u968F\u5185\u5BB9\u6EDA\u52A8\uFF0C\u9AD8\u5EA6\u662F**\u5751\u4F4D\u7684\u8BBE\u8BA1\u5C3A\u5BF8**\uFF0C\u4E0D\u662F\u914D\u7F6E\u7684\u81EA\u7531\u5EA6\u3002\u9700\u8981\u5927\u56FE\u5F3A\u66DD\u5149\uFF0C\u7528\u5F39\u7A97\uFF08popup\uFF09\uFF0C\u522B\u628A banner \u6491\u6210\u5927\u56FE\u3002"
+      },
+      { t: "h3", text: "banner / \u516C\u544A\u6761\uFF1A\u522B\u5199 maxWidth" },
+      {
+        t: "p",
+        text: '`maxWidth` \u662F\u7ED9**\u5F39\u7A97**\u7528\u7684\uFF08\u5F39\u7A97\u8981\u9650\u5BBD\uFF0C\u5426\u5219\u5927\u5C4F\u4E0A\u4F1A\u62C9\u5F97\u5F88\u957F\uFF09\u3002banner \u548C\u516C\u544A\u6761\u662F\u901A\u680F\u5F62\u6001\uFF0C\u5BBD\u5EA6\u5E94\u8BE5\u7531\u9875\u9762\u4E0A\u90A3\u4E2A\u5751\u4F4D\u51B3\u5B9A\u2014\u2014\u5751\u4F4D\u6709\u591A\u5BBD\u662F\u5404\u4E2A\u9875\u9762\u7684\u5E03\u5C40\u8BF4\u4E86\u7B97\uFF0C\u914D\u7F6E\u91CC\u5199\u6B7B\u4E00\u4E2A\u4E0A\u9650\uFF0C\u4E00\u65E6\u5C0F\u4E8E\u5751\u4F4D\u5BBD\u5EA6\u5C31\u94FA\u4E0D\u6EE1\u3001\u53F3\u8FB9\u7A7A\u4E00\u622A\u3002\u5199 `"width": "100%"` \u5C31\u591F\u4E86\u3002'
+      },
+      {
+        t: "note",
+        tone: "info",
+        text: "\u786E\u5B9E\u60F3\u9650\u5BBD\uFF08\u6BD4\u5982\u8D85\u5BBD\u5C4F\u4E0A\u522B\u62C9\u592A\u957F\uFF09\u4E5F\u53EF\u4EE5\u5199\uFF0C\u5199\u4E86\u4F1A\u81EA\u52A8\u5C45\u4E2D\u3001\u4E0D\u4F1A\u8D34\u7740\u5DE6\u8FB9\u3002\u4F46\u5148\u786E\u8BA4\u76EE\u6807\u9875\u9762\u7684\u5751\u4F4D\u5230\u5E95\u6709\u591A\u5BBD\uFF0C\u522B\u51ED\u611F\u89C9\u586B\u4E00\u4E2A\u6570\u5B57\u3002"
       }
     ]
   }
@@ -1254,6 +1363,25 @@ var sections_default = sections9;
 
 // src/docs/meta.ts
 var changelog = [
+  {
+    date: "2026-08-22",
+    items: [
+      "\u5217\u51FA user \u53EF\u7528\u5B57\u6BB5\u6E05\u5355\uFF08\u7B2C 9 \u8282\uFF09\uFF1A\u5BBF\u4E3B\u6CE8\u5165\u7684\u5C31\u662F\u767B\u5F55\u7528\u6237\u4FE1\u606F\u90A3\u4E00\u5957\uFF0C\u5B57\u6BB5\u540D\u5168\u5E73\u53F0\u901A\u7528",
+      "\u4FDD\u5B58\u65F6\u53EF\u6309\u767D\u540D\u5355\u6821\u9A8C {{ user.xxx }}\uFF0C\u5199\u9519\u5B57\u6BB5\u540D\u76F4\u63A5\u62A5\u9519\u5E76\u63D0\u793A\u6700\u63A5\u8FD1\u7684\u5019\u9009\u2014\u2014\u4EE5\u524D\u53EA\u4F1A\u5728\u9875\u9762\u4E0A\u663E\u793A\u6210\u7A7A\u767D",
+      "\u793A\u4F8B\u7EDF\u4E00\u6539\u7528\u771F\u5B9E\u5B57\u6BB5\uFF1A\u5269\u4F59\u5929\u6570\u4E00\u5F8B user.remainDays\uFF08\u539F\u5148 lastDayLeft / expireDays / trialLeftDays \u4E09\u79CD\u5199\u6CD5\u90FD\u662F\u4E0D\u5B58\u5728\u7684\u5B57\u6BB5\uFF09\uFF0C\u5230\u671F\u65F6\u95F4 user.serviceExpireTime\uFF0C\u7248\u672C\u540D user.levelName",
+      "\u793A\u4F8B \u2467 \u6574\u56FE Banner \u6539\u6210\u7A84\u901A\u680F\u6BD4\u4F8B 960 \xD7 56\uFF0C\u5E95\u56FE\u6362\u6210\u5185\u8054 SVG \u5360\u4F4D\u56FE\uFF08\u5916\u94FE\u5728\u5BBF\u4E3B\u73AF\u5883\u4E0D\u4E00\u5B9A\u901A\uFF09",
+      "\u65B0\u589E\u7B2C 11 \u8282\u300C\u57CB\u70B9\u5199\u5728\u54EA\uFF0C\u51B3\u5B9A\u5B83\u88AB\u7B97\u6210\u4EC0\u4E48\u300D\uFF1A\u540C\u4E00\u4E2A track \u5199\u5728\u8282\u70B9 action / stage.onShow / stage.onClose / \u5173\u95ED\u6309\u94AE\u91CC\uFF0C\u5F52\u5C5E\u5B8C\u5168\u4E0D\u540C\uFF0C\u52A1\u5FC5\u770B\u4E00\u904D",
+      "\u3010\u53E3\u5F84\u4FEE\u6B63\u3011\u4E00\u6B21\u70B9\u51FB\u53EA\u4EA7\u751F\u4E00\u6761 click\uFF1A\u4EE5\u524D\u300C\u5148\u57CB\u70B9\u518D\u8DF3\u8F6C\u300D\u7684 sequence \u4F1A\u88AB\u7B97\u6210\u4E24\u6B21\u70B9\u51FB\uFF0ConShow / onClose \u91CC\u7684\u57CB\u70B9\u4E5F\u88AB\u7B97\u6210\u70B9\u51FB\uFF0C\u5B9E\u6D4B\u4E00\u4E2A\u5F39\u7A97\u7684\u5B8C\u6574\u751F\u547D\u5468\u671F\u4E0A\u62A5\u4E86 6 \u6761\u3001\u70B9\u51FB\u91CF\u865A\u9AD8 4 \u500D\uFF0C\u73B0\u5DF2\u4FEE\u6B63",
+      "\u3010\u53E3\u5F84\u4FEE\u6B63\u3011\u5173\u95ED\u52A8\u4F5C\u4E0D\u518D\u7B97\u70B9\u51FB\uFF1A\u914D\u5728\u5173\u95ED\u6309\u94AE\u4E0A\u7684\u57CB\u70B9\u540D\u5E76\u8FDB close \u7684 extra\uFF0C\u60F3\u533A\u5206\u5173\u95ED\u5165\u53E3\u8BF7\u7528 close \u52A8\u4F5C\u7684 reason",
+      "\u3010\u5DF2\u77E5\u7A7A\u767D\u3011\u591A\u89C6\u56FE\u91CC\u300C\u5173\u6389\u67D0\u4E00\u5C42\u300D\u4E0D\u4EA7\u751F\u4EFB\u4F55\u4E0A\u62A5\uFF08\u5982\u516C\u544A\u6761\u5F39\u51FA\u5F39\u7A97\u540E\u53C8\u5173\u6389\u5F39\u7A97\uFF0C\u7269\u6599\u5E76\u6CA1\u6709\u5173\uFF09\uFF0C\u90A3\u4E00\u5C42\u914D\u7684 onClose \u57CB\u70B9\u7B49\u4E0D\u5230\u6570\u636E",
+      "banner / \u516C\u544A\u6761\u4E0D\u8981\u5199 maxWidth\uFF08\u7B2C 3 \u8282\uFF09\uFF1A\u901A\u680F\u5F62\u6001\u7684\u5BBD\u5EA6\u8BE5\u7531\u9875\u9762\u5751\u4F4D\u51B3\u5B9A\uFF0C\u5199\u6B7B\u4E0A\u9650\u4F1A\u94FA\u4E0D\u6EE1\u3001\u53F3\u8FB9\u7A7A\u4E00\u622A\uFF1B\u786E\u5B9E\u8981\u9650\u5BBD\u5219\u4F1A\u81EA\u52A8\u5C45\u4E2D",
+      "\u6570\u636E\u6E90\u586B\u4E86\u5BBF\u4E3B\u6CA1\u6CE8\u518C\u7684\u540D\u5B57\uFF0C\u6574\u4EFD\u7269\u6599\u4E00\u76F4\u662F\u7A7A\u7684\u3001\u4E0D\u62A5\u9519\uFF08\u7B2C 8 \u8282\uFF09\uFF1A\u6570\u636E\u6E90\u6309\u9875\u9762\u6CE8\u518C\uFF0C\u8C03\u8BD5\u53F0\u6B63\u5E38\u4E0D\u4EE3\u8868\u76EE\u6807\u9875\u9762\u6B63\u5E38\uFF0C\u914D\u5B8C\u8981\u5728\u771F\u5B9E\u9875\u9762\u8DD1\u4E00\u904D",
+      "\u793A\u4F8B \u2464 \u516C\u544A\u6761\u6539\u6210\u53EA\u6709\u53F3\u4FA7\u6309\u94AE\u80FD\u6253\u5F00\u5F39\u7A97\uFF1A\u6574\u6761\u53EF\u70B9\u4F1A\u8BA9\u7528\u6237\u60F3\u9009\u4E2D\u6587\u6848\u590D\u5236\u65F6\u8BEF\u89E6\u53D1",
+      "\u3010\u65B0\u589E\u786C\u7EA6\u675F\u3011banner \u7684\u5BBD\u9AD8\u6BD4\u4E0D\u80FD\u5C0F\u4E8E 12:1\uFF08\u7B2C 3 \u8282\uFF09\uFF1Abanner \u9AD8\u5EA6\u662F\u300C\u5751\u4F4D\u5BBD\u5EA6 \xD7 \u6BD4\u4F8B\u300D\u7B97\u51FA\u6765\u7684\uFF0C\u6BD4\u4F8B\u8D8A\u65B9\u5728\u5BBD\u5C4F\u4E0A\u8D8A\u9AD8\uFF0C1200\xD7300 \u90A3\u79CD\u5927\u56FE\u5728 1800 \u5BBD\u7684\u5751\u4F4D\u91CC\u6709 451px\u3001\u76F4\u63A5\u5403\u6389\u9996\u5C4F\uFF0C\u73B0\u5728\u4FDD\u5B58\u65F6\u4F1A\u88AB\u62E6\u4E0B",
+      "\u5173\u95ED\u6309\u94AE\u7684 offset \u4E24\u4E2A\u503C\u8981\u540C\u5411\uFF08\u7B2C 3 \u8282\uFF09\uFF1A\u5199\u6210 [-12, 12] \u8FD9\u79CD\u4E00\u8D1F\u4E00\u6B63\uFF0C\u6309\u94AE\u4F1A\u6A2A\u8DE8\u5F39\u7A97\u8FB9\u7F18\u3001\u770B\u7740\u50CF\u8D34\u6B6A\u4E86\uFF0C\u793A\u4F8B \u2466 \u5DF2\u4FEE",
+      "\u793A\u4F8B \u2467 \u6574\u56FE Banner \u7684\u5173\u95ED\u56FE\u6807\u6539\u7528 calc(100% - 32px) \u56FA\u5B9A\u8D34\u53F3\u2014\u2014\u539F\u5148\u7528\u767E\u5206\u6BD4\u5B9A\u4F4D\uFF0C\u5751\u4F4D\u8D8A\u5BBD\u79BB\u53F3\u8FB9\u7F18\u8D8A\u8FDC\uFF081885 \u5BBD\u65F6\u5DEE\u51FA\u5FEB 200px\uFF09\uFF0C\u770B\u7740\u50CF\u98D8\u5728\u4E2D\u95F4"
+    ]
+  },
   {
     date: "2026-08-18",
     items: [
@@ -1520,7 +1648,7 @@ var renewExpire = {
       children: [
         {
           type: "text",
-          content: "\u23F0 \u8BD5\u7528\u5269 {{ user.trialLeftDays }} \u5929",
+          content: "\u23F0 \u8BD5\u7528\u5269 {{ user.remainDays }} \u5929",
           style: {
             // 不写 alignSelf 会被 flex 列拉满整行，标签必须按内容宽度
             alignSelf: "flex-start",
@@ -1547,7 +1675,7 @@ var renewExpire = {
       children: [
         {
           type: "text",
-          content: "{{ user.trialLeftDays }} \u5929\u540E\u8BD5\u7528\u5230\u671F\uFF0C\u4EE5\u4E0B\u80FD\u529B\u4F1A\u505C\u6B62\uFF1A",
+          content: "{{ user.remainDays }} \u5929\u540E\u8BD5\u7528\u5230\u671F\uFF0C\u4EE5\u4E0B\u80FD\u529B\u4F1A\u505C\u6B62\uFF1A",
           style: { fontSize: 15, fontWeight: "800", color: "#1f2533", marginBottom: 11 }
         },
         {
@@ -1941,7 +2069,7 @@ var lastDay = {
       children: [
         {
           type: "text",
-          content: "\u{1F525} \u8FD8\u5269\u6700\u540E {{ user.lastDayLeft }} \u5929",
+          content: "\u{1F525} \u8FD8\u5269\u6700\u540E {{ user.remainDays }} \u5929",
           style: {
             alignSelf: "flex-start",
             background: "rgba(255,255,255,0.18)",
@@ -1961,7 +2089,7 @@ var lastDay = {
         // ===== 分格倒计时 + 厘秒逐帧动画 =====
         {
           type: "countdown",
-          to: "{{ user.trialEndAt }}",
+          to: "{{ user.serviceExpireTime }}",
           precision: "cs",
           as: "cd",
           style: { align: "center", gap: 6, marginTop: 10 },
@@ -2171,14 +2299,15 @@ var noticeToPopup = {
   state: { plan: 0 },
   derived: { current: { list: "plans", indexBy: "plan" } },
   views: {
-    // 常驻在页面里的公告条，点它才弹弹窗
+    // 常驻在页面里的公告条，点右侧按钮才弹弹窗
     bar: {
       type: "notice",
       stage: {
         width: "100%",
         height: "auto",
         layout: "flow",
-        style: { radius: 6, background: "#fff8e6", maxWidth: 1200 },
+        // 通栏类型不写 maxWidth，宽度交给宿主坑位（写死上限会铺不满、右边留白）
+        style: { radius: 6, background: "#fff8e6" },
         // 多视图下每层各埋各的，能分别统计「公告条曝光」和「弹窗曝光」
         onShow: { type: "track", event: "notice_show", params: { view: "bar" } },
         onClose: {
@@ -2190,20 +2319,14 @@ var noticeToPopup = {
       nodes: [
         {
           type: "flex",
-          // 整条都能点开弹窗
-          style: { align: "center", gap: 10, padding: "10px 14px", cursor: "pointer" },
-          action: {
-            type: "sequence",
-            actions: [
-              { type: "track", event: "notice_click", params: { from: "bar" } },
-              { type: "open", view: "renew" }
-            ]
-          },
+          // 行容器本身不绑动作：公告条的文案是给人读的，整条可点会让用户
+          // 想选中文字复制时误弹窗；打开弹窗的入口只有右侧那个按钮
+          style: { align: "center", gap: 10, padding: "10px 14px" },
           children: [
             { type: "text", content: "\u{1F4E2}", style: { fontSize: 16 } },
             {
               type: "text",
-              content: "{{ user.shopName }}\uFF0C\u4F60\u7684{{ user.version }}\u8FD8\u6709 {{ user.expireDays }} \u5929\u5230\u671F",
+              content: "{{ user.shopName }}\uFF0C\u4F60\u7684{{ user.levelName }}\u8FD8\u6709 {{ user.remainDays }} \u5929\u5230\u671F",
               style: { flex: "1", fontSize: 14, color: "#8a6212", lineHeight: 1.5 }
             },
             {
@@ -2217,7 +2340,7 @@ var noticeToPopup = {
                 color: "#fff",
                 fontSize: 12
               },
-              // 叠一层弹窗，公告条留在下面
+              // 打开弹窗的唯一入口。叠一层弹窗，公告条留在下面
               action: {
                 type: "sequence",
                 actions: [
@@ -2227,7 +2350,7 @@ var noticeToPopup = {
               }
             },
             {
-              // × 有自己的动作，点它不会再冒泡去触发外层的「打开弹窗」
+              // 关掉整条公告（不是关弹窗——此时弹窗还没开）
               type: "text",
               content: "\u2715",
               style: {
@@ -2376,7 +2499,7 @@ var confirmAndSwitch = {
           children: [
             {
               type: "text",
-              content: "\u8BD5\u7528\u8FD8\u5269 {{ user.trialLeftDays }} \u5929",
+              content: "\u8BD5\u7528\u8FD8\u5269 {{ user.remainDays }} \u5929",
               style: {
                 fontSize: 19,
                 fontWeight: "800",
@@ -2687,7 +2810,9 @@ var tabTheme = {
     closeButton: {
       show: true,
       position: "top-right",
-      offset: [-12, 12],
+      // 两个值要么都往内、要么都往外：[-12, 12] 这种一外一内会让按钮横跨弹窗边缘，
+      // 看着像贴歪了。这里放在弹窗内侧右上角（stage 有 22 的 padding，压不到内容）
+      offset: [12, 12],
       size: 28,
       icon: "\u2715",
       style: { color: "rgba(255,255,255,0.85)", fontSize: 16 }
@@ -2849,16 +2974,32 @@ var tabTheme = {
 var tab_theme_default = tabTheme;
 
 // src/docs/examples/image-banner.ts
-var RATIO = "1200 / 300";
+var RATIO = "1920 / 75";
+var BANNER_SVG = `<svg xmlns="http://www.w3.org/2000/svg" width="1920" height="75" viewBox="0 0 1920 75">
+  <defs>
+    <linearGradient id="g" x1="0" y1="0" x2="1" y2="0">
+      <stop offset="0" stop-color="#ff4433"/>
+      <stop offset="1" stop-color="#ff8a3c"/>
+    </linearGradient>
+  </defs>
+  <rect width="1920" height="75" fill="url(#g)"/>
+  <text x="48" y="47" font-family="sans-serif" font-size="24" fill="#ffffff">\u79CB\u5B63\u5927\u4FC3 \xB7 \u6574\u56FE Banner \u5360\u4F4D\u56FE</text>
+  <rect x="1344" y="19" width="288" height="38" rx="19" fill="#ffffff" fill-opacity="0.92"/>
+  <text x="1488" y="45" font-family="sans-serif" font-size="22" fill="#d43a1f" text-anchor="middle">\u7ACB\u5373\u67E5\u770B</text>
+</svg>`;
+var BANNER_IMAGE = `data:image/svg+xml;charset=utf-8,${encodeURIComponent(BANNER_SVG)}`;
 var imageBanner = {
   version: 1,
   type: "banner",
-  meta: { name: "\u6574\u56FE Banner\uFF08\u5BBD\u5EA6\u81EA\u9002\u5E94 + \u70ED\u533A\uFF09" },
+  meta: { name: "\u6574\u56FE Banner\uFF08\u7A84\u901A\u680F + \u70ED\u533A\uFF09" },
   stage: {
     width: "100%",
+    // 高度由下面那层 box 的 aspectRatio 撑出来，所以这里是 auto + flow
     height: "auto",
     layout: "flow",
-    style: { radius: 8, maxWidth: 1200, overflow: "hidden" },
+    // 不写 maxWidth：banner 是通栏类型，宽度该由宿主坑位决定。
+    // 写死上限后一旦小于坑位宽度就铺不满、右边留白
+    style: { radius: 8, overflow: "hidden" },
     onClose: {
       type: "track",
       event: "banner_dismiss",
@@ -2867,21 +3008,23 @@ var imageBanner = {
   },
   nodes: [
     {
-      // 热区的定位容器：宽度铺满，高度由 aspectRatio 算
+      // 热区的定位容器：宽度铺满，高度由 aspectRatio 按实际宽度算。
+      // 子节点都是绝对定位、撑不起高度，这里没有确定高度的话热区的百分比 rect 全算成 0
       type: "box",
       style: { width: "100%", aspectRatio: RATIO },
       children: [
         {
           type: "image",
           rect: [0, 0, "100%", "100%"],
-          src: "https://picsum.photos/id/1039/1200/300",
+          src: BANNER_IMAGE,
+          // 容器比例与图比例一致，cover 既不裁也不拉，图里元素与百分比热区天然对齐
           style: { objectFit: "cover" }
         },
         {
-          // 左半边：主标题区，点了看活动详情
+          // 左半边：文案区，点了看活动详情（图里文字从 48/1920 起，热区框大一圈）
           type: "box",
-          rect: ["4%", "20%", "40%", "46%"],
-          style: { radius: 8, background: "rgba(255,68,51,0.16)", cursor: "pointer" },
+          rect: ["1.5%", "16%", "46%", "68%"],
+          style: { radius: 6, background: "rgba(255,255,255,0.16)", cursor: "pointer" },
           action: {
             type: "sequence",
             actions: [
@@ -2895,10 +3038,10 @@ var imageBanner = {
           }
         },
         {
-          // 右侧按钮：直接去下单
+          // 右侧按钮：直接去下单。图里按钮是 1344~1632（70%~85%），热区照着框
           type: "box",
-          rect: ["70%", "58%", "22%", "24%"],
-          style: { radius: 999, background: "rgba(255,68,51,0.16)", cursor: "pointer" },
+          rect: ["70%", "25%", "15%", "51%"],
+          style: { radius: 999, background: "rgba(255,255,255,0.16)", cursor: "pointer" },
           action: {
             type: "sequence",
             actions: [
@@ -2912,17 +3055,20 @@ var imageBanner = {
           }
         },
         {
-          // 关闭放在图上角落，同样用百分比，缩放时不会跑位
+          // 关闭按钮固定贴右：x 用 calc 而不是百分比 ——
+          // 百分比是按容器宽度算的，坑位越宽它离右边缘越远（1885 宽时能差出快 200px），
+          // 看着就像飘在中间。calc(100% - 32px) 让它永远距右边缘 12px（20 宽 + 12 边距）；
+          // y 同理用 calc 垂直居中，banner 高度随坑位宽度变，写死百分比会上下飘
           type: "text",
           content: "\u2715",
-          rect: ["95%", "6%", 22, 22],
+          rect: ["calc(100% - 32px)", "calc(50% - 10px)", 20, 20],
           style: {
             textAlign: "center",
-            lineHeight: 22,
-            radius: 11,
+            lineHeight: 20,
+            radius: 10,
             background: "rgba(0,0,0,0.35)",
             color: "#fff",
-            fontSize: 13,
+            fontSize: 12,
             cursor: "pointer"
           },
           // 「不再提醒」写在 close 的 reason 上，上报给后端即可，不配 call 写本地存储
@@ -3073,7 +3219,9 @@ var noticeBar = {
     width: "100%",
     height: "auto",
     layout: "flow",
-    style: { radius: 6, background: "#fff8e6", maxWidth: 1200 },
+    // 不写 maxWidth：公告条是通栏类型，宽度该由宿主坑位决定。
+    // 写死上限后一旦小于坑位宽度就铺不满，右边留白（core 会居中，但仍不如铺满）
+    style: { radius: 6, background: "#fff8e6" },
     onShow: { type: "track", event: "notice_show", params: { notice: "guide" } },
     onClose: {
       type: "track",
@@ -3163,7 +3311,7 @@ var examples = [
     dsl: confirmAndSwitch
   },
   { label: "\u2466 \u5207 tab \u6362\u80A4\u6362\u5E03\u5C40", value: "tabTheme", dsl: tab_theme_default },
-  { label: "\u2467 \u6574\u56FE Banner\uFF08\u5BBD\u5EA6\u81EA\u9002\u5E94 + \u70ED\u533A\uFF09", value: "imageBanner", dsl: image_banner_default }
+  { label: "\u2467 \u6574\u56FE Banner\uFF08\u7A84\u901A\u680F + \u70ED\u533A\uFF09", value: "imageBanner", dsl: image_banner_default }
 ];
 var examples_default = examples;
 
@@ -3429,6 +3577,8 @@ countdown_end          // \u5012\u8BA1\u65F6\u5F52\u96F6
 - \`onClose\` \u5728\u70B9 X\u3001\u70B9\u906E\u7F69\u3001\u8D70 \`close\` \u52A8\u4F5C\u3001\u88AB \`replace\` \u9876\u6389\u65F6\u90FD\u4F1A\u89E6\u53D1
 - \`{{ closeReason }}\` \u53D6\u503C\uFF1A\`close-button\` / \`mask\` / \`replace\` / \`close\` \u52A8\u4F5C\u81EA\u5E26\u7684 \`reason\`\uFF08\u5982 \`"user-dismiss"\`\uFF09/ \u9ED8\u8BA4 \`action\`
 - \u591A\u89C6\u56FE\u65F6\u6BCF\u5C42\u5404\u5199\u5404\u7684\uFF0C\u624D\u80FD\u5206\u5F00\u7EDF\u8BA1
+- **\`onShow\` / \`onClose\` \u91CC\u7684 \`track\` \u4E0D\u4F1A\u88AB\u7B97\u6210\u70B9\u51FB**\uFF1A\u4E0A\u62A5\u7684 \`event\` \u662F\u300C\u66DD\u5149 / \u70B9\u51FB / \u5173\u95ED\u300D\u4E09\u503C\uFF0C\u524D\u53F0\u6309\u65F6\u673A\u51B3\u5B9A\u62A5\u54EA\u4E2A\uFF0C\u8FD9\u4E24\u4E2A\u94A9\u5B50\u91CC\u7684\u57CB\u70B9\u540D\u5206\u522B\u5E76\u8FDB\u66DD\u5149\u3001\u5173\u95ED\u90A3\u6761\u4E0A\u62A5\uFF0C\u540E\u7AEF\u7167\u6837\u770B\u5F97\u5230
+- \u4E00\u6B21\u70B9\u51FB\u91CC \`sequence: [track, navigate]\` **\u53EA\u4E0A\u62A5\u4E00\u6761\u70B9\u51FB**\uFF0C\u6309\u624B\u52BF\u8BA1\u6570\u3001\u4E0D\u6309\u52A8\u4F5C\u4E2A\u6570\u8BA1\u6570\uFF0C\u653E\u5FC3\u4E32
 
 ## \u516C\u544A\u6761 / Banner \u7684\u5173\u95ED
 
@@ -3488,7 +3638,7 @@ function countdownSection() {
 
 \`to\` \u662F\u7ED3\u675F\u65F6\u95F4\u3002**\u7528\u6237\u8BF4\u300C9\u67081\u53F7\u622A\u6B62\u300D\u5C31\u76F4\u63A5\u5199 \`"2026-09-01"\`\uFF0C\u4E0D\u8981\u81EA\u4F5C\u4E3B\u5F20\u6362\u7B97\u6210\u65F6\u95F4\u6233** \u2014\u2014 \u8FD0\u8425\u770B\u4E0D\u61C2\u65F6\u95F4\u6233\uFF0C\u4E5F\u6CA1\u6CD5\u6838\u5BF9\u3002
 
-\u80FD\u8BC6\u522B\u7684\u5199\u6CD5\uFF1A\`"2026-09-01 18:00:00"\`\u3001\`"2026-09-01"\`\u3001\`"2026\u5E749\u67081\u65E5 18\u70B9"\`\u3001ISO\uFF08\`"2026-09-01T18:00:00+08:00"\`\uFF09\u3001\u6BEB\u79D2\u65F6\u95F4\u6233\u3001\`"{{ user.trialEndAt }}"\`\u3002
+\u80FD\u8BC6\u522B\u7684\u5199\u6CD5\uFF1A\`"2026-09-01 18:00:00"\`\u3001\`"2026-09-01"\`\u3001\`"2026\u5E749\u67081\u65E5 18\u70B9"\`\u3001ISO\uFF08\`"2026-09-01T18:00:00+08:00"\`\uFF09\u3001\u6BEB\u79D2\u65F6\u95F4\u6233\u3001\`"{{ user.serviceExpireTime }}"\`\u3002
 
 \u5199\u6210 \`"\u4E0B\u5468\u4E09"\` \u8FD9\u79CD\u8BC6\u522B\u4E0D\u4E86\u7684\u4F1A\u5728\u4FDD\u5B58\u524D\u62A5\u9519\u3002
 
@@ -3499,7 +3649,7 @@ function countdownSection() {
 \`\`\`jsonc
 {
   "type": "countdown",
-  "to": "2026-09-01 18:00:00",   // \u4E5F\u53EF\u4EE5\u5199 "{{ user.trialEndAt }}" \u4ECE\u6570\u636E\u53D6
+  "to": "2026-09-01 18:00:00",   // \u4E5F\u53EF\u4EE5\u5199 "{{ user.serviceExpireTime }}" \u4ECE\u6570\u636E\u53D6
   "precision": "s",          // "s" \u6BCF\u79D2 | "cs" \u5398\u79D2\u9010\u5E27\uFF08\u7D27\u8FEB\u611F\u66F4\u5F3A\uFF09
   "as": "cd",
   "style": { "align": "center", "gap": 6 },
@@ -3576,6 +3726,10 @@ function dataSection() {
 \u80FD\u8BFB\u5230\uFF1A\`data\` \u7684\u5B57\u6BB5\uFF08\u76F4\u63A5\u5728\u9876\u5C42\uFF09\u3001\`state.xxx\`\u3001\`user.xxx\`\uFF08\u5F53\u524D\u7528\u6237\u4FE1\u606F\uFF09\u3001
 \`derived\` \u7684\u522B\u540D\u3001\`item\`/\`index\`\uFF08repeat \u5185\uFF09\u3001\`cd.xxx\`\uFF08countdown \u5185\uFF09\u3002
 
+\`user\` **\u53EA\u6709\u8FD9\u4E9B\u5B57\u6BB5**\uFF08\u5199\u522B\u7684\u540D\u5B57\u6C42\u503C\u4E3A\u7A7A\uFF0C\u4FDD\u5B58\u65F6\u4F1A\u88AB\u6821\u9A8C\u62E6\u4E0B\uFF09\uFF1A
+${DEFAULT_USER_FIELDS.map((field) => `\`${field}\`\uFF08${USER_FIELD_LABELS[field]}\uFF09`).join("\u3001")}\u3002
+\u5012\u8BA1\u65F6\u7684 \`to\` \u7528 \`{{ user.serviceExpireTime }}\`\uFF0C\u5269\u4F59\u5929\u6570\u6587\u6848\u7528 \`{{ user.remainDays }}\`\u3002
+
 \`{{ }}\` \u53EF\u7528\u4E8E \`content\` \`src\` \`text\` \`to\`\u3001**\`style\` \u7684\u6BCF\u4E2A\u503C**\u3001\u4EE5\u53CA\u52A8\u4F5C\u7684 \`url\`/\`event\`/\`params\`\u3002
 
 \u652F\u6301\uFF1A\u53D6\u503C\u3001\u5B57\u9762\u91CF\u3001\`!\` \`-\`\u3001\`+ - * / %\`\u3001\u6BD4\u8F83\u3001\`&& ||\`\u3001\u4E09\u5143 \`a ? b : c\`\u3002