@angular/material 15.0.1 → 15.1.0-next.0

package/radio/_radio-private.scss

@@ -0,0 +1,60 @@
+@use '@material/radio/radio-theme' as mdc-radio-theme;
+@use '@material/theme/theme-color' as mdc-theme-color;
+@use '../core/theming/palette';
+@use '../core/theming/theming';
+@use 'sass:map';
+
+$private-radio-theme-config: map.merge(mdc-radio-theme.$light-theme, (
+  // Exclude the styles we don't need.
+  selected-focus-state-layer-color: null,
+  selected-focus-state-layer-opacity: null,
+  selected-hover-state-layer-color: null,
+  selected-hover-state-layer-opacity: null,
+  selected-pressed-state-layer-color: null,
+  selected-pressed-state-layer-opacity: null,
+  unselected-focus-icon-color: null,
+  unselected-focus-state-layer-color: null,
+  unselected-focus-state-layer-opacity: null,
+  unselected-hover-state-layer-color: null,
+  unselected-hover-state-layer-opacity: null,
+  unselected-pressed-state-layer-color: null,
+  unselected-pressed-state-layer-opacity: null,
+));
+
+@mixin private-radio-color($color-config, $color-palette) {
+  $foreground: map.get($color-config, foreground);
+
+  $on-surface: rgba(mdc-theme-color.$on-surface, 0.54);
+  $is-dark: map.get($color-config, is-dark);
+  $active-border-color: if(
+          $is-dark,
+          theming.get-color-from-palette(palette.$gray-palette, 200),
+          theming.get-color-from-palette(palette.$gray-palette, 900)
+  );
+
+  & {
+    @include mdc-radio-theme.theme((
+      // The disabled colors don't use the `rgba` version, because
+      // MDC applies a separate opacity to disabled buttons.
+      disabled-selected-icon-color: mdc-theme-color.$on-surface,
+      disabled-unselected-icon-color: mdc-theme-color.$on-surface,
+      unselected-focus-icon-color: $active-border-color,
+      unselected-hover-icon-color: $active-border-color,
+      unselected-icon-color: $on-surface,
+      unselected-pressed-icon-color: $on-surface,
+      selected-focus-icon-color: $color-palette,
+      selected-hover-icon-color: $color-palette,
+      selected-icon-color: $color-palette,
+      selected-pressed-icon-color: $color-palette,
+    ));
+
+    --mat-mdc-radio-ripple-color: #{mdc-theme-color.prop-value(on-surface)};
+
+    // MDC should set the disabled color on the label, but doesn't, so we do it here instead.
+    .mdc-radio--disabled + label {
+      color: theming.get-color-from-palette($foreground, disabled-text);
+    }
+
+    --mat-mdc-radio-checked-ripple-color: #{$color-palette};
+  }
+}

package/radio/_radio-theme.scss

@@ -1,70 +1,32 @@
-@use 'sass:map';
-@use '@material/theme/theme-color' as mdc-theme-color;
-@use '@material/radio/radio-theme' as mdc-radio-theme;
 @use '@material/radio/radio' as mdc-radio;
+@use '@material/radio/radio-theme' as mdc-radio-theme;
 @use '@material/form-field' as mdc-form-field;
-@use '../core/theming/theming';
 @use '../core/mdc-helpers/mdc-helpers';
+@use '../core/theming/theming';
 @use '../core/typography/typography';
-@use '../core/theming/palette';
-
-@mixin _color-palette($color-palette) {
-  @include mdc-radio-theme.theme((
-    selected-focus-icon-color: $color-palette,
-    selected-hover-icon-color: $color-palette,
-    selected-icon-color: $color-palette,
-    selected-pressed-icon-color: $color-palette,
-  ));
-
-  --mat-mdc-radio-checked-ripple-color: #{$color-palette};
-}
+@use './radio-private';
+@use 'sass:map';
 
 @mixin color($config-or-theme) {
   $config: theming.get-color-config($config-or-theme);
   $primary: theming.get-color-from-palette(map.get($config, primary));
   $accent: theming.get-color-from-palette(map.get($config, accent));
   $warn: theming.get-color-from-palette(map.get($config, warn));
-  $foreground: map.get($config, foreground);
 
   @include mdc-helpers.using-mdc-theme($config) {
-    $on-surface: rgba(mdc-theme-color.$on-surface, 0.54);
-    $is-dark: map.get($config, is-dark);
-    $active-border-color: if(
-            $is-dark,
-            theming.get-color-from-palette(palette.$gray-palette, 200),
-            theming.get-color-from-palette(palette.$gray-palette, 900)
-    );
-
     .mat-mdc-radio-button {
       @include mdc-form-field.core-styles($query: mdc-helpers.$mdc-theme-styles-query);
-      @include mdc-radio-theme.theme((
-        // The disabled colors don't use the `rgba` version, because
-        // MDC applies a separate opacity to disabled buttons.
-        disabled-selected-icon-color: mdc-theme-color.$on-surface,
-        disabled-unselected-icon-color: mdc-theme-color.$on-surface,
-        unselected-focus-icon-color: $active-border-color,
-        unselected-hover-icon-color: $active-border-color,
-        unselected-icon-color: $on-surface,
-        unselected-pressed-icon-color: $on-surface,
-      ));
-
-      --mat-mdc-radio-ripple-color: #{mdc-theme-color.prop-value(on-surface)};
-
-      // MDC should set the disabled color on the label, but doesn't, so we do it here instead.
-      .mdc-radio--disabled + label {
-        color: theming.get-color-from-palette($foreground, disabled-text);
-      }
 
       &.mat-primary {
-        @include _color-palette($primary);
+        @include radio-private.private-radio-color($config, $primary);
       }
 
       &.mat-accent {
-        @include _color-palette($accent);
+        @include radio-private.private-radio-color($config, $accent);
       }
 
       &.mat-warn {
-        @include _color-palette($warn);
+        @include radio-private.private-radio-color($config, $warn);
       }
     }
   }

package/tabs/testing/index.d.ts

@@ -122,16 +122,18 @@ declare class MatTabNavPanelHarness extends ContentContainerComponentHarness {
     getTextContent(): Promise<string>;
 }
 
-/** A set of criteria that can be used to filter a list of `MatRadioButtonHarness` instances. */
+/** A set of criteria that can be used to filter a list of `MatTabGroupHarness` instances. */
 export declare interface TabGroupHarnessFilters extends BaseHarnessFilters {
     /** Only find instances whose selected tab label matches the given value. */
     selectedTabLabel?: string | RegExp;
 }
 
-/** A set of criteria that can be used to filter a list of `MatRadioButtonHarness` instances. */
+/** A set of criteria that can be used to filter a list of `MatTabHarness` instances. */
 export declare interface TabHarnessFilters extends BaseHarnessFilters {
     /** Only find instances whose label matches the given value. */
     label?: string | RegExp;
+    /** Only find instances whose selected state matches the given value. */
+    selected?: boolean;
 }
 
 /** A set of criteria that can be used to filter a list of `MatTabLinkHarness` instances. */
@@ -144,7 +146,7 @@ export declare interface TabLinkHarnessFilters extends BaseHarnessFilters {
 export declare interface TabNavBarHarnessFilters extends BaseHarnessFilters {
 }
 
-/** A set of criteria that can be used to filter a list of `MatTabNavBarHarness` instances. */
+/** A set of criteria that can be used to filter a list of `MatTabNavPanelHarness` instances. */
 export declare interface TabNavPanelHarnessFilters extends BaseHarnessFilters {
 }