@sigrea/vue 0.2.0 → 0.3.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 (7) hide show
  1. package/README.md +17 -20
  2. package/dist/index.cjs +5 -5
  3. package/dist/index.d.cts +3 -3
  4. package/dist/index.d.mts +3 -3
  5. package/dist/index.d.ts +3 -3
  6. package/dist/index.mjs +6 -6
  7. package/package.json +78 -70
package/README.md CHANGED
@@ -1,19 +1,19 @@
1
1
  # @sigrea/vue
2
2
 
3
- `@sigrea/vue` adapts [@sigrea/core](https://www.npmjs.com/package/@sigrea/core) logic modules and signals for Vue 3's Composition API. It aligns lifecycle scopes with component lifecycles, preserves deep reactivity, and provides composables for `<script setup>` and traditional setup functions.
3
+ `@sigrea/vue` adapts [@sigrea/core](https://www.npmjs.com/package/@sigrea/core) molecule modules and signals for Vue 3's Composition API. It aligns lifecycle scopes with component lifecycles, preserves deep reactivity, and provides composables for `<script setup>` and traditional setup functions.
4
4
 
5
5
  - **Signal subscriptions.** `useSignal` subscribes to signals and computed values, returning a readonly ref that updates when they change.
6
6
  - **Computed subscriptions.** `useComputed` subscribes to computed values, mirroring Vue's `computed` while tracking through Sigrea scopes.
7
7
  - **Deep signal subscriptions.** `useDeepSignal` subscribes to deep signal objects and exposes them as mutable refs with automatic cleanup.
8
8
  - **Two-way bindings.** `useMutableSignal` wraps primitive signals as `WritableComputedRef` for two-way bindings like `v-model`.
9
- - **Logic lifecycles.** `useLogic` mounts logic factories and binds their lifecycles to Vue components.
9
+ - **Molecule lifecycles.** `useMolcule` mounts molecule factories and binds their lifecycles to Vue components.
10
10
 
11
11
  ## Table of Contents
12
12
 
13
13
  - [Install](#install)
14
14
  - [Quick Start](#quick-start)
15
15
  - [Consume a Signal](#consume-a-signal)
16
- - [Bridge Framework-Agnostic Logic](#bridge-framework-agnostic-logic)
16
+ - [Bridge Framework-Agnostic Molecules](#bridge-framework-agnostic-molecules)
17
17
  - [Bind Writable Primitive Signals](#bind-writable-primitive-signals)
18
18
  - [Bind Deep Reactive Objects](#bind-deep-reactive-objects)
19
19
  - [API Reference](#api-reference)
@@ -21,7 +21,7 @@
21
21
  - [useComputed](#usecomputed)
22
22
  - [useDeepSignal](#usedeepsignal)
23
23
  - [useMutableSignal](#usemutablesignal)
24
- - [useLogic](#uselogic)
24
+ - [useMolcule](#usemolcule)
25
25
  - [Testing](#testing)
26
26
  - [Development](#development)
27
27
  - [License](#license)
@@ -52,13 +52,13 @@ const value = useSignal(count);
52
52
  </template>
53
53
  ```
54
54
 
55
- ### Bridge Framework-Agnostic Logic
55
+ ### Bridge Framework-Agnostic Molecules
56
56
 
57
57
  ```ts
58
- // CounterLogic.ts
59
- import { defineLogic, signal } from "@sigrea/core";
58
+ // CounterMolecule.ts
59
+ import { molecule, signal } from "@sigrea/core";
60
60
 
61
- export const CounterLogic = defineLogic<{ initialCount: number }>()((props) => {
61
+ export const CounterMolecule = molecule((props: { initialCount: number }) => {
62
62
  const count = signal(props.initialCount);
63
63
 
64
64
  const increment = () => {
@@ -76,11 +76,11 @@ export const CounterLogic = defineLogic<{ initialCount: number }>()((props) => {
76
76
  ```vue
77
77
  <!-- Counter.vue -->
78
78
  <script setup lang="ts">
79
- import { useLogic, useSignal } from "@sigrea/vue";
80
- import { CounterLogic } from "./CounterLogic";
79
+ import { useMolcule, useSignal } from "@sigrea/vue";
80
+ import { CounterMolecule } from "./CounterMolecule";
81
81
 
82
82
  const props = defineProps<{ initialCount: number }>();
83
- const counter = useLogic(CounterLogic, props);
83
+ const counter = useMolcule(CounterMolecule, props);
84
84
  const value = useSignal(counter.count);
85
85
  </script>
86
86
 
@@ -169,27 +169,24 @@ function useMutableSignal<T>(signal: Signal<T>): WritableComputedRef<T>
169
169
 
170
170
  Wraps a Sigrea signal as a Vue `WritableComputedRef` for two-way bindings like `v-model`. Expects a writable signal created by `signal()`. Passing a readonly signal throws at runtime.
171
171
 
172
- ### useLogic
172
+ ### useMolcule
173
173
 
174
174
  ```ts
175
- function useLogic<TReturn extends object, TProps = void>(
176
- logic: LogicFunction<TReturn, TProps>,
177
- ...args: LogicArgs<TProps>
178
- ): LogicInstance<TReturn>
175
+ function useMolcule<TReturn extends object, TProps = void>(
176
+ molecule: MoleculeFactory<TReturn, TProps>,
177
+ ...args: MoleculeArgs<TProps>
178
+ ): MoleculeInstance<TReturn>
179
179
  ```
180
180
 
181
- Mounts a logic factory and returns its LogicInstance. Sigrea augments the logic with lifecycle metadata: `onMount` callbacks run after the component mounts, and `onUnmount` callbacks run before it unmounts.
181
+ Mounts a molecule factory and returns its MoleculeInstance. Sigrea augments the molecule with lifecycle metadata: `onMount` callbacks run after the component mounts, and `onUnmount` callbacks run before it unmounts.
182
182
 
183
183
  ## Testing
184
184
 
185
185
  ```ts
186
186
  // tests/Counter.test.ts
187
187
  import { mount } from "@vue/test-utils";
188
- import { cleanupLogics } from "@sigrea/core";
189
188
  import Counter from "../components/Counter.vue";
190
189
 
191
- afterEach(() => cleanupLogics());
192
-
193
190
  it("increments and displays the updated count", async () => {
194
191
  const wrapper = mount(Counter, {
195
192
  props: { initialCount: 10 },
package/dist/index.cjs CHANGED
@@ -3,15 +3,15 @@
3
3
  const vue = require('vue');
4
4
  const core = require('@sigrea/core');
5
5
 
6
- function useLogic(logic, ...args) {
6
+ function useMolcule(molecule, ...args) {
7
7
  if (vue.getCurrentInstance() === null) {
8
8
  throw new Error(
9
- "useLogic can only be used within a Vue component setup()."
9
+ "useMolcule can only be used within a Vue component setup()."
10
10
  );
11
11
  }
12
- const instance = core.mountLogic(logic, ...args);
12
+ const instance = molecule(...args);
13
13
  vue.onScopeDispose(() => {
14
- core.cleanupLogic(instance);
14
+ core.disposeMolecule(instance);
15
15
  });
16
16
  return instance;
17
17
  }
@@ -85,7 +85,7 @@ function useMutableSignal(source) {
85
85
 
86
86
  exports.useComputed = useComputed;
87
87
  exports.useDeepSignal = useDeepSignal;
88
- exports.useLogic = useLogic;
88
+ exports.useMolcule = useMolcule;
89
89
  exports.useMutableSignal = useMutableSignal;
90
90
  exports.useSignal = useSignal;
91
91
  exports.useSnapshot = useSnapshot;
package/dist/index.d.cts CHANGED
@@ -1,8 +1,8 @@
1
- import { LogicFunction, LogicArgs, LogicInstance, Signal, ReadonlySignal, Computed, DeepSignal, SnapshotHandler } from '@sigrea/core';
1
+ import { MoleculeFactory, MoleculeArgs, MoleculeInstance, Signal, ReadonlySignal, Computed, DeepSignal, SnapshotHandler } from '@sigrea/core';
2
2
  import * as vue from 'vue';
3
3
  import { DeepReadonly, ShallowRef } from 'vue';
4
4
 
5
- declare function useLogic<TReturn extends object, TProps = void>(logic: LogicFunction<TReturn, TProps>, ...args: LogicArgs<TProps>): LogicInstance<TReturn>;
5
+ declare function useMolcule<TReturn extends object, TProps = void>(molecule: MoleculeFactory<TReturn, TProps>, ...args: MoleculeArgs<TProps>): MoleculeInstance<TReturn>;
6
6
 
7
7
  type ReadableSignal<T> = Signal<T> | ReadonlySignal<T>;
8
8
  declare function useSignal<T>(source: ReadableSignal<T>): Readonly<vue.Ref<vue.DeepReadonly<T>, vue.DeepReadonly<T>>>;
@@ -21,4 +21,4 @@ declare function useSnapshot<T>(handler: SnapshotHandler<T>, options: UseSnapsho
21
21
  mode: "mutable";
22
22
  }): ShallowRef<T>;
23
23
 
24
- export { useComputed, useDeepSignal, useLogic, useMutableSignal, useSignal, useSnapshot };
24
+ export { useComputed, useDeepSignal, useMolcule, useMutableSignal, useSignal, useSnapshot };
package/dist/index.d.mts CHANGED
@@ -1,8 +1,8 @@
1
- import { LogicFunction, LogicArgs, LogicInstance, Signal, ReadonlySignal, Computed, DeepSignal, SnapshotHandler } from '@sigrea/core';
1
+ import { MoleculeFactory, MoleculeArgs, MoleculeInstance, Signal, ReadonlySignal, Computed, DeepSignal, SnapshotHandler } from '@sigrea/core';
2
2
  import * as vue from 'vue';
3
3
  import { DeepReadonly, ShallowRef } from 'vue';
4
4
 
5
- declare function useLogic<TReturn extends object, TProps = void>(logic: LogicFunction<TReturn, TProps>, ...args: LogicArgs<TProps>): LogicInstance<TReturn>;
5
+ declare function useMolcule<TReturn extends object, TProps = void>(molecule: MoleculeFactory<TReturn, TProps>, ...args: MoleculeArgs<TProps>): MoleculeInstance<TReturn>;
6
6
 
7
7
  type ReadableSignal<T> = Signal<T> | ReadonlySignal<T>;
8
8
  declare function useSignal<T>(source: ReadableSignal<T>): Readonly<vue.Ref<vue.DeepReadonly<T>, vue.DeepReadonly<T>>>;
@@ -21,4 +21,4 @@ declare function useSnapshot<T>(handler: SnapshotHandler<T>, options: UseSnapsho
21
21
  mode: "mutable";
22
22
  }): ShallowRef<T>;
23
23
 
24
- export { useComputed, useDeepSignal, useLogic, useMutableSignal, useSignal, useSnapshot };
24
+ export { useComputed, useDeepSignal, useMolcule, useMutableSignal, useSignal, useSnapshot };
package/dist/index.d.ts CHANGED
@@ -1,8 +1,8 @@
1
- import { LogicFunction, LogicArgs, LogicInstance, Signal, ReadonlySignal, Computed, DeepSignal, SnapshotHandler } from '@sigrea/core';
1
+ import { MoleculeFactory, MoleculeArgs, MoleculeInstance, Signal, ReadonlySignal, Computed, DeepSignal, SnapshotHandler } from '@sigrea/core';
2
2
  import * as vue from 'vue';
3
3
  import { DeepReadonly, ShallowRef } from 'vue';
4
4
 
5
- declare function useLogic<TReturn extends object, TProps = void>(logic: LogicFunction<TReturn, TProps>, ...args: LogicArgs<TProps>): LogicInstance<TReturn>;
5
+ declare function useMolcule<TReturn extends object, TProps = void>(molecule: MoleculeFactory<TReturn, TProps>, ...args: MoleculeArgs<TProps>): MoleculeInstance<TReturn>;
6
6
 
7
7
  type ReadableSignal<T> = Signal<T> | ReadonlySignal<T>;
8
8
  declare function useSignal<T>(source: ReadableSignal<T>): Readonly<vue.Ref<vue.DeepReadonly<T>, vue.DeepReadonly<T>>>;
@@ -21,4 +21,4 @@ declare function useSnapshot<T>(handler: SnapshotHandler<T>, options: UseSnapsho
21
21
  mode: "mutable";
22
22
  }): ShallowRef<T>;
23
23
 
24
- export { useComputed, useDeepSignal, useLogic, useMutableSignal, useSignal, useSnapshot };
24
+ export { useComputed, useDeepSignal, useMolcule, useMutableSignal, useSignal, useSnapshot };
package/dist/index.mjs CHANGED
@@ -1,15 +1,15 @@
1
1
  import { getCurrentInstance, onScopeDispose, shallowRef, readonly, triggerRef, computed } from 'vue';
2
- import { mountLogic, cleanupLogic, createSignalHandler, createComputedHandler, createDeepSignalHandler } from '@sigrea/core';
2
+ import { disposeMolecule, createSignalHandler, createComputedHandler, createDeepSignalHandler } from '@sigrea/core';
3
3
 
4
- function useLogic(logic, ...args) {
4
+ function useMolcule(molecule, ...args) {
5
5
  if (getCurrentInstance() === null) {
6
6
  throw new Error(
7
- "useLogic can only be used within a Vue component setup()."
7
+ "useMolcule can only be used within a Vue component setup()."
8
8
  );
9
9
  }
10
- const instance = mountLogic(logic, ...args);
10
+ const instance = molecule(...args);
11
11
  onScopeDispose(() => {
12
- cleanupLogic(instance);
12
+ disposeMolecule(instance);
13
13
  });
14
14
  return instance;
15
15
  }
@@ -81,4 +81,4 @@ function useMutableSignal(source) {
81
81
  });
82
82
  }
83
83
 
84
- export { useComputed, useDeepSignal, useLogic, useMutableSignal, useSignal, useSnapshot };
84
+ export { useComputed, useDeepSignal, useMolcule, useMutableSignal, useSignal, useSnapshot };
package/package.json CHANGED
@@ -1,71 +1,79 @@
1
1
  {
2
- "name": "@sigrea/vue",
3
- "version": "0.2.0",
4
- "description": "Vue adapter bindings for Sigrea logic modules.",
5
- "license": "MIT",
6
- "type": "module",
7
- "publishConfig": {
8
- "access": "public"
9
- },
10
- "repository": {
11
- "type": "git",
12
- "url": "git+https://github.com/sigrea/vue.git"
13
- },
14
- "homepage": "https://github.com/sigrea/vue#readme",
15
- "bugs": {
16
- "url": "https://github.com/sigrea/vue/issues"
17
- },
18
- "engines": {
19
- "node": ">=20"
20
- },
21
- "sideEffects": false,
22
- "exports": {
23
- ".": {
24
- "types": "./dist/index.d.ts",
25
- "import": "./dist/index.mjs",
26
- "require": "./dist/index.cjs"
27
- }
28
- },
29
- "main": "./dist/index.cjs",
30
- "types": "./dist/index.d.ts",
31
- "files": [
32
- "dist"
33
- ],
34
- "keywords": [
35
- "signals",
36
- "reactivity",
37
- "vue",
38
- "logic",
39
- "typescript"
40
- ],
41
- "peerDependencies": {
42
- "@sigrea/core": "^0.3.1",
43
- "vue": "^3.4.0"
44
- },
45
- "devDependencies": {
46
- "@biomejs/biome": "1.9.4",
47
- "@vitejs/plugin-vue": "^5.1.4",
48
- "@vue/test-utils": "^2.4.0",
49
- "@vitest/coverage-v8": "^3.2.4",
50
- "changelogen": "^0.6.2",
51
- "lefthook": "1.13.6",
52
- "tsx": "^4.20.5",
53
- "typescript": "5.9.3",
54
- "unbuild": "3.6.1",
55
- "vite": "^5.4.6",
56
- "vitest": "^3.2.4",
57
- "vue": "^3.4.0",
58
- "jsdom": "^24.1.3"
59
- },
60
- "scripts": {
61
- "dev": "vite --config playground/vite.config.ts",
62
- "build": "unbuild",
63
- "changelog": "changelogen",
64
- "release": "pnpm test && pnpm build && changelogen --release",
65
- "test": "vitest run",
66
- "test:coverage": "vitest --coverage",
67
- "typecheck": "tsc -p tsconfig.json --noEmit",
68
- "format": "biome check .",
69
- "format:fix": "biome check --write ."
70
- }
71
- }
2
+ "name": "@sigrea/vue",
3
+ "version": "0.3.0",
4
+ "description": "Vue adapter bindings for Sigrea molecule modules.",
5
+ "license": "MIT",
6
+ "type": "module",
7
+ "packageManager": "pnpm@10.0.0",
8
+ "publishConfig": {
9
+ "access": "public"
10
+ },
11
+ "repository": {
12
+ "type": "git",
13
+ "url": "git+https://github.com/sigrea/vue.git"
14
+ },
15
+ "homepage": "https://github.com/sigrea/vue#readme",
16
+ "bugs": {
17
+ "url": "https://github.com/sigrea/vue/issues"
18
+ },
19
+ "engines": {
20
+ "node": ">=20"
21
+ },
22
+ "sideEffects": false,
23
+ "exports": {
24
+ ".": {
25
+ "types": "./dist/index.d.ts",
26
+ "import": "./dist/index.mjs",
27
+ "require": "./dist/index.cjs"
28
+ }
29
+ },
30
+ "main": "./dist/index.cjs",
31
+ "types": "./dist/index.d.ts",
32
+ "files": [
33
+ "dist"
34
+ ],
35
+ "keywords": [
36
+ "signals",
37
+ "reactivity",
38
+ "vue",
39
+ "molecule",
40
+ "typescript"
41
+ ],
42
+ "scripts": {
43
+ "dev": "vite --config playground/vite.config.ts",
44
+ "build": "unbuild",
45
+ "prepack": "unbuild",
46
+ "changelog": "changelogen",
47
+ "release": "pnpm test && pnpm build && changelogen --release",
48
+ "test": "vitest run",
49
+ "test:coverage": "vitest --coverage",
50
+ "typecheck": "tsc -p tsconfig.json --noEmit",
51
+ "format": "biome check .",
52
+ "format:fix": "biome check --write ."
53
+ },
54
+ "peerDependencies": {
55
+ "@sigrea/core": "^0.4.0",
56
+ "vue": "^3.4.0"
57
+ },
58
+ "devDependencies": {
59
+ "@biomejs/biome": "1.9.4",
60
+ "@vitejs/plugin-vue": "^5.1.4",
61
+ "@vue/test-utils": "^2.4.0",
62
+ "@vitest/coverage-v8": "^3.2.4",
63
+ "changelogen": "^0.6.2",
64
+ "lefthook": "1.13.6",
65
+ "tsx": "^4.20.5",
66
+ "typescript": "5.9.3",
67
+ "unbuild": "3.6.1",
68
+ "vite": "^5.4.6",
69
+ "vitest": "^3.2.4",
70
+ "vue": "^3.4.0",
71
+ "jsdom": "^24.1.3"
72
+ },
73
+ "pnpm": {
74
+ "onlyBuiltDependencies": [
75
+ "lefthook",
76
+ "@biomejs/biome"
77
+ ]
78
+ }
79
+ }