@builder.io/mitosis 0.4.0 → 0.4.2

package/dist/src/generators/qwik/helpers/handlers.js

@@ -1,19 +1,10 @@
 "use strict";
-var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
-    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
-        if (ar || !(i in from)) {
-            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
-            ar[i] = from[i];
-        }
-    }
-    return to.concat(ar || Array.prototype.slice.call(from));
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.renderHandlers = void 0;
-var component_1 = require("../component");
-var src_generator_1 = require("../src-generator");
-var IIF_START = '(() => {';
-var IIF_END = '})()';
+const component_1 = require("../component");
+const src_generator_1 = require("../src-generator");
+const IIF_START = '(() => {';
+const IIF_END = '})()';
 function extractJSBlock(binding) {
     if (typeof binding == 'string') {
         if (binding.startsWith('{') &&
@@ -29,33 +20,33 @@ function extractJSBlock(binding) {
     return null;
 }
 function renderHandlers(file, componentName, children) {
-    var id = 0;
-    var map = new Map();
-    var nodes = __spreadArray([], children, true);
+    let id = 0;
+    const map = new Map();
+    const nodes = [...children];
     while (nodes.length) {
-        var node = nodes.shift();
-        var bindings = node.bindings;
-        for (var key in bindings) {
+        const node = nodes.shift();
+        const bindings = node.bindings;
+        for (const key in bindings) {
             if (Object.prototype.hasOwnProperty.call(bindings, key)) {
-                var binding = bindings[key].code;
+                const { code: binding } = bindings[key];
                 if (binding != null) {
                     if (isEventName(key)) {
-                        var block = extractJSBlock(binding) || binding;
-                        var symbol = "".concat(componentName, "_").concat(key, "_").concat(id++);
+                        let block = extractJSBlock(binding) || binding;
+                        const symbol = `${componentName}_${key}_${id++}`;
                         map.set(binding, symbol);
                         renderHandler(file, symbol, block);
                     }
                 }
             }
         }
-        nodes.push.apply(nodes, node.children);
+        nodes.push(...node.children);
     }
     return map;
 }
 exports.renderHandlers = renderHandlers;
 function renderHandler(file, symbol, code) {
-    var body = [code];
-    var shouldRenderStateRestore = code.indexOf('state') !== -1;
+    const body = [code];
+    const shouldRenderStateRestore = code.indexOf('state') !== -1;
     if (shouldRenderStateRestore) {
         body.unshift((0, component_1.renderUseLexicalScope)(file));
     }

package/dist/src/generators/qwik/helpers/stable-inject.js

@@ -6,7 +6,7 @@ exports.stableInject = void 0;
  * This is needed for our `MitosisState` values which are JS expressions stored as strings.
  */
 function stableInject(obj) {
-    var output = [];
+    const output = [];
     _serialize(output, obj);
     return output.join('');
 }
@@ -18,8 +18,8 @@ function _serialize(output, obj) {
     else if (typeof obj === 'object') {
         if (Array.isArray(obj)) {
             output.push('[');
-            var sep = '';
-            for (var i = 0; i < obj.length; i++) {
+            let sep = '';
+            for (let i = 0; i < obj.length; i++) {
                 output.push(sep);
                 _serialize(output, obj[i]);
                 sep = ',';
@@ -27,12 +27,11 @@ function _serialize(output, obj) {
             output.push(']');
         }
         else {
-            var keys = Object.keys(obj).sort();
+            const keys = Object.keys(obj).sort();
             output.push('{');
-            var sep = '';
-            for (var _i = 0, keys_1 = keys; _i < keys_1.length; _i++) {
-                var key = keys_1[_i];
-                var value = obj[key];
+            let sep = '';
+            for (const key of keys) {
+                const value = obj[key];
                 if (value !== undefined) {
                     output.push(sep);
                     output.push(JSON.stringify(key));

package/dist/src/generators/qwik/helpers/stable-serialize.js

@@ -7,7 +7,7 @@ exports.stableJSONserialize = void 0;
  * @returns JSON serialized string
  */
 function stableJSONserialize(obj) {
-    var output = [];
+    const output = [];
     _serialize(output, obj);
     return output.join('');
 }
@@ -19,8 +19,8 @@ function _serialize(output, obj) {
     else if (typeof obj === 'object') {
         if (Array.isArray(obj)) {
             output.push('[');
-            var sep = '';
-            for (var i = 0; i < obj.length; i++) {
+            let sep = '';
+            for (let i = 0; i < obj.length; i++) {
                 output.push(sep);
                 _serialize(output, obj[i]);
                 sep = ',';
@@ -28,12 +28,11 @@ function _serialize(output, obj) {
             output.push(']');
         }
         else {
-            var keys = Object.keys(obj).sort();
+            const keys = Object.keys(obj).sort();
             output.push('{');
-            var sep = '';
-            for (var _i = 0, keys_1 = keys; _i < keys_1.length; _i++) {
-                var key = keys_1[_i];
-                var value = obj[key];
+            let sep = '';
+            for (const key of keys) {
+                const value = obj[key];
                 if (value !== undefined) {
                     output.push(sep);
                     output.push(JSON.stringify(key));

package/dist/src/generators/qwik/helpers/state.js

@@ -1,61 +1,51 @@
 "use strict";
-var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
-    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
-        if (ar || !(i in from)) {
-            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
-            ar[i] = from[i];
-        }
-    }
-    return to.concat(ar || Array.prototype.slice.call(from));
-};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getStateMethodsAndGetters = exports.getLexicalScopeVars = exports.emitStateMethodsAndRewriteBindings = exports.emitUseStore = void 0;
-var legacy_1 = __importDefault(require("neotraverse/legacy"));
-var babel_transform_1 = require("../../../helpers/babel-transform");
-var convert_method_to_function_1 = require("./convert-method-to-function");
-var stable_inject_1 = require("./stable-inject");
+const legacy_1 = __importDefault(require("neotraverse/legacy"));
+const babel_transform_1 = require("../../../helpers/babel-transform");
+const convert_method_to_function_1 = require("./convert-method-to-function");
+const stable_inject_1 = require("./stable-inject");
 /**
  * @param file
  * @param stateInit
  */
-function emitUseStore(_a) {
-    var file = _a.file, stateInit = _a.stateInit, isDeep = _a.isDeep;
-    var state = stateInit[0];
-    var hasState = state && Object.keys(state).length > 0;
+function emitUseStore({ file, stateInit, isDeep, }) {
+    const state = stateInit[0];
+    const hasState = state && Object.keys(state).length > 0;
     if (hasState) {
         file.src.emit('const state=', file.import(file.qwikModule, 'useStore').localName);
         if (file.options.isTypeScript) {
             file.src.emit('<any>');
         }
-        var fnArgs = [(0, stable_inject_1.stableInject)(state), isDeep ? '{deep: true}' : undefined].filter(Boolean);
-        file.src.emit("(".concat(fnArgs, ");"));
+        const fnArgs = [(0, stable_inject_1.stableInject)(state), isDeep ? '{deep: true}' : undefined].filter(Boolean);
+        file.src.emit(`(${fnArgs});`);
     }
     else {
         // TODO hack for now so that `state` variable is defined, even though it is never read.
-        file.src.emit("const state".concat(file.options.isTypeScript ? ': any' : '', " = {};"));
+        file.src.emit(`const state${file.options.isTypeScript ? ': any' : ''} = {};`);
     }
 }
 exports.emitUseStore = emitUseStore;
 function emitStateMethods(file, componentState, lexicalArgs) {
-    var stateValues = {};
-    var stateInit = [stateValues];
-    var methodMap = getStateMethodsAndGetters(componentState);
-    for (var key in componentState) {
-        var stateValue = componentState[key];
+    const stateValues = {};
+    const stateInit = [stateValues];
+    const methodMap = getStateMethodsAndGetters(componentState);
+    for (const key in componentState) {
+        const stateValue = componentState[key];
         switch (stateValue === null || stateValue === void 0 ? void 0 : stateValue.type) {
             case 'method':
             case 'function':
-                var code = stateValue.code;
-                var prefixIdx = 0;
+                let code = stateValue.code;
+                let prefixIdx = 0;
                 if (stateValue.type === 'function') {
                     prefixIdx += 'function '.length;
                 }
                 code = code.substring(prefixIdx);
-                code = (0, convert_method_to_function_1.convertMethodToFunction)(code, methodMap, lexicalArgs).replace('(', "(".concat(lexicalArgs.join(','), ","));
-                var functionName = code.split(/\(/)[0];
+                code = (0, convert_method_to_function_1.convertMethodToFunction)(code, methodMap, lexicalArgs).replace('(', `(${lexicalArgs.join(',')},`);
+                const functionName = code.split(/\(/)[0];
                 if (!file.options.isTypeScript) {
                     // Erase type information
                     code = (0, babel_transform_1.convertTypeScriptToJS)(code);
@@ -71,41 +61,44 @@ function emitStateMethods(file, componentState, lexicalArgs) {
 }
 function emitStateMethodsAndRewriteBindings(file, component, metadata) {
     var _a;
-    var lexicalArgs = getLexicalScopeVars(component);
-    var state = emitStateMethods(file, component.state, lexicalArgs);
-    var methodMap = getStateMethodsAndGetters(component.state);
+    const lexicalArgs = getLexicalScopeVars(component);
+    const state = emitStateMethods(file, component.state, lexicalArgs);
+    const methodMap = getStateMethodsAndGetters(component.state);
     rewriteCodeExpr(component, methodMap, lexicalArgs, (_a = metadata === null || metadata === void 0 ? void 0 : metadata.qwik) === null || _a === void 0 ? void 0 : _a.replace);
     return state;
 }
 exports.emitStateMethodsAndRewriteBindings = emitStateMethodsAndRewriteBindings;
-var checkIsObjectWithCodeBlock = function (obj) {
+const checkIsObjectWithCodeBlock = (obj) => {
     return typeof obj == 'object' && (obj === null || obj === void 0 ? void 0 : obj.code) && typeof obj.code === 'string';
 };
 function getLexicalScopeVars(component) {
-    var newLocal = __spreadArray(__spreadArray(__spreadArray([
+    const newLocal = [
         'props',
-        'state'
-    ], Object.keys(component.state).filter(function (k) { return component.state[k].type === 'getter'; }), true), Object.keys(component.refs), true), Object.keys(component.context.get), true);
+        'state',
+        // all `useComputed` values
+        ...Object.keys(component.state).filter((k) => component.state[k].type === 'getter'),
+        ...Object.keys(component.refs),
+        ...Object.keys(component.context.get),
+    ];
     return newLocal;
 }
 exports.getLexicalScopeVars = getLexicalScopeVars;
-function rewriteCodeExpr(component, methodMap, lexicalArgs, replace) {
-    if (replace === void 0) { replace = {}; }
+function rewriteCodeExpr(component, methodMap, lexicalArgs, replace = {}) {
     (0, legacy_1.default)(component).forEach(function (item) {
         if (!checkIsObjectWithCodeBlock(item)) {
             return;
         }
-        var code = (0, convert_method_to_function_1.convertMethodToFunction)(item.code, methodMap, lexicalArgs);
-        Object.keys(replace).forEach(function (key) {
+        let code = (0, convert_method_to_function_1.convertMethodToFunction)(item.code, methodMap, lexicalArgs);
+        Object.keys(replace).forEach((key) => {
             code = code.replace(key, replace[key]);
         });
         item.code = code;
     });
 }
 function getStateMethodsAndGetters(state) {
-    var methodMap = {};
-    Object.keys(state).forEach(function (key) {
-        var stateVal = state[key];
+    const methodMap = {};
+    Object.keys(state).forEach((key) => {
+        const stateVal = state[key];
         if ((stateVal === null || stateVal === void 0 ? void 0 : stateVal.type) === 'getter' || (stateVal === null || stateVal === void 0 ? void 0 : stateVal.type) === 'method') {
             methodMap[key] = stateVal.type;
         }

package/dist/src/generators/qwik/helpers/styles.js

@@ -1,40 +1,20 @@
 "use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
-    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
-        if (ar || !(i in from)) {
-            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
-            ar[i] = from[i];
-        }
-    }
-    return to.concat(ar || Array.prototype.slice.call(from));
-};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.renderStyles = exports.collectStyles = void 0;
-var json5_1 = __importDefault(require("json5"));
-var dash_case_1 = require("../../../helpers/dash-case");
+const json5_1 = __importDefault(require("json5"));
+const dash_case_1 = require("../../../helpers/dash-case");
 function collectStyles(children, styleMap) {
     var _a;
-    var nodes = __spreadArray([], children, true);
+    const nodes = [...children];
     while (nodes.length) {
-        var child = nodes.shift();
-        nodes.push.apply(nodes, child.children);
-        var css = (_a = child.bindings.css) === null || _a === void 0 ? void 0 : _a.code;
+        const child = nodes.shift();
+        nodes.push(...child.children);
+        const css = (_a = child.bindings.css) === null || _a === void 0 ? void 0 : _a.code;
         if (css && typeof css == 'string') {
-            var value = __assign({ CLASS_NAME: 'c' + hashCode(css) }, json5_1.default.parse(css));
+            const value = { CLASS_NAME: 'c' + hashCode(css), ...json5_1.default.parse(css) };
             styleMap.set(css, value);
         }
     }
@@ -54,32 +34,31 @@ function hashCode(text) {
 }
 function renderStyles(styles) {
     return function () {
-        var _this = this;
         this.emit('`');
-        var mediaStyles = [];
-        styles.forEach(function (styles) {
-            _this.emit('.', styles.CLASS_NAME, /*'.🏷️�', WS,*/ '{');
-            for (var key in styles) {
+        const mediaStyles = [];
+        styles.forEach((styles) => {
+            this.emit('.', styles.CLASS_NAME, /*'.🏷️�', WS,*/ '{');
+            for (const key in styles) {
                 if (key !== 'CLASS_NAME' && Object.prototype.hasOwnProperty.call(styles, key)) {
-                    var value = styles[key];
+                    const value = styles[key];
                     if (value && typeof value == 'object') {
                         mediaStyles.push(styles.CLASS_NAME, key, value);
                     }
                     else {
-                        _this.emit((0, dash_case_1.dashCase)(key), ':', value, ';');
+                        this.emit((0, dash_case_1.dashCase)(key), ':', value, ';');
                     }
                 }
             }
-            _this.emit('}');
+            this.emit('}');
         });
         while (mediaStyles.length) {
-            var className = mediaStyles.shift();
-            var mediaKey = mediaStyles.shift();
-            var mediaObj = mediaStyles.shift();
+            const className = mediaStyles.shift();
+            const mediaKey = mediaStyles.shift();
+            const mediaObj = mediaStyles.shift();
             this.emit(mediaKey, '{.', className, /*'.🏷️�',*/ '{');
-            for (var key in mediaObj) {
+            for (const key in mediaObj) {
                 if (Object.prototype.hasOwnProperty.call(mediaObj, key)) {
-                    var value = mediaObj[key];
+                    const value = mediaObj[key];
                     this.emit((0, dash_case_1.dashCase)(key), ':', value, ';');
                 }
             }

package/dist/src/generators/qwik/jsx.js

@@ -1,29 +1,9 @@
 "use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
-    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
-        if (ar || !(i in from)) {
-            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
-            ar[i] = from[i];
-        }
-    }
-    return to.concat(ar || Array.prototype.slice.call(from));
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.renderJSXNodes = void 0;
-var is_mitosis_node_1 = require("../../helpers/is-mitosis-node");
-var directives_1 = require("./directives");
-var src_generator_1 = require("./src-generator");
+const is_mitosis_node_1 = require("../../helpers/is-mitosis-node");
+const directives_1 = require("./directives");
+const src_generator_1 = require("./src-generator");
 /**
  * Convert a Mitosis nodes to a JSX nodes.
  *
@@ -37,61 +17,59 @@ var src_generator_1 = require("./src-generator");
  * @param root True if this is the root JSX, and may need a Fragment wrapper.
  * @returns
  */
-function renderJSXNodes(file, directives, handlers, children, styles, key, parentSymbolBindings, root) {
-    if (root === void 0) { root = true; }
+function renderJSXNodes(file, directives, handlers, children, styles, key, parentSymbolBindings, root = true) {
     return function () {
-        var _this = this;
-        var srcBuilder = this;
+        const srcBuilder = this;
         if (children.length == 0)
             return;
         if (root)
             this.emit('(');
-        var needsFragment = root &&
+        const needsFragment = root &&
             (children.length > 1 ||
                 (children.length && (isInlinedDirective(children[0]) || isTextNode(children[0]))));
         file.import(file.qwikModule, 'h');
-        var fragmentSymbol = file.import(file.qwikModule, 'Fragment');
+        const fragmentSymbol = file.import(file.qwikModule, 'Fragment');
         if (needsFragment) {
             this.jsxBeginFragment(fragmentSymbol);
         }
-        children.forEach(function (child) {
+        children.forEach((child) => {
             var _a, _b;
             if (isEmptyTextNode(child))
                 return;
             if (isTextNode(child)) {
-                var text = child.properties._text;
-                var textExpr = (_a = child.bindings._text) === null || _a === void 0 ? void 0 : _a.code;
+                const text = child.properties._text;
+                const textExpr = (_a = child.bindings._text) === null || _a === void 0 ? void 0 : _a.code;
                 if (typeof text == 'string') {
-                    _this.isJSX ? _this.emit(text) : _this.jsxTextBinding((0, src_generator_1.quote)(text));
+                    this.isJSX ? this.emit(text) : this.jsxTextBinding((0, src_generator_1.quote)(text));
                 }
                 else if (typeof textExpr == 'string') {
-                    _this.isJSX ? _this.emit('{', textExpr, '}') : _this.jsxTextBinding(textExpr);
+                    this.isJSX ? this.emit('{', textExpr, '}') : this.jsxTextBinding(textExpr);
                 }
             }
             else if (isSlotProjection(child)) {
-                _this.file.import(_this.file.qwikModule, 'Slot');
-                _this.jsxBegin('Slot', {}, {});
-                _this.jsxEnd('Slot');
+                this.file.import(this.file.qwikModule, 'Slot');
+                this.jsxBegin('Slot', {}, {});
+                this.jsxEnd('Slot');
             }
             else {
-                var childName = child.name;
-                var directive = directives_1.DIRECTIVES[childName];
+                let childName = child.name;
+                const directive = directives_1.DIRECTIVES[childName];
                 if (typeof directive == 'function') {
-                    var blockFn_1 = mitosisNodeToRenderBlock(child.children);
-                    var meta_1 = child.meta;
-                    Object.keys(meta_1).forEach(function (key) {
-                        var value = meta_1[key];
+                    const blockFn = mitosisNodeToRenderBlock(child.children);
+                    const meta = child.meta;
+                    Object.keys(meta).forEach((key) => {
+                        const value = meta[key];
                         if ((0, is_mitosis_node_1.isMitosisNode)(value)) {
-                            blockFn_1[key] = mitosisNodeToRenderBlock([value]);
+                            blockFn[key] = mitosisNodeToRenderBlock([value]);
                         }
                     });
-                    _this.emit(directive(child, blockFn_1));
-                    !_this.isJSX && _this.emit(',');
+                    this.emit(directive(child, blockFn));
+                    !this.isJSX && this.emit(',');
                     includedHelperDirectives(directive.toString(), directives);
                 }
                 else {
                     if (childName === 'Slot') {
-                        _this.file.import(_this.file.qwikModule, 'Slot');
+                        this.file.import(this.file.qwikModule, 'Slot');
                     }
                     else {
                         if (typeof directive == 'string') {
@@ -104,19 +82,19 @@ function renderJSXNodes(file, directives, handlers, children, styles, key, paren
                         if (isSymbol(childName)) {
                             // TODO(misko): We are hard coding './med.js' which is not right.
                             !file.imports.hasImport(childName) && file.import('./med.js', childName);
-                            var exportedChildName = file.exports.get(childName);
+                            let exportedChildName = file.exports.get(childName);
                             if (exportedChildName) {
                                 childName = exportedChildName;
                             }
                         }
                     }
-                    var props = child.properties;
-                    var css = (_b = child.bindings.css) === null || _b === void 0 ? void 0 : _b.code;
-                    var specialBindings = {};
+                    let props = child.properties;
+                    const css = (_b = child.bindings.css) === null || _b === void 0 ? void 0 : _b.code;
+                    const specialBindings = {};
                     if (css) {
-                        props = __assign({}, props);
-                        var styleProps = styles.get(css);
-                        var imageMaxWidth = childName == 'Image' && styleProps.maxWidth;
+                        props = { ...props };
+                        const styleProps = styles.get(css);
+                        const imageMaxWidth = childName == 'Image' && styleProps.maxWidth;
                         if (imageMaxWidth && imageMaxWidth.endsWith('px')) {
                             // special case for Images. We want to make sure that we include the maxWidth in a srcset
                             specialBindings.srcsetSizes = Number.parseInt(imageMaxWidth);
@@ -128,13 +106,20 @@ function renderJSXNodes(file, directives, handlers, children, styles, key, paren
                     key = props['builder-id'] || key;
                     if (props.innerHTML) {
                         // Special case. innerHTML requires `key` in Qwik
-                        props = __assign({ key: key || 'default' }, props);
+                        props = {
+                            key: key || 'default',
+                            ...props,
+                        };
                     }
-                    var symbolBindings = {};
-                    var bindings = rewriteHandlers(file, handlers, child.bindings, symbolBindings);
-                    _this.jsxBegin(childName, props, __assign(__assign(__assign({}, bindings), parentSymbolBindings), specialBindings));
-                    renderJSXNodes(file, directives, handlers, child.children, styles, key, symbolBindings, false).call(_this);
-                    _this.jsxEnd(childName);
+                    const symbolBindings = {};
+                    const bindings = rewriteHandlers(file, handlers, child.bindings, symbolBindings);
+                    this.jsxBegin(childName, props, {
+                        ...bindings,
+                        ...parentSymbolBindings,
+                        ...specialBindings,
+                    });
+                    renderJSXNodes(file, directives, handlers, child.children, styles, key, symbolBindings, false).call(this);
+                    this.jsxEnd(childName);
                 }
             }
         });
@@ -144,9 +129,9 @@ function renderJSXNodes(file, directives, handlers, children, styles, key, paren
         if (root)
             this.emit(')');
         function mitosisNodeToRenderBlock(children) {
-            return function () {
-                children = children.filter(function (c) { return !isEmptyTextNode(c); });
-                var childNeedsFragment = children.length > 1 || (children.length && isTextNode(children[0]));
+            return () => {
+                children = children.filter((c) => !isEmptyTextNode(c));
+                const childNeedsFragment = children.length > 1 || (children.length && isTextNode(children[0]));
                 childNeedsFragment && srcBuilder.jsxBeginFragment(fragmentSymbol);
                 renderJSXNodes(file, directives, handlers, children, styles, null, {}, false).call(srcBuilder);
                 childNeedsFragment && srcBuilder.jsxEndFragment();
@@ -156,9 +141,9 @@ function renderJSXNodes(file, directives, handlers, children, styles, key, paren
 }
 exports.renderJSXNodes = renderJSXNodes;
 function includedHelperDirectives(directive, directives) {
-    Array.from(directive.matchAll(/(__[\w]+__)/g)).forEach(function (match) {
-        var name = match[0];
-        var code = directives_1.DIRECTIVES[name];
+    Array.from(directive.matchAll(/(__[\w]+__)/g)).forEach((match) => {
+        const name = match[0];
+        const code = directives_1.DIRECTIVES[name];
         typeof code == 'string' && directives.set(name, code);
     });
 }
@@ -168,7 +153,7 @@ function isSymbol(name) {
         !name.includes('.'));
 }
 function addClass(className, existingClass) {
-    return __spreadArray([className], (existingClass ? existingClass.split(' ') : []), true).join(' ');
+    return [className, ...(existingClass ? existingClass.split(' ') : [])].join(' ');
 }
 function isEmptyTextNode(child) {
     var _a;
@@ -179,7 +164,7 @@ function isTextNode(child) {
     if (child.properties._text !== undefined) {
         return true;
     }
-    var code = (_a = child.bindings._text) === null || _a === void 0 ? void 0 : _a.code;
+    const code = (_a = child.bindings._text) === null || _a === void 0 ? void 0 : _a.code;
     if (code !== undefined && code !== 'props.children') {
         return true;
     }
@@ -202,17 +187,17 @@ function isSlotProjection(child) {
  * @returns
  */
 function rewriteHandlers(file, handlers, bindings, symbolBindings) {
-    var outBindings = {};
-    for (var key in bindings) {
+    const outBindings = {};
+    for (let key in bindings) {
         if (Object.prototype.hasOwnProperty.call(bindings, key)) {
-            var bindingValue = bindings[key];
-            var bindingExpr = bindingValue.code;
-            var handlerBlock = handlers.get(bindingExpr);
+            const bindingValue = bindings[key];
+            let bindingExpr = bindingValue.code;
+            const handlerBlock = handlers.get(bindingExpr);
             if (key == 'css') {
                 continue;
             }
             else if (handlerBlock) {
-                key = "".concat(key, "$");
+                key = `${key}$`;
                 bindingExpr = (0, src_generator_1.invoke)(file.import(file.qwikModule, 'qrl'), [
                     (0, src_generator_1.quote)(file.qrlPrefix + 'high.js'),
                     (0, src_generator_1.quote)(handlerBlock),
@@ -225,7 +210,10 @@ function rewriteHandlers(file, handlers, bindings, symbolBindings) {
             else if (key.startsWith('component.options.')) {
                 key = (0, src_generator_1.lastProperty)(key);
             }
-            outBindings[key] = __assign(__assign({}, bindingValue), { code: bindingExpr });
+            outBindings[key] = {
+                ...bindingValue,
+                code: bindingExpr,
+            };
         }
     }
     return outBindings;