@builder.io/mitosis 0.0.46 → 0.0.49

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

@@ -26,6 +26,8 @@ export declare function extractStateHook(code: string): {
     code: string;
     state: any;
 };
+export declare function convertExportDefaultToReturn(code: string): string;
+export declare const createBuilderElement: (options?: Partial<BuilderElement> | undefined) => BuilderElement;
 export declare const isBuilderElement: (el: unknown) => el is BuilderElement;
 export declare const builderContentToMitosisComponent: (builderContent: BuilderContent, options?: BuilderToMitosisOptions) => {
     subComponents: {
@@ -51,11 +53,30 @@ export declare const builderContentToMitosisComponent: (builderContent: BuilderC
             };
         };
         hooks: {
-            init?: string | undefined;
-            onMount?: string | undefined;
-            onUnMount?: string | undefined;
-            preComponent?: string | undefined;
-            postComponent?: string | undefined;
+            init?: {
+                code: string;
+                deps?: string | undefined;
+            } | undefined;
+            onMount?: {
+                code: string;
+                deps?: string | undefined;
+            } | undefined;
+            onUnMount?: {
+                code: string;
+                deps?: string | undefined;
+            } | undefined;
+            preComponent?: {
+                code: string;
+                deps?: string | undefined;
+            } | undefined;
+            postComponent?: {
+                code: string;
+                deps?: string | undefined;
+            } | undefined;
+            onUpdate?: {
+                code: string;
+                deps?: string | undefined;
+            } | undefined;
         };
         children: MitosisNode[];
         subComponents: import("..").MitosisComponent[];
@@ -82,11 +103,30 @@ export declare const builderContentToMitosisComponent: (builderContent: BuilderC
         };
     };
     hooks: {
-        init?: string | undefined;
-        onMount?: string | undefined;
-        onUnMount?: string | undefined;
-        preComponent?: string | undefined;
-        postComponent?: string | undefined;
+        init?: {
+            code: string;
+            deps?: string | undefined;
+        } | undefined;
+        onMount?: {
+            code: string;
+            deps?: string | undefined;
+        } | undefined;
+        onUnMount?: {
+            code: string;
+            deps?: string | undefined;
+        } | undefined;
+        preComponent?: {
+            code: string;
+            deps?: string | undefined;
+        } | undefined;
+        postComponent?: {
+            code: string;
+            deps?: string | undefined;
+        } | undefined;
+        onUpdate?: {
+            code: string;
+            deps?: string | undefined;
+        } | undefined;
     };
     children: MitosisNode[];
 };

package/dist/src/parsers/builder.js

@@ -33,7 +33,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.builderContentToMitosisComponent = exports.isBuilderElement = exports.extractStateHook = exports.builderElementToMitosisNode = exports.symbolBlocksAsChildren = void 0;
+exports.builderContentToMitosisComponent = exports.isBuilderElement = exports.createBuilderElement = exports.convertExportDefaultToReturn = exports.extractStateHook = exports.builderElementToMitosisNode = exports.symbolBlocksAsChildren = void 0;
 var babel = __importStar(require("@babel/core"));
 var generator_1 = __importDefault(require("@babel/generator"));
 var json5_1 = __importDefault(require("json5"));
@@ -533,7 +533,7 @@ var builderElementToMitosisNode = function (block, options, _internalOptions) {
 exports.builderElementToMitosisNode = builderElementToMitosisNode;
 var getHooks = function (content) {
     var _a, _b;
-    var code = ((_a = content.data) === null || _a === void 0 ? void 0 : _a.tsCode) || ((_b = content.data) === null || _b === void 0 ? void 0 : _b.jsCode) || '';
+    var code = convertExportDefaultToReturn(((_a = content.data) === null || _a === void 0 ? void 0 : _a.tsCode) || ((_b = content.data) === null || _b === void 0 ? void 0 : _b.jsCode) || '');
     try {
         return (0, jsx_1.parseJsx)("\n    export default function TemporaryComponent() {\n      ".concat(
         // Mitosis parser looks for useState to be a variable assignment,
@@ -598,6 +598,29 @@ function extractStateHook(code) {
     return { code: newCode, state: state };
 }
 exports.extractStateHook = extractStateHook;
+function convertExportDefaultToReturn(code) {
+    var types = babel.types;
+    var ast = babel.parse(code, {
+        presets: [[tsPreset, { isTSX: true, allExtensions: true }]],
+        plugins: [[decorators, { legacy: true }], jsxPlugin],
+    });
+    var body = types.isFile(ast)
+        ? ast.program.body
+        : types.isProgram(ast)
+            ? ast.body
+            : [];
+    var newBody = body.slice();
+    for (var i = 0; i < body.length; i++) {
+        var statement = body[i];
+        if (types.isExportDefaultDeclaration(statement)) {
+            if (types.isCallExpression(statement.declaration)) {
+                newBody[i] = types.returnStatement(statement.declaration);
+            }
+        }
+    }
+    return (0, generator_1.default)(types.program(newBody)).code || '';
+}
+exports.convertExportDefaultToReturn = convertExportDefaultToReturn;
 // TODO: maybe this should be part of the builder -> Mitosis part
 function extractSymbols(json) {
     var _a, _b, _c, _d;
@@ -637,10 +660,15 @@ function extractSymbols(json) {
         subComponents: subComponents,
     };
 }
+var createBuilderElement = function (options) { return (__assign({ '@type': '@builder.io/sdk:Element', id: 'builder-' +
+        Math.random()
+            .toString(36)
+            .split('.')[1] }, options)); };
+exports.createBuilderElement = createBuilderElement;
 var isBuilderElement = function (el) { var _a; return ((_a = el) === null || _a === void 0 ? void 0 : _a['@type']) === '@builder.io/sdk:Element'; };
 exports.isBuilderElement = isBuilderElement;
 var builderContentPartToMitosisComponent = function (builderContent, options) {
-    var _a, _b, _c, _d, _e;
+    var _a, _b, _c, _d, _e, _f;
     if (options === void 0) { options = {}; }
     builderContent = (0, fast_clone_1.fastClone)(builderContent);
     (0, traverse_1.default)(builderContent).forEach(function (elem) {
@@ -669,7 +697,8 @@ var builderContentPartToMitosisComponent = function (builderContent, options) {
             }
         }
     });
-    var _f = extractStateHook(((_a = builderContent === null || builderContent === void 0 ? void 0 : builderContent.data) === null || _a === void 0 ? void 0 : _a.tsCode) || ((_b = builderContent === null || builderContent === void 0 ? void 0 : builderContent.data) === null || _b === void 0 ? void 0 : _b.jsCode) || ''), state = _f.state, customCode = _f.code;
+    var _g = extractStateHook(((_a = builderContent === null || builderContent === void 0 ? void 0 : builderContent.data) === null || _a === void 0 ? void 0 : _a.tsCode) || ((_b = builderContent === null || builderContent === void 0 ? void 0 : builderContent.data) === null || _b === void 0 ? void 0 : _b.jsCode) || ''), state = _g.state, code = _g.code;
+    var customCode = convertExportDefaultToReturn(code);
     var parsed = getHooks(builderContent);
     var componentJson = (0, create_mitosis_component_1.createMitosisComponent)({
         meta: {
@@ -678,10 +707,11 @@ var builderContentPartToMitosisComponent = function (builderContent, options) {
             },
         },
         state: (parsed === null || parsed === void 0 ? void 0 : parsed.state) || __assign(__assign({}, state), (_d = builderContent.data) === null || _d === void 0 ? void 0 : _d.state),
-        hooks: __assign({}, (((parsed === null || parsed === void 0 ? void 0 : parsed.hooks.onMount) || customCode) && {
-            onMount: (parsed === null || parsed === void 0 ? void 0 : parsed.hooks.onMount) || customCode,
+        hooks: __assign({}, ((((_e = parsed === null || parsed === void 0 ? void 0 : parsed.hooks.onMount) === null || _e === void 0 ? void 0 : _e.code) ||
+            (customCode && { code: customCode })) && {
+            onMount: (parsed === null || parsed === void 0 ? void 0 : parsed.hooks.onMount) || { code: customCode },
         })),
-        children: (((_e = builderContent.data) === null || _e === void 0 ? void 0 : _e.blocks) || [])
+        children: (((_f = builderContent.data) === null || _f === void 0 ? void 0 : _f.blocks) || [])
             .filter(function (item) {
             var _a, _b;
             if ((_b = (_a = item.properties) === null || _a === void 0 ? void 0 : _a.src) === null || _b === void 0 ? void 0 : _b.includes('/api/v1/pixel')) {

package/dist/src/parsers/jsx.js

@@ -191,13 +191,51 @@ var componentFunctionToJson = function (node, context) {
                         var firstArg = expression.arguments[0];
                         if (types.isFunctionExpression(firstArg) ||
                             types.isArrowFunctionExpression(firstArg)) {
-                            hooks.onMount = (0, generator_1.default)(firstArg.body)
+                            var code = (0, generator_1.default)(firstArg.body)
                                 .code.trim()
-                                // Remove abtrary block wrapping if any
+                                // Remove arbitrary block wrapping if any
                                 // AKA
                                 //  { console.log('hi') } -> console.log('hi')
                                 .replace(/^{/, '')
                                 .replace(/}$/, '');
+                            hooks.onMount = { code: code };
+                        }
+                    }
+                    else if (expression.callee.name === 'onUpdate') {
+                        var firstArg = expression.arguments[0];
+                        var secondArg = expression.arguments[1];
+                        if (types.isFunctionExpression(firstArg) ||
+                            types.isArrowFunctionExpression(firstArg)) {
+                            var code = (0, generator_1.default)(firstArg.body)
+                                .code.trim()
+                                // Remove arbitrary block wrapping if any
+                                // AKA
+                                //  { console.log('hi') } -> console.log('hi')
+                                .replace(/^{/, '')
+                                .replace(/}$/, '');
+                            if (!secondArg ||
+                                (types.isArrayExpression(secondArg) &&
+                                    secondArg.elements.length > 0)) {
+                                var depsCode = secondArg ? (0, generator_1.default)(secondArg).code : '';
+                                hooks.onUpdate = {
+                                    code: code,
+                                };
+                                hooks.onUpdate.deps = depsCode;
+                            }
+                        }
+                    }
+                    else if (expression.callee.name === 'onUnMount') {
+                        var firstArg = expression.arguments[0];
+                        if (types.isFunctionExpression(firstArg) ||
+                            types.isArrowFunctionExpression(firstArg)) {
+                            var code = (0, generator_1.default)(firstArg.body)
+                                .code.trim()
+                                // Remove arbitrary block wrapping if any
+                                // AKA
+                                //  { console.log('hi') } -> console.log('hi')
+                                .replace(/^{/, '')
+                                .replace(/}$/, '');
+                            hooks.onUnMount = { code: code };
                         }
                     }
                 }
@@ -605,7 +643,9 @@ function parseJsx(jsx, options) {
                             .map(function (node) { return "export default ".concat((0, generator_1.default)(node).code); });
                         cutStatements = collectMetadata(cutStatements, context.builder.component, useOptions);
                         // TODO: support multiple? e.g. for others to add imports?
-                        context.builder.component.hooks.preComponent = (0, generator_1.default)(types.program(cutStatements)).code;
+                        context.builder.component.hooks.preComponent = {
+                            code: (0, generator_1.default)(types.program(cutStatements)).code,
+                        };
                         path.replaceWith(types.program(keepStatements));
                     },
                     FunctionDeclaration: function (path, context) {

package/dist/src/parsers/liquid.js

@@ -91,6 +91,7 @@ var fast_clone_1 = require("../helpers/fast-clone");
 var liquid_1 = require("../generators/liquid");
 var map_to_attributes_1 = require("../helpers/map-to-attributes");
 var map_to_css_1 = require("../helpers/map-to-css");
+var __1 = require("..");
 var voidElements = new Set([
     'area',
     'base',
@@ -1250,10 +1251,9 @@ function processInnerTemplates(templates, options, priorConditions, overrideHash
         });
     });
 }
-var el = function (options) { return (__assign({ '@type': '@builder.io/sdk:Element', id: 'builder-' +
-        Math.random()
-            .toString(36)
-            .split('.')[1], meta: __assign({ importedFrom: 'liquid' }, options === null || options === void 0 ? void 0 : options.meta) }, options)); };
+var el = function (options) {
+    return (0, __1.createBuilderElement)(__assign({ meta: __assign({ importedFrom: 'liquid' }, options === null || options === void 0 ? void 0 : options.meta) }, options));
+};
 var tagRe = /\[([a-z]+)\](='([^']+)')?/;
 var tagReAll = /\[([^\]]+)\](='([^']+)')?/g;
 var parseTags = function (tag) {

package/dist/src/plugins/compile-away-builder-components.js

@@ -56,15 +56,6 @@ function getComponentInputNames(componentName) {
     var componentInfo = react_1.Builder.components.find(function (item) { return item.name === componentName; });
     return ((_a = componentInfo === null || componentInfo === void 0 ? void 0 : componentInfo.inputs) === null || _a === void 0 ? void 0 : _a.map(function (item) { return item.name; })) || [];
 }
-function updateQueryParam(uri, key, value) {
-    if (uri === void 0) { uri = ''; }
-    var re = new RegExp('([?&])' + key + '=.*?(&|$)', 'i');
-    var separator = uri.indexOf('?') !== -1 ? '&' : '?';
-    if (uri.match(re)) {
-        return uri.replace(re, '$1' + key + '=' + encodeURIComponent(value) + '$2');
-    }
-    return uri + separator + key + '=' + encodeURIComponent(value);
-}
 var wrapOutput = function (node, child, components) {
     var inputNames = getComponentInputNames(node.name);
     (0, exports.compileAwayBuilderComponentsFromTree)(child, components);
@@ -257,22 +248,14 @@ exports.components = {
     Image: function (node, context, components) {
         var _a = node.properties, backgroundSize = _a.backgroundSize, backgroundPosition = _a.backgroundPosition;
         var srcset = node.properties.srcset;
-        var widths = [100, 200, 400, 800, 1200, 1600, 2000];
         var aspectRatio = node.bindings.aspectRatio
             ? parseFloat(node.bindings.aspectRatio)
             : null;
         if (typeof aspectRatio === 'number' && isNaN(aspectRatio)) {
             aspectRatio = null;
         }
-        var srcSet = srcset ||
-            "".concat((node.properties.image || '').match(/builder\.io/)
-                ? widths
-                    .map(function (size) {
-                    return "".concat(updateQueryParam(node.properties.image, 'width', String(size)), " ").concat(size, "w");
-                })
-                    .concat([node.properties.image])
-                    .join(', ')
-                : '');
+        var image = node.properties.image;
+        var srcSet = srcset || generateBuilderIoSrcSet(image);
         var source = node.bindings.noWebp !== 'true' &&
             (0, create_mitosis_node_1.createMitosisNode)({
                 name: 'source',
@@ -349,7 +332,24 @@ exports.components = {
         var imageNodes = [picture];
         imgSizer && imageNodes.push(imgSizer);
         children && imageNodes.push(children);
-        return wrapOutput(node, imageNodes, components);
+        var href = node.properties.href;
+        var hrefBinding = node.bindings.href;
+        if (href || hrefBinding) {
+            var aHref = (0, create_mitosis_node_1.createMitosisNode)({
+                name: 'a',
+                properties: {
+                    href: href,
+                },
+                bindings: {
+                    href: hrefBinding,
+                },
+                children: imageNodes,
+            });
+            return wrapOutput(node, aHref, components);
+        }
+        else {
+            return wrapOutput(node, imageNodes, components);
+        }
     },
     Video: function (node, context, components) {
         var aspectRatio = node.bindings.aspectRatio
@@ -481,6 +481,26 @@ var compileAwayBuilderComponents = function (pluginOptions) {
     }); };
 };
 exports.compileAwayBuilderComponents = compileAwayBuilderComponents;
+function updateQueryParam(uri, key, value) {
+    if (uri === void 0) { uri = ''; }
+    var re = new RegExp('([?&])' + key + '=.*?(&|$)', 'i');
+    var separator = uri.indexOf('?') !== -1 ? '&' : '?';
+    if (uri.match(re)) {
+        return uri.replace(re, '$1' + key + '=' + encodeURIComponent(value) + '$2');
+    }
+    return uri + separator + key + '=' + encodeURIComponent(value);
+}
+function generateBuilderIoSrcSet(image) {
+    var isBuilderIo = !!(image || '').match(/builder\.io/);
+    return isBuilderIo
+        ? [100, 200, 400, 800, 1200, 1600, 2000]
+            .map(function (size) {
+            return "".concat(updateQueryParam(image, 'width', String(size)), " ").concat(size, "w");
+        })
+            .concat([image])
+            .join(', ')
+        : '';
+}
 function noUndefined(obj) {
     var cleanObj = {};
     for (var key in obj) {

package/dist/src/symbols/symbol-processor.d.ts

@@ -0,0 +1,18 @@
+import { BuilderContent, BuilderElement } from '@builder.io/sdk';
+import { MitosisComponent } from '../types/mitosis-component';
+export declare type SymbolHierarchy = {
+    depthFirstSymbols: BuilderElement[];
+} & {
+    [id: string]: string[];
+};
+/**
+ * Ensure every symbol in a BuilderContent tree has a unique ID.
+ * Mutates the data tree directly.
+ */
+export declare function ensureAllSymbolsHaveIds(content: BuilderContent): void;
+export declare function convertBuilderContentToSymbolHierarchy(content: BuilderContent, { collectComponentStyles, collectComponentState, }?: {
+    collectComponentStyles?: string[];
+    collectComponentState?: Record<string, any>;
+}): SymbolHierarchy;
+export declare function convertBuilderElementToMitosisComponent(element: BuilderElement): MitosisComponent | null;
+export declare function getJsxSymbolComponentName(id: string): string;

package/dist/src/symbols/symbol-processor.js

@@ -0,0 +1,177 @@
+"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);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getJsxSymbolComponentName = exports.convertBuilderElementToMitosisComponent = exports.convertBuilderContentToSymbolHierarchy = exports.ensureAllSymbolsHaveIds = void 0;
+var traverse_1 = require("traverse");
+var builder_1 = require("../parsers/builder");
+var minify_1 = require("../generators/minify");
+/**
+ * Ensure every symbol in a BuilderContent tree has a unique ID.
+ * Mutates the data tree directly.
+ */
+function ensureAllSymbolsHaveIds(content) {
+    var ids = new Set();
+    (0, traverse_1.forEach)(content, function (el) {
+        var _a, _b, _c;
+        if (this.key === 'jsCode' &&
+            isString(el) &&
+            el.endsWith('return _virtual_index')) {
+            // Sometimes rollup adds a final `return _virtual_index` but that causes VM evaluation to fail.
+            // Instead of a return on the last line, it needs a plain expression on the last line. Luckily
+            // because the rollup compile behavior is consistent this works pretty reliably
+            el = el.replace(/return _virtual_index$/, '_virtual_index');
+            this.parent && (this.parent.node.jsCode = el);
+        }
+        if ((0, builder_1.isBuilderElement)(el)) {
+            if (((_a = el === null || el === void 0 ? void 0 : el.component) === null || _a === void 0 ? void 0 : _a.name) === 'Symbol') {
+                var id = getIdFromSymbol(el);
+                if (id) {
+                    if (ids.has(id)) {
+                        if ((_c = (_b = el.component) === null || _b === void 0 ? void 0 : _b.options) === null || _c === void 0 ? void 0 : _c.symbol) {
+                            var id_1 = generateId();
+                            el.component.options.symbol.entry = id_1;
+                            if (el.component.options.symbol.content) {
+                                el.component.options.symbol.content.id = id_1;
+                            }
+                            ids.add(id_1);
+                        }
+                    }
+                    else {
+                        ids.add(id);
+                    }
+                }
+            }
+        }
+    });
+}
+exports.ensureAllSymbolsHaveIds = ensureAllSymbolsHaveIds;
+//TODO(misko): needs test
+function convertBuilderContentToSymbolHierarchy(content, _a) {
+    var _b;
+    var _c = _a === void 0 ? {} : _a, collectComponentStyles = _c.collectComponentStyles, collectComponentState = _c.collectComponentState;
+    var path = [-1, content.id];
+    var hierarchy = (_b = {
+            depthFirstSymbols: []
+        },
+        _b[content.id] = [],
+        _b);
+    (0, traverse_1.forEach)(content, function (el) {
+        var _a, _b, _c;
+        var cssCode = el === null || el === void 0 ? void 0 : el.cssCode;
+        if (cssCode) {
+            collectComponentStyles && collectComponentStyles.push((0, minify_1.minify)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["", ""], ["", ""])), cssCode));
+        }
+        while (path[0 /* DEPTH */] >= this.path.length) {
+            path.shift();
+            path.shift();
+        }
+        if ((0, builder_1.isBuilderElement)(el)) {
+            if (((_a = el === null || el === void 0 ? void 0 : el.component) === null || _a === void 0 ? void 0 : _a.name) === 'Symbol') {
+                if (collectComponentState) {
+                    var symbol = el.component.options.symbol;
+                    var props = symbol.data;
+                    var state = (_c = (_b = symbol.content) === null || _b === void 0 ? void 0 : _b.data) === null || _c === void 0 ? void 0 : _c.state;
+                    if (state) {
+                        var id = toHash(state);
+                        props['serverStateId'] = id;
+                        collectComponentState[id] = state;
+                    }
+                }
+                if (path[0 /* DEPTH */] < this.path.length) {
+                    var id = getIdFromSymbol(el);
+                    hierarchy[id] = [];
+                    addIfMissing(hierarchy[path[1 /* ID */]], id);
+                    path.unshift(this.path.length, id);
+                }
+                // TODO(misko): This should be `el.content` not `el`
+                // Because we don't wante to take the `<Symbol>` with us.
+                // TODO(misko): Do we really want to add ALL symbols? Even duplicates?
+                hierarchy.depthFirstSymbols.unshift(el);
+            }
+        }
+    });
+    return hierarchy;
+}
+exports.convertBuilderContentToSymbolHierarchy = convertBuilderContentToSymbolHierarchy;
+function convertBuilderElementToMitosisComponent(element) {
+    var _a, _b;
+    var symbolValue = (_b = (_a = element.component) === null || _a === void 0 ? void 0 : _a.options) === null || _b === void 0 ? void 0 : _b.symbol;
+    var elContent = symbolValue === null || symbolValue === void 0 ? void 0 : symbolValue.content;
+    if (!elContent) {
+        console.warn('Symbol missing content', element.id);
+        delete element.component; // TODO(misko): Should this be assign `undefined` for perf?
+        element.children = [];
+        return null;
+    }
+    var id = getIdFromSymbol(element);
+    var componentName = getJsxSymbolComponentName(id);
+    delete element.component; // TODO(misko): Should this be assign `undefined` for perf?
+    element.children = [
+        (0, builder_1.createBuilderElement)({
+            component: {
+                name: componentName,
+                options: symbolValue.data,
+            },
+        }),
+    ];
+    var mitosisComponent = __assign(__assign({}, (0, builder_1.builderContentToMitosisComponent)(elContent, {
+        includeBuilderExtras: true,
+        preserveTextBlocks: true,
+    })), { name: componentName });
+    mitosisComponent.meta.builderElId = element.id;
+    return mitosisComponent;
+}
+exports.convertBuilderElementToMitosisComponent = convertBuilderElementToMitosisComponent;
+function getJsxSymbolComponentName(id) {
+    return 'Component' + id.toUpperCase().replace(/-/g, '');
+}
+exports.getJsxSymbolComponentName = getJsxSymbolComponentName;
+function getIdFromSymbol(el) {
+    var _a, _b, _c;
+    // TODO(misko): Don't use entry us el.id???
+    return (_c = (_b = (_a = el.component) === null || _a === void 0 ? void 0 : _a.options) === null || _b === void 0 ? void 0 : _b.symbol) === null || _c === void 0 ? void 0 : _c.entry;
+}
+function addIfMissing(array, value) {
+    if (array.indexOf(value) == -1) {
+        array.push(value);
+    }
+}
+function isString(value) {
+    return typeof value == 'string';
+}
+function generateId() {
+    return (
+    // TODO(misko): For now I have removed the data as I think it is overkill
+    // and makes the output unnecessarily big.
+    // new Date().getTime().toString(36) +
+    Math.round(Math.random() * Number.MAX_SAFE_INTEGER).toString(36));
+}
+function toHash(obj) {
+    return hashCode(JSON.stringify(obj));
+}
+function hashCode(text) {
+    var hash = 0, i, chr;
+    if (text.length === 0)
+        return String(hash);
+    for (i = 0; i < text.length; i++) {
+        chr = text.charCodeAt(i);
+        hash = (hash << 5) - hash + chr;
+        hash |= 0; // Convert to 32bit integer
+    }
+    return Number(Math.abs(hash)).toString(36);
+}
+var templateObject_1;

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

@@ -0,0 +1,63 @@
+import { JSONObject } from './json';
+import { JSXLiteNode } from './jsx-lite-node';
+/**
+ * @example
+ *  // import core, { useState, someThing as someAlias } from '@jsx-lite/core'
+ *  {
+ *    path: '@jsx-lite/core',
+ *    imports: {
+ *      useState: 'useState',
+ *      someAlias: 'someThing',
+ *      core: 'default',
+ *    }
+ *  }
+ *
+ * @example
+ *  // import * as core from '@jsx-lite/core'
+ *  {
+ *    path: '@jsx-lite/core',
+ *    imports: {
+ *      core: '*',
+ *    }
+ *  }
+ */
+export interface JSXLiteImport {
+    path: string;
+    imports: {
+        [key: string]: string | undefined;
+    };
+}
+declare type ContextInfo = {
+    name: string;
+    path: string;
+};
+export declare type JSXLiteComponent = {
+    '@type': '@jsx-lite/component';
+    name: string;
+    imports: JSXLiteImport[];
+    meta: JSONObject & {
+        metadataHook?: JSONObject;
+    };
+    state: JSONObject;
+    context: {
+        get: {
+            [key: string]: ContextInfo;
+        };
+        set: {
+            [key: string]: {
+                name: string;
+                value?: JSONObject;
+            };
+        };
+    };
+    hooks: {
+        init?: string;
+        onMount?: string;
+        onUnMount?: string;
+        preComponent?: string;
+        postComponent?: string;
+    };
+    children: JSXLiteNode[];
+    subComponents: JSXLiteComponent[];
+};
+export {};

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

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/src/types/jsx-lite-context.d.ts

@@ -0,0 +1,6 @@
+import { JSONObject } from '../types/json';
+export declare type JSXLiteContext = {
+    '@type': '@jsx-lite/context';
+    name: string;
+    value: JSONObject;
+};

package/dist/src/types/jsx-lite-context.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/src/types/jsx-lite-node.d.ts

@@ -0,0 +1,13 @@
+import { JSONObject } from './json';
+export declare type JSXLiteNode = {
+    '@type': '@jsx-lite/node';
+    name: string;
+    meta: JSONObject;
+    properties: {
+        [key: string]: string | undefined;
+    };
+    bindings: {
+        [key: string]: string | undefined;
+    };
+    children: JSXLiteNode[];
+};

package/dist/src/types/jsx-lite-node.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/src/types/jsx-lite-styles.d.ts

@@ -0,0 +1 @@
+export declare type JSXLiteStyles = Omit<Partial<CSSStyleDeclaration>, 'length' | 'getPropertyPriority' | 'getPropertyValue' | 'item' | 'removeProperty' | 'setProperty'>;

package/dist/src/types/jsx-lite-styles.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });