@builder.io/mitosis 0.0.56-89 → 0.0.56-91
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.
|
@@ -171,6 +171,9 @@ var blockToAngular = function (json, options, blockOptions) {
|
|
|
171
171
|
else if (BINDINGS_MAPPER[key]) {
|
|
172
172
|
str += " [".concat(BINDINGS_MAPPER[key], "]=\"").concat(useValue, "\" ");
|
|
173
173
|
}
|
|
174
|
+
else if (key.includes('-')) {
|
|
175
|
+
str += " [attr.".concat(key, "]=\"").concat(useValue, "\" ");
|
|
176
|
+
}
|
|
174
177
|
else {
|
|
175
178
|
str += " [".concat(key, "]=\"").concat(useValue, "\" ");
|
|
176
179
|
}
|
|
@@ -28,6 +28,17 @@ var get_refs_1 = require("../../helpers/get-refs");
|
|
|
28
28
|
var lodash_1 = require("lodash");
|
|
29
29
|
var is_upper_case_1 = require("../../helpers/is-upper-case");
|
|
30
30
|
var has_1 = require("../../helpers/has");
|
|
31
|
+
var getCustomTagName = function (name, options) {
|
|
32
|
+
if (!name || !(0, is_upper_case_1.isUpperCase)(name[0])) {
|
|
33
|
+
return name;
|
|
34
|
+
}
|
|
35
|
+
var kebabCaseName = (0, dash_case_1.dashCase)(name);
|
|
36
|
+
if (!kebabCaseName.includes('-')) {
|
|
37
|
+
// TODO: option to choose your prefix
|
|
38
|
+
return 'my-' + kebabCaseName;
|
|
39
|
+
}
|
|
40
|
+
return kebabCaseName;
|
|
41
|
+
};
|
|
31
42
|
var blockToLit = function (json, options) {
|
|
32
43
|
var _a, _b, _c, _d, _e;
|
|
33
44
|
if (options === void 0) { options = {}; }
|
|
@@ -50,7 +61,7 @@ var blockToLit = function (json, options) {
|
|
|
50
61
|
.join('\n'), "`\n : ").concat(!json.meta.else ? 'null' : "html`".concat(blockToLit(json.meta.else, options), "`"), "}");
|
|
51
62
|
}
|
|
52
63
|
var str = '';
|
|
53
|
-
var tagName = (
|
|
64
|
+
var tagName = getCustomTagName(json.name, options);
|
|
54
65
|
str += "<".concat(tagName, " ");
|
|
55
66
|
var classString = (0, collect_class_string_1.collectClassString)(json);
|
|
56
67
|
if (classString) {
|
|
@@ -164,9 +175,9 @@ var componentToLit = function (options) {
|
|
|
164
175
|
html = html.replace(/\n{3,}/g, '\n\n');
|
|
165
176
|
}
|
|
166
177
|
}
|
|
167
|
-
var str = (0, dedent_1.default)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n ", "\n import { LitElement, html, css } from 'lit';\n import { customElement, property, state } from 'lit/decorators.js';\n\n ", "\n ", "\n\n @customElement('", "')\n export default class ", " extends LitElement {\n ", "\n\n ", "\n \n \n ", "\n\n ", "\n ", "\n \n ", "\n ", "\n ", "\n \n render() {\n return html`\n ", "\n `\n }\n }\n "], ["\n ", "\n import { LitElement, html, css } from 'lit';\n import { customElement, property, state } from 'lit/decorators.js';\n\n ", "\n ", "\n\n @customElement('", "')\n export default class ", " extends LitElement {\n ", "\n\n ", "\n \n \n ", "\n\n ", "\n ", "\n \n ", "\n ", "\n ", "\n \n render() {\n return html\\`\n ", "\n \\`\n }\n }\n "])), (0, render_imports_1.renderPreComponent)({ component: json, target: 'lit' }), json.types ? json.types.join('\n') : '', hasSpread
|
|
178
|
+
var str = (0, dedent_1.default)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n ", "\n import { LitElement, html, css } from 'lit';\n import { customElement, property, state, query } from 'lit/decorators.js';\n\n ", "\n ", "\n\n @customElement('", "')\n export default class ", " extends LitElement {\n ", "\n\n ", "\n \n \n ", "\n\n ", "\n ", "\n \n ", "\n ", "\n ", "\n \n render() {\n return html`\n ", "\n `\n }\n }\n "], ["\n ", "\n import { LitElement, html, css } from 'lit';\n import { customElement, property, state, query } from 'lit/decorators.js';\n\n ", "\n ", "\n\n @customElement('", "')\n export default class ", " extends LitElement {\n ", "\n\n ", "\n \n \n ", "\n\n ", "\n ", "\n \n ", "\n ", "\n ", "\n \n render() {\n return html\\`\n ", "\n \\`\n }\n }\n "])), (0, render_imports_1.renderPreComponent)({ component: json, target: 'lit' }), json.types ? json.types.join('\n') : '', hasSpread
|
|
168
179
|
? "\n const spread = (properties) =>\n directive((part) => {\n for (const property in properties) {\n const value = properties[attr];\n part.element[property] = value;\n }\n });\n "
|
|
169
|
-
: '', ((_b = json.meta.useMetadata) === null || _b === void 0 ? void 0 : _b.tagName) || (
|
|
180
|
+
: '', ((_b = json.meta.useMetadata) === null || _b === void 0 ? void 0 : _b.tagName) || getCustomTagName(json.name, options), json.name, css.length
|
|
170
181
|
? "static styles = css`\n ".concat((0, indent_1.indent)(css, 8), "`;")
|
|
171
182
|
: '', Array.from(domRefs)
|
|
172
183
|
.map(function (refName) { return "\n @query('[ref=\"".concat(refName, "\"]')\n ").concat((0, lodash_1.camelCase)(refName), "!: HTMLElement;\n "); })
|
|
@@ -62,7 +62,7 @@ function getStatePropertyNames(json) {
|
|
|
62
62
|
return Object.keys(json.state).filter(function (key) { var _a; return ((_a = json.state[key]) === null || _a === void 0 ? void 0 : _a.type) === 'property'; });
|
|
63
63
|
}
|
|
64
64
|
var blockToMarko = function (json, options) {
|
|
65
|
-
var _a, _b, _c, _d, _e;
|
|
65
|
+
var _a, _b, _c, _d, _e, _f;
|
|
66
66
|
if (json.properties._text) {
|
|
67
67
|
return json.properties._text;
|
|
68
68
|
}
|
|
@@ -73,20 +73,21 @@ var blockToMarko = function (json, options) {
|
|
|
73
73
|
return json.children.map(function (child) { return blockToMarko(child, options); }).join('\n');
|
|
74
74
|
}
|
|
75
75
|
if (json.name === 'For') {
|
|
76
|
-
|
|
76
|
+
var forArguments = (((_c = json === null || json === void 0 ? void 0 : json.scope) === null || _c === void 0 ? void 0 : _c.For) || []).join(',');
|
|
77
|
+
return "<for|".concat(forArguments, "| of=(").concat(processBinding(options.component, (_d = json.bindings.each) === null || _d === void 0 ? void 0 : _d.code), ")>\n ").concat(json.children
|
|
77
78
|
.filter(filter_empty_text_nodes_1.filterEmptyTextNodes)
|
|
78
79
|
.map(function (item) { return blockToMarko(item, options); })
|
|
79
80
|
.join('\n'), "\n </for>");
|
|
80
81
|
}
|
|
81
82
|
else if (json.name === 'Show') {
|
|
82
|
-
return "<if(".concat(processBinding(options.component, (
|
|
83
|
+
return "<if(".concat(processBinding(options.component, (_e = json.bindings.when) === null || _e === void 0 ? void 0 : _e.code), ")>\n ").concat(json.children
|
|
83
84
|
.filter(filter_empty_text_nodes_1.filterEmptyTextNodes)
|
|
84
85
|
.map(function (item) { return blockToMarko(item, options); })
|
|
85
86
|
.join('\n'), "</if>\n ").concat(!json.meta.else ? '' : "<else>".concat(blockToMarko(json.meta.else, options), "</else>"));
|
|
86
87
|
}
|
|
87
88
|
var str = '';
|
|
88
89
|
str += "<".concat(json.name, " ");
|
|
89
|
-
if ((
|
|
90
|
+
if ((_f = json.bindings._spread) === null || _f === void 0 ? void 0 : _f.code) {
|
|
90
91
|
str += " ...(".concat(json.bindings._spread.code, ") ");
|
|
91
92
|
}
|
|
92
93
|
for (var key in json.properties) {
|
|
@@ -94,7 +95,7 @@ var blockToMarko = function (json, options) {
|
|
|
94
95
|
str += " ".concat(key, "=\"").concat(value, "\" ");
|
|
95
96
|
}
|
|
96
97
|
for (var key in json.bindings) {
|
|
97
|
-
var
|
|
98
|
+
var _g = json.bindings[key], code = _g.code, _h = _g.arguments, cusArgs = _h === void 0 ? ['event'] : _h;
|
|
98
99
|
if (key === '_spread' || key === '_forName') {
|
|
99
100
|
continue;
|
|
100
101
|
}
|