@angular/material 14.0.0-next.1 → 14.0.0-next.12
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/_index.scss +20 -1
- package/autocomplete/autocomplete-origin.d.ts +2 -2
- package/autocomplete/autocomplete-trigger.d.ts +16 -5
- package/autocomplete/autocomplete.d.ts +8 -2
- package/badge/_badge-theme.scss +11 -2
- package/badge/badge.d.ts +1 -1
- package/bottom-sheet/bottom-sheet-container.d.ts +1 -1
- package/button/button.d.ts +2 -2
- package/button-toggle/_button-toggle-theme.scss +14 -2
- package/button-toggle/button-toggle.d.ts +2 -2
- package/card/card.d.ts +14 -14
- package/checkbox/_checkbox-theme.scss +1 -1
- package/checkbox/checkbox-required-validator.d.ts +1 -1
- package/checkbox/checkbox.d.ts +2 -2
- package/checkbox/testing/checkbox-harness-filters.d.ts +2 -0
- package/chips/chip-input.d.ts +3 -6
- package/chips/chip-list.d.ts +21 -6
- package/chips/chip.d.ts +7 -7
- package/core/_core.scss +5 -7
- package/core/common-behaviors/error-state.d.ts +1 -2
- package/core/datetime/index.d.ts +1 -2
- package/core/line/line.d.ts +1 -1
- package/core/option/optgroup.d.ts +2 -2
- package/core/option/option.d.ts +2 -2
- package/core/ripple/_ripple.scss +2 -2
- package/core/ripple/index.d.ts +1 -2
- package/core/ripple/ripple-ref.d.ts +2 -1
- package/core/ripple/ripple-renderer.d.ts +16 -3
- package/core/ripple/ripple.d.ts +1 -1
- package/core/selection/pseudo-checkbox/pseudo-checkbox.d.ts +1 -1
- package/core/style/_menu-common.scss +3 -2
- package/core/style/_vendor-prefixes.scss +1 -17
- package/core/theming/_theming.scss +10 -1
- package/core/typography/_typography.scss +51 -14
- package/datepicker/calendar-body.d.ts +34 -4
- package/datepicker/calendar.d.ts +2 -2
- package/datepicker/date-range-input-parts.d.ts +7 -4
- package/datepicker/date-range-input.d.ts +1 -1
- package/datepicker/date-range-picker.d.ts +1 -1
- package/datepicker/datepicker-actions.d.ts +3 -3
- package/datepicker/datepicker-base.d.ts +4 -2
- package/datepicker/datepicker-input-base.d.ts +1 -1
- package/datepicker/datepicker-input.d.ts +1 -1
- package/datepicker/datepicker-toggle.d.ts +2 -2
- package/datepicker/datepicker.d.ts +1 -1
- package/datepicker/month-view.d.ts +19 -1
- package/datepicker/multi-year-view.d.ts +19 -1
- package/datepicker/year-view.d.ts +19 -1
- package/dialog/dialog-animations.d.ts +10 -0
- package/dialog/dialog-config.d.ts +12 -1
- package/dialog/dialog-container.d.ts +14 -6
- package/dialog/dialog-content-directives.d.ts +8 -4
- package/dialog/dialog.d.ts +13 -7
- package/dialog/public-api.d.ts +1 -1
- package/dialog/testing/dialog-opener.d.ts +33 -0
- package/dialog/testing/public-api.d.ts +1 -0
- package/divider/divider.d.ts +1 -1
- package/esm2020/autocomplete/autocomplete-module.mjs +5 -5
- package/esm2020/autocomplete/autocomplete-origin.mjs +7 -7
- package/esm2020/autocomplete/autocomplete-trigger.mjs +102 -50
- package/esm2020/autocomplete/autocomplete.mjs +19 -9
- package/esm2020/autocomplete/testing/autocomplete-harness.mjs +7 -1
- package/esm2020/badge/badge-module.mjs +5 -5
- package/esm2020/badge/badge.mjs +4 -4
- package/esm2020/bottom-sheet/bottom-sheet-animations.mjs +10 -4
- package/esm2020/bottom-sheet/bottom-sheet-container.mjs +12 -7
- package/esm2020/bottom-sheet/bottom-sheet-module.mjs +5 -5
- package/esm2020/bottom-sheet/bottom-sheet.mjs +4 -4
- package/esm2020/button/button-module.mjs +5 -5
- package/esm2020/button/button.mjs +10 -10
- package/esm2020/button-toggle/button-toggle-module.mjs +5 -5
- package/esm2020/button-toggle/button-toggle.mjs +8 -8
- package/esm2020/card/card-module.mjs +5 -5
- package/esm2020/card/card.mjs +44 -44
- package/esm2020/checkbox/checkbox-module.mjs +9 -9
- package/esm2020/checkbox/checkbox-required-validator.mjs +4 -4
- package/esm2020/checkbox/checkbox.mjs +12 -8
- package/esm2020/checkbox/testing/checkbox-harness-filters.mjs +1 -1
- package/esm2020/checkbox/testing/checkbox-harness.mjs +3 -2
- package/esm2020/chips/chip-input.mjs +4 -4
- package/esm2020/chips/chip-list.mjs +34 -9
- package/esm2020/chips/chip.mjs +20 -17
- package/esm2020/chips/chips-module.mjs +5 -5
- package/esm2020/core/common-behaviors/common-module.mjs +5 -5
- package/esm2020/core/common-behaviors/error-state.mjs +1 -8
- package/esm2020/core/datetime/index.mjs +9 -11
- package/esm2020/core/datetime/native-date-adapter.mjs +4 -4
- package/esm2020/core/error/error-options.mjs +7 -7
- package/esm2020/core/line/line.mjs +8 -8
- package/esm2020/core/option/index.mjs +5 -5
- package/esm2020/core/option/optgroup.mjs +8 -8
- package/esm2020/core/option/option.mjs +10 -10
- package/esm2020/core/ripple/index.mjs +6 -7
- package/esm2020/core/ripple/ripple-ref.mjs +5 -2
- package/esm2020/core/ripple/ripple-renderer.mjs +112 -54
- package/esm2020/core/ripple/ripple.mjs +4 -4
- package/esm2020/core/selection/pseudo-checkbox/pseudo-checkbox-module.mjs +5 -5
- package/esm2020/core/selection/pseudo-checkbox/pseudo-checkbox.mjs +5 -5
- package/esm2020/core/version.mjs +1 -1
- package/esm2020/datepicker/calendar-body.mjs +57 -12
- package/esm2020/datepicker/calendar.mjs +27 -16
- package/esm2020/datepicker/date-range-input-parts.mjs +10 -10
- package/esm2020/datepicker/date-range-input.mjs +6 -6
- package/esm2020/datepicker/date-range-picker.mjs +4 -4
- package/esm2020/datepicker/date-range-selection-strategy.mjs +4 -4
- package/esm2020/datepicker/date-selection-model.mjs +10 -10
- package/esm2020/datepicker/datepicker-actions.mjs +12 -12
- package/esm2020/datepicker/datepicker-base.mjs +12 -20
- package/esm2020/datepicker/datepicker-input-base.mjs +12 -7
- package/esm2020/datepicker/datepicker-input.mjs +4 -4
- package/esm2020/datepicker/datepicker-intl.mjs +4 -4
- package/esm2020/datepicker/datepicker-module.mjs +5 -5
- package/esm2020/datepicker/datepicker-toggle.mjs +10 -10
- package/esm2020/datepicker/datepicker.mjs +4 -4
- package/esm2020/datepicker/month-view.mjs +38 -11
- package/esm2020/datepicker/multi-year-view.mjs +42 -10
- package/esm2020/datepicker/year-view.mjs +41 -10
- package/esm2020/dialog/dialog-animations.mjs +17 -4
- package/esm2020/dialog/dialog-config.mjs +8 -1
- package/esm2020/dialog/dialog-container.mjs +44 -26
- package/esm2020/dialog/dialog-content-directives.mjs +31 -15
- package/esm2020/dialog/dialog-module.mjs +5 -5
- package/esm2020/dialog/dialog.mjs +24 -40
- package/esm2020/dialog/public-api.mjs +2 -2
- package/esm2020/dialog/testing/dialog-opener.mjs +67 -0
- package/esm2020/dialog/testing/public-api.mjs +2 -1
- package/esm2020/divider/divider-module.mjs +5 -5
- package/esm2020/divider/divider.mjs +5 -5
- package/esm2020/expansion/accordion.mjs +4 -4
- package/esm2020/expansion/expansion-module.mjs +5 -5
- package/esm2020/expansion/expansion-panel-base.mjs +14 -0
- package/esm2020/expansion/expansion-panel-content.mjs +14 -7
- package/esm2020/expansion/expansion-panel-header.mjs +11 -11
- package/esm2020/expansion/expansion-panel.mjs +13 -10
- package/esm2020/expansion/public-api.mjs +2 -1
- package/esm2020/form-field/error.mjs +4 -4
- package/esm2020/form-field/form-field-control.mjs +4 -4
- package/esm2020/form-field/form-field-module.mjs +5 -5
- package/esm2020/form-field/form-field.mjs +22 -14
- package/esm2020/form-field/hint.mjs +4 -4
- package/esm2020/form-field/label.mjs +4 -4
- package/esm2020/form-field/placeholder.mjs +4 -4
- package/esm2020/form-field/prefix.mjs +4 -4
- package/esm2020/form-field/suffix.mjs +4 -4
- package/esm2020/form-field/testing/public-api.mjs +4 -4
- package/esm2020/grid-list/grid-list-module.mjs +5 -5
- package/esm2020/grid-list/grid-list.mjs +6 -6
- package/esm2020/grid-list/grid-tile.mjs +17 -17
- package/esm2020/icon/icon-module.mjs +5 -5
- package/esm2020/icon/icon-registry.mjs +12 -14
- package/esm2020/icon/icon.mjs +31 -28
- package/esm2020/icon/testing/fake-icon-registry.mjs +9 -9
- package/esm2020/input/input-module.mjs +5 -5
- package/esm2020/input/input.mjs +41 -24
- package/esm2020/list/list-module.mjs +5 -5
- package/esm2020/list/list.mjs +21 -23
- package/esm2020/list/selection-list.mjs +15 -38
- package/esm2020/list/testing/list-item-harness-base.mjs +1 -9
- package/esm2020/menu/menu-content.mjs +7 -7
- package/esm2020/menu/menu-errors.mjs +1 -12
- package/esm2020/menu/menu-item.mjs +10 -6
- package/esm2020/menu/menu-module.mjs +5 -5
- package/esm2020/menu/menu-trigger.mjs +73 -66
- package/esm2020/menu/menu.mjs +35 -14
- package/esm2020/paginator/paginator-intl.mjs +4 -4
- package/esm2020/paginator/paginator-module.mjs +5 -5
- package/esm2020/paginator/paginator.mjs +17 -13
- package/esm2020/paginator/testing/paginator-harness.mjs +11 -1
- package/esm2020/progress-bar/progress-bar-module.mjs +5 -5
- package/esm2020/progress-bar/progress-bar.mjs +8 -5
- package/esm2020/progress-spinner/progress-spinner-module.mjs +8 -8
- package/esm2020/progress-spinner/progress-spinner.mjs +14 -51
- package/esm2020/progress-spinner/public-api.mjs +10 -2
- package/esm2020/radio/radio-module.mjs +5 -5
- package/esm2020/radio/radio.mjs +42 -14
- package/esm2020/radio/testing/radio-harness-filters.mjs +1 -1
- package/esm2020/radio/testing/radio-harness.mjs +3 -2
- package/esm2020/select/select-module.mjs +5 -5
- package/esm2020/select/select.mjs +68 -30
- package/esm2020/sidenav/drawer.mjs +19 -14
- package/esm2020/sidenav/sidenav-module.mjs +7 -8
- package/esm2020/sidenav/sidenav.mjs +12 -12
- package/esm2020/slide-toggle/slide-toggle-module.mjs +9 -9
- package/esm2020/slide-toggle/slide-toggle-required-validator.mjs +4 -4
- package/esm2020/slide-toggle/slide-toggle.mjs +6 -5
- package/esm2020/slide-toggle/testing/slide-toggle-harness-filters.mjs +1 -1
- package/esm2020/slide-toggle/testing/slide-toggle-harness.mjs +4 -2
- package/esm2020/slider/slider-module.mjs +5 -5
- package/esm2020/slider/slider.mjs +5 -5
- package/esm2020/snack-bar/simple-snack-bar.mjs +7 -7
- package/esm2020/snack-bar/snack-bar-container.mjs +24 -18
- package/esm2020/snack-bar/snack-bar-module.mjs +5 -5
- package/esm2020/snack-bar/snack-bar.mjs +7 -7
- package/esm2020/sort/sort-header-intl.mjs +4 -4
- package/esm2020/sort/sort-header.mjs +16 -8
- package/esm2020/sort/sort-module.mjs +5 -5
- package/esm2020/sort/sort.mjs +4 -4
- package/esm2020/stepper/public-api.mjs +2 -2
- package/esm2020/stepper/step-content.mjs +4 -4
- package/esm2020/stepper/step-header.mjs +8 -8
- package/esm2020/stepper/step-label.mjs +4 -4
- package/esm2020/stepper/stepper-animations.mjs +9 -3
- package/esm2020/stepper/stepper-button.mjs +7 -7
- package/esm2020/stepper/stepper-icon.mjs +4 -4
- package/esm2020/stepper/stepper-intl.mjs +4 -4
- package/esm2020/stepper/stepper-module.mjs +6 -10
- package/esm2020/stepper/stepper.mjs +42 -66
- package/esm2020/table/cell.mjs +22 -22
- package/esm2020/table/row.mjs +22 -22
- package/esm2020/table/table-module.mjs +5 -5
- package/esm2020/table/table.mjs +9 -9
- package/esm2020/table/text-column.mjs +5 -5
- package/esm2020/tabs/ink-bar.mjs +11 -22
- package/esm2020/tabs/paginated-tab-header.mjs +27 -13
- package/esm2020/tabs/tab-body.mjs +11 -11
- package/esm2020/tabs/tab-content.mjs +4 -4
- package/esm2020/tabs/tab-group.mjs +59 -18
- package/esm2020/tabs/tab-header.mjs +8 -8
- package/esm2020/tabs/tab-label-wrapper.mjs +4 -4
- package/esm2020/tabs/tab-label.mjs +4 -4
- package/esm2020/tabs/tab-nav-bar/tab-nav-bar.mjs +18 -18
- package/esm2020/tabs/tab.mjs +4 -4
- package/esm2020/tabs/tabs-module.mjs +5 -5
- package/esm2020/toolbar/toolbar-module.mjs +5 -5
- package/esm2020/toolbar/toolbar.mjs +8 -8
- package/esm2020/tooltip/testing/tooltip-harness.mjs +12 -7
- package/esm2020/tooltip/tooltip-module.mjs +5 -5
- package/esm2020/tooltip/tooltip.mjs +126 -51
- package/esm2020/tree/node.mjs +10 -10
- package/esm2020/tree/outlet.mjs +4 -4
- package/esm2020/tree/padding.mjs +4 -4
- package/esm2020/tree/toggle.mjs +4 -4
- package/esm2020/tree/tree-module.mjs +5 -5
- package/esm2020/tree/tree.mjs +5 -5
- package/expansion/accordion.d.ts +1 -1
- package/expansion/expansion-panel-base.d.ts +22 -0
- package/expansion/expansion-panel-content.d.ts +5 -3
- package/expansion/expansion-panel-header.d.ts +3 -3
- package/expansion/expansion-panel.d.ts +2 -2
- package/expansion/public-api.d.ts +1 -0
- package/fesm2015/autocomplete/testing.mjs +6 -0
- package/fesm2015/autocomplete/testing.mjs.map +1 -1
- package/fesm2015/autocomplete.mjs +131 -68
- package/fesm2015/autocomplete.mjs.map +1 -1
- package/fesm2015/badge/testing.mjs.map +1 -1
- package/fesm2015/badge.mjs +7 -7
- package/fesm2015/badge.mjs.map +1 -1
- package/fesm2015/bottom-sheet/testing.mjs.map +1 -1
- package/fesm2015/bottom-sheet.mjs +27 -16
- package/fesm2015/bottom-sheet.mjs.map +1 -1
- package/fesm2015/button/testing.mjs.map +1 -1
- package/fesm2015/button-toggle/testing.mjs.map +1 -1
- package/fesm2015/button-toggle.mjs +11 -11
- package/fesm2015/button-toggle.mjs.map +1 -1
- package/fesm2015/button.mjs +13 -13
- package/fesm2015/button.mjs.map +1 -1
- package/fesm2015/card/testing.mjs.map +1 -1
- package/fesm2015/card.mjs +47 -47
- package/fesm2015/card.mjs.map +1 -1
- package/fesm2015/checkbox/testing.mjs +2 -1
- package/fesm2015/checkbox/testing.mjs.map +1 -1
- package/fesm2015/checkbox.mjs +22 -18
- package/fesm2015/checkbox.mjs.map +1 -1
- package/fesm2015/chips/testing.mjs.map +1 -1
- package/fesm2015/chips.mjs +59 -31
- package/fesm2015/chips.mjs.map +1 -1
- package/fesm2015/core/testing.mjs.map +1 -1
- package/fesm2015/core.mjs +181 -126
- package/fesm2015/core.mjs.map +1 -1
- package/fesm2015/datepicker/testing.mjs.map +1 -1
- package/fesm2015/datepicker.mjs +273 -130
- package/fesm2015/datepicker.mjs.map +1 -1
- package/fesm2015/dialog/testing.mjs +65 -2
- package/fesm2015/dialog/testing.mjs.map +1 -1
- package/fesm2015/dialog.mjs +144 -106
- package/fesm2015/dialog.mjs.map +1 -1
- package/fesm2015/divider/testing.mjs.map +1 -1
- package/fesm2015/divider.mjs +8 -8
- package/fesm2015/divider.mjs.map +1 -1
- package/fesm2015/expansion/testing.mjs.map +1 -1
- package/fesm2015/expansion.mjs +56 -33
- package/fesm2015/expansion.mjs.map +1 -1
- package/fesm2015/form-field/testing/control.mjs.map +1 -1
- package/fesm2015/form-field/testing.mjs +1 -1
- package/fesm2015/form-field/testing.mjs.map +1 -1
- package/fesm2015/form-field.mjs +47 -38
- package/fesm2015/form-field.mjs.map +1 -1
- package/fesm2015/grid-list/testing.mjs.map +1 -1
- package/fesm2015/grid-list.mjs +25 -25
- package/fesm2015/grid-list.mjs.map +1 -1
- package/fesm2015/icon/testing.mjs +8 -8
- package/fesm2015/icon/testing.mjs.map +1 -1
- package/fesm2015/icon.mjs +45 -44
- package/fesm2015/icon.mjs.map +1 -1
- package/fesm2015/input/testing.mjs.map +1 -1
- package/fesm2015/input.mjs +45 -28
- package/fesm2015/input.mjs.map +1 -1
- package/fesm2015/list/testing.mjs +0 -10
- package/fesm2015/list/testing.mjs.map +1 -1
- package/fesm2015/list.mjs +41 -67
- package/fesm2015/list.mjs.map +1 -1
- package/fesm2015/material.mjs.map +1 -1
- package/fesm2015/menu/testing.mjs.map +1 -1
- package/fesm2015/menu.mjs +126 -101
- package/fesm2015/menu.mjs.map +1 -1
- package/fesm2015/paginator/testing.mjs +14 -0
- package/fesm2015/paginator/testing.mjs.map +1 -1
- package/fesm2015/paginator.mjs +23 -19
- package/fesm2015/paginator.mjs.map +1 -1
- package/fesm2015/progress-bar/testing.mjs.map +1 -1
- package/fesm2015/progress-bar.mjs +11 -8
- package/fesm2015/progress-bar.mjs.map +1 -1
- package/fesm2015/progress-spinner/testing.mjs.map +1 -1
- package/fesm2015/progress-spinner.mjs +31 -63
- package/fesm2015/progress-spinner.mjs.map +1 -1
- package/fesm2015/radio/testing.mjs +2 -1
- package/fesm2015/radio/testing.mjs.map +1 -1
- package/fesm2015/radio.mjs +46 -17
- package/fesm2015/radio.mjs.map +1 -1
- package/fesm2015/select/testing.mjs.map +1 -1
- package/fesm2015/select.mjs +72 -34
- package/fesm2015/select.mjs.map +1 -1
- package/fesm2015/sidenav/testing.mjs.map +1 -1
- package/fesm2015/sidenav.mjs +36 -32
- package/fesm2015/sidenav.mjs.map +1 -1
- package/fesm2015/slide-toggle/testing.mjs +3 -1
- package/fesm2015/slide-toggle/testing.mjs.map +1 -1
- package/fesm2015/slide-toggle.mjs +16 -15
- package/fesm2015/slide-toggle.mjs.map +1 -1
- package/fesm2015/slider/testing.mjs.map +1 -1
- package/fesm2015/slider.mjs +8 -8
- package/fesm2015/slider.mjs.map +1 -1
- package/fesm2015/snack-bar/testing.mjs.map +1 -1
- package/fesm2015/snack-bar.mjs +39 -33
- package/fesm2015/snack-bar.mjs.map +1 -1
- package/fesm2015/sort/testing.mjs.map +1 -1
- package/fesm2015/sort.mjs +128 -120
- package/fesm2015/sort.mjs.map +1 -1
- package/fesm2015/stepper/testing.mjs.map +1 -1
- package/fesm2015/stepper.mjs +75 -96
- package/fesm2015/stepper.mjs.map +1 -1
- package/fesm2015/table/testing.mjs.map +1 -1
- package/fesm2015/table.mjs +58 -58
- package/fesm2015/table.mjs.map +1 -1
- package/fesm2015/tabs/testing.mjs.map +1 -1
- package/fesm2015/tabs.mjs +139 -95
- package/fesm2015/tabs.mjs.map +1 -1
- package/fesm2015/toolbar/testing.mjs.map +1 -1
- package/fesm2015/toolbar.mjs +11 -11
- package/fesm2015/toolbar.mjs.map +1 -1
- package/fesm2015/tooltip/testing.mjs +11 -8
- package/fesm2015/tooltip/testing.mjs.map +1 -1
- package/fesm2015/tooltip.mjs +154 -79
- package/fesm2015/tooltip.mjs.map +1 -1
- package/fesm2015/tree/testing.mjs.map +1 -1
- package/fesm2015/tree.mjs +26 -26
- package/fesm2015/tree.mjs.map +1 -1
- package/fesm2020/autocomplete/testing.mjs +6 -0
- package/fesm2020/autocomplete/testing.mjs.map +1 -1
- package/fesm2020/autocomplete.mjs +130 -68
- package/fesm2020/autocomplete.mjs.map +1 -1
- package/fesm2020/badge/testing.mjs.map +1 -1
- package/fesm2020/badge.mjs +7 -7
- package/fesm2020/badge.mjs.map +1 -1
- package/fesm2020/bottom-sheet/testing.mjs.map +1 -1
- package/fesm2020/bottom-sheet.mjs +27 -16
- package/fesm2020/bottom-sheet.mjs.map +1 -1
- package/fesm2020/button/testing.mjs.map +1 -1
- package/fesm2020/button-toggle/testing.mjs.map +1 -1
- package/fesm2020/button-toggle.mjs +11 -11
- package/fesm2020/button-toggle.mjs.map +1 -1
- package/fesm2020/button.mjs +13 -13
- package/fesm2020/button.mjs.map +1 -1
- package/fesm2020/card/testing.mjs.map +1 -1
- package/fesm2020/card.mjs +47 -47
- package/fesm2020/card.mjs.map +1 -1
- package/fesm2020/checkbox/testing.mjs +2 -1
- package/fesm2020/checkbox/testing.mjs.map +1 -1
- package/fesm2020/checkbox.mjs +22 -18
- package/fesm2020/checkbox.mjs.map +1 -1
- package/fesm2020/chips/testing.mjs.map +1 -1
- package/fesm2020/chips.mjs +59 -31
- package/fesm2020/chips.mjs.map +1 -1
- package/fesm2020/core/testing.mjs.map +1 -1
- package/fesm2020/core.mjs +180 -126
- package/fesm2020/core.mjs.map +1 -1
- package/fesm2020/datepicker/testing.mjs.map +1 -1
- package/fesm2020/datepicker.mjs +273 -130
- package/fesm2020/datepicker.mjs.map +1 -1
- package/fesm2020/dialog/testing.mjs +65 -1
- package/fesm2020/dialog/testing.mjs.map +1 -1
- package/fesm2020/dialog.mjs +143 -106
- package/fesm2020/dialog.mjs.map +1 -1
- package/fesm2020/divider/testing.mjs.map +1 -1
- package/fesm2020/divider.mjs +8 -8
- package/fesm2020/divider.mjs.map +1 -1
- package/fesm2020/expansion/testing.mjs.map +1 -1
- package/fesm2020/expansion.mjs +54 -33
- package/fesm2020/expansion.mjs.map +1 -1
- package/fesm2020/form-field/testing/control.mjs.map +1 -1
- package/fesm2020/form-field/testing.mjs +1 -1
- package/fesm2020/form-field/testing.mjs.map +1 -1
- package/fesm2020/form-field.mjs +46 -38
- package/fesm2020/form-field.mjs.map +1 -1
- package/fesm2020/grid-list/testing.mjs.map +1 -1
- package/fesm2020/grid-list.mjs +25 -25
- package/fesm2020/grid-list.mjs.map +1 -1
- package/fesm2020/icon/testing.mjs +8 -8
- package/fesm2020/icon/testing.mjs.map +1 -1
- package/fesm2020/icon.mjs +45 -44
- package/fesm2020/icon.mjs.map +1 -1
- package/fesm2020/input/testing.mjs.map +1 -1
- package/fesm2020/input.mjs +44 -27
- package/fesm2020/input.mjs.map +1 -1
- package/fesm2020/list/testing.mjs +0 -8
- package/fesm2020/list/testing.mjs.map +1 -1
- package/fesm2020/list.mjs +38 -63
- package/fesm2020/list.mjs.map +1 -1
- package/fesm2020/material.mjs.map +1 -1
- package/fesm2020/menu/testing.mjs.map +1 -1
- package/fesm2020/menu.mjs +122 -101
- package/fesm2020/menu.mjs.map +1 -1
- package/fesm2020/paginator/testing.mjs +10 -0
- package/fesm2020/paginator/testing.mjs.map +1 -1
- package/fesm2020/paginator.mjs +23 -19
- package/fesm2020/paginator.mjs.map +1 -1
- package/fesm2020/progress-bar/testing.mjs.map +1 -1
- package/fesm2020/progress-bar.mjs +11 -8
- package/fesm2020/progress-bar.mjs.map +1 -1
- package/fesm2020/progress-spinner/testing.mjs.map +1 -1
- package/fesm2020/progress-spinner.mjs +31 -61
- package/fesm2020/progress-spinner.mjs.map +1 -1
- package/fesm2020/radio/testing.mjs +2 -1
- package/fesm2020/radio/testing.mjs.map +1 -1
- package/fesm2020/radio.mjs +45 -17
- package/fesm2020/radio.mjs.map +1 -1
- package/fesm2020/select/testing.mjs.map +1 -1
- package/fesm2020/select.mjs +72 -34
- package/fesm2020/select.mjs.map +1 -1
- package/fesm2020/sidenav/testing.mjs.map +1 -1
- package/fesm2020/sidenav.mjs +36 -32
- package/fesm2020/sidenav.mjs.map +1 -1
- package/fesm2020/slide-toggle/testing.mjs +3 -1
- package/fesm2020/slide-toggle/testing.mjs.map +1 -1
- package/fesm2020/slide-toggle.mjs +16 -15
- package/fesm2020/slide-toggle.mjs.map +1 -1
- package/fesm2020/slider/testing.mjs.map +1 -1
- package/fesm2020/slider.mjs +8 -8
- package/fesm2020/slider.mjs.map +1 -1
- package/fesm2020/snack-bar/testing.mjs.map +1 -1
- package/fesm2020/snack-bar.mjs +39 -33
- package/fesm2020/snack-bar.mjs.map +1 -1
- package/fesm2020/sort/testing.mjs.map +1 -1
- package/fesm2020/sort.mjs +24 -16
- package/fesm2020/sort.mjs.map +1 -1
- package/fesm2020/stepper/testing.mjs.map +1 -1
- package/fesm2020/stepper.mjs +75 -96
- package/fesm2020/stepper.mjs.map +1 -1
- package/fesm2020/table/testing.mjs.map +1 -1
- package/fesm2020/table.mjs +58 -58
- package/fesm2020/table.mjs.map +1 -1
- package/fesm2020/tabs/testing.mjs.map +1 -1
- package/fesm2020/tabs.mjs +138 -95
- package/fesm2020/tabs.mjs.map +1 -1
- package/fesm2020/toolbar/testing.mjs.map +1 -1
- package/fesm2020/toolbar.mjs +11 -11
- package/fesm2020/toolbar.mjs.map +1 -1
- package/fesm2020/tooltip/testing.mjs +11 -6
- package/fesm2020/tooltip/testing.mjs.map +1 -1
- package/fesm2020/tooltip.mjs +147 -71
- package/fesm2020/tooltip.mjs.map +1 -1
- package/fesm2020/tree/testing.mjs.map +1 -1
- package/fesm2020/tree.mjs +26 -26
- package/fesm2020/tree.mjs.map +1 -1
- package/form-field/error.d.ts +1 -1
- package/form-field/form-field-control.d.ts +4 -4
- package/form-field/form-field.d.ts +16 -9
- package/form-field/hint.d.ts +1 -1
- package/form-field/label.d.ts +1 -1
- package/form-field/placeholder.d.ts +1 -1
- package/form-field/prefix.d.ts +1 -1
- package/form-field/suffix.d.ts +1 -1
- package/form-field/testing/public-api.d.ts +1 -1
- package/grid-list/grid-list.d.ts +1 -1
- package/grid-list/grid-tile.d.ts +5 -5
- package/icon/icon-registry.d.ts +7 -9
- package/icon/icon.d.ts +13 -4
- package/icon/testing/fake-icon-registry.d.ts +1 -1
- package/input/input.d.ts +13 -2
- package/list/list.d.ts +6 -6
- package/list/selection-list.d.ts +5 -22
- package/list/testing/list-item-harness-base.d.ts +1 -7
- package/menu/menu-content.d.ts +2 -2
- package/menu/menu-errors.d.ts +0 -5
- package/menu/menu-item.d.ts +4 -3
- package/menu/menu-trigger.d.ts +23 -13
- package/menu/menu.d.ts +9 -4
- package/package.json +7 -7
- package/paginator/paginator.d.ts +13 -2
- package/paginator/testing/paginator-harness.d.ts +3 -0
- package/prebuilt-themes/deeppurple-amber.css +1 -1
- package/prebuilt-themes/indigo-pink.css +1 -1
- package/prebuilt-themes/pink-bluegrey.css +1 -1
- package/prebuilt-themes/purple-green.css +1 -1
- package/progress-bar/progress-bar.d.ts +1 -1
- package/progress-spinner/progress-spinner-module.d.ts +1 -1
- package/progress-spinner/progress-spinner.d.ts +4 -19
- package/progress-spinner/public-api.d.ts +8 -1
- package/radio/radio.d.ts +11 -6
- package/radio/testing/radio-harness-filters.d.ts +2 -0
- package/schematics/collection.json +4 -2
- package/schematics/migration.json +5 -0
- package/schematics/ng-add/fonts/material-fonts.js +4 -13
- package/schematics/ng-add/fonts/material-fonts.mjs +4 -13
- package/schematics/ng-add/index.js +2 -2
- package/schematics/ng-add/index.mjs +2 -2
- package/schematics/ng-add/schema.d.ts +2 -2
- package/schematics/ng-add/schema.js +1 -1
- package/schematics/ng-add/schema.json +29 -9
- package/schematics/ng-add/schema.mjs +1 -1
- package/schematics/ng-add/setup-project.js +16 -23
- package/schematics/ng-add/setup-project.mjs +16 -23
- package/schematics/ng-add/theming/theming.js +28 -39
- package/schematics/ng-add/theming/theming.mjs +28 -39
- package/schematics/ng-generate/address-form/index.js +5 -14
- package/schematics/ng-generate/address-form/index.mjs +5 -14
- package/schematics/ng-generate/address-form/schema.json +1 -1
- package/schematics/ng-generate/dashboard/index.js +5 -14
- package/schematics/ng-generate/dashboard/index.mjs +5 -14
- package/schematics/ng-generate/dashboard/schema.json +1 -1
- package/schematics/ng-generate/navigation/index.js +5 -14
- package/schematics/ng-generate/navigation/index.mjs +5 -14
- package/schematics/ng-generate/navigation/schema.json +1 -1
- package/schematics/ng-generate/table/index.js +5 -14
- package/schematics/ng-generate/table/index.mjs +5 -14
- package/schematics/ng-generate/table/schema.json +1 -1
- package/schematics/ng-generate/tree/index.js +5 -14
- package/schematics/ng-generate/tree/index.mjs +5 -14
- package/schematics/ng-generate/tree/schema.json +1 -1
- package/schematics/ng-update/data/constructor-checks.js +11 -1
- package/schematics/ng-update/data/constructor-checks.mjs +11 -1
- package/schematics/ng-update/data/css-selectors.js +7 -1
- package/schematics/ng-update/data/css-selectors.mjs +7 -1
- package/schematics/ng-update/data/index.js +6 -2
- package/schematics/ng-update/data/index.mjs +6 -2
- package/schematics/ng-update/index.d.ts +2 -0
- package/schematics/ng-update/index.js +7 -2
- package/schematics/ng-update/index.mjs +7 -2
- package/schematics/ng-update/migrations/hammer-gestures-v9/gesture-config.template +1 -1
- package/schematics/ng-update/migrations/hammer-gestures-v9/hammer-gestures-migration.js +8 -8
- package/schematics/ng-update/migrations/hammer-gestures-v9/hammer-gestures-migration.mjs +8 -8
- package/schematics/ng-update/migrations/hammer-gestures-v9/import-manager.js +14 -23
- package/schematics/ng-update/migrations/hammer-gestures-v9/import-manager.mjs +14 -23
- package/schematics/ng-update/migrations/package-imports-v8/secondary-entry-points-migration.js +3 -15
- package/schematics/ng-update/migrations/package-imports-v8/secondary-entry-points-migration.mjs +3 -15
- package/schematics/ng-update/migrations/theming-api-v12/migration.js +5 -5
- package/schematics/ng-update/migrations/theming-api-v12/migration.mjs +5 -5
- package/schematics/tsconfig.json +1 -4
- package/select/select.d.ts +27 -6
- package/sidenav/drawer.d.ts +3 -3
- package/sidenav/sidenav-module.d.ts +2 -3
- package/sidenav/sidenav.d.ts +3 -3
- package/slide-toggle/slide-toggle-required-validator.d.ts +1 -1
- package/slide-toggle/slide-toggle.d.ts +1 -1
- package/slide-toggle/testing/slide-toggle-harness-filters.d.ts +4 -0
- package/slider/slider.d.ts +1 -1
- package/snack-bar/simple-snack-bar.d.ts +1 -1
- package/snack-bar/snack-bar-container.d.ts +1 -1
- package/snack-bar/snack-bar.d.ts +1 -1
- package/sort/sort-header.d.ts +6 -6
- package/sort/sort.d.ts +7 -3
- package/stepper/public-api.d.ts +1 -1
- package/stepper/step-content.d.ts +1 -1
- package/stepper/step-header.d.ts +1 -1
- package/stepper/step-label.d.ts +1 -1
- package/stepper/stepper-animations.d.ts +2 -0
- package/stepper/stepper-button.d.ts +2 -2
- package/stepper/stepper-icon.d.ts +1 -1
- package/stepper/stepper-module.d.ts +1 -1
- package/stepper/stepper.d.ts +16 -39
- package/table/cell.d.ts +7 -7
- package/table/row.d.ts +7 -7
- package/table/table.d.ts +2 -2
- package/table/text-column.d.ts +1 -1
- package/tabs/_tabs-common.scss +6 -5
- package/tabs/ink-bar.d.ts +1 -6
- package/tabs/paginated-tab-header.d.ts +5 -3
- package/tabs/tab-body.d.ts +3 -3
- package/tabs/tab-content.d.ts +1 -1
- package/tabs/tab-group.d.ts +11 -5
- package/tabs/tab-header.d.ts +2 -2
- package/tabs/tab-label-wrapper.d.ts +1 -1
- package/tabs/tab-label.d.ts +1 -1
- package/tabs/tab-nav-bar/tab-nav-bar.d.ts +5 -5
- package/tabs/tab.d.ts +1 -1
- package/toolbar/toolbar.d.ts +2 -2
- package/tooltip/testing/tooltip-harness.d.ts +6 -0
- package/tooltip/tooltip.d.ts +40 -12
- package/tree/node.d.ts +3 -3
- package/tree/outlet.d.ts +1 -1
- package/tree/padding.d.ts +1 -1
- package/tree/toggle.d.ts +1 -1
- package/tree/tree.d.ts +1 -1
package/fesm2020/tabs.mjs
CHANGED
|
@@ -2,20 +2,20 @@ import * as i7 from '@angular/cdk/a11y';
|
|
|
2
2
|
import { FocusKeyManager, A11yModule } from '@angular/cdk/a11y';
|
|
3
3
|
import * as i5 from '@angular/cdk/observers';
|
|
4
4
|
import { ObserversModule } from '@angular/cdk/observers';
|
|
5
|
-
import * as
|
|
5
|
+
import * as i2 from '@angular/cdk/portal';
|
|
6
6
|
import { CdkPortal, TemplatePortal, CdkPortalOutlet, PortalModule } from '@angular/cdk/portal';
|
|
7
|
-
import * as
|
|
7
|
+
import * as i1$2 from '@angular/common';
|
|
8
8
|
import { DOCUMENT, CommonModule } from '@angular/common';
|
|
9
9
|
import * as i0 from '@angular/core';
|
|
10
10
|
import { InjectionToken, Directive, Inject, Optional, TemplateRef, Component, ChangeDetectionStrategy, ViewEncapsulation, ContentChild, ViewChild, Input, forwardRef, EventEmitter, Output, ContentChildren, QueryList, Attribute, NgModule } from '@angular/core';
|
|
11
11
|
import * as i4 from '@angular/material/core';
|
|
12
12
|
import { mixinDisabled, mixinColor, mixinDisableRipple, mixinTabIndex, MAT_RIPPLE_GLOBAL_OPTIONS, RippleRenderer, MatCommonModule, MatRippleModule } from '@angular/material/core';
|
|
13
13
|
import { ANIMATION_MODULE_TYPE } from '@angular/platform-browser/animations';
|
|
14
|
+
import { take, startWith, distinctUntilChanged, takeUntil } from 'rxjs/operators';
|
|
14
15
|
import { Subject, Subscription, fromEvent, of, merge, timer } from 'rxjs';
|
|
15
16
|
import * as i1 from '@angular/cdk/bidi';
|
|
16
17
|
import { trigger, state, style, transition, animate } from '@angular/animations';
|
|
17
|
-
import {
|
|
18
|
-
import { coerceNumberProperty, coerceBooleanProperty } from '@angular/cdk/coercion';
|
|
18
|
+
import { coerceBooleanProperty, coerceNumberProperty } from '@angular/cdk/coercion';
|
|
19
19
|
import * as i1$1 from '@angular/cdk/scrolling';
|
|
20
20
|
import * as i3 from '@angular/cdk/platform';
|
|
21
21
|
import { normalizePassiveListenerOptions } from '@angular/cdk/platform';
|
|
@@ -62,14 +62,12 @@ class MatInkBar {
|
|
|
62
62
|
*/
|
|
63
63
|
alignToElement(element) {
|
|
64
64
|
this.show();
|
|
65
|
-
|
|
66
|
-
this.
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
this._setStyles(element);
|
|
72
|
-
}
|
|
65
|
+
this._ngZone.onStable.pipe(take(1)).subscribe(() => {
|
|
66
|
+
const positions = this._inkBarPositioner(element);
|
|
67
|
+
const inkBar = this._elementRef.nativeElement;
|
|
68
|
+
inkBar.style.left = positions.left;
|
|
69
|
+
inkBar.style.width = positions.width;
|
|
70
|
+
});
|
|
73
71
|
}
|
|
74
72
|
/** Shows the ink bar. */
|
|
75
73
|
show() {
|
|
@@ -79,20 +77,10 @@ class MatInkBar {
|
|
|
79
77
|
hide() {
|
|
80
78
|
this._elementRef.nativeElement.style.visibility = 'hidden';
|
|
81
79
|
}
|
|
82
|
-
/**
|
|
83
|
-
* Sets the proper styles to the ink bar element.
|
|
84
|
-
* @param element
|
|
85
|
-
*/
|
|
86
|
-
_setStyles(element) {
|
|
87
|
-
const positions = this._inkBarPositioner(element);
|
|
88
|
-
const inkBar = this._elementRef.nativeElement;
|
|
89
|
-
inkBar.style.left = positions.left;
|
|
90
|
-
inkBar.style.width = positions.width;
|
|
91
|
-
}
|
|
92
80
|
}
|
|
93
|
-
MatInkBar.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
94
|
-
MatInkBar.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "
|
|
95
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
81
|
+
MatInkBar.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0-next.14", ngImport: i0, type: MatInkBar, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }, { token: _MAT_INK_BAR_POSITIONER }, { token: ANIMATION_MODULE_TYPE, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
|
|
82
|
+
MatInkBar.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "14.0.0-next.14", type: MatInkBar, selector: "mat-ink-bar", host: { properties: { "class._mat-animation-noopable": "_animationMode === 'NoopAnimations'" }, classAttribute: "mat-ink-bar" }, ngImport: i0 });
|
|
83
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0-next.14", ngImport: i0, type: MatInkBar, decorators: [{
|
|
96
84
|
type: Directive,
|
|
97
85
|
args: [{
|
|
98
86
|
selector: 'mat-ink-bar',
|
|
@@ -130,9 +118,9 @@ class MatTabContent {
|
|
|
130
118
|
this.template = template;
|
|
131
119
|
}
|
|
132
120
|
}
|
|
133
|
-
MatTabContent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
134
|
-
MatTabContent.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "
|
|
135
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
121
|
+
MatTabContent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0-next.14", ngImport: i0, type: MatTabContent, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
|
|
122
|
+
MatTabContent.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "14.0.0-next.14", type: MatTabContent, selector: "[matTabContent]", providers: [{ provide: MAT_TAB_CONTENT, useExisting: MatTabContent }], ngImport: i0 });
|
|
123
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0-next.14", ngImport: i0, type: MatTabContent, decorators: [{
|
|
136
124
|
type: Directive,
|
|
137
125
|
args: [{
|
|
138
126
|
selector: '[matTabContent]',
|
|
@@ -165,9 +153,9 @@ class MatTabLabel extends CdkPortal {
|
|
|
165
153
|
this._closestTab = _closestTab;
|
|
166
154
|
}
|
|
167
155
|
}
|
|
168
|
-
MatTabLabel.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
169
|
-
MatTabLabel.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "
|
|
170
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
156
|
+
MatTabLabel.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0-next.14", ngImport: i0, type: MatTabLabel, deps: [{ token: i0.TemplateRef }, { token: i0.ViewContainerRef }, { token: MAT_TAB, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
|
|
157
|
+
MatTabLabel.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "14.0.0-next.14", type: MatTabLabel, selector: "[mat-tab-label], [matTabLabel]", providers: [{ provide: MAT_TAB_LABEL, useExisting: MatTabLabel }], usesInheritance: true, ngImport: i0 });
|
|
158
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0-next.14", ngImport: i0, type: MatTabLabel, decorators: [{
|
|
171
159
|
type: Directive,
|
|
172
160
|
args: [{
|
|
173
161
|
selector: '[mat-tab-label], [matTabLabel]',
|
|
@@ -260,9 +248,9 @@ class MatTab extends _MatTabBase {
|
|
|
260
248
|
}
|
|
261
249
|
}
|
|
262
250
|
}
|
|
263
|
-
MatTab.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
264
|
-
MatTab.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "
|
|
265
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
251
|
+
MatTab.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0-next.14", ngImport: i0, type: MatTab, deps: [{ token: i0.ViewContainerRef }, { token: MAT_TAB_GROUP, optional: true }], target: i0.ɵɵFactoryTarget.Component });
|
|
252
|
+
MatTab.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "14.0.0-next.14", type: MatTab, selector: "mat-tab", inputs: { disabled: "disabled", textLabel: ["label", "textLabel"], ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"], labelClass: "labelClass", bodyClass: "bodyClass" }, providers: [{ provide: MAT_TAB, useExisting: MatTab }], queries: [{ propertyName: "templateLabel", first: true, predicate: MAT_TAB_LABEL, descendants: true }, { propertyName: "_explicitContent", first: true, predicate: MAT_TAB_CONTENT, descendants: true, read: TemplateRef, static: true }], viewQueries: [{ propertyName: "_implicitContent", first: true, predicate: TemplateRef, descendants: true, static: true }], exportAs: ["matTab"], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<!-- Create a template for the content of the <mat-tab> so that we can grab a reference to this\n TemplateRef and use it in a Portal to render the tab content in the appropriate place in the\n tab-group. -->\n<ng-template><ng-content></ng-content></ng-template>\n", changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None });
|
|
253
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0-next.14", ngImport: i0, type: MatTab, decorators: [{
|
|
266
254
|
type: Component,
|
|
267
255
|
args: [{ selector: 'mat-tab', inputs: ['disabled'], changeDetection: ChangeDetectionStrategy.Default, encapsulation: ViewEncapsulation.None, exportAs: 'matTab', providers: [{ provide: MAT_TAB, useExisting: MatTab }], template: "<!-- Create a template for the content of the <mat-tab> so that we can grab a reference to this\n TemplateRef and use it in a Portal to render the tab content in the appropriate place in the\n tab-group. -->\n<ng-template><ng-content></ng-content></ng-template>\n" }]
|
|
268
256
|
}], ctorParameters: function () { return [{ type: i0.ViewContainerRef }, { type: undefined, decorators: [{
|
|
@@ -381,9 +369,9 @@ class MatTabBodyPortal extends CdkPortalOutlet {
|
|
|
381
369
|
this._leavingSub.unsubscribe();
|
|
382
370
|
}
|
|
383
371
|
}
|
|
384
|
-
MatTabBodyPortal.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
385
|
-
MatTabBodyPortal.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "
|
|
386
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
372
|
+
MatTabBodyPortal.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0-next.14", ngImport: i0, type: MatTabBodyPortal, deps: [{ token: i0.ComponentFactoryResolver }, { token: i0.ViewContainerRef }, { token: forwardRef(() => MatTabBody) }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Directive });
|
|
373
|
+
MatTabBodyPortal.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "14.0.0-next.14", type: MatTabBodyPortal, selector: "[matTabBodyHost]", usesInheritance: true, ngImport: i0 });
|
|
374
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0-next.14", ngImport: i0, type: MatTabBodyPortal, decorators: [{
|
|
387
375
|
type: Directive,
|
|
388
376
|
args: [{
|
|
389
377
|
selector: '[matTabBodyHost]',
|
|
@@ -500,9 +488,9 @@ class _MatTabBodyBase {
|
|
|
500
488
|
return 'right-origin-center';
|
|
501
489
|
}
|
|
502
490
|
}
|
|
503
|
-
_MatTabBodyBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
504
|
-
_MatTabBodyBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "
|
|
505
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
491
|
+
_MatTabBodyBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0-next.14", ngImport: i0, type: _MatTabBodyBase, deps: [{ token: i0.ElementRef }, { token: i1.Directionality, optional: true }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Directive });
|
|
492
|
+
_MatTabBodyBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "14.0.0-next.14", type: _MatTabBodyBase, inputs: { _content: ["content", "_content"], origin: "origin", animationDuration: "animationDuration", preserveContent: "preserveContent", position: "position" }, outputs: { _onCentering: "_onCentering", _beforeCentering: "_beforeCentering", _afterLeavingCenter: "_afterLeavingCenter", _onCentered: "_onCentered" }, ngImport: i0 });
|
|
493
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0-next.14", ngImport: i0, type: _MatTabBodyBase, decorators: [{
|
|
506
494
|
type: Directive
|
|
507
495
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i1.Directionality, decorators: [{
|
|
508
496
|
type: Optional
|
|
@@ -535,13 +523,13 @@ class MatTabBody extends _MatTabBodyBase {
|
|
|
535
523
|
super(elementRef, dir, changeDetectorRef);
|
|
536
524
|
}
|
|
537
525
|
}
|
|
538
|
-
MatTabBody.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
539
|
-
MatTabBody.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "
|
|
540
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
526
|
+
MatTabBody.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0-next.14", ngImport: i0, type: MatTabBody, deps: [{ token: i0.ElementRef }, { token: i1.Directionality, optional: true }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
527
|
+
MatTabBody.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "14.0.0-next.14", type: MatTabBody, selector: "mat-tab-body", host: { classAttribute: "mat-tab-body" }, viewQueries: [{ propertyName: "_portalHost", first: true, predicate: CdkPortalOutlet, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"mat-tab-body-content\" #content\n [@translateTab]=\"{\n value: _position,\n params: {animationDuration: animationDuration}\n }\"\n (@translateTab.start)=\"_onTranslateTabStarted($event)\"\n (@translateTab.done)=\"_translateTabComplete.next($event)\"\n cdkScrollable>\n <ng-template matTabBodyHost></ng-template>\n</div>\n", styles: [".mat-tab-body-content{height:100%;overflow:auto}.mat-tab-group-dynamic-height .mat-tab-body-content{overflow:hidden}.mat-tab-body-content[style*=\"visibility: hidden\"]{display:none}"], dependencies: [{ kind: "directive", type: MatTabBodyPortal, selector: "[matTabBodyHost]" }], animations: [matTabsAnimations.translateTab], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None });
|
|
528
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0-next.14", ngImport: i0, type: MatTabBody, decorators: [{
|
|
541
529
|
type: Component,
|
|
542
530
|
args: [{ selector: 'mat-tab-body', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.Default, animations: [matTabsAnimations.translateTab], host: {
|
|
543
531
|
'class': 'mat-tab-body',
|
|
544
|
-
}, template: "<div class=\"mat-tab-body-content\" #content\n [@translateTab]=\"{\n value: _position,\n params: {animationDuration: animationDuration}\n }\"\n (@translateTab.start)=\"_onTranslateTabStarted($event)\"\n (@translateTab.done)=\"_translateTabComplete.next($event)\"\n cdkScrollable>\n <ng-template matTabBodyHost></ng-template>\n</div>\n", styles: [".mat-tab-body-content{height:100%;overflow:auto}.mat-tab-group-dynamic-height .mat-tab-body-content{overflow:hidden}.mat-tab-body-content[style*=\"visibility: hidden\"]{display:none}
|
|
532
|
+
}, template: "<div class=\"mat-tab-body-content\" #content\n [@translateTab]=\"{\n value: _position,\n params: {animationDuration: animationDuration}\n }\"\n (@translateTab.start)=\"_onTranslateTabStarted($event)\"\n (@translateTab.done)=\"_translateTabComplete.next($event)\"\n cdkScrollable>\n <ng-template matTabBodyHost></ng-template>\n</div>\n", styles: [".mat-tab-body-content{height:100%;overflow:auto}.mat-tab-group-dynamic-height .mat-tab-body-content{overflow:hidden}.mat-tab-body-content[style*=\"visibility: hidden\"]{display:none}"] }]
|
|
545
533
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i1.Directionality, decorators: [{
|
|
546
534
|
type: Optional
|
|
547
535
|
}] }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { _portalHost: [{
|
|
@@ -590,9 +578,9 @@ class MatTabLabelWrapper extends _MatTabLabelWrapperBase {
|
|
|
590
578
|
return this.elementRef.nativeElement.offsetWidth;
|
|
591
579
|
}
|
|
592
580
|
}
|
|
593
|
-
MatTabLabelWrapper.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
594
|
-
MatTabLabelWrapper.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "
|
|
595
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
581
|
+
MatTabLabelWrapper.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0-next.14", ngImport: i0, type: MatTabLabelWrapper, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
|
|
582
|
+
MatTabLabelWrapper.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "14.0.0-next.14", type: MatTabLabelWrapper, selector: "[matTabLabelWrapper]", inputs: { disabled: "disabled" }, host: { properties: { "class.mat-tab-disabled": "disabled", "attr.aria-disabled": "!!disabled" } }, usesInheritance: true, ngImport: i0 });
|
|
583
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0-next.14", ngImport: i0, type: MatTabLabelWrapper, decorators: [{
|
|
596
584
|
type: Directive,
|
|
597
585
|
args: [{
|
|
598
586
|
selector: '[matTabLabelWrapper]',
|
|
@@ -657,11 +645,7 @@ class MatPaginatedTabHeader {
|
|
|
657
645
|
this._disableScrollBefore = true;
|
|
658
646
|
/** Stream that will stop the automated scrolling. */
|
|
659
647
|
this._stopScrolling = new Subject();
|
|
660
|
-
|
|
661
|
-
* Whether pagination should be disabled. This can be used to avoid unnecessary
|
|
662
|
-
* layout recalculations if it's known that pagination won't be required.
|
|
663
|
-
*/
|
|
664
|
-
this.disablePagination = false;
|
|
648
|
+
this._disablePagination = false;
|
|
665
649
|
this._selectedIndex = 0;
|
|
666
650
|
/** Event emitted when the option is selected. */
|
|
667
651
|
this.selectFocusedIndex = new EventEmitter();
|
|
@@ -676,6 +660,16 @@ class MatPaginatedTabHeader {
|
|
|
676
660
|
});
|
|
677
661
|
});
|
|
678
662
|
}
|
|
663
|
+
/**
|
|
664
|
+
* Whether pagination should be disabled. This can be used to avoid unnecessary
|
|
665
|
+
* layout recalculations if it's known that pagination won't be required.
|
|
666
|
+
*/
|
|
667
|
+
get disablePagination() {
|
|
668
|
+
return this._disablePagination;
|
|
669
|
+
}
|
|
670
|
+
set disablePagination(value) {
|
|
671
|
+
this._disablePagination = coerceBooleanProperty(value);
|
|
672
|
+
}
|
|
679
673
|
/** The index of the active tab. */
|
|
680
674
|
get selectedIndex() {
|
|
681
675
|
return this._selectedIndex;
|
|
@@ -717,7 +711,9 @@ class MatPaginatedTabHeader {
|
|
|
717
711
|
this._keyManager.updateActiveItem(this._selectedIndex);
|
|
718
712
|
// Defer the first call in order to allow for slower browsers to lay out the elements.
|
|
719
713
|
// This helps in cases where the user lands directly on a page with paginated tabs.
|
|
720
|
-
|
|
714
|
+
// Note that we use `onStable` instead of `requestAnimationFrame`, because the latter
|
|
715
|
+
// can hold up tests that are in a background tab.
|
|
716
|
+
this._ngZone.onStable.pipe(take(1)).subscribe(realign);
|
|
721
717
|
// On dir change or window resize, realign the ink bar and update the orientation of
|
|
722
718
|
// the key manager if the direction has changed.
|
|
723
719
|
merge(dirChange, resize, this._items.changes)
|
|
@@ -726,7 +722,13 @@ class MatPaginatedTabHeader {
|
|
|
726
722
|
// We need to defer this to give the browser some time to recalculate
|
|
727
723
|
// the element dimensions. The call has to be wrapped in `NgZone.run`,
|
|
728
724
|
// because the viewport change handler runs outside of Angular.
|
|
729
|
-
this._ngZone.run(() =>
|
|
725
|
+
this._ngZone.run(() => {
|
|
726
|
+
Promise.resolve().then(() => {
|
|
727
|
+
// Clamp the scroll distance, because it can change with the number of tabs.
|
|
728
|
+
this._scrollDistance = Math.max(0, Math.min(this._getMaxScrollDistance(), this._scrollDistance));
|
|
729
|
+
realign();
|
|
730
|
+
});
|
|
731
|
+
});
|
|
730
732
|
this._keyManager.withHorizontalOrientation(this._getLayoutDirection());
|
|
731
733
|
});
|
|
732
734
|
// If there is a change in the focus key manager we need to emit the `indexFocused`
|
|
@@ -1062,9 +1064,9 @@ class MatPaginatedTabHeader {
|
|
|
1062
1064
|
return { maxScrollDistance, distance: this._scrollDistance };
|
|
1063
1065
|
}
|
|
1064
1066
|
}
|
|
1065
|
-
MatPaginatedTabHeader.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1066
|
-
MatPaginatedTabHeader.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "
|
|
1067
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1067
|
+
MatPaginatedTabHeader.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0-next.14", ngImport: i0, type: MatPaginatedTabHeader, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i1$1.ViewportRuler }, { token: i1.Directionality, optional: true }, { token: i0.NgZone }, { token: i3.Platform }, { token: ANIMATION_MODULE_TYPE, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
|
|
1068
|
+
MatPaginatedTabHeader.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "14.0.0-next.14", type: MatPaginatedTabHeader, inputs: { disablePagination: "disablePagination" }, ngImport: i0 });
|
|
1069
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0-next.14", ngImport: i0, type: MatPaginatedTabHeader, decorators: [{
|
|
1068
1070
|
type: Directive
|
|
1069
1071
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i1$1.ViewportRuler }, { type: i1.Directionality, decorators: [{
|
|
1070
1072
|
type: Optional
|
|
@@ -1104,9 +1106,9 @@ class _MatTabHeaderBase extends MatPaginatedTabHeader {
|
|
|
1104
1106
|
event.preventDefault();
|
|
1105
1107
|
}
|
|
1106
1108
|
}
|
|
1107
|
-
_MatTabHeaderBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1108
|
-
_MatTabHeaderBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "
|
|
1109
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1109
|
+
_MatTabHeaderBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0-next.14", ngImport: i0, type: _MatTabHeaderBase, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i1$1.ViewportRuler }, { token: i1.Directionality, optional: true }, { token: i0.NgZone }, { token: i3.Platform }, { token: ANIMATION_MODULE_TYPE, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
|
|
1110
|
+
_MatTabHeaderBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "14.0.0-next.14", type: _MatTabHeaderBase, inputs: { disableRipple: "disableRipple" }, usesInheritance: true, ngImport: i0 });
|
|
1111
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0-next.14", ngImport: i0, type: _MatTabHeaderBase, decorators: [{
|
|
1110
1112
|
type: Directive
|
|
1111
1113
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i1$1.ViewportRuler }, { type: i1.Directionality, decorators: [{
|
|
1112
1114
|
type: Optional
|
|
@@ -1130,15 +1132,15 @@ class MatTabHeader extends _MatTabHeaderBase {
|
|
|
1130
1132
|
super(elementRef, changeDetectorRef, viewportRuler, dir, ngZone, platform, animationMode);
|
|
1131
1133
|
}
|
|
1132
1134
|
}
|
|
1133
|
-
MatTabHeader.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1134
|
-
MatTabHeader.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "
|
|
1135
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1135
|
+
MatTabHeader.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0-next.14", ngImport: i0, type: MatTabHeader, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i1$1.ViewportRuler }, { token: i1.Directionality, optional: true }, { token: i0.NgZone }, { token: i3.Platform }, { token: ANIMATION_MODULE_TYPE, optional: true }], target: i0.ɵɵFactoryTarget.Component });
|
|
1136
|
+
MatTabHeader.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "14.0.0-next.14", type: MatTabHeader, selector: "mat-tab-header", inputs: { selectedIndex: "selectedIndex" }, outputs: { selectFocusedIndex: "selectFocusedIndex", indexFocused: "indexFocused" }, host: { properties: { "class.mat-tab-header-pagination-controls-enabled": "_showPaginationControls", "class.mat-tab-header-rtl": "_getLayoutDirection() == 'rtl'" }, classAttribute: "mat-tab-header" }, queries: [{ propertyName: "_items", predicate: MatTabLabelWrapper }], viewQueries: [{ propertyName: "_inkBar", first: true, predicate: MatInkBar, descendants: true, static: true }, { propertyName: "_tabListContainer", first: true, predicate: ["tabListContainer"], descendants: true, static: true }, { propertyName: "_tabList", first: true, predicate: ["tabList"], descendants: true, static: true }, { propertyName: "_tabListInner", first: true, predicate: ["tabListInner"], descendants: true, static: true }, { propertyName: "_nextPaginator", first: true, predicate: ["nextPaginator"], descendants: true }, { propertyName: "_previousPaginator", first: true, predicate: ["previousPaginator"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<button class=\"mat-tab-header-pagination mat-tab-header-pagination-before mat-elevation-z4\"\n #previousPaginator\n aria-hidden=\"true\"\n type=\"button\"\n mat-ripple\n tabindex=\"-1\"\n [matRippleDisabled]=\"_disableScrollBefore || disableRipple\"\n [class.mat-tab-header-pagination-disabled]=\"_disableScrollBefore\"\n [disabled]=\"_disableScrollBefore || null\"\n (click)=\"_handlePaginatorClick('before')\"\n (mousedown)=\"_handlePaginatorPress('before', $event)\"\n (touchend)=\"_stopInterval()\">\n <div class=\"mat-tab-header-pagination-chevron\"></div>\n</button>\n\n<div class=\"mat-tab-label-container\" #tabListContainer (keydown)=\"_handleKeydown($event)\">\n <div\n #tabList\n class=\"mat-tab-list\"\n [class._mat-animation-noopable]=\"_animationMode === 'NoopAnimations'\"\n role=\"tablist\"\n (cdkObserveContent)=\"_onContentChanges()\">\n <div class=\"mat-tab-labels\" #tabListInner>\n <ng-content></ng-content>\n </div>\n <mat-ink-bar></mat-ink-bar>\n </div>\n</div>\n\n<button class=\"mat-tab-header-pagination mat-tab-header-pagination-after mat-elevation-z4\"\n #nextPaginator\n aria-hidden=\"true\"\n type=\"button\"\n mat-ripple\n [matRippleDisabled]=\"_disableScrollAfter || disableRipple\"\n [class.mat-tab-header-pagination-disabled]=\"_disableScrollAfter\"\n [disabled]=\"_disableScrollAfter || null\"\n tabindex=\"-1\"\n (mousedown)=\"_handlePaginatorPress('after', $event)\"\n (click)=\"_handlePaginatorClick('after')\"\n (touchend)=\"_stopInterval()\">\n <div class=\"mat-tab-header-pagination-chevron\"></div>\n</button>\n", styles: [".mat-tab-header{display:flex;overflow:hidden;position:relative;flex-shrink:0}.mat-tab-header-pagination{-webkit-user-select:none;user-select:none;position:relative;display:none;justify-content:center;align-items:center;min-width:32px;cursor:pointer;z-index:2;-webkit-tap-highlight-color:rgba(0,0,0,0);touch-action:none;box-sizing:content-box;background:none;border:none;outline:0;padding:0}.mat-tab-header-pagination::-moz-focus-inner{border:0}.mat-tab-header-pagination-controls-enabled .mat-tab-header-pagination{display:flex}.mat-tab-header-pagination-before,.mat-tab-header-rtl .mat-tab-header-pagination-after{padding-left:4px}.mat-tab-header-pagination-before .mat-tab-header-pagination-chevron,.mat-tab-header-rtl .mat-tab-header-pagination-after .mat-tab-header-pagination-chevron{transform:rotate(-135deg)}.mat-tab-header-rtl .mat-tab-header-pagination-before,.mat-tab-header-pagination-after{padding-right:4px}.mat-tab-header-rtl .mat-tab-header-pagination-before .mat-tab-header-pagination-chevron,.mat-tab-header-pagination-after .mat-tab-header-pagination-chevron{transform:rotate(45deg)}.mat-tab-header-pagination-chevron{border-style:solid;border-width:2px 2px 0 0;height:8px;width:8px}.mat-tab-header-pagination-disabled{box-shadow:none;cursor:default}.mat-tab-list{flex-grow:1;position:relative;transition:transform 500ms cubic-bezier(0.35, 0, 0.25, 1)}.mat-ink-bar{position:absolute;bottom:0;height:2px;transition:500ms cubic-bezier(0.35, 0, 0.25, 1)}._mat-animation-noopable.mat-ink-bar{transition:none;animation:none}.mat-tab-group-inverted-header .mat-ink-bar{bottom:auto;top:0}.cdk-high-contrast-active .mat-ink-bar{outline:solid 2px;height:0}.mat-tab-labels{display:flex}[mat-align-tabs=center]>.mat-tab-header .mat-tab-labels{justify-content:center}[mat-align-tabs=end]>.mat-tab-header .mat-tab-labels{justify-content:flex-end}.mat-tab-label-container{display:flex;flex-grow:1;overflow:hidden;z-index:1}._mat-animation-noopable.mat-tab-list{transition:none;animation:none}.mat-tab-label{height:48px;padding:0 24px;cursor:pointer;box-sizing:border-box;opacity:.6;min-width:160px;text-align:center;display:inline-flex;justify-content:center;align-items:center;white-space:nowrap;position:relative}.mat-tab-label:focus{outline:none}.mat-tab-label:focus:not(.mat-tab-disabled){opacity:1}.cdk-high-contrast-active .mat-tab-label:focus{outline:dotted 2px;outline-offset:-2px}.mat-tab-label.mat-tab-disabled{cursor:default}.cdk-high-contrast-active .mat-tab-label.mat-tab-disabled{opacity:.5}.mat-tab-label .mat-tab-label-content{display:inline-flex;justify-content:center;align-items:center;white-space:nowrap}.cdk-high-contrast-active .mat-tab-label{opacity:1}@media(max-width: 599px){.mat-tab-label{min-width:72px}}"], dependencies: [{ kind: "directive", type: i4.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { kind: "directive", type: i5.CdkObserveContent, selector: "[cdkObserveContent]", inputs: ["cdkObserveContentDisabled", "debounce"], outputs: ["cdkObserveContent"], exportAs: ["cdkObserveContent"] }, { kind: "directive", type: MatInkBar, selector: "mat-ink-bar" }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None });
|
|
1137
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0-next.14", ngImport: i0, type: MatTabHeader, decorators: [{
|
|
1136
1138
|
type: Component,
|
|
1137
1139
|
args: [{ selector: 'mat-tab-header', inputs: ['selectedIndex'], outputs: ['selectFocusedIndex', 'indexFocused'], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.Default, host: {
|
|
1138
1140
|
'class': 'mat-tab-header',
|
|
1139
1141
|
'[class.mat-tab-header-pagination-controls-enabled]': '_showPaginationControls',
|
|
1140
1142
|
'[class.mat-tab-header-rtl]': "_getLayoutDirection() == 'rtl'",
|
|
1141
|
-
}, template: "<
|
|
1143
|
+
}, template: "<button class=\"mat-tab-header-pagination mat-tab-header-pagination-before mat-elevation-z4\"\n #previousPaginator\n aria-hidden=\"true\"\n type=\"button\"\n mat-ripple\n tabindex=\"-1\"\n [matRippleDisabled]=\"_disableScrollBefore || disableRipple\"\n [class.mat-tab-header-pagination-disabled]=\"_disableScrollBefore\"\n [disabled]=\"_disableScrollBefore || null\"\n (click)=\"_handlePaginatorClick('before')\"\n (mousedown)=\"_handlePaginatorPress('before', $event)\"\n (touchend)=\"_stopInterval()\">\n <div class=\"mat-tab-header-pagination-chevron\"></div>\n</button>\n\n<div class=\"mat-tab-label-container\" #tabListContainer (keydown)=\"_handleKeydown($event)\">\n <div\n #tabList\n class=\"mat-tab-list\"\n [class._mat-animation-noopable]=\"_animationMode === 'NoopAnimations'\"\n role=\"tablist\"\n (cdkObserveContent)=\"_onContentChanges()\">\n <div class=\"mat-tab-labels\" #tabListInner>\n <ng-content></ng-content>\n </div>\n <mat-ink-bar></mat-ink-bar>\n </div>\n</div>\n\n<button class=\"mat-tab-header-pagination mat-tab-header-pagination-after mat-elevation-z4\"\n #nextPaginator\n aria-hidden=\"true\"\n type=\"button\"\n mat-ripple\n [matRippleDisabled]=\"_disableScrollAfter || disableRipple\"\n [class.mat-tab-header-pagination-disabled]=\"_disableScrollAfter\"\n [disabled]=\"_disableScrollAfter || null\"\n tabindex=\"-1\"\n (mousedown)=\"_handlePaginatorPress('after', $event)\"\n (click)=\"_handlePaginatorClick('after')\"\n (touchend)=\"_stopInterval()\">\n <div class=\"mat-tab-header-pagination-chevron\"></div>\n</button>\n", styles: [".mat-tab-header{display:flex;overflow:hidden;position:relative;flex-shrink:0}.mat-tab-header-pagination{-webkit-user-select:none;user-select:none;position:relative;display:none;justify-content:center;align-items:center;min-width:32px;cursor:pointer;z-index:2;-webkit-tap-highlight-color:rgba(0,0,0,0);touch-action:none;box-sizing:content-box;background:none;border:none;outline:0;padding:0}.mat-tab-header-pagination::-moz-focus-inner{border:0}.mat-tab-header-pagination-controls-enabled .mat-tab-header-pagination{display:flex}.mat-tab-header-pagination-before,.mat-tab-header-rtl .mat-tab-header-pagination-after{padding-left:4px}.mat-tab-header-pagination-before .mat-tab-header-pagination-chevron,.mat-tab-header-rtl .mat-tab-header-pagination-after .mat-tab-header-pagination-chevron{transform:rotate(-135deg)}.mat-tab-header-rtl .mat-tab-header-pagination-before,.mat-tab-header-pagination-after{padding-right:4px}.mat-tab-header-rtl .mat-tab-header-pagination-before .mat-tab-header-pagination-chevron,.mat-tab-header-pagination-after .mat-tab-header-pagination-chevron{transform:rotate(45deg)}.mat-tab-header-pagination-chevron{border-style:solid;border-width:2px 2px 0 0;height:8px;width:8px}.mat-tab-header-pagination-disabled{box-shadow:none;cursor:default}.mat-tab-list{flex-grow:1;position:relative;transition:transform 500ms cubic-bezier(0.35, 0, 0.25, 1)}.mat-ink-bar{position:absolute;bottom:0;height:2px;transition:500ms cubic-bezier(0.35, 0, 0.25, 1)}._mat-animation-noopable.mat-ink-bar{transition:none;animation:none}.mat-tab-group-inverted-header .mat-ink-bar{bottom:auto;top:0}.cdk-high-contrast-active .mat-ink-bar{outline:solid 2px;height:0}.mat-tab-labels{display:flex}[mat-align-tabs=center]>.mat-tab-header .mat-tab-labels{justify-content:center}[mat-align-tabs=end]>.mat-tab-header .mat-tab-labels{justify-content:flex-end}.mat-tab-label-container{display:flex;flex-grow:1;overflow:hidden;z-index:1}._mat-animation-noopable.mat-tab-list{transition:none;animation:none}.mat-tab-label{height:48px;padding:0 24px;cursor:pointer;box-sizing:border-box;opacity:.6;min-width:160px;text-align:center;display:inline-flex;justify-content:center;align-items:center;white-space:nowrap;position:relative}.mat-tab-label:focus{outline:none}.mat-tab-label:focus:not(.mat-tab-disabled){opacity:1}.cdk-high-contrast-active .mat-tab-label:focus{outline:dotted 2px;outline-offset:-2px}.mat-tab-label.mat-tab-disabled{cursor:default}.cdk-high-contrast-active .mat-tab-label.mat-tab-disabled{opacity:.5}.mat-tab-label .mat-tab-label-content{display:inline-flex;justify-content:center;align-items:center;white-space:nowrap}.cdk-high-contrast-active .mat-tab-label{opacity:1}@media(max-width: 599px){.mat-tab-label{min-width:72px}}"] }]
|
|
1142
1144
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i1$1.ViewportRuler }, { type: i1.Directionality, decorators: [{
|
|
1143
1145
|
type: Optional
|
|
1144
1146
|
}] }, { type: i0.NgZone }, { type: i3.Platform }, { type: undefined, decorators: [{
|
|
@@ -1201,15 +1203,20 @@ class _MatTabGroupBase extends _MatTabGroupMixinBase {
|
|
|
1201
1203
|
this._tabs = new QueryList();
|
|
1202
1204
|
/** The tab index that should be selected after the content has been checked. */
|
|
1203
1205
|
this._indexToSelect = 0;
|
|
1206
|
+
/** Index of the tab that was focused last. */
|
|
1207
|
+
this._lastFocusedTabIndex = null;
|
|
1204
1208
|
/** Snapshot of the height of the tab body wrapper before another tab is activated. */
|
|
1205
1209
|
this._tabBodyWrapperHeight = 0;
|
|
1206
1210
|
/** Subscription to tabs being added/removed. */
|
|
1207
1211
|
this._tabsSubscription = Subscription.EMPTY;
|
|
1208
1212
|
/** Subscription to changes in the tab labels. */
|
|
1209
1213
|
this._tabLabelSubscription = Subscription.EMPTY;
|
|
1214
|
+
this._dynamicHeight = false;
|
|
1210
1215
|
this._selectedIndex = null;
|
|
1211
1216
|
/** Position of the tab header. */
|
|
1212
1217
|
this.headerPosition = 'above';
|
|
1218
|
+
this._disablePagination = false;
|
|
1219
|
+
this._preserveContent = false;
|
|
1213
1220
|
/** Output to enable support for two-way binding on `[(selectedIndex)]` */
|
|
1214
1221
|
this.selectedIndexChange = new EventEmitter();
|
|
1215
1222
|
/** Event emitted when focus has changed within a tab group. */
|
|
@@ -1263,6 +1270,27 @@ class _MatTabGroupBase extends _MatTabGroupMixinBase {
|
|
|
1263
1270
|
set contentTabIndex(value) {
|
|
1264
1271
|
this._contentTabIndex = coerceNumberProperty(value, null);
|
|
1265
1272
|
}
|
|
1273
|
+
/**
|
|
1274
|
+
* Whether pagination should be disabled. This can be used to avoid unnecessary
|
|
1275
|
+
* layout recalculations if it's known that pagination won't be required.
|
|
1276
|
+
*/
|
|
1277
|
+
get disablePagination() {
|
|
1278
|
+
return this._disablePagination;
|
|
1279
|
+
}
|
|
1280
|
+
set disablePagination(value) {
|
|
1281
|
+
this._disablePagination = coerceBooleanProperty(value);
|
|
1282
|
+
}
|
|
1283
|
+
/**
|
|
1284
|
+
* By default tabs remove their content from the DOM while it's off-screen.
|
|
1285
|
+
* Setting this to `true` will keep it in the DOM which will prevent elements
|
|
1286
|
+
* like iframes and videos from reloading next time it comes back into the view.
|
|
1287
|
+
*/
|
|
1288
|
+
get preserveContent() {
|
|
1289
|
+
return this._preserveContent;
|
|
1290
|
+
}
|
|
1291
|
+
set preserveContent(value) {
|
|
1292
|
+
this._preserveContent = coerceBooleanProperty(value);
|
|
1293
|
+
}
|
|
1266
1294
|
/** Background color of the tab group. */
|
|
1267
1295
|
get backgroundColor() {
|
|
1268
1296
|
return this._backgroundColor;
|
|
@@ -1319,6 +1347,7 @@ class _MatTabGroupBase extends _MatTabGroupMixinBase {
|
|
|
1319
1347
|
});
|
|
1320
1348
|
if (this._selectedIndex !== indexToSelect) {
|
|
1321
1349
|
this._selectedIndex = indexToSelect;
|
|
1350
|
+
this._lastFocusedTabIndex = null;
|
|
1322
1351
|
this._changeDetectorRef.markForCheck();
|
|
1323
1352
|
}
|
|
1324
1353
|
}
|
|
@@ -1333,15 +1362,27 @@ class _MatTabGroupBase extends _MatTabGroupMixinBase {
|
|
|
1333
1362
|
// explicit change that selects a different tab.
|
|
1334
1363
|
if (indexToSelect === this._selectedIndex) {
|
|
1335
1364
|
const tabs = this._tabs.toArray();
|
|
1365
|
+
let selectedTab;
|
|
1336
1366
|
for (let i = 0; i < tabs.length; i++) {
|
|
1337
1367
|
if (tabs[i].isActive) {
|
|
1338
1368
|
// Assign both to the `_indexToSelect` and `_selectedIndex` so we don't fire a changed
|
|
1339
1369
|
// event, otherwise the consumer may end up in an infinite loop in some edge cases like
|
|
1340
1370
|
// adding a tab within the `selectedIndexChange` event.
|
|
1341
1371
|
this._indexToSelect = this._selectedIndex = i;
|
|
1372
|
+
this._lastFocusedTabIndex = null;
|
|
1373
|
+
selectedTab = tabs[i];
|
|
1342
1374
|
break;
|
|
1343
1375
|
}
|
|
1344
1376
|
}
|
|
1377
|
+
// If we haven't found an active tab and a tab exists at the selected index, it means
|
|
1378
|
+
// that the active tab was swapped out. Since this won't be picked up by the rendering
|
|
1379
|
+
// loop in `ngAfterContentChecked`, we need to sync it up manually.
|
|
1380
|
+
if (!selectedTab && tabs[indexToSelect]) {
|
|
1381
|
+
Promise.resolve().then(() => {
|
|
1382
|
+
tabs[indexToSelect].isActive = true;
|
|
1383
|
+
this.selectedTabChange.emit(this._createChangeEvent(indexToSelect));
|
|
1384
|
+
});
|
|
1385
|
+
}
|
|
1345
1386
|
}
|
|
1346
1387
|
this._changeDetectorRef.markForCheck();
|
|
1347
1388
|
});
|
|
@@ -1392,6 +1433,7 @@ class _MatTabGroupBase extends _MatTabGroupMixinBase {
|
|
|
1392
1433
|
}
|
|
1393
1434
|
}
|
|
1394
1435
|
_focusChanged(index) {
|
|
1436
|
+
this._lastFocusedTabIndex = index;
|
|
1395
1437
|
this.focusChange.emit(this._createChangeEvent(index));
|
|
1396
1438
|
}
|
|
1397
1439
|
_createChangeEvent(index) {
|
|
@@ -1459,11 +1501,12 @@ class _MatTabGroupBase extends _MatTabGroupMixinBase {
|
|
|
1459
1501
|
}
|
|
1460
1502
|
}
|
|
1461
1503
|
/** Retrieves the tabindex for the tab. */
|
|
1462
|
-
_getTabIndex(tab,
|
|
1504
|
+
_getTabIndex(tab, index) {
|
|
1463
1505
|
if (tab.disabled) {
|
|
1464
1506
|
return null;
|
|
1465
1507
|
}
|
|
1466
|
-
|
|
1508
|
+
const targetIndex = this._lastFocusedTabIndex ?? this.selectedIndex;
|
|
1509
|
+
return index === targetIndex ? 0 : -1;
|
|
1467
1510
|
}
|
|
1468
1511
|
/** Callback for when the focused state of a tab has changed. */
|
|
1469
1512
|
_tabFocusChanged(focusOrigin, index) {
|
|
@@ -1476,9 +1519,9 @@ class _MatTabGroupBase extends _MatTabGroupMixinBase {
|
|
|
1476
1519
|
}
|
|
1477
1520
|
}
|
|
1478
1521
|
}
|
|
1479
|
-
_MatTabGroupBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1480
|
-
_MatTabGroupBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "
|
|
1481
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1522
|
+
_MatTabGroupBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0-next.14", ngImport: i0, type: _MatTabGroupBase, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: MAT_TABS_CONFIG, optional: true }, { token: ANIMATION_MODULE_TYPE, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
|
|
1523
|
+
_MatTabGroupBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "14.0.0-next.14", type: _MatTabGroupBase, inputs: { dynamicHeight: "dynamicHeight", selectedIndex: "selectedIndex", headerPosition: "headerPosition", animationDuration: "animationDuration", contentTabIndex: "contentTabIndex", disablePagination: "disablePagination", preserveContent: "preserveContent", backgroundColor: "backgroundColor" }, outputs: { selectedIndexChange: "selectedIndexChange", focusChange: "focusChange", animationDone: "animationDone", selectedTabChange: "selectedTabChange" }, usesInheritance: true, ngImport: i0 });
|
|
1524
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0-next.14", ngImport: i0, type: _MatTabGroupBase, decorators: [{
|
|
1482
1525
|
type: Directive
|
|
1483
1526
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: undefined, decorators: [{
|
|
1484
1527
|
type: Inject,
|
|
@@ -1525,14 +1568,14 @@ class MatTabGroup extends _MatTabGroupBase {
|
|
|
1525
1568
|
super(elementRef, changeDetectorRef, defaultConfig, animationMode);
|
|
1526
1569
|
}
|
|
1527
1570
|
}
|
|
1528
|
-
MatTabGroup.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1529
|
-
MatTabGroup.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "
|
|
1571
|
+
MatTabGroup.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0-next.14", ngImport: i0, type: MatTabGroup, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: MAT_TABS_CONFIG, optional: true }, { token: ANIMATION_MODULE_TYPE, optional: true }], target: i0.ɵɵFactoryTarget.Component });
|
|
1572
|
+
MatTabGroup.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "14.0.0-next.14", type: MatTabGroup, selector: "mat-tab-group", inputs: { color: "color", disableRipple: "disableRipple" }, host: { properties: { "class.mat-tab-group-dynamic-height": "dynamicHeight", "class.mat-tab-group-inverted-header": "headerPosition === \"below\"" }, classAttribute: "mat-tab-group" }, providers: [
|
|
1530
1573
|
{
|
|
1531
1574
|
provide: MAT_TAB_GROUP,
|
|
1532
1575
|
useExisting: MatTabGroup,
|
|
1533
1576
|
},
|
|
1534
|
-
], queries: [{ propertyName: "_allTabs", predicate: MatTab, descendants: true }], viewQueries: [{ propertyName: "_tabBodyWrapper", first: true, predicate: ["tabBodyWrapper"], descendants: true }, { propertyName: "_tabHeader", first: true, predicate: ["tabHeader"], descendants: true }], exportAs: ["matTabGroup"], usesInheritance: true, ngImport: i0, template: "<mat-tab-header #tabHeader\n [selectedIndex]=\"selectedIndex || 0\"\n [disableRipple]=\"disableRipple\"\n [disablePagination]=\"disablePagination\"\n (indexFocused)=\"_focusChanged($event)\"\n (selectFocusedIndex)=\"selectedIndex = $event\">\n <div class=\"mat-tab-label mat-focus-indicator\" role=\"tab\" matTabLabelWrapper mat-ripple\n cdkMonitorElementFocus\n *ngFor=\"let tab of _tabs; let i = index\"\n [id]=\"_getTabLabelId(i)\"\n [attr.tabIndex]=\"_getTabIndex(tab, i)\"\n [attr.aria-posinset]=\"i + 1\"\n [attr.aria-setsize]=\"_tabs.length\"\n [attr.aria-controls]=\"_getTabContentId(i)\"\n [attr.aria-selected]=\"selectedIndex === i\"\n [attr.aria-label]=\"tab.ariaLabel || null\"\n [attr.aria-labelledby]=\"(!tab.ariaLabel && tab.ariaLabelledby) ? tab.ariaLabelledby : null\"\n [class.mat-tab-label-active]=\"selectedIndex === i\"\n [ngClass]=\"tab.labelClass\"\n [disabled]=\"tab.disabled\"\n [matRippleDisabled]=\"tab.disabled || disableRipple\"\n (click)=\"_handleClick(tab, tabHeader, i)\"\n (cdkFocusChange)=\"_tabFocusChanged($event, i)\">\n\n\n <div class=\"mat-tab-label-content\">\n <!-- If there is a label template, use it. -->\n <ng-template [ngIf]=\"tab.templateLabel\" [ngIfElse]=\"tabTextLabel\">\n <ng-template [cdkPortalOutlet]=\"tab.templateLabel\"></ng-template>\n </ng-template>\n\n <!-- If there is not a label template, fall back to the text label. -->\n <ng-template #tabTextLabel>{{tab.textLabel}}</ng-template>\n </div>\n </div>\n</mat-tab-header>\n\n<div\n class=\"mat-tab-body-wrapper\"\n [class._mat-animation-noopable]=\"_animationMode === 'NoopAnimations'\"\n #tabBodyWrapper>\n <mat-tab-body role=\"tabpanel\"\n *ngFor=\"let tab of _tabs; let i = index\"\n [id]=\"_getTabContentId(i)\"\n [attr.tabindex]=\"(contentTabIndex != null && selectedIndex === i) ? contentTabIndex : null\"\n [attr.aria-labelledby]=\"_getTabLabelId(i)\"\n [class.mat-tab-body-active]=\"selectedIndex === i\"\n [ngClass]=\"tab.bodyClass\"\n [content]=\"tab.content!\"\n [position]=\"tab.position!\"\n [origin]=\"tab.origin\"\n [animationDuration]=\"animationDuration\"\n [preserveContent]=\"preserveContent\"\n (_onCentered)=\"_removeTabBodyWrapperHeight()\"\n (_onCentering)=\"_setTabBodyWrapperHeight($event)\">\n </mat-tab-body>\n</div>\n", styles: [".mat-tab-group{display:flex;flex-direction:column;max-width:100%}.mat-tab-group.mat-tab-group-inverted-header{flex-direction:column-reverse}.mat-tab-label{height:48px;padding:0 24px;cursor:pointer;box-sizing:border-box;opacity:.6;min-width:160px;text-align:center;display:inline-flex;justify-content:center;align-items:center;white-space:nowrap;position:relative}.mat-tab-label:focus{outline:none}.mat-tab-label:focus:not(.mat-tab-disabled){opacity:1}.cdk-high-contrast-active .mat-tab-label:focus{outline:dotted 2px;outline-offset:-2px}.mat-tab-label.mat-tab-disabled{cursor:default}.cdk-high-contrast-active .mat-tab-label.mat-tab-disabled{opacity:.5}.mat-tab-label .mat-tab-label-content{display:inline-flex;justify-content:center;align-items:center;white-space:nowrap}.cdk-high-contrast-active .mat-tab-label{opacity:1}@media(max-width: 599px){.mat-tab-label{padding:0 12px}}@media(max-width: 959px){.mat-tab-label{padding:0 12px}}.mat-tab-group[mat-stretch-tabs]>.mat-tab-header .mat-tab-label{flex-basis:0;flex-grow:1}.mat-tab-body-wrapper{position:relative;overflow:hidden;display:flex;transition:height 500ms cubic-bezier(0.35, 0, 0.25, 1)}._mat-animation-noopable.mat-tab-body-wrapper{transition:none;animation:none}.mat-tab-body{top:0;left:0;right:0;bottom:0;position:absolute;display:block;overflow:hidden;outline:0;flex-basis:100%}.mat-tab-body.mat-tab-body-active{position:relative;overflow-x:hidden;overflow-y:auto;z-index:1;flex-grow:1}.mat-tab-group.mat-tab-group-dynamic-height .mat-tab-body.mat-tab-body-active{overflow-y:hidden}
|
|
1535
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1577
|
+
], queries: [{ propertyName: "_allTabs", predicate: MatTab, descendants: true }], viewQueries: [{ propertyName: "_tabBodyWrapper", first: true, predicate: ["tabBodyWrapper"], descendants: true }, { propertyName: "_tabHeader", first: true, predicate: ["tabHeader"], descendants: true }], exportAs: ["matTabGroup"], usesInheritance: true, ngImport: i0, template: "<mat-tab-header #tabHeader\n [selectedIndex]=\"selectedIndex || 0\"\n [disableRipple]=\"disableRipple\"\n [disablePagination]=\"disablePagination\"\n (indexFocused)=\"_focusChanged($event)\"\n (selectFocusedIndex)=\"selectedIndex = $event\">\n <div class=\"mat-tab-label mat-focus-indicator\" role=\"tab\" matTabLabelWrapper mat-ripple\n cdkMonitorElementFocus\n *ngFor=\"let tab of _tabs; let i = index\"\n [id]=\"_getTabLabelId(i)\"\n [attr.tabIndex]=\"_getTabIndex(tab, i)\"\n [attr.aria-posinset]=\"i + 1\"\n [attr.aria-setsize]=\"_tabs.length\"\n [attr.aria-controls]=\"_getTabContentId(i)\"\n [attr.aria-selected]=\"selectedIndex === i\"\n [attr.aria-label]=\"tab.ariaLabel || null\"\n [attr.aria-labelledby]=\"(!tab.ariaLabel && tab.ariaLabelledby) ? tab.ariaLabelledby : null\"\n [class.mat-tab-label-active]=\"selectedIndex === i\"\n [ngClass]=\"tab.labelClass\"\n [disabled]=\"tab.disabled\"\n [matRippleDisabled]=\"tab.disabled || disableRipple\"\n (click)=\"_handleClick(tab, tabHeader, i)\"\n (cdkFocusChange)=\"_tabFocusChanged($event, i)\">\n\n\n <div class=\"mat-tab-label-content\">\n <!-- If there is a label template, use it. -->\n <ng-template [ngIf]=\"tab.templateLabel\" [ngIfElse]=\"tabTextLabel\">\n <ng-template [cdkPortalOutlet]=\"tab.templateLabel\"></ng-template>\n </ng-template>\n\n <!-- If there is not a label template, fall back to the text label. -->\n <ng-template #tabTextLabel>{{tab.textLabel}}</ng-template>\n </div>\n </div>\n</mat-tab-header>\n\n<div\n class=\"mat-tab-body-wrapper\"\n [class._mat-animation-noopable]=\"_animationMode === 'NoopAnimations'\"\n #tabBodyWrapper>\n <mat-tab-body role=\"tabpanel\"\n *ngFor=\"let tab of _tabs; let i = index\"\n [id]=\"_getTabContentId(i)\"\n [attr.tabindex]=\"(contentTabIndex != null && selectedIndex === i) ? contentTabIndex : null\"\n [attr.aria-labelledby]=\"_getTabLabelId(i)\"\n [class.mat-tab-body-active]=\"selectedIndex === i\"\n [ngClass]=\"tab.bodyClass\"\n [content]=\"tab.content!\"\n [position]=\"tab.position!\"\n [origin]=\"tab.origin\"\n [animationDuration]=\"animationDuration\"\n [preserveContent]=\"preserveContent\"\n (_onCentered)=\"_removeTabBodyWrapperHeight()\"\n (_onCentering)=\"_setTabBodyWrapperHeight($event)\">\n </mat-tab-body>\n</div>\n", styles: [".mat-tab-group{display:flex;flex-direction:column;max-width:100%}.mat-tab-group.mat-tab-group-inverted-header{flex-direction:column-reverse}.mat-tab-label{height:48px;padding:0 24px;cursor:pointer;box-sizing:border-box;opacity:.6;min-width:160px;text-align:center;display:inline-flex;justify-content:center;align-items:center;white-space:nowrap;position:relative}.mat-tab-label:focus{outline:none}.mat-tab-label:focus:not(.mat-tab-disabled){opacity:1}.cdk-high-contrast-active .mat-tab-label:focus{outline:dotted 2px;outline-offset:-2px}.mat-tab-label.mat-tab-disabled{cursor:default}.cdk-high-contrast-active .mat-tab-label.mat-tab-disabled{opacity:.5}.mat-tab-label .mat-tab-label-content{display:inline-flex;justify-content:center;align-items:center;white-space:nowrap}.cdk-high-contrast-active .mat-tab-label{opacity:1}@media(max-width: 599px){.mat-tab-label{padding:0 12px}}@media(max-width: 959px){.mat-tab-label{padding:0 12px}}.mat-tab-group[mat-stretch-tabs]>.mat-tab-header .mat-tab-label{flex-basis:0;flex-grow:1}.mat-tab-body-wrapper{position:relative;overflow:hidden;display:flex;transition:height 500ms cubic-bezier(0.35, 0, 0.25, 1)}._mat-animation-noopable.mat-tab-body-wrapper{transition:none;animation:none}.mat-tab-body{top:0;left:0;right:0;bottom:0;position:absolute;display:block;overflow:hidden;outline:0;flex-basis:100%}.mat-tab-body.mat-tab-body-active{position:relative;overflow-x:hidden;overflow-y:auto;z-index:1;flex-grow:1}.mat-tab-group.mat-tab-group-dynamic-height .mat-tab-body.mat-tab-body-active{overflow-y:hidden}"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { kind: "directive", type: i4.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { kind: "directive", type: i7.CdkMonitorFocus, selector: "[cdkMonitorElementFocus], [cdkMonitorSubtreeFocus]", outputs: ["cdkFocusChange"] }, { kind: "directive", type: MatTabLabelWrapper, selector: "[matTabLabelWrapper]", inputs: ["disabled"] }, { kind: "component", type: MatTabBody, selector: "mat-tab-body" }, { kind: "component", type: MatTabHeader, selector: "mat-tab-header", inputs: ["selectedIndex"], outputs: ["selectFocusedIndex", "indexFocused"] }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None });
|
|
1578
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0-next.14", ngImport: i0, type: MatTabGroup, decorators: [{
|
|
1536
1579
|
type: Component,
|
|
1537
1580
|
args: [{ selector: 'mat-tab-group', exportAs: 'matTabGroup', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.Default, inputs: ['color', 'disableRipple'], providers: [
|
|
1538
1581
|
{
|
|
@@ -1543,7 +1586,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.0", ngImpor
|
|
|
1543
1586
|
'class': 'mat-tab-group',
|
|
1544
1587
|
'[class.mat-tab-group-dynamic-height]': 'dynamicHeight',
|
|
1545
1588
|
'[class.mat-tab-group-inverted-header]': 'headerPosition === "below"',
|
|
1546
|
-
}, template: "<mat-tab-header #tabHeader\n [selectedIndex]=\"selectedIndex || 0\"\n [disableRipple]=\"disableRipple\"\n [disablePagination]=\"disablePagination\"\n (indexFocused)=\"_focusChanged($event)\"\n (selectFocusedIndex)=\"selectedIndex = $event\">\n <div class=\"mat-tab-label mat-focus-indicator\" role=\"tab\" matTabLabelWrapper mat-ripple\n cdkMonitorElementFocus\n *ngFor=\"let tab of _tabs; let i = index\"\n [id]=\"_getTabLabelId(i)\"\n [attr.tabIndex]=\"_getTabIndex(tab, i)\"\n [attr.aria-posinset]=\"i + 1\"\n [attr.aria-setsize]=\"_tabs.length\"\n [attr.aria-controls]=\"_getTabContentId(i)\"\n [attr.aria-selected]=\"selectedIndex === i\"\n [attr.aria-label]=\"tab.ariaLabel || null\"\n [attr.aria-labelledby]=\"(!tab.ariaLabel && tab.ariaLabelledby) ? tab.ariaLabelledby : null\"\n [class.mat-tab-label-active]=\"selectedIndex === i\"\n [ngClass]=\"tab.labelClass\"\n [disabled]=\"tab.disabled\"\n [matRippleDisabled]=\"tab.disabled || disableRipple\"\n (click)=\"_handleClick(tab, tabHeader, i)\"\n (cdkFocusChange)=\"_tabFocusChanged($event, i)\">\n\n\n <div class=\"mat-tab-label-content\">\n <!-- If there is a label template, use it. -->\n <ng-template [ngIf]=\"tab.templateLabel\" [ngIfElse]=\"tabTextLabel\">\n <ng-template [cdkPortalOutlet]=\"tab.templateLabel\"></ng-template>\n </ng-template>\n\n <!-- If there is not a label template, fall back to the text label. -->\n <ng-template #tabTextLabel>{{tab.textLabel}}</ng-template>\n </div>\n </div>\n</mat-tab-header>\n\n<div\n class=\"mat-tab-body-wrapper\"\n [class._mat-animation-noopable]=\"_animationMode === 'NoopAnimations'\"\n #tabBodyWrapper>\n <mat-tab-body role=\"tabpanel\"\n *ngFor=\"let tab of _tabs; let i = index\"\n [id]=\"_getTabContentId(i)\"\n [attr.tabindex]=\"(contentTabIndex != null && selectedIndex === i) ? contentTabIndex : null\"\n [attr.aria-labelledby]=\"_getTabLabelId(i)\"\n [class.mat-tab-body-active]=\"selectedIndex === i\"\n [ngClass]=\"tab.bodyClass\"\n [content]=\"tab.content!\"\n [position]=\"tab.position!\"\n [origin]=\"tab.origin\"\n [animationDuration]=\"animationDuration\"\n [preserveContent]=\"preserveContent\"\n (_onCentered)=\"_removeTabBodyWrapperHeight()\"\n (_onCentering)=\"_setTabBodyWrapperHeight($event)\">\n </mat-tab-body>\n</div>\n", styles: [".mat-tab-group{display:flex;flex-direction:column;max-width:100%}.mat-tab-group.mat-tab-group-inverted-header{flex-direction:column-reverse}.mat-tab-label{height:48px;padding:0 24px;cursor:pointer;box-sizing:border-box;opacity:.6;min-width:160px;text-align:center;display:inline-flex;justify-content:center;align-items:center;white-space:nowrap;position:relative}.mat-tab-label:focus{outline:none}.mat-tab-label:focus:not(.mat-tab-disabled){opacity:1}.cdk-high-contrast-active .mat-tab-label:focus{outline:dotted 2px;outline-offset:-2px}.mat-tab-label.mat-tab-disabled{cursor:default}.cdk-high-contrast-active .mat-tab-label.mat-tab-disabled{opacity:.5}.mat-tab-label .mat-tab-label-content{display:inline-flex;justify-content:center;align-items:center;white-space:nowrap}.cdk-high-contrast-active .mat-tab-label{opacity:1}@media(max-width: 599px){.mat-tab-label{padding:0 12px}}@media(max-width: 959px){.mat-tab-label{padding:0 12px}}.mat-tab-group[mat-stretch-tabs]>.mat-tab-header .mat-tab-label{flex-basis:0;flex-grow:1}.mat-tab-body-wrapper{position:relative;overflow:hidden;display:flex;transition:height 500ms cubic-bezier(0.35, 0, 0.25, 1)}._mat-animation-noopable.mat-tab-body-wrapper{transition:none;animation:none}.mat-tab-body{top:0;left:0;right:0;bottom:0;position:absolute;display:block;overflow:hidden;outline:0;flex-basis:100%}.mat-tab-body.mat-tab-body-active{position:relative;overflow-x:hidden;overflow-y:auto;z-index:1;flex-grow:1}.mat-tab-group.mat-tab-group-dynamic-height .mat-tab-body.mat-tab-body-active{overflow-y:hidden}
|
|
1589
|
+
}, template: "<mat-tab-header #tabHeader\n [selectedIndex]=\"selectedIndex || 0\"\n [disableRipple]=\"disableRipple\"\n [disablePagination]=\"disablePagination\"\n (indexFocused)=\"_focusChanged($event)\"\n (selectFocusedIndex)=\"selectedIndex = $event\">\n <div class=\"mat-tab-label mat-focus-indicator\" role=\"tab\" matTabLabelWrapper mat-ripple\n cdkMonitorElementFocus\n *ngFor=\"let tab of _tabs; let i = index\"\n [id]=\"_getTabLabelId(i)\"\n [attr.tabIndex]=\"_getTabIndex(tab, i)\"\n [attr.aria-posinset]=\"i + 1\"\n [attr.aria-setsize]=\"_tabs.length\"\n [attr.aria-controls]=\"_getTabContentId(i)\"\n [attr.aria-selected]=\"selectedIndex === i\"\n [attr.aria-label]=\"tab.ariaLabel || null\"\n [attr.aria-labelledby]=\"(!tab.ariaLabel && tab.ariaLabelledby) ? tab.ariaLabelledby : null\"\n [class.mat-tab-label-active]=\"selectedIndex === i\"\n [ngClass]=\"tab.labelClass\"\n [disabled]=\"tab.disabled\"\n [matRippleDisabled]=\"tab.disabled || disableRipple\"\n (click)=\"_handleClick(tab, tabHeader, i)\"\n (cdkFocusChange)=\"_tabFocusChanged($event, i)\">\n\n\n <div class=\"mat-tab-label-content\">\n <!-- If there is a label template, use it. -->\n <ng-template [ngIf]=\"tab.templateLabel\" [ngIfElse]=\"tabTextLabel\">\n <ng-template [cdkPortalOutlet]=\"tab.templateLabel\"></ng-template>\n </ng-template>\n\n <!-- If there is not a label template, fall back to the text label. -->\n <ng-template #tabTextLabel>{{tab.textLabel}}</ng-template>\n </div>\n </div>\n</mat-tab-header>\n\n<div\n class=\"mat-tab-body-wrapper\"\n [class._mat-animation-noopable]=\"_animationMode === 'NoopAnimations'\"\n #tabBodyWrapper>\n <mat-tab-body role=\"tabpanel\"\n *ngFor=\"let tab of _tabs; let i = index\"\n [id]=\"_getTabContentId(i)\"\n [attr.tabindex]=\"(contentTabIndex != null && selectedIndex === i) ? contentTabIndex : null\"\n [attr.aria-labelledby]=\"_getTabLabelId(i)\"\n [class.mat-tab-body-active]=\"selectedIndex === i\"\n [ngClass]=\"tab.bodyClass\"\n [content]=\"tab.content!\"\n [position]=\"tab.position!\"\n [origin]=\"tab.origin\"\n [animationDuration]=\"animationDuration\"\n [preserveContent]=\"preserveContent\"\n (_onCentered)=\"_removeTabBodyWrapperHeight()\"\n (_onCentering)=\"_setTabBodyWrapperHeight($event)\">\n </mat-tab-body>\n</div>\n", styles: [".mat-tab-group{display:flex;flex-direction:column;max-width:100%}.mat-tab-group.mat-tab-group-inverted-header{flex-direction:column-reverse}.mat-tab-label{height:48px;padding:0 24px;cursor:pointer;box-sizing:border-box;opacity:.6;min-width:160px;text-align:center;display:inline-flex;justify-content:center;align-items:center;white-space:nowrap;position:relative}.mat-tab-label:focus{outline:none}.mat-tab-label:focus:not(.mat-tab-disabled){opacity:1}.cdk-high-contrast-active .mat-tab-label:focus{outline:dotted 2px;outline-offset:-2px}.mat-tab-label.mat-tab-disabled{cursor:default}.cdk-high-contrast-active .mat-tab-label.mat-tab-disabled{opacity:.5}.mat-tab-label .mat-tab-label-content{display:inline-flex;justify-content:center;align-items:center;white-space:nowrap}.cdk-high-contrast-active .mat-tab-label{opacity:1}@media(max-width: 599px){.mat-tab-label{padding:0 12px}}@media(max-width: 959px){.mat-tab-label{padding:0 12px}}.mat-tab-group[mat-stretch-tabs]>.mat-tab-header .mat-tab-label{flex-basis:0;flex-grow:1}.mat-tab-body-wrapper{position:relative;overflow:hidden;display:flex;transition:height 500ms cubic-bezier(0.35, 0, 0.25, 1)}._mat-animation-noopable.mat-tab-body-wrapper{transition:none;animation:none}.mat-tab-body{top:0;left:0;right:0;bottom:0;position:absolute;display:block;overflow:hidden;outline:0;flex-basis:100%}.mat-tab-body.mat-tab-body-active{position:relative;overflow-x:hidden;overflow-y:auto;z-index:1;flex-grow:1}.mat-tab-group.mat-tab-group-dynamic-height .mat-tab-body.mat-tab-body-active{overflow-y:hidden}"] }]
|
|
1547
1590
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: undefined, decorators: [{
|
|
1548
1591
|
type: Inject,
|
|
1549
1592
|
args: [MAT_TABS_CONFIG]
|
|
@@ -1639,9 +1682,9 @@ class _MatTabNavBase extends MatPaginatedTabHeader {
|
|
|
1639
1682
|
return this.tabPanel ? 'tablist' : this._elementRef.nativeElement.getAttribute('role');
|
|
1640
1683
|
}
|
|
1641
1684
|
}
|
|
1642
|
-
_MatTabNavBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1643
|
-
_MatTabNavBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "
|
|
1644
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1685
|
+
_MatTabNavBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0-next.14", ngImport: i0, type: _MatTabNavBase, deps: [{ token: i0.ElementRef }, { token: i1.Directionality, optional: true }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: i1$1.ViewportRuler }, { token: i3.Platform }, { token: ANIMATION_MODULE_TYPE, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
|
|
1686
|
+
_MatTabNavBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "14.0.0-next.14", type: _MatTabNavBase, inputs: { backgroundColor: "backgroundColor", disableRipple: "disableRipple", color: "color", tabPanel: "tabPanel" }, usesInheritance: true, ngImport: i0 });
|
|
1687
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0-next.14", ngImport: i0, type: _MatTabNavBase, decorators: [{
|
|
1645
1688
|
type: Directive
|
|
1646
1689
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i1.Directionality, decorators: [{
|
|
1647
1690
|
type: Optional
|
|
@@ -1668,9 +1711,9 @@ class MatTabNav extends _MatTabNavBase {
|
|
|
1668
1711
|
super(elementRef, dir, ngZone, changeDetectorRef, viewportRuler, platform, animationMode);
|
|
1669
1712
|
}
|
|
1670
1713
|
}
|
|
1671
|
-
MatTabNav.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1672
|
-
MatTabNav.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "
|
|
1673
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1714
|
+
MatTabNav.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0-next.14", ngImport: i0, type: MatTabNav, deps: [{ token: i0.ElementRef }, { token: i1.Directionality, optional: true }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: i1$1.ViewportRuler }, { token: i3.Platform }, { token: ANIMATION_MODULE_TYPE, optional: true }], target: i0.ɵɵFactoryTarget.Component });
|
|
1715
|
+
MatTabNav.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "14.0.0-next.14", type: MatTabNav, selector: "[mat-tab-nav-bar]", inputs: { color: "color" }, host: { properties: { "attr.role": "_getRole()", "class.mat-tab-header-pagination-controls-enabled": "_showPaginationControls", "class.mat-tab-header-rtl": "_getLayoutDirection() == 'rtl'", "class.mat-primary": "color !== \"warn\" && color !== \"accent\"", "class.mat-accent": "color === \"accent\"", "class.mat-warn": "color === \"warn\"" }, classAttribute: "mat-tab-nav-bar mat-tab-header" }, queries: [{ propertyName: "_items", predicate: i0.forwardRef(function () { return MatTabLink; }), descendants: true }], viewQueries: [{ propertyName: "_inkBar", first: true, predicate: MatInkBar, descendants: true, static: true }, { propertyName: "_tabListContainer", first: true, predicate: ["tabListContainer"], descendants: true, static: true }, { propertyName: "_tabList", first: true, predicate: ["tabList"], descendants: true, static: true }, { propertyName: "_tabListInner", first: true, predicate: ["tabListInner"], descendants: true, static: true }, { propertyName: "_nextPaginator", first: true, predicate: ["nextPaginator"], descendants: true }, { propertyName: "_previousPaginator", first: true, predicate: ["previousPaginator"], descendants: true }], exportAs: ["matTabNavBar", "matTabNav"], usesInheritance: true, ngImport: i0, template: "<button class=\"mat-tab-header-pagination mat-tab-header-pagination-before mat-elevation-z4\"\n #previousPaginator\n aria-hidden=\"true\"\n type=\"button\"\n mat-ripple\n tabindex=\"-1\"\n [matRippleDisabled]=\"_disableScrollBefore || disableRipple\"\n [class.mat-tab-header-pagination-disabled]=\"_disableScrollBefore\"\n [disabled]=\"_disableScrollBefore || null\"\n (click)=\"_handlePaginatorClick('before')\"\n (mousedown)=\"_handlePaginatorPress('before', $event)\"\n (touchend)=\"_stopInterval()\">\n <div class=\"mat-tab-header-pagination-chevron\"></div>\n</button>\n\n<div class=\"mat-tab-link-container\" #tabListContainer (keydown)=\"_handleKeydown($event)\">\n <div\n class=\"mat-tab-list\"\n [class._mat-animation-noopable]=\"_animationMode === 'NoopAnimations'\"\n #tabList\n (cdkObserveContent)=\"_onContentChanges()\">\n <div class=\"mat-tab-links\" #tabListInner>\n <ng-content></ng-content>\n </div>\n <mat-ink-bar></mat-ink-bar>\n </div>\n</div>\n\n<button class=\"mat-tab-header-pagination mat-tab-header-pagination-after mat-elevation-z4\"\n #nextPaginator\n aria-hidden=\"true\"\n type=\"button\"\n mat-ripple\n [matRippleDisabled]=\"_disableScrollAfter || disableRipple\"\n [class.mat-tab-header-pagination-disabled]=\"_disableScrollAfter\"\n [disabled]=\"_disableScrollAfter || null\"\n tabindex=\"-1\"\n (mousedown)=\"_handlePaginatorPress('after', $event)\"\n (click)=\"_handlePaginatorClick('after')\"\n (touchend)=\"_stopInterval()\">\n <div class=\"mat-tab-header-pagination-chevron\"></div>\n</button>\n", styles: [".mat-tab-header{display:flex;overflow:hidden;position:relative;flex-shrink:0}.mat-tab-header-pagination{-webkit-user-select:none;user-select:none;position:relative;display:none;justify-content:center;align-items:center;min-width:32px;cursor:pointer;z-index:2;-webkit-tap-highlight-color:rgba(0,0,0,0);touch-action:none;box-sizing:content-box;background:none;border:none;outline:0;padding:0}.mat-tab-header-pagination::-moz-focus-inner{border:0}.mat-tab-header-pagination-controls-enabled .mat-tab-header-pagination{display:flex}.mat-tab-header-pagination-before,.mat-tab-header-rtl .mat-tab-header-pagination-after{padding-left:4px}.mat-tab-header-pagination-before .mat-tab-header-pagination-chevron,.mat-tab-header-rtl .mat-tab-header-pagination-after .mat-tab-header-pagination-chevron{transform:rotate(-135deg)}.mat-tab-header-rtl .mat-tab-header-pagination-before,.mat-tab-header-pagination-after{padding-right:4px}.mat-tab-header-rtl .mat-tab-header-pagination-before .mat-tab-header-pagination-chevron,.mat-tab-header-pagination-after .mat-tab-header-pagination-chevron{transform:rotate(45deg)}.mat-tab-header-pagination-chevron{border-style:solid;border-width:2px 2px 0 0;height:8px;width:8px}.mat-tab-header-pagination-disabled{box-shadow:none;cursor:default}.mat-tab-list{flex-grow:1;position:relative;transition:transform 500ms cubic-bezier(0.35, 0, 0.25, 1)}.mat-tab-links{display:flex}[mat-align-tabs=center]>.mat-tab-link-container .mat-tab-links{justify-content:center}[mat-align-tabs=end]>.mat-tab-link-container .mat-tab-links{justify-content:flex-end}.mat-ink-bar{position:absolute;bottom:0;height:2px;transition:500ms cubic-bezier(0.35, 0, 0.25, 1)}._mat-animation-noopable.mat-ink-bar{transition:none;animation:none}.mat-tab-group-inverted-header .mat-ink-bar{bottom:auto;top:0}.cdk-high-contrast-active .mat-ink-bar{outline:solid 2px;height:0}.mat-tab-link-container{display:flex;flex-grow:1;overflow:hidden;z-index:1}.mat-tab-link{height:48px;padding:0 24px;cursor:pointer;box-sizing:border-box;opacity:.6;min-width:160px;text-align:center;display:inline-flex;justify-content:center;align-items:center;white-space:nowrap;vertical-align:top;text-decoration:none;position:relative;overflow:hidden;-webkit-tap-highlight-color:rgba(0,0,0,0)}.mat-tab-link:focus{outline:none}.mat-tab-link:focus:not(.mat-tab-disabled){opacity:1}.cdk-high-contrast-active .mat-tab-link:focus{outline:dotted 2px;outline-offset:-2px}.mat-tab-link.mat-tab-disabled{cursor:default}.cdk-high-contrast-active .mat-tab-link.mat-tab-disabled{opacity:.5}.mat-tab-link .mat-tab-label-content{display:inline-flex;justify-content:center;align-items:center;white-space:nowrap}.cdk-high-contrast-active .mat-tab-link{opacity:1}[mat-stretch-tabs] .mat-tab-link{flex-basis:0;flex-grow:1}.mat-tab-link.mat-tab-disabled{pointer-events:none}@media(max-width: 599px){.mat-tab-link{min-width:72px}}"], dependencies: [{ kind: "directive", type: i4.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { kind: "directive", type: i5.CdkObserveContent, selector: "[cdkObserveContent]", inputs: ["cdkObserveContentDisabled", "debounce"], outputs: ["cdkObserveContent"], exportAs: ["cdkObserveContent"] }, { kind: "directive", type: MatInkBar, selector: "mat-ink-bar" }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None });
|
|
1716
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0-next.14", ngImport: i0, type: MatTabNav, decorators: [{
|
|
1674
1717
|
type: Component,
|
|
1675
1718
|
args: [{ selector: '[mat-tab-nav-bar]', exportAs: 'matTabNavBar, matTabNav', inputs: ['color'], host: {
|
|
1676
1719
|
'[attr.role]': '_getRole()',
|
|
@@ -1680,7 +1723,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.0", ngImpor
|
|
|
1680
1723
|
'[class.mat-primary]': 'color !== "warn" && color !== "accent"',
|
|
1681
1724
|
'[class.mat-accent]': 'color === "accent"',
|
|
1682
1725
|
'[class.mat-warn]': 'color === "warn"',
|
|
1683
|
-
}, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.Default, template: "<button class=\"mat-tab-header-pagination mat-tab-header-pagination-before mat-elevation-z4\"\n #previousPaginator\n aria-hidden=\"true\"\n type=\"button\"\n mat-ripple\n tabindex=\"-1\"\n [matRippleDisabled]=\"_disableScrollBefore || disableRipple\"\n [class.mat-tab-header-pagination-disabled]=\"_disableScrollBefore\"\n [disabled]=\"_disableScrollBefore || null\"\n (click)=\"_handlePaginatorClick('before')\"\n (mousedown)=\"_handlePaginatorPress('before', $event)\"\n (touchend)=\"_stopInterval()\">\n <div class=\"mat-tab-header-pagination-chevron\"></div>\n</button>\n\n<div class=\"mat-tab-link-container\" #tabListContainer (keydown)=\"_handleKeydown($event)\">\n <div\n class=\"mat-tab-list\"\n [class._mat-animation-noopable]=\"_animationMode === 'NoopAnimations'\"\n #tabList\n (cdkObserveContent)=\"_onContentChanges()\">\n <div class=\"mat-tab-links\" #tabListInner>\n <ng-content></ng-content>\n </div>\n <mat-ink-bar></mat-ink-bar>\n </div>\n</div>\n\n<button class=\"mat-tab-header-pagination mat-tab-header-pagination-after mat-elevation-z4\"\n #nextPaginator\n aria-hidden=\"true\"\n type=\"button\"\n mat-ripple\n [matRippleDisabled]=\"_disableScrollAfter || disableRipple\"\n [class.mat-tab-header-pagination-disabled]=\"_disableScrollAfter\"\n [disabled]=\"_disableScrollAfter || null\"\n tabindex=\"-1\"\n (mousedown)=\"_handlePaginatorPress('after', $event)\"\n (click)=\"_handlePaginatorClick('after')\"\n (touchend)=\"_stopInterval()\">\n <div class=\"mat-tab-header-pagination-chevron\"></div>\n</button>\n", styles: [".mat-tab-header{display:flex;overflow:hidden;position:relative;flex-shrink:0}.mat-tab-header-pagination{-webkit-user-select:none
|
|
1726
|
+
}, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.Default, template: "<button class=\"mat-tab-header-pagination mat-tab-header-pagination-before mat-elevation-z4\"\n #previousPaginator\n aria-hidden=\"true\"\n type=\"button\"\n mat-ripple\n tabindex=\"-1\"\n [matRippleDisabled]=\"_disableScrollBefore || disableRipple\"\n [class.mat-tab-header-pagination-disabled]=\"_disableScrollBefore\"\n [disabled]=\"_disableScrollBefore || null\"\n (click)=\"_handlePaginatorClick('before')\"\n (mousedown)=\"_handlePaginatorPress('before', $event)\"\n (touchend)=\"_stopInterval()\">\n <div class=\"mat-tab-header-pagination-chevron\"></div>\n</button>\n\n<div class=\"mat-tab-link-container\" #tabListContainer (keydown)=\"_handleKeydown($event)\">\n <div\n class=\"mat-tab-list\"\n [class._mat-animation-noopable]=\"_animationMode === 'NoopAnimations'\"\n #tabList\n (cdkObserveContent)=\"_onContentChanges()\">\n <div class=\"mat-tab-links\" #tabListInner>\n <ng-content></ng-content>\n </div>\n <mat-ink-bar></mat-ink-bar>\n </div>\n</div>\n\n<button class=\"mat-tab-header-pagination mat-tab-header-pagination-after mat-elevation-z4\"\n #nextPaginator\n aria-hidden=\"true\"\n type=\"button\"\n mat-ripple\n [matRippleDisabled]=\"_disableScrollAfter || disableRipple\"\n [class.mat-tab-header-pagination-disabled]=\"_disableScrollAfter\"\n [disabled]=\"_disableScrollAfter || null\"\n tabindex=\"-1\"\n (mousedown)=\"_handlePaginatorPress('after', $event)\"\n (click)=\"_handlePaginatorClick('after')\"\n (touchend)=\"_stopInterval()\">\n <div class=\"mat-tab-header-pagination-chevron\"></div>\n</button>\n", styles: [".mat-tab-header{display:flex;overflow:hidden;position:relative;flex-shrink:0}.mat-tab-header-pagination{-webkit-user-select:none;user-select:none;position:relative;display:none;justify-content:center;align-items:center;min-width:32px;cursor:pointer;z-index:2;-webkit-tap-highlight-color:rgba(0,0,0,0);touch-action:none;box-sizing:content-box;background:none;border:none;outline:0;padding:0}.mat-tab-header-pagination::-moz-focus-inner{border:0}.mat-tab-header-pagination-controls-enabled .mat-tab-header-pagination{display:flex}.mat-tab-header-pagination-before,.mat-tab-header-rtl .mat-tab-header-pagination-after{padding-left:4px}.mat-tab-header-pagination-before .mat-tab-header-pagination-chevron,.mat-tab-header-rtl .mat-tab-header-pagination-after .mat-tab-header-pagination-chevron{transform:rotate(-135deg)}.mat-tab-header-rtl .mat-tab-header-pagination-before,.mat-tab-header-pagination-after{padding-right:4px}.mat-tab-header-rtl .mat-tab-header-pagination-before .mat-tab-header-pagination-chevron,.mat-tab-header-pagination-after .mat-tab-header-pagination-chevron{transform:rotate(45deg)}.mat-tab-header-pagination-chevron{border-style:solid;border-width:2px 2px 0 0;height:8px;width:8px}.mat-tab-header-pagination-disabled{box-shadow:none;cursor:default}.mat-tab-list{flex-grow:1;position:relative;transition:transform 500ms cubic-bezier(0.35, 0, 0.25, 1)}.mat-tab-links{display:flex}[mat-align-tabs=center]>.mat-tab-link-container .mat-tab-links{justify-content:center}[mat-align-tabs=end]>.mat-tab-link-container .mat-tab-links{justify-content:flex-end}.mat-ink-bar{position:absolute;bottom:0;height:2px;transition:500ms cubic-bezier(0.35, 0, 0.25, 1)}._mat-animation-noopable.mat-ink-bar{transition:none;animation:none}.mat-tab-group-inverted-header .mat-ink-bar{bottom:auto;top:0}.cdk-high-contrast-active .mat-ink-bar{outline:solid 2px;height:0}.mat-tab-link-container{display:flex;flex-grow:1;overflow:hidden;z-index:1}.mat-tab-link{height:48px;padding:0 24px;cursor:pointer;box-sizing:border-box;opacity:.6;min-width:160px;text-align:center;display:inline-flex;justify-content:center;align-items:center;white-space:nowrap;vertical-align:top;text-decoration:none;position:relative;overflow:hidden;-webkit-tap-highlight-color:rgba(0,0,0,0)}.mat-tab-link:focus{outline:none}.mat-tab-link:focus:not(.mat-tab-disabled){opacity:1}.cdk-high-contrast-active .mat-tab-link:focus{outline:dotted 2px;outline-offset:-2px}.mat-tab-link.mat-tab-disabled{cursor:default}.cdk-high-contrast-active .mat-tab-link.mat-tab-disabled{opacity:.5}.mat-tab-link .mat-tab-label-content{display:inline-flex;justify-content:center;align-items:center;white-space:nowrap}.cdk-high-contrast-active .mat-tab-link{opacity:1}[mat-stretch-tabs] .mat-tab-link{flex-basis:0;flex-grow:1}.mat-tab-link.mat-tab-disabled{pointer-events:none}@media(max-width: 599px){.mat-tab-link{min-width:72px}}"] }]
|
|
1684
1727
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i1.Directionality, decorators: [{
|
|
1685
1728
|
type: Optional
|
|
1686
1729
|
}] }, { type: i0.NgZone }, { type: i0.ChangeDetectorRef }, { type: i1$1.ViewportRuler }, { type: i3.Platform }, { type: undefined, decorators: [{
|
|
@@ -1793,16 +1836,16 @@ class _MatTabLinkBase extends _MatTabLinkMixinBase {
|
|
|
1793
1836
|
}
|
|
1794
1837
|
_getTabIndex() {
|
|
1795
1838
|
if (this._tabNavBar.tabPanel) {
|
|
1796
|
-
return this._isActive ? 0 : -1;
|
|
1839
|
+
return this._isActive && !this.disabled ? 0 : -1;
|
|
1797
1840
|
}
|
|
1798
1841
|
else {
|
|
1799
1842
|
return this.tabIndex;
|
|
1800
1843
|
}
|
|
1801
1844
|
}
|
|
1802
1845
|
}
|
|
1803
|
-
_MatTabLinkBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1804
|
-
_MatTabLinkBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "
|
|
1805
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1846
|
+
_MatTabLinkBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0-next.14", ngImport: i0, type: _MatTabLinkBase, deps: [{ token: _MatTabNavBase }, { token: i0.ElementRef }, { token: MAT_RIPPLE_GLOBAL_OPTIONS, optional: true }, { token: 'tabindex', attribute: true }, { token: i7.FocusMonitor }, { token: ANIMATION_MODULE_TYPE, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
|
|
1847
|
+
_MatTabLinkBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "14.0.0-next.14", type: _MatTabLinkBase, inputs: { active: "active", id: "id" }, usesInheritance: true, ngImport: i0 });
|
|
1848
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0-next.14", ngImport: i0, type: _MatTabLinkBase, decorators: [{
|
|
1806
1849
|
type: Directive
|
|
1807
1850
|
}], ctorParameters: function () { return [{ type: _MatTabNavBase }, { type: i0.ElementRef }, { type: undefined, decorators: [{
|
|
1808
1851
|
type: Optional
|
|
@@ -1836,9 +1879,9 @@ class MatTabLink extends _MatTabLinkBase {
|
|
|
1836
1879
|
this._tabLinkRipple._removeTriggerEvents();
|
|
1837
1880
|
}
|
|
1838
1881
|
}
|
|
1839
|
-
MatTabLink.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1840
|
-
MatTabLink.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "
|
|
1841
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1882
|
+
MatTabLink.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0-next.14", ngImport: i0, type: MatTabLink, deps: [{ token: MatTabNav }, { token: i0.ElementRef }, { token: i0.NgZone }, { token: i3.Platform }, { token: MAT_RIPPLE_GLOBAL_OPTIONS, optional: true }, { token: 'tabindex', attribute: true }, { token: i7.FocusMonitor }, { token: ANIMATION_MODULE_TYPE, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
|
|
1883
|
+
MatTabLink.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "14.0.0-next.14", type: MatTabLink, selector: "[mat-tab-link], [matTabLink]", inputs: { disabled: "disabled", disableRipple: "disableRipple", tabIndex: "tabIndex" }, host: { listeners: { "focus": "_handleFocus()", "keydown": "_handleKeydown($event)" }, properties: { "attr.aria-controls": "_getAriaControls()", "attr.aria-current": "_getAriaCurrent()", "attr.aria-disabled": "disabled", "attr.aria-selected": "_getAriaSelected()", "attr.id": "id", "attr.tabIndex": "_getTabIndex()", "attr.role": "_getRole()", "class.mat-tab-disabled": "disabled", "class.mat-tab-label-active": "active" }, classAttribute: "mat-tab-link mat-focus-indicator" }, exportAs: ["matTabLink"], usesInheritance: true, ngImport: i0 });
|
|
1884
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0-next.14", ngImport: i0, type: MatTabLink, decorators: [{
|
|
1842
1885
|
type: Directive,
|
|
1843
1886
|
args: [{
|
|
1844
1887
|
selector: '[mat-tab-link], [matTabLink]',
|
|
@@ -1882,9 +1925,9 @@ class MatTabNavPanel {
|
|
|
1882
1925
|
this.id = `mat-tab-nav-panel-${nextUniqueId++}`;
|
|
1883
1926
|
}
|
|
1884
1927
|
}
|
|
1885
|
-
MatTabNavPanel.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1886
|
-
MatTabNavPanel.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "
|
|
1887
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1928
|
+
MatTabNavPanel.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0-next.14", ngImport: i0, type: MatTabNavPanel, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1929
|
+
MatTabNavPanel.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "14.0.0-next.14", type: MatTabNavPanel, selector: "mat-tab-nav-panel", inputs: { id: "id" }, host: { attributes: { "role": "tabpanel" }, properties: { "attr.aria-labelledby": "_activeTabId", "attr.id": "id" }, classAttribute: "mat-tab-nav-panel" }, exportAs: ["matTabNavPanel"], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
1930
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0-next.14", ngImport: i0, type: MatTabNavPanel, decorators: [{
|
|
1888
1931
|
type: Component,
|
|
1889
1932
|
args: [{
|
|
1890
1933
|
selector: 'mat-tab-nav-panel',
|
|
@@ -1912,8 +1955,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.0", ngImpor
|
|
|
1912
1955
|
*/
|
|
1913
1956
|
class MatTabsModule {
|
|
1914
1957
|
}
|
|
1915
|
-
MatTabsModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1916
|
-
MatTabsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "
|
|
1958
|
+
MatTabsModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0-next.14", ngImport: i0, type: MatTabsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
1959
|
+
MatTabsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "14.0.0-next.14", ngImport: i0, type: MatTabsModule, declarations: [MatTabGroup,
|
|
1917
1960
|
MatTabLabel,
|
|
1918
1961
|
MatTab,
|
|
1919
1962
|
MatInkBar,
|
|
@@ -1937,7 +1980,7 @@ MatTabsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version:
|
|
|
1937
1980
|
MatTabNavPanel,
|
|
1938
1981
|
MatTabLink,
|
|
1939
1982
|
MatTabContent] });
|
|
1940
|
-
MatTabsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
1983
|
+
MatTabsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.0.0-next.14", ngImport: i0, type: MatTabsModule, imports: [[
|
|
1941
1984
|
CommonModule,
|
|
1942
1985
|
MatCommonModule,
|
|
1943
1986
|
PortalModule,
|
|
@@ -1945,7 +1988,7 @@ MatTabsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version:
|
|
|
1945
1988
|
ObserversModule,
|
|
1946
1989
|
A11yModule,
|
|
1947
1990
|
], MatCommonModule] });
|
|
1948
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1991
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0-next.14", ngImport: i0, type: MatTabsModule, decorators: [{
|
|
1949
1992
|
type: NgModule,
|
|
1950
1993
|
args: [{
|
|
1951
1994
|
imports: [
|