Merge pull request #3327 from IgniteUI/vnext

hanastasov · web-flow · commit 2cea049d24bc · 2023-05-23T11:21:06.000+03:00
Updating PROD with latest fix and enhacements
diff --git a/live-editing/configs/AccordionConfigGenerator.ts b/live-editing/configs/AccordionConfigGenerator.ts
@@ -4,7 +4,8 @@ import {
     IgxTimePickerModule,
     IgxSliderModule,
     IgxCheckboxModule,
-    IgxSwitchModule
+    IgxSwitchModule,
+    IgxIconModule
 } from 'igniteui-angular';
 import { AppModuleConfig, Config, IConfigGenerator } from 'igniteui-live-editing';
 
@@ -37,10 +38,10 @@ export class AccordionConfigGenerator implements IConfigGenerator {
             component: 'AccordionSample3Component',
             appModuleConfig: new AppModuleConfig({
                 imports: ['IgxCheckboxModule', 'IgxSliderModule',
-                    'IgxRadioModule', 'IgxTimePickerModule', 'AccordionSample3Component', 'IgxAccordionModule'],
+                    'IgxRadioModule', 'IgxTimePickerModule', 'AccordionSample3Component', 'IgxAccordionModule', 'IgxIconModule'],
                 ngDeclarations: ['AccordionSample3Component'],
                 ngImports: ['IgxCheckboxModule', 'IgxSliderModule',
-                    'IgxRadioModule', 'IgxTimePickerModule', 'IgxAccordionModule']
+                    'IgxRadioModule', 'IgxTimePickerModule', 'IgxAccordionModule', 'IgxIconModule']
             }),
             shortenComponentPathBy: '/layouts/accordion/'
         }));
diff --git a/live-editing/configs/BannerConfigGenerator.ts b/live-editing/configs/BannerConfigGenerator.ts
@@ -88,8 +88,7 @@ export class BannerConfigGenerator implements IConfigGenerator {
             additionalFiles: ["/src/app/notifications/banner/banner-samples.scss"],
             appModuleConfig: new AppModuleConfig({
                 imports: ['IgxBannerModule', 'IgxCardModule', 'IgxToastModule', 'IgxNavbarModule', 'IgxButtonModule',
-                    'IgxRippleModule', 'IgxIconModule', 'IgxButtonModule',
-                    'IgxRippleModule', 'BannerStylingComponent'],
+                    'IgxRippleModule', 'IgxIconModule', 'BannerStylingComponent'],
                 ngDeclarations: ['BannerStylingComponent'],
                 ngImports: ['IgxBannerModule', 'IgxCardModule', 'IgxToastModule',  'IgxNavbarModule', 'IgxButtonModule',
                     'IgxRippleModule', 'IgxIconModule', 'IgxButtonModule',
diff --git a/live-editing/configs/CardConfigGenerator.ts b/live-editing/configs/CardConfigGenerator.ts
@@ -102,14 +102,16 @@ export class CardConfigGenerator implements IConfigGenerator {
                     'IgxButtonModule',
                     'IgxCardModule',
                     'IgxRippleModule',
-                    'CardSample3Component'
+                    'CardSample3Component',
+                    'IgxLayoutModule',
                 ],
                 ngDeclarations: ['CardSample3Component'],
                 ngImports: [
                     'IgxAvatarModule',
                     'IgxButtonModule',
                     'IgxCardModule',
-                    'IgxRippleModule'
+                    'IgxRippleModule',
+                    'IgxLayoutModule',
                 ]
             }),
             additionalFiles: [
diff --git a/live-editing/configs/DateRangePickerConfigGenerator.ts b/live-editing/configs/DateRangePickerConfigGenerator.ts
@@ -1,6 +1,8 @@
 import {IgxDateRangePickerModule,
 IgxIconModule,
 IgxInputGroupModule,
+IgxDateTimeEditorModule,
+IgxDatePickerModule,
 IgxSelectModule} from 'igniteui-angular';
 import {AppModuleConfig, Config, IConfigGenerator} from 'igniteui-live-editing'
 export class DateRangePickerConfigGenerator implements IConfigGenerator {
@@ -50,10 +52,10 @@ export class DateRangePickerConfigGenerator implements IConfigGenerator {
             new Config({
                 component: 'DateRangePickerStartEndComponent',
                 appModuleConfig: new AppModuleConfig({
-                    imports: ['IgxDateRangePickerModule', 'DateRangePickerStartEndComponent',
+                    imports: ['IgxDateRangePickerModule', 'DateRangePickerStartEndComponent', 'IgxDatePickerModule', 'IgxDateTimeEditorModule',
                         'IgxInputGroupModule', 'IgxIconModule' ],
                     ngDeclarations: ['DateRangePickerStartEndComponent'],
-                    ngImports: ['IgxDateRangePickerModule', 'IgxInputGroupModule', 'IgxIconModule']
+                    ngImports: ['IgxDateRangePickerModule', 'IgxDatePickerModule', 'IgxDateTimeEditorModule', 'IgxInputGroupModule', 'IgxIconModule']
                 }),
                 shortenComponentPathBy: "/scheduling/daterangepicker/"
             })
@@ -63,10 +65,10 @@ export class DateRangePickerConfigGenerator implements IConfigGenerator {
             new Config({
                 component: 'DateRangePickerValidationComponent',
                 appModuleConfig: new AppModuleConfig({
-                    imports: ['IgxDateRangePickerModule', 'DateRangePickerValidationComponent',
-                        'IgxInputGroupModule', 'IgxIconModule'],
+                    imports: ['IgxDateRangePickerModule', 'DateRangePickerValidationComponent', 'IgxDatePickerModule',
+                        'IgxInputGroupModule', 'IgxIconModule', 'IgxDateTimeEditorModule'],
                     ngDeclarations: ['DateRangePickerValidationComponent'],
-                    ngImports: ['IgxDateRangePickerModule', 'IgxInputGroupModule', 'IgxIconModule']
+                    ngImports: ['IgxDateRangePickerModule', 'IgxDatePickerModule', 'IgxInputGroupModule', 'IgxIconModule', 'IgxDateTimeEditorModule']
                 }),
                 shortenComponentPathBy: "/scheduling/daterangepicker/"
             })
@@ -77,9 +79,9 @@ export class DateRangePickerConfigGenerator implements IConfigGenerator {
                 component: 'StyledDateRangePickerComponent',
                 appModuleConfig: new AppModuleConfig({
                     imports: ['IgxDateRangePickerModule', 'StyledDateRangePickerComponent',
-                        'IgxInputGroupModule', 'IgxIconModule'],
+                        'IgxInputGroupModule', 'IgxIconModule', 'IgxDatePickerModule' , 'IgxDateTimeEditorModule'],
                     ngDeclarations: ['StyledDateRangePickerComponent'],
-                    ngImports: ['IgxDateRangePickerModule', 'IgxInputGroupModule', 'IgxIconModule']
+                    ngImports: ['IgxDateRangePickerModule', 'IgxDatePickerModule', 'IgxDateTimeEditorModule', 'IgxInputGroupModule', 'IgxIconModule']
                 }),
                 shortenComponentPathBy: "/scheduling/daterangepicker/"
             })
diff --git a/live-editing/configs/GridConfigGenerator.ts b/live-editing/configs/GridConfigGenerator.ts
@@ -1016,9 +1016,9 @@ export class GridConfigGenerator implements IConfigGenerator {
             component: 'GridColumnDataTypesSampleComponent',
             additionalFiles: ['/src/app/directives/prevent-scroll.directive.ts', '/src/app/data/nwindData.ts'],
             appModuleConfig: new AppModuleConfig({
-                imports: ['GridColumnDataTypesSampleComponent', 'IgxGridModule', 'IgxTooltipModule', 'IgxPreventDocumentScrollModule'],
+                imports: ['GridColumnDataTypesSampleComponent', 'IgxGridModule', 'IgxTooltipModule', 'IgxInputGroupModule', 'IgxSelectModule', 'IgxPreventDocumentScrollModule'],
                 ngDeclarations: ['GridColumnDataTypesSampleComponent'],
-                ngImports: ['IgxPreventDocumentScrollModule', 'IgxGridModule', 'IgxTooltipModule']
+                ngImports: ['IgxPreventDocumentScrollModule', 'IgxGridModule', 'IgxTooltipModule', 'IgxInputGroupModule', 'IgxSelectModule']
             })
         }));
 
diff --git a/live-editing/configs/NavbarConfigGenerator.ts b/live-editing/configs/NavbarConfigGenerator.ts
@@ -32,8 +32,8 @@ export class NavbarConfigGenerator implements IConfigGenerator {
             component: 'NavbarSample2Component',
             appModuleConfig: new AppModuleConfig({
                 imports: ['IgxIconModule', 'IgxNavbarModule', 'IgxButtonModule', 'NavbarSample2Component'],
-                ngDeclarations: ['NavbarSample2Component', 'IgxButtonModule' ],
-                ngImports: ['IgxIconModule', 'IgxNavbarModule']
+                ngDeclarations: ['NavbarSample2Component'],
+                ngImports: ['IgxIconModule', 'IgxNavbarModule', 'IgxButtonModule' ]
             }),
             shortenComponentPathBy: "/menus/navbar/"
         }));
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
@@ -9,7 +9,7 @@
         </div>
         <div class="actionItem">
             <!-- Change volume -->
-            <igx-select [(ngModel)]="dataVolume" (ngModelChange)="paramsChanged()" [overlaySettings]="customOverlaySettings">
+            <igx-select [(ngModel)]="dataVolume" (ngModelChange)="paramsChanged()" [overlaySettings]="customOverlaySettings" [displayDensity]="'compact'">
                 <label igxLabel>Change data volume</label>
                 <igx-prefix>
                     <igx-icon>view_list</igx-icon>
@@ -21,7 +21,7 @@
         </div>
         <div class="actionItem">
             <!-- Change frequency -->
-            <igx-select [(ngModel)]="frequency" (ngModelChange)="paramsChanged()" [overlaySettings]="freqOverlaySettings" #freq>
+            <igx-select [(ngModel)]="frequency" (ngModelChange)="paramsChanged()" [overlaySettings]="freqOverlaySettings" [displayDensity]="'compact'" #freq>
                 <label igxLabel>Change update frequency</label>
                 <igx-prefix>
                     <igx-icon>cell_wifi</igx-icon>
@@ -166,4 +166,4 @@
     <ng-template #host gridHost>
     </ng-template>
 </igc-dockmanager>
-<div class="dark-theme" #filteringOverlayOutlet="overlay-outlet" igxOverlayOutlet></div>
+<div [class]="isDarkTheme ? 'dark-theme' : 'light-theme'" #filteringOverlayOutlet="overlay-outlet" igxOverlayOutlet></div>
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
@@ -127,7 +127,7 @@
 	}
 }
 
-:host ::ng-deep {
+igx-grid {
 	.grid-area {
 		margin-block-start: 1rem;
 		overflow-y: hidden;
diff --git a/projects/app-lob/src/app/grid-finjs-dock-manager/grid-finjs-dock-manager.module.ts b/projects/app-lob/src/app/grid-finjs-dock-manager/grid-finjs-dock-manager.module.ts
@@ -2,7 +2,7 @@
 import { CommonModule } from '@angular/common';
 import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
 import { FormsModule } from '@angular/forms';
-import { IgxButtonModule, IgxDialogModule, IgxDividerModule, IgxGridModule, IgxSliderModule,
+import { IgxButtonModule, IgxDialogModule, IgxDividerModule, IgxGridModule, IgxIconModule, IgxSelectModule, IgxSliderModule,
     IgxSwitchModule, IgxTabsModule, IgxToggleModule } from 'igniteui-angular';
 import { GridFinJSDockManagerRoutingModule } from './grid-finjs-dock-manager-routing.module';
 import { GridFinJSDockManagerComponent } from './grid-finjs-dock-manager.component';
@@ -27,7 +27,9 @@ import { IgxPreventDocumentScrollModule } from '../../../../../src/app/directive
         IgxDialogModule,
         IgxDividerModule,
         IgxTabsModule,
-        IgxToggleModule
+        IgxToggleModule,
+        IgxSelectModule,
+        IgxIconModule
     ],
     providers: [],
     schemas: [CUSTOM_ELEMENTS_SCHEMA]
diff --git a/projects/app-lob/src/assets/images/carousel/ignite-ui-angular-charts.png b/projects/app-lob/src/assets/images/carousel/ignite-ui-angular-charts.png
diff --git a/projects/app-lob/src/assets/images/carousel/ignite-ui-angular-indigo-design.png b/projects/app-lob/src/assets/images/carousel/ignite-ui-angular-indigo-design.png
diff --git a/projects/app-lob/src/assets/images/carousel/slider-image-chart.png b/projects/app-lob/src/assets/images/carousel/slider-image-chart.png
diff --git a/projects/app-lob/src/assets/images/stepper/card-blue.png b/projects/app-lob/src/assets/images/stepper/card-blue.png
diff --git a/projects/app-lob/src/assets/images/stepper/card-gold.png b/projects/app-lob/src/assets/images/stepper/card-gold.png
diff --git a/projects/app-lob/src/assets/images/stepper/card-red.png b/projects/app-lob/src/assets/images/stepper/card-red.png
diff --git a/projects/app-lob/src/styles.scss b/projects/app-lob/src/styles.scss
@@ -29,8 +29,16 @@ 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 {
+        --igx-chip-disabled-background: #616161;
+        --igx-chip-disabled-border-color: #616161;
+        --igx-chip-disabled-text-color: #BDBDBD;
+    }
 }
-
 .fin-dark-theme {
     @include dark-theme($green-palette);
     background: #333;
diff --git a/src/app/layouts/carousel/carousel-animations-sample/carousel-animations-sample.component.html b/src/app/layouts/carousel/carousel-animations-sample/carousel-animations-sample.component.html
@@ -1,7 +1,7 @@
 <div class="carousel-animation-wrapper">
     <div class="action-wrapper">
-        <span style="margin: 0 5px 0 10px;">Current animation: </span>
-        <span style="max-width: 100px;">
+        <span>Current animation: </span>
+        <span class="select-container">
             <igx-select #select [(ngModel)]="carousel.animationType">
                 <igx-select-item *ngFor="let animation of animations" [value]="animation">
                     {{animation | titlecase}}
@@ -17,15 +17,15 @@
                         <igx-card-header>
                             <h4 igxCardHeaderTitle>{{slide.heading}}</h4>
                         </igx-card-header>
-
+ 
                         <igx-card-content>
                             <p>{{slide.description}}</p>
                         </igx-card-content>
-
+ 
                         <igx-card-media>
                             <img [src]="slide.image">
                         </igx-card-media>
-
+ 
                         <igx-card-actions>
                             <a igxButton href="{{slide.link}}" target="_blank" rel="noopener" style="text-decoration: none;" igxStart>visit page</a>
                         </igx-card-actions>
@@ -36,3 +36,4 @@ <h4 igxCardHeaderTitle>{{slide.heading}}</h4>
         </igx-carousel>
     </div>
 </div>
+ 
diff --git a/src/app/layouts/carousel/carousel-animations-sample/carousel-animations-sample.component.scss b/src/app/layouts/carousel/carousel-animations-sample/carousel-animations-sample.component.scss
@@ -5,35 +5,55 @@
     justify-content: center;
     height: 100%;
     padding: 10px;
-
+ 
     img {
         width: 100%;
     }
 }
-
+ 
 .carousel-wrapper {
     max-height: 600px;
     height: 100%;
     width: 90%;
     margin: 20px auto;
 }
-
+ 
 .action-wrapper {
     height: 40px;
     width: 70%;
     display: flex;
     align-items: baseline;
     margin-bottom: 1rem;
-    margin-left: 1rem;
+    margin-left: 5.7rem;
 }
-
+ 
 .carousel-animation-wrapper {
     height: 700px;
     margin: 16px auto;
     display: flex;
     flex-flow: column;
 }
-
+ 
 .igx-card {
     box-shadow: none;
 }
+ 
+.select-container {
+    margin-left: 10px;
+}
+ 
+span:first-child {
+    position: relative;
+    bottom: 2px;
+}
+ 
+igx-select {
+    width: 150px;
+}
+ 
+::ng-deep {
+    .input.igx-input-group__input {
+        top: 10px;
+        left: 10px;
+    }
+}

Original file line number	Diff line number	Diff line change
`@@ -127,7 +127,7 @@`
`127`	`127`	`}`
`128`	`128`	`}`
`129`	`129`
`130`		`-:host ::ng-deep {`
	`130`	`+igx-grid {`
`131`	`131`	`.grid-area {`
`132`	`132`	`margin-block-start: 1rem;`
`133`	`133`	`overflow-y: hidden;`