@builder.io/mitosis 0.5.28 → 0.5.29

package/dist/src/generators/builder/generator.js

@@ -277,14 +277,23 @@ function tryFormat(code) {
     }
     return str;
 }
+const processLocalizedValues = (element, node) => {
+    if (node.localizedValues) {
+        for (const [path, value] of Object.entries(node.localizedValues)) {
+            (0, lodash_1.set)(element, path, value);
+        }
+    }
+    return element;
+};
 const blockToBuilder = (json, options = {}, _internalOptions = {}) => {
     var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
     const mapper = !_internalOptions.skipMapper && componentMappers[json.name];
     if (mapper) {
-        return mapper(json, options);
+        const element = mapper(json, options);
+        return processLocalizedValues(element, json);
     }
     if (json.properties._text || ((_a = json.bindings._text) === null || _a === void 0 ? void 0 : _a.code)) {
-        return el({
+        const element = el({
             tagName: 'span',
             bindings: {
                 ...(((_b = json.bindings._text) === null || _b === void 0 ? void 0 : _b.code)
@@ -302,6 +311,7 @@ const blockToBuilder = (json, options = {}, _internalOptions = {}) => {
                 },
             },
         }, options);
+        return processLocalizedValues(element, json);
     }
     const thisIsComponent = (0, is_component_1.isComponent)(json);
     let bindings = json.bindings;
@@ -381,7 +391,7 @@ const blockToBuilder = (json, options = {}, _internalOptions = {}) => {
             }
         }
     }
-    return el({
+    const element = el({
         tagName: thisIsComponent ? undefined : json.name,
         ...(hasCss && {
             responsiveStyles,
@@ -406,6 +416,7 @@ const blockToBuilder = (json, options = {}, _internalOptions = {}) => {
             .filter(filter_empty_text_nodes_1.filterEmptyTextNodes)
             .map((child) => (0, exports.blockToBuilder)(child, options)),
     }, options);
+    return processLocalizedValues(element, json);
 };
 exports.blockToBuilder = blockToBuilder;
 const componentToBuilder = (options = {}) => ({ component }) => {

package/dist/src/helpers/set.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Minimal implementation of lodash's _.set
+ * https://lodash.com/docs/4.17.15#set
+ *
+ * See ./set.test.ts for usage examples
+ */
+export declare const set: (obj: any, _path: string | string[], value: any) => any;

package/dist/src/helpers/set.js

@@ -0,0 +1,24 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.set = void 0;
+/**
+ * Minimal implementation of lodash's _.set
+ * https://lodash.com/docs/4.17.15#set
+ *
+ * See ./set.test.ts for usage examples
+ */
+const set = (obj, _path, value) => {
+    if (Object(obj) !== obj) {
+        return obj;
+    }
+    const path = Array.isArray(_path)
+        ? _path
+        : _path.toString().match(/[^.[\]]+/g);
+    path
+        .slice(0, -1)
+        .reduce((a, c, i) => Object(a[c]) === a[c]
+        ? a[c]
+        : (a[c] = Math.abs(Number(path[i + 1])) >> 0 === +path[i + 1] ? [] : {}), obj)[path[path.length - 1]] = value;
+    return obj;
+};
+exports.set = set;

package/dist/src/parsers/builder/builder.js

@@ -444,10 +444,11 @@ const componentMappers = {
         });
     },
     Text: (block, options) => {
-        var _a;
+        var _a, _b, _c;
         let css = getCssFromBlock(block);
         const styleString = getStyleStringFromBlock(block, options);
         const actionBindings = getActionBindingsFromBlock(block, options);
+        const localizedValues = {};
         const blockBindings = {
             ...mapBuilderBindingsToMitosisBindingWithCode(block.bindings),
             ...mapBuilderBindingsToMitosisBindingWithCode((_a = block.code) === null || _a === void 0 ? void 0 : _a.bindings),
@@ -471,6 +472,15 @@ const componentMappers = {
             }),
         };
         const properties = { ...block.properties };
+        for (const key in properties) {
+            if (typeof properties[key] === 'object' &&
+                properties[key] !== null &&
+                properties[key]['@type'] === '@builder.io/core:LocalizedValue') {
+                const localizedValue = properties[key];
+                localizedValues[`properties.${key}`] = localizedValue;
+                properties[key] = localizedValue.Default;
+            }
+        }
         if (options.includeBuilderExtras && block.id)
             properties['builder-id'] = block.id;
         if (block.class)
@@ -485,7 +495,13 @@ const componentMappers = {
                 code: wrapBindingIfNeeded(componentOptionsText.code, options),
             });
         }
-        const text = block.component.options.text;
+        let text = ((_b = block.component.options) === null || _b === void 0 ? void 0 : _b.text) || '';
+        if (typeof text === 'object' &&
+            text !== null &&
+            text['@type'] === '@builder.io/core:LocalizedValue') {
+            localizedValues['component.options.text'] = (_c = block.component.options) === null || _c === void 0 ? void 0 : _c.text;
+            text = text.Default;
+        }
         // Builder uses {{}} for bindings, but Mitosis expects {} so we need to convert
         const innerProperties = innerBindings._text
             ? {}
@@ -498,6 +514,7 @@ const componentMappers = {
                 bindings,
                 properties,
                 meta: (0, exports.getMetaFromBlock)(block, options),
+                ...(Object.keys(localizedValues).length && { localizedValues }),
                 children: [
                     (0, create_mitosis_node_1.createMitosisNode)({
                         bindings: innerBindings,
@@ -505,6 +522,7 @@ const componentMappers = {
                             ...innerProperties,
                             class: 'builder-text',
                         },
+                        ...(Object.keys(localizedValues).length && { localizedValues }),
                     }),
                 ],
             });
@@ -534,6 +552,7 @@ const componentMappers = {
                     (0, create_mitosis_node_1.createMitosisNode)({
                         bindings: innerBindings,
                         properties: innerProperties,
+                        ...(Object.keys(localizedValues).length && { localizedValues }),
                     }),
                 ],
             });
@@ -550,12 +569,14 @@ const componentMappers = {
                 ...innerBindings,
             },
             meta: (0, exports.getMetaFromBlock)(block, options),
+            ...(Object.keys(localizedValues).length && { localizedValues }),
         });
     },
 };
 const builderElementToMitosisNode = (block, options, _internalOptions = {}) => {
     var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v;
     const { includeSpecialBindings = true } = options;
+    const localizedValues = {};
     if (((_a = block.component) === null || _a === void 0 ? void 0 : _a.name) === 'Core:Fragment') {
         block.component.name = 'Fragment';
     }
@@ -671,11 +692,27 @@ const builderElementToMitosisNode = (block, options, _internalOptions = {}) => {
         }),
         ...(options.includeBuilderExtras && getBuilderPropsForSymbol(block)),
     };
+    for (const key in properties) {
+        if (typeof properties[key] === 'object' &&
+            properties[key] !== null &&
+            properties[key]['@type'] === '@builder.io/core:LocalizedValue') {
+            const localizedValue = properties[key];
+            localizedValues[`properties.${key}`] = localizedValue;
+            properties[key] = localizedValue.Default;
+        }
+    }
     if (block.layerName) {
         properties.$name = block.layerName;
     }
-    if (block.linkUrl) {
-        properties.href = block.linkUrl;
+    const linkUrl = block.linkUrl;
+    if (linkUrl) {
+        if (typeof linkUrl === 'object' && linkUrl['@type'] === '@builder.io/core:LocalizedValue') {
+            properties.href = linkUrl.Default;
+            localizedValues['linkUrl'] = linkUrl;
+        }
+        else {
+            properties.href = linkUrl;
+        }
     }
     if ((_o = block.component) === null || _o === void 0 ? void 0 : _o.options) {
         for (const key in block.component.options) {
@@ -694,6 +731,11 @@ const builderElementToMitosisNode = (block, options, _internalOptions = {}) => {
             else if (typeof value === 'string') {
                 properties[key] = value;
             }
+            else if (typeof value === 'object' &&
+                value['@type'] === '@builder.io/core:LocalizedValue') {
+                properties[key] = value.Default;
+                localizedValues[`component.options.${key}`] = value;
+            }
             else if (valueIsArrayOfBuilderElements) {
                 const childrenElements = value
                     .filter((item) => {
@@ -748,6 +790,7 @@ const builderElementToMitosisNode = (block, options, _internalOptions = {}) => {
             ...slots,
         },
         meta: (0, exports.getMetaFromBlock)(block, options),
+        ...(Object.keys(localizedValues).length && { localizedValues }),
     });
     // Has single text node child
     const firstChild = (_r = block.children) === null || _r === void 0 ? void 0 : _r[0];

package/dist/src/parsers/svelte/html/text.d.ts

@@ -14,6 +14,9 @@ export declare function parseText(node: TemplateNode): {
     slots?: {
         [key: string]: import("../../..").MitosisNode[];
     } | undefined;
+    localizedValues?: {
+        [index: string]: import("../../..").BuilderLocalizedValue;
+    } | undefined;
 } | {
     name: string;
     properties: {
@@ -33,4 +36,7 @@ export declare function parseText(node: TemplateNode): {
     slots?: {
         [key: string]: import("../../..").MitosisNode[];
     } | undefined;
+    localizedValues?: {
+        [index: string]: import("../../..").BuilderLocalizedValue;
+    } | undefined;
 };

package/dist/src/types/mitosis-node.d.ts

@@ -28,6 +28,11 @@ type BindingProperties = {
 export type Binding = {
     code: string;
 } & BindingProperties;
+export type BuilderLocalizedValue = {
+    '@type': '@builder.io/core:LocalizedValue';
+    Default: string;
+    [index: string]: string;
+};
 export type BaseNode = {
     '@type': '@builder.io/mitosis/node';
     meta: JSONObject;
@@ -68,6 +73,13 @@ export type BaseNode = {
     slots?: {
         [key: string]: MitosisNode[];
     };
+    /**
+     * Key-value store of localized values
+     * It is used when a Builder content block has localized values.
+     */
+    localizedValues?: {
+        [index: string]: BuilderLocalizedValue;
+    };
 };
 export type SpecialNodesNames = 'For' | 'Fragment' | 'Show' | 'Slot';
 export type ForNode = BaseNode & {

package/package.json

@@ -22,7 +22,7 @@
     "name": "Builder.io",
     "url": "https://www.builder.io"
   },
-  "version": "0.5.28",
+  "version": "0.5.29",
   "homepage": "https://github.com/BuilderIO/mitosis",
   "main": "./dist/src/index.js",
   "exports": {