@angular/material 18.0.0-next.1 → 18.0.0-next.3
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/button-toggle/index.d.ts +18 -5
- package/checkbox/_checkbox-theme.scss +12 -0
- package/core/tokens/_token-utils.scss +62 -3
- package/esm2022/autocomplete/autocomplete-origin.mjs +3 -3
- package/esm2022/autocomplete/autocomplete-trigger.mjs +3 -3
- package/esm2022/autocomplete/autocomplete.mjs +3 -3
- package/esm2022/autocomplete/module.mjs +4 -4
- package/esm2022/badge/badge-module.mjs +4 -4
- package/esm2022/badge/badge.mjs +6 -6
- package/esm2022/bottom-sheet/bottom-sheet-container.mjs +3 -3
- package/esm2022/bottom-sheet/bottom-sheet-module.mjs +4 -4
- package/esm2022/bottom-sheet/bottom-sheet.mjs +3 -3
- package/esm2022/button/button-base.mjs +6 -6
- package/esm2022/button/button.mjs +6 -6
- package/esm2022/button/fab.mjs +12 -12
- package/esm2022/button/icon-button.mjs +6 -6
- package/esm2022/button/module.mjs +4 -4
- package/esm2022/button-toggle/button-toggle-module.mjs +4 -4
- package/esm2022/button-toggle/button-toggle.mjs +118 -16
- package/esm2022/button-toggle/testing/button-toggle-harness.mjs +8 -4
- package/esm2022/card/card.mjs +42 -42
- package/esm2022/card/module.mjs +4 -4
- package/esm2022/checkbox/checkbox-required-validator.mjs +3 -3
- package/esm2022/checkbox/checkbox.mjs +3 -3
- package/esm2022/checkbox/module.mjs +8 -8
- package/esm2022/chips/chip-action.mjs +3 -3
- package/esm2022/chips/chip-edit-input.mjs +3 -3
- package/esm2022/chips/chip-grid.mjs +3 -3
- package/esm2022/chips/chip-icons.mjs +9 -9
- package/esm2022/chips/chip-input.mjs +3 -3
- package/esm2022/chips/chip-listbox.mjs +3 -3
- package/esm2022/chips/chip-option.mjs +6 -6
- package/esm2022/chips/chip-row.mjs +6 -6
- package/esm2022/chips/chip-set.mjs +3 -3
- package/esm2022/chips/chip.mjs +5 -5
- package/esm2022/chips/module.mjs +4 -4
- package/esm2022/core/common-behaviors/common-module.mjs +4 -4
- package/esm2022/core/datetime/index.mjs +8 -8
- package/esm2022/core/datetime/native-date-adapter.mjs +3 -3
- package/esm2022/core/error/error-options.mjs +6 -6
- package/esm2022/core/internal-form-field/internal-form-field.mjs +3 -3
- package/esm2022/core/line/line.mjs +7 -7
- package/esm2022/core/option/index.mjs +4 -4
- package/esm2022/core/option/optgroup.mjs +3 -3
- package/esm2022/core/option/option.mjs +3 -3
- package/esm2022/core/private/ripple-loader.mjs +3 -3
- package/esm2022/core/ripple/index.mjs +4 -4
- package/esm2022/core/ripple/ripple.mjs +3 -3
- package/esm2022/core/selection/pseudo-checkbox/pseudo-checkbox-module.mjs +4 -4
- package/esm2022/core/selection/pseudo-checkbox/pseudo-checkbox.mjs +3 -3
- package/esm2022/core/version.mjs +1 -1
- package/esm2022/datepicker/calendar-body.mjs +3 -3
- package/esm2022/datepicker/calendar.mjs +6 -6
- package/esm2022/datepicker/date-range-input-parts.mjs +9 -9
- package/esm2022/datepicker/date-range-input.mjs +3 -3
- package/esm2022/datepicker/date-range-picker.mjs +3 -3
- package/esm2022/datepicker/date-range-selection-strategy.mjs +3 -3
- package/esm2022/datepicker/date-selection-model.mjs +9 -9
- package/esm2022/datepicker/datepicker-actions.mjs +9 -9
- package/esm2022/datepicker/datepicker-base.mjs +6 -6
- package/esm2022/datepicker/datepicker-input-base.mjs +3 -3
- package/esm2022/datepicker/datepicker-input.mjs +3 -3
- package/esm2022/datepicker/datepicker-intl.mjs +3 -3
- package/esm2022/datepicker/datepicker-module.mjs +4 -4
- package/esm2022/datepicker/datepicker-toggle.mjs +6 -6
- package/esm2022/datepicker/datepicker.mjs +3 -3
- package/esm2022/datepicker/month-view.mjs +5 -5
- package/esm2022/datepicker/multi-year-view.mjs +3 -3
- package/esm2022/datepicker/year-view.mjs +3 -3
- package/esm2022/dialog/dialog-container.mjs +3 -3
- package/esm2022/dialog/dialog-content-directives.mjs +15 -15
- package/esm2022/dialog/dialog.mjs +3 -3
- package/esm2022/dialog/module.mjs +4 -4
- package/esm2022/divider/divider-module.mjs +4 -4
- package/esm2022/divider/divider.mjs +3 -3
- package/esm2022/expansion/accordion.mjs +3 -3
- package/esm2022/expansion/expansion-module.mjs +4 -4
- package/esm2022/expansion/expansion-panel-content.mjs +3 -3
- package/esm2022/expansion/expansion-panel-header.mjs +9 -9
- package/esm2022/expansion/expansion-panel.mjs +6 -6
- package/esm2022/form-field/directives/error.mjs +3 -3
- package/esm2022/form-field/directives/floating-label.mjs +3 -3
- package/esm2022/form-field/directives/hint.mjs +3 -3
- package/esm2022/form-field/directives/label.mjs +3 -3
- package/esm2022/form-field/directives/line-ripple.mjs +3 -3
- package/esm2022/form-field/directives/notched-outline.mjs +3 -3
- package/esm2022/form-field/directives/prefix.mjs +3 -3
- package/esm2022/form-field/directives/suffix.mjs +3 -3
- package/esm2022/form-field/form-field-control.mjs +3 -3
- package/esm2022/form-field/form-field.mjs +3 -3
- package/esm2022/form-field/module.mjs +4 -4
- package/esm2022/grid-list/grid-list-module.mjs +4 -4
- package/esm2022/grid-list/grid-list.mjs +3 -3
- package/esm2022/grid-list/grid-tile.mjs +15 -15
- package/esm2022/icon/icon-module.mjs +4 -4
- package/esm2022/icon/icon-registry.mjs +3 -3
- package/esm2022/icon/icon.mjs +3 -3
- package/esm2022/icon/testing/fake-icon-registry.mjs +7 -7
- package/esm2022/input/input.mjs +3 -3
- package/esm2022/input/module.mjs +4 -4
- package/esm2022/list/action-list.mjs +3 -3
- package/esm2022/list/list-base.mjs +6 -6
- package/esm2022/list/list-item-sections.mjs +18 -18
- package/esm2022/list/list-module.mjs +4 -4
- package/esm2022/list/list-option.mjs +3 -3
- package/esm2022/list/list.mjs +6 -6
- package/esm2022/list/nav-list.mjs +3 -3
- package/esm2022/list/selection-list.mjs +3 -3
- package/esm2022/list/subheader.mjs +3 -3
- package/esm2022/menu/menu-content.mjs +3 -3
- package/esm2022/menu/menu-item.mjs +3 -3
- package/esm2022/menu/menu-trigger.mjs +3 -3
- package/esm2022/menu/menu.mjs +18 -13
- package/esm2022/menu/module.mjs +4 -4
- package/esm2022/paginator/module.mjs +4 -4
- package/esm2022/paginator/paginator-intl.mjs +3 -3
- package/esm2022/paginator/paginator.mjs +3 -3
- package/esm2022/progress-bar/module.mjs +4 -4
- package/esm2022/progress-bar/progress-bar.mjs +3 -3
- package/esm2022/progress-spinner/module.mjs +4 -4
- package/esm2022/progress-spinner/progress-spinner.mjs +3 -3
- package/esm2022/radio/module.mjs +4 -4
- package/esm2022/radio/radio.mjs +6 -6
- package/esm2022/select/module.mjs +4 -4
- package/esm2022/select/select.mjs +6 -6
- package/esm2022/sidenav/drawer.mjs +9 -9
- package/esm2022/sidenav/sidenav-module.mjs +4 -4
- package/esm2022/sidenav/sidenav.mjs +9 -9
- package/esm2022/slide-toggle/module.mjs +8 -8
- package/esm2022/slide-toggle/slide-toggle-required-validator.mjs +3 -3
- package/esm2022/slide-toggle/slide-toggle.mjs +3 -3
- package/esm2022/slider/module.mjs +4 -4
- package/esm2022/slider/slider-input.mjs +6 -6
- package/esm2022/slider/slider-thumb.mjs +3 -3
- package/esm2022/slider/slider.mjs +3 -3
- package/esm2022/snack-bar/module.mjs +4 -4
- package/esm2022/snack-bar/simple-snack-bar.mjs +3 -3
- package/esm2022/snack-bar/snack-bar-container.mjs +3 -3
- package/esm2022/snack-bar/snack-bar-content.mjs +9 -9
- package/esm2022/snack-bar/snack-bar.mjs +3 -3
- package/esm2022/sort/sort-header-intl.mjs +3 -3
- package/esm2022/sort/sort-header.mjs +7 -4
- package/esm2022/sort/sort-module.mjs +4 -4
- package/esm2022/sort/sort.mjs +3 -3
- package/esm2022/stepper/step-content.mjs +3 -3
- package/esm2022/stepper/step-header.mjs +3 -3
- package/esm2022/stepper/step-label.mjs +3 -3
- package/esm2022/stepper/stepper-button.mjs +6 -6
- package/esm2022/stepper/stepper-icon.mjs +3 -3
- package/esm2022/stepper/stepper-intl.mjs +3 -3
- package/esm2022/stepper/stepper-module.mjs +4 -4
- package/esm2022/stepper/stepper.mjs +6 -6
- package/esm2022/table/cell.mjs +21 -21
- package/esm2022/table/module.mjs +4 -4
- package/esm2022/table/row.mjs +21 -21
- package/esm2022/table/table.mjs +6 -6
- package/esm2022/table/text-column.mjs +3 -3
- package/esm2022/tabs/ink-bar.mjs +3 -3
- package/esm2022/tabs/module.mjs +4 -4
- package/esm2022/tabs/paginated-tab-header.mjs +27 -16
- package/esm2022/tabs/tab-body.mjs +6 -6
- package/esm2022/tabs/tab-content.mjs +3 -3
- package/esm2022/tabs/tab-group.mjs +3 -3
- package/esm2022/tabs/tab-header.mjs +3 -3
- package/esm2022/tabs/tab-label-wrapper.mjs +3 -3
- package/esm2022/tabs/tab-label.mjs +3 -3
- package/esm2022/tabs/tab-nav-bar/tab-nav-bar.mjs +9 -9
- package/esm2022/tabs/tab.mjs +3 -3
- package/esm2022/toolbar/toolbar-module.mjs +4 -4
- package/esm2022/toolbar/toolbar.mjs +6 -6
- package/esm2022/tooltip/module.mjs +4 -4
- package/esm2022/tooltip/tooltip.mjs +6 -6
- package/esm2022/tree/node.mjs +9 -9
- package/esm2022/tree/outlet.mjs +3 -3
- package/esm2022/tree/padding.mjs +3 -3
- package/esm2022/tree/toggle.mjs +3 -3
- package/esm2022/tree/tree-module.mjs +4 -4
- package/esm2022/tree/tree.mjs +3 -3
- package/fesm2022/autocomplete.mjs +13 -13
- package/fesm2022/badge.mjs +10 -10
- package/fesm2022/bottom-sheet.mjs +10 -10
- package/fesm2022/button-toggle/testing.mjs +7 -3
- package/fesm2022/button-toggle/testing.mjs.map +1 -1
- package/fesm2022/button-toggle.mjs +120 -19
- package/fesm2022/button-toggle.mjs.map +1 -1
- package/fesm2022/button.mjs +34 -34
- package/fesm2022/card.mjs +46 -46
- package/fesm2022/checkbox.mjs +14 -14
- package/fesm2022/chips.mjs +45 -45
- package/fesm2022/chips.mjs.map +1 -1
- package/fesm2022/core.mjs +59 -59
- package/fesm2022/core.mjs.map +1 -1
- package/fesm2022/datepicker.mjs +83 -83
- package/fesm2022/datepicker.mjs.map +1 -1
- package/fesm2022/dialog.mjs +25 -25
- package/fesm2022/divider.mjs +7 -7
- package/fesm2022/expansion.mjs +25 -25
- package/fesm2022/form-field.mjs +34 -34
- package/fesm2022/grid-list.mjs +22 -22
- package/fesm2022/icon/testing.mjs +7 -7
- package/fesm2022/icon.mjs +10 -10
- package/fesm2022/input.mjs +7 -7
- package/fesm2022/list.mjs +49 -49
- package/fesm2022/menu.mjs +30 -25
- package/fesm2022/menu.mjs.map +1 -1
- package/fesm2022/paginator.mjs +10 -10
- package/fesm2022/progress-bar.mjs +7 -7
- package/fesm2022/progress-spinner.mjs +7 -7
- package/fesm2022/radio.mjs +10 -10
- package/fesm2022/select.mjs +10 -10
- package/fesm2022/sidenav.mjs +22 -22
- package/fesm2022/slide-toggle.mjs +14 -14
- package/fesm2022/slider.mjs +16 -16
- package/fesm2022/snack-bar.mjs +22 -22
- package/fesm2022/sort.mjs +16 -13
- package/fesm2022/sort.mjs.map +1 -1
- package/fesm2022/stepper.mjs +31 -31
- package/fesm2022/table.mjs +55 -55
- package/fesm2022/tabs.mjs +62 -51
- package/fesm2022/tabs.mjs.map +1 -1
- package/fesm2022/toolbar.mjs +10 -10
- package/fesm2022/tooltip.mjs +10 -10
- package/fesm2022/tree.mjs +25 -25
- package/menu/index.d.ts +2 -2
- package/package.json +14 -2
- package/prebuilt-themes/azure-blue.css +1 -0
- package/prebuilt-themes/cyan-orange.css +1 -0
- package/prebuilt-themes/magenta-violet.css +1 -0
- package/prebuilt-themes/rose-red.css +1 -0
- package/schematics/ng-add/index.js +1 -1
- package/schematics/ng-add/index.mjs +1 -1
- package/schematics/ng-add/schema.d.ts +1 -1
- package/schematics/ng-add/schema.js +1 -1
- package/schematics/ng-add/schema.json +9 -9
- package/schematics/ng-add/schema.mjs +1 -1
- package/schematics/ng-add/theming/create-custom-theme.js +19 -19
- package/schematics/ng-add/theming/create-custom-theme.mjs +19 -19
- package/schematics/ng-add/theming/theming.js +2 -2
- package/schematics/ng-add/theming/theming.mjs +2 -2
- package/schematics/ng-generate/mdc-migration/index_bundled.js +52 -46
- package/schematics/ng-generate/mdc-migration/index_bundled.js.map +2 -2
- package/schematics/ng-update/index_bundled.js +25 -25
- package/tabs/index.d.ts +1 -0
package/fesm2022/badge.mjs
CHANGED
|
@@ -14,10 +14,10 @@ const badgeApps = new Set();
|
|
|
14
14
|
* @docs-private
|
|
15
15
|
*/
|
|
16
16
|
class _MatBadgeStyleLoader {
|
|
17
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.
|
|
18
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.
|
|
17
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.1", ngImport: i0, type: _MatBadgeStyleLoader, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
18
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.1", type: _MatBadgeStyleLoader, isStandalone: true, selector: "ng-component", ngImport: i0, template: '', isInline: true, styles: [".mat-badge{position:relative}.mat-badge.mat-badge{overflow:visible}.mat-badge-content{position:absolute;text-align:center;display:inline-block;transition:transform 200ms ease-in-out;transform:scale(0.6);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;box-sizing:border-box;pointer-events:none;background-color:var(--mat-badge-background-color);color:var(--mat-badge-text-color);font-family:var(--mat-badge-text-font);font-weight:var(--mat-badge-text-weight);border-radius:var(--mat-badge-container-shape)}.cdk-high-contrast-active .mat-badge-content{outline:solid 1px;border-radius:0}.mat-badge-above .mat-badge-content{bottom:100%}.mat-badge-below .mat-badge-content{top:100%}.mat-badge-before .mat-badge-content{right:100%}[dir=rtl] .mat-badge-before .mat-badge-content{right:auto;left:100%}.mat-badge-after .mat-badge-content{left:100%}[dir=rtl] .mat-badge-after .mat-badge-content{left:auto;right:100%}.mat-badge-disabled .mat-badge-content{background-color:var(--mat-badge-disabled-state-background-color);color:var(--mat-badge-disabled-state-text-color)}.mat-badge-hidden .mat-badge-content{display:none}.ng-animate-disabled .mat-badge-content,.mat-badge-content._mat-animation-noopable{transition:none}.mat-badge-content.mat-badge-active{transform:none}.mat-badge-small .mat-badge-content{width:var(--mat-badge-legacy-small-size-container-size, unset);height:var(--mat-badge-legacy-small-size-container-size, unset);min-width:var(--mat-badge-small-size-container-size, unset);min-height:var(--mat-badge-small-size-container-size, unset);line-height:var(--mat-badge-legacy-small-size-container-size, var(--mat-badge-small-size-container-size));padding:var(--mat-badge-small-size-container-padding);font-size:var(--mat-badge-small-size-text-size);margin:var(--mat-badge-small-size-container-offset)}.mat-badge-small.mat-badge-overlap .mat-badge-content{margin:var(--mat-badge-small-size-container-overlap-offset)}.mat-badge-medium .mat-badge-content{width:var(--mat-badge-legacy-container-size, unset);height:var(--mat-badge-legacy-container-size, unset);min-width:var(--mat-badge-container-size, unset);min-height:var(--mat-badge-container-size, unset);line-height:var(--mat-badge-legacy-container-size, var(--mat-badge-container-size));padding:var(--mat-badge-container-padding);font-size:var(--mat-badge-text-size);margin:var(--mat-badge-container-offset)}.mat-badge-medium.mat-badge-overlap .mat-badge-content{margin:var(--mat-badge-container-overlap-offset)}.mat-badge-large .mat-badge-content{width:var(--mat-badge-legacy-large-size-container-size, unset);height:var(--mat-badge-legacy-large-size-container-size, unset);min-width:var(--mat-badge-large-size-container-size, unset);min-height:var(--mat-badge-large-size-container-size, unset);line-height:var(--mat-badge-legacy-large-size-container-size, var(--mat-badge-large-size-container-size));padding:var(--mat-badge-large-size-container-padding);font-size:var(--mat-badge-large-size-text-size);margin:var(--mat-badge-large-size-container-offset)}.mat-badge-large.mat-badge-overlap .mat-badge-content{margin:var(--mat-badge-large-size-container-overlap-offset)}"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
19
19
|
}
|
|
20
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.
|
|
20
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.1", ngImport: i0, type: _MatBadgeStyleLoader, decorators: [{
|
|
21
21
|
type: Component,
|
|
22
22
|
args: [{ standalone: true, encapsulation: ViewEncapsulation.None, template: '', changeDetection: ChangeDetectionStrategy.OnPush, styles: [".mat-badge{position:relative}.mat-badge.mat-badge{overflow:visible}.mat-badge-content{position:absolute;text-align:center;display:inline-block;transition:transform 200ms ease-in-out;transform:scale(0.6);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;box-sizing:border-box;pointer-events:none;background-color:var(--mat-badge-background-color);color:var(--mat-badge-text-color);font-family:var(--mat-badge-text-font);font-weight:var(--mat-badge-text-weight);border-radius:var(--mat-badge-container-shape)}.cdk-high-contrast-active .mat-badge-content{outline:solid 1px;border-radius:0}.mat-badge-above .mat-badge-content{bottom:100%}.mat-badge-below .mat-badge-content{top:100%}.mat-badge-before .mat-badge-content{right:100%}[dir=rtl] .mat-badge-before .mat-badge-content{right:auto;left:100%}.mat-badge-after .mat-badge-content{left:100%}[dir=rtl] .mat-badge-after .mat-badge-content{left:auto;right:100%}.mat-badge-disabled .mat-badge-content{background-color:var(--mat-badge-disabled-state-background-color);color:var(--mat-badge-disabled-state-text-color)}.mat-badge-hidden .mat-badge-content{display:none}.ng-animate-disabled .mat-badge-content,.mat-badge-content._mat-animation-noopable{transition:none}.mat-badge-content.mat-badge-active{transform:none}.mat-badge-small .mat-badge-content{width:var(--mat-badge-legacy-small-size-container-size, unset);height:var(--mat-badge-legacy-small-size-container-size, unset);min-width:var(--mat-badge-small-size-container-size, unset);min-height:var(--mat-badge-small-size-container-size, unset);line-height:var(--mat-badge-legacy-small-size-container-size, var(--mat-badge-small-size-container-size));padding:var(--mat-badge-small-size-container-padding);font-size:var(--mat-badge-small-size-text-size);margin:var(--mat-badge-small-size-container-offset)}.mat-badge-small.mat-badge-overlap .mat-badge-content{margin:var(--mat-badge-small-size-container-overlap-offset)}.mat-badge-medium .mat-badge-content{width:var(--mat-badge-legacy-container-size, unset);height:var(--mat-badge-legacy-container-size, unset);min-width:var(--mat-badge-container-size, unset);min-height:var(--mat-badge-container-size, unset);line-height:var(--mat-badge-legacy-container-size, var(--mat-badge-container-size));padding:var(--mat-badge-container-padding);font-size:var(--mat-badge-text-size);margin:var(--mat-badge-container-offset)}.mat-badge-medium.mat-badge-overlap .mat-badge-content{margin:var(--mat-badge-container-overlap-offset)}.mat-badge-large .mat-badge-content{width:var(--mat-badge-legacy-large-size-container-size, unset);height:var(--mat-badge-legacy-large-size-container-size, unset);min-width:var(--mat-badge-large-size-container-size, unset);min-height:var(--mat-badge-large-size-container-size, unset);line-height:var(--mat-badge-legacy-large-size-container-size, var(--mat-badge-large-size-container-size));padding:var(--mat-badge-large-size-container-padding);font-size:var(--mat-badge-large-size-text-size);margin:var(--mat-badge-large-size-container-offset)}.mat-badge-large.mat-badge-overlap .mat-badge-content{margin:var(--mat-badge-large-size-container-overlap-offset)}"] }]
|
|
23
23
|
}] });
|
|
@@ -235,10 +235,10 @@ class MatBadge {
|
|
|
235
235
|
}
|
|
236
236
|
}
|
|
237
237
|
}
|
|
238
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.
|
|
239
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "18.0.0-next.
|
|
238
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.1", ngImport: i0, type: MatBadge, deps: [{ token: i0.NgZone }, { token: i0.ElementRef }, { token: i1.AriaDescriber }, { token: i0.Renderer2 }, { token: ANIMATION_MODULE_TYPE, optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
239
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "18.0.0-next.1", type: MatBadge, isStandalone: true, selector: "[matBadge]", inputs: { color: ["matBadgeColor", "color"], overlap: ["matBadgeOverlap", "overlap", booleanAttribute], disabled: ["matBadgeDisabled", "disabled", booleanAttribute], position: ["matBadgePosition", "position"], content: ["matBadge", "content"], description: ["matBadgeDescription", "description"], size: ["matBadgeSize", "size"], hidden: ["matBadgeHidden", "hidden", booleanAttribute] }, host: { properties: { "class.mat-badge-overlap": "overlap", "class.mat-badge-above": "isAbove()", "class.mat-badge-below": "!isAbove()", "class.mat-badge-before": "!isAfter()", "class.mat-badge-after": "isAfter()", "class.mat-badge-small": "size === \"small\"", "class.mat-badge-medium": "size === \"medium\"", "class.mat-badge-large": "size === \"large\"", "class.mat-badge-hidden": "hidden || !content", "class.mat-badge-disabled": "disabled" }, classAttribute: "mat-badge" }, ngImport: i0 }); }
|
|
240
240
|
}
|
|
241
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.
|
|
241
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.1", ngImport: i0, type: MatBadge, decorators: [{
|
|
242
242
|
type: Directive,
|
|
243
243
|
args: [{
|
|
244
244
|
selector: '[matBadge]',
|
|
@@ -289,11 +289,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.0",
|
|
|
289
289
|
}] } });
|
|
290
290
|
|
|
291
291
|
class MatBadgeModule {
|
|
292
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.
|
|
293
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.0-next.
|
|
294
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.0-next.
|
|
292
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.1", ngImport: i0, type: MatBadgeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
293
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.0-next.1", ngImport: i0, type: MatBadgeModule, imports: [A11yModule, MatCommonModule, MatBadge, _MatBadgeStyleLoader], exports: [MatBadge, MatCommonModule] }); }
|
|
294
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.0-next.1", ngImport: i0, type: MatBadgeModule, imports: [A11yModule, MatCommonModule, MatCommonModule] }); }
|
|
295
295
|
}
|
|
296
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.
|
|
296
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.1", ngImport: i0, type: MatBadgeModule, decorators: [{
|
|
297
297
|
type: NgModule,
|
|
298
298
|
args: [{
|
|
299
299
|
// Note: we _shouldn't_ have to import `_MatBadgeStyleLoader`,
|
|
@@ -82,10 +82,10 @@ class MatBottomSheetContainer extends CdkDialogContainer {
|
|
|
82
82
|
_toggleClass(cssClass, add) {
|
|
83
83
|
this._elementRef.nativeElement.classList.toggle(cssClass, add);
|
|
84
84
|
}
|
|
85
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.
|
|
86
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.
|
|
85
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.1", ngImport: i0, type: MatBottomSheetContainer, deps: [{ token: i0.ElementRef }, { token: i1.FocusTrapFactory }, { token: DOCUMENT, optional: true }, { token: i2.DialogConfig }, { token: i1.InteractivityChecker }, { token: i0.NgZone }, { token: i3.OverlayRef }, { token: i4.BreakpointObserver }, { token: i1.FocusMonitor }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
86
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.1", type: MatBottomSheetContainer, isStandalone: true, selector: "mat-bottom-sheet-container", host: { attributes: { "tabindex": "-1" }, listeners: { "@state.start": "_onAnimationStart($event)", "@state.done": "_onAnimationDone($event)" }, properties: { "attr.role": "_config.role", "attr.aria-modal": "_config.ariaModal", "attr.aria-label": "_config.ariaLabel", "@state": "_animationState" }, classAttribute: "mat-bottom-sheet-container" }, usesInheritance: true, ngImport: i0, template: "<ng-template cdkPortalOutlet></ng-template>\r\n", styles: [".mat-bottom-sheet-container{box-shadow:0px 8px 10px -5px rgba(0, 0, 0, 0.2), 0px 16px 24px 2px rgba(0, 0, 0, 0.14), 0px 6px 30px 5px rgba(0, 0, 0, 0.12);padding:8px 16px;min-width:100vw;box-sizing:border-box;display:block;outline:0;max-height:80vh;overflow:auto;background:var(--mat-bottom-sheet-container-background-color);color:var(--mat-bottom-sheet-container-text-color);font-family:var(--mat-bottom-sheet-container-text-font);font-size:var(--mat-bottom-sheet-container-text-size);line-height:var(--mat-bottom-sheet-container-text-line-height);font-weight:var(--mat-bottom-sheet-container-text-weight);letter-spacing:var(--mat-bottom-sheet-container-text-tracking)}.cdk-high-contrast-active .mat-bottom-sheet-container{outline:1px solid}.mat-bottom-sheet-container-xlarge,.mat-bottom-sheet-container-large,.mat-bottom-sheet-container-medium{border-top-left-radius:var(--mat-bottom-sheet-container-shape);border-top-right-radius:var(--mat-bottom-sheet-container-shape)}.mat-bottom-sheet-container-medium{min-width:384px;max-width:calc(100vw - 128px)}.mat-bottom-sheet-container-large{min-width:512px;max-width:calc(100vw - 256px)}.mat-bottom-sheet-container-xlarge{min-width:576px;max-width:calc(100vw - 384px)}"], dependencies: [{ kind: "directive", type: CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }], animations: [matBottomSheetAnimations.bottomSheetState], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
|
|
87
87
|
}
|
|
88
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.
|
|
88
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.1", ngImport: i0, type: MatBottomSheetContainer, decorators: [{
|
|
89
89
|
type: Component,
|
|
90
90
|
args: [{ selector: 'mat-bottom-sheet-container', changeDetection: ChangeDetectionStrategy.Default, encapsulation: ViewEncapsulation.None, animations: [matBottomSheetAnimations.bottomSheetState], host: {
|
|
91
91
|
'class': 'mat-bottom-sheet-container',
|
|
@@ -320,10 +320,10 @@ class MatBottomSheet {
|
|
|
320
320
|
this._bottomSheetRefAtThisLevel.dismiss();
|
|
321
321
|
}
|
|
322
322
|
}
|
|
323
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.
|
|
324
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.0.0-next.
|
|
323
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.1", ngImport: i0, type: MatBottomSheet, deps: [{ token: i3.Overlay }, { token: i0.Injector }, { token: MatBottomSheet, optional: true, skipSelf: true }, { token: MAT_BOTTOM_SHEET_DEFAULT_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
324
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.0.0-next.1", ngImport: i0, type: MatBottomSheet, providedIn: 'root' }); }
|
|
325
325
|
}
|
|
326
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.
|
|
326
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.1", ngImport: i0, type: MatBottomSheet, decorators: [{
|
|
327
327
|
type: Injectable,
|
|
328
328
|
args: [{ providedIn: 'root' }]
|
|
329
329
|
}], ctorParameters: () => [{ type: i3.Overlay }, { type: i0.Injector }, { type: MatBottomSheet, decorators: [{
|
|
@@ -338,11 +338,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.0",
|
|
|
338
338
|
}] }] });
|
|
339
339
|
|
|
340
340
|
class MatBottomSheetModule {
|
|
341
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.
|
|
342
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.0-next.
|
|
343
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.0-next.
|
|
341
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.1", ngImport: i0, type: MatBottomSheetModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
342
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.0-next.1", ngImport: i0, type: MatBottomSheetModule, imports: [DialogModule, MatCommonModule, PortalModule, MatBottomSheetContainer], exports: [MatBottomSheetContainer, MatCommonModule] }); }
|
|
343
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.0-next.1", ngImport: i0, type: MatBottomSheetModule, providers: [MatBottomSheet], imports: [DialogModule, MatCommonModule, PortalModule, MatCommonModule] }); }
|
|
344
344
|
}
|
|
345
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.
|
|
345
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.1", ngImport: i0, type: MatBottomSheetModule, decorators: [{
|
|
346
346
|
type: NgModule,
|
|
347
347
|
args: [{
|
|
348
348
|
imports: [DialogModule, MatCommonModule, PortalModule, MatBottomSheetContainer],
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { ComponentHarness, HarnessPredicate } from '@angular/cdk/testing';
|
|
1
|
+
import { ComponentHarness, HarnessPredicate, parallel } from '@angular/cdk/testing';
|
|
2
2
|
import { coerceBooleanProperty } from '@angular/cdk/coercion';
|
|
3
3
|
|
|
4
4
|
/** Harness for interacting with a standard mat-button-toggle in tests. */
|
|
@@ -27,8 +27,12 @@ class MatButtonToggleHarness extends ComponentHarness {
|
|
|
27
27
|
}
|
|
28
28
|
/** Gets a boolean promise indicating if the button toggle is checked. */
|
|
29
29
|
async isChecked() {
|
|
30
|
-
const
|
|
31
|
-
|
|
30
|
+
const button = await this._button();
|
|
31
|
+
const [checked, pressed] = await parallel(() => [
|
|
32
|
+
button.getAttribute('aria-checked'),
|
|
33
|
+
button.getAttribute('aria-pressed'),
|
|
34
|
+
]);
|
|
35
|
+
return coerceBooleanProperty(checked) || coerceBooleanProperty(pressed);
|
|
32
36
|
}
|
|
33
37
|
/** Gets a boolean promise indicating if the button toggle is disabled. */
|
|
34
38
|
async isDisabled() {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"testing.mjs","sources":["../../../../../../../src/material/button-toggle/testing/button-toggle-harness.ts","../../../../../../../src/material/button-toggle/testing/button-toggle-group-harness.ts"],"sourcesContent":["/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n\nimport {ComponentHarness, HarnessPredicate} from '@angular/cdk/testing';\nimport {coerceBooleanProperty} from '@angular/cdk/coercion';\nimport {MatButtonToggleAppearance} from '@angular/material/button-toggle';\nimport {ButtonToggleHarnessFilters} from './button-toggle-harness-filters';\n\n/** Harness for interacting with a standard mat-button-toggle in tests. */\nexport class MatButtonToggleHarness extends ComponentHarness {\n /** The selector for the host element of a `MatButton` instance. */\n static hostSelector = '.mat-button-toggle';\n\n private _label = this.locatorFor('.mat-button-toggle-label-content');\n private _button = this.locatorFor('.mat-button-toggle-button');\n\n /**\n * Gets a `HarnessPredicate` that can be used to search for a `MatButtonToggleHarness` that meets\n * certain criteria.\n * @param options Options for filtering which button toggle instances are considered a match.\n * @return a `HarnessPredicate` configured with the given options.\n */\n static with(options: ButtonToggleHarnessFilters = {}): HarnessPredicate<MatButtonToggleHarness> {\n return new HarnessPredicate(MatButtonToggleHarness, options)\n .addOption('text', options.text, (harness, text) =>\n HarnessPredicate.stringMatches(harness.getText(), text),\n )\n .addOption('name', options.name, (harness, name) =>\n HarnessPredicate.stringMatches(harness.getName(), name),\n )\n .addOption(\n 'checked',\n options.checked,\n async (harness, checked) => (await harness.isChecked()) === checked,\n )\n .addOption('disabled', options.disabled, async (harness, disabled) => {\n return (await harness.isDisabled()) === disabled;\n });\n }\n\n /** Gets a boolean promise indicating if the button toggle is checked. */\n async isChecked(): Promise<boolean> {\n const checked = (await this._button()).getAttribute('aria-pressed');\n return coerceBooleanProperty(await checked);\n }\n\n /** Gets a boolean promise indicating if the button toggle is disabled. */\n async isDisabled(): Promise<boolean> {\n const disabled = (await this._button()).getAttribute('disabled');\n return coerceBooleanProperty(await disabled);\n }\n\n /** Gets a promise for the button toggle's name. */\n async getName(): Promise<string | null> {\n return (await this._button()).getAttribute('name');\n }\n\n /** Gets a promise for the button toggle's aria-label. */\n async getAriaLabel(): Promise<string | null> {\n return (await this._button()).getAttribute('aria-label');\n }\n\n /** Gets a promise for the button toggles's aria-labelledby. */\n async getAriaLabelledby(): Promise<string | null> {\n return (await this._button()).getAttribute('aria-labelledby');\n }\n\n /** Gets a promise for the button toggle's text. */\n async getText(): Promise<string> {\n return (await this._label()).text();\n }\n\n /** Gets the appearance that the button toggle is using. */\n async getAppearance(): Promise<MatButtonToggleAppearance> {\n const host = await this.host();\n const className = 'mat-button-toggle-appearance-standard';\n return (await host.hasClass(className)) ? 'standard' : 'legacy';\n }\n\n /** Focuses the toggle. */\n async focus(): Promise<void> {\n return (await this._button()).focus();\n }\n\n /** Blurs the toggle. */\n async blur(): Promise<void> {\n return (await this._button()).blur();\n }\n\n /** Whether the toggle is focused. */\n async isFocused(): Promise<boolean> {\n return (await this._button()).isFocused();\n }\n\n /** Toggle the checked state of the buttons toggle. */\n async toggle(): Promise<void> {\n return (await this._button()).click();\n }\n\n /**\n * Puts the button toggle in a checked state by toggling it if it's\n * currently unchecked, or doing nothing if it is already checked.\n */\n async check(): Promise<void> {\n if (!(await this.isChecked())) {\n await this.toggle();\n }\n }\n\n /**\n * Puts the button toggle in an unchecked state by toggling it if it's\n * currently checked, or doing nothing if it's already unchecked.\n */\n async uncheck(): Promise<void> {\n if (await this.isChecked()) {\n await this.toggle();\n }\n }\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n\nimport {ComponentHarness, HarnessPredicate} from '@angular/cdk/testing';\nimport {MatButtonToggleAppearance} from '@angular/material/button-toggle';\nimport {ButtonToggleGroupHarnessFilters} from './button-toggle-group-harness-filters';\nimport {ButtonToggleHarnessFilters} from './button-toggle-harness-filters';\nimport {MatButtonToggleHarness} from './button-toggle-harness';\n\n/** Harness for interacting with a standard mat-button-toggle in tests. */\nexport class MatButtonToggleGroupHarness extends ComponentHarness {\n /** The selector for the host element of a `MatButton` instance. */\n static hostSelector = '.mat-button-toggle-group';\n\n /**\n * Gets a `HarnessPredicate` that can be used to search for a `MatButtonToggleGroupHarness`\n * that meets certain criteria.\n * @param options Options for filtering which button toggle instances are considered a match.\n * @return a `HarnessPredicate` configured with the given options.\n */\n static with(\n options: ButtonToggleGroupHarnessFilters = {},\n ): HarnessPredicate<MatButtonToggleGroupHarness> {\n return new HarnessPredicate(MatButtonToggleGroupHarness, options).addOption(\n 'disabled',\n options.disabled,\n async (harness, disabled) => {\n return (await harness.isDisabled()) === disabled;\n },\n );\n }\n\n /**\n * Gets the button toggles that are inside the group.\n * @param filter Optionally filters which toggles are included.\n */\n async getToggles(filter: ButtonToggleHarnessFilters = {}): Promise<MatButtonToggleHarness[]> {\n return this.locatorForAll(MatButtonToggleHarness.with(filter))();\n }\n\n /** Gets whether the button toggle group is disabled. */\n async isDisabled(): Promise<boolean> {\n return (await (await this.host()).getAttribute('aria-disabled')) === 'true';\n }\n\n /** Gets whether the button toggle group is laid out vertically. */\n async isVertical(): Promise<boolean> {\n return (await this.host()).hasClass('mat-button-toggle-vertical');\n }\n\n /** Gets the appearance that the group is using. */\n async getAppearance(): Promise<MatButtonToggleAppearance> {\n const host = await this.host();\n const className = 'mat-button-toggle-group-appearance-standard';\n return (await host.hasClass(className)) ? 'standard' : 'legacy';\n }\n}\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"testing.mjs","sources":["../../../../../../../src/material/button-toggle/testing/button-toggle-harness.ts","../../../../../../../src/material/button-toggle/testing/button-toggle-group-harness.ts"],"sourcesContent":["/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n\nimport {ComponentHarness, HarnessPredicate, parallel} from '@angular/cdk/testing';\nimport {coerceBooleanProperty} from '@angular/cdk/coercion';\nimport {MatButtonToggleAppearance} from '@angular/material/button-toggle';\nimport {ButtonToggleHarnessFilters} from './button-toggle-harness-filters';\n\n/** Harness for interacting with a standard mat-button-toggle in tests. */\nexport class MatButtonToggleHarness extends ComponentHarness {\n /** The selector for the host element of a `MatButton` instance. */\n static hostSelector = '.mat-button-toggle';\n\n private _label = this.locatorFor('.mat-button-toggle-label-content');\n private _button = this.locatorFor('.mat-button-toggle-button');\n\n /**\n * Gets a `HarnessPredicate` that can be used to search for a `MatButtonToggleHarness` that meets\n * certain criteria.\n * @param options Options for filtering which button toggle instances are considered a match.\n * @return a `HarnessPredicate` configured with the given options.\n */\n static with(options: ButtonToggleHarnessFilters = {}): HarnessPredicate<MatButtonToggleHarness> {\n return new HarnessPredicate(MatButtonToggleHarness, options)\n .addOption('text', options.text, (harness, text) =>\n HarnessPredicate.stringMatches(harness.getText(), text),\n )\n .addOption('name', options.name, (harness, name) =>\n HarnessPredicate.stringMatches(harness.getName(), name),\n )\n .addOption(\n 'checked',\n options.checked,\n async (harness, checked) => (await harness.isChecked()) === checked,\n )\n .addOption('disabled', options.disabled, async (harness, disabled) => {\n return (await harness.isDisabled()) === disabled;\n });\n }\n\n /** Gets a boolean promise indicating if the button toggle is checked. */\n async isChecked(): Promise<boolean> {\n const button = await this._button();\n const [checked, pressed] = await parallel(() => [\n button.getAttribute('aria-checked'),\n button.getAttribute('aria-pressed'),\n ]);\n return coerceBooleanProperty(checked) || coerceBooleanProperty(pressed);\n }\n\n /** Gets a boolean promise indicating if the button toggle is disabled. */\n async isDisabled(): Promise<boolean> {\n const disabled = (await this._button()).getAttribute('disabled');\n return coerceBooleanProperty(await disabled);\n }\n\n /** Gets a promise for the button toggle's name. */\n async getName(): Promise<string | null> {\n return (await this._button()).getAttribute('name');\n }\n\n /** Gets a promise for the button toggle's aria-label. */\n async getAriaLabel(): Promise<string | null> {\n return (await this._button()).getAttribute('aria-label');\n }\n\n /** Gets a promise for the button toggles's aria-labelledby. */\n async getAriaLabelledby(): Promise<string | null> {\n return (await this._button()).getAttribute('aria-labelledby');\n }\n\n /** Gets a promise for the button toggle's text. */\n async getText(): Promise<string> {\n return (await this._label()).text();\n }\n\n /** Gets the appearance that the button toggle is using. */\n async getAppearance(): Promise<MatButtonToggleAppearance> {\n const host = await this.host();\n const className = 'mat-button-toggle-appearance-standard';\n return (await host.hasClass(className)) ? 'standard' : 'legacy';\n }\n\n /** Focuses the toggle. */\n async focus(): Promise<void> {\n return (await this._button()).focus();\n }\n\n /** Blurs the toggle. */\n async blur(): Promise<void> {\n return (await this._button()).blur();\n }\n\n /** Whether the toggle is focused. */\n async isFocused(): Promise<boolean> {\n return (await this._button()).isFocused();\n }\n\n /** Toggle the checked state of the buttons toggle. */\n async toggle(): Promise<void> {\n return (await this._button()).click();\n }\n\n /**\n * Puts the button toggle in a checked state by toggling it if it's\n * currently unchecked, or doing nothing if it is already checked.\n */\n async check(): Promise<void> {\n if (!(await this.isChecked())) {\n await this.toggle();\n }\n }\n\n /**\n * Puts the button toggle in an unchecked state by toggling it if it's\n * currently checked, or doing nothing if it's already unchecked.\n */\n async uncheck(): Promise<void> {\n if (await this.isChecked()) {\n await this.toggle();\n }\n }\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n\nimport {ComponentHarness, HarnessPredicate} from '@angular/cdk/testing';\nimport {MatButtonToggleAppearance} from '@angular/material/button-toggle';\nimport {ButtonToggleGroupHarnessFilters} from './button-toggle-group-harness-filters';\nimport {ButtonToggleHarnessFilters} from './button-toggle-harness-filters';\nimport {MatButtonToggleHarness} from './button-toggle-harness';\n\n/** Harness for interacting with a standard mat-button-toggle in tests. */\nexport class MatButtonToggleGroupHarness extends ComponentHarness {\n /** The selector for the host element of a `MatButton` instance. */\n static hostSelector = '.mat-button-toggle-group';\n\n /**\n * Gets a `HarnessPredicate` that can be used to search for a `MatButtonToggleGroupHarness`\n * that meets certain criteria.\n * @param options Options for filtering which button toggle instances are considered a match.\n * @return a `HarnessPredicate` configured with the given options.\n */\n static with(\n options: ButtonToggleGroupHarnessFilters = {},\n ): HarnessPredicate<MatButtonToggleGroupHarness> {\n return new HarnessPredicate(MatButtonToggleGroupHarness, options).addOption(\n 'disabled',\n options.disabled,\n async (harness, disabled) => {\n return (await harness.isDisabled()) === disabled;\n },\n );\n }\n\n /**\n * Gets the button toggles that are inside the group.\n * @param filter Optionally filters which toggles are included.\n */\n async getToggles(filter: ButtonToggleHarnessFilters = {}): Promise<MatButtonToggleHarness[]> {\n return this.locatorForAll(MatButtonToggleHarness.with(filter))();\n }\n\n /** Gets whether the button toggle group is disabled. */\n async isDisabled(): Promise<boolean> {\n return (await (await this.host()).getAttribute('aria-disabled')) === 'true';\n }\n\n /** Gets whether the button toggle group is laid out vertically. */\n async isVertical(): Promise<boolean> {\n return (await this.host()).hasClass('mat-button-toggle-vertical');\n }\n\n /** Gets the appearance that the group is using. */\n async getAppearance(): Promise<MatButtonToggleAppearance> {\n const host = await this.host();\n const className = 'mat-button-toggle-group-appearance-standard';\n return (await host.hasClass(className)) ? 'standard' : 'legacy';\n }\n}\n"],"names":[],"mappings":"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"}
|
|
@@ -1,7 +1,9 @@
|
|
|
1
|
-
import * as
|
|
1
|
+
import * as i2 from '@angular/cdk/a11y';
|
|
2
2
|
import { SelectionModel } from '@angular/cdk/collections';
|
|
3
|
+
import { RIGHT_ARROW, DOWN_ARROW, LEFT_ARROW, UP_ARROW, ENTER, SPACE } from '@angular/cdk/keycodes';
|
|
3
4
|
import * as i0 from '@angular/core';
|
|
4
5
|
import { InjectionToken, forwardRef, EventEmitter, booleanAttribute, Directive, Optional, Inject, ContentChildren, Input, Output, Component, ViewEncapsulation, ChangeDetectionStrategy, Attribute, ViewChild, NgModule } from '@angular/core';
|
|
6
|
+
import * as i1 from '@angular/cdk/bidi';
|
|
5
7
|
import { NG_VALUE_ACCESSOR } from '@angular/forms';
|
|
6
8
|
import { MatRipple, MatPseudoCheckbox, MatCommonModule, MatRippleModule } from '@angular/material/core';
|
|
7
9
|
|
|
@@ -91,6 +93,10 @@ class MatButtonToggleGroup {
|
|
|
91
93
|
this._disabled = value;
|
|
92
94
|
this._markButtonsForCheck();
|
|
93
95
|
}
|
|
96
|
+
/** The layout direction of the toggle button group. */
|
|
97
|
+
get dir() {
|
|
98
|
+
return this._dir && this._dir.value === 'rtl' ? 'rtl' : 'ltr';
|
|
99
|
+
}
|
|
94
100
|
/** Whether checkmark indicator for single-selection button toggle groups is hidden. */
|
|
95
101
|
get hideSingleSelectionIndicator() {
|
|
96
102
|
return this._hideSingleSelectionIndicator;
|
|
@@ -107,8 +113,9 @@ class MatButtonToggleGroup {
|
|
|
107
113
|
this._hideMultipleSelectionIndicator = value;
|
|
108
114
|
this._markButtonsForCheck();
|
|
109
115
|
}
|
|
110
|
-
constructor(_changeDetector, defaultOptions) {
|
|
116
|
+
constructor(_changeDetector, defaultOptions, _dir) {
|
|
111
117
|
this._changeDetector = _changeDetector;
|
|
118
|
+
this._dir = _dir;
|
|
112
119
|
this._multiple = false;
|
|
113
120
|
this._disabled = false;
|
|
114
121
|
/**
|
|
@@ -137,6 +144,9 @@ class MatButtonToggleGroup {
|
|
|
137
144
|
}
|
|
138
145
|
ngAfterContentInit() {
|
|
139
146
|
this._selectionModel.select(...this._buttonToggles.filter(toggle => toggle.checked));
|
|
147
|
+
if (!this.multiple) {
|
|
148
|
+
this._initializeTabIndex();
|
|
149
|
+
}
|
|
140
150
|
}
|
|
141
151
|
/**
|
|
142
152
|
* Sets the model value. Implemented as part of ControlValueAccessor.
|
|
@@ -158,6 +168,41 @@ class MatButtonToggleGroup {
|
|
|
158
168
|
setDisabledState(isDisabled) {
|
|
159
169
|
this.disabled = isDisabled;
|
|
160
170
|
}
|
|
171
|
+
/** Handle keydown event calling to single-select button toggle. */
|
|
172
|
+
_keydown(event) {
|
|
173
|
+
if (this.multiple || this.disabled) {
|
|
174
|
+
return;
|
|
175
|
+
}
|
|
176
|
+
const target = event.target;
|
|
177
|
+
const buttonId = target.id;
|
|
178
|
+
const index = this._buttonToggles.toArray().findIndex(toggle => {
|
|
179
|
+
return toggle.buttonId === buttonId;
|
|
180
|
+
});
|
|
181
|
+
let nextButton;
|
|
182
|
+
switch (event.keyCode) {
|
|
183
|
+
case SPACE:
|
|
184
|
+
case ENTER:
|
|
185
|
+
nextButton = this._buttonToggles.get(index);
|
|
186
|
+
break;
|
|
187
|
+
case UP_ARROW:
|
|
188
|
+
nextButton = this._buttonToggles.get(this._getNextIndex(index, -1));
|
|
189
|
+
break;
|
|
190
|
+
case LEFT_ARROW:
|
|
191
|
+
nextButton = this._buttonToggles.get(this._getNextIndex(index, this.dir === 'ltr' ? -1 : 1));
|
|
192
|
+
break;
|
|
193
|
+
case DOWN_ARROW:
|
|
194
|
+
nextButton = this._buttonToggles.get(this._getNextIndex(index, 1));
|
|
195
|
+
break;
|
|
196
|
+
case RIGHT_ARROW:
|
|
197
|
+
nextButton = this._buttonToggles.get(this._getNextIndex(index, this.dir === 'ltr' ? 1 : -1));
|
|
198
|
+
break;
|
|
199
|
+
default:
|
|
200
|
+
return;
|
|
201
|
+
}
|
|
202
|
+
event.preventDefault();
|
|
203
|
+
nextButton?._onButtonClick();
|
|
204
|
+
nextButton?.focus();
|
|
205
|
+
}
|
|
161
206
|
/** Dispatch change event with current selection and group value. */
|
|
162
207
|
_emitChangeEvent(toggle) {
|
|
163
208
|
const event = new MatButtonToggleChange(toggle, this.value);
|
|
@@ -213,6 +258,30 @@ class MatButtonToggleGroup {
|
|
|
213
258
|
}
|
|
214
259
|
return toggle.value === this._rawValue;
|
|
215
260
|
}
|
|
261
|
+
/** Initializes the tabindex attribute using the radio pattern. */
|
|
262
|
+
_initializeTabIndex() {
|
|
263
|
+
this._buttonToggles.forEach(toggle => {
|
|
264
|
+
toggle.tabIndex = -1;
|
|
265
|
+
});
|
|
266
|
+
if (this.selected) {
|
|
267
|
+
this.selected.tabIndex = 0;
|
|
268
|
+
}
|
|
269
|
+
else if (this._buttonToggles.length > 0) {
|
|
270
|
+
this._buttonToggles.get(0).tabIndex = 0;
|
|
271
|
+
}
|
|
272
|
+
this._markButtonsForCheck();
|
|
273
|
+
}
|
|
274
|
+
/** Obtain the subsequent index to which the focus shifts. */
|
|
275
|
+
_getNextIndex(index, offset) {
|
|
276
|
+
let nextIndex = index + offset;
|
|
277
|
+
if (nextIndex === this._buttonToggles.length) {
|
|
278
|
+
nextIndex = 0;
|
|
279
|
+
}
|
|
280
|
+
if (nextIndex === -1) {
|
|
281
|
+
nextIndex = this._buttonToggles.length - 1;
|
|
282
|
+
}
|
|
283
|
+
return nextIndex;
|
|
284
|
+
}
|
|
216
285
|
/** Updates the selection state of the toggles in the group based on a value. */
|
|
217
286
|
_setSelectionByValue(value) {
|
|
218
287
|
this._rawValue = value;
|
|
@@ -234,7 +303,13 @@ class MatButtonToggleGroup {
|
|
|
234
303
|
/** Clears the selected toggles. */
|
|
235
304
|
_clearSelection() {
|
|
236
305
|
this._selectionModel.clear();
|
|
237
|
-
this._buttonToggles.forEach(toggle =>
|
|
306
|
+
this._buttonToggles.forEach(toggle => {
|
|
307
|
+
toggle.checked = false;
|
|
308
|
+
// If the button toggle is in single select mode, initialize the tabIndex.
|
|
309
|
+
if (!this.multiple) {
|
|
310
|
+
toggle.tabIndex = -1;
|
|
311
|
+
}
|
|
312
|
+
});
|
|
238
313
|
}
|
|
239
314
|
/** Selects a value if there's a toggle that corresponds to it. */
|
|
240
315
|
_selectValue(value) {
|
|
@@ -244,6 +319,10 @@ class MatButtonToggleGroup {
|
|
|
244
319
|
if (correspondingOption) {
|
|
245
320
|
correspondingOption.checked = true;
|
|
246
321
|
this._selectionModel.select(correspondingOption);
|
|
322
|
+
if (!this.multiple) {
|
|
323
|
+
// If the button toggle is in single select mode, reset the tabIndex.
|
|
324
|
+
correspondingOption.tabIndex = 0;
|
|
325
|
+
}
|
|
247
326
|
}
|
|
248
327
|
}
|
|
249
328
|
/** Syncs up the group's value with the model and emits the change event. */
|
|
@@ -260,13 +339,13 @@ class MatButtonToggleGroup {
|
|
|
260
339
|
_markButtonsForCheck() {
|
|
261
340
|
this._buttonToggles?.forEach(toggle => toggle._markForCheck());
|
|
262
341
|
}
|
|
263
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.
|
|
264
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "18.0.0-next.
|
|
342
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.1", ngImport: i0, type: MatButtonToggleGroup, deps: [{ token: i0.ChangeDetectorRef }, { token: MAT_BUTTON_TOGGLE_DEFAULT_OPTIONS, optional: true }, { token: i1.Directionality, optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
343
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "18.0.0-next.1", type: MatButtonToggleGroup, isStandalone: true, selector: "mat-button-toggle-group", inputs: { appearance: "appearance", name: "name", vertical: ["vertical", "vertical", booleanAttribute], value: "value", multiple: ["multiple", "multiple", booleanAttribute], disabled: ["disabled", "disabled", booleanAttribute], hideSingleSelectionIndicator: ["hideSingleSelectionIndicator", "hideSingleSelectionIndicator", booleanAttribute], hideMultipleSelectionIndicator: ["hideMultipleSelectionIndicator", "hideMultipleSelectionIndicator", booleanAttribute] }, outputs: { valueChange: "valueChange", change: "change" }, host: { listeners: { "keydown": "_keydown($event)" }, properties: { "attr.role": "multiple ? 'group' : 'radiogroup'", "attr.aria-disabled": "disabled", "class.mat-button-toggle-vertical": "vertical", "class.mat-button-toggle-group-appearance-standard": "appearance === \"standard\"" }, classAttribute: "mat-button-toggle-group" }, providers: [
|
|
265
344
|
MAT_BUTTON_TOGGLE_GROUP_VALUE_ACCESSOR,
|
|
266
345
|
{ provide: MAT_BUTTON_TOGGLE_GROUP, useExisting: MatButtonToggleGroup },
|
|
267
346
|
], queries: [{ propertyName: "_buttonToggles", predicate: i0.forwardRef(() => MatButtonToggle), descendants: true }], exportAs: ["matButtonToggleGroup"], ngImport: i0 }); }
|
|
268
347
|
}
|
|
269
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.
|
|
348
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.1", ngImport: i0, type: MatButtonToggleGroup, decorators: [{
|
|
270
349
|
type: Directive,
|
|
271
350
|
args: [{
|
|
272
351
|
selector: 'mat-button-toggle-group',
|
|
@@ -275,8 +354,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.0",
|
|
|
275
354
|
{ provide: MAT_BUTTON_TOGGLE_GROUP, useExisting: MatButtonToggleGroup },
|
|
276
355
|
],
|
|
277
356
|
host: {
|
|
278
|
-
'role': 'group',
|
|
279
357
|
'class': 'mat-button-toggle-group',
|
|
358
|
+
'(keydown)': '_keydown($event)',
|
|
359
|
+
'[attr.role]': "multiple ? 'group' : 'radiogroup'",
|
|
280
360
|
'[attr.aria-disabled]': 'disabled',
|
|
281
361
|
'[class.mat-button-toggle-vertical]': 'vertical',
|
|
282
362
|
'[class.mat-button-toggle-group-appearance-standard]': 'appearance === "standard"',
|
|
@@ -289,6 +369,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.0",
|
|
|
289
369
|
}, {
|
|
290
370
|
type: Inject,
|
|
291
371
|
args: [MAT_BUTTON_TOGGLE_DEFAULT_OPTIONS]
|
|
372
|
+
}] }, { type: i1.Directionality, decorators: [{
|
|
373
|
+
type: Optional
|
|
292
374
|
}] }], propDecorators: { _buttonToggles: [{
|
|
293
375
|
type: ContentChildren,
|
|
294
376
|
args: [forwardRef(() => MatButtonToggle), {
|
|
@@ -328,6 +410,14 @@ class MatButtonToggle {
|
|
|
328
410
|
get buttonId() {
|
|
329
411
|
return `${this.id}-button`;
|
|
330
412
|
}
|
|
413
|
+
/** Tabindex of the toggle. */
|
|
414
|
+
get tabIndex() {
|
|
415
|
+
return this._tabIndex;
|
|
416
|
+
}
|
|
417
|
+
set tabIndex(value) {
|
|
418
|
+
this._tabIndex = value;
|
|
419
|
+
this._markForCheck();
|
|
420
|
+
}
|
|
331
421
|
/** The appearance style of the button. */
|
|
332
422
|
get appearance() {
|
|
333
423
|
return this.buttonToggleGroup ? this.buttonToggleGroup.appearance : this._appearance;
|
|
@@ -407,7 +497,7 @@ class MatButtonToggle {
|
|
|
407
497
|
}
|
|
408
498
|
/** Checks the button toggle due to an interaction with the underlying native button. */
|
|
409
499
|
_onButtonClick() {
|
|
410
|
-
const newChecked = this.
|
|
500
|
+
const newChecked = this.isSingleSelector() ? true : !this._checked;
|
|
411
501
|
if (newChecked !== this._checked) {
|
|
412
502
|
this._checked = newChecked;
|
|
413
503
|
if (this.buttonToggleGroup) {
|
|
@@ -415,6 +505,17 @@ class MatButtonToggle {
|
|
|
415
505
|
this.buttonToggleGroup._onTouched();
|
|
416
506
|
}
|
|
417
507
|
}
|
|
508
|
+
if (this.isSingleSelector()) {
|
|
509
|
+
const focusable = this.buttonToggleGroup._buttonToggles.find(toggle => {
|
|
510
|
+
return toggle.tabIndex === 0;
|
|
511
|
+
});
|
|
512
|
+
// Modify the tabindex attribute of the last focusable button toggle to -1.
|
|
513
|
+
if (focusable) {
|
|
514
|
+
focusable.tabIndex = -1;
|
|
515
|
+
}
|
|
516
|
+
// Modify the tabindex attribute of the presently selected button toggle to 0.
|
|
517
|
+
this.tabIndex = 0;
|
|
518
|
+
}
|
|
418
519
|
// Emit a change event when it's the single selector
|
|
419
520
|
this.change.emit(new MatButtonToggleChange(this, this.value));
|
|
420
521
|
}
|
|
@@ -430,19 +531,19 @@ class MatButtonToggle {
|
|
|
430
531
|
}
|
|
431
532
|
/** Gets the name that should be assigned to the inner DOM node. */
|
|
432
533
|
_getButtonName() {
|
|
433
|
-
if (this.
|
|
534
|
+
if (this.isSingleSelector()) {
|
|
434
535
|
return this.buttonToggleGroup.name;
|
|
435
536
|
}
|
|
436
537
|
return this.name || null;
|
|
437
538
|
}
|
|
438
539
|
/** Whether the toggle is in single selection mode. */
|
|
439
|
-
|
|
540
|
+
isSingleSelector() {
|
|
440
541
|
return this.buttonToggleGroup && !this.buttonToggleGroup.multiple;
|
|
441
542
|
}
|
|
442
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.
|
|
443
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0-next.0", type: MatButtonToggle, isStandalone: true, selector: "mat-button-toggle", inputs: { ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"], id: "id", name: "name", value: "value", tabIndex: "tabIndex", disableRipple: ["disableRipple", "disableRipple", booleanAttribute], appearance: "appearance", checked: ["checked", "checked", booleanAttribute], disabled: ["disabled", "disabled", booleanAttribute] }, outputs: { change: "change" }, host: { attributes: { "role": "presentation" }, listeners: { "focus": "focus()" }, properties: { "class.mat-button-toggle-standalone": "!buttonToggleGroup", "class.mat-button-toggle-checked": "checked", "class.mat-button-toggle-disabled": "disabled", "class.mat-button-toggle-appearance-standard": "appearance === \"standard\"", "attr.aria-label": "null", "attr.aria-labelledby": "null", "attr.id": "id", "attr.name": "null" }, classAttribute: "mat-button-toggle" }, viewQueries: [{ propertyName: "_buttonElement", first: true, predicate: ["button"], descendants: true }], exportAs: ["matButtonToggle"], ngImport: i0, template: "<button #button class=\"mat-button-toggle-button mat-focus-indicator\"\n type=\"button\"\n [id]=\"buttonId\"\n [attr.tabindex]=\"disabled ? -1 : tabIndex\"\n [attr.aria-pressed]=\"checked\"\n [disabled]=\"disabled || null\"\n [attr.name]=\"_getButtonName()\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n (click)=\"_onButtonClick()\">\n <span class=\"mat-button-toggle-label-content\">\n <!-- Render checkmark at the beginning for single-selection. -->\n @if (buttonToggleGroup && checked && !buttonToggleGroup.multiple && !buttonToggleGroup.hideSingleSelectionIndicator) {\n <mat-pseudo-checkbox\n class=\"mat-mdc-option-pseudo-checkbox\"\n [disabled]=\"disabled\"\n state=\"checked\"\n aria-hidden=\"true\"\n appearance=\"minimal\"></mat-pseudo-checkbox>\n }\n <!-- Render checkmark at the beginning for multiple-selection. -->\n @if (buttonToggleGroup && checked && buttonToggleGroup.multiple && !buttonToggleGroup.hideMultipleSelectionIndicator) {\n <mat-pseudo-checkbox\n class=\"mat-mdc-option-pseudo-checkbox\"\n [disabled]=\"disabled\"\n state=\"checked\"\n aria-hidden=\"true\"\n appearance=\"minimal\"></mat-pseudo-checkbox>\n }\n <ng-content></ng-content>\n </span>\n</button>\n\n<span class=\"mat-button-toggle-focus-overlay\"></span>\n<span class=\"mat-button-toggle-ripple\" matRipple\n [matRippleTrigger]=\"button\"\n [matRippleDisabled]=\"this.disableRipple || this.disabled\">\n</span>\n", styles: [".mat-button-toggle-standalone,.mat-button-toggle-group{position:relative;display:inline-flex;flex-direction:row;white-space:nowrap;overflow:hidden;-webkit-tap-highlight-color:rgba(0,0,0,0);transform:translateZ(0);border-radius:var(--mat-legacy-button-toggle-shape)}.mat-button-toggle-standalone:not([class*=mat-elevation-z]),.mat-button-toggle-group:not([class*=mat-elevation-z]){box-shadow:0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12)}.cdk-high-contrast-active .mat-button-toggle-standalone,.cdk-high-contrast-active .mat-button-toggle-group{outline:solid 1px}.mat-button-toggle-standalone.mat-button-toggle-appearance-standard,.mat-button-toggle-group-appearance-standard{border-radius:var(--mat-standard-button-toggle-shape);border:solid 1px var(--mat-standard-button-toggle-divider-color)}.mat-button-toggle-standalone.mat-button-toggle-appearance-standard .mat-pseudo-checkbox,.mat-button-toggle-group-appearance-standard .mat-pseudo-checkbox{--mat-minimal-pseudo-checkbox-selected-checkmark-color: var( --mat-standard-button-toggle-selected-state-text-color )}.mat-button-toggle-standalone.mat-button-toggle-appearance-standard:not([class*=mat-elevation-z]),.mat-button-toggle-group-appearance-standard:not([class*=mat-elevation-z]){box-shadow:none}.cdk-high-contrast-active .mat-button-toggle-standalone.mat-button-toggle-appearance-standard,.cdk-high-contrast-active .mat-button-toggle-group-appearance-standard{outline:0}.mat-button-toggle-vertical{flex-direction:column}.mat-button-toggle-vertical .mat-button-toggle-label-content{display:block}.mat-button-toggle{white-space:nowrap;position:relative;color:var(--mat-legacy-button-toggle-text-color);font-family:var(--mat-legacy-button-toggle-label-text-font);font-size:var(--mat-legacy-button-toggle-label-text-size);line-height:var(--mat-legacy-button-toggle-label-text-line-height);font-weight:var(--mat-legacy-button-toggle-label-text-weight);letter-spacing:var(--mat-legacy-button-toggle-label-text-tracking);--mat-minimal-pseudo-checkbox-selected-checkmark-color: var( --mat-legacy-button-toggle-selected-state-text-color )}.mat-button-toggle.cdk-keyboard-focused .mat-button-toggle-focus-overlay{opacity:var(--mat-legacy-button-toggle-focus-state-layer-opacity)}.mat-button-toggle .mat-icon svg{vertical-align:top}.mat-button-toggle .mat-pseudo-checkbox{margin-right:12px}[dir=rtl] .mat-button-toggle .mat-pseudo-checkbox{margin-right:0;margin-left:12px}.mat-button-toggle-checked{color:var(--mat-legacy-button-toggle-selected-state-text-color);background-color:var(--mat-legacy-button-toggle-selected-state-background-color)}.mat-button-toggle-disabled{color:var(--mat-legacy-button-toggle-disabled-state-text-color);background-color:var(--mat-legacy-button-toggle-disabled-state-background-color);--mat-minimal-pseudo-checkbox-disabled-selected-checkmark-color: var( --mat-legacy-button-toggle-disabled-state-text-color )}.mat-button-toggle-disabled.mat-button-toggle-checked{background-color:var(--mat-legacy-button-toggle-disabled-selected-state-background-color)}.mat-button-toggle-appearance-standard{color:var(--mat-standard-button-toggle-text-color);background-color:var(--mat-standard-button-toggle-background-color);font-family:var(--mat-standard-button-toggle-label-text-font);font-size:var(--mat-standard-button-toggle-label-text-size);line-height:var(--mat-standard-button-toggle-label-text-line-height);font-weight:var(--mat-standard-button-toggle-label-text-weight);letter-spacing:var(--mat-standard-button-toggle-label-text-tracking)}.mat-button-toggle-group-appearance-standard .mat-button-toggle-appearance-standard+.mat-button-toggle-appearance-standard{border-left:solid 1px var(--mat-standard-button-toggle-divider-color)}[dir=rtl] .mat-button-toggle-group-appearance-standard .mat-button-toggle-appearance-standard+.mat-button-toggle-appearance-standard{border-left:none;border-right:solid 1px var(--mat-standard-button-toggle-divider-color)}.mat-button-toggle-group-appearance-standard.mat-button-toggle-vertical .mat-button-toggle-appearance-standard+.mat-button-toggle-appearance-standard{border-left:none;border-right:none;border-top:solid 1px var(--mat-standard-button-toggle-divider-color)}.mat-button-toggle-appearance-standard.mat-button-toggle-checked{color:var(--mat-standard-button-toggle-selected-state-text-color);background-color:var(--mat-standard-button-toggle-selected-state-background-color)}.mat-button-toggle-appearance-standard.mat-button-toggle-disabled{color:var(--mat-standard-button-toggle-disabled-state-text-color);background-color:var(--mat-standard-button-toggle-disabled-state-background-color)}.mat-button-toggle-appearance-standard.mat-button-toggle-disabled .mat-pseudo-checkbox{--mat-minimal-pseudo-checkbox-disabled-selected-checkmark-color: var( --mat-standard-button-toggle-disabled-selected-state-text-color )}.mat-button-toggle-appearance-standard.mat-button-toggle-disabled.mat-button-toggle-checked{color:var(--mat-standard-button-toggle-disabled-selected-state-text-color);background-color:var(--mat-standard-button-toggle-disabled-selected-state-background-color)}.mat-button-toggle-appearance-standard .mat-button-toggle-focus-overlay{background-color:var(--mat-standard-button-toggle-state-layer-color)}.mat-button-toggle-appearance-standard:not(.mat-button-toggle-disabled):hover .mat-button-toggle-focus-overlay{opacity:var(--mat-standard-button-toggle-hover-state-layer-opacity)}.mat-button-toggle-appearance-standard.cdk-keyboard-focused:not(.mat-button-toggle-disabled) .mat-button-toggle-focus-overlay{opacity:var(--mat-standard-button-toggle-focus-state-layer-opacity)}@media(hover: none){.mat-button-toggle-appearance-standard:not(.mat-button-toggle-disabled):hover .mat-button-toggle-focus-overlay{display:none}}.mat-button-toggle-label-content{-webkit-user-select:none;user-select:none;display:inline-block;padding:0 16px;line-height:var(--mat-legacy-button-toggle-height);position:relative}.mat-button-toggle-appearance-standard .mat-button-toggle-label-content{padding:0 12px;line-height:var(--mat-standard-button-toggle-height)}.mat-button-toggle-label-content>*{vertical-align:middle}.mat-button-toggle-focus-overlay{top:0;left:0;right:0;bottom:0;position:absolute;border-radius:inherit;pointer-events:none;opacity:0;background-color:var(--mat-legacy-button-toggle-state-layer-color)}.cdk-high-contrast-active .mat-button-toggle-checked .mat-button-toggle-focus-overlay{border-bottom:solid 500px;opacity:.5;height:0}.cdk-high-contrast-active .mat-button-toggle-checked:hover .mat-button-toggle-focus-overlay{opacity:.6}.cdk-high-contrast-active .mat-button-toggle-checked.mat-button-toggle-appearance-standard .mat-button-toggle-focus-overlay{border-bottom:solid 500px}.mat-button-toggle .mat-button-toggle-ripple{top:0;left:0;right:0;bottom:0;position:absolute;pointer-events:none}.mat-button-toggle-button{border:0;background:none;color:inherit;padding:0;margin:0;font:inherit;outline:none;width:100%;cursor:pointer}.mat-button-toggle-disabled .mat-button-toggle-button{cursor:default}.mat-button-toggle-button::-moz-focus-inner{border:0}"], dependencies: [{ kind: "directive", type: MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { kind: "component", type: MatPseudoCheckbox, selector: "mat-pseudo-checkbox", inputs: ["state", "disabled", "appearance"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
543
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.1", ngImport: i0, type: MatButtonToggle, deps: [{ token: MAT_BUTTON_TOGGLE_GROUP, optional: true }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i2.FocusMonitor }, { token: 'tabindex', attribute: true }, { token: MAT_BUTTON_TOGGLE_DEFAULT_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
544
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0-next.1", type: MatButtonToggle, isStandalone: true, selector: "mat-button-toggle", inputs: { ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"], id: "id", name: "name", value: "value", tabIndex: "tabIndex", disableRipple: ["disableRipple", "disableRipple", booleanAttribute], appearance: "appearance", checked: ["checked", "checked", booleanAttribute], disabled: ["disabled", "disabled", booleanAttribute] }, outputs: { change: "change" }, host: { attributes: { "role": "presentation" }, listeners: { "focus": "focus()" }, properties: { "class.mat-button-toggle-standalone": "!buttonToggleGroup", "class.mat-button-toggle-checked": "checked", "class.mat-button-toggle-disabled": "disabled", "class.mat-button-toggle-appearance-standard": "appearance === \"standard\"", "attr.aria-label": "null", "attr.aria-labelledby": "null", "attr.id": "id", "attr.name": "null" }, classAttribute: "mat-button-toggle" }, viewQueries: [{ propertyName: "_buttonElement", first: true, predicate: ["button"], descendants: true }], exportAs: ["matButtonToggle"], ngImport: i0, template: "<button #button class=\"mat-button-toggle-button mat-focus-indicator\"\n type=\"button\"\n [id]=\"buttonId\"\n [attr.role]=\"isSingleSelector() ? 'radio' : 'button'\"\n [attr.tabindex]=\"disabled ? -1 : tabIndex\"\n [attr.aria-pressed]=\"!isSingleSelector() ? checked : null\"\n [attr.aria-checked]=\"isSingleSelector() ? checked : null\"\n [disabled]=\"disabled || null\"\n [attr.name]=\"_getButtonName()\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n (click)=\"_onButtonClick()\">\n <span class=\"mat-button-toggle-label-content\">\n <!-- Render checkmark at the beginning for single-selection. -->\n @if (buttonToggleGroup && checked && !buttonToggleGroup.multiple && !buttonToggleGroup.hideSingleSelectionIndicator) {\n <mat-pseudo-checkbox\n class=\"mat-mdc-option-pseudo-checkbox\"\n [disabled]=\"disabled\"\n state=\"checked\"\n aria-hidden=\"true\"\n appearance=\"minimal\"></mat-pseudo-checkbox>\n }\n <!-- Render checkmark at the beginning for multiple-selection. -->\n @if (buttonToggleGroup && checked && buttonToggleGroup.multiple && !buttonToggleGroup.hideMultipleSelectionIndicator) {\n <mat-pseudo-checkbox\n class=\"mat-mdc-option-pseudo-checkbox\"\n [disabled]=\"disabled\"\n state=\"checked\"\n aria-hidden=\"true\"\n appearance=\"minimal\"></mat-pseudo-checkbox>\n }\n <ng-content></ng-content>\n </span>\n</button>\n\n<span class=\"mat-button-toggle-focus-overlay\"></span>\n<span class=\"mat-button-toggle-ripple\" matRipple\n [matRippleTrigger]=\"button\"\n [matRippleDisabled]=\"this.disableRipple || this.disabled\">\n</span>\n", styles: [".mat-button-toggle-standalone,.mat-button-toggle-group{position:relative;display:inline-flex;flex-direction:row;white-space:nowrap;overflow:hidden;-webkit-tap-highlight-color:rgba(0,0,0,0);transform:translateZ(0);border-radius:var(--mat-legacy-button-toggle-shape)}.mat-button-toggle-standalone:not([class*=mat-elevation-z]),.mat-button-toggle-group:not([class*=mat-elevation-z]){box-shadow:0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12)}.cdk-high-contrast-active .mat-button-toggle-standalone,.cdk-high-contrast-active .mat-button-toggle-group{outline:solid 1px}.mat-button-toggle-standalone.mat-button-toggle-appearance-standard,.mat-button-toggle-group-appearance-standard{border-radius:var(--mat-standard-button-toggle-shape);border:solid 1px var(--mat-standard-button-toggle-divider-color)}.mat-button-toggle-standalone.mat-button-toggle-appearance-standard .mat-pseudo-checkbox,.mat-button-toggle-group-appearance-standard .mat-pseudo-checkbox{--mat-minimal-pseudo-checkbox-selected-checkmark-color: var( --mat-standard-button-toggle-selected-state-text-color )}.mat-button-toggle-standalone.mat-button-toggle-appearance-standard:not([class*=mat-elevation-z]),.mat-button-toggle-group-appearance-standard:not([class*=mat-elevation-z]){box-shadow:none}.cdk-high-contrast-active .mat-button-toggle-standalone.mat-button-toggle-appearance-standard,.cdk-high-contrast-active .mat-button-toggle-group-appearance-standard{outline:0}.mat-button-toggle-vertical{flex-direction:column}.mat-button-toggle-vertical .mat-button-toggle-label-content{display:block}.mat-button-toggle{white-space:nowrap;position:relative;color:var(--mat-legacy-button-toggle-text-color);font-family:var(--mat-legacy-button-toggle-label-text-font);font-size:var(--mat-legacy-button-toggle-label-text-size);line-height:var(--mat-legacy-button-toggle-label-text-line-height);font-weight:var(--mat-legacy-button-toggle-label-text-weight);letter-spacing:var(--mat-legacy-button-toggle-label-text-tracking);--mat-minimal-pseudo-checkbox-selected-checkmark-color: var( --mat-legacy-button-toggle-selected-state-text-color )}.mat-button-toggle.cdk-keyboard-focused .mat-button-toggle-focus-overlay{opacity:var(--mat-legacy-button-toggle-focus-state-layer-opacity)}.mat-button-toggle .mat-icon svg{vertical-align:top}.mat-button-toggle .mat-pseudo-checkbox{margin-right:12px}[dir=rtl] .mat-button-toggle .mat-pseudo-checkbox{margin-right:0;margin-left:12px}.mat-button-toggle-checked{color:var(--mat-legacy-button-toggle-selected-state-text-color);background-color:var(--mat-legacy-button-toggle-selected-state-background-color)}.mat-button-toggle-disabled{color:var(--mat-legacy-button-toggle-disabled-state-text-color);background-color:var(--mat-legacy-button-toggle-disabled-state-background-color);--mat-minimal-pseudo-checkbox-disabled-selected-checkmark-color: var( --mat-legacy-button-toggle-disabled-state-text-color )}.mat-button-toggle-disabled.mat-button-toggle-checked{background-color:var(--mat-legacy-button-toggle-disabled-selected-state-background-color)}.mat-button-toggle-appearance-standard{color:var(--mat-standard-button-toggle-text-color);background-color:var(--mat-standard-button-toggle-background-color);font-family:var(--mat-standard-button-toggle-label-text-font);font-size:var(--mat-standard-button-toggle-label-text-size);line-height:var(--mat-standard-button-toggle-label-text-line-height);font-weight:var(--mat-standard-button-toggle-label-text-weight);letter-spacing:var(--mat-standard-button-toggle-label-text-tracking)}.mat-button-toggle-group-appearance-standard .mat-button-toggle-appearance-standard+.mat-button-toggle-appearance-standard{border-left:solid 1px var(--mat-standard-button-toggle-divider-color)}[dir=rtl] .mat-button-toggle-group-appearance-standard .mat-button-toggle-appearance-standard+.mat-button-toggle-appearance-standard{border-left:none;border-right:solid 1px var(--mat-standard-button-toggle-divider-color)}.mat-button-toggle-group-appearance-standard.mat-button-toggle-vertical .mat-button-toggle-appearance-standard+.mat-button-toggle-appearance-standard{border-left:none;border-right:none;border-top:solid 1px var(--mat-standard-button-toggle-divider-color)}.mat-button-toggle-appearance-standard.mat-button-toggle-checked{color:var(--mat-standard-button-toggle-selected-state-text-color);background-color:var(--mat-standard-button-toggle-selected-state-background-color)}.mat-button-toggle-appearance-standard.mat-button-toggle-disabled{color:var(--mat-standard-button-toggle-disabled-state-text-color);background-color:var(--mat-standard-button-toggle-disabled-state-background-color)}.mat-button-toggle-appearance-standard.mat-button-toggle-disabled .mat-pseudo-checkbox{--mat-minimal-pseudo-checkbox-disabled-selected-checkmark-color: var( --mat-standard-button-toggle-disabled-selected-state-text-color )}.mat-button-toggle-appearance-standard.mat-button-toggle-disabled.mat-button-toggle-checked{color:var(--mat-standard-button-toggle-disabled-selected-state-text-color);background-color:var(--mat-standard-button-toggle-disabled-selected-state-background-color)}.mat-button-toggle-appearance-standard .mat-button-toggle-focus-overlay{background-color:var(--mat-standard-button-toggle-state-layer-color)}.mat-button-toggle-appearance-standard:not(.mat-button-toggle-disabled):hover .mat-button-toggle-focus-overlay{opacity:var(--mat-standard-button-toggle-hover-state-layer-opacity)}.mat-button-toggle-appearance-standard.cdk-keyboard-focused:not(.mat-button-toggle-disabled) .mat-button-toggle-focus-overlay{opacity:var(--mat-standard-button-toggle-focus-state-layer-opacity)}@media(hover: none){.mat-button-toggle-appearance-standard:not(.mat-button-toggle-disabled):hover .mat-button-toggle-focus-overlay{display:none}}.mat-button-toggle-label-content{-webkit-user-select:none;user-select:none;display:inline-block;padding:0 16px;line-height:var(--mat-legacy-button-toggle-height);position:relative}.mat-button-toggle-appearance-standard .mat-button-toggle-label-content{padding:0 12px;line-height:var(--mat-standard-button-toggle-height)}.mat-button-toggle-label-content>*{vertical-align:middle}.mat-button-toggle-focus-overlay{top:0;left:0;right:0;bottom:0;position:absolute;border-radius:inherit;pointer-events:none;opacity:0;background-color:var(--mat-legacy-button-toggle-state-layer-color)}.cdk-high-contrast-active .mat-button-toggle-checked .mat-button-toggle-focus-overlay{border-bottom:solid 500px;opacity:.5;height:0}.cdk-high-contrast-active .mat-button-toggle-checked:hover .mat-button-toggle-focus-overlay{opacity:.6}.cdk-high-contrast-active .mat-button-toggle-checked.mat-button-toggle-appearance-standard .mat-button-toggle-focus-overlay{border-bottom:solid 500px}.mat-button-toggle .mat-button-toggle-ripple{top:0;left:0;right:0;bottom:0;position:absolute;pointer-events:none}.mat-button-toggle-button{border:0;background:none;color:inherit;padding:0;margin:0;font:inherit;outline:none;width:100%;cursor:pointer}.mat-button-toggle-disabled .mat-button-toggle-button{cursor:default}.mat-button-toggle-button::-moz-focus-inner{border:0}.mat-button-toggle-standalone.mat-button-toggle-appearance-standard{--mat-focus-indicator-border-radius:var(--mat-standard-button-toggle-shape)}.mat-button-toggle-group-appearance-standard .mat-button-toggle:last-of-type .mat-button-toggle-button::before{border-top-right-radius:var(--mat-standard-button-toggle-shape);border-bottom-right-radius:var(--mat-standard-button-toggle-shape)}.mat-button-toggle-group-appearance-standard .mat-button-toggle:first-of-type .mat-button-toggle-button::before{border-top-left-radius:var(--mat-standard-button-toggle-shape);border-bottom-left-radius:var(--mat-standard-button-toggle-shape)}"], dependencies: [{ kind: "directive", type: MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { kind: "component", type: MatPseudoCheckbox, selector: "mat-pseudo-checkbox", inputs: ["state", "disabled", "appearance"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
444
545
|
}
|
|
445
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.
|
|
546
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.1", ngImport: i0, type: MatButtonToggle, decorators: [{
|
|
446
547
|
type: Component,
|
|
447
548
|
args: [{ selector: 'mat-button-toggle', encapsulation: ViewEncapsulation.None, exportAs: 'matButtonToggle', changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
448
549
|
'[class.mat-button-toggle-standalone]': '!buttonToggleGroup',
|
|
@@ -456,13 +557,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.0",
|
|
|
456
557
|
'[attr.name]': 'null',
|
|
457
558
|
'(focus)': 'focus()',
|
|
458
559
|
'role': 'presentation',
|
|
459
|
-
}, standalone: true, imports: [MatRipple, MatPseudoCheckbox], template: "<button #button class=\"mat-button-toggle-button mat-focus-indicator\"\n type=\"button\"\n [id]=\"buttonId\"\n [attr.tabindex]=\"disabled ? -1 : tabIndex\"\n [attr.aria-pressed]=\"checked\"\n [disabled]=\"disabled || null\"\n [attr.name]=\"_getButtonName()\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n (click)=\"_onButtonClick()\">\n <span class=\"mat-button-toggle-label-content\">\n <!-- Render checkmark at the beginning for single-selection. -->\n @if (buttonToggleGroup && checked && !buttonToggleGroup.multiple && !buttonToggleGroup.hideSingleSelectionIndicator) {\n <mat-pseudo-checkbox\n class=\"mat-mdc-option-pseudo-checkbox\"\n [disabled]=\"disabled\"\n state=\"checked\"\n aria-hidden=\"true\"\n appearance=\"minimal\"></mat-pseudo-checkbox>\n }\n <!-- Render checkmark at the beginning for multiple-selection. -->\n @if (buttonToggleGroup && checked && buttonToggleGroup.multiple && !buttonToggleGroup.hideMultipleSelectionIndicator) {\n <mat-pseudo-checkbox\n class=\"mat-mdc-option-pseudo-checkbox\"\n [disabled]=\"disabled\"\n state=\"checked\"\n aria-hidden=\"true\"\n appearance=\"minimal\"></mat-pseudo-checkbox>\n }\n <ng-content></ng-content>\n </span>\n</button>\n\n<span class=\"mat-button-toggle-focus-overlay\"></span>\n<span class=\"mat-button-toggle-ripple\" matRipple\n [matRippleTrigger]=\"button\"\n [matRippleDisabled]=\"this.disableRipple || this.disabled\">\n</span>\n", styles: [".mat-button-toggle-standalone,.mat-button-toggle-group{position:relative;display:inline-flex;flex-direction:row;white-space:nowrap;overflow:hidden;-webkit-tap-highlight-color:rgba(0,0,0,0);transform:translateZ(0);border-radius:var(--mat-legacy-button-toggle-shape)}.mat-button-toggle-standalone:not([class*=mat-elevation-z]),.mat-button-toggle-group:not([class*=mat-elevation-z]){box-shadow:0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12)}.cdk-high-contrast-active .mat-button-toggle-standalone,.cdk-high-contrast-active .mat-button-toggle-group{outline:solid 1px}.mat-button-toggle-standalone.mat-button-toggle-appearance-standard,.mat-button-toggle-group-appearance-standard{border-radius:var(--mat-standard-button-toggle-shape);border:solid 1px var(--mat-standard-button-toggle-divider-color)}.mat-button-toggle-standalone.mat-button-toggle-appearance-standard .mat-pseudo-checkbox,.mat-button-toggle-group-appearance-standard .mat-pseudo-checkbox{--mat-minimal-pseudo-checkbox-selected-checkmark-color: var( --mat-standard-button-toggle-selected-state-text-color )}.mat-button-toggle-standalone.mat-button-toggle-appearance-standard:not([class*=mat-elevation-z]),.mat-button-toggle-group-appearance-standard:not([class*=mat-elevation-z]){box-shadow:none}.cdk-high-contrast-active .mat-button-toggle-standalone.mat-button-toggle-appearance-standard,.cdk-high-contrast-active .mat-button-toggle-group-appearance-standard{outline:0}.mat-button-toggle-vertical{flex-direction:column}.mat-button-toggle-vertical .mat-button-toggle-label-content{display:block}.mat-button-toggle{white-space:nowrap;position:relative;color:var(--mat-legacy-button-toggle-text-color);font-family:var(--mat-legacy-button-toggle-label-text-font);font-size:var(--mat-legacy-button-toggle-label-text-size);line-height:var(--mat-legacy-button-toggle-label-text-line-height);font-weight:var(--mat-legacy-button-toggle-label-text-weight);letter-spacing:var(--mat-legacy-button-toggle-label-text-tracking);--mat-minimal-pseudo-checkbox-selected-checkmark-color: var( --mat-legacy-button-toggle-selected-state-text-color )}.mat-button-toggle.cdk-keyboard-focused .mat-button-toggle-focus-overlay{opacity:var(--mat-legacy-button-toggle-focus-state-layer-opacity)}.mat-button-toggle .mat-icon svg{vertical-align:top}.mat-button-toggle .mat-pseudo-checkbox{margin-right:12px}[dir=rtl] .mat-button-toggle .mat-pseudo-checkbox{margin-right:0;margin-left:12px}.mat-button-toggle-checked{color:var(--mat-legacy-button-toggle-selected-state-text-color);background-color:var(--mat-legacy-button-toggle-selected-state-background-color)}.mat-button-toggle-disabled{color:var(--mat-legacy-button-toggle-disabled-state-text-color);background-color:var(--mat-legacy-button-toggle-disabled-state-background-color);--mat-minimal-pseudo-checkbox-disabled-selected-checkmark-color: var( --mat-legacy-button-toggle-disabled-state-text-color )}.mat-button-toggle-disabled.mat-button-toggle-checked{background-color:var(--mat-legacy-button-toggle-disabled-selected-state-background-color)}.mat-button-toggle-appearance-standard{color:var(--mat-standard-button-toggle-text-color);background-color:var(--mat-standard-button-toggle-background-color);font-family:var(--mat-standard-button-toggle-label-text-font);font-size:var(--mat-standard-button-toggle-label-text-size);line-height:var(--mat-standard-button-toggle-label-text-line-height);font-weight:var(--mat-standard-button-toggle-label-text-weight);letter-spacing:var(--mat-standard-button-toggle-label-text-tracking)}.mat-button-toggle-group-appearance-standard .mat-button-toggle-appearance-standard+.mat-button-toggle-appearance-standard{border-left:solid 1px var(--mat-standard-button-toggle-divider-color)}[dir=rtl] .mat-button-toggle-group-appearance-standard .mat-button-toggle-appearance-standard+.mat-button-toggle-appearance-standard{border-left:none;border-right:solid 1px var(--mat-standard-button-toggle-divider-color)}.mat-button-toggle-group-appearance-standard.mat-button-toggle-vertical .mat-button-toggle-appearance-standard+.mat-button-toggle-appearance-standard{border-left:none;border-right:none;border-top:solid 1px var(--mat-standard-button-toggle-divider-color)}.mat-button-toggle-appearance-standard.mat-button-toggle-checked{color:var(--mat-standard-button-toggle-selected-state-text-color);background-color:var(--mat-standard-button-toggle-selected-state-background-color)}.mat-button-toggle-appearance-standard.mat-button-toggle-disabled{color:var(--mat-standard-button-toggle-disabled-state-text-color);background-color:var(--mat-standard-button-toggle-disabled-state-background-color)}.mat-button-toggle-appearance-standard.mat-button-toggle-disabled .mat-pseudo-checkbox{--mat-minimal-pseudo-checkbox-disabled-selected-checkmark-color: var( --mat-standard-button-toggle-disabled-selected-state-text-color )}.mat-button-toggle-appearance-standard.mat-button-toggle-disabled.mat-button-toggle-checked{color:var(--mat-standard-button-toggle-disabled-selected-state-text-color);background-color:var(--mat-standard-button-toggle-disabled-selected-state-background-color)}.mat-button-toggle-appearance-standard .mat-button-toggle-focus-overlay{background-color:var(--mat-standard-button-toggle-state-layer-color)}.mat-button-toggle-appearance-standard:not(.mat-button-toggle-disabled):hover .mat-button-toggle-focus-overlay{opacity:var(--mat-standard-button-toggle-hover-state-layer-opacity)}.mat-button-toggle-appearance-standard.cdk-keyboard-focused:not(.mat-button-toggle-disabled) .mat-button-toggle-focus-overlay{opacity:var(--mat-standard-button-toggle-focus-state-layer-opacity)}@media(hover: none){.mat-button-toggle-appearance-standard:not(.mat-button-toggle-disabled):hover .mat-button-toggle-focus-overlay{display:none}}.mat-button-toggle-label-content{-webkit-user-select:none;user-select:none;display:inline-block;padding:0 16px;line-height:var(--mat-legacy-button-toggle-height);position:relative}.mat-button-toggle-appearance-standard .mat-button-toggle-label-content{padding:0 12px;line-height:var(--mat-standard-button-toggle-height)}.mat-button-toggle-label-content>*{vertical-align:middle}.mat-button-toggle-focus-overlay{top:0;left:0;right:0;bottom:0;position:absolute;border-radius:inherit;pointer-events:none;opacity:0;background-color:var(--mat-legacy-button-toggle-state-layer-color)}.cdk-high-contrast-active .mat-button-toggle-checked .mat-button-toggle-focus-overlay{border-bottom:solid 500px;opacity:.5;height:0}.cdk-high-contrast-active .mat-button-toggle-checked:hover .mat-button-toggle-focus-overlay{opacity:.6}.cdk-high-contrast-active .mat-button-toggle-checked.mat-button-toggle-appearance-standard .mat-button-toggle-focus-overlay{border-bottom:solid 500px}.mat-button-toggle .mat-button-toggle-ripple{top:0;left:0;right:0;bottom:0;position:absolute;pointer-events:none}.mat-button-toggle-button{border:0;background:none;color:inherit;padding:0;margin:0;font:inherit;outline:none;width:100%;cursor:pointer}.mat-button-toggle-disabled .mat-button-toggle-button{cursor:default}.mat-button-toggle-button::-moz-focus-inner{border:0}"] }]
|
|
560
|
+
}, standalone: true, imports: [MatRipple, MatPseudoCheckbox], template: "<button #button class=\"mat-button-toggle-button mat-focus-indicator\"\n type=\"button\"\n [id]=\"buttonId\"\n [attr.role]=\"isSingleSelector() ? 'radio' : 'button'\"\n [attr.tabindex]=\"disabled ? -1 : tabIndex\"\n [attr.aria-pressed]=\"!isSingleSelector() ? checked : null\"\n [attr.aria-checked]=\"isSingleSelector() ? checked : null\"\n [disabled]=\"disabled || null\"\n [attr.name]=\"_getButtonName()\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n (click)=\"_onButtonClick()\">\n <span class=\"mat-button-toggle-label-content\">\n <!-- Render checkmark at the beginning for single-selection. -->\n @if (buttonToggleGroup && checked && !buttonToggleGroup.multiple && !buttonToggleGroup.hideSingleSelectionIndicator) {\n <mat-pseudo-checkbox\n class=\"mat-mdc-option-pseudo-checkbox\"\n [disabled]=\"disabled\"\n state=\"checked\"\n aria-hidden=\"true\"\n appearance=\"minimal\"></mat-pseudo-checkbox>\n }\n <!-- Render checkmark at the beginning for multiple-selection. -->\n @if (buttonToggleGroup && checked && buttonToggleGroup.multiple && !buttonToggleGroup.hideMultipleSelectionIndicator) {\n <mat-pseudo-checkbox\n class=\"mat-mdc-option-pseudo-checkbox\"\n [disabled]=\"disabled\"\n state=\"checked\"\n aria-hidden=\"true\"\n appearance=\"minimal\"></mat-pseudo-checkbox>\n }\n <ng-content></ng-content>\n </span>\n</button>\n\n<span class=\"mat-button-toggle-focus-overlay\"></span>\n<span class=\"mat-button-toggle-ripple\" matRipple\n [matRippleTrigger]=\"button\"\n [matRippleDisabled]=\"this.disableRipple || this.disabled\">\n</span>\n", styles: [".mat-button-toggle-standalone,.mat-button-toggle-group{position:relative;display:inline-flex;flex-direction:row;white-space:nowrap;overflow:hidden;-webkit-tap-highlight-color:rgba(0,0,0,0);transform:translateZ(0);border-radius:var(--mat-legacy-button-toggle-shape)}.mat-button-toggle-standalone:not([class*=mat-elevation-z]),.mat-button-toggle-group:not([class*=mat-elevation-z]){box-shadow:0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12)}.cdk-high-contrast-active .mat-button-toggle-standalone,.cdk-high-contrast-active .mat-button-toggle-group{outline:solid 1px}.mat-button-toggle-standalone.mat-button-toggle-appearance-standard,.mat-button-toggle-group-appearance-standard{border-radius:var(--mat-standard-button-toggle-shape);border:solid 1px var(--mat-standard-button-toggle-divider-color)}.mat-button-toggle-standalone.mat-button-toggle-appearance-standard .mat-pseudo-checkbox,.mat-button-toggle-group-appearance-standard .mat-pseudo-checkbox{--mat-minimal-pseudo-checkbox-selected-checkmark-color: var( --mat-standard-button-toggle-selected-state-text-color )}.mat-button-toggle-standalone.mat-button-toggle-appearance-standard:not([class*=mat-elevation-z]),.mat-button-toggle-group-appearance-standard:not([class*=mat-elevation-z]){box-shadow:none}.cdk-high-contrast-active .mat-button-toggle-standalone.mat-button-toggle-appearance-standard,.cdk-high-contrast-active .mat-button-toggle-group-appearance-standard{outline:0}.mat-button-toggle-vertical{flex-direction:column}.mat-button-toggle-vertical .mat-button-toggle-label-content{display:block}.mat-button-toggle{white-space:nowrap;position:relative;color:var(--mat-legacy-button-toggle-text-color);font-family:var(--mat-legacy-button-toggle-label-text-font);font-size:var(--mat-legacy-button-toggle-label-text-size);line-height:var(--mat-legacy-button-toggle-label-text-line-height);font-weight:var(--mat-legacy-button-toggle-label-text-weight);letter-spacing:var(--mat-legacy-button-toggle-label-text-tracking);--mat-minimal-pseudo-checkbox-selected-checkmark-color: var( --mat-legacy-button-toggle-selected-state-text-color )}.mat-button-toggle.cdk-keyboard-focused .mat-button-toggle-focus-overlay{opacity:var(--mat-legacy-button-toggle-focus-state-layer-opacity)}.mat-button-toggle .mat-icon svg{vertical-align:top}.mat-button-toggle .mat-pseudo-checkbox{margin-right:12px}[dir=rtl] .mat-button-toggle .mat-pseudo-checkbox{margin-right:0;margin-left:12px}.mat-button-toggle-checked{color:var(--mat-legacy-button-toggle-selected-state-text-color);background-color:var(--mat-legacy-button-toggle-selected-state-background-color)}.mat-button-toggle-disabled{color:var(--mat-legacy-button-toggle-disabled-state-text-color);background-color:var(--mat-legacy-button-toggle-disabled-state-background-color);--mat-minimal-pseudo-checkbox-disabled-selected-checkmark-color: var( --mat-legacy-button-toggle-disabled-state-text-color )}.mat-button-toggle-disabled.mat-button-toggle-checked{background-color:var(--mat-legacy-button-toggle-disabled-selected-state-background-color)}.mat-button-toggle-appearance-standard{color:var(--mat-standard-button-toggle-text-color);background-color:var(--mat-standard-button-toggle-background-color);font-family:var(--mat-standard-button-toggle-label-text-font);font-size:var(--mat-standard-button-toggle-label-text-size);line-height:var(--mat-standard-button-toggle-label-text-line-height);font-weight:var(--mat-standard-button-toggle-label-text-weight);letter-spacing:var(--mat-standard-button-toggle-label-text-tracking)}.mat-button-toggle-group-appearance-standard .mat-button-toggle-appearance-standard+.mat-button-toggle-appearance-standard{border-left:solid 1px var(--mat-standard-button-toggle-divider-color)}[dir=rtl] .mat-button-toggle-group-appearance-standard .mat-button-toggle-appearance-standard+.mat-button-toggle-appearance-standard{border-left:none;border-right:solid 1px var(--mat-standard-button-toggle-divider-color)}.mat-button-toggle-group-appearance-standard.mat-button-toggle-vertical .mat-button-toggle-appearance-standard+.mat-button-toggle-appearance-standard{border-left:none;border-right:none;border-top:solid 1px var(--mat-standard-button-toggle-divider-color)}.mat-button-toggle-appearance-standard.mat-button-toggle-checked{color:var(--mat-standard-button-toggle-selected-state-text-color);background-color:var(--mat-standard-button-toggle-selected-state-background-color)}.mat-button-toggle-appearance-standard.mat-button-toggle-disabled{color:var(--mat-standard-button-toggle-disabled-state-text-color);background-color:var(--mat-standard-button-toggle-disabled-state-background-color)}.mat-button-toggle-appearance-standard.mat-button-toggle-disabled .mat-pseudo-checkbox{--mat-minimal-pseudo-checkbox-disabled-selected-checkmark-color: var( --mat-standard-button-toggle-disabled-selected-state-text-color )}.mat-button-toggle-appearance-standard.mat-button-toggle-disabled.mat-button-toggle-checked{color:var(--mat-standard-button-toggle-disabled-selected-state-text-color);background-color:var(--mat-standard-button-toggle-disabled-selected-state-background-color)}.mat-button-toggle-appearance-standard .mat-button-toggle-focus-overlay{background-color:var(--mat-standard-button-toggle-state-layer-color)}.mat-button-toggle-appearance-standard:not(.mat-button-toggle-disabled):hover .mat-button-toggle-focus-overlay{opacity:var(--mat-standard-button-toggle-hover-state-layer-opacity)}.mat-button-toggle-appearance-standard.cdk-keyboard-focused:not(.mat-button-toggle-disabled) .mat-button-toggle-focus-overlay{opacity:var(--mat-standard-button-toggle-focus-state-layer-opacity)}@media(hover: none){.mat-button-toggle-appearance-standard:not(.mat-button-toggle-disabled):hover .mat-button-toggle-focus-overlay{display:none}}.mat-button-toggle-label-content{-webkit-user-select:none;user-select:none;display:inline-block;padding:0 16px;line-height:var(--mat-legacy-button-toggle-height);position:relative}.mat-button-toggle-appearance-standard .mat-button-toggle-label-content{padding:0 12px;line-height:var(--mat-standard-button-toggle-height)}.mat-button-toggle-label-content>*{vertical-align:middle}.mat-button-toggle-focus-overlay{top:0;left:0;right:0;bottom:0;position:absolute;border-radius:inherit;pointer-events:none;opacity:0;background-color:var(--mat-legacy-button-toggle-state-layer-color)}.cdk-high-contrast-active .mat-button-toggle-checked .mat-button-toggle-focus-overlay{border-bottom:solid 500px;opacity:.5;height:0}.cdk-high-contrast-active .mat-button-toggle-checked:hover .mat-button-toggle-focus-overlay{opacity:.6}.cdk-high-contrast-active .mat-button-toggle-checked.mat-button-toggle-appearance-standard .mat-button-toggle-focus-overlay{border-bottom:solid 500px}.mat-button-toggle .mat-button-toggle-ripple{top:0;left:0;right:0;bottom:0;position:absolute;pointer-events:none}.mat-button-toggle-button{border:0;background:none;color:inherit;padding:0;margin:0;font:inherit;outline:none;width:100%;cursor:pointer}.mat-button-toggle-disabled .mat-button-toggle-button{cursor:default}.mat-button-toggle-button::-moz-focus-inner{border:0}.mat-button-toggle-standalone.mat-button-toggle-appearance-standard{--mat-focus-indicator-border-radius:var(--mat-standard-button-toggle-shape)}.mat-button-toggle-group-appearance-standard .mat-button-toggle:last-of-type .mat-button-toggle-button::before{border-top-right-radius:var(--mat-standard-button-toggle-shape);border-bottom-right-radius:var(--mat-standard-button-toggle-shape)}.mat-button-toggle-group-appearance-standard .mat-button-toggle:first-of-type .mat-button-toggle-button::before{border-top-left-radius:var(--mat-standard-button-toggle-shape);border-bottom-left-radius:var(--mat-standard-button-toggle-shape)}"] }]
|
|
460
561
|
}], ctorParameters: () => [{ type: MatButtonToggleGroup, decorators: [{
|
|
461
562
|
type: Optional
|
|
462
563
|
}, {
|
|
463
564
|
type: Inject,
|
|
464
565
|
args: [MAT_BUTTON_TOGGLE_GROUP]
|
|
465
|
-
}] }, { type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type:
|
|
566
|
+
}] }, { type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i2.FocusMonitor }, { type: undefined, decorators: [{
|
|
466
567
|
type: Attribute,
|
|
467
568
|
args: ['tabindex']
|
|
468
569
|
}] }, { type: undefined, decorators: [{
|
|
@@ -503,11 +604,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.0",
|
|
|
503
604
|
}] } });
|
|
504
605
|
|
|
505
606
|
class MatButtonToggleModule {
|
|
506
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.
|
|
507
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.0-next.
|
|
508
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.0-next.
|
|
607
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.1", ngImport: i0, type: MatButtonToggleModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
608
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.0-next.1", ngImport: i0, type: MatButtonToggleModule, imports: [MatCommonModule, MatRippleModule, MatButtonToggleGroup, MatButtonToggle], exports: [MatCommonModule, MatButtonToggleGroup, MatButtonToggle] }); }
|
|
609
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.0-next.1", ngImport: i0, type: MatButtonToggleModule, imports: [MatCommonModule, MatRippleModule, MatButtonToggle, MatCommonModule] }); }
|
|
509
610
|
}
|
|
510
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.
|
|
611
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.1", ngImport: i0, type: MatButtonToggleModule, decorators: [{
|
|
511
612
|
type: NgModule,
|
|
512
613
|
args: [{
|
|
513
614
|
imports: [MatCommonModule, MatRippleModule, MatButtonToggleGroup, MatButtonToggle],
|