@builder.io/mitosis 0.0.45 → 0.0.46

package/dist/src/generators/qoot.js

@@ -1,442 +0,0 @@
-"use strict";
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
-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 __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-var __generator = (this && this.__generator) || function (thisArg, body) {
-    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
-    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
-    function verb(n) { return function (v) { return step([n, v]); }; }
-    function step(op) {
-        if (f) throw new TypeError("Generator is already executing.");
-        while (_) try {
-            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
-            if (y = 0, t) op = [op[0] & 2, t.value];
-            switch (op[0]) {
-                case 0: case 1: t = op; break;
-                case 4: _.label++; return { value: op[1], done: false };
-                case 5: _.label++; y = op[1]; op = [0]; continue;
-                case 7: op = _.ops.pop(); _.trys.pop(); continue;
-                default:
-                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
-                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
-                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
-                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
-                    if (t[2]) _.ops.pop();
-                    _.trys.pop(); continue;
-            }
-            op = body.call(thisArg, _);
-        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
-        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
-    }
-};
-var __spreadArray = (this && this.__spreadArray) || function (to, from) {
-    for (var i = 0, il = from.length, j = to.length; i < il; i++, j++)
-        to[j] = from[i];
-    return to;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.componentToQoot = void 0;
-var dedent_1 = __importDefault(require("dedent"));
-var lodash_1 = require("lodash");
-var standalone_1 = require("prettier/standalone");
-var is_jsx_lite_node_1 = require("../helpers/is-jsx-lite-node");
-var traverse_1 = __importDefault(require("traverse"));
-var capitalize_1 = require("../helpers/capitalize");
-var fast_clone_1 = require("../helpers/fast-clone");
-var render_imports_1 = require("../helpers/render-imports");
-var strip_meta_properties_1 = require("../helpers/strip-meta-properties");
-var filter_empty_text_nodes_1 = require("../helpers/filter-empty-text-nodes");
-var plugins_1 = require("../modules/plugins");
-var jsx_1 = require("../parsers/jsx");
-var remove_surrounding_block_1 = require("../helpers/remove-surrounding-block");
-var get_state_object_string_1 = require("../helpers/get-state-object-string");
-var strip_state_and_props_refs_1 = require("../helpers/strip-state-and-props-refs");
-var babel_transform_1 = require("../helpers/babel-transform");
-var core_1 = require("@babel/core");
-var collect_styles_1 = require("../helpers/collect-styles");
-var is_valid_attribute_name_1 = require("../helpers/is-valid-attribute-name");
-var rollup_1 = require("rollup");
-var plugin_virtual_1 = __importDefault(require("@rollup/plugin-virtual"));
-var qootImport = function (options) {
-    return options.qootLib || '@builder.io/qwik';
-};
-function addMarkDirtyAfterSetInCode(code, options, useString) {
-    if (useString === void 0) { useString = 'markDirty(this)'; }
-    return babel_transform_1.babelTransformExpression(code, {
-        UpdateExpression: function (path) {
-            var node = path.node;
-            if (core_1.types.isMemberExpression(node.argument)) {
-                if (core_1.types.isIdentifier(node.argument.object)) {
-                    // TODO: utillity to properly trace this reference to the beginning
-                    if (node.argument.object.name === 'state') {
-                        // TODO: ultimately do updates by property, e.g. updateName()
-                        // that updates any attributes dependent on name, etcç
-                        var parent_1 = path;
-                        // `_temp = ` assignments are created sometimes when we insertAfter
-                        // for simple expressions. this causes us to re-process the same expression
-                        // in an infinite loop
-                        while ((parent_1 = parent_1.parentPath)) {
-                            if (core_1.types.isAssignmentExpression(parent_1.node) &&
-                                core_1.types.isIdentifier(parent_1.node.left) &&
-                                parent_1.node.left.name.startsWith('_temp')) {
-                                return;
-                            }
-                        }
-                        path.insertAfter(core_1.types.identifier(useString));
-                    }
-                }
-            }
-        },
-        AssignmentExpression: function (path) {
-            var node = path.node;
-            if (core_1.types.isMemberExpression(node.left)) {
-                if (core_1.types.isIdentifier(node.left.object)) {
-                    // TODO: utillity to properly trace this reference to the beginning
-                    if (node.left.object.name === 'state') {
-                        // TODO: ultimately do updates by property, e.g. updateName()
-                        // that updates any attributes dependent on name, etcç
-                        var parent_2 = path;
-                        // `_temp = ` assignments are created sometimes when we insertAfter
-                        // for simple expressions. this causes us to re-process the same expression
-                        // in an infinite loop
-                        while ((parent_2 = parent_2.parentPath)) {
-                            if (core_1.types.isAssignmentExpression(parent_2.node) &&
-                                core_1.types.isIdentifier(parent_2.node.left) &&
-                                parent_2.node.left.name.startsWith('_temp')) {
-                                return;
-                            }
-                        }
-                        path.insertAfter(core_1.types.identifier(useString));
-                    }
-                }
-            }
-        },
-    });
-}
-var processBinding = function (binding, options) {
-    return strip_state_and_props_refs_1.stripStateAndPropsRefs(addMarkDirtyAfterSetInCode(binding, options), {
-        replaceWith: 'this.',
-    })
-        // Remove trailing semicolon
-        .trim()
-        .replace(/;$/, '');
-};
-var NODE_MAPPERS = {
-    Fragment: function (json, options) {
-        return "<>" + json.children
-            .map(function (item) { return blockToQoot(item, options); })
-            .join('\n') + "</>";
-    },
-    For: function (json, options) {
-        return "{" + processBinding(json.bindings.each, options) + ".map(" + json.bindings._forName + " => (\n      <>" + json.children
-            .filter(filter_empty_text_nodes_1.filterEmptyTextNodes)
-            .map(function (item) { return blockToQoot(item, options); })
-            .join('\n') + "</>\n    ))}";
-    },
-    Show: function (json, options) {
-        return "{" + processBinding(json.bindings.when, options) + " ? (\n      <>" + json.children
-            .filter(filter_empty_text_nodes_1.filterEmptyTextNodes)
-            .map(function (item) { return blockToQoot(item, options); })
-            .join('\n') + "</>\n    ) : undefined}";
-    },
-};
-var getId = function (json, options) {
-    var name = json.properties.$name
-        ? lodash_1.camelCase(json.properties.$name)
-        : /^h\d$/.test(json.name || '') // don't dashcase h1 into h-1
-            ? json.name
-            : lodash_1.camelCase(json.name || 'div');
-    var newNameNum = (options.namesMap[name] || 0) + 1;
-    options.namesMap[name] = newNameNum;
-    return capitalize_1.capitalize("" + name + (newNameNum === 1 ? '' : "" + newNameNum));
-};
-var elId = function (node, options) {
-    if (node.meta.id) {
-        return node.meta.id;
-    }
-    var id = getId(node, options);
-    node.meta.id = id;
-    return id;
-};
-var blockToQoot = function (json, options) {
-    if (NODE_MAPPERS[json.name]) {
-        return NODE_MAPPERS[json.name](json, options);
-    }
-    if (json.bindings._text) {
-        return "{" + processBinding(json.bindings._text, options) + "}";
-    }
-    if (json.properties._text) {
-        return json.properties._text;
-    }
-    var str = '';
-    str += "<" + json.name + " ";
-    if (json.bindings._spread) {
-        str += " {...(" + json.bindings._spread + ")} ";
-    }
-    for (var key in json.properties) {
-        if (key.startsWith('_') || key.startsWith('$')) {
-            continue;
-        }
-        var value = json.properties[key];
-        str += " " + key + "=\"" + value + "\" ";
-    }
-    var eventBindings = {};
-    for (var key in json.bindings) {
-        var value = json.bindings[key];
-        if (key.startsWith('_') || key.startsWith('$')) {
-            continue;
-        }
-        if (key.startsWith('on')) {
-            var useKey = key.replace('on', 'on:').toLowerCase();
-            var componentName = getComponentName(options.componentJson, options);
-            if (options.bundle) {
-                eventBindings[useKey] = "QRL`" + options.qrlPrefix + "/" + componentName + "/bundle" + (options.qrlSuffix || '') + ".on" + elId(json, options) + key.slice(2) + "`";
-            }
-            else {
-                eventBindings[useKey] = "QRL`" + options.qrlPrefix + "/" + componentName + "/on" + elId(json, options) + key.slice(2) + (options.qrlSuffix || '') + "`";
-            }
-        }
-        else {
-            if (!is_valid_attribute_name_1.isValidAttributeName(key)) {
-                console.warn('Skipping invalid attribute name:', key);
-            }
-            else {
-                str += " " + key + "={" + processBinding(value, options) + "} ";
-            }
-        }
-    }
-    if (lodash_1.size(eventBindings)) {
-        for (var event_1 in eventBindings) {
-            str += event_1 + "={" + eventBindings[event_1] + "}";
-        }
-    }
-    if (jsx_1.selfClosingTags.has(json.name)) {
-        return str + ' />';
-    }
-    str += '>';
-    if (json.children) {
-        str += json.children.map(function (item) { return blockToQoot(item, options); }).join('\n');
-    }
-    str += "</" + json.name + ">";
-    return str;
-};
-var getComponentName = function (json, options) {
-    return capitalize_1.capitalize(lodash_1.camelCase(json.name || 'my-component'));
-};
-// TODO
-var getProvidersString = function (componentJson, options) {
-    return 'null';
-};
-var formatCode = function (str, options, type) {
-    if (type === void 0) { type = 'typescript'; }
-    if (options.prettier !== false) {
-        try {
-            str = standalone_1.format(str, {
-                parser: type === 'typescript' ? 'babel-ts' : type,
-                plugins: [
-                    require('prettier/parser-typescript'),
-                    require('prettier/parser-babel'),
-                    require('prettier/parser-postcss'),
-                ],
-            });
-        }
-        catch (err) {
-            console.warn('Error formatting code', err);
-        }
-    }
-    return str;
-};
-var getEventHandlerFiles = function (componentJson, options) {
-    var files = [];
-    traverse_1.default(componentJson).forEach(function (item) {
-        if (is_jsx_lite_node_1.isJsxLiteNode(item)) {
-            for (var binding in item.bindings) {
-                if (binding.startsWith('on')) {
-                    var eventHandlerName = elId(item, options) + binding.slice(2);
-                    var componentName = getComponentName(componentJson, options);
-                    var str = formatCode("import {\n              injectEventHandler,\n              provideEvent,\n              markDirty\n            } from '" + qootImport(options) + "';\n            import { " + componentName + "Component } from './component.js'\n            \n            export " + (options.bundle ? "const on" + eventHandlerName + " =" : 'default') + " injectEventHandler(\n              " + componentName + "Component,\n              provideEvent(),\n              async function (this: " + componentName + "Component, event: Event) {\n                " + remove_surrounding_block_1.removeSurroundingBlock(processBinding(item.bindings[binding], options)) + "\n              }\n            )\n          ", options);
-                    str = formatCode(str, options);
-                    files.push({
-                        path: componentName + "/on" + eventHandlerName + ".ts",
-                        contents: str,
-                    });
-                }
-            }
-        }
-    });
-    return files;
-};
-var componentToQoot = function (componentJson, toQootOptions) {
-    if (toQootOptions === void 0) { toQootOptions = {}; }
-    return __awaiter(void 0, void 0, void 0, function () {
-        var json, options, css, hasCss, addWrapper, componentName, str, dataString, output, moduleMap, bundle, bundleOutput;
-        return __generator(this, function (_a) {
-            switch (_a.label) {
-                case 0:
-                    json = fast_clone_1.fastClone(componentJson);
-                    options = __assign(__assign({ qrlPrefix: 'ui:' }, toQootOptions), { namesMap: {}, componentJson: json });
-                    if (options.plugins) {
-                        json = plugins_1.runPreJsonPlugins(json, options.plugins);
-                    }
-                    css = collect_styles_1.collectCss(json, {
-                        classProperty: 'class',
-                        prefix: options.cssNamespace,
-                    });
-                    if (options.minifyStyles) {
-                        css = css.trim().replace(/\s+/g, ' ');
-                    }
-                    else {
-                        css = formatCode(css, options, 'css');
-                    }
-                    hasCss = Boolean(css.trim().length);
-                    addWrapper = json.children.length > 1 || hasCss;
-                    if (options.plugins) {
-                        json = plugins_1.runPostJsonPlugins(json, options.plugins);
-                    }
-                    componentName = capitalize_1.capitalize(lodash_1.camelCase(componentJson.name || 'my-component'));
-                    strip_meta_properties_1.stripMetaProperties(json);
-                    str = dedent_1.default(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n    import { injectMethod, QRL, jsxFactory } from '", "';\n    import { ", "Component } from './component.js'\n    ", "\n\n    export ", " injectMethod(", "Component, function (this: ", "Component) {\n      return (", "\n        ", "\n        ", "\n        ", ")\n    })\n  "], ["\n    import { injectMethod, QRL, jsxFactory } from '", "';\n    import { ", "Component } from './component.js'\n    ",
-                        "\n\n    export ",
-                        " injectMethod(", "Component, function (this: ", "Component) {\n      return (", "\n        ",
-                        "\n        ", "\n        ", ")\n    })\n  "])), qootImport(options), componentName, render_imports_1.renderPreComponent(__assign(__assign({}, json), { imports: json.imports.map(function (item) {
-                            if (item.path.endsWith('.lite')) {
-                                var clone = fast_clone_1.fastClone(item);
-                                var name_1 = clone.path
-                                    .split(/[\.\/]/)
-                                    // Get the -1 index of array
-                                    .slice(-2, -1)
-                                    .pop();
-                                var pascalName = capitalize_1.capitalize(lodash_1.camelCase(name_1));
-                                clone.path = "../" + pascalName + "/public.js";
-                                for (var key in clone.imports) {
-                                    var value = clone.imports[key];
-                                    if (value === 'default') {
-                                        clone.imports[key] = pascalName;
-                                    }
-                                }
-                                return clone;
-                            }
-                            return item;
-                        }) })), options.bundle ? "const template = " : 'default', componentName, componentName, addWrapper ? '<>' : '', !hasCss
-                        ? ''
-                        : "<style>{`" + css
-                            .trim()
-                            .replace(/^|\n/g, '\n' + ' '.repeat(12)) + "`}</style>", json.children.map(function (item) { return blockToQoot(item, options); }).join('\n'), addWrapper ? '</>' : '');
-                    if (options.plugins) {
-                        str = plugins_1.runPreCodePlugins(str, options.plugins);
-                    }
-                    str = formatCode(str, options);
-                    if (options.plugins) {
-                        str = plugins_1.runPostCodePlugins(str, options.plugins);
-                    }
-                    dataString = get_state_object_string_1.getStateObjectString(json, {
-                        format: 'class',
-                        valueMapper: function (code) { return processBinding(code, options); },
-                    });
-                    output = {
-                        files: __spreadArray([
-                            {
-                                path: componentName + "/template.tsx",
-                                contents: str,
-                            },
-                            {
-                                path: componentName + "/public.ts",
-                                contents: formatCode("\n          import { jsxDeclareComponent, QRL } from '" + qootImport(options) + "';\n          \n          export const " + componentName + " = jsxDeclareComponent(QRL`" + options.qrlPrefix + "/" + componentName + "/" + (options.bundle ? 'bundle' : 'template') + (options.qrlSuffix || '') + (options.bundle ? '.template' : '') + "`, '" + lodash_1.kebabCase(componentName) + "');\n        ", options),
-                            },
-                            {
-                                path: componentName + "/component.ts",
-                                contents: formatCode((function () {
-                                    var str = "\n              " + (options.format === 'builder' ? '' : 'export ') + "class " + (options.format === 'builder' ? '_' : '') + componentName + "Component extends Component<any, any> {\n                " + (options.format === 'builder'
-                                        ? ''
-                                        : "static $templateQRL = '" + options.qrlPrefix + "/" + componentName + "/" + (options.bundle ? 'bundle' : 'template') + (options.qrlSuffix || '') + (options.bundle ? '.template' : '') + "'") + "\n\n                " + dataString + "\n\n                " + (!json.hooks.onMount
-                                        ? ''
-                                        : "\n                      constructor(...args) {\n                        super(...args);\n\n                        " + processBinding(json.hooks.onMount, options) + "\n                        }\n                      ") + "\n\n                $newState() {\n                  return {} // TODO\n                }\n              }\n              " + (options.format !== 'builder'
-                                        ? ''
-                                        : "\n              export const " + componentName + "Component = new Proxy(_" + componentName + "Component, {\n                get(target, prop) {\n                  if (prop === '$templateQRL') {\n                    return '" + options.qrlPrefix + "/" + componentName + "/" + (options.bundle ? 'bundle' : 'template') + (options.qrlSuffix || '') + (options.bundle ? '.template' : '') + "'\n                  }\n                  return Reflect.get(...arguments)\n                }\n              })\n              ") + "\n            ";
-                                    str = "\n              import { Component, QRL " + (str.includes('markDirty(') ? ', markDirty' : '') + " } from '" + qootImport(options) + "';\n              " + str + "\n            ";
-                                    return str;
-                                })(), options),
-                            }
-                        ], getEventHandlerFiles(json, options)),
-                    };
-                    if (!options.bundle) return [3 /*break*/, 3];
-                    moduleMap = __assign({ entry: output.files
-                            .filter(function (file) { return !file.path.endsWith('/public.ts'); })
-                            .map(function (file) { return "export * from './" + file.path.replace(/\.tsx?$/, '.js') + "';"; })
-                            .join('\n') }, output.files.reduce(function (memo, arg) {
-                        var transformed = core_1.transform(arg.contents, {
-                            sourceFileName: arg.path,
-                            plugins: [
-                                [
-                                    require('@babel/plugin-transform-typescript'),
-                                    {
-                                        jsx: 'react',
-                                        isTSX: true,
-                                        allExtensions: true,
-                                        jsxFactory: 'jsxFactory',
-                                        jsxPragma: 'jsxFactory',
-                                    },
-                                ],
-                                [
-                                    require('@babel/plugin-transform-react-jsx'),
-                                    {
-                                        pragma: 'jsxFactory',
-                                        pragmaFrag: 'null',
-                                        throwIfNamespace: false,
-                                    },
-                                ],
-                                require('@babel/plugin-proposal-class-properties'),
-                            ],
-                        });
-                        memo['./' + arg.path.replace(/\.tsx?$/, '.js')] = transformed.code;
-                        return memo;
-                    }, {}));
-                    return [4 /*yield*/, rollup_1.rollup({
-                            input: 'entry',
-                            external: [options.qootLib || '@builder.io/qwik'],
-                            plugins: [plugin_virtual_1.default(moduleMap)],
-                        })];
-                case 1:
-                    bundle = _a.sent();
-                    return [4 /*yield*/, bundle.generate({
-                            file: 'bundle.js',
-                            format: 'esm',
-                        })];
-                case 2:
-                    bundleOutput = (_a.sent()).output;
-                    output.files.push({
-                        path: componentName + "/bundle.js",
-                        contents: bundleOutput[0].code,
-                    });
-                    _a.label = 3;
-                case 3: return [2 /*return*/, output];
-            }
-        });
-    });
-};
-exports.componentToQoot = componentToQoot;
-var templateObject_1;

package/dist/src/generators/qwik.d.ts

@@ -1,21 +0,0 @@
-import { Plugin } from '../modules/plugins';
-import { MitosisComponent } from '../types/mitosis-component';
-declare type ToQwikOptions = {
-    prettier?: boolean;
-    plugins?: Plugin[];
-    qwikLib?: string;
-    qrlPrefix?: string;
-    cssNamespace?: string;
-    minifyStyles?: boolean;
-    qrlSuffix?: string;
-    bundle?: boolean;
-    format?: 'builder' | 'default';
-};
-export declare type File = {
-    path: string;
-    contents: string;
-};
-export declare const componentToQwik: (componentJson: MitosisComponent, toQwikOptions?: ToQwikOptions) => Promise<{
-    files: File[];
-}>;
-export {};