@view-models/react 1.1.0 → 1.2.0

package/dist/useModelState.d.ts

@@ -1,4 +1,37 @@
-import type { ViewModel, State } from "@view-models/core";
+/**
+ * Function that gets called when the state changes.
+ *
+ * @template T - The state type
+ * @param state - The new state
+ */
+export type ViewModelListener = () => void;
+export interface ViewModel<T> {
+    /**
+     * Subscribe to state changes.
+     *
+     * The listener will be called immediately after any state update.
+     *
+     * @param listener - Function to call when state changes
+     * @returns Function to unsubscribe the listener
+     *
+     * @example
+     * ```typescript
+     * const unsubscribe = viewModel.subscribe((state) => {
+     *   console.log('State changed:', state);
+     * });
+     *
+     * // Later, when you want to stop listening:
+     * unsubscribe();
+     * ```
+     */
+    subscribe(listener: ViewModelListener): () => void;
+    /**
+     * Get the current state.
+     *
+     * @returns The current state
+     */
+    get state(): T;
+}
 /**
  * A React hook that subscribes a component to a ViewModel's state updates.
  *
@@ -28,5 +61,5 @@ import type { ViewModel, State } from "@view-models/core";
  * }
  * ```
  */
-export declare function useModelState<T extends State>(model: ViewModel<T>): T;
+export declare function useModelState<T>(model: ViewModel<T>): T;
 //# sourceMappingURL=useModelState.d.ts.map

package/dist/useModelState.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useModelState.d.ts","sourceRoot":"","sources":["../src/useModelState.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAE1D;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,wBAAgB,aAAa,CAAC,CAAC,SAAS,KAAK,EAAE,KAAK,EAAE,SAAS,CAAC,CAAC,CAAC,GAAG,CAAC,CAErE"}
+{"version":3,"file":"useModelState.d.ts","sourceRoot":"","sources":["../src/useModelState.ts"],"names":[],"mappings":"AAEA;;;;;GAKG;AACH,MAAM,MAAM,iBAAiB,GAAG,MAAM,IAAI,CAAC;AAE3C,MAAM,WAAW,SAAS,CAAC,CAAC;IAC1B;;;;;;;;;;;;;;;;;OAiBG;IACH,SAAS,CAAC,QAAQ,EAAE,iBAAiB,GAAG,MAAM,IAAI,CAAC;IAEnD;;;;OAIG;IACH,IAAI,KAAK,IAAI,CAAC,CAAC;CAChB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,wBAAgB,aAAa,CAAC,CAAC,EAAE,KAAK,EAAE,SAAS,CAAC,CAAC,CAAC,GAAG,CAAC,CAEvD"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@view-models/react",
-  "version": "1.1.0",
+  "version": "1.2.0",
   "description": "React integration for @view-models/core",
   "type": "module",
   "main": "./dist/index.js",
@@ -45,13 +45,12 @@
     "node": ">=18.0.0"
   },
   "peerDependencies": {
-    "@view-models/core": "^1.1.0",
     "react": ">=17.0.0"
   },
   "devDependencies": {
     "@testing-library/react": "^16.1.0",
     "@types/react": "^18.3.18",
-    "@view-models/core": "^1.1.0",
+    "@view-models/core": "^2.0.0",
     "@vitest/coverage-v8": "^2.1.8",
     "jsdom": "^26.0.0",
     "prettier": "^3.4.2",

package/src/useModelState.ts

@@ -1,5 +1,41 @@
 import { useSyncExternalStore } from "react";
-import type { ViewModel, State } from "@view-models/core";
+
+/**
+ * Function that gets called when the state changes.
+ *
+ * @template T - The state type
+ * @param state - The new state
+ */
+export type ViewModelListener = () => void;
+
+export interface ViewModel<T> {
+  /**
+   * Subscribe to state changes.
+   *
+   * The listener will be called immediately after any state update.
+   *
+   * @param listener - Function to call when state changes
+   * @returns Function to unsubscribe the listener
+   *
+   * @example
+   * ```typescript
+   * const unsubscribe = viewModel.subscribe((state) => {
+   *   console.log('State changed:', state);
+   * });
+   *
+   * // Later, when you want to stop listening:
+   * unsubscribe();
+   * ```
+   */
+  subscribe(listener: ViewModelListener): () => void;
+
+  /**
+   * Get the current state.
+   *
+   * @returns The current state
+   */
+  get state(): T;
+}
 
 /**
  * A React hook that subscribes a component to a ViewModel's state updates.
@@ -30,6 +66,6 @@ import type { ViewModel, State } from "@view-models/core";
  * }
  * ```
  */
-export function useModelState<T extends State>(model: ViewModel<T>): T {
+export function useModelState<T>(model: ViewModel<T>): T {
   return useSyncExternalStore(model.subscribe.bind(model), () => model.state);
 }