diff --git a/package-lock.json b/package-lock.json index 396cfe0f988..77383623f24 100644 --- a/package-lock.json +++ b/package-lock.json @@ -9,17 +9,17 @@ "version": "0.0.0", "hasInstallScript": true, "dependencies": { - "@angular/animations": "^20.0.0", - "@angular/common": "^20.0.0", - "@angular/compiler": "^20.0.0", - "@angular/core": "^20.0.0", - "@angular/elements": "^20.0.0", - "@angular/forms": "^20.0.0", - "@angular/platform-browser": "^20.0.0", - "@angular/platform-browser-dynamic": "^20.0.0", - "@angular/platform-server": "^20.0.0", - "@angular/router": "^20.0.0", - "@angular/ssr": "^20.0.0", + "@angular/animations": "^20.1.0", + "@angular/common": "^20.1.0", + "@angular/compiler": "^20.1.0", + "@angular/core": "^20.1.0", + "@angular/elements": "^20.1.0", + "@angular/forms": "^20.1.0", + "@angular/platform-browser": "^20.1.0", + "@angular/platform-browser-dynamic": "^20.1.0", + "@angular/platform-server": "^20.1.0", + "@angular/router": "^20.1.0", + "@angular/ssr": "^20.1.0", "@igniteui/material-icons-extended": "^3.1.0", "@lit-labs/ssr-dom-shim": "^1.3.0", "@types/source-map": "0.5.2", @@ -33,16 +33,16 @@ "zone.js": "~0.15.0" }, "devDependencies": { - "@angular-devkit/schematics": "^20.0.0", - "@angular-eslint/builder": "^19.6.0", - "@angular-eslint/eslint-plugin": "^19.6.0", - "@angular-eslint/eslint-plugin-template": "^19.6.0", - "@angular-eslint/schematics": "^19.6.0", - "@angular-eslint/template-parser": "^19.6.0", - "@angular/build": "^20.0.0", - "@angular/cli": "^20.0.0", - "@angular/compiler-cli": "^20.0.0", - "@angular/language-service": "^20.0.0", + "@angular-devkit/schematics": "^20.1.0", + "@angular-eslint/builder": "^20.1.1", + "@angular-eslint/eslint-plugin": "^20.1.1", + "@angular-eslint/eslint-plugin-template": "^20.1.1", + "@angular-eslint/schematics": "^20.1.1", + "@angular-eslint/template-parser": "^20.1.1", + "@angular/build": "^20.1.0", + "@angular/cli": "^20.1.0", + "@angular/compiler-cli": "^20.1.0", + "@angular/language-service": "^20.1.0", "@angularclass/hmr": "^3.0.0", "@microsoft/signalr": "^7.0.12", "@types/estree": "^1.0.0", @@ -53,11 +53,11 @@ "@types/node": "^20.17.6", "@types/sass-true": "^6.0.2", "@types/webpack-env": "^1.18.3", - "@typescript-eslint/eslint-plugin": "^8.15.0", - "@typescript-eslint/parser": "^8.15.0", + "@typescript-eslint/eslint-plugin": "^8.33.1", + "@typescript-eslint/parser": "^8.33.1", "autoprefixer": "^10.4.16", "del": "^6.0.0", - "eslint": "^9.15.0", + "eslint": "^9.28.0", "fs-extra": "^11.3.0", "globby": "^13.2.2", "gulp": "^5.0.0", @@ -123,63 +123,25 @@ } }, "node_modules/@angular-devkit/architect": { - "version": "0.1902.14", - "resolved": "https://registry.npmjs.org/@angular-devkit/architect/-/architect-0.1902.14.tgz", - "integrity": "sha512-rgMkqOrxedzqLZ8w59T/0YrpWt7LDmGwt+ZhNHE7cn27jZ876yGC2Bhcn58YZh2+R03WEJ9q0ePblaBYz03SMw==", - "dev": true, - "license": "MIT", - "dependencies": { - "@angular-devkit/core": "19.2.14", - "rxjs": "7.8.1" - }, - "engines": { - "node": "^18.19.1 || ^20.11.1 || >=22.0.0", - "npm": "^6.11.0 || ^7.5.6 || >=8.0.0", - "yarn": ">= 1.13.0" - } - }, - "node_modules/@angular-devkit/architect/node_modules/@angular-devkit/core": { - "version": "19.2.14", - "resolved": "https://registry.npmjs.org/@angular-devkit/core/-/core-19.2.14.tgz", - "integrity": "sha512-aaPEnRNIBoYT4XrrYcZlHadX8vFDTUR+4wUgcmr0cNDLeWzWtoPFeVq8TQD6kFDeqovSx/UVEblGgg/28WvHyg==", + "version": "0.2001.0", + "resolved": "https://registry.npmjs.org/@angular-devkit/architect/-/architect-0.2001.0.tgz", + "integrity": "sha512-IDBG+YP0nPaA/tIjtJ1ZPh0VEfbxSn0yCvbS7dTfqyrnmanPUFpU5qsT9vJTU6yzkuzBEhNFRzkUCQaUAziLRA==", "dev": true, "license": "MIT", "dependencies": { - "ajv": "8.17.1", - "ajv-formats": "3.0.1", - "jsonc-parser": "3.3.1", - "picomatch": "4.0.2", - "rxjs": "7.8.1", - "source-map": "0.7.4" + "@angular-devkit/core": "20.1.0", + "rxjs": "7.8.2" }, "engines": { - "node": "^18.19.1 || ^20.11.1 || >=22.0.0", + "node": "^20.19.0 || ^22.12.0 || >=24.0.0", "npm": "^6.11.0 || ^7.5.6 || >=8.0.0", "yarn": ">= 1.13.0" - }, - "peerDependencies": { - "chokidar": "^4.0.0" - }, - "peerDependenciesMeta": { - "chokidar": { - "optional": true - } - } - }, - "node_modules/@angular-devkit/architect/node_modules/rxjs": { - "version": "7.8.1", - "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-7.8.1.tgz", - "integrity": "sha512-AA3TVj+0A2iuIoQkWEK/tqFjBq2j+6PO6Y0zJcvzLAFhEFIO3HL0vls9hWLncZbAAbK0mar7oZ4V079I/qPMxg==", - "dev": true, - "license": "Apache-2.0", - "dependencies": { - "tslib": "^2.1.0" } }, "node_modules/@angular-devkit/core": { - "version": "20.0.0", - "resolved": "https://registry.npmjs.org/@angular-devkit/core/-/core-20.0.0.tgz", - "integrity": "sha512-cnB/I1QQC3WoIcb+f/7hknOOkgIFjAuxd7nW1RnS+pn0qQTWyjnXjq2jocx2TBMwZRikycc7f3mlA1DgWzJUuQ==", + "version": "20.1.0", + "resolved": "https://registry.npmjs.org/@angular-devkit/core/-/core-20.1.0.tgz", + "integrity": "sha512-i2t22bklvKsqdwmUtjXltRyxmJ+lJW8isrdc7XeN0N6VW/lDHSJqFlucT1+pO9+FxXJQyz3Hc1dpRd6G65mGyw==", "dev": true, "license": "MIT", "dependencies": { @@ -205,13 +167,13 @@ } }, "node_modules/@angular-devkit/schematics": { - "version": "20.0.0", - "resolved": "https://registry.npmjs.org/@angular-devkit/schematics/-/schematics-20.0.0.tgz", - "integrity": "sha512-35WbWP8ARnaqVjOzy7IOyWsY/jeyUqfVj4KgHG2O4fHAhIhaBqhP8dDDP+SwM+bToIqklg0fzHUUhFTRxzzyoQ==", + "version": "20.1.0", + "resolved": "https://registry.npmjs.org/@angular-devkit/schematics/-/schematics-20.1.0.tgz", + "integrity": "sha512-0UtJAptrqsfABi0DxrY7cyvlGe5kHRiqVwB+h3g2DEv3ikXKZh1dOFR3o2bK+sVhUqgFaV8qgSnCmR9a48xY0g==", "dev": true, "license": "MIT", "dependencies": { - "@angular-devkit/core": "20.0.0", + "@angular-devkit/core": "20.1.0", "jsonc-parser": "3.3.1", "magic-string": "0.30.17", "ora": "8.2.0", @@ -224,74 +186,37 @@ } }, "node_modules/@angular-eslint/builder": { - "version": "19.6.0", - "resolved": "https://registry.npmjs.org/@angular-eslint/builder/-/builder-19.6.0.tgz", - "integrity": "sha512-hUdYS1mSB09b5ABi2tuWeMTVprYHW+x6KmeAFJfXC6aMOa4NYQBdetIjOLwr7qUDlq1S/+2+HiX/FO76FPHClw==", + "version": "20.1.1", + "resolved": "https://registry.npmjs.org/@angular-eslint/builder/-/builder-20.1.1.tgz", + "integrity": "sha512-pfCYfocX79CZ5nokZF4gVScUGyLWRKQHZsUkQ5V/1hsaGsahvzDRjxsYz0J9rO0ligSa2pwgUCXEwSY8hhHQBw==", "dev": true, "license": "MIT", "dependencies": { - "@angular-devkit/architect": ">= 0.1900.0 < 0.2000.0", - "@angular-devkit/core": ">= 19.0.0 < 20.0.0" + "@angular-devkit/architect": ">= 0.2000.0 < 0.2100.0", + "@angular-devkit/core": ">= 20.0.0 < 21.0.0" }, "peerDependencies": { "eslint": "^8.57.0 || ^9.0.0", "typescript": "*" } }, - "node_modules/@angular-eslint/builder/node_modules/@angular-devkit/core": { - "version": "19.2.14", - "resolved": "https://registry.npmjs.org/@angular-devkit/core/-/core-19.2.14.tgz", - "integrity": "sha512-aaPEnRNIBoYT4XrrYcZlHadX8vFDTUR+4wUgcmr0cNDLeWzWtoPFeVq8TQD6kFDeqovSx/UVEblGgg/28WvHyg==", - "dev": true, - "license": "MIT", - "dependencies": { - "ajv": "8.17.1", - "ajv-formats": "3.0.1", - "jsonc-parser": "3.3.1", - "picomatch": "4.0.2", - "rxjs": "7.8.1", - "source-map": "0.7.4" - }, - "engines": { - "node": "^18.19.1 || ^20.11.1 || >=22.0.0", - "npm": "^6.11.0 || ^7.5.6 || >=8.0.0", - "yarn": ">= 1.13.0" - }, - "peerDependencies": { - "chokidar": "^4.0.0" - }, - "peerDependenciesMeta": { - "chokidar": { - "optional": true - } - } - }, - "node_modules/@angular-eslint/builder/node_modules/rxjs": { - "version": "7.8.1", - "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-7.8.1.tgz", - "integrity": "sha512-AA3TVj+0A2iuIoQkWEK/tqFjBq2j+6PO6Y0zJcvzLAFhEFIO3HL0vls9hWLncZbAAbK0mar7oZ4V079I/qPMxg==", - "dev": true, - "license": "Apache-2.0", - "dependencies": { - "tslib": "^2.1.0" - } - }, "node_modules/@angular-eslint/bundled-angular-compiler": { - "version": "19.6.0", - "resolved": "https://registry.npmjs.org/@angular-eslint/bundled-angular-compiler/-/bundled-angular-compiler-19.6.0.tgz", - "integrity": "sha512-ro+seaTAg5GvtJ72uWEEnP9J5mT0vtgdqH6YMrmMt4pZbSZxvkLfLjZGkXo/HjVDVcCjPnmZeMwKN+uoEc27Jg==", + "version": "20.1.1", + "resolved": "https://registry.npmjs.org/@angular-eslint/bundled-angular-compiler/-/bundled-angular-compiler-20.1.1.tgz", + "integrity": "sha512-hEWh/upyTj2bhyRmbNnGtlOXhBSEHwLg8/9YYhwmiNApQwKcvcg7lkstZMEVrKievNHZT6Wh4dWZvjRjMqLNSg==", "dev": true, "license": "MIT" }, "node_modules/@angular-eslint/eslint-plugin": { - "version": "19.6.0", - "resolved": "https://registry.npmjs.org/@angular-eslint/eslint-plugin/-/eslint-plugin-19.6.0.tgz", - "integrity": "sha512-IOMfFi/rPNrPwxZwIGTqWw0C5pC2Facwg3llmJoQFq8w2sUE0nNBL5uSQv5dT8s6ucum4g+RFNYHNe20SEOvRw==", + "version": "20.1.1", + "resolved": "https://registry.npmjs.org/@angular-eslint/eslint-plugin/-/eslint-plugin-20.1.1.tgz", + "integrity": "sha512-h+D6T35UGIuG0keYPH7dc6OTdfTVJ8GoIhCIpoAmVGhdIdfXIISvDvvX/QPiZtTcefik3vEZEGRiI/Nzc5xImw==", "dev": true, "license": "MIT", "dependencies": { - "@angular-eslint/bundled-angular-compiler": "19.6.0", - "@angular-eslint/utils": "19.6.0" + "@angular-eslint/bundled-angular-compiler": "20.1.1", + "@angular-eslint/utils": "20.1.1", + "ts-api-utils": "^2.1.0" }, "peerDependencies": { "@typescript-eslint/utils": "^7.11.0 || ^8.0.0", @@ -300,18 +225,19 @@ } }, "node_modules/@angular-eslint/eslint-plugin-template": { - "version": "19.6.0", - "resolved": "https://registry.npmjs.org/@angular-eslint/eslint-plugin-template/-/eslint-plugin-template-19.6.0.tgz", - "integrity": "sha512-SDGbNSCUuPmqVesy5SvRE2MV7AKvvA/bVJwL9Fz5KYCHYxJz1rrJ8FknjWAfmg0qO2TMs1ZI9hov8JL+Bc4BBw==", + "version": "20.1.1", + "resolved": "https://registry.npmjs.org/@angular-eslint/eslint-plugin-template/-/eslint-plugin-template-20.1.1.tgz", + "integrity": "sha512-dRqfxYvgOC4DZqvRTmxoIUMeIqTzcIkRcMVEuP8qvR10KHAWDkV7xT4f7BAee9deI/lzoAk3tk5wkQg6POQo7Q==", "dev": true, "license": "MIT", "dependencies": { - "@angular-eslint/bundled-angular-compiler": "19.6.0", - "@angular-eslint/utils": "19.6.0", + "@angular-eslint/bundled-angular-compiler": "20.1.1", + "@angular-eslint/utils": "20.1.1", "aria-query": "5.3.2", "axobject-query": "4.1.0" }, "peerDependencies": { + "@angular-eslint/template-parser": "20.1.1", "@typescript-eslint/types": "^7.11.0 || ^8.0.0", "@typescript-eslint/utils": "^7.11.0 || ^8.0.0", "eslint": "^8.57.0 || ^9.0.0", @@ -319,260 +245,29 @@ } }, "node_modules/@angular-eslint/schematics": { - "version": "19.6.0", - "resolved": "https://registry.npmjs.org/@angular-eslint/schematics/-/schematics-19.6.0.tgz", - "integrity": "sha512-lJzwHju7bhJ3p+SZnY0JVwGjxF2q68gUdOYhdU62pglfYkS5lm+A5LM/VznRvdpZOH69vvZ9gizQ8W1P525cdw==", + "version": "20.1.1", + "resolved": "https://registry.npmjs.org/@angular-eslint/schematics/-/schematics-20.1.1.tgz", + "integrity": "sha512-4sXU0Gr/RhdW3xSBFRzjhTO9mk6ugXUhUIPc1FRta1pmNnbmkvx22ewnKZE8IeRl8PMyk6xJuxZHq19CW1oWOA==", "dev": true, "license": "MIT", "dependencies": { - "@angular-devkit/core": ">= 19.0.0 < 20.0.0", - "@angular-devkit/schematics": ">= 19.0.0 < 20.0.0", - "@angular-eslint/eslint-plugin": "19.6.0", - "@angular-eslint/eslint-plugin-template": "19.6.0", - "ignore": "7.0.4", + "@angular-devkit/core": ">= 20.0.0 < 21.0.0", + "@angular-devkit/schematics": ">= 20.0.0 < 21.0.0", + "@angular-eslint/eslint-plugin": "20.1.1", + "@angular-eslint/eslint-plugin-template": "20.1.1", + "ignore": "7.0.5", "semver": "7.7.2", "strip-json-comments": "3.1.1" } }, - "node_modules/@angular-eslint/schematics/node_modules/@angular-devkit/core": { - "version": "19.2.14", - "resolved": "https://registry.npmjs.org/@angular-devkit/core/-/core-19.2.14.tgz", - "integrity": "sha512-aaPEnRNIBoYT4XrrYcZlHadX8vFDTUR+4wUgcmr0cNDLeWzWtoPFeVq8TQD6kFDeqovSx/UVEblGgg/28WvHyg==", - "dev": true, - "license": "MIT", - "dependencies": { - "ajv": "8.17.1", - "ajv-formats": "3.0.1", - "jsonc-parser": "3.3.1", - "picomatch": "4.0.2", - "rxjs": "7.8.1", - "source-map": "0.7.4" - }, - "engines": { - "node": "^18.19.1 || ^20.11.1 || >=22.0.0", - "npm": "^6.11.0 || ^7.5.6 || >=8.0.0", - "yarn": ">= 1.13.0" - }, - "peerDependencies": { - "chokidar": "^4.0.0" - }, - "peerDependenciesMeta": { - "chokidar": { - "optional": true - } - } - }, - "node_modules/@angular-eslint/schematics/node_modules/@angular-devkit/schematics": { - "version": "19.2.14", - "resolved": "https://registry.npmjs.org/@angular-devkit/schematics/-/schematics-19.2.14.tgz", - "integrity": "sha512-s89/MWXHy8+GP/cRfFbSECIG3FQQQwNVv44OOmghPVgKQgQ+EoE/zygL2hqKYTUPoPaS/IhNXdXjSE5pS9yLeg==", - "dev": true, - "license": "MIT", - "dependencies": { - "@angular-devkit/core": "19.2.14", - "jsonc-parser": "3.3.1", - "magic-string": "0.30.17", - "ora": "5.4.1", - "rxjs": "7.8.1" - }, - "engines": { - "node": "^18.19.1 || ^20.11.1 || >=22.0.0", - "npm": "^6.11.0 || ^7.5.6 || >=8.0.0", - "yarn": ">= 1.13.0" - } - }, - "node_modules/@angular-eslint/schematics/node_modules/ansi-regex": { - "version": "5.0.1", - "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz", - "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==", - "dev": true, - "license": "MIT", - "engines": { - "node": ">=8" - } - }, - "node_modules/@angular-eslint/schematics/node_modules/bl": { - "version": "4.1.0", - "resolved": "https://registry.npmjs.org/bl/-/bl-4.1.0.tgz", - "integrity": "sha512-1W07cM9gS6DcLperZfFSj+bWLtaPGSOHWhPiGzXmvVJbRLdG82sH/Kn8EtW1VqWVA54AKf2h5k5BbnIbwF3h6w==", - "dev": true, - "license": "MIT", - "dependencies": { - "buffer": "^5.5.0", - "inherits": "^2.0.4", - "readable-stream": "^3.4.0" - } - }, - "node_modules/@angular-eslint/schematics/node_modules/buffer": { - "version": "5.7.1", - "resolved": "https://registry.npmjs.org/buffer/-/buffer-5.7.1.tgz", - "integrity": "sha512-EHcyIPBQ4BSGlvjB16k5KgAJ27CIsHY/2JBmCRReo48y9rQ3MaUzWX3KVlBa4U7MyX02HdVj0K7C3WaB3ju7FQ==", - "dev": true, - "funding": [ - { - "type": "github", - "url": "https://github.com/sponsors/feross" - }, - { - "type": "patreon", - "url": "https://www.patreon.com/feross" - }, - { - "type": "consulting", - "url": "https://feross.org/support" - } - ], - "license": "MIT", - "dependencies": { - "base64-js": "^1.3.1", - "ieee754": "^1.1.13" - } - }, - "node_modules/@angular-eslint/schematics/node_modules/cli-cursor": { - "version": "3.1.0", - "resolved": "https://registry.npmjs.org/cli-cursor/-/cli-cursor-3.1.0.tgz", - "integrity": "sha512-I/zHAwsKf9FqGoXM4WWRACob9+SNukZTd94DWF57E4toouRulbCxcUh6RKUEOQlYTHJnzkPMySvPNaaSLNfLZw==", - "dev": true, - "license": "MIT", - "dependencies": { - "restore-cursor": "^3.1.0" - }, - "engines": { - "node": ">=8" - } - }, - "node_modules/@angular-eslint/schematics/node_modules/is-interactive": { - "version": "1.0.0", - "resolved": "https://registry.npmjs.org/is-interactive/-/is-interactive-1.0.0.tgz", - "integrity": "sha512-2HvIEKRoqS62guEC+qBjpvRubdX910WCMuJTZ+I9yvqKU2/12eSL549HMwtabb4oupdj2sMP50k+XJfB/8JE6w==", - "dev": true, - "license": "MIT", - "engines": { - "node": ">=8" - } - }, - "node_modules/@angular-eslint/schematics/node_modules/is-unicode-supported": { - "version": "0.1.0", - "resolved": "https://registry.npmjs.org/is-unicode-supported/-/is-unicode-supported-0.1.0.tgz", - "integrity": "sha512-knxG2q4UC3u8stRGyAVJCOdxFmv5DZiRcdlIaAQXAbSfJya+OhopNotLQrstBhququ4ZpuKbDc/8S6mgXgPFPw==", - "dev": true, - "license": "MIT", - "engines": { - "node": ">=10" - }, - "funding": { - "url": "https://github.com/sponsors/sindresorhus" - } - }, - "node_modules/@angular-eslint/schematics/node_modules/log-symbols": { - "version": "4.1.0", - "resolved": "https://registry.npmjs.org/log-symbols/-/log-symbols-4.1.0.tgz", - "integrity": "sha512-8XPvpAA8uyhfteu8pIvQxpJZ7SYYdpUivZpGy6sFsBuKRY/7rQGavedeB8aK+Zkyq6upMFVL/9AW6vOYzfRyLg==", - "dev": true, - "license": "MIT", - "dependencies": { - "chalk": "^4.1.0", - "is-unicode-supported": "^0.1.0" - }, - "engines": { - "node": ">=10" - }, - "funding": { - "url": "https://github.com/sponsors/sindresorhus" - } - }, - "node_modules/@angular-eslint/schematics/node_modules/onetime": { - "version": "5.1.2", - "resolved": "https://registry.npmjs.org/onetime/-/onetime-5.1.2.tgz", - "integrity": "sha512-kbpaSSGJTWdAY5KPVeMOKXSrPtr8C8C7wodJbcsd51jRnmD+GZu8Y0VoU6Dm5Z4vWr0Ig/1NKuWRKf7j5aaYSg==", - "dev": true, - "license": "MIT", - "dependencies": { - "mimic-fn": "^2.1.0" - }, - "engines": { - "node": ">=6" - }, - "funding": { - "url": "https://github.com/sponsors/sindresorhus" - } - }, - "node_modules/@angular-eslint/schematics/node_modules/ora": { - "version": "5.4.1", - "resolved": "https://registry.npmjs.org/ora/-/ora-5.4.1.tgz", - "integrity": "sha512-5b6Y85tPxZZ7QytO+BQzysW31HJku27cRIlkbAXaNx+BdcVi+LlRFmVXzeF6a7JCwJpyw5c4b+YSVImQIrBpuQ==", - "dev": true, - "license": "MIT", - "dependencies": { - "bl": "^4.1.0", - "chalk": "^4.1.0", - "cli-cursor": "^3.1.0", - "cli-spinners": "^2.5.0", - "is-interactive": "^1.0.0", - "is-unicode-supported": "^0.1.0", - "log-symbols": "^4.1.0", - "strip-ansi": "^6.0.0", - "wcwidth": "^1.0.1" - }, - "engines": { - "node": ">=10" - }, - "funding": { - "url": "https://github.com/sponsors/sindresorhus" - } - }, - "node_modules/@angular-eslint/schematics/node_modules/restore-cursor": { - "version": "3.1.0", - "resolved": "https://registry.npmjs.org/restore-cursor/-/restore-cursor-3.1.0.tgz", - "integrity": "sha512-l+sSefzHpj5qimhFSE5a8nufZYAM3sBSVMAPtYkmC+4EH2anSGaEMXSD0izRQbu9nfyQ9y5JrVmp7E8oZrUjvA==", - "dev": true, - "license": "MIT", - "dependencies": { - "onetime": "^5.1.0", - "signal-exit": "^3.0.2" - }, - "engines": { - "node": ">=8" - } - }, - "node_modules/@angular-eslint/schematics/node_modules/rxjs": { - "version": "7.8.1", - "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-7.8.1.tgz", - "integrity": "sha512-AA3TVj+0A2iuIoQkWEK/tqFjBq2j+6PO6Y0zJcvzLAFhEFIO3HL0vls9hWLncZbAAbK0mar7oZ4V079I/qPMxg==", - "dev": true, - "license": "Apache-2.0", - "dependencies": { - "tslib": "^2.1.0" - } - }, - "node_modules/@angular-eslint/schematics/node_modules/signal-exit": { - "version": "3.0.7", - "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-3.0.7.tgz", - "integrity": "sha512-wnD2ZE+l+SPC/uoS0vXeE9L1+0wuaMqKlfz9AMUo38JsyLSBWSFcHR1Rri62LZc12vLr1gb3jl7iwQhgwpAbGQ==", - "dev": true, - "license": "ISC" - }, - "node_modules/@angular-eslint/schematics/node_modules/strip-ansi": { - "version": "6.0.1", - "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz", - "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==", - "dev": true, - "license": "MIT", - "dependencies": { - "ansi-regex": "^5.0.1" - }, - "engines": { - "node": ">=8" - } - }, "node_modules/@angular-eslint/template-parser": { - "version": "19.6.0", - "resolved": "https://registry.npmjs.org/@angular-eslint/template-parser/-/template-parser-19.6.0.tgz", - "integrity": "sha512-NGxXUZkI5lXjoKnmL51C8DoJx8AjwF9sonieC2EVxgXycK2MYAamFWYGHMiVemzFsg1nIv+JvhHITgjSjyC3HQ==", + "version": "20.1.1", + "resolved": "https://registry.npmjs.org/@angular-eslint/template-parser/-/template-parser-20.1.1.tgz", + "integrity": "sha512-giIMYORf8P8MbBxh6EUfiR/7Y+omxJtK2C7a8lYTtLSOIGO0D8c8hXx9hTlPcdupVX+xZXDuZ85c9JDen+JSSA==", "dev": true, "license": "MIT", "dependencies": { - "@angular-eslint/bundled-angular-compiler": "19.6.0", + "@angular-eslint/bundled-angular-compiler": "20.1.1", "eslint-scope": "^8.0.2" }, "peerDependencies": { @@ -581,13 +276,13 @@ } }, "node_modules/@angular-eslint/utils": { - "version": "19.6.0", - "resolved": "https://registry.npmjs.org/@angular-eslint/utils/-/utils-19.6.0.tgz", - "integrity": "sha512-ygtsmRKHNqrzG2mpUj1XwLNRoG+ikYkizsOuq5xPRM8o6dCw03H5eel4s7hnXT4c09WbpnoaVNi9O3xFLIETJQ==", + "version": "20.1.1", + "resolved": "https://registry.npmjs.org/@angular-eslint/utils/-/utils-20.1.1.tgz", + "integrity": "sha512-hqbzGqa/0Ua90r4TMn4oZVnLuwIF6dqEfH7SlstB224h/7+nKoi67aHkmUq7VItWXpDDe+f1opeR01GKS9fNog==", "dev": true, "license": "MIT", "dependencies": { - "@angular-eslint/bundled-angular-compiler": "19.6.0" + "@angular-eslint/bundled-angular-compiler": "20.1.1" }, "peerDependencies": { "@typescript-eslint/utils": "^7.11.0 || ^8.0.0", @@ -596,9 +291,9 @@ } }, "node_modules/@angular/animations": { - "version": "20.0.0", - "resolved": "https://registry.npmjs.org/@angular/animations/-/animations-20.0.0.tgz", - "integrity": "sha512-yU4hUH6AheY0dnMSaLRMfgnXhg/JUSUvrhE+lHzIiSKdEf0lyo1Ri6bkPD1CbamxZ94BqhRNCApvbvTbibGICQ==", + "version": "20.1.0", + "resolved": "https://registry.npmjs.org/@angular/animations/-/animations-20.1.0.tgz", + "integrity": "sha512-5ILngsvu5VPQYaIm7lRyegZaDaAEtLUIPSS8h1dzWPaCxBIJ4uwzx9RDMiF32zhbxi+q0mAO2w2FdDlzWTT3og==", "license": "MIT", "dependencies": { "tslib": "^2.3.0" @@ -607,24 +302,24 @@ "node": "^20.19.0 || ^22.12.0 || >=24.0.0" }, "peerDependencies": { - "@angular/common": "20.0.0", - "@angular/core": "20.0.0" + "@angular/common": "20.1.0", + "@angular/core": "20.1.0" } }, "node_modules/@angular/build": { - "version": "20.0.0", - "resolved": "https://registry.npmjs.org/@angular/build/-/build-20.0.0.tgz", - "integrity": "sha512-b/FAvvUbsMEgr+UlvTtDz4NCv+BFi+55swtKRmaritvZ2rDfhF1x9tUmSkT6GebGXkI/Gg0kl5rJoD5iv5lY3A==", + "version": "20.1.0", + "resolved": "https://registry.npmjs.org/@angular/build/-/build-20.1.0.tgz", + "integrity": "sha512-Sl4rkq5PQIrbVNk8cXx2JQhQ156H4bXLvfAYpgXPHAfSfbIIzaV25LJIfTdWSEjMzBGdIX5E0Vpi0SGwcNS7Uw==", "dev": true, "license": "MIT", "dependencies": { "@ampproject/remapping": "2.3.0", - "@angular-devkit/architect": "0.2000.0", - "@babel/core": "7.27.1", - "@babel/helper-annotate-as-pure": "7.27.1", + "@angular-devkit/architect": "0.2001.0", + "@babel/core": "7.27.7", + "@babel/helper-annotate-as-pure": "7.27.3", "@babel/helper-split-export-declaration": "7.24.7", - "@inquirer/confirm": "5.1.10", - "@vitejs/plugin-basic-ssl": "2.0.0", + "@inquirer/confirm": "5.1.13", + "@vitejs/plugin-basic-ssl": "2.1.0", "beasties": "0.3.4", "browserslist": "^4.23.0", "esbuild": "0.25.5", @@ -636,14 +331,14 @@ "mrmime": "2.0.1", "parse5-html-rewriting-stream": "7.1.0", "picomatch": "4.0.2", - "piscina": "5.0.0", - "rollup": "4.40.2", - "sass": "1.88.0", + "piscina": "5.1.2", + "rollup": "4.44.1", + "sass": "1.89.2", "semver": "7.7.2", "source-map-support": "0.5.21", - "tinyglobby": "0.2.13", - "vite": "6.3.5", - "watchpack": "2.4.2" + "tinyglobby": "0.2.14", + "vite": "7.0.0", + "watchpack": "2.4.4" }, "engines": { "node": "^20.19.0 || ^22.12.0 || >=24.0.0", @@ -651,7 +346,7 @@ "yarn": ">= 1.13.0" }, "optionalDependencies": { - "lmdb": "3.3.0" + "lmdb": "3.4.1" }, "peerDependencies": { "@angular/compiler": "^20.0.0", @@ -661,7 +356,7 @@ "@angular/platform-browser": "^20.0.0", "@angular/platform-server": "^20.0.0", "@angular/service-worker": "^20.0.0", - "@angular/ssr": "^20.0.0", + "@angular/ssr": "^20.1.0", "karma": "^6.4.0", "less": "^4.2.0", "ng-packagr": "^20.0.0", @@ -710,56 +405,164 @@ } } }, - "node_modules/@angular/build/node_modules/@angular-devkit/architect": { - "version": "0.2000.0", - "resolved": "https://registry.npmjs.org/@angular-devkit/architect/-/architect-0.2000.0.tgz", - "integrity": "sha512-6accOuvf1BY6hTO5LzYcxp2Dpl0bThgYF3KdwVWqrYF5+6PWfQLdy+rKxBiCIv0+0OngZVI79RuAtUKFowFM/A==", + "node_modules/@angular/build/node_modules/@babel/core": { + "version": "7.27.7", + "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.27.7.tgz", + "integrity": "sha512-BU2f9tlKQ5CAthiMIgpzAh4eDTLWo1mqi9jqE2OxMG0E/OM199VJt2q8BztTxpnSW0i1ymdwLXRJnYzvDM5r2w==", "dev": true, "license": "MIT", "dependencies": { - "@angular-devkit/core": "20.0.0", - "rxjs": "7.8.2" + "@ampproject/remapping": "^2.2.0", + "@babel/code-frame": "^7.27.1", + "@babel/generator": "^7.27.5", + "@babel/helper-compilation-targets": "^7.27.2", + "@babel/helper-module-transforms": "^7.27.3", + "@babel/helpers": "^7.27.6", + "@babel/parser": "^7.27.7", + "@babel/template": "^7.27.2", + "@babel/traverse": "^7.27.7", + "@babel/types": "^7.27.7", + "convert-source-map": "^2.0.0", + "debug": "^4.1.0", + "gensync": "^1.0.0-beta.2", + "json5": "^2.2.3", + "semver": "^6.3.1" }, "engines": { - "node": "^20.19.0 || ^22.12.0 || >=24.0.0", - "npm": "^6.11.0 || ^7.5.6 || >=8.0.0", - "yarn": ">= 1.13.0" + "node": ">=6.9.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/babel" } }, - "node_modules/@angular/build/node_modules/sass": { - "version": "1.88.0", - "resolved": "https://registry.npmjs.org/sass/-/sass-1.88.0.tgz", - "integrity": "sha512-sF6TWQqjFvr4JILXzG4ucGOLELkESHL+I5QJhh7CNaE+Yge0SI+ehCatsXhJ7ymU1hAFcIS3/PBpjdIbXoyVbg==", + "node_modules/@angular/build/node_modules/@babel/core/node_modules/semver": { + "version": "6.3.1", + "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz", + "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==", + "dev": true, + "license": "ISC", + "bin": { + "semver": "bin/semver.js" + } + }, + "node_modules/@angular/build/node_modules/@types/node": { + "version": "24.0.13", + "resolved": "https://registry.npmjs.org/@types/node/-/node-24.0.13.tgz", + "integrity": "sha512-Qm9OYVOFHFYg3wJoTSrz80hoec5Lia/dPp84do3X7dZvLikQvM1YpmvTBEdIr/e+U8HTkFjLHLnl78K/qjf+jQ==", "dev": true, "license": "MIT", + "optional": true, + "peer": true, "dependencies": { - "chokidar": "^4.0.0", - "immutable": "^5.0.2", - "source-map-js": ">=0.6.2 <2.0.0" + "undici-types": "~7.8.0" + } + }, + "node_modules/@angular/build/node_modules/convert-source-map": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-2.0.0.tgz", + "integrity": "sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==", + "dev": true, + "license": "MIT" + }, + "node_modules/@angular/build/node_modules/undici-types": { + "version": "7.8.0", + "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-7.8.0.tgz", + "integrity": "sha512-9UJ2xGDvQ43tYyVMpuHlsgApydB8ZKfVYTsLDhXkFL/6gfkp+U8xTGdh8pMJv1SpZna0zxG1DwsKZsreLbXBxw==", + "dev": true, + "license": "MIT", + "optional": true, + "peer": true + }, + "node_modules/@angular/build/node_modules/vite": { + "version": "7.0.0", + "resolved": "https://registry.npmjs.org/vite/-/vite-7.0.0.tgz", + "integrity": "sha512-ixXJB1YRgDIw2OszKQS9WxGHKwLdCsbQNkpJN171udl6szi/rIySHL6/Os3s2+oE4P/FLD4dxg4mD7Wust+u5g==", + "dev": true, + "license": "MIT", + "dependencies": { + "esbuild": "^0.25.0", + "fdir": "^6.4.6", + "picomatch": "^4.0.2", + "postcss": "^8.5.6", + "rollup": "^4.40.0", + "tinyglobby": "^0.2.14" }, "bin": { - "sass": "sass.js" + "vite": "bin/vite.js" }, "engines": { - "node": ">=14.0.0" + "node": "^20.19.0 || >=22.12.0" + }, + "funding": { + "url": "https://github.com/vitejs/vite?sponsor=1" }, "optionalDependencies": { - "@parcel/watcher": "^2.4.1" + "fsevents": "~2.3.3" + }, + "peerDependencies": { + "@types/node": "^20.19.0 || >=22.12.0", + "jiti": ">=1.21.0", + "less": "^4.0.0", + "lightningcss": "^1.21.0", + "sass": "^1.70.0", + "sass-embedded": "^1.70.0", + "stylus": ">=0.54.8", + "sugarss": "^5.0.0", + "terser": "^5.16.0", + "tsx": "^4.8.1", + "yaml": "^2.4.2" + }, + "peerDependenciesMeta": { + "@types/node": { + "optional": true + }, + "jiti": { + "optional": true + }, + "less": { + "optional": true + }, + "lightningcss": { + "optional": true + }, + "sass": { + "optional": true + }, + "sass-embedded": { + "optional": true + }, + "stylus": { + "optional": true + }, + "sugarss": { + "optional": true + }, + "terser": { + "optional": true + }, + "tsx": { + "optional": true + }, + "yaml": { + "optional": true + } } }, "node_modules/@angular/cli": { - "version": "20.0.0", - "resolved": "https://registry.npmjs.org/@angular/cli/-/cli-20.0.0.tgz", - "integrity": "sha512-k9EDaaLYTMWkBbayUh6Tf0PJ+E0e6jRPrjOSPsOJHRh+S5BsNdLIsKJmThGXkq2wnD35+2CKPy9UQyvfaIA5KQ==", + "version": "20.1.0", + "resolved": "https://registry.npmjs.org/@angular/cli/-/cli-20.1.0.tgz", + "integrity": "sha512-jZudpHlPVAvrywVZuhUkUr5K7ThW/6CPjT7qxZBSdOvu7cD49JPpDivCdlMh0kCBSHsJ0ZbLx35oi6zF8PegiA==", "dev": true, "license": "MIT", "dependencies": { - "@angular-devkit/architect": "0.2000.0", - "@angular-devkit/core": "20.0.0", - "@angular-devkit/schematics": "20.0.0", - "@inquirer/prompts": "7.5.1", + "@angular-devkit/architect": "0.2001.0", + "@angular-devkit/core": "20.1.0", + "@angular-devkit/schematics": "20.1.0", + "@inquirer/prompts": "7.6.0", "@listr2/prompt-adapter-inquirer": "2.0.22", - "@schematics/angular": "20.0.0", + "@modelcontextprotocol/sdk": "1.13.3", + "@schematics/angular": "20.1.0", "@yarnpkg/lockfile": "1.1.0", "ini": "5.0.0", "jsonc-parser": "3.3.1", @@ -769,7 +572,8 @@ "pacote": "21.0.0", "resolve": "1.22.10", "semver": "7.7.2", - "yargs": "17.7.2" + "yargs": "18.0.0", + "zod": "3.25.75" }, "bin": { "ng": "bin/ng.js" @@ -780,26 +584,109 @@ "yarn": ">= 1.13.0" } }, - "node_modules/@angular/cli/node_modules/@angular-devkit/architect": { - "version": "0.2000.0", - "resolved": "https://registry.npmjs.org/@angular-devkit/architect/-/architect-0.2000.0.tgz", - "integrity": "sha512-6accOuvf1BY6hTO5LzYcxp2Dpl0bThgYF3KdwVWqrYF5+6PWfQLdy+rKxBiCIv0+0OngZVI79RuAtUKFowFM/A==", + "node_modules/@angular/cli/node_modules/ansi-styles": { + "version": "6.2.1", + "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-6.2.1.tgz", + "integrity": "sha512-bN798gFfQX+viw3R7yrGWRqnrN2oRkEkUjjl4JNn4E8GxxbjtG3FbrEIIY3l8/hrwUwIeCZvi4QuOTP4MErVug==", "dev": true, "license": "MIT", + "engines": { + "node": ">=12" + }, + "funding": { + "url": "https://github.com/chalk/ansi-styles?sponsor=1" + } + }, + "node_modules/@angular/cli/node_modules/cliui": { + "version": "9.0.1", + "resolved": "https://registry.npmjs.org/cliui/-/cliui-9.0.1.tgz", + "integrity": "sha512-k7ndgKhwoQveBL+/1tqGJYNz097I7WOvwbmmU2AR5+magtbjPWQTS1C5vzGkBC8Ym8UWRzfKUzUUqFLypY4Q+w==", + "dev": true, + "license": "ISC", "dependencies": { - "@angular-devkit/core": "20.0.0", - "rxjs": "7.8.2" + "string-width": "^7.2.0", + "strip-ansi": "^7.1.0", + "wrap-ansi": "^9.0.0" }, "engines": { - "node": "^20.19.0 || ^22.12.0 || >=24.0.0", - "npm": "^6.11.0 || ^7.5.6 || >=8.0.0", - "yarn": ">= 1.13.0" + "node": ">=20" + } + }, + "node_modules/@angular/cli/node_modules/emoji-regex": { + "version": "10.4.0", + "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-10.4.0.tgz", + "integrity": "sha512-EC+0oUMY1Rqm4O6LLrgjtYDvcVYTy7chDnM4Q7030tP4Kwj3u/pR6gP9ygnp2CJMK5Gq+9Q2oqmrFJAz01DXjw==", + "dev": true, + "license": "MIT" + }, + "node_modules/@angular/cli/node_modules/string-width": { + "version": "7.2.0", + "resolved": "https://registry.npmjs.org/string-width/-/string-width-7.2.0.tgz", + "integrity": "sha512-tsaTIkKW9b4N+AEj+SVA+WhJzV7/zMhcSu78mLKWSk7cXMOSHsBKFWUs0fWwq8QyK3MgJBQRX6Gbi4kYbdvGkQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "emoji-regex": "^10.3.0", + "get-east-asian-width": "^1.0.0", + "strip-ansi": "^7.1.0" + }, + "engines": { + "node": ">=18" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/@angular/cli/node_modules/wrap-ansi": { + "version": "9.0.0", + "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-9.0.0.tgz", + "integrity": "sha512-G8ura3S+3Z2G+mkgNRq8dqaFZAuxfsxpBB8OCTGRTCtp+l/v9nbFNmCUP1BZMts3G1142MsZfn6eeUKrr4PD1Q==", + "dev": true, + "license": "MIT", + "dependencies": { + "ansi-styles": "^6.2.1", + "string-width": "^7.0.0", + "strip-ansi": "^7.1.0" + }, + "engines": { + "node": ">=18" + }, + "funding": { + "url": "https://github.com/chalk/wrap-ansi?sponsor=1" + } + }, + "node_modules/@angular/cli/node_modules/yargs": { + "version": "18.0.0", + "resolved": "https://registry.npmjs.org/yargs/-/yargs-18.0.0.tgz", + "integrity": "sha512-4UEqdc2RYGHZc7Doyqkrqiln3p9X2DZVxaGbwhn2pi7MrRagKaOcIKe8L3OxYcbhXLgLFUS3zAYuQjKBQgmuNg==", + "dev": true, + "license": "MIT", + "dependencies": { + "cliui": "^9.0.1", + "escalade": "^3.1.1", + "get-caller-file": "^2.0.5", + "string-width": "^7.2.0", + "y18n": "^5.0.5", + "yargs-parser": "^22.0.0" + }, + "engines": { + "node": "^20.19.0 || ^22.12.0 || >=23" + } + }, + "node_modules/@angular/cli/node_modules/yargs-parser": { + "version": "22.0.0", + "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-22.0.0.tgz", + "integrity": "sha512-rwu/ClNdSMpkSrUb+d6BRsSkLUq1fmfsY6TOpYzTwvwkg1/NRG85KBy3kq++A8LKQwX6lsu+aWad+2khvuXrqw==", + "dev": true, + "license": "ISC", + "engines": { + "node": "^20.19.0 || ^22.12.0 || >=23" } }, "node_modules/@angular/common": { - "version": "20.0.0", - "resolved": "https://registry.npmjs.org/@angular/common/-/common-20.0.0.tgz", - "integrity": "sha512-tZTvxDjx+wH74/hIpip63u4tlaXNVXkq1iVf4gk7RPQGCAYLNPDWma8X+RpXMXWikn4/mA5NS1VBBtStTbS+gg==", + "version": "20.1.0", + "resolved": "https://registry.npmjs.org/@angular/common/-/common-20.1.0.tgz", + "integrity": "sha512-RsHClHJux+4lXrHdGHVw22wekRbSjYtx6Xwjox2S+IRPP51CbX0KskAALZ9ZmtCttkYSFVtvr0S+SQrU2cu5WA==", "license": "MIT", "dependencies": { "tslib": "^2.3.0" @@ -808,59 +695,158 @@ "node": "^20.19.0 || ^22.12.0 || >=24.0.0" }, "peerDependencies": { - "@angular/core": "20.0.0", + "@angular/core": "20.1.0", "rxjs": "^6.5.3 || ^7.4.0" } }, - "node_modules/@angular/compiler": { - "version": "20.0.0", - "resolved": "https://registry.npmjs.org/@angular/compiler/-/compiler-20.0.0.tgz", - "integrity": "sha512-RzS7MFNy/f8Tft0u6Q1zszzFTeki4408zsBALwmS91a8O8x/jaEvfwA7swC7RiqiX9KKmAyuBJ0qiv42v1T5dA==", + "node_modules/@angular/compiler": { + "version": "20.1.0", + "resolved": "https://registry.npmjs.org/@angular/compiler/-/compiler-20.1.0.tgz", + "integrity": "sha512-sM8H3dJotIDDmI1u8qGuAn16XVfR7A4+/5s5cKLI/osnnIjafi5HHqAf76R5IlGoIv0ZHVQIYaJ/Qdvfyvdhfg==", + "license": "MIT", + "dependencies": { + "tslib": "^2.3.0" + }, + "engines": { + "node": "^20.19.0 || ^22.12.0 || >=24.0.0" + } + }, + "node_modules/@angular/compiler-cli": { + "version": "20.1.0", + "resolved": "https://registry.npmjs.org/@angular/compiler-cli/-/compiler-cli-20.1.0.tgz", + "integrity": "sha512-ajbCmvYYFxeXRdKSfdHjp62MZ2lCMUS0UzswBDAbT9sPd/ThppbvLXLsMBj8SlwaXSSBeTAa1oSHEO1MeuVvGQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "@babel/core": "7.28.0", + "@jridgewell/sourcemap-codec": "^1.4.14", + "chokidar": "^4.0.0", + "convert-source-map": "^1.5.1", + "reflect-metadata": "^0.2.0", + "semver": "^7.0.0", + "tslib": "^2.3.0", + "yargs": "^18.0.0" + }, + "bin": { + "ng-xi18n": "bundles/src/bin/ng_xi18n.js", + "ngc": "bundles/src/bin/ngc.js" + }, + "engines": { + "node": "^20.19.0 || ^22.12.0 || >=24.0.0" + }, + "peerDependencies": { + "@angular/compiler": "20.1.0", + "typescript": ">=5.8 <5.9" + }, + "peerDependenciesMeta": { + "typescript": { + "optional": true + } + } + }, + "node_modules/@angular/compiler-cli/node_modules/ansi-styles": { + "version": "6.2.1", + "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-6.2.1.tgz", + "integrity": "sha512-bN798gFfQX+viw3R7yrGWRqnrN2oRkEkUjjl4JNn4E8GxxbjtG3FbrEIIY3l8/hrwUwIeCZvi4QuOTP4MErVug==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=12" + }, + "funding": { + "url": "https://github.com/chalk/ansi-styles?sponsor=1" + } + }, + "node_modules/@angular/compiler-cli/node_modules/cliui": { + "version": "9.0.1", + "resolved": "https://registry.npmjs.org/cliui/-/cliui-9.0.1.tgz", + "integrity": "sha512-k7ndgKhwoQveBL+/1tqGJYNz097I7WOvwbmmU2AR5+magtbjPWQTS1C5vzGkBC8Ym8UWRzfKUzUUqFLypY4Q+w==", + "dev": true, + "license": "ISC", + "dependencies": { + "string-width": "^7.2.0", + "strip-ansi": "^7.1.0", + "wrap-ansi": "^9.0.0" + }, + "engines": { + "node": ">=20" + } + }, + "node_modules/@angular/compiler-cli/node_modules/emoji-regex": { + "version": "10.4.0", + "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-10.4.0.tgz", + "integrity": "sha512-EC+0oUMY1Rqm4O6LLrgjtYDvcVYTy7chDnM4Q7030tP4Kwj3u/pR6gP9ygnp2CJMK5Gq+9Q2oqmrFJAz01DXjw==", + "dev": true, + "license": "MIT" + }, + "node_modules/@angular/compiler-cli/node_modules/string-width": { + "version": "7.2.0", + "resolved": "https://registry.npmjs.org/string-width/-/string-width-7.2.0.tgz", + "integrity": "sha512-tsaTIkKW9b4N+AEj+SVA+WhJzV7/zMhcSu78mLKWSk7cXMOSHsBKFWUs0fWwq8QyK3MgJBQRX6Gbi4kYbdvGkQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "emoji-regex": "^10.3.0", + "get-east-asian-width": "^1.0.0", + "strip-ansi": "^7.1.0" + }, + "engines": { + "node": ">=18" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/@angular/compiler-cli/node_modules/wrap-ansi": { + "version": "9.0.0", + "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-9.0.0.tgz", + "integrity": "sha512-G8ura3S+3Z2G+mkgNRq8dqaFZAuxfsxpBB8OCTGRTCtp+l/v9nbFNmCUP1BZMts3G1142MsZfn6eeUKrr4PD1Q==", + "dev": true, + "license": "MIT", + "dependencies": { + "ansi-styles": "^6.2.1", + "string-width": "^7.0.0", + "strip-ansi": "^7.1.0" + }, + "engines": { + "node": ">=18" + }, + "funding": { + "url": "https://github.com/chalk/wrap-ansi?sponsor=1" + } + }, + "node_modules/@angular/compiler-cli/node_modules/yargs": { + "version": "18.0.0", + "resolved": "https://registry.npmjs.org/yargs/-/yargs-18.0.0.tgz", + "integrity": "sha512-4UEqdc2RYGHZc7Doyqkrqiln3p9X2DZVxaGbwhn2pi7MrRagKaOcIKe8L3OxYcbhXLgLFUS3zAYuQjKBQgmuNg==", + "dev": true, "license": "MIT", "dependencies": { - "tslib": "^2.3.0" + "cliui": "^9.0.1", + "escalade": "^3.1.1", + "get-caller-file": "^2.0.5", + "string-width": "^7.2.0", + "y18n": "^5.0.5", + "yargs-parser": "^22.0.0" }, "engines": { - "node": "^20.19.0 || ^22.12.0 || >=24.0.0" + "node": "^20.19.0 || ^22.12.0 || >=23" } }, - "node_modules/@angular/compiler-cli": { - "version": "20.0.0", - "resolved": "https://registry.npmjs.org/@angular/compiler-cli/-/compiler-cli-20.0.0.tgz", - "integrity": "sha512-dPFp/YyRJkiyppnoI85mZz0CJv0ulc5MpJV16Lx0qdrRyoKmBrGmdaGEP0DOhhBLVAmJ5J2wvShvWfE2pjMMWw==", + "node_modules/@angular/compiler-cli/node_modules/yargs-parser": { + "version": "22.0.0", + "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-22.0.0.tgz", + "integrity": "sha512-rwu/ClNdSMpkSrUb+d6BRsSkLUq1fmfsY6TOpYzTwvwkg1/NRG85KBy3kq++A8LKQwX6lsu+aWad+2khvuXrqw==", "dev": true, - "license": "MIT", - "dependencies": { - "@babel/core": "7.27.1", - "@jridgewell/sourcemap-codec": "^1.4.14", - "chokidar": "^4.0.0", - "convert-source-map": "^1.5.1", - "reflect-metadata": "^0.2.0", - "semver": "^7.0.0", - "tslib": "^2.3.0", - "yargs": "^17.2.1" - }, - "bin": { - "ng-xi18n": "bundles/src/bin/ng_xi18n.js", - "ngc": "bundles/src/bin/ngc.js" - }, + "license": "ISC", "engines": { - "node": "^20.19.0 || ^22.12.0 || >=24.0.0" - }, - "peerDependencies": { - "@angular/compiler": "20.0.0", - "typescript": ">=5.8 <5.9" - }, - "peerDependenciesMeta": { - "typescript": { - "optional": true - } + "node": "^20.19.0 || ^22.12.0 || >=23" } }, "node_modules/@angular/core": { - "version": "20.0.0", - "resolved": "https://registry.npmjs.org/@angular/core/-/core-20.0.0.tgz", - "integrity": "sha512-2UjKbTtYSY8omY+LE4G6hQ1/R4PkE6NY7/2u99TxLH/oOnc9broCH1g9ITU+n0eJURcOFeK0/w6RdSrK+di3pg==", + "version": "20.1.0", + "resolved": "https://registry.npmjs.org/@angular/core/-/core-20.1.0.tgz", + "integrity": "sha512-/dJooZi+OAACkjWgGMPrOOGikdtlTJXwdeXPJTgZSUD5L8oQMbhZFG0XW/1Hldvsti87wPjZPz67ivB7zR86VA==", "license": "MIT", "dependencies": { "tslib": "^2.3.0" @@ -869,7 +855,7 @@ "node": "^20.19.0 || ^22.12.0 || >=24.0.0" }, "peerDependencies": { - "@angular/compiler": "20.0.0", + "@angular/compiler": "20.1.0", "rxjs": "^6.5.3 || ^7.4.0", "zone.js": "~0.15.0" }, @@ -883,9 +869,9 @@ } }, "node_modules/@angular/elements": { - "version": "20.0.0", - "resolved": "https://registry.npmjs.org/@angular/elements/-/elements-20.0.0.tgz", - "integrity": "sha512-bZZUPIWI777CvcqJAXOV0On9n1vaXPcw7iPdj0ZG1uQnE4KEiXVty/Y/0zi3FdBxMp4QSzU7zXbOuiq0iqIctQ==", + "version": "20.1.0", + "resolved": "https://registry.npmjs.org/@angular/elements/-/elements-20.1.0.tgz", + "integrity": "sha512-ioKAzcpwK8ZncZPcW1RcPMyxCEx3vQ2EFB7Weu7uG9dig3Hi99AUkqbQuG4POgHqy07pw/6z1mRqfRj+9eDqOA==", "license": "MIT", "dependencies": { "tslib": "^2.3.0" @@ -894,14 +880,14 @@ "node": "^20.19.0 || ^22.12.0 || >=24.0.0" }, "peerDependencies": { - "@angular/core": "20.0.0", + "@angular/core": "20.1.0", "rxjs": "^6.5.3 || ^7.4.0" } }, "node_modules/@angular/forms": { - "version": "20.0.0", - "resolved": "https://registry.npmjs.org/@angular/forms/-/forms-20.0.0.tgz", - "integrity": "sha512-6yeb99IrNyeyj7o0bbd+n3JTZrXX2dJfdYLJH3tlXVlO9wg63bq+YR1AeM+RDCYMs+YDJis0lQpF6s+OICJv4g==", + "version": "20.1.0", + "resolved": "https://registry.npmjs.org/@angular/forms/-/forms-20.1.0.tgz", + "integrity": "sha512-NgQxowyyG2yiSOXxtQS1xK1vAQT+4GRoMFuzmS3uBshIifgCgFckSxJHQXhlQOInuv2NsZ1Q0HuCvao+yZfIow==", "license": "MIT", "dependencies": { "tslib": "^2.3.0" @@ -910,16 +896,16 @@ "node": "^20.19.0 || ^22.12.0 || >=24.0.0" }, "peerDependencies": { - "@angular/common": "20.0.0", - "@angular/core": "20.0.0", - "@angular/platform-browser": "20.0.0", + "@angular/common": "20.1.0", + "@angular/core": "20.1.0", + "@angular/platform-browser": "20.1.0", "rxjs": "^6.5.3 || ^7.4.0" } }, "node_modules/@angular/language-service": { - "version": "20.0.0", - "resolved": "https://registry.npmjs.org/@angular/language-service/-/language-service-20.0.0.tgz", - "integrity": "sha512-lprUUz56dk3ORWGD6Z7Hmzo2MqxezW5qXaxpJHOow3+8/Jx6q+PPWCZrFSEyTtaKr/oRGzHLVCEzB+tmB980Fw==", + "version": "20.1.0", + "resolved": "https://registry.npmjs.org/@angular/language-service/-/language-service-20.1.0.tgz", + "integrity": "sha512-qHZk5LI2uaDRk0QOIdg2AZqyij00XOgZb3yiP7C3fjv3YkyRjXvobTRCLieTq10vdMt9TuCwdOISFK7g1/1eEg==", "dev": true, "license": "MIT", "engines": { @@ -927,9 +913,9 @@ } }, "node_modules/@angular/platform-browser": { - "version": "20.0.0", - "resolved": "https://registry.npmjs.org/@angular/platform-browser/-/platform-browser-20.0.0.tgz", - "integrity": "sha512-FP9YjT2beF0tov0wub6+eUQqJd2MwyYqEQQ6+Qx67ukd04plIryhrcImORehrsN24DbnHkyTqhCvUyNAZs2uwA==", + "version": "20.1.0", + "resolved": "https://registry.npmjs.org/@angular/platform-browser/-/platform-browser-20.1.0.tgz", + "integrity": "sha512-l3+Ijq5SFxT0v10DbOyMc7NzGdbK76yot2i8pXyArlPSPmpWvbbjXbiBqzrv3TSTrksHBhG3mMvyhTmHQ1cQFA==", "license": "MIT", "dependencies": { "tslib": "^2.3.0" @@ -938,9 +924,9 @@ "node": "^20.19.0 || ^22.12.0 || >=24.0.0" }, "peerDependencies": { - "@angular/animations": "20.0.0", - "@angular/common": "20.0.0", - "@angular/core": "20.0.0" + "@angular/animations": "20.1.0", + "@angular/common": "20.1.0", + "@angular/core": "20.1.0" }, "peerDependenciesMeta": { "@angular/animations": { @@ -949,9 +935,9 @@ } }, "node_modules/@angular/platform-browser-dynamic": { - "version": "20.0.0", - "resolved": "https://registry.npmjs.org/@angular/platform-browser-dynamic/-/platform-browser-dynamic-20.0.0.tgz", - "integrity": "sha512-AACq3Ijuq59SdLDmfxWU8hYlo8O4Br9OHWNAga2W0X6p/7HlpeZZVdTlb/KGVYRKJvGpgSB10QYlRPfm215q9Q==", + "version": "20.1.0", + "resolved": "https://registry.npmjs.org/@angular/platform-browser-dynamic/-/platform-browser-dynamic-20.1.0.tgz", + "integrity": "sha512-s+Rm2akzYTE2UFdXZPvf02TxDCDskGdUxAxa/jmJbVuOpniuY0RlbnxIKDUD0qj3bYMUkbr7f2KJwHVldqJP6w==", "license": "MIT", "dependencies": { "tslib": "^2.3.0" @@ -960,16 +946,16 @@ "node": "^20.19.0 || ^22.12.0 || >=24.0.0" }, "peerDependencies": { - "@angular/common": "20.0.0", - "@angular/compiler": "20.0.0", - "@angular/core": "20.0.0", - "@angular/platform-browser": "20.0.0" + "@angular/common": "20.1.0", + "@angular/compiler": "20.1.0", + "@angular/core": "20.1.0", + "@angular/platform-browser": "20.1.0" } }, "node_modules/@angular/platform-server": { - "version": "20.0.0", - "resolved": "https://registry.npmjs.org/@angular/platform-server/-/platform-server-20.0.0.tgz", - "integrity": "sha512-H2Qw6bZYYQdZKrMv6YS1k65+mXCRFBAZJziFeNUG9HreKaSNBlqCvrR/ru6TLo6UhItpX3bS/y9u/lBcGP/Ejg==", + "version": "20.1.0", + "resolved": "https://registry.npmjs.org/@angular/platform-server/-/platform-server-20.1.0.tgz", + "integrity": "sha512-LoQVckLKprNY9HEtIUn48xL+cj8Eqr2iFqRJl8t523tYslXnJ1jnqUG6YCXZJBPeNOl9aF1IJ7/zbfzWYhTIBg==", "license": "MIT", "dependencies": { "tslib": "^2.3.0", @@ -979,17 +965,17 @@ "node": "^20.19.0 || ^22.12.0 || >=24.0.0" }, "peerDependencies": { - "@angular/common": "20.0.0", - "@angular/compiler": "20.0.0", - "@angular/core": "20.0.0", - "@angular/platform-browser": "20.0.0", + "@angular/common": "20.1.0", + "@angular/compiler": "20.1.0", + "@angular/core": "20.1.0", + "@angular/platform-browser": "20.1.0", "rxjs": "^6.5.3 || ^7.4.0" } }, "node_modules/@angular/router": { - "version": "20.0.0", - "resolved": "https://registry.npmjs.org/@angular/router/-/router-20.0.0.tgz", - "integrity": "sha512-RQ7rU4NaZDSvvOfMZQmB50q7de+jrHYb+f0ExLKBvr80B1MK3oc9VvI2BzBkGfM4aGx71MMa0UizjOiT/31kqw==", + "version": "20.1.0", + "resolved": "https://registry.npmjs.org/@angular/router/-/router-20.1.0.tgz", + "integrity": "sha512-fuUX1+AhcVSDgSSx85o6VOtXKM3oXAza+44jQ+nJGf316P0xpLKA586DKRNPjS4sRsWM7otKuOOTXXc4AMUHpQ==", "license": "MIT", "dependencies": { "tslib": "^2.3.0" @@ -998,16 +984,16 @@ "node": "^20.19.0 || ^22.12.0 || >=24.0.0" }, "peerDependencies": { - "@angular/common": "20.0.0", - "@angular/core": "20.0.0", - "@angular/platform-browser": "20.0.0", + "@angular/common": "20.1.0", + "@angular/core": "20.1.0", + "@angular/platform-browser": "20.1.0", "rxjs": "^6.5.3 || ^7.4.0" } }, "node_modules/@angular/ssr": { - "version": "20.0.0", - "resolved": "https://registry.npmjs.org/@angular/ssr/-/ssr-20.0.0.tgz", - "integrity": "sha512-ezca+E3A3zRbMDmvyyclgDX38JvmXb0ZvqGkgQGURa12+5dHvwy8hnDT1eBoRxXBedp+cnIkxXxLjTzXb4/4Hw==", + "version": "20.1.0", + "resolved": "https://registry.npmjs.org/@angular/ssr/-/ssr-20.1.0.tgz", + "integrity": "sha512-Ci8jR7/ULD8MU8aTLT1SpU7UH+TDqMLDE5CuYDCjapMPDljOWB/TMHWST1KoC9KFI9k1h3N3nGcwtlEc0EQPGQ==", "license": "MIT", "dependencies": { "tslib": "^2.3.0" @@ -1170,22 +1156,22 @@ } }, "node_modules/@babel/core": { - "version": "7.27.1", - "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.27.1.tgz", - "integrity": "sha512-IaaGWsQqfsQWVLqMn9OB92MNN7zukfVA4s7KKAI0KfrrDsZ0yhi5uV4baBuLuN7n3vsZpwP8asPPcVwApxvjBQ==", + "version": "7.28.0", + "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.28.0.tgz", + "integrity": "sha512-UlLAnTPrFdNGoFtbSXwcGFQBtQZJCNjaN6hQNP3UPvuNXT1i82N26KL3dZeIpNalWywr9IuQuncaAfUaS1g6sQ==", "dev": true, "license": "MIT", "dependencies": { "@ampproject/remapping": "^2.2.0", "@babel/code-frame": "^7.27.1", - "@babel/generator": "^7.27.1", - "@babel/helper-compilation-targets": "^7.27.1", - "@babel/helper-module-transforms": "^7.27.1", - "@babel/helpers": "^7.27.1", - "@babel/parser": "^7.27.1", - "@babel/template": "^7.27.1", - "@babel/traverse": "^7.27.1", - "@babel/types": "^7.27.1", + "@babel/generator": "^7.28.0", + "@babel/helper-compilation-targets": "^7.27.2", + "@babel/helper-module-transforms": "^7.27.3", + "@babel/helpers": "^7.27.6", + "@babel/parser": "^7.28.0", + "@babel/template": "^7.27.2", + "@babel/traverse": "^7.28.0", + "@babel/types": "^7.28.0", "convert-source-map": "^2.0.0", "debug": "^4.1.0", "gensync": "^1.0.0-beta.2", @@ -1218,16 +1204,16 @@ } }, "node_modules/@babel/generator": { - "version": "7.27.3", - "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.27.3.tgz", - "integrity": "sha512-xnlJYj5zepml8NXtjkG0WquFUv8RskFqyFcVgTBp5k+NaA/8uw/K+OSVf8AMGw5e9HKP2ETd5xpK5MLZQD6b4Q==", + "version": "7.28.0", + "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.28.0.tgz", + "integrity": "sha512-lJjzvrbEeWrhB4P3QBsH7tey117PjLZnDbLiQEKjQ/fNJTjuq4HSqgFA+UNSwZT8D7dxxbnuSBMsa1lrWzKlQg==", "dev": true, "license": "MIT", "dependencies": { - "@babel/parser": "^7.27.3", - "@babel/types": "^7.27.3", - "@jridgewell/gen-mapping": "^0.3.5", - "@jridgewell/trace-mapping": "^0.3.25", + "@babel/parser": "^7.28.0", + "@babel/types": "^7.28.0", + "@jridgewell/gen-mapping": "^0.3.12", + "@jridgewell/trace-mapping": "^0.3.28", "jsesc": "^3.0.2" }, "engines": { @@ -1235,13 +1221,13 @@ } }, "node_modules/@babel/helper-annotate-as-pure": { - "version": "7.27.1", - "resolved": "https://registry.npmjs.org/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.27.1.tgz", - "integrity": "sha512-WnuuDILl9oOBbKnb4L+DyODx7iC47XfzmNCpTttFsSp6hTG7XZxu60+4IO+2/hPfcGOoKbFiwoI/+zwARbNQow==", + "version": "7.27.3", + "resolved": "https://registry.npmjs.org/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.27.3.tgz", + "integrity": "sha512-fXSwMQqitTGeHLBC08Eq5yXz2m37E4pJX1qAU1+2cNedz/ifv/bVXft90VeSav5nFO61EcNgwr0aJxbyPaWBPg==", "dev": true, "license": "MIT", "dependencies": { - "@babel/types": "^7.27.1" + "@babel/types": "^7.27.3" }, "engines": { "node": ">=6.9.0" @@ -1274,6 +1260,16 @@ "semver": "bin/semver.js" } }, + "node_modules/@babel/helper-globals": { + "version": "7.28.0", + "resolved": "https://registry.npmjs.org/@babel/helper-globals/-/helper-globals-7.28.0.tgz", + "integrity": "sha512-+W6cISkXFa1jXsDEdYA8HeevQT/FULhxzR99pxphltZcVaugps53THCeiWA8SguxxpSp3gKPiuYfSWopkLQ4hw==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=6.9.0" + } + }, "node_modules/@babel/helper-module-imports": { "version": "7.27.1", "resolved": "https://registry.npmjs.org/@babel/helper-module-imports/-/helper-module-imports-7.27.1.tgz", @@ -1350,27 +1346,27 @@ } }, "node_modules/@babel/helpers": { - "version": "7.27.3", - "resolved": "https://registry.npmjs.org/@babel/helpers/-/helpers-7.27.3.tgz", - "integrity": "sha512-h/eKy9agOya1IGuLaZ9tEUgz+uIRXcbtOhRtUyyMf8JFmn1iT13vnl/IGVWSkdOCG/pC57U4S1jnAabAavTMwg==", + "version": "7.27.6", + "resolved": "https://registry.npmjs.org/@babel/helpers/-/helpers-7.27.6.tgz", + "integrity": "sha512-muE8Tt8M22638HU31A3CgfSUciwz1fhATfoVai05aPXGor//CdWDCbnlY1yvBPo07njuVOCNGCSp/GTt12lIug==", "dev": true, "license": "MIT", "dependencies": { "@babel/template": "^7.27.2", - "@babel/types": "^7.27.3" + "@babel/types": "^7.27.6" }, "engines": { "node": ">=6.9.0" } }, "node_modules/@babel/parser": { - "version": "7.27.3", - "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.27.3.tgz", - "integrity": "sha512-xyYxRj6+tLNDTWi0KCBcZ9V7yg3/lwL9DWh9Uwh/RIVlIfFidggcgxKX3GCXwCiswwcGRawBKbEg2LG/Y8eJhw==", + "version": "7.28.0", + "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.28.0.tgz", + "integrity": "sha512-jVZGvOxOuNSsuQuLRTh13nU0AogFlw32w/MT+LV6D3sP5WdbW61E77RnkbaO2dUvmPAYrBDJXGn5gGS6tH4j8g==", "dev": true, "license": "MIT", "dependencies": { - "@babel/types": "^7.27.3" + "@babel/types": "^7.28.0" }, "bin": { "parser": "bin/babel-parser.js" @@ -1395,28 +1391,28 @@ } }, "node_modules/@babel/traverse": { - "version": "7.27.3", - "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.27.3.tgz", - "integrity": "sha512-lId/IfN/Ye1CIu8xG7oKBHXd2iNb2aW1ilPszzGcJug6M8RCKfVNcYhpI5+bMvFYjK7lXIM0R+a+6r8xhHp2FQ==", + "version": "7.28.0", + "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.28.0.tgz", + "integrity": "sha512-mGe7UK5wWyh0bKRfupsUchrQGqvDbZDbKJw+kcRGSmdHVYrv+ltd0pnpDTVpiTqnaBru9iEvA8pz8W46v0Amwg==", "dev": true, "license": "MIT", "dependencies": { "@babel/code-frame": "^7.27.1", - "@babel/generator": "^7.27.3", - "@babel/parser": "^7.27.3", + "@babel/generator": "^7.28.0", + "@babel/helper-globals": "^7.28.0", + "@babel/parser": "^7.28.0", "@babel/template": "^7.27.2", - "@babel/types": "^7.27.3", - "debug": "^4.3.1", - "globals": "^11.1.0" + "@babel/types": "^7.28.0", + "debug": "^4.3.1" }, "engines": { "node": ">=6.9.0" } }, "node_modules/@babel/types": { - "version": "7.27.3", - "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.27.3.tgz", - "integrity": "sha512-Y1GkI4ktrtvmawoSq+4FCVHNryea6uR+qUQy0AGxLSsjCX0nVmkYQMBLHDkXZuo5hGx7eYdnIaslsdBFm7zbUw==", + "version": "7.28.1", + "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.28.1.tgz", + "integrity": "sha512-x0LvFTekgSX+83TI28Y9wYPUfzrnl2aT5+5QLnO6v7mSJYtEEevuDRN0F0uSHRk1G1IWZC43o00Y0xDDrpBGPQ==", "dev": true, "license": "MIT", "dependencies": { @@ -2129,9 +2125,9 @@ } }, "node_modules/@eslint/config-array": { - "version": "0.20.0", - "resolved": "https://registry.npmjs.org/@eslint/config-array/-/config-array-0.20.0.tgz", - "integrity": "sha512-fxlS1kkIjx8+vy2SjuCB94q3htSNrufYTXubwiBFeaQHbH6Ipi43gFJq2zCMt6PHhImH3Xmr0NksKDvchWlpQQ==", + "version": "0.21.0", + "resolved": "https://registry.npmjs.org/@eslint/config-array/-/config-array-0.21.0.tgz", + "integrity": "sha512-ENIdc4iLu0d93HeYirvKmrzshzofPw6VkZRKQGe9Nv46ZnWUzcF1xV01dcvEg/1wXUR61OmmlSfyeyO7EvjLxQ==", "dev": true, "license": "Apache-2.0", "dependencies": { @@ -2144,9 +2140,9 @@ } }, "node_modules/@eslint/config-array/node_modules/brace-expansion": { - "version": "1.1.11", - "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz", - "integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==", + "version": "1.1.12", + "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.12.tgz", + "integrity": "sha512-9T9UjW3r0UW5c1Q7GTwllptXwhvYmEzFhzMfZ9H7FQWt+uZePjZPjBP/W1ZEyZ1twGWom5/56TF4lPcqjnDHcg==", "dev": true, "license": "MIT", "dependencies": { @@ -2168,9 +2164,9 @@ } }, "node_modules/@eslint/config-helpers": { - "version": "0.2.2", - "resolved": "https://registry.npmjs.org/@eslint/config-helpers/-/config-helpers-0.2.2.tgz", - "integrity": "sha512-+GPzk8PlG0sPpzdU5ZvIRMPidzAnZDl/s9L+y13iodqvb8leL53bTannOrQ/Im7UkpsmFU5Ily5U60LWixnmLg==", + "version": "0.3.0", + "resolved": "https://registry.npmjs.org/@eslint/config-helpers/-/config-helpers-0.3.0.tgz", + "integrity": "sha512-ViuymvFmcJi04qdZeDc2whTHryouGcDlaxPqarTD0ZE10ISpxGUVZGZDx4w01upyIynL3iu6IXH2bS1NhclQMw==", "dev": true, "license": "Apache-2.0", "engines": { @@ -2286,9 +2282,9 @@ } }, "node_modules/@eslint/js": { - "version": "9.27.0", - "resolved": "https://registry.npmjs.org/@eslint/js/-/js-9.27.0.tgz", - "integrity": "sha512-G5JD9Tu5HJEu4z2Uo4aHY2sLV64B7CDMXxFzqzjl3NKd6RVzSXNoE80jk7Y0lJkTTkjiIhBAqmlYwjuBY3tvpA==", + "version": "9.31.0", + "resolved": "https://registry.npmjs.org/@eslint/js/-/js-9.31.0.tgz", + "integrity": "sha512-LOm5OVt7D4qiKCqoiPbA7LWmI+tbw1VbTUowBcUMgQSuM6poJufkFkYDcQpo5KfgD39TnNySV26QjOh7VFpSyw==", "dev": true, "license": "MIT", "engines": { @@ -2984,13 +2980,13 @@ } }, "node_modules/@inquirer/checkbox": { - "version": "4.1.8", - "resolved": "https://registry.npmjs.org/@inquirer/checkbox/-/checkbox-4.1.8.tgz", - "integrity": "sha512-d/QAsnwuHX2OPolxvYcgSj7A9DO9H6gVOy2DvBTx+P2LH2iRTo/RSGV3iwCzW024nP9hw98KIuDmdyhZQj1UQg==", + "version": "4.1.9", + "resolved": "https://registry.npmjs.org/@inquirer/checkbox/-/checkbox-4.1.9.tgz", + "integrity": "sha512-DBJBkzI5Wx4jFaYm221LHvAhpKYkhVS0k9plqHwaHhofGNxvYB7J3Bz8w+bFJ05zaMb0sZNHo4KdmENQFlNTuQ==", "dev": true, "license": "MIT", "dependencies": { - "@inquirer/core": "^10.1.13", + "@inquirer/core": "^10.1.14", "@inquirer/figures": "^1.0.12", "@inquirer/type": "^3.0.7", "ansi-escapes": "^4.3.2", @@ -3009,14 +3005,14 @@ } }, "node_modules/@inquirer/confirm": { - "version": "5.1.10", - "resolved": "https://registry.npmjs.org/@inquirer/confirm/-/confirm-5.1.10.tgz", - "integrity": "sha512-FxbQ9giWxUWKUk2O5XZ6PduVnH2CZ/fmMKMBkH71MHJvWr7WL5AHKevhzF1L5uYWB2P548o1RzVxrNd3dpmk6g==", + "version": "5.1.13", + "resolved": "https://registry.npmjs.org/@inquirer/confirm/-/confirm-5.1.13.tgz", + "integrity": "sha512-EkCtvp67ICIVVzjsquUiVSd+V5HRGOGQfsqA4E4vMWhYnB7InUL0pa0TIWt1i+OfP16Gkds8CdIu6yGZwOM1Yw==", "dev": true, "license": "MIT", "dependencies": { - "@inquirer/core": "^10.1.11", - "@inquirer/type": "^3.0.6" + "@inquirer/core": "^10.1.14", + "@inquirer/type": "^3.0.7" }, "engines": { "node": ">=18" @@ -3031,9 +3027,9 @@ } }, "node_modules/@inquirer/core": { - "version": "10.1.13", - "resolved": "https://registry.npmjs.org/@inquirer/core/-/core-10.1.13.tgz", - "integrity": "sha512-1viSxebkYN2nJULlzCxES6G9/stgHSepZ9LqqfdIGPHj5OHhiBUXVS0a6R0bEC2A+VL4D9w6QB66ebCr6HGllA==", + "version": "10.1.14", + "resolved": "https://registry.npmjs.org/@inquirer/core/-/core-10.1.14.tgz", + "integrity": "sha512-Ma+ZpOJPewtIYl6HZHZckeX1STvDnHTCB2GVINNUlSEn2Am6LddWwfPkIGY0IUFVjUUrr/93XlBwTK6mfLjf0A==", "dev": true, "license": "MIT", "dependencies": { @@ -3059,13 +3055,13 @@ } }, "node_modules/@inquirer/editor": { - "version": "4.2.13", - "resolved": "https://registry.npmjs.org/@inquirer/editor/-/editor-4.2.13.tgz", - "integrity": "sha512-WbicD9SUQt/K8O5Vyk9iC2ojq5RHoCLK6itpp2fHsWe44VxxcA9z3GTWlvjSTGmMQpZr+lbVmrxdHcumJoLbMA==", + "version": "4.2.14", + "resolved": "https://registry.npmjs.org/@inquirer/editor/-/editor-4.2.14.tgz", + "integrity": "sha512-yd2qtLl4QIIax9DTMZ1ZN2pFrrj+yL3kgIWxm34SS6uwCr0sIhsNyudUjAo5q3TqI03xx4SEBkUJqZuAInp9uA==", "dev": true, "license": "MIT", "dependencies": { - "@inquirer/core": "^10.1.13", + "@inquirer/core": "^10.1.14", "@inquirer/type": "^3.0.7", "external-editor": "^3.1.0" }, @@ -3082,13 +3078,13 @@ } }, "node_modules/@inquirer/expand": { - "version": "4.0.15", - "resolved": "https://registry.npmjs.org/@inquirer/expand/-/expand-4.0.15.tgz", - "integrity": "sha512-4Y+pbr/U9Qcvf+N/goHzPEXiHH8680lM3Dr3Y9h9FFw4gHS+zVpbj8LfbKWIb/jayIB4aSO4pWiBTrBYWkvi5A==", + "version": "4.0.16", + "resolved": "https://registry.npmjs.org/@inquirer/expand/-/expand-4.0.16.tgz", + "integrity": "sha512-oiDqafWzMtofeJyyGkb1CTPaxUkjIcSxePHHQCfif8t3HV9pHcw1Kgdw3/uGpDvaFfeTluwQtWiqzPVjAqS3zA==", "dev": true, "license": "MIT", "dependencies": { - "@inquirer/core": "^10.1.13", + "@inquirer/core": "^10.1.14", "@inquirer/type": "^3.0.7", "yoctocolors-cjs": "^2.1.2" }, @@ -3115,13 +3111,13 @@ } }, "node_modules/@inquirer/input": { - "version": "4.1.12", - "resolved": "https://registry.npmjs.org/@inquirer/input/-/input-4.1.12.tgz", - "integrity": "sha512-xJ6PFZpDjC+tC1P8ImGprgcsrzQRsUh9aH3IZixm1lAZFK49UGHxM3ltFfuInN2kPYNfyoPRh+tU4ftsjPLKqQ==", + "version": "4.2.0", + "resolved": "https://registry.npmjs.org/@inquirer/input/-/input-4.2.0.tgz", + "integrity": "sha512-opqpHPB1NjAmDISi3uvZOTrjEEU5CWVu/HBkDby8t93+6UxYX0Z7Ps0Ltjm5sZiEbWenjubwUkivAEYQmy9xHw==", "dev": true, "license": "MIT", "dependencies": { - "@inquirer/core": "^10.1.13", + "@inquirer/core": "^10.1.14", "@inquirer/type": "^3.0.7" }, "engines": { @@ -3137,13 +3133,13 @@ } }, "node_modules/@inquirer/number": { - "version": "3.0.15", - "resolved": "https://registry.npmjs.org/@inquirer/number/-/number-3.0.15.tgz", - "integrity": "sha512-xWg+iYfqdhRiM55MvqiTCleHzszpoigUpN5+t1OMcRkJrUrw7va3AzXaxvS+Ak7Gny0j2mFSTv2JJj8sMtbV2g==", + "version": "3.0.16", + "resolved": "https://registry.npmjs.org/@inquirer/number/-/number-3.0.16.tgz", + "integrity": "sha512-kMrXAaKGavBEoBYUCgualbwA9jWUx2TjMA46ek+pEKy38+LFpL9QHlTd8PO2kWPUgI/KB+qi02o4y2rwXbzr3Q==", "dev": true, "license": "MIT", "dependencies": { - "@inquirer/core": "^10.1.13", + "@inquirer/core": "^10.1.14", "@inquirer/type": "^3.0.7" }, "engines": { @@ -3159,13 +3155,13 @@ } }, "node_modules/@inquirer/password": { - "version": "4.0.15", - "resolved": "https://registry.npmjs.org/@inquirer/password/-/password-4.0.15.tgz", - "integrity": "sha512-75CT2p43DGEnfGTaqFpbDC2p2EEMrq0S+IRrf9iJvYreMy5mAWj087+mdKyLHapUEPLjN10mNvABpGbk8Wdraw==", + "version": "4.0.16", + "resolved": "https://registry.npmjs.org/@inquirer/password/-/password-4.0.16.tgz", + "integrity": "sha512-g8BVNBj5Zeb5/Y3cSN+hDUL7CsIFDIuVxb9EPty3lkxBaYpjL5BNRKSYOF9yOLe+JOcKFd+TSVeADQ4iSY7rbg==", "dev": true, "license": "MIT", "dependencies": { - "@inquirer/core": "^10.1.13", + "@inquirer/core": "^10.1.14", "@inquirer/type": "^3.0.7", "ansi-escapes": "^4.3.2" }, @@ -3182,22 +3178,22 @@ } }, "node_modules/@inquirer/prompts": { - "version": "7.5.1", - "resolved": "https://registry.npmjs.org/@inquirer/prompts/-/prompts-7.5.1.tgz", - "integrity": "sha512-5AOrZPf2/GxZ+SDRZ5WFplCA2TAQgK3OYrXCYmJL5NaTu4ECcoWFlfUZuw7Es++6Njv7iu/8vpYJhuzxUH76Vg==", + "version": "7.6.0", + "resolved": "https://registry.npmjs.org/@inquirer/prompts/-/prompts-7.6.0.tgz", + "integrity": "sha512-jAhL7tyMxB3Gfwn4HIJ0yuJ5pvcB5maYUcouGcgd/ub79f9MqZ+aVnBtuFf+VC2GTkCBF+R+eo7Vi63w5VZlzw==", "dev": true, "license": "MIT", "dependencies": { - "@inquirer/checkbox": "^4.1.6", - "@inquirer/confirm": "^5.1.10", - "@inquirer/editor": "^4.2.11", - "@inquirer/expand": "^4.0.13", - "@inquirer/input": "^4.1.10", - "@inquirer/number": "^3.0.13", - "@inquirer/password": "^4.0.13", - "@inquirer/rawlist": "^4.1.1", - "@inquirer/search": "^3.0.13", - "@inquirer/select": "^4.2.1" + "@inquirer/checkbox": "^4.1.9", + "@inquirer/confirm": "^5.1.13", + "@inquirer/editor": "^4.2.14", + "@inquirer/expand": "^4.0.16", + "@inquirer/input": "^4.2.0", + "@inquirer/number": "^3.0.16", + "@inquirer/password": "^4.0.16", + "@inquirer/rawlist": "^4.1.4", + "@inquirer/search": "^3.0.16", + "@inquirer/select": "^4.2.4" }, "engines": { "node": ">=18" @@ -3212,13 +3208,13 @@ } }, "node_modules/@inquirer/rawlist": { - "version": "4.1.3", - "resolved": "https://registry.npmjs.org/@inquirer/rawlist/-/rawlist-4.1.3.tgz", - "integrity": "sha512-7XrV//6kwYumNDSsvJIPeAqa8+p7GJh7H5kRuxirct2cgOcSWwwNGoXDRgpNFbY/MG2vQ4ccIWCi8+IXXyFMZA==", + "version": "4.1.4", + "resolved": "https://registry.npmjs.org/@inquirer/rawlist/-/rawlist-4.1.4.tgz", + "integrity": "sha512-5GGvxVpXXMmfZNtvWw4IsHpR7RzqAR624xtkPd1NxxlV5M+pShMqzL4oRddRkg8rVEOK9fKdJp1jjVML2Lr7TQ==", "dev": true, "license": "MIT", "dependencies": { - "@inquirer/core": "^10.1.13", + "@inquirer/core": "^10.1.14", "@inquirer/type": "^3.0.7", "yoctocolors-cjs": "^2.1.2" }, @@ -3235,13 +3231,13 @@ } }, "node_modules/@inquirer/search": { - "version": "3.0.15", - "resolved": "https://registry.npmjs.org/@inquirer/search/-/search-3.0.15.tgz", - "integrity": "sha512-YBMwPxYBrADqyvP4nNItpwkBnGGglAvCLVW8u4pRmmvOsHUtCAUIMbUrLX5B3tFL1/WsLGdQ2HNzkqswMs5Uaw==", + "version": "3.0.16", + "resolved": "https://registry.npmjs.org/@inquirer/search/-/search-3.0.16.tgz", + "integrity": "sha512-POCmXo+j97kTGU6aeRjsPyuCpQQfKcMXdeTMw708ZMtWrj5aykZvlUxH4Qgz3+Y1L/cAVZsSpA+UgZCu2GMOMg==", "dev": true, "license": "MIT", "dependencies": { - "@inquirer/core": "^10.1.13", + "@inquirer/core": "^10.1.14", "@inquirer/figures": "^1.0.12", "@inquirer/type": "^3.0.7", "yoctocolors-cjs": "^2.1.2" @@ -3259,13 +3255,13 @@ } }, "node_modules/@inquirer/select": { - "version": "4.2.3", - "resolved": "https://registry.npmjs.org/@inquirer/select/-/select-4.2.3.tgz", - "integrity": "sha512-OAGhXU0Cvh0PhLz9xTF/kx6g6x+sP+PcyTiLvCrewI99P3BBeexD+VbuwkNDvqGkk3y2h5ZiWLeRP7BFlhkUDg==", + "version": "4.2.4", + "resolved": "https://registry.npmjs.org/@inquirer/select/-/select-4.2.4.tgz", + "integrity": "sha512-unTppUcTjmnbl/q+h8XeQDhAqIOmwWYWNyiiP2e3orXrg6tOaa5DHXja9PChCSbChOsktyKgOieRZFnajzxoBg==", "dev": true, "license": "MIT", "dependencies": { - "@inquirer/core": "^10.1.13", + "@inquirer/core": "^10.1.14", "@inquirer/figures": "^1.0.12", "@inquirer/type": "^3.0.7", "ansi-escapes": "^4.3.2", @@ -3412,18 +3408,14 @@ } }, "node_modules/@jridgewell/gen-mapping": { - "version": "0.3.8", - "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.8.tgz", - "integrity": "sha512-imAbBGkb+ebQyxKgzv5Hu2nmROxoDOXHh80evxdoXNOrvAnVx7zimzc1Oo5h9RlfV4vPXaE2iM5pOFbvOCClWA==", + "version": "0.3.12", + "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.12.tgz", + "integrity": "sha512-OuLGC46TjB5BbN1dH8JULVVZY4WTdkF7tV9Ys6wLL1rubZnCMstOhNHueU5bLCrnRuDhKPDM4g6sw4Bel5Gzqg==", "dev": true, "license": "MIT", "dependencies": { - "@jridgewell/set-array": "^1.2.1", - "@jridgewell/sourcemap-codec": "^1.4.10", + "@jridgewell/sourcemap-codec": "^1.5.0", "@jridgewell/trace-mapping": "^0.3.24" - }, - "engines": { - "node": ">=6.0.0" } }, "node_modules/@jridgewell/resolve-uri": { @@ -3436,16 +3428,6 @@ "node": ">=6.0.0" } }, - "node_modules/@jridgewell/set-array": { - "version": "1.2.1", - "resolved": "https://registry.npmjs.org/@jridgewell/set-array/-/set-array-1.2.1.tgz", - "integrity": "sha512-R8gLRTZeyp03ymzP/6Lil/28tGeGEzhx1q2k703KGWRAI1VdvPIXdG70VJc2pAMw3NA6JKL5hhFu1sJX0Mnn/A==", - "dev": true, - "license": "MIT", - "engines": { - "node": ">=6.0.0" - } - }, "node_modules/@jridgewell/sourcemap-codec": { "version": "1.5.0", "resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.5.0.tgz", @@ -3454,9 +3436,9 @@ "license": "MIT" }, "node_modules/@jridgewell/trace-mapping": { - "version": "0.3.25", - "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.25.tgz", - "integrity": "sha512-vNk6aEwybGtawWmy/PzwnGDOjCkLWSD2wqvjGGAgOAwCGWySYXfYoxt00IJkTF+8Lb57DwOb3Aa0o9CApepiYQ==", + "version": "0.3.29", + "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.29.tgz", + "integrity": "sha512-uw6guiW/gcAGPDhLmd77/6lW8QLeiV5RUTsAX46Db6oLhGaVj4lhnPwb184s1bkc8kdVg/+h988dro8GRDpmYQ==", "dev": true, "license": "MIT", "dependencies": { @@ -3550,9 +3532,9 @@ } }, "node_modules/@lmdb/lmdb-darwin-arm64": { - "version": "3.3.0", - "resolved": "https://registry.npmjs.org/@lmdb/lmdb-darwin-arm64/-/lmdb-darwin-arm64-3.3.0.tgz", - "integrity": "sha512-LipbQobyEfQtu8WixasaFUZZ+JCGlho4OWwWIQ5ol0rB1RKkcZvypu7sS1CBvofBGVAa3vbOh8IOGQMrbmL5dg==", + "version": "3.4.1", + "resolved": "https://registry.npmjs.org/@lmdb/lmdb-darwin-arm64/-/lmdb-darwin-arm64-3.4.1.tgz", + "integrity": "sha512-kKeP5PaY3bFrrF6GY5aDd96iuh1eoS+5CHJ+7hIP629KIEwzGNwbIzBmEX9TAhRJOivSRDTHCIsbu//+NsYKkg==", "cpu": [ "arm64" ], @@ -3564,9 +3546,9 @@ ] }, "node_modules/@lmdb/lmdb-darwin-x64": { - "version": "3.3.0", - "resolved": "https://registry.npmjs.org/@lmdb/lmdb-darwin-x64/-/lmdb-darwin-x64-3.3.0.tgz", - "integrity": "sha512-yA+9P+ZeA3vg76BLXWeUomIAjxfmSmR2eg8fueHXDg5Xe1Xmkl9JCKuHXUhtJ+mMVcH12d5k4kJBLbyXTadfGQ==", + "version": "3.4.1", + "resolved": "https://registry.npmjs.org/@lmdb/lmdb-darwin-x64/-/lmdb-darwin-x64-3.4.1.tgz", + "integrity": "sha512-9CMB3seTyHs3EOVWdKiB8IIEDBJ3Gq00Tqyi0V7DS3HL90BjM/AkbZGuhzXwPrfeFazR24SKaRrUQF74f+CmWw==", "cpu": [ "x64" ], @@ -3578,9 +3560,9 @@ ] }, "node_modules/@lmdb/lmdb-linux-arm": { - "version": "3.3.0", - "resolved": "https://registry.npmjs.org/@lmdb/lmdb-linux-arm/-/lmdb-linux-arm-3.3.0.tgz", - "integrity": "sha512-EDYrW9kle+8wI19JCj/PhRnGoCN9bked5cdOPdo1wdgH/HzjgoLPFTn9DHlZccgTEVhp3O+bpWXdN/rWySVvjw==", + "version": "3.4.1", + "resolved": "https://registry.npmjs.org/@lmdb/lmdb-linux-arm/-/lmdb-linux-arm-3.4.1.tgz", + "integrity": "sha512-1Mi69vU0akHgCI7tF6YbimPaNEKJiBm/p5A+aM8egr0joj27cQmCCOm2mZQ+Ht2BqmCfZaIgQnMg4gFYNMlpCA==", "cpu": [ "arm" ], @@ -3592,9 +3574,9 @@ ] }, "node_modules/@lmdb/lmdb-linux-arm64": { - "version": "3.3.0", - "resolved": "https://registry.npmjs.org/@lmdb/lmdb-linux-arm64/-/lmdb-linux-arm64-3.3.0.tgz", - "integrity": "sha512-OeWvSgjXXZ/zmtLqqL78I3910F6UYpUubmsUU+iBHo6nTtjkpXms95rJtGrjkWQqwswKBD7xSMplbYC4LEsiPA==", + "version": "3.4.1", + "resolved": "https://registry.npmjs.org/@lmdb/lmdb-linux-arm64/-/lmdb-linux-arm64-3.4.1.tgz", + "integrity": "sha512-d0vuXOdoKjHHJYZ/CRWopnkOiUpev+bgBBW+1tXtWsYWUj8uxl9ZmTBEmsL5mjUlpQDrlYiJSrhOU1hg5QWBSw==", "cpu": [ "arm64" ], @@ -3606,9 +3588,9 @@ ] }, "node_modules/@lmdb/lmdb-linux-x64": { - "version": "3.3.0", - "resolved": "https://registry.npmjs.org/@lmdb/lmdb-linux-x64/-/lmdb-linux-x64-3.3.0.tgz", - "integrity": "sha512-wDd02mt5ScX4+xd6g78zKBr6ojpgCJCTrllCAabjgap5FzuETqOqaQfKhO+tJuGWv/J5q+GIds6uY7rNFueOxg==", + "version": "3.4.1", + "resolved": "https://registry.npmjs.org/@lmdb/lmdb-linux-x64/-/lmdb-linux-x64-3.4.1.tgz", + "integrity": "sha512-00RbEpvfnyPodlICiGFuiOmyvWaL9nzCRSqZz82BVFsGTiSQnnF0gpD1C8tO6OvtptELbtRuM7BS9f97LcowZw==", "cpu": [ "x64" ], @@ -3620,9 +3602,9 @@ ] }, "node_modules/@lmdb/lmdb-win32-arm64": { - "version": "3.3.0", - "resolved": "https://registry.npmjs.org/@lmdb/lmdb-win32-arm64/-/lmdb-win32-arm64-3.3.0.tgz", - "integrity": "sha512-COotWhHJgzXULLiEjOgWQwqig6PoA+6ji6W+sDl6M1HhMXWIymEVHGs0edsVSNtsNSCAWMxJgR3asv6FNX/2EA==", + "version": "3.4.1", + "resolved": "https://registry.npmjs.org/@lmdb/lmdb-win32-arm64/-/lmdb-win32-arm64-3.4.1.tgz", + "integrity": "sha512-4h8tm3i1ODf+28UyqQZLP7c2jmRM26AyEEyYp994B4GiBdGvGAsYUu3oiHANYK9xFpvLuFzyGeqFm1kdNC0D1A==", "cpu": [ "arm64" ], @@ -3634,9 +3616,9 @@ ] }, "node_modules/@lmdb/lmdb-win32-x64": { - "version": "3.3.0", - "resolved": "https://registry.npmjs.org/@lmdb/lmdb-win32-x64/-/lmdb-win32-x64-3.3.0.tgz", - "integrity": "sha512-kqUgQH+l8HDbkAapx+aoko7Ez4X4DqkIraOqY/k0QY5EN/iialVlFpBUXh4wFXzirdmEVjbIUMrceUh0Kh8LeA==", + "version": "3.4.1", + "resolved": "https://registry.npmjs.org/@lmdb/lmdb-win32-x64/-/lmdb-win32-x64-3.4.1.tgz", + "integrity": "sha512-HqqKIhTbq6piJhkJpTTf3w1m/CgrmwXRAL9R9j7Ru5xdZSeO7Mg4AWiBC9B00uXR+LvVZKtUyRMVZfhmIZztmQ==", "cpu": [ "x64" ], @@ -3661,6 +3643,96 @@ "ws": "^7.4.5" } }, + "node_modules/@modelcontextprotocol/sdk": { + "version": "1.13.3", + "resolved": "https://registry.npmjs.org/@modelcontextprotocol/sdk/-/sdk-1.13.3.tgz", + "integrity": "sha512-bGwA78F/U5G2jrnsdRkPY3IwIwZeWUEfb5o764b79lb0rJmMT76TLwKhdNZOWakOQtedYefwIR4emisEMvInKA==", + "dev": true, + "license": "MIT", + "dependencies": { + "ajv": "^6.12.6", + "content-type": "^1.0.5", + "cors": "^2.8.5", + "cross-spawn": "^7.0.5", + "eventsource": "^3.0.2", + "eventsource-parser": "^3.0.0", + "express": "^5.0.1", + "express-rate-limit": "^7.5.0", + "pkce-challenge": "^5.0.0", + "raw-body": "^3.0.0", + "zod": "^3.23.8", + "zod-to-json-schema": "^3.24.1" + }, + "engines": { + "node": ">=18" + } + }, + "node_modules/@modelcontextprotocol/sdk/node_modules/ajv": { + "version": "6.12.6", + "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.6.tgz", + "integrity": "sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g==", + "dev": true, + "license": "MIT", + "dependencies": { + "fast-deep-equal": "^3.1.1", + "fast-json-stable-stringify": "^2.0.0", + "json-schema-traverse": "^0.4.1", + "uri-js": "^4.2.2" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/epoberezkin" + } + }, + "node_modules/@modelcontextprotocol/sdk/node_modules/eventsource": { + "version": "3.0.7", + "resolved": "https://registry.npmjs.org/eventsource/-/eventsource-3.0.7.tgz", + "integrity": "sha512-CRT1WTyuQoD771GW56XEZFQ/ZoSfWid1alKGDYMmkt2yl8UXrVR4pspqWNEcqKvVIzg6PAltWjxcSSPrboA4iA==", + "dev": true, + "license": "MIT", + "dependencies": { + "eventsource-parser": "^3.0.1" + }, + "engines": { + "node": ">=18.0.0" + } + }, + "node_modules/@modelcontextprotocol/sdk/node_modules/iconv-lite": { + "version": "0.6.3", + "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.6.3.tgz", + "integrity": "sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==", + "dev": true, + "license": "MIT", + "dependencies": { + "safer-buffer": ">= 2.1.2 < 3.0.0" + }, + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/@modelcontextprotocol/sdk/node_modules/json-schema-traverse": { + "version": "0.4.1", + "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz", + "integrity": "sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg==", + "dev": true, + "license": "MIT" + }, + "node_modules/@modelcontextprotocol/sdk/node_modules/raw-body": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-3.0.0.tgz", + "integrity": "sha512-RmkhL8CAyCRPXCE28MMH0z2PNWQBNk2Q09ZdxM9IOOXwxwZbN+qbWaatPkdkWIKL2ZVDImrN/pK5HTRz2PcS4g==", + "dev": true, + "license": "MIT", + "dependencies": { + "bytes": "3.1.2", + "http-errors": "2.0.0", + "iconv-lite": "0.6.3", + "unpipe": "1.0.0" + }, + "engines": { + "node": ">= 0.8" + } + }, "node_modules/@msgpackr-extract/msgpackr-extract-darwin-arm64": { "version": "3.0.3", "resolved": "https://registry.npmjs.org/@msgpackr-extract/msgpackr-extract-darwin-arm64/-/msgpackr-extract-darwin-arm64-3.0.3.tgz", @@ -4823,9 +4895,9 @@ } }, "node_modules/@rollup/rollup-android-arm-eabi": { - "version": "4.40.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.40.2.tgz", - "integrity": "sha512-JkdNEq+DFxZfUwxvB58tHMHBHVgX23ew41g1OQinthJ+ryhdRk67O31S7sYw8u2lTjHUPFxwar07BBt1KHp/hg==", + "version": "4.44.1", + "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.44.1.tgz", + "integrity": "sha512-JAcBr1+fgqx20m7Fwe1DxPUl/hPkee6jA6Pl7n1v2EFiktAHenTaXl5aIFjUIEsfn9w3HE4gK1lEgNGMzBDs1w==", "cpu": [ "arm" ], @@ -4837,9 +4909,9 @@ ] }, "node_modules/@rollup/rollup-android-arm64": { - "version": "4.40.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.40.2.tgz", - "integrity": "sha512-13unNoZ8NzUmnndhPTkWPWbX3vtHodYmy+I9kuLxN+F+l+x3LdVF7UCu8TWVMt1POHLh6oDHhnOA04n8oJZhBw==", + "version": "4.44.1", + "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.44.1.tgz", + "integrity": "sha512-RurZetXqTu4p+G0ChbnkwBuAtwAbIwJkycw1n6GvlGlBuS4u5qlr5opix8cBAYFJgaY05TWtM+LaoFggUmbZEQ==", "cpu": [ "arm64" ], @@ -4851,9 +4923,9 @@ ] }, "node_modules/@rollup/rollup-darwin-arm64": { - "version": "4.40.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.40.2.tgz", - "integrity": "sha512-Gzf1Hn2Aoe8VZzevHostPX23U7N5+4D36WJNHK88NZHCJr7aVMG4fadqkIf72eqVPGjGc0HJHNuUaUcxiR+N/w==", + "version": "4.44.1", + "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.44.1.tgz", + "integrity": "sha512-fM/xPesi7g2M7chk37LOnmnSTHLG/v2ggWqKj3CCA1rMA4mm5KVBT1fNoswbo1JhPuNNZrVwpTvlCVggv8A2zg==", "cpu": [ "arm64" ], @@ -4865,9 +4937,9 @@ ] }, "node_modules/@rollup/rollup-darwin-x64": { - "version": "4.40.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.40.2.tgz", - "integrity": "sha512-47N4hxa01a4x6XnJoskMKTS8XZ0CZMd8YTbINbi+w03A2w4j1RTlnGHOz/P0+Bg1LaVL6ufZyNprSg+fW5nYQQ==", + "version": "4.44.1", + "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.44.1.tgz", + "integrity": "sha512-gDnWk57urJrkrHQ2WVx9TSVTH7lSlU7E3AFqiko+bgjlh78aJ88/3nycMax52VIVjIm3ObXnDL2H00e/xzoipw==", "cpu": [ "x64" ], @@ -4879,9 +4951,9 @@ ] }, "node_modules/@rollup/rollup-freebsd-arm64": { - "version": "4.40.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-arm64/-/rollup-freebsd-arm64-4.40.2.tgz", - "integrity": "sha512-8t6aL4MD+rXSHHZUR1z19+9OFJ2rl1wGKvckN47XFRVO+QL/dUSpKA2SLRo4vMg7ELA8pzGpC+W9OEd1Z/ZqoQ==", + "version": "4.44.1", + "resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-arm64/-/rollup-freebsd-arm64-4.44.1.tgz", + "integrity": "sha512-wnFQmJ/zPThM5zEGcnDcCJeYJgtSLjh1d//WuHzhf6zT3Md1BvvhJnWoy+HECKu2bMxaIcfWiu3bJgx6z4g2XA==", "cpu": [ "arm64" ], @@ -4893,9 +4965,9 @@ ] }, "node_modules/@rollup/rollup-freebsd-x64": { - "version": "4.40.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-x64/-/rollup-freebsd-x64-4.40.2.tgz", - "integrity": "sha512-C+AyHBzfpsOEYRFjztcYUFsH4S7UsE9cDtHCtma5BK8+ydOZYgMmWg1d/4KBytQspJCld8ZIujFMAdKG1xyr4Q==", + "version": "4.44.1", + "resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-x64/-/rollup-freebsd-x64-4.44.1.tgz", + "integrity": "sha512-uBmIxoJ4493YATvU2c0upGz87f99e3wop7TJgOA/bXMFd2SvKCI7xkxY/5k50bv7J6dw1SXT4MQBQSLn8Bb/Uw==", "cpu": [ "x64" ], @@ -4907,9 +4979,9 @@ ] }, "node_modules/@rollup/rollup-linux-arm-gnueabihf": { - "version": "4.40.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.40.2.tgz", - "integrity": "sha512-de6TFZYIvJwRNjmW3+gaXiZ2DaWL5D5yGmSYzkdzjBDS3W+B9JQ48oZEsmMvemqjtAFzE16DIBLqd6IQQRuG9Q==", + "version": "4.44.1", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.44.1.tgz", + "integrity": "sha512-n0edDmSHlXFhrlmTK7XBuwKlG5MbS7yleS1cQ9nn4kIeW+dJH+ExqNgQ0RrFRew8Y+0V/x6C5IjsHrJmiHtkxQ==", "cpu": [ "arm" ], @@ -4921,9 +4993,9 @@ ] }, "node_modules/@rollup/rollup-linux-arm-musleabihf": { - "version": "4.40.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-musleabihf/-/rollup-linux-arm-musleabihf-4.40.2.tgz", - "integrity": "sha512-urjaEZubdIkacKc930hUDOfQPysezKla/O9qV+O89enqsqUmQm8Xj8O/vh0gHg4LYfv7Y7UsE3QjzLQzDYN1qg==", + "version": "4.44.1", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-musleabihf/-/rollup-linux-arm-musleabihf-4.44.1.tgz", + "integrity": "sha512-8WVUPy3FtAsKSpyk21kV52HCxB+me6YkbkFHATzC2Yd3yuqHwy2lbFL4alJOLXKljoRw08Zk8/xEj89cLQ/4Nw==", "cpu": [ "arm" ], @@ -4935,9 +5007,9 @@ ] }, "node_modules/@rollup/rollup-linux-arm64-gnu": { - "version": "4.40.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.40.2.tgz", - "integrity": "sha512-KlE8IC0HFOC33taNt1zR8qNlBYHj31qGT1UqWqtvR/+NuCVhfufAq9fxO8BMFC22Wu0rxOwGVWxtCMvZVLmhQg==", + "version": "4.44.1", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.44.1.tgz", + "integrity": "sha512-yuktAOaeOgorWDeFJggjuCkMGeITfqvPgkIXhDqsfKX8J3jGyxdDZgBV/2kj/2DyPaLiX6bPdjJDTu9RB8lUPQ==", "cpu": [ "arm64" ], @@ -4949,9 +5021,9 @@ ] }, "node_modules/@rollup/rollup-linux-arm64-musl": { - "version": "4.40.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.40.2.tgz", - "integrity": "sha512-j8CgxvfM0kbnhu4XgjnCWJQyyBOeBI1Zq91Z850aUddUmPeQvuAy6OiMdPS46gNFgy8gN1xkYyLgwLYZG3rBOg==", + "version": "4.44.1", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.44.1.tgz", + "integrity": "sha512-W+GBM4ifET1Plw8pdVaecwUgxmiH23CfAUj32u8knq0JPFyK4weRy6H7ooxYFD19YxBulL0Ktsflg5XS7+7u9g==", "cpu": [ "arm64" ], @@ -4963,9 +5035,9 @@ ] }, "node_modules/@rollup/rollup-linux-loongarch64-gnu": { - "version": "4.40.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-loongarch64-gnu/-/rollup-linux-loongarch64-gnu-4.40.2.tgz", - "integrity": "sha512-Ybc/1qUampKuRF4tQXc7G7QY9YRyeVSykfK36Y5Qc5dmrIxwFhrOzqaVTNoZygqZ1ZieSWTibfFhQ5qK8jpWxw==", + "version": "4.44.1", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-loongarch64-gnu/-/rollup-linux-loongarch64-gnu-4.44.1.tgz", + "integrity": "sha512-1zqnUEMWp9WrGVuVak6jWTl4fEtrVKfZY7CvcBmUUpxAJ7WcSowPSAWIKa/0o5mBL/Ij50SIf9tuirGx63Ovew==", "cpu": [ "loong64" ], @@ -4977,9 +5049,9 @@ ] }, "node_modules/@rollup/rollup-linux-powerpc64le-gnu": { - "version": "4.40.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-powerpc64le-gnu/-/rollup-linux-powerpc64le-gnu-4.40.2.tgz", - "integrity": "sha512-3FCIrnrt03CCsZqSYAOW/k9n625pjpuMzVfeI+ZBUSDT3MVIFDSPfSUgIl9FqUftxcUXInvFah79hE1c9abD+Q==", + "version": "4.44.1", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-powerpc64le-gnu/-/rollup-linux-powerpc64le-gnu-4.44.1.tgz", + "integrity": "sha512-Rl3JKaRu0LHIx7ExBAAnf0JcOQetQffaw34T8vLlg9b1IhzcBgaIdnvEbbsZq9uZp3uAH+JkHd20Nwn0h9zPjA==", "cpu": [ "ppc64" ], @@ -4991,9 +5063,9 @@ ] }, "node_modules/@rollup/rollup-linux-riscv64-gnu": { - "version": "4.40.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.40.2.tgz", - "integrity": "sha512-QNU7BFHEvHMp2ESSY3SozIkBPaPBDTsfVNGx3Xhv+TdvWXFGOSH2NJvhD1zKAT6AyuuErJgbdvaJhYVhVqrWTg==", + "version": "4.44.1", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.44.1.tgz", + "integrity": "sha512-j5akelU3snyL6K3N/iX7otLBIl347fGwmd95U5gS/7z6T4ftK288jKq3A5lcFKcx7wwzb5rgNvAg3ZbV4BqUSw==", "cpu": [ "riscv64" ], @@ -5005,9 +5077,9 @@ ] }, "node_modules/@rollup/rollup-linux-riscv64-musl": { - "version": "4.40.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-musl/-/rollup-linux-riscv64-musl-4.40.2.tgz", - "integrity": "sha512-5W6vNYkhgfh7URiXTO1E9a0cy4fSgfE4+Hl5agb/U1sa0kjOLMLC1wObxwKxecE17j0URxuTrYZZME4/VH57Hg==", + "version": "4.44.1", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-musl/-/rollup-linux-riscv64-musl-4.44.1.tgz", + "integrity": "sha512-ppn5llVGgrZw7yxbIm8TTvtj1EoPgYUAbfw0uDjIOzzoqlZlZrLJ/KuiE7uf5EpTpCTrNt1EdtzF0naMm0wGYg==", "cpu": [ "riscv64" ], @@ -5019,9 +5091,9 @@ ] }, "node_modules/@rollup/rollup-linux-s390x-gnu": { - "version": "4.40.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-s390x-gnu/-/rollup-linux-s390x-gnu-4.40.2.tgz", - "integrity": "sha512-B7LKIz+0+p348JoAL4X/YxGx9zOx3sR+o6Hj15Y3aaApNfAshK8+mWZEf759DXfRLeL2vg5LYJBB7DdcleYCoQ==", + "version": "4.44.1", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-s390x-gnu/-/rollup-linux-s390x-gnu-4.44.1.tgz", + "integrity": "sha512-Hu6hEdix0oxtUma99jSP7xbvjkUM/ycke/AQQ4EC5g7jNRLLIwjcNwaUy95ZKBJJwg1ZowsclNnjYqzN4zwkAw==", "cpu": [ "s390x" ], @@ -5033,9 +5105,9 @@ ] }, "node_modules/@rollup/rollup-linux-x64-gnu": { - "version": "4.40.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.40.2.tgz", - "integrity": "sha512-lG7Xa+BmBNwpjmVUbmyKxdQJ3Q6whHjMjzQplOs5Z+Gj7mxPtWakGHqzMqNER68G67kmCX9qX57aRsW5V0VOng==", + "version": "4.44.1", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.44.1.tgz", + "integrity": "sha512-EtnsrmZGomz9WxK1bR5079zee3+7a+AdFlghyd6VbAjgRJDbTANJ9dcPIPAi76uG05micpEL+gPGmAKYTschQw==", "cpu": [ "x64" ], @@ -5047,9 +5119,9 @@ ] }, "node_modules/@rollup/rollup-linux-x64-musl": { - "version": "4.40.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.40.2.tgz", - "integrity": "sha512-tD46wKHd+KJvsmije4bUskNuvWKFcTOIM9tZ/RrmIvcXnbi0YK/cKS9FzFtAm7Oxi2EhV5N2OpfFB348vSQRXA==", + "version": "4.44.1", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.44.1.tgz", + "integrity": "sha512-iAS4p+J1az6Usn0f8xhgL4PaU878KEtutP4hqw52I4IO6AGoyOkHCxcc4bqufv1tQLdDWFx8lR9YlwxKuv3/3g==", "cpu": [ "x64" ], @@ -5061,9 +5133,9 @@ ] }, "node_modules/@rollup/rollup-win32-arm64-msvc": { - "version": "4.40.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.40.2.tgz", - "integrity": "sha512-Bjv/HG8RRWLNkXwQQemdsWw4Mg+IJ29LK+bJPW2SCzPKOUaMmPEppQlu/Fqk1d7+DX3V7JbFdbkh/NMmurT6Pg==", + "version": "4.44.1", + "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.44.1.tgz", + "integrity": "sha512-NtSJVKcXwcqozOl+FwI41OH3OApDyLk3kqTJgx8+gp6On9ZEt5mYhIsKNPGuaZr3p9T6NWPKGU/03Vw4CNU9qg==", "cpu": [ "arm64" ], @@ -5075,9 +5147,9 @@ ] }, "node_modules/@rollup/rollup-win32-ia32-msvc": { - "version": "4.40.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.40.2.tgz", - "integrity": "sha512-dt1llVSGEsGKvzeIO76HToiYPNPYPkmjhMHhP00T9S4rDern8P2ZWvWAQUEJ+R1UdMWJ/42i/QqJ2WV765GZcA==", + "version": "4.44.1", + "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.44.1.tgz", + "integrity": "sha512-JYA3qvCOLXSsnTR3oiyGws1Dm0YTuxAAeaYGVlGpUsHqloPcFjPg+X0Fj2qODGLNwQOAcCiQmHub/V007kiH5A==", "cpu": [ "ia32" ], @@ -5089,9 +5161,9 @@ ] }, "node_modules/@rollup/rollup-win32-x64-msvc": { - "version": "4.40.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.40.2.tgz", - "integrity": "sha512-bwspbWB04XJpeElvsp+DCylKfF4trJDa2Y9Go8O6A7YLX2LIKGcNK/CYImJN6ZP4DcuOHB4Utl3iCbnR62DudA==", + "version": "4.44.1", + "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.44.1.tgz", + "integrity": "sha512-J8o22LuF0kTe7m+8PvW9wk3/bRq5+mRo5Dqo6+vXb7otCm3TPhYOJqOaQtGU9YMWQSL3krMnoOxMr0+9E6F3Ug==", "cpu": [ "x64" ], @@ -5123,14 +5195,14 @@ } }, "node_modules/@schematics/angular": { - "version": "20.0.0", - "resolved": "https://registry.npmjs.org/@schematics/angular/-/angular-20.0.0.tgz", - "integrity": "sha512-lK5TvxEoeaoPnxM31qeNWhHUJ3kKMnRHknYhOfOmS8xfme78nS01FdU7TODLkg2p4GNEVVtXoxhj3FmrG3srKw==", + "version": "20.1.0", + "resolved": "https://registry.npmjs.org/@schematics/angular/-/angular-20.1.0.tgz", + "integrity": "sha512-sAEwygjY/j0tvo+EDFUAc54Hfp++K43ISe1/fdCU/M3Pseuf7oPPIm6VxxTrRc6fu4Lp5DBaD/PBkXNt/FqZpg==", "dev": true, "license": "MIT", "dependencies": { - "@angular-devkit/core": "20.0.0", - "@angular-devkit/schematics": "20.0.0", + "@angular-devkit/core": "20.1.0", + "@angular-devkit/schematics": "20.1.0", "jsonc-parser": "3.3.1" }, "engines": { @@ -5704,17 +5776,17 @@ } }, "node_modules/@typescript-eslint/eslint-plugin": { - "version": "8.33.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-8.33.0.tgz", - "integrity": "sha512-CACyQuqSHt7ma3Ns601xykeBK/rDeZa3w6IS6UtMQbixO5DWy+8TilKkviGDH6jtWCo8FGRKEK5cLLkPvEammQ==", + "version": "8.36.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-8.36.0.tgz", + "integrity": "sha512-lZNihHUVB6ZZiPBNgOQGSxUASI7UJWhT8nHyUGCnaQ28XFCw98IfrMCG3rUl1uwUWoAvodJQby2KTs79UTcrAg==", "dev": true, "license": "MIT", "dependencies": { "@eslint-community/regexpp": "^4.10.0", - "@typescript-eslint/scope-manager": "8.33.0", - "@typescript-eslint/type-utils": "8.33.0", - "@typescript-eslint/utils": "8.33.0", - "@typescript-eslint/visitor-keys": "8.33.0", + "@typescript-eslint/scope-manager": "8.36.0", + "@typescript-eslint/type-utils": "8.36.0", + "@typescript-eslint/utils": "8.36.0", + "@typescript-eslint/visitor-keys": "8.36.0", "graphemer": "^1.4.0", "ignore": "^7.0.0", "natural-compare": "^1.4.0", @@ -5728,22 +5800,22 @@ "url": "https://opencollective.com/typescript-eslint" }, "peerDependencies": { - "@typescript-eslint/parser": "^8.33.0", + "@typescript-eslint/parser": "^8.36.0", "eslint": "^8.57.0 || ^9.0.0", "typescript": ">=4.8.4 <5.9.0" } }, "node_modules/@typescript-eslint/parser": { - "version": "8.33.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-8.33.0.tgz", - "integrity": "sha512-JaehZvf6m0yqYp34+RVnihBAChkqeH+tqqhS0GuX1qgPpwLvmTPheKEs6OeCK6hVJgXZHJ2vbjnC9j119auStQ==", + "version": "8.36.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-8.36.0.tgz", + "integrity": "sha512-FuYgkHwZLuPbZjQHzJXrtXreJdFMKl16BFYyRrLxDhWr6Qr7Kbcu2s1Yhu8tsiMXw1S0W1pjfFfYEt+R604s+Q==", "dev": true, "license": "MIT", "dependencies": { - "@typescript-eslint/scope-manager": "8.33.0", - "@typescript-eslint/types": "8.33.0", - "@typescript-eslint/typescript-estree": "8.33.0", - "@typescript-eslint/visitor-keys": "8.33.0", + "@typescript-eslint/scope-manager": "8.36.0", + "@typescript-eslint/types": "8.36.0", + "@typescript-eslint/typescript-estree": "8.36.0", + "@typescript-eslint/visitor-keys": "8.36.0", "debug": "^4.3.4" }, "engines": { @@ -5759,14 +5831,14 @@ } }, "node_modules/@typescript-eslint/project-service": { - "version": "8.33.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/project-service/-/project-service-8.33.0.tgz", - "integrity": "sha512-d1hz0u9l6N+u/gcrk6s6gYdl7/+pp8yHheRTqP6X5hVDKALEaTn8WfGiit7G511yueBEL3OpOEpD+3/MBdoN+A==", + "version": "8.36.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/project-service/-/project-service-8.36.0.tgz", + "integrity": "sha512-JAhQFIABkWccQYeLMrHadu/fhpzmSQ1F1KXkpzqiVxA/iYI6UnRt2trqXHt1sYEcw1mxLnB9rKMsOxXPxowN/g==", "dev": true, "license": "MIT", "dependencies": { - "@typescript-eslint/tsconfig-utils": "^8.33.0", - "@typescript-eslint/types": "^8.33.0", + "@typescript-eslint/tsconfig-utils": "^8.36.0", + "@typescript-eslint/types": "^8.36.0", "debug": "^4.3.4" }, "engines": { @@ -5775,17 +5847,20 @@ "funding": { "type": "opencollective", "url": "https://opencollective.com/typescript-eslint" + }, + "peerDependencies": { + "typescript": ">=4.8.4 <5.9.0" } }, "node_modules/@typescript-eslint/scope-manager": { - "version": "8.33.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-8.33.0.tgz", - "integrity": "sha512-LMi/oqrzpqxyO72ltP+dBSP6V0xiUb4saY7WLtxSfiNEBI8m321LLVFU9/QDJxjDQG9/tjSqKz/E3380TEqSTw==", + "version": "8.36.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-8.36.0.tgz", + "integrity": "sha512-wCnapIKnDkN62fYtTGv2+RY8FlnBYA3tNm0fm91kc2BjPhV2vIjwwozJ7LToaLAyb1ca8BxrS7vT+Pvvf7RvqA==", "dev": true, "license": "MIT", "dependencies": { - "@typescript-eslint/types": "8.33.0", - "@typescript-eslint/visitor-keys": "8.33.0" + "@typescript-eslint/types": "8.36.0", + "@typescript-eslint/visitor-keys": "8.36.0" }, "engines": { "node": "^18.18.0 || ^20.9.0 || >=21.1.0" @@ -5796,9 +5871,9 @@ } }, "node_modules/@typescript-eslint/tsconfig-utils": { - "version": "8.33.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/tsconfig-utils/-/tsconfig-utils-8.33.0.tgz", - "integrity": "sha512-sTkETlbqhEoiFmGr1gsdq5HyVbSOF0145SYDJ/EQmXHtKViCaGvnyLqWFFHtEXoS0J1yU8Wyou2UGmgW88fEug==", + "version": "8.36.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/tsconfig-utils/-/tsconfig-utils-8.36.0.tgz", + "integrity": "sha512-Nhh3TIEgN18mNbdXpd5Q8mSCBnrZQeY9V7Ca3dqYvNDStNIGRmJA6dmrIPMJ0kow3C7gcQbpsG2rPzy1Ks/AnA==", "dev": true, "license": "MIT", "engines": { @@ -5813,14 +5888,14 @@ } }, "node_modules/@typescript-eslint/type-utils": { - "version": "8.33.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/type-utils/-/type-utils-8.33.0.tgz", - "integrity": "sha512-lScnHNCBqL1QayuSrWeqAL5GmqNdVUQAAMTaCwdYEdWfIrSrOGzyLGRCHXcCixa5NK6i5l0AfSO2oBSjCjf4XQ==", + "version": "8.36.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/type-utils/-/type-utils-8.36.0.tgz", + "integrity": "sha512-5aaGYG8cVDd6cxfk/ynpYzxBRZJk7w/ymto6uiyUFtdCozQIsQWh7M28/6r57Fwkbweng8qAzoMCPwSJfWlmsg==", "dev": true, "license": "MIT", "dependencies": { - "@typescript-eslint/typescript-estree": "8.33.0", - "@typescript-eslint/utils": "8.33.0", + "@typescript-eslint/typescript-estree": "8.36.0", + "@typescript-eslint/utils": "8.36.0", "debug": "^4.3.4", "ts-api-utils": "^2.1.0" }, @@ -5837,9 +5912,9 @@ } }, "node_modules/@typescript-eslint/types": { - "version": "8.33.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.33.0.tgz", - "integrity": "sha512-DKuXOKpM5IDT1FA2g9x9x1Ug81YuKrzf4mYX8FAVSNu5Wo/LELHWQyM1pQaDkI42bX15PWl0vNPt1uGiIFUOpg==", + "version": "8.36.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.36.0.tgz", + "integrity": "sha512-xGms6l5cTJKQPZOKM75Dl9yBfNdGeLRsIyufewnxT4vZTrjC0ImQT4fj8QmtJK84F58uSh5HVBSANwcfiXxABQ==", "dev": true, "license": "MIT", "engines": { @@ -5851,16 +5926,16 @@ } }, "node_modules/@typescript-eslint/typescript-estree": { - "version": "8.33.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-8.33.0.tgz", - "integrity": "sha512-vegY4FQoB6jL97Tu/lWRsAiUUp8qJTqzAmENH2k59SJhw0Th1oszb9Idq/FyyONLuNqT1OADJPXfyUNOR8SzAQ==", + "version": "8.36.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-8.36.0.tgz", + "integrity": "sha512-JaS8bDVrfVJX4av0jLpe4ye0BpAaUW7+tnS4Y4ETa3q7NoZgzYbN9zDQTJ8kPb5fQ4n0hliAt9tA4Pfs2zA2Hg==", "dev": true, "license": "MIT", "dependencies": { - "@typescript-eslint/project-service": "8.33.0", - "@typescript-eslint/tsconfig-utils": "8.33.0", - "@typescript-eslint/types": "8.33.0", - "@typescript-eslint/visitor-keys": "8.33.0", + "@typescript-eslint/project-service": "8.36.0", + "@typescript-eslint/tsconfig-utils": "8.36.0", + "@typescript-eslint/types": "8.36.0", + "@typescript-eslint/visitor-keys": "8.36.0", "debug": "^4.3.4", "fast-glob": "^3.3.2", "is-glob": "^4.0.3", @@ -5880,16 +5955,16 @@ } }, "node_modules/@typescript-eslint/utils": { - "version": "8.33.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-8.33.0.tgz", - "integrity": "sha512-lPFuQaLA9aSNa7D5u2EpRiqdAUhzShwGg/nhpBlc4GR6kcTABttCuyjFs8BcEZ8VWrjCBof/bePhP3Q3fS+Yrw==", + "version": "8.36.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-8.36.0.tgz", + "integrity": "sha512-VOqmHu42aEMT+P2qYjylw6zP/3E/HvptRwdn/PZxyV27KhZg2IOszXod4NcXisWzPAGSS4trE/g4moNj6XmH2g==", "dev": true, "license": "MIT", "dependencies": { "@eslint-community/eslint-utils": "^4.7.0", - "@typescript-eslint/scope-manager": "8.33.0", - "@typescript-eslint/types": "8.33.0", - "@typescript-eslint/typescript-estree": "8.33.0" + "@typescript-eslint/scope-manager": "8.36.0", + "@typescript-eslint/types": "8.36.0", + "@typescript-eslint/typescript-estree": "8.36.0" }, "engines": { "node": "^18.18.0 || ^20.9.0 || >=21.1.0" @@ -5904,14 +5979,14 @@ } }, "node_modules/@typescript-eslint/visitor-keys": { - "version": "8.33.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-8.33.0.tgz", - "integrity": "sha512-7RW7CMYoskiz5OOGAWjJFxgb7c5UNjTG292gYhWeOAcFmYCtVCSqjqSBj5zMhxbXo2JOW95YYrUWJfU0zrpaGQ==", + "version": "8.36.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-8.36.0.tgz", + "integrity": "sha512-vZrhV2lRPWDuGoxcmrzRZyxAggPL+qp3WzUrlZD+slFueDiYHxeBa34dUXPuC0RmGKzl4lS5kFJYvKCq9cnNDA==", "dev": true, "license": "MIT", "dependencies": { - "@typescript-eslint/types": "8.33.0", - "eslint-visitor-keys": "^4.2.0" + "@typescript-eslint/types": "8.36.0", + "eslint-visitor-keys": "^4.2.1" }, "engines": { "node": "^18.18.0 || ^20.9.0 || >=21.1.0" @@ -5922,9 +5997,9 @@ } }, "node_modules/@typescript-eslint/visitor-keys/node_modules/eslint-visitor-keys": { - "version": "4.2.0", - "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-4.2.0.tgz", - "integrity": "sha512-UyLnSehNt62FFhSwjZlHmeokpRK59rcz29j+F1/aDgbkbRTk7wIc9XzdoasMUbRNKDM0qQt/+BJ4BrpFeABemw==", + "version": "4.2.1", + "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-4.2.1.tgz", + "integrity": "sha512-Uhdk5sfqcee/9H/rCOJikYz67o0a2Tw2hGRPOG2Y1R2dg7brRe1uG0yaNQDHu+TO/uQPF/5eCapvYSmHUjt7JQ==", "dev": true, "license": "Apache-2.0", "engines": { @@ -5942,16 +6017,16 @@ "license": "ISC" }, "node_modules/@vitejs/plugin-basic-ssl": { - "version": "2.0.0", - "resolved": "https://registry.npmjs.org/@vitejs/plugin-basic-ssl/-/plugin-basic-ssl-2.0.0.tgz", - "integrity": "sha512-gc9Tjg8bUxBVSTzeWT3Njc0Cl3PakHFKdNfABnZWiUgbxqmHDEn7uECv3fHVylxoYgNzAcmU7ZrILz+BwSo3sA==", + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/@vitejs/plugin-basic-ssl/-/plugin-basic-ssl-2.1.0.tgz", + "integrity": "sha512-dOxxrhgyDIEUADhb/8OlV9JIqYLgos03YorAueTIeOUskLJSEsfwCByjbu98ctXitUN3znXKp0bYD/WHSudCeA==", "dev": true, "license": "MIT", "engines": { "node": "^18.0.0 || ^20.0.0 || >=22.0.0" }, "peerDependencies": { - "vite": "^6.0.0" + "vite": "^6.0.0 || ^7.0.0" } }, "node_modules/@yarnpkg/lockfile": { @@ -6003,9 +6078,9 @@ } }, "node_modules/acorn": { - "version": "8.14.1", - "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.14.1.tgz", - "integrity": "sha512-OvQ/2pUDKmgfCg++xsTX1wGxfTaszcHVcTctW4UJB4hibJx2HXxxO5UmVgyjMa+ZDsiaf5wWLXYpRWMmBI0QHg==", + "version": "8.15.0", + "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.15.0.tgz", + "integrity": "sha512-NZyJarBfL7nWwIq+FDL6Zp/yHEhePMNnnJ0y3qfieCrmNvYct8uvtiV41UvlSe6apAfk0fY1FbWx+NwfmpvtTg==", "dev": true, "license": "MIT", "bin": { @@ -8850,29 +8925,6 @@ "dev": true, "license": "MIT" }, - "node_modules/defaults": { - "version": "1.0.4", - "resolved": "https://registry.npmjs.org/defaults/-/defaults-1.0.4.tgz", - "integrity": "sha512-eFuaLoy/Rxalv2kr+lqMlUnrDWV+3j4pljOIJgLIhI058IQfWJ7vXhyEIHu+HtC738klGALYxOKDO0bQP3tg8A==", - "dev": true, - "license": "MIT", - "dependencies": { - "clone": "^1.0.2" - }, - "funding": { - "url": "https://github.com/sponsors/sindresorhus" - } - }, - "node_modules/defaults/node_modules/clone": { - "version": "1.0.4", - "resolved": "https://registry.npmjs.org/clone/-/clone-1.0.4.tgz", - "integrity": "sha512-JQHZ2QMW6l3aH/j6xCqQThY/9OH4D/9ls34cgkUBiEeocRTU04tHfKPBsUK1PqZCUQM7GiA0IIXJSuXHI64Kbg==", - "dev": true, - "license": "MIT", - "engines": { - "node": ">=0.8" - } - }, "node_modules/defer-to-connect": { "version": "1.1.3", "resolved": "https://registry.npmjs.org/defer-to-connect/-/defer-to-connect-1.1.3.tgz", @@ -9926,19 +9978,19 @@ } }, "node_modules/eslint": { - "version": "9.27.0", - "resolved": "https://registry.npmjs.org/eslint/-/eslint-9.27.0.tgz", - "integrity": "sha512-ixRawFQuMB9DZ7fjU3iGGganFDp3+45bPOdaRurcFHSXO1e/sYwUX/FtQZpLZJR6SjMoJH8hR2pPEAfDyCoU2Q==", + "version": "9.31.0", + "resolved": "https://registry.npmjs.org/eslint/-/eslint-9.31.0.tgz", + "integrity": "sha512-QldCVh/ztyKJJZLr4jXNUByx3gR+TDYZCRXEktiZoUR3PGy4qCmSbkxcIle8GEwGpb5JBZazlaJ/CxLidXdEbQ==", "dev": true, "license": "MIT", "dependencies": { "@eslint-community/eslint-utils": "^4.2.0", "@eslint-community/regexpp": "^4.12.1", - "@eslint/config-array": "^0.20.0", - "@eslint/config-helpers": "^0.2.1", - "@eslint/core": "^0.14.0", + "@eslint/config-array": "^0.21.0", + "@eslint/config-helpers": "^0.3.0", + "@eslint/core": "^0.15.0", "@eslint/eslintrc": "^3.3.1", - "@eslint/js": "9.27.0", + "@eslint/js": "9.31.0", "@eslint/plugin-kit": "^0.3.1", "@humanfs/node": "^0.16.6", "@humanwhocodes/module-importer": "^1.0.1", @@ -9950,9 +10002,9 @@ "cross-spawn": "^7.0.6", "debug": "^4.3.2", "escape-string-regexp": "^4.0.0", - "eslint-scope": "^8.3.0", - "eslint-visitor-keys": "^4.2.0", - "espree": "^10.3.0", + "eslint-scope": "^8.4.0", + "eslint-visitor-keys": "^4.2.1", + "espree": "^10.4.0", "esquery": "^1.5.0", "esutils": "^2.0.2", "fast-deep-equal": "^3.1.3", @@ -9987,9 +10039,9 @@ } }, "node_modules/eslint-scope": { - "version": "8.3.0", - "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-8.3.0.tgz", - "integrity": "sha512-pUNxi75F8MJ/GdeKtVLSbYg4ZI34J6C0C7sbL4YOp2exGwen7ZsuBqKzUhXd0qMQ362yET3z+uPwKeg/0C2XCQ==", + "version": "8.4.0", + "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-8.4.0.tgz", + "integrity": "sha512-sNXOfKCn74rt8RICKMvJS7XKV/Xk9kA7DyJr8mJik3S7Cwgy3qlkkmyS2uQB3jiJg6VNdZd/pDBJu0nvG2NlTg==", "dev": true, "license": "BSD-2-Clause", "dependencies": { @@ -10016,6 +10068,19 @@ "url": "https://opencollective.com/eslint" } }, + "node_modules/eslint/node_modules/@eslint/core": { + "version": "0.15.1", + "resolved": "https://registry.npmjs.org/@eslint/core/-/core-0.15.1.tgz", + "integrity": "sha512-bkOp+iumZCCbt1K1CmWf0R9pM5yKpDv+ZXtvSyQpudrI9kuFLp+bM2WOPXImuD/ceQuaa8f5pj93Y7zyECIGNA==", + "dev": true, + "license": "Apache-2.0", + "dependencies": { + "@types/json-schema": "^7.0.15" + }, + "engines": { + "node": "^18.18.0 || ^20.9.0 || >=21.1.0" + } + }, "node_modules/eslint/node_modules/ajv": { "version": "6.12.6", "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.6.tgz", @@ -10045,9 +10110,9 @@ } }, "node_modules/eslint/node_modules/eslint-visitor-keys": { - "version": "4.2.0", - "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-4.2.0.tgz", - "integrity": "sha512-UyLnSehNt62FFhSwjZlHmeokpRK59rcz29j+F1/aDgbkbRTk7wIc9XzdoasMUbRNKDM0qQt/+BJ4BrpFeABemw==", + "version": "4.2.1", + "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-4.2.1.tgz", + "integrity": "sha512-Uhdk5sfqcee/9H/rCOJikYz67o0a2Tw2hGRPOG2Y1R2dg7brRe1uG0yaNQDHu+TO/uQPF/5eCapvYSmHUjt7JQ==", "dev": true, "license": "Apache-2.0", "engines": { @@ -10088,15 +10153,15 @@ } }, "node_modules/espree": { - "version": "10.3.0", - "resolved": "https://registry.npmjs.org/espree/-/espree-10.3.0.tgz", - "integrity": "sha512-0QYC8b24HWY8zjRnDTL6RiHfDbAWn63qb4LMj1Z4b076A4une81+z03Kg7l7mn/48PUTqoLptSXez8oknU8Clg==", + "version": "10.4.0", + "resolved": "https://registry.npmjs.org/espree/-/espree-10.4.0.tgz", + "integrity": "sha512-j6PAQ2uUr79PZhBjP5C5fhl8e39FmRnOjsD5lGnWrFU8i2G776tBK7+nP8KuQUTTyAZUwfQqXAgrVH5MbH9CYQ==", "dev": true, "license": "BSD-2-Clause", "dependencies": { - "acorn": "^8.14.0", + "acorn": "^8.15.0", "acorn-jsx": "^5.3.2", - "eslint-visitor-keys": "^4.2.0" + "eslint-visitor-keys": "^4.2.1" }, "engines": { "node": "^18.18.0 || ^20.9.0 || >=21.1.0" @@ -10106,9 +10171,9 @@ } }, "node_modules/espree/node_modules/eslint-visitor-keys": { - "version": "4.2.0", - "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-4.2.0.tgz", - "integrity": "sha512-UyLnSehNt62FFhSwjZlHmeokpRK59rcz29j+F1/aDgbkbRTk7wIc9XzdoasMUbRNKDM0qQt/+BJ4BrpFeABemw==", + "version": "4.2.1", + "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-4.2.1.tgz", + "integrity": "sha512-Uhdk5sfqcee/9H/rCOJikYz67o0a2Tw2hGRPOG2Y1R2dg7brRe1uG0yaNQDHu+TO/uQPF/5eCapvYSmHUjt7JQ==", "dev": true, "license": "Apache-2.0", "engines": { @@ -10221,6 +10286,16 @@ "node": ">=12.0.0" } }, + "node_modules/eventsource-parser": { + "version": "3.0.3", + "resolved": "https://registry.npmjs.org/eventsource-parser/-/eventsource-parser-3.0.3.tgz", + "integrity": "sha512-nVpZkTMM9rF6AQ9gPJpFsNAMt48wIzB5TQgiTLdHiuO8XEDhUgZEhqKlZWXbIzo9VmJ/HvysHqEaVeD5v9TPvA==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=20.0.0" + } + }, "node_modules/expand-tilde": { "version": "2.0.2", "resolved": "https://registry.npmjs.org/expand-tilde/-/expand-tilde-2.0.2.tgz", @@ -10283,6 +10358,22 @@ "url": "https://opencollective.com/express" } }, + "node_modules/express-rate-limit": { + "version": "7.5.1", + "resolved": "https://registry.npmjs.org/express-rate-limit/-/express-rate-limit-7.5.1.tgz", + "integrity": "sha512-7iN8iPMDzOMHPUYllBEsQdWVB6fPDMPqwjBaFrgr4Jgr/+okjvzAy+UHlYYL/Vs0OsOrMkwS6PJDkFlJwoxUnw==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">= 16" + }, + "funding": { + "url": "https://github.com/sponsors/express-rate-limit" + }, + "peerDependencies": { + "express": ">= 4.11" + } + }, "node_modules/express/node_modules/accepts": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/accepts/-/accepts-2.0.0.tgz", @@ -10610,9 +10701,9 @@ } }, "node_modules/fdir": { - "version": "6.4.5", - "resolved": "https://registry.npmjs.org/fdir/-/fdir-6.4.5.tgz", - "integrity": "sha512-4BG7puHpVsIYxZUbiUE3RqGloLaSSwzYie5jvasC4LWuBWzZawynvYouhjbQKw2JuIGYdm0DzIxl8iVidKlUEw==", + "version": "6.4.6", + "resolved": "https://registry.npmjs.org/fdir/-/fdir-6.4.6.tgz", + "integrity": "sha512-hiFoqpyZcfNm1yc4u8oWCf9A2c4D3QjCrks3zmoVKVxpQRzmPNar1hUJcBG2RQHvEVGDN+Jm81ZheVLAQMK6+w==", "dev": true, "license": "MIT", "peerDependencies": { @@ -11374,16 +11465,6 @@ "which": "bin/which" } }, - "node_modules/globals": { - "version": "11.12.0", - "resolved": "https://registry.npmjs.org/globals/-/globals-11.12.0.tgz", - "integrity": "sha512-WOBp/EEGUiIsJSp7wcv/y6MO+lV9UoncWqxuFfm8eBwzWNgyfBd6Gz+IeKQ9jCmyhoH99g15M3T+QaVHFjizVA==", - "dev": true, - "license": "MIT", - "engines": { - "node": ">=4" - } - }, "node_modules/globby": { "version": "13.2.2", "resolved": "https://registry.npmjs.org/globby/-/globby-13.2.2.tgz", @@ -12998,9 +13079,9 @@ } }, "node_modules/ignore": { - "version": "7.0.4", - "resolved": "https://registry.npmjs.org/ignore/-/ignore-7.0.4.tgz", - "integrity": "sha512-gJzzk+PQNznz8ysRrC0aOkBNVRBDtE1n53IqyqEf3PXrYwomFs5q4pGMizBMJF+ykh03insJ27hB8gSrD2Hn8A==", + "version": "7.0.5", + "resolved": "https://registry.npmjs.org/ignore/-/ignore-7.0.5.tgz", + "integrity": "sha512-Hs59xBNfUIunMFgWAbGX5cq6893IbWg4KnrjbYwX3tx0ztorVgTDA6B2sxf8ejHJ4wz8BqGUMYlnzNBer5NvGg==", "dev": true, "license": "MIT", "engines": { @@ -14966,9 +15047,9 @@ } }, "node_modules/lmdb": { - "version": "3.3.0", - "resolved": "https://registry.npmjs.org/lmdb/-/lmdb-3.3.0.tgz", - "integrity": "sha512-MgJocUI6QEiSXQBFWLeyo1R7eQj8Rke5dlPxX0KFwli8/bsCxpM/KbXO5y0qmV/5llQ3wpneDWcTYxa+4vn8iQ==", + "version": "3.4.1", + "resolved": "https://registry.npmjs.org/lmdb/-/lmdb-3.4.1.tgz", + "integrity": "sha512-hoG9RIv42kdGJiieyElgWcKCTaw5S6Jqwyd1gLSVdsJ3+8MVm8e4yLronThiRJI9DazFAAs9xfB9nWeMQ2DWKA==", "dev": true, "hasInstallScript": true, "license": "MIT", @@ -14984,13 +15065,13 @@ "download-lmdb-prebuilds": "bin/download-prebuilds.js" }, "optionalDependencies": { - "@lmdb/lmdb-darwin-arm64": "3.3.0", - "@lmdb/lmdb-darwin-x64": "3.3.0", - "@lmdb/lmdb-linux-arm": "3.3.0", - "@lmdb/lmdb-linux-arm64": "3.3.0", - "@lmdb/lmdb-linux-x64": "3.3.0", - "@lmdb/lmdb-win32-arm64": "3.3.0", - "@lmdb/lmdb-win32-x64": "3.3.0" + "@lmdb/lmdb-darwin-arm64": "3.4.1", + "@lmdb/lmdb-darwin-x64": "3.4.1", + "@lmdb/lmdb-linux-arm": "3.4.1", + "@lmdb/lmdb-linux-arm64": "3.4.1", + "@lmdb/lmdb-linux-x64": "3.4.1", + "@lmdb/lmdb-win32-arm64": "3.4.1", + "@lmdb/lmdb-win32-x64": "3.4.1" } }, "node_modules/locate-path": { @@ -16629,16 +16710,6 @@ "node": ">= 0.6" } }, - "node_modules/mimic-fn": { - "version": "2.1.0", - "resolved": "https://registry.npmjs.org/mimic-fn/-/mimic-fn-2.1.0.tgz", - "integrity": "sha512-OqbOk5oEQeAZ8WXWydlu9HJjz9WVdEIvamMCcXmuqUYjTknH/sqsWvhQ3vgwKFRR1HpjvNBKQ37nbJgYzGqGcg==", - "dev": true, - "license": "MIT", - "engines": { - "node": ">=6" - } - }, "node_modules/mimic-function": { "version": "5.0.1", "resolved": "https://registry.npmjs.org/mimic-function/-/mimic-function-5.0.1.tgz", @@ -17753,9 +17824,9 @@ } }, "node_modules/ordered-binary": { - "version": "1.5.3", - "resolved": "https://registry.npmjs.org/ordered-binary/-/ordered-binary-1.5.3.tgz", - "integrity": "sha512-oGFr3T+pYdTGJ+YFEILMpS3es+GiIbs9h/XQrclBXUtd44ey7XwfsMzM31f64I1SQOawDoDr/D823kNCADI8TA==", + "version": "1.6.0", + "resolved": "https://registry.npmjs.org/ordered-binary/-/ordered-binary-1.6.0.tgz", + "integrity": "sha512-IQh2aMfMIDbPjI/8a3Edr+PiOpcsB7yo8NdW7aHWVaoR/pcDldunMvnnwbk/auPGqmKeAdxtZl7MHX/QmPwhvQ==", "dev": true, "license": "MIT", "optional": true @@ -18366,18 +18437,28 @@ } }, "node_modules/piscina": { - "version": "5.0.0", - "resolved": "https://registry.npmjs.org/piscina/-/piscina-5.0.0.tgz", - "integrity": "sha512-R+arufwL7sZvGjAhSMK3TfH55YdGOqhpKXkcwQJr432AAnJX/xxX19PA4QisrmJ+BTTfZVggaz6HexbkQq1l1Q==", + "version": "5.1.2", + "resolved": "https://registry.npmjs.org/piscina/-/piscina-5.1.2.tgz", + "integrity": "sha512-9cE/BTA/xhDiyNUEj6EKWLEQC17fh/24ydYzQwcA7QdYh75K6kzL2GHvxDF5i9rFGtUaaKk7/u4xp07qiKXccQ==", "dev": true, "license": "MIT", "engines": { - "node": ">=18.x" + "node": ">=20.x" }, "optionalDependencies": { "@napi-rs/nice": "^1.0.1" } }, + "node_modules/pkce-challenge": { + "version": "5.0.0", + "resolved": "https://registry.npmjs.org/pkce-challenge/-/pkce-challenge-5.0.0.tgz", + "integrity": "sha512-ueGLflrrnvwB3xuo/uGob5pd5FN7l0MsLf0Z87o/UQmRtwjvfylfc9MurIxRAWywCYTgrvpXBcqjV4OfCYGCIQ==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=16.20.0" + } + }, "node_modules/pkg-dir": { "version": "8.0.0", "resolved": "https://registry.npmjs.org/pkg-dir/-/pkg-dir-8.0.0.tgz", @@ -18425,9 +18506,9 @@ } }, "node_modules/postcss": { - "version": "8.5.4", - "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.4.tgz", - "integrity": "sha512-QSa9EBe+uwlGTFmHsPKokv3B/oEMQZxfqW0QqNCyhpa6mB1afzulwn8hihglqAb2pOw+BJgNlmXQ8la2VeHB7w==", + "version": "8.5.6", + "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.6.tgz", + "integrity": "sha512-3Ybi1tAuwAP9s0r1UQ2J4n5Y0G05bJkpUIO0/bI9MhwmD70S5aTWbXGBwxHrelT+XM1k6dM0pk+SwNkpTRN7Pg==", "dev": true, "funding": [ { @@ -19701,13 +19782,13 @@ } }, "node_modules/rollup": { - "version": "4.40.2", - "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.40.2.tgz", - "integrity": "sha512-tfUOg6DTP4rhQ3VjOO6B4wyrJnGOX85requAXvqYTHsOgb2TFJdZ3aWpT8W2kPoypSGP7dZUyzxJ9ee4buM5Fg==", + "version": "4.44.1", + "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.44.1.tgz", + "integrity": "sha512-x8H8aPvD+xbl0Do8oez5f5o8eMS3trfCghc4HhLAnCkj7Vl0d1JWGs0UF/D886zLW2rOj2QymV/JcSSsw+XDNg==", "dev": true, "license": "MIT", "dependencies": { - "@types/estree": "1.0.7" + "@types/estree": "1.0.8" }, "bin": { "rollup": "dist/bin/rollup" @@ -19717,26 +19798,26 @@ "npm": ">=8.0.0" }, "optionalDependencies": { - "@rollup/rollup-android-arm-eabi": "4.40.2", - "@rollup/rollup-android-arm64": "4.40.2", - "@rollup/rollup-darwin-arm64": "4.40.2", - "@rollup/rollup-darwin-x64": "4.40.2", - "@rollup/rollup-freebsd-arm64": "4.40.2", - "@rollup/rollup-freebsd-x64": "4.40.2", - "@rollup/rollup-linux-arm-gnueabihf": "4.40.2", - "@rollup/rollup-linux-arm-musleabihf": "4.40.2", - "@rollup/rollup-linux-arm64-gnu": "4.40.2", - "@rollup/rollup-linux-arm64-musl": "4.40.2", - "@rollup/rollup-linux-loongarch64-gnu": "4.40.2", - "@rollup/rollup-linux-powerpc64le-gnu": "4.40.2", - "@rollup/rollup-linux-riscv64-gnu": "4.40.2", - "@rollup/rollup-linux-riscv64-musl": "4.40.2", - "@rollup/rollup-linux-s390x-gnu": "4.40.2", - "@rollup/rollup-linux-x64-gnu": "4.40.2", - "@rollup/rollup-linux-x64-musl": "4.40.2", - "@rollup/rollup-win32-arm64-msvc": "4.40.2", - "@rollup/rollup-win32-ia32-msvc": "4.40.2", - "@rollup/rollup-win32-x64-msvc": "4.40.2", + "@rollup/rollup-android-arm-eabi": "4.44.1", + "@rollup/rollup-android-arm64": "4.44.1", + "@rollup/rollup-darwin-arm64": "4.44.1", + "@rollup/rollup-darwin-x64": "4.44.1", + "@rollup/rollup-freebsd-arm64": "4.44.1", + "@rollup/rollup-freebsd-x64": "4.44.1", + "@rollup/rollup-linux-arm-gnueabihf": "4.44.1", + "@rollup/rollup-linux-arm-musleabihf": "4.44.1", + "@rollup/rollup-linux-arm64-gnu": "4.44.1", + "@rollup/rollup-linux-arm64-musl": "4.44.1", + "@rollup/rollup-linux-loongarch64-gnu": "4.44.1", + "@rollup/rollup-linux-powerpc64le-gnu": "4.44.1", + "@rollup/rollup-linux-riscv64-gnu": "4.44.1", + "@rollup/rollup-linux-riscv64-musl": "4.44.1", + "@rollup/rollup-linux-s390x-gnu": "4.44.1", + "@rollup/rollup-linux-x64-gnu": "4.44.1", + "@rollup/rollup-linux-x64-musl": "4.44.1", + "@rollup/rollup-win32-arm64-msvc": "4.44.1", + "@rollup/rollup-win32-ia32-msvc": "4.44.1", + "@rollup/rollup-win32-x64-msvc": "4.44.1", "fsevents": "~2.3.2" } }, @@ -19763,6 +19844,13 @@ "typescript": "^4.5 || ^5.0" } }, + "node_modules/rollup/node_modules/@types/estree": { + "version": "1.0.8", + "resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.8.tgz", + "integrity": "sha512-dWHzHa2WqEXI/O1E9OjrocMTKJl2mSrEolh1Iomrv6U+JuNwaHXsXx9bLu5gG7BUWFIN0skIQJQ/L1rIex4X6w==", + "dev": true, + "license": "MIT" + }, "node_modules/router": { "version": "2.2.0", "resolved": "https://registry.npmjs.org/router/-/router-2.2.0.tgz", @@ -19936,9 +20024,9 @@ "license": "MIT" }, "node_modules/sass": { - "version": "1.89.0", - "resolved": "https://registry.npmjs.org/sass/-/sass-1.89.0.tgz", - "integrity": "sha512-ld+kQU8YTdGNjOLfRWBzewJpU5cwEv/h5yyqlSeJcj6Yh8U4TDA9UA5FPicqDz/xgRPWRSYIQNiFks21TbA9KQ==", + "version": "1.89.2", + "resolved": "https://registry.npmjs.org/sass/-/sass-1.89.2.tgz", + "integrity": "sha512-xCmtksBKd/jdJ9Bt9p7nPKiuqrlBMBuuGkQlkhZjjQk3Ty48lv93k5Dq6OPkKt4XwxDJ7tvlfrTa1MPA9bf+QA==", "license": "MIT", "dependencies": { "chokidar": "^4.0.0", @@ -23107,9 +23195,9 @@ "license": "MIT" }, "node_modules/tinyglobby": { - "version": "0.2.13", - "resolved": "https://registry.npmjs.org/tinyglobby/-/tinyglobby-0.2.13.tgz", - "integrity": "sha512-mEwzpUgrLySlveBwEVDMKk5B57bhLPYovRfPAXD5gA/98Opn0rCDj3GtLwFvCvH5RK9uPCExUROW5NjDwvqkxw==", + "version": "0.2.14", + "resolved": "https://registry.npmjs.org/tinyglobby/-/tinyglobby-0.2.14.tgz", + "integrity": "sha512-tX5e7OM1HnYr2+a2C/4V0htOcSQcoSTH9KgJnVvNm5zm/cyEWKJ7j7YutsH9CxMdtOkkLFy2AHrMci9IM8IPZQ==", "dev": true, "license": "MIT", "dependencies": { @@ -24632,9 +24720,9 @@ } }, "node_modules/watchpack": { - "version": "2.4.2", - "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-2.4.2.tgz", - "integrity": "sha512-TnbFSbcOCcDgjZ4piURLCbJ3nJhznVh9kw6F6iokjiFPl8ONxe9A6nMDVXDiNbrSfLILs6vB07F7wLBrwPYzJw==", + "version": "2.4.4", + "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-2.4.4.tgz", + "integrity": "sha512-c5EGNOiyxxV5qmTtAB7rbiXxi1ooX1pQKMLX/MIabJjRA0SJBQOjKF+KSVfHkr9U1cADPon0mRiVe/riyaiDUA==", "dev": true, "license": "MIT", "dependencies": { @@ -24645,16 +24733,6 @@ "node": ">=10.13.0" } }, - "node_modules/wcwidth": { - "version": "1.0.1", - "resolved": "https://registry.npmjs.org/wcwidth/-/wcwidth-1.0.1.tgz", - "integrity": "sha512-XHPEwS0q6TaxcvG85+8EYkbiCux2XtWG2mkc47Ng2A77BQu9+DqIOJldST4HgPkuea7dvKSj5VgX3P1d4rW8Tg==", - "dev": true, - "license": "MIT", - "dependencies": { - "defaults": "^1.0.3" - } - }, "node_modules/weak-lru-cache": { "version": "1.2.2", "resolved": "https://registry.npmjs.org/weak-lru-cache/-/weak-lru-cache-1.2.2.tgz", @@ -25105,9 +25183,9 @@ } }, "node_modules/zod": { - "version": "3.25.36", - "resolved": "https://registry.npmjs.org/zod/-/zod-3.25.36.tgz", - "integrity": "sha512-eRFS3i8T0IrpGdL8HQyqFAugGOn7jOjyGgGdtv5NY4Wkhi7lJDk732bNZ609YMIGFbLoaj6J69O1Mura23gfIw==", + "version": "3.25.75", + "resolved": "https://registry.npmjs.org/zod/-/zod-3.25.75.tgz", + "integrity": "sha512-OhpzAmVzabPOL6C3A3gpAifqr9MqihV/Msx3gor2b2kviCgcb+HM9SEOpMWwwNp9MRunWnhtAKUoo0AHhjyPPg==", "dev": true, "license": "MIT", "funding": { diff --git a/package.json b/package.json index 2618786fa6b..c0ab8da76af 100644 --- a/package.json +++ b/package.json @@ -58,17 +58,17 @@ }, "private": true, "dependencies": { - "@angular/animations": "^20.0.0", - "@angular/common": "^20.0.0", - "@angular/compiler": "^20.0.0", - "@angular/core": "^20.0.0", - "@angular/elements": "^20.0.0", - "@angular/forms": "^20.0.0", - "@angular/platform-browser": "^20.0.0", - "@angular/platform-browser-dynamic": "^20.0.0", - "@angular/platform-server": "^20.0.0", - "@angular/router": "^20.0.0", - "@angular/ssr": "^20.0.0", + "@angular/animations": "^20.1.0", + "@angular/common": "^20.1.0", + "@angular/compiler": "^20.1.0", + "@angular/core": "^20.1.0", + "@angular/elements": "^20.1.0", + "@angular/forms": "^20.1.0", + "@angular/platform-browser": "^20.1.0", + "@angular/platform-browser-dynamic": "^20.1.0", + "@angular/platform-server": "^20.1.0", + "@angular/router": "^20.1.0", + "@angular/ssr": "^20.1.0", "@igniteui/material-icons-extended": "^3.1.0", "@lit-labs/ssr-dom-shim": "^1.3.0", "@types/source-map": "0.5.2", @@ -82,16 +82,16 @@ "zone.js": "~0.15.0" }, "devDependencies": { - "@angular-devkit/schematics": "^20.0.0", - "@angular-eslint/builder": "^19.6.0", - "@angular-eslint/eslint-plugin": "^19.6.0", - "@angular-eslint/eslint-plugin-template": "^19.6.0", - "@angular-eslint/schematics": "^19.6.0", - "@angular-eslint/template-parser": "^19.6.0", - "@angular/build": "^20.0.0", - "@angular/cli": "^20.0.0", - "@angular/compiler-cli": "^20.0.0", - "@angular/language-service": "^20.0.0", + "@angular-devkit/schematics": "^20.1.0", + "@angular-eslint/builder": "^20.1.1", + "@angular-eslint/eslint-plugin": "^20.1.1", + "@angular-eslint/eslint-plugin-template": "^20.1.1", + "@angular-eslint/schematics": "^20.1.1", + "@angular-eslint/template-parser": "^20.1.1", + "@angular/build": "^20.1.0", + "@angular/cli": "^20.1.0", + "@angular/compiler-cli": "^20.1.0", + "@angular/language-service": "^20.1.0", "@angularclass/hmr": "^3.0.0", "@microsoft/signalr": "^7.0.12", "@types/estree": "^1.0.0", @@ -102,11 +102,11 @@ "@types/node": "^20.17.6", "@types/sass-true": "^6.0.2", "@types/webpack-env": "^1.18.3", - "@typescript-eslint/eslint-plugin": "^8.15.0", - "@typescript-eslint/parser": "^8.15.0", + "@typescript-eslint/eslint-plugin": "^8.33.1", + "@typescript-eslint/parser": "^8.33.1", "autoprefixer": "^10.4.16", "del": "^6.0.0", - "eslint": "^9.15.0", + "eslint": "^9.28.0", "fs-extra": "^11.3.0", "globby": "^13.2.2", "gulp": "^5.0.0", diff --git a/projects/bundle-test/src/app/form/form.component.ts b/projects/bundle-test/src/app/form/form.component.ts index 3308b98c1f8..4d6adbb4c4a 100644 --- a/projects/bundle-test/src/app/form/form.component.ts +++ b/projects/bundle-test/src/app/form/form.component.ts @@ -1,4 +1,4 @@ -import { Component } from '@angular/core'; +import { Component, inject } from '@angular/core'; import { FormBuilder, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms'; import { IGX_INPUT_GROUP_DIRECTIVES, @@ -22,9 +22,11 @@ import { styleUrls: ['./form.component.scss'] }) export class FormComponent { + private fb = inject(FormBuilder); + public form: FormGroup; - constructor(private fb: FormBuilder) { + constructor() { this.form = this.fb.group({ 'radio': [2, Validators.required], 'checkbox': [false, Validators.required], diff --git a/projects/igniteui-angular-elements/src/app/wrapper/wrapper.component.ts b/projects/igniteui-angular-elements/src/app/wrapper/wrapper.component.ts index bf6fbbc5c0e..b5ea969f472 100644 --- a/projects/igniteui-angular-elements/src/app/wrapper/wrapper.component.ts +++ b/projects/igniteui-angular-elements/src/app/wrapper/wrapper.component.ts @@ -1,4 +1,4 @@ -import { ChangeDetectorRef, Component, QueryList, TemplateRef, ViewChildren } from '@angular/core'; +import { ChangeDetectorRef, Component, QueryList, TemplateRef, ViewChildren, inject } from '@angular/core'; import { Subject } from 'rxjs'; import { TemplateRefWrapper } from './template-ref-wrapper'; @@ -13,6 +13,8 @@ type TemplateFunction = (arg: any) => TemplateResult; imports: [] }) export class TemplateWrapperComponent { + private cdr = inject(ChangeDetectorRef); + public templateFunctions: TemplateFunction[] = []; public templateRendered = new Subject(); @@ -25,8 +27,6 @@ export class TemplateWrapperComponent { */ @ViewChildren(TemplateRef) public templateRefs: QueryList>; - - constructor(private cdr: ChangeDetectorRef) { } protected litRender(container: HTMLElement, templateFunc: (arg: any) => TemplateResult, arg: any) { const part = render(templateFunc(arg), container); diff --git a/projects/igniteui-angular-elements/src/lib/icon.broadcast.service.spec.ts b/projects/igniteui-angular-elements/src/lib/icon.broadcast.service.spec.ts index 7c3ff8ed07f..f445c4943fe 100644 --- a/projects/igniteui-angular-elements/src/lib/icon.broadcast.service.spec.ts +++ b/projects/igniteui-angular-elements/src/lib/icon.broadcast.service.spec.ts @@ -1,6 +1,6 @@ import { ComponentFixture, TestBed } from '@angular/core/testing'; import { ActionType, BroadcastIconsChangeMessage, IgxIconBroadcastService, SvgIcon, } from './icon.broadcast.service'; -import { Component, SecurityContext } from '@angular/core'; +import { Component, SecurityContext, inject } from '@angular/core'; import { IconMeta, IgxIconService } from 'igniteui-angular'; import { wait } from 'igniteui-angular/src/lib/test-utils/ui-interactions.spec'; @@ -111,5 +111,6 @@ describe('Icon broadcast service', () => { providers: [IgxIconBroadcastService, IgxIconService] }) export class BroadcastServiceComponent { - constructor(public iconBroadcast: IgxIconBroadcastService, public iconService: IgxIconService) {} + iconBroadcast = inject(IgxIconBroadcastService); + iconService = inject(IgxIconService); } diff --git a/projects/igniteui-angular-elements/src/lib/icon.broadcast.service.ts b/projects/igniteui-angular-elements/src/lib/icon.broadcast.service.ts index 0ae7f09a676..cebe8e536f6 100644 --- a/projects/igniteui-angular-elements/src/lib/icon.broadcast.service.ts +++ b/projects/igniteui-angular-elements/src/lib/icon.broadcast.service.ts @@ -1,4 +1,4 @@ -import { Injectable, Optional } from '@angular/core'; +import { Injectable, inject } from '@angular/core'; import { PlatformUtil } from '../../../igniteui-angular/src/lib/core/utils'; import { IgxIconService } from '../../../igniteui-angular/src/lib/icon/icon.service'; import { IconMeta } from '../../../igniteui-angular/src/lib/icon/public_api'; @@ -26,12 +26,12 @@ export interface BroadcastIconsChangeMessage { /** @hidden @internal **/ @Injectable() export class IgxIconBroadcastService { + protected _iconService = inject(IgxIconService); + private _platformUtil = inject(PlatformUtil, { optional: true }); + private iconBroadcastChannel: BroadcastChannel | null; - constructor( - protected _iconService: IgxIconService, - @Optional() private _platformUtil: PlatformUtil - ) { + constructor() { if (this._platformUtil?.isBrowser) { this.create(); diff --git a/projects/igniteui-angular-elements/src/lib/state.component.ts b/projects/igniteui-angular-elements/src/lib/state.component.ts index f5a28252bd1..9106e71021a 100644 --- a/projects/igniteui-angular-elements/src/lib/state.component.ts +++ b/projects/igniteui-angular-elements/src/lib/state.component.ts @@ -1,4 +1,4 @@ -import { Component, EnvironmentInjector, EventEmitter, Inject, Injector, Output, ViewContainerRef } from '@angular/core'; +import { Component, EnvironmentInjector, EventEmitter, Injector, Output, ViewContainerRef, inject } from '@angular/core'; import { IPinningConfig, GridType, IGX_GRID_BASE} from '../../../igniteui-angular/src/lib/grids/common/grid.interface'; import { IFilteringExpressionsTree } from '../../../igniteui-angular/src/lib/data-operations/filtering-expressions-tree'; import { IPagingState } from '../../../igniteui-angular/src/lib/data-operations/paging-state.interface'; @@ -50,14 +50,23 @@ export interface IGridStateInfo { standalone: true }) export class IgxGridStateComponent extends IgxGridStateBaseDirective { + protected override viewRef: ViewContainerRef; + protected override envInjector: EnvironmentInjector; + protected override injector: Injector; + + + constructor() { + const grid = inject(IGX_GRID_BASE); + const viewRef = inject(ViewContainerRef); + const envInjector = inject(EnvironmentInjector); + const injector = inject(Injector); - constructor( - @Inject(IGX_GRID_BASE) grid: GridType, - protected override viewRef: ViewContainerRef, protected override envInjector: EnvironmentInjector, - protected override injector: Injector, - ) { super(grid, viewRef, envInjector, injector); - } + + this.viewRef = viewRef; + this.envInjector = envInjector; + this.injector = injector; + } /** * Restores grid features' state based on the IGridStateInfo object passed as an argument. diff --git a/projects/igniteui-angular/src/lib/accordion/accordion.component.ts b/projects/igniteui-angular/src/lib/accordion/accordion.component.ts index 85bffdce5d1..2168ccbdcd3 100644 --- a/projects/igniteui-angular/src/lib/accordion/accordion.component.ts +++ b/projects/igniteui-angular/src/lib/accordion/accordion.component.ts @@ -1,7 +1,4 @@ -import { - AfterContentInit, AfterViewInit, ChangeDetectorRef, Component, ContentChildren, EventEmitter, - HostBinding, Input, OnDestroy, Output, QueryList, booleanAttribute -} from '@angular/core'; +import { AfterContentInit, AfterViewInit, ChangeDetectorRef, Component, ContentChildren, EventEmitter, HostBinding, Input, OnDestroy, Output, QueryList, booleanAttribute, inject } from '@angular/core'; import { fromEvent, Subject } from 'rxjs'; import { takeUntil } from 'rxjs/operators'; import { ACCORDION_NAVIGATION_KEYS } from '../core/utils'; @@ -55,6 +52,8 @@ let NEXT_ID = 0; standalone: true }) export class IgxAccordionComponent implements AfterContentInit, AfterViewInit, OnDestroy { + private cdr = inject(ChangeDetectorRef); + /** * Get/Set the `id` of the accordion component. * Default value is `"igx-accordion-0"`; @@ -216,8 +215,6 @@ export class IgxAccordionComponent implements AfterContentInit, AfterViewInit, O private _enabledPanels!: IgxExpansionPanelComponent[]; private _singleBranchExpand = false; - constructor(private cdr: ChangeDetectorRef) { } - /** @hidden @internal **/ public ngAfterContentInit(): void { this.updatePanelsAnimation(); diff --git a/projects/igniteui-angular/src/lib/action-strip/action-strip.component.ts b/projects/igniteui-angular/src/lib/action-strip/action-strip.component.ts index ff848fa4846..ac50bd8eb6a 100644 --- a/projects/igniteui-angular/src/lib/action-strip/action-strip.component.ts +++ b/projects/igniteui-angular/src/lib/action-strip/action-strip.component.ts @@ -1,20 +1,4 @@ -import { - Component, - Directive, - HostBinding, - Input, - Renderer2, - ViewContainerRef, - ContentChildren, - QueryList, - ViewChild, - TemplateRef, - AfterContentInit, - ChangeDetectorRef, - AfterViewInit, - ElementRef, - booleanAttribute -} from '@angular/core'; +import { Component, Directive, HostBinding, Input, Renderer2, ViewContainerRef, ContentChildren, QueryList, ViewChild, TemplateRef, AfterContentInit, ChangeDetectorRef, AfterViewInit, ElementRef, booleanAttribute, inject } from '@angular/core'; import { ActionStripResourceStringsEN, IActionStripResourceStrings } from '../core/i18n/action-strip-resources'; import { IgxDropDownComponent } from '../drop-down/drop-down.component'; import { CloseScrollStrategy, OverlaySettings } from '../services/public_api'; @@ -35,7 +19,7 @@ import { trackByIdentity } from '../core/utils'; standalone: true }) export class IgxActionStripMenuItemDirective { - constructor(public templateRef: TemplateRef) {} + templateRef = inject>(TemplateRef); } /* blazorElement */ @@ -86,6 +70,11 @@ export class IgxActionStripMenuItemDirective { providers: [{ provide: IgxActionStripToken, useExisting: IgxActionStripComponent }] }) export class IgxActionStripComponent implements IgxActionStripToken, AfterContentInit, AfterViewInit { + private _viewContainer = inject(ViewContainerRef); + private renderer = inject(Renderer2); + protected el = inject(ElementRef); + cdr = inject(ChangeDetectorRef); + /* blazorSuppress */ /** @@ -191,14 +180,6 @@ export class IgxActionStripComponent implements IgxActionStripToken, AfterConten private _resourceStrings = getCurrentResourceStrings(ActionStripResourceStringsEN); private _originalParent!: HTMLElement; - constructor( - private _viewContainer: ViewContainerRef, - private renderer: Renderer2, - protected el: ElementRef, - /** @hidden @internal **/ - public cdr: ChangeDetectorRef, - ) { } - /** * Menu Items list. * diff --git a/projects/igniteui-angular/src/lib/action-strip/grid-actions/grid-actions-base.directive.ts b/projects/igniteui-angular/src/lib/action-strip/grid-actions/grid-actions-base.directive.ts index 75426f93ee2..48f52be91ce 100644 --- a/projects/igniteui-angular/src/lib/action-strip/grid-actions/grid-actions-base.directive.ts +++ b/projects/igniteui-angular/src/lib/action-strip/grid-actions/grid-actions-base.directive.ts @@ -1,5 +1,5 @@ import { IgxGridActionButtonComponent } from './grid-action-button.component'; -import { Directive, Input, AfterViewInit, QueryList, ViewChildren, IterableDiffers, booleanAttribute } from '@angular/core'; +import { Directive, Input, AfterViewInit, QueryList, ViewChildren, IterableDiffers, booleanAttribute, inject } from '@angular/core'; import { IgxActionStripComponent } from '../action-strip.component'; import { IgxRowDirective } from '../../grids/row.directive'; import { IgxIconService } from '../../icon/icon.service'; @@ -14,6 +14,9 @@ import { IgxIconService } from '../../icon/icon.service'; standalone: true }) export class IgxGridActionsBaseDirective implements AfterViewInit { + protected iconService = inject(IgxIconService); + protected differs = inject(IterableDiffers); + /** @hidden @internal **/ @ViewChildren(IgxGridActionButtonComponent) public buttons: QueryList; @@ -51,9 +54,6 @@ export class IgxGridActionsBaseDirective implements AfterViewInit { return this.isRow(this.strip?.context) && !this.strip.context.inEditMode; } - constructor(protected iconService: IgxIconService, - protected differs: IterableDiffers) { } - /** * @hidden * @internal diff --git a/projects/igniteui-angular/src/lib/avatar/avatar.component.ts b/projects/igniteui-angular/src/lib/avatar/avatar.component.ts index 24b10eddfe7..5c651efd110 100644 --- a/projects/igniteui-angular/src/lib/avatar/avatar.component.ts +++ b/projects/igniteui-angular/src/lib/avatar/avatar.component.ts @@ -1,13 +1,5 @@ import { NgTemplateOutlet } from '@angular/common'; -import { - Component, - ElementRef, - HostBinding, - Input, - OnInit, - TemplateRef, - ViewChild -} from '@angular/core'; +import { Component, ElementRef, HostBinding, Input, OnInit, TemplateRef, ViewChild, inject } from '@angular/core'; import { normalizeURI } from '../core/utils'; import { IgxIconComponent } from '../icon/icon.component'; @@ -56,6 +48,8 @@ export type IgxAvatarType = (typeof IgxAvatarType)[keyof typeof IgxAvatarType]; imports: [IgxIconComponent, NgTemplateOutlet] }) export class IgxAvatarComponent implements OnInit { + elementRef = inject(ElementRef); + /** * Returns the `aria-label` attribute of the avatar. * @@ -332,8 +326,6 @@ export class IgxAvatarComponent implements OnInit { } } - constructor(public elementRef: ElementRef) { } - /** * Returns the css url of the image. * diff --git a/projects/igniteui-angular/src/lib/banner/banner.component.ts b/projects/igniteui-angular/src/lib/banner/banner.component.ts index b6055d350a1..61e3584f2bf 100644 --- a/projects/igniteui-angular/src/lib/banner/banner.component.ts +++ b/projects/igniteui-angular/src/lib/banner/banner.component.ts @@ -1,13 +1,4 @@ -import { - Component, - ContentChild, - ElementRef, - EventEmitter, - HostBinding, - Input, - Output, - ViewChild -} from '@angular/core'; +import { Component, ContentChild, ElementRef, EventEmitter, HostBinding, Input, Output, ViewChild, inject } from '@angular/core'; import { IgxIconComponent } from '../icon/icon.component'; import { IToggleView } from '../core/navigation'; @@ -51,6 +42,8 @@ export interface BannerCancelEventArgs extends BannerEventArgs, CancelableEventA imports: [IgxExpansionPanelComponent, IgxExpansionPanelBodyComponent, IgxButtonDirective, IgxRippleDirective] }) export class IgxBannerComponent implements IToggleView { + elementRef = inject>(ElementRef); + /** * @hidden */ @@ -237,8 +230,6 @@ export class IgxBannerComponent implements IToggleView { private _animationSettings: ToggleAnimationSettings; private _resourceStrings = getCurrentResourceStrings(BannerResourceStringsEN); - constructor(public elementRef: ElementRef) { } - /** * Opens the banner * diff --git a/projects/igniteui-angular/src/lib/buttonGroup/buttonGroup.component.ts b/projects/igniteui-angular/src/lib/buttonGroup/buttonGroup.component.ts index 9d78e2fa85a..854013ed2ce 100644 --- a/projects/igniteui-angular/src/lib/buttonGroup/buttonGroup.component.ts +++ b/projects/igniteui-angular/src/lib/buttonGroup/buttonGroup.component.ts @@ -1,19 +1,4 @@ -import { - AfterViewInit, - Component, - ContentChildren, - ChangeDetectorRef, - EventEmitter, - HostBinding, - Input, - Output, - QueryList, - Renderer2, - ViewChildren, - OnDestroy, - ElementRef, - booleanAttribute -} from '@angular/core'; +import { AfterViewInit, Component, ContentChildren, ChangeDetectorRef, EventEmitter, HostBinding, Input, Output, QueryList, Renderer2, ViewChildren, OnDestroy, ElementRef, booleanAttribute, inject } from '@angular/core'; import { Subject } from 'rxjs'; import { IgxButtonDirective } from '../directives/button/button.directive'; import { IgxRippleDirective } from '../directives/ripple/ripple.directive'; @@ -59,6 +44,10 @@ let NEXT_ID = 0; imports: [IgxButtonDirective, IgxRippleDirective, IgxIconComponent] }) export class IgxButtonGroupComponent implements AfterViewInit, OnDestroy { + private _cdr = inject(ChangeDetectorRef); + private _renderer = inject(Renderer2); + private _el = inject(ElementRef); + /** * A collection containing all buttons inside the button group. */ @@ -309,12 +298,6 @@ export class IgxButtonGroupComponent implements AfterViewInit, OnDestroy { subtree: true, }; - constructor( - private _cdr: ChangeDetectorRef, - private _renderer: Renderer2, - private _el: ElementRef - ) {} - /** * Gets the selected button/buttons. * ```typescript diff --git a/projects/igniteui-angular/src/lib/calendar/calendar-base.ts b/projects/igniteui-angular/src/lib/calendar/calendar-base.ts index 94f0a85d2a0..b32572dc15a 100644 --- a/projects/igniteui-angular/src/lib/calendar/calendar-base.ts +++ b/projects/igniteui-angular/src/lib/calendar/calendar-base.ts @@ -1,4 +1,4 @@ -import { Input, Output, EventEmitter, Directive, Inject, LOCALE_ID, HostListener, booleanAttribute, ViewChildren, QueryList, ElementRef, ChangeDetectorRef } from '@angular/core'; +import { Input, Output, EventEmitter, Directive, LOCALE_ID, HostListener, booleanAttribute, ViewChildren, QueryList, ElementRef, ChangeDetectorRef, inject } from '@angular/core'; import { WEEKDAYS, IFormattingOptions, IFormattingViews, IViewDateChangeEventArgs, ScrollDirection, IgxCalendarView, CalendarSelection } from './calendar'; import { ControlValueAccessor } from '@angular/forms'; import { DateRangeDescriptor } from '../core/dates'; @@ -19,6 +19,11 @@ import { CalendarDay } from './common/model'; providers: [KeyboardNavigationService] }) export class IgxCalendarBaseDirective implements ControlValueAccessor { + protected platform = inject(PlatformUtil); + protected _localeId = inject(LOCALE_ID); + protected keyboardNavigation? = inject(KeyboardNavigationService); + protected cdr? = inject(ChangeDetectorRef); + /** * Holds month view index we are operating on. */ @@ -649,13 +654,9 @@ export class IgxCalendarBaseDirective implements ControlValueAccessor { /** * @hidden */ - constructor( - protected platform: PlatformUtil, - @Inject(LOCALE_ID) - protected _localeId: string, - protected keyboardNavigation?: KeyboardNavigationService, - protected cdr?: ChangeDetectorRef, - ) { + constructor() { + const _localeId = this._localeId; + this.locale = _localeId; this.viewDate = this.viewDate ? this.viewDate : new Date(); this.initFormatters(); diff --git a/projects/igniteui-angular/src/lib/calendar/calendar.directives.ts b/projects/igniteui-angular/src/lib/calendar/calendar.directives.ts index 91381fcc2e2..a416b8536ef 100644 --- a/projects/igniteui-angular/src/lib/calendar/calendar.directives.ts +++ b/projects/igniteui-angular/src/lib/calendar/calendar.directives.ts @@ -5,20 +5,7 @@ * * @preferred */ -import { - Directive, - EventEmitter, - HostBinding, - HostListener, - Input, - InjectionToken, - Output, - TemplateRef, - ElementRef, - AfterViewInit, - OnDestroy, - NgZone -} from '@angular/core'; +import { Directive, EventEmitter, HostBinding, HostListener, Input, InjectionToken, Output, TemplateRef, ElementRef, AfterViewInit, OnDestroy, NgZone, inject } from '@angular/core'; import { fromEvent, Subject, interval } from 'rxjs'; import { takeUntil, debounce, tap } from 'rxjs/operators'; import { PlatformUtil } from '../core/utils'; @@ -123,7 +110,7 @@ export class IgxCalendarMonthDirective extends IgxCalendarViewBaseDirective { standalone: true }) export class IgxCalendarHeaderTitleTemplateDirective { - constructor(public template: TemplateRef) { } + template = inject>(TemplateRef); } /** @@ -134,7 +121,7 @@ export class IgxCalendarHeaderTitleTemplateDirective { standalone: true }) export class IgxCalendarHeaderTemplateDirective { - constructor(public template: TemplateRef) { } + template = inject>(TemplateRef); } /** @@ -145,7 +132,7 @@ export class IgxCalendarHeaderTemplateDirective { standalone: true }) export class IgxCalendarSubheaderTemplateDirective { - constructor(public template: TemplateRef) { } + template = inject>(TemplateRef); } /** @@ -156,6 +143,10 @@ export class IgxCalendarSubheaderTemplateDirective { standalone: true }) export class IgxCalendarScrollPageDirective implements AfterViewInit, OnDestroy { + private element = inject(ElementRef); + private zone = inject(NgZone); + protected platform = inject(PlatformUtil); + /** * A callback function to be invoked when increment/decrement page is triggered. * @@ -177,8 +168,6 @@ export class IgxCalendarScrollPageDirective implements AfterViewInit, OnDestroy */ private destroy$ = new Subject(); - constructor(private element: ElementRef, private zone: NgZone, protected platform: PlatformUtil) { } - /** * @hidden */ diff --git a/projects/igniteui-angular/src/lib/calendar/calendar.services.ts b/projects/igniteui-angular/src/lib/calendar/calendar.services.ts index 450f310d1ba..4cc36e3ea05 100644 --- a/projects/igniteui-angular/src/lib/calendar/calendar.services.ts +++ b/projects/igniteui-angular/src/lib/calendar/calendar.services.ts @@ -1,16 +1,14 @@ -import { Injectable, ElementRef, NgZone } from "@angular/core"; +import { Injectable, ElementRef, NgZone, inject } from "@angular/core"; import { EventManager } from "@angular/platform-browser"; @Injectable() export class KeyboardNavigationService { + private eventManager = inject(EventManager); + private ngZone = inject(NgZone); + private keyHandlers = new Map void>(); private eventUnsubscribeFn: Function | null = null; - constructor( - private eventManager: EventManager, - private ngZone: NgZone, - ) {} - public attachKeyboardHandlers(elementRef: ElementRef, context: any) { this.detachKeyboardHandlers(); // Clean up any existing listeners diff --git a/projects/igniteui-angular/src/lib/calendar/days-view/day-item.component.ts b/projects/igniteui-angular/src/lib/calendar/days-view/day-item.component.ts index 5fe28032534..7f1a5513010 100644 --- a/projects/igniteui-angular/src/lib/calendar/days-view/day-item.component.ts +++ b/projects/igniteui-angular/src/lib/calendar/days-view/day-item.component.ts @@ -1,4 +1,4 @@ -import { Component, Input, Output, EventEmitter, HostBinding, ElementRef, booleanAttribute, ChangeDetectionStrategy } from '@angular/core'; +import { Component, Input, Output, EventEmitter, HostBinding, ElementRef, booleanAttribute, ChangeDetectionStrategy, inject } from '@angular/core'; import { CalendarSelection } from '../calendar'; import { DateRangeDescriptor } from '../../core/dates'; import { CalendarDay } from '../common/model' @@ -14,6 +14,8 @@ import { areSameMonth, isNextMonth, isPreviousMonth, isDateInRanges } from '../c standalone: true }) export class IgxDayItemComponent { + private elementRef = inject(ElementRef); + @Input() public date: CalendarDay; @@ -191,6 +193,4 @@ export class IgxDayItemComponent { } private _selected = false; - - constructor(private elementRef: ElementRef) { } } diff --git a/projects/igniteui-angular/src/lib/calendar/days-view/days-view.component.ts b/projects/igniteui-angular/src/lib/calendar/days-view/days-view.component.ts index 173dbbce11d..0c61b06a03d 100644 --- a/projects/igniteui-angular/src/lib/calendar/days-view/days-view.component.ts +++ b/projects/igniteui-angular/src/lib/calendar/days-view/days-view.component.ts @@ -1,19 +1,4 @@ -import { - Component, - Output, - EventEmitter, - Input, - HostListener, - ViewChildren, - QueryList, - HostBinding, - Inject, - LOCALE_ID, - booleanAttribute, - ElementRef, - ChangeDetectorRef, - ChangeDetectionStrategy, -} from '@angular/core'; +import { Component, Output, EventEmitter, Input, HostListener, ViewChildren, QueryList, HostBinding, LOCALE_ID, booleanAttribute, ElementRef, ChangeDetectorRef, ChangeDetectionStrategy, inject } from '@angular/core'; import { NG_VALUE_ACCESSOR } from '@angular/forms'; import { TitleCasePipe } from '@angular/common'; import { CalendarSelection, ScrollDirection } from '../../calendar/calendar'; @@ -48,6 +33,9 @@ let NEXT_ID = 0; imports: [IgxDayItemComponent, TitleCasePipe] }) export class IgxDaysViewComponent extends IgxCalendarBaseDirective { + protected el = inject(ElementRef); + override cdr: ChangeDetectorRef; + #standalone = true; /** @@ -200,13 +188,14 @@ export class IgxDaysViewComponent extends IgxCalendarBaseDirective { /** * @hidden */ - constructor( - platform: PlatformUtil, - @Inject(LOCALE_ID) _localeId: string, - protected el: ElementRef, - public override cdr: ChangeDetectorRef, - ) { + constructor() { + const platform = inject(PlatformUtil); + const _localeId = inject(LOCALE_ID); + const cdr = inject(ChangeDetectorRef); + super(platform, _localeId, null, cdr); + + this.cdr = cdr; } /** diff --git a/projects/igniteui-angular/src/lib/calendar/months-view/months-view.component.ts b/projects/igniteui-angular/src/lib/calendar/months-view/months-view.component.ts index 956e7acc000..6567efb979f 100644 --- a/projects/igniteui-angular/src/lib/calendar/months-view/months-view.component.ts +++ b/projects/igniteui-angular/src/lib/calendar/months-view/months-view.component.ts @@ -1,11 +1,4 @@ -import { - Component, - Input, - HostBinding, - ElementRef, - booleanAttribute, - Inject, -} from "@angular/core"; +import { Component, Input, HostBinding, ElementRef, booleanAttribute, inject } from "@angular/core"; import { IgxCalendarMonthDirective } from "../calendar.directives"; import { TitleCasePipe } from "@angular/common"; import { @@ -36,6 +29,8 @@ let NEXT_ID = 0; imports: [IgxCalendarMonthDirective, TitleCasePipe] }) export class IgxMonthsViewComponent extends IgxCalendarViewDirective implements ControlValueAccessor { + el = inject(ElementRef); + #standalone = true; /** @@ -128,10 +123,9 @@ export class IgxMonthsViewComponent extends IgxCalendarViewDirective implements */ private _monthFormat = "short"; - constructor( - public el: ElementRef, - @Inject(DAY_INTERVAL_TOKEN) dayInterval: DayInterval, - ) { + constructor() { + const dayInterval = inject(DAY_INTERVAL_TOKEN); + super(dayInterval); } diff --git a/projects/igniteui-angular/src/lib/calendar/years-view/years-view.component.ts b/projects/igniteui-angular/src/lib/calendar/years-view/years-view.component.ts index 07fd46a8de5..d9a4927bbb6 100644 --- a/projects/igniteui-angular/src/lib/calendar/years-view/years-view.component.ts +++ b/projects/igniteui-angular/src/lib/calendar/years-view/years-view.component.ts @@ -1,10 +1,4 @@ -import { - Component, - Input, - HostBinding, - ElementRef, - Inject, -} from "@angular/core"; +import { Component, Input, HostBinding, ElementRef, inject } from "@angular/core"; import { IgxCalendarYearDirective } from "../calendar.directives"; import { IgxCalendarViewDirective, @@ -32,6 +26,8 @@ import { calendarRange } from "../common/helpers"; imports: [IgxCalendarYearDirective] }) export class IgxYearsViewComponent extends IgxCalendarViewDirective implements ControlValueAccessor { + el = inject(ElementRef); + #standalone = true; /** @@ -110,10 +106,9 @@ export class IgxYearsViewComponent extends IgxCalendarViewDirective implements C ); } - constructor( - public el: ElementRef, - @Inject(DAY_INTERVAL_TOKEN) dayInterval: DayInterval, - ) { + constructor() { + const dayInterval = inject(DAY_INTERVAL_TOKEN); + super(dayInterval); } diff --git a/projects/igniteui-angular/src/lib/card/card.component.ts b/projects/igniteui-angular/src/lib/card/card.component.ts index 60f713e41ee..28022804727 100644 --- a/projects/igniteui-angular/src/lib/card/card.component.ts +++ b/projects/igniteui-angular/src/lib/card/card.component.ts @@ -1,15 +1,4 @@ -import { - Component, - Directive, - HostBinding, - Optional, - Inject, - Input, - OnInit, - OnChanges, - SimpleChanges, - booleanAttribute -} from '@angular/core'; +import { Component, Directive, HostBinding, Input, OnInit, OnChanges, SimpleChanges, booleanAttribute, inject } from '@angular/core'; let NEXT_ID = 0; @@ -283,6 +272,8 @@ export type IgxCardActionsLayout = (typeof IgxCardActionsLayout)[keyof typeof Ig standalone: true }) export class IgxCardActionsComponent implements OnInit, OnChanges { + card = inject(IgxCardComponent, { optional: true }); + /** * Sets the layout style of the actions. * You can justify the elements slotted in the igx-card-action container @@ -317,8 +308,6 @@ export class IgxCardActionsComponent implements OnInit, OnChanges { private isVerticalSet = false; - constructor(@Optional() @Inject(IgxCardComponent) public card: IgxCardComponent) { } - /** * @hidden * @internal diff --git a/projects/igniteui-angular/src/lib/carousel/carousel.component.ts b/projects/igniteui-angular/src/lib/carousel/carousel.component.ts index 8f740c49d02..a34cbef82f3 100644 --- a/projects/igniteui-angular/src/lib/carousel/carousel.component.ts +++ b/projects/igniteui-angular/src/lib/carousel/carousel.component.ts @@ -1,29 +1,5 @@ import { NgClass, NgTemplateOutlet } from '@angular/common'; -import { - AfterContentInit, - ChangeDetectorRef, - Component, - ContentChild, - ContentChildren, - ElementRef, - EventEmitter, - HostBinding, - HostListener, - Inject, - Injectable, - Input, - IterableChangeRecord, - IterableDiffer, - IterableDiffers, - OnDestroy, - Output, - QueryList, - TemplateRef, - ViewChild, - ViewChildren, - booleanAttribute, - DOCUMENT -} from '@angular/core'; +import { AfterContentInit, ChangeDetectorRef, Component, ContentChild, ContentChildren, ElementRef, EventEmitter, HostBinding, HostListener, Injectable, Input, IterableChangeRecord, IterableDiffer, IterableDiffers, OnDestroy, Output, QueryList, TemplateRef, ViewChild, ViewChildren, booleanAttribute, DOCUMENT, inject } from '@angular/core'; import { HammerGestureConfig, HAMMER_GESTURE_CONFIG } from '@angular/platform-browser'; import { merge, Subject } from 'rxjs'; import { takeUntil } from 'rxjs/operators'; @@ -88,6 +64,12 @@ export class CarouselHammerConfig extends HammerGestureConfig { imports: [IgxButtonDirective, IgxIconComponent, NgClass, NgTemplateOutlet] }) export class IgxCarouselComponent extends IgxCarouselComponentBase implements OnDestroy, AfterContentInit { + private element = inject(ElementRef); + private iterableDiffers = inject(IterableDiffers); + private platformUtil = inject(PlatformUtil); + private dir = inject(IgxDirectionality); + private document = inject(DOCUMENT); + /** * Sets the `id` of the carousel. @@ -565,15 +547,10 @@ export class IgxCarouselComponent extends IgxCarouselComponentBase implements On this.restartInterval(); } - constructor( - cdr: ChangeDetectorRef, - private element: ElementRef, - private iterableDiffers: IterableDiffers, - @Inject(IgxAngularAnimationService) animationService: AnimationService, - private platformUtil: PlatformUtil, - private dir: IgxDirectionality, - @Inject(DOCUMENT) private document: any - ) { + constructor() { + const cdr = inject(ChangeDetectorRef); + const animationService = inject(IgxAngularAnimationService); + super(animationService, cdr); this.differ = this.iterableDiffers.find([]).create(null); } diff --git a/projects/igniteui-angular/src/lib/carousel/slide.component.ts b/projects/igniteui-angular/src/lib/carousel/slide.component.ts index f4c8273eecd..aa9778109dd 100644 --- a/projects/igniteui-angular/src/lib/carousel/slide.component.ts +++ b/projects/igniteui-angular/src/lib/carousel/slide.component.ts @@ -1,4 +1,4 @@ -import { Component, OnDestroy, Input, HostBinding, Output, EventEmitter, ElementRef, AfterContentChecked, booleanAttribute, Inject } from '@angular/core'; +import { Component, OnDestroy, Input, HostBinding, Output, EventEmitter, ElementRef, AfterContentChecked, booleanAttribute, inject } from '@angular/core'; import { Subject } from 'rxjs'; import { Direction, IgxSlideComponentBase } from './carousel-base'; @@ -20,6 +20,8 @@ import { Direction, IgxSlideComponentBase } from './carousel-base'; standalone: true }) export class IgxSlideComponent implements AfterContentChecked, OnDestroy, IgxSlideComponentBase { + private elementRef = inject(ElementRef); + /** * Gets/sets the `index` of the slide inside the carousel. * ```html @@ -130,8 +132,6 @@ export class IgxSlideComponent implements AfterContentChecked, OnDestroy, IgxSli private _active = false; private _destroy$ = new Subject(); - constructor(private elementRef: ElementRef) { } - /** * Returns a reference to the carousel element in the DOM. * ```typescript diff --git a/projects/igniteui-angular/src/lib/checkbox/checkbox-base.directive.ts b/projects/igniteui-angular/src/lib/checkbox/checkbox-base.directive.ts index e2820b92d01..57aa70196c4 100644 --- a/projects/igniteui-angular/src/lib/checkbox/checkbox-base.directive.ts +++ b/projects/igniteui-angular/src/lib/checkbox/checkbox-base.directive.ts @@ -1,21 +1,4 @@ -import { - Directive, - EventEmitter, - HostListener, - HostBinding, - Input, - Output, - ViewChild, - ElementRef, - ChangeDetectorRef, - Optional, - Self, - booleanAttribute, - inject, - DestroyRef, - Inject, - AfterViewInit, -} from '@angular/core'; +import { Directive, EventEmitter, HostListener, HostBinding, Input, Output, ViewChild, ElementRef, ChangeDetectorRef, booleanAttribute, inject, DestroyRef, AfterViewInit } from '@angular/core'; import { NgControl, Validators } from '@angular/forms'; import { IBaseEventArgs, getComponentTheme } from '../core/utils'; import { noop, Subject } from 'rxjs'; @@ -41,6 +24,10 @@ let nextId = 0; @Directive() export class CheckboxBaseDirective implements AfterViewInit { + protected cdr = inject(ChangeDetectorRef); + protected themeToken = inject(THEME_TOKEN); + ngControl = inject(NgControl, { optional: true, self: true }); + /** * An event that is emitted after the checkbox state is changed. * Provides references to the `IgxCheckboxComponent` and the `checked` property as event arguments. @@ -247,12 +234,7 @@ export class CheckboxBaseDirective implements AfterViewInit { @Input('aria-label') public ariaLabel: string | null = null; - constructor( - protected cdr: ChangeDetectorRef, - @Inject(THEME_TOKEN) - protected themeToken: ThemeToken, - @Optional() @Self() public ngControl: NgControl - ) { + constructor() { if (this.ngControl !== null) { this.ngControl.valueAccessor = this; } diff --git a/projects/igniteui-angular/src/lib/checkbox/checkbox.component.spec.ts b/projects/igniteui-angular/src/lib/checkbox/checkbox.component.spec.ts index 436883f1145..1c0cd7e15f7 100644 --- a/projects/igniteui-angular/src/lib/checkbox/checkbox.component.spec.ts +++ b/projects/igniteui-angular/src/lib/checkbox/checkbox.component.spec.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild } from '@angular/core'; +import { Component, ViewChild, inject } from '@angular/core'; import { fakeAsync, TestBed, tick, waitForAsync } from '@angular/core/testing'; import { UntypedFormBuilder, FormsModule, ReactiveFormsModule, Validators, NgForm } from '@angular/forms'; import { By } from '@angular/platform-browser'; @@ -504,11 +504,11 @@ class CheckboxDisabledTransitionsComponent { imports: [IgxCheckboxComponent, ReactiveFormsModule] }) class CheckboxFormGroupComponent { + private fb = inject(UntypedFormBuilder); + @ViewChild('cb', { static: true }) public cb: IgxCheckboxComponent; public myForm = this.fb.group({ checkbox: ['', Validators.required] }); - - constructor(private fb: UntypedFormBuilder) {} } @Component({ template: ` diff --git a/projects/igniteui-angular/src/lib/chips/chip.component.ts b/projects/igniteui-angular/src/lib/chips/chip.component.ts index b4ef3466e29..9c43cc17f6c 100644 --- a/projects/igniteui-angular/src/lib/chips/chip.component.ts +++ b/projects/igniteui-angular/src/lib/chips/chip.component.ts @@ -1,21 +1,4 @@ -import { - Component, - ChangeDetectorRef, - EventEmitter, - ElementRef, - HostBinding, - HostListener, - Input, - Output, - ViewChild, - Renderer2, - TemplateRef, - OnDestroy, - booleanAttribute, - OnInit, - Inject, - DOCUMENT -} from '@angular/core'; +import { Component, ChangeDetectorRef, EventEmitter, ElementRef, HostBinding, HostListener, Input, Output, ViewChild, Renderer2, TemplateRef, OnDestroy, booleanAttribute, OnInit, DOCUMENT, inject } from '@angular/core'; import { IgxDragDirective, IDragBaseEventArgs, IDragStartEventArgs, IDropBaseEventArgs, IDropDroppedEventArgs, IgxDropDirective } from '../directives/drag-drop/drag-drop.directive'; import { IBaseEventArgs } from '../core/utils'; import { ChipResourceStringsEN, IChipResourceStrings } from '../core/i18n/chip-resources'; @@ -88,6 +71,11 @@ let CHIP_ID = 0; imports: [IgxDropDirective, IgxDragDirective, NgClass, NgTemplateOutlet, IgxIconComponent] }) export class IgxChipComponent implements OnInit, OnDestroy { + cdr = inject(ChangeDetectorRef); + private ref = inject>(ElementRef); + private renderer = inject(Renderer2); + document = inject(DOCUMENT); + /** * Sets/gets the variant of the chip. @@ -606,12 +594,6 @@ export class IgxChipComponent implements OnInit, OnDestroy { protected computedStyles; private _resourceStrings = getCurrentResourceStrings(ChipResourceStringsEN); - constructor( - public cdr: ChangeDetectorRef, - private ref: ElementRef, - private renderer: Renderer2, - @Inject(DOCUMENT) public document: any) { } - /** * @hidden * @internal diff --git a/projects/igniteui-angular/src/lib/chips/chip.spec.ts b/projects/igniteui-angular/src/lib/chips/chip.spec.ts index 3aa27a14a12..07768a7df4d 100644 --- a/projects/igniteui-angular/src/lib/chips/chip.spec.ts +++ b/projects/igniteui-angular/src/lib/chips/chip.spec.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ViewChildren, QueryList, ChangeDetectorRef } from '@angular/core'; +import { Component, ViewChild, ViewChildren, QueryList, ChangeDetectorRef, inject } from '@angular/core'; import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; import { IgxChipComponent } from './chip.component'; @@ -43,6 +43,8 @@ import { getComponentSize } from '../core/utils'; imports: [IgxChipComponent, IgxChipsAreaComponent, IgxIconComponent, IgxPrefixDirective] }) class TestChipComponent { + cdr = inject(ChangeDetectorRef); + @ViewChild('chipsArea', { read: IgxChipsAreaComponent, static: true }) public chipsArea: IgxChipsAreaComponent; @@ -57,8 +59,6 @@ class TestChipComponent { { id: 'FirstName', text: 'First Name', removable: true, selectable: true, draggable: true, chipSize: '--ig-size-medium' } ]; - constructor(public cdr: ChangeDetectorRef) { } - public chipRemoved(event) { this.chipList = this.chipList.filter((item) => item.id !== event.owner.id); this.cdr.detectChanges(); diff --git a/projects/igniteui-angular/src/lib/chips/chips-area.component.ts b/projects/igniteui-angular/src/lib/chips/chips-area.component.ts index 63f44fe15bb..a6fb33a23ba 100644 --- a/projects/igniteui-angular/src/lib/chips/chips-area.component.ts +++ b/projects/igniteui-angular/src/lib/chips/chips-area.component.ts @@ -1,19 +1,4 @@ -import { - Component, - ContentChildren, - ChangeDetectorRef, - EventEmitter, - HostBinding, - Input, - IterableDiffer, - IterableDiffers, - Output, - QueryList, - DoCheck, - AfterViewInit, - OnDestroy, - ElementRef -} from '@angular/core'; +import { Component, ContentChildren, ChangeDetectorRef, EventEmitter, HostBinding, Input, IterableDiffer, IterableDiffers, Output, QueryList, DoCheck, AfterViewInit, OnDestroy, ElementRef, inject } from '@angular/core'; import { IgxChipComponent, IChipSelectEventArgs, @@ -66,6 +51,10 @@ export interface IChipsAreaSelectEventArgs extends IBaseChipsAreaEventArgs { standalone: true }) export class IgxChipsAreaComponent implements DoCheck, AfterViewInit, OnDestroy { + cdr = inject(ChangeDetectorRef); + element = inject(ElementRef); + private _iterableDiffers = inject(IterableDiffers); + /** * Returns the `role` attribute of the chips area. @@ -192,8 +181,7 @@ export class IgxChipsAreaComponent implements DoCheck, AfterViewInit, OnDestroy private modifiedChipsArray: IgxChipComponent[]; private _differ: IterableDiffer | null = null; - constructor(public cdr: ChangeDetectorRef, public element: ElementRef, - private _iterableDiffers: IterableDiffers) { + constructor() { this._differ = this._iterableDiffers.find([]).create(null); } diff --git a/projects/igniteui-angular/src/lib/chips/chips-area.spec.ts b/projects/igniteui-angular/src/lib/chips/chips-area.spec.ts index 8184038e650..70dbe7c48e1 100644 --- a/projects/igniteui-angular/src/lib/chips/chips-area.spec.ts +++ b/projects/igniteui-angular/src/lib/chips/chips-area.spec.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ViewChildren, QueryList, ChangeDetectorRef } from '@angular/core'; +import { Component, ViewChild, ViewChildren, QueryList, ChangeDetectorRef, inject } from '@angular/core'; import { TestBed, waitForAsync } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; import { IgxChipComponent } from './chip.component'; @@ -22,6 +22,8 @@ import { IgxPrefixDirective } from './public_api'; imports: [IgxChipsAreaComponent, IgxChipComponent, IgxIconComponent, IgxPrefixDirective] }) class TestChipComponent { + cdr = inject(ChangeDetectorRef); + @ViewChild('chipsArea', { read: IgxChipsAreaComponent, static: true }) public chipsArea: IgxChipsAreaComponent; @@ -32,8 +34,6 @@ class TestChipComponent { { id: 'Country', text: 'Country', removable: false, selectable: false, draggable: false }, { id: 'City', text: 'City', removable: true, selectable: true, draggable: true } ]; - - constructor(public cdr: ChangeDetectorRef) { } } @Component({ @@ -70,6 +70,8 @@ class TestChipSelectComponent extends TestChipComponent { imports: [IgxChipsAreaComponent, IgxChipComponent, IgxIconComponent, IgxPrefixDirective] }) class TestChipReorderComponent { + cdr = inject(ChangeDetectorRef); + @ViewChild('chipsArea', { read: IgxChipsAreaComponent, static: true }) public chipsArea: IgxChipsAreaComponent; @@ -83,8 +85,6 @@ class TestChipReorderComponent { { id: 'FirstName', text: 'First Name' }, ]; - constructor(public cdr: ChangeDetectorRef) { } - public chipsOrderChanged(event) { const newChipList = []; for (const chip of event.chipsArray) { diff --git a/projects/igniteui-angular/src/lib/combo/combo-dropdown.component.ts b/projects/igniteui-angular/src/lib/combo/combo-dropdown.component.ts index fcf22a4a2d3..749d8c620b1 100644 --- a/projects/igniteui-angular/src/lib/combo/combo-dropdown.component.ts +++ b/projects/igniteui-angular/src/lib/combo/combo-dropdown.component.ts @@ -1,6 +1,4 @@ -import { - ChangeDetectorRef, Component, ElementRef, Inject, QueryList, OnDestroy, AfterViewInit, ContentChildren, Input, booleanAttribute, DOCUMENT -} from '@angular/core'; +import { ChangeDetectorRef, Component, ElementRef, QueryList, OnDestroy, AfterViewInit, ContentChildren, Input, booleanAttribute, DOCUMENT, inject } from '@angular/core'; import { IgxComboBase, IGX_COMBO_COMPONENT } from './combo.common'; import { IDropDownBase, IGX_DROPDOWN_BASE } from '../drop-down/drop-down.common'; import { IgxDropDownComponent } from '../drop-down/drop-down.component'; @@ -20,6 +18,9 @@ import { IgxToggleDirective } from '../directives/toggle/toggle.directive'; imports: [IgxToggleDirective] }) export class IgxComboDropDownComponent extends IgxDropDownComponent implements IDropDownBase, OnDestroy, AfterViewInit { + combo = inject(IGX_COMBO_COMPONENT); + protected comboAPI = inject(IgxComboAPIService); + /** @hidden @internal */ @Input({ transform: booleanAttribute }) public singleMode = false; @@ -78,13 +79,12 @@ export class IgxComboDropDownComponent extends IgxDropDownComponent implements I return items; } - constructor( - elementRef: ElementRef, - cdr: ChangeDetectorRef, - @Inject(DOCUMENT) document: any, - selection: IgxSelectionAPIService, - @Inject(IGX_COMBO_COMPONENT) public combo: IgxComboBase, - protected comboAPI: IgxComboAPIService) { + constructor() { + const elementRef = inject(ElementRef); + const cdr = inject(ChangeDetectorRef); + const document = inject(DOCUMENT); + const selection = inject(IgxSelectionAPIService); + super(elementRef, cdr, document, selection); } diff --git a/projects/igniteui-angular/src/lib/combo/combo-item.component.ts b/projects/igniteui-angular/src/lib/combo/combo-item.component.ts index ff74a3ebf3f..62f098ea94c 100644 --- a/projects/igniteui-angular/src/lib/combo/combo-item.component.ts +++ b/projects/igniteui-angular/src/lib/combo/combo-item.component.ts @@ -1,11 +1,4 @@ -import { - Component, - ElementRef, - HostBinding, - Inject, - Input, - booleanAttribute -} from '@angular/core'; +import { Component, ElementRef, HostBinding, Input, booleanAttribute, inject } from '@angular/core'; import { IgxDropDownItemComponent } from '../drop-down/drop-down-item.component'; import { IGX_DROPDOWN_BASE, IDropDownBase, Navigate } from '../drop-down/drop-down.common'; import { IgxComboAPIService } from './combo.api'; @@ -20,6 +13,8 @@ import { IgxCheckboxComponent } from '../checkbox/checkbox.component'; imports: [IgxCheckboxComponent] }) export class IgxComboItemComponent extends IgxDropDownItemComponent { + protected comboAPI = inject(IgxComboAPIService); + /** * Gets the height of a list item @@ -71,12 +66,11 @@ export class IgxComboItemComponent extends IgxDropDownItemComponent { return this.comboAPI.disableTransitions; } - constructor( - protected comboAPI: IgxComboAPIService, - @Inject(IGX_DROPDOWN_BASE) dropDown: IDropDownBase, - elementRef: ElementRef, - @Inject(IgxSelectionAPIService) selection: IgxSelectionAPIService - ) { + constructor() { + const dropDown = inject(IGX_DROPDOWN_BASE); + const elementRef = inject(ElementRef); + const selection = inject(IgxSelectionAPIService); + super(dropDown, elementRef, null, selection); } diff --git a/projects/igniteui-angular/src/lib/combo/combo.component.spec.ts b/projects/igniteui-angular/src/lib/combo/combo.component.spec.ts index e60214a6542..652c0689f80 100644 --- a/projects/igniteui-angular/src/lib/combo/combo.component.spec.ts +++ b/projects/igniteui-angular/src/lib/combo/combo.component.spec.ts @@ -1,5 +1,5 @@ import { AsyncPipe } from '@angular/common'; -import { AfterViewInit, ChangeDetectorRef, Component, DebugElement, ElementRef, Injectable, OnDestroy, OnInit, ViewChild } from '@angular/core'; +import { AfterViewInit, ChangeDetectorRef, Component, DebugElement, ElementRef, Injectable, OnDestroy, OnInit, ViewChild, inject } from '@angular/core'; import { ComponentFixture, fakeAsync, TestBed, tick, waitForAsync } from '@angular/core/testing'; import { FormsModule, NgControl, NgForm, NgModel, ReactiveFormsModule, UntypedFormBuilder, UntypedFormControl, UntypedFormGroup, Validators @@ -3598,6 +3598,8 @@ describe('igxCombo', () => { imports: [IgxComboComponent, IgxComboItemDirective, IgxComboHeaderDirective, IgxComboFooterDirective] }) class IgxComboSampleComponent { + elementRef = inject(ElementRef); + /** * TODO * Test that use this component should properly call `selectItems` method @@ -3611,7 +3613,7 @@ class IgxComboSampleComponent { public initData = []; public size = 'medium'; - constructor(public elementRef: ElementRef) { + constructor() { const division = { 'New England 01': ['Connecticut', 'Maine', 'Massachusetts'], @@ -3687,7 +3689,9 @@ class IgxComboFormComponent { public reactiveForm: UntypedFormGroup; - constructor(fb: UntypedFormBuilder) { + constructor() { + const fb = inject(UntypedFormBuilder); + const division = { 'New England 01': ['Connecticut', 'Maine', 'Massachusetts'], @@ -3814,12 +3818,14 @@ export class LocalService { imports: [IgxComboComponent] }) export class IgxComboBindingTestComponent { + private localService = inject(LocalService); + @ViewChild('combo', { read: IgxComboComponent, static: true }) public combo: IgxComboComponent; public items = []; - constructor(private localService: LocalService) { + constructor() { this.localService.getData().subscribe( (data: any[]) => { this.items = data; @@ -3910,10 +3916,12 @@ export class RemoteDataService { imports: [IgxComboComponent, AsyncPipe] }) export class IgxComboRemoteDataComponent implements OnInit, AfterViewInit, OnDestroy { + private remoteDataService = inject(RemoteDataService); + cdr = inject(ChangeDetectorRef); + @ViewChild('combo', { read: IgxComboComponent, static: true }) public instance: IgxComboComponent; public data; - constructor(private remoteDataService: RemoteDataService, public cdr: ChangeDetectorRef) { } public ngOnInit(): void { this.data = this.remoteDataService.records; } @@ -3958,11 +3966,11 @@ export class ComboModelBindingComponent implements OnInit { imports: [IgxComboComponent, FormsModule] }) export class IgxComboBindingDataAfterInitComponent implements AfterViewInit { + private cdr = inject(ChangeDetectorRef); + public items: any[] = []; public selectedItems: any[] = [0]; - constructor(private cdr: ChangeDetectorRef) { } - public ngAfterViewInit() { setTimeout(() => { this.items = [{ text: 'One', id: 0 }, { text: 'Two', id: 1 }, { text: 'Three', id: 2 }, diff --git a/projects/igniteui-angular/src/lib/combo/combo.component.ts b/projects/igniteui-angular/src/lib/combo/combo.component.ts index 911d737e8bb..ca9ba613d6f 100644 --- a/projects/igniteui-angular/src/lib/combo/combo.component.ts +++ b/projects/igniteui-angular/src/lib/combo/combo.component.ts @@ -1,8 +1,5 @@ import { NgClass, NgTemplateOutlet } from '@angular/common'; -import { - AfterViewInit, ChangeDetectorRef, Component, ElementRef, OnInit, OnDestroy, DOCUMENT, - Optional, Inject, Injector, ViewChild, Input, Output, EventEmitter, HostListener, DoCheck, booleanAttribute, -} from '@angular/core'; +import { AfterViewInit, ChangeDetectorRef, Component, ElementRef, OnInit, OnDestroy, DOCUMENT, Injector, ViewChild, Input, Output, EventEmitter, HostListener, DoCheck, booleanAttribute, inject } from '@angular/core'; import { ControlValueAccessor, FormsModule, NG_VALUE_ACCESSOR } from '@angular/forms'; @@ -175,16 +172,16 @@ export class IgxComboComponent extends IgxComboBaseDirective implements AfterVie private _displayText: string; - constructor( - elementRef: ElementRef, - cdr: ChangeDetectorRef, - selectionService: IgxSelectionAPIService, - comboAPI: IgxComboAPIService, - @Inject(DOCUMENT) document: any, - @Optional() @Inject(IGX_INPUT_GROUP_TYPE) _inputGroupType: IgxInputGroupType, - @Optional() _injector: Injector, - @Optional() @Inject(IgxIconService) _iconService?: IgxIconService, - ) { + constructor() { + const elementRef = inject(ElementRef); + const cdr = inject(ChangeDetectorRef); + const selectionService = inject(IgxSelectionAPIService); + const comboAPI = inject(IgxComboAPIService); + const document = inject(DOCUMENT); + const _inputGroupType = inject(IGX_INPUT_GROUP_TYPE, { optional: true }); + const _injector = inject(Injector, { optional: true }); + const _iconService = inject(IgxIconService, { optional: true }); + super(elementRef, cdr, selectionService, comboAPI, document, _inputGroupType, _injector, _iconService); this.comboAPI.register(this); } diff --git a/projects/igniteui-angular/src/lib/combo/combo.pipes.ts b/projects/igniteui-angular/src/lib/combo/combo.pipes.ts index 1213380f561..552aa294e5e 100644 --- a/projects/igniteui-angular/src/lib/combo/combo.pipes.ts +++ b/projects/igniteui-angular/src/lib/combo/combo.pipes.ts @@ -1,4 +1,4 @@ -import { Inject, Pipe, PipeTransform } from '@angular/core'; +import { Pipe, PipeTransform, inject } from '@angular/core'; import { SortingDirection } from '../data-operations/sorting-strategy'; import { IComboFilteringOptions, IgxComboBase, IGX_COMBO_COMPONENT } from './combo.common'; @@ -32,8 +32,8 @@ export class IgxComboFilteringPipe implements PipeTransform { standalone: true }) export class IgxComboGroupingPipe implements PipeTransform { + combo = inject(IGX_COMBO_COMPONENT); - constructor(@Inject(IGX_COMBO_COMPONENT) public combo: IgxComboBase) { } public transform(collection: any[], groupKey: any, valueKey: any, sortingDirection: SortingDirection, compareCollator: Intl.Collator) { // TODO: should filteredData be changed here? diff --git a/projects/igniteui-angular/src/lib/core/navigation/directives.ts b/projects/igniteui-angular/src/lib/core/navigation/directives.ts index eac108b1a0b..c900ad410f6 100644 --- a/projects/igniteui-angular/src/lib/core/navigation/directives.ts +++ b/projects/igniteui-angular/src/lib/core/navigation/directives.ts @@ -1,4 +1,4 @@ -import { Directive, HostListener, Input } from '@angular/core'; +import { Directive, HostListener, Input, inject } from '@angular/core'; import { IgxNavigationService } from './nav.service'; /** @@ -19,7 +19,9 @@ export class IgxNavigationToggleDirective { public state: IgxNavigationService; - constructor(nav: IgxNavigationService) { + constructor() { + const nav = inject(IgxNavigationService); + this.state = nav; } @@ -47,7 +49,9 @@ export class IgxNavigationCloseDirective { public state: IgxNavigationService; - constructor(nav: IgxNavigationService) { + constructor() { + const nav = inject(IgxNavigationService); + this.state = nav; } diff --git a/projects/igniteui-angular/src/lib/core/touch.ts b/projects/igniteui-angular/src/lib/core/touch.ts index 7a5df7824f4..36341f15bc7 100644 --- a/projects/igniteui-angular/src/lib/core/touch.ts +++ b/projects/igniteui-angular/src/lib/core/touch.ts @@ -1,4 +1,4 @@ -import { Inject, Injectable, NgZone, DOCUMENT } from '@angular/core'; +import { Injectable, NgZone, DOCUMENT, inject } from '@angular/core'; import { ɵgetDOM as getDOM } from '@angular/platform-browser'; import { PlatformUtil } from './utils'; import { HammerManager, HammerOptions, HammerStatic } from './touch-annotations'; @@ -13,6 +13,10 @@ const EVENT_SUFFIX = 'precise'; */ @Injectable() export class HammerGesturesManager { + private _zone = inject(NgZone); + private doc = inject(DOCUMENT); + private platformUtil = inject(PlatformUtil); + public static Hammer: HammerStatic = typeof window !== 'undefined' ? (window as any).Hammer : null; /** * Event option defaults for each recognizer, see http://hammerjs.github.io/api/ for API listing. @@ -22,7 +26,7 @@ export class HammerGesturesManager { private platformBrowser: boolean; private _hammerManagers: Array<{ element: EventTarget; manager: HammerManager }> = []; - constructor(private _zone: NgZone, @Inject(DOCUMENT) private doc: any, private platformUtil: PlatformUtil) { + constructor() { this.platformBrowser = this.platformUtil.isBrowser; if (this.platformBrowser && HammerGesturesManager.Hammer) { this.hammerOptions = { diff --git a/projects/igniteui-angular/src/lib/core/utils.ts b/projects/igniteui-angular/src/lib/core/utils.ts index a787a9cdcd5..d55e5bb0363 100644 --- a/projects/igniteui-angular/src/lib/core/utils.ts +++ b/projects/igniteui-angular/src/lib/core/utils.ts @@ -1,5 +1,5 @@ import { CurrencyPipe, formatDate as _formatDate, isPlatformBrowser } from '@angular/common'; -import { Inject, Injectable, InjectionToken, PLATFORM_ID, inject } from '@angular/core'; +import { Injectable, InjectionToken, PLATFORM_ID, inject } from '@angular/core'; import { mergeWith } from 'lodash-es'; import { NEVER, Observable } from 'rxjs'; import { setImmediate } from './setImmediate'; @@ -233,6 +233,8 @@ export const isEqual = (obj1, obj2): boolean => { */ @Injectable({ providedIn: 'root' }) export class PlatformUtil { + private platformId = inject(PLATFORM_ID); + public isBrowser: boolean = isPlatformBrowser(this.platformId); public isIOS = this.isBrowser && /iPad|iPhone|iPod/.test(navigator.userAgent) && !('MSStream' in window); public isSafari = this.isBrowser && /Safari[\/\s](\d+\.\d+)/.test(navigator.userAgent); @@ -269,8 +271,6 @@ export class PlatformUtil { Z: 'z' } as const; - constructor(@Inject(PLATFORM_ID) private platformId: any) { } - /** * @hidden @internal * Returns the actual size of the node content, using Range diff --git a/projects/igniteui-angular/src/lib/date-common/picker-icons.common.ts b/projects/igniteui-angular/src/lib/date-common/picker-icons.common.ts index dea7d37bc9a..c254438b4b4 100644 --- a/projects/igniteui-angular/src/lib/date-common/picker-icons.common.ts +++ b/projects/igniteui-angular/src/lib/date-common/picker-icons.common.ts @@ -1,4 +1,4 @@ -import { Component, Output, EventEmitter, HostListener, Directive, TemplateRef } from '@angular/core'; +import { Component, Output, EventEmitter, HostListener, Directive, TemplateRef, inject } from '@angular/core'; /** * Templates the default toggle icon in the picker. @@ -63,6 +63,6 @@ export class IgxPickerClearComponent extends IgxPickerToggleComponent { } standalone: true }) export class IgxPickerActionsDirective { - constructor(public template: TemplateRef) { } + template = inject>(TemplateRef); } diff --git a/projects/igniteui-angular/src/lib/date-picker/date-picker.component.ts b/projects/igniteui-angular/src/lib/date-picker/date-picker.component.ts index a3a6935af7d..f39cb3eba7f 100644 --- a/projects/igniteui-angular/src/lib/date-picker/date-picker.component.ts +++ b/projects/igniteui-angular/src/lib/date-picker/date-picker.component.ts @@ -1,30 +1,4 @@ -import { - AfterViewChecked, - AfterViewInit, - AfterContentChecked, - ChangeDetectorRef, - Component, - ContentChild, - ContentChildren, - ElementRef, - EventEmitter, - HostBinding, - HostListener, - Inject, - Injector, - Input, - LOCALE_ID, - OnDestroy, - OnInit, - Optional, - Output, - PipeTransform, - QueryList, - Renderer2, - ViewChild, - ViewContainerRef, - booleanAttribute -} from '@angular/core'; +import { AfterViewChecked, AfterViewInit, AfterContentChecked, ChangeDetectorRef, Component, ContentChild, ContentChildren, ElementRef, EventEmitter, HostBinding, HostListener, Injector, Input, LOCALE_ID, OnDestroy, OnInit, Output, PipeTransform, QueryList, Renderer2, ViewChild, ViewContainerRef, booleanAttribute, inject } from '@angular/core'; import { AbstractControl, ControlValueAccessor, @@ -103,6 +77,12 @@ let NEXT_ID = 0; }) export class IgxDatePickerComponent extends PickerBaseDirective implements ControlValueAccessor, Validator, OnInit, AfterViewInit, OnDestroy, AfterViewChecked, AfterContentChecked { + private _overlayService = inject(IgxOverlayService); + private _injector = inject(Injector); + private _renderer = inject(Renderer2); + private platform = inject(PlatformUtil); + private cdr = inject(ChangeDetectorRef); + /** * Gets/Sets whether the inactive dates will be hidden. @@ -507,14 +487,11 @@ export class IgxDatePickerComponent extends PickerBaseDirective implements Contr private _onTouchedCallback: () => void = noop; private _onValidatorChange: () => void = noop; - constructor(element: ElementRef, - @Inject(LOCALE_ID) _localeId: string, - @Inject(IgxOverlayService) private _overlayService: IgxOverlayService, - private _injector: Injector, - private _renderer: Renderer2, - private platform: PlatformUtil, - private cdr: ChangeDetectorRef, - @Optional() @Inject(IGX_INPUT_GROUP_TYPE) _inputGroupType?: IgxInputGroupType) { + constructor() { + const element = inject>(ElementRef); + const _localeId = inject(LOCALE_ID); + const _inputGroupType = inject(IGX_INPUT_GROUP_TYPE, { optional: true }); + super(element, _localeId, _inputGroupType); this.locale = this.locale || this._localeId; } diff --git a/projects/igniteui-angular/src/lib/date-range-picker/date-range-picker.component.spec.ts b/projects/igniteui-angular/src/lib/date-range-picker/date-range-picker.component.spec.ts index 01d03dc791d..79ea947956f 100644 --- a/projects/igniteui-angular/src/lib/date-range-picker/date-range-picker.component.spec.ts +++ b/projects/igniteui-angular/src/lib/date-range-picker/date-range-picker.component.spec.ts @@ -1,5 +1,5 @@ import { ComponentFixture, TestBed, fakeAsync, tick, waitForAsync, flush } from '@angular/core/testing'; -import { Component, OnInit, ViewChild, DebugElement, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild, DebugElement, ChangeDetectionStrategy, inject } from '@angular/core'; import { IgxInputDirective, IgxInputState, IgxLabelDirective, IgxPrefixDirective, IgxSuffixDirective } from '../input-group/public_api'; import { PickerInteractionMode } from '../date-common/types'; import { NoopAnimationsModule } from '@angular/platform-browser/animations'; @@ -1789,6 +1789,8 @@ export class DateRangeTwoInputsDisabledComponent extends DateRangeDisabledCompon ] }) export class DateRangeReactiveFormComponent { + private fb = inject(UntypedFormBuilder); + @ViewChild('range', {read: IgxDateRangePickerComponent}) public dateRange: IgxDateRangePickerComponent; @ViewChild('twoInputs', {read: IgxDateRangePickerComponent}) public dateRangeWithTwoInputs: IgxDateRangePickerComponent; @@ -1797,8 +1799,6 @@ export class DateRangeReactiveFormComponent { twoInputs: ['', Validators.required] }); - constructor(private fb: UntypedFormBuilder) { } - public markAsTouched() { if (!this.form.valid) { for (const key in this.form.controls) { diff --git a/projects/igniteui-angular/src/lib/date-range-picker/date-range-picker.component.ts b/projects/igniteui-angular/src/lib/date-range-picker/date-range-picker.component.ts index e6b5edca0ba..3c0a33c1863 100644 --- a/projects/igniteui-angular/src/lib/date-range-picker/date-range-picker.component.ts +++ b/projects/igniteui-angular/src/lib/date-range-picker/date-range-picker.component.ts @@ -1,9 +1,4 @@ -import { - AfterViewInit, booleanAttribute, ChangeDetectorRef, Component, ContentChild, ContentChildren, ElementRef, - EventEmitter, HostBinding, HostListener, Inject, Injector, Input, LOCALE_ID, - OnChanges, OnDestroy, OnInit, Optional, Output, QueryList, - SimpleChanges, TemplateRef, ViewChild, ViewContainerRef -} from '@angular/core'; +import { AfterViewInit, booleanAttribute, ChangeDetectorRef, Component, ContentChild, ContentChildren, ElementRef, EventEmitter, HostBinding, HostListener, Injector, Input, LOCALE_ID, OnChanges, OnDestroy, OnInit, Output, QueryList, SimpleChanges, TemplateRef, ViewChild, ViewContainerRef, inject } from '@angular/core'; import { NgTemplateOutlet, getLocaleFirstDayOfWeek } from '@angular/common'; import { AbstractControl, ControlValueAccessor, NgControl, @@ -78,6 +73,11 @@ const SingleInputDatesConcatenationString = ' - '; }) export class IgxDateRangePickerComponent extends PickerBaseDirective implements OnChanges, OnInit, AfterViewInit, OnDestroy, ControlValueAccessor, Validator { + protected platform = inject(PlatformUtil); + private _injector = inject(Injector); + private _cdr = inject(ChangeDetectorRef); + private _overlayService = inject(IgxOverlayService); + /** * The number of displayed month views. @@ -467,13 +467,11 @@ export class IgxDateRangePickerComponent extends PickerBaseDirective private onTouchCallback: () => void = noop; private onValidatorChange: () => void = noop; - constructor(element: ElementRef, - @Inject(LOCALE_ID) _localeId: string, - protected platform: PlatformUtil, - private _injector: Injector, - private _cdr: ChangeDetectorRef, - @Inject(IgxOverlayService) private _overlayService: IgxOverlayService, - @Optional() @Inject(IGX_INPUT_GROUP_TYPE) _inputGroupType?: IgxInputGroupType) { + constructor() { + const element = inject(ElementRef); + const _localeId = inject(LOCALE_ID); + const _inputGroupType = inject(IGX_INPUT_GROUP_TYPE, { optional: true }); + super(element, _localeId, _inputGroupType); this.locale = this.locale || this._localeId; } diff --git a/projects/igniteui-angular/src/lib/dialog/dialog.component.ts b/projects/igniteui-angular/src/lib/dialog/dialog.component.ts index 09c76ecfdd5..42aa92f4559 100644 --- a/projects/igniteui-angular/src/lib/dialog/dialog.component.ts +++ b/projects/igniteui-angular/src/lib/dialog/dialog.component.ts @@ -1,17 +1,4 @@ -import { - Component, - ElementRef, - EventEmitter, - HostBinding, - Input, - OnDestroy, - OnInit, - Optional, - Output, - ViewChild, - AfterContentInit, - booleanAttribute -} from '@angular/core'; +import { Component, ElementRef, EventEmitter, HostBinding, Input, OnDestroy, OnInit, Output, ViewChild, AfterContentInit, booleanAttribute, inject } from '@angular/core'; import { Subject } from 'rxjs'; import { takeUntil } from 'rxjs/operators'; import { IgxNavigationService, IToggleView } from '../core/navigation'; @@ -58,6 +45,9 @@ let DIALOG_ID = 0; imports: [IgxToggleDirective, IgxFocusTrapDirective, IgxFocusDirective, IgxButtonDirective, IgxRippleDirective] }) export class IgxDialogComponent implements IToggleView, OnInit, OnDestroy, AfterContentInit { + private elementRef = inject(ElementRef); + private navService = inject(IgxNavigationService, { optional: true }); + private static NEXT_ID = 1; private static readonly DIALOG_CLASS = 'igx-dialog'; @@ -443,10 +433,7 @@ export class IgxDialogComponent implements IToggleView, OnInit, OnDestroy, After private _isModal = true; private _titleId: string; - constructor( - private elementRef: ElementRef, - @Optional() private navService: IgxNavigationService - ) { + constructor() { this._titleId = IgxDialogComponent.NEXT_ID++ + '_title'; this._overlayDefaultSettings = { diff --git a/projects/igniteui-angular/src/lib/directives/autocomplete/autocomplete.directive.spec.ts b/projects/igniteui-angular/src/lib/directives/autocomplete/autocomplete.directive.spec.ts index 882f7c6ac61..ab6bec4864f 100644 --- a/projects/igniteui-angular/src/lib/directives/autocomplete/autocomplete.directive.spec.ts +++ b/projects/igniteui-angular/src/lib/directives/autocomplete/autocomplete.directive.spec.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, Pipe, PipeTransform, ElementRef } from '@angular/core'; +import { Component, ViewChild, Pipe, PipeTransform, ElementRef, inject } from '@angular/core'; import { TestBed, tick, fakeAsync, waitForAsync } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; import { NoopAnimationsModule } from '@angular/platform-browser/animations'; @@ -1062,7 +1062,9 @@ class AutocompleteFormComponent { public reactiveForm: UntypedFormGroup; - constructor(fb: UntypedFormBuilder) { + constructor() { + const fb = inject(UntypedFormBuilder); + this.towns = [ 'Sofia', 'Plovdiv', 'Varna', 'Burgas', 'Ruse', 'Stara Zagora', 'Pleven', 'Dobrich', 'Sliven', 'Shumen', 'Pernik', 'Haskovo', 'Yambol', 'Pazardzhik', 'Blagoevgrad', 'Veliko Tarnovo', 'Vratsa', 'Gabrovo', 'Asenovgrad', 'Vidin', 'Kazanlak', 'Kyustendil', 'Kardzhali', 'Montana', 'Dimitrovgrad', 'Targovishte', 'Lovech', 'Silistra', 'Dupnitsa', 'Svishtov', 'Razgrad', 'Gorna Oryahovitsa', 'Smolyan', 'Petrich', 'Sandanski', 'Samokov', 'Sevlievo', 'Lom', 'Karlovo', 'Velingrad', 'Nova Zagora', 'Troyan', 'Aytos', 'Botevgrad', 'Gotse Delchev', 'Peshtera', 'Harmanli', 'Karnobat', 'Svilengrad', 'Panagyurishte', 'Chirpan', 'Popovo', 'Rakovski', 'Radomir', 'Novi Iskar', 'Kozloduy', 'Parvomay', 'Berkovitsa', 'Cherven Bryag', 'Pomorie', 'Ihtiman', 'Radnevo', 'Provadiya', 'Novi Pazar', 'Razlog', 'Byala Slatina', 'Nesebar', 'Balchik', 'Kostinbrod', 'Stamboliyski', 'Kavarna', 'Knezha', 'Pavlikeni', 'Mezdra', 'Etropole', 'Levski', 'Teteven', 'Elhovo', 'Bankya', 'Tryavna', 'Lukovit', 'Tutrakan', 'Sredets', 'Sopot', 'Byala', 'Veliki Preslav', 'Isperih', 'Belene', 'Omurtag', 'Bansko', 'Krichim', 'Galabovo', 'Devnya', 'Septemvri', 'Rakitovo', 'Lyaskovets', 'Svoge', 'Aksakovo', 'Kubrat', 'Dryanovo', 'Beloslav', 'Pirdop', 'Lyubimets', 'Momchilgrad', 'Slivnitsa', 'Hisarya', 'Zlatograd', 'Kostenets', 'Devin', 'General Toshevo', 'Simeonovgrad', 'Simitli', 'Elin Pelin', 'Dolni Chiflik', 'Tervel', 'Dulovo', 'Varshets', 'Kotel', 'Madan', 'Straldzha', 'Saedinenie', 'Bobov Dol', 'Tsarevo', 'Kuklen', 'Tvarditsa', 'Yakoruda', 'Elena', 'Topolovgrad', 'Bozhurishte', 'Chepelare', 'Oryahovo', 'Sozopol', 'Belogradchik', 'Perushtitsa', 'Zlatitsa', 'Strazhitsa', 'Krumovgrad', 'Kameno', 'Dalgopol', 'Vetovo', 'Suvorovo', 'Dolni Dabnik', 'Dolna Banya', 'Pravets', 'Nedelino', 'Polski Trambesh', 'Trastenik', 'Bratsigovo', 'Koynare', 'Godech', 'Slavyanovo', 'Dve Mogili', 'Kostandovo', 'Debelets', 'Strelcha', 'Sapareva Banya', 'Ignatievo', 'Smyadovo', 'Breznik', 'Sveti Vlas', 'Nikopol', 'Shivachevo', 'Belovo', 'Tsar Kaloyan', 'Ivaylovgrad', 'Valchedram', 'Marten', 'Glodzhevo', 'Sarnitsa', 'Letnitsa', 'Varbitsa', 'Iskar', 'Ardino', 'Shabla', 'Rudozem', 'Vetren', 'Kresna', 'Banya', 'Batak', 'Maglizh', 'Valchi Dol', 'Gulyantsi', 'Dragoman', 'Zavet', 'Kran', 'Miziya', 'Primorsko', 'Sungurlare', 'Dolna Mitropoliya', 'Krivodol', 'Kula', 'Kalofer', 'Slivo Pole', 'Kaspichan', 'Apriltsi', 'Belitsa', 'Roman', 'Dzhebel', 'Dolna Oryahovitsa', 'Buhovo', 'Gurkovo', 'Pavel Banya', 'Nikolaevo', 'Yablanitsa', 'Kableshkovo', 'Opaka', 'Rila', 'Ugarchin', 'Dunavtsi', 'Dobrinishte', 'Hadzhidimovo', 'Bregovo', 'Byala Cherkva', 'Zlataritsa', 'Kocherinovo', 'Dospat', 'Tran', 'Sadovo', 'Laki', 'Koprivshtitsa', 'Malko Tarnovo', 'Loznitsa', 'Obzor', 'Kilifarevo', 'Borovo', 'Batanovtsi', 'Chernomorets', 'Aheloy', 'Pordim', 'Suhindol', 'Merichleri', 'Glavinitsa', 'Chiprovtsi', 'Kermen', 'Brezovo', 'Plachkovtsi', 'Zemen', 'Balgarovo', 'Alfatar', 'Boychinovtsi', 'Gramada', 'Senovo', 'Momin Prohod', 'Kaolinovo', 'Shipka', 'Antonovo', 'Ahtopol', 'Boboshevo', 'Bolyarovo', 'Brusartsi', 'Klisura', 'Dimovo', 'Kiten', 'Pliska', 'Madzharovo', 'Melnik' diff --git a/projects/igniteui-angular/src/lib/directives/autocomplete/autocomplete.directive.ts b/projects/igniteui-angular/src/lib/directives/autocomplete/autocomplete.directive.ts index fbc0dd8d6fe..d0397f87d43 100644 --- a/projects/igniteui-angular/src/lib/directives/autocomplete/autocomplete.directive.ts +++ b/projects/igniteui-angular/src/lib/directives/autocomplete/autocomplete.directive.ts @@ -1,20 +1,4 @@ -import { - ChangeDetectorRef, - Directive, - ElementRef, - EventEmitter, - HostBinding, - HostListener, - Inject, - Input, - OnDestroy, - Optional, - Output, - Self, - AfterViewInit, - OnInit, - booleanAttribute -} from '@angular/core'; +import { ChangeDetectorRef, Directive, ElementRef, EventEmitter, HostBinding, HostListener, Input, OnDestroy, Output, AfterViewInit, OnInit, booleanAttribute, inject } from '@angular/core'; import { NgModel, FormControlName } from '@angular/forms'; import { Subject } from 'rxjs'; import { takeUntil } from 'rxjs/operators'; @@ -78,6 +62,12 @@ export interface AutocompleteOverlaySettings { standalone: true }) export class IgxAutocompleteDirective extends IgxDropDownItemNavigationDirective implements OnDestroy, AfterViewInit, OnInit { + protected ngModel = inject(NgModel, { self: true, optional: true }); + protected formControl = inject(FormControlName, { self: true, optional: true }); + protected group = inject(IgxInputGroupComponent, { optional: true }); + protected elementRef = inject(ElementRef); + protected cdr = inject(ChangeDetectorRef); + /** * Sets the target of the autocomplete directive * @@ -219,11 +209,7 @@ export class IgxAutocompleteDirective extends IgxDropDownItemNavigationDirective private destroy$ = new Subject(); private defaultSettings: OverlaySettings; - constructor(@Self() @Optional() @Inject(NgModel) protected ngModel: NgModel, - @Self() @Optional() @Inject(FormControlName) protected formControl: FormControlName, - @Optional() protected group: IgxInputGroupComponent, - protected elementRef: ElementRef, - protected cdr: ChangeDetectorRef) { + constructor() { super(null); } diff --git a/projects/igniteui-angular/src/lib/directives/button/button.directive.ts b/projects/igniteui-angular/src/lib/directives/button/button.directive.ts index 41f4329a5d1..493cacbc128 100644 --- a/projects/igniteui-angular/src/lib/directives/button/button.directive.ts +++ b/projects/igniteui-angular/src/lib/directives/button/button.directive.ts @@ -1,14 +1,4 @@ -import { - Directive, - ElementRef, - EventEmitter, - HostBinding, - HostListener, - Input, - Output, - Renderer2, - booleanAttribute, -} from '@angular/core'; +import { Directive, ElementRef, EventEmitter, HostBinding, HostListener, Input, Output, Renderer2, booleanAttribute, inject } from '@angular/core'; import { IBaseEventArgs } from '../../core/utils'; import { IgxBaseButtonType, IgxButtonBaseDirective } from './button-base'; @@ -46,6 +36,9 @@ export type IgxButtonType = typeof IgxButtonType[keyof typeof IgxButtonType]; standalone: true }) export class IgxButtonDirective extends IgxButtonBaseDirective { + override element: ElementRef; + private _renderer = inject(Renderer2); + private static ngAcceptInputType_type: IgxButtonType | ''; /** @@ -119,11 +112,12 @@ export class IgxButtonDirective extends IgxButtonBaseDirective { return this._selected; } - constructor( - public override element: ElementRef, - private _renderer: Renderer2, - ) { + constructor() { + const element = inject(ElementRef); + super(element); + + this.element = element; } /** diff --git a/projects/igniteui-angular/src/lib/directives/date-time-editor/date-time-editor.directive.spec.ts b/projects/igniteui-angular/src/lib/directives/date-time-editor/date-time-editor.directive.spec.ts index fbb36a304d1..3e6244c51ed 100644 --- a/projects/igniteui-angular/src/lib/directives/date-time-editor/date-time-editor.directive.spec.ts +++ b/projects/igniteui-angular/src/lib/directives/date-time-editor/date-time-editor.directive.spec.ts @@ -1,7 +1,7 @@ import { IgxDateTimeEditorDirective } from './date-time-editor.directive'; import { DatePart } from './date-time-editor.common'; import { formatDate, registerLocaleData } from '@angular/common'; -import { Component, ViewChild, DebugElement, EventEmitter, Output, SimpleChange, SimpleChanges, DOCUMENT } from '@angular/core'; +import { Component, ViewChild, DebugElement, EventEmitter, Output, SimpleChange, SimpleChanges, DOCUMENT, inject } from '@angular/core'; import { fakeAsync, TestBed, tick, waitForAsync } from '@angular/core/testing'; import { FormsModule, UntypedFormGroup, UntypedFormBuilder, ReactiveFormsModule, Validators, NgControl } from '@angular/forms'; import { By } from '@angular/platform-browser'; @@ -1436,7 +1436,9 @@ class IgxDateTimeEditorFormComponent { public minDate: Date; public maxDate: Date; - constructor(fb: UntypedFormBuilder) { + constructor() { + const fb = inject(UntypedFormBuilder); + this.reactiveForm = fb.group({ dateEditor: ['', Validators.required] }); diff --git a/projects/igniteui-angular/src/lib/directives/date-time-editor/date-time-editor.directive.ts b/projects/igniteui-angular/src/lib/directives/date-time-editor/date-time-editor.directive.ts index d758e0d3c64..61ce925ce1d 100644 --- a/projects/igniteui-angular/src/lib/directives/date-time-editor/date-time-editor.directive.ts +++ b/projects/igniteui-angular/src/lib/directives/date-time-editor/date-time-editor.directive.ts @@ -1,8 +1,4 @@ -import { - Directive, Input, ElementRef, DOCUMENT, - Renderer2, Output, EventEmitter, Inject, - LOCALE_ID, OnChanges, SimpleChanges, HostListener, OnInit, booleanAttribute -} from '@angular/core'; +import { Directive, Input, ElementRef, DOCUMENT, Renderer2, Output, EventEmitter, LOCALE_ID, OnChanges, SimpleChanges, HostListener, OnInit, booleanAttribute, inject } from '@angular/core'; import { ControlValueAccessor, Validator, AbstractControl, ValidationErrors, NG_VALIDATORS, NG_VALUE_ACCESSOR, @@ -53,6 +49,9 @@ import { DateTimeUtil } from '../../date-common/util/date-time.util'; standalone: true }) export class IgxDateTimeEditorDirective extends IgxMaskDirective implements OnChanges, OnInit, Validator, ControlValueAccessor { + private _document = inject(DOCUMENT); + private _locale = inject(LOCALE_ID); + /** * Locale settings used for value formatting. * @@ -297,13 +296,12 @@ export class IgxDateTimeEditorDirective extends IgxMaskDirective implements OnCh return this._dateValue; } - constructor( - renderer: Renderer2, - elementRef: ElementRef, - maskParser: MaskParsingService, - platform: PlatformUtil, - @Inject(DOCUMENT) private _document: any, - @Inject(LOCALE_ID) private _locale: any) { + constructor() { + const renderer = inject(Renderer2); + const elementRef = inject(ElementRef); + const maskParser = inject(MaskParsingService); + const platform = inject(PlatformUtil); + super(elementRef, maskParser, renderer, platform); this.document = this._document as Document; this.locale = this.locale || this._locale; diff --git a/projects/igniteui-angular/src/lib/directives/drag-drop/drag-drop.directive.ts b/projects/igniteui-angular/src/lib/directives/drag-drop/drag-drop.directive.ts index dec32a095a9..e69f5304f87 100644 --- a/projects/igniteui-angular/src/lib/directives/drag-drop/drag-drop.directive.ts +++ b/projects/igniteui-angular/src/lib/directives/drag-drop/drag-drop.directive.ts @@ -159,6 +159,8 @@ export class IgxDragLocation { standalone: true }) export class IgxDragHandleDirective { + element = inject>(ElementRef); + @HostBinding('class.igx-drag__handle') public baseClass = true; @@ -167,8 +169,6 @@ export class IgxDragHandleDirective { * @hidden */ public parentDragElement: HTMLElement = null; - - constructor(public element: ElementRef) { } } @Directive({ @@ -176,11 +176,11 @@ export class IgxDragHandleDirective { standalone: true }) export class IgxDragIgnoreDirective { + element = inject>(ElementRef); + @HostBinding('class.igx-drag__ignore') public baseClass = true; - - constructor(public element: ElementRef) { } } @Directive({ @@ -189,6 +189,13 @@ export class IgxDragIgnoreDirective { standalone: true }) export class IgxDragDirective implements AfterContentInit, OnDestroy { + cdr = inject(ChangeDetectorRef); + element = inject(ElementRef); + viewContainer = inject(ViewContainerRef); + zone = inject(NgZone); + renderer = inject(Renderer2); + protected platformUtil = inject(PlatformUtil); + /** * - Save data inside the `igxDrag` directive. This can be set when instancing `igxDrag` on an element. * ```html @@ -687,14 +694,7 @@ export class IgxDragDirective implements AfterContentInit, OnDestroy { return this._offsetY !== undefined ? this._offsetY : this._defaultOffsetY; } - constructor( - public cdr: ChangeDetectorRef, - public element: ElementRef, - public viewContainer: ViewContainerRef, - public zone: NgZone, - public renderer: Renderer2, - protected platformUtil: PlatformUtil - ) { + constructor() { this.onTransitionEnd = this.onTransitionEnd.bind(this); this.onPointerMove = this.onPointerMove.bind(this); this.onPointerUp = this.onPointerUp.bind(this); @@ -1613,6 +1613,10 @@ export class IgxDragDirective implements AfterContentInit, OnDestroy { standalone: true }) export class IgxDropDirective implements OnInit, OnDestroy { + element = inject(ElementRef); + private _renderer = inject(Renderer2); + private _zone = inject(NgZone); + /** * - Save data inside the `igxDrop` directive. This can be set when instancing `igxDrop` on an element. * ```html @@ -1772,7 +1776,7 @@ export class IgxDropDirective implements OnInit, OnDestroy { private _data: any; - constructor(public element: ElementRef, private _renderer: Renderer2, private _zone: NgZone) { + constructor() { this._dropStrategy = new IgxDefaultDropStrategy(); } diff --git a/projects/igniteui-angular/src/lib/directives/drag-drop/drag-drop.spec.ts b/projects/igniteui-angular/src/lib/directives/drag-drop/drag-drop.spec.ts index 2fc26885b7c..d0a7b911126 100644 --- a/projects/igniteui-angular/src/lib/directives/drag-drop/drag-drop.spec.ts +++ b/projects/igniteui-angular/src/lib/directives/drag-drop/drag-drop.spec.ts @@ -1,4 +1,4 @@ -import { Component, ViewChildren, QueryList, ViewChild, ElementRef, TemplateRef, Renderer2 } from '@angular/core'; +import { Component, ViewChildren, QueryList, ViewChild, ElementRef, TemplateRef, Renderer2, inject } from '@angular/core'; import { TestBed, ComponentFixture, waitForAsync } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; import { UIInteractions, wait} from '../../test-utils/ui-interactions.spec'; @@ -2023,6 +2023,8 @@ const generalStyles = [` imports: [IgxDragDirective, IgxDropDirective, IgxDragHandleDirective, IgxDragIgnoreDirective] }) class TestDragDropComponent { + renderer = inject(Renderer2); + @ViewChildren(IgxDragDirective) public dragElems: QueryList; @@ -2037,8 +2039,6 @@ class TestDragDropComponent { @ViewChild('ghostTemplateContents', { read: TemplateRef, static: true }) public ghostTemplateContents: TemplateRef; - - constructor(public renderer: Renderer2) { } } @Component({ diff --git a/projects/igniteui-angular/src/lib/directives/focus-trap/focus-trap.directive.ts b/projects/igniteui-angular/src/lib/directives/focus-trap/focus-trap.directive.ts index 254a75f3dcf..4c6f7addce3 100644 --- a/projects/igniteui-angular/src/lib/directives/focus-trap/focus-trap.directive.ts +++ b/projects/igniteui-angular/src/lib/directives/focus-trap/focus-trap.directive.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, Directive, ElementRef, Input, OnDestroy, booleanAttribute } from '@angular/core'; +import { AfterViewInit, Directive, ElementRef, Input, OnDestroy, booleanAttribute, inject } from '@angular/core'; import { fromEvent, Subject } from 'rxjs'; import { takeUntil } from 'rxjs/operators'; import { PlatformUtil } from '../../core/utils'; @@ -8,6 +8,9 @@ import { PlatformUtil } from '../../core/utils'; standalone: true }) export class IgxFocusTrapDirective implements AfterViewInit, OnDestroy { + private elementRef = inject(ElementRef); + protected platformUtil = inject(PlatformUtil); + /** @hidden */ public get element(): HTMLElement | null { return this.elementRef.nativeElement; @@ -16,12 +19,6 @@ export class IgxFocusTrapDirective implements AfterViewInit, OnDestroy { private destroy$ = new Subject(); private _focusTrap = true; - /** @hidden */ - constructor( - private elementRef: ElementRef, - protected platformUtil: PlatformUtil) { - } - /** * Sets whether the Tab key focus is trapped within the element. * diff --git a/projects/igniteui-angular/src/lib/directives/focus/focus.directive.ts b/projects/igniteui-angular/src/lib/directives/focus/focus.directive.ts index e19485069fe..899c82ea6a2 100644 --- a/projects/igniteui-angular/src/lib/directives/focus/focus.directive.ts +++ b/projects/igniteui-angular/src/lib/directives/focus/focus.directive.ts @@ -1,4 +1,4 @@ -import { Directive, ElementRef, Input, Optional, Inject, Self, booleanAttribute } from '@angular/core'; +import { Directive, ElementRef, Input, booleanAttribute, inject } from '@angular/core'; import { NG_VALUE_ACCESSOR } from '@angular/forms'; import { EditorProvider, EDITOR_PROVIDER } from '../../core/edit-provider'; @@ -8,6 +8,10 @@ import { EditorProvider, EDITOR_PROVIDER } from '../../core/edit-provider'; standalone: true }) export class IgxFocusDirective { + private element = inject(ElementRef); + private comp = inject(NG_VALUE_ACCESSOR, { self: true, optional: true }); + private control = inject(EDITOR_PROVIDER, { self: true, optional: true }); + private focusState = true; @@ -63,12 +67,6 @@ export class IgxFocusDirective { return this.element.nativeElement; } - constructor( - private element: ElementRef, - @Inject(NG_VALUE_ACCESSOR) @Self() @Optional() private comp?: any[], - @Inject(EDITOR_PROVIDER) @Self() @Optional() private control?: any[], - ) { } - /** * Triggers the igxFocus state. * ```typescript diff --git a/projects/igniteui-angular/src/lib/directives/for-of/base.helper.component.ts b/projects/igniteui-angular/src/lib/directives/for-of/base.helper.component.ts index 2b31f1857c4..30153091e43 100644 --- a/projects/igniteui-angular/src/lib/directives/for-of/base.helper.component.ts +++ b/projects/igniteui-angular/src/lib/directives/for-of/base.helper.component.ts @@ -1,16 +1,4 @@ -import { - HostListener, - ElementRef, - ChangeDetectorRef, - OnDestroy, - Directive, - AfterViewInit, - Inject, - NgZone, - Renderer2, - PLATFORM_ID, - inject -} from '@angular/core'; +import { HostListener, ElementRef, ChangeDetectorRef, OnDestroy, Directive, AfterViewInit, NgZone, Renderer2, PLATFORM_ID, inject } from '@angular/core'; import { Subject } from 'rxjs'; import { takeUntil, throttleTime } from 'rxjs/operators'; import { resizeObservable, PlatformUtil } from '../../core/utils'; @@ -21,6 +9,12 @@ import { DOCUMENT, isPlatformBrowser } from '@angular/common'; standalone: true }) export class VirtualHelperBaseDirective implements OnDestroy, AfterViewInit { + elementRef = inject>(ElementRef); + cdr = inject(ChangeDetectorRef); + protected _zone = inject(NgZone); + document = inject(DOCUMENT); + protected platformUtil = inject(PlatformUtil); + public scrollAmount = 0; public _size = 0; public destroyed; @@ -34,13 +28,7 @@ export class VirtualHelperBaseDirective implements OnDestroy, AfterViewInit { protected platformId = inject(PLATFORM_ID); protected ngZone = inject(NgZone); - constructor( - public elementRef: ElementRef, - public cdr: ChangeDetectorRef, - protected _zone: NgZone, - @Inject(DOCUMENT) public document: any, - protected platformUtil: PlatformUtil - ) { + constructor() { this._scrollNativeSize = this.calculateScrollNativeSize(); } diff --git a/projects/igniteui-angular/src/lib/directives/for-of/display.container.ts b/projects/igniteui-angular/src/lib/directives/for-of/display.container.ts index 79ccacbfa99..fb945105a79 100644 --- a/projects/igniteui-angular/src/lib/directives/for-of/display.container.ts +++ b/projects/igniteui-angular/src/lib/directives/for-of/display.container.ts @@ -1,10 +1,4 @@ -import { - ChangeDetectorRef, - Component, - HostBinding, - ViewChild, - ViewContainerRef -} from '@angular/core'; +import { ChangeDetectorRef, Component, HostBinding, ViewChild, ViewContainerRef, inject } from '@angular/core'; import { IgxScrollInertiaDirective } from '../scroll-inertia/scroll_inertia.directive'; @Component({ @@ -20,6 +14,9 @@ import { IgxScrollInertiaDirective } from '../scroll-inertia/scroll_inertia.dire imports: [IgxScrollInertiaDirective] }) export class DisplayContainerComponent { + cdr = inject(ChangeDetectorRef); + _viewContainer = inject(ViewContainerRef); + @ViewChild('display_container', { read: ViewContainerRef, static: true }) public _vcr; @@ -35,6 +32,4 @@ export class DisplayContainerComponent { public scrollDirection: string; public scrollContainer; - - constructor(public cdr: ChangeDetectorRef, public _viewContainer: ViewContainerRef) { } } diff --git a/projects/igniteui-angular/src/lib/directives/for-of/for_of.directive.spec.ts b/projects/igniteui-angular/src/lib/directives/for-of/for_of.directive.spec.ts index d4e2e4f1d3a..dab99fe1164 100644 --- a/projects/igniteui-angular/src/lib/directives/for-of/for_of.directive.spec.ts +++ b/projects/igniteui-angular/src/lib/directives/for-of/for_of.directive.spec.ts @@ -1,22 +1,5 @@ import { AsyncPipe, NgClass, NgForOfContext } from '@angular/common'; -import { - AfterViewInit, - ChangeDetectorRef, - Component, - Directive, - Injectable, - IterableDiffers, - NgZone, - OnInit, - QueryList, - TemplateRef, - ViewChild, - ViewChildren, - ViewContainerRef, - DebugElement, - Pipe, - PipeTransform -} from '@angular/core'; +import { AfterViewInit, ChangeDetectorRef, Component, Directive, Injectable, IterableDiffers, NgZone, OnInit, QueryList, TemplateRef, ViewChild, ViewChildren, ViewContainerRef, DebugElement, Pipe, PipeTransform, inject } from '@angular/core'; import { TestBed, ComponentFixture, waitForAsync } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; import { BehaviorSubject, Observable } from 'rxjs'; @@ -1356,17 +1339,32 @@ class DataGenerator { standalone: true }) export class TestIgxForOfDirective extends IgxForOfDirective { + viewContainer: ViewContainerRef; + template: TemplateRef>; + differs: IterableDiffers; + changeDet: ChangeDetectorRef; + zone: NgZone; + protected syncService: IgxForOfScrollSyncService; + public scrStepArray = []; public scrTopArray = []; - constructor( - public viewContainer: ViewContainerRef, - public template: TemplateRef>, - public differs: IterableDiffers, - public changeDet: ChangeDetectorRef, - public zone: NgZone, - protected syncService: IgxForOfScrollSyncService, - platformUtil: PlatformUtil) { + constructor() { + const viewContainer = inject(ViewContainerRef); + const template = inject>>(TemplateRef); + const differs = inject(IterableDiffers); + const changeDet = inject(ChangeDetectorRef); + const zone = inject(NgZone); + const syncService = inject(IgxForOfScrollSyncService); + const platformUtil = inject(PlatformUtil); + super(viewContainer, template, differs, changeDet, zone, syncService, platformUtil, document); + + this.viewContainer = viewContainer; + this.template = template; + this.differs = differs; + this.changeDet = changeDet; + this.zone = zone; + this.syncService = syncService; } public override onScroll(evt) { const ind = this.scrTopArray.length - 1; @@ -1745,6 +1743,8 @@ export class LocalService { imports: [TestIgxForOfDirective, AsyncPipe] }) export class RemoteVirtualizationComponent implements OnInit, AfterViewInit { + private localService = inject(LocalService); + @ViewChild('scrollContainer', { read: TestIgxForOfDirective, static: true }) public parentVirtDir: TestIgxForOfDirective; @@ -1753,8 +1753,6 @@ export class RemoteVirtualizationComponent implements OnInit, AfterViewInit { public height = '500px'; public data; - - constructor(private localService: LocalService) { } public ngOnInit(): void { this.data = this.localService.records; } @@ -1790,6 +1788,8 @@ export class RemoteVirtualizationComponent implements OnInit, AfterViewInit { imports: [TestIgxForOfDirective, AsyncPipe] }) export class RemoteVirtCountComponent implements OnInit, AfterViewInit { + private localService = inject(LocalService); + @ViewChild('scrollContainer', { read: TestIgxForOfDirective, static: true }) public parentVirtDir: TestIgxForOfDirective; @@ -1799,8 +1799,6 @@ export class RemoteVirtCountComponent implements OnInit, AfterViewInit { public height = '500px'; public data; public count: Observable; - - constructor(private localService: LocalService) { } public ngOnInit(): void { this.data = this.localService.records; this.count = this.localService.count; diff --git a/projects/igniteui-angular/src/lib/directives/for-of/for_of.directive.ts b/projects/igniteui-angular/src/lib/directives/for-of/for_of.directive.ts index de6c031eede..1485612b0d0 100644 --- a/projects/igniteui-angular/src/lib/directives/for-of/for_of.directive.ts +++ b/projects/igniteui-angular/src/lib/directives/for-of/for_of.directive.ts @@ -1,29 +1,5 @@ import { NgForOfContext } from '@angular/common'; -import { - ChangeDetectorRef, - ComponentRef, - Directive, - DoCheck, - EmbeddedViewRef, - EventEmitter, - Input, - IterableChanges, - IterableDiffer, - IterableDiffers, - NgZone, - OnChanges, - OnDestroy, - OnInit, - Output, - SimpleChanges, - TemplateRef, - TrackByFunction, - ViewContainerRef, - AfterViewInit, - Inject, - booleanAttribute, - DOCUMENT -} from '@angular/core'; +import { ChangeDetectorRef, ComponentRef, Directive, DoCheck, EmbeddedViewRef, EventEmitter, Input, IterableChanges, IterableDiffer, IterableDiffers, NgZone, OnChanges, OnDestroy, OnInit, Output, SimpleChanges, TemplateRef, TrackByFunction, ViewContainerRef, AfterViewInit, booleanAttribute, DOCUMENT, inject } from '@angular/core'; import { DisplayContainerComponent } from './display.container'; import { HVirtualHelperComponent } from './horizontal.virtual.helper.component'; @@ -109,6 +85,15 @@ export abstract class IgxForOfToken { standalone: true }) export class IgxForOfDirective extends IgxForOfToken implements OnInit, OnChanges, DoCheck, OnDestroy, AfterViewInit { + private _viewContainer = inject(ViewContainerRef); + protected _template = inject>>(TemplateRef); + protected _differs = inject(IterableDiffers); + cdr = inject(ChangeDetectorRef); + protected _zone = inject(NgZone); + protected syncScrollService = inject(IgxForOfScrollSyncService); + protected platformUtil = inject(PlatformUtil); + protected document = inject(DOCUMENT); + /** * Sets the data to be rendered. @@ -404,20 +389,6 @@ export class IgxForOfDirective extends IgxForOfToken this.igxForOf.length; } - constructor( - private _viewContainer: ViewContainerRef, - protected _template: TemplateRef>, - protected _differs: IterableDiffers, - public cdr: ChangeDetectorRef, - protected _zone: NgZone, - protected syncScrollService: IgxForOfScrollSyncService, - protected platformUtil: PlatformUtil, - @Inject(DOCUMENT) - protected document: any, - ) { - super(); - } - public verticalScrollHandler(event) { this.onScroll(event); } @@ -1539,6 +1510,8 @@ export class IgxGridForOfContext extends IgxForOfContext standalone: true }) export class IgxGridForOfDirective extends IgxForOfDirective implements OnInit, OnChanges, DoCheck { + protected syncService = inject(IgxForOfSyncService); + @Input() public set igxGridForOf(value: U & T[] | null) { this.igxForOf = value; @@ -1593,16 +1566,16 @@ export class IgxGridForOfDirective extends IgxForOfDirec @Output() public dataChanging = new EventEmitter(); - constructor( - _viewContainer: ViewContainerRef, - _template: TemplateRef>, - _differs: IterableDiffers, - cdr: ChangeDetectorRef, - _zone: NgZone, - _platformUtil: PlatformUtil, - @Inject(DOCUMENT) _document: any, - syncScrollService: IgxForOfScrollSyncService, - protected syncService: IgxForOfSyncService) { + constructor() { + const _viewContainer = inject(ViewContainerRef); + const _template = inject>>(TemplateRef); + const _differs = inject(IterableDiffers); + const cdr = inject(ChangeDetectorRef); + const _zone = inject(NgZone); + const _platformUtil = inject(PlatformUtil); + const _document = inject(DOCUMENT); + const syncScrollService = inject(IgxForOfScrollSyncService); + super(_viewContainer, _template, _differs, cdr, _zone, syncScrollService, _platformUtil, _document); } diff --git a/projects/igniteui-angular/src/lib/directives/for-of/horizontal.virtual.helper.component.ts b/projects/igniteui-angular/src/lib/directives/for-of/horizontal.virtual.helper.component.ts index c5cd631ab6b..1a743c53440 100644 --- a/projects/igniteui-angular/src/lib/directives/for-of/horizontal.virtual.helper.component.ts +++ b/projects/igniteui-angular/src/lib/directives/for-of/horizontal.virtual.helper.component.ts @@ -1,4 +1,4 @@ -import { Component, ElementRef, HostBinding, Input, ViewChild, ViewContainerRef, ChangeDetectorRef, Inject, NgZone } from '@angular/core'; +import { Component, ElementRef, HostBinding, Input, ViewChild, ViewContainerRef, ChangeDetectorRef, NgZone, inject } from '@angular/core'; import { VirtualHelperBaseDirective } from './base.helper.component'; import { DOCUMENT } from '@angular/common'; import { PlatformUtil } from '../../core/utils'; @@ -19,13 +19,13 @@ export class HVirtualHelperComponent extends VirtualHelperBaseDirective { @HostBinding('class') public cssClasses = 'igx-vhelper--horizontal'; - constructor( - elementRef: ElementRef, - cdr: ChangeDetectorRef, - zone: NgZone, - @Inject(DOCUMENT) document: any, - platformUtil: PlatformUtil - ) { + constructor() { + const elementRef = inject(ElementRef); + const cdr = inject(ChangeDetectorRef); + const zone = inject(NgZone); + const document = inject(DOCUMENT); + const platformUtil = inject(PlatformUtil); + super(elementRef, cdr, zone, document, platformUtil); } diff --git a/projects/igniteui-angular/src/lib/directives/for-of/virtual.helper.component.ts b/projects/igniteui-angular/src/lib/directives/for-of/virtual.helper.component.ts index 9a336472bd2..a8d8a7a0ee2 100644 --- a/projects/igniteui-angular/src/lib/directives/for-of/virtual.helper.component.ts +++ b/projects/igniteui-angular/src/lib/directives/for-of/virtual.helper.component.ts @@ -1,5 +1,4 @@ -import { Component, ElementRef, HostBinding, Input, ViewChild, ViewContainerRef, - ChangeDetectorRef, OnDestroy, OnInit, Inject, NgZone} from '@angular/core'; +import { Component, ElementRef, HostBinding, Input, ViewChild, ViewContainerRef, ChangeDetectorRef, OnDestroy, OnInit, NgZone, inject } from '@angular/core'; import { VirtualHelperBaseDirective } from './base.helper.component'; import { DOCUMENT } from '@angular/common'; import { PlatformUtil } from '../../core/utils'; @@ -21,13 +20,13 @@ export class VirtualHelperComponent extends VirtualHelperBaseDirective implement @HostBinding('class') public cssClasses = 'igx-vhelper--vertical'; - constructor( - elementRef: ElementRef, - cdr: ChangeDetectorRef, - zone: NgZone, - @Inject(DOCUMENT) document: any, - platformUtil: PlatformUtil, - ) { + constructor() { + const elementRef = inject(ElementRef); + const cdr = inject(ChangeDetectorRef); + const zone = inject(NgZone); + const document = inject(DOCUMENT); + const platformUtil = inject(PlatformUtil); + super(elementRef, cdr, zone, document, platformUtil); } diff --git a/projects/igniteui-angular/src/lib/directives/form-control/form-control.directive.ts b/projects/igniteui-angular/src/lib/directives/form-control/form-control.directive.ts index d683aca9b58..91d7b6f1478 100644 --- a/projects/igniteui-angular/src/lib/directives/form-control/form-control.directive.ts +++ b/projects/igniteui-angular/src/lib/directives/form-control/form-control.directive.ts @@ -1,10 +1,4 @@ -import { - Directive, - forwardRef, - ElementRef, - HostListener, - Renderer2 -} from '@angular/core'; +import { Directive, forwardRef, ElementRef, HostListener, Renderer2, inject } from '@angular/core'; import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms'; @Directive({ @@ -19,15 +13,14 @@ import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms'; standalone: true }) export class IgcFormControlDirective implements ControlValueAccessor { + private elementRef = inject(ElementRef); + private renderer = inject(Renderer2); + /** @hidden @internal */ private onChange: any = () => { }; /** @hidden @internal */ private onTouched: any = () => { }; - constructor( - private elementRef: ElementRef, - private renderer: Renderer2) { } - /** @hidden @internal */ @HostListener('blur') public onBlur() { diff --git a/projects/igniteui-angular/src/lib/directives/input/input.directive.spec.ts b/projects/igniteui-angular/src/lib/directives/input/input.directive.spec.ts index 5142e7030fd..98d9833f8d4 100644 --- a/projects/igniteui-angular/src/lib/directives/input/input.directive.spec.ts +++ b/projects/igniteui-angular/src/lib/directives/input/input.directive.spec.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ViewChildren, QueryList, DebugElement } from '@angular/core'; +import { Component, ViewChild, ViewChildren, QueryList, DebugElement, inject } from '@angular/core'; import { TestBed, fakeAsync, tick, waitForAsync } from '@angular/core/testing'; import { FormsModule, UntypedFormBuilder, ReactiveFormsModule, Validators, UntypedFormControl, UntypedFormGroup, FormControl } from '@angular/forms'; import { By } from '@angular/platform-browser'; @@ -1150,6 +1150,8 @@ class DataBoundDisabledInputWithoutValueComponent extends DataBoundDisabledInput imports: [IgxInputGroupComponent, IgxLabelDirective, IgxInputDirective, IgxMaskDirective, ReactiveFormsModule] }) class ReactiveFormComponent { + private fb = inject(UntypedFormBuilder); + @ViewChild('strinput', { static: true, read: IgxInputDirective }) public strIgxInput: IgxInputDirective; public form = this.fb.group({ @@ -1162,8 +1164,6 @@ class ReactiveFormComponent { public inputControl = new FormControl('', [Validators.required]); public textareaControl = new FormControl('', [Validators.required]); - constructor(private fb: UntypedFormBuilder) { } - public markAsTouched() { if (!this.form.valid) { for (const key in this.form.controls) { @@ -1230,7 +1230,9 @@ class InputReactiveFormComponent { fullName: [Validators.required] }; - constructor(fb: UntypedFormBuilder) { + constructor() { + const fb = inject(UntypedFormBuilder); + this.reactiveForm = fb.group({ fullName: new UntypedFormControl('', Validators.required) }); @@ -1295,7 +1297,9 @@ class FileInputFormComponent { inputValue: null }; - constructor(fb: UntypedFormBuilder) { + constructor() { + const fb = inject(UntypedFormBuilder); + this.formWithFileInput = fb.group({ fileInput: new UntypedFormControl('') }); diff --git a/projects/igniteui-angular/src/lib/directives/input/input.directive.ts b/projects/igniteui-angular/src/lib/directives/input/input.directive.ts index daf01c89904..07ae86df3a7 100644 --- a/projects/igniteui-angular/src/lib/directives/input/input.directive.ts +++ b/projects/igniteui-angular/src/lib/directives/input/input.directive.ts @@ -1,18 +1,4 @@ -import { - AfterViewInit, - ChangeDetectorRef, - Directive, - ElementRef, - HostBinding, - HostListener, - Inject, - Input, - OnDestroy, - Optional, - Renderer2, - Self, - booleanAttribute, -} from '@angular/core'; +import { AfterViewInit, ChangeDetectorRef, Directive, ElementRef, HostBinding, HostListener, Input, OnDestroy, Renderer2, booleanAttribute, inject } from '@angular/core'; import { AbstractControl, NgControl, @@ -64,6 +50,13 @@ export enum IgxInputState { standalone: true }) export class IgxInputDirective implements AfterViewInit, OnDestroy { + inputGroup = inject(IgxInputGroupBase); + protected ngModel = inject(NgModel, { optional: true, self: true }); + protected formControl = inject(NgControl, { optional: true, self: true }); + protected element = inject>(ElementRef); + protected cdr = inject(ChangeDetectorRef); + protected renderer = inject(Renderer2); + /** * Sets/gets whether the `"igx-input-group__input"` class is added to the host element. * Default value is `false`. @@ -103,18 +96,6 @@ export class IgxInputDirective implements AfterViewInit, OnDestroy { private _fileNames: string; private _disabled = false; - constructor( - public inputGroup: IgxInputGroupBase, - @Optional() @Self() @Inject(NgModel) protected ngModel: NgModel, - @Optional() - @Self() - @Inject(NgControl) - protected formControl: NgControl, - protected element: ElementRef, - protected cdr: ChangeDetectorRef, - protected renderer: Renderer2 - ) { } - private get ngControl(): NgControl { return this.ngModel ? this.ngModel : this.formControl; } diff --git a/projects/igniteui-angular/src/lib/directives/mask/mask.directive.ts b/projects/igniteui-angular/src/lib/directives/mask/mask.directive.ts index 62dd9b4f53b..74ce3d32466 100644 --- a/projects/igniteui-angular/src/lib/directives/mask/mask.directive.ts +++ b/projects/igniteui-angular/src/lib/directives/mask/mask.directive.ts @@ -1,8 +1,4 @@ -import { - Directive, ElementRef, EventEmitter, HostListener, - Output, PipeTransform, Renderer2, - Input, OnInit, AfterViewChecked, booleanAttribute, -} from '@angular/core'; +import { Directive, ElementRef, EventEmitter, HostListener, Output, PipeTransform, Renderer2, Input, OnInit, AfterViewChecked, booleanAttribute, inject } from '@angular/core'; import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms'; import { MaskParsingService, MaskOptions, parseMask } from './mask-parsing.service'; import { IBaseEventArgs, PlatformUtil } from '../../core/utils'; @@ -15,6 +11,11 @@ import { noop } from 'rxjs'; standalone: true }) export class IgxMaskDirective implements OnInit, AfterViewChecked, ControlValueAccessor { + protected elementRef = inject>(ElementRef); + protected maskParser = inject(MaskParsingService); + protected renderer = inject(Renderer2); + protected platform = inject(PlatformUtil); + /** * Sets the input mask. * ```html @@ -146,12 +147,6 @@ export class IgxMaskDirective implements OnInit, AfterViewChecked, ControlValueA protected _onTouchedCallback: () => void = noop; protected _onChangeCallback: (_: any) => void = noop; - constructor( - protected elementRef: ElementRef, - protected maskParser: MaskParsingService, - protected renderer: Renderer2, - protected platform: PlatformUtil) { } - /** @hidden */ @HostListener('keydown', ['$event']) public onKeyDown(event: KeyboardEvent): void { diff --git a/projects/igniteui-angular/src/lib/directives/radio/radio-group.directive.spec.ts b/projects/igniteui-angular/src/lib/directives/radio/radio-group.directive.spec.ts index dc7b9394273..4f2d53e6267 100644 --- a/projects/igniteui-angular/src/lib/directives/radio/radio-group.directive.spec.ts +++ b/projects/igniteui-angular/src/lib/directives/radio/radio-group.directive.spec.ts @@ -1,4 +1,4 @@ -import { ChangeDetectionStrategy, Component, ComponentRef, OnInit, ViewChild, ViewContainerRef } from '@angular/core'; +import { ChangeDetectionStrategy, Component, ComponentRef, OnInit, ViewChild, ViewContainerRef, inject } from '@angular/core'; import { TestBed, fakeAsync, tick, waitForAsync } from '@angular/core/testing'; import { IgxRadioGroupDirective } from './radio-group.directive'; import { FormsModule, ReactiveFormsModule, UntypedFormGroup, UntypedFormBuilder, FormGroup, FormControl } from '@angular/forms'; @@ -408,6 +408,8 @@ class RadioGroupWithModelComponent { imports: [IgxRadioComponent, IgxRadioGroupDirective, ReactiveFormsModule] }) class RadioGroupReactiveFormsComponent { + private _formBuilder = inject(UntypedFormBuilder); + public seasons = [ 'Winter', 'Spring', @@ -419,7 +421,7 @@ class RadioGroupReactiveFormsComponent { public model: Person = { name: 'Kirk', favoriteSeason: this.seasons[1] }; public personForm: UntypedFormGroup; - constructor(private _formBuilder: UntypedFormBuilder) { + constructor() { this._createForm(); } @@ -462,6 +464,8 @@ class RadioGroupReactiveFormsComponent { imports: [IgxRadioComponent, IgxRadioGroupDirective, ReactiveFormsModule] }) class RadioGroupDeepProjectionComponent { + private _builder = inject(UntypedFormBuilder); + @ViewChild(IgxRadioGroupDirective, { static: true }) public radioGroup: IgxRadioGroupDirective; @@ -469,7 +473,7 @@ class RadioGroupDeepProjectionComponent { public choices = [0, 1, 2]; public group1: UntypedFormGroup; - constructor(private _builder: UntypedFormBuilder) { + constructor() { this._createForm(); } diff --git a/projects/igniteui-angular/src/lib/directives/radio/radio-group.directive.ts b/projects/igniteui-angular/src/lib/directives/radio/radio-group.directive.ts index 86d8a953d13..a6e0c7d9d26 100644 --- a/projects/igniteui-angular/src/lib/directives/radio/radio-group.directive.ts +++ b/projects/igniteui-angular/src/lib/directives/radio/radio-group.directive.ts @@ -1,20 +1,4 @@ -import { - ChangeDetectorRef, - Directive, - DoCheck, - EventEmitter, - HostBinding, - HostListener, - Input, - OnDestroy, - Optional, - Output, - QueryList, - Self, - booleanAttribute, - effect, - signal -} from '@angular/core'; +import { ChangeDetectorRef, Directive, DoCheck, EventEmitter, HostBinding, HostListener, Input, OnDestroy, Output, QueryList, booleanAttribute, effect, signal, inject } from '@angular/core'; import { ControlValueAccessor, NgControl, Validators } from '@angular/forms'; import { fromEvent, noop, Subject, takeUntil } from 'rxjs'; import { IgxRadioComponent } from '../../radio/radio.component'; @@ -61,6 +45,10 @@ let nextId = 0; standalone: true }) export class IgxRadioGroupDirective implements ControlValueAccessor, OnDestroy, DoCheck { + ngControl = inject(NgControl, { optional: true, self: true }); + private _directionality = inject(IgxDirectionality); + private cdr = inject(ChangeDetectorRef); + private _radioButtons = signal([]); private _radioButtonsList = new QueryList(); @@ -479,11 +467,7 @@ export class IgxRadioGroupDirective implements ControlValueAccessor, OnDestroy, this.destroy$.complete(); } - constructor( - @Optional() @Self() public ngControl: NgControl, - private _directionality: IgxDirectionality, - private cdr: ChangeDetectorRef, - ) { + constructor() { if (this.ngControl !== null) { this.ngControl.valueAccessor = this; } diff --git a/projects/igniteui-angular/src/lib/directives/ripple/ripple.directive.ts b/projects/igniteui-angular/src/lib/directives/ripple/ripple.directive.ts index 84ebeb95753..d7e0dc61fd8 100644 --- a/projects/igniteui-angular/src/lib/directives/ripple/ripple.directive.ts +++ b/projects/igniteui-angular/src/lib/directives/ripple/ripple.directive.ts @@ -1,4 +1,4 @@ -import { Directive, ElementRef, HostListener, Input, NgZone, Renderer2, booleanAttribute } from '@angular/core'; +import { Directive, ElementRef, HostListener, Input, NgZone, Renderer2, booleanAttribute, inject } from '@angular/core'; import { AnimationBuilder, style, animate } from '@angular/animations'; @Directive({ @@ -6,6 +6,11 @@ import { AnimationBuilder, style, animate } from '@angular/animations'; standalone: true }) export class IgxRippleDirective { + protected builder = inject(AnimationBuilder); + protected elementRef = inject(ElementRef); + protected renderer = inject(Renderer2); + private zone = inject(NgZone); + /** * Sets/gets the ripple target. * ```html @@ -95,12 +100,6 @@ export class IgxRippleDirective { private rippleHostClass = 'igx-ripple'; private _centered = false; private animationQueue = []; - - constructor( - protected builder: AnimationBuilder, - protected elementRef: ElementRef, - protected renderer: Renderer2, - private zone: NgZone) { } /** * @hidden */ diff --git a/projects/igniteui-angular/src/lib/directives/scroll-inertia/scroll_inertia.directive.spec.ts b/projects/igniteui-angular/src/lib/directives/scroll-inertia/scroll_inertia.directive.spec.ts index 71f5face630..6237f0f421a 100644 --- a/projects/igniteui-angular/src/lib/directives/scroll-inertia/scroll_inertia.directive.spec.ts +++ b/projects/igniteui-angular/src/lib/directives/scroll-inertia/scroll_inertia.directive.spec.ts @@ -1,11 +1,4 @@ -import { - Component, - Directive, - NgZone, - OnInit, - ViewChild, - ElementRef, -} from '@angular/core'; +import { Component, Directive, NgZone, OnInit, ViewChild, ElementRef, inject } from '@angular/core'; import { TestBed, ComponentFixture, fakeAsync, tick, waitForAsync } from '@angular/core/testing'; import { IgxScrollInertiaDirective } from './scroll_inertia.directive'; @@ -317,7 +310,10 @@ describe('Scroll Inertia Directive - Scrolling', () => { }) export class IgxTestScrollInertiaDirective extends IgxScrollInertiaDirective { - constructor(element: ElementRef, _zone: NgZone) { + constructor() { + const element = inject(ElementRef); + const _zone = inject(NgZone); + super(element, _zone); } public override onWheel(evt) { diff --git a/projects/igniteui-angular/src/lib/directives/scroll-inertia/scroll_inertia.directive.ts b/projects/igniteui-angular/src/lib/directives/scroll-inertia/scroll_inertia.directive.ts index 474be997a01..867f72f585a 100644 --- a/projects/igniteui-angular/src/lib/directives/scroll-inertia/scroll_inertia.directive.ts +++ b/projects/igniteui-angular/src/lib/directives/scroll-inertia/scroll_inertia.directive.ts @@ -1,4 +1,4 @@ -import { Directive, Input, ElementRef, NgZone, OnInit, OnDestroy } from '@angular/core'; +import { Directive, Input, ElementRef, NgZone, OnInit, OnDestroy, inject } from '@angular/core'; /** * @hidden @@ -8,6 +8,9 @@ import { Directive, Input, ElementRef, NgZone, OnInit, OnDestroy } from '@angula standalone: true }) export class IgxScrollInertiaDirective implements OnInit, OnDestroy { + private element = inject(ElementRef); + private _zone = inject(NgZone); + @Input() public IgxScrollInertiaDirection: string; @@ -60,8 +63,6 @@ export class IgxScrollInertiaDirective implements OnInit, OnDestroy { private baseDeltaMultiplier = 1 / 120; private firefoxDeltaMultiplier = 1 / 30; - constructor(private element: ElementRef, private _zone: NgZone) { } - public ngOnInit(): void { this._zone.runOutsideAngular(() => { this.parentElement = this.element.nativeElement.parentElement || this.element.nativeElement.parentNode; diff --git a/projects/igniteui-angular/src/lib/directives/template-outlet/template_outlet.directive.ts b/projects/igniteui-angular/src/lib/directives/template-outlet/template_outlet.directive.ts index 742cc0b98e7..1fddf0943eb 100644 --- a/projects/igniteui-angular/src/lib/directives/template-outlet/template_outlet.directive.ts +++ b/projects/igniteui-angular/src/lib/directives/template-outlet/template_outlet.directive.ts @@ -1,7 +1,4 @@ -import { - Directive, EmbeddedViewRef, Input, OnChanges, ChangeDetectorRef, - SimpleChange, SimpleChanges, TemplateRef, ViewContainerRef, NgZone, Output, EventEmitter -} from '@angular/core'; +import { Directive, EmbeddedViewRef, Input, OnChanges, ChangeDetectorRef, SimpleChange, SimpleChanges, TemplateRef, ViewContainerRef, NgZone, Output, EventEmitter, inject } from '@angular/core'; import { IBaseEventArgs } from '../../core/utils'; @@ -13,6 +10,10 @@ import { IBaseEventArgs } from '../../core/utils'; standalone: true }) export class IgxTemplateOutletDirective implements OnChanges { + _viewContainerRef = inject(ViewContainerRef); + private _zone = inject(NgZone); + cdr = inject(ChangeDetectorRef); + @Input() public igxTemplateOutletContext !: any; @Input() public igxTemplateOutlet !: TemplateRef; @@ -38,9 +39,6 @@ export class IgxTemplateOutletDirective implements OnChanges { */ private _embeddedViewsMap: Map>> = new Map(); - constructor(public _viewContainerRef: ViewContainerRef, private _zone: NgZone, public cdr: ChangeDetectorRef) { - } - public ngOnChanges(changes: SimpleChanges) { const actionType: TemplateOutletAction = this._getActionType(changes); switch (actionType) { diff --git a/projects/igniteui-angular/src/lib/directives/text-highlight/text-highlight.directive.spec.ts b/projects/igniteui-angular/src/lib/directives/text-highlight/text-highlight.directive.spec.ts index faa0a923117..98e10d64095 100644 --- a/projects/igniteui-angular/src/lib/directives/text-highlight/text-highlight.directive.spec.ts +++ b/projects/igniteui-angular/src/lib/directives/text-highlight/text-highlight.directive.spec.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild } from '@angular/core'; +import { Component, ViewChild, inject } from '@angular/core'; import { TestBed, waitForAsync } from '@angular/core/testing'; import { IgxTextHighlightDirective, IActiveHighlightInfo} from './text-highlight.directive'; @@ -319,6 +319,8 @@ describe('IgxHighlight', () => { imports: [IgxTextHighlightDirective] }) class HighlightLoremIpsumComponent { + private highlightService = inject(IgxTextHighlightService); + @ViewChild(IgxTextHighlightDirective, { read: IgxTextHighlightDirective, static: true }) public highlight: IgxTextHighlightDirective; @@ -328,8 +330,6 @@ class HighlightLoremIpsumComponent { public html = 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum vulputate luctus dui ut maximus. Quisque sed suscipit lorem. Vestibulum sit.'; - constructor(private highlightService: IgxTextHighlightService) { } - public highlightText(text: string, caseSensitive?: boolean, exactMatch?: boolean) { return this.highlight.highlight(text, caseSensitive, exactMatch); } diff --git a/projects/igniteui-angular/src/lib/directives/text-highlight/text-highlight.directive.ts b/projects/igniteui-angular/src/lib/directives/text-highlight/text-highlight.directive.ts index 5a7a1794f7e..c8e31813175 100644 --- a/projects/igniteui-angular/src/lib/directives/text-highlight/text-highlight.directive.ts +++ b/projects/igniteui-angular/src/lib/directives/text-highlight/text-highlight.directive.ts @@ -1,14 +1,4 @@ -import { - AfterViewInit, - Directive, - ElementRef, - Input, - OnChanges, - OnDestroy, - Renderer2, - SimpleChanges, - AfterViewChecked, -} from '@angular/core'; +import { AfterViewInit, Directive, ElementRef, Input, OnChanges, OnDestroy, Renderer2, SimpleChanges, AfterViewChecked, inject } from '@angular/core'; import { takeUntil } from 'rxjs/operators'; import { Subject } from 'rxjs'; import { compareMaps } from '../../core/utils'; @@ -49,6 +39,10 @@ export interface IActiveHighlightInfo { standalone: true }) export class IgxTextHighlightDirective implements AfterViewInit, AfterViewChecked, OnDestroy, OnChanges { + private element = inject(ElementRef); + private service = inject(IgxTextHighlightService); + private renderer = inject(Renderer2); + /** * Determines the `CSS` class of the highlight elements. * This allows the developer to provide custom `CSS` to customize the highlight. @@ -199,7 +193,7 @@ export class IgxTextHighlightDirective implements AfterViewInit, AfterViewChecke private _defaultCssClass = 'igx-highlight'; private _defaultActiveCssClass = 'igx-highlight--active'; - constructor(private element: ElementRef, private service: IgxTextHighlightService, private renderer: Renderer2) { + constructor() { this.service.onActiveElementChanged.pipe(takeUntil(this.destroy$)).subscribe((groupName) => { if (this.groupName === groupName) { if (this._activeElementIndex !== -1) { diff --git a/projects/igniteui-angular/src/lib/directives/text-selection/text-selection.directive.spec.ts b/projects/igniteui-angular/src/lib/directives/text-selection/text-selection.directive.spec.ts index 777675ef759..2446d1c1eb1 100644 --- a/projects/igniteui-angular/src/lib/directives/text-selection/text-selection.directive.spec.ts +++ b/projects/igniteui-angular/src/lib/directives/text-selection/text-selection.directive.spec.ts @@ -1,4 +1,4 @@ -import { Component, DebugElement, Directive, ElementRef, HostListener, ViewChild } from '@angular/core'; +import { Component, DebugElement, Directive, ElementRef, HostListener, ViewChild, inject } from '@angular/core'; import { fakeAsync, TestBed, tick, waitForAsync } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; @@ -145,7 +145,8 @@ describe('IgxSelection', () => { standalone: true }) class IgxTestFocusDirective { - constructor(private element: ElementRef) { } + private element = inject(ElementRef); + @HostListener('focus') public onFocus() { diff --git a/projects/igniteui-angular/src/lib/directives/text-selection/text-selection.directive.ts b/projects/igniteui-angular/src/lib/directives/text-selection/text-selection.directive.ts index c1cd541ebb8..06828898bb4 100644 --- a/projects/igniteui-angular/src/lib/directives/text-selection/text-selection.directive.ts +++ b/projects/igniteui-angular/src/lib/directives/text-selection/text-selection.directive.ts @@ -1,4 +1,4 @@ -import { Directive, ElementRef, HostListener, Input, booleanAttribute } from '@angular/core'; +import { Directive, ElementRef, HostListener, Input, booleanAttribute, inject } from '@angular/core'; @Directive({ exportAs: 'igxTextSelection', @@ -6,6 +6,8 @@ import { Directive, ElementRef, HostListener, Input, booleanAttribute } from '@a standalone: true }) export class IgxTextSelectionDirective { + private element = inject(ElementRef); + /** * Determines whether the input element could be selected through the directive. * @@ -53,8 +55,6 @@ export class IgxTextSelectionDirective { return this.element.nativeElement; } - constructor(private element: ElementRef) { } - /** * @hidden */ diff --git a/projects/igniteui-angular/src/lib/directives/toggle/toggle.directive.spec.ts b/projects/igniteui-angular/src/lib/directives/toggle/toggle.directive.spec.ts index 8180148ca75..70540bd5086 100644 --- a/projects/igniteui-angular/src/lib/directives/toggle/toggle.directive.spec.ts +++ b/projects/igniteui-angular/src/lib/directives/toggle/toggle.directive.spec.ts @@ -1,4 +1,4 @@ -import { ChangeDetectionStrategy, Component, DebugElement, ViewChild, ElementRef, OnInit } from '@angular/core'; +import { ChangeDetectionStrategy, Component, DebugElement, ViewChild, ElementRef, OnInit, inject as inject_1 } from '@angular/core'; import { fakeAsync, TestBed, tick, waitForAsync } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; import { NoopAnimationsModule } from '@angular/platform-browser/animations'; @@ -721,12 +721,10 @@ export class IgxToggleServiceInjectComponent { imports: [IgxToggleDirective] }) export class IgxOverlayServiceComponent { + overlay = inject_1(IgxOverlayService); + @ViewChild(IgxToggleDirective, { static: true }) public toggle: IgxToggleDirective; @ViewChild(`other`, { static: true }) public other: ElementRef; - /** - * - */ - constructor(public overlay: IgxOverlayService) { } } @Component({ diff --git a/projects/igniteui-angular/src/lib/directives/toggle/toggle.directive.ts b/projects/igniteui-angular/src/lib/directives/toggle/toggle.directive.ts index 72b44260461..a1fc15efcc4 100644 --- a/projects/igniteui-angular/src/lib/directives/toggle/toggle.directive.ts +++ b/projects/igniteui-angular/src/lib/directives/toggle/toggle.directive.ts @@ -1,17 +1,4 @@ -import { - ChangeDetectorRef, - Directive, - ElementRef, - EventEmitter, - HostBinding, - HostListener, - Inject, - Input, - OnDestroy, - OnInit, - Optional, - Output -} from '@angular/core'; +import { ChangeDetectorRef, Directive, ElementRef, EventEmitter, HostBinding, HostListener, Input, OnDestroy, OnInit, Output, inject } from '@angular/core'; import { AbsoluteScrollStrategy } from '../../services/overlay/scroll/absolute-scroll-strategy'; import { CancelableBrowserEventArgs, IBaseEventArgs, PlatformUtil } from '../../core/utils'; import { ConnectedPositioningStrategy } from '../../services/overlay/position/connected-positioning-strategy'; @@ -37,6 +24,12 @@ export interface ToggleViewCancelableEventArgs extends ToggleViewEventArgs, Canc standalone: true }) export class IgxToggleDirective implements IToggleView, OnInit, OnDestroy { + private elementRef = inject(ElementRef); + private cdr = inject(ChangeDetectorRef); + protected overlayService = inject(IgxOverlayService); + private navigationService = inject(IgxNavigationService, { optional: true }); + private platform = inject(PlatformUtil, { optional: true }); + /** * Emits an event after the toggle container is opened. * @@ -194,18 +187,6 @@ export class IgxToggleDirective implements IToggleView, OnInit, OnDestroy { private _overlayClosedSub: Subscription; private _overlayContentAppendedSub: Subscription; - /** - * @hidden - */ - constructor( - private elementRef: ElementRef, - private cdr: ChangeDetectorRef, - @Inject(IgxOverlayService) protected overlayService: IgxOverlayService, - @Optional() private navigationService: IgxNavigationService, - @Optional() private platform?: PlatformUtil - ) { - } - /** * Opens the toggle. * @@ -409,6 +390,9 @@ export class IgxToggleDirective implements IToggleView, OnInit, OnDestroy { standalone: true }) export class IgxToggleActionDirective implements OnInit { + private element = inject(ElementRef); + private navigationService = inject(IgxNavigationService, { optional: true }); + /** * Provide settings that control the toggle overlay positioning, interaction and scroll behavior. * ```typescript @@ -461,8 +445,6 @@ export class IgxToggleActionDirective implements OnInit { protected _overlayDefaults: OverlaySettings; protected _target: IToggleView | string; - constructor(private element: ElementRef, @Optional() private navigationService: IgxNavigationService) { } - /** * @hidden */ @@ -522,7 +504,8 @@ export class IgxToggleActionDirective implements OnInit { standalone: true }) export class IgxOverlayOutletDirective { - constructor(public element: ElementRef) { } + element = inject>(ElementRef); + /** @hidden */ public get nativeElement() { diff --git a/projects/igniteui-angular/src/lib/directives/tooltip/tooltip-target.directive.ts b/projects/igniteui-angular/src/lib/directives/tooltip/tooltip-target.directive.ts index c82d10bc719..16380b3da02 100644 --- a/projects/igniteui-angular/src/lib/directives/tooltip/tooltip-target.directive.ts +++ b/projects/igniteui-angular/src/lib/directives/tooltip/tooltip-target.directive.ts @@ -1,5 +1,5 @@ import { useAnimation } from '@angular/animations'; -import { Directive, OnInit, OnDestroy, Output, ElementRef, Optional, ViewContainerRef, HostListener, Input, EventEmitter, booleanAttribute } from '@angular/core'; +import { Directive, OnInit, OnDestroy, Output, ElementRef, ViewContainerRef, HostListener, Input, EventEmitter, booleanAttribute, inject } from '@angular/core'; import { Subject } from 'rxjs'; import { takeUntil } from 'rxjs/operators'; import { IgxNavigationService } from '../../core/navigation'; @@ -41,6 +41,10 @@ export interface ITooltipHideEventArgs extends IBaseEventArgs { standalone: true }) export class IgxTooltipTargetDirective extends IgxToggleActionDirective implements OnInit, OnDestroy { + private _element: ElementRef; + private _navigationService: IgxNavigationService; + private _viewContainerRef = inject(ViewContainerRef); + /** * Gets/sets the amount of milliseconds that should pass before showing the tooltip. * @@ -187,9 +191,14 @@ export class IgxTooltipTargetDirective extends IgxToggleActionDirective implemen private destroy$ = new Subject(); - constructor(private _element: ElementRef, - @Optional() private _navigationService: IgxNavigationService, private _viewContainerRef: ViewContainerRef) { + constructor() { + const _element = inject(ElementRef); + const _navigationService = inject(IgxNavigationService, { optional: true }); + super(_element, _navigationService); + + this._element = _element; + this._navigationService = _navigationService; } /** diff --git a/projects/igniteui-angular/src/lib/directives/tooltip/tooltip.directive.ts b/projects/igniteui-angular/src/lib/directives/tooltip/tooltip.directive.ts index e03128ec49c..aecfaba7635 100644 --- a/projects/igniteui-angular/src/lib/directives/tooltip/tooltip.directive.ts +++ b/projects/igniteui-angular/src/lib/directives/tooltip/tooltip.directive.ts @@ -1,6 +1,4 @@ -import { - Directive, ElementRef, Input, ChangeDetectorRef, Optional, HostBinding, Inject, OnDestroy, inject, DOCUMENT -} from '@angular/core'; +import { Directive, ElementRef, Input, ChangeDetectorRef, HostBinding, OnDestroy, inject, DOCUMENT } from '@angular/core'; import { IgxOverlayService } from '../../services/overlay/overlay'; import { OverlaySettings } from '../../services/public_api'; import { IgxNavigationService } from '../../core/navigation'; @@ -113,11 +111,12 @@ export class IgxTooltipDirective extends IgxToggleDirective implements OnDestroy private _document = inject(DOCUMENT); /** @hidden */ - constructor( - elementRef: ElementRef, - cdr: ChangeDetectorRef, - @Inject(IgxOverlayService) overlayService: IgxOverlayService, - @Optional() navigationService: IgxNavigationService) { + constructor() { + const elementRef = inject(ElementRef); + const cdr = inject(ChangeDetectorRef); + const overlayService = inject(IgxOverlayService); + const navigationService = inject(IgxNavigationService, { optional: true }); + // D.P. constructor duplication due to es6 compilation, might be obsolete in the future super(elementRef, cdr, overlayService, navigationService); diff --git a/projects/igniteui-angular/src/lib/drop-down/drop-down-item.base.ts b/projects/igniteui-angular/src/lib/drop-down/drop-down-item.base.ts index b18d65bf2d2..cd14a32fdb4 100644 --- a/projects/igniteui-angular/src/lib/drop-down/drop-down-item.base.ts +++ b/projects/igniteui-angular/src/lib/drop-down/drop-down-item.base.ts @@ -1,5 +1,5 @@ import { IDropDownBase, IGX_DROPDOWN_BASE } from './drop-down.common'; -import { Directive, Input, HostBinding, HostListener, ElementRef, Optional, Inject, Output, EventEmitter, booleanAttribute, DoCheck } from '@angular/core'; +import { Directive, Input, HostBinding, HostListener, ElementRef, Output, EventEmitter, booleanAttribute, DoCheck, inject } from '@angular/core'; import { IgxSelectionAPIService } from '../core/selection'; import { IgxDropDownGroupComponent } from './drop-down-group.component'; @@ -17,6 +17,11 @@ let NEXT_ID = 0; standalone: true }) export class IgxDropDownItemBaseDirective implements DoCheck { + protected dropDown = inject(IGX_DROPDOWN_BASE); + protected elementRef = inject(ElementRef); + protected group = inject(IgxDropDownGroupComponent, { optional: true }); + protected selection? = inject(IgxSelectionAPIService, { optional: true }); + /** * Sets/gets the `id` of the item. * ```html @@ -257,13 +262,6 @@ export class IgxDropDownItemBaseDirective implements DoCheck { protected _disabled = false; protected _label = null; - constructor( - @Inject(IGX_DROPDOWN_BASE) protected dropDown: IDropDownBase, - protected elementRef: ElementRef, - @Optional() protected group: IgxDropDownGroupComponent, - @Optional() @Inject(IgxSelectionAPIService) protected selection?: IgxSelectionAPIService - ) { } - /** * @hidden * @internal diff --git a/projects/igniteui-angular/src/lib/drop-down/drop-down-navigation.directive.ts b/projects/igniteui-angular/src/lib/drop-down/drop-down-navigation.directive.ts index 133e239e3a7..e13a787631d 100644 --- a/projects/igniteui-angular/src/lib/drop-down/drop-down-navigation.directive.ts +++ b/projects/igniteui-angular/src/lib/drop-down/drop-down-navigation.directive.ts @@ -1,4 +1,4 @@ -import { Directive, Optional, Self, Input, HostListener, Inject } from '@angular/core'; +import { Directive, Input, HostListener, inject } from '@angular/core'; import { IGX_DROPDOWN_BASE } from './drop-down.common'; import { IDropDownNavigationDirective } from './drop-down.common'; import { IgxDropDownBaseDirective } from './drop-down.base'; @@ -12,10 +12,10 @@ import { DropDownActionKey } from './drop-down.common'; standalone: true }) export class IgxDropDownItemNavigationDirective implements IDropDownNavigationDirective { + dropdown = inject(IGX_DROPDOWN_BASE, { self: true, optional: true }); - protected _target: IgxDropDownBaseDirective = null; - constructor(@Self() @Optional() @Inject(IGX_DROPDOWN_BASE) public dropdown: IgxDropDownBaseDirective) { } + protected _target: IgxDropDownBaseDirective = null; /** * Gets the target of the navigation directive; diff --git a/projects/igniteui-angular/src/lib/drop-down/drop-down.component.ts b/projects/igniteui-angular/src/lib/drop-down/drop-down.component.ts index a40f395835d..c13d8ce5f82 100644 --- a/projects/igniteui-angular/src/lib/drop-down/drop-down.component.ts +++ b/projects/igniteui-angular/src/lib/drop-down/drop-down.component.ts @@ -1,23 +1,4 @@ -import { - ChangeDetectorRef, - Component, - ContentChildren, - ElementRef, - forwardRef, - QueryList, - OnChanges, - Input, - OnDestroy, - ViewChild, - ContentChild, - AfterViewInit, - Output, - EventEmitter, - SimpleChanges, - booleanAttribute, - Inject, - DOCUMENT -} from '@angular/core'; +import { ChangeDetectorRef, Component, ContentChildren, ElementRef, forwardRef, QueryList, OnChanges, Input, OnDestroy, ViewChild, ContentChild, AfterViewInit, Output, EventEmitter, SimpleChanges, booleanAttribute, DOCUMENT, inject } from '@angular/core'; import { IgxToggleDirective, ToggleViewEventArgs } from '../directives/toggle/toggle.directive'; import { IgxDropDownItemComponent } from './drop-down-item.component'; import { IgxDropDownBaseDirective } from './drop-down.base'; @@ -57,6 +38,8 @@ import { ConnectedPositioningStrategy } from '../services/public_api'; imports: [IgxToggleDirective] }) export class IgxDropDownComponent extends IgxDropDownBaseDirective implements IDropDownBase, OnChanges, AfterViewInit, OnDestroy { + protected selection = inject(IgxSelectionAPIService); + /** * @hidden * @internal @@ -227,11 +210,11 @@ export class IgxDropDownComponent extends IgxDropDownBaseDirective implements ID protected destroy$ = new Subject(); protected _scrollPosition: number; - constructor( - elementRef: ElementRef, - cdr: ChangeDetectorRef, - @Inject(DOCUMENT) document: any, - protected selection: IgxSelectionAPIService) { + constructor() { + const elementRef = inject(ElementRef); + const cdr = inject(ChangeDetectorRef); + const document = inject(DOCUMENT); + super(elementRef, cdr, document); } diff --git a/projects/igniteui-angular/src/lib/expansion-panel/expansion-panel-body.component.ts b/projects/igniteui-angular/src/lib/expansion-panel/expansion-panel-body.component.ts index ddb01158e96..c8d218462d7 100644 --- a/projects/igniteui-angular/src/lib/expansion-panel/expansion-panel-body.component.ts +++ b/projects/igniteui-angular/src/lib/expansion-panel/expansion-panel-body.component.ts @@ -1,4 +1,4 @@ -import { Component, HostBinding, ElementRef, Input, ChangeDetectorRef, Inject } from '@angular/core'; +import { Component, HostBinding, ElementRef, Input, ChangeDetectorRef, inject } from '@angular/core'; import { IgxExpansionPanelBase, IGX_EXPANSION_PANEL_COMPONENT } from './expansion-panel.common'; @Component({ @@ -7,6 +7,10 @@ import { IgxExpansionPanelBase, IGX_EXPANSION_PANEL_COMPONENT } from './expansio standalone: true }) export class IgxExpansionPanelBodyComponent { + panel = inject(IGX_EXPANSION_PANEL_COMPONENT); + element = inject(ElementRef); + cdr = inject(ChangeDetectorRef); + /** * @hidden */ @@ -34,10 +38,6 @@ export class IgxExpansionPanelBodyComponent { private _labelledBy = ''; private _label = ''; - constructor( - @Inject(IGX_EXPANSION_PANEL_COMPONENT) public panel: IgxExpansionPanelBase, - public element: ElementRef, public cdr: ChangeDetectorRef) { - } /** * Gets the `aria-label` attribute of the panel body diff --git a/projects/igniteui-angular/src/lib/expansion-panel/expansion-panel-header.component.ts b/projects/igniteui-angular/src/lib/expansion-panel/expansion-panel-header.component.ts index 644d4083d35..76bca17ac83 100644 --- a/projects/igniteui-angular/src/lib/expansion-panel/expansion-panel-header.component.ts +++ b/projects/igniteui-angular/src/lib/expansion-panel/expansion-panel-header.component.ts @@ -1,18 +1,4 @@ -import { - Component, - ChangeDetectorRef, - ElementRef, - HostBinding, - HostListener, - Input, - Host, - EventEmitter, - Output, - ContentChild, - Inject, - ViewChild, - booleanAttribute -} from '@angular/core'; +import { Component, ChangeDetectorRef, ElementRef, HostBinding, HostListener, Input, EventEmitter, Output, ContentChild, ViewChild, booleanAttribute, inject } from '@angular/core'; import { IgxExpansionPanelIconDirective } from './expansion-panel.directives'; import { IGX_EXPANSION_PANEL_COMPONENT, IgxExpansionPanelBase, IExpansionPanelCancelableEventArgs } from './expansion-panel.common'; import { IgxIconComponent } from '../icon/icon.component'; @@ -34,6 +20,10 @@ export type ExpansionPanelHeaderIconPosition = (typeof ExpansionPanelHeaderIconP imports: [IgxIconComponent] }) export class IgxExpansionPanelHeaderComponent { + panel = inject(IGX_EXPANSION_PANEL_COMPONENT, { host: true }); + cdr = inject(ChangeDetectorRef); + elementRef = inject(ElementRef); + /** * Returns a reference to the `igx-expansion-panel-icon` element; * If `iconPosition` is `NONE` - return null; @@ -213,12 +203,7 @@ export class IgxExpansionPanelHeaderComponent { private _iconTemplate = false; private _disabled = false; - constructor( - @Host() @Inject(IGX_EXPANSION_PANEL_COMPONENT) - public panel: IgxExpansionPanelBase, - public cdr: ChangeDetectorRef, - public elementRef: ElementRef, - ) { + constructor() { this.id = `${this.panel.id}-header`; } diff --git a/projects/igniteui-angular/src/lib/expansion-panel/expansion-panel.component.ts b/projects/igniteui-angular/src/lib/expansion-panel/expansion-panel.component.ts index dbbf42b64ae..1e079cd6eaf 100644 --- a/projects/igniteui-angular/src/lib/expansion-panel/expansion-panel.component.ts +++ b/projects/igniteui-angular/src/lib/expansion-panel/expansion-panel.component.ts @@ -1,16 +1,4 @@ -import { - AfterContentInit, - ChangeDetectorRef, - Component, - ContentChild, - ElementRef, - EventEmitter, - HostBinding, - Inject, - Input, - Output, - booleanAttribute -} from '@angular/core'; +import { AfterContentInit, ChangeDetectorRef, Component, ContentChild, ElementRef, EventEmitter, HostBinding, Input, Output, booleanAttribute, inject } from '@angular/core'; import { IgxAngularAnimationService } from '../services/animation/angular-animation-service'; import { AnimationService } from '../services/animation/animation'; import { IgxExpansionPanelBodyComponent } from './expansion-panel-body.component'; @@ -32,6 +20,9 @@ let NEXT_ID = 0; imports: [] }) export class IgxExpansionPanelComponent extends ToggleAnimationPlayer implements IgxExpansionPanelBase, AfterContentInit { + private cdr = inject(ChangeDetectorRef); + private elementRef = inject(ElementRef); + /** * Sets/gets the animation settings of the expansion panel component * Open and Close animation should be passed @@ -214,10 +205,9 @@ export class IgxExpansionPanelComponent extends ToggleAnimationPlayer implements @ContentChild(IgxExpansionPanelHeaderComponent, { read: IgxExpansionPanelHeaderComponent }) public header: IgxExpansionPanelHeaderComponent; - constructor( - @Inject(IgxAngularAnimationService) animationService: AnimationService, - private cdr: ChangeDetectorRef, - private elementRef?: ElementRef) { + constructor() { + const animationService = inject(IgxAngularAnimationService); + super(animationService); } diff --git a/projects/igniteui-angular/src/lib/grids/api.service.ts b/projects/igniteui-angular/src/lib/grids/api.service.ts index 6bef1a38a97..dec8338f26b 100644 --- a/projects/igniteui-angular/src/lib/grids/api.service.ts +++ b/projects/igniteui-angular/src/lib/grids/api.service.ts @@ -1,4 +1,4 @@ -import { Injectable } from '@angular/core'; +import { Injectable, inject } from '@angular/core'; import { Subject } from 'rxjs'; import { cloneArray, reverseMapper, mergeObjects } from '../core/utils'; import { DataUtil, GridColumnDataType } from '../data-operations/data-util'; @@ -17,16 +17,14 @@ import { FilterUtil } from '../data-operations/filtering-strategy'; */ @Injectable() export class GridBaseAPIService implements GridServiceType { + crudService = inject(IgxGridCRUDService); + cms = inject(IgxColumnMovingService); + public grid: T; protected destroyMap: Map> = new Map>(); - constructor( - public crudService: IgxGridCRUDService, - public cms: IgxColumnMovingService - ) { } - public get_column_by_name(name: string): ColumnType { return this.grid.columns.find((col: ColumnType) => col.field === name); } diff --git a/projects/igniteui-angular/src/lib/grids/cell.component.ts b/projects/igniteui-angular/src/lib/grids/cell.component.ts index 8cd78803984..233d457759b 100644 --- a/projects/igniteui-angular/src/lib/grids/cell.component.ts +++ b/projects/igniteui-angular/src/lib/grids/cell.component.ts @@ -1,25 +1,5 @@ import { useAnimation } from '@angular/animations'; -import { - ChangeDetectionStrategy, - ChangeDetectorRef, - Component, - ElementRef, - HostBinding, - HostListener, - Input, - TemplateRef, - ViewChild, - NgZone, - OnInit, - OnDestroy, - OnChanges, - SimpleChanges, - Inject, - ViewChildren, - QueryList, - AfterViewInit, - booleanAttribute -} from '@angular/core'; +import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, HostBinding, HostListener, Input, TemplateRef, ViewChild, NgZone, OnInit, OnDestroy, OnChanges, SimpleChanges, ViewChildren, QueryList, AfterViewInit, booleanAttribute, inject } from '@angular/core'; import { formatPercent, NgClass, NgTemplateOutlet, DecimalPipe, PercentPipe, CurrencyPipe, DatePipe, getLocaleCurrencyCode, getCurrencySymbol } from '@angular/common'; import { FormControl, FormGroup, ReactiveFormsModule } from '@angular/forms'; @@ -102,6 +82,15 @@ import { fadeOut, scaleInCenter } from 'igniteui-angular/animations'; ] }) export class IgxGridCellComponent implements OnInit, OnChanges, OnDestroy, CellType, AfterViewInit { + protected selectionService = inject(IgxGridSelectionService); + grid = inject(IGX_GRID_BASE); + protected overlayService = inject(IgxOverlayService); + cdr = inject(ChangeDetectorRef); + private element = inject>(ElementRef); + protected zone = inject(NgZone); + private touchManager = inject(HammerGesturesManager); + protected platformUtil = inject(PlatformUtil); + private _destroy$ = new Subject(); /** * @hidden @@ -797,17 +786,6 @@ export class IgxGridCellComponent implements OnInit, OnChanges, OnDestroy, CellT private _cellSelection: GridSelectionMode = GridSelectionMode.multiple; private _vIndex = -1; - constructor( - protected selectionService: IgxGridSelectionService, - @Inject(IGX_GRID_BASE) public grid: GridType, - @Inject(IgxOverlayService) protected overlayService: IgxOverlayService, - public cdr: ChangeDetectorRef, - private element: ElementRef, - protected zone: NgZone, - private touchManager: HammerGesturesManager, - protected platformUtil: PlatformUtil - ) { } - /** * @hidden * @internal diff --git a/projects/igniteui-angular/src/lib/grids/column-actions/column-actions.component.ts b/projects/igniteui-angular/src/lib/grids/column-actions/column-actions.component.ts index 43c6c34b0dd..27bd77c4836 100644 --- a/projects/igniteui-angular/src/lib/grids/column-actions/column-actions.component.ts +++ b/projects/igniteui-angular/src/lib/grids/column-actions/column-actions.component.ts @@ -1,4 +1,4 @@ -import { Component, DoCheck, EventEmitter, HostBinding, Inject, Input, IterableDiffer, IterableDiffers, Output, Pipe, PipeTransform, QueryList, ViewChildren, booleanAttribute, forwardRef } from '@angular/core'; +import { Component, DoCheck, EventEmitter, HostBinding, Input, IterableDiffer, IterableDiffers, Output, Pipe, PipeTransform, QueryList, ViewChildren, booleanAttribute, forwardRef, inject } from '@angular/core'; import { ColumnDisplayOrder } from '../common/enums'; import { ColumnType, GridType } from '../common/grid.interface'; import { IColumnToggledEventArgs } from '../common/events'; @@ -23,6 +23,8 @@ let NEXT_ID = 0; imports: [IgxInputGroupComponent, FormsModule, IgxInputDirective, IgxCheckboxComponent, IgxButtonDirective, IgxRippleDirective, forwardRef(() => IgxColumnActionEnabledPipe), forwardRef(() => IgxFilterActionColumnsPipe), forwardRef(() => IgxSortActionColumnsPipe)] }) export class IgxColumnActionsComponent implements DoCheck { + private differs = inject(IterableDiffers); + /** * Gets/Sets the grid to provide column actions for. @@ -161,7 +163,7 @@ export class IgxColumnActionsComponent implements DoCheck { */ private _id = `igx-column-actions-${NEXT_ID++}`; - constructor(private differs: IterableDiffers) { + constructor() { this._differ = this.differs.find([]).create(this.trackChanges); } @@ -390,8 +392,8 @@ export class IgxColumnActionsComponent implements DoCheck { standalone: true }) export class IgxColumnActionEnabledPipe implements PipeTransform { + protected columnActions = inject(IgxColumnActionsComponent); - constructor(@Inject(IgxColumnActionsComponent) protected columnActions: IgxColumnActionsComponent) { } public transform( collection: ColumnType[], @@ -419,8 +421,8 @@ export class IgxColumnActionEnabledPipe implements PipeTransform { standalone: true }) export class IgxFilterActionColumnsPipe implements PipeTransform { + protected columnActions = inject(IgxColumnActionsComponent); - constructor(@Inject(IgxColumnActionsComponent) protected columnActions: IgxColumnActionsComponent) { } public transform(collection: ColumnType[], filterCriteria: string, _pipeTrigger: number): ColumnType[] { if (!collection) { diff --git a/projects/igniteui-angular/src/lib/grids/column-actions/column-hiding.directive.ts b/projects/igniteui-angular/src/lib/grids/column-actions/column-hiding.directive.ts index 54ba5a48904..2102908fa4b 100644 --- a/projects/igniteui-angular/src/lib/grids/column-actions/column-hiding.directive.ts +++ b/projects/igniteui-angular/src/lib/grids/column-actions/column-hiding.directive.ts @@ -1,4 +1,4 @@ -import { Directive, Inject } from '@angular/core'; +import { Directive, inject } from '@angular/core'; import { ColumnType } from '../common/grid.interface'; import { IgxColumnActionsBaseDirective } from './column-actions-base.directive'; import { IgxColumnActionsComponent } from './column-actions.component'; @@ -8,11 +8,13 @@ import { IgxColumnActionsComponent } from './column-actions.component'; standalone: true }) export class IgxColumnHidingDirective extends IgxColumnActionsBaseDirective { + protected columnActions = inject(IgxColumnActionsComponent); - constructor( - @Inject(IgxColumnActionsComponent) protected columnActions: IgxColumnActionsComponent - ) { + + constructor() { super(); + const columnActions = this.columnActions; + columnActions.actionsDirective = this; } diff --git a/projects/igniteui-angular/src/lib/grids/column-actions/column-pinning.directive.ts b/projects/igniteui-angular/src/lib/grids/column-actions/column-pinning.directive.ts index 9f43fbe2527..81cbc64f40a 100644 --- a/projects/igniteui-angular/src/lib/grids/column-actions/column-pinning.directive.ts +++ b/projects/igniteui-angular/src/lib/grids/column-actions/column-pinning.directive.ts @@ -1,4 +1,4 @@ -import { Directive, Inject } from '@angular/core'; +import { Directive, inject } from '@angular/core'; import { ColumnType } from '../common/grid.interface'; import { IgxColumnActionsBaseDirective } from './column-actions-base.directive'; import { IgxColumnActionsComponent } from './column-actions.component'; @@ -8,11 +8,13 @@ import { IgxColumnActionsComponent } from './column-actions.component'; standalone: true }) export class IgxColumnPinningDirective extends IgxColumnActionsBaseDirective { + protected columnActions = inject(IgxColumnActionsComponent); - constructor( - @Inject(IgxColumnActionsComponent) protected columnActions: IgxColumnActionsComponent - ) { + + constructor() { super(); + const columnActions = this.columnActions; + columnActions.actionsDirective = this; } diff --git a/projects/igniteui-angular/src/lib/grids/columns/column.component.ts b/projects/igniteui-angular/src/lib/grids/columns/column.component.ts index 641c2fb5a0c..117a3e3224d 100644 --- a/projects/igniteui-angular/src/lib/grids/columns/column.component.ts +++ b/projects/igniteui-angular/src/lib/grids/columns/column.component.ts @@ -1,23 +1,6 @@ import { Subject } from 'rxjs'; import { isEqual } from 'lodash-es'; -import { - AfterContentInit, - ChangeDetectorRef, - ChangeDetectionStrategy, - Component, - ContentChild, - ContentChildren, - Input, - QueryList, - TemplateRef, - Output, - EventEmitter, - OnDestroy, - Inject, - Optional, - Self, - booleanAttribute, -} from '@angular/core'; +import { AfterContentInit, ChangeDetectorRef, ChangeDetectionStrategy, Component, ContentChild, ContentChildren, Input, QueryList, TemplateRef, Output, EventEmitter, OnDestroy, booleanAttribute, inject } from '@angular/core'; import { notifyChanges } from '../watch-changes'; import { WatchColumnChanges } from '../watch-changes'; import { GridColumnDataType } from '../../data-operations/data-util'; @@ -87,6 +70,11 @@ const DEFAULT_DIGITS_INFO = '1.0-3'; standalone: true }) export class IgxColumnComponent implements AfterContentInit, OnDestroy, ColumnType { + grid = inject(IGX_GRID_BASE); + private _validators = inject(NG_VALIDATORS, { optional: true, self: true }); + cdr = inject(ChangeDetectorRef); + protected platform = inject(PlatformUtil); + /** * Sets/gets the `field` value. * ```typescript @@ -1904,13 +1892,9 @@ export class IgxColumnComponent implements AfterContentInit, OnDestroy, ColumnTy private _columnPipeArgs: IColumnPipeArgs = { digitsInfo: DEFAULT_DIGITS_INFO }; private _editorOptions: IColumnEditorOptions = { }; - constructor( - @Inject(IGX_GRID_BASE) public grid: GridType, - @Optional() @Self() @Inject(NG_VALIDATORS) private _validators: Validator[], - /** @hidden @internal **/ - public cdr: ChangeDetectorRef, - protected platform: PlatformUtil, - ) { + constructor() { + const _validators = this._validators; + this.validators = _validators; } diff --git a/projects/igniteui-angular/src/lib/grids/columns/templates.directive.ts b/projects/igniteui-angular/src/lib/grids/columns/templates.directive.ts index a13e22f9a12..964d4a47144 100644 --- a/projects/igniteui-angular/src/lib/grids/columns/templates.directive.ts +++ b/projects/igniteui-angular/src/lib/grids/columns/templates.directive.ts @@ -1,4 +1,4 @@ -import { Directive, TemplateRef } from '@angular/core'; +import { Directive, TemplateRef, inject } from '@angular/core'; import { IgxCellTemplateContext, IgxColumnTemplateContext, IgxSummaryTemplateContext } from '../common/grid.interface'; @Directive({ @@ -6,7 +6,8 @@ import { IgxCellTemplateContext, IgxColumnTemplateContext, IgxSummaryTemplateCon standalone: true }) export class IgxFilterCellTemplateDirective { - constructor(public template: TemplateRef) { } + template = inject>(TemplateRef); + public static ngTemplateContextGuard(_directive: IgxFilterCellTemplateDirective, context: unknown): context is IgxColumnTemplateContext { @@ -19,7 +20,8 @@ export class IgxFilterCellTemplateDirective { standalone: true }) export class IgxCellTemplateDirective { - constructor(public template: TemplateRef) { } + template = inject>(TemplateRef); + public static ngTemplateContextGuard(_directive: IgxCellTemplateDirective, context: unknown): context is IgxCellTemplateContext { @@ -32,7 +34,8 @@ export class IgxCellTemplateDirective { standalone: true }) export class IgxCellValidationErrorDirective { - constructor(public template: TemplateRef) { } + template = inject>(TemplateRef); + public static ngTemplateContextGuard(_directive: IgxCellValidationErrorDirective, context: unknown): context is IgxCellTemplateContext { @@ -45,7 +48,8 @@ export class IgxCellValidationErrorDirective { standalone: true }) export class IgxCellHeaderTemplateDirective { - constructor(public template: TemplateRef) { } + template = inject>(TemplateRef); + public static ngTemplateContextGuard(_directive: IgxCellHeaderTemplateDirective, context: unknown): context is IgxColumnTemplateContext { @@ -61,7 +65,7 @@ export class IgxCellHeaderTemplateDirective { standalone: true }) export class IgxCellFooterTemplateDirective { - constructor(public template: TemplateRef) { } + template = inject>(TemplateRef); } @Directive({ @@ -69,7 +73,8 @@ export class IgxCellFooterTemplateDirective { standalone: true }) export class IgxCellEditorTemplateDirective { - constructor(public template: TemplateRef) { } + template = inject>(TemplateRef); + public static ngTemplateContextGuard(_directive: IgxCellEditorTemplateDirective, context: unknown): context is IgxCellTemplateContext { @@ -82,7 +87,8 @@ export class IgxCellEditorTemplateDirective { standalone: true }) export class IgxCollapsibleIndicatorTemplateDirective { - constructor(public template: TemplateRef) { } + template = inject>(TemplateRef); + public static ngTemplateContextGuard(_directive: IgxCollapsibleIndicatorTemplateDirective, context: unknown): context is IgxColumnTemplateContext { @@ -95,7 +101,8 @@ export class IgxCollapsibleIndicatorTemplateDirective { standalone: true }) export class IgxSummaryTemplateDirective { - constructor(public template: TemplateRef) { } + template = inject>(TemplateRef); + public static ngTemplateContextGuard(_directive: IgxSummaryTemplateDirective, context: unknown): context is IgxSummaryTemplateContext { diff --git a/projects/igniteui-angular/src/lib/grids/common/pipes.ts b/projects/igniteui-angular/src/lib/grids/common/pipes.ts index 818a0ea3854..09e04a86741 100644 --- a/projects/igniteui-angular/src/lib/grids/common/pipes.ts +++ b/projects/igniteui-angular/src/lib/grids/common/pipes.ts @@ -1,4 +1,4 @@ -import { Pipe, PipeTransform, Inject } from '@angular/core'; +import { Pipe, PipeTransform, inject } from '@angular/core'; import { DataUtil } from '../../data-operations/data-util'; import { cloneArray, columnFieldPath, resolveNestedPath } from '../../core/utils'; import { GridType, IGX_GRID_BASE, RowType } from './grid.interface'; @@ -99,9 +99,11 @@ export class IgxGridCellImageAltPipe implements PipeTransform { standalone: true }) export class IgxGridRowClassesPipe implements PipeTransform { + private grid = inject(IGX_GRID_BASE); + public row: RowType; - constructor(@Inject(IGX_GRID_BASE) private grid: GridType) { + constructor() { this.row = new IgxGridRow(this.grid as any, -1, {}); } @@ -159,8 +161,8 @@ export class IgxGridRowClassesPipe implements PipeTransform { standalone: true }) export class IgxGridRowStylesPipe implements PipeTransform { + private grid = inject(IGX_GRID_BASE); - constructor(@Inject(IGX_GRID_BASE) private grid: GridType) { } public transform(styles: GridStyleCSSProperty, rowData: any, index: number, __: number): GridStyleCSSProperty { const css = {}; @@ -232,8 +234,8 @@ export class IgxGridFilterConditionPipe implements PipeTransform { standalone: true }) export class IgxGridTransactionPipe implements PipeTransform { + private grid = inject(IGX_GRID_BASE); - constructor(@Inject(IGX_GRID_BASE) private grid: GridType) { } public transform(collection: any[], _id: string, _pipeTrigger: number) { @@ -302,8 +304,8 @@ function buildDataView(): MethodDecorator { standalone: true }) export class IgxGridRowPinningPipe implements PipeTransform { + private grid = inject(IGX_GRID_BASE); - constructor(@Inject(IGX_GRID_BASE) private grid: GridType) { } @buildDataView() public transform(collection: any[], id: string, isPinned = false, _pipeTrigger: number) { @@ -396,8 +398,8 @@ export class IgxSummaryFormatterPipe implements PipeTransform { standalone: true }) export class IgxGridAddRowPipe implements PipeTransform { + private grid = inject(IGX_GRID_BASE); - constructor(@Inject(IGX_GRID_BASE) private grid: GridType) { } public transform(collection: any, isPinned = false, _pipeTrigger: number) { if (!this.grid.rowEditable || !this.grid.crudService.row || !this.grid.crudService.row.isAddRow || diff --git a/projects/igniteui-angular/src/lib/grids/filtering/advanced-filtering/advanced-filtering-dialog.component.ts b/projects/igniteui-angular/src/lib/grids/filtering/advanced-filtering/advanced-filtering-dialog.component.ts index e334ede030b..28a268894ad 100644 --- a/projects/igniteui-angular/src/lib/grids/filtering/advanced-filtering/advanced-filtering-dialog.component.ts +++ b/projects/igniteui-angular/src/lib/grids/filtering/advanced-filtering/advanced-filtering-dialog.component.ts @@ -1,6 +1,4 @@ -import { - Component, Input, ViewChild, ChangeDetectorRef, AfterViewInit, OnDestroy, HostBinding -} from '@angular/core'; +import { Component, Input, ViewChild, ChangeDetectorRef, AfterViewInit, OnDestroy, HostBinding, inject } from '@angular/core'; import { IgxOverlayService } from '../../../services/overlay/overlay'; import { IDragStartEventArgs, IgxDragDirective, IgxDragHandleDirective } from '../../../directives/drag-drop/drag-drop.directive'; import { Subject } from 'rxjs'; @@ -35,6 +33,9 @@ import { IgxRowIslandComponent } from '../../hierarchical-grid/row-island.compon imports: [IgxDragDirective, NgClass, IgxQueryBuilderComponent, IgxQueryBuilderHeaderComponent, IgxDragHandleDirective, IgxButtonDirective] }) export class IgxAdvancedFilteringDialogComponent implements AfterViewInit, OnDestroy { + cdr = inject(ChangeDetectorRef); + protected platform = inject(PlatformUtil); + /** * @hidden @internal */ @@ -61,8 +62,6 @@ export class IgxAdvancedFilteringDialogComponent implements AfterViewInit, OnDes private _overlayComponentId: string; private _overlayService: IgxOverlayService; private _grid: GridType; - - constructor(public cdr: ChangeDetectorRef, protected platform: PlatformUtil) { } /** * @hidden @internal */ diff --git a/projects/igniteui-angular/src/lib/grids/filtering/base/grid-filtering-cell.component.ts b/projects/igniteui-angular/src/lib/grids/filtering/base/grid-filtering-cell.component.ts index a2b08705437..ff51ccab240 100644 --- a/projects/igniteui-angular/src/lib/grids/filtering/base/grid-filtering-cell.component.ts +++ b/projects/igniteui-angular/src/lib/grids/filtering/base/grid-filtering-cell.component.ts @@ -1,16 +1,4 @@ -import { - AfterViewInit, - ChangeDetectionStrategy, - ChangeDetectorRef, - Component, - DoCheck, - ElementRef, - HostBinding, - Input, - OnInit, - TemplateRef, - ViewChild -} from '@angular/core'; +import { AfterViewInit, ChangeDetectionStrategy, ChangeDetectorRef, Component, DoCheck, ElementRef, HostBinding, Input, OnInit, TemplateRef, ViewChild, inject } from '@angular/core'; import { IFilteringExpression } from '../../../data-operations/filtering-expression.interface'; import { IgxFilteringService } from '../grid-filtering.service'; import { ExpressionUI } from '../excel-style/common'; @@ -41,6 +29,9 @@ import { Size } from '../../common/enums'; ] }) export class IgxGridFilteringCellComponent implements AfterViewInit, OnInit, DoCheck { + cdr = inject(ChangeDetectorRef); + filteringService = inject(IgxFilteringService); + @Input() public column: ColumnType; @@ -78,10 +69,7 @@ export class IgxGridFilteringCellComponent implements AfterViewInit, OnInit, DoC private baseClass = 'igx-grid__filtering-cell-indicator'; - constructor( - public cdr: ChangeDetectorRef, - public filteringService: IgxFilteringService, - ) { + constructor() { this.filteringService.subscribeToEvents(); } diff --git a/projects/igniteui-angular/src/lib/grids/filtering/base/grid-filtering-row.component.ts b/projects/igniteui-angular/src/lib/grids/filtering/base/grid-filtering-row.component.ts index ef7ab4f3b0a..2ddccfebeeb 100644 --- a/projects/igniteui-angular/src/lib/grids/filtering/base/grid-filtering-row.component.ts +++ b/projects/igniteui-angular/src/lib/grids/filtering/base/grid-filtering-row.component.ts @@ -1,19 +1,4 @@ -import { - AfterViewInit, - ChangeDetectorRef, - Component, - Input, - TemplateRef, - ViewChild, - ViewChildren, - QueryList, - ElementRef, - HostBinding, - ChangeDetectionStrategy, - ViewRef, - HostListener, - OnDestroy -} from '@angular/core'; +import { AfterViewInit, ChangeDetectorRef, Component, Input, TemplateRef, ViewChild, ViewChildren, QueryList, ElementRef, HostBinding, ChangeDetectionStrategy, ViewRef, HostListener, OnDestroy, inject } from '@angular/core'; import { GridColumnDataType, DataUtil } from '../../../data-operations/data-util'; import { IgxDropDownComponent } from '../../../drop-down/drop-down.component'; import { IFilteringOperation } from '../../../data-operations/filtering-condition'; @@ -57,6 +42,11 @@ import { Size } from '../../common/enums'; imports: [IgxDropDownComponent, IgxDropDownItemComponent, IgxChipsAreaComponent, IgxChipComponent, IgxIconComponent, IgxInputGroupComponent, IgxPrefixDirective, IgxDropDownItemNavigationDirective, IgxInputDirective, IgxSuffixDirective, IgxDatePickerComponent, IgxPickerToggleComponent, IgxPickerClearComponent, IgxTimePickerComponent, IgxDateTimeEditorDirective, NgTemplateOutlet, IgxButtonDirective, NgClass, IgxRippleDirective, IgxIconButtonDirective] }) export class IgxGridFilteringRowComponent implements AfterViewInit, OnDestroy { + filteringService = inject(IgxFilteringService); + ref = inject>(ElementRef); + cdr = inject(ChangeDetectorRef); + protected platform = inject(PlatformUtil); + @Input() public get column(): ColumnType { return this._column; @@ -198,13 +188,6 @@ export class IgxGridFilteringRowComponent implements AfterViewInit, OnDestroy { private $destroyer = new Subject(); - constructor( - public filteringService: IgxFilteringService, - public ref: ElementRef, - public cdr: ChangeDetectorRef, - protected platform: PlatformUtil, - ) { } - @HostListener('keydown', ['$event']) public onKeydownHandler(evt: KeyboardEvent) { if (this.platform.isFilteringKeyCombo(evt)) { diff --git a/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-clear-filters.component.ts b/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-clear-filters.component.ts index 65449e4ad25..9f0373e87c4 100644 --- a/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-clear-filters.component.ts +++ b/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-clear-filters.component.ts @@ -1,4 +1,4 @@ -import { Component } from '@angular/core'; +import { Component, inject } from '@angular/core'; import { PlatformUtil } from '../../../core/utils'; import { BaseFilteringComponent } from './base-filtering.component'; import { IgxIconComponent } from '../../../icon/icon.component'; @@ -13,10 +13,9 @@ import { NgClass } from '@angular/common'; imports: [NgClass, IgxIconComponent] }) export class IgxExcelStyleClearFiltersComponent { - constructor( - public esf: BaseFilteringComponent, - protected platform: PlatformUtil, - ) { } + esf = inject(BaseFilteringComponent); + protected platform = inject(PlatformUtil); + /** * @hidden @internal diff --git a/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-conditional-filter.component.ts b/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-conditional-filter.component.ts index fa35a644bd1..c3ac0568c35 100644 --- a/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-conditional-filter.component.ts +++ b/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-conditional-filter.component.ts @@ -1,4 +1,4 @@ -import { Component, OnDestroy, ViewChild } from '@angular/core'; +import { Component, OnDestroy, ViewChild, inject } from '@angular/core'; import { Subject } from 'rxjs'; import { takeUntil } from 'rxjs/operators'; import { GridColumnDataType } from '../../../data-operations/data-util'; @@ -27,6 +27,9 @@ import { ISelectionEventArgs } from '../../../drop-down/drop-down.common'; imports: [NgClass, IgxDropDownItemNavigationDirective, IgxIconComponent, IgxDropDownComponent, IgxDropDownItemComponent, IgxExcelStyleCustomDialogComponent] }) export class IgxExcelStyleConditionalFilterComponent implements OnDestroy { + esf = inject(BaseFilteringComponent); + protected platform = inject(PlatformUtil); + /** * @hidden @internal */ @@ -57,10 +60,7 @@ export class IgxExcelStyleConditionalFilterComponent implements OnDestroy { scrollStrategy: new AbsoluteScrollStrategy() }; - constructor( - public esf: BaseFilteringComponent, - protected platform: PlatformUtil, - ) { + constructor() { this.esf.columnChange.pipe(takeUntil(this.destroy$)).subscribe(() => { if (this.esf.grid) { this.shouldOpenSubMenu = true; diff --git a/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-custom-dialog.component.ts b/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-custom-dialog.component.ts index 71382bd1d95..a0486ba7741 100644 --- a/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-custom-dialog.component.ts +++ b/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-custom-dialog.component.ts @@ -1,14 +1,4 @@ -import { - Component, - Input, - ChangeDetectorRef, - ViewChild, - AfterViewInit, - TemplateRef, - ViewChildren, - QueryList, - ElementRef -} from '@angular/core'; +import { Component, Input, ChangeDetectorRef, ViewChild, AfterViewInit, TemplateRef, ViewChildren, QueryList, ElementRef, inject } from '@angular/core'; import { IgxFilteringService } from '../grid-filtering.service'; import { FilteringLogic } from '../../../data-operations/filtering-expression.interface'; import { GridColumnDataType } from '../../../data-operations/data-util'; @@ -44,6 +34,11 @@ import { BaseFilteringComponent } from './base-filtering.component'; imports: [IgxToggleDirective, NgClass, IgxExcelStyleDateExpressionComponent, IgxExcelStyleDefaultExpressionComponent, IgxButtonDirective, IgxIconComponent] }) export class IgxExcelStyleCustomDialogComponent implements AfterViewInit { + protected overlayService = inject(IgxOverlayService); + private cdr = inject(ChangeDetectorRef); + protected platform = inject(PlatformUtil); + esf = inject(BaseFilteringComponent); + @Input() public expressionsList = new Array(); @@ -91,14 +86,6 @@ export class IgxExcelStyleCustomDialogComponent implements AfterViewInit { scrollStrategy: new AbsoluteScrollStrategy() }; - - constructor( - protected overlayService: IgxOverlayService, - private cdr: ChangeDetectorRef, - protected platform: PlatformUtil, - public esf:BaseFilteringComponent - ) { } - public ngAfterViewInit(): void { this._customDialogOverlaySettings.outlet = this.grid.outlet; } diff --git a/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-default-expression.component.ts b/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-default-expression.component.ts index 97b60a9d39e..ea5fbd28dcc 100644 --- a/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-default-expression.component.ts +++ b/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-default-expression.component.ts @@ -1,12 +1,4 @@ -import { - Component, - AfterViewInit, - Input, - Output, - EventEmitter, - ChangeDetectorRef, - ViewChild -} from '@angular/core'; +import { Component, AfterViewInit, Input, Output, EventEmitter, ChangeDetectorRef, ViewChild, inject } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { IgxButtonGroupComponent } from '../../../buttonGroup/buttonGroup.component'; import { GridColumnDataType, DataUtil } from '../../../data-operations/data-util'; @@ -45,6 +37,9 @@ export interface ILogicOperatorChangedArgs extends IBaseEventArgs { imports: [FormsModule, IgxSelectComponent, IgxPrefixDirective, IgxIconComponent, IgxSelectItemComponent, IgxInputGroupComponent, IgxInputDirective, IgxButtonDirective, IgxButtonGroupComponent, IgxOverlayOutletDirective, IgxIconButtonDirective] }) export class IgxExcelStyleDefaultExpressionComponent implements AfterViewInit { + cdr = inject(ChangeDetectorRef); + protected platform = inject(PlatformUtil); + @Input() public column: ColumnType; @@ -108,8 +103,6 @@ export class IgxExcelStyleDefaultExpressionComponent implements AfterViewInit { } } - constructor(public cdr: ChangeDetectorRef, protected platform: PlatformUtil) { } - public get conditions() { return this.column.filters.conditionList(); } diff --git a/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-filtering.component.ts b/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-filtering.component.ts index fc77989a402..d66065a3dd0 100644 --- a/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-filtering.component.ts +++ b/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-filtering.component.ts @@ -1,25 +1,4 @@ -import { - AfterViewInit, - ChangeDetectionStrategy, - ChangeDetectorRef, - Component, - ContentChild, - Directive, - ElementRef, - EventEmitter, - forwardRef, - Host, - HostBinding, - Inject, - Input, - OnDestroy, - Optional, - Output, - TemplateRef, - ViewChild, - ViewRef, - DOCUMENT -} from '@angular/core'; +import { AfterViewInit, ChangeDetectionStrategy, ChangeDetectorRef, Component, ContentChild, Directive, ElementRef, EventEmitter, forwardRef, HostBinding, Input, OnDestroy, Output, TemplateRef, ViewChild, ViewRef, DOCUMENT, inject } from '@angular/core'; import { FilteringExpressionsTree, IFilteringExpressionsTree } from '../../../data-operations/filtering-expressions-tree'; import { PlatformUtil, formatDate, formatCurrency } from '../../../core/utils'; import { GridColumnDataType } from '../../../data-operations/data-util'; @@ -74,6 +53,9 @@ export class IgxExcelStyleFilterOperationsTemplateDirective { } imports: [IgxExcelStyleHeaderComponent, IgxExcelStyleSortingComponent, IgxExcelStyleMovingComponent, IgxExcelStylePinningComponent, IgxExcelStyleHidingComponent, IgxExcelStyleSelectingComponent, IgxExcelStyleClearFiltersComponent, IgxExcelStyleConditionalFilterComponent, IgxExcelStyleSearchComponent, NgClass] }) export class IgxGridExcelStyleFilteringComponent extends BaseFilteringComponent implements AfterViewInit, OnDestroy { + private document = inject(DOCUMENT); + protected gridAPI? = inject(IGX_GRID_BASE, { host: true, optional: true }); + /** * @hidden @internal @@ -292,14 +274,11 @@ export class IgxGridExcelStyleFilteringComponent extends BaseFilteringComponent return this.column?.grid ?? this.gridAPI; } - constructor( - cdr: ChangeDetectorRef, - element: ElementRef, - platform: PlatformUtil, - @Inject(DOCUMENT) - private document: any, - @Host() @Optional() @Inject(IGX_GRID_BASE) protected gridAPI?: GridType, - ) { + constructor() { + const cdr = inject(ChangeDetectorRef); + const element = inject>(ElementRef); + const platform = inject(PlatformUtil); + super(cdr, element, platform); } diff --git a/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-header.component.ts b/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-header.component.ts index 53a0af9f703..92a8caad71f 100644 --- a/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-header.component.ts +++ b/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-header.component.ts @@ -1,4 +1,4 @@ -import { Component, Input, booleanAttribute } from '@angular/core'; +import { Component, Input, booleanAttribute, inject } from '@angular/core'; import { BaseFilteringComponent } from './base-filtering.component'; import { IgxIconComponent } from '../../../icon/icon.component'; import { NgClass } from '@angular/common'; @@ -13,6 +13,8 @@ import { IgxIconButtonDirective } from '../../../directives/button/icon-button.d imports: [NgClass, IgxIconComponent, IgxIconButtonDirective] }) export class IgxExcelStyleHeaderComponent { + esf = inject(BaseFilteringComponent); + /** * Sets whether the column pinning icon should be shown in the header. * Default value is `false`. @@ -48,6 +50,4 @@ export class IgxExcelStyleHeaderComponent { */ @Input({ transform: booleanAttribute }) public showHiding: boolean; - - constructor(public esf: BaseFilteringComponent) { } } diff --git a/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-hiding.component.ts b/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-hiding.component.ts index f529efef6df..ec96df56552 100644 --- a/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-hiding.component.ts +++ b/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-hiding.component.ts @@ -1,4 +1,4 @@ -import { Component } from '@angular/core'; +import { Component, inject } from '@angular/core'; import { BaseFilteringComponent } from './base-filtering.component'; import { IgxIconComponent } from '../../../icon/icon.component'; @@ -11,5 +11,5 @@ import { IgxIconComponent } from '../../../icon/icon.component'; imports: [IgxIconComponent] }) export class IgxExcelStyleHidingComponent { - constructor(public esf: BaseFilteringComponent) { } + esf = inject(BaseFilteringComponent); } diff --git a/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-moving.component.ts b/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-moving.component.ts index 80aa1564310..fdc862974ce 100644 --- a/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-moving.component.ts +++ b/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-moving.component.ts @@ -1,4 +1,4 @@ -import { Component, HostBinding } from '@angular/core'; +import { Component, HostBinding, inject } from '@angular/core'; import { ColumnType } from '../../common/grid.interface'; import { BaseFilteringComponent } from './base-filtering.component'; import { IgxIconComponent } from '../../../icon/icon.component'; @@ -14,14 +14,14 @@ import { IgxButtonGroupComponent } from '../../../buttonGroup/buttonGroup.compon imports: [IgxButtonGroupComponent, IgxButtonDirective, IgxIconComponent] }) export class IgxExcelStyleMovingComponent { + esf = inject(BaseFilteringComponent); + /** * @hidden @internal */ @HostBinding('class.igx-excel-filter__move') public defaultClass = true; - constructor(public esf: BaseFilteringComponent) { } - private get visibleColumns() { return this.esf.grid.visibleColumns.filter(col => !col.columnGroup); } diff --git a/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-pinning.component.ts b/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-pinning.component.ts index 17cce1aefde..99054fd05b8 100644 --- a/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-pinning.component.ts +++ b/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-pinning.component.ts @@ -1,4 +1,4 @@ -import { Component } from '@angular/core'; +import { Component, inject } from '@angular/core'; import { BaseFilteringComponent } from './base-filtering.component'; import { IgxIconComponent } from '../../../icon/icon.component'; import { NgClass } from '@angular/common'; @@ -12,5 +12,5 @@ import { NgClass } from '@angular/common'; imports: [NgClass, IgxIconComponent] }) export class IgxExcelStylePinningComponent { - constructor(public esf: BaseFilteringComponent) { } + esf = inject(BaseFilteringComponent); } diff --git a/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-search.component.ts b/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-search.component.ts index d366da1a43c..1e3710143c3 100644 --- a/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-search.component.ts +++ b/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-search.component.ts @@ -1,14 +1,4 @@ -import { - AfterViewInit, - Component, - ViewChild, - ChangeDetectorRef, - TemplateRef, - Directive, - OnDestroy, - HostBinding, - Input -} from '@angular/core'; +import { AfterViewInit, Component, ViewChild, ChangeDetectorRef, TemplateRef, Directive, OnDestroy, HostBinding, Input, inject } from '@angular/core'; import { IgxInputDirective } from '../../../directives/input/input.directive'; import { IgxForOfDirective } from '../../../directives/for-of/for_of.directive'; import { FilteringExpressionsTree } from '../../../data-operations/filtering-expressions-tree'; @@ -45,11 +35,12 @@ import { Size } from '../../common/enums'; standalone: true }) export class IgxExcelStyleLoadingValuesTemplateDirective { + template = inject>(TemplateRef); + public static ngTemplateContextGuard(_dir: IgxExcelStyleLoadingValuesTemplateDirective, ctx: unknown): ctx is undefined { return true } - constructor(public template: TemplateRef) { } } let NEXT_ID = 0; @@ -62,6 +53,10 @@ let NEXT_ID = 0; imports: [IgxInputGroupComponent, IgxIconComponent, IgxPrefixDirective, FormsModule, IgxInputDirective, IgxSuffixDirective, IgxListComponent, IgxForOfDirective, IgxListItemComponent, IgxCheckboxComponent, IgxDataLoadingTemplateDirective, NgTemplateOutlet, IgxEmptyListTemplateDirective, IgxTreeComponent, IgxTreeNodeComponent, IgxCircularProgressBarComponent, IgxButtonDirective] }) export class IgxExcelStyleSearchComponent implements AfterViewInit, OnDestroy { + cdr = inject(ChangeDetectorRef); + esf = inject(BaseFilteringComponent); + protected platform = inject(PlatformUtil); + private static readonly filterOptimizationThreshold = 2; /** @@ -210,7 +205,9 @@ export class IgxExcelStyleSearchComponent implements AfterViewInit, OnDestroy { private _focusedItem: ActiveElement = null; private destroy$ = new Subject(); - constructor(public cdr: ChangeDetectorRef, public esf: BaseFilteringComponent, protected platform: PlatformUtil) { + constructor() { + const esf = this.esf; + esf.loadingStart.pipe(takeUntil(this.destroy$)).subscribe(() => { this.displayedListData = []; this.isLoading = true; diff --git a/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-selecting.component.ts b/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-selecting.component.ts index d3fd52a5b69..915639d8adb 100644 --- a/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-selecting.component.ts +++ b/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-selecting.component.ts @@ -1,4 +1,4 @@ -import { Component } from '@angular/core'; +import { Component, inject } from '@angular/core'; import { BaseFilteringComponent } from './base-filtering.component'; import { IgxIconComponent } from '../../../icon/icon.component'; import { NgClass } from '@angular/common'; @@ -12,5 +12,5 @@ import { NgClass } from '@angular/common'; imports: [NgClass, IgxIconComponent] }) export class IgxExcelStyleSelectingComponent { - constructor(public esf: BaseFilteringComponent) { } + esf = inject(BaseFilteringComponent); } diff --git a/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-sorting.component.ts b/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-sorting.component.ts index 1d23c7a78c9..fc6781bc922 100644 --- a/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-sorting.component.ts +++ b/projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-sorting.component.ts @@ -1,10 +1,4 @@ -import { - Component, - ViewChild, - OnDestroy, - HostBinding, - ChangeDetectorRef -} from '@angular/core'; +import { Component, ViewChild, OnDestroy, HostBinding, ChangeDetectorRef, inject } from '@angular/core'; import { IgxButtonGroupComponent } from '../../../buttonGroup/buttonGroup.component'; import { takeUntil } from 'rxjs/operators'; import { Subject } from 'rxjs'; @@ -21,6 +15,9 @@ import { IgxButtonDirective } from '../../../directives/button/button.directive' imports: [IgxButtonGroupComponent, IgxButtonDirective, IgxIconComponent] }) export class IgxExcelStyleSortingComponent implements OnDestroy { + esf = inject(BaseFilteringComponent); + private cdr = inject(ChangeDetectorRef); + /** * @hidden @internal */ @@ -35,7 +32,7 @@ export class IgxExcelStyleSortingComponent implements OnDestroy { private destroy$ = new Subject(); - constructor(public esf: BaseFilteringComponent, private cdr: ChangeDetectorRef) { + constructor() { this.esf.sortingChanged.pipe(takeUntil(this.destroy$)).subscribe(() => { this.updateSelectedButtons(this.esf.column.field); }); diff --git a/projects/igniteui-angular/src/lib/grids/filtering/grid-filtering.service.ts b/projects/igniteui-angular/src/lib/grids/filtering/grid-filtering.service.ts index 717e78acbcf..6af4acf5ede 100644 --- a/projects/igniteui-angular/src/lib/grids/filtering/grid-filtering.service.ts +++ b/projects/igniteui-angular/src/lib/grids/filtering/grid-filtering.service.ts @@ -1,7 +1,4 @@ -import { - Injectable, - OnDestroy, -} from '@angular/core'; +import { Injectable, OnDestroy, inject } from '@angular/core'; import { FilteringExpressionsTree, IFilteringExpressionsTree } from '../../data-operations/filtering-expressions-tree'; import { IFilteringExpression, FilteringLogic } from '../../data-operations/filtering-expression.interface'; import { Subject } from 'rxjs'; @@ -27,6 +24,9 @@ import { ExpressionsTreeUtil, isTree } from '../../data-operations/expressions-t */ @Injectable() export class IgxFilteringService implements OnDestroy { + private iconService = inject(IgxIconService); + protected _overlayService = inject(IgxOverlayService); + public isFilterRowVisible = false; public filteredColumn: ColumnType = null; public selectedExpression: IFilteringExpression = null; @@ -53,11 +53,6 @@ export class IgxFilteringService implements OnDestroy { }; protected lastActiveNode; - constructor( - private iconService: IgxIconService, - protected _overlayService: IgxOverlayService, - ) { } - public ngOnDestroy(): void { this.destroy$.next(true); this.destroy$.complete(); diff --git a/projects/igniteui-angular/src/lib/grids/grid-navigation.service.ts b/projects/igniteui-angular/src/lib/grids/grid-navigation.service.ts index 97203e626fa..984871df7a2 100644 --- a/projects/igniteui-angular/src/lib/grids/grid-navigation.service.ts +++ b/projects/igniteui-angular/src/lib/grids/grid-navigation.service.ts @@ -1,4 +1,4 @@ -import { Injectable } from '@angular/core'; +import { Injectable, inject } from '@angular/core'; import { first } from 'rxjs/operators'; import { IgxForOfDirective } from '../directives/for-of/for_of.directive'; import { GridType } from './common/grid.interface'; @@ -33,6 +33,8 @@ export interface IActiveNode { /** @hidden */ @Injectable() export class IgxGridNavigationService { + protected platform = inject(PlatformUtil); + public grid: GridType; public _activeNode: IActiveNode = {} as IActiveNode; public lastActiveNode: IActiveNode = {} as IActiveNode; @@ -46,8 +48,6 @@ export class IgxGridNavigationService { this._activeNode = value; } - constructor(protected platform: PlatformUtil) { } - public handleNavigation(event: KeyboardEvent) { const key = event.key.toLowerCase(); if (NAVIGATION_KEYS.has(key)) { diff --git a/projects/igniteui-angular/src/lib/grids/grid.directives.ts b/projects/igniteui-angular/src/lib/grids/grid.directives.ts index 0a5ffea63cf..3aed365823e 100644 --- a/projects/igniteui-angular/src/lib/grids/grid.directives.ts +++ b/projects/igniteui-angular/src/lib/grids/grid.directives.ts @@ -1,4 +1,4 @@ -import { Directive, ElementRef, Renderer2, NgZone, HostBinding, TemplateRef } from '@angular/core'; +import { Directive, ElementRef, Renderer2, NgZone, HostBinding, TemplateRef, inject } from '@angular/core'; import { IgxDropDirective } from '../directives/drag-drop/drag-drop.directive'; import { IgxColumnMovingDragDirective } from './moving/moving.drag.directive'; import { IgxGroupByAreaDirective } from './grouping/group-by-area.directive'; @@ -19,13 +19,13 @@ import { standalone: true }) export class IgxGroupByRowTemplateDirective { + template = inject>(TemplateRef); + public static ngTemplateContextGuard(_dir: IgxGroupByRowTemplateDirective, ctx: unknown): ctx is IgxGroupByRowTemplateContext { return true } - constructor(public template: TemplateRef) { } - } /** @@ -187,16 +187,21 @@ export class IgxGridEmptyTemplateDirective { standalone: true }) export class IgxGroupAreaDropDirective extends IgxDropDirective { + private groupArea = inject(IgxGroupByAreaDirective); + private elementRef: ElementRef; + @HostBinding('class.igx-drop-area--hover') public hovered = false; - constructor( - private groupArea: IgxGroupByAreaDirective, - private elementRef: ElementRef, - renderer: Renderer2, - zone: NgZone) { + constructor() { + const elementRef = inject>(ElementRef); + const renderer = inject(Renderer2); + const zone = inject(NgZone); + super(elementRef, renderer, zone); + + this.elementRef = elementRef; } public override onDragEnter(event) { diff --git a/projects/igniteui-angular/src/lib/grids/grid.rowEdit.directive.ts b/projects/igniteui-angular/src/lib/grids/grid.rowEdit.directive.ts index f67b109e4b1..20a6a638aed 100644 --- a/projects/igniteui-angular/src/lib/grids/grid.rowEdit.directive.ts +++ b/projects/igniteui-angular/src/lib/grids/grid.rowEdit.directive.ts @@ -1,4 +1,4 @@ -import { Directive, ElementRef, HostListener, Inject } from '@angular/core'; +import { Directive, ElementRef, HostListener, inject } from '@angular/core'; import { GridType, IgxGridEmptyTemplateContext, IgxGridRowEditActionsTemplateContext, IgxGridRowEditTemplateContext, IgxGridRowEditTextTemplateContext, IGX_GRID_BASE } from './common/grid.interface'; /** @hidden @internal */ @@ -57,9 +57,10 @@ export class IgxRowEditActionsDirective { standalone: true }) export class IgxRowEditTabStopDirective { - private currentCellIndex: number; + grid = inject(IGX_GRID_BASE); + element = inject>(ElementRef); - constructor(@Inject(IGX_GRID_BASE) public grid: GridType, public element: ElementRef) {} + private currentCellIndex: number; @HostListener('keydown.Tab', [`$event`]) @HostListener('keydown.Shift.Tab', [`$event`]) diff --git a/projects/igniteui-angular/src/lib/grids/grid/expandable-cell.component.ts b/projects/igniteui-angular/src/lib/grids/grid/expandable-cell.component.ts index 98e933fe227..076095620fd 100644 --- a/projects/igniteui-angular/src/lib/grids/grid/expandable-cell.component.ts +++ b/projects/igniteui-angular/src/lib/grids/grid/expandable-cell.component.ts @@ -1,16 +1,4 @@ -import { - ChangeDetectionStrategy, - ChangeDetectorRef, - Component, - ElementRef, - Inject, - Input, - NgZone, - OnInit, - TemplateRef, - ViewChild, - DOCUMENT -} from '@angular/core'; +import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, Input, NgZone, OnInit, TemplateRef, ViewChild, DOCUMENT, inject } from '@angular/core'; import { IgxGridCellComponent } from '../cell.component'; import { PlatformUtil } from '../../core/utils'; import { NgClass, NgTemplateOutlet, DecimalPipe, PercentPipe, CurrencyPipe, DatePipe } from '@angular/common'; @@ -43,6 +31,8 @@ import { IgxChipComponent } from '../../chips/chip.component'; imports: [IgxChipComponent, IgxTextHighlightDirective, IgxIconComponent, NgClass, FormsModule, ReactiveFormsModule, IgxInputGroupComponent, IgxInputDirective, IgxFocusDirective, IgxCheckboxComponent, IgxDatePickerComponent, IgxTimePickerComponent, IgxDateTimeEditorDirective, IgxPrefixDirective, IgxSuffixDirective, NgTemplateOutlet, IgxTooltipTargetDirective, IgxTooltipDirective, IgxGridCellImageAltPipe, IgxStringReplacePipe, IgxColumnFormatterPipe, DecimalPipe, PercentPipe, CurrencyPipe, DatePipe] }) export class IgxGridExpandableCellComponent extends IgxGridCellComponent implements OnInit { + document = inject(DOCUMENT); + /** * @hidden */ @@ -67,15 +57,16 @@ export class IgxGridExpandableCellComponent extends IgxGridCellComponent impleme @ViewChild('defaultCollapsedTemplate', { read: TemplateRef, static: true }) protected defaultCollapsedTemplate: TemplateRef; - constructor(selectionService: IgxGridSelectionService, - @Inject(IGX_GRID_BASE) grid: GridType, - @Inject(IgxOverlayService) overlayService: IgxOverlayService, - cdr: ChangeDetectorRef, - element: ElementRef, - zone: NgZone, - touchManager: HammerGesturesManager, - @Inject(DOCUMENT) public document, - platformUtil: PlatformUtil) { + constructor() { + const selectionService = inject(IgxGridSelectionService); + const grid = inject(IGX_GRID_BASE); + const overlayService = inject(IgxOverlayService); + const cdr = inject(ChangeDetectorRef); + const element = inject(ElementRef); + const zone = inject(NgZone); + const touchManager = inject(HammerGesturesManager); + const platformUtil = inject(PlatformUtil); + super(selectionService, grid, overlayService, cdr, element, zone, touchManager, platformUtil); } diff --git a/projects/igniteui-angular/src/lib/grids/grid/grid.component.spec.ts b/projects/igniteui-angular/src/lib/grids/grid/grid.component.spec.ts index 1e62728eb04..097924fa385 100644 --- a/projects/igniteui-angular/src/lib/grids/grid/grid.component.spec.ts +++ b/projects/igniteui-angular/src/lib/grids/grid/grid.component.spec.ts @@ -1,7 +1,4 @@ -import { - AfterViewInit, ChangeDetectorRef, Component, Injectable, - OnInit, ViewChild, TemplateRef -} from '@angular/core'; +import { AfterViewInit, ChangeDetectorRef, Component, Injectable, OnInit, ViewChild, TemplateRef, inject } from '@angular/core'; import { TestBed, fakeAsync, tick, flush, waitForAsync } from '@angular/core/testing'; import { BehaviorSubject, Observable } from 'rxjs'; import { By } from '@angular/platform-browser'; @@ -3205,6 +3202,8 @@ describe('IgxGrid Component Tests #grid', () => { imports: [IgxGridComponent, IgxColumnComponent] }) export class IgxGridTestComponent { + cdr = inject(ChangeDetectorRef); + @ViewChild('grid', { static: true }) public grid: IgxGridComponent; public data: any[] = [{ index: 1, value: 1 }]; public columns = [ @@ -3218,8 +3217,6 @@ export class IgxGridTestComponent { public columnEventCount = 0; - constructor(public cdr: ChangeDetectorRef) { } - public columnCreated(column: IgxColumnComponent) { this.columnEventCount++; column.filterable = true; @@ -3595,10 +3592,12 @@ export class LocalService { imports: [IgxGridComponent, IgxColumnComponent, AsyncPipe] }) export class IgxGridRemoteVirtualizationComponent implements OnInit, AfterViewInit { + private localService = inject(LocalService); + cdr = inject(ChangeDetectorRef); + @ViewChild(IgxGridComponent, { read: IgxGridComponent, static: true }) public instance: IgxGridComponent; public data; - constructor(private localService: LocalService, public cdr: ChangeDetectorRef) { } public ngOnInit(): void { this.data = this.localService.records; } @@ -3638,13 +3637,15 @@ export class IgxGridRemoteVirtualizationComponent implements OnInit, AfterViewIn imports: [IgxGridComponent, IgxGridEmptyTemplateDirective, IgxGridLoadingTemplateDirective, AsyncPipe] }) export class IgxGridRemoteOnDemandComponent { + private localService = inject(LocalService); + cdr = inject(ChangeDetectorRef); + @ViewChild(IgxGridComponent, { read: IgxGridComponent, static: true }) public instance: IgxGridComponent; @ViewChild('customTemplate', { read: TemplateRef, static: true }) public customTemplate: TemplateRef; public data; public customLoading = false; - constructor(private localService: LocalService, public cdr: ChangeDetectorRef) { } public bind() { this.data = this.localService.records; diff --git a/projects/igniteui-angular/src/lib/grids/grid/grid.details.pipe.ts b/projects/igniteui-angular/src/lib/grids/grid/grid.details.pipe.ts index 4bd21fc33ec..7bf216c62a7 100644 --- a/projects/igniteui-angular/src/lib/grids/grid/grid.details.pipe.ts +++ b/projects/igniteui-angular/src/lib/grids/grid/grid.details.pipe.ts @@ -1,4 +1,4 @@ -import { PipeTransform, Pipe, Inject } from '@angular/core'; +import { PipeTransform, Pipe, inject } from '@angular/core'; import { GridType, IGX_GRID_BASE } from '../common/grid.interface'; /** @hidden */ @@ -7,8 +7,8 @@ import { GridType, IGX_GRID_BASE } from '../common/grid.interface'; standalone: true }) export class IgxGridDetailsPipe implements PipeTransform { + private grid = inject(IGX_GRID_BASE); - constructor(@Inject(IGX_GRID_BASE) private grid: GridType) { } public transform(collection: any[], hasDetails: boolean, expansionStates: Map, _pipeTrigger: number) { if (!hasDetails) { diff --git a/projects/igniteui-angular/src/lib/grids/grid/grid.pipes.ts b/projects/igniteui-angular/src/lib/grids/grid/grid.pipes.ts index 4f5a4238eb4..744284c4aa9 100644 --- a/projects/igniteui-angular/src/lib/grids/grid/grid.pipes.ts +++ b/projects/igniteui-angular/src/lib/grids/grid/grid.pipes.ts @@ -1,4 +1,4 @@ -import { Inject, Pipe, PipeTransform } from '@angular/core'; +import { Pipe, PipeTransform, inject } from '@angular/core'; import { cloneArray } from '../../core/utils'; import { DataUtil } from '../../data-operations/data-util'; import { IGroupByExpandState } from '../../data-operations/groupby-expand-state.interface'; @@ -18,8 +18,8 @@ import { IGridSortingStrategy, IGridGroupingStrategy } from '../common/strategy' standalone: true }) export class IgxGridSortingPipe implements PipeTransform { + private grid = inject(IGX_GRID_BASE); - constructor(@Inject(IGX_GRID_BASE) private grid: GridType) { } public transform(collection: any[], sortExpressions: ISortingExpression[], groupExpressions: IGroupingExpression[], sorting: IGridSortingStrategy, id: string, pipeTrigger: number, pinned?): any[] { @@ -44,8 +44,8 @@ export class IgxGridSortingPipe implements PipeTransform { standalone: true }) export class IgxGridGroupingPipe implements PipeTransform { + private grid = inject(IGX_GRID_BASE); - constructor(@Inject(IGX_GRID_BASE) private grid: GridType) { } public transform(collection: any[], expression: IGroupingExpression | IGroupingExpression[], expansion: IGroupByExpandState | IGroupByExpandState[], @@ -84,8 +84,8 @@ export class IgxGridGroupingPipe implements PipeTransform { standalone: true }) export class IgxGridPagingPipe implements PipeTransform { + private grid = inject(IGX_GRID_BASE); - constructor(@Inject(IGX_GRID_BASE) private grid: GridType) { } public transform(collection: IGroupByResult, enabled: boolean, page = 0, perPage = 15, _: number): IGroupByResult { if (!enabled || this.grid.pagingMode !== 'local') { @@ -118,8 +118,8 @@ export class IgxGridPagingPipe implements PipeTransform { standalone: true }) export class IgxGridFilteringPipe implements PipeTransform { + private grid = inject(IGX_GRID_BASE); - constructor(@Inject(IGX_GRID_BASE) private grid: GridType) { } public transform(collection: any[], expressionsTree: IFilteringExpressionsTree, filterStrategy: IFilteringStrategy, diff --git a/projects/igniteui-angular/src/lib/grids/grid/grid.summary.pipe.ts b/projects/igniteui-angular/src/lib/grids/grid/grid.summary.pipe.ts index edb74f3652c..96ddf49bfbc 100644 --- a/projects/igniteui-angular/src/lib/grids/grid/grid.summary.pipe.ts +++ b/projects/igniteui-angular/src/lib/grids/grid/grid.summary.pipe.ts @@ -1,4 +1,4 @@ -import { Inject, Pipe, PipeTransform } from '@angular/core'; +import { Pipe, PipeTransform, inject } from '@angular/core'; import { ISummaryRecord } from '../summaries/grid-summary'; import { IGroupByRecord } from '../../data-operations/groupby-record.interface'; import { IGroupByResult } from '../../data-operations/grouping-result.interface'; @@ -14,8 +14,8 @@ interface ISkipRecord { skip?: boolean } standalone: true }) export class IgxGridSummaryPipe implements PipeTransform { + private grid = inject(IGX_GRID_BASE); - constructor(@Inject(IGX_GRID_BASE) private grid: GridType) { } public transform(collection: IGroupByResult, hasSummary: boolean, diff --git a/projects/igniteui-angular/src/lib/grids/grid/groupby-row.component.ts b/projects/igniteui-angular/src/lib/grids/grid/groupby-row.component.ts index 4928dda109a..0b84c318bf6 100644 --- a/projects/igniteui-angular/src/lib/grids/grid/groupby-row.component.ts +++ b/projects/igniteui-angular/src/lib/grids/grid/groupby-row.component.ts @@ -1,16 +1,4 @@ -import { - ChangeDetectionStrategy, - ChangeDetectorRef, - Component, - ElementRef, - HostBinding, - HostListener, - Input, - ViewChild, - TemplateRef, - OnDestroy, - Inject -} from '@angular/core'; +import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, HostBinding, HostListener, Input, ViewChild, TemplateRef, OnDestroy, inject } from '@angular/core'; import { NgTemplateOutlet, DecimalPipe, DatePipe, getLocaleCurrencyCode, PercentPipe, CurrencyPipe } from '@angular/common'; import { takeUntil } from 'rxjs/operators'; @@ -46,6 +34,12 @@ import { IgxColumnFormatterPipe } from '../common/pipes'; ] }) export class IgxGridGroupByRowComponent implements OnDestroy { + grid = inject(IGX_GRID_BASE); + gridSelection = inject(IgxGridSelectionService); + element = inject(ElementRef); + cdr = inject(ChangeDetectorRef); + filteringService = inject(IgxFilteringService); + /** * @hidden */ @@ -143,12 +137,7 @@ export class IgxGridGroupByRowComponent implements OnDestroy { this.groupRow.column.pipeArgs.currencyCode : getLocaleCurrencyCode(this.grid.locale); } - constructor( - @Inject(IGX_GRID_BASE) public grid: GridType, - public gridSelection: IgxGridSelectionService, - public element: ElementRef, - public cdr: ChangeDetectorRef, - public filteringService: IgxFilteringService) { + constructor() { this.gridSelection.selectedRowsChange.pipe(takeUntil(this.destroy$)).subscribe(() => { this.cdr.markForCheck(); }); diff --git a/projects/igniteui-angular/src/lib/grids/grouping/grid-group-by-area.component.ts b/projects/igniteui-angular/src/lib/grids/grouping/grid-group-by-area.component.ts index 4e7b8bf3b1d..4f50996dab2 100644 --- a/projects/igniteui-angular/src/lib/grids/grouping/grid-group-by-area.component.ts +++ b/projects/igniteui-angular/src/lib/grids/grouping/grid-group-by-area.component.ts @@ -1,8 +1,4 @@ -import { - Component, - ElementRef, - Input, -} from '@angular/core'; +import { Component, ElementRef, Input, inject } from '@angular/core'; import { IChipsAreaReorderEventArgs } from '../../chips/public_api'; import { PlatformUtil } from '../../core/utils'; import { IGroupingExpression } from '../../data-operations/grouping-expression.interface'; @@ -36,7 +32,10 @@ export class IgxGridGroupByAreaComponent extends IgxGroupByAreaDirective { @Input() public override grid: FlatGridType; - constructor(ref: ElementRef, platform: PlatformUtil) { + constructor() { + const ref = inject>(ElementRef); + const platform = inject(PlatformUtil); + super(ref, platform); } diff --git a/projects/igniteui-angular/src/lib/grids/grouping/tree-grid-group-by-area.component.ts b/projects/igniteui-angular/src/lib/grids/grouping/tree-grid-group-by-area.component.ts index 59e71b93442..d7a309a632d 100644 --- a/projects/igniteui-angular/src/lib/grids/grouping/tree-grid-group-by-area.component.ts +++ b/projects/igniteui-angular/src/lib/grids/grouping/tree-grid-group-by-area.component.ts @@ -1,13 +1,4 @@ -import { - AfterContentInit, - Component, - ElementRef, - Input, - IterableDiffer, - IterableDiffers, - OnDestroy, - booleanAttribute, -} from '@angular/core'; +import { AfterContentInit, Component, ElementRef, Input, IterableDiffer, IterableDiffers, OnDestroy, booleanAttribute, inject } from '@angular/core'; import { Subject } from 'rxjs'; import { takeUntil } from 'rxjs/operators'; import { IChipsAreaReorderEventArgs } from '../../chips/public_api'; @@ -35,6 +26,8 @@ import { IgxChipsAreaComponent } from '../../chips/chips-area.component'; imports: [IgxChipsAreaComponent, IgxChipComponent, IgxIconComponent, IgxSuffixDirective, IgxGroupAreaDropDirective, IgxDropDirective, NgTemplateOutlet, IgxGroupByMetaPipe] }) export class IgxTreeGridGroupByAreaComponent extends IgxGroupByAreaDirective implements AfterContentInit, OnDestroy { + private differs = inject(IterableDiffers); + @Input({ transform: booleanAttribute }) public get hideGroupedColumns() { return this._hideGroupedColumns; @@ -52,7 +45,10 @@ export class IgxTreeGridGroupByAreaComponent extends IgxGroupByAreaDirective imp private groupingDiffer: IterableDiffer; private destroy$ = new Subject(); - constructor(private differs: IterableDiffers, ref: ElementRef, platform: PlatformUtil) { + constructor() { + const ref = inject>(ElementRef); + const platform = inject(PlatformUtil); + super(ref, platform); } diff --git a/projects/igniteui-angular/src/lib/grids/headers/grid-header-group.component.ts b/projects/igniteui-angular/src/lib/grids/headers/grid-header-group.component.ts index 6607a21ff74..348f93f593e 100644 --- a/projects/igniteui-angular/src/lib/grids/headers/grid-header-group.component.ts +++ b/projects/igniteui-angular/src/lib/grids/headers/grid-header-group.component.ts @@ -1,18 +1,4 @@ -import { - ChangeDetectionStrategy, - ChangeDetectorRef, - Component, - DoCheck, - ElementRef, - forwardRef, - HostBinding, - HostListener, - Inject, - Input, - QueryList, - ViewChild, - ViewChildren -} from '@angular/core'; +import { ChangeDetectionStrategy, ChangeDetectorRef, Component, DoCheck, ElementRef, forwardRef, HostBinding, HostListener, Input, QueryList, ViewChild, ViewChildren, inject } from '@angular/core'; import { IgxFilteringService } from '../filtering/grid-filtering.service'; import { IgxColumnResizingService } from '../resizing/resizing.service'; import { IgxGridHeaderComponent } from './grid-header.component'; @@ -39,6 +25,13 @@ const Z_INDEX = 9999; imports: [NgClass, NgStyle, IgxColumnMovingDragDirective, IgxColumnMovingDropDirective, IgxIconComponent, NgTemplateOutlet, IgxGridHeaderComponent, IgxGridFilteringCellComponent, IgxResizeHandleDirective, IgxHeaderGroupWidthPipe, IgxHeaderGroupStylePipe] }) export class IgxGridHeaderGroupComponent implements DoCheck { + private cdr = inject(ChangeDetectorRef); + grid = inject(IGX_GRID_BASE); + private ref = inject>(ElementRef); + colResizingService = inject(IgxColumnResizingService); + filteringService = inject(IgxFilteringService); + protected platform = inject(PlatformUtil); + @HostBinding('style.grid-row-end') public get rowEnd(): number { @@ -115,13 +108,6 @@ export class IgxGridHeaderGroupComponent implements DoCheck { @HostBinding('class.igx-grid-thead__item') public defaultCss = true; - constructor(private cdr: ChangeDetectorRef, - @Inject(IGX_GRID_BASE) public grid: GridType, - private ref: ElementRef, - public colResizingService: IgxColumnResizingService, - public filteringService: IgxFilteringService, - protected platform: PlatformUtil) { } - @HostBinding('class.igx-grid-th--pinned') public get pinnedCss() { return this.isPinned; diff --git a/projects/igniteui-angular/src/lib/grids/headers/grid-header-row.component.ts b/projects/igniteui-angular/src/lib/grids/headers/grid-header-row.component.ts index 4e664f1f249..a11ed3d50a2 100644 --- a/projects/igniteui-angular/src/lib/grids/headers/grid-header-row.component.ts +++ b/projects/igniteui-angular/src/lib/grids/headers/grid-header-row.component.ts @@ -1,16 +1,4 @@ -import { - ChangeDetectionStrategy, - ChangeDetectorRef, - Component, - DoCheck, - ElementRef, - Input, - QueryList, - TemplateRef, - ViewChild, - ViewChildren, - booleanAttribute -} from '@angular/core'; +import { ChangeDetectionStrategy, ChangeDetectorRef, Component, DoCheck, ElementRef, Input, QueryList, TemplateRef, ViewChild, ViewChildren, booleanAttribute, inject } from '@angular/core'; import { flatten, trackByIdentity } from '../../core/utils'; import { IgxGridForOfDirective } from '../../directives/for-of/for_of.directive'; import { ColumnType, GridType, IgxHeadSelectorTemplateContext } from '../common/grid.interface'; @@ -39,6 +27,9 @@ import { NgTemplateOutlet, NgClass, NgStyle } from '@angular/common'; imports: [IgxColumnMovingDropDirective, NgTemplateOutlet, NgClass, IgxGridHeaderGroupComponent, NgStyle, IgxGridForOfDirective, IgxGridFilteringRowComponent, IgxCheckboxComponent, IgxGridTopLevelColumns, IgxHeaderGroupWidthPipe, IgxHeaderGroupStylePipe] }) export class IgxGridHeaderRowComponent implements DoCheck { + protected ref = inject>(ElementRef); + protected cdr = inject(ChangeDetectorRef); + /** The grid component containing this element. */ @Input() @@ -163,11 +154,6 @@ export class IgxGridHeaderRowComponent implements DoCheck { return ctx; } - constructor( - protected ref: ElementRef, - protected cdr: ChangeDetectorRef - ) { } - /** * This hook exists as a workaround for the unfortunate fact * that when we have pinned columns in the grid, the unpinned columns headers diff --git a/projects/igniteui-angular/src/lib/grids/headers/grid-header.component.ts b/projects/igniteui-angular/src/lib/grids/headers/grid-header.component.ts index c691ba3c8d3..4809f835e05 100644 --- a/projects/igniteui-angular/src/lib/grids/headers/grid-header.component.ts +++ b/projects/igniteui-angular/src/lib/grids/headers/grid-header.component.ts @@ -1,17 +1,4 @@ -import { - ChangeDetectionStrategy, - ChangeDetectorRef, - Component, - DoCheck, - ElementRef, - HostBinding, - HostListener, - Inject, - Input, - OnDestroy, - TemplateRef, - ViewChild -} from '@angular/core'; +import { ChangeDetectionStrategy, ChangeDetectorRef, Component, DoCheck, ElementRef, HostBinding, HostListener, Input, OnDestroy, TemplateRef, ViewChild, inject } from '@angular/core'; import { GridColumnDataType } from '../../data-operations/data-util'; import { IgxColumnResizingService } from '../resizing/resizing.service'; import { Subject } from 'rxjs'; @@ -33,6 +20,11 @@ import { ExpressionsTreeUtil } from '../../data-operations/expressions-tree-util imports: [IgxIconComponent, NgTemplateOutlet, NgClass, SortingIndexPipe] }) export class IgxGridHeaderComponent implements DoCheck, OnDestroy { + grid = inject(IGX_GRID_BASE); + colResizingService = inject(IgxColumnResizingService); + cdr = inject(ChangeDetectorRef); + private ref = inject>(ElementRef); + @Input() public column: ColumnType; @@ -171,13 +163,6 @@ export class IgxGridHeaderComponent implements DoCheck, OnDestroy { public sortDirection = SortingDirection.None; protected _destroy$ = new Subject(); - constructor( - @Inject(IGX_GRID_BASE) public grid: GridType, - public colResizingService: IgxColumnResizingService, - public cdr: ChangeDetectorRef, - private ref: ElementRef - ) { } - @HostListener('click', ['$event']) public onClick(event: MouseEvent) { if (!this.colResizingService.isColumnResizing) { diff --git a/projects/igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-cell.component.ts b/projects/igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-cell.component.ts index 1ce7118cd4a..dd4454e11a6 100644 --- a/projects/igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-cell.component.ts +++ b/projects/igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-cell.component.ts @@ -1,5 +1,5 @@ import { IgxGridCellComponent } from '../cell.component'; -import { ChangeDetectorRef, ElementRef, ChangeDetectionStrategy, Component, OnInit, NgZone, Inject } from '@angular/core'; +import { ChangeDetectorRef, ElementRef, ChangeDetectionStrategy, Component, OnInit, NgZone, inject } from '@angular/core'; import { IgxGridSelectionService } from '../selection/selection.service'; import { HammerGesturesManager } from '../../core/touch'; import { PlatformUtil } from '../../core/utils'; @@ -35,16 +35,16 @@ export class IgxHierarchicalGridCellComponent extends IgxGridCellComponent imple // protected hSelection; protected _rootGrid; - constructor( - selectionService: IgxGridSelectionService, - @Inject(IGX_GRID_BASE) grid: GridType, - @Inject(IgxOverlayService) overlayService: IgxOverlayService, - cdr: ChangeDetectorRef, - helement: ElementRef, - zone: NgZone, - touchManager: HammerGesturesManager, - platformUtil: PlatformUtil - ) { + constructor() { + const selectionService = inject(IgxGridSelectionService); + const grid = inject(IGX_GRID_BASE); + const overlayService = inject(IgxOverlayService); + const cdr = inject(ChangeDetectorRef); + const helement = inject>(ElementRef); + const zone = inject(NgZone); + const touchManager = inject(HammerGesturesManager); + const platformUtil = inject(PlatformUtil); + super(selectionService, grid, overlayService, cdr, helement, zone, touchManager, platformUtil); } diff --git a/projects/igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid.component.ts b/projects/igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid.component.ts index 2ce0f166cb2..ed9bb1a0b2a 100644 --- a/projects/igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid.component.ts +++ b/projects/igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid.component.ts @@ -1,27 +1,4 @@ -import { - AfterContentInit, - AfterViewInit, - booleanAttribute, - ChangeDetectionStrategy, - ChangeDetectorRef, - Component, - ContentChildren, - CUSTOM_ELEMENTS_SCHEMA, - DoCheck, - ElementRef, - HostBinding, - Inject, - Input, - OnDestroy, - OnInit, - QueryList, - reflectComponentType, - SimpleChanges, - TemplateRef, - ViewChild, - ViewChildren, - ViewContainerRef -} from '@angular/core'; +import { AfterContentInit, AfterViewInit, booleanAttribute, ChangeDetectionStrategy, ChangeDetectorRef, Component, ContentChildren, CUSTOM_ELEMENTS_SCHEMA, DoCheck, ElementRef, HostBinding, Input, OnDestroy, OnInit, QueryList, reflectComponentType, SimpleChanges, TemplateRef, ViewChild, ViewChildren, ViewContainerRef, inject } from '@angular/core'; import { NgClass, NgTemplateOutlet, NgStyle } from '@angular/common'; import { IgxHierarchicalGridAPIService } from './hierarchical-grid-api.service'; @@ -81,6 +58,10 @@ let NEXT_ID = 0; imports: [NgClass] }) export class IgxChildGridRowComponent implements AfterViewInit, OnInit { + readonly gridAPI = inject(IGX_GRID_SERVICE_BASE); + element = inject>(ElementRef); + cdr = inject(ChangeDetectorRef); + @Input() public layout: IgxRowIslandComponent; @@ -188,11 +169,6 @@ export class IgxChildGridRowComponent implements AfterViewInit, OnInit { private _data: any; - constructor( - @Inject(IGX_GRID_SERVICE_BASE) public readonly gridAPI: IgxHierarchicalGridAPIService, - public element: ElementRef, - public cdr: ChangeDetectorRef) { } - /** * @hidden */ diff --git a/projects/igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid.pipes.ts b/projects/igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid.pipes.ts index abb4ec53f4b..2fdf2d77ea4 100644 --- a/projects/igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid.pipes.ts +++ b/projects/igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid.pipes.ts @@ -1,4 +1,4 @@ -import { Inject, Pipe, PipeTransform } from '@angular/core'; +import { Pipe, PipeTransform, inject } from '@angular/core'; import { cloneArray, columnFieldPath, resolveNestedPath } from '../../core/utils'; import { DataUtil } from '../../data-operations/data-util'; import { GridType, IGX_GRID_BASE } from '../common/grid.interface'; @@ -11,8 +11,8 @@ import { GridType, IGX_GRID_BASE } from '../common/grid.interface'; standalone: true }) export class IgxGridHierarchicalPipe implements PipeTransform { + private grid = inject(IGX_GRID_BASE); - constructor(@Inject(IGX_GRID_BASE) private grid: GridType) { } public transform( collection: any, @@ -63,8 +63,8 @@ export class IgxGridHierarchicalPipe implements PipeTransform { standalone: true }) export class IgxGridHierarchicalPagingPipe implements PipeTransform { + private grid = inject(IGX_GRID_BASE); - constructor(@Inject(IGX_GRID_BASE) private grid: GridType) { } public transform(collection: any[], enabled: boolean, page = 0, perPage = 15, _id: string, _pipeTrigger: number): any[] { if (!enabled || this.grid.pagingMode !== 'local') { diff --git a/projects/igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid.spec.ts b/projects/igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid.spec.ts index f0dd4cc9d53..6c530d64fb3 100644 --- a/projects/igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid.spec.ts +++ b/projects/igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid.spec.ts @@ -1,7 +1,7 @@ import { TestBed, fakeAsync, tick, ComponentFixture, waitForAsync } from '@angular/core/testing'; import { NoopAnimationsModule } from '@angular/platform-browser/animations'; import { IGridCreatedEventArgs } from './public_api'; -import { ChangeDetectorRef, Component, ViewChild, AfterViewInit, QueryList } from '@angular/core'; +import { ChangeDetectorRef, Component, ViewChild, AfterViewInit, QueryList, inject } from '@angular/core'; import { IgxChildGridRowComponent, IgxHierarchicalGridComponent } from './hierarchical-grid.component'; import { wait, UIInteractions } from '../../test-utils/ui-interactions.spec'; import { IgxRowIslandComponent } from './row-island.component'; @@ -2051,6 +2051,8 @@ export class IgxHierarchicalGridMultiLayoutComponent extends IgxHierarchicalGrid imports: [IgxHierarchicalGridComponent, IgxColumnComponent, IgxRowIslandComponent] }) export class IgxHGridRemoteOnDemandComponent { + cdr = inject(ChangeDetectorRef); + @ViewChild(IgxHierarchicalGridComponent, { read: IgxHierarchicalGridComponent, static: true }) public instance: IgxHierarchicalGridComponent; @@ -2062,8 +2064,6 @@ export class IgxHGridRemoteOnDemandComponent { public data; - constructor(public cdr: ChangeDetectorRef) { } - public generateDataUneven(count: number, level: number, parendID: string = null) { const prods = []; const currLevel = level; @@ -2118,14 +2118,13 @@ export class IgxHGridRemoteOnDemandComponent { imports: [IgxHierarchicalGridComponent, IgxColumnComponent, IgxRowIslandComponent] }) export class IgxHierarchicalGridColumnsUpdateComponent extends IgxHierarchicalGridTestBaseComponent implements AfterViewInit { + cdr = inject(ChangeDetectorRef); + public cols1 = ['ID', 'ProductName', 'Col1', 'Col2', 'Col3']; public cols2 = ['ID', 'ProductName', 'Col1']; public parentCols = []; public islandCols1 = []; public islandCols2 = []; - constructor(public cdr: ChangeDetectorRef) { - super(); - } public ngAfterViewInit() { this.islandCols1 = this.cols1; @@ -2328,9 +2327,8 @@ export class IgxHierarchicalGridCustomFilteringTemplateComponent extends IgxHier imports: [IgxHierarchicalGridComponent, IgxColumnComponent, IgxRowIslandComponent, IgxIconComponent, IgxCellHeaderTemplateDirective] }) export class IgxHierarchicalGridHidingPinningColumnsComponent extends IgxHierarchicalGridTestBaseComponent { - constructor(public cdr: ChangeDetectorRef) { - super(); - } + cdr = inject(ChangeDetectorRef); + public pinColumn(col: ColumnType) { col.pin(); diff --git a/projects/igniteui-angular/src/lib/grids/hierarchical-grid/row-island.component.ts b/projects/igniteui-angular/src/lib/grids/hierarchical-grid/row-island.component.ts index e0ec1491026..2d84311fb1b 100644 --- a/projects/igniteui-angular/src/lib/grids/hierarchical-grid/row-island.component.ts +++ b/projects/igniteui-angular/src/lib/grids/hierarchical-grid/row-island.component.ts @@ -1,32 +1,4 @@ -import { - AfterContentInit, - AfterViewInit, - booleanAttribute, - ChangeDetectionStrategy, - ChangeDetectorRef, - Component, - ContentChild, - ContentChildren, - ElementRef, - EnvironmentInjector, - EventEmitter, - forwardRef, - Inject, - Injector, - Input, - IterableChangeRecord, - IterableDiffers, - LOCALE_ID, - NgZone, - OnChanges, - OnDestroy, - OnInit, - Output, - QueryList, - TemplateRef, - ViewContainerRef, - DOCUMENT -} from '@angular/core'; +import { AfterContentInit, AfterViewInit, booleanAttribute, ChangeDetectionStrategy, ChangeDetectorRef, Component, ContentChild, ContentChildren, ElementRef, EnvironmentInjector, EventEmitter, forwardRef, Injector, Input, IterableChangeRecord, IterableDiffers, LOCALE_ID, NgZone, OnChanges, OnDestroy, OnInit, Output, QueryList, TemplateRef, ViewContainerRef, DOCUMENT, inject } from '@angular/core'; import { IgxHierarchicalGridAPIService } from './hierarchical-grid-api.service'; import { IgxFilteringService } from '../filtering/grid-filtering.service'; import { IgxGridSummaryService } from '../summaries/grid-summary.service'; @@ -84,6 +56,8 @@ import { IgxPaginatorComponent } from '../../paginator/paginator.component'; }) export class IgxRowIslandComponent extends IgxHierarchicalGridBaseDirective implements AfterContentInit, AfterViewInit, OnChanges, OnInit, OnDestroy { + rowIslandAPI = inject(IgxRowIslandAPIService); + /* blazorSuppress */ /** @@ -372,28 +346,28 @@ export class IgxRowIslandComponent extends IgxHierarchicalGridBaseDirective return lvl + 1; } - constructor( - validationService: IgxGridValidationService, - selectionService: IgxGridSelectionService, - colResizingService: IgxColumnResizingService, - @Inject(IGX_GRID_SERVICE_BASE) gridAPI: IgxHierarchicalGridAPIService, - transactionFactory: IgxFlatTransactionFactory, - elementRef: ElementRef, - zone: NgZone, - @Inject(DOCUMENT) document, - cdr: ChangeDetectorRef, - differs: IterableDiffers, - viewRef: ViewContainerRef, - injector: Injector, - envInjector: EnvironmentInjector, - navigation: IgxHierarchicalGridNavigationService, - filteringService: IgxFilteringService, - textHighlightService: IgxTextHighlightService, - @Inject(IgxOverlayService) overlayService: IgxOverlayService, - summaryService: IgxGridSummaryService, - public rowIslandAPI: IgxRowIslandAPIService, - @Inject(LOCALE_ID) localeId: string, - platform: PlatformUtil) { + constructor() { + const validationService = inject(IgxGridValidationService); + const selectionService = inject(IgxGridSelectionService); + const colResizingService = inject(IgxColumnResizingService); + const gridAPI = inject(IGX_GRID_SERVICE_BASE); + const transactionFactory = inject(IgxFlatTransactionFactory); + const elementRef = inject>(ElementRef); + const zone = inject(NgZone); + const document = inject(DOCUMENT); + const cdr = inject(ChangeDetectorRef); + const differs = inject(IterableDiffers); + const viewRef = inject(ViewContainerRef); + const injector = inject(Injector); + const envInjector = inject(EnvironmentInjector); + const navigation = inject(IgxHierarchicalGridNavigationService); + const filteringService = inject(IgxFilteringService); + const textHighlightService = inject(IgxTextHighlightService); + const overlayService = inject(IgxOverlayService); + const summaryService = inject(IgxGridSummaryService); + const localeId = inject(LOCALE_ID); + const platform = inject(PlatformUtil); + super( validationService, selectionService, diff --git a/projects/igniteui-angular/src/lib/grids/moving/moving.drag.directive.ts b/projects/igniteui-angular/src/lib/grids/moving/moving.drag.directive.ts index 8e29373ea60..6a5587b05bb 100644 --- a/projects/igniteui-angular/src/lib/grids/moving/moving.drag.directive.ts +++ b/projects/igniteui-angular/src/lib/grids/moving/moving.drag.directive.ts @@ -1,4 +1,4 @@ -import { Directive, OnDestroy, Input, ElementRef, ViewContainerRef, NgZone, ChangeDetectorRef, Renderer2 } from '@angular/core'; +import { Directive, OnDestroy, Input, ElementRef, ViewContainerRef, NgZone, ChangeDetectorRef, Renderer2, inject } from '@angular/core'; import { IgxDragDirective } from '../../directives/drag-drop/drag-drop.directive'; import { Subscription, fromEvent } from 'rxjs'; import { takeUntil } from 'rxjs/operators'; @@ -15,6 +15,8 @@ import { ColumnType } from '../common/grid.interface'; standalone: true }) export class IgxColumnMovingDragDirective extends IgxDragDirective implements OnDestroy { + private cms = inject(IgxColumnMovingService); + @Input('igxColumnMovingDrag') public column: ColumnType; @@ -33,15 +35,14 @@ export class IgxColumnMovingDragDirective extends IgxDragDirective implements On private ghostImgIconGroupClass = 'igx-grid__drag-ghost-image-icon-group'; private columnSelectedClass = 'igx-grid-th--selected'; - constructor( - element: ElementRef, - viewContainer: ViewContainerRef, - zone: NgZone, - renderer: Renderer2, - cdr: ChangeDetectorRef, - private cms: IgxColumnMovingService, - _platformUtil: PlatformUtil, - ) { + constructor() { + const element = inject>(ElementRef); + const viewContainer = inject(ViewContainerRef); + const zone = inject(NgZone); + const renderer = inject(Renderer2); + const cdr = inject(ChangeDetectorRef); + const _platformUtil = inject(PlatformUtil); + super(cdr, element, viewContainer, zone, renderer, _platformUtil); this.ghostClass = this._ghostClass; } diff --git a/projects/igniteui-angular/src/lib/grids/moving/moving.drop.directive.ts b/projects/igniteui-angular/src/lib/grids/moving/moving.drop.directive.ts index 82b537af38e..2d5135bbab5 100644 --- a/projects/igniteui-angular/src/lib/grids/moving/moving.drop.directive.ts +++ b/projects/igniteui-angular/src/lib/grids/moving/moving.drop.directive.ts @@ -1,4 +1,4 @@ -import { Directive, Input, OnDestroy, ElementRef, Renderer2, NgZone } from '@angular/core'; +import { Directive, Input, OnDestroy, ElementRef, Renderer2, NgZone, inject } from '@angular/core'; import { DropPosition, IgxColumnMovingService } from './moving.service'; import { Subject, interval, animationFrameScheduler } from 'rxjs'; import { IgxColumnMovingDragDirective } from './moving.drag.directive'; @@ -14,6 +14,11 @@ import { ColumnType } from '../common/grid.interface'; standalone: true }) export class IgxColumnMovingDropDirective extends IgxDropDirective implements OnDestroy { + private ref: ElementRef; + private renderer: Renderer2; + private _: NgZone; + private cms = inject(IgxColumnMovingService); + @Input('igxColumnMovingDrop') public override set data(val: ColumnType | IgxForOfDirective) { @@ -52,13 +57,16 @@ export class IgxColumnMovingDropDirective extends IgxDropDirective implements On private _dragLeave = new Subject(); private _dropIndicatorClass = 'igx-grid-th__drop-indicator--active'; - constructor( - private ref: ElementRef, - private renderer: Renderer2, - private _: NgZone, - private cms: IgxColumnMovingService - ) { + constructor() { + const ref = inject>(ElementRef); + const renderer = inject(Renderer2); + const _ = inject(NgZone); + super(ref, renderer, _); + + this.ref = ref; + this.renderer = renderer; + this._ = _; } public override ngOnDestroy() { diff --git a/projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-data-selector.component.ts b/projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-data-selector.component.ts index 52ce5e82670..ea8f9647ee4 100644 --- a/projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-data-selector.component.ts +++ b/projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-data-selector.component.ts @@ -1,14 +1,5 @@ import { useAnimation } from "@angular/animations"; -import { - ChangeDetectorRef, - Component, - EventEmitter, - HostBinding, - Input, - Output, - Renderer2, - booleanAttribute -} from "@angular/core"; +import { ChangeDetectorRef, Component, EventEmitter, HostBinding, Input, Output, Renderer2, booleanAttribute, inject } from "@angular/core"; import { first } from "rxjs/operators"; import { SortingDirection } from "../../data-operations/sorting-strategy"; import { IDragBaseEventArgs, IDragGhostBaseEventArgs, IDragMoveEventArgs, IDropBaseEventArgs, IDropDroppedEventArgs, IgxDropDirective, IgxDragDirective, IgxDragHandleDirective } from "../../directives/drag-drop/drag-drop.directive"; @@ -88,6 +79,9 @@ interface IDataSelectorPanel { imports: [IgxInputGroupComponent, IgxIconComponent, IgxPrefixDirective, IgxInputDirective, IgxListComponent, IgxListItemComponent, IgxCheckboxComponent, IgxAccordionComponent, IgxExpansionPanelComponent, IgxExpansionPanelHeaderComponent, IgxDropDirective, IgxExpansionPanelTitleDirective, IgxChipComponent, IgxExpansionPanelBodyComponent, IgxDragDirective, IgxDropDownItemNavigationDirective, IgxDragHandleDirective, IgxDropDownComponent, IgxDropDownItemComponent, IgxFilterPivotItemsPipe] }) export class IgxPivotDataSelectorComponent { + private renderer = inject(Renderer2); + private cdr = inject(ChangeDetectorRef); + /** * Gets/sets whether the columns panel is expanded @@ -275,8 +269,6 @@ export class IgxPivotDataSelectorComponent { return this._grid?.pivotConfiguration.values || []; } - constructor(private renderer: Renderer2, private cdr: ChangeDetectorRef) { } - /** * @hidden @internal */ diff --git a/projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-grid.component.ts b/projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-grid.component.ts index 54dc1023651..486abd73c39 100644 --- a/projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-grid.component.ts +++ b/projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-grid.component.ts @@ -1,35 +1,4 @@ -import { - AfterContentInit, - AfterViewInit, - ChangeDetectionStrategy, - ChangeDetectorRef, - Component, - EventEmitter, - ElementRef, - HostBinding, - Inject, - Input, - IterableDiffers, - LOCALE_ID, - NgZone, - OnInit, - Output, - Optional, - QueryList, - TemplateRef, - ViewChild, - ViewChildren, - ViewContainerRef, - Injector, - ContentChild, - createComponent, - EnvironmentInjector, - CUSTOM_ELEMENTS_SCHEMA, - booleanAttribute, - OnChanges, - SimpleChanges, - DOCUMENT -} from '@angular/core'; +import { AfterContentInit, AfterViewInit, ChangeDetectionStrategy, ChangeDetectorRef, Component, EventEmitter, ElementRef, HostBinding, Input, IterableDiffers, LOCALE_ID, NgZone, OnInit, Output, QueryList, TemplateRef, ViewChild, ViewChildren, ViewContainerRef, Injector, ContentChild, createComponent, EnvironmentInjector, CUSTOM_ELEMENTS_SCHEMA, booleanAttribute, OnChanges, SimpleChanges, DOCUMENT, inject } from '@angular/core'; import { NgTemplateOutlet, NgClass, NgStyle } from '@angular/common'; import { first, take, takeUntil } from 'rxjs/operators'; @@ -200,6 +169,8 @@ const MINIMUM_COLUMN_WIDTH_SUPER_COMPACT = 104; }) export class IgxPivotGridComponent extends IgxGridBaseDirective implements OnInit, AfterContentInit, PivotGridType, AfterViewInit, OnChanges { + override navigation: IgxPivotGridNavigationService; + /** * Emitted when the dimension collection is changed via the grid chip area. @@ -1010,29 +981,29 @@ export class IgxPivotGridComponent extends IgxGridBaseDirective implements OnIni return selectedRowIds; } - constructor( - validationService: IgxGridValidationService, - selectionService: IgxGridSelectionService, - colResizingService: IgxPivotColumnResizingService, - gridAPI: GridBaseAPIService, - transactionFactory: IgxFlatTransactionFactory, - elementRef: ElementRef, - zone: NgZone, - @Inject(DOCUMENT) document, - cdr: ChangeDetectorRef, - differs: IterableDiffers, - viewRef: ViewContainerRef, - injector: Injector, - envInjector: EnvironmentInjector, - public override navigation: IgxPivotGridNavigationService, - filteringService: IgxFilteringService, - textHighlightService: IgxTextHighlightService, - @Inject(IgxOverlayService) overlayService: IgxOverlayService, - summaryService: IgxGridSummaryService, - @Inject(LOCALE_ID) localeId: string, - platform: PlatformUtil, - @Optional() @Inject(IgxGridTransaction) _diTransactions?: TransactionService - ) { + constructor() { + const validationService = inject(IgxGridValidationService); + const selectionService = inject(IgxGridSelectionService); + const colResizingService = inject(IgxPivotColumnResizingService); + const gridAPI = inject>(GridBaseAPIService); + const transactionFactory = inject(IgxFlatTransactionFactory); + const elementRef = inject>(ElementRef); + const zone = inject(NgZone); + const document = inject(DOCUMENT); + const cdr = inject(ChangeDetectorRef); + const differs = inject(IterableDiffers); + const viewRef = inject(ViewContainerRef); + const injector = inject(Injector); + const envInjector = inject(EnvironmentInjector); + const navigation = inject(IgxPivotGridNavigationService); + const filteringService = inject(IgxFilteringService); + const textHighlightService = inject(IgxTextHighlightService); + const overlayService = inject(IgxOverlayService); + const summaryService = inject(IgxGridSummaryService); + const localeId = inject(LOCALE_ID); + const platform = inject(PlatformUtil); + const _diTransactions = inject>(IgxGridTransaction, { optional: true }); + super( validationService, selectionService, @@ -1055,6 +1026,8 @@ export class IgxPivotGridComponent extends IgxGridBaseDirective implements OnIni localeId, platform, _diTransactions); + + this.navigation = navigation; } /** diff --git a/projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-grid.directives.ts b/projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-grid.directives.ts index c2e1555f39a..2adb242f3d3 100644 --- a/projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-grid.directives.ts +++ b/projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-grid.directives.ts @@ -1,4 +1,4 @@ -import { Directive, TemplateRef } from '@angular/core'; +import { Directive, TemplateRef, inject } from '@angular/core'; import { IgxPivotGridValueTemplateContext } from './pivot-grid.interface'; import { IgxColumnTemplateContext } from '../common/grid.interface'; /** @@ -9,7 +9,8 @@ import { IgxColumnTemplateContext } from '../common/grid.interface'; standalone: true }) export class IgxPivotValueChipTemplateDirective { - constructor(public template: TemplateRef) { } + template = inject>(TemplateRef); + public static ngTemplateContextGuard(_directive: IgxPivotValueChipTemplateDirective, context: unknown): context is IgxPivotGridValueTemplateContext { return true; @@ -24,7 +25,8 @@ export class IgxPivotValueChipTemplateDirective { standalone: true }) export class IgxPivotRowDimensionHeaderTemplateDirective { - constructor(public template: TemplateRef) { } + template = inject>(TemplateRef); + public static ngTemplateContextGuard(_directive: IgxPivotRowDimensionHeaderTemplateDirective, context: unknown): context is IgxColumnTemplateContext { return true; diff --git a/projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-grid.pipes.ts b/projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-grid.pipes.ts index 4ea39ad1f90..1954d0e2c03 100644 --- a/projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-grid.pipes.ts +++ b/projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-grid.pipes.ts @@ -1,4 +1,4 @@ -import { Inject, Pipe, PipeTransform } from '@angular/core'; +import { Pipe, PipeTransform, inject } from '@angular/core'; import { cloneArray, columnFieldPath, resolveNestedPath } from '../../core/utils'; import { DataUtil } from '../../data-operations/data-util'; import { FilteringExpressionsTree, IFilteringExpressionsTree } from '../../data-operations/filtering-expressions-tree'; @@ -27,8 +27,8 @@ import { IDataCloneStrategy } from '../../data-operations/data-clone-strategy'; standalone: true }) export class IgxPivotRowPipe implements PipeTransform { + private grid = inject(IGX_GRID_BASE); - constructor(@Inject(IGX_GRID_BASE) private grid?: PivotGridType) { } public transform( collection: any, @@ -131,8 +131,8 @@ export class IgxPivotAutoTransform implements PipeTransform { standalone: true }) export class IgxPivotRowExpansionPipe implements PipeTransform { + private grid = inject(IGX_GRID_BASE); - constructor(@Inject(IGX_GRID_BASE) private grid?: PivotGridType) { } public transform( collection: IPivotGridRecord[], @@ -188,7 +188,8 @@ export class IgxPivotRowExpansionPipe implements PipeTransform { standalone: true }) export class IgxPivotCellMergingPipe implements PipeTransform { - constructor(@Inject(IGX_GRID_BASE) private grid: PivotGridType) { } + private grid = inject(IGX_GRID_BASE); + public transform( collection: IPivotGridRecord[], config: IPivotConfiguration, @@ -241,7 +242,8 @@ export class IgxPivotCellMergingPipe implements PipeTransform { standalone: true }) export class IgxPivotGridHorizontalRowGrouping implements PipeTransform { - constructor(@Inject(IGX_GRID_BASE) private grid: GridType) { } + private grid = inject(IGX_GRID_BASE); + public transform( collection: IPivotGridRecord[], config: IPivotConfiguration, @@ -281,7 +283,8 @@ export class IgxPivotGridHorizontalRowGrouping implements PipeTransform { standalone: true }) export class IgxPivotGridHorizontalRowCellMerging implements PipeTransform { - constructor(@Inject(IGX_GRID_BASE) private grid: PivotGridType) { } + private grid = inject(IGX_GRID_BASE); + public transform( collection: IPivotGridRecord[], config: IPivotConfiguration, @@ -395,7 +398,8 @@ export class IgxPivotColumnPipe implements PipeTransform { standalone: true }) export class IgxPivotGridFilterPipe implements PipeTransform { - constructor(private gridAPI: GridBaseAPIService) { } + private gridAPI = inject>(GridBaseAPIService); + public transform(collection: any[], config: IPivotConfiguration, filterStrategy: IFilteringStrategy, @@ -459,7 +463,8 @@ export class IgxPivotGridColumnSortingPipe implements PipeTransform { standalone: true }) export class IgxPivotGridSortingPipe implements PipeTransform { - constructor(private gridAPI: GridBaseAPIService) { } + private gridAPI = inject>(GridBaseAPIService); + public transform(collection: any[], config: IPivotConfiguration, sorting: IGridSortingStrategy, _pipeTrigger: number): any[] { let result: any[]; const allDimensions = config.rows || []; diff --git a/projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-header-row.component.ts b/projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-header-row.component.ts index d2510db1ac2..d9a91d1e4c3 100644 --- a/projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-header-row.component.ts +++ b/projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-header-row.component.ts @@ -1,16 +1,4 @@ -import { - ChangeDetectionStrategy, - ChangeDetectorRef, - Component, - ElementRef, - Inject, - OnChanges, - QueryList, - Renderer2, - ViewChild, - SimpleChanges, - ViewChildren -} from '@angular/core'; +import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, OnChanges, QueryList, Renderer2, ViewChild, SimpleChanges, ViewChildren, inject } from '@angular/core'; import { IBaseChipEventArgs, IgxChipComponent } from '../../chips/chip.component'; import { IgxChipsAreaComponent } from '../../chips/chips-area.component'; import { SortingDirection } from '../../data-operations/sorting-strategy'; @@ -61,6 +49,9 @@ import { GridColumnDataType } from '../../data-operations/data-util'; IgxPivotRowHeaderGroupComponent] }) export class IgxPivotHeaderRowComponent extends IgxGridHeaderRowComponent implements OnChanges { + override grid = inject(IGX_GRID_BASE); + protected renderer = inject(Renderer2); + public aggregateList: IPivotAggregator[] = []; public value: IPivotValue; @@ -134,12 +125,10 @@ export class IgxPivotHeaderRowComponent extends IgxGridHeaderRowComponent implem return this.headerContainers?.last; } - constructor( - @Inject(IGX_GRID_BASE) public override grid: PivotGridType, - ref: ElementRef, - cdr: ChangeDetectorRef, - protected renderer: Renderer2 - ) { + constructor() { + const ref = inject>(ElementRef); + const cdr = inject(ChangeDetectorRef); + super(ref, cdr); } diff --git a/projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-row-dimension-content.component.ts b/projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-row-dimension-content.component.ts index 619813d19c2..fb1610fe6ac 100644 --- a/projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-row-dimension-content.component.ts +++ b/projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-row-dimension-content.component.ts @@ -1,22 +1,4 @@ -import { - ChangeDetectionStrategy, - ChangeDetectorRef, - Component, - createComponent, - ElementRef, - EnvironmentInjector, - HostBinding, - Inject, - Injector, - Input, - OnChanges, - QueryList, - SimpleChanges, - TemplateRef, - ViewChild, - ViewChildren, - ViewContainerRef -} from '@angular/core'; +import { ChangeDetectionStrategy, ChangeDetectorRef, Component, createComponent, ElementRef, EnvironmentInjector, HostBinding, Injector, Input, OnChanges, QueryList, SimpleChanges, TemplateRef, ViewChild, ViewChildren, ViewContainerRef, inject } from '@angular/core'; import { IgxColumnComponent } from '../columns/column.component'; import { IGX_GRID_BASE, PivotGridType } from '../common/grid.interface'; import { IgxGridHeaderRowComponent } from '../headers/grid-header-row.component'; @@ -43,6 +25,11 @@ import { IMultiRowLayoutNode } from '../common/types'; imports: [IgxPivotRowDimensionHeaderGroupComponent, NgClass, NgStyle, IgxIconComponent, IgxHeaderGroupWidthPipe, IgxHeaderGroupStylePipe] }) export class IgxPivotRowDimensionContentComponent extends IgxGridHeaderRowComponent implements OnChanges { + override grid = inject(IGX_GRID_BASE); + protected injector = inject(Injector); + protected envInjector = inject(EnvironmentInjector); + protected viewRef = inject(ViewContainerRef); + @HostBinding('style.grid-row-start') public get rowStart(): string { return this.layout ? `${this.layout.rowStart}` : ""; @@ -104,14 +91,10 @@ export class IgxPivotRowDimensionContentComponent extends IgxGridHeaderRowCompon @ViewChildren(IgxPivotRowDimensionHeaderGroupComponent) public headerGroups: QueryList - constructor( - @Inject(IGX_GRID_BASE) public override grid: PivotGridType, - ref: ElementRef, - protected injector: Injector, - protected envInjector: EnvironmentInjector, - cdr: ChangeDetectorRef, - protected viewRef: ViewContainerRef - ) { + constructor() { + const ref = inject>(ElementRef); + const cdr = inject(ChangeDetectorRef); + super(ref, cdr); } diff --git a/projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-row-dimension-header-group.component.ts b/projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-row-dimension-header-group.component.ts index 1687303b5dd..247144ed77a 100644 --- a/projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-row-dimension-header-group.component.ts +++ b/projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-row-dimension-header-group.component.ts @@ -1,4 +1,4 @@ -import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, HostBinding, HostListener, Inject, Input, NgZone, ViewChild } from '@angular/core'; +import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, HostBinding, HostListener, Input, NgZone, ViewChild, inject } from '@angular/core'; import { PlatformUtil } from '../../core/utils'; import { IgxColumnComponent } from '../columns/column.component'; import { IGX_GRID_BASE, PivotGridType } from '../common/grid.interface'; @@ -25,6 +25,12 @@ import { IMultiRowLayoutNode } from '../common/types'; imports: [IgxIconComponent, IgxPivotRowDimensionHeaderComponent, NgClass, NgStyle, IgxColumnMovingDragDirective, IgxColumnMovingDropDirective, IgxPivotResizeHandleDirective, IgxHeaderGroupStylePipe] }) export class IgxPivotRowDimensionHeaderGroupComponent extends IgxGridHeaderGroupComponent implements PivotRowHeaderGroupType { + private cdRef: ChangeDetectorRef; + override grid: PivotGridType; + private elementRef: ElementRef; + override colResizingService: IgxPivotColumnResizingService; + protected zone = inject(NgZone); + /** * @hidden @@ -32,14 +38,20 @@ export class IgxPivotRowDimensionHeaderGroupComponent extends IgxGridHeaderGroup @HostBinding('style.user-select') public userSelect = 'none'; - constructor(private cdRef: ChangeDetectorRef, - @Inject(IGX_GRID_BASE) public override grid: PivotGridType, - private elementRef: ElementRef, - public override colResizingService: IgxPivotColumnResizingService, - filteringService: IgxFilteringService, - platform: PlatformUtil, - protected zone: NgZone) { + constructor() { + const cdRef = inject(ChangeDetectorRef); + const grid = inject(IGX_GRID_BASE); + const elementRef = inject>(ElementRef); + const colResizingService = inject(IgxPivotColumnResizingService); + const filteringService = inject(IgxFilteringService); + const platform = inject(PlatformUtil); + super(cdRef, grid, elementRef, colResizingService, filteringService, platform); + + this.cdRef = cdRef; + this.grid = grid; + this.elementRef = elementRef; + this.colResizingService = colResizingService; } /** diff --git a/projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-row-dimension-header.component.ts b/projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-row-dimension-header.component.ts index afd14656238..30be1fa5934 100644 --- a/projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-row-dimension-header.component.ts +++ b/projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-row-dimension-header.component.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, HostListener, Inject } from '@angular/core'; +import { AfterViewInit, ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, HostListener, inject } from '@angular/core'; import { GridType, IGX_GRID_BASE, PivotGridType } from '../common/grid.interface'; @@ -22,15 +22,21 @@ import { PivotUtil } from './pivot-util'; imports: [IgxIconComponent, NgTemplateOutlet, NgClass, SortingIndexPipe] }) export class IgxPivotRowDimensionHeaderComponent extends IgxGridHeaderComponent implements AfterViewInit { + override colResizingService: IgxPivotColumnResizingService; + refInstance: ElementRef; + private pivotGrid: PivotGridType; - constructor( - @Inject(IGX_GRID_BASE) grid: GridType, - public override colResizingService: IgxPivotColumnResizingService, - cdr: ChangeDetectorRef, - public refInstance: ElementRef - ) { + constructor() { + const grid = inject(IGX_GRID_BASE); + const colResizingService = inject(IgxPivotColumnResizingService); + const cdr = inject(ChangeDetectorRef); + const refInstance = inject>(ElementRef); + super(grid, colResizingService, cdr, refInstance); + this.colResizingService = colResizingService; + this.refInstance = refInstance; + this.pivotGrid = this.grid as PivotGridType; this.pivotGrid.dimensionsSortingExpressionsChange diff --git a/projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-row-dimension-mrl-row.component.ts b/projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-row-dimension-mrl-row.component.ts index 335008b8de8..1ff83c7bc63 100644 --- a/projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-row-dimension-mrl-row.component.ts +++ b/projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-row-dimension-mrl-row.component.ts @@ -1,17 +1,4 @@ -import { - ChangeDetectionStrategy, - ChangeDetectorRef, - Component, - ElementRef, - EnvironmentInjector, - HostBinding, - Inject, - Injector, - Input, - QueryList, - ViewChildren, - ViewContainerRef -} from '@angular/core'; +import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, EnvironmentInjector, HostBinding, Injector, Input, QueryList, ViewChildren, ViewContainerRef, inject } from '@angular/core'; import { IGX_GRID_BASE, PivotGridType } from '../common/grid.interface'; import { IgxGridHeaderRowComponent } from '../headers/grid-header-row.component'; import { IPivotDimension, IPivotDimensionData, IPivotGridHorizontalGroup, IPivotGridRecord } from './pivot-grid.interface'; @@ -34,6 +21,11 @@ import { PivotUtil } from './pivot-util'; imports: [IgxPivotRowDimensionContentComponent, IgxPivotGridHorizontalRowCellMerging] }) export class IgxPivotRowDimensionMrlRowComponent extends IgxGridHeaderRowComponent { + override grid = inject(IGX_GRID_BASE); + protected injector = inject(Injector); + protected envInjector = inject(EnvironmentInjector); + protected viewRef = inject(ViewContainerRef); + @HostBinding('class.igx-grid__tbody-pivot-dimension') public pivotDim = true; @@ -75,14 +67,10 @@ export class IgxPivotRowDimensionMrlRowComponent extends IgxGridHeaderRowCompone @ViewChildren(IgxPivotRowDimensionContentComponent) public contentCells: QueryList - constructor( - @Inject(IGX_GRID_BASE) public override grid: PivotGridType, - ref: ElementRef, - protected injector: Injector, - protected envInjector: EnvironmentInjector, - cdr: ChangeDetectorRef, - protected viewRef: ViewContainerRef - ) { + constructor() { + const ref = inject>(ElementRef); + const cdr = inject(ChangeDetectorRef); + super(ref, cdr); } diff --git a/projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-row-header-group.component.ts b/projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-row-header-group.component.ts index 4af9f47c472..c0dbd23360c 100644 --- a/projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-row-header-group.component.ts +++ b/projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-row-header-group.component.ts @@ -1,4 +1,4 @@ -import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, HostBinding, Inject, Input, NgZone, ViewChild } from '@angular/core'; +import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, HostBinding, Input, NgZone, ViewChild, inject } from '@angular/core'; import { PlatformUtil } from '../../core/utils'; import { IGX_GRID_BASE, PivotGridType } from '../common/grid.interface'; import { IgxFilteringService } from '../filtering/grid-filtering.service'; @@ -24,6 +24,12 @@ import { SortingDirection } from '../../data-operations/sorting-strategy'; imports: [IgxIconComponent, IgxPivotRowDimensionHeaderComponent, NgClass, NgStyle, IgxColumnMovingDragDirective, IgxColumnMovingDropDirective, IgxPivotResizeHandleDirective, IgxHeaderGroupStylePipe] }) export class IgxPivotRowHeaderGroupComponent extends IgxGridHeaderGroupComponent implements PivotRowHeaderGroupType { + private cdRef: ChangeDetectorRef; + override grid: PivotGridType; + private elementRef: ElementRef; + override colResizingService: IgxPivotColumnResizingService; + protected zone = inject(NgZone); + /** * @hidden @@ -31,14 +37,20 @@ export class IgxPivotRowHeaderGroupComponent extends IgxGridHeaderGroupComponent @HostBinding('style.user-select') public userSelect = 'none'; - constructor(private cdRef: ChangeDetectorRef, - @Inject(IGX_GRID_BASE) public override grid: PivotGridType, - private elementRef: ElementRef, - public override colResizingService: IgxPivotColumnResizingService, - filteringService: IgxFilteringService, - platform: PlatformUtil, - protected zone: NgZone) { + constructor() { + const cdRef = inject(ChangeDetectorRef); + const grid = inject(IGX_GRID_BASE); + const elementRef = inject>(ElementRef); + const colResizingService = inject(IgxPivotColumnResizingService); + const filteringService = inject(IgxFilteringService); + const platform = inject(PlatformUtil); + super(cdRef, grid, elementRef, colResizingService, filteringService, platform); + + this.cdRef = cdRef; + this.grid = grid; + this.elementRef = elementRef; + this.colResizingService = colResizingService; } /** diff --git a/projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-row.component.ts b/projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-row.component.ts index ed542116c43..62efe6d29c2 100644 --- a/projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-row.component.ts +++ b/projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-row.component.ts @@ -1,11 +1,4 @@ -import { - ChangeDetectionStrategy, - ChangeDetectorRef, - Component, - ElementRef, - forwardRef, - HostBinding, Inject, Input, ViewContainerRef -} from '@angular/core'; +import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, forwardRef, HostBinding, Input, ViewContainerRef, inject } from '@angular/core'; import { IgxColumnComponent } from '../columns/column.component'; import { IGX_GRID_BASE, PivotGridType } from '../common/grid.interface'; import { IgxRowDirective } from '../row.directive'; @@ -27,6 +20,9 @@ import { IgxGridForOfDirective } from '../../directives/for-of/for_of.directive' imports: [IgxGridForOfDirective, IgxGridCellComponent, NgClass, NgStyle, IgxCheckboxComponent, IgxGridNotGroupedPipe, IgxGridCellStylesPipe, IgxGridDataMapperPipe, IgxGridTransactionStatePipe, IgxPivotGridCellStyleClassesPipe] }) export class IgxPivotRowComponent extends IgxRowDirective { + override grid: PivotGridType; + protected viewRef = inject(ViewContainerRef); + /** * @hidden */ @@ -43,14 +39,15 @@ export class IgxPivotRowComponent extends IgxRowDirective { return isSelected; } - constructor( - @Inject(IGX_GRID_BASE) public override grid: PivotGridType, - selectionService: IgxGridSelectionService, - element: ElementRef, - cdr: ChangeDetectorRef, - protected viewRef: ViewContainerRef - ) { + constructor() { + const grid = inject(IGX_GRID_BASE); + const selectionService = inject(IgxGridSelectionService); + const element = inject>(ElementRef); + const cdr = inject(ChangeDetectorRef); + super(grid, selectionService, element, cdr); + + this.grid = grid; } /** diff --git a/projects/igniteui-angular/src/lib/grids/resizing/pivot-grid/pivot-resize-handle.directive.ts b/projects/igniteui-angular/src/lib/grids/resizing/pivot-grid/pivot-resize-handle.directive.ts index 9d31dd7fe98..ae150b0f690 100644 --- a/projects/igniteui-angular/src/lib/grids/resizing/pivot-grid/pivot-resize-handle.directive.ts +++ b/projects/igniteui-angular/src/lib/grids/resizing/pivot-grid/pivot-resize-handle.directive.ts @@ -1,9 +1,4 @@ -import { - Directive, - ElementRef, - Input, - NgZone -} from '@angular/core'; +import { Directive, ElementRef, Input, NgZone, inject } from '@angular/core'; import { ColumnType } from '../../common/grid.interface'; import { PivotRowHeaderGroupType } from '../../pivot-grid/pivot-grid.interface'; import { IgxPivotColumnResizingService } from './pivot-resizing.service' @@ -18,6 +13,8 @@ import { IgxResizeHandleDirective } from '../resize-handle.directive'; standalone: true }) export class IgxPivotResizeHandleDirective extends IgxResizeHandleDirective { + override colResizingService: IgxPivotColumnResizingService; + /** * @hidden @@ -37,10 +34,14 @@ export class IgxPivotResizeHandleDirective extends IgxResizeHandleDirective { @Input('igxPivotResizeHandleHeader') public rowHeaderGroup: PivotRowHeaderGroupType; - constructor(zone: NgZone, - element: ElementRef, - public override colResizingService: IgxPivotColumnResizingService) { + constructor() { + const zone = inject(NgZone); + const element = inject(ElementRef); + const colResizingService = inject(IgxPivotColumnResizingService); + super(zone, element, colResizingService); + + this.colResizingService = colResizingService; } /** diff --git a/projects/igniteui-angular/src/lib/grids/resizing/pivot-grid/pivot-resizer.component.ts b/projects/igniteui-angular/src/lib/grids/resizing/pivot-grid/pivot-resizer.component.ts index 47347a1f00c..1871cd029e7 100644 --- a/projects/igniteui-angular/src/lib/grids/resizing/pivot-grid/pivot-resizer.component.ts +++ b/projects/igniteui-angular/src/lib/grids/resizing/pivot-grid/pivot-resizer.component.ts @@ -1,4 +1,4 @@ -import { ChangeDetectionStrategy, Component } from '@angular/core'; +import { ChangeDetectionStrategy, Component, inject } from '@angular/core'; import { IgxGridColumnResizerComponent } from '../resizer.component'; import { IgxPivotColumnResizingService } from './pivot-resizing.service'; import { IgxColumnResizerDirective } from '../resizer.directive'; @@ -10,7 +10,13 @@ import { IgxColumnResizerDirective } from '../resizer.directive'; imports: [IgxColumnResizerDirective] }) export class IgxPivotGridColumnResizerComponent extends IgxGridColumnResizerComponent { - constructor(public override colResizingService: IgxPivotColumnResizingService) { + override colResizingService: IgxPivotColumnResizingService; + + constructor() { + const colResizingService = inject(IgxPivotColumnResizingService); + super(colResizingService); + + this.colResizingService = colResizingService; } } diff --git a/projects/igniteui-angular/src/lib/grids/resizing/resize-handle.directive.ts b/projects/igniteui-angular/src/lib/grids/resizing/resize-handle.directive.ts index f942f82318e..71adcf49ee1 100644 --- a/projects/igniteui-angular/src/lib/grids/resizing/resize-handle.directive.ts +++ b/projects/igniteui-angular/src/lib/grids/resizing/resize-handle.directive.ts @@ -1,12 +1,4 @@ -import { - AfterViewInit, - Directive, - ElementRef, - Input, - NgZone, - HostListener, - OnDestroy -} from '@angular/core'; +import { AfterViewInit, Directive, ElementRef, Input, NgZone, HostListener, OnDestroy, inject } from '@angular/core'; import { Subject, fromEvent } from 'rxjs'; import { debounceTime, takeUntil } from 'rxjs/operators'; import { ColumnType } from '../common/grid.interface'; @@ -22,6 +14,10 @@ import { IgxColumnResizingService } from './resizing.service'; standalone: true }) export class IgxResizeHandleDirective implements AfterViewInit, OnDestroy { + protected zone = inject(NgZone); + protected element = inject(ElementRef); + colResizingService = inject(IgxColumnResizingService); + /** * @hidden @@ -41,10 +37,6 @@ export class IgxResizeHandleDirective implements AfterViewInit, OnDestroy { private readonly DEBOUNCE_TIME = 200; - constructor(protected zone: NgZone, - protected element: ElementRef, - public colResizingService: IgxColumnResizingService) { } - /** * @hidden */ diff --git a/projects/igniteui-angular/src/lib/grids/resizing/resizer.component.ts b/projects/igniteui-angular/src/lib/grids/resizing/resizer.component.ts index 5987715f3a6..0d5e15203a6 100644 --- a/projects/igniteui-angular/src/lib/grids/resizing/resizer.component.ts +++ b/projects/igniteui-angular/src/lib/grids/resizing/resizer.component.ts @@ -1,4 +1,4 @@ -import { ChangeDetectionStrategy, Component, Input, ViewChild } from '@angular/core'; +import { ChangeDetectionStrategy, Component, Input, ViewChild, inject } from '@angular/core'; import { IgxColumnResizingService } from './resizing.service'; import { IgxColumnResizerDirective } from './resizer.directive'; @@ -9,11 +9,11 @@ import { IgxColumnResizerDirective } from './resizer.directive'; imports: [IgxColumnResizerDirective] }) export class IgxGridColumnResizerComponent { + colResizingService = inject(IgxColumnResizingService); + @Input() public restrictResizerTop: number; @ViewChild(IgxColumnResizerDirective, { static: true }) public resizer: IgxColumnResizerDirective; - - constructor(public colResizingService: IgxColumnResizingService) { } } diff --git a/projects/igniteui-angular/src/lib/grids/resizing/resizer.directive.ts b/projects/igniteui-angular/src/lib/grids/resizing/resizer.directive.ts index bc8fb44b1ca..11925fb1d22 100644 --- a/projects/igniteui-angular/src/lib/grids/resizing/resizer.directive.ts +++ b/projects/igniteui-angular/src/lib/grids/resizing/resizer.directive.ts @@ -1,14 +1,4 @@ -import { - Directive, - ElementRef, - Inject, - Input, - NgZone, - Output, - OnInit, - OnDestroy, - DOCUMENT -} from '@angular/core'; +import { Directive, ElementRef, Input, NgZone, Output, OnInit, OnDestroy, DOCUMENT, inject } from '@angular/core'; import { Subject, fromEvent, animationFrameScheduler, interval } from 'rxjs'; import { map, switchMap, takeUntil, throttle } from 'rxjs/operators'; @@ -21,6 +11,10 @@ import { map, switchMap, takeUntil, throttle } from 'rxjs/operators'; standalone: true }) export class IgxColumnResizerDirective implements OnInit, OnDestroy { + element = inject>(ElementRef); + document = inject(DOCUMENT); + zone = inject(NgZone); + @Input() public restrictHResizeMin: number = Number.MIN_SAFE_INTEGER; @@ -48,11 +42,7 @@ export class IgxColumnResizerDirective implements OnInit, OnDestroy { return this._ratio; } - constructor( - public element: ElementRef, - @Inject(DOCUMENT) public document, - public zone: NgZone - ) { + constructor() { this.resizeStart.pipe( takeUntil(this._destroy), diff --git a/projects/igniteui-angular/src/lib/grids/resizing/resizing.service.ts b/projects/igniteui-angular/src/lib/grids/resizing/resizing.service.ts index b4106c80ede..af84f06c9ad 100644 --- a/projects/igniteui-angular/src/lib/grids/resizing/resizing.service.ts +++ b/projects/igniteui-angular/src/lib/grids/resizing/resizing.service.ts @@ -1,4 +1,4 @@ -import { Injectable, NgZone } from '@angular/core'; +import { Injectable, NgZone, inject } from '@angular/core'; import { ColumnType } from '../common/grid.interface'; /** @@ -7,6 +7,8 @@ import { ColumnType } from '../common/grid.interface'; */ @Injectable() export class IgxColumnResizingService { + private zone = inject(NgZone); + /** * @hidden @@ -29,8 +31,6 @@ export class IgxColumnResizingService { */ public column: ColumnType; - constructor(private zone: NgZone) { } - /** * @hidden */ diff --git a/projects/igniteui-angular/src/lib/grids/row-drag.directive.ts b/projects/igniteui-angular/src/lib/grids/row-drag.directive.ts index e611ee562ff..0ab18051924 100644 --- a/projects/igniteui-angular/src/lib/grids/row-drag.directive.ts +++ b/projects/igniteui-angular/src/lib/grids/row-drag.directive.ts @@ -1,4 +1,4 @@ -import { Directive, Input, OnDestroy, TemplateRef } from '@angular/core'; +import { Directive, Input, OnDestroy, TemplateRef, inject } from '@angular/core'; import { fromEvent, Subscription } from 'rxjs'; import { IgxDragDirective } from '../directives/drag-drop/drag-drop.directive'; import { IRowDragStartEventArgs, IRowDragEndEventArgs } from './common/events'; @@ -188,7 +188,8 @@ export class IgxDragIndicatorIconDirective { standalone: true }) export class IgxRowDragGhostDirective { - constructor(public templateRef: TemplateRef) { } + templateRef = inject>(TemplateRef); + public static ngTemplateContextGuard(_directive: IgxRowDragGhostDirective, context: unknown): context is IgxGridRowDragGhostContext { return true; diff --git a/projects/igniteui-angular/src/lib/grids/row.directive.ts b/projects/igniteui-angular/src/lib/grids/row.directive.ts index b2118b1f15e..35ee49c772c 100644 --- a/projects/igniteui-angular/src/lib/grids/row.directive.ts +++ b/projects/igniteui-angular/src/lib/grids/row.directive.ts @@ -1,22 +1,4 @@ -import { - AfterViewInit, - booleanAttribute, - ChangeDetectorRef, - Directive, - DoCheck, - ElementRef, - EventEmitter, - forwardRef, - HostBinding, - HostListener, - Inject, - Input, - OnDestroy, - Output, - QueryList, - ViewChild, - ViewChildren -} from '@angular/core'; +import { AfterViewInit, booleanAttribute, ChangeDetectorRef, Directive, DoCheck, ElementRef, EventEmitter, forwardRef, HostBinding, HostListener, Input, OnDestroy, Output, QueryList, ViewChild, ViewChildren, inject } from '@angular/core'; import { IgxCheckboxComponent } from '../checkbox/checkbox.component'; import { IgxGridForOfDirective } from '../directives/for-of/for_of.directive'; import { TransactionType } from '../services/transaction/transaction'; @@ -33,6 +15,11 @@ import { trackByIdentity } from '../core/utils'; standalone: true }) export class IgxRowDirective implements DoCheck, AfterViewInit, OnDestroy { + grid = inject(IGX_GRID_BASE); + selectionService = inject(IgxGridSelectionService); + element = inject>(ElementRef); + cdr = inject(ChangeDetectorRef); + /** * @hidden */ @@ -375,12 +362,6 @@ export class IgxRowDirective implements DoCheck, AfterViewInit, OnDestroy { protected _data: any; protected _addRow: boolean; - constructor( - @Inject(IGX_GRID_BASE) public grid: GridType, - public selectionService: IgxGridSelectionService, - public element: ElementRef, - public cdr: ChangeDetectorRef) { } - /** * @hidden * @internal diff --git a/projects/igniteui-angular/src/lib/grids/selection/drag-select.directive.ts b/projects/igniteui-angular/src/lib/grids/selection/drag-select.directive.ts index 11ca40a9dfb..9aa941f4141 100644 --- a/projects/igniteui-angular/src/lib/grids/selection/drag-select.directive.ts +++ b/projects/igniteui-angular/src/lib/grids/selection/drag-select.directive.ts @@ -1,4 +1,4 @@ -import { Directive, Input, Output, EventEmitter, ElementRef, OnDestroy, NgZone, OnInit, booleanAttribute } from '@angular/core'; +import { Directive, Input, Output, EventEmitter, ElementRef, OnDestroy, NgZone, OnInit, booleanAttribute, inject } from '@angular/core'; import { interval, Observable, Subscription, Subject, animationFrameScheduler } from 'rxjs'; import { filter, takeUntil } from 'rxjs/operators'; @@ -24,6 +24,9 @@ enum DragScrollDirection { standalone: true }) export class IgxGridDragSelectDirective implements OnInit, OnDestroy { + private ref = inject>(ElementRef); + private zone = inject(NgZone); + @Output() public dragStop = new EventEmitter(); @@ -54,7 +57,7 @@ export class IgxGridDragSelectDirective implements OnInit, OnDestroy { private _activeDrag: boolean; - constructor(private ref: ElementRef, private zone: NgZone) { + constructor() { this._interval$ = interval(0, animationFrameScheduler).pipe( takeUntil(this.end$), filter(() => this.activeDrag) diff --git a/projects/igniteui-angular/src/lib/grids/selection/row-selectors.ts b/projects/igniteui-angular/src/lib/grids/selection/row-selectors.ts index 2b24560ef71..b0660ede40c 100644 --- a/projects/igniteui-angular/src/lib/grids/selection/row-selectors.ts +++ b/projects/igniteui-angular/src/lib/grids/selection/row-selectors.ts @@ -1,4 +1,4 @@ -import { Directive, TemplateRef } from '@angular/core'; +import { Directive, TemplateRef, inject } from '@angular/core'; import { IgxHeadSelectorTemplateContext, IgxGroupByRowSelectorTemplateContext, IgxRowSelectorTemplateContext } from '../common/grid.interface'; /** @@ -10,7 +10,8 @@ import { IgxHeadSelectorTemplateContext, IgxGroupByRowSelectorTemplateContext, I standalone: true }) export class IgxRowSelectorDirective { - constructor(public templateRef: TemplateRef) { } + templateRef = inject>(TemplateRef); + public static ngTemplateContextGuard(_directive: IgxRowSelectorDirective, context: unknown): context is IgxRowSelectorTemplateContext { @@ -27,7 +28,8 @@ export class IgxRowSelectorDirective { standalone: true }) export class IgxGroupByRowSelectorDirective { - constructor(public templateRef: TemplateRef) { } + templateRef = inject>(TemplateRef); + public static ngTemplateContextGuard(_directive: IgxGroupByRowSelectorDirective, context: unknown): context is IgxGroupByRowSelectorTemplateContext { @@ -44,7 +46,8 @@ export class IgxGroupByRowSelectorDirective { standalone: true }) export class IgxHeadSelectorDirective { - constructor(public templateRef: TemplateRef) { } + templateRef = inject>(TemplateRef); + public static ngTemplateContextGuard(_directive: IgxHeadSelectorDirective, context: unknown): context is IgxHeadSelectorTemplateContext { diff --git a/projects/igniteui-angular/src/lib/grids/selection/selection.service.ts b/projects/igniteui-angular/src/lib/grids/selection/selection.service.ts index 83287824d16..75028ba2ccd 100644 --- a/projects/igniteui-angular/src/lib/grids/selection/selection.service.ts +++ b/projects/igniteui-angular/src/lib/grids/selection/selection.service.ts @@ -1,4 +1,4 @@ -import { EventEmitter, Injectable, NgZone } from '@angular/core'; +import { EventEmitter, Injectable, NgZone, inject } from '@angular/core'; import { Subject } from 'rxjs'; import { PlatformUtil } from '../../core/utils'; import { FilteringExpressionsTree } from '../../data-operations/filtering-expressions-tree'; @@ -18,6 +18,9 @@ import { PivotUtil } from '../pivot-grid/pivot-util'; @Injectable() export class IgxGridSelectionService { + private zone = inject(NgZone); + protected platform = inject(PlatformUtil); + public grid: GridType; public dragMode = false; public activeElement: ISelectionNode | null; @@ -73,7 +76,7 @@ export class IgxGridSelectionService { this.pointerState.primaryButton = value; } - constructor(private zone: NgZone, protected platform: PlatformUtil) { + constructor() { this.initPointerState(); this.initKeyboardState(); this.initColumnsState(); diff --git a/projects/igniteui-angular/src/lib/grids/state-base.directive.ts b/projects/igniteui-angular/src/lib/grids/state-base.directive.ts index 2dfb9669d6b..70f3e60a895 100644 --- a/projects/igniteui-angular/src/lib/grids/state-base.directive.ts +++ b/projects/igniteui-angular/src/lib/grids/state-base.directive.ts @@ -1,4 +1,4 @@ -import { Directive, Optional, Input, Host, ViewContainerRef, Inject, createComponent, EnvironmentInjector, Injector } from '@angular/core'; +import { Directive, Input, ViewContainerRef, createComponent, EnvironmentInjector, Injector, inject } from '@angular/core'; import { IExpressionTree, IFilteringExpressionsTree } from '../data-operations/filtering-expressions-tree'; import { IgxColumnComponent } from './columns/column.component'; import { IgxColumnGroupComponent } from './columns/column-group.component'; @@ -121,6 +121,11 @@ interface Feature { /* blazorIndirectRender */ @Directive() export class IgxGridStateBaseDirective { + grid = inject(IGX_GRID_BASE, { host: true, optional: true }); + protected viewRef = inject(ViewContainerRef); + protected envInjector = inject(EnvironmentInjector); + protected injector = inject(Injector); + private featureKeys: GridFeatures[] = []; private state: IGridState; @@ -499,13 +504,6 @@ export class IgxGridStateBaseDirective { } } - /** - * @hidden - */ - constructor( - @Host() @Optional() @Inject(IGX_GRID_BASE) public grid: GridType, - protected viewRef: ViewContainerRef, protected envInjector: EnvironmentInjector, protected injector: Injector) { } - /** * Gets the state of a feature or states of all grid features, unless a certain feature is disabled through the `options` property. * diff --git a/projects/igniteui-angular/src/lib/grids/summaries/grid-root-summary.pipe.ts b/projects/igniteui-angular/src/lib/grids/summaries/grid-root-summary.pipe.ts index ddb9dc99f2e..796b960c130 100644 --- a/projects/igniteui-angular/src/lib/grids/summaries/grid-root-summary.pipe.ts +++ b/projects/igniteui-angular/src/lib/grids/summaries/grid-root-summary.pipe.ts @@ -1,4 +1,4 @@ -import { Inject, Pipe, PipeTransform } from '@angular/core'; +import { Pipe, PipeTransform, inject } from '@angular/core'; import { GridType, IGX_GRID_BASE } from '../common/grid.interface'; @Pipe({ @@ -6,8 +6,8 @@ import { GridType, IGX_GRID_BASE } from '../common/grid.interface'; standalone: true }) export class IgxSummaryDataPipe implements PipeTransform { + private grid = inject(IGX_GRID_BASE); - constructor(@Inject(IGX_GRID_BASE) private grid: GridType) { } // eslint-disable-next-line @typescript-eslint/no-unused-vars public transform(id: string, trigger = 0) { diff --git a/projects/igniteui-angular/src/lib/grids/summaries/summary-cell.component.ts b/projects/igniteui-angular/src/lib/grids/summaries/summary-cell.component.ts index 8f4da37f72e..7c230332b29 100644 --- a/projects/igniteui-angular/src/lib/grids/summaries/summary-cell.component.ts +++ b/projects/igniteui-angular/src/lib/grids/summaries/summary-cell.component.ts @@ -1,4 +1,4 @@ -import { Component, Input, HostBinding, HostListener, ChangeDetectionStrategy, ElementRef, TemplateRef, booleanAttribute } from '@angular/core'; +import { Component, Input, HostBinding, HostListener, ChangeDetectionStrategy, ElementRef, TemplateRef, booleanAttribute, inject } from '@angular/core'; import { IgxSummaryOperand, IgxSummaryResult @@ -16,6 +16,8 @@ import { trackByIdentity } from '../../core/utils'; imports: [NgTemplateOutlet] }) export class IgxSummaryCellComponent { + private element = inject(ElementRef); + @Input() public summaryResults: IgxSummaryResult[]; @@ -44,9 +46,6 @@ export class IgxSummaryCellComponent { @HostBinding('attr.data-rowIndex') public rowIndex: number; - constructor(private element: ElementRef) { - } - @HostBinding('attr.data-visibleIndex') public get visibleColumnIndex(): number { return this.column.visibleIndex; diff --git a/projects/igniteui-angular/src/lib/grids/summaries/summary-row.component.ts b/projects/igniteui-angular/src/lib/grids/summaries/summary-row.component.ts index 6628188091d..244289e4ef8 100644 --- a/projects/igniteui-angular/src/lib/grids/summaries/summary-row.component.ts +++ b/projects/igniteui-angular/src/lib/grids/summaries/summary-row.component.ts @@ -1,16 +1,4 @@ -import { - Component, - Input, - ViewChildren, - QueryList, - HostBinding, - ViewChild, - ElementRef, - ChangeDetectionStrategy, - ChangeDetectorRef, - DoCheck, - Inject -} from '@angular/core'; +import { Component, Input, ViewChildren, QueryList, HostBinding, ViewChild, ElementRef, ChangeDetectionStrategy, ChangeDetectorRef, DoCheck, inject } from '@angular/core'; import { IgxSummaryResult } from './grid-summary'; import { IgxSummaryCellComponent } from './summary-cell.component'; import { IgxGridForOfDirective } from '../../directives/for-of/for_of.directive'; @@ -29,6 +17,10 @@ import { trackByIdentity } from '../../core/utils'; imports: [NgTemplateOutlet, IgxGridForOfDirective, IgxSummaryCellComponent, IgxGridNotGroupedPipe] }) export class IgxSummaryRowComponent implements DoCheck { + grid = inject(IGX_GRID_BASE); + element = inject>(ElementRef); + cdr = inject(ChangeDetectorRef); + @Input() public summaries: Map; @@ -71,10 +63,6 @@ export class IgxSummaryRowComponent implements DoCheck { @ViewChild('igxDirRef', { read: IgxGridForOfDirective }) public virtDirRow: IgxGridForOfDirective; - constructor(@Inject(IGX_GRID_BASE) public grid: GridType, - public element: ElementRef, - public cdr: ChangeDetectorRef) {} - public ngDoCheck() { this.cdr.markForCheck(); } diff --git a/projects/igniteui-angular/src/lib/grids/toolbar/common.ts b/projects/igniteui-angular/src/lib/grids/toolbar/common.ts index ebb2f964554..b2254df8e3d 100644 --- a/projects/igniteui-angular/src/lib/grids/toolbar/common.ts +++ b/projects/igniteui-angular/src/lib/grids/toolbar/common.ts @@ -1,4 +1,4 @@ -import { Component, Directive, HostBinding, TemplateRef } from '@angular/core'; +import { Component, Directive, HostBinding, TemplateRef, inject } from '@angular/core'; import { GridType } from '../common/grid.interface'; @Directive({ @@ -86,7 +86,8 @@ export interface IgxGridToolbarTemplateContext { standalone: true }) export class IgxGridToolbarDirective { - constructor(public template: TemplateRef) {} + template = inject>(TemplateRef); + public static ngTemplateContextGuard(_dir: IgxGridToolbarDirective, ctx: unknown): ctx is IgxGridToolbarTemplateContext { diff --git a/projects/igniteui-angular/src/lib/grids/toolbar/grid-toolbar-advanced-filtering.component.ts b/projects/igniteui-angular/src/lib/grids/toolbar/grid-toolbar-advanced-filtering.component.ts index bac31fe0015..3a30c32b487 100644 --- a/projects/igniteui-angular/src/lib/grids/toolbar/grid-toolbar-advanced-filtering.component.ts +++ b/projects/igniteui-angular/src/lib/grids/toolbar/grid-toolbar-advanced-filtering.component.ts @@ -1,4 +1,4 @@ -import { Component, Inject, Input, OnInit } from '@angular/core'; +import { Component, Input, OnInit, inject } from '@angular/core'; import { IgxToolbarToken } from './token'; import { OverlaySettings } from '../../services/overlay/utilities'; import { IgxIconComponent } from '../../icon/icon.component'; @@ -32,6 +32,8 @@ import { isTree } from '../../data-operations/expressions-tree-util'; imports: [IgxButtonDirective, IgxRippleDirective, IgxIconComponent] }) export class IgxGridToolbarAdvancedFilteringComponent implements OnInit { + private toolbar = inject(IgxToolbarToken); + protected numberOfColumns: number; /** * Returns the grid containing this component. @@ -44,8 +46,6 @@ export class IgxGridToolbarAdvancedFilteringComponent implements OnInit { @Input() public overlaySettings: OverlaySettings; - constructor( @Inject(IgxToolbarToken) private toolbar: IgxToolbarToken) { } - /** * @hidden */ diff --git a/projects/igniteui-angular/src/lib/grids/toolbar/grid-toolbar-exporter.component.ts b/projects/igniteui-angular/src/lib/grids/toolbar/grid-toolbar-exporter.component.ts index f2b63fd0f65..b5f06235e18 100644 --- a/projects/igniteui-angular/src/lib/grids/toolbar/grid-toolbar-exporter.component.ts +++ b/projects/igniteui-angular/src/lib/grids/toolbar/grid-toolbar-exporter.component.ts @@ -1,4 +1,4 @@ -import { Component, Input, Output, EventEmitter, Inject, booleanAttribute } from '@angular/core'; +import { Component, Input, Output, EventEmitter, booleanAttribute, inject } from '@angular/core'; import { first } from 'rxjs/operators'; import { BaseToolbarDirective } from './grid-toolbar.base'; import { IgxExcelTextDirective, IgxCSVTextDirective } from './common'; @@ -53,6 +53,9 @@ export interface IgxExporterEvent { imports: [IgxButtonDirective, IgxRippleDirective, IgxIconComponent, IgxToggleDirective, IgxExcelTextDirective, IgxCSVTextDirective] }) export class IgxGridToolbarExporterComponent extends BaseToolbarDirective { + private excelExporter = inject(IgxExcelExporterService); + private csvExporter = inject(IgxCsvExporterService); + /** * Show entry for CSV export. @@ -90,11 +93,9 @@ export class IgxGridToolbarExporterComponent extends BaseToolbarDirective { */ protected isExporting = false; - constructor( - @Inject(IgxToolbarToken) toolbar: IgxToolbarToken, - private excelExporter: IgxExcelExporterService, - private csvExporter: IgxCsvExporterService, - ) { + constructor() { + const toolbar = inject(IgxToolbarToken); + super(toolbar); } diff --git a/projects/igniteui-angular/src/lib/grids/toolbar/grid-toolbar.component.ts b/projects/igniteui-angular/src/lib/grids/toolbar/grid-toolbar.component.ts index 877ab3f9f1d..296edfb88fd 100644 --- a/projects/igniteui-angular/src/lib/grids/toolbar/grid-toolbar.component.ts +++ b/projects/igniteui-angular/src/lib/grids/toolbar/grid-toolbar.component.ts @@ -1,13 +1,4 @@ -import { - Component, - ContentChild, - ElementRef, - HostBinding, - Inject, - Input, - OnDestroy, - booleanAttribute -} from '@angular/core'; +import { Component, ContentChild, ElementRef, HostBinding, Input, OnDestroy, booleanAttribute, inject } from '@angular/core'; import { Subscription } from 'rxjs'; import { IgxIconService } from '../../icon/icon.service'; import { pinLeft, unpinLeft } from '@igniteui/material-icons-extended'; @@ -41,6 +32,10 @@ import { NgTemplateOutlet } from '@angular/common'; imports: [IgxGridToolbarActionsComponent, IgxGridToolbarAdvancedFilteringComponent, NgTemplateOutlet, IgxLinearProgressBarComponent] }) export class IgxGridToolbarComponent implements OnDestroy { + private api = inject(IGX_GRID_SERVICE_BASE); + private iconService = inject(IgxIconService); + private element = inject>(ElementRef); + /** * When enabled, shows the indeterminate progress bar. @@ -96,11 +91,7 @@ export class IgxGridToolbarComponent implements OnDestroy { protected _grid: GridType; protected sub: Subscription; - constructor( - @Inject(IGX_GRID_SERVICE_BASE) private api: GridServiceType, - private iconService: IgxIconService, - private element: ElementRef - ) { + constructor() { this.iconService.addSvgIconFromText(pinLeft.name, pinLeft.value, 'imx-icons'); this.iconService.addSvgIconFromText(unpinLeft.name, unpinLeft.value, 'imx-icons'); } diff --git a/projects/igniteui-angular/src/lib/grids/tree-grid/tree-grid.component.ts b/projects/igniteui-angular/src/lib/grids/tree-grid/tree-grid.component.ts index 30f413e00e4..a6e57894707 100644 --- a/projects/igniteui-angular/src/lib/grids/tree-grid/tree-grid.component.ts +++ b/projects/igniteui-angular/src/lib/grids/tree-grid/tree-grid.component.ts @@ -1,29 +1,4 @@ -import { - ChangeDetectionStrategy, - Component, - HostBinding, - Input, - OnInit, - TemplateRef, - ContentChild, - AfterContentInit, - ViewChild, - DoCheck, - AfterViewInit, - ElementRef, - NgZone, - Inject, - ChangeDetectorRef, - IterableDiffers, - ViewContainerRef, - Optional, - LOCALE_ID, - Injector, - EnvironmentInjector, - CUSTOM_ELEMENTS_SCHEMA, - booleanAttribute, - DOCUMENT -} from '@angular/core'; +import { ChangeDetectionStrategy, Component, HostBinding, Input, OnInit, TemplateRef, ContentChild, AfterContentInit, ViewChild, DoCheck, AfterViewInit, ElementRef, NgZone, ChangeDetectorRef, IterableDiffers, ViewContainerRef, LOCALE_ID, Injector, EnvironmentInjector, CUSTOM_ELEMENTS_SCHEMA, booleanAttribute, DOCUMENT, inject } from '@angular/core'; import { NgClass, NgTemplateOutlet, NgStyle } from '@angular/common'; import { IgxTreeGridAPIService } from './tree-grid-api.service'; @@ -173,6 +148,8 @@ let NEXT_ID = 0; schemas: [CUSTOM_ELEMENTS_SCHEMA] }) export class IgxTreeGridComponent extends IgxGridBaseDirective implements GridType, OnInit, AfterViewInit, DoCheck, AfterContentInit { + protected override _diTransactions?: HierarchicalTransactionService; + /** * Sets the child data key of the `IgxTreeGridComponent`. * ```html @@ -447,31 +424,29 @@ export class IgxTreeGridComponent extends IgxGridBaseDirective implements GridTy // return this.gridAPI as IgxTreeGridAPIService; // } - constructor( - validationService: IgxGridValidationService, - selectionService: IgxGridSelectionService, - colResizingService: IgxColumnResizingService, - @Inject(IGX_GRID_SERVICE_BASE) gridAPI: GridServiceType, - // public gridAPI: GridBaseAPIService, - transactionFactory: IgxHierarchicalTransactionFactory, - _elementRef: ElementRef, - _zone: NgZone, - @Inject(DOCUMENT) document: any, - cdr: ChangeDetectorRef, - differs: IterableDiffers, - viewRef: ViewContainerRef, - injector: Injector, - envInjector: EnvironmentInjector, - navigation: IgxGridNavigationService, - filteringService: IgxFilteringService, - textHighlightService: IgxTextHighlightService, - @Inject(IgxOverlayService) overlayService: IgxOverlayService, - summaryService: IgxGridSummaryService, - @Inject(LOCALE_ID) localeId: string, - platform: PlatformUtil, - @Optional() @Inject(IgxGridTransaction) protected override _diTransactions?: - HierarchicalTransactionService, - ) { + constructor() { + const validationService = inject(IgxGridValidationService); + const selectionService = inject(IgxGridSelectionService); + const colResizingService = inject(IgxColumnResizingService); + const gridAPI = inject(IGX_GRID_SERVICE_BASE); + const transactionFactory = inject(IgxHierarchicalTransactionFactory); + const _elementRef = inject>(ElementRef); + const _zone = inject(NgZone); + const document = inject(DOCUMENT); + const cdr = inject(ChangeDetectorRef); + const differs = inject(IterableDiffers); + const viewRef = inject(ViewContainerRef); + const injector = inject(Injector); + const envInjector = inject(EnvironmentInjector); + const navigation = inject(IgxGridNavigationService); + const filteringService = inject(IgxFilteringService); + const textHighlightService = inject(IgxTextHighlightService); + const overlayService = inject(IgxOverlayService); + const summaryService = inject(IgxGridSummaryService); + const localeId = inject(LOCALE_ID); + const platform = inject(PlatformUtil); + const _diTransactions = inject>(IgxGridTransaction, { optional: true }); + super( validationService, selectionService, @@ -495,6 +470,8 @@ export class IgxTreeGridComponent extends IgxGridBaseDirective implements GridTy platform, _diTransactions, ); + + this._diTransactions = _diTransactions; } /** diff --git a/projects/igniteui-angular/src/lib/grids/tree-grid/tree-grid.directives.ts b/projects/igniteui-angular/src/lib/grids/tree-grid/tree-grid.directives.ts index e66ffb45905..5edb199922c 100644 --- a/projects/igniteui-angular/src/lib/grids/tree-grid/tree-grid.directives.ts +++ b/projects/igniteui-angular/src/lib/grids/tree-grid/tree-grid.directives.ts @@ -1,4 +1,4 @@ -import { Directive, TemplateRef } from '@angular/core'; +import { Directive, TemplateRef, inject } from '@angular/core'; /** * @hidden @@ -8,6 +8,5 @@ import { Directive, TemplateRef } from '@angular/core'; standalone: true }) export class IgxRowLoadingIndicatorTemplateDirective { - - constructor(public template: TemplateRef) { } + template = inject>(TemplateRef); } diff --git a/projects/igniteui-angular/src/lib/grids/tree-grid/tree-grid.filtering.pipe.ts b/projects/igniteui-angular/src/lib/grids/tree-grid/tree-grid.filtering.pipe.ts index 8d8a6341c79..2abe42318e3 100644 --- a/projects/igniteui-angular/src/lib/grids/tree-grid/tree-grid.filtering.pipe.ts +++ b/projects/igniteui-angular/src/lib/grids/tree-grid/tree-grid.filtering.pipe.ts @@ -1,4 +1,4 @@ -import { Inject, Pipe, PipeTransform } from '@angular/core'; +import { Pipe, PipeTransform, inject } from '@angular/core'; import { IFilteringStrategy } from '../../data-operations/filtering-strategy'; import { IFilteringExpressionsTree, FilteringExpressionsTree } from '../../data-operations/filtering-expressions-tree'; import { IFilteringState } from '../../data-operations/filtering-state.interface'; @@ -12,8 +12,8 @@ import { TreeGridFilteringStrategy } from './tree-grid.filtering.strategy'; standalone: true }) export class IgxTreeGridFilteringPipe implements PipeTransform { + private grid = inject(IGX_GRID_BASE); - constructor(@Inject(IGX_GRID_BASE) private grid: GridType) {} public transform(hierarchyData: ITreeGridRecord[], expressionsTree: IFilteringExpressionsTree, filterStrategy: IFilteringStrategy, diff --git a/projects/igniteui-angular/src/lib/grids/tree-grid/tree-grid.pipes.ts b/projects/igniteui-angular/src/lib/grids/tree-grid/tree-grid.pipes.ts index 319724f9538..de02dc6d140 100644 --- a/projects/igniteui-angular/src/lib/grids/tree-grid/tree-grid.pipes.ts +++ b/projects/igniteui-angular/src/lib/grids/tree-grid/tree-grid.pipes.ts @@ -1,4 +1,4 @@ -import { Inject, Pipe, PipeTransform } from '@angular/core'; +import { Pipe, PipeTransform, inject } from '@angular/core'; import { cloneArray, cloneHierarchicalArray } from '../../core/utils'; import { DataUtil } from '../../data-operations/data-util'; import { ITreeGridRecord } from './tree-grid.interfaces'; @@ -17,8 +17,8 @@ import { IGroupingExpression } from '../../data-operations/grouping-expression.i standalone: true }) export class IgxTreeGridHierarchizingPipe implements PipeTransform { + private grid = inject(IGX_GRID_BASE); - constructor(@Inject(IGX_GRID_BASE) private grid: GridType) { } public transform(collection: any[], primaryKey: string, foreignKey: string, childDataKey: string, _: number): ITreeGridRecord[] { let hierarchicalRecords: ITreeGridRecord[] = []; @@ -134,8 +134,8 @@ export class IgxTreeGridHierarchizingPipe implements PipeTransform { standalone: true }) export class IgxTreeGridFlatteningPipe implements PipeTransform { + private grid = inject(IGX_GRID_BASE); - constructor(@Inject(IGX_GRID_BASE) private grid: GridType) { } public transform(collection: ITreeGridRecord[], expandedLevels: number, expandedStates: Map, _: number): any[] { @@ -186,8 +186,8 @@ export class IgxTreeGridFlatteningPipe implements PipeTransform { standalone: true }) export class IgxTreeGridSortingPipe implements PipeTransform { + private grid = inject(IGX_GRID_BASE); - constructor(@Inject(IGX_GRID_BASE) private grid: GridType) { } public transform( hierarchicalData: ITreeGridRecord[], @@ -228,8 +228,8 @@ export class IgxTreeGridSortingPipe implements PipeTransform { standalone: true }) export class IgxTreeGridPagingPipe implements PipeTransform { + private grid = inject(IGX_GRID_BASE); - constructor(@Inject(IGX_GRID_BASE) private grid: GridType) { } public transform(collection: ITreeGridRecord[], enabled: boolean, page = 0, perPage = 15, _: number): ITreeGridRecord[] { if (!enabled || this.grid.pagingMode !== 'local') { @@ -257,10 +257,9 @@ export class IgxTreeGridPagingPipe implements PipeTransform { standalone: true }) export class IgxTreeGridTransactionPipe implements PipeTransform { + private grid = inject(IGX_GRID_BASE); - constructor(@Inject(IGX_GRID_BASE) private grid: GridType) { } - public transform(collection: any[], _: number): any[] { if (this.grid.transactions.enabled) { @@ -304,8 +303,8 @@ export class IgxTreeGridTransactionPipe implements PipeTransform { standalone: true }) export class IgxTreeGridNormalizeRecordsPipe implements PipeTransform { + private grid = inject(IGX_GRID_BASE); - constructor(@Inject(IGX_GRID_BASE) private grid: GridType) { } public transform(_: any[], __: number): any[] { const primaryKey = this.grid.primaryKey; @@ -327,8 +326,8 @@ export class IgxTreeGridNormalizeRecordsPipe implements PipeTransform { standalone: true }) export class IgxTreeGridAddRowPipe implements PipeTransform { + private grid = inject(IGX_GRID_BASE); - constructor(@Inject(IGX_GRID_BASE) private grid: GridType) { } public transform(collection: any, isPinned = false, _pipeTrigger: number) { if (!this.grid.rowEditable || !this.grid.crudService.row || !this.grid.crudService.row.isAddRow || diff --git a/projects/igniteui-angular/src/lib/grids/tree-grid/tree-grid.summary.pipe.ts b/projects/igniteui-angular/src/lib/grids/tree-grid/tree-grid.summary.pipe.ts index 54bb4acb800..2bad06947da 100644 --- a/projects/igniteui-angular/src/lib/grids/tree-grid/tree-grid.summary.pipe.ts +++ b/projects/igniteui-angular/src/lib/grids/tree-grid/tree-grid.summary.pipe.ts @@ -1,4 +1,4 @@ -import { Inject, Pipe, PipeTransform } from '@angular/core'; +import { Pipe, PipeTransform, inject } from '@angular/core'; import { ITreeGridRecord } from './tree-grid.interfaces'; import { ISummaryRecord } from '../summaries/grid-summary'; import { GridSummaryCalculationMode, GridSummaryPosition } from '../common/enums'; @@ -10,8 +10,8 @@ import { GridType, IGX_GRID_BASE } from '../common/grid.interface'; standalone: true }) export class IgxTreeGridSummaryPipe implements PipeTransform { + private grid = inject(IGX_GRID_BASE); - constructor(@Inject(IGX_GRID_BASE) private grid: GridType) {} public transform(flatData: ITreeGridRecord[], hasSummary: boolean, diff --git a/projects/igniteui-angular/src/lib/icon/icon.component.ts b/projects/igniteui-angular/src/lib/icon/icon.component.ts index dbd531ce68a..25b0510d23d 100644 --- a/projects/igniteui-angular/src/lib/icon/icon.component.ts +++ b/projects/igniteui-angular/src/lib/icon/icon.component.ts @@ -1,14 +1,4 @@ -import { - Component, - ElementRef, - HostBinding, - Input, - OnInit, - OnDestroy, - OnChanges, - ChangeDetectorRef, - booleanAttribute, -} from "@angular/core"; +import { Component, ElementRef, HostBinding, Input, OnInit, OnDestroy, OnChanges, ChangeDetectorRef, booleanAttribute, inject } from "@angular/core"; import { IgxIconService } from "./icon.service"; import type { IconReference } from "./types"; import { filter, takeUntil } from "rxjs/operators"; @@ -42,6 +32,10 @@ import { SafeHtml } from "@angular/platform-browser"; templateUrl: "icon.component.html", }) export class IgxIconComponent implements OnInit, OnChanges, OnDestroy { + el = inject(ElementRef); + private iconService = inject(IgxIconService); + private ref = inject(ChangeDetectorRef); + private _iconRef: IconReference; private _destroy$ = new Subject(); private _userClasses = new Set(); @@ -113,11 +107,7 @@ export class IgxIconComponent implements OnInit, OnChanges, OnDestroy { @Input({ transform: booleanAttribute }) public active = true; - constructor( - public el: ElementRef, - private iconService: IgxIconService, - private ref: ChangeDetectorRef, - ) { + constructor() { this.family = this.iconService.defaultFamily.name; this.iconService.iconLoaded diff --git a/projects/igniteui-angular/src/lib/icon/icon.service.spec.ts b/projects/igniteui-angular/src/lib/icon/icon.service.spec.ts index bc891edaf02..ac170a45fff 100644 --- a/projects/igniteui-angular/src/lib/icon/icon.service.spec.ts +++ b/projects/igniteui-angular/src/lib/icon/icon.service.spec.ts @@ -276,9 +276,11 @@ class IconRefComponent { } imports: [IgxIconComponent] }) class IconWithThemeTokenComponent { + iconService = inject(IgxIconService); + public themeToken = inject(THEME_TOKEN); - constructor(public iconService: IgxIconService) { + constructor() { this.iconService.setIconRef('expand_more', 'default', { family: 'material', name: 'home' }); } diff --git a/projects/igniteui-angular/src/lib/icon/icon.service.ts b/projects/igniteui-angular/src/lib/icon/icon.service.ts index a3b5dc7b56d..c43218d198c 100644 --- a/projects/igniteui-angular/src/lib/icon/icon.service.ts +++ b/projects/igniteui-angular/src/lib/icon/icon.service.ts @@ -1,4 +1,4 @@ -import { DestroyRef, Inject, Injectable, Optional, SecurityContext, DOCUMENT } from "@angular/core"; +import { DestroyRef, Injectable, SecurityContext, DOCUMENT, inject } from "@angular/core"; import { DomSanitizer, SafeHtml } from "@angular/platform-browser"; import { HttpClient } from "@angular/common/http"; import { Observable, Subject } from "rxjs"; @@ -38,6 +38,13 @@ export interface IgxIconLoadedEvent { providedIn: "root", }) export class IgxIconService { + private _sanitizer = inject(DomSanitizer, { optional: true }); + private _httpClient = inject(HttpClient, { optional: true }); + private _platformUtil = inject(PlatformUtil, { optional: true }); + private _themeToken = inject(THEME_TOKEN, { optional: true }); + private _destroyRef = inject(DestroyRef, { optional: true }); + protected document = inject(DOCUMENT, { optional: true }); + /** * Observable that emits when an icon is successfully loaded * through a HTTP request. @@ -59,14 +66,7 @@ export class IgxIconService { private _iconLoaded = new Subject(); private _domParser: DOMParser; - constructor( - @Optional() private _sanitizer: DomSanitizer, - @Optional() private _httpClient: HttpClient, - @Optional() private _platformUtil: PlatformUtil, - @Optional() @Inject(THEME_TOKEN) private _themeToken: ThemeToken | undefined, - @Optional() @Inject(DestroyRef) private _destroyRef: DestroyRef, - @Optional() @Inject(DOCUMENT) protected document: Document, - ) { + constructor() { this.iconLoaded = this._iconLoaded.asObservable(); this.setFamily(this._defaultFamily.name, this._defaultFamily.meta); diff --git a/projects/igniteui-angular/src/lib/input-group/input-group.component.spec.ts b/projects/igniteui-angular/src/lib/input-group/input-group.component.spec.ts index 4777403e2f6..07ab371674c 100644 --- a/projects/igniteui-angular/src/lib/input-group/input-group.component.spec.ts +++ b/projects/igniteui-angular/src/lib/input-group/input-group.component.spec.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ElementRef, Inject } from '@angular/core'; +import { Component, ViewChild, ElementRef, inject } from '@angular/core'; import { fakeAsync, TestBed, tick, waitForAsync } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; import { IgxInputGroupComponent } from './input-group.component'; @@ -252,13 +252,13 @@ describe('IgxInputGroup', () => { imports: [IgxInputGroupComponent, IgxInputDirective, IgxPrefixDirective, IgxSuffixDirective] }) class InputGroupComponent { + IGTOKEN = inject(IGX_INPUT_GROUP_TYPE); + @ViewChild('igxInputGroup', { static: true }) public igxInputGroup: IgxInputGroupComponent; @ViewChild('igxInput', { read: IgxInputDirective, static: true }) public igxInput: IgxInputDirective; @ViewChild(IgxPrefixDirective, { read: ElementRef }) public prefix: ElementRef; @ViewChild(IgxSuffixDirective, { read: ElementRef }) public suffix: ElementRef; public suppressInputAutofocus = false; - - constructor(@Inject(IGX_INPUT_GROUP_TYPE) public IGTOKEN: IgxInputGroupType) {} } @Component({ diff --git a/projects/igniteui-angular/src/lib/input-group/input-group.component.ts b/projects/igniteui-angular/src/lib/input-group/input-group.component.ts index 93b8a4579cf..12f3cfdb7d3 100644 --- a/projects/igniteui-angular/src/lib/input-group/input-group.component.ts +++ b/projects/igniteui-angular/src/lib/input-group/input-group.component.ts @@ -1,17 +1,5 @@ import { NgTemplateOutlet, NgClass } from '@angular/common'; -import { - ChangeDetectorRef, - Component, - ContentChild, - ContentChildren, - DestroyRef, - ElementRef, - HostBinding, - HostListener, Inject, Input, - Optional, QueryList, booleanAttribute, - inject, - DOCUMENT -} from '@angular/core'; +import { ChangeDetectorRef, Component, ContentChild, ContentChildren, DestroyRef, ElementRef, HostBinding, HostListener, Input, QueryList, booleanAttribute, inject, DOCUMENT } from '@angular/core'; import { IInputResourceStrings, InputResourceStringsEN } from '../core/i18n/input-resources'; import { PlatformUtil, getComponentTheme } from '../core/utils'; import { IgxButtonDirective } from '../directives/button/button.directive'; @@ -36,6 +24,13 @@ import { IgxTheme, THEME_TOKEN, ThemeToken } from '../services/theme/theme.token imports: [NgTemplateOutlet, IgxPrefixDirective, IgxButtonDirective, NgClass, IgxSuffixDirective, IgxIconComponent] }) export class IgxInputGroupComponent implements IgxInputGroupBase { + element = inject>(ElementRef); + private _inputGroupType = inject(IGX_INPUT_GROUP_TYPE, { optional: true }); + private document = inject(DOCUMENT); + private platform = inject(PlatformUtil); + private cdr = inject(ChangeDetectorRef); + private themeToken = inject(THEME_TOKEN); + /** * Sets the resource strings. * By default it uses EN resources. @@ -206,18 +201,7 @@ export class IgxInputGroupComponent implements IgxInputGroupBase { return this._theme; } - constructor( - public element: ElementRef, - @Optional() - @Inject(IGX_INPUT_GROUP_TYPE) - private _inputGroupType: IgxInputGroupType, - @Inject(DOCUMENT) - private document: any, - private platform: PlatformUtil, - private cdr: ChangeDetectorRef, - @Inject(THEME_TOKEN) - private themeToken: ThemeToken - ) { + constructor() { this._theme = this.themeToken.theme; const themeChange = this.themeToken.onChange((theme) => { if (this._theme !== theme) { diff --git a/projects/igniteui-angular/src/lib/list/list-item.component.ts b/projects/igniteui-angular/src/lib/list/list-item.component.ts index ab0bd4e7b07..cb445ce6b94 100644 --- a/projects/igniteui-angular/src/lib/list/list-item.component.ts +++ b/projects/igniteui-angular/src/lib/list/list-item.component.ts @@ -1,14 +1,4 @@ -import { - ChangeDetectionStrategy, - Component, - ElementRef, - HostBinding, - HostListener, - Input, - Renderer2, - ViewChild, - booleanAttribute -} from '@angular/core'; +import { ChangeDetectionStrategy, Component, ElementRef, HostBinding, HostListener, Input, Renderer2, ViewChild, booleanAttribute, inject } from '@angular/core'; import { IgxListPanState, @@ -42,6 +32,10 @@ import { NgTemplateOutlet } from '@angular/common'; imports: [NgTemplateOutlet] }) export class IgxListItemComponent implements IListChild { + list = inject(IgxListBaseDirective); + private elementRef = inject(ElementRef); + private _renderer = inject(Renderer2); + /** * Provides a reference to the template's base element shown when left panning a list item. * ```typescript @@ -258,12 +252,6 @@ export class IgxListItemComponent implements IListChild { return rem(this.element.offsetHeight); } - constructor( - public list: IgxListBaseDirective, - private elementRef: ElementRef, - private _renderer: Renderer2) { - } - /** * Gets/Sets the `role` attribute of the `list item`. * ```typescript diff --git a/projects/igniteui-angular/src/lib/list/list.common.ts b/projects/igniteui-angular/src/lib/list/list.common.ts index 4ca623f5cfe..d85d5ca5a1b 100644 --- a/projects/igniteui-angular/src/lib/list/list.common.ts +++ b/projects/igniteui-angular/src/lib/list/list.common.ts @@ -1,4 +1,4 @@ -import { Directive, TemplateRef, EventEmitter, QueryList, Optional, ElementRef } from '@angular/core'; +import { Directive, TemplateRef, EventEmitter, QueryList, ElementRef, inject } from '@angular/core'; export interface IListChild { index: number; @@ -10,6 +10,8 @@ export interface IListChild { standalone: true }) export class IgxListBaseDirective { + protected el = inject(ElementRef, { optional: true }); + public itemClicked: EventEmitter; public allowLeftPanning: boolean; public allowRightPanning: boolean; @@ -23,8 +25,6 @@ export class IgxListBaseDirective { public children: QueryList; public listItemLeftPanningTemplate: IgxListItemLeftPanningTemplateDirective; public listItemRightPanningTemplate: IgxListItemRightPanningTemplateDirective; - - constructor(@Optional() protected el: ElementRef) {} } export enum IgxListPanState { NONE, LEFT, RIGHT } @@ -34,7 +34,7 @@ export enum IgxListPanState { NONE, LEFT, RIGHT } standalone: true }) export class IgxEmptyListTemplateDirective { - constructor(public template: TemplateRef) { } + template = inject>(TemplateRef); } @Directive({ @@ -42,7 +42,7 @@ export class IgxEmptyListTemplateDirective { standalone: true }) export class IgxDataLoadingTemplateDirective { - constructor(public template: TemplateRef) { } + template = inject>(TemplateRef); } @Directive({ @@ -50,7 +50,7 @@ export class IgxDataLoadingTemplateDirective { standalone: true }) export class IgxListItemLeftPanningTemplateDirective { - constructor(public template: TemplateRef) { } + template = inject>(TemplateRef); } @Directive({ @@ -58,5 +58,5 @@ export class IgxListItemLeftPanningTemplateDirective { standalone: true }) export class IgxListItemRightPanningTemplateDirective { - constructor(public template: TemplateRef) { } + template = inject>(TemplateRef); } diff --git a/projects/igniteui-angular/src/lib/list/list.component.ts b/projects/igniteui-angular/src/lib/list/list.component.ts index 32b4d00b75d..17f4efdec48 100644 --- a/projects/igniteui-angular/src/lib/list/list.component.ts +++ b/projects/igniteui-angular/src/lib/list/list.component.ts @@ -1,20 +1,5 @@ import { NgTemplateOutlet } from '@angular/common'; -import { - Component, - ContentChild, - ContentChildren, - ElementRef, - EventEmitter, - forwardRef, - HostBinding, - Input, - Output, - QueryList, - TemplateRef, - ViewChild, - Directive, - booleanAttribute -} from '@angular/core'; +import { Component, ContentChild, ContentChildren, ElementRef, EventEmitter, forwardRef, HostBinding, Input, Output, QueryList, TemplateRef, ViewChild, Directive, booleanAttribute, inject } from '@angular/core'; @@ -149,6 +134,8 @@ export class IgxListLineSubTitleDirective { imports: [NgTemplateOutlet] }) export class IgxListComponent extends IgxListBaseDirective { + element: ElementRef; + /** * Returns a collection of all items and headers in the list. * @@ -460,8 +447,12 @@ export class IgxListComponent extends IgxListBaseDirective { return this._resourceStrings; } - constructor(public element: ElementRef) { + constructor() { + const element = inject(ElementRef); + super(element); + + this.element = element; } /** diff --git a/projects/igniteui-angular/src/lib/navigation-drawer/navigation-drawer.component.ts b/projects/igniteui-angular/src/lib/navigation-drawer/navigation-drawer.component.ts index f5db2952a52..e6ab01b07d7 100644 --- a/projects/igniteui-angular/src/lib/navigation-drawer/navigation-drawer.component.ts +++ b/projects/igniteui-angular/src/lib/navigation-drawer/navigation-drawer.component.ts @@ -1,22 +1,4 @@ -import { - AfterContentInit, - Component, - ContentChild, - ElementRef, - EventEmitter, - HostBinding, - Inject, - Input, - OnChanges, - OnDestroy, - OnInit, - Optional, - Output, - SimpleChange, - ViewChild, - Renderer2, - booleanAttribute -} from '@angular/core'; +import { AfterContentInit, Component, ContentChild, ElementRef, EventEmitter, HostBinding, Input, OnChanges, OnDestroy, OnInit, Output, SimpleChange, ViewChild, Renderer2, booleanAttribute, inject } from '@angular/core'; import { fromEvent, interval, Subscription } from 'rxjs'; import { debounce } from 'rxjs/operators'; import { IgxNavigationService, IToggleView } from '../core/navigation'; @@ -65,6 +47,12 @@ export class IgxNavigationDrawerComponent implements AfterContentInit, OnDestroy, OnChanges { + private elementRef = inject(ElementRef); + private _state = inject(IgxNavigationService, { optional: true }); + protected renderer = inject(Renderer2); + private _touchManager = inject(HammerGesturesManager); + private platformUtil = inject(PlatformUtil); + /** @hidden @internal */ @HostBinding('class.igx-nav-drawer') @@ -452,14 +440,6 @@ export class IgxNavigationDrawerComponent implements return this._state; } - constructor( - @Inject(ElementRef) private elementRef: ElementRef, - @Optional() private _state: IgxNavigationService, - protected renderer: Renderer2, - private _touchManager: HammerGesturesManager, - private platformUtil: PlatformUtil) { - } - /** * @hidden */ diff --git a/projects/igniteui-angular/src/lib/navigation-drawer/navigation-drawer.directives.ts b/projects/igniteui-angular/src/lib/navigation-drawer/navigation-drawer.directives.ts index cbfd05a8b12..02ef410bd89 100644 --- a/projects/igniteui-angular/src/lib/navigation-drawer/navigation-drawer.directives.ts +++ b/projects/igniteui-angular/src/lib/navigation-drawer/navigation-drawer.directives.ts @@ -1,4 +1,4 @@ -import { Directive, HostBinding, Input, TemplateRef, booleanAttribute } from '@angular/core'; +import { Directive, HostBinding, Input, TemplateRef, booleanAttribute, inject } from '@angular/core'; @Directive({ selector: '[igxDrawerItem]', @@ -88,9 +88,7 @@ export class IgxNavDrawerItemDirective { standalone: true }) export class IgxNavDrawerTemplateDirective { - - constructor(public template: TemplateRef) { - } + template = inject>(TemplateRef); } @Directive({ @@ -98,7 +96,5 @@ export class IgxNavDrawerTemplateDirective { standalone: true }) export class IgxNavDrawerMiniTemplateDirective { - - constructor(public template: TemplateRef) { - } + template = inject>(TemplateRef); } diff --git a/projects/igniteui-angular/src/lib/paginator/paginator-interfaces.ts b/projects/igniteui-angular/src/lib/paginator/paginator-interfaces.ts index ad734144898..c5703f76af4 100644 --- a/projects/igniteui-angular/src/lib/paginator/paginator-interfaces.ts +++ b/projects/igniteui-angular/src/lib/paginator/paginator-interfaces.ts @@ -1,4 +1,4 @@ -import { Directive, TemplateRef } from '@angular/core'; +import { Directive, TemplateRef, inject } from '@angular/core'; import { CancelableEventArgs, IBaseEventArgs } from '../core/utils'; export interface IPageEventArgs extends IBaseEventArgs { @@ -16,6 +16,5 @@ export interface IPageCancellableEventArgs extends CancelableEventArgs { standalone: true }) export class IgxPaginatorDirective { - - constructor(public template: TemplateRef) { } + template = inject>(TemplateRef); } diff --git a/projects/igniteui-angular/src/lib/paginator/paginator.component.ts b/projects/igniteui-angular/src/lib/paginator/paginator.component.ts index 0a702ce25d8..f72350aee8f 100644 --- a/projects/igniteui-angular/src/lib/paginator/paginator.component.ts +++ b/projects/igniteui-angular/src/lib/paginator/paginator.component.ts @@ -1,4 +1,4 @@ -import { ChangeDetectorRef, Component, ContentChild, Directive, ElementRef, EventEmitter, Host, HostBinding, Input, Output, forwardRef } from '@angular/core'; +import { ChangeDetectorRef, Component, ContentChild, Directive, ElementRef, EventEmitter, HostBinding, Input, Output, forwardRef, inject } from '@angular/core'; import { IPageCancellableEventArgs, IPageEventArgs } from './paginator-interfaces'; import { IPaginatorResourceStrings, PaginatorResourceStringsEN } from '../core/i18n/paginator-resources'; import { OverlaySettings } from '../services/overlay/utilities'; @@ -47,6 +47,9 @@ export class IgxPaginatorContentDirective { }) // switch IgxPaginatorToken to extends once density is dropped export class IgxPaginatorComponent implements IgxPaginatorToken { + private elementRef = inject(ElementRef); + private cdr = inject(ChangeDetectorRef); + /** * @hidden @@ -260,8 +263,6 @@ export class IgxPaginatorComponent implements IgxPaginatorToken { return this._resourceStrings; } - constructor(private elementRef: ElementRef, private cdr: ChangeDetectorRef) { } - /** * Returns if the current page is the last page. * ```typescript @@ -359,14 +360,14 @@ export class IgxPaginatorComponent implements IgxPaginatorToken { imports: [IgxSelectComponent, FormsModule, IgxSelectItemComponent] }) export class IgxPageSizeSelectorComponent { + paginator = inject(IgxPaginatorComponent, { host: true }); + /** * @internal * @hidden */ @HostBinding('class.igx-page-size') public cssClass = 'igx-page-size'; - - constructor(@Host() public paginator: IgxPaginatorComponent) { } } @@ -376,6 +377,8 @@ export class IgxPageSizeSelectorComponent { imports: [IgxRippleDirective, IgxIconComponent, IgxIconButtonDirective] }) export class IgxPageNavigationComponent { + paginator = inject(IgxPaginatorComponent, { host: true }); + /** * @internal * @hidden @@ -389,8 +392,4 @@ export class IgxPageNavigationComponent { @HostBinding('attr.role') @Input() public role = 'navigation'; - - constructor( - @Host() - public paginator: IgxPaginatorComponent) { } } diff --git a/projects/igniteui-angular/src/lib/progressbar/progressbar.common.ts b/projects/igniteui-angular/src/lib/progressbar/progressbar.common.ts index 3776d5a9eb9..0112b99f437 100644 --- a/projects/igniteui-angular/src/lib/progressbar/progressbar.common.ts +++ b/projects/igniteui-angular/src/lib/progressbar/progressbar.common.ts @@ -1,11 +1,11 @@ -import { Directive, TemplateRef } from '@angular/core'; +import { Directive, TemplateRef, inject } from '@angular/core'; @Directive({ selector: '[igxProgressBarText]', standalone: true }) export class IgxProgressBarTextTemplateDirective { - constructor(public template: TemplateRef) { } + template = inject>(TemplateRef); } @Directive({ @@ -13,6 +13,6 @@ export class IgxProgressBarTextTemplateDirective { standalone: true }) export class IgxProgressBarGradientDirective { - constructor(public template: TemplateRef) { } + template = inject>(TemplateRef); } diff --git a/projects/igniteui-angular/src/lib/progressbar/progressbar.component.ts b/projects/igniteui-angular/src/lib/progressbar/progressbar.component.ts index c3b0b9361e7..0b28c4b71e3 100644 --- a/projects/igniteui-angular/src/lib/progressbar/progressbar.component.ts +++ b/projects/igniteui-angular/src/lib/progressbar/progressbar.component.ts @@ -520,6 +520,8 @@ export class IgxLinearProgressBarComponent extends BaseProgressDirective impleme imports: [NgTemplateOutlet, NgClass] }) export class IgxCircularProgressBarComponent extends BaseProgressDirective implements AfterContentInit { + private renderer = inject(Renderer2); + /** * @hidden */ @@ -599,10 +601,6 @@ export class IgxCircularProgressBarComponent extends BaseProgressDirective imple return this.text; } - constructor(private renderer: Renderer2) { - super(); - } - /** * Set type of the `IgxCircularProgressBarComponent`. Possible options - `default`, `success`, `info`, `warning`, and `error`. * ```html diff --git a/projects/igniteui-angular/src/lib/query-builder/query-builder-tree.component.ts b/projects/igniteui-angular/src/lib/query-builder/query-builder-tree.component.ts index f456b40dbc7..24ac675255d 100644 --- a/projects/igniteui-angular/src/lib/query-builder/query-builder-tree.component.ts +++ b/projects/igniteui-angular/src/lib/query-builder/query-builder-tree.component.ts @@ -1,12 +1,6 @@ -import { - AfterViewInit, - EventEmitter, - LOCALE_ID, - Output, - TemplateRef -} from '@angular/core'; +import { AfterViewInit, EventEmitter, LOCALE_ID, Output, TemplateRef, inject } from '@angular/core'; import { getLocaleFirstDayOfWeek, NgTemplateOutlet, NgClass, DatePipe } from '@angular/common'; -import { Inject } from '@angular/core'; + import { Component, Input, ViewChild, ChangeDetectorRef, ViewChildren, QueryList, ElementRef, OnDestroy, HostBinding } from '@angular/core'; @@ -105,6 +99,12 @@ const DEFAULT_CHIP_FOCUS_DELAY = 50; ], }) export class IgxQueryBuilderTreeComponent implements AfterViewInit, OnDestroy { + cdr = inject(ChangeDetectorRef); + dragService = inject(IgxQueryBuilderDragService); + protected platform = inject(PlatformUtil); + private elRef = inject(ElementRef); + protected _localeId = inject(LOCALE_ID); + /** * @hidden @internal */ @@ -540,11 +540,9 @@ export class IgxQueryBuilderTreeComponent implements AfterViewInit, OnDestroy { this.selectedField.filters.condition(this.selectedCondition).isNestedQuery)); } - constructor(public cdr: ChangeDetectorRef, - public dragService: IgxQueryBuilderDragService, - protected platform: PlatformUtil, - private elRef: ElementRef, - @Inject(LOCALE_ID) protected _localeId: string) { + constructor() { + const elRef = this.elRef; + this.locale = this.locale || this._localeId; this.dragService.register(this, elRef); } diff --git a/projects/igniteui-angular/src/lib/query-builder/query-builder.component.ts b/projects/igniteui-angular/src/lib/query-builder/query-builder.component.ts index 2f101085378..214c2867c6d 100644 --- a/projects/igniteui-angular/src/lib/query-builder/query-builder.component.ts +++ b/projects/igniteui-angular/src/lib/query-builder/query-builder.component.ts @@ -1,4 +1,4 @@ -import { booleanAttribute, ContentChild, EventEmitter, Output, TemplateRef } from '@angular/core'; +import { booleanAttribute, ContentChild, EventEmitter, Output, TemplateRef, inject } from '@angular/core'; import { Component, Input, ViewChild, ElementRef, OnDestroy, HostBinding } from '@angular/core'; @@ -31,6 +31,8 @@ import { recreateTree } from '../data-operations/expressions-tree-util'; imports: [IgxQueryBuilderTreeComponent] }) export class IgxQueryBuilderComponent implements OnDestroy { + protected iconService = inject(IgxIconService); + /** * @hidden @internal */ @@ -184,7 +186,7 @@ export class IgxQueryBuilderComponent implements OnDestroy { private _entities: EntityType[]; private _shouldEmitTreeChange = true; - constructor(protected iconService: IgxIconService) { + constructor() { this.registerSVGIcons(); } diff --git a/projects/igniteui-angular/src/lib/query-builder/query-builder.directives.ts b/projects/igniteui-angular/src/lib/query-builder/query-builder.directives.ts index c2cf0ea7ce9..ecee68e6e72 100644 --- a/projects/igniteui-angular/src/lib/query-builder/query-builder.directives.ts +++ b/projects/igniteui-angular/src/lib/query-builder/query-builder.directives.ts @@ -1,4 +1,4 @@ -import { Directive, TemplateRef } from '@angular/core'; +import { Directive, TemplateRef, inject } from '@angular/core'; /** * Defines the custom template that will be used for the search value input of condition in edit mode @@ -19,5 +19,5 @@ import { Directive, TemplateRef } from '@angular/core'; standalone: true }) export class IgxQueryBuilderSearchValueTemplateDirective { - constructor(public template: TemplateRef) { } + template = inject>(TemplateRef); } diff --git a/projects/igniteui-angular/src/lib/radio/radio.component.spec.ts b/projects/igniteui-angular/src/lib/radio/radio.component.spec.ts index d341eb73794..cd8447ce251 100644 --- a/projects/igniteui-angular/src/lib/radio/radio.component.spec.ts +++ b/projects/igniteui-angular/src/lib/radio/radio.component.spec.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ViewChildren } from '@angular/core'; +import { Component, ViewChild, ViewChildren, inject } from '@angular/core'; import { fakeAsync, TestBed, tick, waitForAsync } from '@angular/core/testing'; import { FormsModule, NgForm, ReactiveFormsModule, UntypedFormBuilder, Validators } from '@angular/forms'; import { By } from '@angular/platform-browser'; @@ -366,6 +366,8 @@ class RadioFormComponent { imports: [ReactiveFormsModule, IgxRadioComponent] }) class ReactiveFormComponent { + private fb = inject(UntypedFormBuilder); + @ViewChild('radio', { read: IgxRadioComponent, static: true }) public radio: IgxRadioComponent; @@ -373,8 +375,6 @@ class ReactiveFormComponent { radio: ['', Validators.required], }); - constructor(private fb: UntypedFormBuilder) { } - public markAsTouched() { if (!this.reactiveForm.valid) { for (const key in this.reactiveForm.controls) { diff --git a/projects/igniteui-angular/src/lib/select/select.component.spec.ts b/projects/igniteui-angular/src/lib/select/select.component.spec.ts index 76a525181e9..9922750a38d 100644 --- a/projects/igniteui-angular/src/lib/select/select.component.spec.ts +++ b/projects/igniteui-angular/src/lib/select/select.component.spec.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, DebugElement, OnInit, ElementRef } from '@angular/core'; +import { Component, ViewChild, DebugElement, OnInit, ElementRef, inject } from '@angular/core'; import { NgStyle } from '@angular/common'; import { TestBed, tick, fakeAsync, waitForAsync, discardPeriodicTasks } from '@angular/core/testing'; import { FormsModule, UntypedFormGroup, UntypedFormBuilder, UntypedFormControl, Validators, ReactiveFormsModule, NgForm, NgControl } from '@angular/forms'; @@ -2944,7 +2944,9 @@ class IgxSelectReactiveFormComponent { optionsSelect: [Validators.required] }; - constructor(fb: UntypedFormBuilder) { + constructor() { + const fb = inject(UntypedFormBuilder); + this.reactiveForm = fb.group({ firstName: new UntypedFormControl('', Validators.required), password: ['', Validators.required], diff --git a/projects/igniteui-angular/src/lib/select/select.component.ts b/projects/igniteui-angular/src/lib/select/select.component.ts index c9307d29884..d4b7b34ca32 100644 --- a/projects/igniteui-angular/src/lib/select/select.component.ts +++ b/projects/igniteui-angular/src/lib/select/select.component.ts @@ -1,30 +1,4 @@ -import { - AfterContentChecked, - AfterContentInit, - AfterViewInit, - booleanAttribute, - ChangeDetectorRef, - Component, - ContentChild, - ContentChildren, - Directive, - ElementRef, - EventEmitter, - forwardRef, - HostBinding, - Inject, - Injector, - Input, - OnDestroy, - OnInit, - Optional, - Output, - QueryList, - TemplateRef, - ViewChild, - DOCUMENT, - ViewChildren -} from '@angular/core'; +import { AfterContentChecked, AfterContentInit, AfterViewInit, booleanAttribute, ChangeDetectorRef, Component, ContentChild, ContentChildren, Directive, ElementRef, EventEmitter, forwardRef, HostBinding, Injector, Input, OnDestroy, OnInit, Output, QueryList, TemplateRef, ViewChild, DOCUMENT, ViewChildren, inject } from '@angular/core'; import { NgTemplateOutlet } from '@angular/common'; import { AbstractControl, ControlValueAccessor, NgControl, NG_VALUE_ACCESSOR } from '@angular/forms'; import { noop } from 'rxjs'; @@ -107,6 +81,10 @@ export class IgxSelectFooterDirective { }) export class IgxSelectComponent extends IgxDropDownComponent implements IgxSelectBase, ControlValueAccessor, AfterContentInit, OnInit, AfterViewInit, OnDestroy, EditorProvider, AfterContentChecked { + protected overlayService = inject(IgxOverlayService); + private _inputGroupType = inject(IGX_INPUT_GROUP_TYPE, { optional: true }); + private _injector = inject(Injector); + /** @hidden @internal */ @ViewChild('inputGroup', { read: IgxInputGroupComponent, static: true }) public inputGroup: IgxInputGroupComponent; @@ -342,15 +320,12 @@ export class IgxSelectComponent extends IgxDropDownComponent implements IgxSelec private _onChangeCallback: (_: any) => void = noop; private _onTouchedCallback: () => void = noop; - constructor( - elementRef: ElementRef, - cdr: ChangeDetectorRef, - @Inject(DOCUMENT) document: any, - selection: IgxSelectionAPIService, - @Inject(IgxOverlayService) protected overlayService: IgxOverlayService, - @Optional() @Inject(IGX_INPUT_GROUP_TYPE) private _inputGroupType: IgxInputGroupType, - private _injector: Injector, - ) { + constructor() { + const elementRef = inject(ElementRef); + const cdr = inject(ChangeDetectorRef); + const document = inject(DOCUMENT); + const selection = inject(IgxSelectionAPIService); + super(elementRef, cdr, document, selection); } diff --git a/projects/igniteui-angular/src/lib/services/animation/angular-animation-service.ts b/projects/igniteui-angular/src/lib/services/animation/angular-animation-service.ts index 232a5004bc0..042a9609965 100644 --- a/projects/igniteui-angular/src/lib/services/animation/angular-animation-service.ts +++ b/projects/igniteui-angular/src/lib/services/animation/angular-animation-service.ts @@ -1,11 +1,12 @@ import { AnimationBuilder, AnimationReferenceMetadata } from '@angular/animations'; -import { Injectable } from '@angular/core'; +import { Injectable, inject } from '@angular/core'; import { IgxAngularAnimationPlayer } from './angular-animation-player'; import { AnimationService, AnimationPlayer } from './animation'; @Injectable({providedIn: 'root'}) export class IgxAngularAnimationService implements AnimationService { - constructor(private builder: AnimationBuilder) { } + private builder = inject(AnimationBuilder); + public buildAnimation(animationMetaData: AnimationReferenceMetadata, element: HTMLElement): AnimationPlayer { if (!animationMetaData) { return null; diff --git a/projects/igniteui-angular/src/lib/services/direction/directionality.spec.ts b/projects/igniteui-angular/src/lib/services/direction/directionality.spec.ts index 79c7c67969a..e84bbc41f9d 100644 --- a/projects/igniteui-angular/src/lib/services/direction/directionality.spec.ts +++ b/projects/igniteui-angular/src/lib/services/direction/directionality.spec.ts @@ -1,5 +1,5 @@ import { TestBed, inject, waitForAsync } from '@angular/core/testing'; -import { Component, DOCUMENT } from '@angular/core'; +import { Component, DOCUMENT, inject as inject_1 } from '@angular/core'; import { IgxDirectionality, DIR_DOCUMENT } from './directionality'; interface FakeDoc { @@ -84,5 +84,5 @@ describe('IgxDirectionality', () => { standalone: true }) class InjectsIgxDirectionalityComponent { - constructor(public dir: IgxDirectionality) { } + dir = inject_1(IgxDirectionality); } diff --git a/projects/igniteui-angular/src/lib/services/direction/directionality.ts b/projects/igniteui-angular/src/lib/services/direction/directionality.ts index 2f2edef9155..80db3d73617 100644 --- a/projects/igniteui-angular/src/lib/services/direction/directionality.ts +++ b/projects/igniteui-angular/src/lib/services/direction/directionality.ts @@ -1,4 +1,4 @@ -import { Injectable, Inject, InjectionToken, inject, DOCUMENT } from '@angular/core'; +import { Injectable, InjectionToken, inject, DOCUMENT } from '@angular/core'; /** * @hidden @@ -53,7 +53,9 @@ export class IgxDirectionality { return this._dir === 'rtl'; } - constructor(@Inject(DIR_DOCUMENT) document) { + constructor() { + const document = inject(DIR_DOCUMENT); + this._document = document; const bodyDir = this._document.body ? this._document.body.dir : null; const htmlDir = this._document.documentElement ? this._document.documentElement.dir : null; diff --git a/projects/igniteui-angular/src/lib/services/overlay/overlay.spec.ts b/projects/igniteui-angular/src/lib/services/overlay/overlay.spec.ts index 828f8f7f9d2..24cacbea30e 100644 --- a/projects/igniteui-angular/src/lib/services/overlay/overlay.spec.ts +++ b/projects/igniteui-angular/src/lib/services/overlay/overlay.spec.ts @@ -1,14 +1,4 @@ -import { - Component, - ComponentRef, - ElementRef, - HostBinding, - Inject, - Injector, - ViewChild, - ViewContainerRef, - ViewEncapsulation -} from '@angular/core'; +import { Component, ComponentRef, ElementRef, HostBinding, Injector, ViewChild, ViewContainerRef, ViewEncapsulation, inject } from '@angular/core'; import { fakeAsync, TestBed, tick, waitForAsync } from '@angular/core/testing'; import { NoopAnimationsModule } from '@angular/platform-browser/animations'; import { first } from 'rxjs/operators'; @@ -4519,10 +4509,10 @@ export class SimpleDynamicComponent { standalone: true }) export class SimpleRefComponent { + overlay = inject(IgxOverlayService); + @ViewChild('item', { static: true }) public item: ElementRef; - - constructor(@Inject(IgxOverlayService) public overlay: IgxOverlayService) { } } @Component({ @@ -4597,14 +4587,13 @@ export class SimpleDynamicWithDirectiveComponent { standalone: true }) export class EmptyPageComponent { + overlay = inject(IgxOverlayService); + viewContainerRef = inject(ViewContainerRef); + injector = inject(Injector); + @ViewChild('button', { static: true }) public buttonElement: ElementRef; @ViewChild('div', { static: true }) public divElement: ElementRef; - constructor( - @Inject(IgxOverlayService) public overlay: IgxOverlayService, - public viewContainerRef: ViewContainerRef, - public injector: Injector) { } - public click() { this.overlay.show(this.overlay.attach(SimpleDynamicComponent)); } @@ -4619,10 +4608,10 @@ export class EmptyPageComponent { standalone: true }) export class EmptyPageInShadowDomComponent { + overlay = inject(IgxOverlayService); + @ViewChild('button', { static: true }) public buttonElement: ElementRef; @ViewChild('outlet', { static: true }) public outletElement: ElementRef; - - constructor(@Inject(IgxOverlayService) public overlay: IgxOverlayService) { } } @Component({ @@ -4640,6 +4629,8 @@ export class EmptyPageInShadowDomComponent { standalone: true }) export class DownRightButtonComponent { + overlay = inject(IgxOverlayService); + @ViewChild('button', { static: true }) public buttonElement: ElementRef; public positionStrategy: IPositionStrategy; @@ -4653,8 +4644,6 @@ export class DownRightButtonComponent { public target: Point | HTMLElement = null; - constructor(@Inject(IgxOverlayService) public overlay: IgxOverlayService) { } - public click() { this.positionStrategy.settings = this.ButtonPositioningSettings; this.overlay.show(this.overlay.attach(SimpleDynamicComponent, { @@ -4680,10 +4669,10 @@ export class DownRightButtonComponent { standalone: true }) export class TopLeftOffsetComponent { + overlay = inject(IgxOverlayService); - @ViewChild('button', { static: true }) public buttonElement: ElementRef; - constructor(@Inject(IgxOverlayService) public overlay: IgxOverlayService) { } + @ViewChild('button', { static: true }) public buttonElement: ElementRef; public click() { this.overlay.show(this.overlay.attach(SimpleDynamicComponent)); @@ -4701,9 +4690,9 @@ export class TopLeftOffsetComponent { standalone: true }) export class TwoButtonsComponent { - public settings: OverlaySettings = { modal: false }; + overlay = inject(IgxOverlayService); - constructor(@Inject(IgxOverlayService) public overlay: IgxOverlayService) { } + public settings: OverlaySettings = { modal: false }; public clickOne() { this.overlay.show(this.overlay.attach(SimpleDynamicComponent), this.settings); @@ -4737,16 +4726,14 @@ export class TwoButtonsComponent { standalone: true }) export class WidthTestOverlayComponent { + overlay = inject(IgxOverlayService); + elementRef = inject(ElementRef); + @ViewChild('button', { static: true }) public buttonElement: ElementRef; @ViewChild('myCustomComponent', { static: true }) public customComponent: ElementRef; public overlaySettings: OverlaySettings = {}; - constructor( - @Inject(IgxOverlayService) public overlay: IgxOverlayService, - @Inject(ElementRef) public elementRef: ElementRef - ) { } - public click(_event: any) { this.overlaySettings.positionStrategy = new ConnectedPositioningStrategy(); this.overlaySettings.scrollStrategy = new NoOpScrollStrategy(); @@ -4810,11 +4797,11 @@ export class ScrollableComponent { standalone: true }) export class FlexContainerComponent { + overlay = inject(IgxOverlayService); + @ViewChild('button', { static: true }) public buttonElement: ElementRef; public overlaySettings: OverlaySettings = {}; - constructor(@Inject(IgxOverlayService) public overlay: IgxOverlayService) { } - public click() { this.overlay.show(this.overlay.attach(SimpleDynamicComponent), this.overlaySettings); } diff --git a/projects/igniteui-angular/src/lib/services/overlay/overlay.ts b/projects/igniteui-angular/src/lib/services/overlay/overlay.ts index 5cfccdf58e7..dadb363414f 100644 --- a/projects/igniteui-angular/src/lib/services/overlay/overlay.ts +++ b/projects/igniteui-angular/src/lib/services/overlay/overlay.ts @@ -1,19 +1,5 @@ import { AnimationReferenceMetadata } from '@angular/animations'; -import { - ApplicationRef, - ComponentRef, - createComponent, - ElementRef, - EventEmitter, - Inject, - Injectable, - Injector, - NgZone, - OnDestroy, - Type, - ViewContainerRef, - DOCUMENT -} from '@angular/core'; +import { ApplicationRef, ComponentRef, createComponent, ElementRef, EventEmitter, Injectable, Injector, NgZone, OnDestroy, Type, ViewContainerRef, DOCUMENT, inject } from '@angular/core'; import { fromEvent, Subject, Subscription } from 'rxjs'; import { filter, takeUntil } from 'rxjs/operators'; @@ -53,6 +39,12 @@ import { */ @Injectable({ providedIn: 'root' }) export class IgxOverlayService implements OnDestroy { + private _appRef = inject(ApplicationRef); + private document = inject(DOCUMENT); + private _zone = inject(NgZone); + protected platformUtil = inject(PlatformUtil); + private animationService = inject(IgxAngularAnimationService); + /** * Emitted just before the overlay content starts to open. * ```typescript @@ -141,12 +133,7 @@ export class IgxOverlayService implements OnDestroy { closeOnEscape: false }; - constructor( - private _appRef: ApplicationRef, - @Inject(DOCUMENT) private document: any, - private _zone: NgZone, - protected platformUtil: PlatformUtil, - @Inject(IgxAngularAnimationService) private animationService: AnimationService) { + constructor() { this._document = this.document; } diff --git a/projects/igniteui-angular/src/lib/simple-combo/simple-combo.component.spec.ts b/projects/igniteui-angular/src/lib/simple-combo/simple-combo.component.spec.ts index d14691194bb..14d87b6c94f 100644 --- a/projects/igniteui-angular/src/lib/simple-combo/simple-combo.component.spec.ts +++ b/projects/igniteui-angular/src/lib/simple-combo/simple-combo.component.spec.ts @@ -1,5 +1,5 @@ import { AsyncPipe } from '@angular/common'; -import { AfterViewInit, ChangeDetectorRef, Component, DebugElement, OnDestroy, OnInit, ViewChild } from '@angular/core'; +import { AfterViewInit, ChangeDetectorRef, Component, DebugElement, OnDestroy, OnInit, ViewChild, inject } from '@angular/core'; import { ComponentFixture, fakeAsync, TestBed, tick, waitForAsync } from '@angular/core/testing'; import { FormControl, FormGroup, FormsModule, NgForm, ReactiveFormsModule, UntypedFormBuilder, UntypedFormControl, UntypedFormGroup, Validators } from '@angular/forms'; import { By } from '@angular/platform-browser'; @@ -3109,10 +3109,12 @@ class IgxComboInContainerTestComponent { imports: [IgxSimpleComboComponent, AsyncPipe] }) export class IgxComboRemoteDataComponent implements OnInit, AfterViewInit, OnDestroy { + private remoteDataService = inject(RemoteDataService); + cdr = inject(ChangeDetectorRef); + @ViewChild('combo', { read: IgxSimpleComboComponent, static: true }) public instance: IgxSimpleComboComponent; public data; - constructor(private remoteDataService: RemoteDataService, public cdr: ChangeDetectorRef) { } public ngOnInit(): void { this.data = this.remoteDataService.records; } @@ -3200,6 +3202,9 @@ class IgxSimpleComboInTemplatedFormComponent { imports: [IgxSimpleComboComponent, AsyncPipe, ReactiveFormsModule] }) export class IgxComboRemoteDataInReactiveFormComponent implements OnInit, AfterViewInit, OnDestroy { + private remoteDataService = inject(RemoteDataService); + cdr = inject(ChangeDetectorRef); + @ViewChild('reactiveCombo', { read: IgxSimpleComboComponent, static: true }) public reactiveCombo: IgxSimpleComboComponent; @ViewChild('button', { read: HTMLButtonElement, static: true }) @@ -3208,7 +3213,9 @@ export class IgxComboRemoteDataInReactiveFormComponent implements OnInit, AfterV public reactiveForm: NgForm; public comboForm: UntypedFormGroup; public data; - constructor(private remoteDataService: RemoteDataService, public cdr: ChangeDetectorRef, fb: UntypedFormBuilder) { + constructor() { + const fb = inject(UntypedFormBuilder); + this.comboForm = fb.group({ comboValue: new UntypedFormControl('', Validators.required), }); @@ -3257,7 +3264,9 @@ export class IgxSimpleComboInReactiveFormComponent { public comboForm: UntypedFormGroup; public comboData: any; - constructor(fb: UntypedFormBuilder) { + constructor() { + const fb = inject(UntypedFormBuilder); + this.comboForm = fb.group({ comboValue: new UntypedFormControl('', Validators.required), }); @@ -3278,11 +3287,11 @@ export class IgxSimpleComboInReactiveFormComponent { imports: [IgxSimpleComboComponent, FormsModule] }) export class IgxSimpleComboBindingDataAfterInitComponent implements AfterViewInit { + private cdr = inject(ChangeDetectorRef); + public items: any[]; public selectedItem = 1; - constructor(private cdr: ChangeDetectorRef) { } - public ngAfterViewInit() { requestAnimationFrame(() => { this.items = [{ text: 'One', id: 1 }, { text: 'Two', id: 2 }, { text: 'Three', id: 3 }, diff --git a/projects/igniteui-angular/src/lib/simple-combo/simple-combo.component.ts b/projects/igniteui-angular/src/lib/simple-combo/simple-combo.component.ts index 4eb2ac7f052..e40820c2892 100644 --- a/projects/igniteui-angular/src/lib/simple-combo/simple-combo.component.ts +++ b/projects/igniteui-angular/src/lib/simple-combo/simple-combo.component.ts @@ -1,8 +1,5 @@ import { NgTemplateOutlet } from '@angular/common'; -import { - AfterViewInit, ChangeDetectorRef, Component, DoCheck, ElementRef, EventEmitter, HostListener, Inject, Injector, - Optional, Output, ViewChild, DOCUMENT -} from '@angular/core'; +import { AfterViewInit, ChangeDetectorRef, Component, DoCheck, ElementRef, EventEmitter, HostListener, Injector, Output, ViewChild, DOCUMENT, inject } from '@angular/core'; import { ControlValueAccessor, FormGroupDirective, NG_VALUE_ACCESSOR } from '@angular/forms'; import { takeUntil } from 'rxjs/operators'; @@ -70,6 +67,9 @@ export interface ISimpleComboSelectionChangingEventArgs extends CancelableEventA imports: [IgxInputGroupComponent, IgxInputDirective, IgxTextSelectionDirective, IgxSuffixDirective, NgTemplateOutlet, IgxIconComponent, IgxComboDropDownComponent, IgxDropDownItemNavigationDirective, IgxForOfDirective, IgxComboItemComponent, IgxComboAddItemComponent, IgxButtonDirective, IgxRippleDirective, IgxComboFilteringPipe, IgxComboGroupingPipe] }) export class IgxSimpleComboComponent extends IgxComboBaseDirective implements ControlValueAccessor, AfterViewInit, DoCheck { + private platformUtil = inject(PlatformUtil); + private formGroupDirective = inject(FormGroupDirective, { optional: true }); + /** @hidden @internal */ @ViewChild(IgxComboDropDownComponent, { static: true }) public dropdown: IgxComboDropDownComponent; @@ -140,17 +140,16 @@ export class IgxSimpleComboComponent extends IgxComboBaseDirective implements Co return !!this.selectionService.get(this.id).size; } - constructor(elementRef: ElementRef, - cdr: ChangeDetectorRef, - selectionService: IgxSelectionAPIService, - comboAPI: IgxComboAPIService, - private platformUtil: PlatformUtil, - @Inject(DOCUMENT) document: any, - @Optional() @Inject(IGX_INPUT_GROUP_TYPE) _inputGroupType: IgxInputGroupType, - @Optional() _injector: Injector, - @Optional() @Inject(IgxIconService) _iconService?: IgxIconService, - @Optional() private formGroupDirective?: FormGroupDirective - ) { + constructor() { + const elementRef = inject(ElementRef); + const cdr = inject(ChangeDetectorRef); + const selectionService = inject(IgxSelectionAPIService); + const comboAPI = inject(IgxComboAPIService); + const document = inject(DOCUMENT); + const _inputGroupType = inject(IGX_INPUT_GROUP_TYPE, { optional: true }); + const _injector = inject(Injector, { optional: true }); + const _iconService = inject(IgxIconService, { optional: true }); + super( elementRef, cdr, diff --git a/projects/igniteui-angular/src/lib/slider/label/thumb-label.component.ts b/projects/igniteui-angular/src/lib/slider/label/thumb-label.component.ts index 8a9c860dd07..10ac41aebfc 100644 --- a/projects/igniteui-angular/src/lib/slider/label/thumb-label.component.ts +++ b/projects/igniteui-angular/src/lib/slider/label/thumb-label.component.ts @@ -1,4 +1,4 @@ -import { Component, Input, TemplateRef, HostBinding, ElementRef, booleanAttribute } from '@angular/core'; +import { Component, Input, TemplateRef, HostBinding, ElementRef, booleanAttribute, inject } from '@angular/core'; import { SliderHandle } from '../slider.common'; import { IgxSliderThumbComponent } from '../thumb/thumb-slider.component'; import { NgClass, NgTemplateOutlet } from '@angular/common'; @@ -12,6 +12,8 @@ import { NgClass, NgTemplateOutlet } from '@angular/common'; imports: [NgClass, NgTemplateOutlet] }) export class IgxThumbLabelComponent { + private _elementRef = inject(ElementRef); + @Input() public value: any; @@ -73,8 +75,6 @@ export class IgxThumbLabelComponent { private _active: boolean; - constructor(private _elementRef: ElementRef) { } - public get nativeElement() { return this._elementRef.nativeElement; } diff --git a/projects/igniteui-angular/src/lib/slider/slider.component.spec.ts b/projects/igniteui-angular/src/lib/slider/slider.component.spec.ts index 5442a15076f..031ab958d97 100644 --- a/projects/igniteui-angular/src/lib/slider/slider.component.spec.ts +++ b/projects/igniteui-angular/src/lib/slider/slider.component.spec.ts @@ -1,4 +1,4 @@ -import { Component, Input, ViewChild } from '@angular/core'; +import { Component, Input, ViewChild, inject } from '@angular/core'; import { ComponentFixture, fakeAsync, TestBed, tick, waitForAsync } from '@angular/core/testing'; import { FormsModule, ReactiveFormsModule, UntypedFormControl } from '@angular/forms'; import { By, HammerModule } from '@angular/platform-browser'; @@ -2066,6 +2066,8 @@ describe('IgxSlider', () => { imports: [IgxSliderComponent] }) export class SliderRtlComponent { + dir = inject(IgxDirectionality); + @ViewChild(IgxSliderComponent) public slider: IgxSliderComponent; @@ -2075,8 +2077,6 @@ export class SliderRtlComponent { }; public type: IgxSliderType = IgxSliderType.RANGE; - - constructor(public dir: IgxDirectionality) { } } @Component({ diff --git a/projects/igniteui-angular/src/lib/slider/slider.component.ts b/projects/igniteui-angular/src/lib/slider/slider.component.ts index 586247fe4ce..984abd3ecab 100644 --- a/projects/igniteui-angular/src/lib/slider/slider.component.ts +++ b/projects/igniteui-angular/src/lib/slider/slider.component.ts @@ -1,7 +1,4 @@ -import { - AfterContentInit, AfterViewInit, ChangeDetectorRef, Component, ContentChild, ElementRef, EventEmitter, - HostBinding, HostListener, Input, NgZone, OnChanges, OnDestroy, OnInit, Output, QueryList, Renderer2, SimpleChanges, TemplateRef, ViewChild, ViewChildren, booleanAttribute -} from '@angular/core'; +import { AfterContentInit, AfterViewInit, ChangeDetectorRef, Component, ContentChild, ElementRef, EventEmitter, HostBinding, HostListener, Input, NgZone, OnChanges, OnDestroy, OnInit, Output, QueryList, Renderer2, SimpleChanges, TemplateRef, ViewChild, ViewChildren, booleanAttribute, inject } from '@angular/core'; import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms'; import { animationFrameScheduler, fromEvent, interval, merge, noop, Observable, Subject, timer } from 'rxjs'; import { takeUntil, throttle, throttleTime } from 'rxjs/operators'; @@ -48,6 +45,12 @@ export class IgxSliderComponent implements AfterContentInit, OnChanges, OnDestroy { + private renderer = inject(Renderer2); + private _el = inject(ElementRef); + private _cdr = inject(ChangeDetectorRef); + private _ngZone = inject(NgZone); + private _dir = inject(IgxDirectionality); + /** * @hidden */ @@ -754,11 +757,7 @@ export class IgxSliderComponent implements private _onChangeCallback: (_: any) => void = noop; private _onTouchedCallback: () => void = noop; - constructor(private renderer: Renderer2, - private _el: ElementRef, - private _cdr: ChangeDetectorRef, - private _ngZone: NgZone, - private _dir: IgxDirectionality) { + constructor() { this.stepDistance = this._step; } diff --git a/projects/igniteui-angular/src/lib/slider/thumb/thumb-slider.component.ts b/projects/igniteui-angular/src/lib/slider/thumb/thumb-slider.component.ts index b558401e759..f7fbe7bbdc4 100644 --- a/projects/igniteui-angular/src/lib/slider/thumb/thumb-slider.component.ts +++ b/projects/igniteui-angular/src/lib/slider/thumb/thumb-slider.component.ts @@ -1,16 +1,4 @@ -import { - Component, - Input, - HostListener, - ElementRef, - HostBinding, - Output, - EventEmitter, - OnInit, - OnDestroy, - TemplateRef, - booleanAttribute -} from '@angular/core'; +import { Component, Input, HostListener, ElementRef, HostBinding, Output, EventEmitter, OnInit, OnDestroy, TemplateRef, booleanAttribute, inject } from '@angular/core'; import { takeUntil } from 'rxjs/operators'; import { SliderHandle } from '../slider.common'; import { Subject } from 'rxjs'; @@ -26,6 +14,9 @@ import { NgClass } from '@angular/common'; imports: [NgClass] }) export class IgxSliderThumbComponent implements OnInit, OnDestroy { + private _elementRef = inject(ElementRef); + private _dir = inject(IgxDirectionality); + @Input() public value: any; @@ -195,8 +186,6 @@ export class IgxSliderThumbComponent implements OnInit, OnDestroy { return thumbBounderies.left + thumbCenter; } - constructor(private _elementRef: ElementRef, private _dir: IgxDirectionality) { } - @HostListener('pointerenter') public onPointerEnter() { this.focused = false; diff --git a/projects/igniteui-angular/src/lib/splitter/splitter-pane/splitter-pane.component.ts b/projects/igniteui-angular/src/lib/splitter/splitter-pane/splitter-pane.component.ts index eb8802bac6a..380065de59e 100644 --- a/projects/igniteui-angular/src/lib/splitter/splitter-pane/splitter-pane.component.ts +++ b/projects/igniteui-angular/src/lib/splitter/splitter-pane/splitter-pane.component.ts @@ -1,4 +1,4 @@ -import { Component, HostBinding, Input, ElementRef, Output, EventEmitter, booleanAttribute, signal } from '@angular/core'; +import { Component, HostBinding, Input, ElementRef, Output, EventEmitter, booleanAttribute, signal, inject } from '@angular/core'; /** * Represents individual resizable/collapsible panes. @@ -20,6 +20,8 @@ import { Component, HostBinding, Input, ElementRef, Output, EventEmitter, boolea standalone: true }) export class IgxSplitterPaneComponent { + private el = inject(ElementRef); + private _minSize: string; private _maxSize: string; private _order = signal(null); @@ -231,9 +233,6 @@ export class IgxSplitterPaneComponent { private _dragSize; private _collapsed = false; - - constructor(private el: ElementRef) { } - /** * Toggles the collapsed state of the pane. * diff --git a/projects/igniteui-angular/src/lib/splitter/splitter.component.ts b/projects/igniteui-angular/src/lib/splitter/splitter.component.ts index 6ca08559410..7f8edd1a459 100644 --- a/projects/igniteui-angular/src/lib/splitter/splitter.component.ts +++ b/projects/igniteui-angular/src/lib/splitter/splitter.component.ts @@ -1,4 +1,4 @@ -import { AfterContentInit, Component, ContentChildren, ElementRef, EventEmitter, HostBinding, HostListener, Inject, Input, NgZone, Output, QueryList, booleanAttribute, forwardRef, DOCUMENT } from '@angular/core'; +import { AfterContentInit, Component, ContentChildren, ElementRef, EventEmitter, HostBinding, HostListener, Input, NgZone, Output, QueryList, booleanAttribute, forwardRef, DOCUMENT, inject } from '@angular/core'; import { DragDirection, IDragMoveEventArgs, IDragStartEventArgs, IgxDragDirective, IgxDragIgnoreDirective } from '../directives/drag-drop/drag-drop.directive'; import { IgxSplitterPaneComponent } from './splitter-pane/splitter-pane.component'; import { take } from 'rxjs'; @@ -48,6 +48,10 @@ export declare interface ISplitterBarResizeEventArgs { imports: [forwardRef(() => IgxSplitBarComponent)] }) export class IgxSplitterComponent implements AfterContentInit { + document = inject(DOCUMENT); + private elementRef = inject(ElementRef); + private zone = inject(NgZone); + /** * Gets the list of splitter panes. * @@ -154,8 +158,6 @@ export class IgxSplitterComponent implements AfterContentInit { * The sibling pane in each pair of panes divided by a splitter bar. */ private sibling!: IgxSplitterPaneComponent; - - constructor(@Inject(DOCUMENT) public document, private elementRef: ElementRef, private zone: NgZone) { } /** * Gets/Sets the splitter orientation. * diff --git a/projects/igniteui-angular/src/lib/stepper/step/step.component.ts b/projects/igniteui-angular/src/lib/stepper/step/step.component.ts index dc439b3f026..2cdaf94626f 100644 --- a/projects/igniteui-angular/src/lib/stepper/step/step.component.ts +++ b/projects/igniteui-angular/src/lib/stepper/step/step.component.ts @@ -1,22 +1,4 @@ -import { - AfterViewInit, - booleanAttribute, - ChangeDetectorRef, - Component, - ContentChild, - ElementRef, - EventEmitter, - forwardRef, - HostBinding, - HostListener, - Inject, - Input, - OnDestroy, - Output, - Renderer2, - TemplateRef, - ViewChild -} from '@angular/core'; +import { AfterViewInit, booleanAttribute, ChangeDetectorRef, Component, ContentChild, ElementRef, EventEmitter, forwardRef, HostBinding, HostListener, Input, OnDestroy, Output, Renderer2, TemplateRef, ViewChild, inject } from '@angular/core'; import { takeUntil } from 'rxjs/operators'; import { Direction, IgxSlideComponentBase } from '../../carousel/carousel-base'; import { PlatformUtil } from '../../core/utils'; @@ -60,6 +42,14 @@ let NEXT_ID = 0; imports: [NgClass, IgxRippleDirective, NgTemplateOutlet] }) export class IgxStepComponent extends ToggleAnimationPlayer implements IgxStep, AfterViewInit, OnDestroy, IgxSlideComponentBase { + stepper = inject(IGX_STEPPER_COMPONENT); + cdr = inject(ChangeDetectorRef); + renderer = inject(Renderer2); + protected platform = inject(PlatformUtil); + protected stepperService = inject(IgxStepperService); + private element = inject>(ElementRef); + private dir = inject(IgxDirectionality); + /** * Get/Set the `id` of the step component. @@ -383,16 +373,9 @@ export class IgxStepComponent extends ToggleAnimationPlayer implements IgxStep, private _focused = false; private _disabled = false; - constructor( - @Inject(IGX_STEPPER_COMPONENT) public stepper: IgxStepper, - public cdr: ChangeDetectorRef, - public renderer: Renderer2, - protected platform: PlatformUtil, - protected stepperService: IgxStepperService, - @Inject(IgxAngularAnimationService) animationService: AnimationService, - private element: ElementRef, - private dir: IgxDirectionality - ) { + constructor() { + const animationService = inject(IgxAngularAnimationService); + super(animationService); } diff --git a/projects/igniteui-angular/src/lib/stepper/stepper.component.ts b/projects/igniteui-angular/src/lib/stepper/stepper.component.ts index e2801515b46..5556bc092bf 100644 --- a/projects/igniteui-angular/src/lib/stepper/stepper.component.ts +++ b/projects/igniteui-angular/src/lib/stepper/stepper.component.ts @@ -1,10 +1,6 @@ import { AnimationReferenceMetadata, useAnimation } from '@angular/animations'; import { NgTemplateOutlet } from '@angular/common'; -import { - AfterContentInit, ChangeDetectorRef, Component, ContentChild, ContentChildren, - ElementRef, EventEmitter, HostBinding, Inject, Input, OnChanges, OnDestroy, - OnInit, Output, QueryList, SimpleChanges, TemplateRef, booleanAttribute -} from '@angular/core'; +import { AfterContentInit, ChangeDetectorRef, Component, ContentChild, ContentChildren, ElementRef, EventEmitter, HostBinding, Input, OnChanges, OnDestroy, OnInit, Output, QueryList, SimpleChanges, TemplateRef, booleanAttribute, inject } from '@angular/core'; import { Subject } from 'rxjs'; import { takeUntil } from 'rxjs/operators'; import { IgxCarouselComponentBase } from '../carousel/carousel-base'; @@ -76,6 +72,9 @@ import { fadeIn, growVerIn, growVerOut } from 'igniteui-angular/animations'; imports: [NgTemplateOutlet] }) export class IgxStepperComponent extends IgxCarouselComponentBase implements IgxStepper, OnChanges, OnInit, AfterContentInit, OnDestroy { + private stepperService = inject(IgxStepperService); + private element = inject>(ElementRef); + /** * Get/Set the animation type of the stepper when the orientation direction is vertical. @@ -331,11 +330,10 @@ export class IgxStepperComponent extends IgxCarouselComponentBase implements Igx private _linear = false; private readonly _defaultAnimationDuration = 350; - constructor( - cdr: ChangeDetectorRef, - @Inject(IgxAngularAnimationService) animationService: AnimationService, - private stepperService: IgxStepperService, - private element: ElementRef) { + constructor() { + const cdr = inject(ChangeDetectorRef); + const animationService = inject(IgxAngularAnimationService); + super(animationService, cdr); this.stepperService.stepper = this; } diff --git a/projects/igniteui-angular/src/lib/stepper/stepper.directive.ts b/projects/igniteui-angular/src/lib/stepper/stepper.directive.ts index 9e5e334272b..f82460188c4 100644 --- a/projects/igniteui-angular/src/lib/stepper/stepper.directive.ts +++ b/projects/igniteui-angular/src/lib/stepper/stepper.directive.ts @@ -1,4 +1,4 @@ -import { Directive, ElementRef, HostBinding, Inject, Input } from '@angular/core'; +import { Directive, ElementRef, HostBinding, Input, inject } from '@angular/core'; import { IgxStep, IGX_STEP_COMPONENT } from './stepper.common'; import { IgxStepperService } from './stepper.service'; @@ -154,6 +154,10 @@ export class IgxStepSubtitleDirective { standalone: true }) export class IgxStepContentDirective { + private step = inject(IGX_STEP_COMPONENT); + private stepperService = inject(IgxStepperService); + elementRef = inject>(ElementRef); + private get target(): IgxStep { return this.step; } @@ -188,10 +192,4 @@ export class IgxStepContentDirective { } private _tabIndex = null; - - constructor( - @Inject(IGX_STEP_COMPONENT) private step: IgxStep, - private stepperService: IgxStepperService, - public elementRef: ElementRef - ) { } } diff --git a/projects/igniteui-angular/src/lib/switch/switch.component.spec.ts b/projects/igniteui-angular/src/lib/switch/switch.component.spec.ts index 56553b40bf1..f7776837d07 100644 --- a/projects/igniteui-angular/src/lib/switch/switch.component.spec.ts +++ b/projects/igniteui-angular/src/lib/switch/switch.component.spec.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild } from '@angular/core'; +import { Component, ViewChild, inject } from '@angular/core'; import { fakeAsync, TestBed, tick, waitForAsync } from '@angular/core/testing'; import { UntypedFormBuilder, FormsModule, ReactiveFormsModule, Validators, NgForm } from '@angular/forms'; import { By } from '@angular/platform-browser'; @@ -361,11 +361,11 @@ class SwitchInvisibleLabelComponent { imports: [ReactiveFormsModule, IgxSwitchComponent] }) class SwitchFormGroupComponent { + private fb = inject(UntypedFormBuilder); + @ViewChild('switch', { static: true }) public switch: IgxSwitchComponent; public myForm = this.fb.group({ switch: ['', Validators.required] }); - - constructor(private fb: UntypedFormBuilder) {} } @Component({ diff --git a/projects/igniteui-angular/src/lib/tabs/tabs/tab-header.component.ts b/projects/igniteui-angular/src/lib/tabs/tabs/tab-header.component.ts index 8fd928e9042..26742a55162 100644 --- a/projects/igniteui-angular/src/lib/tabs/tabs/tab-header.component.ts +++ b/projects/igniteui-angular/src/lib/tabs/tabs/tab-header.component.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, Component, ElementRef, HostBinding, HostListener, NgZone, OnDestroy } from '@angular/core'; +import { AfterViewInit, Component, ElementRef, HostBinding, HostListener, NgZone, OnDestroy, inject } from '@angular/core'; import { IgxTabItemDirective } from '../tab-item.directive'; import { IgxTabHeaderDirective } from '../tab-header.directive'; import { IgxTabHeaderBase } from '../tabs.base'; @@ -14,6 +14,10 @@ import { IgxDirectionality } from '../../services/direction/directionality'; standalone: true }) export class IgxTabHeaderComponent extends IgxTabHeaderDirective implements AfterViewInit, OnDestroy { + protected override tabs: IgxTabsComponent; + private ngZone = inject(NgZone); + private dir = inject(IgxDirectionality); + /** @hidden @internal */ @HostBinding('class.igx-tabs__header-item--selected') @@ -34,15 +38,15 @@ export class IgxTabHeaderComponent extends IgxTabHeaderDirective implements Afte private _resizeObserver: ResizeObserver; /** @hidden @internal */ - constructor( - protected override tabs: IgxTabsComponent, - tab: IgxTabItemDirective, - elementRef: ElementRef, - platform: PlatformUtil, - private ngZone: NgZone, - private dir: IgxDirectionality - ) { + constructor() { + const tabs = inject(IgxTabsComponent); + const tab = inject(IgxTabItemDirective); + const elementRef = inject>(ElementRef); + const platform = inject(PlatformUtil); + super(tabs, tab, elementRef, platform); + + this.tabs = tabs; } /** @hidden @internal */ diff --git a/projects/igniteui-angular/src/lib/tabs/tabs/tabs.component.ts b/projects/igniteui-angular/src/lib/tabs/tabs/tabs.component.ts index 0b08fc9f4e9..6dc450bfc86 100644 --- a/projects/igniteui-angular/src/lib/tabs/tabs/tabs.component.ts +++ b/projects/igniteui-angular/src/lib/tabs/tabs/tabs.component.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, ChangeDetectorRef, Component, ElementRef, HostBinding, Inject, Input, NgZone, OnDestroy, ViewChild } from '@angular/core'; +import { AfterViewInit, ChangeDetectorRef, Component, ElementRef, HostBinding, Input, NgZone, OnDestroy, ViewChild, inject } from '@angular/core'; import { getResizeObserver, PlatformUtil } from '../../core/utils'; import { IgxAngularAnimationService } from '../../services/animation/angular-animation-service'; import { AnimationService } from '../../services/animation/animation'; @@ -67,6 +67,9 @@ let NEXT_TAB_ID = 0; }) export class IgxTabsComponent extends IgxTabsDirective implements AfterViewInit, OnDestroy { + private ngZone = inject(NgZone); + private platform = inject(PlatformUtil); + /** * Gets/Sets the tab alignment. Defaults to `start`. @@ -134,13 +137,11 @@ export class IgxTabsComponent extends IgxTabsDirective implements AfterViewInit, private _tabAlignment: string | IgxTabsAlignment = 'start'; private _resizeObserver: ResizeObserver; - constructor( - @Inject(IgxAngularAnimationService) animationService: AnimationService, - cdr: ChangeDetectorRef, - private ngZone: NgZone, - dir: IgxDirectionality, - private platform: PlatformUtil - ) { + constructor() { + const animationService = inject(IgxAngularAnimationService); + const cdr = inject(ChangeDetectorRef); + const dir = inject(IgxDirectionality); + super(animationService, cdr, dir); } diff --git a/projects/igniteui-angular/src/lib/test-utils/grid-base-components.spec.ts b/projects/igniteui-angular/src/lib/test-utils/grid-base-components.spec.ts index 8ac162068a9..c6720d7be64 100644 --- a/projects/igniteui-angular/src/lib/test-utils/grid-base-components.spec.ts +++ b/projects/igniteui-angular/src/lib/test-utils/grid-base-components.spec.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, AfterViewInit, ChangeDetectorRef } from '@angular/core'; +import { Component, OnInit, ViewChild, AfterViewInit, ChangeDetectorRef, inject } from '@angular/core'; import { SampleTestData } from './sample-test-data.spec'; import { ColumnDefinitions, GridTemplateStrings } from './template-strings.spec'; import { IgxGridComponent } from '../grids/grid/grid.component'; @@ -190,6 +190,8 @@ export class GridRowConditionalStylingComponent extends GridWithSizeComponent { ] }) export class ColumnHidingTestComponent extends GridWithSizeComponent implements OnInit, AfterViewInit { + private cdr = inject(ChangeDetectorRef); + @ViewChild(IgxColumnActionsComponent) public chooser: IgxColumnActionsComponent; public override width = '500px'; @@ -198,10 +200,6 @@ export class ColumnHidingTestComponent extends GridWithSizeComponent implements public hideFilter = false; public paging = false; - constructor(private cdr: ChangeDetectorRef) { - super(); - } - public get hiddenColumnsCount(): number { return this.chooser.columnItems.filter(c => c.checked).length; } @@ -229,7 +227,9 @@ export class ColumnGroupsHidingTestComponent extends ColumnHidingTestComponent { public hasGroupColumns = false; public override data = SampleTestData.contactInfoDataFull(); - constructor(cdr: ChangeDetectorRef) { + constructor() { + const cdr = inject(ChangeDetectorRef); + super(cdr); } } @@ -247,6 +247,8 @@ export class ColumnGroupsHidingTestComponent extends ColumnHidingTestComponent { imports: [IgxGridComponent, IgxColumnComponent, IgxColumnActionsComponent, IgxColumnPinningDirective, IgxGridToolbarComponent, IgxGridToolbarPinningComponent, IgxGridToolbarActionsComponent] }) export class ColumnPinningTestComponent extends GridWithSizeComponent implements AfterViewInit, OnInit { + private cdr = inject(ChangeDetectorRef); + @ViewChild(IgxColumnActionsComponent) public chooser: IgxColumnActionsComponent; public override height = '500px'; @@ -254,10 +256,6 @@ export class ColumnPinningTestComponent extends GridWithSizeComponent implements public showInline = true; public hideFilter = false; - constructor(private cdr: ChangeDetectorRef) { - super(); - } - public ngOnInit() { this.data = SampleTestData.productInfoData(); } @@ -302,7 +300,9 @@ export class ColumnPinningWithTemplateTestComponent extends ColumnPinningTestCom export class ColumnGroupsPinningTestComponent extends ColumnPinningTestComponent { public override data = SampleTestData.contactInfoDataFull(); - constructor(cdr: ChangeDetectorRef) { + constructor() { + const cdr = inject(ChangeDetectorRef); + super(cdr); } } diff --git a/projects/igniteui-angular/src/lib/time-picker/time-picker.component.ts b/projects/igniteui-angular/src/lib/time-picker/time-picker.component.ts index c5174302fec..9a51587d2a4 100644 --- a/projects/igniteui-angular/src/lib/time-picker/time-picker.component.ts +++ b/projects/igniteui-angular/src/lib/time-picker/time-picker.component.ts @@ -1,22 +1,5 @@ import { NgClass, NgTemplateOutlet } from '@angular/common'; -import { - Component, - ElementRef, - EventEmitter, - HostBinding, - Input, - OnDestroy, - OnInit, - Output, - ViewChild, - ContentChild, - Inject, - AfterViewInit, - Injector, - PipeTransform, - ChangeDetectorRef, - LOCALE_ID, Optional, ContentChildren, QueryList, HostListener, booleanAttribute -} from '@angular/core'; +import { Component, ElementRef, EventEmitter, HostBinding, Input, OnDestroy, OnInit, Output, ViewChild, ContentChild, AfterViewInit, Injector, PipeTransform, ChangeDetectorRef, LOCALE_ID, ContentChildren, QueryList, HostListener, booleanAttribute, inject } from '@angular/core'; import { ControlValueAccessor, NG_VALUE_ACCESSOR, @@ -101,6 +84,10 @@ export class IgxTimePickerComponent extends PickerBaseDirective OnDestroy, AfterViewInit, Validator { + private _injector = inject(Injector); + private platform = inject(PlatformUtil); + private cdr = inject(ChangeDetectorRef); + /** * Sets the value of the `id` attribute. * ```html @@ -614,14 +601,11 @@ export class IgxTimePickerComponent extends PickerBaseDirective return this._itemsDelta; } - constructor( - element: ElementRef, - @Inject(LOCALE_ID) _localeId: string, - @Optional() @Inject(IGX_INPUT_GROUP_TYPE) _inputGroupType: IgxInputGroupType, - private _injector: Injector, - private platform: PlatformUtil, - private cdr: ChangeDetectorRef, - ) { + constructor() { + const element = inject(ElementRef); + const _localeId = inject(LOCALE_ID); + const _inputGroupType = inject(IGX_INPUT_GROUP_TYPE, { optional: true }); + super(element, _localeId, _inputGroupType); this.locale = this.locale || this._localeId; } diff --git a/projects/igniteui-angular/src/lib/time-picker/time-picker.directives.ts b/projects/igniteui-angular/src/lib/time-picker/time-picker.directives.ts index 3ce96e93073..7fcf15ff0ac 100644 --- a/projects/igniteui-angular/src/lib/time-picker/time-picker.directives.ts +++ b/projects/igniteui-angular/src/lib/time-picker/time-picker.directives.ts @@ -4,16 +4,7 @@ * * @preferred */ -import { - Directive, - ElementRef, - HostBinding, - HostListener, - Inject, - Input, - OnDestroy, - OnInit -} from '@angular/core'; +import { Directive, ElementRef, HostBinding, HostListener, Input, OnDestroy, OnInit, inject } from '@angular/core'; import { HammerGesturesManager } from '../core/touch'; import { DateTimeUtil } from '../date-common/util/date-time.util'; import { IgxTimePickerBase, IGX_TIME_PICKER_COMPONENT } from './time-picker.common'; @@ -26,6 +17,10 @@ import { HammerInput, HammerOptions } from '../core/touch-annotations'; standalone: true }) export class IgxItemListDirective implements OnInit, OnDestroy { + timePicker = inject(IGX_TIME_PICKER_COMPONENT); + private elementRef = inject(ElementRef); + private touchManager = inject(HammerGesturesManager); + @HostBinding('attr.tabindex') public tabindex = 0; @@ -42,12 +37,6 @@ export class IgxItemListDirective implements OnInit, OnDestroy { */ private scrollAccumulator = 0; - constructor( - @Inject(IGX_TIME_PICKER_COMPONENT) public timePicker: IgxTimePickerBase, - private elementRef: ElementRef, - private touchManager: HammerGesturesManager - ) { } - @HostBinding('class.igx-time-picker__column') public get defaultCSS(): boolean { return true; @@ -248,6 +237,9 @@ export class IgxItemListDirective implements OnInit, OnDestroy { standalone: true }) export class IgxTimeItemDirective { + timePicker = inject(IGX_TIME_PICKER_COMPONENT); + private itemList = inject(IgxItemListDirective); + @Input('igxTimeItem') public value: string; @@ -359,10 +351,6 @@ export class IgxTimeItemDirective { return this.getHourPart(this.timePicker.selectedDate); } - constructor(@Inject(IGX_TIME_PICKER_COMPONENT) - public timePicker: IgxTimePickerBase, - private itemList: IgxItemListDirective) { } - @HostListener('click', ['value']) public onClick(item) { if (item !== '') { diff --git a/projects/igniteui-angular/src/lib/time-picker/time-picker.pipes.ts b/projects/igniteui-angular/src/lib/time-picker/time-picker.pipes.ts index b20ea11c62d..eab6bf4a96e 100644 --- a/projects/igniteui-angular/src/lib/time-picker/time-picker.pipes.ts +++ b/projects/igniteui-angular/src/lib/time-picker/time-picker.pipes.ts @@ -1,4 +1,4 @@ -import { Pipe, PipeTransform, Inject } from '@angular/core'; +import { Pipe, PipeTransform, inject } from '@angular/core'; import { DatePipe } from '@angular/common'; import { IGX_TIME_PICKER_COMPONENT, IgxTimePickerBase } from './time-picker.common'; import { DatePart } from '../directives/date-time-editor/public_api'; @@ -11,7 +11,8 @@ const ITEMS_COUNT = 7; standalone: true }) export class TimeFormatPipe implements PipeTransform { - constructor(@Inject(IGX_TIME_PICKER_COMPONENT) private timePicker: IgxTimePickerBase) { } + private timePicker = inject(IGX_TIME_PICKER_COMPONENT); + public transform(value: Date): string { const format = this.timePicker.appliedFormat.replace('tt', 'aa'); @@ -25,7 +26,8 @@ export class TimeFormatPipe implements PipeTransform { standalone: true }) export class TimeItemPipe implements PipeTransform { - constructor(@Inject(IGX_TIME_PICKER_COMPONENT) private timePicker: IgxTimePickerBase) { } + private timePicker = inject(IGX_TIME_PICKER_COMPONENT); + public transform(_collection: any[], timePart: string, selectedDate: Date, min: Date, max: Date) { let list; diff --git a/projects/igniteui-angular/src/lib/toast/toast.component.ts b/projects/igniteui-angular/src/lib/toast/toast.component.ts index 4cec61b052f..e74428941aa 100644 --- a/projects/igniteui-angular/src/lib/toast/toast.component.ts +++ b/projects/igniteui-angular/src/lib/toast/toast.component.ts @@ -1,15 +1,4 @@ -import { - ChangeDetectorRef, - Component, - ElementRef, - EventEmitter, - HostBinding, - Inject, - Input, - OnInit, - Optional, - Output -} from '@angular/core'; +import { ChangeDetectorRef, Component, ElementRef, EventEmitter, HostBinding, Input, OnInit, Output, inject } from '@angular/core'; import { takeUntil } from 'rxjs/operators'; import { IgxNavigationService } from '../core/navigation'; import { @@ -47,6 +36,8 @@ let NEXT_ID = 0; standalone: true }) export class IgxToastComponent extends IgxNotificationsDirective implements OnInit { + private _element: ElementRef; + /** * @hidden */ @@ -144,13 +135,15 @@ export class IgxToastComponent extends IgxNotificationsDirective implements OnIn return this._element.nativeElement; } - constructor( - private _element: ElementRef, - cdr: ChangeDetectorRef, - @Optional() navService: IgxNavigationService, - @Inject(IgxOverlayService) overlayService: IgxOverlayService - ) { + constructor() { + const _element = inject(ElementRef); + const cdr = inject(ChangeDetectorRef); + const navService = inject(IgxNavigationService, { optional: true }); + const overlayService = inject(IgxOverlayService); + super(_element, cdr, overlayService, navService); + + this._element = _element; } /** diff --git a/projects/igniteui-angular/src/lib/tree/tree-navigation.service.ts b/projects/igniteui-angular/src/lib/tree/tree-navigation.service.ts index 53687c548ad..fa3c5f57a97 100644 --- a/projects/igniteui-angular/src/lib/tree/tree-navigation.service.ts +++ b/projects/igniteui-angular/src/lib/tree/tree-navigation.service.ts @@ -1,4 +1,4 @@ -import { Injectable, OnDestroy } from '@angular/core'; +import { Injectable, OnDestroy, inject } from '@angular/core'; import { IgxTree, IgxTreeNode, IgxTreeSelectionType } from './common'; import { NAVIGATION_KEYS } from '../core/utils'; import { IgxTreeService } from './tree.service'; @@ -8,6 +8,9 @@ import { Subject } from 'rxjs'; /** @hidden @internal */ @Injectable() export class IgxTreeNavigationService implements OnDestroy { + private treeService = inject(IgxTreeService); + private selectionService = inject(IgxTreeSelectionService); + private tree: IgxTree; private _focusedNode: IgxTreeNode = null; @@ -20,7 +23,7 @@ export class IgxTreeNavigationService implements OnDestroy { private _cacheChange = new Subject(); - constructor(private treeService: IgxTreeService, private selectionService: IgxTreeSelectionService) { + constructor() { this._cacheChange.subscribe(() => { this._visibleChildren = this.tree?.nodes ? diff --git a/projects/igniteui-angular/src/lib/tree/tree-node/tree-node.component.ts b/projects/igniteui-angular/src/lib/tree/tree-node/tree-node.component.ts index 36955bd179f..b9e1e5a3fe4 100644 --- a/projects/igniteui-angular/src/lib/tree/tree-node/tree-node.component.ts +++ b/projects/igniteui-angular/src/lib/tree/tree-node/tree-node.component.ts @@ -1,24 +1,4 @@ -import { - ChangeDetectorRef, - Component, - ContentChildren, - Directive, - ElementRef, - EventEmitter, - HostBinding, - HostListener, - Inject, - Input, - OnDestroy, - OnInit, - Optional, - Output, - QueryList, - SkipSelf, - TemplateRef, - ViewChild, - booleanAttribute -} from '@angular/core'; +import { ChangeDetectorRef, Component, ContentChildren, Directive, ElementRef, EventEmitter, HostBinding, HostListener, Input, OnDestroy, OnInit, Output, QueryList, TemplateRef, ViewChild, booleanAttribute, inject } from '@angular/core'; import { takeUntil } from 'rxjs/operators'; import { ITreeResourceStrings, TreeResourceStringsEN } from '../../core/i18n/tree-resources'; import { ToggleAnimationPlayer, ToggleAnimationSettings } from '../../expansion-panel/toggle-animation-component'; @@ -51,6 +31,10 @@ import { getCurrentResourceStrings } from '../../core/i18n/resources'; standalone: true }) export class IgxTreeNodeLinkDirective implements OnDestroy { + private node = inject>(IGX_TREE_NODE_COMPONENT, { optional: true }); + private navService = inject(IgxTreeNavigationService); + elementRef = inject(ElementRef); + @HostBinding('attr.role') public role = 'treeitem'; @@ -92,13 +76,6 @@ export class IgxTreeNodeLinkDirective implements OnDestroy { private _parentNode: IgxTreeNode = null; - constructor( - @Optional() @Inject(IGX_TREE_NODE_COMPONENT) - private node: IgxTreeNode, - private navService: IgxTreeNavigationService, - public elementRef: ElementRef, - ) { } - /** @hidden @internal */ @HostBinding('attr.tabindex') public get tabIndex(): number { @@ -157,6 +134,14 @@ export class IgxTreeNodeLinkDirective implements OnDestroy { imports: [NgTemplateOutlet, IgxIconComponent, IgxCheckboxComponent, NgClass, IgxCircularProgressBarComponent] }) export class IgxTreeNodeComponent extends ToggleAnimationPlayer implements IgxTreeNode, OnInit, OnDestroy { + tree = inject(IGX_TREE_COMPONENT); + protected selectionService = inject(IgxTreeSelectionService); + protected treeService = inject(IgxTreeService); + protected navService = inject(IgxTreeNavigationService); + protected cdr = inject(ChangeDetectorRef); + private element = inject>(ElementRef); + parentNode = inject>(IGX_TREE_NODE_COMPONENT, { optional: true, skipSelf: true }); + /** * The data entry that the node is visualizing. * @@ -384,16 +369,9 @@ export class IgxTreeNodeComponent extends ToggleAnimationPlayer implements Ig private _tabIndex = null; private _disabled = false; - constructor( - @Inject(IGX_TREE_COMPONENT) public tree: IgxTree, - protected selectionService: IgxTreeSelectionService, - protected treeService: IgxTreeService, - protected navService: IgxTreeNavigationService, - protected cdr: ChangeDetectorRef, - @Inject(IgxAngularAnimationService) animationService: AnimationService, - private element: ElementRef, - @Optional() @SkipSelf() @Inject(IGX_TREE_NODE_COMPONENT) public parentNode: IgxTreeNode - ) { + constructor() { + const animationService = inject(IgxAngularAnimationService); + super(animationService); } diff --git a/projects/igniteui-angular/src/lib/tree/tree-samples.spec.ts b/projects/igniteui-angular/src/lib/tree/tree-samples.spec.ts index c7bed3f83c8..aadcd5a13ef 100644 --- a/projects/igniteui-angular/src/lib/tree/tree-samples.spec.ts +++ b/projects/igniteui-angular/src/lib/tree/tree-samples.spec.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectorRef } from '@angular/core'; +import { Component, ViewChild, ChangeDetectorRef, inject } from '@angular/core'; import { IgxTreeComponent, IgxTreeExpandIndicatorDirective, IgxTreeNodeComponent, IgxTreeNodeLinkDirective } from './public_api'; import { HIERARCHICAL_SAMPLE_DATA } from 'src/app/shared/sample-data'; import { NgTemplateOutlet } from '@angular/common'; @@ -54,9 +54,11 @@ export class IgxTreeSimpleComponent { imports: [IgxTreeComponent, IgxTreeNodeComponent] }) export class IgxTreeSelectionSampleComponent { + cdr = inject(ChangeDetectorRef); + @ViewChild(IgxTreeComponent, { static: true }) public tree: IgxTreeComponent; public data; - constructor(public cdr: ChangeDetectorRef) { + constructor() { this.data = HIERARCHICAL_SAMPLE_DATA; this.mapData(this.data); } diff --git a/projects/igniteui-angular/src/lib/tree/tree.component.ts b/projects/igniteui-angular/src/lib/tree/tree.component.ts index 2ee5d39e79f..cb73299e3eb 100644 --- a/projects/igniteui-angular/src/lib/tree/tree.component.ts +++ b/projects/igniteui-angular/src/lib/tree/tree.component.ts @@ -1,20 +1,4 @@ -import { - Component, - QueryList, - Input, - Output, - EventEmitter, - ContentChild, - Directive, - TemplateRef, - OnInit, - AfterViewInit, - ContentChildren, - OnDestroy, - HostBinding, - ElementRef, - booleanAttribute, -} from '@angular/core'; +import { Component, QueryList, Input, Output, EventEmitter, ContentChild, Directive, TemplateRef, OnInit, AfterViewInit, ContentChildren, OnDestroy, HostBinding, ElementRef, booleanAttribute, inject } from '@angular/core'; import { Subject } from 'rxjs'; import { takeUntil, throttleTime } from 'rxjs/operators'; @@ -94,6 +78,11 @@ export class IgxTreeExpandIndicatorDirective { standalone: true }) export class IgxTreeComponent implements IgxTree, OnInit, AfterViewInit, OnDestroy { + private navService = inject(IgxTreeNavigationService); + private selectionService = inject(IgxTreeSelectionService); + private treeService = inject(IgxTreeService); + private element = inject>(ElementRef); + @HostBinding('class.igx-tree') public cssClass = 'igx-tree'; @@ -322,12 +311,7 @@ export class IgxTreeComponent implements IgxTree, OnInit, AfterViewInit, OnDestr private destroy$ = new Subject(); private unsubChildren$ = new Subject(); - constructor( - private navService: IgxTreeNavigationService, - private selectionService: IgxTreeSelectionService, - private treeService: IgxTreeService, - private element: ElementRef, - ) { + constructor() { this.selectionService.register(this); this.treeService.register(this); this.navService.register(this); diff --git a/src/app/accordion/accordion.sample.ts b/src/app/accordion/accordion.sample.ts index 1991ce04859..15208b916aa 100644 --- a/src/app/accordion/accordion.sample.ts +++ b/src/app/accordion/accordion.sample.ts @@ -1,4 +1,4 @@ -import { Component, DestroyRef, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core'; +import { Component, DestroyRef, CUSTOM_ELEMENTS_SCHEMA, inject } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { IGX_ACCORDION_DIRECTIVES } from 'igniteui-angular'; import { @@ -22,6 +22,9 @@ defineComponents(IgcAccordionComponent, IgcExpansionPanelComponent); imports: [FormsModule, IGX_ACCORDION_DIRECTIVES] }) export class AccordionSampleComponent { + private propertyChangeService = inject(PropertyChangeService); + private destroyRef = inject(DestroyRef); + public panelConfig: PropertyPanelConfig = { singleExpand: { label: 'Single Branch Expand', @@ -34,10 +37,7 @@ export class AccordionSampleComponent { public properties: Properties; - constructor( - private propertyChangeService: PropertyChangeService, - private destroyRef: DestroyRef - ) { + constructor() { this.propertyChangeService.setPanelConfig(this.panelConfig); const propertyChange = diff --git a/src/app/app.component.ts b/src/app/app.component.ts index c4637552c6b..17333d8a508 100644 --- a/src/app/app.component.ts +++ b/src/app/app.component.ts @@ -33,6 +33,9 @@ import { PropertyChangeService } from './properties-panel/property-change.servic ] }) export class AppComponent implements OnInit { + private router = inject(Router); + private iconService = inject(IgxIconService); + @HostBinding('attr.id') public appId = 'igniteui-demo-app'; @@ -742,7 +745,10 @@ export class AppComponent implements OnInit { } ].sort((componentLink1, componentLink2) => componentLink1.name > componentLink2.name ? 1 : -1); - constructor(private router: Router, private iconService: IgxIconService) { + constructor() { + const router = this.router; + const iconService = this.iconService; + iconService.setFamily('fa-solid', { className: 'fa', type: 'font', prefix: 'fa-'}); iconService.setFamily('fa-brands', { className: 'fab', type: 'font' }); diff --git a/src/app/autocomplete/autocomplete.sample.ts b/src/app/autocomplete/autocomplete.sample.ts index 867aab1e591..123f41b2b61 100644 --- a/src/app/autocomplete/autocomplete.sample.ts +++ b/src/app/autocomplete/autocomplete.sample.ts @@ -1,4 +1,4 @@ -import { Component, PipeTransform, Pipe, ViewChild } from '@angular/core'; +import { Component, PipeTransform, Pipe, ViewChild, inject } from '@angular/core'; import { UntypedFormBuilder, UntypedFormControl, Validators, UntypedFormGroup, FormsModule, ReactiveFormsModule } from '@angular/forms'; import { worldInfo, attractions } from './data'; @@ -52,7 +52,9 @@ export class AutocompleteSampleComponent { public attractions; public attractionsWidth = ''; - constructor(fb: UntypedFormBuilder) { + constructor() { + const fb = inject(UntypedFormBuilder); + this.worldInfo = worldInfo; this.attractions = attractions; diff --git a/src/app/avatar/avatar.sample.ts b/src/app/avatar/avatar.sample.ts index ef6b48ab91c..8f947a2e72e 100644 --- a/src/app/avatar/avatar.sample.ts +++ b/src/app/avatar/avatar.sample.ts @@ -1,4 +1,4 @@ -import { Component, CUSTOM_ELEMENTS_SCHEMA, DestroyRef } from '@angular/core'; +import { Component, CUSTOM_ELEMENTS_SCHEMA, DestroyRef, inject } from '@angular/core'; import { IgxAvatarComponent, IgxIconComponent, @@ -35,6 +35,9 @@ defineComponents(IgcAvatarComponent, IgcIconComponent); ], }) export class AvatarSampleComponent { + private propertyChangeService = inject(PropertyChangeService); + private destroyRef = inject(DestroyRef); + public panelConfig: PropertyPanelConfig = { size: { control: { @@ -68,10 +71,7 @@ export class AvatarSampleComponent { public properties: Properties; - constructor( - private propertyChangeService: PropertyChangeService, - private destroyRef: DestroyRef - ) { + constructor() { this.propertyChangeService.setPanelConfig(this.panelConfig); const propertyChange = diff --git a/src/app/badge/badge.sample.ts b/src/app/badge/badge.sample.ts index f8bcb45c90a..bcd6a863e50 100644 --- a/src/app/badge/badge.sample.ts +++ b/src/app/badge/badge.sample.ts @@ -1,4 +1,4 @@ -import { Component, CUSTOM_ELEMENTS_SCHEMA, DestroyRef } from '@angular/core'; +import { Component, CUSTOM_ELEMENTS_SCHEMA, DestroyRef, inject } from '@angular/core'; import { IgxBadgeComponent, IgxAvatarComponent, @@ -36,6 +36,9 @@ registerIconFromText('bluetooth', bluetooth); }) export class BadgeSampleComponent { + private propertyChangeService = inject(PropertyChangeService); + private destroyRef = inject(DestroyRef); + public panelConfig: PropertyPanelConfig = { shape: { control: { @@ -61,10 +64,7 @@ export class BadgeSampleComponent { public properties: Properties; - constructor( - private propertyChangeService: PropertyChangeService, - private destroyRef: DestroyRef - ) { + constructor() { this.propertyChangeService.setPanelConfig(this.panelConfig); const propertyChange = diff --git a/src/app/bottomnav/bottomnav.sample.ts b/src/app/bottomnav/bottomnav.sample.ts index a071b4e0d21..cbef87652b4 100644 --- a/src/app/bottomnav/bottomnav.sample.ts +++ b/src/app/bottomnav/bottomnav.sample.ts @@ -1,11 +1,4 @@ -import { - AfterViewInit, - Component, - ElementRef, - QueryList, - Renderer2, - ViewChildren -} from '@angular/core'; +import { AfterViewInit, Component, ElementRef, QueryList, Renderer2, ViewChildren, inject } from '@angular/core'; import { IgxAvatarComponent, IgxBottomNavComponent, IgxBottomNavContentComponent, IgxBottomNavHeaderComponent, IgxBottomNavHeaderIconDirective, IgxBottomNavHeaderLabelDirective, IgxBottomNavItemComponent, IgxIconComponent, IgxListActionDirective, IgxListComponent, IgxListItemComponent, IgxListLineSubTitleDirective, IgxListLineTitleDirective, IgxListThumbnailDirective, IgxRippleDirective } from 'igniteui-angular'; @Component({ @@ -31,6 +24,8 @@ import { IgxAvatarComponent, IgxBottomNavComponent, IgxBottomNavContentComponent ] }) export class BottomNavSampleComponent implements AfterViewInit { + private renderer = inject(Renderer2); + @ViewChildren('tabbarEl') private tabbar: QueryList; @@ -87,8 +82,6 @@ export class BottomNavSampleComponent implements AfterViewInit { text: 'Marianne Taylor' }]; - constructor(private renderer: Renderer2) { } - public ngAfterViewInit() { this.tabbar.map((e) => { const menubar = e.nativeElement.querySelector('.igx-bottom-nav__menu'); diff --git a/src/app/button/button.sample.ts b/src/app/button/button.sample.ts index 193d53a8e85..316d4abb658 100644 --- a/src/app/button/button.sample.ts +++ b/src/app/button/button.sample.ts @@ -1,12 +1,4 @@ -import { - Component, - CUSTOM_ELEMENTS_SCHEMA, - DestroyRef, - OnInit, - TemplateRef, - ViewChild, - ViewEncapsulation, -} from '@angular/core'; +import { Component, CUSTOM_ELEMENTS_SCHEMA, DestroyRef, OnInit, TemplateRef, ViewChild, ViewEncapsulation, inject } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { IgxButtonDirective, @@ -47,6 +39,9 @@ registerIconFromText('face', face); ], }) export class ButtonSampleComponent implements OnInit { + private propertyChangeService = inject(PropertyChangeService); + private destroyRef = inject(DestroyRef); + @ViewChild('customControls', { static: true }) public customControlsTemplate!: TemplateRef; @@ -77,10 +72,7 @@ export class ButtonSampleComponent implements OnInit { public properties: Properties; - constructor( - private propertyChangeService: PropertyChangeService, - private destroyRef: DestroyRef - ) { + constructor() { this.propertyChangeService.setPanelConfig(this.panelConfig); const propertyChange = diff --git a/src/app/buttonGroup/buttonGroup.sample.ts b/src/app/buttonGroup/buttonGroup.sample.ts index bf51787ac5a..119dff0fe4e 100644 --- a/src/app/buttonGroup/buttonGroup.sample.ts +++ b/src/app/buttonGroup/buttonGroup.sample.ts @@ -1,4 +1,4 @@ -import { Component, CUSTOM_ELEMENTS_SCHEMA, DestroyRef } from '@angular/core'; +import { Component, CUSTOM_ELEMENTS_SCHEMA, DestroyRef, inject } from '@angular/core'; import { IgxButtonDirective, IgxButtonGroupComponent, @@ -59,6 +59,9 @@ icons.forEach((icon) => { }) export class ButtonGroupSampleComponent { + private propertyChangeService = inject(PropertyChangeService); + private destroyRef = inject(DestroyRef); + protected cities = [ { disabled: false, @@ -108,10 +111,7 @@ export class ButtonGroupSampleComponent { public properties: Properties; - constructor( - private propertyChangeService: PropertyChangeService, - private destroyRef: DestroyRef - ) { + constructor() { this.propertyChangeService.setPanelConfig(this.panelConfig); const propertyChange = diff --git a/src/app/calendar/calendar.sample.ts b/src/app/calendar/calendar.sample.ts index 6d4827504a6..ef79ba6a3ea 100644 --- a/src/app/calendar/calendar.sample.ts +++ b/src/app/calendar/calendar.sample.ts @@ -1,11 +1,4 @@ -import { - Component, - CUSTOM_ELEMENTS_SCHEMA, - DestroyRef, - OnInit, - TemplateRef, - ViewChild, -} from '@angular/core'; +import { Component, CUSTOM_ELEMENTS_SCHEMA, DestroyRef, OnInit, TemplateRef, ViewChild, inject } from '@angular/core'; import { DATE_PIPE_DEFAULT_OPTIONS } from '@angular/common'; import { FormsModule } from '@angular/forms'; import { @@ -50,6 +43,9 @@ defineComponents(IgcCalendarComponent); ], }) export class CalendarSampleComponent implements OnInit { + private propertyChangeService = inject(PropertyChangeService); + private destroyRef = inject(DestroyRef); + @ViewChild('customControls', { static: true }) public customControlsTemplate!: TemplateRef; @@ -168,10 +164,7 @@ export class CalendarSampleComponent implements OnInit { public properties: Properties; - constructor( - private propertyChangeService: PropertyChangeService, - private destroyRef: DestroyRef - ) { + constructor() { this.propertyChangeService.setPanelConfig(this.panelConfig); const propertyChange = diff --git a/src/app/card/card.sample.ts b/src/app/card/card.sample.ts index 629acf4db5c..114b4b4f73a 100644 --- a/src/app/card/card.sample.ts +++ b/src/app/card/card.sample.ts @@ -1,12 +1,4 @@ -import { - Component, - CUSTOM_ELEMENTS_SCHEMA, - DestroyRef, - OnInit, - TemplateRef, - ViewChild, - ViewEncapsulation, -} from '@angular/core'; +import { Component, CUSTOM_ELEMENTS_SCHEMA, DestroyRef, OnInit, TemplateRef, ViewChild, ViewEncapsulation, inject } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { IgxAvatarComponent, @@ -113,6 +105,9 @@ const cardFactory = (params: any): ICard => ({ ] }) export class CardSampleComponent implements OnInit { + private propertyChangeService = inject(PropertyChangeService); + private destroyRef = inject(DestroyRef); + @ViewChild('customControls', { static: true }) public customControlsTemplate!: TemplateRef; @@ -163,10 +158,7 @@ export class CardSampleComponent implements OnInit { public properties: Properties; - constructor( - private propertyChangeService: PropertyChangeService, - private destroyRef: DestroyRef - ) { + constructor() { this.propertyChangeService.setPanelConfig(this.panelConfig); const propertyChange = diff --git a/src/app/carousel/carousel.sample.ts b/src/app/carousel/carousel.sample.ts index da7674e38a5..1908dad0266 100644 --- a/src/app/carousel/carousel.sample.ts +++ b/src/app/carousel/carousel.sample.ts @@ -1,4 +1,4 @@ -import { Component, CUSTOM_ELEMENTS_SCHEMA, DestroyRef } from '@angular/core'; +import { Component, CUSTOM_ELEMENTS_SCHEMA, DestroyRef, inject } from '@angular/core'; import { IGX_CAROUSEL_DIRECTIVES, IgxIconComponent } from 'igniteui-angular'; import { Properties, @@ -56,6 +56,9 @@ icons.forEach((icon) => { imports: [IGX_CAROUSEL_DIRECTIVES, IgxIconComponent, NgClass] }) export class CarouselSampleComponent { + private propertyChangeService = inject(PropertyChangeService); + private destroyRef = inject(DestroyRef); + public panelConfig: PropertyPanelConfig = { disableLoop: { label: 'Disable Loop', @@ -127,10 +130,7 @@ export class CarouselSampleComponent { public properties: Properties; - constructor( - private propertyChangeService: PropertyChangeService, - private destroyRef: DestroyRef - ) { + constructor() { this.addNewSlide(); this.propertyChangeService.setPanelConfig(this.panelConfig); diff --git a/src/app/chips/chips.sample.ts b/src/app/chips/chips.sample.ts index 9003d3890a2..8822a44abb6 100644 --- a/src/app/chips/chips.sample.ts +++ b/src/app/chips/chips.sample.ts @@ -1,11 +1,4 @@ -import { - Component, - CUSTOM_ELEMENTS_SCHEMA, - DestroyRef, - OnInit, - TemplateRef, - ViewChild, -} from '@angular/core'; +import { Component, CUSTOM_ELEMENTS_SCHEMA, DestroyRef, OnInit, TemplateRef, ViewChild, inject } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { IgxAvatarComponent, @@ -75,6 +68,9 @@ icons.forEach((icon) => { ] }) export class ChipsSampleComponent implements OnInit { + private propertyChangeService = inject(PropertyChangeService); + private destroyRef = inject(DestroyRef); + @ViewChild('customControls', { static: true }) public customControlsTemplate!: TemplateRef; @@ -127,10 +123,7 @@ export class ChipsSampleComponent implements OnInit { public properties: Properties; - constructor( - private propertyChangeService: PropertyChangeService, - private destroyRef: DestroyRef - ) { + constructor() { this.propertyChangeService.setPanelConfig(this.panelConfig); const propertyChange = diff --git a/src/app/circular-progress-showcase/circular-progress-showcase.sample.ts b/src/app/circular-progress-showcase/circular-progress-showcase.sample.ts index 312baa260eb..a0f9b6b15d8 100644 --- a/src/app/circular-progress-showcase/circular-progress-showcase.sample.ts +++ b/src/app/circular-progress-showcase/circular-progress-showcase.sample.ts @@ -1,4 +1,4 @@ -import { Component, CUSTOM_ELEMENTS_SCHEMA, DestroyRef } from '@angular/core'; +import { Component, CUSTOM_ELEMENTS_SCHEMA, DestroyRef, inject } from '@angular/core'; import { IgxCircularProgressBarComponent } from 'igniteui-angular'; import { IgcCircularProgressComponent, @@ -22,6 +22,9 @@ defineComponents(IgcCircularProgressComponent); }) export class CircularProgressSampleComponent { + private propertyChangeService = inject(PropertyChangeService); + private destroyRef = inject(DestroyRef); + public panelConfig: PropertyPanelConfig = { hasAnimation: { label: 'Enable none indeterminate animation (angular)', @@ -86,10 +89,7 @@ export class CircularProgressSampleComponent { public properties: Properties; - constructor( - private propertyChangeService: PropertyChangeService, - private destroyRef: DestroyRef - ) { + constructor() { this.propertyChangeService.setPanelConfig(this.panelConfig); const propertyChange = diff --git a/src/app/combo-showcase/combo-showcase.sample.ts b/src/app/combo-showcase/combo-showcase.sample.ts index a4ecad9cb56..d5acd69f9c2 100644 --- a/src/app/combo-showcase/combo-showcase.sample.ts +++ b/src/app/combo-showcase/combo-showcase.sample.ts @@ -1,4 +1,4 @@ -import { Component, CUSTOM_ELEMENTS_SCHEMA, DestroyRef } from '@angular/core'; +import { Component, CUSTOM_ELEMENTS_SCHEMA, DestroyRef, inject } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { IGX_COMBO_DIRECTIVES, @@ -26,6 +26,9 @@ defineComponents(IgcComboComponent); ] }) export class ComboShowcaseSampleComponent { + private propertyChangeService = inject(PropertyChangeService); + private destroyRef = inject(DestroyRef); + protected items: any[] = []; public valueKeyVar = 'field'; @@ -91,9 +94,7 @@ export class ComboShowcaseSampleComponent { public properties: Properties; - constructor( - private propertyChangeService: PropertyChangeService, - private destroyRef: DestroyRef) { + constructor() { const division = { 'New England 01': ['Connecticut', 'Maine', 'Massachusetts'], 'New England 02': ['New Hampshire', 'Rhode Island', 'Vermont'], diff --git a/src/app/combo/combo.sample.ts b/src/app/combo/combo.sample.ts index 19dcb3a814a..627245f3e40 100644 --- a/src/app/combo/combo.sample.ts +++ b/src/app/combo/combo.sample.ts @@ -1,12 +1,4 @@ -import { - AfterViewInit, - ChangeDetectorRef, - Component, - ElementRef, - OnInit, - TemplateRef, - ViewChild, -} from '@angular/core'; +import { AfterViewInit, ChangeDetectorRef, Component, ElementRef, OnInit, TemplateRef, ViewChild, inject } from '@angular/core'; import { UntypedFormBuilder, UntypedFormControl, @@ -75,6 +67,9 @@ import { scaleInCenter, scaleOutCenter } from 'igniteui-angular/animations'; ] }) export class ComboSampleComponent implements OnInit, AfterViewInit { + private remoteService = inject(RemoteNWindService); + cdr = inject(ChangeDetectorRef); + @ViewChild('playgroundCombo', { static: true }) public igxCombo: IgxComboComponent; @@ -133,11 +128,9 @@ export class ComboSampleComponent implements OnInit, AfterViewInit { private overlaySettings: OverlaySettings[] = [null, null, null, null]; private initialItemTemplate: TemplateRef = null; - constructor( - private remoteService: RemoteNWindService, - public cdr: ChangeDetectorRef, - fb: UntypedFormBuilder - ) { + constructor() { + const fb = inject(UntypedFormBuilder); + this.user = fb.group({ date: [''], dateTime: [''], diff --git a/src/app/combo/remote-nwind.service.ts b/src/app/combo/remote-nwind.service.ts index b2b3b275729..61b679a9163 100644 --- a/src/app/combo/remote-nwind.service.ts +++ b/src/app/combo/remote-nwind.service.ts @@ -1,14 +1,16 @@ import { HttpClient } from '@angular/common/http'; -import { Injectable } from '@angular/core'; +import { Injectable, inject } from '@angular/core'; import { IForOfState } from 'igniteui-angular'; import { BehaviorSubject } from 'rxjs'; @Injectable({ providedIn: 'root' }) export class RemoteNWindService { + private http = inject(HttpClient); + public remoteData: BehaviorSubject; private url = 'https://services.odata.org/V4/Northwind/Northwind.svc/Products'; - constructor(private http: HttpClient) { + constructor() { this.remoteData = new BehaviorSubject([]); } diff --git a/src/app/date-picker/date-picker.sample.ts b/src/app/date-picker/date-picker.sample.ts index ee36f3bc953..fe388d09ad8 100644 --- a/src/app/date-picker/date-picker.sample.ts +++ b/src/app/date-picker/date-picker.sample.ts @@ -1,4 +1,4 @@ -import { Component, CUSTOM_ELEMENTS_SCHEMA, DestroyRef } from '@angular/core'; +import { Component, CUSTOM_ELEMENTS_SCHEMA, DestroyRef, inject } from '@angular/core'; import { IGX_DATE_PICKER_DIRECTIVES, IgxButtonDirective, @@ -42,6 +42,9 @@ registerIconFromText('alarm', alarm); ], }) export class DatePickerSampleComponent { + private propertyChangeService = inject(PropertyChangeService); + private destroyRef = inject(DestroyRef); + public date1 = new Date(); public date2 = new Date( new Date( @@ -146,10 +149,7 @@ export class DatePickerSampleComponent { public properties: Properties; - constructor( - private propertyChangeService: PropertyChangeService, - private destroyRef: DestroyRef - ) { + constructor() { this.propertyChangeService.setPanelConfig(this.panelConfig); const propertyChange = diff --git a/src/app/date-range/date-range.sample.ts b/src/app/date-range/date-range.sample.ts index 52a26f19be6..0fddcf33758 100644 --- a/src/app/date-range/date-range.sample.ts +++ b/src/app/date-range/date-range.sample.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild } from '@angular/core'; +import { Component, ViewChild, inject } from '@angular/core'; import { JsonPipe } from '@angular/common'; import { UntypedFormGroup, UntypedFormBuilder, Validators, UntypedFormControl, ValidatorFn, AbstractControl, FormsModule, ReactiveFormsModule } from '@angular/forms'; import { DateRange, IgxButtonDirective, IgxDateRangeEndComponent, IgxDateRangePickerComponent, IgxDateRangeStartComponent, IgxDateTimeEditorDirective, IgxIconComponent, IgxInputDirective, IgxLabelDirective, IgxPickerToggleComponent, IgxPrefixDirective, IgxRadioComponent, IgxRippleDirective, IgxSuffixDirective, IGX_INPUT_GROUP_TYPE, IChangeCheckboxEventArgs } from 'igniteui-angular'; @@ -37,7 +37,9 @@ export class DateRangeSampleComponent { public updateOnOptions: string[] = ['change', 'blur', 'submit']; public updateOn = 'blur'; - constructor(fb: UntypedFormBuilder) { + constructor() { + const fb = inject(UntypedFormBuilder); + const today = new Date(); const in5days = new Date(); in5days.setDate(today.getDate() + 5); diff --git a/src/app/dialog/dialog.sample.ts b/src/app/dialog/dialog.sample.ts index 8366ba7f543..a4525c0faed 100644 --- a/src/app/dialog/dialog.sample.ts +++ b/src/app/dialog/dialog.sample.ts @@ -1,4 +1,4 @@ -import { Component, CUSTOM_ELEMENTS_SCHEMA, DestroyRef } from '@angular/core'; +import { Component, CUSTOM_ELEMENTS_SCHEMA, DestroyRef, inject } from '@angular/core'; import { IgxButtonDirective, IGX_DIALOG_DIRECTIVES, @@ -62,6 +62,9 @@ icons.forEach((icon) => { ], }) export class DialogSampleComponent { + private propertyChangeService = inject(PropertyChangeService); + private destroyRef = inject(DestroyRef); + public panelConfig: PropertyPanelConfig = { keepOpenOnEscape: { label: 'Keep Open on Escape', @@ -85,10 +88,7 @@ export class DialogSampleComponent { public properties: Properties; - constructor( - private propertyChangeService: PropertyChangeService, - private destroyRef: DestroyRef - ) { + constructor() { this.propertyChangeService.setPanelConfig(this.panelConfig); const propertyChange = diff --git a/src/app/dockmanager-grid/dockmanager-grid.sample.ts b/src/app/dockmanager-grid/dockmanager-grid.sample.ts index a48674c5f65..18c3a1b3f45 100644 --- a/src/app/dockmanager-grid/dockmanager-grid.sample.ts +++ b/src/app/dockmanager-grid/dockmanager-grid.sample.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, CUSTOM_ELEMENTS_SCHEMA, ChangeDetectorRef, Component, DoCheck, ElementRef, EventEmitter, HostBinding, Input, OnDestroy, OnInit, Output, Renderer2, TemplateRef, ViewChild, ViewContainerRef, ViewEncapsulation } from '@angular/core'; +import { AfterViewInit, CUSTOM_ELEMENTS_SCHEMA, ChangeDetectorRef, Component, DoCheck, ElementRef, EventEmitter, HostBinding, Input, OnDestroy, OnInit, Output, Renderer2, TemplateRef, ViewChild, ViewContainerRef, ViewEncapsulation, inject } from '@angular/core'; import { AbsoluteScrollStrategy, ConnectedPositioningStrategy, DefaultSortingStrategy, GridColumnDataType, IGX_BUTTON_GROUP_DIRECTIVES, IGX_GRID_DIRECTIVES, IgxColumnComponent, IgxGridComponent, IgxIconModule, IgxOverlayOutletDirective, IgxSelectComponent, IgxSelectModule, IgxSwitchModule, OverlaySettings, SortingDirection } from 'igniteui-angular'; import { IgcDockManagerLayout, IgcDockManagerPaneType, IgcSplitPane, IgcSplitPaneOrientation } from 'igniteui-dockmanager'; import { defineCustomElements } from 'igniteui-dockmanager/loader'; @@ -61,6 +61,11 @@ export class DockSlotComponent implements AfterViewInit, OnDestroy { schemas: [CUSTOM_ELEMENTS_SCHEMA], }) export class GridDockManagerSampleComponent implements OnInit, OnDestroy, AfterViewInit, DoCheck { + dataService = inject(SignalRService); + private cdr = inject(ChangeDetectorRef); + private elementRef = inject(ElementRef); + private renderer = inject(Renderer2); + @ViewChild('grid1', { static: true }) public grid1: IgxGridComponent; @ViewChild('grid2', { static: true }) public grid2: IgxGridComponent; @ViewChild('host', { read: ViewContainerRef }) public host: ViewContainerRef; @@ -194,8 +199,6 @@ export class GridDockManagerSampleComponent implements OnInit, OnDestroy, AfterV private destroy$ = new Subject(); - constructor(public dataService: SignalRService, private cdr: ChangeDetectorRef, private elementRef: ElementRef, private renderer:Renderer2) {} - public ngOnInit() { this.dataService.startConnection(this.frequency, this.dataVolume, true, false); this.data = this.dataService.data; diff --git a/src/app/dockmanager-grid/signal-r.service.ts b/src/app/dockmanager-grid/signal-r.service.ts index 42d7f747b8a..eb32193a8a9 100644 --- a/src/app/dockmanager-grid/signal-r.service.ts +++ b/src/app/dockmanager-grid/signal-r.service.ts @@ -1,4 +1,4 @@ -import { Injectable, NgZone, OnDestroy } from '@angular/core'; +import { Injectable, NgZone, OnDestroy, inject } from '@angular/core'; import * as signalR from '@microsoft/signalr'; import { BehaviorSubject } from 'rxjs'; import { FinancialData, Stock } from '../shared/financialData2'; @@ -7,12 +7,14 @@ import { FinancialData, Stock } from '../shared/financialData2'; providedIn: 'root' }) export class SignalRService implements OnDestroy { + private zone = inject(NgZone); + public data: BehaviorSubject; public hasRemoteConnection: boolean; private hubConnection!: signalR.HubConnection; private _timer!: ReturnType; - constructor(private zone: NgZone) { + constructor() { this.data = new BehaviorSubject([] as Stock[]); } diff --git a/src/app/drag-drop/drag-drop.sample.ts b/src/app/drag-drop/drag-drop.sample.ts index ee4f7874798..45ec8a22c2e 100644 --- a/src/app/drag-drop/drag-drop.sample.ts +++ b/src/app/drag-drop/drag-drop.sample.ts @@ -1,4 +1,4 @@ -import { ChangeDetectorRef, Component, ViewChild, ElementRef, ViewChildren, QueryList } from '@angular/core'; +import { ChangeDetectorRef, Component, ViewChild, ElementRef, ViewChildren, QueryList, inject } from '@angular/core'; import { NgClass, NgStyle } from '@angular/common'; import { ShadowGridSampleComponent } from './shadow-dom-grid/shadow-grid-sample'; @@ -17,6 +17,8 @@ import { DragDirection, GlobalPositionStrategy, IDragBaseEventArgs, IDragStartEv ] }) export class DragDropSampleComponent { + private cdr = inject(ChangeDetectorRef); + @ViewChild('dragNoGhostAnim', { read: IgxDragDirective, static: true }) public dragNoGhostAnim: IgxDragDirective; @@ -140,9 +142,6 @@ export class DragDropSampleComponent { closeOnOutsideClick: true }; - constructor(private cdr: ChangeDetectorRef) { - } - public onDragStart() { this.draggingElem = true; this.cdr.detectChanges(); diff --git a/src/app/drop-down/drop-down-virtual/drop-down-virtual.component.ts b/src/app/drop-down/drop-down-virtual/drop-down-virtual.component.ts index cc2fb24c1e9..c6e09b32716 100644 --- a/src/app/drop-down/drop-down-virtual/drop-down-virtual.component.ts +++ b/src/app/drop-down/drop-down-virtual/drop-down-virtual.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, AfterViewInit, ChangeDetectorRef } from '@angular/core'; +import { Component, OnInit, ViewChild, AfterViewInit, ChangeDetectorRef, inject } from '@angular/core'; import { AsyncPipe } from '@angular/common'; import { Observable } from 'rxjs'; @@ -18,6 +18,9 @@ interface DataItem { imports: [IgxButtonDirective, IgxToggleActionDirective, IgxDropDownItemNavigationDirective, IgxDropDownComponent, IgxForOfDirective, IgxDropDownItemComponent, IgxToastComponent, AsyncPipe] }) export class DropDownVirtualComponent implements OnInit, AfterViewInit { + protected remoteService = inject(RemoteService); + protected cdr = inject(ChangeDetectorRef); + @ViewChild('loadingToast', { read: IgxToastComponent, static: true }) public loadingToast: IgxToastComponent; @ViewChild('asyncFor', { read: IgxForOfDirective, static: true }) @@ -32,7 +35,7 @@ export class DropDownVirtualComponent implements OnInit, AfterViewInit { public itemHeight = 40; public itemsMaxHeight = 320; - constructor(protected remoteService: RemoteService, protected cdr: ChangeDetectorRef) { + constructor() { this.remoteService.urlBuilder = (state) => { const chunkSize = state.chunkSize || Math.floor(this.itemsMaxHeight / this.itemHeight) + 1; return `${this.remoteService.url}?$count=true&$skip=${state.startIndex}&$top=${chunkSize}`; diff --git a/src/app/drop-down/drop-down.sample.ts b/src/app/drop-down/drop-down.sample.ts index 582819db69f..efb851b8ac3 100644 --- a/src/app/drop-down/drop-down.sample.ts +++ b/src/app/drop-down/drop-down.sample.ts @@ -1,11 +1,4 @@ -import { - Component, - OnInit, - ViewChild, - ElementRef, - CUSTOM_ELEMENTS_SCHEMA, - DestroyRef, -} from '@angular/core'; +import { Component, OnInit, ViewChild, ElementRef, CUSTOM_ELEMENTS_SCHEMA, DestroyRef, inject } from '@angular/core'; import { foods } from './foods'; import { BlockScrollStrategy, @@ -85,6 +78,9 @@ icons.forEach((icon) => { schemas: [CUSTOM_ELEMENTS_SCHEMA] }) export class DropDownSampleComponent implements OnInit { + private propertyChangeService = inject(PropertyChangeService); + private destroyRef = inject(DestroyRef); + @ViewChild(IgxDropDownComponent, { static: true }) private igxDropDown: IgxDropDownComponent; @ViewChild('dropdown3', { static: true }) @@ -156,10 +152,7 @@ export class DropDownSampleComponent implements OnInit { public properties: Properties; - constructor( - private propertyChangeService: PropertyChangeService, - private destroyRef: DestroyRef - ) { + constructor() { this.propertyChangeService.setPanelConfig(this.panelConfig); const propertyChange = diff --git a/src/app/expansion-panel/expansion-panel-sample.ts b/src/app/expansion-panel/expansion-panel-sample.ts index ba8721e2a48..c142b780d66 100644 --- a/src/app/expansion-panel/expansion-panel-sample.ts +++ b/src/app/expansion-panel/expansion-panel-sample.ts @@ -1,4 +1,4 @@ -import { Component, CUSTOM_ELEMENTS_SCHEMA, DestroyRef } from '@angular/core'; +import { Component, CUSTOM_ELEMENTS_SCHEMA, DestroyRef, inject } from '@angular/core'; import { IGX_EXPANSION_PANEL_DIRECTIVES } from 'igniteui-angular'; import { Properties, @@ -21,6 +21,9 @@ defineComponents(IgcExpansionPanelComponent); imports: [IGX_EXPANSION_PANEL_DIRECTIVES] }) export class ExpansionPanelSampleComponent { + private propertyChangeService = inject(PropertyChangeService); + private destroyRef = inject(DestroyRef); + public panelConfig: PropertyPanelConfig = { iconPosition: { label: 'Indicator Position', @@ -45,10 +48,7 @@ export class ExpansionPanelSampleComponent { public properties: Properties; - constructor( - private propertyChangeService: PropertyChangeService, - private destroyRef: DestroyRef - ) { + constructor() { this.propertyChangeService.setPanelConfig(this.panelConfig); const propertyChange = diff --git a/src/app/grid-cell-api/grid-cell-api.sample.ts b/src/app/grid-cell-api/grid-cell-api.sample.ts index 6959ea29f40..c5aee7317d6 100644 --- a/src/app/grid-cell-api/grid-cell-api.sample.ts +++ b/src/app/grid-cell-api/grid-cell-api.sample.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, Renderer2 } from '@angular/core'; +import { Component, OnInit, Renderer2, inject } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { IgxGridComponent, @@ -26,6 +26,8 @@ import { HIERARCHICAL_SAMPLE_DATA, SAMPLE_DATA } from '../shared/sample-data'; }) export class GridCellAPISampleComponent implements OnInit { + private renderer = inject(Renderer2); + public data2: any; public data: any[]; public treeGridHierData: any[]; @@ -53,8 +55,6 @@ export class GridCellAPISampleComponent implements OnInit { public selectedCell: CellType; - constructor(private renderer: Renderer2) { } - public ngOnInit(): void { this.columns = [ { field: 'ID', width: '200px', hidden: false }, diff --git a/src/app/grid-column-actions/custom-action-directive.ts b/src/app/grid-column-actions/custom-action-directive.ts index a43959320d1..31fa53baa4f 100644 --- a/src/app/grid-column-actions/custom-action-directive.ts +++ b/src/app/grid-column-actions/custom-action-directive.ts @@ -1,4 +1,4 @@ -import { Directive, Inject } from '@angular/core'; +import { Directive, inject } from '@angular/core'; import { IgxColumnActionsBaseDirective, IgxColumnActionsComponent, IgxColumnComponent, SortingDirection } from 'igniteui-angular'; @@ -8,11 +8,13 @@ import { IgxColumnActionsBaseDirective, IgxColumnActionsComponent, IgxColumnComp standalone: true }) export class IgxColumnGroupingDirective extends IgxColumnActionsBaseDirective { + protected columnActions = inject(IgxColumnActionsComponent); - constructor( - @Inject(IgxColumnActionsComponent) protected columnActions: IgxColumnActionsComponent - ) { + + constructor() { super(); + const columnActions = this.columnActions; + columnActions.actionsDirective = this; } diff --git a/src/app/grid-column-selection/grid-column-selection.sample.ts b/src/app/grid-column-selection/grid-column-selection.sample.ts index f3e810f4971..9f8fc69a20a 100644 --- a/src/app/grid-column-selection/grid-column-selection.sample.ts +++ b/src/app/grid-column-selection/grid-column-selection.sample.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, OnInit, Pipe, PipeTransform, AfterViewInit, ChangeDetectorRef, HostBinding } from '@angular/core'; +import { Component, ViewChild, OnInit, Pipe, PipeTransform, AfterViewInit, ChangeDetectorRef, HostBinding, inject } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { SAMPLE_DATA } from '../shared/sample-data'; @@ -64,6 +64,8 @@ export class GridColumnSelectionFilterPipe implements PipeTransform { imports: [IgxButtonDirective, IgxToggleActionDirective, IgxDropDownItemNavigationDirective, IgxDropDownComponent, IgxDropDownItemComponent, IgxButtonGroupComponent, IgxGridComponent, IgxGridToolbarComponent, IgxGridToolbarActionsComponent, IgxGridToolbarPinningComponent, IgxGridToolbarHidingComponent, IgxPaginatorComponent, IgxRippleDirective, IgxCheckboxComponent, IgxInputGroupComponent, FormsModule, IgxInputDirective, IgxColumnComponent, IgxColumnGroupComponent, IgxSwitchComponent, GridColumnSelectionFilterPipe, IgxLabelDirective, IgxIconComponent, IgxSuffixDirective, IgxGridToolbarTitleComponent] }) export class GridColumnSelectionSampleComponent implements OnInit, AfterViewInit { + private cdr = inject(ChangeDetectorRef); + @HostBinding('style.--ig-size') protected get sizeStyle() { return `var(--ig-size-${this.size})`; @@ -111,8 +113,6 @@ export class GridColumnSelectionSampleComponent implements OnInit, AfterViewInit closeOnOutsideClick: true }; - constructor(private cdr: ChangeDetectorRef) {} - public log(event) { console.log(event); } diff --git a/src/app/grid-column-types/grid-column-types.sample.ts b/src/app/grid-column-types/grid-column-types.sample.ts index bed49200f90..a398eaa3423 100644 --- a/src/app/grid-column-types/grid-column-types.sample.ts +++ b/src/app/grid-column-types/grid-column-types.sample.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, OnInit } from '@angular/core'; +import { Component, ViewChild, OnInit, inject } from '@angular/core'; import { FilterMode, IgxButtonGroupComponent, IgxColumnComponent, IgxGridComponent, IgxGridToolbarActionsComponent, IgxGridToolbarAdvancedFilteringComponent, IgxGridToolbarComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent, IgxIconService } from 'igniteui-angular'; import { SAMPLE_DATA } from '../shared/sample-data'; @@ -10,6 +10,8 @@ import { SAMPLE_DATA } from '../shared/sample-data'; imports: [IgxButtonGroupComponent, IgxGridComponent, IgxGridToolbarComponent, IgxGridToolbarActionsComponent, IgxGridToolbarPinningComponent, IgxGridToolbarHidingComponent, IgxGridToolbarAdvancedFilteringComponent, IgxColumnComponent] }) export class GridColumnTypesSampleComponent implements OnInit { + private _iconService = inject(IgxIconService); + @ViewChild('grid1', { static: true }) public grid1: IgxGridComponent; public data: Array; @@ -55,9 +57,6 @@ export class GridColumnTypesSampleComponent implements OnInit { available: true }]; - constructor(private _iconService: IgxIconService) { - } - public log(event) { console.log(event); } diff --git a/src/app/grid-events/grid-events.component.ts b/src/app/grid-events/grid-events.component.ts index d84b89fee23..96d0cdaf040 100644 --- a/src/app/grid-events/grid-events.component.ts +++ b/src/app/grid-events/grid-events.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ElementRef, Renderer2 } from '@angular/core'; +import { Component, ViewChild, ElementRef, Renderer2, inject } from '@angular/core'; import { IgxGridComponent, ISortingExpression, IPinColumnEventArgs, @@ -30,6 +30,8 @@ import { data } from '../shared/data'; imports: [IgxSwitchComponent, IgxInputGroupComponent, IgxInputDirective, IgxGridComponent, IgxGridToolbarComponent, IgxGridToolbarActionsComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent, IgxGridToolbarAdvancedFilteringComponent, IgxColumnComponent, IgxPaginatorComponent, IgxButtonDirective, IgxIconComponent] }) export class GridEventsComponent { + private renderer = inject(Renderer2); + @ViewChild('grid1', { read: IgxGridComponent, static: true }) public grid: IgxGridComponent; @ViewChild('logger') public logger: ElementRef; @@ -44,7 +46,7 @@ export class GridEventsComponent { public $moving = false; public localData: any[]; - constructor(private renderer: Renderer2) { + constructor() { this.localData = data; } diff --git a/src/app/grid-external-filtering/grid-external-filtering.sample.ts b/src/app/grid-external-filtering/grid-external-filtering.sample.ts index 1be13309e4b..312a128bcd0 100644 --- a/src/app/grid-external-filtering/grid-external-filtering.sample.ts +++ b/src/app/grid-external-filtering/grid-external-filtering.sample.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, OnInit, AfterViewInit, ChangeDetectorRef, HostBinding } from '@angular/core'; +import { Component, ViewChild, OnInit, AfterViewInit, ChangeDetectorRef, HostBinding, inject } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { FilterMode, FilteringExpressionsTree, FilteringLogic, GridSelectionMode, IChangeCheckboxEventArgs, IgxAdvancedFilteringDialogComponent, IgxButtonDirective, IgxButtonGroupComponent, IgxCSVTextDirective, IgxCheckboxComponent, IgxColumnComponent, IgxExcelTextDirective, IgxFlexDirective, IgxGridComponent, IgxGridExcelStyleFilteringComponent, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarExporterComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent, IgxLabelDirective, IgxLayoutDirective, IgxSelectComponent, IgxSelectItemComponent, IgxStringFilteringOperand } from 'igniteui-angular'; @@ -11,6 +11,8 @@ import { FilterMode, FilteringExpressionsTree, FilteringLogic, GridSelectionMode imports: [IgxFlexDirective, IgxLayoutDirective, IgxButtonGroupComponent, IgxSelectComponent, IgxLabelDirective, IgxSelectItemComponent, IgxGridExcelStyleFilteringComponent, IgxGridComponent, IgxGridToolbarComponent, IgxGridToolbarActionsComponent, IgxGridToolbarPinningComponent, IgxGridToolbarHidingComponent, IgxGridToolbarExporterComponent, IgxExcelTextDirective, IgxCSVTextDirective, IgxColumnComponent, IgxAdvancedFilteringDialogComponent, IgxCheckboxComponent, FormsModule, IgxButtonDirective] }) export class GridExternalFilteringComponent implements OnInit, AfterViewInit { + private cdr = inject(ChangeDetectorRef); + @HostBinding('style.--ig-size') protected get sizeStyle() { return `var(--ig-size-${this.size})`; @@ -28,9 +30,6 @@ export class GridExternalFilteringComponent implements OnInit, AfterViewInit { public size = 'large'; public selectionMode; - constructor(private cdr: ChangeDetectorRef) { - } - public ngAfterViewInit(): void { const tree = new FilteringExpressionsTree(FilteringLogic.And); tree.filteringOperands.push({ diff --git a/src/app/grid-finjs/main.component.ts b/src/app/grid-finjs/main.component.ts index b30705273f4..fde00ef87fc 100644 --- a/src/app/grid-finjs/main.component.ts +++ b/src/app/grid-finjs/main.component.ts @@ -1,4 +1,4 @@ -import { Component, EventEmitter, OnDestroy, Output, ViewChild } from '@angular/core'; +import { Component, EventEmitter, OnDestroy, Output, ViewChild, inject } from '@angular/core'; import { AsyncPipe } from '@angular/common'; import { Subject } from 'rxjs'; @@ -16,6 +16,8 @@ import { GridFinJSComponent } from './grid-finjs.component'; imports: [ControllerComponent, GridFinJSComponent, AsyncPipe] }) export class MainComponent implements OnDestroy { + finService = inject(LocalService); + @ViewChild('grid', { static: true }) public finGrid: GridFinJSComponent; @ViewChild('controllers', { static: true }) public controller: ControllerComponent; @@ -31,7 +33,7 @@ export class MainComponent implements OnDestroy { private destroy$ = new Subject(); private _timer; - constructor(public finService: LocalService) { + constructor() { this.finService.getFinancialData(this.volume); this.data$ = this.finService.records.pipe(takeUntil(this.destroy$)); } diff --git a/src/app/grid-formatting/grid-formatting.component.ts b/src/app/grid-formatting/grid-formatting.component.ts index 49793ff801f..3ee8a86a412 100644 --- a/src/app/grid-formatting/grid-formatting.component.ts +++ b/src/app/grid-formatting/grid-formatting.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, OnInit, AfterViewInit } from '@angular/core'; +import { Component, ViewChild, OnInit, AfterViewInit, inject } from '@angular/core'; import { DatePipe, AsyncPipe } from '@angular/common'; import { Observable } from 'rxjs'; @@ -18,6 +18,8 @@ const ORDERS_URl = 'https://services.odata.org/V4/Northwind/Northwind.svc/Orders imports: [IgxGridComponent, IgxColumnComponent, IgxPaginatorComponent, IgxTreeGridComponent, AsyncPipe] }) export class GridFormattingComponent implements OnInit, AfterViewInit { + private remoteService = inject(RemoteService); + @ViewChild('grid1', { read: IgxGridComponent, static: true }) public gridLocal: IgxGridComponent; @@ -44,7 +46,7 @@ export class GridFormattingComponent implements OnInit, AfterViewInit { public formatOptions = this.options2; public earliest = EarliestSummary; - constructor(private remoteService: RemoteService) { + constructor() { this.localData = data; } diff --git a/src/app/grid-multi-row-layout-config/grid-mrl-config.sample.ts b/src/app/grid-multi-row-layout-config/grid-mrl-config.sample.ts index 0cfa14f46de..154256d7999 100644 --- a/src/app/grid-multi-row-layout-config/grid-mrl-config.sample.ts +++ b/src/app/grid-multi-row-layout-config/grid-mrl-config.sample.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ElementRef, ChangeDetectorRef, ViewChildren, QueryList } from '@angular/core'; +import { Component, ViewChild, ElementRef, ChangeDetectorRef, ViewChildren, QueryList, inject } from '@angular/core'; import { NgStyle } from '@angular/common'; import { SAMPLE_DATA } from '../shared/sample-data'; @@ -22,6 +22,8 @@ interface ColumnConfig { imports: [IgxDragDirective, NgStyle, IgxDropDirective, IgxButtonDirective, IgxGridComponent, IgxColumnLayoutComponent, IgxColumnComponent, IgxDialogComponent] }) export class GridMRLConfigSampleComponent { + cdr = inject(ChangeDetectorRef); + @ViewChild('jsonDialog', { read: IgxDialogComponent, static: true }) public jsonDialog: IgxDialogComponent; @@ -78,7 +80,7 @@ export class GridMRLConfigSampleComponent { public data = SAMPLE_DATA; - constructor(public cdr: ChangeDetectorRef) { + constructor() { this.updateCollectionSize(); this.selectionMode = GridSelectionMode.none; } diff --git a/src/app/grid-remote-paging/grid-remote-paging.sample.ts b/src/app/grid-remote-paging/grid-remote-paging.sample.ts index 21a3853e39a..91b30fa2cc0 100644 --- a/src/app/grid-remote-paging/grid-remote-paging.sample.ts +++ b/src/app/grid-remote-paging/grid-remote-paging.sample.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, Component, OnDestroy, OnInit, ViewChild } from '@angular/core'; +import { AfterViewInit, Component, OnDestroy, OnInit, ViewChild, inject } from '@angular/core'; import { AsyncPipe } from '@angular/common'; import { FormsModule } from '@angular/forms'; @@ -13,6 +13,8 @@ import { GridPagingMode, IgxButtonDirective, IgxCardComponent, IgxCardContentDir imports: [IGX_GRID_DIRECTIVES, IgxPaginatorComponent, IgxCardComponent, IgxCardHeaderComponent, IgxCardHeaderTitleDirective, IgxCardContentDirective, IgxButtonDirective, IgxSelectComponent, FormsModule, IgxSelectItemComponent, AsyncPipe] }) export class GridRemotePagingSampleComponent implements OnInit, AfterViewInit, OnDestroy { + private remoteService = inject(RemoteService); + @ViewChild('grid1', { static: true }) public grid1: IgxGridComponent; public mode: GridPagingMode = 'remote'; @@ -27,9 +29,6 @@ export class GridRemotePagingSampleComponent implements OnInit, AfterViewInit, O private _perPage = 15; private _dataLengthSubscriber; - constructor(private remoteService: RemoteService) { - } - public get perPage(): number { return this._perPage; } diff --git a/src/app/grid-remote-virtualization-with-scroll/grid-remote-virtualization-scroll.sample.ts b/src/app/grid-remote-virtualization-with-scroll/grid-remote-virtualization-scroll.sample.ts index 7e494841855..bb4e35e5504 100644 --- a/src/app/grid-remote-virtualization-with-scroll/grid-remote-virtualization-scroll.sample.ts +++ b/src/app/grid-remote-virtualization-with-scroll/grid-remote-virtualization-scroll.sample.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectorRef, OnInit, AfterViewInit } from '@angular/core'; +import { Component, ViewChild, ChangeDetectorRef, OnInit, AfterViewInit, inject } from '@angular/core'; import { AsyncPipe } from '@angular/common'; import { IgxColumnComponent, IgxGridComponent } from 'igniteui-angular'; import { debounceTime } from 'rxjs/operators'; @@ -12,6 +12,9 @@ import { RemoteVirtService } from '../shared/remoteProductsData.service'; }) export class GridVirtualizationScrollSampleComponent implements OnInit, AfterViewInit { + private remoteService = inject(RemoteVirtService); + cdr = inject(ChangeDetectorRef); + @ViewChild('grid1', { static: true }) public grid: IgxGridComponent; @@ -27,7 +30,6 @@ export class GridVirtualizationScrollSampleComponent implements OnInit, AfterVie copyFormatters: true, separator: '\t' }; - constructor(private remoteService: RemoteVirtService, public cdr: ChangeDetectorRef) { } public ngOnInit(): void { this.remoteData = this.remoteService.data; diff --git a/src/app/grid-remote-virtualization/grid-remote-virtualization.sample.ts b/src/app/grid-remote-virtualization/grid-remote-virtualization.sample.ts index 5b53302738d..4328f0ba30c 100644 --- a/src/app/grid-remote-virtualization/grid-remote-virtualization.sample.ts +++ b/src/app/grid-remote-virtualization/grid-remote-virtualization.sample.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectorRef, OnInit, AfterViewInit } from '@angular/core'; +import { Component, ViewChild, ChangeDetectorRef, OnInit, AfterViewInit, inject } from '@angular/core'; import { AsyncPipe } from '@angular/common'; import { RemoteService } from '../shared/remote.service'; @@ -11,6 +11,9 @@ import { IgxButtonDirective, IgxGridComponent } from 'igniteui-angular'; imports: [IgxGridComponent, IgxButtonDirective, AsyncPipe] }) export class GridVirtualizationSampleComponent implements OnInit, AfterViewInit { + private remoteService = inject(RemoteService); + cdr = inject(ChangeDetectorRef); + @ViewChild('grid1', { static: true }) public grid: IgxGridComponent; @@ -19,7 +22,7 @@ export class GridVirtualizationSampleComponent implements OnInit, AfterViewInit public columns: any; public loading = true; - constructor(private remoteService: RemoteService, public cdr: ChangeDetectorRef) { + constructor() { this.remoteService.urlBuilder = (dataState) => { let qS = '?'; let requiredChunkSize: number; if (dataState) { diff --git a/src/app/grid-row-api/grid-row-api.sample.ts b/src/app/grid-row-api/grid-row-api.sample.ts index 468a82af5b2..acd16b1fc00 100644 --- a/src/app/grid-row-api/grid-row-api.sample.ts +++ b/src/app/grid-row-api/grid-row-api.sample.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, Renderer2, ViewChild } from '@angular/core'; +import { Component, OnInit, Renderer2, ViewChild, inject } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { HIERARCHICAL_SAMPLE_DATA, SAMPLE_DATA } from '../shared/sample-data'; @@ -12,6 +12,8 @@ import { GridSummaryCalculationMode, GridSummaryPosition, IPinningConfig, IgxBut }) export class GridRowAPISampleComponent implements OnInit { + private renderer = inject(Renderer2); + @ViewChild('grid', { static: true }) private grid: IgxGridComponent; @@ -47,8 +49,6 @@ export class GridRowAPISampleComponent implements OnInit { public pinningConfig: IPinningConfig = { rows: RowPinningPosition.Top }; - constructor(private renderer: Renderer2) { } - public ngOnInit(): void { this.grid.summaryCalculationMode = GridSummaryCalculationMode.childLevelsOnly; this.grid.summaryPosition = GridSummaryPosition.bottom; diff --git a/src/app/grid-row-draggable/grid-row-draggable.sample.ts b/src/app/grid-row-draggable/grid-row-draggable.sample.ts index e23f22a6417..60250f1f65e 100644 --- a/src/app/grid-row-draggable/grid-row-draggable.sample.ts +++ b/src/app/grid-row-draggable/grid-row-draggable.sample.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, ChangeDetectorRef, Component, HostBinding, ViewChild } from '@angular/core'; +import { AfterViewInit, ChangeDetectorRef, Component, HostBinding, ViewChild, inject } from '@angular/core'; import { AsyncPipe } from '@angular/common'; import { FormsModule } from '@angular/forms'; @@ -23,6 +23,9 @@ enum DragIcon { imports: [IgxButtonGroupComponent, IgxSwitchComponent, FormsModule, IgxGridComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxIconComponent, IgxRowDragDirective, IgxRowDragGhostDirective, IgxDropDirective, IgxDragIndicatorIconDirective, IgxGridEmptyTemplateDirective, AsyncPipe] }) export class GridRowDraggableComponent implements AfterViewInit { + private remoteService = inject(RemoteService); + private cdr = inject(ChangeDetectorRef); + @HostBinding('style.--ig-size') protected get sizeStyle() { return `var(--ig-size-${this.size})`; @@ -38,7 +41,7 @@ export class GridRowDraggableComponent implements AfterViewInit { public size = 'large'; public sizes; - constructor(private remoteService: RemoteService, private cdr: ChangeDetectorRef) { + constructor() { this.remoteService.urlBuilder = () => this.remoteService.url; this.sizes = [ diff --git a/src/app/grid-row-pinning/grid-row-pinning.sample.ts b/src/app/grid-row-pinning/grid-row-pinning.sample.ts index bf67ad8bbab..6fd4942c11d 100644 --- a/src/app/grid-row-pinning/grid-row-pinning.sample.ts +++ b/src/app/grid-row-pinning/grid-row-pinning.sample.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, AfterViewInit, HostBinding } from '@angular/core'; +import { Component, OnInit, ViewChild, AfterViewInit, HostBinding, inject } from '@angular/core'; import { IgxGridComponent, @@ -32,6 +32,9 @@ import { SAMPLE_DATA } from '../shared/sample-data'; }) export class GridRowPinningSampleComponent implements OnInit, AfterViewInit { + private iconService = inject(IgxIconService); + private excelExportService = inject(IgxExcelExporterService); + @HostBinding('style.--ig-size') protected get sizeStyle() { return `var(--ig-size-${this.size})`; @@ -65,11 +68,6 @@ export class GridRowPinningSampleComponent implements OnInit, AfterViewInit { public treeColumns: any[]; public treeData: any[]; - constructor( - private iconService: IgxIconService, - private excelExportService: IgxExcelExporterService) { - } - public onRowChange() { if (this.pinningConfig.rows === RowPinningPosition.Bottom) { this.pinningConfig = { columns: this.pinningConfig.columns, rows: RowPinningPosition.Top }; diff --git a/src/app/grid-selection/grid-selection.sample.ts b/src/app/grid-selection/grid-selection.sample.ts index f2b4390b1b9..58fba7db420 100644 --- a/src/app/grid-selection/grid-selection.sample.ts +++ b/src/app/grid-selection/grid-selection.sample.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, ChangeDetectorRef, Component, ViewChild } from '@angular/core'; +import { AfterViewInit, ChangeDetectorRef, Component, ViewChild, inject } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { Observable } from 'rxjs'; @@ -23,6 +23,9 @@ import { data } from '../shared/data'; ] }) export class GridSelectionComponent implements AfterViewInit { + private remoteService = inject(RemoteService); + private cdr = inject(ChangeDetectorRef); + @ViewChild(IgxGridComponent, { static: true }) protected grid1: IgxGridComponent; @@ -30,7 +33,7 @@ export class GridSelectionComponent implements AfterViewInit { public selectionModes = ['none', 'single', 'multiple']; public data = []; - constructor(private remoteService: RemoteService, private cdr: ChangeDetectorRef) { + constructor() { this.remoteService.urlBuilder = () => this.remoteService.url; } diff --git a/src/app/grid-state/grid-state.component.ts b/src/app/grid-state/grid-state.component.ts index 35c9f3e83ca..2cf782e929a 100644 --- a/src/app/grid-state/grid-state.component.ts +++ b/src/app/grid-state/grid-state.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, QueryList, ViewChildren, TemplateRef } from '@angular/core'; +import { Component, OnInit, ViewChild, QueryList, ViewChildren, TemplateRef, inject } from '@angular/core'; import { NgTemplateOutlet } from '@angular/common'; import { Router, RouterLink } from '@angular/router'; import { FormsModule } from '@angular/forms'; @@ -54,6 +54,8 @@ interface GridState { imports: [IgxColumnLayoutComponent, IgxExpansionPanelComponent, IgxCellHeaderTemplateDirective, IgxExpansionPanelHeaderComponent, IgxExpansionPanelTitleDirective, IgxExpansionPanelIconDirective, IgxExpansionPanelBodyComponent, NgTemplateOutlet, IgxGridComponent, IgxGridStateDirective, IgxGridToolbarComponent, IgxGridToolbarActionsComponent, IgxGridToolbarPinningComponent, IgxGridToolbarHidingComponent, IgxGridToolbarAdvancedFilteringComponent, IgxColumnComponent, IgxGridDetailTemplateDirective, IgxPaginatorComponent, IgxTooltipDirective, IgxColumnGroupComponent, IgxHierarchicalGridComponent, IgxRowIslandComponent, IgxTreeGridComponent, RouterLink, IgxTooltipTargetDirective, IgxIconComponent, IgxSwitchComponent, FormsModule, IgxButtonDirective, IgxCellTemplateDirective] }) export class GridSaveStateComponent implements OnInit { + private router = inject(Router); + @ViewChild(IgxExpansionPanelComponent, { static: true }) private igxExpansionPanel: IgxExpansionPanelComponent; @ViewChildren(IgxGridStateDirective) @@ -123,8 +125,6 @@ export class GridSaveStateComponent implements OnInit { { field: 'ProductName', header: 'Product Name', width: 300, resizable: true, sortable: true, filterable: true, movable: true, dataType: 'string', hasSummary: false } ]; - constructor(private router: Router) { } - public ngOnInit() { this.router.events.pipe(take(1)).subscribe(() => { this.saveGridState(null); diff --git a/src/app/grid/grid.sample.ts b/src/app/grid/grid.sample.ts index fc94203ef0a..b2f66943305 100644 --- a/src/app/grid/grid.sample.ts +++ b/src/app/grid/grid.sample.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, AfterViewInit } from '@angular/core'; +import { Component, OnInit, ViewChild, AfterViewInit, inject } from '@angular/core'; import { Observable } from 'rxjs'; import { AsyncPipe } from '@angular/common'; import { FormsModule } from '@angular/forms'; @@ -29,6 +29,11 @@ import { CsvFileTypes, DefaultSortingStrategy, GridSelectionMode, IgxBaseExporte ] }) export class GridSampleComponent implements OnInit, AfterViewInit { + private localService = inject(LocalService); + private remoteService = inject(RemoteService); + private excelExporterService = inject(IgxExcelExporterService); + private csvExporterService = inject(IgxCsvExporterService); + @ViewChild('grid1', { static: true }) private grid1: IgxGridComponent; @@ -57,10 +62,7 @@ export class GridSampleComponent implements OnInit, AfterViewInit { public gridPaging = true; public perPage = 10; - constructor(private localService: LocalService, - private remoteService: RemoteService, - private excelExporterService: IgxExcelExporterService, - private csvExporterService: IgxCsvExporterService) { + constructor() { this.localService.url = this.remoteService.url; diff --git a/src/app/hierarchical-grid-add-row/hierarchical-grid-add-row.sample.ts b/src/app/hierarchical-grid-add-row/hierarchical-grid-add-row.sample.ts index b410f8a24ed..c0f3a45436c 100644 --- a/src/app/hierarchical-grid-add-row/hierarchical-grid-add-row.sample.ts +++ b/src/app/hierarchical-grid-add-row/hierarchical-grid-add-row.sample.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectorRef, AfterViewInit } from '@angular/core'; +import { Component, ChangeDetectorRef, AfterViewInit, inject } from '@angular/core'; import { IgxActionStripComponent, IgxGridEditingActionsComponent, IgxGridPinningActionsComponent, IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular'; @Component({ @@ -7,11 +7,13 @@ import { IgxActionStripComponent, IgxGridEditingActionsComponent, IgxGridPinning imports: [IgxHierarchicalGridComponent, IgxActionStripComponent, IgxGridPinningActionsComponent, IgxGridEditingActionsComponent, IgxRowIslandComponent] }) export class HierarchicalGridAddRowSampleComponent implements AfterViewInit { + private cdr = inject(ChangeDetectorRef); + public localData = []; public columns; public childColumns; - constructor(private cdr: ChangeDetectorRef) { + constructor() { this.localData = this.generateDataUneven(100, 3); this.localData[0].hasChild = false; this.localData[1].hasChild = false; diff --git a/src/app/hierarchical-grid-advanced-filtering/hierarchical-grid-advanced-filtering.sample.ts b/src/app/hierarchical-grid-advanced-filtering/hierarchical-grid-advanced-filtering.sample.ts index 5e3eff812c3..71df17a3130 100644 --- a/src/app/hierarchical-grid-advanced-filtering/hierarchical-grid-advanced-filtering.sample.ts +++ b/src/app/hierarchical-grid-advanced-filtering/hierarchical-grid-advanced-filtering.sample.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectorRef, AfterViewInit } from '@angular/core'; +import { Component, ViewChild, ChangeDetectorRef, AfterViewInit, inject } from '@angular/core'; import { IgxHierarchicalGridComponent, IGX_HIERARCHICAL_GRID_DIRECTIVES, @@ -17,12 +17,14 @@ import { SINGERS } from './data'; imports: [IGX_HIERARCHICAL_GRID_DIRECTIVES] }) export class HierarchicalGridAdvancedFilteringSampleComponent implements AfterViewInit { + private cdr = inject(ChangeDetectorRef); + @ViewChild('hierarchicalGrid', { static: true }) private hierarchicalGrid: IgxHierarchicalGridComponent; public localData = []; - constructor(private cdr: ChangeDetectorRef) { + constructor() { this.localData = SINGERS; } diff --git a/src/app/hierarchical-grid-remote-virtualization/hierarchical-grid-remote-virtualization.ts b/src/app/hierarchical-grid-remote-virtualization/hierarchical-grid-remote-virtualization.ts index bd5345ae2a1..029915e1dc3 100644 --- a/src/app/hierarchical-grid-remote-virtualization/hierarchical-grid-remote-virtualization.ts +++ b/src/app/hierarchical-grid-remote-virtualization/hierarchical-grid-remote-virtualization.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, AfterViewInit, ChangeDetectorRef } from '@angular/core'; +import { Component, ViewChild, AfterViewInit, ChangeDetectorRef, inject } from '@angular/core'; import { IGX_HIERARCHICAL_GRID_DIRECTIVES, IgxHierarchicalGridComponent @@ -14,6 +14,9 @@ import { debounceTime } from 'rxjs/operators'; imports: [IGX_HIERARCHICAL_GRID_DIRECTIVES] }) export class HierarchicalGridRemoteVirtualizationComponent implements AfterViewInit { + private remoteService = inject(HierarchicalRemoteService); + private cdr = inject(ChangeDetectorRef); + @ViewChild('hGrid', { static: true }) private hGrid: IgxHierarchicalGridComponent; @@ -24,7 +27,9 @@ export class HierarchicalGridRemoteVirtualizationComponent implements AfterViewI public isExpanding = false; - constructor(private remoteService: HierarchicalRemoteService, private cdr: ChangeDetectorRef) { + constructor() { + const remoteService = this.remoteService; + remoteService.url = 'https://services.odata.org/V4/Northwind/Northwind.svc/Customers?$expand=Orders'; } diff --git a/src/app/hierarchical-grid-remote-virtualization/hierarchical-remote.service.ts b/src/app/hierarchical-grid-remote-virtualization/hierarchical-remote.service.ts index 6a1c369b335..d41198afe18 100644 --- a/src/app/hierarchical-grid-remote-virtualization/hierarchical-remote.service.ts +++ b/src/app/hierarchical-grid-remote-virtualization/hierarchical-remote.service.ts @@ -1,4 +1,4 @@ -import { Injectable } from '@angular/core'; +import { Injectable, inject } from '@angular/core'; import { Observable, BehaviorSubject } from 'rxjs'; import { map } from 'rxjs/operators'; import { HttpClient } from '@angular/common/http'; @@ -7,6 +7,8 @@ import { IgxHierarchicalGridComponent } from 'igniteui-angular'; @Injectable() export class HierarchicalRemoteService { + private http = inject(HttpClient); + public remotePagingData: BehaviorSubject; public cachedData = []; @@ -19,7 +21,7 @@ export class HierarchicalRemoteService { private hierarchyPipe: IgxGridHierarchicalPipe = null; - constructor(private http: HttpClient) { + constructor() { this._remoteData = new BehaviorSubject([]); this.remoteData = this._remoteData.asObservable(); } diff --git a/src/app/hierarchical-grid-remote/hierarchical-grid-remote.sample.ts b/src/app/hierarchical-grid-remote/hierarchical-grid-remote.sample.ts index 0c9d4b1c08a..864930b83a8 100644 --- a/src/app/hierarchical-grid-remote/hierarchical-grid-remote.sample.ts +++ b/src/app/hierarchical-grid-remote/hierarchical-grid-remote.sample.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, OnInit, ChangeDetectorRef, AfterViewInit } from '@angular/core'; +import { Component, ViewChild, OnInit, ChangeDetectorRef, AfterViewInit, inject } from '@angular/core'; import { IgxRowIslandComponent, IgxHierarchicalGridComponent, @@ -20,6 +20,9 @@ const API_ENDPOINT = 'https://data-northwind.indigo.design'; imports: [IGX_HIERARCHICAL_GRID_DIRECTIVES] }) export class HierarchicalGridRemoteSampleComponent implements OnInit, AfterViewInit { + private http = inject(HttpClient); + private cdr = inject(ChangeDetectorRef); + @ViewChild('hGrid', { static: true }) private hGrid: IgxHierarchicalGridComponent; @@ -66,8 +69,6 @@ export class HierarchicalGridRemoteSampleComponent implements OnInit, AfterViewI } ]; - constructor(private http: HttpClient, private cdr: ChangeDetectorRef) {} - public ngOnInit() { const ordersTree = new FilteringExpressionsTree(0, undefined, 'Orders', ['customerId']); ordersTree.filteringOperands.push({ diff --git a/src/app/hierarchical-grid-updating/hierarchical-grid-updating.sample.ts b/src/app/hierarchical-grid-updating/hierarchical-grid-updating.sample.ts index a895c416de7..aae59a18730 100644 --- a/src/app/hierarchical-grid-updating/hierarchical-grid-updating.sample.ts +++ b/src/app/hierarchical-grid-updating/hierarchical-grid-updating.sample.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, AfterViewInit } from '@angular/core'; +import { Component, ViewChild, AfterViewInit, inject } from '@angular/core'; import { IgxRowIslandComponent, IgxHierarchicalGridComponent, @@ -17,6 +17,8 @@ import { RemoteService } from '../shared/remote.service'; imports: [IgxButtonDirective, IgxHierarchicalGridComponent, IgxColumnComponent, IgxRowIslandComponent] }) export class HierarchicalGridUpdatingSampleComponent implements AfterViewInit { + private remoteService = inject(RemoteService); + @ViewChild('rowIsland1', { static: true }) private rowIsland1: IgxRowIslandComponent; @@ -34,7 +36,9 @@ export class HierarchicalGridUpdatingSampleComponent implements AfterViewInit { { name: 'ProductID', type: 'number', level: 2 } ]; - constructor(private remoteService: RemoteService) { + constructor() { + const remoteService = this.remoteService; + remoteService.url = 'https://services.odata.org/V4/Northwind/Northwind.svc/'; this.remoteService.urlBuilder = (dataState) => this.buildUrl(dataState); diff --git a/src/app/hierarchical-grid/hierarchical-grid.sample.ts b/src/app/hierarchical-grid/hierarchical-grid.sample.ts index af746d3344c..dc98de89c1c 100644 --- a/src/app/hierarchical-grid/hierarchical-grid.sample.ts +++ b/src/app/hierarchical-grid/hierarchical-grid.sample.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectorRef, AfterViewInit, HostBinding } from '@angular/core'; +import { Component, ViewChild, ChangeDetectorRef, AfterViewInit, HostBinding, inject } from '@angular/core'; import { GridSearchBoxComponent } from '../grid-search-box/grid-search-box.component'; import { IgxRowIslandComponent, @@ -19,6 +19,8 @@ import { imports: [GridSearchBoxComponent, IGX_HIERARCHICAL_GRID_DIRECTIVES, IgxIconComponent, IGX_BUTTON_GROUP_DIRECTIVES] }) export class HierarchicalGridSampleComponent implements AfterViewInit { + private cdr = inject(ChangeDetectorRef); + @HostBinding('style.--ig-size') protected get sizeStyle() { return `var(--ig-size-${this.size})`; @@ -50,7 +52,7 @@ export class HierarchicalGridSampleComponent implements AfterViewInit { activeRow: this.evenCondition, }; - constructor(private cdr: ChangeDetectorRef) { + constructor() { this.sizes = [ { label: 'small', selected: this.size === 'small', togglable: true }, { label: 'medium', selected: this.size === 'medium', togglable: true }, diff --git a/src/app/icon-button/icon-button.sample.ts b/src/app/icon-button/icon-button.sample.ts index 523fdf16770..c97319314a5 100644 --- a/src/app/icon-button/icon-button.sample.ts +++ b/src/app/icon-button/icon-button.sample.ts @@ -1,4 +1,4 @@ -import { Component, CUSTOM_ELEMENTS_SCHEMA, DestroyRef } from '@angular/core'; +import { Component, CUSTOM_ELEMENTS_SCHEMA, DestroyRef, inject } from '@angular/core'; import { IgxIconButtonDirective, IgxIconComponent, @@ -29,6 +29,9 @@ registerIconFromText('favorite', favorite); imports: [IgxIconComponent, IgxIconButtonDirective, IgSizeDirective] }) export class IconButtonSampleComponent { + private propertyChangeService = inject(PropertyChangeService); + private destroyRef = inject(DestroyRef); + public panelConfig: PropertyPanelConfig = { size: { control: { @@ -53,10 +56,7 @@ export class IconButtonSampleComponent { public properties: Properties; - constructor( - private propertyChangeService: PropertyChangeService, - private destroyRef: DestroyRef - ) { + constructor() { this.propertyChangeService.setPanelConfig(this.panelConfig); const propertyChange = diff --git a/src/app/icon/LazyModule/LazyComponent/lazyIcon.sample.ts b/src/app/icon/LazyModule/LazyComponent/lazyIcon.sample.ts index 3ce0cdbd7aa..832324a3ffc 100644 --- a/src/app/icon/LazyModule/LazyComponent/lazyIcon.sample.ts +++ b/src/app/icon/LazyModule/LazyComponent/lazyIcon.sample.ts @@ -1,5 +1,5 @@ import { HttpClient } from '@angular/common/http'; -import { Component, OnInit } from '@angular/core'; +import { Component, OnInit, inject } from '@angular/core'; import { IgxIconComponent } from 'igniteui-angular'; @Component({ @@ -9,7 +9,8 @@ import { IgxIconComponent } from 'igniteui-angular'; imports: [IgxIconComponent] }) export class LazyIconSampleComponent implements OnInit { - constructor(private httpClient: HttpClient) {} + private httpClient = inject(HttpClient); + // Used for testing the provided HttpsInterceptor // with lazy loaded modules diff --git a/src/app/icon/ThemedComponent/themed-icon.component.ts b/src/app/icon/ThemedComponent/themed-icon.component.ts index e63d7a5d22b..06a918e3fff 100644 --- a/src/app/icon/ThemedComponent/themed-icon.component.ts +++ b/src/app/icon/ThemedComponent/themed-icon.component.ts @@ -22,10 +22,12 @@ import { imports: [IgxIconComponent, IgxButtonDirective, IgxButtonGroupComponent] }) export class ThemedIconComponent { + private iconService = inject(IgxIconService); + protected themeToken = inject(THEME_TOKEN); protected themes: IgxTheme[] = ['material', 'bootstrap', 'indigo', 'fluent']; - constructor(private iconService: IgxIconService) { + constructor() { this.iconService.setIconRef('expand_more', 'default', { family: 'material', name: 'home' }); } diff --git a/src/app/icon/icon.sample.ts b/src/app/icon/icon.sample.ts index 10b2f88c32a..920f43ad040 100644 --- a/src/app/icon/icon.sample.ts +++ b/src/app/icon/icon.sample.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewEncapsulation } from '@angular/core'; +import { Component, OnInit, ViewEncapsulation, inject } from '@angular/core'; import { Router } from '@angular/router'; import { IgxButtonDirective, IgxIconComponent, IgxIconService } from 'igniteui-angular'; @@ -12,7 +12,9 @@ import { ThemedIconComponent } from './ThemedComponent/themed-icon.component'; imports: [IgxIconComponent, IgxButtonDirective, ThemedIconComponent] }) export class IconSampleComponent implements OnInit { - constructor(private _iconService: IgxIconService, public router: Router) {} + private _iconService = inject(IgxIconService); + router = inject(Router); + public ngOnInit(): void { this._iconService.addIconRef('accessible', 'default', { family: 'material', name: 'rain', type: 'svg'}); diff --git a/src/app/input-controls/input-controls.sample.ts b/src/app/input-controls/input-controls.sample.ts index 764a072ad23..018b5994a09 100644 --- a/src/app/input-controls/input-controls.sample.ts +++ b/src/app/input-controls/input-controls.sample.ts @@ -1,4 +1,4 @@ -import { Component, CUSTOM_ELEMENTS_SCHEMA, DestroyRef } from '@angular/core'; +import { Component, CUSTOM_ELEMENTS_SCHEMA, DestroyRef, inject } from '@angular/core'; import { IgxCheckboxComponent, IgxSwitchComponent, @@ -39,6 +39,9 @@ defineComponents( ] }) export class InputControlsSampleComponent { + private propertyChangeService = inject(PropertyChangeService); + private destroyRef = inject(DestroyRef); + public panelConfig: PropertyPanelConfig = { indeterminate: { label: 'Indeterminate Checkbox', @@ -101,10 +104,7 @@ export class InputControlsSampleComponent { public properties: Properties; - constructor( - private propertyChangeService: PropertyChangeService, - private destroyRef: DestroyRef - ) { + constructor() { this.propertyChangeService.setPanelConfig(this.panelConfig); const propertyChange = diff --git a/src/app/input-group-showcase/input-group-showcase.sample.ts b/src/app/input-group-showcase/input-group-showcase.sample.ts index 314b188dc88..bcc8b106846 100644 --- a/src/app/input-group-showcase/input-group-showcase.sample.ts +++ b/src/app/input-group-showcase/input-group-showcase.sample.ts @@ -47,6 +47,8 @@ defineComponents( schemas: [CUSTOM_ELEMENTS_SCHEMA], }) export class InputGroupShowcaseSampleComponent { + private destroyRef = inject(DestroyRef); + public field = viewChild('field'); public fieldTextarea = viewChild('fieldTextarea'); public fieldFile = viewChild('fieldFile'); @@ -151,7 +153,7 @@ export class InputGroupShowcaseSampleComponent { fieldFile: [this.properties()?.value || ''] }); - constructor(private destroyRef: DestroyRef) { + constructor() { this.pcs.setPanelConfig(this.panelConfig); const propertyChange = this.pcs.propertyChanges.subscribe((updatedProperties) => { diff --git a/src/app/input/input.sample.ts b/src/app/input/input.sample.ts index 3a358e7da24..661ec9e7977 100644 --- a/src/app/input/input.sample.ts +++ b/src/app/input/input.sample.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ChangeDetectionStrategy, inject } from '@angular/core'; import { UntypedFormBuilder, FormsModule, ReactiveFormsModule } from '@angular/forms'; import { IChangeCheckboxEventArgs, IGX_INPUT_GROUP_DIRECTIVES, IGX_LIST_DIRECTIVES, IgxAvatarComponent, IgxButtonDirective, IgxCheckboxComponent, IgxIconComponent, IgxRadioComponent, IgxSwitchComponent } from 'igniteui-angular'; @@ -11,6 +11,8 @@ import { IChangeCheckboxEventArgs, IGX_INPUT_GROUP_DIRECTIVES, IGX_LIST_DIRECTIV imports: [FormsModule, ReactiveFormsModule, IGX_INPUT_GROUP_DIRECTIVES, IGX_LIST_DIRECTIVES, IgxSwitchComponent, IgxIconComponent, IgxCheckboxComponent, IgxAvatarComponent, IgxRadioComponent, IgxButtonDirective] }) export class InputSampleComponent { + private fb = inject(UntypedFormBuilder); + public placeholder = 'Please enter a value'; public placeholderDate = new Date(); public selected = 'option1'; @@ -59,8 +61,6 @@ export class InputSampleComponent { disabled: true }]; - constructor(private fb: UntypedFormBuilder) {} - public onClick(event: MouseEvent) { console.log(event); } diff --git a/src/app/linear-progress/linear-progress.sample.ts b/src/app/linear-progress/linear-progress.sample.ts index 674207b228f..eab4e9f549c 100644 --- a/src/app/linear-progress/linear-progress.sample.ts +++ b/src/app/linear-progress/linear-progress.sample.ts @@ -1,4 +1,4 @@ -import { Component, CUSTOM_ELEMENTS_SCHEMA, DestroyRef } from '@angular/core'; +import { Component, CUSTOM_ELEMENTS_SCHEMA, DestroyRef, inject } from '@angular/core'; import { IgxLinearProgressBarComponent, IgxTextAlign } from 'igniteui-angular'; import { IgcLinearProgressComponent, @@ -22,6 +22,9 @@ defineComponents(IgcLinearProgressComponent); }) export class LinearProgressSampleComponent { + private propertyChangeService = inject(PropertyChangeService); + private destroyRef = inject(DestroyRef); + public panelConfig: PropertyPanelConfig = { hasAnimation: { label: 'Enable none indeterminate animation (Angular)', @@ -106,10 +109,7 @@ export class LinearProgressSampleComponent { public properties: Properties; - constructor( - private propertyChangeService: PropertyChangeService, - private destroyRef: DestroyRef - ) { + constructor() { this.propertyChangeService.setPanelConfig(this.panelConfig); const propertyChange = diff --git a/src/app/list/list.sample.ts b/src/app/list/list.sample.ts index 5cc31545450..216e258b9b7 100644 --- a/src/app/list/list.sample.ts +++ b/src/app/list/list.sample.ts @@ -1,9 +1,4 @@ -import { - Component, - CUSTOM_ELEMENTS_SCHEMA, - DestroyRef, - ViewEncapsulation, -} from '@angular/core'; +import { Component, CUSTOM_ELEMENTS_SCHEMA, DestroyRef, ViewEncapsulation, inject } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { IGX_LIST_DIRECTIVES, @@ -96,6 +91,9 @@ interface Employee { ] }) export class ListSampleComponent { + private propertyChangeService = inject(PropertyChangeService); + private destroyRef = inject(DestroyRef); + public panelConfig: PropertyPanelConfig = { size: { control: { @@ -171,10 +169,7 @@ export class ListSampleComponent { public properties: Properties; - constructor( - private propertyChangeService: PropertyChangeService, - private destroyRef: DestroyRef - ) { + constructor() { this.propertyChangeService.setPanelConfig(this.panelConfig); const propertyChange = diff --git a/src/app/navbar/navbar.sample.ts b/src/app/navbar/navbar.sample.ts index caccb615668..410db40e79d 100644 --- a/src/app/navbar/navbar.sample.ts +++ b/src/app/navbar/navbar.sample.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewEncapsulation } from '@angular/core'; +import { Component, OnInit, ViewEncapsulation, inject } from '@angular/core'; import {Location} from '@angular/common'; import { IGX_NAVBAR_DIRECTIVES, @@ -22,11 +22,9 @@ const CURRENT_VIEW = 'Ignite UI for Angular Samples'; imports: [IGX_NAVBAR_DIRECTIVES, IgxIconComponent, IgxButtonDirective, IgxIconButtonDirective, IgxAvatarComponent, IGX_PROGRESS_BAR_DIRECTIVES, IGX_INPUT_GROUP_DIRECTIVES, FormsModule] }) export class NavbarSampleComponent implements OnInit { - public currentView: string; - - constructor(private _location: Location) { + private _location = inject(Location); - } + public currentView: string; public ngOnInit() { this.currentView = CURRENT_VIEW; diff --git a/src/app/navdrawer/navdrawer.sample.ts b/src/app/navdrawer/navdrawer.sample.ts index c9cd134b9e2..6c440738d4e 100644 --- a/src/app/navdrawer/navdrawer.sample.ts +++ b/src/app/navdrawer/navdrawer.sample.ts @@ -1,4 +1,4 @@ -import { Component } from '@angular/core'; +import { Component, inject } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { IgxRadioComponent, IgxSwitchComponent } from 'igniteui-angular'; import { AppComponent } from '../app.component'; @@ -12,7 +12,8 @@ import { AppComponent } from '../app.component'; imports: [IgxSwitchComponent, FormsModule, IgxRadioComponent] }) export class NavdrawerSampleComponent { - constructor(public app: AppComponent) {} + app = inject(AppComponent); + public toggle() { // TODO: This needs to be refactored into a service. diff --git a/src/app/overlay/overlay.sample.ts b/src/app/overlay/overlay.sample.ts index f69ea23cfc7..555b2c68ae8 100644 --- a/src/app/overlay/overlay.sample.ts +++ b/src/app/overlay/overlay.sample.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ElementRef, ChangeDetectorRef, OnInit } from '@angular/core'; +import { Component, ViewChild, ElementRef, ChangeDetectorRef, OnInit, inject } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { IgxDropDownComponent, @@ -32,6 +32,8 @@ import { IAnimationParams } from 'igniteui-angular/animations'; imports: [IgxRadioComponent, FormsModule, IgxSwitchComponent, IgxInputGroupComponent, IgxInputDirective, IgxLabelDirective, IgxButtonDirective, IgxRippleDirective, IgxDragDirective, IgxDropDownComponent, IgxDropDownItemComponent] }) export class OverlaySampleComponent implements OnInit { + private cdr = inject(ChangeDetectorRef); + @ViewChild(IgxDropDownComponent, { static: true }) private igxDropDown: IgxDropDownComponent; @ViewChild('button', { static: true }) @@ -71,9 +73,7 @@ export class OverlaySampleComponent implements OnInit { modal: true, closeOnOutsideClick: true }; - constructor( - private cdr: ChangeDetectorRef - ) { + constructor() { for (let item = 0; item < this.itemsCount; item++) { this.items.push(`Item ${item}`); } diff --git a/src/app/pivot-grid-hierarchy/pivot-grid-hierarchy.sample.ts b/src/app/pivot-grid-hierarchy/pivot-grid-hierarchy.sample.ts index 8e6f51ec87a..206ce34018a 100644 --- a/src/app/pivot-grid-hierarchy/pivot-grid-hierarchy.sample.ts +++ b/src/app/pivot-grid-hierarchy/pivot-grid-hierarchy.sample.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild } from '@angular/core'; +import { Component, ViewChild, inject } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { IgxComboComponent, IgxExcelExporterOptions, IgxExcelExporterService, IgxPivotGridComponent, IgxPivotNumericAggregate, IPivotConfiguration, IPivotDimension, IPivotUISettings, PivotRowLayoutType } from 'igniteui-angular'; import { DATA } from '../shared/pivot-data'; @@ -12,6 +12,8 @@ import { DATA } from '../shared/pivot-data'; }) export class PivotGridHierarchySampleComponent { + private excelExportService = inject(IgxExcelExporterService); + @ViewChild('grid1', { static: true }) public grid1: IgxPivotGridComponent; public dimensions: IPivotDimension[] = [ @@ -52,9 +54,6 @@ export class PivotGridHierarchySampleComponent { public pivotUI: IPivotUISettings = { showRowHeaders: true, rowLayout: PivotRowLayoutType.Horizontal }; public selected: IPivotDimension[] = [ this.dimensions[1], this.dimensions[2]]; - constructor(private excelExportService: IgxExcelExporterService) { - } - public handleChange(event) { let isColumnChange = false const allDims = this.pivotConfigHierarchy.rows.concat(this.pivotConfigHierarchy.columns).concat(this.pivotConfigHierarchy.filters); diff --git a/src/app/pivot-grid-state/pivot-grid-state.sample.ts b/src/app/pivot-grid-state/pivot-grid-state.sample.ts index 5d3a9957bdf..1ecc1bba8c8 100644 --- a/src/app/pivot-grid-state/pivot-grid-state.sample.ts +++ b/src/app/pivot-grid-state/pivot-grid-state.sample.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild } from '@angular/core'; +import { Component, ViewChild, inject } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { IgxPivotNumericAggregate, @@ -58,6 +58,8 @@ export class IgxTotalSaleAggregate { IgxPivotGridComponent, IgxGridStateDirective, IgxPivotDataSelectorComponent, IgxPivotRowDimensionHeaderTemplateDirective] }) export class PivotGridStateSampleComponent { + private exportService = inject(IgxExcelExporterService); + @ViewChild('grid1', { static: true }) public grid1: IgxPivotGridComponent; public pivotConfigHierarchy: IPivotConfiguration = { @@ -173,8 +175,6 @@ export class PivotGridStateSampleComponent { @ViewChild(IgxGridStateDirective, { static: true }) public state!: IgxGridStateDirective; - constructor(private exportService: IgxExcelExporterService) {} - public saveState() { const state = this.state.getState() as string; window.sessionStorage.setItem('grid-state', state); diff --git a/src/app/pivot-grid/pivot-grid.sample.ts b/src/app/pivot-grid/pivot-grid.sample.ts index 132e5d4752d..8ebf55d44ca 100644 --- a/src/app/pivot-grid/pivot-grid.sample.ts +++ b/src/app/pivot-grid/pivot-grid.sample.ts @@ -1,4 +1,4 @@ -import { Component, HostBinding, ViewChild } from '@angular/core'; +import { Component, HostBinding, ViewChild, inject } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { IgxPivotNumericAggregate, @@ -58,6 +58,8 @@ export class IgxTotalSaleAggregate { imports: [IgxComboComponent, FormsModule, IgxButtonGroupComponent, IgxButtonDirective, IgxPivotGridComponent, IgxPivotValueChipTemplateDirective, IgxPivotDataSelectorComponent] }) export class PivotGridSampleComponent { + private excelExportService = inject(IgxExcelExporterService); + @HostBinding('style.--ig-size') protected get sizeStyle() { return this.size === "superCompact" ? `var(--ig-size-small)` : `var(--ig-size-${this.size})`; @@ -67,7 +69,7 @@ export class PivotGridSampleComponent { public filterExpTree = new FilteringExpressionsTree(FilteringLogic.And); - constructor(private excelExportService: IgxExcelExporterService) { + constructor() { this.filterExpTree.filteringOperands = [ { condition: IgxStringFilteringOperand.instance().condition('equals'), diff --git a/src/app/properties-panel/property-change.service.ts b/src/app/properties-panel/property-change.service.ts index 0448b055d5b..cfff39e9330 100644 --- a/src/app/properties-panel/property-change.service.ts +++ b/src/app/properties-panel/property-change.service.ts @@ -1,4 +1,4 @@ -import { Injectable, TemplateRef } from '@angular/core'; +import { Injectable, TemplateRef, inject } from '@angular/core'; import { BehaviorSubject } from 'rxjs'; import { ActivationStart, Router } from '@angular/router'; @@ -39,11 +39,13 @@ export type Properties = { providedIn: 'root', }) export class PropertyChangeService { + private router = inject(Router); + public propertyChanges = new BehaviorSubject({}); public panelConfig = new BehaviorSubject({}); public customControlsSource = new BehaviorSubject | null>(null); - constructor(private router: Router) { + constructor() { this.router.events.subscribe(event => { if (event instanceof ActivationStart) { this.clearPanelConfig(); diff --git a/src/app/radio/radio.sample.ts b/src/app/radio/radio.sample.ts index af11ff6079b..2b7c0c33192 100644 --- a/src/app/radio/radio.sample.ts +++ b/src/app/radio/radio.sample.ts @@ -56,6 +56,8 @@ class Person { ] }) export class RadioSampleComponent implements AfterContentInit { + private _formBuilder = inject(UntypedFormBuilder); + @ViewChild('radioGroupZZ', { read: IgxRadioGroupDirective, static: true }) public radioGroup: IgxRadioGroupDirective; public disabled = false; @@ -79,7 +81,7 @@ export class RadioSampleComponent implements AfterContentInit { private cdr = inject(ChangeDetectorRef); - constructor(private _formBuilder: UntypedFormBuilder) { + constructor() { this._createPersonKirkForm(); } diff --git a/src/app/reactive-from/reactive-form-sample.component.ts b/src/app/reactive-from/reactive-form-sample.component.ts index c2088e10afb..16b3cdaa462 100644 --- a/src/app/reactive-from/reactive-form-sample.component.ts +++ b/src/app/reactive-from/reactive-form-sample.component.ts @@ -1,4 +1,4 @@ -import { Component } from '@angular/core'; +import { Component, inject } from '@angular/core'; import { UntypedFormBuilder, UntypedFormControl, UntypedFormGroup, Validators, FormsModule, ReactiveFormsModule } from '@angular/forms'; import { IgxSelectComponent, IgxSelectGroupComponent, IgxSelectItemComponent, IgxLabelDirective, IgxSelectToggleIconDirective, IgxIconComponent, IgxInputGroupComponent, IgxInputDirective, IgxSuffixDirective, IgxPrefixDirective, IgxHintDirective, IgxComboComponent, IgxDatePickerComponent, IgxTimePickerComponent, IgxButtonDirective, IgxRippleDirective } from 'igniteui-angular'; @@ -12,7 +12,9 @@ export class ReactiveFormSampleComponent { public genres = []; public user: UntypedFormGroup; - constructor(fb: UntypedFormBuilder) { + constructor() { + const fb = inject(UntypedFormBuilder); + this.user = fb.group({ // date: ['', Validators.required], date: ['', { validators: Validators.required, updateOn: 'blur' }], diff --git a/src/app/select/select.sample.ts b/src/app/select/select.sample.ts index bf64a880d2b..34a10610cc7 100644 --- a/src/app/select/select.sample.ts +++ b/src/app/select/select.sample.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChildren, QueryList, ViewChild } from '@angular/core'; +import { Component, OnInit, ViewChildren, QueryList, ViewChild, inject } from '@angular/core'; import { UntypedFormBuilder, UntypedFormGroup, Validators, FormsModule, ReactiveFormsModule } from '@angular/forms'; import { IgxButtonDirective, IgxSelectComponent, IgxLabelDirective, IgxPrefixDirective, IgxIconComponent, IgxSelectItemComponent, IgxSelectHeaderDirective, IgxSelectFooterDirective, IgxSuffixDirective, IgxHintDirective, IgxSelectGroupComponent, IgxSwitchComponent, ISelectionEventArgs, CancelableEventArgs, HorizontalAlignment, VerticalAlignment, ConnectedPositioningStrategy, AbsoluteScrollStrategy } from 'igniteui-angular'; import { scaleInTop, scaleOutBottom } from 'igniteui-angular/animations'; @@ -61,7 +61,9 @@ export class SelectSampleComponent implements OnInit { citiesSelect: [Validators.required] }; - constructor(fb: UntypedFormBuilder) { + constructor() { + const fb = inject(UntypedFormBuilder); + this.reactiveForm = fb.group({ citiesSelect: ['', Validators.required] }); diff --git a/src/app/shared/local.service.ts b/src/app/shared/local.service.ts index 539f07b079c..0046566a9d6 100644 --- a/src/app/shared/local.service.ts +++ b/src/app/shared/local.service.ts @@ -1,17 +1,19 @@ -import { Injectable } from '@angular/core'; +import { Injectable, inject } from '@angular/core'; import { HttpClient } from '@angular/common/http'; import { BehaviorSubject, Observable } from 'rxjs'; import { FinancialData } from './financialData'; @Injectable() export class LocalService { + private http = inject(HttpClient); + public records: Observable; public url: string; public dataStore: any[]; private _records: BehaviorSubject; - constructor(private http: HttpClient) { + constructor() { this.dataStore = []; this._records = new BehaviorSubject([]); this.records = this._records.asObservable(); diff --git a/src/app/shared/remote.service.ts b/src/app/shared/remote.service.ts index ca2424baed6..5619ea2301e 100644 --- a/src/app/shared/remote.service.ts +++ b/src/app/shared/remote.service.ts @@ -1,10 +1,12 @@ -import { Injectable } from '@angular/core'; +import { Injectable, inject } from '@angular/core'; import { Observable, BehaviorSubject } from 'rxjs'; import { map } from 'rxjs/operators'; import { HttpClient } from '@angular/common/http'; @Injectable() export class RemoteService { + private http = inject(HttpClient); + public remotePagingData: BehaviorSubject; public urlPaging = 'https://www.igniteui.com/api/products'; public totalCount: Observable; @@ -15,7 +17,7 @@ export class RemoteService { private _remoteData: BehaviorSubject; private _totalCount: BehaviorSubject; - constructor(private http: HttpClient) { + constructor() { this._remoteData = new BehaviorSubject([]); this.remoteData = this._remoteData.asObservable(); this._totalCount = new BehaviorSubject(null); diff --git a/src/app/shared/remoteProductsData.service.ts b/src/app/shared/remoteProductsData.service.ts index 1050411c43c..36efa9cd2ae 100644 --- a/src/app/shared/remoteProductsData.service.ts +++ b/src/app/shared/remoteProductsData.service.ts @@ -1,5 +1,5 @@ import { HttpClient } from '@angular/common/http'; -import { Injectable } from '@angular/core'; +import { Injectable, inject } from '@angular/core'; import { SortingDirection } from 'igniteui-angular'; import { BehaviorSubject, Observable } from 'rxjs'; @@ -12,12 +12,14 @@ export enum SortOrder { } @Injectable() export class RemoteVirtService { + private _http = inject(HttpClient); + public data: Observable; private _data: BehaviorSubject; private _cachedData: any[]; - constructor(private _http: HttpClient) { + constructor() { this._data = new BehaviorSubject([]); this.data = this._data.asObservable(); } diff --git a/src/app/slider-showcase/slider-showcase.sample.ts b/src/app/slider-showcase/slider-showcase.sample.ts index 862a693891d..da34173f39b 100644 --- a/src/app/slider-showcase/slider-showcase.sample.ts +++ b/src/app/slider-showcase/slider-showcase.sample.ts @@ -1,4 +1,4 @@ -import { Component, CUSTOM_ELEMENTS_SCHEMA, DestroyRef } from '@angular/core'; +import { Component, CUSTOM_ELEMENTS_SCHEMA, DestroyRef, inject } from '@angular/core'; import { TicksOrientation, IgxSliderComponent, @@ -25,6 +25,9 @@ defineComponents(IgcSliderComponent, IgcSliderLabelComponent); imports: [IgxSliderComponent] }) export class SliderShowcaseSampleComponent { + private propertyChangeService = inject(PropertyChangeService); + private destroyRef = inject(DestroyRef); + public panelConfig: PropertyPanelConfig = { value: { control: { @@ -121,10 +124,7 @@ export class SliderShowcaseSampleComponent { public properties: Properties; - constructor( - private propertyChangeService: PropertyChangeService, - private destroyRef: DestroyRef - ) { + constructor() { this.propertyChangeService.setPanelConfig(this.panelConfig); const propertyChange = diff --git a/src/app/snackbar-showcase/snackbar-showcase.sample.ts b/src/app/snackbar-showcase/snackbar-showcase.sample.ts index f970c622166..1b0ee2a7306 100644 --- a/src/app/snackbar-showcase/snackbar-showcase.sample.ts +++ b/src/app/snackbar-showcase/snackbar-showcase.sample.ts @@ -1,4 +1,4 @@ -import { Component, CUSTOM_ELEMENTS_SCHEMA, DestroyRef } from '@angular/core'; +import { Component, CUSTOM_ELEMENTS_SCHEMA, DestroyRef, inject } from '@angular/core'; import { IgxButtonDirective, IgxOverlayOutletDirective, @@ -26,6 +26,9 @@ defineComponents(IgcSnackbarComponent); ], }) export class SnackbarShowcaseSampleComponent { + private propertyChangeService = inject(PropertyChangeService); + private destroyRef = inject(DestroyRef); + public panelConfig: PropertyPanelConfig = { actionText: { label: 'Action Text', @@ -51,10 +54,7 @@ export class SnackbarShowcaseSampleComponent { public properties: Properties; - constructor( - private propertyChangeService: PropertyChangeService, - private destroyRef: DestroyRef - ) { + constructor() { this.propertyChangeService.setPanelConfig(this.panelConfig); const propertyChange = diff --git a/src/app/stepper/stepper.sample.ts b/src/app/stepper/stepper.sample.ts index f24f00425b7..99bbdfe575a 100644 --- a/src/app/stepper/stepper.sample.ts +++ b/src/app/stepper/stepper.sample.ts @@ -123,6 +123,8 @@ export class FormControlSyncDirective implements OnInit { ] }) export class IgxStepperSampleComponent { + private destroyRef = inject(DestroyRef); + @ViewChild('stepper',{ static: true, read: IgxStepperComponent }) public angularStepper!: IgxStepperComponent; @@ -209,7 +211,7 @@ export class IgxStepperSampleComponent { private fb = inject(UntypedFormBuilder); private pcs = inject(PropertyChangeService); - constructor(private destroyRef: DestroyRef) { + constructor() { this.pcs.setPanelConfig(this.panelConfig); const propertyChange = this.pcs.propertyChanges.subscribe( diff --git a/src/app/tabs-routing/tabs-routing.sample.ts b/src/app/tabs-routing/tabs-routing.sample.ts index 542c9c27b6d..990fe1a1c5b 100644 --- a/src/app/tabs-routing/tabs-routing.sample.ts +++ b/src/app/tabs-routing/tabs-routing.sample.ts @@ -1,4 +1,4 @@ -import { Component } from '@angular/core'; +import { Component, inject } from '@angular/core'; import { Router, RouterLinkActive, RouterLink, RouterOutlet } from '@angular/router'; import { IgxBottomNavHeaderIconDirective, IgxBottomNavHeaderLabelDirective, IgxButtonGroupComponent, IgxIconComponent, IgxTabHeaderComponent, IgxTabItemComponent, IgxTabsComponent, ITabsSelectedItemChangeEventArgs } from 'igniteui-angular'; @@ -10,6 +10,8 @@ import { IgxBottomNavHeaderIconDirective, IgxBottomNavHeaderLabelDirective, IgxB imports: [IgxButtonGroupComponent, IgxTabsComponent, IgxTabItemComponent, RouterLinkActive, IgxTabHeaderComponent, RouterLink, IgxIconComponent, IgxBottomNavHeaderIconDirective, IgxBottomNavHeaderLabelDirective, RouterOutlet] }) export class TabsRoutingSampleComponent { + private router = inject(Router); + public contacts: any[] = [{ avatar: 'assets/images/avatar/1.jpg', favorite: true, @@ -40,9 +42,6 @@ export class TabsRoutingSampleComponent { text: 'Lisa Landers' }]; - constructor(private router: Router) { - } - public clickHandler0() { this.router.navigateByUrl('/tabs-routing'); } diff --git a/src/app/tabs-showcase/tabs-showcase.sample.ts b/src/app/tabs-showcase/tabs-showcase.sample.ts index b271789cfb2..a25342497be 100644 --- a/src/app/tabs-showcase/tabs-showcase.sample.ts +++ b/src/app/tabs-showcase/tabs-showcase.sample.ts @@ -38,6 +38,8 @@ defineComponents(IgcTabsComponent, IgcTabComponent); imports: [IgxButtonDirective, IgxIconComponent, IGX_TABS_DIRECTIVES] }) export class TabsShowcaseSampleComponent implements OnInit { + private destroyRef = inject(DestroyRef); + @ViewChild('angularTabs', { static: false }) public angularTabsRef!: ElementRef; @ViewChild('webComponentsTabs', { static: false }) @@ -60,7 +62,7 @@ export class TabsShowcaseSampleComponent implements OnInit { private pcs = inject(PropertyChangeService); private cdr = inject(ChangeDetectorRef); - constructor(private destroyRef: DestroyRef) { + constructor() { this.pcs.setPanelConfig({ alignment: { control: { diff --git a/src/app/toast-showcase/toast-showcase.sample.ts b/src/app/toast-showcase/toast-showcase.sample.ts index fd0984fbf83..3202e6bfe59 100644 --- a/src/app/toast-showcase/toast-showcase.sample.ts +++ b/src/app/toast-showcase/toast-showcase.sample.ts @@ -1,4 +1,4 @@ -import { Component, CUSTOM_ELEMENTS_SCHEMA, DestroyRef } from '@angular/core'; +import { Component, CUSTOM_ELEMENTS_SCHEMA, DestroyRef, inject } from '@angular/core'; import { IgxButtonDirective, IgxOverlayOutletDirective, @@ -27,6 +27,9 @@ defineComponents(IgcToastComponent); ], }) export class ToastShowcaseSampleComponent { + private propertyChangeService = inject(PropertyChangeService); + private destroyRef = inject(DestroyRef); + public panelConfig: PropertyPanelConfig = { displayTime: { label: 'Display Time', @@ -45,10 +48,7 @@ export class ToastShowcaseSampleComponent { public properties: Properties; - constructor( - private propertyChangeService: PropertyChangeService, - private destroyRef: DestroyRef - ) { + constructor() { this.propertyChangeService.setPanelConfig(this.panelConfig); const propertyChange = diff --git a/src/app/tree-grid-flat-data/tree-grid-flat-data.sample.ts b/src/app/tree-grid-flat-data/tree-grid-flat-data.sample.ts index 8d7fd37a3b5..6295e152921 100644 --- a/src/app/tree-grid-flat-data/tree-grid-flat-data.sample.ts +++ b/src/app/tree-grid-flat-data/tree-grid-flat-data.sample.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, OnInit, HostBinding } from '@angular/core'; +import { Component, ViewChild, OnInit, HostBinding, inject } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { GridSearchBoxComponent } from '../grid-search-box/grid-search-box.component'; @@ -25,6 +25,9 @@ export class MySummaryOperand extends IgxSummaryOperand { imports: [IgxButtonGroupComponent, IgxButtonDirective, IgxTreeGridComponent, IgxColumnComponent, IgxGridToolbarComponent, GridSearchBoxComponent, IgxGridToolbarActionsComponent, IgxGridToolbarPinningComponent, IgxGridToolbarHidingComponent, IgxGridToolbarAdvancedFilteringComponent, IgxGridToolbarExporterComponent, IgxExcelTextDirective, IgxCSVTextDirective, IgxPaginatorComponent, IgxSwitchComponent, FormsModule] }) export class TreeGridFlatDataSampleComponent implements OnInit { + private excelExporterService = inject(IgxExcelExporterService); + private csvExporterService = inject(IgxCsvExporterService); + @HostBinding('style.--ig-size') protected get sizeStyle() { return `var(--ig-size-${this.size})`; @@ -42,10 +45,6 @@ export class TreeGridFlatDataSampleComponent implements OnInit { private nextRow = 1; - constructor(private excelExporterService: IgxExcelExporterService, - private csvExporterService: IgxCsvExporterService) { - } - public ngOnInit(): void { this.selectionMode = GridSelectionMode.multiple; this.sizes = [ diff --git a/src/app/tree-grid-load-on-demand/tree-grid-load-on-demand.sample.ts b/src/app/tree-grid-load-on-demand/tree-grid-load-on-demand.sample.ts index 0214c9e4209..575f736d274 100644 --- a/src/app/tree-grid-load-on-demand/tree-grid-load-on-demand.sample.ts +++ b/src/app/tree-grid-load-on-demand/tree-grid-load-on-demand.sample.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, OnInit, HostBinding } from '@angular/core'; +import { Component, ViewChild, OnInit, HostBinding, inject } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { TreeGridLoadOnDemandService } from './tree-grid-load-on-demand.service'; @@ -27,6 +27,9 @@ export class MySummaryOperand extends IgxSummaryOperand { imports: [IgxButtonGroupComponent, IgxTreeGridComponent, IgxGridToolbarComponent, GridSearchBoxComponent, IgxGridToolbarActionsComponent, IgxGridToolbarPinningComponent, IgxGridToolbarHidingComponent, IgxGridToolbarAdvancedFilteringComponent, IgxGridToolbarExporterComponent, IgxExcelTextDirective, IgxCSVTextDirective, IgxColumnComponent, IgxSwitchComponent, FormsModule, IgxPaginatorComponent, IgxButtonDirective] }) export class TreeGridLoadOnDemandSampleComponent implements OnInit { + private excelExporterService = inject(IgxExcelExporterService); + private csvExporterService = inject(IgxCsvExporterService); + @HostBinding('style.--ig-size') protected get sizeStyle() { return `var(--ig-size-${this.size})`; @@ -46,10 +49,6 @@ export class TreeGridLoadOnDemandSampleComponent implements OnInit { private nextRow = 1; public paging = false; - constructor(private excelExporterService: IgxExcelExporterService, - private csvExporterService: IgxCsvExporterService) { - } - public ngOnInit(): void { this.selectionMode = GridSelectionMode.multiple; this.sizes = [ diff --git a/src/app/tree-grid/tree-grid.sample.ts b/src/app/tree-grid/tree-grid.sample.ts index 5fe222208f8..993896c0624 100644 --- a/src/app/tree-grid/tree-grid.sample.ts +++ b/src/app/tree-grid/tree-grid.sample.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, OnInit, HostBinding } from '@angular/core'; +import { Component, ViewChild, OnInit, HostBinding, inject } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { HIERARCHICAL_SAMPLE_DATA } from '../shared/sample-data'; @@ -15,6 +15,9 @@ import { IgxButtonGroupComponent, IgxTreeGridComponent, IgxGridToolbarComponent, }) export class TreeGridSampleComponent implements OnInit { + private excelExporterService = inject(IgxExcelExporterService); + private csvExporterService = inject(IgxCsvExporterService); + @HostBinding('style.--ig-size') protected get sizeStyle() { return `var(--ig-size-${this.size})`; @@ -32,10 +35,6 @@ export class TreeGridSampleComponent implements OnInit { private nextRow = 1; - constructor(private excelExporterService: IgxExcelExporterService, private csvExporterService: IgxCsvExporterService) { - - } - public ngOnInit(): void { this.selectionMode = GridSelectionMode.multiple; this.sizes = [ diff --git a/src/app/tree-showcase/tree-showcase.sample.ts b/src/app/tree-showcase/tree-showcase.sample.ts index 1b43895b2b3..e55b938a5da 100644 --- a/src/app/tree-showcase/tree-showcase.sample.ts +++ b/src/app/tree-showcase/tree-showcase.sample.ts @@ -1,4 +1,4 @@ -import { Component, CUSTOM_ELEMENTS_SCHEMA, DestroyRef } from '@angular/core'; +import { Component, CUSTOM_ELEMENTS_SCHEMA, DestroyRef, inject } from '@angular/core'; import { HIERARCHICAL_SAMPLE_DATA } from '../shared/sample-data'; import { IGX_TREE_DIRECTIVES, @@ -33,6 +33,9 @@ interface CompanyData { imports: [IGX_TREE_DIRECTIVES, IgSizeDirective], }) export class TreeShowcaseSampleComponent { + private propertyChangeService = inject(PropertyChangeService); + private destroyRef = inject(DestroyRef); + public data: CompanyData[]; public panelConfig: PropertyPanelConfig = { size: { @@ -66,10 +69,7 @@ export class TreeShowcaseSampleComponent { public properties: Properties; - constructor( - private propertyChangeService: PropertyChangeService, - private destroyRef: DestroyRef - ) { + constructor() { this.data = structuredClone(HIERARCHICAL_SAMPLE_DATA); this.propertyChangeService.setPanelConfig(this.panelConfig); diff --git a/src/app/tree/tree.sample.ts b/src/app/tree/tree.sample.ts index 28ed9c02a11..5f1648d5c4c 100644 --- a/src/app/tree/tree.sample.ts +++ b/src/app/tree/tree.sample.ts @@ -1,6 +1,6 @@ import { useAnimation } from '@angular/animations'; import { NgTemplateOutlet, AsyncPipe } from '@angular/common'; -import { AfterViewInit, ChangeDetectorRef, Component, ViewChild } from '@angular/core'; +import { AfterViewInit, ChangeDetectorRef, Component, ViewChild, inject } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { IgxTreeNodeComponent, @@ -70,6 +70,8 @@ interface CompanyData { ] }) export class TreeSampleComponent implements AfterViewInit { + private cdr = inject(ChangeDetectorRef); + @ViewChild('tree1', { static: true }) public tree: IgxTreeComponent; @@ -93,7 +95,7 @@ export class TreeSampleComponent implements AfterViewInit { private initData: CompanyData[]; - constructor(private cdr: ChangeDetectorRef) { + constructor() { this.selectionModes = [ { label: 'None', selectMode: 'None', selected: this.selectionMode === 'None', togglable: true }, { label: 'Multiple', selectMode: 'Multiple', selected: this.selectionMode === 'Multiple', togglable: true }, diff --git a/src/app/virtual-for-directive/virtual-for.sample.ts b/src/app/virtual-for-directive/virtual-for.sample.ts index f315df145d1..c5db4ec4f3c 100644 --- a/src/app/virtual-for-directive/virtual-for.sample.ts +++ b/src/app/virtual-for-directive/virtual-for.sample.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, OnInit, ViewEncapsulation } from '@angular/core'; +import { Component, ViewChild, OnInit, ViewEncapsulation, inject } from '@angular/core'; import { NgClass, AsyncPipe } from '@angular/common'; import { RemoteService } from '../shared/remote.service'; import { IgxForOfDirective, ButtonGroupAlignment, IgxListComponent, IgxButtonDirective, IgxButtonGroupComponent, IgxInputDirective, IgxInputGroupComponent, IgxListItemComponent, IgxSuffixDirective } from 'igniteui-angular'; @@ -13,6 +13,8 @@ import { IgxForOfDirective, ButtonGroupAlignment, IgxListComponent, IgxButtonDir imports: [IgxListComponent, IgxForOfDirective, IgxListItemComponent, IgxInputGroupComponent, IgxInputDirective, IgxSuffixDirective, IgxButtonDirective, IgxButtonGroupComponent, NgClass, AsyncPipe] }) export class VirtualForSampleComponent implements OnInit { + private remoteService = inject(RemoteService); + @ViewChild('virtDirVertical', { read: IgxForOfDirective, static: true }) private virtDirVertical: IgxForOfDirective; @@ -31,7 +33,7 @@ export class VirtualForSampleComponent implements OnInit { public prevRequest: any; public itemSize = '50px'; - constructor(private remoteService: RemoteService) { + constructor() { this.remoteService.urlBuilder = (dataState) => { let qS = `?`; let requiredChunkSize;