@lytjs/renderer 5.0.1 → 6.4.0

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 (98) hide show
  1. package/README.md +371 -204
  2. package/dist/dom.cjs +12 -1
  3. package/dist/dom.cjs.map +1 -0
  4. package/dist/dom.d.cts +1 -0
  5. package/dist/dom.d.ts +1 -0
  6. package/dist/dom.mjs +3 -1
  7. package/dist/dom.mjs.map +1 -0
  8. package/dist/index.cjs +3324 -1
  9. package/dist/index.cjs.map +1 -0
  10. package/dist/index.d.cts +965 -0
  11. package/dist/index.d.ts +965 -0
  12. package/dist/index.mjs +3202 -1
  13. package/dist/index.mjs.map +1 -0
  14. package/dist/ssr.cjs +310 -1
  15. package/dist/ssr.cjs.map +1 -0
  16. package/dist/ssr.d.cts +21 -0
  17. package/dist/ssr.d.ts +21 -0
  18. package/dist/ssr.mjs +308 -1
  19. package/dist/ssr.mjs.map +1 -0
  20. package/dist/vapor/vapor-app.cjs +334 -0
  21. package/dist/vapor/vapor-app.cjs.map +1 -0
  22. package/dist/vapor/vapor-app.d.cts +88 -0
  23. package/dist/vapor/vapor-app.d.ts +88 -0
  24. package/dist/vapor/vapor-app.mjs +330 -0
  25. package/dist/vapor/vapor-app.mjs.map +1 -0
  26. package/package.json +43 -56
  27. package/dist/miniapp.cjs +0 -27
  28. package/dist/miniapp.mjs +0 -27
  29. package/dist/native.cjs +0 -1
  30. package/dist/native.mjs +0 -1
  31. package/dist/types/create-renderer.d.ts +0 -20
  32. package/dist/types/create-renderer.d.ts.map +0 -1
  33. package/dist/types/dom/dom-ops.d.ts +0 -74
  34. package/dist/types/dom/dom-ops.d.ts.map +0 -1
  35. package/dist/types/dom/dom-renderer.d.ts +0 -243
  36. package/dist/types/dom/dom-renderer.d.ts.map +0 -1
  37. package/dist/types/dom/index.d.ts +0 -17
  38. package/dist/types/dom/index.d.ts.map +0 -1
  39. package/dist/types/dom/patch-events.d.ts +0 -123
  40. package/dist/types/dom/patch-events.d.ts.map +0 -1
  41. package/dist/types/dom/patch-props.d.ts +0 -118
  42. package/dist/types/dom/patch-props.d.ts.map +0 -1
  43. package/dist/types/index.d.ts +0 -36
  44. package/dist/types/index.d.ts.map +0 -1
  45. package/dist/types/miniapp/api-adapter.d.ts +0 -514
  46. package/dist/types/miniapp/api-adapter.d.ts.map +0 -1
  47. package/dist/types/miniapp/index.d.ts +0 -34
  48. package/dist/types/miniapp/index.d.ts.map +0 -1
  49. package/dist/types/miniapp/miniapp-compiler.d.ts +0 -269
  50. package/dist/types/miniapp/miniapp-compiler.d.ts.map +0 -1
  51. package/dist/types/miniapp/miniapp-event-bridge.d.ts +0 -255
  52. package/dist/types/miniapp/miniapp-event-bridge.d.ts.map +0 -1
  53. package/dist/types/miniapp/miniapp-lifecycle.d.ts +0 -224
  54. package/dist/types/miniapp/miniapp-lifecycle.d.ts.map +0 -1
  55. package/dist/types/miniapp/miniapp-renderer.d.ts +0 -269
  56. package/dist/types/miniapp/miniapp-renderer.d.ts.map +0 -1
  57. package/dist/types/miniapp/miniapp-utils.d.ts +0 -168
  58. package/dist/types/miniapp/miniapp-utils.d.ts.map +0 -1
  59. package/dist/types/miniapp/shared-constants.d.ts +0 -28
  60. package/dist/types/miniapp/shared-constants.d.ts.map +0 -1
  61. package/dist/types/miniapp/style-compiler.d.ts +0 -193
  62. package/dist/types/miniapp/style-compiler.d.ts.map +0 -1
  63. package/dist/types/mount.d.ts +0 -32
  64. package/dist/types/mount.d.ts.map +0 -1
  65. package/dist/types/native/index.d.ts +0 -13
  66. package/dist/types/native/index.d.ts.map +0 -1
  67. package/dist/types/native/native-renderer.d.ts +0 -249
  68. package/dist/types/native/native-renderer.d.ts.map +0 -1
  69. package/dist/types/patch.d.ts +0 -23
  70. package/dist/types/patch.d.ts.map +0 -1
  71. package/dist/types/props.d.ts +0 -19
  72. package/dist/types/props.d.ts.map +0 -1
  73. package/dist/types/renderer-interfaces.d.ts +0 -157
  74. package/dist/types/renderer-interfaces.d.ts.map +0 -1
  75. package/dist/types/shared/abstract-renderer.d.ts +0 -74
  76. package/dist/types/shared/abstract-renderer.d.ts.map +0 -1
  77. package/dist/types/ssr/hydration.d.ts +0 -267
  78. package/dist/types/ssr/hydration.d.ts.map +0 -1
  79. package/dist/types/ssr/index.d.ts +0 -15
  80. package/dist/types/ssr/index.d.ts.map +0 -1
  81. package/dist/types/ssr/ssr-renderer.d.ts +0 -277
  82. package/dist/types/ssr/ssr-renderer.d.ts.map +0 -1
  83. package/dist/types/unmount.d.ts +0 -16
  84. package/dist/types/unmount.d.ts.map +0 -1
  85. package/dist/types/vapor/index.d.ts +0 -18
  86. package/dist/types/vapor/index.d.ts.map +0 -1
  87. package/dist/types/vapor/vapor-compiler.d.ts +0 -76
  88. package/dist/types/vapor/vapor-compiler.d.ts.map +0 -1
  89. package/dist/types/vapor/vapor-component.d.ts +0 -55
  90. package/dist/types/vapor/vapor-component.d.ts.map +0 -1
  91. package/dist/types/vapor/vapor-reactive.d.ts +0 -133
  92. package/dist/types/vapor/vapor-reactive.d.ts.map +0 -1
  93. package/dist/types/vapor/vapor-renderer.d.ts +0 -135
  94. package/dist/types/vapor/vapor-renderer.d.ts.map +0 -1
  95. package/dist/types/vnode.d.ts +0 -203
  96. package/dist/types/vnode.d.ts.map +0 -1
  97. package/dist/vapor.cjs +0 -1
  98. package/dist/vapor.mjs +0 -1
@@ -1,157 +0,0 @@
1
- /**
2
- * Lyt.js 渲染器 — 渲染器抽象接口
3
- *
4
- * 本模块定义了平台无关的渲染器接口 LytRenderer,以及渲染器实例接口 RendererInstance。
5
- */
6
- import type { VNode } from './vnode';
7
- /**
8
- * LytRenderer — 平台无关的渲染器接口
9
- *
10
- * 定义了渲染器需要实现的所有平台操作。
11
- * 不同的平台(浏览器 DOM、SSR、小程序等)可以实现此接口来接入渲染器。
12
- *
13
- * 设计原则:
14
- * - 所有方法接收 any 类型的元素引用,保持平台无关性
15
- * - 方法签名简洁,每个方法只做一件事
16
- * - 不包含任何业务逻辑,纯粹的平台操作抽象
17
- */
18
- export interface LytRenderer {
19
- /**
20
- * 创建元素节点
21
- * @param tag 标签名(如 'div', 'span')
22
- * @returns 平台特定的元素引用
23
- */
24
- createElement(tag: string): unknown;
25
- /**
26
- * 创建文本节点
27
- * @param text 文本内容
28
- * @returns 平台特定的文本节点引用
29
- */
30
- createText(text: string): unknown;
31
- /**
32
- * 创建注释节点
33
- * @param text 注释内容
34
- * @returns 平台特定的注释节点引用
35
- */
36
- createComment(text: string): unknown;
37
- /**
38
- * 设置元素属性
39
- * @param el 元素引用
40
- * @param key 属性名
41
- * @param val 属性值
42
- */
43
- setAttribute(el: unknown, key: string, val: unknown): void;
44
- /**
45
- * 移除元素属性
46
- * @param el 元素引用
47
- * @param key 属性名
48
- */
49
- removeAttribute(el: unknown, key: string): void;
50
- /**
51
- * 设置元素样式
52
- * @param el 元素引用
53
- * @param style 样式对象或字符串
54
- */
55
- setStyle(el: unknown, style: object): void;
56
- /**
57
- * 设置元素 class
58
- * @param el 元素引用
59
- * @param cls class 值(字符串或对象)
60
- */
61
- setClass(el: unknown, cls: string | object): void;
62
- /**
63
- * 插入子节点
64
- * @param parent 父节点
65
- * @param child 子节点
66
- * @param ref 参考节点(插入到其前面),可选
67
- */
68
- insert(parent: unknown, child: unknown, ref?: unknown): void;
69
- /**
70
- * 移除节点
71
- * @param child 要移除的节点
72
- */
73
- remove(child: unknown): void;
74
- /**
75
- * 替换子节点
76
- * @param parent 父节点
77
- * @param oldChild 被替换的旧节点
78
- * @param newChild 替换的新节点
79
- */
80
- replace(parent: unknown, oldChild: unknown, newChild: unknown): void;
81
- /**
82
- * 添加事件监听器
83
- * @param el 元素引用
84
- * @param event 事件名
85
- * @param handler 事件处理函数
86
- * @param options 事件选项(可选)
87
- */
88
- addEventListener(el: unknown, event: string, handler: (...args: unknown[]) => void, options?: unknown): void;
89
- /**
90
- * 移除事件监听器
91
- * @param el 元素引用
92
- * @param event 事件名
93
- * @param handler 事件处理函数
94
- */
95
- removeEventListener(el: unknown, event: string, handler: (...args: unknown[]) => void): void;
96
- /**
97
- * 在下一个微任务中执行回调
98
- * @param cb 回调函数
99
- */
100
- nextTick(cb: (...args: unknown[]) => void): void;
101
- /**
102
- * 获取父节点
103
- * @param el 元素引用
104
- * @returns 父节点引用
105
- */
106
- parentNode(el: unknown): unknown;
107
- /**
108
- * 获取下一个兄弟节点
109
- * @param el 元素引用
110
- * @returns 下一个兄弟节点引用
111
- */
112
- nextSibling(el: unknown): unknown;
113
- /**
114
- * 查询选择器
115
- * @param selector CSS 选择器
116
- * @returns 匹配的元素引用
117
- */
118
- querySelector(selector: string): unknown;
119
- }
120
- /**
121
- * RendererInstance — 渲染器实例
122
- *
123
- * createRenderer 工厂函数返回的对象类型。
124
- * 提供挂载、更新、卸载三个核心方法。
125
- */
126
- export interface RendererInstance {
127
- /**
128
- * 挂载 VNode 到容器
129
- *
130
- * 将 VNode 树渲染为真实 DOM 并插入到容器中。
131
- * 如果容器中已有内容,会先清空。
132
- *
133
- * @param vnode VNode 树
134
- * @param container 容器元素
135
- */
136
- mount(vnode: VNode, container: unknown): void;
137
- /**
138
- * 对比更新新旧 VNode
139
- *
140
- * 对比新旧 VNode 树,计算出最小更新操作并应用到真实 DOM。
141
- *
142
- * @param oldVNode 旧 VNode
143
- * @param newVNode 新 VNode
144
- * @param container 容器元素(可选)
145
- */
146
- patch(oldVNode: VNode, newVNode: VNode, container?: unknown): void;
147
- /**
148
- * 卸载 VNode
149
- *
150
- * 从容器中移除 VNode 对应的真实 DOM,并清理事件监听等资源。
151
- *
152
- * @param vnode VNode
153
- * @param container 容器元素(可选)
154
- */
155
- unmount(vnode: VNode, container?: unknown): void;
156
- }
157
- //# sourceMappingURL=renderer-interfaces.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"renderer-interfaces.d.ts","sourceRoot":"","sources":["../../src/renderer-interfaces.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;AAMpC;;;;;;;;;;GAUG;AACH,MAAM,WAAW,WAAW;IAC1B;;;;OAIG;IACH,aAAa,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAA;IAEnC;;;;OAIG;IACH,UAAU,CAAC,IAAI,EAAE,MAAM,GAAG,OAAO,CAAA;IAEjC;;;;OAIG;IACH,aAAa,CAAC,IAAI,EAAE,MAAM,GAAG,OAAO,CAAA;IAEpC;;;;;OAKG;IACH,YAAY,CAAC,EAAE,EAAE,OAAO,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,OAAO,GAAG,IAAI,CAAA;IAE1D;;;;OAIG;IACH,eAAe,CAAC,EAAE,EAAE,OAAO,EAAE,GAAG,EAAE,MAAM,GAAG,IAAI,CAAA;IAE/C;;;;OAIG;IACH,QAAQ,CAAC,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,GAAG,IAAI,CAAA;IAE1C;;;;OAIG;IACH,QAAQ,CAAC,EAAE,EAAE,OAAO,EAAE,GAAG,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAAA;IAEjD;;;;;OAKG;IACH,MAAM,CAAC,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE,GAAG,CAAC,EAAE,OAAO,GAAG,IAAI,CAAA;IAE5D;;;OAGG;IACH,MAAM,CAAC,KAAK,EAAE,OAAO,GAAG,IAAI,CAAA;IAE5B;;;;;OAKG;IACH,OAAO,CAAC,MAAM,EAAE,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAE,QAAQ,EAAE,OAAO,GAAG,IAAI,CAAA;IAEpE;;;;;;OAMG;IACH,gBAAgB,CAAC,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,CAAC,GAAG,IAAI,EAAE,OAAO,EAAE,KAAK,IAAI,EAAE,OAAO,CAAC,EAAE,OAAO,GAAG,IAAI,CAAA;IAE5G;;;;;OAKG;IACH,mBAAmB,CAAC,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,CAAC,GAAG,IAAI,EAAE,OAAO,EAAE,KAAK,IAAI,GAAG,IAAI,CAAA;IAE5F;;;OAGG;IACH,QAAQ,CAAC,EAAE,EAAE,CAAC,GAAG,IAAI,EAAE,OAAO,EAAE,KAAK,IAAI,GAAG,IAAI,CAAA;IAEhD;;;;OAIG;IACH,UAAU,CAAC,EAAE,EAAE,OAAO,GAAG,OAAO,CAAA;IAEhC;;;;OAIG;IACH,WAAW,CAAC,EAAE,EAAE,OAAO,GAAG,OAAO,CAAA;IAEjC;;;;OAIG;IACH,aAAa,CAAC,QAAQ,EAAE,MAAM,GAAG,OAAO,CAAA;CACzC;AAMD;;;;;GAKG;AACH,MAAM,WAAW,gBAAgB;IAC/B;;;;;;;;OAQG;IACH,KAAK,CAAC,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,OAAO,GAAG,IAAI,CAAA;IAE7C;;;;;;;;OAQG;IACH,KAAK,CAAC,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,SAAS,CAAC,EAAE,OAAO,GAAG,IAAI,CAAA;IAElE;;;;;;;OAOG;IACH,OAAO,CAAC,KAAK,EAAE,KAAK,EAAE,SAAS,CAAC,EAAE,OAAO,GAAG,IAAI,CAAA;CACjD"}
@@ -1,74 +0,0 @@
1
- /**
2
- * abstract-renderer.ts - 抽象渲染器基类
3
- *
4
- * 提取 miniapp-renderer.ts 和 native-renderer.ts 中共享的
5
- * DOM 操作方法(insert / remove / replace / parentNode / nextSibling),
6
- * 避免代码重复。
7
- *
8
- * 两个渲染器的节点结构都包含 _parent 和 children 字段,
9
- * 因此这些树操作逻辑完全一致。
10
- */
11
- /**
12
- * 树节点接口 - 描述具有父子关系的通用节点结构
13
- *
14
- * MiniAppNode 和 NativeNode 都满足此接口。
15
- */
16
- export interface TreeNode {
17
- /** 子节点列表 */
18
- children: TreeNode[];
19
- /** 父节点引用(内部使用,不序列化) */
20
- _parent?: TreeNode;
21
- }
22
- /**
23
- * 插入子节点
24
- *
25
- * 将 child 插入到 parent 的子节点列表中。
26
- * 如果提供了 ref,则插入到 ref 之前;否则追加到末尾。
27
- * 会自动清除 child 的旧父节点引用。
28
- *
29
- * @param parent 父节点
30
- * @param child 子节点
31
- * @param ref 参考节点(插入到其前面),可选
32
- */
33
- export declare function insertChild(parent: TreeNode, child: TreeNode, ref?: TreeNode): void;
34
- /**
35
- * 移除节点
36
- *
37
- * 将 child 从其父节点的子节点列表中移除,
38
- * 并清除 child 的父节点引用。
39
- *
40
- * @param child 要移除的节点
41
- */
42
- export declare function removeChild(child: TreeNode): void;
43
- /**
44
- * 替换子节点
45
- *
46
- * 将 parent 子节点列表中的 oldChild 替换为 newChild。
47
- * 会自动更新父节点引用。
48
- *
49
- * @param parent 父节点
50
- * @param oldChild 被替换的旧节点
51
- * @param newChild 替换的新节点
52
- */
53
- export declare function replaceChild(parent: TreeNode, oldChild: TreeNode, newChild: TreeNode): void;
54
- /**
55
- * 获取父节点
56
- *
57
- * @param el 树节点
58
- * @returns 父节点,无父节点时返回 null
59
- */
60
- export declare function getParentNode(el: TreeNode): TreeNode | null;
61
- /**
62
- * 获取下一个兄弟节点
63
- *
64
- * @param el 树节点
65
- * @returns 下一个兄弟节点,无时返回 null
66
- */
67
- export declare function getNextSibling(el: TreeNode): TreeNode | null;
68
- /**
69
- * 在下一个微任务中执行回调
70
- *
71
- * @param cb 回调函数
72
- */
73
- export declare function nextTick(cb: Function): void;
74
- //# sourceMappingURL=abstract-renderer.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"abstract-renderer.d.ts","sourceRoot":"","sources":["../../../src/shared/abstract-renderer.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAEH;;;;GAIG;AACH,MAAM,WAAW,QAAQ;IACvB,YAAY;IACZ,QAAQ,EAAE,QAAQ,EAAE,CAAA;IACpB,uBAAuB;IACvB,OAAO,CAAC,EAAE,QAAQ,CAAA;CACnB;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,WAAW,CAAC,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,CAAC,EAAE,QAAQ,GAAG,IAAI,CAuBnF;AAED;;;;;;;GAOG;AACH,wBAAgB,WAAW,CAAC,KAAK,EAAE,QAAQ,GAAG,IAAI,CASjD;AAED;;;;;;;;;GASG;AACH,wBAAgB,YAAY,CAAC,MAAM,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ,GAAG,IAAI,CAS3F;AAED;;;;;GAKG;AACH,wBAAgB,aAAa,CAAC,EAAE,EAAE,QAAQ,GAAG,QAAQ,GAAG,IAAI,CAE3D;AAED;;;;;GAKG;AACH,wBAAgB,cAAc,CAAC,EAAE,EAAE,QAAQ,GAAG,QAAQ,GAAG,IAAI,CAO5D;AAED;;;;GAIG;AACH,wBAAgB,QAAQ,CAAC,EAAE,EAAE,QAAQ,GAAG,IAAI,CAE3C"}
@@ -1,267 +0,0 @@
1
- /**
2
- * Lyt.js 客户端注水(Hydration)
3
- *
4
- * 在服务端渲染(SSR)后,客户端需要将静态 HTML "激活"为可交互的应用。
5
- * 注水过程会对比服务端渲染的 DOM 与客户端 VNode,复用已有 DOM 节点,
6
- * 仅绑定事件和响应式数据,避免重新创建 DOM。
7
- *
8
- * 核心机制:
9
- * - hydrate(app, container) — 注水入口函数
10
- * - 对比 DOM 节点与 VNode 的类型和属性
11
- * - 复用匹配的 DOM 节点,绑定事件和响应式
12
- * - isHydrating 标记区分注水模式和首次渲染
13
- * - onHydrated 回调通知注水完成
14
- *
15
- * 注水流程:
16
- * 1. 遍历服务端渲染的 DOM 树
17
- * 2. 对比每个 DOM 节点与对应的客户端 VNode
18
- * 3. 如果匹配(标签名相同),复用 DOM 节点,绑定事件
19
- * 4. 如果不匹配,标记为 hydration mismatch(开发环境警告)
20
- * 5. 递归处理子节点
21
- * 6. 注水完成后触发 onHydrated 回调
22
- *
23
- * 支持的节点类型:
24
- * - Element:对比标签名,绑定事件,递归子节点
25
- * - Text:对比文本内容
26
- * - Comment:对比注释内容
27
- * - Fragment:直接注水子节点
28
- * - Component:递归注水组件 subTree
29
- *
30
- * Partial Hydration(Islands Architecture):
31
- * - hydrateIsland(selector, component) — 选择性注水特定 island
32
- * - createHydrationIsland(component, props) — 服务端生成 island HTML
33
- * - 支持 lazy hydration(IntersectionObserver / requestIdleCallback / interaction)
34
- * - 支持 hydration mismatch 检测(开发模式)
35
- */
36
- import type { VNode } from '@lytjs/vdom';
37
- /** 应用实例接口(简化版) */
38
- export interface App {
39
- /** 挂载函数 */
40
- mount: (container: Element) => void;
41
- /** 卸载函数 */
42
- unmount?: () => void;
43
- /** 根组件 */
44
- _component?: any;
45
- /** 根 VNode */
46
- _vnode?: VNode;
47
- }
48
- /** 注水选项 */
49
- export interface HydrateOptions {
50
- /** 注水完成后的回调 */
51
- onHydrated?: () => void;
52
- /** 是否在 mismatch 时抛出错误(默认 false,只警告) */
53
- strict?: boolean;
54
- }
55
- /** Partial Hydration 选项(Islands Architecture) */
56
- export interface HydrationOptions {
57
- /** 仅注水特定 island 元素 */
58
- hydrateIslands?: boolean;
59
- /** 懒注水:元素进入视口时才注水 */
60
- lazy?: boolean;
61
- /** 注水超时时间(毫秒) */
62
- timeout?: number;
63
- /** 注水完成回调 */
64
- onHydrated?: () => void;
65
- /** 是否在 mismatch 时抛出错误(默认 false,只警告) */
66
- strict?: boolean;
67
- /** 开发模式(启用 mismatch 检测和警告) */
68
- dev?: boolean;
69
- }
70
- /** 注水结果 */
71
- export interface HydrateResult {
72
- /** 是否成功 */
73
- success: boolean;
74
- /** mismatch 数量 */
75
- mismatches: number;
76
- /** 注水的节点数量 */
77
- hydratedNodes: number;
78
- }
79
- /**
80
- * 获取当前是否处于注水模式
81
- *
82
- * @returns 是否正在注水
83
- */
84
- export declare function isHydrating(): boolean;
85
- /**
86
- * 设置注水模式标记
87
- *
88
- * @param value 是否处于注水模式
89
- */
90
- export declare function setHydrating(value: boolean): void;
91
- /**
92
- * 获取注水统计信息
93
- *
94
- * @returns 注水结果统计
95
- */
96
- export declare function getHydrateStats(): HydrateResult;
97
- /**
98
- * 重置注水统计信息
99
- */
100
- export declare function resetHydrateStats(): void;
101
- /**
102
- * 注册注水完成回调
103
- *
104
- * @param cb 回调函数
105
- */
106
- export declare function onHydrated(cb: () => void): void;
107
- /**
108
- * 客户端注水函数
109
- *
110
- * 将服务端渲染的静态 HTML 激活为可交互的应用。
111
- * 对比 DOM 树与 VNode 树,复用已有 DOM 节点,仅绑定事件和响应式。
112
- *
113
- * @param app 应用实例
114
- * @param container 挂载容器(与服务端渲染的根元素对应)
115
- * @param options 注水选项
116
- * @returns 注水结果统计
117
- *
118
- * @example
119
- * // 服务端渲染的 HTML
120
- * // <div id="app"><h1>Hello</h1></div>
121
- *
122
- * // 客户端注水
123
- * import { createApp } from '@lytjs/core'
124
- * import { hydrate } from '@lytjs/renderer/ssr'
125
- * import App from './App'
126
- *
127
- * const app = createApp(App)
128
- * hydrate(app, document.getElementById('app')!, {
129
- * onHydrated: () => console.log('注水完成')
130
- * })
131
- */
132
- export declare function hydrate(app: App, container: Element, options?: HydrateOptions): HydrateResult;
133
- /**
134
- * 组件选项接口(用于 Island 注水)
135
- * 与 SSR 渲染器的 ComponentOptions 对齐
136
- */
137
- export interface ComponentOptions {
138
- /** 组件名称 */
139
- name?: string;
140
- /** setup 函数 */
141
- setup?: (...args: any[]) => any;
142
- /** render 函数 */
143
- render?: (...args: any[]) => VNode;
144
- /** props 定义 */
145
- props?: Record<string, any>;
146
- /** slots */
147
- slots?: Record<string, any>;
148
- /** 其他组件选项 */
149
- [key: string]: any;
150
- }
151
- /** Island 注水状态 */
152
- interface IslandState {
153
- /** island 标识符 */
154
- id: string;
155
- /** 是否已注水 */
156
- hydrated: boolean;
157
- /** 组件实例 */
158
- instance: any;
159
- /** 事件监听器(用于清理) */
160
- eventListeners: Array<{
161
- el: HTMLElement;
162
- event: string;
163
- handler: any;
164
- }>;
165
- /** 超时定时器 */
166
- timeoutId: ReturnType<typeof setTimeout> | null;
167
- /** IntersectionObserver 实例 */
168
- observer: IntersectionObserver | null;
169
- /** 交互事件监听器 */
170
- interactionHandler: (() => void) | null;
171
- }
172
- /**
173
- * 注水特定 island(Partial Hydration)
174
- *
175
- * 通过 CSS 选择器找到服务端渲染的 island 元素,
176
- * 解析其关联的 props JSON,创建组件实例并注水。
177
- *
178
- * @param selector CSS 选择器(匹配带 data-hydrate 属性的元素)
179
- * @param component 组件定义
180
- * @param options 注水选项
181
- * @returns 注水结果
182
- *
183
- * @example
184
- * // HTML: <div data-hydrate="counter" data-props="...">...</div>
185
- * // <script type="application/json" data-hydrate-props="counter">{"count":0}</script>
186
- * hydrateIsland('[data-hydrate="counter"]', CounterComponent)
187
- */
188
- export declare function hydrateIsland(selector: string, component: ComponentOptions, options?: HydrationOptions): HydrateResult;
189
- /**
190
- * 注水所有 island
191
- *
192
- * 查找页面上所有带 data-hydrate 属性的元素,逐一注水。
193
- * 需要提前通过 registerIslandComponent 注册组件映射。
194
- *
195
- * @param options 注水选项
196
- * @returns 注水结果汇总
197
- */
198
- export declare function hydrateAllIslands(options?: HydrationOptions): HydrateResult;
199
- /**
200
- * 注册 island 组件映射
201
- *
202
- * @param id island 标识符
203
- * @param component 组件定义
204
- */
205
- export declare function registerIslandComponent(id: string, component: ComponentOptions): void;
206
- /**
207
- * 卸载 island
208
- *
209
- * 清理 island 的所有资源(事件监听、Observer、定时器等)。
210
- *
211
- * @param islandId island 标识符
212
- */
213
- export declare function unmountIsland(islandId: string): void;
214
- /**
215
- * 获取 island 注册表(测试用)
216
- */
217
- export declare function getIslandRegistry(): Map<string, IslandState>;
218
- /**
219
- * 清空 island 注册表(测试用)
220
- */
221
- export declare function clearIslandRegistry(): void;
222
- /**
223
- * 创建 Hydration Island 的服务端 HTML
224
- *
225
- * 生成带有 data-hydrate 属性和序列化 props 的 HTML,
226
- * 以及关联的 `<script type="application/json">` props 标签。
227
- *
228
- * @param component 组件定义
229
- * @param props 组件 props
230
- * @param tag 包裹标签名(默认 "div")
231
- * @param hydrateWhen 注水策略("visible" | "idle" | "interaction")
232
- * @returns 完整的 island HTML 字符串
233
- *
234
- * @example
235
- * createHydrationIsland(
236
- * { name: 'counter', render: (props) => ({ type: 'span', ... }) },
237
- * { initialCount: 0 },
238
- * )
239
- * // → <div data-hydrate="counter" data-props="{&quot;initialCount&quot;:0}">
240
- * // <span>Count: 0</span>
241
- * // </div>
242
- * // <script type="application/json" data-hydrate-props="counter">
243
- * // {"initialCount":0}
244
- * // </script>
245
- */
246
- export declare function createHydrationIsland(component: ComponentOptions, props?: Record<string, any>, tag?: string, hydrateWhen?: string): string;
247
- /** Mismatch 警告信息 */
248
- interface MismatchWarning {
249
- /** island 标识符 */
250
- islandId: string;
251
- /** 期望的 HTML(客户端渲染) */
252
- expected: string;
253
- /** 实际的 HTML(服务端渲染) */
254
- actual: string;
255
- /** 修复建议 */
256
- suggestion: string;
257
- }
258
- /**
259
- * 获取所有 mismatch 警告(测试用)
260
- */
261
- export declare function getMismatchWarnings(): MismatchWarning[];
262
- /**
263
- * 清空 mismatch 警告(测试用)
264
- */
265
- export declare function clearMismatchWarnings(): void;
266
- export {};
267
- //# sourceMappingURL=hydration.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"hydration.d.ts","sourceRoot":"","sources":["../../../src/ssr/hydration.ts"],"names":[],"mappings":"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"}
@@ -1,15 +0,0 @@
1
- /**
2
- * Lyt.js SSR 渲染器 — 独立入口
3
- *
4
- * 仅包含服务端渲染(SSR)相关的 API。
5
- * 使用者可通过 `import '@lytjs/renderer/ssr'` 仅加载 SSR 渲染器。
6
- */
7
- export type { LytRenderer, RendererInstance } from '../renderer-interfaces';
8
- export type { VNode } from '../vnode';
9
- export { createRenderer, } from '../create-renderer';
10
- export { Fragment, Text, Comment, ShapeFlags, PatchFlags, } from '../vnode';
11
- export { StringRenderer, ssrRenderer, renderToString, renderToStream, renderToStreamGenerator } from './ssr-renderer';
12
- export type { SSRVNode, SSRTextVNode, ComponentOptions, RenderToStreamOptions } from './ssr-renderer';
13
- export { hydrate, isHydrating, setHydrating, onHydrated, getHydrateStats, resetHydrateStats, hydrateIsland, hydrateAllIslands, createHydrationIsland, registerIslandComponent, unmountIsland, getIslandRegistry, clearIslandRegistry, getMismatchWarnings, clearMismatchWarnings, } from './hydration';
14
- export type { HydrateOptions, HydrateResult, ComponentOptions as IslandComponentOptions } from './hydration';
15
- //# sourceMappingURL=index.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ssr/index.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAGH,YAAY,EAAE,WAAW,EAAE,gBAAgB,EAAE,MAAM,wBAAwB,CAAC;AAC5E,YAAY,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AAGtC,OAAO,EACL,cAAc,GACf,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EACL,QAAQ,EACR,IAAI,EACJ,OAAO,EACP,UAAU,EACV,UAAU,GACX,MAAM,UAAU,CAAC;AAGlB,OAAO,EAAE,cAAc,EAAE,WAAW,EAAE,cAAc,EAAE,cAAc,EAAE,uBAAuB,EAAE,MAAM,gBAAgB,CAAC;AACtH,YAAY,EAAE,QAAQ,EAAE,YAAY,EAAE,gBAAgB,EAAE,qBAAqB,EAAE,MAAM,gBAAgB,CAAC;AAGtG,OAAO,EACL,OAAO,EACP,WAAW,EACX,YAAY,EACZ,UAAU,EACV,eAAe,EACf,iBAAiB,EACjB,aAAa,EACb,iBAAiB,EACjB,qBAAqB,EACrB,uBAAuB,EACvB,aAAa,EACb,iBAAiB,EACjB,mBAAmB,EACnB,mBAAmB,EACnB,qBAAqB,GACtB,MAAM,aAAa,CAAC;AACrB,YAAY,EAAE,cAAc,EAAE,aAAa,EAAE,gBAAgB,IAAI,sBAAsB,EAAE,MAAM,aAAa,CAAC"}