@taiga-ui/cdk/schematics/ng-update/v5/steps/templates/migrate-input-date.js

Base library for creating Angular components and applications using Taiga UI principles regarding of actual visual appearance

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.migrateInputDate = migrateInputDate;
const insert_todo_1 = require("../../../../utils/insert-todo");
const elements_1 = require("../../../../utils/templates/elements");
const template_resource_1 = require("../../../../utils/templates/template-resource");
const control_state_attrs_1 = require("../../../utils/templates/control-state-attrs");
const remove_attr_1 = require("../../../utils/templates/remove-attr");
const replace_tag_1 = require("../../../utils/templates/replace-tag");
const DOCS_LINK = 'https://taiga-ui.dev/components/input-date';
const INPUT_ATTRS = new Set([
    '[max]'.toLowerCase(),
    '[min]'.toLowerCase(),
    'max'.toLowerCase(),
    'min'.toLowerCase(),
]);
const CALENDAR_ATTR_RENAMES = new Map([
    ['[defaultActiveYearMonth]'.toLowerCase(), '[month]'],
    ['[disabledItemHandler]'.toLowerCase(), '[disabledItemHandler]'],
    ['[markerHandler]'.toLowerCase(), '[markerHandler]'],
    ['defaultActiveYearMonth'.toLowerCase(), 'month'],
]);
const NO_EQUIVALENT_ATTRS = new Set(['[items]'.toLowerCase()]);
function migrateInputDate({ 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.findElementsByTagName)(template, 'tui-input-date');
    elements.forEach((element) => {
        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
        // Skip `multiple` — handled by migrateInputDateMulti
        if (element.attrs.some((attr) => attr.name === 'multiple')) {
            return;
        }
        const sourceCodeLocation = element.sourceCodeLocation;
        (0, replace_tag_1.replaceTag)(recorder, sourceCodeLocation, 'tui-input-date', 'tui-textfield', template, templateOffset);
        const { value: labelOutside, isBinding: labelOutsideIsBinding } = (0, remove_attr_1.removeAttr)(element, 'tuiTextfieldLabelOutside', recorder, templateOffset);
        const isLabelOutsideTrue = labelOutside === 'true' || (!labelOutsideIsBinding && labelOutside === '');
        const isDynamic = labelOutside !== null && !isLabelOutsideTrue && labelOutside !== 'false';
        const controlAttrs = [...element.attrs].filter((attr) => /formcontrol|ngmodel/.exec(attr.name.toLocaleLowerCase()));
        const inputAttrs = [...element.attrs].filter((attr) => INPUT_ATTRS.has(attr.name.toLowerCase()));
        const calendarAttrs = [...element.attrs].filter((attr) => CALENDAR_ATTR_RENAMES.has(attr.name.toLowerCase()));
        const noEquivalentAttrs = [...element.attrs].filter((attr) => NO_EQUIVALENT_ATTRS.has(attr.name.toLowerCase()));
        const controlStateAttrs = (0, control_state_attrs_1.getControlStateAttrs)(element);
        for (const attr of [
            ...controlAttrs,
            ...inputAttrs,
            ...calendarAttrs,
            ...noEquivalentAttrs,
        ]) {
            const { startOffset = 0, endOffset = 0 } = (_c = (_b = (_a = element.sourceCodeLocation) === null || _a === void 0 ? void 0 : _a.attrs) === null || _b === void 0 ? void 0 : _b[attr.name]) !== null && _c !== void 0 ? _c : {};
            recorder.remove(templateOffset + startOffset, endOffset - startOffset);
        }
        (0, control_state_attrs_1.removeControlStateAttrs)(recorder, templateOffset, element, template, controlStateAttrs);
        const labelIndex = element.childNodes.findIndex((node) => node.nodeName === '#text' && (node === null || node === void 0 ? void 0 : node.value.trim()));
        let placeholderAttr = '';
        if (labelIndex !== -1) {
            const labelNode = element.childNodes[labelIndex];
            const labelText = labelNode.value.trim();
            const labelTextStart = ((_e = (_d = labelNode === null || labelNode === void 0 ? void 0 : labelNode.sourceCodeLocation) === null || _d === void 0 ? void 0 : _d.startOffset) !== null && _e !== void 0 ? _e : 0) + templateOffset;
            const labelTextEnd = ((_g = (_f = labelNode === null || labelNode === void 0 ? void 0 : labelNode.sourceCodeLocation) === null || _f === void 0 ? void 0 : _f.endOffset) !== null && _g !== void 0 ? _g : 0) + templateOffset;
            if (isLabelOutsideTrue) {
                recorder.remove(labelTextStart, labelTextEnd - labelTextStart);
                placeholderAttr = ` placeholder="${labelText}"`;
            }
            else if (!isDynamic) {
                recorder.insertRight(labelTextStart, '\n<label tuiLabel>');
                recorder.insertRight(labelTextEnd, '</label>\n');
            }
        }
        if (isDynamic) {
            const insertAt = ((_h = sourceCodeLocation === null || sourceCodeLocation === void 0 ? void 0 : sourceCodeLocation.startOffset) !== null && _h !== void 0 ? _h : 0) + templateOffset;
            recorder.insertLeft(insertAt, `<!-- ${insert_todo_1.TODO_MARK} [tuiTextfieldLabelOutside] is dynamic — cannot be migrated automatically. Use <label tuiLabel> inside <tui-textfield> for label-outside pattern.\n-->\n`);
        }
        if (noEquivalentAttrs.length > 0) {
            const todoComment = [
                `<!-- ${insert_todo_1.TODO_MARK} tui-input-date migration (see ${DOCS_LINK}):`,
                '     - [items]: TuiNamedDay type is removed in v5. Use <datalist> + <section *tuiDropdown>',
                `       for named dates. See example: ${DOCS_LINK}#datalist -->`,
            ].join('\n');
            const insertAt = ((_j = sourceCodeLocation === null || sourceCodeLocation === void 0 ? void 0 : sourceCodeLocation.startOffset) !== null && _j !== void 0 ? _j : 0) + templateOffset;
            recorder.insertLeft(insertAt, `${todoComment}\n`);
        }
        const insertOffset = ((_l = (_k = sourceCodeLocation === null || sourceCodeLocation === void 0 ? void 0 : sourceCodeLocation.endTag) === null || _k === void 0 ? void 0 : _k.startOffset) !== null && _l !== void 0 ? _l : 0) + templateOffset;
        const inputs = element.childNodes.filter((node) => node.nodeName === 'input');
        const baseAttrs = [...controlAttrs, ...inputAttrs].reduce((result, attr) => {
            const name = normalizeAttrName(attr.name);
            return attr.value ? `${result} ${name}="${attr.value}"` : `${result} ${name}`;
        }, '');
        const migrationAttrs = `${baseAttrs}${(0, control_state_attrs_1.stringifyControlStateAttrs)(controlStateAttrs)}`;
        const calendarAttrStr = calendarAttrs.reduce((result, attr) => {
            var _a;
            const name = (_a = CALENDAR_ATTR_RENAMES.get(attr.name.toLowerCase())) !== null && _a !== void 0 ? _a : attr.name;
            return attr.value ? `${result} ${name}="${attr.value}"` : `${result} ${name}`;
        }, '');
        if (inputs.length) {
            recorder.insertRight(insertOffset, `\n<tui-calendar *tuiDropdown${calendarAttrStr} />\n`);
        }
        else {
            recorder.insertRight(insertOffset, `\n<input tuiInputDate${migrationAttrs}${placeholderAttr} />\n<tui-calendar *tuiDropdown${calendarAttrStr} />\n`);
        }
        for (const input of inputs) {
            input.attrs.forEach((attr) => {
                var _a, _b, _c;
                if (/^tuiTextfield$|^tuiTextfieldLegacy$/i.exec(attr.name)) {
                    const { startOffset = 0, endOffset = 0 } = (_c = (_b = (_a = input.sourceCodeLocation) === null || _a === void 0 ? void 0 : _a.attrs) === null || _b === void 0 ? void 0 : _b[attr.name]) !== null && _c !== void 0 ? _c : {};
                    recorder.remove(templateOffset + startOffset, endOffset - startOffset);
                    recorder.insertRight(templateOffset + startOffset, `tuiInputDate${migrationAttrs}${placeholderAttr}`);
                }
            });
        }
    });
}
function normalizeAttrName(name) {
    switch (name.toLowerCase()) {
        case '[formControl]'.toLowerCase():
            return '[formControl]';
        case '[max]'.toLowerCase():
            return '[max]';
        case '[min]'.toLowerCase():
            return '[min]';
        case '[ngModel]'.toLowerCase():
            return '[ngModel]';
        case 'formControl'.toLowerCase():
            return 'formControl';
        case 'formControlName'.toLowerCase():
            return 'formControlName';
        case 'ngModel'.toLowerCase():
            return 'ngModel';
        case '[(ngmodel)]':
            return '[(ngModel)]';
        default:
            return name;
    }
}
//# sourceMappingURL=migrate-input-date.js.map