@pulse-js/react 0.1.9 → 0.3.0

package/dist/devtools.cjs

@@ -25,8 +25,13 @@ __export(devtools_exports, {
 module.exports = __toCommonJS(devtools_exports);
 var import_tools = require("@pulse-js/tools");
 var import_jsx_runtime = require("react/jsx-runtime");
-var import_meta = {};
-var isDev = typeof process !== "undefined" ? process.env.NODE_ENV === "development" : import_meta.env?.DEV || true;
+var isDev = (() => {
+  try {
+    return process.env.NODE_ENV === "development";
+  } catch (e) {
+    return true;
+  }
+})();
 if (isDev && typeof document !== "undefined") {
   if (!document.querySelector("pulse-inspector")) {
     const inspector = document.createElement("pulse-inspector");

package/dist/devtools.js

@@ -1,7 +1,13 @@
 // src/devtools.tsx
 import "@pulse-js/tools";
 import { jsx } from "react/jsx-runtime";
-var isDev = typeof process !== "undefined" ? process.env.NODE_ENV === "development" : import.meta.env?.DEV || true;
+var isDev = (() => {
+  try {
+    return process.env.NODE_ENV === "development";
+  } catch (e) {
+    return true;
+  }
+})();
 if (isDev && typeof document !== "undefined") {
   if (!document.querySelector("pulse-inspector")) {
     const inspector = document.createElement("pulse-inspector");

package/dist/index.cjs

@@ -22,7 +22,8 @@ var index_exports = {};
 __export(index_exports, {
   formatReason: () => formatReason,
   useGuard: () => useGuard,
-  usePulse: () => usePulse
+  usePulse: () => usePulse,
+  usePulseObject: () => usePulseObject
 });
 module.exports = __toCommonJS(index_exports);
 var import_react = require("react");
@@ -72,6 +73,16 @@ function useGuard(guard, options) {
   }
   return state;
 }
+function usePulseObject(pulseObj) {
+  if (isServer) {
+    return pulseObj.$snapshot();
+  }
+  return (0, import_react.useSyncExternalStore)(
+    pulseObj.$subscribe,
+    () => pulseObj,
+    () => pulseObj.$snapshot()
+  );
+}
 function formatReason(reason) {
   if (!reason) return "";
   if (typeof reason === "string") return reason;
@@ -81,5 +92,6 @@ function formatReason(reason) {
 0 && (module.exports = {
   formatReason,
   useGuard,
-  usePulse
+  usePulse,
+  usePulseObject
 });

package/dist/index.d.cts

@@ -1,4 +1,4 @@
-import { Source, Guard, GuardState } from '@pulse-js/core';
+import { Source, Guard, GuardState, PulseObject } from '@pulse-js/core';
 
 /**
  * Hook to consume a Pulse Unit (Source or Guard) in a React component.
@@ -44,6 +44,28 @@ interface UseGuardOptions {
  * const { ok, value, reason } = useGuard(authGuard, { suspend: true });
  */
 declare function useGuard<T>(guard: Guard<T>, options?: UseGuardOptions): GuardState<T>;
+/**
+ * Hook for Pulse Objects (v2 Proxy-based reactive objects).
+ *
+ * Returns a snapshot of the reactive object that triggers re-renders
+ * when any property changes.
+ *
+ * @template T The type of the Pulse object.
+ * @param pulseObj A Pulse object created with pulse().
+ * @returns The current state of the object.
+ *
+ * @example
+ * ```tsx
+ * const auth = pulse({ user: null, loading: false });
+ *
+ * function Profile() {
+ *   const state = usePulseObject(auth);
+ *   if (state.loading) return <Spinner />;
+ *   return <div>{state.user?.name}</div>;
+ * }
+ * ```
+ */
+declare function usePulseObject<T extends object>(pulseObj: PulseObject<T>): T;
 /**
  * Formats a guard reason for display in React components.
  * Handles both string reasons and GuardReason objects.
@@ -61,4 +83,4 @@ declare function formatReason(reason: string | {
     toString(): string;
 } | undefined): string;
 
-export { type UseGuardOptions, formatReason, useGuard, usePulse };
+export { type UseGuardOptions, formatReason, useGuard, usePulse, usePulseObject };

package/dist/index.d.ts

@@ -1,4 +1,4 @@
-import { Source, Guard, GuardState } from '@pulse-js/core';
+import { Source, Guard, GuardState, PulseObject } from '@pulse-js/core';
 
 /**
  * Hook to consume a Pulse Unit (Source or Guard) in a React component.
@@ -44,6 +44,28 @@ interface UseGuardOptions {
  * const { ok, value, reason } = useGuard(authGuard, { suspend: true });
  */
 declare function useGuard<T>(guard: Guard<T>, options?: UseGuardOptions): GuardState<T>;
+/**
+ * Hook for Pulse Objects (v2 Proxy-based reactive objects).
+ *
+ * Returns a snapshot of the reactive object that triggers re-renders
+ * when any property changes.
+ *
+ * @template T The type of the Pulse object.
+ * @param pulseObj A Pulse object created with pulse().
+ * @returns The current state of the object.
+ *
+ * @example
+ * ```tsx
+ * const auth = pulse({ user: null, loading: false });
+ *
+ * function Profile() {
+ *   const state = usePulseObject(auth);
+ *   if (state.loading) return <Spinner />;
+ *   return <div>{state.user?.name}</div>;
+ * }
+ * ```
+ */
+declare function usePulseObject<T extends object>(pulseObj: PulseObject<T>): T;
 /**
  * Formats a guard reason for display in React components.
  * Handles both string reasons and GuardReason objects.
@@ -61,4 +83,4 @@ declare function formatReason(reason: string | {
     toString(): string;
 } | undefined): string;
 
-export { type UseGuardOptions, formatReason, useGuard, usePulse };
+export { type UseGuardOptions, formatReason, useGuard, usePulse, usePulseObject };

package/dist/index.js

@@ -46,6 +46,16 @@ function useGuard(guard, options) {
   }
   return state;
 }
+function usePulseObject(pulseObj) {
+  if (isServer) {
+    return pulseObj.$snapshot();
+  }
+  return useSyncExternalStore(
+    pulseObj.$subscribe,
+    () => pulseObj,
+    () => pulseObj.$snapshot()
+  );
+}
 function formatReason(reason) {
   if (!reason) return "";
   if (typeof reason === "string") return reason;
@@ -54,5 +64,6 @@ function formatReason(reason) {
 export {
   formatReason,
   useGuard,
-  usePulse
+  usePulse,
+  usePulseObject
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pulse-js/react",
-  "version": "0.1.9",
+  "version": "0.3.0",
   "type": "module",
   "main": "dist/index.cjs",
   "module": "dist/index.js",
@@ -28,8 +28,8 @@
     "react": "^19.2.3"
   },
   "dependencies": {
-    "@pulse-js/core": "^0.2.1",
-    "@pulse-js/tools": "^0.1.8"
+    "@pulse-js/core": "^0.3.0",
+    "@pulse-js/tools": "^0.3.0"
   },
   "devDependencies": {
     "@types/bun": "latest",