@builder.io/mitosis 0.0.56-13 → 0.0.56-16

package/dist/src/generators/template.js

@@ -9,7 +9,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.componentToTemplate = void 0;
 var standalone_1 = require("prettier/standalone");
-var collect_styles_1 = require("../helpers/collect-styles");
+var collect_css_1 = require("../helpers/styles/collect-css");
 var fast_clone_1 = require("../helpers/fast-clone");
 var jsx_1 = require("../parsers/jsx");
 var plugins_1 = require("../modules/plugins");
@@ -17,9 +17,7 @@ var dedent_1 = __importDefault(require("dedent"));
 var get_state_object_string_1 = require("../helpers/get-state-object-string");
 var mappers = {
     Fragment: function (json, options) {
-        return "<div>".concat(json.children
-            .map(function (item) { return blockToTemplate(item, options); })
-            .join('\n'), "</div>");
+        return "<div>".concat(json.children.map(function (item) { return blockToTemplate(item, options); }).join('\n'), "</div>");
     },
 };
 // TODO: spread support
@@ -39,18 +37,14 @@ var blockToTemplate = function (json, options) {
     if (json.name === 'For') {
         str += "${".concat((_b = json.bindings.each) === null || _b === void 0 ? void 0 : _b.code, "?.map(").concat(json.properties._forName, " => `");
         if (json.children) {
-            str += json.children
-                .map(function (item) { return blockToTemplate(item, options); })
-                .join('\n');
+            str += json.children.map(function (item) { return blockToTemplate(item, options); }).join('\n');
         }
         str += '`).join("")}';
     }
     else if (json.name === 'Show') {
         str += "${!(".concat((_c = json.bindings.when) === null || _c === void 0 ? void 0 : _c.code, ") ? '' : `");
         if (json.children) {
-            str += json.children
-                .map(function (item) { return blockToTemplate(item, options); })
-                .join('\n');
+            str += json.children.map(function (item) { return blockToTemplate(item, options); }).join('\n');
         }
         str += '`}';
     }
@@ -87,9 +81,7 @@ var blockToTemplate = function (json, options) {
         }
         str += '>';
         if (json.children) {
-            str += json.children
-                .map(function (item) { return blockToTemplate(item, options); })
-                .join('\n');
+            str += json.children.map(function (item) { return blockToTemplate(item, options); }).join('\n');
         }
         str += "</".concat(json.name, ">");
     }
@@ -104,7 +96,7 @@ var componentToTemplate = function (options) {
         if (options.plugins) {
             json = (0, plugins_1.runPreJsonPlugins)(json, options.plugins);
         }
-        var css = (0, collect_styles_1.collectCss)(json);
+        var css = (0, collect_css_1.collectCss)(json);
         if (options.plugins) {
             json = (0, plugins_1.runPostJsonPlugins)(json, options.plugins);
         }

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

@@ -1,11 +1,17 @@
 import { MitosisNode } from '../types/mitosis-node';
-import { BaseTranspilerOptions, TranspilerArgs } from '../types/config';
-export interface ToVueOptions extends BaseTranspilerOptions {
-    vueVersion?: 2 | 3;
+import { BaseTranspilerOptions, Transpiler } from '../types/transpiler';
+import { OmitObj } from '../helpers/typescript';
+export declare type VueVersion = 2 | 3;
+interface VueVersionOpt {
+    vueVersion: VueVersion;
+}
+export interface ToVueOptions extends BaseTranspilerOptions, VueVersionOpt {
     cssNamespace?: () => string;
     namePrefix?: (path: string) => string;
+    asyncComponentImports?: boolean;
 }
 export declare const blockToVue: (node: MitosisNode, options: ToVueOptions) => string;
-export declare const componentToVue: (userOptions?: ToVueOptions) => ({ component, path }: TranspilerArgs & {
-    path: string;
-}) => string;
+declare type VueOptsWithoutVersion = OmitObj<ToVueOptions, VueVersionOpt>;
+export declare const componentToVue2: (vueOptions?: VueOptsWithoutVersion) => Transpiler;
+export declare const componentToVue3: (vueOptions?: VueOptsWithoutVersion) => Transpiler;
+export {};

package/dist/src/generators/vue.js

@@ -38,10 +38,10 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.componentToVue = exports.blockToVue = void 0;
+exports.componentToVue3 = exports.componentToVue2 = exports.blockToVue = void 0;
 var dedent_1 = __importDefault(require("dedent"));
 var standalone_1 = require("prettier/standalone");
-var collect_styles_1 = require("../helpers/collect-styles");
+var collect_css_1 = require("../helpers/styles/collect-css");
 var fast_clone_1 = require("../helpers/fast-clone");
 var get_state_object_string_1 = require("../helpers/get-state-object-string");
 var map_refs_1 = require("../helpers/map-refs");
@@ -265,9 +265,7 @@ function getContextProvideString(component, options) {
         var _a = component.context.set[key], value = _a.value, name_1 = _a.name;
         str += "\n      ".concat(name_1, ": ").concat(value
             ? (0, get_state_object_string_1.getMemberObjectString)(value, {
-                valueMapper: function (code) {
-                    return (0, strip_state_and_props_refs_1.stripStateAndPropsRefs)(code, { replaceWith: '_this.' });
-                },
+                valueMapper: function (code) { return (0, strip_state_and_props_refs_1.stripStateAndPropsRefs)(code, { replaceWith: '_this.' }); },
             })
             : null, ",\n    ");
     }
@@ -299,16 +297,33 @@ var onUpdatePlugin = function (options) { return ({
 }); };
 var BASE_OPTIONS = {
     plugins: [onUpdatePlugin],
+    vueVersion: 2,
 };
 var mergeOptions = function (_a, _b) {
     var _c = _a.plugins, pluginsA = _c === void 0 ? [] : _c, a = __rest(_a, ["plugins"]);
     var _d = _b.plugins, pluginsB = _d === void 0 ? [] : _d, b = __rest(_b, ["plugins"]);
     return (__assign(__assign(__assign({}, a), b), { plugins: __spreadArray(__spreadArray([], pluginsA, true), pluginsB, true) }));
 };
+var generateComponentImport = function (options) {
+    return function (componentName) {
+        var key = (0, lodash_1.kebabCase)(componentName);
+        if (options.vueVersion >= 3 && options.asyncComponentImports) {
+            return "'".concat(key, "': defineAsyncComponent(").concat(componentName, ")");
+        }
+        else {
+            return "'".concat(key, "': ").concat(componentName);
+        }
+    };
+};
+var generateComponents = function (componentsUsed, options) {
+    if (componentsUsed.length === 0) {
+        return '';
+    }
+    else {
+        return "components: { ".concat(componentsUsed.map(generateComponentImport(options)).join(','), " },");
+    }
+};
 var componentToVue = function (userOptions) {
-    if (userOptions === void 0) { userOptions = {}; }
-    // hack while we migrate all other transpilers to receive/handle path
-    // TO-DO: use `Transpiler` once possible
     return function (_a) {
         var _b, _c, _d, _e, _f, _g, _h;
         var component = _a.component, path = _a.path;
@@ -325,9 +340,24 @@ var componentToVue = function (userOptions) {
         if (options.plugins) {
             component = (0, plugins_1.runPostJsonPlugins)(component, options.plugins);
         }
-        var css = (0, collect_styles_1.collectCss)(component, {
+        var css = (0, collect_css_1.collectCss)(component, {
             prefix: (_c = (_b = options.cssNamespace) === null || _b === void 0 ? void 0 : _b.call(options)) !== null && _c !== void 0 ? _c : undefined,
         });
+        var localExports = component.exports;
+        var localVarAsData = [];
+        var localVarAsFunc = [];
+        if (localExports) {
+            Object.keys(localExports).forEach(function (key) {
+                if (localExports[key].usedInLocal) {
+                    if (localExports[key].isFunction) {
+                        localVarAsFunc.push(key);
+                    }
+                    else {
+                        localVarAsData.push(key);
+                    }
+                }
+            });
+        }
         var dataString = (0, get_state_object_string_1.getStateObjectStringFromComponent)(component, {
             data: true,
             functions: false,
@@ -337,9 +367,7 @@ var componentToVue = function (userOptions) {
             data: false,
             getters: true,
             functions: false,
-            valueMapper: function (code) {
-                return processBinding(code.replace(patterns_1.GETTER, ''), options, component);
-            },
+            valueMapper: function (code) { return processBinding(code.replace(patterns_1.GETTER, ''), options, component); },
         });
         var functionsString = (0, get_state_object_string_1.getStateObjectStringFromComponent)(component, {
             data: false,
@@ -350,11 +378,7 @@ var componentToVue = function (userOptions) {
         var blocksString = JSON.stringify(component.children);
         // Component references to include in `component: { YourComponent, ... }
         var componentsUsed = Array.from((0, get_components_used_1.getComponentsUsed)(component))
-            .filter(function (name) {
-            return name.length &&
-                !name.includes('.') &&
-                name[0].toUpperCase() === name[0];
-        })
+            .filter(function (name) { return name.length && !name.includes('.') && name[0].toUpperCase() === name[0]; })
             // Strip out components that compile away
             .filter(function (name) { return !['For', 'Show', 'Fragment', component.name].includes(name); });
         // Append refs to data as { foo, bar, etc }
@@ -365,28 +389,28 @@ var componentToVue = function (userOptions) {
             // Don't include component imports
             .filter(function (key) { return !componentsUsed.includes(key); })
             .join(','), "}"));
+        if (localVarAsData.length) {
+            dataString = dataString.replace(/}$/, "".concat(localVarAsData.join(','), "}"));
+        }
         var elementProps = (0, get_props_1.getProps)(component);
         (0, strip_meta_properties_1.stripMetaProperties)(component);
-        var template = component.children
-            .map(function (item) { return (0, exports.blockToVue)(item, options); })
-            .join('\n');
+        var template = component.children.map(function (item) { return (0, exports.blockToVue)(item, options); }).join('\n');
         var includeClassMapHelper = template.includes('_classStringToObject');
         if (includeClassMapHelper) {
             functionsString = functionsString.replace(/}\s*$/, "_classStringToObject(str) {\n        const obj = {};\n        if (typeof str !== 'string') { return obj }\n        const classNames = str.trim().split(/\\s+/); \n        for (const name of classNames) {\n          obj[name] = true;\n        } \n        return obj;\n      }  }");
         }
+        if (localVarAsFunc.length) {
+            functionsString = functionsString.replace(/}\s*$/, "".concat(localVarAsFunc.join(','), "}"));
+        }
         var onUpdateWithDeps = ((_d = component.hooks.onUpdate) === null || _d === void 0 ? void 0 : _d.filter(function (hook) { var _a; return (_a = hook.deps) === null || _a === void 0 ? void 0 : _a.length; })) || [];
         var onUpdateWithoutDeps = ((_e = component.hooks.onUpdate) === null || _e === void 0 ? void 0 : _e.filter(function (hook) { var _a; return !((_a = hook.deps) === null || _a === void 0 ? void 0 : _a.length); })) || [];
-        var str = (0, dedent_1.default)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n    <template>\n      ", "\n    </template>\n    <script>\n      ", "\n\n      export default {\n        ", "\n        ", "\n        ", "\n        ", "\n\n        ", "\n        ", "\n\n        ", "\n        ", "\n        ", "\n        ", "\n\n        ", "\n        ", "\n      }\n    </script>\n    ", "\n  "], ["\n    <template>\n      ", "\n    </template>\n    <script>\n      ", "\n\n      export default {\n        ", "\n        ", "\n        ", "\n        ", "\n\n        ", "\n        ", "\n\n        ", "\n        ", "\n        ", "\n        ", "\n\n        ", "\n        ", "\n      }\n    </script>\n    ", "\n  "])), template, (0, render_imports_1.renderPreComponent)(component), !component.name
+        var str = (0, dedent_1.default)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n    <template>\n      ", "\n    </template>\n    <script>\n    ", "\n      ", "\n\n      export default {\n        ", "\n        ", "\n        ", "\n        ", "\n\n        ", "\n        ", "\n\n        ", "\n        ", "\n        ", "\n        ", "\n\n        ", "\n        ", "\n      }\n    </script>\n    ", "\n  "], ["\n    <template>\n      ", "\n    </template>\n    <script>\n    ", "\n      ", "\n\n      export default {\n        ", "\n        ", "\n        ", "\n        ", "\n\n        ", "\n        ", "\n\n        ", "\n        ", "\n        ", "\n        ", "\n\n        ", "\n        ", "\n      }\n    </script>\n    ", "\n  "])), template, options.vueVersion >= 3 ? 'import { defineAsyncComponent } from "vue"' : '', (0, render_imports_1.renderPreComponent)({
+            component: component,
+            target: 'vue',
+            asyncComponentImports: options.asyncComponentImports,
+        }), !component.name
             ? ''
-            : "name: '".concat(((_f = options.namePrefix) === null || _f === void 0 ? void 0 : _f.call(options, path))
-                ? ((_g = options.namePrefix) === null || _g === void 0 ? void 0 : _g.call(options, path)) + '-'
-                : '').concat((0, lodash_1.kebabCase)(component.name), "',"), !componentsUsed.length
-            ? ''
-            : "components: { ".concat(componentsUsed
-                .map(function (componentName) {
-                return "'".concat((0, lodash_1.kebabCase)(componentName), "': async () => ").concat(componentName);
-            })
-                .join(','), " },"), elementProps.size
+            : "name: '".concat(path && ((_f = options.namePrefix) === null || _f === void 0 ? void 0 : _f.call(options, path)) ? ((_g = options.namePrefix) === null || _g === void 0 ? void 0 : _g.call(options, path)) + '-' : '').concat((0, lodash_1.kebabCase)(component.name), "',"), generateComponents(componentsUsed, options), elementProps.size
             ? "props: ".concat(JSON.stringify(Array.from(elementProps).filter(function (prop) { return prop !== 'children' && prop !== 'class'; })), ",")
             : '', dataString.length < 4
             ? ''
@@ -447,7 +471,14 @@ var componentToVue = function (userOptions) {
         });
     };
 };
-exports.componentToVue = componentToVue;
+var componentToVue2 = function (vueOptions) {
+    return componentToVue(__assign(__assign({}, vueOptions), { vueVersion: 2 }));
+};
+exports.componentToVue2 = componentToVue2;
+var componentToVue3 = function (vueOptions) {
+    return componentToVue(__assign(__assign({}, vueOptions), { vueVersion: 3 }));
+};
+exports.componentToVue3 = componentToVue3;
 // Remove unused artifacts like empty script or style tags
 var removePatterns = [
     "<script>\nexport default {};\n</script>",

package/dist/src/helpers/babel-transform.js

@@ -44,10 +44,7 @@ var babelTransform = function (code, visitor) {
         configFile: false,
         babelrc: false,
         presets: [[tsPreset, { isTSX: true, allExtensions: true }]],
-        plugins: __spreadArray([
-            [decorators, { legacy: true }],
-            jsxPlugin
-        ], (visitor ? [function () { return ({ visitor: visitor }); }] : []), true),
+        plugins: __spreadArray([[decorators, { legacy: true }], jsxPlugin], (visitor ? [function () { return ({ visitor: visitor }); }] : []), true),
     });
 };
 exports.babelTransform = babelTransform;
@@ -68,8 +65,7 @@ var babelTransformExpression = function (code, visitor, type) {
     }
     // For Builder content
     if (type === 'unknown' &&
-        (code.includes('return _virtual_index') ||
-            code.trim().startsWith('return ')) &&
+        (code.includes('return _virtual_index') || code.trim().startsWith('return ')) &&
         !code.trim().startsWith('function')) {
         type = 'functionBody';
     }
@@ -97,8 +93,7 @@ var babelTransformExpression = function (code, visitor, type) {
             // If it can't, e.g. this is an expression or code fragment, modify the code below and try again
             // Detect method fragments. These get passed sometimes and otherwise
             // generate compile errors. They are of the form `foo() { ... }`
-            var isMethod = Boolean(!code.startsWith('function') &&
-                code.match(/^[a-z0-9]+\s*\([^\)]*\)\s*[\{:]/i));
+            var isMethod = Boolean(!code.startsWith('function') && code.match(/^[a-z0-9_]+\s*\([^\)]*\)\s*[\{:]/i));
             if (isMethod) {
                 useCode = "function ".concat(useCode);
             }

package/dist/src/helpers/create-mitosis-component.d.ts

@@ -1,2 +1,2 @@
 import { MitosisComponent } from '../types/mitosis-component';
-export declare const createMitosisComponent: (options?: Partial<MitosisComponent> | undefined) => MitosisComponent;
+export declare const createMitosisComponent: (options?: Partial<MitosisComponent>) => MitosisComponent;

package/dist/src/helpers/create-mitosis-component.js

@@ -12,5 +12,5 @@ var __assign = (this && this.__assign) || function () {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.createMitosisComponent = void 0;
-var createMitosisComponent = function (options) { return (__assign({ '@type': '@builder.io/mitosis/component', imports: [], inputs: [], meta: {}, state: {}, children: [], hooks: {}, context: { get: {}, set: {} }, name: (options === null || options === void 0 ? void 0 : options.name) || 'MyComponent', subComponents: [] }, options)); };
+var createMitosisComponent = function (options) { return (__assign({ '@type': '@builder.io/mitosis/component', imports: [], exports: {}, inputs: [], meta: {}, refs: {}, state: {}, children: [], hooks: {}, context: { get: {}, set: {} }, name: (options === null || options === void 0 ? void 0 : options.name) || 'MyComponent', subComponents: [] }, options)); };
 exports.createMitosisComponent = createMitosisComponent;

package/dist/src/helpers/fast-clone.js

@@ -1,7 +1,5 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.fastClone = void 0;
-var fastClone = function (obj) {
-    return JSON.parse(JSON.stringify(obj));
-};
+var fastClone = function (obj) { return JSON.parse(JSON.stringify(obj)); };
 exports.fastClone = fastClone;

package/dist/src/helpers/filter-empty-text-nodes.js

@@ -2,7 +2,6 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.filterEmptyTextNodes = void 0;
 var filterEmptyTextNodes = function (node) {
-    return !(typeof node.properties._text === 'string' &&
-        !node.properties._text.trim().length);
+    return !(typeof node.properties._text === 'string' && !node.properties._text.trim().length);
 };
 exports.filterEmptyTextNodes = filterEmptyTextNodes;

package/dist/src/helpers/get-bindings.d.ts

@@ -0,0 +1,2 @@
+import { MitosisNode } from '../types/mitosis-node';
+export declare function getBindingsCode(children: MitosisNode[]): string[];

package/dist/src/helpers/get-bindings.js

@@ -0,0 +1,18 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getBindingsCode = void 0;
+function getBindingsCode(children) {
+    var bindings = [];
+    children.forEach(function (child) {
+        if (child.bindings) {
+            Object.keys(child.bindings).forEach(function (key) {
+                bindings.push(child.bindings[key].code);
+            });
+        }
+        if (child.children) {
+            bindings.push.apply(bindings, getBindingsCode(child.children));
+        }
+    });
+    return bindings;
+}
+exports.getBindingsCode = getBindingsCode;

package/dist/src/helpers/get-props-ref.d.ts

@@ -0,0 +1,2 @@
+import { MitosisComponent } from '../types/mitosis-component';
+export declare function getPropsRef(json: MitosisComponent, shouldRemove?: boolean): [string, boolean];

package/dist/src/helpers/get-props-ref.js

@@ -0,0 +1,32 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getPropsRef = void 0;
+var traverse_1 = __importDefault(require("traverse"));
+var is_mitosis_node_1 = require("./is-mitosis-node");
+function getPropsRef(json, shouldRemove) {
+    var has = false;
+    var prop = '';
+    (0, traverse_1.default)(json).forEach(function (item) {
+        if ((0, is_mitosis_node_1.isMitosisNode)(item)) {
+            var binding = item.bindings.ref;
+            var regexp = /(.+)?props\.(.+)( |\)|;|\()?$/;
+            if (binding && regexp.test(binding.code)) {
+                var match = regexp.exec(binding.code);
+                var _prop = match === null || match === void 0 ? void 0 : match[2];
+                if (_prop) {
+                    prop = _prop;
+                }
+                if (shouldRemove) {
+                    delete item.bindings.ref;
+                }
+                has = true;
+                this.stop();
+            }
+        }
+    });
+    return [prop, has];
+}
+exports.getPropsRef = getPropsRef;

package/dist/src/helpers/getters-to-functions.d.ts

@@ -1,5 +1,5 @@
 import { MitosisComponent } from '../types/mitosis-component';
 /**
- * Map getters like `useState({ get foo() { ... }})` from `state.foo` to `foo()`
+ * Map getters like `useStore({ get foo() { ... }})` from `state.foo` to `foo()`
  */
 export declare const gettersToFunctions: (json: MitosisComponent) => void;

package/dist/src/helpers/getters-to-functions.js

@@ -7,7 +7,7 @@ exports.gettersToFunctions = void 0;
 var method_literal_prefix_1 = require("../constants/method-literal-prefix");
 var traverse_1 = __importDefault(require("traverse"));
 /**
- * Map getters like `useState({ get foo() { ... }})` from `state.foo` to `foo()`
+ * Map getters like `useStore({ get foo() { ... }})` from `state.foo` to `foo()`
  */
 var gettersToFunctions = function (json) {
     var getterKeys = Object.keys(json.state).filter(function (item) {

package/dist/src/helpers/has-bindings-text.d.ts

@@ -0,0 +1,2 @@
+import { MitosisComponent } from '../types/mitosis-component';
+export declare const hasBindingsText: (json: MitosisComponent) => boolean;

package/dist/src/helpers/has-bindings-text.js

@@ -0,0 +1,21 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.hasBindingsText = void 0;
+var traverse_1 = __importDefault(require("traverse"));
+var is_mitosis_node_1 = require("./is-mitosis-node");
+var is_children_1 = __importDefault(require("./is-children"));
+var hasBindingsText = function (json) {
+    var has = false;
+    (0, traverse_1.default)(json).forEach(function (node) {
+        var _a;
+        if ((0, is_mitosis_node_1.isMitosisNode)(node) && !(0, is_children_1.default)(node) && ((_a = node.bindings._text) === null || _a === void 0 ? void 0 : _a.code)) {
+            has = true;
+            this.stop();
+        }
+    });
+    return has;
+};
+exports.hasBindingsText = hasBindingsText;

package/dist/src/helpers/has-stateful-dom.d.ts

@@ -0,0 +1,2 @@
+import { MitosisComponent } from '../types/mitosis-component';
+export declare const hasStatefulDom: (json: MitosisComponent) => boolean;

package/dist/src/helpers/has-stateful-dom.js

@@ -0,0 +1,21 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.hasStatefulDom = void 0;
+var traverse_1 = __importDefault(require("traverse"));
+var is_mitosis_node_1 = require("./is-mitosis-node");
+var hasStatefulDom = function (json) {
+    var has = false;
+    (0, traverse_1.default)(json).forEach(function (item) {
+        if ((0, is_mitosis_node_1.isMitosisNode)(item)) {
+            if (/input|textarea|select/.test(item.name)) {
+                has = true;
+                this.stop();
+            }
+        }
+    });
+    return has;
+};
+exports.hasStatefulDom = hasStatefulDom;

package/dist/src/helpers/is-children.js

@@ -2,7 +2,6 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 function isChildren(node) {
     var _a;
-    return ("".concat(((_a = node.bindings._text) === null || _a === void 0 ? void 0 : _a.code) || '').replace(/\s+/g, '') ===
-        'props.children');
+    return "".concat(((_a = node.bindings._text) === null || _a === void 0 ? void 0 : _a.code) || '').replace(/\s+/g, '') === 'props.children';
 }
 exports.default = isChildren;

package/dist/src/helpers/is-component.js

@@ -4,7 +4,5 @@ exports.isComponent = void 0;
 /**
  * This node is a component, vs a plain html tag (<Foo> vs <div>)
  */
-var isComponent = function (json) {
-    return json.name.toLowerCase() !== json.name;
-};
+var isComponent = function (json) { return json.name.toLowerCase() !== json.name; };
 exports.isComponent = isComponent;

package/dist/src/helpers/is-html-attribute.d.ts

@@ -1,4 +1,4 @@
 export declare const htmlElementAttributes: {
     [key: string]: string[];
 };
-export declare const isHtmlAttribute: (attr: string, tagName: string) => string | true | undefined;
+export declare const isHtmlAttribute: (attr: string, tagName: string) => boolean;

package/dist/src/helpers/is-html-attribute.js

@@ -80,15 +80,7 @@ exports.htmlElementAttributes = {
         'target',
         'type',
     ],
-    audio: [
-        'autoplay',
-        'controls',
-        'crossorigin',
-        'loop',
-        'muted',
-        'preload',
-        'src',
-    ],
+    audio: ['autoplay', 'controls', 'crossorigin', 'loop', 'muted', 'preload', 'src'],
     base: ['href', 'target'],
     basefont: ['color', 'face', 'size'],
     blockquote: ['cite'],
@@ -295,15 +287,7 @@ exports.htmlElementAttributes = {
         'src',
         'type',
     ],
-    select: [
-        'autocomplete',
-        'disabled',
-        'form',
-        'multiple',
-        'name',
-        'required',
-        'size',
-    ],
+    select: ['autocomplete', 'disabled', 'form', 'multiple', 'name', 'required', 'size'],
     slot: ['name'],
     source: ['height', 'media', 'sizes', 'src', 'srcset', 'type', 'width'],
     style: ['media', 'type'],
@@ -390,6 +374,7 @@ var isHtmlAttribute = function (attr, tagName) {
     if (/role|aria-/.test(attr)) {
         return true;
     }
-    return __spreadArray(__spreadArray([], exports.htmlElementAttributes['*'], true), (exports.htmlElementAttributes[tagName] || []), true).find(function (attribute) { return attr === attribute; });
+    var getAttr = __spreadArray(__spreadArray([], exports.htmlElementAttributes['*'], true), (exports.htmlElementAttributes[tagName] || []), true).find(function (attribute) { return attr === attribute; });
+    return Boolean(getAttr);
 };
 exports.isHtmlAttribute = isHtmlAttribute;

package/dist/src/helpers/map-refs.js

@@ -59,7 +59,10 @@ var replaceRefsInString = function (code, refs, mapper) {
     });
 };
 var mapRefs = function (component, mapper) {
-    var refs = Array.from((0, get_refs_1.getRefs)(component));
+    var refSet = (0, get_refs_1.getRefs)(component);
+    // grab refs not used for bindings
+    Object.keys(component.refs).forEach(function (ref) { return refSet.add(ref); });
+    var refs = Array.from(refSet);
     for (var _i = 0, _a = Object.keys(component.state); _i < _a.length; _i++) {
         var key = _a[_i];
         var value = component.state[key];

package/dist/src/helpers/parsers.js

@@ -43,8 +43,7 @@ function parseCode(code) {
 exports.parseCode = parseCode;
 var isCodeBodyExpression = function (body) {
     return body.length == 1 &&
-        (babel.types.isExpression(body[0]) ||
-            babel.types.isExpressionStatement(body[0]));
+        (babel.types.isExpression(body[0]) || babel.types.isExpressionStatement(body[0]));
 };
 exports.isCodeBodyExpression = isCodeBodyExpression;
 /**

package/dist/src/helpers/render-imports.d.ts

@@ -1,2 +1,18 @@
-import { MitosisComponent } from '../types/mitosis-component';
-export declare const renderPreComponent: (component: MitosisComponent, target?: "angular" | "builder" | "customElement" | "html" | "mitosis" | "liquid" | "react" | "reactNative" | "solid" | "svelte" | "swift" | "template" | "webcomponent" | "vue" | undefined) => string;
+import { Target } from '../types/config';
+import { MitosisComponent, MitosisImport } from '../types/mitosis-component';
+export declare const renderImport: ({ theImport, target, asyncComponentImports, }: {
+    theImport: MitosisImport;
+    target: Target;
+    asyncComponentImports: boolean;
+}) => string;
+export declare const renderImports: ({ imports, target, asyncComponentImports, }: {
+    imports: MitosisImport[];
+    target: Target;
+    asyncComponentImports: boolean;
+}) => string;
+export declare const renderPreComponent: ({ component, target, asyncComponentImports, }: {
+    component: MitosisComponent;
+    target: Target;
+    asyncComponentImports?: boolean | undefined;
+}) => string;
+export declare const renderExportAndLocal: (component: MitosisComponent) => string;