@builder.io/mitosis 0.0.0-dev-20260605060721

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

@@ -0,0 +1,3 @@
+import { JSONObject } from '../../types/json';
+import { MitosisComponent } from '../../types/mitosis-component';
+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;
+const lodash_1 = require("lodash");
+const patterns_1 = require("../../helpers/patterns");
+const __DO_NOT_USE_FUNCTION_LITERAL_PREFIX = `@builder.io/mitosis/function:`;
+const __DO_NOT_USE_METHOD_LITERAL_PREFIX = `@builder.io/mitosis/method:`;
+/**
+ * Maps the Builder State format to the Mitosis State format.
+ */
+const mapJsonToStateValue = (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)) {
+            const strippedValue = value.replace(__DO_NOT_USE_METHOD_LITERAL_PREFIX, '');
+            const isGet = Boolean(strippedValue.match(patterns_1.GETTER));
+            const type = isGet ? 'getter' : 'method';
+            return { type, code: strippedValue };
+        }
+    }
+    return { type: 'property', code: JSON.stringify(value), propertyType: 'normal' };
+};
+const mapBuilderContentStateToMitosisState = (value) => (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/context.d.ts

@@ -0,0 +1,6 @@
+import { MitosisContext } from '../types/mitosis-context';
+type ParseContextOptions = {
+    name: string;
+};
+export declare function parseContext(code: string, options: ParseContextOptions): MitosisContext | null;
+export {};

package/dist/src/parsers/context.js

@@ -0,0 +1,82 @@
+"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 __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.parseContext = void 0;
+const babel = __importStar(require("@babel/core"));
+const create_mitosis_context_1 = require("../helpers/create-mitosis-context");
+const state_1 = require("./jsx/state");
+const { types } = babel;
+const tsPreset = require('@babel/preset-typescript');
+function parseContext(code, options) {
+    let found = false;
+    const context = (0, create_mitosis_context_1.createMitosisContext)({ name: options.name });
+    babel.transform(code, {
+        configFile: false,
+        babelrc: false,
+        presets: [[tsPreset, { isTSX: true, allExtensions: true }]],
+        plugins: [
+            () => ({
+                visitor: {
+                    Program(path) {
+                        for (const item of path.node.body) {
+                            if (types.isExportDefaultDeclaration(item)) {
+                                const expression = item.declaration;
+                                if (types.isCallExpression(expression)) {
+                                    if (types.isIdentifier(expression.callee) &&
+                                        expression.callee.name === 'createContext') {
+                                        const [firstArg, secondArg] = expression.arguments;
+                                        if (types.isObjectExpression(firstArg)) {
+                                            // TODO: support non object values by parsing any node type
+                                            // like the logic within each property value of parseStateObject
+                                            context.value = (0, state_1.parseStateObjectToMitosisState)(firstArg);
+                                            if (types.isObjectExpression(secondArg)) {
+                                                for (const prop of secondArg.properties) {
+                                                    if (!types.isProperty(prop) || !types.isIdentifier(prop.key))
+                                                        continue;
+                                                    const isReactive = prop.key.name === 'reactive';
+                                                    if (isReactive &&
+                                                        types.isBooleanLiteral(prop.value) &&
+                                                        prop.value.value) {
+                                                        context.type = 'reactive';
+                                                    }
+                                                }
+                                            }
+                                            found = true;
+                                        }
+                                    }
+                                }
+                            }
+                        }
+                    },
+                },
+            }),
+        ],
+    });
+    if (!found) {
+        return null;
+    }
+    return context;
+}
+exports.parseContext = parseContext;

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

@@ -0,0 +1,5 @@
+import * as babel from '@babel/core';
+import { JSONOrNode } from '../../types/json';
+declare const types: typeof babel.types;
+export declare const jsonToAst: (json: JSONOrNode) => babel.types.Expression;
+export {};

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

@@ -0,0 +1,74 @@
+"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 __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.jsonToAst = void 0;
+const babel = __importStar(require("@babel/core"));
+const { types } = babel;
+const arrayToAst = (array) => types.arrayExpression(array.map(exports.jsonToAst));
+const jsonToAst = (json) => {
+    if (types.isNode(json)) {
+        if (types.isJSXText(json)) {
+            return types.stringLiteral(json.value);
+        }
+        return json;
+    }
+    switch (typeof json) {
+        case 'undefined':
+            return types.identifier('undefined');
+        case 'string':
+            return types.stringLiteral(json);
+        case 'number':
+            return types.numericLiteral(json);
+        case 'boolean':
+            return types.booleanLiteral(json);
+        case 'object':
+            if (!json) {
+                return types.nullLiteral();
+            }
+            if (Array.isArray(json)) {
+                return arrayToAst(json);
+            }
+            return jsonObjectToAst(json);
+    }
+};
+exports.jsonToAst = jsonToAst;
+const jsonObjectToAst = (json) => {
+    if (!json) {
+        // TO-DO: This looks concerning...
+        return json;
+    }
+    const properties = [];
+    for (const key in json) {
+        const value = json[key];
+        if (value === undefined) {
+            continue;
+        }
+        const keyAst = types.stringLiteral(key);
+        const valueAst = (0, exports.jsonToAst)(value);
+        properties.push(types.objectProperty(keyAst, valueAst));
+    }
+    const newNode = types.objectExpression(properties);
+    return newNode;
+};

package/dist/src/parsers/jsx/component-types.d.ts

@@ -0,0 +1,8 @@
+import * as babel from '@babel/core';
+import { Context } from './types';
+declare const types: typeof babel.types;
+export declare const getPropsTypeRef: (node: babel.types.FunctionDeclaration, context: Context) => string | undefined;
+export declare const isTypeOrInterface: (node: babel.Node) => boolean;
+import { NodePath as BabelTraverseNodePath } from '@babel/traverse';
+export declare const collectTypes: (path: BabelTraverseNodePath<babel.types.TSTypeAliasDeclaration> | BabelTraverseNodePath<babel.types.ExportNamedDeclaration> | BabelTraverseNodePath<babel.types.TSInterfaceDeclaration> | BabelTraverseNodePath<babel.types.TSTypeAliasDeclaration>, context: Context) => void;
+export {};

package/dist/src/parsers/jsx/component-types.js

@@ -0,0 +1,82 @@
+"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 __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.collectTypes = exports.isTypeOrInterface = exports.getPropsTypeRef = void 0;
+const babel = __importStar(require("@babel/core"));
+const generator_1 = __importDefault(require("@babel/generator"));
+const { types } = babel;
+const getPropsTypeRef = (node, context) => {
+    var _a;
+    const param = node.params[0];
+    // TODO: component function params name must be props
+    if (babel.types.isIdentifier(param) &&
+        param.name === 'props' &&
+        babel.types.isTSTypeAnnotation(param.typeAnnotation)) {
+        const paramIdentifier = babel.types.variableDeclaration('let', [
+            babel.types.variableDeclarator(param),
+        ]);
+        const generatedTypes = (0, generator_1.default)(paramIdentifier)
+            .code.replace(/^let\sprops:\s+/, '')
+            .replace(/;/g, '');
+        if (generatedTypes.startsWith('{')) {
+            const propsTypeRef = `${(_a = node.id) === null || _a === void 0 ? void 0 : _a.name}Props`;
+            context.builder.component.types = [
+                ...(context.builder.component.types || []),
+                `export interface ${propsTypeRef} ${generatedTypes}`,
+            ];
+            return propsTypeRef;
+        }
+        return generatedTypes;
+    }
+    return undefined;
+};
+exports.getPropsTypeRef = getPropsTypeRef;
+const isTypeImport = (node) => {
+    var _a;
+    return types.isImportDeclaration(node) &&
+        node.importKind === 'type' &&
+        // Babel adds an implicit JSX type import that we don't want
+        ((_a = node.specifiers[0]) === null || _a === void 0 ? void 0 : _a.local.name) !== 'JSX';
+};
+const isTypeOrInterface = (node) => types.isTSTypeAliasDeclaration(node) ||
+    types.isTSInterfaceDeclaration(node) ||
+    (types.isExportNamedDeclaration(node) && types.isTSTypeAliasDeclaration(node.declaration)) ||
+    (types.isExportNamedDeclaration(node) && types.isTSInterfaceDeclaration(node.declaration));
+exports.isTypeOrInterface = isTypeOrInterface;
+const getTypesFromNode = (node, context) => {
+    const typeStr = (0, generator_1.default)(node).code;
+    const { types = [] } = context.builder.component;
+    types.push(typeStr);
+    context.builder.component.types = types.filter(Boolean);
+};
+const collectTypes = (path, context) => {
+    const { node } = path;
+    getTypesFromNode(node, context);
+    path.remove();
+};
+exports.collectTypes = collectTypes;

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

@@ -0,0 +1,6 @@
+import { MitosisComponent } from '../../types/mitosis-component';
+/**
+ * Convert <Context.Provider /> to hooks formats by mutating the
+ * MitosisComponent tree
+ */
+export declare function extractContextComponents(json: MitosisComponent): void;

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

@@ -0,0 +1,68 @@
+"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 __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.extractContextComponents = void 0;
+const babel = __importStar(require("@babel/core"));
+const legacy_1 = __importDefault(require("neotraverse/legacy"));
+const create_mitosis_node_1 = require("../../helpers/create-mitosis-node");
+const is_mitosis_node_1 = require("../../helpers/is-mitosis-node");
+const trace_reference_to_module_path_1 = require("../../helpers/trace-reference-to-module-path");
+const state_1 = require("./state");
+const expressionToNode = (str) => {
+    const code = `export default ${str}`;
+    return babel.parse(code).program.body[0].declaration;
+};
+/**
+ * Convert <Context.Provider /> to hooks formats by mutating the
+ * MitosisComponent tree
+ */
+function extractContextComponents(json) {
+    (0, legacy_1.default)(json).forEach(function (item) {
+        var _a, _b;
+        if ((0, is_mitosis_node_1.isMitosisNode)(item)) {
+            if (item.name.endsWith('.Provider')) {
+                const value = (_b = (_a = item.bindings) === null || _a === void 0 ? void 0 : _a.value) === null || _b === void 0 ? void 0 : _b.code;
+                const name = item.name.split('.')[0];
+                const refPath = (0, trace_reference_to_module_path_1.traceReferenceToModulePath)(json.imports, name);
+                json.context.set[refPath] = {
+                    name,
+                    value: value
+                        ? (0, state_1.parseStateObjectToMitosisState)(expressionToNode(value))
+                        : undefined,
+                };
+                this.update((0, create_mitosis_node_1.createMitosisNode)({
+                    name: 'Fragment',
+                    children: item.children,
+                }));
+            }
+            // TODO: maybe support Context.Consumer:
+            // if (item.name.endsWith('.Consumer')) { ... }
+        }
+    });
+}
+exports.extractContextComponents = extractContextComponents;

package/dist/src/parsers/jsx/element-parser.d.ts

@@ -0,0 +1,9 @@
+import * as babel from '@babel/core';
+import { MitosisNode } from '../../types/mitosis-node';
+import type { ParseMitosisOptions } from './types';
+declare const types: typeof babel.types;
+/**
+ * Parses a JSX element into a MitosisNode.
+ */
+export declare const jsxElementToJson: (node: babel.types.Expression | babel.types.JSX, options: Partial<ParseMitosisOptions>) => MitosisNode | null;
+export {};