@taiga-ui/cdk 4.0.0-alpha.0 → 4.0.0-rc.10

package/schematics/ng-update/v4/steps/styles/migrate-scrollbar-behavior.d.ts

@@ -0,0 +1 @@
+export declare function migrateScrollbarBehavior(fileContent: string): string;

package/schematics/ng-update/v4/steps/styles/migrate-scrollbar-behavior.js

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.migrateScrollbarBehavior = void 0;
+function migrateScrollbarBehavior(fileContent) {
+    if (!fileContent.includes('@taiga-ui/core/styles/taiga-ui-local')) {
+        return fileContent;
+    }
+    return fileContent.replaceAll('.scroll-behavior()', 'scroll-behavior: var(--tui-scroll-behavior)');
+}
+exports.migrateScrollbarBehavior = migrateScrollbarBehavior;

package/schematics/ng-update/v4/steps/styles/migrate-shadow-mixins.d.ts

@@ -0,0 +1 @@
+export declare function migrateShadowMixins(fileContent: string): string;

package/schematics/ng-update/v4/steps/styles/migrate-shadow-mixins.js

@@ -0,0 +1,23 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.migrateShadowMixins = void 0;
+const MAPPING = {
+    'shadow()': 'var(--tui-shadow-small)',
+    'shadow(1)': 'var(--tui-shadow-small)',
+    'shadow(2)': 'var(--tui-shadow-medium)',
+    'shadow(3)': 'var(--tui-shadow-popup)',
+    'shadow(4)': 'var(--tui-shadow-medium)',
+    'shadow(5)': 'var(--tui-shadow-small-hover)',
+    'shadow(6)': 'var(--tui-shadow-small)',
+    'shadow(7)': 'var(--tui-shadow-popup)',
+};
+// .shadow(2);
+// @include shadow(2);
+const MIXIN_RE = /(?:@include\s|\.)(shadow\(\d*\))(\s?!important)?;/g;
+function migrateShadowMixins(fileContent) {
+    if (!fileContent.includes('@taiga-ui/core/styles/taiga-ui-local')) {
+        return fileContent;
+    }
+    return fileContent.replaceAll(MIXIN_RE, (_, mixin, important = '') => `box-shadow: ${MAPPING[mixin]}${important};`);
+}
+exports.migrateShadowMixins = migrateShadowMixins;

package/schematics/ng-update/v4/steps/styles/migrate-space-mixins.d.ts

@@ -0,0 +1 @@
+export declare function migrateSpaceMixins(fileContent: string): string;

package/schematics/ng-update/v4/steps/styles/migrate-space-mixins.js

@@ -0,0 +1,20 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.migrateSpaceMixins = void 0;
+const DIRECTION_MAPPING = {
+    all: ['margin'],
+    top: ['margin-top'],
+    bottom: ['margin-bottom'],
+    left: ['margin-left'],
+    right: ['margin-right'],
+    vertical: ['margin-top', 'margin-bottom'],
+    horizontal: ['margin-left', 'margin-right'],
+};
+const SPACE = 0.25;
+// .tui-space(top, 4);
+// @include tui-space(top, 4);
+const MIXIN_RE = new RegExp(`(?:@include\\s|\\.)tui-space\\((?<direction>${Object.keys(DIRECTION_MAPPING).join('|')}),\\s?(?<size>-?\\d+)\\)(\\s?!important)?;`, 'g');
+function migrateSpaceMixins(fileContent) {
+    return fileContent.replaceAll(MIXIN_RE, (_, direction, size, important = '') => `${DIRECTION_MAPPING[direction].map((property) => `${property}: ${Number(size) * SPACE}rem${important};`).join('\n')}`);
+}
+exports.migrateSpaceMixins = migrateSpaceMixins;

package/schematics/ng-update/v4/steps/styles/migrate-text-mixins.d.ts

@@ -0,0 +1 @@
+export declare function migrateTextMixins(fileContent: string): string;

package/schematics/ng-update/v4/steps/styles/migrate-text-mixins.js

@@ -0,0 +1,54 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.migrateTextMixins = void 0;
+const MAPPING = {
+    'text-h1': ['font: var(--tui-font-heading-1)'],
+    'text-h2': ['font: var(--tui-font-heading-2)'],
+    'text-h3': ['font: var(--tui-font-heading-3)'],
+    'text-h4': ['font: var(--tui-font-heading-4)'],
+    'text-h5': ['font: var(--tui-font-heading-5)'],
+    'text-h6': ['font: var(--tui-font-heading-6)'],
+    'text-body-xl-bold': ['font: var(--tui-font-text-xl)', 'font-weight: bold'],
+    'text-body-xl': ['font: var(--tui-font-text-xl)'],
+    'text-body-xs': ['font: var(--tui-font-text-xs)'],
+    'text-caption-l-bold': [
+        'font-size: 0.8125rem',
+        'font-weight: bold',
+        'font-family: var(--tui-font-text)',
+        'letter-spacing: 0.0625rem',
+        'text-transform: uppercase',
+    ],
+    'text-caption-l': [
+        'font-size: 0.8125rem',
+        'font-weight: normal',
+        'font-family: var(--tui-font-text)',
+        'letter-spacing: 0.0625rem',
+        'text-transform: uppercase',
+    ],
+    'text-caption-bold': [
+        'font-size: 0.6875rem',
+        'font-weight: bold',
+        'font-family: var(--tui-font-text)',
+        'letter-spacing: 0.0625rem',
+        'text-transform: uppercase',
+    ],
+    'text-caption': [
+        'font-size: 0.6875rem',
+        'font-weight: normal',
+        'font-family: var(--tui-font-text)',
+        'letter-spacing: 0.0625rem',
+        'text-transform: uppercase',
+    ],
+};
+// .tui-text-h1();
+// @include tui-text-h1();
+const MIXIN_RE = /(?:@include\s|\.)(text-[\w-]+)\(([\w-,\s]+)?\)(\s?!important)?;/g;
+function migrateTextMixins(fileContent) {
+    if (!fileContent.includes('@taiga-ui/core/styles/taiga-ui-local')) {
+        return fileContent;
+    }
+    return fileContent.replaceAll(MIXIN_RE, (originalString, mixinName, important = '') => MAPPING[mixinName]
+        ? `${MAPPING[mixinName].map((newValue) => `${newValue}${important};`).join('\n')}`
+        : `${originalString} // TODO: this mixin was deleted. Replace it with inline styles. Find it source code in https://github.com/taiga-family/taiga-ui/blob/v3.x/projects/core/styles/mixins/text.less`);
+}
+exports.migrateTextMixins = migrateTextMixins;

package/schematics/ng-update/v4/steps/templates/index.d.ts

@@ -1,10 +1,16 @@
 export * from './migrate-avatar';
+export * from './migrate-axes';
 export * from './migrate-badge';
 export * from './migrate-badged-content';
+export * from './migrate-button-appearance';
 export * from './migrate-expandable';
 export * from './migrate-focusable';
+export * from './migrate-label';
 export * from './migrate-labeled';
+export * from './migrate-mobile-tabs';
 export * from './migrate-money';
+export * from './migrate-notification';
+export * from './migrate-overscroll';
 export * from './migrate-prevent-default';
 export * from './migrate-progress-segmented';
 export * from './migrate-thumbnail-card';

package/schematics/ng-update/v4/steps/templates/index.js

@@ -2,12 +2,18 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
 tslib_1.__exportStar(require("./migrate-avatar"), exports);
+tslib_1.__exportStar(require("./migrate-axes"), exports);
 tslib_1.__exportStar(require("./migrate-badge"), exports);
 tslib_1.__exportStar(require("./migrate-badged-content"), exports);
+tslib_1.__exportStar(require("./migrate-button-appearance"), exports);
 tslib_1.__exportStar(require("./migrate-expandable"), exports);
 tslib_1.__exportStar(require("./migrate-focusable"), exports);
+tslib_1.__exportStar(require("./migrate-label"), exports);
 tslib_1.__exportStar(require("./migrate-labeled"), exports);
+tslib_1.__exportStar(require("./migrate-mobile-tabs"), exports);
 tslib_1.__exportStar(require("./migrate-money"), exports);
+tslib_1.__exportStar(require("./migrate-notification"), exports);
+tslib_1.__exportStar(require("./migrate-overscroll"), exports);
 tslib_1.__exportStar(require("./migrate-prevent-default"), exports);
 tslib_1.__exportStar(require("./migrate-progress-segmented"), exports);
 tslib_1.__exportStar(require("./migrate-thumbnail-card"), exports);

package/schematics/ng-update/v4/steps/templates/migrate-avatar.js

@@ -22,9 +22,6 @@ function addModules(componentPath, modules) {
     });
 }
 function getFallbackValue(textValue, fallbackValue) {
-    if (textValue) {
-        return `(${textValue} | tuiInitials)`;
-    }
     return textValue ? `(${textValue} | tuiInitials)` : fallbackValue || '';
 }
 function normalizeAttrValue(attrName, attrValue) {
@@ -47,6 +44,7 @@ function migrateAvatar({ resource, recorder, fileSystem, }) {
         const fallbackAttr = (0, inputs_1.findAttr)(attrs, 'fallback');
         const textAttr = (0, inputs_1.findAttr)(attrs, 'text');
         const roundedAttr = (0, inputs_1.findAttr)(attrs, 'rounded');
+        const autoColorAttr = (0, inputs_1.findAttr)(attrs, 'autoColor');
         if ((!avatarUrlAttr && !textAttr) || !sourceCodeLocation) {
             return;
         }
@@ -55,6 +53,8 @@ function migrateAvatar({ resource, recorder, fileSystem, }) {
         const textAttrValue = (textAttr === null || textAttr === void 0 ? void 0 : textAttr.value) && normalizeAttrValue(textAttr.name, textAttr.value);
         const fallbackAttrValue = (fallbackAttr === null || fallbackAttr === void 0 ? void 0 : fallbackAttr.value) &&
             normalizeAttrValue(fallbackAttr.name, fallbackAttr.value);
+        const autoColorValue = (autoColorAttr === null || autoColorAttr === void 0 ? void 0 : autoColorAttr.value) &&
+            normalizeAttrValue(autoColorAttr.name, autoColorAttr.value);
         const insertTo = ((_b = (_a = sourceCodeLocation.startTag) === null || _a === void 0 ? void 0 : _a.startOffset) !== null && _b !== void 0 ? _b : 0) + '<tui-avatar'.length;
         if (!insertTo) {
             return;
@@ -66,8 +66,13 @@ function migrateAvatar({ resource, recorder, fileSystem, }) {
         const fallbackSrc = urlAttrValue && fallbackValue
             ? `| tuiFallbackSrc : ${fallbackValue} | async`
             : '';
-        recorder.insertRight(insertTo + templateOffset, ` [src]="${mainSrc}${fallbackSrc ? ` ${fallbackSrc}` : ''}"${!roundedAttr ? ' [round]="false"' : ''}`);
-        const attrsToRemove = [avatarUrlAttr, textAttr, fallbackAttr].filter((attr) => attr !== undefined);
+        recorder.insertRight(insertTo + templateOffset, ` [src]="${mainSrc}${fallbackSrc ? ` ${fallbackSrc}` : ''}"${!roundedAttr ? ' [round]="false"' : ''}${autoColorValue === 'true' ? ` [style.background]="${textAttrValue} | tuiAutoColor"` : ''}`);
+        const attrsToRemove = [
+            avatarUrlAttr,
+            textAttr,
+            fallbackAttr,
+            autoColorAttr,
+        ].filter((attr) => attr !== undefined);
         const fallbackModule = !!((avatarUrlAttr && textAttrValue) || fallbackAttr);
         const initialsModule = !!textAttrValue;
         const modules = [

package/schematics/ng-update/{v3/steps/migrate-polymorpheus.d.ts → v4/steps/templates/migrate-axes.d.ts}

@@ -1,7 +1,7 @@
 import type { UpdateRecorder } from '@angular-devkit/schematics';
 import type { DevkitFileSystem } from 'ng-morph';
-import type { TemplateResource } from '../../interfaces/template-resource';
-export declare function migratePolymorpheus({ resource, fileSystem, recorder, }: {
+import type { TemplateResource } from '../../../interfaces';
+export declare function migrateAxes({ resource, recorder, fileSystem, }: {
     fileSystem: DevkitFileSystem;
     recorder: UpdateRecorder;
     resource: TemplateResource;

package/schematics/ng-update/v4/steps/templates/migrate-axes.js

@@ -0,0 +1,26 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.migrateAxes = void 0;
+const elements_1 = require("../../../../utils/templates/elements");
+const template_resource_1 = require("../../../../utils/templates/template-resource");
+const remove_attrs_1 = require("../utils/remove-attrs");
+const AXES_TAG_NAME = 'tui-axes';
+const AXES_NEW_ATTRIBUTE = 'new';
+function migrateAxes({ 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, AXES_TAG_NAME);
+    elements.forEach(({ attrs, sourceCodeLocation }) => {
+        const axesNewAttr = attrs.find((attr) => attr.name === AXES_NEW_ATTRIBUTE);
+        if (!sourceCodeLocation) {
+            return;
+        }
+        if (axesNewAttr) {
+            (0, remove_attrs_1.removeAttrs)([axesNewAttr], sourceCodeLocation, recorder, templateOffset);
+        }
+        else {
+            recorder.insertLeft(sourceCodeLocation.startOffset + templateOffset, '<!-- TODO: (Taiga UI migration) labels positioning on x axes were updated. Add empty string to axisXLabels array. See https://taiga-ui.dev/charts/axes -->\n');
+        }
+    });
+}
+exports.migrateAxes = migrateAxes;

package/schematics/ng-update/v4/steps/templates/migrate-badge.js

@@ -2,7 +2,15 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.migrateBadge = void 0;
 const elements_1 = require("../../../../utils/templates/elements");
+const inputs_1 = require("../../../../utils/templates/inputs");
 const template_resource_1 = require("../../../../utils/templates/template-resource");
+const common_1 = require("./toggles/common");
+const badgeSizeMap = {
+    xs: 's',
+    s: 'm',
+    m: 'l',
+    l: 'xl',
+};
 function migrateBadge({ resource, recorder, fileSystem, }) {
     const template = (0, template_resource_1.getTemplateFromTemplateResource)(resource, fileSystem);
     const templateOffset = (0, template_resource_1.getTemplateOffset)(resource);
@@ -11,7 +19,8 @@ function migrateBadge({ resource, recorder, fileSystem, }) {
         if (!sourceCodeLocation) {
             return;
         }
-        const valueAttr = attrs.find((attr) => attr.name === '[value]' || attr.name === 'value');
+        (0, common_1.replaceSizeAttr)(attrs, sourceCodeLocation, recorder, templateOffset, badgeSizeMap);
+        const valueAttr = (0, inputs_1.findAttr)(attrs, 'value');
         // migration for icon-only badges
         if (!valueAttr) {
             addTodo(recorder, sourceCodeLocation, templateOffset);
@@ -31,16 +40,16 @@ function migrateBadge({ resource, recorder, fileSystem, }) {
 }
 exports.migrateBadge = migrateBadge;
 function migrateIcon({ svg, sourceCodeLocation, recorder, templateOffset, }) {
-    var _a, _b, _c, _d, _e;
-    const src = (_a = svg.attrs) === null || _a === void 0 ? void 0 : _a.find((attr) => attr.name === 'src');
+    var _a, _b, _c, _d;
+    const src = (0, inputs_1.findAttr)(svg.attrs, 'src');
     const srcValue = src === null || src === void 0 ? void 0 : src.value;
     if (!srcValue) {
         return;
     }
-    const insertTo = templateOffset + (((_b = sourceCodeLocation === null || sourceCodeLocation === void 0 ? void 0 : sourceCodeLocation.startTag) === null || _b === void 0 ? void 0 : _b.endOffset) || 0) - 1;
+    const insertTo = templateOffset + (((_a = sourceCodeLocation === null || sourceCodeLocation === void 0 ? void 0 : sourceCodeLocation.startTag) === null || _a === void 0 ? void 0 : _a.endOffset) || 0) - 1;
     recorder.insertRight(insertTo, `${(src === null || src === void 0 ? void 0 : src.name) === 'src' ? 'iconStart' : '[iconStart]'}="${srcValue}"`);
-    recorder.remove(((_c = svg.sourceCodeLocation) === null || _c === void 0 ? void 0 : _c.startOffset) || 0, (((_d = svg.sourceCodeLocation) === null || _d === void 0 ? void 0 : _d.endOffset) || 0) -
-        (((_e = svg.sourceCodeLocation) === null || _e === void 0 ? void 0 : _e.startOffset) || 0));
+    recorder.remove(((_b = svg.sourceCodeLocation) === null || _b === void 0 ? void 0 : _b.startOffset) || 0, (((_c = svg.sourceCodeLocation) === null || _c === void 0 ? void 0 : _c.endOffset) || 0) -
+        (((_d = svg.sourceCodeLocation) === null || _d === void 0 ? void 0 : _d.startOffset) || 0));
 }
 function migrateBadgeValue({ valueAttr, sourceCodeLocation, recorder, templateOffset, }) {
     var _a, _b, _c, _d, _e;

package/schematics/ng-update/v4/steps/templates/migrate-badged-content.js

@@ -59,7 +59,7 @@ function migrateBadgedContent({ resource, recorder, fileSystem, }) {
         });
         if (!rounded || rounded.value === 'true') {
             const insertTo = (_b = (_a = sourceCodeLocation.startTag) === null || _a === void 0 ? void 0 : _a.endOffset) !== null && _b !== void 0 ? _b : 0;
-            recorder.insertRight(insertTo + templateOffset - 1, '[style.--tui-radius.%]="50"');
+            recorder.insertRight(insertTo + templateOffset - 1, ' [style.--tui-radius.%]="50"');
         }
         const attrsToRemove = [
             colorBottomAttr,

package/schematics/ng-update/{v3/steps/migrate-textfield-controller.d.ts → v4/steps/templates/migrate-blocked.d.ts}

@@ -1,7 +1,7 @@
 import type { UpdateRecorder } from '@angular-devkit/schematics';
 import type { DevkitFileSystem } from 'ng-morph';
-import type { TemplateResource } from '../../interfaces/template-resource';
-export declare function migrateTextfieldController({ resource, fileSystem, recorder, }: {
+import type { TemplateResource } from '../../../interfaces';
+export declare function migrateBlocked({ resource, recorder, fileSystem, }: {
     fileSystem: DevkitFileSystem;
     recorder: UpdateRecorder;
     resource: TemplateResource;

package/schematics/ng-update/v4/steps/templates/migrate-blocked.js

@@ -0,0 +1,35 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.migrateBlocked = void 0;
+const elements_1 = require("../../../../utils/templates/elements");
+const inputs_1 = require("../../../../utils/templates/inputs");
+const template_resource_1 = require("../../../../utils/templates/template-resource");
+function migrateBlocked({ 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.findElementsByTagNames)(template, [
+        'tui-checkbox-block',
+        'tui-radio-block',
+    ]);
+    elements.forEach(({ sourceCodeLocation, tagName, attrs }) => {
+        var _a, _b, _c, _d;
+        if (!sourceCodeLocation) {
+            return;
+        }
+        const [, hideIconAttrLocation] = Object.entries(sourceCodeLocation.attrs || {}).find(([name]) => name.includes('hideCheckbox'.toLowerCase()) ||
+            name.includes('hideRadio'.toLowerCase())) || [];
+        const [, sizeAttrLocation] = Object.entries(sourceCodeLocation.attrs || {}).find(([name]) => name.includes('size')) || [];
+        const sizeAttr = (0, inputs_1.findAttr)(attrs, 'size');
+        const newBlockAttr = `tuiBlock${sizeAttr ? `="${sizeAttr.value === 'xs' ? 's' : sizeAttr.value}"` : ''}`;
+        recorder.insertRight(templateOffset + (((_a = sourceCodeLocation.startTag) === null || _a === void 0 ? void 0 : _a.startOffset) || 1) - 1, `<label ${newBlockAttr}${hideIconAttrLocation ? ' appearance=""' : ''}>`);
+        recorder.remove(templateOffset + ((_c = (_b = sourceCodeLocation.endTag) === null || _b === void 0 ? void 0 : _b.startOffset) !== null && _c !== void 0 ? _c : 0), `<${tagName}/>`.length);
+        recorder.insertRight(templateOffset + (((_d = sourceCodeLocation.endTag) === null || _d === void 0 ? void 0 : _d.startOffset) || 1), '</label>');
+        if (hideIconAttrLocation) {
+            recorder.remove(templateOffset + hideIconAttrLocation.startOffset, hideIconAttrLocation.endOffset - hideIconAttrLocation.startOffset);
+        }
+        if (sizeAttrLocation) {
+            recorder.remove(templateOffset + sizeAttrLocation.startOffset, sizeAttrLocation.endOffset - sizeAttrLocation.startOffset);
+        }
+    });
+}
+exports.migrateBlocked = migrateBlocked;

package/schematics/ng-update/v4/steps/templates/migrate-button-appearance.d.ts

@@ -0,0 +1,8 @@
+import type { UpdateRecorder } from '@angular-devkit/schematics';
+import type { DevkitFileSystem } from 'ng-morph';
+import type { TemplateResource } from '../../../interfaces';
+export declare function migrateButtonAppearance({ resource, recorder, fileSystem, }: {
+    fileSystem: DevkitFileSystem;
+    recorder: UpdateRecorder;
+    resource: TemplateResource;
+}): void;

package/schematics/ng-update/v4/steps/templates/migrate-button-appearance.js

@@ -0,0 +1,41 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.migrateButtonAppearance = void 0;
+const elements_1 = require("../../../../utils/templates/elements");
+const template_resource_1 = require("../../../../utils/templates/template-resource");
+const remove_attrs_1 = require("../utils/remove-attrs");
+const tuiButtonSelectors = ['tuiButton', 'tuiIconButton'];
+const appearanceInputName = 'appearance';
+const appearanceInputNameDict = {
+    [appearanceInputName]: true,
+    [`[${appearanceInputName}]`]: true,
+};
+function migrateButtonAppearance({ resource, recorder, fileSystem, }) {
+    const template = (0, template_resource_1.getTemplateFromTemplateResource)(resource, fileSystem);
+    const templateOffset = (0, template_resource_1.getTemplateOffset)(resource);
+    const elements = tuiButtonSelectors.flatMap((selector) => (0, elements_1.findElementsWithDirective)(template, selector).filter(({ sourceCodeLocation, attrs }) => !!sourceCodeLocation &&
+        attrs.some(({ name }) => appearanceInputNameDict[name])));
+    if (!elements.length) {
+        return;
+    }
+    const whiteBlockValue = 'whiteblock-active';
+    elements.forEach(({ attrs, sourceCodeLocation }) => {
+        var _a;
+        const whiteBlockActiveAttr = attrs.find(({ value, name }) => appearanceInputNameDict[name] &&
+            (value === whiteBlockValue || value === `'${whiteBlockValue}'`));
+        if (whiteBlockActiveAttr) {
+            (0, remove_attrs_1.removeAttrs)([whiteBlockActiveAttr], sourceCodeLocation, recorder, templateOffset);
+            const { startOffset } = ((_a = sourceCodeLocation === null || sourceCodeLocation === void 0 ? void 0 : sourceCodeLocation.attrs) === null || _a === void 0 ? void 0 : _a[whiteBlockActiveAttr.name]) || { startOffset: 0, endOffset: 0 };
+            recorder.insertLeft(startOffset + templateOffset, ` ${appearanceInputName}="whiteblock"`);
+            recorder.insertLeft(startOffset + templateOffset, ' data-mode="checked"');
+        }
+    });
+    const elementWithConditionAppearance = elements.find(({ attrs }) => attrs.some(({ name, value }) => name === `[${appearanceInputName}]` && !value.trim().startsWith("'")));
+    if (elementWithConditionAppearance) {
+        addTodo(recorder, templateOffset);
+    }
+}
+exports.migrateButtonAppearance = migrateButtonAppearance;
+function addTodo(recorder, templateOffset) {
+    recorder.insertRight(templateOffset, '<!-- Taiga migration TODO: tuiButton "whiteblock-active" appearance is no longer available. Use \'appearance="whiteblock" data-mode="checked"\' -->\n');
+}

package/schematics/ng-update/v4/steps/templates/migrate-expandable.js

@@ -2,6 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.migrateExpandable = void 0;
 const elements_1 = require("../../../../utils/templates/elements");
+const inputs_1 = require("../../../../utils/templates/inputs");
 const template_resource_1 = require("../../../../utils/templates/template-resource");
 function migrateExpandable({ resource, recorder, fileSystem, }) {
     const template = (0, template_resource_1.getTemplateFromTemplateResource)(resource, fileSystem);
@@ -9,7 +10,7 @@ function migrateExpandable({ resource, recorder, fileSystem, }) {
     const elements = (0, elements_1.findElementsWithAttributeOnTag)(template, ['[expandable]'], ['tui-input-tag', 'tui-multi-select', 'tui-input-date']);
     elements.forEach(({ attrs, sourceCodeLocation }) => {
         var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
-        const expandableAttr = attrs.find((attr) => attr.name === '[expandable]');
+        const expandableAttr = (0, inputs_1.findAttr)(attrs, 'expandable');
         if (!expandableAttr) {
             return;
         }
@@ -17,7 +18,7 @@ function migrateExpandable({ resource, recorder, fileSystem, }) {
         const expandableStart = (_c = (_b = (_a = sourceCodeLocation === null || sourceCodeLocation === void 0 ? void 0 : sourceCodeLocation.attrs) === null || _a === void 0 ? void 0 : _a[expandableAttr.name]) === null || _b === void 0 ? void 0 : _b.startOffset) !== null && _c !== void 0 ? _c : 0;
         const expandableEnd = (_f = (_e = (_d = sourceCodeLocation === null || sourceCodeLocation === void 0 ? void 0 : sourceCodeLocation.attrs) === null || _d === void 0 ? void 0 : _d[expandableAttr.name]) === null || _e === void 0 ? void 0 : _e.endOffset) !== null && _f !== void 0 ? _f : 0;
         if (expandableValue === 'false') {
-            const rowsAttr = attrs.find((attr) => attr.name === '[rows]');
+            const rowsAttr = (0, inputs_1.findAttr)(attrs, 'rows');
             const insertTo = ((_h = (_g = sourceCodeLocation === null || sourceCodeLocation === void 0 ? void 0 : sourceCodeLocation.startTag) === null || _g === void 0 ? void 0 : _g.endOffset) !== null && _h !== void 0 ? _h : 0) - 1;
             recorder.insertRight(templateOffset + insertTo, rowsAttr ? '' : '[rows]="1"');
         }

package/schematics/ng-update/v4/steps/templates/migrate-focusable.js

@@ -2,19 +2,22 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.migrateFocusable = void 0;
 const elements_1 = require("../../../../utils/templates/elements");
+const inputs_1 = require("../../../../utils/templates/inputs");
 const template_resource_1 = require("../../../../utils/templates/template-resource");
-const LEGACY_ATTRIBUTE_NAME = '[tuiFocusable]'.toLowerCase();
+const LEGACY_ATTRIBUTE_NAME = 'tuiFocusable';
 function migrateFocusable({ 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.findElementsWithAttributeOnTag)(template, [LEGACY_ATTRIBUTE_NAME]);
+    const elements = (0, elements_1.findElementsWithAttributeOnTag)(template, [
+        `[${LEGACY_ATTRIBUTE_NAME}]`,
+    ]);
     elements.forEach(({ attrs, sourceCodeLocation }) => {
         var _a;
         if (!sourceCodeLocation) {
             return;
         }
-        const focusableAttr = attrs.find((attr) => attr.name === LEGACY_ATTRIBUTE_NAME);
-        const attributeLocation = (_a = sourceCodeLocation.attrs) === null || _a === void 0 ? void 0 : _a[LEGACY_ATTRIBUTE_NAME];
+        const focusableAttr = (0, inputs_1.findAttr)(attrs, LEGACY_ATTRIBUTE_NAME);
+        const attributeLocation = (_a = sourceCodeLocation.attrs) === null || _a === void 0 ? void 0 : _a[focusableAttr.name];
         if (!focusableAttr || !attributeLocation) {
             return;
         }

package/schematics/ng-update/v4/steps/templates/migrate-label.d.ts

@@ -0,0 +1,8 @@
+import type { UpdateRecorder } from '@angular-devkit/schematics';
+import type { DevkitFileSystem } from 'ng-morph';
+import type { TemplateResource } from '../../../interfaces';
+export declare function migrateLabel({ resource, recorder, fileSystem, }: {
+    fileSystem: DevkitFileSystem;
+    recorder: UpdateRecorder;
+    resource: TemplateResource;
+}): void;

package/schematics/ng-update/v4/steps/templates/migrate-label.js

@@ -0,0 +1,39 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.migrateLabel = void 0;
+const elements_1 = require("../../../../utils/templates/elements");
+const inputs_1 = require("../../../../utils/templates/inputs");
+const template_resource_1 = require("../../../../utils/templates/template-resource");
+function migrateLabel({ resource, recorder, fileSystem, }) {
+    const template = (0, template_resource_1.getTemplateFromTemplateResource)(resource, fileSystem);
+    const templateOffset = (0, template_resource_1.getTemplateOffset)(resource);
+    const labelElements = (0, elements_1.findElementsByTagName)(template, 'label', ({ attrs }) => attrs.some(({ name }) => name === 'tuilabel' || name === '[tuilabel]'));
+    labelElements.forEach(({ attrs, sourceCodeLocation }) => {
+        const labelAttr = (0, inputs_1.findAttr)(attrs, 'tuilabel');
+        if (!labelAttr || !sourceCodeLocation) {
+            return;
+        }
+        migrateValue({
+            valueAttr: labelAttr,
+            sourceCodeLocation,
+            recorder,
+            templateOffset,
+        });
+    });
+}
+exports.migrateLabel = migrateLabel;
+function migrateValue({ valueAttr, sourceCodeLocation, recorder, templateOffset, }) {
+    var _a, _b, _c;
+    const attrValue = valueAttr === null || valueAttr === void 0 ? void 0 : valueAttr.value;
+    const insertTo = (_b = (_a = sourceCodeLocation === null || sourceCodeLocation === void 0 ? void 0 : sourceCodeLocation.startTag) === null || _a === void 0 ? void 0 : _a.endOffset) !== null && _b !== void 0 ? _b : 0;
+    if (!attrValue || !insertTo) {
+        return;
+    }
+    recorder.insertRight(insertTo + templateOffset, valueAttr.name === 'tuilabel' ? attrValue : `{{ ${attrValue} }}`);
+    const attrOffset = (_c = sourceCodeLocation === null || sourceCodeLocation === void 0 ? void 0 : sourceCodeLocation.attrs) === null || _c === void 0 ? void 0 : _c[valueAttr.name];
+    if (attrOffset) {
+        const { startOffset, endOffset } = attrOffset;
+        recorder.remove(templateOffset + startOffset, endOffset - startOffset);
+        recorder.insertRight(templateOffset + startOffset, 'tuiLabel');
+    }
+}

package/schematics/ng-update/v4/steps/templates/migrate-labeled.js

@@ -15,7 +15,7 @@ function migrateLabeled({ resource, recorder, fileSystem, }) {
         data: [
             {
                 attrNames: ['size'],
-                values: [
+                valueReplacer: [
                     { from: 'l', to: 'm' },
                     { from: 'm', to: 's' },
                 ],
@@ -28,16 +28,14 @@ function migrateLabeled({ resource, recorder, fileSystem, }) {
         'tui-radio-labeled',
     ]);
     elements.forEach(({ sourceCodeLocation, tagName }) => {
-        var _a, _b, _c, _d, _e, _f;
+        var _a, _b, _c, _d;
         if (!sourceCodeLocation) {
             return;
         }
         (0, add_import_to_closest_module_1.addImportToClosestModule)(resource.componentPath, tagName === 'tui-checkbox-labeled' ? 'TuiCheckbox' : 'TuiRadio', '@taiga-ui/kit');
-        recorder.insertRight(templateOffset + ((_b = (_a = sourceCodeLocation.startTag) === null || _a === void 0 ? void 0 : _a.startOffset) !== null && _b !== void 0 ? _b : 1) - 1, '<label tuiLabel>');
-        recorder.insertRight(templateOffset + ((_d = (_c = sourceCodeLocation.endTag) === null || _c === void 0 ? void 0 : _c.startOffset) !== null && _d !== void 0 ? _d : 1) - 1, '\n</label>');
-        recorder.remove(templateOffset + ((_f = (_e = sourceCodeLocation.endTag) === null || _e === void 0 ? void 0 : _e.startOffset) !== null && _f !== void 0 ? _f : 0), tagName === 'tui-checkbox-labeled'
-            ? '<tui-checkbox-labeled/>'.length
-            : '<tui-radio-labeled/>'.length);
+        recorder.insertRight(templateOffset + (((_a = sourceCodeLocation.startTag) === null || _a === void 0 ? void 0 : _a.startOffset) || 1) - 1, '<label tuiLabel>');
+        recorder.remove(templateOffset + ((_c = (_b = sourceCodeLocation.endTag) === null || _b === void 0 ? void 0 : _b.startOffset) !== null && _c !== void 0 ? _c : 0), `<${tagName}/>`.length);
+        recorder.insertRight(templateOffset + (((_d = sourceCodeLocation.endTag) === null || _d === void 0 ? void 0 : _d.startOffset) || 1), '</label>');
     });
 }
 exports.migrateLabeled = migrateLabeled;

package/schematics/ng-update/v4/steps/templates/migrate-mobile-tabs.d.ts

@@ -0,0 +1,8 @@
+import type { UpdateRecorder } from '@angular-devkit/schematics';
+import type { DevkitFileSystem } from 'ng-morph';
+import type { TemplateResource } from '../../../interfaces';
+export declare function migrateMobileTabs({ resource, recorder, fileSystem, }: {
+    fileSystem: DevkitFileSystem;
+    recorder: UpdateRecorder;
+    resource: TemplateResource;
+}): void;

package/schematics/ng-update/v4/steps/templates/migrate-mobile-tabs.js

@@ -0,0 +1,45 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.migrateMobileTabs = void 0;
+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");
+const templates_1 = require("../../../utils/templates");
+const remove_attrs_1 = require("../utils/remove-attrs");
+const TABS_TAG_NAME = 'tui-tabs';
+const SEGMENTED_TAG_NAME = 'tui-segmented';
+const TAB_ATTRIBUTE_NAME = 'tuiTab'.toLowerCase();
+const MOBILE_TABS_ATTRIBUTE_NAME = 'tuiMobileTabs'.toLowerCase();
+function migrateMobileTabs({ 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.findElementsWithAttributeOnTag)(template, [MOBILE_TABS_ATTRIBUTE_NAME], [TABS_TAG_NAME]);
+    if (elements.length > 0) {
+        (0, add_import_to_closest_module_1.addImportToClosestModule)(resource.componentPath, 'TuiSegmented', '@taiga-ui/kit');
+    }
+    elements.forEach((element) => {
+        (0, templates_1.replaceTag)(recorder, element.sourceCodeLocation, TABS_TAG_NAME, SEGMENTED_TAG_NAME, templateOffset);
+        removeMobileTabsAttribute(element, recorder, templateOffset);
+        element.childNodes
+            .filter(isElement)
+            .forEach((element) => removeTabAttribute(element, recorder, templateOffset));
+    });
+}
+exports.migrateMobileTabs = migrateMobileTabs;
+function removeTabAttribute({ attrs, sourceCodeLocation }, recorder, templateOffset) {
+    const tabAttr = attrs.find((attr) => attr.name === TAB_ATTRIBUTE_NAME);
+    if (!tabAttr || !sourceCodeLocation) {
+        return;
+    }
+    (0, remove_attrs_1.removeAttrs)([tabAttr], sourceCodeLocation, recorder, templateOffset);
+}
+function removeMobileTabsAttribute({ attrs, sourceCodeLocation }, recorder, templateOffset) {
+    const mobileTabsAttr = attrs.find((attr) => attr.name === MOBILE_TABS_ATTRIBUTE_NAME);
+    if (!mobileTabsAttr || !sourceCodeLocation) {
+        return;
+    }
+    (0, remove_attrs_1.removeAttrs)([mobileTabsAttr], sourceCodeLocation, recorder, templateOffset);
+}
+function isElement(node) {
+    return Boolean(node.attrs);
+}

package/schematics/ng-update/v4/steps/templates/migrate-notification.d.ts

@@ -0,0 +1,8 @@
+import type { UpdateRecorder } from '@angular-devkit/schematics';
+import type { DevkitFileSystem } from 'ng-morph';
+import type { TemplateResource } from '../../../interfaces';
+export declare function migrateNotification({ resource, recorder, fileSystem, }: {
+    fileSystem: DevkitFileSystem;
+    recorder: UpdateRecorder;
+    resource: TemplateResource;
+}): void;