@taiga-ui/cdk 2.49.0 → 2.50.0

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

@@ -2,42 +2,67 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const get_component_templates_1 = require("../../utils/templates/get-component-templates");
 const templates_1 = require("../constants/templates");
-const schematics_1 = require("@angular/cdk/schematics");
 const elements_1 = require("../../utils/templates/elements");
 const devkit_file_system_1 = require("ng-morph/project/classes/devkit-file-system");
+const ng_component_input_manipulations_1 = require("../../utils/templates/ng-component-input-manipulations");
+const template_resource_1 = require("../../utils/templates/template-resource");
+const ng_morph_1 = require("ng-morph");
 const START_TAG_OFFSET = 1;
 const END_TAG_OFFSET = 2;
 function migrateTemplates(tree) {
-    const templateResources = get_component_templates_1.getComponentTemplates('**/**');
     const fileSystem = new devkit_file_system_1.DevkitFileSystem(tree);
-    templateResources.forEach((resource) => {
-        if ('template' in resource) {
-            const template = resource.template;
-            const path = fileSystem.resolve(resource.componentPath);
+    const componentWithTemplatesPaths = get_component_templates_1.getComponentTemplates('**/**').map(({ componentPath }) => componentPath);
+    const actions = [replaceTags, replaceAttrs, replaceAttrsByDirective];
+    actions.forEach(action => {
+        componentWithTemplatesPaths.forEach(componentPath => {
+            // get updated version of template after the previous action
+            const [resource] = get_component_templates_1.getComponentTemplates(componentPath);
+            const path = fileSystem.resolve(template_resource_1.getPathFromTemplateResource(resource));
             const recorder = fileSystem.edit(path);
-            processTemplateUrl(template, recorder, resource.offset);
-        }
-        else {
-            const path = fileSystem.resolve(resource.templatePath);
-            const template = fileSystem.read(path);
-            const recorder = fileSystem.edit(path);
-            processTemplateUrl(template, recorder);
-        }
-        fileSystem.commitEdits();
+            action({ resource, fileSystem, recorder });
+        });
+        save(fileSystem);
     });
 }
 exports.migrateTemplates = migrateTemplates;
-function processTemplateUrl(template, recorder, templateOffset = 0) {
+/**
+ * We should update virtual file tree
+ * otherwise all following ng-morph commands will overwrite all previous template manipulations
+ * */
+function save(fileSystem) {
+    fileSystem.commitEdits();
+    ng_morph_1.saveActiveProject();
+    ng_morph_1.setActiveProject(ng_morph_1.createProject(fileSystem.tree, '/', '**/**'));
+}
+function replaceAttrsByDirective({ resource, fileSystem, }) {
+    templates_1.ATTR_TO_DIRECTIVE.forEach(({ componentSelector, directiveModule, directive, inputProperty }) => {
+        ng_component_input_manipulations_1.replaceInputPropertyByDirective({
+            componentSelector,
+            directiveModule,
+            directive,
+            inputProperty,
+            fileSystem,
+            templateResource: resource,
+        });
+    });
+}
+function replaceAttrs({ resource, recorder, fileSystem, }) {
+    const template = template_resource_1.getTemplateFromTemplateResource(resource, fileSystem);
+    const templateOffset = template_resource_1.getTemplateOffset(resource);
     templates_1.ATTRS_TO_REPLACE.forEach(({ from, to }) => {
         const offsets = [
-            ...schematics_1.findAttributeOnElementWithTag(template, from.attrName, from.withTagNames || []),
-            ...schematics_1.findAttributeOnElementWithAttrs(template, from.attrName, from.withAttrsNames || []),
+            ...elements_1.findAttributeOnElementWithTag(template, from.attrName, from.withTagNames || []),
+            ...elements_1.findAttributeOnElementWithAttrs(template, from.attrName, from.withAttrsNames || []),
         ];
         offsets.forEach(offset => {
             recorder.remove(offset + templateOffset, from.attrName.length + (to.attrName.length ? 0 : 1));
             recorder.insertRight(offset + templateOffset, to.attrName);
         });
     });
+}
+function replaceTags({ resource, recorder, fileSystem, }) {
+    const template = template_resource_1.getTemplateFromTemplateResource(resource, fileSystem);
+    const templateOffset = template_resource_1.getTemplateOffset(resource);
     templates_1.TAGS_TO_REPLACE.forEach(({ from, to, addAttributes }) => {
         const elements = elements_1.findElementsByTagName(template, from);
         elements.forEach(({ sourceCodeLocation }) => {

package/schematics/ng-update/steps/miscellaneous.d.ts

@@ -0,0 +1 @@
+export declare function miscellaneousMigrations(): void;

package/schematics/ng-update/steps/miscellaneous.js

@@ -0,0 +1,65 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const get_named_import_references_1 = require("../../utils/get-named-import-references");
+const ng_morph_1 = require("ng-morph");
+function miscellaneousMigrations() {
+    replaceEnumProperty({
+        enumName: 'TuiCurrency',
+        from: 'HongKong_dollar',
+        to: 'HongKongDollar',
+    });
+    replaceEnumProperty({
+        enumName: 'TuiCurrencyCode',
+        from: 'HongKong_dollar',
+        to: 'HongKongDollar',
+    });
+    addWarningToMethod('TuiDirectiveStylesService', 'addStyle', 'addStyle method has been removed. Use components approach');
+}
+exports.miscellaneousMigrations = miscellaneousMigrations;
+function addWarningToMethod(className, method, message) {
+    const references = get_named_import_references_1.getNamedImportReferences(className);
+    references.forEach(ref => {
+        const parent = ref.getParent();
+        if (ng_morph_1.Node.isTypeReferenceNode(parent)) {
+            checkMethod(parent, method, message);
+        }
+    });
+}
+function replaceEnumProperty({ enumName, from, to, }) {
+    const references = get_named_import_references_1.getNamedImportReferences(enumName);
+    references.forEach(ref => {
+        const parent = ref.getParent();
+        if (!ng_morph_1.Node.isPropertyAccessExpression(parent)) {
+            return;
+        }
+        parent.getChildren().forEach(node => {
+            if (node.getText() === from) {
+                node.replaceWithText(to);
+            }
+        });
+    });
+}
+function checkMethod(node, method, message) {
+    const statement = node.getParent();
+    const identifier = statement.getChildrenOfKind(ng_morph_1.SyntaxKind.Identifier)[0];
+    identifier.findReferencesAsNodes().forEach(ref => {
+        let parent = ref.getParent();
+        if ((ng_morph_1.Node.isPropertyAccessExpression(parent) &&
+            parent.getText().startsWith('this.')) ||
+            ng_morph_1.Node.isCallExpression(parent)) {
+            parent = parent.getParentIfKind(ng_morph_1.SyntaxKind.PropertyAccessExpression);
+        }
+        if (ng_morph_1.Node.isPropertyAccessExpression(parent)) {
+            parent.getChildrenOfKind(ng_morph_1.SyntaxKind.Identifier).forEach(identifier => {
+                if (identifier.getText() === method) {
+                    insertTodo(identifier, message);
+                }
+            });
+        }
+    });
+}
+function insertTodo(identifier, message) {
+    const startLinePos = identifier.getStartLinePos();
+    const sourceFile = identifier.getSourceFile();
+    sourceFile.insertText(startLinePos, `// TODO: ${message}\n`);
+}

package/schematics/ng-update/steps/remove-module.d.ts

@@ -0,0 +1,2 @@
+export declare function removeModules(): void;
+export declare function removeModule(name: string, moduleSpecifier: string): void;

package/schematics/ng-update/steps/remove-module.js

@@ -0,0 +1,24 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const ng_morph_1 = require("ng-morph");
+const get_named_import_references_1 = require("../../utils/get-named-import-references");
+const import_manipulations_1 = require("../../utils/import-manipulations");
+const modules_1 = require("../constants/modules");
+function removeModules() {
+    modules_1.REMOVED_MODULES.forEach(({ name, moduleSpecifier }) => removeModule(name, moduleSpecifier));
+}
+exports.removeModules = removeModules;
+function removeModule(name, moduleSpecifier) {
+    const references = get_named_import_references_1.getNamedImportReferences(name, moduleSpecifier);
+    references.forEach(ref => {
+        const parent = ref.getParent();
+        if (ng_morph_1.Node.isImportSpecifier(parent)) {
+            import_manipulations_1.removeImport(parent);
+        }
+        else if (ng_morph_1.Node.isArrayLiteralExpression(parent)) {
+            const index = parent.getElements().findIndex(el => el.getText() === name);
+            parent.removeElement(index);
+        }
+    });
+}
+exports.removeModule = removeModule;

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

@@ -11,7 +11,7 @@ function replaceConsts() {
 exports.replaceConsts = replaceConsts;
 function replaceConst({ from, to }) {
     const references = get_named_import_references_1.getNamedImportReferences(from.name, from.moduleSpecifier);
-    for (let ref of references) {
+    references.forEach(ref => {
         const parent = ref.getParent();
         if (ng_morph_1.Node.isImportSpecifier(parent)) {
             import_manipulations_1.removeImport(parent);
@@ -20,6 +20,6 @@ function replaceConst({ from, to }) {
         else {
             ref === null || ref === void 0 ? void 0 : ref.replaceWithText(to.name);
         }
-    }
+    });
 }
 exports.replaceConst = replaceConst;

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

@@ -0,0 +1 @@
+export declare function replaceFunctions(): void;

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

@@ -0,0 +1,61 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const get_named_import_references_1 = require("../../utils/get-named-import-references");
+const ng_morph_1 = require("ng-morph");
+const import_manipulations_1 = require("../../utils/import-manipulations");
+function replaceFunctions() {
+    replacePadStart(get_named_import_references_1.getNamedImportReferences('padStart', '@taiga-ui/cdk'));
+    replaceFallbackValue(get_named_import_references_1.getNamedImportReferences('fallbackValue', '@taiga-ui/cdk'));
+    replaceCustomEvent(get_named_import_references_1.getNamedImportReferences('tuiCustomEvent', '@taiga-ui/cdk'));
+    replaceClosestElement(get_named_import_references_1.getNamedImportReferences('getClosestElement', '@taiga-ui/cdk'));
+}
+exports.replaceFunctions = replaceFunctions;
+function replacePadStart(references) {
+    references.forEach(ref => {
+        var _a;
+        const parent = ref.getParent();
+        if (ng_morph_1.Node.isImportSpecifier(parent)) {
+            import_manipulations_1.removeImport(parent);
+        }
+        else if (ng_morph_1.Node.isCallExpression(parent)) {
+            const [targetString, length, pad] = parent.getArguments();
+            parent.replaceWithText(`${targetString.getText()}.padStart(${length.getText()}, ${(_a = pad === null || pad === void 0 ? void 0 : pad.getText()) !== null && _a !== void 0 ? _a : '" "'})`);
+        }
+    });
+}
+function replaceClosestElement(references) {
+    references.forEach(ref => {
+        const parent = ref.getParent();
+        if (ng_morph_1.Node.isImportSpecifier(parent)) {
+            import_manipulations_1.removeImport(parent);
+        }
+        else if (ng_morph_1.Node.isCallExpression(parent)) {
+            const [firstArg, secondArg] = parent.getArguments();
+            parent.replaceWithText(`${firstArg.getText()}.closest(${secondArg.getText()})`);
+        }
+    });
+}
+function replaceCustomEvent(references) {
+    references.forEach(ref => {
+        const parent = ref.getParent();
+        if (ng_morph_1.Node.isImportSpecifier(parent)) {
+            import_manipulations_1.removeImport(parent);
+        }
+        else if (ng_morph_1.Node.isCallExpression(parent)) {
+            const [firstArg, secondArg] = parent.getArguments();
+            parent.replaceWithText(`new CustomEvent(${firstArg.getText()}, ${secondArg.getText()})`);
+        }
+    });
+}
+function replaceFallbackValue(references) {
+    references.forEach(ref => {
+        const parent = ref.getParent();
+        if (ng_morph_1.Node.isImportSpecifier(parent)) {
+            import_manipulations_1.removeImport(parent);
+        }
+        else if (ng_morph_1.Node.isCallExpression(parent)) {
+            const [firstArg, secondArg] = parent.getArguments();
+            parent.replaceWithText(`${firstArg.getText()} ?? ${secondArg.getText()}`);
+        }
+    });
+}

package/schematics/utils/add-unique-import.js

@@ -16,7 +16,7 @@ function addUniqueImport(filePath, namedImport, moduleSpecifier) {
         const modules = existingDeclaration[0]
             .getNamedImports()
             .map(namedImport => namedImport.getText());
-        ng_morph_1.editImports(existingDeclaration, () => ({
+        ng_morph_1.editImports(existingDeclaration[0], () => ({
             namedImports: [...modules, namedImport],
         }));
         return;

package/schematics/utils/get-project.js

@@ -2,7 +2,8 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const schematics_1 = require("@angular-devkit/schematics");
 function getProject(options, workspace) {
-    const projectName = options.project || workspace.extensions.defaultProject.toString();
+    var _a;
+    const projectName = options.project || ((_a = workspace.extensions.defaultProject) === null || _a === void 0 ? void 0 : _a.toString()) || '';
     const project = workspace.projects.get(projectName);
     if (!project) {
         throw new schematics_1.SchematicsException(`Unable to find project '${projectName}' in the workspace`);

package/schematics/utils/templates/elements.d.ts

@@ -1,2 +1,21 @@
 import { Element } from 'parse5';
 export declare function findElementsByTagName(html: string, tagName: string): Element[];
+/**
+ * Parses a HTML fragment and traverses all AST nodes in order find elements that
+ * include the specified attribute.
+ */
+export declare function findElementsWithAttribute(html: string, attributeName: string): Element[];
+/**
+ * Finds elements with explicit tag names that also contain the specified attribute. Returns the
+ * attribute start offset based on the specified HTML.
+ */
+export declare function findAttributeOnElementWithTag(html: string, name: string, tagNames: string[], filterFn?: (element: Element) => boolean): number[];
+/**
+ * Finds elements that contain the given attribute and contain at least one of the other
+ * specified attributes. Returns the primary attribute's start offset based on the specified HTML.
+ */
+export declare function findAttributeOnElementWithAttrs(html: string, name: string, attrs: string[], filterFn?: (element: Element) => boolean): number[];
+/** Shorthand function that checks if the specified element contains the given attribute. */
+export declare function hasElementAttribute(element: Element, attributeName: string): boolean;
+/** Gets the start offset of the given attribute from a Parse5 element. */
+export declare function getStartOffsetOfAttribute(element: Element, attributeName: string): number;

package/schematics/utils/templates/elements.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const parse5_1 = require("parse5");
+const ALWAYS_TRUE_HANDLER = () => true;
 function findElementsByTagName(html, tagName) {
     const document = parse5_1.parseFragment(html, { sourceCodeLocationInfo: true });
     const elements = [];
@@ -19,3 +20,60 @@ function findElementsByTagName(html, tagName) {
     return elements;
 }
 exports.findElementsByTagName = findElementsByTagName;
+/**
+ * Parses a HTML fragment and traverses all AST nodes in order find elements that
+ * include the specified attribute.
+ */
+function findElementsWithAttribute(html, attributeName) {
+    const document = parse5_1.parseFragment(html, { sourceCodeLocationInfo: true });
+    const elements = [];
+    const visitNodes = (nodes) => {
+        nodes.forEach(n => {
+            var _a;
+            const node = n;
+            if (node.childNodes) {
+                visitNodes(node.childNodes);
+            }
+            if ((_a = node.attrs) === null || _a === void 0 ? void 0 : _a.some(attr => attr.name === attributeName.toLowerCase())) {
+                elements.push(node);
+            }
+        });
+    };
+    visitNodes(document.childNodes);
+    return elements;
+}
+exports.findElementsWithAttribute = findElementsWithAttribute;
+/**
+ * Finds elements with explicit tag names that also contain the specified attribute. Returns the
+ * attribute start offset based on the specified HTML.
+ */
+function findAttributeOnElementWithTag(html, name, tagNames, filterFn = ALWAYS_TRUE_HANDLER) {
+    return findElementsWithAttribute(html, name)
+        .filter(element => tagNames.includes(element.tagName) && filterFn(element))
+        .map(element => getStartOffsetOfAttribute(element, name));
+}
+exports.findAttributeOnElementWithTag = findAttributeOnElementWithTag;
+/**
+ * Finds elements that contain the given attribute and contain at least one of the other
+ * specified attributes. Returns the primary attribute's start offset based on the specified HTML.
+ */
+function findAttributeOnElementWithAttrs(html, name, attrs, filterFn = ALWAYS_TRUE_HANDLER) {
+    return findElementsWithAttribute(html, name)
+        .filter(element => attrs.some(attr => hasElementAttribute(element, attr)) &&
+        filterFn(element))
+        .map(element => getStartOffsetOfAttribute(element, name));
+}
+exports.findAttributeOnElementWithAttrs = findAttributeOnElementWithAttrs;
+/** Shorthand function that checks if the specified element contains the given attribute. */
+function hasElementAttribute(element, attributeName) {
+    return (element.attrs &&
+        element.attrs.some(attr => attr.name === attributeName.toLowerCase()));
+}
+exports.hasElementAttribute = hasElementAttribute;
+/** Gets the start offset of the given attribute from a Parse5 element. */
+function getStartOffsetOfAttribute(element, attributeName) {
+    var _a, _b;
+    return ((((_a = element.sourceCodeLocation) === null || _a === void 0 ? void 0 : _a.attrs) && ((_b = element.sourceCodeLocation.attrs[attributeName.toLowerCase()]) === null || _b === void 0 ? void 0 : _b.startOffset)) ||
+        0);
+}
+exports.getStartOffsetOfAttribute = getStartOffsetOfAttribute;

package/schematics/utils/templates/ng-component-input-manipulations.d.ts

@@ -1,4 +1,5 @@
 import { DevkitFileSystem } from 'ng-morph/project/classes/devkit-file-system';
+import { Element } from 'parse5';
 import { TemplateResource } from '../../ng-update/interfaces/template-resourse';
 /**
  * Replace component input property by new value
@@ -25,17 +26,35 @@ import { TemplateResource } from '../../ng-update/interfaces/template-resourse';
  * ___
  * @return true if something was changed
  */
-export declare function replaceInputProperty({ templateResource, fileSystem, componentSelector, from, to, }: {
+export declare function replaceInputProperty({ templateResource, fileSystem, componentSelector, from, to, newValue, filterFn, }: {
     templateResource: TemplateResource;
     fileSystem: DevkitFileSystem;
-    componentSelector: string;
+    componentSelector: string | string[];
     from: string;
     to: string;
+    newValue?: string;
+    filterFn?: (element: Element) => boolean;
 }): boolean;
+/**
+ * @example
+ * // 10 symbols before property `size` and string `size="s"` has 8-symbols length
+ * const template = '<tui-card size="s"></tui-card>';
+ *
+ * getInputPropertyOffsets(template, 'size', ['tui-card']) // [[10, 18]]
+ */
+export declare function getInputPropertyOffsets(html: string, attrName: string, tags: string[], filterFn?: (element: Element) => boolean): [number, number][];
+/**
+ * @example
+ * // `<tui-card size="` has 16-symbols length
+ * const template = '<tui-card size="xl"></tui-card>';
+ *
+ * getInputPropertyValueOffsets(template, 'size', ['tui-card']) // [ [16, 18] ]
+ */
+export declare function getInputPropertyValueOffsets(template: string, attrName: string, tags: string[]): [number, number][];
 export declare function replaceInputPropertyByDirective({ templateResource, fileSystem, componentSelector, inputProperty, directive, directiveModule, }: {
     templateResource: TemplateResource;
     fileSystem: DevkitFileSystem;
-    componentSelector: string;
+    componentSelector: string | string[];
     inputProperty: string;
     directive: string;
     directiveModule?: {
@@ -43,3 +62,15 @@ export declare function replaceInputPropertyByDirective({ templateResource, file
         moduleSpecifier: string;
     };
 }): void;
+/**
+ * After removing property from the tag (which uses multi lines inside template) it can leave redundant space.
+ * It is not critical because html is valid even with this extra space.
+ * TODO: Find a way to fix it
+ */
+export declare function removeInputProperty({ templateResource, fileSystem, componentSelector, inputProperty, filterFn, }: {
+    templateResource: TemplateResource;
+    fileSystem: DevkitFileSystem;
+    componentSelector: string;
+    inputProperty: string;
+    filterFn?: (element: Element) => boolean;
+}): void;

package/schematics/utils/templates/ng-component-input-manipulations.js

@@ -1,11 +1,11 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-const schematics_1 = require("@angular/cdk/schematics");
 const template_resource_1 = require("./template-resource");
 const ng_component_1 = require("../angular/ng-component");
 const ng_module_1 = require("../angular/ng-module");
 const ng_morph_1 = require("ng-morph");
 const add_unique_import_1 = require("../add-unique-import");
+const elements_1 = require("./elements");
 /**
  * Replace component input property by new value
  * ___
@@ -31,31 +31,76 @@ const add_unique_import_1 = require("../add-unique-import");
  * ___
  * @return true if something was changed
  */
-function replaceInputProperty({ templateResource, fileSystem, componentSelector, from, to, }) {
+function replaceInputProperty({ templateResource, fileSystem, componentSelector, from, to, newValue = '', filterFn, }) {
     const template = template_resource_1.getTemplateFromTemplateResource(templateResource, fileSystem);
     const path = fileSystem.resolve(template_resource_1.getPathFromTemplateResource(templateResource));
     const recorder = fileSystem.edit(path);
     const templateOffset = template_resource_1.getTemplateOffset(templateResource);
-    const stringProperties = schematics_1.findAttributeOnElementWithTag(template, from, [
-        componentSelector,
-    ]);
-    const propertyBindings = schematics_1.findAttributeOnElementWithTag(template, `[${from}]`, [
-        componentSelector,
-    ]);
+    const selector = Array.isArray(componentSelector)
+        ? componentSelector
+        : [componentSelector];
+    const stringProperties = [
+        ...elements_1.findAttributeOnElementWithTag(template, from, selector, filterFn),
+        ...elements_1.findAttributeOnElementWithAttrs(template, from, selector, filterFn),
+    ].map(offset => templateOffset + offset);
+    const propertyBindings = [
+        ...elements_1.findAttributeOnElementWithTag(template, `[${from}]`, selector, filterFn),
+        ...elements_1.findAttributeOnElementWithAttrs(template, `[${from}]`, selector, filterFn),
+    ].map(offset => templateOffset + offset);
+    const propertyValues = newValue
+        ? getInputPropertyValueOffsets(template, from, selector).map(([start, end]) => [
+            templateOffset + start,
+            templateOffset + end,
+        ])
+        : [];
     if (!stringProperties.length && !propertyBindings.length) {
         return false;
     }
     stringProperties.forEach(offset => {
-        recorder.remove(offset + templateOffset, from.length);
-        recorder.insertRight(offset + templateOffset, to);
+        recorder.remove(offset, from.length);
+        recorder.insertRight(offset, to);
     });
     propertyBindings.forEach(offset => {
-        recorder.remove(offset + templateOffset, `[${from}]`.length);
-        recorder.insertRight(offset + templateOffset, `[${to}]`);
+        recorder.remove(offset, `[${from}]`.length);
+        recorder.insertRight(offset, to.startsWith('[') ? to : `[${to}]`);
+    });
+    propertyValues.forEach(([startOffset, endOffset]) => {
+        recorder.remove(startOffset, endOffset - startOffset);
+        recorder.insertRight(startOffset, newValue);
     });
     return true;
 }
 exports.replaceInputProperty = replaceInputProperty;
+/**
+ * @example
+ * // 10 symbols before property `size` and string `size="s"` has 8-symbols length
+ * const template = '<tui-card size="s"></tui-card>';
+ *
+ * getInputPropertyOffsets(template, 'size', ['tui-card']) // [[10, 18]]
+ */
+function getInputPropertyOffsets(html, attrName, tags, filterFn = () => true) {
+    return elements_1.findElementsWithAttribute(html, attrName)
+        .filter(element => tags.includes(element.tagName) && filterFn(element))
+        .map((element) => {
+        var _a, _b;
+        const { startOffset = 0, endOffset = 0 } = ((_b = (_a = element.sourceCodeLocation) === null || _a === void 0 ? void 0 : _a.attrs) === null || _b === void 0 ? void 0 : _b[attrName.toLowerCase()]) || {};
+        return [startOffset, endOffset];
+    });
+}
+exports.getInputPropertyOffsets = getInputPropertyOffsets;
+/**
+ * @example
+ * // `<tui-card size="` has 16-symbols length
+ * const template = '<tui-card size="xl"></tui-card>';
+ *
+ * getInputPropertyValueOffsets(template, 'size', ['tui-card']) // [ [16, 18] ]
+ */
+function getInputPropertyValueOffsets(template, attrName, tags) {
+    const stringProperties = getInputPropertyOffsets(template, attrName, tags).map(([start, end]) => [start + attrName.length + '="'.length, end - 1]);
+    const propertyBindings = getInputPropertyOffsets(template, `[${attrName}]`, tags).map(([start, end]) => [start + `[${attrName}]`.length + '="'.length, end - 1]);
+    return [...stringProperties, ...propertyBindings];
+}
+exports.getInputPropertyValueOffsets = getInputPropertyValueOffsets;
 function replaceInputPropertyByDirective({ templateResource, fileSystem, componentSelector, inputProperty, directive, directiveModule, }) {
     const wasModified = replaceInputProperty({
         templateResource,
@@ -76,3 +121,22 @@ function replaceInputPropertyByDirective({ templateResource, fileSystem, compone
     }
 }
 exports.replaceInputPropertyByDirective = replaceInputPropertyByDirective;
+/**
+ * After removing property from the tag (which uses multi lines inside template) it can leave redundant space.
+ * It is not critical because html is valid even with this extra space.
+ * TODO: Find a way to fix it
+ */
+function removeInputProperty({ templateResource, fileSystem, componentSelector, inputProperty, filterFn, }) {
+    const template = template_resource_1.getTemplateFromTemplateResource(templateResource, fileSystem);
+    const templateOffset = template_resource_1.getTemplateOffset(templateResource);
+    const path = fileSystem.resolve(template_resource_1.getPathFromTemplateResource(templateResource));
+    const recorder = fileSystem.edit(path);
+    const propertyOffsets = [
+        ...getInputPropertyOffsets(template, inputProperty, [componentSelector], filterFn),
+        ...getInputPropertyOffsets(template, `[${inputProperty}]`, [componentSelector], filterFn),
+    ].map(([start, end]) => [templateOffset + start, templateOffset + end]);
+    propertyOffsets.forEach(([start, end]) => {
+        recorder.remove(start, end - start);
+    });
+}
+exports.removeInputProperty = removeInputProperty;

package/tokens/taiga-ui-cdk-tokens.metadata.json

@@ -1 +1 @@
-{"__symbolic":"module","version":4,"metadata":{"TUI_ACTIVE_ELEMENT":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":22,"character":38},"arguments":["Active element on the document for ActiveZone",{"__symbolic":"error","message":"Lambda not supported","line":25,"character":17,"module":"./active-element"}]},"TUI_ALERTS":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":4,"character":30},"arguments":["A stream of alerts",{"__symbolic":"error","message":"Lambda not supported","line":7,"character":13,"module":"./alerts"}]},"TUI_DEFAULT_RENDERER":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":3,"character":40},"arguments":["A Renderer2 for global services",{"__symbolic":"error","message":"Lambda not supported","line":7,"character":17,"module":"./default-renderer"}]},"TUI_DIALOGS":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":4,"character":31},"arguments":["A stream of dialogs",{"__symbolic":"error","message":"Lambda not supported","line":7,"character":13,"module":"./dialogs"}]},"TUI_FOCUSABLE_ITEM_ACCESSOR":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":4,"character":8},"arguments":["A component that can be focused"]},"TUI_IS_ANDROID":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":5,"character":34},"arguments":["Mobile browser that is not iOS (technically includes Windows Phone, Blackberry etc.)",{"__symbolic":"error","message":"Lambda not supported","line":8,"character":17,"module":"./is-android"}]},"TUI_IS_APPLE":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":4,"character":32},"arguments":["Apple(safari/webkit) detection",{"__symbolic":"error","message":"Lambda not supported","line":6,"character":14,"module":"./is-apple"}]},"TUI_IS_CHROMIUM":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":3,"character":35},"arguments":["Chromium browser engine detection",{"__symbolic":"error","message":"Lambda not supported","line":6,"character":17,"module":"./is-chromium"}]},"WindowWithCypress":{"__symbolic":"interface"},"TUI_IS_CYPRESS":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":10,"character":34},"arguments":["Detect if app is running under Cypress",{"__symbolic":"error","message":"Lambda not supported","line":13,"character":17,"module":"./is-cypress"}]},"TUI_IS_FIREFOX":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":3,"character":34},"arguments":["Firefox browser engine detection",{"__symbolic":"error","message":"Lambda not supported","line":6,"character":17,"module":"./is-firefox"}]},"TUI_IS_IOS":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":4,"character":30},"arguments":["iOS browser detection",{"__symbolic":"error","message":"Lambda not supported","line":5,"character":13,"module":"./is-ios"}]},"TUI_IS_MOBILE":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":9,"character":33},"arguments":["Mobile browser detection",{"__symbolic":"error","message":"Lambda not supported","line":10,"character":13,"module":"./is-mobile"}]},"TUI_IS_WEBKIT":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":3,"character":33},"arguments":["Webkit browser engine detection",{"__symbolic":"error","message":"Lambda not supported","line":6,"character":17,"module":"./is-webkit"}]},"TUI_REMOVED_ELEMENT":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":5,"character":39},"arguments":["Element currently being removed by AnimationEngine",{"__symbolic":"error","message":"Lambda not supported","line":8,"character":17,"module":"./removed-element"}]},"TUI_SANITIZER":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":3,"character":33},"arguments":["A custom Sanitizer to sanitize source before inlining"]},"TUI_SWIPE_OPTIONS":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":3,"character":37},"arguments":["Swipe options",{"__symbolic":"error","message":"Lambda not supported","line":4,"character":13,"module":"./swipe-options"}]},"TUI_TAKE_ONLY_TRUSTED_EVENTS":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":9,"character":8},"arguments":["This token need for override behavior the `pressedObservable` function",{"__symbolic":"error","message":"Lambda not supported","line":12,"character":21,"module":"./take-only-trusted-events"}]},"TUI_TOUCH_SUPPORTED":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":3,"character":39},"arguments":["Touch support detection",{"__symbolic":"error","message":"Lambda not supported","line":4,"character":13,"module":"./touch-supported"}]},"TUI_WINDOW_HEIGHT":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":6,"character":37},"arguments":["Window height accounting for disappearing address bar",{"__symbolic":"error","message":"Lambda not supported","line":9,"character":17,"module":"./window-height"}]},"TUI_ZOOM_OPTIONS":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":3,"character":36},"arguments":["Zoom options",{"__symbolic":"error","message":"Lambda not supported","line":4,"character":13,"module":"./zoom-options"}]}},"origins":{"TUI_ACTIVE_ELEMENT":"./active-element","TUI_ALERTS":"./alerts","TUI_DEFAULT_RENDERER":"./default-renderer","TUI_DIALOGS":"./dialogs","TUI_FOCUSABLE_ITEM_ACCESSOR":"./focusable-item-accessor","TUI_IS_ANDROID":"./is-android","TUI_IS_APPLE":"./is-apple","TUI_IS_CHROMIUM":"./is-chromium","WindowWithCypress":"./is-cypress","TUI_IS_CYPRESS":"./is-cypress","TUI_IS_FIREFOX":"./is-firefox","TUI_IS_IOS":"./is-ios","TUI_IS_MOBILE":"./is-mobile","TUI_IS_WEBKIT":"./is-webkit","TUI_REMOVED_ELEMENT":"./removed-element","TUI_SANITIZER":"./sanitizer","TUI_SWIPE_OPTIONS":"./swipe-options","TUI_TAKE_ONLY_TRUSTED_EVENTS":"./take-only-trusted-events","TUI_TOUCH_SUPPORTED":"./touch-supported","TUI_WINDOW_HEIGHT":"./window-height","TUI_ZOOM_OPTIONS":"./zoom-options"},"importAs":"@taiga-ui/cdk/tokens"}
+{"__symbolic":"module","version":4,"metadata":{"TUI_ACTIVE_ELEMENT":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":22,"character":38},"arguments":["Active element on the document for ActiveZone",{"__symbolic":"error","message":"Lambda not supported","line":25,"character":17,"module":"./active-element"}]},"TUI_ALERTS":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":4,"character":30},"arguments":["A stream of alerts",{"__symbolic":"error","message":"Lambda not supported","line":7,"character":13,"module":"./alerts"}]},"TUI_DEFAULT_RENDERER":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":3,"character":40},"arguments":["A Renderer2 for global services",{"__symbolic":"error","message":"Lambda not supported","line":7,"character":17,"module":"./default-renderer"}]},"TUI_DIALOGS":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":4,"character":31},"arguments":["A stream of dialogs",{"__symbolic":"error","message":"Lambda not supported","line":7,"character":13,"module":"./dialogs"}]},"TUI_FOCUSABLE_ITEM_ACCESSOR":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":4,"character":8},"arguments":["A component that can be focused"]},"TUI_IS_ANDROID":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":5,"character":34},"arguments":["Mobile browser that is not iOS (technically includes Windows Phone, Blackberry etc.)",{"__symbolic":"error","message":"Lambda not supported","line":8,"character":17,"module":"./is-android"}]},"TUI_IS_APPLE":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":4,"character":32},"arguments":["Apple(safari/webkit) detection",{"__symbolic":"error","message":"Lambda not supported","line":6,"character":14,"module":"./is-apple"}]},"TUI_IS_CHROMIUM":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":3,"character":35},"arguments":["Chromium browser engine detection",{"__symbolic":"error","message":"Lambda not supported","line":6,"character":17,"module":"./is-chromium"}]},"WindowWithCypress":{"__symbolic":"interface"},"TUI_IS_CYPRESS":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":11,"character":34},"arguments":["Detect if app is running under Cypress",{"__symbolic":"error","message":"Lambda not supported","line":14,"character":17,"module":"./is-cypress"}]},"TUI_IS_FIREFOX":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":3,"character":34},"arguments":["Firefox browser engine detection",{"__symbolic":"error","message":"Lambda not supported","line":6,"character":17,"module":"./is-firefox"}]},"TUI_IS_IOS":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":4,"character":30},"arguments":["iOS browser detection",{"__symbolic":"error","message":"Lambda not supported","line":5,"character":13,"module":"./is-ios"}]},"TUI_IS_MOBILE":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":9,"character":33},"arguments":["Mobile browser detection",{"__symbolic":"error","message":"Lambda not supported","line":10,"character":13,"module":"./is-mobile"}]},"TUI_IS_WEBKIT":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":3,"character":33},"arguments":["Webkit browser engine detection",{"__symbolic":"error","message":"Lambda not supported","line":6,"character":17,"module":"./is-webkit"}]},"TUI_REMOVED_ELEMENT":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":5,"character":39},"arguments":["Element currently being removed by AnimationEngine",{"__symbolic":"error","message":"Lambda not supported","line":8,"character":17,"module":"./removed-element"}]},"TUI_SANITIZER":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":3,"character":33},"arguments":["A custom Sanitizer to sanitize source before inlining"]},"TUI_SWIPE_OPTIONS":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":3,"character":37},"arguments":["Swipe options",{"__symbolic":"error","message":"Lambda not supported","line":4,"character":13,"module":"./swipe-options"}]},"TUI_TAKE_ONLY_TRUSTED_EVENTS":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":9,"character":8},"arguments":["This token need for override behavior the `pressedObservable` function",{"__symbolic":"error","message":"Lambda not supported","line":12,"character":21,"module":"./take-only-trusted-events"}]},"TUI_TOUCH_SUPPORTED":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":3,"character":39},"arguments":["Touch support detection",{"__symbolic":"error","message":"Lambda not supported","line":4,"character":13,"module":"./touch-supported"}]},"TUI_WINDOW_HEIGHT":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":6,"character":37},"arguments":["Window height accounting for disappearing address bar",{"__symbolic":"error","message":"Lambda not supported","line":9,"character":17,"module":"./window-height"}]},"TUI_ZOOM_OPTIONS":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":3,"character":36},"arguments":["Zoom options",{"__symbolic":"error","message":"Lambda not supported","line":4,"character":13,"module":"./zoom-options"}]}},"origins":{"TUI_ACTIVE_ELEMENT":"./active-element","TUI_ALERTS":"./alerts","TUI_DEFAULT_RENDERER":"./default-renderer","TUI_DIALOGS":"./dialogs","TUI_FOCUSABLE_ITEM_ACCESSOR":"./focusable-item-accessor","TUI_IS_ANDROID":"./is-android","TUI_IS_APPLE":"./is-apple","TUI_IS_CHROMIUM":"./is-chromium","WindowWithCypress":"./is-cypress","TUI_IS_CYPRESS":"./is-cypress","TUI_IS_FIREFOX":"./is-firefox","TUI_IS_IOS":"./is-ios","TUI_IS_MOBILE":"./is-mobile","TUI_IS_WEBKIT":"./is-webkit","TUI_REMOVED_ELEMENT":"./removed-element","TUI_SANITIZER":"./sanitizer","TUI_SWIPE_OPTIONS":"./swipe-options","TUI_TAKE_ONLY_TRUSTED_EVENTS":"./take-only-trusted-events","TUI_TOUCH_SUPPORTED":"./touch-supported","TUI_WINDOW_HEIGHT":"./window-height","TUI_ZOOM_OPTIONS":"./zoom-options"},"importAs":"@taiga-ui/cdk/tokens"}