@builder.io/mitosis 0.0.45 → 0.0.46

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.
Files changed (206) hide show
  1. package/dist/src/__tests__/builder.test.js +71 -68
  2. package/dist/src/__tests__/context.test.js +13 -10
  3. package/dist/src/__tests__/data/basic.raw.jsx +1 -1
  4. package/dist/src/__tests__/data/blocks/button-with-metadata.raw.jsx +1 -1
  5. package/dist/src/__tests__/data/blocks/columns.raw.jsx +2 -2
  6. package/dist/src/__tests__/data/blocks/custom-code.raw.jsx +3 -3
  7. package/dist/src/__tests__/data/blocks/embed.raw.jsx +3 -3
  8. package/dist/src/__tests__/data/blocks/form.raw.jsx +5 -5
  9. package/dist/src/__tests__/data/blocks/image.raw.jsx +4 -4
  10. package/dist/src/__tests__/data/blocks/stamped-io.raw.jsx +4 -4
  11. package/dist/src/__tests__/data/context/component-with-context.lite.jsx +2 -2
  12. package/dist/src/__tests__/data/context/simple.context.lite.js +1 -1
  13. package/dist/src/__tests__/html.test.js +2 -2
  14. package/dist/src/__tests__/liquid.test.js +34 -34
  15. package/dist/src/__tests__/parse-jsx.test.js +1 -1
  16. package/dist/src/__tests__/qwik.test.js +36 -36
  17. package/dist/src/__tests__/react-native.test.js +35 -35
  18. package/dist/src/__tests__/react.test.js +35 -35
  19. package/dist/src/__tests__/solid.test.js +32 -32
  20. package/dist/src/__tests__/vue.test.js +35 -34
  21. package/dist/src/generators/angular.d.ts +4 -7
  22. package/dist/src/generators/angular.js +77 -81
  23. package/dist/src/generators/builder.d.ts +4 -4
  24. package/dist/src/generators/builder.js +57 -57
  25. package/dist/src/generators/context/react.d.ts +3 -1
  26. package/dist/src/generators/context/react.js +20 -17
  27. package/dist/src/generators/html.d.ts +5 -9
  28. package/dist/src/generators/html.js +205 -199
  29. package/dist/src/generators/liquid.d.ts +5 -9
  30. package/dist/src/generators/liquid.js +62 -59
  31. package/dist/src/generators/mitosis.d.ts +6 -7
  32. package/dist/src/generators/mitosis.js +61 -63
  33. package/dist/src/generators/qwik/component.js +13 -13
  34. package/dist/src/generators/qwik/handlers.js +12 -8
  35. package/dist/src/generators/qwik/jsx.js +13 -9
  36. package/dist/src/generators/qwik/styles.js +11 -7
  37. package/dist/src/generators/react-native.d.ts +4 -7
  38. package/dist/src/generators/react-native.js +25 -22
  39. package/dist/src/generators/react.d.ts +4 -8
  40. package/dist/src/generators/react.js +103 -112
  41. package/dist/src/generators/solid.d.ts +4 -8
  42. package/dist/src/generators/solid.js +55 -54
  43. package/dist/src/generators/svelte.d.ts +4 -7
  44. package/dist/src/generators/svelte.js +120 -123
  45. package/dist/src/generators/swift-ui.d.ts +2 -2
  46. package/dist/src/generators/swift-ui.js +62 -62
  47. package/dist/src/generators/template.d.ts +4 -8
  48. package/dist/src/generators/template.js +48 -45
  49. package/dist/src/generators/vue.d.ts +9 -9
  50. package/dist/src/generators/vue.js +169 -169
  51. package/dist/src/helpers/babel-transform.js +9 -9
  52. package/dist/src/helpers/collect-styles.js +39 -39
  53. package/dist/src/helpers/dash-case.js +1 -1
  54. package/dist/src/helpers/generic-format.test.js +2 -2
  55. package/dist/src/helpers/get-components-used.js +2 -2
  56. package/dist/src/helpers/get-components.js +3 -3
  57. package/dist/src/helpers/get-props.js +1 -1
  58. package/dist/src/helpers/get-refs.js +2 -2
  59. package/dist/src/helpers/get-state-object-string.js +5 -5
  60. package/dist/src/helpers/get-state-used.js +1 -1
  61. package/dist/src/helpers/get-styles.js +1 -1
  62. package/dist/src/helpers/getters-to-functions.js +4 -4
  63. package/dist/src/helpers/handle-missing-state.js +1 -1
  64. package/dist/src/helpers/has-component.js +2 -2
  65. package/dist/src/helpers/has-props.js +1 -1
  66. package/dist/src/helpers/is-children.js +1 -1
  67. package/dist/src/helpers/json.d.ts +1 -0
  68. package/dist/src/helpers/json.js +17 -0
  69. package/dist/src/helpers/map-refs.js +4 -4
  70. package/dist/src/helpers/map-to-attributes.js +4 -4
  71. package/dist/src/helpers/map-to-css.js +2 -2
  72. package/dist/src/helpers/parse-node.js +2 -2
  73. package/dist/src/helpers/parse-reactive-script.js +4 -4
  74. package/dist/src/helpers/process-http-requests.js +1 -1
  75. package/dist/src/helpers/process-tag-references.js +4 -4
  76. package/dist/src/helpers/remove-surrounding-block.test.js +1 -1
  77. package/dist/src/helpers/render-imports.js +7 -7
  78. package/dist/src/helpers/replace-idenifiers.js +1 -1
  79. package/dist/src/helpers/strip-meta-properties.js +2 -2
  80. package/dist/src/helpers/trace-reference-to-module-path.js +1 -1
  81. package/dist/src/helpers/traverse-nodes.js +2 -2
  82. package/dist/src/helpers/try-prettier-format.js +1 -1
  83. package/dist/src/index.d.ts +2 -0
  84. package/dist/src/index.js +2 -0
  85. package/dist/src/modules/plugins.d.ts +2 -10
  86. package/dist/src/parsers/angular.js +13 -13
  87. package/dist/src/parsers/builder.js +54 -58
  88. package/dist/src/parsers/context.js +2 -2
  89. package/dist/src/parsers/jsx.js +59 -87
  90. package/dist/src/parsers/liquid.js +191 -194
  91. package/dist/src/plugins/compile-away-builder-components.js +49 -45
  92. package/dist/src/plugins/compile-away-components.js +3 -3
  93. package/dist/src/plugins/map-styles.js +3 -3
  94. package/dist/src/targets.d.ts +24 -0
  95. package/dist/src/targets.js +30 -0
  96. package/dist/src/types/config.d.ts +31 -0
  97. package/dist/src/types/{jsx-lite-component.js → config.js} +0 -0
  98. package/dist/{test/qwik/Todo/Todo.js/low.js → src/types/generators.d.ts} +0 -0
  99. package/dist/src/types/generators.js +1 -0
  100. package/dist/src/types/plugins.d.ts +11 -0
  101. package/dist/src/types/{jsx-lite-context.js → plugins.js} +0 -0
  102. package/dist/test/qwik/{Todo → todo}/Todo.cjs/high.cjs +0 -0
  103. package/dist/test/qwik/{Todo → todo}/Todo.cjs/low.cjs +0 -0
  104. package/dist/test/qwik/{Todo → todo}/Todo.cjs/med.cjs +0 -0
  105. package/dist/test/qwik/{Todo → todo}/Todo.js/high.js +0 -0
  106. package/dist/test/qwik/{qwik/todo → todo}/Todo.js/low.js +0 -0
  107. package/dist/test/qwik/{Todo → todo}/Todo.js/med.js +0 -0
  108. package/dist/test/qwik/{Todo → todo}/Todo.tsx/high.tsx +0 -0
  109. package/dist/test/qwik/{Todo → todo}/Todo.tsx/low.tsx +0 -0
  110. package/dist/test/qwik/{Todo → todo}/Todo.tsx/med.tsx +0 -0
  111. package/dist/test/qwik/{Todos → todos}/Todo.tsx/high.tsx +0 -0
  112. package/dist/test/qwik/{Todos → todos}/Todo.tsx/low.tsx +0 -0
  113. package/dist/test/qwik/{Todos → todos}/Todo.tsx/med.tsx +0 -0
  114. package/dist/tsconfig.tsbuildinfo +1 -1
  115. package/package.json +2 -2
  116. package/dist/src/__tests__/data/blocks/tabs.raw.d.ts +0 -11
  117. package/dist/src/__tests__/data/blocks/tabs.raw.jsx +0 -24
  118. package/dist/src/__tests__/qoot.test.d.ts +0 -1
  119. package/dist/src/__tests__/qoot.test.js +0 -115
  120. package/dist/src/generators/jsx-lite.d.ts +0 -10
  121. package/dist/src/generators/jsx-lite.js +0 -176
  122. package/dist/src/generators/qoot.d.ts +0 -21
  123. package/dist/src/generators/qoot.js +0 -442
  124. package/dist/src/generators/qwik.d.ts +0 -21
  125. package/dist/src/generators/qwik.js +0 -458
  126. package/dist/src/helpers/create-jsx-lite-component.d.ts +0 -2
  127. package/dist/src/helpers/create-jsx-lite-component.js +0 -16
  128. package/dist/src/helpers/create-jsx-lite-context.d.ts +0 -4
  129. package/dist/src/helpers/create-jsx-lite-context.js +0 -18
  130. package/dist/src/helpers/create-jsx-lite-node.d.ts +0 -2
  131. package/dist/src/helpers/create-jsx-lite-node.js +0 -16
  132. package/dist/src/helpers/is-jsx-lite-node.d.ts +0 -2
  133. package/dist/src/helpers/is-jsx-lite-node.js +0 -7
  134. package/dist/src/types/jsx-lite-component.d.ts +0 -63
  135. package/dist/src/types/jsx-lite-context.d.ts +0 -6
  136. package/dist/src/types/jsx-lite-node.d.ts +0 -13
  137. package/dist/src/types/jsx-lite-node.js +0 -2
  138. package/dist/src/types/jsx-lite-styles.d.ts +0 -1
  139. package/dist/src/types/jsx-lite-styles.js +0 -2
  140. package/dist/test/qoot/Todo/bundle.js +0 -88
  141. package/dist/test/qoot/Todo/component.ts +0 -17
  142. package/dist/test/qoot/Todo/onButtonClick.ts +0 -13
  143. package/dist/test/qoot/Todo/onInput2Blur.ts +0 -11
  144. package/dist/test/qoot/Todo/onInput2KeyUp.ts +0 -10
  145. package/dist/test/qoot/Todo/onInputClick.ts +0 -10
  146. package/dist/test/qoot/Todo/onLabelDblClick.ts +0 -11
  147. package/dist/test/qoot/Todo/public.ts +0 -4
  148. package/dist/test/qoot/Todo/template.tsx +0 -46
  149. package/dist/test/qoot/Todos/component.ts +0 -9
  150. package/dist/test/qoot/Todos/onInputClick.ts +0 -14
  151. package/dist/test/qoot/Todos/public.ts +0 -3
  152. package/dist/test/qoot/Todos/template.tsx +0 -30
  153. package/dist/test/qwik/Todo/bundle.js +0 -46
  154. package/dist/test/qwik/Todo/component.ts +0 -17
  155. package/dist/test/qwik/Todo/onButtonClick.ts +0 -10
  156. package/dist/test/qwik/Todo/onInput2Blur.ts +0 -14
  157. package/dist/test/qwik/Todo/onInput2KeyUp.ts +0 -10
  158. package/dist/test/qwik/Todo/onInputClick.ts +0 -13
  159. package/dist/test/qwik/Todo/onLabelDblClick.ts +0 -11
  160. package/dist/test/qwik/Todo/public.ts +0 -3
  161. package/dist/test/qwik/Todo/template.tsx +0 -46
  162. package/dist/test/qwik/Todo.ts +0 -4
  163. package/dist/test/qwik/Todo_component.ts +0 -17
  164. package/dist/test/qwik/Todo_onButtonClick.ts +0 -13
  165. package/dist/test/qwik/Todo_onInput2Blur.ts +0 -14
  166. package/dist/test/qwik/Todo_onInput2KeyUp.ts +0 -10
  167. package/dist/test/qwik/Todo_onInputClick.ts +0 -13
  168. package/dist/test/qwik/Todo_onLabelDblClick.ts +0 -14
  169. package/dist/test/qwik/Todo_template.tsx +0 -46
  170. package/dist/test/qwik/Todos/component.ts +0 -9
  171. package/dist/test/qwik/Todos/onInputClick.ts +0 -14
  172. package/dist/test/qwik/Todos/public.ts +0 -3
  173. package/dist/test/qwik/Todos/template.tsx +0 -30
  174. package/dist/test/qwik/Todos.ts +0 -3
  175. package/dist/test/qwik/Todos_component.ts +0 -9
  176. package/dist/test/qwik/Todos_onInputClick.ts +0 -14
  177. package/dist/test/qwik/Todos_template.tsx +0 -30
  178. package/dist/test/qwik/qwik/Image/high.js +0 -1
  179. package/dist/test/qwik/qwik/Image/low.js +0 -75
  180. package/dist/test/qwik/qwik/Image/med.js +0 -9
  181. package/dist/test/qwik/qwik/Image.slow/high.js +0 -1
  182. package/dist/test/qwik/qwik/Image.slow/low.js +0 -75
  183. package/dist/test/qwik/qwik/Image.slow/med.js +0 -9
  184. package/dist/test/qwik/qwik/button/high.js +0 -8
  185. package/dist/test/qwik/qwik/button/low.js +0 -34
  186. package/dist/test/qwik/qwik/button/med.js +0 -9
  187. package/dist/test/qwik/qwik/hello_world/stylesheet/high.jsx +0 -1
  188. package/dist/test/qwik/qwik/hello_world/stylesheet/low.jsx +0 -24
  189. package/dist/test/qwik/qwik/hello_world/stylesheet/med.jsx +0 -9
  190. package/dist/test/qwik/qwik/page-with-symbol/high.js +0 -1
  191. package/dist/test/qwik/qwik/page-with-symbol/low.js +0 -49
  192. package/dist/test/qwik/qwik/page-with-symbol/med.js +0 -9
  193. package/dist/test/qwik/qwik/svg/high.js +0 -1
  194. package/dist/test/qwik/qwik/svg/low.js +0 -30
  195. package/dist/test/qwik/qwik/svg/med.js +0 -9
  196. package/dist/test/qwik/qwik/todo/Todo.cjs/high.cjs +0 -31
  197. package/dist/test/qwik/qwik/todo/Todo.cjs/low.cjs +0 -1
  198. package/dist/test/qwik/qwik/todo/Todo.cjs/med.cjs +0 -59
  199. package/dist/test/qwik/qwik/todo/Todo.js/high.js +0 -5
  200. package/dist/test/qwik/qwik/todo/Todo.js/med.js +0 -1
  201. package/dist/test/qwik/qwik/todo/Todo.tsx/high.tsx +0 -30
  202. package/dist/test/qwik/qwik/todo/Todo.tsx/low.tsx +0 -1
  203. package/dist/test/qwik/qwik/todo/Todo.tsx/med.tsx +0 -34
  204. package/dist/test/qwik/qwik/todos/Todo.tsx/high.tsx +0 -12
  205. package/dist/test/qwik/qwik/todos/Todo.tsx/low.tsx +0 -24
  206. package/dist/test/qwik/qwik/todos/Todo.tsx/med.tsx +0 -8
@@ -36,22 +36,22 @@ function getContextNames(json) {
36
36
  // TODO: migrate all stripStateAndPropsRefs to use this here
37
37
  // to properly replace context refs
38
38
  function processBinding(code, _options, json) {
39
- return replace_idenifiers_1.replaceIdentifiers(strip_state_and_props_refs_1.stripStateAndPropsRefs(code, {
39
+ return (0, replace_idenifiers_1.replaceIdentifiers)((0, strip_state_and_props_refs_1.stripStateAndPropsRefs)(code, {
40
40
  includeState: true,
41
41
  includeProps: true,
42
42
  replaceWith: 'this.',
43
- }), getContextNames(json), function (name) { return "this." + name; });
43
+ }), getContextNames(json), function (name) { return "this.".concat(name); });
44
44
  }
45
45
  var NODE_MAPPERS = {
46
46
  Fragment: function (json, options) {
47
- return json.children.map(function (item) { return exports.blockToVue(item, options); }).join('\n');
47
+ return json.children.map(function (item) { return (0, exports.blockToVue)(item, options); }).join('\n');
48
48
  },
49
49
  For: function (json, options) {
50
50
  var keyValue = json.bindings.key || 'index';
51
- var forValue = "(" + json.properties._forName + ", index) in " + strip_state_and_props_refs_1.stripStateAndPropsRefs(json.bindings.each);
51
+ var forValue = "(".concat(json.properties._forName, ", index) in ").concat((0, strip_state_and_props_refs_1.stripStateAndPropsRefs)(json.bindings.each));
52
52
  if (options.vueVersion >= 3) {
53
53
  // TODO: tmk key goes on different element (parent vs child) based on Vue 2 vs Vue 3
54
- return "<template :key=\"" + keyValue + "\" v-for=\"" + forValue + "\">\n " + json.children.map(function (item) { return exports.blockToVue(item, options); }).join('\n') + "\n </template>";
54
+ return "<template :key=\"".concat(keyValue, "\" v-for=\"").concat(forValue, "\">\n ").concat(json.children.map(function (item) { return (0, exports.blockToVue)(item, options); }).join('\n'), "\n </template>");
55
55
  }
56
56
  // Vue 2 can only handle one root element
57
57
  var firstChild = json.children.filter(filter_empty_text_nodes_1.filterEmptyTextNodes)[0];
@@ -60,29 +60,29 @@ var NODE_MAPPERS = {
60
60
  }
61
61
  firstChild.bindings.key = keyValue;
62
62
  firstChild.properties['v-for'] = forValue;
63
- return exports.blockToVue(firstChild, options);
63
+ return (0, exports.blockToVue)(firstChild, options);
64
64
  },
65
65
  Show: function (json, options) {
66
- var ifValue = strip_state_and_props_refs_1.stripStateAndPropsRefs(json.bindings.when);
66
+ var ifValue = (0, strip_state_and_props_refs_1.stripStateAndPropsRefs)(json.bindings.when);
67
67
  if (options.vueVersion >= 3) {
68
- return "\n <template v-if=\"" + ifValue + "\">\n " + json.children.map(function (item) { return exports.blockToVue(item, options); }).join('\n') + "\n </template>\n " + (!json.meta.else
68
+ return "\n <template v-if=\"".concat(ifValue, "\">\n ").concat(json.children.map(function (item) { return (0, exports.blockToVue)(item, options); }).join('\n'), "\n </template>\n ").concat(!json.meta.else
69
69
  ? ''
70
- : "\n <template v-else>\n " + exports.blockToVue(json.meta.else, options) + "\n </template>\n ") + "\n ";
70
+ : "\n <template v-else>\n ".concat((0, exports.blockToVue)(json.meta.else, options), "\n </template>\n "), "\n ");
71
71
  }
72
72
  var ifString = '';
73
73
  // Vue 2 can only handle one root element
74
74
  var firstChild = json.children.filter(filter_empty_text_nodes_1.filterEmptyTextNodes)[0];
75
75
  if (firstChild) {
76
76
  firstChild.properties['v-if'] = ifValue;
77
- ifString = exports.blockToVue(firstChild, options);
77
+ ifString = (0, exports.blockToVue)(firstChild, options);
78
78
  }
79
79
  var elseString = '';
80
80
  var elseBlock = json.meta.else;
81
- if (is_mitosis_node_1.isMitosisNode(elseBlock)) {
81
+ if ((0, is_mitosis_node_1.isMitosisNode)(elseBlock)) {
82
82
  elseBlock.properties['v-else'] = '';
83
- elseString = exports.blockToVue(elseBlock, options);
83
+ elseString = (0, exports.blockToVue)(elseBlock, options);
84
84
  }
85
- return "\n " + ifString + "\n " + elseString + "\n ";
85
+ return "\n ".concat(ifString, "\n ").concat(elseString, "\n ");
86
86
  },
87
87
  };
88
88
  // TODO: Maybe in the future allow defining `string | function` as values
@@ -90,9 +90,9 @@ var BINDING_MAPPERS = {
90
90
  innerHTML: 'v-html',
91
91
  };
92
92
  // Transform <foo.bar key="value" /> to <component :is="foo.bar" key="value" />
93
- function processDynamicComponents(json, options) {
94
- traverse_1.default(json).forEach(function (node) {
95
- if (is_mitosis_node_1.isMitosisNode(node)) {
93
+ function processDynamicComponents(json, _options) {
94
+ (0, traverse_1.default)(json).forEach(function (node) {
95
+ if ((0, is_mitosis_node_1.isMitosisNode)(node)) {
96
96
  if (node.name.includes('.')) {
97
97
  node.bindings.is = node.name;
98
98
  node.name = 'component';
@@ -100,9 +100,9 @@ function processDynamicComponents(json, options) {
100
100
  }
101
101
  });
102
102
  }
103
- function processForKeys(json, options) {
104
- traverse_1.default(json).forEach(function (node) {
105
- if (is_mitosis_node_1.isMitosisNode(node)) {
103
+ function processForKeys(json, _options) {
104
+ (0, traverse_1.default)(json).forEach(function (node) {
105
+ if ((0, is_mitosis_node_1.isMitosisNode)(node)) {
106
106
  if (node.name === 'For') {
107
107
  var firstChild = node.children[0];
108
108
  if (firstChild && firstChild.bindings.key) {
@@ -118,7 +118,7 @@ var blockToVue = function (node, options) {
118
118
  if (nodeMapper) {
119
119
  return nodeMapper(node, options);
120
120
  }
121
- if (is_children_1.default(node)) {
121
+ if ((0, is_children_1.default)(node)) {
122
122
  return "<slot></slot>";
123
123
  }
124
124
  if (node.name === 'style') {
@@ -128,19 +128,19 @@ var blockToVue = function (node, options) {
128
128
  node.properties.is = 'style';
129
129
  }
130
130
  if (node.properties._text) {
131
- return "" + node.properties._text;
131
+ return "".concat(node.properties._text);
132
132
  }
133
133
  if (node.bindings._text) {
134
- return "{{" + strip_state_and_props_refs_1.stripStateAndPropsRefs(node.bindings._text) + "}}";
134
+ return "{{".concat((0, strip_state_and_props_refs_1.stripStateAndPropsRefs)(node.bindings._text), "}}");
135
135
  }
136
136
  var str = '';
137
- str += "<" + node.name + " ";
137
+ str += "<".concat(node.name, " ");
138
138
  if (node.bindings._spread) {
139
- str += "v-bind=\"" + strip_state_and_props_refs_1.stripStateAndPropsRefs(node.bindings._spread) + "\"";
139
+ str += "v-bind=\"".concat((0, strip_state_and_props_refs_1.stripStateAndPropsRefs)(node.bindings._spread), "\"");
140
140
  }
141
141
  for (var key in node.properties) {
142
142
  var value = node.properties[key];
143
- str += " " + key + "=\"" + value + "\" ";
143
+ str += " ".concat(key, "=\"").concat(value, "\" ");
144
144
  }
145
145
  for (var key in node.bindings) {
146
146
  if (key === '_spread') {
@@ -148,33 +148,33 @@ var blockToVue = function (node, options) {
148
148
  }
149
149
  var value = node.bindings[key];
150
150
  if (key === 'class') {
151
- str += " :class=\"_classStringToObject(" + strip_state_and_props_refs_1.stripStateAndPropsRefs(value, {
151
+ str += " :class=\"_classStringToObject(".concat((0, strip_state_and_props_refs_1.stripStateAndPropsRefs)(value, {
152
152
  replaceWith: 'this.',
153
- }) + ")\" ";
153
+ }), ")\" ");
154
154
  // TODO: support dynamic classes as objects somehow like Vue requires
155
155
  // https://vuejs.org/v2/guide/class-and-style.html
156
156
  continue;
157
157
  }
158
158
  // TODO: proper babel transform to replace. Util for this
159
- var useValue = strip_state_and_props_refs_1.stripStateAndPropsRefs(value);
159
+ var useValue = (0, strip_state_and_props_refs_1.stripStateAndPropsRefs)(value);
160
160
  if (key.startsWith('on')) {
161
161
  var event_1 = key.replace('on', '').toLowerCase();
162
162
  if (event_1 === 'change' && node.name === 'input') {
163
163
  event_1 = 'input';
164
164
  }
165
165
  // TODO: proper babel transform to replace. Util for this
166
- str += " @" + event_1 + "=\"" + remove_surrounding_block_1.removeSurroundingBlock(useValue
166
+ str += " @".concat(event_1, "=\"").concat((0, remove_surrounding_block_1.removeSurroundingBlock)(useValue
167
167
  // TODO: proper reference parse and replacing
168
- .replace(/event\./g, '$event.')) + "\" ";
168
+ .replace(/event\./g, '$event.')), "\" ");
169
169
  }
170
170
  else if (key === 'ref') {
171
- str += " ref=\"" + useValue + "\" ";
171
+ str += " ref=\"".concat(useValue, "\" ");
172
172
  }
173
173
  else if (BINDING_MAPPERS[key]) {
174
- str += " " + BINDING_MAPPERS[key] + "=\"" + useValue + "\" ";
174
+ str += " ".concat(BINDING_MAPPERS[key], "=\"").concat(useValue, "\" ");
175
175
  }
176
176
  else {
177
- str += " :" + key + "=\"" + useValue + "\" ";
177
+ str += " :".concat(key, "=\"").concat(useValue, "\" ");
178
178
  }
179
179
  }
180
180
  if (jsx_1.selfClosingTags.has(node.name)) {
@@ -182,15 +182,15 @@ var blockToVue = function (node, options) {
182
182
  }
183
183
  str += '>';
184
184
  if (node.children) {
185
- str += node.children.map(function (item) { return exports.blockToVue(item, options); }).join('');
185
+ str += node.children.map(function (item) { return (0, exports.blockToVue)(item, options); }).join('');
186
186
  }
187
- return str + ("</" + node.name + ">");
187
+ return str + "</".concat(node.name, ">");
188
188
  };
189
189
  exports.blockToVue = blockToVue;
190
190
  function getContextInjectString(component, options) {
191
191
  var str = '{';
192
192
  for (var key in component.context.get) {
193
- str += "\n " + key + ": \"" + component.context.get[key].name + "\",\n ";
193
+ str += "\n ".concat(key, ": \"").concat(component.context.get[key].name, "\",\n ");
194
194
  }
195
195
  str += '}';
196
196
  return str;
@@ -199,150 +199,150 @@ function getContextProvideString(component, options) {
199
199
  var str = '{';
200
200
  for (var key in component.context.set) {
201
201
  var _a = component.context.set[key], value = _a.value, name_1 = _a.name;
202
- str += "\n " + name_1 + ": " + (value
203
- ? get_state_object_string_1.getMemberObjectString(value, {
202
+ str += "\n ".concat(name_1, ": ").concat(value
203
+ ? (0, get_state_object_string_1.getMemberObjectString)(value, {
204
204
  valueMapper: function (code) {
205
- return strip_state_and_props_refs_1.stripStateAndPropsRefs(code, { replaceWith: '_this.' });
205
+ return (0, strip_state_and_props_refs_1.stripStateAndPropsRefs)(code, { replaceWith: '_this.' });
206
206
  },
207
207
  })
208
- : null) + ",\n ";
208
+ : null, ",\n ");
209
209
  }
210
210
  str += '}';
211
211
  return str;
212
212
  }
213
- var componentToVue = function (component, options) {
213
+ var componentToVue = function (options) {
214
214
  if (options === void 0) { options = {}; }
215
- // Make a copy we can safely mutate, similar to babel's toolchain can be used
216
- component = fast_clone_1.fastClone(component);
217
- process_http_requests_1.processHttpRequests(component);
218
- processDynamicComponents(component, options);
219
- processForKeys(component, options);
220
- if (options.plugins) {
221
- component = plugins_1.runPreJsonPlugins(component, options.plugins);
222
- }
223
- map_refs_1.mapRefs(component, function (refName) { return "this.$refs." + refName; });
224
- if (options.plugins) {
225
- component = plugins_1.runPostJsonPlugins(component, options.plugins);
226
- }
227
- var css = collect_styles_1.collectCss(component, {
228
- prefix: options.cssNamespace,
229
- });
230
- var dataString = get_state_object_string_1.getStateObjectStringFromComponent(component, {
231
- data: true,
232
- functions: false,
233
- getters: false,
234
- });
235
- var getterString = get_state_object_string_1.getStateObjectStringFromComponent(component, {
236
- data: false,
237
- getters: true,
238
- functions: false,
239
- valueMapper: function (code) {
240
- return processBinding(code.replace(/^get /, ''), options, component);
241
- },
242
- });
243
- var functionsString = get_state_object_string_1.getStateObjectStringFromComponent(component, {
244
- data: false,
245
- getters: false,
246
- functions: true,
247
- valueMapper: function (code) { return processBinding(code, options, component); },
248
- });
249
- var blocksString = JSON.stringify(component.children);
250
- // Component references to include in `component: { YourComponent, ... }
251
- var componentsUsed = Array.from(get_components_used_1.getComponentsUsed(component))
252
- .filter(function (name) {
253
- return name.length && !name.includes('.') && name[0].toUpperCase() === name[0];
254
- })
255
- // Strip out components that compile away
256
- .filter(function (name) { return !['For', 'Show', 'Fragment', component.name].includes(name); });
257
- // Append refs to data as { foo, bar, etc }
258
- dataString = dataString.replace(/}$/, component.imports
259
- .map(function (thisImport) { return Object.keys(thisImport.imports).join(','); })
260
- // Make sure actually used in template
261
- .filter(function (key) { return Boolean(key && blocksString.includes(key)); })
262
- // Don't include component imports
263
- .filter(function (key) { return !componentsUsed.includes(key); })
264
- .join(',') + "}");
265
- var elementProps = get_props_1.getProps(component);
266
- strip_meta_properties_1.stripMetaProperties(component);
267
- var template = component.children
268
- .map(function (item) { return exports.blockToVue(item, options); })
269
- .join('\n');
270
- var includeClassMapHelper = template.includes('_classStringToObject');
271
- if (includeClassMapHelper) {
272
- functionsString = functionsString.replace(/}\s*$/, "_classStringToObject(str) {\n const obj = {};\n if (typeof str !== 'string') { return obj }\n const classNames = str.trim().split(/\\s+/); \n for (const name of classNames) {\n obj[name] = true;\n } \n return obj;\n } }");
273
- }
274
- var builderRegister = Boolean(options.builderRegister && component.meta.registerComponent);
275
- var str = dedent_1.default(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n <template>\n ", "\n </template>\n <script>\n ", "\n ", "\n\n export default ", "{\n ", "\n ", "\n ", "\n ", "\n\n ", "\n ", "\n\n ", "\n ", "\n\n ", "\n ", "\n }", "\n </script>\n ", "\n "], ["\n <template>\n ", "\n </template>\n <script>\n ", "\n ",
276
- "\n\n export default ", "{\n ",
277
- "\n ",
278
- "\n ",
279
- "\n ",
280
- "\n\n ",
281
- "\n ",
282
- "\n\n ",
283
- "\n ",
284
- "\n\n ",
285
- "\n ",
286
- "\n }",
287
- "\n </script>\n ",
288
- "\n "])), template, render_imports_1.renderPreComponent(component), !builderRegister
289
- ? ''
290
- : "import { registerComponent } from '@builder.io/sdk-vue'", !builderRegister ? '' : 'registerComponent(', !component.name
291
- ? ''
292
- : "name: '" + (options.namePrefix ? options.namePrefix + '-' : '') + lodash_1.kebabCase(component.name) + "',", !componentsUsed.length
293
- ? ''
294
- : "components: { " + componentsUsed
295
- .map(function (componentName) {
296
- return "'" + lodash_1.kebabCase(componentName) + "': async () => " + componentName;
215
+ // hack while we migrate all other transpilers to receive/handle path
216
+ // TO-DO: use `Transpiler` once possible
217
+ return function (_a) {
218
+ var _b, _c, _d, _e, _f;
219
+ var component = _a.component, path = _a.path;
220
+ // Make a copy we can safely mutate, similar to babel's toolchain can be used
221
+ component = (0, fast_clone_1.fastClone)(component);
222
+ (0, process_http_requests_1.processHttpRequests)(component);
223
+ processDynamicComponents(component, options);
224
+ processForKeys(component, options);
225
+ if (options.plugins) {
226
+ component = (0, plugins_1.runPreJsonPlugins)(component, options.plugins);
227
+ }
228
+ (0, map_refs_1.mapRefs)(component, function (refName) { return "this.$refs.".concat(refName); });
229
+ if (options.plugins) {
230
+ component = (0, plugins_1.runPostJsonPlugins)(component, options.plugins);
231
+ }
232
+ var css = (0, collect_styles_1.collectCss)(component, {
233
+ prefix: (_c = (_b = options.cssNamespace) === null || _b === void 0 ? void 0 : _b.call(options)) !== null && _c !== void 0 ? _c : undefined,
234
+ });
235
+ var dataString = (0, get_state_object_string_1.getStateObjectStringFromComponent)(component, {
236
+ data: true,
237
+ functions: false,
238
+ getters: false,
239
+ });
240
+ var getterString = (0, get_state_object_string_1.getStateObjectStringFromComponent)(component, {
241
+ data: false,
242
+ getters: true,
243
+ functions: false,
244
+ valueMapper: function (code) {
245
+ return processBinding(code.replace(/^get /, ''), options, component);
246
+ },
247
+ });
248
+ var functionsString = (0, get_state_object_string_1.getStateObjectStringFromComponent)(component, {
249
+ data: false,
250
+ getters: false,
251
+ functions: true,
252
+ valueMapper: function (code) { return processBinding(code, options, component); },
253
+ });
254
+ var blocksString = JSON.stringify(component.children);
255
+ // Component references to include in `component: { YourComponent, ... }
256
+ var componentsUsed = Array.from((0, get_components_used_1.getComponentsUsed)(component))
257
+ .filter(function (name) {
258
+ return name.length &&
259
+ !name.includes('.') &&
260
+ name[0].toUpperCase() === name[0];
297
261
  })
298
- .join(',') + " },", elementProps.size
299
- ? "props: " + JSON.stringify(Array.from(elementProps).filter(function (prop) { return prop !== 'children' && prop !== 'class'; })) + ","
300
- : '', dataString.length < 4
301
- ? ''
302
- : "\n data: () => (" + dataString + "),\n ", lodash_1.size(component.context.set)
303
- ? "provide() {\n const _this = this;\n return " + getContextProvideString(component, options) + "\n },"
304
- : '', lodash_1.size(component.context.get)
305
- ? "inject: " + getContextInjectString(component, options) + ","
306
- : '', component.hooks.onMount
307
- ? "mounted() {\n " + processBinding(component.hooks.onMount, options, component) + "\n },"
308
- : '', component.hooks.onUnMount
309
- ? "unmounted() {\n " + processBinding(component.hooks.onUnMount, options, component) + "\n },"
310
- : '', getterString.length < 4
311
- ? ''
312
- : "\n computed: " + getterString + ",\n ", functionsString.length < 4
313
- ? ''
314
- : "\n methods: " + functionsString + ",\n ", !builderRegister
315
- ? ''
316
- : ", " + json5_1.default.stringify(component.meta.registerComponent || {}) + ")", !css.trim().length
317
- ? ''
318
- : "<style scoped>\n " + css + "\n </style>");
319
- if (options.plugins) {
320
- str = plugins_1.runPreCodePlugins(str, options.plugins);
321
- }
322
- if (true || options.prettier !== false) {
323
- try {
324
- str = standalone_1.format(str, {
325
- parser: 'vue',
326
- plugins: [
327
- // To support running in browsers
328
- require('prettier/parser-html'),
329
- require('prettier/parser-postcss'),
330
- require('prettier/parser-babel'),
331
- ],
332
- });
262
+ // Strip out components that compile away
263
+ .filter(function (name) { return !['For', 'Show', 'Fragment', component.name].includes(name); });
264
+ // Append refs to data as { foo, bar, etc }
265
+ dataString = dataString.replace(/}$/, "".concat(component.imports
266
+ .map(function (thisImport) { return Object.keys(thisImport.imports).join(','); })
267
+ // Make sure actually used in template
268
+ .filter(function (key) { return Boolean(key && blocksString.includes(key)); })
269
+ // Don't include component imports
270
+ .filter(function (key) { return !componentsUsed.includes(key); })
271
+ .join(','), "}"));
272
+ var elementProps = (0, get_props_1.getProps)(component);
273
+ (0, strip_meta_properties_1.stripMetaProperties)(component);
274
+ var template = component.children
275
+ .map(function (item) { return (0, exports.blockToVue)(item, options); })
276
+ .join('\n');
277
+ var includeClassMapHelper = template.includes('_classStringToObject');
278
+ if (includeClassMapHelper) {
279
+ functionsString = functionsString.replace(/}\s*$/, "_classStringToObject(str) {\n const obj = {};\n if (typeof str !== 'string') { return obj }\n const classNames = str.trim().split(/\\s+/); \n for (const name of classNames) {\n obj[name] = true;\n } \n return obj;\n } }");
333
280
  }
334
- catch (err) {
335
- console.warn('Could not prettify', { string: str }, err);
281
+ var builderRegister = Boolean(options.builderRegister && component.meta.registerComponent);
282
+ var str = (0, dedent_1.default)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n <template>\n ", "\n </template>\n <script>\n ", "\n ", "\n\n export default ", "{\n ", "\n ", "\n ", "\n ", "\n\n ", "\n ", "\n\n ", "\n ", "\n\n ", "\n ", "\n }", "\n </script>\n ", "\n "], ["\n <template>\n ", "\n </template>\n <script>\n ", "\n ", "\n\n export default ", "{\n ", "\n ", "\n ", "\n ", "\n\n ", "\n ", "\n\n ", "\n ", "\n\n ", "\n ", "\n }", "\n </script>\n ", "\n "])), template, (0, render_imports_1.renderPreComponent)(component), component.meta.registerComponent
283
+ ? (_d = options.registerComponentPrepend) !== null && _d !== void 0 ? _d : ''
284
+ : '', !builderRegister ? '' : 'registerComponent(', !component.name
285
+ ? ''
286
+ : "name: '".concat(((_e = options.namePrefix) === null || _e === void 0 ? void 0 : _e.call(options, path))
287
+ ? ((_f = options.namePrefix) === null || _f === void 0 ? void 0 : _f.call(options, path)) + '-'
288
+ : '').concat((0, lodash_1.kebabCase)(component.name), "',"), !componentsUsed.length
289
+ ? ''
290
+ : "components: { ".concat(componentsUsed
291
+ .map(function (componentName) {
292
+ return "'".concat((0, lodash_1.kebabCase)(componentName), "': async () => ").concat(componentName);
293
+ })
294
+ .join(','), " },"), elementProps.size
295
+ ? "props: ".concat(JSON.stringify(Array.from(elementProps).filter(function (prop) { return prop !== 'children' && prop !== 'class'; })), ",")
296
+ : '', dataString.length < 4
297
+ ? ''
298
+ : "\n data: () => (".concat(dataString, "),\n "), (0, lodash_1.size)(component.context.set)
299
+ ? "provide() {\n const _this = this;\n return ".concat(getContextProvideString(component, options), "\n },")
300
+ : '', (0, lodash_1.size)(component.context.get)
301
+ ? "inject: ".concat(getContextInjectString(component, options), ",")
302
+ : '', component.hooks.onMount
303
+ ? "mounted() {\n ".concat(processBinding(component.hooks.onMount, options, component), "\n },")
304
+ : '', component.hooks.onUnMount
305
+ ? "unmounted() {\n ".concat(processBinding(component.hooks.onUnMount, options, component), "\n },")
306
+ : '', getterString.length < 4
307
+ ? ''
308
+ : "\n computed: ".concat(getterString, ",\n "), functionsString.length < 4
309
+ ? ''
310
+ : "\n methods: ".concat(functionsString, ",\n "), !builderRegister
311
+ ? ''
312
+ : ", ".concat(json5_1.default.stringify(component.meta.registerComponent || {}), ")"), !css.trim().length
313
+ ? ''
314
+ : "<style scoped>\n ".concat(css, "\n </style>"));
315
+ if (options.plugins) {
316
+ str = (0, plugins_1.runPreCodePlugins)(str, options.plugins);
336
317
  }
337
- }
338
- if (options.plugins) {
339
- str = plugins_1.runPostCodePlugins(str, options.plugins);
340
- }
341
- for (var _i = 0, removePatterns_1 = removePatterns; _i < removePatterns_1.length; _i++) {
342
- var pattern = removePatterns_1[_i];
343
- str = str.replace(pattern, '');
344
- }
345
- return str;
318
+ if (true || options.prettier !== false) {
319
+ try {
320
+ str = (0, standalone_1.format)(str, {
321
+ parser: 'vue',
322
+ plugins: [
323
+ // To support running in browsers
324
+ require('prettier/parser-html'),
325
+ require('prettier/parser-postcss'),
326
+ require('prettier/parser-babel'),
327
+ ],
328
+ });
329
+ }
330
+ catch (err) {
331
+ console.warn('Could not prettify', { string: str }, err);
332
+ }
333
+ }
334
+ if (options.plugins) {
335
+ str = (0, plugins_1.runPostCodePlugins)(str, options.plugins);
336
+ }
337
+ for (var _i = 0, removePatterns_1 = removePatterns; _i < removePatterns_1.length; _i++) {
338
+ var pattern = removePatterns_1[_i];
339
+ str = str.replace(pattern, '');
340
+ }
341
+ // Transform <FooBar> to <foo-bar> as Vue2 needs
342
+ return str.replace(/<\/?\w+/g, function (match) {
343
+ return match.replace(/([a-z])([A-Z])/g, '$1-$2').toLowerCase();
344
+ });
345
+ };
346
346
  };
347
347
  exports.componentToVue = componentToVue;
348
348
  // Remove unused artifacts like empty script or style tags
@@ -37,7 +37,7 @@ var babelTransform = function (code, visitor) {
37
37
  exports.babelTransform = babelTransform;
38
38
  var babelTransformCode = function (code, visitor) {
39
39
  var _a;
40
- return ((_a = exports.babelTransform(code, visitor)) === null || _a === void 0 ? void 0 : _a.code) || '';
40
+ return ((_a = (0, exports.babelTransform)(code, visitor)) === null || _a === void 0 ? void 0 : _a.code) || '';
41
41
  };
42
42
  exports.babelTransformCode = babelTransformCode;
43
43
  var babelTransformExpression = function (code, visitor, type) {
@@ -59,13 +59,13 @@ var babelTransformExpression = function (code, visitor, type) {
59
59
  }
60
60
  var useCode = code;
61
61
  if (type === 'functionBody') {
62
- useCode = "function(){" + useCode + "}";
62
+ useCode = "function(){".concat(useCode, "}");
63
63
  }
64
64
  var result = type === 'expression'
65
65
  ? null
66
- : lodash_1.attempt(function () {
66
+ : (0, lodash_1.attempt)(function () {
67
67
  var _a;
68
- var result = ((_a = exports.babelTransform(useCode, visitor)) === null || _a === void 0 ? void 0 : _a.code) || '';
68
+ var result = ((_a = (0, exports.babelTransform)(useCode, visitor)) === null || _a === void 0 ? void 0 : _a.code) || '';
69
69
  if (type === 'functionBody') {
70
70
  return result.replace(/^function\(\)\{/, '').replace(/\};$/, '');
71
71
  }
@@ -76,7 +76,7 @@ var babelTransformExpression = function (code, visitor, type) {
76
76
  return result.replace(/;$/, '');
77
77
  }
78
78
  });
79
- if (lodash_1.isError(result) || type === 'expression') {
79
+ if ((0, lodash_1.isError)(result) || type === 'expression') {
80
80
  try {
81
81
  // If it can't, e.g. this is an expression or code fragment, modify the code below and try again
82
82
  // Detect method fragments. These get passed sometimes and otherwise
@@ -84,13 +84,13 @@ var babelTransformExpression = function (code, visitor, type) {
84
84
  var isMethod = Boolean(!code.startsWith('function') &&
85
85
  code.match(/^[a-z0-9]+\s*\([^\)]*\)\s*[\{:]/i));
86
86
  if (isMethod) {
87
- useCode = "function " + useCode;
87
+ useCode = "function ".concat(useCode);
88
88
  }
89
89
  // Parse the code as an expression (instead of the default, a block) by giving it a fake variable assignment
90
90
  // e.g. if the code parsed is { ... } babel will treat that as a block by deafult, unless processed as an expression
91
91
  // that is an object
92
- useCode = "let _ = " + useCode;
93
- result = (((_a = exports.babelTransform(useCode, visitor)) === null || _a === void 0 ? void 0 : _a.code) || '')
92
+ useCode = "let _ = ".concat(useCode);
93
+ result = (((_a = (0, exports.babelTransform)(useCode, visitor)) === null || _a === void 0 ? void 0 : _a.code) || '')
94
94
  // Babel addes trailing semicolons, but for expressions we need those gone
95
95
  .replace(/;$/, '')
96
96
  // Remove our fake variable assignment
@@ -102,7 +102,7 @@ var babelTransformExpression = function (code, visitor, type) {
102
102
  catch (err) {
103
103
  console.error('Error parsing code:\n', code, '\n', result);
104
104
  try {
105
- return exports.babelTransformExpression(code, visitor, 'functionBody');
105
+ return (0, exports.babelTransformExpression)(code, visitor, 'functionBody');
106
106
  }
107
107
  catch (err) {
108
108
  throw err;