@yaoxiu/marketing-dsl 1.5.1 → 2.0.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-BSJDNS6C.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" },
       {
@@ -909,6 +984,16 @@ 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 / \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 +1339,22 @@ 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"
+    ]
+  },
   {
     date: "2026-08-18",
     items: [
@@ -1520,7 +1621,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 +1648,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 +2042,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 +2062,7 @@ var lastDay = {
         // ===== 分格倒计时 + 厘秒逐帧动画 =====
         {
           type: "countdown",
-          to: "{{ user.trialEndAt }}",
+          to: "{{ user.serviceExpireTime }}",
           precision: "cs",
           as: "cd",
           style: { align: "center", gap: 6, marginTop: 10 },
@@ -2171,14 +2272,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 +2292,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 +2313,7 @@ var noticeToPopup = {
                 color: "#fff",
                 fontSize: 12
               },
-              // 叠一层弹窗，公告条留在下面
+              // 打开弹窗的唯一入口。叠一层弹窗，公告条留在下面
               action: {
                 type: "sequence",
                 actions: [
@@ -2227,7 +2323,7 @@ var noticeToPopup = {
               }
             },
             {
-              // × 有自己的动作，点它不会再冒泡去触发外层的「打开弹窗」
+              // 关掉整条公告（不是关弹窗——此时弹窗还没开）
               type: "text",
               content: "\u2715",
               style: {
@@ -2376,7 +2472,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",
@@ -2849,17 +2945,32 @@ var tabTheme = {
 var tab_theme_default = tabTheme;
 
 // src/docs/examples/image-banner.ts
-var RATIO = "1200 / 300";
+var RATIO = "960 / 56";
+var BANNER_SVG = `<svg xmlns="http://www.w3.org/2000/svg" width="960" height="56" viewBox="0 0 960 56">
+  <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="960" height="56" fill="url(#g)"/>
+  <text x="24" y="34" font-family="sans-serif" font-size="15" fill="#ffffff">\u79CB\u5B63\u5927\u4FC3 \xB7 \u6574\u56FE Banner \u5360\u4F4D\u56FE\uFF08\u5BBD\u5EA6\u81EA\u9002\u5E94\uFF09</text>
+  <rect x="749" y="12" width="144" height="32" rx="16" fill="#ffffff" fill-opacity="0.92"/>
+  <text x="821" y="33" font-family="sans-serif" font-size="14" 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%",
     height: "auto",
     layout: "flow",
-    style: { radius: 8, maxWidth: 1200, overflow: "hidden" },
-    onShow: { type: "track", event: "banner_show", params: { banner: "autumn" } },
+    // 不写 maxWidth：banner 是通栏类型，宽度该由宿主坑位决定。写死上限后一旦
+    // 小于坑位宽度就铺不满、右边留白。占位图是矢量 SVG + objectFit:cover，
+    // 拉到多宽都不会糊；高度由下面的 aspectRatio 按实际宽度算
+    style: { radius: 8, overflow: "hidden" },
     onClose: {
       type: "track",
       event: "banner_dismiss",
@@ -2875,14 +2986,14 @@ var imageBanner = {
         {
           type: "image",
           rect: [0, 0, "100%", "100%"],
-          src: "https://picsum.photos/id/1039/1200/300",
+          src: BANNER_IMAGE,
           style: { objectFit: "cover" }
         },
         {
-          // 左半边：主标题区，点了看活动详情
+          // 左半边：文案区，点了看活动详情（1.5% ~ 47.5%，不碰右侧按钮）
           type: "box",
-          rect: ["4%", "20%", "40%", "46%"],
-          style: { radius: 8, background: "rgba(255,68,51,0.16)", cursor: "pointer" },
+          rect: ["1.5%", "14%", "46%", "72%"],
+          style: { radius: 6, background: "rgba(255,255,255,0.16)", cursor: "pointer" },
           action: {
             type: "sequence",
             actions: [
@@ -2896,10 +3007,10 @@ var imageBanner = {
           }
         },
         {
-          // 右侧按钮：直接去下单
+          // 右侧按钮：直接去下单（78% ~ 94%，正好盖住图里那颗白色按钮）
           type: "box",
-          rect: ["70%", "58%", "22%", "24%"],
-          style: { radius: 999, background: "rgba(255,68,51,0.16)", cursor: "pointer" },
+          rect: ["78%", "16%", "16%", "68%"],
+          style: { radius: 999, background: "rgba(255,255,255,0.16)", cursor: "pointer" },
           action: {
             type: "sequence",
             actions: [
@@ -2913,17 +3024,17 @@ var imageBanner = {
           }
         },
         {
-          // 关闭放在图上角落，同样用百分比，缩放时不会跑位
+          // 关闭放在最右侧空白处（96% 起，20px 宽约占 2%），与按钮热区不重叠
           type: "text",
           content: "\u2715",
-          rect: ["95%", "6%", 22, 22],
+          rect: ["96%", "25%", 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 写本地存储
@@ -3074,7 +3185,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",
@@ -3164,7 +3277,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;
 
@@ -3430,6 +3543,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
 
@@ -3489,7 +3604,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
 
@@ -3500,7 +3615,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 },
@@ -3577,6 +3692,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