@angular/material 17.0.0-rc.0 → 17.0.0-rc.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/_index.scss +1 -1
- package/button/_icon-button-theme.scss +12 -31
- package/button/index.d.ts +0 -2
- package/chips/index.d.ts +2 -3
- package/core/index.d.ts +2 -3
- package/core/tokens/m2/mat/_sort.scss +60 -0
- package/core/tokens/m2/mat/_tree.scss +62 -0
- package/core/tokens/m2/mdc/_icon-button.scss +19 -6
- package/divider/_divider-theme.scss +4 -1
- package/esm2022/autocomplete/autocomplete-origin.mjs +4 -4
- package/esm2022/autocomplete/autocomplete-trigger.mjs +4 -4
- package/esm2022/autocomplete/autocomplete.mjs +4 -4
- package/esm2022/autocomplete/module.mjs +5 -5
- package/esm2022/badge/badge-module.mjs +5 -5
- package/esm2022/badge/badge.mjs +4 -4
- package/esm2022/bottom-sheet/bottom-sheet-container.mjs +4 -4
- package/esm2022/bottom-sheet/bottom-sheet-module.mjs +5 -5
- package/esm2022/bottom-sheet/bottom-sheet.mjs +4 -4
- package/esm2022/button/button-base.mjs +19 -24
- package/esm2022/button/button.mjs +7 -7
- package/esm2022/button/fab.mjs +13 -13
- package/esm2022/button/icon-button.mjs +9 -9
- package/esm2022/button/module.mjs +5 -5
- package/esm2022/button-toggle/button-toggle-module.mjs +5 -5
- package/esm2022/button-toggle/button-toggle.mjs +8 -8
- package/esm2022/card/card.mjs +43 -43
- package/esm2022/card/module.mjs +5 -5
- package/esm2022/checkbox/checkbox-required-validator.mjs +4 -4
- package/esm2022/checkbox/checkbox.mjs +5 -5
- package/esm2022/checkbox/module.mjs +9 -9
- package/esm2022/chips/chip-action.mjs +4 -4
- package/esm2022/chips/chip-edit-input.mjs +4 -4
- package/esm2022/chips/chip-grid.mjs +4 -4
- package/esm2022/chips/chip-icons.mjs +10 -10
- package/esm2022/chips/chip-input.mjs +4 -4
- package/esm2022/chips/chip-listbox.mjs +4 -4
- package/esm2022/chips/chip-option.mjs +7 -8
- package/esm2022/chips/chip-row.mjs +8 -9
- package/esm2022/chips/chip-set.mjs +4 -4
- package/esm2022/chips/chip.mjs +6 -7
- package/esm2022/chips/module.mjs +8 -9
- package/esm2022/core/common-behaviors/common-module.mjs +5 -5
- package/esm2022/core/datetime/index.mjs +9 -9
- package/esm2022/core/datetime/native-date-adapter.mjs +4 -4
- package/esm2022/core/error/error-options.mjs +7 -7
- package/esm2022/core/line/line.mjs +8 -8
- package/esm2022/core/option/index.mjs +6 -7
- package/esm2022/core/option/optgroup.mjs +4 -4
- package/esm2022/core/option/option.mjs +8 -9
- package/esm2022/core/private/ripple-loader.mjs +4 -4
- package/esm2022/core/ripple/index.mjs +5 -5
- package/esm2022/core/ripple/ripple.mjs +4 -4
- package/esm2022/core/selection/pseudo-checkbox/pseudo-checkbox-module.mjs +5 -5
- package/esm2022/core/selection/pseudo-checkbox/pseudo-checkbox.mjs +4 -4
- package/esm2022/core/version.mjs +1 -1
- package/esm2022/datepicker/calendar-body.mjs +5 -5
- package/esm2022/datepicker/calendar.mjs +13 -14
- package/esm2022/datepicker/date-range-input-parts.mjs +10 -10
- package/esm2022/datepicker/date-range-input.mjs +4 -4
- package/esm2022/datepicker/date-range-picker.mjs +4 -4
- package/esm2022/datepicker/date-range-selection-strategy.mjs +4 -4
- package/esm2022/datepicker/date-selection-model.mjs +10 -10
- package/esm2022/datepicker/datepicker-actions.mjs +10 -10
- package/esm2022/datepicker/datepicker-base.mjs +7 -7
- package/esm2022/datepicker/datepicker-input-base.mjs +4 -4
- package/esm2022/datepicker/datepicker-input.mjs +4 -4
- package/esm2022/datepicker/datepicker-intl.mjs +4 -4
- package/esm2022/datepicker/datepicker-module.mjs +5 -5
- package/esm2022/datepicker/datepicker-toggle.mjs +9 -10
- package/esm2022/datepicker/datepicker.mjs +4 -4
- package/esm2022/datepicker/month-view.mjs +6 -7
- package/esm2022/datepicker/multi-year-view.mjs +4 -4
- package/esm2022/datepicker/year-view.mjs +4 -4
- package/esm2022/dialog/dialog-container.mjs +4 -4
- package/esm2022/dialog/dialog-content-directives.mjs +13 -13
- package/esm2022/dialog/dialog.mjs +4 -4
- package/esm2022/dialog/module.mjs +5 -5
- package/esm2022/divider/divider-module.mjs +5 -5
- package/esm2022/divider/divider.mjs +5 -5
- package/esm2022/expansion/accordion.mjs +4 -4
- package/esm2022/expansion/expansion-module.mjs +7 -8
- package/esm2022/expansion/expansion-panel-content.mjs +4 -4
- package/esm2022/expansion/expansion-panel-header.mjs +11 -12
- package/esm2022/expansion/expansion-panel.mjs +7 -7
- package/esm2022/form-field/directives/error.mjs +4 -4
- package/esm2022/form-field/directives/floating-label.mjs +4 -4
- package/esm2022/form-field/directives/hint.mjs +4 -4
- package/esm2022/form-field/directives/label.mjs +4 -4
- package/esm2022/form-field/directives/line-ripple.mjs +4 -4
- package/esm2022/form-field/directives/notched-outline.mjs +4 -4
- package/esm2022/form-field/directives/prefix.mjs +4 -4
- package/esm2022/form-field/directives/suffix.mjs +4 -4
- package/esm2022/form-field/form-field-control.mjs +4 -4
- package/esm2022/form-field/form-field.mjs +6 -6
- package/esm2022/form-field/module.mjs +5 -5
- package/esm2022/grid-list/grid-list-module.mjs +5 -5
- package/esm2022/grid-list/grid-list.mjs +4 -4
- package/esm2022/grid-list/grid-tile.mjs +16 -16
- package/esm2022/icon/icon-module.mjs +5 -5
- package/esm2022/icon/icon-registry.mjs +4 -4
- package/esm2022/icon/icon.mjs +4 -4
- package/esm2022/icon/testing/fake-icon-registry.mjs +8 -8
- package/esm2022/input/input.mjs +4 -4
- package/esm2022/input/module.mjs +5 -5
- package/esm2022/list/action-list.mjs +4 -4
- package/esm2022/list/list-base.mjs +7 -7
- package/esm2022/list/list-item-sections.mjs +19 -19
- package/esm2022/list/list-module.mjs +5 -5
- package/esm2022/list/list-option.mjs +6 -6
- package/esm2022/list/list.mjs +7 -7
- package/esm2022/list/nav-list.mjs +4 -4
- package/esm2022/list/selection-list.mjs +4 -4
- package/esm2022/list/subheader.mjs +4 -4
- package/esm2022/menu/menu-content.mjs +4 -4
- package/esm2022/menu/menu-item.mjs +6 -7
- package/esm2022/menu/menu-trigger.mjs +4 -4
- package/esm2022/menu/menu.mjs +4 -4
- package/esm2022/menu/module.mjs +5 -5
- package/esm2022/paginator/module.mjs +6 -7
- package/esm2022/paginator/paginator-intl.mjs +4 -4
- package/esm2022/paginator/paginator.mjs +10 -11
- package/esm2022/progress-bar/module.mjs +5 -5
- package/esm2022/progress-bar/progress-bar.mjs +4 -4
- package/esm2022/progress-spinner/module.mjs +5 -5
- package/esm2022/progress-spinner/progress-spinner.mjs +4 -4
- package/esm2022/radio/module.mjs +5 -5
- package/esm2022/radio/radio.mjs +8 -8
- package/esm2022/select/module.mjs +5 -5
- package/esm2022/select/select.mjs +9 -9
- package/esm2022/sidenav/drawer.mjs +12 -13
- package/esm2022/sidenav/sidenav-module.mjs +7 -8
- package/esm2022/sidenav/sidenav.mjs +12 -13
- package/esm2022/slide-toggle/module.mjs +10 -11
- package/esm2022/slide-toggle/slide-toggle-required-validator.mjs +4 -4
- package/esm2022/slide-toggle/slide-toggle.mjs +5 -6
- package/esm2022/slider/module.mjs +6 -7
- package/esm2022/slider/slider-input.mjs +7 -7
- package/esm2022/slider/slider-thumb.mjs +6 -7
- package/esm2022/slider/slider.mjs +6 -7
- package/esm2022/snack-bar/module.mjs +5 -5
- package/esm2022/snack-bar/simple-snack-bar.mjs +5 -6
- package/esm2022/snack-bar/snack-bar-container.mjs +4 -4
- package/esm2022/snack-bar/snack-bar-content.mjs +10 -10
- package/esm2022/snack-bar/snack-bar.mjs +4 -4
- package/esm2022/sort/sort-header-intl.mjs +4 -4
- package/esm2022/sort/sort-header.mjs +5 -6
- package/esm2022/sort/sort-module.mjs +6 -7
- package/esm2022/sort/sort.mjs +4 -4
- package/esm2022/stepper/step-content.mjs +4 -4
- package/esm2022/stepper/step-header.mjs +5 -5
- package/esm2022/stepper/step-label.mjs +4 -4
- package/esm2022/stepper/stepper-button.mjs +7 -7
- package/esm2022/stepper/stepper-icon.mjs +4 -4
- package/esm2022/stepper/stepper-intl.mjs +4 -4
- package/esm2022/stepper/stepper-module.mjs +5 -5
- package/esm2022/stepper/stepper.mjs +8 -8
- package/esm2022/table/cell.mjs +22 -22
- package/esm2022/table/module.mjs +5 -5
- package/esm2022/table/row.mjs +22 -22
- package/esm2022/table/table.mjs +7 -7
- package/esm2022/table/text-column.mjs +4 -4
- package/esm2022/tabs/module.mjs +5 -5
- package/esm2022/tabs/paginated-tab-header.mjs +4 -4
- package/esm2022/tabs/tab-body.mjs +7 -7
- package/esm2022/tabs/tab-content.mjs +4 -4
- package/esm2022/tabs/tab-group.mjs +6 -6
- package/esm2022/tabs/tab-header.mjs +4 -4
- package/esm2022/tabs/tab-label-wrapper.mjs +4 -4
- package/esm2022/tabs/tab-label.mjs +4 -4
- package/esm2022/tabs/tab-nav-bar/tab-nav-bar.mjs +10 -10
- package/esm2022/tabs/tab.mjs +4 -4
- package/esm2022/toolbar/toolbar-module.mjs +5 -5
- package/esm2022/toolbar/toolbar.mjs +7 -7
- package/esm2022/tooltip/module.mjs +5 -5
- package/esm2022/tooltip/tooltip.mjs +7 -7
- package/esm2022/tree/node.mjs +10 -10
- package/esm2022/tree/outlet.mjs +4 -4
- package/esm2022/tree/padding.mjs +4 -4
- package/esm2022/tree/toggle.mjs +4 -4
- package/esm2022/tree/tree-module.mjs +5 -5
- package/esm2022/tree/tree.mjs +5 -5
- package/expansion/index.d.ts +4 -5
- package/fesm2022/autocomplete.mjs +13 -13
- package/fesm2022/autocomplete.mjs.map +1 -1
- package/fesm2022/badge.mjs +7 -7
- package/fesm2022/badge.mjs.map +1 -1
- package/fesm2022/bottom-sheet.mjs +10 -10
- package/fesm2022/bottom-sheet.mjs.map +1 -1
- package/fesm2022/button-toggle.mjs +11 -11
- package/fesm2022/button-toggle.mjs.map +1 -1
- package/fesm2022/button.mjs +48 -53
- package/fesm2022/button.mjs.map +1 -1
- package/fesm2022/card.mjs +46 -46
- package/fesm2022/card.mjs.map +1 -1
- package/fesm2022/checkbox.mjs +15 -15
- package/fesm2022/checkbox.mjs.map +1 -1
- package/fesm2022/chips.mjs +53 -54
- package/fesm2022/chips.mjs.map +1 -1
- package/fesm2022/core.mjs +59 -60
- package/fesm2022/core.mjs.map +1 -1
- package/fesm2022/datepicker.mjs +89 -89
- package/fesm2022/datepicker.mjs.map +1 -1
- package/fesm2022/dialog.mjs +22 -22
- package/fesm2022/dialog.mjs.map +1 -1
- package/fesm2022/divider.mjs +8 -8
- package/fesm2022/divider.mjs.map +1 -1
- package/fesm2022/expansion.mjs +29 -30
- package/fesm2022/expansion.mjs.map +1 -1
- package/fesm2022/form-field.mjs +36 -36
- package/fesm2022/form-field.mjs.map +1 -1
- package/fesm2022/grid-list.mjs +22 -22
- package/fesm2022/grid-list.mjs.map +1 -1
- package/fesm2022/icon/testing.mjs +7 -7
- package/fesm2022/icon/testing.mjs.map +1 -1
- package/fesm2022/icon.mjs +10 -10
- package/fesm2022/icon.mjs.map +1 -1
- package/fesm2022/input.mjs +7 -7
- package/fesm2022/input.mjs.map +1 -1
- package/fesm2022/list.mjs +51 -51
- package/fesm2022/list.mjs.map +1 -1
- package/fesm2022/menu.mjs +23 -23
- package/fesm2022/menu.mjs.map +1 -1
- package/fesm2022/paginator.mjs +17 -19
- package/fesm2022/paginator.mjs.map +1 -1
- package/fesm2022/progress-bar.mjs +7 -7
- package/fesm2022/progress-bar.mjs.map +1 -1
- package/fesm2022/progress-spinner.mjs +7 -7
- package/fesm2022/progress-spinner.mjs.map +1 -1
- package/fesm2022/radio.mjs +11 -11
- package/fesm2022/radio.mjs.map +1 -1
- package/fesm2022/select.mjs +12 -12
- package/fesm2022/select.mjs.map +1 -1
- package/fesm2022/sidenav.mjs +29 -30
- package/fesm2022/sidenav.mjs.map +1 -1
- package/fesm2022/slide-toggle.mjs +16 -18
- package/fesm2022/slide-toggle.mjs.map +1 -1
- package/fesm2022/slider.mjs +22 -24
- package/fesm2022/slider.mjs.map +1 -1
- package/fesm2022/snack-bar.mjs +26 -27
- package/fesm2022/snack-bar.mjs.map +1 -1
- package/fesm2022/sort.mjs +15 -17
- package/fesm2022/sort.mjs.map +1 -1
- package/fesm2022/stepper.mjs +33 -33
- package/fesm2022/stepper.mjs.map +1 -1
- package/fesm2022/table.mjs +55 -55
- package/fesm2022/table.mjs.map +1 -1
- package/fesm2022/tabs.mjs +42 -42
- package/fesm2022/tabs.mjs.map +1 -1
- package/fesm2022/toolbar.mjs +10 -10
- package/fesm2022/toolbar.mjs.map +1 -1
- package/fesm2022/tooltip.mjs +10 -10
- package/fesm2022/tooltip.mjs.map +1 -1
- package/fesm2022/tree.mjs +26 -26
- package/fesm2022/tree.mjs.map +1 -1
- package/form-field/_form-field-theme.scss +11 -1
- package/package.json +2 -2
- package/paginator/index.d.ts +4 -5
- package/prebuilt-themes/deeppurple-amber.css +1 -1
- package/prebuilt-themes/indigo-pink.css +1 -1
- package/prebuilt-themes/pink-bluegrey.css +1 -1
- package/prebuilt-themes/purple-green.css +1 -1
- package/schematics/ng-add/index.js +1 -1
- package/schematics/ng-add/index.mjs +1 -1
- package/schematics/ng-generate/mdc-migration/index_bundled.js +1227 -499
- package/schematics/ng-generate/mdc-migration/index_bundled.js.map +4 -4
- package/schematics/ng-update/index_bundled.js +328 -26
- package/schematics/ng-update/index_bundled.js.map +4 -4
- package/sidenav/index.d.ts +3 -4
- package/slide-toggle/index.d.ts +1 -2
- package/slider/index.d.ts +1 -2
- package/sort/_sort-theme.scss +21 -23
- package/sort/index.d.ts +2 -3
- package/tree/_tree-theme.scss +13 -26
- package/tree/_tree-variables.scss +0 -14
package/_index.scss
CHANGED
|
@@ -47,7 +47,7 @@
|
|
|
47
47
|
@forward './core/style/elevation' show elevation, overridable-elevation, elevation-transition;
|
|
48
48
|
|
|
49
49
|
// Theme bundles
|
|
50
|
-
@forward './core/theming/all-theme' show all-component-themes;
|
|
50
|
+
@forward './core/theming/all-theme' show all-component-themes, all-component-bases;
|
|
51
51
|
@forward './core/color/all-color' show all-component-colors;
|
|
52
52
|
@forward './core/typography/all-typography' show all-component-typographies;
|
|
53
53
|
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
@use 'sass:math';
|
|
2
2
|
@use '@material/density/functions' as mdc-density-functions;
|
|
3
3
|
@use '@material/icon-button/icon-button-theme' as mdc-icon-button-theme;
|
|
4
|
-
@use '@material/theme/theme-color' as mdc-theme-color;
|
|
5
4
|
@use '../core/tokens/m2/mdc/icon-button' as tokens-mdc-icon-button;
|
|
6
5
|
|
|
7
6
|
@use './button-theme-private';
|
|
@@ -10,64 +9,46 @@
|
|
|
10
9
|
|
|
11
10
|
$_icon-size: 24px;
|
|
12
11
|
|
|
12
|
+
// TODO(crisbeto): move these into tokens
|
|
13
13
|
@mixin _ripple-color($color) {
|
|
14
14
|
--mat-mdc-button-persistent-ripple-color: #{$color};
|
|
15
15
|
--mat-mdc-button-ripple-color: #{rgba($color, 0.1)};
|
|
16
16
|
}
|
|
17
17
|
|
|
18
|
-
@function _variable-safe-contrast-tone($value, $is-dark) {
|
|
19
|
-
@if ($value == 'dark' or $value == 'light' or type-of($value) == 'color') {
|
|
20
|
-
@return mdc-theme-color.contrast-tone($value);
|
|
21
|
-
}
|
|
22
|
-
|
|
23
|
-
@return if($is-dark, 'light', 'dark');
|
|
24
|
-
}
|
|
25
|
-
|
|
26
18
|
@mixin base($theme) {
|
|
27
19
|
// TODO(mmalerba): Move icon button base tokens here
|
|
28
20
|
}
|
|
29
21
|
|
|
30
22
|
@mixin color($theme) {
|
|
31
23
|
$color-tokens: tokens-mdc-icon-button.get-color-tokens($theme);
|
|
32
|
-
$surface: inspection.get-theme-color($theme, background, card);
|
|
33
24
|
$is-dark: inspection.get-theme-type($theme) == dark;
|
|
34
|
-
$on-surface: if(_variable-safe-contrast-tone($surface, $is-dark) == 'dark', #000, #fff);
|
|
35
25
|
|
|
36
26
|
.mat-mdc-icon-button {
|
|
37
27
|
@include button-theme-private.ripple-theme-styles($theme, false);
|
|
38
28
|
@include mdc-icon-button-theme.theme($color-tokens);
|
|
39
|
-
@include _ripple-color($
|
|
29
|
+
@include _ripple-color(if($is-dark, #fff, #000));
|
|
40
30
|
|
|
41
31
|
&.mat-primary {
|
|
42
|
-
|
|
43
|
-
@include mdc-icon-button-theme.theme(
|
|
44
|
-
|
|
32
|
+
@include _ripple-color(inspection.get-theme-color($theme, primary));
|
|
33
|
+
@include mdc-icon-button-theme.theme(
|
|
34
|
+
tokens-mdc-icon-button.private-get-color-palette-color-tokens($theme, primary));
|
|
45
35
|
}
|
|
46
36
|
|
|
47
37
|
&.mat-accent {
|
|
48
|
-
|
|
49
|
-
@include mdc-icon-button-theme.theme(
|
|
50
|
-
|
|
38
|
+
@include _ripple-color(inspection.get-theme-color($theme, accent));
|
|
39
|
+
@include mdc-icon-button-theme.theme(
|
|
40
|
+
tokens-mdc-icon-button.private-get-color-palette-color-tokens($theme, accent));
|
|
51
41
|
}
|
|
52
42
|
|
|
53
43
|
&.mat-warn {
|
|
54
|
-
|
|
55
|
-
@include mdc-icon-button-theme.theme(
|
|
56
|
-
|
|
57
|
-
}
|
|
58
|
-
|
|
59
|
-
@include button-theme-private.apply-disabled-style() {
|
|
60
|
-
$disabled-color: rgba($on-surface, if($is-dark, 0.5, 0.38));
|
|
61
|
-
@include mdc-icon-button-theme.theme((
|
|
62
|
-
icon-color: $disabled-color,
|
|
63
|
-
disabled-icon-color: $disabled-color,
|
|
64
|
-
));
|
|
44
|
+
@include _ripple-color(inspection.get-theme-color($theme, warn));
|
|
45
|
+
@include mdc-icon-button-theme.theme(
|
|
46
|
+
tokens-mdc-icon-button.private-get-color-palette-color-tokens($theme, warn));
|
|
65
47
|
}
|
|
66
48
|
}
|
|
67
49
|
}
|
|
68
50
|
|
|
69
|
-
@mixin typography($theme) {
|
|
70
|
-
}
|
|
51
|
+
@mixin typography($theme) {}
|
|
71
52
|
|
|
72
53
|
@mixin density($theme) {
|
|
73
54
|
$density-scale: inspection.get-theme-density($theme);
|
package/button/index.d.ts
CHANGED
|
@@ -124,8 +124,6 @@ declare class MatButtonBase implements AfterViewInit, OnDestroy {
|
|
|
124
124
|
ngOnDestroy(): void;
|
|
125
125
|
/** Focuses the button. */
|
|
126
126
|
focus(_origin?: FocusOrigin, options?: FocusOptions): void;
|
|
127
|
-
/** Gets whether the button has one of the given attributes. */
|
|
128
|
-
private _hasHostAttributes;
|
|
129
127
|
private _updateRippleDisabled;
|
|
130
128
|
static ɵfac: i0.ɵɵFactoryDeclaration<MatButtonBase, never>;
|
|
131
129
|
static ɵdir: i0.ɵɵDirectiveDeclaration<MatButtonBase, never, never, { "color": { "alias": "color"; "required": false; }; "disableRipple": { "alias": "disableRipple"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; }, {}, never, never, false, never>;
|
package/chips/index.d.ts
CHANGED
|
@@ -20,7 +20,6 @@ import { FormGroupDirective } from '@angular/forms';
|
|
|
20
20
|
import { HasTabIndex } from '@angular/material/core';
|
|
21
21
|
import * as i0 from '@angular/core';
|
|
22
22
|
import * as i11 from '@angular/material/core';
|
|
23
|
-
import * as i12 from '@angular/common';
|
|
24
23
|
import { InjectionToken } from '@angular/core';
|
|
25
24
|
import { MatFormField } from '@angular/material/form-field';
|
|
26
25
|
import { MatFormFieldControl } from '@angular/material/form-field';
|
|
@@ -881,7 +880,7 @@ export declare class MatChipRow extends MatChip implements AfterViewInit {
|
|
|
881
880
|
*/
|
|
882
881
|
private _getEditInput;
|
|
883
882
|
static ɵfac: i0.ɵɵFactoryDeclaration<MatChipRow, [null, null, null, null, null, { optional: true; }, { optional: true; }, { attribute: "tabindex"; }]>;
|
|
884
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<MatChipRow, "mat-chip-row, [mat-chip-row], mat-basic-chip-row, [mat-basic-chip-row]", never, { "color": { "alias": "color"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "disableRipple": { "alias": "disableRipple"; "required": false; }; "tabIndex": { "alias": "tabIndex"; "required": false; }; "editable": { "alias": "editable"; "required": false; }; }, { "edited": "edited"; }, ["contentEditInput"], ["mat-chip-avatar, [matChipAvatar]", "
|
|
883
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<MatChipRow, "mat-chip-row, [mat-chip-row], mat-basic-chip-row, [mat-basic-chip-row]", never, { "color": { "alias": "color"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "disableRipple": { "alias": "disableRipple"; "required": false; }; "tabIndex": { "alias": "tabIndex"; "required": false; }; "editable": { "alias": "editable"; "required": false; }; }, { "edited": "edited"; }, ["contentEditInput"], ["mat-chip-avatar, [matChipAvatar]", "[matChipEditInput]", "*", "mat-chip-trailing-icon,[matChipRemove],[matChipTrailingIcon]"], false, never>;
|
|
885
884
|
}
|
|
886
885
|
|
|
887
886
|
/** Default options, for the chips module, that can be overridden. */
|
|
@@ -1010,7 +1009,7 @@ declare const _MatChipSetMixinBase: _Constructor<HasTabIndex> & _AbstractConstru
|
|
|
1010
1009
|
|
|
1011
1010
|
export declare class MatChipsModule {
|
|
1012
1011
|
static ɵfac: i0.ɵɵFactoryDeclaration<MatChipsModule, never>;
|
|
1013
|
-
static ɵmod: i0.ɵɵNgModuleDeclaration<MatChipsModule, [typeof i1.MatChipAction, typeof i2.MatChip, typeof i3.MatChipAvatar, typeof i4.MatChipEditInput, typeof i5.MatChipGrid, typeof i6.MatChipInput, typeof i7.MatChipListbox, typeof i8.MatChipOption, typeof i3.MatChipRemove, typeof i9.MatChipRow, typeof i10.MatChipSet, typeof i3.MatChipTrailingIcon], [typeof i11.MatCommonModule, typeof
|
|
1012
|
+
static ɵmod: i0.ɵɵNgModuleDeclaration<MatChipsModule, [typeof i1.MatChipAction, typeof i2.MatChip, typeof i3.MatChipAvatar, typeof i4.MatChipEditInput, typeof i5.MatChipGrid, typeof i6.MatChipInput, typeof i7.MatChipListbox, typeof i8.MatChipOption, typeof i3.MatChipRemove, typeof i9.MatChipRow, typeof i10.MatChipSet, typeof i3.MatChipTrailingIcon], [typeof i11.MatCommonModule, typeof i11.MatRippleModule], [typeof i11.MatCommonModule, typeof i2.MatChip, typeof i3.MatChipAvatar, typeof i4.MatChipEditInput, typeof i5.MatChipGrid, typeof i6.MatChipInput, typeof i7.MatChipListbox, typeof i8.MatChipOption, typeof i3.MatChipRemove, typeof i9.MatChipRow, typeof i10.MatChipSet, typeof i3.MatChipTrailingIcon]>;
|
|
1014
1013
|
static ɵinj: i0.ɵɵInjectorDeclaration<MatChipsModule>;
|
|
1015
1014
|
}
|
|
1016
1015
|
|
package/core/index.d.ts
CHANGED
|
@@ -9,7 +9,6 @@ import { FormGroupDirective } from '@angular/forms';
|
|
|
9
9
|
import { HighContrastModeDetector } from '@angular/cdk/a11y';
|
|
10
10
|
import * as i0 from '@angular/core';
|
|
11
11
|
import * as i1 from '@angular/cdk/bidi';
|
|
12
|
-
import * as i4 from '@angular/common';
|
|
13
12
|
import { InjectionToken } from '@angular/core';
|
|
14
13
|
import { NgControl } from '@angular/forms';
|
|
15
14
|
import { NgForm } from '@angular/forms';
|
|
@@ -432,7 +431,7 @@ declare namespace i3 {
|
|
|
432
431
|
}
|
|
433
432
|
}
|
|
434
433
|
|
|
435
|
-
declare namespace
|
|
434
|
+
declare namespace i5 {
|
|
436
435
|
export {
|
|
437
436
|
MatPseudoCheckboxModule
|
|
438
437
|
}
|
|
@@ -629,7 +628,7 @@ export declare class MatOption<T = any> implements FocusableOption, AfterViewChe
|
|
|
629
628
|
|
|
630
629
|
export declare class MatOptionModule {
|
|
631
630
|
static ɵfac: i0.ɵɵFactoryDeclaration<MatOptionModule, never>;
|
|
632
|
-
static ɵmod: i0.ɵɵNgModuleDeclaration<MatOptionModule, [typeof i1_3.MatOption, typeof i2.MatOptgroup], [typeof i3.MatRippleModule, typeof
|
|
631
|
+
static ɵmod: i0.ɵɵNgModuleDeclaration<MatOptionModule, [typeof i1_3.MatOption, typeof i2.MatOptgroup], [typeof i3.MatRippleModule, typeof i1_2.MatCommonModule, typeof i5.MatPseudoCheckboxModule], [typeof i1_3.MatOption, typeof i2.MatOptgroup]>;
|
|
633
632
|
static ɵinj: i0.ɵɵInjectorDeclaration<MatOptionModule>;
|
|
634
633
|
}
|
|
635
634
|
|
|
@@ -0,0 +1,60 @@
|
|
|
1
|
+
@use 'sass:color';
|
|
2
|
+
@use 'sass:meta';
|
|
3
|
+
@use '../../token-utils';
|
|
4
|
+
@use '../../../theming/inspection';
|
|
5
|
+
@use '../../../style/sass-utils';
|
|
6
|
+
|
|
7
|
+
// The prefix used to generate the fully qualified name for tokens in this file.
|
|
8
|
+
$prefix: (mat, sort);
|
|
9
|
+
|
|
10
|
+
// Tokens that can't be configured through Angular Material's current theming API,
|
|
11
|
+
// but may be in a future version of the theming API.
|
|
12
|
+
@function get-unthemable-tokens() {
|
|
13
|
+
@return ();
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
// Tokens that can be configured through Angular Material's color theming API.
|
|
17
|
+
@function get-color-tokens($theme) {
|
|
18
|
+
$table-background: inspection.get-theme-color($theme, background, card);
|
|
19
|
+
$text-color: inspection.get-theme-color($theme, foreground, secondary-text);
|
|
20
|
+
$arrow-color: null;
|
|
21
|
+
|
|
22
|
+
// Because the arrow is made up of multiple elements that are stacked on top of each other,
|
|
23
|
+
// we can't use the semi-transparent color from the theme directly. If the value is a color
|
|
24
|
+
// *type*, we convert it into a solid color by taking the opacity from the rgba value and
|
|
25
|
+
// using the value to determine the percentage of the background to put into foreground
|
|
26
|
+
// when mixing the colors together. Otherwise, if it resolves to something different
|
|
27
|
+
// (e.g. it resolves to a CSS variable), we use the color directly.
|
|
28
|
+
@if (meta.type-of($table-background) == color and meta.type-of($text-color) == color) {
|
|
29
|
+
$text-opacity: opacity($text-color);
|
|
30
|
+
$arrow-color: color.mix($table-background, rgba($text-color, 1), (1 - $text-opacity) * 100%);
|
|
31
|
+
}
|
|
32
|
+
@else {
|
|
33
|
+
$arrow-color: $text-color;
|
|
34
|
+
}
|
|
35
|
+
|
|
36
|
+
@return (
|
|
37
|
+
arrow-color: $arrow-color,
|
|
38
|
+
);
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
// Tokens that can be configured through Angular Material's typography theming API.
|
|
42
|
+
@function get-typography-tokens($theme) {
|
|
43
|
+
@return ();
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
// Tokens that can be configured through Angular Material's density theming API.
|
|
47
|
+
@function get-density-tokens($theme) {
|
|
48
|
+
@return ();
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
// Combines the tokens generated by the above functions into a single map with placeholder values.
|
|
52
|
+
// This is used to create token slots.
|
|
53
|
+
@function get-token-slots() {
|
|
54
|
+
@return sass-utils.deep-merge-all(
|
|
55
|
+
get-unthemable-tokens(),
|
|
56
|
+
get-color-tokens(token-utils.$placeholder-color-config),
|
|
57
|
+
get-typography-tokens(token-utils.$placeholder-typography-config),
|
|
58
|
+
get-density-tokens(token-utils.$placeholder-density-config)
|
|
59
|
+
);
|
|
60
|
+
}
|
|
@@ -0,0 +1,62 @@
|
|
|
1
|
+
@use 'sass:map';
|
|
2
|
+
@use '../../token-utils';
|
|
3
|
+
@use '../../../theming/theming';
|
|
4
|
+
@use '../../../theming/inspection';
|
|
5
|
+
@use '../../../style/sass-utils';
|
|
6
|
+
|
|
7
|
+
// The prefix used to generate the fully qualified name for tokens in this file.
|
|
8
|
+
$prefix: (mat, tree);
|
|
9
|
+
|
|
10
|
+
// Tokens that can't be configured through Angular Material's current theming API,
|
|
11
|
+
// but may be in a future version of the theming API.
|
|
12
|
+
@function get-unthemable-tokens() {
|
|
13
|
+
@return ();
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
// Tokens that can be configured through Angular Material's color theming API.
|
|
17
|
+
@function get-color-tokens($theme) {
|
|
18
|
+
$foreground-base: inspection.get-theme-color($theme, foreground, base);
|
|
19
|
+
|
|
20
|
+
@return (
|
|
21
|
+
container-background-color: inspection.get-theme-color($theme, background, card),
|
|
22
|
+
node-text-color: inspection.get-theme-color($theme, foreground, text),
|
|
23
|
+
);
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
// Tokens that can be configured through Angular Material's typography theming API.
|
|
27
|
+
@function get-typography-tokens($theme) {
|
|
28
|
+
@return (
|
|
29
|
+
node-text-font: inspection.get-theme-typography($theme, body-2, font-family),
|
|
30
|
+
node-text-size: inspection.get-theme-typography($theme, body-2, font-size),
|
|
31
|
+
node-text-weight: inspection.get-theme-typography($theme, body-2, font-weight),
|
|
32
|
+
|
|
33
|
+
// TODO(crisbeto): provide tokens for line height and letter spacing to match other components.
|
|
34
|
+
);
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
// Tokens that can be configured through Angular Material's density theming API.
|
|
38
|
+
@function get-density-tokens($theme) {
|
|
39
|
+
$density-scale: theming.clamp-density(inspection.get-theme-density($theme), -4);
|
|
40
|
+
$min-height-scale: (
|
|
41
|
+
0: 48px,
|
|
42
|
+
-1: 44px,
|
|
43
|
+
-2: 40px,
|
|
44
|
+
-3: 36px,
|
|
45
|
+
-4: 28px,
|
|
46
|
+
);
|
|
47
|
+
|
|
48
|
+
@return (
|
|
49
|
+
node-min-height: map.get($min-height-scale, $density-scale)
|
|
50
|
+
);
|
|
51
|
+
}
|
|
52
|
+
|
|
53
|
+
// Combines the tokens generated by the above functions into a single map with placeholder values.
|
|
54
|
+
// This is used to create token slots.
|
|
55
|
+
@function get-token-slots() {
|
|
56
|
+
@return sass-utils.deep-merge-all(
|
|
57
|
+
get-unthemable-tokens(),
|
|
58
|
+
get-color-tokens(token-utils.$placeholder-color-config),
|
|
59
|
+
get-typography-tokens(token-utils.$placeholder-typography-config),
|
|
60
|
+
get-density-tokens(token-utils.$placeholder-density-config)
|
|
61
|
+
);
|
|
62
|
+
}
|
|
@@ -1,4 +1,6 @@
|
|
|
1
|
+
@use 'sass:map';
|
|
1
2
|
@use '../../../style/sass-utils';
|
|
3
|
+
@use '../../../theming/inspection';
|
|
2
4
|
@use '../../token-utils';
|
|
3
5
|
|
|
4
6
|
// The prefix used to generate the fully qualified name for tokens in this file.
|
|
@@ -20,12 +22,7 @@ $prefix: (mdc, icon-button);
|
|
|
20
22
|
state-layer-size: 48px,
|
|
21
23
|
// MDC's icon size applied to svg and img elements inside the component
|
|
22
24
|
icon-size: 24px,
|
|
23
|
-
|
|
24
|
-
// wouldn't work on <a> tags.
|
|
25
|
-
disabled-icon-color: black,
|
|
26
|
-
// Angular version applies an opacity 1 with a color change, and this only applies with
|
|
27
|
-
// :disabled anyways.
|
|
28
|
-
disabled-icon-opacity: 0.38,
|
|
25
|
+
|
|
29
26
|
// =============================================================================================
|
|
30
27
|
// = TOKENS NOT USED IN ANGULAR MATERIAL =
|
|
31
28
|
// =============================================================================================
|
|
@@ -41,13 +38,29 @@ $prefix: (mdc, icon-button);
|
|
|
41
38
|
pressed-state-layer-opacity: null,
|
|
42
39
|
focus-ring-color: null,
|
|
43
40
|
focus-ring-offset: null,
|
|
41
|
+
|
|
42
|
+
// We use a color with an opacity to show the disabled state,
|
|
43
|
+
// instead of applying it to the entire button.
|
|
44
|
+
disabled-icon-opacity: null,
|
|
44
45
|
);
|
|
45
46
|
}
|
|
46
47
|
|
|
47
48
|
// Tokens that can be configured through Angular Material's color theming API.
|
|
48
49
|
@function get-color-tokens($theme) {
|
|
50
|
+
$is-dark: inspection.get-theme-type($theme) == dark;
|
|
51
|
+
|
|
49
52
|
@return (
|
|
50
53
|
icon-color: inherit,
|
|
54
|
+
disabled-icon-color: if($is-dark, rgba(#fff, 0.5), rgba(#000, 0.38)),
|
|
55
|
+
);
|
|
56
|
+
}
|
|
57
|
+
|
|
58
|
+
// Generates the mapping for the properties that change based on the button palette color.
|
|
59
|
+
@function private-get-color-palette-color-tokens($theme, $palette-name) {
|
|
60
|
+
$palette: map.get($theme, $palette-name);
|
|
61
|
+
|
|
62
|
+
@return (
|
|
63
|
+
icon-color: inspection.get-theme-color($theme, $palette-name)
|
|
51
64
|
);
|
|
52
65
|
}
|
|
53
66
|
|
|
@@ -5,7 +5,10 @@
|
|
|
5
5
|
@use '../core/tokens/m2/mat/divider' as tokens-mat-divider;
|
|
6
6
|
|
|
7
7
|
@mixin base($theme) {
|
|
8
|
-
|
|
8
|
+
@include sass-utils.current-selector-or-root() {
|
|
9
|
+
@include token-utils.create-token-values(
|
|
10
|
+
tokens-mat-divider.$prefix, tokens-mat-divider.get-unthemable-tokens());
|
|
11
|
+
}
|
|
9
12
|
}
|
|
10
13
|
|
|
11
14
|
@mixin color($theme) {
|
|
@@ -17,14 +17,14 @@ export class MatAutocompleteOrigin {
|
|
|
17
17
|
elementRef) {
|
|
18
18
|
this.elementRef = elementRef;
|
|
19
19
|
}
|
|
20
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.0-
|
|
21
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.0.0-
|
|
20
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.0-rc.0", ngImport: i0, type: MatAutocompleteOrigin, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
21
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.0.0-rc.0", type: MatAutocompleteOrigin, selector: "[matAutocompleteOrigin]", exportAs: ["matAutocompleteOrigin"], ngImport: i0 }); }
|
|
22
22
|
}
|
|
23
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.0-
|
|
23
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.0-rc.0", ngImport: i0, type: MatAutocompleteOrigin, decorators: [{
|
|
24
24
|
type: Directive,
|
|
25
25
|
args: [{
|
|
26
26
|
selector: '[matAutocompleteOrigin]',
|
|
27
27
|
exportAs: 'matAutocompleteOrigin',
|
|
28
28
|
}]
|
|
29
29
|
}], ctorParameters: () => [{ type: i0.ElementRef }] });
|
|
30
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
30
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYXV0b2NvbXBsZXRlLW9yaWdpbi5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3NyYy9tYXRlcmlhbC9hdXRvY29tcGxldGUvYXV0b2NvbXBsZXRlLW9yaWdpbi50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7Ozs7O0dBTUc7QUFFSCxPQUFPLEVBQUMsU0FBUyxFQUFFLFVBQVUsRUFBQyxNQUFNLGVBQWUsQ0FBQzs7QUFFcEQ7OztHQUdHO0FBS0gsTUFBTSxPQUFPLHFCQUFxQjtJQUNoQztJQUNFLGtFQUFrRTtJQUMzRCxVQUFtQztRQUFuQyxlQUFVLEdBQVYsVUFBVSxDQUF5QjtJQUN6QyxDQUFDO21IQUpPLHFCQUFxQjt1R0FBckIscUJBQXFCOztnR0FBckIscUJBQXFCO2tCQUpqQyxTQUFTO21CQUFDO29CQUNULFFBQVEsRUFBRSx5QkFBeUI7b0JBQ25DLFFBQVEsRUFBRSx1QkFBdUI7aUJBQ2xDIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBAbGljZW5zZVxuICogQ29weXJpZ2h0IEdvb2dsZSBMTEMgQWxsIFJpZ2h0cyBSZXNlcnZlZC5cbiAqXG4gKiBVc2Ugb2YgdGhpcyBzb3VyY2UgY29kZSBpcyBnb3Zlcm5lZCBieSBhbiBNSVQtc3R5bGUgbGljZW5zZSB0aGF0IGNhbiBiZVxuICogZm91bmQgaW4gdGhlIExJQ0VOU0UgZmlsZSBhdCBodHRwczovL2FuZ3VsYXIuaW8vbGljZW5zZVxuICovXG5cbmltcG9ydCB7RGlyZWN0aXZlLCBFbGVtZW50UmVmfSBmcm9tICdAYW5ndWxhci9jb3JlJztcblxuLyoqXG4gKiBEaXJlY3RpdmUgYXBwbGllZCB0byBhbiBlbGVtZW50IHRvIG1ha2UgaXQgdXNhYmxlXG4gKiBhcyBhIGNvbm5lY3Rpb24gcG9pbnQgZm9yIGFuIGF1dG9jb21wbGV0ZSBwYW5lbC5cbiAqL1xuQERpcmVjdGl2ZSh7XG4gIHNlbGVjdG9yOiAnW21hdEF1dG9jb21wbGV0ZU9yaWdpbl0nLFxuICBleHBvcnRBczogJ21hdEF1dG9jb21wbGV0ZU9yaWdpbicsXG59KVxuZXhwb3J0IGNsYXNzIE1hdEF1dG9jb21wbGV0ZU9yaWdpbiB7XG4gIGNvbnN0cnVjdG9yKFxuICAgIC8qKiBSZWZlcmVuY2UgdG8gdGhlIGVsZW1lbnQgb24gd2hpY2ggdGhlIGRpcmVjdGl2ZSBpcyBhcHBsaWVkLiAqL1xuICAgIHB1YmxpYyBlbGVtZW50UmVmOiBFbGVtZW50UmVmPEhUTUxFbGVtZW50PixcbiAgKSB7fVxufVxuIl19
|