@kms-ngx-ui/presentational 20.4.4 → 20.8.0

package/fesm2022/kms-ngx-ui-presentational.mjs

@@ -1,7 +1,7 @@
 import * as i0 from '@angular/core';
-import { Component, Pipe, NgModule, EventEmitter, Output, Input, Directive, HostListener, PLATFORM_ID, DOCUMENT, Inject, Injectable, input, VERSION, forwardRef, InjectionToken, inject, Injector, ViewChild, computed, HostBinding, output, signal, effect, ChangeDetectionStrategy, model, ChangeDetectorRef, ViewContainerRef, untracked, DestroyRef, ElementRef, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
+import { Component, Pipe, NgModule, EventEmitter, Output, Input, Directive, HostListener, PLATFORM_ID, DOCUMENT, Inject, Injectable, input, VERSION, forwardRef, InjectionToken, inject, Injector, ViewChild, computed, HostBinding, output, signal, effect, ChangeDetectionStrategy, model, ChangeDetectorRef, ViewContainerRef, untracked, DestroyRef, ElementRef, ContentChildren, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
 import * as i1 from '@angular/common';
-import { CommonModule, CurrencyPipe, isPlatformBrowser, NgClass, NgStyle } from '@angular/common';
+import { CommonModule, CurrencyPipe, isPlatformBrowser, NgClass, NgStyle, NgTemplateOutlet } from '@angular/common';
 import * as i2 from '@angular/forms';
 import { FormControl, NG_VALUE_ACCESSOR, NgControl, UntypedFormGroup, UntypedFormControl, FormGroup, ReactiveFormsModule, NG_VALIDATORS, ValueChangeEvent, FormsModule } from '@angular/forms';
 import * as i1$2 from '@angular/material/checkbox';
@@ -56,6 +56,8 @@ import { trigger, state, style } from '@angular/animations';
 import { register } from 'swiper/element/bundle';
 import { isEmpty } from 'lodash';
 import moment from 'moment';
+import * as i1$a from '@angular/material/tabs';
+import { MatTabsModule } from '@angular/material/tabs';
 
 class KmsUiPresentationalComponent {
     constructor() { }
@@ -1443,7 +1445,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
 class CheckboxComponent {
     constructor() {
         this.infoText = '';
-        this.disabled = false;
+        this._disabled = false;
         /**
          * Internal description name. All checkboxes with the same name belong to the same group.
          * User can select none, one or all checkboxes with the same name.
@@ -1460,6 +1462,13 @@ class CheckboxComponent {
     get checked() {
         return this.innerControl.value ?? false;
     }
+    set disabled(value) {
+        this._disabled = value;
+        this.setDisabledState(value);
+    }
+    get disabled() {
+        return this._disabled;
+    }
     valueChanged(value) {
         this.onChange(value);
         this.innerControl.setValue(value, { emitEvent: false });
@@ -2267,6 +2276,63 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
             args: [{ selector: 'kms-button', standalone: false, template: "<!-- Basic -->\n@if (appearance() == ButtonAppearance.BASIC) {\n<button\n  mat-button\n  [color]=\"color()\"\n  class=\"kms-button\"\n  [ngClass]=\"{\n    'kms-button--loading': loading(),\n    'kms-button--basic-primary': color() === StylingTheme.PRIMARY,\n    'kms-button--basic-accent': color() === StylingTheme.SECONDARY,\n    'kms-button--basic-warn': color() === StylingTheme.WARN,\n    'kms-button--rounded': rounded()\n  }\"\n  [disabled]=\"disabled() || loading()\"\n  (click)=\"buttonClick.emit($event)\"\n  [type]=\"type()\"\n  (keyup)=\"\n    ($event.key === 'Enter' || $event.key === 'Space') &&\n      buttonClick.emit($event)\n  \"\n>\n  <ng-container *ngTemplateOutlet=\"buttonTemplate\"></ng-container>\n</button>\n}\n\n<!-- Flat -->\n@else if (appearance() == ButtonAppearance.FLAT) {\n<button\n  mat-flat-button\n  [color]=\"color()\"\n  class=\"kms-button\"\n  [ngClass]=\"{\n    'kms-button--loading': loading(),\n    'kms-button--flat-primary': color() === StylingTheme.PRIMARY,\n    'kms-button--flat-accent': color() === StylingTheme.SECONDARY,\n    'kms-button--flat-warn': color() === StylingTheme.WARN,\n    'kms-button--rounded': rounded()\n  }\"\n  [disabled]=\"disabled() || loading()\"\n  (click)=\"buttonClick.emit($event)\"\n  [type]=\"type()\"\n  (keyup)=\"\n    ($event.key === 'Enter' || $event.key === 'Space') &&\n      buttonClick.emit($event)\n  \"\n>\n  <ng-container *ngTemplateOutlet=\"buttonTemplate\"></ng-container>\n</button>\n}\n\n<!-- Raised -->\n@else if (appearance() == ButtonAppearance.RAISED) {\n<button\n  mat-raised-button\n  [color]=\"color()\"\n  class=\"kms-button\"\n  [ngClass]=\"{\n    'kms-button--loading': loading(),\n    'kms-button--raised-primary': color() === StylingTheme.PRIMARY,\n    'kms-button--raised-accent': color() === StylingTheme.SECONDARY,\n    'kms-button--raised-warn': color() === StylingTheme.WARN,\n    'kms-button--rounded': rounded()\n  }\"\n  [disabled]=\"disabled() || loading()\"\n  (click)=\"buttonClick.emit($event)\"\n  [type]=\"type()\"\n  (keyup)=\"\n    ($event.key === 'Enter' || $event.key === 'Space') &&\n      buttonClick.emit($event)\n  \"\n>\n  <ng-container *ngTemplateOutlet=\"buttonTemplate\"></ng-container>\n</button>\n}\n\n<ng-template #buttonTemplate>\n  @if (loading()) {\n  <mat-spinner class=\"kms-button__spinner\" diameter=\"22\"></mat-spinner>\n  } @if (icon()) {\n  <kms-icon\n    class=\"kms-button__icon\"\n    [color]=\"iconColor()\"\n    [size]=\"IconSize.XXS\"\n    [icon]=\"icon()\"\n  ></kms-icon>\n  }\n  {{ label() }}\n</ng-template>\n" }]
         }], propDecorators: { color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], appearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "appearance", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], buttonClick: [{ type: i0.Output, args: ["buttonClick"] }], rounded: [{ type: i0.Input, args: [{ isSignal: true, alias: "rounded", required: false }] }] } });
 
+class ButtonToggleGroupComponent {
+    constructor() {
+        this.options = [];
+        this.disabled = false;
+        this.rounded = false;
+        this.value = null;
+        this.ButtonAppearance = ButtonAppearance;
+        this.StylingTheme = StylingTheme;
+        this.onChange = (value) => {
+            this.value = value;
+        };
+        this.onTouched = () => { };
+    }
+    writeValue(value) {
+        this.value = value;
+    }
+    registerOnChange(fn) {
+        this.onChange = fn;
+    }
+    registerOnTouched(fn) {
+        this.onTouched = fn;
+    }
+    select(option) {
+        if (this.disabled || option.Disabled)
+            return;
+        this.value = option.Value;
+        this.onChange(option.Value);
+        this.onTouched();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: ButtonToggleGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: ButtonToggleGroupComponent, isStandalone: false, selector: "kms-button-toggle-group", inputs: { options: "options", disabled: "disabled", rounded: "rounded", value: "value" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => ButtonToggleGroupComponent),
+                multi: true,
+            },
+        ], ngImport: i0, template: "<div\n  class=\"kms-button-toggle-group\"\n  [class.kms-button-toggle-group--disabled]=\"disabled\"\n  [class.kms-button-toggle-group--rounded]=\"rounded\"\n>\n  @for (option of options; track option.Value) {\n    <kms-button\n      class=\"kms-button-toggle-group__item\"\n      [class.kms-button-toggle-group__item--active]=\"value === option.Value\"\n      [appearance]=\"ButtonAppearance.BASIC\"\n      [color]=\"StylingTheme.SECONDARY\"\n      [label]=\"option.Text\"\n      [icon]=\"option.Icon\"\n      [disabled]=\"disabled || option.Disabled\"\n      (buttonClick)=\"select(option)\"\n    ></kms-button>\n  }\n</div>\n", styles: [""], dependencies: [{ kind: "component", type: ButtonComponent, selector: "kms-button", inputs: ["color", "type", "appearance", "loading", "label", "icon", "disabled", "rounded"], outputs: ["buttonClick"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: ButtonToggleGroupComponent, decorators: [{
+            type: Component,
+            args: [{ standalone: false, selector: 'kms-button-toggle-group', providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => ButtonToggleGroupComponent),
+                            multi: true,
+                        },
+                    ], template: "<div\n  class=\"kms-button-toggle-group\"\n  [class.kms-button-toggle-group--disabled]=\"disabled\"\n  [class.kms-button-toggle-group--rounded]=\"rounded\"\n>\n  @for (option of options; track option.Value) {\n    <kms-button\n      class=\"kms-button-toggle-group__item\"\n      [class.kms-button-toggle-group__item--active]=\"value === option.Value\"\n      [appearance]=\"ButtonAppearance.BASIC\"\n      [color]=\"StylingTheme.SECONDARY\"\n      [label]=\"option.Text\"\n      [icon]=\"option.Icon\"\n      [disabled]=\"disabled || option.Disabled\"\n      (buttonClick)=\"select(option)\"\n    ></kms-button>\n  }\n</div>\n" }]
+        }], propDecorators: { options: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], rounded: [{
+                type: Input
+            }], value: [{
+                type: Input
+            }] } });
+
 class TooltipIconComponent {
     constructor() {
         this.tooltipText = input('', ...(ngDevMode ? [{ debugName: "tooltipText" }] : []));
@@ -5065,6 +5131,52 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                     ], template: "<form class=\"kms-generic-form\"\n      [class.kms-generic-form--loading]=\"loading()\"\n      [class.kms-generic-form--disabled]=\"disabled()\"\n      [attr.aria-busy]=\"loading() || null\"\n      [attr.aria-disabled]=\"disabled() || null\"\n      (submit)=\"onFormSubmit($event)\"\n      (keydown.enter)=\"onEnterKey($event)\">\n\n  @if (showActionsTop()) {\n    <kms-form-actions\n      [actionsConfig]=\"config().submitAction!\"\n      [disabled]=\"loading()\"\n      (submitClick)=\"submit()\">\n    </kms-form-actions>\n  }\n\n  @for (section of visibleSections(); track section.key) {\n    <kms-form-section\n      [sectionConfig]=\"section\"\n      [formGroup]=\"form()\"\n      [formId]=\"config().formId\"\n      [formErrorDisplay]=\"config().errorDisplay\"\n      [formDisabledConfig]=\"config().disabledConfig\"\n      [submitted]=\"submitted()\">\n    </kms-form-section>\n  }\n\n  @if (showActionsBottom()) {\n    <kms-form-actions\n      [actionsConfig]=\"config().submitAction!\"\n      [disabled]=\"loading()\"\n      (submitClick)=\"submit()\">\n    </kms-form-actions>\n  }\n\n  @if (loading()) {\n    <div class=\"kms-generic-form__loading-overlay\"></div>\n  }\n\n  <output class=\"kms-generic-form__sr-only\" aria-live=\"polite\">\n    {{ errorAnnouncement() }}\n  </output>\n</form>\n", styles: [":host{display:block}.kms-generic-form{position:relative}.kms-generic-form--loading{pointer-events:none}.kms-generic-form__loading-overlay{position:absolute;inset:0;background:#fff9;z-index:1}.kms-generic-form__sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}\n"] }]
         }], ctorParameters: () => [], propDecorators: { config: [{ type: i0.Input, args: [{ isSignal: true, alias: "config", required: true }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], formSubmit: [{ type: i0.Output, args: ["formSubmit"] }], formStateChange: [{ type: i0.Output, args: ["formStateChange"] }], formReady: [{ type: i0.Output, args: ["formReady"] }], fieldValueChange: [{ type: i0.Output, args: ["fieldValueChange"] }] } });
 
+/**
+ * @copyright KMS GmbH
+ */
+class KmsTabContentDirective {
+    constructor(templateRef) {
+        this.templateRef = templateRef;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: KmsTabContentDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.16", type: KmsTabContentDirective, isStandalone: true, selector: "ng-template[kmsTabContent]", ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: KmsTabContentDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'ng-template[kmsTabContent]',
+                    standalone: true,
+                }]
+        }], ctorParameters: () => [{ type: i0.TemplateRef }] });
+class TabGroupComponent {
+    constructor() {
+        /** Tab definitions with label and optional count. When omitted, mat-tab children are projected directly. */
+        this.tabs = input(...(ngDevMode ? [undefined, { debugName: "tabs" }] : []));
+        /** Index of the initially selected tab. */
+        this.selectedIndex = input(0, ...(ngDevMode ? [{ debugName: "selectedIndex" }] : []));
+        /** Emits the new index whenever the user switches tabs. */
+        this.selectedIndexChange = output();
+        /** Whether to disable the Material ripple effect on tabs. */
+        this.disableRipple = input(true, ...(ngDevMode ? [{ debugName: "disableRipple" }] : []));
+        this.contentTemplates = [];
+    }
+    ngAfterContentInit() {
+        this.contentTemplates = this.tabContents.map((d) => d.templateRef);
+    }
+    onTabChange(index) {
+        this.selectedIndexChange.emit(index);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: TabGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: TabGroupComponent, isStandalone: true, selector: "kms-tab-group", inputs: { tabs: { classPropertyName: "tabs", publicName: "tabs", isSignal: true, isRequired: false, transformFunction: null }, selectedIndex: { classPropertyName: "selectedIndex", publicName: "selectedIndex", isSignal: true, isRequired: false, transformFunction: null }, disableRipple: { classPropertyName: "disableRipple", publicName: "disableRipple", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedIndexChange: "selectedIndexChange" }, queries: [{ propertyName: "tabContents", predicate: KmsTabContentDirective }], ngImport: i0, template: "<mat-tab-group\n  mat-align-tabs=\"start\"\n  mat-stretch-tabs=\"false\"\n  [disableRipple]=\"disableRipple()\"\n  [selectedIndex]=\"selectedIndex()\"\n  (selectedIndexChange)=\"onTabChange($event)\"\n>\n  @if (tabs(); as tabDefs) {\n    @for (tab of tabDefs; track tab.label; let i = $index) {\n      <mat-tab>\n        <ng-template mat-tab-label>\n          <span>{{ tab.label }}</span>\n          @if (tab.count !== undefined) {\n            <span class=\"kms-tab-group__count\">({{ tab.count }})</span>\n          }\n        </ng-template>\n        <ng-template matTabContent>\n          @if (contentTemplates[i]) {\n            <ng-container *ngTemplateOutlet=\"contentTemplates[i]\"></ng-container>\n          }\n        </ng-template>\n      </mat-tab>\n    }\n  } @else {\n    <ng-content></ng-content>\n  }\n</mat-tab-group>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: MatTabsModule }, { kind: "directive", type: i1$a.MatTabContent, selector: "[matTabContent]" }, { kind: "directive", type: i1$a.MatTabLabel, selector: "[mat-tab-label], [matTabLabel]" }, { kind: "component", type: i1$a.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby", "labelClass", "bodyClass", "id"], exportAs: ["matTab"] }, { kind: "component", type: i1$a.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "fitInkBarToContent", "mat-stretch-tabs", "mat-align-tabs", "dynamicHeight", "selectedIndex", "headerPosition", "animationDuration", "contentTabIndex", "disablePagination", "disableRipple", "preserveContent", "backgroundColor", "aria-label", "aria-labelledby"], outputs: ["selectedIndexChange", "focusChange", "animationDone", "selectedTabChange"], exportAs: ["matTabGroup"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: TabGroupComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'kms-tab-group', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [MatTabsModule, NgTemplateOutlet], template: "<mat-tab-group\n  mat-align-tabs=\"start\"\n  mat-stretch-tabs=\"false\"\n  [disableRipple]=\"disableRipple()\"\n  [selectedIndex]=\"selectedIndex()\"\n  (selectedIndexChange)=\"onTabChange($event)\"\n>\n  @if (tabs(); as tabDefs) {\n    @for (tab of tabDefs; track tab.label; let i = $index) {\n      <mat-tab>\n        <ng-template mat-tab-label>\n          <span>{{ tab.label }}</span>\n          @if (tab.count !== undefined) {\n            <span class=\"kms-tab-group__count\">({{ tab.count }})</span>\n          }\n        </ng-template>\n        <ng-template matTabContent>\n          @if (contentTemplates[i]) {\n            <ng-container *ngTemplateOutlet=\"contentTemplates[i]\"></ng-container>\n          }\n        </ng-template>\n      </mat-tab>\n    }\n  } @else {\n    <ng-content></ng-content>\n  }\n</mat-tab-group>\n" }]
+        }], propDecorators: { tabs: [{ type: i0.Input, args: [{ isSignal: true, alias: "tabs", required: false }] }], selectedIndex: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedIndex", required: false }] }], selectedIndexChange: [{ type: i0.Output, args: ["selectedIndexChange"] }], disableRipple: [{ type: i0.Input, args: [{ isSignal: true, alias: "disableRipple", required: false }] }], tabContents: [{
+                type: ContentChildren,
+                args: [KmsTabContentDirective]
+            }] } });
+
 class KmsUiPresentationalModule {
     constructor(translate) {
         // Merge all bundled library strings (validator messages, date-input
@@ -5109,6 +5221,7 @@ class KmsUiPresentationalModule {
             SliderComponent,
             CardComponent,
             ButtonComponent,
+            ButtonToggleGroupComponent,
             NumericInputComponent,
             GenericFormComponent,
             FormSectionComponent,
@@ -5144,7 +5257,9 @@ class KmsUiPresentationalModule {
             MatNativeDateModule,
             IconComponent,
             InlineAlertComponent,
-            DateInputComponent], exports: [BackToTopComponent,
+            DateInputComponent,
+            TabGroupComponent,
+            KmsTabContentDirective], exports: [BackToTopComponent,
             CheckboxComponent,
             ColorInputComponent,
             DropdownFromDataComponent,
@@ -5172,13 +5287,16 @@ class KmsUiPresentationalModule {
             SliderComponent,
             CardComponent,
             ButtonComponent,
+            ButtonToggleGroupComponent,
             NumericInputComponent,
             GenericFormComponent,
             FormSectionComponent,
             FormActionsComponent,
             DynamicFieldDirective,
             DateInputComponent,
-            TextInputComponent] }); }
+            TextInputComponent,
+            TabGroupComponent,
+            KmsTabContentDirective] }); }
     static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: KmsUiPresentationalModule, providers: [ViewportService], imports: [CommonModule,
             DragDropModule,
             MatCheckboxModule,
@@ -5206,7 +5324,8 @@ class KmsUiPresentationalModule {
             MatCardModule,
             MatDatepickerModule,
             MatNativeDateModule,
-            DateInputComponent] }); }
+            DateInputComponent,
+            TabGroupComponent] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: KmsUiPresentationalModule, decorators: [{
             type: NgModule,
@@ -5238,6 +5357,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                         SliderComponent,
                         CardComponent,
                         ButtonComponent,
+                        ButtonToggleGroupComponent,
                         NumericInputComponent,
                         GenericFormComponent,
                         FormSectionComponent,
@@ -5277,6 +5397,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                         IconComponent,
                         InlineAlertComponent,
                         DateInputComponent,
+                        TabGroupComponent,
+                        KmsTabContentDirective,
                     ],
                     exports: [
                         BackToTopComponent,
@@ -5307,6 +5429,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                         SliderComponent,
                         CardComponent,
                         ButtonComponent,
+                        ButtonToggleGroupComponent,
                         NumericInputComponent,
                         GenericFormComponent,
                         FormSectionComponent,
@@ -5314,6 +5437,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                         DynamicFieldDirective,
                         DateInputComponent,
                         TextInputComponent,
+                        TabGroupComponent,
+                        KmsTabContentDirective,
                     ],
                     providers: [ViewportService],
                     schemas: [CUSTOM_ELEMENTS_SCHEMA],
@@ -5403,5 +5528,5 @@ var FormLayout;
  * Generated bundle index. Do not edit.
  */
 
-export { BackToTopComponent, Breakpoint, ButtonAppearance, ButtonComponent, ButtonResponseType, CardComponent, CheckboxComponent, Color, ColorInputComponent, ConfirmationDialogComponent, CustomPipesModule, DateInputComponent, DirectivesModule, DropdownFromDataComponent, DynamicFieldDirective, EnumRadiogroupComponent, FieldRegistryService, FieldType, FileInputComponent, FlyoutComponent, FormActionsComponent, FormFieldComponent, FormLayout, FormParentComponent, FormSectionComponent, GenericFormComponent, GenericFormModule, GenericFormService, GetMaxHeightDirective, IconComponent, IconSizePx, IconSizesArr, ImageSliderComponent, ImageSnippet, ImageSourceType, ImageUploadComponent, InlineAlertComponent, IntegerCurrency, KMSAccordionItemComponent, KeyValuePair, KmsUiPresentationalComponent, KmsUiPresentationalModule, KmsUiPresentationalService, LabelValuePair, LoaderComponent, MapComponent, Marker, MarkerLabel, MarkerOptions, NumericInputComponent, PasswordComponent, RadioButtonComponent, RadioButtonSize, RadioGroupComponent, SafeHtmlPipe, SafeResourceUrlPipe, SafeUrlPipe, SalutationDropdownComponent, SalutationEnum, SalutationRadiogroupComponent, SanitizeNullPipe, SimpleBreakpoint, SlideToggleComponent, SliderComponent, StylingTheme, SwipeDirective, TextInputComponent, TextValuePair, TextValuePairArray, TimeDirective, TimeInputComponent, TooltipDirective, TooltipIconComponent, TrimPipe, TypeofPipe, ViewportService, WindowDimensions, YesNoRadiogroupComponent, noSpecialCharsOnly, noWhitespaceOnly };
+export { BackToTopComponent, Breakpoint, ButtonAppearance, ButtonComponent, ButtonResponseType, ButtonToggleGroupComponent, CardComponent, CheckboxComponent, Color, ColorInputComponent, ConfirmationDialogComponent, CustomPipesModule, DateInputComponent, DirectivesModule, DropdownFromDataComponent, DynamicFieldDirective, EnumRadiogroupComponent, FieldRegistryService, FieldType, FileInputComponent, FlyoutComponent, FormActionsComponent, FormFieldComponent, FormLayout, FormParentComponent, FormSectionComponent, GenericFormComponent, GenericFormModule, GenericFormService, GetMaxHeightDirective, IconComponent, IconSizePx, IconSizesArr, ImageSliderComponent, ImageSnippet, ImageSourceType, ImageUploadComponent, InlineAlertComponent, IntegerCurrency, KMSAccordionItemComponent, KeyValuePair, KmsTabContentDirective, KmsUiPresentationalComponent, KmsUiPresentationalModule, KmsUiPresentationalService, LabelValuePair, LoaderComponent, MapComponent, Marker, MarkerLabel, MarkerOptions, NumericInputComponent, PasswordComponent, RadioButtonComponent, RadioButtonSize, RadioGroupComponent, SafeHtmlPipe, SafeResourceUrlPipe, SafeUrlPipe, SalutationDropdownComponent, SalutationEnum, SalutationRadiogroupComponent, SanitizeNullPipe, SimpleBreakpoint, SlideToggleComponent, SliderComponent, StylingTheme, SwipeDirective, TabGroupComponent, TextInputComponent, TextValuePair, TextValuePairArray, TimeDirective, TimeInputComponent, TooltipDirective, TooltipIconComponent, TrimPipe, TypeofPipe, ViewportService, WindowDimensions, YesNoRadiogroupComponent, noSpecialCharsOnly, noWhitespaceOnly };
 //# sourceMappingURL=kms-ngx-ui-presentational.mjs.map