@builder.io/mitosis 0.4.0 → 0.4.2

package/dist/src/generators/react/helpers.js

@@ -1,25 +1,14 @@
 "use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.processTagReferences = exports.wrapInFragment = exports.getFragment = exports.closeFrag = exports.openFrag = exports.processBinding = void 0;
-var is_mitosis_node_1 = require("../../helpers/is-mitosis-node");
-var strip_state_and_props_refs_1 = require("../../helpers/strip-state-and-props-refs");
-var lodash_1 = require("lodash");
-var legacy_1 = __importDefault(require("neotraverse/legacy"));
-var processBinding = function (str, options) {
+const is_mitosis_node_1 = require("../../helpers/is-mitosis-node");
+const strip_state_and_props_refs_1 = require("../../helpers/strip-state-and-props-refs");
+const lodash_1 = require("lodash");
+const legacy_1 = __importDefault(require("neotraverse/legacy"));
+const processBinding = (str, options) => {
     // fix web-component tag transform issue with dashes by not transforming it
     if (options.stateType !== 'useState') {
         return str;
@@ -30,35 +19,41 @@ var processBinding = function (str, options) {
     });
 };
 exports.processBinding = processBinding;
-var openFrag = function (options) { return getFragment('open', options); };
+const openFrag = (options) => getFragment('open', options);
 exports.openFrag = openFrag;
-var closeFrag = function (options) { return getFragment('close', options); };
+const closeFrag = (options) => getFragment('close', options);
 exports.closeFrag = closeFrag;
 function getFragment(type, options) {
-    var tagName = options.preact ? 'Fragment' : '';
-    return type === 'open' ? "<".concat(tagName, ">") : "</".concat(tagName, ">");
+    const tagName = options.preact ? 'Fragment' : '';
+    return type === 'open' ? `<${tagName}>` : `</${tagName}>`;
 }
 exports.getFragment = getFragment;
-var wrapInFragment = function (json) { return json.children.length !== 1; };
+const wrapInFragment = (json) => json.children.length !== 1;
 exports.wrapInFragment = wrapInFragment;
 function getRefName(path) {
     return (0, lodash_1.upperFirst)(path) + 'Ref';
 }
 function processTagReferences(json, options) {
-    var namesFound = new Set();
-    (0, legacy_1.default)(json).forEach(function (el) {
+    const namesFound = new Set();
+    (0, legacy_1.default)(json).forEach((el) => {
         var _a, _b;
         if (!(0, is_mitosis_node_1.isMitosisNode)(el)) {
             return;
         }
-        var processedRefName = el.name.includes('-') ? el.name : (0, exports.processBinding)(el.name, options);
+        const processedRefName = el.name.includes('-') ? el.name : (0, exports.processBinding)(el.name, options);
         if (el.name.includes('state.')) {
             switch ((_a = json.state[processedRefName]) === null || _a === void 0 ? void 0 : _a.type) {
                 case 'getter':
-                    var refName = getRefName(processedRefName);
+                    const refName = getRefName(processedRefName);
                     if (!namesFound.has(el.name)) {
                         namesFound.add(el.name);
-                        json.hooks.init = __assign(__assign({}, json.hooks.init), { code: "\n            ".concat(((_b = json.hooks.init) === null || _b === void 0 ? void 0 : _b.code) || '', "\n            const ").concat(refName, " = ").concat(el.name, ";\n            ") });
+                        json.hooks.init = {
+                            ...json.hooks.init,
+                            code: `
+            ${((_b = json.hooks.init) === null || _b === void 0 ? void 0 : _b.code) || ''}
+            const ${refName} = ${el.name};
+            `,
+                        };
                     }
                     el.name = refName;
                     break;
@@ -67,10 +62,10 @@ function processTagReferences(json, options) {
                 case 'method':
                 case 'function':
                 case 'property':
-                    var capitalizedName = (0, lodash_1.upperFirst)(processedRefName);
+                    const capitalizedName = (0, lodash_1.upperFirst)(processedRefName);
                     if (capitalizedName !== processedRefName) {
                         el.name = capitalizedName;
-                        json.state[capitalizedName] = __assign({}, json.state[processedRefName]);
+                        json.state[capitalizedName] = { ...json.state[processedRefName] };
                         delete json.state[processedRefName];
                     }
                     else {

package/dist/src/generators/react/state.js

@@ -1,59 +1,42 @@
 "use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.updateStateSettersInCode = exports.updateStateSetters = exports.getUseStateCode = exports.processHookCode = void 0;
-var capitalize_1 = require("../../helpers/capitalize");
-var is_mitosis_node_1 = require("../../helpers/is-mitosis-node");
-var patterns_1 = require("../../helpers/patterns");
-var transform_state_setters_1 = require("../../helpers/transform-state-setters");
-var core_1 = require("@babel/core");
-var function_1 = require("fp-ts/lib/function");
-var legacy_1 = __importDefault(require("neotraverse/legacy"));
-var helpers_1 = require("./helpers");
+const capitalize_1 = require("../../helpers/capitalize");
+const is_mitosis_node_1 = require("../../helpers/is-mitosis-node");
+const patterns_1 = require("../../helpers/patterns");
+const transform_state_setters_1 = require("../../helpers/transform-state-setters");
+const core_1 = require("@babel/core");
+const function_1 = require("fp-ts/lib/function");
+const legacy_1 = __importDefault(require("neotraverse/legacy"));
+const helpers_1 = require("./helpers");
 /**
  * Removes all `this.` references.
  */
-var stripThisRefs = function (str, options) {
+const stripThisRefs = (str, options) => {
     if (options.stateType !== 'useState') {
         return str;
     }
     return str.replace(/this\.([a-zA-Z_\$0-9]+)/g, '$1');
 };
-var processHookCode = function (_a) {
-    var str = _a.str, options = _a.options;
-    return (0, helpers_1.processBinding)((0, exports.updateStateSettersInCode)(str, options), options);
-};
+const processHookCode = ({ str, options }) => (0, helpers_1.processBinding)((0, exports.updateStateSettersInCode)(str, options), options);
 exports.processHookCode = processHookCode;
-var valueMapper = function (options) { return function (val) {
-    var x = (0, exports.processHookCode)({ str: val, options: options });
+const valueMapper = (options) => (val) => {
+    const x = (0, exports.processHookCode)({ str: val, options });
     return stripThisRefs(x, options);
-}; };
-var getSetStateFnName = function (stateName) { return "set".concat((0, capitalize_1.capitalize)(stateName)); };
-var processStateValue = function (options) {
-    var mapValue = valueMapper(options);
-    return function (_a) {
-        var key = _a[0], stateVal = _a[1];
+};
+const getSetStateFnName = (stateName) => `set${(0, capitalize_1.capitalize)(stateName)}`;
+const processStateValue = (options) => {
+    const mapValue = valueMapper(options);
+    return ([key, stateVal]) => {
         if (!stateVal) {
             return '';
         }
-        var getDefaultCase = function () {
-            return "const [".concat(key, ", ").concat(getSetStateFnName(key), "] = useState(() => (").concat(mapValue(value), "))");
-        };
-        var value = stateVal.code || '';
-        var type = stateVal.type;
+        const getDefaultCase = () => `const [${key}, ${getSetStateFnName(key)}] = useState(() => (${mapValue(value)}))`;
+        const value = stateVal.code || '';
+        const type = stateVal.type;
         if (typeof value === 'string') {
             switch (type) {
                 case 'getter':
@@ -71,39 +54,39 @@ var processStateValue = function (options) {
         }
     };
 };
-var getUseStateCode = function (json, options) {
-    var lineItemDelimiter = '\n\n\n';
-    var stringifiedState = Object.entries(json.state).map(processStateValue(options));
+const getUseStateCode = (json, options) => {
+    const lineItemDelimiter = '\n\n\n';
+    const stringifiedState = Object.entries(json.state).map(processStateValue(options));
     return stringifiedState.join(lineItemDelimiter);
 };
 exports.getUseStateCode = getUseStateCode;
-var updateStateSetters = function (json, options) {
+const updateStateSetters = (json, options) => {
     if (options.stateType !== 'useState') {
         return;
     }
     (0, legacy_1.default)(json).forEach(function (item) {
         if ((0, is_mitosis_node_1.isMitosisNode)(item)) {
-            for (var key in item.bindings) {
-                var values = item.bindings[key];
-                var newValue = (0, exports.updateStateSettersInCode)(values === null || values === void 0 ? void 0 : values.code, options);
+            for (const key in item.bindings) {
+                let values = item.bindings[key];
+                const newValue = (0, exports.updateStateSettersInCode)(values === null || values === void 0 ? void 0 : values.code, options);
                 if (newValue !== (values === null || values === void 0 ? void 0 : values.code)) {
-                    item.bindings[key] = __assign(__assign({}, values), { code: newValue });
+                    item.bindings[key] = {
+                        ...values,
+                        code: newValue,
+                    };
                 }
             }
         }
     });
 };
 exports.updateStateSetters = updateStateSetters;
-var updateStateSettersInCode = function (value, options) {
+const updateStateSettersInCode = (value, options) => {
     if (options.stateType !== 'useState') {
         return value;
     }
     return (0, transform_state_setters_1.transformStateSetters)({
-        value: value,
-        transformer: function (_a) {
-            var path = _a.path, propertyName = _a.propertyName;
-            return core_1.types.callExpression(core_1.types.identifier(getSetStateFnName(propertyName)), [path.node.right]);
-        },
+        value,
+        transformer: ({ path, propertyName }) => core_1.types.callExpression(core_1.types.identifier(getSetStateFnName(propertyName)), [path.node.right]),
     });
 };
 exports.updateStateSettersInCode = updateStateSettersInCode;

package/dist/src/generators/react-native/index.js

@@ -1,69 +1,58 @@
 "use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.componentToReactNative = exports.collectReactNativeStyles = void 0;
-var bindings_1 = require("../../helpers/bindings");
-var fast_clone_1 = require("../../helpers/fast-clone");
-var is_children_1 = __importDefault(require("../../helpers/is-children"));
-var is_mitosis_node_1 = require("../../helpers/is-mitosis-node");
-var merge_options_1 = require("../../helpers/merge-options");
-var json5_1 = __importDefault(require("json5"));
-var lodash_1 = require("lodash");
-var legacy_1 = __importDefault(require("neotraverse/legacy"));
-var html_tags_1 = require("../../constants/html_tags");
-var react_1 = require("../react");
-var sanitize_react_native_block_styles_1 = require("./sanitize-react-native-block-styles");
-var stylePropertiesThatMustBeNumber = new Set(['lineHeight']);
-var MEDIA_QUERY_KEY_REGEX = /^@media.*/;
-var sanitizeStyle = function (obj) { return function (key, value) {
-    var propertyValue = obj[key];
+const bindings_1 = require("../../helpers/bindings");
+const fast_clone_1 = require("../../helpers/fast-clone");
+const is_children_1 = __importDefault(require("../../helpers/is-children"));
+const is_mitosis_node_1 = require("../../helpers/is-mitosis-node");
+const merge_options_1 = require("../../helpers/merge-options");
+const json5_1 = __importDefault(require("json5"));
+const lodash_1 = require("lodash");
+const legacy_1 = __importDefault(require("neotraverse/legacy"));
+const html_tags_1 = require("../../constants/html_tags");
+const react_1 = require("../react");
+const sanitize_react_native_block_styles_1 = require("./sanitize-react-native-block-styles");
+const stylePropertiesThatMustBeNumber = new Set(['lineHeight']);
+const MEDIA_QUERY_KEY_REGEX = /^@media.*/;
+const sanitizeStyle = (obj) => (key, value) => {
+    const propertyValue = obj[key];
     if (key.match(MEDIA_QUERY_KEY_REGEX)) {
         console.warn('Unsupported: skipping media queries for react-native: ', key, propertyValue);
         delete obj[key];
         return;
     }
-}; };
-var collectReactNativeStyles = function (json) {
-    var styleMap = {};
-    var componentIndexes = {};
-    var getStyleSheetName = function (item) {
-        var componentName = (0, lodash_1.camelCase)(item.name || 'view');
+};
+const collectReactNativeStyles = (json) => {
+    const styleMap = {};
+    const componentIndexes = {};
+    const getStyleSheetName = (item) => {
+        const componentName = (0, lodash_1.camelCase)(item.name || 'view');
         // If we have already seen this component name, we will increment the index. Otherwise, we will set the index to 1.
-        var index = (componentIndexes[componentName] = (componentIndexes[componentName] || 0) + 1);
-        return "".concat(componentName).concat(index);
+        const index = (componentIndexes[componentName] = (componentIndexes[componentName] || 0) + 1);
+        return `${componentName}${index}`;
     };
     (0, legacy_1.default)(json).forEach(function (item) {
         var _a, _b, _c;
         if (!(0, is_mitosis_node_1.isMitosisNode)(item)) {
             return;
         }
-        var cssValue = json5_1.default.parse(((_a = item.bindings.css) === null || _a === void 0 ? void 0 : _a.code) || '{}');
+        let cssValue = json5_1.default.parse(((_a = item.bindings.css) === null || _a === void 0 ? void 0 : _a.code) || '{}');
         delete item.bindings.css;
         if ((0, lodash_1.size)(cssValue)) {
             // Style properties like `"20px"` need to be numbers like `20` for react native
-            for (var key in cssValue) {
+            for (const key in cssValue) {
                 sanitizeStyle(cssValue)(key, cssValue[key]);
                 cssValue = (0, sanitize_react_native_block_styles_1.sanitizeReactNativeBlockStyles)(cssValue);
             }
         }
         try {
-            var styleValue = json5_1.default.parse(((_b = item.bindings.style) === null || _b === void 0 ? void 0 : _b.code) || '{}');
+            let styleValue = json5_1.default.parse(((_b = item.bindings.style) === null || _b === void 0 ? void 0 : _b.code) || '{}');
             if ((0, lodash_1.size)(styleValue)) {
                 // Style properties like `"20px"` need to be numbers like `20` for react native
-                for (var key in styleValue) {
+                for (const key in styleValue) {
                     sanitizeStyle(styleValue)(key, styleValue[key]);
                     styleValue = (0, sanitize_react_native_block_styles_1.sanitizeReactNativeBlockStyles)(styleValue);
                 }
@@ -74,8 +63,8 @@ var collectReactNativeStyles = function (json) {
         if (!(0, lodash_1.size)(cssValue)) {
             return;
         }
-        var styleSheetName = getStyleSheetName(item);
-        var styleSheetAccess = "styles.".concat(styleSheetName);
+        const styleSheetName = getStyleSheetName(item);
+        const styleSheetAccess = `styles.${styleSheetName}`;
         styleMap[styleSheetName] = cssValue;
         if (!item.bindings.style) {
             item.bindings.style = (0, bindings_1.createSingleBinding)({
@@ -87,13 +76,16 @@ var collectReactNativeStyles = function (json) {
             // run the code below only if the style binding is a JSON object
             json5_1.default.parse(item.bindings.style.code || '{}');
             item.bindings.style = (0, bindings_1.createSingleBinding)({
-                code: ((_c = item.bindings.style) === null || _c === void 0 ? void 0 : _c.code.replace(/}$/, ", ...".concat(styleSheetAccess, " }"))) || styleSheetAccess,
+                code: ((_c = item.bindings.style) === null || _c === void 0 ? void 0 : _c.code.replace(/}$/, `, ...${styleSheetAccess} }`)) || styleSheetAccess,
             });
         }
         catch (e) {
             // if not a JSON, then it's a property, so we should spread it.
             item.bindings.style = (0, bindings_1.createSingleBinding)({
-                code: "{\n        ...".concat(styleSheetAccess, ",\n        ...").concat(item.bindings.style.code, "\n        }"),
+                code: `{
+        ...${styleSheetAccess},
+        ...${item.bindings.style.code}
+        }`,
             });
         }
     });
@@ -104,14 +96,14 @@ exports.collectReactNativeStyles = collectReactNativeStyles;
  * Plugin that handles necessary transformations from React to React Native:
  * - Converts DOM tags to <View /> and <Text />
  */
-var PROCESS_REACT_NATIVE_PLUGIN = function () { return ({
+const PROCESS_REACT_NATIVE_PLUGIN = () => ({
     json: {
-        pre: function (json) {
-            (0, legacy_1.default)(json).forEach(function (node) {
+        pre: (json) => {
+            (0, legacy_1.default)(json).forEach((node) => {
                 var _a, _b, _c, _d;
                 if ((0, is_mitosis_node_1.isMitosisNode)(node)) {
                     // TODO: handle TextInput, Image, etc
-                    if ((0, is_children_1.default)({ node: node })) {
+                    if ((0, is_children_1.default)({ node })) {
                         node.name = '';
                     }
                     else if (node.name.toLowerCase() === node.name && html_tags_1.VALID_HTML_TAGS.includes(node.name)) {
@@ -143,13 +135,13 @@ var PROCESS_REACT_NATIVE_PLUGIN = function () { return ({
             });
         },
     },
-}); };
+});
 /**
  * Removes React Native className and class properties from the JSON
  */
-var REMOVE_REACT_NATIVE_CLASSES_PLUGIN = function () { return ({
+const REMOVE_REACT_NATIVE_CLASSES_PLUGIN = () => ({
     json: {
-        pre: function (json) {
+        pre: (json) => {
             (0, legacy_1.default)(json).forEach(function (node) {
                 if ((0, is_mitosis_node_1.isMitosisNode)(node)) {
                     if (node.properties.class) {
@@ -168,41 +160,41 @@ var REMOVE_REACT_NATIVE_CLASSES_PLUGIN = function () { return ({
             });
         },
     },
-}); };
+});
 /**
  * Converts class and className properties to twrnc style syntax
  */
-var TWRNC_STYLES_PLUGIN = function () { return ({
+const TWRNC_STYLES_PLUGIN = () => ({
     json: {
-        post: function (json) {
+        post: (json) => {
             (0, legacy_1.default)(json).forEach(function (node) {
                 if ((0, is_mitosis_node_1.isMitosisNode)(node)) {
-                    var staticClasses = [node.properties.class, node.properties.className]
+                    let staticClasses = [node.properties.class, node.properties.className]
                         .filter(Boolean)
                         .join(' ');
-                    var dynamicClasses = [node.bindings.class, node.bindings.className].filter(Boolean);
+                    let dynamicClasses = [node.bindings.class, node.bindings.className].filter(Boolean);
                     if (staticClasses || dynamicClasses.length) {
-                        var styleCode = '';
+                        let styleCode = '';
                         if (staticClasses) {
-                            styleCode = "tw`".concat(staticClasses, "`");
+                            styleCode = `tw\`${staticClasses}\``;
                         }
                         if (dynamicClasses.length) {
-                            var dynamicCode = dynamicClasses
-                                .map(function (dc) { return (dc && dc.code ? dc.code : null); })
+                            let dynamicCode = dynamicClasses
+                                .map((dc) => (dc && dc.code ? dc.code : null))
                                 .filter(Boolean)
                                 .join(', ');
                             if (dynamicCode) {
                                 if (styleCode) {
                                     // If we have both static and dynamic classes
-                                    styleCode = "tw.style(".concat(styleCode, ", ").concat(dynamicCode, ")");
+                                    styleCode = `tw.style(${styleCode}, ${dynamicCode})`;
                                 }
                                 else if (dynamicClasses.length > 1) {
                                     // If we have multiple dynamic classes
-                                    styleCode = "tw.style([".concat(dynamicCode, "])");
+                                    styleCode = `tw.style([${dynamicCode}])`;
                                 }
                                 else {
                                     // If we have a single dynamic class
-                                    styleCode = "tw.style(".concat(dynamicCode, ")");
+                                    styleCode = `tw.style(${dynamicCode})`;
                                 }
                             }
                         }
@@ -219,17 +211,17 @@ var TWRNC_STYLES_PLUGIN = function () { return ({
             });
         },
     },
-}); };
+});
 /**
  * Converts class and className properties to native-wind style syntax
  * Note: We only support the "with babel" setup: https://www.nativewind.dev/guides/babel
  */
-var NATIVE_WIND_STYLES_PLUGIN = function () { return ({
+const NATIVE_WIND_STYLES_PLUGIN = () => ({
     json: {
-        post: function (json) {
+        post: (json) => {
             (0, legacy_1.default)(json).forEach(function (node) {
                 if ((0, is_mitosis_node_1.isMitosisNode)(node)) {
-                    var combinedClasses = [
+                    let combinedClasses = [
                         node.properties.class,
                         node.properties.className,
                         node.bindings.class,
@@ -256,28 +248,24 @@ var NATIVE_WIND_STYLES_PLUGIN = function () { return ({
             });
         },
     },
-}); };
-var DEFAULT_OPTIONS = {
+});
+const DEFAULT_OPTIONS = {
     stateType: 'useState',
     stylesType: 'react-native',
     plugins: [PROCESS_REACT_NATIVE_PLUGIN],
 };
-var componentToReactNative = function (_options) {
-    if (_options === void 0) { _options = {}; }
-    return function (_a) {
-        var component = _a.component, path = _a.path;
-        var json = (0, fast_clone_1.fastClone)(component);
-        var options = (0, merge_options_1.mergeOptions)(DEFAULT_OPTIONS, _options);
-        if (options.stylesType === 'twrnc') {
-            options.plugins.push(TWRNC_STYLES_PLUGIN);
-        }
-        else if (options.stylesType === 'native-wind') {
-            options.plugins.push(NATIVE_WIND_STYLES_PLUGIN);
-        }
-        else {
-            options.plugins.push(REMOVE_REACT_NATIVE_CLASSES_PLUGIN);
-        }
-        return (0, react_1.componentToReact)(__assign(__assign({}, options), { type: 'native' }))({ component: json, path: path });
-    };
+const componentToReactNative = (_options = {}) => ({ component, path }) => {
+    const json = (0, fast_clone_1.fastClone)(component);
+    const options = (0, merge_options_1.mergeOptions)(DEFAULT_OPTIONS, _options);
+    if (options.stylesType === 'twrnc') {
+        options.plugins.push(TWRNC_STYLES_PLUGIN);
+    }
+    else if (options.stylesType === 'native-wind') {
+        options.plugins.push(NATIVE_WIND_STYLES_PLUGIN);
+    }
+    else {
+        options.plugins.push(REMOVE_REACT_NATIVE_CLASSES_PLUGIN);
+    }
+    return (0, react_1.componentToReact)({ ...options, type: 'native' })({ component: json, path });
 };
 exports.componentToReactNative = componentToReactNative;

package/dist/src/generators/react-native/sanitize-react-native-block-styles.js

@@ -1,20 +1,9 @@
 "use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.sanitizeReactNativeBlockStyles = void 0;
-var propertiesThatMustBeNumber = new Set(['lineHeight']);
-var displayValues = new Set(['flex', 'none']);
-var normalizeNumber = function (value) {
+const propertiesThatMustBeNumber = new Set(['lineHeight']);
+const displayValues = new Set(['flex', 'none']);
+const normalizeNumber = (value) => {
     if (Number.isNaN(value)) {
         return undefined;
     }
@@ -26,27 +15,26 @@ var normalizeNumber = function (value) {
         return value;
     }
 };
-var sanitizeReactNativeBlockStyles = function (styles) {
-    return Object.keys(styles).reduce(function (acc, key) {
-        var _a, _b, _c;
-        var propertyValue = styles[key];
+const sanitizeReactNativeBlockStyles = (styles) => {
+    return Object.keys(styles).reduce((acc, key) => {
+        const propertyValue = styles[key];
         if (key === 'display' && !displayValues.has(propertyValue)) {
-            console.warn("Style value for key \"display\" must be \"flex\" or \"none\" but had ".concat(propertyValue));
+            console.warn(`Style value for key "display" must be "flex" or "none" but had ${propertyValue}`);
             return acc;
         }
         if (propertiesThatMustBeNumber.has(key) && typeof propertyValue !== 'number') {
-            console.warn("Style key ".concat(key, " must be a number, but had value `").concat(styles[key], "`"));
+            console.warn(`Style key ${key} must be a number, but had value \`${styles[key]}\``);
             return acc;
         }
         if (typeof propertyValue === 'string') {
             // `px` units need to be stripped and replaced with numbers
             // https://regexr.com/6ualn
-            var isPixelUnit = propertyValue.match(/^-?(\d*)(\.?)(\d*)*px$/);
+            const isPixelUnit = propertyValue.match(/^-?(\d*)(\.?)(\d*)*px$/);
             if (isPixelUnit) {
-                var newValue = parseFloat(propertyValue);
-                var normalizedValue = normalizeNumber(newValue);
+                const newValue = parseFloat(propertyValue);
+                const normalizedValue = normalizeNumber(newValue);
                 if (normalizedValue) {
-                    return __assign(__assign({}, acc), (_a = {}, _a[key] = normalizedValue, _a));
+                    return { ...acc, [key]: normalizedValue };
                 }
                 else {
                     return acc;
@@ -54,10 +42,10 @@ var sanitizeReactNativeBlockStyles = function (styles) {
             }
             else if (propertyValue === '0') {
                 // 0 edge case needs to be handled
-                return __assign(__assign({}, acc), (_b = {}, _b[key] = 0, _b));
+                return { ...acc, [key]: 0 };
             }
         }
-        return __assign(__assign({}, acc), (_c = {}, _c[key] = propertyValue, _c));
+        return { ...acc, [key]: propertyValue };
     }, {});
 };
 exports.sanitizeReactNativeBlockStyles = sanitizeReactNativeBlockStyles;