igniteui-angular 18.1.11 → 18.1.13

package/lib/core/styles/components/badge/_badge-theme.scss

@@ -98,7 +98,7 @@
         --size: #{rem(22px)};
         --_badge-size: var(--size);
 
-        display: flex;
+        display: inline-flex;
         justify-content: center;
         align-items: center;
         min-width: var(--_badge-size);
@@ -138,7 +138,7 @@
 
     %igx-badge-value {
         white-space: nowrap;
-        padding: $badge-value-padding;
+        padding-inline: $badge-value-padding;
     }
 
     %igx-badge--success {

package/lib/core/styles/components/banner/_banner-theme.scss

@@ -146,6 +146,11 @@
         flex-wrap: wrap;
         align-self: flex-end;
         gap: rem(8px);
+
+        > a {
+            display: inline-flex;
+            align-items: center;
+        }
     }
 }
 

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

@@ -158,6 +158,8 @@
         }
 
         @include mx(textarea-group, placeholder) {
+            @extend %form-group-placeholder !optional;
+
             @include e(notch) {
                 @extend %textarea-group-notch--focused !optional;
             }
@@ -178,6 +180,8 @@
         }
 
         @include mx(textarea-group, placeholder, border) {
+            @extend %form-group-placeholder !optional;
+
             @include e(notch) {
                 @extend %textarea-group-notch--focused !optional;
             }
@@ -212,6 +216,8 @@
         }
 
         @include m(placeholder) {
+            @extend %form-group-placeholder !optional;
+
             @include e(label) {
                 @extend %form-group-label--float !optional;
                 @extend %form-group-label--fixed !optional;
@@ -381,6 +387,8 @@
         }
 
         @include mx(box, textarea-group, placeholder) {
+            @extend %form-group-placeholder !optional;
+
             @include e(notch) {
                 @extend %form-group-notch--box-textarea !optional;
             }
@@ -460,6 +468,7 @@
 
         @include mx(border, placeholder) {
             @extend %form-group-label--placeholder-border !optional;
+            @extend %form-group-placeholder !optional;
 
             @include e(label) {
                 @extend %form-group-label--float-border !optional;
@@ -580,6 +589,8 @@
         }
 
         @include mx(fluent, placeholder) {
+            @extend %form-group-placeholder !optional;
+
             @include e(label) {
                 @extend %fluent-placeholder-label !optional;
             }

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

@@ -462,6 +462,18 @@
         }
     }
 
+    %form-group-placeholder {
+        %form-group-label {
+            transition: none !important;
+        }
+    }
+
+    %form-group-display:not(%form-group-display--filled) {
+        %form-group-label {
+            transition: all $transition-timing;
+        }
+    }
+
     %form-group-display--no-margin {
         margin-block-start: 0;
     }
@@ -883,7 +895,6 @@
         backface-visibility: hidden;
         will-change: transform;
         transform-origin: top left;
-        transition: all $transition-timing;
         margin-inline-start: pad-inline(0, rem(-2px), rem(-4px));
     }
 

package/lib/core/styles/components/navdrawer/_navdrawer-theme.scss

@@ -202,7 +202,7 @@
     }
 
     %navdrawer-display-mini-pinned {
-        flex-basis: var(--igx-mini-nav-drawer-size, #{$item-mini-size});
+        flex-basis: calc(var(--igx-mini-nav-drawer-size, #{$item-mini-size}) + rem(1px));
     }
 
     %aside {
@@ -217,7 +217,7 @@
         inset-inline-start: 0;
         z-index: 999;
         transition: width, padding, transform;
-        transition-timing-function: $in-out-quad, $in-out-quad;
+        transition-timing-function: $in-out-quad;
         box-shadow: var-get($theme, 'shadow');
         padding: $aside-padding;
 
@@ -279,16 +279,23 @@
     }
 
     %aside--mini {
-        transition-duration: .2s, .2s;
+        transition-duration: .3s;
         width: var(--igx-nav-drawer-size--mini);
+        min-width: fit-content;
 
         %item {
             justify-content: center;
+            min-width: fit-content;
+
+            @if $variant == 'bootstrap' {
+                width: rem(56px);
+            }
 
             @if $variant == 'indigo' {
-                //max-width: rem(32px);
+                width: rem(32px);
+
                 // important is needed to override the typography margins
-                margin: rem(14px) auto !important;
+                margin: rem(4px) auto !important;
             }
 
             igx-icon {
@@ -298,7 +305,7 @@
     }
 
     %aside--normal {
-        transition-duration: .3s, .3s;
+        transition-duration: .3s;
         width: var(--igx-nav-drawer-size);
     }
 
@@ -306,7 +313,7 @@
         opacity: 1;
         background: color(null, 'gray', 500, .54);
         transition: opacity, visibility;
-        transition-duration: .25s, .25s;
+        transition-duration: .3s, .3s;
         transition-timing-function: ease-in, step-start;
         transition-delay: 0s, 0s;
         position: absolute;

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

@@ -350,7 +350,7 @@
         }
 
         @if $bootstrap-theme {
-            border: rem(1px) solid transparent;
+            padding-block: rem(12px);
             border-start-start-radius: var-get($theme, 'border-radius');
             border-start-end-radius: var-get($theme, 'border-radius');
         }

package/lib/grids/filtering/excel-style/excel-style-filtering.component.d.ts

@@ -113,6 +113,16 @@ export declare class IgxGridExcelStyleFilteringComponent extends BaseFilteringCo
     private _minHeight;
     /**
      * Gets the minimum height.
+     *
+     * Setting value in template:
+     * ```ts
+     * [minHeight]="'<number><unit (px|rem|etc..)>'"
+     * ```
+     *
+     * Example for setting a value:
+     * ```ts
+     * [minHeight]="'700px'"
+     * ```
      */
     get minHeight(): string;
     /**
@@ -129,6 +139,16 @@ export declare class IgxGridExcelStyleFilteringComponent extends BaseFilteringCo
     private _originalDisplay;
     /**
      * Gets the maximum height.
+     *
+     * Setting value in template:
+     * ```ts
+     * [maxHeight]="'<number><unit (px|rem|etc..)>'"
+     * ```
+     *
+     * Example for setting a value:
+     * ```ts
+     * [maxHeight]="'700px'"
+     * ```
      */
     get maxHeight(): string;
     /**

package/migrations/common/ServerHost.d.ts

@@ -10,6 +10,8 @@ export declare class ServerHost implements ts.server.ServerHost {
     readonly args: string[];
     readonly newLine: string;
     readonly useCaseSensitiveFileNames: boolean;
+    /** Cached because Angular schematics encapsulation's customRequire doesn't provide `resolve` */
+    private nativeRequire;
     constructor(host: Tree);
     /**
      * Read a file's content from the Virtual Tree

package/migrations/common/ServerHost.js

@@ -4,6 +4,7 @@ exports.ServerHost = void 0;
 const pathFs = require("path");
 const ts = require("typescript/lib/tsserverlibrary");
 const tsUtils_1 = require("./tsUtils");
+const module_1 = require("module");
 /**
  * Language server host is responsible for **most** of the FS operations / checks
  * Angular's Ivy LS sometimes bypasses these, calling path methods instead of tsLsHost operations
@@ -11,6 +12,8 @@ const tsUtils_1 = require("./tsUtils");
 class ServerHost {
     constructor(host) {
         this.host = host;
+        /** Cached because Angular schematics encapsulation's customRequire doesn't provide `resolve` */
+        this.nativeRequire = (0, module_1.createRequire)(__filename);
         this.args = ts.sys.args;
         this.newLine = ts.sys.newLine;
         this.useCaseSensitiveFileNames = ts.sys.useCaseSensitiveFileNames;
@@ -112,7 +115,7 @@ class ServerHost {
                 moduleName = tsUtils_1.CUSTOM_TS_PLUGIN_PATH;
                 paths.push(__dirname);
             }
-            const modulePath = require.resolve(moduleName, { paths });
+            const modulePath = this.nativeRequire.resolve(moduleName, { paths });
             return {
                 module: require(modulePath),
                 error: undefined,

package/migrations/common/UpdateChanges.js

@@ -588,7 +588,7 @@ class UpdateChanges {
             return;
         }
         // attempt to find a main tsconfig from workspace:
-        const wsProject = this.workspace.projects[0];
+        const wsProject = Object.values(this.workspace.projects)[0];
         // technically could be per-project, but assuming there's at least one main tsconfig for IDE support
         const projectConfig = (_b = (_a = wsProject.architect) === null || _a === void 0 ? void 0 : _a.build) === null || _b === void 0 ? void 0 : _b.options['tsConfig'];
         if (!projectConfig || !this.host.exists(projectConfig)) {
@@ -742,8 +742,8 @@ class UpdateChanges {
         for (const key of projectKeys) {
             const wsProject = this.workspace.projects[key];
             // intentionally compare against string values of the enum to avoid hard import
-            if (wsProject.projectType == "application" && ((_b = (_a = wsProject.architect) === null || _a === void 0 ? void 0 : _a.build) === null || _b === void 0 ? void 0 : _b.options['main'])) {
-                return wsProject.architect.build.options['main'];
+            if (wsProject.projectType == "application" && ((_b = (_a = wsProject.architect) === null || _a === void 0 ? void 0 : _a.build) === null || _b === void 0 ? void 0 : _b.options)) {
+                return wsProject.architect.build.options['browser'] || wsProject.architect.build.options['main'];
             }
             else if (wsProject.projectType == "library") {
                 // TODO: attempt to resolve from project ng-package.json or tsConfig

package/package.json

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