igniteui-angular 19.0.0-beta.0 → 19.0.0-rc.1

package/lib/core/styles/components/query-builder/_query-builder-component.scss

@@ -13,7 +13,15 @@
         $this: bem--selector-to-string(&);
         @include register-component(
             $name: string.slice($this, 2, -1),
-            $deps: ()
+            $deps: (
+                igx-icon,
+                igx-button,
+                igx-chip,
+                igx-select,
+                igx-input-button,
+                igx-icon-button,
+                igx-overlay,
+            )
         );
 
         @extend %advanced-filter !optional;

package/lib/core/styles/components/rating/_rating-theme.scss

@@ -1,4 +1,5 @@
 @use 'sass:map';
+@use 'sass:meta';
 @use '../../base' as *;
 @use '../../themes/schemas' as *;
 
@@ -40,7 +41,7 @@
 
     $theme: digest-schema($rating-schema);
 
-    @return extend($theme, (name: $name), keywords($rest));
+    @return extend($theme, (name: $name), meta.keywords($rest));
 }
 
 /// @deprecated Use the `css-vars` mixin instead.

package/lib/core/styles/components/scrollbar/scrollbar-theme.scss

@@ -1,4 +1,5 @@
 @use 'sass:map';
+@use 'sass:meta';
 @use '../../base' as *;
 @use '../../themes/schemas' as *;
 
@@ -99,7 +100,7 @@
         }
 
         ::-webkit-scrollbar {
-            @if type-of(map.get($theme, 'sb-size') == 'string') {
+            @if meta.type-of(map.get($theme, 'sb-size') == 'string') {
                 width: var-get($theme, 'sb-size');
                 height: var-get($theme, 'sb-size');
             }

package/lib/core/styles/components/tabs/_tabs-theme.scss

@@ -360,13 +360,6 @@
     }
 
     %tabs-header-item {
-        > * {
-            margin-inline-start: rem(if($variant != 'indigo', 12px, 8px));
-
-            &:first-child {
-                margin-inline-start: 0;
-            }
-        }
         display: inline-flex;
         justify-content: center;
         align-items: center;
@@ -390,32 +383,6 @@
             color: var-get($theme, 'item-icon-color');
         }
 
-        &::-moz-focus-inner {
-            border: 0;
-        }
-
-        &:focus {
-            background: var-get($theme, 'item-active-background');
-            color: var-get($theme, 'item-hover-color');
-            border-bottom-color: transparent;
-        }
-
-        &:hover {
-            background: var-get($theme, 'item-hover-background');
-            color: var-get($theme, 'item-hover-color');
-
-            @if $bootstrap-theme {
-                box-shadow: inset 0 0 0 rem(1px) var-get($theme, 'border-color--hover');
-            }
-        }
-
-        &:hover,
-        &:focus {
-            igx-icon {
-                color: var-get($theme, 'item-hover-icon-color');
-            }
-        }
-
         @if $bootstrap-theme {
             padding-block: rem(12px);
             border-start-start-radius: var-get($theme, 'border-radius');
@@ -448,6 +415,40 @@
             }
         }
 
+        > * {
+            margin-inline-start: rem(if($variant != 'indigo', 12px, 8px));
+
+            &:first-child {
+                margin-inline-start: 0;
+            }
+        }
+
+        &::-moz-focus-inner {
+            border: 0;
+        }
+
+        &:focus {
+            background: var-get($theme, 'item-active-background');
+            color: var-get($theme, 'item-hover-color');
+            border-bottom-color: transparent;
+        }
+
+        &:hover {
+            background: var-get($theme, 'item-hover-background');
+            color: var-get($theme, 'item-hover-color');
+
+            @if $bootstrap-theme {
+                box-shadow: inset 0 0 0 rem(1px) var-get($theme, 'border-color--hover');
+            }
+        }
+
+        &:hover,
+        &:focus {
+            igx-icon {
+                color: var-get($theme, 'item-hover-icon-color');
+            }
+        }
+
         @include ripple($tabs-ripple-theme);
         @include css-vars($tabs-ripple-theme);
     }

package/lib/core/styles/themes/generators/_base.scss

@@ -6,6 +6,7 @@
 @use '../../base' as *;
 @use '../../components' as *;
 @use 'igniteui-theming/sass/color' as *;
+@use 'igniteui-theming/sass/color/presets' as *;
 @use 'igniteui-theming/sass/elevations' as *;
 @use 'igniteui-theming/sass/elevations/presets' as elevations;
 @use 'igniteui-theming/sass/utils' as *;
@@ -683,7 +684,7 @@
     );
 
     @include theme(
-        $palette: $light-palette,
+        $palette: $light-material-palette,
         $schema: $light-material-schema,
         $exclude: $exclude,
         $roundness: $roundness,
@@ -716,7 +717,7 @@
     );
 
     @include theme(
-        $palette: $dark-palette,
+        $palette: $dark-material-palette,
         $schema: $dark-material-schema,
         $exclude: $exclude,
         $roundness: $roundness,

package/lib/core/styles/themes/generators/_bootstrap.scss

@@ -1,6 +1,7 @@
 @use 'base' as *;
 @use '../schemas' as *;
 @use 'igniteui-theming/sass/color' as *;
+@use 'igniteui-theming/sass/color/presets' as *;
 
 ////
 /// @group themes
@@ -20,7 +21,8 @@
 ) {
     $primary: color($palette, 'primary');
     $secondary: color($palette, 'secondary');
-    $surface: color($palette, 'surface');
+    $gray: color($light-bootstrap-palette, 'gray');
+    $surface: color($light-bootstrap-palette, 'surface');
     $info: color($palette, 'info');
     $success: color($palette, 'success');
     $warn: color($palette, 'warn');
@@ -30,8 +32,8 @@
         $palette: palette(
             $primary,
             $secondary,
-            $surface: if($surface != #f8f9fa, $surface, #f8f9fa),
-            $gray: #212529,
+            $surface: $surface,
+            $gray: $gray,
             $info: $info,
             $success: $success,
             $warn: $warn,
@@ -56,7 +58,8 @@
 ) {
     $primary: color($palette, 'primary');
     $secondary: color($palette, 'secondary');
-    $surface: color($palette, 'surface');
+    $gray: color($dark-bootstrap-palette, 'gray');
+    $surface: color($dark-bootstrap-palette, 'surface');
     $info: color($palette, 'info');
     $success: color($palette, 'success');
     $warn: color($palette, 'warn');
@@ -66,8 +69,8 @@
         $palette: palette(
             $primary,
             $secondary,
-            $surface: if($surface != white, $surface, #222),
-            $gray: #fff,
+            $surface: $surface,
+            $gray: $gray,
             $info: $info,
             $success: $success,
             $warn: $warn,

package/lib/core/styles/themes/generators/_fluent.scss

@@ -1,6 +1,7 @@
 @use 'base' as *;
 @use '../schemas' as *;
 @use 'igniteui-theming/sass/color' as *;
+@use 'igniteui-theming/sass/color/presets' as *;
 
 ////
 /// @group themes
@@ -20,7 +21,8 @@
 ) {
     $primary: color($palette, 'primary');
     $secondary: color($palette, 'secondary');
-    $surface: color($palette, 'surface');
+    $gray: color($light-fluent-palette, 'gray');
+    $surface: color($light-fluent-palette, 'surface');
     $info: color($palette, 'info');
     $success: color($palette, 'success');
     $warn: color($palette, 'warn');
@@ -30,8 +32,8 @@
         $palette: palette(
             $primary,
             $secondary,
-            $surface: if($surface != #fff, $surface, #fff),
-            $gray: #000,
+            $surface: $surface,
+            $gray: $gray,
             $info: $info,
             $success: $success,
             $warn: $warn,
@@ -56,7 +58,8 @@
 ) {
     $primary: color($palette, 'primary');
     $secondary: color($palette, 'secondary');
-    $surface: color($palette, 'surface');
+    $gray: color($dark-fluent-palette, 'gray');
+    $surface: color($dark-fluent-palette, 'surface');
     $info: color($palette, 'info');
     $success: color($palette, 'success');
     $warn: color($palette, 'warn');
@@ -66,8 +69,8 @@
         $palette: palette(
             $primary,
             $secondary,
-            $surface: if($surface != #fff, $surface, #222),
-            $gray: #fff,
+            $surface: $surface,
+            $gray: $gray,
             $info: $info,
             $success: $success,
             $warn: $warn,

package/lib/core/styles/themes/generators/_indigo.scss

@@ -1,6 +1,7 @@
 @use 'base' as *;
 @use '../schemas' as *;
 @use 'igniteui-theming/sass/color' as *;
+@use 'igniteui-theming/sass/color/presets' as *;
 @use 'igniteui-theming/sass/elevations/presets' as elevations;
 
 ////
@@ -21,7 +22,8 @@
 ) {
     $primary: color($palette, 'primary');
     $secondary: color($palette, 'secondary');
-    $surface: color($palette, 'surface');
+    $gray: color($light-indigo-palette, 'gray');
+    $surface: color($light-indigo-palette, 'surface');
     $info: color($palette, 'info');
     $success: color($palette, 'success');
     $warn: color($palette, 'warn');
@@ -31,8 +33,8 @@
         $palette: palette(
             $primary,
             $secondary,
-            $surface: if($surface != #fff, $surface, #fff),
-            $gray: #060716,
+            $surface: $surface,
+            $gray: $gray,
             $info: $info,
             $success: $success,
             $warn: $warn,
@@ -58,7 +60,8 @@
 ) {
     $primary: color($palette, 'primary');
     $secondary: color($palette, 'secondary');
-    $surface: color($palette, 'surface');
+    $gray: color($dark-indigo-palette, 'gray');
+    $surface: color($dark-indigo-palette, 'surface');
     $info: color($palette, 'info');
     $success: color($palette, 'success');
     $warn: color($palette, 'warn');
@@ -68,8 +71,8 @@
         $palette: palette(
             $primary,
             $secondary,
-            $surface: if($surface != white, $surface, #2a2b2f),
-            $gray: #fff,
+            $surface: $surface,
+            $gray: $gray,
             $info: $info,
             $success: $success,
             $warn: $warn,

package/lib/core/styles/themes/presets/igniteui-angular-dark.scss

@@ -1,5 +1,11 @@
 @use '../../themes' as *;
 
 @include core();
-@include typography($font-family: $material-typeface, $type-scale: $material-type-scale);
-@include dark-theme($dark-material-palette);
+@include typography(
+    $font-family: $material-typeface,
+    $type-scale: $material-type-scale
+);
+@include theme(
+    $schema: $dark-material-schema,
+    $palette: $dark-material-palette,
+);

package/lib/core/styles/themes/presets/igniteui-angular.scss

@@ -1,5 +1,11 @@
 @use '../../themes' as *;
 
 @include core();
-@include typography($font-family: $material-typeface, $type-scale: $material-type-scale);
-@include theme($light-material-palette);
+@include typography(
+    $font-family: $material-typeface,
+    $type-scale: $material-type-scale
+);
+@include theme(
+    $schema: $light-material-schema,
+    $palette: $light-material-palette,
+);

package/lib/core/styles/themes/presets/igniteui-bootstrap-dark.scss

@@ -1,5 +1,11 @@
 @use '../../themes' as *;
 
 @include core();
-@include typography($font-family: $bootstrap-typeface, $type-scale: $bootstrap-type-scale);
-@include bootstrap-dark-theme($dark-bootstrap-palette);
+@include typography(
+    $font-family: $bootstrap-typeface,
+    $type-scale: $bootstrap-type-scale
+);
+@include theme(
+    $schema: $dark-bootstrap-schema,
+    $palette: $dark-bootstrap-palette,
+);

package/lib/core/styles/themes/presets/igniteui-bootstrap-light.scss

@@ -1,5 +1,11 @@
 @use '../../themes' as *;
 
 @include core();
-@include typography($font-family: $bootstrap-typeface, $type-scale: $bootstrap-type-scale);
-@include bootstrap-light-theme($light-bootstrap-palette);
+@include typography(
+    $font-family: $bootstrap-typeface,
+    $type-scale: $bootstrap-type-scale
+);
+@include theme(
+    $schema: $light-bootstrap-schema,
+    $palette: $light-bootstrap-palette,
+);

package/lib/core/styles/themes/presets/igniteui-dark-green.scss

@@ -1,5 +1,11 @@
 @use '../../themes' as *;
 
 @include core();
-@include typography($font-family: $material-typeface, $type-scale: $material-type-scale);
-@include dark-theme($dark-green-palette);
+@include typography(
+    $font-family: $material-typeface,
+    $type-scale: $material-type-scale
+);
+@include theme(
+    $schema: $dark-material-schema,
+    $palette: $dark-green-palette,
+);

package/lib/core/styles/themes/presets/igniteui-fluent-dark-excel.scss

@@ -1,5 +1,11 @@
 @use '../../themes' as *;
 
 @include core();
-@include typography($font-family: $fluent-typeface, $type-scale: $fluent-type-scale);
-@include fluent-dark-theme($dark-fluent-excel-palette);
+@include typography(
+    $font-family: $fluent-typeface,
+    $type-scale: $fluent-type-scale
+);
+@include theme(
+    $schema: $dark-fluent-schema,
+    $palette: $dark-fluent-excel-palette,
+);

package/lib/core/styles/themes/presets/igniteui-fluent-dark-word.scss

@@ -1,5 +1,11 @@
 @use '../../themes' as *;
 
 @include core();
-@include typography($font-family: $fluent-typeface, $type-scale: $fluent-type-scale);
-@include fluent-dark-theme($dark-fluent-word-palette);
+@include typography(
+    $font-family: $fluent-typeface,
+    $type-scale: $fluent-type-scale
+);
+@include theme(
+    $schema: $dark-fluent-schema,
+    $palette: $dark-fluent-word-palette,
+);

package/lib/core/styles/themes/presets/igniteui-fluent-dark.scss

@@ -1,5 +1,11 @@
 @use '../../themes' as *;
 
 @include core();
-@include typography($font-family: $fluent-typeface, $type-scale: $fluent-type-scale);
-@include fluent-dark-theme($dark-fluent-palette);
+@include typography(
+    $font-family: $fluent-typeface,
+    $type-scale: $fluent-type-scale
+);
+@include theme(
+    $schema: $dark-fluent-schema,
+    $palette: $dark-fluent-palette,
+);

package/lib/core/styles/themes/presets/igniteui-fluent-light-excel.scss

@@ -1,5 +1,11 @@
 @use '../../themes' as *;
 
 @include core();
-@include typography($font-family: $fluent-typeface, $type-scale: $fluent-type-scale);
-@include fluent-light-theme($light-fluent-excel-palette);
+@include typography(
+    $font-family: $fluent-typeface,
+    $type-scale: $fluent-type-scale
+);
+@include theme(
+    $schema: $light-fluent-schema,
+    $palette: $light-fluent-excel-palette,
+);

package/lib/core/styles/themes/presets/igniteui-fluent-light-word.scss

@@ -1,5 +1,11 @@
 @use '../../themes' as *;
 
 @include core();
-@include typography($font-family: $fluent-typeface, $type-scale: $fluent-type-scale);
-@include fluent-light-theme($light-fluent-word-palette);
+@include typography(
+    $font-family: $fluent-typeface,
+    $type-scale: $fluent-type-scale
+);
+@include theme(
+    $schema: $light-fluent-schema,
+    $palette: $light-fluent-word-palette,
+);

package/lib/core/styles/themes/presets/igniteui-fluent-light.scss

@@ -1,5 +1,11 @@
 @use '../../themes' as *;
 
 @include core();
-@include typography($font-family: $fluent-typeface, $type-scale: $fluent-type-scale);
-@include fluent-light-theme($light-fluent-palette);
+@include typography(
+    $font-family: $fluent-typeface,
+    $type-scale: $fluent-type-scale
+);
+@include theme(
+    $schema: $light-fluent-schema,
+    $palette: $light-fluent-palette,
+);

package/lib/core/styles/themes/presets/igniteui-indigo-dark.scss

@@ -1,5 +1,11 @@
 @use '../../themes' as *;
 
 @include core();
-@include typography($font-family: $indigo-typeface, $type-scale: $indigo-type-scale);
-@include indigo-dark-theme($dark-indigo-palette);
+@include typography(
+    $font-family: $indigo-typeface,
+    $type-scale: $indigo-type-scale
+);
+@include theme(
+    $schema: $dark-indigo-schema,
+    $palette: $dark-indigo-palette,
+);

package/lib/core/styles/themes/presets/igniteui-indigo-light.scss

@@ -1,5 +1,11 @@
 @use '../../themes' as *;
 
 @include core();
-@include typography($font-family: $indigo-typeface, $type-scale: $indigo-type-scale);
-@include indigo-light-theme($light-indigo-palette);
+@include typography(
+    $font-family: $indigo-typeface,
+    $type-scale: $indigo-type-scale
+);
+@include theme(
+    $schema: $light-indigo-schema,
+    $palette: $light-indigo-palette,
+);

package/lib/core/utils.d.ts

@@ -309,3 +309,8 @@ export declare function intoChunks<T>(arr: T[], size: number): Generator<T[], vo
  * @returns string that represents the --component-size default value
  */
 export declare function getComponentCssSizeVar(size: string): "var(--ig-size, var(--ig-size-small))" | "var(--ig-size, var(--ig-size-medium))" | "var(--ig-size, var(--ig-size-large))";
+/**
+ * @param path - The URI path to be normalized.
+ * @returns string encoded using the encodeURI function.
+ */
+export declare function normalizeURI(path: string): string;

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

@@ -563,6 +563,7 @@ export declare class IgxDragDirective implements AfterContentInit, OnDestroy {
      * @hidden
      */
     onTransitionEnd(event: any): void;
+    protected clearGhost(): void;
     /**
      * @hidden
      * Create ghost element - if a Node object is provided it creates a clone of that node,

package/lib/grids/filtering/grid-filtering.service.d.ts

@@ -56,6 +56,7 @@ export declare class IgxFilteringService implements OnDestroy {
     clear_filter(fieldName: string): void;
     /**
      * Filters all the `IgxColumnComponent` in the `IgxGridComponent` with the same condition.
+     * @deprecated in version 19.0.0.
      */
     filterGlobal(value: any, condition: any, ignoreCase?: any): void;
     /**

package/lib/grids/grid-base.directive.d.ts

@@ -1989,6 +1989,7 @@ export declare abstract class IgxGridBaseDirective implements GridType, OnInit,
     private _selectRowOnClick;
     private _columnSelectionMode;
     private lastAddedRowIndex;
+    protected isColumnWidthSum: boolean;
     private _currencyPositionLeft;
     private rowEditPositioningStrategy;
     private rowEditSettings;
@@ -2673,6 +2674,7 @@ export declare abstract class IgxGridBaseDirective implements GridType, OnInit,
      * @param value
      * @param condition
      * @param ignoreCase
+     * @deprecated in version 19.0.0.
      */
     filterGlobal(value: any, condition: any, ignoreCase?: any): void;
     /**

package/lib/grids/pivot-grid/pivot-grid.component.d.ts

@@ -615,7 +615,6 @@ export declare class IgxPivotGridComponent extends IgxGridBaseDirective implemen
     /** @hidden @internal */
     get values(): IPivotValue[];
     toggleColumn(col: IgxColumnComponent): void;
-    protected getColumnWidthSum(): number;
     /**
      * @hidden @internal
      */

package/lib/tabs/tabs/tabs.component.d.ts

@@ -1,4 +1,5 @@
 import { AfterViewInit, ChangeDetectorRef, ElementRef, NgZone, OnDestroy } from '@angular/core';
+import { PlatformUtil } from '../../core/utils';
 import { AnimationService } from '../../services/animation/animation';
 import { IgxDirectionality } from '../../services/direction/directionality';
 import { IgxTabsDirective } from '../tabs.directive';
@@ -42,6 +43,7 @@ export type IgxTabsAlignment = (typeof IgxTabsAlignment)[keyof typeof IgxTabsAli
  */
 export declare class IgxTabsComponent extends IgxTabsDirective implements AfterViewInit, OnDestroy {
     private ngZone;
+    private platform;
     /**
      * Gets/Sets the tab alignment. Defaults to `start`.
      */
@@ -76,7 +78,7 @@ export declare class IgxTabsComponent extends IgxTabsDirective implements AfterV
     protected componentName: string;
     private _tabAlignment;
     private _resizeObserver;
-    constructor(animationService: AnimationService, cdr: ChangeDetectorRef, ngZone: NgZone, dir: IgxDirectionality);
+    constructor(animationService: AnimationService, cdr: ChangeDetectorRef, ngZone: NgZone, dir: IgxDirectionality, platform: PlatformUtil);
     /** @hidden @internal */
     ngAfterViewInit(): void;
     /** @hidden @internal */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "igniteui-angular",
-  "version": "19.0.0-beta.0",
+  "version": "19.0.0-rc.1",
   "description": "Ignite UI for Angular is a dependency-free Angular toolkit for building modern web apps",
   "author": "Infragistics",
   "license": "SEE LICENSE IN LICENSE",
@@ -73,9 +73,8 @@
     "tslib": "^2.3.0",
     "igniteui-trial-watermark": "^3.0.2",
     "lodash-es": "^4.17.21",
-    "uuid": "^9.0.0",
-    "igniteui-theming": "^14.2.0",
-    "@igniteui/material-icons-extended": "^3.0.0"
+    "igniteui-theming": "^14.3.0",
+    "@igniteui/material-icons-extended": "^3.1.0"
   },
   "peerDependencies": {
     "@angular/common": "19",
@@ -94,7 +93,7 @@
     }
   },
   "igxDevDependencies": {
-    "@igniteui/angular-schematics": "~18.2.1420"
+    "@igniteui/angular-schematics": "~19.0.1430-rc.0"
   },
   "ng-update": {
     "migrations": "./migrations/migration-collection.json",