Merge branch '20.1.x' into randriova/calendar-i18n-20.1.x

Author: randriova

angular.json

@@ -307,8 +307,8 @@
                 {
                   "type": "bundle",
                   "name": "styles",
-                  "maximumWarning": "500kb",
-                  "maximumError": "550kb"
+                  "maximumWarning": "600kb",
+                  "maximumError": "600kb"
                 },
                 {
                   "type": "anyComponentStyle",

projects/igniteui-angular/src/lib/calendar/days-view/days-view.component.ts

@@ -13,14 +13,17 @@ import {
     ElementRef,
     ChangeDetectorRef,
     ChangeDetectionStrategy,
+    inject,
+    DestroyRef,
+    AfterContentChecked
 } from '@angular/core';
 import { NG_VALUE_ACCESSOR } from '@angular/forms';
 import { TitleCasePipe } from '@angular/common';
 import { CalendarSelection, ScrollDirection } from '../../calendar/calendar';
 import { IgxDayItemComponent } from './day-item.component';
 import { DateRangeType } from '../../core/dates';
 import { IgxCalendarBaseDirective } from '../calendar-base';
-import { PlatformUtil, intoChunks } from '../../core/utils';
+import {PlatformUtil, intoChunks, getComponentTheme} from '../../core/utils';
 import { IViewChangingEventArgs } from './days-view.interface';
 import {
     areSameMonth,
@@ -31,6 +34,7 @@ import {
     isDateInRanges,
 } from "../common/helpers";
 import { CalendarDay } from '../common/model';
+import {IgxTheme, THEME_TOKEN, ThemeToken} from "../../services/theme/theme.token";
 
 let NEXT_ID = 0;
 
@@ -47,7 +51,7 @@ let NEXT_ID = 0;
     changeDetection: ChangeDetectionStrategy.OnPush,
     imports: [IgxDayItemComponent, TitleCasePipe]
 })
-export class IgxDaysViewComponent extends IgxCalendarBaseDirective {
+export class IgxDaysViewComponent extends IgxCalendarBaseDirective implements AfterContentChecked {
     #standalone = true;
 
     /**
@@ -197,6 +201,33 @@ export class IgxDaysViewComponent extends IgxCalendarBaseDirective {
     private _hideTrailingDays: boolean;
     private _showActiveDay: boolean;
 
+    private _destroyRef = inject(DestroyRef);
+    private _theme: IgxTheme;
+
+    @HostBinding('class.igx-days-view')
+    public defaultClass = true;
+
+    // Theme-specific classes
+    @HostBinding('class.igx-days-view--material')
+    protected get isMaterial(): boolean {
+        return this._theme === 'material';
+    }
+
+    @HostBinding('class.igx-days-view--fluent')
+    protected get isFluent(): boolean {
+        return this._theme === 'fluent';
+    }
+
+    @HostBinding('class.igx-days-view--bootstrap')
+    protected get isBootstrap(): boolean {
+        return this._theme === 'bootstrap';
+    }
+
+    @HostBinding('class.igx-days-view--indigo')
+    protected get isIndigo(): boolean {
+        return this._theme === 'indigo';
+    }
+
     /**
      * @hidden
      */
@@ -205,8 +236,37 @@ export class IgxDaysViewComponent extends IgxCalendarBaseDirective {
         @Inject(LOCALE_ID) _localeId: string,
         protected el: ElementRef,
         public override cdr: ChangeDetectorRef,
+        @Inject(THEME_TOKEN) private themeToken: ThemeToken
+
     ) {
         super(platform, _localeId, null, cdr);
+
+        this._theme = this.themeToken.theme;
+
+        const themeChange = this.themeToken.onChange((theme) => {
+            if (this._theme !== theme) {
+                this._theme = theme;
+                this.cdr.detectChanges();
+            }
+        });
+
+        this._destroyRef.onDestroy(() => themeChange.unsubscribe());
+    }
+
+    private setComponentTheme() {
+        // allow DOM theme override (same pattern as input-group)
+        if (!this.themeToken.preferToken) {
+            const theme = getComponentTheme(this.el.nativeElement);
+
+            if (theme && theme !== this._theme) {
+                this._theme = theme;
+                this.cdr.markForCheck();
+            }
+        }
+    }
+
+    public ngAfterContentChecked() {
+        this.setComponentTheme();
     }
 
     /**