diff --git a/package-lock.json b/package-lock.json index 56eb31e9ddbb..c2dde3eee18f 100644 --- a/package-lock.json +++ b/package-lock.json @@ -31,9 +31,9 @@ "@taiga-ui/browserslist-config": "0.6.0", "@taiga-ui/commitlint-config": "0.7.5", "@taiga-ui/cspell-config": "0.40.0", - "@taiga-ui/eslint-plugin-experience": "0.74.10", - "@taiga-ui/prettier-config": "0.11.7", - "@taiga-ui/stylelint-config": "0.22.2", + "@taiga-ui/eslint-plugin-experience": "0.75.3", + "@taiga-ui/prettier-config": "0.11.9", + "@taiga-ui/stylelint-config": "0.22.3", "@taiga-ui/tsconfig": "0.17.0", "@tinkoff/ng-event-plugins": "3.2.0", "@types/glob": "8.1.0", @@ -944,74 +944,73 @@ } }, "node_modules/@angular-eslint/bundled-angular-compiler": { - "version": "17.5.2", - "resolved": "https://registry.npmjs.org/@angular-eslint/bundled-angular-compiler/-/bundled-angular-compiler-17.5.2.tgz", - "integrity": "sha512-K4hVnMyI98faMJmsA4EOBkD0tapDjWV5gy0j/wJ2uSL46d3JgZPZNJSO1zStf/b3kT4gLOlQ/ulWFiUf1DxgIw==", + "version": "18.0.1", + "resolved": "https://registry.npmjs.org/@angular-eslint/bundled-angular-compiler/-/bundled-angular-compiler-18.0.1.tgz", + "integrity": "sha512-lr4Ysoo28FBOKcJFQUGTMpbWDcak+gyuYvyggp37ERvazE6EDomPFxzEHNqVT9EI9sZ+GDBOoPR+EdFh0ALGNw==", "dev": true, "peer": true }, "node_modules/@angular-eslint/eslint-plugin": { - "version": "17.5.2", - "resolved": "https://registry.npmjs.org/@angular-eslint/eslint-plugin/-/eslint-plugin-17.5.2.tgz", - "integrity": "sha512-kzPALKyT5XIEbgoNmY/hEZWdMWKTX56Pap9fVLJSC/b+Nd+MXc7TNly2s0XoC0Ru1/kMiVzbmSGPheu/rw+9aA==", + "version": "18.0.1", + "resolved": "https://registry.npmjs.org/@angular-eslint/eslint-plugin/-/eslint-plugin-18.0.1.tgz", + "integrity": "sha512-pS3SYLa9DA+ENklGxEUlcw6/xCxgDk9fgjyaheuSjDxL3TIh1pTa4V2TptODdcPh7XCYXiVmy+e/w79mXlGzOw==", "dev": true, "peer": true, "dependencies": { - "@angular-eslint/bundled-angular-compiler": "17.5.2", - "@angular-eslint/utils": "17.5.2", - "@typescript-eslint/utils": "7.11.0" + "@angular-eslint/bundled-angular-compiler": "18.0.1", + "@angular-eslint/utils": "18.0.1" }, "peerDependencies": { - "eslint": "^7.20.0 || ^8.0.0", + "@typescript-eslint/utils": "^7.11.0 || ^8.0.0-alpha.20", + "eslint": "^8.57.0 || ^9.0.0", "typescript": "*" } }, "node_modules/@angular-eslint/eslint-plugin-template": { - "version": "17.5.2", - "resolved": "https://registry.npmjs.org/@angular-eslint/eslint-plugin-template/-/eslint-plugin-template-17.5.2.tgz", - "integrity": "sha512-6sxVwrJ7yElZxcjxHSA0Ujs29bCD/cMubd9n6TDFI9e3v+ktpoMW4Nv/TCHv0OuYatIOZ7bcJxi38cAO8Vhfhw==", + "version": "18.0.1", + "resolved": "https://registry.npmjs.org/@angular-eslint/eslint-plugin-template/-/eslint-plugin-template-18.0.1.tgz", + "integrity": "sha512-u/eov/CFBb8l35D8dW78Dx5fBLd8FZFibKN9XQknhzXnDMpISuUOMny5g5/wvYYjqLgqEySXMiHKEAxEup7xtA==", "dev": true, "peer": true, "dependencies": { - "@angular-eslint/bundled-angular-compiler": "17.5.2", - "@angular-eslint/utils": "17.5.2", - "@typescript-eslint/type-utils": "7.11.0", - "@typescript-eslint/utils": "7.11.0", + "@angular-eslint/bundled-angular-compiler": "18.0.1", + "@angular-eslint/utils": "18.0.1", "aria-query": "5.3.0", "axobject-query": "4.0.0" }, "peerDependencies": { - "eslint": "^7.20.0 || ^8.0.0", + "@typescript-eslint/utils": "^7.11.0 || ^8.0.0-alpha.20", + "eslint": "^8.57.0 || ^9.0.0", "typescript": "*" } }, "node_modules/@angular-eslint/template-parser": { - "version": "17.5.2", - "resolved": "https://registry.npmjs.org/@angular-eslint/template-parser/-/template-parser-17.5.2.tgz", - "integrity": "sha512-46emLElmnIUzW0bpEpSf0u05ofRVUwlfttDOMLedhi700peUKbB9Y6iyz3GzAtQCMklBbJC9nR87LQRH9aSlog==", + "version": "18.0.1", + "resolved": "https://registry.npmjs.org/@angular-eslint/template-parser/-/template-parser-18.0.1.tgz", + "integrity": "sha512-22fKzkWo9Ts8aY/WHL1A6seS2tpltgRRXVfnZnnqvQRyRiuPnx1FC0ly7+QPZkThh8vdLwxU+BvtLq9Uiqh9OQ==", "dev": true, "peer": true, "dependencies": { - "@angular-eslint/bundled-angular-compiler": "17.5.2", + "@angular-eslint/bundled-angular-compiler": "18.0.1", "eslint-scope": "^8.0.0" }, "peerDependencies": { - "eslint": "^7.20.0 || ^8.0.0", + "eslint": "^8.57.0 || ^9.0.0", "typescript": "*" } }, "node_modules/@angular-eslint/utils": { - "version": "17.5.2", - "resolved": "https://registry.npmjs.org/@angular-eslint/utils/-/utils-17.5.2.tgz", - "integrity": "sha512-bTMPFqtoetBJsYR/xqREEOCy/CdsKGf2gZkRdH73gG6pOpskWt8J/PbRcMZsC349paV4HFixByVm89inqA0TNg==", + "version": "18.0.1", + "resolved": "https://registry.npmjs.org/@angular-eslint/utils/-/utils-18.0.1.tgz", + "integrity": "sha512-Q9lCySqg+9h2cz08+SoWj48cY1i04tL1k3bsQJmF2TsylAw2mSsNGX2X3h9WkdxY7sUoY0mP7MVW1iU54Gobcg==", "dev": true, "peer": true, "dependencies": { - "@angular-eslint/bundled-angular-compiler": "17.5.2", - "@typescript-eslint/utils": "7.11.0" + "@angular-eslint/bundled-angular-compiler": "18.0.1" }, "peerDependencies": { - "eslint": "^7.20.0 || ^8.0.0", + "@typescript-eslint/utils": "^7.11.0 || ^8.0.0-alpha.20", + "eslint": "^8.57.0 || ^9.0.0", "typescript": "*" } }, @@ -3891,17 +3890,17 @@ } }, "node_modules/@cspell/cspell-bundled-dicts": { - "version": "8.8.3", - "resolved": "https://registry.npmjs.org/@cspell/cspell-bundled-dicts/-/cspell-bundled-dicts-8.8.3.tgz", - "integrity": "sha512-nRa30TQwE4R5xcM6CBibM2l7D359ympexjm7OrykzYmStIiiudDIsuNOIXGBrDouxRFgKGAa/ETo1g+Pxz7kNA==", + "version": "8.8.4", + "resolved": "https://registry.npmjs.org/@cspell/cspell-bundled-dicts/-/cspell-bundled-dicts-8.8.4.tgz", + "integrity": "sha512-k9ZMO2kayQFXB3B45b1xXze3MceAMNy9U+D7NTnWB1i3S0y8LhN53U9JWWgqHGPQaHaLHzizL7/w1aGHTA149Q==", "dev": true, "peer": true, "dependencies": { "@cspell/dict-ada": "^4.0.2", "@cspell/dict-aws": "^4.0.2", "@cspell/dict-bash": "^4.1.3", - "@cspell/dict-companies": "^3.1.0", - "@cspell/dict-cpp": "^5.1.6", + "@cspell/dict-companies": "^3.1.2", + "@cspell/dict-cpp": "^5.1.8", "@cspell/dict-cryptocurrencies": "^5.0.0", "@cspell/dict-csharp": "^4.0.2", "@cspell/dict-css": "^4.0.12", @@ -3910,7 +3909,7 @@ "@cspell/dict-docker": "^1.1.7", "@cspell/dict-dotnet": "^5.0.2", "@cspell/dict-elixir": "^4.0.3", - "@cspell/dict-en_us": "^4.3.20", + "@cspell/dict-en_us": "^4.3.21", "@cspell/dict-en-common-misspellings": "^2.0.1", "@cspell/dict-en-gb": "1.1.33", "@cspell/dict-filetypes": "^3.0.4", @@ -3920,13 +3919,13 @@ "@cspell/dict-gaming-terms": "^1.0.5", "@cspell/dict-git": "^3.0.0", "@cspell/dict-golang": "^6.0.9", - "@cspell/dict-google": "^1.0.0", + "@cspell/dict-google": "^1.0.1", "@cspell/dict-haskell": "^4.0.1", "@cspell/dict-html": "^4.0.5", "@cspell/dict-html-symbol-entities": "^4.0.0", "@cspell/dict-java": "^5.0.6", "@cspell/dict-julia": "^1.0.1", - "@cspell/dict-k8s": "^1.0.3", + "@cspell/dict-k8s": "^1.0.5", "@cspell/dict-latex": "^4.0.0", "@cspell/dict-lorem-ipsum": "^4.0.0", "@cspell/dict-lua": "^4.0.3", @@ -3936,13 +3935,13 @@ "@cspell/dict-npm": "^5.0.16", "@cspell/dict-php": "^4.0.7", "@cspell/dict-powershell": "^5.0.4", - "@cspell/dict-public-licenses": "^2.0.6", + "@cspell/dict-public-licenses": "^2.0.7", "@cspell/dict-python": "^4.1.11", "@cspell/dict-r": "^2.0.1", "@cspell/dict-ruby": "^5.0.2", "@cspell/dict-rust": "^4.0.3", "@cspell/dict-scala": "^5.0.2", - "@cspell/dict-software-terms": "^3.3.23", + "@cspell/dict-software-terms": "^3.4.1", "@cspell/dict-sql": "^2.1.3", "@cspell/dict-svelte": "^1.0.2", "@cspell/dict-swift": "^2.0.1", @@ -3955,22 +3954,22 @@ } }, "node_modules/@cspell/cspell-json-reporter": { - "version": "8.8.3", - "resolved": "https://registry.npmjs.org/@cspell/cspell-json-reporter/-/cspell-json-reporter-8.8.3.tgz", - "integrity": "sha512-XP8x446IO9iHKvEN1IrJwOC5wC2uwmbdgFiUiXfzPSAlPfRWBmzOR68UR0Z6LNpm1GB4sUxxQkx2CRqDyGaSng==", + "version": "8.8.4", + "resolved": "https://registry.npmjs.org/@cspell/cspell-json-reporter/-/cspell-json-reporter-8.8.4.tgz", + "integrity": "sha512-ITpOeNyDHD+4B9QmLJx6YYtrB1saRsrCLluZ34YaICemNLuumVRP1vSjcdoBtefvGugCOn5nPK7igw0r/vdAvA==", "dev": true, "peer": true, "dependencies": { - "@cspell/cspell-types": "8.8.3" + "@cspell/cspell-types": "8.8.4" }, "engines": { "node": ">=18" } }, "node_modules/@cspell/cspell-pipe": { - "version": "8.8.3", - "resolved": "https://registry.npmjs.org/@cspell/cspell-pipe/-/cspell-pipe-8.8.3.tgz", - "integrity": "sha512-tzngpFKXeUsdTZEErffTlwUnPIKYgyRKy0YTrD77EkhyDSbUnaS8JWqtGZbKV7iQ+R4CL7tiaubPjUzkbWj+kQ==", + "version": "8.8.4", + "resolved": "https://registry.npmjs.org/@cspell/cspell-pipe/-/cspell-pipe-8.8.4.tgz", + "integrity": "sha512-Uis9iIEcv1zOogXiDVSegm9nzo5NRmsRDsW8CteLRg6PhyZ0nnCY1PZIUy3SbGF0vIcb/M+XsdLSh2wOPqTXww==", "dev": true, "peer": true, "engines": { @@ -3978,9 +3977,9 @@ } }, "node_modules/@cspell/cspell-resolver": { - "version": "8.8.3", - "resolved": "https://registry.npmjs.org/@cspell/cspell-resolver/-/cspell-resolver-8.8.3.tgz", - "integrity": "sha512-pMOB2MJYeria0DeW1dsehRPIHLzoOXCm1Cdjp1kRZ931PbqNCYaE/GM6laWpUTAbS9Ly2tv4g0jK3PUH8ZTtJA==", + "version": "8.8.4", + "resolved": "https://registry.npmjs.org/@cspell/cspell-resolver/-/cspell-resolver-8.8.4.tgz", + "integrity": "sha512-eZVw31nSeh6xKl7TzzkZVMTX/mgwhUw40/q1Sqo7CTPurIBg66oelEqKRclX898jzd2/qSK+ZFwBDxvV7QH38A==", "dev": true, "peer": true, "dependencies": { @@ -3991,9 +3990,9 @@ } }, "node_modules/@cspell/cspell-service-bus": { - "version": "8.8.3", - "resolved": "https://registry.npmjs.org/@cspell/cspell-service-bus/-/cspell-service-bus-8.8.3.tgz", - "integrity": "sha512-QVKe/JZvoTaaBAMXG40HjZib1g6rGgxk03e070GmdfCiMRUCWFtK+9DKVYJfSqjQhzj/eDCrq8aWplHWy66umg==", + "version": "8.8.4", + "resolved": "https://registry.npmjs.org/@cspell/cspell-service-bus/-/cspell-service-bus-8.8.4.tgz", + "integrity": "sha512-KtwJ38uPLrm2Q8osmMIAl2NToA/CMyZCxck4msQJnskdo30IPSdA1Rh0w6zXinmh1eVe0zNEVCeJ2+x23HqW+g==", "dev": true, "peer": true, "engines": { @@ -4001,9 +4000,9 @@ } }, "node_modules/@cspell/cspell-types": { - "version": "8.8.3", - "resolved": "https://registry.npmjs.org/@cspell/cspell-types/-/cspell-types-8.8.3.tgz", - "integrity": "sha512-31wYSBPinhqKi9TSzPg50fWHJmMQwD1d5p26yM/NAfNQvjAfBQlrg4pqix8pxOJkAK5W/TnoaVXjzJ5XCg6arQ==", + "version": "8.8.4", + "resolved": "https://registry.npmjs.org/@cspell/cspell-types/-/cspell-types-8.8.4.tgz", + "integrity": "sha512-ya9Jl4+lghx2eUuZNY6pcbbrnResgEAomvglhdbEGqy+B5MPEqY5Jt45APEmGqHzTNks7oFFaiTIbXYJAFBR7A==", "dev": true, "peer": true, "engines": { @@ -4406,9 +4405,9 @@ "peer": true }, "node_modules/@cspell/dynamic-import": { - "version": "8.8.3", - "resolved": "https://registry.npmjs.org/@cspell/dynamic-import/-/dynamic-import-8.8.3.tgz", - "integrity": "sha512-qpxGC2hGVfbSaLJkaEu//rqbgAOjYnMlbxD75Fk9ny96sr+ZI1YC0nmUErWlgXSbtjVY/DHCOu26Usweo5iRgA==", + "version": "8.8.4", + "resolved": "https://registry.npmjs.org/@cspell/dynamic-import/-/dynamic-import-8.8.4.tgz", + "integrity": "sha512-tseSxrybznkmsmPaAB4aoHB9wr8Q2fOMIy3dm+yQv+U1xj+JHTN9OnUvy9sKiq0p3DQGWm/VylgSgsYaXrEHKQ==", "dev": true, "peer": true, "dependencies": { @@ -4419,9 +4418,9 @@ } }, "node_modules/@cspell/strong-weak-map": { - "version": "8.8.3", - "resolved": "https://registry.npmjs.org/@cspell/strong-weak-map/-/strong-weak-map-8.8.3.tgz", - "integrity": "sha512-y/pL7Zex8iHQ54qDYvg9oCiCgfZ9DAUTOI/VtPFVC+42JqLx6YufYxJS2uAsFlfAXIPiRV8qnnG6BHImD1Ix6g==", + "version": "8.8.4", + "resolved": "https://registry.npmjs.org/@cspell/strong-weak-map/-/strong-weak-map-8.8.4.tgz", + "integrity": "sha512-gticEJGR6yyGeLjf+mJ0jZotWYRLVQ+J0v1VpsR1nKnXTRJY15BWXgEA/ifbU/+clpyCek79NiCIXCvmP1WT4A==", "dev": true, "peer": true, "engines": { @@ -5040,9 +5039,9 @@ } }, "node_modules/@eslint-community/regexpp": { - "version": "4.10.0", - "resolved": "https://registry.npmjs.org/@eslint-community/regexpp/-/regexpp-4.10.0.tgz", - "integrity": "sha512-Cu96Sd2By9mCNTx2iyKOmq10v22jUVQv0lQnlGNy16oE9589yE+QADPbrMGCkA51cKZSg3Pu/aTJVTGfL/qjUA==", + "version": "4.10.1", + "resolved": "https://registry.npmjs.org/@eslint-community/regexpp/-/regexpp-4.10.1.tgz", + "integrity": "sha512-Zm2NGpWELsQAD1xsJzGQpYfvICSsFkEpU0jxBjfdC6uNEWXcHnfs9hScFWtXVDVl+rBQJGrl4g1vcKIejpH9dA==", "dev": true, "engines": { "node": "^12.0.0 || ^14.0.0 || >=16.0.0" @@ -9089,28 +9088,28 @@ } }, "node_modules/@taiga-ui/eslint-plugin-experience": { - "version": "0.74.10", - "resolved": "https://registry.npmjs.org/@taiga-ui/eslint-plugin-experience/-/eslint-plugin-experience-0.74.10.tgz", - "integrity": "sha512-WW6gs0r6nXCXAjMaa0BZ7vUhK8DsqaqEtFNyAfuItaszccgNFavWN47lv9LOXU6ZN0XOKxPoy9D0MVhY+KA5bA==", + "version": "0.75.3", + "resolved": "https://registry.npmjs.org/@taiga-ui/eslint-plugin-experience/-/eslint-plugin-experience-0.75.3.tgz", + "integrity": "sha512-yPaFhbIYNnEpoMIOpb3EyRPv7L1z+QICczltYmxKcuqpFUALlKEAf8KGuWqMnRlhKupRL0lCwNb/f2TfcPRvOA==", "dev": true, "peerDependencies": { - "@angular-eslint/eslint-plugin": "^17.4.1", - "@angular-eslint/eslint-plugin-template": "^17.4.1", - "@angular-eslint/template-parser": "^17.4.1", + "@angular-eslint/eslint-plugin": "^18.0.1", + "@angular-eslint/eslint-plugin-template": "^18.0.1", + "@angular-eslint/template-parser": "^18.0.1", "@babel/eslint-parser": "^7.24.6", "@babel/eslint-plugin": "^7.24.6", - "@typescript-eslint/eslint-plugin": "^7.10.0", - "@typescript-eslint/parser": "^7.10.0", - "@typescript-eslint/types": "^7.10.0", - "@typescript-eslint/typescript-estree": "^7.10.0", - "@typescript-eslint/utils": "^7.10.0", + "@typescript-eslint/eslint-plugin": "^7.11.0", + "@typescript-eslint/parser": "^7.11.0", + "@typescript-eslint/types": "^7.11.0", + "@typescript-eslint/typescript-estree": "^7.11.0", + "@typescript-eslint/utils": "^7.11.0", "babel-plugin-macros": "^3.1.0", "eslint": "^8.57.0", "eslint-config-airbnb-base": "^15.0.0", "eslint-config-prettier": "^9.1.0", "eslint-import-resolver-typescript": "^3.6.1", "eslint-import-resolver-webpack": "^0.13.8", - "eslint-plugin-cypress": "^3.2.0", + "eslint-plugin-cypress": "^3.3.0", "eslint-plugin-decorator-position": "^5.0.2", "eslint-plugin-eslint-comments": "^3.2.0", "eslint-plugin-file-progress": "^1.4.0", @@ -9120,7 +9119,7 @@ "eslint-plugin-perfectionist": "^2.10.0", "eslint-plugin-playwright": "^1.6.2", "eslint-plugin-prettier": "^5.1.3", - "eslint-plugin-promise": "^6.1.1", + "eslint-plugin-promise": "^6.2.0", "eslint-plugin-rxjs": "^5.0.3", "eslint-plugin-simple-import-sort": "^12.1.0", "eslint-plugin-sonarjs": "^1.0.3", @@ -9154,28 +9153,29 @@ "link": true }, "node_modules/@taiga-ui/prettier-config": { - "version": "0.11.7", - "resolved": "https://registry.npmjs.org/@taiga-ui/prettier-config/-/prettier-config-0.11.7.tgz", - "integrity": "sha512-1pfGtuvwnFMrnMVLcowlCBvju3nYhyeYbuqqPYuZYoyvsrKdAHOFBUJG2T5p2gN84OIFpoKAMcJ9ktiVbI0/EA==", + "version": "0.11.9", + "resolved": "https://registry.npmjs.org/@taiga-ui/prettier-config/-/prettier-config-0.11.9.tgz", + "integrity": "sha512-co9io3CBgSpHkclOZGZVMsPISTpLh9NSN6INJR+rC7NKadxs4PBaanji6HsuIA29GztIQ/OX1TOLW2QzzNQkOw==", "dev": true, "peerDependencies": { "@prettier/plugin-xml": "^3.4.1", - "prettier": "^3.2.5", + "prettier": "^3.3.0", "prettier-package-json": "^2.8.0", "prettier-plugin-organize-attributes": "^1.0.0", - "sort-package-json": "^2.10.0" + "sort-package-json": "^2.10.0", + "stylelint-prettier": "^5.0.0" } }, "node_modules/@taiga-ui/stylelint-config": { - "version": "0.22.2", - "resolved": "https://registry.npmjs.org/@taiga-ui/stylelint-config/-/stylelint-config-0.22.2.tgz", - "integrity": "sha512-bMHfdzr9VTH0+r6BznDsYhNmY+OEoWTXB+j+Zv+pZqlTWsdLlkdjFUI+KDeErIdRx2Jw9z6Ap3wBUrgcV91v7Q==", + "version": "0.22.3", + "resolved": "https://registry.npmjs.org/@taiga-ui/stylelint-config/-/stylelint-config-0.22.3.tgz", + "integrity": "sha512-QXb37gSmNIfa41I4nJG4rAF0rEzabN5jccz/WNNReWSi8esDjEGvUBdzxmUzDsDjnyWnqa4ItwC7Fzee88bFfQ==", "dev": true, "peerDependencies": { "@miller-svt/stylelint-no-px": "^1.0.1", "postcss": "^8.4.38", "postcss-less": "^6.0.0", - "stylelint": "^16.6.0", + "stylelint": "^16.6.1", "stylelint-config-standard": "^36.0.0", "stylelint-order": "^6.0.4" } @@ -9887,17 +9887,17 @@ } }, "node_modules/@typescript-eslint/eslint-plugin": { - "version": "7.11.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-7.11.0.tgz", - "integrity": "sha512-P+qEahbgeHW4JQ/87FuItjBj8O3MYv5gELDzr8QaQ7fsll1gSMTYb6j87MYyxwf3DtD7uGFB9ShwgmCJB5KmaQ==", + "version": "7.12.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-7.12.0.tgz", + "integrity": "sha512-7F91fcbuDf/d3S8o21+r3ZncGIke/+eWk0EpO21LXhDfLahriZF9CGj4fbAetEjlaBdjdSm9a6VeXbpbT6Z40Q==", "dev": true, "peer": true, "dependencies": { "@eslint-community/regexpp": "^4.10.0", - "@typescript-eslint/scope-manager": "7.11.0", - "@typescript-eslint/type-utils": "7.11.0", - "@typescript-eslint/utils": "7.11.0", - "@typescript-eslint/visitor-keys": "7.11.0", + "@typescript-eslint/scope-manager": "7.12.0", + "@typescript-eslint/type-utils": "7.12.0", + "@typescript-eslint/utils": "7.12.0", + "@typescript-eslint/visitor-keys": "7.12.0", "graphemer": "^1.4.0", "ignore": "^5.3.1", "natural-compare": "^1.4.0", @@ -10083,16 +10083,16 @@ } }, "node_modules/@typescript-eslint/parser": { - "version": "7.11.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-7.11.0.tgz", - "integrity": "sha512-yimw99teuaXVWsBcPO1Ais02kwJ1jmNA1KxE7ng0aT7ndr1pT1wqj0OJnsYVGKKlc4QJai86l/025L6z8CljOg==", + "version": "7.12.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-7.12.0.tgz", + "integrity": "sha512-dm/J2UDY3oV3TKius2OUZIFHsomQmpHtsV0FTh1WO8EKgHLQ1QCADUqscPgTpU+ih1e21FQSRjXckHn3txn6kQ==", "dev": true, "peer": true, "dependencies": { - "@typescript-eslint/scope-manager": "7.11.0", - "@typescript-eslint/types": "7.11.0", - "@typescript-eslint/typescript-estree": "7.11.0", - "@typescript-eslint/visitor-keys": "7.11.0", + "@typescript-eslint/scope-manager": "7.12.0", + "@typescript-eslint/types": "7.12.0", + "@typescript-eslint/typescript-estree": "7.12.0", + "@typescript-eslint/visitor-keys": "7.12.0", "debug": "^4.3.4" }, "engines": { @@ -10112,13 +10112,13 @@ } }, "node_modules/@typescript-eslint/scope-manager": { - "version": "7.11.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-7.11.0.tgz", - "integrity": "sha512-27tGdVEiutD4POirLZX4YzT180vevUURJl4wJGmm6TrQoiYwuxTIY98PBp6L2oN+JQxzE0URvYlzJaBHIekXAw==", + "version": "7.12.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-7.12.0.tgz", + "integrity": "sha512-itF1pTnN6F3unPak+kutH9raIkL3lhH1YRPGgt7QQOh43DQKVJXmWkpb+vpc/TiDHs6RSd9CTbDsc/Y+Ygq7kg==", "dev": true, "dependencies": { - "@typescript-eslint/types": "7.11.0", - "@typescript-eslint/visitor-keys": "7.11.0" + "@typescript-eslint/types": "7.12.0", + "@typescript-eslint/visitor-keys": "7.12.0" }, "engines": { "node": "^18.18.0 || >=20.0.0" @@ -10129,13 +10129,13 @@ } }, "node_modules/@typescript-eslint/type-utils": { - "version": "7.11.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/type-utils/-/type-utils-7.11.0.tgz", - "integrity": "sha512-WmppUEgYy+y1NTseNMJ6mCFxt03/7jTOy08bcg7bxJJdsM4nuhnchyBbE8vryveaJUf62noH7LodPSo5Z0WUCg==", + "version": "7.12.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/type-utils/-/type-utils-7.12.0.tgz", + "integrity": "sha512-lib96tyRtMhLxwauDWUp/uW3FMhLA6D0rJ8T7HmH7x23Gk1Gwwu8UZ94NMXBvOELn6flSPiBrCKlehkiXyaqwA==", "dev": true, "dependencies": { - "@typescript-eslint/typescript-estree": "7.11.0", - "@typescript-eslint/utils": "7.11.0", + "@typescript-eslint/typescript-estree": "7.12.0", + "@typescript-eslint/utils": "7.12.0", "debug": "^4.3.4", "ts-api-utils": "^1.3.0" }, @@ -10156,9 +10156,9 @@ } }, "node_modules/@typescript-eslint/types": { - "version": "7.11.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-7.11.0.tgz", - "integrity": "sha512-MPEsDRZTyCiXkD4vd3zywDCifi7tatc4K37KqTprCvaXptP7Xlpdw0NR2hRJTetG5TxbWDB79Ys4kLmHliEo/w==", + "version": "7.12.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-7.12.0.tgz", + "integrity": "sha512-o+0Te6eWp2ppKY3mLCU+YA9pVJxhUJE15FV7kxuD9jgwIAa+w/ycGJBMrYDTpVGUM/tgpa9SeMOugSabWFq7bg==", "dev": true, "engines": { "node": "^18.18.0 || >=20.0.0" @@ -10169,13 +10169,13 @@ } }, "node_modules/@typescript-eslint/typescript-estree": { - "version": "7.11.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-7.11.0.tgz", - "integrity": "sha512-cxkhZ2C/iyi3/6U9EPc5y+a6csqHItndvN/CzbNXTNrsC3/ASoYQZEt9uMaEp+xFNjasqQyszp5TumAVKKvJeQ==", + "version": "7.12.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-7.12.0.tgz", + "integrity": "sha512-5bwqLsWBULv1h6pn7cMW5dXX/Y2amRqLaKqsASVwbBHMZSnHqE/HN4vT4fE0aFsiwxYvr98kqOWh1a8ZKXalCQ==", "dev": true, "dependencies": { - "@typescript-eslint/types": "7.11.0", - "@typescript-eslint/visitor-keys": "7.11.0", + "@typescript-eslint/types": "7.12.0", + "@typescript-eslint/visitor-keys": "7.12.0", "debug": "^4.3.4", "globby": "^11.1.0", "is-glob": "^4.0.3", @@ -10224,15 +10224,15 @@ } }, "node_modules/@typescript-eslint/utils": { - "version": "7.11.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-7.11.0.tgz", - "integrity": "sha512-xlAWwPleNRHwF37AhrZurOxA1wyXowW4PqVXZVUNCLjB48CqdPJoJWkrpH2nij9Q3Lb7rtWindtoXwxjxlKKCA==", + "version": "7.12.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-7.12.0.tgz", + "integrity": "sha512-Y6hhwxwDx41HNpjuYswYp6gDbkiZ8Hin9Bf5aJQn1bpTs3afYY4GX+MPYxma8jtoIV2GRwTM/UJm/2uGCVv+DQ==", "dev": true, "dependencies": { "@eslint-community/eslint-utils": "^4.4.0", - "@typescript-eslint/scope-manager": "7.11.0", - "@typescript-eslint/types": "7.11.0", - "@typescript-eslint/typescript-estree": "7.11.0" + "@typescript-eslint/scope-manager": "7.12.0", + "@typescript-eslint/types": "7.12.0", + "@typescript-eslint/typescript-estree": "7.12.0" }, "engines": { "node": "^18.18.0 || >=20.0.0" @@ -10246,12 +10246,12 @@ } }, "node_modules/@typescript-eslint/visitor-keys": { - "version": "7.11.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-7.11.0.tgz", - "integrity": "sha512-7syYk4MzjxTEk0g/w3iqtgxnFQspDJfn6QKD36xMuuhTzjcxY7F8EmBLnALjVyaOF1/bVocu3bS/2/F7rXrveQ==", + "version": "7.12.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-7.12.0.tgz", + "integrity": "sha512-uZk7DevrQLL3vSnfFl5bj4sL75qC9D6EdjemIdbtkuUmIheWpuiiylSY01JxJE7+zGrOWDZrp1WxOuDntvKrHQ==", "dev": true, "dependencies": { - "@typescript-eslint/types": "7.11.0", + "@typescript-eslint/types": "7.12.0", "eslint-visitor-keys": "^3.4.3" }, "engines": { @@ -14960,23 +14960,23 @@ } }, "node_modules/cspell": { - "version": "8.8.3", - "resolved": "https://registry.npmjs.org/cspell/-/cspell-8.8.3.tgz", - "integrity": "sha512-JVWI4MNALOuZ+igyJ54C6Iwe8s1ecMCgyGFGId5a0P6wi/V+TFYFhl7QkzIi1Uw4KtXSYrUSlHGUjC2dE0OZ9g==", + "version": "8.8.4", + "resolved": "https://registry.npmjs.org/cspell/-/cspell-8.8.4.tgz", + "integrity": "sha512-eRUHiXvh4iRapw3lqE1nGOEAyYVfa/0lgK/e34SpcM/ECm4QuvbfY7Yl0ozCbiYywecog0RVbeJJUEYJTN5/Mg==", "dev": true, "peer": true, "dependencies": { - "@cspell/cspell-json-reporter": "8.8.3", - "@cspell/cspell-pipe": "8.8.3", - "@cspell/cspell-types": "8.8.3", - "@cspell/dynamic-import": "8.8.3", + "@cspell/cspell-json-reporter": "8.8.4", + "@cspell/cspell-pipe": "8.8.4", + "@cspell/cspell-types": "8.8.4", + "@cspell/dynamic-import": "8.8.4", "chalk": "^5.3.0", "chalk-template": "^1.1.0", "commander": "^12.1.0", - "cspell-gitignore": "8.8.3", - "cspell-glob": "8.8.3", - "cspell-io": "8.8.3", - "cspell-lib": "8.8.3", + "cspell-gitignore": "8.8.4", + "cspell-glob": "8.8.4", + "cspell-io": "8.8.4", + "cspell-lib": "8.8.4", "fast-glob": "^3.3.2", "fast-json-stable-stringify": "^2.1.0", "file-entry-cache": "^8.0.0", @@ -14997,30 +14997,30 @@ } }, "node_modules/cspell-config-lib": { - "version": "8.8.3", - "resolved": "https://registry.npmjs.org/cspell-config-lib/-/cspell-config-lib-8.8.3.tgz", - "integrity": "sha512-61NKZrzTi9OLEEiZBggLQy9nswgR0gd6bKH06xXFQyRfNpAjaPOzOUFhSSfX1MQX+lQF3KtSYcHpppwbpPsL8w==", + "version": "8.8.4", + "resolved": "https://registry.npmjs.org/cspell-config-lib/-/cspell-config-lib-8.8.4.tgz", + "integrity": "sha512-Xf+aL669Cm+MYZTZULVWRQXB7sRWx9qs0hPrgqxeaWabLUISK57/qwcI24TPVdYakUCoud9Nv+woGi5FcqV5ZQ==", "dev": true, "peer": true, "dependencies": { - "@cspell/cspell-types": "8.8.3", + "@cspell/cspell-types": "8.8.4", "comment-json": "^4.2.3", - "yaml": "^2.4.2" + "yaml": "^2.4.3" }, "engines": { "node": ">=18" } }, "node_modules/cspell-dictionary": { - "version": "8.8.3", - "resolved": "https://registry.npmjs.org/cspell-dictionary/-/cspell-dictionary-8.8.3.tgz", - "integrity": "sha512-g2G3uh8JbuJKAYFdFQENcbTIrK9SJRXBiQ/t+ch+9I/t5HmuGOVe+wxKEM/0c9M2CRLpzJShBvttH9rnw4Yqfg==", + "version": "8.8.4", + "resolved": "https://registry.npmjs.org/cspell-dictionary/-/cspell-dictionary-8.8.4.tgz", + "integrity": "sha512-eDi61MDDZycS5EASz5FiYKJykLEyBT0mCvkYEUCsGVoqw8T9gWuWybwwqde3CMq9TOwns5pxGcFs2v9RYgtN5A==", "dev": true, "peer": true, "dependencies": { - "@cspell/cspell-pipe": "8.8.3", - "@cspell/cspell-types": "8.8.3", - "cspell-trie-lib": "8.8.3", + "@cspell/cspell-pipe": "8.8.4", + "@cspell/cspell-types": "8.8.4", + "cspell-trie-lib": "8.8.4", "fast-equals": "^5.0.1", "gensequence": "^7.0.0" }, @@ -15029,13 +15029,13 @@ } }, "node_modules/cspell-gitignore": { - "version": "8.8.3", - "resolved": "https://registry.npmjs.org/cspell-gitignore/-/cspell-gitignore-8.8.3.tgz", - "integrity": "sha512-+IeVPNnUJOj+D9rc4elbK4DK3p9qxvF/2BMtFsE7a75egeJjAnlzVGzqH2FVMsDj6dxe5bjc8/S4Nhw6B14xTQ==", + "version": "8.8.4", + "resolved": "https://registry.npmjs.org/cspell-gitignore/-/cspell-gitignore-8.8.4.tgz", + "integrity": "sha512-rLdxpBh0kp0scwqNBZaWVnxEVmSK3UWyVSZmyEL4jmmjusHYM9IggfedOhO4EfGCIdQ32j21TevE0tTslyc4iA==", "dev": true, "peer": true, "dependencies": { - "cspell-glob": "8.8.3", + "cspell-glob": "8.8.4", "find-up-simple": "^1.0.0" }, "bin": { @@ -15046,9 +15046,9 @@ } }, "node_modules/cspell-glob": { - "version": "8.8.3", - "resolved": "https://registry.npmjs.org/cspell-glob/-/cspell-glob-8.8.3.tgz", - "integrity": "sha512-9c4Nw/bIsjKSuBuRrLa1sWtIzbXXvja+FVbUOE9c2IiZfh6K1I+UssiXTbRTMg6qgTdkfT4o3KOcFN0ZcbmCUQ==", + "version": "8.8.4", + "resolved": "https://registry.npmjs.org/cspell-glob/-/cspell-glob-8.8.4.tgz", + "integrity": "sha512-+tRrOfTSbF/44uNl4idMZVPNfNM6WTmra4ZL44nx23iw1ikNhqZ+m0PC1oCVSlURNBEn8faFXjC/oT2BfgxoUQ==", "dev": true, "peer": true, "dependencies": { @@ -15059,14 +15059,14 @@ } }, "node_modules/cspell-grammar": { - "version": "8.8.3", - "resolved": "https://registry.npmjs.org/cspell-grammar/-/cspell-grammar-8.8.3.tgz", - "integrity": "sha512-3RP7xQ/6IiIjbWQDuE+4b0ERKkSWGMY75bd0oEsh5HcFhhOYphmcpxLxRRM/yxYQaYgdvq0QIcwrpanx86KJ7A==", + "version": "8.8.4", + "resolved": "https://registry.npmjs.org/cspell-grammar/-/cspell-grammar-8.8.4.tgz", + "integrity": "sha512-UxDO517iW6vs/8l4OhLpdMR7Bp+tkquvtld1gWz8WYQiDwORyf0v5a3nMh4ILYZGoolOSnDuI9UjWOLI6L/vvQ==", "dev": true, "peer": true, "dependencies": { - "@cspell/cspell-pipe": "8.8.3", - "@cspell/cspell-types": "8.8.3" + "@cspell/cspell-pipe": "8.8.4", + "@cspell/cspell-types": "8.8.4" }, "bin": { "cspell-grammar": "bin.mjs" @@ -15076,39 +15076,39 @@ } }, "node_modules/cspell-io": { - "version": "8.8.3", - "resolved": "https://registry.npmjs.org/cspell-io/-/cspell-io-8.8.3.tgz", - "integrity": "sha512-vO7BUa6i7tjmQr+9dw/Ic7tm4ECnSUlbuMv0zJs/SIrO9AcID2pCWPeZNZEGAmeutrEOi2iThZ/uS33aCuv7Jw==", + "version": "8.8.4", + "resolved": "https://registry.npmjs.org/cspell-io/-/cspell-io-8.8.4.tgz", + "integrity": "sha512-aqB/QMx+xns46QSyPEqi05uguCSxvqRnh2S/ZOhhjPlKma/7hK9niPRcwKwJXJEtNzdiZZkkC1uZt9aJe/7FTA==", "dev": true, "peer": true, "dependencies": { - "@cspell/cspell-service-bus": "8.8.3" + "@cspell/cspell-service-bus": "8.8.4" }, "engines": { "node": ">=18" } }, "node_modules/cspell-lib": { - "version": "8.8.3", - "resolved": "https://registry.npmjs.org/cspell-lib/-/cspell-lib-8.8.3.tgz", - "integrity": "sha512-IqtTKBPug5Jzt9T8f/b6qGAbARRR5tpQkLjzsrfLzxM68ery23wEPDtmWToEyc9EslulZGLe0T78XuEU9AMF+g==", + "version": "8.8.4", + "resolved": "https://registry.npmjs.org/cspell-lib/-/cspell-lib-8.8.4.tgz", + "integrity": "sha512-hK8gYtdQ9Lh86c8cEHITt5SaoJbfvXoY/wtpR4k393YR+eAxKziyv8ihQyFE/Z/FwuqtNvDrSntP9NLwTivd3g==", "dev": true, "peer": true, "dependencies": { - "@cspell/cspell-bundled-dicts": "8.8.3", - "@cspell/cspell-pipe": "8.8.3", - "@cspell/cspell-resolver": "8.8.3", - "@cspell/cspell-types": "8.8.3", - "@cspell/dynamic-import": "8.8.3", - "@cspell/strong-weak-map": "8.8.3", + "@cspell/cspell-bundled-dicts": "8.8.4", + "@cspell/cspell-pipe": "8.8.4", + "@cspell/cspell-resolver": "8.8.4", + "@cspell/cspell-types": "8.8.4", + "@cspell/dynamic-import": "8.8.4", + "@cspell/strong-weak-map": "8.8.4", "clear-module": "^4.1.2", "comment-json": "^4.2.3", - "cspell-config-lib": "8.8.3", - "cspell-dictionary": "8.8.3", - "cspell-glob": "8.8.3", - "cspell-grammar": "8.8.3", - "cspell-io": "8.8.3", - "cspell-trie-lib": "8.8.3", + "cspell-config-lib": "8.8.4", + "cspell-dictionary": "8.8.4", + "cspell-glob": "8.8.4", + "cspell-grammar": "8.8.4", + "cspell-io": "8.8.4", + "cspell-trie-lib": "8.8.4", "env-paths": "^3.0.0", "fast-equals": "^5.0.1", "gensequence": "^7.0.0", @@ -15136,14 +15136,14 @@ } }, "node_modules/cspell-trie-lib": { - "version": "8.8.3", - "resolved": "https://registry.npmjs.org/cspell-trie-lib/-/cspell-trie-lib-8.8.3.tgz", - "integrity": "sha512-0zrkrhrFLVajwo6++XD9a+r0Olml7UjPgbztjPKbXIJrZCradBF5rvt3wq5mPpsjq2+Dz0z6K5muZpbO+gqapQ==", + "version": "8.8.4", + "resolved": "https://registry.npmjs.org/cspell-trie-lib/-/cspell-trie-lib-8.8.4.tgz", + "integrity": "sha512-yCld4ZL+pFa5DL+Arfvmkv3cCQUOfdRlxElOzdkRZqWyO6h/UmO8xZb21ixVYHiqhJGZmwc3BG9Xuw4go+RLig==", "dev": true, "peer": true, "dependencies": { - "@cspell/cspell-pipe": "8.8.3", - "@cspell/cspell-types": "8.8.3", + "@cspell/cspell-pipe": "8.8.4", + "@cspell/cspell-types": "8.8.4", "gensequence": "^7.0.0" }, "engines": { @@ -22103,9 +22103,9 @@ } }, "node_modules/jackspeak": { - "version": "3.1.2", - "resolved": "https://registry.npmjs.org/jackspeak/-/jackspeak-3.1.2.tgz", - "integrity": "sha512-kWmLKn2tRtfYMF/BakihVVRzBKOxz4gJMiL2Rj91WnAB5TPZumSH99R/Yf1qE1u4uRimvCSJfm6hnxohXeEXjQ==", + "version": "3.2.0", + "resolved": "https://registry.npmjs.org/jackspeak/-/jackspeak-3.2.0.tgz", + "integrity": "sha512-eXIwN9gutMuB1AMW241gIHSEeaSMafWnxWXb/JGYWqifway4QgqBJLl7nYlmhGrxnHQ3wNc/QYFZ95aDtHHzpA==", "dev": true, "dependencies": { "@isaacs/cliui": "^8.0.2" @@ -33051,6 +33051,23 @@ "stylelint": "^14.0.0 || ^15.0.0 || ^16.0.1" } }, + "node_modules/stylelint-prettier": { + "version": "5.0.0", + "resolved": "https://registry.npmjs.org/stylelint-prettier/-/stylelint-prettier-5.0.0.tgz", + "integrity": "sha512-RHfSlRJIsaVg5Br94gZVdWlz/rBTyQzZflNE6dXvSxt/GthWMY3gEHsWZEBaVGg7GM+XrtVSp4RznFlB7i0oyw==", + "dev": true, + "peer": true, + "dependencies": { + "prettier-linter-helpers": "^1.0.0" + }, + "engines": { + "node": ">=18.12.0" + }, + "peerDependencies": { + "prettier": ">=3.0.0", + "stylelint": ">=16.0.0" + } + }, "node_modules/stylelint/node_modules/ansi-regex": { "version": "6.0.1", "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-6.0.1.tgz", diff --git a/package.json b/package.json index 77fc377bc9b5..f67ca9afed90 100644 --- a/package.json +++ b/package.json @@ -119,9 +119,9 @@ "@taiga-ui/browserslist-config": "0.6.0", "@taiga-ui/commitlint-config": "0.7.5", "@taiga-ui/cspell-config": "0.40.0", - "@taiga-ui/eslint-plugin-experience": "0.74.10", - "@taiga-ui/prettier-config": "0.11.7", - "@taiga-ui/stylelint-config": "0.22.2", + "@taiga-ui/eslint-plugin-experience": "0.75.3", + "@taiga-ui/prettier-config": "0.11.9", + "@taiga-ui/stylelint-config": "0.22.3", "@taiga-ui/tsconfig": "0.17.0", "@tinkoff/ng-event-plugins": "3.2.0", "@types/glob": "8.1.0", diff --git a/projects/addon-charts/components/arc-chart/arc-chart.component.ts b/projects/addon-charts/components/arc-chart/arc-chart.component.ts index e83d4d274f1c..5ced61975245 100644 --- a/projects/addon-charts/components/arc-chart/arc-chart.component.ts +++ b/projects/addon-charts/components/arc-chart/arc-chart.component.ts @@ -58,6 +58,8 @@ export class TuiArcChartComponent { private readonly sanitizer = inject(DomSanitizer); private readonly arcs$ = new ReplaySubject>>(1); + protected initialized = false; + @Input() public value: readonly number[] = []; @@ -90,8 +92,6 @@ export class TuiArcChartComponent { }), ); - protected initialized = false; - constructor() { timer(0) .pipe(tuiWatch(inject(ChangeDetectorRef)), takeUntilDestroyed()) diff --git a/projects/addon-charts/components/bar-chart/bar-chart.component.ts b/projects/addon-charts/components/bar-chart/bar-chart.component.ts index e2438634ea4e..c69815589105 100644 --- a/projects/addon-charts/components/bar-chart/bar-chart.component.ts +++ b/projects/addon-charts/components/bar-chart/bar-chart.component.ts @@ -33,6 +33,9 @@ export class TuiBarChartComponent { private readonly hintOptions = inject(TuiHintOptionsDirective, {optional: true}); private readonly autoIdString = inject(TuiIdService).generate(); + @ViewChildren(TuiHintHoverDirective) + protected readonly drivers: QueryList> = EMPTY_QUERY; + @Input() public value: ReadonlyArray = []; @@ -45,9 +48,6 @@ export class TuiBarChartComponent { @Input() public collapsed = false; - @ViewChildren(TuiHintHoverDirective) - protected readonly drivers: QueryList> = EMPTY_QUERY; - public get transposed(): ReadonlyArray { return this.transpose(this.value); } diff --git a/projects/addon-charts/components/line-chart/line-chart.component.ts b/projects/addon-charts/components/line-chart/line-chart.component.ts index f93e039bb8d5..d56c39d36438 100644 --- a/projects/addon-charts/components/line-chart/line-chart.component.ts +++ b/projects/addon-charts/components/line-chart/line-chart.component.ts @@ -49,6 +49,12 @@ export class TuiLineChartComponent { private readonly hover$ = new Subject(); private readonly autoIdString = inject(TuiIdService).generate(); + protected readonly hintDirective = inject(TuiLineChartHintDirective, { + optional: true, + }); + + protected readonly hintOptions = inject(TuiHintOptionsDirective, {optional: true}); + @ViewChildren(TuiHintHoverDirective) public readonly drivers: QueryList> = EMPTY_QUERY; @@ -81,12 +87,6 @@ export class TuiLineChartComponent { public value: readonly TuiPoint[] = []; - protected readonly hintDirective = inject(TuiLineChartHintDirective, { - optional: true, - }); - - protected readonly hintOptions = inject(TuiHintOptionsDirective, {optional: true}); - @Input('value') public set valueSetter(value: readonly TuiPoint[]) { this.value = value.filter(item => !item.some(Number.isNaN)); diff --git a/projects/addon-commerce/components/input-card-grouped/input-card-grouped.component.ts b/projects/addon-commerce/components/input-card-grouped/input-card-grouped.component.ts index 31aaa310e40b..d0911fd87e73 100644 --- a/projects/addon-commerce/components/input-card-grouped/input-card-grouped.component.ts +++ b/projects/addon-commerce/components/input-card-grouped/input-card-grouped.component.ts @@ -122,17 +122,6 @@ export class TuiInputCardGroupedComponent private readonly el = tuiInjectElement(); private expireInert = false; - @Input() - public exampleText = this.options.exampleText; - - @Input() - public cardValidator = this.options.cardValidator; - - @Output() - public readonly autofilledChange = new EventEmitter(); - - public open = false; - @ContentChild(TuiDataListDirective, {read: TemplateRef}) protected readonly dropdown: PolymorpheusContent; @@ -160,6 +149,17 @@ export class TuiInputCardGroupedComponent protected readonly controller = inject(TUI_TEXTFIELD_WATCHED_CONTROLLER); protected readonly icons = inject(TUI_COMMON_ICONS); + @Input() + public exampleText = this.options.exampleText; + + @Input() + public cardValidator = this.options.cardValidator; + + @Output() + public readonly autofilledChange = new EventEmitter(); + + public open = false; + constructor() { super(inject(TUI_INPUT_CARD_GROUPED_OPTIONS)); } diff --git a/projects/addon-commerce/components/input-card/abstract-input-card.ts b/projects/addon-commerce/components/input-card/abstract-input-card.ts index deaffa56f4f3..43d9dfafff09 100644 --- a/projects/addon-commerce/components/input-card/abstract-input-card.ts +++ b/projects/addon-commerce/components/input-card/abstract-input-card.ts @@ -15,6 +15,10 @@ export abstract class AbstractTuiInputCard< extends AbstractTuiNullableControl implements TuiFocusableElementAccessor { + protected paymentIcons: Record = inject( + TUI_PAYMENT_SYSTEM_ICONS, + ); + @Input() public cardSrc: PolymorpheusContent; @@ -24,10 +28,6 @@ export abstract class AbstractTuiInputCard< @Output() public readonly binChange = new EventEmitter(); - protected paymentIcons: Record = inject( - TUI_PAYMENT_SYSTEM_ICONS, - ); - protected constructor(protected readonly options: Options) { super(); } diff --git a/projects/addon-commerce/components/input-expire/input-expire.component.ts b/projects/addon-commerce/components/input-expire/input-expire.component.ts index 5e53972b0890..e35c76adf4e9 100644 --- a/projects/addon-commerce/components/input-expire/input-expire.component.ts +++ b/projects/addon-commerce/components/input-expire/input-expire.component.ts @@ -42,14 +42,14 @@ export class TuiInputExpireComponent private readonly textfieldSize = inject(TUI_TEXTFIELD_SIZE); - @Input() - public autocompleteEnabled = false; - protected readonly maskOptions = maskitoDateOptionsGenerator({ mode: 'mm/yy', separator: '/', }); + @Input() + public autocompleteEnabled = false; + public get nativeFocusableElement(): HTMLInputElement | null { return this.input?.nativeFocusableElement ?? null; } diff --git a/projects/addon-commerce/components/thumbnail-card/thumbnail-card.component.ts b/projects/addon-commerce/components/thumbnail-card/thumbnail-card.component.ts index 8c6bdd5e188f..438cb587e7ba 100644 --- a/projects/addon-commerce/components/thumbnail-card/thumbnail-card.component.ts +++ b/projects/addon-commerce/components/thumbnail-card/thumbnail-card.component.ts @@ -21,6 +21,9 @@ import {TUI_ICON_RESOLVER, TuiIconComponent} from '@taiga-ui/core'; changeDetection: ChangeDetectionStrategy.OnPush, }) export class TuiThumbnailCardComponent { + protected readonly paymentIcons = inject(TUI_PAYMENT_SYSTEM_ICONS); + protected readonly resolver = inject>(TUI_ICON_RESOLVER); + @Input() @HostBinding('attr.data-size') public size: TuiSizeL | TuiSizeS = 'm'; @@ -34,9 +37,6 @@ export class TuiThumbnailCardComponent { @Input() public iconRight = ''; - protected readonly paymentIcons = inject(TUI_PAYMENT_SYSTEM_ICONS); - protected readonly resolver = inject>(TUI_ICON_RESOLVER); - // TODO: Revisit this approach in 4.0 when icons are moved away from InputCard options protected get isMono(): boolean { switch (this.paymentSystem) { diff --git a/projects/addon-doc/components/code/index.ts b/projects/addon-doc/components/code/index.ts index b46eca98e68b..83053f061d31 100644 --- a/projects/addon-doc/components/code/index.ts +++ b/projects/addon-doc/components/code/index.ts @@ -26,9 +26,6 @@ import {BehaviorSubject, map, startWith, Subject, switchMap, timer} from 'rxjs'; export class TuiDocCodeComponent { private readonly rawLoader$$ = new BehaviorSubject(''); - @Input() - public filename = ''; - protected readonly markdownCodeProcessor = inject>( TUI_DOC_EXAMPLE_MARKDOWN_CODE_PROCESSOR, ); @@ -49,6 +46,9 @@ export class TuiDocCodeComponent { map((value: string): string[] => this.markdownCodeProcessor(value)), ); + @Input() + public filename = ''; + @Input() public set code(code: TuiRawLoaderContent) { this.rawLoader$$.next(code); diff --git a/projects/addon-doc/components/demo/index.ts b/projects/addon-doc/components/demo/index.ts index 970edd4b7432..ae8f9b94a021 100644 --- a/projects/addon-doc/components/demo/index.ts +++ b/projects/addon-doc/components/demo/index.ts @@ -79,13 +79,6 @@ export class TuiDocDemoComponent implements OnInit { private readonly urlSerializer = inject(UrlSerializer); private readonly urlStateHandler = inject(TUI_DOC_URL_STATE_HANDLER); - @Input() - public control: AbstractControl | null = null; - - @Input() - @HostBinding('class._sticky') - public sticky = true; - @ContentChild(TemplateRef) protected readonly template: TemplateRef> | null = null; @@ -105,6 +98,13 @@ export class TuiDocDemoComponent implements OnInit { protected sandboxWidth = tuiToInteger(this.params.sandboxWidth); protected readonly texts = inject(TUI_DOC_DEMO_TEXTS); + @Input() + public control: AbstractControl | null = null; + + @Input() + @HostBinding('class._sticky') + public sticky = true; + public ngOnInit(): void { this.createForm(); this.updateWidth(this.sandboxWidth + this.delta); diff --git a/projects/addon-doc/components/documentation/documentation.component.ts b/projects/addon-doc/components/documentation/documentation.component.ts index 155ec3495286..0372ddaad276 100644 --- a/projects/addon-doc/components/documentation/documentation.component.ts +++ b/projects/addon-doc/components/documentation/documentation.component.ts @@ -107,15 +107,6 @@ export class TuiDocDocumentationComponent implements AfterContentInit { private readonly getColor = inject(TuiGetColorPipe); private readonly getOpacity = inject(TuiGetOpacityPipe); - @Input() - public heading = ''; - - @Input() - public showValues = true; - - @Input() - public isAPI = false; - @ContentChildren(TuiDocDocumentationPropertyConnectorDirective) protected propertiesConnectors: QueryList< TuiDocDocumentationPropertyConnectorDirective @@ -125,6 +116,15 @@ export class TuiDocDocumentationComponent implements AfterContentInit { protected readonly excludedProperties = inject(TUI_DOC_EXCLUDED_PROPERTIES); protected activeItemIndex = 0; + @Input() + public heading = ''; + + @Input() + public showValues = true; + + @Input() + public isAPI = false; + public ngAfterContentInit(): void { tuiQueryListChanges(this.propertiesConnectors) .pipe( diff --git a/projects/addon-doc/components/example/example.component.ts b/projects/addon-doc/components/example/example.component.ts index 4773cfe1e49c..7b274fc08d1c 100644 --- a/projects/addon-doc/components/example/example.component.ts +++ b/projects/addon-doc/components/example/example.component.ts @@ -64,23 +64,6 @@ export class TuiDocExampleComponent { 1, ); - @Input() - @HostBinding('attr.id') - public id: string | null = null; - - @Input() - public heading: PolymorpheusContent; - - @Input() - public description: PolymorpheusContent; - - @Input() - @HostBinding('class._fullsize') - public fullsize = inject(TUI_DOC_EXAMPLE_OPTIONS).fullsize; - - @Input() - public componentName: string = this.location.pathname.slice(1); - protected readonly options = inject(TUI_DOC_EXAMPLE_OPTIONS); protected readonly texts = inject(TUI_DOC_EXAMPLE_TEXTS); protected readonly codeEditor = inject(TUI_DOC_CODE_EDITOR, {optional: true}); @@ -91,12 +74,10 @@ export class TuiDocExampleComponent { ); protected readonly defaultTabIndex = 0; - protected readonly defaultTab = this.texts[this.defaultTabIndex]; - protected activeItemIndex = this.defaultTabIndex; - protected readonly copy$ = this.copyTexts$.pipe(map(([copy]) => copy)); + protected readonly loading$ = new Subject(); protected readonly processor$: Observable> = this.rawLoader$$.pipe( @@ -109,7 +90,22 @@ export class TuiDocExampleComponent { map(module => new PolymorpheusComponent(module.default)), ); - protected readonly loading$ = new Subject(); + @Input() + @HostBinding('attr.id') + public id: string | null = null; + + @Input() + public heading: PolymorpheusContent; + + @Input() + public description: PolymorpheusContent; + + @Input() + @HostBinding('class._fullsize') + public fullsize = inject(TUI_DOC_EXAMPLE_OPTIONS).fullsize; + + @Input() + public componentName: string = this.location.pathname.slice(1); @Input() public set content(content: TuiDocExample) { diff --git a/projects/addon-doc/components/internal/see-also/index.ts b/projects/addon-doc/components/internal/see-also/index.ts index b15d9f6377cb..cd186053048f 100644 --- a/projects/addon-doc/components/internal/see-also/index.ts +++ b/projects/addon-doc/components/internal/see-also/index.ts @@ -14,12 +14,11 @@ import {TuiLinkDirective} from '@taiga-ui/core'; }) export class TuiDocSeeAlsoComponent { private readonly pages = inject(TUI_DOC_MAP_PAGES); + protected readonly text = inject(TUI_DOC_SEE_ALSO_TEXT); @Input() public seeAlso: readonly string[] = []; - protected readonly text = inject(TUI_DOC_SEE_ALSO_TEXT); - protected getRouterLink(pageTitle: string): string { return this.pages.get(pageTitle)?.route ?? ''; } diff --git a/projects/addon-doc/components/internal/source-code/source-code.component.ts b/projects/addon-doc/components/internal/source-code/source-code.component.ts index 339199a1ccd5..e4071e912d29 100644 --- a/projects/addon-doc/components/internal/source-code/source-code.component.ts +++ b/projects/addon-doc/components/internal/source-code/source-code.component.ts @@ -17,6 +17,10 @@ import {PolymorpheusModule} from '@tinkoff/ng-polymorpheus'; changeDetection: ChangeDetectionStrategy.OnPush, }) export class TuiDocSourceCodeComponent { + protected readonly icons = inject(TUI_DOC_ICONS); + protected readonly sourceCode = inject(TUI_DOC_SOURCE_CODE); + protected readonly text = inject(TUI_DOC_SOURCE_CODE_TEXT); + @Input() public header = ''; @@ -29,10 +33,6 @@ export class TuiDocSourceCodeComponent { @Input() public path = ''; - protected readonly icons = inject(TUI_DOC_ICONS); - protected readonly sourceCode = inject(TUI_DOC_SOURCE_CODE); - protected readonly text = inject(TUI_DOC_SOURCE_CODE_TEXT); - protected get pathOptions(): TuiDocSourceCodePathOptions { return this.getPathOptions(this.header, this.package, this.type, this.path); } diff --git a/projects/addon-doc/components/language-switcher/index.ts b/projects/addon-doc/components/language-switcher/index.ts index fa4bbc96c14f..027e51fa5f83 100644 --- a/projects/addon-doc/components/language-switcher/index.ts +++ b/projects/addon-doc/components/language-switcher/index.ts @@ -22,6 +22,9 @@ import {TuiSelectModule} from '@taiga-ui/legacy'; changeDetection: ChangeDetectionStrategy.OnPush, }) export class TuiLanguageSwitcherComponent { + protected readonly switcher = inject(TuiLanguageSwitcher); + protected readonly language = new FormControl(capitalize(this.switcher.language)); + public readonly flags = new Map([ ['belarusian', 'BY'], ['chinese', 'CN'], @@ -41,11 +44,7 @@ export class TuiLanguageSwitcherComponent { ['vietnamese', 'VN'], ]); - protected readonly switcher = inject(TuiLanguageSwitcher); - - protected readonly language = new FormControl(capitalize(this.switcher.language)); - - protected readonly names: TuiLanguageName[] = Array.from(this.flags.keys()); + public readonly names: TuiLanguageName[] = Array.from(this.flags.keys()); } function capitalize(value: string): string { diff --git a/projects/addon-doc/components/page/page.component.ts b/projects/addon-doc/components/page/page.component.ts index c369f86a06ab..5ba1a5d420fb 100644 --- a/projects/addon-doc/components/page/page.component.ts +++ b/projects/addon-doc/components/page/page.component.ts @@ -42,6 +42,10 @@ import {TuiDocPageTabConnectorDirective} from './page-tab.directive'; providers: PAGE_PROVIDERS, }) export class TuiDocPageComponent { + protected readonly defaultTabs = inject(TUI_DOC_DEFAULT_TABS); + protected readonly from = / /g; + protected readonly to = '_'; + @Input() public header = ''; @@ -64,11 +68,6 @@ export class TuiDocPageComponent { public activeItemIndex = 0; public readonly seeAlso = inject(PAGE_SEE_ALSO); - protected readonly from = / /g; - protected readonly to = '_'; - - protected readonly defaultTabs = inject(TUI_DOC_DEFAULT_TABS); - public get showSeeAlso(): boolean { return !!this.seeAlso.length && this.activeItemIndex === 0; } diff --git a/projects/addon-mobile/components/mobile-calendar/mobile-calendar.component.ts b/projects/addon-mobile/components/mobile-calendar/mobile-calendar.component.ts index de290277657e..512450c455e5 100644 --- a/projects/addon-mobile/components/mobile-calendar/mobile-calendar.component.ts +++ b/projects/addon-mobile/components/mobile-calendar/mobile-calendar.component.ts @@ -124,6 +124,26 @@ export class TuiMobileCalendarComponent implements AfterViewInit { private readonly speed = inject(TUI_ANIMATIONS_SPEED); private readonly ngZone = inject(NgZone); + protected initialized = false; + protected value: TuiDay | TuiDayRange | readonly TuiDay[] | null = null; + protected readonly isIOS = inject(TUI_IS_IOS); + protected readonly isE2E = inject(TUI_IS_E2E); + protected readonly icons = inject(TUI_COMMON_ICONS); + protected readonly closeWord$ = inject(TUI_CLOSE_WORD); + protected readonly cancelWord$ = inject(TUI_CANCEL_WORD); + protected readonly doneWord$ = inject(TUI_DONE_WORD); + protected readonly unorderedWeekDays$ = inject(TUI_SHORT_WEEK_DAYS); + protected readonly chooseDayOrRangeTexts$ = inject(TUI_CHOOSE_DAY_OR_RANGE_TEXTS); + protected readonly years = Array.from({length: RANGE}, (_, i) => i + STARTING_YEAR); + protected readonly months = Array.from( + {length: RANGE * 12}, + (_, i) => + new TuiMonth( + Math.floor(i / MONTHS_IN_YEAR) + STARTING_YEAR, + i % MONTHS_IN_YEAR, + ), + ); + @Input() public single = true; @@ -147,28 +167,6 @@ export class TuiMobileCalendarComponent implements AfterViewInit { TuiDay | TuiDayRange | readonly TuiDay[] >(); - protected value: TuiDay | TuiDayRange | readonly TuiDay[] | null = null; - - protected readonly isIOS = inject(TUI_IS_IOS); - protected readonly isE2E = inject(TUI_IS_E2E); - protected readonly icons = inject(TUI_COMMON_ICONS); - protected readonly closeWord$ = inject(TUI_CLOSE_WORD); - protected readonly cancelWord$ = inject(TUI_CANCEL_WORD); - protected readonly doneWord$ = inject(TUI_DONE_WORD); - protected readonly unorderedWeekDays$ = inject(TUI_SHORT_WEEK_DAYS); - protected readonly chooseDayOrRangeTexts$ = inject(TUI_CHOOSE_DAY_OR_RANGE_TEXTS); - protected readonly years = Array.from({length: RANGE}, (_, i) => i + STARTING_YEAR); - protected readonly months = Array.from( - {length: RANGE * 12}, - (_, i) => - new TuiMonth( - Math.floor(i / MONTHS_IN_YEAR) + STARTING_YEAR, - i % MONTHS_IN_YEAR, - ), - ); - - protected initialized = false; - constructor() { inject(TUI_VALUE_STREAM) .pipe(takeUntilDestroyed()) diff --git a/projects/addon-mobile/components/pull-to-refresh/pull-to-refresh.component.ts b/projects/addon-mobile/components/pull-to-refresh/pull-to-refresh.component.ts index f0f581ebb87e..e7d5fde597eb 100644 --- a/projects/addon-mobile/components/pull-to-refresh/pull-to-refresh.component.ts +++ b/projects/addon-mobile/components/pull-to-refresh/pull-to-refresh.component.ts @@ -35,18 +35,7 @@ export class TuiPullToRefreshComponent { private readonly isIOS = inject(TUI_IS_IOS); private readonly threshold = inject(TUI_PULL_TO_REFRESH_THRESHOLD); - @Input() - public styleHandler: TuiHandler | null> = this.isIOS - ? distance => ({top: tuiPx(distance / 2)}) - : () => null; - - @Output() - public readonly pulled: Observable = inject(TuiPullToRefreshService).pipe( - filter(distance => distance === this.threshold), - ); - protected readonly pulling$ = inject(TuiPullToRefreshService); - protected readonly component = inject>>( TUI_PULL_TO_REFRESH_COMPONENT, ); @@ -56,6 +45,16 @@ export class TuiPullToRefreshComponent { distinctUntilChanged(), ); + @Input() + public styleHandler: TuiHandler | null> = this.isIOS + ? distance => ({top: tuiPx(distance / 2)}) + : () => null; + + @Output() + public readonly pulled: Observable = inject(TuiPullToRefreshService).pipe( + filter(distance => distance === this.threshold), + ); + constructor() { if (!this.component) { return; // Ensure scrolling down is impossible while pulling diff --git a/projects/addon-mobile/components/tab-bar/tab-bar-item.component.ts b/projects/addon-mobile/components/tab-bar/tab-bar-item.component.ts index e624da10a36f..dfe29ce7bafb 100644 --- a/projects/addon-mobile/components/tab-bar/tab-bar-item.component.ts +++ b/projects/addon-mobile/components/tab-bar/tab-bar-item.component.ts @@ -17,14 +17,14 @@ import { animations: [tuiScaleIn], }) export class TuiTabBarItemComponent { + protected readonly options = tuiToAnimationOptions(inject(TUI_ANIMATIONS_SPEED)); + @Input() public icon = ''; @Input() public badge?: number | null = null; - protected readonly options = tuiToAnimationOptions(inject(TUI_ANIMATIONS_SPEED)); - protected format(value: number): string { return value > 999 ? '999+' : String(value); } diff --git a/projects/addon-mobile/directives/ripple/ripple.directive.ts b/projects/addon-mobile/directives/ripple/ripple.directive.ts index e11915b8c7a9..d2f3e147bf51 100644 --- a/projects/addon-mobile/directives/ripple/ripple.directive.ts +++ b/projects/addon-mobile/directives/ripple/ripple.directive.ts @@ -60,14 +60,14 @@ export class TuiRippleDirective { duration: tuiGetDuration(inject(TUI_ANIMATIONS_SPEED)), }; + protected readonly nothing = tuiWithStyles(TuiRippleStyles); + @Input({ alias: 'tuiRipple', transform: selectorScopeFallback, }) public selector = DEFAULT_SELECTOR; - protected readonly nothing = tuiWithStyles(TuiRippleStyles); - @HostListener('pointerdown.silent', [ '$event.clientX', '$event.clientY', diff --git a/projects/addon-table/components/reorder/reorder.component.ts b/projects/addon-table/components/reorder/reorder.component.ts index 5ef16f2f92ae..aec5e36841bd 100644 --- a/projects/addon-table/components/reorder/reorder.component.ts +++ b/projects/addon-table/components/reorder/reorder.component.ts @@ -35,6 +35,11 @@ import {TUI_REORDER_OPTIONS} from './reorder.options'; export class TuiReorderComponent { private dragging = false; + protected order = new Map(); + protected unsortedItems: readonly T[] = []; + protected readonly options = inject(TUI_REORDER_OPTIONS); + protected readonly showHideText$ = inject(TUI_TABLE_SHOW_HIDE_MESSAGE); + @Input() public enabled: readonly T[] = []; @@ -44,11 +49,6 @@ export class TuiReorderComponent { @Output() public readonly enabledChange = new EventEmitter(); - protected order = new Map(); - protected unsortedItems: readonly T[] = []; - protected readonly options = inject(TUI_REORDER_OPTIONS); - protected readonly showHideText$ = inject(TUI_TABLE_SHOW_HIDE_MESSAGE); - @Input() public set items(items: readonly T[]) { if ( diff --git a/projects/addon-table/components/table-pagination/table-pagination.component.ts b/projects/addon-table/components/table-pagination/table-pagination.component.ts index f21ecd99c480..cebdb7373d2e 100644 --- a/projects/addon-table/components/table-pagination/table-pagination.component.ts +++ b/projects/addon-table/components/table-pagination/table-pagination.component.ts @@ -51,6 +51,12 @@ export interface TuiTablePagination { export class TuiTablePaginationComponent { private readonly options = inject(TUI_TABLE_PAGINATION_OPTIONS); + protected open = false; + protected readonly icons = inject(TUI_SPIN_ICONS); + protected readonly spinTexts$ = inject(TUI_SPIN_TEXTS); + protected readonly texts$ = inject(TUI_TABLE_PAGINATION_TEXTS); + protected readonly commonIcons = inject(TUI_COMMON_ICONS); + @Input() public items: readonly number[] = this.options.items; @@ -66,13 +72,6 @@ export class TuiTablePaginationComponent { @Output() public readonly paginationChange = new EventEmitter(); - protected open = false; - - protected readonly icons = inject(TUI_SPIN_ICONS); - protected readonly spinTexts$ = inject(TUI_SPIN_TEXTS); - protected readonly texts$ = inject(TUI_TABLE_PAGINATION_TEXTS); - protected readonly commonIcons = inject(TUI_COMMON_ICONS); - public onItem(size: number): void { const {start} = this; diff --git a/projects/addon-table/components/table/directives/table.directive.ts b/projects/addon-table/components/table/directives/table.directive.ts index a7f3ed5e89cf..9f1aeb579f0a 100644 --- a/projects/addon-table/components/table/directives/table.directive.ts +++ b/projects/addon-table/components/table/directives/table.directive.ts @@ -33,6 +33,11 @@ export class TuiTableDirective>> private readonly options = inject(TUI_TABLE_OPTIONS); private readonly cdr = inject(ChangeDetectorRef); + protected readonly stuck$ = inject(TUI_STUCK); + protected readonly entries$ = inject>( + IntersectionObserverService, + ); + @Input() public columns: ReadonlyArray = []; @@ -49,11 +54,6 @@ export class TuiTableDirective>> @Output() public readonly sorterChange = new EventEmitter | null>(); - protected readonly stuck$ = inject(TUI_STUCK); - protected readonly entries$ = inject>( - IntersectionObserverService, - ); - @Input() public sorter: TuiComparator = () => 0; diff --git a/projects/addon-table/components/table/tbody/tbody.component.ts b/projects/addon-table/components/table/tbody/tbody.component.ts index a85c3643c86a..1bd582207b38 100644 --- a/projects/addon-table/components/table/tbody/tbody.component.ts +++ b/projects/addon-table/components/table/tbody/tbody.component.ts @@ -45,6 +45,13 @@ export class TuiTbodyComponent>> { private readonly pipe = inject(TuiTableSortPipe); private readonly options = inject(TUI_TABLE_OPTIONS); + @ContentChild(forwardRef(() => TuiRowDirective)) + protected readonly row?: TuiRowDirective; + + protected readonly table = inject>( + forwardRef(() => TuiTableDirective), + ); + @ContentChildren(forwardRef(() => TuiTrComponent)) public readonly rows: QueryList> = EMPTY_QUERY; @@ -60,13 +67,6 @@ export class TuiTbodyComponent>> { @Output() public readonly openChange = new EventEmitter(); - @ContentChild(forwardRef(() => TuiRowDirective)) - protected readonly row?: TuiRowDirective; - - protected readonly table = inject>( - forwardRef(() => TuiTableDirective), - ); - public get sorted(): readonly T[] { return this.pipe.transform(this.data); } diff --git a/projects/addon-table/components/table/th/th.component.ts b/projects/addon-table/components/table/th/th.component.ts index c2421c91c2e7..2d9e529a3f88 100644 --- a/projects/addon-table/components/table/th/th.component.ts +++ b/projects/addon-table/components/table/th/th.component.ts @@ -34,6 +34,14 @@ export class TuiThComponent>> { optional: true, }); + @HostBinding('style.width.px') + protected width: number | null = null; + + protected readonly table = inject>( + forwardRef(() => TuiTableDirective), + {optional: true}, + ); + @Input() public sorter: TuiComparator | null = this.head ? (a, b) => tuiDefaultSort(a[this.key], b[this.key]) @@ -46,14 +54,6 @@ export class TuiThComponent>> { @HostBinding('class._sticky') public sticky = this.options.sticky; - @HostBinding('style.width.px') - protected width: number | null = null; - - protected readonly table = inject>( - forwardRef(() => TuiTableDirective), - {optional: true}, - ); - public get key(): keyof T { if (!this.head) { throw new TuiTableSortKeyException(); diff --git a/projects/addon-table/directives/table-filters/table-filter.directive.ts b/projects/addon-table/directives/table-filters/table-filter.directive.ts index 141729f93350..b24898b53938 100644 --- a/projects/addon-table/directives/table-filters/table-filter.directive.ts +++ b/projects/addon-table/directives/table-filters/table-filter.directive.ts @@ -17,6 +17,7 @@ export class TuiTableFilterDirective implements OnInit, OnDestroy, TuiTableFi private readonly head = inject(TuiHeadDirective, {optional: true}); private readonly delegate = inject(AbstractTuiTableFilter, any>); private readonly control = inject(NgControl); + protected readonly filters = inject(TuiTableFiltersDirective); @Input() public tuiTableFilter?: keyof T; @@ -28,8 +29,6 @@ export class TuiTableFilterDirective implements OnInit, OnDestroy, TuiTableFi ), ); - protected readonly filters = inject(TuiTableFiltersDirective); - public ngOnInit(): void { this.filters.register(this); } diff --git a/projects/addon-tablebars/components/table-bars-host/table-bars-host.component.ts b/projects/addon-tablebars/components/table-bars-host/table-bars-host.component.ts index 802af8b3b67c..5af1e382286b 100644 --- a/projects/addon-tablebars/components/table-bars-host/table-bars-host.component.ts +++ b/projects/addon-tablebars/components/table-bars-host/table-bars-host.component.ts @@ -31,10 +31,10 @@ import {TuiTableBarsService} from '../../services/table-bars.service'; export class TuiTableBarsHostComponent { private readonly media = inject(TUI_MEDIA); private readonly win = inject(WINDOW); - public readonly service = inject(TuiTableBarsService); protected readonly closeWord$ = inject(TUI_CLOSE_WORD); protected readonly icons = inject(TUI_COMMON_ICONS); protected readonly options = tuiToAnimationOptions(inject(TUI_ANIMATIONS_SPEED)); + public readonly service = inject(TuiTableBarsService); protected get isMobile(): boolean { return tuiGetViewportWidth(this.win) < this.media.mobile; diff --git a/projects/cdk/classes/control.ts b/projects/cdk/classes/control.ts index 69adbc730d52..51d599570271 100644 --- a/projects/cdk/classes/control.ts +++ b/projects/cdk/classes/control.ts @@ -39,13 +39,6 @@ export abstract class AbstractTuiControl private previousInternalValue?: T | null; private readonly refresh$ = new Subject(); - @Input() - @HostBinding('class._readonly') - public readOnly = false; - - @Input() - public pseudoInvalid: boolean | null = null; - protected onTouched = EMPTY_FUNCTION; protected onChange = EMPTY_FUNCTION; protected readonly fallbackValue = this.getFallbackValue(); @@ -56,6 +49,13 @@ export abstract class AbstractTuiControl {optional: true}, ); + @Input() + @HostBinding('class._readonly') + public readOnly = false; + + @Input() + public pseudoInvalid: boolean | null = null; + constructor() { super(); diff --git a/projects/cdk/classes/interactive.ts b/projects/cdk/classes/interactive.ts index 1c9b60c2890f..d2204e559e0f 100644 --- a/projects/cdk/classes/interactive.ts +++ b/projects/cdk/classes/interactive.ts @@ -16,6 +16,8 @@ export abstract class AbstractTuiInteractive { private readonly autoIdString: string; + protected focusVisible = false; + @Input() public pseudoHover: boolean | null = null; @@ -44,8 +46,6 @@ export abstract class AbstractTuiInteractive { @Output() public readonly focusVisibleChange = new EventEmitter(); - protected focusVisible = false; - constructor() { this.autoIdString = `${TUI}${AbstractTuiInteractive.autoId++}${Date.now()}`; } diff --git a/projects/cdk/directives/pan/pan.service.ts b/projects/cdk/directives/pan/pan.service.ts index 7e43d08138a8..eec08856233c 100644 --- a/projects/cdk/directives/pan/pan.service.ts +++ b/projects/cdk/directives/pan/pan.service.ts @@ -43,7 +43,6 @@ export class TuiPanService extends Observable { return [deltaX, deltaY] as [number, number]; }), - // eslint-disable-next-line rxjs/no-unsafe-takeuntil takeUntil( merge( tuiTypedFromEvent(doc, 'touchend'), diff --git a/projects/cdk/directives/resizer/resizer.directive.ts b/projects/cdk/directives/resizer/resizer.directive.ts index 627e23198b23..135a77a19a53 100644 --- a/projects/cdk/directives/resizer/resizer.directive.ts +++ b/projects/cdk/directives/resizer/resizer.directive.ts @@ -20,17 +20,17 @@ import {TuiResizeableDirective} from './resizeable.directive'; export class TuiResizerDirective { private readonly resizeable: ElementRef = inject(TuiResizeableDirective); + protected x = NaN; + protected y = NaN; + protected width = 0; + protected height = 0; + @Input() public tuiResizer: readonly [x: number, y: number] = [0, 0]; @Output() public readonly tuiSizeChange = new EventEmitter(); - protected x = NaN; - protected y = NaN; - protected width = 0; - protected height = 0; - @HostBinding('style.cursor') protected get cursor(): string { if (!this.tuiResizer[0]) { diff --git a/projects/cdk/observables/take-until-destroyed.ts b/projects/cdk/observables/take-until-destroyed.ts index ed817c73610c..d8b29c729380 100644 --- a/projects/cdk/observables/take-until-destroyed.ts +++ b/projects/cdk/observables/take-until-destroyed.ts @@ -12,7 +12,6 @@ export function tuiTakeUntilDestroyed( return pipe( takeUntil( NEVER.pipe( - // eslint-disable-next-line rxjs/no-unsafe-takeuntil takeUntilDestroyed(destroyRef), catchError(() => EMPTY), defaultIfEmpty(null), diff --git a/projects/cdk/schematics/ng-update/v3/steps/migrate-progress.ts b/projects/cdk/schematics/ng-update/v3/steps/migrate-progress.ts index 561c132d9919..2e295bb541a2 100644 --- a/projects/cdk/schematics/ng-update/v3/steps/migrate-progress.ts +++ b/projects/cdk/schematics/ng-update/v3/steps/migrate-progress.ts @@ -24,7 +24,6 @@ import type {TemplateResource} from '../../interfaces/template-resource'; const PROPERTY_FOR_DEPRECATED_PIPES = '[color]'; export const DEPRECATED_PROGRESS_PIPES_REG = - // eslint-disable-next-line unicorn/no-unsafe-regex /\s*\|\s*tuiProgressColorSegments(Async\s*\|\s*async)?/gi; export function replaceProgressColorSegmentsPipe( diff --git a/projects/cdk/schematics/ng-update/v3/steps/migrate-templates.ts b/projects/cdk/schematics/ng-update/v3/steps/migrate-templates.ts index b221fa28f9d3..651d1cc12ec8 100644 --- a/projects/cdk/schematics/ng-update/v3/steps/migrate-templates.ts +++ b/projects/cdk/schematics/ng-update/v3/steps/migrate-templates.ts @@ -253,7 +253,6 @@ function addEditorProviders({ } } -// eslint-disable-next-line unicorn/no-unsafe-regex const HIDE_SELECTED_PIPE_WITH_ARGS_REG = /\|\s*tuiHideSelected(\s*:\s*[^|'"]*)?/gi; function migrateTuiHideSelectedPipe({ diff --git a/projects/cdk/schematics/ng-update/v4/steps/migrate-styles.ts b/projects/cdk/schematics/ng-update/v4/steps/migrate-styles.ts index cff673a87f7f..17c1532099d5 100644 --- a/projects/cdk/schematics/ng-update/v4/steps/migrate-styles.ts +++ b/projects/cdk/schematics/ng-update/v4/steps/migrate-styles.ts @@ -1,3 +1,4 @@ +/// import {getActiveProject} from 'ng-morph'; export const TUI_RATING_WARNING = diff --git a/projects/cdk/tokens/active-element.ts b/projects/cdk/tokens/active-element.ts index 2467d1bb91c5..a5b79910074d 100644 --- a/projects/cdk/tokens/active-element.ts +++ b/projects/cdk/tokens/active-element.ts @@ -67,7 +67,6 @@ export const TUI_ACTIVE_ELEMENT = tuiCreateTokenFromFactory< return merge( focusout$.pipe( - // eslint-disable-next-line rxjs/no-unsafe-takeuntil takeUntil(mousedown$), repeat({delay: () => mouseup$}), withLatestFrom(removedElement$), diff --git a/projects/cdk/utils/color/hex-to-rgba.ts b/projects/cdk/utils/color/hex-to-rgba.ts index d4b4af74f000..46c1dfe5ad6f 100644 --- a/projects/cdk/utils/color/hex-to-rgba.ts +++ b/projects/cdk/utils/color/hex-to-rgba.ts @@ -23,7 +23,6 @@ export function tuiHexToRGBA(hex: string, alpha?: number): string { } export function tuiIsValidHex(hex: string): boolean { - // eslint-disable-next-line unicorn/no-unsafe-regex return /^#([A-Fa-f0-9]{3,4}){1,2}$/.test(hex); } diff --git a/projects/cdk/utils/color/rgba-to-hex.ts b/projects/cdk/utils/color/rgba-to-hex.ts index 9b5c016ebe1f..d6984c872175 100644 --- a/projects/cdk/utils/color/rgba-to-hex.ts +++ b/projects/cdk/utils/color/rgba-to-hex.ts @@ -6,7 +6,6 @@ export function tuiRgbaToHex(color: string): string { const rgb: number[] = (color .replaceAll(/\s/g, '') - // eslint-disable-next-line unicorn/no-unsafe-regex .match(/^rgba?\((\d+),(\d+),(\d+),?([^,\s)]+)?/i) as unknown as number[]) ?? []; let alpha: number | string = (rgb?.[4] ?? '').toString().trim(); diff --git a/projects/core/components/button/button.directive.ts b/projects/core/components/button/button.directive.ts index ad4af766b489..3613a2552e5b 100644 --- a/projects/core/components/button/button.directive.ts +++ b/projects/core/components/button/button.directive.ts @@ -52,8 +52,8 @@ class TuiButtonStyles {} export class TuiButtonDirective { private readonly options = inject(TUI_BUTTON_OPTIONS); + protected readonly nothing = tuiWithStyles(TuiButtonStyles); + @Input() public size = this.options.size; - - protected readonly nothing = tuiWithStyles(TuiButtonStyles); } diff --git a/projects/core/components/calendar/calendar-sheet.component.ts b/projects/core/components/calendar/calendar-sheet.component.ts index 11d227cf719a..35f1b1302a96 100644 --- a/projects/core/components/calendar/calendar-sheet.component.ts +++ b/projects/core/components/calendar/calendar-sheet.component.ts @@ -45,6 +45,9 @@ export type TuiMarkerHandler = TuiHandler(); - protected readonly unorderedWeekDays$ = inject(TUI_SHORT_WEEK_DAYS); - protected readonly dayTypeHandler = inject(TUI_DAY_TYPE_HANDLER); - public itemIsInterval(day: TuiDay): boolean { const {value, hoveredItem} = this; diff --git a/projects/core/components/data-list/data-list.component.ts b/projects/core/components/data-list/data-list.component.ts index f1ce34ea0a1c..33a7a9273bf7 100644 --- a/projects/core/components/data-list/data-list.component.ts +++ b/projects/core/components/data-list/data-list.component.ts @@ -61,6 +61,8 @@ export class TuiDataListComponent implements TuiDataListAccessor { optional: true, }); + protected readonly defaultEmptyContent$ = inject(TUI_NOTHING_FOUND_MESSAGE); + @Input() public emptyContent: PolymorpheusContent; @@ -68,8 +70,6 @@ export class TuiDataListComponent implements TuiDataListAccessor { @HostBinding('attr.data-size') public size = this.controller?.size || 'm'; - protected readonly defaultEmptyContent$ = inject(TUI_NOTHING_FOUND_MESSAGE); - @HostListener('keydown.arrowDown.prevent', ['$event.target', '1']) @HostListener('keydown.arrowUp.prevent', ['$event.target', '-1']) public onKeyDownArrow(current: HTMLElement, step: number): void { diff --git a/projects/core/components/data-list/option.component.ts b/projects/core/components/data-list/option.component.ts index f2eb4185c248..f59f651dc0c8 100644 --- a/projects/core/components/data-list/option.component.ts +++ b/projects/core/components/data-list/option.component.ts @@ -54,18 +54,18 @@ export class TuiOptionComponent implements OnDestroy { optional: true, }); - @Input() - public disabled = false; - - @Input() - public value?: T; - protected readonly content = inject(TUI_OPTION_CONTENT, {optional: true}); protected readonly dropdown = inject(TuiDropdownDirective, { self: true, optional: true, }); + @Input() + public disabled = false; + + @Input() + public value?: T; + // Preventing focus loss upon focused option removal public ngOnDestroy(): void { this.dataList?.handleFocusLossIfNecessary(this.el); diff --git a/projects/core/components/expand/expand.component.ts b/projects/core/components/expand/expand.component.ts index cac0ba5b0761..5f4260a5fd2a 100644 --- a/projects/core/components/expand/expand.component.ts +++ b/projects/core/components/expand/expand.component.ts @@ -54,9 +54,6 @@ export class TuiExpandComponent { private readonly destroyRef = inject(DestroyRef); private state: TuiValuesOf = State.Idle; - @Input() - public async = false; - @ContentChild(TuiExpandContentDirective, {read: TemplateRef}) protected content: TemplateRef> | null = null; @@ -64,6 +61,9 @@ export class TuiExpandComponent { @HostBinding('attr.aria-expanded') protected expanded: boolean | null = null; + @Input() + public async = false; + @Input('expanded') public set expandedSetter(expanded: boolean | null) { if (this.expanded === null) { diff --git a/projects/core/components/group/group.directive.ts b/projects/core/components/group/group.directive.ts index 66018010a5a6..a99e7dea0c06 100644 --- a/projects/core/components/group/group.directive.ts +++ b/projects/core/components/group/group.directive.ts @@ -38,6 +38,8 @@ class TuiGroupStyles {} export class TuiGroupDirective { private readonly options = inject(TUI_GROUP_OPTIONS); + protected readonly nothing = tuiWithStyles(TuiGroupStyles); + @Input() public orientation: TuiOrientation = this.options.orientation; @@ -51,6 +53,4 @@ export class TuiGroupDirective { @Input() public size: TuiSizeL = this.options.size; - - protected readonly nothing = tuiWithStyles(TuiGroupStyles); } diff --git a/projects/core/components/hosted-dropdown/hosted-dropdown.component.ts b/projects/core/components/hosted-dropdown/hosted-dropdown.component.ts index a858cabfb6b8..3490a93f9df7 100644 --- a/projects/core/components/hosted-dropdown/hosted-dropdown.component.ts +++ b/projects/core/components/hosted-dropdown/hosted-dropdown.component.ts @@ -132,6 +132,12 @@ export class TuiHostedDropdownComponent implements TuiFocusableElementAccessor { ) .pipe(map(([visible, hovered]) => visible && hovered)); + @ViewChild(TuiActiveZoneDirective) + protected readonly activeZone!: TuiActiveZoneDirective; + + protected readonly focus$ = new BehaviorSubject(false); + protected readonly context!: TuiContext; + @Input() public content: PolymorpheusContent; @@ -155,12 +161,6 @@ export class TuiHostedDropdownComponent implements TuiFocusableElementAccessor { /** TODO: rename in 4.0 */ public readonly openChange = this.openChange$; - @ViewChild(TuiActiveZoneDirective) - protected readonly activeZone!: TuiActiveZoneDirective; - - protected readonly focus$ = new BehaviorSubject(false); - protected readonly context!: TuiContext; - @Input() public set open(open: boolean) { this.openChange.next(open); diff --git a/projects/core/components/icon/icon.component.ts b/projects/core/components/icon/icon.component.ts index 6b9972ff46af..92da7bc80afe 100644 --- a/projects/core/components/icon/icon.component.ts +++ b/projects/core/components/icon/icon.component.ts @@ -17,11 +17,11 @@ import {TUI_ICON_RESOLVER} from '@taiga-ui/core/tokens'; changeDetection: ChangeDetectionStrategy.OnPush, }) export class TuiIconComponent { + protected readonly resolver = inject>(TUI_ICON_RESOLVER); + @Input() public icon = ''; @Input() public background = ''; - - protected readonly resolver = inject>(TUI_ICON_RESOLVER); } diff --git a/projects/core/components/link/link.directive.ts b/projects/core/components/link/link.directive.ts index f986677d5db9..2f0fa6cdc852 100644 --- a/projects/core/components/link/link.directive.ts +++ b/projects/core/components/link/link.directive.ts @@ -51,8 +51,8 @@ class TuiLinkStyles {} }, }) export class TuiLinkDirective { + protected readonly nothing = tuiWithStyles(TuiLinkStyles); + @Input() public pseudo = inject(TUI_LINK_OPTIONS).pseudo; - - protected readonly nothing = tuiWithStyles(TuiLinkStyles); } diff --git a/projects/core/components/loader/loader.component.ts b/projects/core/components/loader/loader.component.ts index 9faf2beb2660..d8048dd67a07 100644 --- a/projects/core/components/loader/loader.component.ts +++ b/projects/core/components/loader/loader.component.ts @@ -33,6 +33,11 @@ export class TuiLoaderComponent { private readonly isIOS = inject(TUI_IS_IOS); private readonly options = inject(TUI_LOADER_OPTIONS); + @HostBinding('class._loading') + protected loading = true; + + protected readonly isApple = tuiIsSafari(this.el) || this.isIOS; + @Input() @HostBinding('attr.data-size') public size = this.options.size; @@ -46,11 +51,6 @@ export class TuiLoaderComponent { @Input() public textContent: PolymorpheusContent; - @HostBinding('class._loading') - protected loading = true; - - protected readonly isApple = tuiIsSafari(this.el) || this.isIOS; - @Input() public set showLoader(value: boolean) { // @bad TODO: https://github.com/angular/angular/issues/32083 think of a better way diff --git a/projects/core/components/notification/notification.component.ts b/projects/core/components/notification/notification.component.ts index ea6ad1c56e4b..42bc0ebb9d8d 100644 --- a/projects/core/components/notification/notification.component.ts +++ b/projects/core/components/notification/notification.component.ts @@ -29,6 +29,9 @@ import {TUI_NOTIFICATION_OPTIONS} from './notification.options'; export class TuiNotificationComponent { private readonly options = inject(TUI_NOTIFICATION_OPTIONS); + protected readonly closeWord$ = inject(TUI_CLOSE_WORD); + protected readonly icons = inject(TUI_COMMON_ICONS); + @Input() public icon: PolymorpheusContent> = this.options.icon; @@ -46,9 +49,6 @@ export class TuiNotificationComponent { @Output() public readonly close = new EventEmitter(); - protected readonly closeWord$ = inject(TUI_CLOSE_WORD); - protected readonly icons = inject(TUI_COMMON_ICONS); - protected get hasClose(): boolean { return !this.hideClose && this.close.observed; } diff --git a/projects/core/components/primitive-textfield/primitive-textfield.component.ts b/projects/core/components/primitive-textfield/primitive-textfield.component.ts index 10da93f96e27..e934f2dadf6a 100644 --- a/projects/core/components/primitive-textfield/primitive-textfield.component.ts +++ b/projects/core/components/primitive-textfield/primitive-textfield.component.ts @@ -65,6 +65,13 @@ export class TuiPrimitiveTextfieldComponent private readonly options = inject(TUI_TEXTFIELD_OPTIONS_LEGACY); private readonly el = tuiInjectElement(); + @ContentChildren(PolymorpheusOutletDirective, {descendants: true}) + protected readonly content?: QueryList; + + protected readonly controller = inject(TUI_TEXTFIELD_WATCHED_CONTROLLER); + protected readonly hintOptions = inject(TuiHintOptionsDirective, {optional: true}); + protected autofilled = false; + @Input() public editable = true; @@ -91,14 +98,6 @@ export class TuiPrimitiveTextfieldComponent @Output() public readonly valueChange = new EventEmitter(); - @ContentChildren(PolymorpheusOutletDirective, {descendants: true}) - protected readonly content?: QueryList; - - protected readonly hintOptions = inject(TuiHintOptionsDirective, {optional: true}); - protected autofilled = false; - - protected readonly controller = inject(TUI_TEXTFIELD_WATCHED_CONTROLLER); - public get prefix(): string { return this.controller.prefix; } diff --git a/projects/core/components/scrollbar/scrollbar.component.ts b/projects/core/components/scrollbar/scrollbar.component.ts index 2ff5f2c81a57..9ed8a2fad294 100644 --- a/projects/core/components/scrollbar/scrollbar.component.ts +++ b/projects/core/components/scrollbar/scrollbar.component.ts @@ -41,13 +41,12 @@ export const TUI_SCROLLABLE = 'tui-scrollable'; export class TuiScrollbarComponent { private readonly el = tuiInjectElement(); - @Input() - public hidden = false; - protected readonly isIOS = inject(TUI_IS_IOS); - protected readonly browserScrollRef = new ElementRef(this.el); + @Input() + public hidden = false; + protected get delegated(): boolean { return this.browserScrollRef.nativeElement !== this.el; } diff --git a/projects/core/components/scrollbar/scrollbar.directive.ts b/projects/core/components/scrollbar/scrollbar.directive.ts index e2cc959e1f8f..9d45a14f27cf 100644 --- a/projects/core/components/scrollbar/scrollbar.directive.ts +++ b/projects/core/components/scrollbar/scrollbar.directive.ts @@ -18,9 +18,6 @@ export class TuiScrollbarDirective { private readonly el = inject(TUI_SCROLL_REF).nativeElement; private readonly style = tuiInjectElement().style; - @Input() - public tuiScrollbar: 'horizontal' | 'vertical' = 'vertical'; - protected readonly scrollSub = inject(TuiScrollbarService) .pipe(takeUntilDestroyed()) .subscribe(([top, left]) => { @@ -44,6 +41,9 @@ export class TuiScrollbarDirective { } }); + @Input() + public tuiScrollbar: 'horizontal' | 'vertical' = 'vertical'; + private get scrolled(): number { const { scrollTop, diff --git a/projects/core/components/spin-button/spin-button.component.ts b/projects/core/components/spin-button/spin-button.component.ts index 5b55acdb1804..4e47218754bd 100644 --- a/projects/core/components/spin-button/spin-button.component.ts +++ b/projects/core/components/spin-button/spin-button.component.ts @@ -23,6 +23,9 @@ import {TUI_SPIN_ICONS, TUI_SPIN_TEXTS} from '@taiga-ui/core/tokens'; }, }) export class TuiSpinButtonComponent { + protected readonly icons = inject(TUI_SPIN_ICONS); + protected readonly spinTexts$ = inject(TUI_SPIN_TEXTS); + @Input() public focusable = true; @@ -41,9 +44,6 @@ export class TuiSpinButtonComponent { @Output() public readonly rightClick = new EventEmitter(); - protected readonly icons = inject(TUI_SPIN_ICONS); - protected readonly spinTexts$ = inject(TUI_SPIN_TEXTS); - @HostListener('keydown.arrowLeft.prevent') public onLeftClick(): void { if (!this.leftComputedDisabled) { diff --git a/projects/core/components/textfield/select.directive.ts b/projects/core/components/textfield/select.directive.ts index 95ade0dacc38..c9461f8a0eb0 100644 --- a/projects/core/components/textfield/select.directive.ts +++ b/projects/core/components/textfield/select.directive.ts @@ -25,7 +25,6 @@ import {TuiTextfieldDirective} from './textfield.directive'; }, hostDirectives: [TuiNativeValidatorDirective, TuiAppearanceDirective], }) -// eslint-disable-next-line @angular-eslint/component-class-suffix export class TuiSelectDirective extends TuiTextfieldDirective { private readonly nav = inject(NAVIGATOR); private readonly control = inject(NgControl); diff --git a/projects/core/components/textfield/textfield.component.ts b/projects/core/components/textfield/textfield.component.ts index 8a3139d7c335..a4c571e13d72 100644 --- a/projects/core/components/textfield/textfield.component.ts +++ b/projects/core/components/textfield/textfield.component.ts @@ -87,18 +87,6 @@ export class TuiTextfieldComponent self: true, }); - @Input() - public filler = ''; - - @Input() - public stringify: TuiStringHandler = String; - - @Input() - public content: PolymorpheusContent>; - - // TODO: Refactor - public readonly focusedChange = EMPTY; - @ContentChild(TuiTextfieldDirective) protected readonly directive?: TuiTextfieldDirective; @@ -112,6 +100,18 @@ export class TuiTextfieldComponent protected readonly options = inject(TUI_TEXTFIELD_OPTIONS); protected readonly control = inject(NgControl, {optional: true}); + @Input() + public filler = ''; + + @Input() + public stringify: TuiStringHandler = String; + + @Input() + public content: PolymorpheusContent>; + + // TODO: Refactor + public readonly focusedChange = EMPTY; + public get nativeFocusableElement(): HTMLInputElement { return this.input; } diff --git a/projects/core/components/textfield/textfield.directive.ts b/projects/core/components/textfield/textfield.directive.ts index 7abd9e60656d..22ee29b23476 100644 --- a/projects/core/components/textfield/textfield.directive.ts +++ b/projects/core/components/textfield/textfield.directive.ts @@ -26,6 +26,10 @@ export class TuiTextfieldDirective implements DoCheck { private readonly appearance = inject(TuiAppearanceDirective); private readonly options = inject(TUI_TEXTFIELD_OPTIONS); + protected readonly textfield = inject(TuiTextfieldComponent); + protected readonly id = inject(TuiIdService).generate(); + protected readonly el = tuiInjectElement(); + @Input() public readOnly = false; @@ -38,10 +42,6 @@ export class TuiTextfieldDirective implements DoCheck { @Input() public state: TuiInteractiveState | null = null; - protected readonly textfield = inject(TuiTextfieldComponent); - protected readonly id = inject(TuiIdService).generate(); - protected readonly el = tuiInjectElement(); - public ngDoCheck(): void { this.appearance.tuiAppearance = this.options.appearance; this.appearance.tuiAppearanceFocus = this.focused ?? this.textfield.focused; diff --git a/projects/core/components/tooltip/tooltip.component.ts b/projects/core/components/tooltip/tooltip.component.ts index 24e3947424ed..27cab351b4c4 100644 --- a/projects/core/components/tooltip/tooltip.component.ts +++ b/projects/core/components/tooltip/tooltip.component.ts @@ -20,15 +20,15 @@ import {TuiHintHoverDirective, TuiHintOptionsDirective} from '@taiga-ui/core/dir export class TuiTooltipComponent extends TuiHintOptionsDirective { private readonly isMobile = inject(TUI_IS_MOBILE); + @ViewChild(TuiHintHoverDirective) + protected readonly driver$?: TuiHintHoverDirective; + @Input() public describeId = ''; @Input() public context?: C; - @ViewChild(TuiHintHoverDirective) - protected readonly driver$?: TuiHintHoverDirective; - @HostBinding('attr.data-appearance') protected get computedAppearance(): string { return this.appearance || ''; diff --git a/projects/core/directives/dropdown/dropdown-context.directive.ts b/projects/core/directives/dropdown/dropdown-context.directive.ts index d31ddd7786dd..0cde858371c4 100644 --- a/projects/core/directives/dropdown/dropdown-context.directive.ts +++ b/projects/core/directives/dropdown/dropdown-context.directive.ts @@ -27,10 +27,10 @@ export class TuiDropdownContextDirective extends TuiRectAccessor { private readonly driver = inject(TuiDropdownDriver); private currentRect = EMPTY_CLIENT_RECT; - public readonly type = 'dropdown'; - protected readonly activeZone = inject(TuiActiveZoneDirective); + public readonly type = 'dropdown'; + public getClientRect(): DOMRect { return this.currentRect; } diff --git a/projects/core/directives/dropdown/dropdown-open.directive.ts b/projects/core/directives/dropdown/dropdown-open.directive.ts index ebded75e59ed..a15b0be2a2c6 100644 --- a/projects/core/directives/dropdown/dropdown-open.directive.ts +++ b/projects/core/directives/dropdown/dropdown-open.directive.ts @@ -76,15 +76,6 @@ export class TuiDropdownOpenDirective implements OnChanges { private readonly driver = inject(TuiDropdownDriver); private readonly obscured = inject(TuiObscuredDirective); - @Input() - public tuiDropdownEnabled = true; - - @Input() - public tuiDropdownOpen: boolean | '' = false; - - @Output() - public readonly tuiDropdownOpenChange = new EventEmitter(); - protected readonly sub = merge( this.obscured.tuiObscured.pipe(filter(Boolean)), inject(TuiActiveZoneDirective).tuiActiveZoneChange.pipe(filter(a => !a)), @@ -96,6 +87,15 @@ export class TuiDropdownOpenDirective implements OnChanges { .pipe(tuiWatch(inject(ChangeDetectorRef)), takeUntilDestroyed()) .subscribe(() => this.toggle(false)); + @Input() + public tuiDropdownEnabled = true; + + @Input() + public tuiDropdownOpen: boolean | '' = false; + + @Output() + public readonly tuiDropdownOpenChange = new EventEmitter(); + public get dropdown(): HTMLElement | undefined { return this.directive?.dropdownBoxRef?.location.nativeElement; } diff --git a/projects/core/directives/dropdown/dropdown-selection.directive.ts b/projects/core/directives/dropdown/dropdown-selection.directive.ts index c2c5c444f8a5..34e8b11a10bf 100644 --- a/projects/core/directives/dropdown/dropdown-selection.directive.ts +++ b/projects/core/directives/dropdown/dropdown-selection.directive.ts @@ -38,11 +38,6 @@ export class TuiDropdownSelectionDirective { private ghost?: HTMLElement; - @Input('tuiDropdownSelectionPosition') - public position: 'selection' | 'tag' | 'word' = 'selection'; - - public readonly type = 'dropdown'; - protected readonly doc = inject(DOCUMENT); protected readonly vcr = inject(ViewContainerRef); protected readonly dropdown = inject(TuiDropdownDirective); @@ -74,6 +69,11 @@ export class TuiDropdownSelectionDirective protected range = inject(TUI_RANGE); + @Input('tuiDropdownSelectionPosition') + public position: 'selection' | 'tag' | 'word' = 'selection'; + + public readonly type = 'dropdown'; + constructor() { super(subscriber => this.stream$.subscribe(subscriber)); } diff --git a/projects/core/directives/dropdown/dropdown.directive.ts b/projects/core/directives/dropdown/dropdown.directive.ts index 9cb00b124830..6bf2338b3a7c 100644 --- a/projects/core/directives/dropdown/dropdown.directive.ts +++ b/projects/core/directives/dropdown/dropdown.directive.ts @@ -46,6 +46,13 @@ export class TuiDropdownDirective private readonly service = inject(TuiDropdownService); private readonly cdr = inject(ChangeDetectorRef); + protected readonly sub = this.refresh$ + .pipe(throttleTime(0), takeUntilDestroyed()) + .subscribe(() => { + this.dropdownBoxRef?.changeDetectorRef.detectChanges(); + this.dropdownBoxRef?.changeDetectorRef.markForCheck(); + }); + public readonly el = tuiInjectElement(); public readonly type = 'dropdown'; public readonly component = new PolymorpheusComponent( @@ -56,13 +63,6 @@ export class TuiDropdownDirective public dropdownBoxRef: ComponentRef | null = null; public content: PolymorpheusContent>; - protected readonly sub = this.refresh$ - .pipe(throttleTime(0), takeUntilDestroyed()) - .subscribe(() => { - this.dropdownBoxRef?.changeDetectorRef.detectChanges(); - this.dropdownBoxRef?.changeDetectorRef.markForCheck(); - }); - @Input() public set tuiDropdown( content: PolymorpheusContent>, diff --git a/projects/core/directives/hint/hint-hover.directive.ts b/projects/core/directives/hint/hint-hover.directive.ts index ed8ca0fe3234..17a3449f74ed 100644 --- a/projects/core/directives/hint/hint-hover.directive.ts +++ b/projects/core/directives/hint/hint-hover.directive.ts @@ -1,4 +1,3 @@ -/* eslint-disable rxjs/no-unsafe-takeuntil */ import {Directive, inject, Input} from '@angular/core'; import {TuiHoveredService, tuiInjectElement} from '@taiga-ui/cdk'; import {tuiAsDriver, TuiDriver} from '@taiga-ui/core/classes'; diff --git a/projects/core/directives/icons/icons.directive.ts b/projects/core/directives/icons/icons.directive.ts index 3a19b40d38f4..e9baf0040edd 100644 --- a/projects/core/directives/icons/icons.directive.ts +++ b/projects/core/directives/icons/icons.directive.ts @@ -34,13 +34,12 @@ class TuiIconsStyles {} }, }) export class TuiIconsDirective { + protected readonly nothing = tuiWithStyles(TuiIconsStyles); + protected readonly resolver = inject>(TUI_ICON_RESOLVER); + @Input() public iconLeft = ''; @Input() public iconRight = ''; - - protected readonly nothing = tuiWithStyles(TuiIconsStyles); - - protected readonly resolver = inject>(TUI_ICON_RESOLVER); } diff --git a/projects/core/directives/surface/surface.directive.ts b/projects/core/directives/surface/surface.directive.ts index 8e69e9df49c2..a780972fb528 100644 --- a/projects/core/directives/surface/surface.directive.ts +++ b/projects/core/directives/surface/surface.directive.ts @@ -28,8 +28,8 @@ class TuiSurfaceStyles {} }, }) export class TuiSurfaceDirective { + protected readonly nothing = tuiWithStyles(TuiSurfaceStyles); + @Input() public tuiSurface = ''; - - protected readonly nothing = tuiWithStyles(TuiSurfaceStyles); } diff --git a/projects/core/directives/title/title.directive.ts b/projects/core/directives/title/title.directive.ts index c28290d07f64..ec0a7ba493fb 100644 --- a/projects/core/directives/title/title.directive.ts +++ b/projects/core/directives/title/title.directive.ts @@ -29,8 +29,8 @@ class TuiTitleStyles {} }, }) export class TuiTitleDirective { + protected readonly nothing = tuiWithStyles(TuiTitleStyles); + @Input('tuiTitle') public size: TuiSizeL | TuiSizeS | '' = ''; - - protected readonly nothing = tuiWithStyles(TuiTitleStyles); } diff --git a/projects/demo-cypress/src/tests/mobile-calendar.cy.ts b/projects/demo-cypress/src/tests/mobile-calendar.cy.ts index 640766252a6b..7677abd45c47 100644 --- a/projects/demo-cypress/src/tests/mobile-calendar.cy.ts +++ b/projects/demo-cypress/src/tests/mobile-calendar.cy.ts @@ -36,16 +36,16 @@ describe('Mobile calendar', () => { ], }) class TestComponent { + protected min = TUI_FIRST_DAY; + protected max = TUI_LAST_DAY; + protected disabledItemHandler = TUI_FALSE_HANDLER; + @ViewChild(TuiMobileCalendarComponent, {static: true}) public calendar!: TuiMobileCalendarComponent; public single = true; public onCancel = new EventEmitter(); public onConfirm = new EventEmitter(); - - protected min = TUI_FIRST_DAY; - protected max = TUI_LAST_DAY; - protected disabledItemHandler = TUI_FALSE_HANDLER; } it('the back button emits a cancel event', () => { diff --git a/projects/demo-cypress/src/tests/range.cy.ts b/projects/demo-cypress/src/tests/range.cy.ts index 703fc4a8b098..00854fa4305c 100644 --- a/projects/demo-cypress/src/tests/range.cy.ts +++ b/projects/demo-cypress/src/tests/range.cy.ts @@ -22,6 +22,9 @@ describe('TuiRange', () => { `, }) class TestComponent { + @ViewChild(TuiRangeComponent, {static: true}) + protected component!: TuiRangeComponent; + @ViewChild(TuiRangeComponent, {static: true, read: ElementRef}) public el!: ElementRef; @@ -31,9 +34,6 @@ describe('TuiRange', () => { public segments = 10; public step = 1; public keySteps: TuiKeySteps | null = null; - - @ViewChild(TuiRangeComponent, {static: true}) - protected component!: TuiRangeComponent; } beforeEach(() => { diff --git a/projects/demo/src/modules/components/abstract/inherited-documentation/index.ts b/projects/demo/src/modules/components/abstract/inherited-documentation/index.ts index 7c3f6ae084f4..7a9893aa5678 100644 --- a/projects/demo/src/modules/components/abstract/inherited-documentation/index.ts +++ b/projects/demo/src/modules/components/abstract/inherited-documentation/index.ts @@ -34,6 +34,11 @@ import {TextfieldControllerDocumentationComponent} from '../textfield-controller changeDetection, }) export class InheritedDocumentationComponent { + protected readonly booleanVariants: readonly boolean[] = [false, true]; + protected readonly directionVariants = TUI_HINT_DIRECTIONS; + protected readonly appearanceVariants = ['', 'error', 'dark']; + protected readonly documentedComponent = inject(ABSTRACT_PROPS_ACCESSOR); + @Input() public dropdown = false; @@ -43,14 +48,6 @@ export class InheritedDocumentationComponent { @Input() public withTextFieldController = true; - protected readonly booleanVariants: readonly boolean[] = [false, true]; - - protected readonly directionVariants = TUI_HINT_DIRECTIONS; - - protected readonly appearanceVariants = ['', 'error', 'dark']; - - protected readonly documentedComponent = inject(ABSTRACT_PROPS_ACCESSOR); - protected isTuiReactiveControl( documentedComponent: TuiSupportingDocumentationComponent, ): documentedComponent is AbstractExampleTuiControl { diff --git a/projects/demo/src/modules/components/combo-box/index.ts b/projects/demo/src/modules/components/combo-box/index.ts index 6c92d08bd763..71fc4d0bf8ba 100644 --- a/projects/demo/src/modules/components/combo-box/index.ts +++ b/projects/demo/src/modules/components/combo-box/index.ts @@ -66,12 +66,6 @@ export default class ExampleComponent extends AbstractExampleTuiControl { TuiValueContentContext >; - public readonly control = new FormControl(null, Validators.required); - - public readonly iconVariants = ['', 'tuiIconPieChartLarge', 'tuiIconCreditCardLarge']; - - public override iconLeft = this.iconVariants[0]; - protected readonly exampleForm = import('./examples/import/form.md?raw'); protected readonly exampleModule = import('./examples/import/import.md?raw'); @@ -133,6 +127,12 @@ export default class ExampleComponent extends AbstractExampleTuiControl { protected identityMatcher = this.identityMatcherVariants[0]; + public readonly control = new FormControl(null, Validators.required); + + public readonly iconVariants = ['', 'tuiIconPieChartLarge', 'tuiIconCreditCardLarge']; + + public override iconLeft = this.iconVariants[0]; + protected get valueContent(): PolymorpheusContent> { return this.valueTemplateRef && this.selectedValueTemplate ? this.valueTemplateRef diff --git a/projects/demo/src/modules/components/confirm/index.ts b/projects/demo/src/modules/components/confirm/index.ts index 7bf129e8aad4..63697c789616 100644 --- a/projects/demo/src/modules/components/confirm/index.ts +++ b/projects/demo/src/modules/components/confirm/index.ts @@ -29,6 +29,9 @@ export default class ExampleComponent implements TuiConfirmData { private readonly dialogs = inject(TuiDialogService); private readonly alerts = inject(TuiAlertService); + protected readonly examples = ['Basic']; + protected readonly exampleService = import('./examples/import/service.md?raw'); + public readonly appearances = ['primary', 'accent', 'secondary']; public appearance = this.appearances[0]; public no = 'No'; @@ -37,10 +40,6 @@ export default class ExampleComponent implements TuiConfirmData { public readonly content = 'This is PolymorpheusContent, so it can be anything you like!'; - protected readonly examples = ['Basic']; - - protected readonly exampleService = import('./examples/import/service.md?raw'); - protected onClick(): void { this.dialogs .open(TUI_CONFIRM, { diff --git a/projects/demo/src/modules/components/data-list/examples/4/custom-list/index.ts b/projects/demo/src/modules/components/data-list/examples/4/custom-list/index.ts index d608fb08d4d9..926c9ee75313 100644 --- a/projects/demo/src/modules/components/data-list/examples/4/custom-list/index.ts +++ b/projects/demo/src/modules/components/data-list/examples/4/custom-list/index.ts @@ -41,15 +41,13 @@ interface Items { changeDetection, }) export class CustomListComponent { - @Input() - public items: ReadonlyArray> = []; - protected value = ''; - protected readonly all = EMPTY_ARRAY; - protected readonly filter: (item: T, value: string) => boolean = TUI_DEFAULT_MATCHER; + @Input() + public items: ReadonlyArray> = []; + protected onKeyDown(key: string, element: HTMLElement | null): void { if (element && tuiIsEditingKey(key)) { element.focus({preventScroll: true}); diff --git a/projects/demo/src/modules/components/icons/icons-group/icons-group.component.ts b/projects/demo/src/modules/components/icons/icons-group/icons-group.component.ts index 454e48faf2a0..9177f21a9c05 100644 --- a/projects/demo/src/modules/components/icons/icons-group/icons-group.component.ts +++ b/projects/demo/src/modules/components/icons/icons-group/icons-group.component.ts @@ -54,12 +54,6 @@ export class IconsGroupComponent implements OnInit { private readonly router = inject(Router); private readonly destroyRef = inject(DestroyRef); - @Input() - public icons: Record = {}; - - @Input() - public color: string | null = null; - @ContentChild(IconsGroupDirective) protected readonly iconGroup?: IconsGroupDirective; @@ -72,6 +66,12 @@ export class IconsGroupComponent implements OnInit { distinctUntilChanged(), ); + @Input() + public icons: Record = {}; + + @Input() + public color: string | null = null; + public ngOnInit(): void { this.control.patchValue(this.route.snapshot.queryParams['search'] ?? ''); this.control.valueChanges diff --git a/projects/demo/src/modules/components/input-card/index.ts b/projects/demo/src/modules/components/input-card/index.ts index 4f6d5debc435..c044f4ea863c 100644 --- a/projects/demo/src/modules/components/input-card/index.ts +++ b/projects/demo/src/modules/components/input-card/index.ts @@ -40,19 +40,6 @@ import {InheritedDocumentationComponent} from '../abstract/inherited-documentati providers: [tuiProvide(ABSTRACT_PROPS_ACCESSOR, PageComponent)], }) export default class PageComponent extends AbstractExampleTuiControl { - public control = new FormGroup({ - card: new FormControl('', [ - Validators.required, - tuiCreateLuhnValidator('Invalid card number'), - ]), - expire: new FormControl('', Validators.required), - cvc: new FormControl('', Validators.required), - }); - - public override cleaner = false; - - public override exampleText = '0000 0000 0000 0000'; - @ViewChild('documentationPropertyBinChange', { read: TuiDocDocumentationPropertyConnectorDirective, }) @@ -89,6 +76,19 @@ export default class PageComponent extends AbstractExampleTuiControl { protected autocompleteEnabledExpire = false; + public control = new FormGroup({ + card: new FormControl('', [ + Validators.required, + tuiCreateLuhnValidator('Invalid card number'), + ]), + expire: new FormControl('', Validators.required), + cvc: new FormControl('', Validators.required), + }); + + public override cleaner = false; + + public override exampleText = '0000 0000 0000 0000'; + protected get cardSrc(): string | null { return this.cardSrcSelected === null ? null : this.cards[this.cardSrcSelected]; } diff --git a/projects/demo/src/modules/components/input-copy/index.ts b/projects/demo/src/modules/components/input-copy/index.ts index 847524399c80..558053ba3595 100644 --- a/projects/demo/src/modules/components/input-copy/index.ts +++ b/projects/demo/src/modules/components/input-copy/index.ts @@ -30,12 +30,6 @@ import {InheritedDocumentationComponent} from '../abstract/inherited-documentati ], }) export default class PageComponent extends AbstractExampleTuiControl { - public readonly control = new FormControl('', Validators.required); - - public override readonly maxLengthVariants: readonly number[] = [10]; - - public override readonly maxLength = null; - @ViewChild('customTemplate') protected customTemplate: PolymorpheusContent; @@ -46,6 +40,12 @@ export default class PageComponent extends AbstractExampleTuiControl { protected messageDirection = this.hintDirectionVariants[0]; protected messageMode = this.hintAppearanceVariants[0]; + public readonly control = new FormControl('', Validators.required); + + public override readonly maxLengthVariants: readonly number[] = [10]; + + public override readonly maxLength = null; + protected get notificationTemplate(): PolymorpheusContent { return this.successMessage === 'Template' ? this.customTemplate diff --git a/projects/demo/src/modules/components/input-date-multi/index.ts b/projects/demo/src/modules/components/input-date-multi/index.ts index e10c1de1e935..0231e6857f9e 100644 --- a/projects/demo/src/modules/components/input-date-multi/index.ts +++ b/projects/demo/src/modules/components/input-date-multi/index.ts @@ -47,8 +47,6 @@ import {InheritedDocumentationComponent} from '../abstract/inherited-documentati ], }) export default class PageComponent extends AbstractExampleTuiControl { - public control = new FormControl([], Validators.required); - protected minVariants = [ TUI_FIRST_DAY, new TuiDay(2017, 2, 5), @@ -85,4 +83,6 @@ export default class PageComponent extends AbstractExampleTuiControl { ]; protected markerHandler: TuiMarkerHandler | null = null; + + public control = new FormControl([], Validators.required); } diff --git a/projects/demo/src/modules/components/input-date-range/index.ts b/projects/demo/src/modules/components/input-date-range/index.ts index 64d65a3aa6ca..7dc545ab1d85 100644 --- a/projects/demo/src/modules/components/input-date-range/index.ts +++ b/projects/demo/src/modules/components/input-date-range/index.ts @@ -56,17 +56,6 @@ const ONE_DOT: [string] = ['var(--tui-success-fill)']; ], }) export default class PageComponent extends AbstractExampleTuiControl { - public override cleaner = false; - public control = new FormControl(null, Validators.required); - - public override readonly maxLengthVariants: readonly TuiDayLike[] = [ - {day: 5}, - {month: 1}, - {year: 1}, - ]; - - public override maxLength: TuiDayLike | null = null; - protected readonly dayVariants = [ TUI_FIRST_DAY, new TuiDay(2021, 2, 5), @@ -111,4 +100,15 @@ export default class PageComponent extends AbstractExampleTuiControl { ]; protected defaultViewedMonth = this.defaultViewedMonthVariants[0]; + + public override cleaner = false; + public control = new FormControl(null, Validators.required); + + public override readonly maxLengthVariants: readonly TuiDayLike[] = [ + {day: 5}, + {month: 1}, + {year: 1}, + ]; + + public override maxLength: TuiDayLike | null = null; } diff --git a/projects/demo/src/modules/components/input-date-time/index.ts b/projects/demo/src/modules/components/input-date-time/index.ts index bece84004b54..9520b7bb2096 100644 --- a/projects/demo/src/modules/components/input-date-time/index.ts +++ b/projects/demo/src/modules/components/input-date-time/index.ts @@ -47,13 +47,6 @@ import {InheritedDocumentationComponent} from '../abstract/inherited-documentati export default class PageComponent extends AbstractExampleTuiControl { private readonly today = TuiDay.currentLocal(); - public override cleaner = false; - - public readonly control = new FormControl<[TuiDay | null, TuiTime | null] | null>( - null, - Validators.required, - ); - protected readonly minVariants: ReadonlyArray = [ TUI_FIRST_DAY, new TuiDay(2017, 2, 5), @@ -102,4 +95,11 @@ export default class PageComponent extends AbstractExampleTuiControl { ]; protected mode = this.modeVariants[0]; + + public override cleaner = false; + + public readonly control = new FormControl<[TuiDay | null, TuiTime | null] | null>( + null, + Validators.required, + ); } diff --git a/projects/demo/src/modules/components/input-date/index.ts b/projects/demo/src/modules/components/input-date/index.ts index 81173422cc48..6c814029444c 100644 --- a/projects/demo/src/modules/components/input-date/index.ts +++ b/projects/demo/src/modules/components/input-date/index.ts @@ -50,10 +50,6 @@ const ONE_DOT: [string] = ['var(--tui-success-fill)']; ], }) export default class ExampleComponent extends AbstractExampleTuiControl { - public override cleaner = false; - - public control = new FormControl(null, Validators.required); - protected readonly example5: TuiDocExample = { TypeScript: import('./examples/5/index.ts?raw'), HTML: import('./examples/5/index.html?raw'), @@ -98,4 +94,8 @@ export default class ExampleComponent extends AbstractExampleTuiControl { protected markerHandler: TuiMarkerHandler | null = null; protected items = this.itemsVariants[0]; + + public override cleaner = false; + + public control = new FormControl(null, Validators.required); } diff --git a/projects/demo/src/modules/components/input-files/index.ts b/projects/demo/src/modules/components/input-files/index.ts index b02778357c47..2ca816cceb60 100644 --- a/projects/demo/src/modules/components/input-files/index.ts +++ b/projects/demo/src/modules/components/input-files/index.ts @@ -36,14 +36,6 @@ import {AbstractExampleTuiControl} from '../abstract/control'; providers: [tuiProvide(ABSTRACT_PROPS_ACCESSOR, PageComponent)], }) export default class PageComponent extends AbstractExampleTuiControl { - public override readonly sizeVariants: readonly TuiSizeL[] = ['m', 'l']; - public override size = this.sizeVariants[0]; - public readonly control = new FormControl(null); - - protected readonly files$ = this.control.valueChanges.pipe( - map(() => tuiFilesAccepted(this.control)), - ); - protected multiple = true; protected showSize = true; protected showDelete: boolean | 'always' = true; @@ -68,6 +60,13 @@ export default class PageComponent extends AbstractExampleTuiControl { protected rejected: readonly File[] = []; protected maxFileSize = this.maxFileSizeVariants[2]; + public override readonly sizeVariants: readonly TuiSizeL[] = ['m', 'l']; + public override size = this.sizeVariants[0]; + public readonly control = new FormControl(null); + public readonly files$ = this.control.valueChanges.pipe( + map(() => tuiFilesAccepted(this.control)), + ); + protected removeFile(file: File): void { this.rejected = this.rejected.filter(current => current !== file); this.control.setValue( diff --git a/projects/demo/src/modules/components/input-month-range/index.ts b/projects/demo/src/modules/components/input-month-range/index.ts index 7dece71fd05d..c571480d8300 100644 --- a/projects/demo/src/modules/components/input-month-range/index.ts +++ b/projects/demo/src/modules/components/input-month-range/index.ts @@ -38,11 +38,6 @@ import {InheritedDocumentationComponent} from '../abstract/inherited-documentati providers: [tuiProvide(ABSTRACT_PROPS_ACCESSOR, PageComponent)], }) export default class PageComponent extends AbstractExampleTuiControl { - public override cleaner = false; - public override maxLength = 0; - - public control = new FormControl(null, Validators.required); - protected readonly minVariants = [ TUI_FIRST_DAY, new TuiMonth(2019, 2), @@ -66,4 +61,9 @@ export default class PageComponent extends AbstractExampleTuiControl { > = [TUI_FALSE_HANDLER, ({month}) => month % 3 === 0]; protected disabledItemHandler = this.disabledItemHandlerVariants[0]; + + public override cleaner = false; + public override maxLength = 0; + + public control = new FormControl(null, Validators.required); } diff --git a/projects/demo/src/modules/components/input-month/index.ts b/projects/demo/src/modules/components/input-month/index.ts index a3651eb73a1d..9993cdbc5a02 100644 --- a/projects/demo/src/modules/components/input-month/index.ts +++ b/projects/demo/src/modules/components/input-month/index.ts @@ -33,10 +33,6 @@ import {InheritedDocumentationComponent} from '../abstract/inherited-documentati providers: [tuiProvide(ABSTRACT_PROPS_ACCESSOR, PageComponent)], }) export default class PageComponent extends AbstractExampleTuiControl { - public override cleaner = false; - - public control = new FormControl(null, Validators.required); - protected readonly minVariants = [ TUI_FIRST_DAY, new TuiMonth(2019, 2), @@ -59,4 +55,8 @@ export default class PageComponent extends AbstractExampleTuiControl { > = [TUI_FALSE_HANDLER, ({month}) => month % 3 === 0]; protected disabledItemHandler = this.disabledItemHandlerVariants[0]; + + public override cleaner = false; + + public control = new FormControl(null, Validators.required); } diff --git a/projects/demo/src/modules/components/input-number/index.ts b/projects/demo/src/modules/components/input-number/index.ts index 00bb1a243d12..d42afb3e4dde 100644 --- a/projects/demo/src/modules/components/input-number/index.ts +++ b/projects/demo/src/modules/components/input-number/index.ts @@ -37,11 +37,6 @@ import {AbstractExampleTuiNumberFormat} from '../abstract/number-format'; providers: [tuiProvide(ABSTRACT_PROPS_ACCESSOR, PageComponent)], }) export default class PageComponent extends AbstractExampleTuiNumberFormat { - public override cleaner = false; - public override precision = 2; - - public readonly control = new FormControl(6432, Validators.required); - protected docPages = DemoRoute; protected readonly minVariants: readonly number[] = [-Infinity, -500, 5, 25]; @@ -53,4 +48,8 @@ export default class PageComponent extends AbstractExampleTuiNumberFormat { protected max = this.maxVariants[0]; protected step = 0; + + public override cleaner = false; + public override precision = 2; + public readonly control = new FormControl(6432, Validators.required); } diff --git a/projects/demo/src/modules/components/input-phone-international/index.ts b/projects/demo/src/modules/components/input-phone-international/index.ts index 8c07fd834fab..3c40570989ad 100644 --- a/projects/demo/src/modules/components/input-phone-international/index.ts +++ b/projects/demo/src/modules/components/input-phone-international/index.ts @@ -30,10 +30,6 @@ import {InheritedDocumentationComponent} from '../abstract/inherited-documentati providers: [tuiProvide(ABSTRACT_PROPS_ACCESSOR, PageComponent)], }) export default class PageComponent extends AbstractExampleTuiControl { - public override cleaner = false; - public override labelOutside = true; - public control = new FormControl('', [Validators.required, Validators.minLength(9)]); - protected readonly exampleForm = import('./examples/import/declare-form.md?raw'); protected readonly exampleModule = import('./examples/import/import-module.md?raw'); protected readonly exampleHtml = import('./examples/import/insert-template.md?raw'); @@ -53,4 +49,8 @@ export default class PageComponent extends AbstractExampleTuiControl { ]; protected countryIsoCode = this.countryIsoCodeVariants[0]; + + public override cleaner = false; + public override labelOutside = true; + public control = new FormControl('', [Validators.required, Validators.minLength(9)]); } diff --git a/projects/demo/src/modules/components/input-phone/index.ts b/projects/demo/src/modules/components/input-phone/index.ts index a1f0e9c633eb..4bad627cd43e 100644 --- a/projects/demo/src/modules/components/input-phone/index.ts +++ b/projects/demo/src/modules/components/input-phone/index.ts @@ -35,10 +35,6 @@ import {InheritedDocumentationComponent} from '../abstract/inherited-documentati providers: [tuiProvide(ABSTRACT_PROPS_ACCESSOR, PageComponent)], }) export default class PageComponent extends AbstractExampleTuiControl { - public override cleaner = false; - - public control = new FormControl('', [Validators.required, Validators.minLength(12)]); - protected countryCodes = ['+7', '+850', '+1', '+52']; protected countryCode = this.countryCodes[0]; @@ -50,4 +46,8 @@ export default class PageComponent extends AbstractExampleTuiControl { ]; protected phoneMaskAfterCountryCode = this.phoneMasksAfterCountryCode[0]; + + public override cleaner = false; + + public control = new FormControl('', [Validators.required, Validators.minLength(12)]); } diff --git a/projects/demo/src/modules/components/input-range/index.ts b/projects/demo/src/modules/components/input-range/index.ts index 3da26ecd994e..6f8f12a51f4e 100644 --- a/projects/demo/src/modules/components/input-range/index.ts +++ b/projects/demo/src/modules/components/input-range/index.ts @@ -41,12 +41,6 @@ import {NumberFormatDocumentationComponent} from '../abstract/number-format-docu ], }) export default class PageComponent extends AbstractExampleTuiNumberFormat { - public control = new FormControl([0, 10]); - - public override sizeVariants: readonly TuiSizeL[] = ['m', 'l']; - - public override size = this.sizeVariants[1]; - protected minVariants: readonly number[] = [0, 5, 7.77, -10]; protected min = this.minVariants[0]; @@ -93,4 +87,10 @@ export default class PageComponent extends AbstractExampleTuiNumberFormat { protected leftValueContent = this.valueContentVariants[0]; protected rightValueContent = this.valueContentVariants[0]; + + public control = new FormControl([0, 10]); + + public override sizeVariants: readonly TuiSizeL[] = ['m', 'l']; + + public override size = this.sizeVariants[1]; } diff --git a/projects/demo/src/modules/components/input-slider/index.ts b/projects/demo/src/modules/components/input-slider/index.ts index 3adf8c6f3794..0bc17b65152b 100644 --- a/projects/demo/src/modules/components/input-slider/index.ts +++ b/projects/demo/src/modules/components/input-slider/index.ts @@ -43,18 +43,6 @@ import {AbstractExampleTuiNumberFormat} from '../abstract/number-format'; ], }) export default class PageComponent extends AbstractExampleTuiNumberFormat { - public override readonly sizeVariants: readonly TuiSizeL[] = ['m', 'l']; - public override size = this.sizeVariants[1]; - public readonly control = new FormControl(0); - - public override readonly customContentVariants: string[] = [ - '', - 'tuiIconVisaMono', - 'tuiIconMastercardMono', - ]; - - public override customContentSelected = this.customContentVariants[0]; - protected readonly minVariants: readonly number[] = [0, 1, 5, 7.77, -10]; protected min = this.minVariants[0]; @@ -92,4 +80,16 @@ export default class PageComponent extends AbstractExampleTuiNumberFormat { ]; protected keySteps: TuiKeySteps | null = null; + + public override readonly sizeVariants: readonly TuiSizeL[] = ['m', 'l']; + public override size = this.sizeVariants[1]; + public readonly control = new FormControl(0); + + public override readonly customContentVariants: string[] = [ + '', + 'tuiIconVisaMono', + 'tuiIconMastercardMono', + ]; + + public override customContentSelected = this.customContentVariants[0]; } diff --git a/projects/demo/src/modules/components/input-tag/index.ts b/projects/demo/src/modules/components/input-tag/index.ts index 1918dd24df1c..9e6255e0d0b0 100644 --- a/projects/demo/src/modules/components/input-tag/index.ts +++ b/projects/demo/src/modules/components/input-tag/index.ts @@ -47,24 +47,6 @@ import {InheritedDocumentationComponent} from '../abstract/inherited-documentati ], }) export default class PageComponent extends AbstractExampleTuiControl { - public override readonly sizeVariants: ReadonlyArray = [ - 's', - 'm', - 'l', - ]; - - public override size: TuiSizeL | TuiSizeS = - this.sizeVariants[this.sizeVariants.length - 1]; - - public readonly control = new FormControl( - ['John Cleese', 'Eric Idle', 'Michael Palin'], - Validators.required, - ); - - public override maxLengthVariants: number[] = [10, 20]; - - public override maxLength: number | null = null; - protected editable = true; protected uniqueTags = true; @@ -96,4 +78,22 @@ export default class PageComponent extends AbstractExampleTuiControl { > = [TUI_FALSE_HANDLER, item => String(item).startsWith('T')]; protected disabledItemHandler = this.disabledItemHandlerVariants[0]; + + public override readonly sizeVariants: ReadonlyArray = [ + 's', + 'm', + 'l', + ]; + + public override size: TuiSizeL | TuiSizeS = + this.sizeVariants[this.sizeVariants.length - 1]; + + public readonly control = new FormControl( + ['John Cleese', 'Eric Idle', 'Michael Palin'], + Validators.required, + ); + + public override maxLengthVariants: number[] = [10, 20]; + + public override maxLength: number | null = null; } diff --git a/projects/demo/src/modules/components/input-time/index.ts b/projects/demo/src/modules/components/input-time/index.ts index f2f2c7c82b36..bc9f04656a01 100644 --- a/projects/demo/src/modules/components/input-time/index.ts +++ b/projects/demo/src/modules/components/input-time/index.ts @@ -39,10 +39,6 @@ import {InheritedDocumentationComponent} from '../abstract/inherited-documentati ], }) export default class PageComponent extends AbstractExampleTuiControl { - public override cleaner = false; - - public control = new FormControl(TuiTime.currentLocal(), Validators.required); - protected readonly disabledItemHandlerVariants: ReadonlyArray< TuiBooleanHandler > = [ @@ -76,4 +72,8 @@ export default class PageComponent extends AbstractExampleTuiControl { ]; protected mode = this.modeVariants[0]; + + public override cleaner = false; + + public control = new FormControl(TuiTime.currentLocal(), Validators.required); } diff --git a/projects/demo/src/modules/components/input-year/index.ts b/projects/demo/src/modules/components/input-year/index.ts index 5c70003a8920..fe86cebebbf0 100644 --- a/projects/demo/src/modules/components/input-year/index.ts +++ b/projects/demo/src/modules/components/input-year/index.ts @@ -26,10 +26,6 @@ import {InheritedDocumentationComponent} from '../abstract/inherited-documentati providers: [tuiProvide(ABSTRACT_PROPS_ACCESSOR, PageComponent)], }) export default class PageComponent extends AbstractExampleTuiControl { - public override cleaner = false; - - public control = new FormControl(null, Validators.required); - protected readonly minVariants = [TUI_FIRST_DAY.year, 2019, 2007]; protected readonly maxVariants = [TUI_LAST_DAY.year, 2020, 2023]; @@ -41,4 +37,8 @@ export default class PageComponent extends AbstractExampleTuiControl { > = [TUI_FALSE_HANDLER, year => year % 3 === 0]; protected disabledItemHandler = this.disabledItemHandlerVariants[0]; + + public override cleaner = false; + + public control = new FormControl(null, Validators.required); } diff --git a/projects/demo/src/modules/components/input/index.ts b/projects/demo/src/modules/components/input/index.ts index 6b01822b2369..ee399b80f79b 100644 --- a/projects/demo/src/modules/components/input/index.ts +++ b/projects/demo/src/modules/components/input/index.ts @@ -52,8 +52,12 @@ export default class PageComponent extends AbstractExampleTuiControl { @ViewChild('justLongText', {static: true}) private readonly longTextRef!: TemplateRef; + protected placeholder = 'Field placeholder'; + public readonly iconVariants = ['', 'tuiIconSearchLarge', 'tuiIconCalendarLarge']; + public icon = this.iconVariants[0]; + public override iconLeft = this.iconVariants[0]; public readonly control = new FormControl('111', Validators.required); @@ -67,10 +71,6 @@ export default class PageComponent extends AbstractExampleTuiControl { LONG_TEXT_TEMPLATE, ]; - protected icon = this.iconVariants[0]; - - protected placeholder = 'Field placeholder'; - public override get customContent(): PolymorpheusContent { return this.customContentSelected === LONG_TEXT_TEMPLATE ? this.longTextRef diff --git a/projects/demo/src/modules/components/multi-select/index.ts b/projects/demo/src/modules/components/multi-select/index.ts index b2acd665438b..f1b538f6758d 100644 --- a/projects/demo/src/modules/components/multi-select/index.ts +++ b/projects/demo/src/modules/components/multi-select/index.ts @@ -69,25 +69,6 @@ class Account { ], }) export default class PageComponent extends AbstractExampleTuiControl { - public control = new FormControl(null); - - public override iconLeft = ''; - - public override readonly sizeVariants: ReadonlyArray = [ - 's', - 'm', - 'l', - ]; - - public override size: TuiSizeL | TuiSizeS = - this.sizeVariants[this.sizeVariants.length - 1]; - - public override readonly maxLengthVariants: readonly number[] = [10]; - - public override maxLength = null; - - public override labelOutside = true; - protected readonly items = [ new Account('Ruble', 500), new Account('Dollar', 500), @@ -143,6 +124,25 @@ export default class PageComponent extends AbstractExampleTuiControl { protected disabledItemHandler = this.disabledItemHandlerVariants[0]; + public control = new FormControl(null); + + public override iconLeft = ''; + + public override readonly sizeVariants: ReadonlyArray = [ + 's', + 'm', + 'l', + ]; + + public override size: TuiSizeL | TuiSizeS = + this.sizeVariants[this.sizeVariants.length - 1]; + + public override readonly maxLengthVariants: readonly number[] = [10]; + + public override maxLength = null; + + public override labelOutside = true; + protected setValue(): void { this.control.setValue([new Account('Dollar', 237)]); } diff --git a/projects/demo/src/modules/components/select/index.ts b/projects/demo/src/modules/components/select/index.ts index 3ef98d669962..9901e87aea53 100644 --- a/projects/demo/src/modules/components/select/index.ts +++ b/projects/demo/src/modules/components/select/index.ts @@ -69,12 +69,6 @@ export default class PageComponent extends AbstractExampleTuiControl { TuiValueContentContext >; - public readonly iconVariants = ['', 'tuiIconPieChartLarge', 'tuiIconCreditCardLarge']; - - public override iconLeft = this.iconVariants[0]; - - public control = new FormControl(null, Validators.required); - protected readonly example9: TuiDocExample = { TypeScript: import('./examples/9/index.ts?raw'), HTML: import('./examples/9/index.html?raw'), @@ -103,6 +97,12 @@ export default class PageComponent extends AbstractExampleTuiControl { TuiBooleanHandler > = [TUI_FALSE_HANDLER, (item: Account) => item.balance < 300]; + public readonly iconVariants = ['', 'tuiIconPieChartLarge', 'tuiIconCreditCardLarge']; + + public override iconLeft = this.iconVariants[0]; + + public control = new FormControl(null, Validators.required); + protected get valueContent(): PolymorpheusContent> { return this.valueTemplateRef && this.selectedValueTemplate ? this.valueTemplateRef diff --git a/projects/demo/src/modules/components/textarea/index.ts b/projects/demo/src/modules/components/textarea/index.ts index 10d13c11726e..3a854e517949 100644 --- a/projects/demo/src/modules/components/textarea/index.ts +++ b/projects/demo/src/modules/components/textarea/index.ts @@ -43,10 +43,15 @@ import {InheritedDocumentationComponent} from '../abstract/inherited-documentati ], }) export default class PageComponent extends AbstractExampleTuiControl { - public control = new FormControl(''); + protected readonly iconVariants = ['', 'tuiIconSearchLarge', 'tuiIconCalendarLarge']; + protected icon = this.iconVariants[0]; + protected readonly rowsVariants: readonly number[] = [8, 15, 30]; + protected rows: number = this.rowsVariants[0]; + protected expandable = false; + protected placeholder = 'Placeholder'; + public control = new FormControl(''); public override readonly maxLengthVariants: readonly number[] = [50, 100, 500]; - public override maxLength: number | null = null; public override readonly sizeVariants: ReadonlyArray = [ @@ -55,16 +60,4 @@ export default class PageComponent extends AbstractExampleTuiControl { ]; public override size: TuiSizeL | TuiSizeM = this.sizeVariants[1]; - - protected readonly iconVariants = ['', 'tuiIconSearchLarge', 'tuiIconCalendarLarge']; - - protected icon = this.iconVariants[0]; - - protected readonly rowsVariants: readonly number[] = [8, 15, 30]; - - protected rows: number = this.rowsVariants[0]; - - protected expandable = false; - - protected placeholder = 'Placeholder'; } diff --git a/projects/demo/src/modules/markup/breakpoints/index.ts b/projects/demo/src/modules/markup/breakpoints/index.ts index 6523840a9425..b022ea913829 100644 --- a/projects/demo/src/modules/markup/breakpoints/index.ts +++ b/projects/demo/src/modules/markup/breakpoints/index.ts @@ -15,7 +15,6 @@ import fileWithBreakpoints from '@taiga-ui/core/styles/variables/media.less?raw' * // code comment * ``` */ -// eslint-disable-next-line unicorn/no-unsafe-regex const CODE_COMMENTS = /(\/\*([^*]|(\*+[^*/]))*\*+\/)|(\/\/.*)/g; function parseBreakpoints(file: string): Array<{name: string; value: string}> { diff --git a/projects/demo/src/modules/markup/colors/examples/table/table.component.ts b/projects/demo/src/modules/markup/colors/examples/table/table.component.ts index 0ac9050ddaab..5cd65220f026 100644 --- a/projects/demo/src/modules/markup/colors/examples/table/table.component.ts +++ b/projects/demo/src/modules/markup/colors/examples/table/table.component.ts @@ -22,6 +22,8 @@ export class TableComponent { private readonly win = inject(WINDOW); private readonly styles = this.win.getComputedStyle(this.doc.documentElement); + protected readonly theme$ = this.themeService.pipe(delay(1)); + @Input() public colors: readonly Color[] = []; @@ -29,8 +31,6 @@ export class TableComponent { @HostBinding('class._dark') public dark = false; - protected readonly theme$ = this.themeService.pipe(delay(1)); - protected getValue(variable: string): string { return this.styles.getPropertyValue(variable); } diff --git a/projects/experimental/components/tooltip/tooltip.component.ts b/projects/experimental/components/tooltip/tooltip.component.ts index bfbf8d4a0b38..84934ac8b374 100644 --- a/projects/experimental/components/tooltip/tooltip.component.ts +++ b/projects/experimental/components/tooltip/tooltip.component.ts @@ -29,18 +29,18 @@ export class TuiTooltipComponent extends TuiHintOptionsDirective { private readonly textfield = inject(TuiTextfieldComponent, {optional: true}); private readonly platform = inject(TUI_PLATFORM); - @Input() - public describeId = ''; - - @Input() - public context?: C; - @ViewChild(TuiHintHoverDirective) protected readonly driver$?: TuiHintHoverDirective; protected readonly tooltipOptions = inject(TUI_TOOLTIP_OPTIONS); protected readonly iconAppearance = inject(TuiAppearanceDirective, {optional: true}); + @Input() + public describeId = ''; + + @Input() + public context?: C; + protected get id(): string { return this.describeId || this.textfield?.id || ''; } diff --git a/projects/kit/components/accordion/accordion-item.component.ts b/projects/kit/components/accordion/accordion-item.component.ts index baa6edfe4637..b3e907a8e84d 100644 --- a/projects/kit/components/accordion/accordion-item.component.ts +++ b/projects/kit/components/accordion/accordion-item.component.ts @@ -29,6 +29,12 @@ import {TuiAccordionItemEagerContentDirective} from './accordion-item-eager-cont export class TuiAccordionItemComponent { private readonly cdr = inject(ChangeDetectorRef); + @ContentChild(TuiAccordionItemEagerContentDirective) + protected readonly eagerContent?: TuiAccordionItemEagerContentDirective; + + @ContentChild(TuiAccordionItemContentDirective) + protected readonly lazyContent?: TuiAccordionItemContentDirective; + @Input() @HostBinding('class._no-padding') public noPadding = false; @@ -61,12 +67,6 @@ export class TuiAccordionItemComponent { @Output() public readonly openChange = new EventEmitter(); - @ContentChild(TuiAccordionItemEagerContentDirective) - protected readonly eagerContent?: TuiAccordionItemEagerContentDirective; - - @ContentChild(TuiAccordionItemContentDirective) - protected readonly lazyContent?: TuiAccordionItemContentDirective; - public close(): void { this.updateOpen(false); this.cdr.markForCheck(); diff --git a/projects/kit/components/accordion/accordion.directive.ts b/projects/kit/components/accordion/accordion.directive.ts index 4fd814e27851..37f3da92a217 100644 --- a/projects/kit/components/accordion/accordion.directive.ts +++ b/projects/kit/components/accordion/accordion.directive.ts @@ -27,12 +27,12 @@ import {TuiAccordionItemComponent} from './accordion-item.component'; export class TuiAccordionDirective implements AfterContentInit { private readonly destroyRef = inject(DestroyRef); - @Input() - public closeOthers = true; - @ContentChildren(TuiAccordionItemComponent) protected readonly accordionItems: QueryList = EMPTY_QUERY; + @Input() + public closeOthers = true; + public ngAfterContentInit(): void { const {accordionItems} = this; const rows$ = tuiQueryListChanges(accordionItems); diff --git a/projects/kit/components/avatar/avatar-outline.directive.ts b/projects/kit/components/avatar/avatar-outline.directive.ts index 728b8aad027c..c392440118fe 100644 --- a/projects/kit/components/avatar/avatar-outline.directive.ts +++ b/projects/kit/components/avatar/avatar-outline.directive.ts @@ -28,11 +28,11 @@ class TuiAvatarOutlineStyles {} }, }) export class TuiAvatarOutlineDirective { + protected readonly nothing = tuiWithStyles(TuiAvatarOutlineStyles); + @Input() public tuiAvatarOutline: string | null = ''; - protected readonly nothing = tuiWithStyles(TuiAvatarOutlineStyles); - protected get value(): string | null { return this.tuiAvatarOutline === '' ? 'var(--tui-primary)' diff --git a/projects/kit/components/avatar/avatar.component.ts b/projects/kit/components/avatar/avatar.component.ts index 6d9b3a056bde..121e60999b8c 100644 --- a/projects/kit/components/avatar/avatar.component.ts +++ b/projects/kit/components/avatar/avatar.component.ts @@ -38,6 +38,8 @@ import {TUI_AVATAR_OPTIONS} from './avatar.options'; export class TuiAvatarComponent { private readonly options = inject(TUI_AVATAR_OPTIONS); + protected readonly resolver = inject(TUI_ICON_RESOLVER); + @Input() public size = this.options.size; @@ -47,8 +49,6 @@ export class TuiAvatarComponent { @Input() public src?: SafeResourceUrl | string | null; - protected readonly resolver = inject(TUI_ICON_RESOLVER); - protected get safeSrc(): string { return this.src?.toString() ?? ''; } diff --git a/projects/kit/components/badge-notification/badge-notification.component.ts b/projects/kit/components/badge-notification/badge-notification.component.ts index 289ac1228bcb..8b77efb02671 100644 --- a/projects/kit/components/badge-notification/badge-notification.component.ts +++ b/projects/kit/components/badge-notification/badge-notification.component.ts @@ -17,8 +17,8 @@ import {TUI_BADGE_NOTIFICATION_OPTIONS} from './badge-notification.options'; }, }) export class TuiBadgeNotificationComponent { + protected readonly options = tuiToAnimationOptions(inject(TUI_ANIMATIONS_SPEED)); + @Input() public size: TuiSizeL | TuiSizeXS = inject(TUI_BADGE_NOTIFICATION_OPTIONS).size; - - protected readonly options = tuiToAnimationOptions(inject(TUI_ANIMATIONS_SPEED)); } diff --git a/projects/kit/components/badge/badge.directive.ts b/projects/kit/components/badge/badge.directive.ts index 25e95ea4fc66..a70ba64ee7da 100644 --- a/projects/kit/components/badge/badge.directive.ts +++ b/projects/kit/components/badge/badge.directive.ts @@ -53,11 +53,11 @@ class TuiBadgeStyles {} export class TuiBadgeDirective { private readonly options = inject(TUI_BADGE_OPTIONS); + protected readonly nothing = tuiWithStyles(TuiBadgeStyles); + @Input() public size = this.options.size; @Input() public dot = this.options.dot; - - protected readonly nothing = tuiWithStyles(TuiBadgeStyles); } diff --git a/projects/kit/components/block/block.directive.ts b/projects/kit/components/block/block.directive.ts index 8b969dc02e3b..00a9d75a5753 100644 --- a/projects/kit/components/block/block.directive.ts +++ b/projects/kit/components/block/block.directive.ts @@ -57,11 +57,11 @@ export class TuiBlockDirective { private readonly options = inject(TUI_BLOCK_OPTIONS); + protected readonly nothing = tuiWithStyles(TuiBlockStyles); + @Input('tuiBlock') public size: TuiSizeL | TuiSizeXS | '' = this.options.size; - protected readonly nothing = tuiWithStyles(TuiBlockStyles); - protected get disabled(): boolean { return !!this.control?.disabled; } diff --git a/projects/kit/components/breadcrumbs/breadcrumbs.component.ts b/projects/kit/components/breadcrumbs/breadcrumbs.component.ts index b44551875c41..76daa7793a5f 100644 --- a/projects/kit/components/breadcrumbs/breadcrumbs.component.ts +++ b/projects/kit/components/breadcrumbs/breadcrumbs.component.ts @@ -14,7 +14,6 @@ import {TuiIconComponent, tuiLinkOptionsProvider} from '@taiga-ui/core'; import {TUI_BREADCRUMBS_OPTIONS} from './breadcrumbs.options'; -/* eslint-disable @typescript-eslint/member-ordering */ @Component({ standalone: true, selector: 'tui-breadcrumbs', @@ -25,13 +24,13 @@ import {TUI_BREADCRUMBS_OPTIONS} from './breadcrumbs.options'; providers: [tuiLinkOptionsProvider({appearance: 'icon'})], }) export class TuiBreadcrumbsComponent { + @ContentChildren(TuiItemDirective, {read: TemplateRef}) + protected readonly items: QueryList>> = + EMPTY_QUERY; + protected readonly options = inject(TUI_BREADCRUMBS_OPTIONS); @Input() @HostBinding('attr.data-size') public size = this.options.size; - - @ContentChildren(TuiItemDirective, {read: TemplateRef}) - protected readonly items: QueryList>> = - EMPTY_QUERY; } diff --git a/projects/kit/components/calendar-month/calendar-month.component.ts b/projects/kit/components/calendar-month/calendar-month.component.ts index bbacf6be347d..2bb65279a0db 100644 --- a/projects/kit/components/calendar-month/calendar-month.component.ts +++ b/projects/kit/components/calendar-month/calendar-month.component.ts @@ -52,6 +52,9 @@ const TODAY = TuiDay.currentLocal(); changeDetection: ChangeDetectionStrategy.OnPush, }) export class TuiCalendarMonthComponent implements TuiWithOptionalMinMax { + protected isYearPickerShown = false; + protected readonly months$ = inject(TUI_CALENDAR_MONTHS); + @Input() public value: TuiMonth | TuiMonthRange | null = null; @@ -84,9 +87,6 @@ export class TuiCalendarMonthComponent implements TuiWithOptionalMinMax { + protected readonly otherDateText$ = inject(TUI_OTHER_DATE_TEXT); + protected readonly icons = inject(TUI_COMMON_ICONS); + protected previousValue: TuiDayRange | null = null; + protected hoveredItem: TuiDay | null = null; + protected readonly capsMapper = TUI_DAY_CAPS_MAPPER; + @Input() public defaultViewedMonth: TuiMonth = TuiMonth.currentLocal(); @@ -86,12 +92,6 @@ export class TuiCalendarRangeComponent @Output() public readonly valueChange = new EventEmitter(); - protected readonly otherDateText$ = inject(TUI_OTHER_DATE_TEXT); - protected readonly icons = inject(TUI_COMMON_ICONS); - protected previousValue: TuiDayRange | null = null; - protected hoveredItem: TuiDay | null = null; - protected readonly capsMapper = TUI_DAY_CAPS_MAPPER; - constructor() { inject>(TUI_CALENDAR_DATE_STREAM, {optional: true}) ?.pipe(tuiWatch(inject(ChangeDetectorRef)), takeUntilDestroyed()) diff --git a/projects/kit/components/carousel/carousel.component.ts b/projects/kit/components/carousel/carousel.component.ts index 4e3eda329186..fc63d80709c3 100644 --- a/projects/kit/components/carousel/carousel.component.ts +++ b/projects/kit/components/carousel/carousel.component.ts @@ -62,6 +62,15 @@ export class TuiCarouselComponent { private readonly directive = inject(TuiCarouselDirective); private translate = 0; + @ContentChildren(TuiItemDirective, {read: TemplateRef}) + protected readonly items: QueryList>> = + EMPTY_QUERY; + + @HostBinding('class._transitioned') + protected transitioned = true; + + protected index = 0; + @Input() @HostBinding('class._draggable') public draggable = false; @@ -72,15 +81,6 @@ export class TuiCarouselComponent { @Output() public readonly indexChange = new EventEmitter(); - @ContentChildren(TuiItemDirective, {read: TemplateRef}) - protected readonly items: QueryList>> = - EMPTY_QUERY; - - @HostBinding('class._transitioned') - protected transitioned = true; - - protected index = 0; - @Input('index') public set indexSetter(index: number) { this.index = index; diff --git a/projects/kit/components/chip/chip.directive.ts b/projects/kit/components/chip/chip.directive.ts index 1a7add935942..4bf409928c0b 100644 --- a/projects/kit/components/chip/chip.directive.ts +++ b/projects/kit/components/chip/chip.directive.ts @@ -64,8 +64,8 @@ class TuiChipStyles {} export class TuiChipDirective { private readonly options = inject(TUI_CHIP_OPTIONS); + protected readonly nothing = tuiWithStyles(TuiChipStyles); + @Input() public size: TuiSizeXXS = this.options.size; - - protected readonly nothing = tuiWithStyles(TuiChipStyles); } diff --git a/projects/kit/components/data-list-wrapper/data-list-wrapper.component.ts b/projects/kit/components/data-list-wrapper/data-list-wrapper.component.ts index 10ed90b4aeb5..edceb6a2199f 100644 --- a/projects/kit/components/data-list-wrapper/data-list-wrapper.component.ts +++ b/projects/kit/components/data-list-wrapper/data-list-wrapper.component.ts @@ -51,6 +51,9 @@ import {type PolymorpheusContent, PolymorpheusModule} from '@tinkoff/ng-polymorp export class TuiDataListWrapperComponent { private readonly itemsHandlers: TuiItemsHandlers = inject(TUI_ITEMS_HANDLERS); + @ViewChildren(forwardRef(() => TuiOptionComponent)) + protected readonly optionsQuery: QueryList> = EMPTY_QUERY; + @Input() public items: readonly T[] | null = []; @@ -67,9 +70,6 @@ export class TuiDataListWrapperComponent { @Output() public readonly itemClick = new EventEmitter(); - @ViewChildren(forwardRef(() => TuiOptionComponent)) - protected readonly optionsQuery: QueryList> = EMPTY_QUERY; - @Input() public itemContent: PolymorpheusContent> = ({$implicit}) => this.itemsHandlers.stringify($implicit); diff --git a/projects/kit/components/files/file/file.component.ts b/projects/kit/components/files/file/file.component.ts index 0dd794382db2..ff5a2077e797 100644 --- a/projects/kit/components/files/file/file.component.ts +++ b/projects/kit/components/files/file/file.component.ts @@ -54,6 +54,9 @@ export class TuiFileComponent { private readonly units$ = inject(TUI_DIGITAL_INFORMATION_UNITS); private readonly win = inject(WINDOW) as Window & {File: typeof File}; + protected readonly icons = inject(TUI_COMMON_ICONS); + protected readonly fileTexts$ = inject(TUI_FILE_TEXTS); + @Input() public file: TuiFileLike = {name: ''}; @@ -76,9 +79,6 @@ export class TuiFileComponent { @Output() public readonly remove = new EventEmitter(); - protected readonly icons = inject(TUI_COMMON_ICONS); - protected readonly fileTexts$ = inject(TUI_FILE_TEXTS); - protected get preview(): SafeValue { return this.isBig ? this.createPreview(this.file) : ''; } diff --git a/projects/kit/components/files/files/files.component.ts b/projects/kit/components/files/files/files.component.ts index 9f6a65093bd0..dd7ed30f052a 100644 --- a/projects/kit/components/files/files/files.component.ts +++ b/projects/kit/components/files/files/files.component.ts @@ -32,6 +32,13 @@ import {TUI_HIDE_TEXT, TUI_SHOW_ALL_TEXT} from '@taiga-ui/kit/tokens'; hostDirectives: [TuiGroupDirective], }) export class TuiFilesComponent { + @ContentChildren(TuiItemDirective, {read: TemplateRef}) + protected readonly items: QueryList>> = + EMPTY_QUERY; + + protected readonly hideText$ = inject(TUI_HIDE_TEXT); + protected readonly showAllText$ = inject(TUI_SHOW_ALL_TEXT); + @Input() public max = 0; @@ -41,13 +48,6 @@ export class TuiFilesComponent { @Output() public readonly expandedChange = new EventEmitter(); - @ContentChildren(TuiItemDirective, {read: TemplateRef}) - protected readonly items: QueryList>> = - EMPTY_QUERY; - - protected readonly hideText$ = inject(TUI_HIDE_TEXT); - protected readonly showAllText$ = inject(TUI_SHOW_ALL_TEXT); - protected get hasExtraItems(): boolean { return !!this.max && this.items.length > this.max; } diff --git a/projects/kit/components/files/input-files/input-files-validator.directive.ts b/projects/kit/components/files/input-files/input-files-validator.directive.ts index 2a81b170a29e..021d1c3cfb89 100644 --- a/projects/kit/components/files/input-files/input-files-validator.directive.ts +++ b/projects/kit/components/files/input-files/input-files-validator.directive.ts @@ -40,7 +40,6 @@ export class TuiInputFilesValidatorDirective implements OnChanges, OnInit { tuiCreateFileFormatValidator(this.accept), tuiCreateFileSizeValidator(this.maxFileSize), ]) || Validators.nullValidator; - // eslint-disable-next-line @angular-eslint/no-lifecycle-call this.validator.ngOnChanges(); } } diff --git a/projects/kit/components/files/input-files/input-files.component.ts b/projects/kit/components/files/input-files/input-files.component.ts index be3d615c421b..a0a5fd0bca80 100644 --- a/projects/kit/components/files/input-files/input-files.component.ts +++ b/projects/kit/components/files/input-files/input-files.component.ts @@ -39,16 +39,15 @@ import {TuiInputFilesDirective} from './input-files.directive'; }, }) export class TuiInputFilesComponent { - @ContentChild(TuiInputFilesDirective) - public readonly input?: TuiInputFilesDirective; - @ContentChild(TemplateRef) protected readonly template?: TemplateRef>; protected files?: FileList | null; - protected readonly content = new PolymorpheusComponent(TuiInputFilesContent); + @ContentChild(TuiInputFilesDirective) + public readonly input?: TuiInputFilesDirective; + protected get fileDragged(): boolean { return !!this.files && !this.input?.computedDisabled; } diff --git a/projects/kit/components/files/input-files/input-files.directive.ts b/projects/kit/components/files/input-files/input-files.directive.ts index 055671faeae6..cbf487af937e 100644 --- a/projects/kit/components/files/input-files/input-files.directive.ts +++ b/projects/kit/components/files/input-files/input-files.directive.ts @@ -45,6 +45,8 @@ export class TuiInputFilesDirective extends AbstractTuiNullableControl implements TuiAppearanceOptions { + protected readonly host = inject(forwardRef(() => TuiInputFilesComponent)); + @Output() public readonly reject = timer(0).pipe( switchMap(() => tuiControlValue(this.control)), @@ -55,8 +57,6 @@ export class TuiInputFilesDirective public readonly appearance = 'file'; public readonly input = tuiInjectElement(); - protected readonly host = inject(forwardRef(() => TuiInputFilesComponent)); - public get focused(): boolean { return tuiIsNativeFocused(this.input); } diff --git a/projects/kit/components/line-clamp/line-clamp.component.ts b/projects/kit/components/line-clamp/line-clamp.component.ts index 77620d716fb0..4b8df4a93ef8 100644 --- a/projects/kit/components/line-clamp/line-clamp.component.ts +++ b/projects/kit/components/line-clamp/line-clamp.component.ts @@ -77,16 +77,6 @@ export class TuiLineClampComponent implements DoCheck, AfterViewInit { private readonly isOverflown$ = new Subject(); private initialized = false; - @Input() - public lineHeight = 24; - - @Input() - public content: PolymorpheusContent; - - @Output() - public readonly overflownChange: Observable = - this.isOverflown$.pipe(distinctUntilChanged()); - protected lineClamp$ = this.linesLimit$.pipe( startWith(1), pairwise(), @@ -100,6 +90,16 @@ export class TuiLineClampComponent implements DoCheck, AfterViewInit { ), ); + @Input() + public lineHeight = 24; + + @Input() + public content: PolymorpheusContent; + + @Output() + public readonly overflownChange: Observable = + this.isOverflown$.pipe(distinctUntilChanged()); + constructor() { this.skipInitialTransition(); } diff --git a/projects/kit/components/pagination/pagination.component.ts b/projects/kit/components/pagination/pagination.component.ts index d97b60ac6613..0c0df8cd8cb5 100644 --- a/projects/kit/components/pagination/pagination.component.ts +++ b/projects/kit/components/pagination/pagination.component.ts @@ -36,6 +36,9 @@ export class TuiPaginationComponent { private readonly el = tuiInjectElement(); + protected readonly texts$ = inject(TUI_PAGINATION_TEXTS); + protected readonly icons = inject(TUI_SPIN_ICONS); + @Input() public length = 1; @@ -75,9 +78,6 @@ export class TuiPaginationComponent { @Output() public readonly indexChange = new EventEmitter(); - protected readonly texts$ = inject(TUI_PAGINATION_TEXTS); - protected readonly icons = inject(TUI_SPIN_ICONS); - public get nativeFocusableElement(): TuiNativeFocusableElement | null { if (this.disabled) { return null; diff --git a/projects/kit/components/preview/pagination/preview-pagination.component.ts b/projects/kit/components/preview/pagination/preview-pagination.component.ts index 72b27f68e437..aebd41b00262 100644 --- a/projects/kit/components/preview/pagination/preview-pagination.component.ts +++ b/projects/kit/components/preview/pagination/preview-pagination.component.ts @@ -23,6 +23,9 @@ import {TuiPreviewActionDirective} from '../preview-action/preview-action.direct changeDetection: ChangeDetectionStrategy.OnPush, }) export class TuiPreviewPaginationComponent { + protected readonly icons = inject(TUI_PREVIEW_ICONS); + protected readonly texts$ = inject(TUI_PAGINATION_TEXTS); + @Input() public length = 1; @@ -32,9 +35,6 @@ export class TuiPreviewPaginationComponent { @Output() public readonly indexChange = new EventEmitter(); - protected readonly icons = inject(TUI_PREVIEW_ICONS); - protected readonly texts$ = inject(TUI_PAGINATION_TEXTS); - @HostListener('document:keydown.arrowRight.prevent', ['1']) @HostListener('document:keydown.arrowLeft.prevent', ['-1']) public onArrowClick(step: number): void { diff --git a/projects/kit/components/preview/preview.component.ts b/projects/kit/components/preview/preview.component.ts index 25ce9cb98644..fc9605475dfa 100644 --- a/projects/kit/components/preview/preview.component.ts +++ b/projects/kit/components/preview/preview.component.ts @@ -48,20 +48,11 @@ const ROTATION_ANGLE = 90; export class TuiPreviewComponent { private readonly el = tuiInjectElement(); - @Input() - public zoomable = true; - - @Input() - public rotatable = false; - protected minZoom = 1; - protected width = 0; protected height = 0; - protected readonly texts$ = inject(TUI_PREVIEW_TEXTS); protected readonly icons = inject(TUI_PREVIEW_ICONS); - protected readonly zoom$ = new BehaviorSubject(this.minZoom); protected readonly rotation$ = new BehaviorSubject(0); protected readonly coordinates$ = new BehaviorSubject( @@ -92,6 +83,12 @@ export class TuiPreviewComponent { ), ); + @Input() + public zoomable = true; + + @Input() + public rotatable = false; + protected rotate(): void { this.rotation$.next(this.rotation$.value - ROTATION_ANGLE); } diff --git a/projects/kit/components/preview/zoom/preview-zoom.component.ts b/projects/kit/components/preview/zoom/preview-zoom.component.ts index 69c62e6baf8d..bff56518480e 100644 --- a/projects/kit/components/preview/zoom/preview-zoom.component.ts +++ b/projects/kit/components/preview/zoom/preview-zoom.component.ts @@ -36,6 +36,9 @@ const STEP = 0.5; changeDetection: ChangeDetectionStrategy.OnPush, }) export class TuiPreviewZoomComponent { + protected readonly icons = inject(TUI_PREVIEW_ICONS); + protected readonly zoomTexts$ = inject(TUI_PREVIEW_ZOOM_TEXTS); + @Input() public min = 0.5; @@ -51,10 +54,7 @@ export class TuiPreviewZoomComponent { @Output() public readonly reset = new EventEmitter(); - protected readonly icons = inject(TUI_PREVIEW_ICONS); - protected readonly zoomTexts$ = inject(TUI_PREVIEW_ZOOM_TEXTS); - - protected readonly hintShow$ = this.valueChange.pipe( + public readonly hintShow$ = this.valueChange.pipe( switchMap(() => merge(of(true), timer(1000).pipe(map(TUI_FALSE_HANDLER)))), startWith(false), ); diff --git a/projects/kit/components/progress/progress-circle/progress-circle.component.ts b/projects/kit/components/progress/progress-circle/progress-circle.component.ts index 22f6a6849a74..324997adabb7 100644 --- a/projects/kit/components/progress/progress-circle/progress-circle.component.ts +++ b/projects/kit/components/progress/progress-circle/progress-circle.component.ts @@ -9,6 +9,8 @@ import {delay, of} from 'rxjs'; changeDetection: ChangeDetectionStrategy.OnPush, }) export class TuiProgressCircleComponent { + protected readonly animationDelay$ = of(true).pipe(delay(0)); + @Input() public value = 0; @@ -23,8 +25,6 @@ export class TuiProgressCircleComponent { @HostBinding('attr.data-size') public size: TuiSizeXXL | TuiSizeXXS = 'm'; - protected readonly animationDelay$ = of(true).pipe(delay(0)); - @HostBinding('style.--progress-ratio') protected get progressRatio(): number { const ratio = this.value / this.max; diff --git a/projects/kit/components/progress/progress-segmented/progress-segmented.directive.ts b/projects/kit/components/progress/progress-segmented/progress-segmented.directive.ts index 37dd61d57b97..47e52d1f6c49 100644 --- a/projects/kit/components/progress/progress-segmented/progress-segmented.directive.ts +++ b/projects/kit/components/progress/progress-segmented/progress-segmented.directive.ts @@ -26,8 +26,8 @@ class TuiProgressSegmentedStyles {} }, }) export class TuiProgressSegmentedDirective { + protected readonly nothing = tuiWithStyles(TuiProgressSegmentedStyles); + @Input() public segments = 1; - - protected readonly nothing = tuiWithStyles(TuiProgressSegmentedStyles); } diff --git a/projects/kit/components/pulse/pulse.component.ts b/projects/kit/components/pulse/pulse.component.ts index c5d9256fd572..daea771964c2 100644 --- a/projects/kit/components/pulse/pulse.component.ts +++ b/projects/kit/components/pulse/pulse.component.ts @@ -20,8 +20,8 @@ import { }, }) export class TuiPulseComponent { + protected readonly animation = tuiToAnimationOptions(inject(TUI_ANIMATIONS_SPEED)); + @Input() public playing = true; - - protected readonly animation = tuiToAnimationOptions(inject(TUI_ANIMATIONS_SPEED)); } diff --git a/projects/kit/components/push/push.component.ts b/projects/kit/components/push/push.component.ts index 6bd3c53ff1f5..525b28a408a7 100644 --- a/projects/kit/components/push/push.component.ts +++ b/projects/kit/components/push/push.component.ts @@ -26,6 +26,10 @@ import { providers: [tuiButtonOptionsProvider({size: 's', appearance: 'secondary'})], }) export class TuiPushComponent { + protected readonly isString = tuiIsString; + protected readonly closeWord$ = inject(TUI_CLOSE_WORD); + protected readonly icons = inject(TUI_COMMON_ICONS); + @Input() public heading = ''; @@ -37,9 +41,4 @@ export class TuiPushComponent { @Output() public readonly close = new EventEmitter(); - - protected readonly isString = tuiIsString; - - protected readonly closeWord$ = inject(TUI_CLOSE_WORD); - protected readonly icons = inject(TUI_COMMON_ICONS); } diff --git a/projects/kit/components/radio/radio.component.ts b/projects/kit/components/radio/radio.component.ts index d53ee8b64341..0048c1c1eb52 100644 --- a/projects/kit/components/radio/radio.component.ts +++ b/projects/kit/components/radio/radio.component.ts @@ -35,11 +35,11 @@ export class TuiRadioComponent implements DoCheck { private readonly options = inject(TUI_RADIO_OPTIONS); private readonly el = tuiInjectElement(); + protected readonly control = inject(NgControl, {optional: true, self: true}); + @Input() public size: TuiSizeS = this.options.size; - protected readonly control = inject(NgControl, {optional: true, self: true}); - public ngDoCheck(): void { this.appearance.tuiAppearance = this.options.appearance(this.el); } diff --git a/projects/kit/components/range/range.component.ts b/projects/kit/components/range/range.component.ts index 0adc5bcc27d0..2afddfdc501b 100644 --- a/projects/kit/components/range/range.component.ts +++ b/projects/kit/components/range/range.component.ts @@ -54,6 +54,8 @@ export class TuiRangeComponent { private readonly el = tuiInjectElement(); + protected lastActiveThumb: 'left' | 'right' = 'right'; + @Input() public min = 0; @@ -76,8 +78,6 @@ export class TuiRangeComponent @ViewChildren(TuiSliderComponent, {read: ElementRef}) public slidersRefs: QueryList> = EMPTY_QUERY; - protected lastActiveThumb: 'left' | 'right' = 'right'; - @HostBinding('style.--left.%') public get left(): number { return this.getPercentageFromValue(this.value[0]); diff --git a/projects/kit/components/rating/rating.component.ts b/projects/kit/components/rating/rating.component.ts index 8739059ae778..86f3557d3f77 100644 --- a/projects/kit/components/rating/rating.component.ts +++ b/projects/kit/components/rating/rating.component.ts @@ -45,15 +45,15 @@ export class TuiRatingComponent private readonly options = inject(TUI_RATING_OPTIONS); + @HostBinding('class._active') + protected active = 0; + @Input() public icon = this.options.icon; @Input() public max = this.options.max; - @HostBinding('class._active') - protected active = 0; - public get nativeFocusableElement(): HTMLInputElement | null { return this.computedDisabled ? null : this.input?.nativeElement || null; } diff --git a/projects/kit/components/segmented/segmented.component.ts b/projects/kit/components/segmented/segmented.component.ts index f06bf955bb54..86109c93f7c1 100644 --- a/projects/kit/components/segmented/segmented.component.ts +++ b/projects/kit/components/segmented/segmented.component.ts @@ -31,6 +31,10 @@ import {TuiSegmentedDirective} from './segmented.directive'; export class TuiSegmentedComponent implements OnChanges { private readonly el = tuiInjectElement(); + protected readonly sub = inject(ResizeObserverService) + .pipe(tuiZonefree(inject(NgZone)), takeUntilDestroyed()) + .subscribe(() => this.refresh()); + @Input() @HostBinding('attr.data-size') public size: TuiSizeL | TuiSizeS = 's'; @@ -41,10 +45,6 @@ export class TuiSegmentedComponent implements OnChanges { @Output() public readonly activeItemIndexChange = new EventEmitter(); - protected readonly sub = inject(ResizeObserverService) - .pipe(tuiZonefree(inject(NgZone)), takeUntilDestroyed()) - .subscribe(() => this.refresh()); - public ngOnChanges(): void { this.refresh(); } diff --git a/projects/kit/components/stepper/step.component.ts b/projects/kit/components/stepper/step.component.ts index ba5442a912c8..f10cf9e463fd 100644 --- a/projects/kit/components/stepper/step.component.ts +++ b/projects/kit/components/stepper/step.component.ts @@ -30,6 +30,11 @@ export class TuiStepComponent { private readonly routerLinkActive$: Observable = inject(RouterLinkActive, {optional: true})?.isActiveChange || EMPTY; + @HostBinding('class._focus-visible') + protected focusVisible = false; + + protected readonly icons = inject(TUI_COMMON_ICONS); + @Input() @HostBinding('attr.data-state') public stepState: 'error' | 'normal' | 'pass' = 'normal'; @@ -37,11 +42,6 @@ export class TuiStepComponent { @Input() public icon = ''; - @HostBinding('class._focus-visible') - protected focusVisible = false; - - protected readonly icons = inject(TUI_COMMON_ICONS); - constructor() { this.routerLinkActive$.pipe(filter(Boolean)).subscribe(() => { this.activate(); diff --git a/projects/kit/components/stepper/stepper.component.ts b/projects/kit/components/stepper/stepper.component.ts index 56b32b8ab7e1..078eef42357b 100644 --- a/projects/kit/components/stepper/stepper.component.ts +++ b/projects/kit/components/stepper/stepper.component.ts @@ -54,6 +54,8 @@ export class TuiStepperComponent { private readonly speed = inject(TUI_ANIMATIONS_SPEED); private readonly destroyRef = inject(DestroyRef); + protected activeItemIndex = 0; + @Input() @HostBinding('attr.data-orientation') public orientation: TuiOrientation = 'horizontal'; @@ -61,8 +63,6 @@ export class TuiStepperComponent { @Output() public readonly activeItemIndexChange = new EventEmitter(); - protected activeItemIndex = 0; - constructor() { this.resize$ .pipe(takeUntilDestroyed()) diff --git a/projects/kit/components/switch/switch.component.ts b/projects/kit/components/switch/switch.component.ts index a50f2e09ae56..9a0c2ae7ac9f 100644 --- a/projects/kit/components/switch/switch.component.ts +++ b/projects/kit/components/switch/switch.component.ts @@ -44,14 +44,14 @@ export class TuiSwitchComponent implements DoCheck { private readonly options = inject(TUI_SWITCH_OPTIONS); private readonly el = tuiInjectElement(); + protected readonly control = inject(NgControl, {optional: true, self: true}); + @Input() public size: TuiSizeS = this.options.size; @Input() public showIcons = this.options.showIcons; - protected readonly control = inject(NgControl, {optional: true, self: true}); - public ngDoCheck(): void { this.appearance.tuiAppearance = this.options.appearance(this.el); } diff --git a/projects/kit/components/tabs/tabs-horizontal.directive.ts b/projects/kit/components/tabs/tabs-horizontal.directive.ts index 06173e78c1dd..dc014d6bd1cc 100644 --- a/projects/kit/components/tabs/tabs-horizontal.directive.ts +++ b/projects/kit/components/tabs/tabs-horizontal.directive.ts @@ -50,9 +50,6 @@ export class TuiTabsHorizontalDirective implements AfterViewChecked { private readonly options = inject(TUI_TABS_OPTIONS); private readonly tabs = inject(TuiTabsDirective); - @Input() - public underline = this.options.underline; - @ContentChildren(forwardRef(() => TuiTabDirective)) protected readonly children: QueryList = EMPTY_QUERY; @@ -60,6 +57,9 @@ export class TuiTabsHorizontalDirective implements AfterViewChecked { .pipe(tuiZonefree(inject(NgZone)), takeUntilDestroyed()) .subscribe(() => this.refresh()); + @Input() + public underline = this.options.underline; + public ngAfterViewChecked(): void { this.scrollTo(this.tabs.activeItemIndex); this.refresh(); diff --git a/projects/kit/components/tabs/tabs-with-more.component.ts b/projects/kit/components/tabs/tabs-with-more.component.ts index b19808ed4d29..fc34599ddd9f 100644 --- a/projects/kit/components/tabs/tabs-with-more.component.ts +++ b/projects/kit/components/tabs/tabs-with-more.component.ts @@ -67,6 +67,13 @@ export class TuiTabsWithMoreComponent implements AfterViewChecked, AfterViewInit private readonly cdr = inject(ChangeDetectorRef); private maxIndex = Infinity; + @ContentChildren(TuiItemDirective, {read: TemplateRef}) + protected readonly items: QueryList>> = + EMPTY_QUERY; + + protected readonly moreWord$ = inject(TUI_MORE_WORD); + protected open = false; + @Input() public size: TuiSizeL = this.options.size; @@ -87,13 +94,6 @@ export class TuiTabsWithMoreComponent implements AfterViewChecked, AfterViewInit public activeItemIndex = 0; - @ContentChildren(TuiItemDirective, {read: TemplateRef}) - protected readonly items: QueryList>> = - EMPTY_QUERY; - - protected readonly moreWord$ = inject(TUI_MORE_WORD); - protected open = false; - @Input('activeItemIndex') public set itemIndex(activeItemIndex: number) { this.activeItemIndex = activeItemIndex; diff --git a/projects/kit/components/tabs/tabs.directive.ts b/projects/kit/components/tabs/tabs.directive.ts index 13a2f08be20e..09dc13bcb8ff 100644 --- a/projects/kit/components/tabs/tabs.directive.ts +++ b/projects/kit/components/tabs/tabs.directive.ts @@ -41,6 +41,8 @@ export class TuiTabsDirective implements AfterViewChecked { private readonly el = tuiInjectElement(); private readonly injector = inject(INJECTOR); + protected readonly nothing = tuiWithStyles(TuiTabsStyles); + @Input() public size: TuiSizeL = inject(TUI_TABS_OPTIONS).size; @@ -50,8 +52,6 @@ export class TuiTabsDirective implements AfterViewChecked { @Output() public readonly activeItemIndexChange = new EventEmitter(); - protected readonly nothing = tuiWithStyles(TuiTabsStyles); - public get tabs(): readonly HTMLElement[] { return Array.from(this.el.querySelectorAll('[tuiTab]')); } diff --git a/projects/kit/components/tiles/tile.component.ts b/projects/kit/components/tiles/tile.component.ts index 5de5c82e4bb1..aa16ba649442 100644 --- a/projects/kit/components/tiles/tile.component.ts +++ b/projects/kit/components/tiles/tile.component.ts @@ -27,6 +27,9 @@ export class TuiTileComponent implements OnDestroy, AfterViewInit { private readonly service = inject(TuiTileService); private readonly tiles = inject(TuiTilesComponent); + @HostBinding('class._dragged') + protected dragged = false; + @Input() public width = 1; @@ -35,9 +38,6 @@ export class TuiTileComponent implements OnDestroy, AfterViewInit { public readonly element = tuiInjectElement(); - @HostBinding('class._dragged') - protected dragged = false; - public onDrag(offset: readonly [number, number]): void { const dragged = !Number.isNaN(offset[0]); diff --git a/projects/kit/components/tree/components/tree/tree.component.ts b/projects/kit/components/tree/components/tree/tree.component.ts index 1264f6546f86..bbf91f0129a8 100644 --- a/projects/kit/components/tree/components/tree/tree.component.ts +++ b/projects/kit/components/tree/components/tree/tree.component.ts @@ -28,9 +28,6 @@ import {TuiTreeItemComponent} from '../tree-item/tree-item.component'; export class TuiTreeComponent implements DoCheck { private readonly check$ = new Subject(); - @Input({required: true}) - public value!: T; - @ViewChild(forwardRef(() => TuiTreeItemComponent)) protected readonly item?: TuiTreeItemComponent; @@ -50,6 +47,11 @@ export class TuiTreeComponent implements DoCheck { }, ); + @Input({ + required: true, + }) + public value!: T; + @Input() public trackBy: TrackByFunction = (_: number, item: T) => item; diff --git a/projects/kit/components/tree/directives/tree-controller.directive.ts b/projects/kit/components/tree/directives/tree-controller.directive.ts index 992338d5a5db..6d0d3a149369 100644 --- a/projects/kit/components/tree/directives/tree-controller.directive.ts +++ b/projects/kit/components/tree/directives/tree-controller.directive.ts @@ -16,6 +16,8 @@ import {TUI_TREE_ACCESSOR, TUI_TREE_CONTROLLER} from '../misc/tree.tokens'; export class TuiTreeControllerDirective implements TuiTreeController, TuiTreeAccessor { + protected readonly items = new Map(); + @Input('tuiTreeController') public fallback = true; @@ -25,8 +27,6 @@ export class TuiTreeControllerDirective @Output() public readonly toggled = new EventEmitter(); - protected readonly items = new Map(); - public register(item: TuiTreeItemComponent, value: T): void { this.items.set(item, value); } diff --git a/projects/kit/directives/chevron/chevron.directive.ts b/projects/kit/directives/chevron/chevron.directive.ts index d7c22e95cdd3..5d4bfa1a686a 100644 --- a/projects/kit/directives/chevron/chevron.directive.ts +++ b/projects/kit/directives/chevron/chevron.directive.ts @@ -39,11 +39,11 @@ export class TuiChevronDirective implements DoCheck { private readonly icon = inject(TuiIconComponent, {optional: true}); private readonly handler = inject(TuiChevronService).getHandler(inject(INJECTOR)); + protected readonly nothing = tuiWithStyles(TuiChevronStyles); + @Input() public tuiChevron: boolean | '' = ''; - protected readonly nothing = tuiWithStyles(TuiChevronStyles); - public ngDoCheck(): void { this.set(this.handler()); this.el.classList.toggle( diff --git a/projects/kit/directives/comment/comment.directive.ts b/projects/kit/directives/comment/comment.directive.ts index 9b702e75e7f9..94da00b5cca6 100644 --- a/projects/kit/directives/comment/comment.directive.ts +++ b/projects/kit/directives/comment/comment.directive.ts @@ -28,8 +28,8 @@ class TuiCommentStyles {} }, }) export class TuiCommentDirective { + protected readonly nothing = tuiWithStyles(TuiCommentStyles); + @Input() public tuiComment: TuiHorizontalDirection | TuiVerticalDirection | '' = 'top'; - - protected readonly nothing = tuiWithStyles(TuiCommentStyles); } diff --git a/projects/kit/directives/sensitive/sensitive.directive.ts b/projects/kit/directives/sensitive/sensitive.directive.ts index 2f9f2624ae8a..49c04df59746 100644 --- a/projects/kit/directives/sensitive/sensitive.directive.ts +++ b/projects/kit/directives/sensitive/sensitive.directive.ts @@ -36,9 +36,6 @@ class TuiSensitiveStyles {} }, }) export class TuiSensitiveDirective { - @Input() - public tuiSensitive: boolean | null = false; - protected readonly nothing = tuiWithStyles(TuiSensitiveStyles); protected readonly offset = Math.round(Math.random() * 10) * 10; protected readonly height$ = inject(ResizeObserverService).pipe( @@ -48,4 +45,7 @@ export class TuiSensitiveDirective { ]), map(([rows, height]) => height * (rowsInSvg / rows)), ); + + @Input() + public tuiSensitive: boolean | null = false; } diff --git a/projects/kit/directives/skeleton/skeleton.directive.ts b/projects/kit/directives/skeleton/skeleton.directive.ts index 00552aa0f41c..aabd546e2532 100644 --- a/projects/kit/directives/skeleton/skeleton.directive.ts +++ b/projects/kit/directives/skeleton/skeleton.directive.ts @@ -44,11 +44,11 @@ export class TuiSkeletonDirective implements OnChanges { private readonly duration = inject(TUI_ANIMATIONS_SPEED) * TUI_ANIMATIONS_DEFAULT_DURATION * 2; + protected readonly nothing = tuiWithStyles(TuiSkeletonStyles); + @Input() public tuiSkeleton: boolean | number | string = false; - protected readonly nothing = tuiWithStyles(TuiSkeletonStyles); - public ngOnChanges({tuiSkeleton}: SimpleChanges): void { this.animation?.cancel(); diff --git a/projects/layout/components/app-bar/app-bar.component.ts b/projects/layout/components/app-bar/app-bar.component.ts index 78b7ed1523b5..790536ea229e 100644 --- a/projects/layout/components/app-bar/app-bar.component.ts +++ b/projects/layout/components/app-bar/app-bar.component.ts @@ -32,10 +32,6 @@ export class TuiAppBarComponent { @ViewChildren('side') private readonly side: QueryList> = EMPTY_QUERY; - @Input() - @HostBinding('attr.data-size') - public size: TuiSizeL = 'm'; - protected readonly width$ = merge( inject(ResizeObserverService), inject(MutationObserverService), @@ -49,4 +45,8 @@ export class TuiAppBarComponent { ), ), ); + + @Input() + @HostBinding('attr.data-size') + public size: TuiSizeL = 'm'; } diff --git a/projects/layout/directives/card/card.directive.ts b/projects/layout/directives/card/card.directive.ts index ad42353ab189..903c1bab7015 100644 --- a/projects/layout/directives/card/card.directive.ts +++ b/projects/layout/directives/card/card.directive.ts @@ -39,8 +39,8 @@ export class TuiCardMediumDirective { }, }) export class TuiCardLargeDirective { + protected readonly nothing = tuiWithStyles(TuiCardStyles); + @Input('tuiCardLarge') public space: '' | 'compact' | 'normal' = 'normal'; - - protected readonly nothing = tuiWithStyles(TuiCardStyles); } diff --git a/projects/layout/directives/cell/cell.directive.ts b/projects/layout/directives/cell/cell.directive.ts index 9cf3b98294a0..13411fd4b5b1 100644 --- a/projects/layout/directives/cell/cell.directive.ts +++ b/projects/layout/directives/cell/cell.directive.ts @@ -35,8 +35,8 @@ class TuiCellStyles {} }, }) export class TuiCellDirective { + protected readonly nothing = tuiWithStyles(TuiCellStyles); + @Input('tuiCell') public size: TuiSizeL | TuiSizeS | '' = 'l'; - - protected readonly nothing = tuiWithStyles(TuiCellStyles); } diff --git a/projects/layout/directives/header/header.directive.ts b/projects/layout/directives/header/header.directive.ts index 899e913a9036..a5ac1b41aa54 100644 --- a/projects/layout/directives/header/header.directive.ts +++ b/projects/layout/directives/header/header.directive.ts @@ -36,8 +36,8 @@ class TuiHeaderStyles {} }, }) export class TuiHeaderDirective { + protected readonly nothing = tuiWithStyles(TuiHeaderStyles); + @Input('tuiHeader') public size: TuiSizeXXL | TuiSizeXXS | '' = 's'; - - protected readonly nothing = tuiWithStyles(TuiHeaderStyles); } diff --git a/projects/legacy/classes/abstract-native-select.ts b/projects/legacy/classes/abstract-native-select.ts index 941035c628f5..d6b677860b06 100644 --- a/projects/legacy/classes/abstract-native-select.ts +++ b/projects/legacy/classes/abstract-native-select.ts @@ -16,9 +16,6 @@ import {TUI_ITEMS_HANDLERS} from '@taiga-ui/kit'; export abstract class AbstractTuiNativeSelect { private readonly idService = inject(TuiIdService); - @Input() - public disabledItemHandler: TuiBooleanHandler | null = null; - @ViewChild(TuiDataListDirective, {read: TemplateRef, static: true}) protected readonly datalist: TemplateRef | null = null; @@ -27,6 +24,9 @@ export abstract class AbstractTuiNativeSelect protected readonly control = inject(AbstractTuiControl); protected readonly itemsHandlers = inject(TUI_ITEMS_HANDLERS); + @Input() + public disabledItemHandler: TuiBooleanHandler | null = null; + @HostBinding('id') protected get id(): string { return this.el.id || this.idService.generate(); diff --git a/projects/legacy/components/combo-box/combo-box.component.ts b/projects/legacy/components/combo-box/combo-box.component.ts index 7458f29846eb..6893768036d4 100644 --- a/projects/legacy/components/combo-box/combo-box.component.ts +++ b/projects/legacy/components/combo-box/combo-box.component.ts @@ -78,6 +78,9 @@ export class TuiComboBoxComponent private readonly itemsHandlers = inject>(TUI_ITEMS_HANDLERS); private readonly textfieldSize = inject(TUI_TEXTFIELD_SIZE); + @ContentChild(TuiDataListDirective, {read: TemplateRef}) + protected readonly datalist: PolymorpheusContent>; + @Input() public stringify: TuiItemsHandlers['stringify'] = this.itemsHandlers.stringify; @@ -102,9 +105,6 @@ export class TuiComboBoxComponent public open = false; - @ContentChild(TuiDataListDirective, {read: TemplateRef}) - protected readonly datalist: PolymorpheusContent>; - public get nativeFocusableElement(): HTMLInputElement | null { return this.textfield?.nativeFocusableElement ?? null; } diff --git a/projects/legacy/components/input-date-multi/input-date-multi.component.ts b/projects/legacy/components/input-date-multi/input-date-multi.component.ts index d62f38631fe8..0de63eb6557d 100644 --- a/projects/legacy/components/input-date-multi/input-date-multi.component.ts +++ b/projects/legacy/components/input-date-multi/input-date-multi.component.ts @@ -84,6 +84,31 @@ export class TuiInputDateMultiComponent private readonly options = inject(TUI_INPUT_DATE_OPTIONS); private readonly textfieldSize = inject(TUI_TEXTFIELD_SIZE); + protected readonly dateTexts$ = inject(TUI_DATE_TEXTS); + protected override readonly valueTransformer = inject< + TuiValueTransformer + >(TUI_DATE_VALUE_TRANSFORMER, {optional: true}); + + protected open = false; + + protected dateFormat = TUI_DEFAULT_DATE_FORMAT; + protected readonly isMobile = inject(TUI_IS_MOBILE); + protected readonly doneWord$ = inject(TUI_DONE_WORD); + protected readonly filler$: Observable = this.dateTexts$.pipe( + map(dateTexts => + changeDateSeparator( + dateTexts[this.dateFormat.mode], + this.dateFormat.separator, + ), + ), + ); + + protected readonly dateFormat$ = inject(TUI_DATE_FORMAT) + .pipe(tuiWatch(this.cdr), takeUntilDestroyed()) + .subscribe(format => { + this.dateFormat = format; + }); + @Input() public min: TuiDay | null = this.options.min; @@ -115,38 +140,13 @@ export class TuiInputDateMultiComponent @Input() public rows = 1; - protected readonly dateTexts$ = inject(TUI_DATE_TEXTS); - protected override readonly valueTransformer = inject< - TuiValueTransformer - >(TUI_DATE_VALUE_TRANSFORMER, {optional: true}); - - protected maskitoOptions: MaskitoOptions = maskitoDateOptionsGenerator({ + public readonly maskitoOptions: MaskitoOptions = maskitoDateOptionsGenerator({ mode: 'dd/mm/yyyy', separator: '.', min: this.min?.toLocalNativeDate(), max: this.max?.toLocalNativeDate(), }); - protected open = false; - - protected dateFormat = TUI_DEFAULT_DATE_FORMAT; - protected readonly isMobile = inject(TUI_IS_MOBILE); - protected readonly doneWord$ = inject(TUI_DONE_WORD); - protected readonly filler$: Observable = this.dateTexts$.pipe( - map(dateTexts => - changeDateSeparator( - dateTexts[this.dateFormat.mode], - this.dateFormat.separator, - ), - ), - ); - - protected readonly dateFormat$ = inject(TUI_DATE_FORMAT) - .pipe(tuiWatch(this.cdr), takeUntilDestroyed()) - .subscribe(format => { - this.dateFormat = format; - }); - public get nativeFocusableElement(): HTMLInputElement | null { return this.textfield?.nativeFocusableElement || null; } diff --git a/projects/legacy/components/input-date-range/input-date-range.component.ts b/projects/legacy/components/input-date-range/input-date-range.component.ts index e6a68b0faaf2..380c87063110 100644 --- a/projects/legacy/components/input-date-range/input-date-range.component.ts +++ b/projects/legacy/components/input-date-range/input-date-range.component.ts @@ -86,6 +86,28 @@ export class TuiInputDateRangeComponent private readonly options = inject(TUI_INPUT_DATE_OPTIONS); private readonly textfieldSize = inject(TUI_TEXTFIELD_SIZE); + protected readonly dateTexts$ = inject(TUI_DATE_TEXTS); + protected override readonly valueTransformer = inject( + TUI_DATE_RANGE_VALUE_TRANSFORMER, + {optional: true}, + ); + + protected readonly dateFiller$ = this.dateTexts$.pipe( + map(dateTexts => + changeDateSeparator( + dateTexts[this.dateFormat.mode], + this.dateFormat.separator, + ), + ), + ); + + protected dateFormat = TUI_DEFAULT_DATE_FORMAT; + protected readonly dateFormat$ = inject(TUI_DATE_FORMAT) + .pipe(tuiWatch(this.cdr), takeUntilDestroyed()) + .subscribe(format => { + this.dateFormat = format; + }); + @Input() public disabledItemHandler: TuiBooleanHandler = TUI_FALSE_HANDLER; @@ -112,28 +134,6 @@ export class TuiInputDateRangeComponent public open = false; - protected readonly dateTexts$ = inject(TUI_DATE_TEXTS); - protected override readonly valueTransformer = inject( - TUI_DATE_RANGE_VALUE_TRANSFORMER, - {optional: true}, - ); - - protected readonly dateFiller$ = this.dateTexts$.pipe( - map(dateTexts => - changeDateSeparator( - dateTexts[this.dateFormat.mode], - this.dateFormat.separator, - ), - ), - ); - - protected dateFormat = TUI_DEFAULT_DATE_FORMAT; - protected readonly dateFormat$ = inject(TUI_DATE_FORMAT) - .pipe(tuiWatch(this.cdr), takeUntilDestroyed()) - .subscribe(format => { - this.dateFormat = format; - }); - public get nativeFocusableElement(): HTMLInputElement | null { return this.textfield?.nativeFocusableElement ?? null; } diff --git a/projects/legacy/components/input-date-time/input-date-time.component.ts b/projects/legacy/components/input-date-time/input-date-time.component.ts index 47137bdc91e7..6d04f2880e22 100644 --- a/projects/legacy/components/input-date-time/input-date-time.component.ts +++ b/projects/legacy/components/input-date-time/input-date-time.component.ts @@ -81,20 +81,6 @@ export class TuiInputDateTimeComponent private month: TuiMonth | null = null; private readonly timeMode$ = new BehaviorSubject('HH:MM'); - @Input() - public min: TuiDay | [TuiDay | null, TuiTime | null] | null = this.options.min; - - @Input() - public max: TuiDay | [TuiDay | null, TuiTime | null] | null = this.options.max; - - @Input() - public disabledItemHandler: TuiBooleanHandler = TUI_FALSE_HANDLER; - - @Input() - public defaultActiveYearMonth = TuiMonth.currentLocal(); - - public open = false; - protected readonly timeTexts$ = inject(TUI_TIME_TEXTS); protected readonly dateTexts$ = inject(TUI_DATE_TEXTS); protected override readonly valueTransformer = inject( @@ -129,6 +115,20 @@ export class TuiInputDateTimeComponent this.dateFormat = format; }); + @Input() + public min: TuiDay | [TuiDay | null, TuiTime | null] | null = this.options.min; + + @Input() + public max: TuiDay | [TuiDay | null, TuiTime | null] | null = this.options.max; + + @Input() + public disabledItemHandler: TuiBooleanHandler = TUI_FALSE_HANDLER; + + @Input() + public defaultActiveYearMonth = TuiMonth.currentLocal(); + + public open = false; + @Input() public set timeMode(value: TuiTimeMode) { this.timeMode$.next(value); diff --git a/projects/legacy/components/input-date/input-date.component.ts b/projects/legacy/components/input-date/input-date.component.ts index a587535bd50b..5c2115ffd68d 100644 --- a/projects/legacy/components/input-date/input-date.component.ts +++ b/projects/legacy/components/input-date/input-date.component.ts @@ -1,3 +1,4 @@ +/* eslint-disable @typescript-eslint/member-ordering */ import { ChangeDetectionStrategy, Component, diff --git a/projects/legacy/components/input-month-range/input-month-range.component.ts b/projects/legacy/components/input-month-range/input-month-range.component.ts index 7891ad352006..7e996182af27 100644 --- a/projects/legacy/components/input-month-range/input-month-range.component.ts +++ b/projects/legacy/components/input-month-range/input-month-range.component.ts @@ -54,6 +54,8 @@ export class TuiInputMonthRangeComponent private readonly options = inject(TUI_INPUT_DATE_OPTIONS); private readonly textfieldSize = inject(TUI_TEXTFIELD_SIZE); + protected readonly formatter = inject(TUI_MONTH_FORMATTER); + @Input() public min: TuiMonth = this.options.min; @@ -74,8 +76,6 @@ export class TuiInputMonthRangeComponent public open = false; - protected readonly formatter = inject(TUI_MONTH_FORMATTER); - public get nativeFocusableElement(): HTMLInputElement | null { return this.textfield?.nativeFocusableElement ?? null; } diff --git a/projects/legacy/components/input-month/input-month.component.ts b/projects/legacy/components/input-month/input-month.component.ts index b0ac46da7490..2d218d4596bd 100644 --- a/projects/legacy/components/input-month/input-month.component.ts +++ b/projects/legacy/components/input-month/input-month.component.ts @@ -54,6 +54,9 @@ export class TuiInputMonthComponent private readonly options = inject(TUI_INPUT_DATE_OPTIONS); private readonly textfieldSize = inject(TUI_TEXTFIELD_SIZE); + protected readonly formatter = inject(TUI_MONTH_FORMATTER); + protected activeYear?: TuiYear; + @Input() public min: TuiMonth | null = this.options.min; @@ -68,9 +71,6 @@ export class TuiInputMonthComponent public open = false; - protected readonly formatter = inject(TUI_MONTH_FORMATTER); - protected activeYear?: TuiYear; - public get nativeFocusableElement(): HTMLInputElement | null { return this.textfield?.nativeFocusableElement || null; } diff --git a/projects/legacy/components/input-number/input-number.component.ts b/projects/legacy/components/input-number/input-number.component.ts index 97a8876ff1a3..974d9da704af 100644 --- a/projects/legacy/components/input-number/input-number.component.ts +++ b/projects/legacy/components/input-number/input-number.component.ts @@ -78,15 +78,6 @@ export class TuiInputNumberComponent private readonly options = inject(TUI_INPUT_NUMBER_OPTIONS); private unfinishedValue: string | null = ''; - @Input() - public min: number | null = this.options.min; - - @Input() - public max: number | null = this.options.max; - - @Input() - public step = this.options.step; - @ContentChildren(PolymorpheusOutletDirective, {descendants: true}) protected readonly polymorpheusValueContent: QueryList = EMPTY_QUERY; @@ -102,6 +93,15 @@ export class TuiInputNumberComponent this.numberFormat = format; }); + @Input() + public min: number | null = this.options.min; + + @Input() + public max: number | null = this.options.max; + + @Input() + public step = this.options.step; + public get nativeFocusableElement(): HTMLInputElement | null { return !this.textfield || this.computedDisabled ? null diff --git a/projects/legacy/components/input-phone-international/input-phone-international.component.ts b/projects/legacy/components/input-phone-international/input-phone-international.component.ts index d107f93151e4..c07ad15a89d6 100644 --- a/projects/legacy/components/input-phone-international/input-phone-international.component.ts +++ b/projects/legacy/components/input-phone-international/input-phone-international.component.ts @@ -99,6 +99,13 @@ export class TuiInputPhoneInternationalComponent private readonly extractCountryCodePipe = inject(TuiToCountryCodePipe); private readonly textfieldSize = inject(TUI_TEXTFIELD_SIZE); + protected open = false; + protected readonly countriesNames$ = inject(TUI_COUNTRIES); + protected readonly countriesMasks = inject(TUI_COUNTRIES_MASKS); + protected readonly arrow: PolymorpheusContent< + TuiContext + > = TUI_ARROW; + @Input() public countries = this.options.countries; @@ -107,14 +114,6 @@ export class TuiInputPhoneInternationalComponent public countryIsoCode = this.options.countryIsoCode; - protected open = false; - - protected readonly countriesNames$ = inject(TUI_COUNTRIES); - protected readonly countriesMasks = inject(TUI_COUNTRIES_MASKS); - protected readonly arrow: PolymorpheusContent< - TuiContext - > = TUI_ARROW; - @Input('countryIsoCode') public set isoCode(code: TuiCountryIsoCode) { if (this.countryIsoCode === code) { diff --git a/projects/legacy/components/input-phone/input-phone.component.ts b/projects/legacy/components/input-phone/input-phone.component.ts index e4a812397746..54b879d33987 100644 --- a/projects/legacy/components/input-phone/input-phone.component.ts +++ b/projects/legacy/components/input-phone/input-phone.component.ts @@ -75,6 +75,11 @@ export class TuiInputPhoneComponent private readonly options = inject(TUI_INPUT_PHONE_OPTIONS); private readonly textfieldSize = inject(TUI_TEXTFIELD_SIZE); + @ContentChild(TuiDataListDirective, {read: TemplateRef}) + protected readonly datalist?: TemplateRef>; + + protected open = false; + @Input() public phoneMaskAfterCountryCode = this.options.phoneMaskAfterCountryCode; @@ -89,11 +94,6 @@ export class TuiInputPhoneComponent public countryCode = this.options.countryCode; - @ContentChild(TuiDataListDirective, {read: TemplateRef}) - protected readonly datalist?: TemplateRef>; - - protected open = false; - @Input('countryCode') public set countryCodeSetter(newCountryCode: string) { const prevCountryCode = this.countryCode; diff --git a/projects/legacy/components/input-range/input-range.component.ts b/projects/legacy/components/input-range/input-range.component.ts index d7c279e4724a..7050878ff4b1 100644 --- a/projects/legacy/components/input-range/input-range.component.ts +++ b/projects/legacy/components/input-range/input-range.component.ts @@ -64,6 +64,11 @@ export class TuiInputRangeComponent private readonly isMobile = inject(TUI_IS_MOBILE); private readonly el = tuiInjectElement(); + protected leftTextfieldValue = this.safeCurrentValue[0]; + protected rightTextfieldValue = this.safeCurrentValue[1]; + protected lastActiveSide: 'left' | 'right' = 'left'; + protected readonly controller = inject(TUI_TEXTFIELD_WATCHED_CONTROLLER); + @Input() public min = 0; @@ -91,12 +96,6 @@ export class TuiInputRangeComponent @Input() public pluralize: Record | null = null; - protected leftTextfieldValue = this.safeCurrentValue[0]; - protected rightTextfieldValue = this.safeCurrentValue[1]; - protected lastActiveSide: 'left' | 'right' = 'left'; - - protected readonly controller = inject(TUI_TEXTFIELD_WATCHED_CONTROLLER); - public get nativeFocusableElement(): TuiNativeFocusableElement | null { return this.disabled ? null diff --git a/projects/legacy/components/input-slider/input-slider.component.ts b/projects/legacy/components/input-slider/input-slider.component.ts index 2f51aa6e0723..3afab023a862 100644 --- a/projects/legacy/components/input-slider/input-slider.component.ts +++ b/projects/legacy/components/input-slider/input-slider.component.ts @@ -61,6 +61,9 @@ export class TuiInputSliderComponent @ViewChild(TuiSliderComponent, {read: ElementRef}) private readonly sliderRef?: ElementRef; + protected textfieldValue = this.safeCurrentValue; + protected readonly controller = inject(TUI_TEXTFIELD_WATCHED_CONTROLLER); + @Input() public min = 0; @@ -82,10 +85,6 @@ export class TuiInputSliderComponent @Input() public valueContent: PolymorpheusContent>; - protected textfieldValue = this.safeCurrentValue; - - protected readonly controller = inject(TUI_TEXTFIELD_WATCHED_CONTROLLER); - public get nativeFocusableElement(): TuiNativeFocusableElement | null { return !this.inputNumberRef?.nativeFocusableElement || this.computedDisabled ? null diff --git a/projects/legacy/components/input-tag/input-tag.component.ts b/projects/legacy/components/input-tag/input-tag.component.ts index 9c232fac1c85..ad0864c4e8a8 100644 --- a/projects/legacy/components/input-tag/input-tag.component.ts +++ b/projects/legacy/components/input-tag/input-tag.component.ts @@ -106,6 +106,18 @@ export class TuiInputTagComponent private readonly el = tuiInjectElement(); private readonly options = inject(TUI_INPUT_TAG_OPTIONS); + @ContentChild(TuiDataListDirective, {read: TemplateRef}) + protected readonly datalist?: TemplateRef>; + + @ViewChild('errorIcon') + protected readonly errorIconTemplate?: TemplateRef>; + + protected readonly hintOptions = inject(TuiHintOptionsDirective, {optional: true}); + protected readonly controller = inject(TUI_TEXTFIELD_WATCHED_CONTROLLER); + protected readonly icons = inject(TUI_COMMON_ICONS); + protected status: TuiStatus = this.options.tagStatus; + protected open = false; + @Input() public separator: RegExp | string = this.options.separator; @@ -145,18 +157,6 @@ export class TuiInputTagComponent @Output() public readonly searchChange = new EventEmitter(); - @ContentChild(TuiDataListDirective, {read: TemplateRef}) - protected readonly datalist?: TemplateRef>; - - @ViewChild('errorIcon') - protected readonly errorIconTemplate?: TemplateRef>; - - protected readonly hintOptions = inject(TuiHintOptionsDirective, {optional: true}); - protected readonly controller = inject(TUI_TEXTFIELD_WATCHED_CONTROLLER); - protected readonly icons = inject(TUI_COMMON_ICONS); - protected status: TuiStatus = this.options.tagStatus; - protected open = false; - @Input('pseudoFocused') public set pseudoFocusedSetter(value: boolean | null) { if (!value && !this.focused) { diff --git a/projects/legacy/components/input-time/input-time.component.ts b/projects/legacy/components/input-time/input-time.component.ts index 676b1c6a0435..401234f582ee 100644 --- a/projects/legacy/components/input-time/input-time.component.ts +++ b/projects/legacy/components/input-time/input-time.component.ts @@ -72,6 +72,8 @@ export class TuiInputTimeComponent private readonly isIOS: boolean = inject(TUI_IS_IOS); private readonly textfieldSize = inject(TUI_TEXTFIELD_SIZE); + protected open = false; + @Input() public disabledItemHandler: TuiBooleanHandler = TUI_FALSE_HANDLER; @@ -87,8 +89,6 @@ export class TuiInputTimeComponent @Input() public mode: TuiInputTimeOptions['mode'] = this.options.mode; - protected open = false; - public get nativeFocusableElement(): HTMLInputElement | null { return this.textfield?.nativeFocusableElement ?? null; } diff --git a/projects/legacy/components/input-year/input-year.component.ts b/projects/legacy/components/input-year/input-year.component.ts index 0efcb839a820..65e348ce0065 100644 --- a/projects/legacy/components/input-year/input-year.component.ts +++ b/projects/legacy/components/input-year/input-year.component.ts @@ -45,6 +45,9 @@ export class TuiInputYearComponent private readonly options = inject(TUI_INPUT_DATE_OPTIONS); private readonly textfieldSize = inject(TUI_TEXTFIELD_SIZE); + protected open = false; + protected readonly initialItem = new Date().getFullYear(); + @Input() public min: number | null = this.options.min.year; @@ -56,9 +59,6 @@ export class TuiInputYearComponent public nativeValue = ''; - protected open = false; - protected readonly initialItem = new Date().getFullYear(); - public get nativeFocusableElement(): HTMLInputElement | null { return this.textfield?.nativeFocusableElement || null; } diff --git a/projects/legacy/components/input/input.component.ts b/projects/legacy/components/input/input.component.ts index 714eb553c7a4..3758f2445fc6 100644 --- a/projects/legacy/components/input/input.component.ts +++ b/projects/legacy/components/input/input.component.ts @@ -55,11 +55,11 @@ export class TuiInputComponent private readonly textfieldSize = inject(TUI_TEXTFIELD_SIZE); - public open = false; - @ContentChild(TuiDataListDirective, {read: TemplateRef}) protected readonly datalist: PolymorpheusContent>; + public open = false; + public get nativeFocusableElement(): HTMLInputElement | null { return this.computedDisabled || !this.textfield ? null diff --git a/projects/legacy/components/multi-select/multi-select-group/multi-select-group.component.ts b/projects/legacy/components/multi-select/multi-select-group/multi-select-group.component.ts index acd164f92d7a..fefdd1b3d965 100644 --- a/projects/legacy/components/multi-select/multi-select-group/multi-select-group.component.ts +++ b/projects/legacy/components/multi-select/multi-select-group/multi-select-group.component.ts @@ -37,12 +37,12 @@ export class TuiMultiSelectGroupComponent { private readonly host = inject>(TUI_DATA_LIST_HOST); private readonly control = inject(NgControl); + protected readonly multiSelectTexts$ = inject(TUI_MULTI_SELECT_TEXTS); + @HostBinding('class._label') @Input() public label = ''; - protected readonly multiSelectTexts$ = inject(TUI_MULTI_SELECT_TEXTS); - @tuiPure protected get empty$(): Observable { return tuiQueryListChanges(this.options).pipe(map(({length}) => !length)); diff --git a/projects/legacy/components/multi-select/multi-select.component.ts b/projects/legacy/components/multi-select/multi-select.component.ts index cc9a49e7b0e7..6200e212b374 100644 --- a/projects/legacy/components/multi-select/multi-select.component.ts +++ b/projects/legacy/components/multi-select/multi-select.component.ts @@ -91,6 +91,13 @@ export class TuiMultiSelectComponent private readonly itemsHandlers = inject>(TUI_ITEMS_HANDLERS); private readonly options = inject>(TUI_MULTI_SELECT_OPTIONS); + @ContentChild(TuiDataListDirective, {read: TemplateRef}) + protected readonly datalist: PolymorpheusContent>; + + protected open = false; + protected readonly controller = inject(TUI_TEXTFIELD_WATCHED_CONTROLLER); + protected readonly isMobile: boolean = inject(TUI_IS_MOBILE); + @Input() public stringify: TuiItemsHandlers['stringify'] = this.itemsHandlers.stringify; @@ -125,13 +132,6 @@ export class TuiMultiSelectComponent @Output() public readonly searchChange = new EventEmitter(); - @ContentChild(TuiDataListDirective, {read: TemplateRef}) - protected readonly datalist: PolymorpheusContent>; - - protected open = false; - protected readonly controller = inject(TUI_TEXTFIELD_WATCHED_CONTROLLER); - protected readonly isMobile: boolean = inject(TUI_IS_MOBILE); - public get nativeFocusableElement(): HTMLInputElement | null { return this.input?.nativeFocusableElement ?? null; } diff --git a/projects/legacy/components/select/select.component.ts b/projects/legacy/components/select/select.component.ts index ac67f5eed2da..ac8e27586f8d 100644 --- a/projects/legacy/components/select/select.component.ts +++ b/projects/legacy/components/select/select.component.ts @@ -79,6 +79,11 @@ export class TuiSelectComponent private readonly arrowMode = inject(TUI_ARROW_MODE); private readonly options = inject(TUI_SELECT_OPTIONS); + @ContentChild(TuiDataListDirective, {read: TemplateRef}) + protected readonly datalist: PolymorpheusContent>; + + protected readonly isMobile = inject(TUI_IS_MOBILE); + @Input() public stringify: TuiItemsHandlers['stringify'] = this.itemsHandlers.stringify; @@ -89,11 +94,6 @@ export class TuiSelectComponent @Input() public valueContent: TuiSelectOptions['valueContent'] = this.options.valueContent; - @ContentChild(TuiDataListDirective, {read: TemplateRef}) - protected readonly datalist: PolymorpheusContent>; - - protected readonly isMobile = inject(TUI_IS_MOBILE); - public get nativeFocusableElement(): HTMLInputElement | null { return this.textfield?.nativeFocusableElement ?? null; } diff --git a/projects/legacy/components/sheet/components/sheet/sheet.component.ts b/projects/legacy/components/sheet/components/sheet/sheet.component.ts index 5b0a7ae03d99..09058a001a75 100644 --- a/projects/legacy/components/sheet/components/sheet/sheet.component.ts +++ b/projects/legacy/components/sheet/components/sheet/sheet.component.ts @@ -58,18 +58,16 @@ export class TuiSheetComponent implements TuiSheetRequiredProps, AfterView private readonly el = tuiInjectElement(); private readonly zone = inject(NgZone); - @Input() - public item!: TuiSheet; - protected id = ''; - protected readonly isIos = inject(TUI_IS_IOS); protected readonly moreWord$ = inject(TUI_MORE_WORD); - protected readonly stuck$ = this.scroll$.pipe( map(y => Math.floor(y) > this.contentTop), ); + @Input() + public item!: TuiSheet; + @tuiPure public get context(): TuiSheet { return { diff --git a/projects/legacy/components/sheet/components/sheet/sheet.providers.ts b/projects/legacy/components/sheet/components/sheet/sheet.providers.ts index e674edea201b..f59eaae50336 100644 --- a/projects/legacy/components/sheet/components/sheet/sheet.providers.ts +++ b/projects/legacy/components/sheet/components/sheet/sheet.providers.ts @@ -11,9 +11,8 @@ import { } from '@taiga-ui/cdk'; import {TUI_SCROLL_REF} from '@taiga-ui/core'; import type {Observable} from 'rxjs'; -import {map, merge, share} from 'rxjs'; +import {concat, delay, map, merge, share, switchMap, take, takeUntil, zip} from 'rxjs'; -import {iosScrollFactory} from '../../ios.hacks'; import {TUI_SHEET, TUI_SHEET_DRAGGED, TUI_SHEET_SCROLL} from '../../sheet-tokens'; import {TuiSheetComponent} from './sheet.component'; @@ -55,3 +54,40 @@ export const TUI_SHEET_PROVIDERS: Provider[] = [ forwardRef(() => TuiSheetComponent), ), ]; + +function iosScrollFactory( + element: HTMLElement, + doc: Document, + zone: NgZone, +): Observable { + const load$ = tuiTypedFromEvent(element, 'load', {capture: true}); + const touchstart$ = tuiTypedFromEvent(element, 'touchstart', {passive: true}); + const touchmove$ = tuiTypedFromEvent(doc, 'touchmove', {passive: true}); + const touchend$ = tuiTypedFromEvent(doc, 'touchend'); + const scroll$ = tuiTypedFromEvent(element, 'scroll').pipe( + map(() => element.scrollTop), + ); + const result$ = merge( + load$.pipe( + delay(0), + map(() => element.scrollTop), + ), + touchstart$.pipe( + switchMap(({touches}) => { + const {screenY} = touches[0]; + const {scrollTop} = element; + + return concat( + // Sometimes touch is triggered without scroll in iOS, filter that + zip(touchmove$, scroll$).pipe( + map(([{touches}]) => scrollTop + screenY - touches[0].screenY), + takeUntil(touchend$), + ), + scroll$, + ); + }), + ), + ); + + return concat(scroll$.pipe(take(1)), result$).pipe(tuiZonefree(zone), share()); +} diff --git a/projects/legacy/components/sheet/directives/sheet-top/sheet-top.directive.ts b/projects/legacy/components/sheet/directives/sheet-top/sheet-top.directive.ts index 3036f82a6821..9256aabb3f9d 100644 --- a/projects/legacy/components/sheet/directives/sheet-top/sheet-top.directive.ts +++ b/projects/legacy/components/sheet/directives/sheet-top/sheet-top.directive.ts @@ -24,19 +24,18 @@ export class TuiSheetTopDirective { private readonly component = inject(TUI_SHEET); private readonly win = inject(WINDOW); - @Input('tuiSheetTop') - public stop = 0; - + protected readonly rounded$ = this.scroll$.pipe(map(y => y < this.stop + OFFSET)); protected readonly transform$ = this.scroll$.pipe( map(y => `translateY(${this.getY(y)}%) scaleX(-1)`), ); - protected readonly rounded$ = this.scroll$.pipe(map(y => y < this.stop + OFFSET)); - protected readonly clickthrough$ = this.scroll$.pipe( map(y => !!Math.round(this.getY(y))), ); + @Input('tuiSheetTop') + public stop = 0; + private getY(scrollTop: number): number { const value = scrollTop - this.stop; const total = this.win.innerHeight - this.component.item.offset - this.stop; diff --git a/projects/legacy/components/sheet/index.ts b/projects/legacy/components/sheet/index.ts index fd8b1655913a..17ff212dce0e 100644 --- a/projects/legacy/components/sheet/index.ts +++ b/projects/legacy/components/sheet/index.ts @@ -7,7 +7,6 @@ export * from './directives/sheet-close/sheet-close.directive'; export * from './directives/sheet-stop/sheet-stop.directive'; export * from './directives/sheet-top/sheet-top.directive'; export * from './directives/sheet-wrapper/sheet-wrapper.directive'; -export * from './ios.hacks'; export * from './sheet'; export * from './sheet.directive'; export * from './sheet.module'; diff --git a/projects/legacy/components/sheet/ios.hacks.ts b/projects/legacy/components/sheet/ios.hacks.ts deleted file mode 100644 index d396c745b3c3..000000000000 --- a/projects/legacy/components/sheet/ios.hacks.ts +++ /dev/null @@ -1,42 +0,0 @@ -import type {NgZone} from '@angular/core'; -import {tuiTypedFromEvent, tuiZonefree} from '@taiga-ui/cdk'; -import type {Observable} from 'rxjs'; -import {concat, delay, map, merge, share, switchMap, take, takeUntil, zip} from 'rxjs'; - -// eslint-disable-next-line @typescript-eslint/naming-convention -export function iosScrollFactory( - element: HTMLElement, - doc: Document, - zone: NgZone, -): Observable { - const load$ = tuiTypedFromEvent(element, 'load', {capture: true}); - const touchstart$ = tuiTypedFromEvent(element, 'touchstart', {passive: true}); - const touchmove$ = tuiTypedFromEvent(doc, 'touchmove', {passive: true}); - const touchend$ = tuiTypedFromEvent(doc, 'touchend'); - const scroll$ = tuiTypedFromEvent(element, 'scroll').pipe( - map(() => element.scrollTop), - ); - const result$ = merge( - load$.pipe( - delay(0), - map(() => element.scrollTop), - ), - touchstart$.pipe( - switchMap(({touches}) => { - const {screenY} = touches[0]; - const {scrollTop} = element; - - return concat( - // Sometimes touch is triggered without scroll in iOS, filter that - zip(touchmove$, scroll$).pipe( - map(([{touches}]) => scrollTop + screenY - touches[0].screenY), - takeUntil(touchend$), - ), - scroll$, - ); - }), - ), - ); - - return concat(scroll$.pipe(take(1)), result$).pipe(tuiZonefree(zone), share()); -} diff --git a/projects/legacy/components/tag/tag.component.ts b/projects/legacy/components/tag/tag.component.ts index 0fcbb25630c5..b389931f2952 100644 --- a/projects/legacy/components/tag/tag.component.ts +++ b/projects/legacy/components/tag/tag.component.ts @@ -28,6 +28,12 @@ export class TuiTagComponent { private readonly el = tuiInjectElement(); private readonly options = inject(TUI_TAG_OPTIONS); + @HostBinding('class._editing') + protected editing = false; + + protected readonly icons = inject(TUI_COMMON_ICONS); + protected editedText: string | null = null; + // TODO: Possibly implement standard focus mechanisms and outline @Input() public value = ''; @@ -73,13 +79,6 @@ export class TuiTagComponent { @Output() public readonly edited = new EventEmitter(); - @HostBinding('class._editing') - protected editing = false; - - protected readonly icons = inject(TUI_COMMON_ICONS); - - protected editedText: string | null = null; - @ViewChild('input', {read: ElementRef}) protected set input(input: ElementRef) { if (input) { diff --git a/projects/legacy/components/textarea/textarea.component.ts b/projects/legacy/components/textarea/textarea.component.ts index e89d337267a7..08d6aee7c442 100644 --- a/projects/legacy/components/textarea/textarea.component.ts +++ b/projects/legacy/components/textarea/textarea.component.ts @@ -56,6 +56,10 @@ export class TuiTextareaComponent @ContentChild(TuiTextfieldLegacyComponent, {read: ElementRef}) private readonly textfield?: ElementRef; + protected readonly isIOS = inject(TUI_IS_IOS); + protected readonly controller = inject(TUI_TEXTFIELD_WATCHED_CONTROLLER); + protected readonly hintOptions = inject(TuiHintOptionsDirective, {optional: true}); + @Input() public rows = DEFAULT_ROWS; @@ -66,10 +70,6 @@ export class TuiTextareaComponent @HostBinding('class._expandable') public expandable = false; - protected readonly isIOS = inject(TUI_IS_IOS); - protected readonly controller = inject(TUI_TEXTFIELD_WATCHED_CONTROLLER); - protected readonly hintOptions = inject(TuiHintOptionsDirective, {optional: true}); - public get nativeFocusableElement(): HTMLTextAreaElement | null { if (this.computedDisabled) { return null;