igniteui-angular 22.2.0-rc.0 → 22.2.0-rc.1

package/migrations/common/UpdateChanges.d.ts

@@ -65,6 +65,39 @@ export declare class UpdateChanges {
     protected updateClasses(entryPath: string): void;
     protected updateBindings(entryPath: string, bindChanges: BindingChanges, type?: BindingType): void;
     protected updateThemeProps(entryPath: string): void;
+    /**
+     * Returns the argument list boundaries of every top-level `owner(...)` call in the content.
+     * Strings, comments and `url()` tokens are scanned over, so an `owner(` that is only mentioned
+     * in one of those is not taken for a call, and a `@mixin` or `@function` that declares the same
+     * name is left alone. The brackets are tracked too, so a call nested in another one -
+     * `@include scrollbar(scrollbar-theme($sb-size: 6px))` - reports its own closing bracket
+     * rather than the one of the call surrounding it.
+     */
+    private findFunctionCalls;
+    /**
+     * Returns the index of the bracket closing the one `start` is inside of, or -1 when the
+     * content is unbalanced. Brackets in strings, comments and `url()` tokens are ignored.
+     */
+    private findClosingBracket;
+    /**
+     * Tells whether the name at `index` is the one a `@mixin` or a `@function` declares rather
+     * than a call to it. Rewriting a declaration would strip a parameter its body still reads.
+     */
+    private isDeclaredName;
+    /**
+     * When a string, a comment or a `url()` token starts at `index`, returns the index of its last
+     * character so that a scan can carry on past it. Returns -1 when `index` is on code.
+     */
+    private skipNonCode;
+    /**
+     * Sass parses an unquoted `url()` as a single token, so a `//` inside one is part of the
+     * address - `url(//cdn.example.com/bg.png)` - and not the start of a comment.
+     */
+    private isUrlToken;
+    /** Returns the index of the bracket closing a `url(` whose contents start at `start`. */
+    private skipUrl;
+    /** Returns the index of the quote closing the string opened at `start`. */
+    private skipString;
     protected isNamedArgument(fileContent: string, i: number, occurrences: number[], change: ThemeChange): boolean;
     protected updateSassVariables(entryPath: string): void;
     protected updateSassFunctionsAndMixins(entryPath: string): void;
@@ -94,6 +127,9 @@ export declare class UpdateChanges {
      * prop: inner-func(),
      * prop2: inner2(inner-param: 3, inner-param: inner-func(..))
      * ```
+     *
+     * Strings, comments and `url()` tokens are scanned over the same way the rest of the scanner
+     * does it, so a `','` inside one of them is not taken for an argument separator.
      */
     private splitFunctionProps;
     private updateTemplateFiles;

package/migrations/common/UpdateChanges.js

@@ -47,6 +47,7 @@ const tsUtils_1 = require("./tsUtils");
 const util_1 = require("./util");
 const project_service_container_1 = require("./project-service-container");
 const TSCONFIG_PATH = 'tsconfig.json';
+const URL_TOKEN = 'url(';
 var InputPropertyType;
 (function (InputPropertyType) {
     InputPropertyType["EVAL"] = "eval";
@@ -361,52 +362,187 @@ class UpdateChanges {
         }
     }
     updateThemeProps(entryPath) {
-        var _a;
         let fileContent = this.host.read(entryPath).toString();
         let overwrite = false;
         for (const change of this.themeChanges.changes) {
             if (change.type !== schema_1.ThemeType.Property) {
                 continue;
             }
-            if (fileContent.indexOf(change.owner) !== -1) {
-                /** owner-func:( * ); */
-                const searchPattern = String.raw `${change.owner}\([\s\S]+?\);`;
-                const matches = fileContent.match(new RegExp(searchPattern, 'g'));
-                if (!matches) {
+            if (fileContent.indexOf(change.owner) === -1) {
+                continue;
+            }
+            /** owner-func:( * ) */
+            const calls = this.findFunctionCalls(fileContent, change.owner);
+            // rewrite back to front so the collected indices stay valid
+            for (const call of calls.reverse()) {
+                const rawBody = fileContent.substring(call.bodyStart, call.bodyEnd);
+                if (rawBody.indexOf(change.name) === -1) {
                     continue;
                 }
-                for (const match of matches) {
-                    if (match.indexOf(change.name) !== -1) {
-                        const name = change.name.replace('$', '\\$');
-                        const replaceWith = (_a = change.replaceWith) === null || _a === void 0 ? void 0 : _a.replace('$', '\\$');
-                        const reg = new RegExp(String.raw `^\s*${name}:`);
-                        const existing = new RegExp(String.raw `${replaceWith}:`);
-                        const opening = `${change.owner}(`;
-                        const closing = /\s*\);$/.exec(match).pop();
-                        const body = match.substr(opening.length, match.length - opening.length - closing.length);
-                        let params = this.splitFunctionProps(body);
-                        params = params.reduce((arr, param) => {
-                            if (reg.test(param)) {
-                                const duplicate = !!replaceWith && arr.some(p => existing.test(p));
-                                if (!change.remove && !duplicate) {
-                                    arr.push(param.replace(change.name, change.replaceWith));
-                                }
-                            }
-                            else {
-                                arr.push(param);
-                            }
-                            return arr;
-                        }, []);
-                        fileContent = fileContent.replace(match, opening + params.join(',') + closing);
-                        overwrite = true;
+                const name = (0, util_1.escapeRegExp)(change.name);
+                const replaceWith = change.replaceWith ? (0, util_1.escapeRegExp)(change.replaceWith) : undefined;
+                const reg = new RegExp(String.raw `^\s*${name}:`);
+                const existing = new RegExp(String.raw `${replaceWith}:`);
+                // keep whatever sits in front of the closing bracket so the formatting is preserved
+                const trailing = /\s*$/.exec(rawBody).pop();
+                const body = rawBody.substring(0, rawBody.length - trailing.length);
+                let params = this.splitFunctionProps(body);
+                params = params.reduce((arr, param) => {
+                    if (reg.test(param)) {
+                        const duplicate = !!replaceWith && arr.some(p => existing.test(p));
+                        if (!change.remove && !duplicate) {
+                            arr.push(param.replace(change.name, change.replaceWith));
+                        }
                     }
-                }
+                    else {
+                        arr.push(param);
+                    }
+                    return arr;
+                }, []);
+                fileContent = fileContent.substring(0, call.bodyStart)
+                    + params.join(',')
+                    + trailing
+                    + fileContent.substring(call.bodyEnd);
+                overwrite = true;
             }
         }
         if (overwrite) {
             this.host.overwrite(entryPath, fileContent);
         }
     }
+    /**
+     * Returns the argument list boundaries of every top-level `owner(...)` call in the content.
+     * Strings, comments and `url()` tokens are scanned over, so an `owner(` that is only mentioned
+     * in one of those is not taken for a call, and a `@mixin` or `@function` that declares the same
+     * name is left alone. The brackets are tracked too, so a call nested in another one -
+     * `@include scrollbar(scrollbar-theme($sb-size: 6px))` - reports its own closing bracket
+     * rather than the one of the call surrounding it.
+     */
+    findFunctionCalls(content, owner) {
+        const calls = [];
+        const opening = `${owner}(`;
+        for (let i = 0; i < content.length; i++) {
+            const nonCodeEnd = this.skipNonCode(content, i);
+            if (nonCodeEnd !== -1) {
+                i = nonCodeEnd;
+                continue;
+            }
+            if (!content.startsWith(opening, i) || this.isDeclaredName(content, i)) {
+                continue;
+            }
+            const bodyStart = i + opening.length;
+            const bodyEnd = this.findClosingBracket(content, bodyStart);
+            if (bodyEnd === -1) {
+                // unbalanced from here on, leave this call rather than the rest of the file
+                continue;
+            }
+            calls.push({ bodyStart, bodyEnd });
+            // a same-owner call nested in this one is already covered by it
+            i = bodyEnd;
+        }
+        return calls;
+    }
+    /**
+     * Returns the index of the bracket closing the one `start` is inside of, or -1 when the
+     * content is unbalanced. Brackets in strings, comments and `url()` tokens are ignored.
+     */
+    findClosingBracket(content, start) {
+        let level = 0;
+        for (let i = start; i < content.length; i++) {
+            const nonCodeEnd = this.skipNonCode(content, i);
+            if (nonCodeEnd !== -1) {
+                i = nonCodeEnd;
+                continue;
+            }
+            const char = content[i];
+            if (char === '(') {
+                level++;
+            }
+            else if (char === ')') {
+                if (!level) {
+                    return i;
+                }
+                level--;
+            }
+        }
+        return -1;
+    }
+    /**
+     * Tells whether the name at `index` is the one a `@mixin` or a `@function` declares rather
+     * than a call to it. Rewriting a declaration would strip a parameter its body still reads.
+     */
+    isDeclaredName(content, index) {
+        let end = index;
+        while (end > 0 && /\s/.test(content[end - 1])) {
+            end--;
+        }
+        let start = end;
+        while (start > 0 && /[\w@-]/.test(content[start - 1])) {
+            start--;
+        }
+        const keyword = content.substring(start, end);
+        return keyword === '@mixin' || keyword === '@function';
+    }
+    /**
+     * When a string, a comment or a `url()` token starts at `index`, returns the index of its last
+     * character so that a scan can carry on past it. Returns -1 when `index` is on code.
+     */
+    skipNonCode(content, index) {
+        const char = content[index];
+        const next = content[index + 1];
+        if (char === '\'' || char === '"') {
+            return this.skipString(content, index);
+        }
+        if (char === '/' && next === '*') {
+            const end = content.indexOf('*/', index + 2);
+            return end === -1 ? content.length : end + 1;
+        }
+        if (char === '/' && next === '/') {
+            const end = content.indexOf('\n', index + 2);
+            return end === -1 ? content.length : end;
+        }
+        if (this.isUrlToken(content, index)) {
+            return this.skipUrl(content, index + URL_TOKEN.length);
+        }
+        return -1;
+    }
+    /**
+     * Sass parses an unquoted `url()` as a single token, so a `//` inside one is part of the
+     * address - `url(//cdn.example.com/bg.png)` - and not the start of a comment.
+     */
+    isUrlToken(content, index) {
+        if (content.substr(index, URL_TOKEN.length).toLowerCase() !== URL_TOKEN) {
+            return false;
+        }
+        const previous = content[index - 1];
+        return previous === undefined || !/[\w-]/.test(previous);
+    }
+    /** Returns the index of the bracket closing a `url(` whose contents start at `start`. */
+    skipUrl(content, start) {
+        for (let i = start; i < content.length; i++) {
+            const char = content[i];
+            if (char === '\'' || char === '"') {
+                i = this.skipString(content, i);
+            }
+            else if (char === ')') {
+                return i;
+            }
+        }
+        return content.length;
+    }
+    /** Returns the index of the quote closing the string opened at `start`. */
+    skipString(content, start) {
+        const quote = content[start];
+        for (let i = start + 1; i < content.length; i++) {
+            if (content[i] === '\\') {
+                i++;
+            }
+            else if (content[i] === quote) {
+                return i;
+            }
+        }
+        return content.length;
+    }
     isNamedArgument(fileContent, i, occurrences, change) {
         const openingBrackets = [];
         const closingBrackets = [];
@@ -777,12 +913,20 @@ class UpdateChanges {
      * prop: inner-func(),
      * prop2: inner2(inner-param: 3, inner-param: inner-func(..))
      * ```
+     *
+     * Strings, comments and `url()` tokens are scanned over the same way the rest of the scanner
+     * does it, so a `','` inside one of them is not taken for an argument separator.
      */
     splitFunctionProps(body) {
         const parts = [];
         let lastIndex = 0;
         let level = 0;
         for (let i = 0; i < body.length; i++) {
+            const nonCodeEnd = this.skipNonCode(body, i);
+            if (nonCodeEnd !== -1) {
+                i = nonCodeEnd;
+                continue;
+            }
             const char = body[i];
             switch (char) {
                 case '(':

package/migrations/common/UpdateChanges.spec.js

@@ -567,6 +567,72 @@ $var3: igx-comp-theme(
         expect(appTree.readContent('test.component.scss')).toEqual(`igx-theme-func($replaced: 10px, $old-prop: 3, $prop3: 2);`);
         done();
     });
+    it('should keep the brackets balanced for nested theme functions', done => {
+        const themeChangesJson = {
+            changes: [
+                {
+                    name: '$remove-me', remove: true,
+                    owner: 'igx-theme-func',
+                    type: schema_1.ThemeType.Property
+                },
+                {
+                    name: '$replace-me', replaceWith: '$replaced',
+                    owner: 'igx-theme-func',
+                    type: schema_1.ThemeType.Property
+                }
+            ]
+        };
+        const jsonPath = path.join(__dirname, 'changes', 'theme-changes.json');
+        spyOn(fs, 'existsSync').and.callFake((filePath) => filePath === jsonPath);
+        spyOn(fs, 'readFileSync').and.callFake(() => JSON.stringify(themeChangesJson));
+        appTree.create('styles.scss', `@include igx-mixin(igx-theme-func($remove-me: 6px));
+@include igx-mixin(igx-theme-func($prop1: red, $remove-me: 6px));
+@include igx-mixin(igx-theme-func($remove-me: 6px, $prop1: red));
+@include igx-mixin(igx-theme-func($replace-me: 6px));
+$var: igx-theme-func($content: "not a ( bracket", $remove-me: 6px);
+$var2: igx-theme-func($image: url(https://example.com/a.png), $remove-me: 6px);
+$var3: igx-theme-func(
+    $remove-me: 6px, // not a ) bracket
+    $prop1: red
+);`);
+        const update = new UnitUpdateChanges(__dirname, appTree);
+        update.applyChanges();
+        expect(appTree.readContent('styles.scss')).toEqual(`@include igx-mixin(igx-theme-func());
+@include igx-mixin(igx-theme-func($prop1: red));
+@include igx-mixin(igx-theme-func( $prop1: red));
+@include igx-mixin(igx-theme-func($replaced: 6px));
+$var: igx-theme-func($content: "not a ( bracket");
+$var2: igx-theme-func($image: url(https://example.com/a.png));
+$var3: igx-theme-func( // not a ) bracket
+    $prop1: red
+);`);
+        done();
+    });
+    it('should not treat a theme function mentioned in a comment or a string as a call', done => {
+        const themeChangesJson = {
+            changes: [
+                {
+                    name: '$remove-me', remove: true,
+                    owner: 'igx-theme-func',
+                    type: schema_1.ThemeType.Property
+                }
+            ]
+        };
+        const jsonPath = path.join(__dirname, 'changes', 'theme-changes.json');
+        spyOn(fs, 'existsSync').and.callFake((filePath) => filePath === jsonPath);
+        spyOn(fs, 'readFileSync').and.callFake(() => JSON.stringify(themeChangesJson));
+        appTree.create('styles.scss', `// igx-theme-func($remove-me: 1px) is gone, use the grid's own borders
+/* igx-theme-func($remove-me: 2px */
+$doc: "igx-theme-func($remove-me: 3px";
+$var: igx-theme-func($remove-me: 4px, $prop1: red);`);
+        const update = new UnitUpdateChanges(__dirname, appTree);
+        update.applyChanges();
+        expect(appTree.readContent('styles.scss')).toEqual(`// igx-theme-func($remove-me: 1px) is gone, use the grid's own borders
+/* igx-theme-func($remove-me: 2px */
+$doc: "igx-theme-func($remove-me: 3px";
+$var: igx-theme-func( $prop1: red);`);
+        done();
+    });
     it('should replace imports', done => {
         const importsJson = {
             changes: [

package/migrations/update-22_2_0/index.spec.js

@@ -77,6 +77,79 @@ describe(`Update to ${version}`, () => {
         const tree = yield schematicRunner.runSchematic(migrationName, { shouldInvokeLS: false }, appTree);
         expect(tree.readContent('/testSrc/appPrefix/component/test.component.scss')).toEqual(content);
     }));
+    it('should keep the brackets balanced when the theme is nested in another call', () => __awaiter(void 0, void 0, void 0, function* () {
+        appTree.create(`/testSrc/appPrefix/component/test.component.scss`, `.selection-area {
+    @include scrollbar(scrollbar-theme($sb-size: 6px));
+}
+
+igx-grid {
+    @include scrollbar(scrollbar-theme($sb-thumb-bg-color: blue, $sb-size: 16px));
+}`);
+        const tree = yield schematicRunner.runSchematic(migrationName, { shouldInvokeLS: false }, appTree);
+        expect(tree.readContent('/testSrc/appPrefix/component/test.component.scss')).toEqual(`.selection-area {
+    @include scrollbar(scrollbar-theme());
+}
+
+igx-grid {
+    @include scrollbar(scrollbar-theme($sb-thumb-bg-color: blue));
+}`);
+    }));
+    it('should migrate a theme call that is not terminated by a semicolon', () => __awaiter(void 0, void 0, void 0, function* () {
+        appTree.create(`/testSrc/appPrefix/component/test.component.scss`, `$my-scrollbar: scrollbar-theme(
+    $sb-size: 16px,
+    $sb-thumb-bg-color: blue
+)`);
+        const tree = yield schematicRunner.runSchematic(migrationName, { shouldInvokeLS: false }, appTree);
+        expect(tree.readContent('/testSrc/appPrefix/component/test.component.scss')).toEqual(`$my-scrollbar: scrollbar-theme(
+    $sb-thumb-bg-color: blue
+)`);
+    }));
+    it('should keep a retained property when a comment in the argument list holds an apostrophe', () => __awaiter(void 0, void 0, void 0, function* () {
+        appTree.create(`/testSrc/appPrefix/component/test.component.scss`, `$my-scrollbar: scrollbar-theme($sb-size: 6px /* user's size */, $sb-thumb-bg-color: red);`);
+        const tree = yield schematicRunner.runSchematic(migrationName, { shouldInvokeLS: false }, appTree);
+        expect(tree.readContent('/testSrc/appPrefix/component/test.component.scss')).toEqual(`$my-scrollbar: scrollbar-theme( $sb-thumb-bg-color: red);`);
+    }));
+    it('should remove the properties that follow a comment holding an apostrophe', () => __awaiter(void 0, void 0, void 0, function* () {
+        appTree.create(`/testSrc/appPrefix/component/test.component.scss`, `$my-scrollbar: scrollbar-theme(
+    $sb-size: 16px, // don't need this anymore
+    $sb-thumb-bg-color: blue,
+    $sb-corner-bg: gray
+);`);
+        const tree = yield schematicRunner.runSchematic(migrationName, { shouldInvokeLS: false }, appTree);
+        expect(tree.readContent('/testSrc/appPrefix/component/test.component.scss')).toEqual(`$my-scrollbar: scrollbar-theme( // don't need this anymore
+    $sb-thumb-bg-color: blue
+);`);
+    }));
+    it('should migrate a theme below a comment glued to a closing brace', () => __awaiter(void 0, void 0, void 0, function* () {
+        appTree.create(`/testSrc/appPrefix/component/test.component.scss`, `.selection-area {
+    color: red;
+}// don't set $sb-size here
+
+$my-scrollbar: scrollbar-theme($sb-size: 16px, $sb-thumb-bg-color: blue);`);
+        const tree = yield schematicRunner.runSchematic(migrationName, { shouldInvokeLS: false }, appTree);
+        expect(tree.readContent('/testSrc/appPrefix/component/test.component.scss')).toEqual(`.selection-area {
+    color: red;
+}// don't set $sb-size here
+
+$my-scrollbar: scrollbar-theme( $sb-thumb-bg-color: blue);`);
+    }));
+    it('should migrate a theme preceded on the same line by a protocol-relative url()', () => __awaiter(void 0, void 0, void 0, function* () {
+        appTree.create(`/testSrc/appPrefix/component/test.component.scss`, `.a { background: url(//cdn.example.com/bg.png); $my: scrollbar-theme($sb-size: 16px, $sb-thumb-bg-color: red); }`);
+        const tree = yield schematicRunner.runSchematic(migrationName, { shouldInvokeLS: false }, appTree);
+        expect(tree.readContent('/testSrc/appPrefix/component/test.component.scss')).toEqual(`.a { background: url(//cdn.example.com/bg.png); $my: scrollbar-theme( $sb-thumb-bg-color: red); }`);
+    }));
+    it('should not rewrite a mixin or a function declared with the theme name', () => __awaiter(void 0, void 0, void 0, function* () {
+        const content = `@mixin scrollbar-theme($sb-size: 16px) {
+    width: $sb-size;
+}
+
+@function scrollbar-theme($sb-size: 6px) {
+    @return ($size: $sb-size);
+}`;
+        appTree.create(`/testSrc/appPrefix/component/test.component.scss`, content);
+        const tree = yield schematicRunner.runSchematic(migrationName, { shouldInvokeLS: false }, appTree);
+        expect(tree.readContent('/testSrc/appPrefix/component/test.component.scss')).toEqual(content);
+    }));
     it('should not touch same-named properties on other themes', () => __awaiter(void 0, void 0, void 0, function* () {
         const content = `$my-grid: grid-theme(
     $sb-size: 16px

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "igniteui-angular",
-  "version": "22.2.0-rc.0",
+  "version": "22.2.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",

package/types/igniteui-angular-core.d.ts

@@ -831,6 +831,8 @@ declare class IgxTouchManager {
 type NgControlBackend = 'observable' | 'signal';
 /** Whether a control took a value written through `setValue`. */
 type ValueWriteResult = 'accepted' | 'ignored';
+/** Validation outcome of a control, mirroring `FormControlStatus`. */
+type ControlStatus = 'valid' | 'invalid' | 'pending' | 'disabled';
 /**
  * Uniform access to the `NgControl` bound to a form control.
  *
@@ -852,11 +854,14 @@ declare class NgControlAdapter {
     get disabled(): boolean;
     get valid(): boolean;
     get invalid(): boolean;
+    get pending(): boolean;
+    /** Derived, not read from `status`: the Signal Forms interop throws on a status it does not know. */
+    get status(): ControlStatus;
     get touchedOrDirty(): boolean;
     /**
-     * Signal Forms expose no rule list. A field that is required, or was ever
-     * invalid or pending, is known to have rules; a rule satisfied from the
-     * start stays undetected.
+     * Signal Forms expose no rule list. A field that is required, or was invalid or
+     * pending since it was last pristine and untouched, is known to have rules;
+     * a rule satisfied from that point on stays undetected.
      */
     get hasValidators(): boolean;
     get required(): boolean;
@@ -875,8 +880,12 @@ declare class NgControlAdapter {
      * (DOM or `ControlValueAccessor`), so the caller must update that instead.
      */
     setValue(value: unknown): ValueWriteResult;
-    /** Remembers that the field had rules. Returns the current invalid or pending state. */
-    private noteErrors;
+    /**
+     * Records that the field has rules. A `[formField]` switch reuses the same interop
+     * `NgControl`, so an untouched, pristine control drops earlier observations and keeps
+     * only its current state, e.g. an empty field failing a custom rule before the first edit.
+     */
+    private observeErrors;
     private watch;
 }
 
@@ -4392,4 +4401,4 @@ declare global {
 }
 
 export { AbsolutePosition, AbsoluteScrollStrategy, ActionStripResourceStringsEN, AutoPositionStrategy, BannerResourceStringsEN, BaseFilteringStrategy, BaseFitPositionStrategy, BaseFormatter, BlockScrollStrategy, ByLevelTreeGridMergeStrategy, CachedDataCloneStrategy, CalendarDay, CalendarResourceStringsEN, CarouselResourceStringsEN, ChipResourceStringsEN, CloseScrollStrategy, ColumnPinningPosition, ComboResourceStringsEN, ConnectedPositioningStrategy, ContainerPositionStrategy, DEFAULT_LOCALE, DataUtil, DatePart, DatePickerResourceStringsEN, DateRangePickerResourceStringsEN, DateRangeType, DateTimeUtil, DefaultDataCloneStrategy, DefaultMergeStrategy, DefaultSortingStrategy, DefaultTreeGridMergeStrategy, EDITOR_PROVIDER, ELEMENTS_TOKEN, ElasticPositionStrategy, ExpressionsTreeUtil, FilterUtil, FilteringExpressionsTree, FilteringExpressionsTreeType, FilteringLogic, FilteringStrategy, FormattedValuesFilteringStrategy, FormattedValuesSortingStrategy, GlobalPositionStrategy, GridColumnDataType, GridResourceStringsEN, GridSummaryCalculationMode, GroupMemberCountSortingStrategy, GroupedRecords, HorizontalAlignment, I18N_FORMATTER, IgxActionStripActionsToken, IgxActionStripToken, IgxAngularAnimationPlayer, IgxAngularAnimationService, IgxBaseTransactionService, IgxBooleanFilteringOperand, IgxCurrencyFormatterPipe, IgxDataRecordSorting, IgxDateFilteringOperand, IgxDateFormatterPipe, IgxDateSummaryOperand, IgxDateTimeFilteringOperand, IgxFilteringOperand, IgxFlatTransactionFactory, IgxGridTransaction, IgxGrouping, IgxHierarchicalTransactionFactory, IgxHierarchicalTransactionService, IgxNavigationCloseDirective, IgxNavigationService, IgxNavigationToggleDirective, IgxNumberFilteringOperand, IgxNumberFormatterPipe, IgxNumberSummaryOperand, IgxOverlayOutletDirective, IgxOverlayService, IgxPercentFormatterPipe, IgxPickerActionsDirective, IgxPickerClearComponent, IgxPickerToggleComponent, IgxSelectionAPIService, IgxSorting, IgxStringFilteringOperand, IgxStylesRegistrar, IgxSummaryOperand, IgxTimeFilteringOperand, IgxTimeSummaryOperand, IgxTouchManager, IgxTransactionService, InputResourceStringsEN, IntlFormatter, ListResourceStringsEN, NAVIGATION_KEYS, NgControlAdapter, NoOpScrollStrategy, NoopFilteringStrategy, NoopSortingStrategy, OffsetMode, PaginatorResourceStringsEN, PagingError, PickerCalendarOrientation, PickerHeaderOrientation, PickerInteractionMode, PlatformUtil, Point, QueryBuilderResourceStringsEN, RelativePosition, RelativePositionStrategy, ScrollStrategy, SortingDirection, THEME_TOKEN, TRANSACTION_TYPE, ThemeToken, TimePickerResourceStringsEN, TransactionEventOrigin, TransactionType, TreeGridFilteringStrategy, TreeGridFormattedValuesFilteringStrategy, TreeGridMatchingRecordsOnlyFilteringStrategy, TreeResourceStringsEN, Util, VerticalAlignment, WEEKDAYS, areEqualArrays, areSameMonth, calendarRange, changei18n, clamp, cloneArray, cloneHierarchicalArray, cloneValue, cloneValueCached, columnFieldPath, compareMaps, copyDescriptors, daysInWeek, first, flatten, formatToParts, generateMonth, getClosestActiveDate, getComponentCssSizeVar, getComponentSize, getComponentTheme, getCurrentResourceStrings, getHierarchy, getNextActiveDate, getPreviousActiveDate, getResizeObserver, getYearRange, intoChunks, isConstructor, isDate, isDateInRanges, isEqual, isHierarchyMatch, isLeftToRight, isNextMonth, isObject, isPreviousMonth, isTree, last, mergeObjects, modulo, normalizeURI, onResourceChangeHandle, parseDate, provideIgniteIntl, recreateExpression, recreateTree, recreateTreeFromFields, registerI18n, rem, resizeObservable, resolveNestedPath, reverseMapper, runAfterRenderOnce, showMessage, toCalendarDay, trackByIdentity, uniqueDates, Size$1 as ɵSize };
-export type { Action, AnimationPlayer, AnimationService, CalendarRangeParams, CancelableBrowserEventArgs, CancelableEventArgs, ColumnType, ConnectedFit, CustomDateRange, DatePartDeltas, DatePartInfo, DateRange, DateRangeDescriptor, DayInterval, DayParameter, EditorProvider, EntityType, FieldType, GridSelectionRange, GridStyleCSSProperty, GridTypeBase, HierarchicalState, HierarchicalTransaction, HierarchicalTransactionService, IActionStripResourceStrings, IBannerResourceStrings, IBaseCancelableBrowserEventArgs, IBaseCancelableEventArgs, IBaseEventArgs, ICalendarResourceStrings, ICarouselResourceStrings, IChipResourceStrings, IColumnEditorOptions, IColumnPipeArgs, IColumnSelectionState, IComboResourceStrings, IDataCloneStrategy, IDateParts, IDatePickerResourceStrings, IDateRangePickerResourceStrings, IExpressionTree, IFieldEditorOptions, IFieldPipeArgs, IFilteringExpression, IFilteringExpressionsTree, IFilteringOperation, IFilteringState, IFilteringStrategy, IGridGroupingStrategy, IGridMergeStrategy, IGridResourceStrings, IGridSortingStrategy, IGroupByExpandState, IGroupByKey, IGroupByRecord, IGroupByResult, IGroupingExpression, IGroupingState, IInputResourceStrings, IListResourceStrings, IMergeByResult, IMultiRowLayoutNode, IPaginatorResourceStrings, IPagingState, IPathSegment, IPositionStrategy, IQueryBuilderResourceStrings, IResourceStrings, IScrollStrategy, ISelectionKeyboardState, ISelectionNode, ISelectionPointerState, ISortingExpression, ISortingOptions, ISortingStrategy, ISummaryExpression, ISummaryRecord, ITimePickerResourceStrings, IToggleView, ITreeGridRecord, ITreeResourceStrings, IgcCalendarBaseEventMap, IgxFilterItem, IgxGestureEvent, IgxSummaryResult, IgxTheme, IgxTouchManagerCallbacks, IgxTouchManagerOptions, IgxTreeGridAPIService, KeyOfOrString, MRLColumnSizeInfo, MRLResizeColumnInfo, NgControlBackend, OverlayAnimationEventArgs, OverlayCancelableEventArgs, OverlayClosingEventArgs, OverlayCreateSettings, OverlayEventArgs, OverlaySettings, PositionSettings, RenderPhase, SelectionState, Size, State, StateUpdateEvent, Transaction, TransactionService, ValueWriteResult, WeekDays };
+export type { Action, AnimationPlayer, AnimationService, CalendarRangeParams, CancelableBrowserEventArgs, CancelableEventArgs, ColumnType, ConnectedFit, ControlStatus, CustomDateRange, DatePartDeltas, DatePartInfo, DateRange, DateRangeDescriptor, DayInterval, DayParameter, EditorProvider, EntityType, FieldType, GridSelectionRange, GridStyleCSSProperty, GridTypeBase, HierarchicalState, HierarchicalTransaction, HierarchicalTransactionService, IActionStripResourceStrings, IBannerResourceStrings, IBaseCancelableBrowserEventArgs, IBaseCancelableEventArgs, IBaseEventArgs, ICalendarResourceStrings, ICarouselResourceStrings, IChipResourceStrings, IColumnEditorOptions, IColumnPipeArgs, IColumnSelectionState, IComboResourceStrings, IDataCloneStrategy, IDateParts, IDatePickerResourceStrings, IDateRangePickerResourceStrings, IExpressionTree, IFieldEditorOptions, IFieldPipeArgs, IFilteringExpression, IFilteringExpressionsTree, IFilteringOperation, IFilteringState, IFilteringStrategy, IGridGroupingStrategy, IGridMergeStrategy, IGridResourceStrings, IGridSortingStrategy, IGroupByExpandState, IGroupByKey, IGroupByRecord, IGroupByResult, IGroupingExpression, IGroupingState, IInputResourceStrings, IListResourceStrings, IMergeByResult, IMultiRowLayoutNode, IPaginatorResourceStrings, IPagingState, IPathSegment, IPositionStrategy, IQueryBuilderResourceStrings, IResourceStrings, IScrollStrategy, ISelectionKeyboardState, ISelectionNode, ISelectionPointerState, ISortingExpression, ISortingOptions, ISortingStrategy, ISummaryExpression, ISummaryRecord, ITimePickerResourceStrings, IToggleView, ITreeGridRecord, ITreeResourceStrings, IgcCalendarBaseEventMap, IgxFilterItem, IgxGestureEvent, IgxSummaryResult, IgxTheme, IgxTouchManagerCallbacks, IgxTouchManagerOptions, IgxTreeGridAPIService, KeyOfOrString, MRLColumnSizeInfo, MRLResizeColumnInfo, NgControlBackend, OverlayAnimationEventArgs, OverlayCancelableEventArgs, OverlayClosingEventArgs, OverlayCreateSettings, OverlayEventArgs, OverlaySettings, PositionSettings, RenderPhase, SelectionState, Size, State, StateUpdateEvent, Transaction, TransactionService, ValueWriteResult, WeekDays };

package/types/igniteui-angular-input-group.d.ts

@@ -1,7 +1,7 @@
 import * as i0 from '@angular/core';
 import { OnInit, AfterViewInit, OnDestroy, ElementRef, ChangeDetectorRef, Renderer2, InjectionToken, AfterContentChecked, QueryList } from '@angular/core';
 import { NgModel, NgControl } from '@angular/forms';
-import { IInputResourceStrings, IgxTheme } from 'igniteui-angular/core';
+import { ControlStatus, IInputResourceStrings, IgxTheme } from 'igniteui-angular/core';
 
 declare class IgxHintDirective implements OnInit {
     /**
@@ -80,6 +80,19 @@ declare enum IgxInputState {
     VALID = 1,
     INVALID = 2
 }
+/**
+ * Whether an editor may paint the success state.
+ *
+ * @hidden @internal
+ */
+type SuccessState = 'allowed' | 'suppressed';
+/**
+ * Maps a control status to an editor state. A pending async rule has not answered
+ * yet, so it reads as initial rather than as an error.
+ *
+ * @hidden @internal
+ */
+declare function toInputState(status: ControlStatus, success: SuccessState): IgxInputState;
 /**
  * The `igxInput` directive creates single- or multiline text elements, covering common scenarios when dealing with form inputs.
  *
@@ -261,6 +274,7 @@ declare class IgxInputDirective implements AfterViewInit, OnDestroy {
      * @internal
      */
     protected updateValidityState(): void;
+    private updateAriaRequired;
     /**
      * Gets whether the igxInput has a placeholder.
      *
@@ -695,5 +709,5 @@ declare class IgxInputGroupModule {
     static ɵinj: i0.ɵɵInjectorDeclaration<IgxInputGroupModule>;
 }
 
-export { IGX_INPUT_GROUP_DIRECTIVES, IGX_INPUT_GROUP_TYPE, IgxHintDirective, IgxInputDirective, IgxInputGroupBase, IgxInputGroupComponent, IgxInputGroupEnum, IgxInputGroupModule, IgxInputState, IgxLabelDirective, IgxPrefixDirective, IgxReadOnlyInputDirective, IgxSuffixDirective };
-export type { IgxInputGroupType };
+export { IGX_INPUT_GROUP_DIRECTIVES, IGX_INPUT_GROUP_TYPE, IgxHintDirective, IgxInputDirective, IgxInputGroupBase, IgxInputGroupComponent, IgxInputGroupEnum, IgxInputGroupModule, IgxInputState, IgxLabelDirective, IgxPrefixDirective, IgxReadOnlyInputDirective, IgxSuffixDirective, toInputState };
+export type { IgxInputGroupType, SuccessState };

package/types/igniteui-angular-time-picker.d.ts

@@ -252,7 +252,6 @@ declare class IgxTimePickerComponent extends PickerBaseDirective implements IgxT
     private _cancelButtonLabel;
     private _itemsDelta;
     private _statusChanges$;
-    private _ngControl;
     private _control;
     private _onChangeCallback;
     private _onTouchedCallback;