igniteui-angular 19.0.1 → 19.0.3

package/lib/carousel/carousel.component.d.ts

@@ -43,6 +43,7 @@ export declare class IgxCarouselComponent extends IgxCarouselComponentBase imple
     private iterableDiffers;
     private platformUtil;
     private dir;
+    private document;
     /**
      * Sets the `id` of the carousel.
      * If not set, the `id` of the first carousel component will be `"igx-carousel-0"`.
@@ -418,7 +419,7 @@ export declare class IgxCarouselComponent extends IgxCarouselComponentBase imple
      * @memberof IgxCarouselComponent
      */
     set interval(value: number);
-    constructor(cdr: ChangeDetectorRef, element: ElementRef, iterableDiffers: IterableDiffers, animationService: AnimationService, platformUtil: PlatformUtil, dir: IgxDirectionality);
+    constructor(cdr: ChangeDetectorRef, element: ElementRef, iterableDiffers: IterableDiffers, animationService: AnimationService, platformUtil: PlatformUtil, dir: IgxDirectionality, document: any);
     /** @hidden */
     onKeydownArrowRight(event: any): void;
     /** @hidden */

package/lib/checkbox/checkbox.component.d.ts

@@ -3,7 +3,7 @@ import { ControlValueAccessor, NgControl } from '@angular/forms';
 import { IBaseEventArgs } from '../core/utils';
 import { EditorProvider } from '../core/edit-provider';
 import { Subject } from 'rxjs';
-import { IgxTheme, ThemeService } from '../services/theme/theme.service';
+import { IgxTheme, ThemeToken } from '../services/theme/theme.token';
 import * as i0 from "@angular/core";
 export declare const LabelPosition: {
     BEFORE: "before";
@@ -39,7 +39,7 @@ export interface IChangeCheckboxEventArgs extends IBaseEventArgs {
 export declare class IgxCheckboxComponent implements EditorProvider, AfterViewInit, ControlValueAccessor {
     protected cdr: ChangeDetectorRef;
     protected renderer: Renderer2;
-    protected themeService: ThemeService;
+    protected themeToken: ThemeToken;
     ngControl: NgControl;
     /**
      * An event that is emitted after the checkbox state is changed.
@@ -380,10 +380,9 @@ export declare class IgxCheckboxComponent implements EditorProvider, AfterViewIn
      */
     private _required;
     private elRef;
-    private _theme$;
-    private _subscription;
     private destroyRef;
-    constructor(cdr: ChangeDetectorRef, renderer: Renderer2, themeService: ThemeService, ngControl: NgControl);
+    constructor(cdr: ChangeDetectorRef, renderer: Renderer2, themeToken: ThemeToken, ngControl: NgControl);
+    private setComponentTheme;
     /**
      * @hidden
      * @internal

package/lib/core/styles/components/avatar/_avatar-theme.scss

@@ -68,23 +68,7 @@
     @include css-vars($theme);
 
     $variant: map.get($theme, '_meta', 'variant');
-    $bootstrap-theme: $variant == 'bootstrap';
-    $box-shadow: map.get((
-        'material': null,
-        'fluent': null,
-        'bootstrap': 0 0 0 rem(3px) var-get($theme, 'background'),
-        'indigo': null,
-    ), $variant);
-
-    %igx-avatar-outline {
-        position: absolute;
-        content: '';
-        width: 100%;
-        height: 100%;
-        border-radius: inherit;
-        opacity: .5;
-    }
-
+ 
     %igx-avatar-display {
         @include sizable();
 
@@ -114,20 +98,6 @@
                 --component-size: 1;
             }
         }
-
-        &::after {
-            box-shadow: none;
-
-            @if $bootstrap-theme {
-                @extend %igx-avatar-outline;
-            }
-
-            transition: box-shadow .15s $in-out-quad;
-        }
-
-        &:focus::after {
-            box-shadow: $box-shadow;
-        }
     }
 
     %igx-avatar-image {

package/lib/core/styles/components/card/_card-theme.scss

@@ -450,7 +450,7 @@
         }
     }
 
-    %igx-card-content > * {
+    %igx-card-content > *:not(igx-icon) {
         @include type-style($content) {
             margin: 0;
         }

package/lib/core/styles/components/combo/_combo-theme.scss

@@ -95,6 +95,20 @@
 
     $variant: map.get($theme, '_meta', 'variant');
 
+    $search-input-inline-padding: map.get((
+        'material': pad-inline(rem(4px), rem(8px), rem(16px)),
+        'fluent': pad-inline(rem(2px), rem(4px), rem(8px)),
+        'bootstrap': pad-inline(rem(4px), rem(8px), rem(16px)),
+        'indigo': pad-inline(rem(12px))
+    ), $variant);
+
+    $search-input-block-padding: map.get((
+        'material': pad-inline(rem(8px)),
+        'fluent': pad-inline(rem(2px), rem(4px), rem(8px)),
+        'bootstrap': pad-inline(rem(8px)),
+        'indigo': pad-inline(rem(12px))
+    ), $variant);
+
     %igx-combo {
         position: relative;
         display: block;
@@ -122,8 +136,8 @@
     }
 
     %igx-combo__search {
-        padding-inline: if($variant == 'indigo', pad-inline(rem(12px)), pad-inline(rem(16px)));
-        padding-block: if($variant == 'indigo', pad-block(rem(12px)), pad-block(rem(8px)));
+        padding-inline: $search-input-inline-padding;
+        padding-block: $search-input-block-padding;
         margin: 0 !important;
         z-index: 26;
         border-bottom: rem(1px) dashed var-get($theme, 'search-separator-border-color');
@@ -134,12 +148,12 @@
         }
 
         .igx-input-group__bundle-main {
-            padding-inline-start: 0;
+            padding-inline: 0;
         }
 
         .igx-input-group__bundle-start,
         .igx-input-group__bundle-end {
-            display: none;
+            min-width: 0;
         }
 
         igx-input-group {
@@ -150,10 +164,10 @@
 
     %igx-combo__case-icon,
     %igx-combo__case-icon--active {
-        .igx-icon {
-            width: rem(16px);
-            height: rem(16px);
-            font-size: rem(16px);
+        line-height: 0;
+
+        igx-icon {
+            --size: rem(18px);
         }
     }
 

package/lib/core/styles/components/input/_input-group-theme.scss

@@ -422,12 +422,15 @@
         }
 
         input,
-        textarea,
-        span {
+        textarea {
             font: inherit;
             margin: 0;
         }
 
+        span {
+            font-family: inherit;
+        }
+
         input[type='file'] {
             @include hide-default();
         }

package/lib/core/utils.d.ts

@@ -1,5 +1,6 @@
 import { InjectionToken } from '@angular/core';
 import { Observable } from 'rxjs';
+import { IgxTheme } from '../services/theme/theme.token';
 import * as i0 from "@angular/core";
 /** @hidden @internal */
 export declare const ELEMENTS_TOKEN: InjectionToken<boolean>;
@@ -314,3 +315,4 @@ export declare function getComponentCssSizeVar(size: string): "var(--ig-size, va
  * @returns string encoded using the encodeURI function.
  */
 export declare function normalizeURI(path: string): string;
+export declare function getComponentTheme(el: Element): IgxTheme;

package/lib/directives/drag-drop/drag-drop.directive.d.ts

@@ -467,6 +467,7 @@ export declare class IgxDragDirective implements AfterContentInit, OnDestroy {
     protected _scrollContainerStepMs: number;
     protected _scrollContainerThreshold: number;
     protected _containerScrollIntervalId: any;
+    private document;
     /**
      * Sets the offset of the dragged element relative to the mouse in pixels.
      * By default it's taking the relative position to the mouse when the drag started and keeps it the same.

package/lib/icon/icon.component.d.ts

@@ -2,7 +2,6 @@ import { ElementRef, OnInit, OnDestroy, OnChanges, ChangeDetectorRef } from "@an
 import { IgxIconService } from "./icon.service";
 import type { IconReference } from "./types";
 import { SafeHtml } from "@angular/platform-browser";
-import { ThemeService } from "../services/theme/theme.service";
 import * as i0 from "@angular/core";
 /**
  * Icon provides a way to include material icons to markup
@@ -29,7 +28,6 @@ import * as i0 from "@angular/core";
 export declare class IgxIconComponent implements OnInit, OnChanges, OnDestroy {
     el: ElementRef;
     private iconService;
-    private themeService;
     private ref;
     private _iconRef;
     private _destroy$;
@@ -38,20 +36,6 @@ export declare class IgxIconComponent implements OnInit, OnChanges, OnDestroy {
     protected get elementClasses(): string;
     private addIconClass;
     private clearIconClasses;
-    /**
-     *  This allows you to disable the `aria-hidden` attribute. By default it's applied.
-     *
-     * @example
-     * ```typescript
-     * @ViewChild("MyIcon") public icon: IgxIconComponent;
-     * constructor(private cdRef:ChangeDetectorRef) {}
-     * ngAfterViewInit() {
-     *     this.icon.ariaHidden = false;
-     *     this.cdRef.detectChanges();
-     * }
-     * ```
-     */
-    ariaHidden: boolean;
     /**
      *  An accessor that returns inactive property.
      *
@@ -92,7 +76,7 @@ export declare class IgxIconComponent implements OnInit, OnChanges, OnDestroy {
      * ```
      */
     active: boolean;
-    constructor(el: ElementRef, iconService: IgxIconService, themeService: ThemeService, ref: ChangeDetectorRef);
+    constructor(el: ElementRef, iconService: IgxIconService, ref: ChangeDetectorRef);
     /**
      * @hidden
      * @internal

package/lib/icon/icon.service.d.ts

@@ -1,10 +1,11 @@
+import { DestroyRef } from "@angular/core";
 import { DomSanitizer, SafeHtml } from "@angular/platform-browser";
 import { HttpClient } from "@angular/common/http";
 import { Observable } from "rxjs";
 import { PlatformUtil } from "../core/utils";
 import { IconFamily, IconMeta, FamilyMeta } from "./types";
 import type { IconType, IconReference } from './types';
-import { IgxTheme } from "../services/theme/theme.service";
+import { IgxTheme, ThemeToken } from "../services/theme/theme.token";
 import * as i0 from "@angular/core";
 /**
  * Event emitted when a SVG icon is loaded through
@@ -34,6 +35,8 @@ export declare class IgxIconService {
     private _sanitizer;
     private _httpClient;
     private _platformUtil;
+    private _themeToken;
+    private _destroyRef;
     protected document: Document;
     /**
      * Observable that emits when an icon is successfully loaded
@@ -51,8 +54,7 @@ export declare class IgxIconService {
     private _cachedIcons;
     private _iconLoaded;
     private _domParser;
-    private theme;
-    constructor(_sanitizer: DomSanitizer, _httpClient: HttpClient, _platformUtil: PlatformUtil, document: Document);
+    constructor(_sanitizer: DomSanitizer, _httpClient: HttpClient, _platformUtil: PlatformUtil, _themeToken: ThemeToken, _destroyRef: DestroyRef, document: Document);
     /**
      *  Returns the default font-family.
      * ```typescript
@@ -102,6 +104,7 @@ export declare class IgxIconService {
      * ```
      */
     addIconRef(name: string, family: string, icon: IconMeta): void;
+    private _setIconRef;
     /**
      *  Similar to addIconRef, but always sets the icon reference meta for an icon in a meta family.
      * ```typescript
@@ -154,6 +157,6 @@ export declare class IgxIconService {
      * @hidden
      */
     private cacheSvgIcon;
-    static ɵfac: i0.ɵɵFactoryDeclaration<IgxIconService, [{ optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }]>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<IgxIconService, [{ optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }]>;
     static ɵprov: i0.ɵɵInjectableDeclaration<IgxIconService>;
 }

package/lib/icon/types.d.ts

@@ -1,4 +1,4 @@
-import { IgxTheme } from "../services/theme/theme.service";
+import { IgxTheme } from "../services/theme/theme.token";
 export type IconThemeKey = IgxTheme | 'default';
 export type IconReferencePair = {
     alias: IconMeta;
@@ -15,6 +15,8 @@ export interface IconMeta {
     name: string;
     family: string;
     type?: IconType;
+    /** @hidden @internal */
+    external?: boolean;
 }
 export interface FamilyMeta {
     className: string;

package/lib/input-group/input-group.component.d.ts

@@ -1,4 +1,4 @@
-import { AfterViewChecked, ChangeDetectorRef, ElementRef, OnDestroy, QueryList } from '@angular/core';
+import { AfterViewInit, ChangeDetectorRef, ElementRef, QueryList } from '@angular/core';
 import { IInputResourceStrings } from '../core/i18n/input-resources';
 import { PlatformUtil } from '../core/utils';
 import { IgxHintDirective } from '../directives/hint/hint.directive';
@@ -7,15 +7,15 @@ import { IgxPrefixDirective } from '../directives/prefix/prefix.directive';
 import { IgxSuffixDirective } from '../directives/suffix/suffix.directive';
 import { IgxInputGroupBase } from './input-group.common';
 import { IgxInputGroupType } from './inputGroupType';
-import { IgxTheme, ThemeService } from '../services/theme/theme.service';
+import { IgxTheme, ThemeToken } from '../services/theme/theme.token';
 import * as i0 from "@angular/core";
-export declare class IgxInputGroupComponent implements IgxInputGroupBase, AfterViewChecked, OnDestroy {
+export declare class IgxInputGroupComponent implements IgxInputGroupBase, AfterViewInit {
     element: ElementRef<HTMLElement>;
     private _inputGroupType;
     private document;
     private platform;
     private cdr;
-    private themeService;
+    private themeToken;
     /**
      * Sets the resource strings.
      * By default it uses EN resources.
@@ -71,11 +71,10 @@ export declare class IgxInputGroupComponent implements IgxInputGroupBase, AfterV
     protected _suffixes: QueryList<IgxSuffixDirective>;
     /** @hidden */
     protected input: IgxInputDirective;
+    private _destroyRef;
     private _type;
     private _filled;
     private _theme;
-    private _theme$;
-    private _subscription;
     private _resourceStrings;
     /** @hidden */
     get validClass(): boolean;
@@ -127,7 +126,7 @@ export declare class IgxInputGroupComponent implements IgxInputGroupBase, AfterV
      * }
      */
     get theme(): IgxTheme;
-    constructor(element: ElementRef<HTMLElement>, _inputGroupType: IgxInputGroupType, document: any, platform: PlatformUtil, cdr: ChangeDetectorRef, themeService: ThemeService);
+    constructor(element: ElementRef<HTMLElement>, _inputGroupType: IgxInputGroupType, document: any, platform: PlatformUtil, cdr: ChangeDetectorRef, themeToken: ThemeToken);
     /** @hidden */
     onClick(event: MouseEvent): void;
     /** @hidden */
@@ -253,10 +252,9 @@ export declare class IgxInputGroupComponent implements IgxInputGroupBase, AfterV
     get filled(): boolean;
     /** @hidden */
     set filled(val: boolean);
+    private setComponentTheme;
     /** @hidden @internal */
-    ngAfterViewChecked(): void;
-    /** @hidden @internal */
-    ngOnDestroy(): void;
+    ngAfterViewInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<IgxInputGroupComponent, [null, { optional: true; }, null, null, null, null]>;
     static ɵcmp: i0.ɵɵComponentDeclaration<IgxInputGroupComponent, "igx-input-group", never, { "resourceStrings": { "alias": "resourceStrings"; "required": false; }; "suppressInputAutofocus": { "alias": "suppressInputAutofocus"; "required": false; }; "type": { "alias": "type"; "required": false; }; "theme": { "alias": "theme"; "required": false; }; }, {}, ["input", "hints", "_prefixes", "_suffixes"], ["igx-hint, [igxHint]", "[igxLabel]", "[igxInput]", "igx-prefix, [igxPrefix]", "igx-suffix, [igxSuffix]"], true, never>;
     static ngAcceptInputType_suppressInputAutofocus: unknown;

package/lib/services/public_api.d.ts

@@ -15,3 +15,4 @@ export * from './transaction/igx-hierarchical-transaction';
 export * from './transaction/igx-transaction';
 export * from './transaction/transaction';
 export * from './transaction/transaction-factory.service';
+export * from './theme/theme.token';

package/lib/services/theme/theme.token.d.ts

@@ -0,0 +1,24 @@
+import { InjectionToken } from "@angular/core";
+import { BehaviorSubject } from "rxjs";
+export declare class ThemeToken {
+    private t?;
+    private document;
+    subject: BehaviorSubject<IgxTheme>;
+    constructor(t?: IgxTheme);
+    onChange(callback: (theme: IgxTheme) => void): import("rxjs").Subscription;
+    set(theme: IgxTheme): void;
+    get theme(): IgxTheme;
+    get preferToken(): boolean;
+}
+export declare const THEME_TOKEN: InjectionToken<ThemeToken>;
+declare const Theme: {
+    Material: "material";
+    Fluent: "fluent";
+    Bootstrap: "bootstrap";
+    IndigoDesign: "indigo";
+};
+/**
+ * Determines the component theme.
+ */
+export type IgxTheme = (typeof Theme)[keyof typeof Theme];
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "igniteui-angular",
-  "version": "19.0.1",
+  "version": "19.0.3",
   "description": "Ignite UI for Angular is a dependency-free Angular toolkit for building modern web apps",
   "author": "Infragistics",
   "license": "SEE LICENSE IN LICENSE",