@esportsplus/reactivity 0.28.2 → 0.29.0

package/build/compiler/array.js

@@ -14,11 +14,11 @@ function getElementTypeText(typeNode, sourceFile) {
     }
     return null;
 }
-function isReactiveCall(node) {
-    return ts.isIdentifier(node.expression) && node.expression.text === 'reactive';
-}
 function visit(ctx, node) {
-    if (ts.isCallExpression(node) && isReactiveCall(node) && node.arguments.length > 0) {
+    if (ts.isCallExpression(node) &&
+        ts.isIdentifier(node.expression) &&
+        node.expression.text === 'reactive' &&
+        node.arguments.length > 0) {
         let arg = node.arguments[0], expression = ts.isAsExpression(arg) ? arg.expression : arg;
         if (ts.isArrayLiteralExpression(expression)) {
             let elementType = null;
@@ -62,12 +62,12 @@ function visit(ctx, node) {
             }
         }
     }
-    let parent = node.parent;
     if (ts.isPropertyAccessExpression(node) &&
         node.name.text === 'length' &&
-        (!!parent && ((ts.isBinaryExpression(parent) && parent.left === node) ||
-            ts.isPostfixUnaryExpression(parent) ||
-            ts.isPrefixUnaryExpression(parent))) === false) {
+        (!node.parent ||
+            (!(ts.isBinaryExpression(node.parent) && node.parent.left === node) &&
+                !ts.isPostfixUnaryExpression(node.parent) &&
+                !ts.isPrefixUnaryExpression(node.parent)))) {
         let name = ast.getExpressionName(node.expression);
         if (name && ctx.bindings.get(name) === COMPILER_TYPES.Array) {
             ctx.replacements.push({
@@ -83,10 +83,10 @@ function visit(ctx, node) {
         if (name && ctx.bindings.get(name) === COMPILER_TYPES.Array) {
             ctx.replacements.push({
                 node,
-                generate: (sf) => {
-                    let index = element.argumentExpression.getText(sf), value = node.right.getText(sf);
-                    return `${element.expression.getText(sf)}.$set(${index}, ${value})`;
-                }
+                generate: (sf) => `${element.expression.getText(sf)}.$set(
+                    ${element.argumentExpression.getText(sf)},
+                    ${node.right.getText(sf)}
+                )`
             });
         }
     }

package/build/compiler/index.js

@@ -3,6 +3,7 @@ import { imports } from '@esportsplus/typescript/compiler';
 import { COMPILER_ENTRYPOINT, COMPILER_NAMESPACE, PACKAGE } from '../constants.js';
 import array from './array.js';
 import object from './object.js';
+import primitives from './primitives.js';
 function hasReactiveImport(sourceFile) {
     return imports.find(sourceFile, PACKAGE).some(i => i.specifiers.has(COMPILER_ENTRYPOINT));
 }
@@ -52,20 +53,21 @@ const plugin = {
         if (!hasReactiveImport(ctx.sourceFile)) {
             return {};
         }
-        let bindings = new Map(), importsIntent = [], prepend = [], replacements = [];
+        let bindings = new Map(), importsIntent = [], isReactiveCall = (node) => isReactiveCallExpression(ctx.checker, node), prepend = [], replacements = [];
+        replacements.push(...primitives(ctx.sourceFile, bindings, isReactiveCall, ctx.checker));
         let objectResult = object(ctx.sourceFile, bindings, ctx.checker);
         prepend.push(...objectResult.prepend);
-        replacements.push(...objectResult.replacements);
-        let arrayResult = array(ctx.sourceFile, bindings, ctx.checker);
-        replacements.push(...arrayResult);
+        replacements.push(...objectResult.replacements, ...array(ctx.sourceFile, bindings, ctx.checker));
         let transformedNodes = new Set(replacements.map(r => r.node));
         function findRemainingReactiveCalls(node) {
-            if (isReactiveCallExpression(ctx.checker, node) && !transformedNodes.has(node)) {
+            if (isReactiveCall(node)) {
                 let call = node;
-                replacements.push({
-                    generate: () => `${COMPILER_NAMESPACE}.reactive(${call.arguments.map(a => a.getText(ctx.sourceFile)).join(', ')})`,
-                    node: call
-                });
+                if (!transformedNodes.has(call) && !transformedNodes.has(call.expression)) {
+                    replacements.push({
+                        generate: () => `${COMPILER_NAMESPACE}.reactive(${call.arguments.map(a => a.getText(ctx.sourceFile)).join(', ')})`,
+                        node: call
+                    });
+                }
             }
             ts.forEachChild(node, findRemainingReactiveCalls);
         }

package/build/compiler/object.js

@@ -110,11 +110,8 @@ function isStaticValue(node) {
     }
     return false;
 }
-function isReactiveCall(node) {
-    return ts.isIdentifier(node.expression) && node.expression.text === "reactive";
-}
 function visit(ctx, node) {
-    if (ts.isCallExpression(node) && isReactiveCall(node)) {
+    if (ts.isCallExpression(node) && ts.isIdentifier(node.expression) && node.expression.text === 'reactive') {
         let arg = node.arguments[0];
         if (arg && ts.isObjectLiteralExpression(arg)) {
             let properties = [], props = arg.properties, varName = null;
@@ -164,11 +161,11 @@ export default (sourceFile, bindings, checker) => {
         let call = ctx.calls[i];
         prepend.push(buildClassCode(call.className, call.properties));
         replacements.push({
-            node: call.node,
             generate: () => ` new ${call.className}(${call.properties
                 .filter(({ isStatic, type }) => !isStatic || type === COMPILER_TYPES.Computed)
                 .map(p => p.valueText)
-                .join(', ')})`
+                .join(', ')})`,
+            node: call.node,
         });
     }
     return { prepend, replacements };

package/build/compiler/primitives.d.ts

@@ -0,0 +1,5 @@
+import type { ReplacementIntent } from '@esportsplus/typescript/compiler';
+import { ts } from '@esportsplus/typescript';
+import type { Bindings } from '../types.js';
+declare const _default: (sourceFile: ts.SourceFile, bindings: Bindings, isReactiveCall: (node: ts.Node) => boolean, checker?: ts.TypeChecker) => ReplacementIntent[];
+export default _default;

package/build/compiler/primitives.js

@@ -0,0 +1,181 @@
+import { ts } from '@esportsplus/typescript';
+import { COMPILER_NAMESPACE, COMPILER_TYPES } from '../constants.js';
+const COMPOUND_OPERATORS = new Map([
+    [ts.SyntaxKind.AmpersandAmpersandEqualsToken, '&&'],
+    [ts.SyntaxKind.AmpersandEqualsToken, '&'],
+    [ts.SyntaxKind.AsteriskAsteriskEqualsToken, '**'],
+    [ts.SyntaxKind.AsteriskEqualsToken, '*'],
+    [ts.SyntaxKind.BarBarEqualsToken, '||'],
+    [ts.SyntaxKind.BarEqualsToken, '|'],
+    [ts.SyntaxKind.CaretEqualsToken, '^'],
+    [ts.SyntaxKind.GreaterThanGreaterThanEqualsToken, '>>'],
+    [ts.SyntaxKind.GreaterThanGreaterThanGreaterThanEqualsToken, '>>>'],
+    [ts.SyntaxKind.LessThanLessThanEqualsToken, '<<'],
+    [ts.SyntaxKind.MinusEqualsToken, '-'],
+    [ts.SyntaxKind.PercentEqualsToken, '%'],
+    [ts.SyntaxKind.PlusEqualsToken, '+'],
+    [ts.SyntaxKind.QuestionQuestionEqualsToken, '??'],
+    [ts.SyntaxKind.SlashEqualsToken, '/']
+]);
+function isInScope(reference, binding) {
+    let current = reference;
+    while (current) {
+        if (current === binding.scope) {
+            return true;
+        }
+        current = current.parent;
+    }
+    return false;
+}
+function visit(ctx, node) {
+    if (ctx.isReactiveCall(node)) {
+        let call = node;
+        if (call.arguments.length > 0) {
+            let arg = call.arguments[0], classification = COMPILER_TYPES.Signal;
+            if (ts.isArrowFunction(arg) || ts.isFunctionExpression(arg)) {
+                classification = COMPILER_TYPES.Computed;
+            }
+            else if (ts.isArrayLiteralExpression(arg) || ts.isObjectLiteralExpression(arg)) {
+                classification = null;
+            }
+            if (classification) {
+                let varName = null;
+                if (call.parent && ts.isVariableDeclaration(call.parent) && ts.isIdentifier(call.parent.name)) {
+                    varName = call.parent.name.text;
+                }
+                else if (call.parent &&
+                    ts.isBinaryExpression(call.parent) &&
+                    call.parent.operatorToken.kind === ts.SyntaxKind.EqualsToken &&
+                    ts.isIdentifier(call.parent.left)) {
+                    varName = call.parent.left.text;
+                }
+                if (varName) {
+                    let current = call.parent, scope;
+                    while (current) {
+                        if (ts.isArrowFunction(current) ||
+                            ts.isBlock(current) ||
+                            ts.isForInStatement(current) ||
+                            ts.isForOfStatement(current) ||
+                            ts.isForStatement(current) ||
+                            ts.isFunctionDeclaration(current) ||
+                            ts.isFunctionExpression(current) ||
+                            ts.isSourceFile(current)) {
+                            scope = current;
+                        }
+                        current = current.parent;
+                    }
+                    if (!scope) {
+                        scope = call.getSourceFile();
+                    }
+                    ctx.scopedBindings.push({ name: varName, scope, type: classification });
+                    ctx.bindings.set(varName, classification);
+                }
+                ctx.replacements.push({
+                    generate: () => classification === COMPILER_TYPES.Computed
+                        ? `${COMPILER_NAMESPACE}.computed`
+                        : `${COMPILER_NAMESPACE}.signal`,
+                    node: call.expression
+                });
+            }
+        }
+    }
+    if (ts.isIdentifier(node) &&
+        node.parent &&
+        !(ts.isVariableDeclaration(node.parent) && node.parent.name === node)) {
+        if (ts.isPropertyAccessExpression(node.parent) && node.parent.name === node) {
+            ts.forEachChild(node, n => visit(ctx, n));
+            return;
+        }
+        let bindings = ctx.scopedBindings, binding, name = node.text;
+        for (let i = 0, n = bindings.length; i < n; i++) {
+            let b = bindings[i];
+            if (b.name === name && isInScope(node, b)) {
+                binding = b;
+            }
+        }
+        if (binding && node.parent) {
+            let parent = node.parent;
+            if (!(ts.isBinaryExpression(parent) &&
+                parent.operatorToken.kind === ts.SyntaxKind.EqualsToken &&
+                ctx.isReactiveCall(parent.right)) &&
+                !(ts.isTypeOfExpression(parent) && parent.expression === node)) {
+                let writeCtx;
+                if (ts.isBinaryExpression(parent) && parent.left === node) {
+                    let op = parent.operatorToken.kind;
+                    if (op === ts.SyntaxKind.EqualsToken) {
+                        writeCtx = 'simple';
+                    }
+                    else if (COMPOUND_OPERATORS.has(op)) {
+                        writeCtx = 'compound';
+                    }
+                }
+                else if (ts.isPostfixUnaryExpression(parent) || ts.isPrefixUnaryExpression(parent)) {
+                    let op = parent.operator;
+                    if (op === ts.SyntaxKind.MinusMinusToken || op === ts.SyntaxKind.PlusPlusToken) {
+                        writeCtx = 'increment';
+                    }
+                }
+                if (writeCtx) {
+                    if (binding.type !== COMPILER_TYPES.Computed) {
+                        if (writeCtx === 'simple' && ts.isBinaryExpression(parent)) {
+                            let right = parent.right;
+                            ctx.replacements.push({
+                                generate: (sf) => `${COMPILER_NAMESPACE}.write(${name}, ${right.getText(sf)})`,
+                                node: parent
+                            });
+                        }
+                        else if (writeCtx === 'compound' && ts.isBinaryExpression(parent)) {
+                            let op = COMPOUND_OPERATORS.get(parent.operatorToken.kind) ?? '+', right = parent.right;
+                            ctx.replacements.push({
+                                generate: (sf) => `${COMPILER_NAMESPACE}.write(${name}, ${name}.value ${op} ${right.getText(sf)})`,
+                                node: parent
+                            });
+                        }
+                        else if (writeCtx === 'increment') {
+                            let delta = parent.operator === ts.SyntaxKind.PlusPlusToken ? '+ 1' : '- 1', isPrefix = ts.isPrefixUnaryExpression(parent);
+                            if (ts.isExpressionStatement(parent.parent)) {
+                                ctx.replacements.push({
+                                    generate: () => `${COMPILER_NAMESPACE}.write(${name}, ${name}.value ${delta})`,
+                                    node: parent
+                                });
+                            }
+                            else if (isPrefix) {
+                                ctx.replacements.push({
+                                    generate: () => `(${COMPILER_NAMESPACE}.write(${name}, ${name}.value ${delta}), ${name}.value)`,
+                                    node: parent
+                                });
+                            }
+                            else {
+                                let tmp = `_t${ctx.tmpCounter++}`;
+                                ctx.replacements.push({
+                                    generate: () => `((${tmp}) => (${COMPILER_NAMESPACE}.write(${name}, ${tmp} ${delta}), ${tmp}))(${name}.value)`,
+                                    node: parent
+                                });
+                            }
+                        }
+                    }
+                }
+                else {
+                    ctx.replacements.push({
+                        generate: () => `${COMPILER_NAMESPACE}.read(${name})`,
+                        node
+                    });
+                }
+            }
+        }
+    }
+    ts.forEachChild(node, n => visit(ctx, n));
+}
+export default (sourceFile, bindings, isReactiveCall, checker) => {
+    let ctx = {
+        bindings,
+        checker,
+        isReactiveCall,
+        replacements: [],
+        scopedBindings: [],
+        sourceFile,
+        tmpCounter: 0
+    };
+    visit(ctx, sourceFile);
+    return ctx.replacements;
+};

package/build/reactive/index.d.ts

@@ -8,5 +8,6 @@ type Guard<T> = T extends Record<PropertyKey, unknown> ? T extends {
 } : T : never;
 declare function reactive<T extends unknown[]>(input: T): Reactive<T>;
 declare function reactive<T extends Record<PropertyKey, unknown>>(input: Guard<T>): Reactive<T>;
+declare function reactive<T>(input: T): Reactive<T>;
 export default reactive;
 export { reactive, ReactiveArray, ReactiveObject };

package/package.json

@@ -31,7 +31,7 @@
   },
   "type": "module",
   "types": "build/index.d.ts",
-  "version": "0.28.2",
+  "version": "0.29.0",
   "scripts": {
     "build": "tsc",
     "build:test": "pnpm build && vite build --config test/vite.config.ts",

package/src/compiler/array.ts

@@ -31,12 +31,13 @@ function getElementTypeText(typeNode: ts.TypeNode, sourceFile: ts.SourceFile): s
     return null;
 }
 
-function isReactiveCall(node: ts.CallExpression): boolean {
-    return ts.isIdentifier(node.expression) && node.expression.text === 'reactive';
-}
-
 function visit(ctx: VisitContext, node: ts.Node): void {
-    if (ts.isCallExpression(node) && isReactiveCall(node) && node.arguments.length > 0) {
+    if (
+        ts.isCallExpression(node) &&
+        ts.isIdentifier(node.expression) &&
+        node.expression.text === 'reactive' &&
+        node.arguments.length > 0
+    ) {
         let arg = node.arguments[0],
             expression = ts.isAsExpression(arg) ? arg.expression : arg;
 
@@ -94,16 +95,17 @@ function visit(ctx: VisitContext, node: ts.Node): void {
         }
     }
 
-    let parent = node.parent;
-
     if (
         ts.isPropertyAccessExpression(node) &&
         node.name.text === 'length' &&
-        (!!parent && (
-            (ts.isBinaryExpression(parent) && parent.left === node) ||
-            ts.isPostfixUnaryExpression(parent) ||
-            ts.isPrefixUnaryExpression(parent)
-        )) === false
+        (
+            !node.parent ||
+            (
+                !(ts.isBinaryExpression(node.parent) && node.parent.left === node) &&
+                !ts.isPostfixUnaryExpression(node.parent) &&
+                !ts.isPrefixUnaryExpression(node.parent)
+            )
+        )
     ) {
         let name = ast.getExpressionName(node.expression);
 
@@ -126,12 +128,10 @@ function visit(ctx: VisitContext, node: ts.Node): void {
         if (name && ctx.bindings.get(name) === COMPILER_TYPES.Array) {
             ctx.replacements.push({
                 node,
-                generate: (sf) => {
-                    let index = element.argumentExpression.getText(sf),
-                        value = node.right.getText(sf);
-
-                    return `${element.expression.getText(sf)}.$set(${index}, ${value})`;
-                }
+                generate: (sf) => `${element.expression.getText(sf)}.$set(
+                    ${element.argumentExpression.getText(sf)},
+                    ${node.right.getText(sf)}
+                )`
             });
         }
     }

package/src/compiler/index.ts

@@ -5,6 +5,7 @@ import { COMPILER_ENTRYPOINT, COMPILER_NAMESPACE, PACKAGE } from '~/constants';
 import type { Bindings } from '~/types';
 import array from './array';
 import object from './object';
+import primitives from './primitives';
 
 
 function hasReactiveImport(sourceFile: ts.SourceFile): boolean {
@@ -84,31 +85,33 @@ const plugin: Plugin = {
 
         let bindings: Bindings = new Map(),
             importsIntent: ImportIntent[] = [],
+            isReactiveCall = (node: ts.Node) => isReactiveCallExpression(ctx.checker, node),
             prepend: string[] = [],
             replacements: ReplacementIntent[] = [];
 
+        // Run primitives transform first (tracks bindings for signal/computed)
+        replacements.push(...primitives(ctx.sourceFile, bindings, isReactiveCall, ctx.checker));
+
         // Run object transform
         let objectResult = object(ctx.sourceFile, bindings, ctx.checker);
 
         prepend.push(...objectResult.prepend);
-        replacements.push(...objectResult.replacements);
-
-        // Run array transform
-        let arrayResult = array(ctx.sourceFile, bindings, ctx.checker);
-
-        replacements.push(...arrayResult);
+        replacements.push(...objectResult.replacements, ...array(ctx.sourceFile, bindings, ctx.checker));
 
         // Find remaining reactive() calls that weren't transformed and replace with namespace version
         let transformedNodes = new Set(replacements.map(r => r.node));
 
         function findRemainingReactiveCalls(node: ts.Node): void {
-            if (isReactiveCallExpression(ctx.checker, node) && !transformedNodes.has(node)) {
-                let call = node;
-
-                replacements.push({
-                    generate: () => `${COMPILER_NAMESPACE}.reactive(${call.arguments.map(a => a.getText(ctx.sourceFile)).join(', ')})`,
-                    node: call
-                });
+            if (isReactiveCall(node)) {
+                let call = node as ts.CallExpression;
+
+                // Check if call or its expression has already been transformed
+                if (!transformedNodes.has(call) && !transformedNodes.has(call.expression)) {
+                    replacements.push({
+                        generate: () => `${COMPILER_NAMESPACE}.reactive(${call.arguments.map(a => a.getText(ctx.sourceFile)).join(', ')})`,
+                        node: call
+                    });
+                }
             }
 
             ts.forEachChild(node, findRemainingReactiveCalls);

package/src/compiler/object.ts

@@ -166,12 +166,8 @@ function isStaticValue(node: ts.Node): boolean {
     return false;
 }
 
-function isReactiveCall(node: ts.CallExpression): boolean {
-    return ts.isIdentifier(node.expression) && node.expression.text === "reactive";
-}
-
 function visit(ctx: VisitContext, node: ts.Node): void {
-    if (ts.isCallExpression(node) && isReactiveCall(node)) {
+    if (ts.isCallExpression(node) && ts.isIdentifier(node.expression) && node.expression.text === 'reactive') {
         let arg = node.arguments[0];
 
         if (arg && ts.isObjectLiteralExpression(arg)) {
@@ -246,15 +242,14 @@ export default (sourceFile: ts.SourceFile, bindings: Bindings, checker?: ts.Type
         let call = ctx.calls[i];
 
         prepend.push(buildClassCode(call.className, call.properties));
-
         replacements.push({
-            node: call.node,
             generate: () => ` new ${call.className}(${
                 call.properties
-                    .filter(({ isStatic, type }) => !isStatic || type === COMPILER_TYPES.Computed)
-                    .map(p => p.valueText)
-                    .join(', ')
-            })`
+                .filter(({ isStatic, type }) => !isStatic || type === COMPILER_TYPES.Computed)
+                .map(p => p.valueText)
+                .join(', ')
+            })`,
+            node: call.node,
         });
     }
 

package/src/compiler/primitives.ts

@@ -0,0 +1,261 @@
+import type { ReplacementIntent } from '@esportsplus/typescript/compiler';
+import { ts } from '@esportsplus/typescript';
+import { COMPILER_NAMESPACE, COMPILER_TYPES } from '~/constants';
+import type { Bindings } from '~/types';
+
+
+interface ScopeBinding {
+    name: string;
+    scope: ts.Node;
+    type: COMPILER_TYPES;
+}
+
+interface TransformContext {
+    bindings: Bindings;
+    checker?: ts.TypeChecker;
+    isReactiveCall: (node: ts.Node) => boolean;
+    replacements: ReplacementIntent[];
+    scopedBindings: ScopeBinding[];
+    sourceFile: ts.SourceFile;
+    tmpCounter: number;
+}
+
+
+const COMPOUND_OPERATORS = new Map<ts.SyntaxKind, string>([
+    [ts.SyntaxKind.AmpersandAmpersandEqualsToken, '&&'],
+    [ts.SyntaxKind.AmpersandEqualsToken, '&'],
+    [ts.SyntaxKind.AsteriskAsteriskEqualsToken, '**'],
+    [ts.SyntaxKind.AsteriskEqualsToken, '*'],
+    [ts.SyntaxKind.BarBarEqualsToken, '||'],
+    [ts.SyntaxKind.BarEqualsToken, '|'],
+    [ts.SyntaxKind.CaretEqualsToken, '^'],
+    [ts.SyntaxKind.GreaterThanGreaterThanEqualsToken, '>>'],
+    [ts.SyntaxKind.GreaterThanGreaterThanGreaterThanEqualsToken, '>>>'],
+    [ts.SyntaxKind.LessThanLessThanEqualsToken, '<<'],
+    [ts.SyntaxKind.MinusEqualsToken, '-'],
+    [ts.SyntaxKind.PercentEqualsToken, '%'],
+    [ts.SyntaxKind.PlusEqualsToken, '+'],
+    [ts.SyntaxKind.QuestionQuestionEqualsToken, '??'],
+    [ts.SyntaxKind.SlashEqualsToken, '/']
+]);
+
+
+function isInScope(reference: ts.Node, binding: ScopeBinding): boolean {
+    let current: ts.Node | undefined = reference;
+
+    while (current) {
+        if (current === binding.scope) {
+            return true;
+        }
+
+        current = current.parent;
+    }
+
+    return false;
+}
+
+function visit(ctx: TransformContext, node: ts.Node): void {
+    if (ctx.isReactiveCall(node)) {
+        let call = node as ts.CallExpression;
+
+        if (call.arguments.length > 0) {
+            let arg = call.arguments[0],
+                classification: COMPILER_TYPES | null = COMPILER_TYPES.Signal;
+
+            if (ts.isArrowFunction(arg) || ts.isFunctionExpression(arg)) {
+                classification = COMPILER_TYPES.Computed;
+            }
+            else if (ts.isArrayLiteralExpression(arg) || ts.isObjectLiteralExpression(arg)) {
+                classification = null;
+            }
+
+            if (classification) {
+                let varName: string | null = null;
+
+                if (call.parent && ts.isVariableDeclaration(call.parent) && ts.isIdentifier(call.parent.name)) {
+                    varName = call.parent.name.text;
+                }
+                else if (
+                    call.parent &&
+                    ts.isBinaryExpression(call.parent) &&
+                    call.parent.operatorToken.kind === ts.SyntaxKind.EqualsToken &&
+                    ts.isIdentifier(call.parent.left)
+                ) {
+                    varName = call.parent.left.text;
+                }
+
+                if (varName) {
+                    let current = call.parent,
+                        scope;
+
+                    while (current) {
+                        if (
+                            ts.isArrowFunction(current) ||
+                            ts.isBlock(current) ||
+                            ts.isForInStatement(current) ||
+                            ts.isForOfStatement(current) ||
+                            ts.isForStatement(current) ||
+                            ts.isFunctionDeclaration(current) ||
+                            ts.isFunctionExpression(current) ||
+                            ts.isSourceFile(current)
+                        ) {
+                            scope = current;
+                        }
+
+                        current = current.parent;
+                    }
+
+                    if (!scope) {
+                        scope = call.getSourceFile();
+                    }
+
+                    ctx.scopedBindings.push({ name: varName, scope, type: classification });
+                    ctx.bindings.set(varName, classification);
+                }
+
+                // Replace just the 'reactive' identifier with the appropriate namespace function
+                ctx.replacements.push({
+                    generate: () => classification === COMPILER_TYPES.Computed
+                        ? `${COMPILER_NAMESPACE}.computed`
+                        : `${COMPILER_NAMESPACE}.signal`,
+                    node: call.expression
+                });
+
+                // Continue visiting children - inner identifiers will get their own ReplacementIntents
+            }
+        }
+    }
+
+    if (
+        ts.isIdentifier(node) &&
+        node.parent &&
+        !(ts.isVariableDeclaration(node.parent) && node.parent.name === node)
+    ) {
+        if (ts.isPropertyAccessExpression(node.parent) && node.parent.name === node) {
+            ts.forEachChild(node, n => visit(ctx, n));
+            return;
+        }
+
+        let bindings = ctx.scopedBindings,
+            binding,
+            name = node.text;
+
+        for (let i = 0, n = bindings.length; i < n; i++) {
+            let b = bindings[i];
+
+            if (b.name === name && isInScope(node, b)) {
+                binding = b;
+            }
+        }
+
+        if (binding && node.parent) {
+            let parent = node.parent;
+
+            if (
+                !(
+                    ts.isBinaryExpression(parent) &&
+                    parent.operatorToken.kind === ts.SyntaxKind.EqualsToken &&
+                    ctx.isReactiveCall(parent.right)
+                ) &&
+                !(ts.isTypeOfExpression(parent) && parent.expression === node)
+            ) {
+                let writeCtx;
+
+                if (ts.isBinaryExpression(parent) && parent.left === node) {
+                    let op = parent.operatorToken.kind;
+
+                    if (op === ts.SyntaxKind.EqualsToken) {
+                        writeCtx = 'simple';
+                    }
+                    else if (COMPOUND_OPERATORS.has(op)) {
+                        writeCtx = 'compound';
+                    }
+                }
+                else if (ts.isPostfixUnaryExpression(parent) || ts.isPrefixUnaryExpression(parent)) {
+                    let op = parent.operator;
+
+                    if (op === ts.SyntaxKind.MinusMinusToken || op === ts.SyntaxKind.PlusPlusToken) {
+                        writeCtx = 'increment';
+                    }
+                }
+
+                if (writeCtx) {
+                    if (binding.type !== COMPILER_TYPES.Computed) {
+                        if (writeCtx === 'simple' && ts.isBinaryExpression(parent)) {
+                            let right = parent.right;
+
+                            ctx.replacements.push({
+                                generate: (sf) => `${COMPILER_NAMESPACE}.write(${name}, ${right.getText(sf)})`,
+                                node: parent
+                            });
+                        }
+                        else if (writeCtx === 'compound' && ts.isBinaryExpression(parent)) {
+                            let op = COMPOUND_OPERATORS.get(parent.operatorToken.kind) ?? '+',
+                                right = parent.right;
+
+                            ctx.replacements.push({
+                                generate: (sf) => `${COMPILER_NAMESPACE}.write(${name}, ${name}.value ${op} ${right.getText(sf)})`,
+                                node: parent
+                            });
+                        }
+                        else if (writeCtx === 'increment') {
+                            let delta = (parent as ts.PostfixUnaryExpression | ts.PrefixUnaryExpression).operator === ts.SyntaxKind.PlusPlusToken ? '+ 1' : '- 1',
+                                isPrefix = ts.isPrefixUnaryExpression(parent);
+
+                            if (ts.isExpressionStatement(parent.parent)) {
+                                ctx.replacements.push({
+                                    generate: () => `${COMPILER_NAMESPACE}.write(${name}, ${name}.value ${delta})`,
+                                    node: parent
+                                });
+                            }
+                            else if (isPrefix) {
+                                ctx.replacements.push({
+                                    generate: () => `(${COMPILER_NAMESPACE}.write(${name}, ${name}.value ${delta}), ${name}.value)`,
+                                    node: parent
+                                });
+                            }
+                            else {
+                                let tmp = `_t${ctx.tmpCounter++}`;
+
+                                ctx.replacements.push({
+                                    generate: () => `((${tmp}) => (${COMPILER_NAMESPACE}.write(${name}, ${tmp} ${delta}), ${tmp}))(${name}.value)`,
+                                    node: parent
+                                });
+                            }
+                        }
+                    }
+                }
+                else {
+                    ctx.replacements.push({
+                        generate: () => `${COMPILER_NAMESPACE}.read(${name})`,
+                        node
+                    });
+                }
+            }
+        }
+    }
+
+    ts.forEachChild(node, n => visit(ctx, n));
+}
+
+
+export default (
+    sourceFile: ts.SourceFile,
+    bindings: Bindings,
+    isReactiveCall: (node: ts.Node) => boolean,
+    checker?: ts.TypeChecker
+) => {
+    let ctx: TransformContext = {
+            bindings,
+            checker,
+            isReactiveCall,
+            replacements: [],
+            scopedBindings: [],
+            sourceFile,
+            tmpCounter: 0
+        };
+
+    visit(ctx, sourceFile);
+
+    return ctx.replacements;
+};

package/src/reactive/index.ts

@@ -16,7 +16,8 @@ type Guard<T> =
 
 function reactive<T extends unknown[]>(input: T): Reactive<T>;
 function reactive<T extends Record<PropertyKey, unknown>>(input: Guard<T>): Reactive<T>;
-function reactive<T extends unknown[] | Record<PropertyKey, unknown>>(input: T): Reactive<T> {
+function reactive<T>(input: T): Reactive<T>;
+function reactive<T>(input: T): Reactive<T> {
     let dispose = false,
         value = root(() => {
             let response: Reactive<T> | undefined;
@@ -40,7 +41,7 @@ function reactive<T extends unknown[] | Record<PropertyKey, unknown>>(input: T):
         });
 
     if (dispose) {
-        onCleanup(() => value.dispose());
+        onCleanup(() => (value as any as { dispose: VoidFunction }).dispose());
     }
 
     return value;

package/test/primitives.ts

@@ -1,171 +1,87 @@
-// Test: Reactive Primitives (Standalone + Object-wrapped)
-import { effect, reactive } from '@esportsplus/reactivity';
+import { reactive } from '@esportsplus/reactivity';
 
 
-// =============================================================================
-// Standalone Signal Primitives
-// =============================================================================
-
-console.log('=== Standalone Signal Primitives ===');
-
+// Signal creation
 let count = reactive(0);
-let name = reactive('initial');
+let name = reactive('test');
 let flag = reactive(true);
+let nullable = reactive<string | null>(null);
 
-console.log('Initial count:', count);
-console.log('Initial name:', name);
-console.log('Initial flag:', flag);
+// Computed creation
+let doubled = reactive(() => count * 2);
+let greeting = reactive(() => `Hello ${name}!`);
+let complex = reactive(() => flag ? count : 0);
 
-// Simple assignment
+// Read access
+console.log(count);
+console.log(name);
+console.log(doubled);
+
+// Write access - simple assignment
 count = 10;
-name = 'updated';
+name = 'world';
 flag = false;
 
-console.log('After assignment - count:', count);
-console.log('After assignment - name:', name);
-console.log('After assignment - flag:', flag);
-
-
-// =============================================================================
-// Standalone Computed Primitives
-// =============================================================================
-
-console.log('\n=== Standalone Computed Primitives ===');
-
-let base = reactive(10);
-let doubled = reactive(() => base * 2);
-let quadrupled = reactive(() => doubled * 2);
-
-console.log('base:', base);
-console.log('doubled:', doubled);
-console.log('quadrupled:', quadrupled);
-
-base = 5;
-console.log('After base = 5:');
-console.log('  doubled:', doubled);
-console.log('  quadrupled:', quadrupled);
-
-
-// =============================================================================
-// Compound Assignments with Standalone Primitives
-// =============================================================================
-
-console.log('\n=== Compound Assignments ===');
-
-let value = reactive(10);
-
-value += 5;
-console.log('After += 5:', value);
-
-value -= 3;
-console.log('After -= 3:', value);
-
-value *= 2;
-console.log('After *= 2:', value);
-
-
-// =============================================================================
-// Increment/Decrement with Standalone Primitives
-// =============================================================================
-
-console.log('\n=== Increment/Decrement ===');
-
-let counter = reactive(0);
-
-counter++;
-console.log('After counter++:', counter);
-
-++counter;
-console.log('After ++counter:', counter);
-
-counter--;
-console.log('After counter--:', counter);
-
-
-// =============================================================================
-// Mixed Standalone and Object Primitives
-// =============================================================================
-
-console.log('\n=== Mixed Standalone and Object ===');
-
-let multiplier = reactive(2);
-
-let obj = reactive({
-    value: 10,
-    scaled: () => obj.value * multiplier
+// Compound assignment operators
+count += 5;
+count -= 2;
+count *= 3;
+count /= 2;
+count %= 7;
+count **= 2;
+count &= 0xFF;
+count |= 0x0F;
+count ^= 0xAA;
+count <<= 2;
+count >>= 1;
+count >>>= 1;
+count &&= 1;
+count ||= 0;
+count ??= 42;
+
+// Increment/decrement - statement context
+count++;
+count--;
+++count;
+--count;
+
+// Increment/decrement - expression context (prefix)
+let a = ++count;
+let b = --count;
+console.log(a, b);
+
+// Increment/decrement - expression context (postfix)
+let c = count++;
+let d = count--;
+console.log(c, d);
+
+// Nested reads in computed
+let x = reactive(1);
+let y = reactive(2);
+let sum = reactive(() => x + y);
+let product = reactive(() => x * y);
+let nested = reactive(() => sum + product);
+
+// Conditional reads
+let conditional = reactive(() => {
+    if (flag) {
+        return x + y;
+    }
+    return 0;
 });
 
-console.log('obj.value:', obj.value);
-console.log('obj.scaled:', obj.scaled);
-
-multiplier = 3;
-console.log('After multiplier = 3:');
-console.log('  obj.scaled:', obj.scaled);
-
-obj.value = 20;
-console.log('After obj.value = 20:');
-console.log('  obj.scaled:', obj.scaled);
-
-
-// =============================================================================
-// Effects with Standalone Primitives
-// =============================================================================
-
-console.log('\n=== Effects with Standalone Primitives ===');
-
-let effectCount = 0;
-let watched = reactive(0);
-
-let cleanup = effect(() => {
-    effectCount++;
-    console.log(`Effect #${effectCount}: watched = ${watched}`);
-});
-
-watched = 1;
-watched = 2;
-watched = 3;
-
-cleanup();
-
-watched = 4; // Should not trigger effect
-console.log('After cleanup, watched set to 4 (no effect should run)');
-console.log('Total effect runs:', effectCount);
-
-
-// =============================================================================
-// String Template Computeds
-// =============================================================================
-
-console.log('\n=== String Template Computeds ===');
-
-let firstName = reactive('John');
-let lastName = reactive('Doe');
-let fullName = reactive(() => `${firstName} ${lastName}`);
-
-console.log('Full name:', fullName);
-
-firstName = 'Jane';
-console.log('After firstName = Jane:', fullName);
-
-
-// =============================================================================
-// Object-wrapped Primitives (original tests)
-// =============================================================================
-
-console.log('\n=== Object-wrapped Primitives ===');
-
-let state = reactive({
-    count: 0,
-    flag: true,
-    name: 'initial'
-});
+// Function with reactive reads
+function calculate() {
+    return count + x + y;
+}
 
-console.log('Initial count:', state.count);
+// Arrow function with reactive reads
+const calc = () => count * 2;
 
-state.count = 10;
-state.name = 'updated';
-state.flag = false;
+// Reactive in loop
+for (let i = 0; i < 10; i++) {
+    count += i;
+}
 
-console.log('After assignment - count:', state.count);
-console.log('After assignment - name:', state.name);
-console.log('After assignment - flag:', state.flag);
+// Reassignment with new reactive
+count = reactive(100);