@contentful/experiences-visual-editor-react 3.3.1-dev-20250825T1222-bc8206a.0 → 3.4.0-dev-20250825T1512-8bcc4b9.0

package/dist/index.js

@@ -1011,6 +1011,18 @@ var CodeNames$1;
     CodeNames["Custom"] = "custom";
 })(CodeNames$1 || (CodeNames$1 = {}));
 
+const sdkOptionsRegistry = {};
+/**
+ * Used inside defineComponents to forward registry arguments to this registry
+ * of SDK options.
+ */
+const defineSdkOptions = (options) => {
+    Object.assign(sdkOptionsRegistry, options);
+};
+const getSdkOptions = () => {
+    return { ...sdkOptionsRegistry };
+};
+
 const MEDIA_QUERY_REGEXP = /(<|>)(\d{1,})(px|cm|mm|in|pt|pc)$/;
 const toCSSMediaQuery = ({ query }) => {
     if (query === '*')
@@ -1595,6 +1607,20 @@ const transformBackgroundImage = (cfBackgroundImageUrl, cfBackgroundImageOptions
         backgroundSize: matchBackgroundSize(cfBackgroundImageOptions?.scaling),
     };
 };
+const transformTextAlign = (value) => {
+    if (!value)
+        return undefined;
+    const sdkOptions = getSdkOptions();
+    // New behavior: translate left/right to start/end
+    // Customer can opt-out by activating this global option toggle
+    if (!sdkOptions.__disableTextAlignmentTransform) {
+        if (value === 'left')
+            return 'start';
+        if (value === 'right')
+            return 'end';
+    }
+    return value;
+};
 
 const toCSSAttribute = (key) => {
     let val = key.replace(/[A-Z]/g, (m) => '-' + m.toLowerCase());
@@ -1672,7 +1698,7 @@ const buildCfStyles = (values) => {
         lineHeight: values.cfLineHeight,
         letterSpacing: values.cfLetterSpacing,
         color: values.cfTextColor,
-        textAlign: values.cfTextAlign,
+        textAlign: transformTextAlign(values.cfTextAlign),
         textTransform: values.cfTextTransform,
         objectFit: values.cfImageOptions?.objectFit,
         objectPosition: values.cfImageOptions?.objectPosition,
@@ -3240,12 +3266,14 @@ const useEditorStore = create((set, get) => ({
         }
         set({ locale });
     },
-    initializeEditor({ componentRegistry: initialRegistry, designTokens, initialLocale }) {
+    initializeEditor({ componentRegistry: initialRegistry, designTokens, sdkOptions, initialLocale, }) {
         initialRegistry.forEach((registration) => {
             componentRegistry.set(registration.definition.id, registration);
         });
         // Re-register the design tokens with the Visual Editor's instance of the experiences-core package
         defineDesignTokens(designTokens);
+        // Same copy over from one instance to the other is necessary for the sdk options
+        defineSdkOptions(sdkOptions);
         set({ locale: initialLocale });
     },
 }));
@@ -5171,11 +5199,12 @@ const useInitializeEditor = (inMemoryEntitiesStore) => {
         const onVisualEditorInitialize = (event) => {
             if (!event.detail)
                 return;
-            const { componentRegistry, designTokens, locale: initialLocale, entities } = event.detail;
+            const { componentRegistry, designTokens, sdkOptions, locale: initialLocale, entities, } = event.detail;
             initializeEditor({
                 initialLocale,
                 componentRegistry,
                 designTokens,
+                sdkOptions,
             });
             // if entities is set to [], then everything will still work as EntityStore will
             // request entities on demand via ▲REQUEST_ENTITY