@taiga-ui/cdk 3.0.0-rc.0 → 3.0.0-rc.3

package/schematics/ng-update/constants/consts.js

@@ -13,6 +13,16 @@ exports.CONSTS_TO_REPLACE = [
             moduleSpecifier: '@angular/forms',
         },
     },
+    {
+        from: {
+            name: 'TUI_CALENDAR_DATA_STREAM',
+            moduleSpecifier: '@taiga-ui/kit',
+        },
+        to: {
+            name: 'TUI_CALENDAR_DATE_STREAM',
+            moduleSpecifier: '@taiga-ui/kit',
+        },
+    },
     {
         from: {
             name: 'TUI_DATE_MASK',
@@ -53,6 +63,66 @@ exports.CONSTS_TO_REPLACE = [
             moduleSpecifier: '@taiga-ui/core',
         },
     },
+    {
+        from: {
+            name: 'TuiManualHintModule',
+            moduleSpecifier: '@taiga-ui/core',
+        },
+        to: {
+            name: 'TuiHintModule',
+            moduleSpecifier: '@taiga-ui/core',
+        },
+    },
+    {
+        from: {
+            name: 'TuiPointerHintModule',
+            moduleSpecifier: '@taiga-ui/core',
+        },
+        to: {
+            name: 'TuiHintModule',
+            moduleSpecifier: '@taiga-ui/core',
+        },
+    },
+    {
+        from: {
+            name: 'TuiDropdownControllerModule',
+            moduleSpecifier: '@taiga-ui/core',
+        },
+        to: {
+            name: 'TuiDropdownModule',
+            moduleSpecifier: '@taiga-ui/core',
+        },
+    },
+    {
+        from: {
+            name: 'TuiDropdownSelectionModule',
+            moduleSpecifier: '@taiga-ui/kit',
+        },
+        to: {
+            name: 'TuiDropdownModule',
+            moduleSpecifier: '@taiga-ui/core',
+        },
+    },
+    {
+        from: {
+            name: 'TuiDropdownHoverModule',
+            moduleSpecifier: '@taiga-ui/kit',
+        },
+        to: {
+            name: 'TuiDropdownModule',
+            moduleSpecifier: '@taiga-ui/core',
+        },
+    },
+    {
+        from: {
+            name: 'TuiDropdownContextModule',
+            moduleSpecifier: '@taiga-ui/kit',
+        },
+        to: {
+            name: 'TuiDropdownModule',
+            moduleSpecifier: '@taiga-ui/core',
+        },
+    },
     {
         from: { name: 'identity', moduleSpecifier: '@taiga-ui/cdk' },
         to: { name: 'identity', moduleSpecifier: 'rxjs' },
@@ -143,4 +213,104 @@ exports.CONSTS_TO_REPLACE = [
             moduleSpecifier: '@taiga-ui/kit',
         },
     },
+    {
+        from: {
+            name: 'hexToRgb',
+            moduleSpecifier: ['@taiga-ui/addon-doc', '@taiga-ui/addon-editor'],
+        },
+        to: {
+            name: 'tuiHexToRgb',
+            moduleSpecifier: '@taiga-ui/cdk',
+        },
+    },
+    {
+        from: {
+            name: 'tuiHexToRgb',
+            moduleSpecifier: ['@taiga-ui/addon-doc', '@taiga-ui/addon-editor'],
+        },
+        to: {
+            name: 'tuiHexToRgb',
+            moduleSpecifier: '@taiga-ui/cdk',
+        },
+    },
+    {
+        from: {
+            name: 'hsvToRgb',
+            moduleSpecifier: '@taiga-ui/addon-editor',
+        },
+        to: {
+            name: 'tuiHsvToRgb',
+            moduleSpecifier: '@taiga-ui/cdk',
+        },
+    },
+    {
+        from: {
+            name: 'tuiHsvToRgb',
+            moduleSpecifier: '@taiga-ui/addon-editor',
+        },
+        to: {
+            name: 'tuiHsvToRgb',
+            moduleSpecifier: '@taiga-ui/cdk',
+        },
+    },
+    {
+        from: {
+            name: 'parseColor',
+            moduleSpecifier: '@taiga-ui/addon-editor',
+        },
+        to: {
+            name: 'tuiParseColor',
+            moduleSpecifier: '@taiga-ui/cdk',
+        },
+    },
+    {
+        from: {
+            name: 'tuiParseColor',
+            moduleSpecifier: '@taiga-ui/addon-editor',
+        },
+        to: {
+            name: 'tuiParseColor',
+            moduleSpecifier: '@taiga-ui/cdk',
+        },
+    },
+    {
+        from: {
+            name: 'rgbToHex',
+            moduleSpecifier: ['@taiga-ui/addon-doc', '@taiga-ui/addon-editor'],
+        },
+        to: {
+            name: 'tuiRgbToHex',
+            moduleSpecifier: '@taiga-ui/cdk',
+        },
+    },
+    {
+        from: {
+            name: 'tuiRgbToHex',
+            moduleSpecifier: ['@taiga-ui/addon-doc', '@taiga-ui/addon-editor'],
+        },
+        to: {
+            name: 'tuiRgbToHex',
+            moduleSpecifier: '@taiga-ui/cdk',
+        },
+    },
+    {
+        from: {
+            name: 'rgbToHsv',
+            moduleSpecifier: '@taiga-ui/addon-editor',
+        },
+        to: {
+            name: 'tuiRgbToHsv',
+            moduleSpecifier: '@taiga-ui/cdk',
+        },
+    },
+    {
+        from: {
+            name: 'tuiRgbToHsv',
+            moduleSpecifier: '@taiga-ui/addon-editor',
+        },
+        to: {
+            name: 'tuiRgbToHsv',
+            moduleSpecifier: '@taiga-ui/cdk',
+        },
+    },
 ];

package/schematics/ng-update/constants/deprecated-functions.js

@@ -97,16 +97,6 @@ exports.DEPRECATED_FUNCTIONS = [
         to: 'tuiCoerceValue',
         moduleSpecifier: ['@taiga-ui/addon-doc'],
     },
-    {
-        from: 'rgbToHex',
-        to: 'tuiRgbToHex',
-        moduleSpecifier: ['@taiga-ui/addon-doc'],
-    },
-    {
-        from: 'hexToRgb',
-        to: 'tuiHexToRgb',
-        moduleSpecifier: ['@taiga-ui/addon-doc'],
-    },
     {
         from: 'generateRoutes',
         to: 'tuiGenerateRoutes',
@@ -147,41 +137,16 @@ exports.DEPRECATED_FUNCTIONS = [
         to: 'tuiGetMarkRange',
         moduleSpecifier: ['@taiga-ui/addon-editor'],
     },
-    {
-        from: 'hexToRgb',
-        to: 'tuiHexToRgb',
-        moduleSpecifier: ['@taiga-ui/addon-editor'],
-    },
-    {
-        from: 'hsvToRgb',
-        to: 'tuiHsvToRgb',
-        moduleSpecifier: ['@taiga-ui/addon-editor'],
-    },
     {
         from: 'isSelectionIn',
         to: 'tuiIsSelectionIn',
         moduleSpecifier: ['@taiga-ui/addon-editor'],
     },
-    {
-        from: 'parseColor',
-        to: 'tuiParseColor',
-        moduleSpecifier: ['@taiga-ui/addon-editor'],
-    },
     {
         from: 'parseGradient',
         to: 'tuiParseGradient',
         moduleSpecifier: ['@taiga-ui/addon-editor'],
     },
-    {
-        from: 'rgbToHex',
-        to: 'tuiRgbToHex',
-        moduleSpecifier: ['@taiga-ui/addon-editor'],
-    },
-    {
-        from: 'rgbToHsv',
-        to: 'tuiRgbToHsv',
-        moduleSpecifier: ['@taiga-ui/addon-editor'],
-    },
     {
         from: 'toGradient',
         to: 'tuiToGradient',
@@ -354,7 +319,7 @@ exports.DEPRECATED_FUNCTIONS = [
     },
     {
         from: 'getClosestKeyboardFocusable',
-        to: 'tuiGetClosestKeyboardFocusable',
+        to: 'tuiGetClosestFocusable',
         moduleSpecifier: ['@taiga-ui/cdk'],
     },
     {

package/schematics/ng-update/constants/services.js

@@ -17,7 +17,7 @@ exports.SERVICES_TO_REPLACE = [
         },
         to: {
             name: 'TuiAlertService',
-            moduleSpecifier: '@taiga-ui/cdk',
+            moduleSpecifier: '@taiga-ui/core',
         },
         replaceMethods: [
             {

package/schematics/ng-update/constants/templates.d.ts

@@ -33,6 +33,10 @@ export declare const ATTRS_TO_REPLACE: ReplacementAttributes[];
 export declare const INPUTS_TO_REMOVE: InputToRemove[];
 export declare const TAGS_TO_REPLACE: ReplacementTags[];
 export declare const ATTR_TO_DIRECTIVE: AttributeToDirective[];
+/**
+ * @example `<div [tuiDropdownSided]="true" />` => `<div tuiDropdownSided />`
+ */
+export declare const TRUTHY_BOOLEAN_INPUT_TO_HTML_BINARY_ATTRIBUTE: readonly ["tuiDropdownSided"];
 export declare const TEMPLATE_COMMENTS: readonly [{
     readonly tag: "tui-input-slider";
     readonly withAttr: "pluralize";
@@ -49,6 +53,10 @@ export declare const TEMPLATE_COMMENTS: readonly [{
     readonly tag: "tui-range";
     readonly withAttr: "pluralize";
     readonly comment: "See examples how create labels for ticks without this property (outside the component): https://taiga-ui.dev/components/range#segments";
+}, {
+    readonly tag: "tui-range";
+    readonly withAttr: "steps";
+    readonly comment: "This component has new API. Use property [step] instead. See: https://taiga-ui.dev/components/range/API";
 }, {
     readonly tag: "tui-preview-host";
     readonly withAttr: "ngProjectAs";
@@ -57,4 +65,12 @@ export declare const TEMPLATE_COMMENTS: readonly [{
     readonly tag: "tui-progress";
     readonly withAttr: "value";
     readonly comment: "This legacy component was replaced by 3 new ones (https://taiga-ui.dev/components/progress-bar | https://taiga-ui.dev/components/progress-circle | https://taiga-ui.dev/components/progress-segmented ) ";
+}, {
+    readonly tag: "tui-input-file";
+    readonly withAttr: "loadingFiles";
+    readonly comment: "This legacy component was replaced by new one (https://taiga-ui.dev/components/input-files) ";
+}, {
+    readonly tag: "tui-input-tag";
+    readonly withAttr: "allowSpaces";
+    readonly comment: "Use property [separator] to forbid spaces. See example: https://taiga-ui.dev/components/input-tag#no-spaces-inside-tags";
 }];

package/schematics/ng-update/constants/templates.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.TEMPLATE_COMMENTS = exports.ATTR_TO_DIRECTIVE = exports.TAGS_TO_REPLACE = exports.INPUTS_TO_REMOVE = exports.ATTRS_TO_REPLACE = void 0;
+exports.TEMPLATE_COMMENTS = exports.TRUTHY_BOOLEAN_INPUT_TO_HTML_BINARY_ATTRIBUTE = exports.ATTR_TO_DIRECTIVE = exports.TAGS_TO_REPLACE = exports.INPUTS_TO_REMOVE = exports.ATTRS_TO_REPLACE = void 0;
 const tui_interactive_selectors_1 = require("./tui-interactive-selectors");
 const elements_1 = require("../../utils/templates/elements");
 exports.ATTRS_TO_REPLACE = [
@@ -16,6 +16,7 @@ exports.ATTRS_TO_REPLACE = [
                 'tui-range',
                 'tui-input-range',
                 'tui-input-slider',
+                'tui-feed-item',
             ],
         },
         to: { attrName: '' },
@@ -40,6 +41,42 @@ exports.ATTRS_TO_REPLACE = [
             attrName: '[active]',
         },
     },
+    {
+        from: {
+            attrName: '[label]',
+            withAttrsNames: ['tuiLabel'],
+        },
+        to: {
+            attrName: '[tuiLabel]',
+        },
+    },
+    {
+        from: {
+            attrName: 'label',
+            withAttrsNames: ['tuiLabel'],
+        },
+        to: {
+            attrName: 'tuiLabel',
+        },
+    },
+    {
+        from: {
+            attrName: '[state]',
+            withAttrsNames: ['tuiStep'],
+        },
+        to: {
+            attrName: '[stepState]',
+        },
+    },
+    {
+        from: {
+            attrName: 'state',
+            withAttrsNames: ['tuiStep'],
+        },
+        to: {
+            attrName: 'stepState',
+        },
+    },
     {
         from: {
             attrName: '[focused]',
@@ -96,6 +133,15 @@ exports.ATTRS_TO_REPLACE = [
             attrName: '[step]',
         },
     },
+    {
+        from: {
+            attrName: '[quantum]',
+            withTagNames: ['tui-range'],
+        },
+        to: {
+            attrName: '[step]',
+        },
+    },
     {
         from: {
             attrName: '*tuiTab',
@@ -123,12 +169,196 @@ exports.ATTRS_TO_REPLACE = [
             attrName: 'tuiItem',
         },
     },
+    {
+        from: {
+            attrName: 'tuiManualHint',
+            withTagNames: ['*'],
+        },
+        to: {
+            attrName: 'tuiHint',
+        },
+    },
+    {
+        from: {
+            attrName: '[tuiManualHint]',
+            withTagNames: ['*'],
+        },
+        to: {
+            attrName: '[tuiHint]',
+        },
+    },
+    {
+        from: {
+            attrName: '[tuiManualHintShow]',
+            withTagNames: ['*'],
+        },
+        to: {
+            attrName: '[tuiHintManual]',
+        },
+    },
+    {
+        from: {
+            attrName: '[tuiPointerHint]',
+            withTagNames: ['*'],
+        },
+        to: {
+            attrName: 'tuiHintPointer [tuiHint]',
+        },
+    },
+    {
+        from: {
+            attrName: 'tuiPointerHint',
+            withTagNames: ['*'],
+        },
+        to: {
+            attrName: 'tuiHintPointer tuiHint',
+        },
+    },
+    {
+        from: {
+            attrName: 'messageMode',
+            withTagNames: ['tui-input-copy'],
+        },
+        to: {
+            attrName: 'messageAppearance',
+        },
+    },
+    {
+        from: {
+            attrName: '[messageMode]',
+            withTagNames: ['tui-input-copy'],
+        },
+        to: {
+            attrName: '[messageAppearance]',
+        },
+    },
+    {
+        from: {
+            attrName: '[hintMode]',
+            withTagNames: ['tui-bar-chart'],
+        },
+        to: {
+            attrName: '[tuiHintAppearance]',
+        },
+    },
+    {
+        from: {
+            attrName: 'tuiHintMode',
+            withTagNames: ['*'],
+        },
+        to: {
+            attrName: 'tuiHintAppearance',
+        },
+    },
+    {
+        from: {
+            attrName: '[tuiHintMode]',
+            withTagNames: ['*'],
+        },
+        to: {
+            attrName: '[tuiHintAppearance]',
+        },
+    },
+    {
+        from: {
+            attrName: 'mode',
+            withTagNames: ['tui-tooltip'],
+        },
+        to: {
+            attrName: 'appearance',
+        },
+    },
+    {
+        from: {
+            attrName: '[mode]',
+            withTagNames: ['tui-tooltip'],
+        },
+        to: {
+            attrName: '[appearance]',
+        },
+    },
+    {
+        from: {
+            attrName: '[itemLabel]',
+            withTagNames: ['tui-feed-item'],
+        },
+        to: {
+            attrName: '[description]',
+        },
+    },
+    {
+        from: {
+            attrName: '[itemValue]',
+            withTagNames: ['tui-feed-item'],
+        },
+        to: {
+            attrName: '[title]',
+        },
+    },
+    {
+        from: {
+            attrName: '[sumLabel]',
+            withTagNames: ['tui-feed-item'],
+        },
+        to: {
+            attrName: '[secondaryDescription]',
+        },
+    },
+    {
+        from: {
+            attrName: '[sumValue]',
+            withTagNames: ['tui-feed-item'],
+        },
+        to: {
+            attrName: '[secondaryTitle]',
+        },
+    },
+    {
+        from: {
+            attrName: 'tuiDropdown',
+            withTagNames: ['*'],
+        },
+        to: {
+            attrName: 'tuiDropdownManual',
+        },
+    },
+    {
+        from: {
+            attrName: '[tuiDropdown]',
+            withTagNames: ['*'],
+        },
+        to: {
+            attrName: '[tuiDropdownManual]',
+        },
+    },
+    {
+        from: {
+            attrName: 'tuiDropdownContent',
+            withTagNames: ['*'],
+        },
+        to: {
+            attrName: 'tuiDropdown',
+        },
+    },
+    {
+        from: {
+            attrName: '[tuiDropdownContent]',
+            withTagNames: ['*'],
+        },
+        to: {
+            attrName: '[tuiDropdown]',
+        },
+    },
 ];
 exports.INPUTS_TO_REMOVE = [
     {
         inputName: 'iconAlign',
         tags: ['tui-input', 'tui-primitive-textfield', 'tui-input-tag'],
     },
+    {
+        inputName: 'tuiLabel',
+        tags: ['label'],
+    },
 ];
 exports.TAGS_TO_REPLACE = [
     {
@@ -283,6 +513,21 @@ exports.ATTR_TO_DIRECTIVE = [
             moduleSpecifier: '@taiga-ui/addon-doc',
         },
     },
+    {
+        componentSelector: ['tui-bar-chart', 'tui-pie-chart', 'tui-line-chart'],
+        inputProperty: 'hintContent',
+        directive: 'tuiHintContent',
+        directiveModule: {
+            name: 'TuiHintControllerModule',
+            moduleSpecifier: '@taiga-ui/core',
+        },
+    },
+];
+/**
+ * @example `<div [tuiDropdownSided]="true" />` => `<div tuiDropdownSided />`
+ */
+exports.TRUTHY_BOOLEAN_INPUT_TO_HTML_BINARY_ATTRIBUTE = [
+    'tuiDropdownSided',
 ];
 exports.TEMPLATE_COMMENTS = [
     {
@@ -305,6 +550,11 @@ exports.TEMPLATE_COMMENTS = [
         withAttr: 'pluralize',
         comment: 'See examples how create labels for ticks without this property (outside the component): https://taiga-ui.dev/components/range#segments',
     },
+    {
+        tag: 'tui-range',
+        withAttr: 'steps',
+        comment: 'This component has new API. Use property [step] instead. See: https://taiga-ui.dev/components/range/API',
+    },
     {
         tag: 'tui-preview-host',
         withAttr: 'ngProjectAs',
@@ -315,4 +565,14 @@ exports.TEMPLATE_COMMENTS = [
         withAttr: 'value',
         comment: 'This legacy component was replaced by 3 new ones (https://taiga-ui.dev/components/progress-bar | https://taiga-ui.dev/components/progress-circle | https://taiga-ui.dev/components/progress-segmented ) ',
     },
+    {
+        tag: 'tui-input-file',
+        withAttr: 'loadingFiles',
+        comment: 'This legacy component was replaced by new one (https://taiga-ui.dev/components/input-files) ',
+    },
+    {
+        tag: 'tui-input-tag',
+        withAttr: 'allowSpaces',
+        comment: 'Use property [separator] to forbid spaces. See example: https://taiga-ui.dev/components/input-tag#no-spaces-inside-tags',
+    },
 ];

package/schematics/ng-update/constants/warnings.js

@@ -98,4 +98,14 @@ exports.MIGRATION_WARNINGS = [
         moduleSpecifier: '@taiga-ui/proprietary-core',
         message: 'Proprietary Carousel is old and has different API. Use new version of the same module from @taiga-ui/kit. Also, check new API: https://taiga-ui.dev/components/carousel/API',
     },
+    {
+        name: 'TUI_EDITOR_STYLES',
+        moduleSpecifier: '@taiga-ui/addon-editor',
+        message: 'TUI_EDITOR_STYLES token has been deleted in 3.0, please use global styles to override default editor styles',
+    },
+    {
+        name: 'TuiNotificationContentContext',
+        moduleSpecifier: '@taiga-ui/core',
+        message: 'TuiNotificationContentContext has been deleted in 3.0. Please, use TuiDialog<TuiAlertOptions<I>, O> instead of TuiNotificationContentContext<O, I>',
+    },
 ];

package/schematics/ng-update/index.js

@@ -21,30 +21,33 @@ const colored_log_1 = require("../utils/colored-log");
 const migrate_date_time_1 = require("./steps/migrate-date-time");
 const add_styles_1 = require("../utils/add-styles");
 const taiga_styles_1 = require("../constants/taiga-styles");
-const { performance } = require('perf_hooks');
+const replace_styles_1 = require("./steps/replace-styles");
+const constants_1 = require("../constants");
+const get_execution_time_1 = require("../utils/get-execution-time");
+const migrate_taiga_proprietary_icons_1 = require("./steps/migrate-taiga-proprietary-icons");
 function updateToV3(options) {
     const t0 = performance.now();
     colored_log_1.titleLog(`\n\n${colored_log_1.START_SYMBOL} Your packages will be updated to @taiga-ui/*@${versions_1.TAIGA_VERSION}\n`);
     return schematics_1.chain([
         main(options),
         addTaigaStyles(options),
+        migrate_taiga_proprietary_icons_1.migrateTaigaProprietaryIcons(options),
         () => {
-            const t1 = performance.now();
-            const sum = t1 - t0;
-            const result = sum > 1000 ? `${(sum / 1000).toFixed(2)} sec.` : `${sum.toFixed(2)} ms.`;
-            colored_log_1.titleLog(`${colored_log_1.FINISH_SYMBOL} We migrated packages to @taiga-ui/*@${versions_1.TAIGA_VERSION} in ${result} \n`);
+            const executionTime = get_execution_time_1.getExecutionTime(t0, performance.now());
+            colored_log_1.titleLog(`${colored_log_1.FINISH_SYMBOL} We migrated packages to @taiga-ui/*@${versions_1.TAIGA_VERSION} in ${executionTime}. \n`);
         },
     ]);
 }
 exports.updateToV3 = updateToV3;
-function main(_) {
+function main(options) {
     return (tree, context) => tslib_1.__awaiter(this, void 0, void 0, function* () {
         const fileSystem = getFileSystem(tree);
-        replace_deep_import_1.replaceDeepImports();
+        !options['skip-deep-imports'] && replace_deep_import_1.replaceDeepImports();
         replace_enums_1.replaceEnums();
         rename_types_1.renameTypes();
         replace_const_1.replaceConstants();
         replace_services_1.replaceServices();
+        replace_styles_1.replaceStyles();
         show_warnings_1.showWarnings(context);
         migrate_templates_1.migrateTemplates(fileSystem);
         fileSystem.commitEdits();
@@ -60,13 +63,21 @@ function main(_) {
     });
 }
 function addTaigaStyles(options) {
-    return (_) => tslib_1.__awaiter(this, void 0, void 0, function* () {
+    return (tree, context) => tslib_1.__awaiter(this, void 0, void 0, function* () {
         const taigaStyles = [taiga_styles_1.TAIGA_THEME_FONTS];
-        return add_styles_1.addStylesToAngularJson(options, taigaStyles);
+        const stylesToReplace = {
+            from: taiga_styles_1.TAIGA_GLOBAL_OLD_STYLE,
+            to: [taiga_styles_1.TAIGA_GLOBAL_NEW_STYLE],
+        };
+        ng_morph_1.addPackageJsonDependency(tree, {
+            name: `@taiga-ui/styles`,
+            version: versions_1.TAIGA_VERSION,
+        });
+        return add_styles_1.addStylesToAngularJson(options, context, taigaStyles, existingStyles => !!(existingStyles === null || existingStyles === void 0 ? void 0 : existingStyles.some(s => String(s).includes('tinkoff-theme'))), stylesToReplace, tree);
     });
 }
 function getFileSystem(tree) {
-    const project = ng_morph_1.createProject(tree, '/', '**/**.{html,ts}');
+    const project = ng_morph_1.createProject(tree, '/', [constants_1.ALL_FILES]);
     ng_morph_1.setActiveProject(project);
     return project.getFileSystem().fs;
 }