@builder.io/mitosis 0.4.0 → 0.4.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/src/constants/media-sizes.js +4 -5
- package/dist/src/generators/alpine/generate.js +114 -132
- package/dist/src/generators/alpine/render-mount-hook.js +8 -5
- package/dist/src/generators/alpine/render-update-hooks.js +13 -13
- package/dist/src/generators/angular/helpers.js +19 -9
- package/dist/src/generators/angular/index.js +599 -584
- package/dist/src/generators/builder.js +176 -165
- package/dist/src/generators/context/angular.js +32 -26
- package/dist/src/generators/context/helpers/context-with-symbol-key.js +25 -21
- package/dist/src/generators/context/qwik.js +21 -21
- package/dist/src/generators/context/react.js +22 -22
- package/dist/src/generators/context/rsc.js +20 -22
- package/dist/src/generators/context/solid.js +22 -22
- package/dist/src/generators/context/svelte.js +33 -28
- package/dist/src/generators/context/vue.js +1 -1
- package/dist/src/generators/helpers/context.js +6 -13
- package/dist/src/generators/helpers/functions.js +8 -8
- package/dist/src/generators/helpers/on-mount.js +9 -5
- package/dist/src/generators/helpers/rsc.js +7 -9
- package/dist/src/generators/html.js +995 -534
- package/dist/src/generators/liquid.js +81 -79
- package/dist/src/generators/lit/collect-class-string.js +10 -12
- package/dist/src/generators/lit/generate.js +204 -159
- package/dist/src/generators/marko/generate.js +193 -183
- package/dist/src/generators/minify.js +5 -9
- package/dist/src/generators/mitosis.js +135 -134
- package/dist/src/generators/qwik/component-generator.js +159 -154
- package/dist/src/generators/qwik/component.js +51 -81
- package/dist/src/generators/qwik/directives.js +68 -84
- package/dist/src/generators/qwik/helpers/add-prevent-default.js +6 -7
- package/dist/src/generators/qwik/helpers/convert-method-to-function.js +38 -38
- package/dist/src/generators/qwik/helpers/handlers.js +16 -25
- package/dist/src/generators/qwik/helpers/stable-inject.js +7 -8
- package/dist/src/generators/qwik/helpers/stable-serialize.js +7 -8
- package/dist/src/generators/qwik/helpers/state.js +36 -43
- package/dist/src/generators/qwik/helpers/styles.js +19 -40
- package/dist/src/generators/qwik/jsx.js +63 -75
- package/dist/src/generators/qwik/src-generator.js +134 -167
- package/dist/src/generators/react/blocks.js +122 -127
- package/dist/src/generators/react/generator.js +314 -259
- package/dist/src/generators/react/helpers.js +23 -28
- package/dist/src/generators/react/state.js +34 -51
- package/dist/src/generators/react-native/index.js +72 -84
- package/dist/src/generators/react-native/sanitize-react-native-block-styles.js +14 -26
- package/dist/src/generators/rsc.js +30 -36
- package/dist/src/generators/solid/blocks.js +46 -43
- package/dist/src/generators/solid/helpers/styles.js +11 -11
- package/dist/src/generators/solid/index.js +199 -190
- package/dist/src/generators/solid/state/helpers.js +76 -90
- package/dist/src/generators/solid/state/signals.js +30 -37
- package/dist/src/generators/solid/state/state.js +35 -48
- package/dist/src/generators/solid/state/store.js +40 -46
- package/dist/src/generators/stencil/collect-class-string.js +10 -12
- package/dist/src/generators/stencil/generate.js +158 -145
- package/dist/src/generators/svelte/blocks.js +146 -144
- package/dist/src/generators/svelte/helpers.js +10 -17
- package/dist/src/generators/svelte/svelte.js +321 -287
- package/dist/src/generators/swift-ui.js +162 -101
- package/dist/src/generators/taro.js +32 -36
- package/dist/src/generators/template.js +71 -74
- package/dist/src/generators/vue/blocks.js +116 -107
- package/dist/src/generators/vue/compositionApi.js +67 -50
- package/dist/src/generators/vue/helpers.js +71 -96
- package/dist/src/generators/vue/optionsApi.js +134 -105
- package/dist/src/generators/vue/vue.js +210 -207
- package/dist/src/helpers/babel-transform.js +40 -63
- package/dist/src/helpers/bindings.js +4 -12
- package/dist/src/helpers/camel-case.js +4 -5
- package/dist/src/helpers/capitalize.js +1 -1
- package/dist/src/helpers/component-file-extensions.js +23 -35
- package/dist/src/helpers/create-mitosis-component.js +22 -26
- package/dist/src/helpers/create-mitosis-context.js +5 -12
- package/dist/src/helpers/create-mitosis-node.js +10 -12
- package/dist/src/helpers/dash-case.js +2 -2
- package/dist/src/helpers/dedent.js +18 -22
- package/dist/src/helpers/event-handlers.js +1 -1
- package/dist/src/helpers/fast-clone.js +1 -1
- package/dist/src/helpers/filter-empty-text-nodes.js +2 -2
- package/dist/src/helpers/generic-format.js +7 -8
- package/dist/src/helpers/get-bindings.js +4 -4
- package/dist/src/helpers/get-components-used.js +3 -3
- package/dist/src/helpers/get-components.js +4 -4
- package/dist/src/helpers/get-custom-imports.js +10 -12
- package/dist/src/helpers/get-prop-functions.js +7 -8
- package/dist/src/helpers/get-props-ref.js +8 -8
- package/dist/src/helpers/get-props.js +12 -13
- package/dist/src/helpers/get-refs.js +4 -4
- package/dist/src/helpers/get-state-object-string.js +42 -61
- package/dist/src/helpers/get-state-used.js +7 -8
- package/dist/src/helpers/get-styles.js +6 -6
- package/dist/src/helpers/getters-to-functions.js +8 -12
- package/dist/src/helpers/handle-missing-state.js +3 -3
- package/dist/src/helpers/has-bindings-text.js +6 -6
- package/dist/src/helpers/has-component.js +4 -4
- package/dist/src/helpers/has-props.js +3 -3
- package/dist/src/helpers/has-stateful-dom.js +4 -4
- package/dist/src/helpers/has.js +3 -3
- package/dist/src/helpers/indent.js +2 -3
- package/dist/src/helpers/is-children.js +4 -5
- package/dist/src/helpers/is-component.js +1 -1
- package/dist/src/helpers/is-html-attribute.js +2 -11
- package/dist/src/helpers/is-mitosis-node.js +1 -1
- package/dist/src/helpers/is-root-text-node.js +1 -1
- package/dist/src/helpers/is-upper-case.js +1 -1
- package/dist/src/helpers/is-valid-attribute-name.js +1 -1
- package/dist/src/helpers/json.js +2 -2
- package/dist/src/helpers/map-refs.js +29 -40
- package/dist/src/helpers/merge-options.js +20 -31
- package/dist/src/helpers/mitosis-imports.js +5 -6
- package/dist/src/helpers/nodes/for.js +2 -3
- package/dist/src/helpers/nullable.js +1 -3
- package/dist/src/helpers/on-event.js +32 -36
- package/dist/src/helpers/output.js +4 -5
- package/dist/src/helpers/parse-node.js +13 -5
- package/dist/src/helpers/parsers.js +10 -14
- package/dist/src/helpers/patterns.js +6 -8
- package/dist/src/helpers/plugins/process-code/index.js +114 -120
- package/dist/src/helpers/plugins/process-signals.js +114 -125
- package/dist/src/helpers/plugins/process-target-blocks.js +18 -20
- package/dist/src/helpers/process-http-requests.js +8 -4
- package/dist/src/helpers/remove-surrounding-block.js +2 -2
- package/dist/src/helpers/render-imports.js +99 -111
- package/dist/src/helpers/replace-identifiers.js +40 -49
- package/dist/src/helpers/replace-new-lines-in-strings.js +3 -3
- package/dist/src/helpers/signals/signals.js +27 -35
- package/dist/src/helpers/slots.js +11 -20
- package/dist/src/helpers/state.js +1 -3
- package/dist/src/helpers/strip-meta-properties.js +6 -6
- package/dist/src/helpers/strip-state-and-props-refs.js +21 -32
- package/dist/src/helpers/styles/collect-css.js +39 -44
- package/dist/src/helpers/styles/collect-styled-components.js +30 -28
- package/dist/src/helpers/styles/helpers.js +23 -29
- package/dist/src/helpers/trace-reference-to-module-path.js +3 -4
- package/dist/src/helpers/transform-state-setters.js +16 -19
- package/dist/src/helpers/traverse-nodes.js +2 -2
- package/dist/src/helpers/try-prettier-format.js +3 -3
- package/dist/src/helpers/typescript-project.js +25 -25
- package/dist/src/helpers/typescript.js +1 -3
- package/dist/src/modules/plugins.js +20 -28
- package/dist/src/parsers/angular.js +49 -57
- package/dist/src/parsers/builder/builder.js +427 -341
- package/dist/src/parsers/builder/helpers.js +10 -10
- package/dist/src/parsers/context.js +15 -17
- package/dist/src/parsers/jsx/ast.js +11 -11
- package/dist/src/parsers/jsx/component-types.js +22 -32
- package/dist/src/parsers/jsx/context.js +12 -12
- package/dist/src/parsers/jsx/element-parser.js +43 -54
- package/dist/src/parsers/jsx/exports.js +12 -14
- package/dist/src/parsers/jsx/function-parser.js +108 -119
- package/dist/src/parsers/jsx/helpers.js +11 -13
- package/dist/src/parsers/jsx/hooks/helpers.js +14 -16
- package/dist/src/parsers/jsx/hooks/index.js +34 -44
- package/dist/src/parsers/jsx/hooks/use-target.js +27 -27
- package/dist/src/parsers/jsx/imports.js +7 -17
- package/dist/src/parsers/jsx/jsx.js +92 -91
- package/dist/src/parsers/jsx/props-types.js +8 -10
- package/dist/src/parsers/jsx/props.js +15 -23
- package/dist/src/parsers/jsx/signals.js +28 -29
- package/dist/src/parsers/jsx/state.d.ts +2 -4
- package/dist/src/parsers/jsx/state.js +59 -93
- package/dist/src/parsers/svelte/css/index.js +1 -1
- package/dist/src/parsers/svelte/helpers/bindings.js +18 -19
- package/dist/src/parsers/svelte/helpers/children.js +5 -6
- package/dist/src/parsers/svelte/helpers/expressions.js +7 -9
- package/dist/src/parsers/svelte/helpers/hooks.js +2 -2
- package/dist/src/parsers/svelte/helpers/post-process.js +49 -70
- package/dist/src/parsers/svelte/helpers/string.js +5 -5
- package/dist/src/parsers/svelte/html/actions.js +17 -10
- package/dist/src/parsers/svelte/html/each.js +11 -16
- package/dist/src/parsers/svelte/html/element.js +68 -78
- package/dist/src/parsers/svelte/html/fragment.js +3 -3
- package/dist/src/parsers/svelte/html/if-else.js +11 -18
- package/dist/src/parsers/svelte/html/index.js +14 -14
- package/dist/src/parsers/svelte/html/mustache-tag.js +5 -5
- package/dist/src/parsers/svelte/html/slot.js +5 -5
- package/dist/src/parsers/svelte/html/text.js +7 -14
- package/dist/src/parsers/svelte/index.js +23 -72
- package/dist/src/parsers/svelte/instance/context.js +17 -17
- package/dist/src/parsers/svelte/instance/expressions.js +2 -2
- package/dist/src/parsers/svelte/instance/functions.js +35 -30
- package/dist/src/parsers/svelte/instance/hooks.js +4 -5
- package/dist/src/parsers/svelte/instance/imports.js +11 -21
- package/dist/src/parsers/svelte/instance/index.js +22 -22
- package/dist/src/parsers/svelte/instance/properties.js +11 -23
- package/dist/src/parsers/svelte/instance/reactive.js +11 -11
- package/dist/src/parsers/svelte/instance/references.js +13 -13
- package/dist/src/parsers/svelte/instance/statements.js +3 -3
- package/dist/src/parsers/svelte/module/index.js +14 -26
- package/dist/src/parsers/svelte/typescript/index.js +27 -36
- package/dist/src/plugins/compile-away-builder-components.js +223 -156
- package/dist/src/plugins/compile-away-components.js +13 -21
- package/dist/src/plugins/map-styles.js +7 -7
- package/dist/src/symbols/symbol-processor.js +44 -62
- package/dist/src/targets.js +19 -19
- package/dist/src/types/mitosis-node.js +1 -1
- package/package.json +1 -1
|
@@ -1,90 +1,76 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
|
|
3
|
-
if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
|
|
4
|
-
return cooked;
|
|
5
|
-
};
|
|
6
|
-
var __assign = (this && this.__assign) || function () {
|
|
7
|
-
__assign = Object.assign || function(t) {
|
|
8
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
9
|
-
s = arguments[i];
|
|
10
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
11
|
-
t[p] = s[p];
|
|
12
|
-
}
|
|
13
|
-
return t;
|
|
14
|
-
};
|
|
15
|
-
return __assign.apply(this, arguments);
|
|
16
|
-
};
|
|
17
2
|
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
18
3
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
19
4
|
};
|
|
20
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
21
6
|
exports.componentToBuilder = exports.blockToBuilder = void 0;
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
var builderBlockPrefixes = ['Amp', 'Core', 'Builder', 'Raw', 'Form'];
|
|
43
|
-
var mapComponentName = function (name) {
|
|
7
|
+
const json5_1 = __importDefault(require("json5"));
|
|
8
|
+
const lodash_1 = require("lodash");
|
|
9
|
+
const legacy_1 = __importDefault(require("neotraverse/legacy"));
|
|
10
|
+
const standalone_1 = require("prettier/standalone");
|
|
11
|
+
const media_sizes_1 = require("../constants/media-sizes");
|
|
12
|
+
const dedent_1 = require("../helpers/dedent");
|
|
13
|
+
const fast_clone_1 = require("../helpers/fast-clone");
|
|
14
|
+
const filter_empty_text_nodes_1 = require("../helpers/filter-empty-text-nodes");
|
|
15
|
+
const get_state_object_string_1 = require("../helpers/get-state-object-string");
|
|
16
|
+
const has_props_1 = require("../helpers/has-props");
|
|
17
|
+
const is_component_1 = require("../helpers/is-component");
|
|
18
|
+
const is_upper_case_1 = require("../helpers/is-upper-case");
|
|
19
|
+
const remove_surrounding_block_1 = require("../helpers/remove-surrounding-block");
|
|
20
|
+
const state_1 = require("../helpers/state");
|
|
21
|
+
const builder_1 = require("../parsers/builder");
|
|
22
|
+
const symbol_processor_1 = require("../symbols/symbol-processor");
|
|
23
|
+
const on_mount_1 = require("./helpers/on-mount");
|
|
24
|
+
const omitMetaProperties = (obj) => (0, lodash_1.omitBy)(obj, (_value, key) => key.startsWith('$'));
|
|
25
|
+
const builderBlockPrefixes = ['Amp', 'Core', 'Builder', 'Raw', 'Form'];
|
|
26
|
+
const mapComponentName = (name) => {
|
|
44
27
|
if (name === 'CustomCode') {
|
|
45
28
|
return 'Custom Code';
|
|
46
29
|
}
|
|
47
|
-
for (
|
|
48
|
-
var prefix = builderBlockPrefixes_1[_i];
|
|
30
|
+
for (const prefix of builderBlockPrefixes) {
|
|
49
31
|
if (name.startsWith(prefix)) {
|
|
50
|
-
|
|
32
|
+
const suffix = name.replace(prefix, '');
|
|
51
33
|
if ((0, is_upper_case_1.isUpperCase)(suffix[0])) {
|
|
52
|
-
return
|
|
34
|
+
return `${prefix}:${name.replace(prefix, '')}`;
|
|
53
35
|
}
|
|
54
36
|
}
|
|
55
37
|
}
|
|
56
38
|
return name;
|
|
57
39
|
};
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
40
|
+
const componentMappers = {
|
|
41
|
+
// TODO: add back if this direction (blocks as children not prop) is desired
|
|
42
|
+
...(!builder_1.symbolBlocksAsChildren
|
|
43
|
+
? {}
|
|
44
|
+
: {
|
|
45
|
+
Symbol(node, options) {
|
|
46
|
+
const child = node.children[0];
|
|
47
|
+
const symbolOptions = (node.bindings.symbol && json5_1.default.parse(node.bindings.symbol.code)) || {};
|
|
48
|
+
if (child) {
|
|
49
|
+
(0, lodash_1.set)(symbolOptions, 'content.data.blocks', child.children.map((item) => (0, exports.blockToBuilder)(item, options)));
|
|
50
|
+
}
|
|
51
|
+
return el({
|
|
52
|
+
component: {
|
|
53
|
+
name: 'Symbol',
|
|
54
|
+
options: {
|
|
55
|
+
// TODO: forward other symbol options
|
|
56
|
+
symbol: symbolOptions,
|
|
57
|
+
},
|
|
73
58
|
},
|
|
74
|
-
},
|
|
75
|
-
},
|
|
76
|
-
},
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
59
|
+
}, options);
|
|
60
|
+
},
|
|
61
|
+
}),
|
|
62
|
+
Columns(node, options) {
|
|
63
|
+
const block = (0, exports.blockToBuilder)(node, options, { skipMapper: true });
|
|
64
|
+
const columns = block.children.map((item) => ({
|
|
80
65
|
blocks: item.children,
|
|
81
|
-
})
|
|
66
|
+
}));
|
|
82
67
|
block.component.options.columns = columns;
|
|
83
68
|
block.children = [];
|
|
84
69
|
return block;
|
|
85
|
-
},
|
|
70
|
+
},
|
|
71
|
+
For(_node, options) {
|
|
86
72
|
var _a;
|
|
87
|
-
|
|
73
|
+
const node = _node;
|
|
88
74
|
return el({
|
|
89
75
|
component: {
|
|
90
76
|
name: 'Core:Fragment',
|
|
@@ -95,9 +81,10 @@ var componentMappers = __assign(__assign({}, (!builder_1.symbolBlocksAsChildren
|
|
|
95
81
|
},
|
|
96
82
|
children: node.children
|
|
97
83
|
.filter(filter_empty_text_nodes_1.filterEmptyTextNodes)
|
|
98
|
-
.map(
|
|
84
|
+
.map((node) => (0, exports.blockToBuilder)(node, options)),
|
|
99
85
|
}, options);
|
|
100
|
-
},
|
|
86
|
+
},
|
|
87
|
+
Show(node, options) {
|
|
101
88
|
var _a;
|
|
102
89
|
return el({
|
|
103
90
|
// TODO: the reverse mapping for this
|
|
@@ -109,14 +96,19 @@ var componentMappers = __assign(__assign({}, (!builder_1.symbolBlocksAsChildren
|
|
|
109
96
|
},
|
|
110
97
|
children: node.children
|
|
111
98
|
.filter(filter_empty_text_nodes_1.filterEmptyTextNodes)
|
|
112
|
-
.map(
|
|
99
|
+
.map((node) => (0, exports.blockToBuilder)(node, options)),
|
|
113
100
|
}, options);
|
|
114
|
-
}
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
101
|
+
},
|
|
102
|
+
};
|
|
103
|
+
const el = (options, toBuilderOptions) => ({
|
|
104
|
+
'@type': '@builder.io/sdk:Element',
|
|
105
|
+
...(toBuilderOptions.includeIds && {
|
|
106
|
+
id: 'builder-' + (0, symbol_processor_1.hashCodeAsString)(options),
|
|
107
|
+
}),
|
|
108
|
+
...options,
|
|
109
|
+
});
|
|
118
110
|
function tryFormat(code) {
|
|
119
|
-
|
|
111
|
+
let str = code;
|
|
120
112
|
try {
|
|
121
113
|
str = (0, standalone_1.format)(str, {
|
|
122
114
|
parser: 'babel',
|
|
@@ -131,24 +123,23 @@ function tryFormat(code) {
|
|
|
131
123
|
}
|
|
132
124
|
return str;
|
|
133
125
|
}
|
|
134
|
-
|
|
135
|
-
var _a;
|
|
136
|
-
|
|
137
|
-
if (options === void 0) { options = {}; }
|
|
138
|
-
if (_internalOptions === void 0) { _internalOptions = {}; }
|
|
139
|
-
var mapper = !_internalOptions.skipMapper && componentMappers[json.name];
|
|
126
|
+
const blockToBuilder = (json, options = {}, _internalOptions = {}) => {
|
|
127
|
+
var _a, _b, _c, _d, _e, _f;
|
|
128
|
+
const mapper = !_internalOptions.skipMapper && componentMappers[json.name];
|
|
140
129
|
if (mapper) {
|
|
141
130
|
return mapper(json, options);
|
|
142
131
|
}
|
|
143
|
-
if (json.properties._text || ((
|
|
132
|
+
if (json.properties._text || ((_a = json.bindings._text) === null || _a === void 0 ? void 0 : _a.code)) {
|
|
144
133
|
return el({
|
|
145
134
|
tagName: 'span',
|
|
146
|
-
bindings:
|
|
147
|
-
?
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
135
|
+
bindings: {
|
|
136
|
+
...(((_b = json.bindings._text) === null || _b === void 0 ? void 0 : _b.code)
|
|
137
|
+
? {
|
|
138
|
+
'component.options.text': json.bindings._text.code,
|
|
139
|
+
'json.bindings._text.code': undefined,
|
|
140
|
+
}
|
|
141
|
+
: {}),
|
|
142
|
+
},
|
|
152
143
|
component: {
|
|
153
144
|
name: 'Text',
|
|
154
145
|
options: {
|
|
@@ -157,119 +148,139 @@ var blockToBuilder = function (json, options, _internalOptions) {
|
|
|
157
148
|
},
|
|
158
149
|
}, options);
|
|
159
150
|
}
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
for (
|
|
164
|
-
|
|
165
|
-
|
|
151
|
+
const thisIsComponent = (0, is_component_1.isComponent)(json);
|
|
152
|
+
let bindings = json.bindings;
|
|
153
|
+
const actions = {};
|
|
154
|
+
for (const key in bindings) {
|
|
155
|
+
const eventBindingKeyRegex = /^on([A-Z])/;
|
|
156
|
+
const firstCharMatchForEventBindingKey = (_c = key.match(eventBindingKeyRegex)) === null || _c === void 0 ? void 0 : _c[1];
|
|
166
157
|
if (firstCharMatchForEventBindingKey) {
|
|
167
158
|
actions[key.replace(eventBindingKeyRegex, firstCharMatchForEventBindingKey.toLowerCase())] =
|
|
168
|
-
(0, remove_surrounding_block_1.removeSurroundingBlock)((
|
|
159
|
+
(0, remove_surrounding_block_1.removeSurroundingBlock)((_d = bindings[key]) === null || _d === void 0 ? void 0 : _d.code);
|
|
169
160
|
delete bindings[key];
|
|
170
161
|
}
|
|
171
162
|
}
|
|
172
|
-
|
|
173
|
-
|
|
163
|
+
const builderBindings = {};
|
|
164
|
+
const componentOptions = omitMetaProperties(json.properties);
|
|
174
165
|
if (thisIsComponent) {
|
|
175
|
-
|
|
166
|
+
for (const key in bindings) {
|
|
176
167
|
if (key === 'css') {
|
|
177
|
-
|
|
168
|
+
continue;
|
|
178
169
|
}
|
|
179
|
-
|
|
180
|
-
|
|
170
|
+
const value = bindings[key];
|
|
171
|
+
const parsed = (0, lodash_1.attempt)(() => json5_1.default.parse(value === null || value === void 0 ? void 0 : value.code));
|
|
181
172
|
if (!(parsed instanceof Error)) {
|
|
182
173
|
componentOptions[key] = parsed;
|
|
183
174
|
}
|
|
184
175
|
else {
|
|
185
|
-
builderBindings[
|
|
176
|
+
builderBindings[`component.options.${key}`] = bindings[key].code;
|
|
186
177
|
}
|
|
187
|
-
};
|
|
188
|
-
for (var key in bindings) {
|
|
189
|
-
_loop_1(key);
|
|
190
178
|
}
|
|
191
179
|
}
|
|
192
|
-
|
|
193
|
-
|
|
180
|
+
const hasCss = !!((_e = bindings.css) === null || _e === void 0 ? void 0 : _e.code);
|
|
181
|
+
let responsiveStyles = {
|
|
194
182
|
large: {},
|
|
195
183
|
};
|
|
196
184
|
if (hasCss) {
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
for (
|
|
200
|
-
|
|
201
|
-
var mediaQueryMatch = ruleKey.match(media_sizes_1.mediaQueryRegex);
|
|
185
|
+
const cssRules = json5_1.default.parse((_f = bindings.css) === null || _f === void 0 ? void 0 : _f.code);
|
|
186
|
+
const cssRuleKeys = Object.keys(cssRules);
|
|
187
|
+
for (const ruleKey of cssRuleKeys) {
|
|
188
|
+
const mediaQueryMatch = ruleKey.match(media_sizes_1.mediaQueryRegex);
|
|
202
189
|
if (mediaQueryMatch) {
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
responsiveStyles[sizeForWidth] =
|
|
190
|
+
const [fullmatch, pixelSize] = mediaQueryMatch;
|
|
191
|
+
const sizeForWidth = media_sizes_1.sizes.getSizeForWidth(Number(pixelSize));
|
|
192
|
+
const currentSizeStyles = responsiveStyles[sizeForWidth] || {};
|
|
193
|
+
responsiveStyles[sizeForWidth] = {
|
|
194
|
+
...currentSizeStyles,
|
|
195
|
+
...cssRules[ruleKey],
|
|
196
|
+
};
|
|
207
197
|
}
|
|
208
198
|
else {
|
|
209
|
-
responsiveStyles.large =
|
|
199
|
+
responsiveStyles.large = {
|
|
200
|
+
...responsiveStyles.large,
|
|
201
|
+
[ruleKey]: cssRules[ruleKey],
|
|
202
|
+
};
|
|
210
203
|
}
|
|
211
204
|
}
|
|
212
205
|
delete json.bindings.css;
|
|
213
206
|
}
|
|
214
207
|
if (thisIsComponent) {
|
|
215
|
-
for (
|
|
216
|
-
builderBindings[
|
|
208
|
+
for (const key in json.bindings) {
|
|
209
|
+
builderBindings[`component.options.${key}`] = json.bindings[key].code;
|
|
217
210
|
}
|
|
218
211
|
}
|
|
219
|
-
return el(
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
212
|
+
return el({
|
|
213
|
+
tagName: thisIsComponent ? undefined : json.name,
|
|
214
|
+
...(hasCss && {
|
|
215
|
+
responsiveStyles,
|
|
216
|
+
}),
|
|
217
|
+
layerName: json.properties.$name,
|
|
218
|
+
...(thisIsComponent && {
|
|
219
|
+
component: {
|
|
220
|
+
name: mapComponentName(json.name),
|
|
221
|
+
options: componentOptions,
|
|
222
|
+
},
|
|
223
|
+
}),
|
|
224
|
+
code: {
|
|
227
225
|
bindings: builderBindings,
|
|
228
|
-
actions
|
|
229
|
-
},
|
|
226
|
+
actions,
|
|
227
|
+
},
|
|
228
|
+
properties: thisIsComponent ? undefined : omitMetaProperties(json.properties),
|
|
229
|
+
bindings: thisIsComponent
|
|
230
230
|
? builderBindings
|
|
231
|
-
: (0, lodash_1.omit)((0, lodash_1.mapValues)(bindings,
|
|
231
|
+
: (0, lodash_1.omit)((0, lodash_1.mapValues)(bindings, (value) => value === null || value === void 0 ? void 0 : value.code), 'css'),
|
|
232
|
+
actions,
|
|
233
|
+
children: json.children
|
|
232
234
|
.filter(filter_empty_text_nodes_1.filterEmptyTextNodes)
|
|
233
|
-
.map(
|
|
235
|
+
.map((child) => (0, exports.blockToBuilder)(child, options)),
|
|
236
|
+
}, options);
|
|
234
237
|
};
|
|
235
238
|
exports.blockToBuilder = blockToBuilder;
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
239
|
+
const componentToBuilder = (options = {}) => ({ component }) => {
|
|
240
|
+
var _a, _b;
|
|
241
|
+
const hasState = (0, state_1.checkHasState)(component);
|
|
242
|
+
const result = (0, fast_clone_1.fastClone)({
|
|
243
|
+
data: {
|
|
244
|
+
httpRequests: (_b = (_a = component === null || component === void 0 ? void 0 : component.meta) === null || _a === void 0 ? void 0 : _a.useMetadata) === null || _b === void 0 ? void 0 : _b.httpRequests,
|
|
245
|
+
jsCode: tryFormat((0, dedent_1.dedent) `
|
|
246
|
+
${!(0, has_props_1.hasProps)(component) ? '' : `var props = state;`}
|
|
247
|
+
|
|
248
|
+
${!hasState ? '' : `Object.assign(state, ${(0, get_state_object_string_1.getStateObjectStringFromComponent)(component)});`}
|
|
249
|
+
|
|
250
|
+
${(0, on_mount_1.stringifySingleScopeOnMount)(component)}
|
|
251
|
+
`),
|
|
252
|
+
tsCode: tryFormat((0, dedent_1.dedent) `
|
|
253
|
+
${!(0, has_props_1.hasProps)(component) ? '' : `var props = state;`}
|
|
254
|
+
|
|
255
|
+
${!hasState ? '' : `useStore(${(0, get_state_object_string_1.getStateObjectStringFromComponent)(component)});`}
|
|
256
|
+
|
|
257
|
+
${!component.hooks.onMount.length
|
|
258
|
+
? ''
|
|
259
|
+
: `onMount(() => {
|
|
260
|
+
${(0, on_mount_1.stringifySingleScopeOnMount)(component)}
|
|
261
|
+
})`}
|
|
262
|
+
`),
|
|
263
|
+
blocks: component.children
|
|
264
|
+
.filter(filter_empty_text_nodes_1.filterEmptyTextNodes)
|
|
265
|
+
.map((child) => (0, exports.blockToBuilder)(child, options)),
|
|
266
|
+
},
|
|
267
|
+
});
|
|
268
|
+
const subComponentMap = {};
|
|
269
|
+
for (const subComponent of component.subComponents) {
|
|
270
|
+
const name = subComponent.name;
|
|
271
|
+
subComponentMap[name] = (0, exports.componentToBuilder)(options)({
|
|
272
|
+
component: subComponent,
|
|
253
273
|
});
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
subComponentMap[
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
}
|
|
262
|
-
(0, legacy_1.default)([result, subComponentMap]).forEach(function (el) {
|
|
263
|
-
var _a;
|
|
264
|
-
if ((0, builder_1.isBuilderElement)(el)) {
|
|
265
|
-
var value = subComponentMap[(_a = el.component) === null || _a === void 0 ? void 0 : _a.name];
|
|
266
|
-
if (value) {
|
|
267
|
-
(0, lodash_1.set)(el, 'component.options.symbol.content', value);
|
|
268
|
-
}
|
|
274
|
+
}
|
|
275
|
+
(0, legacy_1.default)([result, subComponentMap]).forEach(function (el) {
|
|
276
|
+
var _a;
|
|
277
|
+
if ((0, builder_1.isBuilderElement)(el)) {
|
|
278
|
+
const value = subComponentMap[(_a = el.component) === null || _a === void 0 ? void 0 : _a.name];
|
|
279
|
+
if (value) {
|
|
280
|
+
(0, lodash_1.set)(el, 'component.options.symbol.content', value);
|
|
269
281
|
}
|
|
270
|
-
}
|
|
271
|
-
|
|
272
|
-
|
|
282
|
+
}
|
|
283
|
+
});
|
|
284
|
+
return result;
|
|
273
285
|
};
|
|
274
286
|
exports.componentToBuilder = componentToBuilder;
|
|
275
|
-
var templateObject_1, templateObject_2;
|
|
@@ -1,32 +1,38 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.contextToAngular = void 0;
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
4
|
+
const get_state_object_string_1 = require("../../helpers/get-state-object-string");
|
|
5
|
+
const standalone_1 = require("prettier/standalone");
|
|
6
|
+
const contextToAngular = (options = { typescript: false }) => ({ context }) => {
|
|
7
|
+
let str = `
|
|
8
|
+
import { Injectable } from '@angular/core';
|
|
9
|
+
|
|
10
|
+
@Injectable({
|
|
11
|
+
providedIn: 'root'
|
|
12
|
+
})
|
|
13
|
+
export default class ${context.name}Context {
|
|
14
|
+
${(0, get_state_object_string_1.stringifyContextValue)(context.value)
|
|
15
|
+
.replace(/^\{/, '')
|
|
16
|
+
.replace(/\}$/, '')
|
|
17
|
+
.replaceAll(',', ';\n')
|
|
18
|
+
.replaceAll(':', ': any = ')}
|
|
19
|
+
constructor() { }
|
|
20
|
+
}
|
|
21
|
+
`;
|
|
22
|
+
if (options.format !== false) {
|
|
23
|
+
try {
|
|
24
|
+
str = (0, standalone_1.format)(str, {
|
|
25
|
+
parser: 'typescript',
|
|
26
|
+
plugins: [
|
|
27
|
+
require('prettier/parser-typescript'), // To support running in browsers
|
|
28
|
+
],
|
|
29
|
+
});
|
|
28
30
|
}
|
|
29
|
-
|
|
30
|
-
|
|
31
|
+
catch (err) {
|
|
32
|
+
console.error('Format error for file:', str);
|
|
33
|
+
throw err;
|
|
34
|
+
}
|
|
35
|
+
}
|
|
36
|
+
return str;
|
|
31
37
|
};
|
|
32
38
|
exports.contextToAngular = contextToAngular;
|
|
@@ -1,27 +1,31 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.getContextWithSymbolKey = void 0;
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
}
|
|
4
|
+
const standalone_1 = require("prettier/standalone");
|
|
5
|
+
const get_state_object_string_1 = require("../../../helpers/get-state-object-string");
|
|
6
|
+
const getContextWithSymbolKey = (options) => ({ context }) => {
|
|
7
|
+
let str = `
|
|
8
|
+
const key = Symbol();
|
|
9
|
+
|
|
10
|
+
export default {
|
|
11
|
+
${context.name}: ${(0, get_state_object_string_1.stringifyContextValue)(context.value)},
|
|
12
|
+
key
|
|
13
|
+
}
|
|
14
|
+
`;
|
|
15
|
+
if (options.prettier !== false) {
|
|
16
|
+
try {
|
|
17
|
+
str = (0, standalone_1.format)(str, {
|
|
18
|
+
parser: 'typescript',
|
|
19
|
+
plugins: [
|
|
20
|
+
require('prettier/parser-typescript'), // To support running in browsers
|
|
21
|
+
],
|
|
22
|
+
});
|
|
23
23
|
}
|
|
24
|
-
|
|
25
|
-
|
|
24
|
+
catch (err) {
|
|
25
|
+
console.error('Format error for file:', str);
|
|
26
|
+
throw err;
|
|
27
|
+
}
|
|
28
|
+
}
|
|
29
|
+
return str;
|
|
26
30
|
};
|
|
27
31
|
exports.getContextWithSymbolKey = getContextWithSymbolKey;
|
|
@@ -1,27 +1,27 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.contextToQwik = void 0;
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
}
|
|
19
|
-
catch (err) {
|
|
20
|
-
console.error('Format error for file:', str);
|
|
21
|
-
throw err;
|
|
22
|
-
}
|
|
4
|
+
const standalone_1 = require("prettier/standalone");
|
|
5
|
+
const contextToQwik = (options = {}) => ({ context }) => {
|
|
6
|
+
let str = `
|
|
7
|
+
import { createContextId } from '@builder.io/qwik';
|
|
8
|
+
|
|
9
|
+
export default createContextId<any>("${context.name}")
|
|
10
|
+
`;
|
|
11
|
+
if (options.format !== false) {
|
|
12
|
+
try {
|
|
13
|
+
str = (0, standalone_1.format)(str, {
|
|
14
|
+
parser: 'typescript',
|
|
15
|
+
plugins: [
|
|
16
|
+
require('prettier/parser-typescript'), // To support running in browsers
|
|
17
|
+
],
|
|
18
|
+
});
|
|
23
19
|
}
|
|
24
|
-
|
|
25
|
-
|
|
20
|
+
catch (err) {
|
|
21
|
+
console.error('Format error for file:', str);
|
|
22
|
+
throw err;
|
|
23
|
+
}
|
|
24
|
+
}
|
|
25
|
+
return str;
|
|
26
26
|
};
|
|
27
27
|
exports.contextToQwik = contextToQwik;
|