@builder.io/mitosis 0.4.0 → 0.4.2

package/dist/src/generators/solid/state/signals.js

@@ -1,26 +1,22 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getSignalsCode = void 0;
-var function_1 = require("fp-ts/lib/function");
-var patterns_1 = require("../../../helpers/patterns");
-var helpers_1 = require("./helpers");
-var processSignalStateValue = function (_a) {
-    var options = _a.options, component = _a.component;
-    var mapValue = (0, helpers_1.updateStateCode)({ options: options, component: component });
-    return function (_a) {
-        var key = _a[0], stateVal = _a[1];
+const function_1 = require("fp-ts/lib/function");
+const patterns_1 = require("../../../helpers/patterns");
+const helpers_1 = require("./helpers");
+const processSignalStateValue = ({ options, component, }) => {
+    const mapValue = (0, helpers_1.updateStateCode)({ options, component });
+    return ([key, stateVal]) => {
         if (!stateVal) {
             return '';
         }
-        var getDefaultCase = function () {
-            return (0, function_1.pipe)(value, mapValue, function (x) { return "const [".concat(key, ", ").concat((0, helpers_1.getStateSetterName)(key), "] = createSignal(").concat(x, ")"); });
-        };
-        var value = stateVal.code;
-        var type = stateVal.type;
+        const getDefaultCase = () => (0, function_1.pipe)(value, mapValue, (x) => `const [${key}, ${(0, helpers_1.getStateSetterName)(key)}] = createSignal(${x})`);
+        const value = stateVal.code;
+        const type = stateVal.type;
         if (typeof value === 'string') {
             switch (type) {
                 case 'getter':
-                    return (0, function_1.pipe)(value, mapValue, patterns_1.extractGetterCodeBlock, function (x) { return "const ".concat(key, " = createMemo(() => {").concat(x, "})"); });
+                    return (0, function_1.pipe)(value, mapValue, patterns_1.extractGetterCodeBlock, (x) => `const ${key} = createMemo(() => {${x}})`);
                 case 'function':
                     return mapValue(value);
                 case 'method':
@@ -34,27 +30,24 @@ var processSignalStateValue = function (_a) {
         }
     };
 };
-var LINE_ITEM_DELIMITER = '\n\n\n';
-var getSignalsCode = function (_a) {
-    var json = _a.json, options = _a.options, state = _a.state;
-    return Object.entries(state)
-        .map(processSignalStateValue({ options: options, component: json }))
-        /**
-         * We need to sort state so that signals are at the top.
-         */
-        .sort(function (a, b) {
-        var aHasSignal = a.includes('createSignal(');
-        var bHasSignal = b.includes('createSignal(');
-        if (aHasSignal && !bHasSignal) {
-            return -1;
-        }
-        else if (!aHasSignal && bHasSignal) {
-            return 1;
-        }
-        else {
-            return 0;
-        }
-    })
-        .join(LINE_ITEM_DELIMITER);
-};
+const LINE_ITEM_DELIMITER = '\n\n\n';
+const getSignalsCode = ({ json, options, state, }) => Object.entries(state)
+    .map(processSignalStateValue({ options, component: json }))
+    /**
+     * We need to sort state so that signals are at the top.
+     */
+    .sort((a, b) => {
+    const aHasSignal = a.includes('createSignal(');
+    const bHasSignal = b.includes('createSignal(');
+    if (aHasSignal && !bHasSignal) {
+        return -1;
+    }
+    else if (!aHasSignal && bHasSignal) {
+        return 1;
+    }
+    else {
+        return 0;
+    }
+})
+    .join(LINE_ITEM_DELIMITER);
 exports.getSignalsCode = getSignalsCode;

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

@@ -1,64 +1,51 @@
 "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 __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
-    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
-        if (ar || !(i in from)) {
-            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
-            ar[i] = from[i];
-        }
-    }
-    return to.concat(ar || Array.prototype.slice.call(from));
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getState = void 0;
-var function_1 = require("fp-ts/lib/function");
-var get_state_object_string_1 = require("../../../helpers/get-state-object-string");
-var state_1 = require("../../../helpers/state");
-var helpers_1 = require("./helpers");
-var signals_1 = require("./signals");
-var store_1 = require("./store");
-var getState = function (_a) {
-    var json = _a.json, options = _a.options;
-    var hasState = (0, state_1.checkHasState)(json);
+const function_1 = require("fp-ts/lib/function");
+const get_state_object_string_1 = require("../../../helpers/get-state-object-string");
+const state_1 = require("../../../helpers/state");
+const helpers_1 = require("./helpers");
+const signals_1 = require("./signals");
+const store_1 = require("./store");
+const getState = ({ json, options, }) => {
+    const hasState = (0, state_1.checkHasState)(json);
     if (!hasState) {
         return undefined;
     }
     // unbundle state in case the user provides a type override of one of the state values
-    var _b = Object.entries(json.state).reduce(function (acc, _a) {
-        var _b, _c, _d;
-        var key = _a[0], value = _a[1];
-        var stateType = (0, helpers_1.getStateTypeForValue)({ value: key, component: json, options: options });
+    const { mutable, signal, store } = Object.entries(json.state).reduce((acc, [key, value]) => {
+        const stateType = (0, helpers_1.getStateTypeForValue)({ value: key, component: json, options });
         switch (stateType) {
             case 'mutable':
-                return __assign(__assign({}, acc), { mutable: __assign(__assign({}, acc.mutable), (_b = {}, _b[key] = value, _b)) });
+                return { ...acc, mutable: { ...acc.mutable, [key]: value } };
             case 'signals':
-                return __assign(__assign({}, acc), { signal: __assign(__assign({}, acc.signal), (_c = {}, _c[key] = value, _c)) });
+                return { ...acc, signal: { ...acc.signal, [key]: value } };
             case 'store':
-                return __assign(__assign({}, acc), { store: __assign(__assign({}, acc.store), (_d = {}, _d[key] = value, _d)) });
+                return { ...acc, store: { ...acc.store, [key]: value } };
         }
-    }, { mutable: {}, signal: {}, store: {} }), mutable = _b.mutable, signal = _b.signal, store = _b.store;
-    var hasMutableState = Object.keys(mutable).length > 0;
-    var hasSignalState = Object.keys(signal).length > 0;
-    var hasStoreState = Object.keys(store).length > 0;
-    var mutableStateStr = hasMutableState
-        ? (0, function_1.pipe)(mutable, get_state_object_string_1.getMemberObjectString, function (str) { return "const state = createMutable(".concat(str, ");"); })
+    }, { mutable: {}, signal: {}, store: {} });
+    const hasMutableState = Object.keys(mutable).length > 0;
+    const hasSignalState = Object.keys(signal).length > 0;
+    const hasStoreState = Object.keys(store).length > 0;
+    const mutableStateStr = hasMutableState
+        ? (0, function_1.pipe)(mutable, get_state_object_string_1.getMemberObjectString, (str) => `const state = createMutable(${str});`)
         : '';
-    var signalStateStr = hasSignalState ? (0, signals_1.getSignalsCode)({ json: json, options: options, state: signal }) : '';
-    var storeStateStr = hasStoreState ? (0, store_1.getStoreCode)({ json: json, options: options, state: store }) : '';
-    var stateStr = "\n  ".concat(mutableStateStr, "\n  ").concat(signalStateStr, "\n  ").concat(storeStateStr, "\n  ");
-    var importObj = {
-        store: __spreadArray(__spreadArray([], (hasMutableState ? ['createMutable'] : []), true), (hasStoreState ? ['createStore', 'reconcile'] : []), true),
-        solidjs: __spreadArray(__spreadArray([], (hasSignalState ? ['createSignal', 'createMemo'] : []), true), (hasStoreState ? ['createEffect', 'on'] : []), true),
+    const signalStateStr = hasSignalState ? (0, signals_1.getSignalsCode)({ json, options, state: signal }) : '';
+    const storeStateStr = hasStoreState ? (0, store_1.getStoreCode)({ json, options, state: store }) : '';
+    const stateStr = `
+  ${mutableStateStr}
+  ${signalStateStr}
+  ${storeStateStr}
+  `;
+    const importObj = {
+        store: [
+            ...(hasMutableState ? ['createMutable'] : []),
+            ...(hasStoreState ? ['createStore', 'reconcile'] : []),
+        ],
+        solidjs: [
+            ...(hasSignalState ? ['createSignal', 'createMemo'] : []),
+            ...(hasStoreState ? ['createEffect', 'on'] : []),
+        ],
     };
     return {
         str: stateStr,

package/dist/src/generators/solid/state/store.js

@@ -1,69 +1,63 @@
 "use strict";
-var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
-    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
-        if (ar || !(i in from)) {
-            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
-            ar[i] = from[i];
-        }
-    }
-    return to.concat(ar || Array.prototype.slice.call(from));
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getStoreCode = void 0;
-var core_1 = require("@babel/core");
-var function_1 = require("fp-ts/lib/function");
-var babel_transform_1 = require("../../../helpers/babel-transform");
-var capitalize_1 = require("../../../helpers/capitalize");
-var patterns_1 = require("../../../helpers/patterns");
-var helpers_1 = require("./helpers");
-var collectUsedStateAndPropsInFunction = function (fnValue) {
-    var stateUsed = new Set();
-    var propsUsed = new Set();
+const core_1 = require("@babel/core");
+const function_1 = require("fp-ts/lib/function");
+const babel_transform_1 = require("../../../helpers/babel-transform");
+const capitalize_1 = require("../../../helpers/capitalize");
+const patterns_1 = require("../../../helpers/patterns");
+const helpers_1 = require("./helpers");
+const collectUsedStateAndPropsInFunction = (fnValue) => {
+    const stateUsed = new Set();
+    const propsUsed = new Set();
     (0, babel_transform_1.babelTransformExpression)(fnValue, {
-        MemberExpression: function (path) {
-            var node = path.node;
+        MemberExpression(path) {
+            const { node } = path;
             if (core_1.types.isIdentifier(node.object)) {
                 if (core_1.types.isIdentifier(node.property)) {
                     if (node.object.name === 'state') {
-                        stateUsed.add("state.".concat(node.property.name));
+                        stateUsed.add(`state.${node.property.name}`);
                     }
                     else if (node.object.name === 'props') {
-                        propsUsed.add("props.".concat(node.property.name));
+                        propsUsed.add(`props.${node.property.name}`);
                     }
                 }
             }
         },
     });
-    return { stateUsed: stateUsed, propsUsed: propsUsed };
+    return { stateUsed, propsUsed };
 };
-var getStoreCode = function (_a) {
-    var component = _a.json, options = _a.options, state = _a.state;
-    var mapValue = (0, helpers_1.updateStateCode)({ options: options, component: component });
-    var stateUpdater = function (_a) {
-        var key = _a[0], stateVal = _a[1];
+const getStoreCode = ({ json: component, options, state, }) => {
+    const mapValue = (0, helpers_1.updateStateCode)({ options, component });
+    const stateUpdater = ([key, stateVal]) => {
         if (!stateVal) {
             return '';
         }
-        var getCreateStoreStr = function (initialValue) {
-            return "const [".concat(key, ", ").concat((0, helpers_1.getStateSetterName)(key), "] = createStore(").concat(initialValue, ")");
-        };
-        var getDefaultCase = function () { return (0, function_1.pipe)(value, mapValue, getCreateStoreStr); };
-        var value = stateVal.code;
-        var type = stateVal.type;
+        const getCreateStoreStr = (initialValue) => `const [${key}, ${(0, helpers_1.getStateSetterName)(key)}] = createStore(${initialValue})`;
+        const getDefaultCase = () => (0, function_1.pipe)(value, mapValue, getCreateStoreStr);
+        const value = stateVal.code;
+        const type = stateVal.type;
         if (typeof value === 'string') {
             switch (type) {
                 case 'getter':
-                    var getterValueAsFunction = (0, patterns_1.replaceGetterWithFunction)(value);
-                    var _b = collectUsedStateAndPropsInFunction(getterValueAsFunction), stateUsed = _b.stateUsed, propsUsed = _b.propsUsed;
-                    var fnValueWithMappedRefs = mapValue(getterValueAsFunction);
-                    var FUNCTION_NAME = "update".concat((0, capitalize_1.capitalize)(key));
-                    var deps = __spreadArray(__spreadArray([], Array.from(stateUsed).map((0, helpers_1.updateStateCode)({
-                        options: options,
-                        component: component,
-                        // there are no setters in deps
-                        updateSetters: false,
-                    })), true), Array.from(propsUsed), true).join(', ');
-                    return "\n          const ".concat(FUNCTION_NAME, " = ").concat(fnValueWithMappedRefs, "\n          ").concat(getCreateStoreStr("".concat(FUNCTION_NAME, "()")), "\n          createEffect(on(() => [").concat(deps, "], () => ").concat((0, helpers_1.getStateSetterName)(key), "(reconcile(").concat(FUNCTION_NAME, "()))))\n          ");
+                    const getterValueAsFunction = (0, patterns_1.replaceGetterWithFunction)(value);
+                    const { stateUsed, propsUsed } = collectUsedStateAndPropsInFunction(getterValueAsFunction);
+                    const fnValueWithMappedRefs = mapValue(getterValueAsFunction);
+                    const FUNCTION_NAME = `update${(0, capitalize_1.capitalize)(key)}`;
+                    const deps = [
+                        ...Array.from(stateUsed).map((0, helpers_1.updateStateCode)({
+                            options,
+                            component,
+                            // there are no setters in deps
+                            updateSetters: false,
+                        })),
+                        ...Array.from(propsUsed),
+                    ].join(', ');
+                    return `
+          const ${FUNCTION_NAME} = ${fnValueWithMappedRefs}
+          ${getCreateStoreStr(`${FUNCTION_NAME}()`)}
+          createEffect(on(() => [${deps}], () => ${(0, helpers_1.getStateSetterName)(key)}(reconcile(${FUNCTION_NAME}()))))
+          `;
                 case 'function':
                     return mapValue(value);
                 case 'method':
@@ -79,4 +73,4 @@ var getStoreCode = function (_a) {
     return Object.entries(state).map(stateUpdater).join(LINE_ITEM_DELIMITER);
 };
 exports.getStoreCode = getStoreCode;
-var LINE_ITEM_DELIMITER = '\n\n\n';
+const LINE_ITEM_DELIMITER = '\n\n\n';

package/dist/src/generators/stencil/collect-class-string.js

@@ -3,11 +3,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.collectClassString = void 0;
 // This should really be a preprocessor mapping the `class` attribute binding based on what other values have
 // to make this more pluggable
-function collectClassString(json, bindingOpenChar, bindingCloseChar) {
+function collectClassString(json, bindingOpenChar = '{', bindingCloseChar = '}') {
     var _a, _b;
-    if (bindingOpenChar === void 0) { bindingOpenChar = '{'; }
-    if (bindingCloseChar === void 0) { bindingCloseChar = '}'; }
-    var staticClasses = [];
+    const staticClasses = [];
     if (json.properties.class) {
         staticClasses.push(json.properties.class);
         delete json.properties.class;
@@ -16,7 +14,7 @@ function collectClassString(json, bindingOpenChar, bindingCloseChar) {
         staticClasses.push(json.properties.className);
         delete json.properties.className;
     }
-    var dynamicClasses = [];
+    const dynamicClasses = [];
     if (typeof ((_a = json.bindings.class) === null || _a === void 0 ? void 0 : _a.code) === 'string') {
         dynamicClasses.push(json.bindings.class.code);
         delete json.bindings.class;
@@ -25,18 +23,18 @@ function collectClassString(json, bindingOpenChar, bindingCloseChar) {
         dynamicClasses.push(json.bindings.className.code);
         delete json.bindings.className;
     }
-    var staticClassesString = staticClasses.join(' ');
-    var dynamicClassesString = dynamicClasses.join(" + ' ' + ");
-    var hasStaticClasses = Boolean(staticClasses.length);
-    var hasDynamicClasses = Boolean(dynamicClasses.length);
+    const staticClassesString = staticClasses.join(' ');
+    const dynamicClassesString = dynamicClasses.join(" + ' ' + ");
+    const hasStaticClasses = Boolean(staticClasses.length);
+    const hasDynamicClasses = Boolean(dynamicClasses.length);
     if (hasStaticClasses && !hasDynamicClasses) {
-        return "\"".concat(staticClassesString, "\"");
+        return `"${staticClassesString}"`;
     }
     if (hasDynamicClasses && !hasStaticClasses) {
-        return "".concat(bindingOpenChar).concat(dynamicClassesString).concat(bindingCloseChar);
+        return `${bindingOpenChar}${dynamicClassesString}${bindingCloseChar}`;
     }
     if (hasDynamicClasses && hasStaticClasses) {
-        return "".concat(bindingOpenChar, "\"").concat(staticClassesString, " \" + ").concat(dynamicClassesString).concat(bindingCloseChar);
+        return `${bindingOpenChar}"${staticClassesString} " + ${dynamicClassesString}${bindingCloseChar}`;
     }
     return null;
 }