@builder.io/mitosis 0.0.77-0 → 0.0.78

package/dist/src/parsers/builder/builder.d.ts

@@ -0,0 +1,34 @@
+import { BuilderContent, BuilderElement } from '@builder.io/sdk';
+import { MitosisNode } from '../../types/mitosis-node';
+import { MitosisComponent, MitosisState } from '../..';
+declare type InternalOptions = {
+    skipMapper?: boolean;
+};
+export declare const symbolBlocksAsChildren = false;
+export declare type BuilderToMitosisOptions = {
+    context?: {
+        [key: string]: any;
+    };
+    includeBuilderExtras?: boolean;
+    preserveTextBlocks?: boolean;
+};
+export declare type InternalBuilderToMitosisOptions = BuilderToMitosisOptions & {
+    context: {
+        [key: string]: any;
+    };
+};
+export declare const builderElementToMitosisNode: (block: BuilderElement, options: BuilderToMitosisOptions, _internalOptions?: InternalOptions) => MitosisNode;
+/**
+ * Take Builder custom jsCode and extract the contents of the useState hook
+ * and return it as a JS object along with the inputted code with the hook
+ * code extracted
+ */
+export declare function extractStateHook(code: string): {
+    code: string;
+    state: MitosisState;
+};
+export declare function convertExportDefaultToReturn(code: string): string;
+export declare const createBuilderElement: (options?: Partial<BuilderElement>) => BuilderElement;
+export declare const isBuilderElement: (el: unknown) => el is BuilderElement;
+export declare const builderContentToMitosisComponent: (builderContent: BuilderContent, options?: BuilderToMitosisOptions) => MitosisComponent;
+export {};

package/dist/src/parsers/{builder.js → builder/builder.js}

@@ -42,16 +42,17 @@ var babel = __importStar(require("@babel/core"));
 var generator_1 = __importDefault(require("@babel/generator"));
 var json5_1 = __importDefault(require("json5"));
 var lodash_1 = require("lodash");
-var fast_clone_1 = require("../helpers/fast-clone");
+var fast_clone_1 = require("../../helpers/fast-clone");
 var traverse_1 = __importDefault(require("traverse"));
-var media_sizes_1 = require("../constants/media-sizes");
-var capitalize_1 = require("../helpers/capitalize");
-var create_mitosis_component_1 = require("../helpers/create-mitosis-component");
-var create_mitosis_node_1 = require("../helpers/create-mitosis-node");
-var jsx_1 = require("./jsx");
-var parsers_1 = require("../helpers/parsers");
-var __1 = require("..");
-var state_1 = require("./helpers/state");
+var media_sizes_1 = require("../../constants/media-sizes");
+var capitalize_1 = require("../../helpers/capitalize");
+var create_mitosis_component_1 = require("../../helpers/create-mitosis-component");
+var create_mitosis_node_1 = require("../../helpers/create-mitosis-node");
+var jsx_1 = require("../jsx");
+var parsers_1 = require("../../helpers/parsers");
+var __1 = require("../..");
+var helpers_1 = require("./helpers");
+var state_1 = require("../jsx/state");
 // Omit some superflous styles that can come from Builder's web importer
 var styleOmitList = [
     'backgroundRepeatX',
@@ -573,7 +574,7 @@ function extractStateHook(code) {
                 if (types.isIdentifier(expression.callee) && expression.callee.name === 'useState') {
                     var arg = expression.arguments[0];
                     if (types.isObjectExpression(arg)) {
-                        state = (0, jsx_1.parseStateObject)(arg);
+                        state = (0, state_1.parseStateObjectToMitosisState)(arg);
                         newBody.splice(i, 1);
                     }
                 }
@@ -584,7 +585,7 @@ function extractStateHook(code) {
                             expression.callee.property.name === 'assign') {
                             var arg = expression.arguments[1];
                             if (types.isObjectExpression(arg)) {
-                                state = (0, jsx_1.parseStateObject)(arg);
+                                state = (0, state_1.parseStateObjectToMitosisState)(arg);
                                 newBody.splice(i, 1);
                             }
                         }
@@ -702,6 +703,7 @@ var builderContentPartToMitosisComponent = function (builderContent, options) {
     var _k = extractStateHook(((_a = builderContent === null || builderContent === void 0 ? void 0 : builderContent.data) === null || _a === void 0 ? void 0 : _a.tsCode) || ((_b = builderContent === null || builderContent === void 0 ? void 0 : builderContent.data) === null || _b === void 0 ? void 0 : _b.jsCode) || ''), state = _k.state, code = _k.code;
     var customCode = convertExportDefaultToReturn(code);
     var parsed = getHooks(builderContent);
+    var parsedState = (parsed === null || parsed === void 0 ? void 0 : parsed.state) || {};
     var componentJson = (0, create_mitosis_component_1.createMitosisComponent)({
         meta: __assign({ useMetadata: {
                 httpRequests: (_c = builderContent.data) === null || _c === void 0 ? void 0 : _c.httpRequests,
@@ -710,7 +712,9 @@ var builderContentPartToMitosisComponent = function (builderContent, options) {
             name: input.name,
             defaultValue: input.defaultValue,
         }); }),
-        state: (parsed === null || parsed === void 0 ? void 0 : parsed.state) || __assign(__assign({}, state), (0, state_1.mapJsonObjectToStateValue)((_g = builderContent.data) === null || _g === void 0 ? void 0 : _g.state)),
+        state: Object.keys(parsedState).length > 0
+            ? parsedState
+            : __assign(__assign({}, state), (0, helpers_1.mapBuilderContentStateToMitosisState)(((_g = builderContent.data) === null || _g === void 0 ? void 0 : _g.state) || {})),
         hooks: __assign({}, ((((_h = parsed === null || parsed === void 0 ? void 0 : parsed.hooks.onMount) === null || _h === void 0 ? void 0 : _h.code) || (customCode && { code: customCode })) && {
             onMount: (parsed === null || parsed === void 0 ? void 0 : parsed.hooks.onMount) || { code: customCode },
         })),

package/dist/src/parsers/{helpers/state.d.ts → builder/helpers.d.ts}

@@ -1,3 +1,3 @@
-import { JSONObject } from '../../types/json';
 import { MitosisComponent } from '../../types/mitosis-component';
-export declare const mapJsonObjectToStateValue: (value: JSONObject) => MitosisComponent['state'];
+import { JSONObject } from '../../types/json';
+export declare const mapBuilderContentStateToMitosisState: (value: JSONObject) => MitosisComponent['state'];

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

@@ -0,0 +1,26 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.mapBuilderContentStateToMitosisState = void 0;
+var patterns_1 = require("../../helpers/patterns");
+var lodash_1 = require("lodash");
+var __DO_NOT_USE_FUNCTION_LITERAL_PREFIX = "@builder.io/mitosis/function:";
+var __DO_NOT_USE_METHOD_LITERAL_PREFIX = "@builder.io/mitosis/method:";
+/**
+ * Maps the Builder State format to the Mitosis State format.
+ */
+var mapJsonToStateValue = function (value) {
+    if (typeof value === 'string') {
+        if (value.startsWith(__DO_NOT_USE_FUNCTION_LITERAL_PREFIX)) {
+            return { type: 'function', code: value.replace(__DO_NOT_USE_FUNCTION_LITERAL_PREFIX, '') };
+        }
+        else if (value.startsWith(__DO_NOT_USE_METHOD_LITERAL_PREFIX)) {
+            var strippedValue = value.replace(__DO_NOT_USE_METHOD_LITERAL_PREFIX, '');
+            var isGet = Boolean(strippedValue.match(patterns_1.GETTER));
+            var type = isGet ? 'getter' : 'method';
+            return { type: type, code: strippedValue };
+        }
+    }
+    return { type: 'property', code: value };
+};
+var mapBuilderContentStateToMitosisState = function (value) { return (0, lodash_1.mapValues)(value, mapJsonToStateValue); };
+exports.mapBuilderContentStateToMitosisState = mapBuilderContentStateToMitosisState;

package/dist/src/parsers/builder/index.d.ts

@@ -0,0 +1 @@
+export * from './builder';

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

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./builder"), exports);

package/dist/src/parsers/jsx/function-parser.js

@@ -57,7 +57,7 @@ var state_1 = require("./state");
 var helpers_1 = require("./helpers");
 var component_types_1 = require("./component-types");
 var element_parser_1 = require("./element-parser");
-var metadata_1 = require("./metadata");
+var hooks_2 = require("./hooks");
 var types = babel.types;
 function generateUseStyleCode(expression) {
     return (0, generator_1.default)(expression.arguments[0]).code.replace(/(^("|'|`)|("|'|`)$)/g, '');
@@ -78,6 +78,15 @@ function parseDefaultPropsHook(component, expression) {
     }
 }
 exports.parseDefaultPropsHook = parseDefaultPropsHook;
+var processHookCode = function (firstArg) {
+    return (0, generator_1.default)(firstArg.body)
+        .code.trim()
+        // Remove arbitrary block wrapping if any
+        // AKA
+        //  { console.log('hi') } -> console.log('hi')
+        .replace(/^{/, '')
+        .replace(/}$/, '');
+};
 /**
  * Parses function declarations within the Mitosis copmonent's body to JSON
  */
@@ -127,18 +136,10 @@ var componentFunctionToJson = function (node, context) {
                             }
                         }
                     }
-                    else if (expression.callee.name === 'onMount' ||
-                        expression.callee.name === 'useEffect') {
+                    else if (expression.callee.name === 'onMount') {
                         var firstArg = expression.arguments[0];
                         if (types.isFunctionExpression(firstArg) || types.isArrowFunctionExpression(firstArg)) {
-                            var code = (0, generator_1.default)(firstArg.body)
-                                .code.trim()
-                                // Remove arbitrary block wrapping if any
-                                // AKA
-                                //  { console.log('hi') } -> console.log('hi')
-                                .replace(/^{/, '')
-                                .replace(/}$/, '');
-                            // TODO: add arguments
+                            var code = processHookCode(firstArg);
                             hooks.onMount = { code: code };
                         }
                     }
@@ -146,13 +147,7 @@ var componentFunctionToJson = function (node, context) {
                         var firstArg = expression.arguments[0];
                         var secondArg = expression.arguments[1];
                         if (types.isFunctionExpression(firstArg) || types.isArrowFunctionExpression(firstArg)) {
-                            var code = (0, generator_1.default)(firstArg.body)
-                                .code.trim()
-                                // Remove arbitrary block wrapping if any
-                                // AKA
-                                //  { console.log('hi') } -> console.log('hi')
-                                .replace(/^{/, '')
-                                .replace(/}$/, '');
+                            var code = processHookCode(firstArg);
                             if (!secondArg ||
                                 (types.isArrayExpression(secondArg) && secondArg.elements.length > 0)) {
                                 var depsCode = secondArg ? (0, generator_1.default)(secondArg).code : '';
@@ -168,26 +163,14 @@ var componentFunctionToJson = function (node, context) {
                     else if (expression.callee.name === 'onUnMount') {
                         var firstArg = expression.arguments[0];
                         if (types.isFunctionExpression(firstArg) || types.isArrowFunctionExpression(firstArg)) {
-                            var code = (0, generator_1.default)(firstArg.body)
-                                .code.trim()
-                                // Remove arbitrary block wrapping if any
-                                // AKA
-                                //  { console.log('hi') } -> console.log('hi')
-                                .replace(/^{/, '')
-                                .replace(/}$/, '');
+                            var code = processHookCode(firstArg);
                             hooks.onUnMount = { code: code };
                         }
                     }
                     else if (expression.callee.name === 'onInit') {
                         var firstArg = expression.arguments[0];
                         if (types.isFunctionExpression(firstArg) || types.isArrowFunctionExpression(firstArg)) {
-                            var code = (0, generator_1.default)(firstArg.body)
-                                .code.trim()
-                                // Remove arbitrary block wrapping if any
-                                // AKA
-                                //  { console.log('hi') } -> console.log('hi')
-                                .replace(/^{/, '')
-                                .replace(/}$/, '');
+                            var code = processHookCode(firstArg);
                             hooks.onInit = { code: code };
                         }
                     }
@@ -197,8 +180,8 @@ var componentFunctionToJson = function (node, context) {
                     else if (expression.callee.name === hooks_1.HOOKS.STYLE) {
                         context.builder.component.style = generateUseStyleCode(expression);
                     }
-                    else if (expression.callee.name === metadata_1.METADATA_HOOK_NAME) {
-                        context.builder.component.meta[metadata_1.METADATA_HOOK_NAME] = __assign(__assign({}, context.builder.component.meta[metadata_1.METADATA_HOOK_NAME]), (0, helpers_1.parseCodeJson)(expression.arguments[0]));
+                    else if (expression.callee.name === hooks_2.METADATA_HOOK_NAME) {
+                        context.builder.component.meta[hooks_2.METADATA_HOOK_NAME] = __assign(__assign({}, context.builder.component.meta[hooks_2.METADATA_HOOK_NAME]), (0, helpers_1.parseCodeJson)(expression.arguments[0]));
                     }
                 }
             }
@@ -214,10 +197,10 @@ var componentFunctionToJson = function (node, context) {
         if (types.isVariableDeclaration(item)) {
             var declaration = item.declarations[0];
             var init = declaration.init;
-            if (types.isCallExpression(init)) {
+            if (types.isCallExpression(init) && types.isIdentifier(init.callee)) {
                 // React format, like:
                 // const [foo, setFoo] = useState(...)
-                if (types.isArrayPattern(declaration.id)) {
+                if (types.isArrayPattern(declaration.id) && init.callee.name === hooks_1.HOOKS.STATE) {
                     var varName = types.isIdentifier(declaration.id.elements[0]) && declaration.id.elements[0].name;
                     if (varName) {
                         var value = init.arguments[0];
@@ -243,48 +226,46 @@ var componentFunctionToJson = function (node, context) {
                         }
                     }
                 }
-                // Legacy format, like:
+                // Solid store format, like:
                 // const state = useStore({...})
-                else if (types.isIdentifier(init.callee)) {
-                    if (init.callee.name === hooks_1.HOOKS.STATE || init.callee.name === hooks_1.HOOKS.STORE) {
-                        var firstArg = init.arguments[0];
-                        if (types.isObjectExpression(firstArg)) {
-                            var useStoreState = (0, state_1.parseStateObjectToMitosisState)(firstArg);
-                            Object.assign(state, useStoreState);
-                        }
+                if (init.callee.name === hooks_1.HOOKS.STORE) {
+                    var firstArg = init.arguments[0];
+                    if (types.isObjectExpression(firstArg)) {
+                        var useStoreState = (0, state_1.parseStateObjectToMitosisState)(firstArg);
+                        Object.assign(state, useStoreState);
                     }
-                    else if (init.callee.name === hooks_1.HOOKS.CONTEXT) {
-                        var firstArg = init.arguments[0];
-                        if (types.isVariableDeclarator(declaration) && types.isIdentifier(declaration.id)) {
-                            if (types.isIdentifier(firstArg)) {
-                                var varName = declaration.id.name;
-                                var name_1 = firstArg.name;
-                                accessedContext[varName] = {
-                                    name: name_1,
-                                    path: (0, trace_reference_to_module_path_1.traceReferenceToModulePath)(context.builder.component.imports, name_1),
-                                };
-                            }
-                            else {
-                                var varName = declaration.id.name;
-                                var name_2 = (0, generator_1.default)(firstArg).code;
-                                accessedContext[varName] = {
-                                    name: name_2,
-                                    path: '',
-                                };
-                            }
+                }
+                else if (init.callee.name === hooks_1.HOOKS.CONTEXT) {
+                    var firstArg = init.arguments[0];
+                    if (types.isVariableDeclarator(declaration) && types.isIdentifier(declaration.id)) {
+                        if (types.isIdentifier(firstArg)) {
+                            var varName = declaration.id.name;
+                            var name_1 = firstArg.name;
+                            accessedContext[varName] = {
+                                name: name_1,
+                                path: (0, trace_reference_to_module_path_1.traceReferenceToModulePath)(context.builder.component.imports, name_1),
+                            };
                         }
-                    }
-                    else if (init.callee.name === hooks_1.HOOKS.REF) {
-                        if (types.isIdentifier(declaration.id)) {
-                            var firstArg = init.arguments[0];
+                        else {
                             var varName = declaration.id.name;
-                            refs[varName] = {
-                                argument: (0, generator_1.default)(firstArg).code,
+                            var name_2 = (0, generator_1.default)(firstArg).code;
+                            accessedContext[varName] = {
+                                name: name_2,
+                                path: '',
                             };
-                            // Typescript Parameter
-                            if (types.isTSTypeParameterInstantiation(init.typeParameters)) {
-                                refs[varName].typeParameter = (0, generator_1.default)(init.typeParameters.params[0]).code;
-                            }
+                        }
+                    }
+                }
+                else if (init.callee.name === hooks_1.HOOKS.REF) {
+                    if (types.isIdentifier(declaration.id)) {
+                        var firstArg = init.arguments[0];
+                        var varName = declaration.id.name;
+                        refs[varName] = {
+                            argument: (0, generator_1.default)(firstArg).code,
+                        };
+                        // Typescript Parameter
+                        if (types.isTSTypeParameterInstantiation(init.typeParameters)) {
+                            refs[varName].typeParameter = (0, generator_1.default)(init.typeParameters.params[0]).code;
                         }
                     }
                 }

package/dist/src/parsers/jsx/helpers.d.ts

@@ -2,6 +2,7 @@ import * as babel from '@babel/core';
 declare const types: typeof babel.types;
 export declare const selfClosingTags: Set<string>;
 export declare const uncapitalize: (str: string) => string;
+export declare const parseCode: (node: babel.types.Node) => string;
 export declare const parseCodeJson: (node: babel.types.Node) => any;
 export declare const isImportOrDefaultExport: (node: babel.Node) => boolean;
 export {};

package/dist/src/parsers/jsx/helpers.js

@@ -26,7 +26,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.isImportOrDefaultExport = exports.parseCodeJson = exports.uncapitalize = exports.selfClosingTags = void 0;
+exports.isImportOrDefaultExport = exports.parseCodeJson = exports.parseCode = exports.uncapitalize = exports.selfClosingTags = void 0;
 var babel = __importStar(require("@babel/core"));
 var generator_1 = __importDefault(require("@babel/generator"));
 var json_1 = require("../../helpers/json");
@@ -54,8 +54,16 @@ var uncapitalize = function (str) {
     return str[0].toLowerCase() + str.slice(1);
 };
 exports.uncapitalize = uncapitalize;
+var parseCode = function (node) {
+    // if the node is a string literal, make sure to wrap the return value with quotes
+    // if (types.isStringLiteral(node)) {
+    //   return `"${node.value}"`;
+    // }
+    return (0, generator_1.default)(node).code;
+};
+exports.parseCode = parseCode;
 var parseCodeJson = function (node) {
-    var code = (0, generator_1.default)(node).code;
+    var code = (0, exports.parseCode)(node);
     return (0, json_1.tryParseJson)(code);
 };
 exports.parseCodeJson = parseCodeJson;

package/dist/src/parsers/jsx/{metadata.d.ts → hooks.d.ts}

@@ -10,5 +10,5 @@ export declare const METADATA_HOOK_NAME = "useMetadata";
  * This function collects metadata and removes the statement from
  * the returned nodes array
  */
-export declare const collectMetadata: (nodes: babel.types.Statement[], component: MitosisComponent, options: ParseMitosisOptions) => babel.types.Statement[];
+export declare const collectModuleScopeHooks: (nodes: babel.types.Statement[], component: MitosisComponent, options: ParseMitosisOptions) => babel.types.Statement[];
 export {};

package/dist/src/parsers/jsx/{metadata.js → hooks.js}

@@ -34,7 +34,7 @@ var __importStar = (this && this.__importStar) || function (mod) {
     return result;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.collectMetadata = exports.METADATA_HOOK_NAME = void 0;
+exports.collectModuleScopeHooks = exports.METADATA_HOOK_NAME = void 0;
 var babel = __importStar(require("@babel/core"));
 var hooks_1 = require("../../constants/hooks");
 var function_parser_1 = require("./function-parser");
@@ -60,7 +60,7 @@ exports.METADATA_HOOK_NAME = 'useMetadata';
  * This function collects metadata and removes the statement from
  * the returned nodes array
  */
-var collectMetadata = function (nodes, component, options) {
+var collectModuleScopeHooks = function (nodes, component, options) {
     var hookNames = new Set((options.jsonHookNames || []).concat(exports.METADATA_HOOK_NAME));
     return nodes.filter(function (node) {
         var hook = getHook(node);
@@ -94,4 +94,4 @@ var collectMetadata = function (nodes, component, options) {
         return true;
     });
 };
-exports.collectMetadata = collectMetadata;
+exports.collectModuleScopeHooks = collectModuleScopeHooks;

package/dist/src/parsers/jsx/index.d.ts

@@ -1,4 +1,3 @@
 export * from './jsx';
 export { selfClosingTags } from './helpers';
-export { METADATA_HOOK_NAME } from './metadata';
-export { parseStateObject } from './state';
+export { METADATA_HOOK_NAME } from './hooks';

package/dist/src/parsers/jsx/index.js

@@ -14,11 +14,9 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
     for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.parseStateObject = exports.METADATA_HOOK_NAME = exports.selfClosingTags = void 0;
+exports.METADATA_HOOK_NAME = exports.selfClosingTags = void 0;
 __exportStar(require("./jsx"), exports);
 var helpers_1 = require("./helpers");
 Object.defineProperty(exports, "selfClosingTags", { enumerable: true, get: function () { return helpers_1.selfClosingTags; } });
-var metadata_1 = require("./metadata");
-Object.defineProperty(exports, "METADATA_HOOK_NAME", { enumerable: true, get: function () { return metadata_1.METADATA_HOOK_NAME; } });
-var state_1 = require("./state");
-Object.defineProperty(exports, "parseStateObject", { enumerable: true, get: function () { return state_1.parseStateObject; } });
+var hooks_1 = require("./hooks");
+Object.defineProperty(exports, "METADATA_HOOK_NAME", { enumerable: true, get: function () { return hooks_1.METADATA_HOOK_NAME; } });

package/dist/src/parsers/jsx/jsx.js

@@ -45,7 +45,7 @@ var replace_new_lines_in_strings_1 = require("../../helpers/replace-new-lines-in
 var json_1 = require("../../helpers/json");
 var ast_1 = require("./ast");
 var state_1 = require("./state");
-var metadata_1 = require("./metadata");
+var hooks_1 = require("./hooks");
 var context_1 = require("./context");
 var helpers_1 = require("./helpers");
 var component_types_1 = require("./component-types");
@@ -119,7 +119,9 @@ function parseJsx(jsx, _options) {
                             return !types.isExportDefaultDeclaration(node) && types.isFunctionDeclaration(node);
                         })
                             .map(function (node) { return "export default ".concat((0, generator_1.default)(node).code); });
-                        var preComponentCode = (0, function_1.pipe)(path.node.body.filter(function (statement) { return !(0, helpers_1.isImportOrDefaultExport)(statement); }), function (statements) { return (0, metadata_1.collectMetadata)(statements, context.builder.component, options); }, types.program, generator_1.default, function (generatorResult) { return generatorResult.code; });
+                        var preComponentCode = (0, function_1.pipe)(path.node.body.filter(function (statement) { return !(0, helpers_1.isImportOrDefaultExport)(statement); }), function (statements) {
+                            return (0, hooks_1.collectModuleScopeHooks)(statements, context.builder.component, options);
+                        }, types.program, generator_1.default, function (generatorResult) { return generatorResult.code; });
                         // TODO: support multiple? e.g. for others to add imports?
                         context.builder.component.hooks.preComponent = { code: preComponentCode };
                         path.replaceWith(types.program(keepStatements));

package/dist/src/parsers/jsx/state.d.ts

@@ -1,6 +1,5 @@
 import * as babel from '@babel/core';
-import { MitosisComponent } from '../../types/mitosis-component';
-import { JSONObject } from '../../types/json';
+import { MitosisComponent, MitosisState } from '../../types/mitosis-component';
 declare const types: typeof babel.types;
 /**
  * Convert state identifiers from React hooks format to the state.* format Mitosis needs
@@ -9,6 +8,5 @@ declare const types: typeof babel.types;
  *   setText(...) -> state.text = ...
  */
 export declare function mapStateIdentifiers(json: MitosisComponent): void;
-export declare const parseStateObject: (object: babel.types.ObjectExpression) => JSONObject;
-export declare const parseStateObjectToMitosisState: (object: babel.types.ObjectExpression) => import("../../types/mitosis-component").MitosisState;
+export declare const parseStateObjectToMitosisState: (object: babel.types.ObjectExpression) => MitosisState;
 export {};

package/dist/src/parsers/jsx/state.js

@@ -37,18 +37,14 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.parseStateObjectToMitosisState = exports.parseStateObject = exports.mapStateIdentifiers = void 0;
+exports.parseStateObjectToMitosisState = exports.mapStateIdentifiers = void 0;
 var babel = __importStar(require("@babel/core"));
-var generator_1 = __importDefault(require("@babel/generator"));
-var outdated_prefixes_1 = require("../constants/outdated-prefixes");
 var traverse_1 = __importDefault(require("traverse"));
 var babel_transform_1 = require("../../helpers/babel-transform");
 var capitalize_1 = require("../../helpers/capitalize");
 var is_mitosis_node_1 = require("../../helpers/is-mitosis-node");
 var replace_identifiers_1 = require("../../helpers/replace-identifiers");
 var helpers_1 = require("./helpers");
-var function_1 = require("fp-ts/lib/function");
-var state_1 = require("../helpers/state");
 var types = babel.types;
 function mapStateIdentifiersInExpression(expression, stateProperties) {
     var setExpressions = stateProperties.map(function (propertyName) { return "set".concat((0, capitalize_1.capitalize)(propertyName)); });
@@ -127,36 +123,63 @@ function mapStateIdentifiers(json) {
     });
 }
 exports.mapStateIdentifiers = mapStateIdentifiers;
-var createFunctionStringLiteralObjectProperty = function (key, node) {
-    return types.objectProperty(key, types.stringLiteral("".concat(outdated_prefixes_1.__DO_NOT_USE_FUNCTION_LITERAL_PREFIX).concat((0, generator_1.default)(node).code)));
-};
-var parseStateValue = function (item) {
+var processStateObjectSlice = function (item) {
     if (types.isObjectProperty(item)) {
         if (types.isFunctionExpression(item.value)) {
-            return createFunctionStringLiteralObjectProperty(item.key, item.value);
+            return {
+                code: (0, helpers_1.parseCode)(item.value),
+                type: 'function',
+            };
         }
         else if (types.isArrowFunctionExpression(item.value)) {
-            // convert this to an object method instead
             var n = babel.types.objectMethod('method', item.key, item.value.params, item.value.body);
-            return types.objectProperty(item.key, types.stringLiteral("".concat(outdated_prefixes_1.__DO_NOT_USE_METHOD_LITERAL_PREFIX).concat((0, generator_1.default)(n).code)));
+            var code = (0, helpers_1.parseCode)(n);
+            return {
+                code: code,
+                type: 'method',
+            };
+        }
+        else {
+            // Remove typescript types, e.g. from
+            // { foo: ('string' as SomeType) }
+            if (types.isTSAsExpression(item.value)) {
+                return {
+                    code: (0, helpers_1.parseCodeJson)(item.value.expression),
+                    type: 'property',
+                };
+            }
+            return {
+                code: (0, helpers_1.parseCodeJson)(item.value),
+                type: 'property',
+            };
         }
     }
-    if (types.isObjectMethod(item)) {
-        return types.objectProperty(item.key, types.stringLiteral("".concat(outdated_prefixes_1.__DO_NOT_USE_METHOD_LITERAL_PREFIX).concat((0, generator_1.default)(__assign(__assign({}, item), { returnType: null })).code)));
+    else if (types.isObjectMethod(item)) {
+        var n = (0, helpers_1.parseCode)(__assign(__assign({}, item), { returnType: null }));
+        var isGetter = item.kind === 'get';
+        return {
+            code: n,
+            type: isGetter ? 'getter' : 'method',
+        };
     }
-    // Remove typescript types, e.g. from
-    // { foo: ('string' as SomeType) }
-    if (types.isObjectProperty(item)) {
-        var value = item.value;
-        if (types.isTSAsExpression(value)) {
-            value = value.expression;
-        }
-        return types.objectProperty(item.key, value);
+    else {
+        throw new Error('Unexpected state value type', item);
     }
-    return item;
 };
-var parseStateObject = function (object) {
-    return (0, function_1.pipe)(object.properties, function (p) { return p.map(parseStateValue); }, types.objectExpression, helpers_1.parseCodeJson);
+var parseStateObjectToMitosisState = function (object) {
+    var state = {};
+    object.properties.forEach(function (x) {
+        if (types.isSpreadElement(x)) {
+            throw new Error('Parse Error: Mitosis cannot consume spread element in state object: ' + x);
+        }
+        if (types.isPrivateName(x.key)) {
+            throw new Error('Parse Error: Mitosis cannot consume private name in state object: ' + x.key);
+        }
+        if (!types.isIdentifier(x.key)) {
+            throw new Error('Parse Error: Mitosis cannot consume non-identifier key in state object: ' + x.key);
+        }
+        state[x.key.name] = processStateObjectSlice(x);
+    });
+    return state;
 };
-exports.parseStateObject = parseStateObject;
-exports.parseStateObjectToMitosisState = (0, function_1.flow)(exports.parseStateObject, state_1.mapJsonObjectToStateValue);
+exports.parseStateObjectToMitosisState = parseStateObjectToMitosisState;