@taiga-ui/cdk
Version:
Base library for creating Angular components and applications using Taiga UI principles regarding of actual visual appearance
104 lines • 5.27 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.migrateAvatarToDirective = migrateAvatarToDirective;
const elements_1 = require("../../../../utils/templates/elements");
const inputs_1 = require("../../../../utils/templates/inputs");
const template_resource_1 = require("../../../../utils/templates/template-resource");
const remove_attrs_1 = require("../../../utils/remove-attrs");
const replace_tag_1 = require("../../../utils/templates/replace-tag");
function migrateAvatarToDirective({ resource, recorder, fileSystem, }) {
const template = (0, template_resource_1.getTemplateFromTemplateResource)(resource, fileSystem);
const templateOffset = (0, template_resource_1.getTemplateOffset)(resource);
const avatarElements = (0, elements_1.findElementsByTagName)(template, 'tui-avatar');
const elementsWithAvatarAttribute = (0, elements_1.findElementsWithAttribute)(template, 'tuiAvatar');
const elementsWithBoundAvatarAttribute = (0, elements_1.findElementsWithAttribute)(template, '[tuiAvatar]');
elementsWithBoundAvatarAttribute.forEach((element) => {
const loc = element.sourceCodeLocation;
if (!(loc === null || loc === void 0 ? void 0 : loc.startTag)) {
return;
}
const tuiAvatarAttr = element.attrs.find((a) => a.name === '[tuiAvatar]'.toLowerCase());
const fallbackBinding = getFallbackBinding(tuiAvatarAttr === null || tuiAvatarAttr === void 0 ? void 0 : tuiAvatarAttr.value);
if (!tuiAvatarAttr || !fallbackBinding) {
return;
}
replaceAttribute(recorder, tuiAvatarAttr.name, `tuiAvatar="${fallbackBinding.fallback}"`, loc, templateOffset);
recorder.insertRight(templateOffset + loc.startTag.endOffset, `<img [src]="${fallbackBinding.source}" />`);
});
elementsWithAvatarAttribute.forEach((element) => {
var _a;
const loc = element.sourceCodeLocation;
if (!(loc === null || loc === void 0 ? void 0 : loc.startTag)) {
return;
}
const srcAttr = getSrcAttr(element.attrs);
const tuiAvatarAttr = (0, inputs_1.findAttr)(element.attrs, 'tuiAvatar');
if (!srcAttr || (tuiAvatarAttr === null || tuiAvatarAttr === void 0 ? void 0 : tuiAvatarAttr.value)) {
return;
}
replaceAttribute(recorder, (_a = tuiAvatarAttr === null || tuiAvatarAttr === void 0 ? void 0 : tuiAvatarAttr.name) !== null && _a !== void 0 ? _a : 'tuiAvatar', getAvatarAttr(srcAttr), loc, templateOffset);
(0, remove_attrs_1.removeAttrs)([srcAttr], loc, recorder, templateOffset);
});
avatarElements.forEach((element) => {
const loc = element.sourceCodeLocation;
if (!(loc === null || loc === void 0 ? void 0 : loc.startTag)) {
return;
}
const srcAttr = getSrcAttr(element.attrs);
const hasAvatarAttr = hasTuiAvatarAttr(element.attrs);
const attrToAdd = hasAvatarAttr ? null : getAvatarAttr(srcAttr);
(0, replace_tag_1.replaceTag)(recorder, loc, 'tui-avatar', 'span', template, templateOffset, attrToAdd ? [attrToAdd] : []);
if (srcAttr) {
(0, remove_attrs_1.removeAttrs)([srcAttr], loc, recorder, templateOffset);
}
});
}
function replaceAttribute(recorder, attrName, attrToAdd, loc, templateOffset) {
var _a;
const attrOffset = (_a = loc.attrs) === null || _a === void 0 ? void 0 : _a[attrName];
if (!attrOffset) {
return;
}
const { startOffset, endOffset } = attrOffset;
recorder.remove(templateOffset + startOffset - 1, endOffset - startOffset + 1);
recorder.insertRight(templateOffset + startOffset - 1, ` ${attrToAdd}`);
}
function hasTuiAvatarAttr(attrs) {
return attrs.some(({ name }) => ['[(tuiAvatar)]', '[tuiAvatar]', 'tuiAvatar']
.map((attr) => attr.toLowerCase())
.includes(name));
}
function getSrcAttr(attrs) {
var _a, _b;
return ((_b = (_a = (0, inputs_1.findAttr)(attrs, 'src')) !== null && _a !== void 0 ? _a : attrs.find((a) => a.name === '[(src)]')) !== null && _b !== void 0 ? _b : attrs.find((a) => a.name === '[src]'));
}
function getAvatarAttr(attr) {
var _a;
if (!attr) {
return 'tuiAvatar';
}
const map = {
src: (value) => (value ? `tuiAvatar="${value}"` : 'tuiAvatar'),
'[src]': (value) => (value ? `[tuiAvatar]="${value}"` : '[tuiAvatar]'),
'[(src)]': (value) => (value ? `[(tuiAvatar)]="${value}"` : '[(tuiAvatar)]'),
};
const mapper = map[attr.name];
return (_a = mapper === null || mapper === void 0 ? void 0 : mapper(attr.value)) !== null && _a !== void 0 ? _a : 'tuiAvatar';
}
function getFallbackBinding(value) {
var _a;
if (!value) {
return null;
}
const fallbackRegExp = /^([^|]*\S)\s*\|\s*tuiFallbackSrc\s*:\s*(['"])([^'"]+)\2(?:\s*\|\s*async)?\s*$/;
const match = fallbackRegExp.exec(value);
if (!match) {
return null;
}
const [, source, , fallback] = match;
return {
source: (_a = source === null || source === void 0 ? void 0 : source.trim()) !== null && _a !== void 0 ? _a : '',
fallback: fallback !== null && fallback !== void 0 ? fallback : '',
};
}
//# sourceMappingURL=migrate-avatar.js.map