rtl-migrate-cli 0.1.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 jatinsh1011
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,110 @@
+# rtl-migrate-cli
+
+CLI + codemod that converts physical LTR CSS / CSS-in-JS properties to
+[CSS logical properties](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_logical_properties_and_values),
+so styles work correctly in both LTR and RTL layouts without direction-based branching.
+
+```
+marginLeft            -> marginInlineStart
+marginRight            -> marginInlineEnd
+paddingLeft            -> paddingInlineStart
+paddingRight           -> paddingInlineEnd
+borderLeft             -> borderInlineStart
+borderRight            -> borderInlineEnd
+borderTopLeftRadius    -> borderStartStartRadius
+borderTopRightRadius   -> borderStartEndRadius
+borderBottomLeftRadius -> borderEndStartRadius
+borderBottomRightRadius-> borderEndEndRadius
+left / right (position)-> insetInlineStart / insetInlineEnd
+textAlign: 'left'|'right' (in a direction conditional) -> 'start' | 'end'
+```
+
+It understands two kinds of files:
+
+- **JS/TS style objects** (`makeStyles`, `sx`, inline `style={{ ... }}`, plain style objects) —
+  parsed and rewritten with Babel + [recast](https://github.com/benjamn/recast), so untouched code
+  keeps its original formatting.
+- **CSS / SCSS files** — rewritten with PostCSS.
+
+## Install
+
+```bash
+npm install -g rtl-migrate-cli
+# or run without installing:
+npx rtl-migrate-cli "src/**/*.styles.js"
+```
+
+The CLI command is `rtlmigrate`.
+
+## Usage
+
+```bash
+# Dry run (default): prints a diff, does not touch files
+rtlmigrate "src/**/*.styles.js" "src/**/*.css"
+
+# Apply changes
+rtlmigrate "src/**/*.styles.js" --write
+
+# Keep existing [dir="rtl"] override blocks instead of removing them
+rtlmigrate "src/**/*.css" --write --keep-rtl-overrides
+```
+
+### Options
+
+| Flag                     | Description                                                        |
+|--------------------------|----------------------------------------------------------------------|
+| `-w, --write`            | Write changes to disk. Without it, `rtlmigrate` only prints a diff.  |
+| `--keep-rtl-overrides`   | Don't remove `[dir="rtl"]` override blocks/rules.                    |
+| `-V, --version`          | Print the installed version.                                         |
+
+## Conversion rules
+
+- **Ternary with a direction condition** (`direction === 'ltr' ? a : b`) — the LTR branch is kept,
+  the condition is dropped.
+- **Shorthand ternary** (`margin`/`padding` with a 4-value string) — split into
+  `*InlineStart`/`*InlineEnd` (plus `*Top`/`*Bottom` if non-zero).
+- **Static values** — the property is renamed only, value untouched.
+- **`left`/`right` positioning** is only converted when it looks directional. It is skipped for:
+  - centering (`left: '50%'`)
+  - full overlays (`top/right/bottom/left` all `0` on the same rule/object)
+  - off-screen hiding (e.g. `left: '-9999px'`)
+- **`[dir="rtl"]` override blocks** are removed once they become redundant (opt out with
+  `--keep-rtl-overrides`).
+- `box-shadow`, `transform`, and `inset(...)` values are never touched. `shouldForwardProp` arrays,
+  `PropTypes`, and commented-out code are never touched (the transform only targets real style
+  object properties and CSS declarations).
+
+## Programmatic API
+
+```js
+const { transformJs, transformCss, processFile } = require('rtl-migrate-cli');
+
+const { code, report } = transformJs(sourceCode, 'Component.styles.js');
+// report.converted / report.skipped / report.removed
+```
+
+## Limitations / roadmap
+
+- Template-literal CSS-in-JS (`styled.div\`...\``, emotion `css\`...\``) is not yet parsed — only
+  JS object-based styles and `.css`/`.scss` files are supported today.
+- `margin`/`padding` shorthand splitting only supports 1-value and 4-value forms; 2/3-value
+  shorthands are left untouched and reported as skipped.
+- Direction-check detection is heuristic (`x === 'ltr'|'rtl'`); unusual condition shapes are
+  reported as skipped rather than guessed at.
+
+Contributions welcome — please open an issue/PR for additional CSS-in-JS flavors or shorthand
+patterns.
+
+## Publishing (maintainer notes)
+
+```bash
+npm login
+npm publish --access public
+git init && git add -A && git commit -m "Initial release"
+git remote add origin git@github.com:jatinsh1011/rtlmigrate.git
+git push -u origin main
+```
+
+## License
+
+MIT

package/bin/rtlmigrate.js

@@ -0,0 +1,2 @@
+#!/usr/bin/env node
+require('../src/cli').run(process.argv);

package/package.json

@@ -0,0 +1,58 @@
+{
+  "name": "rtl-migrate-cli",
+  "version": "0.1.0",
+  "description": "CLI + codemod that migrates physical LTR CSS / CSS-in-JS properties to RTL-ready logical properties (marginLeft -> marginInlineStart, etc.)",
+  "bin": {
+    "rtlmigrate": "bin/rtlmigrate.js"
+  },
+  "main": "src/index.js",
+  "type": "commonjs",
+  "files": [
+    "bin",
+    "src",
+    "README.md",
+    "LICENSE"
+  ],
+  "engines": {
+    "node": ">=16"
+  },
+  "scripts": {
+    "test": "vitest run",
+    "test:watch": "vitest"
+  },
+  "keywords": [
+    "rtl",
+    "ltr",
+    "css",
+    "logical-properties",
+    "i18n",
+    "codemod",
+    "css-in-js",
+    "cli"
+  ],
+  "author": "jatinsh1011",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/jatinsh1011/rtlmigrate.git"
+  },
+  "bugs": {
+    "url": "https://github.com/jatinsh1011/rtlmigrate/issues"
+  },
+  "homepage": "https://github.com/jatinsh1011/rtlmigrate#readme",
+  "dependencies": {
+    "@babel/parser": "^7.24.0",
+    "@babel/traverse": "^7.24.0",
+    "@babel/types": "^7.24.0",
+    "commander": "^12.0.0",
+    "diff": "^5.2.0",
+    "fast-glob": "^3.3.2",
+    "picocolors": "^1.0.0",
+    "postcss": "^8.4.38",
+    "postcss-scss": "^4.0.9",
+    "recast": "^0.23.9"
+  },
+  "devDependencies": {
+    "vitest": "^1.4.0"
+  }
+}

package/src/cli.js

@@ -0,0 +1,73 @@
+const path = require('path');
+const { Command } = require('commander');
+const fg = require('fast-glob');
+const { createPatch } = require('diff');
+const pc = require('picocolors');
+const { processFile } = require('./fileProcessor');
+const pkg = require('../package.json');
+
+function run(argv) {
+  const program = new Command();
+
+  program
+    .name('rtlmigrate')
+    .description('Convert LTR physical CSS / CSS-in-JS properties to RTL-ready logical properties')
+    .argument('<patterns...>', 'file(s) or glob pattern(s) to process')
+    .option('-w, --write', 'write changes to disk (default: dry-run, prints a diff only)', false)
+    .option('--keep-rtl-overrides', 'do not remove [dir="rtl"] override blocks', false)
+    .version(pkg.version)
+    .parse(argv);
+
+  const opts = program.opts();
+  const patterns = program.args;
+  const files = fg.sync(patterns, { onlyFiles: true, absolute: true, dot: false });
+
+  if (!files.length) {
+    console.error(pc.yellow('No files matched the given pattern(s).'));
+    process.exitCode = 1;
+    return;
+  }
+
+  let anyChanged = false;
+  let errorCount = 0;
+
+  for (const file of files) {
+    try {
+      const result = processFile(file, { write: opts.write, keepRtlOverrides: opts.keepRtlOverrides });
+      if (result.skippedFile) continue;
+
+      const relPath = path.relative(process.cwd(), file);
+      if (!result.changed) {
+        console.log(pc.gray(`No changes: ${relPath}`));
+        continue;
+      }
+
+      anyChanged = true;
+      console.log(pc.bold(pc.cyan(`\n${relPath}`)));
+      result.report.converted.forEach((c) => console.log(pc.green(`  + ${c.from} \u2192 ${c.to}`)));
+      result.report.removed.forEach((r) =>
+        console.log(pc.yellow(`  - removed: ${r.selector || r.property} (${r.reason})`))
+      );
+      result.report.skipped.forEach((s) => console.log(pc.gray(`  ~ skipped: ${s.property} (${s.reason})`)));
+
+      if (opts.write) {
+        console.log(pc.green('  \u2714 written'));
+      } else {
+        console.log(createPatch(file, result.original, result.output, '', ''));
+      }
+    } catch (err) {
+      errorCount += 1;
+      console.error(pc.red(`Error processing ${file}: ${err.message}`));
+    }
+  }
+
+  if (!anyChanged) {
+    console.log(pc.gray('\nNo properties needed conversion.'));
+  } else if (!opts.write) {
+    console.log(pc.yellow('\nDry run only \u2014 re-run with --write to apply changes.'));
+  }
+
+  process.exitCode = errorCount ? 1 : 0;
+}
+
+module.exports = { run };

package/src/fileProcessor.js

@@ -0,0 +1,30 @@
+const fs = require('fs');
+const path = require('path');
+const { transformJs } = require('./transformers/jsTransform');
+const { transformCss } = require('./transformers/cssTransform');
+
+const JS_EXTS = new Set(['.js', '.jsx', '.ts', '.tsx']);
+const CSS_EXTS = new Set(['.css', '.scss']);
+
+function processFile(filePath, opts = {}) {
+  const original = fs.readFileSync(filePath, 'utf8');
+  const ext = path.extname(filePath).toLowerCase();
+
+  let result;
+  if (JS_EXTS.has(ext)) {
+    result = transformJs(original, filePath, opts);
+  } else if (CSS_EXTS.has(ext)) {
+    result = transformCss(original, filePath, opts);
+  } else {
+    return { skippedFile: true, reason: `unsupported extension ${ext}` };
+  }
+
+  const changed = result.code !== original;
+  if (changed && opts.write) {
+    fs.writeFileSync(filePath, result.code, 'utf8');
+  }
+
+  return { filePath, original, output: result.code, changed, report: result.report };
+}
+
+module.exports = { processFile };

package/src/index.js

@@ -0,0 +1,5 @@
+const { processFile } = require('./fileProcessor');
+const { transformJs } = require('./transformers/jsTransform');
+const { transformCss } = require('./transformers/cssTransform');
+
+module.exports = { processFile, transformJs, transformCss };

package/src/rules/heuristics.js

@@ -0,0 +1,17 @@
+// Value-based heuristics used to avoid converting left/right that aren't directional.
+
+function isCentering(value) {
+  return /^-?50%$/.test(String(value).trim());
+}
+
+function isOffScreen(value) {
+  const match = String(value).trim().match(/^-(\d+(?:\.\d+)?)(px|rem|em)$/);
+  if (!match) return false;
+  return parseFloat(match[1]) >= 999;
+}
+
+function isZero(value) {
+  return /^0(px|em|rem|%)?$/.test(String(value).trim());
+}
+
+module.exports = { isCentering, isOffScreen, isZero };

package/src/rules/propertyMap.js

@@ -0,0 +1,37 @@
+// Physical -> logical property maps for JS style objects (camelCase) and CSS (kebab-case).
+
+const DIRECT_RENAME_MAP = {
+  marginLeft: 'marginInlineStart',
+  marginRight: 'marginInlineEnd',
+  paddingLeft: 'paddingInlineStart',
+  paddingRight: 'paddingInlineEnd',
+  borderLeft: 'borderInlineStart',
+  borderRight: 'borderInlineEnd',
+  borderTopLeftRadius: 'borderStartStartRadius',
+  borderTopRightRadius: 'borderStartEndRadius',
+  borderBottomLeftRadius: 'borderEndStartRadius',
+  borderBottomRightRadius: 'borderEndEndRadius',
+};
+
+const CSS_DIRECT_RENAME_MAP = {
+  'margin-left': 'margin-inline-start',
+  'margin-right': 'margin-inline-end',
+  'padding-left': 'padding-inline-start',
+  'padding-right': 'padding-inline-end',
+  'border-left': 'border-inline-start',
+  'border-right': 'border-inline-end',
+  'border-top-left-radius': 'border-start-start-radius',
+  'border-top-right-radius': 'border-start-end-radius',
+  'border-bottom-left-radius': 'border-end-start-radius',
+  'border-bottom-right-radius': 'border-end-end-radius',
+};
+
+const POSITION_MAP = { left: 'insetInlineStart', right: 'insetInlineEnd' };
+const CSS_POSITION_MAP = { left: 'inset-inline-start', right: 'inset-inline-end' };
+
+module.exports = {
+  DIRECT_RENAME_MAP,
+  CSS_DIRECT_RENAME_MAP,
+  POSITION_MAP,
+  CSS_POSITION_MAP,
+};

package/src/transformers/cssTransform.js

@@ -0,0 +1,78 @@
+const postcss = require('postcss');
+const scss = require('postcss-scss');
+const { CSS_DIRECT_RENAME_MAP, CSS_POSITION_MAP } = require('../rules/propertyMap');
+const { isCentering, isOffScreen, isZero } = require('../rules/heuristics');
+
+function transformCss(code, filePath, opts = {}) {
+  const report = { converted: [], skipped: [], removed: [] };
+  const syntax = filePath.endsWith('.scss') ? scss : undefined;
+  const root = postcss.parse(code, { syntax });
+
+  root.walkRules((rule) => {
+    if (/\[dir=["']rtl["']\]/.test(rule.selector)) {
+      if (!opts.keepRtlOverrides) {
+        report.removed.push({ file: filePath, selector: rule.selector, reason: 'redundant [dir="rtl"] override block' });
+        rule.remove();
+      }
+      return;
+    }
+
+    const values = {};
+    rule.walkDecls((d) => {
+      values[d.prop.toLowerCase()] = d.value;
+    });
+    const isFullOverlay = ['top', 'left', 'right', 'bottom'].every(
+      (k) => values[k] !== undefined && isZero(values[k])
+    );
+
+    rule.walkDecls((decl) => {
+      const prop = decl.prop.toLowerCase();
+
+      if (CSS_DIRECT_RENAME_MAP[prop]) {
+        report.converted.push({ file: filePath, from: prop, to: CSS_DIRECT_RENAME_MAP[prop] });
+        decl.prop = CSS_DIRECT_RENAME_MAP[prop];
+        return;
+      }
+
+      if (prop === 'left' || prop === 'right') {
+        if (isFullOverlay) {
+          report.skipped.push({ file: filePath, property: prop, reason: 'full-overlay pattern (top/right/bottom/left all 0)' });
+          return;
+        }
+        if (isCentering(decl.value) || isOffScreen(decl.value)) {
+          report.skipped.push({ file: filePath, property: prop, reason: 'centering or off-screen value' });
+          return;
+        }
+        report.converted.push({ file: filePath, from: prop, to: CSS_POSITION_MAP[prop] });
+        decl.prop = CSS_POSITION_MAP[prop];
+        return;
+      }
+
+      if (prop === 'margin' || prop === 'padding') {
+        const parts = decl.value.trim().split(/\s+/);
+        if (parts.length === 4) {
+          const [top, right, bottom, left] = parts;
+          const decls = [];
+          if (!isZero(top)) decls.push(postcss.decl({ prop: `${prop}-top`, value: top }));
+          if (!isZero(bottom)) decls.push(postcss.decl({ prop: `${prop}-bottom`, value: bottom }));
+          decls.push(postcss.decl({ prop: `${prop}-inline-start`, value: left }));
+          decls.push(postcss.decl({ prop: `${prop}-inline-end`, value: right }));
+          decl.replaceWith(decls);
+          report.converted.push({ file: filePath, from: `${prop} (shorthand)`, to: `${prop}-inline-start/${prop}-inline-end` });
+        } else if (parts.length === 1) {
+          decl.replaceWith(
+            postcss.decl({ prop: `${prop}-inline-start`, value: parts[0] }),
+            postcss.decl({ prop: `${prop}-inline-end`, value: parts[0] })
+          );
+          report.converted.push({ file: filePath, from: prop, to: `${prop}-inline-start/${prop}-inline-end` });
+        } else {
+          report.skipped.push({ file: filePath, property: prop, reason: `unsupported shorthand arity (${parts.length} values)` });
+        }
+      }
+    });
+  });
+
+  return { code: root.toString(), report };
+}
+
+module.exports = { transformCss };

package/src/transformers/jsTransform.js

@@ -0,0 +1,233 @@
+const recast = require('recast');
+const babelParser = require('recast/parsers/babel');
+const traverse = require('@babel/traverse').default;
+const t = require('@babel/types');
+const { DIRECT_RENAME_MAP, POSITION_MAP } = require('../rules/propertyMap');
+const { isCentering, isOffScreen, isZero } = require('../rules/heuristics');
+
+// Matches `direction === 'ltr'`, `theme.direction === 'rtl'`, `dir == 'ltr'`, etc.
+function isDirectionTest(node) {
+  if (!t.isBinaryExpression(node) || (node.operator !== '===' && node.operator !== '==')) {
+    return null;
+  }
+  const literalSide = t.isStringLiteral(node.right) ? node.right : t.isStringLiteral(node.left) ? node.left : null;
+  if (!literalSide) return null;
+  const value = literalSide.value.toLowerCase();
+  return value === 'ltr' || value === 'rtl' ? value : null;
+}
+
+function getKeyName(prop) {
+  if (!t.isObjectProperty(prop)) return null;
+  if (t.isIdentifier(prop.key) && !prop.computed) return prop.key.name;
+  if (t.isStringLiteral(prop.key)) return prop.key.value;
+  return null;
+}
+
+function setKeyName(prop, newName) {
+  if (t.isIdentifier(prop.key)) {
+    prop.key = t.identifier(newName);
+  } else {
+    prop.key = t.stringLiteral(newName);
+  }
+}
+
+function staticStringValue(node) {
+  if (t.isStringLiteral(node)) return node.value;
+  if (t.isNumericLiteral(node)) return String(node.value);
+  return null;
+}
+
+function convertDirectProperty(prop, name, report, filePath) {
+  const newName = DIRECT_RENAME_MAP[name];
+  let newValueNode = prop.value;
+
+  if (t.isConditionalExpression(prop.value)) {
+    const testValue = isDirectionTest(prop.value.test);
+    if (!testValue) {
+      report.skipped.push({ file: filePath, property: name, reason: 'conditional test is not a recognizable direction check' });
+      return false;
+    }
+    newValueNode = testValue === 'ltr' ? prop.value.consequent : prop.value.alternate;
+  }
+
+  setKeyName(prop, newName);
+  prop.value = newValueNode;
+  report.converted.push({ file: filePath, from: name, to: newName });
+  return true;
+}
+
+function convertPositionalProperty(prop, name, report, filePath, ctx) {
+  const newName = POSITION_MAP[name];
+
+  if (t.isConditionalExpression(prop.value)) {
+    const testValue = isDirectionTest(prop.value.test);
+    if (!testValue) {
+      report.skipped.push({ file: filePath, property: name, reason: 'conditional test is not a recognizable direction check' });
+      return false;
+    }
+    const ltrNode = testValue === 'ltr' ? prop.value.consequent : prop.value.alternate;
+    const value = staticStringValue(ltrNode);
+    if (value !== null && (isCentering(value) || isOffScreen(value))) {
+      report.skipped.push({ file: filePath, property: name, reason: 'centering or off-screen value' });
+      return false;
+    }
+    setKeyName(prop, newName);
+    prop.value = ltrNode;
+    report.converted.push({ file: filePath, from: name, to: newName });
+    return true;
+  }
+
+  if (ctx.isFullOverlay) {
+    report.skipped.push({ file: filePath, property: name, reason: 'full-overlay pattern (top/right/bottom/left all 0)' });
+    return false;
+  }
+
+  const value = staticStringValue(prop.value);
+  if (value !== null && (isCentering(value) || isOffScreen(value))) {
+    report.skipped.push({ file: filePath, property: name, reason: 'centering or off-screen value' });
+    return false;
+  }
+
+  setKeyName(prop, newName);
+  report.converted.push({ file: filePath, from: name, to: newName });
+  return true;
+}
+
+// margin/padding shorthand ternary -> split LTR value into *InlineStart/*InlineEnd (+ Top/Bottom if non-zero).
+function convertShorthandTernary(prop, baseName, report, filePath) {
+  const testValue = isDirectionTest(prop.value.test);
+  if (!testValue) {
+    report.skipped.push({ file: filePath, property: baseName, reason: 'conditional test is not a recognizable direction check' });
+    return null;
+  }
+  const ltrNode = testValue === 'ltr' ? prop.value.consequent : prop.value.alternate;
+  if (!t.isStringLiteral(ltrNode)) {
+    report.skipped.push({ file: filePath, property: baseName, reason: 'shorthand value is not a string literal' });
+    return null;
+  }
+
+  const parts = ltrNode.value.trim().split(/\s+/);
+  let entries;
+  if (parts.length === 4) {
+    const [top, right, bottom, left] = parts;
+    entries = [];
+    if (!isZero(top)) entries.push([`${baseName}Top`, top]);
+    if (!isZero(bottom)) entries.push([`${baseName}Bottom`, bottom]);
+    entries.push([`${baseName}InlineStart`, left]);
+    entries.push([`${baseName}InlineEnd`, right]);
+  } else if (parts.length === 1) {
+    entries = [
+      [`${baseName}InlineStart`, parts[0]],
+      [`${baseName}InlineEnd`, parts[0]],
+    ];
+  } else {
+    report.skipped.push({ file: filePath, property: baseName, reason: `unsupported shorthand arity (${parts.length} values)` });
+    return null;
+  }
+
+  report.converted.push({ file: filePath, from: `${baseName} (shorthand)`, to: entries.map((e) => e[0]).join('/') });
+  return entries.map(([name, value]) => t.objectProperty(t.identifier(name), t.stringLiteral(value)));
+}
+
+function convertTextAlignTernary(prop, report, filePath) {
+  const testValue = isDirectionTest(prop.value.test);
+  if (!testValue) {
+    report.skipped.push({ file: filePath, property: 'textAlign', reason: 'conditional test is not a recognizable direction check' });
+    return false;
+  }
+  const ltrNode = testValue === 'ltr' ? prop.value.consequent : prop.value.alternate;
+  if (!t.isStringLiteral(ltrNode)) {
+    report.skipped.push({ file: filePath, property: 'textAlign', reason: 'value is not a string literal' });
+    return false;
+  }
+  const map = { left: 'start', right: 'end' };
+  const mapped = map[ltrNode.value];
+  if (!mapped) return false;
+
+  prop.value = t.stringLiteral(mapped);
+  report.converted.push({ file: filePath, from: 'textAlign (conditional)', to: `textAlign: '${mapped}'` });
+  return true;
+}
+
+function processObjectExpression(objExpr, report, filePath) {
+  const props = objExpr.properties;
+  const siblingValues = {};
+  props.forEach((p) => {
+    const name = getKeyName(p);
+    if (name && (t.isStringLiteral(p.value) || t.isNumericLiteral(p.value))) {
+      siblingValues[name] = staticStringValue(p.value);
+    }
+  });
+  const isFullOverlay = ['top', 'left', 'right', 'bottom'].every(
+    (k) => siblingValues[k] !== undefined && isZero(siblingValues[k])
+  );
+
+  const newProperties = [];
+  let changed = false;
+
+  props.forEach((prop) => {
+    const name = getKeyName(prop);
+    if (!name) {
+      newProperties.push(prop);
+      return;
+    }
+
+    // Redundant nested `&[dir="rtl"]` override block once logical properties are used.
+    if (/\[dir=["']rtl["']\]/.test(name)) {
+      report.removed.push({ file: filePath, property: name, reason: 'redundant [dir="rtl"] override block' });
+      changed = true;
+      return;
+    }
+
+    if (DIRECT_RENAME_MAP[name]) {
+      if (convertDirectProperty(prop, name, report, filePath)) changed = true;
+      newProperties.push(prop);
+      return;
+    }
+
+    if ((name === 'margin' || name === 'padding') && t.isConditionalExpression(prop.value)) {
+      const replacement = convertShorthandTernary(prop, name, report, filePath);
+      if (replacement) {
+        changed = true;
+        newProperties.push(...replacement);
+      } else {
+        newProperties.push(prop);
+      }
+      return;
+    }
+
+    if (name === 'left' || name === 'right') {
+      if (convertPositionalProperty(prop, name, report, filePath, { isFullOverlay })) changed = true;
+      newProperties.push(prop);
+      return;
+    }
+
+    if (name === 'textAlign' && t.isConditionalExpression(prop.value)) {
+      if (convertTextAlignTernary(prop, report, filePath)) changed = true;
+      newProperties.push(prop);
+      return;
+    }
+
+    newProperties.push(prop);
+  });
+
+  if (changed) {
+    objExpr.properties = newProperties;
+  }
+}
+
+function transformJs(code, filePath) {
+  const report = { converted: [], skipped: [], removed: [] };
+  const ast = recast.parse(code, { parser: babelParser });
+
+  traverse(ast, {
+    ObjectExpression(path) {
+      processObjectExpression(path.node, report, filePath);
+    },
+  });
+
+  const output = recast.print(ast).code;
+  return { code: output, report };
+}
+
+module.exports = { transformJs };