@taiga-ui/cdk
Version:
Base library for creating Angular components and applications using Taiga UI principles regarding of actual visual appearance
123 lines • 5.42 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.CUSTOM_CONTENT_ATTRS = void 0;
exports.findCustomContentAttr = findCustomContentAttr;
exports.findCustomContentAttrName = findCustomContentAttrName;
exports.registerCustomContentImports = registerCustomContentImports;
exports.buildCustomContentIconStr = buildCustomContentIconStr;
exports.migrateLegacyCustomContent = migrateLegacyCustomContent;
const add_import_to_closest_module_1 = require("../../../../utils/add-import-to-closest-module");
const elements_1 = require("../../../../utils/templates/elements");
const template_resource_1 = require("../../../../utils/templates/template-resource");
exports.CUSTOM_CONTENT_ATTRS = new Set([
'[tuiTextfieldCustomContent]'.toLowerCase(),
'tuiTextfieldCustomContent'.toLowerCase(),
]);
/**
* Legacy controls that support `tuiTextfieldCustomContent`. `tui-input` and
* `tui-textarea` are excluded because their own migrations perform a full
* element rewrite and handle the attribute inline.
*/
const TARGET_TAGS = new Set([
'tui-combo-box',
'tui-input-date',
'tui-input-date-multi',
'tui-input-date-range',
'tui-input-month',
'tui-input-password',
'tui-input-phone',
'tui-input-phone-international',
'tui-input-tag',
'tui-input-time',
'tui-input-year',
'tui-multi-select',
'tui-select',
]);
function findCustomContentAttr(element) {
const attr = element.attrs.find((a) => exports.CUSTOM_CONTENT_ATTRS.has(a.name.toLowerCase()));
return attr
? {
value: attr.value,
isBinding: attr.name.toLowerCase().startsWith('['),
}
: null;
}
function findCustomContentAttrName(element) {
var _a, _b;
return ((_b = (_a = element.attrs.find((a) => exports.CUSTOM_CONTENT_ATTRS.has(a.name.toLowerCase()))) === null || _a === void 0 ? void 0 : _a.name) !== null && _b !== void 0 ? _b : null);
}
function registerCustomContentImports(resource, elements) {
const attrs = elements
.map(findCustomContentAttr)
.filter((x) => !!x);
if (attrs.length === 0) {
return;
}
(0, add_import_to_closest_module_1.addImportToClosestModule)(resource.componentPath, 'TuiIcon', '@taiga-ui/core');
if (attrs.some((a) => a.isBinding)) {
(0, add_import_to_closest_module_1.addImportToClosestModule)(resource.componentPath, 'PolymorpheusOutlet', '@taiga-ui/polymorpheus');
}
}
function buildCustomContentIconStr(customContent, indent) {
if (!customContent) {
return '';
}
return customContent.isBinding
? [
'',
`${indent}<tui-icon`,
`${indent} *polymorpheusOutlet="${customContent.value} as src"`,
`${indent} [icon]="src"`,
`${indent}/>`,
].join('\n')
: `\n${indent}<tui-icon icon="${customContent.value}" />`;
}
function migrateLegacyCustomContent({ resource, recorder, fileSystem, }) {
const template = (0, template_resource_1.getTemplateFromTemplateResource)(resource, fileSystem);
const templateOffset = (0, template_resource_1.getTemplateOffset)(resource);
const elements = (0, elements_1.findElementsInTemplateByFn)(template, (el) => TARGET_TAGS.has(el.tagName) && !!findCustomContentAttr(el));
if (elements.length === 0) {
return;
}
registerCustomContentImports(resource, elements);
elements.forEach((element) => {
const customContent = findCustomContentAttr(element);
if (!customContent) {
return;
}
removeCustomContentAttr(element, recorder, templateOffset, template);
insertIconBeforeEndTag(element, customContent, recorder, templateOffset, template);
});
}
function removeCustomContentAttr(element, recorder, templateOffset, template) {
var _a, _b;
const attrName = findCustomContentAttrName(element);
if (!attrName) {
return;
}
const loc = (_b = (_a = element.sourceCodeLocation) === null || _a === void 0 ? void 0 : _a.attrs) === null || _b === void 0 ? void 0 : _b[attrName.toLowerCase()];
if (!loc) {
return;
}
const lineStart = template.lastIndexOf('\n', loc.startOffset) + 1;
const lineEnd = template.indexOf('\n', loc.endOffset);
const attrText = template.slice(loc.startOffset, loc.endOffset);
const lineText = lineEnd === -1 ? '' : template.slice(lineStart, lineEnd);
if (lineText.trim() === attrText.trim() && lineEnd !== -1) {
recorder.remove(templateOffset + lineStart, lineEnd - lineStart + 1);
return;
}
recorder.remove(templateOffset + loc.startOffset - 1, loc.endOffset - loc.startOffset + 1);
}
function insertIconBeforeEndTag(element, customContent, recorder, templateOffset, template) {
var _a, _b, _c;
const endTag = (_a = element.sourceCodeLocation) === null || _a === void 0 ? void 0 : _a.endTag;
if (!endTag) {
return;
}
const lineStart = template.lastIndexOf('\n', endTag.startOffset) + 1;
const indent = (_c = (_b = /^[ \t]*/.exec(template.slice(lineStart, endTag.startOffset))) === null || _b === void 0 ? void 0 : _b[0]) !== null && _c !== void 0 ? _c : '';
const iconStr = buildCustomContentIconStr(customContent, indent);
recorder.insertRight(templateOffset + endTag.startOffset, `${iconStr.trimStart()}\n${indent}`);
}
//# sourceMappingURL=migrate-legacy-custom-content.js.map