@angular/material 19.0.0-next.6 → 19.0.0-next.7

package/chips/index.d.ts

@@ -169,6 +169,8 @@ export declare class MatChip implements OnInit, AfterViewInit, AfterContentInit,
     ariaDescription: string | null;
     /** Id of a span that contains this chip's aria description. */
     _ariaDescriptionId: string;
+    /** Whether the chip list is disabled. */
+    _chipListDisabled: boolean;
     private _textElement;
     /**
      * The value of the chip. Defaults to the content inside
@@ -196,7 +198,9 @@ export declare class MatChip implements OnInit, AfterViewInit, AfterContentInit,
     /** Whether the ripple effect is disabled or not. */
     disableRipple: boolean;
     /** Whether the chip is disabled. */
-    disabled: boolean;
+    get disabled(): boolean;
+    set disabled(value: boolean);
+    private _disabled;
     /** Emitted when a chip is to be removed. */
     readonly removed: EventEmitter<MatChipEvent>;
     /** Emitted when the chip is destroyed. */

package/core/_core.scss

@@ -6,6 +6,13 @@
 
 // Mixin that renders all of the core styles that are not theme-dependent.
 @mixin core() {
+  @include cdk.a11y-visually-hidden();
+  @include private.structural-styling();
+}
+
+// Emits the mat-app-background CSS class. This predefined class sets the
+// background color and text color of an element.
+@mixin app-background() {
   // TODO: Move ripple styles to be dynamically loaded instead of in core.
   // This variable is used as a fallback for the ripple element's
   // background color. However, if it isn't defined anywhere, then MSS
@@ -14,9 +21,6 @@
     --mat-app-on-surface: initial;
   }
 
-  @include cdk.a11y-visually-hidden();
-  @include private.structural-styling();
-
   // Wrapper element that provides the theme background when the
   // user's content isn't inside of a `mat-sidenav-container`.
   @at-root {
@@ -26,7 +30,17 @@
         @include token-utils.create-token-slot(background-color, background-color, transparent);
         @include token-utils.create-token-slot(color, text-color, inherit);
       }
+    }
+  }
+}
 
+// Emits CSS classes for applying elevation. These classes follow the pattern
+// mat-elevation-z#, where # is the elevation number you want, from 0 to 24.
+// These predefined classes use the CSS box-shadow settings defined by the
+// Material Design specification.
+@mixin elevation-classes() {
+  @at-root {
+    @include token-utils.use-tokens(tokens-mat-app.$prefix, tokens-mat-app.get-token-slots()) {
       // Provides external CSS classes for each elevation value. Each CSS class is formatted as
       // `mat-elevation-z$z-value` where `$z-value` corresponds to the z-space to which the element
       // is elevated.
@@ -42,9 +56,3 @@
     }
   }
 }
-
-// Mixin that provides the .mat-app-background class.
-@mixin app-background() {}
-
-// Mixin that provides the .mat-elevation-* classes.
-@mixin elevation-classes() {}

package/core/index.d.ts

@@ -19,6 +19,7 @@ import { OnInit } from '@angular/core';
 import { Platform } from '@angular/cdk/platform';
 import { Provider } from '@angular/core';
 import { QueryList } from '@angular/core';
+import { Signal } from '@angular/core';
 import { Subject } from 'rxjs';
 import { Version } from '@angular/core';
 
@@ -198,6 +199,42 @@ export declare abstract class DateAdapter<D, L = any> {
      * @returns An invalid date.
      */
     abstract invalid(): D;
+    /**
+     * Sets the time of one date to the time of another.
+     * @param target Date whose time will be set.
+     * @param hours New hours to set on the date object.
+     * @param minutes New minutes to set on the date object.
+     * @param seconds New seconds to set on the date object.
+     */
+    setTime(target: D, hours: number, minutes: number, seconds: number): D;
+    /**
+     * Gets the hours component of the given date.
+     * @param date The date to extract the hours from.
+     */
+    getHours(date: D): number;
+    /**
+     * Gets the minutes component of the given date.
+     * @param date The date to extract the minutes from.
+     */
+    getMinutes(date: D): number;
+    /**
+     * Gets the seconds component of the given date.
+     * @param date The date to extract the seconds from.
+     */
+    getSeconds(date: D): number;
+    /**
+     * Parses a date with a specific time from a user-provided value.
+     * @param value The value to parse.
+     * @param parseFormat The expected format of the value being parsed
+     *     (type is implementation-dependent).
+     */
+    parseTime(value: any, parseFormat: any): D | null;
+    /**
+     * Adds an amount of seconds to the specified date.
+     * @param date Date to which to add the seconds.
+     * @param amount Amount of seconds to add to the date.
+     */
+    addSeconds(date: D, amount: number): D;
     /**
      * Given a potential date object, returns that same date object if it is
      * a valid date, or `null` if it's not a valid date.
@@ -231,6 +268,14 @@ export declare abstract class DateAdapter<D, L = any> {
      *     a number greater than 0 if the first date is later.
      */
     compareDate(first: D, second: D): number;
+    /**
+     * Compares the time values of two dates.
+     * @param first First date to compare.
+     * @param second Second date to compare.
+     * @returns 0 if the times are equal, a number less than 0 if the first time is earlier,
+     *     a number greater than 0 if the first time is later.
+     */
+    compareTime(first: D, second: D): number;
     /**
      * Checks if two dates are equal.
      * @param first The first date to check.
@@ -239,6 +284,14 @@ export declare abstract class DateAdapter<D, L = any> {
      *     Null dates are considered equal to other null dates.
      */
     sameDate(first: D | null, second: D | null): boolean;
+    /**
+     * Checks if the times of two dates are equal.
+     * @param first The first date to check.
+     * @param second The second date to check.
+     * @returns Whether the times of the two dates are equal.
+     *     Null dates are considered equal to other null dates.
+     */
+    sameTime(first: D | null, second: D | null): boolean;
     /**
      * Clamp the given date between min and max dates.
      * @param date The date to clamp.
@@ -414,6 +467,7 @@ export declare class MatCommonModule {
 export declare type MatDateFormats = {
     parse: {
         dateInput: any;
+        timeInput?: any;
     };
     display: {
         dateInput: any;
@@ -421,6 +475,8 @@ export declare type MatDateFormats = {
         monthYearLabel: any;
         dateA11yLabel: any;
         monthYearA11yLabel: any;
+        timeInput?: any;
+        timeOptionLabel?: any;
     };
 };
 
@@ -491,6 +547,7 @@ export declare class MatOption<T = any> implements FocusableOption, AfterViewChe
     _changeDetectorRef: ChangeDetectorRef;
     private _parent;
     group: MatOptgroup | null;
+    private _signalDisableRipple;
     private _selected;
     private _active;
     private _disabled;
@@ -581,7 +638,7 @@ export declare class MatOptionModule {
  * @docs-private
  */
 export declare interface MatOptionParentComponent {
-    disableRipple?: boolean;
+    disableRipple?: boolean | Signal<boolean>;
     multiple?: boolean;
     inertGroups?: boolean;
     hideSingleSelectionIndicator?: boolean;
@@ -809,6 +866,12 @@ export declare class NativeDateAdapter extends DateAdapter<Date> {
     isDateInstance(obj: any): obj is Date;
     isValid(date: Date): boolean;
     invalid(): Date;
+    setTime(target: Date, hours: number, minutes: number, seconds: number): Date;
+    getHours(date: Date): number;
+    getMinutes(date: Date): number;
+    getSeconds(date: Date): number;
+    parseTime(userValue: any, parseFormat?: any): Date | null;
+    addSeconds(date: Date, amount: number): Date;
     /** Creates a date but allows the month and date to overflow. */
     private _createDateWithOverflow;
     /**

package/fesm2022/chips.mjs

@@ -254,6 +254,13 @@ class MatChip {
     set value(value) {
         this._value = value;
     }
+    /** Whether the chip is disabled. */
+    get disabled() {
+        return this._disabled || this._chipListDisabled;
+    }
+    set disabled(value) {
+        this._disabled = value;
+    }
     constructor() {
         this._changeDetectorRef = inject(ChangeDetectorRef);
         this._elementRef = inject(ElementRef);
@@ -285,6 +292,8 @@ class MatChip {
         this.ariaDescription = null;
         /** Id of a span that contains this chip's aria description. */
         this._ariaDescriptionId = `${this.id}-aria-description`;
+        /** Whether the chip list is disabled. */
+        this._chipListDisabled = false;
         /**
          * Determines whether or not the chip displays the remove styling and emits (removed) events.
          */
@@ -295,8 +304,7 @@ class MatChip {
         this.highlighted = false;
         /** Whether the ripple effect is disabled or not. */
         this.disableRipple = false;
-        /** Whether the chip is disabled. */
-        this.disabled = false;
+        this._disabled = false;
         /** Emitted when a chip is to be removed. */
         this.removed = new EventEmitter();
         /** Emitted when the chip is destroyed. */
@@ -959,12 +967,10 @@ class MatChipSet {
     }
     /** Syncs the chip-set's state with the individual chips. */
     _syncChipsState() {
-        if (this._chips) {
-            this._chips.forEach(chip => {
-                chip.disabled = this._disabled;
-                chip._changeDetectorRef.markForCheck();
-            });
-        }
+        this._chips?.forEach(chip => {
+            chip._chipListDisabled = this._disabled;
+            chip._changeDetectorRef.markForCheck();
+        });
     }
     /** Dummy method for subclasses to override. Base chip set cannot be focused. */
     focus() { }
@@ -989,16 +995,15 @@ class MatChipSet {
      * it back to the first chip, creating a focus trap, if it user tries to tab away.
      */
     _allowFocusEscape() {
-        if (this.tabIndex !== -1) {
-            const previousTabIndex = this.tabIndex;
-            this.tabIndex = -1;
-            this._changeDetectorRef.markForCheck();
+        const previous = this._elementRef.nativeElement.tabIndex;
+        if (previous !== -1) {
+            // Set the tabindex directly on the element, instead of going through
+            // the data binding, because we aren't guaranteed that change detection
+            // will run quickly enough to allow focus to escape.
+            this._elementRef.nativeElement.tabIndex = -1;
             // Note that this needs to be a `setTimeout`, because a `Promise.resolve`
             // doesn't allow enough time for the focus to escape.
-            setTimeout(() => {
-                this.tabIndex = previousTabIndex;
-                this._changeDetectorRef.markForCheck();
-            });
+            setTimeout(() => (this._elementRef.nativeElement.tabIndex = previous));
         }
     }
     /**
@@ -1704,8 +1709,14 @@ class MatChipGrid extends MatChipSet {
             // error if the input does something on focus (e.g. opens an autocomplete).
             Promise.resolve().then(() => this._chipInput.focus());
         }
-        else if (this._chips.length && this._keyManager.activeItemIndex !== 0) {
-            this._keyManager.setFirstItemActive();
+        else {
+            const activeItem = this._keyManager.activeItem;
+            if (activeItem) {
+                activeItem.focus();
+            }
+            else {
+                this._keyManager.setFirstItemActive();
+            }
         }
         this.stateChanges.next();
     }