@elementor/editor-canvas 4.1.0-700 → 4.1.0-702

package/dist/index.js

@@ -1633,6 +1633,9 @@ var shadowTransformer = createTransformer((value) => {
 
 // src/transformers/styles/size-transformer.ts
 var sizeTransformer = createTransformer((value) => {
+  if (value.unit === "auto") {
+    return "auto";
+  }
   return value.unit === "custom" ? value.size : `${value.size}${value.unit}`;
 });
 

package/dist/index.mjs

@@ -1599,6 +1599,9 @@ var shadowTransformer = createTransformer((value) => {
 
 // src/transformers/styles/size-transformer.ts
 var sizeTransformer = createTransformer((value) => {
+  if (value.unit === "auto") {
+    return "auto";
+  }
   return value.unit === "custom" ? value.size : `${value.size}${value.unit}`;
 });
 

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@elementor/editor-canvas",
   "description": "Elementor Editor Canvas",
-  "version": "4.1.0-700",
+  "version": "4.1.0-702",
   "private": false,
   "author": "Elementor Team",
   "homepage": "https://elementor.com/",
@@ -37,24 +37,24 @@
     "react-dom": "^18.3.1"
   },
   "dependencies": {
-    "@elementor/editor": "4.1.0-700",
-    "@elementor/editor-controls": "4.1.0-700",
-    "@elementor/editor-documents": "4.1.0-700",
-    "@elementor/editor-elements": "4.1.0-700",
-    "@elementor/editor-interactions": "4.1.0-700",
-    "@elementor/editor-mcp": "4.1.0-700",
-    "@elementor/editor-notifications": "4.1.0-700",
-    "@elementor/editor-props": "4.1.0-700",
-    "@elementor/editor-responsive": "4.1.0-700",
-    "@elementor/editor-styles": "4.1.0-700",
-    "@elementor/editor-styles-repository": "4.1.0-700",
-    "@elementor/editor-ui": "4.1.0-700",
-    "@elementor/editor-v1-adapters": "4.1.0-700",
-    "@elementor/schema": "4.1.0-700",
-    "@elementor/twing": "4.1.0-700",
+    "@elementor/editor": "4.1.0-702",
+    "@elementor/editor-controls": "4.1.0-702",
+    "@elementor/editor-documents": "4.1.0-702",
+    "@elementor/editor-elements": "4.1.0-702",
+    "@elementor/editor-interactions": "4.1.0-702",
+    "@elementor/editor-mcp": "4.1.0-702",
+    "@elementor/editor-notifications": "4.1.0-702",
+    "@elementor/editor-props": "4.1.0-702",
+    "@elementor/editor-responsive": "4.1.0-702",
+    "@elementor/editor-styles": "4.1.0-702",
+    "@elementor/editor-styles-repository": "4.1.0-702",
+    "@elementor/editor-ui": "4.1.0-702",
+    "@elementor/editor-v1-adapters": "4.1.0-702",
+    "@elementor/schema": "4.1.0-702",
+    "@elementor/twing": "4.1.0-702",
     "@elementor/ui": "1.36.17",
-    "@elementor/utils": "4.1.0-700",
-    "@elementor/wp-media": "4.1.0-700",
+    "@elementor/utils": "4.1.0-702",
+    "@elementor/wp-media": "4.1.0-702",
     "@floating-ui/react": "^0.27.5",
     "@wordpress/i18n": "^5.13.0"
   },

package/src/transformers/styles/__tests__/size-transformer.test.ts

@@ -0,0 +1,24 @@
+import { sizeTransformer } from '../size-transformer';
+
+function run( val: { size?: number; unit?: string } ) {
+	return sizeTransformer( val, { key: 'width', signal: undefined } );
+}
+
+describe( 'sizeTransformer', () => {
+	it( 'returns "auto" when unit is auto and size is null', () => {
+		expect( run( { size: undefined, unit: 'auto' } ) ).toBe( 'auto' );
+	} );
+
+	it( 'returns "auto" when unit is auto and size is undefined', () => {
+		expect( run( { unit: 'auto' } ) ).toBe( 'auto' );
+	} );
+
+	it( 'concatenates size and unit for normal units', () => {
+		expect( run( { size: 100, unit: 'px' } ) ).toBe( '100px' );
+		expect( run( { size: 50, unit: '%' } ) ).toBe( '50%' );
+	} );
+
+	it( 'returns only size for custom unit', () => {
+		expect( run( { size: 100, unit: 'custom' } ) ).toBe( 100 );
+	} );
+} );

package/src/transformers/styles/size-transformer.ts

@@ -6,5 +6,8 @@ type Size = {
 };
 
 export const sizeTransformer = createTransformer( ( value: Size ) => {
+	if ( value.unit === 'auto' ) {
+		return 'auto';
+	}
 	return value.unit === 'custom' ? value.size : `${ value.size }${ value.unit }`;
 } );