@pulse-js/react 0.1.0 → 0.1.1

package/README.md

@@ -1,79 +1,79 @@
-# @pulse-js/react
-
-React integration for the Pulse reactivity ecosystem. Provides hooks and utilities to consume Pulse Sources and Guards within React components efficiently.
-
-## Features
-
-- **Concurrent Mode Compatible**: Built with `useSyncExternalStore` for compatibility with React 18+ concurrent features.
-- **Zero Polling**: Logic driven by direct subscriptions to the Pulse core, ensuring updates happen exactly when state changes.
-- **Type Safety**: Full TypeScript support for inferred types from Sources and Guards.
-
-## Installation
-
-```bash
-npm install @pulse-js/react @pulse-js/core
-```
-
-## Usage
-
-The primary API is the `usePulse` hook. It adapts automatically depending on whether you pass it a Source or a Guard.
-
-### Using Sources
-
-When used with a **Source**, `usePulse` returns the current value and triggers a re-render whenever that value updates.
-
-```jsx
-import { source } from "@pulse-js/core";
-import { usePulse } from "@pulse-js/react";
-
-const counter = source(0);
-
-function Counter() {
-  const value = usePulse(counter);
-
-  return (
-    <button onClick={() => counter.update((n) => n + 1)}>Count: {value}</button>
-  );
-}
-```
-
-### Using Guards
-
-When used with a **Guard**, `usePulse` returns the complete `GuardState` object, which includes `status`, `value`, and `reason`. This allows you to handle loading and error states declaratively.
-
-```tsx
-import { guard } from "@pulse-js/core";
-import { usePulse } from "@pulse-js/react";
-
-const isAuthorized = guard("auth-check", async () => {
-  // ... async logic
-});
-
-function ProtectedRoute() {
-  const { status, reason } = usePulse(isAuthorized);
-
-  if (status === "pending") {
-    return <LoadingSpinner />;
-  }
-
-  if (status === "fail") {
-    return <AccessDenied message={reason} />;
-  }
-
-  return <AdminDashboard />;
-}
-```
-
-## API
-
-### `usePulse<T>(unit: PulseUnit<T>): T | GuardState<T>`
-
-- **Arguments**:
-  - `unit`: A Pulse Source or Guard.
-- **Returns**:
-  - For Sources: The inner value `T`.
-  - For Guards: An object `{ status: 'ok' | 'fail' | 'pending', value?: T, reason?: string }`.
-
-## Performance
-
-`@pulse-js/react` leverages modern React 18 patterns to ensure optimal performance. It avoids unnecessary re-renders by strictly tracking object references and using the `useSyncExternalStore` API to integrate with React's scheduling system.
+# @pulse-js/react
+
+React integration for the Pulse reactivity ecosystem. Provides hooks and utilities to consume Pulse Sources and Guards within React components efficiently.
+
+## Features
+
+- **Concurrent Mode Compatible**: Built with `useSyncExternalStore` for compatibility with React 18+ concurrent features.
+- **Zero Polling**: Logic driven by direct subscriptions to the Pulse core, ensuring updates happen exactly when state changes.
+- **Type Safety**: Full TypeScript support for inferred types from Sources and Guards.
+
+## Installation
+
+```bash
+npm install @pulse-js/react @pulse-js/core
+```
+
+## Usage
+
+The primary API is the `usePulse` hook. It adapts automatically depending on whether you pass it a Source or a Guard.
+
+### Using Sources
+
+When used with a **Source**, `usePulse` returns the current value and triggers a re-render whenever that value updates.
+
+```jsx
+import { source } from "@pulse-js/core";
+import { usePulse } from "@pulse-js/react";
+
+const counter = source(0);
+
+function Counter() {
+  const value = usePulse(counter);
+
+  return (
+    <button onClick={() => counter.update((n) => n + 1)}>Count: {value}</button>
+  );
+}
+```
+
+### Using Guards
+
+When used with a **Guard**, `usePulse` returns the complete `GuardState` object, which includes `status`, `value`, and `reason`. This allows you to handle loading and error states declaratively.
+
+```tsx
+import { guard } from "@pulse-js/core";
+import { usePulse } from "@pulse-js/react";
+
+const isAuthorized = guard("auth-check", async () => {
+  // ... async logic
+});
+
+function ProtectedRoute() {
+  const { status, reason } = usePulse(isAuthorized);
+
+  if (status === "pending") {
+    return <LoadingSpinner />;
+  }
+
+  if (status === "fail") {
+    return <AccessDenied message={reason} />;
+  }
+
+  return <AdminDashboard />;
+}
+```
+
+## API
+
+### `usePulse<T>(unit: PulseUnit<T>): T | GuardState<T>`
+
+- **Arguments**:
+  - `unit`: A Pulse Source or Guard.
+- **Returns**:
+  - For Sources: The inner value `T`.
+  - For Guards: An object `{ status: 'ok' | 'fail' | 'pending', value?: T, reason?: string }`.
+
+## Performance
+
+`@pulse-js/react` leverages modern React 18 patterns to ensure optimal performance. It avoids unnecessary re-renders by strictly tracking object references and using the `useSyncExternalStore` API to integrate with React's scheduling system.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pulse-js/react",
-  "version": "0.1.0",
+  "version": "0.1.1",
   "type": "module",
   "main": "dist/index.cjs",
   "module": "dist/index.js",
@@ -16,6 +16,11 @@
     "react": "^19.2.3"
   },
   "dependencies": {
-    "@pulse-js/core": "^0.1.0"
+    "@pulse-js/core": "^0.1.1"
+  },
+  "devDependencies": {
+    "@types/bun": "latest",
+    "@types/react": "^19.2.8",
+    "@types/react-dom": "^19.2.3"
   }
 }