@ornikar/kitt-universal 25.58.0 → 25.58.1-canary.01e4aa02ad8f3c2fd23f16498fb058cc1cad88cd.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ornikar/kitt-universal",
-  "version": "25.58.0",
+  "version": "25.58.1-canary.01e4aa02ad8f3c2fd23f16498fb058cc1cad88cd.0",
   "license": "MIT",
   "repository": {
     "directory": "@ornikar/kitt-universal",
@@ -71,10 +71,15 @@
     "./translations/es-ES.json": "./translations/es-ES.json",
     "./babel-plugin-csf-to-jest": "./babel-plugin-csf-to-jest.js"
   },
+  "bin": {
+    "run-all-transforms": "./scripts/run-all-transformers.js",
+    "run-transform": "./scripts/run-transformer.js"
+  },
   "engines": {
     "node": ">=20.10.0"
   },
   "scripts": {
+    "migrate": "node scripts/run-all-transforms.js",
     "build": "ORNIKAR_ONLY=kitt-universal yarn  ../.. build",
     "lint:eslint": "yarn ../.. eslint --report-unused-disable-directives --quiet @ornikar/kitt-universal"
   },
@@ -166,6 +171,7 @@
     "@types/react-transition-group": "4.2.3",
     "expo-document-picker": "11.10.1",
     "expo-image-picker": "14.7.1",
+    "jscodeshift": "17.3.0",
     "react": "18.3.1",
     "react-dom": "18.3.1",
     "react-error-boundary": "3.1.4",

package/scripts/run-all-transformers.js

@@ -0,0 +1,50 @@
+#!/usr/bin/env node
+
+'use strict';
+
+const { spawnSync } = require('node:child_process');
+const fs = require('node:fs');
+const path = require('node:path');
+
+// --- Handle CLI arguments ---
+const targetPath = process.argv[2];
+
+if (!targetPath) {
+  console.error('❌ Usage: node scripts/run-all-transformers.js <targetPath>');
+  process.exit(1);
+}
+
+// Ensure the path exists
+if (!fs.existsSync(targetPath)) {
+  console.error(`❌ Path "${targetPath}" does not exist.`);
+  process.exit(1);
+}
+
+const transformsDir = path.join(__dirname, 'transformers');
+
+// Read all .js files in the transformers directory
+const transformFiles = fs.readdirSync(transformsDir).filter((file) => file.endsWith('.js'));
+
+if (transformFiles.length === 0) {
+  console.log('✅ No transformers to apply.');
+  process.exit(0);
+}
+
+console.log(`🛠  Found ${transformFiles.length} transformer(s) to apply to: ${targetPath}\n`);
+
+transformFiles.forEach((file) => {
+  const transformPath = path.join(transformsDir, file);
+  console.log(`➡️  Running transformer: ${file}`);
+
+  const result = spawnSync(
+    'jscodeshift',
+    ['-t', transformPath, targetPath, '--parser=tsx'],
+    { stdio: 'inherit' }, // Show output in terminal
+  );
+
+  if (result.error) {
+    console.error(`❌ Error running ${file}:`, result.error.message);
+  } else {
+    console.log(`✅ Finished: ${file}\n`);
+  }
+});

package/scripts/run-transformer.js

@@ -0,0 +1,41 @@
+#!/usr/bin/env node
+
+'use strict';
+
+const { spawnSync } = require('node:child_process');
+const fs = require('node:fs');
+const path = require('node:path');
+
+// --- Handle CLI arguments ---
+const transformerName = process.argv[2];
+const targetPath = process.argv[3];
+
+if (!transformerName || !targetPath) {
+  console.error('❌ Usage: node scripts/run-transformer.js <transformerName> <targetPath>');
+  process.exit(1);
+}
+
+const transformPath = path.join(__dirname, 'transformers', `${transformerName}.js`);
+
+// Ensure the transformer file exists
+if (!fs.existsSync(transformPath)) {
+  console.error(`❌ Transform "${transformerName}" not found at ${transformPath}`);
+  process.exit(1);
+}
+
+// Ensure the path exists
+if (!fs.existsSync(targetPath)) {
+  console.error(`❌ Target path "${targetPath}" does not exist.`);
+  process.exit(1);
+}
+
+console.log(`➡️  Running transformer "${transformerName}" on ${targetPath}\n`);
+
+const result = spawnSync('jscodeshift', ['-t', transformPath, targetPath, '--parser=tsx'], { stdio: 'inherit' });
+
+if (result.error) {
+  console.error('❌ Error:', result.error.message);
+  process.exit(1);
+} else {
+  console.log(`✅ Transform "${transformerName}" completed.`);
+}

package/scripts/transformers/modals.js

@@ -0,0 +1,98 @@
+'use strict';
+
+/* eslint-disable prefer-destructuring */
+/* eslint-disable unicorn/no-array-method-this-argument */
+
+// List of modal component names we want to transform
+const MODAL_COMPONENTS = ['FullscreenModal', 'CardModal', 'NavigationModal'];
+
+module.exports = function transformer(fileInfo, api) {
+  // jscodeshift library
+  const j = api.jscodeshift;
+  // Parse the source code of the file
+  const root = j(fileInfo.source);
+
+  // Iterate over each modal component found in the source code
+  MODAL_COMPONENTS.forEach((componentName) => {
+    // Find instances of the modal component
+    root
+      .find(j.JSXElement, {
+        openingElement: {
+          name: { type: 'JSXIdentifier', name: componentName },
+        },
+      })
+      .forEach((path) => {
+        // Get the node (the JSXElement) from the path
+        const node = path.node;
+
+        // Check if the modal component already has children or if it is self-closing
+        const hasChildren = Array.isArray(node.children) && node.children.length > 0;
+        if (!node.openingElement.selfClosing && hasChildren) {
+          // If it already has children, do nothing and skip transformation
+          return;
+        }
+
+        // Extract the attributes from the JSX element (like `header`, `body`, `footer`)
+        const attributes = node.openingElement.attributes;
+
+        // Initialize a map to hold potential new children: header, body, footer
+        const newChildrenMap = {
+          header: null,
+          body: null,
+          footer: null,
+        };
+
+        // An array to keep attributes that are not `header`, `body`, or `footer`
+        const keptAttributes = [];
+
+        // Loop over the attributes to check if any match `header`, `body`, or `footer`
+        attributes.forEach((attr) => {
+          if (
+            attr.type === 'JSXAttribute' &&
+            attr.name &&
+            Object.prototype.hasOwnProperty.call(newChildrenMap, attr.name.name)
+          ) {
+            const key = attr.name.name;
+            const value = attr.value;
+
+            // Check if the value of the attribute is an expression (like a ternary)
+            if (value?.type === 'JSXExpressionContainer') {
+              const expression = value.expression;
+
+              // If it's a JSXElement or JSXFragment, keep it as it is
+              if (j.JSXElement.check(expression) || j.JSXFragment.check(expression)) {
+                newChildrenMap[key] = expression;
+              } else {
+                // Otherwise, wrap it in an expression container to handle non-JSX expressions
+                newChildrenMap[key] = j.jsxExpressionContainer(expression);
+              }
+            }
+          } else {
+            // Keep any other attributes (that are not header/body/footer)
+            keptAttributes.push(attr);
+          }
+        });
+
+        // If no new children were found (no `header`, `body`, or `footer`), do nothing
+        if (Object.values(newChildrenMap).every((v) => v === null)) {
+          return;
+        }
+
+        // If the modal component was self-closing, convert it to a regular JSX element with children
+        if (node.openingElement.selfClosing) {
+          node.openingElement.selfClosing = false;
+          node.closingElement = j.jsxClosingElement(j.jsxIdentifier(node.openingElement.name.name));
+        }
+
+        // Retain all the other attributes and set the new ones
+        node.openingElement.attributes = keptAttributes;
+
+        // Force the order of children: header → body → footer
+        const orderedChildren = Object.values(newChildrenMap).filter(Boolean);
+        node.children = orderedChildren;
+      });
+  });
+
+  // Return the modified source code after transformation
+  return root.toSource({ quote: 'single' });
+};