diff --git a/.claude/skills/igniteui-angular-components/references/directives.md b/.claude/skills/igniteui-angular-components/references/directives.md index 9000c4e101..08f895d15f 100644 --- a/.claude/skills/igniteui-angular-components/references/directives.md +++ b/.claude/skills/igniteui-angular-components/references/directives.md @@ -138,7 +138,6 @@ onDrop(event: IDropDroppedEventArgs) { Key drag events: `(dragStart)`, `(dragMove)`, `(dragEnd)`, `(dragClick)`, `(transitioned)`. Key drop events: `(dragEnter)`, `(dragLeave)`, `(dragOver)`, `(dropped)`. -> **NOTE:** For touch-based drag, add `importProvidersFrom(HammerModule)` to `app.config.ts` providers. ## See Also diff --git a/.claude/skills/igniteui-angular-components/references/setup.md b/.claude/skills/igniteui-angular-components/references/setup.md index 50a8957daf..36a5b5415e 100644 --- a/.claude/skills/igniteui-angular-components/references/setup.md +++ b/.claude/skills/igniteui-angular-components/references/setup.md @@ -36,7 +36,6 @@ export const appConfig: ApplicationConfig = { | Provider | Package | Required for | |---|---|---| | `provideAnimations()` | `@angular/platform-browser/animations` | **All overlay and animated components** — Dialog, Combo, Select, Dropdown, Date/Time Picker, Snackbar, Toast, Banner, Navigation Drawer, Carousel, Overlay service | -| `importProvidersFrom(HammerModule)` | `@angular/platform-browser` | OPTIONAL — touch gestures (Slider, Drag & Drop, swipe) | | `provideIgniteIntl()` | `igniteui-angular/core` | Localization for grids, date/time pickers, and components displaying formatted values | > **`provideAnimationsAsync()`** lazy-loads the animations module — prefer it for SSR or when optimizing initial bundle size: diff --git a/angular.json b/angular.json index db2949094d..1509ba457b 100644 --- a/angular.json +++ b/angular.json @@ -17,10 +17,6 @@ }, "index": "src/index.html", "tsConfig": "src/tsconfig.app.json", - "polyfills": [ - "zone.js", - "hammerjs" - ], "assets": [ "src/assets", "src/favicon.ico" @@ -90,7 +86,6 @@ "options": { "main": "src/test.ts", "karmaConfig": "./karma.conf.js", - "polyfills": "src/polyfills.ts", "tsConfig": "src/tsconfig.spec.json", "scripts": [], "styles": [ @@ -136,9 +131,6 @@ "base": "dist/app-lob" }, "index": "projects/app-lob/src/index.html", - "polyfills": [ - "projects/app-lob/src/polyfills.ts" - ], "tsConfig": "projects/app-lob/tsconfig.app.json", "assets": [ "projects/app-lob/src/favicon.ico", @@ -220,7 +212,6 @@ "builder": "@angular/build:karma", "options": { "main": "projects/app-lob/src/test.ts", - "polyfills": "projects/app-lob/src/polyfills.ts", "tsConfig": "projects/app-lob/tsconfig.spec.json", "karmaConfig": "projects/app-lob/karma.conf.js", "assets": [ @@ -267,9 +258,6 @@ "base": "dist/app-crm" }, "index": "projects/app-crm/src/index.html", - "polyfills": [ - "projects/app-crm/src/polyfills.ts" - ], "tsConfig": "projects/app-crm/tsconfig.app.json", "assets": [ "projects/app-crm/src/favicon.ico", @@ -350,7 +338,6 @@ "builder": "@angular/build:karma", "options": { "main": "projects/app-crm/src/test.ts", - "polyfills": "projects/app-crm/src/polyfills.ts", "tsConfig": "projects/app-crm/tsconfig.spec.json", "karmaConfig": "projects/app-crm/karma.conf.js", "assets": [ diff --git a/live-editing/configs/AvatarConfigGenerator.ts b/live-editing/configs/AvatarConfigGenerator.ts index a1b020d8ab..4b47701856 100644 --- a/live-editing/configs/AvatarConfigGenerator.ts +++ b/live-editing/configs/AvatarConfigGenerator.ts @@ -8,20 +8,31 @@ export class AvatarConfigGenerator implements IConfigGenerator { const configs = new Array(); configs.push(new Config({ - component: 'AvatarSample3Component', + component: 'AvatarOverviewComponent', appConfig: BaseAppConfig, shortenComponentPathBy: "/layouts/avatar/" })); configs.push(new Config({ - component: 'AvatarStylingSampleComponent', - additionalFiles: ["/src/app/layouts/avatar/avatar-styling/layout.scss"], + component: 'AvatarVariantsComponent', + appConfig: BaseAppConfig, + shortenComponentPathBy: "/layouts/avatar/" + })); + + configs.push(new Config({ + component: 'AvatarShapeComponent', appConfig: BaseAppConfig, shortenComponentPathBy: "/layouts/avatar/" })); configs.push(new Config({ - component: 'AvatarCSSVariablesComponent', + component: 'AvatarSizeComponent', + appConfig: BaseAppConfig, + shortenComponentPathBy: "/layouts/avatar/" + })); + + configs.push(new Config({ + component: 'AvatarStylingSampleComponent', appConfig: BaseAppConfig, shortenComponentPathBy: "/layouts/avatar/" })); diff --git a/live-editing/configs/BadgeConfigGenerator.ts b/live-editing/configs/BadgeConfigGenerator.ts index c331361e12..69076422f2 100644 --- a/live-editing/configs/BadgeConfigGenerator.ts +++ b/live-editing/configs/BadgeConfigGenerator.ts @@ -17,34 +17,53 @@ export class BadgeConfigGenerator implements IConfigGenerator { shortenComponentPathBy: "/data-display/badge/" })); - // badge sample 2 + // badge overview configs.push(new Config({ - component: 'BadgeSample2Component', - additionalFiles: ["src/app/data-display/badge/model/member.model.ts"], + component: 'BadgeOverviewComponent', appConfig: BaseAppConfig, shortenComponentPathBy: "/data-display/badge/" })); - // badge sample 3 + // badge size configs.push(new Config({ - component: 'BadgeSample3Component', - additionalFiles: ["src/app/data-display/badge/model/member.model.ts"], + component: 'BadgeSizeComponent', + appConfig: BaseAppConfig, + shortenComponentPathBy: "/data-display/badge/" + })); + + // badge type + configs.push(new Config({ + component: 'BadgeTypeComponent', + appConfig: BaseAppConfig, + shortenComponentPathBy: "/data-display/badge/" + })); + + // badge shape + configs.push(new Config({ + component: 'BadgeShapeComponent', appConfig: BaseAppConfig, shortenComponentPathBy: "/data-display/badge/" })); - // badge styling sample + // badge variants configs.push(new Config({ - component: 'BadgeStylingSampleComponent', - additionalFiles: ["src/app/data-display/badge/model/member.model.ts", "src/app/data-display/badge/badge-styling-sample/layout.scss"], + component: 'BadgeVariantsComponent', + appConfig: BaseAppConfig, + shortenComponentPathBy: "/data-display/badge/" + })); + + // badge styling + configs.push(new Config({ + component: 'BadgeStylingComponent', + additionalFiles: ["src/app/data-display/badge/model/member.model.ts"], appConfig: BaseAppConfig, shortenComponentPathBy: "/data-display/badge/" })); - // badge dot sample + // badge dot configs.push(new Config({ - component: 'BadgeDotSampleComponent', - additionalFiles: ["src/app/data-display/badge/model/member.model.ts", "src/app/data-display/badge/badge-dot-sample/badge-dot-sample.component.scss"], + component: 'BadgeDotComponent', + additionalFiles: ["src/app/data-display/badge/badge-dot/badge-dot.component.scss"], appConfig: BaseAppConfig, shortenComponentPathBy: "/data-display/badge/" })); diff --git a/live-editing/configs/ButtonGroupConfigGenerator.ts b/live-editing/configs/ButtonGroupConfigGenerator.ts index f5be3f0918..9db78ec06d 100644 --- a/live-editing/configs/ButtonGroupConfigGenerator.ts +++ b/live-editing/configs/ButtonGroupConfigGenerator.ts @@ -10,45 +10,73 @@ export class ButtonGroupConfigGenerator implements IConfigGenerator { public generateConfigs(): Config[] { const configs = new Array(); - // button group 1 + // button group overview configs.push(new Config({ - component: 'ButtonGroupSample1Component', + component: 'ButtonGroupOverviewComponent', appConfig: BaseAppConfig, shortenComponentPathBy: "/data-entries/buttonGroup/" })); - // button group 2 + // button group layout configs.push(new Config({ - component: 'ButtonGroupSample2Component', + component: 'ButtonGroupLayoutComponent', appConfig: BaseAppConfig, shortenComponentPathBy: "/data-entries/buttonGroup/" })); - // button group 3 + // button group alignment configs.push(new Config({ - component: 'ButtonGroupSample3Component', + component: 'ButtonGroupAlignmentComponent', appConfig: BaseAppConfig, shortenComponentPathBy: "/data-entries/buttonGroup/" })); - // button group 4 + // button group custom toggle configs.push(new Config({ - component: 'ButtonGroupSampleComponent', + component: 'ButtonGroupCustomToggleComponent', appConfig: BaseAppConfig, shortenComponentPathBy: "/data-entries/buttonGroup/" })); - // button group 5 + // button group states configs.push(new Config({ - component: 'ButtonGroupSample5Component', + component: 'ButtonGroupStatesComponent', appConfig: BaseAppConfig, shortenComponentPathBy: "/data-entries/buttonGroup/" })); - // button group style + // button group interaction states configs.push(new Config({ - component: 'ButtonGroupStyleComponent', - additionalFiles: ["/src/app/data-entries/buttonGroup/button-group-style/layout.scss"], + component: 'ButtonGroupInteractionStatesComponent', + appConfig: BaseAppConfig, + shortenComponentPathBy: "/data-entries/buttonGroup/" + })); + + // button group selection + configs.push(new Config({ + component: 'ButtonGroupSelectionComponent', + appConfig: BaseAppConfig, + shortenComponentPathBy: "/data-entries/buttonGroup/" + })); + + // button group size + configs.push(new Config({ + component: 'ButtonGroupSizeComponent', + appConfig: BaseAppConfig, + shortenComponentPathBy: "/data-entries/buttonGroup/" + })); + + // button group styling + configs.push(new Config({ + component: 'ButtonGroupStylingComponent', + additionalFiles: ["/src/app/data-entries/buttonGroup/button-group-styling/layout.scss"], + appConfig: BaseAppConfig, + shortenComponentPathBy: "/data-entries/buttonGroup/" + })); + + // button group tailwind styling + configs.push(new Config({ + component: 'ButtonGroupTailwindStylingComponent', appConfig: BaseAppConfig, shortenComponentPathBy: "/data-entries/buttonGroup/" })); diff --git a/live-editing/configs/CalendarConfigGenerator.ts b/live-editing/configs/CalendarConfigGenerator.ts index cc0f5cf280..c72431460d 100644 --- a/live-editing/configs/CalendarConfigGenerator.ts +++ b/live-editing/configs/CalendarConfigGenerator.ts @@ -75,7 +75,6 @@ export class CalendarConfigGenerator implements IConfigGenerator { configs.push(new Config({ component: 'CalendarStylingSampleComponent', - additionalFiles: ["/src/app/scheduling/calendar/calendar-styling-sample/layout.scss"], appConfig: BaseAppConfig, shortenComponentPathBy: "/scheduling/calendar/" })); diff --git a/live-editing/configs/CheckboxConfigGenerator.ts b/live-editing/configs/CheckboxConfigGenerator.ts index 11a5bd0497..1e1722c264 100644 --- a/live-editing/configs/CheckboxConfigGenerator.ts +++ b/live-editing/configs/CheckboxConfigGenerator.ts @@ -30,7 +30,6 @@ export class CheckboxConfigGenerator implements IConfigGenerator { // checkbox styling configs.push(new Config({ component: 'CheckboxStylingComponent', - additionalFiles: ["/src/app/data-entries/checkbox/checkbox-styling/layout.scss"], appConfig: BaseAppConfig, shortenComponentPathBy: "/data-entries/checkbox/" })); diff --git a/live-editing/configs/ChipConfigGenerator.ts b/live-editing/configs/ChipConfigGenerator.ts index 459d526857..4628a00205 100644 --- a/live-editing/configs/ChipConfigGenerator.ts +++ b/live-editing/configs/ChipConfigGenerator.ts @@ -15,6 +15,12 @@ export class ChipConfigGenerator implements IConfigGenerator { shortenComponentPathBy: "/data-display/" })); + configs.push(new Config({ + component: 'ChipOutlinedComponent', + appConfig: BaseAppConfig, + shortenComponentPathBy: "/data-display/" + })); + configs.push(new Config({ component: 'ChipVariantsComponent', appConfig: BaseAppConfig, diff --git a/live-editing/configs/InputGroupConfigGenerator.ts b/live-editing/configs/InputGroupConfigGenerator.ts index 068c119737..f86d80ea47 100644 --- a/live-editing/configs/InputGroupConfigGenerator.ts +++ b/live-editing/configs/InputGroupConfigGenerator.ts @@ -57,7 +57,7 @@ export class InputGroupConfigGenerator implements IConfigGenerator { configs.push(new Config({ component: 'InputGroupStyleComponent', - additionalFiles: ["/src/app/data-entries/input-group/base-input.component.ts", "/src/app/data-entries/input-group/input-group-styling/layout.scss"], + additionalFiles: ["/src/app/data-entries/input-group/base-input.component.ts"], appConfig: BaseAppConfig, shortenComponentPathBy: "/data-entries/" })); diff --git a/live-editing/configs/PivotGridConfigGenerator.ts b/live-editing/configs/PivotGridConfigGenerator.ts index e2ed82c71d..7f7fb25e2e 100644 --- a/live-editing/configs/PivotGridConfigGenerator.ts +++ b/live-editing/configs/PivotGridConfigGenerator.ts @@ -82,6 +82,12 @@ export class PivotGridConfigGenerator implements IConfigGenerator { component: 'PivotGridLayoutComponent' })); + configs.push(new Config({ + additionalFiles: ['/src/app/directives/prevent-scroll.directive.ts', '/src/app/data/dataToAnalyze.ts'], + appConfig: BaseAppConfig, + component: 'PivotStylingComponent' + })); + return configs; } } diff --git a/live-editing/configs/SliderConfigGenerator.ts b/live-editing/configs/SliderConfigGenerator.ts index 69535205e1..9cdbb86a92 100644 --- a/live-editing/configs/SliderConfigGenerator.ts +++ b/live-editing/configs/SliderConfigGenerator.ts @@ -2,7 +2,6 @@ import { IgxButtonModule } from 'igniteui-angular/directives'; import { IgxIconModule } from 'igniteui-angular/icon'; import { IgxInputGroupModule } from 'igniteui-angular/input-group'; import { IgxSliderModule } from 'igniteui-angular/slider'; -import { HammerModule } from '@angular/platform-browser'; import {AppModuleConfig, Config, IConfigGenerator} from 'igniteui-live-editing' import { BaseAppConfig } from './BaseConfig'; export class SliderConfigGenerator implements IConfigGenerator { diff --git a/package-lock.json b/package-lock.json index a7b0d39e7e..f1400169da 100644 --- a/package-lock.json +++ b/package-lock.json @@ -28,34 +28,31 @@ "@popperjs/core": "2.11.8", "@tailwindcss/postcss": "^4.1.10", "@types/file-saver": "^2.0.2", - "@types/hammerjs": "^2.0.39", "angular-in-memory-web-api": "^0.22.0", "bootstrap": "5.3.3", "dompurify": "^3.2.7", "express": "^4.18.2", "file-saver": "^2.0.2", "fuse.js": "^7.1.0", - "hammerjs": "^2.0.8", - "igniteui-angular": "^22.0.0", + "igniteui-angular": "22.1.0", "igniteui-angular-charts": "^22.0.0", "igniteui-angular-core": "^22.0.0", - "igniteui-angular-extras": "^22.0.0", - "igniteui-angular-i18n": "^22.0.0", + "igniteui-angular-extras": "22.1.0", + "igniteui-angular-i18n": "22.1.0", "igniteui-dockmanager": "^1.17.0", - "igniteui-grid-lite": "^0.9.0", + "igniteui-grid-lite": "0.10.0", "igniteui-i18n-resources": "^1.0.4", - "igniteui-live-editing": "^3.5.1", - "igniteui-webcomponents": "^7.2.1", - "marked": "^17.0.1", + "igniteui-live-editing": "^3.5.2", + "igniteui-webcomponents": "^7.3.0", + "marked": "^18.0.11", "marked-shiki": "^1.2.1", "minireset.css": "0.0.6", "postcss": "^8.5.5", "rxjs": "^7.8.2", - "shiki": "^3.13.0", + "shiki": "^4.3.0", "sql-formatter": "^15.4.11", "tailwindcss": "^4.1.10", - "tslib": "^2.6.1", - "zone.js": "~0.15.0" + "tslib": "^2.6.1" }, "devDependencies": { "@angular-eslint/builder": "^22.0.0", @@ -124,13 +121,13 @@ } }, "node_modules/@angular-devkit/architect": { - "version": "0.2201.2", - "resolved": "https://registry.npmjs.org/@angular-devkit/architect/-/architect-0.2201.2.tgz", - "integrity": "sha512-RRG3JA3hPH0ypbDIyquZt9DDTP5pOMPgqQ/iLSkok1MZdKiOgpk6FGfXCa1ei72SwlX7lnJdq94d6WWdqpbyKg==", + "version": "0.2201.6", + "resolved": "https://registry.npmjs.org/@angular-devkit/architect/-/architect-0.2201.6.tgz", + "integrity": "sha512-oGQEdof2/1bZk58PN9dvpGi8pvtbgE5vkP1xRtCqN8dSVxwre1l0pKynOj/Uge1KxjCvs4c1QrQu0vsAnY0vpg==", "dev": true, "license": "MIT", "dependencies": { - "@angular-devkit/core": "22.1.2", + "@angular-devkit/core": "22.1.6", "rxjs": "7.8.2" }, "bin": { @@ -143,9 +140,9 @@ } }, "node_modules/@angular-devkit/core": { - "version": "22.1.2", - "resolved": "https://registry.npmjs.org/@angular-devkit/core/-/core-22.1.2.tgz", - "integrity": "sha512-tF1oEE7KPs8I08HJQmH5e4GkLUB3+MXXy8t6gMJULaLFxZYP9K1oXRFLappMpdm9OIbEXOChk23hrho0By9aYg==", + "version": "22.1.6", + "resolved": "https://registry.npmjs.org/@angular-devkit/core/-/core-22.1.6.tgz", + "integrity": "sha512-KLBsZoc2RhOy0xSdeYcLoSOqV/fBP3feBmhY9o12ry2IuyW/17sCmWr6XbIfTIYQN6M98Y1ewmwVNFsvV5b0gA==", "dev": true, "license": "MIT", "dependencies": { @@ -171,13 +168,13 @@ } }, "node_modules/@angular-devkit/schematics": { - "version": "22.1.2", - "resolved": "https://registry.npmjs.org/@angular-devkit/schematics/-/schematics-22.1.2.tgz", - "integrity": "sha512-Lw6NvW5rfMUl/2dsuWY8l6wlfWCuYBzCYSSqqliLPDco0doGzBliHwY9uxuzuUKZgOl5TvuVyvEo0t3o4Jj4GA==", + "version": "22.1.6", + "resolved": "https://registry.npmjs.org/@angular-devkit/schematics/-/schematics-22.1.6.tgz", + "integrity": "sha512-IbDO9KbQyQm20uinsfT8d9ZtQw41/WVutI/65mAw39WZfN8Ky+MOgOUJCGLiSccMprvZ9YdodBTnN9bLH149Ag==", "dev": true, "license": "MIT", "dependencies": { - "@angular-devkit/core": "22.1.2", + "@angular-devkit/core": "22.1.6", "jsonc-parser": "3.3.1", "magic-string": "1.0.0", "ora": "9.4.1", @@ -299,9 +296,9 @@ } }, "node_modules/@angular/animations": { - "version": "22.1.0", - "resolved": "https://registry.npmjs.org/@angular/animations/-/animations-22.1.0.tgz", - "integrity": "sha512-MHXOXmn9zmkiq234J+pr2Ir4A+z1iiVmQ0WjQ4skvK8GHTjnjeHKb4HrpAo5f7S3W0oenszmkNCddTQ3pvoJPw==", + "version": "22.1.3", + "resolved": "https://registry.npmjs.org/@angular/animations/-/animations-22.1.3.tgz", + "integrity": "sha512-EgL1BrPcn3yaRamr/R9NlYlV6hZzzKRGxVp/cnfkYzzWKG4Wcno7lkGEo6eA2Vry66AJuXUu4M1BMyhHJ96zzg==", "deprecated": "@angular/animations is deprecated. Use `animate.enter` and `animate.leave` instead. For more information see: https://v22.angular.dev/guide/animations.", "license": "MIT", "dependencies": { @@ -311,18 +308,18 @@ "node": "^22.22.3 || ^24.15.0 || >=26.0.0" }, "peerDependencies": { - "@angular/core": "22.1.0" + "@angular/core": "22.1.3" } }, "node_modules/@angular/build": { - "version": "22.1.2", - "resolved": "https://registry.npmjs.org/@angular/build/-/build-22.1.2.tgz", - "integrity": "sha512-DE/3o17JTel4EBt2BA4DqJYeBBuz5Ef/kf1jL9YZTyJu4SrLr/HI79K14jFr0VRIxzcqG92FdIzfLDxbOesQsg==", + "version": "22.1.6", + "resolved": "https://registry.npmjs.org/@angular/build/-/build-22.1.6.tgz", + "integrity": "sha512-J7JBd3hDAV4dlGNMavDC0KjtvbDd4KOddaom1inwkq92tYnD1ljmhDDigAsUBnRvQhJ82cvagD8zi0s9Ki4rTQ==", "dev": true, "license": "MIT", "dependencies": { "@ampproject/remapping": "2.3.0", - "@angular-devkit/architect": "0.2201.2", + "@angular-devkit/architect": "0.2201.6", "@babel/core": "8.0.1", "@babel/helper-annotate-as-pure": "8.0.0", "@babel/helper-split-export-declaration": "7.24.7", @@ -330,10 +327,10 @@ "@vitejs/plugin-basic-ssl": "2.3.0", "beasties": "0.4.3", "browserslist": "^4.26.0", - "esbuild": "0.28.1", + "esbuild": "0.28.2", "https-proxy-agent": "9.1.0", "jsonc-parser": "3.3.1", - "listr2": "10.2.2", + "listr2": "11.0.0", "magic-string": "1.0.0", "mrmime": "2.0.1", "oxc-parser": "0.142.0", @@ -364,7 +361,7 @@ "@angular/platform-browser": "^22.0.0", "@angular/platform-server": "^22.0.0", "@angular/service-worker": "^22.0.0", - "@angular/ssr": "^22.1.2", + "@angular/ssr": "^22.1.6", "istanbul-lib-instrument": "^6.0.0", "karma": "^6.4.0", "less": "^4.2.0", @@ -421,34 +418,10 @@ } } }, - "node_modules/@angular/build/node_modules/eventemitter3": { - "version": "5.0.4", - "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-5.0.4.tgz", - "integrity": "sha512-mlsTRyGaPBjPedk6Bvw+aqbsXDtoAyAzm5MO7JgU+yVRyMQ5O8bD4Kcci7BS85f93veegeCPkL8R4GLClnjLFw==", - "dev": true, - "license": "MIT" - }, - "node_modules/@angular/build/node_modules/listr2": { - "version": "10.2.2", - "resolved": "https://registry.npmjs.org/listr2/-/listr2-10.2.2.tgz", - "integrity": "sha512-JtNtbZj8q5BnDMR7trpwvwk3RIrANtIVzEUm8w7amp6xelLgyuq+4WZoTH913XaQAoH/cNdYhaNzBPA2U3xbDw==", - "dev": true, - "license": "MIT", - "dependencies": { - "cli-truncate": "^5.2.0", - "eventemitter3": "^5.0.4", - "log-update": "^6.1.0", - "rfdc": "^1.4.1", - "wrap-ansi": "^10.0.0" - }, - "engines": { - "node": ">=22.13.0" - } - }, "node_modules/@angular/cdk": { - "version": "22.1.0", - "resolved": "https://registry.npmjs.org/@angular/cdk/-/cdk-22.1.0.tgz", - "integrity": "sha512-yfQug47CZ+51mHy0ZLWzi6F/YHfsAF2Z7Jxo3JLM7Aj3Er47hHB8VnrNERwK5tBLs0bE5DoEIm59ga/MI3fVGg==", + "version": "22.1.4", + "resolved": "https://registry.npmjs.org/@angular/cdk/-/cdk-22.1.4.tgz", + "integrity": "sha512-//KICh/rxeLbYLgNj8HawaliVAPNlSV0aRmki45Tf/YhoXVhzon9DfFqCs5u1cLvmMkMTHdFm5ghGTB8SUv3DA==", "license": "MIT", "dependencies": { "parse5": "^8.0.0", @@ -462,25 +435,25 @@ } }, "node_modules/@angular/cli": { - "version": "22.1.2", - "resolved": "https://registry.npmjs.org/@angular/cli/-/cli-22.1.2.tgz", - "integrity": "sha512-gzB+iuZzB507DAkZb9s5+Jw8QRzOBolUhHEuAKH74xF6oWlEP5JdexfTgti45SjXaKKqeYpODJFnUmSQQJRhxA==", + "version": "22.1.6", + "resolved": "https://registry.npmjs.org/@angular/cli/-/cli-22.1.6.tgz", + "integrity": "sha512-HT3OzYkSpCyXMTgD5G1tsS7vkrY8cYJ/JgSjRjrpwOAooSMtKF1hv7BgBcn79sKg4eaiPLrDpQLXP93vHxgSFg==", "dev": true, "license": "MIT", "dependencies": { - "@angular-devkit/architect": "0.2201.2", - "@angular-devkit/core": "22.1.2", - "@angular-devkit/schematics": "22.1.2", + "@angular-devkit/architect": "0.2201.6", + "@angular-devkit/core": "22.1.6", + "@angular-devkit/schematics": "22.1.6", "@inquirer/prompts": "8.5.2", - "@listr2/prompt-adapter-inquirer": "4.2.4", - "@modelcontextprotocol/sdk": "1.29.0", - "@schematics/angular": "22.1.2", + "@listr2/prompt-adapter-inquirer": "4.2.5", + "@modelcontextprotocol/sdk": "1.30.0", + "@schematics/angular": "22.1.6", "jsonc-parser": "3.3.1", - "listr2": "10.2.2", + "listr2": "11.0.0", "npm-package-arg": "14.0.0", "parse5-html-rewriting-stream": "8.0.1", "semver": "7.8.5", - "yargs": "18.0.0", + "yargs": "18.1.0", "zod": "4.4.3" }, "bin": { @@ -492,34 +465,10 @@ "yarn": ">= 1.13.0" } }, - "node_modules/@angular/cli/node_modules/eventemitter3": { - "version": "5.0.4", - "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-5.0.4.tgz", - "integrity": "sha512-mlsTRyGaPBjPedk6Bvw+aqbsXDtoAyAzm5MO7JgU+yVRyMQ5O8bD4Kcci7BS85f93veegeCPkL8R4GLClnjLFw==", - "dev": true, - "license": "MIT" - }, - "node_modules/@angular/cli/node_modules/listr2": { - "version": "10.2.2", - "resolved": "https://registry.npmjs.org/listr2/-/listr2-10.2.2.tgz", - "integrity": "sha512-JtNtbZj8q5BnDMR7trpwvwk3RIrANtIVzEUm8w7amp6xelLgyuq+4WZoTH913XaQAoH/cNdYhaNzBPA2U3xbDw==", - "dev": true, - "license": "MIT", - "dependencies": { - "cli-truncate": "^5.2.0", - "eventemitter3": "^5.0.4", - "log-update": "^6.1.0", - "rfdc": "^1.4.1", - "wrap-ansi": "^10.0.0" - }, - "engines": { - "node": ">=22.13.0" - } - }, "node_modules/@angular/common": { - "version": "22.1.0", - "resolved": "https://registry.npmjs.org/@angular/common/-/common-22.1.0.tgz", - "integrity": "sha512-67L8AS00egxwEKnoMhNDxy+TY+eKOwvwa+os0Odq8nLm7+Qh7JnMVeub8hfncpenOFqlC/RUjO2W9H7Gd2veNA==", + "version": "22.1.3", + "resolved": "https://registry.npmjs.org/@angular/common/-/common-22.1.3.tgz", + "integrity": "sha512-QtMkjhiRd0EnmKR50bw3WbCWYTi6CmA72nnSz1BLQPpaLSi2goloCrPPniHz8fP+w2ESrmmlOWxs1Da3COgnQg==", "license": "MIT", "dependencies": { "tslib": "^2.3.0" @@ -528,14 +477,14 @@ "node": "^22.22.3 || ^24.15.0 || >=26.0.0" }, "peerDependencies": { - "@angular/core": "22.1.0", + "@angular/core": "22.1.3", "rxjs": "^6.5.3 || ^7.4.0" } }, "node_modules/@angular/compiler": { - "version": "22.1.0", - "resolved": "https://registry.npmjs.org/@angular/compiler/-/compiler-22.1.0.tgz", - "integrity": "sha512-WCmuPnuXgqnqrkbrwqQRyldi1k3rlzNLVDl8ntINF7XWuJh0KfQLEkRK0FCCmBztWJkbGug4RBVnKTWlKhRzCQ==", + "version": "22.1.3", + "resolved": "https://registry.npmjs.org/@angular/compiler/-/compiler-22.1.3.tgz", + "integrity": "sha512-L8Mw2r7bGG/obqgQC+RU3mdFJ3NtLgO5gWhEC1ylcHpLCMPIAXYsMKJIL8dnS78S1wXo/omXwmJ4FiIlCwWahg==", "license": "MIT", "dependencies": { "tslib": "^2.3.0" @@ -545,9 +494,9 @@ } }, "node_modules/@angular/compiler-cli": { - "version": "22.1.0", - "resolved": "https://registry.npmjs.org/@angular/compiler-cli/-/compiler-cli-22.1.0.tgz", - "integrity": "sha512-jL89dbzkrV8AeLaxedBgT7ErMnbfi2dvwDJuCrUgm3eCNfbcOpGbNxzH+wDgvbRg2Lhj11/u3JPbW50xA6rvvg==", + "version": "22.1.3", + "resolved": "https://registry.npmjs.org/@angular/compiler-cli/-/compiler-cli-22.1.3.tgz", + "integrity": "sha512-37lLaDp0RHWZ/lmJqCmIEr0HOM2D5ulHy61gqTBm7KRj3Y6ZaxR8B/JqZmeIpPzKFILVsga+NQ4A8apBUkmezw==", "license": "MIT", "dependencies": { "@babel/core": "8.0.1", @@ -567,7 +516,7 @@ "node": "^22.22.3 || ^24.15.0 || >=26.0.0" }, "peerDependencies": { - "@angular/compiler": "22.1.0", + "@angular/compiler": "22.1.3", "typescript": ">=6.0 <6.1" }, "peerDependenciesMeta": { @@ -577,9 +526,9 @@ } }, "node_modules/@angular/core": { - "version": "22.1.0", - "resolved": "https://registry.npmjs.org/@angular/core/-/core-22.1.0.tgz", - "integrity": "sha512-X5UaMuOCI4HAvSQIs3QtM+5e0Cni16DRaHUIL3BIBd4ZQNnSH3pZ25TsKQ8Jlu/3hAQ9rzV278kNQcecooGJ7g==", + "version": "22.1.3", + "resolved": "https://registry.npmjs.org/@angular/core/-/core-22.1.3.tgz", + "integrity": "sha512-313+Xkf970AmStJE0E/zNJW/9xvDExQG+6TNltBBl+KJsW0q5dffK2w2PQfV4mtTquBqYoeHSRsms4WgjBKL8g==", "license": "MIT", "dependencies": { "tslib": "^2.3.0" @@ -588,7 +537,7 @@ "node": "^22.22.3 || ^24.15.0 || >=26.0.0" }, "peerDependencies": { - "@angular/compiler": "22.1.0", + "@angular/compiler": "22.1.3", "rxjs": "^6.5.3 || ^7.4.0", "zone.js": "~0.15.0 || ~0.16.0" }, @@ -602,9 +551,9 @@ } }, "node_modules/@angular/forms": { - "version": "22.1.0", - "resolved": "https://registry.npmjs.org/@angular/forms/-/forms-22.1.0.tgz", - "integrity": "sha512-nWlSM/pPp78Sx/fBM/tFEgZxdfZe50LkCE2/hkO22Fi1UM2maGc43LDsu/s6l0q9hFep4Wj+xa30KXDBS7Cn8A==", + "version": "22.1.3", + "resolved": "https://registry.npmjs.org/@angular/forms/-/forms-22.1.3.tgz", + "integrity": "sha512-b4ual9pgfNqcnEHord50w960DDFIytG3Qb3bu2aCgzmagvRlg9wrtwQNqY+oqY2FVq7c9McNUN7MZRcWl9HNdQ==", "license": "MIT", "dependencies": { "@standard-schema/spec": "^1.0.0", @@ -615,16 +564,16 @@ "node": "^22.22.3 || ^24.15.0 || >=26.0.0" }, "peerDependencies": { - "@angular/common": "22.1.0", - "@angular/core": "22.1.0", - "@angular/platform-browser": "22.1.0", + "@angular/common": "22.1.3", + "@angular/core": "22.1.3", + "@angular/platform-browser": "22.1.3", "rxjs": "^6.5.3 || ^7.4.0" } }, "node_modules/@angular/language-service": { - "version": "22.1.0", - "resolved": "https://registry.npmjs.org/@angular/language-service/-/language-service-22.1.0.tgz", - "integrity": "sha512-5J+j17o9rvJEiTVotsQfHprPCgKrHhYxz+SpiV25p5mG2qOJ9vX465o/ODbFpRapK8eyHqd/HkPRaGafu3nZkg==", + "version": "22.1.3", + "resolved": "https://registry.npmjs.org/@angular/language-service/-/language-service-22.1.3.tgz", + "integrity": "sha512-Nc5cHyuYTTH9uENTSmJFiqR85xPGFkpOwxN6Ms2qlqz767FyOXna0iqw2DprNRB1+xG/WtP4RbCI6ofyXHbM0w==", "dev": true, "license": "MIT", "engines": { @@ -632,9 +581,9 @@ } }, "node_modules/@angular/localize": { - "version": "22.1.0", - "resolved": "https://registry.npmjs.org/@angular/localize/-/localize-22.1.0.tgz", - "integrity": "sha512-oT0d+ru2Rdd1UwLTthu/oMvQ8yXSVCcHTkpH7wO8AXjFCsS9OLCzmmiCdnk/UL2ClaNygJi2I4BNEuKtX+dWRA==", + "version": "22.1.3", + "resolved": "https://registry.npmjs.org/@angular/localize/-/localize-22.1.3.tgz", + "integrity": "sha512-/u0nCz2AY+RXB4HUdw3Y7C/ZiierPPmUuWR/nDPCylHwllVdMKpi6PPtKvfzgM5ZvaISzDghTVykOVjU7obMhg==", "license": "MIT", "dependencies": { "@babel/core": "8.0.1", @@ -650,20 +599,20 @@ "node": "^22.22.3 || ^24.15.0 || >=26.0.0" }, "peerDependencies": { - "@angular/compiler": "22.1.0", - "@angular/compiler-cli": "22.1.0" + "@angular/compiler": "22.1.3", + "@angular/compiler-cli": "22.1.3" } }, "node_modules/@angular/material": { - "version": "22.1.0", - "resolved": "https://registry.npmjs.org/@angular/material/-/material-22.1.0.tgz", - "integrity": "sha512-i3Os8JZg4DejgNTtw8GCLQbbZ8+lv8h/ym6PxRwmYNpegmyGiVSKAZ2JBkEs5f1pmMaTppuG3MF6mXei4xi6Wg==", + "version": "22.1.4", + "resolved": "https://registry.npmjs.org/@angular/material/-/material-22.1.4.tgz", + "integrity": "sha512-d4+uajpIYmyjar/4dypd5L+z8pbgkaCOsSxsrslmE0o0wK7mfFvXCkn0wwfucey5yUHXjswlKu1X5RzJZLOZ+w==", "license": "MIT", "dependencies": { "tslib": "^2.3.0" }, "peerDependencies": { - "@angular/cdk": "22.1.0", + "@angular/cdk": "22.1.4", "@angular/common": "^22.0.0 || ^23.0.0", "@angular/core": "^22.0.0 || ^23.0.0", "@angular/forms": "^22.0.0 || ^23.0.0", @@ -672,9 +621,9 @@ } }, "node_modules/@angular/platform-browser": { - "version": "22.1.0", - "resolved": "https://registry.npmjs.org/@angular/platform-browser/-/platform-browser-22.1.0.tgz", - "integrity": "sha512-gqUYDUiPfwbaLYdH8WLnOLl3feo3OcNpnMO08HBHaUdi4TLNkC28xwa9fC6ANyYD22QZ5A3abSg8fmR6upWMwg==", + "version": "22.1.3", + "resolved": "https://registry.npmjs.org/@angular/platform-browser/-/platform-browser-22.1.3.tgz", + "integrity": "sha512-A8McE6AclwZa2ese4jMfZZu+qZfBFQ4Hl6CaMpzJ1C6Vv6+sXkLu9pouTosJEsUE+etVdepDsqau90lhzgw3Eg==", "license": "MIT", "dependencies": { "tslib": "^2.3.0" @@ -683,9 +632,9 @@ "node": "^22.22.3 || ^24.15.0 || >=26.0.0" }, "peerDependencies": { - "@angular/animations": "22.1.0", - "@angular/common": "22.1.0", - "@angular/core": "22.1.0" + "@angular/animations": "22.1.3", + "@angular/common": "22.1.3", + "@angular/core": "22.1.3" }, "peerDependenciesMeta": { "@angular/animations": { @@ -694,9 +643,9 @@ } }, "node_modules/@angular/platform-browser-dynamic": { - "version": "22.1.0", - "resolved": "https://registry.npmjs.org/@angular/platform-browser-dynamic/-/platform-browser-dynamic-22.1.0.tgz", - "integrity": "sha512-iLn9vCk6HhxQZhFJIEBjHH1CbyOLEABw0Do3VAzly2YimemitgQEmTLJ5a96qd70rYmpJH6zudhnYqUjyaI6Ig==", + "version": "22.1.3", + "resolved": "https://registry.npmjs.org/@angular/platform-browser-dynamic/-/platform-browser-dynamic-22.1.3.tgz", + "integrity": "sha512-dXI8U7C4QZOvWIA2VWPFjGQjJ6ceHlYRkShdvaluKmml6CxxPPvirjwQGj+G/syfAaArSzLijK4hM9xDuMo41w==", "deprecated": "@angular/platform-browser-dynamic is deprecated. Use `@angular/platform-browser` instead.", "license": "MIT", "dependencies": { @@ -706,16 +655,16 @@ "node": "^22.22.3 || ^24.15.0 || >=26.0.0" }, "peerDependencies": { - "@angular/common": "22.1.0", - "@angular/compiler": "22.1.0", - "@angular/core": "22.1.0", - "@angular/platform-browser": "22.1.0" + "@angular/common": "22.1.3", + "@angular/compiler": "22.1.3", + "@angular/core": "22.1.3", + "@angular/platform-browser": "22.1.3" } }, "node_modules/@angular/platform-server": { - "version": "22.1.0", - "resolved": "https://registry.npmjs.org/@angular/platform-server/-/platform-server-22.1.0.tgz", - "integrity": "sha512-b6Z17lqwtR1SuLBfh2LsGnyFGCPjAdgEXFOYVqV/JOACJCxHFG0TwE6BKYKe8lCgDkC5nQk0uM5pJNv2uC2tUw==", + "version": "22.1.3", + "resolved": "https://registry.npmjs.org/@angular/platform-server/-/platform-server-22.1.3.tgz", + "integrity": "sha512-tzbMQSwHx2oIIjWQAgRunNNz3FW+AMYiUwVtdkKBXvPSp2d/ry+/6XO6fZ0BIi3ejhwtfIJL3GlOtmPMCHTkyw==", "license": "MIT", "dependencies": { "tslib": "^2.3.0", @@ -725,17 +674,17 @@ "node": "^22.22.3 || ^24.15.0 || >=26.0.0" }, "peerDependencies": { - "@angular/common": "22.1.0", - "@angular/compiler": "22.1.0", - "@angular/core": "22.1.0", - "@angular/platform-browser": "22.1.0", + "@angular/common": "22.1.3", + "@angular/compiler": "22.1.3", + "@angular/core": "22.1.3", + "@angular/platform-browser": "22.1.3", "rxjs": "^6.5.3 || ^7.4.0" } }, "node_modules/@angular/router": { - "version": "22.1.0", - "resolved": "https://registry.npmjs.org/@angular/router/-/router-22.1.0.tgz", - "integrity": "sha512-42Bs0g+tV2gE70Lqnt+VD/+DWbvWwQcg8QgXkTIu3A504tYknrZG/wmvki2AJGyZhmyQ46B4pfXLG4WDP8MFSA==", + "version": "22.1.3", + "resolved": "https://registry.npmjs.org/@angular/router/-/router-22.1.3.tgz", + "integrity": "sha512-23owvZKCpdL7Yh3EzBj4OLf3x0z+jT9b57Qk96wdwI8Lsyf9L78/RJPYCutJ5r+zq3pFM/BHVKyd+2hkfH7N6Q==", "license": "MIT", "dependencies": { "tslib": "^2.3.0" @@ -744,16 +693,16 @@ "node": "^22.22.3 || ^24.15.0 || >=26.0.0" }, "peerDependencies": { - "@angular/common": "22.1.0", - "@angular/core": "22.1.0", - "@angular/platform-browser": "22.1.0", + "@angular/common": "22.1.3", + "@angular/core": "22.1.3", + "@angular/platform-browser": "22.1.3", "rxjs": "^6.5.3 || ^7.4.0" } }, "node_modules/@angular/ssr": { - "version": "22.1.2", - "resolved": "https://registry.npmjs.org/@angular/ssr/-/ssr-22.1.2.tgz", - "integrity": "sha512-cuTwQHq9f6vrEz0mNOzJxJurAE6mb+os+m1zGPFVIVnRMK3bJhAhHWYRkInOBvsfC1K0cpHtGR/97ctvmiqP0A==", + "version": "22.1.6", + "resolved": "https://registry.npmjs.org/@angular/ssr/-/ssr-22.1.6.tgz", + "integrity": "sha512-MvSaCg2Kren50Ei8o98bDG4555aNAQdeP+PfamOyUPWx3LBdoW5LEhnOq7yxWDcuzyXIs/k0DjQnbojPH/75Uw==", "license": "MIT", "dependencies": { "tslib": "^2.3.0" @@ -1188,9 +1137,9 @@ } }, "node_modules/@bufbuild/protobuf": { - "version": "2.13.0", - "resolved": "https://registry.npmjs.org/@bufbuild/protobuf/-/protobuf-2.13.0.tgz", - "integrity": "sha512-acq7c49vxfm1ggJ95P70TX7ABDM0vxr1SYD3BB0o0jnBLB4OAqeHyKuN+cD3w80gXEDQ2zxHpR6CUeA+O/aU9g==", + "version": "2.14.0", + "resolved": "https://registry.npmjs.org/@bufbuild/protobuf/-/protobuf-2.14.0.tgz", + "integrity": "sha512-C3UGsiCwSprE2NKIIFA3hCDlpXTMCAXRZuEVp88L1GY36Y41+rYL5fryE+nOFhp4p4JPQvdV8PQ4DWgHgeTE+w==", "license": "(Apache-2.0 AND BSD-3-Clause)" }, "node_modules/@colors/colors": { @@ -1296,9 +1245,9 @@ } }, "node_modules/@esbuild/aix-ppc64": { - "version": "0.28.1", - "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.28.1.tgz", - "integrity": "sha512-Svl7tq8k/08+p6CXPpRjQ1fKX+1odH/BQbb48fV6fj3CWHhsoIOoY87w1oHXm0qEpkIK3ZfVgp0hed3XBXzXMQ==", + "version": "0.28.2", + "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.28.2.tgz", + "integrity": "sha512-XExcO+dvLKvVtNTibSTBej1NCAbaGhWn9Ww1ZPx80qsahhPFe/8jgWP0IchNe0F3HwkU7n8ejhH8bjonqht8mQ==", "cpu": [ "ppc64" ], @@ -1313,9 +1262,9 @@ } }, "node_modules/@esbuild/android-arm": { - "version": "0.28.1", - "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.28.1.tgz", - "integrity": "sha512-0k2F129Xdio1TdJfzJ8sy1Q47vUD2NnwdhiAf7drUN1EBTfPf4hsFCtmMgu/6m8JSzsBrlmVjudMBQqOfG8usQ==", + "version": "0.28.2", + "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.28.2.tgz", + "integrity": "sha512-kXXoiPVVGQcnIYGOeaovwOURpniDBpSq4A03qkQ+BMQqtGG6HYap3xne9C1O1yo4TR3qxlCX5IqqmX6fFo2Lqg==", "cpu": [ "arm" ], @@ -1330,9 +1279,9 @@ } }, "node_modules/@esbuild/android-arm64": { - "version": "0.28.1", - "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.28.1.tgz", - "integrity": "sha512-34EGEbCIAgosYz6goLcopX6Mo7NyGv9tfwEM2/7Ce2VcVRk568iSvniGWcUXIy7wEDR1wzolcxcriFVrWYcwBg==", + "version": "0.28.2", + "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.28.2.tgz", + "integrity": "sha512-5YfKeeI8qWfBZIX+u2xZC3Zlb3Os/gLS2sbEKM+I4ZOcsWmHS2WLysCcQZDAFRslDUU5Oiq44gf6PYN1vGwG5A==", "cpu": [ "arm64" ], @@ -1347,9 +1296,9 @@ } }, "node_modules/@esbuild/android-x64": { - "version": "0.28.1", - "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.28.1.tgz", - "integrity": "sha512-dbwY7ltSMDWsRatcRpCnES4F+im88OCUgGZjy52shC7GqHRE/cYlxNbB4Z4UpJswpcc4Qxd2oE/ufM0p61IKng==", + "version": "0.28.2", + "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.28.2.tgz", + "integrity": "sha512-O387ite7SzUyCcy3JQX4P4bLtEA7bLLkx+esve5JHnyYfNTxcVpXZo9jhdB0lTKN44gztELTdU7nS8Nr16Fs1Q==", "cpu": [ "x64" ], @@ -1364,9 +1313,9 @@ } }, "node_modules/@esbuild/darwin-arm64": { - "version": "0.28.1", - "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.28.1.tgz", - "integrity": "sha512-TZbWkQY7kvTAXbXUT7uVACR5cMHsDiSz9z7ZKAX/RTq/WJEk3QyRr0wZpNhBDX+/0CtdqUIJlOiodQcta6tY3Q==", + "version": "0.28.2", + "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.28.2.tgz", + "integrity": "sha512-n4KqkOQrraxHJcgjM1RvwbigfQKIKJVpM7xp+KsxiyUSrRdIXnt73VhrPAx0fV44hgfmIVKjxMN9J1t5jySVkw==", "cpu": [ "arm64" ], @@ -1381,9 +1330,9 @@ } }, "node_modules/@esbuild/darwin-x64": { - "version": "0.28.1", - "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.28.1.tgz", - "integrity": "sha512-zfdzgK9ACBNZLI/CyHTOx81SyNbM6YXn7rxSgX97VjyiPl9W1i4Ka4fgKECEoFCKGpvBj5qArWIGgQjOwkgskQ==", + "version": "0.28.2", + "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.28.2.tgz", + "integrity": "sha512-uq6suIWYP37qzGddBKPw5QEQPi6HiLGsO7UmkpfyaYNQ3D+rN6w6WfwH+nuqcGXWvawGwxOEroO4YGnFh95azw==", "cpu": [ "x64" ], @@ -1398,9 +1347,9 @@ } }, "node_modules/@esbuild/freebsd-arm64": { - "version": "0.28.1", - "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.28.1.tgz", - "integrity": "sha512-wG2EA8ENdEI0qhkSZMjfqrdY+ziCYCPMmtZjjIwOmXFjmyzEHn+UUxk5of+SYsjtfs3VpnlC7QLzSI5hY/rOAw==", + "version": "0.28.2", + "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.28.2.tgz", + "integrity": "sha512-n+I0BTSRIoy+d6RPKnEVwql5UwBJolytvY4mAOIEJorKlqgPII8ix6slVVrfZ5Tnj7glIZvloylbB/EJPMWEXw==", "cpu": [ "arm64" ], @@ -1415,9 +1364,9 @@ } }, "node_modules/@esbuild/freebsd-x64": { - "version": "0.28.1", - "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.28.1.tgz", - "integrity": "sha512-i7dZ9vQgnvSCzi/rYCXNgtF/U+eKZNJBzu3eTQbRgHnM7tNSizLOkRFAl3qzVc/Op/u5YkHHa4pf/3DOYHthLQ==", + "version": "0.28.2", + "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.28.2.tgz", + "integrity": "sha512-78XJTJkvPs0kz2w61301PJjXl4g7q3JqiYMZ/M/yVI73EHBrCRTgkhu9oqG7vPqq+a/yadEW8aD+agKlk5xrmg==", "cpu": [ "x64" ], @@ -1432,9 +1381,9 @@ } }, "node_modules/@esbuild/linux-arm": { - "version": "0.28.1", - "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.28.1.tgz", - "integrity": "sha512-qVXBOHQS+d5Y722GwJzJUtOLlX7km3CraOaGormF1pDtPd2C/l1SHRPgjLunLGe51Sh5YYWKMFDyV4SxgMQYTQ==", + "version": "0.28.2", + "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.28.2.tgz", + "integrity": "sha512-XlDnu2q5yoqems+xay6wSAcg9DDD7K9RLKZEBOMZm3ckNpJBvOX20tSfby8KfrrhINDyv9V2YVZKY/SpoGJI8w==", "cpu": [ "arm" ], @@ -1449,9 +1398,9 @@ } }, "node_modules/@esbuild/linux-arm64": { - "version": "0.28.1", - "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.28.1.tgz", - "integrity": "sha512-yHs+0uc8+nvEAfAfxrWQKK5peSNzBc4PegcMO0EJ2hT71uA7vB8Ihg2e77R2P7SG5uYjPbHlLLmve4LLLRCf0g==", + "version": "0.28.2", + "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.28.2.tgz", + "integrity": "sha512-pW4AC0P3it8c7do9MVM4p51FzHzdM/TZrerurgRcHJ2WTa1VQ1CIq18xncfpBJw4ojkiZZrKW2yIBWBP92j6Ug==", "cpu": [ "arm64" ], @@ -1466,9 +1415,9 @@ } }, "node_modules/@esbuild/linux-ia32": { - "version": "0.28.1", - "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.28.1.tgz", - "integrity": "sha512-d1z4ZuP0ajrfz/FhGT4vv278rX8KnPPJx8i5+AtK7TYbx9Le9F1hyzurZpkEyjkGa9dUGhQow4C1NmeGvqxN2w==", + "version": "0.28.2", + "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.28.2.tgz", + "integrity": "sha512-CYbnj78HsIeA+DhgUKgFCfvNsTHFhMMrinUrMZpDXJXKN8T3XViTZ/+wtHeVxEWY8ewSzTFN+nRmSwO2tZaLUQ==", "cpu": [ "ia32" ], @@ -1483,9 +1432,9 @@ } }, "node_modules/@esbuild/linux-loong64": { - "version": "0.28.1", - "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.28.1.tgz", - "integrity": "sha512-M5sRjUVZrkm1OAPR3dlOYzNmN+loZKGVi1VUQGrwuqLcbR6qeAz+famMhjASeH3YVKvZz+zT1jlh/keC3Rj/lg==", + "version": "0.28.2", + "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.28.2.tgz", + "integrity": "sha512-buwkd8nsph4R+ajRvw0qM5Hja/TXQow3ptzWO2EbG/cqcIkHloRrdlBtQlshyYGTNFvfkfJ5tpPLVkY4DtsPfQ==", "cpu": [ "loong64" ], @@ -1500,9 +1449,9 @@ } }, "node_modules/@esbuild/linux-mips64el": { - "version": "0.28.1", - "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.28.1.tgz", - "integrity": "sha512-mRObBZeHh2OxcBFPWE/FjylkRgZdYuiTR3vaTozquCGOH14iP9oN4x4Ge81CoIDYQrXmIxpFumJBu5MtZpnQJQ==", + "version": "0.28.2", + "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.28.2.tgz", + "integrity": "sha512-ZVykbDyk7519VwiNb9Lcj9m8XM6v5V9uKPvrEMkkEedVewf+0itkhahp4HDpgERXhwLRpWFypsGbG/J8s0QjJA==", "cpu": [ "mips64el" ], @@ -1517,9 +1466,9 @@ } }, "node_modules/@esbuild/linux-ppc64": { - "version": "0.28.1", - "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.28.1.tgz", - "integrity": "sha512-slScBsMAb3GFDcdrCgLwZtPYRoH2H/youv10QiZyRjmsP48fznoveWytSgCI/R0ZcUgpc0ZhIUEx6LHts8yrfQ==", + "version": "0.28.2", + "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.28.2.tgz", + "integrity": "sha512-CAXl+Dtd9UUuJd8pKKdwh6MLm3MUMiqMPmhZ3tTSXPqfyQ3vDl6R5hZdZ/kYojK4ofXtdfSv1tFq8XzWx3heNQ==", "cpu": [ "ppc64" ], @@ -1534,9 +1483,9 @@ } }, "node_modules/@esbuild/linux-riscv64": { - "version": "0.28.1", - "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.28.1.tgz", - "integrity": "sha512-kw0owk1o0GFETUJyW0jc0G4Yzs0BHZn0JDZ8JRT088vjJYX777BAs1fDGxAC+q831qOs2DTC96mNsG2opdfyyQ==", + "version": "0.28.2", + "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.28.2.tgz", + "integrity": "sha512-GeXCej4IQtU1B+QlDV8W/RRvbzI3O/Stss+/bCXv4lZls5WGRtu2a+3JkA3i4qIUlMXpcHebWpF8AkJhATowuA==", "cpu": [ "riscv64" ], @@ -1551,9 +1500,9 @@ } }, "node_modules/@esbuild/linux-s390x": { - "version": "0.28.1", - "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.28.1.tgz", - "integrity": "sha512-/lAIjX8aYFRByhh6L5rYtPEDRqa9de/4V/juOXcta5frjvzXO4/sqEtyytse0g3zZFuWu5cDN0MkLz2qRDD2Ag==", + "version": "0.28.2", + "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.28.2.tgz", + "integrity": "sha512-3H1weTYZPxt/WOhByszQZybS9w5lKzUn1FDMsgEChbHWQwHYQQRfBxgCcZvPhjHfKyJjIievvMmEUawJrdY9Dg==", "cpu": [ "s390x" ], @@ -1568,9 +1517,9 @@ } }, "node_modules/@esbuild/linux-x64": { - "version": "0.28.1", - "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.28.1.tgz", - "integrity": "sha512-u/anNYF2mmVOEDwLtnQ1wOr3EZ9sTNGLWrsYGYwHWzGA3Si84IOkHXlbWTD1NB+9/1lcnweYKO54uhxZydNzfA==", + "version": "0.28.2", + "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.28.2.tgz", + "integrity": "sha512-4xTZr1FUmSoQW4XIWmit3tzQrUTZM+N3P0XV8xROKYF50XfI7xeO90+1bZvNwxIufQ9hDQVRJH5YhgPVF8A/HQ==", "cpu": [ "x64" ], @@ -1585,9 +1534,9 @@ } }, "node_modules/@esbuild/netbsd-arm64": { - "version": "0.28.1", - "resolved": "https://registry.npmjs.org/@esbuild/netbsd-arm64/-/netbsd-arm64-0.28.1.tgz", - "integrity": "sha512-oks0DYbLwWMmaakTsCb+zL4E+aHRVLom9IJZOAthMQEPiQmydXHkziYEsGYRx0uNV/IjEKGAV941JzH02pflqw==", + "version": "0.28.2", + "resolved": "https://registry.npmjs.org/@esbuild/netbsd-arm64/-/netbsd-arm64-0.28.2.tgz", + "integrity": "sha512-sSATRjPeDBg3pdgHoQfoYBob11Kk1FGa9lui5RIHZCoCkJa9QKlvl3/vKz2usCmYYjs7ymJR/2Nnsqe+Hjt5nw==", "cpu": [ "arm64" ], @@ -1602,9 +1551,9 @@ } }, "node_modules/@esbuild/netbsd-x64": { - "version": "0.28.1", - "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.28.1.tgz", - "integrity": "sha512-aeL6lAnN89Hz43Mlh1G8ARasbuoYvSITDEx0tHh5b7jJnHcssqgjy9Yx430GDpmCa6OyrKoS0aNRjKundRizGg==", + "version": "0.28.2", + "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.28.2.tgz", + "integrity": "sha512-lqnzCV+mM0gIADaKihiCg6ifgfU2L3h5E33rNQBN1Y4MaVGnzryzmvvf7UHxprpQdE8hpqLolJ9Rl+SkIRDpyw==", "cpu": [ "x64" ], @@ -1619,9 +1568,9 @@ } }, "node_modules/@esbuild/openbsd-arm64": { - "version": "0.28.1", - "resolved": "https://registry.npmjs.org/@esbuild/openbsd-arm64/-/openbsd-arm64-0.28.1.tgz", - "integrity": "sha512-MEFJe5C3R8pwXdZ5Y21oo6m7ePiS0d9pWucn99O/wvyJZChoIQKrQDxKrGeW8F5+T0okTHesAmDeiHDTIq0V/Q==", + "version": "0.28.2", + "resolved": "https://registry.npmjs.org/@esbuild/openbsd-arm64/-/openbsd-arm64-0.28.2.tgz", + "integrity": "sha512-AL2qJILH7lNjrDmCQDvdxMfAUIv8KMNZOvrwAQ8i8//ntL9FflhOyMJ8OZSMBb8/AWXe3/5v5S20y3zCoZWKoQ==", "cpu": [ "arm64" ], @@ -1636,9 +1585,9 @@ } }, "node_modules/@esbuild/openbsd-x64": { - "version": "0.28.1", - "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.28.1.tgz", - "integrity": "sha512-i/ZLIOafE0Z8cI/XANJAixoJL/uRAoS2xOA3rb0xN+KK0K177cMAsQYkzHtBrtMXAKuAc7HGgcWiZ/sRC1Nxgw==", + "version": "0.28.2", + "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.28.2.tgz", + "integrity": "sha512-QtiuPytchRyC4rwUKhexJdQKvDuZ6hWloi3igqPQNUJCS1/v9EiO3UTOXR6A3FoMo4fnAKbWJdqaIwhOzh8qEw==", "cpu": [ "x64" ], @@ -1653,9 +1602,9 @@ } }, "node_modules/@esbuild/openharmony-arm64": { - "version": "0.28.1", - "resolved": "https://registry.npmjs.org/@esbuild/openharmony-arm64/-/openharmony-arm64-0.28.1.tgz", - "integrity": "sha512-ge+Z7EXFNt2BO1oAMsVpiQ8EwndV9i1xXerAeTIK7AtPs3bKFXQM7nlRxDSIUIMeueR1CNXxqztLzdNeReKBJg==", + "version": "0.28.2", + "resolved": "https://registry.npmjs.org/@esbuild/openharmony-arm64/-/openharmony-arm64-0.28.2.tgz", + "integrity": "sha512-WkhYDmpTjLvGlScA1rwjRUmhl4k8oXR3cIbtqWmELgU/dFeHHlEllxDvdWcNJV9rbzCexB5vz8gtNewWLgCT7Q==", "cpu": [ "arm64" ], @@ -1670,9 +1619,9 @@ } }, "node_modules/@esbuild/sunos-x64": { - "version": "0.28.1", - "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.28.1.tgz", - "integrity": "sha512-BEjgtECkL3vY+SaSQ6nzVfiALUeFxpawyp8Jmf5PtYhf1Ug40N1h/hxlhts+f1FvSvarEigdxS3BlSMI2PJLcQ==", + "version": "0.28.2", + "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.28.2.tgz", + "integrity": "sha512-GPMSkTOtMnv2U2F8gxe4Io6qmVs+YKyp832Etqqxr0hFngmXQ3rzwytelm3GIn7T4VviRUlf3sOgBOiTdvaf7g==", "cpu": [ "x64" ], @@ -1687,9 +1636,9 @@ } }, "node_modules/@esbuild/win32-arm64": { - "version": "0.28.1", - "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.28.1.tgz", - "integrity": "sha512-lCv9eK/H6ZJWbE7bh2nw54CZ9M2nupBxJcTsdk/QQnWkdSjKGuxmmH8/GWrlT1eMmZfn4dGcCjRte397WqfQXA==", + "version": "0.28.2", + "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.28.2.tgz", + "integrity": "sha512-PIhhEkE9uPBleRBrQEJpUn7MBnibZzbGzYWPmY3x+YoVg/95zbjB4CxPPOQ8l5tYYM4mMaCthF8/1DIfBQQyWQ==", "cpu": [ "arm64" ], @@ -1704,9 +1653,9 @@ } }, "node_modules/@esbuild/win32-ia32": { - "version": "0.28.1", - "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.28.1.tgz", - "integrity": "sha512-zvb/mB2bSCoJOpoCBgYKKpX6YM6mJBlBUVUtVj41DlZJVEB6/0CKlRYxP5wWl1C1ILiCoAU5wZZ4q1P3qeS6Eg==", + "version": "0.28.2", + "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.28.2.tgz", + "integrity": "sha512-YmJbfTlvU7Sdn9BB+4PRES4oB6pxgS37MAONj+hBr/cpXS1aBPKXxNnDbu+QCWPj0o9dgyxeq79g6c5P8KeuYA==", "cpu": [ "ia32" ], @@ -1721,9 +1670,9 @@ } }, "node_modules/@esbuild/win32-x64": { - "version": "0.28.1", - "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.28.1.tgz", - "integrity": "sha512-bm4Mowrv+GXMlpWX++EcXw/iLyd1o3+bJkC2DkWXYVvgZCqD/bSj9ctZeAMC3cIxgjRVR2Dufaiu4YPxr5gW1A==", + "version": "0.28.2", + "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.28.2.tgz", + "integrity": "sha512-5ebpxr3nWMzrL/rnUI755Jkuee0bHL/Gq0WTF9lvcpv73wAp5eu8MfBUgWK9bhWvZjj7yX8etf/8tI8Ney695g==", "cpu": [ "x64" ], @@ -2021,12 +1970,12 @@ "optional": true }, "node_modules/@hono/node-server": { - "version": "1.19.17", - "resolved": "https://registry.npmjs.org/@hono/node-server/-/node-server-1.19.17.tgz", - "integrity": "sha512-dSneS5qhiauZWGDCeK4o695Xd9nUNjviSZCMQrj10eetr8Uln1ucn6bbphOM6UynAMMtNIzZNSpL9vnASJwrPQ==", + "version": "2.1.1", + "resolved": "https://registry.npmjs.org/@hono/node-server/-/node-server-2.1.1.tgz", + "integrity": "sha512-ELuehkj5VCBdgEw9zs+ivkKwyzzUCSQuE96YmiPvn1ECBoZCczbFXJLeEGMTYjphP6gydh4pHMqEYPVMYUVgQg==", "license": "MIT", "engines": { - "node": ">=18.14.1" + "node": ">=20" }, "peerDependencies": { "hono": "^4" @@ -2099,17 +2048,17 @@ } }, "node_modules/@igniteui/angular-schematics": { - "version": "22.0.1550", - "resolved": "https://registry.npmjs.org/@igniteui/angular-schematics/-/angular-schematics-22.0.1550.tgz", - "integrity": "sha512-oP4HGxFOWdp4p6XdZBUdBZn1FGa6NjPcQmTv3R22sx0Fojd6CPuvj9fx21Rm26Pwz9xzKin5VDA4SRNCPUF+Bw==", + "version": "22.0.1551", + "resolved": "https://registry.npmjs.org/@igniteui/angular-schematics/-/angular-schematics-22.0.1551.tgz", + "integrity": "sha512-EIg1vSYqpg4E0O1WEza7mA95oCl/h/kc+ISl87sVi0I3E0hIrMPMim8XKCl4iUdiOfQUNS6DGGkS2IRfDYU8vQ==", "dev": true, "hasInstallScript": true, "license": "MIT", "dependencies": { "@angular-devkit/core": "^22.0.0", "@angular-devkit/schematics": "^22.0.0", - "@igniteui/angular-templates": "~22.0.1550", - "@igniteui/cli-core": "~15.5.0", + "@igniteui/angular-templates": "~22.0.1551", + "@igniteui/cli-core": "~15.5.1", "@schematics/angular": "^22.0.0", "minimatch": "^10.0.1", "rxjs": "~7.8.1", @@ -2131,13 +2080,13 @@ } }, "node_modules/@igniteui/angular-templates": { - "version": "22.0.1550", - "resolved": "https://registry.npmjs.org/@igniteui/angular-templates/-/angular-templates-22.0.1550.tgz", - "integrity": "sha512-hgXWuD4O5wGaz+Le9hKMn+aiqjk/XJWKhsSK64OLFblZFlWGhnXIXZCZ02JBv849m0qK4xkKQHSCXtwu9HMIoA==", + "version": "22.0.1551", + "resolved": "https://registry.npmjs.org/@igniteui/angular-templates/-/angular-templates-22.0.1551.tgz", + "integrity": "sha512-S0urk6pHE0v3FxFYHIiQhId+flQ/iZkNW0d/1QyOX5M2Z5CUAkEbbL5isA/hy1suMkNWX/0Drn2j1KPlLhGyNw==", "dev": true, "license": "MIT", "dependencies": { - "@igniteui/cli-core": "~15.5.0", + "@igniteui/cli-core": "~15.5.1", "typescript": "~5.5.4" } }, @@ -2156,9 +2105,9 @@ } }, "node_modules/@igniteui/cli-core": { - "version": "15.5.0", - "resolved": "https://registry.npmjs.org/@igniteui/cli-core/-/cli-core-15.5.0.tgz", - "integrity": "sha512-sg+ZtniGEMSR/VNsv4gKNB6s2RMf+b88ttQNm5DDzunKtqK+mG5hDHGNHrRnR99dlZCNVOX0ve3W7z3jXn7f/A==", + "version": "15.5.1", + "resolved": "https://registry.npmjs.org/@igniteui/cli-core/-/cli-core-15.5.1.tgz", + "integrity": "sha512-6dLyvev54EjljEifIc+SEHtbm83TR3vm8vLTuCOGlhyS62hqjqS/aOTJuLyo9hTBkYeaE741SMNVTTo1Zd06yw==", "dev": true, "license": "MIT", "dependencies": { @@ -2635,15 +2584,15 @@ } }, "node_modules/@inquirer/checkbox": { - "version": "5.2.1", - "resolved": "https://registry.npmjs.org/@inquirer/checkbox/-/checkbox-5.2.1.tgz", - "integrity": "sha512-b6xmA/VlTe0ZgDQHDui+Nav470u7u49nRd8/iuhOcQPO9Ch7lGuogydhi2VOmNlZ+zXcM8IcPuNSwQcdJaF/kw==", + "version": "5.2.2", + "resolved": "https://registry.npmjs.org/@inquirer/checkbox/-/checkbox-5.2.2.tgz", + "integrity": "sha512-Y5/bAScMy5Y+9isCx0SKbyJebMCaXXX5em0kxkj115eZNscgV9srOHrgyfS0e5xAVymIfOh9piYBKDILktsMMg==", "dev": true, "license": "MIT", "dependencies": { "@inquirer/ansi": "^2.0.7", - "@inquirer/core": "^11.2.1", - "@inquirer/figures": "^2.0.7", + "@inquirer/core": "^12.0.0", + "@inquirer/figures": "^2.0.8", "@inquirer/type": "^4.0.7" }, "engines": { @@ -2658,6 +2607,33 @@ } } }, + "node_modules/@inquirer/checkbox/node_modules/@inquirer/core": { + "version": "12.0.0", + "resolved": "https://registry.npmjs.org/@inquirer/core/-/core-12.0.0.tgz", + "integrity": "sha512-+nnvFEXIB08CZNVXpvW3B+zHW96QXvGUjNKJ8NJIPqAZi5Kd4WhYt2S3C234ReepG1qw2HOlEUbjYVHBowXObA==", + "dev": true, + "license": "MIT", + "dependencies": { + "@inquirer/ansi": "^2.0.7", + "@inquirer/figures": "^2.0.8", + "@inquirer/type": "^4.0.7", + "cli-width": "^4.1.0", + "fast-wrap-ansi": "^0.2.0", + "mute-stream": "^3.0.0", + "signal-exit": "^4.1.0" + }, + "engines": { + "node": ">=23.5.0 || ^22.13.0 || ^20.17.0" + }, + "peerDependencies": { + "@types/node": ">=18" + }, + "peerDependenciesMeta": { + "@types/node": { + "optional": true + } + } + }, "node_modules/@inquirer/confirm": { "version": "6.1.1", "resolved": "https://registry.npmjs.org/@inquirer/confirm/-/confirm-6.1.1.tgz", @@ -2708,14 +2684,14 @@ } }, "node_modules/@inquirer/editor": { - "version": "5.2.2", - "resolved": "https://registry.npmjs.org/@inquirer/editor/-/editor-5.2.2.tgz", - "integrity": "sha512-ZRVd/oD+sYsUd5zVm0NflqEzlqfYCyHNsqkHl2oWXEUHs12tCbcSFi+wVFEvD8+LGRaMUsVrE7qeo6lSG/S1Vg==", + "version": "5.3.0", + "resolved": "https://registry.npmjs.org/@inquirer/editor/-/editor-5.3.0.tgz", + "integrity": "sha512-nnsP/IdJ8s83q7ZuObmgn12QM+uLCkab9E0Oordojbn62WUg1c+v9Ou/F/057pgh0ppX0W+Hj5bO/Dp5hsxQtA==", "dev": true, "license": "MIT", "dependencies": { - "@inquirer/core": "^11.2.1", - "@inquirer/external-editor": "^3.0.3", + "@inquirer/core": "^12.0.0", + "@inquirer/external-editor": "^3.0.4", "@inquirer/type": "^4.0.7" }, "engines": { @@ -2730,14 +2706,41 @@ } } }, + "node_modules/@inquirer/editor/node_modules/@inquirer/core": { + "version": "12.0.0", + "resolved": "https://registry.npmjs.org/@inquirer/core/-/core-12.0.0.tgz", + "integrity": "sha512-+nnvFEXIB08CZNVXpvW3B+zHW96QXvGUjNKJ8NJIPqAZi5Kd4WhYt2S3C234ReepG1qw2HOlEUbjYVHBowXObA==", + "dev": true, + "license": "MIT", + "dependencies": { + "@inquirer/ansi": "^2.0.7", + "@inquirer/figures": "^2.0.8", + "@inquirer/type": "^4.0.7", + "cli-width": "^4.1.0", + "fast-wrap-ansi": "^0.2.0", + "mute-stream": "^3.0.0", + "signal-exit": "^4.1.0" + }, + "engines": { + "node": ">=23.5.0 || ^22.13.0 || ^20.17.0" + }, + "peerDependencies": { + "@types/node": ">=18" + }, + "peerDependenciesMeta": { + "@types/node": { + "optional": true + } + } + }, "node_modules/@inquirer/expand": { - "version": "5.1.1", - "resolved": "https://registry.npmjs.org/@inquirer/expand/-/expand-5.1.1.tgz", - "integrity": "sha512-YmQpenjbFSHAK3sOd44puHh3V1KXXr+JiNpUztoSQ4drLh2rTVzTap/YtlAVu/5xavifIlBfNEzJ/neZJ1a/1g==", + "version": "5.1.2", + "resolved": "https://registry.npmjs.org/@inquirer/expand/-/expand-5.1.2.tgz", + "integrity": "sha512-OWIH1IyyWqEKIyqC9Xy+Bnga7NkGMovFdo4atYZMUOTRqf6rO2WCv9E/1MyzvOErDBCxs+9UFliRUDc50xs/jw==", "dev": true, "license": "MIT", "dependencies": { - "@inquirer/core": "^11.2.1", + "@inquirer/core": "^12.0.0", "@inquirer/type": "^4.0.7" }, "engines": { @@ -2752,10 +2755,37 @@ } } }, + "node_modules/@inquirer/expand/node_modules/@inquirer/core": { + "version": "12.0.0", + "resolved": "https://registry.npmjs.org/@inquirer/core/-/core-12.0.0.tgz", + "integrity": "sha512-+nnvFEXIB08CZNVXpvW3B+zHW96QXvGUjNKJ8NJIPqAZi5Kd4WhYt2S3C234ReepG1qw2HOlEUbjYVHBowXObA==", + "dev": true, + "license": "MIT", + "dependencies": { + "@inquirer/ansi": "^2.0.7", + "@inquirer/figures": "^2.0.8", + "@inquirer/type": "^4.0.7", + "cli-width": "^4.1.0", + "fast-wrap-ansi": "^0.2.0", + "mute-stream": "^3.0.0", + "signal-exit": "^4.1.0" + }, + "engines": { + "node": ">=23.5.0 || ^22.13.0 || ^20.17.0" + }, + "peerDependencies": { + "@types/node": ">=18" + }, + "peerDependenciesMeta": { + "@types/node": { + "optional": true + } + } + }, "node_modules/@inquirer/external-editor": { - "version": "3.0.3", - "resolved": "https://registry.npmjs.org/@inquirer/external-editor/-/external-editor-3.0.3.tgz", - "integrity": "sha512-6thf5I8q7lZwzGLAxPaaGEREEkZ3nyePPDQ1oyobblxmEE8mqTLguScP7pDjUTAibiyb4hfXl+qjUEJ+di/aNA==", + "version": "3.0.4", + "resolved": "https://registry.npmjs.org/@inquirer/external-editor/-/external-editor-3.0.4.tgz", + "integrity": "sha512-tZbbaK2ovq6vlrRBNQvjrypmrED/p5x2ncIHQ79cD55tei3dD96v5glMMA+6tiq7K104i/25DVYKWVPJuV6ptA==", "dev": true, "license": "MIT", "dependencies": { @@ -2775,9 +2805,9 @@ } }, "node_modules/@inquirer/figures": { - "version": "2.0.7", - "resolved": "https://registry.npmjs.org/@inquirer/figures/-/figures-2.0.7.tgz", - "integrity": "sha512-aJ8TBPOGB6f/2qziPfElISTCEd5XOYTFckA2SGjhNmiKzfK/u4ot3v0DUzGVdUnKjN10EqnnEPck36BkyfLnJw==", + "version": "2.0.8", + "resolved": "https://registry.npmjs.org/@inquirer/figures/-/figures-2.0.8.tgz", + "integrity": "sha512-tApbon79GM9ry56ja/Ud3SY2CL4TQsao9fIwDQbgTeNY55025GdMzQ2+UdegV/lx51VNGUB59M0v0nMpybYY4Q==", "dev": true, "license": "MIT", "engines": { @@ -2785,13 +2815,13 @@ } }, "node_modules/@inquirer/input": { - "version": "5.1.2", - "resolved": "https://registry.npmjs.org/@inquirer/input/-/input-5.1.2.tgz", - "integrity": "sha512-9K/DDBSQpOyZSkt6sOVP9Vo0TR7atX2kuILsUu0x3wVcVbe97lJwIJKMLdMw25tDYuXl/qp6erT0Xs1rfmcfZg==", + "version": "5.1.3", + "resolved": "https://registry.npmjs.org/@inquirer/input/-/input-5.1.3.tgz", + "integrity": "sha512-F/BZHtyEzP+HO+IGVd4AjBRgvX/ywm42bx8S0+dENk2YclzE9tJ3X/15THwtT6ehApmKvdYDMsVTuyyDod0gOQ==", "dev": true, "license": "MIT", "dependencies": { - "@inquirer/core": "^11.2.1", + "@inquirer/core": "^12.0.0", "@inquirer/type": "^4.0.7" }, "engines": { @@ -2806,14 +2836,41 @@ } } }, + "node_modules/@inquirer/input/node_modules/@inquirer/core": { + "version": "12.0.0", + "resolved": "https://registry.npmjs.org/@inquirer/core/-/core-12.0.0.tgz", + "integrity": "sha512-+nnvFEXIB08CZNVXpvW3B+zHW96QXvGUjNKJ8NJIPqAZi5Kd4WhYt2S3C234ReepG1qw2HOlEUbjYVHBowXObA==", + "dev": true, + "license": "MIT", + "dependencies": { + "@inquirer/ansi": "^2.0.7", + "@inquirer/figures": "^2.0.8", + "@inquirer/type": "^4.0.7", + "cli-width": "^4.1.0", + "fast-wrap-ansi": "^0.2.0", + "mute-stream": "^3.0.0", + "signal-exit": "^4.1.0" + }, + "engines": { + "node": ">=23.5.0 || ^22.13.0 || ^20.17.0" + }, + "peerDependencies": { + "@types/node": ">=18" + }, + "peerDependenciesMeta": { + "@types/node": { + "optional": true + } + } + }, "node_modules/@inquirer/number": { - "version": "4.1.1", - "resolved": "https://registry.npmjs.org/@inquirer/number/-/number-4.1.1.tgz", - "integrity": "sha512-XF4IXAbPnGPgw0wsbC/i2tPcyfdZgDpUlhsqU0SfT4IRIGWha6Xm9VRgN5yYxJq+jnyXlfXI/nQ3ulfk0iEICA==", + "version": "4.2.0", + "resolved": "https://registry.npmjs.org/@inquirer/number/-/number-4.2.0.tgz", + "integrity": "sha512-ew+fSDijsQ/WhD4TV3XLb+if400cDuzTzHfGR8sTNBXkK9CYDWoGE8fhaO8GbT312pNv1AJEOsDxy/z/HVettA==", "dev": true, "license": "MIT", "dependencies": { - "@inquirer/core": "^11.2.1", + "@inquirer/core": "^12.0.0", "@inquirer/type": "^4.0.7" }, "engines": { @@ -2828,15 +2885,42 @@ } } }, + "node_modules/@inquirer/number/node_modules/@inquirer/core": { + "version": "12.0.0", + "resolved": "https://registry.npmjs.org/@inquirer/core/-/core-12.0.0.tgz", + "integrity": "sha512-+nnvFEXIB08CZNVXpvW3B+zHW96QXvGUjNKJ8NJIPqAZi5Kd4WhYt2S3C234ReepG1qw2HOlEUbjYVHBowXObA==", + "dev": true, + "license": "MIT", + "dependencies": { + "@inquirer/ansi": "^2.0.7", + "@inquirer/figures": "^2.0.8", + "@inquirer/type": "^4.0.7", + "cli-width": "^4.1.0", + "fast-wrap-ansi": "^0.2.0", + "mute-stream": "^3.0.0", + "signal-exit": "^4.1.0" + }, + "engines": { + "node": ">=23.5.0 || ^22.13.0 || ^20.17.0" + }, + "peerDependencies": { + "@types/node": ">=18" + }, + "peerDependenciesMeta": { + "@types/node": { + "optional": true + } + } + }, "node_modules/@inquirer/password": { - "version": "5.1.1", - "resolved": "https://registry.npmjs.org/@inquirer/password/-/password-5.1.1.tgz", - "integrity": "sha512-3XBfF7DAsp5qeDsvN5Rd1HmbNokVvEQoUM0QLrRcybC9nX96w3Pbmu7qUsb3IT3J3jBvs2+mTXaKHOUsgHMLzg==", + "version": "5.1.2", + "resolved": "https://registry.npmjs.org/@inquirer/password/-/password-5.1.2.tgz", + "integrity": "sha512-nSdufycW8xynEVssFkNQEYIzTySilog0UlfOVRwh3pXzPSk4frXUT2jZWjHnKae6RU9PaoF9wfy1pGwewQuqGw==", "dev": true, "license": "MIT", "dependencies": { "@inquirer/ansi": "^2.0.7", - "@inquirer/core": "^11.2.1", + "@inquirer/core": "^12.0.0", "@inquirer/type": "^4.0.7" }, "engines": { @@ -2851,6 +2935,33 @@ } } }, + "node_modules/@inquirer/password/node_modules/@inquirer/core": { + "version": "12.0.0", + "resolved": "https://registry.npmjs.org/@inquirer/core/-/core-12.0.0.tgz", + "integrity": "sha512-+nnvFEXIB08CZNVXpvW3B+zHW96QXvGUjNKJ8NJIPqAZi5Kd4WhYt2S3C234ReepG1qw2HOlEUbjYVHBowXObA==", + "dev": true, + "license": "MIT", + "dependencies": { + "@inquirer/ansi": "^2.0.7", + "@inquirer/figures": "^2.0.8", + "@inquirer/type": "^4.0.7", + "cli-width": "^4.1.0", + "fast-wrap-ansi": "^0.2.0", + "mute-stream": "^3.0.0", + "signal-exit": "^4.1.0" + }, + "engines": { + "node": ">=23.5.0 || ^22.13.0 || ^20.17.0" + }, + "peerDependencies": { + "@types/node": ">=18" + }, + "peerDependenciesMeta": { + "@types/node": { + "optional": true + } + } + }, "node_modules/@inquirer/prompts": { "version": "8.5.2", "resolved": "https://registry.npmjs.org/@inquirer/prompts/-/prompts-8.5.2.tgz", @@ -2882,13 +2993,13 @@ } }, "node_modules/@inquirer/rawlist": { - "version": "5.3.1", - "resolved": "https://registry.npmjs.org/@inquirer/rawlist/-/rawlist-5.3.1.tgz", - "integrity": "sha512-QqdTqQddL3qPX/PPrjobpsO25NZ4dWXgTLenrR445L2ptLEYE6Z+PD5c5CNDJNx4ugRgELAIpSIJxZaO2jJ2Og==", + "version": "5.3.2", + "resolved": "https://registry.npmjs.org/@inquirer/rawlist/-/rawlist-5.3.2.tgz", + "integrity": "sha512-oPSKrYK1X1bMkjXDzIKHUkJp195LFSfgbnVtXnjSKGFjrCbS6I+wyvfAZTwKE9BSt3HwWgfD7JfsXALBgCogzQ==", "dev": true, "license": "MIT", "dependencies": { - "@inquirer/core": "^11.2.1", + "@inquirer/core": "^12.0.0", "@inquirer/type": "^4.0.7" }, "engines": { @@ -2903,15 +3014,42 @@ } } }, + "node_modules/@inquirer/rawlist/node_modules/@inquirer/core": { + "version": "12.0.0", + "resolved": "https://registry.npmjs.org/@inquirer/core/-/core-12.0.0.tgz", + "integrity": "sha512-+nnvFEXIB08CZNVXpvW3B+zHW96QXvGUjNKJ8NJIPqAZi5Kd4WhYt2S3C234ReepG1qw2HOlEUbjYVHBowXObA==", + "dev": true, + "license": "MIT", + "dependencies": { + "@inquirer/ansi": "^2.0.7", + "@inquirer/figures": "^2.0.8", + "@inquirer/type": "^4.0.7", + "cli-width": "^4.1.0", + "fast-wrap-ansi": "^0.2.0", + "mute-stream": "^3.0.0", + "signal-exit": "^4.1.0" + }, + "engines": { + "node": ">=23.5.0 || ^22.13.0 || ^20.17.0" + }, + "peerDependencies": { + "@types/node": ">=18" + }, + "peerDependenciesMeta": { + "@types/node": { + "optional": true + } + } + }, "node_modules/@inquirer/search": { - "version": "4.2.1", - "resolved": "https://registry.npmjs.org/@inquirer/search/-/search-4.2.1.tgz", - "integrity": "sha512-xJj8QWKRSrfKoBIITLZK61dD3zwo0Rz11fgDImku30/Oe81zMdIdGgrLY2h6RkJ+KZ/GhNYIRMKnH/62qBTA5g==", + "version": "4.3.0", + "resolved": "https://registry.npmjs.org/@inquirer/search/-/search-4.3.0.tgz", + "integrity": "sha512-HFxXE5w727ctSUcAwrDquftJGjMgu36OeV5SHEXMlr2j/ahzmRX9xSEeVolV8tzYnTf45cg6vGkdMMRdm3RPhQ==", "dev": true, "license": "MIT", "dependencies": { - "@inquirer/core": "^11.2.1", - "@inquirer/figures": "^2.0.7", + "@inquirer/core": "^12.0.0", + "@inquirer/figures": "^2.0.8", "@inquirer/type": "^4.0.7" }, "engines": { @@ -2926,16 +3064,43 @@ } } }, + "node_modules/@inquirer/search/node_modules/@inquirer/core": { + "version": "12.0.0", + "resolved": "https://registry.npmjs.org/@inquirer/core/-/core-12.0.0.tgz", + "integrity": "sha512-+nnvFEXIB08CZNVXpvW3B+zHW96QXvGUjNKJ8NJIPqAZi5Kd4WhYt2S3C234ReepG1qw2HOlEUbjYVHBowXObA==", + "dev": true, + "license": "MIT", + "dependencies": { + "@inquirer/ansi": "^2.0.7", + "@inquirer/figures": "^2.0.8", + "@inquirer/type": "^4.0.7", + "cli-width": "^4.1.0", + "fast-wrap-ansi": "^0.2.0", + "mute-stream": "^3.0.0", + "signal-exit": "^4.1.0" + }, + "engines": { + "node": ">=23.5.0 || ^22.13.0 || ^20.17.0" + }, + "peerDependencies": { + "@types/node": ">=18" + }, + "peerDependenciesMeta": { + "@types/node": { + "optional": true + } + } + }, "node_modules/@inquirer/select": { - "version": "5.2.1", - "resolved": "https://registry.npmjs.org/@inquirer/select/-/select-5.2.1.tgz", - "integrity": "sha512-FlDndEUww8m7BfukO2nJa25vhD+H5jxxCv4oGioKqzyWz3nPHhhw4LKdYRSlXuAx7DsdWia7iyaBPKKS95Evfw==", + "version": "5.2.2", + "resolved": "https://registry.npmjs.org/@inquirer/select/-/select-5.2.2.tgz", + "integrity": "sha512-RkI8dRHWt+bh04oLixvF1kFzKC7e5rqJoHKkzcqSHATebBXFC6GmrT8ddbVkgSzLV0HnHs2cPFuBINr8otij8Q==", "dev": true, "license": "MIT", "dependencies": { "@inquirer/ansi": "^2.0.7", - "@inquirer/core": "^11.2.1", - "@inquirer/figures": "^2.0.7", + "@inquirer/core": "^12.0.0", + "@inquirer/figures": "^2.0.8", "@inquirer/type": "^4.0.7" }, "engines": { @@ -2950,6 +3115,33 @@ } } }, + "node_modules/@inquirer/select/node_modules/@inquirer/core": { + "version": "12.0.0", + "resolved": "https://registry.npmjs.org/@inquirer/core/-/core-12.0.0.tgz", + "integrity": "sha512-+nnvFEXIB08CZNVXpvW3B+zHW96QXvGUjNKJ8NJIPqAZi5Kd4WhYt2S3C234ReepG1qw2HOlEUbjYVHBowXObA==", + "dev": true, + "license": "MIT", + "dependencies": { + "@inquirer/ansi": "^2.0.7", + "@inquirer/figures": "^2.0.8", + "@inquirer/type": "^4.0.7", + "cli-width": "^4.1.0", + "fast-wrap-ansi": "^0.2.0", + "mute-stream": "^3.0.0", + "signal-exit": "^4.1.0" + }, + "engines": { + "node": ">=23.5.0 || ^22.13.0 || ^20.17.0" + }, + "peerDependencies": { + "@types/node": ">=18" + }, + "peerDependenciesMeta": { + "@types/node": { + "optional": true + } + } + }, "node_modules/@inquirer/type": { "version": "4.0.7", "resolved": "https://registry.npmjs.org/@inquirer/type/-/type-4.0.7.tgz", @@ -3041,20 +3233,20 @@ "license": "Apache-2.0" }, "node_modules/@listr2/prompt-adapter-inquirer": { - "version": "4.2.4", - "resolved": "https://registry.npmjs.org/@listr2/prompt-adapter-inquirer/-/prompt-adapter-inquirer-4.2.4.tgz", - "integrity": "sha512-/KRI2DMD7JGSYaREF0Ygl7AefJ/2ase4Gc5cBiKqT5l4tFjsSJfhFGcc5nSkgl0Sp9LkCQNzl/cqbVJYP2L3dw==", + "version": "4.2.5", + "resolved": "https://registry.npmjs.org/@listr2/prompt-adapter-inquirer/-/prompt-adapter-inquirer-4.2.5.tgz", + "integrity": "sha512-pYGy9dTdTwXdasPgyohkr0HoQ4FrkAzFnsUZl/gcnadDArbpZ8e+fgr+F9WBdNEl2y00mb9bCM4WgmoBkZJ27A==", "dev": true, "license": "MIT", "dependencies": { - "@inquirer/type": "^4.0.6" + "@inquirer/type": "^4.0.7" }, "engines": { "node": ">=22.13.0" }, "peerDependencies": { "@inquirer/prompts": ">= 3 < 9", - "listr2": "10.2.1" + "listr2": "11.0.0" } }, "node_modules/@lit-labs/ssr-dom-shim": { @@ -3203,12 +3395,12 @@ } }, "node_modules/@modelcontextprotocol/sdk": { - "version": "1.29.0", - "resolved": "https://registry.npmjs.org/@modelcontextprotocol/sdk/-/sdk-1.29.0.tgz", - "integrity": "sha512-zo37mZA9hJWpULgkRpowewez1y6ML5GsXJPY8FI0tBBCd77HEvza4jDqRKOXgHNn867PVGCyTdzqpz0izu5ZjQ==", + "version": "1.30.0", + "resolved": "https://registry.npmjs.org/@modelcontextprotocol/sdk/-/sdk-1.30.0.tgz", + "integrity": "sha512-xKd8OIzlqNzcqcNumGAa6g+PW2kjD5vrpcKOnfldAUPP3j7lnqMPwlTXQm8gF+UwH72z0lqaRbjr9hqGz0eITA==", "license": "MIT", "dependencies": { - "@hono/node-server": "^1.19.9", + "@hono/node-server": "^1.19.9 || ^2.0.5", "ajv": "^8.17.1", "ajv-formats": "^3.0.1", "content-type": "^1.0.5", @@ -3280,9 +3472,9 @@ } }, "node_modules/@modelcontextprotocol/sdk/node_modules/body-parser/node_modules/content-type": { - "version": "2.0.0", - "resolved": "https://registry.npmjs.org/content-type/-/content-type-2.0.0.tgz", - "integrity": "sha512-j/O/d7GcZCyNl7/hwZAb606rzqkyvaDctLmckbxLzHvFBzTJHuGEdodATcP3yIRoDrLHkIATJuvzbFlp/ki2cQ==", + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/content-type/-/content-type-2.1.0.tgz", + "integrity": "sha512-mj7UPXE0jaqaOsukNZRUEfEi2AcL7C/vwmwcHV0O97eO1E1pxBZuyjlZrx5seTaNBg1U6+o35wpa35Qfcc+7ag==", "license": "MIT", "engines": { "node": ">=18" @@ -3450,12 +3642,32 @@ } }, "node_modules/@modelcontextprotocol/sdk/node_modules/negotiator": { - "version": "1.0.0", - "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-1.0.0.tgz", - "integrity": "sha512-8Ofs/AUQh8MaEcrlq5xOX0CQ9ypTF5dl78mjlMNfOK08fzpgTHQRQPBxcPlEtIw0yRpws+Zo/3r+5WRby7u3Gg==", + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-1.1.0.tgz", + "integrity": "sha512-NMPBRMJgiQHjbd8phG3Vebdx4kZ1H121rbl5IkMqeOsahptB9BKo/d7oJ3zTXqTgagn2bWlNSXkh0QUGM31RYg==", "license": "MIT", + "dependencies": { + "content-type": "^2.1.0" + }, "engines": { - "node": ">= 0.6" + "node": ">=18" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/express" + } + }, + "node_modules/@modelcontextprotocol/sdk/node_modules/negotiator/node_modules/content-type": { + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/content-type/-/content-type-2.1.0.tgz", + "integrity": "sha512-mj7UPXE0jaqaOsukNZRUEfEi2AcL7C/vwmwcHV0O97eO1E1pxBZuyjlZrx5seTaNBg1U6+o35wpa35Qfcc+7ag==", + "license": "MIT", + "engines": { + "node": ">=18" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/express" } }, "node_modules/@modelcontextprotocol/sdk/node_modules/send": { @@ -3522,9 +3734,9 @@ } }, "node_modules/@modelcontextprotocol/sdk/node_modules/type-is/node_modules/content-type": { - "version": "2.0.0", - "resolved": "https://registry.npmjs.org/content-type/-/content-type-2.0.0.tgz", - "integrity": "sha512-j/O/d7GcZCyNl7/hwZAb606rzqkyvaDctLmckbxLzHvFBzTJHuGEdodATcP3yIRoDrLHkIATJuvzbFlp/ki2cQ==", + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/content-type/-/content-type-2.1.0.tgz", + "integrity": "sha512-mj7UPXE0jaqaOsukNZRUEfEi2AcL7C/vwmwcHV0O97eO1E1pxBZuyjlZrx5seTaNBg1U6+o35wpa35Qfcc+7ag==", "license": "MIT", "engines": { "node": ">=18" @@ -3963,9 +4175,9 @@ } }, "node_modules/@napi-rs/wasm-runtime": { - "version": "1.2.2", - "resolved": "https://registry.npmjs.org/@napi-rs/wasm-runtime/-/wasm-runtime-1.2.2.tgz", - "integrity": "sha512-JfB4kuJQjaoHuCTseIINHtHWeJnvgEcxjwA5t/Y00ZgaOO1Crz3fjT/p8kT28zA/Caz7oiUMn3d6H2yOVCVwuw==", + "version": "1.2.3", + "resolved": "https://registry.npmjs.org/@napi-rs/wasm-runtime/-/wasm-runtime-1.2.3.tgz", + "integrity": "sha512-UMduMbqO5s5zF2NkNacMT/yK5Y5QiKvWr2+50bzIIxFDwVJ2h49b+oyjaCGPhJxd2/gC2x39EHv/gHVuu36x2Q==", "license": "MIT", "optional": true, "dependencies": { @@ -3979,8 +4191,8 @@ "url": "https://github.com/sponsors/Brooooooklyn" }, "peerDependencies": { - "@emnapi/core": "^1.7.1 || ^2.0.0-alpha.3", - "@emnapi/runtime": "^1.7.1 || ^2.0.0-alpha.3" + "@emnapi/core": "^1.7.1 || ^2.0.0-alpha.4", + "@emnapi/runtime": "^1.7.1 || ^2.0.0-alpha.4" } }, "node_modules/@ng-bootstrap/ng-bootstrap": { @@ -4983,14 +5195,14 @@ "license": "MIT" }, "node_modules/@schematics/angular": { - "version": "22.1.2", - "resolved": "https://registry.npmjs.org/@schematics/angular/-/angular-22.1.2.tgz", - "integrity": "sha512-52udja/QGSNH5geSnL4JWFOEfx8M7tqf7LNXz8byjki4VshVOkKHTawQcL4YbJfo3MfwwXm4AsoadMOk8EST2w==", + "version": "22.1.6", + "resolved": "https://registry.npmjs.org/@schematics/angular/-/angular-22.1.6.tgz", + "integrity": "sha512-RiD4OZJ4yuaM1aXb3pt1gjDSWwkP0jrgiCuoaBls1eabcrDmlsNuQv0ekxbcGgCRPdSJvmHRZIHHmFPzei8w3Q==", "dev": true, "license": "MIT", "dependencies": { - "@angular-devkit/core": "22.1.2", - "@angular-devkit/schematics": "22.1.2", + "@angular-devkit/core": "22.1.6", + "@angular-devkit/schematics": "22.1.6", "jsonc-parser": "3.3.1", "typescript": "6.0.3" }, @@ -5001,64 +5213,97 @@ } }, "node_modules/@shikijs/core": { - "version": "3.23.0", - "resolved": "https://registry.npmjs.org/@shikijs/core/-/core-3.23.0.tgz", - "integrity": "sha512-NSWQz0riNb67xthdm5br6lAkvpDJRTgB36fxlo37ZzM2yq0PQFFzbd8psqC2XMPgCzo1fW6cVi18+ArJ44wqgA==", + "version": "4.4.3", + "resolved": "https://registry.npmjs.org/@shikijs/core/-/core-4.4.3.tgz", + "integrity": "sha512-QCR4q2ZO/ILJEuwiBMel4wdcTDb1JGwfjKTxPDF6x8ixOaluPrVqIn06C99AcRPhmYlBR56d/Fb+GN58GzExpg==", "license": "MIT", "dependencies": { - "@shikijs/types": "3.23.0", + "@shikijs/primitive": "4.4.3", + "@shikijs/types": "4.4.3", "@shikijs/vscode-textmate": "^10.0.2", - "@types/hast": "^3.0.4", + "@types/hast": "^3.0.5", "hast-util-to-html": "^9.0.5" + }, + "engines": { + "node": ">=20" } }, "node_modules/@shikijs/engine-javascript": { - "version": "3.23.0", - "resolved": "https://registry.npmjs.org/@shikijs/engine-javascript/-/engine-javascript-3.23.0.tgz", - "integrity": "sha512-aHt9eiGFobmWR5uqJUViySI1bHMqrAgamWE1TYSUoftkAeCCAiGawPMwM+VCadylQtF4V3VNOZ5LmfItH5f3yA==", + "version": "4.4.3", + "resolved": "https://registry.npmjs.org/@shikijs/engine-javascript/-/engine-javascript-4.4.3.tgz", + "integrity": "sha512-FbOjFJp9VLdo1Wevs10BBtVxiTWwNLqZh5Gkhjgda/ioL15YOgeSl9n+6XMa3qRlPQzfhFNe641SrynFHYG0nQ==", "license": "MIT", "dependencies": { - "@shikijs/types": "3.23.0", + "@shikijs/types": "4.4.3", "@shikijs/vscode-textmate": "^10.0.2", - "oniguruma-to-es": "^4.3.4" + "oniguruma-to-es": "^4.3.6" + }, + "engines": { + "node": ">=20" } }, "node_modules/@shikijs/engine-oniguruma": { - "version": "3.23.0", - "resolved": "https://registry.npmjs.org/@shikijs/engine-oniguruma/-/engine-oniguruma-3.23.0.tgz", - "integrity": "sha512-1nWINwKXxKKLqPibT5f4pAFLej9oZzQTsby8942OTlsJzOBZ0MWKiwzMsd+jhzu8YPCHAswGnnN1YtQfirL35g==", + "version": "4.4.3", + "resolved": "https://registry.npmjs.org/@shikijs/engine-oniguruma/-/engine-oniguruma-4.4.3.tgz", + "integrity": "sha512-EcOQkxdxGQrc1Row/cC2c96/v1dbZqGnEVu1qTuT/MJmp6+cXCvQussowVmCv5Tqr3KuY3c7IbM6HTW3LJ1k9w==", "license": "MIT", "dependencies": { - "@shikijs/types": "3.23.0", + "@shikijs/types": "4.4.3", "@shikijs/vscode-textmate": "^10.0.2" + }, + "engines": { + "node": ">=20" } }, "node_modules/@shikijs/langs": { - "version": "3.23.0", - "resolved": "https://registry.npmjs.org/@shikijs/langs/-/langs-3.23.0.tgz", - "integrity": "sha512-2Ep4W3Re5aB1/62RSYQInK9mM3HsLeB91cHqznAJMuylqjzNVAVCMnNWRHFtcNHXsoNRayP9z1qj4Sq3nMqYXg==", + "version": "4.4.3", + "resolved": "https://registry.npmjs.org/@shikijs/langs/-/langs-4.4.3.tgz", + "integrity": "sha512-ePic0yfAJGOF83D5wBHK/00EjK65oahBYxFk5epgq33WRv7X9UuxLEV8PtR0szC0z8dl7INIpIodB99JRFlR+A==", "license": "MIT", "dependencies": { - "@shikijs/types": "3.23.0" + "@shikijs/types": "4.4.3" + }, + "engines": { + "node": ">=20" + } + }, + "node_modules/@shikijs/primitive": { + "version": "4.4.3", + "resolved": "https://registry.npmjs.org/@shikijs/primitive/-/primitive-4.4.3.tgz", + "integrity": "sha512-m0wBeLDQDeIxRdUmrCPdQqfuUamDwRL5isCfYbguKD6NiaKpVbsv+3J81DyIKgNW5h4WAIIr8T4EkgQrBBxvaQ==", + "license": "MIT", + "dependencies": { + "@shikijs/types": "4.4.3", + "@shikijs/vscode-textmate": "^10.0.2", + "@types/hast": "^3.0.5" + }, + "engines": { + "node": ">=20" } }, "node_modules/@shikijs/themes": { - "version": "3.23.0", - "resolved": "https://registry.npmjs.org/@shikijs/themes/-/themes-3.23.0.tgz", - "integrity": "sha512-5qySYa1ZgAT18HR/ypENL9cUSGOeI2x+4IvYJu4JgVJdizn6kG4ia5Q1jDEOi7gTbN4RbuYtmHh0W3eccOrjMA==", + "version": "4.4.3", + "resolved": "https://registry.npmjs.org/@shikijs/themes/-/themes-4.4.3.tgz", + "integrity": "sha512-w8UHjeUnIR965KMWJHUPXOc2mNJUnK3vpVLYLvw5IYU2mnTTJ89E24OrJDBNiJDQ0qzb0tc4l7mrIXx5cFeIyw==", "license": "MIT", "dependencies": { - "@shikijs/types": "3.23.0" + "@shikijs/types": "4.4.3" + }, + "engines": { + "node": ">=20" } }, "node_modules/@shikijs/types": { - "version": "3.23.0", - "resolved": "https://registry.npmjs.org/@shikijs/types/-/types-3.23.0.tgz", - "integrity": "sha512-3JZ5HXOZfYjsYSk0yPwBrkupyYSLpAE26Qc0HLghhZNGTZg/SKxXIIgoxOpmmeQP0RRSDJTk1/vPfw9tbw+jSQ==", + "version": "4.4.3", + "resolved": "https://registry.npmjs.org/@shikijs/types/-/types-4.4.3.tgz", + "integrity": "sha512-UEJxmRR++MAGR6hugn0vgVS2W/6lWAts84FFSrnlH9sP0LNol7E5+NQ792pH8liWUhyMyjhTgSUH3k7iD7tc5g==", "license": "MIT", "dependencies": { "@shikijs/vscode-textmate": "^10.0.2", - "@types/hast": "^3.0.4" + "@types/hast": "^3.0.5" + }, + "engines": { + "node": ">=20" } }, "node_modules/@shikijs/vscode-textmate": { @@ -5371,9 +5616,9 @@ } }, "node_modules/@tsconfig/node10": { - "version": "1.0.12", - "resolved": "https://registry.npmjs.org/@tsconfig/node10/-/node10-1.0.12.tgz", - "integrity": "sha512-UCYBaeFvM11aU2y3YPZ//O5Rhj+xKyzy7mvcIoAjASbigy8mHMryP5cK7dgjlz2hWxh1g5pLw084E0a/wlUSFQ==", + "version": "1.0.13", + "resolved": "https://registry.npmjs.org/@tsconfig/node10/-/node10-1.0.13.tgz", + "integrity": "sha512-gcLdvR9HO1ZJBypsOGqaP6TFEzb6vIta0KSTLt9NAQ6pXQO3cRgSVyCN6pzYqI9DlJgY71XKO0dpDhCf08b3pg==", "dev": true, "license": "MIT" }, @@ -5491,12 +5736,6 @@ "integrity": "sha512-MbsRCT7mTikHwKZ0X+LVUTLRrZZRLipTuXEO9qOYO+zmjMVk81axyClMROf6uoPD9MRVu46bx8zoR0Ad9q3NAg==", "license": "MIT" }, - "node_modules/@types/hammerjs": { - "version": "2.0.46", - "resolved": "https://registry.npmjs.org/@types/hammerjs/-/hammerjs-2.0.46.tgz", - "integrity": "sha512-ynRvcq6wvqexJ9brDMS4BnBLzmr0e14d6ZJTEShTBWKymQiHwlAyGu0ZPEFI2Fh1U53F7tN9ufClWM5KvqkKOw==", - "license": "MIT" - }, "node_modules/@types/hast": { "version": "3.0.5", "resolved": "https://registry.npmjs.org/@types/hast/-/hast-3.0.5.tgz", @@ -5659,17 +5898,17 @@ } }, "node_modules/@typescript-eslint/eslint-plugin": { - "version": "8.66.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-8.66.0.tgz", - "integrity": "sha512-p088eaGrzYz1s+7cov0aMOCkNGTJlVxF4jgubf28c8L0Cv9Rloj8YBHnv4hXLq6IIEE1AsjNWavO+k+8kP2Y0A==", + "version": "8.68.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-8.68.0.tgz", + "integrity": "sha512-WASHDpCm6qO5jj9g1a+8NiW5+GCkAyLReR56/4VruYmNgfUmqpxOfZ2Yfb8xGfJPWv5Qi6LSD8sXdces3vbp/Q==", "dev": true, "license": "MIT", "dependencies": { "@eslint-community/regexpp": "^4.12.2", - "@typescript-eslint/scope-manager": "8.66.0", - "@typescript-eslint/type-utils": "8.66.0", - "@typescript-eslint/utils": "8.66.0", - "@typescript-eslint/visitor-keys": "8.66.0", + "@typescript-eslint/scope-manager": "8.68.0", + "@typescript-eslint/type-utils": "8.68.0", + "@typescript-eslint/utils": "8.68.0", + "@typescript-eslint/visitor-keys": "8.68.0", "ignore": "^7.0.5", "natural-compare": "^1.4.0", "ts-api-utils": "^2.5.0" @@ -5682,22 +5921,22 @@ "url": "https://opencollective.com/typescript-eslint" }, "peerDependencies": { - "@typescript-eslint/parser": "^8.66.0", + "@typescript-eslint/parser": "^8.68.0", "eslint": "^8.57.0 || ^9.0.0 || ^10.0.0", "typescript": ">=4.8.4 <6.1.0" } }, "node_modules/@typescript-eslint/parser": { - "version": "8.66.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-8.66.0.tgz", - "integrity": "sha512-X6ypGChaWYk6PBtUg2BwuTZEFFcHJAtGTVJ9/lCTOufhZ4i9fNolQNnktq+kkMCwMj7V8Svsq7+TxSDslmhE0g==", + "version": "8.68.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-8.68.0.tgz", + "integrity": "sha512-fHq2VC1kpyYfvEcbiMjOpySY4WS7voEp89yAThrHRX5sm9j2lzYppCb2umFMEed4fWcyeLjHxrz0mpjNBaBxMQ==", "dev": true, "license": "MIT", "dependencies": { - "@typescript-eslint/scope-manager": "8.66.0", - "@typescript-eslint/types": "8.66.0", - "@typescript-eslint/typescript-estree": "8.66.0", - "@typescript-eslint/visitor-keys": "8.66.0", + "@typescript-eslint/scope-manager": "8.68.0", + "@typescript-eslint/types": "8.68.0", + "@typescript-eslint/typescript-estree": "8.68.0", + "@typescript-eslint/visitor-keys": "8.68.0", "debug": "^4.4.3" }, "engines": { @@ -5713,14 +5952,14 @@ } }, "node_modules/@typescript-eslint/project-service": { - "version": "8.66.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/project-service/-/project-service-8.66.0.tgz", - "integrity": "sha512-7MthGPTt4BP69lSryqpqq8HQqxuzynssckL/jyDyk3+TNMQ3y2jFWkptCrktWvBrP+EH787Nl5N5Qpw7WZg+5g==", + "version": "8.68.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/project-service/-/project-service-8.68.0.tgz", + "integrity": "sha512-5GQtWZCXFcFYux955pvoS02WLc49pXNlvIxocKjS0clvwo3in1RdlzVKyiqQH9vE5AKWFLTaUgeQkOrTS+0Qxw==", "dev": true, "license": "MIT", "dependencies": { - "@typescript-eslint/tsconfig-utils": "^8.66.0", - "@typescript-eslint/types": "^8.66.0", + "@typescript-eslint/tsconfig-utils": "^8.68.0", + "@typescript-eslint/types": "^8.68.0", "debug": "^4.4.3" }, "engines": { @@ -5735,14 +5974,14 @@ } }, "node_modules/@typescript-eslint/scope-manager": { - "version": "8.66.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-8.66.0.tgz", - "integrity": "sha512-8TGcH25j9zqJ/IULB/ppyhRvxA8QYfFEZ7nfbg6/BN9spDgb8fPWQXlE5l8TWBL50EtUx007uZ1o9VOwrq2/9g==", + "version": "8.68.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-8.68.0.tgz", + "integrity": "sha512-T5eXpcaJNg8bhjHJ8Rjp68Vq/QBteYtTKY8TZqVNPaUbuz0f6jI9t6aDkylwvalpAB9XTTFeFOjrjXAZ3YvmVA==", "dev": true, "license": "MIT", "dependencies": { - "@typescript-eslint/types": "8.66.0", - "@typescript-eslint/visitor-keys": "8.66.0" + "@typescript-eslint/types": "8.68.0", + "@typescript-eslint/visitor-keys": "8.68.0" }, "engines": { "node": "^18.18.0 || ^20.9.0 || >=21.1.0" @@ -5753,9 +5992,9 @@ } }, "node_modules/@typescript-eslint/tsconfig-utils": { - "version": "8.66.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/tsconfig-utils/-/tsconfig-utils-8.66.0.tgz", - "integrity": "sha512-9D5gLYZG4rOjcoag8MQ/fWI8WqA9wcPDyOGyWtWFhvM1lHRbliqUSPIY5J3zqCU1tvSwzXxnnjhQhz5Ne7mJ4g==", + "version": "8.68.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/tsconfig-utils/-/tsconfig-utils-8.68.0.tgz", + "integrity": "sha512-F7zrGQfiJHojPwi8vhxZQC1tWtJzvL74cK/nqri2lk8YUXvYaYwl263xOJ69jDWPUk1hmcdoayFwk9lX09npVw==", "dev": true, "license": "MIT", "engines": { @@ -5770,15 +6009,15 @@ } }, "node_modules/@typescript-eslint/type-utils": { - "version": "8.66.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/type-utils/-/type-utils-8.66.0.tgz", - "integrity": "sha512-LG2dWfjZQQp0ADtAu/EWJVayefGL2UEZ3CDeI44D9v3rXB/WYUqE/jpO28KrEKul5AySrmI+Zh1v6v+xW2U9+g==", + "version": "8.68.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/type-utils/-/type-utils-8.68.0.tgz", + "integrity": "sha512-X77zqoY1EjeWGs/0JNxeaMfp5C5lIz4Tw8y66F1Ne8Faq6g424sBNYM6xBAqElfGZPLpWS+CZAp0DXyKDzWiHg==", "dev": true, "license": "MIT", "dependencies": { - "@typescript-eslint/types": "8.66.0", - "@typescript-eslint/typescript-estree": "8.66.0", - "@typescript-eslint/utils": "8.66.0", + "@typescript-eslint/types": "8.68.0", + "@typescript-eslint/typescript-estree": "8.68.0", + "@typescript-eslint/utils": "8.68.0", "debug": "^4.4.3", "ts-api-utils": "^2.5.0" }, @@ -5795,9 +6034,9 @@ } }, "node_modules/@typescript-eslint/types": { - "version": "8.66.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.66.0.tgz", - "integrity": "sha512-H6gcYaSDOyvL3AD/jHUtUFo2jqGgn/F6nuyuZSu0QTesxL+cP4dQoIMrODRofuJC09g64+WgZ6tE19Y1N2YIFQ==", + "version": "8.68.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.68.0.tgz", + "integrity": "sha512-9RnpsGJjrAllCMefGVVsImJM24YurhC0Q1h4UbvivtvOqXmR/vEJge2OoE++z9m6hyg8T1Q8t5SNT6tHSbrxcg==", "dev": true, "license": "MIT", "engines": { @@ -5809,16 +6048,16 @@ } }, "node_modules/@typescript-eslint/typescript-estree": { - "version": "8.66.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-8.66.0.tgz", - "integrity": "sha512-8/x4INiiQb10jGgXYD7116/zQ+OL84ZIFn0za68wwFHCanT/VLbBEroWht8RV8fn0/ZCAoazHLQgwUC0UQcDfg==", + "version": "8.68.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-8.68.0.tgz", + "integrity": "sha512-OKKsD0tYmoNiU5PW2zehO1yO56jYOm1ShYlxon/Z0SJNidAkdVg86eg9ruRuoXf8xfnuWZGbwDsStkoXbZtIIA==", "dev": true, "license": "MIT", "dependencies": { - "@typescript-eslint/project-service": "8.66.0", - "@typescript-eslint/tsconfig-utils": "8.66.0", - "@typescript-eslint/types": "8.66.0", - "@typescript-eslint/visitor-keys": "8.66.0", + "@typescript-eslint/project-service": "8.68.0", + "@typescript-eslint/tsconfig-utils": "8.68.0", + "@typescript-eslint/types": "8.68.0", + "@typescript-eslint/visitor-keys": "8.68.0", "debug": "^4.4.3", "minimatch": "^10.2.2", "semver": "^7.7.3", @@ -5837,16 +6076,16 @@ } }, "node_modules/@typescript-eslint/utils": { - "version": "8.66.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-8.66.0.tgz", - "integrity": "sha512-jasearZPolBw5NJNYGMwxzHMF83niVWmMU1VdHzG1CyfI2VS7f7nZltnKtHcg20hW+7Uo5GfK4MeDPoU3qI8EA==", + "version": "8.68.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-8.68.0.tgz", + "integrity": "sha512-PB5gJMMOg0Q5P1tsgWtEAqQacJXq0qEqRHDX/YJ4FaTMLfZPpHB3gjl2EJuiZyPABxmj4ZQYiY9m1bdAJ5y7tQ==", "dev": true, "license": "MIT", "dependencies": { "@eslint-community/eslint-utils": "^4.9.1", - "@typescript-eslint/scope-manager": "8.66.0", - "@typescript-eslint/types": "8.66.0", - "@typescript-eslint/typescript-estree": "8.66.0" + "@typescript-eslint/scope-manager": "8.68.0", + "@typescript-eslint/types": "8.68.0", + "@typescript-eslint/typescript-estree": "8.68.0" }, "engines": { "node": "^18.18.0 || ^20.9.0 || >=21.1.0" @@ -5861,13 +6100,13 @@ } }, "node_modules/@typescript-eslint/visitor-keys": { - "version": "8.66.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-8.66.0.tgz", - "integrity": "sha512-dkKR8q+lKciskj1Y3vthHktl+3cMLWGyVUP23bRiPZ5O9BRT++4EqDDV+TVeIKBL1VXVEqrJlz8MYbcnvJcAlg==", + "version": "8.68.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-8.68.0.tgz", + "integrity": "sha512-YR65gGdGvTUAWLldC3xLOvOzamdGzB4A5/N8rehEaHs3Zvoe39BhgY+u0SPch1OvrVTfLcc55wsSgK2NcnTS/A==", "dev": true, "license": "MIT", "dependencies": { - "@typescript-eslint/types": "8.66.0", + "@typescript-eslint/types": "8.68.0", "eslint-visitor-keys": "^5.0.0" }, "engines": { @@ -5892,9 +6131,9 @@ } }, "node_modules/@ungap/structured-clone": { - "version": "1.3.3", - "resolved": "https://registry.npmjs.org/@ungap/structured-clone/-/structured-clone-1.3.3.tgz", - "integrity": "sha512-60YRaenCQcVjYEKOcG824+DRGGIQ3VKErcBoAEDJZz5bKIs2ZG+X/H9Nk+Q6EVkwJk5QNApxbrc5QtBSwtrXAg==", + "version": "1.3.4", + "resolved": "https://registry.npmjs.org/@ungap/structured-clone/-/structured-clone-1.3.4.tgz", + "integrity": "sha512-JL+CF0GeLHyPWI0rXu7UnxgiuOm9UQWzadi0OYOJNhNO2q6EZElpwlgXkNkfU1PzANDHq3YcwKVZprdvS+BrbQ==", "license": "ISC" }, "node_modules/@vitejs/plugin-basic-ssl": { @@ -6069,9 +6308,9 @@ } }, "node_modules/ansi-regex": { - "version": "6.2.2", - "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-6.2.2.tgz", - "integrity": "sha512-Bq3SmSpyFHaWjPk8If9yc6svM8c56dB5BAtW4Qbw5jHTwwXXcTLoRMkpDJp6VL0XzlWaCHTXrkFURMYmD0sLqg==", + "version": "6.3.0", + "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-6.3.0.tgz", + "integrity": "sha512-WpDfL7NO6j7tH88IDBNVdUJxDh9nmCteAVW9dsep846XdwF4naCBK+/tGLX3KJgcpgMRXCFlTM2hKGoK9FsdrQ==", "license": "MIT", "engines": { "node": ">=12" @@ -6406,9 +6645,9 @@ } }, "node_modules/bare-events": { - "version": "2.9.1", - "resolved": "https://registry.npmjs.org/bare-events/-/bare-events-2.9.1.tgz", - "integrity": "sha512-Z0oHEHAFDZkffN8Qc39zNZjQlMDkPJRyyyZieU1VH7u8c5S+qHZ2S8ixdKIAxEjfHO7FJxXmJWgteOghVanIsg==", + "version": "2.9.2", + "resolved": "https://registry.npmjs.org/bare-events/-/bare-events-2.9.2.tgz", + "integrity": "sha512-AIPKioV7/Y/8KfZ3AAhjPJxLLbY49S64Ym5DakZlUg75qQiTgUq9hEJoEwa4eUezPUlXRy/i5NpsKvo9jgKmoA==", "dev": true, "license": "Apache-2.0", "peerDependencies": { @@ -6462,9 +6701,9 @@ } }, "node_modules/baseline-browser-mapping": { - "version": "2.11.12", - "resolved": "https://registry.npmjs.org/baseline-browser-mapping/-/baseline-browser-mapping-2.11.12.tgz", - "integrity": "sha512-r7WnVImvVCeFpf2DOXfy41aPWzeNg3H/A2X4dKmy1QL0MSyyk/e7z8ihJ3N6Nn2PsdhkVlqnEfnUE4a05P2aTA==", + "version": "2.11.19", + "resolved": "https://registry.npmjs.org/baseline-browser-mapping/-/baseline-browser-mapping-2.11.19.tgz", + "integrity": "sha512-Grytf1xOxOEMTGRwx6rLGKkTabd4vMg3VrKdj/7joCmV0qgh4QwMMO6xh34YEXQqirAuUdgQGa5orJQQ+69RBw==", "license": "Apache-2.0", "bin": { "baseline-browser-mapping": "dist/cli.cjs" @@ -6653,9 +6892,9 @@ } }, "node_modules/browserslist": { - "version": "4.28.7", - "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.28.7.tgz", - "integrity": "sha512-JxV13hNrFxqjOc8alRbq9dK1MM79NEXYpma2B2J4wAtpWS5zIEIKqWPGCl7N4o7Uc7B7itylh7SuDujATRyyTw==", + "version": "4.28.8", + "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.28.8.tgz", + "integrity": "sha512-V2NpofLblG64mfOtSgDhOJESZEGogzDMBv/q+W6oc4LXWP/q75eOXoOaaOu1EOadB9U4Bwx/e0yzbvwKH8zalA==", "funding": [ { "type": "opencollective", @@ -6672,11 +6911,11 @@ ], "license": "MIT", "dependencies": { - "baseline-browser-mapping": "^2.10.44", - "caniuse-lite": "^1.0.30001806", - "electron-to-chromium": "^1.5.393", - "node-releases": "^2.0.51", - "update-browserslist-db": "^1.2.3" + "baseline-browser-mapping": "^2.11.12", + "caniuse-lite": "^1.0.30001809", + "electron-to-chromium": "^1.5.402", + "node-releases": "^2.0.53", + "update-browserslist-db": "^1.3.0" }, "bin": { "browserslist": "cli.js" @@ -6791,9 +7030,9 @@ } }, "node_modules/caniuse-lite": { - "version": "1.0.30001806", - "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001806.tgz", - "integrity": "sha512-72Cuvd95zbSYPKq6Fhg8eDJRlzgWDf7/mtoZv6Qe/DYNCEBdNxoA3+rZAU2ZhGCpZlns3EssFavaZomckT5Uuw==", + "version": "1.0.30001810", + "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001810.tgz", + "integrity": "sha512-TITQPUkaz+aVk5GL6NhOdwk1aEaNTSDPsGFWrTuhKGtjTF70jL/Oht2W4c6rXUe5fu7Ie19VIahAXHIIiWWNeg==", "funding": [ { "type": "opencollective", @@ -6927,17 +7166,17 @@ } }, "node_modules/cli-truncate": { - "version": "5.2.0", - "resolved": "https://registry.npmjs.org/cli-truncate/-/cli-truncate-5.2.0.tgz", - "integrity": "sha512-xRwvIOMGrfOAnM1JYtqQImuaNtDEv9v6oIYAs4LIHwTiKee8uwvIi363igssOC0O5U04i4AlENs79LQLu9tEMw==", + "version": "6.1.1", + "resolved": "https://registry.npmjs.org/cli-truncate/-/cli-truncate-6.1.1.tgz", + "integrity": "sha512-06p9vyLahLa4zkGcgsGxU6iEkSOiuI4fhCH6Emhe2lPAcoUv73n72DnODsnHA+5wwXGnV0n9M9/qOQJSjYhFhw==", "dev": true, "license": "MIT", "dependencies": { - "slice-ansi": "^8.0.0", + "slice-ansi": "^9.0.0", "string-width": "^8.2.0" }, "engines": { - "node": ">=20" + "node": ">=22" }, "funding": { "url": "https://github.com/sponsors/sindresorhus" @@ -7244,12 +7483,15 @@ } }, "node_modules/core-js": { - "version": "3.49.0", - "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.49.0.tgz", - "integrity": "sha512-es1U2+YTtzpwkxVLwAFdSpaIMyQaq0PBgm3YD1W3Qpsn1NAmO3KSgZfu+oGSWVu6NvLHoHCV/aYcsE5wiB7ALg==", + "version": "3.50.0", + "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.50.0.tgz", + "integrity": "sha512-BRWgOLKkFeCgRudR6zrs8p9XJZcE14grzKMMssoYrk6krtuEZ7MTKPIY5RzOnqsEKIR9kst7wNzphttraT+Yqw==", "hasInstallScript": true, "license": "MIT", "optional": true, + "engines": { + "node": "*" + }, "funding": { "type": "opencollective", "url": "https://opencollective.com/core-js" @@ -7632,9 +7874,9 @@ } }, "node_modules/dompurify": { - "version": "3.4.13", - "resolved": "https://registry.npmjs.org/dompurify/-/dompurify-3.4.13.tgz", - "integrity": "sha512-2vmYIoqjze2d+kakP8S/nS5shfsl587kzwEjcGlTdiksUVgFHnFCsLYDVj/JNqJVOQZGSYBTmuycv0PodwmnMQ==", + "version": "3.4.14", + "resolved": "https://registry.npmjs.org/dompurify/-/dompurify-3.4.14.tgz", + "integrity": "sha512-dVoH9z+MY+C9IilgGCk3YfFqjLi3fChm2OiKJMzh6axrJ5qwxqWaZamgmHrpv22CN/KdbZJuGEGgfQoL00LTdg==", "license": "(MPL-2.0 OR Apache-2.0)", "optionalDependencies": { "@types/trusted-types": "^2.0.7" @@ -7697,9 +7939,9 @@ "license": "MIT" }, "node_modules/electron-to-chromium": { - "version": "1.5.400", - "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.400.tgz", - "integrity": "sha512-96EWDNjM59SYflgeV5Ylsf4EMiq1a25YjCnJH7cxn/AF2H3pILRweaUnoLax0yKHWdpOzY6JKEu45e8irqZIHA==", + "version": "1.5.415", + "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.415.tgz", + "integrity": "sha512-958V+Kbhtgz+SxXeEVKBjrlKRBIDAYvUJfwhjxMZ5S6ut9jAl7l9ZKBkBrvjyjZE36PabLUo2L8kEeV5O4vgJg==", "license": "ISC" }, "node_modules/emoji-regex": { @@ -7770,9 +8012,9 @@ } }, "node_modules/engine.io/node_modules/ws": { - "version": "8.21.2", - "resolved": "https://registry.npmjs.org/ws/-/ws-8.21.2.tgz", - "integrity": "sha512-54dMVAo4WIe6SKy3vBgN+9bJZqqQ8IMRevAkOLQALhi49qkkQDQfWdAZ8KQlXiEabw88ARXXdUrlvtbKQX+aKw==", + "version": "8.21.3", + "resolved": "https://registry.npmjs.org/ws/-/ws-8.21.3.tgz", + "integrity": "sha512-201TZ/kPWxoPr/OKWjquZR1SWKXcvxdH+e1xrx89b3YbmzLMFCLfnaG1HFIgWzJOEWZ7MvpK++odZufgYR50Rw==", "dev": true, "license": "MIT", "engines": { @@ -8015,9 +8257,9 @@ } }, "node_modules/esbuild": { - "version": "0.28.1", - "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.28.1.tgz", - "integrity": "sha512-HrJrvZv5ayxBzPfwphOoNzkzOIIlifzk0KJrGK2c8R4+LKpMtpYLQeUdjnwjWv/LZlkH2laZk+4w78pi99D4Vw==", + "version": "0.28.2", + "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.28.2.tgz", + "integrity": "sha512-HKVLS8dvII+xoKW9kmqxbRKrnWEXfJJr/FZhhJmiqIB0e053QNYFqOBouTMO/k5sID4MvCiUCvv8b9M4h32wIA==", "dev": true, "hasInstallScript": true, "license": "MIT", @@ -8028,32 +8270,32 @@ "node": ">=18" }, "optionalDependencies": { - "@esbuild/aix-ppc64": "0.28.1", - "@esbuild/android-arm": "0.28.1", - "@esbuild/android-arm64": "0.28.1", - "@esbuild/android-x64": "0.28.1", - "@esbuild/darwin-arm64": "0.28.1", - "@esbuild/darwin-x64": "0.28.1", - "@esbuild/freebsd-arm64": "0.28.1", - "@esbuild/freebsd-x64": "0.28.1", - "@esbuild/linux-arm": "0.28.1", - "@esbuild/linux-arm64": "0.28.1", - "@esbuild/linux-ia32": "0.28.1", - "@esbuild/linux-loong64": "0.28.1", - "@esbuild/linux-mips64el": "0.28.1", - "@esbuild/linux-ppc64": "0.28.1", - "@esbuild/linux-riscv64": "0.28.1", - "@esbuild/linux-s390x": "0.28.1", - "@esbuild/linux-x64": "0.28.1", - "@esbuild/netbsd-arm64": "0.28.1", - "@esbuild/netbsd-x64": "0.28.1", - "@esbuild/openbsd-arm64": "0.28.1", - "@esbuild/openbsd-x64": "0.28.1", - "@esbuild/openharmony-arm64": "0.28.1", - "@esbuild/sunos-x64": "0.28.1", - "@esbuild/win32-arm64": "0.28.1", - "@esbuild/win32-ia32": "0.28.1", - "@esbuild/win32-x64": "0.28.1" + "@esbuild/aix-ppc64": "0.28.2", + "@esbuild/android-arm": "0.28.2", + "@esbuild/android-arm64": "0.28.2", + "@esbuild/android-x64": "0.28.2", + "@esbuild/darwin-arm64": "0.28.2", + "@esbuild/darwin-x64": "0.28.2", + "@esbuild/freebsd-arm64": "0.28.2", + "@esbuild/freebsd-x64": "0.28.2", + "@esbuild/linux-arm": "0.28.2", + "@esbuild/linux-arm64": "0.28.2", + "@esbuild/linux-ia32": "0.28.2", + "@esbuild/linux-loong64": "0.28.2", + "@esbuild/linux-mips64el": "0.28.2", + "@esbuild/linux-ppc64": "0.28.2", + "@esbuild/linux-riscv64": "0.28.2", + "@esbuild/linux-s390x": "0.28.2", + "@esbuild/linux-x64": "0.28.2", + "@esbuild/netbsd-arm64": "0.28.2", + "@esbuild/netbsd-x64": "0.28.2", + "@esbuild/openbsd-arm64": "0.28.2", + "@esbuild/openbsd-x64": "0.28.2", + "@esbuild/openharmony-arm64": "0.28.2", + "@esbuild/sunos-x64": "0.28.2", + "@esbuild/win32-arm64": "0.28.2", + "@esbuild/win32-ia32": "0.28.2", + "@esbuild/win32-x64": "0.28.2" } }, "node_modules/escalade": { @@ -8085,6 +8327,7 @@ "version": "9.39.5", "resolved": "https://registry.npmjs.org/eslint/-/eslint-9.39.5.tgz", "integrity": "sha512-DgZS62aPLXKlnxILS/AYCoRvHaZeXceIzlXPkkGGzJWSow1aEk0lbTlxUSlyjC8jcaKxAdOnTDz+o1JFSBsyjw==", + "deprecated": "This version is no longer supported. Please see https://eslint.org/version-support for other options.", "dev": true, "license": "MIT", "dependencies": { @@ -8713,9 +8956,9 @@ } }, "node_modules/eventsource-parser": { - "version": "3.1.0", - "resolved": "https://registry.npmjs.org/eventsource-parser/-/eventsource-parser-3.1.0.tgz", - "integrity": "sha512-kJezFj9YFAMLeORyi7aCLxLbD5/qWMQnoMVlVPyHIll7lgRJCc3JVln9Vgl9nwQi0YkMnhdGTMNn7CkRRAptMg==", + "version": "3.1.1", + "resolved": "https://registry.npmjs.org/eventsource-parser/-/eventsource-parser-3.1.1.tgz", + "integrity": "sha512-EKN1vKAMcZ8MlYMpaNuxN6R9yakzH6uajHcHVTqWJzvu5pWw9DyhbP35HH8MVBQ+dZjAfDxk+A8NiR9KWaXiyQ==", "license": "MIT", "engines": { "node": ">=18.0.0" @@ -8781,9 +9024,9 @@ } }, "node_modules/express-rate-limit": { - "version": "8.6.1", - "resolved": "https://registry.npmjs.org/express-rate-limit/-/express-rate-limit-8.6.1.tgz", - "integrity": "sha512-0D493aP61w0TJ2A0wy27riRsO7FMQ7FK+KUHOKCSfPvYo0R55aiC6emCVgFUeShH0fq0ICPVzNcgoS+BsbXQCA==", + "version": "8.6.2", + "resolved": "https://registry.npmjs.org/express-rate-limit/-/express-rate-limit-8.6.2.tgz", + "integrity": "sha512-YH4ru+eOJxQABscKFfRCy9R7x9QFGdezclVMwwgFFndzS2Xnm0uo6B0ABZsLhcpeptGv2qvuJVWlQr9gQZoC3A==", "license": "MIT", "dependencies": { "debug": "^4.4.3", @@ -8877,9 +9120,9 @@ } }, "node_modules/fast-uri": { - "version": "3.1.5", - "resolved": "https://registry.npmjs.org/fast-uri/-/fast-uri-3.1.5.tgz", - "integrity": "sha512-gHwA1O9LDIcKunMKhObS/HimwtehO1nPUECKAu5TpKgaO19fcWEl4bliWe1jWxVFvIXztJjjQ4L8XQ1EU9f7Jw==", + "version": "3.1.6", + "resolved": "https://registry.npmjs.org/fast-uri/-/fast-uri-3.1.6.tgz", + "integrity": "sha512-7Ical1vFEMr0onbVzEDIreM22I4khW+fzyQPwvAFWBp1iwdshSZRsL4jjRvPG9JP1uiqMHRto+YU6R2/CzDz5Q==", "funding": [ { "type": "github", @@ -9880,15 +10123,6 @@ "url": "https://github.com/sponsors/sindresorhus" } }, - "node_modules/hammerjs": { - "version": "2.0.8", - "resolved": "https://registry.npmjs.org/hammerjs/-/hammerjs-2.0.8.tgz", - "integrity": "sha512-tSQXBXS/MWQOn/RKckawJ61vvsDpCom87JgxiYdGwHdOa0ht0vzUWDlfioofFCRU0L+6NGDt6XzbgoJvZkMeRQ==", - "license": "MIT", - "engines": { - "node": ">=0.8.0" - } - }, "node_modules/has-bigints": { "version": "1.1.0", "resolved": "https://registry.npmjs.org/has-bigints/-/has-bigints-1.1.0.tgz", @@ -10031,9 +10265,9 @@ } }, "node_modules/hono": { - "version": "4.13.0", - "resolved": "https://registry.npmjs.org/hono/-/hono-4.13.0.tgz", - "integrity": "sha512-jhunvfHWxd7J5EFfSgH4xsYJzSe/lfqbUCxiyyeaQasUsXeEHXtzVid+7EOGByc5JnFa23SSFL3Y2RV/z1T+eQ==", + "version": "4.13.5", + "resolved": "https://registry.npmjs.org/hono/-/hono-4.13.5.tgz", + "integrity": "sha512-O6+/eCYRkzzzy0rPWwKLiGBR1nFuUPZynnwjxN1MBA62NNqbT0wQEzQyK2gSO5yDIDB336sXQleAhOHrzlYyKw==", "license": "MIT", "engines": { "node": ">=16.9.0" @@ -10221,15 +10455,15 @@ "license": "BSD-3-Clause" }, "node_modules/igniteui-angular": { - "version": "22.0.6", - "resolved": "https://registry.npmjs.org/igniteui-angular/-/igniteui-angular-22.0.6.tgz", - "integrity": "sha512-uWM6BXEl29WosrzFEJV3zasY+qIyaE6gvW0buf75sDPccj5xbvOn8f92mnIE+mT8FVxidoY3WnNURDMfDdY88g==", + "version": "22.1.0", + "resolved": "https://registry.npmjs.org/igniteui-angular/-/igniteui-angular-22.1.0.tgz", + "integrity": "sha512-05Wdj9RvkIVm6wYyZFNdqi0oS/P9IKhrUAnwVzQ8nW8i5NHA13Fn+a6ZY3q/SKXyBc5C2Sb5ZyBL2DwK1Bbxrg==", "license": "SEE LICENSE IN LICENSE", "dependencies": { "@igniteui/material-icons-extended": "^3.1.0", "fflate": "^0.8.2", "igniteui-i18n-core": "^1.0.5", - "igniteui-theming": "^27.3.0", + "igniteui-theming": "^28.1.1", "igniteui-trial-watermark": "^3.1.0", "jspdf": "^4.2.1", "lodash-es": "^4.17.21", @@ -10240,18 +10474,10 @@ "@angular/common": "22", "@angular/core": "22", "@angular/forms": "22", - "@types/hammerjs": "^2.0.46", - "hammerjs": "^2.0.8", - "igniteui-grid-lite": "~0.9.0", - "igniteui-webcomponents": "^7.2.1" + "igniteui-grid-lite": "~0.10.0", + "igniteui-webcomponents": "~7.3.0" }, "peerDependenciesMeta": { - "@types/hammerjs": { - "optional": true - }, - "hammerjs": { - "optional": true - }, "igniteui-grid-lite": { "optional": true }, @@ -10290,9 +10516,9 @@ } }, "node_modules/igniteui-angular-extras": { - "version": "22.0.6", - "resolved": "https://registry.npmjs.org/igniteui-angular-extras/-/igniteui-angular-extras-22.0.6.tgz", - "integrity": "sha512-Zg8vHEr8V0vd1j6h30spdM+efsvljVWSu0dWLH7cI7XyV1+yvdPQ7ZlIRMIRCSaOl7yHNPyibmHdQKvF4cj22g==", + "version": "22.1.0", + "resolved": "https://registry.npmjs.org/igniteui-angular-extras/-/igniteui-angular-extras-22.1.0.tgz", + "integrity": "sha512-6uGpfV6hbH/FPegXBAdiCtiwp8Qq0/mqcBUw5S2kFkUyQoaIaESvgtzCE0swi153NpHPA36OhWGKq5jbw0vsqQ==", "license": "SEE LICENSE IN LICENSE", "dependencies": { "igniteui-trial-watermark": "^3.1.0", @@ -10307,9 +10533,9 @@ } }, "node_modules/igniteui-angular-i18n": { - "version": "22.0.6", - "resolved": "https://registry.npmjs.org/igniteui-angular-i18n/-/igniteui-angular-i18n-22.0.6.tgz", - "integrity": "sha512-+UX+rvkNIb3kXpZPrB8VOea1P2DKrwuScGnbrSkuI5JYgQ34/y/K+hf8/av2HYmH4gZ2C0RPcSRe9fnVH87VAg==", + "version": "22.1.0", + "resolved": "https://registry.npmjs.org/igniteui-angular-i18n/-/igniteui-angular-i18n-22.1.0.tgz", + "integrity": "sha512-rwGcf7ZUNp7mLU2K5FhsGEWX/8v6EZYitlDLlbLYZL/O2oFZISBfJRvzqi3GLJhEINJTE4Q8h8FNrjhz0tj8RQ==", "license": "MIT", "dependencies": { "igniteui-i18n-core": "^1.0.2", @@ -10332,14 +10558,14 @@ "license": "Apache-2.0" }, "node_modules/igniteui-grid-lite": { - "version": "0.9.0", - "resolved": "https://registry.npmjs.org/igniteui-grid-lite/-/igniteui-grid-lite-0.9.0.tgz", - "integrity": "sha512-pW6MPniC0Up5YmbdB2QVTpPdIp0lkapPfQbnQQmqhtrvGO8Cpf84FQf1s7uMxatCC6FV5w7fgGpriy3t88yNng==", + "version": "0.10.0", + "resolved": "https://registry.npmjs.org/igniteui-grid-lite/-/igniteui-grid-lite-0.10.0.tgz", + "integrity": "sha512-frMjK3jIdsu76SoKjxKw7U9aFbFAoqWapCelL4CXf75MF80UyQR+g22iMkUR1Nu2/PsQkmJP1hmC4R/4+PmtDA==", "license": "MIT", "dependencies": { "@lit-labs/virtualizer": "~2.1.0", "@lit/context": "~1.1.5", - "igniteui-webcomponents": "~7.2.0", + "igniteui-webcomponents": "~7.3.0", "lit": "^3.3.0" }, "engines": { @@ -10370,15 +10596,15 @@ } }, "node_modules/igniteui-live-editing": { - "version": "3.5.1", - "resolved": "https://registry.npmjs.org/igniteui-live-editing/-/igniteui-live-editing-3.5.1.tgz", - "integrity": "sha512-bHJrF7jE2uTlpDOMkrqj3wZ1iamyTFYMLdCwZwzqPmdFKPFsIKu4DjmamfG0RljasE2zd7Z3hjZcvBuJJg9FMg==", + "version": "3.5.2", + "resolved": "https://registry.npmjs.org/igniteui-live-editing/-/igniteui-live-editing-3.5.2.tgz", + "integrity": "sha512-ykHX6izGprC3xHzrsymMcyweJs6gVeh7DR3S9PG7Tdyvs6mqHYfywbKzgAemRRx6nJyk6OsfiLCETqgd9xci0A==", "license": "MIT" }, "node_modules/igniteui-theming": { - "version": "27.4.0", - "resolved": "https://registry.npmjs.org/igniteui-theming/-/igniteui-theming-27.4.0.tgz", - "integrity": "sha512-0lxn6jDcPKdEtewxx/q+F0MBGhlfXCx1nzfFRS55GmfcYAexNwAjfjS2MlE+Tc/aN33spDA9GkP6cQNI2s+BdA==", + "version": "28.1.1", + "resolved": "https://registry.npmjs.org/igniteui-theming/-/igniteui-theming-28.1.1.tgz", + "integrity": "sha512-ioNSE9t36nqNfItashgM6oZxfgiLPjzeJ4X2g++3kU9oU0kklkz1Ax9F0FmGiwyIC2atWELkb76LsyT+0ZSTSQ==", "license": "MIT", "dependencies": { "@modelcontextprotocol/sdk": "^1.28.0", @@ -10386,6 +10612,7 @@ "zod": "^3.25.76" }, "bin": { + "igniteui-theming": "dist/mcp/index.js", "igniteui-theming-mcp": "dist/mcp/index.js" } }, @@ -10408,13 +10635,12 @@ } }, "node_modules/igniteui-webcomponents": { - "version": "7.2.4", - "resolved": "https://registry.npmjs.org/igniteui-webcomponents/-/igniteui-webcomponents-7.2.4.tgz", - "integrity": "sha512-h5hrroBn0kSYCYpj5OH4sKXkFZvdOeqpYnNTKMB5PsqsWexhQICkH5xKjDDj3VPbd135OvzWX5XQN0Nclj2qAQ==", + "version": "7.3.0", + "resolved": "https://registry.npmjs.org/igniteui-webcomponents/-/igniteui-webcomponents-7.3.0.tgz", + "integrity": "sha512-/99QNPMnupVDGeuuDVa2XGewusFTvvXvu8+vFOVuXBGMtxZluMzAuC7U6BLDcArcxpkEqEL4LEPpob5ULur0Dw==", "license": "MIT", "dependencies": { - "@floating-ui/dom": "^1.7.0", - "@lit-labs/virtualizer": "^2.1.0", + "@floating-ui/dom": "^1.8.0", "@lit/context": "^1.1.0", "igniteui-i18n-core": "^1.0.5", "lit": "^3.3.0" @@ -10423,11 +10649,11 @@ "node": ">=22" }, "peerDependencies": { - "dompurify": "^3.3.0", + "dompurify": "^3.4.0", "igniteui-i18n-resources": "^1.0.5", - "marked": "^17.0.0", + "marked": "^18.0.0", "marked-shiki": "^1.2.0", - "shiki": "^3.20.0" + "shiki": "^4.3.0" }, "peerDependenciesMeta": { "dompurify": { @@ -10557,9 +10783,9 @@ "license": "MIT" }, "node_modules/ip-address": { - "version": "10.4.0", - "resolved": "https://registry.npmjs.org/ip-address/-/ip-address-10.4.0.tgz", - "integrity": "sha512-oSK96Grm3aP6OrS263xVxbNDGVL7rzBtYdpGqlDG8iQdoenDoTs/nkki+DflYbAEE8Xl6o5YxhxlrKvI3nqKXQ==", + "version": "10.5.0", + "resolved": "https://registry.npmjs.org/ip-address/-/ip-address-10.5.0.tgz", + "integrity": "sha512-R5SnVLJmgYYvf2F2ZgwSBnelz5G4q5AxIC277GDfUaNbrZKNANcBC7RHqYYePlszf4kBolVkJauG0ZjHHFh55g==", "license": "MIT", "engines": { "node": ">= 12" @@ -10904,9 +11130,9 @@ } }, "node_modules/is-plain-object": { - "version": "5.0.0", - "resolved": "https://registry.npmjs.org/is-plain-object/-/is-plain-object-5.0.0.tgz", - "integrity": "sha512-VRSzKkbMm5jMDoKLbltAkFQ5Qr7VDiTFGXxYFXXowVj387GeGNOCsOH6Msy00SGZ3Fp84b1Naa1psqgcCIEP5Q==", + "version": "5.1.0", + "resolved": "https://registry.npmjs.org/is-plain-object/-/is-plain-object-5.1.0.tgz", + "integrity": "sha512-bUi/yjmtKYcRVUtWRGr0UA6xEFh2I6zWUwMrUXB3s7bmYCaZ8a+0ZsTRkrawh/mzlSD1Y0Ph8bp/U+TvBpWDNw==", "dev": true, "license": "MIT", "engines": { @@ -11489,9 +11715,9 @@ } }, "node_modules/jose": { - "version": "6.2.8", - "resolved": "https://registry.npmjs.org/jose/-/jose-6.2.8.tgz", - "integrity": "sha512-Bsdjwm3Qsd/P0jR+BHDe3LytDfY7WBq2HmCCLIwuVRHMuEC9ae7/R474GIUdF1NgCyZjzVo/A9DOiOBtXq8ZoQ==", + "version": "6.2.10", + "resolved": "https://registry.npmjs.org/jose/-/jose-6.2.10.tgz", + "integrity": "sha512-iiW7J9qRFlGxvCOIBDBDxFePQSn7ZMAnrYGhrrOo6siO/MIqwfyilLR27pkfDgUk+raLuzADS8A3S/KLBisc0g==", "license": "MIT", "funding": { "url": "https://github.com/sponsors/panva" @@ -11699,13 +11925,13 @@ } }, "node_modules/karma-jasmine-html-reporter": { - "version": "2.2.0", - "resolved": "https://registry.npmjs.org/karma-jasmine-html-reporter/-/karma-jasmine-html-reporter-2.2.0.tgz", - "integrity": "sha512-J0laEC43Oy2RdR5V5R3bqmdo7yRIYySq6XHKbA+e5iSAgLjhR1oICLGeSREPlJXpeyNcdJf3J17YcdhD0mRssQ==", + "version": "2.3.0", + "resolved": "https://registry.npmjs.org/karma-jasmine-html-reporter/-/karma-jasmine-html-reporter-2.3.0.tgz", + "integrity": "sha512-iFDjVpcWHnupRoJfnjuAeNF68sAGk+7RfceCzm33HHYNV6OgBa6EC1nPgJUFM+tVDHLlQ5NhgcTKz7AbdrV3AQ==", "dev": true, "license": "MIT", "peerDependencies": { - "jasmine-core": "^4.0.0 || ^5.0.0 || ^6.0.0", + "jasmine-core": "^4.0.0 || ^5.0.0 || ^6.0.0 || ^7.0.0", "karma": "^6.0.0", "karma-jasmine": "^5.0.0" } @@ -12309,31 +12535,20 @@ } }, "node_modules/listr2": { - "version": "10.2.1", - "resolved": "https://registry.npmjs.org/listr2/-/listr2-10.2.1.tgz", - "integrity": "sha512-7I5knELsJKTUjXG+A6BkKAiGkW1i25fNa/xlUl9hFtk15WbE9jndA89xu5FzQKrY5llajE1hfZZFMILXkDHk/Q==", + "version": "11.0.0", + "resolved": "https://registry.npmjs.org/listr2/-/listr2-11.0.0.tgz", + "integrity": "sha512-8K88S0aSrcSXdJfiZtEy5BQMnR+TyjrCGLcgAvQs6ta0NEnIm0RJ72/Pv67Jvg07cfBhDbuN74V81lSSVYEFEw==", "dev": true, "license": "MIT", - "peer": true, "dependencies": { - "cli-truncate": "^5.2.0", - "eventemitter3": "^5.0.4", - "log-update": "^6.1.0", - "rfdc": "^1.4.1", + "cli-truncate": "^6.1.1", + "log-update": "^8.0.0", "wrap-ansi": "^10.0.0" }, "engines": { "node": ">=22.13.0" } }, - "node_modules/listr2/node_modules/eventemitter3": { - "version": "5.0.4", - "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-5.0.4.tgz", - "integrity": "sha512-mlsTRyGaPBjPedk6Bvw+aqbsXDtoAyAzm5MO7JgU+yVRyMQ5O8bD4Kcci7BS85f93veegeCPkL8R4GLClnjLFw==", - "dev": true, - "license": "MIT", - "peer": true - }, "node_modules/lit": { "version": "3.3.3", "resolved": "https://registry.npmjs.org/lit/-/lit-3.3.3.tgz", @@ -12448,98 +12663,43 @@ } }, "node_modules/log-update": { - "version": "6.1.0", - "resolved": "https://registry.npmjs.org/log-update/-/log-update-6.1.0.tgz", - "integrity": "sha512-9ie8ItPR6tjY5uYJh8K/Zrv/RMZ5VOlOWvtZdEHYSTFKZfIBPQa9tOAEeAWhd+AnIneLJ22w5fjOYtoutpWq5w==", + "version": "8.0.0", + "resolved": "https://registry.npmjs.org/log-update/-/log-update-8.0.0.tgz", + "integrity": "sha512-lddSgOt3bPASrylL54ZSpy8nBHns+vBVSoILlVOx+dei300pnLRN958rj/EdlVLKuWlSESU3qdnDZdAI7FXYGg==", "dev": true, "license": "MIT", "dependencies": { - "ansi-escapes": "^7.0.0", + "ansi-escapes": "^7.3.0", "cli-cursor": "^5.0.0", - "slice-ansi": "^7.1.0", - "strip-ansi": "^7.1.0", - "wrap-ansi": "^9.0.0" + "slice-ansi": "^9.0.0", + "string-width": "^8.2.0", + "strip-ansi": "^7.2.0", + "wrap-ansi": "^10.0.0" }, "engines": { - "node": ">=18" + "node": ">=22" }, "funding": { "url": "https://github.com/sponsors/sindresorhus" } }, - "node_modules/log-update/node_modules/ansi-styles": { - "version": "6.2.3", - "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-6.2.3.tgz", - "integrity": "sha512-4Dj6M28JB+oAH8kFkTLUo+a2jwOFkuqb3yucU0CANcRRUbxS0cP0nZYCGjcc3BNXwRIsUVmDGgzawme7zvJHvg==", - "dev": true, - "license": "MIT", - "engines": { - "node": ">=12" - }, - "funding": { - "url": "https://github.com/chalk/ansi-styles?sponsor=1" - } - }, - "node_modules/log-update/node_modules/emoji-regex": { - "version": "10.6.0", - "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-10.6.0.tgz", - "integrity": "sha512-toUI84YS5YmxW219erniWD0CIVOo46xGKColeNQRgOzDorgBi1v4D71/OFzgD9GO2UGKIv1C3Sp8DAn0+j5w7A==", - "dev": true, - "license": "MIT" - }, - "node_modules/log-update/node_modules/slice-ansi": { - "version": "7.1.2", - "resolved": "https://registry.npmjs.org/slice-ansi/-/slice-ansi-7.1.2.tgz", - "integrity": "sha512-iOBWFgUX7caIZiuutICxVgX1SdxwAVFFKwt1EvMYYec/NWO5meOJ6K5uQxhrYBdQJne4KxiqZc+KptFOWFSI9w==", - "dev": true, - "license": "MIT", - "dependencies": { - "ansi-styles": "^6.2.1", - "is-fullwidth-code-point": "^5.0.0" - }, - "engines": { - "node": ">=18" - }, - "funding": { - "url": "https://github.com/chalk/slice-ansi?sponsor=1" - } - }, "node_modules/log-update/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==", + "version": "8.2.2", + "resolved": "https://registry.npmjs.org/string-width/-/string-width-8.2.2.tgz", + "integrity": "sha512-GaPUh5gfdrYzqeVNZvUfT23vYYxXzKYidUcnMtJg/3rxRV63EFZy3k6xfKlmfeJD0176lnUV/Usr3XcwSvFzpg==", "dev": true, "license": "MIT", "dependencies": { - "emoji-regex": "^10.3.0", - "get-east-asian-width": "^1.0.0", - "strip-ansi": "^7.1.0" + "get-east-asian-width": "^1.5.0", + "strip-ansi": "^7.1.2" }, "engines": { - "node": ">=18" + "node": ">=20" }, "funding": { "url": "https://github.com/sponsors/sindresorhus" } }, - "node_modules/log-update/node_modules/wrap-ansi": { - "version": "9.0.2", - "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-9.0.2.tgz", - "integrity": "sha512-42AtmgqjV+X1VpdOfyTGOYRi0/zsoLqtXQckTmqTeybT+BDIbM/Guxo7x3pE2vtpr1ok6xRqM9OpBe+Jyoqyww==", - "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/log4js": { "version": "6.9.1", "resolved": "https://registry.npmjs.org/log4js/-/log4js-6.9.1.tgz", @@ -12601,9 +12761,9 @@ "license": "MIT" }, "node_modules/marked": { - "version": "17.0.6", - "resolved": "https://registry.npmjs.org/marked/-/marked-17.0.6.tgz", - "integrity": "sha512-gB0gkNafnonOw0obSTEGZTT86IuhILt2Wfx0mWH/1Au83kybTayroZ/V6nS25mN7u8ASy+5fMhgB3XPNrOZdmA==", + "version": "18.0.11", + "resolved": "https://registry.npmjs.org/marked/-/marked-18.0.11.tgz", + "integrity": "sha512-HnslJfsZkRPBDJRHvVtAaWlZHEpSu7u8LgQuJCELjRKuWR+hpq4A7sLq3p8HaI9ypVoXDXxV34CsQJEe1+J5Aw==", "license": "MIT", "bin": { "marked": "bin/marked.js" @@ -12974,9 +13134,9 @@ } }, "node_modules/nanoid": { - "version": "3.3.17", - "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.17.tgz", - "integrity": "sha512-xQLf0A3HOMlgHq0n247/LRuAOYmB7dXJ/DvAxGvsSBij45XtBSmQycu+F8ODbHwns/XyFZagyL1+J0Offw1E0g==", + "version": "3.3.18", + "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.18.tgz", + "integrity": "sha512-DTg4MJbGMWkfi6VZFdNt2/caMbQy4Ou+Op/hJQvGEWcnVfoA1QA+xzRKAzw9jD6+GVOOeYr/mIcuDSdug6F6+w==", "funding": [ { "type": "github", @@ -13103,9 +13263,9 @@ } }, "node_modules/node-releases": { - "version": "2.0.52", - "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.52.tgz", - "integrity": "sha512-MRlTqhAfoMx/4mhEbPo3Hi02g9LJZaJkka69V6h67Cb1gjrAG0jsTE4CZX1eptNx+VCAwJmfpnDIF4P0Nh1A7A==", + "version": "2.0.53", + "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.53.tgz", + "integrity": "sha512-D9UOmYG3UH1V+ENW56t5QXBwJw1YEY18ruVeus89Rw+SyIgjPkCO84bRzO3uNIYosJbNwiabWVn48o3uJLjxFQ==", "license": "MIT", "engines": { "node": ">=18" @@ -13870,9 +14030,9 @@ } }, "node_modules/postcss": { - "version": "8.5.25", - "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.25.tgz", - "integrity": "sha512-DTPx3RWSSnWyzLxQnlH0rJP+EW5ekl16ZU4/psbIhA0e53kJfdgaN5vKM+xP7yJtXVu+nfdVFmlgFDEKAe4Pyw==", + "version": "8.5.26", + "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.26.tgz", + "integrity": "sha512-u82N74LFzG8ca+dD8puPnplTXoGH4fTPpVGuIbt36G3qvNlkvfD0lEAZSxaly3KX8TS/L1A1gsCEmvKmBcVbkQ==", "funding": [ { "type": "opencollective", @@ -13889,7 +14049,7 @@ ], "license": "MIT", "dependencies": { - "nanoid": "^3.3.16", + "nanoid": "^3.3.17", "picocolors": "^1.1.1", "source-map-js": "^1.2.1" }, @@ -14143,9 +14303,9 @@ "license": "MIT" }, "node_modules/readdirp": { - "version": "5.0.0", - "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-5.0.0.tgz", - "integrity": "sha512-9u/XQ1pvrQtYyMpZe7DXKv2p5CNvyVwzUB6uhLAnQwHMSgKMBR62lc7AHljaeteeHXn11XTAaLLUVZYVZyuRBQ==", + "version": "5.1.1", + "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-5.1.1.tgz", + "integrity": "sha512-Kko+Y5XQ6fM+Ce3dq3m9YGxnacYZYl9cA1wZjaF3Vbry2L3i1qVg8+CAgNPsXRArPMUMCaOR7oa9Nqntc43JKA==", "license": "MIT", "engines": { "node": ">= 20.19.0" @@ -15340,19 +15500,22 @@ } }, "node_modules/shiki": { - "version": "3.23.0", - "resolved": "https://registry.npmjs.org/shiki/-/shiki-3.23.0.tgz", - "integrity": "sha512-55Dj73uq9ZXL5zyeRPzHQsK7Nbyt6Y10k5s7OjuFZGMhpp4r/rsLBH0o/0fstIzX1Lep9VxefWljK/SKCzygIA==", + "version": "4.4.3", + "resolved": "https://registry.npmjs.org/shiki/-/shiki-4.4.3.tgz", + "integrity": "sha512-Mb/GvXPHBAXdgGIcnfU5L3ldpn1XcxrGkPHwqgRx17/I2XRfqlFKk2vGkHWINn1kdXvzJZeuO3is6I9KLPFm0g==", "license": "MIT", "dependencies": { - "@shikijs/core": "3.23.0", - "@shikijs/engine-javascript": "3.23.0", - "@shikijs/engine-oniguruma": "3.23.0", - "@shikijs/langs": "3.23.0", - "@shikijs/themes": "3.23.0", - "@shikijs/types": "3.23.0", + "@shikijs/core": "4.4.3", + "@shikijs/engine-javascript": "4.4.3", + "@shikijs/engine-oniguruma": "4.4.3", + "@shikijs/langs": "4.4.3", + "@shikijs/themes": "4.4.3", + "@shikijs/types": "4.4.3", "@shikijs/vscode-textmate": "^10.0.2", - "@types/hast": "^3.0.4" + "@types/hast": "^3.0.5" + }, + "engines": { + "node": ">=20" } }, "node_modules/side-channel": { @@ -15466,9 +15629,9 @@ } }, "node_modules/slice-ansi": { - "version": "8.0.0", - "resolved": "https://registry.npmjs.org/slice-ansi/-/slice-ansi-8.0.0.tgz", - "integrity": "sha512-stxByr12oeeOyY2BlviTNQlYV5xOj47GirPr4yA1hE9JCtxfQN0+tVbkxwCtYDQWhEKWFHsEK48ORg5jrouCAg==", + "version": "9.0.0", + "resolved": "https://registry.npmjs.org/slice-ansi/-/slice-ansi-9.0.0.tgz", + "integrity": "sha512-SO/3iYL5S3W57LLEniscOGPZgOqZUPCx6d3dB+52B80yJ0XstzsC/eV8gnA4tM3MHDrKz+OCFSLNjswdSC+/bA==", "dev": true, "license": "MIT", "dependencies": { @@ -15476,7 +15639,7 @@ "is-fullwidth-code-point": "^5.1.0" }, "engines": { - "node": ">=20" + "node": ">=22" }, "funding": { "url": "https://github.com/chalk/slice-ansi?sponsor=1" @@ -15526,9 +15689,9 @@ } }, "node_modules/socket.io-adapter/node_modules/ws": { - "version": "8.21.2", - "resolved": "https://registry.npmjs.org/ws/-/ws-8.21.2.tgz", - "integrity": "sha512-54dMVAo4WIe6SKy3vBgN+9bJZqqQ8IMRevAkOLQALhi49qkkQDQfWdAZ8KQlXiEabw88ARXXdUrlvtbKQX+aKw==", + "version": "8.21.3", + "resolved": "https://registry.npmjs.org/ws/-/ws-8.21.3.tgz", + "integrity": "sha512-201TZ/kPWxoPr/OKWjquZR1SWKXcvxdH+e1xrx89b3YbmzLMFCLfnaG1HFIgWzJOEWZ7MvpK++odZufgYR50Rw==", "dev": true, "license": "MIT", "engines": { @@ -15762,9 +15925,9 @@ } }, "node_modules/streamx": { - "version": "2.28.0", - "resolved": "https://registry.npmjs.org/streamx/-/streamx-2.28.0.tgz", - "integrity": "sha512-1Yowhzjf0ivGMrTIkY9hav5TxobO9qIVqUE41fiCGMGgc3CLlf4MY+9AHmZqBWgDTue0fY9zWjYFVyf6Diuobw==", + "version": "2.28.1", + "resolved": "https://registry.npmjs.org/streamx/-/streamx-2.28.1.tgz", + "integrity": "sha512-zEzXb0s5Cds7tqMH6rhZ05lcJydCWiQPEwiNngVqzsxCc962vLY4Uw+mW7od8kDH258k2Uz/JrOkdIAAhSh9VA==", "dev": true, "license": "MIT", "dependencies": { @@ -16440,16 +16603,16 @@ } }, "node_modules/typescript-eslint": { - "version": "8.66.0", - "resolved": "https://registry.npmjs.org/typescript-eslint/-/typescript-eslint-8.66.0.tgz", - "integrity": "sha512-QlEbBPz/RuJ1XUHj29nm3t0F/O/cSlEnntozqPOYHnnTGAXFamnMBu5i9Vn6vhUPHGAjR+Vl+5J8vPN/BMUrJw==", + "version": "8.68.0", + "resolved": "https://registry.npmjs.org/typescript-eslint/-/typescript-eslint-8.68.0.tgz", + "integrity": "sha512-MHy0Y0ynqeEbx/S45+i/bBssdy3X6KNBfmJAP35GrgtNxu2TQ5K5xsFDhAnmsq1jvpdoZOPG1LGtJo0HWqYCrQ==", "dev": true, "license": "MIT", "dependencies": { - "@typescript-eslint/eslint-plugin": "8.66.0", - "@typescript-eslint/parser": "8.66.0", - "@typescript-eslint/typescript-estree": "8.66.0", - "@typescript-eslint/utils": "8.66.0" + "@typescript-eslint/eslint-plugin": "8.68.0", + "@typescript-eslint/parser": "8.68.0", + "@typescript-eslint/typescript-estree": "8.68.0", + "@typescript-eslint/utils": "8.68.0" }, "engines": { "node": "^18.18.0 || ^20.9.0 || >=21.1.0" @@ -16650,9 +16813,9 @@ } }, "node_modules/update-browserslist-db": { - "version": "1.2.3", - "resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.2.3.tgz", - "integrity": "sha512-Js0m9cx+qOgDxo0eMiFGEueWztz+d4+M3rGlmKPT+T4IS/jP4ylw3Nwpu6cpTTP8R1MAC1kF4VbdLt3ARf209w==", + "version": "1.3.1", + "resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.3.1.tgz", + "integrity": "sha512-ZZ61DsRsOnakl74HAmp3oSN4aXUmEWXf+i/yv0h7tIBfICc3VdrFErQKUUKPgu3AMsTUMbcongALEN4l6GSUrQ==", "funding": [ { "type": "opencollective", @@ -17541,15 +17704,14 @@ } }, "node_modules/wrap-ansi": { - "version": "10.0.0", - "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-10.0.0.tgz", - "integrity": "sha512-SGcvg80f0wUy2/fXES19feHMz8E0JoXv2uNgHOu4Dgi2OrCy1lqwFYEJz1BLbDI0exjPMe/ZdzZ/YpGECBG/aQ==", + "version": "10.0.1", + "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-10.0.1.tgz", + "integrity": "sha512-M0N4xzyzosiIok3svYlEo1sdLZts/8FPgYH/GPC3wvlmPoRvnoManGMrE54waYj3tISA8w6lsdesfVv67qSr8Q==", "dev": true, "license": "MIT", "dependencies": { "ansi-styles": "^6.2.3", - "string-width": "^8.2.0", - "strip-ansi": "^7.1.2" + "string-width": "^8.2.0" }, "engines": { "node": ">=20" @@ -17651,15 +17813,15 @@ "license": "ISC" }, "node_modules/yargs": { - "version": "18.0.0", - "resolved": "https://registry.npmjs.org/yargs/-/yargs-18.0.0.tgz", - "integrity": "sha512-4UEqdc2RYGHZc7Doyqkrqiln3p9X2DZVxaGbwhn2pi7MrRagKaOcIKe8L3OxYcbhXLgLFUS3zAYuQjKBQgmuNg==", + "version": "18.1.0", + "resolved": "https://registry.npmjs.org/yargs/-/yargs-18.1.0.tgz", + "integrity": "sha512-2rAgRKu54VsHkqI0/tYkmluGXHD4KW7yZoycuqDQ15QOTnc2VVfy0nN/1eMhnQLO00A+dwtK20xuCnc1YGeUyg==", "license": "MIT", "dependencies": { "cliui": "^9.0.1", "escalade": "^3.1.1", "get-caller-file": "^2.0.5", - "string-width": "^7.2.0", + "string-width": "^8.2.1", "y18n": "^5.0.5", "yargs-parser": "^22.0.0" }, @@ -17676,24 +17838,17 @@ "node": "^20.19.0 || ^22.12.0 || >=23" } }, - "node_modules/yargs/node_modules/emoji-regex": { - "version": "10.6.0", - "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-10.6.0.tgz", - "integrity": "sha512-toUI84YS5YmxW219erniWD0CIVOo46xGKColeNQRgOzDorgBi1v4D71/OFzgD9GO2UGKIv1C3Sp8DAn0+j5w7A==", - "license": "MIT" - }, "node_modules/yargs/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==", + "version": "8.2.2", + "resolved": "https://registry.npmjs.org/string-width/-/string-width-8.2.2.tgz", + "integrity": "sha512-GaPUh5gfdrYzqeVNZvUfT23vYYxXzKYidUcnMtJg/3rxRV63EFZy3k6xfKlmfeJD0176lnUV/Usr3XcwSvFzpg==", "license": "MIT", "dependencies": { - "emoji-regex": "^10.3.0", - "get-east-asian-width": "^1.0.0", - "strip-ansi": "^7.1.0" + "get-east-asian-width": "^1.5.0", + "strip-ansi": "^7.1.2" }, "engines": { - "node": ">=18" + "node": ">=20" }, "funding": { "url": "https://github.com/sponsors/sindresorhus" @@ -17766,12 +17921,6 @@ "zod": "^3.25.28 || ^4" } }, - "node_modules/zone.js": { - "version": "0.15.1", - "resolved": "https://registry.npmjs.org/zone.js/-/zone.js-0.15.1.tgz", - "integrity": "sha512-XE96n56IQpJM7NAoXswY3XRLcWFW83xe0BiAOeMD7K5k5xecOeul3Qcpx6GqEeeHNkW5DWL5zOyTbEfB4eti8w==", - "license": "MIT" - }, "node_modules/zwitch": { "version": "2.0.4", "resolved": "https://registry.npmjs.org/zwitch/-/zwitch-2.0.4.tgz", diff --git a/package.json b/package.json index fb56a53aed..2ca6bbe650 100644 --- a/package.json +++ b/package.json @@ -65,34 +65,31 @@ "@popperjs/core": "2.11.8", "@tailwindcss/postcss": "^4.1.10", "@types/file-saver": "^2.0.2", - "@types/hammerjs": "^2.0.39", "angular-in-memory-web-api": "^0.22.0", "bootstrap": "5.3.3", "dompurify": "^3.2.7", "express": "^4.18.2", "file-saver": "^2.0.2", "fuse.js": "^7.1.0", - "hammerjs": "^2.0.8", - "igniteui-angular": "^22.0.0", + "igniteui-angular": "22.1.0", "igniteui-angular-charts": "^22.0.0", "igniteui-angular-core": "^22.0.0", - "igniteui-angular-extras": "^22.0.0", - "igniteui-angular-i18n": "^22.0.0", + "igniteui-angular-extras": "22.1.0", + "igniteui-angular-i18n": "22.1.0", "igniteui-dockmanager": "^1.17.0", - "igniteui-grid-lite": "^0.9.0", + "igniteui-grid-lite": "0.10.0", "igniteui-i18n-resources": "^1.0.4", - "igniteui-live-editing": "^3.5.1", - "igniteui-webcomponents": "^7.2.1", - "marked": "^17.0.1", + "igniteui-live-editing": "^3.5.2", + "igniteui-webcomponents": "^7.3.0", + "marked": "^18.0.11", "marked-shiki": "^1.2.1", "minireset.css": "0.0.6", "postcss": "^8.5.5", "rxjs": "^7.8.2", - "shiki": "^3.13.0", + "shiki": "^4.3.0", "sql-formatter": "^15.4.11", "tailwindcss": "^4.1.10", - "tslib": "^2.6.1", - "zone.js": "~0.15.0" + "tslib": "^2.6.1" }, "overrides": { "@ng-bootstrap/ng-bootstrap": { @@ -113,7 +110,7 @@ "@angular/compiler": "^22.0.0" }, "igniteui-angular-extras": { - "igniteui-angular": "^22.0.0", + "igniteui-angular": "22.1.0", "@infragistics/igniteui-angular": "^22.0.0", "igniteui-angular-core": "^22.0.0", "igniteui-angular-charts": "^22.0.0", diff --git a/projects/app-crm/src/app/app.component.ts b/projects/app-crm/src/app/app.component.ts index 0e535cfbfe..d712d916e9 100644 --- a/projects/app-crm/src/app/app.component.ts +++ b/projects/app-crm/src/app/app.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, DOCUMENT, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, DOCUMENT, inject } from '@angular/core'; import { SEOService } from '../../../app-lob/src/app/seo.service'; import { RouterOutlet } from '@angular/router'; @@ -7,7 +7,6 @@ import { RouterOutlet } from '@angular/router'; selector: 'app-root', styleUrls: ['./app.component.scss'], templateUrl: './app.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [RouterOutlet] }) export class AppComponent implements OnInit { diff --git a/projects/app-crm/src/app/grid-crm/grid-crm.component.ts b/projects/app-crm/src/app/grid-crm/grid-crm.component.ts index 0b76333d4b..f83c781585 100644 --- a/projects/app-crm/src/app/grid-crm/grid-crm.component.ts +++ b/projects/app-crm/src/app/grid-crm/grid-crm.component.ts @@ -1,8 +1,8 @@ /* eslint-disable no-underscore-dangle */ -import { AfterViewInit, Component, ElementRef, OnInit, QueryList, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { AfterViewInit, Component, ElementRef, OnInit, QueryList, ViewChild, inject } from '@angular/core'; import { ActivatedRoute } from '@angular/router'; -import { CloseScrollStrategy, ConnectedPositioningStrategy, HorizontalAlignment, IgxSummaryResult, OverlaySettings, PositionSettings, VerticalAlignment } from 'igniteui-angular/core'; -import { CellType, GridSelectionMode, IgxCellTemplateDirective, IgxColumnComponent, IgxDateSummaryOperand, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarExporterComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent, IgxGridToolbarTitleComponent, IgxNumberSummaryOperand, IColumnExportingEventArgs, IgxCsvExporterService, IgxExcelExporterService } from 'igniteui-angular/grids/core'; +import { CloseScrollStrategy, ConnectedPositioningStrategy, HorizontalAlignment, IgxDateSummaryOperand, IgxNumberSummaryOperand, IgxSummaryResult, OverlaySettings, PositionSettings, VerticalAlignment } from 'igniteui-angular/core'; +import { CellType, GridSelectionMode, IColumnExportingEventArgs, IgxCellTemplateDirective, IgxColumnComponent, IgxCsvExporterService, IgxExcelExporterService, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarExporterComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent, IgxGridToolbarTitleComponent } from 'igniteui-angular/grids/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxIconButtonDirective, IgxToggleDirective } from 'igniteui-angular/directives'; import { IgxInputDirective, IgxInputGroupComponent, IgxPrefixDirective, IgxSuffixDirective } from 'igniteui-angular/input-group'; @@ -75,7 +75,6 @@ class SoonSummary extends IgxDateSummaryOperand { selector: 'app-grid', styleUrls: ['./grid-crm.component.scss'], templateUrl: './grid-crm.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [NgClass, IgxGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxGridToolbarActionsComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent, IgxGridToolbarExporterComponent, IgxGridToolbarTitleComponent, IgxInputGroupComponent, IgxPrefixDirective, IgxIconComponent, FormsModule, IgxInputDirective, IgxSuffixDirective, IgxIconButtonDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxAvatarComponent, IgxLinearProgressBarComponent] }) export class GridCRMComponent implements OnInit, AfterViewInit { diff --git a/projects/app-crm/src/environments/environment.ts b/projects/app-crm/src/environments/environment.ts index 30d7bccb19..5dd10dc009 100644 --- a/projects/app-crm/src/environments/environment.ts +++ b/projects/app-crm/src/environments/environment.ts @@ -5,12 +5,3 @@ export const environment = { production: false }; - -/* - * For easier debugging in development mode, you can import the following file - * to ignore zone related error stack frames such as `zone.run`, `zoneDelegate.invokeTask`. - * - * This import should be commented out in production mode because it will have a negative impact - * on performance if an error is thrown. - */ -// import 'zone.js/plugins/zone-error'; // Included with Angular CLI. diff --git a/projects/app-crm/src/main.server.ts b/projects/app-crm/src/main.server.ts index 9c6485729a..fbd3e9dbd7 100644 --- a/projects/app-crm/src/main.server.ts +++ b/projects/app-crm/src/main.server.ts @@ -1,8 +1,7 @@ -import { provideZoneChangeDetection } from "@angular/core"; import { bootstrapApplication, BootstrapContext } from '@angular/platform-browser'; import { AppComponent } from './app/app.component'; import { config } from './app/app.config.server'; -const bootstrap = (context: BootstrapContext) => bootstrapApplication(AppComponent, {...config, providers: [provideZoneChangeDetection(), ...config.providers]}, context); +const bootstrap = (context: BootstrapContext) => bootstrapApplication(AppComponent, config, context); export default bootstrap; diff --git a/projects/app-crm/src/main.ts b/projects/app-crm/src/main.ts index 17202407de..e88e5798b3 100644 --- a/projects/app-crm/src/main.ts +++ b/projects/app-crm/src/main.ts @@ -1,11 +1,14 @@ -import { enableProdMode, provideZoneChangeDetection } from '@angular/core'; +import { enableProdMode } from '@angular/core'; import { environment } from './environments/environment'; import { bootstrapApplication } from '@angular/platform-browser'; import { AppComponent } from './app/app.component'; import { AppConfig } from './app/app.config'; +import { initSampleSizeReporter } from '@shared/sample-size-reporter'; if (environment.production) { enableProdMode(); } -bootstrapApplication(AppComponent, {...AppConfig, providers: [provideZoneChangeDetection(), ...AppConfig.providers]}).catch((err) => console.error(err)); +initSampleSizeReporter(); + +bootstrapApplication(AppComponent, AppConfig).catch((err) => console.error(err)); diff --git a/projects/app-crm/src/polyfills.ts b/projects/app-crm/src/polyfills.ts deleted file mode 100644 index cf0b9bb2dd..0000000000 --- a/projects/app-crm/src/polyfills.ts +++ /dev/null @@ -1,5 +0,0 @@ -// /*************************************************************************************************** -// * Zone JS is required by Angular itself. -// // */ -import 'hammerjs/hammer'; -import 'zone.js'; // Included with Angular CLI. diff --git a/projects/app-crm/src/test.ts b/projects/app-crm/src/test.ts index 3ac997f524..4f7b6ae8ef 100644 --- a/projects/app-crm/src/test.ts +++ b/projects/app-crm/src/test.ts @@ -1,15 +1,14 @@ -// This file is required by karma.conf.js and loads recursively all the .spec and framework files -import { getTestBed } from '@angular/core/testing'; -import { - BrowserDynamicTestingModule, - platformBrowserDynamicTesting -} from '@angular/platform-browser-dynamic/testing'; -import 'zone.js/testing'; - -// First, initialize the Angular testing environment. -getTestBed().initTestEnvironment( - BrowserDynamicTestingModule, +// This file is required by karma.conf.js and loads recursively all the .spec and framework files +import { getTestBed } from '@angular/core/testing'; +import { + BrowserDynamicTestingModule, + platformBrowserDynamicTesting +} from '@angular/platform-browser-dynamic/testing'; + +// First, initialize the Angular testing environment. +getTestBed().initTestEnvironment( + BrowserDynamicTestingModule, platformBrowserDynamicTesting(), { teardown: { destroyAfterEach: false } -} -); +} +); diff --git a/projects/app-crm/tsconfig.app.json b/projects/app-crm/tsconfig.app.json index 849a95a087..3118497395 100644 --- a/projects/app-crm/tsconfig.app.json +++ b/projects/app-crm/tsconfig.app.json @@ -9,7 +9,6 @@ }, "files": [ "src/main.ts", - "src/polyfills.ts", "src/main.server.ts", "src/server.ts" ], diff --git a/projects/app-crm/tsconfig.spec.json b/projects/app-crm/tsconfig.spec.json index bfed18fb6f..a480757653 100644 --- a/projects/app-crm/tsconfig.spec.json +++ b/projects/app-crm/tsconfig.spec.json @@ -8,8 +8,7 @@ ] }, "files": [ - "src/test.ts", - "src/polyfills.ts" + "src/test.ts" ], "include": [ "src/**/*.spec.ts", diff --git a/projects/app-lob/src/app/app.component.ts b/projects/app-lob/src/app/app.component.ts index e6d7a47e5d..d38aa4061e 100644 --- a/projects/app-lob/src/app/app.component.ts +++ b/projects/app-lob/src/app/app.component.ts @@ -1,5 +1,5 @@ -import { Component, HostListener, OnInit, DOCUMENT, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, HostListener, OnInit, DOCUMENT, inject } from '@angular/core'; import { ActivatedRoute, NavigationEnd, Router, RouterOutlet } from '@angular/router'; import { filter, map, mergeMap } from 'rxjs/operators'; import { SEOService } from './seo.service'; @@ -8,7 +8,6 @@ import { SEOService } from './seo.service'; selector: 'app-root', styleUrls: ['./app.component.scss'], templateUrl: './app.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [RouterOutlet] }) export class AppComponent implements OnInit { diff --git a/projects/app-lob/src/app/grid-dynamic-chart-data/data-analysis-dock-manager/data-analysis-dock-manager.component.ts b/projects/app-lob/src/app/grid-dynamic-chart-data/data-analysis-dock-manager/data-analysis-dock-manager.component.ts index 655a0320bc..39dac07462 100644 --- a/projects/app-lob/src/app/grid-dynamic-chart-data/data-analysis-dock-manager/data-analysis-dock-manager.component.ts +++ b/projects/app-lob/src/app/grid-dynamic-chart-data/data-analysis-dock-manager/data-analysis-dock-manager.component.ts @@ -1,5 +1,5 @@ /* eslint-disable max-len */ -import { AfterViewInit, ChangeDetectorRef, ViewContainerRef, Component, CUSTOM_ELEMENTS_SCHEMA, ElementRef, OnInit, Pipe, PipeTransform, QueryList, ViewChild, ViewChildren, TemplateRef, inject, ChangeDetectionStrategy } from '@angular/core'; +import { AfterViewInit, ChangeDetectorRef, ViewContainerRef, Component, CUSTOM_ELEMENTS_SCHEMA, ElementRef, OnInit, Pipe, PipeTransform, QueryList, ViewChild, ViewChildren, TemplateRef, inject } from '@angular/core'; import { IgxChartIntegrationDirective, IgxConditionalFormattingDirective, IgxContextMenuDirective, OPTIONS_TYPE, CHART_TYPE, IDeterminedChartTypesArgs } from 'igniteui-angular-extras'; import { IgcDockManagerLayout, IgcDockManagerPaneType, IgcSplitPane, IgcSplitPaneOrientation } from 'igniteui-dockmanager'; import { FinancialData } from '../../data/financialData'; @@ -7,7 +7,7 @@ import { FloatingPanesService } from '../../services/floating-panes.service'; import { DockSlotComponent } from './dock-slot/dock-slot.component'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IColumnSelectionEventArgs, IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; -import { IgxDividerDirective } from 'igniteui-angular/directives'; +import { IgxDividerComponent } from 'igniteui-angular/directives'; import { IgxBadgeComponent } from 'igniteui-angular/badge'; import { NgClass, DecimalPipe, TitleCasePipe, CurrencyPipe } from '@angular/common'; import { debounceTime } from 'rxjs/operators'; @@ -57,8 +57,7 @@ export class HastDuplicateLayouts implements PipeTransform { templateUrl: './data-analysis-dock-manager.component.html', styleUrls: ['./data-analysis-dock-manager.component.scss'], providers: [FloatingPanesService], - imports: [IgxGridComponent, IgxConditionalFormattingDirective, IgxChartIntegrationDirective, IgxContextMenuDirective, IgxBadgeComponent, IgxColumnComponent, IgxCellTemplateDirective, NgClass, IgxDividerDirective, DockSlotComponent, DecimalPipe, TitleCasePipe, CurrencyPipe, FilterTypePipe, HastDuplicateLayouts], - changeDetection: ChangeDetectionStrategy.Eager, + imports: [IgxGridComponent, IgxConditionalFormattingDirective, IgxChartIntegrationDirective, IgxContextMenuDirective, IgxBadgeComponent, IgxColumnComponent, IgxCellTemplateDirective, NgClass, IgxDividerComponent, DockSlotComponent, DecimalPipe, TitleCasePipe, CurrencyPipe, FilterTypePipe, HastDuplicateLayouts], schemas: [CUSTOM_ELEMENTS_SCHEMA] }) export class DataAnalysisDockManagerComponent implements OnInit, AfterViewInit { diff --git a/projects/app-lob/src/app/grid-dynamic-chart-data/data-analysis-dock-manager/dock-slot/dock-slot.component.ts b/projects/app-lob/src/app/grid-dynamic-chart-data/data-analysis-dock-manager/dock-slot/dock-slot.component.ts index fdbd6388b4..e6199d57ec 100644 --- a/projects/app-lob/src/app/grid-dynamic-chart-data/data-analysis-dock-manager/dock-slot/dock-slot.component.ts +++ b/projects/app-lob/src/app/grid-dynamic-chart-data/data-analysis-dock-manager/dock-slot/dock-slot.component.ts @@ -1,11 +1,10 @@ -import { Component, HostBinding, Input, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, HostBinding, Input, OnInit, ViewChild } from '@angular/core'; import { ChartHostDirective } from '../../directives/chart-integration/chart-integration.directive'; @Component({ selector: 'app-dock-slot', templateUrl: './dock-slot.component.html', styleUrls: ['./dock-slot.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [ChartHostDirective] }) export class DockSlotComponent implements OnInit { diff --git a/projects/app-lob/src/app/grid-dynamic-chart-data/grid-dynamic-chart-data.component.ts b/projects/app-lob/src/app/grid-dynamic-chart-data/grid-dynamic-chart-data.component.ts index e9af4cefd4..185cb37db5 100644 --- a/projects/app-lob/src/app/grid-dynamic-chart-data/grid-dynamic-chart-data.component.ts +++ b/projects/app-lob/src/app/grid-dynamic-chart-data/grid-dynamic-chart-data.component.ts @@ -1,5 +1,5 @@ /* eslint-disable max-len */ -import { AfterViewInit, Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { AfterViewInit, Component, OnInit, ViewChild } from '@angular/core'; import { IgxChartIntegrationDirective, IgxContextMenuDirective, IgxConditionalFormattingDirective, OPTIONS_TYPE, CHART_TYPE } from 'igniteui-angular-extras'; import { FinancialData } from '../data/financialData'; @@ -11,7 +11,6 @@ import { DecimalPipe, CurrencyPipe } from '@angular/common'; selector: 'app-grid-dynamic-chart-data', templateUrl: './grid-dynamic-chart-data.component.html', styleUrls: ['./grid-dynamic-chart-data.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxChartIntegrationDirective, IgxConditionalFormattingDirective, IgxContextMenuDirective, IgxColumnComponent, IgxCellTemplateDirective, DecimalPipe, CurrencyPipe] }) export class GridDynamicChartDataComponent implements OnInit, AfterViewInit { diff --git a/projects/app-lob/src/app/grid-finjs-dock-manager/dock-slot.component.ts b/projects/app-lob/src/app/grid-finjs-dock-manager/dock-slot.component.ts index 62c86fd777..ddeba6a902 100644 --- a/projects/app-lob/src/app/grid-finjs-dock-manager/dock-slot.component.ts +++ b/projects/app-lob/src/app/grid-finjs-dock-manager/dock-slot.component.ts @@ -1,13 +1,14 @@ // eslint-disable-next-line max-len -import { AfterViewInit, Component, Directive, EventEmitter, HostBinding, Input, OnInit, OnDestroy, Output, ViewChild, ViewContainerRef, inject, ChangeDetectionStrategy } from '@angular/core'; +import { AfterViewInit, Component, Directive, EventEmitter, HostBinding, Input, OnInit, OnDestroy, Output, ViewChild, ViewContainerRef, inject } from '@angular/core'; import { Subject } from 'rxjs'; @Directive({ // eslint-disable-next-line @angular-eslint/directive-selector selector: '[gridHost]' }) -export class GridHostDirective { viewContainerRef = inject(ViewContainerRef); - +export class GridHostDirective { + viewContainerRef = inject(ViewContainerRef); + } @Component({ @@ -16,7 +17,6 @@ export class GridHostDirective { viewContainerRef = inject(ViewContainerRef)
`, - changeDetection: ChangeDetectionStrategy.Eager, imports: [GridHostDirective] }) export class DockSlotComponent implements OnInit, AfterViewInit, OnDestroy { diff --git a/projects/app-lob/src/app/grid-finjs-dock-manager/grid-finjs-dock-manager.component.html b/projects/app-lob/src/app/grid-finjs-dock-manager/grid-finjs-dock-manager.component.html index 6c192d2e3f..453f8d9dcd 100644 --- a/projects/app-lob/src/app/grid-finjs-dock-manager/grid-finjs-dock-manager.component.html +++ b/projects/app-lob/src/app/grid-finjs-dock-manager/grid-finjs-dock-manager.component.html @@ -36,12 +36,11 @@
Add Floating Pane
-
+ [columnSelection]="'multiple'" [cellSelection]="'none'"> @@ -78,7 +77,7 @@
@@ -116,7 +115,7 @@
@@ -154,7 +153,7 @@
@@ -194,4 +193,3 @@ -
diff --git a/projects/app-lob/src/app/grid-finjs-dock-manager/grid-finjs-dock-manager.component.scss b/projects/app-lob/src/app/grid-finjs-dock-manager/grid-finjs-dock-manager.component.scss index dd4842ab34..c05ff12fb0 100644 --- a/projects/app-lob/src/app/grid-finjs-dock-manager/grid-finjs-dock-manager.component.scss +++ b/projects/app-lob/src/app/grid-finjs-dock-manager/grid-finjs-dock-manager.component.scss @@ -1,6 +1,31 @@ @use 'igniteui-dockmanager/dist/collection/styles/igc.themes'; @use '../../variables' as *; +// Set the grid's background/foreground/accent tokens; the grid's derived-themes +// layer cascades them to the paginator, scrollbars, chips, drop-downs, select, +// excel filter, etc. Scoped mode emits the short `--background`/`--foreground`/ +// `--accent-color` aliases the derived layer reads first. +$finjs-grid-accent-color: var(--ig-primary-500); +$finjs-grid-background: var(--ig-surface-500); +$finjs-grid-foreground: var(--ig-surface-500-contrast); + +$finjs-dark-grid-theme: grid-theme( + $schema: $dark-material-schema, + $background: $finjs-grid-background, + $foreground: $finjs-grid-foreground, + $accent-color: $finjs-grid-accent-color, +); + +$finjs-light-grid-theme: grid-theme( + $schema: $light-material-schema, + $background: $finjs-grid-background, + $foreground: $finjs-grid-foreground, + $accent-color: $finjs-grid-accent-color, +); + +@include tokens($finjs-dark-grid-theme, $mode: 'scoped', $scope: '.dark-theme igx-grid'); +@include tokens($finjs-light-grid-theme, $mode: 'scoped', $scope: '.light-theme igx-grid'); + .actionItem { margin-block-end: rem(20px); } @@ -44,7 +69,7 @@ .negative.strongNegative { .igx-grid__td-text { - color: color(null, 'success', 500, .8) !important; + color: color(null, 'error', 500, .8) !important; } } @@ -183,8 +208,3 @@ igx-grid { } } } - -igx-select { - --ig-size: var(--ig-size-small); -} - diff --git a/projects/app-lob/src/app/grid-finjs-dock-manager/grid-finjs-dock-manager.component.ts b/projects/app-lob/src/app/grid-finjs-dock-manager/grid-finjs-dock-manager.component.ts index 8242369b28..1d6304682d 100644 --- a/projects/app-lob/src/app/grid-finjs-dock-manager/grid-finjs-dock-manager.component.ts +++ b/projects/app-lob/src/app/grid-finjs-dock-manager/grid-finjs-dock-manager.component.ts @@ -1,6 +1,6 @@ /* eslint-disable max-len */ -import { AfterViewInit, ChangeDetectorRef, Component, ElementRef, Renderer2, OnDestroy, OnInit, DoCheck, TemplateRef, ViewChild, ViewContainerRef, ViewEncapsulation, CUSTOM_ELEMENTS_SCHEMA, inject, ChangeDetectionStrategy } from '@angular/core'; -import { AbsoluteScrollStrategy, ConnectedPositioningStrategy, DefaultSortingStrategy, GridColumnDataType, IgxOverlayOutletDirective, OverlaySettings, SortingDirection } from 'igniteui-angular/core'; +import { AfterViewInit, ChangeDetectorRef, Component, ElementRef, Renderer2, OnDestroy, OnInit, DoCheck, TemplateRef, ViewChild, ViewContainerRef, ViewEncapsulation, CUSTOM_ELEMENTS_SCHEMA, inject } from '@angular/core'; +import { AbsoluteScrollStrategy, ConnectedPositioningStrategy, DefaultSortingStrategy, GridColumnDataType, OverlaySettings, SortingDirection } from 'igniteui-angular/core'; import { IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxSelectComponent, IgxSelectItemComponent } from 'igniteui-angular/select'; @@ -23,8 +23,7 @@ import { AsyncPipe, CurrencyPipe } from '@angular/common'; selector: 'app-finjs-dock-manager', templateUrl: './grid-finjs-dock-manager.component.html', styleUrls: ['./grid-finjs-dock-manager.component.scss'], - imports: [IgxSwitchComponent, FormsModule, IgxSelectComponent, IgxLabelDirective, IgxPrefixDirective, IgxIconComponent, IgxSelectItemComponent, IgxButtonDirective, IgxOverlayOutletDirective, IgxGridComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxPaginatorComponent, GridHostDirective, AsyncPipe, CurrencyPipe], - changeDetection: ChangeDetectionStrategy.Eager, + imports: [IgxSwitchComponent, FormsModule, IgxSelectComponent, IgxLabelDirective, IgxPrefixDirective, IgxIconComponent, IgxSelectItemComponent, IgxButtonDirective, IgxGridComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxPaginatorComponent, GridHostDirective, AsyncPipe, CurrencyPipe], schemas: [CUSTOM_ELEMENTS_SCHEMA] }) export class GridFinJSDockManagerComponent implements OnInit, OnDestroy, AfterViewInit, DoCheck { @@ -42,7 +41,6 @@ export class GridFinJSDockManagerComponent implements OnInit, OnDestroy, AfterVi public priceTemplate: TemplateRef; @ViewChild(IgxSelectComponent) public select: IgxSelectComponent; @ViewChild('freq', { read: IgxSelectComponent }) public selectFrequency: IgxSelectComponent; - @ViewChild(IgxOverlayOutletDirective) outlet: IgxOverlayOutletDirective; public isDarkTheme = true; @@ -174,6 +172,7 @@ export class GridFinJSDockManagerComponent implements OnInit, OnDestroy, AfterVi this.data.pipe(takeUntil(this.destroy$)).subscribe((data) => { if (data.length !== 0) { this.isLoading = false; + this.cdr.markForCheck(); }; }); } @@ -204,9 +203,7 @@ export class GridFinJSDockManagerComponent implements OnInit, OnDestroy, AfterVi this.paneService.initialPanePosition = { x, y }; this.grid2.selectColumns(['price', 'change', 'changeP']); this.customOverlaySettings.target = this.select.inputGroup.element.nativeElement; - this.customOverlaySettings.outlet = this.outlet; this.freqOverlaySettings.target = this.selectFrequency.inputGroup.element.nativeElement; - this.freqOverlaySettings.outlet = this.outlet; this.grid1.groupingExpressions = [{ dir: SortingDirection.Desc, fieldName: 'category', @@ -225,6 +222,7 @@ export class GridFinJSDockManagerComponent implements OnInit, OnDestroy, AfterVi ignoreCase: false, strategy: DefaultSortingStrategy.instance() }]; + this.cdr.markForCheck(); }, 500); } @@ -303,7 +301,10 @@ export class GridFinJSDockManagerComponent implements OnInit, OnDestroy, AfterVi const componentRef = viewContainerRef.createComponent(IgxGridComponent); const grid = (componentRef.instance as IgxGridComponent); grid.autoGenerate = true; - this.dataService.data.pipe(takeUntil(destructor)).subscribe(d => grid.data = d); + this.dataService.data.pipe(takeUntil(destructor)).subscribe(d => { + grid.data = d; + componentRef.changeDetectorRef.markForCheck(); + }); grid.columnInit.pipe(takeUntil(destructor)).subscribe((col: IgxColumnComponent) => { if (col.field === 'price') { col.cellClasses = this.trends; diff --git a/projects/app-lob/src/app/grid-finjs/controllers.component.ts b/projects/app-lob/src/app/grid-finjs/controllers.component.ts index 515c615701..c8ce5bdfb3 100644 --- a/projects/app-lob/src/app/grid-finjs/controllers.component.ts +++ b/projects/app-lob/src/app/grid-finjs/controllers.component.ts @@ -1,25 +1,24 @@ -import { Component, EventEmitter, OnDestroy, OnInit, Output, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, EventEmitter, OnDestroy, OnInit, Output, ViewChild, inject } from '@angular/core'; import { ActivatedRoute } from '@angular/router'; -import { IButtonGroupEventArgs, IgxButtonGroupComponent } from 'igniteui-angular/button-group'; -import { IChangeCheckboxEventArgs } from 'igniteui-angular/checkbox'; -import { ISliderValueChangeEventArgs, IgxSliderComponent } from 'igniteui-angular/slider'; -import { IgxToastComponent } from 'igniteui-angular/toast'; -import { VerticalAlignment } from 'igniteui-angular/core'; +import { IButtonGroupEventArgs, IgxButtonGroupComponent } from 'igniteui-angular/button-group'; +import { IChangeCheckboxEventArgs } from 'igniteui-angular/checkbox'; +import { ISliderValueChangeEventArgs, IgxSliderComponent } from 'igniteui-angular/slider'; +import { IgxToastComponent } from 'igniteui-angular/toast'; +import { VerticalAlignment } from 'igniteui-angular/core'; import { IgxSwitchComponent } from 'igniteui-angular/switch'; import { Observable, Subscription, timer } from 'rxjs'; -import { debounce } from 'rxjs/operators'; - +import { debounce } from 'rxjs/operators'; + import { FormsModule } from '@angular/forms'; -@Component({ - selector: 'app-finjs-controllers', - styleUrls: ['./controllers.component.scss'], - templateUrl: './controllers.component.html', - changeDetection: ChangeDetectionStrategy.Eager, - imports: [IgxSwitchComponent, FormsModule, IgxSliderComponent, IgxButtonGroupComponent, IgxToastComponent] +@Component({ + selector: 'app-finjs-controllers', + styleUrls: ['./controllers.component.scss'], + templateUrl: './controllers.component.html', + imports: [IgxSwitchComponent, FormsModule, IgxSliderComponent, IgxButtonGroupComponent, IgxToastComponent] }) -export class ControllerComponent implements OnInit, OnDestroy { - private router = inject(ActivatedRoute); +export class ControllerComponent implements OnInit, OnDestroy { + private router = inject(ActivatedRoute); @ViewChild('buttonGroup1', { static: true }) public playButtons: IgxButtonGroupComponent; @ViewChild('slider1', { static: true }) public volumeSlider: IgxSliderComponent; @@ -69,7 +68,7 @@ export class ControllerComponent implements OnInit, OnDestroy { this.frequencyChanged$ = this.intervalSlider.valueChange.pipe(debounce(() => timer(200))); this.frequencyChangedSubscription = this.frequencyChanged$ .subscribe(() => this.frequencyChanged.emit(this.intervalSlider.value as number)); - + this.toast.positionSettings.verticalDirection = VerticalAlignment.Middle; // Hide theme switcher diff --git a/projects/app-lob/src/app/grid-finjs/grid-finjs.component.ts b/projects/app-lob/src/app/grid-finjs/grid-finjs.component.ts index 7ec11ce662..ea92f0c906 100644 --- a/projects/app-lob/src/app/grid-finjs/grid-finjs.component.ts +++ b/projects/app-lob/src/app/grid-finjs/grid-finjs.component.ts @@ -1,6 +1,6 @@ /* eslint-disable max-len */ import { AsyncPipe, CurrencyPipe } from '@angular/common'; -import { Component, ElementRef, EventEmitter, Input, OnInit, Output, ViewChild, DOCUMENT, inject, ChangeDetectionStrategy } from '@angular/core'; +import { ChangeDetectorRef, Component, ElementRef, EventEmitter, Input, OnInit, Output, ViewChild, DOCUMENT, inject } from '@angular/core'; import { CellType, GridSelectionMode, IColumnExportingEventArgs, IGridKeydownEventArgs, IRowSelectionEventArgs, IgxCellEditorTemplateDirective, IgxCellTemplateDirective, IgxColumnComponent, IgxExcelTextDirective, IgxExporterEvent, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarExporterComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent, IgxPdfExporterOptions, IgxPdfExporterService, IgxPdfTextDirective } from 'igniteui-angular/grids/core'; import { DefaultSortingStrategy, IgxOverlayOutletDirective, OverlaySettings, SortingDirection } from 'igniteui-angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; @@ -17,13 +17,13 @@ import { FormsModule } from '@angular/forms'; selector: 'app-finjs-grid', templateUrl: './grid-finjs.component.html', styleUrls: ['./grid-finjs.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxGridToolbarActionsComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent, IgxGridToolbarExporterComponent, IgxExcelTextDirective, IgxPdfTextDirective, IgxColumnComponent, IgxCellEditorTemplateDirective, IgxSelectComponent, FormsModule, IgxFocusDirective, IgxSelectItemComponent, IgxCellTemplateDirective, IgxIconComponent, IgxIconButtonDirective, IgxOverlayOutletDirective, AsyncPipe, CurrencyPipe] }) export class GridFinJSComponent implements OnInit { private el = inject(ElementRef); private document = inject(DOCUMENT); private pdfExportService = inject(IgxPdfExporterService); + private cdr = inject(ChangeDetectorRef); dataService = inject(SignalRService); @ViewChild('grid1', { static: true }) public grid: IgxGridComponent; @@ -56,6 +56,7 @@ export class GridFinJSComponent implements OnInit { this.data$.subscribe((data) => { if (data.length !== 0) { this.isLoading = false; + this.cdr.markForCheck(); }; }); diff --git a/projects/app-lob/src/app/grid-finjs/main.component.ts b/projects/app-lob/src/app/grid-finjs/main.component.ts index d2e5011c88..4be09a32a2 100644 --- a/projects/app-lob/src/app/grid-finjs/main.component.ts +++ b/projects/app-lob/src/app/grid-finjs/main.component.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, Component, HostBinding, OnDestroy, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { AfterViewInit, ChangeDetectorRef, Component, HostBinding, OnDestroy, ViewChild, inject } from '@angular/core'; import { Router } from '@angular/router'; import { IgxDialogActionsDirective, IgxDialogComponent, IgxDialogTitleDirective } from 'igniteui-angular/dialog'; import { IgxOverlayOutletDirective, OverlaySettings } from 'igniteui-angular/core'; @@ -12,10 +12,11 @@ import { GridFinJSComponent } from './grid-finjs.component'; selector: 'app-finjs-main', styleUrls: ['./main.component.scss'], templateUrl: './main.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [ControllerComponent, GridFinJSComponent, IgxOverlayOutletDirective, IgxDialogComponent, IgxDialogTitleDirective, IgxCategoryChartModule, IgxDialogActionsDirective, IgxButtonDirective, IgxFocusDirective] }) export class FinJSDemoComponent implements OnDestroy, AfterViewInit { + private cdr = inject(ChangeDetectorRef); + @ViewChild('finGrid', { static: true }) public finGrid: GridFinJSComponent; @ViewChild('controllers', { static: true }) public controller: ControllerComponent; @ViewChild('dialog', { static: true }) public dialog: IgxDialogComponent; @@ -175,6 +176,7 @@ export class FinJSDemoComponent implements OnDestroy, AfterViewInit { this.chartData[0].region + ' Region'; this.dialog.open(); + this.cdr.markForCheck(); }, 200); } diff --git a/projects/app-lob/src/app/grid/grid-boston-marathon/grid.component.ts b/projects/app-lob/src/app/grid/grid-boston-marathon/grid.component.ts index 1657c9c020..b566380c5d 100644 --- a/projects/app-lob/src/app/grid/grid-boston-marathon/grid.component.ts +++ b/projects/app-lob/src/app/grid/grid-boston-marathon/grid.component.ts @@ -1,7 +1,7 @@ -import { Component, HostListener, OnDestroy, OnInit, ViewChild, ElementRef, AfterViewInit, DOCUMENT, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, HostListener, OnDestroy, OnInit, ViewChild, ElementRef, AfterViewInit, DOCUMENT, inject, ChangeDetectorRef } from '@angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; -import { CellType, IgxCellTemplateDirective, IgxColumnComponent, IgxNumberSummaryOperand } from 'igniteui-angular/grids/core'; -import { AbsolutePosition, IgxOverlayService, IgxStringFilteringOperand, IgxSummaryResult, OverlayClosingEventArgs, OverlaySettings } from 'igniteui-angular/core'; +import { CellType, IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; +import { AbsolutePosition, IgxNumberSummaryOperand, IgxOverlayService, IgxStringFilteringOperand, IgxSummaryResult, OverlayClosingEventArgs, OverlaySettings } from 'igniteui-angular/core'; import { IgxSwitchComponent } from 'igniteui-angular/switch'; import { IgxInputDirective, IgxInputGroupComponent } from 'igniteui-angular/input-group'; import { IgxPaginatorComponent } from 'igniteui-angular/paginator'; @@ -18,12 +18,12 @@ import { IgxSparklineCoreModule } from 'igniteui-angular-charts'; selector: 'app-grid', styleUrls: ['./grid.component.scss'], templateUrl: './grid.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSwitchComponent, FormsModule, IgxInputGroupComponent, IgxInputDirective, IgxGridComponent, IgxPreventDocumentScrollDirective, IgxPaginatorComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxAvatarComponent, IgxBadgeComponent, IgxSparklineCoreModule, IgxCircularProgressBarComponent, NgClass, DecimalPipe] }) export class GridComponent implements OnInit, OnDestroy, AfterViewInit { overlayService = inject(IgxOverlayService); private document = inject(DOCUMENT); + private cdr = inject(ChangeDetectorRef); @ViewChild('grid1', { read: IgxGridComponent, static: true }) @@ -60,7 +60,7 @@ export class GridComponent implements OnInit, OnDestroy, AfterViewInit { set live(val: boolean) { this._live = val; if (this._live) { - this._timer = setInterval(() => this.ticker(), 1500); + this.startTicker(); } else { clearInterval(this._timer); } @@ -85,9 +85,10 @@ export class GridComponent implements OnInit, OnDestroy, AfterViewInit { this.localData = АthletesData.slice(0, 30).sort((a, b) => b.TrackProgress - a.TrackProgress); this.localData.forEach(rec => this.getSpeed(rec)); this.windowWidth = this.document.defaultView.innerWidth; - this._timer = setInterval(() => this.ticker(), 1500); + this.startTicker(); this.overlayService.closing.subscribe((event: OverlayClosingEventArgs) => { this.showOverlay = false; + this.cdr.markForCheck(); }); } @@ -230,6 +231,13 @@ export class GridComponent implements OnInit, OnDestroy, AfterViewInit { this.manageRace(); } + private startTicker(): void { + this._timer = setInterval(() => { + this.ticker(); + this.cdr.markForCheck(); + }, 1500); + } + private getRandomNumber(min: number, max: number): number { return Math.round(min + Math.random() * (max - min)); } diff --git a/projects/app-lob/src/app/grid/grid-master-detail/grid-master-detail.component.ts b/projects/app-lob/src/app/grid/grid-master-detail/grid-master-detail.component.ts index a95bdcc4e0..959a0045d3 100644 --- a/projects/app-lob/src/app/grid/grid-master-detail/grid-master-detail.component.ts +++ b/projects/app-lob/src/app/grid/grid-master-detail/grid-master-detail.component.ts @@ -1,10 +1,10 @@ /* eslint-disable @typescript-eslint/naming-convention */ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { IgxColumnComponent, IgxGridDetailTemplateDirective } from 'igniteui-angular/grids/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxTabContentComponent, IgxTabHeaderComponent, IgxTabHeaderLabelDirective, IgxTabItemComponent, IgxTabsComponent } from 'igniteui-angular/tabs'; import { IgxAvatarComponent } from 'igniteui-angular/avatar'; -import { IgxDividerDirective } from 'igniteui-angular/directives'; +import { IgxDividerComponent } from 'igniteui-angular/directives'; import { IgxLegendComponent, IgxPieChartCoreModule, IgxLegendModule, IgxCategoryChartModule } from 'igniteui-angular-charts'; import { employeesData } from '../../data/employeesData'; import { IgxPreventDocumentScrollDirective } from '../../../../../../src/app/directives/prevent-scroll.directive'; @@ -13,8 +13,7 @@ import { IgxPreventDocumentScrollDirective } from '../../../../../../src/app/dir selector: 'app-grid-master-detail', styleUrls: ['./grid-master-detail.component.scss'], templateUrl: 'grid-master-detail.component.html', - changeDetection: ChangeDetectionStrategy.Eager, - imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxGridDetailTemplateDirective, IgxTabsComponent, IgxTabItemComponent, IgxTabHeaderComponent, IgxTabHeaderLabelDirective, IgxTabContentComponent, IgxAvatarComponent, IgxDividerDirective, IgxPieChartCoreModule, IgxLegendModule, IgxCategoryChartModule] + imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxGridDetailTemplateDirective, IgxTabsComponent, IgxTabItemComponent, IgxTabHeaderComponent, IgxTabHeaderLabelDirective, IgxTabContentComponent, IgxAvatarComponent, IgxDividerComponent, IgxPieChartCoreModule, IgxLegendModule, IgxCategoryChartModule] }) export class GridMasterDetailSampleComponent { diff --git a/projects/app-lob/src/app/hierarchical-grid/hierarchical-grid-column-resizing/hierarchical-grid-resizing.component.ts b/projects/app-lob/src/app/hierarchical-grid/hierarchical-grid-column-resizing/hierarchical-grid-resizing.component.ts index be8506e6a3..1654fc816e 100644 --- a/projects/app-lob/src/app/hierarchical-grid/hierarchical-grid-column-resizing/hierarchical-grid-resizing.component.ts +++ b/projects/app-lob/src/app/hierarchical-grid/hierarchical-grid-column-resizing/hierarchical-grid-resizing.component.ts @@ -1,4 +1,4 @@ -import { Component, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, inject } from '@angular/core'; import { IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { RemoteValuesService } from '../../services/remoteValues.service'; @@ -10,7 +10,6 @@ import { IgxSparklineCoreModule } from 'igniteui-angular-charts'; styleUrls: ['./hierarchical-grid-resizing.component.scss'], templateUrl: 'hierarchical-grid-resizing.component.html', providers: [RemoteValuesService], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxSparklineCoreModule, IgxRowIslandComponent] }) diff --git a/projects/app-lob/src/app/home/home.component.ts b/projects/app-lob/src/app/home/home.component.ts index 99f3fc2bcd..efc7d1d38d 100644 --- a/projects/app-lob/src/app/home/home.component.ts +++ b/projects/app-lob/src/app/home/home.component.ts @@ -1,9 +1,8 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; @Component({ selector: 'app-home', styleUrls: ['./home.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, templateUrl: './home.component.html' }) export class HomeComponent { diff --git a/projects/app-lob/src/app/index/docs-layout.component.scss b/projects/app-lob/src/app/index/docs-layout.component.scss index cf86a1df88..8b13789179 100644 --- a/projects/app-lob/src/app/index/docs-layout.component.scss +++ b/projects/app-lob/src/app/index/docs-layout.component.scss @@ -1,6 +1 @@ -::ng-deep { - .custom-body { - color: var(--ig-surface-500-contrast); - background: var(--ig-surface-500); - } -} + diff --git a/projects/app-lob/src/app/index/docs-layout.component.ts b/projects/app-lob/src/app/index/docs-layout.component.ts index a3e41e908c..686d197eba 100644 --- a/projects/app-lob/src/app/index/docs-layout.component.ts +++ b/projects/app-lob/src/app/index/docs-layout.component.ts @@ -1,12 +1,11 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { RouterOutlet } from '@angular/router'; @Component({ selector: 'app-docs-layout', styleUrls: ['./docs-layout.component.scss'], template: ``, - changeDetection: ChangeDetectionStrategy.Eager, imports: [RouterOutlet] }) diff --git a/projects/app-lob/src/app/index/index.component.ts b/projects/app-lob/src/app/index/index.component.ts index 00d5e36aa3..278d05af37 100644 --- a/projects/app-lob/src/app/index/index.component.ts +++ b/projects/app-lob/src/app/index/index.component.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, ChangeDetectorRef, Component, OnInit, ViewChild, DOCUMENT, inject, ChangeDetectionStrategy } from '@angular/core'; +import { AfterViewInit, ChangeDetectorRef, Component, OnInit, ViewChild, DOCUMENT, inject } from '@angular/core'; import { NavigationStart, Route, Router, RouterLinkActive, RouterLink, RouterOutlet } from '@angular/router'; import { IgxNavDrawerItemDirective, IgxNavDrawerTemplateDirective, IgxNavigationDrawerComponent } from 'igniteui-angular/navigation-drawer'; import { IgxFlexDirective, IgxIconButtonDirective, IgxLayoutDirective, IgxRippleDirective } from 'igniteui-angular/directives'; @@ -22,7 +22,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-index', styleUrls: ['./index.component.scss'], templateUrl: './index.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxLayoutDirective, IgxNavigationDrawerComponent, IgxNavDrawerTemplateDirective, IgxNavDrawerItemDirective, IgxRippleDirective, RouterLinkActive, RouterLink, IgxIconButtonDirective, IgxIconComponent, IgxInputGroupComponent, IgxPrefixDirective, FormsModule, IgxInputDirective, IgxSuffixDirective, IgxFlexDirective, IgxNavbarComponent, RouterOutlet] }) export class IndexComponent implements OnInit, AfterViewInit { diff --git a/projects/app-lob/src/app/tree-grid/tree-grid-childdatakey-sample/tree-grid-childdatakey-sample.component.ts b/projects/app-lob/src/app/tree-grid/tree-grid-childdatakey-sample/tree-grid-childdatakey-sample.component.ts index 8c4145e325..0c1bcebd93 100644 --- a/projects/app-lob/src/app/tree-grid/tree-grid-childdatakey-sample/tree-grid-childdatakey-sample.component.ts +++ b/projects/app-lob/src/app/tree-grid/tree-grid-childdatakey-sample/tree-grid-childdatakey-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, inject } from '@angular/core'; import { GridSelectionMode, IgxCSVTextDirective, IgxCellTemplateDirective, IgxColumnComponent, IgxExcelTextDirective, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarExporterComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent, IgxGridToolbarTitleComponent, IColumnExportingEventArgs, IgxCsvExporterService, IgxExcelExporterService } from 'igniteui-angular/grids/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxPaginatorComponent } from 'igniteui-angular/paginator'; @@ -10,7 +10,6 @@ import { IgxSparklineCoreModule } from 'igniteui-angular-charts'; selector: 'app-tree-grid-childdatakey-sample', styleUrls: ['./tree-grid-childdatakey-sample.component.scss'], templateUrl: './tree-grid-childdatakey-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxPaginatorComponent, IgxGridToolbarComponent, IgxGridToolbarTitleComponent, IgxGridToolbarActionsComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent, IgxGridToolbarExporterComponent, IgxExcelTextDirective, IgxCSVTextDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxSparklineCoreModule] }) export class TreeGridChilddatakeySampleComponent implements OnInit { diff --git a/projects/app-lob/src/app/tree-grid/tree-grid-primaryforeignkey-sample/tree-grid-primaryforeignkey-sample.component.ts b/projects/app-lob/src/app/tree-grid/tree-grid-primaryforeignkey-sample/tree-grid-primaryforeignkey-sample.component.ts index cb8b930227..44d0bbce50 100644 --- a/projects/app-lob/src/app/tree-grid/tree-grid-primaryforeignkey-sample/tree-grid-primaryforeignkey-sample.component.ts +++ b/projects/app-lob/src/app/tree-grid/tree-grid-primaryforeignkey-sample/tree-grid-primaryforeignkey-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit } from '@angular/core'; import { GridSelectionMode, IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { Data } from './data'; @@ -9,7 +9,6 @@ import { IgxSparklineCoreModule } from 'igniteui-angular-charts'; selector: 'app-tree-grid-primaryforeignkey-sample', styleUrls: ['./tree-grid-primaryforeignkey-sample.component.scss'], templateUrl: './tree-grid-primaryforeignkey-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxSparklineCoreModule] }) export class TreeGridPrimaryforeignkeySampleComponent implements OnInit { diff --git a/projects/app-lob/src/app/treegrid-finjs/tree-grid-finjs-sample.component.ts b/projects/app-lob/src/app/treegrid-finjs/tree-grid-finjs-sample.component.ts index b832a3ab63..872b272e7e 100644 --- a/projects/app-lob/src/app/treegrid-finjs/tree-grid-finjs-sample.component.ts +++ b/projects/app-lob/src/app/treegrid-finjs/tree-grid-finjs-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, ElementRef, OnInit, OnDestroy, ViewChild, HostBinding, inject, ChangeDetectionStrategy } from '@angular/core'; +import { ChangeDetectorRef, Component, ElementRef, OnInit, OnDestroy, ViewChild, HostBinding, inject } from '@angular/core'; import { AbsoluteScrollStrategy, ConnectedPositioningStrategy, DefaultSortingStrategy, HorizontalAlignment, IGroupingExpression, IgxOverlayOutletDirective, OverlaySettings, PositionSettings, TreeGridFilteringStrategy, VerticalAlignment } from 'igniteui-angular/core'; import { IgxButtonGroupComponent } from 'igniteui-angular/button-group'; import { ITreeGridAggregation, IgxGroupedTreeGridSorting, IgxTreeGridComponent, IgxTreeGridGroupByAreaComponent, IgxTreeGridGroupingPipe } from 'igniteui-angular/grids/tree-grid'; @@ -18,12 +18,12 @@ import { IgxPreventDocumentScrollDirective } from '../../../../../src/app/direct selector: 'app-tree-grid-finjs-sample', styleUrls: ['./tree-grid-finjs-sample.component.scss'], templateUrl: './tree-grid-finjs-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSliderComponent, FormsModule, IgxButtonGroupComponent, IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxGridToolbarActionsComponent, IgxGridToolbarPinningComponent, IgxGridToolbarHidingComponent, IgxGridToolbarExporterComponent, IgxTreeGridGroupByAreaComponent, IgxColumnComponent, IgxCellEditorTemplateDirective, IgxSelectComponent, IgxFocusDirective, IgxSelectItemComponent, IgxCellTemplateDirective, IgxIconComponent, IgxOverlayOutletDirective, AsyncPipe, CurrencyPipe, DatePipe, IgxTreeGridGroupingPipe] }) export class TreeGridFinJSComponent implements OnDestroy, OnInit { private elRef = inject(ElementRef); + private cdr = inject(ChangeDetectorRef); dataService = inject(SignalRService); @ViewChild('grid1', { static: true }) public grid1!: IgxTreeGridComponent; @@ -114,6 +114,7 @@ export class TreeGridFinJSComponent implements OnDestroy, OnInit { this.data$.subscribe((data) => { if (data.length !== 0) { this.isLoading = false; + this.cdr.markForCheck(); }; }); } diff --git a/projects/app-lob/src/environments/environment.ts b/projects/app-lob/src/environments/environment.ts index 30d7bccb19..5dd10dc009 100644 --- a/projects/app-lob/src/environments/environment.ts +++ b/projects/app-lob/src/environments/environment.ts @@ -5,12 +5,3 @@ export const environment = { production: false }; - -/* - * For easier debugging in development mode, you can import the following file - * to ignore zone related error stack frames such as `zone.run`, `zoneDelegate.invokeTask`. - * - * This import should be commented out in production mode because it will have a negative impact - * on performance if an error is thrown. - */ -// import 'zone.js/plugins/zone-error'; // Included with Angular CLI. diff --git a/projects/app-lob/src/main.server.ts b/projects/app-lob/src/main.server.ts index 9c6485729a..fbd3e9dbd7 100644 --- a/projects/app-lob/src/main.server.ts +++ b/projects/app-lob/src/main.server.ts @@ -1,8 +1,7 @@ -import { provideZoneChangeDetection } from "@angular/core"; import { bootstrapApplication, BootstrapContext } from '@angular/platform-browser'; import { AppComponent } from './app/app.component'; import { config } from './app/app.config.server'; -const bootstrap = (context: BootstrapContext) => bootstrapApplication(AppComponent, {...config, providers: [provideZoneChangeDetection(), ...config.providers]}, context); +const bootstrap = (context: BootstrapContext) => bootstrapApplication(AppComponent, config, context); export default bootstrap; diff --git a/projects/app-lob/src/main.ts b/projects/app-lob/src/main.ts index 38bdcd8b53..131aff4bbb 100644 --- a/projects/app-lob/src/main.ts +++ b/projects/app-lob/src/main.ts @@ -1,4 +1,4 @@ -import { enableProdMode, provideZoneChangeDetection } from '@angular/core'; +import { enableProdMode } from '@angular/core'; import { defineCustomElements } from 'igniteui-dockmanager/loader'; @@ -6,11 +6,14 @@ import { environment } from './environments/environment'; import { bootstrapApplication } from '@angular/platform-browser'; import { AppComponent } from './app/app.component'; import { AppConfig } from './app/app.config'; +import { initSampleSizeReporter } from '@shared/sample-size-reporter'; if (environment.production) { enableProdMode(); } -bootstrapApplication(AppComponent, {...AppConfig, providers: [provideZoneChangeDetection(), ...AppConfig.providers]}).catch(err => console.error(err)); +initSampleSizeReporter(); + +bootstrapApplication(AppComponent, AppConfig).catch(err => console.error(err)); defineCustomElements(window); diff --git a/projects/app-lob/src/polyfills.ts b/projects/app-lob/src/polyfills.ts deleted file mode 100644 index 665b7dacbd..0000000000 --- a/projects/app-lob/src/polyfills.ts +++ /dev/null @@ -1,58 +0,0 @@ -/** - * This file includes polyfills needed by Angular and is loaded before the app. - * You can add your own extra polyfills to this file. - * - * This file is divided into 2 sections: - * 1. Browser polyfills. These are applied before loading ZoneJS and are sorted by browsers. - * 2. Application imports. Files imported after ZoneJS that should be loaded before your main - * file. - * - * The current setup is for so-called 'evergreen' browsers; the last versions of browsers that - * automatically update themselves. This includes Safari >= 10, Chrome >= 55 (including Opera), - * Edge >= 13 on the desktop, and iOS 10 and Chrome on mobile. - * - * Learn more in https://angular.io/guide/browser-support - */ - -/*************************************************************************************************** -* BROWSER POLYFILLS -*/ - -//import 'core-js/es7/object'; - -//import 'core-js/es7/array'; // for Array.includes() // Run `npm install --save classlist.js`. - -/** IE10 and IE11 requires the following for the Reflect API. */ -//import 'core-js/es6/reflect'; - -/* Evergreen browsers require these. */ -// Used for reflect-metadata in JIT. If you use AOT (and only Angular decorators), you can remove. -//import 'core-js/es7/reflect'; // Run `npm install --save web-animations-js`. - -/*************************************************************************************************** - * Zone JS is required by Angular itself. - */ -import 'hammerjs/hammer'; -import 'zone.js'; // Included with Angular CLI. - -/*************************************************************************************************** - * @angular/animations polyfill - */ -// if (!Element.prototype.matches) { -// Element.prototype.matches = (Element.prototype as any).msMatchesSelector; -// } - -/*************************************************************************************************** - * APPLICATION IMPORTS - */ - -/** - * Date, currency, decimal and percent pipes. - * Needed for: All but Chrome, Firefox, Edge, IE11 and Safari 10 - */ -// import 'intl'; // Run `npm install --save intl`. -// import 'intl/locale-data/jsonp/de'; -/** - * Need to import at least one locale-data with intl. - */ -// import 'intl/locale-data/jsonp/en'; diff --git a/projects/app-lob/src/styles.scss b/projects/app-lob/src/styles.scss index 52c5a5699a..34c2f20a68 100644 --- a/projects/app-lob/src/styles.scss +++ b/projects/app-lob/src/styles.scss @@ -37,15 +37,6 @@ body { .grid-chart-contextmenu-wrapper { @include fluent-dark-theme($fluent-excel-palette); } - // remove this workaround after resolving https://github.com/IgniteUI/igniteui-angular/issues/13039 - igx-grid, - igx-hierarchical-grid, - igx-pivot-grid, - igx-tree-grid { - --ig-chip-disabled-background: #616161; - --ig-chip-disabled-border-color: #616161; - --ig-chip-disabled-text-color: #BDBDBD; - } } .fin-dark-theme { @include dark-theme($green-palette); diff --git a/projects/app-lob/src/test.ts b/projects/app-lob/src/test.ts index 60f2672410..387b0584a4 100644 --- a/projects/app-lob/src/test.ts +++ b/projects/app-lob/src/test.ts @@ -5,7 +5,6 @@ import { BrowserDynamicTestingModule, platformBrowserDynamicTesting } from '@angular/platform-browser-dynamic/testing'; -import 'zone.js/testing'; // First, initialize the Angular testing environment. getTestBed().initTestEnvironment( diff --git a/projects/app-lob/tsconfig.app.json b/projects/app-lob/tsconfig.app.json index 9cea3a9275..8d95d7d7cb 100644 --- a/projects/app-lob/tsconfig.app.json +++ b/projects/app-lob/tsconfig.app.json @@ -8,7 +8,6 @@ }, "files": [ "src/main.ts", - "src/polyfills.ts", "src/main.server.ts", "src/server.ts" ], diff --git a/projects/app-lob/tsconfig.spec.json b/projects/app-lob/tsconfig.spec.json index bfed18fb6f..a480757653 100644 --- a/projects/app-lob/tsconfig.spec.json +++ b/projects/app-lob/tsconfig.spec.json @@ -8,8 +8,7 @@ ] }, "files": [ - "src/test.ts", - "src/polyfills.ts" + "src/test.ts" ], "include": [ "src/**/*.spec.ts", diff --git a/src/app/app.component.ts b/src/app/app.component.ts index bb3ccc95d3..1046547447 100644 --- a/src/app/app.component.ts +++ b/src/app/app.component.ts @@ -1,12 +1,11 @@ -import { Component, HostListener, OnInit, DOCUMENT, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, HostListener, OnInit, DOCUMENT, inject } from '@angular/core'; import { RouterOutlet } from '@angular/router'; @Component({ selector: 'app-root', styleUrls: ['./app.component.scss'], templateUrl: './app.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [RouterOutlet] }) export class AppComponent implements OnInit { diff --git a/src/app/data-display/badge/badge-dot-sample/badge-dot-sample.component.html b/src/app/data-display/badge/badge-dot-sample/badge-dot-sample.component.html deleted file mode 100644 index 798c7e17ae..0000000000 --- a/src/app/data-display/badge/badge-dot-sample/badge-dot-sample.component.html +++ /dev/null @@ -1,4 +0,0 @@ -
- - -
diff --git a/src/app/data-display/badge/badge-dot-sample/badge-dot-sample.component.scss b/src/app/data-display/badge/badge-dot-sample/badge-dot-sample.component.scss deleted file mode 100644 index da1d082f57..0000000000 --- a/src/app/data-display/badge/badge-dot-sample/badge-dot-sample.component.scss +++ /dev/null @@ -1,17 +0,0 @@ -.wrapper { - display: flex; - position: relative; - margin: 15px 0 0 15px; - - igx-avatar { - anchor-name: --avatar; - } - - igx-badge { - position: absolute; - position-anchor: --avatar; - bottom: anchor(--avatar top); - left: anchor(right); - transform: translate(-75%, 75%); - } -} diff --git a/src/app/data-display/badge/badge-dot-sample/badge-dot-sample.component.ts b/src/app/data-display/badge/badge-dot-sample/badge-dot-sample.component.ts deleted file mode 100644 index 3459cb7d44..0000000000 --- a/src/app/data-display/badge/badge-dot-sample/badge-dot-sample.component.ts +++ /dev/null @@ -1,12 +0,0 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; -import { IgxAvatarComponent } from 'igniteui-angular/avatar'; -import { IgxBadgeComponent } from 'igniteui-angular/badge'; - -@Component({ - selector: 'app-badge-dot-sample', - styleUrls: ['./badge-dot-sample.component.scss'], - templateUrl: './badge-dot-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, - imports: [IgxAvatarComponent, IgxBadgeComponent] -}) -export class BadgeDotSampleComponent { } diff --git a/src/app/data-display/badge/badge-dot/badge-dot.component.html b/src/app/data-display/badge/badge-dot/badge-dot.component.html new file mode 100644 index 0000000000..4c41e83e12 --- /dev/null +++ b/src/app/data-display/badge/badge-dot/badge-dot.component.html @@ -0,0 +1,44 @@ + + + + +
+ @for (item of notifications; track item.title) { +
+ + @if (item.unread) { + + } + + {{ item.title }} + {{ item.time }} + chevron_right +
+ } +
+ + + + + +
+ @for (tab of tabs; track tab.label) { +
+ + + @if (tab.hasUpdates) { + + } + + {{ tab.label }} +
+ } +
diff --git a/src/app/data-display/badge/badge-dot/badge-dot.component.scss b/src/app/data-display/badge/badge-dot/badge-dot.component.scss new file mode 100644 index 0000000000..db1defa585 --- /dev/null +++ b/src/app/data-display/badge/badge-dot/badge-dot.component.scss @@ -0,0 +1,115 @@ +@use "sass:list"; +@use "igniteui-theming/sass/typography" as *; + +:host { + --sample-accent: #0057a9; + + display: grid; + grid-auto-flow: column; + place-content: center; + place-items: center; + column-gap: rem(40px); + min-height: 8.5rem; +} + +igx-badge { + --ig-size: var(--ig-size-small); + + position: absolute; + inset-block-start: anchor(14.5%); + inset-inline-start: anchor(85.5%); + translate: -50% -50%; +} + +$anchors: icon, avatar; + +@each $anchor in $anchors { + $i: list.index($anchors, $anchor); + + .#{$anchor}-anchor { + anchor-name: --#{$anchor}; + } + + :host > igx-badge:nth-of-type(#{$i}) { + position-anchor: --#{$anchor}; + } +} + +.notifications-card, +.nav-card { + background: var(--ig-surface-500); + border-radius: rem(4px); + box-shadow: 0 rem(1px) rem(3px) hsl(from var(--ig-gray-900) h s l / 0.12); +} + +.notifications-card { + min-width: rem(270px); + padding-block: rem(8px); +} + +.notification-row { + @include type-style("body-2") { + margin: 0; + } + + display: flex; + align-items: center; + gap: rem(8px); + padding: rem(8px) rem(12px); + color: var(--ig-gray-900); +} + +.row-indicator { + display: inline-flex; + justify-content: center; + width: rem(12px); +} + +.row-title { + flex: 1; +} + +.unread { + color: var(--sample-accent); + font-weight: 600; +} + +.row-chevron { + color: var(--ig-gray-600); + font-size: rem(18px); +} + +.nav-card { + display: flex; + align-items: center; + gap: rem(8px); + padding: rem(8px) rem(12px); +} + +.nav-item { + @include type-style("caption") { + margin: 0; + } + + display: flex; + flex-direction: column; + align-items: center; + gap: rem(4px); + min-width: rem(56px); + color: var(--ig-gray-700); + + &.active { + color: var(--sample-accent); + } +} + +.nav-icon { + position: relative; + display: inline-flex; + + igx-badge { + position: absolute; + inset-block: rem(-2px) auto; + inset-inline: auto rem(-6px); + } +} diff --git a/src/app/data-display/badge/badge-dot/badge-dot.component.ts b/src/app/data-display/badge/badge-dot/badge-dot.component.ts new file mode 100644 index 0000000000..ed27a1e9ac --- /dev/null +++ b/src/app/data-display/badge/badge-dot/badge-dot.component.ts @@ -0,0 +1,28 @@ +import { Component } from '@angular/core'; +import { IgxAvatarComponent } from 'igniteui-angular/avatar'; +import { IgxBadgeComponent } from 'igniteui-angular/badge'; +import { IgxIconComponent, IgxIconService} from 'igniteui-angular/icon'; +import { facebookMessenger } from '@igniteui/material-icons-extended'; + +@Component({ + selector: 'app-badge-dot', + styleUrls: ['./badge-dot.component.scss'], + templateUrl: './badge-dot.component.html', + imports: [IgxAvatarComponent, IgxBadgeComponent, IgxIconComponent] +}) +export class BadgeDotComponent { + constructor(private iconService: IgxIconService) { + this.iconService.addSvgIconFromText('facebookMessenger', facebookMessenger.value); + } + + public notifications = [ + { title: 'Contract renewal', time: '09:12', unread: true }, + { title: 'Weekly digest', time: 'Yesterday', unread: false } + ]; + + public tabs = [ + { label: 'Home', icon: 'home', active: true, hasUpdates: false }, + { label: 'Chat', icon: 'facebookMessenger', active: false, hasUpdates: true }, + { label: 'Profile', icon: 'person', active: false, hasUpdates: false } + ]; +} diff --git a/src/app/data-display/badge/badge-icon/badge-icon.component.html b/src/app/data-display/badge/badge-icon/badge-icon.component.html index 3969983d30..42124e3c63 100644 --- a/src/app/data-display/badge/badge-icon/badge-icon.component.html +++ b/src/app/data-display/badge/badge-icon/badge-icon.component.html @@ -1,4 +1,8 @@ -
- - -
\ No newline at end of file +@for (item of badges; track item.label) { + + {{ item.label }} +} + + + +on avatar diff --git a/src/app/data-display/badge/badge-icon/badge-icon.component.scss b/src/app/data-display/badge/badge-icon/badge-icon.component.scss index dbb6d9c2b7..5dccea83e4 100644 --- a/src/app/data-display/badge/badge-icon/badge-icon.component.scss +++ b/src/app/data-display/badge/badge-icon/badge-icon.component.scss @@ -1,10 +1,44 @@ -.wrapper { - position: relative; - margin: 15px 0 0 15px; +@use "igniteui-theming/sass/typography" as *; + +:host { + display: grid; + grid-auto-flow: column; + grid-template-rows: auto auto; + place-content: center; + place-items: center; + column-gap: rem(40px); + row-gap: rem(10px); + min-height: 8.5rem; + padding: rem(32px); +} + +igx-avatar { + grid-row: 1; + anchor-name: --avatar; } igx-badge { - position: absolute; - bottom: 0; - left: 28px; + --ig-size: var(--ig-size-medium); + + grid-row: 1; +} + +span { + @include type-style("body-2") { + margin: 0; + } + + grid-row: 2; + text-align: center; + color: var(--ig-gray-700); +} + +igx-badge:last-of-type { + --ig-size: var(--ig-size-small); + + position: absolute; + position-anchor: --avatar; + inset-block-start: anchor(14.5%); + inset-inline-start: anchor(85.5%); + translate: -50% -50%; } diff --git a/src/app/data-display/badge/badge-icon/badge-icon.component.ts b/src/app/data-display/badge/badge-icon/badge-icon.component.ts index fd41beb127..c169696772 100644 --- a/src/app/data-display/badge/badge-icon/badge-icon.component.ts +++ b/src/app/data-display/badge/badge-icon/badge-icon.component.ts @@ -1,6 +1,4 @@ -import { Component, OnInit, inject, ChangeDetectionStrategy } from '@angular/core'; -import { heartMonitor } from '@igniteui/material-icons-extended'; -import { IgxIconService } from 'igniteui-angular/icon'; +import { Component } from '@angular/core'; import { IgxAvatarComponent } from 'igniteui-angular/avatar'; import { IgxBadgeComponent } from 'igniteui-angular/badge'; @@ -8,14 +6,14 @@ import { IgxBadgeComponent } from 'igniteui-angular/badge'; selector: 'app-badge-icon', styleUrls: ['./badge-icon.component.scss'], templateUrl: './badge-icon.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxAvatarComponent, IgxBadgeComponent] }) -export class BadgeIconComponent implements OnInit { - protected _iconService = inject(IgxIconService); - - - public ngOnInit() { - this._iconService.addSvgIconFromText(heartMonitor.name, heartMonitor.value, 'imx-icons'); - } +export class BadgeIconComponent { + public badges = [ + { icon: 'check', type: 'success', label: 'check' }, + { icon: 'favorite_border', type: 'error', label: 'favorite' }, + { icon: 'notifications', type: 'info', label: 'notification' }, + { icon: 'star_border', type: 'warning', label: 'star' }, + { icon: 'settings', type: 'info', label: 'settings' } + ]; } diff --git a/src/app/data-display/badge/badge-outlined/badge-outlined.component.html b/src/app/data-display/badge/badge-outlined/badge-outlined.component.html index 3a7e6f397a..58333b1d63 100644 --- a/src/app/data-display/badge/badge-outlined/badge-outlined.component.html +++ b/src/app/data-display/badge/badge-outlined/badge-outlined.component.html @@ -1,7 +1,18 @@ -
-
- - -
- Terrance Orta -
+ + + + + + + + @for (step of steps; track step.label) { + + + {{ step.index }} + {{ step.label }} + + } + + + diff --git a/src/app/data-display/badge/badge-outlined/badge-outlined.component.scss b/src/app/data-display/badge/badge-outlined/badge-outlined.component.scss index 21db08ffe6..7f7ef73214 100644 --- a/src/app/data-display/badge/badge-outlined/badge-outlined.component.scss +++ b/src/app/data-display/badge/badge-outlined/badge-outlined.component.scss @@ -1,33 +1,66 @@ +@use "sass:list"; +@use "igniteui-theming/sass" as *; + :host { - display: block; - padding-inline: 1rem; -} + display: grid; + grid-auto-flow: column; + place-content: center; + place-items: center; + column-gap: rem(60px); + min-height: 7rem; + padding-inline: rem(16px); -.wrapper { - position: relative; - display: flex; - align-items: center; - margin-block: 1rem; - width: fit-content; - padding: 0.5rem; - gap: 0.5rem; - border: 1px solid var(--ig-gray-300); - border-radius: .25rem; + ::ng-deep { + // NOTE! This is just for the sake of the sample, don't do this in your app. + // The stepper body is where the content for each step goes, and it should be visible. + // This sample doesn't have any content, so we hide it to avoid the empty space. + .igx-stepper__body { + display: none; + } + } } -igx-avatar { - anchor-name: --avatar; +.icon-anchor { + --ig-avatar-background: #{color($color: gray, $variant: 900, $opacity: 0.08)}; } igx-badge { - --size: 1rem; + --ig-size: var(--ig-size-small); + + position: absolute; + inset-block-start: anchor(14.5%); + inset-inline-start: anchor(85.5%); + translate: -50% -50%; + + &:nth-of-type(2) { + inset-block-start: anchor(85.5%); + } +} + +$anchors: icon, initials, flagged; + +@each $anchor in $anchors { + $i: list.index($anchors, $anchor); + + .#{$anchor}-anchor { + anchor-name: --#{$anchor}; + } + + :host > igx-badge:nth-of-type(#{$i}) { + position-anchor: --#{$anchor}; + } +} + +igx-stepper { + --ig-stepper-step-separator-style: dashed; + --ig-stepper-step-separator-color: var(--ig-gray-400); - position: absolute; - inset-block-end: anchor(--avatar bottom); - inset-inline-end: anchor(--avatar right); + max-width: rem(316px); } -span { - display: block; - font-weight: 600; +span[igxStepIndicator] { + display: grid; + place-items: center; + inline-size: 100%; + block-size: 100%; } diff --git a/src/app/data-display/badge/badge-outlined/badge-outlined.component.ts b/src/app/data-display/badge/badge-outlined/badge-outlined.component.ts index 5f99c356b5..226ce9c10b 100644 --- a/src/app/data-display/badge/badge-outlined/badge-outlined.component.ts +++ b/src/app/data-display/badge/badge-outlined/badge-outlined.component.ts @@ -1,12 +1,19 @@ import { Component } from '@angular/core'; import { IgxAvatarComponent } from 'igniteui-angular/avatar'; import { IgxBadgeComponent } from 'igniteui-angular/badge'; +import { IGX_STEPPER_DIRECTIVES } from 'igniteui-angular/stepper'; @Component({ selector: 'app-badge-outlined', styleUrls: ['./badge-outlined.component.scss'], templateUrl: './badge-outlined.component.html', - imports: [IgxAvatarComponent, IgxBadgeComponent] + imports: [IgxAvatarComponent, IgxBadgeComponent, IGX_STEPPER_DIRECTIVES] }) -export class BadgeOutlinedComponent { } +export class BadgeOutlinedComponent { + public steps = [ + { index: 1, label: 'Orders', completed: true, active: false, flagged: false }, + { index: 2, label: 'Payment', completed: false, active: true, flagged: true }, + { index: 3, label: 'Shipping', completed: false, active: false, flagged: false } + ]; +} diff --git a/src/app/data-display/badge/badge-overview/badge-overview.component.html b/src/app/data-display/badge/badge-overview/badge-overview.component.html new file mode 100644 index 0000000000..17daa533f4 --- /dev/null +++ b/src/app/data-display/badge/badge-overview/badge-overview.component.html @@ -0,0 +1,16 @@ + + + + +mail + + +Events + + +notifications + diff --git a/src/app/data-display/badge/badge-overview/badge-overview.component.scss b/src/app/data-display/badge/badge-overview/badge-overview.component.scss new file mode 100644 index 0000000000..51d1079d55 --- /dev/null +++ b/src/app/data-display/badge/badge-overview/badge-overview.component.scss @@ -0,0 +1,47 @@ +@use "sass:list"; +@use "igniteui-theming/sass/typography" as *; + +:host { + display: grid; + grid-auto-flow: column; + place-content: center; + place-items: center; + column-gap: rem(60px); + min-height: 7rem; +} + +igx-icon { + color: var(--ig-gray-700); + font-size: rem(24px); +} + +igx-chip { + --ig-size: var(--ig-size-large); +} + +igx-badge { + --ig-size: var(--ig-size-small); + + position: absolute; + inset-block-start: anchor(10%); + inset-inline-start: anchor(85.5%); + translate: -50% -50%; +} + +igx-badge:nth-of-type(1) { + inset-block-start: anchor(85.5%); +} + +$anchors: avatar, mail, events, notifications; + +@each $anchor in $anchors { + $i: list.index($anchors, $anchor); + + .#{$anchor}-anchor { + anchor-name: --#{$anchor}; + } + + igx-badge:nth-of-type(#{$i}) { + position-anchor: --#{$anchor}; + } +} diff --git a/src/app/data-display/badge/badge-overview/badge-overview.component.ts b/src/app/data-display/badge/badge-overview/badge-overview.component.ts new file mode 100644 index 0000000000..73ed64752d --- /dev/null +++ b/src/app/data-display/badge/badge-overview/badge-overview.component.ts @@ -0,0 +1,13 @@ +import { Component } from '@angular/core'; +import { IgxAvatarComponent } from 'igniteui-angular/avatar'; +import { IgxBadgeComponent } from 'igniteui-angular/badge'; +import { IgxChipComponent } from 'igniteui-angular/chips'; +import { IgxIconComponent } from 'igniteui-angular/icon'; + +@Component({ + selector: 'app-badge-overview', + templateUrl: './badge-overview.component.html', + styleUrls: ['./badge-overview.component.scss'], + imports: [IgxAvatarComponent, IgxBadgeComponent, IgxChipComponent, IgxIconComponent] +}) +export class BadgeOverviewComponent { } diff --git a/src/app/data-display/badge/badge-sample-2/badge-sample-2.component.html b/src/app/data-display/badge/badge-sample-2/badge-sample-2.component.html deleted file mode 100644 index 2e629a9a69..0000000000 --- a/src/app/data-display/badge/badge-sample-2/badge-sample-2.component.html +++ /dev/null @@ -1,4 +0,0 @@ -
- - -
diff --git a/src/app/data-display/badge/badge-sample-2/badge-sample-2.component.scss b/src/app/data-display/badge/badge-sample-2/badge-sample-2.component.scss deleted file mode 100644 index dbb6d9c2b7..0000000000 --- a/src/app/data-display/badge/badge-sample-2/badge-sample-2.component.scss +++ /dev/null @@ -1,10 +0,0 @@ -.wrapper { - position: relative; - margin: 15px 0 0 15px; -} - -igx-badge { - position: absolute; - bottom: 0; - left: 28px; -} diff --git a/src/app/data-display/badge/badge-sample-2/badge-sample-2.component.ts b/src/app/data-display/badge/badge-sample-2/badge-sample-2.component.ts deleted file mode 100644 index 3f22d52960..0000000000 --- a/src/app/data-display/badge/badge-sample-2/badge-sample-2.component.ts +++ /dev/null @@ -1,12 +0,0 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; -import { IgxAvatarComponent } from 'igniteui-angular/avatar'; -import { IgxBadgeComponent } from 'igniteui-angular/badge'; - -@Component({ - selector: 'app-badge-sample-2', - styleUrls: ['./badge-sample-2.component.scss'], - templateUrl: './badge-sample-2.component.html', - changeDetection: ChangeDetectionStrategy.Eager, - imports: [IgxAvatarComponent, IgxBadgeComponent] -}) -export class BadgeSample2Component { } diff --git a/src/app/data-display/badge/badge-sample-3/badge-sample-3.component.html b/src/app/data-display/badge/badge-sample-3/badge-sample-3.component.html deleted file mode 100644 index 36c6a560c2..0000000000 --- a/src/app/data-display/badge/badge-sample-3/badge-sample-3.component.html +++ /dev/null @@ -1,18 +0,0 @@ - - - Team Members (4) - - @for (member of members; track member) { - -
-
- - -
-
- {{ member.name }} -
-
- - } - diff --git a/src/app/data-display/badge/badge-sample-3/badge-sample-3.component.scss b/src/app/data-display/badge/badge-sample-3/badge-sample-3.component.scss deleted file mode 100644 index c5aee48558..0000000000 --- a/src/app/data-display/badge/badge-sample-3/badge-sample-3.component.scss +++ /dev/null @@ -1,18 +0,0 @@ -.wrapper { - display: flex; - flex-direction: row; -} - -.contact-name { - font-weight: 600; -} - -.contact-container { - margin-left: 20px; -} - -.badge-style { - position: absolute; - bottom: 2.5px; - left: 40px; -} diff --git a/src/app/data-display/badge/badge-sample-3/badge-sample-3.component.ts b/src/app/data-display/badge/badge-sample-3/badge-sample-3.component.ts deleted file mode 100644 index 446dc994dd..0000000000 --- a/src/app/data-display/badge/badge-sample-3/badge-sample-3.component.ts +++ /dev/null @@ -1,22 +0,0 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; -import { Member } from '../model/member.model'; -import { IgxListComponent, IgxListItemComponent } from 'igniteui-angular/list'; -import { IgxAvatarComponent } from 'igniteui-angular/avatar'; -import { IgxBadgeComponent } from 'igniteui-angular/badge'; - - -@Component({ - selector: 'app-badge-sample-3', - styleUrls: ['./badge-sample-3.component.scss'], - templateUrl: './badge-sample-3.component.html', - changeDetection: ChangeDetectionStrategy.Eager, - imports: [IgxListComponent, IgxListItemComponent, IgxAvatarComponent, IgxBadgeComponent] -}) -export class BadgeSample3Component { - public members: Member[] = [ - new Member('Terrance Orta', 'online'), - new Member('Donna Price', 'online'), - new Member('Lisa Landers', 'away'), - new Member('Dorothy H. Spencer', 'offline') - ]; -} diff --git a/src/app/data-display/badge/badge-shape/badge-shape.component.html b/src/app/data-display/badge/badge-shape/badge-shape.component.html new file mode 100644 index 0000000000..63a34447df --- /dev/null +++ b/src/app/data-display/badge/badge-shape/badge-shape.component.html @@ -0,0 +1,9 @@ +Rounded + + + + +Square + + + diff --git a/src/app/data-display/badge/badge-shape/badge-shape.component.scss b/src/app/data-display/badge/badge-shape/badge-shape.component.scss new file mode 100644 index 0000000000..8e7dfd50b4 --- /dev/null +++ b/src/app/data-display/badge/badge-shape/badge-shape.component.scss @@ -0,0 +1,31 @@ +@use "sass:list"; +@use "igniteui-theming/sass/typography" as *; + +:host { + display: grid; + grid-template-columns: rem(80px) rem(40px) rem(40px) rem(40px); + place-content: center; + place-items: center; + column-gap: rem(8px); + row-gap: rem(40px); + min-height: 8.5rem; +} + +span { + justify-self: end; + color: var(--ig-gray-700); + + @include type-style("body-2") { + margin: 0; + } +} + +$sizes: small, medium, large; + +@each $size in $sizes { + $i: list.index($sizes, $size); + + igx-badge:nth-of-type(3n + #{$i}) { + --ig-size: var(--ig-size-#{$size}); + } +} diff --git a/src/app/data-display/badge/badge-shape/badge-shape.component.ts b/src/app/data-display/badge/badge-shape/badge-shape.component.ts new file mode 100644 index 0000000000..cd0b71b0e9 --- /dev/null +++ b/src/app/data-display/badge/badge-shape/badge-shape.component.ts @@ -0,0 +1,10 @@ +import { Component } from '@angular/core'; +import { IgxBadgeComponent } from 'igniteui-angular/badge'; + +@Component({ + selector: 'app-badge-shape', + templateUrl: './badge-shape.component.html', + styleUrls: ['./badge-shape.component.scss'], + imports: [IgxBadgeComponent] +}) +export class BadgeShapeComponent { } diff --git a/src/app/data-display/badge/badge-size/badge-size.component.html b/src/app/data-display/badge/badge-size/badge-size.component.html new file mode 100644 index 0000000000..87db132a2e --- /dev/null +++ b/src/app/data-display/badge/badge-size/badge-size.component.html @@ -0,0 +1,14 @@ +Small + + + + +Medium + + + + +Large + + + diff --git a/src/app/data-display/badge/badge-size/badge-size.component.scss b/src/app/data-display/badge/badge-size/badge-size.component.scss new file mode 100644 index 0000000000..bdedf7a51b --- /dev/null +++ b/src/app/data-display/badge/badge-size/badge-size.component.scss @@ -0,0 +1,31 @@ +@use "sass:list"; +@use "igniteui-theming/sass/typography" as *; + +:host { + display: grid; + grid-template-columns: rem(80px) rem(32px) rem(40px) rem(40px); + place-content: center; + place-items: center; + column-gap: rem(8px); + row-gap: rem(40px); + padding: rem(32px); +} + +span { + justify-self: end; + color: var(--ig-gray-700); + + @include type-style("body-2") { + margin: 0; + } +} + +$sizes: small, medium, large; + +@each $size in $sizes { + $i: list.index($sizes, $size); + + igx-badge:nth-of-type(n + #{($i - 1) * 3 + 1}):nth-of-type(-n + #{$i * 3}) { + --ig-size: var(--ig-size-#{$size}); + } +} diff --git a/src/app/data-display/badge/badge-size/badge-size.component.ts b/src/app/data-display/badge/badge-size/badge-size.component.ts new file mode 100644 index 0000000000..47e1c14c93 --- /dev/null +++ b/src/app/data-display/badge/badge-size/badge-size.component.ts @@ -0,0 +1,10 @@ +import { Component } from '@angular/core'; +import { IgxBadgeComponent } from 'igniteui-angular/badge'; + +@Component({ + selector: 'app-badge-size', + templateUrl: './badge-size.component.html', + styleUrls: ['./badge-size.component.scss'], + imports: [IgxBadgeComponent] +}) +export class BadgeSizeComponent { } diff --git a/src/app/data-display/badge/badge-styling-sample/badge-styling-sample.component.html b/src/app/data-display/badge/badge-styling-sample/badge-styling-sample.component.html deleted file mode 100644 index 18cf6c5468..0000000000 --- a/src/app/data-display/badge/badge-styling-sample/badge-styling-sample.component.html +++ /dev/null @@ -1,18 +0,0 @@ - - - Team Members (4) - - @for (member of members; track member) { - -
-
- - -
-
- {{ member.name }} -
-
- - } - diff --git a/src/app/data-display/badge/badge-styling-sample/badge-styling-sample.component.scss b/src/app/data-display/badge/badge-styling-sample/badge-styling-sample.component.scss deleted file mode 100644 index e0a0507010..0000000000 --- a/src/app/data-display/badge/badge-styling-sample/badge-styling-sample.component.scss +++ /dev/null @@ -1,11 +0,0 @@ -@use "layout.scss"; -@use "igniteui-angular/theming" as *; - -$custom-badge-theme: badge-theme( - $background-color: #57a5cd, - $border-radius: 4px -); - -:host { - @include tokens($custom-badge-theme); -} diff --git a/src/app/data-display/badge/badge-styling-sample/badge-styling-sample.component.ts b/src/app/data-display/badge/badge-styling-sample/badge-styling-sample.component.ts deleted file mode 100644 index 55b522e709..0000000000 --- a/src/app/data-display/badge/badge-styling-sample/badge-styling-sample.component.ts +++ /dev/null @@ -1,22 +0,0 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; -import { Member } from '../model/member.model'; -import { IgxListComponent, IgxListItemComponent } from 'igniteui-angular/list'; -import { IgxAvatarComponent } from 'igniteui-angular/avatar'; -import { IgxBadgeComponent } from 'igniteui-angular/badge'; - - -@Component({ - selector: 'app-badge-styling-sample', - styleUrls: ['./badge-styling-sample.component.scss'], - templateUrl: './badge-styling-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, - imports: [IgxListComponent, IgxListItemComponent, IgxAvatarComponent, IgxBadgeComponent] -}) -export class BadgeStylingSampleComponent { - public members: Member[] = [ - new Member('Terrance Orta', 'online'), - new Member('Donna Price', 'online'), - new Member('Lisa Landers', 'away'), - new Member('Dorothy H. Spencer', 'offline') - ]; -} diff --git a/src/app/data-display/badge/badge-styling-sample/layout.scss b/src/app/data-display/badge/badge-styling-sample/layout.scss deleted file mode 100644 index cee5eb7fb1..0000000000 --- a/src/app/data-display/badge/badge-styling-sample/layout.scss +++ /dev/null @@ -1,18 +0,0 @@ -.wrapper { - display: flex; - flex-direction: row; - } - - .contact-name { - font-weight: 600; - } - - .contact-container{ - margin-left: 20px; - } - - .badge-style { - position: absolute; - bottom: 2.5px; - left: 40px; - } \ No newline at end of file diff --git a/src/app/data-display/badge/badge-styling/badge-styling.component.html b/src/app/data-display/badge/badge-styling/badge-styling.component.html new file mode 100644 index 0000000000..813d595017 --- /dev/null +++ b/src/app/data-display/badge/badge-styling/badge-styling.component.html @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/src/app/data-display/badge/badge-styling/badge-styling.component.scss b/src/app/data-display/badge/badge-styling/badge-styling.component.scss new file mode 100644 index 0000000000..29d0b71694 --- /dev/null +++ b/src/app/data-display/badge/badge-styling/badge-styling.component.scss @@ -0,0 +1,52 @@ +@use "sass:list"; +@use "sass:map"; +@use "igniteui-theming/sass/typography" as *; + +:host { + display: grid; + grid-auto-flow: column; + place-content: center; + place-items: center; + column-gap: rem(60px); + min-height: 7rem; +} + +igx-badge { + --ig-size: var(--ig-size-small); + + position: absolute; + inset-block-start: anchor(85.5%); + inset-inline-start: anchor(85.5%); + translate: -50% -50%; +} + +.avatar-green { + --ig-avatar-background: var(--ig-success-200); + --ig-avatar-icon-color: var(--ig-success-700); +} + +.avatar-pink { + --ig-avatar-background: #da64ff; + --ig-avatar-icon-color: var(--ig-gray-50); +} + +$badges: ( + teal: var(--ig-success-700), + amber: #c97c00, + magenta: #9c27b0, + lime: var(--ig-success-700), +); + +@each $name, $color in $badges { + $i: list.index(map.keys($badges), $name); + + igx-avatar:nth-of-type(#{$i}) { + anchor-name: --#{$name}; + } + + .badge-#{$name} { + --ig-badge-background-color: #{$color}; + + position-anchor: --#{$name}; + } +} diff --git a/src/app/data-display/badge/badge-styling/badge-styling.component.ts b/src/app/data-display/badge/badge-styling/badge-styling.component.ts new file mode 100644 index 0000000000..d3d2d150d1 --- /dev/null +++ b/src/app/data-display/badge/badge-styling/badge-styling.component.ts @@ -0,0 +1,12 @@ +import { Component } from '@angular/core'; +import { IgxAvatarComponent } from 'igniteui-angular/avatar'; +import { IgxBadgeComponent } from 'igniteui-angular/badge'; + + +@Component({ + selector: 'app-badge-styling', + styleUrls: ['./badge-styling.component.scss'], + templateUrl: './badge-styling.component.html', + imports: [IgxAvatarComponent, IgxBadgeComponent] +}) +export class BadgeStylingComponent { } diff --git a/src/app/data-display/badge/badge-tailwind-styling-sample/badge-tailwind-styling-sample.component.html b/src/app/data-display/badge/badge-tailwind-styling-sample/badge-tailwind-styling-sample.component.html deleted file mode 100644 index edceb81ace..0000000000 --- a/src/app/data-display/badge/badge-tailwind-styling-sample/badge-tailwind-styling-sample.component.html +++ /dev/null @@ -1,18 +0,0 @@ - - - Team Members (4) - - @for (member of members; track member) { - -
-
- - -
-
- {{ member.name }} -
-
- - } - diff --git a/src/app/data-display/badge/badge-tailwind-styling-sample/badge-tailwind-styling-sample.component.scss b/src/app/data-display/badge/badge-tailwind-styling-sample/badge-tailwind-styling-sample.component.scss deleted file mode 100644 index a60d456faa..0000000000 --- a/src/app/data-display/badge/badge-tailwind-styling-sample/badge-tailwind-styling-sample.component.scss +++ /dev/null @@ -1 +0,0 @@ -@use "layout.scss"; diff --git a/src/app/data-display/badge/badge-tailwind-styling-sample/badge-tailwind-styling-sample.component.ts b/src/app/data-display/badge/badge-tailwind-styling-sample/badge-tailwind-styling-sample.component.ts deleted file mode 100644 index 394ebbcc88..0000000000 --- a/src/app/data-display/badge/badge-tailwind-styling-sample/badge-tailwind-styling-sample.component.ts +++ /dev/null @@ -1,22 +0,0 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; -import { Member } from '../model/member.model'; -import { IgxListComponent, IgxListItemComponent } from 'igniteui-angular/list'; -import { IgxAvatarComponent } from 'igniteui-angular/avatar'; -import { IgxBadgeComponent } from 'igniteui-angular/badge'; - - -@Component({ - selector: 'app-badge-tailwind-styling-sample', - styleUrls: ['./badge-tailwind-styling-sample.component.scss'], - templateUrl: './badge-tailwind-styling-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, - imports: [IgxListComponent, IgxListItemComponent, IgxAvatarComponent, IgxBadgeComponent] -}) -export class BadgeTailwindStylingSampleComponent { - public members: Member[] = [ - new Member('Terrance Orta', 'online'), - new Member('Donna Price', 'online'), - new Member('Lisa Landers', 'away'), - new Member('Dorothy H. Spencer', 'offline') - ]; -} diff --git a/src/app/data-display/badge/badge-tailwind-styling-sample/layout.scss b/src/app/data-display/badge/badge-tailwind-styling-sample/layout.scss deleted file mode 100644 index cee5eb7fb1..0000000000 --- a/src/app/data-display/badge/badge-tailwind-styling-sample/layout.scss +++ /dev/null @@ -1,18 +0,0 @@ -.wrapper { - display: flex; - flex-direction: row; - } - - .contact-name { - font-weight: 600; - } - - .contact-container{ - margin-left: 20px; - } - - .badge-style { - position: absolute; - bottom: 2.5px; - left: 40px; - } \ No newline at end of file diff --git a/src/app/data-display/badge/badge-tailwind-styling/badge-tailwind-styling.component.html b/src/app/data-display/badge/badge-tailwind-styling/badge-tailwind-styling.component.html new file mode 100644 index 0000000000..7e83c97fb5 --- /dev/null +++ b/src/app/data-display/badge/badge-tailwind-styling/badge-tailwind-styling.component.html @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/src/app/data-display/badge/badge-tailwind-styling/badge-tailwind-styling.component.scss b/src/app/data-display/badge/badge-tailwind-styling/badge-tailwind-styling.component.scss new file mode 100644 index 0000000000..b44ac48cc3 --- /dev/null +++ b/src/app/data-display/badge/badge-tailwind-styling/badge-tailwind-styling.component.scss @@ -0,0 +1,34 @@ +@use "sass:list"; +@use "igniteui-theming/sass/typography" as *; + +$anchors: close, volume, remove, check; + +:host { + display: grid; + grid-auto-flow: column; + place-content: center; + place-items: center; + column-gap: rem(48px); + min-height: 7rem; +} + +igx-badge { + --ig-size: var(--ig-size-small); + + position: absolute; + inset-block-start: anchor(85.5%); + inset-inline-start: anchor(85.5%); + translate: -50% -50%; +} + +@each $anchor in $anchors { + $i: list.index($anchors, $anchor); + + igx-avatar:nth-of-type(#{$i}) { + anchor-name: --#{$anchor}; + } + + igx-badge:nth-of-type(#{$i}) { + position-anchor: --#{$anchor}; + } +} diff --git a/src/app/data-display/badge/badge-tailwind-styling/badge-tailwind-styling.component.ts b/src/app/data-display/badge/badge-tailwind-styling/badge-tailwind-styling.component.ts new file mode 100644 index 0000000000..36ec4c92da --- /dev/null +++ b/src/app/data-display/badge/badge-tailwind-styling/badge-tailwind-styling.component.ts @@ -0,0 +1,12 @@ +import { Component } from '@angular/core'; +import { IgxAvatarComponent } from 'igniteui-angular/avatar'; +import { IgxBadgeComponent } from 'igniteui-angular/badge'; + + +@Component({ + selector: 'app-badge-tailwind-styling', + styleUrls: ['./badge-tailwind-styling.component.scss'], + templateUrl: './badge-tailwind-styling.component.html', + imports: [IgxAvatarComponent, IgxBadgeComponent] +}) +export class BadgeTailwindStylingComponent { } diff --git a/src/app/data-display/badge/badge-type/badge-type.component.html b/src/app/data-display/badge/badge-type/badge-type.component.html new file mode 100644 index 0000000000..3fe3053dbc --- /dev/null +++ b/src/app/data-display/badge/badge-type/badge-type.component.html @@ -0,0 +1,11 @@ + + +Dot + + + +Icon + + + +Text diff --git a/src/app/data-display/badge/badge-type/badge-type.component.scss b/src/app/data-display/badge/badge-type/badge-type.component.scss new file mode 100644 index 0000000000..9b22c01142 --- /dev/null +++ b/src/app/data-display/badge/badge-type/badge-type.component.scss @@ -0,0 +1,53 @@ +@use "sass:list"; +@use "igniteui-theming/sass/typography" as *; + +$types: dot, icon, text; + +:host { + display: grid; + grid-auto-flow: column; + grid-template-rows: auto auto; + place-content: center; + place-items: center; + column-gap: rem(60px); + row-gap: rem(16px); + min-height: 8.5rem; + padding: rem(32px); +} + +igx-avatar { + --ig-avatar-size: #{rem(40px)}; + + grid-row: 1; +} + +span { + grid-row: 2; + text-align: center; + color: var(--ig-gray-700); + + @include type-style("caption") { + margin: 0; + } +} + +igx-badge { + --ig-size: var(--ig-size-small); + + position: absolute; + inset-block-start: anchor(85.5%); + inset-inline-start: anchor(85.5%); + translate: -50% -50%; +} + +@each $type in $types { + $i: list.index($types, $type); + + igx-avatar:nth-of-type(#{$i}) { + anchor-name: --#{$type}; + } + + igx-badge:nth-of-type(#{$i}) { + position-anchor: --#{$type}; + } +} diff --git a/src/app/data-display/badge/badge-type/badge-type.component.ts b/src/app/data-display/badge/badge-type/badge-type.component.ts new file mode 100644 index 0000000000..d65ecaedbb --- /dev/null +++ b/src/app/data-display/badge/badge-type/badge-type.component.ts @@ -0,0 +1,11 @@ +import { Component } from '@angular/core'; +import { IgxAvatarComponent } from 'igniteui-angular/avatar'; +import { IgxBadgeComponent } from 'igniteui-angular/badge'; + +@Component({ + selector: 'app-badge-type', + templateUrl: './badge-type.component.html', + styleUrls: ['./badge-type.component.scss'], + imports: [IgxAvatarComponent, IgxBadgeComponent] +}) +export class BadgeTypeComponent { } diff --git a/src/app/data-display/badge/badge-variants/badge-variants.component.html b/src/app/data-display/badge/badge-variants/badge-variants.component.html new file mode 100644 index 0000000000..cd11945f7e --- /dev/null +++ b/src/app/data-display/badge/badge-variants/badge-variants.component.html @@ -0,0 +1,19 @@ + + +Primary + + + +Info + + + +Success + + + +Warn + + + +Error diff --git a/src/app/data-display/badge/badge-variants/badge-variants.component.scss b/src/app/data-display/badge/badge-variants/badge-variants.component.scss new file mode 100644 index 0000000000..7cbd9ac603 --- /dev/null +++ b/src/app/data-display/badge/badge-variants/badge-variants.component.scss @@ -0,0 +1,51 @@ +@use "sass:list"; +@use "igniteui-theming/sass/typography" as *; + +$variants: primary, info, success, warning, error; + +:host { + display: grid; + grid-auto-flow: column; + grid-template-rows: auto auto; + place-content: center; + place-items: center; + column-gap: rem(40px); + row-gap: rem(12px); + min-height: 8.5rem; + padding: rem(32px); +} + +igx-avatar { + grid-row: 1; +} + +span { + grid-row: 2; + text-align: center; + color: var(--ig-gray-700); + + @include type-style("body-2") { + margin: 0; + } +} + +igx-badge { + --ig-size: var(--ig-size-small); + + position: absolute; + inset-block-start: anchor(85.5%); + inset-inline-start: anchor(85.5%); + translate: -50% -50%; +} + +@each $variant in $variants { + $i: list.index($variants, $variant); + + igx-avatar:nth-of-type(#{$i}) { + anchor-name: --#{$variant}; + } + + igx-badge:nth-of-type(#{$i}) { + position-anchor: --#{$variant}; + } +} diff --git a/src/app/data-display/badge/badge-variants/badge-variants.component.ts b/src/app/data-display/badge/badge-variants/badge-variants.component.ts new file mode 100644 index 0000000000..27f31de5f1 --- /dev/null +++ b/src/app/data-display/badge/badge-variants/badge-variants.component.ts @@ -0,0 +1,11 @@ +import { Component } from '@angular/core'; +import { IgxAvatarComponent } from 'igniteui-angular/avatar'; +import { IgxBadgeComponent } from 'igniteui-angular/badge'; + +@Component({ + selector: 'app-badge-variants', + styleUrls: ['./badge-variants.component.scss'], + templateUrl: './badge-variants.component.html', + imports: [IgxAvatarComponent, IgxBadgeComponent] +}) +export class BadgeVariantsComponent { } diff --git a/src/app/data-display/chip/chip-area-sample/chip-area-sample.component.scss b/src/app/data-display/chip/chip-area-sample/chip-area-sample.component.scss index 3693122d01..8c1bf8489e 100644 --- a/src/app/data-display/chip/chip-area-sample/chip-area-sample.component.scss +++ b/src/app/data-display/chip/chip-area-sample/chip-area-sample.component.scss @@ -9,5 +9,5 @@ igx-chip { } .sample-container { - padding-top: 30px; + padding: 1rem 0 0 1rem; } diff --git a/src/app/data-display/chip/chip-area-sample/chip-area-sample.component.ts b/src/app/data-display/chip/chip-area-sample/chip-area-sample.component.ts index ed7489a7aa..6f3cf48ddc 100644 --- a/src/app/data-display/chip/chip-area-sample/chip-area-sample.component.ts +++ b/src/app/data-display/chip/chip-area-sample/chip-area-sample.component.ts @@ -1,4 +1,4 @@ -import { ChangeDetectorRef, Component, inject, ChangeDetectionStrategy } from '@angular/core'; +import { ChangeDetectorRef, Component, inject } from '@angular/core'; import { IBaseChipEventArgs, IChipsAreaReorderEventArgs, IgxChipComponent, IgxChipsAreaComponent } from 'igniteui-angular/chips'; import { IgxAvatarComponent } from 'igniteui-angular/avatar'; import { IgxPrefixDirective } from 'igniteui-angular/input-group'; @@ -9,7 +9,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: 'app-chip-area-sample', styleUrls: ['./chip-area-sample.component.scss'], templateUrl: './chip-area-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxChipsAreaComponent, IgxChipComponent, IgxAvatarComponent, IgxPrefixDirective, IgxIconComponent] }) diff --git a/src/app/data-display/chip/chip-outlined/chip-outlined.component.html b/src/app/data-display/chip/chip-outlined/chip-outlined.component.html new file mode 100644 index 0000000000..c9d6b7529c --- /dev/null +++ b/src/app/data-display/chip/chip-outlined/chip-outlined.component.html @@ -0,0 +1,13 @@ +
+ @for (item of variants; track item.label) { + + {{ item.label }} + + } +
diff --git a/src/app/data-display/chip/chip-outlined/chip-outlined.component.scss b/src/app/data-display/chip/chip-outlined/chip-outlined.component.scss new file mode 100644 index 0000000000..a17f5cbe51 --- /dev/null +++ b/src/app/data-display/chip/chip-outlined/chip-outlined.component.scss @@ -0,0 +1,7 @@ +.sample-container { + display: flex; + flex-wrap: wrap; + align-items: center; + gap: 5px; + padding: 1rem 0 0 1rem; +} diff --git a/src/app/data-display/chip/chip-outlined/chip-outlined.component.ts b/src/app/data-display/chip/chip-outlined/chip-outlined.component.ts new file mode 100644 index 0000000000..3cbf555bd6 --- /dev/null +++ b/src/app/data-display/chip/chip-outlined/chip-outlined.component.ts @@ -0,0 +1,30 @@ +import { ChangeDetectorRef, Component, inject } from '@angular/core'; +import { IBaseChipEventArgs, IgxChipComponent, IgxChipTypeVariant } from 'igniteui-angular/chips'; +import { IgxIconComponent } from 'igniteui-angular/icon'; +import { IgxPrefixDirective } from 'igniteui-angular/input-group'; + + +@Component({ + selector: 'app-chip-outlined', + styleUrls: ['./chip-outlined.component.scss'], + templateUrl: './chip-outlined.component.html', + imports: [IgxChipComponent, IgxIconComponent, IgxPrefixDirective] +}) + +export class ChipOutlinedComponent { + private cdr = inject(ChangeDetectorRef); + + public variants: { variant: IgxChipTypeVariant | undefined; label: string }[] = [ + { variant: undefined, label: 'Default' }, + { variant: IgxChipTypeVariant.PRIMARY, label: 'Primary' }, + { variant: IgxChipTypeVariant.INFO, label: 'Info' }, + { variant: IgxChipTypeVariant.SUCCESS, label: 'Success' }, + { variant: IgxChipTypeVariant.WARNING, label: 'Warning' }, + { variant: IgxChipTypeVariant.DANGER, label: 'Danger' } + ]; + + public chipRemoved(event: IBaseChipEventArgs) { + this.variants = this.variants.filter(v => v.label !== event.owner.id); + this.cdr.detectChanges(); + } +} diff --git a/src/app/data-display/chip/chip-simple/chip-simple.component.scss b/src/app/data-display/chip/chip-simple/chip-simple.component.scss index e175fb08cd..5e88f1179e 100644 --- a/src/app/data-display/chip/chip-simple/chip-simple.component.scss +++ b/src/app/data-display/chip/chip-simple/chip-simple.component.scss @@ -3,5 +3,5 @@ igx-chip { } .sample-container { - padding-top: 30px; + padding: 1rem 0 0 1rem; } diff --git a/src/app/data-display/chip/chip-simple/chip-simple.component.ts b/src/app/data-display/chip/chip-simple/chip-simple.component.ts index 6b3f3b1f33..3d5d9d6294 100644 --- a/src/app/data-display/chip/chip-simple/chip-simple.component.ts +++ b/src/app/data-display/chip/chip-simple/chip-simple.component.ts @@ -1,4 +1,4 @@ -import { ChangeDetectorRef, Component, inject, ChangeDetectionStrategy } from '@angular/core'; +import { ChangeDetectorRef, Component, inject } from '@angular/core'; import { IBaseChipEventArgs, IgxChipComponent } from 'igniteui-angular/chips'; import { IgxIconComponent } from 'igniteui-angular/icon'; import { IgxPrefixDirective } from 'igniteui-angular/input-group'; @@ -8,7 +8,6 @@ import { IgxPrefixDirective } from 'igniteui-angular/input-group'; selector: 'app-chip-simple', styleUrls: ['./chip-simple.component.scss'], templateUrl: './chip-simple.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxChipComponent, IgxIconComponent, IgxPrefixDirective] }) diff --git a/src/app/data-display/chip/chip-styling/chip-styling.component.scss b/src/app/data-display/chip/chip-styling/chip-styling.component.scss index d8f3bdb7c0..9f9b4b01b2 100644 --- a/src/app/data-display/chip/chip-styling/chip-styling.component.scss +++ b/src/app/data-display/chip/chip-styling/chip-styling.component.scss @@ -1,49 +1,56 @@ @use "layout.scss"; @use "igniteui-angular/theming" as *; -// CSS variables approach +igx-chips-area { + --ig-size: var(--ig-size-medium); + + gap: rem(8px); +} + +igx-icon { + --ig-icon-size: #{rem(13px)}; +} +// CSS variables approach igx-chip { --text-color: #fff; --hover-text-color: #fff; --focus-text-color: #fff; --border-radius: #{rem(5px)}; -} -.xcom { - --background: #000; - --hover-background: #000; - --focus-background: #323232; + &.xcom { + --background: #000; + --hover-background: #000; + --focus-background: #323232; + } + + &.youtube { + --background: #cd201f; + --hover-background: #cd201f; + --focus-background: #9f1717; + } + + &.facebook { + --background: #3b5999; + --hover-background: #3b5999; + --focus-background: #2c4378; + } + + &.linkedin { + --background: #55acee; + --hover-background: #55acee; + --focus-background: #4682af; + } } -.youtube { - --background: #cd201f; - --hover-background: #cd201f; - --focus-background: #9f1717; -} - -.facebook { - --background: #3b5999; - --hover-background: #3b5999; - --focus-background: #2c4378; -} - -.linkedin { - --background: #55acee; - --hover-background: #55acee; - --focus-background: #4682af; -} - -// Sass theme approach - +//Sass theme approach // $custom-chip-theme: chip-theme( -// $background: #cd201f, // $text-color: #fff, -// $hover-background: #cd201f, -// $focus-background: #9f1717, +// $hover-background: #fff, +// $focus-background: #fff, // $border-radius: rem(5px) // ); - +// // :host { // @include tokens($custom-chip-theme); // } diff --git a/src/app/data-display/chip/chip-styling/chip-styling.component.ts b/src/app/data-display/chip/chip-styling/chip-styling.component.ts index 2c951ef956..f3ac4516d0 100644 --- a/src/app/data-display/chip/chip-styling/chip-styling.component.ts +++ b/src/app/data-display/chip/chip-styling/chip-styling.component.ts @@ -1,4 +1,4 @@ -import { ChangeDetectorRef, Component, inject, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { ChangeDetectorRef, Component, inject, OnInit } from '@angular/core'; import { facebook, linkedin } from '@igniteui/material-icons-extended'; import { IgxChipComponent, IgxChipsAreaComponent } from 'igniteui-angular/chips'; import { IgxIconComponent, IgxIconService } from 'igniteui-angular/icon'; @@ -9,7 +9,6 @@ import { NgClass } from '@angular/common'; selector: 'app-chip', styleUrls: ['./chip-styling.component.scss'], templateUrl: './chip-styling.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxChipsAreaComponent, IgxChipComponent, IgxIconComponent, IgxPrefixDirective, NgClass] }) diff --git a/src/app/data-display/chip/chip-styling/layout.scss b/src/app/data-display/chip/chip-styling/layout.scss index f80fd2f1c4..f5afb9a678 100644 --- a/src/app/data-display/chip/chip-styling/layout.scss +++ b/src/app/data-display/chip/chip-styling/layout.scss @@ -1,23 +1,7 @@ @use "igniteui-angular/theming" as *; :host { - ::ng-deep { - .igx-chip__item { - height: rem(20px); - font-size: rem(12px); - } - } + display: grid; + place-content: center; + height: 100%; } - -igx-chip { - margin-right: rem(8px); - margin-top: rem(20px); -} - -igx-chips-area { - margin-left: rem(20px); -} - -igx-icon { - --size: #{rem(12px)}; -} \ No newline at end of file diff --git a/src/app/data-display/chip/chip-tailwind-styling/chip-tailwind-styling.component.ts b/src/app/data-display/chip/chip-tailwind-styling/chip-tailwind-styling.component.ts index cb5f9dd512..7a5fc1a135 100644 --- a/src/app/data-display/chip/chip-tailwind-styling/chip-tailwind-styling.component.ts +++ b/src/app/data-display/chip/chip-tailwind-styling/chip-tailwind-styling.component.ts @@ -1,4 +1,4 @@ -import { ChangeDetectorRef, Component, inject, ChangeDetectionStrategy } from '@angular/core'; +import { ChangeDetectorRef, Component, inject } from '@angular/core'; import { IBaseChipEventArgs, IChipsAreaReorderEventArgs, IgxChipComponent, IgxChipsAreaComponent } from 'igniteui-angular/chips'; import { IgxIconComponent } from 'igniteui-angular/icon'; import { IgxPrefixDirective } from 'igniteui-angular/input-group'; @@ -8,7 +8,6 @@ import { IgxPrefixDirective } from 'igniteui-angular/input-group'; selector: 'app-chip-tailwind-styling', styleUrls: ['./chip-tailwind-styling.component.scss'], templateUrl: './chip-tailwind-styling.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxChipsAreaComponent, IgxChipComponent, IgxIconComponent, IgxPrefixDirective] }) diff --git a/src/app/data-display/chip/chip-tailwind-styling/layout.scss b/src/app/data-display/chip/chip-tailwind-styling/layout.scss index 619dc177ee..a201d613a7 100644 --- a/src/app/data-display/chip/chip-tailwind-styling/layout.scss +++ b/src/app/data-display/chip/chip-tailwind-styling/layout.scss @@ -1,4 +1,4 @@ -igx-chip { - margin-right: 5px; - margin-top: 20px; +igx-chips-area { + gap: 0.5rem; + padding: 1rem 0 0 1rem; } \ No newline at end of file diff --git a/src/app/data-display/chip/chip-variants/chip-variants.component.scss b/src/app/data-display/chip/chip-variants/chip-variants.component.scss index 3a4043d655..a17f5cbe51 100644 --- a/src/app/data-display/chip/chip-variants/chip-variants.component.scss +++ b/src/app/data-display/chip/chip-variants/chip-variants.component.scss @@ -1,8 +1,7 @@ -igx-chip { - margin-right: 5px; -} - .sample-container { - padding-top: 15px; - padding-left: 10px; + display: flex; + flex-wrap: wrap; + align-items: center; + gap: 5px; + padding: 1rem 0 0 1rem; } diff --git a/src/app/data-display/chip/chip-variants/chip-variants.component.ts b/src/app/data-display/chip/chip-variants/chip-variants.component.ts index d88eb71684..b6f1a6be6e 100644 --- a/src/app/data-display/chip/chip-variants/chip-variants.component.ts +++ b/src/app/data-display/chip/chip-variants/chip-variants.component.ts @@ -1,11 +1,10 @@ -import { ChangeDetectorRef, Component, inject, ChangeDetectionStrategy } from '@angular/core'; +import { ChangeDetectorRef, Component, inject } from '@angular/core'; import { IBaseChipEventArgs, IgxChipComponent, IgxChipTypeVariant } from 'igniteui-angular/chips'; @Component({ selector: 'app-chip-variants', styleUrls: ['./chip-variants.component.scss'], templateUrl: './chip-variants.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxChipComponent] }) export class ChipVariantsComponent { diff --git a/src/app/data-display/circular-progressbar/circular-dynamic-sample/circular-dynamic-sample.component.ts b/src/app/data-display/circular-progressbar/circular-dynamic-sample/circular-dynamic-sample.component.ts index 132b110878..5636e987a3 100644 --- a/src/app/data-display/circular-progressbar/circular-dynamic-sample/circular-dynamic-sample.component.ts +++ b/src/app/data-display/circular-progressbar/circular-dynamic-sample/circular-dynamic-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit } from '@angular/core'; import { IgxCircularProgressBarComponent, IgxProgressBarGradientDirective } from 'igniteui-angular/progressbar'; import { IgxIconButtonDirective } from 'igniteui-angular/directives'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -7,7 +7,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: 'app-circular-dynamic-sample', styleUrls: ['./circular-dynamic-sample.component.scss'], templateUrl: './circular-dynamic-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxCircularProgressBarComponent, IgxProgressBarGradientDirective, IgxIconButtonDirective, IgxIconComponent] }) export class CircularDynamicSampleComponent implements OnInit { diff --git a/src/app/data-display/circular-progressbar/circular-indeterminate-progressbar/circular-indeterminate-progressbar.component.ts b/src/app/data-display/circular-progressbar/circular-indeterminate-progressbar/circular-indeterminate-progressbar.component.ts index 955b4ee4f6..7b3f93988d 100644 --- a/src/app/data-display/circular-progressbar/circular-indeterminate-progressbar/circular-indeterminate-progressbar.component.ts +++ b/src/app/data-display/circular-progressbar/circular-indeterminate-progressbar/circular-indeterminate-progressbar.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxCircularProgressBarComponent } from 'igniteui-angular/progressbar'; @Component({ selector: 'app-circular-indeterminate-progressbar', styleUrls: ['./circular-indeterminate-progressbar.component.scss'], templateUrl: './circular-indeterminate-progressbar.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxCircularProgressBarComponent] }) export class CircularIndeterminateProgressbarComponent { } diff --git a/src/app/data-display/circular-progressbar/circular-progressbar.component.ts b/src/app/data-display/circular-progressbar/circular-progressbar.component.ts index b2767b613b..3cfc398f51 100644 --- a/src/app/data-display/circular-progressbar/circular-progressbar.component.ts +++ b/src/app/data-display/circular-progressbar/circular-progressbar.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxCircularProgressBarComponent } from 'igniteui-angular/progressbar'; @Component({ selector: 'app-circular-progressbar', styleUrls: ['./circular-progressbar.component.scss'], templateUrl: './circular-progressbar.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxCircularProgressBarComponent] }) export class CircularProgressbarComponent { } diff --git a/src/app/data-display/circular-progressbar/circular-styling-sample/circular-styling-sample.component.ts b/src/app/data-display/circular-progressbar/circular-styling-sample/circular-styling-sample.component.ts index d5d2fe7cf0..f5eadcf973 100644 --- a/src/app/data-display/circular-progressbar/circular-styling-sample/circular-styling-sample.component.ts +++ b/src/app/data-display/circular-progressbar/circular-styling-sample/circular-styling-sample.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxCircularProgressBarComponent } from 'igniteui-angular/progressbar'; @Component({ selector: 'app-circular-styling-sample', styleUrls: ['./circular-styling-sample.component.scss'], templateUrl: './circular-styling-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxCircularProgressBarComponent] }) export class CircularStylingSampleComponent { } diff --git a/src/app/data-display/data-display-routes-data.ts b/src/app/data-display/data-display-routes-data.ts index 84c0e4554e..39ceef1ea1 100644 --- a/src/app/data-display/data-display-routes-data.ts +++ b/src/app/data-display/data-display-routes-data.ts @@ -2,13 +2,17 @@ export const dataDisplayRoutesData = { "badge-icon": { displayName: "Badge Icon Sample", parentName: "Badge" }, - "badge-sample-2": { displayName: "Simple Badge", parentName: "Badge" }, - "badge-sample-3": { displayName: "Badge for List Items", parentName: "Badge" }, - "badge-outlined-sample": { displayName: "Badge Outlined Sample", parentName: "Badge" }, - "badge-dot-sample": { displayName: "Badge Dot Sample", parentName: "Badge" }, - "badge-styling-sample": { displayName: "Badge Styling Sample", parentName: "Badge" }, - "badge-tailwind-styling-sample": { displayName: "Badge Tailwind Styling Sample", parentName: "Badge" }, + "badge-overview": { displayName: "Overview", parentName: "Badge" }, + "badge-size": { displayName: "Badge Size", parentName: "Badge" }, + "badge-type": { displayName: "Badge Type", parentName: "Badge" }, + "badge-shape": { displayName: "Badge Shape", parentName: "Badge" }, + "badge-variants": { displayName: "Badge Variants", parentName: "Badge" }, + "badge-outlined": { displayName: "Badge Outlined", parentName: "Badge" }, + "badge-dot": { displayName: "Badge Dot", parentName: "Badge" }, + "badge-styling": { displayName: "Badge Styling", parentName: "Badge" }, + "badge-tailwind-styling": { displayName: "Badge Tailwind Styling", parentName: "Badge" }, "chip-simple": { displayName: "Chip Simple", parentName: "Chip" }, + "chip-outlined": { displayName: "Chip Outlined", parentName: "Chip" }, "chip-variants": { displayName: "Chip Variants", parentName: "Chip" }, "chip-area-sample": { displayName: "Chip Area Sample", parentName: "Chip" }, "chip-styling": { displayName: "Chip Styling", parentName: "Chip" }, diff --git a/src/app/data-display/data-display.routes.ts b/src/app/data-display/data-display.routes.ts index 4db820c452..de1538d481 100644 --- a/src/app/data-display/data-display.routes.ts +++ b/src/app/data-display/data-display.routes.ts @@ -1,12 +1,16 @@ import { BadgeIconComponent } from './badge/badge-icon/badge-icon.component'; -import { BadgeSample2Component } from './badge/badge-sample-2/badge-sample-2.component'; -import { BadgeSample3Component } from './badge/badge-sample-3/badge-sample-3.component'; +import { BadgeOverviewComponent } from './badge/badge-overview/badge-overview.component'; +import { BadgeSizeComponent } from './badge/badge-size/badge-size.component'; +import { BadgeTypeComponent } from './badge/badge-type/badge-type.component'; +import { BadgeShapeComponent } from './badge/badge-shape/badge-shape.component'; +import { BadgeVariantsComponent } from './badge/badge-variants/badge-variants.component'; import { BadgeOutlinedComponent } from './badge/badge-outlined/badge-outlined.component'; -import { BadgeDotSampleComponent } from './badge/badge-dot-sample/badge-dot-sample.component'; -import { BadgeStylingSampleComponent } from './badge/badge-styling-sample/badge-styling-sample.component'; -import { BadgeTailwindStylingSampleComponent } from './badge/badge-tailwind-styling-sample/badge-tailwind-styling-sample.component'; +import { BadgeDotComponent } from './badge/badge-dot/badge-dot.component'; +import { BadgeStylingComponent } from './badge/badge-styling/badge-styling.component'; +import { BadgeTailwindStylingComponent } from './badge/badge-tailwind-styling/badge-tailwind-styling.component'; import { ChipAreaSampleComponent } from './chip/chip-area-sample/chip-area-sample.component'; import { ChipSimpleComponent } from './chip/chip-simple/chip-simple.component'; +import { ChipOutlinedComponent } from './chip/chip-outlined/chip-outlined.component'; import { ChipVariantsComponent } from './chip/chip-variants/chip-variants.component'; import { ChipStylingSampleComponent } from './chip/chip-styling/chip-styling.component'; import { ChipTailwindStylingSampleComponent } from './chip/chip-tailwind-styling/chip-tailwind-styling.component'; @@ -55,34 +59,49 @@ export const DataDisplayRoutes: Routes = [ path: 'badge-icon' }, { - component: BadgeSample2Component, - data: dataDisplayRoutesData['badge-sample-2'], - path: 'badge-sample-2' + component: BadgeOverviewComponent, + data: dataDisplayRoutesData['badge-overview'], + path: 'badge-overview' }, { - component: BadgeSample3Component, - data: dataDisplayRoutesData['badge-sample-3'], - path: 'badge-sample-3' + component: BadgeSizeComponent, + data: dataDisplayRoutesData['badge-size'], + path: 'badge-size' + }, + { + component: BadgeTypeComponent, + data: dataDisplayRoutesData['badge-type'], + path: 'badge-type' + }, + { + component: BadgeShapeComponent, + data: dataDisplayRoutesData['badge-shape'], + path: 'badge-shape' + }, + { + component: BadgeVariantsComponent, + data: dataDisplayRoutesData['badge-variants'], + path: 'badge-variants' }, { component: BadgeOutlinedComponent, - data: dataDisplayRoutesData['badge-outlined-sample'], - path: 'badge-outlined-sample' + data: dataDisplayRoutesData['badge-outlined'], + path: 'badge-outlined' }, { - component: BadgeDotSampleComponent, - data: dataDisplayRoutesData['badge-dot-sample'], - path: 'badge-dot-sample' + component: BadgeDotComponent, + data: dataDisplayRoutesData['badge-dot'], + path: 'badge-dot' }, { - component: BadgeStylingSampleComponent, - data: dataDisplayRoutesData['badge-styling-sample'], - path: 'badge-styling-sample' + component: BadgeStylingComponent, + data: dataDisplayRoutesData['badge-styling'], + path: 'badge-styling' }, { - component: BadgeTailwindStylingSampleComponent, - data: dataDisplayRoutesData['badge-tailwind-styling-sample'], - path: 'badge-tailwind-styling-sample' + component: BadgeTailwindStylingComponent, + data: dataDisplayRoutesData['badge-tailwind-styling'], + path: 'badge-tailwind-styling' }, { component: ChipAreaSampleComponent, @@ -94,6 +113,11 @@ export const DataDisplayRoutes: Routes = [ data: dataDisplayRoutesData['chip-simple'], path: 'chip-simple' }, + { + component: ChipOutlinedComponent, + data: dataDisplayRoutesData['chip-outlined'], + path: 'chip-outlined' + }, { component: ChipVariantsComponent, data: dataDisplayRoutesData['chip-variants'], diff --git a/src/app/data-display/icon/icon-sample-1/icon-sample-1.component.ts b/src/app/data-display/icon/icon-sample-1/icon-sample-1.component.ts index e046a3a2ed..41cdf3d721 100644 --- a/src/app/data-display/icon/icon-sample-1/icon-sample-1.component.ts +++ b/src/app/data-display/icon/icon-sample-1/icon-sample-1.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxIconComponent } from 'igniteui-angular/icon'; @Component({ selector: 'app-icon-sample-1', styleUrls: ['./icon-sample-1.component.scss'], templateUrl: './icon-sample-1.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxIconComponent] }) export class IconSample1Component { } diff --git a/src/app/data-display/icon/icon-sample-2/icon-sample-2.component.ts b/src/app/data-display/icon/icon-sample-2/icon-sample-2.component.ts index c5e2e4fd13..82694a9f68 100644 --- a/src/app/data-display/icon/icon-sample-2/icon-sample-2.component.ts +++ b/src/app/data-display/icon/icon-sample-2/icon-sample-2.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxIconComponent } from 'igniteui-angular/icon'; @Component({ selector: 'app-icon-sample-2', styleUrls: ['./icon-sample-2.component.scss'], templateUrl: './icon-sample-2.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxIconComponent] }) export class IconSample2Component { } diff --git a/src/app/data-display/icon/icon-sample-3/icon-sample-3.component.ts b/src/app/data-display/icon/icon-sample-3/icon-sample-3.component.ts index df3a8cfc45..4b663ead5b 100644 --- a/src/app/data-display/icon/icon-sample-3/icon-sample-3.component.ts +++ b/src/app/data-display/icon/icon-sample-3/icon-sample-3.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxIconComponent } from 'igniteui-angular/icon'; @Component({ selector: 'app-icon-sample-3', styleUrls: ['./icon-sample-3.component.scss'], templateUrl: './icon-sample-3.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxIconComponent] }) export class IconSample3Component { } diff --git a/src/app/data-display/icon/icon-sample-4/icon-sample-4.component.ts b/src/app/data-display/icon/icon-sample-4/icon-sample-4.component.ts index a8e3dc5b45..ea39a69e79 100644 --- a/src/app/data-display/icon/icon-sample-4/icon-sample-4.component.ts +++ b/src/app/data-display/icon/icon-sample-4/icon-sample-4.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxIconComponent } from 'igniteui-angular/icon'; @Component({ selector: 'app-icon-sample-4', styleUrls: ['./icon-sample-4.component.scss'], templateUrl: './icon-sample-4.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxIconComponent] }) export class IconSample4Component { } diff --git a/src/app/data-display/icon/icon-sample-5/icon-sample-5.component.ts b/src/app/data-display/icon/icon-sample-5/icon-sample-5.component.ts index f1d5195352..182f6beb00 100644 --- a/src/app/data-display/icon/icon-sample-5/icon-sample-5.component.ts +++ b/src/app/data-display/icon/icon-sample-5/icon-sample-5.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxIconComponent } from 'igniteui-angular/icon'; @Component({ selector: 'app-icon-sample-5', styleUrls: ['./icon-sample-5.component.scss'], templateUrl: './icon-sample-5.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxIconComponent] }) export class IconSample5Component { } diff --git a/src/app/data-display/icon/icon-service-sample/icon-service-sample.component.ts b/src/app/data-display/icon/icon-service-sample/icon-service-sample.component.ts index 2551187391..bed3ac6c60 100644 --- a/src/app/data-display/icon/icon-service-sample/icon-service-sample.component.ts +++ b/src/app/data-display/icon/icon-service-sample/icon-service-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, inject } from '@angular/core'; import { IgxIconComponent, IgxIconService } from 'igniteui-angular/icon'; import { IgxCardActionsComponent, IgxCardComponent, IgxCardHeaderComponent, IgxCardHeaderSubtitleDirective, IgxCardHeaderTitleDirective } from 'igniteui-angular/card'; import { IgxAvatarComponent } from 'igniteui-angular/avatar'; @@ -9,7 +9,6 @@ import { IgxSuffixDirective } from 'igniteui-angular/input-group'; selector: 'app-icon-service-sample', styleUrls: ['./icon-service-sample.component.scss'], templateUrl: './icon-service-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxCardComponent, IgxCardHeaderComponent, IgxAvatarComponent, IgxIconComponent, IgxCardHeaderTitleDirective, IgxCardHeaderSubtitleDirective, IgxCardActionsComponent, IgxButtonDirective, IgxSuffixDirective] }) export class IconServiceSampleComponent { diff --git a/src/app/data-display/icon/icon-styling-sample/icon-styling-sample.component.ts b/src/app/data-display/icon/icon-styling-sample/icon-styling-sample.component.ts index 87a89bd136..09050f3abe 100644 --- a/src/app/data-display/icon/icon-styling-sample/icon-styling-sample.component.ts +++ b/src/app/data-display/icon/icon-styling-sample/icon-styling-sample.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxIconComponent } from 'igniteui-angular/icon'; @Component({ selector: 'app-icon-styling-sample', styleUrls: ['./icon-styling-sample.component.scss'], templateUrl: './icon-styling-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxIconComponent] }) export class IconStylingSampleComponent { } diff --git a/src/app/data-display/icon/icon-tailwind-styling-sample/icon-tailwind-styling-sample.component.ts b/src/app/data-display/icon/icon-tailwind-styling-sample/icon-tailwind-styling-sample.component.ts index e91c87fd21..abb7841ea1 100644 --- a/src/app/data-display/icon/icon-tailwind-styling-sample/icon-tailwind-styling-sample.component.ts +++ b/src/app/data-display/icon/icon-tailwind-styling-sample/icon-tailwind-styling-sample.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxIconComponent } from 'igniteui-angular/icon'; @Component({ selector: 'app-icon-tailwind-styling-sample', styleUrls: ['./icon-tailwind-styling-sample.component.scss'], templateUrl: './icon-tailwind-styling-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxIconComponent] }) export class IconTailwindStylingSampleComponent { } diff --git a/src/app/data-display/icon/material-icons-extended/material-icons-extended.component.ts b/src/app/data-display/icon/material-icons-extended/material-icons-extended.component.ts index f0e06b2916..9647b5deba 100644 --- a/src/app/data-display/icon/material-icons-extended/material-icons-extended.component.ts +++ b/src/app/data-display/icon/material-icons-extended/material-icons-extended.component.ts @@ -42,7 +42,6 @@ interface ICategoryOption { selector: 'app-material-icons-extended', templateUrl: './material-icons-extended.component.html', styleUrls: ['./material-icons-extended.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [ AsyncPipe, IgxSelectComponent, @@ -117,7 +116,7 @@ export class MaterialIconsExtendedComponent implements OnInit { public allIcons = imxIcons; public selectedCategory: IconCategory | 'all' = 'all'; - + // Floating download button public hoveredIcon: IMXIcon | null = null; diff --git a/src/app/data-display/icon/material-symbols/material-symbols.component.ts b/src/app/data-display/icon/material-symbols/material-symbols.component.ts index 41f188f77a..88a7a8d5a8 100644 --- a/src/app/data-display/icon/material-symbols/material-symbols.component.ts +++ b/src/app/data-display/icon/material-symbols/material-symbols.component.ts @@ -1,11 +1,10 @@ -import { Component, OnInit, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, inject } from '@angular/core'; import { IgxIconComponent, IgxIconService } from 'igniteui-angular/icon'; @Component({ selector: 'app-material-symbols', templateUrl: './material-symbols.component.html', styleUrls: ['./material-symbols.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxIconComponent] }) export class MaterialSymbolsComponent implements OnInit { diff --git a/src/app/data-display/icon/svg-icon-sample/svg-icon-sample.component.ts b/src/app/data-display/icon/svg-icon-sample/svg-icon-sample.component.ts index ccc19f81b4..8df38cf200 100644 --- a/src/app/data-display/icon/svg-icon-sample/svg-icon-sample.component.ts +++ b/src/app/data-display/icon/svg-icon-sample/svg-icon-sample.component.ts @@ -1,11 +1,10 @@ -import { Component, OnInit, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, inject } from '@angular/core'; import { IgxIconComponent, IgxIconService } from 'igniteui-angular/icon'; @Component({ selector: 'app-svg-icon-sample', styleUrls: ['./svg-icon-sample.component.scss'], templateUrl: './svg-icon-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxIconComponent] }) export class SvgIconSampleComponent implements OnInit { diff --git a/src/app/data-display/igxFor/igxFor-horizontal-sample/igxFor-horizontal.component.ts b/src/app/data-display/igxFor/igxFor-horizontal-sample/igxFor-horizontal.component.ts index 39743f7cfe..9df4bbef34 100644 --- a/src/app/data-display/igxFor/igxFor-horizontal-sample/igxFor-horizontal.component.ts +++ b/src/app/data-display/igxFor/igxFor-horizontal-sample/igxFor-horizontal.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit } from '@angular/core'; import { IgxFilterOptions, IgxFilterPipe, IgxForOfDirective } from 'igniteui-angular/directives'; import { IgxInputDirective, IgxInputGroupComponent, IgxPrefixDirective, IgxSuffixDirective } from 'igniteui-angular/input-group'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -12,7 +12,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-igx-for-horizontal', styleUrls: ['./igxFor-horizontal.component.scss'], templateUrl: './igxFor-horizontal.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxInputGroupComponent, FormsModule, IgxInputDirective, IgxPrefixDirective, IgxIconComponent, IgxSuffixDirective, IgxListComponent, IgxListItemComponent, IgxForOfDirective, IgxAvatarComponent, IgxFilterPipe] }) export class IgxForHorizontalComponent implements OnInit { diff --git a/src/app/data-display/igxFor/igxFor.component.ts b/src/app/data-display/igxFor/igxFor.component.ts index 326d0acd03..e115924f68 100644 --- a/src/app/data-display/igxFor/igxFor.component.ts +++ b/src/app/data-display/igxFor/igxFor.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit } from '@angular/core'; import { IgxFilterOptions, IgxFilterPipe, IgxForOfDirective, IgxRippleDirective } from 'igniteui-angular/directives'; import { IgxInputDirective, IgxInputGroupComponent, IgxPrefixDirective, IgxSuffixDirective } from 'igniteui-angular/input-group'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -12,7 +12,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-igx-for-list', styleUrls: ['./igxFor.component.scss'], templateUrl: './igxFor.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxInputGroupComponent, FormsModule, IgxInputDirective, IgxPrefixDirective, IgxIconComponent, IgxSuffixDirective, IgxListComponent, IgxListItemComponent, IgxForOfDirective, IgxRippleDirective, IgxAvatarComponent, IgxListThumbnailDirective, IgxListLineTitleDirective, IgxListActionDirective, IgxFilterPipe] }) export class IgxForComponent implements OnInit { diff --git a/src/app/data-display/linear-progressbar/linear-dynamic-sample/linear-dynamic-sample.component.ts b/src/app/data-display/linear-progressbar/linear-dynamic-sample/linear-dynamic-sample.component.ts index 46838db102..89d21c69b0 100644 --- a/src/app/data-display/linear-progressbar/linear-dynamic-sample/linear-dynamic-sample.component.ts +++ b/src/app/data-display/linear-progressbar/linear-dynamic-sample/linear-dynamic-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit } from '@angular/core'; import { IgxLinearProgressBarComponent } from 'igniteui-angular/progressbar'; import { IgxIconButtonDirective } from 'igniteui-angular/directives'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -7,7 +7,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: 'app-linear-dynamic-sample', styleUrls: ['./linear-dynamic-sample.component.scss'], templateUrl: './linear-dynamic-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxLinearProgressBarComponent, IgxIconButtonDirective, IgxIconComponent] }) export class LinearDynamicSampleComponent implements OnInit{ diff --git a/src/app/data-display/linear-progressbar/linear-progressbar-sample-1/linear-progressbar-sample-1.component.ts b/src/app/data-display/linear-progressbar/linear-progressbar-sample-1/linear-progressbar-sample-1.component.ts index f458f90e00..1c09193d37 100644 --- a/src/app/data-display/linear-progressbar/linear-progressbar-sample-1/linear-progressbar-sample-1.component.ts +++ b/src/app/data-display/linear-progressbar/linear-progressbar-sample-1/linear-progressbar-sample-1.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxLinearProgressBarComponent } from 'igniteui-angular/progressbar'; @Component({ selector: 'app-linear-progressbar-sample-1', styleUrls: ['./linear-progressbar-sample-1.component.scss'], templateUrl: './linear-progressbar-sample-1.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxLinearProgressBarComponent] }) export class LinearProgressbarSample1Component {} diff --git a/src/app/data-display/linear-progressbar/linear-progressbar-sample-2/linear-progressbar-sample-2.component.ts b/src/app/data-display/linear-progressbar/linear-progressbar-sample-2/linear-progressbar-sample-2.component.ts index 483eebe3db..e81ae177d7 100644 --- a/src/app/data-display/linear-progressbar/linear-progressbar-sample-2/linear-progressbar-sample-2.component.ts +++ b/src/app/data-display/linear-progressbar/linear-progressbar-sample-2/linear-progressbar-sample-2.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxLinearProgressBarComponent, IgxTextAlign } from 'igniteui-angular/progressbar'; @Component({ selector: 'app-linear-progressbar-sample-2', styleUrls: ['./linear-progressbar-sample-2.component.scss'], templateUrl: './linear-progressbar-sample-2.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxLinearProgressBarComponent] }) export class LinearProgressbarSample2Component { diff --git a/src/app/data-display/linear-progressbar/linear-progressbar-styling-sample/linear-progressbar-styling-sample.component.ts b/src/app/data-display/linear-progressbar/linear-progressbar-styling-sample/linear-progressbar-styling-sample.component.ts index c33abfbf0a..39859d1c4b 100644 --- a/src/app/data-display/linear-progressbar/linear-progressbar-styling-sample/linear-progressbar-styling-sample.component.ts +++ b/src/app/data-display/linear-progressbar/linear-progressbar-styling-sample/linear-progressbar-styling-sample.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxLinearProgressBarComponent } from 'igniteui-angular/progressbar'; @Component({ selector: 'app-linear-progressbar-styling', styleUrls: ['./linear-progressbar-styling-sample.component.scss'], templateUrl: './linear-progressbar-styling-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxLinearProgressBarComponent] }) export class LinearProgressbarStylingComponent { } diff --git a/src/app/data-display/linear-progressbar/linear-progressbar.component.ts b/src/app/data-display/linear-progressbar/linear-progressbar.component.ts index 41a363a007..cf1e1c1826 100644 --- a/src/app/data-display/linear-progressbar/linear-progressbar.component.ts +++ b/src/app/data-display/linear-progressbar/linear-progressbar.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxLinearProgressBarComponent } from 'igniteui-angular/progressbar'; @Component({ selector: 'app-linear-progressbar', styleUrls: ['./linear-progressbar.component.scss'], templateUrl: './linear-progressbar.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxLinearProgressBarComponent] }) export class LinearProgressbarComponent { } diff --git a/src/app/data-display/mask/mask-sample-1/mask-sample-1.component.ts b/src/app/data-display/mask/mask-sample-1/mask-sample-1.component.ts index 916c4628f5..a1b366ec7c 100644 --- a/src/app/data-display/mask/mask-sample-1/mask-sample-1.component.ts +++ b/src/app/data-display/mask/mask-sample-1/mask-sample-1.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxInputDirective, IgxInputGroupComponent, IgxLabelDirective } from 'igniteui-angular/input-group'; import { IgxMaskDirective, IgxTextSelectionDirective } from 'igniteui-angular/directives'; import { IgxSnackbarComponent } from 'igniteui-angular/snackbar'; @@ -7,7 +7,6 @@ import { IgxSnackbarComponent } from 'igniteui-angular/snackbar'; selector: 'app-mask-sample-1', styleUrls: ['./mask-sample-1.component.scss'], templateUrl: './mask-sample-1.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxInputGroupComponent, IgxLabelDirective, IgxInputDirective, IgxMaskDirective, IgxTextSelectionDirective, IgxSnackbarComponent] }) diff --git a/src/app/data-display/mask/mask-sample-2/mask-sample-2.component.ts b/src/app/data-display/mask/mask-sample-2/mask-sample-2.component.ts index f53c1497a1..493d59abb9 100644 --- a/src/app/data-display/mask/mask-sample-2/mask-sample-2.component.ts +++ b/src/app/data-display/mask/mask-sample-2/mask-sample-2.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxInputDirective, IgxInputGroupComponent, IgxLabelDirective, IgxPrefixDirective } from 'igniteui-angular/input-group'; import { IgxIconComponent } from 'igniteui-angular/icon'; import { IgxMaskDirective } from 'igniteui-angular/directives'; @@ -7,7 +7,6 @@ import { IgxMaskDirective } from 'igniteui-angular/directives'; selector: 'app-mask-sample-2', styleUrls: ['./mask-sample-2.component.scss'], templateUrl: './mask-sample-2.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxInputGroupComponent, IgxPrefixDirective, IgxIconComponent, IgxLabelDirective, IgxInputDirective, IgxMaskDirective] }) export class MaskSample2Component { diff --git a/src/app/data-display/mask/mask-sample-3/mask-sample-3.component.ts b/src/app/data-display/mask/mask-sample-3/mask-sample-3.component.ts index eca2134400..d44da35138 100644 --- a/src/app/data-display/mask/mask-sample-3/mask-sample-3.component.ts +++ b/src/app/data-display/mask/mask-sample-3/mask-sample-3.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxSwitchComponent } from 'igniteui-angular/switch'; import { IgxInputDirective, IgxInputGroupComponent, IgxLabelDirective } from 'igniteui-angular/input-group'; import { IgxMaskDirective } from 'igniteui-angular/directives'; @@ -9,7 +9,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-mask-sample-3', styleUrls: ['./mask-sample-3.component.scss'], templateUrl: './mask-sample-3.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSwitchComponent, FormsModule, IgxInputGroupComponent, IgxLabelDirective, IgxInputDirective, IgxMaskDirective] }) export class MaskSample3Component { diff --git a/src/app/data-display/mask/mask-sample-4/mask-sample-4.component.ts b/src/app/data-display/mask/mask-sample-4/mask-sample-4.component.ts index 0634321098..15964defeb 100644 --- a/src/app/data-display/mask/mask-sample-4/mask-sample-4.component.ts +++ b/src/app/data-display/mask/mask-sample-4/mask-sample-4.component.ts @@ -1,4 +1,4 @@ -import { Component, Pipe, PipeTransform, ChangeDetectionStrategy } from '@angular/core'; +import { Component, Pipe, PipeTransform } from '@angular/core'; import { IgxInputDirective, IgxInputGroupComponent, IgxLabelDirective } from 'igniteui-angular/input-group'; import { IgxMaskDirective, IgxTextSelectionDirective } from 'igniteui-angular/directives'; import { FormsModule } from '@angular/forms'; @@ -6,7 +6,6 @@ import { FormsModule } from '@angular/forms'; @Component({ selector: 'app-mask-sample-4', templateUrl: './mask-sample-4.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxInputGroupComponent, IgxLabelDirective, FormsModule, IgxInputDirective, IgxMaskDirective, IgxTextSelectionDirective] }) export class MaskSample4Component { diff --git a/src/app/data-display/mask/mask-sample-5/mask-sample-5.component.ts b/src/app/data-display/mask/mask-sample-5/mask-sample-5.component.ts index d1c02b6f69..ecd42f17ae 100644 --- a/src/app/data-display/mask/mask-sample-5/mask-sample-5.component.ts +++ b/src/app/data-display/mask/mask-sample-5/mask-sample-5.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxInputDirective, IgxInputGroupComponent, IgxLabelDirective } from 'igniteui-angular/input-group'; import { IgxMaskDirective } from 'igniteui-angular/directives'; import { FormsModule } from '@angular/forms'; @@ -6,7 +6,6 @@ import { FormsModule } from '@angular/forms'; @Component({ selector: 'app-mask-sample-5', templateUrl: './mask-sample-5.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxInputGroupComponent, IgxLabelDirective, FormsModule, IgxInputDirective, IgxMaskDirective] }) diff --git a/src/app/data-display/text-highlight/text-highlight-sample-1/text-highlight-sample-1.component.ts b/src/app/data-display/text-highlight/text-highlight-sample-1/text-highlight-sample-1.component.ts index f0dfd4db1c..42a430e5c6 100644 --- a/src/app/data-display/text-highlight/text-highlight-sample-1/text-highlight-sample-1.component.ts +++ b/src/app/data-display/text-highlight/text-highlight-sample-1/text-highlight-sample-1.component.ts @@ -1,5 +1,5 @@ /* eslint-disable max-len */ -import { Component, OnDestroy, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnDestroy, ViewChild, inject } from '@angular/core'; import { IgxIconButtonDirective, IgxRippleDirective, IgxTextHighlightDirective, IgxTextHighlightService } from 'igniteui-angular/directives'; import { IgxInputDirective, IgxInputGroupComponent, IgxPrefixDirective, IgxSuffixDirective } from 'igniteui-angular/input-group'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -10,7 +10,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-text-highlight-1', styleUrls: ['./text-highlight-sample-1.component.scss'], templateUrl: './text-highlight-sample-1.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxInputGroupComponent, IgxPrefixDirective, IgxIconComponent, FormsModule, IgxInputDirective, IgxSuffixDirective, IgxIconButtonDirective, IgxRippleDirective, IgxTextHighlightDirective] }) export class TextHighlightSample1Component implements OnDestroy { diff --git a/src/app/data-display/text-highlight/text-highlight-sample-2/text-highlight-sample-2.component.ts b/src/app/data-display/text-highlight/text-highlight-sample-2/text-highlight-sample-2.component.ts index bbd1a26e5c..21730d0f4e 100644 --- a/src/app/data-display/text-highlight/text-highlight-sample-2/text-highlight-sample-2.component.ts +++ b/src/app/data-display/text-highlight/text-highlight-sample-2/text-highlight-sample-2.component.ts @@ -1,5 +1,5 @@ /* eslint-disable max-len */ -import { Component, OnDestroy, ViewChildren, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnDestroy, ViewChildren, inject } from '@angular/core'; import { IgxIconButtonDirective, IgxRippleDirective, IgxTextHighlightDirective, IgxTextHighlightService } from 'igniteui-angular/directives'; import { IgxInputDirective, IgxInputGroupComponent, IgxPrefixDirective, IgxSuffixDirective } from 'igniteui-angular/input-group'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -10,7 +10,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-text-highlight-2', styleUrls: ['./text-highlight-sample-2.component.scss'], templateUrl: './text-highlight-sample-2.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxInputGroupComponent, IgxPrefixDirective, IgxIconComponent, FormsModule, IgxInputDirective, IgxSuffixDirective, IgxIconButtonDirective, IgxRippleDirective, IgxTextHighlightDirective] }) export class TextHighlightSample2Component implements OnDestroy { diff --git a/src/app/data-display/text-highlight/text-highlight-style/text-highlight-style.component.ts b/src/app/data-display/text-highlight/text-highlight-style/text-highlight-style.component.ts index b25c092302..e1ef268e7c 100644 --- a/src/app/data-display/text-highlight/text-highlight-style/text-highlight-style.component.ts +++ b/src/app/data-display/text-highlight/text-highlight-style/text-highlight-style.component.ts @@ -1,5 +1,5 @@ /* eslint-disable max-len */ -import { Component, OnDestroy, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnDestroy, ViewChild, inject } from '@angular/core'; import { IgxIconButtonDirective, IgxRippleDirective, IgxTextHighlightDirective, IgxTextHighlightService } from 'igniteui-angular/directives'; import { IgxInputDirective, IgxInputGroupComponent, IgxPrefixDirective, IgxSuffixDirective } from 'igniteui-angular/input-group'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -10,7 +10,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-text-highlight-style', styleUrls: ['./text-highlight-style.component.scss'], templateUrl: './text-highlight-style.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxInputGroupComponent, IgxPrefixDirective, IgxIconComponent, FormsModule, IgxInputDirective, IgxSuffixDirective, IgxIconButtonDirective, IgxRippleDirective, IgxTextHighlightDirective] }) export class TextHighlightStyleComponent implements OnDestroy { diff --git a/src/app/data-entries/autocomplete/autocomplete/autocomplete.component.ts b/src/app/data-entries/autocomplete/autocomplete/autocomplete.component.ts index c3287b569d..d9c121019b 100644 --- a/src/app/data-entries/autocomplete/autocomplete/autocomplete.component.ts +++ b/src/app/data-entries/autocomplete/autocomplete/autocomplete.component.ts @@ -1,4 +1,4 @@ -import { Component, Pipe, PipeTransform, forwardRef, ChangeDetectionStrategy } from '@angular/core'; +import { Component, Pipe, PipeTransform, forwardRef } from '@angular/core'; import { IgxInputDirective, IgxInputGroupComponent, IgxLabelDirective } from 'igniteui-angular/input-group'; import { IgxAutocompleteDirective, IgxDropDownComponent, IgxDropDownItemComponent } from 'igniteui-angular/drop-down'; import { FormsModule } from '@angular/forms'; @@ -8,7 +8,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-autocomplete', styleUrls: ['./autocomplete.component.scss'], templateUrl: './autocomplete.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxInputGroupComponent, IgxLabelDirective, FormsModule, IgxInputDirective, IgxAutocompleteDirective, IgxDropDownComponent, IgxDropDownItemComponent, forwardRef(() => AutocompletePipeStartsWith)] }) export class AutocompleteBasicComponent { diff --git a/src/app/data-entries/autocomplete/movie/movie.component.ts b/src/app/data-entries/autocomplete/movie/movie.component.ts index bebcf154f0..7705b587ae 100644 --- a/src/app/data-entries/autocomplete/movie/movie.component.ts +++ b/src/app/data-entries/autocomplete/movie/movie.component.ts @@ -1,4 +1,4 @@ -import { Component, Pipe, PipeTransform, ChangeDetectionStrategy } from '@angular/core'; +import { Component, Pipe, PipeTransform } from '@angular/core'; import { ConnectedPositioningStrategy, VerticalAlignment } from 'igniteui-angular/core'; import { IgxInputDirective, IgxInputGroupComponent, IgxLabelDirective } from 'igniteui-angular/input-group'; import { IgxAutocompleteDirective, IgxDropDownComponent, IgxDropDownGroupComponent, IgxDropDownItemComponent } from 'igniteui-angular/drop-down'; @@ -9,7 +9,6 @@ import { AutocompletePipeStartsWith } from '../autocomplete/autocomplete.compone selector: 'app-movie-availability', styleUrls: ['./movie.component.scss'], templateUrl: './movie.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxInputGroupComponent, IgxLabelDirective, FormsModule, IgxInputDirective, IgxAutocompleteDirective, IgxDropDownComponent, IgxDropDownGroupComponent, IgxDropDownItemComponent, AutocompletePipeStartsWith] }) export class MovieComponent { diff --git a/src/app/data-entries/buttonGroup/button-group-alignment/button-group-alignment.component.html b/src/app/data-entries/buttonGroup/button-group-alignment/button-group-alignment.component.html new file mode 100644 index 0000000000..4bf378781a --- /dev/null +++ b/src/app/data-entries/buttonGroup/button-group-alignment/button-group-alignment.component.html @@ -0,0 +1,12 @@ +
+ @for (alignment of alignments; track alignment.value) { +
+ {{ alignment.label }} + + @for (city of cities; track city) { + + } + +
+ } +
diff --git a/src/app/data-entries/buttonGroup/button-group-alignment/button-group-alignment.component.scss b/src/app/data-entries/buttonGroup/button-group-alignment/button-group-alignment.component.scss new file mode 100644 index 0000000000..d8f1c12333 --- /dev/null +++ b/src/app/data-entries/buttonGroup/button-group-alignment/button-group-alignment.component.scss @@ -0,0 +1,35 @@ +.button-group-alignment { + display: flex; + align-items: flex-start; + justify-content: center; + gap: 60px; + padding: 24px; +} + +.button-group-alignment-item { + display: flex; + flex-direction: column; + align-items: center; + justify-content: flex-start; + gap: 16px; +} + +.button-group-alignment-item igx-buttongroup { + width: 240px; +} + +.button-group-alignment-item:first-child igx-buttongroup { + width: 320px; +} + +.button-group-alignment-item span { + width: 100%; + text-align: center; + color: #556c86; + font-family: "Aktiv Grotesk", sans-serif; + font-size: 13px; + font-weight: 400; + font-style: normal; + line-height: 20px; + letter-spacing: 0.3px; +} diff --git a/src/app/data-entries/buttonGroup/button-group-alignment/button-group-alignment.component.ts b/src/app/data-entries/buttonGroup/button-group-alignment/button-group-alignment.component.ts new file mode 100644 index 0000000000..f531ba9cd9 --- /dev/null +++ b/src/app/data-entries/buttonGroup/button-group-alignment/button-group-alignment.component.ts @@ -0,0 +1,19 @@ +import { Component } from '@angular/core'; +import { ButtonGroupAlignment, IgxButtonGroupComponent } from 'igniteui-angular/button-group'; +import { IgxButtonDirective, IgxRippleDirective } from 'igniteui-angular/directives'; + +@Component({ + selector: 'app-button-group-alignment', + styleUrls: ['./button-group-alignment.component.scss'], + templateUrl: './button-group-alignment.component.html', + imports: [IgxButtonGroupComponent, IgxButtonDirective, IgxRippleDirective] +}) +export class ButtonGroupAlignmentComponent { + public rippleColor = 'gray'; + public cities = ['Sofia', 'London', 'New York']; + + public alignments: { label: string; value: ButtonGroupAlignment }[] = [ + { label: 'Horizontal', value: ButtonGroupAlignment.horizontal }, + { label: 'Vertical', value: ButtonGroupAlignment.vertical } + ]; +} diff --git a/src/app/data-entries/buttonGroup/button-group-custom-toggle/button-group-custom-toggle.component.html b/src/app/data-entries/buttonGroup/button-group-custom-toggle/button-group-custom-toggle.component.html new file mode 100644 index 0000000000..6c27c58e2a --- /dev/null +++ b/src/app/data-entries/buttonGroup/button-group-custom-toggle/button-group-custom-toggle.component.html @@ -0,0 +1,3 @@ +
+ +
diff --git a/src/app/data-entries/buttonGroup/button-group-custom-toggle/button-group-custom-toggle.component.scss b/src/app/data-entries/buttonGroup/button-group-custom-toggle/button-group-custom-toggle.component.scss new file mode 100644 index 0000000000..157e28c3ca --- /dev/null +++ b/src/app/data-entries/buttonGroup/button-group-custom-toggle/button-group-custom-toggle.component.scss @@ -0,0 +1,11 @@ +.button-group-custom-toggle { + display: flex; + justify-content: center; + align-items: center; + min-height: 7rem; +} + +igx-buttongroup { + display: inline-block; + width: 300px; +} diff --git a/src/app/data-entries/buttonGroup/button-group-sample-3/button-group-sample-3.component.ts b/src/app/data-entries/buttonGroup/button-group-custom-toggle/button-group-custom-toggle.component.ts similarity index 50% rename from src/app/data-entries/buttonGroup/button-group-sample-3/button-group-sample-3.component.ts rename to src/app/data-entries/buttonGroup/button-group-custom-toggle/button-group-custom-toggle.component.ts index f617f1e7a7..d6038eab52 100644 --- a/src/app/data-entries/buttonGroup/button-group-sample-3/button-group-sample-3.component.ts +++ b/src/app/data-entries/buttonGroup/button-group-custom-toggle/button-group-custom-toggle.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit } from '@angular/core'; import { IgxButtonGroupComponent } from 'igniteui-angular/button-group'; interface IButton { @@ -11,7 +11,7 @@ interface IButton { icon?: string; } -class ToggleButton { +class CustomToggle { private ripple: string; private label: string; private disabled: boolean; @@ -32,33 +32,20 @@ class ToggleButton { } @Component({ - selector: 'app-button-group-sample-3', - styleUrls: ['./button-group-sample-3.component.scss'], - templateUrl: './button-group-sample-3.component.html', - changeDetection: ChangeDetectionStrategy.Eager, + selector: 'app-button-group-custom-toggle', + styleUrls: ['./button-group-custom-toggle.component.scss'], + templateUrl: './button-group-custom-toggle.component.html', imports: [IgxButtonGroupComponent] }) -export class ButtonGroupSample3Component implements OnInit { - public bordersButtons: ToggleButton[]; +export class ButtonGroupCustomToggleComponent implements OnInit { + public bordersButtons: CustomToggle[]; public ngOnInit() { this.bordersButtons = [ - new ToggleButton({ - icon: 'border_top', - selected: true - }), - new ToggleButton({ - icon: 'border_right', - selected: false - }), - new ToggleButton({ - icon: 'border_bottom', - selected: false - }), - new ToggleButton({ - icon: 'border_left', - selected: false - }) + new CustomToggle({ icon: 'border_top', selected: true }), + new CustomToggle({ icon: 'border_right', selected: false }), + new CustomToggle({ icon: 'border_bottom', selected: false }), + new CustomToggle({ icon: 'border_left', selected: false }) ]; } } diff --git a/src/app/data-entries/buttonGroup/button-group-interaction-states/button-group-interaction-states.component.html b/src/app/data-entries/buttonGroup/button-group-interaction-states/button-group-interaction-states.component.html new file mode 100644 index 0000000000..49b20d26bf --- /dev/null +++ b/src/app/data-entries/buttonGroup/button-group-interaction-states/button-group-interaction-states.component.html @@ -0,0 +1,28 @@ +
+
+ + @for (state of states; track state) { + {{ getLabel(state) }} + } +
+ + @for (row of rows; track row.label) { +
+ {{ row.label }} + @for (state of states; track state) { + + + + } +
+ } +
diff --git a/src/app/data-entries/buttonGroup/button-group-interaction-states/button-group-interaction-states.component.scss b/src/app/data-entries/buttonGroup/button-group-interaction-states/button-group-interaction-states.component.scss new file mode 100644 index 0000000000..c78233443a --- /dev/null +++ b/src/app/data-entries/buttonGroup/button-group-interaction-states/button-group-interaction-states.component.scss @@ -0,0 +1,73 @@ +.button-group-interaction-states { + display: flex; + align-items: center; + justify-content: center; + flex-direction: column; + gap: 20px; + padding: 20px; +} + +.button-group-interaction-states-row { + display: grid; + grid-template-columns: 120px 164px 164px 164px; + align-items: center; + gap: 16px; +} + +.button-group-interaction-states .row-label, +.button-group-interaction-states .column-label { + color: #556c86; + font-family: "Aktiv Grotesk", sans-serif; + font-size: 13px; + font-weight: 400; + font-style: normal; + line-height: 20px; + letter-spacing: 0.3px; +} + +.button-group-interaction-states .column-label { + text-align: center; +} + +.button-group-interaction-states igx-buttongroup { + width: 164px; +} + +.button-group-interaction-states button { + width: 100%; + gap: 4px; +} + +.button-group-interaction-states igx-icon { + --ig-icon-size: 16px; +} + +.button-group-interaction-states button.state-hover:not(.state-selected) { + background: var(--item-hover-background); + border-color: var(--item-hover-border-color); + color: var(--item-hover-text-color); +} + +.button-group-interaction-states button.state-idle.state-selected { + background: var(--item-active-background); + border-color: var(--item-active-border-color); + color: var(--item-active-text-color); +} + +.button-group-interaction-states button.state-focused:not(.state-selected) { + background: var(--item-focused-hover-background); + border-color: var(--item-focused-hover-border-color); + color: var(--item-focused-hover-text-color); +} + +.button-group-interaction-states button.state-hover.state-selected { + background: var(--item-selected-active-background); + border-color: var(--item-selected-active-border-color); + color: var(--item-selected-hover-text-color); +} + +.button-group-interaction-states button.state-focused.state-selected { + background: var(--item-selected-active-background); + border-color: var(--item-selected-active-border-color); + color: var(--item-focused-hover-text-color); +} diff --git a/src/app/data-entries/buttonGroup/button-group-interaction-states/button-group-interaction-states.component.ts b/src/app/data-entries/buttonGroup/button-group-interaction-states/button-group-interaction-states.component.ts new file mode 100644 index 0000000000..6801887289 --- /dev/null +++ b/src/app/data-entries/buttonGroup/button-group-interaction-states/button-group-interaction-states.component.ts @@ -0,0 +1,25 @@ +import { Component } from '@angular/core'; +import { IgxButtonGroupComponent } from 'igniteui-angular/button-group'; +import { IgxButtonDirective, IgxRippleDirective } from 'igniteui-angular/directives'; +import { IgxIconComponent } from 'igniteui-angular/icon'; + +@Component({ + selector: 'app-button-group-interaction-states', + styleUrls: ['./button-group-interaction-states.component.scss'], + templateUrl: './button-group-interaction-states.component.html', + imports: [IgxButtonGroupComponent, IgxButtonDirective, IgxRippleDirective, IgxIconComponent] +}) +export class ButtonGroupInteractionStatesComponent { + public rippleColor = 'gray'; + + public rows: { label: string; selected: boolean }[] = [ + { label: 'Selected / Off', selected: false }, + { label: 'Selected / On', selected: true } + ]; + + public states = ['idle', 'hover', 'focused']; + + public getLabel(state: string) { + return state.charAt(0).toUpperCase() + state.slice(1); + } +} diff --git a/src/app/data-entries/buttonGroup/button-group-layout/button-group-layout.component.html b/src/app/data-entries/buttonGroup/button-group-layout/button-group-layout.component.html new file mode 100644 index 0000000000..f2cee52a01 --- /dev/null +++ b/src/app/data-entries/buttonGroup/button-group-layout/button-group-layout.component.html @@ -0,0 +1,15 @@ +
+ + @for (layout of layouts; track layout.value) { + + } + + + + @for (layout of layouts; track layout.value) { + + } + +
diff --git a/src/app/data-entries/buttonGroup/button-group-layout/button-group-layout.component.scss b/src/app/data-entries/buttonGroup/button-group-layout/button-group-layout.component.scss new file mode 100644 index 0000000000..fc95cf4014 --- /dev/null +++ b/src/app/data-entries/buttonGroup/button-group-layout/button-group-layout.component.scss @@ -0,0 +1,21 @@ +.button-group-layout { + display: flex; + flex-direction: row; + align-items: center; + justify-content: center; + gap: 80px; + min-height: 5.5rem; +} + +igx-buttongroup { + display: inline-block; + max-width: 400px; +} + +.button-group-layout button { + min-width: 100px; +} + +.button-group-layout igx-icon { + --ig-icon-size: 20px; +} diff --git a/src/app/data-entries/buttonGroup/button-group-layout/button-group-layout.component.ts b/src/app/data-entries/buttonGroup/button-group-layout/button-group-layout.component.ts new file mode 100644 index 0000000000..7a200f3a57 --- /dev/null +++ b/src/app/data-entries/buttonGroup/button-group-layout/button-group-layout.component.ts @@ -0,0 +1,20 @@ +import { Component } from '@angular/core'; +import { IgxButtonGroupComponent } from 'igniteui-angular/button-group'; +import { IgxButtonDirective, IgxRippleDirective } from 'igniteui-angular/directives'; +import { IgxIconComponent } from 'igniteui-angular/icon'; + +@Component({ + selector: 'app-button-group-layout', + styleUrls: ['./button-group-layout.component.scss'], + templateUrl: './button-group-layout.component.html', + imports: [IgxButtonGroupComponent, IgxButtonDirective, IgxRippleDirective, IgxIconComponent] +}) +export class ButtonGroupLayoutComponent { + public rippleColor = 'gray'; + + public layouts = [ + { value: 'left', label: 'Left', icon: 'format_align_left' }, + { value: 'center', label: 'Center', icon: 'format_align_center' }, + { value: 'right', label: 'Right', icon: 'format_align_right' } + ]; +} diff --git a/src/app/data-entries/buttonGroup/button-group-overview/button-group-overview.component.html b/src/app/data-entries/buttonGroup/button-group-overview/button-group-overview.component.html new file mode 100644 index 0000000000..e6f995b8d8 --- /dev/null +++ b/src/app/data-entries/buttonGroup/button-group-overview/button-group-overview.component.html @@ -0,0 +1,19 @@ +
+ + + + + +
+ {{ album.title }} +
+ @for (photo of album.photos; track photo) { + + } +
+
+
diff --git a/src/app/data-entries/buttonGroup/button-group-overview/button-group-overview.component.scss b/src/app/data-entries/buttonGroup/button-group-overview/button-group-overview.component.scss new file mode 100644 index 0000000000..128e5f6f92 --- /dev/null +++ b/src/app/data-entries/buttonGroup/button-group-overview/button-group-overview.component.scss @@ -0,0 +1,35 @@ +.button-group-overview { + display: flex; + flex-direction: column; + align-items: center; +} + +igx-buttongroup { + display: block; + width: 280px; + max-width: 100%; +} + +.album { + margin-top: 8px; + width: 280px; + max-width: 100%; +} + +.album-title { + display: inline-block; + margin-bottom: 8px; + color: #1f89d4; +} + +.album-photos { + display: grid; + grid-template-columns: repeat(2, 1fr); + gap: 4px; +} + +.album-photos img { + width: 100%; + object-fit: cover; + display: block; +} diff --git a/src/app/data-entries/buttonGroup/button-group-overview/button-group-overview.component.ts b/src/app/data-entries/buttonGroup/button-group-overview/button-group-overview.component.ts new file mode 100644 index 0000000000..0daa96866b --- /dev/null +++ b/src/app/data-entries/buttonGroup/button-group-overview/button-group-overview.component.ts @@ -0,0 +1,45 @@ +import { Component } from '@angular/core'; +import { IgxButtonGroupComponent } from 'igniteui-angular/button-group'; +import { IgxButtonDirective, IgxRippleDirective } from 'igniteui-angular/directives'; + +type AlbumSource = 'device' | 'cloud'; + +@Component({ + selector: 'app-button-group-overview', + styleUrls: ['./button-group-overview.component.scss'], + templateUrl: './button-group-overview.component.html', + imports: [IgxButtonGroupComponent, IgxButtonDirective, IgxRippleDirective] +}) +export class ButtonGroupOverviewComponent { + public rippleColor = 'gray'; + public source: AlbumSource = 'cloud'; + + public albums: Record = { + device: { + title: 'Trip around the world', + photos: [ + 'https://picsum.photos/id/1015/300/220', + 'https://picsum.photos/id/1016/300/220', + 'https://picsum.photos/id/1018/300/220', + 'https://picsum.photos/id/1019/300/220' + ] + }, + cloud: { + title: 'Trip around the world', + photos: [ + 'https://picsum.photos/id/1036/300/220', + 'https://picsum.photos/id/1051/300/220', + 'https://picsum.photos/id/1062/300/220', + 'https://picsum.photos/id/1067/300/220' + ] + } + }; + + public get album() { + return this.albums[this.source]; + } + + public selectSource(source: AlbumSource) { + this.source = source; + } +} diff --git a/src/app/data-entries/buttonGroup/button-group-sample-1/button-group-sample-1.component.html b/src/app/data-entries/buttonGroup/button-group-sample-1/button-group-sample-1.component.html deleted file mode 100644 index 854a5f1c11..0000000000 --- a/src/app/data-entries/buttonGroup/button-group-sample-1/button-group-sample-1.component.html +++ /dev/null @@ -1,16 +0,0 @@ -
- - - - - - -
diff --git a/src/app/data-entries/buttonGroup/button-group-sample-1/button-group-sample-1.component.scss b/src/app/data-entries/buttonGroup/button-group-sample-1/button-group-sample-1.component.scss deleted file mode 100644 index 2f0579e90d..0000000000 --- a/src/app/data-entries/buttonGroup/button-group-sample-1/button-group-sample-1.component.scss +++ /dev/null @@ -1,4 +0,0 @@ -igx-buttongroup{ - display: inline-block; - max-width: 400px; -} diff --git a/src/app/data-entries/buttonGroup/button-group-sample-1/button-group-sample-1.component.ts b/src/app/data-entries/buttonGroup/button-group-sample-1/button-group-sample-1.component.ts deleted file mode 100644 index 1cfab30696..0000000000 --- a/src/app/data-entries/buttonGroup/button-group-sample-1/button-group-sample-1.component.ts +++ /dev/null @@ -1,16 +0,0 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; -import { IgxButtonGroupComponent } from 'igniteui-angular/button-group'; -import { IgxButtonDirective, IgxRippleDirective } from 'igniteui-angular/directives'; -import { IgxIconComponent } from 'igniteui-angular/icon'; - -@Component({ - selector: 'app-button-group-sample-1', - styleUrls: ['./button-group-sample-1.component.scss'], - templateUrl: './button-group-sample-1.component.html', - changeDetection: ChangeDetectionStrategy.Eager, - imports: [IgxButtonGroupComponent, IgxButtonDirective, IgxRippleDirective, IgxIconComponent] -}) - -export class ButtonGroupSample1Component { - public rippleColor = 'grey'; -} diff --git a/src/app/data-entries/buttonGroup/button-group-sample-2/button-group-sample-2.component.html b/src/app/data-entries/buttonGroup/button-group-sample-2/button-group-sample-2.component.html deleted file mode 100644 index 0a027f389c..0000000000 --- a/src/app/data-entries/buttonGroup/button-group-sample-2/button-group-sample-2.component.html +++ /dev/null @@ -1,8 +0,0 @@ -
- - - - - - -
\ No newline at end of file diff --git a/src/app/data-entries/buttonGroup/button-group-sample-2/button-group-sample-2.component.scss b/src/app/data-entries/buttonGroup/button-group-sample-2/button-group-sample-2.component.scss deleted file mode 100644 index d252d95ade..0000000000 --- a/src/app/data-entries/buttonGroup/button-group-sample-2/button-group-sample-2.component.scss +++ /dev/null @@ -1,4 +0,0 @@ -igx-buttongroup{ - display: inline-block; - width: 200px; -} diff --git a/src/app/data-entries/buttonGroup/button-group-sample-2/button-group-sample-2.component.ts b/src/app/data-entries/buttonGroup/button-group-sample-2/button-group-sample-2.component.ts deleted file mode 100644 index dc0ecf0a95..0000000000 --- a/src/app/data-entries/buttonGroup/button-group-sample-2/button-group-sample-2.component.ts +++ /dev/null @@ -1,15 +0,0 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; -import { ButtonGroupAlignment, IgxButtonGroupComponent } from 'igniteui-angular/button-group'; -import { IgxButtonDirective, IgxRippleDirective } from 'igniteui-angular/directives'; - -@Component({ - selector: 'app-button-group-sample-2', - styleUrls: ['./button-group-sample-2.component.scss'], - templateUrl: './button-group-sample-2.component.html', - changeDetection: ChangeDetectionStrategy.Eager, - imports: [IgxButtonGroupComponent, IgxButtonDirective, IgxRippleDirective] -}) -export class ButtonGroupSample2Component { - public alignment = ButtonGroupAlignment.vertical; - public rippleColor = 'grey'; -} diff --git a/src/app/data-entries/buttonGroup/button-group-sample-3/button-group-sample-3.component.html b/src/app/data-entries/buttonGroup/button-group-sample-3/button-group-sample-3.component.html deleted file mode 100644 index bf17c25433..0000000000 --- a/src/app/data-entries/buttonGroup/button-group-sample-3/button-group-sample-3.component.html +++ /dev/null @@ -1,3 +0,0 @@ -
- -
\ No newline at end of file diff --git a/src/app/data-entries/buttonGroup/button-group-sample-3/button-group-sample-3.component.scss b/src/app/data-entries/buttonGroup/button-group-sample-3/button-group-sample-3.component.scss deleted file mode 100644 index 9615aaba0b..0000000000 --- a/src/app/data-entries/buttonGroup/button-group-sample-3/button-group-sample-3.component.scss +++ /dev/null @@ -1,4 +0,0 @@ -igx-buttongroup { - display: inline-block; - width: 300px; -} diff --git a/src/app/data-entries/buttonGroup/button-group-sample-4/button-group-sample.component.html b/src/app/data-entries/buttonGroup/button-group-sample-4/button-group-sample.component.html deleted file mode 100644 index 6bbc9282af..0000000000 --- a/src/app/data-entries/buttonGroup/button-group-sample-4/button-group-sample.component.html +++ /dev/null @@ -1,19 +0,0 @@ -
-
Selection Mode
-
- Single - Single-Required - Multi -
- - - - - -
\ No newline at end of file diff --git a/src/app/data-entries/buttonGroup/button-group-sample-4/button-group-sample.component.scss b/src/app/data-entries/buttonGroup/button-group-sample-4/button-group-sample.component.scss deleted file mode 100644 index e72ce547c6..0000000000 --- a/src/app/data-entries/buttonGroup/button-group-sample-4/button-group-sample.component.scss +++ /dev/null @@ -1,10 +0,0 @@ -.sample-column, -.radio-buttons { - display: flex; - gap: 16px; -} - -.sample-column { - flex-direction: column; - align-items: flex-start; -} diff --git a/src/app/data-entries/buttonGroup/button-group-sample-4/button-group-sample.component.ts b/src/app/data-entries/buttonGroup/button-group-sample-4/button-group-sample.component.ts deleted file mode 100644 index e27e36a6eb..0000000000 --- a/src/app/data-entries/buttonGroup/button-group-sample-4/button-group-sample.component.ts +++ /dev/null @@ -1,18 +0,0 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; -import { IgxRadioComponent } from 'igniteui-angular/radio'; -import { IgxButtonGroupComponent } from 'igniteui-angular/button-group'; -import { IgxButtonDirective, IgxRippleDirective } from 'igniteui-angular/directives'; -import { IgxIconComponent } from 'igniteui-angular/icon'; -import { FormsModule } from '@angular/forms'; - -@Component({ - selector: 'app-button-group-sample', - styleUrls: ['./button-group-sample.component.scss'], - templateUrl: './button-group-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, - imports: [IgxRadioComponent, FormsModule, IgxButtonGroupComponent, IgxButtonDirective, IgxRippleDirective, IgxIconComponent] -}) -export class ButtonGroupSampleComponent { - public rippleColor = 'grey'; - public selectionMode: 'single' | 'singleRequired' | 'multi' = 'single'; -} diff --git a/src/app/data-entries/buttonGroup/button-group-sample-5/button-group-sample-5.component.html b/src/app/data-entries/buttonGroup/button-group-sample-5/button-group-sample-5.component.html deleted file mode 100644 index baaf314768..0000000000 --- a/src/app/data-entries/buttonGroup/button-group-sample-5/button-group-sample-5.component.html +++ /dev/null @@ -1,3 +0,0 @@ -
- -
diff --git a/src/app/data-entries/buttonGroup/button-group-sample-5/button-group-sample-5.component.scss b/src/app/data-entries/buttonGroup/button-group-sample-5/button-group-sample-5.component.scss deleted file mode 100644 index bfd80266c3..0000000000 --- a/src/app/data-entries/buttonGroup/button-group-sample-5/button-group-sample-5.component.scss +++ /dev/null @@ -1,3 +0,0 @@ -igx-buttongroup{ - display: inline-block; -} \ No newline at end of file diff --git a/src/app/data-entries/buttonGroup/button-group-sample-5/button-group-sample-5.component.ts b/src/app/data-entries/buttonGroup/button-group-sample-5/button-group-sample-5.component.ts deleted file mode 100644 index 1caec387ba..0000000000 --- a/src/app/data-entries/buttonGroup/button-group-sample-5/button-group-sample-5.component.ts +++ /dev/null @@ -1,39 +0,0 @@ -import { Component, HostBinding, OnInit, ChangeDetectionStrategy } from '@angular/core'; -import { IgxButtonGroupComponent } from 'igniteui-angular/button-group'; - -type Button = { - label: string, - selected: boolean, - togglable: boolean -} - -@Component({ - selector: 'app-button-group-sample-5', - styleUrls: ['./button-group-sample-5.component.scss'], - templateUrl: './button-group-sample-5.component.html', - changeDetection: ChangeDetectionStrategy.Eager, - imports: [IgxButtonGroupComponent] -}) -export class ButtonGroupSample5Component implements OnInit { - public rippleColor = 'grey'; - public size = 'large'; - public sizes: Button[]; - - public ngOnInit() { - this.sizes = [ - { label: 'small', selected: this.size === 'small', togglable: true }, - { label: 'medium', selected: this.size === 'medium', togglable: true }, - { label: 'large', selected: this.size === 'large', togglable: true } - ]; - } - - public selectSize(event: any) { - this.size = this.sizes[event.index].label; - } - - - @HostBinding('style.--ig-size') - protected get sizeStyle() { - return `var(--ig-size-${this.size})`; - } -} diff --git a/src/app/data-entries/buttonGroup/button-group-selection/button-group-selection.component.html b/src/app/data-entries/buttonGroup/button-group-selection/button-group-selection.component.html new file mode 100644 index 0000000000..65ff4542c1 --- /dev/null +++ b/src/app/data-entries/buttonGroup/button-group-selection/button-group-selection.component.html @@ -0,0 +1,18 @@ +
+ @for (mode of selectionModes; track mode.value) { +
+ {{ mode.label }} + + + + + +
+ } +
diff --git a/src/app/data-entries/buttonGroup/button-group-selection/button-group-selection.component.scss b/src/app/data-entries/buttonGroup/button-group-selection/button-group-selection.component.scss new file mode 100644 index 0000000000..7e52239fa8 --- /dev/null +++ b/src/app/data-entries/buttonGroup/button-group-selection/button-group-selection.component.scss @@ -0,0 +1,30 @@ +.selection-samples { + display: flex; + justify-content: center; + flex-direction: column; + align-items: flex-start; + gap: 35px; + padding-left: 48px; +} + +.selection-sample { + display: flex; + align-items: center; + gap: 30px; +} + +.selection-sample > span { + width: 120px; + text-align: right; + color: #556c86; + font-family: "Aktiv Grotesk", sans-serif; + font-size: 13px; + font-weight: 400; + font-style: normal; + line-height: 20px; + letter-spacing: 0.3px; +} + +.selection-sample igx-buttongroup { + width: 200px; +} diff --git a/src/app/data-entries/buttonGroup/button-group-selection/button-group-selection.component.ts b/src/app/data-entries/buttonGroup/button-group-selection/button-group-selection.component.ts new file mode 100644 index 0000000000..f1b9c738d0 --- /dev/null +++ b/src/app/data-entries/buttonGroup/button-group-selection/button-group-selection.component.ts @@ -0,0 +1,30 @@ +import { Component } from '@angular/core'; +import { IgxButtonGroupComponent } from 'igniteui-angular/button-group'; +import { IgxButtonDirective, IgxRippleDirective } from 'igniteui-angular/directives'; +import { IgxIconComponent } from 'igniteui-angular/icon'; + +type SelectionMode = 'single' | 'singleRequired' | 'multi'; + +@Component({ + selector: 'app-button-group-selection', + styleUrls: ['./button-group-selection.component.scss'], + templateUrl: './button-group-selection.component.html', + imports: [IgxButtonGroupComponent, IgxButtonDirective, IgxRippleDirective, IgxIconComponent] +}) +export class ButtonGroupSelectionComponent { + public rippleColor = 'gray'; + + public selectionModes: { label: string; value: SelectionMode }[] = [ + { label: 'Single', value: 'single' }, + { label: 'Single-Required', value: 'singleRequired' }, + { label: 'Multi', value: 'multi' } + ]; + + public isBoldSelected(mode: SelectionMode) { + return mode === 'singleRequired' || mode === 'multi'; + } + + public isItalicSelected(mode: SelectionMode) { + return mode === 'multi'; + } +} diff --git a/src/app/data-entries/buttonGroup/button-group-size/button-group-size.component.html b/src/app/data-entries/buttonGroup/button-group-size/button-group-size.component.html new file mode 100644 index 0000000000..57418c0d59 --- /dev/null +++ b/src/app/data-entries/buttonGroup/button-group-size/button-group-size.component.html @@ -0,0 +1,16 @@ +
+ @for (size of sizes; track size) { +
+ {{ getLabel(size) }} + + @for (city of cities; track city) { + + } + +
+ } +
diff --git a/src/app/data-entries/buttonGroup/button-group-size/button-group-size.component.scss b/src/app/data-entries/buttonGroup/button-group-size/button-group-size.component.scss new file mode 100644 index 0000000000..7d9127e015 --- /dev/null +++ b/src/app/data-entries/buttonGroup/button-group-size/button-group-size.component.scss @@ -0,0 +1,41 @@ +.button-group-size { + display: flex; + flex-direction: column; + align-items: flex-start; + justify-content: center; + gap: 32px; + padding: 13px; + padding-left: 3rem; +} + +.button-group-size-item { + display: flex; + flex-direction: row; + align-items: center; + justify-content: flex-start; + gap: 32px; +} + +.button-group-size-item span { + width: 52px; + text-align: right; + color: #556c86; + font-family: "Aktiv Grotesk", sans-serif; + font-size: 13px; + font-weight: 400; + font-style: normal; + line-height: 20px; + letter-spacing: 0.3px; +} + +.button-group-small button { + min-width: 90px; +} + +.button-group-medium button { + min-width: 100px; +} + +.button-group-large button { + min-width: 110px; +} diff --git a/src/app/data-entries/buttonGroup/button-group-size/button-group-size.component.ts b/src/app/data-entries/buttonGroup/button-group-size/button-group-size.component.ts new file mode 100644 index 0000000000..9fb454b60d --- /dev/null +++ b/src/app/data-entries/buttonGroup/button-group-size/button-group-size.component.ts @@ -0,0 +1,23 @@ +import { Component } from '@angular/core'; +import { IgxButtonGroupComponent } from 'igniteui-angular/button-group'; +import { IgxButtonDirective, IgxRippleDirective } from 'igniteui-angular/directives'; + +@Component({ + selector: 'app-button-group-size', + styleUrls: ['./button-group-size.component.scss'], + templateUrl: './button-group-size.component.html', + imports: [IgxButtonGroupComponent, IgxButtonDirective, IgxRippleDirective] +}) +export class ButtonGroupSizeComponent { + public rippleColor = 'gray'; + public cities = ['Sofia', 'London', 'New York']; + public sizes = ['small', 'medium', 'large']; + + public getLabel(size: string) { + return size.charAt(0).toUpperCase() + size.slice(1); + } + + public getSizeStyle(size: string) { + return `var(--ig-size-${size})`; + } +} diff --git a/src/app/data-entries/buttonGroup/button-group-states/button-group-states.component.html b/src/app/data-entries/buttonGroup/button-group-states/button-group-states.component.html new file mode 100644 index 0000000000..81234c33df --- /dev/null +++ b/src/app/data-entries/buttonGroup/button-group-states/button-group-states.component.html @@ -0,0 +1,26 @@ +
+
+ + Enabled + Disabled +
+ + @for (row of rows; track row.label) { +
+ {{ row.label }} + + + + + + + + +
+ } +
diff --git a/src/app/data-entries/buttonGroup/button-group-states/button-group-states.component.scss b/src/app/data-entries/buttonGroup/button-group-states/button-group-states.component.scss new file mode 100644 index 0000000000..c823cd9347 --- /dev/null +++ b/src/app/data-entries/buttonGroup/button-group-states/button-group-states.component.scss @@ -0,0 +1,41 @@ +.button-group-states { + display: flex; + align-items: center; + justify-content: center; + flex-direction: column; + gap: 20px; + padding: 20px; +} + +.button-group-states-row { + display: grid; + grid-template-columns: 120px 160px 160px; + align-items: center; + gap: 16px; +} + +.button-group-states .row-label, +.button-group-states .column-label { + color: #556c86; + font-family: "Aktiv Grotesk", sans-serif; + font-size: 13px; + font-weight: 400; + font-style: normal; + line-height: 20px; + letter-spacing: 0.3px; + text-align: center; +} + +.button-group-states igx-buttongroup { + width: 160px; +} + +.button-group-states button { + width: 100%; +} + +.button-group-states button.state-idle.state-selected { + background: var(--item-active-background); + border-color: var(--item-active-border-color); + color: var(--item-active-text-color); +} diff --git a/src/app/data-entries/buttonGroup/button-group-states/button-group-states.component.ts b/src/app/data-entries/buttonGroup/button-group-states/button-group-states.component.ts new file mode 100644 index 0000000000..993fefe7e0 --- /dev/null +++ b/src/app/data-entries/buttonGroup/button-group-states/button-group-states.component.ts @@ -0,0 +1,18 @@ +import { Component } from '@angular/core'; +import { IgxButtonGroupComponent } from 'igniteui-angular/button-group'; +import { IgxButtonDirective, IgxRippleDirective } from 'igniteui-angular/directives'; + +@Component({ + selector: 'app-button-group-states', + styleUrls: ['./button-group-states.component.scss'], + templateUrl: './button-group-states.component.html', + imports: [IgxButtonGroupComponent, IgxButtonDirective, IgxRippleDirective] +}) +export class ButtonGroupStatesComponent { + public rippleColor = 'gray'; + + public rows: { label: string; selected: boolean }[] = [ + { label: 'Selected / Off', selected: false }, + { label: 'Selected / On', selected: true } + ]; +} diff --git a/src/app/data-entries/buttonGroup/button-group-style/button-group-style.component.html b/src/app/data-entries/buttonGroup/button-group-style/button-group-style.component.html deleted file mode 100644 index a3d364e034..0000000000 --- a/src/app/data-entries/buttonGroup/button-group-style/button-group-style.component.html +++ /dev/null @@ -1,8 +0,0 @@ -
- - - - - - -
diff --git a/src/app/data-entries/buttonGroup/button-group-style/button-group-style.component.scss b/src/app/data-entries/buttonGroup/button-group-style/button-group-style.component.scss deleted file mode 100644 index a0b99d8400..0000000000 --- a/src/app/data-entries/buttonGroup/button-group-style/button-group-style.component.scss +++ /dev/null @@ -1,10 +0,0 @@ -@use "layout.scss" as *; -@use "igniteui-angular/theming" as *; - -$custom-button-group: button-group-theme( - $item-background: #57a5cd, -); - -:host { - @include tokens($custom-button-group); -} diff --git a/src/app/data-entries/buttonGroup/button-group-style/button-group-style.component.ts b/src/app/data-entries/buttonGroup/button-group-style/button-group-style.component.ts deleted file mode 100644 index ab7a00e512..0000000000 --- a/src/app/data-entries/buttonGroup/button-group-style/button-group-style.component.ts +++ /dev/null @@ -1,14 +0,0 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; -import { ButtonGroupAlignment, IgxButtonGroupComponent } from 'igniteui-angular/button-group'; -import { IgxButtonDirective, IgxRippleDirective } from 'igniteui-angular/directives'; - -@Component({ - selector: 'app-button-group-style', - styleUrls: ['./button-group-style.component.scss'], - templateUrl: './button-group-style.component.html', - changeDetection: ChangeDetectionStrategy.Eager, - imports: [IgxButtonGroupComponent, IgxButtonDirective, IgxRippleDirective] -}) -export class ButtonGroupStyleComponent { - public alignment = ButtonGroupAlignment.vertical; -} diff --git a/src/app/data-entries/buttonGroup/button-group-style/layout.scss b/src/app/data-entries/buttonGroup/button-group-style/layout.scss deleted file mode 100644 index 2f8fa57371..0000000000 --- a/src/app/data-entries/buttonGroup/button-group-style/layout.scss +++ /dev/null @@ -1,4 +0,0 @@ -igx-buttongroup { - display: inline-block; - width: 200px; -} \ No newline at end of file diff --git a/src/app/data-entries/buttonGroup/button-group-styling/button-group-styling.component.html b/src/app/data-entries/buttonGroup/button-group-styling/button-group-styling.component.html new file mode 100644 index 0000000000..c59162f0a1 --- /dev/null +++ b/src/app/data-entries/buttonGroup/button-group-styling/button-group-styling.component.html @@ -0,0 +1,7 @@ +
+ + @for (layout of layouts; track layout) { + + } + +
diff --git a/src/app/data-entries/buttonGroup/button-group-styling/button-group-styling.component.scss b/src/app/data-entries/buttonGroup/button-group-styling/button-group-styling.component.scss new file mode 100644 index 0000000000..4475acc9d9 --- /dev/null +++ b/src/app/data-entries/buttonGroup/button-group-styling/button-group-styling.component.scss @@ -0,0 +1,20 @@ +@use "layout.scss" as *; +@use "igniteui-angular/theming" as *; + +$custom-button-group: button-group-theme( + $item-text-color: #4a5a66, + $item-background: #cfe8fb, + $item-border-color: #4da3e8, + $item-hover-text-color: #4a5a66, + $item-hover-background: #b3daf8, + $item-hover-border-color: #4da3e8, + $item-selected-text-color: #2f4d6a, + $item-selected-background: #6db3ea, + $item-selected-border-color: #4da3e8, + $item-selected-hover-text-color: #2f4d6a, + $item-selected-hover-background: #6db3ea +); + +:host { + @include tokens($custom-button-group); +} diff --git a/src/app/data-entries/buttonGroup/button-group-styling/button-group-styling.component.ts b/src/app/data-entries/buttonGroup/button-group-styling/button-group-styling.component.ts new file mode 100644 index 0000000000..b963986943 --- /dev/null +++ b/src/app/data-entries/buttonGroup/button-group-styling/button-group-styling.component.ts @@ -0,0 +1,14 @@ +import { Component } from '@angular/core'; +import { IgxButtonGroupComponent } from 'igniteui-angular/button-group'; +import { IgxButtonDirective, IgxRippleDirective } from 'igniteui-angular/directives'; + +@Component({ + selector: 'app-button-group-styling', + styleUrls: ['./button-group-styling.component.scss'], + templateUrl: './button-group-styling.component.html', + imports: [IgxButtonGroupComponent, IgxButtonDirective, IgxRippleDirective] +}) +export class ButtonGroupStylingComponent { + public rippleColor = 'gray'; + public layouts = ['Left', 'Center', 'Right']; +} diff --git a/src/app/data-entries/buttonGroup/button-group-styling/layout.scss b/src/app/data-entries/buttonGroup/button-group-styling/layout.scss new file mode 100644 index 0000000000..544499adef --- /dev/null +++ b/src/app/data-entries/buttonGroup/button-group-styling/layout.scss @@ -0,0 +1,13 @@ +.button-group-styling { + display: flex; + align-items: center; + justify-content: center; + min-height: 7rem; +} + +igx-buttongroup { + width: 420px; + border: 2px solid #4da3e8; + border-radius: 4px; + overflow: hidden; +} diff --git a/src/app/data-entries/buttonGroup/button-group-tailwind-style/button-group-tailwind-style.component.html b/src/app/data-entries/buttonGroup/button-group-tailwind-style/button-group-tailwind-style.component.html deleted file mode 100644 index 868c9452a4..0000000000 --- a/src/app/data-entries/buttonGroup/button-group-tailwind-style/button-group-tailwind-style.component.html +++ /dev/null @@ -1,8 +0,0 @@ -
- - - - - - -
diff --git a/src/app/data-entries/buttonGroup/button-group-tailwind-style/button-group-tailwind-style.component.scss b/src/app/data-entries/buttonGroup/button-group-tailwind-style/button-group-tailwind-style.component.scss deleted file mode 100644 index e69de29bb2..0000000000 diff --git a/src/app/data-entries/buttonGroup/button-group-tailwind-style/button-group-tailwind-style.component.ts b/src/app/data-entries/buttonGroup/button-group-tailwind-style/button-group-tailwind-style.component.ts deleted file mode 100644 index 66f9dfd41d..0000000000 --- a/src/app/data-entries/buttonGroup/button-group-tailwind-style/button-group-tailwind-style.component.ts +++ /dev/null @@ -1,13 +0,0 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; -import { ButtonGroupAlignment, IgxButtonGroupComponent } from 'igniteui-angular/button-group'; -import { IgxButtonDirective, IgxRippleDirective } from 'igniteui-angular/directives'; - -@Component({ - selector: 'app-button-group-tailwind-style', - styleUrls: ['./button-group-tailwind-style.component.scss'], - templateUrl: './button-group-tailwind-style.component.html', - changeDetection: ChangeDetectionStrategy.Eager, - imports: [IgxButtonGroupComponent, IgxButtonDirective, IgxRippleDirective] -}) -export class ButtonGroupTailwindStyleComponent { -} diff --git a/src/app/data-entries/buttonGroup/button-group-tailwind-styling/button-group-tailwind-styling.component.html b/src/app/data-entries/buttonGroup/button-group-tailwind-styling/button-group-tailwind-styling.component.html new file mode 100644 index 0000000000..8a1bc14d88 --- /dev/null +++ b/src/app/data-entries/buttonGroup/button-group-tailwind-styling/button-group-tailwind-styling.component.html @@ -0,0 +1,7 @@ +
+ + @for (view of views; track view) { + + } + +
diff --git a/src/app/data-entries/buttonGroup/button-group-tailwind-styling/button-group-tailwind-styling.component.scss b/src/app/data-entries/buttonGroup/button-group-tailwind-styling/button-group-tailwind-styling.component.scss new file mode 100644 index 0000000000..2c28a26070 --- /dev/null +++ b/src/app/data-entries/buttonGroup/button-group-tailwind-styling/button-group-tailwind-styling.component.scss @@ -0,0 +1,15 @@ +@use "layout.scss"; + +.button-group-style { + --item-text-color: #6d28d9; + --item-background: #ffffff; + --item-border-color: #c4b5fd; + --item-hover-text-color: #6d28d9; + --item-hover-background: #fae8ff; + --item-hover-border-color: #c4b5fd; + --item-selected-text-color: #ffffff; + --item-selected-background: #7c3aed; + --item-selected-border-color: #c4b5fd; + --item-selected-hover-text-color: #ffffff; + --item-selected-hover-background: #7c3aed; +} diff --git a/src/app/data-entries/buttonGroup/button-group-tailwind-styling/button-group-tailwind-styling.component.ts b/src/app/data-entries/buttonGroup/button-group-tailwind-styling/button-group-tailwind-styling.component.ts new file mode 100644 index 0000000000..431471a677 --- /dev/null +++ b/src/app/data-entries/buttonGroup/button-group-tailwind-styling/button-group-tailwind-styling.component.ts @@ -0,0 +1,14 @@ +import { Component } from '@angular/core'; +import { IgxButtonGroupComponent } from 'igniteui-angular/button-group'; +import { IgxButtonDirective, IgxRippleDirective } from 'igniteui-angular/directives'; + +@Component({ + selector: 'app-button-group-tailwind-styling', + styleUrls: ['./button-group-tailwind-styling.component.scss'], + templateUrl: './button-group-tailwind-styling.component.html', + imports: [IgxButtonGroupComponent, IgxButtonDirective, IgxRippleDirective] +}) +export class ButtonGroupTailwindStylingComponent { + public rippleColor = 'gray'; + public views = ['Day', 'Week', 'Month']; +} diff --git a/src/app/data-entries/buttonGroup/button-group-tailwind-styling/layout.scss b/src/app/data-entries/buttonGroup/button-group-tailwind-styling/layout.scss new file mode 100644 index 0000000000..4b18df3f16 --- /dev/null +++ b/src/app/data-entries/buttonGroup/button-group-tailwind-styling/layout.scss @@ -0,0 +1,16 @@ +.button-group-tailwind-styling { + display: flex; + align-items: center; + justify-content: center; + min-height: 7rem; + width: 100%; + padding: 1.5rem; + box-sizing: border-box; + background: #f5f3ff; +} + +.button-group-tailwind-styling igx-buttongroup { + width: 420px; + max-width: 100%; + overflow: hidden; +} diff --git a/src/app/data-entries/buttons/buttons-disabled-sample/buttons-disabled-sample.ts b/src/app/data-entries/buttons/buttons-disabled-sample/buttons-disabled-sample.ts index 9ab4c0786f..c3542a0796 100644 --- a/src/app/data-entries/buttons/buttons-disabled-sample/buttons-disabled-sample.ts +++ b/src/app/data-entries/buttons/buttons-disabled-sample/buttons-disabled-sample.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxButtonDirective } from 'igniteui-angular/directives'; @Component({ selector: 'app-buttons-disabled-sample', styleUrls: ['./buttons-disabled-sample.scss'], templateUrl: './buttons-disabled-sample.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective] }) export class ButtonsDisabledComponent { } diff --git a/src/app/data-entries/buttons/buttons-display-density/buttons-display-density.component.ts b/src/app/data-entries/buttons/buttons-display-density/buttons-display-density.component.ts index 5dfc1728ef..841a908270 100644 --- a/src/app/data-entries/buttons/buttons-display-density/buttons-display-density.component.ts +++ b/src/app/data-entries/buttons/buttons-display-density/buttons-display-density.component.ts @@ -1,4 +1,4 @@ -import { Component, HostBinding, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, HostBinding, OnInit } from '@angular/core'; import { IgxButtonGroupComponent } from 'igniteui-angular/button-group'; import { IgxButtonDirective, IgxRippleDirective } from 'igniteui-angular/directives'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -7,7 +7,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: 'app-buttons-display-density', styleUrls: ['./buttons-display-density.component.scss'], templateUrl: './buttons-display-density.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonGroupComponent, IgxButtonDirective, IgxRippleDirective, IgxIconComponent] }) export class ButtonsDisplayDensityComponent implements OnInit { diff --git a/src/app/data-entries/buttons/buttons-roundness-sample/buttons-roundness-sample.ts b/src/app/data-entries/buttons/buttons-roundness-sample/buttons-roundness-sample.ts index 287f82fdb0..c791699b35 100644 --- a/src/app/data-entries/buttons/buttons-roundness-sample/buttons-roundness-sample.ts +++ b/src/app/data-entries/buttons/buttons-roundness-sample/buttons-roundness-sample.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxButtonDirective, IgxIconButtonDirective, IgxRippleDirective } from 'igniteui-angular/directives'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -6,7 +6,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: 'app-buttons-roundness-sample', styleUrls: ['./buttons-roundness-sample.scss'], templateUrl: './buttons-roundness-sample.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxRippleDirective, IgxIconComponent, IgxIconButtonDirective] }) export class ButtonsRoundnessComponent {} diff --git a/src/app/data-entries/buttons/buttons-sample-1/buttons-sample-1.component.ts b/src/app/data-entries/buttons/buttons-sample-1/buttons-sample-1.component.ts index ba58e7f9f1..6e81376588 100644 --- a/src/app/data-entries/buttons/buttons-sample-1/buttons-sample-1.component.ts +++ b/src/app/data-entries/buttons/buttons-sample-1/buttons-sample-1.component.ts @@ -1,12 +1,11 @@ -import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit } from '@angular/core'; import { IgxButtonDirective, IgxRippleDirective } from 'igniteui-angular/directives'; @Component({ selector: 'app-buttons-sample-1', styleUrls: ['./buttons-sample-1.component.scss'], templateUrl: './buttons-sample-1.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxRippleDirective] }) export class ButtonsSample1Component { } diff --git a/src/app/data-entries/buttons/buttons-sample-2/buttons-sample-2.component.ts b/src/app/data-entries/buttons/buttons-sample-2/buttons-sample-2.component.ts index 0a8fcc4aad..048e47f634 100644 --- a/src/app/data-entries/buttons/buttons-sample-2/buttons-sample-2.component.ts +++ b/src/app/data-entries/buttons/buttons-sample-2/buttons-sample-2.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxButtonDirective } from 'igniteui-angular/directives'; @Component({ selector: 'app-buttons-sample-2', styleUrls: ['./buttons-sample-2.component.scss'], templateUrl: './buttons-sample-2.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective] }) export class ButtonsSample2Component { } diff --git a/src/app/data-entries/buttons/buttons-sample-3/buttons-sample-3.component.ts b/src/app/data-entries/buttons/buttons-sample-3/buttons-sample-3.component.ts index 6462689f63..95c52d74d6 100644 --- a/src/app/data-entries/buttons/buttons-sample-3/buttons-sample-3.component.ts +++ b/src/app/data-entries/buttons/buttons-sample-3/buttons-sample-3.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxButtonDirective, IgxRippleDirective } from 'igniteui-angular/directives'; @Component({ selector: 'app-buttons-sample-3', styleUrls: ['./buttons-sample-3.component.scss'], templateUrl: './buttons-sample-3.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxRippleDirective] }) export class ButtonsSample3Component { } diff --git a/src/app/data-entries/buttons/buttons-sample-4/buttons-sample-4.component.ts b/src/app/data-entries/buttons/buttons-sample-4/buttons-sample-4.component.ts index 67d80f2fe4..e0aa368980 100644 --- a/src/app/data-entries/buttons/buttons-sample-4/buttons-sample-4.component.ts +++ b/src/app/data-entries/buttons/buttons-sample-4/buttons-sample-4.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxButtonDirective, IgxRippleDirective } from 'igniteui-angular/directives'; @Component({ selector: 'app-buttons-sample-4', styleUrls: ['./buttons-sample-4.component.scss'], templateUrl: './buttons-sample-4.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxRippleDirective] }) export class ButtonsSample4Component { } diff --git a/src/app/data-entries/buttons/buttons-sample-5/buttons-sample-5.component.ts b/src/app/data-entries/buttons/buttons-sample-5/buttons-sample-5.component.ts index daf3a0288a..ea471e6e36 100644 --- a/src/app/data-entries/buttons/buttons-sample-5/buttons-sample-5.component.ts +++ b/src/app/data-entries/buttons/buttons-sample-5/buttons-sample-5.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxButtonDirective } from 'igniteui-angular/directives'; @Component({ selector: 'app-buttons-sample-5', styleUrls: ['./buttons-sample-5.component.scss'], templateUrl: './buttons-sample-5.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective] }) export class ButtonsSample5Component { } diff --git a/src/app/data-entries/buttons/buttons-sample-6/buttons-sample-6.component.ts b/src/app/data-entries/buttons/buttons-sample-6/buttons-sample-6.component.ts index 915f7038c1..6d07452311 100644 --- a/src/app/data-entries/buttons/buttons-sample-6/buttons-sample-6.component.ts +++ b/src/app/data-entries/buttons/buttons-sample-6/buttons-sample-6.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxButtonDirective } from 'igniteui-angular/directives'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -6,7 +6,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: 'app-buttons-sample-6', styleUrls: ['./buttons-sample-6.component.scss'], templateUrl: './buttons-sample-6.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxIconComponent] }) export class ButtonsSample6Component { } diff --git a/src/app/data-entries/buttons/buttons-sample-7/buttons-sample-7.component.ts b/src/app/data-entries/buttons/buttons-sample-7/buttons-sample-7.component.ts index 08630d2831..532edeff95 100644 --- a/src/app/data-entries/buttons/buttons-sample-7/buttons-sample-7.component.ts +++ b/src/app/data-entries/buttons/buttons-sample-7/buttons-sample-7.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxIconButtonDirective } from 'igniteui-angular/directives'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -6,7 +6,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: 'app-buttons-sample-7', styleUrls: ['./buttons-sample-7.component.scss'], templateUrl: './buttons-sample-7.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxIconButtonDirective, IgxIconComponent] }) export class ButtonsSample7Component { } diff --git a/src/app/data-entries/buttons/buttons-sample-8/buttons-sample-8.component.ts b/src/app/data-entries/buttons/buttons-sample-8/buttons-sample-8.component.ts index debe901383..77b080c3a4 100644 --- a/src/app/data-entries/buttons/buttons-sample-8/buttons-sample-8.component.ts +++ b/src/app/data-entries/buttons/buttons-sample-8/buttons-sample-8.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxButtonDirective } from 'igniteui-angular/directives'; @Component({ selector: 'app-buttons-sample-8', styleUrls: ['./buttons-sample-8.component.scss'], templateUrl: './buttons-sample-8.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective] }) export class ButtonsSample8Component { } diff --git a/src/app/data-entries/buttons/buttons-style/buttons-style.component.ts b/src/app/data-entries/buttons/buttons-style/buttons-style.component.ts index 7633134af3..ce5d497395 100644 --- a/src/app/data-entries/buttons/buttons-style/buttons-style.component.ts +++ b/src/app/data-entries/buttons/buttons-style/buttons-style.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxButtonDirective } from 'igniteui-angular/directives'; import { THEME_TOKEN, ThemeToken } from 'igniteui-angular/core'; @@ -7,7 +7,6 @@ import { THEME_TOKEN, ThemeToken } from 'igniteui-angular/core'; styleUrls: ['./buttons-style.component.scss'], templateUrl: './buttons-style.component.html', imports: [IgxButtonDirective], - changeDetection: ChangeDetectionStrategy.Eager, providers: [{provide: THEME_TOKEN, useFactory: () => new ThemeToken('bootstrap')}] }) export class ButtonsStyleComponent { diff --git a/src/app/data-entries/buttons/buttons-tailwind-style/buttons-tailwind-style.component.ts b/src/app/data-entries/buttons/buttons-tailwind-style/buttons-tailwind-style.component.ts index 1d42996e6c..2bbd669b48 100644 --- a/src/app/data-entries/buttons/buttons-tailwind-style/buttons-tailwind-style.component.ts +++ b/src/app/data-entries/buttons/buttons-tailwind-style/buttons-tailwind-style.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxButtonDirective } from 'igniteui-angular/directives'; @Component({ selector: 'app-buttons-tailwind-style', styleUrls: ['./buttons-tailwind-style.component.scss'], templateUrl: './buttons-tailwind-style.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective] }) export class ButtonsTailwindStyleComponent {} diff --git a/src/app/data-entries/checkbox/checkbox-sample-1/checkbox-sample-1.component.ts b/src/app/data-entries/checkbox/checkbox-sample-1/checkbox-sample-1.component.ts index d6124eead7..57bc770cbe 100644 --- a/src/app/data-entries/checkbox/checkbox-sample-1/checkbox-sample-1.component.ts +++ b/src/app/data-entries/checkbox/checkbox-sample-1/checkbox-sample-1.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxCheckboxComponent } from 'igniteui-angular/checkbox'; @Component({ selector: 'app-checkbox-sample-1', styleUrls: ['./checkbox-sample-1.component.scss'], templateUrl: './checkbox-sample-1.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxCheckboxComponent] }) export class CheckboxSample1Component { } diff --git a/src/app/data-entries/checkbox/checkbox-sample-2/checkbox-sample-2.component.ts b/src/app/data-entries/checkbox/checkbox-sample-2/checkbox-sample-2.component.ts index a889bb1062..780fbd7013 100644 --- a/src/app/data-entries/checkbox/checkbox-sample-2/checkbox-sample-2.component.ts +++ b/src/app/data-entries/checkbox/checkbox-sample-2/checkbox-sample-2.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxCheckboxComponent } from 'igniteui-angular/checkbox'; @@ -6,7 +6,6 @@ import { IgxCheckboxComponent } from 'igniteui-angular/checkbox'; selector: 'app-checkbox-sample-2', styleUrls: ['./checkbox-sample-2.component.scss'], templateUrl: './checkbox-sample-2.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxCheckboxComponent] }) export class CheckboxSample2Component { diff --git a/src/app/data-entries/checkbox/checkbox-sample-3/checkbox-sample-3.component.ts b/src/app/data-entries/checkbox/checkbox-sample-3/checkbox-sample-3.component.ts index 98bfbcd343..0ebf0cb53e 100644 --- a/src/app/data-entries/checkbox/checkbox-sample-3/checkbox-sample-3.component.ts +++ b/src/app/data-entries/checkbox/checkbox-sample-3/checkbox-sample-3.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxCheckboxComponent } from 'igniteui-angular/checkbox'; import { FormsModule } from '@angular/forms'; @@ -7,7 +7,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-checkbox-sample-3', styleUrls: ['./checkbox-sample-3.component.scss'], templateUrl: './checkbox-sample-3.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxCheckboxComponent, FormsModule] }) export class CheckboxSample3Component { diff --git a/src/app/data-entries/checkbox/checkbox-styling/checkbox-styling.component.html b/src/app/data-entries/checkbox/checkbox-styling/checkbox-styling.component.html index 5d1a2f56c9..67b225595e 100644 --- a/src/app/data-entries/checkbox/checkbox-styling/checkbox-styling.component.html +++ b/src/app/data-entries/checkbox/checkbox-styling/checkbox-styling.component.html @@ -1,3 +1,3 @@ - + Styled checkbox - \ No newline at end of file + diff --git a/src/app/data-entries/checkbox/checkbox-styling/checkbox-styling.component.scss b/src/app/data-entries/checkbox/checkbox-styling/checkbox-styling.component.scss index 247163ba67..656193ef8d 100644 --- a/src/app/data-entries/checkbox/checkbox-styling/checkbox-styling.component.scss +++ b/src/app/data-entries/checkbox/checkbox-styling/checkbox-styling.component.scss @@ -1,37 +1,39 @@ -@use "layout.scss"; +@use "sass:map"; @use "igniteui-angular/theming" as *; -// CSS variables approach +:host { + --ig-font-family: Arial, Helvetica, sans-serif; + --ig-subtitle-1-font-size: #{rem(14px)}; -igx-checkbox { - --tick-color: #0064d9; - --tick-color-hover: #e3f0ff; - --tick-width: 2; - --fill-color: transparent; - --fill-color-hover: #e3f0ff; - --label-color: #131e29; - --focus-outline-color: #0032a5; - --border-radius: #{rem(4px)}; + display: block; + padding: rem(18px) 0 0 rem(18px); } -igx-checkbox:hover { - --empty-fill-color: #e3f0ff; +// CSS variables approach +.igx-checkbox { + --tick-color: black; + --tick-color-hover: black; + --tick-width: 4; + --fill-color: orange; + --fill-color-hover: oklch(from var(--fill-color) calc(l * 0.9) c h); + --label-color: black; + --empty-color: orange; + --border-width: #{rem(3px)}; + --border-radius: #{rem(3px)}; } // Sass theme approach - // $custom-checkbox-theme: checkbox-theme( -// $tick-color: #0064d9, -// $tick-width: 2, -// $tick-color-hover: #e3f0ff, -// $fill-color: transparent, -// $fill-color-hover: #e3f0ff, -// $label-color: #131e29, -// $focus-outline-color: #0032a5, -// $empty-color: #131e29, -// $border-radius: rem(4px), +// $tick-color: black, +// $tick-color-hover: black, +// $tick-width: 4, +// $fill-color: orange, +// $fill-color-hover: oklch(from var(--fill-color) calc(l * 0.9) c h), +// $label-color: black, +// $empty-color: orange, +// $border-radius: rem(3px), // ); - -// :host { +// +// :host ::ng-deep { // @include tokens($custom-checkbox-theme); // } diff --git a/src/app/data-entries/checkbox/checkbox-styling/checkbox-styling.component.ts b/src/app/data-entries/checkbox/checkbox-styling/checkbox-styling.component.ts index 4a7da9b06d..34adc68489 100644 --- a/src/app/data-entries/checkbox/checkbox-styling/checkbox-styling.component.ts +++ b/src/app/data-entries/checkbox/checkbox-styling/checkbox-styling.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxCheckboxComponent } from 'igniteui-angular/checkbox'; import { THEME_TOKEN, ThemeToken } from 'igniteui-angular/core'; @@ -7,7 +7,6 @@ import { THEME_TOKEN, ThemeToken } from 'igniteui-angular/core'; styleUrls: ['./checkbox-styling.component.scss'], templateUrl: './checkbox-styling.component.html', providers: [{ provide: THEME_TOKEN, useFactory: () => new ThemeToken('fluent') }], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxCheckboxComponent] }) export class CheckboxStylingComponent { diff --git a/src/app/data-entries/checkbox/checkbox-styling/layout.scss b/src/app/data-entries/checkbox/checkbox-styling/layout.scss deleted file mode 100644 index b3d179bdc1..0000000000 --- a/src/app/data-entries/checkbox/checkbox-styling/layout.scss +++ /dev/null @@ -1,45 +0,0 @@ -@use "igniteui-angular/theming" as *; -@use "igniteui-angular/lib/core/styles/components/checkbox/checkbox-component" as checkbox; -@use "sass:map"; - -:host { - ::ng-deep { - $_checkbox-schema: map.get($light-fluent-schema, checkbox); - @include checkbox(checkbox-theme($schema: $_checkbox-schema)); - @include checkbox.component(); - - // Note: This is not the standard approach for styling the component. - // We're using it here solely to mirror the UI5 sample. - - .igx-checkbox--checked .igx-checkbox__composite-wrapper .igx-checkbox__composite { - border-color: var(--empty-color); - } - - .igx-checkbox__composite { - min-width: rem(18px); - height: rem(18px); - } - - .igx-checkbox--checked:hover .igx-checkbox__composite-wrapper .igx-checkbox__composite { - border-color: var(--empty-color); - } - - .igx-checkbox__label { - margin-inline-start: auto; - } - } -} - -igx-checkbox { - --ig-font-family: Arial, Helvetica, sans-serif; - --ig-subtitle-1-font-size: #{rem(14px)}; - - display: flex; - margin: rem(18px) 0 0 rem(18px); -} - -#checkbox-1.igx-checkbox--focused:after { - inset: rem(7px) rem(-6px) rem(7px) rem(6px); - border-radius: rem(8px); - box-shadow: 0 0 0 rem(2px) var(--focus-outline-color); -} diff --git a/src/app/data-entries/checkbox/checkbox-tailwind-styling/checkbox-tailwind-styling.component.ts b/src/app/data-entries/checkbox/checkbox-tailwind-styling/checkbox-tailwind-styling.component.ts index 3496228abd..e492210351 100644 --- a/src/app/data-entries/checkbox/checkbox-tailwind-styling/checkbox-tailwind-styling.component.ts +++ b/src/app/data-entries/checkbox/checkbox-tailwind-styling/checkbox-tailwind-styling.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxCheckboxComponent } from 'igniteui-angular/checkbox'; @Component({ selector: 'app-checkbox-tailwind-styling', styleUrls: ['./checkbox-tailwind-styling.component.scss'], templateUrl: './checkbox-tailwind-styling.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxCheckboxComponent] }) export class CheckboxTailwindStylingComponent { } diff --git a/src/app/data-entries/data-entries-routes-data.ts b/src/app/data-entries/data-entries-routes-data.ts index c6d537969d..5e710a28e7 100644 --- a/src/app/data-entries/data-entries-routes-data.ts +++ b/src/app/data-entries/data-entries-routes-data.ts @@ -3,13 +3,16 @@ export const dataEntriesRoutesData = { "autocomplete": { displayName: "Autocomplete", parentName: "Autocomplete" }, "movie": { displayName: "Movie Availability", parentName: "Autocomplete" }, - "button-group-sample-1": { displayName: "Button Group Overview", parentName: "Button Group" }, - "button-group-sample-2": { displayName: "Vertical Button Group", parentName: "Button Group" }, - "button-group-sample-3": { displayName: "Horizontal Button Group", parentName: "Button Group" }, - "button-group-sample-4": { displayName: "Selection Mode", parentName: "Button Group" }, - "button-group-sample-5": { displayName: "Display Density", parentName: "Button Group" }, - "button-group-style": { displayName: "Button Group Style", parentName: "Button Group" }, - "button-group-tailwind-style": { displayName: "Button Group Tailwind Style", parentName: "Button Group" }, + "button-group-overview": { displayName: "Button Group Overview", parentName: "Button Group" }, + "button-group-layout": { displayName: "Button Group Layout", parentName: "Button Group" }, + "button-group-alignment": { displayName: "Button Group Alignment", parentName: "Button Group" }, + "button-group-custom-toggle": { displayName: "Button Group Custom Toggle", parentName: "Button Group" }, + "button-group-states": { displayName: "Button Group States", parentName: "Button Group" }, + "button-group-interaction-states": { displayName: "Button Group Interaction States", parentName: "Button Group" }, + "button-group-selection": { displayName: "Button Group Selection", parentName: "Button Group" }, + "button-group-size": { displayName: "Button Group Size", parentName: "Button Group" }, + "button-group-styling": { displayName: "Button Group Styling", parentName: "Button Group" }, + "button-group-tailwind-styling": { displayName: "Button Group Tailwind Styling", parentName: "Button Group" }, "buttons-sample-1": { displayName: "Overview", parentName: "Buttons" }, "buttons-sample-2": { displayName: "Flat Button", parentName: "Buttons" }, "buttons-sample-3": { displayName: "Button Ripple", parentName: "Buttons" }, diff --git a/src/app/data-entries/data-entries.routes.ts b/src/app/data-entries/data-entries.routes.ts index 665bf7c9e1..8bc329cfcc 100644 --- a/src/app/data-entries/data-entries.routes.ts +++ b/src/app/data-entries/data-entries.routes.ts @@ -1,13 +1,16 @@ import { Routes } from '@angular/router'; import { AutocompleteBasicComponent } from './autocomplete/autocomplete/autocomplete.component'; import { MovieComponent } from './autocomplete/movie/movie.component'; -import { ButtonGroupSample1Component } from './buttonGroup/button-group-sample-1/button-group-sample-1.component'; -import { ButtonGroupSample2Component } from './buttonGroup/button-group-sample-2/button-group-sample-2.component'; -import { ButtonGroupSample3Component } from './buttonGroup/button-group-sample-3/button-group-sample-3.component'; -import { ButtonGroupSampleComponent } from './buttonGroup/button-group-sample-4/button-group-sample.component'; -import { ButtonGroupSample5Component } from './buttonGroup/button-group-sample-5/button-group-sample-5.component'; -import { ButtonGroupStyleComponent } from './buttonGroup/button-group-style/button-group-style.component'; -import { ButtonGroupTailwindStyleComponent } from './buttonGroup/button-group-tailwind-style/button-group-tailwind-style.component'; +import { ButtonGroupOverviewComponent } from './buttonGroup/button-group-overview/button-group-overview.component'; +import { ButtonGroupLayoutComponent } from './buttonGroup/button-group-layout/button-group-layout.component'; +import { ButtonGroupAlignmentComponent } from './buttonGroup/button-group-alignment/button-group-alignment.component'; +import { ButtonGroupCustomToggleComponent } from './buttonGroup/button-group-custom-toggle/button-group-custom-toggle.component'; +import { ButtonGroupStatesComponent } from './buttonGroup/button-group-states/button-group-states.component'; +import { ButtonGroupInteractionStatesComponent } from './buttonGroup/button-group-interaction-states/button-group-interaction-states.component'; +import { ButtonGroupSelectionComponent } from './buttonGroup/button-group-selection/button-group-selection.component'; +import { ButtonGroupSizeComponent } from './buttonGroup/button-group-size/button-group-size.component'; +import { ButtonGroupStylingComponent } from './buttonGroup/button-group-styling/button-group-styling.component'; +import { ButtonGroupTailwindStylingComponent } from './buttonGroup/button-group-tailwind-styling/button-group-tailwind-styling.component'; import { ButtonsDisabledComponent } from './buttons/buttons-disabled-sample/buttons-disabled-sample'; import { ButtonsDisplayDensityComponent } from './buttons/buttons-display-density/buttons-display-density.component'; import { ButtonsRoundnessComponent } from './buttons/buttons-roundness-sample/buttons-roundness-sample'; @@ -99,39 +102,54 @@ export const DataEntriesRoutes: Routes = [ path: 'buttons-display-density' }, { - component: ButtonGroupSample1Component, - data: dataEntriesRoutesData['button-group-sample-1'], - path: 'button-group-sample-1' + component: ButtonGroupOverviewComponent, + data: dataEntriesRoutesData['button-group-overview'], + path: 'button-group-overview' }, { - component: ButtonGroupSample2Component, - data: dataEntriesRoutesData['button-group-sample-2'], - path: 'button-group-sample-2' + component: ButtonGroupLayoutComponent, + data: dataEntriesRoutesData['button-group-layout'], + path: 'button-group-layout' }, { - component: ButtonGroupSample3Component, - data: dataEntriesRoutesData['button-group-sample-3'], - path: 'button-group-sample-3' + component: ButtonGroupAlignmentComponent, + data: dataEntriesRoutesData['button-group-alignment'], + path: 'button-group-alignment' }, { - component: ButtonGroupSampleComponent, - data: dataEntriesRoutesData['button-group-sample-4'], - path: 'button-group-sample-4' + component: ButtonGroupCustomToggleComponent, + data: dataEntriesRoutesData['button-group-custom-toggle'], + path: 'button-group-custom-toggle' }, { - component: ButtonGroupSample5Component, - data: dataEntriesRoutesData['button-group-sample-5'], - path: 'button-group-sample-5' + component: ButtonGroupStatesComponent, + data: dataEntriesRoutesData['button-group-states'], + path: 'button-group-states' }, { - component: ButtonGroupStyleComponent, - data: dataEntriesRoutesData['button-group-style'], - path: 'button-group-style' + component: ButtonGroupInteractionStatesComponent, + data: dataEntriesRoutesData['button-group-interaction-states'], + path: 'button-group-interaction-states' }, { - component: ButtonGroupTailwindStyleComponent, - data: dataEntriesRoutesData['button-group-tailwind-style'], - path: 'button-group-tailwind-style' + component: ButtonGroupSelectionComponent, + data: dataEntriesRoutesData['button-group-selection'], + path: 'button-group-selection' + }, + { + component: ButtonGroupSizeComponent, + data: dataEntriesRoutesData['button-group-size'], + path: 'button-group-size' + }, + { + component: ButtonGroupStylingComponent, + data: dataEntriesRoutesData['button-group-styling'], + path: 'button-group-styling' + }, + { + component: ButtonGroupTailwindStylingComponent, + data: dataEntriesRoutesData['button-group-tailwind-styling'], + path: 'button-group-tailwind-styling' }, { component: ButtonsRoundnessComponent, diff --git a/src/app/data-entries/dropdown/drop-down-remote-virtual/drop-down-remote.component.ts b/src/app/data-entries/dropdown/drop-down-remote-virtual/drop-down-remote.component.ts index 36ca5004f1..9a2941bfec 100644 --- a/src/app/data-entries/dropdown/drop-down-remote-virtual/drop-down-remote.component.ts +++ b/src/app/data-entries/dropdown/drop-down-remote-virtual/drop-down-remote.component.ts @@ -1,4 +1,4 @@ -import { ChangeDetectorRef, Component, OnDestroy, OnInit, ViewChild, AfterViewInit, inject, ChangeDetectionStrategy } from '@angular/core'; +import { ChangeDetectorRef, Component, OnDestroy, OnInit, ViewChild, AfterViewInit, inject } from '@angular/core'; // tslint:disable-next-line:max-line-length import { IForOfState, IgxButtonDirective, IgxForOfDirective, IgxToggleActionDirective } from 'igniteui-angular/directives'; import { IgxDropDownComponent, IgxDropDownItemComponent, IgxDropDownItemNavigationDirective } from 'igniteui-angular/drop-down'; @@ -15,7 +15,6 @@ import { AsyncPipe } from '@angular/common'; selector: 'app-drop-down-remote', templateUrl: './drop-down-remote.component.html', styleUrls: ['./drop-down-remote.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxToggleActionDirective, IgxDropDownItemNavigationDirective, IgxDropDownComponent, IgxForOfDirective, IgxDropDownItemComponent, IgxToastComponent, AsyncPipe] }) export class DropDownRemoteComponent implements OnInit, OnDestroy, AfterViewInit { diff --git a/src/app/data-entries/dropdown/drop-down-virtual/drop-down-virtual.component.ts b/src/app/data-entries/dropdown/drop-down-virtual/drop-down-virtual.component.ts index 2467497ea6..f7efad5d6f 100644 --- a/src/app/data-entries/dropdown/drop-down-virtual/drop-down-virtual.component.ts +++ b/src/app/data-entries/dropdown/drop-down-virtual/drop-down-virtual.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxButtonDirective, IgxForOfDirective, IgxToggleActionDirective } from 'igniteui-angular/directives'; import { IgxDropDownComponent, IgxDropDownItemComponent, IgxDropDownItemNavigationDirective } from 'igniteui-angular/drop-down'; @@ -15,7 +15,6 @@ interface DataItem { selector: 'app-drop-down-virtual', templateUrl: './drop-down-virtual.component.html', styleUrls: ['./drop-down-virtual.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxToggleActionDirective, IgxDropDownItemNavigationDirective, IgxDropDownComponent, IgxForOfDirective, IgxDropDownItemComponent] }) export class DropDownVirtualComponent { diff --git a/src/app/data-entries/dropdown/dropdown-menu/dropdown-menu.component.ts b/src/app/data-entries/dropdown/dropdown-menu/dropdown-menu.component.ts index dc33aec4cb..39b82e4dd8 100644 --- a/src/app/data-entries/dropdown/dropdown-menu/dropdown-menu.component.ts +++ b/src/app/data-entries/dropdown/dropdown-menu/dropdown-menu.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { ConnectedPositioningStrategy, HorizontalAlignment, IgxOverlayOutletDirective, NoOpScrollStrategy, VerticalAlignment } from 'igniteui-angular/core'; import { ISelectionEventArgs, IgxDropDownComponent, IgxDropDownItemComponent, IgxDropDownItemNavigationDirective } from 'igniteui-angular/drop-down'; import { IgxNavbarComponent } from 'igniteui-angular/navbar'; @@ -11,7 +11,6 @@ import { IgxLabelDirective } from 'igniteui-angular/input-group'; selector: 'app-dropdown-menu', styleUrls: ['./dropdown-menu.component.scss'], templateUrl: './dropdown-menu.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxNavbarComponent, IgxIconButtonDirective, IgxToggleActionDirective, IgxDropDownItemNavigationDirective, IgxIconComponent, IgxDropDownComponent, IgxDropDownItemComponent, IgxLabelDirective, IgxOverlayOutletDirective] }) export class DropdownMenuComponent { diff --git a/src/app/data-entries/dropdown/dropdown-multi-level-menu/dropdown-multi-level-menu.component.ts b/src/app/data-entries/dropdown/dropdown-multi-level-menu/dropdown-multi-level-menu.component.ts index c694188572..15575d22ab 100644 --- a/src/app/data-entries/dropdown/dropdown-multi-level-menu/dropdown-multi-level-menu.component.ts +++ b/src/app/data-entries/dropdown/dropdown-multi-level-menu/dropdown-multi-level-menu.component.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, Component, QueryList, ViewChild, ViewChildren, inject, ChangeDetectionStrategy } from '@angular/core'; +import { AfterViewInit, Component, QueryList, ViewChild, ViewChildren, inject } from '@angular/core'; import { IgxDropDownComponent, IgxDropDownItemComponent } from 'igniteui-angular/drop-down'; import { ConnectedPositioningStrategy, HorizontalAlignment, OverlaySettings, VerticalAlignment } from 'igniteui-angular/core'; import { IgxNavbarComponent, IgxNavbarTitleDirective } from 'igniteui-angular/navbar'; @@ -22,7 +22,6 @@ import { MultiLevelDirective } from './multi-level.directive'; templateUrl: './dropdown-multi-level-menu.component.html', styleUrls: ['./dropdown-multi-level-menu.component.scss'], providers: [MultiLevelService], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxNavbarComponent, IgxNavbarTitleDirective, IgxButtonDirective, IgxToggleActionDirective, IgxIconComponent, IgxDropDownComponent, IgxDropDownItemComponent, MultiLevelDirective, IgxSuffixDirective] }) export class DropdownMultiLevelMenuComponent implements AfterViewInit { diff --git a/src/app/data-entries/dropdown/dropdown-sample-1/dropdown-sample-1.component.ts b/src/app/data-entries/dropdown/dropdown-sample-1/dropdown-sample-1.component.ts index b0fbff9bbc..0a73f65ad2 100644 --- a/src/app/data-entries/dropdown/dropdown-sample-1/dropdown-sample-1.component.ts +++ b/src/app/data-entries/dropdown/dropdown-sample-1/dropdown-sample-1.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxButtonDirective, IgxToggleActionDirective } from 'igniteui-angular/directives'; import { IgxDropDownComponent, IgxDropDownItemComponent, IgxDropDownItemNavigationDirective } from 'igniteui-angular/drop-down'; @@ -7,7 +7,6 @@ import { IgxDropDownComponent, IgxDropDownItemComponent, IgxDropDownItemNavigati selector: 'app-dropdown-sample-1', styleUrls: ['./dropdown-sample-1.component.scss'], templateUrl: './dropdown-sample-1.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxToggleActionDirective, IgxDropDownItemNavigationDirective, IgxDropDownComponent, IgxDropDownItemComponent] }) export class DropDownSample1Component { diff --git a/src/app/data-entries/dropdown/dropdown-sample-2/dropdown-sample-2.component.ts b/src/app/data-entries/dropdown/dropdown-sample-2/dropdown-sample-2.component.ts index b73bcf5ddb..a3a704ea94 100644 --- a/src/app/data-entries/dropdown/dropdown-sample-2/dropdown-sample-2.component.ts +++ b/src/app/data-entries/dropdown/dropdown-sample-2/dropdown-sample-2.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxButtonDirective, IgxToggleActionDirective } from 'igniteui-angular/directives'; import { IgxDropDownComponent, IgxDropDownItemComponent, IgxDropDownItemNavigationDirective } from 'igniteui-angular/drop-down'; @@ -8,7 +8,6 @@ import { IgxDropDownComponent, IgxDropDownItemComponent, IgxDropDownItemNavigati selector: 'app-dropdown-sample-2', styleUrls: ['./dropdown-sample-2.component.scss'], templateUrl: './dropdown-sample-2.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxToggleActionDirective, IgxDropDownItemNavigationDirective, IgxDropDownComponent, IgxDropDownItemComponent] }) export class DropDownSample2Component { diff --git a/src/app/data-entries/dropdown/dropdown-sample-3/dropdown-sample-3.component.ts b/src/app/data-entries/dropdown/dropdown-sample-3/dropdown-sample-3.component.ts index 11686993d6..a4a6dfaabd 100644 --- a/src/app/data-entries/dropdown/dropdown-sample-3/dropdown-sample-3.component.ts +++ b/src/app/data-entries/dropdown/dropdown-sample-3/dropdown-sample-3.component.ts @@ -1,5 +1,5 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; -import { IgxButtonDirective, IgxDividerDirective, IgxToggleActionDirective } from 'igniteui-angular/directives'; +import { Component } from '@angular/core'; +import { IgxButtonDirective, IgxDividerComponent, IgxToggleActionDirective } from 'igniteui-angular/directives'; import { IgxDropDownComponent, IgxDropDownItemComponent, IgxDropDownItemNavigationDirective } from 'igniteui-angular/drop-down'; import { IgxIconComponent } from 'igniteui-angular/icon'; import { IgxPrefixDirective, IgxSuffixDirective } from 'igniteui-angular/input-group'; @@ -10,8 +10,7 @@ import { IgxPrefixDirective, IgxSuffixDirective } from 'igniteui-angular/input-g selector: 'app-dropdown-sample-3', styleUrls: ['./dropdown-sample-3.component.scss'], templateUrl: './dropdown-sample-3.component.html', - changeDetection: ChangeDetectionStrategy.Eager, - imports: [IgxButtonDirective, IgxToggleActionDirective, IgxDropDownItemNavigationDirective, IgxDropDownComponent, IgxDropDownItemComponent, IgxIconComponent, IgxPrefixDirective, IgxSuffixDirective, IgxDividerDirective] + imports: [IgxButtonDirective, IgxToggleActionDirective, IgxDropDownItemNavigationDirective, IgxDropDownComponent, IgxDropDownItemComponent, IgxIconComponent, IgxPrefixDirective, IgxSuffixDirective, IgxDividerComponent] }) export class DropDownSample3Component { diff --git a/src/app/data-entries/dropdown/dropdown-sample-4/dropdown-sample-4.component.html b/src/app/data-entries/dropdown/dropdown-sample-4/dropdown-sample-4.component.html index ba67b6bdca..a612155bef 100644 --- a/src/app/data-entries/dropdown/dropdown-sample-4/dropdown-sample-4.component.html +++ b/src/app/data-entries/dropdown/dropdown-sample-4/dropdown-sample-4.component.html @@ -1,3 +1,7 @@ +

+ Selected:  + {{ dropDown.selectedItem?.value ?? 'N/A' }} +

@@ -5,7 +9,6 @@ arrow_drop{{ dropDown.collapsed ? '_down' : '_up' }} - Selected: {{ dropDown.selectedItem?.value }} @for (item of items; track item) { diff --git a/src/app/data-entries/dropdown/dropdown-sample-4/dropdown-sample-4.component.scss b/src/app/data-entries/dropdown/dropdown-sample-4/dropdown-sample-4.component.scss index 79fa6ba913..89afcfbb70 100644 --- a/src/app/data-entries/dropdown/dropdown-sample-4/dropdown-sample-4.component.scss +++ b/src/app/data-entries/dropdown/dropdown-sample-4/dropdown-sample-4.component.scss @@ -1,20 +1,8 @@ :host { - margin: 8px; + display: block; + padding: 0.5rem; } -.input { - padding-left: 0.2rem; -} - -.input-group { - width: 220px; -} - -.igx-input-group { - display: inline-block; -} - -span { - display: inline; - padding-left: 24px; +igx-input-group { + max-width: 300px; } diff --git a/src/app/data-entries/dropdown/dropdown-sample-4/dropdown-sample-4.component.ts b/src/app/data-entries/dropdown/dropdown-sample-4/dropdown-sample-4.component.ts index 519131d90b..a322c35155 100644 --- a/src/app/data-entries/dropdown/dropdown-sample-4/dropdown-sample-4.component.ts +++ b/src/app/data-entries/dropdown/dropdown-sample-4/dropdown-sample-4.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { ConnectedPositioningStrategy } from 'igniteui-angular/core'; import { IgxDropDownComponent, IgxDropDownItemComponent, IgxDropDownItemNavigationDirective } from 'igniteui-angular/drop-down'; import { IgxInputDirective, IgxInputGroupComponent, IgxSuffixDirective } from 'igniteui-angular/input-group'; @@ -10,7 +10,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: 'app-dropdown-sample-4', styleUrls: ['./dropdown-sample-4.component.scss'], templateUrl: './dropdown-sample-4.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxInputGroupComponent, IgxToggleActionDirective, IgxInputDirective, IgxDropDownItemNavigationDirective, IgxSuffixDirective, IgxIconButtonDirective, IgxRippleDirective, IgxIconComponent, IgxDropDownComponent, IgxDropDownItemComponent] }) export class DropDownSample4Component { diff --git a/src/app/data-entries/dropdown/dropdown-sample-5/dropdown-sample-5.component.ts b/src/app/data-entries/dropdown/dropdown-sample-5/dropdown-sample-5.component.ts index f6ee0f2b7d..d58f8aee84 100644 --- a/src/app/data-entries/dropdown/dropdown-sample-5/dropdown-sample-5.component.ts +++ b/src/app/data-entries/dropdown/dropdown-sample-5/dropdown-sample-5.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxButtonDirective, IgxToggleActionDirective } from 'igniteui-angular/directives'; import { IgxDropDownComponent, IgxDropDownGroupComponent, IgxDropDownItemComponent, IgxDropDownItemNavigationDirective } from 'igniteui-angular/drop-down'; import { IgxSwitchComponent } from 'igniteui-angular/switch'; @@ -10,7 +10,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-dropdown-sample-5', styleUrls: ['./dropdown-sample-5.component.scss'], templateUrl: './dropdown-sample-5.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxToggleActionDirective, IgxDropDownItemNavigationDirective, IgxSwitchComponent, FormsModule, IgxDropDownComponent, IgxDropDownGroupComponent, IgxDropDownItemComponent] }) export class DropDownSample5Component { diff --git a/src/app/data-entries/dropdown/dropdown-styling/dropdown-styling.component.ts b/src/app/data-entries/dropdown/dropdown-styling/dropdown-styling.component.ts index bb6d50f826..ccf152afde 100644 --- a/src/app/data-entries/dropdown/dropdown-styling/dropdown-styling.component.ts +++ b/src/app/data-entries/dropdown/dropdown-styling/dropdown-styling.component.ts @@ -1,4 +1,4 @@ -import { Component, ElementRef, OnInit, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ElementRef, OnInit, ViewChild, inject } from '@angular/core'; import { ISelectionEventArgs, IgxDropDownComponent, IgxDropDownGroupComponent, IgxDropDownItemComponent, IgxDropDownItemNavigationDirective } from 'igniteui-angular/drop-down'; import { IgxButtonDirective, IgxToggleActionDirective } from 'igniteui-angular/directives'; import { getHeroClassData, IHeroClass } from '../../../data/heroData'; @@ -8,7 +8,6 @@ import { getHeroClassData, IHeroClass } from '../../../data/heroData'; selector: 'app-dropdown-styling', styleUrls: ['./dropdown-styling.component.scss'], templateUrl: './dropdown-styling.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxToggleActionDirective, IgxDropDownItemNavigationDirective, IgxDropDownComponent, IgxDropDownGroupComponent, IgxDropDownItemComponent] }) export class DropDownStylingComponent implements OnInit { diff --git a/src/app/data-entries/dropdown/dropdown-tree-grid-hierarchical-selection/dropdown-tree-grid-hierarchical-selection.component.ts b/src/app/data-entries/dropdown/dropdown-tree-grid-hierarchical-selection/dropdown-tree-grid-hierarchical-selection.component.ts index ed5cb900e0..a6b2c44787 100644 --- a/src/app/data-entries/dropdown/dropdown-tree-grid-hierarchical-selection/dropdown-tree-grid-hierarchical-selection.component.ts +++ b/src/app/data-entries/dropdown/dropdown-tree-grid-hierarchical-selection/dropdown-tree-grid-hierarchical-selection.component.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, Component, ElementRef, OnInit, PLATFORM_ID, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { AfterViewInit, Component, ElementRef, OnInit, PLATFORM_ID, ViewChild, inject } from '@angular/core'; import { IBaseChipEventArgs, IgxChipComponent, IgxChipsAreaComponent } from 'igniteui-angular/chips'; import { IgxDropDownComponent, IgxDropDownItemNavigationDirective } from 'igniteui-angular/drop-down'; import { ConnectedPositioningStrategy, OverlaySettings } from 'igniteui-angular/core'; @@ -15,7 +15,6 @@ import { isPlatformBrowser } from '@angular/common'; selector: 'app-dropdown-tree-grid-hierarchical-selection', styleUrls: ['./dropdown-tree-grid-hierarchical-selection.component.scss'], templateUrl: './dropdown-tree-grid-hierarchical-selection.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxToggleActionDirective, IgxDropDownItemNavigationDirective, IgxIconComponent, IgxChipsAreaComponent, IgxChipComponent, IgxDropDownComponent, IgxTreeGridComponent, IgxColumnComponent] }) export class DropdownTreeGridHierarchicalSelectionComponent implements OnInit, AfterViewInit { diff --git a/src/app/data-entries/dropdown/dropdown-tree-hierarchical-selection/dropdown-tree-hierarchical-selection.component.ts b/src/app/data-entries/dropdown/dropdown-tree-hierarchical-selection/dropdown-tree-hierarchical-selection.component.ts index e584bd6c5c..4473dc1459 100644 --- a/src/app/data-entries/dropdown/dropdown-tree-hierarchical-selection/dropdown-tree-hierarchical-selection.component.ts +++ b/src/app/data-entries/dropdown/dropdown-tree-hierarchical-selection/dropdown-tree-hierarchical-selection.component.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, Component, DoCheck, OnInit, ViewChild, ElementRef, PLATFORM_ID, inject, ChangeDetectionStrategy } from '@angular/core'; +import { AfterViewInit, Component, DoCheck, OnInit, ViewChild, ElementRef, PLATFORM_ID, inject } from '@angular/core'; import { IBaseChipEventArgs, IgxChipComponent, IgxChipsAreaComponent } from 'igniteui-angular/chips'; import { IgxDropDownComponent, IgxDropDownItemNavigationDirective } from 'igniteui-angular/drop-down'; import { ITreeNodeSelectionEvent, IgxTreeComponent, IgxTreeNodeComponent } from 'igniteui-angular/tree'; @@ -14,7 +14,6 @@ import { isPlatformBrowser } from '@angular/common'; selector: 'app-dropdown-tree-hierarchical-selection', styleUrls: ['./dropdown-tree-hierarchical-selection.component.scss'], templateUrl: './dropdown-tree-hierarchical-selection.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxToggleActionDirective, IgxDropDownItemNavigationDirective, IgxIconComponent, IgxChipsAreaComponent, IgxChipComponent, IgxDropDownComponent, IgxTreeComponent, IgxTreeNodeComponent] }) export class DropdownTreeHierarchicalSelectionComponent implements OnInit, DoCheck, AfterViewInit { diff --git a/src/app/data-entries/icon-button/contained-icon-button/contained-icon-button.component.ts b/src/app/data-entries/icon-button/contained-icon-button/contained-icon-button.component.ts index bffb14e152..a3a1db9cda 100644 --- a/src/app/data-entries/icon-button/contained-icon-button/contained-icon-button.component.ts +++ b/src/app/data-entries/icon-button/contained-icon-button/contained-icon-button.component.ts @@ -1,5 +1,5 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxIconButtonDirective } from 'igniteui-angular/directives'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -7,7 +7,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: 'app-contained-icon-button', styleUrls: ['./contained-icon-button.component.scss'], templateUrl: './contained-icon-button.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxIconButtonDirective, IgxIconComponent] }) export class ContainedIconButtonComponent { } diff --git a/src/app/data-entries/icon-button/disabled-icon-button/disabled-icon-button.component.ts b/src/app/data-entries/icon-button/disabled-icon-button/disabled-icon-button.component.ts index f76eccf1f7..bcd1e7fd76 100644 --- a/src/app/data-entries/icon-button/disabled-icon-button/disabled-icon-button.component.ts +++ b/src/app/data-entries/icon-button/disabled-icon-button/disabled-icon-button.component.ts @@ -1,5 +1,5 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxIconButtonDirective } from 'igniteui-angular/directives'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -7,7 +7,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: 'app-disabled-icon-button', styleUrls: ['./disabled-icon-button.component.scss'], templateUrl: './disabled-icon-button.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxIconButtonDirective, IgxIconComponent] }) export class DisabledIconButtonComponent {} diff --git a/src/app/data-entries/icon-button/flat-icon-button/flat-icon-button.component.ts b/src/app/data-entries/icon-button/flat-icon-button/flat-icon-button.component.ts index e68100e84e..102774808e 100644 --- a/src/app/data-entries/icon-button/flat-icon-button/flat-icon-button.component.ts +++ b/src/app/data-entries/icon-button/flat-icon-button/flat-icon-button.component.ts @@ -1,5 +1,5 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxIconButtonDirective } from 'igniteui-angular/directives'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -7,7 +7,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: 'app-flat-icon-button', styleUrls: ['./flat-icon-button.component.scss'], templateUrl: './flat-icon-button.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxIconButtonDirective, IgxIconComponent] }) export class FlatIconButtonComponent { } diff --git a/src/app/data-entries/icon-button/icon-button-overview/icon-button-overview.component.ts b/src/app/data-entries/icon-button/icon-button-overview/icon-button-overview.component.ts index 42a4674345..998db628c0 100644 --- a/src/app/data-entries/icon-button/icon-button-overview/icon-button-overview.component.ts +++ b/src/app/data-entries/icon-button/icon-button-overview/icon-button-overview.component.ts @@ -1,5 +1,5 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxIconButtonDirective, IgxRippleDirective } from 'igniteui-angular/directives'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -7,7 +7,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: 'app-icon-button-overview', styleUrls: ['./icon-button-overview.component.scss'], templateUrl: './icon-button-overview.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxIconButtonDirective, IgxRippleDirective, IgxIconComponent] }) export class IconButtonOverviewComponent { } diff --git a/src/app/data-entries/icon-button/icon-button-size/icon-button-size.component.ts b/src/app/data-entries/icon-button/icon-button-size/icon-button-size.component.ts index 6b2cfe7838..6b97505ea2 100644 --- a/src/app/data-entries/icon-button/icon-button-size/icon-button-size.component.ts +++ b/src/app/data-entries/icon-button/icon-button-size/icon-button-size.component.ts @@ -1,5 +1,5 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxIconButtonDirective, IgxRippleDirective } from 'igniteui-angular/directives'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -7,7 +7,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: 'app-icon-button-size', styleUrls: ['./icon-button-size.component.scss'], templateUrl: './icon-button-size.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxIconButtonDirective, IgxRippleDirective, IgxIconComponent] }) export class IconButtonSizeComponent { } diff --git a/src/app/data-entries/icon-button/icon-button-styling/icon-button-styling.component.ts b/src/app/data-entries/icon-button/icon-button-styling/icon-button-styling.component.ts index fb210b6cf3..914b53e14d 100644 --- a/src/app/data-entries/icon-button/icon-button-styling/icon-button-styling.component.ts +++ b/src/app/data-entries/icon-button/icon-button-styling/icon-button-styling.component.ts @@ -1,5 +1,5 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxIconButtonDirective, IgxRippleDirective } from 'igniteui-angular/directives'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -7,7 +7,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: 'app-icon-button-styling', styleUrls: ['./icon-button-styling.component.scss'], templateUrl: './icon-button-styling.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxIconButtonDirective, IgxRippleDirective, IgxIconComponent] }) export class IconButtonStylingComponent { } diff --git a/src/app/data-entries/icon-button/icon-button-tailwind-styling/icon-button-tailwind-styling.component.ts b/src/app/data-entries/icon-button/icon-button-tailwind-styling/icon-button-tailwind-styling.component.ts index bf2d32f19e..59b5733d2d 100644 --- a/src/app/data-entries/icon-button/icon-button-tailwind-styling/icon-button-tailwind-styling.component.ts +++ b/src/app/data-entries/icon-button/icon-button-tailwind-styling/icon-button-tailwind-styling.component.ts @@ -1,5 +1,5 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxIconButtonDirective } from 'igniteui-angular/directives'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -7,7 +7,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: 'app-icon-button-tailwind-styling', styleUrls: ['./icon-button-tailwind-styling.component.scss'], templateUrl: './icon-button-tailwind-styling.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxIconButtonDirective, IgxIconComponent] }) export class IconButtonTailwindStylingComponent { } diff --git a/src/app/data-entries/icon-button/outlined-icon-button/outlined-icon-button.component.ts b/src/app/data-entries/icon-button/outlined-icon-button/outlined-icon-button.component.ts index a0b9b87371..a5588a063a 100644 --- a/src/app/data-entries/icon-button/outlined-icon-button/outlined-icon-button.component.ts +++ b/src/app/data-entries/icon-button/outlined-icon-button/outlined-icon-button.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxIconButtonDirective } from 'igniteui-angular/directives'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -6,7 +6,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: 'app-outlined-icon-button', styleUrls: ['./outlined-icon-button.component.scss'], templateUrl: './outlined-icon-button.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxIconButtonDirective, IgxIconComponent] }) export class OutlinedIconButtonComponent {} diff --git a/src/app/data-entries/icon-button/svg-icon-button/svg-icon-button.component.ts b/src/app/data-entries/icon-button/svg-icon-button/svg-icon-button.component.ts index 07d6807758..c0ca74a2c1 100644 --- a/src/app/data-entries/icon-button/svg-icon-button/svg-icon-button.component.ts +++ b/src/app/data-entries/icon-button/svg-icon-button/svg-icon-button.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, inject } from '@angular/core'; import { IgxIconComponent, IgxIconService } from 'igniteui-angular/icon'; import { IgxIconButtonDirective } from 'igniteui-angular/directives'; @@ -6,7 +6,6 @@ import { IgxIconButtonDirective } from 'igniteui-angular/directives'; selector: 'app-svg-icon-button', styleUrls: ['./svg-icon-button.component.scss'], templateUrl: './svg-icon-button.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxIconButtonDirective, IgxIconComponent] }) export class SVGIconButtonComponent implements OnInit { diff --git a/src/app/data-entries/input-group/input-group-sample-1/input-group-sample-1.component.ts b/src/app/data-entries/input-group/input-group-sample-1/input-group-sample-1.component.ts index cc71faf5d2..1c0931481f 100644 --- a/src/app/data-entries/input-group/input-group-sample-1/input-group-sample-1.component.ts +++ b/src/app/data-entries/input-group/input-group-sample-1/input-group-sample-1.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { BaseInputGroupSampleComponent } from '../base-input.component'; import { FormsModule } from '@angular/forms'; import { IgxInputDirective, IgxInputGroupComponent, IgxLabelDirective } from 'igniteui-angular/input-group'; @@ -7,7 +7,6 @@ import { IgxInputDirective, IgxInputGroupComponent, IgxLabelDirective } from 'ig selector: 'app-input-group-sample-1', styleUrls: ['./input-group-sample-1.component.scss'], templateUrl: './input-group-sample-1.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [FormsModule, IgxInputGroupComponent, IgxInputDirective, IgxLabelDirective] }) export class InputGroupSample1Component extends BaseInputGroupSampleComponent { } diff --git a/src/app/data-entries/input-group/input-group-sample-2/input-group-sample-2.component.ts b/src/app/data-entries/input-group/input-group-sample-2/input-group-sample-2.component.ts index 616d81dd3a..42124f2ff2 100644 --- a/src/app/data-entries/input-group/input-group-sample-2/input-group-sample-2.component.ts +++ b/src/app/data-entries/input-group/input-group-sample-2/input-group-sample-2.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { BaseInputGroupSampleComponent } from '../base-input.component'; import { FormsModule } from '@angular/forms'; import { IgxInputDirective, IgxInputGroupComponent, IgxLabelDirective } from 'igniteui-angular/input-group'; @@ -7,7 +7,6 @@ import { IgxInputDirective, IgxInputGroupComponent, IgxLabelDirective } from 'ig selector: 'app-input-group-sample-2', styleUrls: ['./input-group-sample-2.component.scss'], templateUrl: './input-group-sample-2.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [FormsModule, IgxInputGroupComponent, IgxInputDirective, IgxLabelDirective] }) export class InputGroupSample2Component extends BaseInputGroupSampleComponent { } diff --git a/src/app/data-entries/input-group/input-group-sample-3/input-group-sample-3.component.ts b/src/app/data-entries/input-group/input-group-sample-3/input-group-sample-3.component.ts index 352e25af3d..dca99a7b2e 100644 --- a/src/app/data-entries/input-group/input-group-sample-3/input-group-sample-3.component.ts +++ b/src/app/data-entries/input-group/input-group-sample-3/input-group-sample-3.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { BaseInputGroupSampleComponent } from '../base-input.component'; import { FormsModule } from '@angular/forms'; import { IgxInputDirective, IgxInputGroupComponent, IgxLabelDirective, IgxPrefixDirective, IgxSuffixDirective } from 'igniteui-angular/input-group'; @@ -8,7 +8,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: 'app-input-group-sample-3', styleUrls: ['./input-group-sample-3.component.scss'], templateUrl: './input-group-sample-3.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [FormsModule, IgxInputGroupComponent, IgxPrefixDirective, IgxLabelDirective, IgxInputDirective, IgxIconComponent, IgxSuffixDirective] }) export class InputGroupSample3Component extends BaseInputGroupSampleComponent { } diff --git a/src/app/data-entries/input-group/input-group-sample-4/input-group-sample-4.component.ts b/src/app/data-entries/input-group/input-group-sample-4/input-group-sample-4.component.ts index 797bdf1ea9..f6d6c66cca 100644 --- a/src/app/data-entries/input-group/input-group-sample-4/input-group-sample-4.component.ts +++ b/src/app/data-entries/input-group/input-group-sample-4/input-group-sample-4.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit } from '@angular/core'; import { BaseInputGroupSampleComponent } from '../base-input.component'; import { FormsModule } from '@angular/forms'; import { IgxHintDirective, IgxInputDirective, IgxInputGroupComponent, IgxLabelDirective, IgxPrefixDirective, IgxSuffixDirective } from 'igniteui-angular/input-group'; @@ -8,7 +8,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: 'app-input-group-sample-4', styleUrls: ['./input-group-sample-4.component.scss'], templateUrl: './input-group-sample-4.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [FormsModule, IgxInputGroupComponent, IgxPrefixDirective, IgxLabelDirective, IgxInputDirective, IgxSuffixDirective, IgxIconComponent, IgxHintDirective] }) export class InputGroupSample4Component extends BaseInputGroupSampleComponent { } diff --git a/src/app/data-entries/input-group/input-group-sample-5/input-group-sample-5.component.ts b/src/app/data-entries/input-group/input-group-sample-5/input-group-sample-5.component.ts index 665afd9b3a..569216794d 100644 --- a/src/app/data-entries/input-group/input-group-sample-5/input-group-sample-5.component.ts +++ b/src/app/data-entries/input-group/input-group-sample-5/input-group-sample-5.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { BaseInputGroupSampleComponent } from '../base-input.component'; import { IGX_INPUT_GROUP_TYPE, IgxHintDirective, IgxInputDirective, IgxInputGroupComponent, IgxLabelDirective, IgxPrefixDirective, IgxSuffixDirective } from 'igniteui-angular/input-group'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -10,7 +10,6 @@ import { FormsModule } from '@angular/forms'; styleUrls: ['./input-group-sample-5.component.scss'], templateUrl: './input-group-sample-5.component.html', providers: [{ provide: IGX_INPUT_GROUP_TYPE, useValue: 'box' }], - changeDetection: ChangeDetectionStrategy.Eager, imports: [FormsModule, IgxInputGroupComponent, IgxInputDirective, IgxLabelDirective, IgxSuffixDirective, IgxIconComponent, IgxHintDirective, IgxPrefixDirective] }) export class InputGroupSample5Component extends BaseInputGroupSampleComponent { } diff --git a/src/app/data-entries/input-group/input-group-sample-6/input-group-sample-6.component.ts b/src/app/data-entries/input-group/input-group-sample-6/input-group-sample-6.component.ts index a424ab1578..b2ca7951e2 100644 --- a/src/app/data-entries/input-group/input-group-sample-6/input-group-sample-6.component.ts +++ b/src/app/data-entries/input-group/input-group-sample-6/input-group-sample-6.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { BaseInputGroupSampleComponent } from '../base-input.component'; import { FormsModule } from '@angular/forms'; import { IgxSelectComponent, IgxSelectGroupComponent, IgxSelectItemComponent, IgxSelectToggleIconDirective } from 'igniteui-angular/select'; @@ -14,7 +14,6 @@ import { IgxButtonDirective, IgxRippleDirective } from 'igniteui-angular/directi selector: 'app-input-group-sample-6', styleUrls: ['./input-group-sample-6.component.scss'], templateUrl: './input-group-sample-6.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [FormsModule, IgxSelectComponent, IgxSelectGroupComponent, IgxSelectItemComponent, IgxLabelDirective, IgxSelectToggleIconDirective, IgxIconComponent, IgxInputGroupComponent, IgxInputDirective, IgxSuffixDirective, IgxPrefixDirective, IgxHintDirective, IgxComboComponent, IgxDatePickerComponent, IgxPickerToggleComponent, IgxTimePickerComponent, IgxButtonDirective, IgxRippleDirective] }) export class InputGroupSample6Component extends BaseInputGroupSampleComponent { diff --git a/src/app/data-entries/input-group/input-group-styling/input-group-styling.component.scss b/src/app/data-entries/input-group/input-group-styling/input-group-styling.component.scss index 93438be782..93d96f6824 100644 --- a/src/app/data-entries/input-group/input-group-styling/input-group-styling.component.scss +++ b/src/app/data-entries/input-group/input-group-styling/input-group-styling.component.scss @@ -1,37 +1,35 @@ -@use "layout.scss"; @use "igniteui-angular/theming" as *; -// CSS variables approach +:host { + display: grid; + max-width: rem(300px); + margin-top: rem(24px); -// igx-input-group { -// --border-color: #0f62fe; -// --size: #{rem(40px)}; -// --idle-bottom-line-color: #8d8d8d; -// --hover-bottom-line-color: #8d8d8d; -// --hover-placeholder-color: var(--ig-gray-600); -// --idle-secondary-color: var(--ig-gray-600); -// --focused-secondary-color: var(--ig-gray-700); -// --focused-bottom-line-color: #8d8d8d; -// --box-background-hover: var(--ig-gray-100); -// --helper-text-color: var(--ig-gray-600); -// } + ::ng-deep { + $custom-input-group: input-group-theme( + $schema: $light-indigo-schema, + $size: rem(40px), + ); -// Sass theme approach + @include typography( + $font-family: '"IBM Plex Sans", sans-serif', + $type-scale: $indigo-type-scale + ); -$custom-input-group: input-group-theme( - $border-color: #0f62fe, - $idle-bottom-line-color: #8d8d8d, - $hover-bottom-line-color: #8d8d8d, - $hover-placeholder-color: var(--ig-gray-600), - $idle-secondary-color: var(--ig-gray-600), - $focused-secondary-color: var(--ig-gray-700), - $size: rem(40px), - $box-border-radius: 0, - $box-background-hover: var(--ig-gray-100), - $placeholder-color: var(--ig-gray-600), - $helper-text-color: var(--ig-gray-600) -); + @include theme( + $palette: $light-indigo-palette, + $schema: $light-indigo-schema + ); -:host { - @include tokens($custom-input-group); + .igx-input-group { + @include tokens($custom-input-group); + + --ig-caption-font-weight: 400; + --ig-subtitle-1-font-weight: 400; + + &__bundle-main { + background: var(--box-background-hover); + } + } + } } diff --git a/src/app/data-entries/input-group/input-group-styling/input-group-styling.component.ts b/src/app/data-entries/input-group/input-group-styling/input-group-styling.component.ts index d293bb8d3e..de877f6a90 100644 --- a/src/app/data-entries/input-group/input-group-styling/input-group-styling.component.ts +++ b/src/app/data-entries/input-group/input-group-styling/input-group-styling.component.ts @@ -1,13 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxHintDirective, IgxInputDirective, IgxInputGroupComponent, IgxLabelDirective } from 'igniteui-angular/input-group'; -import { THEME_TOKEN, ThemeToken } from 'igniteui-angular/core'; @Component({ selector: 'app-input-group-style', templateUrl: 'input-group-styling.component.html', styleUrls: ['input-group-styling.component.scss'], - imports: [IgxInputGroupComponent, IgxLabelDirective, IgxInputDirective, IgxHintDirective], - changeDetection: ChangeDetectionStrategy.Eager, - providers: [{provide: THEME_TOKEN, useFactory: () => new ThemeToken('indigo')}] + imports: [IgxInputGroupComponent, IgxLabelDirective, IgxInputDirective, IgxHintDirective] }) export class InputGroupStyleComponent { } diff --git a/src/app/data-entries/input-group/input-group-styling/layout.scss b/src/app/data-entries/input-group/input-group-styling/layout.scss deleted file mode 100644 index 74026e1dc1..0000000000 --- a/src/app/data-entries/input-group/input-group-styling/layout.scss +++ /dev/null @@ -1,53 +0,0 @@ -@use "igniteui-angular/theming" as *; -@use "igniteui-angular/lib/core/styles/components/input/input-group-component" as input; -@use "sass:map"; - -:host { - ::ng-deep { - $_input-schema: map.get($light-indigo-schema, input-group); - @include input-group(input-group-theme($schema: $_input-schema)); - @include input.component(); - - // Note: This is not the standard approach for styling the component. - // We're using it here solely to mirror the Carbon sample. - - .igx-input-group__bundle { - background: var(--box-background-hover); - - [igxinput].igx-input-group__input { - letter-spacing: rem(0.16px); - padding-block: 0; - padding-inline: rem(12px); - font-size: rem(14px); - } - - input::placeholder { - font-size: rem(14px); - font-style: normal; - opacity: 0.7; - font-weight: 300; - font-family: "IBM Plex Sans", sans-serif; - } - } - - .igx-input-group--focused .igx-input-group__bundle::after { - border-block-end: 0; - inset: 0; - pointer-events: none; - box-shadow: inset 0 0 0 rem(2px) var(--border-color); - } - - .igx-input-group__label, igx-hint { - font-weight: 300; - } - } -} - -igx-input-group { - --ig-font-family: "IBM Plex Sans", sans-serif; -} - -.sample-column { - max-width: rem(300px); - margin-top: rem(24px); -} \ No newline at end of file diff --git a/src/app/data-entries/input-group/input-group-tailwind-styling/input-group-tailwind-styling.component.ts b/src/app/data-entries/input-group/input-group-tailwind-styling/input-group-tailwind-styling.component.ts index 1431622da4..13807e1c0e 100644 --- a/src/app/data-entries/input-group/input-group-tailwind-styling/input-group-tailwind-styling.component.ts +++ b/src/app/data-entries/input-group/input-group-tailwind-styling/input-group-tailwind-styling.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxHintDirective, IgxInputDirective, IgxInputGroupComponent, IgxLabelDirective, IgxPrefixDirective, IgxSuffixDirective } from 'igniteui-angular/input-group'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -6,7 +6,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: 'app-input-group-tailwind-style', templateUrl: 'input-group-tailwind-styling.component.html', styleUrls: ['input-group-tailwind-styling.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxInputGroupComponent, IgxPrefixDirective, IgxLabelDirective, IgxInputDirective, IgxSuffixDirective, IgxIconComponent, IgxHintDirective] }) export class InputGroupTailwindStyleComponent { } diff --git a/src/app/data-entries/input-group/input-text-selection/input-text-selection.component.ts b/src/app/data-entries/input-group/input-text-selection/input-text-selection.component.ts index c650f9087f..e77db846cd 100644 --- a/src/app/data-entries/input-group/input-text-selection/input-text-selection.component.ts +++ b/src/app/data-entries/input-group/input-text-selection/input-text-selection.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { IgxInputDirective, IgxInputGroupComponent, IgxLabelDirective } from 'igniteui-angular/input-group'; import { IgxFocusDirective, IgxTextSelectionDirective } from 'igniteui-angular/directives'; @@ -7,7 +7,6 @@ import { IgxFocusDirective, IgxTextSelectionDirective } from 'igniteui-angular/d selector: 'app-input-text-selection', templateUrl: './input-text-selection.component.html', styleUrls: ['./input-text-selection.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [FormsModule, IgxInputGroupComponent, IgxInputDirective, IgxTextSelectionDirective, IgxLabelDirective, IgxFocusDirective] }) export class InputTextSelectionComponent { diff --git a/src/app/data-entries/input-group/reactive-form-custom-validation/reactive-form-custom-validation.component.ts b/src/app/data-entries/input-group/reactive-form-custom-validation/reactive-form-custom-validation.component.ts index 5c3fe1b674..860d8c18c2 100644 --- a/src/app/data-entries/input-group/reactive-form-custom-validation/reactive-form-custom-validation.component.ts +++ b/src/app/data-entries/input-group/reactive-form-custom-validation/reactive-form-custom-validation.component.ts @@ -1,4 +1,4 @@ -import { Component, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, inject } from '@angular/core'; import { AbstractControl, FormBuilder, FormControl, FormGroup, ValidationErrors, ValidatorFn, Validators, FormsModule, ReactiveFormsModule } from '@angular/forms'; import { IgxHintDirective, IgxInputDirective, IgxInputGroupComponent, IgxLabelDirective, IgxSuffixDirective } from 'igniteui-angular/input-group'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -24,7 +24,6 @@ interface ValidatorErrors selector: 'app-reactive-form-custom-validation', templateUrl: './reactive-form-custom-validation.component.html', styleUrls: ['./reactive-form-custom-validation.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [FormsModule, ReactiveFormsModule, IgxInputGroupComponent, IgxLabelDirective, IgxInputDirective, IgxHintDirective, IgxIconComponent, IgxSuffixDirective, IgxButtonDirective, IgxRippleDirective] }) export class ReactiveFormCustomValidationComponent { diff --git a/src/app/data-entries/input-group/reactive-form-validation/reactive-form-validation.component.ts b/src/app/data-entries/input-group/reactive-form-validation/reactive-form-validation.component.ts index 9b2b6aab6f..8d2e85424a 100644 --- a/src/app/data-entries/input-group/reactive-form-validation/reactive-form-validation.component.ts +++ b/src/app/data-entries/input-group/reactive-form-validation/reactive-form-validation.component.ts @@ -1,4 +1,4 @@ -import { Component, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, inject } from '@angular/core'; import { FormBuilder, FormControl, FormGroup, Validators, FormsModule, ReactiveFormsModule } from '@angular/forms'; import { IgxHintDirective, IgxInputDirective, IgxInputGroupComponent, IgxLabelDirective, IgxSuffixDirective } from 'igniteui-angular/input-group'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -16,7 +16,6 @@ interface User selector: 'app-reactive-form-validation', templateUrl: './reactive-form-validation.component.html', styleUrls: ['./reactive-form-validation.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [FormsModule, ReactiveFormsModule, IgxInputGroupComponent, IgxLabelDirective, IgxInputDirective, IgxHintDirective, IgxIconComponent, IgxSuffixDirective, IgxButtonDirective, IgxRippleDirective] }) export class ReactiveFormValidationComponent { diff --git a/src/app/data-entries/input-group/template-driven-form-validation/template-driven-form-validation.component.ts b/src/app/data-entries/input-group/template-driven-form-validation/template-driven-form-validation.component.ts index 31b2dab67c..7ba7e247bd 100644 --- a/src/app/data-entries/input-group/template-driven-form-validation/template-driven-form-validation.component.ts +++ b/src/app/data-entries/input-group/template-driven-form-validation/template-driven-form-validation.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { NgForm, FormsModule } from '@angular/forms'; import { IgxHintDirective, IgxInputDirective, IgxInputGroupComponent, IgxLabelDirective, IgxSuffixDirective } from 'igniteui-angular/input-group'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -16,7 +16,6 @@ interface User selector: 'app-template-driven-form-validation', templateUrl: './template-driven-form-validation.component.html', styleUrls: ['./template-driven-form-validation.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [FormsModule, IgxInputGroupComponent, IgxLabelDirective, IgxInputDirective, IgxHintDirective, IgxIconComponent, IgxSuffixDirective, IgxButtonDirective, IgxRippleDirective] }) export class TemplateDrivenFormValidationComponent { diff --git a/src/app/data-entries/input-group/typed-form/typed-form.component.ts b/src/app/data-entries/input-group/typed-form/typed-form.component.ts index 2c575748e3..a9d3470306 100644 --- a/src/app/data-entries/input-group/typed-form/typed-form.component.ts +++ b/src/app/data-entries/input-group/typed-form/typed-form.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { FormControl, FormGroup, FormsModule, ReactiveFormsModule } from "@angular/forms"; import { IgxInputDirective, IgxInputGroupComponent, IgxLabelDirective, IgxSuffixDirective } from 'igniteui-angular/input-group'; import { IgxDatePickerComponent } from 'igniteui-angular/date-picker'; @@ -21,7 +21,6 @@ export interface registrationFormGroup selector: 'app-typed-form', templateUrl: './typed-form.component.html', styleUrls: ['./typed-form.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [FormsModule, ReactiveFormsModule, IgxInputGroupComponent, IgxLabelDirective, IgxInputDirective, IgxDatePickerComponent, IgxPickerToggleComponent, IgxSuffixDirective, IgxIconComponent, IgxButtonDirective, IgxRippleDirective] }) export class TypedFormComponent { diff --git a/src/app/data-entries/radio/radio-group-sample/radio-group-sample.component.ts b/src/app/data-entries/radio/radio-group-sample/radio-group-sample.component.ts index ce4ab816ce..c2b0f8282e 100644 --- a/src/app/data-entries/radio/radio-group-sample/radio-group-sample.component.ts +++ b/src/app/data-entries/radio/radio-group-sample/radio-group-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, inject } from '@angular/core'; import { FormBuilder, FormGroup, Validators, FormsModule, ReactiveFormsModule } from '@angular/forms'; import { IgxInputDirective, IgxInputGroupComponent, IgxLabelDirective } from 'igniteui-angular/input-group'; import { IgxRadioComponent, IgxRadioGroupDirective } from 'igniteui-angular/radio'; @@ -9,7 +9,6 @@ import { IgxButtonDirective, IgxRippleDirective } from 'igniteui-angular/directi selector: 'app-radio-group-sample', styleUrls: ['./radio-group-sample.component.scss'], templateUrl: './radio-group-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [FormsModule, ReactiveFormsModule, IgxInputGroupComponent, IgxInputDirective, IgxRadioGroupDirective, IgxRadioComponent, IgxButtonDirective, IgxRippleDirective, IgxLabelDirective] }) export class RadioGroupSampleComponent { diff --git a/src/app/data-entries/radio/radio-group-vertical/radio-group-vertical.component.ts b/src/app/data-entries/radio/radio-group-vertical/radio-group-vertical.component.ts index ab52bf7bfc..1177232f62 100644 --- a/src/app/data-entries/radio/radio-group-vertical/radio-group-vertical.component.ts +++ b/src/app/data-entries/radio/radio-group-vertical/radio-group-vertical.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxRadioComponent, IgxRadioGroupDirective, RadioGroupAlignment } from 'igniteui-angular/radio'; import { FormsModule } from '@angular/forms'; @@ -6,7 +6,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-radio-group-vertical', styleUrls: ['./radio-group-vertical.component.scss'], templateUrl: './radio-group-vertical.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxRadioGroupDirective, IgxRadioComponent, FormsModule] }) export class RadioGroupVerticalComponent { diff --git a/src/app/data-entries/radio/radio-sample-1/radio-sample-1.component.ts b/src/app/data-entries/radio/radio-sample-1/radio-sample-1.component.ts index bd34f7dc75..9040353575 100644 --- a/src/app/data-entries/radio/radio-sample-1/radio-sample-1.component.ts +++ b/src/app/data-entries/radio/radio-sample-1/radio-sample-1.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxRadioComponent } from 'igniteui-angular/radio'; import { FormsModule } from '@angular/forms'; @@ -6,7 +6,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-radio-sample-1', styleUrls: ['./radio-sample-1.component.scss'], templateUrl: './radio-sample-1.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxRadioComponent, FormsModule] }) export class RadioSample1Component { diff --git a/src/app/data-entries/radio/radio-sample-2/radio-sample-2.component.ts b/src/app/data-entries/radio/radio-sample-2/radio-sample-2.component.ts index 4dbcb071d3..b0ca495fd1 100644 --- a/src/app/data-entries/radio/radio-sample-2/radio-sample-2.component.ts +++ b/src/app/data-entries/radio/radio-sample-2/radio-sample-2.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxRadioComponent } from 'igniteui-angular/radio'; import { FormsModule } from '@angular/forms'; @@ -7,7 +7,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-radio-sample-2', styleUrls: ['./radio-sample-2.component.scss'], templateUrl: './radio-sample-2.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxRadioComponent, FormsModule] }) export class RadioSample2Component { diff --git a/src/app/data-entries/radio/radio-sample-3/radio-sample-3.component.ts b/src/app/data-entries/radio/radio-sample-3/radio-sample-3.component.ts index d5602a38ae..5ba8c18c3e 100644 --- a/src/app/data-entries/radio/radio-sample-3/radio-sample-3.component.ts +++ b/src/app/data-entries/radio/radio-sample-3/radio-sample-3.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxRadioComponent } from 'igniteui-angular/radio'; import { FormsModule } from '@angular/forms'; @@ -6,7 +6,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-radio-sample-3', styleUrls: ['./radio-sample-3.component.scss'], templateUrl: './radio-sample-3.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxRadioComponent, FormsModule] }) export class RadioSample3Component { diff --git a/src/app/data-entries/radio/radio-styling-sample/layout.scss b/src/app/data-entries/radio/radio-styling-sample/layout.scss index 3c6fc3501a..226b493743 100644 --- a/src/app/data-entries/radio/radio-styling-sample/layout.scss +++ b/src/app/data-entries/radio/radio-styling-sample/layout.scss @@ -1,54 +1,12 @@ @use "igniteui-angular/theming" as *; -@use "igniteui-angular/lib/core/styles/components/radio/radio-component" as radio; @use "sass:map"; -:host { - ::ng-deep{ - $_radio-schema: map.get($light-fluent-schema, radio); - @include radio(radio-theme($schema: $_radio-schema)); - @include radio.component(); - - // Note: This is not the standard approach for styling the component. - // We're using it here solely to mirror the UI5 sample. - - .igx-radio--checked .igx-radio__composite::after { - --fill-color: #556b81; - } - - .igx-radio__composite::after, - .igx-radio__composite::before, - .igx-radio__composite { - width: rem(18px); - height: rem(18px); - } - - .igx-radio__composite { - min-width: rem(18px); - } - - .igx-radio__ripple { - display: none; - } - } -} - igx-radio + igx-radio { margin-top: 1rem; } -igx-radio { - --ig-subtitle-1-font-size: #{rem(14px)}; - --ig-font-family: Arial,Helvetica,sans-serif; -} - .radio-wrapper { display: flex; flex-flow: column nowrap; padding: 1rem; -} - -.igx-radio--focused::after { - inset: rem(1px) rem(-4px) rem(1px) rem(-2px); - border-radius: rem(8px); - box-shadow: 0 0 0 rem(2px) var(--focus-outline-color); } \ No newline at end of file diff --git a/src/app/data-entries/radio/radio-styling-sample/radio-styling-sample.component.scss b/src/app/data-entries/radio/radio-styling-sample/radio-styling-sample.component.scss index a83adef32e..cccd9cee56 100644 --- a/src/app/data-entries/radio/radio-styling-sample/radio-styling-sample.component.scss +++ b/src/app/data-entries/radio/radio-styling-sample/radio-styling-sample.component.scss @@ -4,27 +4,15 @@ // CSS variables approach // igx-radio { -// --empty-color: #556b81; -// --label-color: #131e29; -// --fill-color: #0064d9; -// --focus-outline-color: #0032a5; -// } - -// igx-radio:hover { -// --empty-fill-color: #e3f0ff; -// --empty-color: #0064d9; -// --hover-color: transparent; +// --empty-color: #345779; +// --fill-color: #2dabe8; // } // Sass theme approach $custom-radio-theme: radio-theme( - $empty-color: #556b81, - $label-color: #131e29, - $fill-color: #0064d9, - $focus-outline-color: #0032a5, - $fill-color-hover: #0064d9, - $hover-color: transparent + $empty-color: #345779, + $fill-color: #2dabe8, ); :host { diff --git a/src/app/data-entries/radio/radio-styling-sample/radio-styling-sample.component.ts b/src/app/data-entries/radio/radio-styling-sample/radio-styling-sample.component.ts index 8ad8b11315..a0382f9229 100644 --- a/src/app/data-entries/radio/radio-styling-sample/radio-styling-sample.component.ts +++ b/src/app/data-entries/radio/radio-styling-sample/radio-styling-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxRadioComponent } from 'igniteui-angular/radio'; import { FormsModule } from '@angular/forms'; @@ -6,7 +6,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-radio-sample-1', styleUrls: ['./radio-styling-sample.component.scss'], templateUrl: './radio-styling-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxRadioComponent, FormsModule] }) export class RadioStylingSampleComponent { diff --git a/src/app/data-entries/radio/radio-tailwind-styling-sample/radio-tailwind-styling-sample.component.ts b/src/app/data-entries/radio/radio-tailwind-styling-sample/radio-tailwind-styling-sample.component.ts index c90bf24315..4618d4de52 100644 --- a/src/app/data-entries/radio/radio-tailwind-styling-sample/radio-tailwind-styling-sample.component.ts +++ b/src/app/data-entries/radio/radio-tailwind-styling-sample/radio-tailwind-styling-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxRadioComponent } from 'igniteui-angular/radio'; import { FormsModule } from '@angular/forms'; @@ -6,7 +6,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-radio-tailwind-styling', styleUrls: ['./radio-tailwind-styling-sample.component.scss'], templateUrl: './radio-tailwind-styling-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxRadioComponent, FormsModule] }) export class RadioTailwindStylingSampleComponent { diff --git a/src/app/data-entries/rating/rating-form/rating-form.component.ts b/src/app/data-entries/rating/rating-form/rating-form.component.ts index aca9918355..821ff3bad1 100644 --- a/src/app/data-entries/rating/rating-form/rating-form.component.ts +++ b/src/app/data-entries/rating/rating-form/rating-form.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgcRatingComponent, defineComponents } from 'igniteui-webcomponents'; import { FormsModule } from '@angular/forms'; import { IgxCardActionsComponent, IgxCardComponent, IgxCardContentDirective, IgxCardHeaderComponent, IgxCardHeaderSubtitleDirective, IgxCardHeaderTitleDirective, IgxCardMediaDirective } from 'igniteui-angular/card'; @@ -13,7 +13,6 @@ defineComponents(IgcRatingComponent) selector: 'app-rating-sample', styleUrls: ['./rating-form.component.scss'], templateUrl: './rating-form.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [FormsModule, IgxCardComponent, IgxCardMediaDirective, IgxCardHeaderComponent, IgxCardHeaderTitleDirective, IgxCardContentDirective, IgxCardHeaderSubtitleDirective, IgcFormControlDirective, IgxCardActionsComponent, IgxButtonDirective, IgxRippleDirective, IgxPrefixDirective, IgxIconButtonDirective, IgxSuffixDirective, IgxIconComponent, CurrencyPipe] }) export class RatingInFormComponent { diff --git a/src/app/data-entries/select/select-header-footer/select-header-footer.component.scss b/src/app/data-entries/select/select-header-footer/select-header-footer.component.scss index e8f2168de6..ff1162c628 100644 --- a/src/app/data-entries/select/select-header-footer/select-header-footer.component.scss +++ b/src/app/data-entries/select/select-header-footer/select-header-footer.component.scss @@ -32,6 +32,7 @@ igx-select { justify-content: space-between; align-items: center; padding: 0 1.5rem; + gap: 1rem; background: color($color: 'gray', $variant: 100); igx-icon { &.important-icon { diff --git a/src/app/data-entries/select/select-header-footer/select-header-footer.component.ts b/src/app/data-entries/select/select-header-footer/select-header-footer.component.ts index 7f91fe9d0d..268780336c 100644 --- a/src/app/data-entries/select/select-header-footer/select-header-footer.component.ts +++ b/src/app/data-entries/select/select-header-footer/select-header-footer.component.ts @@ -1,4 +1,4 @@ -import { ChangeDetectorRef, Component, ElementRef, OnInit, inject, ChangeDetectionStrategy } from '@angular/core'; +import { ChangeDetectorRef, Component, ElementRef, OnInit, inject } from '@angular/core'; import { IgxSelectComponent, IgxSelectFooterDirective, IgxSelectHeaderDirective, IgxSelectItemComponent } from 'igniteui-angular/select'; import { IgxLabelDirective } from 'igniteui-angular/input-group'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -9,7 +9,6 @@ import { IgxButtonDirective } from 'igniteui-angular/directives'; selector: 'app-select-header-footer', styleUrls: ['select-header-footer.component.scss'], templateUrl: 'select-header-footer.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSelectComponent, IgxLabelDirective, IgxSelectItemComponent, IgxIconComponent, IgxSelectHeaderDirective, IgxButtonGroupComponent, IgxButtonDirective, IgxSelectFooterDirective] }) export class SelectHeaderFooterComponent implements OnInit { diff --git a/src/app/data-entries/select/select-input-directives/select-input-directives.ts b/src/app/data-entries/select/select-input-directives/select-input-directives.ts index 2fda3e6c8e..eed531ced8 100644 --- a/src/app/data-entries/select/select-input-directives/select-input-directives.ts +++ b/src/app/data-entries/select/select-input-directives/select-input-directives.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { IgxSelectComponent, IgxSelectItemComponent } from 'igniteui-angular/select'; import { IgxHintDirective, IgxLabelDirective, IgxPrefixDirective, IgxSuffixDirective } from 'igniteui-angular/input-group'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -9,7 +9,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-select-input-directives', styleUrls: ['select-input-directives.scss'], templateUrl: 'select-input-directives.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSelectComponent, FormsModule, IgxLabelDirective, IgxPrefixDirective, IgxSuffixDirective, IgxIconComponent, IgxHintDirective, IgxSelectItemComponent] }) diff --git a/src/app/data-entries/select/select-sample-1/select-sample-1.component.ts b/src/app/data-entries/select/select-sample-1/select-sample-1.component.ts index 82c919bf2c..9b49a87f85 100644 --- a/src/app/data-entries/select/select-sample-1/select-sample-1.component.ts +++ b/src/app/data-entries/select/select-sample-1/select-sample-1.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxSelectComponent, IgxSelectItemComponent } from 'igniteui-angular/select'; import { IgxLabelDirective } from 'igniteui-angular/input-group'; @@ -7,7 +7,6 @@ import { IgxLabelDirective } from 'igniteui-angular/input-group'; selector: 'app-select-sample-1', styleUrls: ['select-sample-1.component.scss'], templateUrl: 'select-sample-1.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSelectComponent, IgxLabelDirective, IgxSelectItemComponent] }) export class SelectSample1Component { diff --git a/src/app/data-entries/select/select-sample-2/select-sample-2.component.ts b/src/app/data-entries/select/select-sample-2/select-sample-2.component.ts index eb60e99022..56e91d9e8e 100644 --- a/src/app/data-entries/select/select-sample-2/select-sample-2.component.ts +++ b/src/app/data-entries/select/select-sample-2/select-sample-2.component.ts @@ -1,5 +1,5 @@ -import { Component, ElementRef, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ElementRef, ViewChild, inject } from '@angular/core'; import { IgxSelectComponent, IgxSelectGroupComponent, IgxSelectItemComponent } from 'igniteui-angular/select'; import { IgxLabelDirective } from 'igniteui-angular/input-group'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -9,7 +9,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: 'app-select-sample-2', styleUrls: ['select-sample-2.component.scss'], templateUrl: 'select-sample-2.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSelectComponent, IgxLabelDirective, IgxSelectGroupComponent, IgxSelectItemComponent, IgxIconComponent] }) export class SelectSample2Component { diff --git a/src/app/data-entries/select/select-sample-4/select-sample-4.component.ts b/src/app/data-entries/select/select-sample-4/select-sample-4.component.ts index 72ceb72610..655d3642a8 100644 --- a/src/app/data-entries/select/select-sample-4/select-sample-4.component.ts +++ b/src/app/data-entries/select/select-sample-4/select-sample-4.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { AbsoluteScrollStrategy, ConnectedPositioningStrategy, HorizontalAlignment, OverlaySettings, PositionSettings, VerticalAlignment } from 'igniteui-angular/core'; import { IgxSelectComponent, IgxSelectItemComponent } from 'igniteui-angular/select'; import { IgxLabelDirective } from 'igniteui-angular/input-group'; @@ -9,7 +9,6 @@ import { scaleInTop, scaleOutBottom } from 'igniteui-angular/animations'; selector: 'app-select-sample-4', styleUrls: ['select-sample-4.component.scss'], templateUrl: 'select-sample-4.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSelectComponent, IgxLabelDirective, IgxSelectItemComponent] }) export class SelectSample4Component implements OnInit { diff --git a/src/app/data-entries/select/select-styling/select-styling.component.ts b/src/app/data-entries/select/select-styling/select-styling.component.ts index 9b2802eaef..a5ec650acb 100644 --- a/src/app/data-entries/select/select-styling/select-styling.component.ts +++ b/src/app/data-entries/select/select-styling/select-styling.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { AbsoluteScrollStrategy, ConnectedPositioningStrategy, HorizontalAlignment, OverlaySettings, PositionSettings, VerticalAlignment } from 'igniteui-angular/core'; import { IgxSelectComponent, IgxSelectItemComponent } from 'igniteui-angular/select'; import { IgxLabelDirective } from 'igniteui-angular/input-group'; @@ -9,7 +9,6 @@ import { scaleInTop, scaleOutBottom } from 'igniteui-angular/animations'; selector: 'app-select-styling', styleUrls: ['select-styling.component.scss'], templateUrl: 'select-styling.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSelectComponent, IgxLabelDirective, IgxSelectItemComponent] }) export class SelectStylingComponent implements OnInit { diff --git a/src/app/data-entries/select/select-tailwind-styling/select-tailwind-styling.component.ts b/src/app/data-entries/select/select-tailwind-styling/select-tailwind-styling.component.ts index 3e68eb06a1..474ebd00cf 100644 --- a/src/app/data-entries/select/select-tailwind-styling/select-tailwind-styling.component.ts +++ b/src/app/data-entries/select/select-tailwind-styling/select-tailwind-styling.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { AbsoluteScrollStrategy, ConnectedPositioningStrategy, HorizontalAlignment, OverlaySettings, PositionSettings, VerticalAlignment } from 'igniteui-angular/core'; import { IgxSelectComponent, IgxSelectItemComponent } from 'igniteui-angular/select'; import { IgxLabelDirective } from 'igniteui-angular/input-group'; @@ -9,7 +9,6 @@ import { scaleInTop, scaleOutBottom } from 'igniteui-angular/animations'; selector: 'app-select-tailwind-styling', styleUrls: ['select-tailwind-styling.component.scss'], templateUrl: 'select-tailwind-styling.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSelectComponent, IgxLabelDirective, IgxSelectItemComponent] }) export class SelectTailwindStylingComponent implements OnInit { diff --git a/src/app/data-entries/switch/switch-sample-1/switch-sample-1.component.ts b/src/app/data-entries/switch/switch-sample-1/switch-sample-1.component.ts index 4de3869874..906229df20 100644 --- a/src/app/data-entries/switch/switch-sample-1/switch-sample-1.component.ts +++ b/src/app/data-entries/switch/switch-sample-1/switch-sample-1.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxSwitchComponent } from 'igniteui-angular/switch'; @Component({ selector: 'app-switch-sample-1', styleUrls: ['./switch-sample-1.component.scss'], templateUrl: './switch-sample-1.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSwitchComponent] }) export class SwitchSample1Component { } diff --git a/src/app/data-entries/switch/switch-sample-2/switch-sample-2.component.ts b/src/app/data-entries/switch/switch-sample-2/switch-sample-2.component.ts index 5ff961bc82..54c4e0d49a 100644 --- a/src/app/data-entries/switch/switch-sample-2/switch-sample-2.component.ts +++ b/src/app/data-entries/switch/switch-sample-2/switch-sample-2.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxSwitchComponent } from 'igniteui-angular/switch'; @@ -6,7 +6,6 @@ import { IgxSwitchComponent } from 'igniteui-angular/switch'; selector: 'app-switch-sample-2', styleUrls: ['./switch-sample-2.component.scss'], templateUrl: './switch-sample-2.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSwitchComponent] }) export class SwitchSample2Component { diff --git a/src/app/data-entries/switch/switch-styling/layout.scss b/src/app/data-entries/switch/switch-styling/layout.scss index b248011ce1..6e92f5d995 100644 --- a/src/app/data-entries/switch/switch-styling/layout.scss +++ b/src/app/data-entries/switch/switch-styling/layout.scss @@ -1,12 +1,10 @@ @use "igniteui-angular/theming" as *; -@use "igniteui-angular/lib/core/styles/components/switch/switch-component" as switch; @use 'sass:map'; :host { ::ng-deep { $_switch-schema: map.get($light-fluent-schema, switch); - @include switch(switch-theme($schema: $_switch-schema)); - @include switch.component(); + @include tokens(switch-theme($schema: $_switch-schema)); // Note: This is not the standard approach for styling the component. // We're using it here solely to mirror the UI5 sample. diff --git a/src/app/data-entries/switch/switch-styling/switch-styling.component.ts b/src/app/data-entries/switch/switch-styling/switch-styling.component.ts index 5c42c4cb88..31793317e2 100644 --- a/src/app/data-entries/switch/switch-styling/switch-styling.component.ts +++ b/src/app/data-entries/switch/switch-styling/switch-styling.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxSwitchComponent } from 'igniteui-angular/switch'; @Component({ selector: 'app-switch-styling', styleUrls: ['./switch-styling.component.scss'], templateUrl: './switch-styling.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSwitchComponent] }) export class SwitchStylingComponent { diff --git a/src/app/data-entries/switch/switch-tailwind-styling/switch-tailwind-styling.component.ts b/src/app/data-entries/switch/switch-tailwind-styling/switch-tailwind-styling.component.ts index de125441e6..e49904ee31 100644 --- a/src/app/data-entries/switch/switch-tailwind-styling/switch-tailwind-styling.component.ts +++ b/src/app/data-entries/switch/switch-tailwind-styling/switch-tailwind-styling.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxSwitchComponent } from 'igniteui-angular/switch'; @@ -6,7 +6,6 @@ import { IgxSwitchComponent } from 'igniteui-angular/switch'; selector: 'app-switch-tailwind-styling', styleUrls: ['./switch-tailwind-styling.component.scss'], templateUrl: './switch-tailwind-styling.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSwitchComponent] }) export class SwitchTailwindStylingComponent { diff --git a/src/app/grid-lite/grid-lite-column-config-dynamic/grid-lite-column-config-dynamic.component.ts b/src/app/grid-lite/grid-lite-column-config-dynamic/grid-lite-column-config-dynamic.component.ts index e8b3f17598..114085df12 100644 --- a/src/app/grid-lite/grid-lite-column-config-dynamic/grid-lite-column-config-dynamic.component.ts +++ b/src/app/grid-lite/grid-lite-column-config-dynamic/grid-lite-column-config-dynamic.component.ts @@ -1,4 +1,4 @@ -import { Component, CUSTOM_ELEMENTS_SCHEMA, OnInit, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, CUSTOM_ELEMENTS_SCHEMA, OnInit, inject } from '@angular/core'; import { CommonModule } from '@angular/common'; import { IgxButtonDirective, IgxToggleActionDirective } from 'igniteui-angular/directives'; import { IgxCheckboxComponent } from 'igniteui-angular/checkbox'; @@ -28,7 +28,6 @@ defineComponents(IgcRatingComponent); IgxSwitchComponent ], schemas: [CUSTOM_ELEMENTS_SCHEMA], - changeDetection: ChangeDetectionStrategy.Eager, standalone: true }) export class GridLiteColumnConfigDynamicComponent implements OnInit { diff --git a/src/app/grid-lite/grid-lite-column-config-headers/grid-lite-column-config-headers.component.ts b/src/app/grid-lite/grid-lite-column-config-headers/grid-lite-column-config-headers.component.ts index 1980a7b5db..b8e1c1e4a3 100644 --- a/src/app/grid-lite/grid-lite-column-config-headers/grid-lite-column-config-headers.component.ts +++ b/src/app/grid-lite/grid-lite-column-config-headers/grid-lite-column-config-headers.component.ts @@ -1,4 +1,4 @@ -import { Component, CUSTOM_ELEMENTS_SCHEMA, OnInit, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, CUSTOM_ELEMENTS_SCHEMA, OnInit, inject } from '@angular/core'; import { CommonModule } from '@angular/common'; import { defineComponents, IgcRatingComponent } from 'igniteui-webcomponents'; import { GridLiteDataService, ProductInfo } from '../grid-lite-data.service'; @@ -17,7 +17,6 @@ defineComponents(IgcRatingComponent); IgxGridLiteCellTemplateDirective, IgxGridLiteHeaderTemplateDirective ], - changeDetection: ChangeDetectionStrategy.Eager, schemas: [CUSTOM_ELEMENTS_SCHEMA] }) export class GridLiteColumnConfigHeadersComponent implements OnInit { diff --git a/src/app/grid-lite/grid-lite-column-config-simple/grid-lite-column-config-simple.component.ts b/src/app/grid-lite/grid-lite-column-config-simple/grid-lite-column-config-simple.component.ts index 4c28a7c154..84538bf290 100644 --- a/src/app/grid-lite/grid-lite-column-config-simple/grid-lite-column-config-simple.component.ts +++ b/src/app/grid-lite/grid-lite-column-config-simple/grid-lite-column-config-simple.component.ts @@ -1,4 +1,4 @@ -import { Component, CUSTOM_ELEMENTS_SCHEMA, OnInit, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, CUSTOM_ELEMENTS_SCHEMA, OnInit, inject } from '@angular/core'; import { CommonModule } from '@angular/common'; import { defineComponents, IgcRatingComponent } from 'igniteui-webcomponents'; import { GridLiteDataService, ProductInfo } from '../grid-lite-data.service'; @@ -11,7 +11,6 @@ defineComponents(IgcRatingComponent); templateUrl: './grid-lite-column-config-simple.component.html', styleUrls: ['./grid-lite-column-config-simple.component.scss'], imports: [CommonModule, IgxGridLiteComponent, IgxGridLiteColumnComponent, IgxGridLiteCellTemplateDirective], - changeDetection: ChangeDetectionStrategy.Eager, schemas: [CUSTOM_ELEMENTS_SCHEMA] }) export class GridLiteColumnConfigSimpleComponent implements OnInit { diff --git a/src/app/grid-lite/grid-lite-data-binding-dynamic/grid-lite-data-binding-dynamic.component.ts b/src/app/grid-lite/grid-lite-data-binding-dynamic/grid-lite-data-binding-dynamic.component.ts index 4610f15ae4..66d4ae5f89 100644 --- a/src/app/grid-lite/grid-lite-data-binding-dynamic/grid-lite-data-binding-dynamic.component.ts +++ b/src/app/grid-lite/grid-lite-data-binding-dynamic/grid-lite-data-binding-dynamic.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, inject } from '@angular/core'; import { CommonModule } from '@angular/common'; import { GridLiteDataService, ProductInfo, UserSimple } from '../grid-lite-data.service'; import { IgxGridLiteComponent, IgxGridLiteColumnComponent } from 'igniteui-angular/grids/lite'; @@ -8,7 +8,6 @@ import { IgxButtonDirective } from 'igniteui-angular/directives'; selector: 'app-grid-lite-data-binding-dynamic', templateUrl: './grid-lite-data-binding-dynamic.component.html', styleUrls: ['./grid-lite-data-binding-dynamic.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [ CommonModule, IgxGridLiteComponent, diff --git a/src/app/grid-lite/grid-lite-filtering-events/grid-lite-filtering-events.component.ts b/src/app/grid-lite/grid-lite-filtering-events/grid-lite-filtering-events.component.ts index d38ce4e867..ee3c5b1106 100644 --- a/src/app/grid-lite/grid-lite-filtering-events/grid-lite-filtering-events.component.ts +++ b/src/app/grid-lite/grid-lite-filtering-events/grid-lite-filtering-events.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, inject } from '@angular/core'; import { CommonModule } from '@angular/common'; import { defineComponents, IgcCheckboxComponent } from 'igniteui-webcomponents'; import { GridLiteDataService, User } from '../grid-lite-data.service'; @@ -15,7 +15,6 @@ defineComponents(IgcCheckboxComponent); selector: 'app-grid-lite-filtering-events', templateUrl: './grid-lite-filtering-events.component.html', styleUrls: ['./grid-lite-filtering-events.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [ CommonModule, IgxGridLiteComponent, diff --git a/src/app/grid-lite/grid-lite-filtering-pipeline/grid-lite-filtering-pipeline.component.ts b/src/app/grid-lite/grid-lite-filtering-pipeline/grid-lite-filtering-pipeline.component.ts index d5e43f0db9..887fc8503e 100644 --- a/src/app/grid-lite/grid-lite-filtering-pipeline/grid-lite-filtering-pipeline.component.ts +++ b/src/app/grid-lite/grid-lite-filtering-pipeline/grid-lite-filtering-pipeline.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, inject } from '@angular/core'; import { CommonModule } from '@angular/common'; import { defineComponents, IgcCheckboxComponent, IgcCircularProgressComponent } from 'igniteui-webcomponents'; import { GridLiteDataService, User } from '../grid-lite-data.service'; @@ -12,7 +12,6 @@ defineComponents(IgcCheckboxComponent, IgcCircularProgressComponent); selector: 'app-grid-lite-filtering-pipeline', templateUrl: './grid-lite-filtering-pipeline.component.html', styleUrls: ['./grid-lite-filtering-pipeline.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [ CommonModule, IgxGridLiteComponent, diff --git a/src/app/grid-lite/grid-lite-filtering-simple/grid-lite-filtering-simple.component.ts b/src/app/grid-lite/grid-lite-filtering-simple/grid-lite-filtering-simple.component.ts index 580a33857b..11c7b5d0ba 100644 --- a/src/app/grid-lite/grid-lite-filtering-simple/grid-lite-filtering-simple.component.ts +++ b/src/app/grid-lite/grid-lite-filtering-simple/grid-lite-filtering-simple.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, inject } from '@angular/core'; import { CommonModule } from '@angular/common'; import { defineComponents, IgcCheckboxComponent } from 'igniteui-webcomponents'; import { GridLiteDataService, User } from '../grid-lite-data.service'; @@ -11,7 +11,6 @@ defineComponents(IgcCheckboxComponent); selector: 'app-grid-lite-filtering-simple', templateUrl: './grid-lite-filtering-simple.component.html', styleUrls: ['./grid-lite-filtering-simple.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [ CommonModule, IgxGridLiteComponent, diff --git a/src/app/grid-lite/grid-lite-overview/grid-lite-overview.component.ts b/src/app/grid-lite/grid-lite-overview/grid-lite-overview.component.ts index 9ec35d42ee..35ab9b0ff1 100644 --- a/src/app/grid-lite/grid-lite-overview/grid-lite-overview.component.ts +++ b/src/app/grid-lite/grid-lite-overview/grid-lite-overview.component.ts @@ -1,4 +1,4 @@ -import { Component, CUSTOM_ELEMENTS_SCHEMA, OnInit, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, CUSTOM_ELEMENTS_SCHEMA, OnInit, inject } from '@angular/core'; import { CommonModule } from '@angular/common'; import { defineComponents, @@ -33,7 +33,6 @@ defineComponents( IgxBadgeComponent, IgxChipComponent ], - changeDetection: ChangeDetectionStrategy.Eager, schemas: [CUSTOM_ELEMENTS_SCHEMA] }) export class GridLiteOverviewComponent implements OnInit { diff --git a/src/app/grid-lite/grid-lite-sorting-events/grid-lite-sorting-events.component.ts b/src/app/grid-lite/grid-lite-sorting-events/grid-lite-sorting-events.component.ts index a6dd22e1e4..b3d2585df9 100644 --- a/src/app/grid-lite/grid-lite-sorting-events/grid-lite-sorting-events.component.ts +++ b/src/app/grid-lite/grid-lite-sorting-events/grid-lite-sorting-events.component.ts @@ -1,4 +1,4 @@ -import { Component, CUSTOM_ELEMENTS_SCHEMA, OnInit, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, CUSTOM_ELEMENTS_SCHEMA, OnInit, inject } from '@angular/core'; import { CommonModule } from '@angular/common'; import { defineComponents, IgcRatingComponent } from 'igniteui-webcomponents'; import { GridLiteDataService, ProductInfo } from '../grid-lite-data.service'; @@ -20,7 +20,6 @@ defineComponents(IgcRatingComponent); IgxGridLiteColumnComponent, IgxGridLiteCellTemplateDirective ], - changeDetection: ChangeDetectionStrategy.Eager, schemas: [CUSTOM_ELEMENTS_SCHEMA] }) export class GridLiteSortingEventsComponent implements OnInit { diff --git a/src/app/grid-lite/grid-lite-sorting-grid-config/grid-lite-sorting-grid-config.component.ts b/src/app/grid-lite/grid-lite-sorting-grid-config/grid-lite-sorting-grid-config.component.ts index db4f89b466..73b2fbf61b 100644 --- a/src/app/grid-lite/grid-lite-sorting-grid-config/grid-lite-sorting-grid-config.component.ts +++ b/src/app/grid-lite/grid-lite-sorting-grid-config/grid-lite-sorting-grid-config.component.ts @@ -1,4 +1,4 @@ -import { Component, CUSTOM_ELEMENTS_SCHEMA, OnInit, inject, ViewChild, ElementRef, ChangeDetectionStrategy } from '@angular/core'; +import { Component, CUSTOM_ELEMENTS_SCHEMA, OnInit, inject, ViewChild, ElementRef } from '@angular/core'; import { CommonModule } from '@angular/common'; import { defineComponents, IgcRatingComponent, IgcSwitchComponent } from 'igniteui-webcomponents'; import { IgcGridLite } from 'igniteui-grid-lite'; @@ -17,7 +17,6 @@ defineComponents(IgcRatingComponent, IgcSwitchComponent); IgxGridLiteColumnComponent, IgxGridLiteCellTemplateDirective ], - changeDetection: ChangeDetectionStrategy.Eager, schemas: [CUSTOM_ELEMENTS_SCHEMA] }) export class GridLiteSortingGridConfigComponent implements OnInit { diff --git a/src/app/grid-lite/grid-lite-sorting-pipeline/grid-lite-sorting-pipeline.component.ts b/src/app/grid-lite/grid-lite-sorting-pipeline/grid-lite-sorting-pipeline.component.ts index 41e74bca9e..f65dbd5fc3 100644 --- a/src/app/grid-lite/grid-lite-sorting-pipeline/grid-lite-sorting-pipeline.component.ts +++ b/src/app/grid-lite/grid-lite-sorting-pipeline/grid-lite-sorting-pipeline.component.ts @@ -1,4 +1,4 @@ -import { Component, CUSTOM_ELEMENTS_SCHEMA, OnInit, ViewChild, ElementRef, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, CUSTOM_ELEMENTS_SCHEMA, OnInit, ViewChild, ElementRef, inject } from '@angular/core'; import { CommonModule } from '@angular/common'; import { defineComponents, IgcRatingComponent } from 'igniteui-webcomponents'; import { GridLiteDataService, ProductInfo } from '../grid-lite-data.service'; @@ -18,7 +18,6 @@ defineComponents(IgcRatingComponent); IgxGridLiteCellTemplateDirective, IgxCircularProgressBarComponent ], - changeDetection: ChangeDetectionStrategy.Eager, schemas: [CUSTOM_ELEMENTS_SCHEMA] }) export class GridLiteSortingPipelineComponent implements OnInit { diff --git a/src/app/grid-lite/grid-lite-sorting-simple/grid-lite-sorting-simple.component.ts b/src/app/grid-lite/grid-lite-sorting-simple/grid-lite-sorting-simple.component.ts index 4c4441c4f1..db74d1a4e4 100644 --- a/src/app/grid-lite/grid-lite-sorting-simple/grid-lite-sorting-simple.component.ts +++ b/src/app/grid-lite/grid-lite-sorting-simple/grid-lite-sorting-simple.component.ts @@ -1,4 +1,4 @@ -import { Component, CUSTOM_ELEMENTS_SCHEMA, OnInit, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, CUSTOM_ELEMENTS_SCHEMA, OnInit, inject } from '@angular/core'; import { CommonModule } from '@angular/common'; import { defineComponents, IgcRatingComponent } from 'igniteui-webcomponents'; import { GridLiteDataService, ProductInfo } from '../grid-lite-data.service'; @@ -16,7 +16,6 @@ defineComponents(IgcRatingComponent); IgxGridLiteColumnComponent, IgxGridLiteCellTemplateDirective ], - changeDetection: ChangeDetectionStrategy.Eager, schemas: [CUSTOM_ELEMENTS_SCHEMA] }) export class GridLiteSortingSimpleComponent implements OnInit { diff --git a/src/app/grid-lite/grid-lite-styling-custom/grid-lite-styling-custom.component.ts b/src/app/grid-lite/grid-lite-styling-custom/grid-lite-styling-custom.component.ts index 40b423f95f..427e2ccf14 100644 --- a/src/app/grid-lite/grid-lite-styling-custom/grid-lite-styling-custom.component.ts +++ b/src/app/grid-lite/grid-lite-styling-custom/grid-lite-styling-custom.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, inject, ViewEncapsulation, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, inject, ViewEncapsulation } from '@angular/core'; import { CommonModule } from '@angular/common'; import { defineComponents, IgcSwitchComponent } from 'igniteui-webcomponents'; import { GridLiteDataService, ProductInfo } from '../grid-lite-data.service'; @@ -12,7 +12,6 @@ defineComponents(IgcSwitchComponent); templateUrl: './grid-lite-styling-custom.component.html', styleUrls: ['./grid-lite-styling-custom.component.scss'], encapsulation: ViewEncapsulation.None, - changeDetection: ChangeDetectionStrategy.Eager, imports: [ CommonModule, IgxGridLiteComponent, diff --git a/src/app/grid-lite/grid-lite-styling-themes/grid-lite-styling-themes.component.ts b/src/app/grid-lite/grid-lite-styling-themes/grid-lite-styling-themes.component.ts index 8541ff8298..191b0e613c 100644 --- a/src/app/grid-lite/grid-lite-styling-themes/grid-lite-styling-themes.component.ts +++ b/src/app/grid-lite/grid-lite-styling-themes/grid-lite-styling-themes.component.ts @@ -1,4 +1,4 @@ -import { Component, CUSTOM_ELEMENTS_SCHEMA, OnInit, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, CUSTOM_ELEMENTS_SCHEMA, OnInit, inject } from '@angular/core'; import { CommonModule } from '@angular/common'; import { defineComponents, IgcRatingComponent, IgcSelectComponent, IgcSelectItemComponent } from 'igniteui-webcomponents'; import { GridLiteDataService, ProductInfo } from '../grid-lite-data.service'; @@ -18,7 +18,6 @@ defineComponents(IgcRatingComponent); IgxSelectComponent, IgxSelectItemComponent ], - changeDetection: ChangeDetectionStrategy.Eager, schemas: [CUSTOM_ELEMENTS_SCHEMA] }) export class GridLiteStylingThemesComponent implements OnInit { diff --git a/src/app/grid/column-group-selection-sample/column-group-selection-sample.component.ts b/src/app/grid/column-group-selection-sample/column-group-selection-sample.component.ts index 7fd65ac9fa..0ee74e32c6 100644 --- a/src/app/grid/column-group-selection-sample/column-group-selection-sample.component.ts +++ b/src/app/grid/column-group-selection-sample/column-group-selection-sample.component.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, ChangeDetectorRef, Component, OnInit, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { AfterViewInit, ChangeDetectorRef, Component, OnInit, ViewChild, inject } from '@angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxColumnComponent, IgxColumnGroupComponent } from 'igniteui-angular/grids/core'; import { DATA } from '../../data/customers'; @@ -7,7 +7,6 @@ import { DATA } from '../../data/customers'; selector: 'app-gird-column-group-selection', templateUrl: './column-group-selection-sample.component.html', styleUrls: ['./column-group-selection-sample.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxColumnGroupComponent, IgxColumnComponent] }) export class GridColumnGroupSelectionComponent implements OnInit, AfterViewInit { diff --git a/src/app/grid/column-selection-sample/column-selection-sample.component.ts b/src/app/grid/column-selection-sample/column-selection-sample.component.ts index 486e237ccc..0a5d9f3742 100644 --- a/src/app/grid/column-selection-sample/column-selection-sample.component.ts +++ b/src/app/grid/column-selection-sample/column-selection-sample.component.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, ChangeDetectorRef, Component, OnInit, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { AfterViewInit, ChangeDetectorRef, Component, OnInit, ViewChild, inject } from '@angular/core'; import { GridSelectionMode, IgxColumnComponent, IgxGridToolbarComponent } from 'igniteui-angular/grids/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxSelectComponent, IgxSelectItemComponent } from 'igniteui-angular/select'; @@ -10,7 +10,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-grid-column-selection', templateUrl: './column-selection-sample.component.html', styleUrls: ['./column-selection-sample.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxGridToolbarComponent, IgxSelectComponent, FormsModule, IgxLabelDirective, IgxSelectItemComponent, IgxColumnComponent] }) export class GridColumnSelectionComponent implements OnInit, AfterViewInit { diff --git a/src/app/grid/column-selection-styles/column-selection-styles.component.ts b/src/app/grid/column-selection-styles/column-selection-styles.component.ts index bc09f761c2..42275d8c09 100644 --- a/src/app/grid/column-selection-styles/column-selection-styles.component.ts +++ b/src/app/grid/column-selection-styles/column-selection-styles.component.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, ChangeDetectorRef, Component, OnInit, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { AfterViewInit, ChangeDetectorRef, Component, OnInit, ViewChild, inject } from '@angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxColumnComponent } from 'igniteui-angular/grids/core'; import { DATA } from '../../data/customers'; @@ -7,7 +7,6 @@ import { DATA } from '../../data/customers'; selector: 'app-gird-column-selection-styles', templateUrl: './column-selection-styles.component.html', styleUrls: ['./column-selection-styles.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxColumnComponent] }) export class GridColumnSelectionStylesComponent implements OnInit, AfterViewInit { diff --git a/src/app/grid/custom-grid-paging-style/custom-grid-paging-style.component.ts b/src/app/grid/custom-grid-paging-style/custom-grid-paging-style.component.ts index 55cb75c345..146c54c3bd 100644 --- a/src/app/grid/custom-grid-paging-style/custom-grid-paging-style.component.ts +++ b/src/app/grid/custom-grid-paging-style/custom-grid-paging-style.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild, OnInit } from '@angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxPaginatorComponent } from 'igniteui-angular/paginator'; import { IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -12,7 +12,6 @@ import { DecimalPipe } from '@angular/common'; selector: 'app-custom-grid-paging-style-sample', styleUrls: ['custom-grid-paging-style.component.scss'], templateUrl: 'custom-grid-paging-style.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxPaginatorComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxIconButtonDirective, IgxIconComponent, DecimalPipe] }) diff --git a/src/app/grid/grid-action-strip/grid-action-strip-sample.ts b/src/app/grid/grid-action-strip/grid-action-strip-sample.ts index faacb71c40..2d907fd158 100644 --- a/src/app/grid/grid-action-strip/grid-action-strip-sample.ts +++ b/src/app/grid/grid-action-strip/grid-action-strip-sample.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxColumnComponent, IgxGridPinningActionsComponent, RowType } from 'igniteui-angular/grids/core'; import { Transaction } from 'igniteui-angular/core'; @@ -13,7 +13,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-row-action-strip', styleUrls: [`grid-action-strip-sample.scss`], templateUrl: 'grid-action-strip-sample.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxActionStripComponent, IgxGridPinningActionsComponent, IgxIconButtonDirective, IgxRippleDirective, IgxIconComponent] }) export class GridActionStripSampleComponent { diff --git a/src/app/grid/grid-add-row-sample/grid-add-row-sample.component.ts b/src/app/grid/grid-add-row-sample/grid-add-row-sample.component.ts index c1c3e125d3..0c5464b7b1 100644 --- a/src/app/grid/grid-add-row-sample/grid-add-row-sample.component.ts +++ b/src/app/grid/grid-add-row-sample/grid-add-row-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { DATA } from '../../data/nwindData'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxCellEditorTemplateDirective, IgxColumnComponent, IgxGridEditingActionsComponent } from 'igniteui-angular/grids/core'; @@ -11,7 +11,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-grid-add-row', styleUrls: [`grid-add-row-sample.component.scss`], templateUrl: 'grid-add-row-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxColumnComponent, IgxCellEditorTemplateDirective, IgxInputGroupComponent, FormsModule, IgxInputDirective, IgxFocusDirective, IgxActionStripComponent, IgxGridEditingActionsComponent] }) export class GridAddRowSampleComponent { diff --git a/src/app/grid/grid-advanced-filtering-sample/grid-advanced-filtering-sample.component.ts b/src/app/grid/grid-advanced-filtering-sample/grid-advanced-filtering-sample.component.ts index 27f0e80043..c231d962a1 100644 --- a/src/app/grid/grid-advanced-filtering-sample/grid-advanced-filtering-sample.component.ts +++ b/src/app/grid/grid-advanced-filtering-sample/grid-advanced-filtering-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxCellTemplateDirective, IgxColumnComponent, IgxGridToolbarComponent } from 'igniteui-angular/grids/core'; import { DATA } from '../../data/nwindData'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-advanced-filtering-sample', styleUrls: ['./grid-advanced-filtering-sample.component.scss'], templateUrl: 'grid-advanced-filtering-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxColumnComponent, IgxCellTemplateDirective] }) export class GridAdvancedFilteringSampleComponent implements OnInit { diff --git a/src/app/grid/grid-advanced-filtering-style/grid-advanced-filtering-style.component.ts b/src/app/grid/grid-advanced-filtering-style/grid-advanced-filtering-style.component.ts index a95d482eed..9c1c045e63 100644 --- a/src/app/grid/grid-advanced-filtering-style/grid-advanced-filtering-style.component.ts +++ b/src/app/grid/grid-advanced-filtering-style/grid-advanced-filtering-style.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxCellTemplateDirective, IgxColumnComponent, IgxGridToolbarComponent } from 'igniteui-angular/grids/core'; import { DATA } from '../../data/nwindData'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-adf-style-sample', styleUrls: ['./grid-advanced-filtering-style.component.scss'], templateUrl: 'grid-advanced-filtering-style.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxColumnComponent, IgxCellTemplateDirective] }) export class GridAdvancedFilteringStyleComponent implements OnInit { diff --git a/src/app/grid/grid-allData-summary/grid-allData-summary.component.ts b/src/app/grid/grid-allData-summary/grid-allData-summary.component.ts index 6aff18516d..f9179e51c5 100644 --- a/src/app/grid/grid-allData-summary/grid-allData-summary.component.ts +++ b/src/app/grid/grid-allData-summary/grid-allData-summary.component.ts @@ -1,7 +1,7 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; -import { IgxColumnComponent, IgxNumberSummaryOperand } from 'igniteui-angular/grids/core'; -import { IgxSummaryResult } from 'igniteui-angular/core'; +import { IgxColumnComponent } from 'igniteui-angular/grids/core'; +import { IgxNumberSummaryOperand, IgxSummaryResult } from 'igniteui-angular/core'; import { IgxPaginatorComponent } from 'igniteui-angular/paginator'; import { DATA } from '../../data/nwindData'; import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scroll.directive'; @@ -37,7 +37,6 @@ class DiscontinuedSummary { selector: 'app-grid-all-data-summary', styleUrls: ['./grid-allData-summary.component.scss'], templateUrl: './grid-allData-summary.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxPaginatorComponent, IgxColumnComponent] }) export class GridAllDataSummaryComponent { diff --git a/src/app/grid/grid-batch-editing/grid-batch-editing-sample.component.ts b/src/app/grid/grid-batch-editing/grid-batch-editing-sample.component.ts index 125377bc99..ea0aa1f83b 100644 --- a/src/app/grid/grid-batch-editing/grid-batch-editing-sample.component.ts +++ b/src/app/grid/grid-batch-editing/grid-batch-editing-sample.component.ts @@ -1,5 +1,5 @@ /* eslint-disable @typescript-eslint/naming-convention */ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxDialogComponent } from 'igniteui-angular/dialog'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { Transaction } from 'igniteui-angular/core'; @@ -14,7 +14,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-row-edit', styleUrls: [`grid-batch-editing-sample.component.scss`], templateUrl: 'grid-batch-editing-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxButtonDirective, IgxDialogComponent] }) export class GridBatchEditingSampleComponent implements OnInit { diff --git a/src/app/grid/grid-batchEditing-remotePaging/batch-editing-remote-paging.component.ts b/src/app/grid/grid-batchEditing-remotePaging/batch-editing-remote-paging.component.ts index 3c4da99b53..1974cd23a4 100644 --- a/src/app/grid/grid-batchEditing-remotePaging/batch-editing-remote-paging.component.ts +++ b/src/app/grid/grid-batchEditing-remotePaging/batch-editing-remote-paging.component.ts @@ -1,5 +1,5 @@ /* eslint-disable @typescript-eslint/naming-convention */ -import { AfterViewInit, Component, OnDestroy, OnInit, ViewChild, ViewEncapsulation, inject, ChangeDetectionStrategy } from '@angular/core'; +import { AfterViewInit, Component, OnDestroy, OnInit, ViewChild, ViewEncapsulation, inject } from '@angular/core'; import { IgxDialogComponent } from 'igniteui-angular/dialog'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { Transaction } from 'igniteui-angular/core'; @@ -17,7 +17,6 @@ import { AsyncPipe } from '@angular/common'; selector: 'app-remote-paging-batch-editing', styleUrls: ['./batch-editing-remote-paging.component.scss'], templateUrl: './batch-editing-remote-paging.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxPaginatorComponent, IgxPaginatorContentDirective, IgxGridToolbarComponent, IgxGridToolbarActionsComponent, IgxButtonDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxDialogComponent, AsyncPipe] }) export class RemotePagingBatchEditingComponent implements OnInit, AfterViewInit, OnDestroy { diff --git a/src/app/grid/grid-cascading-combos/grid-cascading-combos.component.html b/src/app/grid/grid-cascading-combos/grid-cascading-combos.component.html index ea6e1493ae..39086f398b 100644 --- a/src/app/grid/grid-cascading-combos/grid-cascading-combos.component.html +++ b/src/app/grid/grid-cascading-combos/grid-cascading-combos.component.html @@ -15,34 +15,32 @@ -
+ @if (cell.row.data.loadingRegion) { } -
-
+ @if (cell.row.data.loadingCity) { } -
diff --git a/src/app/grid/grid-cascading-combos/grid-cascading-combos.component.scss b/src/app/grid/grid-cascading-combos/grid-cascading-combos.component.scss index 7c98762800..bf663072e6 100644 --- a/src/app/grid/grid-cascading-combos/grid-cascading-combos.component.scss +++ b/src/app/grid/grid-cascading-combos/grid-cascading-combos.component.scss @@ -41,6 +41,12 @@ overflow-x: none; } } + + igx-linear-bar { + position: absolute; + inset-inline: 0; + inset-block-end: 0; + } } } diff --git a/src/app/grid/grid-cascading-combos/grid-cascading-combos.component.ts b/src/app/grid/grid-cascading-combos/grid-cascading-combos.component.ts index f52e1b12f6..f1989af5b6 100644 --- a/src/app/grid/grid-cascading-combos/grid-cascading-combos.component.ts +++ b/src/app/grid/grid-cascading-combos/grid-cascading-combos.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, QueryList, ViewChildren, ChangeDetectionStrategy } from '@angular/core'; +import { ChangeDetectorRef, Component, inject, OnInit, QueryList, ViewChildren } from '@angular/core'; import { ISimpleComboSelectionChangingEventArgs, IgxSimpleComboComponent } from 'igniteui-angular/simple-combo'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -13,10 +13,11 @@ import { FormsModule } from '@angular/forms'; selector: 'grid-cascading-combos', templateUrl: './grid-cascading-combos.component.html', styleUrls: ['./grid-cascading-combos.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxSimpleComboComponent, FormsModule, IgxLinearProgressBarComponent] }) export class GridCascadingCombosComponent implements OnInit { + private cdr = inject(ChangeDetectorRef); + @ViewChildren(IgxSimpleComboComponent) public combos: QueryList; @@ -56,6 +57,7 @@ export class GridCascadingCombosComponent implements OnInit { .map((c) => ({ name: c.region, country: c.country })) .filter((v, i, a) => a.findIndex((r) => r.name === v.name) === i); cell.row.data.loadingRegion = false; + this.cdr.markForCheck(); }, this.loadingTime); this.selectedRegionName = null; this.selectedCityId = null; @@ -80,6 +82,7 @@ export class GridCascadingCombosComponent implements OnInit { (c) => c.region === this.selectedRegionName ); cell.row.data.loadingCity = false; + this.cdr.markForCheck(); }, this.loadingTime); this.selectedCityId = null; this.loadingTime = 0; diff --git a/src/app/grid/grid-cell-merge-custom-sample/grid-cell-merge-custom-sample.component.ts b/src/app/grid/grid-cell-merge-custom-sample/grid-cell-merge-custom-sample.component.ts index 15191291cb..57430872d7 100644 --- a/src/app/grid/grid-cell-merge-custom-sample/grid-cell-merge-custom-sample.component.ts +++ b/src/app/grid/grid-cell-merge-custom-sample/grid-cell-merge-custom-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ViewEncapsulation, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild, ViewEncapsulation } from '@angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { GridCellMergeMode, IgxColumnComponent } from 'igniteui-angular/grids/core'; import { DefaultMergeStrategy } from 'igniteui-angular/core'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-cell-merge-custom-sample', styleUrls: ['./grid-cell-merge-custom-sample.component.scss'], templateUrl: './grid-cell-merge-custom-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [ IgxGridComponent, IgxPreventDocumentScrollDirective, diff --git a/src/app/grid/grid-cell-merge-sample/grid-cell-merge-sample.component.ts b/src/app/grid/grid-cell-merge-sample/grid-cell-merge-sample.component.ts index a398178409..fbe6ef9b2a 100644 --- a/src/app/grid/grid-cell-merge-sample/grid-cell-merge-sample.component.ts +++ b/src/app/grid/grid-cell-merge-sample/grid-cell-merge-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ViewEncapsulation, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild, ViewEncapsulation } from '@angular/core'; import { GridCellMergeMode, GridSelectionMode, IgxCellTemplateDirective, IgxColumnComponent, IgxGridToolbarComponent } from 'igniteui-angular/grids/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxSelectComponent, IgxSelectItemComponent } from 'igniteui-angular/select'; @@ -13,7 +13,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-grid-groupby-sample', styleUrls: ['./grid-cell-merge-sample.component.scss'], templateUrl: './grid-cell-merge-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [ IgxGridComponent, IgxPreventDocumentScrollDirective, diff --git a/src/app/grid/grid-cellSelection-sample/grid-cellSelection.component.ts b/src/app/grid/grid-cellSelection-sample/grid-cellSelection.component.ts index d114054b0e..114a441c15 100644 --- a/src/app/grid/grid-cellSelection-sample/grid-cellSelection.component.ts +++ b/src/app/grid/grid-cellSelection-sample/grid-cellSelection.component.ts @@ -1,4 +1,4 @@ -import { Component, ElementRef, OnInit, Renderer2, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ElementRef, OnInit, Renderer2, ViewChild, inject } from '@angular/core'; import { GridSelectionMode, IgxColumnComponent } from 'igniteui-angular/grids/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxSnackbarComponent } from 'igniteui-angular/snackbar'; @@ -13,7 +13,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-cell-selection', styleUrls: ['./grid-cellSelection.component.scss'], templateUrl: 'grid-cellSelection.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonGroupComponent, IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxButtonDirective, IgxIconComponent, IgxSnackbarComponent] }) export class GridCellSelectionComponent implements OnInit { diff --git a/src/app/grid/grid-clipboard-operations-sample/grid-clipboard-operations-sample.component.ts b/src/app/grid/grid-clipboard-operations-sample/grid-clipboard-operations-sample.component.ts index 7b10978dd3..a0ce4801ee 100644 --- a/src/app/grid/grid-clipboard-operations-sample/grid-clipboard-operations-sample.component.ts +++ b/src/app/grid/grid-clipboard-operations-sample/grid-clipboard-operations-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { DATA } from '../../data/nwindData'; import { IgxHintDirective, IgxInputDirective, IgxInputGroupComponent, IgxLabelDirective, IgxSuffixDirective } from 'igniteui-angular/input-group'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -13,7 +13,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-clipboard-operations-sample', styleUrls: ['grid-clipboard-operations-sample.component.scss'], templateUrl: './grid-clipboard-operations-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxInputGroupComponent, IgxLabelDirective, FormsModule, IgxInputDirective, IgxSuffixDirective, IgxIconComponent, IgxHintDirective, IgxGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxSwitchComponent, IgxButtonDirective] }) export class GridClipboardSampleComponent { diff --git a/src/app/grid/grid-collapsible-columnGroups/grid-collapsible-column-groups.component.ts b/src/app/grid/grid-collapsible-columnGroups/grid-collapsible-column-groups.component.ts index cf008782eb..2e029298ab 100644 --- a/src/app/grid/grid-collapsible-columnGroups/grid-collapsible-column-groups.component.ts +++ b/src/app/grid/grid-collapsible-columnGroups/grid-collapsible-column-groups.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxCellTemplateDirective, IgxCollapsibleIndicatorTemplateDirective, IgxColumnComponent, IgxColumnGroupComponent } from 'igniteui-angular/grids/core'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -11,7 +11,6 @@ import { DatePipe } from '@angular/common'; selector: 'app-grid-collapsible-column-groups', styleUrls: ['./grid-collapsible-column-groups.component.scss'], templateUrl: './grid-collapsible-column-groups.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnGroupComponent, IgxCollapsibleIndicatorTemplateDirective, IgxIconComponent, IgxTooltipTargetDirective, IgxTooltipDirective, IgxColumnComponent, IgxCellTemplateDirective, DatePipe] }) export class GridCollapsibleColumnGroupsComponent implements OnInit { diff --git a/src/app/grid/grid-column-autosizing/grid-column-autosizing.component.ts b/src/app/grid/grid-column-autosizing/grid-column-autosizing.component.ts index 84e2cab537..31f3c456c4 100644 --- a/src/app/grid/grid-column-autosizing/grid-column-autosizing.component.ts +++ b/src/app/grid/grid-column-autosizing/grid-column-autosizing.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { DATA } from '../../data/customers'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -8,7 +8,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'grid-column-autosizing-sample', styleUrls: ['./grid-column-autosizing.component.scss'], templateUrl: 'grid-column-autosizing.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent] }) diff --git a/src/app/grid/grid-column-data-types-sample/grid-column-data-types-sample.component.ts b/src/app/grid/grid-column-data-types-sample/grid-column-data-types-sample.component.ts index 655417e4da..208bd940f1 100644 --- a/src/app/grid/grid-column-data-types-sample/grid-column-data-types-sample.component.ts +++ b/src/app/grid/grid-column-data-types-sample/grid-column-data-types-sample.component.ts @@ -1,5 +1,5 @@ /*eslint-disable*/ -import { Component, OnInit, ChangeDetectionStrategy } from "@angular/core"; +import { Component, OnInit } from "@angular/core"; import { registerLocaleData, NgClass } from "@angular/common"; import localeBG from '@angular/common/locales/bg'; import localeDE from '@angular/common/locales/de'; @@ -10,7 +10,8 @@ import { IgxHintDirective, IgxInputDirective, IgxInputGroupComponent, IgxPrefixD import { IgxIconComponent } from 'igniteui-angular/icon'; import { IgxTooltipDirective, IgxTooltipTargetDirective } from 'igniteui-angular/directives'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; -import { IgxColumnComponent, IgxTimeSummaryOperand } from 'igniteui-angular/grids/core'; +import { IgxColumnComponent } from 'igniteui-angular/grids/core'; +import { IgxTimeSummaryOperand } from 'igniteui-angular/core'; import { FormsModule } from "@angular/forms"; import { IgxPreventDocumentScrollDirective } from "../../directives/prevent-scroll.directive"; @@ -18,7 +19,6 @@ import { IgxPreventDocumentScrollDirective } from "../../directives/prevent-scro selector: "grid-column-data-types-sample", styleUrls: ["./grid-column-data-types-sample.component.scss"], templateUrl: "grid-column-data-types-sample.component.html", - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSelectComponent, FormsModule, IgxPrefixDirective, IgxSelectItemComponent, IgxHintDirective, IgxSuffixDirective, IgxIconComponent, IgxInputGroupComponent, IgxTooltipTargetDirective, IgxTooltipDirective, IgxInputDirective, NgClass, IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent] }) export class GridColumnDataTypesSampleComponent implements OnInit { diff --git a/src/app/grid/grid-column-hiding-sample/grid-column-hiding-sample.component.ts b/src/app/grid/grid-column-hiding-sample/grid-column-hiding-sample.component.ts index 3698558269..03ed9b2924 100644 --- a/src/app/grid/grid-column-hiding-sample/grid-column-hiding-sample.component.ts +++ b/src/app/grid/grid-column-hiding-sample/grid-column-hiding-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit } from '@angular/core'; import { DATA } from '../../data/customers'; import { IgxColumnActionsComponent, IgxColumnComponent, IgxColumnHidingDirective } from 'igniteui-angular/grids/core'; import { IgxRadioComponent } from 'igniteui-angular/radio'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-column-hiding-sample', styleUrls: ['./grid-column-hiding-sample.component.scss'], templateUrl: './grid-column-hiding-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxColumnActionsComponent, IgxColumnHidingDirective, IgxRadioComponent, IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent] }) export class GridColumnHidingSampleComponent implements OnInit { diff --git a/src/app/grid/grid-column-hiding-toolbar-sample/grid-column-hiding-toolbar-sample.component.ts b/src/app/grid/grid-column-hiding-toolbar-sample/grid-column-hiding-toolbar-sample.component.ts index 3092ef5e0f..dbf5fa42bd 100644 --- a/src/app/grid/grid-column-hiding-toolbar-sample/grid-column-hiding-toolbar-sample.component.ts +++ b/src/app/grid/grid-column-hiding-toolbar-sample/grid-column-hiding-toolbar-sample.component.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { AfterViewInit, Component, OnInit } from '@angular/core'; import { DATA } from '../../data/customers'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxColumnComponent, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarHidingComponent, IgxGridToolbarTitleComponent } from 'igniteui-angular/grids/core'; @@ -8,7 +8,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-column-hiding-toolbar-sample', styleUrls: ['./grid-column-hiding-toolbar-sample.component.scss'], templateUrl: './grid-column-hiding-toolbar-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxGridToolbarTitleComponent, IgxGridToolbarActionsComponent, IgxGridToolbarHidingComponent, IgxColumnComponent] }) export class GridColumnHidingToolbarSampleComponent implements OnInit { diff --git a/src/app/grid/grid-column-hiding-toolbar-style/grid-column-hiding-toolbar-style.component.ts b/src/app/grid/grid-column-hiding-toolbar-style/grid-column-hiding-toolbar-style.component.ts index 52600901c4..fdc256034a 100644 --- a/src/app/grid/grid-column-hiding-toolbar-style/grid-column-hiding-toolbar-style.component.ts +++ b/src/app/grid/grid-column-hiding-toolbar-style/grid-column-hiding-toolbar-style.component.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { AfterViewInit, Component, OnInit } from '@angular/core'; import { DATA } from '../../data/customers'; import { IgxColumnActionsComponent, IgxColumnComponent, IgxColumnHidingDirective } from 'igniteui-angular/grids/core'; import { IgxRadioComponent } from 'igniteui-angular/radio'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-column-hiding-toolbar-style', styleUrls: ['./grid-column-hiding-toolbar-style.component.scss'], templateUrl: './grid-column-hiding-toolbar-style.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxColumnActionsComponent, IgxColumnHidingDirective, IgxRadioComponent, IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent] }) export class GridColumnHidingToolbarStyleComponent implements OnInit { diff --git a/src/app/grid/grid-composite-data-binding/grid-composite-data.component.ts b/src/app/grid/grid-composite-data-binding/grid-composite-data.component.ts index 8f0b262dfc..e2c48d7891 100644 --- a/src/app/grid/grid-composite-data-binding/grid-composite-data.component.ts +++ b/src/app/grid/grid-composite-data-binding/grid-composite-data.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit } from '@angular/core'; import { DATA } from '../../data/customers'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxCellEditorTemplateDirective, IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -10,7 +10,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-grid-composite-data', styleUrls: ['./grid-composite-data.component.scss'], templateUrl: './grid-composite-data.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxCellEditorTemplateDirective, IgxInputGroupComponent, FormsModule, IgxInputDirective] }) export class GridCompositeDataComponent implements OnInit { diff --git a/src/app/grid/grid-conditional-cell-style-2/grid-conditional-cell-style-2.component.ts b/src/app/grid/grid-conditional-cell-style-2/grid-conditional-cell-style-2.component.ts index f226e9d31e..9c40fac6cc 100644 --- a/src/app/grid/grid-conditional-cell-style-2/grid-conditional-cell-style-2.component.ts +++ b/src/app/grid/grid-conditional-cell-style-2/grid-conditional-cell-style-2.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxHintDirective, IgxInputDirective, IgxInputGroupComponent } from 'igniteui-angular/input-group'; import { IgxButtonDirective } from 'igniteui-angular/directives'; @@ -10,7 +10,6 @@ import { JsonPipe } from '@angular/common'; selector: 'app-grid-conditional-cell-style-2', styleUrls: ['./grid-conditional-cell-style-2.component.scss'], templateUrl: './grid-conditional-cell-style-2.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxInputGroupComponent, IgxInputDirective, IgxHintDirective, IgxButtonDirective, IgxGridComponent, IgxColumnComponent, JsonPipe] }) export class GridConditionalCellStyle2Component implements OnInit { diff --git a/src/app/grid/grid-conditional-cell-style/grid-conditional-cell-style.component.ts b/src/app/grid/grid-conditional-cell-style/grid-conditional-cell-style.component.ts index ee5b27e8ba..01b1d7f58d 100644 --- a/src/app/grid/grid-conditional-cell-style/grid-conditional-cell-style.component.ts +++ b/src/app/grid/grid-conditional-cell-style/grid-conditional-cell-style.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit } from '@angular/core'; import { athletesData } from '../../data/athletesData'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -9,7 +9,6 @@ import { DecimalPipe, PercentPipe } from '@angular/common'; selector: 'app-grid-conditional-cell-style', styleUrls: ['./grid-conditional-cell-style.component.scss'], templateUrl: './grid-conditional-cell-style.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, DecimalPipe, PercentPipe] }) export class GridConditionalCellStyleComponent implements OnInit { diff --git a/src/app/grid/grid-conditional-row-selectors/grid-conditional-row-selectors-sample.component.ts b/src/app/grid/grid-conditional-row-selectors/grid-conditional-row-selectors-sample.component.ts index 5291b3d0b7..c592c5414a 100644 --- a/src/app/grid/grid-conditional-row-selectors/grid-conditional-row-selectors-sample.component.ts +++ b/src/app/grid/grid-conditional-row-selectors/grid-conditional-row-selectors-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IRowSelectionEventArgs, IgxColumnComponent, IgxRowSelectorDirective } from 'igniteui-angular/grids/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxPaginatorComponent } from 'igniteui-angular/paginator'; @@ -10,7 +10,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-conditional-row-selectors', styleUrls: ['./grid-conditional-row-selectors-sample.component.scss'], templateUrl: 'grid-conditional-row-selectors-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxPaginatorComponent, IgxColumnComponent, IgxRowSelectorDirective, IgxCheckboxComponent] }) diff --git a/src/app/grid/grid-contextmenu-sample/contextmenu/contextmenu.component.ts b/src/app/grid/grid-contextmenu-sample/contextmenu/contextmenu.component.ts index 36ee82e408..633e88b0e7 100644 --- a/src/app/grid/grid-contextmenu-sample/contextmenu/contextmenu.component.ts +++ b/src/app/grid/grid-contextmenu-sample/contextmenu/contextmenu.component.ts @@ -1,4 +1,4 @@ -import { Component, EventEmitter, Input, Output, DOCUMENT, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, EventEmitter, Input, Output, DOCUMENT, inject } from '@angular/core'; import { IgxIconComponent } from 'igniteui-angular/icon'; import { NgStyle } from '@angular/common'; @@ -9,7 +9,6 @@ interface ICopyData { selector: 'app-contextmenu', styleUrls: ['./contextmenu.component.scss'], templateUrl: './contextmenu.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [NgStyle, IgxIconComponent] }) export class ContextmenuComponent { diff --git a/src/app/grid/grid-contextmenu-sample/grid-contextmenu-sample.component.ts b/src/app/grid/grid-contextmenu-sample/grid-contextmenu-sample.component.ts index ad41e08022..4598a62b3d 100644 --- a/src/app/grid/grid-contextmenu-sample/grid-contextmenu-sample.component.ts +++ b/src/app/grid/grid-contextmenu-sample/grid-contextmenu-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { DefaultSortingStrategy, SortingDirection } from 'igniteui-angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -11,7 +11,6 @@ import { ContextmenuComponent } from './contextmenu/contextmenu.component'; selector: 'app-grid-contextmenu-sample', styleUrls: ['./grid-contextmenu-sample.component.scss'], templateUrl: './grid-contextmenu-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, ContextmenuComponent] }) diff --git a/src/app/grid/grid-crud-sample/crud-sample.component.ts b/src/app/grid/grid-crud-sample/crud-sample.component.ts index 89adb71873..2bee5d889e 100644 --- a/src/app/grid/grid-crud-sample/crud-sample.component.ts +++ b/src/app/grid/grid-crud-sample/crud-sample.component.ts @@ -1,4 +1,4 @@ -import { ChangeDetectorRef, Component, OnInit, ViewChild, OnDestroy, inject, ChangeDetectionStrategy } from '@angular/core'; +import { ChangeDetectorRef, Component, OnInit, ViewChild, OnDestroy, inject } from '@angular/core'; import { GridPagingMode, IGridEditDoneEventArgs, IRowDataEventArgs, IgxColumnComponent, IgxGridEditingActionsComponent, IgxGridRow } from 'igniteui-angular/grids/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxSnackbarComponent } from 'igniteui-angular/snackbar'; @@ -15,7 +15,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-crud-sample', styleUrls: ['./crud-sample.component.scss'], templateUrl: './crud-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxPaginatorComponent, IgxColumnComponent, IgxActionStripComponent, IgxGridEditingActionsComponent, IgxSnackbarComponent] }) export class CRUDSampleComponent implements OnInit, OnDestroy { diff --git a/src/app/grid/grid-custom-filtering/grid-custom-filtering.component.ts b/src/app/grid/grid-custom-filtering/grid-custom-filtering.component.ts index 95f52639fd..e54d180cc1 100644 --- a/src/app/grid/grid-custom-filtering/grid-custom-filtering.component.ts +++ b/src/app/grid/grid-custom-filtering/grid-custom-filtering.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit } from '@angular/core'; import { IFilteringOperation, IgxBooleanFilteringOperand, IgxStringFilteringOperand } from 'igniteui-angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -10,7 +10,6 @@ import { CurrencyPipe } from '@angular/common'; selector: 'app-grid-custom-filtering', styleUrls: ['./grid-custom-filtering.component.scss'], templateUrl: './grid-custom-filtering.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, CurrencyPipe] }) export class GridCustomFilteringComponent implements OnInit { diff --git a/src/app/grid/grid-custom-kb-navigation/grid-custom-kb-navigation-sample.component.ts b/src/app/grid/grid-custom-kb-navigation/grid-custom-kb-navigation-sample.component.ts index c79a831dd5..728efea2ec 100644 --- a/src/app/grid/grid-custom-kb-navigation/grid-custom-kb-navigation-sample.component.ts +++ b/src/app/grid/grid-custom-kb-navigation/grid-custom-kb-navigation-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { CellType, GridSelectionMode, IGridKeydownEventArgs, IgxColumnComponent } from 'igniteui-angular/grids/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxPaginatorComponent } from 'igniteui-angular/paginator'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-custom-kb-navigation-sample', styleUrls: ['./grid-custom-kb-navigation-sample.component.scss'], templateUrl: 'grid-custom-kb-navigation-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxPaginatorComponent, IgxColumnComponent] }) diff --git a/src/app/grid/grid-custom-remote-paging-sample/custom-remote-paging-sample.component.ts b/src/app/grid/grid-custom-remote-paging-sample/custom-remote-paging-sample.component.ts index 7f7156a5d3..8dda9fc3a8 100644 --- a/src/app/grid/grid-custom-remote-paging-sample/custom-remote-paging-sample.component.ts +++ b/src/app/grid/grid-custom-remote-paging-sample/custom-remote-paging-sample.component.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, Component, OnDestroy, OnInit, TemplateRef, ViewChild, ViewEncapsulation, inject, ChangeDetectionStrategy } from '@angular/core'; +import { AfterViewInit, Component, OnDestroy, OnInit, TemplateRef, ViewChild, ViewEncapsulation, inject } from '@angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxColumnComponent } from 'igniteui-angular/grids/core'; import { IgxPaginatorComponent, IgxPaginatorContentDirective } from 'igniteui-angular/paginator'; @@ -14,7 +14,6 @@ import { RouterLink } from '@angular/router'; selector: 'app-custom-remote-paging-grid-sample', styleUrls: ['./custom-remote-paging-sample.component.scss'], templateUrl: './custom-remote-paging-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxPaginatorComponent, IgxPaginatorContentDirective, IgxButtonDirective, RouterLink, AsyncPipe] }) export class CustomRemotePagingGridSampleComponent implements OnInit, AfterViewInit, OnDestroy { diff --git a/src/app/grid/grid-custom-summaries-selection/grid-custom-summaries-selection.component.ts b/src/app/grid/grid-custom-summaries-selection/grid-custom-summaries-selection.component.ts index 68dd5a050a..d44b043a08 100644 --- a/src/app/grid/grid-custom-summaries-selection/grid-custom-summaries-selection.component.ts +++ b/src/app/grid/grid-custom-summaries-selection/grid-custom-summaries-selection.component.ts @@ -1,8 +1,8 @@ import { formatDate } from '@angular/common'; -import { AfterViewInit, Component, ViewChild, OnInit, ChangeDetectorRef, inject, ChangeDetectionStrategy } from '@angular/core'; -import { IgxCellTemplateDirective, IgxColumnComponent, IgxDateSummaryOperand, IgxGridFooterComponent, IgxNumberSummaryOperand, IgxSummaryOperand } from 'igniteui-angular/grids/core'; +import { AfterViewInit, Component, ViewChild, OnInit, ChangeDetectorRef, inject } from '@angular/core'; +import { IgxCellTemplateDirective, IgxColumnComponent, IgxGridFooterComponent } from 'igniteui-angular/grids/core'; +import { IgxDateSummaryOperand, IgxNumberSummaryOperand, IgxSummaryOperand, IgxSummaryResult } from 'igniteui-angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; -import { IgxSummaryResult } from 'igniteui-angular/core'; import { DATA } from '../../data/nwindData'; import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scroll.directive'; @@ -36,7 +36,6 @@ class MySummary { selector: 'app-grid-sample', styleUrls: ['./grid-custom-summaries-selection.component.scss'], templateUrl: 'grid-custom-summaries-selection.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxGridFooterComponent] }) diff --git a/src/app/grid/grid-disable-summaries/grid-disable-summaries.component.ts b/src/app/grid/grid-disable-summaries/grid-disable-summaries.component.ts index 4f9bf07b09..36de8bedd2 100644 --- a/src/app/grid/grid-disable-summaries/grid-disable-summaries.component.ts +++ b/src/app/grid/grid-disable-summaries/grid-disable-summaries.component.ts @@ -9,8 +9,8 @@ import { ChangeDetectionStrategy } from "@angular/core"; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; -import { IgxColumnComponent, IgxNumberSummaryOperand } from 'igniteui-angular/grids/core'; -import { ConnectedPositioningStrategy, HorizontalAlignment, IgxSummaryResult, OverlaySettings, VerticalAlignment } from 'igniteui-angular/core'; +import { IgxColumnComponent } from 'igniteui-angular/grids/core'; +import { ConnectedPositioningStrategy, HorizontalAlignment, IgxNumberSummaryOperand, IgxSummaryResult, OverlaySettings, VerticalAlignment } from 'igniteui-angular/core'; import { IgxButtonDirective, IgxToggleDirective } from 'igniteui-angular/directives'; import { IgxCheckboxComponent } from 'igniteui-angular/checkbox'; import { DATA } from "../../data/nwindData"; @@ -148,7 +148,6 @@ class DiscontinuedSummary { selector: "app-grid-summary-sample", styleUrls: ["./grid-disable-summaries.component.scss"], templateUrl: "grid-disable-summaries.component.html", - changeDetection: ChangeDetectionStrategy.Eager, imports: [ IgxGridComponent, IgxPreventDocumentScrollDirective, diff --git a/src/app/grid/grid-displaydensity-sample/grid-displaydensity-sample.component.ts b/src/app/grid/grid-displaydensity-sample/grid-displaydensity-sample.component.ts index 7c39b84724..cddfe48429 100644 --- a/src/app/grid/grid-displaydensity-sample/grid-displaydensity-sample.component.ts +++ b/src/app/grid/grid-displaydensity-sample/grid-displaydensity-sample.component.ts @@ -1,8 +1,8 @@ -import { Component, HostBinding, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, HostBinding, OnInit, ViewChild } from '@angular/core'; import { IgxButtonGroupComponent } from 'igniteui-angular/button-group'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; -import { IgxCellTemplateDirective, IgxColumnComponent, IgxColumnGroupComponent, IgxNumberSummaryOperand, IgxSummaryOperand } from 'igniteui-angular/grids/core'; -import { IgxSummaryResult } from 'igniteui-angular/core'; +import { IgxCellTemplateDirective, IgxColumnComponent, IgxColumnGroupComponent } from 'igniteui-angular/grids/core'; +import { IgxNumberSummaryOperand, IgxSummaryOperand, IgxSummaryResult } from 'igniteui-angular/core'; import { INVOICE_DATA } from '../../data/invoiceData'; import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scroll.directive'; import { DatePipe } from '@angular/common'; @@ -27,7 +27,6 @@ class CustomNumberSummary { selector: 'app-grid-displaydensity-sample', styleUrls: ['./grid-displaydensity-sample.component.scss'], templateUrl: './grid-displaydensity-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonGroupComponent, IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnGroupComponent, IgxColumnComponent, IgxCellTemplateDirective, DatePipe] }) export class GridDisplayDensitySampleComponent implements OnInit { diff --git a/src/app/grid/grid-drop-indicator/grid-drop-indicator.ts b/src/app/grid/grid-drop-indicator/grid-drop-indicator.ts index d9a72171f4..962a41ec2c 100644 --- a/src/app/grid/grid-drop-indicator/grid-drop-indicator.ts +++ b/src/app/grid/grid-drop-indicator/grid-drop-indicator.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, AfterViewInit, OnDestroy, Renderer2, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild, AfterViewInit, OnDestroy, Renderer2, inject } from '@angular/core'; import { IDragMoveEventArgs, IDropDroppedEventArgs, IgxDropDirective } from 'igniteui-angular/directives'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IRowDragStartEventArgs, IgxColumnComponent, IgxRowDirective } from 'igniteui-angular/grids/core'; @@ -12,7 +12,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-drop-indicator', styleUrls: ['grid-drop-indicator.scss'], templateUrl: 'grid-drop-indicator.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxDropDirective, IgxPreventDocumentScrollDirective, IgxColumnComponent] }) export class GridDropIndicatorComponent implements AfterViewInit, OnDestroy { diff --git a/src/app/grid/grid-editing-events/grid-editing-events.component.ts b/src/app/grid/grid-editing-events/grid-editing-events.component.ts index 249ca44913..6a3e55586c 100644 --- a/src/app/grid/grid-editing-events/grid-editing-events.component.ts +++ b/src/app/grid/grid-editing-events/grid-editing-events.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { NgModel } from '@angular/forms'; import { IGridEditEventArgs, IgxColumnComponent } from 'igniteui-angular/grids/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; @@ -11,7 +11,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-editing-event', templateUrl: 'grid-editing-events.component.html', styleUrls: ['grid-editing-events.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxToastComponent] }) export class GridEditingEventsComponent implements OnInit { diff --git a/src/app/grid/grid-editing-excel-style/grid-editing-excel-style.component.ts b/src/app/grid/grid-editing-excel-style/grid-editing-excel-style.component.ts index 4bd962e0dd..d275792c9e 100644 --- a/src/app/grid/grid-editing-excel-style/grid-editing-excel-style.component.ts +++ b/src/app/grid/grid-editing-excel-style/grid-editing-excel-style.component.ts @@ -1,4 +1,4 @@ -import { ChangeDetectorRef, Component, OnInit, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { ChangeDetectorRef, Component, OnInit, ViewChild, inject } from '@angular/core'; import { IgxDialogComponent } from 'igniteui-angular/dialog'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { Transaction } from 'igniteui-angular/core'; @@ -10,7 +10,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-excel-style-editing-sample', styleUrls: [`grid-editing-excel-style.component.scss`], templateUrl: 'grid-editing-excel-style.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent] }) export class GridExcelStyleEditingComponent implements OnInit { diff --git a/src/app/grid/grid-editing-lifecycle-sample/grid-editing-lifecycle.component.ts b/src/app/grid/grid-editing-lifecycle-sample/grid-editing-lifecycle.component.ts index 281f4e2b0e..acd05a4c4f 100644 --- a/src/app/grid/grid-editing-lifecycle-sample/grid-editing-lifecycle.component.ts +++ b/src/app/grid/grid-editing-lifecycle-sample/grid-editing-lifecycle.component.ts @@ -1,4 +1,4 @@ -import { Component, ElementRef, Renderer2, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ElementRef, Renderer2, ViewChild, inject } from '@angular/core'; import { contains } from '@igniteui/material-icons-extended'; import { DATA } from '../../data/nwindData'; import { IgxSwitchComponent } from 'igniteui-angular/switch'; @@ -12,7 +12,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-editing-lifecycle', templateUrl: 'grid-editing-lifecycle.component.html', styleUrls: ['grid-editing-lifecycle.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSwitchComponent, IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxButtonDirective, IgxIconComponent] }) export class GridEditingLifecycleComponent { diff --git a/src/app/grid/grid-editing-sample/grid-editing-sample.component.ts b/src/app/grid/grid-editing-sample/grid-editing-sample.component.ts index 700703c1d1..c9f6d1604f 100644 --- a/src/app/grid/grid-editing-sample/grid-editing-sample.component.ts +++ b/src/app/grid/grid-editing-sample/grid-editing-sample.component.ts @@ -1,8 +1,8 @@ -import { AfterViewInit, Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { AfterViewInit, Component, OnInit, ViewChild } from '@angular/core'; import { IgxDialogComponent } from 'igniteui-angular/dialog'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; -import { IgxSummaryResult, VerticalAlignment } from 'igniteui-angular/core'; -import { IgxCellEditorTemplateDirective, IgxCellTemplateDirective, IgxColumnComponent, IgxGridToolbarComponent, IgxNumberSummaryOperand } from 'igniteui-angular/grids/core'; +import { IgxNumberSummaryOperand, IgxSummaryResult, VerticalAlignment } from 'igniteui-angular/core'; +import { IgxCellEditorTemplateDirective, IgxCellTemplateDirective, IgxColumnComponent, IgxGridToolbarComponent } from 'igniteui-angular/grids/core'; import { IgxToastComponent } from 'igniteui-angular/toast'; import { IgxPaginatorComponent } from 'igniteui-angular/paginator'; import { IgxButtonDirective, IgxFocusDirective, IgxIconButtonDirective } from 'igniteui-angular/directives'; @@ -42,7 +42,6 @@ class NumberSummary { selector: 'app-grid-editing-sample', styleUrls: ['./grid-editing-sample.component.scss'], templateUrl: './grid-editing-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxPaginatorComponent, IgxGridToolbarComponent, IgxButtonDirective, IgxIconComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxCellEditorTemplateDirective, FormsModule, IgxComboComponent, IgxFocusDirective, IgxIconButtonDirective, IgxToastComponent, IgxDialogComponent, IgxInputGroupComponent, IgxLabelDirective, IgxInputDirective, IgxDatePickerComponent, IgxCheckboxComponent, DatePipe] }) export class GridEditingSampleComponent implements OnInit, AfterViewInit { diff --git a/src/app/grid/grid-editing-style-sample/grid-editing-style-sample.component.ts b/src/app/grid/grid-editing-style-sample/grid-editing-style-sample.component.ts index 59a2599910..985810beab 100644 --- a/src/app/grid/grid-editing-style-sample/grid-editing-style-sample.component.ts +++ b/src/app/grid/grid-editing-style-sample/grid-editing-style-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxPaginatorComponent } from 'igniteui-angular/paginator'; import { IgxCellEditorTemplateDirective, IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -11,7 +11,6 @@ import { DatePipe } from '@angular/common'; selector: 'app-grid-editing-style-sample', styleUrls: ['./grid-editing-style-sample.component.scss'], templateUrl: './grid-editing-style-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxPaginatorComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxCellEditorTemplateDirective, FormsModule, DatePipe] }) export class GridEditingStyleSampleComponent implements OnInit { diff --git a/src/app/grid/grid-excel-style-filtering-load-on-demand/grid-excel-style-filtering-load-on-demand.component.ts b/src/app/grid/grid-excel-style-filtering-load-on-demand/grid-excel-style-filtering-load-on-demand.component.ts index f9c85ea0d6..6ff6806c42 100644 --- a/src/app/grid/grid-excel-style-filtering-load-on-demand/grid-excel-style-filtering-load-on-demand.component.ts +++ b/src/app/grid/grid-excel-style-filtering-load-on-demand/grid-excel-style-filtering-load-on-demand.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, inject } from '@angular/core'; import { ColumnType, IFilteringExpressionsTree } from 'igniteui-angular/core'; import { IgxColumnComponent, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent } from 'igniteui-angular/grids/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; @@ -10,7 +10,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro styleUrls: ['./grid-excel-style-filtering-load-on-demand.component.scss'], templateUrl: './grid-excel-style-filtering-load-on-demand.component.html', providers: [RemoteValuesService], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxGridToolbarActionsComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent, IgxColumnComponent] }) export class GridExcelStyleFilteringLoadOnDemandComponent implements OnInit { diff --git a/src/app/grid/grid-excel-style-filtering-sample-1/grid-excel-style-filtering-sample-1.component.ts b/src/app/grid/grid-excel-style-filtering-sample-1/grid-excel-style-filtering-sample-1.component.ts index 5167215021..c850550862 100644 --- a/src/app/grid/grid-excel-style-filtering-sample-1/grid-excel-style-filtering-sample-1.component.ts +++ b/src/app/grid/grid-excel-style-filtering-sample-1/grid-excel-style-filtering-sample-1.component.ts @@ -1,4 +1,4 @@ -import { Component, HostBinding, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, HostBinding, OnInit, ViewChild } from '@angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxButtonGroupComponent } from 'igniteui-angular/button-group'; import { IgxCellTemplateDirective, IgxColumnComponent, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarHidingComponent } from 'igniteui-angular/grids/core'; @@ -10,7 +10,6 @@ import { CurrencyPipe } from '@angular/common'; selector: 'app-grid-sample', styleUrls: ['./grid-excel-style-filtering-sample-1.component.scss'], templateUrl: 'grid-excel-style-filtering-sample-1.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonGroupComponent, IgxGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxGridToolbarActionsComponent, IgxGridToolbarHidingComponent, IgxColumnComponent, IgxCellTemplateDirective, CurrencyPipe] }) diff --git a/src/app/grid/grid-excel-style-filtering-sample-2/grid-excel-style-filtering-sample-2.component.ts b/src/app/grid/grid-excel-style-filtering-sample-2/grid-excel-style-filtering-sample-2.component.ts index e8b004f9fc..2c668951b9 100644 --- a/src/app/grid/grid-excel-style-filtering-sample-2/grid-excel-style-filtering-sample-2.component.ts +++ b/src/app/grid/grid-excel-style-filtering-sample-2/grid-excel-style-filtering-sample-2.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxCellTemplateDirective, IgxColumnComponent, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarHidingComponent } from 'igniteui-angular/grids/core'; import { DATA } from '../../data/nwindData'; @@ -9,7 +9,6 @@ import { CurrencyPipe } from '@angular/common'; selector: 'app-grid-sample', styleUrls: ['./grid-excel-style-filtering-sample-2.component.scss'], templateUrl: 'grid-excel-style-filtering-sample-2.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxGridToolbarActionsComponent, IgxGridToolbarHidingComponent, IgxColumnComponent, IgxCellTemplateDirective, CurrencyPipe] }) diff --git a/src/app/grid/grid-excel-style-filtering-sample-3/grid-excel-style-filtering-sample-3.component.ts b/src/app/grid/grid-excel-style-filtering-sample-3/grid-excel-style-filtering-sample-3.component.ts index 22f4295c0a..a418475915 100644 --- a/src/app/grid/grid-excel-style-filtering-sample-3/grid-excel-style-filtering-sample-3.component.ts +++ b/src/app/grid/grid-excel-style-filtering-sample-3/grid-excel-style-filtering-sample-3.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxCellTemplateDirective, IgxColumnComponent, IgxExcelStyleColumnOperationsTemplateDirective, IgxExcelStyleFilterOperationsTemplateDirective, IgxExcelStyleHeaderComponent, IgxExcelStyleHeaderIconDirective, IgxExcelStyleSearchComponent, IgxExcelStyleSortingComponent, IgxGridExcelStyleFilteringComponent, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarHidingComponent } from 'igniteui-angular/grids/core'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -10,7 +10,6 @@ import { CurrencyPipe } from '@angular/common'; selector: 'app-grid-sample', styleUrls: ['./grid-excel-style-filtering-sample-3.component.scss'], templateUrl: 'grid-excel-style-filtering-sample-3.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxGridToolbarActionsComponent, IgxGridToolbarHidingComponent, IgxExcelStyleHeaderIconDirective, IgxIconComponent, IgxGridExcelStyleFilteringComponent, IgxExcelStyleColumnOperationsTemplateDirective, IgxExcelStyleHeaderComponent, IgxExcelStyleSortingComponent, IgxExcelStyleFilterOperationsTemplateDirective, IgxExcelStyleSearchComponent, IgxColumnComponent, IgxCellTemplateDirective, CurrencyPipe] }) diff --git a/src/app/grid/grid-excel-style-filtering-style/grid-excel-style-filtering-style.component.ts b/src/app/grid/grid-excel-style-filtering-style/grid-excel-style-filtering-style.component.ts index ca92d3ba6a..2862e1ec29 100644 --- a/src/app/grid/grid-excel-style-filtering-style/grid-excel-style-filtering-style.component.ts +++ b/src/app/grid/grid-excel-style-filtering-style/grid-excel-style-filtering-style.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; import { DATA } from '../../data/nwindData'; @@ -9,7 +9,6 @@ import { CurrencyPipe } from '@angular/common'; selector: 'app-grid-esf-style-sample', styleUrls: ['./grid-excel-style-filtering-style.component.scss'], templateUrl: 'grid-excel-style-filtering-style.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, CurrencyPipe] }) export class ExcelStyleFilteringStyleComponent implements OnInit { diff --git a/src/app/grid/grid-export-visualization/grid-export-visualization.component.ts b/src/app/grid/grid-export-visualization/grid-export-visualization.component.ts index 3f572fdee0..51d3b65fd7 100644 --- a/src/app/grid/grid-export-visualization/grid-export-visualization.component.ts +++ b/src/app/grid/grid-export-visualization/grid-export-visualization.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component, inject, ChangeDetectorRef } from '@angular/core'; import { DATA } from '../../data/nwindData'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxCellTemplateDirective, IgxColumnComponent, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarExporterComponent } from 'igniteui-angular/grids/core'; @@ -10,10 +10,10 @@ import { CurrencyPipe } from '@angular/common'; selector: 'app-grid-export-visualization', templateUrl: './grid-export-visualization.component.html', styleUrls: ['./grid-export-visualization.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxGridToolbarActionsComponent, IgxButtonDirective, IgxGridToolbarExporterComponent, IgxColumnComponent, IgxCellTemplateDirective, CurrencyPipe] }) export class GridExportVisualizationComponent { + private cdr = inject(ChangeDetectorRef); public localData = []; constructor() { for (let i = 0; i < 1000; i++) { @@ -33,6 +33,9 @@ export class GridExportVisualizationComponent { longRunning(toolbar: any) { toolbar.showProgress = true; - setTimeout(() => toolbar.showProgress = false, 5000); + setTimeout(() => { + toolbar.showProgress = false; + this.cdr.markForCheck(); + }, 5000); } } diff --git a/src/app/grid/grid-external-advanced-filtering/grid-external-advanced-filtering.component.ts b/src/app/grid/grid-external-advanced-filtering/grid-external-advanced-filtering.component.ts index de51bf5189..7a7f649785 100644 --- a/src/app/grid/grid-external-advanced-filtering/grid-external-advanced-filtering.component.ts +++ b/src/app/grid/grid-external-advanced-filtering/grid-external-advanced-filtering.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxAdvancedFilteringDialogComponent, IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; import { DATA } from '../../data/nwindData'; @@ -8,7 +8,6 @@ import { CurrencyPipe } from '@angular/common'; selector: 'app-grid-external-advanced-filtering', templateUrl: './grid-external-advanced-filtering.component.html', styleUrls: ['./grid-external-advanced-filtering.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxAdvancedFilteringDialogComponent, IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, CurrencyPipe] }) export class GridExternalAdvancedFilteringComponent { diff --git a/src/app/grid/grid-external-excel-style-filtering/grid-external-excel-style-filtering.component.ts b/src/app/grid/grid-external-excel-style-filtering/grid-external-excel-style-filtering.component.ts index e1e0553167..05a34aca6d 100644 --- a/src/app/grid/grid-external-excel-style-filtering/grid-external-excel-style-filtering.component.ts +++ b/src/app/grid/grid-external-excel-style-filtering/grid-external-excel-style-filtering.component.ts @@ -8,7 +8,6 @@ import { CurrencyPipe } from '@angular/common'; import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scroll.directive'; @Component({ - changeDetection: ChangeDetectionStrategy.OnPush, selector: 'app-grid-external-excel-style-filtering', templateUrl: './grid-external-excel-style-filtering.component.html', styleUrls: ['./grid-external-excel-style-filtering.component.scss'], diff --git a/src/app/grid/grid-external-outlet-sample/grid-external-outlet-sample.component.ts b/src/app/grid/grid-external-outlet-sample/grid-external-outlet-sample.component.ts index 56c05ee08c..239e4e7207 100644 --- a/src/app/grid/grid-external-outlet-sample/grid-external-outlet-sample.component.ts +++ b/src/app/grid/grid-external-outlet-sample/grid-external-outlet-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit } from '@angular/core'; import { DATA } from '../../data/nwindData'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -10,7 +10,6 @@ import { CurrencyPipe } from '@angular/common'; selector: 'app-grid-external-outlet', styleUrls: ['./grid-external-outlet-sample.component.scss'], templateUrl: 'grid-external-outlet-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxOverlayOutletDirective, CurrencyPipe] }) diff --git a/src/app/grid/grid-filtering-sample/grid-filtering-sample.component.ts b/src/app/grid/grid-filtering-sample/grid-filtering-sample.component.ts index bc02bb6148..a5c1401ae3 100644 --- a/src/app/grid/grid-filtering-sample/grid-filtering-sample.component.ts +++ b/src/app/grid/grid-filtering-sample/grid-filtering-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxStringFilteringOperand } from 'igniteui-angular/core'; import { IgxInputDirective, IgxInputGroupComponent } from 'igniteui-angular/input-group'; @@ -11,7 +11,6 @@ import { CurrencyPipe } from '@angular/common'; selector: 'app-grid-sample', styleUrls: ['./grid-filtering-sample.component.scss'], templateUrl: 'grid-filtering-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxInputGroupComponent, IgxInputDirective, IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, CurrencyPipe] }) diff --git a/src/app/grid/grid-filtering-style/grid-filtering-style.component.ts b/src/app/grid/grid-filtering-style/grid-filtering-style.component.ts index b2fc3bbf2b..08a89cd2bb 100644 --- a/src/app/grid/grid-filtering-style/grid-filtering-style.component.ts +++ b/src/app/grid/grid-filtering-style/grid-filtering-style.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit } from '@angular/core'; import { DATA } from '../../data/nwindData'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -9,7 +9,6 @@ import { CurrencyPipe } from '@angular/common'; selector: 'app-grid-filtering-style', styleUrls: ['./grid-filtering-style.component.scss'], templateUrl: './grid-filtering-style.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, CurrencyPipe] }) export class GridFilteringStyleComponent implements OnInit { diff --git a/src/app/grid/grid-filtering-template-sample/grid-filtering-template-sample.component.ts b/src/app/grid/grid-filtering-template-sample/grid-filtering-template-sample.component.ts index a680675b0d..192ec50d47 100644 --- a/src/app/grid/grid-filtering-template-sample/grid-filtering-template-sample.component.ts +++ b/src/app/grid/grid-filtering-template-sample/grid-filtering-template-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { ColumnType, GridColumnDataType, IgxDateFilteringOperand, IgxNumberFilteringOperand, IgxPickerClearComponent, IgxPickerToggleComponent, IgxStringFilteringOperand } from 'igniteui-angular/core'; import { IgxCellTemplateDirective, IgxColumnComponent, IgxFilterCellTemplateDirective } from 'igniteui-angular/grids/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; @@ -13,7 +13,6 @@ import { CurrencyPipe } from '@angular/common'; selector: 'app-grid-sample', styleUrls: ['./grid-filtering-template-sample.component.scss'], templateUrl: 'grid-filtering-template-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxFilterCellTemplateDirective, IgxInputGroupComponent, IgxPrefixDirective, IgxIconComponent, IgxInputDirective, IgxSuffixDirective, IgxDatePickerComponent, IgxPickerToggleComponent, IgxPickerClearComponent, CurrencyPipe] }) diff --git a/src/app/grid/grid-formatted-filtering-strategy/grid-formatted-filtering-strategy.component.ts b/src/app/grid/grid-formatted-filtering-strategy/grid-formatted-filtering-strategy.component.ts index ebaed4772d..87f6af46ff 100644 --- a/src/app/grid/grid-formatted-filtering-strategy/grid-formatted-filtering-strategy.component.ts +++ b/src/app/grid/grid-formatted-filtering-strategy/grid-formatted-filtering-strategy.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { FormattedValuesFilteringStrategy } from 'igniteui-angular/core'; import { IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -10,7 +10,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-sample', styleUrls: ['./grid-formatted-filtering-strategy.component.scss'], templateUrl: 'grid-formatted-filtering-strategy.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective] }) export class GridFormattedFilteringStrategyComponent implements OnInit { diff --git a/src/app/grid/grid-group-by-paging-sample/grid-group-by-paging-sample.component.ts b/src/app/grid/grid-group-by-paging-sample/grid-group-by-paging-sample.component.ts index a176a26529..e5c66c5324 100644 --- a/src/app/grid/grid-group-by-paging-sample/grid-group-by-paging-sample.component.ts +++ b/src/app/grid/grid-group-by-paging-sample/grid-group-by-paging-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { DefaultSortingStrategy, ISortingExpression, SortingDirection } from 'igniteui-angular/core'; import { GridSelectionMode, IgxColumnComponent, IgxGroupByRowTemplateDirective } from 'igniteui-angular/grids/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; @@ -12,7 +12,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-group-by-paging-sample', templateUrl: './grid-group-by-paging-sample.component.html', styleUrls: ['./grid-group-by-paging-sample.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxPaginatorComponent, IgxColumnComponent, IgxGroupByRowTemplateDirective, IgxIconComponent, IgxBadgeComponent] }) export class GridGroupByPagingSampleComponent { diff --git a/src/app/grid/grid-groupby-custom-sample/grid-groupby-custom-sample.component.ts b/src/app/grid/grid-groupby-custom-sample/grid-groupby-custom-sample.component.ts index 096a847ba7..0f86d868b4 100644 --- a/src/app/grid/grid-groupby-custom-sample/grid-groupby-custom-sample.component.ts +++ b/src/app/grid/grid-groupby-custom-sample/grid-groupby-custom-sample.component.ts @@ -1,5 +1,5 @@ /* eslint-disable max-len */ -import { Component, ViewChild, ViewEncapsulation, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild, ViewEncapsulation } from '@angular/core'; import { DefaultSortingStrategy, SortingDirection } from 'igniteui-angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxCellTemplateDirective, IgxColumnComponent, IgxGridToolbarComponent, IgxGroupByRowTemplateDirective } from 'igniteui-angular/grids/core'; @@ -16,7 +16,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-groupby-custom-sample', styleUrls: ['./grid-groupby-custom-sample.component.scss'], templateUrl: './grid-groupby-custom-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxButtonDirective, IgxToggleActionDirective, IgxDropDownItemNavigationDirective, IgxDropDownComponent, IgxDropDownItemComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxGroupByRowTemplateDirective, IgxIconComponent, IgxBadgeComponent, CurrencyPipe, DatePipe] }) export class GridGroupByCustomSampleComponent { diff --git a/src/app/grid/grid-groupby-sample/grid-groupby-sample.component.ts b/src/app/grid/grid-groupby-sample/grid-groupby-sample.component.ts index 7d7061c872..b17535e5e7 100644 --- a/src/app/grid/grid-groupby-sample/grid-groupby-sample.component.ts +++ b/src/app/grid/grid-groupby-sample/grid-groupby-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ViewEncapsulation, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild, ViewEncapsulation } from '@angular/core'; import { DefaultSortingStrategy, ISortingExpression, SortingDirection } from 'igniteui-angular/core'; import { GridSelectionMode, IgxCellTemplateDirective, IgxColumnComponent, IgxGroupByRowTemplateDirective } from 'igniteui-angular/grids/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; @@ -13,7 +13,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-groupby-sample', styleUrls: ['./grid-groupby-sample.component.scss'], templateUrl: './grid-groupby-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxGroupByRowTemplateDirective, IgxIconComponent, IgxBadgeComponent] }) export class GridGroupBySampleComponent { diff --git a/src/app/grid/grid-groupby-styling/grid-groupby-styling.component.ts b/src/app/grid/grid-groupby-styling/grid-groupby-styling.component.ts index 4533dde3c8..40eb9c0552 100644 --- a/src/app/grid/grid-groupby-styling/grid-groupby-styling.component.ts +++ b/src/app/grid/grid-groupby-styling/grid-groupby-styling.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ViewEncapsulation, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild, ViewEncapsulation } from '@angular/core'; import { DefaultSortingStrategy, ISortingExpression, SortingDirection } from 'igniteui-angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -11,7 +11,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-groupby-sample', styleUrls: ['./grid-groupby-styling.component.scss'], templateUrl: './grid-groupby-styling.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective] }) export class GridGroupByStylingComponent { diff --git a/src/app/grid/grid-groupby-summary-sample/grid-groupby-summary-sample.component.ts b/src/app/grid/grid-groupby-summary-sample/grid-groupby-summary-sample.component.ts index 4766e712ad..8cc8725fe8 100644 --- a/src/app/grid/grid-groupby-summary-sample/grid-groupby-summary-sample.component.ts +++ b/src/app/grid/grid-groupby-summary-sample/grid-groupby-summary-sample.component.ts @@ -1,6 +1,6 @@ -import { Component, OnInit, ViewChild, ViewEncapsulation, ChangeDetectionStrategy } from '@angular/core'; -import { DefaultSortingStrategy, GridSummaryCalculationMode, ISortingExpression, IgxSummaryResult, SortingDirection } from 'igniteui-angular/core'; -import { GridSelectionMode, GridSummaryPosition, IgxColumnComponent, IgxNumberSummaryOperand, IgxSummaryOperand } from 'igniteui-angular/grids/core'; +import { Component, OnInit, ViewChild, ViewEncapsulation } from '@angular/core'; +import { DefaultSortingStrategy, GridSummaryCalculationMode, ISortingExpression, IgxNumberSummaryOperand, IgxSummaryOperand, IgxSummaryResult, SortingDirection } from 'igniteui-angular/core'; +import { GridSelectionMode, GridSummaryPosition, IgxColumnComponent } from 'igniteui-angular/grids/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxButtonGroupComponent } from 'igniteui-angular/button-group'; import { IgxSwitchComponent } from 'igniteui-angular/switch'; @@ -38,7 +38,6 @@ class SumSummary { selector: 'app-grid-groupby-summary-sample', styleUrls: ['./grid-groupby-summary-sample.component.scss'], templateUrl: './grid-groupby-summary-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonGroupComponent, IgxSwitchComponent, IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent] }) export class GridGroupBySummarySampleComponent { diff --git a/src/app/grid/grid-groupby-summary-styling-sample/grid-groupby-summary-styling-sample.component.ts b/src/app/grid/grid-groupby-summary-styling-sample/grid-groupby-summary-styling-sample.component.ts index d5d50f00de..ec1c26253a 100644 --- a/src/app/grid/grid-groupby-summary-styling-sample/grid-groupby-summary-styling-sample.component.ts +++ b/src/app/grid/grid-groupby-summary-styling-sample/grid-groupby-summary-styling-sample.component.ts @@ -1,6 +1,6 @@ -import { Component, OnInit, ViewChild, ViewEncapsulation, ChangeDetectionStrategy } from '@angular/core'; -import { DefaultSortingStrategy, GridSummaryCalculationMode, ISortingExpression, IgxSummaryResult, SortingDirection } from 'igniteui-angular/core'; -import { GridSelectionMode, GridSummaryPosition, IgxColumnComponent, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarPinningComponent, IgxNumberSummaryOperand, IgxSummaryOperand } from 'igniteui-angular/grids/core'; +import { Component, OnInit, ViewChild, ViewEncapsulation } from '@angular/core'; +import { DefaultSortingStrategy, GridSummaryCalculationMode, ISortingExpression, IgxNumberSummaryOperand, IgxSummaryOperand, IgxSummaryResult, SortingDirection } from 'igniteui-angular/core'; +import { GridSelectionMode, GridSummaryPosition, IgxColumnComponent, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarPinningComponent } from 'igniteui-angular/grids/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxButtonGroupComponent } from 'igniteui-angular/button-group'; import { INVOICE_DATA } from '../../data/invoiceData'; @@ -28,7 +28,6 @@ class CustomSummary { selector: 'app-grid-groupby-summary-sample', styleUrls: ['./grid-groupby-summary-styling-sample.component.scss'], templateUrl: './grid-groupby-summary-styling-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonGroupComponent, IgxGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxGridToolbarActionsComponent, IgxGridToolbarPinningComponent, IgxColumnComponent] }) export class GridGroupBySummaryStylingSampleComponent { diff --git a/src/app/grid/grid-keyboardnav-guide-sample/grid-keyboardnav-sample.component.scss b/src/app/grid/grid-keyboardnav-guide-sample/grid-keyboardnav-sample.component.scss index 350dfb9014..0c28471bb9 100644 --- a/src/app/grid/grid-keyboardnav-guide-sample/grid-keyboardnav-sample.component.scss +++ b/src/app/grid/grid-keyboardnav-guide-sample/grid-keyboardnav-sample.component.scss @@ -8,7 +8,7 @@ $custom-checkbox-theme: checkbox-theme( ); .list-sample ::ng-deep { - @include checkbox($custom-checkbox-theme); + @include tokens($custom-checkbox-theme); } .sample { diff --git a/src/app/grid/grid-keyboardnav-guide-sample/grid-keyboardnav-sample.component.ts b/src/app/grid/grid-keyboardnav-guide-sample/grid-keyboardnav-sample.component.ts index db8df61e24..d1cb9ba515 100644 --- a/src/app/grid/grid-keyboardnav-guide-sample/grid-keyboardnav-sample.component.ts +++ b/src/app/grid/grid-keyboardnav-guide-sample/grid-keyboardnav-sample.component.ts @@ -3,7 +3,7 @@ /* eslint-disable @typescript-eslint/naming-convention */ /* eslint-disable no-shadow */ import { animate, state, style, transition, trigger } from '@angular/animations'; -import { ChangeDetectorRef, Component, OnDestroy, OnInit, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { ChangeDetectorRef, Component, OnDestroy, OnInit, ViewChild, inject } from '@angular/core'; import { CellType, IActiveNodeChangeEventArgs, IgxColumnComponent, IgxColumnGroupComponent, IgxGridDetailTemplateDirective, IgxGridToolbarComponent } from 'igniteui-angular/grids/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxEmptyListTemplateDirective, IgxListComponent, IgxListItemComponent, IgxListLineSubTitleDirective, IgxListLineTitleDirective } from 'igniteui-angular/list'; @@ -169,7 +169,6 @@ const summaryCombinations: Item[] = [ ]) ]) ], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPaginatorComponent, IgxGridToolbarComponent, IgxGridDetailTemplateDirective, IgxColumnGroupComponent, IgxColumnComponent, IgxListComponent, IgxListItemComponent, NgClass, IgxListLineTitleDirective, IgxListLineSubTitleDirective, IgxCheckboxComponent, IgxEmptyListTemplateDirective] }) export class GridKeyboardnavGuide implements OnInit, OnDestroy { diff --git a/src/app/grid/grid-moving-sample/grid-moving-sample.component.ts b/src/app/grid/grid-moving-sample/grid-moving-sample.component.ts index bc0f62ae50..a6b1acd8b6 100644 --- a/src/app/grid/grid-moving-sample/grid-moving-sample.component.ts +++ b/src/app/grid/grid-moving-sample/grid-moving-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { ColumnType } from 'igniteui-angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxCellHeaderTemplateDirective, IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -13,7 +13,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-moving-sample', styleUrls: ['./grid-moving-sample.component.scss'], templateUrl: './grid-moving-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxCellHeaderTemplateDirective, IgxIconComponent, IgxGridComponent, IgxPreventDocumentScrollDirective, IgxPaginatorComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxBadgeComponent] }) diff --git a/src/app/grid/grid-moving-styled-sample/grid-moving-styled-sample.component.ts b/src/app/grid/grid-moving-styled-sample/grid-moving-styled-sample.component.ts index 0f2431fb8c..9b3e53c2a4 100644 --- a/src/app/grid/grid-moving-styled-sample/grid-moving-styled-sample.component.ts +++ b/src/app/grid/grid-moving-styled-sample/grid-moving-styled-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { ColumnType } from 'igniteui-angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxCellHeaderTemplateDirective, IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -13,7 +13,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-moving-styled-sample', styleUrls: ['./grid-moving-styled-sample.component.scss'], templateUrl: './grid-moving-styled-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxCellHeaderTemplateDirective, IgxIconComponent, IgxGridComponent, IgxPreventDocumentScrollDirective, IgxPaginatorComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxBadgeComponent] }) diff --git a/src/app/grid/grid-mrl-custom-navigation/grid-mrl-custom-navigation.component.ts b/src/app/grid/grid-mrl-custom-navigation/grid-mrl-custom-navigation.component.ts index 748e9a7fe3..40f651b4ef 100644 --- a/src/app/grid/grid-mrl-custom-navigation/grid-mrl-custom-navigation.component.ts +++ b/src/app/grid/grid-mrl-custom-navigation/grid-mrl-custom-navigation.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ViewEncapsulation, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild, ViewEncapsulation } from '@angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxColumnComponent, IgxColumnLayoutComponent } from 'igniteui-angular/grids/core'; import { DATA } from '../../data/company-data'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-mrl-custom-navigation-sample', styleUrls: ['./grid-mrl-custom-navigation.component.scss'], templateUrl: './grid-mrl-custom-navigation.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnLayoutComponent, IgxColumnComponent] }) export class GridMRLCustomNavigationComponent { diff --git a/src/app/grid/grid-multi-cell-selection-style/grid-multi-cell-selection-style.component.ts b/src/app/grid/grid-multi-cell-selection-style/grid-multi-cell-selection-style.component.ts index 248e14e568..bb6fbdc52f 100644 --- a/src/app/grid/grid-multi-cell-selection-style/grid-multi-cell-selection-style.component.ts +++ b/src/app/grid/grid-multi-cell-selection-style/grid-multi-cell-selection-style.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxColumnComponent } from 'igniteui-angular/grids/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { DATA } from '../../data/nwindData'; @@ -8,7 +8,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-multi-cell-selection-style-sample', styleUrls: ['./grid-multi-cell-selection-style.component.scss'], templateUrl: './grid-multi-cell-selection-style.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective] }) export class GridMultiCellSelectionStyleComponent { diff --git a/src/app/grid/grid-multi-cell-selection/grid-multi-cell-selection.component.ts b/src/app/grid/grid-multi-cell-selection/grid-multi-cell-selection.component.ts index f0cf496a49..f4d5014e8e 100644 --- a/src/app/grid/grid-multi-cell-selection/grid-multi-cell-selection.component.ts +++ b/src/app/grid/grid-multi-cell-selection/grid-multi-cell-selection.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewEncapsulation, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewEncapsulation } from '@angular/core'; import { IgxColumnComponent } from 'igniteui-angular/grids/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxToastComponent } from 'igniteui-angular/toast'; @@ -11,7 +11,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-multi-cell-selection-sample', styleUrls: ['./grid-multi-cell-selection.component.scss'], templateUrl: './grid-multi-cell-selection.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxToastComponent] }) export class GridMultiCellSelectionComponent { diff --git a/src/app/grid/grid-multi-row-layout-configuration/grid-multi-row-layout-configuration.component.ts b/src/app/grid/grid-multi-row-layout-configuration/grid-multi-row-layout-configuration.component.ts index cb55fab03f..5fceaed218 100644 --- a/src/app/grid/grid-multi-row-layout-configuration/grid-multi-row-layout-configuration.component.ts +++ b/src/app/grid/grid-multi-row-layout-configuration/grid-multi-row-layout-configuration.component.ts @@ -1,5 +1,5 @@ /* eslint-disable @typescript-eslint/naming-convention */ -import { ChangeDetectorRef, Component, ElementRef, QueryList, ViewChild, ViewChildren, ViewEncapsulation, DOCUMENT, inject, ChangeDetectionStrategy } from "@angular/core"; +import { ChangeDetectorRef, Component, ElementRef, QueryList, ViewChild, ViewChildren, ViewEncapsulation, DOCUMENT, inject } from "@angular/core"; import { IDropBaseEventArgs, IDropDroppedEventArgs, IgxButtonDirective, IgxDropDirective, IgxIconButtonDirective } from 'igniteui-angular/directives'; import { IgxDialogComponent } from 'igniteui-angular/dialog'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; @@ -38,7 +38,6 @@ enum DialogType { selector: "app-grid-multi-row-layout-configuration-sample", styleUrls: ["./grid-multi-row-layout-configuration.component.scss"], templateUrl: "./grid-multi-row-layout-configuration.component.html", - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxChipsAreaComponent, IgxChipComponent, IgxSuffixDirective, IgxIconButtonDirective, IgxIconComponent, IgxPrefixDirective, IgxInputGroupComponent, IgxInputDirective, NgStyle, IgxDropDirective, NgClass, IgxButtonDirective, IgxDialogComponent] }) export class GridMultiRowLayoutConfigurationComponent { diff --git a/src/app/grid/grid-multi-row-layout-styling/grid-multi-row-layout-styling.component.ts b/src/app/grid/grid-multi-row-layout-styling/grid-multi-row-layout-styling.component.ts index bcf0b8ee91..65f93ed445 100644 --- a/src/app/grid/grid-multi-row-layout-styling/grid-multi-row-layout-styling.component.ts +++ b/src/app/grid/grid-multi-row-layout-styling/grid-multi-row-layout-styling.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewEncapsulation, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewEncapsulation } from '@angular/core'; import { DefaultSortingStrategy, SortingDirection } from 'igniteui-angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxColumnComponent, IgxColumnLayoutComponent } from 'igniteui-angular/grids/core'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-multi-row-layout-styling-sample', styleUrls: ['./grid-multi-row-layout-styling.component.scss'], templateUrl: './grid-multi-row-layout-styling.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnLayoutComponent, IgxColumnComponent] }) export class GridMultiRowLayoutStylingComponent { diff --git a/src/app/grid/grid-multi-row-layout/grid-multi-row-layout.component.ts b/src/app/grid/grid-multi-row-layout/grid-multi-row-layout.component.ts index 145ae8f725..e4ec09ba68 100644 --- a/src/app/grid/grid-multi-row-layout/grid-multi-row-layout.component.ts +++ b/src/app/grid/grid-multi-row-layout/grid-multi-row-layout.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewEncapsulation, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewEncapsulation } from '@angular/core'; import { DefaultSortingStrategy, SortingDirection } from 'igniteui-angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxColumnComponent, IgxColumnLayoutComponent, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent } from 'igniteui-angular/grids/core'; @@ -10,7 +10,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-multi-row-layout-sample', styleUrls: ['./grid-multi-row-layout.component.scss'], templateUrl: './grid-multi-row-layout.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxGridToolbarActionsComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent, IgxColumnLayoutComponent, IgxColumnComponent] }) export class GridMultiRowLayoutComponent { diff --git a/src/app/grid/grid-multiple-row-drag/grid-multiple-row-drag.component.ts b/src/app/grid/grid-multiple-row-drag/grid-multiple-row-drag.component.ts index deb3b79c4d..e81e9255a8 100644 --- a/src/app/grid/grid-multiple-row-drag/grid-multiple-row-drag.component.ts +++ b/src/app/grid/grid-multiple-row-drag/grid-multiple-row-drag.component.ts @@ -1,5 +1,5 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { GridSelectionMode, IgxColumnComponent, IgxRowDragGhostDirective } from 'igniteui-angular/grids/core'; import { IDropDroppedEventArgs, IgxDropDirective } from 'igniteui-angular/directives'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; @@ -10,7 +10,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-multiple-row-drag', styleUrls: ['./grid-multiple-row-drag.component.scss'], templateUrl: './grid-multiple-row-drag.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxRowDragGhostDirective, IgxIconComponent, IgxDropDirective] }) export class GridMultipleRowDragComponent { diff --git a/src/app/grid/grid-nested-data-binding-2/grid-nested-data-bind2.ts b/src/app/grid/grid-nested-data-binding-2/grid-nested-data-bind2.ts index d6bd5d2a6a..9d64fcd7c8 100644 --- a/src/app/grid/grid-nested-data-binding-2/grid-nested-data-bind2.ts +++ b/src/app/grid/grid-nested-data-binding-2/grid-nested-data-bind2.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit } from '@angular/core'; import { GridColumnDataType } from 'igniteui-angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxColumnComponent, IgxGridFooterComponent } from 'igniteui-angular/grids/core'; @@ -10,7 +10,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-nested-data-bind2', styleUrls: ['./grid-nested-data-bind2.scss'], templateUrl: './grid-nested-data-bind2.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxGridFooterComponent] }) export class GridNestedDataBindAminoacidComponent implements OnInit { diff --git a/src/app/grid/grid-nested-data-binding/grid-nested-data-bind.html b/src/app/grid/grid-nested-data-binding/grid-nested-data-bind.html index da75e3c7dd..0ad22be949 100644 --- a/src/app/grid/grid-nested-data-binding/grid-nested-data-bind.html +++ b/src/app/grid/grid-nested-data-binding/grid-nested-data-bind.html @@ -17,7 +17,7 @@
- + diff --git a/src/app/grid/grid-nested-data-binding/grid-nested-data-bind.scss b/src/app/grid/grid-nested-data-binding/grid-nested-data-bind.scss index f3f7cb51c5..a4629b27ff 100644 --- a/src/app/grid/grid-nested-data-binding/grid-nested-data-bind.scss +++ b/src/app/grid/grid-nested-data-binding/grid-nested-data-bind.scss @@ -1,84 +1,78 @@ -igx-expansion-panel { - display: flex; - font-size: .75rem; - min-width: 50%; - max-width: 50%; - padding: 0; - flex: 1 1 auto; +:host { + igx-expansion-panel { + --expanded-margin: 0; - igx-expansion-panel-description, igx-expansion-panel-body { - font-size: .75rem; - padding: 0; - display: flex; - flex: 1 1 auto; - } - - - .description { - display: flex; - width: 100%; - text-overflow: ellipsis; - padding: .5rem 1rem; - flex: 1 1 auto; - flex-direction: column; - } -} - -igx-input-group { - --ig-size: var(--ig-size-small); -} + flex-grow: 1; -::ng-deep { - .expand { - padding: 2px; - background: transparent; - &:hover { - background: transparent; + igx-expansion-panel-description, + igx-expansion-panel-body { + font-size: .75rem; + padding: 0; + display: flex; + flex: 1 1 auto; } + .description { + display: grid; + width: 100%; + gap: 8px; + padding: 16px; + } - .igx-expansion-panel__header-description { - font-weight: bold; + igx-input-group { + --ig-size: var(--ig-size-small); } } - .igx-grid__tr { - &:hover { - .expand { - background: #fff; + + .employees-container { + width: 100%; + display: grid; + grid-template-columns: 1fr 1fr; + + + &--edit { + > igx-expansion-panel { + display: flex; + min-width: 50%; + flex: 1 0 auto; } } } - .dark-theme { - &:hover { - .expand { - background: #333; - } - } + .grid__wrapper { + margin: 0 auto; + padding: 16px; } -} -.employees-container { - width: 100%; - display: flex; - flex-flow: row wrap; - flex-grow: 1; + ::ng-deep { + .expand { + padding: 0; + background: transparent; + &:hover { + background: transparent; + } - &--edit { - display: flex; - flex-flow: row wrap; - flex-grow: 1; - > igx-expansion-panel { - display: flex; - min-width: 50%; - flex: 1 0 auto; + .igx-expansion-panel__header-description { + font-weight: bold; + } + } + + .igx-grid__tr { + &:hover { + .expand { + background: #fff; + } + } } - } -} -.grid__wrapper { - margin: 0 auto; - padding: 16px; + .dark-theme { + &:hover { + .expand { + background: #333; + } + } + } + } } diff --git a/src/app/grid/grid-nested-data-binding/grid-nested-data-bind.ts b/src/app/grid/grid-nested-data-binding/grid-nested-data-bind.ts index 203a49fb9f..f3de4c1571 100644 --- a/src/app/grid/grid-nested-data-binding/grid-nested-data-bind.ts +++ b/src/app/grid/grid-nested-data-binding/grid-nested-data-bind.ts @@ -1,4 +1,4 @@ -import { ChangeDetectorRef, Component, OnInit, inject, ChangeDetectionStrategy } from '@angular/core'; +import { ChangeDetectorRef, Component, OnInit, inject } from '@angular/core'; import {EMPLOYEE_DATA} from '../../data/nested-employee-data'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -12,7 +12,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-grid-nested-data-bind', styleUrls: ['./grid-nested-data-bind.scss'], templateUrl: './grid-nested-data-bind.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxExpansionPanelComponent, IgxExpansionPanelHeaderComponent, IgxExpansionPanelDescriptionDirective, IgxExpansionPanelBodyComponent, IgxInputGroupComponent, IgxLabelDirective, FormsModule, IgxInputDirective, DatePipe] }) diff --git a/src/app/grid/grid-pager-sample/grid-pager-sample.component.ts b/src/app/grid/grid-pager-sample/grid-pager-sample.component.ts index 2cbc6f9c9d..e366cb9c1d 100644 --- a/src/app/grid/grid-pager-sample/grid-pager-sample.component.ts +++ b/src/app/grid/grid-pager-sample/grid-pager-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, AfterViewInit, ChangeDetectorRef, PLATFORM_ID, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild, AfterViewInit, ChangeDetectorRef, PLATFORM_ID, inject } from '@angular/core'; import { athletesData } from '../../data/athletesData'; import { IPaginatorResourceStrings } from 'igniteui-angular/core'; import { IgxPageNavigationComponent, IgxPageSizeSelectorComponent, IgxPaginatorComponent, IgxPaginatorContentDirective } from 'igniteui-angular/paginator'; @@ -13,7 +13,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-grid-pager-sample', styleUrls: ['./grid-pager-sample.component.scss'], templateUrl: './grid-pager-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxPaginatorComponent, IgxPaginatorContentDirective, IgxPageSizeSelectorComponent, IgxPageNavigationComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxSwitchComponent, FormsModule, DecimalPipe] }) export class GridPagerSampleComponent implements OnInit, AfterViewInit { diff --git a/src/app/grid/grid-paging-sample/grid-paging-sample.component.scss b/src/app/grid/grid-paging-sample/grid-paging-sample.component.scss index c36c25d405..9c38781b8c 100644 --- a/src/app/grid/grid-paging-sample/grid-paging-sample.component.scss +++ b/src/app/grid/grid-paging-sample/grid-paging-sample.component.scss @@ -6,7 +6,7 @@ $progressBar-sample-theme: progress-linear-theme( ); .grid__wrapper { - @include progress-linear($progressBar-sample-theme); + @include tokens($progressBar-sample-theme); --ig-size: var(--ig-size-medium); margin: 0 16px; diff --git a/src/app/grid/grid-paging-sample/grid-paging-sample.component.ts b/src/app/grid/grid-paging-sample/grid-paging-sample.component.ts index 0f358459c7..638605d5d1 100644 --- a/src/app/grid/grid-paging-sample/grid-paging-sample.component.ts +++ b/src/app/grid/grid-paging-sample/grid-paging-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ViewEncapsulation, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild, ViewEncapsulation } from '@angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxPaginatorComponent } from 'igniteui-angular/paginator'; import { IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -12,7 +12,6 @@ import { DecimalPipe } from '@angular/common'; selector: 'app-grid-sample', styleUrls: ['./grid-paging-sample.component.scss'], templateUrl: 'grid-paging-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxPaginatorComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxLinearProgressBarComponent, DecimalPipe] }) diff --git a/src/app/grid/grid-paste/grid-paste-sample.component.ts b/src/app/grid/grid-paste/grid-paste-sample.component.ts index 5cf720a4cc..727b40f86d 100644 --- a/src/app/grid/grid-paste/grid-paste-sample.component.ts +++ b/src/app/grid/grid-paste/grid-paste-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild, inject } from '@angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxButtonDirective, IgxToggleActionDirective } from 'igniteui-angular/directives'; import { IgxDropDownComponent, IgxDropDownItemComponent, IgxDropDownItemNavigationDirective } from 'igniteui-angular/drop-down'; @@ -15,7 +15,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-paste-sample', styleUrls: ['./grid-paste-sample.component.scss'], templateUrl: './grid-paste-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxToggleActionDirective, IgxDropDownItemNavigationDirective, IgxDropDownComponent, IgxDropDownItemComponent, IgxGridComponent, PasteHandler, IgxPreventDocumentScrollDirective, IgxColumnComponent] }) export class GridPasteSampleComponent { diff --git a/src/app/grid/grid-remote-filtering-sample/remote-filtering-sample.component.ts b/src/app/grid/grid-remote-filtering-sample/remote-filtering-sample.component.ts index ade5fc7c19..09e599a6b4 100644 --- a/src/app/grid/grid-remote-filtering-sample/remote-filtering-sample.component.ts +++ b/src/app/grid/grid-remote-filtering-sample/remote-filtering-sample.component.ts @@ -1,4 +1,4 @@ -import { ChangeDetectorRef, Component, OnInit, ViewChild, AfterViewInit, OnDestroy, inject, ChangeDetectionStrategy } from '@angular/core'; +import { ChangeDetectorRef, Component, OnInit, ViewChild, AfterViewInit, OnDestroy, inject } from '@angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { NoopFilteringStrategy, NoopSortingStrategy } from 'igniteui-angular/core'; import { IgxCellHeaderTemplateDirective, IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -16,7 +16,6 @@ const DEBOUNCE_TIME = 300; selector: 'app-grid-remote-filtering-sample', styleUrls: ['./remote-filtering-sample.component.scss'], templateUrl: './remote-filtering-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellHeaderTemplateDirective, IgxCellTemplateDirective, IgxBadgeComponent, AsyncPipe] }) export class RemoteFilteringSampleComponent implements OnInit, AfterViewInit, OnDestroy { diff --git a/src/app/grid/grid-remote-paging-defaultTemplate-sample/remote-paging-default-template.component.ts b/src/app/grid/grid-remote-paging-defaultTemplate-sample/remote-paging-default-template.component.ts index 3e95fbd976..2cf62350fe 100644 --- a/src/app/grid/grid-remote-paging-defaultTemplate-sample/remote-paging-default-template.component.ts +++ b/src/app/grid/grid-remote-paging-defaultTemplate-sample/remote-paging-default-template.component.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, Component, OnDestroy, OnInit, TemplateRef, ViewChild, ViewEncapsulation, inject, ChangeDetectionStrategy } from '@angular/core'; +import { AfterViewInit, Component, OnDestroy, OnInit, TemplateRef, ViewChild, ViewEncapsulation, inject } from '@angular/core'; import { GridPagingMode, IgxColumnComponent } from 'igniteui-angular/grids/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxPaginatorComponent } from 'igniteui-angular/paginator'; @@ -13,7 +13,6 @@ import { AsyncPipe } from '@angular/common'; selector: 'app-remote-paging-default-template', styleUrls: ['./remote-paging-default-template.component.scss'], templateUrl: './remote-paging-default-template.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxPaginatorComponent, IgxColumnComponent, AsyncPipe] }) export class RemotePagingDefaultTemplateComponent implements OnInit, AfterViewInit, OnDestroy { diff --git a/src/app/grid/grid-remote-paging-sample/remote-paging-sample.component.ts b/src/app/grid/grid-remote-paging-sample/remote-paging-sample.component.ts index 341e6d1892..ee0443456a 100644 --- a/src/app/grid/grid-remote-paging-sample/remote-paging-sample.component.ts +++ b/src/app/grid/grid-remote-paging-sample/remote-paging-sample.component.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, Component, OnDestroy, OnInit, TemplateRef, ViewChild, ViewEncapsulation, inject, ChangeDetectionStrategy } from '@angular/core'; +import { AfterViewInit, Component, OnDestroy, OnInit, TemplateRef, ViewChild, ViewEncapsulation, inject } from '@angular/core'; import { GridPagingMode, IgxColumnComponent } from 'igniteui-angular/grids/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxPageNavigationComponent, IgxPageSizeSelectorComponent, IgxPaginatorComponent, IgxPaginatorContentDirective } from 'igniteui-angular/paginator'; @@ -12,7 +12,6 @@ import { AsyncPipe } from '@angular/common'; selector: 'app-remote-paging-grid-sample', styleUrls: ['./remote-paging-sample.component.scss'], templateUrl: './remote-paging-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxPaginatorComponent, IgxPaginatorContentDirective, IgxPageSizeSelectorComponent, IgxPageNavigationComponent, AsyncPipe] }) export class RemotePagingGridSampleComponent implements OnInit, AfterViewInit, OnDestroy { diff --git a/src/app/grid/grid-resize-line-styling-sample/grid-resize-line-styling-sample.ts b/src/app/grid/grid-resize-line-styling-sample/grid-resize-line-styling-sample.ts index eab7709847..c80a897355 100644 --- a/src/app/grid/grid-resize-line-styling-sample/grid-resize-line-styling-sample.ts +++ b/src/app/grid/grid-resize-line-styling-sample/grid-resize-line-styling-sample.ts @@ -1,4 +1,4 @@ - import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; + import { Component, OnInit } from '@angular/core'; import { athletesData } from '../../data/athletesData'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -8,7 +8,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-resize-line-styling-sample', styleUrls: ['./grid-resize-line-styling-sample.scss'], templateUrl: './grid-resize-line-styling-sample.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent] }) diff --git a/src/app/grid/grid-resizing-sample/grid-resizing-sample.component.ts b/src/app/grid/grid-resizing-sample/grid-resizing-sample.component.ts index c8fdf90f7a..38bc81c82e 100644 --- a/src/app/grid/grid-resizing-sample/grid-resizing-sample.component.ts +++ b/src/app/grid/grid-resizing-sample/grid-resizing-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxColumnComponent } from 'igniteui-angular/grids/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { DATA } from '../../data/customers'; @@ -8,7 +8,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-resizing-sample', styleUrls: ['./grid-resizing-sample.component.scss'], templateUrl: 'grid-resizing-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent] }) diff --git a/src/app/grid/grid-row-drag-base/grid-row-drag-base.component.ts b/src/app/grid/grid-row-drag-base/grid-row-drag-base.component.ts index 5f6b461e76..84e334326b 100644 --- a/src/app/grid/grid-row-drag-base/grid-row-drag-base.component.ts +++ b/src/app/grid/grid-row-drag-base/grid-row-drag-base.component.ts @@ -1,5 +1,5 @@ /* eslint-disable @typescript-eslint/naming-convention */ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { IDropDroppedEventArgs, IgxDropDirective } from 'igniteui-angular/directives'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -16,7 +16,6 @@ enum DragIcon { selector: 'app-grid-row-drag-base-sample', styleUrls: ['./grid-row-drag-base.component.scss'], templateUrl: 'grid-row-drag-base.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxDropDirective] }) diff --git a/src/app/grid/grid-row-drag-to-grid/grid-row-drag-to-grid.component.ts b/src/app/grid/grid-row-drag-to-grid/grid-row-drag-to-grid.component.ts index 54693dcded..04f923a26e 100644 --- a/src/app/grid/grid-row-drag-to-grid/grid-row-drag-to-grid.component.ts +++ b/src/app/grid/grid-row-drag-to-grid/grid-row-drag-to-grid.component.ts @@ -1,5 +1,5 @@ /* eslint-disable @typescript-eslint/naming-convention */ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { IDropDroppedEventArgs, IgxDropDirective } from 'igniteui-angular/directives'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxColumnComponent, IgxDragIndicatorIconDirective } from 'igniteui-angular/grids/core'; @@ -17,7 +17,6 @@ enum DragIcon { selector: 'app-grid-row-drag-to-grid-sample', styleUrls: ['./grid-row-drag-to-grid.component.scss'], templateUrl: 'grid-row-drag-to-grid.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxDragIndicatorIconDirective, IgxIconComponent, IgxDropDirective] }) diff --git a/src/app/grid/grid-row-drag/grid-row-drag.component.ts b/src/app/grid/grid-row-drag/grid-row-drag.component.ts index a02819a4da..12cecffd51 100644 --- a/src/app/grid/grid-row-drag/grid-row-drag.component.ts +++ b/src/app/grid/grid-row-drag/grid-row-drag.component.ts @@ -1,5 +1,5 @@ /* eslint-disable @typescript-eslint/naming-convention */ -import { Component, ViewChildren, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChildren } from '@angular/core'; import { IgxColumnComponent, RowType } from 'igniteui-angular/grids/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxDropDirective } from 'igniteui-angular/directives'; @@ -18,7 +18,6 @@ enum HoverClassList { selector: 'app-grid-row-drag-sample', styleUrls: ['./grid-row-drag.component.scss'], templateUrl: 'grid-row-drag.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, PlanetComponent, IgxDropDirective] }) diff --git a/src/app/grid/grid-row-drag/planet/planet.component.ts b/src/app/grid/grid-row-drag/planet/planet.component.ts index 8802752f05..fc5810ad44 100644 --- a/src/app/grid/grid-row-drag/planet/planet.component.ts +++ b/src/app/grid/grid-row-drag/planet/planet.component.ts @@ -1,4 +1,4 @@ -import { ChangeDetectorRef, Component, HostBinding, HostListener, Input, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { ChangeDetectorRef, Component, HostBinding, HostListener, Input, ViewChild, inject } from '@angular/core'; import { IgxDialogComponent } from 'igniteui-angular/dialog'; import { IPlanet } from '../data'; @@ -7,7 +7,6 @@ import { IPlanet } from '../data'; selector: 'app-planet', styleUrls: ['./planet.component.scss'], templateUrl: 'planet.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxDialogComponent] }) diff --git a/src/app/grid/grid-row-editing-sample/grid-row-editing-sample.component.ts b/src/app/grid/grid-row-editing-sample/grid-row-editing-sample.component.ts index 40c3b0dea0..43b43b4da5 100644 --- a/src/app/grid/grid-row-editing-sample/grid-row-editing-sample.component.ts +++ b/src/app/grid/grid-row-editing-sample/grid-row-editing-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { DATA } from '../../data/nwindData'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxCellEditorTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -11,7 +11,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-grid-row-edit', styleUrls: [`grid-row-editing-sample.component.scss`], templateUrl: 'grid-row-editing-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellEditorTemplateDirective, IgxInputGroupComponent, FormsModule, IgxInputDirective, IgxFocusDirective] }) export class GridRowEditSampleComponent { diff --git a/src/app/grid/grid-row-editing-style/grid-row-editing-style.component.ts b/src/app/grid/grid-row-editing-style/grid-row-editing-style.component.ts index 8452d0ddb2..82f9b18ca7 100644 --- a/src/app/grid/grid-row-editing-style/grid-row-editing-style.component.ts +++ b/src/app/grid/grid-row-editing-style/grid-row-editing-style.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { DATA } from '../../data/nwindData'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxCellEditorTemplateDirective, IgxColumnComponent, IgxRowEditActionsDirective, IgxRowEditTabStopDirective, IgxRowEditTextDirective } from 'igniteui-angular/grids/core'; @@ -12,7 +12,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-grid-row-edit-style', styleUrls: [`grid-row-editing-style.component.scss`], templateUrl: 'grid-row-editing-style.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellEditorTemplateDirective, IgxInputGroupComponent, FormsModule, IgxInputDirective, IgxFocusDirective, IgxRowEditTextDirective, IgxRowEditActionsDirective, IgxIconButtonDirective, IgxRowEditTabStopDirective, IgxIconComponent] }) export class GridRowEditStyleComponent { diff --git a/src/app/grid/grid-row-pinning-drag/grid-row-pinning-drag.component.ts b/src/app/grid/grid-row-pinning-drag/grid-row-pinning-drag.component.ts index 7f14a7c9a1..740e796064 100644 --- a/src/app/grid/grid-row-pinning-drag/grid-row-pinning-drag.component.ts +++ b/src/app/grid/grid-row-pinning-drag/grid-row-pinning-drag.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IDropDroppedEventArgs, IgxDropDirective } from 'igniteui-angular/directives'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IPinningConfig, IRowDragStartEventArgs, IgxColumnComponent, IgxGridPinningActionsComponent, IgxRowDirective, RowPinningPosition, RowType } from 'igniteui-angular/grids/core'; @@ -10,7 +10,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-row-pinning-drag-sample', styleUrls: ['./grid-row-pinning-drag.component.scss'], templateUrl: 'grid-row-pinning-drag.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxDropDirective, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxActionStripComponent, IgxGridPinningActionsComponent] }) diff --git a/src/app/grid/grid-row-pinning-extra-column/grid-row-pinning-extra-column.component.ts b/src/app/grid/grid-row-pinning-extra-column/grid-row-pinning-extra-column.component.ts index 3f57ec1a1a..0f8a4c37fb 100644 --- a/src/app/grid/grid-row-pinning-extra-column/grid-row-pinning-extra-column.component.ts +++ b/src/app/grid/grid-row-pinning-extra-column/grid-row-pinning-extra-column.component.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, Component, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { AfterViewInit, Component, ViewChild, inject } from '@angular/core'; import { ColumnPinningPosition } from 'igniteui-angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxIconComponent, IgxIconService } from 'igniteui-angular/icon'; @@ -14,7 +14,6 @@ const FILTERING_ICONS_FONT_SET = 'filtering-icons'; selector: 'app-grid-row-pinning-extra-column', templateUrl: 'grid-row-pinning-extra-column.component.html', styleUrls: ['./grid-row-pinning-extra-column.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSwitchComponent, IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxIconComponent] }) diff --git a/src/app/grid/grid-row-pinning-styling/grid-row-pinning-styling.component.ts b/src/app/grid/grid-row-pinning-styling/grid-row-pinning-styling.component.ts index 1f32801ecb..3bc06d49bc 100644 --- a/src/app/grid/grid-row-pinning-styling/grid-row-pinning-styling.component.ts +++ b/src/app/grid/grid-row-pinning-styling/grid-row-pinning-styling.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IPinningConfig, IgxColumnComponent, IgxGridPinningActionsComponent, RowPinningPosition } from 'igniteui-angular/grids/core'; import { IgxActionStripComponent } from 'igniteui-angular/action-strip'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-row-pinning-styling', templateUrl: 'grid-row-pinning-styling.component.html', styleUrls: ['./grid-row-pinning-styling.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxActionStripComponent, IgxGridPinningActionsComponent] }) diff --git a/src/app/grid/grid-row-pinning/grid-row-pinning.component.ts b/src/app/grid/grid-row-pinning/grid-row-pinning.component.ts index add3d228ea..10098f6828 100644 --- a/src/app/grid/grid-row-pinning/grid-row-pinning.component.ts +++ b/src/app/grid/grid-row-pinning/grid-row-pinning.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IPinningConfig, IgxColumnComponent, IgxGridEditingActionsComponent, IgxGridPinningActionsComponent, RowPinningPosition } from 'igniteui-angular/grids/core'; import { IgxSwitchComponent } from 'igniteui-angular/switch'; @@ -10,7 +10,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-row-pinning', templateUrl: 'grid-row-pinning.component.html', styleUrls: ['./grid-row-pinning.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSwitchComponent, IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxActionStripComponent, IgxGridPinningActionsComponent, IgxGridEditingActionsComponent] }) diff --git a/src/app/grid/grid-row-reorder-sample/grid-row-reorder.ts b/src/app/grid/grid-row-reorder-sample/grid-row-reorder.ts index 8b50c78403..29070b8edc 100644 --- a/src/app/grid/grid-row-reorder-sample/grid-row-reorder.ts +++ b/src/app/grid/grid-row-reorder-sample/grid-row-reorder.ts @@ -1,4 +1,4 @@ -import { Component, QueryList, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, QueryList, ViewChild } from '@angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxColumnComponent, IgxRowDirective, RowType } from 'igniteui-angular/grids/core'; import { IgxDropDirective } from 'igniteui-angular/directives'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-row-reorder-sample', styleUrls: ['grid-row-reorder.scss'], templateUrl: 'grid-row-reorder.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxDropDirective, IgxPreventDocumentScrollDirective, IgxColumnComponent] }) export class GridRowReorderComponent { diff --git a/src/app/grid/grid-rowClasses-sample/grid-rowClasses.component.ts b/src/app/grid/grid-rowClasses-sample/grid-rowClasses.component.ts index 8a45806418..93a2c5cdad 100644 --- a/src/app/grid/grid-rowClasses-sample/grid-rowClasses.component.ts +++ b/src/app/grid/grid-rowClasses-sample/grid-rowClasses.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxColumnComponent, RowType } from 'igniteui-angular/grids/core'; import { DATA } from '../../data/nwindData'; @@ -8,7 +8,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-row-classes-sample', styleUrls: ['./grid-rowClasses.component.scss'], templateUrl: 'grid-rowClasses.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent] }) export class GridRowClassesComponent implements OnInit { diff --git a/src/app/grid/grid-rowStyles-sample/grid-rowStyles.component.html b/src/app/grid/grid-rowStyles-sample/grid-rowStyles.component.html index db1d5ae12a..4d93a6258f 100644 --- a/src/app/grid/grid-rowStyles-sample/grid-rowStyles.component.html +++ b/src/app/grid/grid-rowStyles-sample/grid-rowStyles.component.html @@ -1,6 +1,6 @@
+ [autoGenerate]="false" [allowFiltering]="true" [rowClasses]="rowClasses"> @@ -10,20 +10,14 @@ Change - -
@if (val > 0) { - + } @if (val < 0) { - + } - {{ formatNumber(val) - }} -
+ {{ formatNumber(val) }} @@ -33,18 +27,13 @@ -
@if (val > 0) { - + } @if (val < 0) { - + } - {{ formatNumber(val) - }}% -
+ {{ formatNumber(val) }}% diff --git a/src/app/grid/grid-rowStyles-sample/grid-rowStyles.component.scss b/src/app/grid/grid-rowStyles-sample/grid-rowStyles.component.scss index afdc59ca53..2e9ad92fd3 100644 --- a/src/app/grid/grid-rowStyles-sample/grid-rowStyles.component.scss +++ b/src/app/grid/grid-rowStyles-sample/grid-rowStyles.component.scss @@ -1,30 +1,18 @@ -.cellAlignSyle { - text-align: right; - float:right; -} -.cellAlignSyle > span { - float:right; -} -.up { - color: green; -} -.down { - color: red; -} -.headerAlignSyle { - text-align: right !important; -} +:host { + igx-badge { + margin-inline-end: auto; + } -.grid__wrapper { - margin: 0 auto; - padding: 16px; -} + ::ng-deep .negative-row { + $bg-color: rgb(253 243 243); -.currency-badge-container { - width: 80px; - float: right; -} + --body-column-border-color-odd: $bg-color; + --body-column-border-color-even: $bg-color; + + background: $bg-color; + --row-border-color: #FF000099; + --row-border-style: dashed; -.badge-left { - float: left; + border-block-start: 1px var(--row-border-style) var(--row-border-color); + } } diff --git a/src/app/grid/grid-rowStyles-sample/grid-rowStyles.component.ts b/src/app/grid/grid-rowStyles-sample/grid-rowStyles.component.ts index f710a991b7..a41b499836 100644 --- a/src/app/grid/grid-rowStyles-sample/grid-rowStyles.component.ts +++ b/src/app/grid/grid-rowStyles-sample/grid-rowStyles.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild, inject } from '@angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxCellHeaderTemplateDirective, IgxCellTemplateDirective, IgxColumnComponent, RowType } from 'igniteui-angular/grids/core'; import { IgxBadgeComponent } from 'igniteui-angular/badge'; @@ -12,7 +12,6 @@ import { AsyncPipe } from '@angular/common'; selector: 'app-grid-row-styles-sample', styleUrls: ['./grid-rowStyles.component.scss'], templateUrl: 'grid-rowStyles.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellHeaderTemplateDirective, IgxCellTemplateDirective, IgxBadgeComponent, AsyncPipe] }) @@ -22,10 +21,8 @@ export class GridRowStylesComponent { @ViewChild('grid1', { static: true }) public grid1: IgxGridComponent; public data: Observable; - public rowStyles = { - background: (row: RowType) => (+row.data['Change'] < 0 && +row.data['Change On Year(%)'] < 0) ? '#FF000088' : '#00000000', - border: (row: RowType) => (+row.data['Change'] < 0 && +row.data['Change On Year(%)'] < 0) ? '2px solid' : '1px solid', - 'border-color': (row: RowType) => (+row.data['Change'] < 0 && +row.data['Change On Year(%)'] < 0) ? '#FF000099' : '#E9E9E9' + public rowClasses = { + 'negative-row': (row: RowType) => +row.data['Change'] < 0 && +row.data['Change On Year(%)'] < 0 }; constructor() { diff --git a/src/app/grid/grid-sample-2/grid-sample-2.component.ts b/src/app/grid/grid-sample-2/grid-sample-2.component.ts index ffa0c103e4..d4ca4d1797 100644 --- a/src/app/grid/grid-sample-2/grid-sample-2.component.ts +++ b/src/app/grid/grid-sample-2/grid-sample-2.component.ts @@ -1,4 +1,4 @@ -import { Component, Injectable, ViewChild, OnInit, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, Injectable, ViewChild, OnInit, inject } from '@angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxCellHeaderTemplateDirective, IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -13,7 +13,6 @@ import { AsyncPipe } from '@angular/common'; selector: 'app-grid-sample', styleUrls: ['./grid-sample-2.component.scss'], templateUrl: 'grid-sample-2.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellHeaderTemplateDirective, IgxCellTemplateDirective, IgxBadgeComponent, AsyncPipe] }) diff --git a/src/app/grid/grid-sample-3/grid-sample-3.component.ts b/src/app/grid/grid-sample-3/grid-sample-3.component.ts index a7e9501e69..3a328486d9 100644 --- a/src/app/grid/grid-sample-3/grid-sample-3.component.ts +++ b/src/app/grid/grid-sample-3/grid-sample-3.component.ts @@ -1,7 +1,7 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; -import { ColumnType, IgxSummaryResult } from 'igniteui-angular/core'; +import { Component, ViewChild } from '@angular/core'; +import { ColumnType, IgxNumberSummaryOperand, IgxSummaryResult } from 'igniteui-angular/core'; +import { IgxCellHeaderTemplateDirective, IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; -import { IgxCellHeaderTemplateDirective, IgxCellTemplateDirective, IgxColumnComponent, IgxNumberSummaryOperand } from 'igniteui-angular/grids/core'; import { IgxPaginatorComponent } from 'igniteui-angular/paginator'; import { IgxIconComponent } from 'igniteui-angular/icon'; import { DATA } from '../../data/nwindData'; @@ -25,7 +25,6 @@ class MySummary { selector: 'app-grid-sample-3', styleUrls: ['./grid-sample-3.component.scss'], templateUrl: './grid-sample-3.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxPaginatorComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxCellHeaderTemplateDirective, IgxIconComponent, DatePipe] }) export class GridSample3Component { diff --git a/src/app/grid/grid-sample-4/grid-sample-4.component.ts b/src/app/grid/grid-sample-4/grid-sample-4.component.ts index 9c1c491ce5..d38aad2067 100644 --- a/src/app/grid/grid-sample-4/grid-sample-4.component.ts +++ b/src/app/grid/grid-sample-4/grid-sample-4.component.ts @@ -1,10 +1,10 @@ -import { ChangeDetectorRef, Component, TemplateRef, ViewChild, OnInit, AfterViewInit, OnDestroy, inject, ChangeDetectionStrategy } from '@angular/core'; +import { ChangeDetectorRef, Component, TemplateRef, ViewChild, OnInit, AfterViewInit, OnDestroy, inject } from '@angular/core'; import { IgxCellHeaderTemplateDirective, IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxBadgeComponent } from 'igniteui-angular/badge'; import { debounceTime } from 'rxjs/operators'; import { RemoteServiceVirt } from '../../services/remoteVirtualization.service'; -import { AsyncPipe } from '@angular/common'; +import { AsyncPipe, NgTemplateOutlet } from '@angular/common'; import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scroll.directive'; @Component({ @@ -12,8 +12,7 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-remote-virtualization-sample', styleUrls: ['grid-sample-4.component.scss'], templateUrl: 'grid-sample-4.component.html', - changeDetection: ChangeDetectionStrategy.Eager, - imports: [IgxCellTemplateDirective, IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellHeaderTemplateDirective, IgxBadgeComponent, AsyncPipe] + imports: [IgxCellTemplateDirective, IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellHeaderTemplateDirective, IgxBadgeComponent, AsyncPipe, NgTemplateOutlet] }) export class GridRemoteVirtualizationSampleComponent implements OnInit, AfterViewInit, OnDestroy{ diff --git a/src/app/grid/grid-sample-5/grid-sample-5.component.ts b/src/app/grid/grid-sample-5/grid-sample-5.component.ts index 0e91eca113..19fbe2f91a 100644 --- a/src/app/grid/grid-sample-5/grid-sample-5.component.ts +++ b/src/app/grid/grid-sample-5/grid-sample-5.component.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, ChangeDetectorRef, Component, ViewChild, OnInit, inject, ChangeDetectionStrategy } from '@angular/core'; +import { AfterViewInit, ChangeDetectorRef, Component, ViewChild, OnInit, inject } from '@angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxCellHeaderTemplateDirective, IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; import { IgxBadgeComponent } from 'igniteui-angular/badge'; @@ -11,7 +11,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-remote-virtualization-sample', styleUrls: ['grid-sample-5.component.scss'], templateUrl: 'grid-sample-5.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellHeaderTemplateDirective, IgxCellTemplateDirective, IgxBadgeComponent] }) diff --git a/src/app/grid/grid-sample-pinning-both-sides/grid-toolbar-pinning-both-sides.component.ts b/src/app/grid/grid-sample-pinning-both-sides/grid-toolbar-pinning-both-sides.component.ts index 37ff3080df..11f93364cb 100644 --- a/src/app/grid/grid-sample-pinning-both-sides/grid-toolbar-pinning-both-sides.component.ts +++ b/src/app/grid/grid-sample-pinning-both-sides/grid-toolbar-pinning-both-sides.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ViewEncapsulation, OnInit, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild, ViewEncapsulation, OnInit, inject } from '@angular/core'; import { NgClass } from '@angular/common'; import { IPinningConfig, IgxColumnComponent, IgxGridToolbarActionsComponent, IgxGridToolbarComponent } from 'igniteui-angular/grids/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; @@ -13,7 +13,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-sample', styleUrls: ['grid-toolbar-pinning-both-sides.component.scss'], templateUrl: 'grid-toolbar-pinning-both-sides.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [ NgClass, IgxGridComponent, diff --git a/src/app/grid/grid-sample-pinning-styling/grid-pinning-styling.component.ts b/src/app/grid/grid-sample-pinning-styling/grid-pinning-styling.component.ts index 0a3fd5d794..603915ea84 100644 --- a/src/app/grid/grid-sample-pinning-styling/grid-pinning-styling.component.ts +++ b/src/app/grid/grid-sample-pinning-styling/grid-pinning-styling.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, OnInit, inject, ChangeDetectionStrategy } from "@angular/core"; +import { Component, ViewChild, OnInit, inject } from "@angular/core"; import { IgxCellHeaderTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxIconComponent, IgxIconService } from 'igniteui-angular/icon'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from "../../directives/prevent-scro selector: "app-grid-sample", styleUrls: ["grid-pinning-styling.component.scss"], templateUrl: "grid-pinning-styling.component.html", - changeDetection: ChangeDetectionStrategy.Eager, imports: [ IgxGridComponent, IgxPreventDocumentScrollDirective, diff --git a/src/app/grid/grid-sample-pinning/grid-pinning.component.ts b/src/app/grid/grid-sample-pinning/grid-pinning.component.ts index 583965ef53..832b7bf056 100644 --- a/src/app/grid/grid-sample-pinning/grid-pinning.component.ts +++ b/src/app/grid/grid-sample-pinning/grid-pinning.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ViewEncapsulation, OnInit, AfterViewInit, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild, ViewEncapsulation, OnInit, AfterViewInit, inject } from '@angular/core'; import { IgxCellHeaderTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxIconComponent, IgxIconService } from 'igniteui-angular/icon'; @@ -15,7 +15,6 @@ const FILTERING_ICONS_FONT_SET = 'filtering-icons'; selector: 'app-grid-sample', styleUrls: ['grid-pinning.component.scss'], templateUrl: 'grid-pinning.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellHeaderTemplateDirective, IgxIconComponent] }) diff --git a/src/app/grid/grid-sample-pinning/grid-toolbar-pinning.component.ts b/src/app/grid/grid-sample-pinning/grid-toolbar-pinning.component.ts index 4ee180e13e..265b9ed7c0 100644 --- a/src/app/grid/grid-sample-pinning/grid-toolbar-pinning.component.ts +++ b/src/app/grid/grid-sample-pinning/grid-toolbar-pinning.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ViewEncapsulation, OnInit, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild, ViewEncapsulation, OnInit, inject } from '@angular/core'; import { IgxColumnComponent, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarPinningComponent } from 'igniteui-angular/grids/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { DATA } from '../../data/customers'; @@ -12,7 +12,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-sample', styleUrls: ['grid-toolbar-pinning.component.scss'], templateUrl: 'grid-toolbar-pinning.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [NgClass, IgxGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxGridToolbarActionsComponent, IgxGridToolbarPinningComponent, IgxColumnComponent] }) diff --git a/src/app/grid/grid-sample-right-pinning/grid-right-pinning.component.ts b/src/app/grid/grid-sample-right-pinning/grid-right-pinning.component.ts index 04c362e3d1..b3fb3b5ef0 100644 --- a/src/app/grid/grid-sample-right-pinning/grid-right-pinning.component.ts +++ b/src/app/grid/grid-sample-right-pinning/grid-right-pinning.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ViewEncapsulation, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild, ViewEncapsulation, OnInit } from '@angular/core'; import { ColumnPinningPosition } from 'igniteui-angular/core'; import { IPinningConfig, IgxCellHeaderTemplateDirective, IgxCellTemplateDirective, IgxColumnComponent, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarPinningComponent } from 'igniteui-angular/grids/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; @@ -15,7 +15,6 @@ import { DatePipe } from '@angular/common'; selector: 'app-grid-sample', styleUrls: ['grid-right-pinning.component.scss'], templateUrl: 'grid-right-pinning.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxGridToolbarComponent, IgxGridToolbarActionsComponent, IgxGridToolbarPinningComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxTooltipTargetDirective, IgxTooltipDirective, IgxAvatarComponent, IgxCellHeaderTemplateDirective, IgxIconComponent, DatePipe] }) diff --git a/src/app/grid/grid-sample-selection-template-excel/grid-sample-selection-template-excel.component.ts b/src/app/grid/grid-sample-selection-template-excel/grid-sample-selection-template-excel.component.ts index 158be291b6..c3b518139d 100644 --- a/src/app/grid/grid-sample-selection-template-excel/grid-sample-selection-template-excel.component.ts +++ b/src/app/grid/grid-sample-selection-template-excel/grid-sample-selection-template-excel.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { DATA } from '../../data/customers'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxPaginatorComponent } from 'igniteui-angular/paginator'; @@ -10,7 +10,6 @@ import { NgClass } from '@angular/common'; selector: 'app-grid-selection-template-excel', styleUrls: ['./grid-sample-selection-template-excel.component.scss'], templateUrl: 'grid-sample-selection-template-excel.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxPaginatorComponent, IgxColumnComponent, IgxHeadSelectorDirective, NgClass, IgxRowSelectorDirective] }) diff --git a/src/app/grid/grid-sample-selection-template-numbers/grid-sample-selection-template-numbers.component.ts b/src/app/grid/grid-sample-selection-template-numbers/grid-sample-selection-template-numbers.component.ts index 01d8f438a1..057ddddaba 100644 --- a/src/app/grid/grid-sample-selection-template-numbers/grid-sample-selection-template-numbers.component.ts +++ b/src/app/grid/grid-sample-selection-template-numbers/grid-sample-selection-template-numbers.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { DATA } from '../../data/customers'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxPaginatorComponent } from 'igniteui-angular/paginator'; @@ -10,7 +10,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-selection-template-numbers', styleUrls: ['./grid-sample-selection-template-numbers.component.scss'], templateUrl: 'grid-sample-selection-template-numbers.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxPaginatorComponent, IgxColumnComponent, IgxHeadSelectorDirective, IgxRowSelectorDirective, IgxCheckboxComponent] }) diff --git a/src/app/grid/grid-sample-selection/grid-selection.component.ts b/src/app/grid/grid-sample-selection/grid-selection.component.ts index 460a1d9674..2e4df196c9 100644 --- a/src/app/grid/grid-sample-selection/grid-selection.component.ts +++ b/src/app/grid/grid-sample-selection/grid-selection.component.ts @@ -1,4 +1,4 @@ -import { Component, ElementRef, OnInit, Renderer2, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ElementRef, OnInit, Renderer2, ViewChild, inject } from '@angular/core'; import { GridSelectionMode, IRowSelectionEventArgs, IgxCellHeaderTemplateDirective, IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; @@ -21,7 +21,6 @@ import { AsyncPipe } from '@angular/common'; selector: 'grid-sample', styleUrls: ['./grid-selection.component.scss'], templateUrl: 'grid-selection.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSwitchComponent, FormsModule, IgxButtonGroupComponent, IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellHeaderTemplateDirective, IgxCellTemplateDirective, IgxBadgeComponent, IgxButtonDirective, IgxIconComponent, IgxSnackbarComponent, AsyncPipe] }) diff --git a/src/app/grid/grid-save-state/about.component.ts b/src/app/grid/grid-save-state/about.component.ts index ebb568bd2d..3cf5752d36 100644 --- a/src/app/grid/grid-save-state/about.component.ts +++ b/src/app/grid/grid-save-state/about.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxButtonDirective } from 'igniteui-angular/directives'; import { RouterLink } from '@angular/router'; @Component({ selector: 'app-about', templateUrl: './about.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, RouterLink] }) export class AboutComponent { diff --git a/src/app/grid/grid-save-state/grid-state.component.ts b/src/app/grid/grid-save-state/grid-state.component.ts index 6d0373454e..d5e199ca82 100644 --- a/src/app/grid/grid-save-state/grid-state.component.ts +++ b/src/app/grid/grid-save-state/grid-state.component.ts @@ -1,8 +1,8 @@ /* eslint-disable max-len */ -import { Component, OnInit, ViewChild, ViewChildren, QueryList, AfterViewInit, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild, ViewChildren, QueryList, AfterViewInit, inject } from '@angular/core'; import { NavigationStart, Router, RouterLink } from '@angular/router'; -import { FilteringExpressionsTree, FilteringLogic, IgxSummaryResult } from 'igniteui-angular/core'; -import { GridFeatures, IGridState, IGridStateOptions, IgxColumnComponent, IgxGridStateDirective, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent, IgxNumberSummaryOperand } from 'igniteui-angular/grids/core'; +import { FilteringExpressionsTree, FilteringLogic, IgxNumberSummaryOperand, IgxSummaryResult } from 'igniteui-angular/core'; +import { GridFeatures, IGridState, IGridStateOptions, IgxColumnComponent, IgxGridStateDirective, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent } from 'igniteui-angular/grids/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxCheckboxComponent } from 'igniteui-angular/checkbox'; import { IgxButtonDirective } from 'igniteui-angular/directives'; @@ -31,7 +31,6 @@ class MySummary { selector: 'app-grid', styleUrls: ['./grid-state.component.scss'], templateUrl: './grid-state.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxIconComponent, RouterLink, IgxCheckboxComponent, IgxGridComponent, IgxPreventDocumentScrollDirective, IgxGridStateDirective, IgxPaginatorComponent, IgxGridToolbarComponent, IgxGridToolbarActionsComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent, IgxColumnComponent] }) @@ -134,7 +133,7 @@ export class GridSaveStateComponent implements OnInit, AfterViewInit { public resetGridState() { const grid: IgxGridComponent = this.grid; - const pagingState = {index: 0, recordsPerPage: 15, metadata: { countPages: 3, countRecords: this.localData.length}}; + const pagingState = { index: 0, recordsPerPage: 15, metadata: { countPages: 3, countRecords: this.localData.length, error: 0 } }; grid.pagingState = pagingState; grid.filteringExpressionsTree = new FilteringExpressionsTree(FilteringLogic.And); grid.advancedFilteringExpressionsTree = new FilteringExpressionsTree(FilteringLogic.And); diff --git a/src/app/grid/grid-search-sample/grid-search-sample.component.ts b/src/app/grid/grid-search-sample/grid-search-sample.component.ts index 098ce7c0ec..e4624de42c 100644 --- a/src/app/grid/grid-search-sample/grid-search-sample.component.ts +++ b/src/app/grid/grid-search-sample/grid-search-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxInputDirective, IgxInputGroupComponent, IgxPrefixDirective, IgxSuffixDirective } from 'igniteui-angular/input-group'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -14,7 +14,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-search-sample', styleUrls: ['./grid-search-sample.component.scss'], templateUrl: './grid-search-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxInputGroupComponent, IgxPrefixDirective, IgxIconComponent, FormsModule, IgxInputDirective, IgxSuffixDirective, IgxChipsAreaComponent, IgxChipComponent, IgxIconButtonDirective, IgxRippleDirective, IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent] }) export class GridSearchSampleComponent implements OnInit { diff --git a/src/app/grid/grid-select/grid-select-sample.component.ts b/src/app/grid/grid-select/grid-select-sample.component.ts index 6a635bb8b8..5683c8c0e4 100644 --- a/src/app/grid/grid-select/grid-select-sample.component.ts +++ b/src/app/grid/grid-select/grid-select-sample.component.ts @@ -1,5 +1,5 @@ import { Character } from './characters'; -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxCellEditorTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; import { IgxSelectComponent, IgxSelectItemComponent } from 'igniteui-angular/select'; @@ -12,7 +12,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-grid-select-sample', styleUrls: ['./grid-select-sample.component.scss'], templateUrl: './grid-select-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxColumnComponent, IgxCellEditorTemplateDirective, IgxSelectComponent, FormsModule, IgxFocusDirective, IgxSelectItemComponent] }) export class GridSelectComponent implements OnInit { diff --git a/src/app/grid/grid-sorting-indicators/grid-sorting-indicators.component.ts b/src/app/grid/grid-sorting-indicators/grid-sorting-indicators.component.ts index 5aa5360ab8..cf56b31174 100644 --- a/src/app/grid/grid-sorting-indicators/grid-sorting-indicators.component.ts +++ b/src/app/grid/grid-sorting-indicators/grid-sorting-indicators.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, AfterViewInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild, AfterViewInit } from '@angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { DefaultSortingStrategy } from 'igniteui-angular/core'; import { IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -10,7 +10,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-sorting-indicators', templateUrl: './grid-sorting-indicators.component.html', styleUrls: ['./grid-sorting-indicators.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent] }) export class GridSortingIndicatorsComponent implements OnInit, AfterViewInit { diff --git a/src/app/grid/grid-sorting-sample/grid-sorting-sample.component.ts b/src/app/grid/grid-sorting-sample/grid-sorting-sample.component.ts index 0ccaf70de6..16bd2ca8f5 100644 --- a/src/app/grid/grid-sorting-sample/grid-sorting-sample.component.ts +++ b/src/app/grid/grid-sorting-sample/grid-sorting-sample.component.ts @@ -1,5 +1,5 @@ /* eslint-disable @typescript-eslint/naming-convention */ -import { Component, OnInit, AfterViewInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, AfterViewInit, ViewChild } from '@angular/core'; import { DefaultSortingStrategy, ISortingOptions, SortingDirection } from 'igniteui-angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxCellTemplateDirective, IgxColumnComponent, IgxGridToolbarActionsComponent, IgxGridToolbarComponent } from 'igniteui-angular/grids/core'; @@ -15,7 +15,6 @@ import { UpperCasePipe } from '@angular/common'; selector: 'app-grid-sample', styleUrls: ['./grid-sorting-sample.component.scss'], templateUrl: 'grid-sorting-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxButtonDirective, IgxGridToolbarActionsComponent, IgxSimpleComboComponent, FormsModule, IgxComboClearIconDirective, IgxComboItemDirective, IgxColumnComponent, IgxCellTemplateDirective, UpperCasePipe] }) @@ -37,7 +36,7 @@ export class SortingSampleComponent implements OnInit, AfterViewInit { public ngOnInit(): void { this.data = DATA; } - + public ngAfterViewInit(): void { this.grid1.sortingExpressions = [ { diff --git a/src/app/grid/grid-sorting-styling/grid-sorting-styling.component.ts b/src/app/grid/grid-sorting-styling/grid-sorting-styling.component.ts index b2e2dbd537..23d152abc5 100644 --- a/src/app/grid/grid-sorting-styling/grid-sorting-styling.component.ts +++ b/src/app/grid/grid-sorting-styling/grid-sorting-styling.component.ts @@ -1,5 +1,5 @@ /* eslint-disable @typescript-eslint/naming-convention */ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { DefaultSortingStrategy, SortingDirection } from 'igniteui-angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxSelectComponent, IgxSelectItemComponent } from 'igniteui-angular/select'; @@ -19,7 +19,6 @@ enum TYPE { selector: 'app-grid-sorting-styling', styleUrls: ['./grid-sorting-styling.component.scss'], templateUrl: 'grid-sorting-styling.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxSelectComponent, FormsModule, IgxLabelDirective, IgxSelectItemComponent, IgxColumnComponent, IgxCellTemplateDirective] }) diff --git a/src/app/grid/grid-state-persistence-sample/grid-state-persistance-sample.component.ts b/src/app/grid/grid-state-persistence-sample/grid-state-persistance-sample.component.ts index cc24c436e6..3ab7ca515e 100644 --- a/src/app/grid/grid-state-persistence-sample/grid-state-persistance-sample.component.ts +++ b/src/app/grid/grid-state-persistence-sample/grid-state-persistance-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, TemplateRef, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, TemplateRef, ViewChild, inject } from '@angular/core'; import { IGridStateOptions, IgxCellHeaderTemplateDirective, IgxCellTemplateDirective, IgxColumnComponent, IgxGridStateDirective } from 'igniteui-angular/grids/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; @@ -17,7 +17,6 @@ import { AsyncPipe } from '@angular/common'; selector: 'app-grid-state-persistance-sample', styleUrls: ['./grid-state-persistance-sample.component.scss'], templateUrl: 'grid-state-persistance-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxIconComponent, IgxGridComponent, IgxPreventDocumentScrollDirective, IgxGridStateDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxCellHeaderTemplateDirective, IgxBadgeComponent, AsyncPipe] }) @@ -42,7 +41,7 @@ export class GridStatePersistenceSampleComponent { @ViewChild('startY', { static: true }) public startYTemplate: TemplateRef; @ViewChild('changeOnYear', { static: true }) public changeOnYearTemplate: TemplateRef; @ViewChild('changePercentage', { static: true }) public changePercentageTemplate: TemplateRef; - + public data: Observable; public customStrategy = NoopSortingStrategy.instance(); public options: IGridStateOptions = { diff --git a/src/app/grid/grid-summary-export/grid-summary-export.component.ts b/src/app/grid/grid-summary-export/grid-summary-export.component.ts index 57248a25e2..108d0d1480 100644 --- a/src/app/grid/grid-summary-export/grid-summary-export.component.ts +++ b/src/app/grid/grid-summary-export/grid-summary-export.component.ts @@ -1,14 +1,7 @@ -import { Component, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; -import { ColumnType, IgxSummaryResult } from 'igniteui-angular/core'; +import { Component, ViewChild, inject } from '@angular/core'; +import { ColumnType, IgxNumberSummaryOperand, IgxSummaryResult } from 'igniteui-angular/core'; +import { IgxCellHeaderTemplateDirective, IgxCellTemplateDirective, IgxColumnComponent, IgxExcelExporterOptions, IgxExcelExporterService } from 'igniteui-angular/grids/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; -import { - IgxCellHeaderTemplateDirective, - IgxCellTemplateDirective, - IgxColumnComponent, - IgxNumberSummaryOperand, - IgxExcelExporterOptions, - IgxExcelExporterService -} from 'igniteui-angular/grids/core'; import { IgxButtonDirective } from 'igniteui-angular/directives'; import { IgxIconComponent } from 'igniteui-angular/icon'; import { DATA } from '../../data/nwindData'; @@ -32,7 +25,6 @@ class MySummary { selector: 'app-grid-summary-export', styleUrls: ['./grid-summary-export.component.scss'], templateUrl: './grid-summary-export.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxCellHeaderTemplateDirective, IgxIconComponent, DatePipe] }) export class GridSummaryExportComponent { diff --git a/src/app/grid/grid-summary-formatter/grid-summary-formatter.component.ts b/src/app/grid/grid-summary-formatter/grid-summary-formatter.component.ts index 9e009b192a..2c1ed16813 100644 --- a/src/app/grid/grid-summary-formatter/grid-summary-formatter.component.ts +++ b/src/app/grid/grid-summary-formatter/grid-summary-formatter.component.ts @@ -1,8 +1,8 @@ import { DatePipe } from '@angular/common'; -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; -import { IgxCellTemplateDirective, IgxColumnComponent, IgxDateSummaryOperand, IgxSummaryOperand } from 'igniteui-angular/grids/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; +import { IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; +import { IgxDateSummaryOperand, IgxSummaryOperand, IgxSummaryResult } from 'igniteui-angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; -import { IgxSummaryResult } from 'igniteui-angular/core'; import { DATA } from '../../data/nwindData'; import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scroll.directive'; @@ -10,7 +10,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-summary-formatter', styleUrls: ['./grid-summary-formatter.component.scss'], templateUrl: './grid-summary-formatter.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective] }) diff --git a/src/app/grid/grid-summary-template/grid-summary-template.component.ts b/src/app/grid/grid-summary-template/grid-summary-template.component.ts index 03ae19bcf5..af9989cbb1 100644 --- a/src/app/grid/grid-summary-template/grid-summary-template.component.ts +++ b/src/app/grid/grid-summary-template/grid-summary-template.component.ts @@ -1,6 +1,6 @@ -import { Component, HostBinding, OnInit, ChangeDetectionStrategy } from '@angular/core'; -import { IgxColumnComponent, IgxNumberSummaryOperand, IgxSummaryTemplateDirective } from 'igniteui-angular/grids/core'; -import { IgxSummaryResult } from 'igniteui-angular/core'; +import { Component, HostBinding, OnInit } from '@angular/core'; +import { IgxColumnComponent, IgxSummaryTemplateDirective } from 'igniteui-angular/grids/core'; +import { IgxNumberSummaryOperand, IgxSummaryResult } from 'igniteui-angular/core'; import { IgxInputDirective, IgxInputGroupComponent, IgxLabelDirective } from 'igniteui-angular/input-group'; import { IgxSwitchComponent } from 'igniteui-angular/switch'; import { IgxButtonGroupComponent } from 'igniteui-angular/button-group'; @@ -39,7 +39,6 @@ class DiscontinuedSummary { selector: 'app-grid-summary-template', styleUrls: ['./grid-summary-template.component.scss'], templateUrl: './grid-summary-template.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxInputGroupComponent, IgxLabelDirective, FormsModule, IgxInputDirective, IgxSwitchComponent, IgxButtonGroupComponent, IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxSummaryTemplateDirective] }) export class GridSummaryTemplateComponent implements OnInit { diff --git a/src/app/grid/grid-toolbar-sample/grid-toolbar-sample-1.component.ts b/src/app/grid/grid-toolbar-sample/grid-toolbar-sample-1.component.ts index 965098a80a..783b49f9a5 100644 --- a/src/app/grid/grid-toolbar-sample/grid-toolbar-sample-1.component.ts +++ b/src/app/grid/grid-toolbar-sample/grid-toolbar-sample-1.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { athletesData } from '../../data/athletesData'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxCellTemplateDirective, IgxColumnComponent, IgxGridToolbarActionsComponent, IgxGridToolbarAdvancedFilteringComponent, IgxGridToolbarComponent, IgxGridToolbarExporterComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent, IgxGridToolbarTitleComponent } from 'igniteui-angular/grids/core'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-toolbar-sample-1', styleUrls: ['./grid-toolbar-sample-1.component.scss'], templateUrl: './grid-toolbar-sample-1.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxGridToolbarTitleComponent, IgxGridToolbarActionsComponent, IgxGridToolbarAdvancedFilteringComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent, IgxGridToolbarExporterComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxAvatarComponent] }) export class GridToolbarSample1Component { diff --git a/src/app/grid/grid-toolbar-sample/grid-toolbar-sample-2.component.ts b/src/app/grid/grid-toolbar-sample/grid-toolbar-sample-2.component.ts index 9538fee3c1..7e789b4256 100644 --- a/src/app/grid/grid-toolbar-sample/grid-toolbar-sample-2.component.ts +++ b/src/app/grid/grid-toolbar-sample/grid-toolbar-sample-2.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { AbsoluteScrollStrategy, AutoPositionStrategy, GlobalPositionStrategy } from 'igniteui-angular/core'; import { IgxInputDirective, IgxInputGroupComponent, IgxLabelDirective } from 'igniteui-angular/input-group'; import { IgxSwitchComponent } from 'igniteui-angular/switch'; @@ -15,7 +15,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-toolbar-sample-2', styleUrls: ['./grid-toolbar-sample-2.component.scss'], templateUrl: './grid-toolbar-sample-2.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxInputGroupComponent, IgxLabelDirective, FormsModule, IgxInputDirective, IgxSwitchComponent, IgxGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxGridToolbarTitleComponent, IgxGridToolbarActionsComponent, IgxGridToolbarAdvancedFilteringComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent, IgxGridToolbarExporterComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxAvatarComponent] }) export class GridToolbarSample2Component { diff --git a/src/app/grid/grid-toolbar-sample/grid-toolbar-sample-3.component.ts b/src/app/grid/grid-toolbar-sample/grid-toolbar-sample-3.component.ts index 956a70f828..dae30a5416 100644 --- a/src/app/grid/grid-toolbar-sample/grid-toolbar-sample-3.component.ts +++ b/src/app/grid/grid-toolbar-sample/grid-toolbar-sample-3.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { CsvFileTypes, IColumnExportingEventArgs, @@ -22,7 +22,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-toolbar-sample-3', styleUrls: ['./grid-toolbar-sample-3.component.scss'], templateUrl: './grid-toolbar-sample-3.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxGridToolbarTitleComponent, IgxGridToolbarActionsComponent, IgxGridToolbarExporterComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxAvatarComponent] }) export class GridToolbarSample3Component { diff --git a/src/app/grid/grid-toolbar-sample/grid-toolbar-sample-4.component.ts b/src/app/grid/grid-toolbar-sample/grid-toolbar-sample-4.component.ts index 2fc9bf0091..55caad4af3 100644 --- a/src/app/grid/grid-toolbar-sample/grid-toolbar-sample-4.component.ts +++ b/src/app/grid/grid-toolbar-sample/grid-toolbar-sample-4.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { athletesData } from '../../data/athletesData'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxCellTemplateDirective, IgxColumnComponent, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarExporterComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent, IgxGridToolbarTitleComponent } from 'igniteui-angular/grids/core'; @@ -11,7 +11,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-toolbar-sample-4', styleUrls: ['./grid-toolbar-sample-4.component.scss'], templateUrl: './grid-toolbar-sample-4.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxGridToolbarTitleComponent, IgxGridToolbarActionsComponent, IgxButtonDirective, IgxRippleDirective, IgxIconComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent, IgxGridToolbarExporterComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxAvatarComponent] }) export class GridToolbarSample4Component { diff --git a/src/app/grid/grid-toolbar-style/grid-toolbar-style.component.ts b/src/app/grid/grid-toolbar-style/grid-toolbar-style.component.ts index 4bf8a4e7da..981dbbd4a5 100644 --- a/src/app/grid/grid-toolbar-style/grid-toolbar-style.component.ts +++ b/src/app/grid/grid-toolbar-style/grid-toolbar-style.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { athletesData } from '../../data/athletesData'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxCellTemplateDirective, IgxColumnComponent, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarExporterComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent, IgxGridToolbarTitleComponent } from 'igniteui-angular/grids/core'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-toolbar-style', styleUrls: ['./grid-toolbar-style.component.scss'], templateUrl: './grid-toolbar-style.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxGridToolbarTitleComponent, IgxGridToolbarActionsComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent, IgxGridToolbarExporterComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxAvatarComponent] }) export class GridToolbarStyleComponent { diff --git a/src/app/grid/grid-validation-style/grid-validation-style.component.ts b/src/app/grid/grid-validation-style/grid-validation-style.component.ts index 652f111e5d..89c22dfaed 100644 --- a/src/app/grid/grid-validation-style/grid-validation-style.component.ts +++ b/src/app/grid/grid-validation-style/grid-validation-style.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { DATA } from '../../data/nwindData'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxCellValidationErrorDirective, IgxColumnComponent, IgxColumnRequiredValidatorDirective, RowType } from 'igniteui-angular/grids/core'; @@ -9,7 +9,6 @@ import { NgTemplateOutlet } from '@angular/common'; selector: 'app-grid-validation-style', styleUrls: [`grid-validation-style.component.scss`], templateUrl: 'grid-validation-style.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxColumnRequiredValidatorDirective, IgxCellValidationErrorDirective, NgTemplateOutlet] }) export class GridValidationStyleComponent { diff --git a/src/app/grid/grid-validator-service-cross-field/grid-validator-service-cross-field.component.ts b/src/app/grid/grid-validator-service-cross-field/grid-validator-service-cross-field.component.ts index ec25a15fbe..9c3dd3b771 100644 --- a/src/app/grid/grid-validator-service-cross-field/grid-validator-service-cross-field.component.ts +++ b/src/app/grid/grid-validator-service-cross-field/grid-validator-service-cross-field.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { AbstractControl, FormGroup, ValidationErrors, ValidatorFn, FormsModule } from '@angular/forms'; import { CellType, IGridEditEventArgs, IGridFormGroupCreatedEventArgs, IgxCellTemplateDirective, IgxCellValidationErrorDirective, IgxColumnComponent, IgxColumnEmailValidatorDirective, IgxColumnMinValidatorDirective, IgxColumnRequiredValidatorDirective } from 'igniteui-angular/grids/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; @@ -12,7 +12,6 @@ import { NgTemplateOutlet, DatePipe } from '@angular/common'; selector: 'app-grid-validator-service-cross-field', styleUrls: ['./grid-validator-service-cross-field.component.scss'], templateUrl: './grid-validator-service-cross-field.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSwitchComponent, FormsModule, IgxGridComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxAvatarComponent, IgxColumnRequiredValidatorDirective, IgxColumnEmailValidatorDirective, IgxCellValidationErrorDirective, NgTemplateOutlet, IgxColumnMinValidatorDirective, IgxTooltipTargetDirective, IgxTooltipDirective, IgxButtonDirective, DatePipe] }) export class GridValidatorServiceCrossFieldComponent { diff --git a/src/app/grid/grid-validator-service-extended/grid-validator-service-extended.component.ts b/src/app/grid/grid-validator-service-extended/grid-validator-service-extended.component.ts index 8d1616c352..60fd9e46a7 100644 --- a/src/app/grid/grid-validator-service-extended/grid-validator-service-extended.component.ts +++ b/src/app/grid/grid-validator-service-extended/grid-validator-service-extended.component.ts @@ -1,5 +1,5 @@ -import { Component, Directive, Input, ViewChild, ChangeDetectionStrategy } from '@angular/core'; -import { AbstractControl, FormGroup, NG_VALIDATORS, ValidationErrors, ValidatorFn, Validators } from '@angular/forms'; +import { Component, Directive, forwardRef, Input, ViewChild } from '@angular/core'; +import { AbstractControl, NG_VALIDATORS, ValidationErrors, ValidatorFn, Validators } from '@angular/forms'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IGridFormGroupCreatedEventArgs, IgxCellTemplateDirective, IgxCellValidationErrorDirective, IgxColumnComponent, IgxColumnEmailValidatorDirective, IgxColumnMinValidatorDirective, IgxColumnRequiredValidatorDirective } from 'igniteui-angular/grids/core'; import { IgxAvatarComponent } from 'igniteui-angular/avatar'; @@ -16,7 +16,7 @@ export function phoneFormatValidator(phoneReg: RegExp): ValidatorFn { @Directive({ selector: '[phoneFormat]', - providers: [{ provide: NG_VALIDATORS, useExisting: PhoneFormatDirective, multi: true }] + providers: [{ provide: NG_VALIDATORS, useExisting: forwardRef(() => PhoneFormatDirective), multi: true }] }) export class PhoneFormatDirective extends Validators { @Input('phoneFormat') @@ -32,7 +32,6 @@ export class PhoneFormatDirective extends Validators { selector: 'app-grid-validator-service-extended', styleUrls: ['./grid-validator-service-extended.component.scss'], templateUrl: './grid-validator-service-extended.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxAvatarComponent, IgxColumnRequiredValidatorDirective, IgxColumnEmailValidatorDirective, PhoneFormatDirective, IgxCellValidationErrorDirective, NgTemplateOutlet, IgxColumnMinValidatorDirective, IgxButtonDirective, DatePipe] }) export class GridValidatorServiceExtendedComponent { diff --git a/src/app/grid/grid-validator-service/grid-validator-service.component.ts b/src/app/grid/grid-validator-service/grid-validator-service.component.ts index 1b71dc891a..0738ea2a24 100644 --- a/src/app/grid/grid-validator-service/grid-validator-service.component.ts +++ b/src/app/grid/grid-validator-service/grid-validator-service.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { employeesData } from '../../data/employeesData'; import { IgxSwitchComponent } from 'igniteui-angular/switch'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; @@ -11,7 +11,6 @@ import { DatePipe } from '@angular/common'; selector: 'app-grid-validator-service', styleUrls: ['./grid-validator-service.component.scss'], templateUrl: './grid-validator-service.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSwitchComponent, FormsModule, IgxGridComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxAvatarComponent, IgxColumnRequiredValidatorDirective, IgxColumnEmailValidatorDirective, IgxColumnMinValidatorDirective, DatePipe] }) export class GridValidatorServiceComponent { diff --git a/src/app/grid/grid-with-rating/grid-with-rating.component.ts b/src/app/grid/grid-with-rating/grid-with-rating.component.ts index bb927986b7..871ae0fa0b 100644 --- a/src/app/grid/grid-with-rating/grid-with-rating.component.ts +++ b/src/app/grid/grid-with-rating/grid-with-rating.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxToastComponent } from 'igniteui-angular/toast'; import { CellType, IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; @@ -14,7 +14,6 @@ defineComponents(IgcRatingComponent); selector: 'app-grid-rating-sample', styleUrls: ['./grid-with-rating.component.scss'], templateUrl: 'grid-with-rating.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgcFormControlDirective, FormsModule, IgxToastComponent] }) export class GridWithRatingComponent implements OnInit { diff --git a/src/app/grid/multi-column-header-template/multi-column-header-template.ts b/src/app/grid/multi-column-header-template/multi-column-header-template.ts index af7aa5bf42..0b14ff1866 100644 --- a/src/app/grid/multi-column-header-template/multi-column-header-template.ts +++ b/src/app/grid/multi-column-header-template/multi-column-header-template.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { GridSelectionMode, IgxColumnComponent, IgxColumnGroupComponent } from 'igniteui-angular/grids/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-multi-column-header-template', styleUrls: ['multi-column-header-template.scss'], templateUrl: 'multi-column-header-template.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxIconComponent, IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxColumnGroupComponent] }) export class GridMultiColumnHeaderTemplateComponent { diff --git a/src/app/grid/multi-column-headers-export/multi-column-headers-export.component.ts b/src/app/grid/multi-column-headers-export/multi-column-headers-export.component.ts index 91a5f49b69..84648c23f2 100644 --- a/src/app/grid/multi-column-headers-export/multi-column-headers-export.component.ts +++ b/src/app/grid/multi-column-headers-export/multi-column-headers-export.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { IgxColumnComponent, IgxColumnGroupComponent, IgxExporterEvent, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarExporterComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent } from 'igniteui-angular/grids/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxSwitchComponent } from 'igniteui-angular/switch'; @@ -10,7 +10,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-multi-column-headers-export', styleUrls: ['multi-column-headers-export.component.scss'], templateUrl: 'multi-column-headers-export.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxGridToolbarActionsComponent, IgxSwitchComponent, FormsModule, IgxGridToolbarPinningComponent, IgxGridToolbarHidingComponent, IgxGridToolbarExporterComponent, IgxColumnComponent, IgxColumnGroupComponent] }) export class GridMultiColumnHeadersExportComponent { diff --git a/src/app/grid/multi-column-headers-styling/multi-column-headers-styling.component.ts b/src/app/grid/multi-column-headers-styling/multi-column-headers-styling.component.ts index 91e0a68900..ccbb9584a2 100644 --- a/src/app/grid/multi-column-headers-styling/multi-column-headers-styling.component.ts +++ b/src/app/grid/multi-column-headers-styling/multi-column-headers-styling.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxColumnComponent, IgxColumnGroupComponent } from 'igniteui-angular/grids/core'; import { DATA } from '../../data/customers'; @@ -8,7 +8,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-multi-column-headers-styling', styleUrls: ['./multi-column-headers-styling.component.scss'], templateUrl: './multi-column-headers-styling.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxColumnGroupComponent] }) export class GridMultiColumnHeadersStylingComponent { diff --git a/src/app/grid/multi-column-headers/multi-column-headers.ts b/src/app/grid/multi-column-headers/multi-column-headers.ts index 012ba1d5ca..16a522f372 100644 --- a/src/app/grid/multi-column-headers/multi-column-headers.ts +++ b/src/app/grid/multi-column-headers/multi-column-headers.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { GridSelectionMode, IgxColumnComponent, IgxColumnGroupComponent } from 'igniteui-angular/grids/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxButtonDirective } from 'igniteui-angular/directives'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-multi-column-headers', styleUrls: ['multi-column-headers.scss'], templateUrl: 'multi-column-headers.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxColumnGroupComponent, IgxButtonDirective] }) export class GridMultiColumnHeadersComponent { diff --git a/src/app/hierarchical-grid/column-group-selection/hierarchical-grid-column-group-selection.component.ts b/src/app/hierarchical-grid/column-group-selection/hierarchical-grid-column-group-selection.component.ts index d4784ac2f4..d8e951f793 100644 --- a/src/app/hierarchical-grid/column-group-selection/hierarchical-grid-column-group-selection.component.ts +++ b/src/app/hierarchical-grid/column-group-selection/hierarchical-grid-column-group-selection.component.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, ChangeDetectorRef, Component, OnInit, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { AfterViewInit, ChangeDetectorRef, Component, OnInit, ViewChild, inject } from '@angular/core'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxColumnComponent, IgxColumnGroupComponent } from 'igniteui-angular/grids/core'; import { CUSTOMERS } from '../../data/hierarchical-data'; @@ -8,7 +8,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-column-group-selection', templateUrl: './hierarchical-grid-column-group-selection.component.html', styleUrls: ['./hierarchical-grid-column-group-selection.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxColumnGroupComponent, IgxRowIslandComponent] }) export class HierarchicalGridColumnGroupSelectionComponent implements OnInit, AfterViewInit { diff --git a/src/app/hierarchical-grid/column-selection-styles/hierarchical-grid-column-selection-styles.component.ts b/src/app/hierarchical-grid/column-selection-styles/hierarchical-grid-column-selection-styles.component.ts index d192c2c896..df67a30ee1 100644 --- a/src/app/hierarchical-grid/column-selection-styles/hierarchical-grid-column-selection-styles.component.ts +++ b/src/app/hierarchical-grid/column-selection-styles/hierarchical-grid-column-selection-styles.component.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, ChangeDetectorRef, Component, OnInit, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { AfterViewInit, ChangeDetectorRef, Component, OnInit, ViewChild, inject } from '@angular/core'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; import { SINGERS } from '../../data/singersData'; @@ -8,7 +8,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-column-selection-styles', templateUrl: './hierarchical-grid-column-selection-styles.component.html', styleUrls: ['./hierarchical-grid-column-selection-styles.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxRowIslandComponent] }) export class HGridColumnSelectionStylesComponent implements OnInit, AfterViewInit { diff --git a/src/app/hierarchical-grid/column-selection/hierarchical-grid-column-selection.component.ts b/src/app/hierarchical-grid/column-selection/hierarchical-grid-column-selection.component.ts index 2471bbe0bf..75ccaded44 100644 --- a/src/app/hierarchical-grid/column-selection/hierarchical-grid-column-selection.component.ts +++ b/src/app/hierarchical-grid/column-selection/hierarchical-grid-column-selection.component.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, ChangeDetectorRef, Component, OnInit, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { AfterViewInit, ChangeDetectorRef, Component, OnInit, ViewChild, inject } from '@angular/core'; import { GridSelectionMode, IgxCellTemplateDirective, IgxColumnComponent, IgxGridToolbarComponent } from 'igniteui-angular/grids/core'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxSelectComponent, IgxSelectItemComponent } from 'igniteui-angular/select'; @@ -11,7 +11,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-hierarchical-grid-column-selection', templateUrl: './hierarchical-grid-column-selection.component.html', styleUrls: ['./hierarchical-grid-column-selection.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxSelectComponent, FormsModule, IgxLabelDirective, IgxSelectItemComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxRowIslandComponent] }) export class HierarchicalGridColumnSelectionComponent implements OnInit, AfterViewInit { diff --git a/src/app/hierarchical-grid/hgrid-column-autosizing/hgrid-column-autosizing.component.ts b/src/app/hierarchical-grid/hgrid-column-autosizing/hgrid-column-autosizing.component.ts index be90a0ed4f..96919a585b 100644 --- a/src/app/hierarchical-grid/hgrid-column-autosizing/hgrid-column-autosizing.component.ts +++ b/src/app/hierarchical-grid/hgrid-column-autosizing/hgrid-column-autosizing.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { CUSTOMERS } from '../../data/hierarchical-data'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -7,7 +7,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'hierarchical-grid-column-autosizing', styleUrls: ['./hgrid-column-autosizing.component.scss'], templateUrl: './hgrid-column-autosizing.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxRowIslandComponent] }) diff --git a/src/app/hierarchical-grid/hgrid-editing-lifecycle-sample/hgrid-editing-lifecycle.component.ts b/src/app/hierarchical-grid/hgrid-editing-lifecycle-sample/hgrid-editing-lifecycle.component.ts index cf5271b69a..afaaf6de75 100644 --- a/src/app/hierarchical-grid/hgrid-editing-lifecycle-sample/hgrid-editing-lifecycle.component.ts +++ b/src/app/hierarchical-grid/hgrid-editing-lifecycle-sample/hgrid-editing-lifecycle.component.ts @@ -1,4 +1,4 @@ -import { Component, ElementRef, Renderer2, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ElementRef, Renderer2, ViewChild, inject } from '@angular/core'; import { SINGERS } from '../../data/singersData'; import { IgxSwitchComponent } from 'igniteui-angular/switch'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; @@ -11,7 +11,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hgrid-editing-lifecycle', templateUrl: 'hgrid-editing-lifecycle.component.html', styleUrls: ['hgrid-editing-lifecycle.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSwitchComponent, IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxRowIslandComponent, IgxButtonDirective, IgxIconComponent] }) export class HGridEditingLifecycleComponent { diff --git a/src/app/hierarchical-grid/hgrid-keybarod-nav-guide-sample/hgrid-keyboard-guide.component.ts b/src/app/hierarchical-grid/hgrid-keybarod-nav-guide-sample/hgrid-keyboard-guide.component.ts index 8bb284bd05..91be0500e5 100644 --- a/src/app/hierarchical-grid/hgrid-keybarod-nav-guide-sample/hgrid-keyboard-guide.component.ts +++ b/src/app/hierarchical-grid/hgrid-keybarod-nav-guide-sample/hgrid-keyboard-guide.component.ts @@ -3,7 +3,7 @@ /* eslint-disable @typescript-eslint/naming-convention */ /* eslint-disable no-shadow */ import { animate, state, style, transition, trigger } from '@angular/animations'; -import { ChangeDetectorRef, Component, OnDestroy, OnInit, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { ChangeDetectorRef, Component, OnDestroy, OnInit, ViewChild, inject } from '@angular/core'; import { CellType, IgxColumnComponent, IgxColumnGroupComponent, IgxGridToolbarComponent, IgxGridToolbarDirective } from 'igniteui-angular/grids/core'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxEmptyListTemplateDirective, IgxListComponent, IgxListItemComponent, IgxListLineSubTitleDirective, IgxListLineTitleDirective } from 'igniteui-angular/list'; @@ -167,7 +167,6 @@ const summaryCombinations: Item[] = [ ]) ]) ], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPaginatorComponent, IgxGridToolbarComponent, IgxColumnComponent, IgxColumnGroupComponent, IgxRowIslandComponent, IgxGridToolbarDirective, IgxListComponent, IgxListItemComponent, NgClass, IgxListLineTitleDirective, IgxListLineSubTitleDirective, IgxCheckboxComponent, IgxEmptyListTemplateDirective] }) export class HGridKeyboardnavGuide implements OnInit, OnDestroy { diff --git a/src/app/hierarchical-grid/hgrid-rowClasses-sample/hgrid-rowClasses.component.ts b/src/app/hierarchical-grid/hgrid-rowClasses-sample/hgrid-rowClasses.component.ts index 0ba49a294d..fa8ce6cee8 100644 --- a/src/app/hierarchical-grid/hgrid-rowClasses-sample/hgrid-rowClasses.component.ts +++ b/src/app/hierarchical-grid/hgrid-rowClasses-sample/hgrid-rowClasses.component.ts @@ -1,5 +1,5 @@ /* eslint-disable @typescript-eslint/naming-convention */ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxCellTemplateDirective, IgxColumnComponent, RowType } from 'igniteui-angular/grids/core'; import { IgxIconButtonDirective } from 'igniteui-angular/directives'; @@ -10,7 +10,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hgrid-row-classes', styleUrls: ['./hgrid-rowClasses.component.scss'], templateUrl: 'hgrid-rowClasses.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxIconButtonDirective, IgxIconComponent, IgxRowIslandComponent] }) diff --git a/src/app/hierarchical-grid/hgrid-rowStyle-sample/hgrid-rowStyles.component.ts b/src/app/hierarchical-grid/hgrid-rowStyle-sample/hgrid-rowStyles.component.ts index 826546bffc..ae92b4259b 100644 --- a/src/app/hierarchical-grid/hgrid-rowStyle-sample/hgrid-rowStyles.component.ts +++ b/src/app/hierarchical-grid/hgrid-rowStyle-sample/hgrid-rowStyles.component.ts @@ -1,5 +1,5 @@ /* eslint-disable @typescript-eslint/naming-convention */ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxCellTemplateDirective, IgxColumnComponent, RowType } from 'igniteui-angular/grids/core'; import { IgxIconButtonDirective } from 'igniteui-angular/directives'; @@ -10,7 +10,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hgrid-row-row-styles', styleUrls: ['./hgrid-rowStyles.component.scss'], templateUrl: 'hgrid-rowStyles.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxIconButtonDirective, IgxIconComponent, IgxRowIslandComponent] }) diff --git a/src/app/hierarchical-grid/hgrid-summary-export/hgrid-summary-export.component.ts b/src/app/hierarchical-grid/hgrid-summary-export/hgrid-summary-export.component.ts index b32e4328e5..894ab8c5f5 100644 --- a/src/app/hierarchical-grid/hgrid-summary-export/hgrid-summary-export.component.ts +++ b/src/app/hierarchical-grid/hgrid-summary-export/hgrid-summary-export.component.ts @@ -1,8 +1,8 @@ -import { Component, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild, inject } from '@angular/core'; import { SINGERS } from '../../data/singersData'; -import { IgxSummaryResult } from 'igniteui-angular/core'; +import { IgxNumberSummaryOperand, IgxSummaryResult } from 'igniteui-angular/core'; +import { IgxCellTemplateDirective, IgxColumnComponent, IgxExcelExporterOptions, IgxExcelExporterService } from 'igniteui-angular/grids/core'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; -import { IgxCellTemplateDirective, IgxColumnComponent, IgxNumberSummaryOperand, IgxExcelExporterOptions, IgxExcelExporterService } from 'igniteui-angular/grids/core'; import { IgxButtonDirective } from 'igniteui-angular/directives'; import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scroll.directive'; @@ -46,7 +46,6 @@ class MyChildSummary { selector: 'app-hierarchical-grid-summary-export', styleUrls: ['./hgrid-summary-export.component.scss'], templateUrl: 'hgrid-summary-export.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxRowIslandComponent] }) diff --git a/src/app/hierarchical-grid/hgrid-summary-template/hgrid-summary-template.component.ts b/src/app/hierarchical-grid/hgrid-summary-template/hgrid-summary-template.component.ts index bf83d9c898..509c5fae0f 100644 --- a/src/app/hierarchical-grid/hgrid-summary-template/hgrid-summary-template.component.ts +++ b/src/app/hierarchical-grid/hgrid-summary-template/hgrid-summary-template.component.ts @@ -1,6 +1,6 @@ -import { Component, HostBinding, OnInit, ChangeDetectionStrategy } from '@angular/core'; -import { IgxCellTemplateDirective, IgxColumnComponent, IgxNumberSummaryOperand, IgxSummaryTemplateDirective } from 'igniteui-angular/grids/core'; -import { IgxSummaryResult } from 'igniteui-angular/core'; +import { Component, HostBinding, OnInit } from '@angular/core'; +import { IgxCellTemplateDirective, IgxColumnComponent, IgxSummaryTemplateDirective } from 'igniteui-angular/grids/core'; +import { IgxNumberSummaryOperand, IgxSummaryResult } from 'igniteui-angular/core'; import { IgxInputDirective, IgxInputGroupComponent, IgxLabelDirective } from 'igniteui-angular/input-group'; import { IgxSwitchComponent } from 'igniteui-angular/switch'; import { IgxButtonGroupComponent } from 'igniteui-angular/button-group'; @@ -51,7 +51,6 @@ class GrammySummary { selector: 'app-hierarchical-grid-all-data-summary', styleUrls: ['./hgrid-summary-template.component.scss'], templateUrl: 'hgrid-summary-template.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxInputGroupComponent, IgxLabelDirective, FormsModule, IgxInputDirective, IgxSwitchComponent, IgxButtonGroupComponent, IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxSummaryTemplateDirective, IgxRowIslandComponent] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-action-strip/hierarchical-grid-action-strip-sample.ts b/src/app/hierarchical-grid/hierarchical-grid-action-strip/hierarchical-grid-action-strip-sample.ts index e57e493bd8..ef49a19046 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-action-strip/hierarchical-grid-action-strip-sample.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-action-strip/hierarchical-grid-action-strip-sample.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectorRef, AfterViewInit, ViewChildren, QueryList, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild, ChangeDetectorRef, AfterViewInit, ViewChildren, QueryList, inject } from '@angular/core'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxCellTemplateDirective, IgxColumnComponent, IgxGridPinningActionsComponent, RowType } from 'igniteui-angular/grids/core'; import { Transaction } from 'igniteui-angular/core'; @@ -13,7 +13,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-row-action-strip', styleUrls: [`hierarchical-grid-action-strip-sample.scss`], templateUrl: 'hierarchical-grid-action-strip-sample.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxRowIslandComponent, IgxActionStripComponent, IgxGridPinningActionsComponent, IgxIconButtonDirective, IgxRippleDirective, IgxIconComponent] }) export class HGridActionStripSampleComponent implements AfterViewInit{ diff --git a/src/app/hierarchical-grid/hierarchical-grid-add-row/hierarchical-grid-add-row.component.ts b/src/app/hierarchical-grid/hierarchical-grid-add-row/hierarchical-grid-add-row.component.ts index ead746bc94..28326279b7 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-add-row/hierarchical-grid-add-row.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-add-row/hierarchical-grid-add-row.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit } from '@angular/core'; import { SINGERS } from '../../data/singersData'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxColumnComponent, IgxGridEditingActionsComponent } from 'igniteui-angular/grids/core'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-add-row', styleUrls: ['./hierarchical-grid-add-row.component.scss'], templateUrl: './hierarchical-grid-add-row.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxActionStripComponent, IgxGridEditingActionsComponent, IgxRowIslandComponent] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-advanced-filtering-style/hierarchical-grid-advanced-filtering-style.component.ts b/src/app/hierarchical-grid/hierarchical-grid-advanced-filtering-style/hierarchical-grid-advanced-filtering-style.component.ts index 1baaf1ba3f..87e682c4f4 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-advanced-filtering-style/hierarchical-grid-advanced-filtering-style.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-advanced-filtering-style/hierarchical-grid-advanced-filtering-style.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { SINGERS } from '../../data/singersData'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxCellTemplateDirective, IgxColumnComponent, IgxGridToolbarComponent, IgxGridToolbarDirective } from 'igniteui-angular/grids/core'; @@ -8,7 +8,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-advanced-filtering-style', styleUrls: ['./hierarchical-grid-advanced-filtering-style.component.scss'], templateUrl: 'hierarchical-grid-advanced-filtering-style.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxRowIslandComponent, IgxGridToolbarDirective] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-advanced-filtering/hierarchical-grid-advanced-filtering.component.ts b/src/app/hierarchical-grid/hierarchical-grid-advanced-filtering/hierarchical-grid-advanced-filtering.component.ts index 632e283769..178c411c60 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-advanced-filtering/hierarchical-grid-advanced-filtering.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-advanced-filtering/hierarchical-grid-advanced-filtering.component.ts @@ -1,4 +1,4 @@ -import { Component, AfterViewInit, ViewChild, ChangeDetectorRef, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, AfterViewInit, ViewChild, ChangeDetectorRef, inject } from '@angular/core'; import { SINGERS } from '../../data/singersData'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxCellTemplateDirective, IgxColumnComponent, IgxGridToolbarComponent, IgxGridToolbarDirective } from 'igniteui-angular/grids/core'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-advanced-filtering', styleUrls: ['./hierarchical-grid-advanced-filtering.component.scss'], templateUrl: 'hierarchical-grid-advanced-filtering.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxRowIslandComponent, IgxGridToolbarDirective] }) @@ -24,7 +23,7 @@ export class HGridAdvancedFilteringSampleComponent implements AfterViewInit{ constructor() { this.localData = SINGERS; } - + public ngAfterViewInit() { const albumsTree = new FilteringExpressionsTree(FilteringLogic.And, undefined, 'Albums', ['Artist']); albumsTree.filteringOperands.push({ diff --git a/src/app/hierarchical-grid/hierarchical-grid-allData-summary/hierarchical-grid-allData-summary.component.ts b/src/app/hierarchical-grid/hierarchical-grid-allData-summary/hierarchical-grid-allData-summary.component.ts index c4df67dd23..dea3160b5b 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-allData-summary/hierarchical-grid-allData-summary.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-allData-summary/hierarchical-grid-allData-summary.component.ts @@ -1,7 +1,7 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; -import { IgxCellTemplateDirective, IgxColumnComponent, IgxNumberSummaryOperand, IgxSummaryOperand } from 'igniteui-angular/grids/core'; -import { IgxSummaryResult } from 'igniteui-angular/core'; +import { IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; +import { IgxNumberSummaryOperand, IgxSummaryOperand, IgxSummaryResult } from 'igniteui-angular/core'; import { SINGERS } from '../../data/singersData'; import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scroll.directive'; @@ -47,7 +47,6 @@ class GrammySummary { selector: 'app-hierarchical-grid-all-data-summary', styleUrls: ['./hierarchical-grid-allData-summary.component.scss'], templateUrl: 'hierarchical-grid-allData-summary.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxRowIslandComponent] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-batch-editing/hierarchical-grid-batch-editing.component.ts b/src/app/hierarchical-grid/hierarchical-grid-batch-editing/hierarchical-grid-batch-editing.component.ts index 3b8fd85e89..e6a09ab0e1 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-batch-editing/hierarchical-grid-batch-editing.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-batch-editing/hierarchical-grid-batch-editing.component.ts @@ -1,5 +1,5 @@ /* eslint-disable @typescript-eslint/naming-convention */ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxDialogComponent } from 'igniteui-angular/dialog'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { Transaction } from 'igniteui-angular/core'; @@ -17,7 +17,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-hierarchical-grid-batch-editing', styleUrls: ['./hierarchical-grid-batch-editing.component.scss'], templateUrl: 'hierarchical-grid-batch-editing.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxRowIslandComponent, IgxGridToolbarDirective, IgxGridToolbarComponent, IgxDialogComponent, IgxInputGroupComponent, IgxLabelDirective, FormsModule, IgxInputDirective, IgxCheckboxComponent, IgxGridComponent] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-cell-merge-custom/hierarchical-grid-cell-merge-custom.component.ts b/src/app/hierarchical-grid/hierarchical-grid-cell-merge-custom/hierarchical-grid-cell-merge-custom.component.ts index f88c8ac7dd..ae4e19b225 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-cell-merge-custom/hierarchical-grid-cell-merge-custom.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-cell-merge-custom/hierarchical-grid-cell-merge-custom.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { HIERARCHICAL_DATA_EXTENDED } from '../../data/hierarchical-data-extended'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { GridCellMergeMode, IgxColumnComponent, IgxGridToolbarComponent } from 'igniteui-angular/grids/core'; @@ -12,7 +12,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-hierarchical-grid-cell-merge-custom', styleUrls: ['./hierarchical-grid-cell-merge-custom.component.scss'], templateUrl: 'hierarchical-grid-cell-merge-custom.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [ IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, diff --git a/src/app/hierarchical-grid/hierarchical-grid-cell-merge/hierarchical-grid-cell-merge.component.ts b/src/app/hierarchical-grid/hierarchical-grid-cell-merge/hierarchical-grid-cell-merge.component.ts index e8dcc24b81..18ad978ced 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-cell-merge/hierarchical-grid-cell-merge.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-cell-merge/hierarchical-grid-cell-merge.component.ts @@ -1,4 +1,4 @@ -import { ChangeDetectorRef, Component, ContentChild, inject, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { ChangeDetectorRef, Component, ContentChild, inject, ViewChild } from '@angular/core'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { GridCellMergeMode, IgxColumnComponent, IgxGridToolbarComponent } from 'igniteui-angular/grids/core'; import { SortingDirection } from 'igniteui-angular/core'; @@ -12,7 +12,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-hierarchical-grid-cell-merge', styleUrls: ['./hierarchical-grid-cell-merge.component.scss'], templateUrl: 'hierarchical-grid-cell-merge.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [ IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, diff --git a/src/app/hierarchical-grid/hierarchical-grid-cellSelection-sample/hierarchical-grid-cellSelection.component.ts b/src/app/hierarchical-grid/hierarchical-grid-cellSelection-sample/hierarchical-grid-cellSelection.component.ts index 1aa7ed7225..5fcddb71f1 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-cellSelection-sample/hierarchical-grid-cellSelection.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-cellSelection-sample/hierarchical-grid-cellSelection.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxSnackbarComponent } from 'igniteui-angular/snackbar'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { GridSelectionMode, IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -12,7 +12,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-cell-selection', styleUrls: ['./hierarchical-grid-cellSelection.component.scss'], templateUrl: 'hierarchical-grid-cellSelection.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonGroupComponent, IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxRowIslandComponent, IgxSnackbarComponent, IgxIconComponent] }) export class HierarchicalGridCellSelectionComponent implements OnInit { diff --git a/src/app/hierarchical-grid/hierarchical-grid-collapsible-column-groups/hierarchical-grid-collapsible-column-groups.component.ts b/src/app/hierarchical-grid/hierarchical-grid-collapsible-column-groups/hierarchical-grid-collapsible-column-groups.component.ts index 07d0c1be95..397822143f 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-collapsible-column-groups/hierarchical-grid-collapsible-column-groups.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-collapsible-column-groups/hierarchical-grid-collapsible-column-groups.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxCollapsibleIndicatorTemplateDirective, IgxColumnComponent, IgxColumnGroupComponent } from 'igniteui-angular/grids/core'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -10,7 +10,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-collapsible-column-groups', styleUrls: ['./hierarchical-grid-collapsible-column-groups.component.scss'], templateUrl: 'hierarchical-grid-collapsible-column-groups.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnGroupComponent, IgxCollapsibleIndicatorTemplateDirective, IgxIconComponent, IgxTooltipTargetDirective, IgxTooltipDirective, IgxColumnComponent, IgxRowIslandComponent] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-column-hiding-toolbar-style/hierarchical-grid-column-hiding-toolbar-style.component.ts b/src/app/hierarchical-grid/hierarchical-grid-column-hiding-toolbar-style/hierarchical-grid-column-hiding-toolbar-style.component.ts index c772fefc31..06a501bd09 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-column-hiding-toolbar-style/hierarchical-grid-column-hiding-toolbar-style.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-column-hiding-toolbar-style/hierarchical-grid-column-hiding-toolbar-style.component.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { AfterViewInit, Component, OnInit, ViewChild } from '@angular/core'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxCellTemplateDirective, IgxColumnComponent, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarDirective, IgxGridToolbarHidingComponent, IgxGridToolbarTitleComponent } from 'igniteui-angular/grids/core'; import { SINGERS } from '../../data/singersData'; @@ -8,7 +8,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-column-hiding-toolbar-style', styleUrls: ['./hierarchical-grid-column-hiding-toolbar-style.component.scss'], templateUrl: './hierarchical-grid-column-hiding-toolbar-style.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxGridToolbarTitleComponent, IgxGridToolbarActionsComponent, IgxGridToolbarHidingComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxRowIslandComponent, IgxGridToolbarDirective] }) export class HierarchicalGridColumnHidingToolbarStyleComponent implements OnInit { diff --git a/src/app/hierarchical-grid/hierarchical-grid-column-hiding/hierarchical-grid-custom-hiding.component.ts b/src/app/hierarchical-grid/hierarchical-grid-column-hiding/hierarchical-grid-custom-hiding.component.ts index 454d9d9d7e..f62c43f132 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-column-hiding/hierarchical-grid-custom-hiding.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-column-hiding/hierarchical-grid-custom-hiding.component.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, ChangeDetectorRef, Component, OnInit, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { AfterViewInit, ChangeDetectorRef, Component, OnInit, ViewChild, inject } from '@angular/core'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxCellTemplateDirective, IgxColumnActionsComponent, IgxColumnComponent, IgxColumnHidingDirective } from 'igniteui-angular/grids/core'; import { IgxRadioComponent } from 'igniteui-angular/radio'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-custom-hiding', styleUrls: ['./hierarchical-grid-custom-hiding.component.scss'], templateUrl: 'hierarchical-grid-custom-hiding.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxColumnActionsComponent, IgxColumnHidingDirective, IgxRadioComponent, IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxRowIslandComponent] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-column-hiding/hierarchical-grid-hiding.component.ts b/src/app/hierarchical-grid/hierarchical-grid-column-hiding/hierarchical-grid-hiding.component.ts index 2c74f8cb37..8aa58d8b2f 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-column-hiding/hierarchical-grid-hiding.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-column-hiding/hierarchical-grid-hiding.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit } from '@angular/core'; import { SINGERS } from '../../data/singersData'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxCellTemplateDirective, IgxColumnComponent, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarDirective, IgxGridToolbarHidingComponent, IgxGridToolbarTitleComponent } from 'igniteui-angular/grids/core'; @@ -8,7 +8,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-hiding', styleUrls: ['./hierarchical-grid-hiding.component.scss'], templateUrl: 'hierarchical-grid-hiding.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxGridToolbarTitleComponent, IgxGridToolbarActionsComponent, IgxGridToolbarHidingComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxRowIslandComponent, IgxGridToolbarDirective] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-column-moving-styled/hierarchical-grid-moving-styled.component.ts b/src/app/hierarchical-grid/hierarchical-grid-column-moving-styled/hierarchical-grid-moving-styled.component.ts index 81691ebcfd..51e12be5b1 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-column-moving-styled/hierarchical-grid-moving-styled.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-column-moving-styled/hierarchical-grid-moving-styled.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxCellHeaderTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxPaginatorComponent } from 'igniteui-angular/paginator'; @@ -10,7 +10,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-moving-styled', styleUrls: ['./hierarchical-grid-moving-styled.component.scss'], templateUrl: 'hierarchical-grid-moving-styled.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxPaginatorComponent, IgxColumnComponent, IgxCellHeaderTemplateDirective, IgxIconComponent, IgxRowIslandComponent] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-column-moving/hierarchical-grid-moving.component.ts b/src/app/hierarchical-grid/hierarchical-grid-column-moving/hierarchical-grid-moving.component.ts index 047cedc734..8c94e7924d 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-column-moving/hierarchical-grid-moving.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-column-moving/hierarchical-grid-moving.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxCellHeaderTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxPaginatorComponent } from 'igniteui-angular/paginator'; @@ -10,7 +10,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-moving', styleUrls: ['./hierarchical-grid-moving.component.scss'], templateUrl: 'hierarchical-grid-moving.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxPaginatorComponent, IgxColumnComponent, IgxCellHeaderTemplateDirective, IgxIconComponent, IgxRowIslandComponent] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-column-pinning/hierarchical-grid-pinning.component.ts b/src/app/hierarchical-grid/hierarchical-grid-column-pinning/hierarchical-grid-pinning.component.ts index d73273f501..97ce00cd7e 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-column-pinning/hierarchical-grid-pinning.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-column-pinning/hierarchical-grid-pinning.component.ts @@ -1,5 +1,5 @@ -import { AfterViewInit, ChangeDetectorRef, Component, inject, ChangeDetectionStrategy } from '@angular/core'; +import { AfterViewInit, ChangeDetectorRef, Component, inject } from '@angular/core'; import { ColumnType } from 'igniteui-angular/core'; import { IgxIconComponent, IgxIconService } from 'igniteui-angular/icon'; import { IgxCellHeaderTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -13,7 +13,6 @@ const FILTERING_ICONS_FONT_SET = 'filtering-icons'; selector: 'app-hierarchical-grid-pinning', styleUrls: ['./hierarchical-grid-pinning.component.scss'], templateUrl: 'hierarchical-grid-pinning.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxCellHeaderTemplateDirective, IgxIconComponent, IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxRowIslandComponent] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-column-pinning/hierarchical-grid-toolbar-pinning.component.ts b/src/app/hierarchical-grid/hierarchical-grid-column-pinning/hierarchical-grid-toolbar-pinning.component.ts index d67222dee0..6c3a4ff00a 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-column-pinning/hierarchical-grid-toolbar-pinning.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-column-pinning/hierarchical-grid-toolbar-pinning.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, inject } from '@angular/core'; import { CUSTOMERS } from '../../data/hierarchical-data'; import { ActivatedRoute } from '@angular/router'; import { NgClass } from '@angular/common'; @@ -10,7 +10,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-toolbar-pinning', styleUrls: ['./hierarchical-grid-toolbar-pinning.component.scss'], templateUrl: 'hierarchical-grid-toolbar-pinning.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [NgClass, IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxGridToolbarActionsComponent, IgxGridToolbarPinningComponent, IgxColumnComponent, IgxRowIslandComponent] }) export class HGridToolbarPinningComponent implements OnInit { diff --git a/src/app/hierarchical-grid/hierarchical-grid-conditional-row-selectors/hierarchical-grid-conditional-row-selectors.component.ts b/src/app/hierarchical-grid/hierarchical-grid-conditional-row-selectors/hierarchical-grid-conditional-row-selectors.component.ts index d88491edf8..7b78532b57 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-conditional-row-selectors/hierarchical-grid-conditional-row-selectors.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-conditional-row-selectors/hierarchical-grid-conditional-row-selectors.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit } from '@angular/core'; import { IRowSelectionEventArgs, IgxColumnComponent, IgxRowSelectorDirective } from 'igniteui-angular/grids/core'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxPaginatorComponent } from 'igniteui-angular/paginator'; @@ -10,7 +10,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-conditional-row-selectors', styleUrls: ['./hierarchical-grid-conditional-row-selectors.component.scss'], templateUrl: 'hierarchical-grid-conditional-row-selectors.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxPaginatorComponent, IgxColumnComponent, IgxRowIslandComponent, IgxRowSelectorDirective, IgxCheckboxComponent] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-cross-field-validation/hierarchical-grid-cross-field-validation.component.ts b/src/app/hierarchical-grid/hierarchical-grid-cross-field-validation/hierarchical-grid-cross-field-validation.component.ts index f4e197d4e2..5668d18936 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-cross-field-validation/hierarchical-grid-cross-field-validation.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-cross-field-validation/hierarchical-grid-cross-field-validation.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { AbstractControl, ValidationErrors, ValidatorFn, FormsModule, ReactiveFormsModule } from '@angular/forms'; import { CellType, IGridEditEventArgs, IGridFormGroupCreatedEventArgs, IgxCellEditorTemplateDirective, IgxCellTemplateDirective, IgxColumnComponent, IgxColumnRequiredValidatorDirective, IgxGridToolbarComponent, IgxGridToolbarDirective } from 'igniteui-angular/grids/core'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; @@ -13,7 +13,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'hierarchical-grid-cross-field-validation', styleUrls: ['./hierarchical-grid-cross-field-validation.component.scss'], templateUrl: 'hierarchical-grid-cross-field-validation.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSwitchComponent, FormsModule, IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxTooltipTargetDirective, IgxTooltipDirective, IgxColumnRequiredValidatorDirective, IgxCellEditorTemplateDirective, IgxSelectComponent, ReactiveFormsModule, IgxFocusDirective, IgxSelectItemComponent, IgxRowIslandComponent, IgxGridToolbarDirective, IgxGridToolbarComponent, IgxButtonDirective] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-custom-kb-navigation/hierarchical-grid-custom-kb-navigation-sample.component.ts b/src/app/hierarchical-grid/hierarchical-grid-custom-kb-navigation/hierarchical-grid-custom-kb-navigation-sample.component.ts index 4a4d4c7b1d..d6a1febac8 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-custom-kb-navigation/hierarchical-grid-custom-kb-navigation-sample.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-custom-kb-navigation/hierarchical-grid-custom-kb-navigation-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IGridCreatedEventArgs, IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { CellType, IGridKeydownEventArgs, IgxCellTemplateDirective, IgxColumnComponent, IgxGridToolbarComponent, IgxGridToolbarDirective, IgxGridToolbarTitleComponent } from 'igniteui-angular/grids/core'; import { SINGERS } from '../../data/singersData'; @@ -8,7 +8,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-custom-kb-navigation-sample', styleUrls: ['./hierarchical-grid-custom-kb-navigation-sample.component.scss'], templateUrl: 'hierarchical-grid-custom-kb-navigation-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxRowIslandComponent, IgxGridToolbarDirective, IgxGridToolbarComponent, IgxGridToolbarTitleComponent] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-disable-summaries/hierarchical-grid-disable-summaries.component.ts b/src/app/hierarchical-grid/hierarchical-grid-disable-summaries/hierarchical-grid-disable-summaries.component.ts index 8695e8dbdf..d9f654e390 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-disable-summaries/hierarchical-grid-disable-summaries.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-disable-summaries/hierarchical-grid-disable-summaries.component.ts @@ -9,8 +9,8 @@ import { ChangeDetectionStrategy } from "@angular/core"; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; -import { IgxCellTemplateDirective, IgxColumnComponent, IgxNumberSummaryOperand } from 'igniteui-angular/grids/core'; -import { ConnectedPositioningStrategy, HorizontalAlignment, IgxSummaryResult, OverlaySettings, VerticalAlignment } from 'igniteui-angular/core'; +import { IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; +import { ConnectedPositioningStrategy, HorizontalAlignment, IgxNumberSummaryOperand, IgxSummaryResult, OverlaySettings, VerticalAlignment } from 'igniteui-angular/core'; import { IgxButtonDirective, IgxToggleDirective } from 'igniteui-angular/directives'; import { IgxCheckboxComponent } from 'igniteui-angular/checkbox'; import { SINGERS } from "../../data/singersData"; @@ -70,7 +70,6 @@ class GrammySummary { selector: "app-hierarchical-grid-summary-sample", styleUrls: ["./hierarchical-grid-disable-summaries.component.scss"], templateUrl: "hierarchical-grid-disable-summaries.component.html", - changeDetection: ChangeDetectionStrategy.Eager, imports: [ IgxHierarchicalGridComponent, IgxRowIslandComponent, diff --git a/src/app/hierarchical-grid/hierarchical-grid-display-density/hierarchical-grid-density.component.ts b/src/app/hierarchical-grid/hierarchical-grid-display-density/hierarchical-grid-density.component.ts index e7446ef664..31cf229aee 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-display-density/hierarchical-grid-density.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-display-density/hierarchical-grid-density.component.ts @@ -1,4 +1,4 @@ -import { Component, HostBinding, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, HostBinding, OnInit, ViewChild } from '@angular/core'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxButtonGroupComponent } from 'igniteui-angular/button-group'; import { IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-density', styleUrls: ['./hierarchical-grid-density.component.scss'], templateUrl: 'hierarchical-grid-density.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonGroupComponent, IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxRowIslandComponent] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-editing-events/hierarchical-grid-editing-events.component.ts b/src/app/hierarchical-grid/hierarchical-grid-editing-events/hierarchical-grid-editing-events.component.ts index cacb13bd69..94a4523e00 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-editing-events/hierarchical-grid-editing-events.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-editing-events/hierarchical-grid-editing-events.component.ts @@ -1,4 +1,4 @@ -import { Component, OnDestroy, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnDestroy, OnInit, ViewChild } from '@angular/core'; import { IGridCreatedEventArgs, IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IGridEditEventArgs, IgxColumnComponent } from 'igniteui-angular/grids/core'; import { IgxToastComponent } from 'igniteui-angular/toast'; @@ -13,7 +13,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-editing-events', styleUrls: ['./hierarchical-grid-editing-events.component.scss'], templateUrl: 'hierarchical-grid-editing-events.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxRowIslandComponent, IgxToastComponent] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-editing-style/hierarchical-grid-editing-style.component.ts b/src/app/hierarchical-grid/hierarchical-grid-editing-style/hierarchical-grid-editing-style.component.ts index fd84574f12..9bd98422df 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-editing-style/hierarchical-grid-editing-style.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-editing-style/hierarchical-grid-editing-style.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxColumnComponent } from 'igniteui-angular/grids/core'; import { SINGERS } from '../../data/singersData'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-editing-style', styleUrls: ['./hierarchical-grid-editing-style.component.scss'], templateUrl: 'hierarchical-grid-editing-style.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxRowIslandComponent] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-editing/hierarchical-grid-editing.component.ts b/src/app/hierarchical-grid/hierarchical-grid-editing/hierarchical-grid-editing.component.ts index 816fc5d1e0..afcacd44c7 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-editing/hierarchical-grid-editing.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-editing/hierarchical-grid-editing.component.ts @@ -1,9 +1,9 @@ /* eslint-disable @typescript-eslint/naming-convention */ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxDialogComponent } from 'igniteui-angular/dialog'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; -import { IgxCellTemplateDirective, IgxColumnComponent, IgxNumberSummaryOperand } from 'igniteui-angular/grids/core'; -import { IgxSummaryResult } from 'igniteui-angular/core'; +import { IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; +import { IgxNumberSummaryOperand, IgxSummaryResult } from 'igniteui-angular/core'; import { IgxButtonDirective, IgxIconButtonDirective } from 'igniteui-angular/directives'; import { IgxIconComponent } from 'igniteui-angular/icon'; import { IgxInputDirective, IgxInputGroupComponent, IgxLabelDirective } from 'igniteui-angular/input-group'; @@ -40,7 +40,6 @@ class MySummary { selector: 'app-hierarchical-grid-editing', styleUrls: ['./hierarchical-grid-editing.component.scss'], templateUrl: 'hierarchical-grid-editing.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxIconButtonDirective, IgxIconComponent, IgxRowIslandComponent, IgxDialogComponent, IgxInputGroupComponent, IgxLabelDirective, FormsModule, IgxInputDirective, IgxCheckboxComponent] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-excel-exporter/hierarchical-grid-excel-export.sample.ts b/src/app/hierarchical-grid/hierarchical-grid-excel-exporter/hierarchical-grid-excel-export.sample.ts index 71bf1acd1f..7c98e6e67a 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-excel-exporter/hierarchical-grid-excel-export.sample.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-excel-exporter/hierarchical-grid-excel-export.sample.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { IgxColumnComponent, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarExporterComponent } from 'igniteui-angular/grids/core'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { Singer, SINGERS } from '../../data/artistData'; @@ -7,7 +7,6 @@ import { Singer, SINGERS } from '../../data/artistData'; selector: 'app-hierarchical-grid-excel-export-sample', styleUrls: ['hierarchical-grid-excel-export.sample.scss'], templateUrl: 'hierarchical-grid-excel-export.sample.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxGridToolbarComponent, IgxGridToolbarActionsComponent, IgxGridToolbarExporterComponent, IgxColumnComponent, IgxRowIslandComponent] }) export class HGridExcelExportSampleComponent { diff --git a/src/app/hierarchical-grid/hierarchical-grid-excel-style-filtering-load-on-demand/hierarchical-grid-excel-style-filtering-load-on-demand.component.ts b/src/app/hierarchical-grid/hierarchical-grid-excel-style-filtering-load-on-demand/hierarchical-grid-excel-style-filtering-load-on-demand.component.ts index ce36956ea5..60074a224b 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-excel-style-filtering-load-on-demand/hierarchical-grid-excel-style-filtering-load-on-demand.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-excel-style-filtering-load-on-demand/hierarchical-grid-excel-style-filtering-load-on-demand.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, inject } from '@angular/core'; import { ColumnType, IFilteringExpressionsTree } from 'igniteui-angular/core'; import { IgxCellTemplateDirective, IgxColumnComponent, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent } from 'igniteui-angular/grids/core'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; @@ -10,7 +10,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro templateUrl: './hierarchical-grid-excel-style-filtering-load-on-demand.component.html', styleUrls: ['./hierarchical-grid-excel-style-filtering-load-on-demand.component.scss'], providers: [RemoteValuesService], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxGridToolbarActionsComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxRowIslandComponent] }) export class HierarchicalGridExcelStyleFilteringLoadOnDemandComponent implements OnInit { diff --git a/src/app/hierarchical-grid/hierarchical-grid-excel-style-filtering-sample-1/hierarchical-grid-excel-style-filtering-sample-1.component.ts b/src/app/hierarchical-grid/hierarchical-grid-excel-style-filtering-sample-1/hierarchical-grid-excel-style-filtering-sample-1.component.ts index 73bbbfd4e3..c6804d7aaa 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-excel-style-filtering-sample-1/hierarchical-grid-excel-style-filtering-sample-1.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-excel-style-filtering-sample-1/hierarchical-grid-excel-style-filtering-sample-1.component.ts @@ -1,4 +1,4 @@ -import { Component, HostBinding, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, HostBinding, OnInit, ViewChild } from '@angular/core'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxButtonGroupComponent } from 'igniteui-angular/button-group'; import { IgxCellTemplateDirective, IgxColumnComponent, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarHidingComponent } from 'igniteui-angular/grids/core'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-excel-style-filtering-sample-1', styleUrls: ['./hierarchical-grid-excel-style-filtering-sample-1.component.scss'], templateUrl: 'hierarchical-grid-excel-style-filtering-sample-1.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonGroupComponent, IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxGridToolbarActionsComponent, IgxGridToolbarHidingComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxRowIslandComponent] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-excel-style-filtering-sample-2/hierarchical-grid-excel-style-filtering-sample-2.component.ts b/src/app/hierarchical-grid/hierarchical-grid-excel-style-filtering-sample-2/hierarchical-grid-excel-style-filtering-sample-2.component.ts index 70e3712065..be298df026 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-excel-style-filtering-sample-2/hierarchical-grid-excel-style-filtering-sample-2.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-excel-style-filtering-sample-2/hierarchical-grid-excel-style-filtering-sample-2.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { SINGERS } from '../../data/singersData'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxCellTemplateDirective, IgxColumnComponent, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarHidingComponent } from 'igniteui-angular/grids/core'; @@ -8,7 +8,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-excel-style-filtering-sample-2', styleUrls: ['./hierarchical-grid-excel-style-filtering-sample-2.component.scss'], templateUrl: 'hierarchical-grid-excel-style-filtering-sample-2.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxGridToolbarActionsComponent, IgxGridToolbarHidingComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxRowIslandComponent] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-excel-style-filtering-sample-3/hierarchical-grid-excel-style-filtering-sample-3.component.ts b/src/app/hierarchical-grid/hierarchical-grid-excel-style-filtering-sample-3/hierarchical-grid-excel-style-filtering-sample-3.component.ts index e7c0ba5f61..61c51165a4 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-excel-style-filtering-sample-3/hierarchical-grid-excel-style-filtering-sample-3.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-excel-style-filtering-sample-3/hierarchical-grid-excel-style-filtering-sample-3.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { SINGERS } from '../../data/singersData'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxCellTemplateDirective, IgxColumnComponent, IgxExcelStyleColumnOperationsTemplateDirective, IgxExcelStyleFilterOperationsTemplateDirective, IgxExcelStyleHeaderComponent, IgxExcelStyleHeaderIconDirective, IgxExcelStyleSearchComponent, IgxExcelStyleSortingComponent, IgxGridExcelStyleFilteringComponent, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarHidingComponent } from 'igniteui-angular/grids/core'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-excel-style-filtering-sample-3', styleUrls: ['./hierarchical-grid-excel-style-filtering-sample-3.component.scss'], templateUrl: 'hierarchical-grid-excel-style-filtering-sample-3.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxGridToolbarActionsComponent, IgxGridToolbarHidingComponent, IgxExcelStyleHeaderIconDirective, IgxIconComponent, IgxGridExcelStyleFilteringComponent, IgxExcelStyleColumnOperationsTemplateDirective, IgxExcelStyleHeaderComponent, IgxExcelStyleSortingComponent, IgxExcelStyleFilterOperationsTemplateDirective, IgxExcelStyleSearchComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxRowIslandComponent] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-excel-style-filtering-style/hierarchical-grid-excel-style-filtering-style.component.ts b/src/app/hierarchical-grid/hierarchical-grid-excel-style-filtering-style/hierarchical-grid-excel-style-filtering-style.component.ts index a1ab6a71e5..cd8fe1db14 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-excel-style-filtering-style/hierarchical-grid-excel-style-filtering-style.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-excel-style-filtering-style/hierarchical-grid-excel-style-filtering-style.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; import { SINGERS } from '../../data/singersData'; @@ -8,7 +8,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-excel-style-filtering-style', styleUrls: ['./hierarchical-grid-excel-style-filtering-style.component.scss'], templateUrl: 'hierarchical-grid-excel-style-filtering-style.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxRowIslandComponent] }) export class HGridExcelStyleFilteringStyleComponent { diff --git a/src/app/hierarchical-grid/hierarchical-grid-external-advanced-filtering/hierarchical-grid-external-advanced-filtering.component.ts b/src/app/hierarchical-grid/hierarchical-grid-external-advanced-filtering/hierarchical-grid-external-advanced-filtering.component.ts index f10cc7098f..87d7104a0f 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-external-advanced-filtering/hierarchical-grid-external-advanced-filtering.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-external-advanced-filtering/hierarchical-grid-external-advanced-filtering.component.ts @@ -8,7 +8,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-external-advanced-filtering', templateUrl: './hierarchical-grid-external-advanced-filtering.component.html', styleUrls: ['./hierarchical-grid-external-advanced-filtering.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxAdvancedFilteringDialogComponent, IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxRowIslandComponent, IgxGridToolbarDirective, IgxGridToolbarComponent] }) export class HGridExternalAdvancedFilteringComponent { diff --git a/src/app/hierarchical-grid/hierarchical-grid-external-excel-style-filtering/hierarchical-grid-external-excel-style-filtering.component.ts b/src/app/hierarchical-grid/hierarchical-grid-external-excel-style-filtering/hierarchical-grid-external-excel-style-filtering.component.ts index 2582d8e45f..a468af36e2 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-external-excel-style-filtering/hierarchical-grid-external-excel-style-filtering.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-external-excel-style-filtering/hierarchical-grid-external-excel-style-filtering.component.ts @@ -8,7 +8,6 @@ import { SINGERS } from '../../data/singersData'; import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scroll.directive'; @Component({ - changeDetection: ChangeDetectionStrategy.OnPush, selector: 'app-hierarchical-grid-external-excel-style-filtering', templateUrl: './hierarchical-grid-external-excel-style-filtering.component.html', styleUrls: ['./hierarchical-grid-external-excel-style-filtering.component.scss'], diff --git a/src/app/hierarchical-grid/hierarchical-grid-external-outlet/hierarchical-grid-external-outlet-sample.component.ts b/src/app/hierarchical-grid/hierarchical-grid-external-outlet/hierarchical-grid-external-outlet-sample.component.ts index 978743a72b..42d6cf25c9 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-external-outlet/hierarchical-grid-external-outlet-sample.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-external-outlet/hierarchical-grid-external-outlet-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit } from '@angular/core'; import { SINGERS } from '../../data/singersData'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxCellTemplateDirective, IgxColumnComponent, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarHidingComponent } from 'igniteui-angular/grids/core'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-external-outlet', styleUrls: ['./hierarchical-grid-external-outlet-sample.component.scss'], templateUrl: 'hierarchical-grid-external-outlet-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxGridToolbarActionsComponent, IgxGridToolbarHidingComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxRowIslandComponent, IgxOverlayOutletDirective] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-filtering-style/hierarchical-grid-filtering-style.component.ts b/src/app/hierarchical-grid/hierarchical-grid-filtering-style/hierarchical-grid-filtering-style.component.ts index 03c495267e..9cb589296b 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-filtering-style/hierarchical-grid-filtering-style.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-filtering-style/hierarchical-grid-filtering-style.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { SINGERS } from '../../data/singersData'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -8,7 +8,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-filtering-style', styleUrls: ['./hierarchical-grid-filtering-style.component.scss'], templateUrl: './hierarchical-grid-filtering-style.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxRowIslandComponent] }) export class HierarchicalGridFilteringStyleComponent { diff --git a/src/app/hierarchical-grid/hierarchical-grid-filtering-template/hierarchical-grid-filtering-template.component.ts b/src/app/hierarchical-grid/hierarchical-grid-filtering-template/hierarchical-grid-filtering-template.component.ts index 23191188e1..f7f4261dfe 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-filtering-template/hierarchical-grid-filtering-template.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-filtering-template/hierarchical-grid-filtering-template.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { ColumnType, GridColumnDataType, IgxDateFilteringOperand, IgxNumberFilteringOperand, IgxPickerClearComponent, IgxPickerToggleComponent, IgxStringFilteringOperand, OverlaySettings } from 'igniteui-angular/core'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxCellTemplateDirective, IgxColumnComponent, IgxFilterCellTemplateDirective } from 'igniteui-angular/grids/core'; @@ -13,7 +13,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-filtering-template', styleUrls: ['./hierarchical-grid-filtering-template.component.scss'], templateUrl: 'hierarchical-grid-filtering-template.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxRowIslandComponent, IgxFilterCellTemplateDirective, IgxInputGroupComponent, IgxPrefixDirective, IgxIconComponent, IgxInputDirective, IgxSuffixDirective, IgxDatePickerComponent, IgxPickerToggleComponent, IgxPickerClearComponent] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-filtering/hierarchical-grid-custom-filtering.component.ts b/src/app/hierarchical-grid/hierarchical-grid-filtering/hierarchical-grid-custom-filtering.component.ts index 7af572dce1..589bc404de 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-filtering/hierarchical-grid-custom-filtering.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-filtering/hierarchical-grid-custom-filtering.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IFilteringOperation, IgxBooleanFilteringOperand, IgxStringFilteringOperand } from 'igniteui-angular/core'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -10,7 +10,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-custom-filtering', styleUrls: ['./hierarchical-grid-custom-filtering.component.scss'], templateUrl: 'hierarchical-grid-custom-filtering.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxRowIslandComponent] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-filtering/hierarchical-grid-filtering.component.ts b/src/app/hierarchical-grid/hierarchical-grid-filtering/hierarchical-grid-filtering.component.ts index e825618401..77dd97ab91 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-filtering/hierarchical-grid-filtering.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-filtering/hierarchical-grid-filtering.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { SINGERS } from '../../data/singersData'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -8,7 +8,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-filtering', styleUrls: ['./hierarchical-grid-filtering.component.scss'], templateUrl: 'hierarchical-grid-filtering.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxRowIslandComponent] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-formatted-filtering-strategy/hierarchical-grid-formatted-filtering-strategy.component.ts b/src/app/hierarchical-grid/hierarchical-grid-formatted-filtering-strategy/hierarchical-grid-formatted-filtering-strategy.component.ts index 46ed2ae013..90e8ecba96 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-formatted-filtering-strategy/hierarchical-grid-formatted-filtering-strategy.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-formatted-filtering-strategy/hierarchical-grid-formatted-filtering-strategy.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { FormattedValuesFilteringStrategy } from 'igniteui-angular/core'; import { IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-formatted-filtering-strategy', styleUrls: ['./hierarchical-grid-formatted-filtering-strategy.component.scss'], templateUrl: 'hierarchical-grid-formatted-filtering-strategy.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxRowIslandComponent] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-lod/hierarchical-grid-lod.component.ts b/src/app/hierarchical-grid/hierarchical-grid-lod/hierarchical-grid-lod.component.ts index 6a236613db..02b5f64f38 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-lod/hierarchical-grid-lod.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-lod/hierarchical-grid-lod.component.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, Component, OnInit, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { AfterViewInit, Component, OnInit, ViewChild, inject } from '@angular/core'; import { IGX_HIERARCHICAL_GRID_DIRECTIVES, IGridCreatedEventArgs, IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxColumnComponent } from 'igniteui-angular/grids/core'; import { EntityType, FilteringExpressionsTree, FilteringLogic, IgxNumberFilteringOperand, IgxStringFilteringOperand } from 'igniteui-angular/core'; @@ -11,7 +11,6 @@ const API_ENDPOINT = 'https://data-northwind.indigo.design'; selector: 'app-hierarchical-grid-lod', styleUrls: ['./hierarchical-grid-lod.component.scss'], templateUrl: './hierarchical-grid-lod.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IGX_HIERARCHICAL_GRID_DIRECTIVES, IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxRowIslandComponent] }) export class HierarchicalGridLoDSampleComponent implements OnInit, AfterViewInit { diff --git a/src/app/hierarchical-grid/hierarchical-grid-multi-cell-style/hierarchical-grid-multi-cell-style.component.ts b/src/app/hierarchical-grid/hierarchical-grid-multi-cell-style/hierarchical-grid-multi-cell-style.component.ts index 34e9ad773d..e74592731a 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-multi-cell-style/hierarchical-grid-multi-cell-style.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-multi-cell-style/hierarchical-grid-multi-cell-style.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit } from '@angular/core'; import { CUSTOMERS } from '../../data/hierarchical-data'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -8,7 +8,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-multi-cell-style', styleUrls: ['./hierarchical-grid-multi-cell-style.component.scss'], templateUrl: 'hierarchical-grid-multi-cell-style.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxRowIslandComponent] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-multi-column-header-template/hierarchical-grid-multi-column-template.component.ts b/src/app/hierarchical-grid/hierarchical-grid-multi-column-header-template/hierarchical-grid-multi-column-template.component.ts index 8b00150fdc..573e8b172a 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-multi-column-header-template/hierarchical-grid-multi-column-template.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-multi-column-header-template/hierarchical-grid-multi-column-template.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxColumnComponent, IgxColumnGroupComponent } from 'igniteui-angular/grids/core'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-multi-column-template', styleUrls: ['./hierarchical-grid-multi-column-template.component.scss'], templateUrl: 'hierarchical-grid-multi-column-template.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxIconComponent, IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxColumnGroupComponent, IgxRowIslandComponent] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-multi-column-headers-export/hierarchical-grid-multi-column-export.component.ts b/src/app/hierarchical-grid/hierarchical-grid-multi-column-headers-export/hierarchical-grid-multi-column-export.component.ts index d5b04a7314..6e786d56a7 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-multi-column-headers-export/hierarchical-grid-multi-column-export.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-multi-column-headers-export/hierarchical-grid-multi-column-export.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit } from '@angular/core'; import { IgxColumnComponent, IgxColumnGroupComponent, IgxExporterEvent, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarExporterComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent } from 'igniteui-angular/grids/core'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxSwitchComponent } from 'igniteui-angular/switch'; @@ -10,7 +10,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-hierarchical-grid-multi-column-export', styleUrls: ['./hierarchical-grid-multi-column-export.component.scss'], templateUrl: 'hierarchical-grid-multi-column-export.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxGridToolbarActionsComponent, IgxSwitchComponent, FormsModule, IgxGridToolbarPinningComponent, IgxGridToolbarHidingComponent, IgxGridToolbarExporterComponent, IgxColumnGroupComponent, IgxColumnComponent, IgxRowIslandComponent] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-multi-column-headers-styling/hierarchical-grid-multi-column-styling.component.ts b/src/app/hierarchical-grid/hierarchical-grid-multi-column-headers-styling/hierarchical-grid-multi-column-styling.component.ts index e8b7504918..1a7014a8bc 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-multi-column-headers-styling/hierarchical-grid-multi-column-styling.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-multi-column-headers-styling/hierarchical-grid-multi-column-styling.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit } from '@angular/core'; import { CUSTOMERS } from '../../data/hierarchical-data'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxColumnComponent, IgxColumnGroupComponent } from 'igniteui-angular/grids/core'; @@ -8,7 +8,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-multi-column-styling', styleUrls: ['./hierarchical-grid-multi-column-styling.component.scss'], templateUrl: 'hierarchical-grid-multi-column-styling.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxColumnGroupComponent, IgxRowIslandComponent] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-multi-column-headers/hierarchical-grid-multi-column.component.ts b/src/app/hierarchical-grid/hierarchical-grid-multi-column-headers/hierarchical-grid-multi-column.component.ts index 1254f6e3b0..f7bfbb72d8 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-multi-column-headers/hierarchical-grid-multi-column.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-multi-column-headers/hierarchical-grid-multi-column.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxColumnComponent, IgxColumnGroupComponent } from 'igniteui-angular/grids/core'; import { IgxButtonDirective } from 'igniteui-angular/directives'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-multi-column', styleUrls: ['./hierarchical-grid-multi-column.component.scss'], templateUrl: 'hierarchical-grid-multi-column.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxColumnGroupComponent, IgxRowIslandComponent, IgxButtonDirective] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-multi-row-drag/hierarchical-grid-multi-row-drag.component.ts b/src/app/hierarchical-grid/hierarchical-grid-multi-row-drag/hierarchical-grid-multi-row-drag.component.ts index e4390cb00e..4e042abc40 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-multi-row-drag/hierarchical-grid-multi-row-drag.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-multi-row-drag/hierarchical-grid-multi-row-drag.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { GridSelectionMode, IgxColumnComponent, IgxRowDragGhostDirective, RowType } from 'igniteui-angular/grids/core'; import { IDropDroppedEventArgs, IgxDropDirective } from 'igniteui-angular/directives'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; @@ -10,7 +10,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-multi-row-drag', styleUrls: ['./hierarchical-grid-multi-row-drag.component.scss'], templateUrl: 'hierarchical-grid-multi-row-drag.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxDropDirective, IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxRowIslandComponent, IgxRowDragGhostDirective, IgxIconComponent] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-pager-sample/hierarchical-grid-pager-sample.component.ts b/src/app/hierarchical-grid/hierarchical-grid-pager-sample/hierarchical-grid-pager-sample.component.ts index cb7f3b60dd..bc468441f3 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-pager-sample/hierarchical-grid-pager-sample.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-pager-sample/hierarchical-grid-pager-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, AfterViewInit, PLATFORM_ID, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild, AfterViewInit, PLATFORM_ID, inject } from '@angular/core'; import { IPaginatorResourceStrings } from 'igniteui-angular/core'; import { IgxPageNavigationComponent, IgxPageSizeSelectorComponent, IgxPaginatorComponent, IgxPaginatorContentDirective, IgxPaginatorDirective } from 'igniteui-angular/paginator'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; @@ -14,7 +14,6 @@ import { isPlatformBrowser } from '@angular/common'; selector: 'app-hierarchical-grid-pager-sample', styleUrls: ['./hierarchical-grid-pager-sample.component.scss'], templateUrl: './hierarchical-grid-pager-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxPaginatorComponent, IgxPaginatorContentDirective, IgxPageSizeSelectorComponent, IgxPageNavigationComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxRowIslandComponent, IgxPaginatorDirective, IgxSwitchComponent, FormsModule] }) export class HierarchicalGridPagerSampleComponent implements OnInit, AfterViewInit { diff --git a/src/app/hierarchical-grid/hierarchical-grid-paging-style/hierarchical-grid-paging-style.component.ts b/src/app/hierarchical-grid/hierarchical-grid-paging-style/hierarchical-grid-paging-style.component.ts index b9aa5640ad..e0898032a1 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-paging-style/hierarchical-grid-paging-style.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-paging-style/hierarchical-grid-paging-style.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { SINGERS } from '../../data/singersData'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxPaginatorComponent, IgxPaginatorDirective } from 'igniteui-angular/paginator'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-paging', styleUrls: ['./hierarchical-grid-paging-style.component.scss'], templateUrl: 'hierarchical-grid-paging-style.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxPaginatorComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxRowIslandComponent, IgxPaginatorDirective] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-paging/hierarchical-grid-paging.component.ts b/src/app/hierarchical-grid/hierarchical-grid-paging/hierarchical-grid-paging.component.ts index 755b62eda3..2ed83119f3 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-paging/hierarchical-grid-paging.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-paging/hierarchical-grid-paging.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { SINGERS } from '../../data/singersData'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-paging', styleUrls: ['./hierarchical-grid-paging.component.scss'], templateUrl: 'hierarchical-grid-paging.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxRowIslandComponent, IgxPaginatorDirective, IgxPaginatorComponent] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-paging/hierarchical-grid-remote-paging.component.ts b/src/app/hierarchical-grid/hierarchical-grid-paging/hierarchical-grid-remote-paging.component.ts index cb18bd2dc9..81d9a01f24 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-paging/hierarchical-grid-remote-paging.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-paging/hierarchical-grid-remote-paging.component.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, Component, OnDestroy, OnInit, TemplateRef, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { AfterViewInit, Component, OnDestroy, OnInit, TemplateRef, ViewChild, inject } from '@angular/core'; import { GridPagingMode, IgxColumnComponent } from 'igniteui-angular/grids/core'; import { IGridCreatedEventArgs, IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxPageNavigationComponent, IgxPageSizeSelectorComponent, IgxPaginatorComponent, IgxPaginatorContentDirective, IgxPaginatorDirective } from 'igniteui-angular/paginator'; @@ -12,7 +12,6 @@ import { AsyncPipe } from '@angular/common'; selector: 'app-hierarchical-grid-remote-paging', styleUrls: ['./hierarchical-grid-remote-paging.component.scss'], templateUrl: 'hierarchical-grid-remote-paging.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxRowIslandComponent, IgxPaginatorDirective, IgxPaginatorComponent, IgxPaginatorContentDirective, IgxPageSizeSelectorComponent, IgxPageNavigationComponent, AsyncPipe] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-remote-paging-default-template/hierarchical-grid-remote-paging-default-template.component.ts b/src/app/hierarchical-grid/hierarchical-grid-remote-paging-default-template/hierarchical-grid-remote-paging-default-template.component.ts index 4ce4b6fad5..46bb0e283a 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-remote-paging-default-template/hierarchical-grid-remote-paging-default-template.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-remote-paging-default-template/hierarchical-grid-remote-paging-default-template.component.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, Component, OnDestroy, OnInit, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { AfterViewInit, Component, OnDestroy, OnInit, ViewChild, inject } from '@angular/core'; import { GridPagingMode, IgxColumnComponent } from 'igniteui-angular/grids/core'; import { IGridCreatedEventArgs, IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxPaginatorComponent, IgxPaginatorDirective } from 'igniteui-angular/paginator'; @@ -10,7 +10,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-remote-paging-default-template', styleUrls: ['./hierarchical-grid-remote-paging-default-template.component.scss'], templateUrl: 'hierarchical-grid-remote-paging-default-template.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxPaginatorComponent, IgxColumnComponent, IgxRowIslandComponent, IgxPaginatorDirective] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-resize-line-styling/hierarchical-grid-resize-line-styling.component.ts b/src/app/hierarchical-grid/hierarchical-grid-resize-line-styling/hierarchical-grid-resize-line-styling.component.ts index b679c5fc59..d14a751db8 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-resize-line-styling/hierarchical-grid-resize-line-styling.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-resize-line-styling/hierarchical-grid-resize-line-styling.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { SINGERS } from '../../data/singersData'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -8,7 +8,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-resize-line-styling', styleUrls: ['./hierarchical-grid-resize-line-styling.component.scss'], templateUrl: './hierarchical-grid-resize-line-styling.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxRowIslandComponent] }) export class HGridResizeLineStylingComponent { diff --git a/src/app/hierarchical-grid/hierarchical-grid-row-drag-base/hierarchical-row-drag-base.component.ts b/src/app/hierarchical-grid/hierarchical-grid-row-drag-base/hierarchical-row-drag-base.component.ts index 95cb73d60c..4b72194622 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-row-drag-base/hierarchical-row-drag-base.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-row-drag-base/hierarchical-row-drag-base.component.ts @@ -1,5 +1,5 @@ /* eslint-disable @typescript-eslint/naming-convention */ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { IDropDroppedEventArgs, IgxDropDirective } from 'igniteui-angular/directives'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxColumnComponent, RowType } from 'igniteui-angular/grids/core'; @@ -17,7 +17,6 @@ enum DragIcon { selector: 'app-hierarchical-row-drag-base', styleUrls: ['./hierarchical-row-drag-base.component.scss'], templateUrl: 'hierarchical-row-drag-base.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxDropDirective, IgxIconComponent, IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxRowIslandComponent] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-row-drag/hierarchical-grid-row-drag.component.ts b/src/app/hierarchical-grid/hierarchical-grid-row-drag/hierarchical-grid-row-drag.component.ts index e681c94dd5..b90baae786 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-row-drag/hierarchical-grid-row-drag.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-row-drag/hierarchical-grid-row-drag.component.ts @@ -1,5 +1,5 @@ /* eslint-disable @typescript-eslint/naming-convention */ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { IDropDroppedEventArgs, IgxDropDirective } from 'igniteui-angular/directives'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxColumnComponent, IgxDragIndicatorIconDirective, RowType } from 'igniteui-angular/grids/core'; @@ -17,7 +17,6 @@ enum DragIcon { selector: 'app-hierarchical-grid-row-drag', styleUrls: ['./hierarchical-grid-row-drag.component.scss'], templateUrl: 'hierarchical-grid-row-drag.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxDropDirective, IgxIconComponent, IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxRowIslandComponent, IgxDragIndicatorIconDirective] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-row-edit-style/hierarchical-grid-row-edit-style.component.ts b/src/app/hierarchical-grid/hierarchical-grid-row-edit-style/hierarchical-grid-row-edit-style.component.ts index af38e72bcd..2aa40e6fc2 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-row-edit-style/hierarchical-grid-row-edit-style.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-row-edit-style/hierarchical-grid-row-edit-style.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { SINGERS } from '../../data/singersData'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxCellTemplateDirective, IgxColumnComponent, IgxRowEditActionsDirective, IgxRowEditTabStopDirective, IgxRowEditTextDirective } from 'igniteui-angular/grids/core'; @@ -10,7 +10,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-row-edit-style', styleUrls: ['./hierarchical-grid-row-edit-style.component.scss'], templateUrl: 'hierarchical-grid-row-edit-style.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxRowIslandComponent, IgxRowEditTextDirective, IgxRowEditActionsDirective, IgxIconButtonDirective, IgxRowEditTabStopDirective, IgxIconComponent] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-row-editing/hierarchical-grid-row-editing.component.ts b/src/app/hierarchical-grid/hierarchical-grid-row-editing/hierarchical-grid-row-editing.component.ts index 4198c9fdbc..a57d89d78f 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-row-editing/hierarchical-grid-row-editing.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-row-editing/hierarchical-grid-row-editing.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { SINGERS } from '../../data/singersData'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -8,7 +8,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-row-editing', styleUrls: ['./hierarchical-grid-row-editing.component.scss'], templateUrl: 'hierarchical-grid-row-editing.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxRowIslandComponent] }) export class HGridRowEditingSampleComponent { diff --git a/src/app/hierarchical-grid/hierarchical-grid-row-pinning-extra-column/hierarchical-grid-row-pinning-extra-column.component.ts b/src/app/hierarchical-grid/hierarchical-grid-row-pinning-extra-column/hierarchical-grid-row-pinning-extra-column.component.ts index 2a3a2435c7..b130ce198e 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-row-pinning-extra-column/hierarchical-grid-row-pinning-extra-column.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-row-pinning-extra-column/hierarchical-grid-row-pinning-extra-column.component.ts @@ -1,4 +1,4 @@ -import { Component, AfterViewInit, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, AfterViewInit, inject } from '@angular/core'; import { ColumnPinningPosition } from 'igniteui-angular/core'; import { IgxIconComponent, IgxIconService } from 'igniteui-angular/icon'; import { IPinningConfig, IgxCellTemplateDirective, IgxColumnComponent, RowPinningPosition, RowType } from 'igniteui-angular/grids/core'; @@ -14,7 +14,6 @@ const FILTERING_ICONS_FONT_SET = 'filtering-icons'; selector: 'app-hierarchical-grid-row-pinning-extra-column', styleUrls: ['./hierarchical-grid-row-pinning-extra-column.component.scss'], templateUrl: 'hierarchical-grid-row-pinning-extra-column.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSwitchComponent, IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxIconComponent, IgxRowIslandComponent] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-row-pinning-styling/hierarchical-grid-row-pinning-styling.component.ts b/src/app/hierarchical-grid/hierarchical-grid-row-pinning-styling/hierarchical-grid-row-pinning-styling.component.ts index 75c4acd9cf..0bcd26d626 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-row-pinning-styling/hierarchical-grid-row-pinning-styling.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-row-pinning-styling/hierarchical-grid-row-pinning-styling.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { ColumnPinningPosition } from 'igniteui-angular/core'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IPinningConfig, IgxCellTemplateDirective, IgxColumnComponent, IgxGridPinningActionsComponent, RowPinningPosition } from 'igniteui-angular/grids/core'; @@ -10,7 +10,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-row-pinning-styling', styleUrls: ['./hierarchical-grid-row-pinning-styling.component.scss'], templateUrl: 'hierarchical-grid-row-pinning-styling.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxActionStripComponent, IgxGridPinningActionsComponent, IgxRowIslandComponent] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-row-pinning/hierarchical-grid-row-pinning.component.ts b/src/app/hierarchical-grid/hierarchical-grid-row-pinning/hierarchical-grid-row-pinning.component.ts index baaf37f08e..65251546e3 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-row-pinning/hierarchical-grid-row-pinning.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-row-pinning/hierarchical-grid-row-pinning.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { ColumnPinningPosition } from 'igniteui-angular/core'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IPinningConfig, IgxCellTemplateDirective, IgxColumnComponent, IgxGridPinningActionsComponent, RowPinningPosition } from 'igniteui-angular/grids/core'; @@ -11,7 +11,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-row-pinning', styleUrls: ['./hierarchical-grid-row-pinning.component.scss'], templateUrl: 'hierarchical-grid-row-pinning.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSwitchComponent, IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxActionStripComponent, IgxGridPinningActionsComponent, IgxRowIslandComponent] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-row-reorder/hierarchical-grid-row-reorder.component.ts b/src/app/hierarchical-grid/hierarchical-grid-row-reorder/hierarchical-grid-row-reorder.component.ts index 24fa3b7c9f..8b36d09049 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-row-reorder/hierarchical-grid-row-reorder.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-row-reorder/hierarchical-grid-row-reorder.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { IDropDroppedEventArgs, IgxDropDirective } from 'igniteui-angular/directives'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { GridSelectionMode, IgxColumnComponent, RowType } from 'igniteui-angular/grids/core'; @@ -10,7 +10,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-row-reorder', styleUrls: ['./hierarchical-grid-row-reorder.component.scss'], templateUrl: 'hierarchical-grid-row-reorder.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxDropDirective, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxRowIslandComponent] }) export class HGridRowReorderComponent { diff --git a/src/app/hierarchical-grid/hierarchical-grid-sample-both-sides-pinning/hierarchical-grid-both-sides-pinning.component.ts b/src/app/hierarchical-grid/hierarchical-grid-sample-both-sides-pinning/hierarchical-grid-both-sides-pinning.component.ts index 82129b4174..b5cf3dac41 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-sample-both-sides-pinning/hierarchical-grid-both-sides-pinning.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-sample-both-sides-pinning/hierarchical-grid-both-sides-pinning.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ViewEncapsulation, ChangeDetectionStrategy } from "@angular/core"; +import { Component, OnInit, ViewChild, ViewEncapsulation } from "@angular/core"; import { ColumnPinningPosition, ColumnType } from 'igniteui-angular/core'; import { IPinningConfig, IgxCellHeaderTemplateDirective, IgxCellTemplateDirective, IgxColumnComponent, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarTitleComponent } from 'igniteui-angular/grids/core'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; @@ -15,7 +15,6 @@ import { DatePipe } from "@angular/common"; selector: "hierarchical-grid-sample-both-side-pinning", styleUrls: ["hierarchical-grid-both-sides-pinning.component.scss"], templateUrl: "hierarchical-grid-both-sides-pinning.component.html", - changeDetection: ChangeDetectionStrategy.Eager, imports: [ IgxHierarchicalGridComponent, IgxGridToolbarComponent, diff --git a/src/app/hierarchical-grid/hierarchical-grid-sample-right-pinning/hierarchical-grid-right-pinning.component.ts b/src/app/hierarchical-grid/hierarchical-grid-sample-right-pinning/hierarchical-grid-right-pinning.component.ts index 3995efc69d..63a3e074d6 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-sample-right-pinning/hierarchical-grid-right-pinning.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-sample-right-pinning/hierarchical-grid-right-pinning.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ViewEncapsulation, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild, ViewEncapsulation } from '@angular/core'; import { ColumnPinningPosition } from 'igniteui-angular/core'; import { IPinningConfig, IgxCellHeaderTemplateDirective, IgxCellTemplateDirective, IgxColumnComponent, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarPinningComponent } from 'igniteui-angular/grids/core'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; @@ -16,7 +16,6 @@ import { DatePipe } from '@angular/common'; selector: 'hierarchical-grid-sample', styleUrls: ['hierarchical-grid-right-pinning.component.scss'], templateUrl: 'hierarchical-grid-right-pinning.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxGridToolbarComponent, IgxGridToolbarActionsComponent, IgxGridToolbarPinningComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxTooltipTargetDirective, IgxTooltipDirective, IgxAvatarComponent, IgxCellHeaderTemplateDirective, IgxIconComponent, IgxRowIslandComponent, DatePipe] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-save-state/about.component.ts b/src/app/hierarchical-grid/hierarchical-grid-save-state/about.component.ts index e1dc397084..913b20e3cd 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-save-state/about.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-save-state/about.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxButtonDirective } from 'igniteui-angular/directives'; import { RouterLink } from '@angular/router'; @Component({ selector: 'app-about', templateUrl: './about.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, RouterLink] }) export class HGridAboutComponent { diff --git a/src/app/hierarchical-grid/hierarchical-grid-save-state/hGrid-state.component.ts b/src/app/hierarchical-grid/hierarchical-grid-save-state/hGrid-state.component.ts index c3695f6ca1..e8eddf8549 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-save-state/hGrid-state.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-save-state/hGrid-state.component.ts @@ -1,8 +1,8 @@ -import { Component, OnInit, ViewChild, ViewChildren, QueryList, AfterViewInit, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild, ViewChildren, QueryList, AfterViewInit, inject } from '@angular/core'; import { NavigationStart, Router, RouterLink } from '@angular/router'; -import { GridFeatures, IGridState, IGridStateOptions, IgxCellTemplateDirective, IgxColumnComponent, IgxGridStateDirective, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent, IgxNumberSummaryOperand } from 'igniteui-angular/grids/core'; +import { GridFeatures, IGridState, IGridStateOptions, IgxCellTemplateDirective, IgxColumnComponent, IgxGridStateDirective, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent } from 'igniteui-angular/grids/core'; +import { IgxNumberSummaryOperand, IgxSummaryResult } from 'igniteui-angular/core'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; -import { IgxSummaryResult } from 'igniteui-angular/core'; import { IgxCheckboxComponent } from 'igniteui-angular/checkbox'; import { IgxButtonDirective } from 'igniteui-angular/directives'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -30,7 +30,6 @@ class MySummary { selector: 'app-hgrid', styleUrls: ['./hGrid-state.component.scss'], templateUrl: './hGrid-state.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxIconComponent, RouterLink, IgxCheckboxComponent, IgxHierarchicalGridComponent, IgxGridStateDirective, IgxPreventDocumentScrollDirective, IgxPaginatorComponent, IgxGridToolbarComponent, IgxGridToolbarActionsComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxRowIslandComponent] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-selection-template-numbers/hierarchical-grid-selection-template-numbers.component.ts b/src/app/hierarchical-grid/hierarchical-grid-selection-template-numbers/hierarchical-grid-selection-template-numbers.component.ts index 55e12513c8..c0e8dee708 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-selection-template-numbers/hierarchical-grid-selection-template-numbers.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-selection-template-numbers/hierarchical-grid-selection-template-numbers.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { SINGERS } from '../../data/singersData'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxPaginatorComponent } from 'igniteui-angular/paginator'; @@ -10,7 +10,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-selection-template-numbers', styleUrls: ['./hierarchical-grid-selection-template-numbers.component.scss'], templateUrl: 'hierarchical-grid-selection-template-numbers.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxPaginatorComponent, IgxColumnComponent, IgxRowIslandComponent, IgxHeadSelectorDirective, IgxRowSelectorDirective, IgxCheckboxComponent] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-selection/hierarchical-grid-selection.component.ts b/src/app/hierarchical-grid/hierarchical-grid-selection/hierarchical-grid-selection.component.ts index 6e4646dde8..91c2f62a38 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-selection/hierarchical-grid-selection.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-selection/hierarchical-grid-selection.component.ts @@ -1,4 +1,4 @@ -import { Component, OnDestroy, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnDestroy, OnInit, ViewChild } from '@angular/core'; import { GridSelectionMode, IRowSelectionEventArgs, IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; import { IgxSnackbarComponent } from 'igniteui-angular/snackbar'; import { IgxSwitchComponent } from 'igniteui-angular/switch'; @@ -14,7 +14,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-selection', styleUrls: ['./hierarchical-grid-selection.component.scss'], templateUrl: 'hierarchical-grid-selection.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSwitchComponent, FormsModule, IgxButtonGroupComponent, IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxRowIslandComponent, IgxSnackbarComponent, IgxIconComponent] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-sorting-styling/hierarchical-grid-sorting-styling.component.ts b/src/app/hierarchical-grid/hierarchical-grid-sorting-styling/hierarchical-grid-sorting-styling.component.ts index 344ec75f92..2453e1a732 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-sorting-styling/hierarchical-grid-sorting-styling.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-sorting-styling/hierarchical-grid-sorting-styling.component.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { AfterViewInit, Component, OnInit, ViewChild } from '@angular/core'; import { DefaultSortingStrategy, SortingDirection } from 'igniteui-angular/core'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-sorting-styling', styleUrls: ['./hierarchical-grid-sorting-styling.component.scss'], templateUrl: 'hierarchical-grid-sorting-styling.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxRowIslandComponent] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-sorting/hgrid-contextmenu/hgrid-contextmenu.component.ts b/src/app/hierarchical-grid/hierarchical-grid-sorting/hgrid-contextmenu/hgrid-contextmenu.component.ts index 8db9cc4194..cd56eac388 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-sorting/hgrid-contextmenu/hgrid-contextmenu.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-sorting/hgrid-contextmenu/hgrid-contextmenu.component.ts @@ -1,4 +1,4 @@ -import { Component, Input, ChangeDetectionStrategy } from '@angular/core'; +import { Component, Input } from '@angular/core'; import { SortingDirection } from 'igniteui-angular/core'; import { IgxIconComponent } from 'igniteui-angular/icon'; import { NgStyle } from '@angular/common'; @@ -7,7 +7,6 @@ import { NgStyle } from '@angular/common'; selector: 'app-hgrid-contextmenu', styleUrls: ['./hgrid-contextmenu.component.scss'], templateUrl: './hgrid-contextmenu.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [NgStyle, IgxIconComponent] }) export class HGridContextmenuComponent { diff --git a/src/app/hierarchical-grid/hierarchical-grid-sorting/hierarchical-grid-sorting.component.ts b/src/app/hierarchical-grid/hierarchical-grid-sorting/hierarchical-grid-sorting.component.ts index 9615032eb2..277e08dc62 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-sorting/hierarchical-grid-sorting.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-sorting/hierarchical-grid-sorting.component.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { AfterViewInit, Component, OnInit, ViewChild } from '@angular/core'; import { DefaultSortingStrategy, SortingDirection } from 'igniteui-angular/core'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -11,7 +11,6 @@ import { HGridContextmenuComponent } from './hgrid-contextmenu/hgrid-contextmenu selector: 'app-hierarchical-grid-sorting', styleUrls: ['./hierarchical-grid-sorting.component.scss'], templateUrl: 'hierarchical-grid-sorting.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxRowIslandComponent, HGridContextmenuComponent] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-styling/hierarchical-grid-styling.component.ts b/src/app/hierarchical-grid/hierarchical-grid-styling/hierarchical-grid-styling.component.ts index 9ed63fd0f6..fcc915ddfc 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-styling/hierarchical-grid-styling.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-styling/hierarchical-grid-styling.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { SINGERS } from '../../data/singersData'; @@ -8,7 +8,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-styling', styleUrls: ['./hierarchical-grid-styling.component.scss'], templateUrl: 'hierarchical-grid-styling.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxRowIslandComponent] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-summary-formatter/hierarchical-grid-summary-formatter.component.ts b/src/app/hierarchical-grid/hierarchical-grid-summary-formatter/hierarchical-grid-summary-formatter.component.ts index 0e5a8f6412..b95f46827a 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-summary-formatter/hierarchical-grid-summary-formatter.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-summary-formatter/hierarchical-grid-summary-formatter.component.ts @@ -1,8 +1,8 @@ import { DatePipe } from '@angular/common'; -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; -import { IgxColumnComponent, IgxDateSummaryOperand, IgxSummaryOperand } from 'igniteui-angular/grids/core'; +import { Component, ViewChild } from '@angular/core'; +import { IgxColumnComponent } from 'igniteui-angular/grids/core'; +import { IgxDateSummaryOperand, IgxSummaryOperand, IgxSummaryResult } from 'igniteui-angular/core'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; -import { IgxSummaryResult } from 'igniteui-angular/core'; import { SINGERS } from '../../data/singersData'; import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scroll.directive'; @@ -10,7 +10,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-summary-formatter', styleUrls: ['./hierarchical-grid-summary-formatter.component.scss'], templateUrl: 'hierarchical-grid-summary-formatter.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxRowIslandComponent] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-summary-styling/hierarchical-grid-summary-styling.component.ts b/src/app/hierarchical-grid/hierarchical-grid-summary-styling/hierarchical-grid-summary-styling.component.ts index 219aa02d44..9165d13aa8 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-summary-styling/hierarchical-grid-summary-styling.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-summary-styling/hierarchical-grid-summary-styling.component.ts @@ -1,6 +1,6 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; -import { IgxCellTemplateDirective, IgxColumnComponent, IgxNumberSummaryOperand } from 'igniteui-angular/grids/core'; -import { IgxSummaryResult } from 'igniteui-angular/core'; +import { Component } from '@angular/core'; +import { IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; +import { IgxNumberSummaryOperand, IgxSummaryResult } from 'igniteui-angular/core'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { SINGERS } from '../../data/singersData'; import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scroll.directive'; @@ -46,7 +46,6 @@ class MyChildSummary { selector: 'app-hierarchical-grid-summary-styling', styleUrls: ['./hierarchical-grid-summary-styling.component.scss'], templateUrl: 'hierarchical-grid-summary-styling.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxRowIslandComponent] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-summary/hierarchical-grid-summary.component.ts b/src/app/hierarchical-grid/hierarchical-grid-summary/hierarchical-grid-summary.component.ts index 0d37bb7847..3f7ca5947f 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-summary/hierarchical-grid-summary.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-summary/hierarchical-grid-summary.component.ts @@ -1,7 +1,7 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; -import { IgxCellTemplateDirective, IgxColumnComponent, IgxNumberSummaryOperand } from 'igniteui-angular/grids/core'; -import { IgxSummaryResult } from 'igniteui-angular/core'; +import { IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; +import { IgxNumberSummaryOperand, IgxSummaryResult } from 'igniteui-angular/core'; import { SINGERS } from '../../data/singersData'; import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scroll.directive'; @@ -46,7 +46,6 @@ class MyChildSummary { selector: 'app-hierarchical-grid-summary', styleUrls: ['./hierarchical-grid-summary.component.scss'], templateUrl: 'hierarchical-grid-summary.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxRowIslandComponent] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-toolbar-style/hierarchical-grid-toolbar-style.component.ts b/src/app/hierarchical-grid/hierarchical-grid-toolbar-style/hierarchical-grid-toolbar-style.component.ts index 398e36e64e..07b59c0933 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-toolbar-style/hierarchical-grid-toolbar-style.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-toolbar-style/hierarchical-grid-toolbar-style.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { SINGERS } from '../../data/singersData'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxCellTemplateDirective, IgxColumnComponent, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent, IgxGridToolbarTitleComponent } from 'igniteui-angular/grids/core'; @@ -8,7 +8,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-toolbar-style', styleUrls: ['./hierarchical-grid-toolbar-style.component.scss'], templateUrl: './hierarchical-grid-toolbar-style.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxGridToolbarTitleComponent, IgxGridToolbarActionsComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxRowIslandComponent] }) export class HierarchicalGridToolbarStyleComponent { diff --git a/src/app/hierarchical-grid/hierarchical-grid-toolbar/hierarchical-grid-toolbar-custom.component.ts b/src/app/hierarchical-grid/hierarchical-grid-toolbar/hierarchical-grid-toolbar-custom.component.ts index 95e25ec859..5d325f6616 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-toolbar/hierarchical-grid-toolbar-custom.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-toolbar/hierarchical-grid-toolbar-custom.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { SINGERS } from '../../data/singersData'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxCellTemplateDirective, IgxColumnComponent, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarDirective, IgxGridToolbarHidingComponent, IgxGridToolbarTitleComponent } from 'igniteui-angular/grids/core'; @@ -10,7 +10,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-toolbar-custom', styleUrls: ['./hierarchical-grid-toolbar-custom.component.scss'], templateUrl: 'hierarchical-grid-toolbar-custom.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxGridToolbarTitleComponent, IgxGridToolbarActionsComponent, IgxButtonDirective, IgxRippleDirective, IgxIconComponent, IgxGridToolbarHidingComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxRowIslandComponent, IgxGridToolbarDirective] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-toolbar/hierarchical-grid-toolbar-options.component.ts b/src/app/hierarchical-grid/hierarchical-grid-toolbar/hierarchical-grid-toolbar-options.component.ts index 151d610239..4016b371d9 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-toolbar/hierarchical-grid-toolbar-options.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-toolbar/hierarchical-grid-toolbar-options.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { SINGERS } from '../../data/singersData'; import { IgxInputDirective, IgxInputGroupComponent, IgxLabelDirective } from 'igniteui-angular/input-group'; import { IgxSwitchComponent } from 'igniteui-angular/switch'; @@ -12,7 +12,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-toolbar-options', styleUrls: ['./hierarchical-grid-toolbar-options.component.scss'], templateUrl: 'hierarchical-grid-toolbar-options.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxInputGroupComponent, IgxLabelDirective, FormsModule, IgxInputDirective, IgxSwitchComponent, IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxGridToolbarTitleComponent, IgxGridToolbarActionsComponent, IgxGridToolbarAdvancedFilteringComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent, IgxGridToolbarExporterComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxRowIslandComponent] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-toolbar/hierarchical-grid-toolbar-title.component.ts b/src/app/hierarchical-grid/hierarchical-grid-toolbar/hierarchical-grid-toolbar-title.component.ts index 18b094c596..4942cdce5e 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-toolbar/hierarchical-grid-toolbar-title.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-toolbar/hierarchical-grid-toolbar-title.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { SINGERS } from '../../data/singersData'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxCellTemplateDirective, IgxColumnComponent, IgxGridToolbarComponent, IgxGridToolbarDirective, IgxGridToolbarTitleComponent } from 'igniteui-angular/grids/core'; @@ -8,7 +8,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-hierarchical-grid-toolbar-title', styleUrls: ['./hierarchical-grid-toolbar-title.component.scss'], templateUrl: 'hierarchical-grid-toolbar-title.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxGridToolbarTitleComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxRowIslandComponent, IgxGridToolbarDirective] }) diff --git a/src/app/hierarchical-grid/hierarchical-grid-validation-style/hierarchical-grid-validation-style.component.ts b/src/app/hierarchical-grid/hierarchical-grid-validation-style/hierarchical-grid-validation-style.component.ts index 7e0f412c5c..49871eb70b 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-validation-style/hierarchical-grid-validation-style.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-validation-style/hierarchical-grid-validation-style.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxCellValidationErrorDirective, IgxColumnComponent, IgxColumnRequiredValidatorDirective, RowType } from 'igniteui-angular/grids/core'; @@ -11,7 +11,6 @@ import { NgTemplateOutlet } from '@angular/common'; selector: 'app-hierarchical-grid-validation-style', styleUrls: ['./hierarchical-grid-validation-style.component.scss'], templateUrl: 'hierarchical-grid-validation-style.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxColumnRequiredValidatorDirective, IgxCellValidationErrorDirective, NgTemplateOutlet, IgxRowIslandComponent] }) export class HGridValidationStyleComponent { diff --git a/src/app/hierarchical-grid/hierarchical-grid-validator-service-extended/hierarchical-grid-validator-service-extended.component.ts b/src/app/hierarchical-grid/hierarchical-grid-validator-service-extended/hierarchical-grid-validator-service-extended.component.ts index 5458cc7a1a..fbcfefab77 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-validator-service-extended/hierarchical-grid-validator-service-extended.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-validator-service-extended/hierarchical-grid-validator-service-extended.component.ts @@ -1,4 +1,4 @@ -import { Component, Directive, Input, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, Directive, forwardRef, Input, ViewChild } from '@angular/core'; import { AbstractControl, NG_VALIDATORS, ValidationErrors, ValidatorFn, Validators } from '@angular/forms'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IGridFormGroupCreatedEventArgs, IgxCellValidationErrorDirective, IgxColumnComponent, IgxColumnRequiredValidatorDirective, IgxGridToolbarComponent, IgxGridToolbarDirective } from 'igniteui-angular/grids/core'; @@ -15,7 +15,7 @@ export function phoneFormatValidator(phoneReg: RegExp): ValidatorFn { @Directive({ selector: '[phoneFormat]', - providers: [{ provide: NG_VALIDATORS, useExisting: HGridPhoneFormatDirective, multi: true }] + providers: [{ provide: NG_VALIDATORS, useExisting: forwardRef(() => HGridPhoneFormatDirective), multi: true }] }) export class HGridPhoneFormatDirective extends Validators { @Input('phoneFormat') @@ -35,7 +35,6 @@ export function unique(value, index, self) { selector: 'app-hierarchical-grid-validator-service-extended', styleUrls: ['./hierarchical-grid-validator-service-extended.component.scss'], templateUrl: './hierarchical-grid-validator-service-extended.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxHierarchicalGridComponent, IgxColumnComponent, IgxColumnRequiredValidatorDirective, HGridPhoneFormatDirective, IgxCellValidationErrorDirective, NgTemplateOutlet, IgxRowIslandComponent, IgxGridToolbarDirective, IgxGridToolbarComponent, IgxButtonDirective] }) export class HierarchicalGridValidatorServiceExtendedComponent { diff --git a/src/app/hierarchical-grid/hierarchical-grid-validator-service/hierarchical-grid-validator-service.component.ts b/src/app/hierarchical-grid/hierarchical-grid-validator-service/hierarchical-grid-validator-service.component.ts index 32cf4b3cba..1c969657b8 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-validator-service/hierarchical-grid-validator-service.component.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-validator-service/hierarchical-grid-validator-service.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxSwitchComponent } from 'igniteui-angular/switch'; import { IgxColumnComponent, IgxColumnMaxValidatorDirective, IgxColumnMinValidatorDirective, IgxColumnRequiredValidatorDirective } from 'igniteui-angular/grids/core'; @@ -9,7 +9,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-hierarchical-grid-validator-service', styleUrls: ['./hierarchical-grid-validator-service.component.scss'], templateUrl: './hierarchical-grid-validator-service.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSwitchComponent, FormsModule, IgxHierarchicalGridComponent, IgxColumnComponent, IgxColumnRequiredValidatorDirective, IgxRowIslandComponent, IgxColumnMinValidatorDirective, IgxColumnMaxValidatorDirective] }) export class HierarchicalGridValidatorServiceComponent implements OnInit { diff --git a/src/app/home/home.component.ts b/src/app/home/home.component.ts index bab10f8ab0..5a8d2e5984 100644 --- a/src/app/home/home.component.ts +++ b/src/app/home/home.component.ts @@ -1,9 +1,8 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; @Component({ selector: 'app-home', styleUrls: ['./home.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, templateUrl: './home.component.html' }) export class HomeComponent { diff --git a/src/app/how-to/reactive-forms/reactive-forms.component.ts b/src/app/how-to/reactive-forms/reactive-forms.component.ts index e4c1404633..ffd68813f1 100644 --- a/src/app/how-to/reactive-forms/reactive-forms.component.ts +++ b/src/app/how-to/reactive-forms/reactive-forms.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { FormArray, FormBuilder, FormControl, FormGroup, Validators, FormsModule, ReactiveFormsModule } from '@angular/forms'; import { DateRange, IgxPickerToggleComponent } from 'igniteui-angular/core'; import { IRangeSliderValue, IgxSliderComponent } from 'igniteui-angular/slider'; @@ -38,7 +38,6 @@ export interface User{ selector: 'app-reactive-form', styleUrls: ['./reactive-forms.component.scss'], templateUrl: './reactive-forms.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [FormsModule, ReactiveFormsModule, IgxSelectComponent, IgxSelectGroupComponent, IgxSelectItemComponent, IgxLabelDirective, IgxSelectToggleIconDirective, IgxIconComponent, IgxInputGroupComponent, IgxInputDirective, IgxSuffixDirective, IgxHintDirective, IgxPrefixDirective, IgxComboComponent, IgxDatePickerComponent, IgxPickerToggleComponent, IgxTimePickerComponent, IgcFormControlDirective, IgxCheckboxComponent, IgxRadioGroupDirective, IgxRadioComponent, IgxSwitchComponent, IgxDateRangePickerComponent, IgxSliderComponent, IgxCalendarComponent, IgxCardComponent, IgxMonthPickerComponent, IgxButtonDirective, IgxRippleDirective] }) export class ReactiveFormsSampleComponent { diff --git a/src/app/index/docs-layout.component.scss b/src/app/index/docs-layout.component.scss index cf86a1df88..8b13789179 100644 --- a/src/app/index/docs-layout.component.scss +++ b/src/app/index/docs-layout.component.scss @@ -1,6 +1 @@ -::ng-deep { - .custom-body { - color: var(--ig-surface-500-contrast); - background: var(--ig-surface-500); - } -} + diff --git a/src/app/index/docs-layout.component.ts b/src/app/index/docs-layout.component.ts index 2678b93291..c1a426b4b2 100644 --- a/src/app/index/docs-layout.component.ts +++ b/src/app/index/docs-layout.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { RouterOutlet } from '@angular/router'; @Component({ selector: 'app-docs-layout', styleUrls: ['./docs-layout.component.scss'], template: ``, - changeDetection: ChangeDetectionStrategy.Eager, imports: [RouterOutlet] }) diff --git a/src/app/index/index.component.ts b/src/app/index/index.component.ts index 9b3c5935e0..31dc645f47 100644 --- a/src/app/index/index.component.ts +++ b/src/app/index/index.component.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, ChangeDetectorRef, Component, OnInit, ViewChild, DOCUMENT, PLATFORM_ID, inject, ChangeDetectionStrategy } from '@angular/core'; +import { AfterViewInit, ChangeDetectorRef, Component, OnInit, ViewChild, DOCUMENT, PLATFORM_ID, inject } from '@angular/core'; import { NavigationStart, Route, Router, RouterLinkActive, RouterLink, RouterOutlet } from '@angular/router'; import { IgxNavDrawerItemDirective, IgxNavDrawerTemplateDirective, IgxNavigationDrawerComponent } from 'igniteui-angular/navigation-drawer'; import { IgxTreeComponent, IgxTreeNodeComponent, IgxTreeNodeLinkDirective } from 'igniteui-angular/tree'; @@ -33,7 +33,6 @@ import { isPlatformBrowser } from '@angular/common'; selector: 'app-index', styleUrls: ['./index.component.scss'], templateUrl: './index.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxLayoutDirective, IgxNavigationDrawerComponent, IgxNavDrawerTemplateDirective, IgxNavDrawerItemDirective, IgxRippleDirective, RouterLinkActive, RouterLink, IgxIconComponent, IgxInputGroupComponent, IgxPrefixDirective, FormsModule, IgxInputDirective, IgxSuffixDirective, IgxTreeComponent, IgxTreeNodeComponent, IgxTreeNodeLinkDirective, IgxFlexDirective, IgxNavbarComponent, RouterOutlet] }) export class IndexComponent implements OnInit, AfterViewInit { diff --git a/src/app/interactions/chat/features-sample/features-sample.component.ts b/src/app/interactions/chat/features-sample/features-sample.component.ts index 6a5741022f..5c209dba0c 100644 --- a/src/app/interactions/chat/features-sample/features-sample.component.ts +++ b/src/app/interactions/chat/features-sample/features-sample.component.ts @@ -1,5 +1,5 @@ import { AsyncPipe } from '@angular/common'; -import { Component, effect, signal, viewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, effect, signal, viewChild } from '@angular/core'; import { IgxChatComponent, IgxChatMessageContextDirective, type IgxChatOptions } from 'igniteui-angular/chat'; import { MarkdownPipe } from 'igniteui-angular/chat-extras'; @@ -7,7 +7,6 @@ import { MarkdownPipe } from 'igniteui-angular/chat-extras'; selector: 'app-chat-features-sample', styleUrls: ['./features-sample.component.scss'], templateUrl: './features-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxChatComponent, IgxChatMessageContextDirective, AsyncPipe, MarkdownPipe] }) export class ChatFeaturesSampleComponent { diff --git a/src/app/interactions/chat/overview-sample/overview-sample.component.ts b/src/app/interactions/chat/overview-sample/overview-sample.component.ts index 0cc6e77a5c..1d3585a4e6 100644 --- a/src/app/interactions/chat/overview-sample/overview-sample.component.ts +++ b/src/app/interactions/chat/overview-sample/overview-sample.component.ts @@ -1,11 +1,10 @@ -import { Component, signal, ChangeDetectionStrategy } from '@angular/core'; +import { Component, signal } from '@angular/core'; import { IgxChatComponent, IgxChatOptions } from 'igniteui-angular/chat'; @Component({ selector: 'app-chat-overview-sample', styleUrls: ['./overview-sample.component.scss'], templateUrl: './overview-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxChatComponent] }) export class ChatOverviewSampleComponent { diff --git a/src/app/interactions/chat/styling-sample/styling-sample.component.ts b/src/app/interactions/chat/styling-sample/styling-sample.component.ts index 47ecca81ba..09205aa509 100644 --- a/src/app/interactions/chat/styling-sample/styling-sample.component.ts +++ b/src/app/interactions/chat/styling-sample/styling-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, signal, CUSTOM_ELEMENTS_SCHEMA, ChangeDetectionStrategy } from '@angular/core'; +import { Component, signal, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core'; import { IgxAvatarComponent } from 'igniteui-angular/avatar'; import { IgxChatComponent, IgxChatOptions } from 'igniteui-angular/chat'; @@ -7,7 +7,6 @@ import { IgxChatComponent, IgxChatOptions } from 'igniteui-angular/chat'; styleUrls: ['./styling-sample.component.scss'], templateUrl: './styling-sample.component.html', imports: [IgxAvatarComponent, IgxChatComponent], - changeDetection: ChangeDetectionStrategy.Eager, schemas: [CUSTOM_ELEMENTS_SCHEMA] }) diff --git a/src/app/interactions/dialog/dialog-sample-1/dialog-sample-1.component.ts b/src/app/interactions/dialog/dialog-sample-1/dialog-sample-1.component.ts index d9a93012ed..45895afcd7 100644 --- a/src/app/interactions/dialog/dialog-sample-1/dialog-sample-1.component.ts +++ b/src/app/interactions/dialog/dialog-sample-1/dialog-sample-1.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxButtonDirective, IgxRippleDirective } from 'igniteui-angular/directives'; import { IgxDialogComponent } from 'igniteui-angular/dialog'; @@ -6,7 +6,6 @@ import { IgxDialogComponent } from 'igniteui-angular/dialog'; selector: 'app-dialog-sample-1', styleUrls: ['./dialog-sample-1.component.scss'], templateUrl: './dialog-sample-1.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxRippleDirective, IgxDialogComponent] }) export class DialogSample1Component { } diff --git a/src/app/interactions/dialog/dialog-sample-2/dialog-sample-2.component.ts b/src/app/interactions/dialog/dialog-sample-2/dialog-sample-2.component.ts index b75a1405fb..667d646447 100644 --- a/src/app/interactions/dialog/dialog-sample-2/dialog-sample-2.component.ts +++ b/src/app/interactions/dialog/dialog-sample-2/dialog-sample-2.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxButtonDirective, IgxRippleDirective } from 'igniteui-angular/directives'; import { IgxDialogComponent } from 'igniteui-angular/dialog'; @@ -6,7 +6,6 @@ import { IgxDialogComponent } from 'igniteui-angular/dialog'; selector: 'app-dialog-sample-2', styleUrls: ['./dialog-sample-2.component.scss'], templateUrl: './dialog-sample-2.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxRippleDirective, IgxDialogComponent] }) export class DialogSample2Component { diff --git a/src/app/interactions/dialog/dialog-sample-3/dialog-sample-3.component.ts b/src/app/interactions/dialog/dialog-sample-3/dialog-sample-3.component.ts index 4ac8a58c83..df3e2e7e1d 100644 --- a/src/app/interactions/dialog/dialog-sample-3/dialog-sample-3.component.ts +++ b/src/app/interactions/dialog/dialog-sample-3/dialog-sample-3.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxButtonDirective, IgxRippleDirective } from 'igniteui-angular/directives'; import { IgxDialogActionsDirective, IgxDialogComponent, IgxDialogTitleDirective } from 'igniteui-angular/dialog'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -9,7 +9,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-dialog-sample-3', styleUrls: ['./dialog-sample-3.component.scss'], templateUrl: './dialog-sample-3.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxRippleDirective, IgxDialogComponent, IgxDialogTitleDirective, IgxIconComponent, FormsModule, IgxInputGroupComponent, IgxPrefixDirective, IgxLabelDirective, IgxInputDirective, IgxDialogActionsDirective] }) export class DialogSample3Component { diff --git a/src/app/interactions/dialog/dialog-styling-sample/dialog-styling-sample.component.ts b/src/app/interactions/dialog/dialog-styling-sample/dialog-styling-sample.component.ts index ae808b7b25..720f1a1d6e 100644 --- a/src/app/interactions/dialog/dialog-styling-sample/dialog-styling-sample.component.ts +++ b/src/app/interactions/dialog/dialog-styling-sample/dialog-styling-sample.component.ts @@ -1,5 +1,5 @@ import { useAnimation } from '@angular/animations'; -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { CloseScrollStrategy, GlobalPositionStrategy, IgxOverlayOutletDirective, PositionSettings } from 'igniteui-angular/core'; import { IgxDialogActionsDirective, IgxDialogComponent, IgxDialogTitleDirective } from 'igniteui-angular/dialog'; import { IgxButtonDirective, IgxRippleDirective } from 'igniteui-angular/directives'; @@ -10,7 +10,6 @@ import { slideInBottom, slideOutTop } from 'igniteui-angular/animations'; selector: 'app-dialog-styling-sample', styleUrls: ['./dialog-styling-sample.component.scss'], templateUrl: './dialog-styling-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxOverlayOutletDirective, IgxButtonDirective, IgxRippleDirective, IgxDialogComponent, IgxDialogTitleDirective, IgxIconComponent, IgxDialogActionsDirective] }) export class DialogStylingSampleComponent implements OnInit { diff --git a/src/app/interactions/drag-drop/dialog-sample/drag-dialog-sample.component.html b/src/app/interactions/drag-drop/dialog-sample/drag-dialog-sample.component.html index 252f0b2a60..7892df6458 100644 --- a/src/app/interactions/drag-drop/dialog-sample/drag-dialog-sample.component.html +++ b/src/app/interactions/drag-drop/dialog-sample/drag-dialog-sample.component.html @@ -1,16 +1,10 @@ -
- drag_indicator - Draggable Dialog +
+ Draggable Dialog + drag_indicator +
Grab the handle icon to drag. -
- - - + diff --git a/src/app/interactions/drag-drop/dialog-sample/drag-dialog-sample.component.scss b/src/app/interactions/drag-drop/dialog-sample/drag-dialog-sample.component.scss index 726fd743cf..09dabe3640 100644 --- a/src/app/interactions/drag-drop/dialog-sample/drag-dialog-sample.component.scss +++ b/src/app/interactions/drag-drop/dialog-sample/drag-dialog-sample.component.scss @@ -1,37 +1,45 @@ @use '../../../../variables' as *; -@include dialog( - dialog-theme( - $schema: $schema - ) +$theme: dialog-theme( + $schema: $schema ); -@include dialog-typography(); - :host { display: block; margin: 16px; - @include b(dialog) { - @extend %igx-dialog-window; + .dialog { + @include tokens($theme, $mode: 'scoped'); display: flex; flex-direction: column; - max-width: rem(280px); - - @include e(icon) { - position: absolute; - right: rem(24px); - top: rem(24px); - cursor: move; + width: rem(280px); + min-width: rem(280px); + border: rem(1px) solid var-get($theme, 'border-color'); + border-radius: var-get($theme, 'border-radius'); + background: var-get($theme, 'background'); + box-shadow: var-get($theme, 'elevation'); + overflow: hidden; + + header { + display: flex; + align-items: center; + justify-content: space-between; + padding: rem(16px) rem(24px); } - @include e(title) { - @extend %igx-dialog-title; + &__title { + display: inline-block; + color: var-get($theme, 'title-color'); } - @include e(content) { - @extend %igx-dialog-content; + &__icon { + cursor: move; } + + &__content { + color: var-get($theme, 'message-color'); + padding: rem(14px) rem(24px); + } } } diff --git a/src/app/interactions/drag-drop/dialog-sample/drag-dialog-sample.component.ts b/src/app/interactions/drag-drop/dialog-sample/drag-dialog-sample.component.ts index 06ef7d9580..84f657a289 100644 --- a/src/app/interactions/drag-drop/dialog-sample/drag-dialog-sample.component.ts +++ b/src/app/interactions/drag-drop/dialog-sample/drag-dialog-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, ElementRef, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ElementRef, ViewChild } from '@angular/core'; import { GlobalPositionStrategy, NoOpScrollStrategy, OverlaySettings } from 'igniteui-angular/core'; import { IgxButtonDirective, IgxDragDirective, IgxDragHandleDirective, IgxDragLocation, IgxToggleDirective } from 'igniteui-angular/directives'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -7,7 +7,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: 'app-drag-dialog-sample', templateUrl: './drag-dialog-sample.component.html', styleUrls: ['./drag-dialog-sample.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxToggleDirective, IgxDragDirective, IgxIconComponent, IgxDragHandleDirective] }) export class DragDialogSampleComponent { diff --git a/src/app/interactions/drag-drop/email-sample/email-sample.component.ts b/src/app/interactions/drag-drop/email-sample/email-sample.component.ts index 3e5d08325d..8c05ad259a 100644 --- a/src/app/interactions/drag-drop/email-sample/email-sample.component.ts +++ b/src/app/interactions/drag-drop/email-sample/email-sample.component.ts @@ -1,4 +1,4 @@ -import { ChangeDetectorRef, Component, Input, Renderer2, inject, ChangeDetectionStrategy } from '@angular/core'; +import { ChangeDetectorRef, Component, Input, Renderer2, inject } from '@angular/core'; import { IgxIconComponent } from 'igniteui-angular/icon'; import { IgxListComponent, IgxListItemComponent, IgxListLineSubTitleDirective, IgxListLineTitleDirective, IgxListThumbnailDirective } from 'igniteui-angular/list'; import { IgxDragDirective, IgxDropDirective } from 'igniteui-angular/directives'; @@ -10,7 +10,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-email-sample', templateUrl: './email-sample.component.html', styleUrls: ['./email-sample.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxIconComponent, IgxListComponent, IgxListItemComponent, IgxDropDirective, IgxListThumbnailDirective, IgxListLineTitleDirective, IgxDragDirective, IgxListLineSubTitleDirective, IgxCheckboxComponent, FormsModule] }) diff --git a/src/app/interactions/drag-drop/icons-sample/icons-sample.component.ts b/src/app/interactions/drag-drop/icons-sample/icons-sample.component.ts index 6a036f4298..f96eb09227 100644 --- a/src/app/interactions/drag-drop/icons-sample/icons-sample.component.ts +++ b/src/app/interactions/drag-drop/icons-sample/icons-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxDragDirective, IgxDropDirective } from 'igniteui-angular/directives'; @@ -6,7 +6,6 @@ import { IgxDragDirective, IgxDropDirective } from 'igniteui-angular/directives' selector: 'app-icons-sample', styleUrls: ['./icons-sample.component.scss'], templateUrl: './icons-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxDragDirective, IgxDropDirective] }) diff --git a/src/app/interactions/drag-drop/kanban-sample/kanban-sample.component.ts b/src/app/interactions/drag-drop/kanban-sample/kanban-sample.component.ts index d047dd5f41..4abbf20fae 100644 --- a/src/app/interactions/drag-drop/kanban-sample/kanban-sample.component.ts +++ b/src/app/interactions/drag-drop/kanban-sample/kanban-sample.component.ts @@ -1,6 +1,6 @@ /* eslint-disable no-shadow */ /* eslint-disable @typescript-eslint/naming-convention */ -import { ChangeDetectorRef, Component, ElementRef, OnInit, Renderer2, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { ChangeDetectorRef, Component, ElementRef, OnInit, Renderer2, ViewChild, inject } from '@angular/core'; import { IDropBaseEventArgs, IDropDroppedEventArgs, IgxDragDirective, IgxDropDirective } from 'igniteui-angular/directives'; import { IgxChipComponent } from 'igniteui-angular/chips'; import { IgxCardComponent, IgxCardContentDirective, IgxCardHeaderComponent, IgxCardHeaderTitleDirective } from 'igniteui-angular/card'; @@ -21,7 +21,6 @@ interface IListItem { selector: 'app-kanban-sample', templateUrl: './kanban-sample.component.html', styleUrls: ['./kanban-sample.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxDropDirective, IgxChipComponent, IgxCardComponent, IgxDragDirective, IgxCardHeaderComponent, IgxCardHeaderTitleDirective, IgxCardContentDirective] }) export class KanbanSampleComponent implements OnInit { diff --git a/src/app/interactions/drag-drop/list-reorder-sample/list-reorder-sample.component.ts b/src/app/interactions/drag-drop/list-reorder-sample/list-reorder-sample.component.ts index ad21634b41..d7bba62cb1 100644 --- a/src/app/interactions/drag-drop/list-reorder-sample/list-reorder-sample.component.ts +++ b/src/app/interactions/drag-drop/list-reorder-sample/list-reorder-sample.component.ts @@ -15,7 +15,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: 'app-list-reorder-sample', templateUrl: './list-reorder-sample.component.html', styleUrls: ['./list-reorder-sample.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxListComponent, IgxListItemComponent, IgxDropDirective, IgxDragDirective, IgxListLineTitleDirective, IgxListLineSubTitleDirective, IgxIconComponent, IgxDragHandleDirective, IgxListActionDirective] }) export class ListReorderSampleComponent { diff --git a/src/app/interactions/overlay/overlay-dynamic-card/overlay-dynamic-card.component.ts b/src/app/interactions/overlay/overlay-dynamic-card/overlay-dynamic-card.component.ts index 4db0b4d417..148eeac4fc 100644 --- a/src/app/interactions/overlay/overlay-dynamic-card/overlay-dynamic-card.component.ts +++ b/src/app/interactions/overlay/overlay-dynamic-card/overlay-dynamic-card.component.ts @@ -1,12 +1,12 @@ -import { Component, ElementRef, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ElementRef, inject } from '@angular/core'; import { IgxCardComponent, IgxCardContentDirective, IgxCardHeaderComponent, IgxCardHeaderSubtitleDirective, IgxCardHeaderTitleDirective, IgxCardModule } from 'igniteui-angular/card'; @Component({ selector: `app-overlay-dynamic-card-component`, templateUrl: `overlay-dynamic-card.component.html`, styleUrls: [`overlay-dynamic-card.component.scss`], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxCardComponent, IgxCardHeaderComponent, IgxCardHeaderTitleDirective, IgxCardHeaderSubtitleDirective, IgxCardContentDirective] }) -export class MyDynamicCardComponent { elementRef = inject(ElementRef); - +export class MyDynamicCardComponent { + elementRef = inject(ElementRef); + } diff --git a/src/app/interactions/overlay/overlay-main-1/overlay-main-sample-1.component.ts b/src/app/interactions/overlay/overlay-main-1/overlay-main-sample-1.component.ts index 1001eabb2f..8f558f35df 100644 --- a/src/app/interactions/overlay/overlay-main-1/overlay-main-sample-1.component.ts +++ b/src/app/interactions/overlay/overlay-main-1/overlay-main-sample-1.component.ts @@ -1,4 +1,4 @@ -import { Component, OnDestroy, ViewContainerRef, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnDestroy, ViewContainerRef, inject } from '@angular/core'; import { IgxOverlayService } from 'igniteui-angular/core'; import { IgxButtonDirective } from 'igniteui-angular/directives'; import { MyDynamicCardComponent} from '../overlay-dynamic-card/overlay-dynamic-card.component'; @@ -6,7 +6,6 @@ import { MyDynamicCardComponent} from '../overlay-dynamic-card/overlay-dynamic-c selector: 'app-overlay-sample', templateUrl: `./overlay-main-sample-1.component.html`, styleUrls: [`./overlay-main-sample-1.component.scss`], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective] }) export class OverlaySampleMain1Component implements OnDestroy { diff --git a/src/app/interactions/overlay/overlay-main-2/overlay-main-sample-2.component.ts b/src/app/interactions/overlay/overlay-main-2/overlay-main-sample-2.component.ts index cd0f104e05..92b7b5949c 100644 --- a/src/app/interactions/overlay/overlay-main-2/overlay-main-sample-2.component.ts +++ b/src/app/interactions/overlay/overlay-main-2/overlay-main-sample-2.component.ts @@ -1,4 +1,4 @@ -import { Component, ElementRef, OnDestroy, ViewChild, ViewContainerRef, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ElementRef, OnDestroy, ViewChild, ViewContainerRef, inject } from '@angular/core'; import { ConnectedPositioningStrategy, IgxOverlayService } from 'igniteui-angular/core'; import { IgxButtonDirective } from 'igniteui-angular/directives'; import { CardSample1Component } from '../../../layouts/card/card-sample-1/card-sample-1.component'; @@ -7,7 +7,6 @@ import { CardSample1Component } from '../../../layouts/card/card-sample-1/card-s selector: 'app-overlay-sample', templateUrl: `./overlay-main-sample-2.component.html`, styleUrls: [`./overlay-main-sample-2.component.scss`], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective] }) export class OverlaySampleMain2Component implements OnDestroy { diff --git a/src/app/interactions/overlay/overlay-main-3/overlay-main-sample-3.component.ts b/src/app/interactions/overlay/overlay-main-3/overlay-main-sample-3.component.ts index 3923a014b5..dff46042de 100644 --- a/src/app/interactions/overlay/overlay-main-3/overlay-main-sample-3.component.ts +++ b/src/app/interactions/overlay/overlay-main-3/overlay-main-sample-3.component.ts @@ -1,4 +1,4 @@ -import { Component, ElementRef, OnDestroy, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ElementRef, OnDestroy, ViewChild, inject } from '@angular/core'; import { ConnectedPositioningStrategy, IgxOverlayService } from 'igniteui-angular/core'; import { IgxButtonDirective } from 'igniteui-angular/directives'; import { CardSample1Component } from '../../../layouts/card/card-sample-1/card-sample-1.component'; @@ -7,7 +7,6 @@ import { CardSample1Component } from '../../../layouts/card/card-sample-1/card-s selector: 'app-overlay-sample', templateUrl: `overlay-main-sample-3.component.html`, styleUrls: ['overlay-main-sample-3.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, CardSample1Component] }) export class OverlaySampleMain3Component implements OnDestroy { diff --git a/src/app/interactions/overlay/overlay-positioning-1/overlay-position-sample-1.component.ts b/src/app/interactions/overlay/overlay-positioning-1/overlay-position-sample-1.component.ts index 967296ef6d..e466675df8 100644 --- a/src/app/interactions/overlay/overlay-positioning-1/overlay-position-sample-1.component.ts +++ b/src/app/interactions/overlay/overlay-positioning-1/overlay-position-sample-1.component.ts @@ -1,4 +1,4 @@ -import { Component, ElementRef, OnDestroy, ViewChild, ViewContainerRef, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ElementRef, OnDestroy, ViewChild, ViewContainerRef, inject } from '@angular/core'; import { ConnectedPositioningStrategy, IgxOverlayService, OverlaySettings } from 'igniteui-angular/core'; import { IgxButtonDirective } from 'igniteui-angular/directives'; import { Subject } from 'rxjs'; @@ -8,7 +8,6 @@ import { MyDynamicCardComponent } from '../overlay-dynamic-card/overlay-dynamic- styleUrls: ['./overlay-position-sample-1.component.scss'], templateUrl: './overlay-position-sample-1.component.html', providers: [IgxOverlayService], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective] }) export class OverlayPositionSample1Component implements OnDestroy { diff --git a/src/app/interactions/overlay/overlay-positioning-2/overlay-position-sample-2.component.ts b/src/app/interactions/overlay/overlay-positioning-2/overlay-position-sample-2.component.ts index 327fd28427..904a281eb9 100644 --- a/src/app/interactions/overlay/overlay-positioning-2/overlay-position-sample-2.component.ts +++ b/src/app/interactions/overlay/overlay-positioning-2/overlay-position-sample-2.component.ts @@ -1,4 +1,4 @@ -import { Component, ElementRef, OnDestroy, ViewChild, ViewContainerRef, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ElementRef, OnDestroy, ViewChild, ViewContainerRef, inject } from '@angular/core'; import { ConnectedPositioningStrategy, HorizontalAlignment, IgxOverlayService, OverlaySettings, PositionSettings, VerticalAlignment } from 'igniteui-angular/core'; import { IgxButtonDirective } from 'igniteui-angular/directives'; import { MyDynamicCardComponent } from '../overlay-dynamic-card/overlay-dynamic-card.component'; @@ -7,7 +7,6 @@ import { MyDynamicCardComponent } from '../overlay-dynamic-card/overlay-dynamic- styleUrls: ['./overlay-position-sample-2.component.scss'], templateUrl: './overlay-position-sample-2.component.html', providers: [IgxOverlayService], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective] }) export class OverlayPositionSample2Component implements OnDestroy { diff --git a/src/app/interactions/overlay/overlay-positioning-3/overlay-position-sample-3.component.ts b/src/app/interactions/overlay/overlay-positioning-3/overlay-position-sample-3.component.ts index 27e0c21af2..f2d41e4c5b 100644 --- a/src/app/interactions/overlay/overlay-positioning-3/overlay-position-sample-3.component.ts +++ b/src/app/interactions/overlay/overlay-positioning-3/overlay-position-sample-3.component.ts @@ -1,4 +1,4 @@ -import { Component, ElementRef, OnDestroy, ViewChild, ViewContainerRef, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ElementRef, OnDestroy, ViewChild, ViewContainerRef, inject } from '@angular/core'; import { AutoPositionStrategy, IgxOverlayService } from 'igniteui-angular/core'; import { IgxButtonDirective } from 'igniteui-angular/directives'; import { MyDynamicCardComponent } from '../overlay-dynamic-card/overlay-dynamic-card.component'; @@ -7,7 +7,6 @@ import { MyDynamicCardComponent } from '../overlay-dynamic-card/overlay-dynamic- styleUrls: ['./overlay-position-sample-3.component.scss'], templateUrl: './overlay-position-sample-3.component.html', providers: [IgxOverlayService], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective] }) export class OverlayPositionSample3Component implements OnDestroy { diff --git a/src/app/interactions/overlay/overlay-preset-settings/overlay-preset-settings-sample.component.ts b/src/app/interactions/overlay/overlay-preset-settings/overlay-preset-settings-sample.component.ts index e903723bd2..266590690a 100644 --- a/src/app/interactions/overlay/overlay-preset-settings/overlay-preset-settings-sample.component.ts +++ b/src/app/interactions/overlay/overlay-preset-settings/overlay-preset-settings-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, ElementRef, OnDestroy, OnInit, ViewChild, ViewContainerRef, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ElementRef, OnDestroy, OnInit, ViewChild, ViewContainerRef, inject } from '@angular/core'; import { AbsolutePosition, IgxOverlayService, OverlaySettings, RelativePosition, RelativePositionStrategy } from 'igniteui-angular/core'; import { IButtonGroupEventArgs, IgxButtonGroupComponent } from 'igniteui-angular/button-group'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -12,7 +12,6 @@ import { NgTemplateOutlet } from '@angular/common'; styleUrls: ['./overlay-preset-settings-sample.component.scss'], templateUrl: './overlay-preset-settings-sample.component.html', providers: [IgxOverlayService], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxIconComponent, NgTemplateOutlet, IgxButtonGroupComponent, IgxButtonDirective] }) export class OverlayPresetSettingsSampleComponent implements OnInit, OnDestroy { diff --git a/src/app/interactions/overlay/overlay-scroll-1/overlay-scroll-sample-1.component.ts b/src/app/interactions/overlay/overlay-scroll-1/overlay-scroll-sample-1.component.ts index 19af4cb2ae..9159deda83 100644 --- a/src/app/interactions/overlay/overlay-scroll-1/overlay-scroll-sample-1.component.ts +++ b/src/app/interactions/overlay/overlay-scroll-1/overlay-scroll-sample-1.component.ts @@ -1,4 +1,4 @@ -import { Component, ElementRef, OnDestroy, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ElementRef, OnDestroy, ViewChild, inject } from '@angular/core'; import { AbsoluteScrollStrategy, AutoPositionStrategy, ConnectedPositioningStrategy, ElasticPositionStrategy, GlobalPositionStrategy, HorizontalAlignment, IgxOverlayService, OverlaySettings, PositionSettings, VerticalAlignment } from 'igniteui-angular/core'; import { IgxSwitchComponent } from 'igniteui-angular/switch'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -10,7 +10,6 @@ import { FormsModule } from '@angular/forms'; styleUrls: ['./overlay-scroll-sample-1.component.scss'], templateUrl: './overlay-scroll-sample-1.component.html', providers: [IgxOverlayService], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSwitchComponent, FormsModule, IgxIconComponent, IgxCardComponent, IgxCardHeaderComponent, IgxCardContentDirective] }) export class OverlayScrollSample1Component implements OnDestroy { diff --git a/src/app/interactions/overlay/overlay-scroll-2/overlay-scroll-sample-2.component.ts b/src/app/interactions/overlay/overlay-scroll-2/overlay-scroll-sample-2.component.ts index c9f44d6348..34e6923bf7 100644 --- a/src/app/interactions/overlay/overlay-scroll-2/overlay-scroll-sample-2.component.ts +++ b/src/app/interactions/overlay/overlay-scroll-2/overlay-scroll-sample-2.component.ts @@ -1,4 +1,4 @@ -import { Component, ElementRef, OnDestroy, OnInit, ViewChild, ViewContainerRef, inject, ChangeDetectionStrategy } from '@angular/core'; +import { ChangeDetectorRef, Component, ElementRef, OnDestroy, OnInit, ViewChild, ViewContainerRef, inject } from '@angular/core'; import { AbsoluteScrollStrategy, BlockScrollStrategy, CloseScrollStrategy, ConnectedPositioningStrategy, IgxOverlayService, NoOpScrollStrategy } from 'igniteui-angular/core'; import { IgxIconComponent } from 'igniteui-angular/icon'; import { Subject } from 'rxjs'; @@ -9,12 +9,12 @@ import { MyDynamicCardComponent } from '../overlay-dynamic-card/overlay-dynamic- styleUrls: ['./overlay-scroll-sample-2.component.scss'], templateUrl: './overlay-scroll-sample-2.component.html', providers: [IgxOverlayService], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxIconComponent, MyDynamicCardComponent] }) export class OverlayScrollSample2Component implements OnInit, OnDestroy { private overlay = inject(IgxOverlayService); private viewContainerRef = inject(ViewContainerRef); + private cdr = inject(ChangeDetectorRef); @ViewChild('scrollDemo', { static: true }) public scrollDemo: ElementRef; @@ -38,7 +38,10 @@ export class OverlayScrollSample2Component implements OnInit, OnDestroy { this.overlay .closed .pipe(takeUntil(this.destroy$)) - .subscribe(() => this.previewHidden = false); + .subscribe(() => { + this.previewHidden = false; + this.cdr.markForCheck(); + }); } public ngOnInit(): void { diff --git a/src/app/interactions/overlay/overlay-styling/overlay-styling.component.ts b/src/app/interactions/overlay/overlay-styling/overlay-styling.component.ts index e0866fdcf8..b05e158300 100644 --- a/src/app/interactions/overlay/overlay-styling/overlay-styling.component.ts +++ b/src/app/interactions/overlay/overlay-styling/overlay-styling.component.ts @@ -1,4 +1,4 @@ -import { Component, ElementRef, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ElementRef, inject } from '@angular/core'; import { IgxOverlayService } from 'igniteui-angular/core'; import { IgxComboComponent } from 'igniteui-angular/combo'; import { FormsModule } from '@angular/forms'; @@ -7,7 +7,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-overlay-styling', styleUrls: ['overlay-styling.component.scss'], templateUrl: 'overlay-styling.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxComboComponent, FormsModule] }) export class OverlayStylingComponent { diff --git a/src/app/interactions/query-builder/query-builder-request-sample/query-builder-request-sample.component.ts b/src/app/interactions/query-builder/query-builder-request-sample/query-builder-request-sample.component.ts index 4778495779..b7ab51bda3 100644 --- a/src/app/interactions/query-builder/query-builder-request-sample/query-builder-request-sample.component.ts +++ b/src/app/interactions/query-builder/query-builder-request-sample/query-builder-request-sample.component.ts @@ -1,5 +1,5 @@ import { HttpClient } from '@angular/common/http'; -import { AfterViewInit, ChangeDetectorRef, Component, OnInit, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { AfterViewInit, ChangeDetectorRef, Component, OnInit, ViewChild, inject } from '@angular/core'; import { FilteringExpressionsTree, FilteringLogic, IExpressionTree } from 'igniteui-angular/core'; import { IgxColumnComponent } from 'igniteui-angular/grids/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; @@ -11,7 +11,6 @@ const API_ENDPOINT = 'https://data-northwind.indigo.design'; selector: 'query-builder-request-sample', styleUrls: ['./query-builder-request-sample.component.scss'], templateUrl: 'query-builder-request-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxQueryBuilderComponent, IgxGridComponent, IgxColumnComponent] }) export class QueryBuilderRequestSampleComponent implements OnInit, AfterViewInit { @@ -58,11 +57,11 @@ export class QueryBuilderRequestSampleComponent implements OnInit, AfterViewInit fields: this.ordersFields } ]; - + const tree = new FilteringExpressionsTree(FilteringLogic.And, undefined, 'Orders', ['orderId', 'customerId', 'employeeId', 'shipperId', 'orderDate', 'requiredDate', 'shipVia', 'freight', 'shipName', 'completed']); this.expressionTree = tree; } - + public ngAfterViewInit(): void { this.onChange(); } diff --git a/src/app/interactions/query-builder/query-builder-sample-1/query-builder-sample-1.component.ts b/src/app/interactions/query-builder/query-builder-sample-1/query-builder-sample-1.component.ts index 32c6457356..58c1b149d8 100644 --- a/src/app/interactions/query-builder/query-builder-sample-1/query-builder-sample-1.component.ts +++ b/src/app/interactions/query-builder/query-builder-sample-1/query-builder-sample-1.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit } from '@angular/core'; import { FilteringExpressionsTree, FilteringLogic, IExpressionTree, IgxBooleanFilteringOperand, IgxDateFilteringOperand, IgxNumberFilteringOperand, IgxStringFilteringOperand } from 'igniteui-angular/core'; import { IgxQueryBuilderComponent } from 'igniteui-angular/query-builder'; @@ -6,7 +6,6 @@ import { IgxQueryBuilderComponent } from 'igniteui-angular/query-builder'; selector: 'app-query-builder-sample-1', styleUrls: ['./query-builder-sample-1.component.scss'], templateUrl: 'query-builder-sample-1.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxQueryBuilderComponent] }) export class QueryBuilderSample1Component implements OnInit { @@ -85,7 +84,7 @@ export class QueryBuilderSample1Component implements OnInit { condition: IgxDateFilteringOperand.instance().condition('today'), conditionName: IgxDateFilteringOperand.instance().condition('today').name }); - + const tree = new FilteringExpressionsTree(FilteringLogic.And, undefined, 'Orders', ['*']); tree.filteringOperands.push({ fieldName: 'CompanyID', @@ -112,4 +111,4 @@ export class QueryBuilderSample1Component implements OnInit { public printExpressionTree(tree: IExpressionTree) { return tree ? JSON.stringify(tree, null, 2) : 'Please add an expression!'; } -} \ No newline at end of file +} diff --git a/src/app/interactions/query-builder/query-builder-sql-sample/query-builder-sql-sample.component.ts b/src/app/interactions/query-builder/query-builder-sql-sample/query-builder-sql-sample.component.ts index b7cb18654c..81df6f39a7 100644 --- a/src/app/interactions/query-builder/query-builder-sql-sample/query-builder-sql-sample.component.ts +++ b/src/app/interactions/query-builder/query-builder-sql-sample/query-builder-sql-sample.component.ts @@ -1,5 +1,5 @@ import { HttpClient } from '@angular/common/http'; -import { AfterViewInit, ChangeDetectorRef, Component, OnInit, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { AfterViewInit, ChangeDetectorRef, Component, OnInit, ViewChild, inject } from '@angular/core'; import { EntityType, FilteringExpressionsTree, IExpressionTree, IgxNumberFilteringOperand, IgxStringFilteringOperand } from 'igniteui-angular/core'; import { IgxColumnComponent } from 'igniteui-angular/grids/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; @@ -12,7 +12,6 @@ const API_ENDPOINT = 'https://data-northwind.indigo.design'; selector: 'app-query-builder-sql-sample', styleUrls: ['./query-builder-sql-sample.component.scss'], templateUrl: 'query-builder-sql-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxQueryBuilderComponent, IgxGridComponent, IgxColumnComponent] }) export class QueryBuilderSqlSampleComponent implements OnInit, AfterViewInit { @@ -116,7 +115,7 @@ export class QueryBuilderSqlSampleComponent implements OnInit, AfterViewInit { `${tree.returnFields.join(',')}` : '*'; - const selectClause = `SELECT ${selectFields}`; + const selectClause = `SELECT ${selectFields}`; const fromClause = `FROM ${tree.entity}`; const whereClause = this.buildWhereClause(tree); @@ -188,7 +187,7 @@ export class QueryBuilderSqlSampleComponent implements OnInit, AfterViewInit { break; } } - + public onChange() { const sqlQuery = this.transformExpressionTreeToSqlQuery(this.expressionTree); this.sqlQuery = format(sqlQuery); @@ -212,4 +211,4 @@ export class QueryBuilderSqlSampleComponent implements OnInit, AfterViewInit { this.grid.columns.forEach(column => column.hidden = !this.expressionTree.returnFields.includes(column.field)); } } -} \ No newline at end of file +} diff --git a/src/app/interactions/query-builder/query-builder-style/query-builder-style.component.ts b/src/app/interactions/query-builder/query-builder-style/query-builder-style.component.ts index e0802fc37e..de24bdd9d5 100644 --- a/src/app/interactions/query-builder/query-builder-style/query-builder-style.component.ts +++ b/src/app/interactions/query-builder/query-builder-style/query-builder-style.component.ts @@ -1,11 +1,10 @@ -import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit } from '@angular/core'; import { IgxQueryBuilderComponent } from 'igniteui-angular/query-builder'; @Component({ selector: 'app-query-builder-style-sample', styleUrls: ['./query-builder-style.component.scss'], templateUrl: 'query-builder-style.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxQueryBuilderComponent] }) export class QueryBuilderStyleComponent implements OnInit { @@ -55,6 +54,6 @@ export class QueryBuilderStyleComponent implements OnInit { name: "Orders", fields: this.ordersFields } - ]; + ]; } } diff --git a/src/app/interactions/query-builder/query-builder-tailwind-style/query-builder-tailwind-style.component.ts b/src/app/interactions/query-builder/query-builder-tailwind-style/query-builder-tailwind-style.component.ts index b20f0fa88e..0240f65050 100644 --- a/src/app/interactions/query-builder/query-builder-tailwind-style/query-builder-tailwind-style.component.ts +++ b/src/app/interactions/query-builder/query-builder-tailwind-style/query-builder-tailwind-style.component.ts @@ -1,11 +1,10 @@ -import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit } from '@angular/core'; import { IgxQueryBuilderComponent } from 'igniteui-angular/query-builder'; @Component({ selector: 'app-query-builder-tailwind-style-sample', styleUrls: ['./query-builder-tailwind-style.component.scss'], templateUrl: 'query-builder-tailwind-style.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxQueryBuilderComponent] }) export class QueryBuilderTailwindStyleComponent implements OnInit { diff --git a/src/app/interactions/query-builder/query-builder-template-sample/query-builder-template-sample.component.ts b/src/app/interactions/query-builder/query-builder-template-sample/query-builder-template-sample.component.ts index af71b19f11..186333e69d 100644 --- a/src/app/interactions/query-builder/query-builder-template-sample/query-builder-template-sample.component.ts +++ b/src/app/interactions/query-builder/query-builder-template-sample/query-builder-template-sample.component.ts @@ -1,5 +1,5 @@ import { NgTemplateOutlet } from '@angular/common'; -import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { FilteringExpressionsTree, FilteringLogic, IExpressionTree, IgxNumberFilteringOperand, IgxStringFilteringOperand } from 'igniteui-angular/core'; import { IgxComboModule } from 'igniteui-angular/combo'; @@ -11,7 +11,6 @@ import { IgxSelectModule } from 'igniteui-angular/select'; selector: 'app-query-builder-template-sample', styleUrls: ['./query-builder-template-sample.component.scss'], templateUrl: 'query-builder-template-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [ IgxQueryBuilderComponent, IgxQueryBuilderHeaderComponent, diff --git a/src/app/interactions/ripple/ripple-sample-2/ripple-sample-2.component.ts b/src/app/interactions/ripple/ripple-sample-2/ripple-sample-2.component.ts index aa82a16e22..ed4cd8a31d 100644 --- a/src/app/interactions/ripple/ripple-sample-2/ripple-sample-2.component.ts +++ b/src/app/interactions/ripple/ripple-sample-2/ripple-sample-2.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxButtonDirective, IgxRippleDirective } from 'igniteui-angular/directives'; @Component({ selector: 'app-ripple-sample-2', styleUrls: ['./ripple-sample-2.component.scss'], templateUrl: './ripple-sample-2.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxRippleDirective, IgxButtonDirective] }) export class RippleSample2Component { } diff --git a/src/app/interactions/ripple/ripple-sample-3/ripple-sample-3.component.ts b/src/app/interactions/ripple/ripple-sample-3/ripple-sample-3.component.ts index c5a0630438..b6894e53a8 100644 --- a/src/app/interactions/ripple/ripple-sample-3/ripple-sample-3.component.ts +++ b/src/app/interactions/ripple/ripple-sample-3/ripple-sample-3.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxButtonDirective, IgxRippleDirective } from 'igniteui-angular/directives'; @Component({ selector: 'app-ripple-sample-3', styleUrls: ['./ripple-sample-3.component.scss'], templateUrl: './ripple-sample-3.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxRippleDirective] }) export class RippleSample3Component { } diff --git a/src/app/interactions/ripple/ripple-sample-4/ripple-sample-4.component.ts b/src/app/interactions/ripple/ripple-sample-4/ripple-sample-4.component.ts index 5d009f614c..9a0fde7f28 100644 --- a/src/app/interactions/ripple/ripple-sample-4/ripple-sample-4.component.ts +++ b/src/app/interactions/ripple/ripple-sample-4/ripple-sample-4.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxButtonDirective, IgxRippleDirective } from 'igniteui-angular/directives'; @Component({ selector: 'app-ripple-sample-4', styleUrls: ['./ripple-sample-4.component.scss'], templateUrl: './ripple-sample-4.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxRippleDirective] }) export class RippleSample4Component { } diff --git a/src/app/interactions/ripple/ripple-sample-5/ripple-sample-5.component.ts b/src/app/interactions/ripple/ripple-sample-5/ripple-sample-5.component.ts index bc24bf810d..ca35500d94 100644 --- a/src/app/interactions/ripple/ripple-sample-5/ripple-sample-5.component.ts +++ b/src/app/interactions/ripple/ripple-sample-5/ripple-sample-5.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxButtonDirective, IgxRippleDirective } from 'igniteui-angular/directives'; @Component({ selector: 'app-ripple-sample-5', styleUrls: ['./ripple-sample-5.component.scss'], templateUrl: './ripple-sample-5.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxRippleDirective] }) export class RippleSample5Component { } diff --git a/src/app/interactions/ripple/ripple-sample-6/ripple-sample-6.component.ts b/src/app/interactions/ripple/ripple-sample-6/ripple-sample-6.component.ts index 6fd8eeae5f..24c03c931d 100644 --- a/src/app/interactions/ripple/ripple-sample-6/ripple-sample-6.component.ts +++ b/src/app/interactions/ripple/ripple-sample-6/ripple-sample-6.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxButtonDirective, IgxRippleDirective } from 'igniteui-angular/directives'; @Component({ selector: 'app-ripple-sample-6', styleUrls: ['./ripple-sample-6.component.scss'], templateUrl: './ripple-sample-6.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxRippleDirective] }) export class RippleSample6Component { } diff --git a/src/app/interactions/ripple/ripple-stying/ripple-styling-sample.component.ts b/src/app/interactions/ripple/ripple-stying/ripple-styling-sample.component.ts index b6727a8e1a..ba4081527e 100644 --- a/src/app/interactions/ripple/ripple-stying/ripple-styling-sample.component.ts +++ b/src/app/interactions/ripple/ripple-stying/ripple-styling-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxButtonDirective, IgxIconButtonDirective, IgxRippleDirective } from 'igniteui-angular/directives'; import { IgxIconComponent } from 'igniteui-angular/icon'; import { IgxAvatarComponent } from 'igniteui-angular/avatar'; @@ -7,7 +7,6 @@ import { IgxAvatarComponent } from 'igniteui-angular/avatar'; selector: 'app-ripple-styling-sample', styleUrls: ['./ripple-styling-sample.component.scss'], templateUrl: './ripple-styling-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxRippleDirective, IgxIconButtonDirective, IgxIconComponent, IgxAvatarComponent] }) export class RippleStylingSampleComponent { } diff --git a/src/app/interactions/slider/discrete-slider-ticks-bottom/discrete-slider-ticks-bottom.component.ts b/src/app/interactions/slider/discrete-slider-ticks-bottom/discrete-slider-ticks-bottom.component.ts index 7018a0b5fe..64338ad1d6 100644 --- a/src/app/interactions/slider/discrete-slider-ticks-bottom/discrete-slider-ticks-bottom.component.ts +++ b/src/app/interactions/slider/discrete-slider-ticks-bottom/discrete-slider-ticks-bottom.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxSliderComponent, IgxSliderType } from 'igniteui-angular/slider'; @Component({ selector: 'app-discrete-slider-bottom-ticks', styleUrls: ['./discrete-slider-ticks-bottom.component.scss'], templateUrl: './discrete-slider-ticks-bottom.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSliderComponent] }) export class SliderDiscreteTicksBottomComponent { diff --git a/src/app/interactions/slider/slider-primary-ticks-top/slider-primary-ticks-top.component.ts b/src/app/interactions/slider/slider-primary-ticks-top/slider-primary-ticks-top.component.ts index d14e41764a..d35f2e94b3 100644 --- a/src/app/interactions/slider/slider-primary-ticks-top/slider-primary-ticks-top.component.ts +++ b/src/app/interactions/slider/slider-primary-ticks-top/slider-primary-ticks-top.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxSliderComponent, TicksOrientation } from 'igniteui-angular/slider'; @Component({ selector: 'app-slider-primary-ticks-top', styleUrls: ['./slider-primary-ticks-top.component.scss'], templateUrl: './slider-primary-ticks-top.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSliderComponent] }) export class SliderPrimaryTicksTopComponent { diff --git a/src/app/interactions/slider/slider-sample-1/slider-sample-1.component.ts b/src/app/interactions/slider/slider-sample-1/slider-sample-1.component.ts index c27260c57f..7bb4d45868 100644 --- a/src/app/interactions/slider/slider-sample-1/slider-sample-1.component.ts +++ b/src/app/interactions/slider/slider-sample-1/slider-sample-1.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxSliderComponent, IgxSliderType } from 'igniteui-angular/slider'; import { IgxInputDirective, IgxInputGroupComponent, IgxLabelDirective, IgxPrefixDirective } from 'igniteui-angular/input-group'; import { FormsModule } from '@angular/forms'; @@ -7,7 +7,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-slider-sample-1', styleUrls: ['./slider-sample-1.component.scss'], templateUrl: './slider-sample-1.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSliderComponent, IgxInputGroupComponent, IgxLabelDirective, IgxPrefixDirective, FormsModule, IgxInputDirective] }) export class SliderSample1Component { diff --git a/src/app/interactions/slider/slider-sample-2/slider-sample-2.component.ts b/src/app/interactions/slider/slider-sample-2/slider-sample-2.component.ts index 6149e4bc4c..089d47158b 100644 --- a/src/app/interactions/slider/slider-sample-2/slider-sample-2.component.ts +++ b/src/app/interactions/slider/slider-sample-2/slider-sample-2.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit } from '@angular/core'; import { IgxSliderComponent } from 'igniteui-angular/slider'; import { FormsModule } from '@angular/forms'; @@ -6,7 +6,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-slider-sample-2', styleUrls: ['./slider-sample-2.component.scss'], templateUrl: './slider-sample-2.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSliderComponent, FormsModule] }) export class SliderSample2Component implements OnInit { diff --git a/src/app/interactions/slider/slider-sample-3/slider-sample-3.component.ts b/src/app/interactions/slider/slider-sample-3/slider-sample-3.component.ts index 24ddd8076d..34ad1be7d0 100644 --- a/src/app/interactions/slider/slider-sample-3/slider-sample-3.component.ts +++ b/src/app/interactions/slider/slider-sample-3/slider-sample-3.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { IgxInputDirective, IgxInputGroupComponent, IgxLabelDirective, IgxSuffixDirective } from 'igniteui-angular/input-group'; import { IgxSliderComponent } from 'igniteui-angular/slider'; import { FormsModule } from '@angular/forms'; @@ -7,7 +7,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-slider-sample-3', styleUrls: ['./slider-sample-3.component.scss'], templateUrl: './slider-sample-3.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSliderComponent, FormsModule, IgxInputGroupComponent, IgxInputDirective, IgxLabelDirective, IgxSuffixDirective] }) export class SliderSample3Component { diff --git a/src/app/interactions/slider/slider-sample-4/slider-sample-4.component.ts b/src/app/interactions/slider/slider-sample-4/slider-sample-4.component.ts index 1c2fc3b81e..3f48fd9b70 100644 --- a/src/app/interactions/slider/slider-sample-4/slider-sample-4.component.ts +++ b/src/app/interactions/slider/slider-sample-4/slider-sample-4.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxSliderComponent, IgxSliderType } from 'igniteui-angular/slider'; import { IgxInputDirective, IgxInputGroupComponent, IgxLabelDirective, IgxPrefixDirective } from 'igniteui-angular/input-group'; import { FormsModule } from '@angular/forms'; @@ -7,7 +7,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-slider-sample-4', styleUrls: ['./slider-sample-4.component.scss'], templateUrl: './slider-sample-4.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSliderComponent, IgxInputGroupComponent, IgxLabelDirective, IgxPrefixDirective, FormsModule, IgxInputDirective] }) export class SliderSample4Component { diff --git a/src/app/interactions/slider/slider-sample-5/slider-sample-5.component.ts b/src/app/interactions/slider/slider-sample-5/slider-sample-5.component.ts index c30c8d0aa3..0b3f3c488b 100644 --- a/src/app/interactions/slider/slider-sample-5/slider-sample-5.component.ts +++ b/src/app/interactions/slider/slider-sample-5/slider-sample-5.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxSliderComponent, IgxSliderType } from 'igniteui-angular/slider'; @Component({ selector: 'app-slider-sample-5', styleUrls: ['./slider-sample-5.component.scss'], templateUrl: './slider-sample-5.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSliderComponent] }) export class SliderSample5Component { diff --git a/src/app/interactions/slider/slider-sample-6/slider-sample-6.component.ts b/src/app/interactions/slider/slider-sample-6/slider-sample-6.component.ts index a8e222d9fa..25f037d8b8 100644 --- a/src/app/interactions/slider/slider-sample-6/slider-sample-6.component.ts +++ b/src/app/interactions/slider/slider-sample-6/slider-sample-6.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxSliderComponent, IgxSliderType, IgxThumbFromTemplateDirective, IgxThumbToTemplateDirective } from 'igniteui-angular/slider'; @Component({ selector: 'app-slider-sample-6', styleUrls: ['./slider-sample-6.component.scss'], templateUrl: './slider-sample-6.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSliderComponent, IgxThumbFromTemplateDirective, IgxThumbToTemplateDirective] }) export class SliderSample6Component { diff --git a/src/app/interactions/slider/slider-secondary-ticks-mirror/slider-secondary-ticks-mirror.component.ts b/src/app/interactions/slider/slider-secondary-ticks-mirror/slider-secondary-ticks-mirror.component.ts index 22782b875b..62a5b6f431 100644 --- a/src/app/interactions/slider/slider-secondary-ticks-mirror/slider-secondary-ticks-mirror.component.ts +++ b/src/app/interactions/slider/slider-secondary-ticks-mirror/slider-secondary-ticks-mirror.component.ts @@ -1,11 +1,10 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { IgxSliderComponent, TicksOrientation } from 'igniteui-angular/slider'; @Component({ selector: 'app-slider-bottom-ticks', styleUrls: ['./slider-secondary-ticks-mirror.component.scss'], templateUrl: './slider-secondary-ticks-mirror.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSliderComponent] }) export class SliderSecondaryTicksMirrorComponent { diff --git a/src/app/interactions/slider/slider-styling-sample/app-slider-styling.component.ts b/src/app/interactions/slider/slider-styling-sample/app-slider-styling.component.ts index d8eca6f814..0ffc4a436b 100644 --- a/src/app/interactions/slider/slider-styling-sample/app-slider-styling.component.ts +++ b/src/app/interactions/slider/slider-styling-sample/app-slider-styling.component.ts @@ -1,11 +1,10 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { IgxSliderComponent, TicksOrientation } from 'igniteui-angular/slider'; @Component({ selector: 'app-slider-styling', styleUrls: ['./app-slider-styling.component.scss'], templateUrl: './app-slider-styling.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSliderComponent] }) export class AppSliderStylingComponent { diff --git a/src/app/interactions/slider/slider-tailwind-styling-sample/slider-tailwind-styling.component.ts b/src/app/interactions/slider/slider-tailwind-styling-sample/slider-tailwind-styling.component.ts index e6309c1f7c..5484107728 100644 --- a/src/app/interactions/slider/slider-tailwind-styling-sample/slider-tailwind-styling.component.ts +++ b/src/app/interactions/slider/slider-tailwind-styling-sample/slider-tailwind-styling.component.ts @@ -1,11 +1,10 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { IgxSliderComponent, TicksOrientation } from 'igniteui-angular/slider'; @Component({ selector: 'slider-tailwind-styling', styleUrls: ['./slider-tailwind-styling.component.scss'], templateUrl: './slider-tailwind-styling.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSliderComponent] }) export class SliderTailwindStylingComponent { diff --git a/src/app/interactions/slider/slider-tick-labels-template/tick-labels-template.component.ts b/src/app/interactions/slider/slider-tick-labels-template/tick-labels-template.component.ts index 3796358017..bfa453e810 100644 --- a/src/app/interactions/slider/slider-tick-labels-template/tick-labels-template.component.ts +++ b/src/app/interactions/slider/slider-tick-labels-template/tick-labels-template.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxSliderComponent, IgxTickLabelTemplateDirective } from 'igniteui-angular/slider'; @Component({ selector: 'app-tick-labels-template', styleUrls: ['./tick-labels-template.component.scss'], templateUrl: './tick-labels-template.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSliderComponent, IgxTickLabelTemplateDirective] }) export class TickLabelsTemplateComponent { diff --git a/src/app/interactions/slider/slider-ticks-bottomtotop-labels/slider-ticks-bottomtotop-labels.component.ts b/src/app/interactions/slider/slider-ticks-bottomtotop-labels/slider-ticks-bottomtotop-labels.component.ts index e2d3c2613c..15bf608961 100644 --- a/src/app/interactions/slider/slider-ticks-bottomtotop-labels/slider-ticks-bottomtotop-labels.component.ts +++ b/src/app/interactions/slider/slider-ticks-bottomtotop-labels/slider-ticks-bottomtotop-labels.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxSliderComponent, IgxSliderType, TickLabelsOrientation } from 'igniteui-angular/slider'; @Component({ selector: 'app-slider-ticks-bottomtotop-labels', styleUrls: ['./slider-ticks-bottomtotop-labels.component.scss'], templateUrl: './slider-ticks-bottomtotop-labels.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSliderComponent] }) export class SliderTicksBottomtotopLabelsComponent { diff --git a/src/app/interactions/slider/slider-timeframe/slider-timeframe.component.ts b/src/app/interactions/slider/slider-timeframe/slider-timeframe.component.ts index 3cf16ab583..5e08bd20fe 100644 --- a/src/app/interactions/slider/slider-timeframe/slider-timeframe.component.ts +++ b/src/app/interactions/slider/slider-timeframe/slider-timeframe.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxSliderComponent, IgxSliderType } from 'igniteui-angular/slider'; @Component({ selector: 'app-slider-timeframe', styleUrls: ['./slider-timeframe.component.scss'], templateUrl: './slider-timeframe.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSliderComponent] }) export class SliderTimeframeComponent { diff --git a/src/app/interactions/toggle/toggle-sample-1/toggle-sample-1.component.ts b/src/app/interactions/toggle/toggle-sample-1/toggle-sample-1.component.ts index 03ab42f46e..bf63372678 100644 --- a/src/app/interactions/toggle/toggle-sample-1/toggle-sample-1.component.ts +++ b/src/app/interactions/toggle/toggle-sample-1/toggle-sample-1.component.ts @@ -1,11 +1,10 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { IgxButtonDirective, IgxToggleDirective } from 'igniteui-angular/directives'; @Component({ selector: 'app-toggle-sample-1', styleUrls: ['./toggle-sample-1.component.scss', '../toggle-samples.scss'], templateUrl: './toggle-sample-1.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxToggleDirective] }) export class ToggleSample1Component { diff --git a/src/app/interactions/toggle/toggle-sample-2/toggle-sample-2.component.ts b/src/app/interactions/toggle/toggle-sample-2/toggle-sample-2.component.ts index 11fa6e3539..add7919139 100644 --- a/src/app/interactions/toggle/toggle-sample-2/toggle-sample-2.component.ts +++ b/src/app/interactions/toggle/toggle-sample-2/toggle-sample-2.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxButtonDirective, IgxToggleActionDirective, IgxToggleDirective } from 'igniteui-angular/directives'; @Component({ selector: 'app-toggle-sample-2', styleUrls: ['../toggle-samples.scss'], templateUrl: './toggle-sample-2.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxToggleActionDirective, IgxToggleDirective] }) export class ToggleSample2Component { } diff --git a/src/app/interactions/toggle/toggle-sample-3/toggle-sample-3.component.ts b/src/app/interactions/toggle/toggle-sample-3/toggle-sample-3.component.ts index 46435d6c01..967e7e266d 100644 --- a/src/app/interactions/toggle/toggle-sample-3/toggle-sample-3.component.ts +++ b/src/app/interactions/toggle/toggle-sample-3/toggle-sample-3.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxButtonDirective, IgxToggleActionDirective, IgxToggleDirective } from 'igniteui-angular/directives'; @Component({ selector: 'app-toggle-sample-3', styleUrls: ['../toggle-samples.scss'], templateUrl: './toggle-sample-3.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxToggleActionDirective, IgxButtonDirective, IgxToggleDirective] }) export class ToggleSample3Component { } diff --git a/src/app/interactions/toggle/toggle-sample-4/toggle-sample-4.component.ts b/src/app/interactions/toggle/toggle-sample-4/toggle-sample-4.component.ts index 147723e574..79832b2ecd 100644 --- a/src/app/interactions/toggle/toggle-sample-4/toggle-sample-4.component.ts +++ b/src/app/interactions/toggle/toggle-sample-4/toggle-sample-4.component.ts @@ -1,11 +1,10 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { IgxButtonDirective, IgxToggleActionDirective, IgxToggleDirective } from 'igniteui-angular/directives'; @Component({ selector: 'app-toggle-sample-4', styleUrls: ['../toggle-samples.scss'], templateUrl: './toggle-sample-4.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxToggleActionDirective, IgxToggleDirective] }) export class ToggleSample4Component { diff --git a/src/app/interactions/toggle/toggle-samples.scss b/src/app/interactions/toggle/toggle-samples.scss index 38afa50748..e7c518d3d2 100644 --- a/src/app/interactions/toggle/toggle-samples.scss +++ b/src/app/interactions/toggle/toggle-samples.scss @@ -9,7 +9,7 @@ height: 260px; } -.toggle-section{ +.toggle-section { flex-flow: row wrap; display: flex; width: 100%; @@ -18,15 +18,6 @@ align-items: center; text-align: center; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); - - .dark-theme & { - background-color: #111; - } - - .custom-body & { - color: var(--ig-surface-500-contrast); - background-color: var(--ig-surface-500); - } } img{ diff --git a/src/app/interactions/toggle/toggle.component.ts b/src/app/interactions/toggle/toggle.component.ts index 9feb67b9eb..71cf12e5f0 100644 --- a/src/app/interactions/toggle/toggle.component.ts +++ b/src/app/interactions/toggle/toggle.component.ts @@ -1,4 +1,4 @@ -import { Component, ElementRef, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ElementRef, ViewChild } from '@angular/core'; import { ConnectedPositioningStrategy, HorizontalAlignment, OverlaySettings, VerticalAlignment } from 'igniteui-angular/core'; import { IgxButtonDirective, IgxToggleDirective } from 'igniteui-angular/directives'; @@ -7,7 +7,6 @@ import { IgxButtonDirective, IgxToggleDirective } from 'igniteui-angular/directi selector: 'app-toggle', styleUrls: ['./toggle-samples.scss'], templateUrl: './toggle.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxToggleDirective] }) export class ToggleComponent { diff --git a/src/app/interactions/tooltip/tooltip-advanced/tooltip-advanced.component.ts b/src/app/interactions/tooltip/tooltip-advanced/tooltip-advanced.component.ts index cb48ac49fb..8f8efcdf8a 100644 --- a/src/app/interactions/tooltip/tooltip-advanced/tooltip-advanced.component.ts +++ b/src/app/interactions/tooltip/tooltip-advanced/tooltip-advanced.component.ts @@ -1,4 +1,4 @@ -import { Component, inject, ChangeDetectionStrategy } from "@angular/core"; +import { Component, inject } from "@angular/core"; import { IgxButtonDirective, IgxTooltipDirective, IgxTooltipTargetDirective } from 'igniteui-angular/directives'; import { IgxListActionDirective, IgxListComponent, IgxListItemComponent, IgxListLineTitleDirective, IgxListThumbnailDirective } from 'igniteui-angular/list'; import { IgxAvatarComponent } from 'igniteui-angular/avatar'; @@ -13,7 +13,6 @@ import { IncomeTaxes } from "./IncomeTaxes"; selector: "app-tooltip-advanced", styleUrls: ["./tooltip-advanced.component.scss"], templateUrl: "./tooltip-advanced.component.html", - changeDetection: ChangeDetectionStrategy.Eager, imports: [ IgxOverlayOutletDirective, IgxTooltipTargetDirective, diff --git a/src/app/interactions/tooltip/tooltip-placement/tooltip-placement.component.ts b/src/app/interactions/tooltip/tooltip-placement/tooltip-placement.component.ts index bc863e25b4..72e3c39aa6 100644 --- a/src/app/interactions/tooltip/tooltip-placement/tooltip-placement.component.ts +++ b/src/app/interactions/tooltip/tooltip-placement/tooltip-placement.component.ts @@ -1,4 +1,4 @@ -import { Component, QueryList, ViewChild, ViewChildren, ChangeDetectionStrategy } from "@angular/core"; +import { Component, QueryList, ViewChild, ViewChildren } from "@angular/core"; import { IgxButtonDirective, IgxTooltipDirective, TooltipPositionStrategy } from 'igniteui-angular/directives'; import { HorizontalAlignment, OverlaySettings, PositionSettings, VerticalAlignment } from 'igniteui-angular/core'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -7,7 +7,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: "app-tooltip-placement", styleUrls: ["./tooltip-placement.component.scss"], templateUrl: "./tooltip-placement.component.html", - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxTooltipDirective, IgxIconComponent] }) export class TooltipPlacementComponent { diff --git a/src/app/interactions/tooltip/tooltip-rich/tooltip-rich.component.ts b/src/app/interactions/tooltip/tooltip-rich/tooltip-rich.component.ts index 4619a80b18..2551556dfc 100644 --- a/src/app/interactions/tooltip/tooltip-rich/tooltip-rich.component.ts +++ b/src/app/interactions/tooltip/tooltip-rich/tooltip-rich.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxIconComponent } from 'igniteui-angular/icon'; import { IgxTooltipDirective, IgxTooltipTargetDirective } from 'igniteui-angular/directives'; import { IgxAvatarComponent } from 'igniteui-angular/avatar'; @@ -7,7 +7,6 @@ import { IgxAvatarComponent } from 'igniteui-angular/avatar'; selector: 'app-tooltip-rich', styleUrls: ['./tooltip-rich.component.scss'], templateUrl: './tooltip-rich.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxIconComponent, IgxTooltipTargetDirective, IgxTooltipDirective, IgxAvatarComponent] }) export class TooltipRichComponent { } diff --git a/src/app/interactions/tooltip/tooltip-simple/tooltip-simple.component.ts b/src/app/interactions/tooltip/tooltip-simple/tooltip-simple.component.ts index f0b8f50019..580f372990 100644 --- a/src/app/interactions/tooltip/tooltip-simple/tooltip-simple.component.ts +++ b/src/app/interactions/tooltip/tooltip-simple/tooltip-simple.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxAvatarComponent } from 'igniteui-angular/avatar'; import { IgxTooltipDirective, IgxTooltipTargetDirective } from 'igniteui-angular/directives'; @@ -6,7 +6,6 @@ import { IgxTooltipDirective, IgxTooltipTargetDirective } from 'igniteui-angular selector: 'app-tooltip-simple', styleUrls: ['./tooltip-simple.component.scss'], templateUrl: './tooltip-simple.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxAvatarComponent, IgxTooltipTargetDirective, IgxTooltipDirective] }) export class TooltipSimpleComponent { } diff --git a/src/app/interactions/tooltip/tooltip-style/tooltip-style.component.ts b/src/app/interactions/tooltip/tooltip-style/tooltip-style.component.ts index b7692cb1e2..ecf19c4a55 100644 --- a/src/app/interactions/tooltip/tooltip-style/tooltip-style.component.ts +++ b/src/app/interactions/tooltip/tooltip-style/tooltip-style.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxAvatarComponent } from 'igniteui-angular/avatar'; import { IgxTooltipDirective, IgxTooltipTargetDirective } from 'igniteui-angular/directives'; import { IgxOverlayOutletDirective } from 'igniteui-angular/core'; @@ -7,7 +7,6 @@ import { IgxOverlayOutletDirective } from 'igniteui-angular/core'; selector: 'app-tooltip-style', styleUrls: ['./tooltip-style.component.scss'], templateUrl: './tooltip-style.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxAvatarComponent, IgxTooltipTargetDirective, IgxOverlayOutletDirective, IgxTooltipDirective] }) export class TooltipStyleComponent { } diff --git a/src/app/interactions/tooltip/tooltip-tailwind-style/tooltip-tailwind-style.component.ts b/src/app/interactions/tooltip/tooltip-tailwind-style/tooltip-tailwind-style.component.ts index 7dcc68788f..0affa8500a 100644 --- a/src/app/interactions/tooltip/tooltip-tailwind-style/tooltip-tailwind-style.component.ts +++ b/src/app/interactions/tooltip/tooltip-tailwind-style/tooltip-tailwind-style.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxAvatarComponent } from 'igniteui-angular/avatar'; import { IgxTooltipDirective, IgxTooltipTargetDirective } from 'igniteui-angular/directives'; import { IgxOverlayOutletDirective } from 'igniteui-angular/core'; @@ -7,7 +7,6 @@ import { IgxOverlayOutletDirective } from 'igniteui-angular/core'; selector: 'app-tooltip-tailwind-style', styleUrls: ['./tooltip-tailwind-style.component.scss'], templateUrl: './tooltip-tailwind-style.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxAvatarComponent, IgxTooltipTargetDirective, IgxOverlayOutletDirective, IgxTooltipDirective] }) export class TooltipTailwindStyleComponent { } diff --git a/src/app/interactions/tooltip/tooltip-triggers/tooltip-triggers.component.ts b/src/app/interactions/tooltip/tooltip-triggers/tooltip-triggers.component.ts index 50003a0a51..544f265896 100644 --- a/src/app/interactions/tooltip/tooltip-triggers/tooltip-triggers.component.ts +++ b/src/app/interactions/tooltip/tooltip-triggers/tooltip-triggers.component.ts @@ -1,4 +1,4 @@ -import { Component, CUSTOM_ELEMENTS_SCHEMA, ChangeDetectionStrategy } from "@angular/core"; +import { Component, CUSTOM_ELEMENTS_SCHEMA } from "@angular/core"; import { IgxTooltipTargetDirective, IgxTooltipDirective, @@ -17,7 +17,6 @@ defineComponents(IgcInputComponent); styleUrls: ["./tooltip-triggers.component.scss"], templateUrl: "./tooltip-triggers.component.html", schemas: [CUSTOM_ELEMENTS_SCHEMA], - changeDetection: ChangeDetectionStrategy.Eager, imports: [ IgxTooltipTargetDirective, IgxTooltipDirective, diff --git a/src/app/layouts/accordion/accordion-sample-1/accordion-sample-1.component.ts b/src/app/layouts/accordion/accordion-sample-1/accordion-sample-1.component.ts index 9c85367267..1f0be5e2e5 100644 --- a/src/app/layouts/accordion/accordion-sample-1/accordion-sample-1.component.ts +++ b/src/app/layouts/accordion/accordion-sample-1/accordion-sample-1.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxSwitchComponent } from 'igniteui-angular/switch'; import { IgxAccordionComponent } from 'igniteui-angular/accordion'; import { IgxExpansionPanelBodyComponent, IgxExpansionPanelComponent, IgxExpansionPanelHeaderComponent, IgxExpansionPanelTitleDirective } from 'igniteui-angular/expansion-panel'; @@ -8,7 +8,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-accordion-sample-1', styleUrls: ['./accordion-sample-1.component.scss'], templateUrl: './accordion-sample-1.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSwitchComponent, FormsModule, IgxAccordionComponent, IgxExpansionPanelComponent, IgxExpansionPanelHeaderComponent, IgxExpansionPanelTitleDirective, IgxExpansionPanelBodyComponent] }) export class AccordionSample1Component { diff --git a/src/app/layouts/accordion/accordion-sample-2/accordion-sample-2.component.ts b/src/app/layouts/accordion/accordion-sample-2/accordion-sample-2.component.ts index b180b65dc4..a474f09611 100644 --- a/src/app/layouts/accordion/accordion-sample-2/accordion-sample-2.component.ts +++ b/src/app/layouts/accordion/accordion-sample-2/accordion-sample-2.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxSwitchComponent } from 'igniteui-angular/switch'; import { IgxAccordionComponent } from 'igniteui-angular/accordion'; import { IgxExpansionPanelBodyComponent, IgxExpansionPanelComponent, IgxExpansionPanelHeaderComponent, IgxExpansionPanelTitleDirective } from 'igniteui-angular/expansion-panel'; @@ -8,7 +8,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-accordion-sample-2', styleUrls: ['./accordion-sample-2.component.scss'], templateUrl: './accordion-sample-2.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSwitchComponent, FormsModule, IgxAccordionComponent, IgxExpansionPanelComponent, IgxExpansionPanelHeaderComponent, IgxExpansionPanelTitleDirective, IgxExpansionPanelBodyComponent] }) export class AccordionSample2Component { diff --git a/src/app/layouts/accordion/accordion-sample-3/accordion-sample-3.component.ts b/src/app/layouts/accordion/accordion-sample-3/accordion-sample-3.component.ts index e8ae021109..e7ec1d4ae7 100644 --- a/src/app/layouts/accordion/accordion-sample-3/accordion-sample-3.component.ts +++ b/src/app/layouts/accordion/accordion-sample-3/accordion-sample-3.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxSliderComponent, IgxSliderType } from 'igniteui-angular/slider'; import { IgxAccordionComponent } from 'igniteui-angular/accordion'; import { IgxExpansionPanelBodyComponent, IgxExpansionPanelComponent, IgxExpansionPanelHeaderComponent, IgxExpansionPanelTitleDirective } from 'igniteui-angular/expansion-panel'; @@ -14,7 +14,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-accordion-sample-3', styleUrls: ['./accordion-sample-3.component.scss'], templateUrl: './accordion-sample-3.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxAccordionComponent, IgxExpansionPanelComponent, IgxExpansionPanelHeaderComponent, IgxExpansionPanelTitleDirective, IgxExpansionPanelBodyComponent, IgxCheckboxComponent, FormsModule, IgxSliderComponent, IgxRadioComponent, IgxIconComponent, IgxTimePickerComponent, IgxLabelDirective] }) export class AccordionSample3Component { diff --git a/src/app/layouts/accordion/accordion-style/accordion-style.component.ts b/src/app/layouts/accordion/accordion-style/accordion-style.component.ts index 0017eea836..36d70999e7 100644 --- a/src/app/layouts/accordion/accordion-style/accordion-style.component.ts +++ b/src/app/layouts/accordion/accordion-style/accordion-style.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxAccordionComponent } from 'igniteui-angular/accordion'; import { IgxExpansionPanelBodyComponent, IgxExpansionPanelComponent, IgxExpansionPanelHeaderComponent, IgxExpansionPanelTitleDirective } from 'igniteui-angular/expansion-panel'; import { FormsModule } from '@angular/forms'; @@ -7,7 +7,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-accordion-style', styleUrls: ['./accordion-style.component.scss'], templateUrl: './accordion-style.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [FormsModule, IgxAccordionComponent, IgxExpansionPanelComponent, IgxExpansionPanelHeaderComponent, IgxExpansionPanelTitleDirective, IgxExpansionPanelBodyComponent] }) export class AccordionStyleComponent { diff --git a/src/app/layouts/avatar/avatar-css-variables/avatar-css-variables.component.html b/src/app/layouts/avatar/avatar-css-variables/avatar-css-variables.component.html deleted file mode 100644 index b023dd87a1..0000000000 --- a/src/app/layouts/avatar/avatar-css-variables/avatar-css-variables.component.html +++ /dev/null @@ -1,2 +0,0 @@ - - diff --git a/src/app/layouts/avatar/avatar-css-variables/avatar-css-variables.component.scss b/src/app/layouts/avatar/avatar-css-variables/avatar-css-variables.component.scss deleted file mode 100644 index 030f54646b..0000000000 --- a/src/app/layouts/avatar/avatar-css-variables/avatar-css-variables.component.scss +++ /dev/null @@ -1,19 +0,0 @@ -@use '../../../../variables' as *; - -:host { - --teal-light: #64ffda; - --teal-dark: #004d40; - - ::ng-deep { - @include avatar( - avatar-theme( - $background: var(--teal-light), - $color: var(--teal-dark) - ) - ); - } -} - -igx-avatar { - margin: 8px; -} diff --git a/src/app/layouts/avatar/avatar-css-variables/avatar-css-variables.component.ts b/src/app/layouts/avatar/avatar-css-variables/avatar-css-variables.component.ts deleted file mode 100644 index 677975a628..0000000000 --- a/src/app/layouts/avatar/avatar-css-variables/avatar-css-variables.component.ts +++ /dev/null @@ -1,12 +0,0 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; -import { IgxAvatarComponent } from 'igniteui-angular/avatar'; - -@Component({ - selector: 'app-avatar-styling', - styleUrls: ['./avatar-css-variables.component.scss'], - templateUrl: './avatar-css-variables.component.html', - changeDetection: ChangeDetectionStrategy.Eager, - imports: [IgxAvatarComponent] -}) - -export class AvatarCSSVariablesComponent { } diff --git a/src/app/layouts/avatar/avatar-overview/avatar-overview.component.html b/src/app/layouts/avatar/avatar-overview/avatar-overview.component.html new file mode 100644 index 0000000000..9f7dd3a84a --- /dev/null +++ b/src/app/layouts/avatar/avatar-overview/avatar-overview.component.html @@ -0,0 +1,51 @@ + + + + + + + + + + + +
+ + + + + + + + +
+ diff --git a/src/app/layouts/avatar/avatar-overview/avatar-overview.component.scss b/src/app/layouts/avatar/avatar-overview/avatar-overview.component.scss new file mode 100644 index 0000000000..6ee88140a1 --- /dev/null +++ b/src/app/layouts/avatar/avatar-overview/avatar-overview.component.scss @@ -0,0 +1,40 @@ +@use "igniteui-theming/sass/typography" as *; + +:host { + display: flex; + flex-wrap: wrap; + align-items: center; + justify-content: center; + gap: rem(100px); + height: 100vh; + padding: rem(32px); +} + +.profile-status { + anchor-name: --profile-status; +} + +.status-badge { + position: absolute; + position-anchor: --profile-status; + inset-block-start: anchor(85%); + inset-inline-start: anchor(85%); + translate: -50% -50%; +} + +.avatar-stack { + display: flex; + + igx-avatar { + box-shadow: 0 0 0 rem(6px) var(--ig-surface-500); + + + igx-avatar { + margin-inline-start: rem(-24px); + } + + &:last-child { + --ig-avatar-background: #e8eef6; + --ig-avatar-color: #6f8097; + } + } +} diff --git a/src/app/layouts/avatar/avatar-overview/avatar-overview.component.ts b/src/app/layouts/avatar/avatar-overview/avatar-overview.component.ts new file mode 100644 index 0000000000..0cf3c4c023 --- /dev/null +++ b/src/app/layouts/avatar/avatar-overview/avatar-overview.component.ts @@ -0,0 +1,11 @@ +import { Component } from '@angular/core'; +import { IgxAvatarComponent } from 'igniteui-angular/avatar'; +import { IgxBadgeComponent } from 'igniteui-angular/badge'; + +@Component({ + selector: 'app-avatar-overview', + styleUrls: ['./avatar-overview.component.scss'], + templateUrl: './avatar-overview.component.html', + imports: [IgxAvatarComponent, IgxBadgeComponent] +}) +export class AvatarOverviewComponent {} diff --git a/src/app/layouts/avatar/avatar-sample-1/avatar-sample-1.component.html b/src/app/layouts/avatar/avatar-sample-1/avatar-sample-1.component.html deleted file mode 100644 index 4aa9cf1ff6..0000000000 --- a/src/app/layouts/avatar/avatar-sample-1/avatar-sample-1.component.html +++ /dev/null @@ -1 +0,0 @@ - diff --git a/src/app/layouts/avatar/avatar-sample-1/avatar-sample-1.component.scss b/src/app/layouts/avatar/avatar-sample-1/avatar-sample-1.component.scss deleted file mode 100644 index d427839f1f..0000000000 --- a/src/app/layouts/avatar/avatar-sample-1/avatar-sample-1.component.scss +++ /dev/null @@ -1,5 +0,0 @@ -.igx-avatar{ - --ig-avatar-background: #e41c77; - color: black; - margin: 15px; -} diff --git a/src/app/layouts/avatar/avatar-sample-1/avatar-sample-1.component.ts b/src/app/layouts/avatar/avatar-sample-1/avatar-sample-1.component.ts deleted file mode 100644 index 4029bf52a0..0000000000 --- a/src/app/layouts/avatar/avatar-sample-1/avatar-sample-1.component.ts +++ /dev/null @@ -1,15 +0,0 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; -import { IgxAvatarComponent } from 'igniteui-angular/avatar'; - -@Component({ - selector: 'app-avatar-sample-1', - styleUrls: ['./avatar-sample-1.component.scss'], - templateUrl: './avatar-sample-1.component.html', - changeDetection: ChangeDetectionStrategy.Eager, - imports: [IgxAvatarComponent] -}) -export class AvatarSample1Component { - - constructor() { } - -} diff --git a/src/app/layouts/avatar/avatar-sample-2/avatar-sample-2.component.html b/src/app/layouts/avatar/avatar-sample-2/avatar-sample-2.component.html deleted file mode 100644 index 9bd64e7071..0000000000 --- a/src/app/layouts/avatar/avatar-sample-2/avatar-sample-2.component.html +++ /dev/null @@ -1 +0,0 @@ - diff --git a/src/app/layouts/avatar/avatar-sample-2/avatar-sample-2.component.scss b/src/app/layouts/avatar/avatar-sample-2/avatar-sample-2.component.scss deleted file mode 100644 index d60ae914a5..0000000000 --- a/src/app/layouts/avatar/avatar-sample-2/avatar-sample-2.component.scss +++ /dev/null @@ -1,4 +0,0 @@ -.igx-avatar{ - margin: 5px 15px; -} - diff --git a/src/app/layouts/avatar/avatar-sample-2/avatar-sample-2.component.ts b/src/app/layouts/avatar/avatar-sample-2/avatar-sample-2.component.ts deleted file mode 100644 index 4020fc4875..0000000000 --- a/src/app/layouts/avatar/avatar-sample-2/avatar-sample-2.component.ts +++ /dev/null @@ -1,15 +0,0 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; -import { IgxAvatarComponent } from 'igniteui-angular/avatar'; - -@Component({ - selector: 'app-avatar-sample-2', - styleUrls: ['./avatar-sample-2.component.scss'], - templateUrl: './avatar-sample-2.component.html', - changeDetection: ChangeDetectionStrategy.Eager, - imports: [IgxAvatarComponent] -}) -export class AvatarSample2Component { - - constructor() { } - -} diff --git a/src/app/layouts/avatar/avatar-sample-3/avatar-sample-3.component.html b/src/app/layouts/avatar/avatar-sample-3/avatar-sample-3.component.html deleted file mode 100644 index a180fe2b65..0000000000 --- a/src/app/layouts/avatar/avatar-sample-3/avatar-sample-3.component.html +++ /dev/null @@ -1,11 +0,0 @@ -
-
- -
-
- -
-
- -
-
diff --git a/src/app/layouts/avatar/avatar-sample-3/avatar-sample-3.component.scss b/src/app/layouts/avatar/avatar-sample-3/avatar-sample-3.component.scss deleted file mode 100644 index 4d7beea4c1..0000000000 --- a/src/app/layouts/avatar/avatar-sample-3/avatar-sample-3.component.scss +++ /dev/null @@ -1,22 +0,0 @@ -.avatars-wrapper { - display: flex; - flex-flow: row wrap; -} - -.avatar-sample { - display: flex; - flex: 1 0 30%; - width: 88px; - height: 88px; - justify-content: center; - align-items: center; - margin: 15px 0; -} - -.avatar-sample.initials .igx-avatar{ - --ig-avatar-background: #e41c77; -} - -.avatar-sample.icon .igx-avatar{ - --ig-avatar-background: #9e9e9e; -} diff --git a/src/app/layouts/avatar/avatar-sample-3/avatar-sample-3.component.ts b/src/app/layouts/avatar/avatar-sample-3/avatar-sample-3.component.ts deleted file mode 100644 index cd6d9d61b4..0000000000 --- a/src/app/layouts/avatar/avatar-sample-3/avatar-sample-3.component.ts +++ /dev/null @@ -1,15 +0,0 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; -import { IgxAvatarComponent } from 'igniteui-angular/avatar'; - -@Component({ - selector: 'app-avatar-sample-3', - styleUrls: ['./avatar-sample-3.component.scss'], - templateUrl: './avatar-sample-3.component.html', - changeDetection: ChangeDetectionStrategy.Eager, - imports: [IgxAvatarComponent] -}) -export class AvatarSample3Component { - - constructor() { } - -} diff --git a/src/app/layouts/avatar/avatar-sample-4/avatar-sample-4.component.html b/src/app/layouts/avatar/avatar-sample-4/avatar-sample-4.component.html deleted file mode 100644 index 8096bd7dd9..0000000000 --- a/src/app/layouts/avatar/avatar-sample-4/avatar-sample-4.component.html +++ /dev/null @@ -1 +0,0 @@ - diff --git a/src/app/layouts/avatar/avatar-sample-4/avatar-sample-4.component.scss b/src/app/layouts/avatar/avatar-sample-4/avatar-sample-4.component.scss deleted file mode 100644 index ecedb13921..0000000000 --- a/src/app/layouts/avatar/avatar-sample-4/avatar-sample-4.component.scss +++ /dev/null @@ -1,4 +0,0 @@ -.igx-avatar{ - --ig-avatar-background: #9e9e9e; - margin: 15px; -} diff --git a/src/app/layouts/avatar/avatar-sample-4/avatar-sample-4.component.ts b/src/app/layouts/avatar/avatar-sample-4/avatar-sample-4.component.ts deleted file mode 100644 index 267b980c10..0000000000 --- a/src/app/layouts/avatar/avatar-sample-4/avatar-sample-4.component.ts +++ /dev/null @@ -1,14 +0,0 @@ -import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; -import { IgxAvatarComponent } from 'igniteui-angular/avatar'; - -@Component({ - selector: 'app-avatar-sample-4', - styleUrls: ['./avatar-sample-4.component.scss'], - templateUrl: './avatar-sample-4.component.html', - changeDetection: ChangeDetectionStrategy.Eager, - imports: [IgxAvatarComponent] -}) - -export class AvatarSample4Component { - -} diff --git a/src/app/layouts/avatar/avatar-shape/avatar-shape.component.html b/src/app/layouts/avatar/avatar-shape/avatar-shape.component.html new file mode 100644 index 0000000000..261085c249 --- /dev/null +++ b/src/app/layouts/avatar/avatar-shape/avatar-shape.component.html @@ -0,0 +1,42 @@ + + + + + +Circle + + + + + + + 2 + +Square + + + + + + + +Rounded diff --git a/src/app/layouts/avatar/avatar-shape/avatar-shape.component.scss b/src/app/layouts/avatar/avatar-shape/avatar-shape.component.scss new file mode 100644 index 0000000000..a6a47666fd --- /dev/null +++ b/src/app/layouts/avatar/avatar-shape/avatar-shape.component.scss @@ -0,0 +1,52 @@ +@use "sass:list"; +@use "igniteui-theming/sass/typography" as *; + +$avatars: circle, square, rounded; + +:host { + display: grid; + grid-auto-flow: column; + grid-template-rows: auto auto; + place-content: center; + place-items: center; + column-gap: rem(40px); + row-gap: rem(8px); + height: 100vh; + padding: rem(32px); +} + +igx-avatar { + grid-row: 1; +} + +span { + grid-row: 2; + text-align: center; + color: var(--ig-gray-600); + + @include type-style("body-1") { + margin: 0; + }; +} + +igx-badge { + --ig-size: var(--ig-size-small); + + position: absolute; + inset-block-start: anchor(85.5%); + inset-inline-start: anchor(85.5%); + translate: -50% -50%; +} + +// The avatars and badges are flat siblings, so every badge needs its own anchor name to pin to. +@each $avatar in $avatars { + $i: list.index($avatars, $avatar); + + igx-avatar:nth-of-type(#{$i}) { + anchor-name: --#{$avatar}; + } + + igx-badge:nth-of-type(#{$i}) { + position-anchor: --#{$avatar}; + } +} diff --git a/src/app/layouts/avatar/avatar-shape/avatar-shape.component.ts b/src/app/layouts/avatar/avatar-shape/avatar-shape.component.ts new file mode 100644 index 0000000000..e7dab279e9 --- /dev/null +++ b/src/app/layouts/avatar/avatar-shape/avatar-shape.component.ts @@ -0,0 +1,27 @@ +import { Component, inject } from '@angular/core'; +import { IgxAvatarComponent } from 'igniteui-angular/avatar'; +import { IgxBadgeComponent } from 'igniteui-angular/badge'; +import { IgxIconComponent, IgxIconService } from 'igniteui-angular/icon'; + +@Component({ + selector: 'app-avatar-shape', + styleUrls: ['./avatar-shape.component.scss'], + templateUrl: './avatar-shape.component.html', + imports: [IgxAvatarComponent, IgxBadgeComponent, IgxIconComponent] +}) +export class AvatarShapeComponent { + private iconService = inject(IgxIconService); + + constructor() { + this.iconService.addSvgIconFromText( + 'mail', + '', + 'material' + ); + this.iconService.addSvgIconFromText( + 'check', + '', + 'material' + ); + } +} diff --git a/src/app/layouts/avatar/avatar-size/avatar-size.component.html b/src/app/layouts/avatar/avatar-size/avatar-size.component.html new file mode 100644 index 0000000000..be7a2c62b4 --- /dev/null +++ b/src/app/layouts/avatar/avatar-size/avatar-size.component.html @@ -0,0 +1,41 @@ + + + + + +Large + + + + + + +Medium + + + + + + +Small diff --git a/src/app/layouts/avatar/avatar-size/avatar-size.component.scss b/src/app/layouts/avatar/avatar-size/avatar-size.component.scss new file mode 100644 index 0000000000..79f4204bbe --- /dev/null +++ b/src/app/layouts/avatar/avatar-size/avatar-size.component.scss @@ -0,0 +1,51 @@ +@use "sass:list"; +@use "igniteui-theming/sass/typography" as *; + +:host { + display: grid; + grid-auto-flow: column; + grid-template-rows: auto auto; + place-content: center; + place-items: center; + column-gap: rem(48px); + row-gap: rem(8px); + height: 100vh; + padding: rem(32px); +} + +igx-avatar { + grid-row: 1; +} + +span { + grid-row: 2; + text-align: center; + color: var(--ig-gray-600); + + @include type-style("body-1") { + margin: 0; + }; +} + +igx-badge { + position: absolute; + inset-block-start: anchor(85.5%); + inset-inline-start: anchor(85.5%); + translate: -50% -50%; +} + +$avatars: large, medium, small; + +// The avatars and badges are flat siblings, so every badge needs its own anchor name to pin to. +@each $avatar in $avatars { + $i: list.index($avatars, $avatar); + + igx-avatar:nth-of-type(#{$i}) { + anchor-name: --#{$avatar}; + } + + igx-badge:nth-of-type(#{$i}) { + --ig-size: var(--ig-size-#{$avatar}); + position-anchor: --#{$avatar}; + } +} diff --git a/src/app/layouts/avatar/avatar-size/avatar-size.component.ts b/src/app/layouts/avatar/avatar-size/avatar-size.component.ts new file mode 100644 index 0000000000..53817b2627 --- /dev/null +++ b/src/app/layouts/avatar/avatar-size/avatar-size.component.ts @@ -0,0 +1,12 @@ +import { Component } from '@angular/core'; +import { IgxAvatarComponent } from 'igniteui-angular/avatar'; +import { IgxBadgeComponent } from 'igniteui-angular/badge'; + +@Component({ + selector: 'app-avatar-size', + styleUrls: ['./avatar-size.component.scss'], + templateUrl: './avatar-size.component.html', + imports: [IgxAvatarComponent, IgxBadgeComponent] +}) +export class AvatarSizeComponent { +} diff --git a/src/app/layouts/avatar/avatar-styling/avatar-styling.component.html b/src/app/layouts/avatar/avatar-styling/avatar-styling.component.html index 3f167defa8..758148130c 100644 --- a/src/app/layouts/avatar/avatar-styling/avatar-styling.component.html +++ b/src/app/layouts/avatar/avatar-styling/avatar-styling.component.html @@ -1,8 +1,67 @@ -
-
- -
-
- -
-
+ + Chats + + +
+ + + + + +
+

Nick Evans

+ Hi Samira, thanks for the ... + 9:44 AM + + + +
+ + + + +
+

James Ford

+ I'll send the text and im ... + 8:30 AM + + + +
+ + + + + +
+

Kate Porter

+ That's great! + Yesterday + + + Meetings + + + + + +

Weekly Meeting

+ https://www.infra.com + Monday + + + + + + +

Design Discussion

+ https://www.infra.com + 11:30 AM + + diff --git a/src/app/layouts/avatar/avatar-styling/avatar-styling.component.scss b/src/app/layouts/avatar/avatar-styling/avatar-styling.component.scss index bfc2650f8e..e4e2886f9b 100644 --- a/src/app/layouts/avatar/avatar-styling/avatar-styling.component.scss +++ b/src/app/layouts/avatar/avatar-styling/avatar-styling.component.scss @@ -1,19 +1,40 @@ -@use "layout.scss"; -@use "igniteui-angular/theming" as *; +@use "igniteui-theming/sass/typography" as *; -$initials-avatar-theme: avatar-theme( - $background: #72da67, - $border-radius: 16px -); +:host { + display: flex; + align-items: center; + justify-content: center; + height: 100vh; +} + +igx-list { + --ig-list-border-width: #{rem(1px)}; + --ig-list-border-color: var(--ig-gray-300); + --ig-list-header-text-color: var(--ig-gray-900); -$icon-avatar-theme: avatar-theme( - $background: #217346, -); + max-width: rem(328px); +} + +igx-avatar { + --ig-avatar-background: var(--ig-gray-300); + --ig-avatar-color: var(--ig-gray-300-contrast); +} + +.avatar-with-badge { + position: relative; +} + +igx-badge { + --ig-size: var(--ig-size-small); +} -.initials{ - @include tokens($initials-avatar-theme); +.avatar-status { + position: absolute; + inset-inline-end: rem(-4px); + inset-block-end: rem(-4px); } -.icon{ - @include tokens($icon-avatar-theme); +.avatar-muted-badge { + --ig-badge-background-color: var(--ig-gray-300); + --ig-badge-icon-color: var(--ig-gray-300-contrast); } diff --git a/src/app/layouts/avatar/avatar-styling/avatar-styling.component.ts b/src/app/layouts/avatar/avatar-styling/avatar-styling.component.ts index 86b0f923f3..1f5db501f2 100644 --- a/src/app/layouts/avatar/avatar-styling/avatar-styling.component.ts +++ b/src/app/layouts/avatar/avatar-styling/avatar-styling.component.ts @@ -1,14 +1,60 @@ -import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, inject } from '@angular/core'; import { IgxAvatarComponent } from 'igniteui-angular/avatar'; +import { IgxBadgeComponent } from 'igniteui-angular/badge'; +import { IgxIconComponent, IgxIconService } from 'igniteui-angular/icon'; +import { + IgxListActionDirective, + IgxListComponent, + IgxListItemComponent, + IgxListLineSubTitleDirective, + IgxListLineTitleDirective, + IgxListThumbnailDirective +} from 'igniteui-angular/list'; @Component({ selector: 'app-avatar-styling', styleUrls: ['./avatar-styling.component.scss'], templateUrl: './avatar-styling.component.html', - changeDetection: ChangeDetectionStrategy.Eager, - imports: [IgxAvatarComponent] + imports: [ + IgxAvatarComponent, + IgxBadgeComponent, + IgxIconComponent, + IgxListActionDirective, + IgxListComponent, + IgxListItemComponent, + IgxListLineSubTitleDirective, + IgxListLineTitleDirective, + IgxListThumbnailDirective + ] }) - export class AvatarStylingSampleComponent { + private iconService = inject(IgxIconService); + constructor() { + this.iconService.addSvgIconFromText( + 'calendar', + '', + 'material' + ); + this.iconService.addSvgIconFromText( + 'check', + '', + 'material' + ); + this.iconService.addSvgIconFromText( + 'x', + '', + 'material' + ); + this.iconService.addSvgIconFromText( + 'horizontalRule', + '', + 'material' + ); + this.iconService.addSvgIconFromText( + 'group', + '', + 'material' + ); + } } diff --git a/src/app/layouts/avatar/avatar-styling/layout.scss b/src/app/layouts/avatar/avatar-styling/layout.scss deleted file mode 100644 index 19e8de55dd..0000000000 --- a/src/app/layouts/avatar/avatar-styling/layout.scss +++ /dev/null @@ -1,13 +0,0 @@ -.avatars-wrapper { - display: flex; - flex-flow: row wrap; -} - -.avatar-sample { - display: flex; - flex: 1 0 30%; - width: 88px; - justify-content: center; - align-items: center; - margin: 15px 0; -} diff --git a/src/app/layouts/avatar/avatar-tailwind-styling/avatar-tailwind-styling.component.html b/src/app/layouts/avatar/avatar-tailwind-styling/avatar-tailwind-styling.component.html index 517decd549..d4fff12c11 100644 --- a/src/app/layouts/avatar/avatar-tailwind-styling/avatar-tailwind-styling.component.html +++ b/src/app/layouts/avatar/avatar-tailwind-styling/avatar-tailwind-styling.component.html @@ -1 +1,105 @@ - + + + Cafe interior + + + + + Kate Thompson +

3D Artist. Turning polygons into worlds and immersive digital realities

+ + + +
+ @for (stat of profileStats; track stat.label; let isLast = $last) { +
+ {{ stat.value }} + {{ stat.label }} +
+ @if (!isLast) { + + } + } +
+ + + +
+ + + +
+ + + + + + + + + + Kate Thompson +

3D Artist. Turning polygons into worlds and immersive digital realities

+ + +
+ @for (stat of profileStats; track stat.label; let isLast = $last) { +
+ {{ stat.value }} + {{ stat.label }} +
+ @if (!isLast) { + + } + } +
+ + + +
+ + + +
+ + + diff --git a/src/app/layouts/avatar/avatar-tailwind-styling/avatar-tailwind-styling.component.scss b/src/app/layouts/avatar/avatar-tailwind-styling/avatar-tailwind-styling.component.scss index 8abca650cd..ea7083981e 100644 --- a/src/app/layouts/avatar/avatar-tailwind-styling/avatar-tailwind-styling.component.scss +++ b/src/app/layouts/avatar/avatar-tailwind-styling/avatar-tailwind-styling.component.scss @@ -1,3 +1,36 @@ -igx-avatar { - margin: 12px; +@use "igniteui-theming/sass/typography" as *; + +:host { + display: grid; + grid-template-columns: repeat(auto-fit, rem(344px)); + gap: rem(40px); + place-content: center; + height: 100vh; +} + +igx-card:nth-of-type(2) { + align-self: center; +} + +.card-sample-custom-subtitle { + display: block; + color: var(--ig-gray-700); + + @include type-style("body-2") { + margin-block-start: rem(8px); + }; +} + +.stats-title { + color: var(--ig-gray-900); + + @include type-style("subtitle-1") { + font-weight: 600; + }; +} + +.stats-subtitle { + color: var(--ig-gray-500); + + @include type-style("body-2"); } diff --git a/src/app/layouts/avatar/avatar-tailwind-styling/avatar-tailwind-styling.component.ts b/src/app/layouts/avatar/avatar-tailwind-styling/avatar-tailwind-styling.component.ts index 419e929468..0b3b8bfc73 100644 --- a/src/app/layouts/avatar/avatar-tailwind-styling/avatar-tailwind-styling.component.ts +++ b/src/app/layouts/avatar/avatar-tailwind-styling/avatar-tailwind-styling.component.ts @@ -1,12 +1,51 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component, inject } from '@angular/core'; import { IgxAvatarComponent } from 'igniteui-angular/avatar'; +import { IgxButtonDirective, IgxDividerComponent, IgxIconButtonDirective, IgxRippleDirective } from 'igniteui-angular/directives'; +import { + IgxCardActionsComponent, + IgxCardComponent, + IgxCardContentDirective, + IgxCardHeaderComponent, + IgxCardHeaderTitleDirective, + IgxCardMediaDirective, + IgxCardThumbnailDirective +} from 'igniteui-angular/card'; +import { IgxIconComponent, IgxIconService } from 'igniteui-angular/icon'; +import { berealIcon, instagramIcon, plusIcon, threadsIcon } from './icons'; @Component({ selector: 'app-avatar-tailwind-styling', styleUrls: ['./avatar-tailwind-styling.component.scss'], templateUrl: './avatar-tailwind-styling.component.html', - changeDetection: ChangeDetectionStrategy.Eager, - imports: [IgxAvatarComponent] + imports: [ + IgxAvatarComponent, + IgxButtonDirective, + IgxCardActionsComponent, + IgxCardComponent, + IgxCardContentDirective, + IgxCardHeaderComponent, + IgxCardHeaderTitleDirective, + IgxCardMediaDirective, + IgxCardThumbnailDirective, + IgxDividerComponent, + IgxIconButtonDirective, + IgxIconComponent, + IgxRippleDirective + ] }) +export class AvatarTailwindStylingSampleComponent { + private iconService = inject(IgxIconService); -export class AvatarTailwindStylingSampleComponent {} + public profileStats = [ + { value: '23.9K', label: 'Likes' }, + { value: '163', label: 'Posts' }, + { value: '23.9K', label: 'Views' } + ]; + + constructor() { + this.iconService.addSvgIconFromText('instagram', instagramIcon, 'material'); + this.iconService.addSvgIconFromText('bereal', berealIcon, 'material'); + this.iconService.addSvgIconFromText('threads', threadsIcon, 'material'); + this.iconService.addSvgIconFromText('plus', plusIcon, 'material'); + } +} diff --git a/src/app/layouts/avatar/avatar-tailwind-styling/icons.ts b/src/app/layouts/avatar/avatar-tailwind-styling/icons.ts new file mode 100644 index 0000000000..70599bae5f --- /dev/null +++ b/src/app/layouts/avatar/avatar-tailwind-styling/icons.ts @@ -0,0 +1,11 @@ +export const instagramIcon = + ''; + +export const berealIcon = + ''; + +export const threadsIcon = + ''; + +export const plusIcon = + ''; diff --git a/src/app/layouts/avatar/avatar-variants/avatar-variants.component.html b/src/app/layouts/avatar/avatar-variants/avatar-variants.component.html new file mode 100644 index 0000000000..6ac2758982 --- /dev/null +++ b/src/app/layouts/avatar/avatar-variants/avatar-variants.component.html @@ -0,0 +1,44 @@ + + + + + +Image + + + + + + + 2 + +Icon + + + + + + + +Initials + diff --git a/src/app/layouts/avatar/avatar-variants/avatar-variants.component.scss b/src/app/layouts/avatar/avatar-variants/avatar-variants.component.scss new file mode 100644 index 0000000000..a4c56b17fc --- /dev/null +++ b/src/app/layouts/avatar/avatar-variants/avatar-variants.component.scss @@ -0,0 +1,53 @@ +@use "sass:list"; +@use "igniteui-theming/sass/typography" as *; + +$avatars: circle, square, rounded; + +:host { + display: grid; + grid-auto-flow: column; + grid-template-rows: auto auto; + place-content: center; + place-items: center; + column-gap: rem(48px); + row-gap: rem(8px); + height: 100vh; + padding: rem(32px); +} + +// :where() keeps the sample's own rules at zero +:where(igx-avatar) { + grid-row: 1; +} + +:where(span) { + grid-row: 2; + text-align: center; + color: var(--ig-gray-600); + + @include type-style("body-1") { + margin: 0; + }; +} + +:where(igx-badge) { + --ig-size: var(--ig-size-small); + + position: absolute; + inset-block-start: anchor(85.5%); + inset-inline-start: anchor(85.5%); + translate: -50% -50%; +} + +// The avatars and badges are flat siblings, so every badge needs its own anchor name to pin to. +@each $avatar in $avatars { + $i: list.index($avatars, $avatar); + + igx-avatar:nth-of-type(#{$i}) { + anchor-name: --#{$avatar}; + } + + igx-badge:nth-of-type(#{$i}) { + position-anchor: --#{$avatar}; + } +} diff --git a/src/app/layouts/avatar/avatar-variants/avatar-variants.component.ts b/src/app/layouts/avatar/avatar-variants/avatar-variants.component.ts new file mode 100644 index 0000000000..6a9d8810f2 --- /dev/null +++ b/src/app/layouts/avatar/avatar-variants/avatar-variants.component.ts @@ -0,0 +1,27 @@ +import { Component, inject } from '@angular/core'; +import { IgxAvatarComponent } from 'igniteui-angular/avatar'; +import { IgxBadgeComponent } from 'igniteui-angular/badge'; +import { IgxIconComponent, IgxIconService } from 'igniteui-angular/icon'; + +@Component({ + selector: 'app-avatar-variants', + styleUrls: ['./avatar-variants.component.scss'], + templateUrl: './avatar-variants.component.html', + imports: [IgxAvatarComponent, IgxBadgeComponent, IgxIconComponent] +}) +export class AvatarVariantsComponent { + private iconService = inject(IgxIconService); + + constructor() { + this.iconService.addSvgIconFromText( + 'mail', + '', + 'material' + ); + this.iconService.addSvgIconFromText( + 'check', + '', + 'material' + ); + } +} diff --git a/src/app/layouts/card/card-sample-1/card-sample-1.component.ts b/src/app/layouts/card/card-sample-1/card-sample-1.component.ts index 1fdd86ad2b..70b5e439f3 100644 --- a/src/app/layouts/card/card-sample-1/card-sample-1.component.ts +++ b/src/app/layouts/card/card-sample-1/card-sample-1.component.ts @@ -1,7 +1,7 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { Card } from '../card.blueprint'; import { IgxCardActionsComponent, IgxCardComponent, IgxCardHeaderComponent, IgxCardHeaderSubtitleDirective, IgxCardHeaderTitleDirective, IgxCardMediaDirective } from 'igniteui-angular/card'; -import { IgxDividerDirective, IgxIconButtonDirective, IgxRippleDirective } from 'igniteui-angular/directives'; +import { IgxDividerComponent, IgxIconButtonDirective, IgxRippleDirective } from 'igniteui-angular/directives'; import { IgxSuffixDirective } from 'igniteui-angular/input-group'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -10,8 +10,7 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: 'app-igx-card-simple', styleUrls: ['./card-sample-1.component.scss'], templateUrl: './card-sample-1.component.html', - changeDetection: ChangeDetectionStrategy.Eager, - imports: [IgxCardComponent, IgxCardHeaderComponent, IgxCardHeaderTitleDirective, IgxCardHeaderSubtitleDirective, IgxCardMediaDirective, IgxDividerDirective, IgxCardActionsComponent, IgxIconButtonDirective, IgxRippleDirective, IgxSuffixDirective, IgxIconComponent] + imports: [IgxCardComponent, IgxCardHeaderComponent, IgxCardHeaderTitleDirective, IgxCardHeaderSubtitleDirective, IgxCardMediaDirective, IgxDividerComponent, IgxCardActionsComponent, IgxIconButtonDirective, IgxRippleDirective, IgxSuffixDirective, IgxIconComponent] }) export class CardSample1Component { public card = new Card({ diff --git a/src/app/layouts/card/card-sample-2/card-sample-2.component.ts b/src/app/layouts/card/card-sample-2/card-sample-2.component.ts index 338ffe01c5..e676655d2b 100644 --- a/src/app/layouts/card/card-sample-2/card-sample-2.component.ts +++ b/src/app/layouts/card/card-sample-2/card-sample-2.component.ts @@ -1,7 +1,7 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { Card } from '../card.blueprint'; import { IgxCardActionsComponent, IgxCardComponent, IgxCardContentDirective, IgxCardHeaderComponent, IgxCardHeaderSubtitleDirective, IgxCardHeaderTitleDirective, IgxCardMediaDirective } from 'igniteui-angular/card'; -import { IgxDividerDirective, IgxFlexDirective, IgxIconButtonDirective, IgxLayoutDirective, IgxRippleDirective } from 'igniteui-angular/directives'; +import { IgxDividerComponent, IgxFlexDirective, IgxIconButtonDirective, IgxLayoutDirective, IgxRippleDirective } from 'igniteui-angular/directives'; import { IgxSuffixDirective } from 'igniteui-angular/input-group'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -10,8 +10,7 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: 'app-card-sample-2', styleUrls: ['./card-sample-2.component.scss'], templateUrl: './card-sample-2.component.html', - changeDetection: ChangeDetectionStrategy.Eager, - imports: [IgxCardComponent, IgxLayoutDirective, IgxFlexDirective, IgxCardHeaderComponent, IgxCardHeaderTitleDirective, IgxCardHeaderSubtitleDirective, IgxCardMediaDirective, IgxCardContentDirective, IgxDividerDirective, IgxCardActionsComponent, IgxIconButtonDirective, IgxRippleDirective, IgxSuffixDirective, IgxIconComponent] + imports: [IgxCardComponent, IgxLayoutDirective, IgxFlexDirective, IgxCardHeaderComponent, IgxCardHeaderTitleDirective, IgxCardHeaderSubtitleDirective, IgxCardMediaDirective, IgxCardContentDirective, IgxDividerComponent, IgxCardActionsComponent, IgxIconButtonDirective, IgxRippleDirective, IgxSuffixDirective, IgxIconComponent] }) export class CardSample2Component { public card = new Card({ diff --git a/src/app/layouts/card/card-sample-3/card-sample-3.component.ts b/src/app/layouts/card/card-sample-3/card-sample-3.component.ts index b3af204cac..24963119b2 100644 --- a/src/app/layouts/card/card-sample-3/card-sample-3.component.ts +++ b/src/app/layouts/card/card-sample-3/card-sample-3.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { Card } from '../card.blueprint'; import { IgxCardActionsComponent, IgxCardComponent, IgxCardContentDirective, IgxCardHeaderComponent, IgxCardHeaderSubtitleDirective, IgxCardHeaderTitleDirective, IgxCardMediaDirective } from 'igniteui-angular/card'; import { IgxButtonDirective, IgxFlexDirective, IgxLayoutDirective, IgxRippleDirective } from 'igniteui-angular/directives'; @@ -10,7 +10,6 @@ import { IgxPrefixDirective } from 'igniteui-angular/input-group'; selector: 'app-card-sample-3', styleUrls: ['./card-sample-3.component.scss'], templateUrl: './card-sample-3.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxCardComponent, IgxLayoutDirective, IgxFlexDirective, IgxCardHeaderComponent, IgxAvatarComponent, IgxCardHeaderTitleDirective, IgxCardHeaderSubtitleDirective, IgxCardContentDirective, IgxCardActionsComponent, IgxButtonDirective, IgxRippleDirective, IgxPrefixDirective, IgxCardMediaDirective] }) export class CardSample3Component { diff --git a/src/app/layouts/card/card-sample-4/card-sample-4.component.ts b/src/app/layouts/card/card-sample-4/card-sample-4.component.ts index 249776b690..c2651ac134 100644 --- a/src/app/layouts/card/card-sample-4/card-sample-4.component.ts +++ b/src/app/layouts/card/card-sample-4/card-sample-4.component.ts @@ -1,10 +1,10 @@ -import { Component, OnInit, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild, inject } from '@angular/core'; import { IgxExpansionPanelBodyComponent, IgxExpansionPanelComponent } from 'igniteui-angular/expansion-panel'; import { IgxIconComponent, IgxIconService } from 'igniteui-angular/icon'; import { IgxCardActionsComponent, IgxCardComponent, IgxCardContentDirective, IgxCardHeaderComponent, IgxCardHeaderSubtitleDirective, IgxCardHeaderTitleDirective, IgxCardMediaDirective } from 'igniteui-angular/card'; import { IgxSliderComponent } from 'igniteui-angular/slider'; import { IgxListComponent, IgxListItemComponent } from 'igniteui-angular/list'; -import { IgxButtonDirective, IgxDividerDirective, IgxRippleDirective } from 'igniteui-angular/directives'; +import { IgxButtonDirective, IgxDividerComponent, IgxRippleDirective } from 'igniteui-angular/directives'; import { IgxPrefixDirective } from 'igniteui-angular/input-group'; import { IgxAvatarComponent } from 'igniteui-angular/avatar'; import { IgxChipComponent } from 'igniteui-angular/chips'; @@ -22,8 +22,7 @@ import { selector: 'app-card-sample-4', styleUrls: ['./card-sample-4.component.scss'], templateUrl: './card-sample-4.component.html', - changeDetection: ChangeDetectionStrategy.Eager, - imports: [IgxCardComponent, IgxCardHeaderComponent, IgxCardHeaderTitleDirective, IgxCardHeaderSubtitleDirective, IgxCardContentDirective, IgxChipComponent, IgxIconComponent, IgxSliderComponent, IgxExpansionPanelComponent, IgxExpansionPanelBodyComponent, IgxListComponent, IgxListItemComponent, IgxDividerDirective, IgxCardActionsComponent, IgxButtonDirective, IgxRippleDirective, IgxPrefixDirective, IgxCardMediaDirective, IgxAvatarComponent] + imports: [IgxCardComponent, IgxCardHeaderComponent, IgxCardHeaderTitleDirective, IgxCardHeaderSubtitleDirective, IgxCardContentDirective, IgxChipComponent, IgxIconComponent, IgxSliderComponent, IgxExpansionPanelComponent, IgxExpansionPanelBodyComponent, IgxListComponent, IgxListItemComponent, IgxDividerComponent, IgxCardActionsComponent, IgxButtonDirective, IgxRippleDirective, IgxPrefixDirective, IgxCardMediaDirective, IgxAvatarComponent] }) export class CardSample4Component implements OnInit { private iconService = inject(IgxIconService); diff --git a/src/app/layouts/card/card-styling-sample/card-styling-sample.component.ts b/src/app/layouts/card/card-styling-sample/card-styling-sample.component.ts index 2179ca0349..36edbf29cf 100644 --- a/src/app/layouts/card/card-styling-sample/card-styling-sample.component.ts +++ b/src/app/layouts/card/card-styling-sample/card-styling-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, inject, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, inject, OnInit } from '@angular/core'; import { Card } from '../card.blueprint'; import { IgxCardActionsComponent, IgxCardComponent, IgxCardContentDirective, IgxCardHeaderComponent, IgxCardHeaderSubtitleDirective, IgxCardHeaderTitleDirective, IgxCardMediaDirective } from 'igniteui-angular/card'; import { IgxDividerModule, IgxIconButtonDirective } from 'igniteui-angular/directives'; @@ -10,10 +10,9 @@ import { IgxChipComponent } from 'igniteui-angular/chips'; selector: 'app-card-styling-sample', templateUrl: './card-styling-sample.component.html', styleUrls: ['./card-styling-sample.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, - imports: [IgxCardComponent, IgxCardMediaDirective, IgxCardHeaderComponent, - IgxCardHeaderTitleDirective, IgxCardHeaderSubtitleDirective, - IgxCardContentDirective, IgxCardActionsComponent, IgxIconButtonDirective, + imports: [IgxCardComponent, IgxCardMediaDirective, IgxCardHeaderComponent, + IgxCardHeaderTitleDirective, IgxCardHeaderSubtitleDirective, + IgxCardContentDirective, IgxCardActionsComponent, IgxIconButtonDirective, IgxIconComponent, IgxAvatarComponent, IgxDividerModule, IgxChipComponent] }) export class CardStylingSampleComponent implements OnInit { diff --git a/src/app/layouts/card/card-tailwind-styling-sample/card-tailwind-styling-sample.component.ts b/src/app/layouts/card/card-tailwind-styling-sample/card-tailwind-styling-sample.component.ts index a2a0a05720..59c146a849 100644 --- a/src/app/layouts/card/card-tailwind-styling-sample/card-tailwind-styling-sample.component.ts +++ b/src/app/layouts/card/card-tailwind-styling-sample/card-tailwind-styling-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { Card } from '../card.blueprint'; import { IgxCardActionsComponent, IgxCardComponent, IgxCardContentDirective, IgxCardHeaderComponent, IgxCardHeaderSubtitleDirective, IgxCardHeaderTitleDirective, IgxCardMediaDirective } from 'igniteui-angular/card'; import { IgxIconButtonDirective, IgxRippleDirective } from 'igniteui-angular/directives'; @@ -10,7 +10,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: 'app-card-tailwind-styling-sample', templateUrl: './card-tailwind-styling-sample.component.html', styleUrls: ['./card-tailwind-styling-sample.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxCardComponent, IgxCardMediaDirective, IgxCardHeaderComponent, IgxCardHeaderTitleDirective, IgxCardHeaderSubtitleDirective, IgxCardContentDirective, IgxCardActionsComponent, IgxIconButtonDirective, IgxRippleDirective, IgxSuffixDirective, IgxIconComponent] }) export class CardTailwindStylingSampleComponent { diff --git a/src/app/layouts/card/card.component.ts b/src/app/layouts/card/card.component.ts index 416467589b..d6eb777150 100644 --- a/src/app/layouts/card/card.component.ts +++ b/src/app/layouts/card/card.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { Card } from './card.blueprint'; import { IgxCardActionsComponent, IgxCardComponent, IgxCardContentDirective, IgxCardHeaderComponent, IgxCardHeaderSubtitleDirective, IgxCardHeaderTitleDirective, IgxCardMediaDirective } from 'igniteui-angular/card'; import { IgxButtonDirective, IgxIconButtonDirective, IgxRippleDirective } from 'igniteui-angular/directives'; @@ -10,7 +10,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: 'app-card', styleUrls: ['./card.component.scss'], templateUrl: './card.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxCardComponent, IgxCardMediaDirective, IgxCardHeaderComponent, IgxCardHeaderTitleDirective, IgxCardHeaderSubtitleDirective, IgxCardContentDirective, IgxCardActionsComponent, IgxButtonDirective, IgxRippleDirective, IgxPrefixDirective, IgxIconButtonDirective, IgxSuffixDirective, IgxIconComponent] }) export class CardComponent { diff --git a/src/app/layouts/carousel/carousel-animations-sample/carousel-animations-sample.component.ts b/src/app/layouts/carousel/carousel-animations-sample/carousel-animations-sample.component.ts index 02be5b3a7c..a2cb7bf53a 100644 --- a/src/app/layouts/carousel/carousel-animations-sample/carousel-animations-sample.component.ts +++ b/src/app/layouts/carousel/carousel-animations-sample/carousel-animations-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { IgxCarouselComponent, IgxSlideComponent } from 'igniteui-angular/carousel'; import { IgxSelectComponent, IgxSelectItemComponent } from 'igniteui-angular/select'; import { IgxCardActionsComponent, IgxCardComponent, IgxCardContentDirective, IgxCardHeaderComponent, IgxCardHeaderTitleDirective, IgxCardMediaDirective } from 'igniteui-angular/card'; @@ -12,7 +12,6 @@ import { TitleCasePipe } from '@angular/common'; selector: 'app-carousel', styleUrls: ['./carousel-animations-sample.component.scss'], templateUrl: './carousel-animations-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSelectComponent, IgxSwitchComponent, FormsModule, IgxSelectItemComponent, IgxCarouselComponent, IgxSlideComponent, IgxCardComponent, IgxCardHeaderComponent, IgxCardHeaderTitleDirective, IgxCardContentDirective, IgxCardMediaDirective, IgxCardActionsComponent, IgxButtonDirective, IgxPrefixDirective, TitleCasePipe] }) export class CarouselAnimationsSampleComponent { diff --git a/src/app/layouts/carousel/carousel-no-navigation-sample/carousel-no-navigation-sample.component.ts b/src/app/layouts/carousel/carousel-no-navigation-sample/carousel-no-navigation-sample.component.ts index f4bfddcce5..e848ec5553 100644 --- a/src/app/layouts/carousel/carousel-no-navigation-sample/carousel-no-navigation-sample.component.ts +++ b/src/app/layouts/carousel/carousel-no-navigation-sample/carousel-no-navigation-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { ISlideEventArgs, IgxCarouselComponent, IgxSlideComponent } from 'igniteui-angular/carousel'; import { IListItemClickEventArgs, IgxListComponent, IgxListItemComponent, IgxListThumbnailDirective } from 'igniteui-angular/list'; import { NgStyle, NgClass, CurrencyPipe } from '@angular/common'; @@ -7,7 +7,6 @@ import { NgStyle, NgClass, CurrencyPipe } from '@angular/common'; selector: 'app-carousel', styleUrls: ['./carousel-no-navigation-sample.component.scss'], templateUrl: './carousel-no-navigation-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxCarouselComponent, IgxSlideComponent, NgStyle, NgClass, IgxListComponent, IgxListItemComponent, IgxListThumbnailDirective, CurrencyPipe] }) export class CarouselNoNavigationSampleComponent implements OnInit { diff --git a/src/app/layouts/carousel/carousel-styling-sample/carousel-styling-sample.component.ts b/src/app/layouts/carousel/carousel-styling-sample/carousel-styling-sample.component.ts index dfb2e09354..b8c53cf230 100644 --- a/src/app/layouts/carousel/carousel-styling-sample/carousel-styling-sample.component.ts +++ b/src/app/layouts/carousel/carousel-styling-sample/carousel-styling-sample.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxCarouselComponent, IgxSlideComponent } from 'igniteui-angular/carousel'; @Component({ selector: 'app-carousel', styleUrls: ['./carousel-styling-sample.component.scss'], templateUrl: './carousel-styling-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxCarouselComponent, IgxSlideComponent] }) diff --git a/src/app/layouts/carousel/carousel-tailwind-sample/carousel-tailwind-sample.component.ts b/src/app/layouts/carousel/carousel-tailwind-sample/carousel-tailwind-sample.component.ts index 8eaaded0ee..58903f63e3 100644 --- a/src/app/layouts/carousel/carousel-tailwind-sample/carousel-tailwind-sample.component.ts +++ b/src/app/layouts/carousel/carousel-tailwind-sample/carousel-tailwind-sample.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxCarouselComponent, IgxSlideComponent } from 'igniteui-angular/carousel'; @Component({ selector: 'app-carousel', styleUrls: ['./carousel-tailwind-sample.component.scss'], templateUrl: './carousel-tailwind-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxCarouselComponent, IgxSlideComponent] }) diff --git a/src/app/layouts/carousel/carousel-with-components-sample/carousel-with-components-sample.component.ts b/src/app/layouts/carousel/carousel-with-components-sample/carousel-with-components-sample.component.ts index afdcfc2562..02c4a0a0a3 100644 --- a/src/app/layouts/carousel/carousel-with-components-sample/carousel-with-components-sample.component.ts +++ b/src/app/layouts/carousel/carousel-with-components-sample/carousel-with-components-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxCarouselComponent, IgxSlideComponent } from 'igniteui-angular/carousel'; import { IgxInputDirective, IgxInputGroupComponent, IgxLabelDirective, IgxPrefixDirective } from 'igniteui-angular/input-group'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -9,7 +9,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-carousel', styleUrls: ['./carousel-with-components-sample.component.scss'], templateUrl: './carousel-with-components-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxCarouselComponent, IgxSlideComponent, FormsModule, IgxInputGroupComponent, IgxPrefixDirective, IgxIconComponent, IgxLabelDirective, IgxInputDirective, IgxButtonDirective] }) diff --git a/src/app/layouts/carousel/carousel.component.ts b/src/app/layouts/carousel/carousel.component.ts index b590a9c811..083bbe7709 100644 --- a/src/app/layouts/carousel/carousel.component.ts +++ b/src/app/layouts/carousel/carousel.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxCarouselComponent, IgxSlideComponent } from 'igniteui-angular/carousel'; @@ -6,7 +6,6 @@ import { IgxCarouselComponent, IgxSlideComponent } from 'igniteui-angular/carous selector: 'app-carousel', styleUrls: ['./carousel.component.scss'], templateUrl: './carousel.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxCarouselComponent, IgxSlideComponent] }) diff --git a/src/app/layouts/divider/dashed/divider-dashed.component.ts b/src/app/layouts/divider/dashed/divider-dashed.component.ts index 26e734b601..734a137384 100644 --- a/src/app/layouts/divider/dashed/divider-dashed.component.ts +++ b/src/app/layouts/divider/dashed/divider-dashed.component.ts @@ -1,12 +1,11 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; -import { IgxDividerDirective } from 'igniteui-angular/directives'; +import { Component } from '@angular/core'; +import { IgxDividerComponent } from 'igniteui-angular/directives'; @Component({ selector: 'app-divider-dashed', styleUrls: ['./divider-dashed.component.scss'], templateUrl: './divider-dashed.component.html', - changeDetection: ChangeDetectionStrategy.Eager, - imports: [IgxDividerDirective] + imports: [IgxDividerComponent] }) export class DividerDashedComponent { diff --git a/src/app/layouts/divider/default/divider-default.component.ts b/src/app/layouts/divider/default/divider-default.component.ts index fbd3fb688b..9469002cf8 100644 --- a/src/app/layouts/divider/default/divider-default.component.ts +++ b/src/app/layouts/divider/default/divider-default.component.ts @@ -1,12 +1,11 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; -import { IgxDividerDirective } from 'igniteui-angular/directives'; +import { Component } from '@angular/core'; +import { IgxDividerComponent } from 'igniteui-angular/directives'; @Component({ selector: 'app-divider-default', styleUrls: ['./divider-default.component.scss'], templateUrl: './divider-default.component.html', - changeDetection: ChangeDetectionStrategy.Eager, - imports: [IgxDividerDirective] + imports: [IgxDividerComponent] }) export class DividerDefaultComponent { diff --git a/src/app/layouts/divider/inset/divider-inset.component.ts b/src/app/layouts/divider/inset/divider-inset.component.ts index 5f7d3459fe..038499f9b3 100644 --- a/src/app/layouts/divider/inset/divider-inset.component.ts +++ b/src/app/layouts/divider/inset/divider-inset.component.ts @@ -1,12 +1,11 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; -import { IgxDividerDirective } from 'igniteui-angular/directives'; +import { Component } from '@angular/core'; +import { IgxDividerComponent } from 'igniteui-angular/directives'; @Component({ selector: 'app-divider-inset', styleUrls: ['./divider-inset.component.scss'], templateUrl: './divider-inset.component.html', - changeDetection: ChangeDetectionStrategy.Eager, - imports: [IgxDividerDirective] + imports: [IgxDividerComponent] }) export class DividerInsetComponent { diff --git a/src/app/layouts/divider/vertical/divider-vertical.component.ts b/src/app/layouts/divider/vertical/divider-vertical.component.ts index 8363a6e5ae..43c0e3ad6e 100644 --- a/src/app/layouts/divider/vertical/divider-vertical.component.ts +++ b/src/app/layouts/divider/vertical/divider-vertical.component.ts @@ -1,12 +1,11 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; -import { IgxDividerDirective } from 'igniteui-angular/directives'; +import { Component } from '@angular/core'; +import { IgxDividerComponent } from 'igniteui-angular/directives'; @Component({ selector: 'app-divider-vertical', styleUrls: ['./divider-vertical.component.scss'], templateUrl: './divider-vertical.component.html', - changeDetection: ChangeDetectionStrategy.Eager, - imports: [IgxDividerDirective] + imports: [IgxDividerComponent] }) export class DividerVerticalComponent { diff --git a/src/app/layouts/dock-manager/dock-manager-sample/dock-manager.component.ts b/src/app/layouts/dock-manager/dock-manager-sample/dock-manager.component.ts index 0baa38be46..30637998f9 100644 --- a/src/app/layouts/dock-manager/dock-manager-sample/dock-manager.component.ts +++ b/src/app/layouts/dock-manager/dock-manager-sample/dock-manager.component.ts @@ -1,4 +1,4 @@ -import { Component, CUSTOM_ELEMENTS_SCHEMA, ChangeDetectionStrategy } from '@angular/core'; +import { Component, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core'; import { IgcDockManagerLayout, IgcDockManagerPaneType, IgcSplitPaneOrientation } from 'igniteui-dockmanager'; @@ -7,7 +7,6 @@ import { IgcDockManagerLayout, selector: 'app-dock-manager', styleUrls: ['./dock-manager.component.scss'], templateUrl: './dock-manager.component.html', - changeDetection: ChangeDetectionStrategy.Eager, schemas: [CUSTOM_ELEMENTS_SCHEMA] }) export class DockManagerComponent { diff --git a/src/app/layouts/expansion-panel/expansion-sample-1/expansion-sample-1.component.ts b/src/app/layouts/expansion-panel/expansion-sample-1/expansion-sample-1.component.ts index bbfdd6b1f5..a5fe89acd4 100644 --- a/src/app/layouts/expansion-panel/expansion-sample-1/expansion-sample-1.component.ts +++ b/src/app/layouts/expansion-panel/expansion-sample-1/expansion-sample-1.component.ts @@ -1,11 +1,10 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { IgxExpansionPanelBodyComponent, IgxExpansionPanelComponent, IgxExpansionPanelDescriptionDirective, IgxExpansionPanelHeaderComponent, IgxExpansionPanelTitleDirective } from 'igniteui-angular/expansion-panel'; @Component({ // tslint:disable-next-line:component-selector selector: 'app-expansion-sample-1', styleUrls: ['./expansion-sample-1.component.scss'], templateUrl: './expansion-sample-1.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxExpansionPanelComponent, IgxExpansionPanelHeaderComponent, IgxExpansionPanelTitleDirective, IgxExpansionPanelDescriptionDirective, IgxExpansionPanelBodyComponent] }) export class ExpansionPanelSample1Component { diff --git a/src/app/layouts/expansion-panel/expansion-sample-2/expansion-sample-2.component.ts b/src/app/layouts/expansion-panel/expansion-sample-2/expansion-sample-2.component.ts index 3e208e6b98..56b9a42838 100644 --- a/src/app/layouts/expansion-panel/expansion-sample-2/expansion-sample-2.component.ts +++ b/src/app/layouts/expansion-panel/expansion-sample-2/expansion-sample-2.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { IgxExpansionPanelBodyComponent, IgxExpansionPanelComponent, IgxExpansionPanelDescriptionDirective, IgxExpansionPanelHeaderComponent, IgxExpansionPanelTitleDirective } from 'igniteui-angular/expansion-panel'; import { IgxToastComponent } from 'igniteui-angular/toast'; @@ -7,7 +7,6 @@ import { IgxToastComponent } from 'igniteui-angular/toast'; selector: 'app-expansion-sample-2', styleUrls: ['./expansion-sample-2.component.scss'], templateUrl: './expansion-sample-2.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxExpansionPanelComponent, IgxExpansionPanelHeaderComponent, IgxExpansionPanelTitleDirective, IgxExpansionPanelDescriptionDirective, IgxExpansionPanelBodyComponent, IgxToastComponent] }) export class ExpansionPanelSample2Component { diff --git a/src/app/layouts/expansion-panel/expansion-sample-3/expansion-sample-3.component.ts b/src/app/layouts/expansion-panel/expansion-sample-3/expansion-sample-3.component.ts index c991c59854..c870e53d7c 100644 --- a/src/app/layouts/expansion-panel/expansion-sample-3/expansion-sample-3.component.ts +++ b/src/app/layouts/expansion-panel/expansion-sample-3/expansion-sample-3.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { IgxExpansionPanelBodyComponent, IgxExpansionPanelComponent, IgxExpansionPanelDescriptionDirective, IgxExpansionPanelHeaderComponent, IgxExpansionPanelIconDirective, IgxExpansionPanelTitleDirective } from 'igniteui-angular/expansion-panel'; import { IgxButtonDirective } from 'igniteui-angular/directives'; @@ -8,7 +8,6 @@ import { IgxButtonDirective } from 'igniteui-angular/directives'; selector: 'app-expansion-sample-3', styleUrls: ['./expansion-sample-3.component.scss'], templateUrl: './expansion-sample-3.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxExpansionPanelComponent, IgxExpansionPanelHeaderComponent, IgxExpansionPanelTitleDirective, IgxExpansionPanelDescriptionDirective, IgxExpansionPanelIconDirective, IgxExpansionPanelBodyComponent, IgxButtonDirective] }) diff --git a/src/app/layouts/expansion-panel/expansion-sample-4/expansion-sample-4.component.html b/src/app/layouts/expansion-panel/expansion-sample-4/expansion-sample-4.component.html index 7968815460..6122e0ccfd 100644 --- a/src/app/layouts/expansion-panel/expansion-sample-4/expansion-sample-4.component.html +++ b/src/app/layouts/expansion-panel/expansion-sample-4/expansion-sample-4.component.html @@ -1,7 +1,7 @@
- HTML5 + HTML5 HTML5 is a software solution stack that defines the properties and behaviors of web page content by implementing a markup-based pattern to it. @@ -9,7 +9,7 @@ - CSS3 + CSS3 Cascading Style Sheets (CSS) is a style sheet language used for describing the presentation of a document written in a markup language like HTML @@ -17,7 +17,7 @@ - SASS/SCSS + SASS/SCSS Sass is a preprocessor scripting language that is interpreted or compiled into Cascading Style Sheets (CSS). diff --git a/src/app/layouts/expansion-panel/expansion-sample-4/expansion-sample-4.component.ts b/src/app/layouts/expansion-panel/expansion-sample-4/expansion-sample-4.component.ts index 832ad4d808..67fdaaf179 100644 --- a/src/app/layouts/expansion-panel/expansion-sample-4/expansion-sample-4.component.ts +++ b/src/app/layouts/expansion-panel/expansion-sample-4/expansion-sample-4.component.ts @@ -1,11 +1,10 @@ -import { Component, QueryList, ViewChildren, ChangeDetectionStrategy } from '@angular/core'; +import { Component, QueryList, ViewChildren } from '@angular/core'; import { IExpansionPanelEventArgs, IgxExpansionPanelBodyComponent, IgxExpansionPanelComponent, IgxExpansionPanelHeaderComponent, IgxExpansionPanelTitleDirective } from 'igniteui-angular/expansion-panel'; @Component({ // tslint:disable-next-line:component-selector selector: 'app-expansion-sample-4', styleUrls: ['./expansion-sample-4.component.scss'], templateUrl: './expansion-sample-4.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxExpansionPanelComponent, IgxExpansionPanelHeaderComponent, IgxExpansionPanelTitleDirective, IgxExpansionPanelBodyComponent] }) export class ExpansionPanelSample4Component { diff --git a/src/app/layouts/expansion-panel/expansion-sample-5/expansion-sample-5.component.html b/src/app/layouts/expansion-panel/expansion-sample-5/expansion-sample-5.component.html index 5794744048..7f3fd4c3f7 100644 --- a/src/app/layouts/expansion-panel/expansion-sample-5/expansion-sample-5.component.html +++ b/src/app/layouts/expansion-panel/expansion-sample-5/expansion-sample-5.component.html @@ -1,7 +1,7 @@
- Angular + Angular Angular (commonly referred to as "Angular 2+" or "Angular v2 and above") is a TypeScript-based open-source web application framework led by the Angular Team at Google and by a community of individuals and corporations. diff --git a/src/app/layouts/expansion-panel/expansion-sample-5/expansion-sample-5.component.ts b/src/app/layouts/expansion-panel/expansion-sample-5/expansion-sample-5.component.ts index 772e10627b..8d1109b378 100644 --- a/src/app/layouts/expansion-panel/expansion-sample-5/expansion-sample-5.component.ts +++ b/src/app/layouts/expansion-panel/expansion-sample-5/expansion-sample-5.component.ts @@ -1,5 +1,5 @@ import { useAnimation } from '@angular/animations'; -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { IgxExpansionPanelBodyComponent, IgxExpansionPanelComponent, IgxExpansionPanelHeaderComponent, IgxExpansionPanelTitleDirective } from 'igniteui-angular/expansion-panel'; import { slideInLeft, slideOutRight } from 'igniteui-angular/animations'; @@ -9,7 +9,6 @@ import { slideInLeft, slideOutRight } from 'igniteui-angular/animations'; selector: 'app-expansion-sample-5', styleUrls: ['./expansion-sample-5.component.scss'], templateUrl: './expansion-sample-5.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxExpansionPanelComponent, IgxExpansionPanelHeaderComponent, IgxExpansionPanelTitleDirective, IgxExpansionPanelBodyComponent] }) export class ExpansionPanelSample5Component { diff --git a/src/app/layouts/expansion-panel/expansion-styling/expansion-styling.component.ts b/src/app/layouts/expansion-panel/expansion-styling/expansion-styling.component.ts index 255413be81..8a3d968cd4 100644 --- a/src/app/layouts/expansion-panel/expansion-styling/expansion-styling.component.ts +++ b/src/app/layouts/expansion-panel/expansion-styling/expansion-styling.component.ts @@ -1,4 +1,4 @@ -import {Component, ChangeDetectionStrategy} from '@angular/core'; +import {Component} from '@angular/core'; import { IgxExpansionPanelBodyComponent, IgxExpansionPanelComponent, IgxExpansionPanelDescriptionDirective, IgxExpansionPanelHeaderComponent, IgxExpansionPanelTitleDirective } from 'igniteui-angular/expansion-panel'; import { IgxButtonDirective } from 'igniteui-angular/directives'; @@ -7,7 +7,6 @@ import { IgxButtonDirective } from 'igniteui-angular/directives'; selector: 'app-expansion-styling', styleUrls: ['./expansion-styling.component.scss'], templateUrl: './expansion-styling.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxExpansionPanelComponent, IgxExpansionPanelHeaderComponent, IgxExpansionPanelTitleDirective, IgxExpansionPanelDescriptionDirective, IgxExpansionPanelBodyComponent, IgxButtonDirective] }) diff --git a/src/app/layouts/expansion-panel/expansion-tailwind-styling/expansion-tailwind-styling.component.ts b/src/app/layouts/expansion-panel/expansion-tailwind-styling/expansion-tailwind-styling.component.ts index dde089c631..f2c42922c2 100644 --- a/src/app/layouts/expansion-panel/expansion-tailwind-styling/expansion-tailwind-styling.component.ts +++ b/src/app/layouts/expansion-panel/expansion-tailwind-styling/expansion-tailwind-styling.component.ts @@ -1,4 +1,4 @@ -import {Component, ChangeDetectionStrategy} from '@angular/core'; +import {Component} from '@angular/core'; import { IgxExpansionPanelBodyComponent, IgxExpansionPanelComponent, IgxExpansionPanelDescriptionDirective, IgxExpansionPanelHeaderComponent, IgxExpansionPanelTitleDirective } from 'igniteui-angular/expansion-panel'; import { IgxButtonDirective } from 'igniteui-angular/directives'; @@ -7,7 +7,6 @@ import { IgxButtonDirective } from 'igniteui-angular/directives'; selector: 'app-expansion-tailwind-styling', styleUrls: ['./expansion-tailwind-styling.component.scss'], templateUrl: './expansion-tailwind-styling.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxExpansionPanelComponent, IgxExpansionPanelHeaderComponent, IgxExpansionPanelTitleDirective, IgxExpansionPanelDescriptionDirective, IgxExpansionPanelBodyComponent, IgxButtonDirective] }) diff --git a/src/app/layouts/layout/layout-align-items/layout-align-items.component.ts b/src/app/layouts/layout/layout-align-items/layout-align-items.component.ts index 8af943c85e..516c91689f 100644 --- a/src/app/layouts/layout/layout-align-items/layout-align-items.component.ts +++ b/src/app/layouts/layout/layout-align-items/layout-align-items.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewEncapsulation, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewEncapsulation } from '@angular/core'; import { ButtonGroupAlignment, IgxButtonGroupComponent } from 'igniteui-angular/button-group'; import { IgxButtonDirective, IgxFlexDirective, IgxLayoutDirective, IgxRippleDirective } from 'igniteui-angular/directives'; @@ -8,7 +8,6 @@ import { IgxButtonDirective, IgxFlexDirective, IgxLayoutDirective, IgxRippleDire selector: 'app-layout-align-items', styleUrls: ['./layout-align-items.component.scss'], templateUrl: './layout-align-items.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonGroupComponent, IgxButtonDirective, IgxRippleDirective, IgxLayoutDirective, IgxFlexDirective] }) diff --git a/src/app/layouts/layout/layout-content-space/layout-content-space.component.ts b/src/app/layouts/layout/layout-content-space/layout-content-space.component.ts index fcb7398ccd..7fecdc6751 100644 --- a/src/app/layouts/layout/layout-content-space/layout-content-space.component.ts +++ b/src/app/layouts/layout/layout-content-space/layout-content-space.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewEncapsulation, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewEncapsulation } from '@angular/core'; import { ButtonGroupAlignment, IgxButtonGroupComponent } from 'igniteui-angular/button-group'; import { IgxButtonDirective, IgxLayoutDirective, IgxRippleDirective } from 'igniteui-angular/directives'; @@ -8,7 +8,6 @@ import { IgxButtonDirective, IgxLayoutDirective, IgxRippleDirective } from 'igni selector: 'app-layout-content-space', styleUrls: ['./layout-content-space.component.scss'], templateUrl: './layout-content-space.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonGroupComponent, IgxButtonDirective, IgxRippleDirective, IgxLayoutDirective] }) diff --git a/src/app/layouts/layout/layout-custom-order/layout-custom-order.component.ts b/src/app/layouts/layout/layout-custom-order/layout-custom-order.component.ts index 05f85b937f..a6cfe649b8 100644 --- a/src/app/layouts/layout/layout-custom-order/layout-custom-order.component.ts +++ b/src/app/layouts/layout/layout-custom-order/layout-custom-order.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewEncapsulation, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewEncapsulation } from '@angular/core'; import { ButtonGroupAlignment } from 'igniteui-angular/button-group'; import { IgxFlexDirective, IgxLayoutDirective } from 'igniteui-angular/directives'; @@ -7,7 +7,6 @@ import { IgxFlexDirective, IgxLayoutDirective } from 'igniteui-angular/directive selector: 'app-layout-custom-order', styleUrls: ['./layout-custom-order.component.scss'], templateUrl: './layout-custom-order.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxLayoutDirective, IgxFlexDirective] }) diff --git a/src/app/layouts/layout/layout-direction-column/layout-direction-column.component.ts b/src/app/layouts/layout/layout-direction-column/layout-direction-column.component.ts index 9bdbf20e43..53560f34b7 100644 --- a/src/app/layouts/layout/layout-direction-column/layout-direction-column.component.ts +++ b/src/app/layouts/layout/layout-direction-column/layout-direction-column.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewEncapsulation, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewEncapsulation } from '@angular/core'; import { ButtonGroupAlignment, IgxButtonGroupComponent } from 'igniteui-angular/button-group'; import { IgxButtonDirective, IgxFlexDirective, IgxLayoutDirective, IgxRippleDirective } from 'igniteui-angular/directives'; @@ -8,7 +8,6 @@ import { IgxButtonDirective, IgxFlexDirective, IgxLayoutDirective, IgxRippleDire selector: 'app-layout-direction-column', styleUrls: ['./layout-direction-column.component.scss'], templateUrl: './layout-direction-column.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonGroupComponent, IgxButtonDirective, IgxRippleDirective, IgxLayoutDirective, IgxFlexDirective] }) diff --git a/src/app/layouts/layout/layout-direction-row/layout-direction-row.component.ts b/src/app/layouts/layout/layout-direction-row/layout-direction-row.component.ts index b26cca04b8..3342c50d6e 100644 --- a/src/app/layouts/layout/layout-direction-row/layout-direction-row.component.ts +++ b/src/app/layouts/layout/layout-direction-row/layout-direction-row.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewEncapsulation, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewEncapsulation } from '@angular/core'; import { ButtonGroupAlignment, IgxButtonGroupComponent } from 'igniteui-angular/button-group'; import { IgxButtonDirective, IgxFlexDirective, IgxLayoutDirective, IgxRippleDirective } from 'igniteui-angular/directives'; @@ -8,7 +8,6 @@ import { IgxButtonDirective, IgxFlexDirective, IgxLayoutDirective, IgxRippleDire selector: 'app-layout-direction-row', styleUrls: ['./layout-direction-row.component.scss'], templateUrl: './layout-direction-row.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonGroupComponent, IgxButtonDirective, IgxRippleDirective, IgxLayoutDirective, IgxFlexDirective] }) diff --git a/src/app/layouts/layout/layout-justify-content/layout-justify-content.component.ts b/src/app/layouts/layout/layout-justify-content/layout-justify-content.component.ts index 89a67616b7..d3deaa6cfe 100644 --- a/src/app/layouts/layout/layout-justify-content/layout-justify-content.component.ts +++ b/src/app/layouts/layout/layout-justify-content/layout-justify-content.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewEncapsulation, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewEncapsulation } from '@angular/core'; import { ButtonGroupAlignment, IgxButtonGroupComponent } from 'igniteui-angular/button-group'; import { IgxButtonDirective, IgxLayoutDirective, IgxRippleDirective } from 'igniteui-angular/directives'; @@ -8,7 +8,6 @@ import { IgxButtonDirective, IgxLayoutDirective, IgxRippleDirective } from 'igni selector: 'app-layout-justify-content', styleUrls: ['./layout-justify-content.component.scss'], templateUrl: './layout-justify-content.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonGroupComponent, IgxButtonDirective, IgxRippleDirective, IgxLayoutDirective] }) diff --git a/src/app/layouts/layout/layout-sample/layout-sample.component.ts b/src/app/layouts/layout/layout-sample/layout-sample.component.ts index 1228ccbf09..144b70c22a 100644 --- a/src/app/layouts/layout/layout-sample/layout-sample.component.ts +++ b/src/app/layouts/layout/layout-sample/layout-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewEncapsulation, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewEncapsulation } from '@angular/core'; import { IgxFlexDirective, IgxLayoutDirective } from 'igniteui-angular/directives'; @Component({ @@ -6,7 +6,6 @@ import { IgxFlexDirective, IgxLayoutDirective } from 'igniteui-angular/directive selector: 'app-layout-sample', styleUrls: ['./layout-sample.component.scss'], templateUrl: './layout-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxLayoutDirective, IgxFlexDirective] }) diff --git a/src/app/layouts/layout/layout-wrap/layout-wrap.component.ts b/src/app/layouts/layout/layout-wrap/layout-wrap.component.ts index 648d979042..11145cf947 100644 --- a/src/app/layouts/layout/layout-wrap/layout-wrap.component.ts +++ b/src/app/layouts/layout/layout-wrap/layout-wrap.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewEncapsulation, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewEncapsulation } from '@angular/core'; import { IgxFlexDirective, IgxLayoutDirective } from 'igniteui-angular/directives'; @Component({ @@ -6,7 +6,6 @@ import { IgxFlexDirective, IgxLayoutDirective } from 'igniteui-angular/directive selector: 'app-layout-wrap', styleUrls: ['./layout-wrap.component.scss'], templateUrl: './layout-wrap.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxLayoutDirective, IgxFlexDirective] }) diff --git a/src/app/layouts/layouts-routes-data.ts b/src/app/layouts/layouts-routes-data.ts index 984fe9348d..8890bf4c99 100644 --- a/src/app/layouts/layouts-routes-data.ts +++ b/src/app/layouts/layouts-routes-data.ts @@ -5,13 +5,12 @@ export const layoutsRoutesData = { 'accordion-sample-2': { displayName: 'Accordion 2', parentName: 'Accordion' }, 'accordion-sample-3': { displayName: 'Accordion 3', parentName: 'Accordion' }, 'accordion-style': { displayName: 'Accordion Styling', parentName: 'Accordion' }, - 'avatar-sample-1': { displayName: 'Avatar with Initials', parentName: 'Avatar' }, - 'avatar-sample-2': { displayName: 'Avatar with Image', parentName: 'Avatar' }, - 'avatar-sample-4': { displayName: 'Avatar with Icon', parentName: 'Avatar' }, - 'avatar-sample-3': { displayName: 'Multiple avatars', parentName: 'Avatar' }, + 'avatar-overview': { displayName: 'Avatar Overview', parentName: 'Avatar' }, + 'avatar-variants': { displayName: 'Avatar Variants', parentName: 'Avatar' }, + 'avatar-shape': { displayName: 'Avatar Shape', parentName: 'Avatar' }, + 'avatar-size': { displayName: 'Avatar Size', parentName: 'Avatar' }, 'avatar-styling': { displayName: 'Styling avatars', parentName: 'Avatar' }, 'avatar-tailwind-styling': { displayName: 'Styling Avatar with Tailwind', parentName: 'Avatar' }, - 'avatar-css-variables': { displayName: 'Avatar with CSS variables', parentName: 'Avatar' }, 'carousel': { displayName: 'Carousel Base', parentName: 'Carousel' }, 'carousel-no-navigation-sample': { displayName: 'Carousel No Navigation', parentName: 'Carousel' }, 'carousel-animations-sample': { displayName: 'Carousel Animations', parentName: 'Carousel' }, diff --git a/src/app/layouts/layouts.routes.ts b/src/app/layouts/layouts.routes.ts index a8f23171c7..7385391ce8 100644 --- a/src/app/layouts/layouts.routes.ts +++ b/src/app/layouts/layouts.routes.ts @@ -1,12 +1,11 @@ // tslint:disable:no-string-literal import { Routes } from '@angular/router'; -import { AvatarSample1Component } from './avatar/avatar-sample-1/avatar-sample-1.component'; -import { AvatarSample2Component } from './avatar/avatar-sample-2/avatar-sample-2.component'; -import { AvatarSample3Component } from './avatar/avatar-sample-3/avatar-sample-3.component'; -import { AvatarSample4Component } from './avatar/avatar-sample-4/avatar-sample-4.component'; +import { AvatarOverviewComponent } from './avatar/avatar-overview/avatar-overview.component'; +import { AvatarVariantsComponent } from './avatar/avatar-variants/avatar-variants.component'; +import { AvatarShapeComponent } from './avatar/avatar-shape/avatar-shape.component'; +import { AvatarSizeComponent } from './avatar/avatar-size/avatar-size.component'; import { AvatarStylingSampleComponent } from './avatar/avatar-styling/avatar-styling.component'; import { AvatarTailwindStylingSampleComponent } from './avatar/avatar-tailwind-styling/avatar-tailwind-styling.component'; -import { AvatarCSSVariablesComponent } from './avatar/avatar-css-variables/avatar-css-variables.component'; import { CardSample1Component } from './card/card-sample-1/card-sample-1.component'; import { CardSample2Component } from './card/card-sample-2/card-sample-2.component'; import { CardSample3Component } from './card/card-sample-3/card-sample-3.component'; @@ -113,24 +112,24 @@ export const LayoutsRoutes: Routes = [ path: 'accordion-style' }, { - component: AvatarSample1Component, - data: layoutsRoutesData['avatar-sample-1'], - path: 'avatar-sample-1' + component: AvatarOverviewComponent, + data: layoutsRoutesData['avatar-overview'], + path: 'avatar-overview' }, { - component: AvatarSample2Component, - data: layoutsRoutesData['avatar-sample-2'], - path: 'avatar-sample-2' + component: AvatarVariantsComponent, + data: layoutsRoutesData['avatar-variants'], + path: 'avatar-variants' }, { - component: AvatarSample3Component, - data: layoutsRoutesData['avatar-sample-3'], - path: 'avatar-sample-3' + component: AvatarShapeComponent, + data: layoutsRoutesData['avatar-shape'], + path: 'avatar-shape' }, { - component: AvatarSample4Component, - data: layoutsRoutesData['avatar-sample-4'], - path: 'avatar-sample-4' + component: AvatarSizeComponent, + data: layoutsRoutesData['avatar-size'], + path: 'avatar-size' }, { component: AvatarStylingSampleComponent, @@ -142,11 +141,6 @@ export const LayoutsRoutes: Routes = [ data: layoutsRoutesData['avatar-tailwind-styling'], path: 'avatar-tailwind-styling' }, - { - component: AvatarCSSVariablesComponent, - data: layoutsRoutesData['avatar-css-variables'], - path: 'avatar-css-variables' - }, { component: CarouselNoNavigationSampleComponent, data: layoutsRoutesData['carousel-no-navigation-sample'], diff --git a/src/app/layouts/splitter/splitter-collapsible-sample/splitter-collapsible-sample.component.ts b/src/app/layouts/splitter/splitter-collapsible-sample/splitter-collapsible-sample.component.ts index bfce400981..50aadc38bb 100644 --- a/src/app/layouts/splitter/splitter-collapsible-sample/splitter-collapsible-sample.component.ts +++ b/src/app/layouts/splitter/splitter-collapsible-sample/splitter-collapsible-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { IgxSplitterComponent, IgxSplitterPaneComponent } from 'igniteui-angular/splitter'; import { IgxButtonDirective } from 'igniteui-angular/directives'; @@ -6,7 +6,6 @@ import { IgxButtonDirective } from 'igniteui-angular/directives'; selector: 'app-splitter-collapsible-sample', styleUrls: ['splitter-collapsible-sample.component.scss'], templateUrl: 'splitter-collapsible-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSplitterComponent, IgxSplitterPaneComponent, IgxButtonDirective] }) export class SplitterCollapsibleSampleComponent { diff --git a/src/app/layouts/splitter/splitter-horizontal-sample/splitter-horizontal-sample.component.ts b/src/app/layouts/splitter/splitter-horizontal-sample/splitter-horizontal-sample.component.ts index 2eb7089078..4931d38076 100644 --- a/src/app/layouts/splitter/splitter-horizontal-sample/splitter-horizontal-sample.component.ts +++ b/src/app/layouts/splitter/splitter-horizontal-sample/splitter-horizontal-sample.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxSplitterComponent, IgxSplitterPaneComponent, SplitterType } from 'igniteui-angular/splitter'; @Component({ selector: 'app-splitter-horizontal-sample', styleUrls: ['splitter-horizontal-sample.component.scss'], templateUrl: 'splitter-horizontal-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSplitterComponent, IgxSplitterPaneComponent] }) export class SplitterHorizontalSampleComponent { diff --git a/src/app/layouts/splitter/splitter-nested-sample/splitter-nested-sample.component.ts b/src/app/layouts/splitter/splitter-nested-sample/splitter-nested-sample.component.ts index ce1d06288d..06c6b01f05 100644 --- a/src/app/layouts/splitter/splitter-nested-sample/splitter-nested-sample.component.ts +++ b/src/app/layouts/splitter/splitter-nested-sample/splitter-nested-sample.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxSplitterComponent, IgxSplitterPaneComponent, SplitterType } from 'igniteui-angular/splitter'; @Component({ selector: 'app-splitter-nested-sample', styleUrls: ['splitter-nested-sample.component.scss'], templateUrl: 'splitter-nested-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSplitterComponent, IgxSplitterPaneComponent] }) export class SplitterNestedSampleComponent { diff --git a/src/app/layouts/splitter/splitter-styling-sample/splitter-styling-sample.component.ts b/src/app/layouts/splitter/splitter-styling-sample/splitter-styling-sample.component.ts index fbff903259..2dca887ee3 100644 --- a/src/app/layouts/splitter/splitter-styling-sample/splitter-styling-sample.component.ts +++ b/src/app/layouts/splitter/splitter-styling-sample/splitter-styling-sample.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxSplitterComponent, IgxSplitterPaneComponent, SplitterType } from 'igniteui-angular/splitter'; @Component({ selector: 'app-splitter-styling-sample', styleUrls: ['splitter-styling-sample.component.scss'], templateUrl: 'splitter-styling-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSplitterComponent, IgxSplitterPaneComponent] }) export class SplitterStylingSampleComponent { diff --git a/src/app/layouts/splitter/splitter-tailwind-styling-sample/splitter-tailwind-styling-sample.component.ts b/src/app/layouts/splitter/splitter-tailwind-styling-sample/splitter-tailwind-styling-sample.component.ts index e7e315ce36..079dfdcaa9 100644 --- a/src/app/layouts/splitter/splitter-tailwind-styling-sample/splitter-tailwind-styling-sample.component.ts +++ b/src/app/layouts/splitter/splitter-tailwind-styling-sample/splitter-tailwind-styling-sample.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxSplitterComponent, IgxSplitterPaneComponent, SplitterType } from 'igniteui-angular/splitter'; @Component({ selector: 'app-splitter-tailwind-styling-sample', styleUrls: ['splitter-tailwind-styling-sample.component.scss'], templateUrl: 'splitter-tailwind-styling-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSplitterComponent, IgxSplitterPaneComponent] }) export class SplitterTailwindStylingSampleComponent { diff --git a/src/app/layouts/stepper/stepper-label-position-and-orientation-sample/stepper-label-position-and-orientation-sample.component.ts b/src/app/layouts/stepper/stepper-label-position-and-orientation-sample/stepper-label-position-and-orientation-sample.component.ts index 0268d73bed..f3f47d2a48 100644 --- a/src/app/layouts/stepper/stepper-label-position-and-orientation-sample/stepper-label-position-and-orientation-sample.component.ts +++ b/src/app/layouts/stepper/stepper-label-position-and-orientation-sample/stepper-label-position-and-orientation-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IButtonGroupEventArgs, IgxButtonGroupComponent } from 'igniteui-angular/button-group'; import { IgxStepComponent, IgxStepContentDirective, IgxStepTitleDirective, IgxStepperComponent, IgxStepperOrientation, IgxStepperTitlePosition } from 'igniteui-angular/stepper'; import { IgxButtonDirective } from 'igniteui-angular/directives'; @@ -7,7 +7,6 @@ import { IgxButtonDirective } from 'igniteui-angular/directives'; selector: 'app-stepper-label-position-and-orientation-sample', styleUrls: ['./stepper-label-position-and-orientation-sample.component.scss'], templateUrl: './stepper-label-position-and-orientation-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonGroupComponent, IgxStepperComponent, IgxStepComponent, IgxStepTitleDirective, IgxStepContentDirective, IgxButtonDirective] }) export class StepperLabelPositionAndOrientationSampleComponent { diff --git a/src/app/layouts/stepper/stepper-linear-sample/stepper-linear-sample.component.ts b/src/app/layouts/stepper/stepper-linear-sample/stepper-linear-sample.component.ts index 5704a13154..2336cc4042 100644 --- a/src/app/layouts/stepper/stepper-linear-sample/stepper-linear-sample.component.ts +++ b/src/app/layouts/stepper/stepper-linear-sample/stepper-linear-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IButtonGroupEventArgs, IgxButtonGroupComponent } from 'igniteui-angular/button-group'; import { IgxStepActiveIndicatorDirective, IgxStepComponent, IgxStepContentDirective, IgxStepSubtitleDirective, IgxStepTitleDirective, IgxStepperComponent } from 'igniteui-angular/stepper'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -12,7 +12,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-stepper-linear-sample', styleUrls: ['./stepper-linear-sample.component.scss'], templateUrl: './stepper-linear-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonGroupComponent, IgxStepperComponent, IgxStepActiveIndicatorDirective, IgxIconComponent, IgxStepComponent, IgxStepTitleDirective, IgxStepContentDirective, FormsModule, IgxInputGroupComponent, IgxInputDirective, IgxLabelDirective, IgxButtonDirective, IgxStepSubtitleDirective, IgxRadioGroupDirective, IgxRadioComponent] }) export class StepperLinearSampleComponent { diff --git a/src/app/layouts/stepper/stepper-overview-sample/stepper-overview-sample.component.scss b/src/app/layouts/stepper/stepper-overview-sample/stepper-overview-sample.component.scss index 355981ca49..e9cf6ab8e1 100644 --- a/src/app/layouts/stepper/stepper-overview-sample/stepper-overview-sample.component.scss +++ b/src/app/layouts/stepper/stepper-overview-sample/stepper-overview-sample.component.scss @@ -45,7 +45,7 @@ $my-card: card-theme( $content-text-color: color($default-palette, 'gray', 900), ); -@include card($my-card); +@include tokens($my-card); .selected-card { border: 2px solid color($default-palette, 'primary', 400); diff --git a/src/app/layouts/stepper/stepper-overview-sample/stepper-overview-sample.component.ts b/src/app/layouts/stepper/stepper-overview-sample/stepper-overview-sample.component.ts index d6d2245ee5..2cf5594890 100644 --- a/src/app/layouts/stepper/stepper-overview-sample/stepper-overview-sample.component.ts +++ b/src/app/layouts/stepper/stepper-overview-sample/stepper-overview-sample.component.ts @@ -1,4 +1,4 @@ -import { ChangeDetectorRef, Component, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { ChangeDetectorRef, Component, ViewChild, inject } from '@angular/core'; import { NgForm, FormsModule } from '@angular/forms'; import { IgxStepComponent, IgxStepContentDirective, IgxStepTitleDirective, IgxStepperComponent } from 'igniteui-angular/stepper'; import { IgxCardComponent, IgxCardContentDirective, IgxCardMediaDirective } from 'igniteui-angular/card'; @@ -15,7 +15,6 @@ import { NgClass, DatePipe } from '@angular/common'; selector: 'app-stepper-overview-sample', styleUrls: ['./stepper-overview-sample.component.scss'], templateUrl: './stepper-overview-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxStepperComponent, IgxStepComponent, IgxStepTitleDirective, IgxStepContentDirective, IgxBadgeComponent, IgxCardComponent, NgClass, IgxCardMediaDirective, IgxCardContentDirective, FormsModule, IgxInputGroupComponent, IgxInputDirective, IgxLabelDirective, IgxSelectComponent, IgxSelectItemComponent, IgxMaskDirective, IgxCheckboxComponent, IgxHintDirective, IgxRadioGroupDirective, IgxRadioComponent, IgxButtonDirective, IgxIconComponent, DatePipe] }) export class StepperOverviewSampleComponent { diff --git a/src/app/layouts/stepper/stepper-sample-reactive-forms/stepper-sample-reactive-forms.component.scss b/src/app/layouts/stepper/stepper-sample-reactive-forms/stepper-sample-reactive-forms.component.scss index 355981ca49..e9cf6ab8e1 100644 --- a/src/app/layouts/stepper/stepper-sample-reactive-forms/stepper-sample-reactive-forms.component.scss +++ b/src/app/layouts/stepper/stepper-sample-reactive-forms/stepper-sample-reactive-forms.component.scss @@ -45,7 +45,7 @@ $my-card: card-theme( $content-text-color: color($default-palette, 'gray', 900), ); -@include card($my-card); +@include tokens($my-card); .selected-card { border: 2px solid color($default-palette, 'primary', 400); diff --git a/src/app/layouts/stepper/stepper-sample-reactive-forms/stepper-sample-reactive-forms.component.ts b/src/app/layouts/stepper/stepper-sample-reactive-forms/stepper-sample-reactive-forms.component.ts index 40fb4c2fa9..f2e5d7ccd1 100644 --- a/src/app/layouts/stepper/stepper-sample-reactive-forms/stepper-sample-reactive-forms.component.ts +++ b/src/app/layouts/stepper/stepper-sample-reactive-forms/stepper-sample-reactive-forms.component.ts @@ -1,4 +1,4 @@ -import { ChangeDetectorRef, Component, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { ChangeDetectorRef, Component, ViewChild, inject } from '@angular/core'; import { FormControl, FormGroup, Validators, FormsModule, ReactiveFormsModule } from '@angular/forms'; import { IgxStepComponent, IgxStepContentDirective, IgxStepTitleDirective, IgxStepperComponent } from 'igniteui-angular/stepper'; import { IgxCardComponent, IgxCardContentDirective, IgxCardMediaDirective } from 'igniteui-angular/card'; @@ -45,7 +45,6 @@ export interface ShippingDetails{ selector: 'app-stepper-sample-reactive-forms', styleUrls: ['./stepper-sample-reactive-forms.component.scss'], templateUrl: './stepper-sample-reactive-forms.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxStepperComponent, IgxStepComponent, IgxStepTitleDirective, IgxStepContentDirective, IgxBadgeComponent, IgxCardComponent, NgClass, IgxCardMediaDirective, IgxCardContentDirective, FormsModule, ReactiveFormsModule, IgxInputGroupComponent, IgxInputDirective, IgxLabelDirective, IgxSelectComponent, IgxSelectItemComponent, IgxMaskDirective, IgxCheckboxComponent, IgxHintDirective, IgxRadioGroupDirective, IgxRadioComponent, IgxButtonDirective, IgxIconComponent, DatePipe] }) export class StepperSampleReactiveFormsComponent { diff --git a/src/app/layouts/stepper/stepper-steptypes-sample/stepper-steptypes-sample.component.ts b/src/app/layouts/stepper/stepper-steptypes-sample/stepper-steptypes-sample.component.ts index 957a7cf03b..bd75db42cc 100644 --- a/src/app/layouts/stepper/stepper-steptypes-sample/stepper-steptypes-sample.component.ts +++ b/src/app/layouts/stepper/stepper-steptypes-sample/stepper-steptypes-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IButtonGroupEventArgs, IgxButtonGroupComponent } from 'igniteui-angular/button-group'; import { IgxStepComponent, IgxStepTitleDirective, IgxStepType, IgxStepperComponent } from 'igniteui-angular/stepper'; @@ -6,7 +6,6 @@ import { IgxStepComponent, IgxStepTitleDirective, IgxStepType, IgxStepperCompone selector: 'app-stepper-steptypes-sample', styleUrls: ['./stepper-steptypes-sample.component.scss'], templateUrl: './stepper-steptypes-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonGroupComponent, IgxStepperComponent, IgxStepComponent, IgxStepTitleDirective] }) export class StepperStepTypesSampleComponent { diff --git a/src/app/layouts/stepper/stepper-styling-sample/stepper-styling-sample.component.ts b/src/app/layouts/stepper/stepper-styling-sample/stepper-styling-sample.component.ts index 22522ea11a..f3a3981429 100644 --- a/src/app/layouts/stepper/stepper-styling-sample/stepper-styling-sample.component.ts +++ b/src/app/layouts/stepper/stepper-styling-sample/stepper-styling-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { IStepChangingEventArgs, IgxStepActiveIndicatorDirective, IgxStepCompletedIndicatorDirective, IgxStepComponent, IgxStepContentDirective, IgxStepSubtitleDirective, IgxStepTitleDirective, IgxStepperComponent } from 'igniteui-angular/stepper'; import { IgxIconComponent } from 'igniteui-angular/icon'; import { IgxButtonDirective } from 'igniteui-angular/directives'; @@ -7,7 +7,6 @@ import { IgxButtonDirective } from 'igniteui-angular/directives'; selector: 'app-stepper-styling-sample', styleUrls: ['./stepper-styling-sample.component.scss'], templateUrl: './stepper-styling-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxStepperComponent, IgxStepActiveIndicatorDirective, IgxIconComponent, IgxStepCompletedIndicatorDirective, IgxStepComponent, IgxStepTitleDirective, IgxStepSubtitleDirective, IgxStepContentDirective, IgxButtonDirective] }) export class StepperStylingSampleComponent { diff --git a/src/app/layouts/stepper/stepper-tailwind-styling-sample/stepper-tailwind-styling-sample.component.ts b/src/app/layouts/stepper/stepper-tailwind-styling-sample/stepper-tailwind-styling-sample.component.ts index 74884efa21..adbe5489e7 100644 --- a/src/app/layouts/stepper/stepper-tailwind-styling-sample/stepper-tailwind-styling-sample.component.ts +++ b/src/app/layouts/stepper/stepper-tailwind-styling-sample/stepper-tailwind-styling-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { IStepChangingEventArgs, IgxStepActiveIndicatorDirective, IgxStepCompletedIndicatorDirective, IgxStepComponent, IgxStepContentDirective, IgxStepSubtitleDirective, IgxStepTitleDirective, IgxStepperComponent } from 'igniteui-angular/stepper'; import { IgxIconComponent } from 'igniteui-angular/icon'; import { IgxButtonDirective } from 'igniteui-angular/directives'; @@ -7,7 +7,6 @@ import { IgxButtonDirective } from 'igniteui-angular/directives'; selector: 'app-stepper-tailwind-styling-sample', styleUrls: ['./stepper-tailwind-styling-sample.component.scss'], templateUrl: './stepper-tailwind-styling-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxStepperComponent, IgxStepActiveIndicatorDirective, IgxIconComponent, IgxStepCompletedIndicatorDirective, IgxStepComponent, IgxStepTitleDirective, IgxStepSubtitleDirective, IgxStepContentDirective, IgxButtonDirective] }) export class StepperTailwindStylingSampleComponent { diff --git a/src/app/layouts/tabbar/tabbar-sample-1/tabbar-sample-1.component.ts b/src/app/layouts/tabbar/tabbar-sample-1/tabbar-sample-1.component.ts index 3ae1303c20..04748ddab8 100644 --- a/src/app/layouts/tabbar/tabbar-sample-1/tabbar-sample-1.component.ts +++ b/src/app/layouts/tabbar/tabbar-sample-1/tabbar-sample-1.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxBottomNavComponent, IgxBottomNavContentComponent, IgxBottomNavHeaderComponent, IgxBottomNavItemComponent } from 'igniteui-angular/bottom-nav'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -6,7 +6,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: 'app-tabbar-sample-1', styleUrls: ['./tabbar-sample-1.component.scss'], templateUrl: './tabbar-sample-1.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxBottomNavComponent, IgxBottomNavItemComponent, IgxBottomNavHeaderComponent, IgxIconComponent, IgxBottomNavContentComponent] }) export class TabbarSample1Component { diff --git a/src/app/layouts/tabbar/tabbar-sample-2/tabbar-sample-2.component.ts b/src/app/layouts/tabbar/tabbar-sample-2/tabbar-sample-2.component.ts index 162d8773c7..857c99340d 100644 --- a/src/app/layouts/tabbar/tabbar-sample-2/tabbar-sample-2.component.ts +++ b/src/app/layouts/tabbar/tabbar-sample-2/tabbar-sample-2.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from "@angular/core"; +import { Component } from "@angular/core"; import { IgxBottomNavComponent, IgxBottomNavContentComponent, IgxBottomNavHeaderComponent, IgxBottomNavHeaderIconDirective, IgxBottomNavHeaderLabelDirective, IgxBottomNavItemComponent } from 'igniteui-angular/bottom-nav'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -7,7 +7,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: "app-tabbar-sample-2", styleUrls: ["./tabbar-sample-2.component.scss"], templateUrl: "./tabbar-sample-2.component.html", - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxBottomNavComponent, IgxBottomNavItemComponent, IgxBottomNavHeaderComponent, IgxIconComponent, IgxBottomNavHeaderIconDirective, IgxBottomNavHeaderLabelDirective, IgxBottomNavContentComponent] }) export class TabbarSample2Component { diff --git a/src/app/layouts/tabbar/tabbar-sample-3/components/tabbar-sample-3.component.ts b/src/app/layouts/tabbar/tabbar-sample-3/components/tabbar-sample-3.component.ts index fdcd9d1ccf..38dc79a81d 100644 --- a/src/app/layouts/tabbar/tabbar-sample-3/components/tabbar-sample-3.component.ts +++ b/src/app/layouts/tabbar/tabbar-sample-3/components/tabbar-sample-3.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, inject } from '@angular/core'; import { NavigationEnd, Router, RouterOutlet, RouterLinkActive, RouterLink } from '@angular/router'; import { filter } from 'rxjs/operators'; import { IgxBottomNavComponent, IgxBottomNavHeaderComponent, IgxBottomNavHeaderIconDirective, IgxBottomNavItemComponent } from 'igniteui-angular/bottom-nav'; @@ -8,7 +8,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: 'app-tabbar-sample-3', styleUrls: ['./tabbar-sample-3.component.scss'], templateUrl: './tabbar-sample-3.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [RouterOutlet, IgxBottomNavComponent, IgxBottomNavItemComponent, RouterLinkActive, IgxBottomNavHeaderComponent, RouterLink, IgxIconComponent, IgxBottomNavHeaderIconDirective] }) export class TabbarSample3Component implements OnInit { diff --git a/src/app/layouts/tabbar/tabbar-style/tabbar-style.component.ts b/src/app/layouts/tabbar/tabbar-style/tabbar-style.component.ts index 7241dd0a0b..7512e4bfa8 100644 --- a/src/app/layouts/tabbar/tabbar-style/tabbar-style.component.ts +++ b/src/app/layouts/tabbar/tabbar-style/tabbar-style.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ChangeDetectionStrategy } from "@angular/core"; +import { Component, OnInit } from "@angular/core"; import { IgxBottomNavComponent, IgxBottomNavContentComponent, IgxBottomNavHeaderComponent, IgxBottomNavHeaderIconDirective, IgxBottomNavHeaderLabelDirective, IgxBottomNavItemComponent } from 'igniteui-angular/bottom-nav'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -7,7 +7,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: "app-tabbar-style", styleUrls: ["./tabbar-style.component.scss"], templateUrl: "./tabbar-style.component.html", - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxBottomNavComponent, IgxBottomNavItemComponent, IgxBottomNavHeaderComponent, IgxIconComponent, IgxBottomNavHeaderIconDirective, IgxBottomNavHeaderLabelDirective, IgxBottomNavContentComponent] }) export class TabbarStyleComponent { diff --git a/src/app/layouts/tabbar/tabbar-tailwind-style/tabbar-tailwind-style.component.ts b/src/app/layouts/tabbar/tabbar-tailwind-style/tabbar-tailwind-style.component.ts index c94d69c48f..f7d4b7cad8 100644 --- a/src/app/layouts/tabbar/tabbar-tailwind-style/tabbar-tailwind-style.component.ts +++ b/src/app/layouts/tabbar/tabbar-tailwind-style/tabbar-tailwind-style.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from "@angular/core"; +import { Component } from "@angular/core"; import { IgxBottomNavComponent, IgxBottomNavContentComponent, IgxBottomNavHeaderComponent, IgxBottomNavHeaderIconDirective, IgxBottomNavHeaderLabelDirective, IgxBottomNavItemComponent } from 'igniteui-angular/bottom-nav'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -7,7 +7,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: "app-tabbar-tailwind-style", styleUrls: ["./tabbar-tailwind-style.component.scss"], templateUrl: "./tabbar-tailwind-style.component.html", - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxBottomNavComponent, IgxBottomNavItemComponent, IgxBottomNavHeaderComponent, IgxIconComponent, IgxBottomNavHeaderIconDirective, IgxBottomNavHeaderLabelDirective, IgxBottomNavContentComponent] }) export class TabbarTailwindStyleComponent { diff --git a/src/app/layouts/tabbar/views/view1/view1.component.ts b/src/app/layouts/tabbar/views/view1/view1.component.ts index 33e6dfbe70..f94c38bab1 100644 --- a/src/app/layouts/tabbar/views/view1/view1.component.ts +++ b/src/app/layouts/tabbar/views/view1/view1.component.ts @@ -1,8 +1,7 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; @Component({ selector: 'app-view1', - changeDetection: ChangeDetectionStrategy.Eager, templateUrl: './view1.component.html' }) export class TabbarView1Component { } diff --git a/src/app/layouts/tabbar/views/view2/view2.component.ts b/src/app/layouts/tabbar/views/view2/view2.component.ts index 9138a112b5..353fab685c 100644 --- a/src/app/layouts/tabbar/views/view2/view2.component.ts +++ b/src/app/layouts/tabbar/views/view2/view2.component.ts @@ -1,8 +1,7 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; @Component({ selector: 'app-view2', - changeDetection: ChangeDetectionStrategy.Eager, templateUrl: './view2.component.html' }) export class TabbarView2Component { } diff --git a/src/app/layouts/tabbar/views/view3/view3.component.ts b/src/app/layouts/tabbar/views/view3/view3.component.ts index c103966a82..d22d588015 100644 --- a/src/app/layouts/tabbar/views/view3/view3.component.ts +++ b/src/app/layouts/tabbar/views/view3/view3.component.ts @@ -1,8 +1,7 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; @Component({ selector: 'app-view3', - changeDetection: ChangeDetectionStrategy.Eager, templateUrl: './view3.component.html' }) export class TabbarView3Component { } diff --git a/src/app/layouts/tabs/tabs-alignment/tabs-alignment.component.ts b/src/app/layouts/tabs/tabs-alignment/tabs-alignment.component.ts index ef757d511a..346339e173 100644 --- a/src/app/layouts/tabs/tabs-alignment/tabs-alignment.component.ts +++ b/src/app/layouts/tabs/tabs-alignment/tabs-alignment.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxButtonGroupComponent } from 'igniteui-angular/button-group'; import { IgxTabContentComponent, IgxTabHeaderComponent, IgxTabHeaderLabelDirective, IgxTabItemComponent, IgxTabsComponent } from 'igniteui-angular/tabs'; @Component({ selector: 'app-tabs-alignment', templateUrl: './tabs-alignment.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonGroupComponent, IgxTabsComponent, IgxTabItemComponent, IgxTabHeaderComponent, IgxTabHeaderLabelDirective, IgxTabContentComponent] }) export class TabsAlignmentComponent { diff --git a/src/app/layouts/tabs/tabs-header-prefix-suffix/tabs-header-prefix-suffix.ts b/src/app/layouts/tabs/tabs-header-prefix-suffix/tabs-header-prefix-suffix.ts index 75320d662c..bfff56bd7c 100644 --- a/src/app/layouts/tabs/tabs-header-prefix-suffix/tabs-header-prefix-suffix.ts +++ b/src/app/layouts/tabs/tabs-header-prefix-suffix/tabs-header-prefix-suffix.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxTabContentComponent, IgxTabHeaderComponent, IgxTabItemComponent, IgxTabsComponent } from 'igniteui-angular/tabs'; import { IgxPrefixDirective, IgxSuffixDirective } from 'igniteui-angular/input-group'; import { IgxIconButtonDirective } from 'igniteui-angular/directives'; @@ -8,7 +8,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; @Component({ selector: 'app-tabs-header-prefix-suffix', templateUrl: './tabs-header-prefix-suffix.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTabsComponent, IgxTabItemComponent, IgxTabHeaderComponent, IgxPrefixDirective, IgxIconButtonDirective, IgxSuffixDirective, IgxIconComponent, IgxTabContentComponent] }) export class TabsHeaderPrefixSuffixComponent { diff --git a/src/app/layouts/tabs/tabs-sample-1/tabs-sample-1.component.ts b/src/app/layouts/tabs/tabs-sample-1/tabs-sample-1.component.ts index 00c134d8d6..1b99abb8e3 100644 --- a/src/app/layouts/tabs/tabs-sample-1/tabs-sample-1.component.ts +++ b/src/app/layouts/tabs/tabs-sample-1/tabs-sample-1.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxTabContentComponent, IgxTabHeaderComponent, IgxTabHeaderLabelDirective, IgxTabItemComponent, IgxTabsComponent } from 'igniteui-angular/tabs'; @Component({ selector: 'app-tabs-sample-1', styleUrls: ['./tabs-sample-1.component.scss'], templateUrl: './tabs-sample-1.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTabsComponent, IgxTabItemComponent, IgxTabHeaderComponent, IgxTabHeaderLabelDirective, IgxTabContentComponent] }) export class TabsSample1Component { } diff --git a/src/app/layouts/tabs/tabs-sample-2/tabs-sample-2.component.ts b/src/app/layouts/tabs/tabs-sample-2/tabs-sample-2.component.ts index 6332973cfd..0e27ffe1a7 100644 --- a/src/app/layouts/tabs/tabs-sample-2/tabs-sample-2.component.ts +++ b/src/app/layouts/tabs/tabs-sample-2/tabs-sample-2.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxTabContentComponent, IgxTabHeaderComponent, IgxTabHeaderLabelDirective, IgxTabItemComponent, IgxTabsComponent } from 'igniteui-angular/tabs'; @Component({ selector: 'app-tabs-sample-2', styleUrls: ['./tabs-sample-2.component.scss'], templateUrl: './tabs-sample-2.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTabsComponent, IgxTabItemComponent, IgxTabHeaderComponent, IgxTabHeaderLabelDirective, IgxTabContentComponent] }) export class TabsSample2Component { diff --git a/src/app/layouts/tabs/tabs-sample-3/tabs-sample-3.component.ts b/src/app/layouts/tabs/tabs-sample-3/tabs-sample-3.component.ts index ad60b1a97c..910a1a98bc 100644 --- a/src/app/layouts/tabs/tabs-sample-3/tabs-sample-3.component.ts +++ b/src/app/layouts/tabs/tabs-sample-3/tabs-sample-3.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxTabContentComponent, IgxTabHeaderComponent, IgxTabHeaderIconDirective, IgxTabHeaderLabelDirective, IgxTabItemComponent, IgxTabsComponent } from 'igniteui-angular/tabs'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -6,7 +6,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: 'app-tabs-sample-3', styleUrls: ['./tabs-sample-3.component.scss'], templateUrl: './tabs-sample-3.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTabsComponent, IgxTabItemComponent, IgxTabHeaderComponent, IgxIconComponent, IgxTabHeaderIconDirective, IgxTabHeaderLabelDirective, IgxTabContentComponent] }) export class TabsSample3Component { } diff --git a/src/app/layouts/tabs/tabs-sample-4/components/tabs-sample-4.component.ts b/src/app/layouts/tabs/tabs-sample-4/components/tabs-sample-4.component.ts index 1bf814ab78..78db9b213c 100644 --- a/src/app/layouts/tabs/tabs-sample-4/components/tabs-sample-4.component.ts +++ b/src/app/layouts/tabs/tabs-sample-4/components/tabs-sample-4.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, inject } from '@angular/core'; import { NavigationEnd, Router, RouterLinkActive, RouterLink, RouterOutlet } from '@angular/router'; import { filter } from 'rxjs/operators'; import { IgxTabHeaderComponent, IgxTabHeaderLabelDirective, IgxTabItemComponent, IgxTabsComponent } from 'igniteui-angular/tabs'; @@ -7,7 +7,6 @@ import { IgxTabHeaderComponent, IgxTabHeaderLabelDirective, IgxTabItemComponent, selector: 'app-tabs-sample-4', styleUrls: ['./tabs-sample-4.component.scss'], templateUrl: './tabs-sample-4.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTabsComponent, IgxTabItemComponent, RouterLinkActive, IgxTabHeaderComponent, RouterLink, IgxTabHeaderLabelDirective, RouterOutlet] }) export class TabsSample4Component implements OnInit { diff --git a/src/app/layouts/tabs/tabs-style/tabs-style.component.ts b/src/app/layouts/tabs/tabs-style/tabs-style.component.ts index fd65146975..c0a43419e5 100644 --- a/src/app/layouts/tabs/tabs-style/tabs-style.component.ts +++ b/src/app/layouts/tabs/tabs-style/tabs-style.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxTabContentComponent, IgxTabHeaderComponent, IgxTabHeaderIconDirective, IgxTabHeaderLabelDirective, IgxTabItemComponent, IgxTabsComponent } from 'igniteui-angular/tabs'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -6,7 +6,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: 'app-tabs-style', styleUrls: ['./tabs-style.component.scss'], templateUrl: './tabs-style.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTabsComponent, IgxTabItemComponent, IgxTabHeaderComponent, IgxIconComponent, IgxTabHeaderIconDirective, IgxTabHeaderLabelDirective, IgxTabContentComponent] }) export class TabsStyleComponent { } diff --git a/src/app/layouts/tabs/tabs-tailwind-style/tabs-tailwind-style.component.ts b/src/app/layouts/tabs/tabs-tailwind-style/tabs-tailwind-style.component.ts index 5fe1a7572a..1a1a925db8 100644 --- a/src/app/layouts/tabs/tabs-tailwind-style/tabs-tailwind-style.component.ts +++ b/src/app/layouts/tabs/tabs-tailwind-style/tabs-tailwind-style.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxTabContentComponent, IgxTabHeaderComponent, IgxTabHeaderIconDirective, IgxTabHeaderLabelDirective, IgxTabItemComponent, IgxTabsComponent } from 'igniteui-angular/tabs'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -6,7 +6,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: 'app-tabs-tailwind-style', styleUrls: ['./tabs-tailwind-style.component.scss'], templateUrl: './tabs-tailwind-style.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTabsComponent, IgxTabItemComponent, IgxTabHeaderComponent, IgxIconComponent, IgxTabHeaderIconDirective, IgxTabHeaderLabelDirective, IgxTabContentComponent] }) export class TabsTailwindStyleComponent { } diff --git a/src/app/layouts/tabs/views/view1/view1.component.ts b/src/app/layouts/tabs/views/view1/view1.component.ts index 6dcfcbbedf..b9b28ff9af 100644 --- a/src/app/layouts/tabs/views/view1/view1.component.ts +++ b/src/app/layouts/tabs/views/view1/view1.component.ts @@ -1,8 +1,7 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; @Component({ selector: 'app-view1', - changeDetection: ChangeDetectionStrategy.Eager, templateUrl: './view1.component.html' }) export class View1Component { } diff --git a/src/app/layouts/tabs/views/view2/view2.component.ts b/src/app/layouts/tabs/views/view2/view2.component.ts index 28df4880ce..8dcb038e37 100644 --- a/src/app/layouts/tabs/views/view2/view2.component.ts +++ b/src/app/layouts/tabs/views/view2/view2.component.ts @@ -1,8 +1,7 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; @Component({ selector: 'app-view2', - changeDetection: ChangeDetectionStrategy.Eager, templateUrl: './view2.component.html' }) export class View2Component { } diff --git a/src/app/layouts/tabs/views/view3/view3.component.ts b/src/app/layouts/tabs/views/view3/view3.component.ts index 7331f77fdf..a02c858866 100644 --- a/src/app/layouts/tabs/views/view3/view3.component.ts +++ b/src/app/layouts/tabs/views/view3/view3.component.ts @@ -1,8 +1,7 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; @Component({ selector: 'app-view3', - changeDetection: ChangeDetectionStrategy.Eager, templateUrl: './view3.component.html' }) export class View3Component { } diff --git a/src/app/layouts/tile-manager/tile-manager-sample/tile-manager.component.ts b/src/app/layouts/tile-manager/tile-manager-sample/tile-manager.component.ts index ec37a15aae..5f515fefdb 100644 --- a/src/app/layouts/tile-manager/tile-manager-sample/tile-manager.component.ts +++ b/src/app/layouts/tile-manager/tile-manager-sample/tile-manager.component.ts @@ -1,4 +1,4 @@ -import { Component, CUSTOM_ELEMENTS_SCHEMA, OnInit, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, CUSTOM_ELEMENTS_SCHEMA, OnInit, inject } from '@angular/core'; import { IgxAvatarComponent } from 'igniteui-angular/avatar'; import { IgxCardComponent, IgxCardContentDirective, IgxCardHeaderComponent, IgxCardHeaderTitleDirective, IgxCardThumbnailDirective } from 'igniteui-angular/card'; import { IgxIconComponent, IgxIconService } from 'igniteui-angular/icon'; @@ -12,7 +12,6 @@ defineComponents(IgcTileManagerComponent); styleUrls: ['./tile-manager.component.scss'], templateUrl: './tile-manager.component.html', imports: [IgxCardComponent, IgxCardHeaderComponent, IgxCardHeaderTitleDirective, IgxCardThumbnailDirective, IgxCardContentDirective, IgxListComponent, IgxListItemComponent, IgxListThumbnailDirective, IgxAvatarComponent, IgxIconComponent], - changeDetection: ChangeDetectionStrategy.Eager, schemas: [CUSTOM_ELEMENTS_SCHEMA] }) export class TileManagerComponent implements OnInit { @@ -22,15 +21,15 @@ export class TileManagerComponent implements OnInit { public ngOnInit() { const listIcon = ''; - + const calendarIcon = '' - + const productIcon = '' - + this._iconService.addSvgIconFromText("list", listIcon, "material"); this._iconService.addSvgIconFromText("calendar", calendarIcon, "material"); this._iconService.addSvgIconFromText("product", productIcon, "material"); } -} \ No newline at end of file +} diff --git a/src/app/lists/combo/combo-binding/combo-binding.component.ts b/src/app/lists/combo/combo-binding/combo-binding.component.ts index 7005aae0bc..563ccf1724 100644 --- a/src/app/lists/combo/combo-binding/combo-binding.component.ts +++ b/src/app/lists/combo/combo-binding/combo-binding.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { IgxComboComponent } from 'igniteui-angular/combo'; import { IgxButtonDirective } from 'igniteui-angular/directives'; import { IgxCardComponent, IgxCardHeaderComponent, IgxCardHeaderSubtitleDirective, IgxCardHeaderTitleDirective } from 'igniteui-angular/card'; @@ -10,7 +10,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-combo-binding', templateUrl: 'combo-binding.component.html', styleUrls: ['combo-binding.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxComboComponent, FormsModule, IgxButtonDirective, IgxCardComponent, IgxCardHeaderComponent, IgxCardHeaderTitleDirective, IgxCardHeaderSubtitleDirective] }) export class ComboBindingComponent { diff --git a/src/app/lists/combo/combo-features/combo-features.component.ts b/src/app/lists/combo/combo-features/combo-features.component.ts index 8e8db5ac3d..79bf967fa5 100644 --- a/src/app/lists/combo/combo-features/combo-features.component.ts +++ b/src/app/lists/combo/combo-features/combo-features.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxComboComponent } from 'igniteui-angular/combo'; import { IgxSwitchComponent } from 'igniteui-angular/switch'; import { localData } from './local-data'; @@ -8,7 +8,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-combo', styleUrls: ['./combo-features.component.scss'], templateUrl: './combo-features.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxComboComponent, IgxSwitchComponent, FormsModule] }) export class ComboFeaturesComponent implements OnInit{ diff --git a/src/app/lists/combo/combo-main/combo-main.component.ts b/src/app/lists/combo/combo-main/combo-main.component.ts index 1a93565d44..7ec7619400 100644 --- a/src/app/lists/combo/combo-main/combo-main.component.ts +++ b/src/app/lists/combo/combo-main/combo-main.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit } from '@angular/core'; import { localData } from './local-data'; import { IgxComboComponent } from 'igniteui-angular/combo'; @@ -6,7 +6,6 @@ import { IgxComboComponent } from 'igniteui-angular/combo'; selector: 'app-combo-main', styleUrls: ['./combo-main.component.scss'], templateUrl: './combo-main.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxComboComponent] }) diff --git a/src/app/lists/combo/combo-overlay/combo-overlay.component.ts b/src/app/lists/combo/combo-overlay/combo-overlay.component.ts index 311545317c..ede80c3d91 100644 --- a/src/app/lists/combo/combo-overlay/combo-overlay.component.ts +++ b/src/app/lists/combo/combo-overlay/combo-overlay.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { GlobalPositionStrategy, OverlaySettings } from 'igniteui-angular/core'; import { IgxComboComponent } from 'igniteui-angular/combo'; import { scaleInCenter, scaleOutCenter } from 'igniteui-angular/animations'; @@ -7,7 +7,6 @@ import { scaleInCenter, scaleOutCenter } from 'igniteui-angular/animations'; selector: 'app-combo-overlay', templateUrl: 'combo-overlay.component.html', styleUrls: ['combo-overlay.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxComboComponent] }) export class ComboOverlayComponent { diff --git a/src/app/lists/combo/combo-remote/combo-remote.component.ts b/src/app/lists/combo/combo-remote/combo-remote.component.ts index f1c115c892..994071a9af 100644 --- a/src/app/lists/combo/combo-remote/combo-remote.component.ts +++ b/src/app/lists/combo/combo-remote/combo-remote.component.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, ChangeDetectorRef, Component, OnInit, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { AfterViewInit, ChangeDetectorRef, Component, OnInit, ViewChild, inject } from '@angular/core'; import { IComboSearchInputEventArgs, IComboSelectionChangingEventArgs, IgxComboComponent } from 'igniteui-angular/combo'; import { IForOfState } from 'igniteui-angular/directives'; import { IgxToastComponent } from 'igniteui-angular/toast'; @@ -11,7 +11,6 @@ import { AsyncPipe } from '@angular/common'; selector: 'app-combo-remote', styleUrls: ['./combo-remote.component.scss'], templateUrl: './combo-remote.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxComboComponent, IgxToastComponent, AsyncPipe] }) export class ComboRemoteComponent implements OnInit, AfterViewInit { diff --git a/src/app/lists/combo/combo-styling/combo-styling.component.ts b/src/app/lists/combo/combo-styling/combo-styling.component.ts index 7aab41dd86..63ebea26f0 100644 --- a/src/app/lists/combo/combo-styling/combo-styling.component.ts +++ b/src/app/lists/combo/combo-styling/combo-styling.component.ts @@ -1,4 +1,4 @@ -import { Component, ElementRef, OnInit, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ElementRef, OnInit, ViewChild, inject } from '@angular/core'; import { IComboSelectionChangingEventArgs, IgxComboComponent } from 'igniteui-angular/combo'; import { IgxToastComponent } from 'igniteui-angular/toast'; import { VerticalAlignment } from 'igniteui-angular/core'; @@ -8,7 +8,6 @@ import { getHeroWeaponsData, IHeroWeapon } from '../../../data/heroData'; selector: 'app-combo', styleUrls: ['./combo-styling.component.scss'], templateUrl: './combo-styling.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxComboComponent, IgxToastComponent] }) export class ComboStylingComponent implements OnInit { diff --git a/src/app/lists/combo/combo-tailwind-styling/combo-tailwind-styling.component.ts b/src/app/lists/combo/combo-tailwind-styling/combo-tailwind-styling.component.ts index ad5fcb51d8..0bb9922864 100644 --- a/src/app/lists/combo/combo-tailwind-styling/combo-tailwind-styling.component.ts +++ b/src/app/lists/combo/combo-tailwind-styling/combo-tailwind-styling.component.ts @@ -1,4 +1,4 @@ -import { Component, ElementRef, OnInit, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ElementRef, OnInit, ViewChild, inject } from '@angular/core'; import { IComboSelectionChangingEventArgs, IgxComboComponent } from 'igniteui-angular/combo'; import { IgxToastComponent } from 'igniteui-angular/toast'; import { VerticalAlignment } from 'igniteui-angular/core'; @@ -8,7 +8,6 @@ import { getHeroWeaponsData, IHeroWeapon } from '../../../data/heroData'; selector: 'app-combo-tailwind-styling', styleUrls: ['./combo-tailwind-styling.component.scss'], templateUrl: './combo-tailwind-styling.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxComboComponent, IgxToastComponent] }) export class ComboTailwindStylingComponent implements OnInit { diff --git a/src/app/lists/combo/combo-template/combo-template.component.ts b/src/app/lists/combo/combo-template/combo-template.component.ts index fb6af5b82f..aa9278e971 100644 --- a/src/app/lists/combo/combo-template/combo-template.component.ts +++ b/src/app/lists/combo/combo-template/combo-template.component.ts @@ -1,4 +1,4 @@ -import { ChangeDetectorRef, Component, OnInit, inject, ChangeDetectionStrategy } from '@angular/core'; +import { ChangeDetectorRef, Component, OnInit, inject } from '@angular/core'; import { localData } from './local-data'; import { IgxComboAddItemDirective, IgxComboClearIconDirective, IgxComboComponent, IgxComboEmptyDirective, IgxComboFooterDirective, IgxComboHeaderDirective, IgxComboHeaderItemDirective, IgxComboItemDirective, IgxComboToggleIconDirective } from 'igniteui-angular/combo'; import { IgxLabelDirective, IgxPrefixDirective } from 'igniteui-angular/input-group'; @@ -9,7 +9,6 @@ import { IgxButtonDirective } from 'igniteui-angular/directives'; selector: 'app-combo-template', styleUrls: ['./combo-template.component.scss'], templateUrl: './combo-template.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxComboComponent, IgxLabelDirective, IgxPrefixDirective, IgxIconComponent, IgxComboItemDirective, IgxComboHeaderItemDirective, IgxComboHeaderDirective, IgxComboFooterDirective, IgxComboAddItemDirective, IgxButtonDirective, IgxComboToggleIconDirective, IgxComboClearIconDirective, IgxComboEmptyDirective] }) export class ComboTemplateComponent implements OnInit { diff --git a/src/app/lists/combo/combo-valuekey/combo-valuekey.component.ts b/src/app/lists/combo/combo-valuekey/combo-valuekey.component.ts index 022b1fc828..0184ca1113 100644 --- a/src/app/lists/combo/combo-valuekey/combo-valuekey.component.ts +++ b/src/app/lists/combo/combo-valuekey/combo-valuekey.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { IgxComboComponent } from 'igniteui-angular/combo'; import { IgxButtonDirective } from 'igniteui-angular/directives'; import { CITIES, ICity } from './cities'; @@ -8,7 +8,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-combo-valuekey', templateUrl: 'combo-valuekey.component.html', styleUrls: ['combo-valuekey.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxComboComponent, FormsModule, IgxButtonDirective] }) export class ComboValueKeyComponent { diff --git a/src/app/lists/combo/simple-combo-cascading/simple-combo-cascading.component.ts b/src/app/lists/combo/simple-combo-cascading/simple-combo-cascading.component.ts index c7fba580f2..c98711a490 100644 --- a/src/app/lists/combo/simple-combo-cascading/simple-combo-cascading.component.ts +++ b/src/app/lists/combo/simple-combo-cascading/simple-combo-cascading.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { ChangeDetectorRef, Component, inject, OnInit } from '@angular/core'; import { ISimpleComboSelectionChangingEventArgs, IgxSimpleComboComponent } from 'igniteui-angular/simple-combo'; import { IgxLinearProgressBarComponent } from 'igniteui-angular/progressbar'; import { City, Country, getCitiesByCountry, getCountries, Region } from '../../../data/cities15000-regions-countries'; @@ -9,7 +9,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-simple-combo-cascading', templateUrl: 'simple-combo-cascading.component.html', styleUrls: ['simple-combo-cascading.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSimpleComboComponent, FormsModule, IgxLinearProgressBarComponent] }) export class SimpleComboCascadingComponent implements OnInit { @@ -22,6 +21,7 @@ export class SimpleComboCascadingComponent implements OnInit { public isLoadingRegions: boolean = false; public isLoadingCities: boolean = false; private loadingTime = 0; + private cdr = inject(ChangeDetectorRef); public ngOnInit(): void { this.countriesData = getCountries(['United States', 'Japan', 'United Kingdom']); @@ -42,6 +42,7 @@ export class SimpleComboCascadingComponent implements OnInit { .map(c => ({name: c.region, country: c.country})) .filter((v, i, a) => a.findIndex(r => r.name === v.name) === i); this.isLoadingRegions = false; + this.cdr.markForCheck(); }, this.loadingTime) this.citiesData = []; this.loadingTime = 0; @@ -60,6 +61,7 @@ export class SimpleComboCascadingComponent implements OnInit { this.citiesData = getCitiesByCountry([this.selectedCountry?.name]) .filter(c => c.region === this.selectedRegion?.name); this.isLoadingCities = false; + this.cdr.markForCheck(); }, this.loadingTime) this.loadingTime = 0; } diff --git a/src/app/lists/combo/simple-combo-main/simple-combo-main.component.ts b/src/app/lists/combo/simple-combo-main/simple-combo-main.component.ts index ab46a07652..a5c86e96de 100644 --- a/src/app/lists/combo/simple-combo-main/simple-combo-main.component.ts +++ b/src/app/lists/combo/simple-combo-main/simple-combo-main.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit } from '@angular/core'; import { IgRect } from 'igniteui-angular-core'; import { StockData, updatedStockData } from '../../../data/stocks-data'; import { IgxSimpleComboComponent } from 'igniteui-angular/simple-combo'; @@ -12,7 +12,6 @@ import { IgxFinancialChartCoreModule, IgxFinancialChartModule } from 'igniteui-a selector: 'app-simple-combo-main', templateUrl: 'simple-combo-main.component.html', styleUrls: ['simple-combo-main.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSimpleComboComponent, FormsModule, IgxButtonGroupComponent, IgxButtonDirective, IgxFinancialChartModule, IgxFinancialChartCoreModule] }) export class SimpleComboMainComponent implements OnInit { diff --git a/src/app/lists/combo/simple-combo-remote/simple-combo-remote.component.ts b/src/app/lists/combo/simple-combo-remote/simple-combo-remote.component.ts index e5ffeeac0a..1a7caaad9c 100644 --- a/src/app/lists/combo/simple-combo-remote/simple-combo-remote.component.ts +++ b/src/app/lists/combo/simple-combo-remote/simple-combo-remote.component.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, ChangeDetectorRef, Component, OnInit, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { AfterViewInit, ChangeDetectorRef, Component, OnInit, ViewChild, inject } from '@angular/core'; import { IComboSearchInputEventArgs } from 'igniteui-angular/combo'; import { IForOfState } from 'igniteui-angular/directives'; import { ISimpleComboSelectionChangingEventArgs, IgxSimpleComboComponent } from 'igniteui-angular/simple-combo'; @@ -12,7 +12,6 @@ import { AsyncPipe } from '@angular/common'; selector: 'app-simple-combo-remote', templateUrl: './simple-combo-remote.component.html', styleUrls: ['./simple-combo-remote.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSimpleComboComponent, IgxToastComponent, AsyncPipe] }) export class SimpleComboRemoteComponent implements OnInit, AfterViewInit { diff --git a/src/app/lists/combo/simple-combo-styling/simple-combo-styling.component.ts b/src/app/lists/combo/simple-combo-styling/simple-combo-styling.component.ts index 803c882113..b28e790883 100644 --- a/src/app/lists/combo/simple-combo-styling/simple-combo-styling.component.ts +++ b/src/app/lists/combo/simple-combo-styling/simple-combo-styling.component.ts @@ -1,4 +1,4 @@ -import { Component, ElementRef, OnInit, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ElementRef, OnInit, inject } from '@angular/core'; import { City, getCitiesByPopulation } from '../../../data/cities15000-regions-countries'; import { IgxSimpleComboComponent } from 'igniteui-angular/simple-combo'; @@ -6,7 +6,6 @@ import { IgxSimpleComboComponent } from 'igniteui-angular/simple-combo'; selector: 'app-simple-combo-styling', templateUrl: 'simple-combo-styling.component.html', styleUrls: ['simple-combo-styling.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSimpleComboComponent] }) export class SimpleComboStylingComponent implements OnInit { diff --git a/src/app/lists/combo/simple-combo-usage/simple-combo-usage.component.ts b/src/app/lists/combo/simple-combo-usage/simple-combo-usage.component.ts index 43d8639971..1a87c034c9 100644 --- a/src/app/lists/combo/simple-combo-usage/simple-combo-usage.component.ts +++ b/src/app/lists/combo/simple-combo-usage/simple-combo-usage.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit } from '@angular/core'; import { City, getCitiesByPopulation } from '../../../data/cities15000-regions-countries'; import { IgxSimpleComboComponent } from 'igniteui-angular/simple-combo'; import { FormsModule } from '@angular/forms'; @@ -8,7 +8,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-simple-combo-usage', templateUrl: 'simple-combo-usage.component.html', styleUrls: ['simple-combo-usage.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSimpleComboComponent, FormsModule] }) export class SimpleComboUsageComponent implements OnInit { diff --git a/src/app/lists/list/list-chat-sample/list-chat-sample.component.ts b/src/app/lists/list/list-chat-sample/list-chat-sample.component.ts index cd7eff07c4..47e5145e4e 100644 --- a/src/app/lists/list/list-chat-sample/list-chat-sample.component.ts +++ b/src/app/lists/list/list-chat-sample/list-chat-sample.component.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, Component, ElementRef, TemplateRef, ViewChild, ViewEncapsulation, inject, ChangeDetectionStrategy } from '@angular/core'; +import { AfterViewInit, Component, ElementRef, TemplateRef, ViewChild, ViewEncapsulation, inject } from '@angular/core'; import { ContactsService } from './services/contacts.service'; import { IMessage, MessagesService } from './services/messages.service'; import { FormsModule } from '@angular/forms'; @@ -14,7 +14,6 @@ import { NgClass, NgTemplateOutlet, DatePipe } from '@angular/common'; selector: 'app-list-chat-sample', styleUrls: ['./list-chat-sample.component.scss'], templateUrl: './list-chat-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [FormsModule, IgxListComponent, IgxListItemComponent, IgxAvatarComponent, NgClass, NgTemplateOutlet, IgxInputGroupComponent, IgxInputDirective, IgxSuffixDirective, IgxIconButtonDirective, IgxIconComponent, DatePipe] }) export class ListChatSampleComponent implements AfterViewInit { diff --git a/src/app/lists/list/list-item-selection/list-item-selection.component.ts b/src/app/lists/list/list-item-selection/list-item-selection.component.ts index 66ab11baa1..bfa1424a37 100644 --- a/src/app/lists/list/list-item-selection/list-item-selection.component.ts +++ b/src/app/lists/list/list-item-selection/list-item-selection.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxFilterOptions, IgxFilterPipe, IgxRippleDirective } from 'igniteui-angular/directives'; import { IgxInputDirective, IgxInputGroupComponent, IgxPrefixDirective, IgxSuffixDirective } from 'igniteui-angular/input-group'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -10,7 +10,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-list-item-selection', templateUrl: './list-item-selection.component.html', styleUrls: ['./list-item-selection.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxInputGroupComponent, IgxPrefixDirective, IgxIconComponent, FormsModule, IgxInputDirective, IgxSuffixDirective, IgxListComponent, IgxListItemComponent, IgxAvatarComponent, IgxListThumbnailDirective, IgxListLineTitleDirective, IgxListLineSubTitleDirective, IgxListActionDirective, IgxRippleDirective, IgxFilterPipe] }) export class ListItemSelectionComponent { diff --git a/src/app/lists/list/list-sample-1/list-sample-1.component.ts b/src/app/lists/list/list-sample-1/list-sample-1.component.ts index e3af0bddfd..456fde939f 100644 --- a/src/app/lists/list/list-sample-1/list-sample-1.component.ts +++ b/src/app/lists/list/list-sample-1/list-sample-1.component.ts @@ -1,4 +1,4 @@ -import { Component, ElementRef, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ElementRef, ViewChild } from '@angular/core'; import { IgxEmptyListTemplateDirective, IgxListComponent, IgxListItemComponent } from 'igniteui-angular/list'; @@ -6,7 +6,6 @@ import { IgxEmptyListTemplateDirective, IgxListComponent, IgxListItemComponent } selector: 'app-igx-list-demo', styleUrls: ['./list-sample-1.component.scss'], templateUrl: './list-sample-1.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxListComponent, IgxEmptyListTemplateDirective, IgxListItemComponent] }) export class ListSample1Component { diff --git a/src/app/lists/list/list-sample-2/list-sample-2.component.ts b/src/app/lists/list/list-sample-2/list-sample-2.component.ts index 770c0e859b..04e043fd5c 100644 --- a/src/app/lists/list/list-sample-2/list-sample-2.component.ts +++ b/src/app/lists/list/list-sample-2/list-sample-2.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxListComponent, IgxListItemComponent } from 'igniteui-angular/list'; @Component({ selector: 'app-igx-list-simple', styleUrls: ['./list-sample-2.component.scss'], templateUrl: './list-sample-2.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxListComponent, IgxListItemComponent] }) export class ListSample2Component { diff --git a/src/app/lists/list/list-sample-3/list-sample-3.component.ts b/src/app/lists/list/list-sample-3/list-sample-3.component.ts index e2d7b58953..de8c56bde0 100644 --- a/src/app/lists/list/list-sample-3/list-sample-3.component.ts +++ b/src/app/lists/list/list-sample-3/list-sample-3.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxListComponent, IgxListItemComponent, IgxListLineSubTitleDirective, IgxListLineTitleDirective } from 'igniteui-angular/list'; import { IgxRippleDirective } from 'igniteui-angular/directives'; @@ -6,7 +6,6 @@ import { IgxRippleDirective } from 'igniteui-angular/directives'; selector: 'app-contact-list', styleUrls: ['./list-sample-3.component.scss'], templateUrl: './list-sample-3.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxListComponent, IgxListItemComponent, IgxRippleDirective, IgxListLineTitleDirective, IgxListLineSubTitleDirective] }) export class ListSample3Component { diff --git a/src/app/lists/list/list-sample-4/list-sample-4.component.ts b/src/app/lists/list/list-sample-4/list-sample-4.component.ts index 7a77768fdf..fc0b2032cc 100644 --- a/src/app/lists/list/list-sample-4/list-sample-4.component.ts +++ b/src/app/lists/list/list-sample-4/list-sample-4.component.ts @@ -1,4 +1,4 @@ -import { Component, HostBinding, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, HostBinding, OnInit } from '@angular/core'; import { IgxFilterOptions, IgxFilterPipe, IgxRippleDirective } from 'igniteui-angular/directives'; import { IgxButtonGroupComponent } from 'igniteui-angular/button-group'; import { IgxInputDirective, IgxInputGroupComponent, IgxPrefixDirective, IgxSuffixDirective } from 'igniteui-angular/input-group'; @@ -11,7 +11,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-contact-list2', styleUrls: ['./list-sample-4.component.scss'], templateUrl: './list-sample-4.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonGroupComponent, IgxInputGroupComponent, IgxPrefixDirective, IgxIconComponent, FormsModule, IgxInputDirective, IgxSuffixDirective, IgxListComponent, IgxListItemComponent, IgxRippleDirective, IgxAvatarComponent, IgxListThumbnailDirective, IgxListLineTitleDirective, IgxListLineSubTitleDirective, IgxListActionDirective, IgxFilterPipe] }) export class ListSample4Component implements OnInit { diff --git a/src/app/lists/list/list-sample-5/list-sample-5.component.ts b/src/app/lists/list/list-sample-5/list-sample-5.component.ts index 4acf3c6760..6f0ce5e184 100644 --- a/src/app/lists/list/list-sample-5/list-sample-5.component.ts +++ b/src/app/lists/list/list-sample-5/list-sample-5.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxEmptyListTemplateDirective, IgxListComponent } from 'igniteui-angular/list'; @Component({ selector: 'app-list-sample-5', styleUrls: ['./list-sample-5.component.scss'], templateUrl: './list-sample-5.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxListComponent, IgxEmptyListTemplateDirective] }) export class ListSample5Component { diff --git a/src/app/lists/list/list-sample-6/list-sample-6.component.ts b/src/app/lists/list/list-sample-6/list-sample-6.component.ts index 4f3f970c0c..9b62e30b0c 100644 --- a/src/app/lists/list/list-sample-6/list-sample-6.component.ts +++ b/src/app/lists/list/list-sample-6/list-sample-6.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { ChangeDetectorRef, Component, inject, ViewChild } from '@angular/core'; import { IgxDataLoadingTemplateDirective, IgxEmptyListTemplateDirective, IgxListComponent, IgxListItemComponent } from 'igniteui-angular/list'; import { IgxButtonDirective, IgxRippleDirective } from 'igniteui-angular/directives'; @@ -7,10 +7,10 @@ import { IgxButtonDirective, IgxRippleDirective } from 'igniteui-angular/directi selector: 'app-list-sample-6', styleUrls: ['./list-sample-6.component.scss'], templateUrl: './list-sample-6.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxListComponent, IgxListItemComponent, IgxRippleDirective, IgxEmptyListTemplateDirective, IgxButtonDirective, IgxDataLoadingTemplateDirective] }) export class ListSample6Component { + private cdr = inject(ChangeDetectorRef); @ViewChild('fruitList', { static: true }) public fruitList: IgxListComponent; @@ -25,6 +25,7 @@ export class ListSample6Component { const availableFruits: string[] = ['banana', 'orange', 'apple', 'strawberry', 'pear']; availableFruits.forEach((fruit) => { this.fruitsData.push(fruit); }); this.fruitList.isLoading = false; + this.cdr.markForCheck(); }, 1000); } diff --git a/src/app/lists/list/list-sample-7/list-sample-7.component.ts b/src/app/lists/list/list-sample-7/list-sample-7.component.ts index 1e8b940730..8c9e9a85ca 100644 --- a/src/app/lists/list/list-sample-7/list-sample-7.component.ts +++ b/src/app/lists/list/list-sample-7/list-sample-7.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxListActionDirective, IgxListComponent, IgxListItemComponent, IgxListItemLeftPanningTemplateDirective, IgxListItemRightPanningTemplateDirective, IgxListLineSubTitleDirective, IgxListLineTitleDirective, IgxListThumbnailDirective } from 'igniteui-angular/list'; import { IgxToastComponent } from 'igniteui-angular/toast'; @@ -13,7 +13,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-contact-list2', styleUrls: ['./list-sample-7.component.scss'], templateUrl: './list-sample-7.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSliderComponent, FormsModule, IgxListComponent, IgxListItemLeftPanningTemplateDirective, IgxIconComponent, IgxListItemRightPanningTemplateDirective, IgxListItemComponent, IgxRippleDirective, IgxAvatarComponent, IgxListThumbnailDirective, IgxListLineTitleDirective, IgxListLineSubTitleDirective, IgxListActionDirective, IgxToastComponent, IgxButtonDirective] }) export class ListSample7Component implements OnInit { diff --git a/src/app/lists/list/list-sample-8/list-sample-8.component.ts b/src/app/lists/list/list-sample-8/list-sample-8.component.ts index e7cf1d231e..028d1dc185 100644 --- a/src/app/lists/list/list-sample-8/list-sample-8.component.ts +++ b/src/app/lists/list/list-sample-8/list-sample-8.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxListActionDirective, IgxListComponent, IgxListItemComponent, IgxListLineSubTitleDirective, IgxListLineTitleDirective, IgxListThumbnailDirective } from 'igniteui-angular/list'; import { IgxToastComponent } from 'igniteui-angular/toast'; @@ -11,7 +11,6 @@ import { IgxRippleDirective } from 'igniteui-angular/directives'; selector: 'app-list-8', styleUrls: ['./list-sample-8.component.scss'], templateUrl: './list-sample-8.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxListComponent, IgxListItemComponent, IgxAvatarComponent, IgxListThumbnailDirective, IgxListLineTitleDirective, IgxListLineSubTitleDirective, IgxIconComponent, IgxListActionDirective, IgxRippleDirective] }) export class ListSample8Component implements OnInit { diff --git a/src/app/lists/list/list-tailwind-styling/list-tailwind-styling.component.ts b/src/app/lists/list/list-tailwind-styling/list-tailwind-styling.component.ts index c567e465be..b1024da3f6 100644 --- a/src/app/lists/list/list-tailwind-styling/list-tailwind-styling.component.ts +++ b/src/app/lists/list/list-tailwind-styling/list-tailwind-styling.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxListActionDirective, IgxListComponent, IgxListItemComponent, IgxListLineSubTitleDirective, IgxListLineTitleDirective, IgxListThumbnailDirective } from 'igniteui-angular/list'; import { IgxAvatarComponent } from 'igniteui-angular/avatar'; @@ -10,7 +10,6 @@ import { IgxRippleDirective } from 'igniteui-angular/directives'; selector: 'app-list-tailwind-styling', styleUrls: ['./list-tailwind-styling.component.scss'], templateUrl: './list-tailwind-styling.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxListComponent, IgxListItemComponent, IgxAvatarComponent, IgxListThumbnailDirective, IgxListLineTitleDirective, IgxListLineSubTitleDirective, IgxIconComponent, IgxListActionDirective, IgxRippleDirective] }) export class ListTailwindStylingComponent implements OnInit { diff --git a/src/app/lists/list/list.component.ts b/src/app/lists/list/list.component.ts index 9c4aa8fa66..8cf77dbf8b 100644 --- a/src/app/lists/list/list.component.ts +++ b/src/app/lists/list/list.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxFilterOptions, IgxFilterPipe, IgxRippleDirective } from 'igniteui-angular/directives'; import { IgxInputDirective, IgxInputGroupComponent, IgxPrefixDirective, IgxSuffixDirective } from 'igniteui-angular/input-group'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -11,7 +11,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-list', styleUrls: ['./list.component.scss'], templateUrl: './list.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxInputGroupComponent, IgxPrefixDirective, IgxIconComponent, FormsModule, IgxInputDirective, IgxSuffixDirective, IgxListComponent, IgxListItemComponent, IgxRippleDirective, IgxAvatarComponent, IgxListThumbnailDirective, IgxListLineTitleDirective, IgxListLineSubTitleDirective, IgxListActionDirective, IgxFilterPipe] }) export class ListComponent { diff --git a/src/app/lists/tree/tree-advanced-sample/tree-advanced-sample.component.ts b/src/app/lists/tree/tree-advanced-sample/tree-advanced-sample.component.ts index 7cfc8e4322..b742bef05e 100644 --- a/src/app/lists/tree/tree-advanced-sample/tree-advanced-sample.component.ts +++ b/src/app/lists/tree/tree-advanced-sample/tree-advanced-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, AfterViewInit, OnDestroy, PLATFORM_ID, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, AfterViewInit, OnDestroy, PLATFORM_ID, inject, ChangeDetectorRef } from '@angular/core'; import { IgxIconComponent, IgxIconService } from 'igniteui-angular/icon'; import { IgxTreeComponent, IgxTreeNodeComponent } from 'igniteui-angular/tree'; import { IgxTooltipDirective, IgxTooltipTargetDirective } from 'igniteui-angular/directives'; @@ -13,13 +13,13 @@ import { isPlatformBrowser, NgTemplateOutlet } from '@angular/common'; templateUrl: './tree-advanced-sample.component.html', styleUrls: ['./tree-advanced-sample.component.scss'], providers: [DataService], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeComponent, IgxTreeNodeComponent, NgTemplateOutlet, IgxIconComponent, IgxTooltipTargetDirective, IgxTooltipDirective] }) export class TreeAdvancedSampleComponent implements AfterViewInit, OnDestroy { private iconService = inject(IgxIconService); private dataService = inject(DataService); private platformId = inject(PLATFORM_ID); + private cdr = inject(ChangeDetectorRef); public family = 'tree-icons'; public data = DATA; @@ -32,6 +32,7 @@ export class TreeAdvancedSampleComponent implements AfterViewInit, OnDestroy { this.dataService.data.pipe(takeUntil(this.destroy$)).subscribe((data) => { this.loading = false; this.remoteData = data; + this.cdr.markForCheck(); }); } @@ -71,6 +72,7 @@ export class TreeAdvancedSampleComponent implements AfterViewInit, OnDestroy { } }); } + this.cdr.markForCheck(); }); } } diff --git a/src/app/lists/tree/tree-basic-sample/tree-basic-sample.component.ts b/src/app/lists/tree/tree-basic-sample/tree-basic-sample.component.ts index 1b659ee2f6..d625328cdb 100644 --- a/src/app/lists/tree/tree-basic-sample/tree-basic-sample.component.ts +++ b/src/app/lists/tree/tree-basic-sample/tree-basic-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { DATA } from '../../../data/animations-data'; import { IgxTreeComponent, IgxTreeNodeComponent } from 'igniteui-angular/tree'; @@ -7,7 +7,6 @@ import { IgxTreeComponent, IgxTreeNodeComponent } from 'igniteui-angular/tree'; selector: 'app-tree-basic-sample', templateUrl: './tree-basic-sample.component.html', styleUrls: ['./tree-basic-sample.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeComponent, IgxTreeNodeComponent] }) export class TreeBasicSampleComponent { diff --git a/src/app/lists/tree/tree-styling/tree-styling.component.ts b/src/app/lists/tree/tree-styling/tree-styling.component.ts index a122925918..0ca13a51b3 100644 --- a/src/app/lists/tree/tree-styling/tree-styling.component.ts +++ b/src/app/lists/tree/tree-styling/tree-styling.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { DATA } from '../../../data/animations-data'; import { IgxTreeComponent, IgxTreeNodeComponent } from 'igniteui-angular/tree'; @@ -7,7 +7,6 @@ import { IgxTreeComponent, IgxTreeNodeComponent } from 'igniteui-angular/tree'; selector: 'app-tree-styling', templateUrl: './tree-styling.component.html', styleUrls: ['./tree-styling.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeComponent, IgxTreeNodeComponent] }) export class TreeStylingComponent { diff --git a/src/app/lists/tree/tree-tailwind-styling/tree-tailwind-styling.component.ts b/src/app/lists/tree/tree-tailwind-styling/tree-tailwind-styling.component.ts index f93b414aea..4c9106408a 100644 --- a/src/app/lists/tree/tree-tailwind-styling/tree-tailwind-styling.component.ts +++ b/src/app/lists/tree/tree-tailwind-styling/tree-tailwind-styling.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { DATA } from '../../../data/animations-data'; import { IgxTreeComponent, IgxTreeNodeComponent } from 'igniteui-angular/tree'; @@ -7,7 +7,6 @@ import { IgxTreeComponent, IgxTreeNodeComponent } from 'igniteui-angular/tree'; selector: 'app-tree-tailwind-styling', templateUrl: './tree-tailwind-styling.component.html', styleUrls: ['./tree-tailwind-styling.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeComponent, IgxTreeNodeComponent] }) export class TreeTailwindStylingComponent { diff --git a/src/app/menus/action-strip/action-strip-paragraph-menu/action-strip-paragraph-menu.component.ts b/src/app/menus/action-strip/action-strip-paragraph-menu/action-strip-paragraph-menu.component.ts index 44e6af1933..865ad52e05 100644 --- a/src/app/menus/action-strip/action-strip-paragraph-menu/action-strip-paragraph-menu.component.ts +++ b/src/app/menus/action-strip/action-strip-paragraph-menu/action-strip-paragraph-menu.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { IgxActionStripComponent, IgxActionStripMenuItemDirective } from 'igniteui-angular/action-strip'; import { IgxRippleDirective } from 'igniteui-angular/directives'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -7,7 +7,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: 'app-action-strip-paragraph-menu', styleUrls: ['./action-strip-paragraph-menu.component.scss'], templateUrl: './action-strip-paragraph-menu.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxActionStripComponent, IgxActionStripMenuItemDirective, IgxRippleDirective, IgxIconComponent] }) export class ActionStripParagraphMenuComponent { diff --git a/src/app/menus/action-strip/action-strip-paragraph-styling/action-strip-paragraph-styling.component.ts b/src/app/menus/action-strip/action-strip-paragraph-styling/action-strip-paragraph-styling.component.ts index 4a89d87eec..470f5348fb 100644 --- a/src/app/menus/action-strip/action-strip-paragraph-styling/action-strip-paragraph-styling.component.ts +++ b/src/app/menus/action-strip/action-strip-paragraph-styling/action-strip-paragraph-styling.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { IgxActionStripComponent } from 'igniteui-angular/action-strip'; import { IgxButtonDirective } from 'igniteui-angular/directives'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -7,7 +7,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: 'app-action-strip-paragraph-styling', styleUrls: ['./action-strip-paragraph-styling.component.scss'], templateUrl: './action-strip-paragraph-styling.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxActionStripComponent, IgxButtonDirective, IgxIconComponent] }) export class ActionStripStylingComponent { diff --git a/src/app/menus/action-strip/action-strip-paragraph/action-strip-paragraph.component.scss b/src/app/menus/action-strip/action-strip-paragraph/action-strip-paragraph.component.scss index 223f7133d1..e3557ec031 100644 --- a/src/app/menus/action-strip/action-strip-paragraph/action-strip-paragraph.component.scss +++ b/src/app/menus/action-strip/action-strip-paragraph/action-strip-paragraph.component.scss @@ -5,7 +5,7 @@ $custom-strip: action-strip-theme( ); .my-action-strip { - @include action-strip($custom-strip); + @include tokens($custom-strip); display: flex; align-items: flex-start; justify-content: center; diff --git a/src/app/menus/action-strip/action-strip-paragraph/action-strip-paragraph.component.ts b/src/app/menus/action-strip/action-strip-paragraph/action-strip-paragraph.component.ts index f7b30cfb40..46c7ed09cd 100644 --- a/src/app/menus/action-strip/action-strip-paragraph/action-strip-paragraph.component.ts +++ b/src/app/menus/action-strip/action-strip-paragraph/action-strip-paragraph.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { IgxActionStripComponent } from 'igniteui-angular/action-strip'; import { IgxButtonGroupComponent } from 'igniteui-angular/button-group'; import { IgxButtonDirective } from 'igniteui-angular/directives'; @@ -8,7 +8,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: 'app-action-strip-paragraph', styleUrls: ['./action-strip-paragraph.component.scss'], templateUrl: './action-strip-paragraph.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxActionStripComponent, IgxButtonGroupComponent, IgxButtonDirective, IgxIconComponent] }) export class ActionStripParagraphComponent { diff --git a/src/app/menus/navbar/navbar-custom-title/navbar-custom-title.component.ts b/src/app/menus/navbar/navbar-custom-title/navbar-custom-title.component.ts index 37ea8eb442..9ea7b8ebb3 100644 --- a/src/app/menus/navbar/navbar-custom-title/navbar-custom-title.component.ts +++ b/src/app/menus/navbar/navbar-custom-title/navbar-custom-title.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxNavbarActionDirective, IgxNavbarComponent, IgxNavbarTitleDirective } from 'igniteui-angular/navbar'; import { IgxIconButtonDirective } from 'igniteui-angular/directives'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -7,7 +7,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: 'app-navbar-custom-title', templateUrl: './navbar-custom-title.component.html', styleUrls: ['./navbar-custom-title.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxNavbarComponent, IgxNavbarActionDirective, IgxIconButtonDirective, IgxIconComponent, IgxNavbarTitleDirective] }) export class NavbarCustomTitleComponent { } diff --git a/src/app/menus/navbar/navbar-sample-1/navbar-sample-1.component.ts b/src/app/menus/navbar/navbar-sample-1/navbar-sample-1.component.ts index 56e56e558a..a8418a5132 100644 --- a/src/app/menus/navbar/navbar-sample-1/navbar-sample-1.component.ts +++ b/src/app/menus/navbar/navbar-sample-1/navbar-sample-1.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewEncapsulation, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewEncapsulation } from '@angular/core'; import { IgxNavbarActionDirective, IgxNavbarComponent } from 'igniteui-angular/navbar'; import { IgxIconButtonDirective } from 'igniteui-angular/directives'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -8,7 +8,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: 'app-navbar-sample-1', styleUrls: ['./navbar-sample-1.component.scss'], templateUrl: './navbar-sample-1.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxNavbarComponent, IgxNavbarActionDirective, IgxIconButtonDirective, IgxIconComponent] }) export class NavbarSample1Component { } diff --git a/src/app/menus/navbar/navbar-sample-2/navbar-sample-2.component.ts b/src/app/menus/navbar/navbar-sample-2/navbar-sample-2.component.ts index 20b9fb1584..6074508913 100644 --- a/src/app/menus/navbar/navbar-sample-2/navbar-sample-2.component.ts +++ b/src/app/menus/navbar/navbar-sample-2/navbar-sample-2.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewEncapsulation, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewEncapsulation } from '@angular/core'; import { IgxNavbarActionDirective, IgxNavbarComponent } from 'igniteui-angular/navbar'; import { IgxIconButtonDirective } from 'igniteui-angular/directives'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -8,7 +8,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: 'app-navbar-sample-2', styleUrls: ['./navbar-sample-2.component.scss'], templateUrl: './navbar-sample-2.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxNavbarComponent, IgxNavbarActionDirective, IgxIconButtonDirective, IgxIconComponent] }) export class NavbarSample2Component { } diff --git a/src/app/menus/navbar/navbar-sample-3/navbar-sample-3.component.ts b/src/app/menus/navbar/navbar-sample-3/navbar-sample-3.component.ts index ff93fa83c6..bb841c2fd4 100644 --- a/src/app/menus/navbar/navbar-sample-3/navbar-sample-3.component.ts +++ b/src/app/menus/navbar/navbar-sample-3/navbar-sample-3.component.ts @@ -1,5 +1,5 @@ import { Location, LocationStrategy, PathLocationStrategy } from '@angular/common'; -import { Component, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, inject } from '@angular/core'; import { IgxNavbarComponent } from 'igniteui-angular/navbar'; @Component({ @@ -7,7 +7,6 @@ import { IgxNavbarComponent } from 'igniteui-angular/navbar'; selector: 'app-navbar', styleUrls: ['./navbar-sample-3.component.scss'], templateUrl: './navbar-sample-3.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxNavbarComponent] }) export class NavbarSample3Component { diff --git a/src/app/menus/navbar/navbar-style/navbar-style.component.ts b/src/app/menus/navbar/navbar-style/navbar-style.component.ts index c02ace0a3e..433a2540f3 100644 --- a/src/app/menus/navbar/navbar-style/navbar-style.component.ts +++ b/src/app/menus/navbar/navbar-style/navbar-style.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxNavbarActionDirective, IgxNavbarComponent } from 'igniteui-angular/navbar'; import { IgxIconButtonDirective } from 'igniteui-angular/directives'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -7,7 +7,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: 'app-navbar-style', styleUrls: ['./navbar-style.component.scss'], templateUrl: './navbar-style.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxNavbarComponent, IgxNavbarActionDirective, IgxIconButtonDirective, IgxIconComponent] }) diff --git a/src/app/menus/navbar/navbar-tailwind-style/navbar-tailwind-style.component.ts b/src/app/menus/navbar/navbar-tailwind-style/navbar-tailwind-style.component.ts index 3b7677f4ed..c521cb43fd 100644 --- a/src/app/menus/navbar/navbar-tailwind-style/navbar-tailwind-style.component.ts +++ b/src/app/menus/navbar/navbar-tailwind-style/navbar-tailwind-style.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxNavbarActionDirective, IgxNavbarComponent } from 'igniteui-angular/navbar'; import { IgxIconButtonDirective } from 'igniteui-angular/directives'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -7,7 +7,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: 'app-navbar-tailwind-style', styleUrls: ['./navbar-tailwind-style.component.scss'], templateUrl: './navbar-tailwind-style.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxNavbarComponent, IgxNavbarActionDirective, IgxIconButtonDirective, IgxIconComponent] }) diff --git a/src/app/menus/navbar/navbar.component.ts b/src/app/menus/navbar/navbar.component.ts index ae653b3a0e..9a8c5cc6d4 100644 --- a/src/app/menus/navbar/navbar.component.ts +++ b/src/app/menus/navbar/navbar.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewEncapsulation, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewEncapsulation } from '@angular/core'; import { IgxNavbarComponent } from 'igniteui-angular/navbar'; @Component({ @@ -6,7 +6,6 @@ import { IgxNavbarComponent } from 'igniteui-angular/navbar'; selector: 'app-navbar', styleUrls: ['./navbar.component.scss'], templateUrl: './navbar.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxNavbarComponent] }) export class NavbarComponent { } diff --git a/src/app/menus/navdrawer/nav-drawer-hierarchical/nav-drawer-hierarchical.component.ts b/src/app/menus/navdrawer/nav-drawer-hierarchical/nav-drawer-hierarchical.component.ts index be6f570f20..88805ec4b1 100644 --- a/src/app/menus/navdrawer/nav-drawer-hierarchical/nav-drawer-hierarchical.component.ts +++ b/src/app/menus/navdrawer/nav-drawer-hierarchical/nav-drawer-hierarchical.component.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { AfterViewInit, Component, ViewChild } from '@angular/core'; import { IgxTreeComponent, IgxTreeNodeComponent, IgxTreeNodeLinkDirective } from 'igniteui-angular/tree'; import { IgxFlexDirective, IgxIconButtonDirective, IgxLayoutDirective, IgxToggleActionDirective } from 'igniteui-angular/directives'; import { IgxNavDrawerTemplateDirective, IgxNavigationDrawerComponent } from 'igniteui-angular/navigation-drawer'; @@ -10,7 +10,6 @@ import { RouterLink } from '@angular/router'; selector: 'app-nav-drawer-hierarchical', templateUrl: './nav-drawer-hierarchical.component.html', styleUrls: ['./nav-drawer-hierarchical.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxLayoutDirective, IgxNavigationDrawerComponent, IgxNavDrawerTemplateDirective, IgxTreeComponent, IgxTreeNodeComponent, IgxTreeNodeLinkDirective, RouterLink, IgxFlexDirective, IgxIconButtonDirective, IgxToggleActionDirective, IgxIconComponent] }) export class NavDrawerHierarchicalComponent implements AfterViewInit { @@ -70,4 +69,4 @@ export class NavDrawerHierarchicalComponent implements AfterViewInit { this.selectedContent = node.data; }) } -} \ No newline at end of file +} diff --git a/src/app/menus/navdrawer/nav-drawer-mini/nav-drawer-mini.component.ts b/src/app/menus/navdrawer/nav-drawer-mini/nav-drawer-mini.component.ts index 677177deaa..0f97a56fd4 100644 --- a/src/app/menus/navdrawer/nav-drawer-mini/nav-drawer-mini.component.ts +++ b/src/app/menus/navdrawer/nav-drawer-mini/nav-drawer-mini.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxFlexDirective, IgxIconButtonDirective, IgxLayoutDirective, IgxRippleDirective, IgxToggleActionDirective } from 'igniteui-angular/directives'; import { IgxNavDrawerItemDirective, IgxNavDrawerMiniTemplateDirective, IgxNavDrawerTemplateDirective, IgxNavigationDrawerComponent } from 'igniteui-angular/navigation-drawer'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -8,7 +8,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: 'app-nav-drawer-mini', styleUrls: ['./nav-drawer-mini.component.scss'], templateUrl: './nav-drawer-mini.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxLayoutDirective, IgxNavigationDrawerComponent, IgxNavDrawerTemplateDirective, IgxNavDrawerItemDirective, IgxRippleDirective, IgxIconComponent, IgxNavDrawerMiniTemplateDirective, IgxFlexDirective, IgxIconButtonDirective, IgxToggleActionDirective] }) export class NavDrawerMiniComponent { diff --git a/src/app/menus/navdrawer/nav-drawer-pin/nav-drawer-pin.component.ts b/src/app/menus/navdrawer/nav-drawer-pin/nav-drawer-pin.component.ts index 058b3b3065..e18b8da185 100644 --- a/src/app/menus/navdrawer/nav-drawer-pin/nav-drawer-pin.component.ts +++ b/src/app/menus/navdrawer/nav-drawer-pin/nav-drawer-pin.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxFlexDirective, IgxIconButtonDirective, IgxLayoutDirective, IgxRippleDirective, IgxToggleActionDirective } from 'igniteui-angular/directives'; import { IgxNavDrawerItemDirective, IgxNavDrawerTemplateDirective, IgxNavigationDrawerComponent } from 'igniteui-angular/navigation-drawer'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -8,7 +8,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: 'app-nav-drawer-pin', styleUrls: ['./nav-drawer-pin.component.scss'], templateUrl: './nav-drawer-pin.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxLayoutDirective, IgxNavigationDrawerComponent, IgxNavDrawerTemplateDirective, IgxNavDrawerItemDirective, IgxRippleDirective, IgxIconComponent, IgxFlexDirective, IgxIconButtonDirective, IgxToggleActionDirective] }) export class NavDrawerPinComponent { diff --git a/src/app/menus/navdrawer/nav-drawer-routing/nav-drawer-routing.component.ts b/src/app/menus/navdrawer/nav-drawer-routing/nav-drawer-routing.component.ts index 1bba7b9ad4..d07442e5d3 100644 --- a/src/app/menus/navdrawer/nav-drawer-routing/nav-drawer-routing.component.ts +++ b/src/app/menus/navdrawer/nav-drawer-routing/nav-drawer-routing.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxNavDrawerItemDirective, IgxNavDrawerTemplateDirective, IgxNavigationDrawerComponent } from 'igniteui-angular/navigation-drawer'; import { IgxIconButtonDirective, IgxRippleDirective, IgxToggleActionDirective } from 'igniteui-angular/directives'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -9,7 +9,6 @@ import { RouterLinkActive, RouterLink } from '@angular/router'; selector: 'app-nav-drawer-routing', styleUrls: ['./nav-drawer-routing.component.scss'], templateUrl: './nav-drawer-routing.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxNavigationDrawerComponent, IgxNavDrawerTemplateDirective, IgxNavDrawerItemDirective, IgxRippleDirective, RouterLinkActive, RouterLink, IgxIconButtonDirective, IgxToggleActionDirective, IgxIconComponent] }) export class NavDrawerRoutingComponent { diff --git a/src/app/menus/navdrawer/nav-drawer-simple/nav-drawer-simple.component.ts b/src/app/menus/navdrawer/nav-drawer-simple/nav-drawer-simple.component.ts index da34aee547..4c3517bce5 100644 --- a/src/app/menus/navdrawer/nav-drawer-simple/nav-drawer-simple.component.ts +++ b/src/app/menus/navdrawer/nav-drawer-simple/nav-drawer-simple.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { IgxNavDrawerItemDirective, IgxNavDrawerTemplateDirective, IgxNavigationDrawerComponent } from 'igniteui-angular/navigation-drawer'; import { IgxIconButtonDirective, IgxRippleDirective, IgxToggleActionDirective } from 'igniteui-angular/directives'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -8,7 +8,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: 'app-nav-drawer-simple', styleUrls: ['./nav-drawer-simple.component.scss'], templateUrl: './nav-drawer-simple.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxNavigationDrawerComponent, IgxNavDrawerTemplateDirective, IgxNavDrawerItemDirective, IgxRippleDirective, IgxIconComponent, IgxIconButtonDirective, IgxToggleActionDirective] }) export class NavDrawerSimpleComponent { diff --git a/src/app/menus/navdrawer/nav-drawer-styling/nav-drawer-styling.component.ts b/src/app/menus/navdrawer/nav-drawer-styling/nav-drawer-styling.component.ts index 060c43dc79..a785a9db8a 100644 --- a/src/app/menus/navdrawer/nav-drawer-styling/nav-drawer-styling.component.ts +++ b/src/app/menus/navdrawer/nav-drawer-styling/nav-drawer-styling.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { NavDrawerRoutingComponent } from '../nav-drawer-routing/nav-drawer-routing.component'; @Component({ selector: 'app-nav-drawer-styling', styleUrls: ['./nav-drawer-styling.component.scss'], templateUrl: './nav-drawer-styling.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [NavDrawerRoutingComponent] }) export class NavDrawerStylingComponent { } diff --git a/src/app/notifications/banner/banner-advanced-sample/banner-advanced-sample.component.ts b/src/app/notifications/banner/banner-advanced-sample/banner-advanced-sample.component.ts index 4df14c7d50..d5e304444d 100644 --- a/src/app/notifications/banner/banner-advanced-sample/banner-advanced-sample.component.ts +++ b/src/app/notifications/banner/banner-advanced-sample/banner-advanced-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, OnDestroy, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnDestroy, OnInit, ViewChild } from '@angular/core'; import { IgxBannerActionsDirective, IgxBannerComponent } from 'igniteui-angular/banner'; import { IgxToastComponent } from 'igniteui-angular/toast'; import { VerticalAlignment } from 'igniteui-angular/core'; @@ -12,7 +12,6 @@ import { Subject } from 'rxjs'; selector: 'app-banner-advanced-sample', styleUrls: ['../banner-samples.scss'], templateUrl: 'banner-advanced-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxNavbarComponent, IgxIconComponent, IgxBannerComponent, IgxBannerActionsDirective, IgxButtonDirective, IgxRippleDirective, IgxCardComponent, IgxToastComponent] }) diff --git a/src/app/notifications/banner/banner-sample-1/banner-sample-1.component.ts b/src/app/notifications/banner/banner-sample-1/banner-sample-1.component.ts index 8372c0c899..48a70208ba 100644 --- a/src/app/notifications/banner/banner-sample-1/banner-sample-1.component.ts +++ b/src/app/notifications/banner/banner-sample-1/banner-sample-1.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxBannerComponent } from 'igniteui-angular/banner'; import { IgxNavbarComponent } from 'igniteui-angular/navbar'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -8,7 +8,6 @@ import { IgxCardComponent } from 'igniteui-angular/card'; selector: 'app-banner-sample-1', styleUrls: ['../banner-samples.scss'], templateUrl: 'banner-sample-1.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxNavbarComponent, IgxIconComponent, IgxBannerComponent, IgxCardComponent] }) diff --git a/src/app/notifications/banner/banner-sample-2/banner-sample-2.component.ts b/src/app/notifications/banner/banner-sample-2/banner-sample-2.component.ts index 69a9dc9708..ff4729361b 100644 --- a/src/app/notifications/banner/banner-sample-2/banner-sample-2.component.ts +++ b/src/app/notifications/banner/banner-sample-2/banner-sample-2.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxBannerActionsDirective, IgxBannerComponent } from 'igniteui-angular/banner'; import { IgxNavbarComponent } from 'igniteui-angular/navbar'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -9,7 +9,6 @@ import { IgxCardComponent } from 'igniteui-angular/card'; selector: 'app-banner-sample-2', styleUrls: ['../banner-samples.scss'], templateUrl: 'banner-sample-2.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxNavbarComponent, IgxIconComponent, IgxBannerComponent, IgxBannerActionsDirective, IgxButtonDirective, IgxRippleDirective, IgxCardComponent] }) diff --git a/src/app/notifications/banner/banner-sample-3/banner-sample-3.component.ts b/src/app/notifications/banner/banner-sample-3/banner-sample-3.component.ts index 364d81be97..8e3bd06d82 100644 --- a/src/app/notifications/banner/banner-sample-3/banner-sample-3.component.ts +++ b/src/app/notifications/banner/banner-sample-3/banner-sample-3.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxBannerActionsDirective, IgxBannerComponent } from 'igniteui-angular/banner'; import { IgxNavbarComponent } from 'igniteui-angular/navbar'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -10,7 +10,6 @@ import { slideInLeft, slideOutRight } from 'igniteui-angular/animations'; selector: 'app-banner-sample-3', styleUrls: ['../banner-samples.scss'], templateUrl: 'banner-sample-3.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxNavbarComponent, IgxIconComponent, IgxBannerComponent, IgxBannerActionsDirective, IgxButtonDirective, IgxRippleDirective, IgxCardComponent] }) diff --git a/src/app/notifications/banner/banner-sample-4/banner-sample-4.component.ts b/src/app/notifications/banner/banner-sample-4/banner-sample-4.component.ts index 1e50a4a423..b109b89ac9 100644 --- a/src/app/notifications/banner/banner-sample-4/banner-sample-4.component.ts +++ b/src/app/notifications/banner/banner-sample-4/banner-sample-4.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxBannerActionsDirective, IgxBannerComponent } from 'igniteui-angular/banner'; import { IgxNavbarComponent } from 'igniteui-angular/navbar'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -12,7 +12,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-banner-sample-4', templateUrl: './banner-sample-4.component.html', styleUrls: ['./banner-sample-4.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxNavbarComponent, IgxIconComponent, IgxBannerComponent, IgxBannerActionsDirective, IgxButtonDirective, IgxRippleDirective, IgxAvatarComponent, IgxSwitchComponent, FormsModule, IgxInputGroupComponent, IgxInputDirective] }) export class BannerSample4Component implements OnInit { diff --git a/src/app/notifications/banner/banner-styling/banner-styling.component.ts b/src/app/notifications/banner/banner-styling/banner-styling.component.ts index 4147471858..132ec924e8 100644 --- a/src/app/notifications/banner/banner-styling/banner-styling.component.ts +++ b/src/app/notifications/banner/banner-styling/banner-styling.component.ts @@ -1,4 +1,4 @@ -import { Component, OnDestroy, OnInit, ViewChild, ViewEncapsulation, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnDestroy, OnInit, ViewChild, ViewEncapsulation } from '@angular/core'; import { IgxBannerActionsDirective, IgxBannerComponent } from 'igniteui-angular/banner'; import { IgxToastComponent } from 'igniteui-angular/toast'; import { VerticalAlignment } from 'igniteui-angular/core'; @@ -14,7 +14,6 @@ import { Subject } from 'rxjs'; styleUrls: ['banner-styling.component.scss', '../banner-samples.scss'], templateUrl: 'banner-styling.component.html', encapsulation: ViewEncapsulation.None, - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxNavbarComponent, IgxIconComponent, IgxBannerComponent, IgxBannerActionsDirective, IgxButtonDirective, IgxRippleDirective, IgxCardComponent, IgxToastComponent] }) diff --git a/src/app/notifications/snackbar/snackbar-sample-1/snackbar-sample-1.component.ts b/src/app/notifications/snackbar/snackbar-sample-1/snackbar-sample-1.component.ts index 6c6bd3a230..fdc94536fd 100644 --- a/src/app/notifications/snackbar/snackbar-sample-1/snackbar-sample-1.component.ts +++ b/src/app/notifications/snackbar/snackbar-sample-1/snackbar-sample-1.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxButtonDirective } from 'igniteui-angular/directives'; import { IgxSnackbarComponent } from 'igniteui-angular/snackbar'; @@ -6,7 +6,6 @@ import { IgxSnackbarComponent } from 'igniteui-angular/snackbar'; selector: 'app-snackbar-sample-1', styleUrls: ['./snackbar-sample-1.component.scss'], templateUrl: './snackbar-sample-1.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxSnackbarComponent] }) export class SnackbarSample1Component { } diff --git a/src/app/notifications/snackbar/snackbar-sample-2/snackbar-sample-2.component.ts b/src/app/notifications/snackbar/snackbar-sample-2/snackbar-sample-2.component.ts index f7ff491dc7..a50c5bf3c8 100644 --- a/src/app/notifications/snackbar/snackbar-sample-2/snackbar-sample-2.component.ts +++ b/src/app/notifications/snackbar/snackbar-sample-2/snackbar-sample-2.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxButtonDirective } from 'igniteui-angular/directives'; import { IgxSnackbarComponent } from 'igniteui-angular/snackbar'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -7,7 +7,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: 'app-snackbar-sample-2', styleUrls: ['./snackbar-sample-2.component.scss'], templateUrl: './snackbar-sample-2.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxSnackbarComponent, IgxIconComponent] }) export class SnackbarSample2Component { diff --git a/src/app/notifications/snackbar/snackbar-sample-4/snackbar-sample-4.component.ts b/src/app/notifications/snackbar/snackbar-sample-4/snackbar-sample-4.component.ts index f792f4469f..8c6847b0af 100644 --- a/src/app/notifications/snackbar/snackbar-sample-4/snackbar-sample-4.component.ts +++ b/src/app/notifications/snackbar/snackbar-sample-4/snackbar-sample-4.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxSnackbarComponent } from 'igniteui-angular/snackbar'; import { IgxListActionDirective, IgxListComponent, IgxListItemComponent, IgxListLineTitleDirective, IgxListThumbnailDirective } from 'igniteui-angular/list'; import { IgxIconButtonDirective, IgxRippleDirective } from 'igniteui-angular/directives'; @@ -10,7 +10,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: 'app-snackbar-sample-4', styleUrls: ['./snackbar-sample-4.component.scss'], templateUrl: './snackbar-sample-4.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxListComponent, IgxListItemComponent, IgxRippleDirective, IgxAvatarComponent, IgxListThumbnailDirective, IgxListLineTitleDirective, IgxListActionDirective, IgxIconButtonDirective, IgxIconComponent, IgxSnackbarComponent] }) export class SnackbarSample4Component implements OnInit { diff --git a/src/app/notifications/snackbar/snackbar-sample-5/snackbar-sample-5.component.ts b/src/app/notifications/snackbar/snackbar-sample-5/snackbar-sample-5.component.ts index 0e2ad72037..039445559d 100644 --- a/src/app/notifications/snackbar/snackbar-sample-5/snackbar-sample-5.component.ts +++ b/src/app/notifications/snackbar/snackbar-sample-5/snackbar-sample-5.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxButtonDirective } from 'igniteui-angular/directives'; import { IgxSnackbarComponent } from 'igniteui-angular/snackbar'; @@ -6,7 +6,6 @@ import { IgxSnackbarComponent } from 'igniteui-angular/snackbar'; selector: 'app-snackbar-sample-5', styleUrls: ['./snackbar-sample-5.component.scss'], templateUrl: './snackbar-sample-5.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxSnackbarComponent] }) export class SnackbarSample5Component { } diff --git a/src/app/notifications/snackbar/snackbar-style/snackbar-style.component.ts b/src/app/notifications/snackbar/snackbar-style/snackbar-style.component.ts index 5ca01ecb90..dea33c79a2 100644 --- a/src/app/notifications/snackbar/snackbar-style/snackbar-style.component.ts +++ b/src/app/notifications/snackbar/snackbar-style/snackbar-style.component.ts @@ -1,4 +1,4 @@ -import { Component, ElementRef, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ElementRef, inject } from '@angular/core'; import { IgxButtonDirective } from 'igniteui-angular/directives'; import { IgxSnackbarComponent } from 'igniteui-angular/snackbar'; @@ -6,7 +6,6 @@ import { IgxSnackbarComponent } from 'igniteui-angular/snackbar'; selector: 'app-snackbar-style', styleUrls: ['./snackbar-style.component.scss'], templateUrl: './snackbar-style.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxSnackbarComponent] }) export class SnackbarStyleComponent { diff --git a/src/app/notifications/snackbar/snackbar-tailwind-style/snackbar-tailwind-style.component.ts b/src/app/notifications/snackbar/snackbar-tailwind-style/snackbar-tailwind-style.component.ts index 8cc955b602..77fc490856 100644 --- a/src/app/notifications/snackbar/snackbar-tailwind-style/snackbar-tailwind-style.component.ts +++ b/src/app/notifications/snackbar/snackbar-tailwind-style/snackbar-tailwind-style.component.ts @@ -1,4 +1,4 @@ -import { Component, ElementRef, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ElementRef, inject } from '@angular/core'; import { IgxButtonDirective } from 'igniteui-angular/directives'; import { IgxSnackbarComponent } from 'igniteui-angular/snackbar'; @@ -6,7 +6,6 @@ import { IgxSnackbarComponent } from 'igniteui-angular/snackbar'; selector: 'app-snackbar-tailwind-style', styleUrls: ['./snackbar-tailwind-style.component.scss'], templateUrl: './snackbar-tailwind-style.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxSnackbarComponent] }) export class SnackbarTailwindStyleComponent { diff --git a/src/app/notifications/toast/toast-sample-1/toast-sample-1.component.ts b/src/app/notifications/toast/toast-sample-1/toast-sample-1.component.ts index b3cfe5028f..0b561d79af 100644 --- a/src/app/notifications/toast/toast-sample-1/toast-sample-1.component.ts +++ b/src/app/notifications/toast/toast-sample-1/toast-sample-1.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxToastComponent } from 'igniteui-angular/toast'; import { VerticalAlignment } from 'igniteui-angular/core'; import { IgxButtonDirective, IgxRippleDirective } from 'igniteui-angular/directives'; @@ -7,7 +7,6 @@ import { IgxButtonDirective, IgxRippleDirective } from 'igniteui-angular/directi selector: 'app-toast-sample-1', styleUrls: ['./toast-sample-1.component.scss'], templateUrl: './toast-sample-1.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxRippleDirective, IgxToastComponent] }) export class ToastSample1Component { diff --git a/src/app/notifications/toast/toast-sample-2/toast-sample-2.component.ts b/src/app/notifications/toast/toast-sample-2/toast-sample-2.component.ts index f2fb8ce48d..30dd1b0582 100644 --- a/src/app/notifications/toast/toast-sample-2/toast-sample-2.component.ts +++ b/src/app/notifications/toast/toast-sample-2/toast-sample-2.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxButtonDirective } from 'igniteui-angular/directives'; import { IgxToastComponent } from 'igniteui-angular/toast'; @@ -6,7 +6,6 @@ import { IgxToastComponent } from 'igniteui-angular/toast'; selector: 'app-toast-sample-2', styleUrls: ['./toast-sample-2.component.scss'], templateUrl: './toast-sample-2.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxToastComponent] }) diff --git a/src/app/notifications/toast/toast-sample-3/toast-sample-3.component.ts b/src/app/notifications/toast/toast-sample-3/toast-sample-3.component.ts index 2bcff14517..ab144aef71 100644 --- a/src/app/notifications/toast/toast-sample-3/toast-sample-3.component.ts +++ b/src/app/notifications/toast/toast-sample-3/toast-sample-3.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxButtonDirective } from 'igniteui-angular/directives'; import { IgxToastComponent } from 'igniteui-angular/toast'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -7,7 +7,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: 'app-toast-sample-3', styleUrls: ['./toast-sample-3.component.scss'], templateUrl: './toast-sample-3.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxToastComponent, IgxIconComponent] }) diff --git a/src/app/notifications/toast/toast-sample-4/toast-sample-4.component.ts b/src/app/notifications/toast/toast-sample-4/toast-sample-4.component.ts index b15622b7c6..7d547ff4d6 100644 --- a/src/app/notifications/toast/toast-sample-4/toast-sample-4.component.ts +++ b/src/app/notifications/toast/toast-sample-4/toast-sample-4.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxButtonDirective } from 'igniteui-angular/directives'; import { IgxToastComponent } from 'igniteui-angular/toast'; @@ -6,7 +6,6 @@ import { IgxToastComponent } from 'igniteui-angular/toast'; selector: 'app-toast-sample-4', styleUrls: ['./toast-sample-4.component.scss'], templateUrl: './toast-sample-4.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxToastComponent] }) export class ToastSample4Component { } diff --git a/src/app/notifications/toast/toast-sample-5/toast-sample-5.component.ts b/src/app/notifications/toast/toast-sample-5/toast-sample-5.component.ts index 0a7d38f490..8e0aa61222 100644 --- a/src/app/notifications/toast/toast-sample-5/toast-sample-5.component.ts +++ b/src/app/notifications/toast/toast-sample-5/toast-sample-5.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { VerticalAlignment } from 'igniteui-angular/core'; import { IgxButtonDirective } from 'igniteui-angular/directives'; import { IgxToastComponent } from 'igniteui-angular/toast'; @@ -6,7 +6,6 @@ import { IgxToastComponent } from 'igniteui-angular/toast'; selector: 'app-toast-sample-5', styleUrls: ['./toast-sample-5.component.scss'], templateUrl: './toast-sample-5.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxToastComponent] }) diff --git a/src/app/notifications/toast/toast-style/toast-style.component.ts b/src/app/notifications/toast/toast-style/toast-style.component.ts index e0a6a5dfa8..111c5a3c4d 100644 --- a/src/app/notifications/toast/toast-style/toast-style.component.ts +++ b/src/app/notifications/toast/toast-style/toast-style.component.ts @@ -1,4 +1,4 @@ -import { Component, ElementRef, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ElementRef, inject } from '@angular/core'; import { IgxToastComponent } from 'igniteui-angular/toast'; import { VerticalAlignment } from 'igniteui-angular/core'; import { IgxButtonDirective, IgxRippleDirective } from 'igniteui-angular/directives'; @@ -7,7 +7,6 @@ import { IgxButtonDirective, IgxRippleDirective } from 'igniteui-angular/directi selector: 'app-toast-style', styleUrls: ['./toast-style.component.scss'], templateUrl: './toast-style.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxRippleDirective, IgxToastComponent] }) export class ToastStyleComponent { diff --git a/src/app/notifications/toast/toast-tailwind-style/toast-tailwind-style.component.ts b/src/app/notifications/toast/toast-tailwind-style/toast-tailwind-style.component.ts index 9911102eee..2223a9f1d1 100644 --- a/src/app/notifications/toast/toast-tailwind-style/toast-tailwind-style.component.ts +++ b/src/app/notifications/toast/toast-tailwind-style/toast-tailwind-style.component.ts @@ -1,4 +1,4 @@ -import { Component, ElementRef, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ElementRef, inject } from '@angular/core'; import { IgxToastComponent } from 'igniteui-angular/toast'; import { VerticalAlignment } from 'igniteui-angular/core'; import { IgxButtonDirective, IgxRippleDirective } from 'igniteui-angular/directives'; @@ -7,7 +7,6 @@ import { IgxButtonDirective, IgxRippleDirective } from 'igniteui-angular/directi selector: 'app-toast-tailwind-style', styleUrls: ['./toast-tailwind-style.component.scss'], templateUrl: './toast-tailwind-style.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxRippleDirective, IgxToastComponent] }) export class ToastTailwindStyleComponent { diff --git a/src/app/pagination/paginator/pagination-sample.component.ts b/src/app/pagination/paginator/pagination-sample.component.ts index b02f98a1f0..fda7f16b53 100644 --- a/src/app/pagination/paginator/pagination-sample.component.ts +++ b/src/app/pagination/paginator/pagination-sample.component.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, ChangeDetectorRef, Component, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { AfterViewInit, ChangeDetectorRef, Component, ViewChild, inject } from '@angular/core'; import { IgxPaginatorComponent } from 'igniteui-angular/paginator'; import { IgxCardActionsComponent, IgxCardComponent, IgxCardContentDirective, IgxCardHeaderComponent, IgxCardHeaderSubtitleDirective, IgxCardHeaderTitleDirective, IgxCardMediaDirective } from 'igniteui-angular/card'; import { IgxButtonDirective, IgxIconButtonDirective, IgxRippleDirective } from 'igniteui-angular/directives'; @@ -10,7 +10,6 @@ import { CurrencyPipe } from '@angular/common'; selector: 'app-pagination-sample', styleUrls: ['./pagination-sample.component.scss'], templateUrl: './pagination-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxCardComponent, IgxCardMediaDirective, IgxCardHeaderComponent, IgxCardHeaderTitleDirective, IgxCardContentDirective, IgxCardHeaderSubtitleDirective, IgxCardActionsComponent, IgxButtonDirective, IgxRippleDirective, IgxIconButtonDirective, IgxIconComponent, IgxPaginatorComponent, CurrencyPipe] }) export class PaginationSampleComponent implements AfterViewInit { diff --git a/src/app/pivot-grid/pivot-basic-sample/pivot-grid-basic-sample.component.ts b/src/app/pivot-grid/pivot-basic-sample/pivot-grid-basic-sample.component.ts index 48eaecc0c1..63cbb1f66f 100644 --- a/src/app/pivot-grid/pivot-basic-sample/pivot-grid-basic-sample.component.ts +++ b/src/app/pivot-grid/pivot-basic-sample/pivot-grid-basic-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from "@angular/core"; +import { Component } from "@angular/core"; import { DATA } from '../../data/pivot-data'; import { IPivotConfiguration, IgxPivotNumericAggregate } from 'igniteui-angular/grids/core'; @@ -8,7 +8,6 @@ import { IgxPivotGridComponent } from 'igniteui-angular/grids/pivot-grid'; selector: 'app-pivot-grid-basic-sample', styleUrls: ['./pivot-grid-basic-sample.component.scss'], templateUrl: './pivot-grid-basic-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxPivotGridComponent] }) export class PivotGridBasicSampleComponent { @@ -21,7 +20,7 @@ export class PivotGridBasicSampleComponent { memberFunction: (data) => data.Product.Name, enabled: true } - + ], rows: [ { diff --git a/src/app/pivot-grid/pivot-datasource/pivot-data-selector-sample.component.ts b/src/app/pivot-grid/pivot-datasource/pivot-data-selector-sample.component.ts index 2d2e8da2b8..358202d91a 100644 --- a/src/app/pivot-grid/pivot-datasource/pivot-data-selector-sample.component.ts +++ b/src/app/pivot-grid/pivot-datasource/pivot-data-selector-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from "@angular/core"; +import { Component } from "@angular/core"; import { GridColumnDataType } from 'igniteui-angular/core'; import { IPivotConfiguration, IgxPivotDateDimension, IgxPivotNumericAggregate } from 'igniteui-angular/grids/core'; import { IgxPivotDataSelectorComponent, IgxPivotGridComponent } from 'igniteui-angular/grids/pivot-grid'; @@ -7,7 +7,6 @@ import { SALES_DATA_NEW } from '../../data/salesDataNew'; selector: 'app-pivot-data-selector-sample', styleUrls: ['./pivot-data-selector-sample.component.scss'], templateUrl: './pivot-data-selector-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxPivotGridComponent, IgxPivotDataSelectorComponent] }) export class PivotDataSelectorSampleComponent { diff --git a/src/app/pivot-grid/pivot-export/pivot-export.component.ts b/src/app/pivot-grid/pivot-export/pivot-export.component.ts index 39a34b5fae..a949c4eead 100644 --- a/src/app/pivot-grid/pivot-export/pivot-export.component.ts +++ b/src/app/pivot-grid/pivot-export/pivot-export.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, inject, ChangeDetectionStrategy } from "@angular/core"; +import { Component, ViewChild, inject } from "@angular/core"; import { IPivotConfiguration, @@ -46,7 +46,6 @@ export class IgxTotalSaleAggregate { selector: 'app-pivot-export-sample', styleUrls: ['./pivot-export.component.scss'], templateUrl: './pivot-export.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxPivotGridComponent] }) export class PivotExportComponent { diff --git a/src/app/pivot-grid/pivot-features/pivot-features.component.ts b/src/app/pivot-grid/pivot-features/pivot-features.component.ts index 73aec3304b..a5feee54f4 100644 --- a/src/app/pivot-grid/pivot-features/pivot-features.component.ts +++ b/src/app/pivot-grid/pivot-features/pivot-features.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from "@angular/core"; +import { Component } from "@angular/core"; import { IPivotConfiguration, IgxPivotDateDimension, IgxPivotNumericAggregate, PivotAggregation } from 'igniteui-angular/grids/core'; import { FilteringExpressionsTree, FilteringLogic, IgxStringFilteringOperand } from 'igniteui-angular/core'; @@ -36,7 +36,6 @@ export class IgxTotalSaleAggregate { selector: 'app-pivot-features-sample', styleUrls: ['./pivot-features.component.scss'], templateUrl: './pivot-features.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxPivotGridComponent, IgxPivotDataSelectorComponent] }) export class PivotFeaturesComponent { diff --git a/src/app/pivot-grid/pivot-grid-noop-persistence/pivot-grid-noop-persistence-sample.component.ts b/src/app/pivot-grid/pivot-grid-noop-persistence/pivot-grid-noop-persistence-sample.component.ts index 4a5064df07..4f0108ca79 100644 --- a/src/app/pivot-grid/pivot-grid-noop-persistence/pivot-grid-noop-persistence-sample.component.ts +++ b/src/app/pivot-grid/pivot-grid-noop-persistence/pivot-grid-noop-persistence-sample.component.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, Component, ViewChild, inject, ChangeDetectionStrategy } from "@angular/core"; +import { AfterViewInit, Component, ViewChild, inject } from "@angular/core"; import { IGridState, IGridStateOptions, IPivotConfiguration, IgxGridStateDirective, IgxPivotNumericAggregate, NoopPivotDimensionsStrategy } from 'igniteui-angular/grids/core'; import { IgxPivotGridComponent } from 'igniteui-angular/grids/pivot-grid'; import { NoopSortingStrategy } from 'igniteui-angular/core'; @@ -12,7 +12,6 @@ import { take } from 'rxjs/operators'; styleUrls: ['./pivot-grid-noop-persistence-sample.component.scss'], templateUrl: './pivot-grid-noop-persistence-sample.component.html', providers: [PivotDataService], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxIconComponent, IgxPivotGridComponent, IgxGridStateDirective] }) export class PivotGridNoopPersistenceSampleComponent implements AfterViewInit { diff --git a/src/app/pivot-grid/pivot-grid-noop/pivot-grid-noop-sample.component.ts b/src/app/pivot-grid/pivot-grid-noop/pivot-grid-noop-sample.component.ts index 85583e984d..f96ac9a29f 100644 --- a/src/app/pivot-grid/pivot-grid-noop/pivot-grid-noop-sample.component.ts +++ b/src/app/pivot-grid/pivot-grid-noop/pivot-grid-noop-sample.component.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, Component, ViewChild, inject, ChangeDetectionStrategy } from "@angular/core"; +import { AfterViewInit, Component, ViewChild, inject } from "@angular/core"; import { IPivotConfiguration, IgxPivotNumericAggregate, NoopPivotDimensionsStrategy } from 'igniteui-angular/grids/core'; import { IgxPivotGridComponent } from 'igniteui-angular/grids/pivot-grid'; @@ -9,7 +9,6 @@ import { PivotDataService } from "../../services/pivotRemoteData.service"; styleUrls: ['./pivot-grid-noop-sample.component.scss'], templateUrl: './pivot-grid-noop-sample.component.html', providers: [PivotDataService], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxPivotGridComponent] }) export class PivotGridNoopSampleComponent implements AfterViewInit { diff --git a/src/app/pivot-grid/pivot-grid-routes-data.ts b/src/app/pivot-grid/pivot-grid-routes-data.ts index 51e0139d47..6065e07126 100644 --- a/src/app/pivot-grid/pivot-grid-routes-data.ts +++ b/src/app/pivot-grid/pivot-grid-routes-data.ts @@ -6,6 +6,7 @@ export const pivotGridsRoutesData = { 'pivot-grid-export': { displayName: 'Pivot Grid Export', parentName: 'Pivot Grid' }, 'pivot-grid-features': { displayName: 'Pivot Grid With Features', parentName: 'Pivot Grid' }, 'pivot-grid-state-persistence': { displayName: 'Pivot Grid With State Persistence', parentName: 'Pivot Grid' }, + 'pivot-grid-styling': { displayName: 'Pivot Grid Styling', parentName: 'Pivot Grid' }, 'pivot-grid-noop-persistence': { displayName: 'Pivot Noop Grid with State Persistence', parentName: 'Pivot Grid' }, 'pivot-grid-about': { displayName: 'Pivot Grid About', parentName: 'Pivot Grid' }, 'pivot-grid-layout': { displayName: 'Pivot Grid Layout', parentName: 'Pivot Grid' } diff --git a/src/app/pivot-grid/pivot-grids.routes.ts b/src/app/pivot-grid/pivot-grids.routes.ts index 13dfb2b0bc..f40be47cca 100644 --- a/src/app/pivot-grid/pivot-grids.routes.ts +++ b/src/app/pivot-grid/pivot-grids.routes.ts @@ -10,6 +10,7 @@ import { pivotGridsRoutesData } from './pivot-grid-routes-data'; import { PivotGridAboutComponent } from './pivot-state-persistence/about.component'; import { PivotGridStatePersistenceSampleComponent } from './pivot-state-persistence/pivot-grid-state-persistence-sample.component'; import { PivotGridLayoutComponent } from './pivot-layout/pivot-layout.component' +import { PivotStylingComponent } from './pivot-styling/pivot-styling.component'; // tslint:enable:max-line-length export const PivotGridsRoutes: Routes = [ @@ -51,11 +52,16 @@ export const PivotGridsRoutes: Routes = [ { component: PivotGridAboutComponent, data: pivotGridsRoutesData['pivot-grid-about'], - path: 'pivot-state-about' + path: 'pivot-grid-about' }, { component: PivotGridLayoutComponent, data: pivotGridsRoutesData['pivot-grid-features'], path: 'pivot-grid-layout' + }, + { + component: PivotStylingComponent, + data: pivotGridsRoutesData['pivot-grid-styling'], + path: 'pivot-grid-styling' } ]; diff --git a/src/app/pivot-grid/pivot-layout/pivot-layout.component.ts b/src/app/pivot-grid/pivot-layout/pivot-layout.component.ts index 31966ef323..f7a7d0ae33 100644 --- a/src/app/pivot-grid/pivot-layout/pivot-layout.component.ts +++ b/src/app/pivot-grid/pivot-layout/pivot-layout.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from "@angular/core"; +import { Component, ViewChild } from "@angular/core"; import { IPivotConfiguration, IPivotUISettings, IgxPivotDateDimension, IgxPivotNumericAggregate, PivotAggregation, PivotRowLayoutType, PivotSummaryPosition } from 'igniteui-angular/grids/core'; import { FilteringExpressionsTree, FilteringLogic, IgxStringFilteringOperand } from 'igniteui-angular/core'; @@ -38,7 +38,6 @@ export class IgxTotalSaleAggregate { selector: 'app-pivot-layout-sample', styleUrls: ['./pivot-layout.component.scss'], templateUrl: './pivot-layout.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSwitchComponent, IgxPivotGridComponent] }) export class PivotGridLayoutComponent { diff --git a/src/app/pivot-grid/pivot-state-persistence/about.component.ts b/src/app/pivot-grid/pivot-state-persistence/about.component.ts index 505c5e7d3a..670ecf7b4c 100644 --- a/src/app/pivot-grid/pivot-state-persistence/about.component.ts +++ b/src/app/pivot-grid/pivot-state-persistence/about.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxButtonDirective } from 'igniteui-angular/directives'; import { RouterLink } from '@angular/router'; @Component({ selector: 'app-about', templateUrl: './about.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, RouterLink] }) export class PivotGridAboutComponent { diff --git a/src/app/pivot-grid/pivot-state-persistence/pivot-grid-state-persistence-sample.component.ts b/src/app/pivot-grid/pivot-state-persistence/pivot-grid-state-persistence-sample.component.ts index 73984fb080..83a09ac4b6 100644 --- a/src/app/pivot-grid/pivot-state-persistence/pivot-grid-state-persistence-sample.component.ts +++ b/src/app/pivot-grid/pivot-state-persistence/pivot-grid-state-persistence-sample.component.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, Component, OnInit, QueryList, ViewChild, ViewChildren, inject, ChangeDetectionStrategy } from "@angular/core"; +import { AfterViewInit, Component, OnInit, QueryList, ViewChild, ViewChildren, inject } from "@angular/core"; import { NavigationStart, Router, RouterLink } from "@angular/router"; import { GridFeatures, IGridState, IGridStateOptions, IPivotAggregator, IPivotConfiguration, IPivotDimension, IPivotValue, IgxGridStateDirective, IgxPivotDateDimension, IgxPivotNumericAggregate, PivotAggregation } from 'igniteui-angular/grids/core'; @@ -42,7 +42,6 @@ export class IgxTotalSaleAggregate { selector: 'app-pivot-grid-state-persistence-sample', styleUrls: ['./pivot-grid-state-persistence-sample.component.scss'], templateUrl: './pivot-grid-state-persistence-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxIconComponent, RouterLink, IgxCheckboxComponent, IgxPivotGridComponent, IgxGridStateDirective] }) export class PivotGridStatePersistenceSampleComponent implements OnInit, AfterViewInit { diff --git a/src/app/pivot-grid/pivot-styling/layout.scss b/src/app/pivot-grid/pivot-styling/layout.scss new file mode 100644 index 0000000000..5ea6cde808 --- /dev/null +++ b/src/app/pivot-grid/pivot-styling/layout.scss @@ -0,0 +1,4 @@ +:host { + display: block; + padding: 8px; +} \ No newline at end of file diff --git a/src/app/pivot-grid/pivot-styling/pivot-styling.component.html b/src/app/pivot-grid/pivot-styling/pivot-styling.component.html new file mode 100644 index 0000000000..08df70c02f --- /dev/null +++ b/src/app/pivot-grid/pivot-styling/pivot-styling.component.html @@ -0,0 +1,2 @@ + + \ No newline at end of file diff --git a/src/app/pivot-grid/pivot-styling/pivot-styling.component.scss b/src/app/pivot-grid/pivot-styling/pivot-styling.component.scss new file mode 100644 index 0000000000..238acf9733 --- /dev/null +++ b/src/app/pivot-grid/pivot-styling/pivot-styling.component.scss @@ -0,0 +1,16 @@ +@use "layout.scss"; +@use "igniteui-angular/theming" as *; + +$background: #292826; +$foreground: #eeece1; +$accent: #ffcd0f; + +$custom-grid: grid-theme( + $background: $background, + $foreground: $foreground, + $accent-color: $accent, +); + +igx-pivot-grid { + @include tokens($custom-grid); +} diff --git a/src/app/pivot-grid/pivot-styling/pivot-styling.component.ts b/src/app/pivot-grid/pivot-styling/pivot-styling.component.ts new file mode 100644 index 0000000000..b85a70c4fe --- /dev/null +++ b/src/app/pivot-grid/pivot-styling/pivot-styling.component.ts @@ -0,0 +1,45 @@ +import { Component, ChangeDetectionStrategy } from "@angular/core"; +import { DATA } from '../../data/pivot-data'; + +import { IPivotConfiguration, IgxPivotNumericAggregate } from 'igniteui-angular/grids/core'; +import { IgxPivotGridComponent } from 'igniteui-angular/grids/pivot-grid'; + +@Component({ + selector: 'app-pivot-styling', + styleUrls: ['./pivot-styling.component.scss'], + templateUrl: './pivot-styling.component.html', + changeDetection: ChangeDetectionStrategy.Eager, + imports: [IgxPivotGridComponent] +}) + +export class PivotStylingComponent { + public data = DATA; + public pivotConfigHierarchy: IPivotConfiguration = { + columns: [ + { + memberName: 'Product', + memberFunction: (data) => data.Product.Name, + enabled: true + } + ], + rows: [ + { + memberName: 'Seller', + memberFunction: (data) => data.Seller.Name, + enabled: true + } + ], + values: [ + { + member: 'NumberOfUnits', + aggregate: { + aggregator: IgxPivotNumericAggregate.sum, + key: 'sum', + label: 'Sum' + }, + enabled: true + } + ], + filters: null + }; +} diff --git a/src/app/scheduling/calendar/calendar-days-view/calendar-days-view.component.ts b/src/app/scheduling/calendar/calendar-days-view/calendar-days-view.component.ts index 6765fb16b1..f13fe8679c 100644 --- a/src/app/scheduling/calendar/calendar-days-view/calendar-days-view.component.ts +++ b/src/app/scheduling/calendar/calendar-days-view/calendar-days-view.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxCardComponent, IgxCardContentDirective, IgxCardHeaderComponent } from 'igniteui-angular/card'; import { IgxDaysViewComponent } from 'igniteui-angular/calendar'; @@ -6,7 +6,6 @@ import { IgxDaysViewComponent } from 'igniteui-angular/calendar'; selector: 'app-calendar-views', styleUrls: ['./calendar-days-view.component.scss'], templateUrl: './calendar-days-view.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxCardComponent, IgxCardHeaderComponent, IgxCardContentDirective, IgxDaysViewComponent] }) export class CalendarDaysViewComponent { } diff --git a/src/app/scheduling/calendar/calendar-months-view/calendar-months-view.component.ts b/src/app/scheduling/calendar/calendar-months-view/calendar-months-view.component.ts index e141ac1a4d..100fdd8c31 100644 --- a/src/app/scheduling/calendar/calendar-months-view/calendar-months-view.component.ts +++ b/src/app/scheduling/calendar/calendar-months-view/calendar-months-view.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxCardComponent, IgxCardContentDirective, IgxCardHeaderComponent } from 'igniteui-angular/card'; import { IgxMonthsViewComponent } from 'igniteui-angular/calendar'; @@ -6,7 +6,6 @@ import { IgxMonthsViewComponent } from 'igniteui-angular/calendar'; selector: 'app-calendar-views', styleUrls: ['./calendar-months-view.component.scss'], templateUrl: './calendar-months-view.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxCardComponent, IgxCardHeaderComponent, IgxCardContentDirective, IgxMonthsViewComponent] }) export class CalendarMonthsViewComponent { } diff --git a/src/app/scheduling/calendar/calendar-rtl-sample/calendar-rtl-sample.component.ts b/src/app/scheduling/calendar/calendar-rtl-sample/calendar-rtl-sample.component.ts index 5cea2f5c33..0afe40d532 100644 --- a/src/app/scheduling/calendar/calendar-rtl-sample/calendar-rtl-sample.component.ts +++ b/src/app/scheduling/calendar/calendar-rtl-sample/calendar-rtl-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { IgxCalendarComponent } from 'igniteui-angular/calendar'; import { IgxButtonDirective } from 'igniteui-angular/directives'; @@ -6,7 +6,6 @@ import { IgxButtonDirective } from 'igniteui-angular/directives'; selector: 'app-calendar', styleUrls: ['./calendar-rtl-sample.component.scss'], templateUrl: './calendar-rtl-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxCalendarComponent] }) export class CalendarRtlSampleComponent { diff --git a/src/app/scheduling/calendar/calendar-sample-1/calendar-sample-1.component.ts b/src/app/scheduling/calendar/calendar-sample-1/calendar-sample-1.component.ts index b9e66ca1f1..4a54c443b2 100644 --- a/src/app/scheduling/calendar/calendar-sample-1/calendar-sample-1.component.ts +++ b/src/app/scheduling/calendar/calendar-sample-1/calendar-sample-1.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxCalendarComponent } from 'igniteui-angular/calendar'; @Component({ selector: 'app-calendar', styleUrls: ['./calendar-sample-1.component.scss'], templateUrl: './calendar-sample-1.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxCalendarComponent] }) export class CalendarSample1Component { } diff --git a/src/app/scheduling/calendar/calendar-sample-2/calendar-sample-2.component.ts b/src/app/scheduling/calendar/calendar-sample-2/calendar-sample-2.component.ts index f50b9dbfba..b50aaf556b 100644 --- a/src/app/scheduling/calendar/calendar-sample-2/calendar-sample-2.component.ts +++ b/src/app/scheduling/calendar/calendar-sample-2/calendar-sample-2.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxCalendarComponent } from 'igniteui-angular/calendar'; import { IgxSelectComponent, IgxSelectItemComponent } from 'igniteui-angular/select'; import { IgxPrefixDirective } from 'igniteui-angular/input-group'; @@ -13,7 +13,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-calendar', styleUrls: ['./calendar-sample-2.component.scss'], templateUrl: './calendar-sample-2.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSelectComponent, FormsModule, IgxPrefixDirective, IgxSelectItemComponent, IgxCalendarComponent] }) export class CalendarSample2Component implements OnInit{ diff --git a/src/app/scheduling/calendar/calendar-sample-3/calendar-sample-3.component.ts b/src/app/scheduling/calendar/calendar-sample-3/calendar-sample-3.component.ts index 1973e8bfad..aa0e91b993 100644 --- a/src/app/scheduling/calendar/calendar-sample-3/calendar-sample-3.component.ts +++ b/src/app/scheduling/calendar/calendar-sample-3/calendar-sample-3.component.ts @@ -1,5 +1,5 @@ -import { Component, ViewChild, DOCUMENT, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild, DOCUMENT, inject } from '@angular/core'; import { IViewDateChangeEventArgs, IgxCalendarComponent, IgxCalendarView } from 'igniteui-angular/calendar'; import { IgxDialogComponent } from 'igniteui-angular/dialog'; @@ -7,7 +7,6 @@ import { IgxDialogComponent } from 'igniteui-angular/dialog'; selector: 'app-calendar', styleUrls: ['./calendar-sample-3.component.scss'], templateUrl: './calendar-sample-3.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxCalendarComponent] }) export class CalendarSample3Component { diff --git a/src/app/scheduling/calendar/calendar-sample-4/calendar-sample-4.component.ts b/src/app/scheduling/calendar/calendar-sample-4/calendar-sample-4.component.ts index 5a565a0b9b..c768f94db3 100644 --- a/src/app/scheduling/calendar/calendar-sample-4/calendar-sample-4.component.ts +++ b/src/app/scheduling/calendar/calendar-sample-4/calendar-sample-4.component.ts @@ -1,4 +1,4 @@ -import { Component, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, inject } from '@angular/core'; import { DateParser } from '../../../date-parser'; import { IgxCalendarComponent, IgxCalendarHeaderTemplateDirective, IgxCalendarSubheaderTemplateDirective } from 'igniteui-angular/calendar'; import { TitleCasePipe } from '@angular/common'; @@ -8,7 +8,6 @@ import { TitleCasePipe } from '@angular/common'; selector: 'app-calendar', styleUrls: ['./calendar-sample-4.component.scss'], templateUrl: './calendar-sample-4.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxCalendarComponent, IgxCalendarHeaderTemplateDirective, IgxCalendarSubheaderTemplateDirective, TitleCasePipe] }) diff --git a/src/app/scheduling/calendar/calendar-sample-5/calendar-sample-5.component.ts b/src/app/scheduling/calendar/calendar-sample-5/calendar-sample-5.component.ts index 2c0382a37e..5151c674e6 100644 --- a/src/app/scheduling/calendar/calendar-sample-5/calendar-sample-5.component.ts +++ b/src/app/scheduling/calendar/calendar-sample-5/calendar-sample-5.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxCalendarComponent } from 'igniteui-angular/calendar'; @Component({ selector: 'app-calendar', styleUrls: ['./calendar-sample-5.component.scss'], templateUrl: './calendar-sample-5.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxCalendarComponent] }) export class CalendarSample5Component { } diff --git a/src/app/scheduling/calendar/calendar-sample-6/calendar-sample-6.component.ts b/src/app/scheduling/calendar/calendar-sample-6/calendar-sample-6.component.ts index de923c2e64..f34ce362f0 100644 --- a/src/app/scheduling/calendar/calendar-sample-6/calendar-sample-6.component.ts +++ b/src/app/scheduling/calendar/calendar-sample-6/calendar-sample-6.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { DateRangeType } from 'igniteui-angular/core'; import { IgxCalendarComponent } from 'igniteui-angular/calendar'; import { DatePipe } from '@angular/common'; @@ -7,7 +7,6 @@ import { DatePipe } from '@angular/common'; selector: 'app-calendar', styleUrls: ['./calendar-sample-6.component.scss'], templateUrl: './calendar-sample-6.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxCalendarComponent, DatePipe] }) export class CalendarSample6Component implements OnInit{ diff --git a/src/app/scheduling/calendar/calendar-sample-7/calendar-sample-7.component.ts b/src/app/scheduling/calendar/calendar-sample-7/calendar-sample-7.component.ts index e00c112f4a..73051b3823 100644 --- a/src/app/scheduling/calendar/calendar-sample-7/calendar-sample-7.component.ts +++ b/src/app/scheduling/calendar/calendar-sample-7/calendar-sample-7.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { DateRangeType } from 'igniteui-angular/core'; import { IgxCalendarComponent } from 'igniteui-angular/calendar'; import { IgxDialogComponent } from 'igniteui-angular/dialog'; @@ -8,7 +8,6 @@ import { IgxButtonDirective } from 'igniteui-angular/directives'; selector: 'app-calendar', styleUrls: ['./calendar-sample-7.component.scss'], templateUrl: './calendar-sample-7.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxCalendarComponent, IgxDialogComponent, IgxButtonDirective] }) export class CalendarSample7Component { diff --git a/src/app/scheduling/calendar/calendar-sample-8/calendar-sample-8.component.ts b/src/app/scheduling/calendar/calendar-sample-8/calendar-sample-8.component.ts index 6f34dc692b..6f71d19aa9 100644 --- a/src/app/scheduling/calendar/calendar-sample-8/calendar-sample-8.component.ts +++ b/src/app/scheduling/calendar/calendar-sample-8/calendar-sample-8.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxCalendarComponent } from 'igniteui-angular/calendar'; @Component({ selector: 'app-calendar', styleUrls: ['./calendar-sample-8.component.scss'], templateUrl: './calendar-sample-8.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxCalendarComponent] }) export class CalendarSample8Component { } diff --git a/src/app/scheduling/calendar/calendar-sample-9/calendar-sample-9.component.ts b/src/app/scheduling/calendar/calendar-sample-9/calendar-sample-9.component.ts index 52e88e9d76..7e2cf60ab0 100644 --- a/src/app/scheduling/calendar/calendar-sample-9/calendar-sample-9.component.ts +++ b/src/app/scheduling/calendar/calendar-sample-9/calendar-sample-9.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { IgxButtonGroupComponent } from 'igniteui-angular/button-group'; import { IgxCalendarComponent } from 'igniteui-angular/calendar'; import { IgxButtonDirective } from 'igniteui-angular/directives'; @@ -11,7 +11,6 @@ type Orientation = (typeof orientations)[number]; selector: 'app-calendar', styleUrls: ['./calendar-sample-9.component.scss'], templateUrl: './calendar-sample-9.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxCalendarComponent, IgxButtonGroupComponent, IgxButtonDirective] }) diff --git a/src/app/scheduling/calendar/calendar-styling-sample/calendar-styling-sample.component.html b/src/app/scheduling/calendar/calendar-styling-sample/calendar-styling-sample.component.html index afc5c45d12..4726ef89dc 100644 --- a/src/app/scheduling/calendar/calendar-styling-sample/calendar-styling-sample.component.html +++ b/src/app/scheduling/calendar/calendar-styling-sample/calendar-styling-sample.component.html @@ -1,4 +1,4 @@
- -
\ No newline at end of file + diff --git a/src/app/scheduling/calendar/calendar-styling-sample/calendar-styling-sample.component.scss b/src/app/scheduling/calendar/calendar-styling-sample/calendar-styling-sample.component.scss index eda8537f3b..c4867019f7 100644 --- a/src/app/scheduling/calendar/calendar-styling-sample/calendar-styling-sample.component.scss +++ b/src/app/scheduling/calendar/calendar-styling-sample/calendar-styling-sample.component.scss @@ -1,170 +1,14 @@ -@use "layout.scss"; -@use "igniteui-angular/theming" as *; +@use 'igniteui-angular/theming' as *; -// CSS variables approach +$custom-calendar-theme: calendar-theme( + $header-background: #ecaa53, + $content-background: #011627, +); :host { - ::ng-deep { - .igx-days-view__date--weekend:not(.igx-days-view__date--inactive) { - --date-hover-background: var(--background-hover); - --date-selected-foreground: var(--primary); - --date-selected-background: #FFF; - --date-selected-border-color: var(--primary); - --date-selected-focus-foreground: var(--primary); - --date-selected-focus-background: var(--background-hover); - --date-selected-focus-border-color: var(--primary); - --date-selected-hover-foreground: var(--primary); - --date-selected-hover-background: var(--background-hover); - --date-selected-hover-border-color: var(--primary); - --date-selected-current-hover-background: var(--background-hover); - --date-selected-current-focus-background: var(--background-hover); - --date-selected-current-background: #FFF; - --date-selected-current-border-color: var(--primary); - --date-selected-current-hover-border-color: var(--primary); - --date-current-hover-background: var(--background-hover); - } - } -} + display: grid; + place-items: center; + height: 100%; -igx-calendar { - --date-focus-background: transparent; - --week-number-background: transparent; - --weekend-color: #131E29; - --weekday-color: #556B82; - --week-number-foreground: #556B82; - --inactive-color: #556B82; - --date-current-border-color: var(--current-border); - --date-current-hover-border-color: var(--current-border); - --date-current-focus-border-color: var(--current-border); - --date-current-hover-background: var(--background-weekend); - --date-selected-current-border-color: var(--current-border); - --date-selected-current-background: #FFF; - --date-selected-current-foreground: var(--primary); - --date-selected-current-focus-border-color: var(--current-border); - --date-selected-current-focus-background: var(--background-weekend); - --date-selected-current-focus-foreground: var(--primary); - --date-selected-current-hover-border-color: var(--current-border); - --date-selected-current-hover-background: var(--background-weekend); - --date-selected-current-hover-foreground: var(--primary); - --date-selected-foreground: var(--primary); - --date-selected-background: #FFF; - --date-selected-border-color: var(--primary); - --date-selected-hover-foreground: var(--primary); - --date-selected-hover-background: var(--background-weekend); - --date-selected-hover-border-color: var(--primary); - --date-selected-focus-foreground: var(--primary); - --date-selected-focus-background: var(--background-weekend); - --date-selected-focus-border-color: var(--primary); - --picker-foreground: var(--primary); - --picker-hover-foreground: var(--primary); - --picker-focus-foreground: var(--primary); - --ym-hover-background: var(--background); - --ym-selected-background: #EDF5FF; - --ym-selected-hover-background: #D9EAFF; - --ym-selected-hover-foreground: var(--primary); - --ym-selected-outline-color: var(--primary); - --ym-selected-hover-outline-color: var(--primary); - --ym-selected-focus-outline-color: var(--primary); - --ym-selected-focus-background: #D9EAFF; - --ym-current-foreground: var(--primary); - --ym-current-background: transparent; - --ym-current-outline-color: transparent; - --ym-current-hover-foreground: var(--primary); - --ym-current-hover-background: var(--background); - --ym-current-outline-hover-color: var(--primary); - --ym-selected-current-foreground: var(--primary); - --ym-selected-current-background: #EDF5FF; - --ym-selected-current-outline-color: var(--primary); - --ym-selected-current-hover-foreground: var(--primary); - --ym-selected-current-hover-background: #D9EAFF; - --ym-selected-current-outline-hover-color: var(--primary); - --ym-selected-current-outline-focus-color: var(--primary); + @include tokens($custom-calendar-theme); } - -// Sass theme approach - -// $custom-calendar-theme-weekend: calendar-theme( -// $date-hover-background: var(--background-hover), -// $date-selected-foreground: var(--primary), -// $date-selected-background: #FFF, -// $date-selected-border-color: var(--primary), -// $date-selected-focus-foreground: var(--primary), -// $date-selected-focus-background: var(--background-hover), -// $date-selected-focus-border-color: var(--primary), -// $date-selected-hover-foreground: var(--primary), -// $date-selected-hover-background: var(--background-hover), -// $date-selected-hover-border-color: var(--primary), -// $date-selected-current-hover-background: var(--background-hover), -// $date-selected-current-focus-background: var(--background-hover), -// $date-selected-current-background: #FFF, -// $date-selected-current-border-color: var(--primary), -// $date-selected-current-hover-border-color: var(--primary), -// $date-current-hover-background: var(--background-hover) -// ); - -// $custom-calendar-theme: calendar-theme( -// $date-focus-background: transparent, -// $picker-foreground: var(--primary), -// $picker-hover-foreground: var(--primary), -// $picker-focus-foreground: var(--primary), -// $weekday-color: #556B82, -// $weekend-color: #131E29, -// $inactive-color: #556B82, -// $week-number-foreground: #556B82, -// $week-number-background: transparent, -// $ym-selected-current-hover-foreground: var(--primary), -// $ym-selected-current-hover-background: #D9EAFF, -// $ym-hover-background: var(--background), -// $ym-current-foreground: var(--primary), -// $ym-current-background: transparent, -// $ym-current-hover-foreground: var(--primary), -// $ym-current-hover-background: var(--background), -// $ym-selected-current-foreground: var(--primary), -// $ym-selected-current-background: #EDF5FF, -// $ym-selected-background: #EDF5FF, -// $ym-selected-hover-foreground: var(--primary), -// $ym-selected-hover-background: #D9EAFF, -// $ym-current-outline-color: transparent, -// $ym-current-outline-hover-color: var(--primary), -// $ym-selected-outline-color: var(--primary), -// $ym-selected-hover-outline-color: var(--primary), -// $ym-selected-focus-outline-color: var(--primary), -// $ym-selected-current-outline-color: var(--primary), -// $ym-selected-current-outline-hover-color: var(--primary), -// $ym-selected-current-outline-focus-color: var(--primary), -// $date-selected-current-foreground: var(--primary), -// $date-selected-current-background: #FFF, -// $date-selected-current-hover-foreground: var(--primary), -// $date-selected-current-hover-background: var(--background-weekend), -// $date-selected-current-focus-foreground: var(--primary), -// $date-selected-current-focus-background: var(--background-weekend), -// $date-selected-foreground: var(--primary), -// $date-selected-background: #FFF, -// $date-selected-border-color: var(--primary), -// $date-selected-hover-foreground: var(--primary), -// $date-selected-hover-background: var(--background-weekend), -// $date-selected-hover-border-color: var(--primary), -// $date-selected-focus-foreground: var(--primary), -// $date-selected-focus-background: var(--background-weekend), -// $date-selected-focus-border-color: var(--primary), -// $date-current-border-color: var(--current-border), -// $date-current-hover-border-color: var(--current-border), -// $date-current-focus-border-color: var(--current-border), -// $date-selected-current-border-color: var(--current-border), -// $date-selected-current-hover-border-color: var(--current-border), -// $date-selected-current-focus-border-color: var(--current-border), -// $date-current-hover-background: var(--background-weekend), -// $border-radius: rem(8px) -// ); - -// :host { -// ::ng-deep { -// .igx-days-view__date--weekend:not(.igx-days-view__date--inactive) { -// @include tokens($custom-calendar-theme-weekend); -// } -// } -// } - -// igx-calendar { -// @include tokens($custom-calendar-theme); -// } diff --git a/src/app/scheduling/calendar/calendar-styling-sample/calendar-styling-sample.component.ts b/src/app/scheduling/calendar/calendar-styling-sample/calendar-styling-sample.component.ts index a7c240f631..5aa6d4352e 100644 --- a/src/app/scheduling/calendar/calendar-styling-sample/calendar-styling-sample.component.ts +++ b/src/app/scheduling/calendar/calendar-styling-sample/calendar-styling-sample.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxCalendarComponent } from 'igniteui-angular/calendar'; @Component({ selector: 'app-calendar', styleUrls: ['./calendar-styling-sample.component.scss'], templateUrl: './calendar-styling-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxCalendarComponent] }) export class CalendarStylingSampleComponent { } diff --git a/src/app/scheduling/calendar/calendar-styling-sample/layout.scss b/src/app/scheduling/calendar/calendar-styling-sample/layout.scss deleted file mode 100644 index bd4d37889b..0000000000 --- a/src/app/scheduling/calendar/calendar-styling-sample/layout.scss +++ /dev/null @@ -1,135 +0,0 @@ -@use "igniteui-angular/theming" as *; - -:host { - ::ng-deep { - - // Note: This is not the standard approach for styling the component. - // We're using it here solely to mirror the UI5 sample. - - [title="Week"] .igx-days-view__label.igx-days-view__label--week-number { - opacity: 0; - } - - igx-icon { - --color: var(--primary); - --size: #{rem(20px)}; - } - - .igx-calendar-view__item-inner { - color: var(--primary) - } - - .igx-days-view__date--selected span { - font-weight: 700; - } - - .igx-days-view__date--current span { - border-width: rem(2px); - } - - .igx-days-view__date--weekend:not(.igx-days-view__date--inactive):not(.igx-days-view__date--selected) span:not(:hover) { - background: var(--background-weekend); - } - - .igx-days-view__date--active ::after { - border: rem(2px) solid #0032A5; - width: rem(20px); - height: rem(20px); - border-radius: rem(3px); - left: rem(3px); - } - - .igx-days-view__date--active.igx-days-view__date--current :after { - left: rem(2px); - } - - .igx-calendar-view__item:not(.igx-calendar-view__item--selected) .igx-calendar-view__item-inner:hover { - box-shadow: inset 0 0 0 rem(1px) #BCC3CA; - } - - .igx-calendar-view { - padding: 1rem rem(6px); - } - - .igx-calendar-picker__prev { - position: absolute; - } - - .igx-calendar-picker__next { - position: absolute; - right: 0; - } - - .igx-calendar-picker__nav { - position: relative; - left: 0; - bottom: rem(27px); - } - - .igx-calendar-picker__next:hover, - .igx-calendar-picker__prev:hover { - background-color: var(--background); - border-radius: rem(8px); - box-shadow: inset 0 0 0 rem(1px) #BCC3CA; - } - - .igx-calendar-picker__next, - .igx-calendar-picker__prev { - padding: rem(6px); - } - - .igx-calendar-picker { - display: unset; - } - - .igx-calendar-picker__dates { - justify-content: center; - position: relative; - top: rem(4px); - gap: 1rem; - height: 2rem; - - span:not(.igx-calendar__aria-off-screen) { - font-size: rem(14px); - padding: rem(4px) rem(10px); - - &:hover { - background-color: var(--background); - border-radius: rem(8px); - box-shadow: inset 0 0 0 rem(1px) #BCC3CA; - } - } - } - - .igx-calendar__pickers--days { - height: rem(24px); - } - - .igx-calendar-picker { - padding-inline: 1rem; - } - } -} - -.calendar-wrapper { - max-width: rem(600px); - margin: rem(8px); -} - -igx-calendar { - --current-border: #A100C2; - --primary: #0064D9; - --background: #EAECEE; - --background-weekend: #E8E8E8; - --background-hover: #F5F6F8; - - width: rem(290px); - min-height: rem(282px); - box-sizing: border-box; - padding-top: rem(6px); - box-shadow: elevation(4); - --ig-font-family: Arial, sans-serif; - --ig-subtitle-1-font-weight: 600; - --ig-size: 1; - --ig-radius-factor: 0.4; -} \ No newline at end of file diff --git a/src/app/scheduling/calendar/calendar-tailwind-styling-sample/calendar-tailwind-styling-sample.component.ts b/src/app/scheduling/calendar/calendar-tailwind-styling-sample/calendar-tailwind-styling-sample.component.ts index 73080fdf68..4d1f50c86d 100644 --- a/src/app/scheduling/calendar/calendar-tailwind-styling-sample/calendar-tailwind-styling-sample.component.ts +++ b/src/app/scheduling/calendar/calendar-tailwind-styling-sample/calendar-tailwind-styling-sample.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxCalendarComponent } from 'igniteui-angular/calendar'; @Component({ selector: 'app-calendar-tailwind-styling', styleUrls: ['./calendar-tailwind-styling-sample.component.scss'], templateUrl: './calendar-tailwind-styling-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxCalendarComponent] }) export class CalendarTailwindStylingSampleComponent { } diff --git a/src/app/scheduling/calendar/calendar-years-view/calendar-years-view.component.ts b/src/app/scheduling/calendar/calendar-years-view/calendar-years-view.component.ts index 755fc84cd8..0ba2660fa4 100644 --- a/src/app/scheduling/calendar/calendar-years-view/calendar-years-view.component.ts +++ b/src/app/scheduling/calendar/calendar-years-view/calendar-years-view.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxCardComponent, IgxCardContentDirective, IgxCardHeaderComponent } from 'igniteui-angular/card'; import { IgxYearsViewComponent } from 'igniteui-angular/calendar'; @@ -6,7 +6,6 @@ import { IgxYearsViewComponent } from 'igniteui-angular/calendar'; selector: 'app-calendar-views', styleUrls: ['./calendar-years-view.component.scss'], templateUrl: './calendar-years-view.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxCardComponent, IgxCardHeaderComponent, IgxCardContentDirective, IgxYearsViewComponent] }) export class CalendarYearsViewComponent { } diff --git a/src/app/scheduling/calendar/multiview/multiview.component.ts b/src/app/scheduling/calendar/multiview/multiview.component.ts index 370479092b..de14b8fa46 100644 --- a/src/app/scheduling/calendar/multiview/multiview.component.ts +++ b/src/app/scheduling/calendar/multiview/multiview.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { IgxCalendarComponent } from 'igniteui-angular/calendar'; import { IgxDialogComponent } from 'igniteui-angular/dialog'; import { IgxButtonDirective } from 'igniteui-angular/directives'; @@ -8,7 +8,6 @@ import { IgxButtonDirective } from 'igniteui-angular/directives'; selector: 'app-calendar', styleUrls: ['./multiview.component.scss'], templateUrl: './multiview.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxCalendarComponent, IgxDialogComponent, IgxButtonDirective] }) export class CalendarMultiViewComponent { diff --git a/src/app/scheduling/datepicker/datepicker-dropdown/datepicker-dropdown.component.ts b/src/app/scheduling/datepicker/datepicker-dropdown/datepicker-dropdown.component.ts index 2bfd600255..6bb8239b07 100644 --- a/src/app/scheduling/datepicker/datepicker-dropdown/datepicker-dropdown.component.ts +++ b/src/app/scheduling/datepicker/datepicker-dropdown/datepicker-dropdown.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxDatePickerComponent } from 'igniteui-angular/date-picker'; import { IgxLabelDirective } from 'igniteui-angular/input-group'; import { FormsModule } from '@angular/forms'; @@ -8,7 +8,6 @@ import { DatePipe } from '@angular/common'; selector: 'app-datepicker-dropdown', styleUrls: ['./datepicker-dropdown.component.scss'], templateUrl: './datepicker-dropdown.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxDatePickerComponent, FormsModule, IgxLabelDirective, DatePipe] }) export class DatepickerDropdownComponent { diff --git a/src/app/scheduling/datepicker/datepicker-sample-1/datepicker-sample-1.component.ts b/src/app/scheduling/datepicker/datepicker-sample-1/datepicker-sample-1.component.ts index 706a880f4e..f535e25cf7 100644 --- a/src/app/scheduling/datepicker/datepicker-sample-1/datepicker-sample-1.component.ts +++ b/src/app/scheduling/datepicker/datepicker-sample-1/datepicker-sample-1.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxDatePickerComponent } from 'igniteui-angular/date-picker'; import { IgxLabelDirective } from 'igniteui-angular/input-group'; import { FormsModule } from '@angular/forms'; @@ -7,7 +7,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-datepicker-sample-1', styleUrls: ['./datepicker-sample-1.component.scss'], templateUrl: './datepicker-sample-1.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxDatePickerComponent, FormsModule, IgxLabelDirective] }) export class DatepickerSample1Component { diff --git a/src/app/scheduling/datepicker/datepicker-sample-2/datepicker-sample-2.component.ts b/src/app/scheduling/datepicker/datepicker-sample-2/datepicker-sample-2.component.ts index 072d3e5a6b..2b2e1c3e9b 100644 --- a/src/app/scheduling/datepicker/datepicker-sample-2/datepicker-sample-2.component.ts +++ b/src/app/scheduling/datepicker/datepicker-sample-2/datepicker-sample-2.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxDatePickerComponent } from 'igniteui-angular/date-picker'; import { IgxLabelDirective } from 'igniteui-angular/input-group'; @@ -6,7 +6,6 @@ import { IgxLabelDirective } from 'igniteui-angular/input-group'; selector: 'app-datepicker-sample-2', styleUrls: ['./datepicker-sample-2.component.scss'], templateUrl: './datepicker-sample-2.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxDatePickerComponent, IgxLabelDirective] }) export class DatepickerSample2Component { diff --git a/src/app/scheduling/datepicker/datepicker-sample-3/datepicker-sample-3.component.ts b/src/app/scheduling/datepicker/datepicker-sample-3/datepicker-sample-3.component.ts index 83b9ccac25..75444ac23e 100644 --- a/src/app/scheduling/datepicker/datepicker-sample-3/datepicker-sample-3.component.ts +++ b/src/app/scheduling/datepicker/datepicker-sample-3/datepicker-sample-3.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxDatePickerComponent } from 'igniteui-angular/date-picker'; import { FormsModule } from '@angular/forms'; @@ -6,7 +6,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-datepicker-sample-3', styleUrls: ['./datepicker-sample-3.component.scss'], templateUrl: './datepicker-sample-3.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxDatePickerComponent, FormsModule] }) export class DatepickerSample3Component { diff --git a/src/app/scheduling/datepicker/datepicker-sample-4/datepicker-sample-4.component.ts b/src/app/scheduling/datepicker/datepicker-sample-4/datepicker-sample-4.component.ts index 3f1d9c41ff..44ecb0623f 100644 --- a/src/app/scheduling/datepicker/datepicker-sample-4/datepicker-sample-4.component.ts +++ b/src/app/scheduling/datepicker/datepicker-sample-4/datepicker-sample-4.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxDatePickerComponent } from 'igniteui-angular/date-picker'; import { IgxLabelDirective } from 'igniteui-angular/input-group'; @@ -6,7 +6,6 @@ import { IgxLabelDirective } from 'igniteui-angular/input-group'; selector: 'app-datepicker-sample-4', styleUrls: ['./datepicker-sample-4.component.scss'], templateUrl: './datepicker-sample-4.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxDatePickerComponent, IgxLabelDirective] }) export class DatepickerSample4Component { diff --git a/src/app/scheduling/datepicker/datepicker-sample-5/datepicker-sample-5.component.ts b/src/app/scheduling/datepicker/datepicker-sample-5/datepicker-sample-5.component.ts index 81afad8e1b..9a65e86b18 100644 --- a/src/app/scheduling/datepicker/datepicker-sample-5/datepicker-sample-5.component.ts +++ b/src/app/scheduling/datepicker/datepicker-sample-5/datepicker-sample-5.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, inject } from '@angular/core'; import { DateParser } from '../../../date-parser'; import { IgxDatePickerComponent } from 'igniteui-angular/date-picker'; import { IgxLabelDirective } from 'igniteui-angular/input-group'; @@ -10,7 +10,6 @@ import { TitleCasePipe } from '@angular/common'; selector: 'app-datepicker-sample-5', styleUrls: ['./datepicker-sample-5.component.scss'], templateUrl: './datepicker-sample-5.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxDatePickerComponent, IgxLabelDirective, IgxCalendarHeaderTemplateDirective, IgxCalendarSubheaderTemplateDirective, TitleCasePipe] }) export class DatepickerSample5Component implements OnInit { diff --git a/src/app/scheduling/datepicker/datepicker-sample-6/datepicker-sample-6.component.ts b/src/app/scheduling/datepicker/datepicker-sample-6/datepicker-sample-6.component.ts index ec1ef8f94f..5465637e99 100644 --- a/src/app/scheduling/datepicker/datepicker-sample-6/datepicker-sample-6.component.ts +++ b/src/app/scheduling/datepicker/datepicker-sample-6/datepicker-sample-6.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxDatePickerComponent } from 'igniteui-angular/date-picker'; import { IgxLabelDirective, IgxPrefixDirective } from 'igniteui-angular/input-group'; import { IgxPickerToggleComponent } from 'igniteui-angular/core'; @@ -8,7 +8,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: 'app-datepicker-sample-6', styleUrls: ['./datepicker-sample-6.component.scss'], templateUrl: './datepicker-sample-6.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxDatePickerComponent, IgxLabelDirective, IgxPickerToggleComponent, IgxPrefixDirective, IgxIconComponent] }) export class DatepickerSample6Component { diff --git a/src/app/scheduling/datepicker/datepicker-sample-7/datepicker-sample-7.component.ts b/src/app/scheduling/datepicker/datepicker-sample-7/datepicker-sample-7.component.ts index d6df39a665..252837c45d 100644 --- a/src/app/scheduling/datepicker/datepicker-sample-7/datepicker-sample-7.component.ts +++ b/src/app/scheduling/datepicker/datepicker-sample-7/datepicker-sample-7.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { IgxDatePickerComponent } from 'igniteui-angular/date-picker'; import { IgxSnackbarComponent } from 'igniteui-angular/snackbar'; import { IgxLabelDirective, IgxSuffixDirective } from 'igniteui-angular/input-group'; @@ -10,7 +10,6 @@ import { DatePipe } from '@angular/common'; selector: 'app-datepicker-sample-7', styleUrls: ['./datepicker-sample-7.component.scss'], templateUrl: './datepicker-sample-7.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxDatePickerComponent, IgxLabelDirective, IgxPickerToggleComponent, IgxSuffixDirective, IgxIconComponent, IgxSnackbarComponent, DatePipe] }) diff --git a/src/app/scheduling/datepicker/datepicker-sample-8/datepicker-sample-8.component.ts b/src/app/scheduling/datepicker/datepicker-sample-8/datepicker-sample-8.component.ts index a372d29709..0e0d3323f5 100644 --- a/src/app/scheduling/datepicker/datepicker-sample-8/datepicker-sample-8.component.ts +++ b/src/app/scheduling/datepicker/datepicker-sample-8/datepicker-sample-8.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxCalendarComponent, IgxCalendarView } from 'igniteui-angular/calendar'; import { IgxDatePickerComponent } from 'igniteui-angular/date-picker'; import { IgxLabelDirective } from 'igniteui-angular/input-group'; @@ -9,7 +9,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-datepicker-sample-8', styleUrls: ['./datepicker-sample-8.component.scss'], templateUrl: './datepicker-sample-8.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxDatePickerComponent, FormsModule, IgxLabelDirective, IgxButtonDirective] }) diff --git a/src/app/scheduling/datepicker/datepicker-sample-9/datepicker-sample-9.component.ts b/src/app/scheduling/datepicker/datepicker-sample-9/datepicker-sample-9.component.ts index ceeda6ce3c..df81e070cc 100644 --- a/src/app/scheduling/datepicker/datepicker-sample-9/datepicker-sample-9.component.ts +++ b/src/app/scheduling/datepicker/datepicker-sample-9/datepicker-sample-9.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, Pipe, PipeTransform, ViewChild, forwardRef, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, Pipe, PipeTransform, ViewChild, forwardRef } from '@angular/core'; import { IgxCalendarComponent } from 'igniteui-angular/calendar'; import { IgxAutocompleteDirective, IgxDropDownComponent, IgxDropDownItemComponent, IgxDropDownItemNavigationDirective } from 'igniteui-angular/drop-down'; import { IgxInputDirective, IgxInputGroupComponent, IgxLabelDirective, IgxPrefixDirective, IgxSuffixDirective } from 'igniteui-angular/input-group'; @@ -12,7 +12,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-datepicker-sample-9', styleUrls: ['./datepicker-sample-9.component.scss'], templateUrl: './datepicker-sample-9.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [ IgxInputGroupComponent, IgxToggleActionDirective, diff --git a/src/app/scheduling/datepicker/datepicker-styling-sample/datepicker-styling-sample.component.ts b/src/app/scheduling/datepicker/datepicker-styling-sample/datepicker-styling-sample.component.ts index f17bcf5b1b..a9d44f6284 100644 --- a/src/app/scheduling/datepicker/datepicker-styling-sample/datepicker-styling-sample.component.ts +++ b/src/app/scheduling/datepicker/datepicker-styling-sample/datepicker-styling-sample.component.ts @@ -1,16 +1,16 @@ -import { Component, ElementRef, inject, ChangeDetectionStrategy } from '@angular/core'; -import { IgxOverlayService } from 'igniteui-angular/core'; -import { IgxDatePickerComponent } from 'igniteui-angular/date-picker'; +import { Component, ElementRef, inject } from '@angular/core'; +import { IgxOverlayService } from 'igniteui-angular/core'; +import { IgxDatePickerComponent } from 'igniteui-angular/date-picker'; import { IgxLabelDirective } from 'igniteui-angular/input-group'; @Component({ selector: 'app-datepicker-sample-1', styleUrls: ['./datepicker-styling-sample.component.scss'], templateUrl: './datepicker-styling-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxDatePickerComponent, IgxLabelDirective] }) -export class DatepickerStylingSampleComponent { element = inject(ElementRef); - private overlayService = inject(IgxOverlayService); - +export class DatepickerStylingSampleComponent { + element = inject(ElementRef); + private overlayService = inject(IgxOverlayService); + } diff --git a/src/app/scheduling/datepicker/reactive-form/reactive-form.component.ts b/src/app/scheduling/datepicker/reactive-form/reactive-form.component.ts index 460a04bfc3..2002aaa6f0 100644 --- a/src/app/scheduling/datepicker/reactive-form/reactive-form.component.ts +++ b/src/app/scheduling/datepicker/reactive-form/reactive-form.component.ts @@ -1,4 +1,4 @@ -import { Component, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, inject } from '@angular/core'; import { FormBuilder, FormGroup, Validators, FormsModule, ReactiveFormsModule } from '@angular/forms'; import { IgxDatePickerComponent } from 'igniteui-angular/date-picker'; import { IgxLabelDirective } from 'igniteui-angular/input-group'; @@ -8,7 +8,6 @@ import { IgxTimePickerComponent } from 'igniteui-angular/time-picker'; selector: 'app-datetimepicker-reactive-form', styleUrls: ['./reactive-form.component.scss'], templateUrl: './reactive-form.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [FormsModule, ReactiveFormsModule, IgxDatePickerComponent, IgxLabelDirective, IgxTimePickerComponent] }) export class DateTimePickerRFSampleComponent { diff --git a/src/app/scheduling/datepicker/template-driven-form/template-driven-form.component.ts b/src/app/scheduling/datepicker/template-driven-form/template-driven-form.component.ts index 036683ee8e..1ae6d4dbee 100644 --- a/src/app/scheduling/datepicker/template-driven-form/template-driven-form.component.ts +++ b/src/app/scheduling/datepicker/template-driven-form/template-driven-form.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxDatePickerComponent } from 'igniteui-angular/date-picker'; import { IgxLabelDirective } from 'igniteui-angular/input-group'; import { IgxTimePickerComponent } from 'igniteui-angular/time-picker'; @@ -8,7 +8,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-datetimepicker-template-driven-form', styleUrls: ['./template-driven-form.component.scss'], templateUrl: './template-driven-form.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxDatePickerComponent, FormsModule, IgxLabelDirective, IgxTimePickerComponent] }) export class DateTimePickerTDFSampleComponent { diff --git a/src/app/scheduling/daterangepicker/daterangepicker-basic/daterangepicker-basic.ts b/src/app/scheduling/daterangepicker/daterangepicker-basic/daterangepicker-basic.ts index cd059b6e96..c009f9d80d 100644 --- a/src/app/scheduling/daterangepicker/daterangepicker-basic/daterangepicker-basic.ts +++ b/src/app/scheduling/daterangepicker/daterangepicker-basic/daterangepicker-basic.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { DateRange } from 'igniteui-angular/core'; import { IgxDateRangePickerComponent } from 'igniteui-angular/date-picker'; import { IgxLabelDirective } from 'igniteui-angular/input-group'; @@ -8,7 +8,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-basic-rangedatepicker', styleUrls: ['./daterangepicker-basic.scss'], templateUrl: './daterangepicker-basic.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxDateRangePickerComponent, FormsModule, IgxLabelDirective] }) export class BasicDateRangePickerComponent { diff --git a/src/app/scheduling/daterangepicker/daterangepicker-flight-booking/daterangepicker-flight-booking.ts b/src/app/scheduling/daterangepicker/daterangepicker-flight-booking/daterangepicker-flight-booking.ts index b7ddecda6a..801881195b 100644 --- a/src/app/scheduling/daterangepicker/daterangepicker-flight-booking/daterangepicker-flight-booking.ts +++ b/src/app/scheduling/daterangepicker/daterangepicker-flight-booking/daterangepicker-flight-booking.ts @@ -1,4 +1,4 @@ -import { Component, Pipe, PipeTransform, ChangeDetectionStrategy } from '@angular/core'; +import { Component, Pipe, PipeTransform } from '@angular/core'; import { DateRange } from 'igniteui-angular/core'; import { IgxSelectComponent, IgxSelectItemComponent } from 'igniteui-angular/select'; import { IgxHintDirective, IgxLabelDirective, IgxPrefixDirective } from 'igniteui-angular/input-group'; @@ -12,7 +12,6 @@ import { PipeWithoutTownFrom as PipeWithoutTownFrom_1 } from '../../datepicker/d selector: 'app-flight-booking', styleUrls: ['./daterangepicker-flight-booking.scss'], templateUrl: './daterangepicker-flight-booking.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [FormsModule, IgxSelectComponent, IgxPrefixDirective, IgxIconComponent, IgxSelectItemComponent, IgxDateRangePickerComponent, IgxLabelDirective, IgxHintDirective, PipeWithoutTownFrom_1] }) export class FlightBookingComponent { diff --git a/src/app/scheduling/daterangepicker/daterangepicker-mode/daterangepicker-mode.ts b/src/app/scheduling/daterangepicker/daterangepicker-mode/daterangepicker-mode.ts index d4f216f903..07c556932a 100644 --- a/src/app/scheduling/daterangepicker/daterangepicker-mode/daterangepicker-mode.ts +++ b/src/app/scheduling/daterangepicker/daterangepicker-mode/daterangepicker-mode.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { DateRange } from 'igniteui-angular/core'; import { IgxDateRangePickerComponent } from 'igniteui-angular/date-picker'; @@ -6,7 +6,6 @@ import { IgxDateRangePickerComponent } from 'igniteui-angular/date-picker'; selector: 'app-mode-rangedatepicker', styleUrls: ['./daterangepicker-mode.scss'], templateUrl: './daterangepicker-mode.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxDateRangePickerComponent] }) export class DateRangePickerModeComponent { diff --git a/src/app/scheduling/daterangepicker/daterangepicker-range-buttons/daterangepicker-range-buttons.ts b/src/app/scheduling/daterangepicker/daterangepicker-range-buttons/daterangepicker-range-buttons.ts index e54cf15aee..08dd6701c7 100644 --- a/src/app/scheduling/daterangepicker/daterangepicker-range-buttons/daterangepicker-range-buttons.ts +++ b/src/app/scheduling/daterangepicker/daterangepicker-range-buttons/daterangepicker-range-buttons.ts @@ -1,4 +1,4 @@ -import { Component, ElementRef, OnInit, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ElementRef, OnInit, ViewChild, inject } from '@angular/core'; import { CustomDateRange, DateRange, IgxPickerActionsDirective, OverlaySettings } from 'igniteui-angular/core'; import { IgxDateRangePickerComponent } from 'igniteui-angular/date-picker'; import { IgxButtonDirective } from 'igniteui-angular/directives'; @@ -9,7 +9,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-rangdatepicker-range-buttons', styleUrls: ['./daterangepicker-range-buttons.scss'], templateUrl: './daterangepicker-range-buttons.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxDateRangePickerComponent, FormsModule, IgxPickerActionsDirective, IgxButtonDirective] }) export class DateRangePickerRangeButtonsComponent { diff --git a/src/app/scheduling/daterangepicker/daterangepicker-start-end/daterangepicker-start-end.ts b/src/app/scheduling/daterangepicker/daterangepicker-start-end/daterangepicker-start-end.ts index 4b4f723cb8..b2a83c0756 100644 --- a/src/app/scheduling/daterangepicker/daterangepicker-start-end/daterangepicker-start-end.ts +++ b/src/app/scheduling/daterangepicker/daterangepicker-start-end/daterangepicker-start-end.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { DateRange, IgxPickerClearComponent, IgxPickerToggleComponent } from 'igniteui-angular/core'; import { IgxDateRangeEndComponent, IgxDateRangePickerComponent, IgxDateRangeStartComponent } from 'igniteui-angular/date-picker'; import { IgxInputDirective, IgxPrefixDirective, IgxSuffixDirective } from 'igniteui-angular/input-group'; @@ -10,7 +10,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-rangedatepicker-start-end', styleUrls: ['./daterangepicker-start-end.scss'], templateUrl: './daterangepicker-start-end.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxDateRangePickerComponent, FormsModule, IgxDateRangeStartComponent, IgxInputDirective, IgxDateTimeEditorDirective, IgxPickerToggleComponent, IgxPrefixDirective, IgxIconComponent, IgxDateRangeEndComponent, IgxSuffixDirective, IgxPickerClearComponent] diff --git a/src/app/scheduling/daterangepicker/daterangepicker-styling/daterangepicker-styling.ts b/src/app/scheduling/daterangepicker/daterangepicker-styling/daterangepicker-styling.ts index 766a923a7f..a748cb408a 100644 --- a/src/app/scheduling/daterangepicker/daterangepicker-styling/daterangepicker-styling.ts +++ b/src/app/scheduling/daterangepicker/daterangepicker-styling/daterangepicker-styling.ts @@ -1,4 +1,4 @@ -import { Component, ElementRef, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ElementRef, inject } from '@angular/core'; import { DateRange, IgxPickerClearComponent, IgxPickerToggleComponent } from 'igniteui-angular/core'; import { IgxDateRangeEndComponent, IgxDateRangePickerComponent, IgxDateRangeStartComponent } from 'igniteui-angular/date-picker'; import { IgxInputDirective, IgxPrefixDirective, IgxSuffixDirective } from 'igniteui-angular/input-group'; @@ -10,7 +10,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-styled-rangedatepicker', styleUrls: ['./daterangepicker-styling.scss'], templateUrl: './daterangepicker-styling.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxDateRangePickerComponent, FormsModule, IgxDateRangeStartComponent, IgxInputDirective, IgxDateTimeEditorDirective, IgxPickerToggleComponent, IgxPrefixDirective, IgxIconComponent, IgxDateRangeEndComponent, IgxSuffixDirective, IgxPickerClearComponent] }) diff --git a/src/app/scheduling/daterangepicker/daterangepicker-validation/daterangepicker-validation.ts b/src/app/scheduling/daterangepicker/daterangepicker-validation/daterangepicker-validation.ts index dbfe2a834d..0d3da3c11e 100644 --- a/src/app/scheduling/daterangepicker/daterangepicker-validation/daterangepicker-validation.ts +++ b/src/app/scheduling/daterangepicker/daterangepicker-validation/daterangepicker-validation.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { DateRange, IgxPickerClearComponent, IgxPickerToggleComponent } from 'igniteui-angular/core'; import { IgxDateRangeEndComponent, IgxDateRangePickerComponent, IgxDateRangeStartComponent } from 'igniteui-angular/date-picker'; import { IgxInputDirective, IgxLabelDirective, IgxPrefixDirective, IgxSuffixDirective } from 'igniteui-angular/input-group'; @@ -10,7 +10,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-daterangepicker-validation', styleUrls: ['./daterangepicker-validation.scss'], templateUrl: './daterangepicker-validation.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxDateRangePickerComponent, FormsModule, IgxLabelDirective, IgxDateRangeStartComponent, IgxPickerToggleComponent, IgxPrefixDirective, IgxIconComponent, IgxInputDirective, IgxDateTimeEditorDirective, IgxDateRangeEndComponent, IgxSuffixDirective, IgxPickerClearComponent] diff --git a/src/app/scheduling/datetimeeditor/datetime-advanced/datetime-advanced.ts b/src/app/scheduling/datetimeeditor/datetime-advanced/datetime-advanced.ts index 0309532adc..9ecd05d2c5 100644 --- a/src/app/scheduling/datetimeeditor/datetime-advanced/datetime-advanced.ts +++ b/src/app/scheduling/datetimeeditor/datetime-advanced/datetime-advanced.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { DatePart } from 'igniteui-angular/core'; import { IgxInputDirective, IgxInputGroupComponent, IgxSuffixDirective } from 'igniteui-angular/input-group'; import { IgxDateTimeEditorDirective } from 'igniteui-angular/directives'; @@ -9,7 +9,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-datetime-advanced', styleUrls: ['./datetime-advanced.scss'], templateUrl: './datetime-advanced.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxInputGroupComponent, FormsModule, IgxInputDirective, IgxDateTimeEditorDirective, IgxSuffixDirective, IgxIconComponent] }) diff --git a/src/app/scheduling/datetimeeditor/datetime-basic/datetime-basic.component.ts b/src/app/scheduling/datetimeeditor/datetime-basic/datetime-basic.component.ts index 5994e52bd5..2ec29c4c11 100644 --- a/src/app/scheduling/datetimeeditor/datetime-basic/datetime-basic.component.ts +++ b/src/app/scheduling/datetimeeditor/datetime-basic/datetime-basic.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxInputDirective, IgxInputGroupComponent, IgxLabelDirective } from 'igniteui-angular/input-group'; import { IgxDateTimeEditorDirective, IgxTextSelectionDirective } from 'igniteui-angular/directives'; @@ -6,7 +6,6 @@ import { IgxDateTimeEditorDirective, IgxTextSelectionDirective } from 'igniteui- selector: 'app-datetime-basic', styleUrls: ['./datetime-basic.component.scss'], templateUrl: './datetime-basic.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxInputGroupComponent, IgxLabelDirective, IgxInputDirective, IgxDateTimeEditorDirective, IgxTextSelectionDirective] }) export class DateTimeBasicComponent { diff --git a/src/app/scheduling/monthpicker/monthpicker-sample-1/monthpicker-sample-1.component.ts b/src/app/scheduling/monthpicker/monthpicker-sample-1/monthpicker-sample-1.component.ts index 7bb5e06595..636b53a085 100644 --- a/src/app/scheduling/monthpicker/monthpicker-sample-1/monthpicker-sample-1.component.ts +++ b/src/app/scheduling/monthpicker/monthpicker-sample-1/monthpicker-sample-1.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxCardComponent } from 'igniteui-angular/card'; import { IgxMonthPickerComponent } from 'igniteui-angular/calendar'; @@ -6,7 +6,6 @@ import { IgxMonthPickerComponent } from 'igniteui-angular/calendar'; selector: 'app-monthpicker-sample-1', styleUrls: ['./monthpicker-sample-1.component.scss'], templateUrl: './monthpicker-sample-1.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxCardComponent, IgxMonthPickerComponent] }) export class MonthpickerSample1Component { diff --git a/src/app/scheduling/monthpicker/monthpicker-sample-3/monthpicker-sample-3.component.ts b/src/app/scheduling/monthpicker/monthpicker-sample-3/monthpicker-sample-3.component.ts index 3b7d3d5714..06a8d3d0b1 100644 --- a/src/app/scheduling/monthpicker/monthpicker-sample-3/monthpicker-sample-3.component.ts +++ b/src/app/scheduling/monthpicker/monthpicker-sample-3/monthpicker-sample-3.component.ts @@ -1,5 +1,5 @@ import { registerLocaleData } from '@angular/common'; -import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit } from '@angular/core'; import { IFormattingOptions, IgxMonthPickerComponent } from 'igniteui-angular/calendar'; import { IgxSelectComponent, IgxSelectItemComponent } from 'igniteui-angular/select'; import { IgxPrefixDirective } from 'igniteui-angular/input-group'; @@ -14,7 +14,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-monthpicker-sample-3', styleUrls: ['./monthpicker-sample-3.component.scss'], templateUrl: './monthpicker-sample-3.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSelectComponent, FormsModule, IgxPrefixDirective, IgxSelectItemComponent, IgxCardComponent, IgxMonthPickerComponent] }) export class MonthpickerSample3Component implements OnInit { diff --git a/src/app/scheduling/monthpicker/monthpicker-styling/monthpicker-styling.component.ts b/src/app/scheduling/monthpicker/monthpicker-styling/monthpicker-styling.component.ts index bba47ad35c..25d542b6ea 100644 --- a/src/app/scheduling/monthpicker/monthpicker-styling/monthpicker-styling.component.ts +++ b/src/app/scheduling/monthpicker/monthpicker-styling/monthpicker-styling.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxMonthPickerComponent } from 'igniteui-angular/calendar'; @Component({ selector: 'app-monthpicker-styling', styleUrls: ['./monthpicker-styling.component.scss'], templateUrl: './monthpicker-styling.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxMonthPickerComponent] }) export class MonthpickerStylingComponent { diff --git a/src/app/scheduling/monthpicker/monthpicker-tailwind-styling/layout.scss b/src/app/scheduling/monthpicker/monthpicker-tailwind-styling/layout.scss deleted file mode 100644 index 5d48b301ea..0000000000 --- a/src/app/scheduling/monthpicker/monthpicker-tailwind-styling/layout.scss +++ /dev/null @@ -1,4 +0,0 @@ -igx-month-picker { - --ig-size: 2; - max-width: 400px; -} \ No newline at end of file diff --git a/src/app/scheduling/monthpicker/monthpicker-tailwind-styling/monthpicker-tailwind-styling.component.html b/src/app/scheduling/monthpicker/monthpicker-tailwind-styling/monthpicker-tailwind-styling.component.html index 1b4fb25524..d941879ff4 100644 --- a/src/app/scheduling/monthpicker/monthpicker-tailwind-styling/monthpicker-tailwind-styling.component.html +++ b/src/app/scheduling/monthpicker/monthpicker-tailwind-styling/monthpicker-tailwind-styling.component.html @@ -1 +1 @@ - + diff --git a/src/app/scheduling/monthpicker/monthpicker-tailwind-styling/monthpicker-tailwind-styling.component.scss b/src/app/scheduling/monthpicker/monthpicker-tailwind-styling/monthpicker-tailwind-styling.component.scss index a60d456faa..0d9fd6e340 100644 --- a/src/app/scheduling/monthpicker/monthpicker-tailwind-styling/monthpicker-tailwind-styling.component.scss +++ b/src/app/scheduling/monthpicker/monthpicker-tailwind-styling/monthpicker-tailwind-styling.component.scss @@ -1 +1,5 @@ -@use "layout.scss"; +:host { + display: grid; + place-items: center; + height: 100%; +} diff --git a/src/app/scheduling/monthpicker/monthpicker-tailwind-styling/monthpicker-tailwind-styling.component.ts b/src/app/scheduling/monthpicker/monthpicker-tailwind-styling/monthpicker-tailwind-styling.component.ts index 5fa56c6ff5..aaad7b1884 100644 --- a/src/app/scheduling/monthpicker/monthpicker-tailwind-styling/monthpicker-tailwind-styling.component.ts +++ b/src/app/scheduling/monthpicker/monthpicker-tailwind-styling/monthpicker-tailwind-styling.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxMonthPickerComponent } from 'igniteui-angular/calendar'; @Component({ selector: 'app-monthpicker-tailwind-styling', styleUrls: ['./monthpicker-tailwind-styling.component.scss'], templateUrl: './monthpicker-tailwind-styling.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxMonthPickerComponent] }) export class MonthpickerTailwindStylingComponent { diff --git a/src/app/scheduling/timepicker/timepicker-dropdown/timepicker-dropdown.component.ts b/src/app/scheduling/timepicker/timepicker-dropdown/timepicker-dropdown.component.ts index 32dcbdcb97..1f635f1f61 100644 --- a/src/app/scheduling/timepicker/timepicker-dropdown/timepicker-dropdown.component.ts +++ b/src/app/scheduling/timepicker/timepicker-dropdown/timepicker-dropdown.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { PickerInteractionMode } from 'igniteui-angular/core'; import { IgxTimePickerComponent } from 'igniteui-angular/time-picker'; import { IgxLabelDirective } from 'igniteui-angular/input-group'; @@ -8,7 +8,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-timepicker-dropdown', styleUrls: ['./timepicker-dropdown.component.scss'], templateUrl: './timepicker-dropdown.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTimePickerComponent, FormsModule, IgxLabelDirective] }) export class TimepickerDropdownComponent { diff --git a/src/app/scheduling/timepicker/timepicker-sample-1/timepicker-sample-1.component.ts b/src/app/scheduling/timepicker/timepicker-sample-1/timepicker-sample-1.component.ts index 663547e5bb..b6e8616c95 100644 --- a/src/app/scheduling/timepicker/timepicker-sample-1/timepicker-sample-1.component.ts +++ b/src/app/scheduling/timepicker/timepicker-sample-1/timepicker-sample-1.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxTimePickerComponent } from 'igniteui-angular/time-picker'; import { IgxLabelDirective } from 'igniteui-angular/input-group'; @@ -6,7 +6,6 @@ import { IgxLabelDirective } from 'igniteui-angular/input-group'; selector: 'app-timepicker', styleUrls: ['./timepicker-sample-1.component.scss'], templateUrl: './timepicker-sample-1.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTimePickerComponent, IgxLabelDirective] }) export class TimePickerSample1Component { } diff --git a/src/app/scheduling/timepicker/timepicker-sample-4/timepicker-sample-4.component.ts b/src/app/scheduling/timepicker/timepicker-sample-4/timepicker-sample-4.component.ts index 5108619b46..d9de592040 100644 --- a/src/app/scheduling/timepicker/timepicker-sample-4/timepicker-sample-4.component.ts +++ b/src/app/scheduling/timepicker/timepicker-sample-4/timepicker-sample-4.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { IgxTimePickerComponent } from 'igniteui-angular/time-picker'; import { IgxLabelDirective } from 'igniteui-angular/input-group'; import { IgxToastComponent } from 'igniteui-angular/toast'; @@ -8,7 +8,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-timepicker', styleUrls: ['./timepicker-sample-4.component.scss'], templateUrl: './timepicker-sample-4.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTimePickerComponent, FormsModule, IgxLabelDirective, IgxToastComponent] }) export class TimePickerSample4Component { diff --git a/src/app/scheduling/timepicker/timepicker-sample-5/timepicker-sample-5.component.ts b/src/app/scheduling/timepicker/timepicker-sample-5/timepicker-sample-5.component.ts index d30d6d08fd..95ae0fa555 100644 --- a/src/app/scheduling/timepicker/timepicker-sample-5/timepicker-sample-5.component.ts +++ b/src/app/scheduling/timepicker/timepicker-sample-5/timepicker-sample-5.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxTimePickerComponent } from 'igniteui-angular/time-picker'; import { IgxHintDirective, IgxLabelDirective, IgxSuffixDirective } from 'igniteui-angular/input-group'; import { IgxPickerToggleComponent } from 'igniteui-angular/core'; @@ -9,7 +9,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-timepicker-sample-5', styleUrls: ['./timepicker-sample-5.component.scss'], templateUrl: './timepicker-sample-5.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTimePickerComponent, FormsModule, IgxLabelDirective, IgxPickerToggleComponent, IgxSuffixDirective, IgxIconComponent, IgxHintDirective] }) diff --git a/src/app/scheduling/timepicker/timepicker-sample-6/timepicker-sample-6.component.ts b/src/app/scheduling/timepicker/timepicker-sample-6/timepicker-sample-6.component.ts index e9c7033840..ef8e6d3812 100644 --- a/src/app/scheduling/timepicker/timepicker-sample-6/timepicker-sample-6.component.ts +++ b/src/app/scheduling/timepicker/timepicker-sample-6/timepicker-sample-6.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxTimePickerComponent } from 'igniteui-angular/time-picker'; import { IgxPickerActionsDirective, IgxPickerToggleComponent } from 'igniteui-angular/core'; import { IgxHintDirective, IgxPrefixDirective } from 'igniteui-angular/input-group'; @@ -10,7 +10,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-timepicker-sample-6', styleUrls: ['./timepicker-sample-6.component.scss'], templateUrl: './timepicker-sample-6.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTimePickerComponent, FormsModule, IgxPickerToggleComponent, IgxPrefixDirective, IgxIconComponent, IgxHintDirective, IgxButtonDirective, IgxPickerActionsDirective] }) export class TimePickerSample6Component { diff --git a/src/app/scheduling/timepicker/timepicker-styling/timepicker-styling.component.ts b/src/app/scheduling/timepicker/timepicker-styling/timepicker-styling.component.ts index 55025dd7c9..6e7fedb60c 100644 --- a/src/app/scheduling/timepicker/timepicker-styling/timepicker-styling.component.ts +++ b/src/app/scheduling/timepicker/timepicker-styling/timepicker-styling.component.ts @@ -1,16 +1,16 @@ -import { Component, ElementRef, inject, ChangeDetectionStrategy } from '@angular/core'; -import { IgxTimePickerComponent } from 'igniteui-angular/time-picker'; -import { IgxLabelDirective } from 'igniteui-angular/input-group'; +import { Component, ElementRef, inject } from '@angular/core'; +import { IgxTimePickerComponent } from 'igniteui-angular/time-picker'; +import { IgxLabelDirective } from 'igniteui-angular/input-group'; import { IgxButtonDirective } from 'igniteui-angular/directives'; @Component({ selector: 'app-timepicker', styleUrls: ['./timepicker-styling.component.scss'], templateUrl: './timepicker-styling.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTimePickerComponent, IgxLabelDirective, IgxButtonDirective] }) -export class TimePickerStylingComponent { element = inject(ElementRef); - +export class TimePickerStylingComponent { + element = inject(ElementRef); + } diff --git a/src/app/services/export-csv/csv-export-sample-1/csv-export-sample-1.component.ts b/src/app/services/export-csv/csv-export-sample-1/csv-export-sample-1.component.ts index e517a3c37a..ec8c586bfa 100644 --- a/src/app/services/export-csv/csv-export-sample-1/csv-export-sample-1.component.ts +++ b/src/app/services/export-csv/csv-export-sample-1/csv-export-sample-1.component.ts @@ -1,5 +1,5 @@ /* eslint-disable @typescript-eslint/naming-convention */ -import { Component, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild, inject } from '@angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarExporterComponent, IgxCsvExporterService } from 'igniteui-angular/grids/core'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from '../../../directives/prevent-s selector: 'app-csv-export-sample-1', styleUrls: ['./csv-export-sample-1.component.scss'], templateUrl: './csv-export-sample-1.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxGridToolbarActionsComponent, IgxGridToolbarExporterComponent] }) export class CsvExportSample1Component { diff --git a/src/app/services/export-csv/csv-export-tree-grid-sample/csv-export-tree-grid-sample.component.ts b/src/app/services/export-csv/csv-export-tree-grid-sample/csv-export-tree-grid-sample.component.ts index 0843623b62..7d4113ed97 100644 --- a/src/app/services/export-csv/csv-export-tree-grid-sample/csv-export-tree-grid-sample.component.ts +++ b/src/app/services/export-csv/csv-export-tree-grid-sample/csv-export-tree-grid-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxCellTemplateDirective, IgxColumnComponent, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarExporterComponent } from 'igniteui-angular/grids/core'; import { ORDERS_DATA } from '../../../tree-grid/data/orders'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from '../../../directives/prevent-s selector: 'app-csv-export-tree-grid-sample', styleUrls: ['./csv-export-tree-grid-sample.component.scss'], templateUrl: './csv-export-tree-grid-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxGridToolbarActionsComponent, IgxGridToolbarExporterComponent, IgxColumnComponent, IgxCellTemplateDirective] }) export class TreeGridCsvExportSample1Component implements OnInit { diff --git a/src/app/services/export-csv/csv-export.component.ts b/src/app/services/export-csv/csv-export.component.ts index e79e2d5f6d..563ae4e5f6 100644 --- a/src/app/services/export-csv/csv-export.component.ts +++ b/src/app/services/export-csv/csv-export.component.ts @@ -1,5 +1,5 @@ /* eslint-disable @typescript-eslint/naming-convention */ -import { Component, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, inject } from '@angular/core'; import { CsvFileTypes, IgxCsvExporterOptions, IgxCsvExporterService } from 'igniteui-angular/grids/core'; import { IgxButtonDirective } from 'igniteui-angular/directives'; @@ -8,7 +8,6 @@ import { IgxButtonDirective } from 'igniteui-angular/directives'; selector: 'app-csv-export', styleUrls: ['./csv-export.component.scss'], templateUrl: './csv-export.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective] }) export class CsvExportComponent { diff --git a/src/app/services/export-excel/excel-export-sample-1/excel-export-sample-1.component.ts b/src/app/services/export-excel/excel-export-sample-1/excel-export-sample-1.component.ts index 78b34b3edf..38c1b842e4 100644 --- a/src/app/services/export-excel/excel-export-sample-1/excel-export-sample-1.component.ts +++ b/src/app/services/export-excel/excel-export-sample-1/excel-export-sample-1.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild, inject } from '@angular/core'; import { GridColumnDataType, ISortingExpression, SortingDirection } from 'igniteui-angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxColumnComponent, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarExporterComponent, IgxExcelExporterService } from 'igniteui-angular/grids/core'; @@ -9,7 +9,6 @@ import { INVOICE_DATA } from '../data/invoiceData'; selector: 'app-excel-export-sample-1', styleUrls: ['./excel-export-sample-1.component.scss'], templateUrl: './excel-export-sample-1.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxGridToolbarComponent, IgxGridToolbarActionsComponent, IgxGridToolbarExporterComponent, IgxColumnComponent] }) export class ExcelExportSample1Component implements OnInit { diff --git a/src/app/services/export-excel/excel-export-tree-grid-sample/excel-export-tree-grid-sample.component.ts b/src/app/services/export-excel/excel-export-tree-grid-sample/excel-export-tree-grid-sample.component.ts index 71eeab5245..1801ddc52a 100644 --- a/src/app/services/export-excel/excel-export-tree-grid-sample/excel-export-tree-grid-sample.component.ts +++ b/src/app/services/export-excel/excel-export-tree-grid-sample/excel-export-tree-grid-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxCellTemplateDirective, IgxColumnComponent, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarExporterComponent } from 'igniteui-angular/grids/core'; import { ORDERS_DATA } from '../../../tree-grid/data/orders'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from '../../../directives/prevent-s selector: 'app-excel-export-tree-grid-sample', styleUrls: ['./excel-export-tree-grid-sample.component.scss'], templateUrl: './excel-export-tree-grid-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxGridToolbarActionsComponent, IgxGridToolbarExporterComponent, IgxColumnComponent, IgxCellTemplateDirective] }) export class TreeGridExcelExportSample1Component implements OnInit { diff --git a/src/app/services/export-excel/excel-export.component.ts b/src/app/services/export-excel/excel-export.component.ts index ba11a0043d..8e794f05c3 100644 --- a/src/app/services/export-excel/excel-export.component.ts +++ b/src/app/services/export-excel/excel-export.component.ts @@ -1,5 +1,5 @@ /* eslint-disable @typescript-eslint/naming-convention */ -import { Component, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, inject } from '@angular/core'; import { IgxExcelExporterOptions, IgxExcelExporterService } from 'igniteui-angular/grids/core'; import { IgxButtonDirective } from 'igniteui-angular/directives'; @@ -8,7 +8,6 @@ import { IgxButtonDirective } from 'igniteui-angular/directives'; selector: 'app-excel-export', styleUrls: ['./excel-export.component.scss'], templateUrl: './excel-export.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective] }) export class ExcelExportComponent { diff --git a/src/app/services/export-pdf-custom-font/export-pdf-custom-font.component.ts b/src/app/services/export-pdf-custom-font/export-pdf-custom-font.component.ts index 79a5b0de49..72b7656675 100644 --- a/src/app/services/export-pdf-custom-font/export-pdf-custom-font.component.ts +++ b/src/app/services/export-pdf-custom-font/export-pdf-custom-font.component.ts @@ -17,7 +17,6 @@ import notoSansFontData from './fonts/noto-sans.json'; selector: 'app-export-pdf-custom-font', templateUrl: './export-pdf-custom-font.component.html', styleUrls: ['./export-pdf-custom-font.component.scss'], - changeDetection: ChangeDetectionStrategy.OnPush, imports: [IgxGridComponent, IgxColumnComponent] }) export class ExportPdfCustomFontComponent { diff --git a/src/app/services/export-pdf/pdf-export.component.ts b/src/app/services/export-pdf/pdf-export.component.ts index 9bad4eb401..facaa6d22b 100644 --- a/src/app/services/export-pdf/pdf-export.component.ts +++ b/src/app/services/export-pdf/pdf-export.component.ts @@ -1,4 +1,4 @@ -import { Component, inject, signal, ChangeDetectionStrategy } from '@angular/core'; +import { Component, inject, signal } from '@angular/core'; import { IgxPdfExporterOptions, IgxPdfExporterService } from 'igniteui-angular/grids/core'; import { IgxButtonDirective } from 'igniteui-angular/directives'; @@ -6,7 +6,6 @@ import { IgxButtonDirective } from 'igniteui-angular/directives'; selector: 'app-pdf-export', styleUrls: ['./pdf-export.component.scss'], templateUrl: './pdf-export.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective] }) export class PdfExportComponent { diff --git a/src/app/services/localization-samples-old/localization-all-resources/localization-all-resources.component.ts b/src/app/services/localization-samples-old/localization-all-resources/localization-all-resources.component.ts index 2e312b4e82..ff938ae36f 100644 --- a/src/app/services/localization-samples-old/localization-all-resources/localization-all-resources.component.ts +++ b/src/app/services/localization-samples-old/localization-all-resources/localization-all-resources.component.ts @@ -1,5 +1,5 @@ /* eslint-disable @typescript-eslint/naming-convention */ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { registerLocaleData } from '@angular/common'; import localeBG from '@angular/common/locales/bg'; import localeCS from '@angular/common/locales/cs'; @@ -37,7 +37,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-localization-all-resources-old', styleUrls: ['./localization-all-resources.component.scss'], templateUrl: 'localization-all-resources.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxGridToolbarComponent, IgxGridToolbarTitleComponent, IgxSelectComponent, FormsModule, IgxSelectItemComponent, IgxColumnComponent] }) export class LocalizationAllResourcesOldComponent implements OnInit { diff --git a/src/app/services/localization-samples-old/localization-sample-1/localization-sample-1.component.ts b/src/app/services/localization-samples-old/localization-sample-1/localization-sample-1.component.ts index 0cccf33203..733c80728b 100644 --- a/src/app/services/localization-samples-old/localization-sample-1/localization-sample-1.component.ts +++ b/src/app/services/localization-samples-old/localization-sample-1/localization-sample-1.component.ts @@ -1,5 +1,5 @@ /* eslint-disable @typescript-eslint/naming-convention */ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxColumnComponent } from 'igniteui-angular/grids/core'; import { DATA } from '../../../data/nwindData'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from '../../../directives/prevent-s selector: 'app-localization-sample-1', styleUrls: ['./localization-sample-1.component.scss'], templateUrl: 'localization-sample-1.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent] }) diff --git a/src/app/services/localization-samples-old/localization-sample-2/localization-sample-2.component.ts b/src/app/services/localization-samples-old/localization-sample-2/localization-sample-2.component.ts index 14031e9c2d..3583b37ffa 100644 --- a/src/app/services/localization-samples-old/localization-sample-2/localization-sample-2.component.ts +++ b/src/app/services/localization-samples-old/localization-sample-2/localization-sample-2.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit } from '@angular/core'; import { GridResourceStringsEN, TimePickerResourceStringsEN, changei18n } from 'igniteui-angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -12,7 +12,6 @@ import { CurrencyPipe } from '@angular/common'; selector: 'app-localization-sample-2', styleUrls: ['./localization-sample-2.component.scss'], templateUrl: 'localization-sample-2.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxTimePickerComponent, IgxLabelDirective, CurrencyPipe] }) diff --git a/src/app/services/localization-samples-old/localization-sample-3/localization-sample-3.component.ts b/src/app/services/localization-samples-old/localization-sample-3/localization-sample-3.component.ts index 1280c706f5..0d36aed14a 100644 --- a/src/app/services/localization-samples-old/localization-sample-3/localization-sample-3.component.ts +++ b/src/app/services/localization-samples-old/localization-sample-3/localization-sample-3.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxColumnComponent } from 'igniteui-angular/grids/core'; import { DATA } from '../../../data/nwindData'; @@ -8,7 +8,6 @@ import { IgxPreventDocumentScrollDirective } from '../../../directives/prevent-s selector: 'app-localization-sample-3', styleUrls: ['./localization-sample-3.component.scss'], templateUrl: 'localization-sample-3.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent] }) diff --git a/src/app/services/localization-samples/localization-all-resources/localization-all-resources.component.ts b/src/app/services/localization-samples/localization-all-resources/localization-all-resources.component.ts index 58fa060a89..dc481d6fa7 100644 --- a/src/app/services/localization-samples/localization-all-resources/localization-all-resources.component.ts +++ b/src/app/services/localization-samples/localization-all-resources/localization-all-resources.component.ts @@ -1,5 +1,5 @@ /* eslint-disable @typescript-eslint/naming-convention */ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { DATA } from '../../../data/nwindData'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { GridResourceStringsEN, IGridResourceStrings, registerI18n, setCurrentI18n } from 'igniteui-angular/core'; @@ -18,7 +18,6 @@ import { selector: 'app-localization-all-resources', styleUrls: ['./localization-all-resources.component.scss'], templateUrl: 'localization-all-resources.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxGridComponent, IgxGridToolbarComponent, IgxGridToolbarTitleComponent, IgxSelectComponent, FormsModule, IgxSelectItemComponent, IgxColumnComponent] }) export class LocalizationAllResourcesComponent implements OnInit { diff --git a/src/app/services/transaction/transaction-base/transaction-base.component.ts b/src/app/services/transaction/transaction-base/transaction-base.component.ts index ee252f40ba..bd525280ce 100644 --- a/src/app/services/transaction/transaction-base/transaction-base.component.ts +++ b/src/app/services/transaction/transaction-base/transaction-base.component.ts @@ -1,4 +1,4 @@ -import { Component, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, inject } from '@angular/core'; import { IgxTransactionService, State, Transaction, TransactionType } from 'igniteui-angular/core'; import { IgxCardComponent } from 'igniteui-angular/card'; import { IgxListActionDirective, IgxListComponent, IgxListItemComponent, IgxListLineSubTitleDirective, IgxListLineTitleDirective } from 'igniteui-angular/list'; @@ -13,7 +13,6 @@ import { IgxButtonDirective } from 'igniteui-angular/directives'; selector: 'app-transaction-base', styleUrls: ['./transaction-base.component.scss'], templateUrl: 'transaction-base.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxCardComponent, IgxListComponent, IgxListItemComponent, NgClass, IgxListLineTitleDirective, IgxListLineSubTitleDirective, IgxIconComponent, IgxListActionDirective, TransactionBasePipe] }) export class TransactionBaseComponent { diff --git a/src/app/theming/angular/angular-sample.component.ts b/src/app/theming/angular/angular-sample.component.ts index d3c7e4d222..0b83e40cc8 100644 --- a/src/app/theming/angular/angular-sample.component.ts +++ b/src/app/theming/angular/angular-sample.component.ts @@ -1,7 +1,7 @@ -import { Component, HostBinding, OnInit, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, HostBinding, OnInit, ViewChild, inject } from '@angular/core'; import { IgxDialogActionsDirective, IgxDialogComponent } from 'igniteui-angular/dialog'; import { IgxOverlayOutletDirective } from 'igniteui-angular/core'; -import { IgxButtonDirective, IgxDividerDirective, IgxIconButtonDirective, IgxLayoutDirective } from 'igniteui-angular/directives'; +import { IgxButtonDirective, IgxDividerComponent, IgxIconButtonDirective, IgxLayoutDirective } from 'igniteui-angular/directives'; import { IgxIconComponent } from 'igniteui-angular/icon'; import { IgxAvatarComponent } from 'igniteui-angular/avatar'; import { IgxCardActionsComponent, IgxCardComponent, IgxCardHeaderComponent, IgxCardHeaderSubtitleDirective, IgxCardHeaderTitleDirective, IgxCardMediaDirective } from 'igniteui-angular/card'; @@ -21,8 +21,7 @@ import { MatInput } from '@angular/material/input'; selector: 'app-angular-sample', styleUrls: ['./angular-sample.component.scss'], templateUrl: './angular-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, - imports: [MatToolbar, IgxButtonDirective, MatMenuTrigger, IgxIconComponent, MatMenu, MatMenuItem, IgxLayoutDirective, IgxAvatarComponent, IgxIconButtonDirective, IgxCardComponent, IgxCardMediaDirective, IgxCardHeaderComponent, IgxCardHeaderTitleDirective, IgxCardHeaderSubtitleDirective, IgxCardActionsComponent, MatButton, IgxDialogComponent, IgxDialogActionsDirective, IgxSuffixDirective, IgxOverlayOutletDirective, IgxExpansionPanelComponent, IgxExpansionPanelHeaderComponent, IgxExpansionPanelTitleDirective, IgxExpansionPanelDescriptionDirective, IgxExpansionPanelBodyComponent, MatSlider, MatSliderThumb, IgxDividerDirective, MatStepper, MatStep, FormsModule, ReactiveFormsModule, MatStepLabel, MatFormField, MatLabel, MatInput, MatStepperNext, MatStepperPrevious] + imports: [MatToolbar, IgxButtonDirective, MatMenuTrigger, IgxIconComponent, MatMenu, MatMenuItem, IgxLayoutDirective, IgxAvatarComponent, IgxIconButtonDirective, IgxCardComponent, IgxCardMediaDirective, IgxCardHeaderComponent, IgxCardHeaderTitleDirective, IgxCardHeaderSubtitleDirective, IgxCardActionsComponent, MatButton, IgxDialogComponent, IgxDialogActionsDirective, IgxSuffixDirective, IgxOverlayOutletDirective, IgxExpansionPanelComponent, IgxExpansionPanelHeaderComponent, IgxExpansionPanelTitleDirective, IgxExpansionPanelDescriptionDirective, IgxExpansionPanelBodyComponent, MatSlider, MatSliderThumb, IgxDividerComponent, MatStepper, MatStep, FormsModule, ReactiveFormsModule, MatStepLabel, MatFormField, MatLabel, MatInput, MatStepperNext, MatStepperPrevious] }) export class AngularMaterialComponent implements OnInit { @@ -61,7 +60,7 @@ export class AngularMaterialComponent implements OnInit { private toggleOverlayClasses(theme: 'light' | 'dark') { const overlayClasses = this.overlayContainer.getContainerElement().classList; overlayClasses.add('mat-menu'); - + switch (theme) { case 'light': overlayClasses.remove('dark-menu-theme'); diff --git a/src/app/theming/animations/animations-sample-1/animations-sample-1.component.ts b/src/app/theming/animations/animations-sample-1/animations-sample-1.component.ts index 383c595b10..28d8c36771 100644 --- a/src/app/theming/animations/animations-sample-1/animations-sample-1.component.ts +++ b/src/app/theming/animations/animations-sample-1/animations-sample-1.component.ts @@ -1,5 +1,5 @@ import { AnimationReferenceMetadata } from '@angular/animations'; -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { AbsolutePosition, IgxOverlayService } from 'igniteui-angular/core'; import { IListItemClickEventArgs, IgxListComponent, IgxListItemComponent, IgxListModule } from 'igniteui-angular/list'; import { IgxDialogComponent, IgxDialogModule } from 'igniteui-angular/dialog'; @@ -30,7 +30,6 @@ import { blink, fadeIn, fadeOut, flipBottom, flipHorBck, flipHorFwd, flipLeft, f selector: 'app-animations-sample-1', styleUrls: ['./animations-sample-1.component.scss'], templateUrl: './animations-sample-1.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxListComponent, IgxListItemComponent, IgxDialogComponent] }) export class AnimationsSampleComponent { diff --git a/src/app/theming/animations/animations-sample-2/animations-sample-2.component.html b/src/app/theming/animations/animations-sample-2/animations-sample-2.component.html index 8aa6432f7c..b5d519cacc 100644 --- a/src/app/theming/animations/animations-sample-2/animations-sample-2.component.html +++ b/src/app/theming/animations/animations-sample-2/animations-sample-2.component.html @@ -1,32 +1,30 @@ -
- -
- -
Rozes
-
Under the Grave (2016)
- - - - + +
+ + Rozes + Under the Grave (2016) + + + + - -

As I have always said: I write what's real and what's true, - even if it means throwing myself under the bus.

- -
+ +

As I have always said: I write what's real and what's true, + even if it means throwing myself under the bus.

+ +
- + - - - - - - -
+ + + + + + diff --git a/src/app/theming/animations/animations-sample-2/animations-sample-2.component.scss b/src/app/theming/animations/animations-sample-2/animations-sample-2.component.scss index 6adaee26fe..406979e7dd 100644 --- a/src/app/theming/animations/animations-sample-2/animations-sample-2.component.scss +++ b/src/app/theming/animations/animations-sample-2/animations-sample-2.component.scss @@ -3,13 +3,16 @@ @include fade-in-top(); -.sample-column { - display: block; - padding: 16px; - @include animation('fade-in-top' 3s $ease-out-quad infinite); +:host { + display: grid; + place-content: center; + width: 100%; + height: 100%; } -.card-wrapper { +igx-card { + @include animation('fade-in-top' 3s $ease-out-quad forwards); + max-width: 400px; min-width: 250px; } diff --git a/src/app/theming/animations/animations-sample-2/animations-sample-2.component.ts b/src/app/theming/animations/animations-sample-2/animations-sample-2.component.ts index 71a7d86ce8..7e2197b8b4 100644 --- a/src/app/theming/animations/animations-sample-2/animations-sample-2.component.ts +++ b/src/app/theming/animations/animations-sample-2/animations-sample-2.component.ts @@ -1,14 +1,13 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; -import { IgxCardActionsComponent, IgxCardComponent, IgxCardContentDirective, IgxCardHeaderComponent, IgxCardMediaDirective } from 'igniteui-angular/card'; -import { IgxDividerDirective, IgxFlexDirective, IgxIconButtonDirective, IgxLayoutDirective, IgxRippleDirective } from 'igniteui-angular/directives'; +import { Component } from '@angular/core'; +import { IGX_CARD_DIRECTIVES } from 'igniteui-angular/card'; +import { IgxDividerComponent, IgxFlexDirective, IgxIconButtonDirective, IgxLayoutDirective, IgxRippleDirective } from 'igniteui-angular/directives'; import { IgxSuffixDirective } from 'igniteui-angular/input-group'; import { IgxIconComponent } from 'igniteui-angular/icon'; @Component({ selector: 'app-animations-sample-2', styleUrls: ['./animations-sample-2.component.scss'], templateUrl: './animations-sample-2.component.html', - changeDetection: ChangeDetectionStrategy.Eager, - imports: [IgxCardComponent, IgxLayoutDirective, IgxFlexDirective, IgxCardHeaderComponent, IgxCardMediaDirective, IgxCardContentDirective, IgxDividerDirective, IgxCardActionsComponent, IgxIconButtonDirective, IgxRippleDirective, IgxSuffixDirective, IgxIconComponent] + imports: [IgxLayoutDirective, IgxFlexDirective, IgxDividerComponent, IgxIconButtonDirective, IgxRippleDirective, IgxSuffixDirective, IgxIconComponent, IGX_CARD_DIRECTIVES] }) export class AnimationsSample2Component { public horizontal = true; diff --git a/src/app/theming/bootstrap/bootstrap-sample.component.scss b/src/app/theming/bootstrap/bootstrap-sample.component.scss index a361dba19a..93508a365a 100644 --- a/src/app/theming/bootstrap/bootstrap-sample.component.scss +++ b/src/app/theming/bootstrap/bootstrap-sample.component.scss @@ -17,9 +17,8 @@ $custom-dark-palette: palette( $dark-primary: color($custom-dark-palette, "primary"); $dark-secondary: color($custom-dark-palette, "secondary"); -.d-flex.align-items-center { - width: 100%; - padding: 0 16px; +.d-flex { + align-items: center; } .card-wrapper { @@ -164,4 +163,8 @@ $dark-secondary: color($custom-dark-palette, "secondary"); ::ng-deep{ /* Importing Bootstrap .scss file. */ @import "bootstrap/scss/bootstrap"; + + .collapse { + visibility: visible; + } } diff --git a/src/app/theming/bootstrap/bootstrap-sample.component.ts b/src/app/theming/bootstrap/bootstrap-sample.component.ts index 884729e1cc..5a7c73bfea 100644 --- a/src/app/theming/bootstrap/bootstrap-sample.component.ts +++ b/src/app/theming/bootstrap/bootstrap-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, HostBinding, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, HostBinding, OnInit, ViewChild } from '@angular/core'; import { IgxDialogActionsDirective, IgxDialogComponent } from 'igniteui-angular/dialog'; import { IgxOverlayOutletDirective } from 'igniteui-angular/core'; import { IgxButtonDirective, IgxFlexDirective, IgxIconButtonDirective, IgxLayoutDirective } from 'igniteui-angular/directives'; @@ -13,7 +13,6 @@ import { NgbDropdown, NgbDropdownToggle, NgbDropdownMenu, NgbDropdownItem, NgbRa selector: 'app-bootstrap-sample', styleUrls: ['./bootstrap-sample.component.scss'], templateUrl: './bootstrap-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, NgbDropdown, NgbDropdownToggle, NgbDropdownMenu, NgbDropdownItem, IgxAvatarComponent, IgxIconButtonDirective, IgxIconComponent, IgxLayoutDirective, IgxCardComponent, IgxFlexDirective, IgxCardHeaderComponent, IgxCardHeaderTitleDirective, IgxCardHeaderSubtitleDirective, IgxCardContentDirective, NgbRating, IgxCardActionsComponent, IgxDialogComponent, IgxDialogActionsDirective, IgxSuffixDirective, IgxOverlayOutletDirective, NgbAccordionDirective, NgbAccordionItem, NgbAccordionHeader, NgbAccordionToggle, NgbAccordionButton, NgbCollapse, NgbAccordionCollapse, NgbAccordionBody, IgxListComponent, IgxListItemComponent, IgxListLineTitleDirective, IgxListActionDirective] }) diff --git a/src/app/theming/default-theme-sample/default-theme-sample.component.ts b/src/app/theming/default-theme-sample/default-theme-sample.component.ts index ad1ae3d082..e22ec3c47b 100644 --- a/src/app/theming/default-theme-sample/default-theme-sample.component.ts +++ b/src/app/theming/default-theme-sample/default-theme-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, Input, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, Input, OnInit, ViewChild } from '@angular/core'; import { CloseScrollStrategy, ConnectedPositioningStrategy, HorizontalAlignment, IgxOverlayOutletDirective, OverlaySettings, VerticalAlignment } from 'igniteui-angular/core'; import { IgxDialogComponent } from 'igniteui-angular/dialog'; import { IgxDropDownComponent } from 'igniteui-angular/drop-down'; @@ -19,7 +19,6 @@ import { DatePipe } from '@angular/common'; selector: 'app-default-theme-sample', styleUrls: ['./default-theme-sample.component.scss'], templateUrl: './default-theme-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxDialogComponent, IgxInputGroupComponent, IgxLabelDirective, FormsModule, IgxInputDirective, IgxDatePickerComponent, IgxOverlayOutletDirective, IgxLayoutDirective, IgxButtonDirective, IgxGridComponent, IgxPaginatorComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxIconButtonDirective, IgxIconComponent, IgxSnackbarComponent, DatePipe] }) export class DefaultThemeSampleComponent implements OnInit { diff --git a/src/app/theming/display-density/display-density.component.scss b/src/app/theming/display-density/display-density.component.scss index 1bf4c27e5f..5e194561f7 100644 --- a/src/app/theming/display-density/display-density.component.scss +++ b/src/app/theming/display-density/display-density.component.scss @@ -1,13 +1,6 @@ :host { - display: block; - padding: 8px; + display: grid; + gap: 16px; + padding: 16px; + max-width: 500px; } - -.density-chooser { - margin-bottom: 16px; -} - -igx-buttongroup, igx-input-group { - display: block; - width: 500px; -} \ No newline at end of file diff --git a/src/app/theming/display-density/display-density.component.ts b/src/app/theming/display-density/display-density.component.ts index 295a2ffcda..2b1b534889 100644 --- a/src/app/theming/display-density/display-density.component.ts +++ b/src/app/theming/display-density/display-density.component.ts @@ -1,4 +1,4 @@ -import { Component, HostBinding, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, HostBinding, OnInit } from '@angular/core'; import { IgxButtonGroupComponent } from 'igniteui-angular/button-group'; import { IgxHintDirective, IgxInputDirective, IgxInputGroupComponent, IgxLabelDirective, IgxPrefixDirective, IgxSuffixDirective } from 'igniteui-angular/input-group'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -8,7 +8,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-display-density', styleUrls: ['./display-density.component.scss'], templateUrl: './display-density.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonGroupComponent, IgxInputGroupComponent, FormsModule, IgxInputDirective, IgxLabelDirective, IgxPrefixDirective, IgxSuffixDirective, IgxIconComponent, IgxHintDirective] }) diff --git a/src/app/theming/roundness/roundness-sample.component.ts b/src/app/theming/roundness/roundness-sample.component.ts index 7aa25e7f1d..0d0d276c06 100644 --- a/src/app/theming/roundness/roundness-sample.component.ts +++ b/src/app/theming/roundness/roundness-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from "@angular/core"; +import { Component } from "@angular/core"; import { IgxCardComponent, IgxCardContentDirective, IgxCardHeaderComponent } from 'igniteui-angular/card'; import { IgxChipComponent } from 'igniteui-angular/chips'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -8,7 +8,6 @@ import { IgxPrefixDirective } from 'igniteui-angular/input-group'; selector: "app-chip-simple", styleUrls: ["./roundness-sample.component.scss"], templateUrl: "./roundness-sample.component.html", - changeDetection: ChangeDetectionStrategy.Eager, imports: [ IgxCardComponent, IgxCardHeaderComponent, diff --git a/src/app/theming/shadows/card-sample-shadow/card-sample-shadow.ts b/src/app/theming/shadows/card-sample-shadow/card-sample-shadow.ts index 26a2b30166..019ce24cd4 100644 --- a/src/app/theming/shadows/card-sample-shadow/card-sample-shadow.ts +++ b/src/app/theming/shadows/card-sample-shadow/card-sample-shadow.ts @@ -1,4 +1,4 @@ -import {Component, ChangeDetectionStrategy} from '@angular/core'; +import {Component} from '@angular/core'; import { IgxCardActionsComponent, IgxCardComponent, IgxCardContentDirective, IgxCardHeaderComponent } from 'igniteui-angular/card'; import { IgxButtonDirective, IgxIconButtonDirective, IgxRippleDirective } from 'igniteui-angular/directives'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -7,7 +7,6 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; selector: 'app-card-sample-shadow', styleUrls: ['./card-sample-shadow.scss'], templateUrl: './card-sample-shadow.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxCardComponent, IgxCardHeaderComponent, IgxCardContentDirective, IgxCardActionsComponent, IgxIconButtonDirective, IgxRippleDirective, IgxIconComponent, IgxButtonDirective] }) export class CardSampleShadowComponent { } diff --git a/src/app/theming/shadows/shadows-sample-1/shadows-sample.component.ts b/src/app/theming/shadows/shadows-sample-1/shadows-sample.component.ts index 3d51a8007a..bf11922522 100644 --- a/src/app/theming/shadows/shadows-sample-1/shadows-sample.component.ts +++ b/src/app/theming/shadows/shadows-sample-1/shadows-sample.component.ts @@ -1,9 +1,8 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; @Component({ selector: 'app-shadows-sample', styleUrls: ['./shadows-sample.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, templateUrl: './shadows-sample.component.html' }) export class ShadowsSampleComponent { diff --git a/src/app/theming/shadows/shadows-sample-2/shadows-sample-2.component.ts b/src/app/theming/shadows/shadows-sample-2/shadows-sample-2.component.ts index 5626ecab5b..8b672dd175 100644 --- a/src/app/theming/shadows/shadows-sample-2/shadows-sample-2.component.ts +++ b/src/app/theming/shadows/shadows-sample-2/shadows-sample-2.component.ts @@ -1,9 +1,8 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; @Component({ selector: 'app-shadows-sample-2', styleUrls: ['./shadows-sample-2.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, templateUrl: './shadows-sample-2.component.html' }) export class ShadowsSample2Component { diff --git a/src/app/theming/styles/dark-theme.scss b/src/app/theming/styles/dark-theme.scss index db22c73dd2..e226d14f5b 100644 --- a/src/app/theming/styles/dark-theme.scss +++ b/src/app/theming/styles/dark-theme.scss @@ -1,23 +1,18 @@ @use 'igniteui-angular/theming' as *; // Import grid component and theme styles -@use 'igniteui-angular/lib/core/styles/components/grid/grid-component'; @use 'igniteui-angular/lib/core/styles/components/grid/grid-theme'; // Import paginator component and theme styles -@use 'igniteui-angular/lib/core/styles/components/paginator/paginator-component'; @use 'igniteui-angular/lib/core/styles/components/paginator/paginator-theme'; // Import dialog-group component and theme styles -@use 'igniteui-angular/lib/core/styles/components/dialog/dialog-component'; @use 'igniteui-angular/lib/core/styles/components/dialog/dialog-theme'; // Import input-group component and theme styles -@use 'igniteui-angular/lib/core/styles/components/input/input-group-component'; @use 'igniteui-angular/lib/core/styles/components/input/input-group-theme'; // Import grid snackbar and theme styles -@use 'igniteui-angular/lib/core/styles/components/snackbar/snackbar-component'; @use 'igniteui-angular/lib/core/styles/components/snackbar/snackbar-theme'; // Import button component and theme styles @@ -25,15 +20,12 @@ @use 'igniteui-angular/lib/core/styles/components/button/button-theme'; // Import button-group component and theme styles -@use 'igniteui-angular/lib/core/styles/components/button-group/button-group-component'; @use 'igniteui-angular/lib/core/styles/components/button-group/button-group-theme'; // Import chip component and theme styles -@use 'igniteui-angular/lib/core/styles/components/chip/chip-component'; @use 'igniteui-angular/lib/core/styles/components/chip/chip-theme'; // Import badge component and theme styles -@use 'igniteui-angular/lib/core/styles/components/badge/badge-component'; @use 'igniteui-angular/lib/core/styles/components/badge/badge-theme'; // Define the primary colors @@ -57,8 +49,8 @@ $header-border-color: color($dark-theme-palette, "primary", 600) // Define dark theme for the paginator $dark-paginator-theme: paginator-theme( - $text-color: color($dark-theme-palette, "secondary", 700), - $background-color: color($dark-theme-palette, "primary", 500), + $foreground: color($dark-theme-palette, "secondary", 700), + $background: color($dark-theme-palette, "primary", 500), $border-color: color($dark-theme-palette, "secondary", 500) ); diff --git a/src/app/theming/styles/themes.scss b/src/app/theming/styles/themes.scss index 7c2f28d156..91311664d9 100644 --- a/src/app/theming/styles/themes.scss +++ b/src/app/theming/styles/themes.scss @@ -1,7 +1,6 @@ @use 'schemas'; // Import grid component and theme styles -@use 'igniteui-angular/lib/core/styles/components/grid/grid-component'; @use 'igniteui-angular/lib/core/styles//components/grid/grid-theme'; // Import grid snackbar and theme styles @@ -33,23 +32,18 @@ @use 'igniteui-angular/lib/core/styles//components/drop-down/drop-down-theme'; // Import calendar component and theme styles -@use 'igniteui-angular/lib/core/styles/components/calendar/calendar-component'; @use 'igniteui-angular/lib/core/styles/components/calendar/calendar-theme'; // Import chip component and theme styles -@use 'igniteui-angular/lib/core/styles/components/chip/chip-component'; @use 'igniteui-angular/lib/core/styles/components/chip/chip-theme'; // Import icon component and theme styles -@use 'igniteui-angular/lib/core/styles/components/icon/icon-component'; @use 'igniteui-angular/lib/core/styles/components/icon/icon-theme'; // Import drop-down component and theme styles -@use 'igniteui-angular/lib/core/styles/components/drop-down/drop-down-component'; @use 'igniteui-angular/lib/core/styles/components/drop-down/drop-down-theme'; // Import badge component and theme styles -@use 'igniteui-angular/lib/core/styles/components/badge/badge-component'; @use 'igniteui-angular/lib/core/styles/components/badge/badge-theme'; @@ -203,14 +197,14 @@ $black-grid-theme: grid-theme( // Define light theme for the paginator $light-paginator-theme: paginator-theme( - $background-color:color($light-theme-palette, "primary", 100), + $background:color($light-theme-palette, "primary", 100), $border-color: color($light-theme-palette, "secondary", 500) ); // Define dark theme for the paginator $dark-paginator-theme: paginator-theme( - $text-color: color($dark-theme-palette, "secondary", 700), - $background-color:color($dark-theme-palette, "primary", 500), + $foreground: color($dark-theme-palette, "secondary", 700), + $background:color($dark-theme-palette, "primary", 500), $border-color: color($dark-theme-palette, "secondary", 500) ); diff --git a/src/app/theming/tailwind/tailwind-sample.component.ts b/src/app/theming/tailwind/tailwind-sample.component.ts index 73fad6dda5..0596d9ba61 100644 --- a/src/app/theming/tailwind/tailwind-sample.component.ts +++ b/src/app/theming/tailwind/tailwind-sample.component.ts @@ -1,10 +1,9 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; @Component({ standalone: true, selector: 'app-tailwind-sample', styleUrls: ['./tailwind-sample.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, templateUrl: './tailwind-sample.component.html' }) diff --git a/src/app/tree-grid/column-group-selection/column-group-selection.component.ts b/src/app/tree-grid/column-group-selection/column-group-selection.component.ts index 0169341040..15b3e056ec 100644 --- a/src/app/tree-grid/column-group-selection/column-group-selection.component.ts +++ b/src/app/tree-grid/column-group-selection/column-group-selection.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxColumnComponent, IgxColumnGroupComponent } from 'igniteui-angular/grids/core'; import { generateEmployeeDetailedFlatData } from '../data/employees-flat-detailed'; @@ -8,7 +8,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-column-group-selection', templateUrl: './column-group-selection.component.html', styleUrls: ['./column-group-selection.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxColumnGroupComponent] }) export class TreeGridColumnGroupSelectionComponent implements OnInit { diff --git a/src/app/tree-grid/column-selection-styles/tree-grid-column-selection-style.component.ts b/src/app/tree-grid/column-selection-styles/tree-grid-column-selection-style.component.ts index 9a9ce9114f..22e6b14d4a 100644 --- a/src/app/tree-grid/column-selection-styles/tree-grid-column-selection-style.component.ts +++ b/src/app/tree-grid/column-selection-styles/tree-grid-column-selection-style.component.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, ChangeDetectorRef, Component, OnInit, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { AfterViewInit, ChangeDetectorRef, Component, OnInit, ViewChild, inject } from '@angular/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxColumnComponent } from 'igniteui-angular/grids/core'; import { ORDERS_DATA } from '../data/orders'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-column-selection-style', templateUrl: './tree-grid-column-selection-style.component.html', styleUrls: ['./tree-grid-column-selection-style.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent] }) export class TreeGridColumnSelectionStylesComponent implements OnInit, AfterViewInit { diff --git a/src/app/tree-grid/column-selection/tree-grid-column-selection.component.ts b/src/app/tree-grid/column-selection/tree-grid-column-selection.component.ts index 19b04e4d6c..98411d02c7 100644 --- a/src/app/tree-grid/column-selection/tree-grid-column-selection.component.ts +++ b/src/app/tree-grid/column-selection/tree-grid-column-selection.component.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, ChangeDetectorRef, Component, OnInit, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { AfterViewInit, ChangeDetectorRef, Component, OnInit, ViewChild, inject } from '@angular/core'; import { GridSelectionMode, IgxColumnComponent, IgxGridToolbarComponent } from 'igniteui-angular/grids/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxSelectComponent, IgxSelectItemComponent } from 'igniteui-angular/select'; @@ -12,7 +12,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-tree-grid-column-selection', templateUrl: './tree-grid-column-selection.component.html', styleUrls: ['./tree-grid-column-selection.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxSelectComponent, FormsModule, IgxLabelDirective, IgxSelectItemComponent, IgxColumnComponent] }) export class TreeGridColumnSelectionComponent implements OnInit, AfterViewInit { diff --git a/src/app/tree-grid/tgrid-editing-lifecycle-sample/tgrid-editing-lifecycle.component.ts b/src/app/tree-grid/tgrid-editing-lifecycle-sample/tgrid-editing-lifecycle.component.ts index 2ceff0466a..eebf08d051 100644 --- a/src/app/tree-grid/tgrid-editing-lifecycle-sample/tgrid-editing-lifecycle.component.ts +++ b/src/app/tree-grid/tgrid-editing-lifecycle-sample/tgrid-editing-lifecycle.component.ts @@ -1,4 +1,4 @@ -import { Component, ElementRef, Renderer2, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ElementRef, Renderer2, ViewChild, inject } from '@angular/core'; import { generateEmployeeFlatData } from '../data/employees-flat'; import { IgxSwitchComponent } from 'igniteui-angular/switch'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; @@ -11,7 +11,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tgrid-editing-lifecycle', templateUrl: 'tgrid-editing-lifecycle.component.html', styleUrls: ['tgrid-editing-lifecycle.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSwitchComponent, IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxButtonDirective, IgxIconComponent] }) export class TGridEditingLifecycleComponent { diff --git a/src/app/tree-grid/tgrid-keyboard-guide/tgrid-keyboardnav-guide.component.scss b/src/app/tree-grid/tgrid-keyboard-guide/tgrid-keyboardnav-guide.component.scss index d15b413092..0532c5af1b 100644 --- a/src/app/tree-grid/tgrid-keyboard-guide/tgrid-keyboardnav-guide.component.scss +++ b/src/app/tree-grid/tgrid-keyboard-guide/tgrid-keyboardnav-guide.component.scss @@ -8,7 +8,7 @@ $custom-checkbox-theme: checkbox-theme( ); .list-sample ::ng-deep { - @include checkbox($custom-checkbox-theme); + @include tokens($custom-checkbox-theme); } .sample { diff --git a/src/app/tree-grid/tgrid-keyboard-guide/tgrid-keyboardnav-guide.component.ts b/src/app/tree-grid/tgrid-keyboard-guide/tgrid-keyboardnav-guide.component.ts index 4aabf11b4f..62d84f1701 100644 --- a/src/app/tree-grid/tgrid-keyboard-guide/tgrid-keyboardnav-guide.component.ts +++ b/src/app/tree-grid/tgrid-keyboard-guide/tgrid-keyboardnav-guide.component.ts @@ -1,7 +1,7 @@ /* eslint-disable @angular-eslint/component-class-suffix */ /* eslint-disable @typescript-eslint/naming-convention */ import { animate, state, style, transition, trigger } from '@angular/animations'; -import { ChangeDetectorRef, Component, OnDestroy, OnInit, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { ChangeDetectorRef, Component, OnDestroy, OnInit, ViewChild, inject } from '@angular/core'; import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; import { CellType, IActiveNodeChangeEventArgs, IgxCellTemplateDirective, IgxColumnComponent, IgxColumnGroupComponent, IgxGridToolbarComponent } from 'igniteui-angular/grids/core'; import { IgxEmptyListTemplateDirective, IgxListComponent, IgxListItemComponent, IgxListLineSubTitleDirective, IgxListLineTitleDirective } from 'igniteui-angular/list'; @@ -176,7 +176,6 @@ const summaryCombinations: Item[] = [ ]) ]) ], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPaginatorComponent, IgxGridToolbarComponent, IgxColumnComponent, IgxColumnGroupComponent, IgxCellTemplateDirective, IgxListComponent, IgxListItemComponent, NgClass, IgxListLineTitleDirective, IgxListLineSubTitleDirective, IgxCheckboxComponent, IgxEmptyListTemplateDirective] }) export class TGridKeyboardnavGuide implements OnInit, OnDestroy { diff --git a/src/app/tree-grid/tree-grid-action-strip/tree-grid-action-strip-sample.ts b/src/app/tree-grid/tree-grid-action-strip/tree-grid-action-strip-sample.ts index ca8eea8c75..de79964706 100644 --- a/src/app/tree-grid/tree-grid-action-strip/tree-grid-action-strip-sample.ts +++ b/src/app/tree-grid/tree-grid-action-strip/tree-grid-action-strip-sample.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxColumnComponent, IgxGridPinningActionsComponent, RowType } from 'igniteui-angular/grids/core'; import { Transaction } from 'igniteui-angular/core'; @@ -13,7 +13,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-row-action-strip', styleUrls: [`tree-grid-action-strip-sample.scss`], templateUrl: 'tree-grid-action-strip-sample.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxActionStripComponent, IgxGridPinningActionsComponent, IgxIconButtonDirective, IgxRippleDirective, IgxIconComponent] }) export class TreeGridActionStripSampleComponent { diff --git a/src/app/tree-grid/tree-grid-add-row-sample/tree-grid-add-row-sample.component.ts b/src/app/tree-grid/tree-grid-add-row-sample/tree-grid-add-row-sample.component.ts index e2cbab4d85..2d701a2489 100644 --- a/src/app/tree-grid/tree-grid-add-row-sample/tree-grid-add-row-sample.component.ts +++ b/src/app/tree-grid/tree-grid-add-row-sample/tree-grid-add-row-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxActionStripComponent } from 'igniteui-angular/action-strip'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxCellTemplateDirective, IgxColumnComponent, IgxGridEditingActionsComponent } from 'igniteui-angular/grids/core'; @@ -10,7 +10,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-add-row-sample', styleUrls: ['./tree-grid-add-row-sample.component.scss'], templateUrl: './tree-grid-add-row-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxIconComponent, IgxActionStripComponent, IgxGridEditingActionsComponent] }) export class TreeGridAddRowSampleComponent implements OnInit { diff --git a/src/app/tree-grid/tree-grid-advanced-filtering-sample/tree-grid-advanced-filtering-sample.component.ts b/src/app/tree-grid/tree-grid-advanced-filtering-sample/tree-grid-advanced-filtering-sample.component.ts index 2c93336a8b..3928d7ed36 100644 --- a/src/app/tree-grid/tree-grid-advanced-filtering-sample/tree-grid-advanced-filtering-sample.component.ts +++ b/src/app/tree-grid/tree-grid-advanced-filtering-sample/tree-grid-advanced-filtering-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxColumnComponent, IgxGridToolbarComponent } from 'igniteui-angular/grids/core'; import { generateEmployeeFlatData } from '../data/employees-flat'; @@ -8,7 +8,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-advanced-filtering-sample', styleUrls: ['./tree-grid-advanced-filtering-sample.component.scss'], templateUrl: './tree-grid-advanced-filtering-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxColumnComponent] }) export class TreeGridAdvancedFilteringSampleComponent implements OnInit { diff --git a/src/app/tree-grid/tree-grid-advanced-filtering-style/tree-grid-advanced-filtering-style.component.ts b/src/app/tree-grid/tree-grid-advanced-filtering-style/tree-grid-advanced-filtering-style.component.ts index 3999f76b92..afc8883e60 100644 --- a/src/app/tree-grid/tree-grid-advanced-filtering-style/tree-grid-advanced-filtering-style.component.ts +++ b/src/app/tree-grid/tree-grid-advanced-filtering-style/tree-grid-advanced-filtering-style.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxColumnComponent, IgxGridToolbarComponent } from 'igniteui-angular/grids/core'; import { generateEmployeeFlatData } from '../data/employees-flat'; @@ -8,7 +8,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-advanced-filtering-style', styleUrls: ['./tree-grid-advanced-filtering-style.component.scss'], templateUrl: './tree-grid-advanced-filtering-style.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxColumnComponent] }) export class TreeGridAdvancedFilteringStyleComponent implements OnInit { diff --git a/src/app/tree-grid/tree-grid-batch-editing/tree-grid-batch-editing-sample.component.ts b/src/app/tree-grid/tree-grid-batch-editing/tree-grid-batch-editing-sample.component.ts index ae922d435c..a49d90808b 100644 --- a/src/app/tree-grid/tree-grid-batch-editing/tree-grid-batch-editing-sample.component.ts +++ b/src/app/tree-grid/tree-grid-batch-editing/tree-grid-batch-editing-sample.component.ts @@ -1,5 +1,5 @@ /* eslint-disable @typescript-eslint/naming-convention */ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxDialogComponent } from 'igniteui-angular/dialog'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; @@ -14,7 +14,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-batch-editing-sample', styleUrls: ['tree-grid-batch-editing-sample.component.scss'], templateUrl: 'tree-grid-batch-editing-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxButtonDirective, IgxDialogComponent, IgxGridComponent] }) export class TreeGridBatchEditingSampleComponent implements OnInit { diff --git a/src/app/tree-grid/tree-grid-cell-merge-custom-sample/tree-grid-cell-merge-custom-sample.component.ts b/src/app/tree-grid/tree-grid-cell-merge-custom-sample/tree-grid-cell-merge-custom-sample.component.ts index 5dea9b93b4..8aca61e784 100644 --- a/src/app/tree-grid/tree-grid-cell-merge-custom-sample/tree-grid-cell-merge-custom-sample.component.ts +++ b/src/app/tree-grid/tree-grid-cell-merge-custom-sample/tree-grid-cell-merge-custom-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { GridCellMergeMode, IgxColumnComponent, IgxGridToolbarComponent } from 'igniteui-angular/grids/core'; import { IgxSelectComponent, IgxSelectItemComponent } from 'igniteui-angular/select'; @@ -12,7 +12,6 @@ import { generateEmployeeDetailedFlatData2 } from '../data/employees-flat-detail selector: 'app-tree-grid-cell-merge-custom-sample', styleUrls: ['./tree-grid-cell-merge-custom-sample.component.scss'], templateUrl: './tree-grid-cell-merge-custom-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [ IgxTreeGridComponent, IgxPreventDocumentScrollDirective, diff --git a/src/app/tree-grid/tree-grid-cell-merge-sample/tree-grid-cell-merge-sample.component.ts b/src/app/tree-grid/tree-grid-cell-merge-sample/tree-grid-cell-merge-sample.component.ts index cad88ac58c..82408a45f1 100644 --- a/src/app/tree-grid/tree-grid-cell-merge-sample/tree-grid-cell-merge-sample.component.ts +++ b/src/app/tree-grid/tree-grid-cell-merge-sample/tree-grid-cell-merge-sample.component.ts @@ -1,4 +1,4 @@ -import { ChangeDetectorRef, Component, inject, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { ChangeDetectorRef, Component, inject, ViewChild } from '@angular/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { GridCellMergeMode, IgxColumnComponent, IgxGridToolbarComponent } from 'igniteui-angular/grids/core'; import { IgxSelectComponent, IgxSelectItemComponent } from 'igniteui-angular/select'; @@ -12,7 +12,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-tree-grid-cell-merge-sample', styleUrls: ['./tree-grid-cell-merge-sample.component.scss'], templateUrl: './tree-grid-cell-merge-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [ IgxTreeGridComponent, IgxPreventDocumentScrollDirective, diff --git a/src/app/tree-grid/tree-grid-cellSelection-sample/tree-grid-cellSelection.component.ts b/src/app/tree-grid/tree-grid-cellSelection-sample/tree-grid-cellSelection.component.ts index b0ad4ab2ff..c900d45531 100644 --- a/src/app/tree-grid/tree-grid-cellSelection-sample/tree-grid-cellSelection.component.ts +++ b/src/app/tree-grid/tree-grid-cellSelection-sample/tree-grid-cellSelection.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { GridSelectionMode, IgxColumnComponent } from 'igniteui-angular/grids/core'; import { IgxSnackbarComponent } from 'igniteui-angular/snackbar'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; @@ -12,7 +12,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-cell-selection', styleUrls: ['./tree-grid-cellSelection.component.scss'], templateUrl: 'tree-grid-cellSelection.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonGroupComponent, IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxSnackbarComponent, IgxIconComponent] }) export class TreeGridCellSelectionComponent implements OnInit { diff --git a/src/app/tree-grid/tree-grid-clipboard-operations-sample/tree-grid-clipboard-operations-sample.component.ts b/src/app/tree-grid/tree-grid-clipboard-operations-sample/tree-grid-clipboard-operations-sample.component.ts index 9de6f1a55a..556387b1a8 100644 --- a/src/app/tree-grid/tree-grid-clipboard-operations-sample/tree-grid-clipboard-operations-sample.component.ts +++ b/src/app/tree-grid/tree-grid-clipboard-operations-sample/tree-grid-clipboard-operations-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { EMPLOYEE_DATA } from './data'; import { IgxHintDirective, IgxInputDirective, IgxInputGroupComponent, IgxLabelDirective, IgxSuffixDirective } from 'igniteui-angular/input-group'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -13,7 +13,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-clipboard-operations-sample', styleUrls: ['tree-grid-clipboard-operations-sample.component.scss'], templateUrl: './tree-grid-clipboard-operations-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxInputGroupComponent, IgxLabelDirective, FormsModule, IgxInputDirective, IgxSuffixDirective, IgxIconComponent, IgxHintDirective, IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxSwitchComponent, IgxButtonDirective, IgxRippleDirective, IgxColumnComponent] }) export class TreeGridClipboardSampleComponent { diff --git a/src/app/tree-grid/tree-grid-collapsible-groups/tree-grid-collapsible-column-groups.component.ts b/src/app/tree-grid/tree-grid-collapsible-groups/tree-grid-collapsible-column-groups.component.ts index fabd8ce6d0..82a2a87486 100644 --- a/src/app/tree-grid/tree-grid-collapsible-groups/tree-grid-collapsible-column-groups.component.ts +++ b/src/app/tree-grid/tree-grid-collapsible-groups/tree-grid-collapsible-column-groups.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { GridSelectionMode, IgxCollapsibleIndicatorTemplateDirective, IgxColumnComponent, IgxColumnGroupComponent } from 'igniteui-angular/grids/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -10,7 +10,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-multi-column-headers-sample', styleUrls: ['./tree-grid-collapsible-column-groups.component.scss'], templateUrl: './tree-grid-collapsible-column-groups.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnGroupComponent, IgxCollapsibleIndicatorTemplateDirective, IgxIconComponent, IgxTooltipTargetDirective, IgxTooltipDirective, IgxColumnComponent] }) export class TreeGridMultiCollapsibleColumnGroupsComponent implements OnInit { diff --git a/src/app/tree-grid/tree-grid-column-hiding-sample/tree-grid-column-hiding-sample.component.ts b/src/app/tree-grid/tree-grid-column-hiding-sample/tree-grid-column-hiding-sample.component.ts index 98b412e41f..07543a7f6b 100644 --- a/src/app/tree-grid/tree-grid-column-hiding-sample/tree-grid-column-hiding-sample.component.ts +++ b/src/app/tree-grid/tree-grid-column-hiding-sample/tree-grid-column-hiding-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit } from '@angular/core'; import { generateEmployeeDetailedFlatData } from '../data/employees-flat-detailed'; import { IgxColumnActionsComponent, IgxColumnComponent, IgxColumnHidingDirective } from 'igniteui-angular/grids/core'; import { IgxRadioComponent } from 'igniteui-angular/radio'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-column-hiding-sample', styleUrls: ['./tree-grid-column-hiding-sample.component.scss'], templateUrl: './tree-grid-column-hiding-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxColumnActionsComponent, IgxColumnHidingDirective, IgxRadioComponent, IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent] }) export class TreeGridColumnHidingSampleComponent implements OnInit { diff --git a/src/app/tree-grid/tree-grid-column-hiding-toolbar-sample/tree-grid-column-hiding-toolbar-sample.component.ts b/src/app/tree-grid/tree-grid-column-hiding-toolbar-sample/tree-grid-column-hiding-toolbar-sample.component.ts index 81ad65a36e..3586615b41 100644 --- a/src/app/tree-grid/tree-grid-column-hiding-toolbar-sample/tree-grid-column-hiding-toolbar-sample.component.ts +++ b/src/app/tree-grid/tree-grid-column-hiding-toolbar-sample/tree-grid-column-hiding-toolbar-sample.component.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { AfterViewInit, Component, OnInit } from '@angular/core'; import { generateEmployeeDetailedFlatData } from '../data/employees-flat-detailed'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxColumnComponent, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarHidingComponent, IgxGridToolbarTitleComponent } from 'igniteui-angular/grids/core'; @@ -8,7 +8,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-column-hiding-toolbar-sample', styleUrls: ['./tree-grid-column-hiding-toolbar-sample.component.scss'], templateUrl: './tree-grid-column-hiding-toolbar-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxGridToolbarTitleComponent, IgxGridToolbarActionsComponent, IgxGridToolbarHidingComponent, IgxColumnComponent] }) export class TreeGridColumnHidingToolbarSampleComponent implements OnInit { diff --git a/src/app/tree-grid/tree-grid-column-hiding-toolbar-style/tree-grid-column-hiding-toolbar-style.component.ts b/src/app/tree-grid/tree-grid-column-hiding-toolbar-style/tree-grid-column-hiding-toolbar-style.component.ts index 2c25f6140e..9a3db91072 100644 --- a/src/app/tree-grid/tree-grid-column-hiding-toolbar-style/tree-grid-column-hiding-toolbar-style.component.ts +++ b/src/app/tree-grid/tree-grid-column-hiding-toolbar-style/tree-grid-column-hiding-toolbar-style.component.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { AfterViewInit, Component, OnInit } from '@angular/core'; import { generateEmployeeDetailedFlatData } from '../data/employees-flat-detailed'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxColumnComponent, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarHidingComponent, IgxGridToolbarTitleComponent } from 'igniteui-angular/grids/core'; @@ -8,7 +8,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-column-hiding-toolbar-style', styleUrls: ['./tree-grid-column-hiding-toolbar-style.component.scss'], templateUrl: './tree-grid-column-hiding-toolbar-style.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxGridToolbarTitleComponent, IgxGridToolbarActionsComponent, IgxGridToolbarHidingComponent, IgxColumnComponent] }) export class TreeGridColumnHidingToolbarStyleComponent implements OnInit { diff --git a/src/app/tree-grid/tree-grid-column-moving-sample/tree-grid-column-moving-sample.component.ts b/src/app/tree-grid/tree-grid-column-moving-sample/tree-grid-column-moving-sample.component.ts index 1459ceb0a3..4d999e2c1c 100644 --- a/src/app/tree-grid/tree-grid-column-moving-sample/tree-grid-column-moving-sample.component.ts +++ b/src/app/tree-grid/tree-grid-column-moving-sample/tree-grid-column-moving-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { ColumnType } from 'igniteui-angular/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxCellHeaderTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -11,7 +11,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-column-moving-sample', styleUrls: ['./tree-grid-column-moving-sample.component.scss'], templateUrl: './tree-grid-column-moving-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxCellHeaderTemplateDirective, IgxIconComponent, IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxPaginatorComponent, IgxColumnComponent] }) export class TreeGridColumnMovingSampleComponent { diff --git a/src/app/tree-grid/tree-grid-column-moving-styled-sample/tree-grid-column-moving-styled-sample.component.ts b/src/app/tree-grid/tree-grid-column-moving-styled-sample/tree-grid-column-moving-styled-sample.component.ts index 6a7efdf1d3..f9002840a2 100644 --- a/src/app/tree-grid/tree-grid-column-moving-styled-sample/tree-grid-column-moving-styled-sample.component.ts +++ b/src/app/tree-grid/tree-grid-column-moving-styled-sample/tree-grid-column-moving-styled-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { ColumnType } from 'igniteui-angular/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxCellHeaderTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -11,7 +11,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-column-moving-styled-sample', styleUrls: ['./tree-grid-column-moving-styled-sample.component.scss'], templateUrl: './tree-grid-column-moving-styled-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxCellHeaderTemplateDirective, IgxIconComponent, IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxPaginatorComponent, IgxColumnComponent] }) export class TreeGridColumnMovingStyledSampleComponent { diff --git a/src/app/tree-grid/tree-grid-column-pinning-sample/tree-grid-column-pinning-sample.component.ts b/src/app/tree-grid/tree-grid-column-pinning-sample/tree-grid-column-pinning-sample.component.ts index 5bbe137e6d..a0c1ac92b2 100644 --- a/src/app/tree-grid/tree-grid-column-pinning-sample/tree-grid-column-pinning-sample.component.ts +++ b/src/app/tree-grid/tree-grid-column-pinning-sample/tree-grid-column-pinning-sample.component.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, ChangeDetectorRef, Component, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { AfterViewInit, ChangeDetectorRef, Component, ViewChild, inject } from '@angular/core'; import { ColumnType } from 'igniteui-angular/core'; import { IgxIconComponent, IgxIconService } from 'igniteui-angular/icon'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; @@ -12,7 +12,6 @@ const FILTERING_ICONS_FONT_SET = "filtering-icons"; selector: 'app-tree-grid-column-pinning-sample', styleUrls: ['./tree-grid-column-pinning-sample.component.scss'], templateUrl: './tree-grid-column-pinning-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxCellHeaderTemplateDirective, IgxIconComponent, IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent] }) export class TreeGridColumnPinningSampleComponent implements AfterViewInit { diff --git a/src/app/tree-grid/tree-grid-column-pinning-sample/tree-grid-toolbar-pinning.component.ts b/src/app/tree-grid/tree-grid-column-pinning-sample/tree-grid-toolbar-pinning.component.ts index 5e07ab851f..e13c4985a7 100644 --- a/src/app/tree-grid/tree-grid-column-pinning-sample/tree-grid-toolbar-pinning.component.ts +++ b/src/app/tree-grid/tree-grid-column-pinning-sample/tree-grid-toolbar-pinning.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, OnInit, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild, OnInit, inject } from '@angular/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxColumnComponent, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarPinningComponent } from 'igniteui-angular/grids/core'; import { generateEmployeeDetailedFlatData } from '../data/employees-flat-detailed'; @@ -11,7 +11,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-grid-sample', styleUrls: ['tree-grid-toolbar-pinning.component.scss'], templateUrl: 'tree-grid-toolbar-pinning.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [NgClass, IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxGridToolbarActionsComponent, IgxGridToolbarPinningComponent, IgxColumnComponent] }) diff --git a/src/app/tree-grid/tree-grid-column-resizing-sample/tree-grid-column-resizing-sample.component.ts b/src/app/tree-grid/tree-grid-column-resizing-sample/tree-grid-column-resizing-sample.component.ts index f39504b6f2..01a4928b8e 100644 --- a/src/app/tree-grid/tree-grid-column-resizing-sample/tree-grid-column-resizing-sample.component.ts +++ b/src/app/tree-grid/tree-grid-column-resizing-sample/tree-grid-column-resizing-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxColumnComponent } from 'igniteui-angular/grids/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { generateEmployeeDetailedFlatData } from '../data/employees-flat-detailed'; @@ -8,7 +8,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-column-resizing-sample', styleUrls: ['./tree-grid-column-resizing-sample.component.scss'], templateUrl: './tree-grid-column-resizing-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent] }) export class TreeGridColumnResizingSampleComponent { diff --git a/src/app/tree-grid/tree-grid-conditional-cell-style-2/tree-grid-conditional-cell-style-2.component.ts b/src/app/tree-grid/tree-grid-conditional-cell-style-2/tree-grid-conditional-cell-style-2.component.ts index c40d29f618..27241b1213 100644 --- a/src/app/tree-grid/tree-grid-conditional-cell-style-2/tree-grid-conditional-cell-style-2.component.ts +++ b/src/app/tree-grid/tree-grid-conditional-cell-style-2/tree-grid-conditional-cell-style-2.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxColumnComponent } from 'igniteui-angular/grids/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxHintDirective, IgxInputDirective, IgxInputGroupComponent } from 'igniteui-angular/input-group'; @@ -11,7 +11,6 @@ import { JsonPipe } from '@angular/common'; selector: 'app-grid-conditional-cell-style-2', styleUrls: ['./tree-grid-conditional-cell-style-2.component.scss'], templateUrl: './tree-grid-conditional-cell-style-2.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxInputGroupComponent, IgxInputDirective, IgxHintDirective, IgxButtonDirective, IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, JsonPipe] }) export class TreeGridConditionalCellStyle2Component implements OnInit { diff --git a/src/app/tree-grid/tree-grid-conditional-cell-style-sample/tree-grid-conditional-cell-style-sample.component.ts b/src/app/tree-grid/tree-grid-conditional-cell-style-sample/tree-grid-conditional-cell-style-sample.component.ts index 8a3b5da53d..1c620c0429 100644 --- a/src/app/tree-grid/tree-grid-conditional-cell-style-sample/tree-grid-conditional-cell-style-sample.component.ts +++ b/src/app/tree-grid/tree-grid-conditional-cell-style-sample/tree-grid-conditional-cell-style-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit } from '@angular/core'; import { ORDERS_DATA } from '../data/orders'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-conditional-cell-style-sample', styleUrls: ['./tree-grid-conditional-cell-style-sample.component.scss'], templateUrl: './tree-grid-conditional-cell-style-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective] }) diff --git a/src/app/tree-grid/tree-grid-conditional-row-selectors/tree-grid-conditional-row-selectors.component.ts b/src/app/tree-grid/tree-grid-conditional-row-selectors/tree-grid-conditional-row-selectors.component.ts index 3ebc8b32a1..ebf06565f4 100644 --- a/src/app/tree-grid/tree-grid-conditional-row-selectors/tree-grid-conditional-row-selectors.component.ts +++ b/src/app/tree-grid/tree-grid-conditional-row-selectors/tree-grid-conditional-row-selectors.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit } from '@angular/core'; import { IRowSelectionEventArgs, IgxColumnComponent, IgxRowSelectorDirective } from 'igniteui-angular/grids/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxPaginatorComponent } from 'igniteui-angular/paginator'; @@ -10,7 +10,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-conditional-row-selectors', styleUrls: ['./tree-grid-conditional-row-selectors.component.scss'], templateUrl: 'tree-grid-conditional-row-selectors.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxPaginatorComponent, IgxColumnComponent, IgxRowSelectorDirective, IgxCheckboxComponent] }) diff --git a/src/app/tree-grid/tree-grid-disable-summaries/tree-grid-disable-summaries.component.ts b/src/app/tree-grid/tree-grid-disable-summaries/tree-grid-disable-summaries.component.ts index 1401ab624e..e0c70cf243 100644 --- a/src/app/tree-grid/tree-grid-disable-summaries/tree-grid-disable-summaries.component.ts +++ b/src/app/tree-grid/tree-grid-disable-summaries/tree-grid-disable-summaries.component.ts @@ -134,7 +134,6 @@ class DeliveredSummary { selector: "app-tree-grid-summary-sample", styleUrls: ["./tree-grid-disable-summaries.component.scss"], templateUrl: "./tree-grid-disable-summaries.component.html", - changeDetection: ChangeDetectionStrategy.Eager, imports: [ IgxTreeGridComponent, IgxPreventDocumentScrollDirective, diff --git a/src/app/tree-grid/tree-grid-displaydensity-sample/tree-grid-displaydensity-sample.component.ts b/src/app/tree-grid/tree-grid-displaydensity-sample/tree-grid-displaydensity-sample.component.ts index 290e98c3a4..5eed114b9a 100644 --- a/src/app/tree-grid/tree-grid-displaydensity-sample/tree-grid-displaydensity-sample.component.ts +++ b/src/app/tree-grid/tree-grid-displaydensity-sample/tree-grid-displaydensity-sample.component.ts @@ -1,7 +1,7 @@ -import { Component, HostBinding, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, HostBinding, OnInit, ViewChild } from '@angular/core'; import { IgxButtonGroupComponent } from 'igniteui-angular/button-group'; -import { IgxCellTemplateDirective, IgxColumnComponent, IgxColumnGroupComponent, IgxNumberSummaryOperand, IgxSummaryOperand } from 'igniteui-angular/grids/core'; -import { IgxSummaryResult } from 'igniteui-angular/core'; +import { IgxCellTemplateDirective, IgxColumnComponent, IgxColumnGroupComponent } from 'igniteui-angular/grids/core'; +import { IgxNumberSummaryOperand, IgxSummaryOperand, IgxSummaryResult } from 'igniteui-angular/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { generateEmployeeDetailedFlatData } from '../data/employees-flat-detailed'; import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scroll.directive'; @@ -28,7 +28,6 @@ class CustomNumberSummary { selector: 'app-tree-grid-displaydensity-sample', styleUrls: ['./tree-grid-displaydensity-sample.component.scss'], templateUrl: './tree-grid-displaydensity-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonGroupComponent, IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxColumnGroupComponent, IgxCellTemplateDirective, DatePipe] }) export class TreeGridDisplaydensitySampleComponent implements OnInit { diff --git a/src/app/tree-grid/tree-grid-editing-events/tree-grid-editing-events.component.ts b/src/app/tree-grid/tree-grid-editing-events/tree-grid-editing-events.component.ts index e06120d847..c755d5014a 100644 --- a/src/app/tree-grid/tree-grid-editing-events/tree-grid-editing-events.component.ts +++ b/src/app/tree-grid/tree-grid-editing-events/tree-grid-editing-events.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IGridEditEventArgs, IgxColumnComponent } from 'igniteui-angular/grids/core'; import { IgxToastComponent } from 'igniteui-angular/toast'; import { VerticalAlignment } from 'igniteui-angular/core'; @@ -10,7 +10,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-editing-events', templateUrl: 'tree-grid-editing-events.component.html', styleUrls: ['tree-grid-editing-events.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxToastComponent] }) export class TreeGridEditingEventsComponent implements OnInit { diff --git a/src/app/tree-grid/tree-grid-editing-sample/tree-grid-editing-sample.component.ts b/src/app/tree-grid/tree-grid-editing-sample/tree-grid-editing-sample.component.ts index f02e755261..3b52b2fc71 100644 --- a/src/app/tree-grid/tree-grid-editing-sample/tree-grid-editing-sample.component.ts +++ b/src/app/tree-grid/tree-grid-editing-sample/tree-grid-editing-sample.component.ts @@ -1,7 +1,7 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxDialogComponent } from 'igniteui-angular/dialog'; -import { IgxCellTemplateDirective, IgxColumnComponent, IgxNumberSummaryOperand, IgxSummaryOperand } from 'igniteui-angular/grids/core'; -import { IgxSummaryResult } from 'igniteui-angular/core'; +import { IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; +import { IgxNumberSummaryOperand, IgxSummaryOperand, IgxSummaryResult } from 'igniteui-angular/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxButtonDirective, IgxIconButtonDirective } from 'igniteui-angular/directives'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -36,7 +36,6 @@ class CustomNumberSummary { selector: 'app-tree-grid-editing-sample', styleUrls: ['./tree-grid-editing-sample.component.scss'], templateUrl: './tree-grid-editing-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxIconComponent, IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxPaginatorComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxIconButtonDirective, IgxDialogComponent, IgxInputGroupComponent, IgxLabelDirective, FormsModule, IgxInputDirective, IgxDatePickerComponent, IgxCheckboxComponent] }) export class TreeGridEditingSampleComponent implements OnInit { diff --git a/src/app/tree-grid/tree-grid-editing-style/tree-grid-editing-sample.component.ts b/src/app/tree-grid/tree-grid-editing-style/tree-grid-editing-sample.component.ts index d9a6f1d6f9..fce61da1d7 100644 --- a/src/app/tree-grid/tree-grid-editing-style/tree-grid-editing-sample.component.ts +++ b/src/app/tree-grid/tree-grid-editing-style/tree-grid-editing-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxPaginatorComponent } from 'igniteui-angular/paginator'; import { IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -10,7 +10,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-editing-sample', styleUrls: ['./tree-grid-editing-sample.component.scss'], templateUrl: './tree-grid-editing-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxPaginatorComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxIconComponent] }) export class TreeGridEditingStyleComponent implements OnInit { diff --git a/src/app/tree-grid/tree-grid-employees-sample/tree-grid-employees-sample.component.ts b/src/app/tree-grid/tree-grid-employees-sample/tree-grid-employees-sample.component.ts index 49709c870b..9eae464d37 100644 --- a/src/app/tree-grid/tree-grid-employees-sample/tree-grid-employees-sample.component.ts +++ b/src/app/tree-grid/tree-grid-employees-sample/tree-grid-employees-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit } from '@angular/core'; import { GridSelectionMode, IgxCSVTextDirective, IgxColumnComponent, IgxExcelTextDirective, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarExporterComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent, IgxGridToolbarTitleComponent } from 'igniteui-angular/grids/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxPaginatorComponent } from 'igniteui-angular/paginator'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-employees-sample', styleUrls: ['./tree-grid-employees-sample.component.scss'], templateUrl: './tree-grid-employees-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxPaginatorComponent, IgxGridToolbarComponent, IgxGridToolbarTitleComponent, IgxGridToolbarActionsComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent, IgxGridToolbarExporterComponent, IgxExcelTextDirective, IgxCSVTextDirective, IgxColumnComponent] }) export class TreeGridEmployeesSampleComponent implements OnInit { diff --git a/src/app/tree-grid/tree-grid-excel-style-filtering-load-on-demand/tree-grid-excel-style-filtering-load-on-demand.component.ts b/src/app/tree-grid/tree-grid-excel-style-filtering-load-on-demand/tree-grid-excel-style-filtering-load-on-demand.component.ts index 225decf03b..7e58fd3cca 100644 --- a/src/app/tree-grid/tree-grid-excel-style-filtering-load-on-demand/tree-grid-excel-style-filtering-load-on-demand.component.ts +++ b/src/app/tree-grid/tree-grid-excel-style-filtering-load-on-demand/tree-grid-excel-style-filtering-load-on-demand.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, inject } from '@angular/core'; import { ColumnType, IFilteringExpressionsTree } from 'igniteui-angular/core'; import { IgxCellTemplateDirective, IgxColumnComponent, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent } from 'igniteui-angular/grids/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; @@ -11,7 +11,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro styleUrls: ['./tree-grid-excel-style-filtering-load-on-demand.component.scss'], templateUrl: './tree-grid-excel-style-filtering-load-on-demand.component.html', providers: [RemoteValuesService], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxGridToolbarActionsComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxIconComponent] }) export class TreeGridExcelStyleFilteringLoadOnDemandComponent implements OnInit { diff --git a/src/app/tree-grid/tree-grid-excel-style-filtering-sample-1/tree-grid-excel-style-filtering-sample-1.component.ts b/src/app/tree-grid/tree-grid-excel-style-filtering-sample-1/tree-grid-excel-style-filtering-sample-1.component.ts index bc9ba4c35a..511bc406f6 100644 --- a/src/app/tree-grid/tree-grid-excel-style-filtering-sample-1/tree-grid-excel-style-filtering-sample-1.component.ts +++ b/src/app/tree-grid/tree-grid-excel-style-filtering-sample-1/tree-grid-excel-style-filtering-sample-1.component.ts @@ -1,4 +1,4 @@ -import { Component, HostBinding, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, HostBinding, OnInit, ViewChild } from '@angular/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { TreeGridFilteringStrategy } from 'igniteui-angular/core'; import { IgxButtonGroupComponent } from 'igniteui-angular/button-group'; @@ -11,7 +11,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-excel-style-filtering-sample-1', styleUrls: ['./tree-grid-excel-style-filtering-sample-1.component.scss'], templateUrl: 'tree-grid-excel-style-filtering-sample-1.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonGroupComponent, IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxGridToolbarActionsComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent, IgxColumnComponent, IgxCellTemplateDirective] }) diff --git a/src/app/tree-grid/tree-grid-excel-style-filtering-sample-2/tree-grid-excel-style-filtering-sample-2.component.ts b/src/app/tree-grid/tree-grid-excel-style-filtering-sample-2/tree-grid-excel-style-filtering-sample-2.component.ts index 134361f243..ae4602b29e 100644 --- a/src/app/tree-grid/tree-grid-excel-style-filtering-sample-2/tree-grid-excel-style-filtering-sample-2.component.ts +++ b/src/app/tree-grid/tree-grid-excel-style-filtering-sample-2/tree-grid-excel-style-filtering-sample-2.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxCellTemplateDirective, IgxColumnComponent, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent } from 'igniteui-angular/grids/core'; import { ORDERS_DATA } from '../data/orders'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-excel-style-filtering-sample-2', styleUrls: ['./tree-grid-excel-style-filtering-sample-2.component.scss'], templateUrl: 'tree-grid-excel-style-filtering-sample-2.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxGridToolbarActionsComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent, IgxColumnComponent, IgxCellTemplateDirective] }) diff --git a/src/app/tree-grid/tree-grid-excel-style-filtering-sample-3/tree-grid-excel-style-filtering-sample-3.component.ts b/src/app/tree-grid/tree-grid-excel-style-filtering-sample-3/tree-grid-excel-style-filtering-sample-3.component.ts index 0419b9074e..197b3298f6 100644 --- a/src/app/tree-grid/tree-grid-excel-style-filtering-sample-3/tree-grid-excel-style-filtering-sample-3.component.ts +++ b/src/app/tree-grid/tree-grid-excel-style-filtering-sample-3/tree-grid-excel-style-filtering-sample-3.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxCellTemplateDirective, IgxColumnComponent, IgxExcelStyleColumnOperationsTemplateDirective, IgxExcelStyleFilterOperationsTemplateDirective, IgxExcelStyleHeaderComponent, IgxExcelStyleHeaderIconDirective, IgxExcelStyleSearchComponent, IgxExcelStyleSortingComponent, IgxGridExcelStyleFilteringComponent, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarHidingComponent } from 'igniteui-angular/grids/core'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -10,7 +10,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-excel-style-filtering-sample-3', styleUrls: ['./tree-grid-excel-style-filtering-sample-3.component.scss'], templateUrl: 'tree-grid-excel-style-filtering-sample-3.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxGridToolbarActionsComponent, IgxGridToolbarHidingComponent, IgxExcelStyleHeaderIconDirective, IgxIconComponent, IgxGridExcelStyleFilteringComponent, IgxExcelStyleColumnOperationsTemplateDirective, IgxExcelStyleHeaderComponent, IgxExcelStyleSortingComponent, IgxExcelStyleFilterOperationsTemplateDirective, IgxExcelStyleSearchComponent, IgxColumnComponent, IgxCellTemplateDirective] }) diff --git a/src/app/tree-grid/tree-grid-excel-style-filtering-style/tree-grid-excel-style-filtering-style.component.ts b/src/app/tree-grid/tree-grid-excel-style-filtering-style/tree-grid-excel-style-filtering-style.component.ts index 6c12db07bd..a27701a5af 100644 --- a/src/app/tree-grid/tree-grid-excel-style-filtering-style/tree-grid-excel-style-filtering-style.component.ts +++ b/src/app/tree-grid/tree-grid-excel-style-filtering-style/tree-grid-excel-style-filtering-style.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; import { ORDERS_DATA } from '../data/orders'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-excel-style-filtering-style', styleUrls: ['./tree-grid-excel-style-filtering-style.component.scss'], templateUrl: 'tree-grid-excel-style-filtering-style.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective] }) export class TreeGridExcelStyleFilteringStyleComponent implements OnInit { diff --git a/src/app/tree-grid/tree-grid-export-visualization/tree-grid-export-visualization.component.ts b/src/app/tree-grid/tree-grid-export-visualization/tree-grid-export-visualization.component.ts index ad5fbc8d7c..30da3785ad 100644 --- a/src/app/tree-grid/tree-grid-export-visualization/tree-grid-export-visualization.component.ts +++ b/src/app/tree-grid/tree-grid-export-visualization/tree-grid-export-visualization.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component, inject, ChangeDetectorRef } from '@angular/core'; import { ORDERS_DATA } from '../data/orders'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxCellTemplateDirective, IgxColumnComponent, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarExporterComponent } from 'igniteui-angular/grids/core'; @@ -10,10 +10,10 @@ import { CurrencyPipe } from '@angular/common'; selector: 'app-tree-grid-export-visualization', templateUrl: './tree-grid-export-visualization.component.html', styleUrls: ['./tree-grid-export-visualization.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxGridToolbarActionsComponent, IgxButtonDirective, IgxGridToolbarExporterComponent, IgxColumnComponent, IgxCellTemplateDirective, CurrencyPipe] }) export class TreeGridExportVisualizationComponent { + private cdr = inject(ChangeDetectorRef); public localData = []; private data = ORDERS_DATA; @@ -37,6 +37,9 @@ export class TreeGridExportVisualizationComponent { longRunning(toolbar: any) { toolbar.showProgress = true; - setTimeout(() => toolbar.showProgress = false, 5000); + setTimeout(() => { + toolbar.showProgress = false; + this.cdr.markForCheck(); + }, 5000); } } diff --git a/src/app/tree-grid/tree-grid-external-advanced-filtering/tree-grid-external-advanced-filtering.component.ts b/src/app/tree-grid/tree-grid-external-advanced-filtering/tree-grid-external-advanced-filtering.component.ts index 4099abddd9..8494f8152a 100644 --- a/src/app/tree-grid/tree-grid-external-advanced-filtering/tree-grid-external-advanced-filtering.component.ts +++ b/src/app/tree-grid/tree-grid-external-advanced-filtering/tree-grid-external-advanced-filtering.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit } from '@angular/core'; import { ORDERS_DATA } from '../data/orders'; import { IgxAdvancedFilteringDialogComponent, IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-external-advanced-filtering', templateUrl: './tree-grid-external-advanced-filtering.component.html', styleUrls: ['./tree-grid-external-advanced-filtering.component.scss'], - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxAdvancedFilteringDialogComponent, IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective] }) export class TreeGridExternalAdvancedFilteringComponent { diff --git a/src/app/tree-grid/tree-grid-external-excel-style-filtering/tree-grid-external-excel-style-filtering.component.ts b/src/app/tree-grid/tree-grid-external-excel-style-filtering/tree-grid-external-excel-style-filtering.component.ts index ceb5b638b9..ec52d497c5 100644 --- a/src/app/tree-grid/tree-grid-external-excel-style-filtering/tree-grid-external-excel-style-filtering.component.ts +++ b/src/app/tree-grid/tree-grid-external-excel-style-filtering/tree-grid-external-excel-style-filtering.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy, OnInit } from '@angular/core'; +import { Component, ViewChild, OnInit } from '@angular/core'; import { ORDERS_DATA } from '../data/orders'; import { IgxSelectComponent, IgxSelectItemComponent } from 'igniteui-angular/select'; import { IgxLabelDirective } from 'igniteui-angular/input-group'; @@ -8,7 +8,6 @@ import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scroll.directive'; @Component({ - changeDetection: ChangeDetectionStrategy.OnPush, selector: 'app-tree-grid-external-excel-style-filtering', templateUrl: './tree-grid-external-excel-style-filtering.component.html', styleUrls: ['./tree-grid-external-excel-style-filtering.component.scss'], diff --git a/src/app/tree-grid/tree-grid-external-outlet/tree-grid-external-outlet-sample.component.ts b/src/app/tree-grid/tree-grid-external-outlet/tree-grid-external-outlet-sample.component.ts index 83b3f283cc..91aae84917 100644 --- a/src/app/tree-grid/tree-grid-external-outlet/tree-grid-external-outlet-sample.component.ts +++ b/src/app/tree-grid/tree-grid-external-outlet/tree-grid-external-outlet-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit } from '@angular/core'; import { ORDERS_DATA } from '../data/orders'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxCellTemplateDirective, IgxColumnComponent, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarHidingComponent } from 'igniteui-angular/grids/core'; @@ -10,7 +10,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-external-outlet', styleUrls: ['./tree-grid-external-outlet-sample.component.scss'], templateUrl: 'tree-grid-external-outlet-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxGridToolbarActionsComponent, IgxGridToolbarHidingComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxOverlayOutletDirective] }) diff --git a/src/app/tree-grid/tree-grid-filtering-custom-sample/tree-grid-filtering-custom-sample.component.ts b/src/app/tree-grid/tree-grid-filtering-custom-sample/tree-grid-filtering-custom-sample.component.ts index e014240e4b..82ebd800dd 100644 --- a/src/app/tree-grid/tree-grid-filtering-custom-sample/tree-grid-filtering-custom-sample.component.ts +++ b/src/app/tree-grid/tree-grid-filtering-custom-sample/tree-grid-filtering-custom-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit } from '@angular/core'; import { IFilteringOperation, IgxBooleanFilteringOperand, IgxStringFilteringOperand } from 'igniteui-angular/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -10,7 +10,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-filtering-custom-sample', styleUrls: ['./tree-grid-filtering-custom-sample.component.scss'], templateUrl: './tree-grid-filtering-custom-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective] }) export class TreeGridFilteringCustomSampleComponent implements OnInit { diff --git a/src/app/tree-grid/tree-grid-filtering-sample/tree-grid-filtering-sample.component.ts b/src/app/tree-grid/tree-grid-filtering-sample/tree-grid-filtering-sample.component.ts index 34b9e0fe40..7b9b960939 100644 --- a/src/app/tree-grid/tree-grid-filtering-sample/tree-grid-filtering-sample.component.ts +++ b/src/app/tree-grid/tree-grid-filtering-sample/tree-grid-filtering-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxStringFilteringOperand } from 'igniteui-angular/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxInputDirective, IgxInputGroupComponent } from 'igniteui-angular/input-group'; @@ -11,7 +11,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-filtering-sample', styleUrls: ['./tree-grid-filtering-sample.component.scss'], templateUrl: 'tree-grid-filtering-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxInputGroupComponent, IgxInputDirective, IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective] }) diff --git a/src/app/tree-grid/tree-grid-filtering-style/tree-grid-filtering-style.component.ts b/src/app/tree-grid/tree-grid-filtering-style/tree-grid-filtering-style.component.ts index 5be2ca820a..eacfbd76d5 100644 --- a/src/app/tree-grid/tree-grid-filtering-style/tree-grid-filtering-style.component.ts +++ b/src/app/tree-grid/tree-grid-filtering-style/tree-grid-filtering-style.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit } from '@angular/core'; import { ORDERS_DATA } from '../data/orders'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-filtering-style', styleUrls: ['./tree-grid-filtering-style.component.scss'], templateUrl: './tree-grid-filtering-style.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective] }) export class TreeGridFilteringStyleComponent implements OnInit { diff --git a/src/app/tree-grid/tree-grid-filtering-template-sample/tree-grid-filtering-template-sample.component.ts b/src/app/tree-grid/tree-grid-filtering-template-sample/tree-grid-filtering-template-sample.component.ts index 887b5a4674..5c5498c13d 100644 --- a/src/app/tree-grid/tree-grid-filtering-template-sample/tree-grid-filtering-template-sample.component.ts +++ b/src/app/tree-grid/tree-grid-filtering-template-sample/tree-grid-filtering-template-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { ColumnType, GridColumnDataType, IgxDateFilteringOperand, IgxNumberFilteringOperand, IgxPickerClearComponent, IgxPickerToggleComponent, IgxStringFilteringOperand } from 'igniteui-angular/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxCellTemplateDirective, IgxColumnComponent, IgxFilterCellTemplateDirective } from 'igniteui-angular/grids/core'; @@ -13,7 +13,6 @@ import { CurrencyPipe } from '@angular/common'; selector: 'app-tree-grid-filtering-template-sample', styleUrls: ['./tree-grid-filtering-template-sample.component.scss'], templateUrl: 'tree-grid-filtering-template-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxFilterCellTemplateDirective, IgxInputGroupComponent, IgxPrefixDirective, IgxIconComponent, IgxInputDirective, IgxSuffixDirective, IgxDatePickerComponent, IgxPickerToggleComponent, IgxPickerClearComponent, CurrencyPipe] }) diff --git a/src/app/tree-grid/tree-grid-formatted-filtering-strategy/tree-grid-formatted-filtering-strategy.component.ts b/src/app/tree-grid/tree-grid-formatted-filtering-strategy/tree-grid-formatted-filtering-strategy.component.ts index 9410d2eb79..3db0bca449 100644 --- a/src/app/tree-grid/tree-grid-formatted-filtering-strategy/tree-grid-formatted-filtering-strategy.component.ts +++ b/src/app/tree-grid/tree-grid-formatted-filtering-strategy/tree-grid-formatted-filtering-strategy.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { TreeGridFormattedValuesFilteringStrategy } from 'igniteui-angular/core'; import { IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -10,7 +10,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-formatted-filtering-strategy', styleUrls: ['./tree-grid-formatted-filtering-strategy.component.scss'], templateUrl: 'tree-grid-formatted-filtering-strategy.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective] }) diff --git a/src/app/tree-grid/tree-grid-group-by-load-on-demand-sample/tree-grid-group-by-load-on-demand-sample.component.ts b/src/app/tree-grid/tree-grid-group-by-load-on-demand-sample/tree-grid-group-by-load-on-demand-sample.component.ts index 8fdc63a579..d8eb3943fd 100644 --- a/src/app/tree-grid/tree-grid-group-by-load-on-demand-sample/tree-grid-group-by-load-on-demand-sample.component.ts +++ b/src/app/tree-grid/tree-grid-group-by-load-on-demand-sample/tree-grid-group-by-load-on-demand-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, Input, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, Input, OnInit, ViewChild } from '@angular/core'; import { DefaultSortingStrategy, IGroupingExpression } from 'igniteui-angular/core'; import { IgxTreeGridComponent, IgxTreeGridGroupByAreaComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-group-by-load-on-demand-sample', styleUrls: ['./tree-grid-group-by-load-on-demand-sample.component.scss'], templateUrl: './tree-grid-group-by-load-on-demand-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxTreeGridGroupByAreaComponent, IgxColumnComponent] }) diff --git a/src/app/tree-grid/tree-grid-keyboard-navigation/tree-grid-keyboard-navigation-sample.component.ts b/src/app/tree-grid/tree-grid-keyboard-navigation/tree-grid-keyboard-navigation-sample.component.ts index 17993eb8bf..440cb7a71f 100644 --- a/src/app/tree-grid/tree-grid-keyboard-navigation/tree-grid-keyboard-navigation-sample.component.ts +++ b/src/app/tree-grid/tree-grid-keyboard-navigation/tree-grid-keyboard-navigation-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { CellType, GridSelectionMode, IGridKeydownEventArgs, IgxColumnComponent } from 'igniteui-angular/grids/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxPaginatorComponent } from 'igniteui-angular/paginator'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-keyboard-navigation-sample', styleUrls: ['./tree-grid-keyboard-navigation-sample.component.scss'], templateUrl: './tree-grid-keyboard-navigation-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxPaginatorComponent, IgxColumnComponent] }) export class TreeGridKBNavigationComponent implements OnInit { diff --git a/src/app/tree-grid/tree-grid-load-on-demand-sample/tree-grid-load-on-demand-sample.component.ts b/src/app/tree-grid/tree-grid-load-on-demand-sample/tree-grid-load-on-demand-sample.component.ts index 24f65e9b00..28f0e4834c 100644 --- a/src/app/tree-grid/tree-grid-load-on-demand-sample/tree-grid-load-on-demand-sample.component.ts +++ b/src/app/tree-grid/tree-grid-load-on-demand-sample/tree-grid-load-on-demand-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxColumnComponent } from 'igniteui-angular/grids/core'; import { TreeGridLoadOnDemandService } from './remoteService'; @@ -8,7 +8,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-load-on-demand-sample', styleUrls: ['./tree-grid-load-on-demand-sample.component.scss'], templateUrl: './tree-grid-load-on-demand-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent] }) export class TreeGridLoadOnDemandSampleComponent implements OnInit { diff --git a/src/app/tree-grid/tree-grid-multi-cell-selection-style/tree-grid-multi-cell-selection-style.component.ts b/src/app/tree-grid/tree-grid-multi-cell-selection-style/tree-grid-multi-cell-selection-style.component.ts index 85d8e447c6..269f9f376e 100644 --- a/src/app/tree-grid/tree-grid-multi-cell-selection-style/tree-grid-multi-cell-selection-style.component.ts +++ b/src/app/tree-grid/tree-grid-multi-cell-selection-style/tree-grid-multi-cell-selection-style.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxColumnComponent } from 'igniteui-angular/grids/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { ORDERS_DATA } from '../data/orders'; @@ -8,7 +8,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-multi-cell-selection-style-sample', styleUrls: ['./tree-grid-multi-cell-selection-style.component.scss'], templateUrl: './tree-grid-multi-cell-selection-style.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent] }) export class TreeGridMultiCellSelectionStyleComponent { diff --git a/src/app/tree-grid/tree-grid-multi-cell-selection/tree-grid-multi-cell-selection.component.ts b/src/app/tree-grid/tree-grid-multi-cell-selection/tree-grid-multi-cell-selection.component.ts index d2d7240327..07e47bad26 100644 --- a/src/app/tree-grid/tree-grid-multi-cell-selection/tree-grid-multi-cell-selection.component.ts +++ b/src/app/tree-grid/tree-grid-multi-cell-selection/tree-grid-multi-cell-selection.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewEncapsulation, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewEncapsulation } from '@angular/core'; import { IgxColumnComponent } from 'igniteui-angular/grids/core'; import { IgxGridComponent } from 'igniteui-angular/grids/grid'; import { IgxToastComponent } from 'igniteui-angular/toast'; @@ -12,7 +12,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-multi-cell-selection-sample', styleUrls: ['./tree-grid-multi-cell-selection.component.scss'], templateUrl: './tree-grid-multi-cell-selection.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxGridComponent, IgxToastComponent] }) export class TreeGridMultiCellSelectionComponent { diff --git a/src/app/tree-grid/tree-grid-multi-column-header-template-sample/tree-grid-multi-column-header-template-sample.component.ts b/src/app/tree-grid/tree-grid-multi-column-header-template-sample/tree-grid-multi-column-header-template-sample.component.ts index c4f428bd14..51abd2d449 100644 --- a/src/app/tree-grid/tree-grid-multi-column-header-template-sample/tree-grid-multi-column-header-template-sample.component.ts +++ b/src/app/tree-grid/tree-grid-multi-column-header-template-sample/tree-grid-multi-column-header-template-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { GridSelectionMode, IgxColumnComponent, IgxColumnGroupComponent } from 'igniteui-angular/grids/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-multi-column-header-template-sample', styleUrls: ['./tree-grid-multi-column-header-template-sample.component.scss'], templateUrl: './tree-grid-multi-column-header-template-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxIconComponent, IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxColumnGroupComponent] }) export class TreeGridMultiColumnHeaderTemplateSampleComponent { diff --git a/src/app/tree-grid/tree-grid-multi-column-headers-export/tree-grid-multi-column-headers-export.component.ts b/src/app/tree-grid/tree-grid-multi-column-headers-export/tree-grid-multi-column-headers-export.component.ts index 62f0eb2cc8..ab97f99b4b 100644 --- a/src/app/tree-grid/tree-grid-multi-column-headers-export/tree-grid-multi-column-headers-export.component.ts +++ b/src/app/tree-grid/tree-grid-multi-column-headers-export/tree-grid-multi-column-headers-export.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { GridSelectionMode, IgxColumnComponent, IgxColumnGroupComponent, IgxExporterEvent, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarExporterComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent } from 'igniteui-angular/grids/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxSwitchComponent } from 'igniteui-angular/switch'; @@ -10,7 +10,6 @@ import { FormsModule } from '@angular/forms'; selector: 'app-tree-grid-multi-column-headers-export-sample', styleUrls: ['./tree-grid-multi-column-headers-export.component.scss'], templateUrl: './tree-grid-multi-column-headers-export.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxGridToolbarActionsComponent, IgxSwitchComponent, FormsModule, IgxGridToolbarPinningComponent, IgxGridToolbarHidingComponent, IgxGridToolbarExporterComponent, IgxColumnComponent, IgxColumnGroupComponent] }) export class TreeGridMultiColumnHeadersExportComponent { diff --git a/src/app/tree-grid/tree-grid-multi-column-headers-sample/tree-grid-multi-column-headers-sample.component.ts b/src/app/tree-grid/tree-grid-multi-column-headers-sample/tree-grid-multi-column-headers-sample.component.ts index e304f6a915..7273c5fb70 100644 --- a/src/app/tree-grid/tree-grid-multi-column-headers-sample/tree-grid-multi-column-headers-sample.component.ts +++ b/src/app/tree-grid/tree-grid-multi-column-headers-sample/tree-grid-multi-column-headers-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { GridSelectionMode, IgxColumnComponent, IgxColumnGroupComponent } from 'igniteui-angular/grids/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxButtonDirective } from 'igniteui-angular/directives'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-multi-column-headers-sample', styleUrls: ['./tree-grid-multi-column-headers-sample.component.scss'], templateUrl: './tree-grid-multi-column-headers-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxColumnGroupComponent, IgxButtonDirective] }) export class TreeGridMultiColumnHeadersSampleComponent { diff --git a/src/app/tree-grid/tree-grid-multi-column-headers-styling/tree-grid-multi-column-headers-styling.component.ts b/src/app/tree-grid/tree-grid-multi-column-headers-styling/tree-grid-multi-column-headers-styling.component.ts index 097ea0dfba..dbd590f562 100644 --- a/src/app/tree-grid/tree-grid-multi-column-headers-styling/tree-grid-multi-column-headers-styling.component.ts +++ b/src/app/tree-grid/tree-grid-multi-column-headers-styling/tree-grid-multi-column-headers-styling.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { generateEmployeeDetailedFlatData } from '../data/employees-flat-detailed'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxColumnComponent, IgxColumnGroupComponent } from 'igniteui-angular/grids/core'; @@ -8,7 +8,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-multi-column-headers-styling', styleUrls: ['./tree-grid-multi-column-headers-styling.component.scss'], templateUrl: './tree-grid-multi-column-headers-styling.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxColumnGroupComponent] }) export class TreeGridMultiColumnHeadersStylingComponent { diff --git a/src/app/tree-grid/tree-grid-multi-row-drag/tree-grid-multi-row-drag.component.ts b/src/app/tree-grid/tree-grid-multi-row-drag/tree-grid-multi-row-drag.component.ts index b98056d38f..3881c33fa2 100644 --- a/src/app/tree-grid/tree-grid-multi-row-drag/tree-grid-multi-row-drag.component.ts +++ b/src/app/tree-grid/tree-grid-multi-row-drag/tree-grid-multi-row-drag.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { GridSelectionMode, IgxColumnComponent, IgxRowDragGhostDirective } from 'igniteui-angular/grids/core'; import { IDropDroppedEventArgs, IgxDropDirective } from 'igniteui-angular/directives'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; @@ -11,7 +11,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-multi-row-drag', styleUrls: ['tree-grid-multi-row-drag.component.scss'], templateUrl: 'tree-grid-multi-row-drag.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxDropDirective, IgxIconComponent, IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxPaginatorComponent, IgxColumnComponent, IgxRowDragGhostDirective] }) export class TreeGridMultiRowDragComponent { diff --git a/src/app/tree-grid/tree-grid-pager-sample/tree-grid-pager-sample.component.ts b/src/app/tree-grid/tree-grid-pager-sample/tree-grid-pager-sample.component.ts index 062eb128e2..8216487ded 100644 --- a/src/app/tree-grid/tree-grid-pager-sample/tree-grid-pager-sample.component.ts +++ b/src/app/tree-grid/tree-grid-pager-sample/tree-grid-pager-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, AfterViewInit, PLATFORM_ID, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild, AfterViewInit, PLATFORM_ID, inject } from '@angular/core'; import { IPaginatorResourceStrings } from 'igniteui-angular/core'; import { IgxPageNavigationComponent, IgxPageSizeSelectorComponent, IgxPaginatorComponent, IgxPaginatorContentDirective } from 'igniteui-angular/paginator'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; @@ -14,7 +14,6 @@ import { isPlatformBrowser } from '@angular/common'; selector: 'app-tree-grid-pager-sample', styleUrls: ['./tree-grid-pager-sample.component.scss'], templateUrl: './tree-grid-pager-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxPaginatorComponent, IgxPaginatorContentDirective, IgxPageSizeSelectorComponent, IgxPageNavigationComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxSwitchComponent, FormsModule] }) export class TreeGridPagerSampleComponent implements OnInit, AfterViewInit { diff --git a/src/app/tree-grid/tree-grid-paging-sample/tree-grid-paging-sample.component.scss b/src/app/tree-grid/tree-grid-paging-sample/tree-grid-paging-sample.component.scss index c36c25d405..9c38781b8c 100644 --- a/src/app/tree-grid/tree-grid-paging-sample/tree-grid-paging-sample.component.scss +++ b/src/app/tree-grid/tree-grid-paging-sample/tree-grid-paging-sample.component.scss @@ -6,7 +6,7 @@ $progressBar-sample-theme: progress-linear-theme( ); .grid__wrapper { - @include progress-linear($progressBar-sample-theme); + @include tokens($progressBar-sample-theme); --ig-size: var(--ig-size-medium); margin: 0 16px; diff --git a/src/app/tree-grid/tree-grid-paging-sample/tree-grid-paging-sample.component.ts b/src/app/tree-grid/tree-grid-paging-sample/tree-grid-paging-sample.component.ts index b99f3df167..5992fb9ae1 100644 --- a/src/app/tree-grid/tree-grid-paging-sample/tree-grid-paging-sample.component.ts +++ b/src/app/tree-grid/tree-grid-paging-sample/tree-grid-paging-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ViewEncapsulation, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild, ViewEncapsulation } from '@angular/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxPaginatorComponent } from 'igniteui-angular/paginator'; import { IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -11,7 +11,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-paging-sample', styleUrls: ['./tree-grid-paging-sample.component.scss'], templateUrl: 'tree-grid-paging-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxPaginatorComponent, IgxColumnComponent, IgxCellTemplateDirective] }) diff --git a/src/app/tree-grid/tree-grid-paging-style/tree-grid-paging-style-sample.component.ts b/src/app/tree-grid/tree-grid-paging-style/tree-grid-paging-style-sample.component.ts index 6470b2eb9e..a42c3d8a7f 100644 --- a/src/app/tree-grid/tree-grid-paging-style/tree-grid-paging-style-sample.component.ts +++ b/src/app/tree-grid/tree-grid-paging-style/tree-grid-paging-style-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit } from '@angular/core'; import { ORDERS_DATA } from '../data/orders'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxPaginatorComponent } from 'igniteui-angular/paginator'; @@ -10,7 +10,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-paging-sample', styleUrls: ['./tree-grid-paging-style-sample.component.scss'], templateUrl: 'tree-grid-paging-style-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxPaginatorComponent, IgxColumnComponent, IgxCellTemplateDirective] }) diff --git a/src/app/tree-grid/tree-grid-remote-filtering-sample/tree-grid-remote-filtering-sample.component.ts b/src/app/tree-grid/tree-grid-remote-filtering-sample/tree-grid-remote-filtering-sample.component.ts index 9ff17480c5..8fc99074c5 100644 --- a/src/app/tree-grid/tree-grid-remote-filtering-sample/tree-grid-remote-filtering-sample.component.ts +++ b/src/app/tree-grid/tree-grid-remote-filtering-sample/tree-grid-remote-filtering-sample.component.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, ChangeDetectorRef, Component, OnDestroy, OnInit, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { AfterViewInit, ChangeDetectorRef, Component, OnDestroy, OnInit, ViewChild, inject } from '@angular/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { NoopFilteringStrategy } from 'igniteui-angular/core'; import { IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -16,7 +16,6 @@ const DEBOUNCE_TIME = 300; selector: 'app-tree-grid-remote-filtering-sample', styleUrls: ['./tree-grid-remote-filtering-sample.component.scss'], templateUrl: './tree-grid-remote-filtering-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxIconComponent, AsyncPipe] }) export class TreeGridRemoteFilteringSampleComponent implements OnInit, AfterViewInit, OnDestroy { diff --git a/src/app/tree-grid/tree-grid-remote-paging-default-template/tree-grid-remote-paging-default-template.component.ts b/src/app/tree-grid/tree-grid-remote-paging-default-template/tree-grid-remote-paging-default-template.component.ts index 87f3a47180..80da548f23 100644 --- a/src/app/tree-grid/tree-grid-remote-paging-default-template/tree-grid-remote-paging-default-template.component.ts +++ b/src/app/tree-grid/tree-grid-remote-paging-default-template/tree-grid-remote-paging-default-template.component.ts @@ -1,5 +1,5 @@ import { formatNumber, AsyncPipe } from '@angular/common'; -import { AfterViewInit, ChangeDetectorRef, Component, OnDestroy, OnInit, ViewChild, ViewEncapsulation, inject, ChangeDetectionStrategy } from '@angular/core'; +import { AfterViewInit, ChangeDetectorRef, Component, OnDestroy, OnInit, ViewChild, ViewEncapsulation, inject } from '@angular/core'; import { GridPagingMode, IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxPaginatorComponent } from 'igniteui-angular/paginator'; @@ -14,7 +14,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-remote-paging-default-template', styleUrls: ['./tree-grid-remote-paging-default-template.component.scss'], templateUrl: './tree-grid-remote-paging-default-template.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxPaginatorComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxIconComponent, AsyncPipe] }) export class TreeGridRemotePagingDefaultTemplateComponent implements OnInit, AfterViewInit, OnDestroy { diff --git a/src/app/tree-grid/tree-grid-remote-paging-sample/tree-grid-remote-paging-sample.component.ts b/src/app/tree-grid/tree-grid-remote-paging-sample/tree-grid-remote-paging-sample.component.ts index 6f22ef1850..8a013dd4e9 100644 --- a/src/app/tree-grid/tree-grid-remote-paging-sample/tree-grid-remote-paging-sample.component.ts +++ b/src/app/tree-grid/tree-grid-remote-paging-sample/tree-grid-remote-paging-sample.component.ts @@ -1,5 +1,5 @@ import { formatNumber, AsyncPipe } from '@angular/common'; -import { AfterViewInit, Component, OnDestroy, OnInit, ViewChild, ViewEncapsulation, inject, ChangeDetectionStrategy } from '@angular/core'; +import { AfterViewInit, Component, OnDestroy, OnInit, ViewChild, ViewEncapsulation, inject } from '@angular/core'; import { GridPagingMode, IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -14,7 +14,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-remote-paging-grid-sample', styleUrls: ['./tree-grid-remote-paging-sample.component.scss'], templateUrl: './tree-grid-remote-paging-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxIconComponent, IgxPaginatorComponent, IgxPaginatorContentDirective, IgxPageSizeSelectorComponent, IgxPageNavigationComponent, AsyncPipe] }) export class TreeGridRemotePagingSampleComponent implements OnInit, AfterViewInit, OnDestroy { diff --git a/src/app/tree-grid/tree-grid-resize-line-styling-sample/tree-grid-resize-line-styling-sample.component.ts b/src/app/tree-grid/tree-grid-resize-line-styling-sample/tree-grid-resize-line-styling-sample.component.ts index 02028b6ae3..90a6340953 100644 --- a/src/app/tree-grid/tree-grid-resize-line-styling-sample/tree-grid-resize-line-styling-sample.component.ts +++ b/src/app/tree-grid/tree-grid-resize-line-styling-sample/tree-grid-resize-line-styling-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { generateEmployeeDetailedFlatData } from '../data/employees-flat-detailed'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -8,7 +8,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-resize-line-styling-sample', styleUrls: ['./tree-grid-resize-line-styling-sample.component.scss'], templateUrl: './tree-grid-resize-line-styling-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent] }) export class TreeGridResizeLineStylingSampleComponent { diff --git a/src/app/tree-grid/tree-grid-row-drag-base/tree-grid-row-drag-base.component.ts b/src/app/tree-grid/tree-grid-row-drag-base/tree-grid-row-drag-base.component.ts index 989839dcd6..7deb4993d4 100644 --- a/src/app/tree-grid/tree-grid-row-drag-base/tree-grid-row-drag-base.component.ts +++ b/src/app/tree-grid/tree-grid-row-drag-base/tree-grid-row-drag-base.component.ts @@ -1,5 +1,5 @@ /* eslint-disable @typescript-eslint/naming-convention */ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { IDropDroppedEventArgs, IgxDropDirective } from 'igniteui-angular/directives'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxColumnComponent, RowType } from 'igniteui-angular/grids/core'; @@ -18,7 +18,6 @@ enum DragIcon { selector: 'app-tree-grid-row-drag-base', styleUrls: ['tree-grid-row-drag-base.component.scss'], templateUrl: 'tree-grid-row-drag-base.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxDropDirective, IgxIconComponent, IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxPaginatorComponent, IgxColumnComponent] }) export class TreeGridRowDragBaseComponent { diff --git a/src/app/tree-grid/tree-grid-row-drag/tree-grid-row-drag.component.ts b/src/app/tree-grid/tree-grid-row-drag/tree-grid-row-drag.component.ts index e3e7a26d28..b347464755 100644 --- a/src/app/tree-grid/tree-grid-row-drag/tree-grid-row-drag.component.ts +++ b/src/app/tree-grid/tree-grid-row-drag/tree-grid-row-drag.component.ts @@ -1,5 +1,5 @@ /* eslint-disable @typescript-eslint/naming-convention */ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { IDropDroppedEventArgs, IgxDropDirective } from 'igniteui-angular/directives'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxColumnComponent, IgxDragIndicatorIconDirective, RowType } from 'igniteui-angular/grids/core'; @@ -18,7 +18,6 @@ enum DragIcon { selector: 'app-tree-grid-row-drag', styleUrls: ['tree-grid-row-drag.component.scss'], templateUrl: 'tree-grid-row-drag.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxDropDirective, IgxIconComponent, IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxPaginatorComponent, IgxColumnComponent, IgxDragIndicatorIconDirective] }) export class TreeGridRowDragComponent { diff --git a/src/app/tree-grid/tree-grid-row-edit-style/tree-grid-row-edit-style.component.ts b/src/app/tree-grid/tree-grid-row-edit-style/tree-grid-row-edit-style.component.ts index 70586d83f6..5e076efd01 100644 --- a/src/app/tree-grid/tree-grid-row-edit-style/tree-grid-row-edit-style.component.ts +++ b/src/app/tree-grid/tree-grid-row-edit-style/tree-grid-row-edit-style.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit } from '@angular/core'; import { GridSelectionMode, IgxColumnComponent, IgxRowEditActionsDirective, IgxRowEditTabStopDirective, IgxRowEditTextDirective } from 'igniteui-angular/grids/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxIconButtonDirective } from 'igniteui-angular/directives'; @@ -11,7 +11,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-row-edit-style', styleUrls: ['tree-grid-row-edit-style.component.scss'], templateUrl: 'tree-grid-row-edit-style.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxRowEditTextDirective, IgxRowEditActionsDirective, IgxIconButtonDirective, IgxRowEditTabStopDirective, IgxIconComponent] }) export class TreeGridRowEditStyleComponent implements OnInit { diff --git a/src/app/tree-grid/tree-grid-row-edit/tree-grid-row-editing-sample.component.ts b/src/app/tree-grid/tree-grid-row-edit/tree-grid-row-editing-sample.component.ts index 53edc9dc2b..ee40774d08 100644 --- a/src/app/tree-grid/tree-grid-row-edit/tree-grid-row-editing-sample.component.ts +++ b/src/app/tree-grid/tree-grid-row-edit/tree-grid-row-editing-sample.component.ts @@ -1,5 +1,5 @@ /* eslint-disable max-len */ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { GridSelectionMode, IgxColumnComponent } from 'igniteui-angular/grids/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { generateEmployeeFlatData, IEmployee } from '../data/employees-flat'; @@ -10,7 +10,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-row-editing-sample', styleUrls: ['tree-grid-row-editing-sample.component.scss'], templateUrl: 'tree-grid-row-editing-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent] }) export class TreeGridRowEditSampleComponent implements OnInit { diff --git a/src/app/tree-grid/tree-grid-row-pinning-extra-column/tree-grid-row-pinning-extra-column.component.ts b/src/app/tree-grid/tree-grid-row-pinning-extra-column/tree-grid-row-pinning-extra-column.component.ts index 963a98ec6d..431eafea05 100644 --- a/src/app/tree-grid/tree-grid-row-pinning-extra-column/tree-grid-row-pinning-extra-column.component.ts +++ b/src/app/tree-grid/tree-grid-row-pinning-extra-column/tree-grid-row-pinning-extra-column.component.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, Component, OnInit, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { AfterViewInit, Component, OnInit, ViewChild, inject } from '@angular/core'; import { ColumnPinningPosition } from 'igniteui-angular/core'; import { IgxIconComponent, IgxIconService } from 'igniteui-angular/icon'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; @@ -15,7 +15,6 @@ const FILTERING_ICONS_FONT_SET = 'filtering-icons'; selector: 'app-tree-grid-row-pinning-extra-column', styleUrls: ['tree-grid-row-pinning-extra-column.component.scss'], templateUrl: 'tree-grid-row-pinning-extra-column.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSwitchComponent, IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxIconComponent] }) export class TreeGridRowPinningExtraColumnSampleComponent implements OnInit, AfterViewInit { diff --git a/src/app/tree-grid/tree-grid-row-pinning-styling/tree-grid-row-pinning-styling.component.ts b/src/app/tree-grid/tree-grid-row-pinning-styling/tree-grid-row-pinning-styling.component.ts index 401c4dce38..bcfc331cf1 100644 --- a/src/app/tree-grid/tree-grid-row-pinning-styling/tree-grid-row-pinning-styling.component.ts +++ b/src/app/tree-grid/tree-grid-row-pinning-styling/tree-grid-row-pinning-styling.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { ColumnPinningPosition } from 'igniteui-angular/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IPinningConfig, IgxColumnComponent, IgxGridPinningActionsComponent, RowPinningPosition } from 'igniteui-angular/grids/core'; @@ -11,7 +11,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-row-pinning-styling', styleUrls: ['tree-grid-row-pinning-styling.component.scss'], templateUrl: 'tree-grid-row-pinning-styling.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxActionStripComponent, IgxGridPinningActionsComponent] }) export class TreeGridRowPinningStylingSampleComponent implements OnInit { diff --git a/src/app/tree-grid/tree-grid-row-pinning/tree-grid-row-pinning.component.ts b/src/app/tree-grid/tree-grid-row-pinning/tree-grid-row-pinning.component.ts index c1023e41af..f8edae13c7 100644 --- a/src/app/tree-grid/tree-grid-row-pinning/tree-grid-row-pinning.component.ts +++ b/src/app/tree-grid/tree-grid-row-pinning/tree-grid-row-pinning.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { ColumnPinningPosition } from 'igniteui-angular/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IPinningConfig, IgxColumnComponent, IgxGridEditingActionsComponent, IgxGridPinningActionsComponent, RowPinningPosition } from 'igniteui-angular/grids/core'; @@ -12,7 +12,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-row-pinning', styleUrls: ['tree-grid-row-pinning.component.scss'], templateUrl: 'tree-grid-row-pinning.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSwitchComponent, IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxActionStripComponent, IgxGridPinningActionsComponent, IgxGridEditingActionsComponent] }) export class TreeGridRowPinningSampleComponent implements OnInit { diff --git a/src/app/tree-grid/tree-grid-row-reorder/tree-grid-row-reorder.component.ts b/src/app/tree-grid/tree-grid-row-reorder/tree-grid-row-reorder.component.ts index 62a3a94cd7..4a2d0709b3 100644 --- a/src/app/tree-grid/tree-grid-row-reorder/tree-grid-row-reorder.component.ts +++ b/src/app/tree-grid/tree-grid-row-reorder/tree-grid-row-reorder.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { IDropDroppedEventArgs, IgxDropDirective } from 'igniteui-angular/directives'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { GridSelectionMode, IgxColumnComponent, RowType } from 'igniteui-angular/grids/core'; @@ -11,7 +11,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-row-reorder', styleUrls: ['tree-grid-row-reorder.component.scss'], templateUrl: 'tree-grid-row-reorder.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxDropDirective, IgxPreventDocumentScrollDirective, IgxPaginatorComponent, IgxColumnComponent] }) export class TreeGridRowReorderComponent { diff --git a/src/app/tree-grid/tree-grid-rowClasses-sample/tree-grid-rowClasses.component.ts b/src/app/tree-grid/tree-grid-rowClasses-sample/tree-grid-rowClasses.component.ts index cf9bf27700..4f7615de38 100644 --- a/src/app/tree-grid/tree-grid-rowClasses-sample/tree-grid-rowClasses.component.ts +++ b/src/app/tree-grid/tree-grid-rowClasses-sample/tree-grid-rowClasses.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxColumnComponent, RowType } from 'igniteui-angular/grids/core'; import { generateEmployeeFlatData, IEmployee } from '../data/employees-flat'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-row-classes-sample', styleUrls: ['tree-grid-rowClasses.component.scss'], templateUrl: 'tree-grid-rowClasses.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent] }) export class TreeGridRowClassesComponent implements OnInit { diff --git a/src/app/tree-grid/tree-grid-rowStyles-sample/tree-grid-rowStyle.component.ts b/src/app/tree-grid/tree-grid-rowStyles-sample/tree-grid-rowStyle.component.ts index aaffb10371..b18c2bcc1a 100644 --- a/src/app/tree-grid/tree-grid-rowStyles-sample/tree-grid-rowStyle.component.ts +++ b/src/app/tree-grid/tree-grid-rowStyles-sample/tree-grid-rowStyle.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxColumnComponent, RowType } from 'igniteui-angular/grids/core'; import { generateEmployeeFlatData, IEmployee } from '../data/employees-flat'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-row-styles-sample', styleUrls: ['tree-grid-rowStyle.component.scss'], templateUrl: 'tree-grid-rowStyle.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent] }) export class TreeGridRowStylesComponent implements OnInit { diff --git a/src/app/tree-grid/tree-grid-sample-both-pinning/tree-grid-both-sides-pinning.component.ts b/src/app/tree-grid/tree-grid-sample-both-pinning/tree-grid-both-sides-pinning.component.ts index 1bbb638ec9..520c1b8983 100644 --- a/src/app/tree-grid/tree-grid-sample-both-pinning/tree-grid-both-sides-pinning.component.ts +++ b/src/app/tree-grid/tree-grid-sample-both-pinning/tree-grid-both-sides-pinning.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, TemplateRef, ViewChild, ViewEncapsulation, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, TemplateRef, ViewChild, ViewEncapsulation } from '@angular/core'; import { ColumnPinningPosition, ColumnType } from 'igniteui-angular/core'; import { IPinningConfig, IgxColumnComponent, IgxGridToolbarActionsComponent, IgxGridToolbarComponent } from 'igniteui-angular/grids/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; @@ -11,7 +11,6 @@ import { generateEmployeeDetailedFlatData } from '../data/employees-flat-detaile selector: 'app-tree-grid-sample', styleUrls: ['tree-grid-both-sides-pinning.component.scss'], templateUrl: 'tree-grid-both-sides-pinning.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [ IgxTreeGridComponent, IgxGridToolbarComponent, diff --git a/src/app/tree-grid/tree-grid-sample-right-pinning/tree-grid-right-pinning.component.ts b/src/app/tree-grid/tree-grid-sample-right-pinning/tree-grid-right-pinning.component.ts index 9ff79271c0..00338b5c0b 100644 --- a/src/app/tree-grid/tree-grid-sample-right-pinning/tree-grid-right-pinning.component.ts +++ b/src/app/tree-grid/tree-grid-sample-right-pinning/tree-grid-right-pinning.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, TemplateRef, ViewChild, ViewEncapsulation, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, TemplateRef, ViewChild, ViewEncapsulation } from '@angular/core'; import { ColumnPinningPosition } from 'igniteui-angular/core'; import { IPinningConfig, IgxColumnComponent, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarPinningComponent } from 'igniteui-angular/grids/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; @@ -10,7 +10,6 @@ import { generateEmployeeDetailedFlatData } from '../data/employees-flat-detaile selector: 'app-tree-grid-sample', styleUrls: ['tree-grid-right-pinning.component.scss'], templateUrl: 'tree-grid-right-pinning.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxGridToolbarComponent, IgxGridToolbarActionsComponent, IgxGridToolbarPinningComponent, IgxColumnComponent] }) diff --git a/src/app/tree-grid/tree-grid-save-state/about.component.ts b/src/app/tree-grid/tree-grid-save-state/about.component.ts index 0239f7c566..344dcf0177 100644 --- a/src/app/tree-grid/tree-grid-save-state/about.component.ts +++ b/src/app/tree-grid/tree-grid-save-state/about.component.ts @@ -1,11 +1,10 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { IgxButtonDirective } from 'igniteui-angular/directives'; import { RouterLink } from '@angular/router'; @Component({ selector: 'app-about', templateUrl: './about.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, RouterLink] }) export class TGridAboutComponent { diff --git a/src/app/tree-grid/tree-grid-save-state/tGrid-state.component.ts b/src/app/tree-grid/tree-grid-save-state/tGrid-state.component.ts index c7069bf9e8..01844d2142 100644 --- a/src/app/tree-grid/tree-grid-save-state/tGrid-state.component.ts +++ b/src/app/tree-grid/tree-grid-save-state/tGrid-state.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ViewChildren, QueryList, AfterViewInit, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild, ViewChildren, QueryList, AfterViewInit, inject } from '@angular/core'; import { Router, RouterLink } from '@angular/router'; import { FilteringExpressionsTree, FilteringLogic } from 'igniteui-angular/core'; import { GridFeatures, IGridState, IGridStateOptions, IgxColumnComponent, IgxGridStateDirective } from 'igniteui-angular/grids/core'; @@ -16,7 +16,6 @@ import { EMPLOYEE_DATA } from './data'; selector: 'app-tgrid', styleUrls: ['./tGrid-state.component.scss'], templateUrl: './tGrid-state.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxIconComponent, RouterLink, IgxCheckboxComponent, IgxTreeGridComponent, IgxGridStateDirective, IgxPaginatorComponent, IgxColumnComponent] }) diff --git a/src/app/tree-grid/tree-grid-search-sample/tree-grid-search-sample.component.ts b/src/app/tree-grid/tree-grid-search-sample/tree-grid-search-sample.component.ts index 562bcd4e30..2827e076ef 100644 --- a/src/app/tree-grid/tree-grid-search-sample/tree-grid-search-sample.component.ts +++ b/src/app/tree-grid/tree-grid-search-sample/tree-grid-search-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxInputDirective, IgxInputGroupComponent, IgxPrefixDirective, IgxSuffixDirective } from 'igniteui-angular/input-group'; import { IgxIconComponent } from 'igniteui-angular/icon'; @@ -14,7 +14,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-search-sample', styleUrls: ['./tree-grid-search-sample.component.scss'], templateUrl: './tree-grid-search-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxInputGroupComponent, IgxPrefixDirective, IgxIconComponent, FormsModule, IgxInputDirective, IgxSuffixDirective, IgxChipsAreaComponent, IgxChipComponent, IgxIconButtonDirective, IgxRippleDirective, IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent] }) export class TreeGridSearchSampleComponent implements OnInit { diff --git a/src/app/tree-grid/tree-grid-selection-sample/tree-grid-selection-sample.component.ts b/src/app/tree-grid/tree-grid-selection-sample/tree-grid-selection-sample.component.ts index 33945b738b..954802ffda 100644 --- a/src/app/tree-grid/tree-grid-selection-sample/tree-grid-selection-sample.component.ts +++ b/src/app/tree-grid/tree-grid-selection-sample/tree-grid-selection-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { GridSelectionMode, IRowSelectionEventArgs, IgxColumnComponent } from 'igniteui-angular/grids/core'; import { IgxSnackbarComponent } from 'igniteui-angular/snackbar'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; @@ -14,7 +14,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-selection-sample', styleUrls: ['./tree-grid-selection-sample.component.scss'], templateUrl: './tree-grid-selection-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSwitchComponent, FormsModule, IgxButtonGroupComponent, IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxSnackbarComponent, IgxIconComponent] }) export class TreeGridSelectionSampleComponent implements OnInit { diff --git a/src/app/tree-grid/tree-grid-selection-template-numbers/tree-grid-selection-template-numbers.component.ts b/src/app/tree-grid/tree-grid-selection-template-numbers/tree-grid-selection-template-numbers.component.ts index 1fc5c84dfe..6dfe1cf7f0 100644 --- a/src/app/tree-grid/tree-grid-selection-template-numbers/tree-grid-selection-template-numbers.component.ts +++ b/src/app/tree-grid/tree-grid-selection-template-numbers/tree-grid-selection-template-numbers.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit } from '@angular/core'; import { generateEmployeeFlatData } from '../data/employees-flat'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxPaginatorComponent } from 'igniteui-angular/paginator'; @@ -10,7 +10,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-selection-template-numbers', styleUrls: ['./tree-grid-selection-template-numbers.component.scss'], templateUrl: './tree-grid-selection-template-numbers.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxPaginatorComponent, IgxColumnComponent, IgxHeadSelectorDirective, IgxRowSelectorDirective, IgxCheckboxComponent] }) export class TreeGridSelectionTemplateNumbersSampleComponent implements OnInit { diff --git a/src/app/tree-grid/tree-grid-sorting-sample/tree-grid-contextmenu/tree-grid-contextmenu.component.ts b/src/app/tree-grid/tree-grid-sorting-sample/tree-grid-contextmenu/tree-grid-contextmenu.component.ts index b76fa4d896..cf2f415a66 100644 --- a/src/app/tree-grid/tree-grid-sorting-sample/tree-grid-contextmenu/tree-grid-contextmenu.component.ts +++ b/src/app/tree-grid/tree-grid-sorting-sample/tree-grid-contextmenu/tree-grid-contextmenu.component.ts @@ -1,4 +1,4 @@ -import { Component, Input, ChangeDetectionStrategy } from '@angular/core'; +import { Component, Input } from '@angular/core'; import { SortingDirection } from 'igniteui-angular/core'; import { IgxIconComponent } from 'igniteui-angular/icon'; import { NgStyle } from '@angular/common'; @@ -7,7 +7,6 @@ import { NgStyle } from '@angular/common'; selector: 'app-tree-grid-contextmenu', styleUrls: ['./tree-grid-contextmenu.component.scss'], templateUrl: './tree-grid-contextmenu.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [NgStyle, IgxIconComponent] }) export class TreeGridContextmenuComponent { diff --git a/src/app/tree-grid/tree-grid-sorting-sample/tree-grid-sorting-sample.component.ts b/src/app/tree-grid/tree-grid-sorting-sample/tree-grid-sorting-sample.component.ts index 7c7fc509cc..528e8b8cb1 100644 --- a/src/app/tree-grid/tree-grid-sorting-sample/tree-grid-sorting-sample.component.ts +++ b/src/app/tree-grid/tree-grid-sorting-sample/tree-grid-sorting-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, AfterViewInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild, AfterViewInit } from '@angular/core'; import { DefaultSortingStrategy, ISortingOptions, SortingDirection } from 'igniteui-angular/core'; import { IgxTreeGridComponent, IgxTreeGridGroupByAreaComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxCellTemplateDirective, IgxColumnComponent, IgxGridToolbarActionsComponent, IgxGridToolbarComponent } from 'igniteui-angular/grids/core'; @@ -15,7 +15,6 @@ import { TreeGridContextmenuComponent } from './tree-grid-contextmenu/tree-grid- selector: 'app-tree-grid-sorting-sample', styleUrls: ['./tree-grid-sorting-sample.component.scss'], templateUrl: 'tree-grid-sorting-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxButtonDirective, IgxGridToolbarActionsComponent, IgxSimpleComboComponent, FormsModule, IgxComboClearIconDirective, IgxComboItemDirective, IgxTreeGridGroupByAreaComponent, IgxColumnComponent, IgxCellTemplateDirective, TreeGridContextmenuComponent, UpperCasePipe] }) diff --git a/src/app/tree-grid/tree-grid-sorting-styling/tree-grid-sorting-styling.component.ts b/src/app/tree-grid/tree-grid-sorting-styling/tree-grid-sorting-styling.component.ts index 57e20c0ae5..a8e9de0d38 100644 --- a/src/app/tree-grid/tree-grid-sorting-styling/tree-grid-sorting-styling.component.ts +++ b/src/app/tree-grid/tree-grid-sorting-styling/tree-grid-sorting-styling.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { DefaultSortingStrategy, SortingDirection } from 'igniteui-angular/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -10,7 +10,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-sorting-styling', styleUrls: ['./tree-grid-sorting-styling.component.scss'], templateUrl: 'tree-grid-sorting-styling.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective] }) diff --git a/src/app/tree-grid/tree-grid-style/tree-grid-style.component.ts b/src/app/tree-grid/tree-grid-style/tree-grid-style.component.ts index c6786423d5..653f39c22b 100644 --- a/src/app/tree-grid/tree-grid-style/tree-grid-style.component.ts +++ b/src/app/tree-grid/tree-grid-style/tree-grid-style.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit } from '@angular/core'; import { EMPLOYEE_FLAT_AVATARS_DATA } from '../data/employees-flat-avatars'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-style', styleUrls: ['./tree-grid-style.component.scss'], templateUrl: './tree-grid-style.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxAvatarComponent] }) export class TreeGridStyleComponent implements OnInit { diff --git a/src/app/tree-grid/tree-grid-summary-export/tree-grid-summary-export.component.ts b/src/app/tree-grid/tree-grid-summary-export/tree-grid-summary-export.component.ts index 067fecabff..4c8318e0f8 100644 --- a/src/app/tree-grid/tree-grid-summary-export/tree-grid-summary-export.component.ts +++ b/src/app/tree-grid/tree-grid-summary-export/tree-grid-summary-export.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild, inject } from '@angular/core'; import { ColumnType } from 'igniteui-angular/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxButtonDirective } from 'igniteui-angular/directives'; @@ -12,7 +12,6 @@ import { DatePipe } from '@angular/common'; selector: 'app-tree-grid-summary-export', styleUrls: ['./tree-grid-summary-export.component.scss'], templateUrl: './tree-grid-summary-export.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxCellHeaderTemplateDirective, IgxIconComponent, DatePipe] }) export class TreeGridSummaryExportComponent { diff --git a/src/app/tree-grid/tree-grid-summary-formatter/tree-grid-summary-formatter.component.ts b/src/app/tree-grid/tree-grid-summary-formatter/tree-grid-summary-formatter.component.ts index 1093a5cd52..6d031cab7c 100644 --- a/src/app/tree-grid/tree-grid-summary-formatter/tree-grid-summary-formatter.component.ts +++ b/src/app/tree-grid/tree-grid-summary-formatter/tree-grid-summary-formatter.component.ts @@ -1,7 +1,7 @@ import { DatePipe } from '@angular/common'; -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; -import { IgxCellTemplateDirective, IgxColumnComponent, IgxDateSummaryOperand, IgxSummaryOperand } from 'igniteui-angular/grids/core'; -import { IgxSummaryResult } from 'igniteui-angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; +import { IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; +import { IgxDateSummaryOperand, IgxSummaryOperand, IgxSummaryResult } from 'igniteui-angular/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { ORDERS_DATA } from '../data/orders'; import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scroll.directive'; @@ -10,7 +10,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-summary-formatter', styleUrls: ['./tree-grid-summary-formatter.component.scss'], templateUrl: 'tree-grid-summary-formatter.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective] }) diff --git a/src/app/tree-grid/tree-grid-summary-sample/tree-grid-summary-sample.component.ts b/src/app/tree-grid/tree-grid-summary-sample/tree-grid-summary-sample.component.ts index 2ca6b33dd3..bd9858e365 100644 --- a/src/app/tree-grid/tree-grid-summary-sample/tree-grid-summary-sample.component.ts +++ b/src/app/tree-grid/tree-grid-summary-sample/tree-grid-summary-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { ColumnType } from 'igniteui-angular/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxCellHeaderTemplateDirective, IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -11,7 +11,6 @@ import { DatePipe } from '@angular/common'; selector: 'app-tree-grid-summary-sample', styleUrls: ['./tree-grid-summary-sample.component.scss'], templateUrl: './tree-grid-summary-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxCellHeaderTemplateDirective, IgxIconComponent, DatePipe] }) export class TreeGridSummarySampleComponent { diff --git a/src/app/tree-grid/tree-grid-summary-styling/tree-grid-summary-styling.component.ts b/src/app/tree-grid/tree-grid-summary-styling/tree-grid-summary-styling.component.ts index 680d442010..96908837a8 100644 --- a/src/app/tree-grid/tree-grid-summary-styling/tree-grid-summary-styling.component.ts +++ b/src/app/tree-grid/tree-grid-summary-styling/tree-grid-summary-styling.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild } from '@angular/core'; import { ColumnType } from 'igniteui-angular/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxCellHeaderTemplateDirective, IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -11,7 +11,6 @@ import { DatePipe } from '@angular/common'; selector: 'app-tree-grid-summary-styling', styleUrls: ['./tree-grid-summary-styling.component.scss'], templateUrl: './tree-grid-summary-styling.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective, IgxCellHeaderTemplateDirective, IgxIconComponent, DatePipe] }) export class TreeGridSummaryStylingComponent { diff --git a/src/app/tree-grid/tree-grid-summary2-sample/tree-grid-summary2-sample.component.ts b/src/app/tree-grid/tree-grid-summary2-sample/tree-grid-summary2-sample.component.ts index 1b2c37938d..3b2b219b84 100644 --- a/src/app/tree-grid/tree-grid-summary2-sample/tree-grid-summary2-sample.component.ts +++ b/src/app/tree-grid/tree-grid-summary2-sample/tree-grid-summary2-sample.component.ts @@ -1,6 +1,6 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; -import { DefaultSortingStrategy, GridSummaryCalculationMode, ISortingExpression, IgxSummaryResult, SortingDirection } from 'igniteui-angular/core'; -import { GridSummaryPosition, IgxCellTemplateDirective, IgxColumnComponent, IgxNumberSummaryOperand, IgxSummaryOperand } from 'igniteui-angular/grids/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; +import { DefaultSortingStrategy, GridSummaryCalculationMode, ISortingExpression, IgxNumberSummaryOperand, IgxSummaryOperand, IgxSummaryResult, SortingDirection } from 'igniteui-angular/core'; +import { GridSummaryPosition, IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxButtonGroupComponent } from 'igniteui-angular/button-group'; import { IgxSwitchComponent } from 'igniteui-angular/switch'; @@ -26,7 +26,6 @@ class AvgSummary { selector: 'app-tree-grid-summary2-sample', styleUrls: ['./tree-grid-summary2-sample.component.scss'], templateUrl: './tree-grid-summary2-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonGroupComponent, IgxSwitchComponent, IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellTemplateDirective] }) export class TreeGridSummary2SampleComponent implements OnInit { diff --git a/src/app/tree-grid/tree-grid-toolbar-sample-1/tree-grid-toolbar-sample-1.component.ts b/src/app/tree-grid/tree-grid-toolbar-sample-1/tree-grid-toolbar-sample-1.component.ts index 85217c9e5e..098ef97f2d 100644 --- a/src/app/tree-grid/tree-grid-toolbar-sample-1/tree-grid-toolbar-sample-1.component.ts +++ b/src/app/tree-grid/tree-grid-toolbar-sample-1/tree-grid-toolbar-sample-1.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { EMPLOYEE_FLAT_AVATARS_DATA } from '../data/employees-flat-avatars'; import { IgxInputDirective, IgxInputGroupComponent, IgxLabelDirective } from 'igniteui-angular/input-group'; import { IgxSwitchComponent } from 'igniteui-angular/switch'; @@ -13,7 +13,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-toolbar-sample-1', styleUrls: ['./tree-grid-toolbar-sample-1.component.scss'], templateUrl: './tree-grid-toolbar-sample-1.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxInputGroupComponent, IgxLabelDirective, FormsModule, IgxInputDirective, IgxSwitchComponent, IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxGridToolbarTitleComponent, IgxGridToolbarActionsComponent, IgxGridToolbarAdvancedFilteringComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent, IgxGridToolbarExporterComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxAvatarComponent] }) export class TreeGridToolbarSample1Component { diff --git a/src/app/tree-grid/tree-grid-toolbar-sample-2/tree-grid-toolbar-sample-2.component.ts b/src/app/tree-grid/tree-grid-toolbar-sample-2/tree-grid-toolbar-sample-2.component.ts index c90d97b001..b225017650 100644 --- a/src/app/tree-grid/tree-grid-toolbar-sample-2/tree-grid-toolbar-sample-2.component.ts +++ b/src/app/tree-grid/tree-grid-toolbar-sample-2/tree-grid-toolbar-sample-2.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { CsvFileTypes, IColumnExportingEventArgs, @@ -22,7 +22,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-toolbar-sample-2', styleUrls: ['./tree-grid-toolbar-sample-2.component.scss'], templateUrl: './tree-grid-toolbar-sample-2.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxGridToolbarTitleComponent, IgxGridToolbarActionsComponent, IgxGridToolbarExporterComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxAvatarComponent] }) export class TreeGridToolbarSample2Component { @@ -36,7 +35,7 @@ export class TreeGridToolbarSample2Component { public configureExport(args: IGridToolbarExportEventArgs) { // You can customize the exporting from this event const options: IgxExporterOptionsBase = args.options; - + options.fileName = `Report_${new Date().toDateString()}`; if (options instanceof IgxExcelExporterOptions) { diff --git a/src/app/tree-grid/tree-grid-toolbar-sample-3/tree-grid-toolbar-sample-3.component.ts b/src/app/tree-grid/tree-grid-toolbar-sample-3/tree-grid-toolbar-sample-3.component.ts index 8ef0a9f128..165b0d642d 100644 --- a/src/app/tree-grid/tree-grid-toolbar-sample-3/tree-grid-toolbar-sample-3.component.ts +++ b/src/app/tree-grid/tree-grid-toolbar-sample-3/tree-grid-toolbar-sample-3.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { EMPLOYEE_FLAT_AVATARS_DATA } from '../data/employees-flat-avatars'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxCellTemplateDirective, IgxColumnComponent, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarExporterComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent, IgxGridToolbarTitleComponent } from 'igniteui-angular/grids/core'; @@ -11,7 +11,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-toolbar-sample-3', styleUrls: ['./tree-grid-toolbar-sample-3.component.scss'], templateUrl: './tree-grid-toolbar-sample-3.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxGridToolbarTitleComponent, IgxGridToolbarActionsComponent, IgxButtonDirective, IgxRippleDirective, IgxIconComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent, IgxGridToolbarExporterComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxAvatarComponent] }) export class TreeGridToolbarSample3Component { diff --git a/src/app/tree-grid/tree-grid-toolbar-sample-4/tree-grid-toolbar-sample-4.component.ts b/src/app/tree-grid/tree-grid-toolbar-sample-4/tree-grid-toolbar-sample-4.component.ts index 2a53282837..0463d4bb47 100644 --- a/src/app/tree-grid/tree-grid-toolbar-sample-4/tree-grid-toolbar-sample-4.component.ts +++ b/src/app/tree-grid/tree-grid-toolbar-sample-4/tree-grid-toolbar-sample-4.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { EMPLOYEE_FLAT_AVATARS_DATA } from '../data/employees-flat-avatars'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxCellTemplateDirective, IgxColumnComponent, IgxGridToolbarActionsComponent, IgxGridToolbarAdvancedFilteringComponent, IgxGridToolbarComponent, IgxGridToolbarExporterComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent, IgxGridToolbarTitleComponent } from 'igniteui-angular/grids/core'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-toolbar-sample-4', styleUrls: ['./tree-grid-toolbar-sample-4.component.scss'], templateUrl: './tree-grid-toolbar-sample-4.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxGridToolbarTitleComponent, IgxGridToolbarActionsComponent, IgxGridToolbarAdvancedFilteringComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent, IgxGridToolbarExporterComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxAvatarComponent] }) export class TreeGridToolbarSample4Component { diff --git a/src/app/tree-grid/tree-grid-toolbar-style/tree-grid-toolbar-style.component.ts b/src/app/tree-grid/tree-grid-toolbar-style/tree-grid-toolbar-style.component.ts index d23646847c..f64edf5e34 100644 --- a/src/app/tree-grid/tree-grid-toolbar-style/tree-grid-toolbar-style.component.ts +++ b/src/app/tree-grid/tree-grid-toolbar-style/tree-grid-toolbar-style.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { EMPLOYEE_FLAT_AVATARS_DATA } from '../data/employees-flat-avatars'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxCellTemplateDirective, IgxColumnComponent, IgxGridToolbarActionsComponent, IgxGridToolbarComponent, IgxGridToolbarExporterComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent, IgxGridToolbarTitleComponent } from 'igniteui-angular/grids/core'; @@ -9,7 +9,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-toolbar-style', styleUrls: ['./tree-grid-toolbar-style.component.scss'], templateUrl: './tree-grid-toolbar-style.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxGridToolbarComponent, IgxGridToolbarTitleComponent, IgxGridToolbarActionsComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent, IgxGridToolbarExporterComponent, IgxColumnComponent, IgxCellTemplateDirective, IgxAvatarComponent] }) export class TreeGridToolbarStyleComponent { diff --git a/src/app/tree-grid/tree-grid-tree-filter-view/tree-grid-tree-filter-view.component.ts b/src/app/tree-grid/tree-grid-tree-filter-view/tree-grid-tree-filter-view.component.ts index fa0bcdc1f5..9bf06c8bcd 100644 --- a/src/app/tree-grid/tree-grid-tree-filter-view/tree-grid-tree-filter-view.component.ts +++ b/src/app/tree-grid/tree-grid-tree-filter-view/tree-grid-tree-filter-view.component.ts @@ -9,7 +9,6 @@ import { ORDERS_DATA } from '../data/orders'; import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scroll.directive'; @Component({ - changeDetection: ChangeDetectionStrategy.OnPush, selector: 'app-tree-grid-tree-filter-view', styleUrls: ['./tree-grid-tree-filter-view.component.scss'], templateUrl: 'tree-grid-tree-filter-view.component.html', diff --git a/src/app/tree-grid/tree-grid-validation-style/tree-grid-validation-style.component.ts b/src/app/tree-grid/tree-grid-validation-style/tree-grid-validation-style.component.ts index d0b1e9203d..dad7ada413 100644 --- a/src/app/tree-grid/tree-grid-validation-style/tree-grid-validation-style.component.ts +++ b/src/app/tree-grid/tree-grid-validation-style/tree-grid-validation-style.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxCellValidationErrorDirective, IgxColumnComponent, IgxColumnRequiredValidatorDirective, RowType } from 'igniteui-angular/grids/core'; import { generateEmployeeFlatData, IEmployee } from '../data/employees-flat'; @@ -9,7 +9,6 @@ import { NgTemplateOutlet } from '@angular/common'; selector: 'app-tree-grid-validation-style', styleUrls: ['tree-grid-validation-style.component.scss'], templateUrl: 'tree-grid-validation-style.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxColumnRequiredValidatorDirective, IgxCellValidationErrorDirective, NgTemplateOutlet] }) export class TreeGridValidationStyleComponent implements OnInit { diff --git a/src/app/tree-grid/tree-grid-validator-service-cross-field/tree-grid-validator-service-cross-field.component.ts b/src/app/tree-grid/tree-grid-validator-service-cross-field/tree-grid-validator-service-cross-field.component.ts index 4a1f1c0c53..fdd189b877 100644 --- a/src/app/tree-grid/tree-grid-validator-service-cross-field/tree-grid-validator-service-cross-field.component.ts +++ b/src/app/tree-grid/tree-grid-validator-service-cross-field/tree-grid-validator-service-cross-field.component.ts @@ -1,5 +1,5 @@ /* eslint-disable @typescript-eslint/naming-convention */ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { AbstractControl, FormGroup, ValidationErrors, ValidatorFn, FormsModule, ReactiveFormsModule } from '@angular/forms'; import { ColumnPinningPosition } from 'igniteui-angular/core'; import { CellType, IGridEditEventArgs, IGridFormGroupCreatedEventArgs, IPinningConfig, IgxCellEditorTemplateDirective, IgxCellTemplateDirective, IgxColumnComponent, IgxColumnMaxValidatorDirective, IgxColumnMinValidatorDirective, IgxColumnRequiredValidatorDirective } from 'igniteui-angular/grids/core'; @@ -15,7 +15,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-validator-service-cross-field-component', styleUrls: ['tree-grid-validator-service-cross-field.component.scss'], templateUrl: 'tree-grid-validator-service-cross-field.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSwitchComponent, FormsModule, IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxColumnRequiredValidatorDirective, IgxColumnMinValidatorDirective, IgxColumnMaxValidatorDirective, IgxCellEditorTemplateDirective, IgxSelectComponent, ReactiveFormsModule, IgxFocusDirective, IgxSelectItemComponent, IgxCellTemplateDirective, IgxTooltipTargetDirective, IgxTooltipDirective, IgxButtonDirective] }) export class TreeGridValidatorServiceCrossFieldComponent implements OnInit { diff --git a/src/app/tree-grid/tree-grid-validator-service-extended/tree-grid-validator-service-extended.component.ts b/src/app/tree-grid/tree-grid-validator-service-extended/tree-grid-validator-service-extended.component.ts index a3c07b8285..0cec1a33f2 100644 --- a/src/app/tree-grid/tree-grid-validator-service-extended/tree-grid-validator-service-extended.component.ts +++ b/src/app/tree-grid/tree-grid-validator-service-extended/tree-grid-validator-service-extended.component.ts @@ -1,6 +1,6 @@ /* eslint-disable @typescript-eslint/naming-convention */ -import { Component, Directive, Input, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; -import { AbstractControl, FormGroup, NG_VALIDATORS, ValidationErrors, ValidatorFn, Validators } from '@angular/forms'; +import { Component, Directive, forwardRef, Input, OnInit, ViewChild } from '@angular/core'; +import { AbstractControl, NG_VALIDATORS, ValidationErrors, ValidatorFn, Validators } from '@angular/forms'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IGridFormGroupCreatedEventArgs, IgxCellValidationErrorDirective, IgxColumnComponent, IgxColumnMaxValidatorDirective, IgxColumnMinValidatorDirective, IgxColumnRequiredValidatorDirective } from 'igniteui-angular/grids/core'; import { IgxButtonDirective } from 'igniteui-angular/directives'; @@ -17,7 +17,7 @@ export function phoneFormatValidator(phoneReg: RegExp): ValidatorFn { @Directive({ selector: '[phoneFormat]', - providers: [{ provide: NG_VALIDATORS, useExisting: TGridPhoneFormatDirective, multi: true }] + providers: [{ provide: NG_VALIDATORS, useExisting: forwardRef(() => TGridPhoneFormatDirective), multi: true }] }) export class TGridPhoneFormatDirective extends Validators { @Input('phoneFormat') @@ -33,7 +33,6 @@ export class TGridPhoneFormatDirective extends Validators { selector: 'app-tree-grid-validator-service-extended-component', styleUrls: ['tree-grid-validator-service-extended.component.scss'], templateUrl: 'tree-grid-validator-service-extended.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxColumnMinValidatorDirective, IgxColumnRequiredValidatorDirective, IgxColumnMaxValidatorDirective, TGridPhoneFormatDirective, IgxCellValidationErrorDirective, NgTemplateOutlet, IgxButtonDirective] }) export class TreeGridValidatorServiceExtendedComponent implements OnInit { diff --git a/src/app/tree-grid/tree-grid-validator-service/tree-grid-validator-service.component.ts b/src/app/tree-grid/tree-grid-validator-service/tree-grid-validator-service.component.ts index 913c8578a8..d72902bfab 100644 --- a/src/app/tree-grid/tree-grid-validator-service/tree-grid-validator-service.component.ts +++ b/src/app/tree-grid/tree-grid-validator-service/tree-grid-validator-service.component.ts @@ -1,5 +1,5 @@ /* eslint-disable @typescript-eslint/naming-convention */ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxSwitchComponent } from 'igniteui-angular/switch'; import { IgxColumnComponent, IgxColumnMaxValidatorDirective, IgxColumnMinValidatorDirective, IgxColumnRequiredValidatorDirective } from 'igniteui-angular/grids/core'; @@ -11,7 +11,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'app-tree-grid-validator-service-component', styleUrls: ['tree-grid-validator-service.component.scss'], templateUrl: 'tree-grid-validator-service.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSwitchComponent, FormsModule, IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxColumnRequiredValidatorDirective, IgxColumnMinValidatorDirective, IgxColumnMaxValidatorDirective] }) export class TreeGridValidatorServiceComponent implements OnInit { diff --git a/src/app/tree-grid/tree-grid-virtualization-sample/tree-grid-virtualization-sample.component.ts b/src/app/tree-grid/tree-grid-virtualization-sample/tree-grid-virtualization-sample.component.ts index 18d1b8c37b..13adc3ee67 100644 --- a/src/app/tree-grid/tree-grid-virtualization-sample/tree-grid-virtualization-sample.component.ts +++ b/src/app/tree-grid/tree-grid-virtualization-sample/tree-grid-virtualization-sample.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, inject, ChangeDetectionStrategy } from '@angular/core'; +import { Component, ViewChild, inject } from '@angular/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxCellHeaderTemplateDirective, IgxCellTemplateDirective, IgxColumnComponent } from 'igniteui-angular/grids/core'; import { IgxBadgeComponent } from 'igniteui-angular/badge'; @@ -13,7 +13,6 @@ import { AsyncPipe } from '@angular/common'; selector: 'tree-grid-virtualization-sample', styleUrls: ['./tree-grid-virtualization-sample.component.scss'], templateUrl: 'tree-grid-virtualization-sample.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxCellHeaderTemplateDirective, IgxCellTemplateDirective, IgxBadgeComponent, AsyncPipe] }) diff --git a/src/app/tree-grid/treegrid-allData-summary/treegrid-allData-summary.component.ts b/src/app/tree-grid/treegrid-allData-summary/treegrid-allData-summary.component.ts index 4296b1149b..5a21ebebd3 100644 --- a/src/app/tree-grid/treegrid-allData-summary/treegrid-allData-summary.component.ts +++ b/src/app/tree-grid/treegrid-allData-summary/treegrid-allData-summary.component.ts @@ -1,6 +1,6 @@ -import { Component, OnInit, ViewChild, ChangeDetectionStrategy } from '@angular/core'; -import { IgxColumnComponent, IgxSummaryOperand } from 'igniteui-angular/grids/core'; -import { IgxSummaryResult } from 'igniteui-angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; +import { IgxColumnComponent } from 'igniteui-angular/grids/core'; +import { IgxSummaryOperand, IgxSummaryResult } from 'igniteui-angular/core'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { generateEmployeeFlatData } from '../data/employees-flat'; import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scroll.directive'; @@ -45,7 +45,6 @@ class PTOSummary { selector: 'app-treegrid-all-data-summary-sample', styleUrls: ['./treegrid-allData-summary.component.scss'], templateUrl: './treegrid-allData-summary.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent] }) export class TreeGridAllDataSummaryComponent implements OnInit { diff --git a/src/app/tree-grid/treegrid-column-autosizing/treegrid-column-autosizing.component.ts b/src/app/tree-grid/treegrid-column-autosizing/treegrid-column-autosizing.component.ts index ae7bdc6492..4d4faf9ac5 100644 --- a/src/app/tree-grid/treegrid-column-autosizing/treegrid-column-autosizing.component.ts +++ b/src/app/tree-grid/treegrid-column-autosizing/treegrid-column-autosizing.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; +import { Component } from '@angular/core'; import { generateEmployeeDetailedFlatData } from '../data/employees-flat-detailed'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; import { IgxColumnComponent } from 'igniteui-angular/grids/core'; @@ -8,7 +8,6 @@ import { IgxPreventDocumentScrollDirective } from '../../directives/prevent-scro selector: 'tree-grid-columnAutoSizing-sample', styleUrls: ['./treegrid-column-autosizing.component.scss'], templateUrl: './treegrid-column-autosizing.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent] }) export class TreeGridColumnAutoSizingSampleComponent { diff --git a/src/app/tree-grid/treegrid-summary-template/treegrid-summary-template.component.ts b/src/app/tree-grid/treegrid-summary-template/treegrid-summary-template.component.ts index 0a8893998c..a523daf01c 100644 --- a/src/app/tree-grid/treegrid-summary-template/treegrid-summary-template.component.ts +++ b/src/app/tree-grid/treegrid-summary-template/treegrid-summary-template.component.ts @@ -1,6 +1,6 @@ -import { Component, HostBinding, OnInit, ChangeDetectionStrategy } from '@angular/core'; -import { IgxColumnComponent, IgxSummaryOperand, IgxSummaryTemplateDirective } from 'igniteui-angular/grids/core'; -import { IgxSummaryResult } from 'igniteui-angular/core'; +import { Component, HostBinding, OnInit } from '@angular/core'; +import { IgxColumnComponent, IgxSummaryTemplateDirective } from 'igniteui-angular/grids/core'; +import { IgxSummaryOperand, IgxSummaryResult } from 'igniteui-angular/core'; import { IgxInputDirective, IgxInputGroupComponent, IgxLabelDirective } from 'igniteui-angular/input-group'; import { IgxSwitchComponent } from 'igniteui-angular/switch'; import { IgxButtonGroupComponent } from 'igniteui-angular/button-group'; @@ -49,7 +49,6 @@ class PTOSummary { selector: 'app-treegrid-summary-template', styleUrls: ['./treegrid-summary-template.component.scss'], templateUrl: './treegrid-summary-template.component.html', - changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxInputGroupComponent, IgxLabelDirective, FormsModule, IgxInputDirective, IgxSwitchComponent, IgxButtonGroupComponent, IgxTreeGridComponent, IgxPreventDocumentScrollDirective, IgxColumnComponent, IgxSummaryTemplateDirective] }) export class TreeGridSummaryTemplateComponent implements OnInit { diff --git a/src/main.server.ts b/src/main.server.ts index 9c6485729a..fbd3e9dbd7 100644 --- a/src/main.server.ts +++ b/src/main.server.ts @@ -1,8 +1,7 @@ -import { provideZoneChangeDetection } from "@angular/core"; import { bootstrapApplication, BootstrapContext } from '@angular/platform-browser'; import { AppComponent } from './app/app.component'; import { config } from './app/app.config.server'; -const bootstrap = (context: BootstrapContext) => bootstrapApplication(AppComponent, {...config, providers: [provideZoneChangeDetection(), ...config.providers]}, context); +const bootstrap = (context: BootstrapContext) => bootstrapApplication(AppComponent, config, context); export default bootstrap; diff --git a/src/main.ts b/src/main.ts index 67e1fd621c..9a1b0b91ea 100644 --- a/src/main.ts +++ b/src/main.ts @@ -1,14 +1,17 @@ -import { enableProdMode, provideZoneChangeDetection } from '@angular/core'; +import { enableProdMode } from '@angular/core'; import { environment } from './environments/environment'; import { defineCustomElements } from 'igniteui-dockmanager/loader'; import { bootstrapApplication } from '@angular/platform-browser'; import { AppComponent } from './app/app.component'; import { AppConfig } from './app/app.config'; +import { initSampleSizeReporter } from '@shared/sample-size-reporter'; if (environment.production) { enableProdMode(); } -bootstrapApplication(AppComponent, {...AppConfig, providers: [provideZoneChangeDetection(), ...AppConfig.providers]}).catch(err => console.log(err)); +initSampleSizeReporter(); + +bootstrapApplication(AppComponent, AppConfig).catch(err => console.log(err)); defineCustomElements(window); diff --git a/src/polyfills.ts b/src/polyfills.ts deleted file mode 100644 index 665b7dacbd..0000000000 --- a/src/polyfills.ts +++ /dev/null @@ -1,58 +0,0 @@ -/** - * This file includes polyfills needed by Angular and is loaded before the app. - * You can add your own extra polyfills to this file. - * - * This file is divided into 2 sections: - * 1. Browser polyfills. These are applied before loading ZoneJS and are sorted by browsers. - * 2. Application imports. Files imported after ZoneJS that should be loaded before your main - * file. - * - * The current setup is for so-called 'evergreen' browsers; the last versions of browsers that - * automatically update themselves. This includes Safari >= 10, Chrome >= 55 (including Opera), - * Edge >= 13 on the desktop, and iOS 10 and Chrome on mobile. - * - * Learn more in https://angular.io/guide/browser-support - */ - -/*************************************************************************************************** -* BROWSER POLYFILLS -*/ - -//import 'core-js/es7/object'; - -//import 'core-js/es7/array'; // for Array.includes() // Run `npm install --save classlist.js`. - -/** IE10 and IE11 requires the following for the Reflect API. */ -//import 'core-js/es6/reflect'; - -/* Evergreen browsers require these. */ -// Used for reflect-metadata in JIT. If you use AOT (and only Angular decorators), you can remove. -//import 'core-js/es7/reflect'; // Run `npm install --save web-animations-js`. - -/*************************************************************************************************** - * Zone JS is required by Angular itself. - */ -import 'hammerjs/hammer'; -import 'zone.js'; // Included with Angular CLI. - -/*************************************************************************************************** - * @angular/animations polyfill - */ -// if (!Element.prototype.matches) { -// Element.prototype.matches = (Element.prototype as any).msMatchesSelector; -// } - -/*************************************************************************************************** - * APPLICATION IMPORTS - */ - -/** - * Date, currency, decimal and percent pipes. - * Needed for: All but Chrome, Firefox, Edge, IE11 and Safari 10 - */ -// import 'intl'; // Run `npm install --save intl`. -// import 'intl/locale-data/jsonp/de'; -/** - * Need to import at least one locale-data with intl. - */ -// import 'intl/locale-data/jsonp/en'; diff --git a/src/sample-size-reporter.ts b/src/sample-size-reporter.ts new file mode 100644 index 0000000000..bef1d1f376 --- /dev/null +++ b/src/sample-size-reporter.ts @@ -0,0 +1,85 @@ +/** + * Demo-side half of the docs contract + * (astro-components/src/scripts/sample-widget.ts). + * + * The docs host posts { type: 'igd-sample-fit', width?: boolean } into the + * iframe when it loads. In response we neutralize the viewport-bound sizing + * from styles.scss (html/body height: 100%, overflow: hidden — which would + * only echo the iframe's height back) and report the content's size with + * { type: 'igd-sample-height', height, width? } immediately and on every + * resize. Demos embedded at a fixed height never receive the enable message, + * so this stays dormant for them and their percentage layouts are untouched. + */ +const FIT_ENABLE = 'igd-sample-fit'; +const FIT_REPORT = 'igd-sample-height'; + +export function initSampleSizeReporter(): void { + if (typeof window === 'undefined' || window.parent === window) { + return; + } + + let reportWidth = false; + let observer: ResizeObserver | null = null; + let styled = false; + // Captured from the host's enable message so replies go back to that exact + // origin instead of being broadcast to any window that happens to listen. + let hostOrigin = '*'; + + // Right-most element edge, mirroring the host's same-origin measurement: + // block-level content stretches to the viewport width, so the intrinsic + // width has to come from the element boxes, not the body itself. + const measureWidth = (): number | undefined => { + const body = document.body; + const left = body.getBoundingClientRect().left; + let right = left; + body.querySelectorAll('*').forEach(el => { + right = Math.max(right, el.getBoundingClientRect().right); + }); + if (right <= left) { + return undefined; + } + const cs = getComputedStyle(body); + return right - left + parseFloat(cs.paddingRight || '0') + parseFloat(cs.borderRightWidth || '0'); + }; + + const report = () => { + const height = Math.max( + document.documentElement.offsetHeight, + document.body.offsetHeight, + document.body.scrollHeight + ); + window.parent.postMessage( + { type: FIT_REPORT, height, width: reportWidth ? measureWidth() : undefined }, + hostOrigin + ); + }; + + window.addEventListener('message', (e: MessageEvent) => { + if (e.source !== window.parent) { + return; + } + if (!e.origin || !/^https?:\/\//.test(e.origin)) { + return; + } + if (!e.data || e.data.type !== FIT_ENABLE) { + return; + } + reportWidth = Boolean(e.data.width); + hostOrigin = e.origin; + + if (!styled) { + styled = true; + const style = document.createElement('style'); + style.textContent = + 'html, body { height: auto !important; overflow: visible !important; }' + + '.sample-wrapper { height: auto !important; }'; + document.head.appendChild(style); + } + + report(); + if ('ResizeObserver' in window && !observer) { + observer = new ResizeObserver(report); + observer.observe(document.body); + } + }); +} diff --git a/src/styles.scss b/src/styles.scss index 16c8722ea8..8c144ff6dd 100644 --- a/src/styles.scss +++ b/src/styles.scss @@ -19,6 +19,21 @@ body { margin: 0; } +body.custom-body:has( + app-badge-overview, + app-badge-styling, + app-badge-dot, + app-badge-type, + app-badge-icon, + app-badge-size, + app-badge-shape, + app-badge-variants, + app-badge-outlined, + app-badge-tailwind-styling +) { + background: transparent; +} + @include core(); @include typography(); @include theme( diff --git a/src/test.ts b/src/test.ts index b3163668c2..a3a396fe2a 100644 --- a/src/test.ts +++ b/src/test.ts @@ -1,30 +1,24 @@ -// This file is required by karma.conf.js and loads recursively all the .spec and framework files - -import { getTestBed } from '@angular/core/testing'; -import { - BrowserDynamicTestingModule, - platformBrowserDynamicTesting -} from '@angular/platform-browser-dynamic/testing'; -import 'zone.js/dist/async-test'; -import 'zone.js/dist/fake-async-test'; -import 'zone.js/dist/jasmine-patch'; -import 'zone.js/dist/long-stack-trace-zone'; -import 'zone.js/dist/proxy.js'; -import 'zone.js/dist/sync-test'; - -// Unfortunately there's no typing for the `__karma__` variable. Just declare it as any. -// eslint-disable-next-line @typescript-eslint/naming-convention -declare const __karma__: any; - -// Prevent Karma from running prematurely. -__karma__.loaded = () => {}; - -// First, initialize the Angular testing environment. -getTestBed().initTestEnvironment( - BrowserDynamicTestingModule, +// This file is required by karma.conf.js and loads recursively all the .spec and framework files + +import { getTestBed } from '@angular/core/testing'; +import { + BrowserDynamicTestingModule, + platformBrowserDynamicTesting +} from '@angular/platform-browser-dynamic/testing'; + +// Unfortunately there's no typing for the `__karma__` variable. Just declare it as any. +// eslint-disable-next-line @typescript-eslint/naming-convention +declare const __karma__: any; + +// Prevent Karma from running prematurely. +__karma__.loaded = () => {}; + +// First, initialize the Angular testing environment. +getTestBed().initTestEnvironment( + BrowserDynamicTestingModule, platformBrowserDynamicTesting(), { teardown: { destroyAfterEach: false } -} -); -// Finally, start Karma to run the tests. -__karma__.start(); +} +); +// Finally, start Karma to run the tests. +__karma__.start(); diff --git a/src/tsconfig.spec.json b/src/tsconfig.spec.json index 14bd16c8ed..327d00f448 100644 --- a/src/tsconfig.spec.json +++ b/src/tsconfig.spec.json @@ -9,8 +9,7 @@ ] }, "files": [ - "test.ts", - "polyfills.ts" + "test.ts" ], "include": [ "**/*.spec.ts", diff --git a/tsconfig.json b/tsconfig.json index a9f83e075c..a576502869 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -1,6 +1,9 @@ { "compileOnSave": false, "compilerOptions": { + "paths": { + "@shared/sample-size-reporter": ["./src/sample-size-reporter.ts"] + }, "importHelpers": true, "module": "ES2022", "outDir": "./dist/out-tsc",