@lytjs/core-signal 6.5.0 → 6.6.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 (4) hide show
  1. package/README.md +182 -182
  2. package/package.json +52 -52
  3. package/dist/index.d.cts +0 -60
  4. package/dist/index.d.ts +0 -60
package/README.md CHANGED
@@ -1,182 +1,182 @@
1
- # @lytjs/core-signal
2
-
3
- > LytJS 核心应用 API（Signal 渲染模式），适合细粒度响应式场景
4
-
5
- ## 安装
6
-
7
- ```bash
8
- npm install @lytjs/core-signal
9
- ```
10
-
11
- ## 与 @lytjs/core 的区别
12
-
13
- | 特性 | @lytjs/core-signal | @lytjs/core |
14
- | -------- | ------------------ | --------------------- |
15
- | 渲染模式 | 仅 Signal | VNode + Signal 双模式 |
16
- | 包体积 | 更小 | 完整功能 |
17
- | 适用场景 | 细粒度响应式应用 | 需要双模式切换的应用 |
18
- | 性能特点 | 细粒度更新 | 灵活选择 |
19
-
20
- ## 核心 API
21
-
22
- ### createApp
23
-
24
- 创建 Signal 模式应用实例：
25
-
26
- ```typescript
27
- import { createApp, defineComponent, signal } from '@lytjs/core-signal';
28
-
29
- const App = defineComponent({
30
- template: `
31
- <div>
32
- <p>Count: {{ count() }}</p>
33
- <button @click="increment">Increment</button>
34
- </div>
35
- `,
36
- setup() {
37
- const count = signal(0);
38
-
39
- const increment = () => {
40
- count.set(count() + 1);
41
- };
42
-
43
- return { count, increment };
44
- },
45
- });
46
-
47
- createApp(App).mount('#app');
48
- ```
49
-
50
- ### Signal API
51
-
52
- ```typescript
53
- import { signal, computed, writableComputedSignal } from '@lytjs/core-signal';
54
-
55
- // 创建 Signal
56
- const count = signal(0);
57
-
58
- // 读取值
59
- console.log(count()); // 0
60
-
61
- // 设置值
62
- count.set(10);
63
-
64
- // 通过 updater 更新
65
- count.update((v) => v + 1);
66
-
67
- // 计算 Signal
68
- const doubled = computed(() => count() * 2);
69
-
70
- // 可写计算 Signal
71
- const fullName = writableComputedSignal(
72
- () => `${firstName()} ${lastName()}`,
73
- (val) => {
74
- const [first, last] = val.split(' ');
75
- firstName.set(first);
76
- lastName.set(last);
77
- },
78
- );
79
- ```
80
-
81
- ### 批处理
82
-
83
- ```typescript
84
- import { signalBatch, signalUntrack } from '@lytjs/core-signal';
85
-
86
- // 批量更新
87
- signalBatch(() => {
88
- a.set(10);
89
- b.set(20);
90
- // 只触发一次通知
91
- });
92
-
93
- // 取消追踪
94
- const value = signalUntrack(() => a());
95
- ```
96
-
97
- ### 生命周期钩子
98
-
99
- ```typescript
100
- import {
101
- onMounted,
102
- onUnmounted,
103
- onUpdated,
104
- onBeforeMount,
105
- onBeforeUnmount,
106
- onBeforeUpdate,
107
- onErrorCaptured,
108
- } from '@lytjs/core-signal';
109
-
110
- const App = defineComponent({
111
- setup() {
112
- onMounted(() => {
113
- console.log('组件已挂载');
114
- });
115
-
116
- onUnmounted(() => {
117
- console.log('组件已卸载');
118
- });
119
-
120
- return () => {
121
- // Signal 渲染函数
122
- };
123
- },
124
- });
125
- ```
126
-
127
- ## 响应式 API
128
-
129
- 从 @lytjs/reactivity 重导出：
130
-
131
- ```typescript
132
- import {
133
- // Signal
134
- signal,
135
- computed,
136
- writableComputedSignal,
137
- readonlySignal,
138
- set,
139
- update,
140
- valueOf,
141
- signalBatch,
142
- signalUntrack,
143
- // Ref（与 Signal 互操作）
144
- ref,
145
- reactive,
146
- computed as computedRef,
147
- watch,
148
- watchEffect,
149
- } from '@lytjs/core-signal';
150
- ```
151
-
152
- ## Signal vs Ref
153
-
154
- | 特性 | Signal | Ref |
155
- | -------- | ----------------- | ---------------- |
156
- | 读取 | `count()` | `count.value` |
157
- | 写入 | `count.set()` | `count.value = ` |
158
- | 更新 | `count.update()` | 手动更新 |
159
- | 批量 | `signalBatch()` | `batch()` |
160
- | 取消追踪 | `signalUntrack()` | `untrack()` |
161
- | 适用 | 细粒度响应 | 对象响应式 |
162
-
163
- ## 类型定义
164
-
165
- ```typescript
166
- import type {
167
- App,
168
- AppConfig,
169
- Component,
170
- ComponentOptions,
171
- ComponentPublicInstance,
172
- Signal,
173
- ComputedSignal,
174
- WritableComputedSignal,
175
- } from '@lytjs/core-signal';
176
- ```
177
-
178
- ## 相关包
179
-
180
- - [@lytjs/core](../core) - 完整核心（支持双模式）
181
- - [@lytjs/core-vnode](../core-vnode) - 仅 VNode 模式
182
- - [@lytjs/reactivity](../reactivity) - 响应式系统实现
1
+ # @lytjs/core-signal
2
+
3
+ > LytJS 核心应用 API（Signal 渲染模式），适合细粒度响应式场景
4
+
5
+ ## 安装
6
+
7
+ ```bash
8
+ npm install @lytjs/core-signal
9
+ ```
10
+
11
+ ## 与 @lytjs/core 的区别
12
+
13
+ | 特性 | @lytjs/core-signal | @lytjs/core |
14
+ | -------- | ------------------ | --------------------- |
15
+ | 渲染模式 | 仅 Signal | VNode + Signal 双模式 |
16
+ | 包体积 | 更小 | 完整功能 |
17
+ | 适用场景 | 细粒度响应式应用 | 需要双模式切换的应用 |
18
+ | 性能特点 | 细粒度更新 | 灵活选择 |
19
+
20
+ ## 核心 API
21
+
22
+ ### createApp
23
+
24
+ 创建 Signal 模式应用实例：
25
+
26
+ ```typescript
27
+ import { createApp, defineComponent, signal } from '@lytjs/core-signal';
28
+
29
+ const App = defineComponent({
30
+ template: `
31
+ <div>
32
+ <p>Count: {{ count() }}</p>
33
+ <button @click="increment">Increment</button>
34
+ </div>
35
+ `,
36
+ setup() {
37
+ const count = signal(0);
38
+
39
+ const increment = () => {
40
+ count.set(count() + 1);
41
+ };
42
+
43
+ return { count, increment };
44
+ },
45
+ });
46
+
47
+ createApp(App).mount('#app');
48
+ ```
49
+
50
+ ### Signal API
51
+
52
+ ```typescript
53
+ import { signal, computed, writableComputedSignal } from '@lytjs/core-signal';
54
+
55
+ // 创建 Signal
56
+ const count = signal(0);
57
+
58
+ // 读取值
59
+ console.log(count()); // 0
60
+
61
+ // 设置值
62
+ count.set(10);
63
+
64
+ // 通过 updater 更新
65
+ count.update((v) => v + 1);
66
+
67
+ // 计算 Signal
68
+ const doubled = computed(() => count() * 2);
69
+
70
+ // 可写计算 Signal
71
+ const fullName = writableComputedSignal(
72
+ () => `${firstName()} ${lastName()}`,
73
+ (val) => {
74
+ const [first, last] = val.split(' ');
75
+ firstName.set(first);
76
+ lastName.set(last);
77
+ },
78
+ );
79
+ ```
80
+
81
+ ### 批处理
82
+
83
+ ```typescript
84
+ import { signalBatch, signalUntrack } from '@lytjs/core-signal';
85
+
86
+ // 批量更新
87
+ signalBatch(() => {
88
+ a.set(10);
89
+ b.set(20);
90
+ // 只触发一次通知
91
+ });
92
+
93
+ // 取消追踪
94
+ const value = signalUntrack(() => a());
95
+ ```
96
+
97
+ ### 生命周期钩子
98
+
99
+ ```typescript
100
+ import {
101
+ onMounted,
102
+ onUnmounted,
103
+ onUpdated,
104
+ onBeforeMount,
105
+ onBeforeUnmount,
106
+ onBeforeUpdate,
107
+ onErrorCaptured,
108
+ } from '@lytjs/core-signal';
109
+
110
+ const App = defineComponent({
111
+ setup() {
112
+ onMounted(() => {
113
+ console.log('组件已挂载');
114
+ });
115
+
116
+ onUnmounted(() => {
117
+ console.log('组件已卸载');
118
+ });
119
+
120
+ return () => {
121
+ // Signal 渲染函数
122
+ };
123
+ },
124
+ });
125
+ ```
126
+
127
+ ## 响应式 API
128
+
129
+ 从 @lytjs/reactivity 重导出：
130
+
131
+ ```typescript
132
+ import {
133
+ // Signal
134
+ signal,
135
+ computed,
136
+ writableComputedSignal,
137
+ readonlySignal,
138
+ set,
139
+ update,
140
+ valueOf,
141
+ signalBatch,
142
+ signalUntrack,
143
+ // Ref（与 Signal 互操作）
144
+ ref,
145
+ reactive,
146
+ computed as computedRef,
147
+ watch,
148
+ watchEffect,
149
+ } from '@lytjs/core-signal';
150
+ ```
151
+
152
+ ## Signal vs Ref
153
+
154
+ | 特性 | Signal | Ref |
155
+ | -------- | ----------------- | ---------------- |
156
+ | 读取 | `count()` | `count.value` |
157
+ | 写入 | `count.set()` | `count.value = ` |
158
+ | 更新 | `count.update()` | 手动更新 |
159
+ | 批量 | `signalBatch()` | `batch()` |
160
+ | 取消追踪 | `signalUntrack()` | `untrack()` |
161
+ | 适用 | 细粒度响应 | 对象响应式 |
162
+
163
+ ## 类型定义
164
+
165
+ ```typescript
166
+ import type {
167
+ App,
168
+ AppConfig,
169
+ Component,
170
+ ComponentOptions,
171
+ ComponentPublicInstance,
172
+ Signal,
173
+ ComputedSignal,
174
+ WritableComputedSignal,
175
+ } from '@lytjs/core-signal';
176
+ ```
177
+
178
+ ## 相关包
179
+
180
+ - [@lytjs/core](../core) - 完整核心（支持双模式）
181
+ - [@lytjs/core-vnode](../core-vnode) - 仅 VNode 模式
182
+ - [@lytjs/reactivity](../reactivity) - 响应式系统实现
package/package.json CHANGED
@@ -1,52 +1,52 @@
1
- {
2
- "name": "@lytjs/core-signal",
3
- "version": "6.5.0",
4
- "description": "Lyt.js Core - Signal rendering mode only",
5
- "type": "module",
6
- "main": "./dist/index.cjs",
7
- "module": "./dist/index.mjs",
8
- "types": "./dist/index.d.ts",
9
- "exports": {
10
- ".": {
11
- "types": "./dist/index.d.ts",
12
- "import": "./dist/index.mjs",
13
- "require": "./dist/index.cjs"
14
- }
15
- },
16
- "files": [
17
- "dist"
18
- ],
19
- "sideEffects": false,
20
- "scripts": {
21
- "build": "tsup",
22
- "dev": "tsup --watch"
23
- },
24
- "dependencies": {
25
- "@lytjs/component": "^6.4.0",
26
- "@lytjs/reactivity": "^6.4.0",
27
- "@lytjs/compiler": "^6.4.0",
28
- "@lytjs/renderer": "^6.4.0",
29
- "@lytjs/dom-runtime": "^6.4.0",
30
- "@lytjs/common-scheduler": "^6.4.0",
31
- "@lytjs/common-error": "^6.4.0",
32
- "@lytjs/shared-types": "^6.4.0"
33
- },
34
- "devDependencies": {
35
- "tsup": "^8.0.0",
36
- "typescript": "^5.4.0"
37
- },
38
- "license": "MIT",
39
- "repository": {
40
- "type": "git",
41
- "url": "https://gitee.com/lytjs/lytjs.git",
42
- "directory": "packages/core-signal"
43
- },
44
- "keywords": [
45
- "lytjs",
46
- "core",
47
- "signal",
48
- "createApp",
49
- "fine-grained",
50
- "reactive"
51
- ]
52
- }
1
+ {
2
+ "name": "@lytjs/core-signal",
3
+ "version": "6.6.0",
4
+ "description": "Lyt.js Core - Signal rendering mode only",
5
+ "type": "module",
6
+ "main": "./dist/index.cjs",
7
+ "module": "./dist/index.mjs",
8
+ "types": "./dist/index.d.ts",
9
+ "exports": {
10
+ ".": {
11
+ "types": "./dist/index.d.ts",
12
+ "import": "./dist/index.mjs",
13
+ "require": "./dist/index.cjs"
14
+ }
15
+ },
16
+ "files": [
17
+ "dist"
18
+ ],
19
+ "sideEffects": false,
20
+ "scripts": {
21
+ "build": "tsup",
22
+ "dev": "tsup --watch"
23
+ },
24
+ "dependencies": {
25
+ "@lytjs/component": "workspace:*",
26
+ "@lytjs/reactivity": "workspace:*",
27
+ "@lytjs/compiler": "workspace:*",
28
+ "@lytjs/renderer": "workspace:*",
29
+ "@lytjs/dom-runtime": "workspace:*",
30
+ "@lytjs/common-scheduler": "workspace:*",
31
+ "@lytjs/common-error": "workspace:*",
32
+ "@lytjs/shared-types": "workspace:*"
33
+ },
34
+ "devDependencies": {
35
+ "tsup": "^8.0.0",
36
+ "typescript": "^5.4.0"
37
+ },
38
+ "license": "MIT",
39
+ "repository": {
40
+ "type": "git",
41
+ "url": "https://gitee.com/lytjs/lytjs.git",
42
+ "directory": "packages/core-signal"
43
+ },
44
+ "keywords": [
45
+ "lytjs",
46
+ "core",
47
+ "signal",
48
+ "createApp",
49
+ "fine-grained",
50
+ "reactive"
51
+ ]
52
+ }
package/dist/index.d.cts DELETED
@@ -1,60 +0,0 @@
1
- import { BaseAppConfig, Directive, DebuggerEvent } from '@lytjs/shared-types';
2
- export { DebuggerEvent, Directive, DirectiveArguments, DirectiveBinding } from '@lytjs/shared-types';
3
- import { ComponentPublicInstance, ComponentOptions } from '@lytjs/component';
4
- export { ComponentOptions, ComponentPublicInstance, onBeforeMount, onBeforeUnmount, onErrorCaptured, onMounted, onUnmounted } from '@lytjs/component';
5
- export { nextTick } from '@lytjs/common-scheduler';
6
- export { ComputedSignal, ReadonlySignal, Signal, WritableSignal, computed, computedSignal, effect, reactive, readonlySignal, ref, set, signal, signalBatch, signalUntrack, update, valueOf, watch, watchEffect } from '@lytjs/reactivity';
7
- export { compile } from '@lytjs/compiler';
8
- export { CleanupFn, ReconcileOptions, addEventListener, batchDOM, bindEffect, createCleanupScope, createElement, createEventHandler, createTemplate, createTextNode, insert, onCleanup, reconcileArray, remove, removeAttribute, runCleanups, setAttribute, setClass, setHTML, setProperty, setStyle, setText, toggleClass } from '@lytjs/dom-runtime';
9
-
10
- /** 插件安装函数签名 */
11
- type PluginInstallFunction<T = unknown> = (app: App, ...options: T[]) => void;
12
- interface App<HostElement = Element> {
13
- config: AppConfig;
14
- use(plugin: Plugin | PluginInstallFunction, ...options: unknown[]): App;
15
- mount(rootContainer: HostElement | string): Promise<ComponentPublicInstance | null>;
16
- unmount(): void;
17
- provide<T = unknown>(key: string | symbol, value: T): App;
18
- inject<T = unknown>(key: string | symbol, defaultValue?: T): T;
19
- component(name: string, component: Component): App;
20
- directive(name: string, directive: Directive): App;
21
- mixin(mixin: ComponentOptions): App;
22
- errorHandler?: (err: unknown, instance: ComponentPublicInstance | null, info: string) => void;
23
- warnHandler?: (msg: string, instance: ComponentPublicInstance | null, trace: string) => void;
24
- }
25
- interface AppConfig extends BaseAppConfig {
26
- performance: boolean;
27
- globalProperties: Record<string, unknown>;
28
- isCustomElement?: (tag: string) => boolean;
29
- compilerOptions?: Record<string, unknown>;
30
- }
31
- /** createApp 的配置选项（Signal 模式固定使用 signal 渲染，忽略 rendererMode） */
32
- interface AppOptions {
33
- /** Signal 模式下此选项被忽略，始终使用 Signal 渲染 */
34
- rendererMode?: 'signal' | 'vapor';
35
- }
36
- interface Plugin {
37
- install: PluginInstallFunction;
38
- }
39
- /**
40
- * Signal 模式下的组件类型
41
- * 必须包含 template 属性，可选包含 data、setup、生命周期钩子
42
- */
43
- type Component = ComponentOptions & {
44
- template?: string;
45
- };
46
-
47
- type ErrorCapturedHook = (err: Error, instance: ComponentPublicInstance | null, info: string) => boolean | void;
48
- type DebuggerHook = (event: DebuggerEvent) => void;
49
-
50
- declare function createApp(rootComponent: Component, rootProps?: Record<string, unknown> | null, _options?: AppOptions): App;
51
-
52
- /**
53
- * 定义组件（re-export from @lytjs/component）
54
- *
55
- * Signal 模式下，组件应包含 template 属性。
56
- * defineComponent 主要用于类型标注和 IDE 提示。
57
- */
58
- declare const defineComponent: (options: ComponentOptions) => ComponentOptions;
59
-
60
- export { type App, type AppConfig, type AppOptions, type Component, type DebuggerHook, type ErrorCapturedHook, type Plugin, createApp, defineComponent };
package/dist/index.d.ts DELETED
@@ -1,60 +0,0 @@
1
- import { BaseAppConfig, Directive, DebuggerEvent } from '@lytjs/shared-types';
2
- export { DebuggerEvent, Directive, DirectiveArguments, DirectiveBinding } from '@lytjs/shared-types';
3
- import { ComponentPublicInstance, ComponentOptions } from '@lytjs/component';
4
- export { ComponentOptions, ComponentPublicInstance, onBeforeMount, onBeforeUnmount, onErrorCaptured, onMounted, onUnmounted } from '@lytjs/component';
5
- export { nextTick } from '@lytjs/common-scheduler';
6
- export { ComputedSignal, ReadonlySignal, Signal, WritableSignal, computed, computedSignal, effect, reactive, readonlySignal, ref, set, signal, signalBatch, signalUntrack, update, valueOf, watch, watchEffect } from '@lytjs/reactivity';
7
- export { compile } from '@lytjs/compiler';
8
- export { CleanupFn, ReconcileOptions, addEventListener, batchDOM, bindEffect, createCleanupScope, createElement, createEventHandler, createTemplate, createTextNode, insert, onCleanup, reconcileArray, remove, removeAttribute, runCleanups, setAttribute, setClass, setHTML, setProperty, setStyle, setText, toggleClass } from '@lytjs/dom-runtime';
9
-
10
- /** 插件安装函数签名 */
11
- type PluginInstallFunction<T = unknown> = (app: App, ...options: T[]) => void;
12
- interface App<HostElement = Element> {
13
- config: AppConfig;
14
- use(plugin: Plugin | PluginInstallFunction, ...options: unknown[]): App;
15
- mount(rootContainer: HostElement | string): Promise<ComponentPublicInstance | null>;
16
- unmount(): void;
17
- provide<T = unknown>(key: string | symbol, value: T): App;
18
- inject<T = unknown>(key: string | symbol, defaultValue?: T): T;
19
- component(name: string, component: Component): App;
20
- directive(name: string, directive: Directive): App;
21
- mixin(mixin: ComponentOptions): App;
22
- errorHandler?: (err: unknown, instance: ComponentPublicInstance | null, info: string) => void;
23
- warnHandler?: (msg: string, instance: ComponentPublicInstance | null, trace: string) => void;
24
- }
25
- interface AppConfig extends BaseAppConfig {
26
- performance: boolean;
27
- globalProperties: Record<string, unknown>;
28
- isCustomElement?: (tag: string) => boolean;
29
- compilerOptions?: Record<string, unknown>;
30
- }
31
- /** createApp 的配置选项（Signal 模式固定使用 signal 渲染，忽略 rendererMode） */
32
- interface AppOptions {
33
- /** Signal 模式下此选项被忽略，始终使用 Signal 渲染 */
34
- rendererMode?: 'signal' | 'vapor';
35
- }
36
- interface Plugin {
37
- install: PluginInstallFunction;
38
- }
39
- /**
40
- * Signal 模式下的组件类型
41
- * 必须包含 template 属性，可选包含 data、setup、生命周期钩子
42
- */
43
- type Component = ComponentOptions & {
44
- template?: string;
45
- };
46
-
47
- type ErrorCapturedHook = (err: Error, instance: ComponentPublicInstance | null, info: string) => boolean | void;
48
- type DebuggerHook = (event: DebuggerEvent) => void;
49
-
50
- declare function createApp(rootComponent: Component, rootProps?: Record<string, unknown> | null, _options?: AppOptions): App;
51
-
52
- /**
53
- * 定义组件（re-export from @lytjs/component）
54
- *
55
- * Signal 模式下，组件应包含 template 属性。
56
- * defineComponent 主要用于类型标注和 IDE 提示。
57
- */
58
- declare const defineComponent: (options: ComponentOptions) => ComponentOptions;
59
-
60
- export { type App, type AppConfig, type AppOptions, type Component, type DebuggerHook, type ErrorCapturedHook, type Plugin, createApp, defineComponent };