bctranslate 1.0.0

package/src/parsers/html.js

@@ -0,0 +1,118 @@
+import MagicString from 'magic-string';
+import { parse, NodeTypes } from '@vue/compiler-dom';
+import { hashKey, isTranslatable } from '../utils.js';
+
+const ATTR_WHITELIST = new Set([
+  'title',
+  'placeholder',
+  'label',
+  'alt',
+  'aria-label',
+  'aria-placeholder',
+  'aria-description',
+]);
+
+const CONTENT_TAGS = new Set([
+  'title',
+  'h1',
+  'h2',
+  'h3',
+  'h4',
+  'h5',
+  'h6',
+  'p',
+  'a',
+  'button',
+  'label',
+  'option',
+  'li',
+  'th',
+  'td',
+]);
+
+const SKIP_TAGS = new Set(['script', 'style', 'noscript']);
+
+function stripTags(html) {
+  return html.replace(/<[^>]*>/g, ' ').replace(/\s+/g, ' ').trim();
+}
+
+/**
+ * Parse an HTML file and extract translatable strings.
+ * For vanilla HTML, we use data-i18n attributes instead of $t() calls.
+ */
+export function parseHtml(source, filePath, project) {
+  const extracted = [];
+  const s = new MagicString(source);
+
+  const ast = parse(source, { comments: false });
+
+  function visit(node) {
+    if (!node) return;
+    if (Array.isArray(node)) {
+      for (const child of node) visit(child);
+      return;
+    }
+
+    if (node.type === NodeTypes.ROOT) {
+      visit(node.children);
+      return;
+    }
+
+    if (node.type !== NodeTypes.ELEMENT) return;
+
+    const tag = (node.tag || '').toLowerCase();
+    if (SKIP_TAGS.has(tag)) return;
+
+    const openTagEnd = source.indexOf('>', node.loc.start.offset);
+    if (openTagEnd < 0 || openTagEnd > node.loc.end.offset) {
+      visit(node.children);
+      return;
+    }
+
+    const openTagText = source.slice(node.loc.start.offset, openTagEnd);
+
+    // 1) Extract translatable attributes
+    for (const prop of node.props || []) {
+      if (prop.type !== NodeTypes.ATTRIBUTE) continue;
+      const name = prop.name;
+      if (!ATTR_WHITELIST.has(name)) continue;
+      const value = prop.value?.content;
+      if (!value || !isTranslatable(value)) continue;
+
+      const marker = `data-i18n-${name}`;
+      if (openTagText.includes(marker)) continue;
+
+      const key = hashKey(value);
+      s.appendRight(prop.loc.end.offset, ` ${marker}="${key}"`);
+      extracted.push({ key, text: value, context: `html-attr-${name}` });
+    }
+
+    // 2) Extract element inner HTML for common content tags
+    if (CONTENT_TAGS.has(tag) && !node.isSelfClosing) {
+      const closeRel = node.loc.source.lastIndexOf('</');
+      if (closeRel > -1) {
+        const closeTagStart = node.loc.start.offset + closeRel;
+        const innerHtml = source.slice(openTagEnd + 1, closeTagStart);
+        const text = innerHtml.trim();
+        const plain = stripTags(text);
+
+        const marker = tag === 'title' ? 'data-i18n-title' : 'data-i18n';
+        if (!openTagText.includes(marker) && isTranslatable(plain)) {
+          const key = hashKey(text);
+          s.appendLeft(openTagEnd, ` ${marker}="${key}"`);
+          extracted.push({ key, text, context: `html-inner-${tag}` });
+        }
+      }
+    }
+
+    visit(node.children);
+  }
+
+  visit(ast);
+
+  return {
+    source: extracted.length > 0 ? s.toString() : source,
+    extracted,
+    modified: extracted.length > 0,
+  };
+}

package/src/parsers/js.js

@@ -0,0 +1,128 @@
+import * as babelParser from '@babel/parser';
+import _traverse from '@babel/traverse';
+import * as t from '@babel/types';
+import MagicString from 'magic-string';
+import { hashKey, isTranslatable } from '../utils.js';
+
+const traverse = _traverse.default || _traverse;
+
+/**
+ * Parse a .js/.ts file and extract translatable strings.
+ * These are strings in common UI patterns: alert(), confirm(), DOM manipulation, etc.
+ */
+export function parseJs(source, filePath, project) {
+  const extracted = [];
+  const isTS = filePath.endsWith('.ts');
+
+  let ast;
+  try {
+    ast = babelParser.parse(source, {
+      sourceType: 'module',
+      plugins: [
+        isTS ? 'typescript' : null,
+        'classProperties',
+        'optionalChaining',
+        'nullishCoalescingOperator',
+        'decorators-legacy',
+        'dynamicImport',
+      ].filter(Boolean),
+    });
+  } catch {
+    return { source, extracted: [], modified: false };
+  }
+
+  const s = new MagicString(source);
+
+  // Track which string literals to translate
+  traverse(ast, {
+    // Object property values with translatable keys
+    ObjectProperty(path) {
+      const keyNode = path.node.key;
+      const valueNode = path.node.value;
+
+      if (valueNode.type !== 'StringLiteral') return;
+      if (!isTranslatable(valueNode.value)) return;
+
+      // Check if the key name suggests translatable content
+      const keyName = keyNode.name || keyNode.value || '';
+      const translatableKeys = new Set([
+        'title', 'label', 'placeholder', 'message', 'text',
+        'description', 'tooltip', 'hint', 'caption', 'header',
+        'subtitle', 'errorMessage', 'successMessage', 'content',
+        'heading', 'subheading', 'buttonText', 'linkText',
+        'name', 'displayName',
+      ]);
+
+      if (!translatableKeys.has(keyName)) return;
+
+      const key = hashKey(valueNode.value);
+      const tFunc = project.type === 'vue' ? `this.$t('${key}')` : `t('${key}')`;
+
+      s.overwrite(valueNode.start, valueNode.end, tFunc);
+      extracted.push({ key, text: valueNode.value, context: `js-prop-${keyName}` });
+    },
+
+    // Function calls: alert('text'), console messages excluded
+    CallExpression(path) {
+      const callee = path.node.callee;
+      let calleeName = '';
+
+      if (callee.type === 'Identifier') {
+        calleeName = callee.name;
+      } else if (callee.type === 'MemberExpression' && callee.property) {
+        calleeName = `${callee.object?.name || ''}.${callee.property.name}`;
+      }
+
+      // Skip console.*, require(), import()
+      if (calleeName.startsWith('console.') || calleeName === 'require') return;
+
+      // Translate alert/confirm/prompt first arg
+      if (['alert', 'confirm', 'prompt'].includes(calleeName)) {
+        const arg = path.node.arguments[0];
+        if (arg && arg.type === 'StringLiteral' && isTranslatable(arg.value)) {
+          const key = hashKey(arg.value);
+          const tFunc = project.type === 'vue' ? `this.$t('${key}')` : `t('${key}')`;
+          s.overwrite(arg.start, arg.end, tFunc);
+          extracted.push({ key, text: arg.value, context: 'js-call' });
+        }
+      }
+
+      // .textContent = 'text', .innerText = 'text', .title = 'text'
+    },
+
+    // Assignment: element.textContent = 'text'
+    AssignmentExpression(path) {
+      const left = path.node.left;
+      const right = path.node.right;
+
+      if (right.type !== 'StringLiteral') return;
+      if (!isTranslatable(right.value)) return;
+
+      if (left.type === 'MemberExpression' && left.property) {
+        const propName = left.property.name || left.property.value;
+        const domProps = new Set([
+          'textContent', 'innerText', 'title', 'placeholder',
+          'alt', 'innerHTML',
+        ]);
+
+        if (domProps.has(propName)) {
+          const key = hashKey(right.value);
+          const tFunc = project.type === 'vanilla'
+            ? `i18n.t('${key}')`
+            : project.type === 'vue'
+              ? `this.$t('${key}')`
+              : `t('${key}')`;
+
+          s.overwrite(right.start, right.end, tFunc);
+          extracted.push({ key, text: right.value, context: `js-dom-${propName}` });
+        }
+      }
+    },
+  });
+
+  return {
+    source: extracted.length > 0 ? s.toString() : source,
+    extracted,
+    modified: extracted.length > 0,
+  };
+}

package/src/parsers/json.js

@@ -0,0 +1,93 @@
+import { hashKey, isTranslatable } from '../utils.js';
+
+/**
+ * Parse a JSON file and extract translatable string values.
+ * Handles nested objects. Does NOT translate:
+ * - Keys (object property names)
+ * - Array items that look like identifiers/codes
+ * - Non-string values
+ * - Strings that look like code, URLs, paths, etc.
+ */
+export function parseJson(source, filePath, options = {}) {
+  const { jsonMode = 'values' } = options;
+  let data;
+
+  try {
+    data = JSON.parse(source);
+  } catch {
+    return { source, extracted: [], modified: false, jsonData: null };
+  }
+
+  const extracted = [];
+
+  // Walk the JSON and collect translatable strings
+  walkJson(data, [], extracted, jsonMode);
+
+  return {
+    source,
+    extracted,
+    modified: extracted.length > 0,
+    jsonData: data,
+  };
+}
+
+function walkJson(obj, path, extracted, mode) {
+  if (obj === null || obj === undefined) return;
+
+  if (typeof obj === 'string') {
+    if (isTranslatable(obj) && obj.length > 1) {
+      const key = path.join('.');
+      extracted.push({ key, text: obj, context: 'json-value', jsonPath: path });
+    }
+    return;
+  }
+
+  if (Array.isArray(obj)) {
+    // For arrays, only translate string items that look like real text
+    for (let i = 0; i < obj.length; i++) {
+      const item = obj[i];
+      if (typeof item === 'string' && isTranslatable(item) && item.includes(' ')) {
+        // Only translate multi-word strings in arrays (skip identifiers)
+        const key = [...path, i].join('.');
+        extracted.push({ key, text: item, context: 'json-array', jsonPath: [...path, i] });
+      } else if (typeof item === 'object') {
+        walkJson(item, [...path, i], extracted, mode);
+      }
+    }
+    return;
+  }
+
+  if (typeof obj === 'object') {
+    for (const [k, v] of Object.entries(obj)) {
+      walkJson(v, [...path, k], extracted, mode);
+    }
+  }
+}
+
+/**
+ * Apply translations to a JSON object by path.
+ */
+export function applyJsonTranslations(data, translations) {
+  const result = JSON.parse(JSON.stringify(data)); // deep clone
+
+  for (const [dotPath, translatedText] of Object.entries(translations)) {
+    const parts = dotPath.split('.');
+    let target = result;
+
+    for (let i = 0; i < parts.length - 1; i++) {
+      const key = isNaN(parts[i]) ? parts[i] : parseInt(parts[i]);
+      if (target[key] === undefined) break;
+      target = target[key];
+    }
+
+    const lastKey = isNaN(parts[parts.length - 1])
+      ? parts[parts.length - 1]
+      : parseInt(parts[parts.length - 1]);
+
+    if (target && target[lastKey] !== undefined) {
+      target[lastKey] = translatedText;
+    }
+  }
+
+  return result;
+}

package/src/parsers/react.js

@@ -0,0 +1,153 @@
+import * as babelParser from '@babel/parser';
+import _traverse from '@babel/traverse';
+import _generate from '@babel/generator';
+import * as t from '@babel/types';
+import MagicString from 'magic-string';
+import { hashKey, isTranslatable } from '../utils.js';
+
+// Handle ESM default export quirks
+const traverse = _traverse.default || _traverse;
+const generate = _generate.default || _generate;
+
+/**
+ * Non-translatable JSX attribute names.
+ */
+const ATTR_BLACKLIST = new Set([
+  'className', 'id', 'style', 'key', 'ref', 'src', 'href',
+  'type', 'name', 'value', 'htmlFor', 'tabIndex', 'role',
+  'data-testid', 'data-cy', 'onClick', 'onChange', 'onSubmit',
+  'onFocus', 'onBlur', 'onKeyDown', 'onKeyUp', 'onMouseEnter',
+  'onMouseLeave', 'target', 'rel', 'method', 'action',
+]);
+
+const ATTR_WHITELIST = new Set([
+  'title', 'placeholder', 'label', 'alt', 'aria-label',
+  'aria-placeholder', 'aria-description',
+]);
+
+/**
+ * Parse a JSX/TSX file and extract translatable strings.
+ */
+export function parseReact(source, filePath) {
+  const extracted = [];
+  const isTS = filePath.endsWith('.tsx') || filePath.endsWith('.ts');
+
+  let ast;
+  try {
+    ast = babelParser.parse(source, {
+      sourceType: 'module',
+      plugins: [
+        'jsx',
+        isTS ? 'typescript' : null,
+        'classProperties',
+        'optionalChaining',
+        'nullishCoalescingOperator',
+        'decorators-legacy',
+      ].filter(Boolean),
+    });
+  } catch (err) {
+    // If Babel fails, return unmodified
+    return { source, extracted: [], modified: false };
+  }
+
+  const s = new MagicString(source);
+  let needsImport = false;
+
+  traverse(ast, {
+    // JSX text children: <div>Hello World</div>
+    JSXText(path) {
+      const text = path.node.value.trim();
+      if (!isTranslatable(text)) return;
+
+      const key = hashKey(text);
+      const start = path.node.start;
+      const end = path.node.end;
+
+      // Preserve whitespace
+      const original = path.node.value;
+      const leadingWs = original.match(/^(\s*)/)[1];
+      const trailingWs = original.match(/(\s*)$/)[1];
+
+      s.overwrite(start, end, `${leadingWs}{t('${key}')}${trailingWs}`);
+      extracted.push({ key, text, context: 'jsx-text' });
+      needsImport = true;
+    },
+
+    // JSX string attributes: <input placeholder="Enter name" />
+    JSXAttribute(path) {
+      const name = path.node.name?.name;
+      if (!name) return;
+
+      if (ATTR_BLACKLIST.has(name)) return;
+
+      // Only translate whitelisted attrs, or unknown attrs if they have translatable values
+      const value = path.node.value;
+      if (!value || value.type !== 'StringLiteral') return;
+
+      const text = value.value;
+      if (!isTranslatable(text)) return;
+      if (!ATTR_WHITELIST.has(name) && text.length < 3) return;
+
+      const key = hashKey(text);
+      const attrStart = path.node.start;
+      const attrEnd = path.node.end;
+
+      s.overwrite(attrStart, attrEnd, `${name}={t('${key}')}`);
+      extracted.push({ key, text, context: `jsx-attr-${name}` });
+      needsImport = true;
+    },
+
+    // String literals in common patterns (not JSX)
+    CallExpression(path) {
+      const callee = path.node.callee;
+      const calleeName = callee.name || (callee.property && callee.property.name);
+
+      // alert('...'), confirm('...'), toast('...')
+      if (['alert', 'confirm'].includes(calleeName)) {
+        const arg = path.node.arguments[0];
+        if (arg && arg.type === 'StringLiteral' && isTranslatable(arg.value)) {
+          const key = hashKey(arg.value);
+          s.overwrite(arg.start, arg.end, `t('${key}')`);
+          extracted.push({ key, text: arg.value, context: 'call-arg' });
+          needsImport = true;
+        }
+      }
+    },
+  });
+
+  // Add useTranslation import if needed
+  if (needsImport) {
+    const hasUseTranslation = source.includes('useTranslation');
+    if (!hasUseTranslation) {
+      // Find the first import statement or top of file
+      let insertPos = 0;
+      const importMatch = source.match(/^import\s.+$/m);
+      if (importMatch) {
+        // Insert after all imports
+        const lastImportMatch = [...source.matchAll(/^import\s.+$/gm)];
+        if (lastImportMatch.length > 0) {
+          const last = lastImportMatch[lastImportMatch.length - 1];
+          insertPos = last.index + last[0].length;
+        }
+      }
+
+      s.appendRight(insertPos, `\nimport { useTranslation } from 'react-i18next';\n`);
+    }
+
+    // Add const { t } = useTranslation() if not present
+    if (!source.includes('useTranslation()')) {
+      // Find the function body
+      const funcMatch = source.match(/(?:function\s+\w+|const\s+\w+\s*=\s*(?:\([^)]*\)\s*=>|\w+\s*=>))\s*\{/);
+      if (funcMatch) {
+        const insertAt = funcMatch.index + funcMatch[0].length;
+        s.appendRight(insertAt, `\n  const { t } = useTranslation();\n`);
+      }
+    }
+  }
+
+  return {
+    source: extracted.length > 0 ? s.toString() : source,
+    extracted,
+    modified: extracted.length > 0,
+  };
+}