ccstate-vue 4.13.0 → 5.0.0

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # ccstate-vue
 
+## 5.0.0
+
+### Major Changes
+
+- 2fdba09: feat: provide watch method to replace sub
+
+### Minor Changes
+
+- 52c52fd: refactor: remove defaultStore
+
+### Patch Changes
+
+- Updated dependencies [2fdba09]
+- Updated dependencies [52c52fd]
+  - ccstate@5.0.0
+
 ## 4.13.0
 
 ### Patch Changes

package/dist/index.cjs

@@ -1,7 +1,6 @@
 'use strict';
 
 var vue = require('vue');
-var ccstate = require('ccstate');
 
 var StoreKey = Symbol('ccstate-vue-store');
 var provideStore = function provideStore(store) {
@@ -9,19 +8,17 @@ var provideStore = function provideStore(store) {
 };
 var useStore = function useStore() {
   return vue.inject(StoreKey, function () {
-    return ccstate.getDefaultStore();
+    throw new Error('useStore must be used within a provideStore');
   }, true);
 };
 
 function useGet(atom) {
   var store = useStore();
-  var initialValue = store.get(atom);
-  var vueState = vue.shallowRef(initialValue);
+  var vueState = vue.shallowRef(store.get(atom));
   var controller = new AbortController();
-  store.sub(atom, ccstate.command(function () {
-    var nextValue = store.get(atom);
-    vueState.value = nextValue;
-  }), {
+  store.watch(function (get) {
+    vueState.value = get(atom);
+  }, {
     signal: controller.signal
   });
   if (vue.getCurrentInstance()) {

package/dist/index.js

@@ -1,5 +1,4 @@
 import { provide, inject, shallowRef, getCurrentInstance, onScopeDispose, shallowReadonly } from 'vue';
-import { getDefaultStore, command } from 'ccstate';
 
 var StoreKey = Symbol('ccstate-vue-store');
 var provideStore = function provideStore(store) {
@@ -7,19 +6,17 @@ var provideStore = function provideStore(store) {
 };
 var useStore = function useStore() {
   return inject(StoreKey, function () {
-    return getDefaultStore();
+    throw new Error('useStore must be used within a provideStore');
   }, true);
 };
 
 function useGet(atom) {
   var store = useStore();
-  var initialValue = store.get(atom);
-  var vueState = shallowRef(initialValue);
+  var vueState = shallowRef(store.get(atom));
   var controller = new AbortController();
-  store.sub(atom, command(function () {
-    var nextValue = store.get(atom);
-    vueState.value = nextValue;
-  }), {
+  store.watch(function (get) {
+    vueState.value = get(atom);
+  }, {
     signal: controller.signal
   });
   if (getCurrentInstance()) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ccstate-vue",
-  "version": "4.13.0",
+  "version": "5.0.0",
   "description": "CCState Vue Hooks",
   "repository": {
     "type": "git",
@@ -20,7 +20,7 @@
     "vue": ">=3.2.0"
   },
   "dependencies": {
-    "ccstate": "^4.13.0"
+    "ccstate": "^5.0.0"
   },
   "devDependencies": {
     "@babel/preset-env": "^7.26.0",

package/src/__tests__/get-set.test.ts

@@ -2,7 +2,7 @@
 import '@testing-library/jest-dom/vitest';
 import { fireEvent, render, cleanup, screen } from '@testing-library/vue';
 import { afterEach, expect, it } from 'vitest';
-import { command, createStore, getDefaultStore, state } from 'ccstate';
+import { command, createStore, state } from 'ccstate';
 import { provideStore } from '../provider';
 import { useGet, useSet } from '..';
 
@@ -87,26 +87,24 @@ it('call command by useSet', async () => {
   expect(screen.getByText('Times clicked: 30')).toBeInTheDocument();
 });
 
-it('should use default store if no provider', () => {
+it('should throw error if no store provide', () => {
   const count$ = state(0);
-  getDefaultStore().set(count$, 10);
+  const store = createStore();
+  store.set(count$, 10);
 
   const Component = {
     setup() {
-      const count = useGet(count$);
-      return { count };
+      useGet(count$);
     },
     template: `
-    <div>
-      <p>{{ count }}</p>
-    </div>
+    <div></div>
   `,
   };
 
-  render({
-    components: { Component },
-    template: `<div><Component /></div>`,
-  });
-
-  expect(screen.getByText('10')).toBeInTheDocument();
+  expect(() => {
+    render({
+      components: { Component },
+      template: `<div><Component /></div>`,
+    });
+  }).toThrowError('useStore must be used within a provideStore');
 });

package/src/provider.ts

@@ -1,5 +1,4 @@
 import { inject, provide, type InjectionKey } from 'vue';
-import { getDefaultStore } from 'ccstate';
 import type { Store } from 'ccstate';
 
 export const StoreKey = Symbol('ccstate-vue-store') as InjectionKey<Store>;
@@ -12,7 +11,7 @@ export const useStore = (): Store => {
   return inject(
     StoreKey,
     () => {
-      return getDefaultStore();
+      throw new Error('useStore must be used within a provideStore');
     },
     true,
   );

package/src/useGet.ts

@@ -1,20 +1,17 @@
 import { getCurrentInstance, onScopeDispose, shallowReadonly, shallowRef, type ShallowRef } from 'vue';
 import { useStore } from './provider';
-import { command, type Computed, type State } from 'ccstate';
+import { type Computed, type State } from 'ccstate';
 
 export function useGet<Value>(atom: Computed<Value> | State<Value>): Readonly<ShallowRef<Value>> {
   const store = useStore();
-  const initialValue = store.get(atom);
 
-  const vueState = shallowRef(initialValue);
+  const vueState = shallowRef(store.get(atom));
 
   const controller = new AbortController();
-  store.sub(
-    atom,
-    command(() => {
-      const nextValue = store.get(atom);
-      vueState.value = nextValue;
-    }),
+  store.watch(
+    (get) => {
+      vueState.value = get(atom);
+    },
     {
       signal: controller.signal,
     },