@idealyst/theme 1.2.1 → 1.2.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@idealyst/theme",
-  "version": "1.2.1",
+  "version": "1.2.3",
   "description": "Theming system for Idealyst Framework",
   "readme": "README.md",
   "main": "src/index.ts",
@@ -56,6 +56,9 @@
     "prepublishOnly": "echo 'Publishing TypeScript source directly'",
     "publish:npm": "npm publish"
   },
+  "dependencies": {
+    "@idealyst/tooling": "workspace:*"
+  },
   "peerDependencies": {
     "react-native-unistyles": ">=3.0.0"
   },

package/src/babel/plugin.js

@@ -29,7 +29,19 @@
  *   }))
  */
 
-const { loadThemeKeys } = require('./theme-analyzer');
+// Theme analysis is provided by @idealyst/tooling (single source of truth)
+// This uses the TypeScript Compiler API for accurate theme extraction
+let loadThemeKeys;
+try {
+  // Try to load from @idealyst/tooling (TypeScript-based analyzer)
+  // This is the preferred path as it's the single source of truth
+  const tooling = require('@idealyst/tooling');
+  loadThemeKeys = tooling.loadThemeKeys;
+} catch (e) {
+  // Fallback to local implementation if tooling can't be loaded
+  // (e.g., when TypeScript runtime is not available)
+  loadThemeKeys = require('./theme-analyzer').loadThemeKeys;
+}
 
 // ============================================================================
 // Global Extension Registry - Persists across files during build
@@ -547,8 +559,7 @@ module.exports = function idealystStylesPlugin({ types: t }) {
         }
     }
 
-    // Log plugin initialization
-    console.log('[idealyst-plugin] Plugin loaded (AST-based theme analysis)');
+    // Plugin initialization logged in debug mode only
 
     return {
         name: 'idealyst-styles',
@@ -783,13 +794,13 @@ module.exports = function idealystStylesPlugin({ types: t }) {
                     const keys = loadThemeKeys(opts, rootDir, t, verboseMode);
                     const expandedVariants = [];
 
-                    // Debug for View only
-                    if (componentName === 'View') {
-                        console.log(`\n========== VIEW KEYS DEBUG ==========`);
-                        console.log(`rootDir: ${rootDir}`);
-                        console.log(`keys.sizes.view: ${JSON.stringify(keys?.sizes?.view)}`);
-                        console.log(`keys.intents: ${JSON.stringify(keys?.intents)}`);
-                        console.log(`======================================\n`);
+                    // Debug for View only (verbose mode)
+                    if (verboseMode && componentName === 'View') {
+                        verbose(`\n========== VIEW KEYS DEBUG ==========`);
+                        verbose(`rootDir: ${rootDir}`);
+                        verbose(`keys.sizes.view: ${JSON.stringify(keys?.sizes?.view)}`);
+                        verbose(`keys.intents: ${JSON.stringify(keys?.intents)}`);
+                        verbose(`======================================\n`);
                     }
 
                     try {

package/src/babel/theme-analyzer.js

@@ -252,6 +252,25 @@ function extractThemeKeysFromAST(themeFilePath, babelTypes, verboseMode) {
         }
     }
 
+    /**
+     * Process a builder chain that ends with .build() - extracts theme keys.
+     * Can be called on any node that is a .build() call expression.
+     */
+    function processBuilderChainNode(node) {
+        if (!t.isCallExpression(node)) return;
+        if (!t.isMemberExpression(node.callee)) return;
+        if (!t.isIdentifier(node.callee.property, { name: 'build' })) return;
+
+        const { calls, baseThemeVar } = traceBuilderChain(node);
+
+        if (baseThemeVar) {
+            log('Found fromTheme with base:', baseThemeVar);
+            analyzeBaseTheme(baseThemeVar);
+        }
+
+        processBuilderCalls(calls);
+    }
+
     // Second pass: find theme builder chains
     traverse(ast, {
         VariableDeclarator(path) {
@@ -262,14 +281,7 @@ function extractThemeKeysFromAST(themeFilePath, babelTypes, verboseMode) {
                 t.isMemberExpression(init.callee) &&
                 t.isIdentifier(init.callee.property, { name: 'build' })) {
 
-                const { calls, baseThemeVar } = traceBuilderChain(init);
-
-                if (baseThemeVar) {
-                    log('Found fromTheme with base:', baseThemeVar);
-                    analyzeBaseTheme(baseThemeVar);
-                }
-
-                processBuilderCalls(calls);
+                processBuilderChainNode(init);
             }
         },
 
@@ -285,14 +297,62 @@ function extractThemeKeysFromAST(themeFilePath, babelTypes, verboseMode) {
                     t.isMemberExpression(init.callee) &&
                     t.isIdentifier(init.callee.property, { name: 'build' })) {
 
-                    const { calls, baseThemeVar } = traceBuilderChain(init);
+                    processBuilderChainNode(init);
+                }
+            }
+        },
+
+        // Handle StyleSheet.configure({ themes: { light: ..., dark: ... } })
+        CallExpression(path) {
+            const { node } = path;
 
-                    if (baseThemeVar) {
-                        log('Found fromTheme with base:', baseThemeVar);
-                        analyzeBaseTheme(baseThemeVar);
-                    }
+            // Check for StyleSheet.configure(...)
+            if (!t.isMemberExpression(node.callee)) return;
+            if (!t.isIdentifier(node.callee.object, { name: 'StyleSheet' })) return;
+            if (!t.isIdentifier(node.callee.property, { name: 'configure' })) return;
 
-                    processBuilderCalls(calls);
+            log('Found StyleSheet.configure call');
+
+            const configArg = node.arguments[0];
+            if (!t.isObjectExpression(configArg)) return;
+
+            // Find the 'themes' property
+            for (const prop of configArg.properties) {
+                if (!t.isObjectProperty(prop)) continue;
+
+                const keyName = t.isIdentifier(prop.key) ? prop.key.name :
+                               t.isStringLiteral(prop.key) ? prop.key.value : null;
+
+                if (keyName !== 'themes') continue;
+                if (!t.isObjectExpression(prop.value)) continue;
+
+                log('Found themes object in StyleSheet.configure');
+
+                // Process each theme definition
+                for (const themeProp of prop.value.properties) {
+                    if (!t.isObjectProperty(themeProp)) continue;
+
+                    const themeName = t.isIdentifier(themeProp.key) ? themeProp.key.name :
+                                     t.isStringLiteral(themeProp.key) ? themeProp.key.value : null;
+
+                    if (!themeName) continue;
+
+                    const themeValue = themeProp.value;
+                    log(`  Processing theme '${themeName}'`);
+
+                    // Case 1: Inline builder chain - fromTheme(x).build() or createTheme().build()
+                    if (t.isCallExpression(themeValue) &&
+                        t.isMemberExpression(themeValue.callee) &&
+                        t.isIdentifier(themeValue.callee.property, { name: 'build' })) {
+
+                        log(`    Found inline builder chain for '${themeName}'`);
+                        processBuilderChainNode(themeValue);
+                    }
+                    // Case 2: Variable reference - analyze the referenced variable's file
+                    else if (t.isIdentifier(themeValue)) {
+                        log(`    Found variable reference '${themeValue.name}' for '${themeName}'`);
+                        analyzeBaseTheme(themeValue.name);
+                    }
                 }
             }
         }
@@ -325,18 +385,22 @@ function loadThemeKeys(opts, rootDir, babelTypes, verboseMode) {
         ? nodePath.resolve(rootDir, themePath)
         : require.resolve(themePath, { paths: [rootDir] });
 
-    console.log('[idealyst-plugin] Analyzing theme file:', resolvedPath);
+    if (verboseMode) {
+        console.log('[idealyst-plugin] Analyzing theme file:', resolvedPath);
+    }
 
     themeKeys = extractThemeKeysFromAST(resolvedPath, babelTypes, verboseMode);
 
-    // Always log the extracted keys
-    console.log('[idealyst-plugin] Extracted theme keys:');
-    console.log('  intents:', themeKeys.intents);
-    console.log('  radii:', themeKeys.radii);
-    console.log('  shadows:', themeKeys.shadows);
-    console.log('  sizes:');
-    for (const [component, sizes] of Object.entries(themeKeys.sizes)) {
-        console.log(`    ${component}:`, sizes);
+    // Log extracted keys in verbose mode
+    if (verboseMode) {
+        console.log('[idealyst-plugin] Extracted theme keys:');
+        console.log('  intents:', themeKeys.intents);
+        console.log('  radii:', themeKeys.radii);
+        console.log('  shadows:', themeKeys.shadows);
+        console.log('  sizes:');
+        for (const [component, sizes] of Object.entries(themeKeys.sizes)) {
+            console.log(`    ${component}:`, sizes);
+        }
     }
 
     return themeKeys;