babel-plugin-formatjs 11.0.7 → 11.1.0

package/index.js

@@ -3,7 +3,6 @@ import babelPluginSyntaxJsxNs from '@babel/plugin-syntax-jsx';
 import { visitor as CallExpression } from './visitors/call-expression.js';
 import { visitor as JSXOpeningElement } from './visitors/jsx-opening-element.js';
 const babelPluginSyntaxJsx = babelPluginSyntaxJsxNs.default || babelPluginSyntaxJsxNs;
-console.log(babelPluginSyntaxJsxNs);
 export const DEFAULT_ID_INTERPOLATION_PATTERN = '[sha512:contenthash:base64:6]';
 const plugin = 
 // @ts-expect-error PluginPass doesn't allow custom state but it actually does
@@ -65,6 +64,8 @@ declare((api, options) => {
             },
             JSXOpeningElement,
             CallExpression,
+            // GH #4471: Handle optional chaining calls (e.g., intl.formatMessage?.())
+            OptionalCallExpression: CallExpression,
         },
     };
 });

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "babel-plugin-formatjs",
   "description": "Extracts string messages for translation from modules that use formatjs.",
-  "version": "11.0.7",
+  "version": "11.1.0",
   "license": "MIT",
   "author": "Long Ho <holevietlong@gmail.com>",
   "type": "module",
@@ -16,8 +16,8 @@
     "@types/babel__helper-plugin-utils": "^7.10.3",
     "@types/babel__traverse": "^7.20.6",
     "tslib": "^2.8.0",
-    "@formatjs/icu-messageformat-parser": "3.2.0",
-    "@formatjs/ts-transformer": "4.0.7"
+    "@formatjs/ts-transformer": "4.1.0",
+    "@formatjs/icu-messageformat-parser": "3.2.1"
   },
   "bugs": "https://github.com/formatjs/formatjs/issues",
   "gitHead": "8b0baec8eda5002715cf893274fe59782fc2d371",

package/types.d.ts

@@ -27,4 +27,5 @@ export interface Options {
     extractSourceLocation?: boolean;
     ast?: boolean;
     preserveWhitespace?: boolean;
+    flatten?: boolean;
 }

package/utils.d.ts

@@ -6,7 +6,7 @@ export declare function createMessageDescriptor(propPaths: [
     NodePath<t.JSXIdentifier> | NodePath<t.Identifier>,
     NodePath<t.StringLiteral> | NodePath<t.JSXExpressionContainer>
 ][]): MessageDescriptorPath;
-export declare function evaluateMessageDescriptor(descriptorPath: MessageDescriptorPath, isJSXSource: boolean | undefined, filename: string | undefined, idInterpolationPattern?: string, overrideIdFn?: Options['overrideIdFn'], preserveWhitespace?: Options['preserveWhitespace']): MessageDescriptor;
+export declare function evaluateMessageDescriptor(descriptorPath: MessageDescriptorPath, isJSXSource: boolean | undefined, filename: string | undefined, idInterpolationPattern?: string, overrideIdFn?: Options['overrideIdFn'], preserveWhitespace?: Options['preserveWhitespace'], flatten?: Options['flatten']): MessageDescriptor;
 /**
  * Tag a node as extracted
  * Store this in the node itself so that multiple passes work. Specifically

package/utils.js

@@ -1,4 +1,6 @@
 import { parse } from '@formatjs/icu-messageformat-parser';
+import { hoistSelectors } from '@formatjs/icu-messageformat-parser/manipulator.js';
+import { printAST } from '@formatjs/icu-messageformat-parser/printer.js';
 import { interpolateName } from '@formatjs/ts-transformer';
 const DESCRIPTOR_PROPS = new Set([
     'id',
@@ -46,12 +48,23 @@ export function createMessageDescriptor(propPaths) {
         description: undefined,
     });
 }
-export function evaluateMessageDescriptor(descriptorPath, isJSXSource = false, filename, idInterpolationPattern, overrideIdFn, preserveWhitespace) {
+export function evaluateMessageDescriptor(descriptorPath, isJSXSource = false, filename, idInterpolationPattern, overrideIdFn, preserveWhitespace, flatten) {
     let id = getMessageDescriptorValue(descriptorPath.id);
-    const defaultMessage = getICUMessageValue(descriptorPath.defaultMessage, {
+    let defaultMessage = getICUMessageValue(descriptorPath.defaultMessage, {
         isJSXSource,
     }, preserveWhitespace);
     const description = getMessageDescriptorValue(descriptorPath.description);
+    // GH #3537: Apply flatten transformation before calling overrideIdFn
+    // so that the ID generation sees the same message format as the final output
+    if (flatten && defaultMessage) {
+        try {
+            defaultMessage = printAST(hoistSelectors(parse(defaultMessage)));
+        }
+        catch (e) {
+            // If flatten fails, continue with original message
+            // The error will be caught again during validation
+        }
+    }
     if (overrideIdFn) {
         id = overrideIdFn(id, defaultMessage, description, filename);
     }

package/visitors/call-expression.js

@@ -10,7 +10,9 @@ function isFormatMessageCall(callee, functionNames) {
     if (functionNames.find(name => callee.isIdentifier({ name }))) {
         return true;
     }
-    if (callee.isMemberExpression()) {
+    // GH #4471: Handle both MemberExpression and OptionalMemberExpression
+    // (e.g., intl.formatMessage() and intl.formatMessage?.())
+    if (callee.isMemberExpression() || callee.isOptionalMemberExpression()) {
         const property = callee.get('property');
         return !!functionNames.find(name => property.isIdentifier({ name }));
     }
@@ -26,7 +28,7 @@ function getMessagesObjectFromExpression(nodePath) {
     return currentPath;
 }
 export const visitor = function (path, { opts, file: { opts: { filename }, }, }) {
-    const { overrideIdFn, idInterpolationPattern, removeDefaultMessage, ast, preserveWhitespace, } = opts;
+    const { overrideIdFn, idInterpolationPattern, removeDefaultMessage, ast, preserveWhitespace, flatten, } = opts;
     if (wasExtracted(path)) {
         return;
     }
@@ -46,7 +48,7 @@ export const visitor = function (path, { opts, file: { opts: { filename }, }, })
             return;
         }
         // Evaluate the Message Descriptor values, then store it.
-        const descriptor = evaluateMessageDescriptor(descriptorPath, false, filename || undefined, idInterpolationPattern, overrideIdFn, preserveWhitespace);
+        const descriptor = evaluateMessageDescriptor(descriptorPath, false, filename || undefined, idInterpolationPattern, overrideIdFn, preserveWhitespace, flatten);
         storeMessage(descriptor, messageDescriptor, opts, filename || undefined, messages);
         const firstProp = properties[0];
         const defaultMessageProp = properties.find(prop => {

package/visitors/jsx-opening-element.js

@@ -2,7 +2,7 @@ import * as t from '@babel/types';
 import { parse } from '@formatjs/icu-messageformat-parser';
 import { createMessageDescriptor, evaluateMessageDescriptor, getMessageDescriptorKey, storeMessage, tagAsExtracted, wasExtracted, } from '../utils.js';
 export const visitor = function (path, { opts, file: { opts: { filename }, }, }) {
-    const { removeDefaultMessage, idInterpolationPattern, overrideIdFn, ast, preserveWhitespace, } = opts;
+    const { removeDefaultMessage, idInterpolationPattern, overrideIdFn, ast, preserveWhitespace, flatten, } = opts;
     const { componentNames, messages } = this;
     if (wasExtracted(path)) {
         return;
@@ -29,7 +29,7 @@ export const visitor = function (path, { opts, file: { opts: { filename }, }, })
     }
     // Evaluate the Message Descriptor values in a JSX
     // context, then store it.
-    const descriptor = evaluateMessageDescriptor(descriptorPath, true, filename || undefined, idInterpolationPattern, overrideIdFn, preserveWhitespace);
+    const descriptor = evaluateMessageDescriptor(descriptorPath, true, filename || undefined, idInterpolationPattern, overrideIdFn, preserveWhitespace, flatten);
     storeMessage(descriptor, path, opts, filename || undefined, messages);
     let idAttr;
     let descriptionAttr;