memorio 2.8.0 → 2.9.1

package/README.md

@@ -27,11 +27,14 @@
 - [Quick Start](#quick-start)
 - [API Reference](#api-reference)
   - [State Management](#state-management)
+  - [Observer](#observer)
   - [useObserver](#useobserver)
   - [Store](#store)
   - [Session](#session)
   - [Cache](#cache)
   - [idb](#idb)
+  - [DevTools](#devtools)
+  - [Logger](#logger)
 - [Testing](#testing)
 - [Security](#security)
 - [License](#license)
@@ -49,18 +52,8 @@
 - **Cross-platform**: Works in Browser, Node.js, Deno, and Edge Workers
 - **Session Isolation**: Each session/request gets isolated state namespace
 - **Context System**: Multi-tenant server-side isolation with `memorio.createContext()`
-
-## ⚠️ Enterprise Use
-
-For **enterprise-level applications** requiring advanced state management, we recommend using **[@biglogic/rgs](https://npmjs.com/package/@biglogic/rgs)** instead of Memorio.
-
-RGS provides:
-- Enhanced scalability for large applications
-- Advanced middleware support
-- Enterprise-grade security features
-- Professional support and maintenance
-
-Memorio is ideal for small to medium projects, prototypes, and learning purposes.
+- **DevTools**: Browser console debugging tools
+- **Logger**: Automatic logging of state changes
 
 ## Installation
 
@@ -76,16 +69,18 @@ npm i -D memorio
 - Cache operations tests
 - Observer pattern tests
 - useObserver pattern tests
+- DevTools tests
+- Logger tests
 
-Total: 28 tests passed across 5 test suites
+Total: 71 tests passed across 8 test suites
 
 ## Quick Start
 
 ```javascript
 /*
- IMPORTANT!
- Add import only at first start of your SPA. Became global!.
- You don't need to import any time you need to use memorio
+  IMPORTANT!
+  Add import only at first start of your SPA. Became global!.
+  You don't need to import any time you need to use memorio
 */
 
 import 'memorio';
@@ -97,20 +92,11 @@ state.name = "john";
 state.user = { name: 'John', age: 30 };
 state.hours = [2,3,10,23]
 
-// Observer Pattern
-// Example: if you change the state.counter you get a console.log
-observer(
-  'state.counter',
-    (newValue, oldValue) => {
-    console.log(`Counter changed from ${oldValue} to ${newValue}`);
-  }
-);
-
-// useObserver Pattern
+// useObserver Pattern for react app
 // Example: if you change the state.counter you get a console.log
 useObserver(
-    (newValue, oldValue) => {
-      console.log(`Counter changed from ${oldValue} to ${newValue}`);
+    () => {
+      console.log(`Counter changed to ${state.counter}`);
     },
     [state.counter]
 );
@@ -123,6 +109,12 @@ const preferences = store.get('preferences');
 // Session Storage
 session.set('token', 'user-jwt-token');
 const token = session.get('token');
+
+// DevTools
+memorio.devtools.inspect();
+
+// Logger
+memorio.logger.configure({ enabled: true, logToConsole: true })
 ```
 
 ## API Reference
@@ -146,44 +138,40 @@ state.remove('user');
 
 // Clearing all states
 state.removeAll();
-
 ```
 
-### Observer
-
-> ⚠️ **Deprecated**: For React applications, use [`useObserver`](#useobserver-pattern) instead. The `observer` function is kept for non-React contexts.
-
-## useObserver
+### useObserver
 
 useObserver is a React hook for observing Memorio state changes with auto-discovery:
 
 ```js
-
 // Basic useObserver - array syntax with state path
 useObserver(
-  (newValue, oldValue) => {
-    console.log('User updated:', newValue);
+  () => {
+    console.log('User updated:', state.user);
   },
   [state.user]
 );
 
 // Multiple states
 useObserver(
-  (newValue, oldValue) => {
-    console.log('State changed:', newValue);
+  () => {
+    console.log('States changed:', state.user, state.counter, state.settings);
   },
   [state.user, state.counter, state.settings]
 );
 
+// With options
+useObserver(
+  () => {
+    console.log('Value changed');
+  },
+  [state.value],
+  { immediate: true }
+);
 ```
 
-**Key differences from observer:**
-1. Uses **array syntax** `[state.property]` instead of string path `'state.property'`
-2. Automatically cleans up on component unmount
-3. Works only inside React components
-4. Callback receives `(newValue, oldValue)` parameters
-
-## Store
+### Store
 
 Persistent storage for your application:
 
@@ -202,9 +190,16 @@ const size = store.size();
 
 // Clearing store
 store.removeAll();
+
+// Check if using persistent storage
+if (store.isPersistent) {
+  console.log('Using real localStorage');
+} else {
+  console.log('Using memory fallback (server environment)');
+}
 ```
 
-## Session
+### Session
 
 Temporary storage that persists during page sessions:
 
@@ -228,9 +223,16 @@ session.remove('userSession');
 
 // Clearing all session data
 session.removeAll();
+
+// Check if using persistent storage
+if (session.isPersistent) {
+  console.log('Using real sessionStorage');
+} else {
+  console.log('Using memory fallback (server environment)');
+}
 ```
 
-## Cache
+### Cache
 
 In-memory cache for temporary data storage:
 
@@ -253,31 +255,31 @@ cache.removeAll();
 
 **Note:** Cache data is stored in memory and will be lost on page refresh.
 
-## idb
+### idb
 
 Permanent storage using browser database:
 
-### Create database
+#### Create database
 
 ```js
-idb.db.create("Database")
+idb.db.create("Database");
 ```
 
-### Set data into table
+#### Set data into table
 
 ```js
-idb.data.set("Database","table", { id: 1, data:{...} } )
+idb.data.set("Database","table", { id: 1, data:{...} } );
 ```
 
-### Get data from table
+#### Get data from table
 
 > [in development]
 
 ```js
-idb.data.get("Database","table", 1 )
+idb.data.get("Database","table", 1 );
 ```
 
-### Delete database / table
+#### Delete database / table
 
 > [in development]
 
@@ -286,19 +288,81 @@ idb.db.delete("Database") // Remove DB
 idb.table.delete("Database","table") // Remove only "table"
 ```
 
----
+### DevTools
+
+Browser console debugging tools for inspecting state, store, session, cache:
+
+```javascript
+// Inspect all state modules
+memorio.devtools.inspect();
+
+// Get statistics
+memorio.devtools.stats();
+
+// Clear specific module
+memorio.devtools.clear('state');
+
+// Clear all modules
+memorio.devtools.clearAll();
+
+// Watch a path for changes
+memorio.devtools.watch('state', 'user.name');
+
+// Export all data as JSON
+memorio.devtools.exportData();
+
+// Import data from JSON
+memorio.devtools.importData(jsonString);
+
+// Get help
+memorio.devtools.help();
+
+// Console shortcuts (available in browser console)
+$state  // globalThis.state
+$store  // globalThis.store
+$session // globalThis.session
+$cache  // globalThis.cache
+```
+
+### Logger
+
+Logging middleware for tracking all state changes:
+
+```javascript
+// Configure logger
+memorio.logger.configure({ enabled: true, logToConsole: true });
+
+// Enable/disable logging
+memorio.logger.enable();
+memorio.logger.disable();
+
+// Get log history
+memorio.logger.getHistory();
+
+// Get statistics
+memorio.logger.getStats();
+
+// Clear history
+memorio.logger.clearHistory();
+
+// Export logs as JSON
+memorio.logger.exportLogs();
+```
 
 ## Testing
 
-## Test suites are passing
+All test suites are passing:
 
 - Basic functionality tests
 - State management tests
 - Store operations tests
 - Cache operations tests
 - Observer pattern tests
+- useObserver pattern tests
+- DevTools tests
+- Logger tests
 
-Total: 25 tests passed across 5 test suites
+Total: 71 tests passed across 8 test suites
 
 ## Security
 
@@ -311,7 +375,7 @@ Security scans and reports are available at:
 
 MIT License
 
-Copyrigth (c) [Dario Passariello](https://dario.passariello.ca/)
+Copyright (c) [Dario Passariello](https://dario.passariello.ca/)
 
 ---
 
@@ -330,6 +394,8 @@ Memorio is designed to work across multiple JavaScript environments:
 | `store` | ✅ (localStorage) | ⚠️ (memory) | ⚠️ (memory) | ✅ (localStorage) |
 | `session` | ✅ (sessionStorage) | ⚠️ (memory) | ⚠️ (memory) | ✅ (sessionStorage) |
 | `idb` | ✅ | ❌ | ❌ | ⚠️ |
+| `devtools` | ✅ | ❌ | ❌ | ⚠️ |
+| `logger` | ✅ | ✅ | ✅ | ✅ |
 
 - ✅ Full support
 - ⚠️ Partial support (fallback to in-memory)