rw-elements-tools 1.2.0

package/build-shared-hooks.js

@@ -0,0 +1,253 @@
+#!/usr/bin/env node
+/**
+ * Shared Hooks Builder (with dead code elimination)
+ *
+ * - Reads shared hooks from shared-hooks/ and subfolders (alphabetical)
+ * - For each component hooks.source.js in packs/, concatenates shared + component
+ * - Uses esbuild DCE to remove unused code (anything not reachable from transformHook)
+ * - Output: plain static JS with const/let preserved
+ * - If a component has no hooks.source.js, it is skipped
+ * - Supports --watch to regenerate on changes
+ */
+
+import fs from 'fs';
+import path from 'path';
+import { fileURLToPath } from 'url';
+import { transform } from 'esbuild';
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+
+// Constants
+const SOURCE_FILENAME = 'hooks.source.js';
+const OUTPUT_FILENAME = 'hooks.js';
+
+/**
+ * Gets the shared hooks directory (always in the package)
+ */
+function getSharedDir() {
+  return path.join(__dirname, 'shared-hooks');
+}
+
+/**
+ * Recursively lists all shared hook files in shared-hooks/ and subfolders
+ * @returns {Promise<string[]>} Array of absolute paths to shared hook files (sorted alphabetically)
+ */
+async function listSharedFiles() {
+  const sharedDir = getSharedDir();
+  const results = [];
+  
+  async function walk(dir) {
+    let entries;
+    try {
+      entries = await fs.promises.readdir(dir, { withFileTypes: true });
+    } catch (err) {
+      if (dir === sharedDir) {
+        console.error(`[hooks] Failed to read shared dir: ${err.message}`);
+      }
+      return;
+    }
+    
+    for (const entry of entries) {
+      const fullPath = path.join(dir, entry.name);
+      if (entry.isDirectory()) {
+        if (entry.name.startsWith('.')) continue;
+        await walk(fullPath);
+      } else if (entry.isFile() && entry.name.endsWith('.js')) {
+        results.push(fullPath);
+      }
+    }
+  }
+  
+  await walk(sharedDir);
+  return results.sort();
+}
+
+/**
+ * Recursively finds all hooks.source.js files in a directory
+ * @param {string} startDir - Directory to search
+ * @returns {Promise<string[]>} Array of absolute paths to source files
+ */
+async function findHookSources(startDir) {
+  const results = [];
+  
+  async function walk(dir) {
+    let entries;
+    try {
+      entries = await fs.promises.readdir(dir, { withFileTypes: true });
+    } catch {
+      return; // Directory doesn't exist or can't be read
+    }
+    
+    for (const entry of entries) {
+      const fullPath = path.join(dir, entry.name);
+      if (entry.isDirectory()) {
+        if (entry.name === 'node_modules' || entry.name.startsWith('.')) continue;
+        await walk(fullPath);
+        continue;
+      }
+      if (entry.isFile() && entry.name === SOURCE_FILENAME) {
+        results.push(fullPath);
+      }
+    }
+  }
+  
+  await walk(startDir);
+  return results;
+}
+
+/**
+ * Builds a single hooks.js file from shared hooks + component source
+ * @param {string[]} sharedFiles - Array of shared hook file paths
+ * @param {string} sourcePath - Path to the hooks.source.js file
+ * @param {string} projectRoot - Project root for relative path display
+ */
+async function buildOne(sharedFiles, sourcePath, projectRoot) {
+  const componentDir = path.dirname(sourcePath);
+  const outputPath = path.join(componentDir, OUTPUT_FILENAME);
+
+  // Read all shared hook files
+  const sharedPieces = [];
+  for (const file of sharedFiles) {
+    const content = await fs.promises.readFile(file, 'utf8');
+    sharedPieces.push(content.trim());
+  }
+
+  // Read the component source
+  let componentContent = await fs.promises.readFile(sourcePath, 'utf8');
+
+  // Remove any existing exports.transformHook line (we'll add our own export marker)
+  componentContent = componentContent.replace(/^\s*exports\.transformHook\s*=.*$/gm, '').trim();
+
+  // Concatenate everything and add an ESM export marker for DCE
+  // esbuild will keep transformHook and anything it references, drop the rest
+  const combinedSource = `
+${sharedPieces.join('\n\n')}
+
+${componentContent}
+
+export { transformHook };
+`;
+
+  // Use esbuild transform with DCE
+  // minifySyntax: true enables dead code elimination
+  // We keep identifiers and whitespace for readable output
+  const result = await transform(combinedSource, {
+    loader: 'js',
+    target: 'es2018',
+    minifySyntax: true,       // Enables DCE
+    minifyWhitespace: false,  // Keep formatting readable
+    minifyIdentifiers: false, // Keep variable names
+    format: 'esm',
+    legalComments: 'none',
+  });
+
+  let code = result.code;
+
+  // Replace ESM export with CommonJS-style assignment
+  code = code.replace(/export\s*\{\s*transformHook\s*(as\s+\w+)?\s*\}\s*;?\s*$/m, 'exports.transformHook = transformHook;');
+
+  const banner = `// AUTO-GENERATED: do not edit. Edit hooks.source.js instead.\n`;
+
+  await fs.promises.writeFile(outputPath, banner + code, 'utf8');
+
+  console.log(`[hooks] Wrote ${path.relative(projectRoot, outputPath)}`);
+}
+
+/**
+ * Builds all hooks.js files
+ * @param {Object} config - Configuration object
+ * @param {string} config.packsDir - Absolute path to the packs directory
+ * @param {string} [config.projectRoot] - Project root for display purposes
+ */
+export async function buildAll(config) {
+  const packsDir = config.packsDir;
+  const projectRoot = config.projectRoot || path.dirname(packsDir);
+  
+  const sharedFiles = await listSharedFiles();
+  const sources = await findHookSources(packsDir);
+
+  console.log(`[hooks] Building ${sources.length} component hook(s); shared files: ${sharedFiles.length}`);
+
+  for (const sourcePath of sources) {
+    await buildOne(sharedFiles, sourcePath, projectRoot);
+  }
+  
+  console.log(`[hooks] Build complete`);
+}
+
+/**
+ * Starts watch mode for continuous building
+ * @param {Object} config - Configuration object
+ * @param {string} config.packsDir - Absolute path to the packs directory
+ * @param {string} [config.projectRoot] - Project root for display purposes
+ */
+export async function startWatch(config) {
+  const packsDir = config.packsDir;
+  const sharedDir = getSharedDir();
+  
+  console.log('[hooks] Watch mode enabled. Listening for changes...');
+
+  let building = false;
+  const rebuild = async () => {
+    if (building) return;
+    building = true;
+    try {
+      await buildAll(config);
+    } catch (err) {
+      console.error('[hooks] Build error:', err.message || err);
+    } finally {
+      building = false;
+    }
+  };
+
+  // Watch both the shared hooks directory and the packs directory
+  const watchDirs = [sharedDir, packsDir];
+  
+  for (const watchDir of watchDirs) {
+    try {
+      const watcher = fs.watch(watchDir, { recursive: true }, (eventType, filename) => {
+        if (!filename) return;
+        const lower = filename.toLowerCase();
+        if (lower.endsWith('hooks.source.js') || lower.endsWith('.js')) {
+          // Only rebuild for hooks.source.js changes in packs or any .js in shared-hooks
+          if (watchDir === sharedDir || lower.endsWith('hooks.source.js')) {
+            console.log(`[hooks] Change detected: ${filename} (${eventType})`);
+            rebuild();
+          }
+        }
+      });
+
+      watcher.on('error', (err) => {
+        console.error('[hooks] Watcher error:', err);
+      });
+    } catch (err) {
+      console.warn(`[hooks] Could not watch ${watchDir}: ${err.message}`);
+    }
+  }
+
+  await rebuild();
+}
+
+// Allow direct execution for backwards compatibility
+if (process.argv[1] === __filename) {
+  const WATCH = process.argv.includes('--watch') || process.argv.includes('-w');
+  const defaultPacksDir = path.resolve(__dirname, '..', 'packs');
+  const config = { 
+    packsDir: defaultPacksDir,
+    projectRoot: path.resolve(__dirname, '..')
+  };
+  
+  (async () => {
+    try {
+      if (WATCH) {
+        await startWatch(config);
+      } else {
+        await buildAll(config);
+      }
+    } catch (err) {
+      console.error('[hooks] Build failed:', err.message || err);
+      process.exit(1);
+    }
+  })();
+}

package/config.js

@@ -0,0 +1,148 @@
+/**
+ * Configuration Resolver for rw-elements-tools
+ * 
+ * Resolves configuration from multiple sources with the following priority:
+ * 1. CLI arguments (highest priority)
+ * 2. Environment variables
+ * 3. package.json "rw-elements-tools" field
+ * 4. rw-elements-tools.config.js file
+ * 5. Default values (lowest priority)
+ */
+
+import fs from 'fs';
+import path from 'path';
+import { fileURLToPath, pathToFileURL } from 'url';
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+
+/**
+ * Default configuration values
+ */
+const DEFAULTS = {
+  packsDir: './packs',
+};
+
+/**
+ * Finds the project root by looking for package.json
+ * @returns {string} The project root directory
+ */
+function findProjectRoot() {
+  let currentDir = process.cwd();
+  
+  while (currentDir !== path.dirname(currentDir)) {
+    if (fs.existsSync(path.join(currentDir, 'package.json'))) {
+      return currentDir;
+    }
+    currentDir = path.dirname(currentDir);
+  }
+  
+  // Fallback to cwd if no package.json found
+  return process.cwd();
+}
+
+/**
+ * Reads the package.json from the project root
+ * @param {string} projectRoot - The project root directory
+ * @returns {object|null} The package.json contents or null
+ */
+function readPackageJson(projectRoot) {
+  const packageJsonPath = path.join(projectRoot, 'package.json');
+  
+  try {
+    const content = fs.readFileSync(packageJsonPath, 'utf8');
+    return JSON.parse(content);
+  } catch {
+    return null;
+  }
+}
+
+/**
+ * Loads the rw-elements-tools.config.js file if it exists
+ * @param {string} projectRoot - The project root directory
+ * @returns {Promise<object|null>} The config file contents or null
+ */
+async function loadConfigFile(projectRoot) {
+  const configPaths = [
+    path.join(projectRoot, 'rw-elements-tools.config.js'),
+    path.join(projectRoot, 'rw-elements-tools.config.mjs'),
+  ];
+  
+  for (const configPath of configPaths) {
+    if (fs.existsSync(configPath)) {
+      try {
+        const configUrl = pathToFileURL(configPath).href;
+        const configModule = await import(configUrl);
+        return configModule.default || configModule;
+      } catch (err) {
+        console.warn(`[rw-elements-tools] Warning: Failed to load config file ${configPath}: ${err.message}`);
+      }
+    }
+  }
+  
+  return null;
+}
+
+/**
+ * Resolves the full configuration from all sources
+ * @param {object} cliOptions - Options passed via CLI arguments
+ * @returns {Promise<object>} The resolved configuration
+ */
+export async function resolveConfig(cliOptions = {}) {
+  const projectRoot = findProjectRoot();
+  const packageJson = readPackageJson(projectRoot);
+  const configFile = await loadConfigFile(projectRoot);
+  
+  // Build config with priority chain
+  const config = { ...DEFAULTS };
+  
+  // 5. Default values (already set above)
+  
+  // 4. Config file (rw-elements-tools.config.js)
+  if (configFile) {
+    if (configFile.packsDir) {
+      config.packsDir = configFile.packsDir;
+    }
+  }
+  
+  // 3. package.json "rw-elements-tools" field
+  if (packageJson && packageJson['rw-elements-tools']) {
+    const pkgConfig = packageJson['rw-elements-tools'];
+    if (pkgConfig.packsDir) {
+      config.packsDir = pkgConfig.packsDir;
+    }
+  }
+  
+  // 2. Environment variables
+  if (process.env.RW_PACKS_DIR) {
+    config.packsDir = process.env.RW_PACKS_DIR;
+  }
+  
+  // 1. CLI arguments (highest priority)
+  if (cliOptions.packsDir || cliOptions.packs) {
+    config.packsDir = cliOptions.packsDir || cliOptions.packs;
+  }
+  
+  // Resolve packsDir to absolute path from project root
+  if (!path.isAbsolute(config.packsDir)) {
+    config.packsDir = path.resolve(projectRoot, config.packsDir);
+  }
+  
+  // Add project root and package location to config
+  config.projectRoot = projectRoot;
+  config.packageRoot = __dirname;
+  
+  return config;
+}
+
+/**
+ * Gets the path to a resource within the package
+ * @param {...string} segments - Path segments relative to package root
+ * @returns {string} Absolute path to the resource
+ */
+export function getPackagePath(...segments) {
+  return path.join(__dirname, ...segments);
+}
+
+export default { resolveConfig, getPackagePath };
+

package/controls/Animations/AnimationEffects.js

@@ -0,0 +1,111 @@
+const AnimationEffects = [
+    {
+        visible: "globalScrollAnimationTrigger != 'none' && globalScrollAnimationVisibleSettings == 'effects'",
+        title: "Preview",
+        id: "globalScrollAnimationPreviewInEditor",
+        responsive: false,
+        switch: {}
+    },
+    {
+        visible: "globalScrollAnimationTrigger != 'none' && globalScrollAnimationVisibleSettings == 'effects' && globalScrollAnimationPreviewInEditor == 'true'",
+        information: {},
+        title: "Previews the settings below. Spring effects are not supported in editor.",
+    },
+    {
+        visible: "globalScrollAnimationTrigger != 'none' && globalScrollAnimationVisibleSettings == 'effects'",
+        title: "State",
+        id: "globalScrollAnimationEnterState",
+        responsive: false,
+        segmented: {
+            default: "start",
+            items: [
+                {
+                    title: "Start",
+                    value: "start"
+                },
+                {
+                    title: "End",
+                    value: "end"
+                }
+            ]
+        }
+    },
+    {
+        visible: "globalScrollAnimationTrigger != 'none' && globalScrollAnimationVisibleSettings == 'effects' && globalScrollAnimationEnterState == 'start'",
+        globalControl: "ScrollAnimation_Opacity",
+        id: "{{value}}EnterStart",
+    },
+    {
+        visible: "globalScrollAnimationTrigger != 'none' && globalScrollAnimationVisibleSettings == 'effects' && globalScrollAnimationEnterState == 'start'",
+        globalControl: "ScrollAnimation_Rotate",
+        id: "{{value}}EnterStart",
+    },
+    {
+        visible: "globalScrollAnimationTrigger != 'none' && globalScrollAnimationVisibleSettings == 'effects' && globalScrollAnimationEnterState == 'start'",
+        globalControl: "ScrollAnimation_Scale",
+        id: "{{value}}EnterStart",
+    },
+    {
+        visible: "globalScrollAnimationTrigger != 'none' && globalScrollAnimationVisibleSettings == 'effects' && globalScrollAnimationEnterState == 'start'",
+        globalControl: "ScrollAnimation_Translate",
+        id: "{{value}}EnterStart",
+    },
+    {
+        visible: "globalScrollAnimationTrigger != 'none' && globalScrollAnimationVisibleSettings == 'effects' && globalScrollAnimationEnterState == 'end'",
+        globalControl: "ScrollAnimation_Opacity",
+        id: "{{value}}EnterEnd",
+    },
+    {
+        visible: "globalScrollAnimationTrigger != 'none' && globalScrollAnimationVisibleSettings == 'effects' && globalScrollAnimationEnterState == 'end'",
+        globalControl: "ScrollAnimation_Rotate",
+        id: "{{value}}EnterEnd",
+    },
+    {
+        visible: "globalScrollAnimationTrigger != 'none' && globalScrollAnimationVisibleSettings == 'effects' && globalScrollAnimationEnterState == 'end'",
+        globalControl: "ScrollAnimation_Scale",
+        id: "{{value}}EnterEnd",
+    },
+    {
+        visible: "globalScrollAnimationTrigger != 'none' && globalScrollAnimationVisibleSettings == 'effects' && globalScrollAnimationEnterState == 'end'",
+        globalControl: "ScrollAnimation_Translate",
+        id: "{{value}}EnterEnd",
+    },
+    {
+        visible: "globalScrollAnimationTrigger != 'none' && globalScrollAnimationVisibleSettings == 'effects'",
+        divider: {},
+    },
+    {
+        visible: "globalScrollAnimationTrigger != 'none' && globalScrollAnimationVisibleSettings == 'effects'",
+        title: "Exit",
+        heading: {}
+    },
+    {
+        visible: "globalScrollAnimationTrigger != 'none' && globalScrollAnimationVisibleSettings == 'effects'",
+        title: "Enable",
+        id: "globalScrollAnimationExitEnabled",
+        responsive: false,
+        switch: {}
+    },
+    {
+        visible: "globalScrollAnimationTrigger != 'none' && globalScrollAnimationVisibleSettings == 'effects' && globalScrollAnimationExitEnabled == 'true'",
+        globalControl: "ScrollAnimation_Opacity",
+        id: "{{value}}ExitEnd",
+    },
+    {
+        visible: "globalScrollAnimationTrigger != 'none' && globalScrollAnimationVisibleSettings == 'effects' && globalScrollAnimationExitEnabled == 'true'",
+        globalControl: "ScrollAnimation_Rotate",
+        id: "{{value}}ExitEnd",
+    },
+    {
+        visible: "globalScrollAnimationTrigger != 'none' && globalScrollAnimationVisibleSettings == 'effects' && globalScrollAnimationExitEnabled == 'true'",
+        globalControl: "ScrollAnimation_Scale",
+        id: "{{value}}ExitEnd",
+    },
+    {
+        visible: "globalScrollAnimationTrigger != 'none' && globalScrollAnimationVisibleSettings == 'effects' && globalScrollAnimationExitEnabled == 'true'",
+        globalControl: "ScrollAnimation_Translate",
+        id: "{{value}}ExitEnd",
+    },
+]
+
+export default AnimationEffects;