@depup/angular__material 21.2.2-depup.19

package/fesm2022/tabs.mjs

@@ -0,0 +1,2435 @@
+import { FocusKeyManager, _IdGenerator, CdkMonitorFocus, FocusMonitor } from '@angular/cdk/a11y';
+import { Directionality, BidiModule } from '@angular/cdk/bidi';
+import { hasModifierKey, SPACE, ENTER } from '@angular/cdk/keycodes';
+import { SharedResizeObserver } from '@angular/cdk/observers/private';
+import { Platform } from '@angular/cdk/platform';
+import { ViewportRuler, CdkScrollable } from '@angular/cdk/scrolling';
+import * as i0 from '@angular/core';
+import { InjectionToken, inject, TemplateRef, Directive, ViewContainerRef, booleanAttribute, Component, ChangeDetectionStrategy, ViewEncapsulation, Input, ContentChild, ViewChild, ElementRef, ChangeDetectorRef, NgZone, Injector, Renderer2, EventEmitter, afterNextRender, numberAttribute, Output, ContentChildren, QueryList, ViewChildren, signal, forwardRef, computed, HostAttributeToken, NgModule } from '@angular/core';
+import { Subject, of, merge, EMPTY, Observable, timer, Subscription, BehaviorSubject } from 'rxjs';
+import { debounceTime, takeUntil, startWith, switchMap, skip, filter } from 'rxjs/operators';
+import { _animationsDisabled } from './_animation-chunk.mjs';
+import { CdkPortal, TemplatePortal, CdkPortalOutlet } from '@angular/cdk/portal';
+import { _CdkPrivateStyleLoader } from '@angular/cdk/private';
+import { _StructuralStylesLoader } from './_structural-styles-chunk.mjs';
+import { CdkObserveContent } from '@angular/cdk/observers';
+import { MatRipple, MAT_RIPPLE_GLOBAL_OPTIONS } from './_ripple-chunk.mjs';
+import '@angular/cdk/layout';
+import '@angular/cdk/coercion';
+
+const MAT_TAB_CONTENT = new InjectionToken('MatTabContent');
+class MatTabContent {
+  template = inject(TemplateRef);
+  constructor() {}
+  static ɵfac = i0.ɵɵngDeclareFactory({
+    minVersion: "12.0.0",
+    version: "22.0.0-next.1",
+    ngImport: i0,
+    type: MatTabContent,
+    deps: [],
+    target: i0.ɵɵFactoryTarget.Directive
+  });
+  static ɵdir = i0.ɵɵngDeclareDirective({
+    minVersion: "14.0.0",
+    version: "22.0.0-next.1",
+    type: MatTabContent,
+    isStandalone: true,
+    selector: "[matTabContent]",
+    providers: [{
+      provide: MAT_TAB_CONTENT,
+      useExisting: MatTabContent
+    }],
+    ngImport: i0
+  });
+}
+i0.ɵɵngDeclareClassMetadata({
+  minVersion: "12.0.0",
+  version: "22.0.0-next.1",
+  ngImport: i0,
+  type: MatTabContent,
+  decorators: [{
+    type: Directive,
+    args: [{
+      selector: '[matTabContent]',
+      providers: [{
+        provide: MAT_TAB_CONTENT,
+        useExisting: MatTabContent
+      }]
+    }]
+  }],
+  ctorParameters: () => []
+});
+
+const MAT_TAB_LABEL = new InjectionToken('MatTabLabel');
+const MAT_TAB = new InjectionToken('MAT_TAB');
+class MatTabLabel extends CdkPortal {
+  _closestTab = inject(MAT_TAB, {
+    optional: true
+  });
+  static ɵfac = i0.ɵɵngDeclareFactory({
+    minVersion: "12.0.0",
+    version: "22.0.0-next.1",
+    ngImport: i0,
+    type: MatTabLabel,
+    deps: null,
+    target: i0.ɵɵFactoryTarget.Directive
+  });
+  static ɵdir = i0.ɵɵngDeclareDirective({
+    minVersion: "14.0.0",
+    version: "22.0.0-next.1",
+    type: MatTabLabel,
+    isStandalone: true,
+    selector: "[mat-tab-label], [matTabLabel]",
+    providers: [{
+      provide: MAT_TAB_LABEL,
+      useExisting: MatTabLabel
+    }],
+    usesInheritance: true,
+    ngImport: i0
+  });
+}
+i0.ɵɵngDeclareClassMetadata({
+  minVersion: "12.0.0",
+  version: "22.0.0-next.1",
+  ngImport: i0,
+  type: MatTabLabel,
+  decorators: [{
+    type: Directive,
+    args: [{
+      selector: '[mat-tab-label], [matTabLabel]',
+      providers: [{
+        provide: MAT_TAB_LABEL,
+        useExisting: MatTabLabel
+      }]
+    }]
+  }]
+});
+
+const MAT_TAB_GROUP = new InjectionToken('MAT_TAB_GROUP');
+class MatTab {
+  _viewContainerRef = inject(ViewContainerRef);
+  _closestTabGroup = inject(MAT_TAB_GROUP, {
+    optional: true
+  });
+  disabled = false;
+  get templateLabel() {
+    return this._templateLabel;
+  }
+  set templateLabel(value) {
+    this._setTemplateLabelInput(value);
+  }
+  _templateLabel;
+  _explicitContent = undefined;
+  _implicitContent;
+  textLabel = '';
+  ariaLabel;
+  ariaLabelledby;
+  labelClass;
+  bodyClass;
+  id = null;
+  _contentPortal = null;
+  get content() {
+    return this._contentPortal;
+  }
+  _stateChanges = new Subject();
+  position = null;
+  origin = null;
+  isActive = false;
+  constructor() {
+    inject(_CdkPrivateStyleLoader).load(_StructuralStylesLoader);
+  }
+  ngOnChanges(changes) {
+    if (changes.hasOwnProperty('textLabel') || changes.hasOwnProperty('disabled')) {
+      this._stateChanges.next();
+    }
+  }
+  ngOnDestroy() {
+    this._stateChanges.complete();
+  }
+  ngOnInit() {
+    this._contentPortal = new TemplatePortal(this._explicitContent || this._implicitContent, this._viewContainerRef);
+  }
+  _setTemplateLabelInput(value) {
+    if (value && value._closestTab === this) {
+      this._templateLabel = value;
+    }
+  }
+  static ɵfac = i0.ɵɵngDeclareFactory({
+    minVersion: "12.0.0",
+    version: "22.0.0-next.1",
+    ngImport: i0,
+    type: MatTab,
+    deps: [],
+    target: i0.ɵɵFactoryTarget.Component
+  });
+  static ɵcmp = i0.ɵɵngDeclareComponent({
+    minVersion: "16.1.0",
+    version: "22.0.0-next.1",
+    type: MatTab,
+    isStandalone: true,
+    selector: "mat-tab",
+    inputs: {
+      disabled: ["disabled", "disabled", booleanAttribute],
+      textLabel: ["label", "textLabel"],
+      ariaLabel: ["aria-label", "ariaLabel"],
+      ariaLabelledby: ["aria-labelledby", "ariaLabelledby"],
+      labelClass: "labelClass",
+      bodyClass: "bodyClass",
+      id: "id"
+    },
+    host: {
+      attributes: {
+        "hidden": ""
+      },
+      properties: {
+        "attr.id": "null"
+      }
+    },
+    providers: [{
+      provide: MAT_TAB,
+      useExisting: MatTab
+    }],
+    queries: [{
+      propertyName: "templateLabel",
+      first: true,
+      predicate: MatTabLabel,
+      descendants: true
+    }, {
+      propertyName: "_explicitContent",
+      first: true,
+      predicate: MatTabContent,
+      descendants: true,
+      read: TemplateRef,
+      static: true
+    }],
+    viewQueries: [{
+      propertyName: "_implicitContent",
+      first: true,
+      predicate: TemplateRef,
+      descendants: true,
+      static: true
+    }],
+    exportAs: ["matTab"],
+    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.Eager,
+    encapsulation: i0.ViewEncapsulation.None
+  });
+}
+i0.ɵɵngDeclareClassMetadata({
+  minVersion: "12.0.0",
+  version: "22.0.0-next.1",
+  ngImport: i0,
+  type: MatTab,
+  decorators: [{
+    type: Component,
+    args: [{
+      selector: 'mat-tab',
+      changeDetection: ChangeDetectionStrategy.Default,
+      encapsulation: ViewEncapsulation.None,
+      exportAs: 'matTab',
+      providers: [{
+        provide: MAT_TAB,
+        useExisting: MatTab
+      }],
+      host: {
+        'hidden': '',
+        '[attr.id]': 'null'
+      },
+      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"
+    }]
+  }],
+  ctorParameters: () => [],
+  propDecorators: {
+    disabled: [{
+      type: Input,
+      args: [{
+        transform: booleanAttribute
+      }]
+    }],
+    templateLabel: [{
+      type: ContentChild,
+      args: [MatTabLabel]
+    }],
+    _explicitContent: [{
+      type: ContentChild,
+      args: [MatTabContent, {
+        read: TemplateRef,
+        static: true
+      }]
+    }],
+    _implicitContent: [{
+      type: ViewChild,
+      args: [TemplateRef, {
+        static: true
+      }]
+    }],
+    textLabel: [{
+      type: Input,
+      args: ['label']
+    }],
+    ariaLabel: [{
+      type: Input,
+      args: ['aria-label']
+    }],
+    ariaLabelledby: [{
+      type: Input,
+      args: ['aria-labelledby']
+    }],
+    labelClass: [{
+      type: Input
+    }],
+    bodyClass: [{
+      type: Input
+    }],
+    id: [{
+      type: Input
+    }]
+  }
+});
+
+const ACTIVE_CLASS = 'mdc-tab-indicator--active';
+const NO_TRANSITION_CLASS = 'mdc-tab-indicator--no-transition';
+class MatInkBar {
+  _items;
+  _currentItem;
+  constructor(_items) {
+    this._items = _items;
+  }
+  hide() {
+    this._items.forEach(item => item.deactivateInkBar());
+    this._currentItem = undefined;
+  }
+  alignToElement(element) {
+    const correspondingItem = this._items.find(item => item.elementRef.nativeElement === element);
+    const currentItem = this._currentItem;
+    if (correspondingItem === currentItem) {
+      return;
+    }
+    currentItem?.deactivateInkBar();
+    if (correspondingItem) {
+      const domRect = currentItem?.elementRef.nativeElement.getBoundingClientRect?.();
+      correspondingItem.activateInkBar(domRect);
+      this._currentItem = correspondingItem;
+    }
+  }
+}
+class InkBarItem {
+  _elementRef = inject(ElementRef);
+  _inkBarElement = null;
+  _inkBarContentElement = null;
+  _fitToContent = false;
+  get fitInkBarToContent() {
+    return this._fitToContent;
+  }
+  set fitInkBarToContent(newValue) {
+    if (this._fitToContent !== newValue) {
+      this._fitToContent = newValue;
+      if (this._inkBarElement) {
+        this._appendInkBarElement();
+      }
+    }
+  }
+  activateInkBar(previousIndicatorClientRect) {
+    const element = this._elementRef.nativeElement;
+    if (!previousIndicatorClientRect || !element.getBoundingClientRect || !this._inkBarContentElement) {
+      element.classList.add(ACTIVE_CLASS);
+      return;
+    }
+    const currentClientRect = element.getBoundingClientRect();
+    const widthDelta = previousIndicatorClientRect.width / currentClientRect.width;
+    const xPosition = previousIndicatorClientRect.left - currentClientRect.left;
+    element.classList.add(NO_TRANSITION_CLASS);
+    this._inkBarContentElement.style.setProperty('transform', `translateX(${xPosition}px) scaleX(${widthDelta})`);
+    element.getBoundingClientRect();
+    element.classList.remove(NO_TRANSITION_CLASS);
+    element.classList.add(ACTIVE_CLASS);
+    this._inkBarContentElement.style.setProperty('transform', '');
+  }
+  deactivateInkBar() {
+    this._elementRef.nativeElement.classList.remove(ACTIVE_CLASS);
+  }
+  ngOnInit() {
+    this._createInkBarElement();
+  }
+  ngOnDestroy() {
+    this._inkBarElement?.remove();
+    this._inkBarElement = this._inkBarContentElement = null;
+  }
+  _createInkBarElement() {
+    const documentNode = this._elementRef.nativeElement.ownerDocument || document;
+    const inkBarElement = this._inkBarElement = documentNode.createElement('span');
+    const inkBarContentElement = this._inkBarContentElement = documentNode.createElement('span');
+    inkBarElement.className = 'mdc-tab-indicator';
+    inkBarContentElement.className = 'mdc-tab-indicator__content mdc-tab-indicator__content--underline';
+    inkBarElement.appendChild(this._inkBarContentElement);
+    this._appendInkBarElement();
+  }
+  _appendInkBarElement() {
+    if (!this._inkBarElement && (typeof ngDevMode === 'undefined' || ngDevMode)) {
+      throw Error('Ink bar element has not been created and cannot be appended');
+    }
+    const parentElement = this._fitToContent ? this._elementRef.nativeElement.querySelector('.mdc-tab__content') : this._elementRef.nativeElement;
+    if (!parentElement && (typeof ngDevMode === 'undefined' || ngDevMode)) {
+      throw Error('Missing element to host the ink bar');
+    }
+    parentElement.appendChild(this._inkBarElement);
+  }
+  static ɵfac = i0.ɵɵngDeclareFactory({
+    minVersion: "12.0.0",
+    version: "22.0.0-next.1",
+    ngImport: i0,
+    type: InkBarItem,
+    deps: [],
+    target: i0.ɵɵFactoryTarget.Directive
+  });
+  static ɵdir = i0.ɵɵngDeclareDirective({
+    minVersion: "16.1.0",
+    version: "22.0.0-next.1",
+    type: InkBarItem,
+    isStandalone: true,
+    inputs: {
+      fitInkBarToContent: ["fitInkBarToContent", "fitInkBarToContent", booleanAttribute]
+    },
+    ngImport: i0
+  });
+}
+i0.ɵɵngDeclareClassMetadata({
+  minVersion: "12.0.0",
+  version: "22.0.0-next.1",
+  ngImport: i0,
+  type: InkBarItem,
+  decorators: [{
+    type: Directive
+  }],
+  propDecorators: {
+    fitInkBarToContent: [{
+      type: Input,
+      args: [{
+        transform: booleanAttribute
+      }]
+    }]
+  }
+});
+const _MAT_INK_BAR_POSITIONER = new InjectionToken('MatInkBarPositioner', {
+  providedIn: 'root',
+  factory: () => {
+    const method = element => ({
+      left: element ? (element.offsetLeft || 0) + 'px' : '0',
+      width: element ? (element.offsetWidth || 0) + 'px' : '0'
+    });
+    return method;
+  }
+});
+
+class MatTabLabelWrapper extends InkBarItem {
+  elementRef = inject(ElementRef);
+  disabled = false;
+  focus() {
+    this.elementRef.nativeElement.focus();
+  }
+  getOffsetLeft() {
+    return this.elementRef.nativeElement.offsetLeft;
+  }
+  getOffsetWidth() {
+    return this.elementRef.nativeElement.offsetWidth;
+  }
+  static ɵfac = i0.ɵɵngDeclareFactory({
+    minVersion: "12.0.0",
+    version: "22.0.0-next.1",
+    ngImport: i0,
+    type: MatTabLabelWrapper,
+    deps: null,
+    target: i0.ɵɵFactoryTarget.Directive
+  });
+  static ɵdir = i0.ɵɵngDeclareDirective({
+    minVersion: "16.1.0",
+    version: "22.0.0-next.1",
+    type: MatTabLabelWrapper,
+    isStandalone: true,
+    selector: "[matTabLabelWrapper]",
+    inputs: {
+      disabled: ["disabled", "disabled", booleanAttribute]
+    },
+    host: {
+      properties: {
+        "class.mat-mdc-tab-disabled": "disabled",
+        "attr.aria-disabled": "!!disabled"
+      }
+    },
+    usesInheritance: true,
+    ngImport: i0
+  });
+}
+i0.ɵɵngDeclareClassMetadata({
+  minVersion: "12.0.0",
+  version: "22.0.0-next.1",
+  ngImport: i0,
+  type: MatTabLabelWrapper,
+  decorators: [{
+    type: Directive,
+    args: [{
+      selector: '[matTabLabelWrapper]',
+      host: {
+        '[class.mat-mdc-tab-disabled]': 'disabled',
+        '[attr.aria-disabled]': '!!disabled'
+      }
+    }]
+  }],
+  propDecorators: {
+    disabled: [{
+      type: Input,
+      args: [{
+        transform: booleanAttribute
+      }]
+    }]
+  }
+});
+
+const passiveEventListenerOptions = {
+  passive: true
+};
+const HEADER_SCROLL_DELAY = 650;
+const HEADER_SCROLL_INTERVAL = 100;
+class MatPaginatedTabHeader {
+  _elementRef = inject(ElementRef);
+  _changeDetectorRef = inject(ChangeDetectorRef);
+  _viewportRuler = inject(ViewportRuler);
+  _dir = inject(Directionality, {
+    optional: true
+  });
+  _ngZone = inject(NgZone);
+  _platform = inject(Platform);
+  _sharedResizeObserver = inject(SharedResizeObserver);
+  _injector = inject(Injector);
+  _renderer = inject(Renderer2);
+  _animationsDisabled = _animationsDisabled();
+  _eventCleanups;
+  _scrollDistance = 0;
+  _selectedIndexChanged = false;
+  _destroyed = new Subject();
+  _showPaginationControls = false;
+  _disableScrollAfter = true;
+  _disableScrollBefore = true;
+  _tabLabelCount;
+  _scrollDistanceChanged = false;
+  _keyManager;
+  _currentTextContent;
+  _stopScrolling = new Subject();
+  disablePagination = false;
+  get selectedIndex() {
+    return this._selectedIndex;
+  }
+  set selectedIndex(v) {
+    const value = isNaN(v) ? 0 : v;
+    if (this._selectedIndex != value) {
+      this._selectedIndexChanged = true;
+      this._selectedIndex = value;
+      if (this._keyManager) {
+        this._keyManager.updateActiveItem(value);
+      }
+    }
+  }
+  _selectedIndex = 0;
+  selectFocusedIndex = new EventEmitter();
+  indexFocused = new EventEmitter();
+  constructor() {
+    this._eventCleanups = this._ngZone.runOutsideAngular(() => [this._renderer.listen(this._elementRef.nativeElement, 'mouseleave', () => this._stopInterval())]);
+  }
+  ngAfterViewInit() {
+    this._eventCleanups.push(this._renderer.listen(this._previousPaginator.nativeElement, 'touchstart', () => this._handlePaginatorPress('before'), passiveEventListenerOptions), this._renderer.listen(this._nextPaginator.nativeElement, 'touchstart', () => this._handlePaginatorPress('after'), passiveEventListenerOptions));
+  }
+  ngAfterContentInit() {
+    const dirChange = this._dir ? this._dir.change : of('ltr');
+    const resize = this._sharedResizeObserver.observe(this._elementRef.nativeElement).pipe(debounceTime(32), takeUntil(this._destroyed));
+    const viewportResize = this._viewportRuler.change(150).pipe(takeUntil(this._destroyed));
+    const realign = () => {
+      this.updatePagination();
+      this._alignInkBarToSelectedTab();
+    };
+    this._keyManager = new FocusKeyManager(this._items).withHorizontalOrientation(this._getLayoutDirection()).withHomeAndEnd().withWrap().skipPredicate(() => false);
+    this._keyManager.updateActiveItem(Math.max(this._selectedIndex, 0));
+    afterNextRender(realign, {
+      injector: this._injector
+    });
+    merge(dirChange, viewportResize, resize, this._items.changes, this._itemsResized()).pipe(takeUntil(this._destroyed)).subscribe(() => {
+      this._ngZone.run(() => {
+        Promise.resolve().then(() => {
+          this._scrollDistance = Math.max(0, Math.min(this._getMaxScrollDistance(), this._scrollDistance));
+          realign();
+        });
+      });
+      this._keyManager?.withHorizontalOrientation(this._getLayoutDirection());
+    });
+    this._keyManager.change.subscribe(newFocusIndex => {
+      this.indexFocused.emit(newFocusIndex);
+      this._setTabFocus(newFocusIndex);
+    });
+  }
+  _itemsResized() {
+    if (typeof ResizeObserver !== 'function') {
+      return EMPTY;
+    }
+    return this._items.changes.pipe(startWith(this._items), switchMap(tabItems => new Observable(observer => this._ngZone.runOutsideAngular(() => {
+      const resizeObserver = new ResizeObserver(entries => observer.next(entries));
+      tabItems.forEach(item => resizeObserver.observe(item.elementRef.nativeElement));
+      return () => {
+        resizeObserver.disconnect();
+      };
+    }))), skip(1), filter(entries => entries.some(e => e.contentRect.width > 0 && e.contentRect.height > 0)));
+  }
+  ngAfterContentChecked() {
+    if (this._tabLabelCount != this._items.length) {
+      this.updatePagination();
+      this._tabLabelCount = this._items.length;
+      this._changeDetectorRef.markForCheck();
+    }
+    if (this._selectedIndexChanged) {
+      this._scrollToLabel(this._selectedIndex);
+      this._checkScrollingControls();
+      this._alignInkBarToSelectedTab();
+      this._selectedIndexChanged = false;
+      this._changeDetectorRef.markForCheck();
+    }
+    if (this._scrollDistanceChanged) {
+      this._updateTabScrollPosition();
+      this._scrollDistanceChanged = false;
+      this._changeDetectorRef.markForCheck();
+    }
+  }
+  ngOnDestroy() {
+    this._eventCleanups.forEach(cleanup => cleanup());
+    this._keyManager?.destroy();
+    this._destroyed.next();
+    this._destroyed.complete();
+    this._stopScrolling.complete();
+  }
+  _handleKeydown(event) {
+    if (hasModifierKey(event)) {
+      return;
+    }
+    switch (event.keyCode) {
+      case ENTER:
+      case SPACE:
+        if (this.focusIndex !== this.selectedIndex) {
+          const item = this._items.get(this.focusIndex);
+          if (item && !item.disabled) {
+            this.selectFocusedIndex.emit(this.focusIndex);
+            this._itemSelected(event);
+          }
+        }
+        break;
+      default:
+        this._keyManager?.onKeydown(event);
+    }
+  }
+  _onContentChanges() {
+    const textContent = this._elementRef.nativeElement.textContent;
+    if (textContent !== this._currentTextContent) {
+      this._currentTextContent = textContent || '';
+      this._ngZone.run(() => {
+        this.updatePagination();
+        this._alignInkBarToSelectedTab();
+        this._changeDetectorRef.markForCheck();
+      });
+    }
+  }
+  updatePagination() {
+    this._checkPaginationEnabled();
+    this._checkScrollingControls();
+    this._updateTabScrollPosition();
+  }
+  get focusIndex() {
+    return this._keyManager ? this._keyManager.activeItemIndex : 0;
+  }
+  set focusIndex(value) {
+    if (!this._isValidIndex(value) || this.focusIndex === value || !this._keyManager) {
+      return;
+    }
+    this._keyManager.setActiveItem(value);
+  }
+  _isValidIndex(index) {
+    return this._items ? !!this._items.toArray()[index] : true;
+  }
+  _setTabFocus(tabIndex) {
+    if (this._showPaginationControls) {
+      this._scrollToLabel(tabIndex);
+    }
+    if (this._items && this._items.length) {
+      this._items.toArray()[tabIndex].focus();
+      const containerEl = this._tabListContainer.nativeElement;
+      const dir = this._getLayoutDirection();
+      if (dir == 'ltr') {
+        containerEl.scrollLeft = 0;
+      } else {
+        containerEl.scrollLeft = containerEl.scrollWidth - containerEl.offsetWidth;
+      }
+    }
+  }
+  _getLayoutDirection() {
+    return this._dir && this._dir.value === 'rtl' ? 'rtl' : 'ltr';
+  }
+  _updateTabScrollPosition() {
+    if (this.disablePagination) {
+      return;
+    }
+    const scrollDistance = this.scrollDistance;
+    const translateX = this._getLayoutDirection() === 'ltr' ? -scrollDistance : scrollDistance;
+    this._tabList.nativeElement.style.transform = `translateX(${Math.round(translateX)}px)`;
+    if (this._platform.TRIDENT || this._platform.EDGE) {
+      this._tabListContainer.nativeElement.scrollLeft = 0;
+    }
+  }
+  get scrollDistance() {
+    return this._scrollDistance;
+  }
+  set scrollDistance(value) {
+    this._scrollTo(value);
+  }
+  _scrollHeader(direction) {
+    const viewLength = this._tabListContainer.nativeElement.offsetWidth;
+    const scrollAmount = (direction == 'before' ? -1 : 1) * viewLength / 3;
+    return this._scrollTo(this._scrollDistance + scrollAmount);
+  }
+  _handlePaginatorClick(direction) {
+    this._stopInterval();
+    this._scrollHeader(direction);
+  }
+  _scrollToLabel(labelIndex) {
+    if (this.disablePagination) {
+      return;
+    }
+    const selectedLabel = this._items ? this._items.toArray()[labelIndex] : null;
+    if (!selectedLabel) {
+      return;
+    }
+    const viewLength = this._tabListContainer.nativeElement.offsetWidth;
+    const {
+      offsetLeft,
+      offsetWidth
+    } = selectedLabel.elementRef.nativeElement;
+    let labelBeforePos, labelAfterPos;
+    if (this._getLayoutDirection() == 'ltr') {
+      labelBeforePos = offsetLeft;
+      labelAfterPos = labelBeforePos + offsetWidth;
+    } else {
+      labelAfterPos = this._tabListInner.nativeElement.offsetWidth - offsetLeft;
+      labelBeforePos = labelAfterPos - offsetWidth;
+    }
+    const beforeVisiblePos = this.scrollDistance;
+    const afterVisiblePos = this.scrollDistance + viewLength;
+    if (labelBeforePos < beforeVisiblePos) {
+      this.scrollDistance -= beforeVisiblePos - labelBeforePos;
+    } else if (labelAfterPos > afterVisiblePos) {
+      this.scrollDistance += Math.min(labelAfterPos - afterVisiblePos, labelBeforePos - beforeVisiblePos);
+    }
+  }
+  _checkPaginationEnabled() {
+    if (this.disablePagination) {
+      this._showPaginationControls = false;
+    } else {
+      const scrollWidth = this._tabListInner.nativeElement.scrollWidth;
+      const containerWidth = this._elementRef.nativeElement.offsetWidth;
+      const isEnabled = scrollWidth - containerWidth >= 5;
+      if (!isEnabled) {
+        this.scrollDistance = 0;
+      }
+      if (isEnabled !== this._showPaginationControls) {
+        this._showPaginationControls = isEnabled;
+        this._changeDetectorRef.markForCheck();
+      }
+    }
+  }
+  _checkScrollingControls() {
+    if (this.disablePagination) {
+      this._disableScrollAfter = this._disableScrollBefore = true;
+    } else {
+      this._disableScrollBefore = this.scrollDistance == 0;
+      this._disableScrollAfter = this.scrollDistance == this._getMaxScrollDistance();
+      this._changeDetectorRef.markForCheck();
+    }
+  }
+  _getMaxScrollDistance() {
+    const lengthOfTabList = this._tabListInner.nativeElement.scrollWidth;
+    const viewLength = this._tabListContainer.nativeElement.offsetWidth;
+    return lengthOfTabList - viewLength || 0;
+  }
+  _alignInkBarToSelectedTab() {
+    const selectedItem = this._items && this._items.length ? this._items.toArray()[this.selectedIndex] : null;
+    const selectedLabelWrapper = selectedItem ? selectedItem.elementRef.nativeElement : null;
+    if (selectedLabelWrapper) {
+      this._inkBar.alignToElement(selectedLabelWrapper);
+    } else {
+      this._inkBar.hide();
+    }
+  }
+  _stopInterval() {
+    this._stopScrolling.next();
+  }
+  _handlePaginatorPress(direction, mouseEvent) {
+    if (mouseEvent && mouseEvent.button != null && mouseEvent.button !== 0) {
+      return;
+    }
+    this._stopInterval();
+    timer(HEADER_SCROLL_DELAY, HEADER_SCROLL_INTERVAL).pipe(takeUntil(merge(this._stopScrolling, this._destroyed))).subscribe(() => {
+      const {
+        maxScrollDistance,
+        distance
+      } = this._scrollHeader(direction);
+      if (distance === 0 || distance >= maxScrollDistance) {
+        this._stopInterval();
+      }
+    });
+  }
+  _scrollTo(position) {
+    if (this.disablePagination) {
+      return {
+        maxScrollDistance: 0,
+        distance: 0
+      };
+    }
+    const maxScrollDistance = this._getMaxScrollDistance();
+    this._scrollDistance = Math.max(0, Math.min(maxScrollDistance, position));
+    this._scrollDistanceChanged = true;
+    this._checkScrollingControls();
+    return {
+      maxScrollDistance,
+      distance: this._scrollDistance
+    };
+  }
+  static ɵfac = i0.ɵɵngDeclareFactory({
+    minVersion: "12.0.0",
+    version: "22.0.0-next.1",
+    ngImport: i0,
+    type: MatPaginatedTabHeader,
+    deps: [],
+    target: i0.ɵɵFactoryTarget.Directive
+  });
+  static ɵdir = i0.ɵɵngDeclareDirective({
+    minVersion: "16.1.0",
+    version: "22.0.0-next.1",
+    type: MatPaginatedTabHeader,
+    isStandalone: true,
+    inputs: {
+      disablePagination: ["disablePagination", "disablePagination", booleanAttribute],
+      selectedIndex: ["selectedIndex", "selectedIndex", numberAttribute]
+    },
+    outputs: {
+      selectFocusedIndex: "selectFocusedIndex",
+      indexFocused: "indexFocused"
+    },
+    ngImport: i0
+  });
+}
+i0.ɵɵngDeclareClassMetadata({
+  minVersion: "12.0.0",
+  version: "22.0.0-next.1",
+  ngImport: i0,
+  type: MatPaginatedTabHeader,
+  decorators: [{
+    type: Directive
+  }],
+  ctorParameters: () => [],
+  propDecorators: {
+    disablePagination: [{
+      type: Input,
+      args: [{
+        transform: booleanAttribute
+      }]
+    }],
+    selectedIndex: [{
+      type: Input,
+      args: [{
+        transform: numberAttribute
+      }]
+    }],
+    selectFocusedIndex: [{
+      type: Output
+    }],
+    indexFocused: [{
+      type: Output
+    }]
+  }
+});
+
+class MatTabHeader extends MatPaginatedTabHeader {
+  _items;
+  _tabListContainer;
+  _tabList;
+  _tabListInner;
+  _nextPaginator;
+  _previousPaginator;
+  _inkBar;
+  ariaLabel;
+  ariaLabelledby;
+  disableRipple = false;
+  ngAfterContentInit() {
+    this._inkBar = new MatInkBar(this._items);
+    super.ngAfterContentInit();
+  }
+  _itemSelected(event) {
+    event.preventDefault();
+  }
+  static ɵfac = i0.ɵɵngDeclareFactory({
+    minVersion: "12.0.0",
+    version: "22.0.0-next.1",
+    ngImport: i0,
+    type: MatTabHeader,
+    deps: null,
+    target: i0.ɵɵFactoryTarget.Component
+  });
+  static ɵcmp = i0.ɵɵngDeclareComponent({
+    minVersion: "16.1.0",
+    version: "22.0.0-next.1",
+    type: MatTabHeader,
+    isStandalone: true,
+    selector: "mat-tab-header",
+    inputs: {
+      ariaLabel: ["aria-label", "ariaLabel"],
+      ariaLabelledby: ["aria-labelledby", "ariaLabelledby"],
+      disableRipple: ["disableRipple", "disableRipple", booleanAttribute]
+    },
+    host: {
+      properties: {
+        "class.mat-mdc-tab-header-pagination-controls-enabled": "_showPaginationControls",
+        "class.mat-mdc-tab-header-rtl": "_getLayoutDirection() == 'rtl'"
+      },
+      classAttribute: "mat-mdc-tab-header"
+    },
+    queries: [{
+      propertyName: "_items",
+      predicate: MatTabLabelWrapper
+    }],
+    viewQueries: [{
+      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: "<!--\n Note that this intentionally uses a `div` instead of a `button`, because it's not part of\n the regular tabs flow and is only here to support mouse users. It should also not be focusable.\n-->\n<div class=\"mat-mdc-tab-header-pagination mat-mdc-tab-header-pagination-before\"\n     #previousPaginator\n     mat-ripple\n     [matRippleDisabled]=\"_disableScrollBefore || disableRipple\"\n     [class.mat-mdc-tab-header-pagination-disabled]=\"_disableScrollBefore\"\n     (click)=\"_handlePaginatorClick('before')\"\n     (mousedown)=\"_handlePaginatorPress('before', $event)\"\n     (touchend)=\"_stopInterval()\">\n  <div class=\"mat-mdc-tab-header-pagination-chevron\"></div>\n</div>\n\n<div\n  class=\"mat-mdc-tab-label-container\"\n  #tabListContainer\n  (keydown)=\"_handleKeydown($event)\"\n  [class._mat-animation-noopable]=\"_animationsDisabled\">\n  <div\n    #tabList\n    class=\"mat-mdc-tab-list\"\n    role=\"tablist\"\n    [attr.aria-label]=\"ariaLabel || null\"\n    [attr.aria-labelledby]=\"ariaLabelledby || null\"\n    (cdkObserveContent)=\"_onContentChanges()\">\n    <div class=\"mat-mdc-tab-labels\" #tabListInner>\n      <ng-content></ng-content>\n    </div>\n  </div>\n</div>\n\n<div class=\"mat-mdc-tab-header-pagination mat-mdc-tab-header-pagination-after\"\n     #nextPaginator\n     mat-ripple\n     [matRippleDisabled]=\"_disableScrollAfter || disableRipple\"\n     [class.mat-mdc-tab-header-pagination-disabled]=\"_disableScrollAfter\"\n     (mousedown)=\"_handlePaginatorPress('after', $event)\"\n     (click)=\"_handlePaginatorClick('after')\"\n     (touchend)=\"_stopInterval()\">\n  <div class=\"mat-mdc-tab-header-pagination-chevron\"></div>\n</div>\n",
+    styles: [".mat-mdc-tab-header{display:flex;overflow:hidden;position:relative;flex-shrink:0}.mdc-tab-indicator .mdc-tab-indicator__content{transition-duration:var(--mat-tab-animation-duration, 250ms)}.mat-mdc-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;outline:0}.mat-mdc-tab-header-pagination::-moz-focus-inner{border:0}.mat-mdc-tab-header-pagination .mat-ripple-element{opacity:.12;background-color:var(--mat-tab-inactive-ripple-color, var(--mat-sys-on-surface))}.mat-mdc-tab-header-pagination-controls-enabled .mat-mdc-tab-header-pagination{display:flex}.mat-mdc-tab-header-pagination-before,.mat-mdc-tab-header-rtl .mat-mdc-tab-header-pagination-after{padding-left:4px}.mat-mdc-tab-header-pagination-before .mat-mdc-tab-header-pagination-chevron,.mat-mdc-tab-header-rtl .mat-mdc-tab-header-pagination-after .mat-mdc-tab-header-pagination-chevron{transform:rotate(-135deg)}.mat-mdc-tab-header-rtl .mat-mdc-tab-header-pagination-before,.mat-mdc-tab-header-pagination-after{padding-right:4px}.mat-mdc-tab-header-rtl .mat-mdc-tab-header-pagination-before .mat-mdc-tab-header-pagination-chevron,.mat-mdc-tab-header-pagination-after .mat-mdc-tab-header-pagination-chevron{transform:rotate(45deg)}.mat-mdc-tab-header-pagination-chevron{border-style:solid;border-width:2px 2px 0 0;height:8px;width:8px;border-color:var(--mat-tab-pagination-icon-color, var(--mat-sys-on-surface))}.mat-mdc-tab-header-pagination-disabled{box-shadow:none;cursor:default;pointer-events:none}.mat-mdc-tab-header-pagination-disabled .mat-mdc-tab-header-pagination-chevron{opacity:.4}.mat-mdc-tab-list{flex-grow:1;position:relative;transition:transform 500ms cubic-bezier(0.35, 0, 0.25, 1)}._mat-animation-noopable .mat-mdc-tab-list{transition:none}.mat-mdc-tab-label-container{display:flex;flex-grow:1;overflow:hidden;z-index:1;border-bottom-style:solid;border-bottom-width:var(--mat-tab-divider-height, 1px);border-bottom-color:var(--mat-tab-divider-color, var(--mat-sys-surface-variant))}.mat-mdc-tab-group-inverted-header .mat-mdc-tab-label-container{border-bottom:none;border-top-style:solid;border-top-width:var(--mat-tab-divider-height, 1px);border-top-color:var(--mat-tab-divider-color, var(--mat-sys-surface-variant))}.mat-mdc-tab-labels{display:flex;flex:1 0 auto}[mat-align-tabs=center]>.mat-mdc-tab-header .mat-mdc-tab-labels{justify-content:center}[mat-align-tabs=end]>.mat-mdc-tab-header .mat-mdc-tab-labels{justify-content:flex-end}.cdk-drop-list .mat-mdc-tab-labels,.mat-mdc-tab-labels.cdk-drop-list{min-height:var(--mat-tab-container-height, 48px)}.mat-mdc-tab::before{margin:5px}@media(forced-colors: active){.mat-mdc-tab[aria-disabled=true]{color:GrayText}}\n"],
+    dependencies: [{
+      kind: "directive",
+      type: MatRipple,
+      selector: "[mat-ripple], [matRipple]",
+      inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"],
+      exportAs: ["matRipple"]
+    }, {
+      kind: "directive",
+      type: CdkObserveContent,
+      selector: "[cdkObserveContent]",
+      inputs: ["cdkObserveContentDisabled", "debounce"],
+      outputs: ["cdkObserveContent"],
+      exportAs: ["cdkObserveContent"]
+    }],
+    changeDetection: i0.ChangeDetectionStrategy.Eager,
+    encapsulation: i0.ViewEncapsulation.None
+  });
+}
+i0.ɵɵngDeclareClassMetadata({
+  minVersion: "12.0.0",
+  version: "22.0.0-next.1",
+  ngImport: i0,
+  type: MatTabHeader,
+  decorators: [{
+    type: Component,
+    args: [{
+      selector: 'mat-tab-header',
+      encapsulation: ViewEncapsulation.None,
+      changeDetection: ChangeDetectionStrategy.Default,
+      host: {
+        'class': 'mat-mdc-tab-header',
+        '[class.mat-mdc-tab-header-pagination-controls-enabled]': '_showPaginationControls',
+        '[class.mat-mdc-tab-header-rtl]': "_getLayoutDirection() == 'rtl'"
+      },
+      imports: [MatRipple, CdkObserveContent],
+      template: "<!--\n Note that this intentionally uses a `div` instead of a `button`, because it's not part of\n the regular tabs flow and is only here to support mouse users. It should also not be focusable.\n-->\n<div class=\"mat-mdc-tab-header-pagination mat-mdc-tab-header-pagination-before\"\n     #previousPaginator\n     mat-ripple\n     [matRippleDisabled]=\"_disableScrollBefore || disableRipple\"\n     [class.mat-mdc-tab-header-pagination-disabled]=\"_disableScrollBefore\"\n     (click)=\"_handlePaginatorClick('before')\"\n     (mousedown)=\"_handlePaginatorPress('before', $event)\"\n     (touchend)=\"_stopInterval()\">\n  <div class=\"mat-mdc-tab-header-pagination-chevron\"></div>\n</div>\n\n<div\n  class=\"mat-mdc-tab-label-container\"\n  #tabListContainer\n  (keydown)=\"_handleKeydown($event)\"\n  [class._mat-animation-noopable]=\"_animationsDisabled\">\n  <div\n    #tabList\n    class=\"mat-mdc-tab-list\"\n    role=\"tablist\"\n    [attr.aria-label]=\"ariaLabel || null\"\n    [attr.aria-labelledby]=\"ariaLabelledby || null\"\n    (cdkObserveContent)=\"_onContentChanges()\">\n    <div class=\"mat-mdc-tab-labels\" #tabListInner>\n      <ng-content></ng-content>\n    </div>\n  </div>\n</div>\n\n<div class=\"mat-mdc-tab-header-pagination mat-mdc-tab-header-pagination-after\"\n     #nextPaginator\n     mat-ripple\n     [matRippleDisabled]=\"_disableScrollAfter || disableRipple\"\n     [class.mat-mdc-tab-header-pagination-disabled]=\"_disableScrollAfter\"\n     (mousedown)=\"_handlePaginatorPress('after', $event)\"\n     (click)=\"_handlePaginatorClick('after')\"\n     (touchend)=\"_stopInterval()\">\n  <div class=\"mat-mdc-tab-header-pagination-chevron\"></div>\n</div>\n",
+      styles: [".mat-mdc-tab-header{display:flex;overflow:hidden;position:relative;flex-shrink:0}.mdc-tab-indicator .mdc-tab-indicator__content{transition-duration:var(--mat-tab-animation-duration, 250ms)}.mat-mdc-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;outline:0}.mat-mdc-tab-header-pagination::-moz-focus-inner{border:0}.mat-mdc-tab-header-pagination .mat-ripple-element{opacity:.12;background-color:var(--mat-tab-inactive-ripple-color, var(--mat-sys-on-surface))}.mat-mdc-tab-header-pagination-controls-enabled .mat-mdc-tab-header-pagination{display:flex}.mat-mdc-tab-header-pagination-before,.mat-mdc-tab-header-rtl .mat-mdc-tab-header-pagination-after{padding-left:4px}.mat-mdc-tab-header-pagination-before .mat-mdc-tab-header-pagination-chevron,.mat-mdc-tab-header-rtl .mat-mdc-tab-header-pagination-after .mat-mdc-tab-header-pagination-chevron{transform:rotate(-135deg)}.mat-mdc-tab-header-rtl .mat-mdc-tab-header-pagination-before,.mat-mdc-tab-header-pagination-after{padding-right:4px}.mat-mdc-tab-header-rtl .mat-mdc-tab-header-pagination-before .mat-mdc-tab-header-pagination-chevron,.mat-mdc-tab-header-pagination-after .mat-mdc-tab-header-pagination-chevron{transform:rotate(45deg)}.mat-mdc-tab-header-pagination-chevron{border-style:solid;border-width:2px 2px 0 0;height:8px;width:8px;border-color:var(--mat-tab-pagination-icon-color, var(--mat-sys-on-surface))}.mat-mdc-tab-header-pagination-disabled{box-shadow:none;cursor:default;pointer-events:none}.mat-mdc-tab-header-pagination-disabled .mat-mdc-tab-header-pagination-chevron{opacity:.4}.mat-mdc-tab-list{flex-grow:1;position:relative;transition:transform 500ms cubic-bezier(0.35, 0, 0.25, 1)}._mat-animation-noopable .mat-mdc-tab-list{transition:none}.mat-mdc-tab-label-container{display:flex;flex-grow:1;overflow:hidden;z-index:1;border-bottom-style:solid;border-bottom-width:var(--mat-tab-divider-height, 1px);border-bottom-color:var(--mat-tab-divider-color, var(--mat-sys-surface-variant))}.mat-mdc-tab-group-inverted-header .mat-mdc-tab-label-container{border-bottom:none;border-top-style:solid;border-top-width:var(--mat-tab-divider-height, 1px);border-top-color:var(--mat-tab-divider-color, var(--mat-sys-surface-variant))}.mat-mdc-tab-labels{display:flex;flex:1 0 auto}[mat-align-tabs=center]>.mat-mdc-tab-header .mat-mdc-tab-labels{justify-content:center}[mat-align-tabs=end]>.mat-mdc-tab-header .mat-mdc-tab-labels{justify-content:flex-end}.cdk-drop-list .mat-mdc-tab-labels,.mat-mdc-tab-labels.cdk-drop-list{min-height:var(--mat-tab-container-height, 48px)}.mat-mdc-tab::before{margin:5px}@media(forced-colors: active){.mat-mdc-tab[aria-disabled=true]{color:GrayText}}\n"]
+    }]
+  }],
+  propDecorators: {
+    _items: [{
+      type: ContentChildren,
+      args: [MatTabLabelWrapper, {
+        descendants: false
+      }]
+    }],
+    _tabListContainer: [{
+      type: ViewChild,
+      args: ['tabListContainer', {
+        static: true
+      }]
+    }],
+    _tabList: [{
+      type: ViewChild,
+      args: ['tabList', {
+        static: true
+      }]
+    }],
+    _tabListInner: [{
+      type: ViewChild,
+      args: ['tabListInner', {
+        static: true
+      }]
+    }],
+    _nextPaginator: [{
+      type: ViewChild,
+      args: ['nextPaginator']
+    }],
+    _previousPaginator: [{
+      type: ViewChild,
+      args: ['previousPaginator']
+    }],
+    ariaLabel: [{
+      type: Input,
+      args: ['aria-label']
+    }],
+    ariaLabelledby: [{
+      type: Input,
+      args: ['aria-labelledby']
+    }],
+    disableRipple: [{
+      type: Input,
+      args: [{
+        transform: booleanAttribute
+      }]
+    }]
+  }
+});
+
+const MAT_TABS_CONFIG = new InjectionToken('MAT_TABS_CONFIG');
+
+class MatTabBodyPortal extends CdkPortalOutlet {
+  _host = inject(MatTabBody);
+  _ngZone = inject(NgZone);
+  _centeringSub = Subscription.EMPTY;
+  _leavingSub = Subscription.EMPTY;
+  constructor() {
+    super();
+  }
+  ngOnInit() {
+    super.ngOnInit();
+    this._centeringSub = this._host._beforeCentering.pipe(startWith(this._host._isCenterPosition())).subscribe(isCentering => {
+      if (this._host._content && isCentering && !this.hasAttached()) {
+        this._ngZone.run(() => {
+          Promise.resolve().then();
+          this.attach(this._host._content);
+        });
+      }
+    });
+    this._leavingSub = this._host._afterLeavingCenter.subscribe(() => {
+      if (!this._host.preserveContent) {
+        this._ngZone.run(() => this.detach());
+      }
+    });
+  }
+  ngOnDestroy() {
+    super.ngOnDestroy();
+    this._centeringSub.unsubscribe();
+    this._leavingSub.unsubscribe();
+  }
+  static ɵfac = i0.ɵɵngDeclareFactory({
+    minVersion: "12.0.0",
+    version: "22.0.0-next.1",
+    ngImport: i0,
+    type: MatTabBodyPortal,
+    deps: [],
+    target: i0.ɵɵFactoryTarget.Directive
+  });
+  static ɵdir = i0.ɵɵngDeclareDirective({
+    minVersion: "14.0.0",
+    version: "22.0.0-next.1",
+    type: MatTabBodyPortal,
+    isStandalone: true,
+    selector: "[matTabBodyHost]",
+    usesInheritance: true,
+    ngImport: i0
+  });
+}
+i0.ɵɵngDeclareClassMetadata({
+  minVersion: "12.0.0",
+  version: "22.0.0-next.1",
+  ngImport: i0,
+  type: MatTabBodyPortal,
+  decorators: [{
+    type: Directive,
+    args: [{
+      selector: '[matTabBodyHost]'
+    }]
+  }],
+  ctorParameters: () => []
+});
+class MatTabBody {
+  _elementRef = inject(ElementRef);
+  _dir = inject(Directionality, {
+    optional: true
+  });
+  _ngZone = inject(NgZone);
+  _injector = inject(Injector);
+  _renderer = inject(Renderer2);
+  _diAnimationsDisabled = _animationsDisabled();
+  _eventCleanups;
+  _initialized = false;
+  _fallbackTimer;
+  _positionIndex;
+  _dirChangeSubscription = Subscription.EMPTY;
+  _position;
+  _previousPosition;
+  _onCentering = new EventEmitter();
+  _beforeCentering = new EventEmitter();
+  _afterLeavingCenter = new EventEmitter();
+  _onCentered = new EventEmitter(true);
+  _portalHost;
+  _contentElement;
+  _content;
+  animationDuration = '500ms';
+  preserveContent = false;
+  set position(position) {
+    this._positionIndex = position;
+    this._computePositionAnimationState();
+  }
+  constructor() {
+    if (this._dir) {
+      const changeDetectorRef = inject(ChangeDetectorRef);
+      this._dirChangeSubscription = this._dir.change.subscribe(dir => {
+        this._computePositionAnimationState(dir);
+        changeDetectorRef.markForCheck();
+      });
+    }
+  }
+  ngOnInit() {
+    this._bindTransitionEvents();
+    if (this._position === 'center') {
+      this._setActiveClass(true);
+      afterNextRender(() => this._onCentering.emit(this._elementRef.nativeElement.clientHeight), {
+        injector: this._injector
+      });
+    }
+    this._initialized = true;
+  }
+  ngOnDestroy() {
+    clearTimeout(this._fallbackTimer);
+    this._eventCleanups?.forEach(cleanup => cleanup());
+    this._dirChangeSubscription.unsubscribe();
+  }
+  _bindTransitionEvents() {
+    this._ngZone.runOutsideAngular(() => {
+      const element = this._elementRef.nativeElement;
+      const transitionDone = event => {
+        if (event.target === this._contentElement?.nativeElement) {
+          this._elementRef.nativeElement.classList.remove('mat-tab-body-animating');
+          if (event.type === 'transitionend') {
+            this._transitionDone();
+          }
+        }
+      };
+      this._eventCleanups = [this._renderer.listen(element, 'transitionstart', event => {
+        if (event.target === this._contentElement?.nativeElement) {
+          this._elementRef.nativeElement.classList.add('mat-tab-body-animating');
+          this._transitionStarted();
+        }
+      }), this._renderer.listen(element, 'transitionend', transitionDone), this._renderer.listen(element, 'transitioncancel', transitionDone)];
+    });
+  }
+  _transitionStarted() {
+    clearTimeout(this._fallbackTimer);
+    const isCentering = this._position === 'center';
+    this._beforeCentering.emit(isCentering);
+    if (isCentering) {
+      this._onCentering.emit(this._elementRef.nativeElement.clientHeight);
+    }
+  }
+  _transitionDone() {
+    if (this._position === 'center') {
+      this._onCentered.emit();
+    } else if (this._previousPosition === 'center') {
+      this._afterLeavingCenter.emit();
+    }
+  }
+  _setActiveClass(isActive) {
+    this._elementRef.nativeElement.classList.toggle('mat-mdc-tab-body-active', isActive);
+  }
+  _getLayoutDirection() {
+    return this._dir && this._dir.value === 'rtl' ? 'rtl' : 'ltr';
+  }
+  _isCenterPosition() {
+    return this._positionIndex === 0;
+  }
+  _computePositionAnimationState(dir = this._getLayoutDirection()) {
+    this._previousPosition = this._position;
+    if (this._positionIndex < 0) {
+      this._position = dir == 'ltr' ? 'left' : 'right';
+    } else if (this._positionIndex > 0) {
+      this._position = dir == 'ltr' ? 'right' : 'left';
+    } else {
+      this._position = 'center';
+    }
+    if (this._animationsDisabled()) {
+      this._simulateTransitionEvents();
+    } else if (this._initialized && (this._position === 'center' || this._previousPosition === 'center')) {
+      clearTimeout(this._fallbackTimer);
+      this._fallbackTimer = this._ngZone.runOutsideAngular(() => setTimeout(() => this._simulateTransitionEvents(), 100));
+    }
+  }
+  _simulateTransitionEvents() {
+    this._transitionStarted();
+    afterNextRender(() => this._transitionDone(), {
+      injector: this._injector
+    });
+  }
+  _animationsDisabled() {
+    return this._diAnimationsDisabled || this.animationDuration === '0ms' || this.animationDuration === '0s';
+  }
+  static ɵfac = i0.ɵɵngDeclareFactory({
+    minVersion: "12.0.0",
+    version: "22.0.0-next.1",
+    ngImport: i0,
+    type: MatTabBody,
+    deps: [],
+    target: i0.ɵɵFactoryTarget.Component
+  });
+  static ɵcmp = i0.ɵɵngDeclareComponent({
+    minVersion: "14.0.0",
+    version: "22.0.0-next.1",
+    type: MatTabBody,
+    isStandalone: true,
+    selector: "mat-tab-body",
+    inputs: {
+      _content: ["content", "_content"],
+      animationDuration: "animationDuration",
+      preserveContent: "preserveContent",
+      position: "position"
+    },
+    outputs: {
+      _onCentering: "_onCentering",
+      _beforeCentering: "_beforeCentering",
+      _onCentered: "_onCentered"
+    },
+    host: {
+      properties: {
+        "attr.inert": "_position === \"center\" ? null : \"\""
+      },
+      classAttribute: "mat-mdc-tab-body"
+    },
+    viewQueries: [{
+      propertyName: "_portalHost",
+      first: true,
+      predicate: MatTabBodyPortal,
+      descendants: true
+    }, {
+      propertyName: "_contentElement",
+      first: true,
+      predicate: ["content"],
+      descendants: true
+    }],
+    ngImport: i0,
+    template: "<div\n   class=\"mat-mdc-tab-body-content\"\n   #content\n   cdkScrollable\n   [class.mat-tab-body-content-left]=\"_position === 'left'\"\n   [class.mat-tab-body-content-right]=\"_position === 'right'\"\n   [class.mat-tab-body-content-can-animate]=\"_position === 'center' || _previousPosition === 'center'\">\n  <ng-template matTabBodyHost></ng-template>\n</div>\n",
+    styles: [".mat-mdc-tab-body{top:0;left:0;right:0;bottom:0;position:absolute;display:block;overflow:hidden;outline:0;flex-basis:100%}.mat-mdc-tab-body.mat-mdc-tab-body-active{position:relative;overflow-x:hidden;overflow-y:auto;z-index:1;flex-grow:1}.mat-mdc-tab-group.mat-mdc-tab-group-dynamic-height .mat-mdc-tab-body.mat-mdc-tab-body-active{overflow-y:hidden}.mat-mdc-tab-body-content{height:100%;overflow:auto;transform:none;visibility:hidden}.mat-tab-body-animating>.mat-mdc-tab-body-content,.mat-mdc-tab-body-active>.mat-mdc-tab-body-content{visibility:visible}.mat-tab-body-animating>.mat-mdc-tab-body-content{min-height:1px}.mat-mdc-tab-group-dynamic-height .mat-mdc-tab-body-content{overflow:hidden}.mat-tab-body-content-can-animate{transition:transform var(--mat-tab-animation-duration) 1ms cubic-bezier(0.35, 0, 0.25, 1)}.mat-mdc-tab-body-wrapper._mat-animation-noopable .mat-tab-body-content-can-animate{transition:none}.mat-tab-body-content-left{transform:translate3d(-100%, 0, 0)}.mat-tab-body-content-right{transform:translate3d(100%, 0, 0)}\n"],
+    dependencies: [{
+      kind: "directive",
+      type: MatTabBodyPortal,
+      selector: "[matTabBodyHost]"
+    }, {
+      kind: "directive",
+      type: CdkScrollable,
+      selector: "[cdk-scrollable], [cdkScrollable]"
+    }],
+    changeDetection: i0.ChangeDetectionStrategy.Eager,
+    encapsulation: i0.ViewEncapsulation.None
+  });
+}
+i0.ɵɵngDeclareClassMetadata({
+  minVersion: "12.0.0",
+  version: "22.0.0-next.1",
+  ngImport: i0,
+  type: MatTabBody,
+  decorators: [{
+    type: Component,
+    args: [{
+      selector: 'mat-tab-body',
+      encapsulation: ViewEncapsulation.None,
+      changeDetection: ChangeDetectionStrategy.Default,
+      host: {
+        'class': 'mat-mdc-tab-body',
+        '[attr.inert]': '_position === "center" ? null : ""'
+      },
+      imports: [MatTabBodyPortal, CdkScrollable],
+      template: "<div\n   class=\"mat-mdc-tab-body-content\"\n   #content\n   cdkScrollable\n   [class.mat-tab-body-content-left]=\"_position === 'left'\"\n   [class.mat-tab-body-content-right]=\"_position === 'right'\"\n   [class.mat-tab-body-content-can-animate]=\"_position === 'center' || _previousPosition === 'center'\">\n  <ng-template matTabBodyHost></ng-template>\n</div>\n",
+      styles: [".mat-mdc-tab-body{top:0;left:0;right:0;bottom:0;position:absolute;display:block;overflow:hidden;outline:0;flex-basis:100%}.mat-mdc-tab-body.mat-mdc-tab-body-active{position:relative;overflow-x:hidden;overflow-y:auto;z-index:1;flex-grow:1}.mat-mdc-tab-group.mat-mdc-tab-group-dynamic-height .mat-mdc-tab-body.mat-mdc-tab-body-active{overflow-y:hidden}.mat-mdc-tab-body-content{height:100%;overflow:auto;transform:none;visibility:hidden}.mat-tab-body-animating>.mat-mdc-tab-body-content,.mat-mdc-tab-body-active>.mat-mdc-tab-body-content{visibility:visible}.mat-tab-body-animating>.mat-mdc-tab-body-content{min-height:1px}.mat-mdc-tab-group-dynamic-height .mat-mdc-tab-body-content{overflow:hidden}.mat-tab-body-content-can-animate{transition:transform var(--mat-tab-animation-duration) 1ms cubic-bezier(0.35, 0, 0.25, 1)}.mat-mdc-tab-body-wrapper._mat-animation-noopable .mat-tab-body-content-can-animate{transition:none}.mat-tab-body-content-left{transform:translate3d(-100%, 0, 0)}.mat-tab-body-content-right{transform:translate3d(100%, 0, 0)}\n"]
+    }]
+  }],
+  ctorParameters: () => [],
+  propDecorators: {
+    _onCentering: [{
+      type: Output
+    }],
+    _beforeCentering: [{
+      type: Output
+    }],
+    _onCentered: [{
+      type: Output
+    }],
+    _portalHost: [{
+      type: ViewChild,
+      args: [MatTabBodyPortal]
+    }],
+    _contentElement: [{
+      type: ViewChild,
+      args: ['content']
+    }],
+    _content: [{
+      type: Input,
+      args: ['content']
+    }],
+    animationDuration: [{
+      type: Input
+    }],
+    preserveContent: [{
+      type: Input
+    }],
+    position: [{
+      type: Input
+    }]
+  }
+});
+
+class MatTabGroup {
+  _elementRef = inject(ElementRef);
+  _changeDetectorRef = inject(ChangeDetectorRef);
+  _ngZone = inject(NgZone);
+  _tabsSubscription = Subscription.EMPTY;
+  _tabLabelSubscription = Subscription.EMPTY;
+  _tabBodySubscription = Subscription.EMPTY;
+  _diAnimationsDisabled = _animationsDisabled();
+  _allTabs;
+  _tabBodies;
+  _tabBodyWrapper;
+  _tabHeader;
+  _tabs = new QueryList();
+  _indexToSelect = 0;
+  _lastFocusedTabIndex = null;
+  _tabBodyWrapperHeight = 0;
+  color;
+  get fitInkBarToContent() {
+    return this._fitInkBarToContent;
+  }
+  set fitInkBarToContent(value) {
+    this._fitInkBarToContent = value;
+    this._changeDetectorRef.markForCheck();
+  }
+  _fitInkBarToContent = false;
+  stretchTabs = true;
+  alignTabs = null;
+  dynamicHeight = false;
+  get selectedIndex() {
+    return this._selectedIndex;
+  }
+  set selectedIndex(value) {
+    this._indexToSelect = isNaN(value) ? null : value;
+  }
+  _selectedIndex = null;
+  headerPosition = 'above';
+  get animationDuration() {
+    return this._animationDuration;
+  }
+  set animationDuration(value) {
+    const stringValue = value + '';
+    this._animationDuration = /^\d+$/.test(stringValue) ? value + 'ms' : stringValue;
+  }
+  _animationDuration;
+  get contentTabIndex() {
+    return this._contentTabIndex;
+  }
+  set contentTabIndex(value) {
+    this._contentTabIndex = isNaN(value) ? null : value;
+  }
+  _contentTabIndex = null;
+  disablePagination = false;
+  disableRipple = false;
+  preserveContent = false;
+  get backgroundColor() {
+    return this._backgroundColor;
+  }
+  set backgroundColor(value) {
+    const classList = this._elementRef.nativeElement.classList;
+    classList.remove('mat-tabs-with-background', `mat-background-${this.backgroundColor}`);
+    if (value) {
+      classList.add('mat-tabs-with-background', `mat-background-${value}`);
+    }
+    this._backgroundColor = value;
+  }
+  _backgroundColor;
+  ariaLabel;
+  ariaLabelledby;
+  selectedIndexChange = new EventEmitter();
+  focusChange = new EventEmitter();
+  animationDone = new EventEmitter();
+  selectedTabChange = new EventEmitter(true);
+  _groupId;
+  _isServer = !inject(Platform).isBrowser;
+  constructor() {
+    const defaultConfig = inject(MAT_TABS_CONFIG, {
+      optional: true
+    });
+    this._groupId = inject(_IdGenerator).getId('mat-tab-group-');
+    this.animationDuration = defaultConfig && defaultConfig.animationDuration ? defaultConfig.animationDuration : '500ms';
+    this.disablePagination = defaultConfig && defaultConfig.disablePagination != null ? defaultConfig.disablePagination : false;
+    this.dynamicHeight = defaultConfig && defaultConfig.dynamicHeight != null ? defaultConfig.dynamicHeight : false;
+    if (defaultConfig?.contentTabIndex != null) {
+      this.contentTabIndex = defaultConfig.contentTabIndex;
+    }
+    this.preserveContent = !!defaultConfig?.preserveContent;
+    this.fitInkBarToContent = defaultConfig && defaultConfig.fitInkBarToContent != null ? defaultConfig.fitInkBarToContent : false;
+    this.stretchTabs = defaultConfig && defaultConfig.stretchTabs != null ? defaultConfig.stretchTabs : true;
+    this.alignTabs = defaultConfig && defaultConfig.alignTabs != null ? defaultConfig.alignTabs : null;
+  }
+  ngAfterContentChecked() {
+    const indexToSelect = this._indexToSelect = this._clampTabIndex(this._indexToSelect);
+    if (this._selectedIndex != indexToSelect) {
+      const isFirstRun = this._selectedIndex == null;
+      if (!isFirstRun) {
+        this.selectedTabChange.emit(this._createChangeEvent(indexToSelect));
+        const wrapper = this._tabBodyWrapper.nativeElement;
+        wrapper.style.minHeight = wrapper.clientHeight + 'px';
+      }
+      Promise.resolve().then(() => {
+        this._tabs.forEach((tab, index) => tab.isActive = index === indexToSelect);
+        if (!isFirstRun) {
+          this.selectedIndexChange.emit(indexToSelect);
+          this._tabBodyWrapper.nativeElement.style.minHeight = '';
+        }
+      });
+    }
+    this._tabs.forEach((tab, index) => {
+      tab.position = index - indexToSelect;
+      if (this._selectedIndex != null && tab.position == 0 && !tab.origin) {
+        tab.origin = indexToSelect - this._selectedIndex;
+      }
+    });
+    if (this._selectedIndex !== indexToSelect) {
+      this._selectedIndex = indexToSelect;
+      this._lastFocusedTabIndex = null;
+      this._changeDetectorRef.markForCheck();
+    }
+  }
+  ngAfterContentInit() {
+    this._subscribeToAllTabChanges();
+    this._subscribeToTabLabels();
+    this._tabsSubscription = this._tabs.changes.subscribe(() => {
+      const indexToSelect = this._clampTabIndex(this._indexToSelect);
+      if (indexToSelect === this._selectedIndex) {
+        const tabs = this._tabs.toArray();
+        let selectedTab;
+        for (let i = 0; i < tabs.length; i++) {
+          if (tabs[i].isActive) {
+            this._indexToSelect = this._selectedIndex = i;
+            this._lastFocusedTabIndex = null;
+            selectedTab = tabs[i];
+            break;
+          }
+        }
+        if (!selectedTab && tabs[indexToSelect]) {
+          Promise.resolve().then(() => {
+            tabs[indexToSelect].isActive = true;
+            this.selectedTabChange.emit(this._createChangeEvent(indexToSelect));
+          });
+        }
+      }
+      this._changeDetectorRef.markForCheck();
+    });
+  }
+  ngAfterViewInit() {
+    this._tabBodySubscription = this._tabBodies.changes.subscribe(() => this._bodyCentered(true));
+  }
+  _subscribeToAllTabChanges() {
+    this._allTabs.changes.pipe(startWith(this._allTabs)).subscribe(tabs => {
+      this._tabs.reset(tabs.filter(tab => {
+        return tab._closestTabGroup === this || !tab._closestTabGroup;
+      }));
+      this._tabs.notifyOnChanges();
+    });
+  }
+  ngOnDestroy() {
+    this._tabs.destroy();
+    this._tabsSubscription.unsubscribe();
+    this._tabLabelSubscription.unsubscribe();
+    this._tabBodySubscription.unsubscribe();
+  }
+  realignInkBar() {
+    if (this._tabHeader) {
+      this._tabHeader._alignInkBarToSelectedTab();
+    }
+  }
+  updatePagination() {
+    if (this._tabHeader) {
+      this._tabHeader.updatePagination();
+    }
+  }
+  focusTab(index) {
+    const header = this._tabHeader;
+    if (header) {
+      header.focusIndex = index;
+    }
+  }
+  _focusChanged(index) {
+    this._lastFocusedTabIndex = index;
+    this.focusChange.emit(this._createChangeEvent(index));
+  }
+  _createChangeEvent(index) {
+    const event = new MatTabChangeEvent();
+    event.index = index;
+    if (this._tabs && this._tabs.length) {
+      event.tab = this._tabs.toArray()[index];
+    }
+    return event;
+  }
+  _subscribeToTabLabels() {
+    if (this._tabLabelSubscription) {
+      this._tabLabelSubscription.unsubscribe();
+    }
+    this._tabLabelSubscription = merge(...this._tabs.map(tab => tab._stateChanges)).subscribe(() => this._changeDetectorRef.markForCheck());
+  }
+  _clampTabIndex(index) {
+    return Math.min(this._tabs.length - 1, Math.max(index || 0, 0));
+  }
+  _getTabLabelId(tab, index) {
+    return tab.id || `${this._groupId}-label-${index}`;
+  }
+  _getTabContentId(index) {
+    return `${this._groupId}-content-${index}`;
+  }
+  _setTabBodyWrapperHeight(tabHeight) {
+    if (!this.dynamicHeight || !this._tabBodyWrapperHeight) {
+      this._tabBodyWrapperHeight = tabHeight;
+      return;
+    }
+    const wrapper = this._tabBodyWrapper.nativeElement;
+    wrapper.style.height = this._tabBodyWrapperHeight + 'px';
+    if (this._tabBodyWrapper.nativeElement.offsetHeight) {
+      wrapper.style.height = tabHeight + 'px';
+    }
+  }
+  _removeTabBodyWrapperHeight() {
+    const wrapper = this._tabBodyWrapper.nativeElement;
+    this._tabBodyWrapperHeight = wrapper.clientHeight;
+    wrapper.style.height = '';
+    this._ngZone.run(() => this.animationDone.emit());
+  }
+  _handleClick(tab, tabHeader, index) {
+    tabHeader.focusIndex = index;
+    if (!tab.disabled) {
+      this.selectedIndex = index;
+    }
+  }
+  _getTabIndex(index) {
+    const targetIndex = this._lastFocusedTabIndex ?? this.selectedIndex;
+    return index === targetIndex ? 0 : -1;
+  }
+  _tabFocusChanged(focusOrigin, index) {
+    if (focusOrigin && focusOrigin !== 'mouse' && focusOrigin !== 'touch') {
+      this._tabHeader.focusIndex = index;
+    }
+  }
+  _bodyCentered(isCenter) {
+    if (isCenter) {
+      this._tabBodies?.forEach((body, i) => body._setActiveClass(i === this._selectedIndex));
+    }
+  }
+  _animationsDisabled() {
+    return this._diAnimationsDisabled || this.animationDuration === '0' || this.animationDuration === '0ms';
+  }
+  static ɵfac = i0.ɵɵngDeclareFactory({
+    minVersion: "12.0.0",
+    version: "22.0.0-next.1",
+    ngImport: i0,
+    type: MatTabGroup,
+    deps: [],
+    target: i0.ɵɵFactoryTarget.Component
+  });
+  static ɵcmp = i0.ɵɵngDeclareComponent({
+    minVersion: "17.0.0",
+    version: "22.0.0-next.1",
+    type: MatTabGroup,
+    isStandalone: true,
+    selector: "mat-tab-group",
+    inputs: {
+      color: "color",
+      fitInkBarToContent: ["fitInkBarToContent", "fitInkBarToContent", booleanAttribute],
+      stretchTabs: ["mat-stretch-tabs", "stretchTabs", booleanAttribute],
+      alignTabs: ["mat-align-tabs", "alignTabs"],
+      dynamicHeight: ["dynamicHeight", "dynamicHeight", booleanAttribute],
+      selectedIndex: ["selectedIndex", "selectedIndex", numberAttribute],
+      headerPosition: "headerPosition",
+      animationDuration: "animationDuration",
+      contentTabIndex: ["contentTabIndex", "contentTabIndex", numberAttribute],
+      disablePagination: ["disablePagination", "disablePagination", booleanAttribute],
+      disableRipple: ["disableRipple", "disableRipple", booleanAttribute],
+      preserveContent: ["preserveContent", "preserveContent", booleanAttribute],
+      backgroundColor: "backgroundColor",
+      ariaLabel: ["aria-label", "ariaLabel"],
+      ariaLabelledby: ["aria-labelledby", "ariaLabelledby"]
+    },
+    outputs: {
+      selectedIndexChange: "selectedIndexChange",
+      focusChange: "focusChange",
+      animationDone: "animationDone",
+      selectedTabChange: "selectedTabChange"
+    },
+    host: {
+      properties: {
+        "class": "\"mat-\" + (color || \"primary\")",
+        "class.mat-mdc-tab-group-dynamic-height": "dynamicHeight",
+        "class.mat-mdc-tab-group-inverted-header": "headerPosition === \"below\"",
+        "class.mat-mdc-tab-group-stretch-tabs": "stretchTabs",
+        "attr.mat-align-tabs": "alignTabs",
+        "style.--mat-tab-animation-duration": "animationDuration"
+      },
+      classAttribute: "mat-mdc-tab-group"
+    },
+    providers: [{
+      provide: MAT_TAB_GROUP,
+      useExisting: MatTabGroup
+    }],
+    queries: [{
+      propertyName: "_allTabs",
+      predicate: MatTab,
+      descendants: true
+    }],
+    viewQueries: [{
+      propertyName: "_tabBodyWrapper",
+      first: true,
+      predicate: ["tabBodyWrapper"],
+      descendants: true
+    }, {
+      propertyName: "_tabHeader",
+      first: true,
+      predicate: ["tabHeader"],
+      descendants: true
+    }, {
+      propertyName: "_tabBodies",
+      predicate: MatTabBody,
+      descendants: true
+    }],
+    exportAs: ["matTabGroup"],
+    ngImport: i0,
+    template: "<mat-tab-header #tabHeader\n                [selectedIndex]=\"selectedIndex || 0\"\n                [disableRipple]=\"disableRipple\"\n                [disablePagination]=\"disablePagination\"\n                [aria-label]=\"ariaLabel\"\n                [aria-labelledby]=\"ariaLabelledby\"\n                (indexFocused)=\"_focusChanged($event)\"\n                (selectFocusedIndex)=\"selectedIndex = $event\">\n\n  @for (tab of _tabs; track tab) {\n    <div class=\"mdc-tab mat-mdc-tab mat-focus-indicator\"\n        #tabNode\n        role=\"tab\"\n        matTabLabelWrapper\n        cdkMonitorElementFocus\n        [id]=\"_getTabLabelId(tab, $index)\"\n        [attr.tabIndex]=\"_getTabIndex($index)\"\n        [attr.aria-posinset]=\"$index + 1\"\n        [attr.aria-setsize]=\"_tabs.length\"\n        [attr.aria-controls]=\"_getTabContentId($index)\"\n        [attr.aria-selected]=\"selectedIndex === $index\"\n        [attr.aria-label]=\"tab.ariaLabel || null\"\n        [attr.aria-labelledby]=\"(!tab.ariaLabel && tab.ariaLabelledby) ? tab.ariaLabelledby : null\"\n        [class.mdc-tab--active]=\"selectedIndex === $index\"\n        [class]=\"tab.labelClass\"\n        [disabled]=\"tab.disabled\"\n        [fitInkBarToContent]=\"fitInkBarToContent\"\n        (click)=\"_handleClick(tab, tabHeader, $index)\"\n        (cdkFocusChange)=\"_tabFocusChanged($event, $index)\">\n      <span class=\"mdc-tab__ripple\"></span>\n\n      <!-- Needs to be a separate element, because we can't put\n          `overflow: hidden` on tab due to the ink bar. -->\n      <div\n        class=\"mat-mdc-tab-ripple\"\n        mat-ripple\n        [matRippleTrigger]=\"tabNode\"\n        [matRippleDisabled]=\"tab.disabled || disableRipple\"></div>\n\n      <span class=\"mdc-tab__content\">\n        <span class=\"mdc-tab__text-label\">\n          <!--\n            If there is a label template, use it, otherwise fall back to the text label.\n            Note that we don't have indentation around the text label, because it adds\n            whitespace around the text which breaks some internal tests.\n          -->\n          @if (tab.templateLabel) {\n            <ng-template [cdkPortalOutlet]=\"tab.templateLabel\"></ng-template>\n          } @else {{{tab.textLabel}}}\n        </span>\n      </span>\n    </div>\n  }\n</mat-tab-header>\n\n<!--\n  We need to project the content somewhere to avoid hydration errors. Some observations:\n  1. This is only necessary on the server.\n  2. We get a hydration error if there aren't any nodes after the `ng-content`.\n  3. We get a hydration error if `ng-content` is wrapped in another element.\n-->\n@if (_isServer) {\n  <ng-content/>\n}\n\n<div\n  class=\"mat-mdc-tab-body-wrapper\"\n  [class._mat-animation-noopable]=\"_animationsDisabled()\"\n  #tabBodyWrapper>\n  @for (tab of _tabs; track tab;) {\n    <mat-tab-body role=\"tabpanel\"\n                 [id]=\"_getTabContentId($index)\"\n                 [attr.tabindex]=\"(contentTabIndex != null && selectedIndex === $index) ? contentTabIndex : null\"\n                 [attr.aria-labelledby]=\"_getTabLabelId(tab, $index)\"\n                 [attr.aria-hidden]=\"selectedIndex !== $index\"\n                 [class]=\"tab.bodyClass\"\n                 [content]=\"tab.content!\"\n                 [position]=\"tab.position!\"\n                 [animationDuration]=\"animationDuration\"\n                 [preserveContent]=\"preserveContent\"\n                 (_onCentered)=\"_removeTabBodyWrapperHeight()\"\n                 (_onCentering)=\"_setTabBodyWrapperHeight($event)\"\n                 (_beforeCentering)=\"_bodyCentered($event)\"/>\n  }\n</div>\n",
+    styles: [".mdc-tab{min-width:90px;padding:0 24px;display:flex;flex:1 0 auto;justify-content:center;box-sizing:border-box;border:none;outline:none;text-align:center;white-space:nowrap;cursor:pointer;z-index:1;touch-action:manipulation}.mdc-tab__content{display:flex;align-items:center;justify-content:center;height:inherit;pointer-events:none}.mdc-tab__text-label{transition:150ms color linear;display:inline-block;line-height:1;z-index:2}.mdc-tab--active .mdc-tab__text-label{transition-delay:100ms}._mat-animation-noopable .mdc-tab__text-label{transition:none}.mdc-tab-indicator{display:flex;position:absolute;top:0;left:0;justify-content:center;width:100%;height:100%;pointer-events:none;z-index:1}.mdc-tab-indicator__content{transition:var(--mat-tab-animation-duration, 250ms) transform cubic-bezier(0.4, 0, 0.2, 1);transform-origin:left;opacity:0}.mdc-tab-indicator__content--underline{align-self:flex-end;box-sizing:border-box;width:100%;border-top-style:solid}.mdc-tab-indicator--active .mdc-tab-indicator__content{opacity:1}._mat-animation-noopable .mdc-tab-indicator__content,.mdc-tab-indicator--no-transition .mdc-tab-indicator__content{transition:none}.mat-mdc-tab-ripple.mat-mdc-tab-ripple{position:absolute;top:0;left:0;bottom:0;right:0;pointer-events:none}.mat-mdc-tab{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-decoration:none;background:none;height:var(--mat-tab-container-height, 48px);font-family:var(--mat-tab-label-text-font, var(--mat-sys-title-small-font));font-size:var(--mat-tab-label-text-size, var(--mat-sys-title-small-size));letter-spacing:var(--mat-tab-label-text-tracking, var(--mat-sys-title-small-tracking));line-height:var(--mat-tab-label-text-line-height, var(--mat-sys-title-small-line-height));font-weight:var(--mat-tab-label-text-weight, var(--mat-sys-title-small-weight))}.mat-mdc-tab.mdc-tab{flex-grow:0}.mat-mdc-tab .mdc-tab-indicator__content--underline{border-color:var(--mat-tab-active-indicator-color, var(--mat-sys-primary));border-top-width:var(--mat-tab-active-indicator-height, 2px);border-radius:var(--mat-tab-active-indicator-shape, 0)}.mat-mdc-tab:hover .mdc-tab__text-label{color:var(--mat-tab-inactive-hover-label-text-color, var(--mat-sys-on-surface))}.mat-mdc-tab:focus .mdc-tab__text-label{color:var(--mat-tab-inactive-focus-label-text-color, var(--mat-sys-on-surface))}.mat-mdc-tab.mdc-tab--active .mdc-tab__text-label{color:var(--mat-tab-active-label-text-color, var(--mat-sys-on-surface))}.mat-mdc-tab.mdc-tab--active .mdc-tab__ripple::before,.mat-mdc-tab.mdc-tab--active .mat-ripple-element{background-color:var(--mat-tab-active-ripple-color, var(--mat-sys-on-surface))}.mat-mdc-tab.mdc-tab--active:hover .mdc-tab__text-label{color:var(--mat-tab-active-hover-label-text-color, var(--mat-sys-on-surface))}.mat-mdc-tab.mdc-tab--active:hover .mdc-tab-indicator__content--underline{border-color:var(--mat-tab-active-hover-indicator-color, var(--mat-sys-primary))}.mat-mdc-tab.mdc-tab--active:focus .mdc-tab__text-label{color:var(--mat-tab-active-focus-label-text-color, var(--mat-sys-on-surface))}.mat-mdc-tab.mdc-tab--active:focus .mdc-tab-indicator__content--underline{border-color:var(--mat-tab-active-focus-indicator-color, var(--mat-sys-primary))}.mat-mdc-tab.mat-mdc-tab-disabled{opacity:.4;pointer-events:none}.mat-mdc-tab.mat-mdc-tab-disabled .mdc-tab__content{pointer-events:none}.mat-mdc-tab.mat-mdc-tab-disabled .mdc-tab__ripple::before,.mat-mdc-tab.mat-mdc-tab-disabled .mat-ripple-element{background-color:var(--mat-tab-disabled-ripple-color, var(--mat-sys-on-surface-variant))}.mat-mdc-tab .mdc-tab__ripple::before{content:\"\";display:block;position:absolute;top:0;left:0;right:0;bottom:0;opacity:0;pointer-events:none;background-color:var(--mat-tab-inactive-ripple-color, var(--mat-sys-on-surface))}.mat-mdc-tab .mdc-tab__text-label{color:var(--mat-tab-inactive-label-text-color, var(--mat-sys-on-surface));display:inline-flex;align-items:center}.mat-mdc-tab .mdc-tab__content{position:relative;pointer-events:auto}.mat-mdc-tab:hover .mdc-tab__ripple::before{opacity:.04}.mat-mdc-tab.cdk-program-focused .mdc-tab__ripple::before,.mat-mdc-tab.cdk-keyboard-focused .mdc-tab__ripple::before{opacity:.12}.mat-mdc-tab .mat-ripple-element{opacity:.12;background-color:var(--mat-tab-inactive-ripple-color, var(--mat-sys-on-surface))}.mat-mdc-tab-group.mat-mdc-tab-group-stretch-tabs>.mat-mdc-tab-header .mat-mdc-tab{flex-grow:1}.mat-mdc-tab-group{display:flex;flex-direction:column;max-width:100%}.mat-mdc-tab-group.mat-tabs-with-background>.mat-mdc-tab-header,.mat-mdc-tab-group.mat-tabs-with-background>.mat-mdc-tab-header-pagination{background-color:var(--mat-tab-background-color)}.mat-mdc-tab-group.mat-tabs-with-background.mat-primary>.mat-mdc-tab-header .mat-mdc-tab .mdc-tab__text-label{color:var(--mat-tab-foreground-color)}.mat-mdc-tab-group.mat-tabs-with-background.mat-primary>.mat-mdc-tab-header .mdc-tab-indicator__content--underline{border-color:var(--mat-tab-foreground-color)}.mat-mdc-tab-group.mat-tabs-with-background:not(.mat-primary)>.mat-mdc-tab-header .mat-mdc-tab:not(.mdc-tab--active) .mdc-tab__text-label{color:var(--mat-tab-foreground-color)}.mat-mdc-tab-group.mat-tabs-with-background:not(.mat-primary)>.mat-mdc-tab-header .mat-mdc-tab:not(.mdc-tab--active) .mdc-tab-indicator__content--underline{border-color:var(--mat-tab-foreground-color)}.mat-mdc-tab-group.mat-tabs-with-background>.mat-mdc-tab-header .mat-mdc-tab-header-pagination-chevron,.mat-mdc-tab-group.mat-tabs-with-background>.mat-mdc-tab-header .mat-focus-indicator::before,.mat-mdc-tab-group.mat-tabs-with-background>.mat-mdc-tab-header-pagination .mat-mdc-tab-header-pagination-chevron,.mat-mdc-tab-group.mat-tabs-with-background>.mat-mdc-tab-header-pagination .mat-focus-indicator::before{border-color:var(--mat-tab-foreground-color)}.mat-mdc-tab-group.mat-tabs-with-background>.mat-mdc-tab-header .mat-ripple-element,.mat-mdc-tab-group.mat-tabs-with-background>.mat-mdc-tab-header .mdc-tab__ripple::before,.mat-mdc-tab-group.mat-tabs-with-background>.mat-mdc-tab-header-pagination .mat-ripple-element,.mat-mdc-tab-group.mat-tabs-with-background>.mat-mdc-tab-header-pagination .mdc-tab__ripple::before{background-color:var(--mat-tab-foreground-color)}.mat-mdc-tab-group.mat-tabs-with-background>.mat-mdc-tab-header .mat-mdc-tab-header-pagination-chevron,.mat-mdc-tab-group.mat-tabs-with-background>.mat-mdc-tab-header-pagination .mat-mdc-tab-header-pagination-chevron{color:var(--mat-tab-foreground-color)}.mat-mdc-tab-group.mat-mdc-tab-group-inverted-header{flex-direction:column-reverse}.mat-mdc-tab-group.mat-mdc-tab-group-inverted-header .mdc-tab-indicator__content--underline{align-self:flex-start}.mat-mdc-tab-body-wrapper{position:relative;overflow:hidden;display:flex;transition:height 500ms cubic-bezier(0.35, 0, 0.25, 1)}.mat-mdc-tab-body-wrapper._mat-animation-noopable{transition:none !important;animation:none !important}\n"],
+    dependencies: [{
+      kind: "component",
+      type: MatTabHeader,
+      selector: "mat-tab-header",
+      inputs: ["aria-label", "aria-labelledby", "disableRipple"]
+    }, {
+      kind: "directive",
+      type: MatTabLabelWrapper,
+      selector: "[matTabLabelWrapper]",
+      inputs: ["disabled"]
+    }, {
+      kind: "directive",
+      type: CdkMonitorFocus,
+      selector: "[cdkMonitorElementFocus], [cdkMonitorSubtreeFocus]",
+      outputs: ["cdkFocusChange"],
+      exportAs: ["cdkMonitorFocus"]
+    }, {
+      kind: "directive",
+      type: MatRipple,
+      selector: "[mat-ripple], [matRipple]",
+      inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"],
+      exportAs: ["matRipple"]
+    }, {
+      kind: "directive",
+      type: CdkPortalOutlet,
+      selector: "[cdkPortalOutlet]",
+      inputs: ["cdkPortalOutlet"],
+      outputs: ["attached"],
+      exportAs: ["cdkPortalOutlet"]
+    }, {
+      kind: "component",
+      type: MatTabBody,
+      selector: "mat-tab-body",
+      inputs: ["content", "animationDuration", "preserveContent", "position"],
+      outputs: ["_onCentering", "_beforeCentering", "_onCentered"]
+    }],
+    changeDetection: i0.ChangeDetectionStrategy.Eager,
+    encapsulation: i0.ViewEncapsulation.None
+  });
+}
+i0.ɵɵngDeclareClassMetadata({
+  minVersion: "12.0.0",
+  version: "22.0.0-next.1",
+  ngImport: i0,
+  type: MatTabGroup,
+  decorators: [{
+    type: Component,
+    args: [{
+      selector: 'mat-tab-group',
+      exportAs: 'matTabGroup',
+      encapsulation: ViewEncapsulation.None,
+      changeDetection: ChangeDetectionStrategy.Default,
+      providers: [{
+        provide: MAT_TAB_GROUP,
+        useExisting: MatTabGroup
+      }],
+      host: {
+        'class': 'mat-mdc-tab-group',
+        '[class]': '"mat-" + (color || "primary")',
+        '[class.mat-mdc-tab-group-dynamic-height]': 'dynamicHeight',
+        '[class.mat-mdc-tab-group-inverted-header]': 'headerPosition === "below"',
+        '[class.mat-mdc-tab-group-stretch-tabs]': 'stretchTabs',
+        '[attr.mat-align-tabs]': 'alignTabs',
+        '[style.--mat-tab-animation-duration]': 'animationDuration'
+      },
+      imports: [MatTabHeader, MatTabLabelWrapper, CdkMonitorFocus, MatRipple, CdkPortalOutlet, MatTabBody],
+      template: "<mat-tab-header #tabHeader\n                [selectedIndex]=\"selectedIndex || 0\"\n                [disableRipple]=\"disableRipple\"\n                [disablePagination]=\"disablePagination\"\n                [aria-label]=\"ariaLabel\"\n                [aria-labelledby]=\"ariaLabelledby\"\n                (indexFocused)=\"_focusChanged($event)\"\n                (selectFocusedIndex)=\"selectedIndex = $event\">\n\n  @for (tab of _tabs; track tab) {\n    <div class=\"mdc-tab mat-mdc-tab mat-focus-indicator\"\n        #tabNode\n        role=\"tab\"\n        matTabLabelWrapper\n        cdkMonitorElementFocus\n        [id]=\"_getTabLabelId(tab, $index)\"\n        [attr.tabIndex]=\"_getTabIndex($index)\"\n        [attr.aria-posinset]=\"$index + 1\"\n        [attr.aria-setsize]=\"_tabs.length\"\n        [attr.aria-controls]=\"_getTabContentId($index)\"\n        [attr.aria-selected]=\"selectedIndex === $index\"\n        [attr.aria-label]=\"tab.ariaLabel || null\"\n        [attr.aria-labelledby]=\"(!tab.ariaLabel && tab.ariaLabelledby) ? tab.ariaLabelledby : null\"\n        [class.mdc-tab--active]=\"selectedIndex === $index\"\n        [class]=\"tab.labelClass\"\n        [disabled]=\"tab.disabled\"\n        [fitInkBarToContent]=\"fitInkBarToContent\"\n        (click)=\"_handleClick(tab, tabHeader, $index)\"\n        (cdkFocusChange)=\"_tabFocusChanged($event, $index)\">\n      <span class=\"mdc-tab__ripple\"></span>\n\n      <!-- Needs to be a separate element, because we can't put\n          `overflow: hidden` on tab due to the ink bar. -->\n      <div\n        class=\"mat-mdc-tab-ripple\"\n        mat-ripple\n        [matRippleTrigger]=\"tabNode\"\n        [matRippleDisabled]=\"tab.disabled || disableRipple\"></div>\n\n      <span class=\"mdc-tab__content\">\n        <span class=\"mdc-tab__text-label\">\n          <!--\n            If there is a label template, use it, otherwise fall back to the text label.\n            Note that we don't have indentation around the text label, because it adds\n            whitespace around the text which breaks some internal tests.\n          -->\n          @if (tab.templateLabel) {\n            <ng-template [cdkPortalOutlet]=\"tab.templateLabel\"></ng-template>\n          } @else {{{tab.textLabel}}}\n        </span>\n      </span>\n    </div>\n  }\n</mat-tab-header>\n\n<!--\n  We need to project the content somewhere to avoid hydration errors. Some observations:\n  1. This is only necessary on the server.\n  2. We get a hydration error if there aren't any nodes after the `ng-content`.\n  3. We get a hydration error if `ng-content` is wrapped in another element.\n-->\n@if (_isServer) {\n  <ng-content/>\n}\n\n<div\n  class=\"mat-mdc-tab-body-wrapper\"\n  [class._mat-animation-noopable]=\"_animationsDisabled()\"\n  #tabBodyWrapper>\n  @for (tab of _tabs; track tab;) {\n    <mat-tab-body role=\"tabpanel\"\n                 [id]=\"_getTabContentId($index)\"\n                 [attr.tabindex]=\"(contentTabIndex != null && selectedIndex === $index) ? contentTabIndex : null\"\n                 [attr.aria-labelledby]=\"_getTabLabelId(tab, $index)\"\n                 [attr.aria-hidden]=\"selectedIndex !== $index\"\n                 [class]=\"tab.bodyClass\"\n                 [content]=\"tab.content!\"\n                 [position]=\"tab.position!\"\n                 [animationDuration]=\"animationDuration\"\n                 [preserveContent]=\"preserveContent\"\n                 (_onCentered)=\"_removeTabBodyWrapperHeight()\"\n                 (_onCentering)=\"_setTabBodyWrapperHeight($event)\"\n                 (_beforeCentering)=\"_bodyCentered($event)\"/>\n  }\n</div>\n",
+      styles: [".mdc-tab{min-width:90px;padding:0 24px;display:flex;flex:1 0 auto;justify-content:center;box-sizing:border-box;border:none;outline:none;text-align:center;white-space:nowrap;cursor:pointer;z-index:1;touch-action:manipulation}.mdc-tab__content{display:flex;align-items:center;justify-content:center;height:inherit;pointer-events:none}.mdc-tab__text-label{transition:150ms color linear;display:inline-block;line-height:1;z-index:2}.mdc-tab--active .mdc-tab__text-label{transition-delay:100ms}._mat-animation-noopable .mdc-tab__text-label{transition:none}.mdc-tab-indicator{display:flex;position:absolute;top:0;left:0;justify-content:center;width:100%;height:100%;pointer-events:none;z-index:1}.mdc-tab-indicator__content{transition:var(--mat-tab-animation-duration, 250ms) transform cubic-bezier(0.4, 0, 0.2, 1);transform-origin:left;opacity:0}.mdc-tab-indicator__content--underline{align-self:flex-end;box-sizing:border-box;width:100%;border-top-style:solid}.mdc-tab-indicator--active .mdc-tab-indicator__content{opacity:1}._mat-animation-noopable .mdc-tab-indicator__content,.mdc-tab-indicator--no-transition .mdc-tab-indicator__content{transition:none}.mat-mdc-tab-ripple.mat-mdc-tab-ripple{position:absolute;top:0;left:0;bottom:0;right:0;pointer-events:none}.mat-mdc-tab{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-decoration:none;background:none;height:var(--mat-tab-container-height, 48px);font-family:var(--mat-tab-label-text-font, var(--mat-sys-title-small-font));font-size:var(--mat-tab-label-text-size, var(--mat-sys-title-small-size));letter-spacing:var(--mat-tab-label-text-tracking, var(--mat-sys-title-small-tracking));line-height:var(--mat-tab-label-text-line-height, var(--mat-sys-title-small-line-height));font-weight:var(--mat-tab-label-text-weight, var(--mat-sys-title-small-weight))}.mat-mdc-tab.mdc-tab{flex-grow:0}.mat-mdc-tab .mdc-tab-indicator__content--underline{border-color:var(--mat-tab-active-indicator-color, var(--mat-sys-primary));border-top-width:var(--mat-tab-active-indicator-height, 2px);border-radius:var(--mat-tab-active-indicator-shape, 0)}.mat-mdc-tab:hover .mdc-tab__text-label{color:var(--mat-tab-inactive-hover-label-text-color, var(--mat-sys-on-surface))}.mat-mdc-tab:focus .mdc-tab__text-label{color:var(--mat-tab-inactive-focus-label-text-color, var(--mat-sys-on-surface))}.mat-mdc-tab.mdc-tab--active .mdc-tab__text-label{color:var(--mat-tab-active-label-text-color, var(--mat-sys-on-surface))}.mat-mdc-tab.mdc-tab--active .mdc-tab__ripple::before,.mat-mdc-tab.mdc-tab--active .mat-ripple-element{background-color:var(--mat-tab-active-ripple-color, var(--mat-sys-on-surface))}.mat-mdc-tab.mdc-tab--active:hover .mdc-tab__text-label{color:var(--mat-tab-active-hover-label-text-color, var(--mat-sys-on-surface))}.mat-mdc-tab.mdc-tab--active:hover .mdc-tab-indicator__content--underline{border-color:var(--mat-tab-active-hover-indicator-color, var(--mat-sys-primary))}.mat-mdc-tab.mdc-tab--active:focus .mdc-tab__text-label{color:var(--mat-tab-active-focus-label-text-color, var(--mat-sys-on-surface))}.mat-mdc-tab.mdc-tab--active:focus .mdc-tab-indicator__content--underline{border-color:var(--mat-tab-active-focus-indicator-color, var(--mat-sys-primary))}.mat-mdc-tab.mat-mdc-tab-disabled{opacity:.4;pointer-events:none}.mat-mdc-tab.mat-mdc-tab-disabled .mdc-tab__content{pointer-events:none}.mat-mdc-tab.mat-mdc-tab-disabled .mdc-tab__ripple::before,.mat-mdc-tab.mat-mdc-tab-disabled .mat-ripple-element{background-color:var(--mat-tab-disabled-ripple-color, var(--mat-sys-on-surface-variant))}.mat-mdc-tab .mdc-tab__ripple::before{content:\"\";display:block;position:absolute;top:0;left:0;right:0;bottom:0;opacity:0;pointer-events:none;background-color:var(--mat-tab-inactive-ripple-color, var(--mat-sys-on-surface))}.mat-mdc-tab .mdc-tab__text-label{color:var(--mat-tab-inactive-label-text-color, var(--mat-sys-on-surface));display:inline-flex;align-items:center}.mat-mdc-tab .mdc-tab__content{position:relative;pointer-events:auto}.mat-mdc-tab:hover .mdc-tab__ripple::before{opacity:.04}.mat-mdc-tab.cdk-program-focused .mdc-tab__ripple::before,.mat-mdc-tab.cdk-keyboard-focused .mdc-tab__ripple::before{opacity:.12}.mat-mdc-tab .mat-ripple-element{opacity:.12;background-color:var(--mat-tab-inactive-ripple-color, var(--mat-sys-on-surface))}.mat-mdc-tab-group.mat-mdc-tab-group-stretch-tabs>.mat-mdc-tab-header .mat-mdc-tab{flex-grow:1}.mat-mdc-tab-group{display:flex;flex-direction:column;max-width:100%}.mat-mdc-tab-group.mat-tabs-with-background>.mat-mdc-tab-header,.mat-mdc-tab-group.mat-tabs-with-background>.mat-mdc-tab-header-pagination{background-color:var(--mat-tab-background-color)}.mat-mdc-tab-group.mat-tabs-with-background.mat-primary>.mat-mdc-tab-header .mat-mdc-tab .mdc-tab__text-label{color:var(--mat-tab-foreground-color)}.mat-mdc-tab-group.mat-tabs-with-background.mat-primary>.mat-mdc-tab-header .mdc-tab-indicator__content--underline{border-color:var(--mat-tab-foreground-color)}.mat-mdc-tab-group.mat-tabs-with-background:not(.mat-primary)>.mat-mdc-tab-header .mat-mdc-tab:not(.mdc-tab--active) .mdc-tab__text-label{color:var(--mat-tab-foreground-color)}.mat-mdc-tab-group.mat-tabs-with-background:not(.mat-primary)>.mat-mdc-tab-header .mat-mdc-tab:not(.mdc-tab--active) .mdc-tab-indicator__content--underline{border-color:var(--mat-tab-foreground-color)}.mat-mdc-tab-group.mat-tabs-with-background>.mat-mdc-tab-header .mat-mdc-tab-header-pagination-chevron,.mat-mdc-tab-group.mat-tabs-with-background>.mat-mdc-tab-header .mat-focus-indicator::before,.mat-mdc-tab-group.mat-tabs-with-background>.mat-mdc-tab-header-pagination .mat-mdc-tab-header-pagination-chevron,.mat-mdc-tab-group.mat-tabs-with-background>.mat-mdc-tab-header-pagination .mat-focus-indicator::before{border-color:var(--mat-tab-foreground-color)}.mat-mdc-tab-group.mat-tabs-with-background>.mat-mdc-tab-header .mat-ripple-element,.mat-mdc-tab-group.mat-tabs-with-background>.mat-mdc-tab-header .mdc-tab__ripple::before,.mat-mdc-tab-group.mat-tabs-with-background>.mat-mdc-tab-header-pagination .mat-ripple-element,.mat-mdc-tab-group.mat-tabs-with-background>.mat-mdc-tab-header-pagination .mdc-tab__ripple::before{background-color:var(--mat-tab-foreground-color)}.mat-mdc-tab-group.mat-tabs-with-background>.mat-mdc-tab-header .mat-mdc-tab-header-pagination-chevron,.mat-mdc-tab-group.mat-tabs-with-background>.mat-mdc-tab-header-pagination .mat-mdc-tab-header-pagination-chevron{color:var(--mat-tab-foreground-color)}.mat-mdc-tab-group.mat-mdc-tab-group-inverted-header{flex-direction:column-reverse}.mat-mdc-tab-group.mat-mdc-tab-group-inverted-header .mdc-tab-indicator__content--underline{align-self:flex-start}.mat-mdc-tab-body-wrapper{position:relative;overflow:hidden;display:flex;transition:height 500ms cubic-bezier(0.35, 0, 0.25, 1)}.mat-mdc-tab-body-wrapper._mat-animation-noopable{transition:none !important;animation:none !important}\n"]
+    }]
+  }],
+  ctorParameters: () => [],
+  propDecorators: {
+    _allTabs: [{
+      type: ContentChildren,
+      args: [MatTab, {
+        descendants: true
+      }]
+    }],
+    _tabBodies: [{
+      type: ViewChildren,
+      args: [MatTabBody]
+    }],
+    _tabBodyWrapper: [{
+      type: ViewChild,
+      args: ['tabBodyWrapper']
+    }],
+    _tabHeader: [{
+      type: ViewChild,
+      args: ['tabHeader']
+    }],
+    color: [{
+      type: Input
+    }],
+    fitInkBarToContent: [{
+      type: Input,
+      args: [{
+        transform: booleanAttribute
+      }]
+    }],
+    stretchTabs: [{
+      type: Input,
+      args: [{
+        alias: 'mat-stretch-tabs',
+        transform: booleanAttribute
+      }]
+    }],
+    alignTabs: [{
+      type: Input,
+      args: [{
+        alias: 'mat-align-tabs'
+      }]
+    }],
+    dynamicHeight: [{
+      type: Input,
+      args: [{
+        transform: booleanAttribute
+      }]
+    }],
+    selectedIndex: [{
+      type: Input,
+      args: [{
+        transform: numberAttribute
+      }]
+    }],
+    headerPosition: [{
+      type: Input
+    }],
+    animationDuration: [{
+      type: Input
+    }],
+    contentTabIndex: [{
+      type: Input,
+      args: [{
+        transform: numberAttribute
+      }]
+    }],
+    disablePagination: [{
+      type: Input,
+      args: [{
+        transform: booleanAttribute
+      }]
+    }],
+    disableRipple: [{
+      type: Input,
+      args: [{
+        transform: booleanAttribute
+      }]
+    }],
+    preserveContent: [{
+      type: Input,
+      args: [{
+        transform: booleanAttribute
+      }]
+    }],
+    backgroundColor: [{
+      type: Input
+    }],
+    ariaLabel: [{
+      type: Input,
+      args: ['aria-label']
+    }],
+    ariaLabelledby: [{
+      type: Input,
+      args: ['aria-labelledby']
+    }],
+    selectedIndexChange: [{
+      type: Output
+    }],
+    focusChange: [{
+      type: Output
+    }],
+    animationDone: [{
+      type: Output
+    }],
+    selectedTabChange: [{
+      type: Output
+    }]
+  }
+});
+class MatTabChangeEvent {
+  index;
+  tab;
+}
+
+class MatTabNav extends MatPaginatedTabHeader {
+  _focusedItem = signal(null, ...(ngDevMode ? [{
+    debugName: "_focusedItem"
+  }] : []));
+  get fitInkBarToContent() {
+    return this._fitInkBarToContent.value;
+  }
+  set fitInkBarToContent(value) {
+    this._fitInkBarToContent.next(value);
+    this._changeDetectorRef.markForCheck();
+  }
+  _fitInkBarToContent = new BehaviorSubject(false);
+  stretchTabs = true;
+  get animationDuration() {
+    return this._animationDuration;
+  }
+  set animationDuration(value) {
+    const stringValue = value + '';
+    this._animationDuration = /^\d+$/.test(stringValue) ? value + 'ms' : stringValue;
+  }
+  _animationDuration;
+  _items;
+  get backgroundColor() {
+    return this._backgroundColor;
+  }
+  set backgroundColor(value) {
+    const classList = this._elementRef.nativeElement.classList;
+    classList.remove('mat-tabs-with-background', `mat-background-${this.backgroundColor}`);
+    if (value) {
+      classList.add('mat-tabs-with-background', `mat-background-${value}`);
+    }
+    this._backgroundColor = value;
+  }
+  _backgroundColor;
+  get disableRipple() {
+    return this._disableRipple();
+  }
+  set disableRipple(value) {
+    this._disableRipple.set(value);
+  }
+  _disableRipple = signal(false, ...(ngDevMode ? [{
+    debugName: "_disableRipple"
+  }] : []));
+  color = 'primary';
+  tabPanel;
+  _tabListContainer;
+  _tabList;
+  _tabListInner;
+  _nextPaginator;
+  _previousPaginator;
+  _inkBar;
+  constructor() {
+    const defaultConfig = inject(MAT_TABS_CONFIG, {
+      optional: true
+    });
+    super();
+    this.disablePagination = defaultConfig && defaultConfig.disablePagination != null ? defaultConfig.disablePagination : false;
+    this.fitInkBarToContent = defaultConfig && defaultConfig.fitInkBarToContent != null ? defaultConfig.fitInkBarToContent : false;
+    this.stretchTabs = defaultConfig && defaultConfig.stretchTabs != null ? defaultConfig.stretchTabs : true;
+  }
+  _itemSelected() {}
+  ngAfterContentInit() {
+    this._inkBar = new MatInkBar(this._items);
+    this._items.changes.pipe(startWith(null), takeUntil(this._destroyed)).subscribe(() => this.updateActiveLink());
+    super.ngAfterContentInit();
+    this._keyManager.change.pipe(startWith(null), takeUntil(this._destroyed)).subscribe(() => this._focusedItem.set(this._keyManager?.activeItem || null));
+  }
+  ngAfterViewInit() {
+    if (!this.tabPanel && (typeof ngDevMode === 'undefined' || ngDevMode)) {
+      throw new Error('A mat-tab-nav-panel must be specified via [tabPanel].');
+    }
+    super.ngAfterViewInit();
+  }
+  updateActiveLink() {
+    if (!this._items) {
+      return;
+    }
+    const items = this._items.toArray();
+    for (let i = 0; i < items.length; i++) {
+      if (items[i].active) {
+        this.selectedIndex = i;
+        if (this.tabPanel) {
+          this.tabPanel._activeTabId = items[i].id;
+        }
+        this._focusedItem.set(items[i]);
+        this._changeDetectorRef.markForCheck();
+        return;
+      }
+    }
+    this.selectedIndex = -1;
+  }
+  _getRole() {
+    return this.tabPanel ? 'tablist' : this._elementRef.nativeElement.getAttribute('role');
+  }
+  _hasFocus(link) {
+    return this._keyManager?.activeItem === link;
+  }
+  static ɵfac = i0.ɵɵngDeclareFactory({
+    minVersion: "12.0.0",
+    version: "22.0.0-next.1",
+    ngImport: i0,
+    type: MatTabNav,
+    deps: [],
+    target: i0.ɵɵFactoryTarget.Component
+  });
+  static ɵcmp = i0.ɵɵngDeclareComponent({
+    minVersion: "16.1.0",
+    version: "22.0.0-next.1",
+    type: MatTabNav,
+    isStandalone: true,
+    selector: "[mat-tab-nav-bar]",
+    inputs: {
+      fitInkBarToContent: ["fitInkBarToContent", "fitInkBarToContent", booleanAttribute],
+      stretchTabs: ["mat-stretch-tabs", "stretchTabs", booleanAttribute],
+      animationDuration: "animationDuration",
+      backgroundColor: "backgroundColor",
+      disableRipple: ["disableRipple", "disableRipple", booleanAttribute],
+      color: "color",
+      tabPanel: "tabPanel"
+    },
+    host: {
+      properties: {
+        "attr.role": "_getRole()",
+        "class.mat-mdc-tab-header-pagination-controls-enabled": "_showPaginationControls",
+        "class.mat-mdc-tab-header-rtl": "_getLayoutDirection() == 'rtl'",
+        "class.mat-mdc-tab-nav-bar-stretch-tabs": "stretchTabs",
+        "class.mat-primary": "color !== \"warn\" && color !== \"accent\"",
+        "class.mat-accent": "color === \"accent\"",
+        "class.mat-warn": "color === \"warn\"",
+        "class._mat-animation-noopable": "_animationsDisabled",
+        "style.--mat-tab-animation-duration": "animationDuration"
+      },
+      classAttribute: "mat-mdc-tab-nav-bar mat-mdc-tab-header"
+    },
+    queries: [{
+      propertyName: "_items",
+      predicate: i0.forwardRef(() => MatTabLink),
+      descendants: true
+    }],
+    viewQueries: [{
+      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: "<!--\n Note that this intentionally uses a `div` instead of a `button`, because it's not part of\n the regular tabs flow and is only here to support mouse users. It should also not be focusable.\n-->\n<div class=\"mat-mdc-tab-header-pagination mat-mdc-tab-header-pagination-before\"\n     #previousPaginator\n     mat-ripple\n     [matRippleDisabled]=\"_disableScrollBefore || disableRipple\"\n     [class.mat-mdc-tab-header-pagination-disabled]=\"_disableScrollBefore\"\n     (click)=\"_handlePaginatorClick('before')\"\n     (mousedown)=\"_handlePaginatorPress('before', $event)\"\n     (touchend)=\"_stopInterval()\">\n  <div class=\"mat-mdc-tab-header-pagination-chevron\"></div>\n</div>\n\n<div class=\"mat-mdc-tab-link-container\" #tabListContainer (keydown)=\"_handleKeydown($event)\">\n  <div class=\"mat-mdc-tab-list\" #tabList (cdkObserveContent)=\"_onContentChanges()\">\n    <div class=\"mat-mdc-tab-links\" #tabListInner>\n      <ng-content></ng-content>\n    </div>\n  </div>\n</div>\n\n<div class=\"mat-mdc-tab-header-pagination mat-mdc-tab-header-pagination-after\"\n     #nextPaginator\n     mat-ripple\n     [matRippleDisabled]=\"_disableScrollAfter || disableRipple\"\n     [class.mat-mdc-tab-header-pagination-disabled]=\"_disableScrollAfter\"\n     (mousedown)=\"_handlePaginatorPress('after', $event)\"\n     (click)=\"_handlePaginatorClick('after')\"\n     (touchend)=\"_stopInterval()\">\n  <div class=\"mat-mdc-tab-header-pagination-chevron\"></div>\n</div>\n",
+    styles: [".mdc-tab{min-width:90px;padding:0 24px;display:flex;flex:1 0 auto;justify-content:center;box-sizing:border-box;border:none;outline:none;text-align:center;white-space:nowrap;cursor:pointer;z-index:1;touch-action:manipulation}.mdc-tab__content{display:flex;align-items:center;justify-content:center;height:inherit;pointer-events:none}.mdc-tab__text-label{transition:150ms color linear;display:inline-block;line-height:1;z-index:2}.mdc-tab--active .mdc-tab__text-label{transition-delay:100ms}._mat-animation-noopable .mdc-tab__text-label{transition:none}.mdc-tab-indicator{display:flex;position:absolute;top:0;left:0;justify-content:center;width:100%;height:100%;pointer-events:none;z-index:1}.mdc-tab-indicator__content{transition:var(--mat-tab-animation-duration, 250ms) transform cubic-bezier(0.4, 0, 0.2, 1);transform-origin:left;opacity:0}.mdc-tab-indicator__content--underline{align-self:flex-end;box-sizing:border-box;width:100%;border-top-style:solid}.mdc-tab-indicator--active .mdc-tab-indicator__content{opacity:1}._mat-animation-noopable .mdc-tab-indicator__content,.mdc-tab-indicator--no-transition .mdc-tab-indicator__content{transition:none}.mat-mdc-tab-ripple.mat-mdc-tab-ripple{position:absolute;top:0;left:0;bottom:0;right:0;pointer-events:none}.mat-mdc-tab-header{display:flex;overflow:hidden;position:relative;flex-shrink:0}.mdc-tab-indicator .mdc-tab-indicator__content{transition-duration:var(--mat-tab-animation-duration, 250ms)}.mat-mdc-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;outline:0}.mat-mdc-tab-header-pagination::-moz-focus-inner{border:0}.mat-mdc-tab-header-pagination .mat-ripple-element{opacity:.12;background-color:var(--mat-tab-inactive-ripple-color, var(--mat-sys-on-surface))}.mat-mdc-tab-header-pagination-controls-enabled .mat-mdc-tab-header-pagination{display:flex}.mat-mdc-tab-header-pagination-before,.mat-mdc-tab-header-rtl .mat-mdc-tab-header-pagination-after{padding-left:4px}.mat-mdc-tab-header-pagination-before .mat-mdc-tab-header-pagination-chevron,.mat-mdc-tab-header-rtl .mat-mdc-tab-header-pagination-after .mat-mdc-tab-header-pagination-chevron{transform:rotate(-135deg)}.mat-mdc-tab-header-rtl .mat-mdc-tab-header-pagination-before,.mat-mdc-tab-header-pagination-after{padding-right:4px}.mat-mdc-tab-header-rtl .mat-mdc-tab-header-pagination-before .mat-mdc-tab-header-pagination-chevron,.mat-mdc-tab-header-pagination-after .mat-mdc-tab-header-pagination-chevron{transform:rotate(45deg)}.mat-mdc-tab-header-pagination-chevron{border-style:solid;border-width:2px 2px 0 0;height:8px;width:8px;border-color:var(--mat-tab-pagination-icon-color, var(--mat-sys-on-surface))}.mat-mdc-tab-header-pagination-disabled{box-shadow:none;cursor:default;pointer-events:none}.mat-mdc-tab-header-pagination-disabled .mat-mdc-tab-header-pagination-chevron{opacity:.4}.mat-mdc-tab-list{flex-grow:1;position:relative;transition:transform 500ms cubic-bezier(0.35, 0, 0.25, 1)}._mat-animation-noopable .mat-mdc-tab-list{transition:none}.mat-mdc-tab-links{display:flex;flex:1 0 auto}[mat-align-tabs=center]>.mat-mdc-tab-link-container .mat-mdc-tab-links{justify-content:center}[mat-align-tabs=end]>.mat-mdc-tab-link-container .mat-mdc-tab-links{justify-content:flex-end}.cdk-drop-list .mat-mdc-tab-links,.mat-mdc-tab-links.cdk-drop-list{min-height:var(--mat-tab-container-height, 48px)}.mat-mdc-tab-link-container{display:flex;flex-grow:1;overflow:hidden;z-index:1;border-bottom-style:solid;border-bottom-width:var(--mat-tab-divider-height, 1px);border-bottom-color:var(--mat-tab-divider-color, var(--mat-sys-surface-variant))}.mat-mdc-tab-nav-bar.mat-tabs-with-background>.mat-mdc-tab-link-container,.mat-mdc-tab-nav-bar.mat-tabs-with-background>.mat-mdc-tab-header-pagination{background-color:var(--mat-tab-background-color)}.mat-mdc-tab-nav-bar.mat-tabs-with-background.mat-primary>.mat-mdc-tab-link-container .mat-mdc-tab-link .mdc-tab__text-label{color:var(--mat-tab-foreground-color)}.mat-mdc-tab-nav-bar.mat-tabs-with-background.mat-primary>.mat-mdc-tab-link-container .mdc-tab-indicator__content--underline{border-color:var(--mat-tab-foreground-color)}.mat-mdc-tab-nav-bar.mat-tabs-with-background:not(.mat-primary)>.mat-mdc-tab-link-container .mat-mdc-tab-link:not(.mdc-tab--active) .mdc-tab__text-label{color:var(--mat-tab-foreground-color)}.mat-mdc-tab-nav-bar.mat-tabs-with-background:not(.mat-primary)>.mat-mdc-tab-link-container .mat-mdc-tab-link:not(.mdc-tab--active) .mdc-tab-indicator__content--underline{border-color:var(--mat-tab-foreground-color)}.mat-mdc-tab-nav-bar.mat-tabs-with-background>.mat-mdc-tab-link-container .mat-mdc-tab-header-pagination-chevron,.mat-mdc-tab-nav-bar.mat-tabs-with-background>.mat-mdc-tab-link-container .mat-focus-indicator::before,.mat-mdc-tab-nav-bar.mat-tabs-with-background>.mat-mdc-tab-header-pagination .mat-mdc-tab-header-pagination-chevron,.mat-mdc-tab-nav-bar.mat-tabs-with-background>.mat-mdc-tab-header-pagination .mat-focus-indicator::before{border-color:var(--mat-tab-foreground-color)}.mat-mdc-tab-nav-bar.mat-tabs-with-background>.mat-mdc-tab-link-container .mat-ripple-element,.mat-mdc-tab-nav-bar.mat-tabs-with-background>.mat-mdc-tab-link-container .mdc-tab__ripple::before,.mat-mdc-tab-nav-bar.mat-tabs-with-background>.mat-mdc-tab-header-pagination .mat-ripple-element,.mat-mdc-tab-nav-bar.mat-tabs-with-background>.mat-mdc-tab-header-pagination .mdc-tab__ripple::before{background-color:var(--mat-tab-foreground-color)}.mat-mdc-tab-nav-bar.mat-tabs-with-background>.mat-mdc-tab-link-container .mat-mdc-tab-header-pagination-chevron,.mat-mdc-tab-nav-bar.mat-tabs-with-background>.mat-mdc-tab-header-pagination .mat-mdc-tab-header-pagination-chevron{color:var(--mat-tab-foreground-color)}\n"],
+    dependencies: [{
+      kind: "directive",
+      type: MatRipple,
+      selector: "[mat-ripple], [matRipple]",
+      inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"],
+      exportAs: ["matRipple"]
+    }, {
+      kind: "directive",
+      type: CdkObserveContent,
+      selector: "[cdkObserveContent]",
+      inputs: ["cdkObserveContentDisabled", "debounce"],
+      outputs: ["cdkObserveContent"],
+      exportAs: ["cdkObserveContent"]
+    }],
+    changeDetection: i0.ChangeDetectionStrategy.Eager,
+    encapsulation: i0.ViewEncapsulation.None
+  });
+}
+i0.ɵɵngDeclareClassMetadata({
+  minVersion: "12.0.0",
+  version: "22.0.0-next.1",
+  ngImport: i0,
+  type: MatTabNav,
+  decorators: [{
+    type: Component,
+    args: [{
+      selector: '[mat-tab-nav-bar]',
+      exportAs: 'matTabNavBar, matTabNav',
+      host: {
+        '[attr.role]': '_getRole()',
+        'class': 'mat-mdc-tab-nav-bar mat-mdc-tab-header',
+        '[class.mat-mdc-tab-header-pagination-controls-enabled]': '_showPaginationControls',
+        '[class.mat-mdc-tab-header-rtl]': "_getLayoutDirection() == 'rtl'",
+        '[class.mat-mdc-tab-nav-bar-stretch-tabs]': 'stretchTabs',
+        '[class.mat-primary]': 'color !== "warn" && color !== "accent"',
+        '[class.mat-accent]': 'color === "accent"',
+        '[class.mat-warn]': 'color === "warn"',
+        '[class._mat-animation-noopable]': '_animationsDisabled',
+        '[style.--mat-tab-animation-duration]': 'animationDuration'
+      },
+      encapsulation: ViewEncapsulation.None,
+      changeDetection: ChangeDetectionStrategy.Default,
+      imports: [MatRipple, CdkObserveContent],
+      template: "<!--\n Note that this intentionally uses a `div` instead of a `button`, because it's not part of\n the regular tabs flow and is only here to support mouse users. It should also not be focusable.\n-->\n<div class=\"mat-mdc-tab-header-pagination mat-mdc-tab-header-pagination-before\"\n     #previousPaginator\n     mat-ripple\n     [matRippleDisabled]=\"_disableScrollBefore || disableRipple\"\n     [class.mat-mdc-tab-header-pagination-disabled]=\"_disableScrollBefore\"\n     (click)=\"_handlePaginatorClick('before')\"\n     (mousedown)=\"_handlePaginatorPress('before', $event)\"\n     (touchend)=\"_stopInterval()\">\n  <div class=\"mat-mdc-tab-header-pagination-chevron\"></div>\n</div>\n\n<div class=\"mat-mdc-tab-link-container\" #tabListContainer (keydown)=\"_handleKeydown($event)\">\n  <div class=\"mat-mdc-tab-list\" #tabList (cdkObserveContent)=\"_onContentChanges()\">\n    <div class=\"mat-mdc-tab-links\" #tabListInner>\n      <ng-content></ng-content>\n    </div>\n  </div>\n</div>\n\n<div class=\"mat-mdc-tab-header-pagination mat-mdc-tab-header-pagination-after\"\n     #nextPaginator\n     mat-ripple\n     [matRippleDisabled]=\"_disableScrollAfter || disableRipple\"\n     [class.mat-mdc-tab-header-pagination-disabled]=\"_disableScrollAfter\"\n     (mousedown)=\"_handlePaginatorPress('after', $event)\"\n     (click)=\"_handlePaginatorClick('after')\"\n     (touchend)=\"_stopInterval()\">\n  <div class=\"mat-mdc-tab-header-pagination-chevron\"></div>\n</div>\n",
+      styles: [".mdc-tab{min-width:90px;padding:0 24px;display:flex;flex:1 0 auto;justify-content:center;box-sizing:border-box;border:none;outline:none;text-align:center;white-space:nowrap;cursor:pointer;z-index:1;touch-action:manipulation}.mdc-tab__content{display:flex;align-items:center;justify-content:center;height:inherit;pointer-events:none}.mdc-tab__text-label{transition:150ms color linear;display:inline-block;line-height:1;z-index:2}.mdc-tab--active .mdc-tab__text-label{transition-delay:100ms}._mat-animation-noopable .mdc-tab__text-label{transition:none}.mdc-tab-indicator{display:flex;position:absolute;top:0;left:0;justify-content:center;width:100%;height:100%;pointer-events:none;z-index:1}.mdc-tab-indicator__content{transition:var(--mat-tab-animation-duration, 250ms) transform cubic-bezier(0.4, 0, 0.2, 1);transform-origin:left;opacity:0}.mdc-tab-indicator__content--underline{align-self:flex-end;box-sizing:border-box;width:100%;border-top-style:solid}.mdc-tab-indicator--active .mdc-tab-indicator__content{opacity:1}._mat-animation-noopable .mdc-tab-indicator__content,.mdc-tab-indicator--no-transition .mdc-tab-indicator__content{transition:none}.mat-mdc-tab-ripple.mat-mdc-tab-ripple{position:absolute;top:0;left:0;bottom:0;right:0;pointer-events:none}.mat-mdc-tab-header{display:flex;overflow:hidden;position:relative;flex-shrink:0}.mdc-tab-indicator .mdc-tab-indicator__content{transition-duration:var(--mat-tab-animation-duration, 250ms)}.mat-mdc-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;outline:0}.mat-mdc-tab-header-pagination::-moz-focus-inner{border:0}.mat-mdc-tab-header-pagination .mat-ripple-element{opacity:.12;background-color:var(--mat-tab-inactive-ripple-color, var(--mat-sys-on-surface))}.mat-mdc-tab-header-pagination-controls-enabled .mat-mdc-tab-header-pagination{display:flex}.mat-mdc-tab-header-pagination-before,.mat-mdc-tab-header-rtl .mat-mdc-tab-header-pagination-after{padding-left:4px}.mat-mdc-tab-header-pagination-before .mat-mdc-tab-header-pagination-chevron,.mat-mdc-tab-header-rtl .mat-mdc-tab-header-pagination-after .mat-mdc-tab-header-pagination-chevron{transform:rotate(-135deg)}.mat-mdc-tab-header-rtl .mat-mdc-tab-header-pagination-before,.mat-mdc-tab-header-pagination-after{padding-right:4px}.mat-mdc-tab-header-rtl .mat-mdc-tab-header-pagination-before .mat-mdc-tab-header-pagination-chevron,.mat-mdc-tab-header-pagination-after .mat-mdc-tab-header-pagination-chevron{transform:rotate(45deg)}.mat-mdc-tab-header-pagination-chevron{border-style:solid;border-width:2px 2px 0 0;height:8px;width:8px;border-color:var(--mat-tab-pagination-icon-color, var(--mat-sys-on-surface))}.mat-mdc-tab-header-pagination-disabled{box-shadow:none;cursor:default;pointer-events:none}.mat-mdc-tab-header-pagination-disabled .mat-mdc-tab-header-pagination-chevron{opacity:.4}.mat-mdc-tab-list{flex-grow:1;position:relative;transition:transform 500ms cubic-bezier(0.35, 0, 0.25, 1)}._mat-animation-noopable .mat-mdc-tab-list{transition:none}.mat-mdc-tab-links{display:flex;flex:1 0 auto}[mat-align-tabs=center]>.mat-mdc-tab-link-container .mat-mdc-tab-links{justify-content:center}[mat-align-tabs=end]>.mat-mdc-tab-link-container .mat-mdc-tab-links{justify-content:flex-end}.cdk-drop-list .mat-mdc-tab-links,.mat-mdc-tab-links.cdk-drop-list{min-height:var(--mat-tab-container-height, 48px)}.mat-mdc-tab-link-container{display:flex;flex-grow:1;overflow:hidden;z-index:1;border-bottom-style:solid;border-bottom-width:var(--mat-tab-divider-height, 1px);border-bottom-color:var(--mat-tab-divider-color, var(--mat-sys-surface-variant))}.mat-mdc-tab-nav-bar.mat-tabs-with-background>.mat-mdc-tab-link-container,.mat-mdc-tab-nav-bar.mat-tabs-with-background>.mat-mdc-tab-header-pagination{background-color:var(--mat-tab-background-color)}.mat-mdc-tab-nav-bar.mat-tabs-with-background.mat-primary>.mat-mdc-tab-link-container .mat-mdc-tab-link .mdc-tab__text-label{color:var(--mat-tab-foreground-color)}.mat-mdc-tab-nav-bar.mat-tabs-with-background.mat-primary>.mat-mdc-tab-link-container .mdc-tab-indicator__content--underline{border-color:var(--mat-tab-foreground-color)}.mat-mdc-tab-nav-bar.mat-tabs-with-background:not(.mat-primary)>.mat-mdc-tab-link-container .mat-mdc-tab-link:not(.mdc-tab--active) .mdc-tab__text-label{color:var(--mat-tab-foreground-color)}.mat-mdc-tab-nav-bar.mat-tabs-with-background:not(.mat-primary)>.mat-mdc-tab-link-container .mat-mdc-tab-link:not(.mdc-tab--active) .mdc-tab-indicator__content--underline{border-color:var(--mat-tab-foreground-color)}.mat-mdc-tab-nav-bar.mat-tabs-with-background>.mat-mdc-tab-link-container .mat-mdc-tab-header-pagination-chevron,.mat-mdc-tab-nav-bar.mat-tabs-with-background>.mat-mdc-tab-link-container .mat-focus-indicator::before,.mat-mdc-tab-nav-bar.mat-tabs-with-background>.mat-mdc-tab-header-pagination .mat-mdc-tab-header-pagination-chevron,.mat-mdc-tab-nav-bar.mat-tabs-with-background>.mat-mdc-tab-header-pagination .mat-focus-indicator::before{border-color:var(--mat-tab-foreground-color)}.mat-mdc-tab-nav-bar.mat-tabs-with-background>.mat-mdc-tab-link-container .mat-ripple-element,.mat-mdc-tab-nav-bar.mat-tabs-with-background>.mat-mdc-tab-link-container .mdc-tab__ripple::before,.mat-mdc-tab-nav-bar.mat-tabs-with-background>.mat-mdc-tab-header-pagination .mat-ripple-element,.mat-mdc-tab-nav-bar.mat-tabs-with-background>.mat-mdc-tab-header-pagination .mdc-tab__ripple::before{background-color:var(--mat-tab-foreground-color)}.mat-mdc-tab-nav-bar.mat-tabs-with-background>.mat-mdc-tab-link-container .mat-mdc-tab-header-pagination-chevron,.mat-mdc-tab-nav-bar.mat-tabs-with-background>.mat-mdc-tab-header-pagination .mat-mdc-tab-header-pagination-chevron{color:var(--mat-tab-foreground-color)}\n"]
+    }]
+  }],
+  ctorParameters: () => [],
+  propDecorators: {
+    fitInkBarToContent: [{
+      type: Input,
+      args: [{
+        transform: booleanAttribute
+      }]
+    }],
+    stretchTabs: [{
+      type: Input,
+      args: [{
+        alias: 'mat-stretch-tabs',
+        transform: booleanAttribute
+      }]
+    }],
+    animationDuration: [{
+      type: Input
+    }],
+    _items: [{
+      type: ContentChildren,
+      args: [forwardRef(() => MatTabLink), {
+        descendants: true
+      }]
+    }],
+    backgroundColor: [{
+      type: Input
+    }],
+    disableRipple: [{
+      type: Input,
+      args: [{
+        transform: booleanAttribute
+      }]
+    }],
+    color: [{
+      type: Input
+    }],
+    tabPanel: [{
+      type: Input
+    }],
+    _tabListContainer: [{
+      type: ViewChild,
+      args: ['tabListContainer', {
+        static: true
+      }]
+    }],
+    _tabList: [{
+      type: ViewChild,
+      args: ['tabList', {
+        static: true
+      }]
+    }],
+    _tabListInner: [{
+      type: ViewChild,
+      args: ['tabListInner', {
+        static: true
+      }]
+    }],
+    _nextPaginator: [{
+      type: ViewChild,
+      args: ['nextPaginator']
+    }],
+    _previousPaginator: [{
+      type: ViewChild,
+      args: ['previousPaginator']
+    }]
+  }
+});
+class MatTabLink extends InkBarItem {
+  _tabNavBar = inject(MatTabNav);
+  elementRef = inject(ElementRef);
+  _focusMonitor = inject(FocusMonitor);
+  _destroyed = new Subject();
+  _isActive = false;
+  _tabIndex = computed(() => this._tabNavBar._focusedItem() === this ? this.tabIndex : -1, ...(ngDevMode ? [{
+    debugName: "_tabIndex"
+  }] : []));
+  get active() {
+    return this._isActive;
+  }
+  set active(value) {
+    if (value !== this._isActive) {
+      this._isActive = value;
+      this._tabNavBar.updateActiveLink();
+    }
+  }
+  disabled = false;
+  get disableRipple() {
+    return this._disableRipple();
+  }
+  set disableRipple(value) {
+    this._disableRipple.set(value);
+  }
+  _disableRipple = signal(false, ...(ngDevMode ? [{
+    debugName: "_disableRipple"
+  }] : []));
+  tabIndex = 0;
+  rippleConfig;
+  get rippleDisabled() {
+    return this.disabled || this.disableRipple || this._tabNavBar.disableRipple || !!this.rippleConfig.disabled;
+  }
+  id = inject(_IdGenerator).getId('mat-tab-link-');
+  constructor() {
+    super();
+    inject(_CdkPrivateStyleLoader).load(_StructuralStylesLoader);
+    const globalRippleOptions = inject(MAT_RIPPLE_GLOBAL_OPTIONS, {
+      optional: true
+    });
+    const tabIndex = inject(new HostAttributeToken('tabindex'), {
+      optional: true
+    });
+    this.rippleConfig = globalRippleOptions || {};
+    this.tabIndex = tabIndex == null ? 0 : parseInt(tabIndex) || 0;
+    if (_animationsDisabled()) {
+      this.rippleConfig.animation = {
+        enterDuration: 0,
+        exitDuration: 0
+      };
+    }
+    this._tabNavBar._fitInkBarToContent.pipe(takeUntil(this._destroyed)).subscribe(fitInkBarToContent => {
+      this.fitInkBarToContent = fitInkBarToContent;
+    });
+  }
+  focus() {
+    this.elementRef.nativeElement.focus();
+  }
+  ngAfterViewInit() {
+    this._focusMonitor.monitor(this.elementRef);
+  }
+  ngOnDestroy() {
+    this._destroyed.next();
+    this._destroyed.complete();
+    super.ngOnDestroy();
+    this._focusMonitor.stopMonitoring(this.elementRef);
+  }
+  _handleFocus() {
+    this._tabNavBar.focusIndex = this._tabNavBar._items.toArray().indexOf(this);
+  }
+  _handleKeydown(event) {
+    if (event.keyCode === SPACE || event.keyCode === ENTER) {
+      if (this.disabled) {
+        event.preventDefault();
+      } else if (this._tabNavBar.tabPanel) {
+        if (event.keyCode === SPACE) {
+          event.preventDefault();
+        }
+        this.elementRef.nativeElement.click();
+      }
+    }
+  }
+  _getAriaControls() {
+    return this._tabNavBar.tabPanel ? this._tabNavBar.tabPanel?.id : this.elementRef.nativeElement.getAttribute('aria-controls');
+  }
+  _getAriaSelected() {
+    if (this._tabNavBar.tabPanel) {
+      return this.active ? 'true' : 'false';
+    } else {
+      return this.elementRef.nativeElement.getAttribute('aria-selected');
+    }
+  }
+  _getAriaCurrent() {
+    return this.active && !this._tabNavBar.tabPanel ? 'page' : null;
+  }
+  _getRole() {
+    return this._tabNavBar.tabPanel ? 'tab' : this.elementRef.nativeElement.getAttribute('role');
+  }
+  static ɵfac = i0.ɵɵngDeclareFactory({
+    minVersion: "12.0.0",
+    version: "22.0.0-next.1",
+    ngImport: i0,
+    type: MatTabLink,
+    deps: [],
+    target: i0.ɵɵFactoryTarget.Component
+  });
+  static ɵcmp = i0.ɵɵngDeclareComponent({
+    minVersion: "16.1.0",
+    version: "22.0.0-next.1",
+    type: MatTabLink,
+    isStandalone: true,
+    selector: "[mat-tab-link], [matTabLink]",
+    inputs: {
+      active: ["active", "active", booleanAttribute],
+      disabled: ["disabled", "disabled", booleanAttribute],
+      disableRipple: ["disableRipple", "disableRipple", booleanAttribute],
+      tabIndex: ["tabIndex", "tabIndex", value => value == null ? 0 : numberAttribute(value)],
+      id: "id"
+    },
+    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": "_tabIndex()",
+        "attr.role": "_getRole()",
+        "class.mat-mdc-tab-disabled": "disabled",
+        "class.mdc-tab--active": "active"
+      },
+      classAttribute: "mdc-tab mat-mdc-tab-link mat-focus-indicator"
+    },
+    exportAs: ["matTabLink"],
+    usesInheritance: true,
+    ngImport: i0,
+    template: "<span class=\"mdc-tab__ripple\"></span>\n\n<div\n  class=\"mat-mdc-tab-ripple\"\n  mat-ripple\n  [matRippleTrigger]=\"elementRef.nativeElement\"\n  [matRippleDisabled]=\"rippleDisabled\"></div>\n\n<span class=\"mdc-tab__content\">\n  <span class=\"mdc-tab__text-label\">\n    <ng-content></ng-content>\n  </span>\n</span>\n\n",
+    styles: [".mat-mdc-tab-link{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-decoration:none;background:none;height:var(--mat-tab-container-height, 48px);font-family:var(--mat-tab-label-text-font, var(--mat-sys-title-small-font));font-size:var(--mat-tab-label-text-size, var(--mat-sys-title-small-size));letter-spacing:var(--mat-tab-label-text-tracking, var(--mat-sys-title-small-tracking));line-height:var(--mat-tab-label-text-line-height, var(--mat-sys-title-small-line-height));font-weight:var(--mat-tab-label-text-weight, var(--mat-sys-title-small-weight))}.mat-mdc-tab-link.mdc-tab{flex-grow:0}.mat-mdc-tab-link .mdc-tab-indicator__content--underline{border-color:var(--mat-tab-active-indicator-color, var(--mat-sys-primary));border-top-width:var(--mat-tab-active-indicator-height, 2px);border-radius:var(--mat-tab-active-indicator-shape, 0)}.mat-mdc-tab-link:hover .mdc-tab__text-label{color:var(--mat-tab-inactive-hover-label-text-color, var(--mat-sys-on-surface))}.mat-mdc-tab-link:focus .mdc-tab__text-label{color:var(--mat-tab-inactive-focus-label-text-color, var(--mat-sys-on-surface))}.mat-mdc-tab-link.mdc-tab--active .mdc-tab__text-label{color:var(--mat-tab-active-label-text-color, var(--mat-sys-on-surface))}.mat-mdc-tab-link.mdc-tab--active .mdc-tab__ripple::before,.mat-mdc-tab-link.mdc-tab--active .mat-ripple-element{background-color:var(--mat-tab-active-ripple-color, var(--mat-sys-on-surface))}.mat-mdc-tab-link.mdc-tab--active:hover .mdc-tab__text-label{color:var(--mat-tab-active-hover-label-text-color, var(--mat-sys-on-surface))}.mat-mdc-tab-link.mdc-tab--active:hover .mdc-tab-indicator__content--underline{border-color:var(--mat-tab-active-hover-indicator-color, var(--mat-sys-primary))}.mat-mdc-tab-link.mdc-tab--active:focus .mdc-tab__text-label{color:var(--mat-tab-active-focus-label-text-color, var(--mat-sys-on-surface))}.mat-mdc-tab-link.mdc-tab--active:focus .mdc-tab-indicator__content--underline{border-color:var(--mat-tab-active-focus-indicator-color, var(--mat-sys-primary))}.mat-mdc-tab-link.mat-mdc-tab-disabled{opacity:.4;pointer-events:none}.mat-mdc-tab-link.mat-mdc-tab-disabled .mdc-tab__content{pointer-events:none}.mat-mdc-tab-link.mat-mdc-tab-disabled .mdc-tab__ripple::before,.mat-mdc-tab-link.mat-mdc-tab-disabled .mat-ripple-element{background-color:var(--mat-tab-disabled-ripple-color, var(--mat-sys-on-surface-variant))}.mat-mdc-tab-link .mdc-tab__ripple::before{content:\"\";display:block;position:absolute;top:0;left:0;right:0;bottom:0;opacity:0;pointer-events:none;background-color:var(--mat-tab-inactive-ripple-color, var(--mat-sys-on-surface))}.mat-mdc-tab-link .mdc-tab__text-label{color:var(--mat-tab-inactive-label-text-color, var(--mat-sys-on-surface));display:inline-flex;align-items:center}.mat-mdc-tab-link .mdc-tab__content{position:relative;pointer-events:auto}.mat-mdc-tab-link:hover .mdc-tab__ripple::before{opacity:.04}.mat-mdc-tab-link.cdk-program-focused .mdc-tab__ripple::before,.mat-mdc-tab-link.cdk-keyboard-focused .mdc-tab__ripple::before{opacity:.12}.mat-mdc-tab-link .mat-ripple-element{opacity:.12;background-color:var(--mat-tab-inactive-ripple-color, var(--mat-sys-on-surface))}.mat-mdc-tab-header.mat-mdc-tab-nav-bar-stretch-tabs .mat-mdc-tab-link{flex-grow:1}.mat-mdc-tab-link::before{margin:5px}@media(max-width: 599px){.mat-mdc-tab-link{min-width:72px}}\n"],
+    dependencies: [{
+      kind: "directive",
+      type: MatRipple,
+      selector: "[mat-ripple], [matRipple]",
+      inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"],
+      exportAs: ["matRipple"]
+    }],
+    changeDetection: i0.ChangeDetectionStrategy.OnPush,
+    encapsulation: i0.ViewEncapsulation.None
+  });
+}
+i0.ɵɵngDeclareClassMetadata({
+  minVersion: "12.0.0",
+  version: "22.0.0-next.1",
+  ngImport: i0,
+  type: MatTabLink,
+  decorators: [{
+    type: Component,
+    args: [{
+      selector: '[mat-tab-link], [matTabLink]',
+      exportAs: 'matTabLink',
+      changeDetection: ChangeDetectionStrategy.OnPush,
+      encapsulation: ViewEncapsulation.None,
+      host: {
+        'class': 'mdc-tab mat-mdc-tab-link mat-focus-indicator',
+        '[attr.aria-controls]': '_getAriaControls()',
+        '[attr.aria-current]': '_getAriaCurrent()',
+        '[attr.aria-disabled]': 'disabled',
+        '[attr.aria-selected]': '_getAriaSelected()',
+        '[attr.id]': 'id',
+        '[attr.tabIndex]': '_tabIndex()',
+        '[attr.role]': '_getRole()',
+        '[class.mat-mdc-tab-disabled]': 'disabled',
+        '[class.mdc-tab--active]': 'active',
+        '(focus)': '_handleFocus()',
+        '(keydown)': '_handleKeydown($event)'
+      },
+      imports: [MatRipple],
+      template: "<span class=\"mdc-tab__ripple\"></span>\n\n<div\n  class=\"mat-mdc-tab-ripple\"\n  mat-ripple\n  [matRippleTrigger]=\"elementRef.nativeElement\"\n  [matRippleDisabled]=\"rippleDisabled\"></div>\n\n<span class=\"mdc-tab__content\">\n  <span class=\"mdc-tab__text-label\">\n    <ng-content></ng-content>\n  </span>\n</span>\n\n",
+      styles: [".mat-mdc-tab-link{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-decoration:none;background:none;height:var(--mat-tab-container-height, 48px);font-family:var(--mat-tab-label-text-font, var(--mat-sys-title-small-font));font-size:var(--mat-tab-label-text-size, var(--mat-sys-title-small-size));letter-spacing:var(--mat-tab-label-text-tracking, var(--mat-sys-title-small-tracking));line-height:var(--mat-tab-label-text-line-height, var(--mat-sys-title-small-line-height));font-weight:var(--mat-tab-label-text-weight, var(--mat-sys-title-small-weight))}.mat-mdc-tab-link.mdc-tab{flex-grow:0}.mat-mdc-tab-link .mdc-tab-indicator__content--underline{border-color:var(--mat-tab-active-indicator-color, var(--mat-sys-primary));border-top-width:var(--mat-tab-active-indicator-height, 2px);border-radius:var(--mat-tab-active-indicator-shape, 0)}.mat-mdc-tab-link:hover .mdc-tab__text-label{color:var(--mat-tab-inactive-hover-label-text-color, var(--mat-sys-on-surface))}.mat-mdc-tab-link:focus .mdc-tab__text-label{color:var(--mat-tab-inactive-focus-label-text-color, var(--mat-sys-on-surface))}.mat-mdc-tab-link.mdc-tab--active .mdc-tab__text-label{color:var(--mat-tab-active-label-text-color, var(--mat-sys-on-surface))}.mat-mdc-tab-link.mdc-tab--active .mdc-tab__ripple::before,.mat-mdc-tab-link.mdc-tab--active .mat-ripple-element{background-color:var(--mat-tab-active-ripple-color, var(--mat-sys-on-surface))}.mat-mdc-tab-link.mdc-tab--active:hover .mdc-tab__text-label{color:var(--mat-tab-active-hover-label-text-color, var(--mat-sys-on-surface))}.mat-mdc-tab-link.mdc-tab--active:hover .mdc-tab-indicator__content--underline{border-color:var(--mat-tab-active-hover-indicator-color, var(--mat-sys-primary))}.mat-mdc-tab-link.mdc-tab--active:focus .mdc-tab__text-label{color:var(--mat-tab-active-focus-label-text-color, var(--mat-sys-on-surface))}.mat-mdc-tab-link.mdc-tab--active:focus .mdc-tab-indicator__content--underline{border-color:var(--mat-tab-active-focus-indicator-color, var(--mat-sys-primary))}.mat-mdc-tab-link.mat-mdc-tab-disabled{opacity:.4;pointer-events:none}.mat-mdc-tab-link.mat-mdc-tab-disabled .mdc-tab__content{pointer-events:none}.mat-mdc-tab-link.mat-mdc-tab-disabled .mdc-tab__ripple::before,.mat-mdc-tab-link.mat-mdc-tab-disabled .mat-ripple-element{background-color:var(--mat-tab-disabled-ripple-color, var(--mat-sys-on-surface-variant))}.mat-mdc-tab-link .mdc-tab__ripple::before{content:\"\";display:block;position:absolute;top:0;left:0;right:0;bottom:0;opacity:0;pointer-events:none;background-color:var(--mat-tab-inactive-ripple-color, var(--mat-sys-on-surface))}.mat-mdc-tab-link .mdc-tab__text-label{color:var(--mat-tab-inactive-label-text-color, var(--mat-sys-on-surface));display:inline-flex;align-items:center}.mat-mdc-tab-link .mdc-tab__content{position:relative;pointer-events:auto}.mat-mdc-tab-link:hover .mdc-tab__ripple::before{opacity:.04}.mat-mdc-tab-link.cdk-program-focused .mdc-tab__ripple::before,.mat-mdc-tab-link.cdk-keyboard-focused .mdc-tab__ripple::before{opacity:.12}.mat-mdc-tab-link .mat-ripple-element{opacity:.12;background-color:var(--mat-tab-inactive-ripple-color, var(--mat-sys-on-surface))}.mat-mdc-tab-header.mat-mdc-tab-nav-bar-stretch-tabs .mat-mdc-tab-link{flex-grow:1}.mat-mdc-tab-link::before{margin:5px}@media(max-width: 599px){.mat-mdc-tab-link{min-width:72px}}\n"]
+    }]
+  }],
+  ctorParameters: () => [],
+  propDecorators: {
+    active: [{
+      type: Input,
+      args: [{
+        transform: booleanAttribute
+      }]
+    }],
+    disabled: [{
+      type: Input,
+      args: [{
+        transform: booleanAttribute
+      }]
+    }],
+    disableRipple: [{
+      type: Input,
+      args: [{
+        transform: booleanAttribute
+      }]
+    }],
+    tabIndex: [{
+      type: Input,
+      args: [{
+        transform: value => value == null ? 0 : numberAttribute(value)
+      }]
+    }],
+    id: [{
+      type: Input
+    }]
+  }
+});
+class MatTabNavPanel {
+  id = inject(_IdGenerator).getId('mat-tab-nav-panel-');
+  _activeTabId;
+  static ɵfac = i0.ɵɵngDeclareFactory({
+    minVersion: "12.0.0",
+    version: "22.0.0-next.1",
+    ngImport: i0,
+    type: MatTabNavPanel,
+    deps: [],
+    target: i0.ɵɵFactoryTarget.Component
+  });
+  static ɵcmp = i0.ɵɵngDeclareComponent({
+    minVersion: "14.0.0",
+    version: "22.0.0-next.1",
+    type: MatTabNavPanel,
+    isStandalone: true,
+    selector: "mat-tab-nav-panel",
+    inputs: {
+      id: "id"
+    },
+    host: {
+      attributes: {
+        "role": "tabpanel"
+      },
+      properties: {
+        "attr.aria-labelledby": "_activeTabId",
+        "attr.id": "id"
+      },
+      classAttribute: "mat-mdc-tab-nav-panel"
+    },
+    exportAs: ["matTabNavPanel"],
+    ngImport: i0,
+    template: '<ng-content></ng-content>',
+    isInline: true,
+    changeDetection: i0.ChangeDetectionStrategy.OnPush,
+    encapsulation: i0.ViewEncapsulation.None
+  });
+}
+i0.ɵɵngDeclareClassMetadata({
+  minVersion: "12.0.0",
+  version: "22.0.0-next.1",
+  ngImport: i0,
+  type: MatTabNavPanel,
+  decorators: [{
+    type: Component,
+    args: [{
+      selector: 'mat-tab-nav-panel',
+      exportAs: 'matTabNavPanel',
+      template: '<ng-content></ng-content>',
+      host: {
+        '[attr.aria-labelledby]': '_activeTabId',
+        '[attr.id]': 'id',
+        'class': 'mat-mdc-tab-nav-panel',
+        'role': 'tabpanel'
+      },
+      encapsulation: ViewEncapsulation.None,
+      changeDetection: ChangeDetectionStrategy.OnPush
+    }]
+  }],
+  propDecorators: {
+    id: [{
+      type: Input
+    }]
+  }
+});
+
+class MatTabsModule {
+  static ɵfac = i0.ɵɵngDeclareFactory({
+    minVersion: "12.0.0",
+    version: "22.0.0-next.1",
+    ngImport: i0,
+    type: MatTabsModule,
+    deps: [],
+    target: i0.ɵɵFactoryTarget.NgModule
+  });
+  static ɵmod = i0.ɵɵngDeclareNgModule({
+    minVersion: "14.0.0",
+    version: "22.0.0-next.1",
+    ngImport: i0,
+    type: MatTabsModule,
+    imports: [MatTabContent, MatTabLabel, MatTab, MatTabGroup, MatTabNav, MatTabNavPanel, MatTabLink],
+    exports: [BidiModule, MatTabContent, MatTabLabel, MatTab, MatTabGroup, MatTabNav, MatTabNavPanel, MatTabLink]
+  });
+  static ɵinj = i0.ɵɵngDeclareInjector({
+    minVersion: "12.0.0",
+    version: "22.0.0-next.1",
+    ngImport: i0,
+    type: MatTabsModule,
+    imports: [BidiModule]
+  });
+}
+i0.ɵɵngDeclareClassMetadata({
+  minVersion: "12.0.0",
+  version: "22.0.0-next.1",
+  ngImport: i0,
+  type: MatTabsModule,
+  decorators: [{
+    type: NgModule,
+    args: [{
+      imports: [MatTabContent, MatTabLabel, MatTab, MatTabGroup, MatTabNav, MatTabNavPanel, MatTabLink],
+      exports: [BidiModule, MatTabContent, MatTabLabel, MatTab, MatTabGroup, MatTabNav, MatTabNavPanel, MatTabLink]
+    }]
+  }]
+});
+
+export { MAT_TAB, MAT_TABS_CONFIG, MAT_TAB_CONTENT, MAT_TAB_GROUP, MAT_TAB_LABEL, MatInkBar, MatPaginatedTabHeader, MatTab, MatTabBody, MatTabBodyPortal, MatTabChangeEvent, MatTabContent, MatTabGroup, MatTabHeader, MatTabLabel, MatTabLabelWrapper, MatTabLink, MatTabNav, MatTabNavPanel, MatTabsModule, _MAT_INK_BAR_POSITIONER };
+//# sourceMappingURL=tabs.mjs.map