@taiga-ui/cdk 3.0.0 → 3.2.0

package/schematics/ng-update/index.js

@@ -32,6 +32,7 @@ function updateToV3(options) {
         main(options),
         addTaigaStyles(options),
         migrate_taiga_proprietary_icons_1.migrateTaigaProprietaryIcons(options),
+        showNormalizeWarning(),
         () => {
             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`);
@@ -79,7 +80,20 @@ function addTaigaStyles(options) {
     });
 }
 function getFileSystem(tree) {
-    const project = ng_morph_1.createProject(tree, '/', [constants_1.ALL_FILES]);
+    const project = ng_morph_1.createProject(tree, '/', constants_1.ALL_FILES);
     ng_morph_1.setActiveProject(project);
     return project.getFileSystem().fs;
 }
+function showNormalizeWarning() {
+    return (tree, context) => {
+        var _a;
+        try {
+            if (!!((_a = ng_morph_1.getPackageJsonDependency(tree, '@taiga-ui/styles')) === null || _a === void 0 ? void 0 : _a.version)) {
+                context.logger.warn(replace_styles_1.TUI_WARNING_NORMALIZE);
+            }
+        }
+        catch (_b) {
+            // noop
+        }
+    };
+}

package/schematics/ng-update/steps/migrate-progress.js

@@ -17,7 +17,7 @@ function migrateProgress(fileSystem) {
     }
     fileSystem.commitEdits();
     ng_morph_1.saveActiveProject();
-    ng_morph_1.setActiveProject(ng_morph_1.createProject(fileSystem.tree, '/', '**/**'));
+    ng_morph_1.setActiveProject(ng_morph_1.createProject(fileSystem.tree, '/', constants_1.ALL_FILES));
     colored_log_1.successLog(`${colored_log_1.SMALL_TAB_SYMBOL}${colored_log_1.SUCCESS_SYMBOL} progress bars migrated \n`);
 }
 exports.migrateProgress = migrateProgress;

package/schematics/ng-update/steps/migrate-sliders/migrate-input-range.js

@@ -7,18 +7,29 @@ const ng_morph_1 = require("ng-morph");
 const ng_component_1 = require("../../../utils/angular/ng-component");
 const add_unique_import_1 = require("../../../utils/add-unique-import");
 const constants_1 = require("../../../constants");
+const progress_1 = require("../../../utils/progress");
 const MIN_LABELS_MIGRATION_METHOD_NAME = 'tuiMigrationInputRangeMinLabel';
 const MAX_LABELS_MIGRATION_METHOD_NAME = 'tuiMigrationInputRangeMaxLabel';
 function migrateInputRange(fileSystem) {
     const templateResources = get_component_templates_1.getComponentTemplates(constants_1.ALL_TS_FILES);
     const COMPONENTS_WITH_MIN_LABELS = new Set();
     const COMPONENTS_WITH_MAX_LABELS = new Set();
+    let progressLog = progress_1.setupProgressLogger({
+        total: templateResources.length,
+        prefix: '[replaceMinMaxLabel]',
+    });
     for (const templateResource of templateResources) {
+        progressLog(templateResource.componentPath);
         replaceMinLabel(templateResource, fileSystem, COMPONENTS_WITH_MIN_LABELS);
         replaceMaxLabel(templateResource, fileSystem, COMPONENTS_WITH_MAX_LABELS);
     }
     save(fileSystem);
+    progressLog = progress_1.setupProgressLogger({
+        total: COMPONENTS_WITH_MIN_LABELS.size,
+        prefix: '[COMPONENTS_WITH_MIN_LABELS]',
+    });
     for (const componentPath of Array.from(COMPONENTS_WITH_MIN_LABELS)) {
+        progressLog(componentPath);
         addMinMaxLabelMethod(componentPath, MIN_LABELS_MIGRATION_METHOD_NAME, [
             'const currentValue = context.$implicit;',
             'const minValue = 0; // TODO: (Taiga UI migration) replace with the MIN value of the input-range',
@@ -27,7 +38,12 @@ function migrateInputRange(fileSystem) {
             'return String(currentValue);',
         ]);
     }
+    progressLog = progress_1.setupProgressLogger({
+        total: COMPONENTS_WITH_MAX_LABELS.size,
+        prefix: '[COMPONENTS_WITH_MAX_LABELS]',
+    });
     for (const componentPath of Array.from(COMPONENTS_WITH_MAX_LABELS)) {
+        progressLog(componentPath);
         addMinMaxLabelMethod(componentPath, MAX_LABELS_MIGRATION_METHOD_NAME, [
             'const currentValue = context.$implicit;',
             'const maxValue = 100; // TODO: (Taiga UI migration) replace with the MAX value of the input',
@@ -83,5 +99,5 @@ function addMinMaxLabelMethod(componentPath, methodName, methodCode) {
 function save(fileSystem) {
     fileSystem.commitEdits();
     ng_morph_1.saveActiveProject();
-    ng_morph_1.setActiveProject(ng_morph_1.createProject(fileSystem.tree, '/', '**/**'));
+    ng_morph_1.setActiveProject(ng_morph_1.createProject(fileSystem.tree, '/', constants_1.ALL_FILES));
 }

package/schematics/ng-update/steps/migrate-sliders/migrate-input-slider.js

@@ -8,10 +8,16 @@ const add_unique_import_1 = require("../../../utils/add-unique-import");
 const get_component_templates_1 = require("../../../utils/templates/get-component-templates");
 const elements_1 = require("../../../utils/templates/elements");
 const constants_1 = require("../../../constants");
+const progress_1 = require("../../../utils/progress");
 function migrateInputSlider(fileSystem) {
     const templateResources = get_component_templates_1.getComponentTemplates(constants_1.ALL_TS_FILES);
     const COMPONENTS_WITH_MIN_MAX_LABELS = new Set();
+    let progressLog = progress_1.setupProgressLogger({
+        total: templateResources.length,
+        prefix: '[replaceMinMaxLabels]',
+    });
     for (const templateResource of templateResources) {
+        progressLog(templateResource.componentPath);
         replaceMinMaxLabels(templateResource, fileSystem, COMPONENTS_WITH_MIN_MAX_LABELS);
     }
     /**
@@ -20,8 +26,13 @@ function migrateInputSlider(fileSystem) {
      * */
     fileSystem.commitEdits();
     ng_morph_1.saveActiveProject();
-    ng_morph_1.setActiveProject(ng_morph_1.createProject(fileSystem.tree, '/', '**/**'));
+    ng_morph_1.setActiveProject(ng_morph_1.createProject(fileSystem.tree, '/', constants_1.ALL_FILES));
+    progressLog = progress_1.setupProgressLogger({
+        total: COMPONENTS_WITH_MIN_MAX_LABELS.size,
+        prefix: '[addMinMaxLabelMethod]',
+    });
     for (const componentPath of Array.from(COMPONENTS_WITH_MIN_MAX_LABELS)) {
+        progressLog(componentPath);
         addMinMaxLabelMethod(componentPath);
     }
 }

package/schematics/ng-update/steps/migrate-taiga-proprietary-icons.js

@@ -39,7 +39,14 @@ function migrateTaigaProprietaryIcons(options) {
                     context.logger.warn(`[WARNING]: Target project not found. ${MANUAL_MIGRATION_TIPS}`);
                     return;
                 }
-                const targetOptions = get_project_target_options_1.getProjectTargetOptions(project, 'build');
+                let targetOptions;
+                try {
+                    targetOptions = get_project_target_options_1.getProjectTargetOptions(project, 'build');
+                }
+                catch (_a) {
+                    context.logger.warn(`[WARNING]: No buildable project was found. ${MANUAL_MIGRATION_TIPS}`);
+                    return;
+                }
                 if (Array.isArray(targetOptions === null || targetOptions === void 0 ? void 0 : targetOptions.assets)) {
                     const tdsSrc = '@taiga-ui/proprietary-tds-icons/src';
                     const hasIcons = targetOptions.assets.find(asset => {

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

@@ -36,14 +36,15 @@ function migrateTemplates(fileSystem) {
         migrateBinaryAttributes,
         addWarningForFormatNumberPipe,
     ];
-    componentWithTemplatesPaths.forEach((resource, templateIndex, templates) => {
+    const progressLog = progress_1.setupProgressLogger({
+        total: componentWithTemplatesPaths.length,
+    });
+    componentWithTemplatesPaths.forEach(resource => {
         const path = fileSystem.resolve(template_resource_1.getPathFromTemplateResource(resource));
         const recorder = fileSystem.edit(path);
-        const isLastTemplate = templateIndex === templates.length - 1;
         actions.forEach((action, actionIndex) => {
             const isLastAction = actionIndex === actions.length - 1;
-            const progressLog = `${templateIndex + 1} / ${templates.length} (${action.name}...)`;
-            progress_1.printProgress(`${colored_log_1.SMALL_TAB_SYMBOL.repeat(2)}${progressLog}`, isLastTemplate && isLastAction);
+            progressLog(action.name, isLastAction);
             action({ resource, fileSystem, recorder });
         });
     });

package/schematics/ng-update/steps/migrate-textfield-controller.js

@@ -24,12 +24,12 @@ const TEXTFIELDS = [
 ];
 const ATTRS_MAP = {
     tuitextfieldautocomplete: 'autocomplete',
-    tuitextfieldinputMode: 'inputmode',
+    tuitextfieldinputmode: 'inputmode',
     tuitextfieldmaxlength: 'maxlength',
     tuitextfieldtype: 'type',
     tuitextfieldexampletext: 'placeholder',
     '[tuitextfieldautocomplete]': '[attr.autocomplete]',
-    '[tuitextfieldinputMode]': '[attr.inputmode]',
+    '[tuitextfieldinputmode]': '[attr.inputmode]',
     '[tuitextfieldmaxlength]': '[attr.maxlength]',
     '[tuitextfieldtype]': '[attr.type]',
     '[tuitextfieldexampletext]': '[attr.placeholder]',

package/schematics/ng-update/steps/replace-styles.d.ts

@@ -1 +1,2 @@
+export declare const TUI_WARNING_NORMALIZE = "\n// [WARNING]: In version 3.0 we drop to support normalize(v7) out-of-the-box\n// You need to manually download css file from https://necolas.github.io/normalize.css/\n// If you're looking to use reset styles or you can write your own reset.css";
 export declare function replaceStyles(): void;

package/schematics/ng-update/steps/replace-styles.js

@@ -1,8 +1,12 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.replaceStyles = void 0;
+exports.replaceStyles = exports.TUI_WARNING_NORMALIZE = void 0;
 const ng_morph_1 = require("ng-morph");
 const breakpoints_1 = require("../constants/breakpoints");
+exports.TUI_WARNING_NORMALIZE = `
+// [WARNING]: In version 3.0 we drop to support normalize(v7) out-of-the-box
+// You need to manually download css file from https://necolas.github.io/normalize.css/
+// If you're looking to use reset styles or you can write your own reset.css`;
 function replaceStyles() {
     var _a;
     (_a = ng_morph_1.getActiveProject()) === null || _a === void 0 ? void 0 : _a.getSourceFiles('**/**.less').forEach(sourceFile => {
@@ -12,7 +16,7 @@ function replaceStyles() {
                 fullText = fullText.replaceAll(new RegExp(`(?<=@media.*)(${from})(?=[\\s,{])`, 'g'), to);
             });
         }
-        sourceFile.replaceWithText(fullText.replace(`@import '~@taiga-ui/core/styles/taiga-ui-global';`, `@import '~@taiga-ui/styles/taiga-ui-global';`));
+        sourceFile.replaceWithText(fullText.replace(`@import '~@taiga-ui/core/styles/taiga-ui-global';`, `${exports.TUI_WARNING_NORMALIZE}\n@import '~@taiga-ui/styles/taiga-ui-global';`));
     });
 }
 exports.replaceStyles = replaceStyles;

package/schematics/utils/angular-json-manipulations.js

@@ -21,13 +21,21 @@ function isInvalidAngularJson(tree) {
 }
 exports.isInvalidAngularJson = isInvalidAngularJson;
 function addStylesToAngularJson(options, context, taigaStyles, filter, stylesToReplace, tree) {
+    const MANUAL_MIGRATION_TIPS = `Add styles ${taigaStyles.join(',')} to angular.json manually.`;
     return workspace_1.updateWorkspace(workspace => {
         const project = get_project_1.getProject(options, workspace);
         if (!project) {
-            context.logger.warn(`[WARNING]: Target project not found. Add styles ${taigaStyles.join(',')} to angular.json manually.`);
+            context.logger.warn(`[WARNING]: Target project not found. ${MANUAL_MIGRATION_TIPS}`);
+            return;
+        }
+        let targetOptions;
+        try {
+            targetOptions = get_project_target_options_1.getProjectTargetOptions(project, 'build');
+        }
+        catch (_a) {
+            context.logger.warn(`[WARNING]: No buildable project was found. ${MANUAL_MIGRATION_TIPS}`);
             return;
         }
-        const targetOptions = get_project_target_options_1.getProjectTargetOptions(project, 'build');
         const styles = targetOptions.styles;
         if (filter && filter(styles)) {
             return;

package/schematics/utils/colored-log.d.ts

@@ -7,5 +7,5 @@ export declare const SMALL_TAB_SYMBOL = "  ";
 export declare const START_SYMBOL = "\uD83D\uDE80";
 export declare const FINISH_SYMBOL = "\uD83C\uDFC6";
 export declare const REPLACE_SYMBOL = "\u26A1\uFE0F";
-export declare const PROCESSING_SYMBOL = "\u2611\uFE0F ";
+export declare const PROCESSING_SYMBOL = "> ";
 export declare const SUCCESS_SYMBOL = "\u2705 ";

package/schematics/utils/colored-log.js

@@ -25,5 +25,5 @@ exports.SMALL_TAB_SYMBOL = `  `; // @note: if you use \t then we have big gaps
 exports.START_SYMBOL = `🚀`;
 exports.FINISH_SYMBOL = `🏆`;
 exports.REPLACE_SYMBOL = `⚡️`;
-exports.PROCESSING_SYMBOL = `☑️ `;
+exports.PROCESSING_SYMBOL = `> `;
 exports.SUCCESS_SYMBOL = `✅ `;

package/schematics/utils/get-project.d.ts

@@ -1,3 +1,3 @@
-import { workspaces } from '@angular-devkit/core';
 import { Schema } from '../ng-add/schema';
-export declare function getProject(options: Schema, workspace: workspaces.WorkspaceDefinition): workspaces.ProjectDefinition | undefined;
+import { ProjectDefinition, WorkspaceDefinition } from '@angular-devkit/core/src/workspace';
+export declare function getProject(options: Schema, workspace: WorkspaceDefinition): ProjectDefinition | undefined;

package/schematics/utils/get-project.js

@@ -2,9 +2,12 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getProject = void 0;
 function getProject(options, workspace) {
-    var _a;
-    const projectName = options.project || ((_a = workspace.extensions.defaultProject) === null || _a === void 0 ? void 0 : _a.toString()) || '';
-    const project = workspace.projects.get(projectName);
-    return project;
+    var _a, _b;
+    const firstBuildableProjectName = (_a = Array.from(workspace.projects.entries()).find(([_, project]) => project.targets.get('build'))) === null || _a === void 0 ? void 0 : _a[0];
+    const projectName = options.project ||
+        ((_b = workspace.extensions.defaultProject) === null || _b === void 0 ? void 0 : _b.toString()) ||
+        firstBuildableProjectName ||
+        '';
+    return workspace.projects.get(projectName);
 }
 exports.getProject = getProject;

package/schematics/utils/progress.d.ts

@@ -1 +1,5 @@
-export declare function printProgress(progressLog: string, isLastLog?: boolean): void;
+export declare function setupProgressLogger({ total, prefix, tabs, }: {
+    total: number;
+    prefix?: string;
+    tabs?: number;
+}): (message: string, incrementIndex?: boolean) => void;

package/schematics/utils/progress.js

@@ -1,13 +1,20 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.printProgress = void 0;
+exports.setupProgressLogger = void 0;
 const readline_1 = require("readline");
-function printProgress(progressLog, isLastLog = false) {
-    readline_1.clearLine(process.stdout, 0);
-    readline_1.cursorTo(process.stdout, 0);
-    process.stdout.write(progressLog);
-    if (isLastLog) {
-        process.stdout.write('\n');
-    }
+const colored_log_1 = require("./colored-log");
+function setupProgressLogger({ total, prefix = '', tabs = 2, }) {
+    let i = 1;
+    return (message, incrementIndex = true) => {
+        const isLast = i === total;
+        const progressLog = `(${i} / ${total}) ${prefix} ${isLast ? colored_log_1.SUCCESS_SYMBOL : message}`;
+        i = incrementIndex ? i + 1 : i;
+        readline_1.clearLine(process.stdout, 0);
+        readline_1.cursorTo(process.stdout, 0);
+        process.stdout.write(colored_log_1.SMALL_TAB_SYMBOL.repeat(tabs) + progressLog);
+        if (isLast && incrementIndex) {
+            process.stdout.write('\n');
+        }
+    };
 }
-exports.printProgress = printProgress;
+exports.setupProgressLogger = setupProgressLogger;

package/services/destroy.service.d.ts

@@ -2,7 +2,12 @@ import { OnDestroy } from '@angular/core';
 import { ReplaySubject } from 'rxjs';
 import * as i0 from "@angular/core";
 /**
+ * @note:
  * Observable abstraction over ngOnDestroy to use with takeUntil
+ *
+ * Why we use `ReplaySubject` instead of `Subject`?
+ * Well, we’ll use ReplaySubject to emit the last message in case
+ * the subscription is ended after the component is destroyed.
  */
 export declare class TuiDestroyService extends ReplaySubject<void> implements OnDestroy {
     constructor();

package/utils/dom/point-to-client-rect.d.ts

@@ -1 +1 @@
-export declare function tuiPointToClientRect(x?: number, y?: number): ClientRect;
+export declare function tuiPointToClientRect(x?: number, y?: number): DOMRect;