@builder.io/mitosis
Version:
Write components once, run everywhere. Compiles to Vue, React, Solid, and Liquid. Import code from Figma and Builder.io
61 lines (60 loc) • 3.35 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.getCodeProcessorPlugins = void 0;
const html_tags_1 = require("../../../../constants/html_tags");
const helpers_1 = require("../../../../generators/angular/helpers");
const get_refs_1 = require("../../../../helpers/get-refs");
const process_code_1 = require("../../../../helpers/plugins/process-code");
const replace_identifiers_1 = require("../../../../helpers/replace-identifiers");
const function_1 = require("fp-ts/function");
const getCodeProcessorPlugins = ({ json, contextVars, options, outputVars, }) => {
return [
...(options.plugins || []),
(0, process_code_1.CODE_PROCESSOR_PLUGIN)((codeType, _, node) => {
switch (codeType) {
case 'hooks':
return (0, function_1.flow)((0, helpers_1.processAngularCode)({
replaceWith: 'this',
contextVars,
outputVars,
domRefs: Array.from((0, get_refs_1.getRefs)(json)),
}), (code) => {
const allMethodNames = Object.entries(json.state)
.filter(([_, value]) => (value === null || value === void 0 ? void 0 : value.type) === 'function' || (value === null || value === void 0 ? void 0 : value.type) === 'method')
.map(([key]) => key);
return (0, replace_identifiers_1.replaceIdentifiers)({
code,
from: allMethodNames,
to: (name) => `this.${name}`,
});
});
case 'bindings':
return (code, key) => {
var _a;
// we create a separate state property for spread binding and use ref to attach the attributes
// so we need to use `this.` inside the class to access state and props
const isSpreadAttributeBinding = ((_a = node === null || node === void 0 ? void 0 : node.bindings[key]) === null || _a === void 0 ? void 0 : _a.type) === 'spread' && html_tags_1.VALID_HTML_TAGS.includes(node.name.trim());
// If we have a For loop with "key" it will be transformed to
// trackOfXXX, we need to use "this" for state properties
const isKey = key === 'key';
const newLocal = (0, helpers_1.processAngularCode)({
contextVars: [],
outputVars,
domRefs: [], // the template doesn't need the this keyword.
replaceWith: isKey || isSpreadAttributeBinding ? 'this' : undefined,
})(code);
return newLocal.replace(/"/g, '"');
};
case 'hooks-deps':
case 'hooks-deps-array':
case 'state':
case 'context-set':
case 'properties':
case 'dynamic-jsx-elements':
case 'types':
return (code) => code;
}
}),
];
};
exports.getCodeProcessorPlugins = getCodeProcessorPlugins;