@blac/react 2.0.0-rc-16 → 2.0.0-rc.1

package/dist/useExternalBlocStore.js

@@ -0,0 +1,93 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = useExternalBlocStore;
+const core_1 = require("@blac/core");
+const react_1 = require("react");
+/**
+ * Hook for using an external bloc store
+ * Provides low-level access to bloc instances for use with React's useSyncExternalStore
+ */
+function useExternalBlocStore(blocConstructor, options = {}) {
+    const ridRef = (0, react_1.useRef)(`external-${(0, core_1.generateUUID)()}`);
+    const usedKeysRef = (0, react_1.useRef)(new Set());
+    const usedClassPropKeysRef = (0, react_1.useRef)(new Set());
+    const instanceRef = (0, react_1.useRef)(null);
+    // Get or create bloc instance
+    const bloc = (0, react_1.useMemo)(() => {
+        const blac = core_1.Blac.getInstance();
+        const base = blocConstructor;
+        // For isolated blocs, always create a new instance
+        if (base.constructor.isolated ||
+            blocConstructor.isolated) {
+            const newBloc = new blocConstructor(options?.staticProps);
+            const uniqueId = options?.id || `${blocConstructor.name}_${(0, core_1.generateUUID)()}`;
+            newBloc._id = uniqueId;
+            blac.activateBloc(newBloc);
+            return newBloc;
+        }
+        // For shared blocs, use the existing getBloc logic
+        return blac.getBloc(blocConstructor, {
+            id: options?.id,
+            constructorParams: options?.staticProps,
+        });
+    }, [blocConstructor, options?.id]);
+    // Create external store interface
+    const externalStore = (0, react_1.useMemo)(() => ({
+        getSnapshot: () => {
+            const currentInstance = instanceRef.current;
+            return currentInstance ? currentInstance.state : undefined;
+        },
+        subscribe: (listener) => {
+            const currentInstance = instanceRef.current;
+            if (!currentInstance) {
+                // Return no-op unsubscribe if no instance
+                return () => { };
+            }
+            // Wrap listener to handle errors gracefully
+            const safeListener = (newState, oldState) => {
+                try {
+                    // Reset tracking keys on each listener call
+                    usedKeysRef.current.clear();
+                    usedClassPropKeysRef.current.clear();
+                    // Call selector if provided
+                    if (options.selector && currentInstance) {
+                        options.selector(newState, oldState, currentInstance);
+                    }
+                    // Call listener with state if it expects it
+                    if (listener.length > 0) {
+                        listener(newState);
+                    }
+                    else {
+                        listener();
+                    }
+                }
+                catch (error) {
+                    console.error('Listener error in useExternalBlocStore:', error);
+                    // Don't rethrow to prevent breaking other listeners
+                }
+            };
+            // Store the previous state for the listener
+            let previousState = currentInstance.state;
+            const unsubscribe = currentInstance.subscribe((state) => {
+                const oldState = previousState;
+                previousState = state;
+                safeListener(state, oldState);
+            });
+            return unsubscribe;
+        },
+        getServerSnapshot: () => {
+            const currentInstance = instanceRef.current;
+            return currentInstance ? currentInstance.state : undefined;
+        },
+    }), []);
+    // Update instance ref
+    instanceRef.current = bloc;
+    return {
+        externalStore,
+        instance: instanceRef,
+        usedKeys: usedKeysRef,
+        usedClassPropKeys: usedClassPropKeysRef,
+        rid: ridRef.current,
+    };
+}
+//# sourceMappingURL=useExternalBlocStore.js.map

package/dist/useExternalBlocStore.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useExternalBlocStore.js","sourceRoot":"","sources":["../src/useExternalBlocStore.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,14 +1,24 @@
 {
   "name": "@blac/react",
-  "version": "2.0.0-rc-16",
+  "version": "2.0.0-rc.1",
   "license": "MIT",
   "author": "Brendan Mullins <jsnanigans@gmail.com>",
-  "main": "src/index.ts",
-  "module": "src/index.ts",
-  "typings": "src/index.ts",
-  "types": "src/index.ts",
+  "main": "./dist/index.js",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": {
+        "development": "./src/index.ts",
+        "default": "./dist/index.js"
+      },
+      "require": "./dist/index.cjs",
+      "source": "./src/index.ts"
+    }
+  },
   "files": [
-    "src",
+    "dist",
     "README.md",
     "LICENSE"
   ],
@@ -26,10 +36,8 @@
   "dependencies": {},
   "peerDependencies": {
     "@types/react": "^18.0.0 || ^19.0.0",
-    "@types/react-dom": "^18.0.0 || ^19.0.0",
     "react": "^18.0.0 || ^19.0.0",
-    "react-dom": "^18.0.0 || ^19.0.0",
-    "@blac/core": "2.0.0-rc-15"
+    "@blac/core": "2.0.0-rc.1"
   },
   "peerDependenciesMeta": {
     "@types/react": {
@@ -55,10 +63,18 @@
     "react-dom": "^19.1.1",
     "typescript": "^5.9.2",
     "vitest": "^3.2.4",
-    "@blac/plugin-render-logging": "2.0.0-rc-15"
+    "@blac/plugin-render-logging": "2.0.0-rc.1",
+    "@blac/core": "2.0.0-rc.1"
   },
   "scripts": {
+    "dev": "tsc --watch --project tsconfig.build.json",
+    "build": "pnpm run clean && pnpm run build:esm && pnpm run build:cjs",
+    "build:esm": "tsc --project tsconfig.build.json",
+    "build:cjs": "tsc --project tsconfig.build.json --module commonjs --outDir dist --declaration false --declarationMap false && mv dist/index.js dist/index.cjs",
+    "clean": "rm -rf dist",
     "format": "prettier --write \".\"",
+    "lint": "eslint src --ext .ts,.tsx",
+    "lint:fix": "eslint src --ext .ts,.tsx --fix",
     "test": "vitest run --config vitest.config.ts",
     "test:watch": "vitest --watch --config vitest.config.ts",
     "typecheck": "tsc --noEmit",

package/src/__tests__/rerenderLogging.test.tsx

@@ -1,257 +0,0 @@
-import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest';
-import { renderHook, act } from '@testing-library/react';
-import { Blac, Cubit, RerenderLogger } from '@blac/core';
-import { RenderLoggingPlugin } from '@blac/plugin-render-logging';
-import useBloc from '../useBloc';
-
-class TestCubit extends Cubit<{ count: number; name: string }> {
-  constructor() {
-    super({ count: 0, name: 'test' });
-  }
-
-  increment = () => this.emit({ ...this.state, count: this.state.count + 1 });
-  changeName = (name: string) => this.emit({ ...this.state, name });
-  changeAll = () => this.emit({ count: this.state.count + 1, name: 'changed' });
-}
-
-describe('Rerender Logging', () => {
-  let consoleSpy: any;
-  let plugin: RenderLoggingPlugin;
-
-  beforeEach(() => {
-    Blac.resetInstance();
-    RerenderLogger.clear();
-    consoleSpy = {
-      log: vi.spyOn(console, 'log').mockImplementation(() => {}),
-      group: vi.spyOn(console, 'group').mockImplementation(() => {}),
-      groupEnd: vi.spyOn(console, 'groupEnd').mockImplementation(() => {}),
-      table: vi.spyOn(console, 'table').mockImplementation(() => {}),
-    };
-  });
-
-  afterEach(() => {
-    consoleSpy.log.mockRestore();
-    consoleSpy.group.mockRestore();
-    consoleSpy.groupEnd.mockRestore();
-    consoleSpy.table.mockRestore();
-    // Remove plugin if it was added
-    if (plugin) {
-      Blac.getInstance().plugins.remove(plugin.name);
-    }
-  });
-
-  it('should not log when rerender logging is disabled', () => {
-    // No plugin registered
-    const { result } = renderHook(() => useBloc(TestCubit));
-
-    act(() => {
-      result.current[1].increment();
-    });
-
-    expect(consoleSpy.log).not.toHaveBeenCalled();
-  });
-
-  it('should log rerenders when enabled with minimal level', () => {
-    plugin = new RenderLoggingPlugin({ enabled: true, level: 'minimal' });
-    Blac.getInstance().plugins.add(plugin);
-
-    const { result } = renderHook(() => useBloc(TestCubit));
-
-    // Clear logs from mount
-    consoleSpy.log.mockClear();
-
-    act(() => {
-      result.current[1].increment();
-    });
-
-    expect(consoleSpy.log).toHaveBeenCalled();
-    const logCall = consoleSpy.log.mock.calls[0][0];
-    expect(logCall).toContain('#2'); // Second render (first is mount)
-  });
-
-  it('should log state changes with normal level', () => {
-    plugin = new RenderLoggingPlugin({ enabled: true, level: 'normal' });
-    Blac.getInstance().plugins.add(plugin);
-
-    const { result } = renderHook(() => useBloc(TestCubit));
-
-    // Clear logs from mount
-    consoleSpy.log.mockClear();
-
-    act(() => {
-      result.current[1].increment();
-    });
-
-    expect(consoleSpy.log).toHaveBeenCalled();
-    const logCall = consoleSpy.log.mock.calls[0];
-    expect(logCall.join(' ')).toContain('State changed');
-    expect(logCall.join(' ')).toContain('(entire state)'); // Without proxy tracking individual properties
-  });
-
-  it('should log detailed information with detailed level', () => {
-    plugin = new RenderLoggingPlugin({ enabled: true, level: 'detailed' });
-    Blac.getInstance().plugins.add(plugin);
-
-    const { result } = renderHook(() => useBloc(TestCubit));
-
-    // Clear logs from mount
-    consoleSpy.log.mockClear();
-    consoleSpy.group.mockClear();
-    consoleSpy.table.mockClear();
-
-    act(() => {
-      result.current[1].increment();
-    });
-
-    expect(consoleSpy.group).toHaveBeenCalled();
-    expect(consoleSpy.table).toHaveBeenCalled();
-
-    const tableData = consoleSpy.table.mock.calls[0][0];
-    // Since we haven't accessed specific properties, it shows '(entire state)'
-    expect(tableData).toHaveProperty('(entire state)');
-    expect(tableData['(entire state)']).toHaveProperty('old');
-    expect(tableData['(entire state)']).toHaveProperty('new');
-  });
-
-  it('should track dependency changes when using manual dependencies', () => {
-    plugin = new RenderLoggingPlugin({ enabled: true, level: 'normal' });
-    Blac.getInstance().plugins.add(plugin);
-
-    let depValue = 1;
-    const { result, rerender } = renderHook(() =>
-      useBloc(TestCubit, {
-        dependencies: () => [depValue],
-      }),
-    );
-
-    // Clear logs from mount
-    consoleSpy.log.mockClear();
-
-    // Change dependency
-    depValue = 2;
-    rerender();
-
-    expect(consoleSpy.log).toHaveBeenCalled();
-    const logCall = consoleSpy.log.mock.calls[0];
-    const logMessage = logCall.join(' ');
-
-    // The plugin logs "Manual dependencies changed" in the description
-    expect(logMessage).toContain('Manual dependencies changed');
-    // Verify it's logged as a dependency change (check for the emoji)
-    expect(logMessage).toContain('🔗');
-  });
-
-  it('should respect filter function', () => {
-    plugin = new RenderLoggingPlugin({
-      enabled: true,
-      filter: ({ blocName }) => blocName !== 'TestCubit',
-    });
-    Blac.getInstance().plugins.add(plugin);
-
-    const { result } = renderHook(() => useBloc(TestCubit));
-
-    act(() => {
-      result.current[1].increment();
-    });
-
-    expect(consoleSpy.log).not.toHaveBeenCalled();
-  });
-
-  it('should group consecutive rerenders when groupRerenders is enabled', async () => {
-    plugin = new RenderLoggingPlugin({
-      enabled: true,
-      groupRerenders: true,
-    });
-    Blac.getInstance().plugins.add(plugin);
-
-    const { result } = renderHook(() => useBloc(TestCubit));
-
-    // Clear logs from mount
-    consoleSpy.log.mockClear();
-    consoleSpy.group.mockClear();
-
-    // Multiple rapid state changes - React may batch these
-    act(() => {
-      result.current[1].increment();
-    });
-
-    act(() => {
-      result.current[1].increment();
-    });
-
-    act(() => {
-      result.current[1].increment();
-    });
-
-    // Wait for debounce
-    await new Promise((resolve) => setTimeout(resolve, 100));
-
-    expect(consoleSpy.group).toHaveBeenCalled();
-    const groupCall = consoleSpy.group.mock.calls[0][0];
-    // Should have at least 2 renders (React may batch some updates)
-    expect(groupCall).toMatch(/rendered \d+ times/);
-    // Verify it grouped multiple renders
-    expect(
-      parseInt(groupCall.match(/rendered (\d+) times/)?.[1] || '0'),
-    ).toBeGreaterThanOrEqual(2);
-  });
-
-  it('should track multiple state properties changes', () => {
-    plugin = new RenderLoggingPlugin({ enabled: true, level: 'normal' });
-    Blac.getInstance().plugins.add(plugin);
-
-    const { result } = renderHook(() => useBloc(TestCubit));
-
-    // Clear logs from mount
-    consoleSpy.log.mockClear();
-
-    // Change all properties
-    act(() => {
-      result.current[1].changeAll();
-    });
-
-    expect(consoleSpy.log).toHaveBeenCalled();
-    const logCall = consoleSpy.log.mock.calls[0].join(' ');
-    expect(logCall).toContain('(entire state)'); // Without proxy tracking, all properties changed
-  });
-
-  it('should show mount reason for first render', () => {
-    plugin = new RenderLoggingPlugin({ enabled: true });
-    Blac.getInstance().plugins.add(plugin);
-
-    renderHook(() => useBloc(TestCubit));
-
-    expect(consoleSpy.log).toHaveBeenCalled();
-    const logCall = consoleSpy.log.mock.calls[0];
-    expect(logCall.join(' ')).toContain('mount');
-    expect(logCall.join(' ')).toContain('Component mounted');
-  });
-
-  it('should include stack trace in detailed mode when enabled', () => {
-    plugin = new RenderLoggingPlugin({
-      enabled: true,
-      level: 'detailed',
-      includeStackTrace: true,
-    });
-    Blac.getInstance().plugins.add(plugin);
-
-    const { result } = renderHook(() => useBloc(TestCubit));
-
-    // Clear logs from mount
-    consoleSpy.log.mockClear();
-    consoleSpy.group.mockClear();
-
-    act(() => {
-      result.current[1].increment();
-    });
-
-    // In detailed mode with stack trace, it logs the stack
-    const logCalls = consoleSpy.log.mock.calls;
-    const hasStackTrace = logCalls.some((call: any[]) =>
-      call.some(
-        (arg: any) => typeof arg === 'string' && arg.includes('Stack trace:'),
-      ),
-    );
-    expect(hasStackTrace).toBe(true);
-  });
-});