@skyux/tabs 11.0.0-alpha.0 → 11.0.0-alpha.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/documentation.json +393 -393
  2. package/esm2022/lib/modules/tabs/tab-button.component.mjs +1 -1
  3. package/esm2022/lib/modules/tabs/tabset.component.mjs +1 -1
  4. package/esm2022/lib/modules/vertical-tabset/vertical-tab.component.mjs +1 -1
  5. package/esm2022/lib/modules/vertical-tabset/vertical-tabset.component.mjs +2 -2
  6. package/fesm2022/skyux-tabs.mjs +4 -4
  7. package/fesm2022/skyux-tabs.mjs.map +1 -1
  8. package/package.json +10 -10
package/esm2022/lib/modules/tabs/tab-button.component.mjs CHANGED
@@ -126,7 +126,7 @@ export class SkyTabButtonComponent {
126
126
  this.#changeDetectorRef.markForCheck();
127
127
  }
128
128
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: SkyTabButtonComponent, deps: [{ token: i0.ElementRef }, { token: i1.SkyTabButtonAdapterService }, { token: i0.ChangeDetectorRef }, { token: i2.SkyTabsetService }], target: i0.ɵɵFactoryTarget.Component }); }
129
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.5", type: SkyTabButtonComponent, selector: "sky-tab-button", inputs: { active: "active", ariaControls: "ariaControls", buttonHref: "buttonHref", buttonId: "buttonId", buttonText: "buttonText", buttonTextCount: "buttonTextCount", closeable: "closeable", disabled: "disabled", tabIndex: "tabIndex", tabNumber: "tabNumber", totalTabsCount: "totalTabsCount", tabStyle: "tabStyle" }, outputs: { buttonClick: "buttonClick", closeClick: "closeClick" }, providers: [SkyTabButtonAdapterService], ngImport: i0, template: "<div\n class=\"sky-btn-tab-wrapper\"\n [ngClass]=\"{\n 'sky-btn-tab-wrapper-selected': active,\n 'sky-btn-tab-wrapper-disabled': disabled\n }\"\n>\n <a\n #tabButtonEl\n class=\"sky-btn-tab\"\n role=\"tab\"\n [attr.aria-controls]=\"ariaControls\"\n [attr.aria-disabled]=\"disabled\"\n [attr.aria-selected]=\"active\"\n [attr.href]=\"buttonHref\"\n [attr.aria-label]=\"\n tabStyle === 'wizard'\n ? ('skyux_wizard_sr_step_' + wizardStepState\n | skyLibResources: tabNumber : totalTabsCount : buttonText)\n : null\n \"\n [attr.aria-labelledby]=\"tabStyle === 'wizard' ? null : tabHeading.id\"\n [id]=\"buttonId\"\n [ngClass]=\"{\n 'sky-btn-tab-wizard': tabStyle === 'wizard',\n 'sky-btn-tab-selected': active,\n 'sky-btn-tab-disabled': disabled,\n 'sky-tab-btn-closeable': closeable\n }\"\n [tabindex]=\"active ? '0' : '-1'\"\n (click)=\"onButtonClick($event)\"\n (keydown)=\"onTabButtonKeyDown($event)\"\n (focus)=\"onFocus()\"\n >\n <span class=\"sky-tab-heading\" [attr.aria-hidden]=\"true\">\n <span skyId #tabHeading=\"skyId\">\n {{ buttonText }}\n <span\n *ngIf=\"buttonTextCount !== undefined\"\n class=\"sky-tab-header-count\"\n >\n {{ buttonTextCount }}\n </span>\n </span>\n <span\n *ngIf=\"closeable\"\n class=\"sky-btn-tab-close\"\n [tabindex]=\"closeBtnTabIndex\"\n [attr.aria-label]=\"'skyux_tab_close' | skyLibResources: buttonText\"\n [ngClass]=\"{\n 'sky-btn-tab-close-disabled': disabled\n }\"\n (click)=\"onCloseClick($event)\"\n (keydown.enter)=\"onCloseClick($event)\"\n >\n <sky-icon icon=\"remove\" />\n </span>\n </span>\n </a>\n</div>\n", styles: [".sky-btn-tab-wrapper{display:inline-block;position:relative;margin-right:5px}.sky-btn-tab-wrapper .sky-btn-tab-close{position:absolute;top:10px;right:10px;color:#686c73;padding:1px 6px}.sky-btn-tab-wrapper .sky-btn-tab-close:hover{color:#212327;transition:color .15s}.sky-btn-tab-wrapper.sky-btn-tab-wrapper-selected:not(.sky-btn-tab-wrapper-disabled) .sky-btn-tab-close{color:#fff}.sky-btn-tab-wrapper.sky-btn-tab-wrapper-disabled{cursor:not-allowed}.sky-tab-btn-closeable{padding-right:43px}:host-context(.sky-theme-modern) .sky-btn-tab-wrapper{margin-right:10px}:host-context(.sky-theme-modern) .sky-btn-tab-wrapper .sky-btn-tab-close{top:12px;right:10px}:host-context(.sky-theme-modern) .sky-btn-tab-wrapper.sky-btn-tab-wrapper-selected:not(.sky-btn-tab-wrapper-disabled) .sky-btn-tab-close{color:#686c73}:host-context(.sky-theme-modern) .sky-tab-btn-closeable{padding-right:44px}.sky-theme-modern .sky-btn-tab-wrapper{margin-right:10px}.sky-theme-modern .sky-btn-tab-wrapper .sky-btn-tab-close{top:12px;right:10px}.sky-theme-modern .sky-btn-tab-wrapper.sky-btn-tab-wrapper-selected:not(.sky-btn-tab-wrapper-disabled) .sky-btn-tab-close{color:#686c73}.sky-theme-modern .sky-tab-btn-closeable{padding-right:44px}:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-btn-tab-wrapper .sky-btn-tab-close{color:#eeeeef}:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-btn-tab-wrapper.sky-btn-tab-wrapper-selected:not(.sky-btn-tab-wrapper-disabled) .sky-btn-tab-close{color:#eeeeef}.sky-theme-modern.sky-theme-mode-dark .sky-btn-tab-wrapper .sky-btn-tab-close{color:#eeeeef}.sky-theme-modern.sky-theme-mode-dark .sky-btn-tab-wrapper.sky-btn-tab-wrapper-selected:not(.sky-btn-tab-wrapper-disabled) .sky-btn-tab-close{color:#eeeeef}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.λ1, selector: "sky-icon", inputs: ["icon", "iconType", "size", "fixedWidth", "variant"] }, { kind: "directive", type: i5.λ2, selector: "[skyId]", exportAs: ["skyId"] }, { kind: "pipe", type: i6.SkyLibResourcesPipe, name: "skyLibResources" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
129
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.5", type: SkyTabButtonComponent, selector: "sky-tab-button", inputs: { active: "active", ariaControls: "ariaControls", buttonHref: "buttonHref", buttonId: "buttonId", buttonText: "buttonText", buttonTextCount: "buttonTextCount", closeable: "closeable", disabled: "disabled", tabIndex: "tabIndex", tabNumber: "tabNumber", totalTabsCount: "totalTabsCount", tabStyle: "tabStyle" }, outputs: { buttonClick: "buttonClick", closeClick: "closeClick" }, providers: [SkyTabButtonAdapterService], ngImport: i0, template: "<div\n class=\"sky-btn-tab-wrapper\"\n [ngClass]=\"{\n 'sky-btn-tab-wrapper-selected': active,\n 'sky-btn-tab-wrapper-disabled': disabled\n }\"\n>\n <a\n #tabButtonEl\n class=\"sky-btn-tab\"\n role=\"tab\"\n [attr.aria-controls]=\"ariaControls\"\n [attr.aria-disabled]=\"disabled\"\n [attr.aria-selected]=\"active\"\n [attr.href]=\"buttonHref\"\n [attr.aria-label]=\"\n tabStyle === 'wizard'\n ? ('skyux_wizard_sr_step_' + wizardStepState\n | skyLibResources: tabNumber : totalTabsCount : buttonText)\n : null\n \"\n [attr.aria-labelledby]=\"tabStyle === 'wizard' ? null : tabHeading.id\"\n [id]=\"buttonId\"\n [ngClass]=\"{\n 'sky-btn-tab-wizard': tabStyle === 'wizard',\n 'sky-btn-tab-selected': active,\n 'sky-btn-tab-disabled': disabled,\n 'sky-tab-btn-closeable': closeable\n }\"\n [tabindex]=\"active ? '0' : '-1'\"\n (click)=\"onButtonClick($event)\"\n (keydown)=\"onTabButtonKeyDown($event)\"\n (focus)=\"onFocus()\"\n >\n <span class=\"sky-tab-heading\" [attr.aria-hidden]=\"true\">\n <span skyId #tabHeading=\"skyId\">\n {{ buttonText }}\n <span\n *ngIf=\"buttonTextCount !== undefined\"\n class=\"sky-tab-header-count\"\n >\n {{ buttonTextCount }}\n </span>\n </span>\n <span\n *ngIf=\"closeable\"\n class=\"sky-btn-tab-close\"\n [tabindex]=\"closeBtnTabIndex\"\n [attr.aria-label]=\"'skyux_tab_close' | skyLibResources: buttonText\"\n [ngClass]=\"{\n 'sky-btn-tab-close-disabled': disabled\n }\"\n (click)=\"onCloseClick($event)\"\n (keydown.enter)=\"onCloseClick($event)\"\n >\n <sky-icon icon=\"remove\" />\n </span>\n </span>\n </a>\n</div>\n", styles: [".sky-btn-tab-wrapper{display:inline-block;position:relative;margin-right:5px}.sky-btn-tab-wrapper .sky-btn-tab-close{position:absolute;top:10px;right:10px;color:#686c73;padding:1px 6px}.sky-btn-tab-wrapper .sky-btn-tab-close:hover{color:#212327;transition:color .15s}.sky-btn-tab-wrapper.sky-btn-tab-wrapper-selected:not(.sky-btn-tab-wrapper-disabled) .sky-btn-tab-close{color:#fff}.sky-btn-tab-wrapper.sky-btn-tab-wrapper-disabled{cursor:not-allowed}.sky-tab-btn-closeable{padding-right:43px}:host-context(.sky-theme-modern) .sky-btn-tab-wrapper{margin-right:10px}:host-context(.sky-theme-modern) .sky-btn-tab-wrapper .sky-btn-tab-close{top:12px;right:10px}:host-context(.sky-theme-modern) .sky-btn-tab-wrapper.sky-btn-tab-wrapper-selected:not(.sky-btn-tab-wrapper-disabled) .sky-btn-tab-close{color:#686c73}:host-context(.sky-theme-modern) .sky-tab-btn-closeable{padding-right:44px}.sky-theme-modern .sky-btn-tab-wrapper{margin-right:10px}.sky-theme-modern .sky-btn-tab-wrapper .sky-btn-tab-close{top:12px;right:10px}.sky-theme-modern .sky-btn-tab-wrapper.sky-btn-tab-wrapper-selected:not(.sky-btn-tab-wrapper-disabled) .sky-btn-tab-close{color:#686c73}.sky-theme-modern .sky-tab-btn-closeable{padding-right:44px}:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-btn-tab-wrapper .sky-btn-tab-close{color:#eeeeef}:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-btn-tab-wrapper.sky-btn-tab-wrapper-selected:not(.sky-btn-tab-wrapper-disabled) .sky-btn-tab-close{color:#eeeeef}.sky-theme-modern.sky-theme-mode-dark .sky-btn-tab-wrapper .sky-btn-tab-close{color:#eeeeef}.sky-theme-modern.sky-theme-mode-dark .sky-btn-tab-wrapper.sky-btn-tab-wrapper-selected:not(.sky-btn-tab-wrapper-disabled) .sky-btn-tab-close{color:#eeeeef}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant"] }, { kind: "directive", type: i5.λ2, selector: "[skyId]", exportAs: ["skyId"] }, { kind: "pipe", type: i6.SkyLibResourcesPipe, name: "skyLibResources" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
130
130
  }
131
131
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: SkyTabButtonComponent, decorators: [{
132
132
  type: Component,
package/esm2022/lib/modules/tabs/tabset.component.mjs CHANGED
@@ -439,7 +439,7 @@ export class SkyTabsetComponent {
439
439
  SkyTabsetAdapterService,
440
440
  SkyTabsetPermalinkService,
441
441
  SkyTabsetService,
442
- ], queries: [{ propertyName: "tabs", predicate: SkyTabComponent }], ngImport: i0, template: "<div\n class=\"sky-tabset\"\n role=\"tablist\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledBy\"\n [ngClass]=\"\n 'sky-tabset-mode-' + tabDisplayMode + ' sky-tabset-style-' + tabStyle\n \"\n (window:resize)=\"onWindowResize()\"\n (keydown.arrowright)=\"onRightKeyDown()\"\n (keydown.arrowleft)=\"onLeftKeyDown()\"\n (keydown.home)=\"onHomeKeyDown()\"\n (keydown.end)=\"onEndKeyDown()\"\n>\n <span class=\"sky-tabset-dropdown\">\n <sky-dropdown *ngIf=\"tabDisplayMode === 'dropdown'\" buttonType=\"tab\">\n <sky-dropdown-button>\n {{ dropdownTriggerButtonText }}\n </sky-dropdown-button>\n <sky-dropdown-menu>\n <sky-dropdown-item\n *ngFor=\"let tabButton of tabButtons\"\n class=\"sky-tab-dropdown-menu-item\"\n >\n <div\n class=\"sky-tab-dropdown-item\"\n [ngClass]=\"{\n 'sky-tab-dropdown-item-selected': tabButton.active\n }\"\n >\n <ng-container\n *ngTemplateOutlet=\"\n tabButtonTemplate;\n context: {\n $implicit: tabButton\n }\n \"\n ></ng-container>\n </div>\n </sky-dropdown-item>\n </sky-dropdown-menu>\n </sky-dropdown>\n </span>\n <span class=\"sky-tabset-tabs\">\n <ng-container *ngFor=\"let tabButton of tabButtons\">\n <ng-container\n *ngTemplateOutlet=\"\n tabButtonTemplate;\n context: {\n $implicit: tabButton\n }\n \"\n ></ng-container>\n </ng-container>\n </span>\n <span class=\"sky-tabset-btns\">\n <button\n *ngIf=\"newTab.observers.length > 0\"\n class=\"sky-btn sky-btn-icon sky-tabset-btn-new sky-margin-inline-compact\"\n type=\"button\"\n [attr.aria-label]=\"'skyux_tab_add' | skyLibResources\"\n [skyThemeClass]=\"{\n 'sky-margin-inline-sm': 'modern'\n }\"\n (click)=\"onNewTabClick()\"\n >\n <sky-icon icon=\"plus-circle\" size=\"lg\" />\n </button>\n <button\n *ngIf=\"openTab.observers.length > 0\"\n class=\"sky-btn sky-btn-icon sky-tabset-btn-open sky-margin-inline-compact\"\n type=\"button\"\n [attr.aria-label]=\"'skyux_tab_open' | skyLibResources\"\n [skyThemeClass]=\"{\n 'sky-margin-inline-sm': 'modern'\n }\"\n (click)=\"onOpenTabClick()\"\n >\n <sky-icon icon=\"folder-open-o\" size=\"lg\" />\n </button>\n </span>\n</div>\n<ng-content />\n\n<ng-template let-tabButton #tabButtonTemplate>\n <sky-tab-button\n [active]=\"tabButton.active\"\n [ariaControls]=\"tabButton.ariaControls\"\n [buttonHref]=\"tabButton.buttonHref\"\n [buttonId]=\"tabButton.buttonId\"\n [buttonText]=\"tabButton.buttonText\"\n [buttonTextCount]=\"tabButton.buttonTextCount\"\n [closeable]=\"tabButton.closeable\"\n [disabled]=\"tabButton.disabled\"\n [tabIndex]=\"tabButton.tabIndex\"\n [tabStyle]=\"tabStyle\"\n [tabNumber]=\"tabButton.tabNumber\"\n [totalTabsCount]=\"tabButton.totalTabsCount\"\n (buttonClick)=\"onTabButtonClick(tabButton)\"\n (closeClick)=\"onTabCloseClick(tabButton)\"\n ></sky-tab-button>\n</ng-template>\n", styles: ["sky-tabset.sky-tabset-layout-fit{position:absolute;inset:0;display:flex;flex-direction:column}sky-tabset.sky-tabset-layout-fit .sky-tabset{flex-grow:0}.sky-tabset{--sky-tabset-margin: 0;align-items:center;border-bottom:2px solid #0974a1;display:flex;list-style-type:none;margin:var(--sky-tabset-margin);padding:0 0 0 var(--sky-layout-host-tab-content-spacing, 15px);white-space:nowrap;flex-grow:var(--sky-layout-host-content-flex-grow, 0);overflow:var(--sky-layout-host-content-overflow, hidden);position:var(--sky-layout-host-content-position, static)}.sky-tabset.sky-tabset-style-wizard{border-bottom:none;padding-left:0}.sky-modal-content .sky-tabset-style-tabs{--sky-tabset-margin: var( --sky-compat-tabset-tabs-modal-margin, 0 -15px 20px )}.sky-modal-content .sky-tabset-style-wizard{--sky-tabset-margin: var( --sky-compat-tabset-wizard-modal-margin, 0 0 20px )}.sky-tabset-btns{order:1;padding-left:10px}.sky-tabset-dropdown{order:0;max-width:100%}.sky-tabset-mode-dropdown{line-height:0}.sky-tabset-mode-dropdown .sky-tabset-tabs{visibility:hidden;order:2}.sky-tab-dropdown-menu-item sky-tab-button{display:flex;min-width:300px}.sky-tab-dropdown-menu-item .sky-dropdown-item{margin:0}.sky-tab-dropdown-menu-item .sky-btn-tab-wrapper{width:100%;margin-right:0}.sky-tab-dropdown-menu-item .sky-btn-tab{margin:0;border-radius:0;width:100%;display:flex}.sky-tab-dropdown-menu-item .sky-btn-tab>.sky-tab-heading{flex:1 1 auto}.sky-tab-dropdown-menu-item .sky-btn-tab>.sky-btn-tab-close{flex:0 1 auto}.sky-tabset-tabs{order:0;white-space:nowrap}.sky-tabset-btn-new,.sky-tabset-btn-open{color:#0974a1}.sky-theme-modern .sky-modal-content .sky-tabset{--sky-tabset-margin: -10px -30px 30px;padding-left:30px;padding-right:30px}.sky-theme-modern .sky-tabset{border-bottom:1px solid #d2d2d2;overflow:visible}.sky-theme-modern .sky-tab-dropdown-menu-item .sky-btn-tab-wrapper{margin-right:0}\n"], dependencies: [{ kind: "directive", type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i5.λ2, selector: "sky-dropdown-button" }, { kind: "component", type: i5.λ3, selector: "sky-dropdown", inputs: ["buttonStyle", "buttonType", "disabled", "dismissOnBlur", "label", "horizontalAlignment", "messageStream", "title", "trigger"] }, { kind: "component", type: i5.λ1, selector: "sky-dropdown-item", inputs: ["ariaRole"] }, { kind: "component", type: i5.λ4, selector: "sky-dropdown-menu", inputs: ["ariaLabelledBy", "ariaRole", "useNativeFocus"], outputs: ["menuChanges"] }, { kind: "component", type: i6.λ1, selector: "sky-icon", inputs: ["icon", "iconType", "size", "fixedWidth", "variant"] }, { kind: "directive", type: i7.λ2, selector: "[skyThemeClass]", inputs: ["class", "skyThemeClass"] }, { kind: "component", type: i8.SkyTabButtonComponent, selector: "sky-tab-button", inputs: ["active", "ariaControls", "buttonHref", "buttonId", "buttonText", "buttonTextCount", "closeable", "disabled", "tabIndex", "tabNumber", "totalTabsCount", "tabStyle"], outputs: ["buttonClick", "closeClick"] }, { kind: "pipe", type: i9.SkyLibResourcesPipe, name: "skyLibResources" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
442
+ ], queries: [{ propertyName: "tabs", predicate: SkyTabComponent }], ngImport: i0, template: "<div\n class=\"sky-tabset\"\n role=\"tablist\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledBy\"\n [ngClass]=\"\n 'sky-tabset-mode-' + tabDisplayMode + ' sky-tabset-style-' + tabStyle\n \"\n (window:resize)=\"onWindowResize()\"\n (keydown.arrowright)=\"onRightKeyDown()\"\n (keydown.arrowleft)=\"onLeftKeyDown()\"\n (keydown.home)=\"onHomeKeyDown()\"\n (keydown.end)=\"onEndKeyDown()\"\n>\n <span class=\"sky-tabset-dropdown\">\n <sky-dropdown *ngIf=\"tabDisplayMode === 'dropdown'\" buttonType=\"tab\">\n <sky-dropdown-button>\n {{ dropdownTriggerButtonText }}\n </sky-dropdown-button>\n <sky-dropdown-menu>\n <sky-dropdown-item\n *ngFor=\"let tabButton of tabButtons\"\n class=\"sky-tab-dropdown-menu-item\"\n >\n <div\n class=\"sky-tab-dropdown-item\"\n [ngClass]=\"{\n 'sky-tab-dropdown-item-selected': tabButton.active\n }\"\n >\n <ng-container\n *ngTemplateOutlet=\"\n tabButtonTemplate;\n context: {\n $implicit: tabButton\n }\n \"\n ></ng-container>\n </div>\n </sky-dropdown-item>\n </sky-dropdown-menu>\n </sky-dropdown>\n </span>\n <span class=\"sky-tabset-tabs\">\n <ng-container *ngFor=\"let tabButton of tabButtons\">\n <ng-container\n *ngTemplateOutlet=\"\n tabButtonTemplate;\n context: {\n $implicit: tabButton\n }\n \"\n ></ng-container>\n </ng-container>\n </span>\n <span class=\"sky-tabset-btns\">\n <button\n *ngIf=\"newTab.observers.length > 0\"\n class=\"sky-btn sky-btn-icon sky-tabset-btn-new sky-margin-inline-compact\"\n type=\"button\"\n [attr.aria-label]=\"'skyux_tab_add' | skyLibResources\"\n [skyThemeClass]=\"{\n 'sky-margin-inline-sm': 'modern'\n }\"\n (click)=\"onNewTabClick()\"\n >\n <sky-icon icon=\"plus-circle\" size=\"lg\" />\n </button>\n <button\n *ngIf=\"openTab.observers.length > 0\"\n class=\"sky-btn sky-btn-icon sky-tabset-btn-open sky-margin-inline-compact\"\n type=\"button\"\n [attr.aria-label]=\"'skyux_tab_open' | skyLibResources\"\n [skyThemeClass]=\"{\n 'sky-margin-inline-sm': 'modern'\n }\"\n (click)=\"onOpenTabClick()\"\n >\n <sky-icon icon=\"folder-open-o\" size=\"lg\" />\n </button>\n </span>\n</div>\n<ng-content />\n\n<ng-template let-tabButton #tabButtonTemplate>\n <sky-tab-button\n [active]=\"tabButton.active\"\n [ariaControls]=\"tabButton.ariaControls\"\n [buttonHref]=\"tabButton.buttonHref\"\n [buttonId]=\"tabButton.buttonId\"\n [buttonText]=\"tabButton.buttonText\"\n [buttonTextCount]=\"tabButton.buttonTextCount\"\n [closeable]=\"tabButton.closeable\"\n [disabled]=\"tabButton.disabled\"\n [tabIndex]=\"tabButton.tabIndex\"\n [tabStyle]=\"tabStyle\"\n [tabNumber]=\"tabButton.tabNumber\"\n [totalTabsCount]=\"tabButton.totalTabsCount\"\n (buttonClick)=\"onTabButtonClick(tabButton)\"\n (closeClick)=\"onTabCloseClick(tabButton)\"\n ></sky-tab-button>\n</ng-template>\n", styles: ["sky-tabset.sky-tabset-layout-fit{position:absolute;inset:0;display:flex;flex-direction:column}sky-tabset.sky-tabset-layout-fit .sky-tabset{flex-grow:0}.sky-tabset{--sky-tabset-margin: 0;align-items:center;border-bottom:2px solid #0974a1;display:flex;list-style-type:none;margin:var(--sky-tabset-margin);padding:0 0 0 var(--sky-layout-host-tab-content-spacing, 15px);white-space:nowrap;flex-grow:var(--sky-layout-host-content-flex-grow, 0);overflow:var(--sky-layout-host-content-overflow, hidden);position:var(--sky-layout-host-content-position, static)}.sky-tabset.sky-tabset-style-wizard{border-bottom:none;padding-left:0}.sky-modal-content .sky-tabset-style-tabs{--sky-tabset-margin: var( --sky-compat-tabset-tabs-modal-margin, 0 -15px 20px )}.sky-modal-content .sky-tabset-style-wizard{--sky-tabset-margin: var( --sky-compat-tabset-wizard-modal-margin, 0 0 20px )}.sky-tabset-btns{order:1;padding-left:10px}.sky-tabset-dropdown{order:0;max-width:100%}.sky-tabset-mode-dropdown{line-height:0}.sky-tabset-mode-dropdown .sky-tabset-tabs{visibility:hidden;order:2}.sky-tab-dropdown-menu-item sky-tab-button{display:flex;min-width:300px}.sky-tab-dropdown-menu-item .sky-dropdown-item{margin:0}.sky-tab-dropdown-menu-item .sky-btn-tab-wrapper{width:100%;margin-right:0}.sky-tab-dropdown-menu-item .sky-btn-tab{margin:0;border-radius:0;width:100%;display:flex}.sky-tab-dropdown-menu-item .sky-btn-tab>.sky-tab-heading{flex:1 1 auto}.sky-tab-dropdown-menu-item .sky-btn-tab>.sky-btn-tab-close{flex:0 1 auto}.sky-tabset-tabs{order:0;white-space:nowrap}.sky-tabset-btn-new,.sky-tabset-btn-open{color:#0974a1}.sky-theme-modern .sky-modal-content .sky-tabset{--sky-tabset-margin: -10px -30px 30px;padding-left:30px;padding-right:30px}.sky-theme-modern .sky-tabset{border-bottom:1px solid #d2d2d2;overflow:visible}.sky-theme-modern .sky-tab-dropdown-menu-item .sky-btn-tab-wrapper{margin-right:0}\n"], dependencies: [{ kind: "directive", type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i5.λ2, selector: "sky-dropdown-button" }, { kind: "component", type: i5.λ3, selector: "sky-dropdown", inputs: ["buttonStyle", "buttonType", "disabled", "dismissOnBlur", "label", "horizontalAlignment", "messageStream", "title", "trigger"] }, { kind: "component", type: i5.λ1, selector: "sky-dropdown-item", inputs: ["ariaRole"] }, { kind: "component", type: i5.λ4, selector: "sky-dropdown-menu", inputs: ["ariaLabelledBy", "ariaRole", "useNativeFocus"], outputs: ["menuChanges"] }, { kind: "component", type: i6.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant"] }, { kind: "directive", type: i7.λ2, selector: "[skyThemeClass]", inputs: ["class", "skyThemeClass"] }, { kind: "component", type: i8.SkyTabButtonComponent, selector: "sky-tab-button", inputs: ["active", "ariaControls", "buttonHref", "buttonId", "buttonText", "buttonTextCount", "closeable", "disabled", "tabIndex", "tabNumber", "totalTabsCount", "tabStyle"], outputs: ["buttonClick", "closeClick"] }, { kind: "pipe", type: i9.SkyLibResourcesPipe, name: "skyLibResources" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
443
443
  }
444
444
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: SkyTabsetComponent, decorators: [{
445
445
  type: Component,
package/esm2022/lib/modules/vertical-tabset/vertical-tab.component.mjs CHANGED
@@ -186,7 +186,7 @@ export class SkyVerticalTabComponent {
186
186
  provide: SkyMediaQueryService,
187
187
  useExisting: SkyVerticalTabMediaQueryService,
188
188
  },
189
- ], viewQueries: [{ propertyName: "tabButton", first: true, predicate: ["tabButton"], descendants: true }, { propertyName: "tabContent", first: true, predicate: ["tabContentWrapper"], descendants: true }], ngImport: i0, template: "<a\n class=\"sky-vertical-tab sky-vertical-tabset-button\"\n [attr.aria-controls]=\"isMobile ? null : ariaControls || tabContentPane.id\"\n [attr.aria-disabled]=\"disabled || undefined\"\n [attr.aria-selected]=\"active\"\n [attr.id]=\"tabId\"\n [attr.role]=\"isMobile ? undefined : ariaRole\"\n [ngClass]=\"{\n 'sky-vertical-tab-active': active,\n 'sky-vertical-tabset-button-disabled': disabled,\n 'sky-font-deemphasized': disabled,\n 'sky-deemphasized': disabled\n }\"\n [tabIndex]=\"-1\"\n (click)=\"activateTab()\"\n (keyup.arrowleft)=\"tabButtonArrowLeft($event)\"\n (keyup.enter)=\"tabButtonActivate($event)\"\n (keyup.space)=\"tabButtonActivate($event)\"\n #tabButton\n>\n <div class=\"sky-vertical-tab-display\">\n <div class=\"sky-vertical-tab-heading\">\n <span class=\"sky-vertical-tab-heading-value\">{{ tabHeading }}</span>\n <span\n class=\"sky-vertical-tab-count\"\n *ngIf=\"tabHeaderCount || tabHeaderCount === 0\"\n >\n ({{ tabHeaderCount }})\n </span>\n </div>\n <sky-status-indicator\n *ngIf=\"errorIndicator\"\n class=\"sky-vertical-tab-heading-error\"\n descriptionType=\"error\"\n indicatorType=\"danger\"\n ></sky-status-indicator>\n <sky-icon\n *ngIf=\"isMobile && showTabRightArrow\"\n class=\"sky-vertical-tab-right-arrow\"\n icon=\"chevron-right\"\n />\n </div>\n</a>\n\n<div #tabContentWrapper>\n <div\n class=\"sky-vertical-tab-content-pane\"\n role=\"tabpanel\"\n tabindex=\"0\"\n skyId\n [attr.aria-labelledby]=\"tabId\"\n [ngClass]=\"{ 'sky-vertical-tab-hidden': !active }\"\n #tabContentPane\n >\n <ng-content />\n\n <div></div>\n </div>\n</div>\n", styles: [".sky-vertical-tab{cursor:pointer;padding:7px 0 7px 10px;margin:5px 0 5px 10px;display:flex;text-decoration:none}.sky-vertical-tab:not(.sky-deemphasized){color:#212327}.sky-vertical-tab:hover{background-color:#eeeeef}.sky-vertical-tab:focus-visible{outline:thin dotted;outline:-webkit-focus-ring-color auto 5px}.sky-vertical-tab:hover .sky-vertical-tab-right-arrow{color:#979ba2}.sky-vertical-tab-active{background-color:#eeeeef;color:#212327;padding-left:6px;border-left:4px solid #00b4f1}.sky-vertical-tab-hidden{display:none}.sky-vertical-tab-display{display:flex;justify-content:space-between;flex-grow:1}.sky-vertical-tab-heading-error{padding-left:5px}.sky-vertical-tab-count{margin-left:5px}.sky-vertical-tabset-button-disabled{cursor:not-allowed;pointer-events:none}.sky-vertical-tab-right-arrow{padding:3px 10px 0 0;color:#cdcfd2}.sky-vertical-tab-content-pane:focus-visible{outline:none;border:none}:host-context(.sky-theme-modern) .sky-vertical-tab{color:#686c73;cursor:pointer;padding:10px 0 10px 15px;margin:15px 0 15px 10px}:host-context(.sky-theme-modern) .sky-vertical-tab:not(.sky-vertical-tab-active):not(:active):hover{color:#212327;background-color:transparent;padding-left:14px;border-left:1px solid #00b4f1}:host-context(.sky-theme-modern) .sky-vertical-tab:not(:active):focus-visible{outline:solid 2px #1870B8;outline-offset:-2px;box-shadow:0 1px 8px #0000004d}:host-context(.sky-theme-modern) .sky-vertical-tab:focus:active:hover{outline:none;background:none}:host-context(.sky-theme-modern) .sky-vertical-tab:active{border-left:4px solid #00b4f1;color:#212327;padding-left:11px}:host-context(.sky-theme-modern) .sky-vertical-tab .sky-vertical-tab-heading-error{padding-left:10px;position:relative;top:-2px}:host-context(.sky-theme-modern) .sky-vertical-tab-active{background:none;color:#212327;padding-left:11px;border-left:4px solid #1870B8}.sky-theme-modern .sky-vertical-tab{color:#686c73;cursor:pointer;padding:10px 0 10px 15px;margin:15px 0 15px 10px}.sky-theme-modern .sky-vertical-tab:not(.sky-vertical-tab-active):not(:active):hover{color:#212327;background-color:transparent;padding-left:14px;border-left:1px solid #00b4f1}.sky-theme-modern .sky-vertical-tab:not(:active):focus-visible{outline:solid 2px #1870B8;outline-offset:-2px;box-shadow:0 1px 8px #0000004d}.sky-theme-modern .sky-vertical-tab:focus:active:hover{outline:none;background:none}.sky-theme-modern .sky-vertical-tab:active{border-left:4px solid #00b4f1;color:#212327;padding-left:11px}.sky-theme-modern .sky-vertical-tab .sky-vertical-tab-heading-error{padding-left:10px;position:relative;top:-2px}.sky-theme-modern .sky-vertical-tab-active{background:none;color:#212327;padding-left:11px;border-left:4px solid #1870B8}:host-context(.sky-sectioned-form-tabs-only) .sky-vertical-tab{margin-left:0}\n"], dependencies: [{ kind: "directive", type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i6.λ1, selector: "sky-icon", inputs: ["icon", "iconType", "size", "fixedWidth", "variant"] }, { kind: "directive", type: i7.λ2, selector: "[skyId]", exportAs: ["skyId"] }, { kind: "component", type: i8.λ10, selector: "sky-status-indicator", inputs: ["indicatorType", "descriptionType", "customDescription", "helpPopoverContent", "helpPopoverTitle", "helpKey"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
189
+ ], viewQueries: [{ propertyName: "tabButton", first: true, predicate: ["tabButton"], descendants: true }, { propertyName: "tabContent", first: true, predicate: ["tabContentWrapper"], descendants: true }], ngImport: i0, template: "<a\n class=\"sky-vertical-tab sky-vertical-tabset-button\"\n [attr.aria-controls]=\"isMobile ? null : ariaControls || tabContentPane.id\"\n [attr.aria-disabled]=\"disabled || undefined\"\n [attr.aria-selected]=\"active\"\n [attr.id]=\"tabId\"\n [attr.role]=\"isMobile ? undefined : ariaRole\"\n [ngClass]=\"{\n 'sky-vertical-tab-active': active,\n 'sky-vertical-tabset-button-disabled': disabled,\n 'sky-font-deemphasized': disabled,\n 'sky-deemphasized': disabled\n }\"\n [tabIndex]=\"-1\"\n (click)=\"activateTab()\"\n (keyup.arrowleft)=\"tabButtonArrowLeft($event)\"\n (keyup.enter)=\"tabButtonActivate($event)\"\n (keyup.space)=\"tabButtonActivate($event)\"\n #tabButton\n>\n <div class=\"sky-vertical-tab-display\">\n <div class=\"sky-vertical-tab-heading\">\n <span class=\"sky-vertical-tab-heading-value\">{{ tabHeading }}</span>\n <span\n class=\"sky-vertical-tab-count\"\n *ngIf=\"tabHeaderCount || tabHeaderCount === 0\"\n >\n ({{ tabHeaderCount }})\n </span>\n </div>\n <sky-status-indicator\n *ngIf=\"errorIndicator\"\n class=\"sky-vertical-tab-heading-error\"\n descriptionType=\"error\"\n indicatorType=\"danger\"\n ></sky-status-indicator>\n <sky-icon\n *ngIf=\"isMobile && showTabRightArrow\"\n class=\"sky-vertical-tab-right-arrow\"\n icon=\"chevron-right\"\n />\n </div>\n</a>\n\n<div #tabContentWrapper>\n <div\n class=\"sky-vertical-tab-content-pane\"\n role=\"tabpanel\"\n tabindex=\"0\"\n skyId\n [attr.aria-labelledby]=\"tabId\"\n [ngClass]=\"{ 'sky-vertical-tab-hidden': !active }\"\n #tabContentPane\n >\n <ng-content />\n\n <div></div>\n </div>\n</div>\n", styles: [".sky-vertical-tab{cursor:pointer;padding:7px 0 7px 10px;margin:5px 0 5px 10px;display:flex;text-decoration:none}.sky-vertical-tab:not(.sky-deemphasized){color:#212327}.sky-vertical-tab:hover{background-color:#eeeeef}.sky-vertical-tab:focus-visible{outline:thin dotted;outline:-webkit-focus-ring-color auto 5px}.sky-vertical-tab:hover .sky-vertical-tab-right-arrow{color:#979ba2}.sky-vertical-tab-active{background-color:#eeeeef;color:#212327;padding-left:6px;border-left:4px solid #00b4f1}.sky-vertical-tab-hidden{display:none}.sky-vertical-tab-display{display:flex;justify-content:space-between;flex-grow:1}.sky-vertical-tab-heading-error{padding-left:5px}.sky-vertical-tab-count{margin-left:5px}.sky-vertical-tabset-button-disabled{cursor:not-allowed;pointer-events:none}.sky-vertical-tab-right-arrow{padding:3px 10px 0 0;color:#cdcfd2}.sky-vertical-tab-content-pane:focus-visible{outline:none;border:none}:host-context(.sky-theme-modern) .sky-vertical-tab{color:#686c73;cursor:pointer;padding:10px 0 10px 15px;margin:15px 0 15px 10px}:host-context(.sky-theme-modern) .sky-vertical-tab:not(.sky-vertical-tab-active):not(:active):hover{color:#212327;background-color:transparent;padding-left:14px;border-left:1px solid #00b4f1}:host-context(.sky-theme-modern) .sky-vertical-tab:not(:active):focus-visible{outline:solid 2px #1870B8;outline-offset:-2px;box-shadow:0 1px 8px #0000004d}:host-context(.sky-theme-modern) .sky-vertical-tab:focus:active:hover{outline:none;background:none}:host-context(.sky-theme-modern) .sky-vertical-tab:active{border-left:4px solid #00b4f1;color:#212327;padding-left:11px}:host-context(.sky-theme-modern) .sky-vertical-tab .sky-vertical-tab-heading-error{padding-left:10px;position:relative;top:-2px}:host-context(.sky-theme-modern) .sky-vertical-tab-active{background:none;color:#212327;padding-left:11px;border-left:4px solid #1870B8}.sky-theme-modern .sky-vertical-tab{color:#686c73;cursor:pointer;padding:10px 0 10px 15px;margin:15px 0 15px 10px}.sky-theme-modern .sky-vertical-tab:not(.sky-vertical-tab-active):not(:active):hover{color:#212327;background-color:transparent;padding-left:14px;border-left:1px solid #00b4f1}.sky-theme-modern .sky-vertical-tab:not(:active):focus-visible{outline:solid 2px #1870B8;outline-offset:-2px;box-shadow:0 1px 8px #0000004d}.sky-theme-modern .sky-vertical-tab:focus:active:hover{outline:none;background:none}.sky-theme-modern .sky-vertical-tab:active{border-left:4px solid #00b4f1;color:#212327;padding-left:11px}.sky-theme-modern .sky-vertical-tab .sky-vertical-tab-heading-error{padding-left:10px;position:relative;top:-2px}.sky-theme-modern .sky-vertical-tab-active{background:none;color:#212327;padding-left:11px;border-left:4px solid #1870B8}:host-context(.sky-sectioned-form-tabs-only) .sky-vertical-tab{margin-left:0}\n"], dependencies: [{ kind: "directive", type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i6.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant"] }, { kind: "directive", type: i7.λ2, selector: "[skyId]", exportAs: ["skyId"] }, { kind: "component", type: i8.λ10, selector: "sky-status-indicator", inputs: ["indicatorType", "descriptionType", "customDescription", "helpPopoverContent", "helpPopoverTitle", "helpKey"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
190
190
  }
191
191
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: SkyVerticalTabComponent, decorators: [{
192
192
  type: Component,
package/esm2022/lib/modules/vertical-tabset/vertical-tabset.component.mjs CHANGED
@@ -117,7 +117,7 @@ export class SkyVerticalTabsetComponent {
117
117
  this.adapterService.focusPreviousButton(this.tabGroups);
118
118
  }
119
119
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: SkyVerticalTabsetComponent, deps: [{ token: i1.SkyVerticalTabsetAdapterService }, { token: i2.SkyVerticalTabsetService }, { token: i3.SkyLibResourcesService }, { token: i0.ChangeDetectorRef }, { token: i4.SkyTabIdService }], target: i0.ɵɵFactoryTarget.Component }); }
120
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.5", type: SkyVerticalTabsetComponent, selector: "sky-vertical-tabset", inputs: { showTabsText: "showTabsText", ariaLabel: "ariaLabel", ariaLabelledBy: "ariaLabelledBy", ariaRole: "ariaRole", maintainTabContent: "maintainTabContent" }, outputs: { activeChange: "activeChange" }, providers: [SkyTabIdService, SkyVerticalTabsetService], viewQueries: [{ propertyName: "tabGroups", first: true, predicate: ["groupContainerWrapper"], descendants: true }, { propertyName: "content", first: true, predicate: ["skySideContent"], descendants: true }, { propertyName: "contentWrapper", first: true, predicate: ["contentContainerWrapper"], descendants: true }], ngImport: i0, template: "<div\n class=\"sky-vertical-tabset\"\n [tabIndex]=\"tablistHasFocus ? -1 : 0\"\n (focus)=\"tabsetFocus()\"\n>\n <!--\n ARIA rules do not allow tabpanel elements to be children of a tablist element.\n However, the markup for each sky-vertical-tab component includes both the tab button\n and its panel, making the panel element a child of its tablist. Moreover, our\n sky-vertical-tab components can be grouped within collapsible containers, which also\n violates accessibility rules because only tab buttons can be children of a tablist.\n To address this, we create an empty tablist element with an aria-owns attribute,\n pointing to each tab element individually. That way, we don't have to worry about the\n structure for each sky-vertical-tab component in order to satisfy accessibility\n guidelines.\n -->\n <span\n aria-orientation=\"vertical\"\n class=\"sky-vertical-tabset-tablist\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledBy\"\n [attr.aria-owns]=\"(tabIdSvc.ids | async)?.join(' ') || undefined\"\n [attr.role]=\"isMobile ? undefined : ariaRole\"\n ></span>\n <div\n *ngIf=\"maintainTabContent || tabService.tabsVisible()\"\n class=\"sky-vertical-tabset-group-container\"\n [@tabGroupEnter]=\"tabService.animationTabsVisibleState\"\n [ngClass]=\"{ 'sky-vertical-tabset-hidden': !tabService.tabsVisible() }\"\n (keydown.arrowdown)=\"tabGroupsArrowDown(); $event.preventDefault()\"\n (keydown.arrowup)=\"tabGroupsArrowUp(); $event.preventDefault()\"\n (focusin)=\"tabGroupsFocusIn()\"\n (focusout)=\"tabGroupsFocusOut()\"\n #groupContainerWrapper\n >\n <ng-content />\n </div>\n <div\n *ngIf=\"maintainTabContent || tabService.contentVisible()\"\n class=\"sky-vertical-tabset-content\"\n [ngClass]=\"{\n 'sky-vertical-tabset-content-hidden': !tabService.contentVisible()\n }\"\n [@contentEnter]=\"tabService.animationContentVisibleState\"\n #contentContainerWrapper\n >\n <div #skySideContent></div>\n <button\n *ngIf=\"!tabService.tabsVisible()\"\n (click)=\"tabService.showTabs()\"\n class=\"sky-btn sky-btn-primary sky-vertical-tabset-show-tabs-btn\"\n type=\"button\"\n >\n <sky-icon icon=\"chevron-left\" />\n {{ showTabsText }}\n </button>\n </div>\n</div>\n", styles: [":host .sky-vertical-tabset{display:block;height:auto}:host .sky-vertical-tabset-group-container{border-right:none}:host-context(.sky-responsive-container-xs) .sky-vertical-tabset,:host-context(.sky-responsive-container-sm) .sky-vertical-tabset,:host-context(.sky-responsive-container-md) .sky-vertical-tabset,:host-context(.sky-responsive-container-lg) .sky-vertical-tabset{display:block;height:auto}:host-context(.sky-responsive-container-xs) .sky-vertical-tabset-group-container,:host-context(.sky-responsive-container-sm) .sky-vertical-tabset-group-container,:host-context(.sky-responsive-container-md) .sky-vertical-tabset-group-container,:host-context(.sky-responsive-container-lg) .sky-vertical-tabset-group-container{border-right:none}@media (min-width: 768px){:host .sky-vertical-tabset{display:flex;height:100%}:host .sky-vertical-tabset-group-container{border-right:1px solid #cdcfd2}}:host-context(.sky-responsive-container-sm) .sky-vertical-tabset,:host-context(.sky-responsive-container-md) .sky-vertical-tabset,:host-context(.sky-responsive-container-lg) .sky-vertical-tabset{display:flex;height:100%}:host-context(.sky-responsive-container-sm) .sky-vertical-tabset-group-container,:host-context(.sky-responsive-container-md) .sky-vertical-tabset-group-container,:host-context(.sky-responsive-container-lg) .sky-vertical-tabset-group-container{border-right:1px solid #cdcfd2}.sky-vertical-tabset-hidden{display:none}.sky-vertical-tabset-content{margin:10px 0 0 10px;flex-basis:75%;overflow-y:auto}.sky-vertical-tabset-content-hidden{display:none}.sky-vertical-tabset-show-tabs-btn{margin-top:10px}.sky-vertical-tabset-group-container{flex-basis:25%;overflow-y:auto}:host-context(sky-modal-content)>.sky-vertical-tabset{margin:var(--sky-compat-vertical-tabs-modal-margin)}:host-context(sky-modal-content)>:host .sky-vertical-tabset{margin:-15px}:host-context(.sky-theme-modern) .sky-vertical-tabset-content{margin:15px}@media (min-width: 768px){:host-context(.sky-theme-modern) :host .sky-vertical-tabset-content{margin:20px 30px}:host-context(.sky-theme-modern) :host .sky-vertical-tabset-group-container{border-right:1px solid #d2d2d2}}:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-sm) .sky-vertical-tabset-content,:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-md) .sky-vertical-tabset-content,:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-lg) .sky-vertical-tabset-content{margin:20px 30px}:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-sm) .sky-vertical-tabset-group-container,:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-md) .sky-vertical-tabset-group-container,:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-lg) .sky-vertical-tabset-group-container{border-right:1px solid #d2d2d2}.sky-theme-modern .sky-vertical-tabset-content{margin:15px}@media (min-width: 768px){.sky-theme-modern :host .sky-vertical-tabset-content{margin:20px 30px}.sky-theme-modern :host .sky-vertical-tabset-group-container{border-right:1px solid #d2d2d2}}.sky-theme-modern :host-context(.sky-responsive-container-sm) .sky-vertical-tabset-content,.sky-theme-modern :host-context(.sky-responsive-container-md) .sky-vertical-tabset-content,.sky-theme-modern :host-context(.sky-responsive-container-lg) .sky-vertical-tabset-content{margin:20px 30px}.sky-theme-modern :host-context(.sky-responsive-container-sm) .sky-vertical-tabset-group-container,.sky-theme-modern :host-context(.sky-responsive-container-md) .sky-vertical-tabset-group-container,.sky-theme-modern :host-context(.sky-responsive-container-lg) .sky-vertical-tabset-group-container{border-right:1px solid #d2d2d2}\n"], dependencies: [{ kind: "directive", type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i6.λ1, selector: "sky-icon", inputs: ["icon", "iconType", "size", "fixedWidth", "variant"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }], animations: [
120
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.5", type: SkyVerticalTabsetComponent, selector: "sky-vertical-tabset", inputs: { showTabsText: "showTabsText", ariaLabel: "ariaLabel", ariaLabelledBy: "ariaLabelledBy", ariaRole: "ariaRole", maintainTabContent: "maintainTabContent" }, outputs: { activeChange: "activeChange" }, providers: [SkyTabIdService, SkyVerticalTabsetService], viewQueries: [{ propertyName: "tabGroups", first: true, predicate: ["groupContainerWrapper"], descendants: true }, { propertyName: "content", first: true, predicate: ["skySideContent"], descendants: true }, { propertyName: "contentWrapper", first: true, predicate: ["contentContainerWrapper"], descendants: true }], ngImport: i0, template: "<div\n class=\"sky-vertical-tabset\"\n [tabIndex]=\"tablistHasFocus ? -1 : 0\"\n (focus)=\"tabsetFocus()\"\n>\n <!--\n ARIA rules do not allow tabpanel elements to be children of a tablist element.\n However, the markup for each sky-vertical-tab component includes both the tab button\n and its panel, making the panel element a child of its tablist. Moreover, our\n sky-vertical-tab components can be grouped within collapsible containers, which also\n violates accessibility rules because only tab buttons can be children of a tablist.\n To address this, we create an empty tablist element with an aria-owns attribute,\n pointing to each tab element individually. That way, we don't have to worry about the\n structure for each sky-vertical-tab component in order to satisfy accessibility\n guidelines.\n -->\n <span\n aria-orientation=\"vertical\"\n class=\"sky-vertical-tabset-tablist\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledBy\"\n [attr.aria-owns]=\"(tabIdSvc.ids | async)?.join(' ') || undefined\"\n [attr.role]=\"isMobile ? undefined : ariaRole\"\n ></span>\n <div\n *ngIf=\"maintainTabContent || tabService.tabsVisible()\"\n class=\"sky-vertical-tabset-group-container\"\n [@tabGroupEnter]=\"tabService.animationTabsVisibleState\"\n [ngClass]=\"{ 'sky-vertical-tabset-hidden': !tabService.tabsVisible() }\"\n (keydown.arrowdown)=\"tabGroupsArrowDown(); $event.preventDefault()\"\n (keydown.arrowup)=\"tabGroupsArrowUp(); $event.preventDefault()\"\n (focusin)=\"tabGroupsFocusIn()\"\n (focusout)=\"tabGroupsFocusOut()\"\n #groupContainerWrapper\n >\n <ng-content />\n </div>\n <div\n *ngIf=\"maintainTabContent || tabService.contentVisible()\"\n class=\"sky-vertical-tabset-content\"\n [ngClass]=\"{\n 'sky-vertical-tabset-content-hidden': !tabService.contentVisible()\n }\"\n [@contentEnter]=\"tabService.animationContentVisibleState\"\n #contentContainerWrapper\n >\n <div #skySideContent></div>\n <button\n *ngIf=\"!tabService.tabsVisible()\"\n (click)=\"tabService.showTabs()\"\n class=\"sky-btn sky-btn-primary sky-vertical-tabset-show-tabs-btn\"\n type=\"button\"\n >\n <sky-icon icon=\"chevron-left\" />\n {{ showTabsText }}\n </button>\n </div>\n</div>\n", styles: [":host .sky-vertical-tabset{display:block;height:auto}:host .sky-vertical-tabset-group-container{border-right:none}:host-context(.sky-responsive-container-xs) .sky-vertical-tabset,:host-context(.sky-responsive-container-sm) .sky-vertical-tabset,:host-context(.sky-responsive-container-md) .sky-vertical-tabset,:host-context(.sky-responsive-container-lg) .sky-vertical-tabset{display:block;height:auto}:host-context(.sky-responsive-container-xs) .sky-vertical-tabset-group-container,:host-context(.sky-responsive-container-sm) .sky-vertical-tabset-group-container,:host-context(.sky-responsive-container-md) .sky-vertical-tabset-group-container,:host-context(.sky-responsive-container-lg) .sky-vertical-tabset-group-container{border-right:none}@media (min-width: 768px){:host .sky-vertical-tabset{display:flex;height:100%}:host .sky-vertical-tabset-group-container{border-right:1px solid #cdcfd2}}:host-context(.sky-responsive-container-sm) .sky-vertical-tabset,:host-context(.sky-responsive-container-md) .sky-vertical-tabset,:host-context(.sky-responsive-container-lg) .sky-vertical-tabset{display:flex;height:100%}:host-context(.sky-responsive-container-sm) .sky-vertical-tabset-group-container,:host-context(.sky-responsive-container-md) .sky-vertical-tabset-group-container,:host-context(.sky-responsive-container-lg) .sky-vertical-tabset-group-container{border-right:1px solid #cdcfd2}.sky-vertical-tabset-hidden{display:none}.sky-vertical-tabset-content{margin:10px 0 0 10px;flex-basis:75%;overflow-y:auto}.sky-vertical-tabset-content-hidden{display:none}.sky-vertical-tabset-show-tabs-btn{margin-top:10px}.sky-vertical-tabset-group-container{flex-basis:25%;overflow-y:auto}:host-context(sky-modal-content)>.sky-vertical-tabset{margin:var(--sky-compat-vertical-tabs-modal-margin)}:host-context(sky-modal-content)>:host .sky-vertical-tabset{margin:-15px}:host-context(.sky-theme-modern) .sky-vertical-tabset-content{margin:15px}@media (min-width: 768px){:host-context(.sky-theme-modern) :host .sky-vertical-tabset-content{margin:20px 30px}:host-context(.sky-theme-modern) :host .sky-vertical-tabset-group-container{border-right:1px solid #d2d2d2}}:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-sm) .sky-vertical-tabset-content,:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-md) .sky-vertical-tabset-content,:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-lg) .sky-vertical-tabset-content{margin:20px 30px}:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-sm) .sky-vertical-tabset-group-container,:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-md) .sky-vertical-tabset-group-container,:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-lg) .sky-vertical-tabset-group-container{border-right:1px solid #d2d2d2}.sky-theme-modern .sky-vertical-tabset-content{margin:15px}@media (min-width: 768px){.sky-theme-modern :host .sky-vertical-tabset-content{margin:20px 30px}.sky-theme-modern :host .sky-vertical-tabset-group-container{border-right:1px solid #d2d2d2}}.sky-theme-modern :host-context(.sky-responsive-container-sm) .sky-vertical-tabset-content,.sky-theme-modern :host-context(.sky-responsive-container-md) .sky-vertical-tabset-content,.sky-theme-modern :host-context(.sky-responsive-container-lg) .sky-vertical-tabset-content{margin:20px 30px}.sky-theme-modern :host-context(.sky-responsive-container-sm) .sky-vertical-tabset-group-container,.sky-theme-modern :host-context(.sky-responsive-container-md) .sky-vertical-tabset-group-container,.sky-theme-modern :host-context(.sky-responsive-container-lg) .sky-vertical-tabset-group-container{border-right:1px solid #d2d2d2}\n"], dependencies: [{ kind: "directive", type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i6.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }], animations: [
121
121
  trigger('tabGroupEnter', [
122
122
  transition(`${HIDDEN_STATE} => ${VISIBLE_STATE}`, [
123
123
  style({ transform: 'translate(-100%)' }),
@@ -170,4 +170,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.5", ngImpor
170
170
  type: ViewChild,
171
171
  args: ['contentContainerWrapper']
172
172
  }] } });
173
- //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidmVydGljYWwtdGFic2V0LmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uLy4uL2xpYnMvY29tcG9uZW50cy90YWJzL3NyYy9saWIvbW9kdWxlcy92ZXJ0aWNhbC10YWJzZXQvdmVydGljYWwtdGFic2V0LmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uLy4uLy4uL2xpYnMvY29tcG9uZW50cy90YWJzL3NyYy9saWIvbW9kdWxlcy92ZXJ0aWNhbC10YWJzZXQvdmVydGljYWwtdGFic2V0LmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxPQUFPLEVBQUUsS0FBSyxFQUFFLFVBQVUsRUFBRSxPQUFPLEVBQUUsTUFBTSxxQkFBcUIsQ0FBQztBQUMxRSxPQUFPLEVBRUwsdUJBQXVCLEVBRXZCLFNBQVMsRUFFVCxZQUFZLEVBQ1osS0FBSyxFQUdMLE1BQU0sRUFDTixTQUFTLEdBQ1YsTUFBTSxlQUFlLENBQUM7QUFHdkIsT0FBTyxFQUFFLE9BQU8sRUFBRSxNQUFNLE1BQU0sQ0FBQztBQUMvQixPQUFPLEVBQUUsSUFBSSxFQUFFLFNBQVMsRUFBRSxNQUFNLGdCQUFnQixDQUFDO0FBRWpELE9BQU8sRUFBRSxlQUFlLEVBQUUsTUFBTSwwQkFBMEIsQ0FBQztBQUczRCxPQUFPLEVBQ0wsWUFBWSxFQUNaLHdCQUF3QixFQUN4QixhQUFhLEdBQ2QsTUFBTSwyQkFBMkIsQ0FBQzs7Ozs7Ozs7QUF1Qm5DLE1BQU0sT0FBTywwQkFBMEI7SUE0QnJDOzs7Ozs7Ozs7T0FTRztJQUNILElBQ1csUUFBUTtRQUNqQixPQUFPLElBQUksQ0FBQyxVQUFVLENBQUM7SUFDekIsQ0FBQztJQUVELElBQVcsUUFBUSxDQUFDLEtBQXlCO1FBQzNDLElBQUksQ0FBQyxVQUFVLEdBQUcsS0FBSyxJQUFJLFNBQVMsQ0FBQztJQUN2QyxDQUFDO0lBZ0NELGNBQWMsQ0FBdUI7SUFDckMsVUFBVSxDQUFhO0lBRXZCLFVBQVUsQ0FBeUI7SUFDbkMsVUFBVSxDQUFvQjtJQUU5QixZQUNTLGNBQStDLEVBQy9DLFVBQW9DLEVBQzNDLFNBQWlDLEVBQ2pDLFNBQTRCLEVBQ3JCLFFBQXlCO1FBSnpCLG1CQUFjLEdBQWQsY0FBYyxDQUFpQztRQUMvQyxlQUFVLEdBQVYsVUFBVSxDQUEwQjtRQUdwQyxhQUFRLEdBQVIsUUFBUSxDQUFpQjtRQXpDbEM7Ozs7V0FJRztRQUVJLHVCQUFrQixHQUF3QixLQUFLLENBQUM7UUFFdkQ7OztXQUdHO1FBRUksaUJBQVksR0FBRyxJQUFJLFlBQVksRUFBVSxDQUFDO1FBYTFDLGFBQVEsR0FBRyxLQUFLLENBQUM7UUFFZCxvQkFBZSxHQUFHLEtBQUssQ0FBQztRQUVsQyxtQkFBYyxHQUFHLElBQUksT0FBTyxFQUFRLENBQUM7UUFDckMsZUFBVSxHQUFHLFNBQVMsQ0FBQztRQVlyQixJQUFJLENBQUMsVUFBVSxHQUFHLFNBQVMsQ0FBQztRQUM1QixJQUFJLENBQUMsVUFBVSxHQUFHLFNBQVMsQ0FBQztJQUM5QixDQUFDO0lBRU0sUUFBUTtRQUNiLElBQUksQ0FBQyxVQUFVLENBQUMsa0JBQWtCLEdBQUcsSUFBSSxDQUFDLGtCQUFrQixDQUFDO1FBRTdELElBQUksQ0FBQyxVQUFVLENBQUMsWUFBWTthQUN6QixJQUFJLENBQUMsU0FBUyxDQUFDLElBQUksQ0FBQyxjQUFjLENBQUMsQ0FBQzthQUNwQyxTQUFTLENBQUMsQ0FBQyxLQUFLLEVBQUUsRUFBRTtZQUNuQixJQUFJLENBQUMsWUFBWSxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsQ0FBQztZQUM5QixJQUFJLElBQUksQ0FBQyxjQUFjLEVBQUUsQ0FBQztnQkFDeEIsSUFBSSxDQUFDLGNBQWMsQ0FBQyxrQkFBa0IsQ0FBQyxJQUFJLENBQUMsY0FBYyxDQUFDLENBQUM7WUFDOUQsQ0FBQztZQUNELElBQUksQ0FBQyxVQUFVLENBQUMsWUFBWSxFQUFFLENBQUM7UUFDakMsQ0FBQyxDQUFDLENBQUM7UUFFTCxJQUFJLENBQUMsVUFBVSxDQUFDLGVBQWU7YUFDNUIsSUFBSSxDQUFDLFNBQVMsQ0FBQyxJQUFJLENBQUMsY0FBYyxDQUFDLENBQUM7YUFDcEMsU0FBUyxDQUFDLENBQUMsTUFBZSxFQUFFLEVBQUU7WUFDN0IsSUFBSSxDQUFDLFFBQVEsR0FBRyxNQUFNLENBQUM7WUFDdkIsSUFBSSxDQUFDLFVBQVUsQ0FBQyxZQUFZLEVBQUUsQ0FBQztRQUNqQyxDQUFDLENBQUMsQ0FBQztRQUVMLElBQUksSUFBSSxDQUFDLFVBQVUsQ0FBQyxRQUFRLEVBQUUsRUFBRSxDQUFDO1lBQy9CLElBQUksQ0FBQyxRQUFRLEdBQUcsSUFBSSxDQUFDO1lBQ3JCLElBQUksQ0FBQyxVQUFVLENBQUMsNEJBQTRCLEdBQUcsYUFBYSxDQUFDO1lBQzdELElBQUksQ0FBQyxVQUFVLENBQUMsWUFBWSxFQUFFLENBQUM7UUFDakMsQ0FBQztRQUNELElBQUksQ0FBQyxJQUFJLENBQUMsWUFBWSxFQUFFLENBQUM7WUFDdkIsSUFBSSxDQUFDLFVBQVU7aUJBQ1osU0FBUyxDQUFDLG9DQUFvQyxDQUFDO2lCQUMvQyxJQUFJLENBQUMsSUFBSSxDQUFDLENBQUMsQ0FBQyxDQUFDO2lCQUNiLFNBQVMsQ0FBQyxDQUFDLFFBQVEsRUFBRSxFQUFFO2dCQUN0QixrQkFBa0I7Z0JBQ2xCLDBCQUEwQjtnQkFDMUIsSUFBSSxDQUFDLElBQUksQ0FBQyxZQUFZLEVBQUUsQ0FBQztvQkFDdkIsSUFBSSxDQUFDLFlBQVksR0FBRyxRQUFRLENBQUM7Z0JBQy9CLENBQUM7WUFDSCxDQUFDLENBQUMsQ0FBQztRQUNQLENBQUM7SUFDSCxDQUFDO0lBRU0sa0JBQWtCO1FBQ3ZCLElBQUksQ0FBQyxVQUFVLENBQUMsT0FBTyxHQUFHLElBQUksQ0FBQyxPQUFPLENBQUM7UUFDdkMsSUFBSSxDQUFDLFVBQVUsQ0FBQyxhQUFhLEVBQUUsQ0FBQztJQUNsQyxDQUFDO0lBRU0sV0FBVztRQUNoQixJQUFJLENBQUMsY0FBYyxDQUFDLElBQUksRUFBRSxDQUFDO1FBQzNCLElBQUksQ0FBQyxjQUFjLENBQUMsUUFBUSxFQUFFLENBQUM7SUFDakMsQ0FBQztJQUVTLFdBQVc7UUFDbkIsSUFBSSxDQUFDLFVBQVUsQ0FBQyxjQUFjLENBQUMsSUFBSSxDQUFDLFNBQVMsQ0FBQyxDQUFDO0lBQ2pELENBQUM7SUFFUyxnQkFBZ0I7UUFDeEIsdUVBQXVFO1FBQ3ZFLGlFQUFpRTtRQUNqRSx3RUFBd0U7UUFDeEUsMkNBQTJDO1FBQzNDLElBQUksQ0FBQyxlQUFlLEdBQUcsSUFBSSxDQUFDO0lBQzlCLENBQUM7SUFFUyxpQkFBaUI7UUFDekIsSUFBSSxDQUFDLGVBQWUsR0FBRyxLQUFLLENBQUM7SUFDL0IsQ0FBQztJQUVTLGtCQUFrQjtRQUMxQixJQUFJLENBQUMsY0FBYyxDQUFDLGVBQWUsQ0FBQyxJQUFJLENBQUMsU0FBUyxDQUFDLENBQUM7SUFDdEQsQ0FBQztJQUVTLGdCQUFnQjtRQUN4QixJQUFJLENBQUMsY0FBYyxDQUFDLG1CQUFtQixDQUFDLElBQUksQ0FBQyxTQUFTLENBQUMsQ0FBQztJQUMxRCxDQUFDOzhHQXJLVSwwQkFBMEI7a0dBQTFCLDBCQUEwQiw2UEFqQjFCLENBQUMsZUFBZSxFQUFFLHdCQUF3QixDQUFDLHNWQ2hDeEQsdXpFQTBEQSwyaUlEeEJjO1lBQ1YsT0FBTyxDQUFDLGVBQWUsRUFBRTtnQkFDdkIsVUFBVSxDQUFDLEdBQUcsWUFBWSxPQUFPLGFBQWEsRUFBRSxFQUFFO29CQUNoRCxLQUFLLENBQUMsRUFBRSxTQUFTLEVBQUUsa0JBQWtCLEVBQUUsQ0FBQztvQkFDeEMsT0FBTyxDQUFDLGVBQWUsQ0FBQztpQkFDekIsQ0FBQzthQUNILENBQUM7WUFDRixPQUFPLENBQUMsY0FBYyxFQUFFO2dCQUN0QixVQUFVLENBQUMsR0FBRyxZQUFZLE9BQU8sYUFBYSxFQUFFLEVBQUU7b0JBQ2hELEtBQUssQ0FBQyxFQUFFLFNBQVMsRUFBRSxpQkFBaUIsRUFBRSxDQUFDO29CQUN2QyxPQUFPLENBQUMsZUFBZSxDQUFDO2lCQUN6QixDQUFDO2FBQ0gsQ0FBQztTQUNIOzsyRkFFVSwwQkFBMEI7a0JBckJ0QyxTQUFTOytCQUNFLHFCQUFxQixhQUdwQixDQUFDLGVBQWUsRUFBRSx3QkFBd0IsQ0FBQyxtQkFDckMsdUJBQXVCLENBQUMsTUFBTSxjQUNuQzt3QkFDVixPQUFPLENBQUMsZUFBZSxFQUFFOzRCQUN2QixVQUFVLENBQUMsR0FBRyxZQUFZLE9BQU8sYUFBYSxFQUFFLEVBQUU7Z0NBQ2hELEtBQUssQ0FBQyxFQUFFLFNBQVMsRUFBRSxrQkFBa0IsRUFBRSxDQUFDO2dDQUN4QyxPQUFPLENBQUMsZUFBZSxDQUFDOzZCQUN6QixDQUFDO3lCQUNILENBQUM7d0JBQ0YsT0FBTyxDQUFDLGNBQWMsRUFBRTs0QkFDdEIsVUFBVSxDQUFDLEdBQUcsWUFBWSxPQUFPLGFBQWEsRUFBRSxFQUFFO2dDQUNoRCxLQUFLLENBQUMsRUFBRSxTQUFTLEVBQUUsaUJBQWlCLEVBQUUsQ0FBQztnQ0FDdkMsT0FBTyxDQUFDLGVBQWUsQ0FBQzs2QkFDekIsQ0FBQzt5QkFDSCxDQUFDO3FCQUNIOzhPQVNNLFlBQVk7c0JBRGxCLEtBQUs7Z0JBVUMsU0FBUztzQkFEZixLQUFLO2dCQVdDLGNBQWM7c0JBRHBCLEtBQUs7Z0JBY0ssUUFBUTtzQkFEbEIsS0FBSztnQkFlQyxrQkFBa0I7c0JBRHhCLEtBQUs7Z0JBUUMsWUFBWTtzQkFEbEIsTUFBTTtnQkFJQSxTQUFTO3NCQURmLFNBQVM7dUJBQUMsdUJBQXVCO2dCQUkzQixPQUFPO3NCQURiLFNBQVM7dUJBQUMsZ0JBQWdCO2dCQUlwQixjQUFjO3NCQURwQixTQUFTO3VCQUFDLHlCQUF5QiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGFuaW1hdGUsIHN0eWxlLCB0cmFuc2l0aW9uLCB0cmlnZ2VyIH0gZnJvbSAnQGFuZ3VsYXIvYW5pbWF0aW9ucyc7XG5pbXBvcnQge1xuICBBZnRlclZpZXdDaGVja2VkLFxuICBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSxcbiAgQ2hhbmdlRGV0ZWN0b3JSZWYsXG4gIENvbXBvbmVudCxcbiAgRWxlbWVudFJlZixcbiAgRXZlbnRFbWl0dGVyLFxuICBJbnB1dCxcbiAgT25EZXN0cm95LFxuICBPbkluaXQsXG4gIE91dHB1dCxcbiAgVmlld0NoaWxkLFxufSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IFNreUxpYlJlc291cmNlc1NlcnZpY2UgfSBmcm9tICdAc2t5dXgvaTE4bic7XG5cbmltcG9ydCB7IFN1YmplY3QgfSBmcm9tICdyeGpzJztcbmltcG9ydCB7IHRha2UsIHRha2VVbnRpbCB9IGZyb20gJ3J4anMvb3BlcmF0b3JzJztcblxuaW1wb3J0IHsgU2t5VGFiSWRTZXJ2aWNlIH0gZnJvbSAnLi4vc2hhcmVkL3RhYi1pZC5zZXJ2aWNlJztcblxuaW1wb3J0IHsgU2t5VmVydGljYWxUYWJzZXRBZGFwdGVyU2VydmljZSB9IGZyb20gJy4vdmVydGljYWwtdGFic2V0LWFkYXB0ZXIuc2VydmljZSc7XG5pbXBvcnQge1xuICBISURERU5fU1RBVEUsXG4gIFNreVZlcnRpY2FsVGFic2V0U2VydmljZSxcbiAgVklTSUJMRV9TVEFURSxcbn0gZnJvbSAnLi92ZXJ0aWNhbC10YWJzZXQuc2VydmljZSc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ3NreS12ZXJ0aWNhbC10YWJzZXQnLFxuICB0ZW1wbGF0ZVVybDogJy4vdmVydGljYWwtdGFic2V0LmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vdmVydGljYWwtdGFic2V0LmNvbXBvbmVudC5zY3NzJ10sXG4gIHByb3ZpZGVyczogW1NreVRhYklkU2VydmljZSwgU2t5VmVydGljYWxUYWJzZXRTZXJ2aWNlXSxcbiAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG4gIGFuaW1hdGlvbnM6IFtcbiAgICB0cmlnZ2VyKCd0YWJHcm91cEVudGVyJywgW1xuICAgICAgdHJhbnNpdGlvbihgJHtISURERU5fU1RBVEV9ID0+ICR7VklTSUJMRV9TVEFURX1gLCBbXG4gICAgICAgIHN0eWxlKHsgdHJhbnNmb3JtOiAndHJhbnNsYXRlKC0xMDAlKScgfSksXG4gICAgICAgIGFuaW1hdGUoJzE1MG1zIGVhc2UtaW4nKSxcbiAgICAgIF0pLFxuICAgIF0pLFxuICAgIHRyaWdnZXIoJ2NvbnRlbnRFbnRlcicsIFtcbiAgICAgIHRyYW5zaXRpb24oYCR7SElEREVOX1NUQVRFfSA9PiAke1ZJU0lCTEVfU1RBVEV9YCwgW1xuICAgICAgICBzdHlsZSh7IHRyYW5zZm9ybTogJ3RyYW5zbGF0ZSgxMDAlKScgfSksXG4gICAgICAgIGFuaW1hdGUoJzE1MG1zIGVhc2UtaW4nKSxcbiAgICAgIF0pLFxuICAgIF0pLFxuICBdLFxufSlcbmV4cG9ydCBjbGFzcyBTa3lWZXJ0aWNhbFRhYnNldENvbXBvbmVudFxuICBpbXBsZW1lbnRzIE9uSW5pdCwgQWZ0ZXJWaWV3Q2hlY2tlZCwgT25EZXN0cm95XG57XG4gIC8qKlxuICAgKiBUaGUgdGV4dCB0byBkaXNwbGF5IG9uIHRoZSBzaG93IHRhYnMgYnV0dG9uIG9uIG1vYmlsZSBkZXZpY2VzLlxuICAgKi9cbiAgQElucHV0KClcbiAgcHVibGljIHNob3dUYWJzVGV4dDogc3RyaW5nIHwgdW5kZWZpbmVkO1xuXG4gIC8qKlxuICAgKiBUaGUgQVJJQSBsYWJlbCBmb3IgdGhlIHRhYnNldC4gVGhpcyBzZXRzIHRoZSB0YWJzZXQncyBgYXJpYS1sYWJlbGAgYXR0cmlidXRlIHRvIHByb3ZpZGUgYSB0ZXh0IGVxdWl2YWxlbnQgZm9yIHNjcmVlbiByZWFkZXJzXG4gICAqIFt0byBzdXBwb3J0IGFjY2Vzc2liaWxpdHldKGh0dHBzOi8vZGV2ZWxvcGVyLmJsYWNrYmF1ZC5jb20vc2t5dXgvbGVhcm4vYWNjZXNzaWJpbGl0eSkuXG4gICAqIElmIHRoZSB0YWJzZXQgaW5jbHVkZXMgYSB2aXNpYmxlIGxhYmVsLCB1c2UgYGFyaWFMYWJlbGxlZEJ5YCBpbnN0ZWFkLlxuICAgKiBGb3IgbW9yZSBpbmZvcm1hdGlvbiBhYm91dCB0aGUgYGFyaWEtbGFiZWxgIGF0dHJpYnV0ZSwgc2VlIHRoZSBbV0FJLUFSSUEgZGVmaW5pdGlvbl0oaHR0cHM6Ly93d3cudzMub3JnL1RSL3dhaS1hcmlhLyNhcmlhLWxhYmVsKS5cbiAgICovXG4gIEBJbnB1dCgpXG4gIHB1YmxpYyBhcmlhTGFiZWw6IHN0cmluZyB8IHVuZGVmaW5lZDtcblxuICAvKipcbiAgICogVGhlIEhUTUwgZWxlbWVudCBJRCBvZiB0aGUgZWxlbWVudCB0aGF0IGxhYmVsc1xuICAgKiB0aGUgdGFic2V0LiBUaGlzIHNldHMgdGhlIHRhYnNldCdzIGBhcmlhLWxhYmVsbGVkYnlgIGF0dHJpYnV0ZSB0byBwcm92aWRlIGEgdGV4dCBlcXVpdmFsZW50IGZvciBzY3JlZW4gcmVhZGVyc1xuICAgKiBbdG8gc3VwcG9ydCBhY2Nlc3NpYmlsaXR5XShodHRwczovL2RldmVsb3Blci5ibGFja2JhdWQuY29tL3NreXV4L2xlYXJuL2FjY2Vzc2liaWxpdHkpLlxuICAgKiBJZiB0aGUgdGFic2V0IGRvZXMgbm90IGluY2x1ZGUgYSB2aXNpYmxlIGxhYmVsLCB1c2UgYGFyaWFMYWJlbGAgaW5zdGVhZC5cbiAgICogRm9yIG1vcmUgaW5mb3JtYXRpb24gYWJvdXQgdGhlIGBhcmlhLWxhYmVsbGVkYnlgIGF0dHJpYnV0ZSwgc2VlIHRoZSBbV0FJLUFSSUEgZGVmaW5pdGlvbl0oaHR0cHM6Ly93d3cudzMub3JnL1RSL3dhaS1hcmlhLyNhcmlhLWxhYmVsbGVkYnkpLlxuICAgKi9cbiAgQElucHV0KClcbiAgcHVibGljIGFyaWFMYWJlbGxlZEJ5OiBzdHJpbmcgfCB1bmRlZmluZWQ7XG5cbiAgLyoqXG4gICAqIFRoZSBBUklBIHJvbGUgZm9yIHRoZSB2ZXJ0aWNhbCB0YWJzZXRcbiAgICogW3RvIHN1cHBvcnQgYWNjZXNzaWJpbGl0eV0oaHR0cHM6Ly9kZXZlbG9wZXIuYmxhY2tiYXVkLmNvbS9za3l1eC9sZWFybi9hY2Nlc3NpYmlsaXR5KVxuICAgKiBieSBpbmRpY2F0aW5nIGhvdyB0aGUgdGFic2V0IGZ1bmN0aW9ucyBhbmQgd2hhdCBpdCBjb250cm9scy4gRm9yIGluZm9ybWF0aW9uIGFib3V0IGhvd1xuICAgKiBhbiBBUklBIHJvbGUgaW5kaWNhdGVzIHdoYXQgYW4gaXRlbSByZXByZXNlbnRzIG9uIGEgd2ViIHBhZ2UsIHNlZSB0aGVcbiAgICogW1dBSS1BUklBIHJvbGVzIG1vZGVsXShodHRwczovL3d3dy53My5vcmcvV0FJL1BGL2FyaWEvI3JvbGVzKS5cbiAgICogQGRlZmF1bHQgXCJ0YWJsaXN0XCJcbiAgICogQGRlcHJlY2F0ZWQgQW55IG90aGVyIHZhbHVlIHRoYW4gYHRhYmxpc3RgIGNvdWxkIGxlYWQgdG8gYSBwb29yIHVzZXIgZXhwZXJpZW5jZSBmb3IgdXNlcnMgd2l0aCBhc3Npc3RpdmUgdGVjaG5vbG9neS5cbiAgICogSW4gdGhlIG5leHQgbWFqb3IgdmVyc2lvbiwgdGhpcyBwcm9wZXJ0eSB3aWxsIGJlIGF1dG9tYXRpY2FsbHkgc2V0IHRvIGB0YWJsaXN0YC5cbiAgICovXG4gIEBJbnB1dCgpXG4gIHB1YmxpYyBnZXQgYXJpYVJvbGUoKTogc3RyaW5nIHtcbiAgICByZXR1cm4gdGhpcy4jX2FyaWFSb2xlO1xuICB9XG5cbiAgcHVibGljIHNldCBhcmlhUm9sZSh2YWx1ZTogc3RyaW5nIHwgdW5kZWZpbmVkKSB7XG4gICAgdGhpcy4jX2FyaWFSb2xlID0gdmFsdWUgPz8gJ3RhYmxpc3QnO1xuICB9XG5cbiAgLyoqXG4gICAqIFdoZXRoZXIgdGhlIHZlcnRpY2FsIHRhYnNldCBsb2FkcyB0YWIgY29udGVudCBkdXJpbmcgaW5pdGlhbGl6YXRpb24gc28gdGhhdCBpdFxuICAgKiBkaXNwbGF5cyBjb250ZW50IHdpdGhvdXQgbW92aW5nIGFyb3VuZCBlbGVtZW50cyBpbiB0aGUgY29udGVudCBjb250YWluZXIuXG4gICAqIEBkZWZhdWx0IGZhbHNlXG4gICAqL1xuICBASW5wdXQoKVxuICBwdWJsaWMgbWFpbnRhaW5UYWJDb250ZW50OiBib29sZWFuIHwgdW5kZWZpbmVkID0gZmFsc2U7XG5cbiAgLyoqXG4gICAqIEZpcmVzIHdoZW4gdGhlIGFjdGl2ZSB0YWIgY2hhbmdlcy4gRW1pdHMgdGhlIGluZGV4IG9mIHRoZSBhY3RpdmUgdGFiLiBUaGVcbiAgICogaW5kZXggaXMgYmFzZWQgb24gdGhlIHRhYidzIHBvc2l0aW9uIHdoZW4gaXQgbG9hZHMuXG4gICAqL1xuICBAT3V0cHV0KClcbiAgcHVibGljIGFjdGl2ZUNoYW5nZSA9IG5ldyBFdmVudEVtaXR0ZXI8bnVtYmVyPigpO1xuXG4gIEBWaWV3Q2hpbGQoJ2dyb3VwQ29udGFpbmVyV3JhcHBlcicpXG4gIHB1YmxpYyB0YWJHcm91cHM6IEVsZW1lbnRSZWYgfCB1bmRlZmluZWQ7XG5cbiAgQFZpZXdDaGlsZCgnc2t5U2lkZUNvbnRlbnQnKVxuICBwdWJsaWMgY29udGVudDogRWxlbWVudFJlZiB8IHVuZGVmaW5lZDtcblxuICBAVmlld0NoaWxkKCdjb250ZW50Q29udGFpbmVyV3JhcHBlcicpXG4gIHB1YmxpYyBjb250ZW50V3JhcHBlcjogRWxlbWVudFJlZiB8IHVuZGVmaW5lZDtcblxuICBwdWJsaWMgYXJpYU93bnM6IHN0cmluZyB8IHVuZGVmaW5lZDtcblxuICBwdWJsaWMgaXNNb2JpbGUgPSBmYWxzZTtcblxuICBwcm90ZWN0ZWQgdGFibGlzdEhhc0ZvY3VzID0gZmFsc2U7XG5cbiAgI25nVW5zdWJzY3JpYmUgPSBuZXcgU3ViamVjdDx2b2lkPigpO1xuICAjX2FyaWFSb2xlID0gJ3RhYmxpc3QnO1xuXG4gICNyZXNvdXJjZXM6IFNreUxpYlJlc291cmNlc1NlcnZpY2U7XG4gICNjaGFuZ2VSZWY6IENoYW5nZURldGVjdG9yUmVmO1xuXG4gIGNvbnN0cnVjdG9yKFxuICAgIHB1YmxpYyBhZGFwdGVyU2VydmljZTogU2t5VmVydGljYWxUYWJzZXRBZGFwdGVyU2VydmljZSxcbiAgICBwdWJsaWMgdGFiU2VydmljZTogU2t5VmVydGljYWxUYWJzZXRTZXJ2aWNlLFxuICAgIHJlc291cmNlczogU2t5TGliUmVzb3VyY2VzU2VydmljZSxcbiAgICBjaGFuZ2VSZWY6IENoYW5nZURldGVjdG9yUmVmLFxuICAgIHB1YmxpYyB0YWJJZFN2YzogU2t5VGFiSWRTZXJ2aWNlLFxuICApIHtcbiAgICB0aGlzLiNyZXNvdXJjZXMgPSByZXNvdXJjZXM7XG4gICAgdGhpcy4jY2hhbmdlUmVmID0gY2hhbmdlUmVmO1xuICB9XG5cbiAgcHVibGljIG5nT25Jbml0KCk6IHZvaWQge1xuICAgIHRoaXMudGFiU2VydmljZS5tYWludGFpblRhYkNvbnRlbnQgPSB0aGlzLm1haW50YWluVGFiQ29udGVudDtcblxuICAgIHRoaXMudGFiU2VydmljZS5pbmRleENoYW5nZWRcbiAgICAgIC5waXBlKHRha2VVbnRpbCh0aGlzLiNuZ1Vuc3Vic2NyaWJlKSlcbiAgICAgIC5zdWJzY3JpYmUoKGluZGV4KSA9PiB7XG4gICAgICAgIHRoaXMuYWN0aXZlQ2hhbmdlLmVtaXQoaW5kZXgpO1xuICAgICAgICBpZiAodGhpcy5jb250ZW50V3JhcHBlcikge1xuICAgICAgICAgIHRoaXMuYWRhcHRlclNlcnZpY2Uuc2Nyb2xsVG9Db250ZW50VG9wKHRoaXMuY29udGVudFdyYXBwZXIpO1xuICAgICAgICB9XG4gICAgICAgIHRoaXMuI2NoYW5nZVJlZi5tYXJrRm9yQ2hlY2soKTtcbiAgICAgIH0pO1xuXG4gICAgdGhpcy50YWJTZXJ2aWNlLnN3aXRjaGluZ01vYmlsZVxuICAgICAgLnBpcGUodGFrZVVudGlsKHRoaXMuI25nVW5zdWJzY3JpYmUpKVxuICAgICAgLnN1YnNjcmliZSgobW9iaWxlOiBib29sZWFuKSA9PiB7XG4gICAgICAgIHRoaXMuaXNNb2JpbGUgPSBtb2JpbGU7XG4gICAgICAgIHRoaXMuI2NoYW5nZVJlZi5tYXJrRm9yQ2hlY2soKTtcbiAgICAgIH0pO1xuXG4gICAgaWYgKHRoaXMudGFiU2VydmljZS5pc01vYmlsZSgpKSB7XG4gICAgICB0aGlzLmlzTW9iaWxlID0gdHJ1ZTtcbiAgICAgIHRoaXMudGFiU2VydmljZS5hbmltYXRpb25Db250ZW50VmlzaWJsZVN0YXRlID0gVklTSUJMRV9TVEFURTtcbiAgICAgIHRoaXMuI2NoYW5nZVJlZi5tYXJrRm9yQ2hlY2soKTtcbiAgICB9XG4gICAgaWYgKCF0aGlzLnNob3dUYWJzVGV4dCkge1xuICAgICAgdGhpcy4jcmVzb3VyY2VzXG4gICAgICAgIC5nZXRTdHJpbmcoJ3NreXV4X3ZlcnRpY2FsX3RhYnNfc2hvd190YWJzX3RleHQnKVxuICAgICAgICAucGlwZSh0YWtlKDEpKVxuICAgICAgICAuc3Vic2NyaWJlKChyZXNvdXJjZSkgPT4ge1xuICAgICAgICAgIC8qIHNhbml0eSBjaGVjayAqL1xuICAgICAgICAgIC8qIGlzdGFuYnVsIGlnbm9yZSBlbHNlICovXG4gICAgICAgICAgaWYgKCF0aGlzLnNob3dUYWJzVGV4dCkge1xuICAgICAgICAgICAgdGhpcy5zaG93VGFic1RleHQgPSByZXNvdXJjZTtcbiAgICAgICAgICB9XG4gICAgICAgIH0pO1xuICAgIH1cbiAgfVxuXG4gIHB1YmxpYyBuZ0FmdGVyVmlld0NoZWNrZWQoKTogdm9pZCB7XG4gICAgdGhpcy50YWJTZXJ2aWNlLmNvbnRlbnQgPSB0aGlzLmNvbnRlbnQ7XG4gICAgdGhpcy50YWJTZXJ2aWNlLnVwZGF0ZUNvbnRlbnQoKTtcbiAgfVxuXG4gIHB1YmxpYyBuZ09uRGVzdHJveSgpOiB2b2lkIHtcbiAgICB0aGlzLiNuZ1Vuc3Vic2NyaWJlLm5leHQoKTtcbiAgICB0aGlzLiNuZ1Vuc3Vic2NyaWJlLmNvbXBsZXRlKCk7XG4gIH1cblxuICBwcm90ZWN0ZWQgdGFic2V0Rm9jdXMoKTogdm9pZCB7XG4gICAgdGhpcy50YWJTZXJ2aWNlLmZvY3VzQWN0aXZlVGFiKHRoaXMudGFiR3JvdXBzKTtcbiAgfVxuXG4gIHByb3RlY3RlZCB0YWJHcm91cHNGb2N1c0luKCk6IHZvaWQge1xuICAgIC8vIFRoaXMgd2lsbCBzZXQgdGhlIHRhYiBpbmRleCBvZiB0aGUgdGhlIHZlcnRpY2FsIHRhYnNldCBlbGVtZW50IHRvIC0xXG4gICAgLy8gd2hpbGUgZm9jdXMgaXMgaW5zaWRlIHRoZSB0YWIgbGlzdCwgYWxsb3dpbmcgU2hpZnQrVGFiIHRvIG1vdmVcbiAgICAvLyB0byB0aGUgbmV4dCBlbGVtZW50IGFib3ZlIHRoZSB0YWIgbGlzdCBlbGVtZW50LiBPdGhlcndpc2UgZm9jdXMgd291bGRcbiAgICAvLyBiZSB0cmFwcGVkIG9uIHRoZSBjdXJyZW50bHkgZm9jdXNlZCB0YWIuXG4gICAgdGhpcy50YWJsaXN0SGFzRm9jdXMgPSB0cnVlO1xuICB9XG5cbiAgcHJvdGVjdGVkIHRhYkdyb3Vwc0ZvY3VzT3V0KCk6IHZvaWQge1xuICAgIHRoaXMudGFibGlzdEhhc0ZvY3VzID0gZmFsc2U7XG4gIH1cblxuICBwcm90ZWN0ZWQgdGFiR3JvdXBzQXJyb3dEb3duKCk6IHZvaWQge1xuICAgIHRoaXMuYWRhcHRlclNlcnZpY2UuZm9jdXNOZXh0QnV0dG9uKHRoaXMudGFiR3JvdXBzKTtcbiAgfVxuXG4gIHByb3RlY3RlZCB0YWJHcm91cHNBcnJvd1VwKCk6IHZvaWQge1xuICAgIHRoaXMuYWRhcHRlclNlcnZpY2UuZm9jdXNQcmV2aW91c0J1dHRvbih0aGlzLnRhYkdyb3Vwcyk7XG4gIH1cbn1cbiIsIjxkaXZcbiAgY2xhc3M9XCJza3ktdmVydGljYWwtdGFic2V0XCJcbiAgW3RhYkluZGV4XT1cInRhYmxpc3RIYXNGb2N1cyA/IC0xIDogMFwiXG4gIChmb2N1cyk9XCJ0YWJzZXRGb2N1cygpXCJcbj5cbiAgPCEtLVxuICAgIEFSSUEgcnVsZXMgZG8gbm90IGFsbG93IHRhYnBhbmVsIGVsZW1lbnRzIHRvIGJlIGNoaWxkcmVuIG9mIGEgdGFibGlzdCBlbGVtZW50LlxuICAgIEhvd2V2ZXIsIHRoZSBtYXJrdXAgZm9yIGVhY2ggc2t5LXZlcnRpY2FsLXRhYiBjb21wb25lbnQgaW5jbHVkZXMgYm90aCB0aGUgdGFiIGJ1dHRvblxuICAgIGFuZCBpdHMgcGFuZWwsIG1ha2luZyB0aGUgcGFuZWwgZWxlbWVudCBhIGNoaWxkIG9mIGl0cyB0YWJsaXN0LiBNb3Jlb3Zlciwgb3VyXG4gICAgc2t5LXZlcnRpY2FsLXRhYiBjb21wb25lbnRzIGNhbiBiZSBncm91cGVkIHdpdGhpbiBjb2xsYXBzaWJsZSBjb250YWluZXJzLCB3aGljaCBhbHNvXG4gICAgdmlvbGF0ZXMgYWNjZXNzaWJpbGl0eSBydWxlcyBiZWNhdXNlIG9ubHkgdGFiIGJ1dHRvbnMgY2FuIGJlIGNoaWxkcmVuIG9mIGEgdGFibGlzdC5cbiAgICBUbyBhZGRyZXNzIHRoaXMsIHdlIGNyZWF0ZSBhbiBlbXB0eSB0YWJsaXN0IGVsZW1lbnQgd2l0aCBhbiBhcmlhLW93bnMgYXR0cmlidXRlLFxuICAgIHBvaW50aW5nIHRvIGVhY2ggdGFiIGVsZW1lbnQgaW5kaXZpZHVhbGx5LiBUaGF0IHdheSwgd2UgZG9uJ3QgaGF2ZSB0byB3b3JyeSBhYm91dCB0aGVcbiAgICBzdHJ1Y3R1cmUgZm9yIGVhY2ggc2t5LXZlcnRpY2FsLXRhYiBjb21wb25lbnQgaW4gb3JkZXIgdG8gc2F0aXNmeSBhY2Nlc3NpYmlsaXR5XG4gICAgZ3VpZGVsaW5lcy5cbiAgLS0+XG4gIDxzcGFuXG4gICAgYXJpYS1vcmllbnRhdGlvbj1cInZlcnRpY2FsXCJcbiAgICBjbGFzcz1cInNreS12ZXJ0aWNhbC10YWJzZXQtdGFibGlzdFwiXG4gICAgW2F0dHIuYXJpYS1sYWJlbF09XCJhcmlhTGFiZWxcIlxuICAgIFthdHRyLmFyaWEtbGFiZWxsZWRieV09XCJhcmlhTGFiZWxsZWRCeVwiXG4gICAgW2F0dHIuYXJpYS1vd25zXT1cIih0YWJJZFN2Yy5pZHMgfCBhc3luYyk/LmpvaW4oJyAnKSB8fCB1bmRlZmluZWRcIlxuICAgIFthdHRyLnJvbGVdPVwiaXNNb2JpbGUgPyB1bmRlZmluZWQgOiBhcmlhUm9sZVwiXG4gID48L3NwYW4+XG4gIDxkaXZcbiAgICAqbmdJZj1cIm1haW50YWluVGFiQ29udGVudCB8fCB0YWJTZXJ2aWNlLnRhYnNWaXNpYmxlKClcIlxuICAgIGNsYXNzPVwic2t5LXZlcnRpY2FsLXRhYnNldC1ncm91cC1jb250YWluZXJcIlxuICAgIFtAdGFiR3JvdXBFbnRlcl09XCJ0YWJTZXJ2aWNlLmFuaW1hdGlvblRhYnNWaXNpYmxlU3RhdGVcIlxuICAgIFtuZ0NsYXNzXT1cInsgJ3NreS12ZXJ0aWNhbC10YWJzZXQtaGlkZGVuJzogIXRhYlNlcnZpY2UudGFic1Zpc2libGUoKSB9XCJcbiAgICAoa2V5ZG93bi5hcnJvd2Rvd24pPVwidGFiR3JvdXBzQXJyb3dEb3duKCk7ICRldmVudC5wcmV2ZW50RGVmYXVsdCgpXCJcbiAgICAoa2V5ZG93bi5hcnJvd3VwKT1cInRhYkdyb3Vwc0Fycm93VXAoKTsgJGV2ZW50LnByZXZlbnREZWZhdWx0KClcIlxuICAgIChmb2N1c2luKT1cInRhYkdyb3Vwc0ZvY3VzSW4oKVwiXG4gICAgKGZvY3Vzb3V0KT1cInRhYkdyb3Vwc0ZvY3VzT3V0KClcIlxuICAgICNncm91cENvbnRhaW5lcldyYXBwZXJcbiAgPlxuICAgIDxuZy1jb250ZW50IC8+XG4gIDwvZGl2PlxuICA8ZGl2XG4gICAgKm5nSWY9XCJtYWludGFpblRhYkNvbnRlbnQgfHwgdGFiU2VydmljZS5jb250ZW50VmlzaWJsZSgpXCJcbiAgICBjbGFzcz1cInNreS12ZXJ0aWNhbC10YWJzZXQtY29udGVudFwiXG4gICAgW25nQ2xhc3NdPVwie1xuICAgICAgJ3NreS12ZXJ0aWNhbC10YWJzZXQtY29udGVudC1oaWRkZW4nOiAhdGFiU2VydmljZS5jb250ZW50VmlzaWJsZSgpXG4gICAgfVwiXG4gICAgW0Bjb250ZW50RW50ZXJdPVwidGFiU2VydmljZS5hbmltYXRpb25Db250ZW50VmlzaWJsZVN0YXRlXCJcbiAgICAjY29udGVudENvbnRhaW5lcldyYXBwZXJcbiAgPlxuICAgIDxkaXYgI3NreVNpZGVDb250ZW50PjwvZGl2PlxuICAgIDxidXR0b25cbiAgICAgICpuZ0lmPVwiIXRhYlNlcnZpY2UudGFic1Zpc2libGUoKVwiXG4gICAgICAoY2xpY2spPVwidGFiU2VydmljZS5zaG93VGFicygpXCJcbiAgICAgIGNsYXNzPVwic2t5LWJ0biBza3ktYnRuLXByaW1hcnkgc2t5LXZlcnRpY2FsLXRhYnNldC1zaG93LXRhYnMtYnRuXCJcbiAgICAgIHR5cGU9XCJidXR0b25cIlxuICAgID5cbiAgICAgIDxza3ktaWNvbiBpY29uPVwiY2hldnJvbi1sZWZ0XCIgLz5cbiAgICAgIHt7IHNob3dUYWJzVGV4dCB9fVxuICAgIDwvYnV0dG9uPlxuICA8L2Rpdj5cbjwvZGl2PlxuIl19
173
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidmVydGljYWwtdGFic2V0LmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uLy4uL2xpYnMvY29tcG9uZW50cy90YWJzL3NyYy9saWIvbW9kdWxlcy92ZXJ0aWNhbC10YWJzZXQvdmVydGljYWwtdGFic2V0LmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uLy4uLy4uL2xpYnMvY29tcG9uZW50cy90YWJzL3NyYy9saWIvbW9kdWxlcy92ZXJ0aWNhbC10YWJzZXQvdmVydGljYWwtdGFic2V0LmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxPQUFPLEVBQUUsS0FBSyxFQUFFLFVBQVUsRUFBRSxPQUFPLEVBQUUsTUFBTSxxQkFBcUIsQ0FBQztBQUMxRSxPQUFPLEVBRUwsdUJBQXVCLEVBRXZCLFNBQVMsRUFFVCxZQUFZLEVBQ1osS0FBSyxFQUdMLE1BQU0sRUFDTixTQUFTLEdBQ1YsTUFBTSxlQUFlLENBQUM7QUFHdkIsT0FBTyxFQUFFLE9BQU8sRUFBRSxNQUFNLE1BQU0sQ0FBQztBQUMvQixPQUFPLEVBQUUsSUFBSSxFQUFFLFNBQVMsRUFBRSxNQUFNLGdCQUFnQixDQUFDO0FBRWpELE9BQU8sRUFBRSxlQUFlLEVBQUUsTUFBTSwwQkFBMEIsQ0FBQztBQUczRCxPQUFPLEVBQ0wsWUFBWSxFQUNaLHdCQUF3QixFQUN4QixhQUFhLEdBQ2QsTUFBTSwyQkFBMkIsQ0FBQzs7Ozs7Ozs7QUF1Qm5DLE1BQU0sT0FBTywwQkFBMEI7SUE0QnJDOzs7Ozs7Ozs7T0FTRztJQUNILElBQ1csUUFBUTtRQUNqQixPQUFPLElBQUksQ0FBQyxVQUFVLENBQUM7SUFDekIsQ0FBQztJQUVELElBQVcsUUFBUSxDQUFDLEtBQXlCO1FBQzNDLElBQUksQ0FBQyxVQUFVLEdBQUcsS0FBSyxJQUFJLFNBQVMsQ0FBQztJQUN2QyxDQUFDO0lBZ0NELGNBQWMsQ0FBdUI7SUFD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RkFFVSwwQkFBMEI7a0JBckJ0QyxTQUFTOytCQUNFLHFCQUFxQixhQUdwQixDQUFDLGVBQWUsRUFBRSx3QkFBd0IsQ0FBQyxtQkFDckMsdUJBQXVCLENBQUMsTUFBTSxjQUNuQzt3QkFDVixPQUFPLENBQUMsZUFBZSxFQUFFOzRCQUN2QixVQUFVLENBQUMsR0FBRyxZQUFZLE9BQU8sYUFBYSxFQUFFLEVBQUU7Z0NBQ2hELEtBQUssQ0FBQyxFQUFFLFNBQVMsRUFBRSxrQkFBa0IsRUFBRSxDQUFDO2dDQUN4QyxPQUFPLENBQUMsZUFBZSxDQUFDOzZCQUN6QixDQUFDO3lCQUNILENBQUM7d0JBQ0YsT0FBTyxDQUFDLGNBQWMsRUFBRTs0QkFDdEIsVUFBVSxDQUFDLEdBQUcsWUFBWSxPQUFPLGFBQWEsRUFBRSxFQUFFO2dDQUNoRCxLQUFLLENBQUMsRUFBRSxTQUFTLEVBQUUsaUJBQWlCLEVBQUUsQ0FBQztnQ0FDdkMsT0FBTyxDQUFDLGVBQWUsQ0FBQzs2QkFDekIsQ0FBQzt5QkFDSCxDQUFDO3FCQUNIOzhPQVNNLFlBQVk7c0JBRGxCLEtBQUs7Z0JBVUMsU0FBUztzQkFEZixLQUFLO2dCQVdDLGNBQWM7c0JBRHBCLEtBQUs7Z0JBY0ssUUFBUTtzQkFEbEIsS0FBSztnQkFlQyxrQkFBa0I7c0JBRHhCLEtBQUs7Z0JBUUMsWUFBWTtzQkFEbEIsTUFBTTtnQkFJQSxTQUFTO3NCQURmLFNBQVM7dUJBQUMsdUJBQXVCO2dCQUkzQixPQUFPO3NCQURiLFNBQVM7dUJBQUMsZ0JBQWdCO2dCQUlwQixjQUFjO3NCQURwQixTQUFTO3VCQUFDLHlCQUF5QiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGFuaW1hdGUsIHN0eWxlLCB0cmFuc2l0aW9uLCB0cmlnZ2VyIH0gZnJvbSAnQGFuZ3VsYXIvYW5pbWF0aW9ucyc7XG5pbXBvcnQge1xuICBBZnRlclZpZXdDaGVja2VkLFxuICBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSxcbiAgQ2hhbmdlRGV0ZWN0b3JSZWYsXG4gIENvbXBvbmVudCxcbiAgRWxlbWVudFJlZixcbiAgRXZlbnRFbWl0dGVyLFxuICBJbnB1dCxcbiAgT25EZXN0cm95LFxuICBPbkluaXQsXG4gIE91dHB1dCxcbiAgVmlld0NoaWxkLFxufSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IFNreUxpYlJlc291cmNlc1NlcnZpY2UgfSBmcm9tICdAc2t5dXgvaTE4bic7XG5cbmltcG9ydCB7IFN1YmplY3QgfSBmcm9tICdyeGpzJztcbmltcG9ydCB7IHRha2UsIHRha2VVbnRpbCB9IGZyb20gJ3J4anMvb3BlcmF0b3JzJztcblxuaW1wb3J0IHsgU2t5VGFiSWRTZXJ2aWNlIH0gZnJvbSAnLi4vc2hhcmVkL3RhYi1pZC5zZXJ2aWNlJztcblxuaW1wb3J0IHsgU2t5VmVydGljYWxUYWJzZXRBZGFwdGVyU2VydmljZSB9IGZyb20gJy4vdmVydGljYWwtdGFic2V0LWFkYXB0ZXIuc2VydmljZSc7XG5pbXBvcnQge1xuICBISURERU5fU1RBVEUsXG4gIFNreVZlcnRpY2FsVGFic2V0U2VydmljZSxcbiAgVklTSUJMRV9TVEFURSxcbn0gZnJvbSAnLi92ZXJ0aWNhbC10YWJzZXQuc2VydmljZSc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ3NreS12ZXJ0aWNhbC10YWJzZXQnLFxuICB0ZW1wbGF0ZVVybDogJy4vdmVydGljYWwtdGFic2V0LmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vdmVydGljYWwtdGFic2V0LmNvbXBvbmVudC5zY3NzJ10sXG4gIHByb3ZpZGVyczogW1NreVRhYklkU2VydmljZSwgU2t5VmVydGljYWxUYWJzZXRTZXJ2aWNlXSxcbiAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG4gIGFuaW1hdGlvbnM6IFtcbiAgICB0cmlnZ2VyKCd0YWJHcm91cEVudGVyJywgW1xuICAgICAgdHJhbnNpdGlvbihgJHtISURERU5fU1RBVEV9ID0+ICR7VklTSUJMRV9TVEFURX1gLCBbXG4gICAgICAgIHN0eWxlKHsgdHJhbnNmb3JtOiAndHJhbnNsYXRlKC0xMDAlKScgfSksXG4gICAgICAgIGFuaW1hdGUoJzE1MG1zIGVhc2UtaW4nKSxcbiAgICAgIF0pLFxuICAgIF0pLFxuICAgIHRyaWdnZXIoJ2NvbnRlbnRFbnRlcicsIFtcbiAgICAgIHRyYW5zaXRpb24oYCR7SElEREVOX1NUQVRFfSA9PiAke1ZJU0lCTEVfU1RBVEV9YCwgW1xuICAgICAgICBzdHlsZSh7IHRyYW5zZm9ybTogJ3RyYW5zbGF0ZSgxMDAlKScgfSksXG4gICAgICAgIGFuaW1hdGUoJzE1MG1zIGVhc2UtaW4nKSxcbiAgICAgIF0pLFxuICAgIF0pLFxuICBdLFxufSlcbmV4cG9ydCBjbGFzcyBTa3lWZXJ0aWNhbFRhYnNldENvbXBvbmVudFxuICBpbXBsZW1lbnRzIE9uSW5pdCwgQWZ0ZXJWaWV3Q2hlY2tlZCwgT25EZXN0cm95XG57XG4gIC8qKlxuICAgKiBUaGUgdGV4dCB0byBkaXNwbGF5IG9uIHRoZSBzaG93IHRhYnMgYnV0dG9uIG9uIG1vYmlsZSBkZXZpY2VzLlxuICAgKi9cbiAgQElucHV0KClcbiAgcHVibGljIHNob3dUYWJzVGV4dDogc3RyaW5nIHwgdW5kZWZpbmVkO1xuXG4gIC8qKlxuICAgKiBUaGUgQVJJQSBsYWJlbCBmb3IgdGhlIHRhYnNldC4gVGhpcyBzZXRzIHRoZSB0YWJzZXQncyBgYXJpYS1sYWJlbGAgYXR0cmlidXRlIHRvIHByb3ZpZGUgYSB0ZXh0IGVxdWl2YWxlbnQgZm9yIHNjcmVlbiByZWFkZXJzXG4gICAqIFt0byBzdXBwb3J0IGFjY2Vzc2liaWxpdHldKGh0dHBzOi8vZGV2ZWxvcGVyLmJsYWNrYmF1ZC5jb20vc2t5dXgvbGVhcm4vYWNjZXNzaWJpbGl0eSkuXG4gICAqIElmIHRoZSB0YWJzZXQgaW5jbHVkZXMgYSB2aXNpYmxlIGxhYmVsLCB1c2UgYGFyaWFMYWJlbGxlZEJ5YCBpbnN0ZWFkLlxuICAgKiBGb3IgbW9yZSBpbmZvcm1hdGlvbiBhYm91dCB0aGUgYGFyaWEtbGFiZWxgIGF0dHJpYnV0ZSwgc2VlIHRoZSBbV0FJLUFSSUEgZGVmaW5pdGlvbl0oaHR0cHM6Ly93d3cudzMub3JnL1RSL3dhaS1hcmlhLyNhcmlhLWxhYmVsKS5cbiAgICovXG4gIEBJbnB1dCgpXG4gIHB1YmxpYyBhcmlhTGFiZWw6IHN0cmluZyB8IHVuZGVmaW5lZDtcblxuICAvKipcbiAgICogVGhlIEhUTUwgZWxlbWVudCBJRCBvZiB0aGUgZWxlbWVudCB0aGF0IGxhYmVsc1xuICAgKiB0aGUgdGFic2V0LiBUaGlzIHNldHMgdGhlIHRhYnNldCdzIGBhcmlhLWxhYmVsbGVkYnlgIGF0dHJpYnV0ZSB0byBwcm92aWRlIGEgdGV4dCBlcXVpdmFsZW50IGZvciBzY3JlZW4gcmVhZGVyc1xuICAgKiBbdG8gc3VwcG9ydCBhY2Nlc3NpYmlsaXR5XShodHRwczovL2RldmVsb3Blci5ibGFja2JhdWQuY29tL3NreXV4L2xlYXJuL2FjY2Vzc2liaWxpdHkpLlxuICAgKiBJZiB0aGUgdGFic2V0IGRvZXMgbm90IGluY2x1ZGUgYSB2aXNpYmxlIGxhYmVsLCB1c2UgYGFyaWFMYWJlbGAgaW5zdGVhZC5cbiAgICogRm9yIG1vcmUgaW5mb3JtYXRpb24gYWJvdXQgdGhlIGBhcmlhLWxhYmVsbGVkYnlgIGF0dHJpYnV0ZSwgc2VlIHRoZSBbV0FJLUFSSUEgZGVmaW5pdGlvbl0oaHR0cHM6Ly93d3cudzMub3JnL1RSL3dhaS1hcmlhLyNhcmlhLWxhYmVsbGVkYnkpLlxuICAgKi9cbiAgQElucHV0KClcbiAgcHVibGljIGFyaWFMYWJlbGxlZEJ5OiBzdHJpbmcgfCB1bmRlZmluZWQ7XG5cbiAgLyoqXG4gICAqIFRoZSBBUklBIHJvbGUgZm9yIHRoZSB2ZXJ0aWNhbCB0YWJzZXRcbiAgICogW3RvIHN1cHBvcnQgYWNjZXNzaWJpbGl0eV0oaHR0cHM6Ly9kZXZlbG9wZXIuYmxhY2tiYXVkLmNvbS9za3l1eC9sZWFybi9hY2Nlc3NpYmlsaXR5KVxuICAgKiBieSBpbmRpY2F0aW5nIGhvdyB0aGUgdGFic2V0IGZ1bmN0aW9ucyBhbmQgd2hhdCBpdCBjb250cm9scy4gRm9yIGluZm9ybWF0aW9uIGFib3V0IGhvd1xuICAgKiBhbiBBUklBIHJvbGUgaW5kaWNhdGVzIHdoYXQgYW4gaXRlbSByZXByZXNlbnRzIG9uIGEgd2ViIHBhZ2UsIHNlZSB0aGVcbiAgICogW1dBSS1BUklBIHJvbGVzIG1vZGVsXShodHRwczovL3d3dy53My5vcmcvV0FJL1BGL2FyaWEvI3JvbGVzKS5cbiAgICogQGRlZmF1bHQgXCJ0YWJsaXN0XCJcbiAgICogQGRlcHJlY2F0ZWQgQW55IG90aGVyIHZhbHVlIHRoYW4gYHRhYmxpc3RgIGNvdWxkIGxlYWQgdG8gYSBwb29yIHVzZXIgZXhwZXJpZW5jZSBmb3IgdXNlcnMgd2l0aCBhc3Npc3RpdmUgdGVjaG5vbG9neS5cbiAgICogSW4gdGhlIG5leHQgbWFqb3IgdmVyc2lvbiwgdGhpcyBwcm9wZXJ0eSB3aWxsIGJlIGF1dG9tYXRpY2FsbHkgc2V0IHRvIGB0YWJsaXN0YC5cbiAgICovXG4gIEBJbnB1dCgpXG4gIHB1YmxpYyBnZXQgYXJpYVJvbGUoKTogc3RyaW5nIHtcbiAgICByZXR1cm4gdGhpcy4jX2FyaWFSb2xlO1xuICB9XG5cbiAgcHVibGljIHNldCBhcmlhUm9sZSh2YWx1ZTogc3RyaW5nIHwgdW5kZWZpbmVkKSB7XG4gICAgdGhpcy4jX2FyaWFSb2xlID0gdmFsdWUgPz8gJ3RhYmxpc3QnO1xuICB9XG5cbiAgLyoqXG4gICAqIFdoZXRoZXIgdGhlIHZlcnRpY2FsIHRhYnNldCBsb2FkcyB0YWIgY29udGVudCBkdXJpbmcgaW5pdGlhbGl6YXRpb24gc28gdGhhdCBpdFxuICAgKiBkaXNwbGF5cyBjb250ZW50IHdpdGhvdXQgbW92aW5nIGFyb3VuZCBlbGVtZW50cyBpbiB0aGUgY29udGVudCBjb250YWluZXIuXG4gICAqIEBkZWZhdWx0IGZhbHNlXG4gICAqL1xuICBASW5wdXQoKVxuICBwdWJsaWMgbWFpbnRhaW5UYWJDb250ZW50OiBib29sZWFuIHwgdW5kZWZpbmVkID0gZmFsc2U7XG5cbiAgLyoqXG4gICAqIEZpcmVzIHdoZW4gdGhlIGFjdGl2ZSB0YWIgY2hhbmdlcy4gRW1pdHMgdGhlIGluZGV4IG9mIHRoZSBhY3RpdmUgdGFiLiBUaGVcbiAgICogaW5kZXggaXMgYmFzZWQgb24gdGhlIHRhYidzIHBvc2l0aW9uIHdoZW4gaXQgbG9hZHMuXG4gICAqL1xuICBAT3V0cHV0KClcbiAgcHVibGljIGFjdGl2ZUNoYW5nZSA9IG5ldyBFdmVudEVtaXR0ZXI8bnVtYmVyPigpO1xuXG4gIEBWaWV3Q2hpbGQoJ2dyb3VwQ29udGFpbmVyV3JhcHBlcicpXG4gIHB1YmxpYyB0YWJHcm91cHM6IEVsZW1lbnRSZWYgfCB1bmRlZmluZWQ7XG5cbiAgQFZpZXdDaGlsZCgnc2t5U2lkZUNvbnRlbnQnKVxuICBwdWJsaWMgY29udGVudDogRWxlbWVudFJlZiB8IHVuZGVmaW5lZDtcblxuICBAVmlld0NoaWxkKCdjb250ZW50Q29udGFpbmVyV3JhcHBlcicpXG4gIHB1YmxpYyBjb250ZW50V3JhcHBlcjogRWxlbWVudFJlZiB8IHVuZGVmaW5lZDtcblxuICBwdWJsaWMgYXJpYU93bnM6IHN0cmluZyB8IHVuZGVmaW5lZDtcblxuICBwdWJsaWMgaXNNb2JpbGUgPSBmYWxzZTtcblxuICBwcm90ZWN0ZWQgdGFibGlzdEhhc0ZvY3VzID0gZmFsc2U7XG5cbiAgI25nVW5zdWJzY3JpYmUgPSBuZXcgU3ViamVjdDx2b2lkPigpO1xuICAjX2FyaWFSb2xlID0gJ3RhYmxpc3QnO1xuXG4gICNyZXNvdXJjZXM6IFNreUxpYlJlc291cmNlc1NlcnZpY2U7XG4gICNjaGFuZ2VSZWY6IENoYW5nZURldGVjdG9yUmVmO1xuXG4gIGNvbnN0cnVjdG9yKFxuICAgIHB1YmxpYyBhZGFwdGVyU2VydmljZTogU2t5VmVydGljYWxUYWJzZXRBZGFwdGVyU2VydmljZSxcbiAgICBwdWJsaWMgdGFiU2VydmljZTogU2t5VmVydGljYWxUYWJzZXRTZXJ2aWNlLFxuICAgIHJlc291cmNlczogU2t5TGliUmVzb3VyY2VzU2VydmljZSxcbiAgICBjaGFuZ2VSZWY6IENoYW5nZURldGVjdG9yUmVmLFxuICAgIHB1YmxpYyB0YWJJZFN2YzogU2t5VGFiSWRTZXJ2aWNlLFxuICApIHtcbiAgICB0aGlzLiNyZXNvdXJjZXMgPSByZXNvdXJjZXM7XG4gICAgdGhpcy4jY2hhbmdlUmVmID0gY2hhbmdlUmVmO1xuICB9XG5cbiAgcHVibGljIG5nT25Jbml0KCk6IHZvaWQge1xuICAgIHRoaXMudGFiU2VydmljZS5tYWludGFpblRhYkNvbnRlbnQgPSB0aGlzLm1haW50YWluVGFiQ29udGVudDtcblxuICAgIHRoaXMudGFiU2VydmljZS5pbmRleENoYW5nZWRcbiAgICAgIC5waXBlKHRha2VVbnRpbCh0aGlzLiNuZ1Vuc3Vic2NyaWJlKSlcbiAgICAgIC5zdWJzY3JpYmUoKGluZGV4KSA9PiB7XG4gICAgICAgIHRoaXMuYWN0aXZlQ2hhbmdlLmVtaXQoaW5kZXgpO1xuICAgICAgICBpZiAodGhpcy5jb250ZW50V3JhcHBlcikge1xuICAgICAgICAgIHRoaXMuYWRhcHRlclNlcnZpY2Uuc2Nyb2xsVG9Db250ZW50VG9wKHRoaXMuY29udGVudFdyYXBwZXIpO1xuICAgICAgICB9XG4gICAgICAgIHRoaXMuI2NoYW5nZVJlZi5tYXJrRm9yQ2hlY2soKTtcbiAgICAgIH0pO1xuXG4gICAgdGhpcy50YWJTZXJ2aWNlLnN3aXRjaGluZ01vYmlsZVxuICAgICAgLnBpcGUodGFrZVVudGlsKHRoaXMuI25nVW5zdWJzY3JpYmUpKVxuICAgICAgLnN1YnNjcmliZSgobW9iaWxlOiBib29sZWFuKSA9PiB7XG4gICAgICAgIHRoaXMuaXNNb2JpbGUgPSBtb2JpbGU7XG4gICAgICAgIHRoaXMuI2NoYW5nZVJlZi5tYXJrRm9yQ2hlY2soKTtcbiAgICAgIH0pO1xuXG4gICAgaWYgKHRoaXMudGFiU2VydmljZS5pc01vYmlsZSgpKSB7XG4gICAgICB0aGlzLmlzTW9iaWxlID0gdHJ1ZTtcbiAgICAgIHRoaXMudGFiU2VydmljZS5hbmltYXRpb25Db250ZW50VmlzaWJsZVN0YXRlID0gVklTSUJMRV9TVEFURTtcbiAgICAgIHRoaXMuI2NoYW5nZVJlZi5tYXJrRm9yQ2hlY2soKTtcbiAgICB9XG4gICAgaWYgKCF0aGlzLnNob3dUYWJzVGV4dCkge1xuICAgICAgdGhpcy4jcmVzb3VyY2VzXG4gICAgICAgIC5nZXRTdHJpbmcoJ3NreXV4X3ZlcnRpY2FsX3RhYnNfc2hvd190YWJzX3RleHQnKVxuICAgICAgICAucGlwZSh0YWtlKDEpKVxuICAgICAgICAuc3Vic2NyaWJlKChyZXNvdXJjZSkgPT4ge1xuICAgICAgICAgIC8qIHNhbml0eSBjaGVjayAqL1xuICAgICAgICAgIC8qIGlzdGFuYnVsIGlnbm9yZSBlbHNlICovXG4gICAgICAgICAgaWYgKCF0aGlzLnNob3dUYWJzVGV4dCkge1xuICAgICAgICAgICAgdGhpcy5zaG93VGFic1RleHQgPSByZXNvdXJjZTtcbiAgICAgICAgICB9XG4gICAgICAgIH0pO1xuICAgIH1cbiAgfVxuXG4gIHB1YmxpYyBuZ0FmdGVyVmlld0NoZWNrZWQoKTogdm9pZCB7XG4gICAgdGhpcy50YWJTZXJ2aWNlLmNvbnRlbnQgPSB0aGlzLmNvbnRlbnQ7XG4gICAgdGhpcy50YWJTZXJ2aWNlLnVwZGF0ZUNvbnRlbnQoKTtcbiAgfVxuXG4gIHB1YmxpYyBuZ09uRGVzdHJveSgpOiB2b2lkIHtcbiAgICB0aGlzLiNuZ1Vuc3Vic2NyaWJlLm5leHQoKTtcbiAgICB0aGlzLiNuZ1Vuc3Vic2NyaWJlLmNvbXBsZXRlKCk7XG4gIH1cblxuICBwcm90ZWN0ZWQgdGFic2V0Rm9jdXMoKTogdm9pZCB7XG4gICAgdGhpcy50YWJTZXJ2aWNlLmZvY3VzQWN0aXZlVGFiKHRoaXMudGFiR3JvdXBzKTtcbiAgfVxuXG4gIHByb3RlY3RlZCB0YWJHcm91cHNGb2N1c0luKCk6IHZvaWQge1xuICAgIC8vIFRoaXMgd2lsbCBzZXQgdGhlIHRhYiBpbmRleCBvZiB0aGUgdGhlIHZlcnRpY2FsIHRhYnNldCBlbGVtZW50IHRvIC0xXG4gICAgLy8gd2hpbGUgZm9jdXMgaXMgaW5zaWRlIHRoZSB0YWIgbGlzdCwgYWxsb3dpbmcgU2hpZnQrVGFiIHRvIG1vdmVcbiAgICAvLyB0byB0aGUgbmV4dCBlbGVtZW50IGFib3ZlIHRoZSB0YWIgbGlzdCBlbGVtZW50LiBPdGhlcndpc2UgZm9jdXMgd291bGRcbiAgICAvLyBiZSB0cmFwcGVkIG9uIHRoZSBjdXJyZW50bHkgZm9jdXNlZCB0YWIuXG4gICAgdGhpcy50YWJsaXN0SGFzRm9jdXMgPSB0cnVlO1xuICB9XG5cbiAgcHJvdGVjdGVkIHRhYkdyb3Vwc0ZvY3VzT3V0KCk6IHZvaWQge1xuICAgIHRoaXMudGFibGlzdEhhc0ZvY3VzID0gZmFsc2U7XG4gIH1cblxuICBwcm90ZWN0ZWQgdGFiR3JvdXBzQXJyb3dEb3duKCk6IHZvaWQge1xuICAgIHRoaXMuYWRhcHRlclNlcnZpY2UuZm9jdXNOZXh0QnV0dG9uKHRoaXMudGFiR3JvdXBzKTtcbiAgfVxuXG4gIHByb3RlY3RlZCB0YWJHcm91cHNBcnJvd1VwKCk6IHZvaWQge1xuICAgIHRoaXMuYWRhcHRlclNlcnZpY2UuZm9jdXNQcmV2aW91c0J1dHRvbih0aGlzLnRhYkdyb3Vwcyk7XG4gIH1cbn1cbiIsIjxkaXZcbiAgY2xhc3M9XCJza3ktdmVydGljYWwtdGFic2V0XCJcbiAgW3RhYkluZGV4XT1cInRhYmxpc3RIYXNGb2N1cyA/IC0xIDogMFwiXG4gIChmb2N1cyk9XCJ0YWJzZXRGb2N1cygpXCJcbj5cbiAgPCEtLVxuICAgIEFSSUEgcnVsZXMgZG8gbm90IGFsbG93IHRhYnBhbmVsIGVsZW1lbnRzIHRvIGJlIGNoaWxkcmVuIG9mIGEgdGFibGlzdCBlbGVtZW50LlxuICAgIEhvd2V2ZXIsIHRoZSBtYXJrdXAgZm9yIGVhY2ggc2t5LXZlcnRpY2FsLXRhYiBjb21wb25lbnQgaW5jbHVkZXMgYm90aCB0aGUgdGFiIGJ1dHRvblxuICAgIGFuZCBpdHMgcGFuZWwsIG1ha2luZyB0aGUgcGFuZWwgZWxlbWVudCBhIGNoaWxkIG9mIGl0cyB0YWJsaXN0LiBNb3Jlb3Zlciwgb3VyXG4gICAgc2t5LXZlcnRpY2FsLXRhYiBjb21wb25lbnRzIGNhbiBiZSBncm91cGVkIHdpdGhpbiBjb2xsYXBzaWJsZSBjb250YWluZXJzLCB3aGljaCBhbHNvXG4gICAgdmlvbGF0ZXMgYWNjZXNzaWJpbGl0eSBydWxlcyBiZWNhdXNlIG9ubHkgdGFiIGJ1dHRvbnMgY2FuIGJlIGNoaWxkcmVuIG9mIGEgdGFibGlzdC5cbiAgICBUbyBhZGRyZXNzIHRoaXMsIHdlIGNyZWF0ZSBhbiBlbXB0eSB0YWJsaXN0IGVsZW1lbnQgd2l0aCBhbiBhcmlhLW93bnMgYXR0cmlidXRlLFxuICAgIHBvaW50aW5nIHRvIGVhY2ggdGFiIGVsZW1lbnQgaW5kaXZpZHVhbGx5LiBUaGF0IHdheSwgd2UgZG9uJ3QgaGF2ZSB0byB3b3JyeSBhYm91dCB0aGVcbiAgICBzdHJ1Y3R1cmUgZm9yIGVhY2ggc2t5LXZlcnRpY2FsLXRhYiBjb21wb25lbnQgaW4gb3JkZXIgdG8gc2F0aXNmeSBhY2Nlc3NpYmlsaXR5XG4gICAgZ3VpZGVsaW5lcy5cbiAgLS0+XG4gIDxzcGFuXG4gICAgYXJpYS1vcmllbnRhdGlvbj1cInZlcnRpY2FsXCJcbiAgICBjbGFzcz1cInNreS12ZXJ0aWNhbC10YWJzZXQtdGFibGlzdFwiXG4gICAgW2F0dHIuYXJpYS1sYWJlbF09XCJhcmlhTGFiZWxcIlxuICAgIFthdHRyLmFyaWEtbGFiZWxsZWRieV09XCJhcmlhTGFiZWxsZWRCeVwiXG4gICAgW2F0dHIuYXJpYS1vd25zXT1cIih0YWJJZFN2Yy5pZHMgfCBhc3luYyk/LmpvaW4oJyAnKSB8fCB1bmRlZmluZWRcIlxuICAgIFthdHRyLnJvbGVdPVwiaXNNb2JpbGUgPyB1bmRlZmluZWQgOiBhcmlhUm9sZVwiXG4gID48L3NwYW4+XG4gIDxkaXZcbiAgICAqbmdJZj1cIm1haW50YWluVGFiQ29udGVudCB8fCB0YWJTZXJ2aWNlLnRhYnNWaXNpYmxlKClcIlxuICAgIGNsYXNzPVwic2t5LXZlcnRpY2FsLXRhYnNldC1ncm91cC1jb250YWluZXJcIlxuICAgIFtAdGFiR3JvdXBFbnRlcl09XCJ0YWJTZXJ2aWNlLmFuaW1hdGlvblRhYnNWaXNpYmxlU3RhdGVcIlxuICAgIFtuZ0NsYXNzXT1cInsgJ3NreS12ZXJ0aWNhbC10YWJzZXQtaGlkZGVuJzogIXRhYlNlcnZpY2UudGFic1Zpc2libGUoKSB9XCJcbiAgICAoa2V5ZG93bi5hcnJvd2Rvd24pPVwidGFiR3JvdXBzQXJyb3dEb3duKCk7ICRldmVudC5wcmV2ZW50RGVmYXVsdCgpXCJcbiAgICAoa2V5ZG93bi5hcnJvd3VwKT1cInRhYkdyb3Vwc0Fycm93VXAoKTsgJGV2ZW50LnByZXZlbnREZWZhdWx0KClcIlxuICAgIChmb2N1c2luKT1cInRhYkdyb3Vwc0ZvY3VzSW4oKVwiXG4gICAgKGZvY3Vzb3V0KT1cInRhYkdyb3Vwc0ZvY3VzT3V0KClcIlxuICAgICNncm91cENvbnRhaW5lcldyYXBwZXJcbiAgPlxuICAgIDxuZy1jb250ZW50IC8+XG4gIDwvZGl2PlxuICA8ZGl2XG4gICAgKm5nSWY9XCJtYWludGFpblRhYkNvbnRlbnQgfHwgdGFiU2VydmljZS5jb250ZW50VmlzaWJsZSgpXCJcbiAgICBjbGFzcz1cInNreS12ZXJ0aWNhbC10YWJzZXQtY29udGVudFwiXG4gICAgW25nQ2xhc3NdPVwie1xuICAgICAgJ3NreS12ZXJ0aWNhbC10YWJzZXQtY29udGVudC1oaWRkZW4nOiAhdGFiU2VydmljZS5jb250ZW50VmlzaWJsZSgpXG4gICAgfVwiXG4gICAgW0Bjb250ZW50RW50ZXJdPVwidGFiU2VydmljZS5hbmltYXRpb25Db250ZW50VmlzaWJsZVN0YXRlXCJcbiAgICAjY29udGVudENvbnRhaW5lcldyYXBwZXJcbiAgPlxuICAgIDxkaXYgI3NreVNpZGVDb250ZW50PjwvZGl2PlxuICAgIDxidXR0b25cbiAgICAgICpuZ0lmPVwiIXRhYlNlcnZpY2UudGFic1Zpc2libGUoKVwiXG4gICAgICAoY2xpY2spPVwidGFiU2VydmljZS5zaG93VGFicygpXCJcbiAgICAgIGNsYXNzPVwic2t5LWJ0biBza3ktYnRuLXByaW1hcnkgc2t5LXZlcnRpY2FsLXRhYnNldC1zaG93LXRhYnMtYnRuXCJcbiAgICAgIHR5cGU9XCJidXR0b25cIlxuICAgID5cbiAgICAgIDxza3ktaWNvbiBpY29uPVwiY2hldnJvbi1sZWZ0XCIgLz5cbiAgICAgIHt7IHNob3dUYWJzVGV4dCB9fVxuICAgIDwvYnV0dG9uPlxuICA8L2Rpdj5cbjwvZGl2PlxuIl19
package/fesm2022/skyux-tabs.mjs CHANGED
@@ -670,7 +670,7 @@ class SkyVerticalTabComponent {
670
670
  provide: SkyMediaQueryService,
671
671
  useExisting: SkyVerticalTabMediaQueryService,
672
672
  },
673
- ], viewQueries: [{ propertyName: "tabButton", first: true, predicate: ["tabButton"], descendants: true }, { propertyName: "tabContent", first: true, predicate: ["tabContentWrapper"], descendants: true }], ngImport: i0, template: "<a\n class=\"sky-vertical-tab sky-vertical-tabset-button\"\n [attr.aria-controls]=\"isMobile ? null : ariaControls || tabContentPane.id\"\n [attr.aria-disabled]=\"disabled || undefined\"\n [attr.aria-selected]=\"active\"\n [attr.id]=\"tabId\"\n [attr.role]=\"isMobile ? undefined : ariaRole\"\n [ngClass]=\"{\n 'sky-vertical-tab-active': active,\n 'sky-vertical-tabset-button-disabled': disabled,\n 'sky-font-deemphasized': disabled,\n 'sky-deemphasized': disabled\n }\"\n [tabIndex]=\"-1\"\n (click)=\"activateTab()\"\n (keyup.arrowleft)=\"tabButtonArrowLeft($event)\"\n (keyup.enter)=\"tabButtonActivate($event)\"\n (keyup.space)=\"tabButtonActivate($event)\"\n #tabButton\n>\n <div class=\"sky-vertical-tab-display\">\n <div class=\"sky-vertical-tab-heading\">\n <span class=\"sky-vertical-tab-heading-value\">{{ tabHeading }}</span>\n <span\n class=\"sky-vertical-tab-count\"\n *ngIf=\"tabHeaderCount || tabHeaderCount === 0\"\n >\n ({{ tabHeaderCount }})\n </span>\n </div>\n <sky-status-indicator\n *ngIf=\"errorIndicator\"\n class=\"sky-vertical-tab-heading-error\"\n descriptionType=\"error\"\n indicatorType=\"danger\"\n ></sky-status-indicator>\n <sky-icon\n *ngIf=\"isMobile && showTabRightArrow\"\n class=\"sky-vertical-tab-right-arrow\"\n icon=\"chevron-right\"\n />\n </div>\n</a>\n\n<div #tabContentWrapper>\n <div\n class=\"sky-vertical-tab-content-pane\"\n role=\"tabpanel\"\n tabindex=\"0\"\n skyId\n [attr.aria-labelledby]=\"tabId\"\n [ngClass]=\"{ 'sky-vertical-tab-hidden': !active }\"\n #tabContentPane\n >\n <ng-content />\n\n <div></div>\n </div>\n</div>\n", styles: [".sky-vertical-tab{cursor:pointer;padding:7px 0 7px 10px;margin:5px 0 5px 10px;display:flex;text-decoration:none}.sky-vertical-tab:not(.sky-deemphasized){color:#212327}.sky-vertical-tab:hover{background-color:#eeeeef}.sky-vertical-tab:focus-visible{outline:thin dotted;outline:-webkit-focus-ring-color auto 5px}.sky-vertical-tab:hover .sky-vertical-tab-right-arrow{color:#979ba2}.sky-vertical-tab-active{background-color:#eeeeef;color:#212327;padding-left:6px;border-left:4px solid #00b4f1}.sky-vertical-tab-hidden{display:none}.sky-vertical-tab-display{display:flex;justify-content:space-between;flex-grow:1}.sky-vertical-tab-heading-error{padding-left:5px}.sky-vertical-tab-count{margin-left:5px}.sky-vertical-tabset-button-disabled{cursor:not-allowed;pointer-events:none}.sky-vertical-tab-right-arrow{padding:3px 10px 0 0;color:#cdcfd2}.sky-vertical-tab-content-pane:focus-visible{outline:none;border:none}:host-context(.sky-theme-modern) .sky-vertical-tab{color:#686c73;cursor:pointer;padding:10px 0 10px 15px;margin:15px 0 15px 10px}:host-context(.sky-theme-modern) .sky-vertical-tab:not(.sky-vertical-tab-active):not(:active):hover{color:#212327;background-color:transparent;padding-left:14px;border-left:1px solid #00b4f1}:host-context(.sky-theme-modern) .sky-vertical-tab:not(:active):focus-visible{outline:solid 2px #1870B8;outline-offset:-2px;box-shadow:0 1px 8px #0000004d}:host-context(.sky-theme-modern) .sky-vertical-tab:focus:active:hover{outline:none;background:none}:host-context(.sky-theme-modern) .sky-vertical-tab:active{border-left:4px solid #00b4f1;color:#212327;padding-left:11px}:host-context(.sky-theme-modern) .sky-vertical-tab .sky-vertical-tab-heading-error{padding-left:10px;position:relative;top:-2px}:host-context(.sky-theme-modern) .sky-vertical-tab-active{background:none;color:#212327;padding-left:11px;border-left:4px solid #1870B8}.sky-theme-modern .sky-vertical-tab{color:#686c73;cursor:pointer;padding:10px 0 10px 15px;margin:15px 0 15px 10px}.sky-theme-modern .sky-vertical-tab:not(.sky-vertical-tab-active):not(:active):hover{color:#212327;background-color:transparent;padding-left:14px;border-left:1px solid #00b4f1}.sky-theme-modern .sky-vertical-tab:not(:active):focus-visible{outline:solid 2px #1870B8;outline-offset:-2px;box-shadow:0 1px 8px #0000004d}.sky-theme-modern .sky-vertical-tab:focus:active:hover{outline:none;background:none}.sky-theme-modern .sky-vertical-tab:active{border-left:4px solid #00b4f1;color:#212327;padding-left:11px}.sky-theme-modern .sky-vertical-tab .sky-vertical-tab-heading-error{padding-left:10px;position:relative;top:-2px}.sky-theme-modern .sky-vertical-tab-active{background:none;color:#212327;padding-left:11px;border-left:4px solid #1870B8}:host-context(.sky-sectioned-form-tabs-only) .sky-vertical-tab{margin-left:0}\n"], dependencies: [{ kind: "directive", type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i6.λ1, selector: "sky-icon", inputs: ["icon", "iconType", "size", "fixedWidth", "variant"] }, { kind: "directive", type: i1.λ2, selector: "[skyId]", exportAs: ["skyId"] }, { kind: "component", type: i8.λ10, selector: "sky-status-indicator", inputs: ["indicatorType", "descriptionType", "customDescription", "helpPopoverContent", "helpPopoverTitle", "helpKey"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
673
+ ], viewQueries: [{ propertyName: "tabButton", first: true, predicate: ["tabButton"], descendants: true }, { propertyName: "tabContent", first: true, predicate: ["tabContentWrapper"], descendants: true }], ngImport: i0, template: "<a\n class=\"sky-vertical-tab sky-vertical-tabset-button\"\n [attr.aria-controls]=\"isMobile ? null : ariaControls || tabContentPane.id\"\n [attr.aria-disabled]=\"disabled || undefined\"\n [attr.aria-selected]=\"active\"\n [attr.id]=\"tabId\"\n [attr.role]=\"isMobile ? undefined : ariaRole\"\n [ngClass]=\"{\n 'sky-vertical-tab-active': active,\n 'sky-vertical-tabset-button-disabled': disabled,\n 'sky-font-deemphasized': disabled,\n 'sky-deemphasized': disabled\n }\"\n [tabIndex]=\"-1\"\n (click)=\"activateTab()\"\n (keyup.arrowleft)=\"tabButtonArrowLeft($event)\"\n (keyup.enter)=\"tabButtonActivate($event)\"\n (keyup.space)=\"tabButtonActivate($event)\"\n #tabButton\n>\n <div class=\"sky-vertical-tab-display\">\n <div class=\"sky-vertical-tab-heading\">\n <span class=\"sky-vertical-tab-heading-value\">{{ tabHeading }}</span>\n <span\n class=\"sky-vertical-tab-count\"\n *ngIf=\"tabHeaderCount || tabHeaderCount === 0\"\n >\n ({{ tabHeaderCount }})\n </span>\n </div>\n <sky-status-indicator\n *ngIf=\"errorIndicator\"\n class=\"sky-vertical-tab-heading-error\"\n descriptionType=\"error\"\n indicatorType=\"danger\"\n ></sky-status-indicator>\n <sky-icon\n *ngIf=\"isMobile && showTabRightArrow\"\n class=\"sky-vertical-tab-right-arrow\"\n icon=\"chevron-right\"\n />\n </div>\n</a>\n\n<div #tabContentWrapper>\n <div\n class=\"sky-vertical-tab-content-pane\"\n role=\"tabpanel\"\n tabindex=\"0\"\n skyId\n [attr.aria-labelledby]=\"tabId\"\n [ngClass]=\"{ 'sky-vertical-tab-hidden': !active }\"\n #tabContentPane\n >\n <ng-content />\n\n <div></div>\n </div>\n</div>\n", styles: [".sky-vertical-tab{cursor:pointer;padding:7px 0 7px 10px;margin:5px 0 5px 10px;display:flex;text-decoration:none}.sky-vertical-tab:not(.sky-deemphasized){color:#212327}.sky-vertical-tab:hover{background-color:#eeeeef}.sky-vertical-tab:focus-visible{outline:thin dotted;outline:-webkit-focus-ring-color auto 5px}.sky-vertical-tab:hover .sky-vertical-tab-right-arrow{color:#979ba2}.sky-vertical-tab-active{background-color:#eeeeef;color:#212327;padding-left:6px;border-left:4px solid #00b4f1}.sky-vertical-tab-hidden{display:none}.sky-vertical-tab-display{display:flex;justify-content:space-between;flex-grow:1}.sky-vertical-tab-heading-error{padding-left:5px}.sky-vertical-tab-count{margin-left:5px}.sky-vertical-tabset-button-disabled{cursor:not-allowed;pointer-events:none}.sky-vertical-tab-right-arrow{padding:3px 10px 0 0;color:#cdcfd2}.sky-vertical-tab-content-pane:focus-visible{outline:none;border:none}:host-context(.sky-theme-modern) .sky-vertical-tab{color:#686c73;cursor:pointer;padding:10px 0 10px 15px;margin:15px 0 15px 10px}:host-context(.sky-theme-modern) .sky-vertical-tab:not(.sky-vertical-tab-active):not(:active):hover{color:#212327;background-color:transparent;padding-left:14px;border-left:1px solid #00b4f1}:host-context(.sky-theme-modern) .sky-vertical-tab:not(:active):focus-visible{outline:solid 2px #1870B8;outline-offset:-2px;box-shadow:0 1px 8px #0000004d}:host-context(.sky-theme-modern) .sky-vertical-tab:focus:active:hover{outline:none;background:none}:host-context(.sky-theme-modern) .sky-vertical-tab:active{border-left:4px solid #00b4f1;color:#212327;padding-left:11px}:host-context(.sky-theme-modern) .sky-vertical-tab .sky-vertical-tab-heading-error{padding-left:10px;position:relative;top:-2px}:host-context(.sky-theme-modern) .sky-vertical-tab-active{background:none;color:#212327;padding-left:11px;border-left:4px solid #1870B8}.sky-theme-modern .sky-vertical-tab{color:#686c73;cursor:pointer;padding:10px 0 10px 15px;margin:15px 0 15px 10px}.sky-theme-modern .sky-vertical-tab:not(.sky-vertical-tab-active):not(:active):hover{color:#212327;background-color:transparent;padding-left:14px;border-left:1px solid #00b4f1}.sky-theme-modern .sky-vertical-tab:not(:active):focus-visible{outline:solid 2px #1870B8;outline-offset:-2px;box-shadow:0 1px 8px #0000004d}.sky-theme-modern .sky-vertical-tab:focus:active:hover{outline:none;background:none}.sky-theme-modern .sky-vertical-tab:active{border-left:4px solid #00b4f1;color:#212327;padding-left:11px}.sky-theme-modern .sky-vertical-tab .sky-vertical-tab-heading-error{padding-left:10px;position:relative;top:-2px}.sky-theme-modern .sky-vertical-tab-active{background:none;color:#212327;padding-left:11px;border-left:4px solid #1870B8}:host-context(.sky-sectioned-form-tabs-only) .sky-vertical-tab{margin-left:0}\n"], dependencies: [{ kind: "directive", type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i6.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant"] }, { kind: "directive", type: i1.λ2, selector: "[skyId]", exportAs: ["skyId"] }, { kind: "component", type: i8.λ10, selector: "sky-status-indicator", inputs: ["indicatorType", "descriptionType", "customDescription", "helpPopoverContent", "helpPopoverTitle", "helpKey"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
674
674
  }
675
675
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: SkyVerticalTabComponent, decorators: [{
676
676
  type: Component,
@@ -956,7 +956,7 @@ class SkyVerticalTabsetComponent {
956
956
  this.adapterService.focusPreviousButton(this.tabGroups);
957
957
  }
958
958
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: SkyVerticalTabsetComponent, deps: [{ token: SkyVerticalTabsetAdapterService }, { token: SkyVerticalTabsetService }, { token: i3.SkyLibResourcesService }, { token: i0.ChangeDetectorRef }, { token: SkyTabIdService }], target: i0.ɵɵFactoryTarget.Component }); }
959
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.5", type: SkyVerticalTabsetComponent, selector: "sky-vertical-tabset", inputs: { showTabsText: "showTabsText", ariaLabel: "ariaLabel", ariaLabelledBy: "ariaLabelledBy", ariaRole: "ariaRole", maintainTabContent: "maintainTabContent" }, outputs: { activeChange: "activeChange" }, providers: [SkyTabIdService, SkyVerticalTabsetService], viewQueries: [{ propertyName: "tabGroups", first: true, predicate: ["groupContainerWrapper"], descendants: true }, { propertyName: "content", first: true, predicate: ["skySideContent"], descendants: true }, { propertyName: "contentWrapper", first: true, predicate: ["contentContainerWrapper"], descendants: true }], ngImport: i0, template: "<div\n class=\"sky-vertical-tabset\"\n [tabIndex]=\"tablistHasFocus ? -1 : 0\"\n (focus)=\"tabsetFocus()\"\n>\n <!--\n ARIA rules do not allow tabpanel elements to be children of a tablist element.\n However, the markup for each sky-vertical-tab component includes both the tab button\n and its panel, making the panel element a child of its tablist. Moreover, our\n sky-vertical-tab components can be grouped within collapsible containers, which also\n violates accessibility rules because only tab buttons can be children of a tablist.\n To address this, we create an empty tablist element with an aria-owns attribute,\n pointing to each tab element individually. That way, we don't have to worry about the\n structure for each sky-vertical-tab component in order to satisfy accessibility\n guidelines.\n -->\n <span\n aria-orientation=\"vertical\"\n class=\"sky-vertical-tabset-tablist\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledBy\"\n [attr.aria-owns]=\"(tabIdSvc.ids | async)?.join(' ') || undefined\"\n [attr.role]=\"isMobile ? undefined : ariaRole\"\n ></span>\n <div\n *ngIf=\"maintainTabContent || tabService.tabsVisible()\"\n class=\"sky-vertical-tabset-group-container\"\n [@tabGroupEnter]=\"tabService.animationTabsVisibleState\"\n [ngClass]=\"{ 'sky-vertical-tabset-hidden': !tabService.tabsVisible() }\"\n (keydown.arrowdown)=\"tabGroupsArrowDown(); $event.preventDefault()\"\n (keydown.arrowup)=\"tabGroupsArrowUp(); $event.preventDefault()\"\n (focusin)=\"tabGroupsFocusIn()\"\n (focusout)=\"tabGroupsFocusOut()\"\n #groupContainerWrapper\n >\n <ng-content />\n </div>\n <div\n *ngIf=\"maintainTabContent || tabService.contentVisible()\"\n class=\"sky-vertical-tabset-content\"\n [ngClass]=\"{\n 'sky-vertical-tabset-content-hidden': !tabService.contentVisible()\n }\"\n [@contentEnter]=\"tabService.animationContentVisibleState\"\n #contentContainerWrapper\n >\n <div #skySideContent></div>\n <button\n *ngIf=\"!tabService.tabsVisible()\"\n (click)=\"tabService.showTabs()\"\n class=\"sky-btn sky-btn-primary sky-vertical-tabset-show-tabs-btn\"\n type=\"button\"\n >\n <sky-icon icon=\"chevron-left\" />\n {{ showTabsText }}\n </button>\n </div>\n</div>\n", styles: [":host .sky-vertical-tabset{display:block;height:auto}:host .sky-vertical-tabset-group-container{border-right:none}:host-context(.sky-responsive-container-xs) .sky-vertical-tabset,:host-context(.sky-responsive-container-sm) .sky-vertical-tabset,:host-context(.sky-responsive-container-md) .sky-vertical-tabset,:host-context(.sky-responsive-container-lg) .sky-vertical-tabset{display:block;height:auto}:host-context(.sky-responsive-container-xs) .sky-vertical-tabset-group-container,:host-context(.sky-responsive-container-sm) .sky-vertical-tabset-group-container,:host-context(.sky-responsive-container-md) .sky-vertical-tabset-group-container,:host-context(.sky-responsive-container-lg) .sky-vertical-tabset-group-container{border-right:none}@media (min-width: 768px){:host .sky-vertical-tabset{display:flex;height:100%}:host .sky-vertical-tabset-group-container{border-right:1px solid #cdcfd2}}:host-context(.sky-responsive-container-sm) .sky-vertical-tabset,:host-context(.sky-responsive-container-md) .sky-vertical-tabset,:host-context(.sky-responsive-container-lg) .sky-vertical-tabset{display:flex;height:100%}:host-context(.sky-responsive-container-sm) .sky-vertical-tabset-group-container,:host-context(.sky-responsive-container-md) .sky-vertical-tabset-group-container,:host-context(.sky-responsive-container-lg) .sky-vertical-tabset-group-container{border-right:1px solid #cdcfd2}.sky-vertical-tabset-hidden{display:none}.sky-vertical-tabset-content{margin:10px 0 0 10px;flex-basis:75%;overflow-y:auto}.sky-vertical-tabset-content-hidden{display:none}.sky-vertical-tabset-show-tabs-btn{margin-top:10px}.sky-vertical-tabset-group-container{flex-basis:25%;overflow-y:auto}:host-context(sky-modal-content)>.sky-vertical-tabset{margin:var(--sky-compat-vertical-tabs-modal-margin)}:host-context(sky-modal-content)>:host .sky-vertical-tabset{margin:-15px}:host-context(.sky-theme-modern) .sky-vertical-tabset-content{margin:15px}@media (min-width: 768px){:host-context(.sky-theme-modern) :host .sky-vertical-tabset-content{margin:20px 30px}:host-context(.sky-theme-modern) :host .sky-vertical-tabset-group-container{border-right:1px solid #d2d2d2}}:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-sm) .sky-vertical-tabset-content,:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-md) .sky-vertical-tabset-content,:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-lg) .sky-vertical-tabset-content{margin:20px 30px}:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-sm) .sky-vertical-tabset-group-container,:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-md) .sky-vertical-tabset-group-container,:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-lg) .sky-vertical-tabset-group-container{border-right:1px solid #d2d2d2}.sky-theme-modern .sky-vertical-tabset-content{margin:15px}@media (min-width: 768px){.sky-theme-modern :host .sky-vertical-tabset-content{margin:20px 30px}.sky-theme-modern :host .sky-vertical-tabset-group-container{border-right:1px solid #d2d2d2}}.sky-theme-modern :host-context(.sky-responsive-container-sm) .sky-vertical-tabset-content,.sky-theme-modern :host-context(.sky-responsive-container-md) .sky-vertical-tabset-content,.sky-theme-modern :host-context(.sky-responsive-container-lg) .sky-vertical-tabset-content{margin:20px 30px}.sky-theme-modern :host-context(.sky-responsive-container-sm) .sky-vertical-tabset-group-container,.sky-theme-modern :host-context(.sky-responsive-container-md) .sky-vertical-tabset-group-container,.sky-theme-modern :host-context(.sky-responsive-container-lg) .sky-vertical-tabset-group-container{border-right:1px solid #d2d2d2}\n"], dependencies: [{ kind: "directive", type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i6.λ1, selector: "sky-icon", inputs: ["icon", "iconType", "size", "fixedWidth", "variant"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }], animations: [
959
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.5", type: SkyVerticalTabsetComponent, selector: "sky-vertical-tabset", inputs: { showTabsText: "showTabsText", ariaLabel: "ariaLabel", ariaLabelledBy: "ariaLabelledBy", ariaRole: "ariaRole", maintainTabContent: "maintainTabContent" }, outputs: { activeChange: "activeChange" }, providers: [SkyTabIdService, SkyVerticalTabsetService], viewQueries: [{ propertyName: "tabGroups", first: true, predicate: ["groupContainerWrapper"], descendants: true }, { propertyName: "content", first: true, predicate: ["skySideContent"], descendants: true }, { propertyName: "contentWrapper", first: true, predicate: ["contentContainerWrapper"], descendants: true }], ngImport: i0, template: "<div\n class=\"sky-vertical-tabset\"\n [tabIndex]=\"tablistHasFocus ? -1 : 0\"\n (focus)=\"tabsetFocus()\"\n>\n <!--\n ARIA rules do not allow tabpanel elements to be children of a tablist element.\n However, the markup for each sky-vertical-tab component includes both the tab button\n and its panel, making the panel element a child of its tablist. Moreover, our\n sky-vertical-tab components can be grouped within collapsible containers, which also\n violates accessibility rules because only tab buttons can be children of a tablist.\n To address this, we create an empty tablist element with an aria-owns attribute,\n pointing to each tab element individually. That way, we don't have to worry about the\n structure for each sky-vertical-tab component in order to satisfy accessibility\n guidelines.\n -->\n <span\n aria-orientation=\"vertical\"\n class=\"sky-vertical-tabset-tablist\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledBy\"\n [attr.aria-owns]=\"(tabIdSvc.ids | async)?.join(' ') || undefined\"\n [attr.role]=\"isMobile ? undefined : ariaRole\"\n ></span>\n <div\n *ngIf=\"maintainTabContent || tabService.tabsVisible()\"\n class=\"sky-vertical-tabset-group-container\"\n [@tabGroupEnter]=\"tabService.animationTabsVisibleState\"\n [ngClass]=\"{ 'sky-vertical-tabset-hidden': !tabService.tabsVisible() }\"\n (keydown.arrowdown)=\"tabGroupsArrowDown(); $event.preventDefault()\"\n (keydown.arrowup)=\"tabGroupsArrowUp(); $event.preventDefault()\"\n (focusin)=\"tabGroupsFocusIn()\"\n (focusout)=\"tabGroupsFocusOut()\"\n #groupContainerWrapper\n >\n <ng-content />\n </div>\n <div\n *ngIf=\"maintainTabContent || tabService.contentVisible()\"\n class=\"sky-vertical-tabset-content\"\n [ngClass]=\"{\n 'sky-vertical-tabset-content-hidden': !tabService.contentVisible()\n }\"\n [@contentEnter]=\"tabService.animationContentVisibleState\"\n #contentContainerWrapper\n >\n <div #skySideContent></div>\n <button\n *ngIf=\"!tabService.tabsVisible()\"\n (click)=\"tabService.showTabs()\"\n class=\"sky-btn sky-btn-primary sky-vertical-tabset-show-tabs-btn\"\n type=\"button\"\n >\n <sky-icon icon=\"chevron-left\" />\n {{ showTabsText }}\n </button>\n </div>\n</div>\n", styles: [":host .sky-vertical-tabset{display:block;height:auto}:host .sky-vertical-tabset-group-container{border-right:none}:host-context(.sky-responsive-container-xs) .sky-vertical-tabset,:host-context(.sky-responsive-container-sm) .sky-vertical-tabset,:host-context(.sky-responsive-container-md) .sky-vertical-tabset,:host-context(.sky-responsive-container-lg) .sky-vertical-tabset{display:block;height:auto}:host-context(.sky-responsive-container-xs) .sky-vertical-tabset-group-container,:host-context(.sky-responsive-container-sm) .sky-vertical-tabset-group-container,:host-context(.sky-responsive-container-md) .sky-vertical-tabset-group-container,:host-context(.sky-responsive-container-lg) .sky-vertical-tabset-group-container{border-right:none}@media (min-width: 768px){:host .sky-vertical-tabset{display:flex;height:100%}:host .sky-vertical-tabset-group-container{border-right:1px solid #cdcfd2}}:host-context(.sky-responsive-container-sm) .sky-vertical-tabset,:host-context(.sky-responsive-container-md) .sky-vertical-tabset,:host-context(.sky-responsive-container-lg) .sky-vertical-tabset{display:flex;height:100%}:host-context(.sky-responsive-container-sm) .sky-vertical-tabset-group-container,:host-context(.sky-responsive-container-md) .sky-vertical-tabset-group-container,:host-context(.sky-responsive-container-lg) .sky-vertical-tabset-group-container{border-right:1px solid #cdcfd2}.sky-vertical-tabset-hidden{display:none}.sky-vertical-tabset-content{margin:10px 0 0 10px;flex-basis:75%;overflow-y:auto}.sky-vertical-tabset-content-hidden{display:none}.sky-vertical-tabset-show-tabs-btn{margin-top:10px}.sky-vertical-tabset-group-container{flex-basis:25%;overflow-y:auto}:host-context(sky-modal-content)>.sky-vertical-tabset{margin:var(--sky-compat-vertical-tabs-modal-margin)}:host-context(sky-modal-content)>:host .sky-vertical-tabset{margin:-15px}:host-context(.sky-theme-modern) .sky-vertical-tabset-content{margin:15px}@media (min-width: 768px){:host-context(.sky-theme-modern) :host .sky-vertical-tabset-content{margin:20px 30px}:host-context(.sky-theme-modern) :host .sky-vertical-tabset-group-container{border-right:1px solid #d2d2d2}}:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-sm) .sky-vertical-tabset-content,:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-md) .sky-vertical-tabset-content,:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-lg) .sky-vertical-tabset-content{margin:20px 30px}:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-sm) .sky-vertical-tabset-group-container,:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-md) .sky-vertical-tabset-group-container,:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-lg) .sky-vertical-tabset-group-container{border-right:1px solid #d2d2d2}.sky-theme-modern .sky-vertical-tabset-content{margin:15px}@media (min-width: 768px){.sky-theme-modern :host .sky-vertical-tabset-content{margin:20px 30px}.sky-theme-modern :host .sky-vertical-tabset-group-container{border-right:1px solid #d2d2d2}}.sky-theme-modern :host-context(.sky-responsive-container-sm) .sky-vertical-tabset-content,.sky-theme-modern :host-context(.sky-responsive-container-md) .sky-vertical-tabset-content,.sky-theme-modern :host-context(.sky-responsive-container-lg) .sky-vertical-tabset-content{margin:20px 30px}.sky-theme-modern :host-context(.sky-responsive-container-sm) .sky-vertical-tabset-group-container,.sky-theme-modern :host-context(.sky-responsive-container-md) .sky-vertical-tabset-group-container,.sky-theme-modern :host-context(.sky-responsive-container-lg) .sky-vertical-tabset-group-container{border-right:1px solid #d2d2d2}\n"], dependencies: [{ kind: "directive", type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i6.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }], animations: [
960
960
  trigger('tabGroupEnter', [
961
961
  transition(`${HIDDEN_STATE} => ${VISIBLE_STATE}`, [
962
962
  style({ transform: 'translate(-100%)' }),
@@ -1670,7 +1670,7 @@ class SkyTabButtonComponent {
1670
1670
  this.#changeDetectorRef.markForCheck();
1671
1671
  }
1672
1672
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: SkyTabButtonComponent, deps: [{ token: i0.ElementRef }, { token: SkyTabButtonAdapterService }, { token: i0.ChangeDetectorRef }, { token: SkyTabsetService }], target: i0.ɵɵFactoryTarget.Component }); }
1673
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.5", type: SkyTabButtonComponent, selector: "sky-tab-button", inputs: { active: "active", ariaControls: "ariaControls", buttonHref: "buttonHref", buttonId: "buttonId", buttonText: "buttonText", buttonTextCount: "buttonTextCount", closeable: "closeable", disabled: "disabled", tabIndex: "tabIndex", tabNumber: "tabNumber", totalTabsCount: "totalTabsCount", tabStyle: "tabStyle" }, outputs: { buttonClick: "buttonClick", closeClick: "closeClick" }, providers: [SkyTabButtonAdapterService], ngImport: i0, template: "<div\n class=\"sky-btn-tab-wrapper\"\n [ngClass]=\"{\n 'sky-btn-tab-wrapper-selected': active,\n 'sky-btn-tab-wrapper-disabled': disabled\n }\"\n>\n <a\n #tabButtonEl\n class=\"sky-btn-tab\"\n role=\"tab\"\n [attr.aria-controls]=\"ariaControls\"\n [attr.aria-disabled]=\"disabled\"\n [attr.aria-selected]=\"active\"\n [attr.href]=\"buttonHref\"\n [attr.aria-label]=\"\n tabStyle === 'wizard'\n ? ('skyux_wizard_sr_step_' + wizardStepState\n | skyLibResources: tabNumber : totalTabsCount : buttonText)\n : null\n \"\n [attr.aria-labelledby]=\"tabStyle === 'wizard' ? null : tabHeading.id\"\n [id]=\"buttonId\"\n [ngClass]=\"{\n 'sky-btn-tab-wizard': tabStyle === 'wizard',\n 'sky-btn-tab-selected': active,\n 'sky-btn-tab-disabled': disabled,\n 'sky-tab-btn-closeable': closeable\n }\"\n [tabindex]=\"active ? '0' : '-1'\"\n (click)=\"onButtonClick($event)\"\n (keydown)=\"onTabButtonKeyDown($event)\"\n (focus)=\"onFocus()\"\n >\n <span class=\"sky-tab-heading\" [attr.aria-hidden]=\"true\">\n <span skyId #tabHeading=\"skyId\">\n {{ buttonText }}\n <span\n *ngIf=\"buttonTextCount !== undefined\"\n class=\"sky-tab-header-count\"\n >\n {{ buttonTextCount }}\n </span>\n </span>\n <span\n *ngIf=\"closeable\"\n class=\"sky-btn-tab-close\"\n [tabindex]=\"closeBtnTabIndex\"\n [attr.aria-label]=\"'skyux_tab_close' | skyLibResources: buttonText\"\n [ngClass]=\"{\n 'sky-btn-tab-close-disabled': disabled\n }\"\n (click)=\"onCloseClick($event)\"\n (keydown.enter)=\"onCloseClick($event)\"\n >\n <sky-icon icon=\"remove\" />\n </span>\n </span>\n </a>\n</div>\n", styles: [".sky-btn-tab-wrapper{display:inline-block;position:relative;margin-right:5px}.sky-btn-tab-wrapper .sky-btn-tab-close{position:absolute;top:10px;right:10px;color:#686c73;padding:1px 6px}.sky-btn-tab-wrapper .sky-btn-tab-close:hover{color:#212327;transition:color .15s}.sky-btn-tab-wrapper.sky-btn-tab-wrapper-selected:not(.sky-btn-tab-wrapper-disabled) .sky-btn-tab-close{color:#fff}.sky-btn-tab-wrapper.sky-btn-tab-wrapper-disabled{cursor:not-allowed}.sky-tab-btn-closeable{padding-right:43px}:host-context(.sky-theme-modern) .sky-btn-tab-wrapper{margin-right:10px}:host-context(.sky-theme-modern) .sky-btn-tab-wrapper .sky-btn-tab-close{top:12px;right:10px}:host-context(.sky-theme-modern) .sky-btn-tab-wrapper.sky-btn-tab-wrapper-selected:not(.sky-btn-tab-wrapper-disabled) .sky-btn-tab-close{color:#686c73}:host-context(.sky-theme-modern) .sky-tab-btn-closeable{padding-right:44px}.sky-theme-modern .sky-btn-tab-wrapper{margin-right:10px}.sky-theme-modern .sky-btn-tab-wrapper .sky-btn-tab-close{top:12px;right:10px}.sky-theme-modern .sky-btn-tab-wrapper.sky-btn-tab-wrapper-selected:not(.sky-btn-tab-wrapper-disabled) .sky-btn-tab-close{color:#686c73}.sky-theme-modern .sky-tab-btn-closeable{padding-right:44px}:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-btn-tab-wrapper .sky-btn-tab-close{color:#eeeeef}:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-btn-tab-wrapper.sky-btn-tab-wrapper-selected:not(.sky-btn-tab-wrapper-disabled) .sky-btn-tab-close{color:#eeeeef}.sky-theme-modern.sky-theme-mode-dark .sky-btn-tab-wrapper .sky-btn-tab-close{color:#eeeeef}.sky-theme-modern.sky-theme-mode-dark .sky-btn-tab-wrapper.sky-btn-tab-wrapper-selected:not(.sky-btn-tab-wrapper-disabled) .sky-btn-tab-close{color:#eeeeef}\n"], dependencies: [{ kind: "directive", type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i6.λ1, selector: "sky-icon", inputs: ["icon", "iconType", "size", "fixedWidth", "variant"] }, { kind: "directive", type: i1.λ2, selector: "[skyId]", exportAs: ["skyId"] }, { kind: "pipe", type: i3.SkyLibResourcesPipe, name: "skyLibResources" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
1673
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.5", type: SkyTabButtonComponent, selector: "sky-tab-button", inputs: { active: "active", ariaControls: "ariaControls", buttonHref: "buttonHref", buttonId: "buttonId", buttonText: "buttonText", buttonTextCount: "buttonTextCount", closeable: "closeable", disabled: "disabled", tabIndex: "tabIndex", tabNumber: "tabNumber", totalTabsCount: "totalTabsCount", tabStyle: "tabStyle" }, outputs: { buttonClick: "buttonClick", closeClick: "closeClick" }, providers: [SkyTabButtonAdapterService], ngImport: i0, template: "<div\n class=\"sky-btn-tab-wrapper\"\n [ngClass]=\"{\n 'sky-btn-tab-wrapper-selected': active,\n 'sky-btn-tab-wrapper-disabled': disabled\n }\"\n>\n <a\n #tabButtonEl\n class=\"sky-btn-tab\"\n role=\"tab\"\n [attr.aria-controls]=\"ariaControls\"\n [attr.aria-disabled]=\"disabled\"\n [attr.aria-selected]=\"active\"\n [attr.href]=\"buttonHref\"\n [attr.aria-label]=\"\n tabStyle === 'wizard'\n ? ('skyux_wizard_sr_step_' + wizardStepState\n | skyLibResources: tabNumber : totalTabsCount : buttonText)\n : null\n \"\n [attr.aria-labelledby]=\"tabStyle === 'wizard' ? null : tabHeading.id\"\n [id]=\"buttonId\"\n [ngClass]=\"{\n 'sky-btn-tab-wizard': tabStyle === 'wizard',\n 'sky-btn-tab-selected': active,\n 'sky-btn-tab-disabled': disabled,\n 'sky-tab-btn-closeable': closeable\n }\"\n [tabindex]=\"active ? '0' : '-1'\"\n (click)=\"onButtonClick($event)\"\n (keydown)=\"onTabButtonKeyDown($event)\"\n (focus)=\"onFocus()\"\n >\n <span class=\"sky-tab-heading\" [attr.aria-hidden]=\"true\">\n <span skyId #tabHeading=\"skyId\">\n {{ buttonText }}\n <span\n *ngIf=\"buttonTextCount !== undefined\"\n class=\"sky-tab-header-count\"\n >\n {{ buttonTextCount }}\n </span>\n </span>\n <span\n *ngIf=\"closeable\"\n class=\"sky-btn-tab-close\"\n [tabindex]=\"closeBtnTabIndex\"\n [attr.aria-label]=\"'skyux_tab_close' | skyLibResources: buttonText\"\n [ngClass]=\"{\n 'sky-btn-tab-close-disabled': disabled\n }\"\n (click)=\"onCloseClick($event)\"\n (keydown.enter)=\"onCloseClick($event)\"\n >\n <sky-icon icon=\"remove\" />\n </span>\n </span>\n </a>\n</div>\n", styles: [".sky-btn-tab-wrapper{display:inline-block;position:relative;margin-right:5px}.sky-btn-tab-wrapper .sky-btn-tab-close{position:absolute;top:10px;right:10px;color:#686c73;padding:1px 6px}.sky-btn-tab-wrapper .sky-btn-tab-close:hover{color:#212327;transition:color .15s}.sky-btn-tab-wrapper.sky-btn-tab-wrapper-selected:not(.sky-btn-tab-wrapper-disabled) .sky-btn-tab-close{color:#fff}.sky-btn-tab-wrapper.sky-btn-tab-wrapper-disabled{cursor:not-allowed}.sky-tab-btn-closeable{padding-right:43px}:host-context(.sky-theme-modern) .sky-btn-tab-wrapper{margin-right:10px}:host-context(.sky-theme-modern) .sky-btn-tab-wrapper .sky-btn-tab-close{top:12px;right:10px}:host-context(.sky-theme-modern) .sky-btn-tab-wrapper.sky-btn-tab-wrapper-selected:not(.sky-btn-tab-wrapper-disabled) .sky-btn-tab-close{color:#686c73}:host-context(.sky-theme-modern) .sky-tab-btn-closeable{padding-right:44px}.sky-theme-modern .sky-btn-tab-wrapper{margin-right:10px}.sky-theme-modern .sky-btn-tab-wrapper .sky-btn-tab-close{top:12px;right:10px}.sky-theme-modern .sky-btn-tab-wrapper.sky-btn-tab-wrapper-selected:not(.sky-btn-tab-wrapper-disabled) .sky-btn-tab-close{color:#686c73}.sky-theme-modern .sky-tab-btn-closeable{padding-right:44px}:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-btn-tab-wrapper .sky-btn-tab-close{color:#eeeeef}:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-btn-tab-wrapper.sky-btn-tab-wrapper-selected:not(.sky-btn-tab-wrapper-disabled) .sky-btn-tab-close{color:#eeeeef}.sky-theme-modern.sky-theme-mode-dark .sky-btn-tab-wrapper .sky-btn-tab-close{color:#eeeeef}.sky-theme-modern.sky-theme-mode-dark .sky-btn-tab-wrapper.sky-btn-tab-wrapper-selected:not(.sky-btn-tab-wrapper-disabled) .sky-btn-tab-close{color:#eeeeef}\n"], dependencies: [{ kind: "directive", type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i6.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant"] }, { kind: "directive", type: i1.λ2, selector: "[skyId]", exportAs: ["skyId"] }, { kind: "pipe", type: i3.SkyLibResourcesPipe, name: "skyLibResources" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
1674
1674
  }
1675
1675
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: SkyTabButtonComponent, decorators: [{
1676
1676
  type: Component,
@@ -2705,7 +2705,7 @@ class SkyTabsetComponent {
2705
2705
  SkyTabsetAdapterService,
2706
2706
  SkyTabsetPermalinkService,
2707
2707
  SkyTabsetService,
2708
- ], queries: [{ propertyName: "tabs", predicate: SkyTabComponent }], ngImport: i0, template: "<div\n class=\"sky-tabset\"\n role=\"tablist\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledBy\"\n [ngClass]=\"\n 'sky-tabset-mode-' + tabDisplayMode + ' sky-tabset-style-' + tabStyle\n \"\n (window:resize)=\"onWindowResize()\"\n (keydown.arrowright)=\"onRightKeyDown()\"\n (keydown.arrowleft)=\"onLeftKeyDown()\"\n (keydown.home)=\"onHomeKeyDown()\"\n (keydown.end)=\"onEndKeyDown()\"\n>\n <span class=\"sky-tabset-dropdown\">\n <sky-dropdown *ngIf=\"tabDisplayMode === 'dropdown'\" buttonType=\"tab\">\n <sky-dropdown-button>\n {{ dropdownTriggerButtonText }}\n </sky-dropdown-button>\n <sky-dropdown-menu>\n <sky-dropdown-item\n *ngFor=\"let tabButton of tabButtons\"\n class=\"sky-tab-dropdown-menu-item\"\n >\n <div\n class=\"sky-tab-dropdown-item\"\n [ngClass]=\"{\n 'sky-tab-dropdown-item-selected': tabButton.active\n }\"\n >\n <ng-container\n *ngTemplateOutlet=\"\n tabButtonTemplate;\n context: {\n $implicit: tabButton\n }\n \"\n ></ng-container>\n </div>\n </sky-dropdown-item>\n </sky-dropdown-menu>\n </sky-dropdown>\n </span>\n <span class=\"sky-tabset-tabs\">\n <ng-container *ngFor=\"let tabButton of tabButtons\">\n <ng-container\n *ngTemplateOutlet=\"\n tabButtonTemplate;\n context: {\n $implicit: tabButton\n }\n \"\n ></ng-container>\n </ng-container>\n </span>\n <span class=\"sky-tabset-btns\">\n <button\n *ngIf=\"newTab.observers.length > 0\"\n class=\"sky-btn sky-btn-icon sky-tabset-btn-new sky-margin-inline-compact\"\n type=\"button\"\n [attr.aria-label]=\"'skyux_tab_add' | skyLibResources\"\n [skyThemeClass]=\"{\n 'sky-margin-inline-sm': 'modern'\n }\"\n (click)=\"onNewTabClick()\"\n >\n <sky-icon icon=\"plus-circle\" size=\"lg\" />\n </button>\n <button\n *ngIf=\"openTab.observers.length > 0\"\n class=\"sky-btn sky-btn-icon sky-tabset-btn-open sky-margin-inline-compact\"\n type=\"button\"\n [attr.aria-label]=\"'skyux_tab_open' | skyLibResources\"\n [skyThemeClass]=\"{\n 'sky-margin-inline-sm': 'modern'\n }\"\n (click)=\"onOpenTabClick()\"\n >\n <sky-icon icon=\"folder-open-o\" size=\"lg\" />\n </button>\n </span>\n</div>\n<ng-content />\n\n<ng-template let-tabButton #tabButtonTemplate>\n <sky-tab-button\n [active]=\"tabButton.active\"\n [ariaControls]=\"tabButton.ariaControls\"\n [buttonHref]=\"tabButton.buttonHref\"\n [buttonId]=\"tabButton.buttonId\"\n [buttonText]=\"tabButton.buttonText\"\n [buttonTextCount]=\"tabButton.buttonTextCount\"\n [closeable]=\"tabButton.closeable\"\n [disabled]=\"tabButton.disabled\"\n [tabIndex]=\"tabButton.tabIndex\"\n [tabStyle]=\"tabStyle\"\n [tabNumber]=\"tabButton.tabNumber\"\n [totalTabsCount]=\"tabButton.totalTabsCount\"\n (buttonClick)=\"onTabButtonClick(tabButton)\"\n (closeClick)=\"onTabCloseClick(tabButton)\"\n ></sky-tab-button>\n</ng-template>\n", styles: ["sky-tabset.sky-tabset-layout-fit{position:absolute;inset:0;display:flex;flex-direction:column}sky-tabset.sky-tabset-layout-fit .sky-tabset{flex-grow:0}.sky-tabset{--sky-tabset-margin: 0;align-items:center;border-bottom:2px solid #0974a1;display:flex;list-style-type:none;margin:var(--sky-tabset-margin);padding:0 0 0 var(--sky-layout-host-tab-content-spacing, 15px);white-space:nowrap;flex-grow:var(--sky-layout-host-content-flex-grow, 0);overflow:var(--sky-layout-host-content-overflow, hidden);position:var(--sky-layout-host-content-position, static)}.sky-tabset.sky-tabset-style-wizard{border-bottom:none;padding-left:0}.sky-modal-content .sky-tabset-style-tabs{--sky-tabset-margin: var( --sky-compat-tabset-tabs-modal-margin, 0 -15px 20px )}.sky-modal-content .sky-tabset-style-wizard{--sky-tabset-margin: var( --sky-compat-tabset-wizard-modal-margin, 0 0 20px )}.sky-tabset-btns{order:1;padding-left:10px}.sky-tabset-dropdown{order:0;max-width:100%}.sky-tabset-mode-dropdown{line-height:0}.sky-tabset-mode-dropdown .sky-tabset-tabs{visibility:hidden;order:2}.sky-tab-dropdown-menu-item sky-tab-button{display:flex;min-width:300px}.sky-tab-dropdown-menu-item .sky-dropdown-item{margin:0}.sky-tab-dropdown-menu-item .sky-btn-tab-wrapper{width:100%;margin-right:0}.sky-tab-dropdown-menu-item .sky-btn-tab{margin:0;border-radius:0;width:100%;display:flex}.sky-tab-dropdown-menu-item .sky-btn-tab>.sky-tab-heading{flex:1 1 auto}.sky-tab-dropdown-menu-item .sky-btn-tab>.sky-btn-tab-close{flex:0 1 auto}.sky-tabset-tabs{order:0;white-space:nowrap}.sky-tabset-btn-new,.sky-tabset-btn-open{color:#0974a1}.sky-theme-modern .sky-modal-content .sky-tabset{--sky-tabset-margin: -10px -30px 30px;padding-left:30px;padding-right:30px}.sky-theme-modern .sky-tabset{border-bottom:1px solid #d2d2d2;overflow:visible}.sky-theme-modern .sky-tab-dropdown-menu-item .sky-btn-tab-wrapper{margin-right:0}\n"], dependencies: [{ kind: "directive", type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i5.λ2, selector: "sky-dropdown-button" }, { kind: "component", type: i5.λ3, selector: "sky-dropdown", inputs: ["buttonStyle", "buttonType", "disabled", "dismissOnBlur", "label", "horizontalAlignment", "messageStream", "title", "trigger"] }, { kind: "component", type: i5.λ1, selector: "sky-dropdown-item", inputs: ["ariaRole"] }, { kind: "component", type: i5.λ4, selector: "sky-dropdown-menu", inputs: ["ariaLabelledBy", "ariaRole", "useNativeFocus"], outputs: ["menuChanges"] }, { kind: "component", type: i6.λ1, selector: "sky-icon", inputs: ["icon", "iconType", "size", "fixedWidth", "variant"] }, { kind: "directive", type: i7.λ2, selector: "[skyThemeClass]", inputs: ["class", "skyThemeClass"] }, { kind: "component", type: SkyTabButtonComponent, selector: "sky-tab-button", inputs: ["active", "ariaControls", "buttonHref", "buttonId", "buttonText", "buttonTextCount", "closeable", "disabled", "tabIndex", "tabNumber", "totalTabsCount", "tabStyle"], outputs: ["buttonClick", "closeClick"] }, { kind: "pipe", type: i3.SkyLibResourcesPipe, name: "skyLibResources" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
2708
+ ], queries: [{ propertyName: "tabs", predicate: SkyTabComponent }], ngImport: i0, template: "<div\n class=\"sky-tabset\"\n role=\"tablist\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledBy\"\n [ngClass]=\"\n 'sky-tabset-mode-' + tabDisplayMode + ' sky-tabset-style-' + tabStyle\n \"\n (window:resize)=\"onWindowResize()\"\n (keydown.arrowright)=\"onRightKeyDown()\"\n (keydown.arrowleft)=\"onLeftKeyDown()\"\n (keydown.home)=\"onHomeKeyDown()\"\n (keydown.end)=\"onEndKeyDown()\"\n>\n <span class=\"sky-tabset-dropdown\">\n <sky-dropdown *ngIf=\"tabDisplayMode === 'dropdown'\" buttonType=\"tab\">\n <sky-dropdown-button>\n {{ dropdownTriggerButtonText }}\n </sky-dropdown-button>\n <sky-dropdown-menu>\n <sky-dropdown-item\n *ngFor=\"let tabButton of tabButtons\"\n class=\"sky-tab-dropdown-menu-item\"\n >\n <div\n class=\"sky-tab-dropdown-item\"\n [ngClass]=\"{\n 'sky-tab-dropdown-item-selected': tabButton.active\n }\"\n >\n <ng-container\n *ngTemplateOutlet=\"\n tabButtonTemplate;\n context: {\n $implicit: tabButton\n }\n \"\n ></ng-container>\n </div>\n </sky-dropdown-item>\n </sky-dropdown-menu>\n </sky-dropdown>\n </span>\n <span class=\"sky-tabset-tabs\">\n <ng-container *ngFor=\"let tabButton of tabButtons\">\n <ng-container\n *ngTemplateOutlet=\"\n tabButtonTemplate;\n context: {\n $implicit: tabButton\n }\n \"\n ></ng-container>\n </ng-container>\n </span>\n <span class=\"sky-tabset-btns\">\n <button\n *ngIf=\"newTab.observers.length > 0\"\n class=\"sky-btn sky-btn-icon sky-tabset-btn-new sky-margin-inline-compact\"\n type=\"button\"\n [attr.aria-label]=\"'skyux_tab_add' | skyLibResources\"\n [skyThemeClass]=\"{\n 'sky-margin-inline-sm': 'modern'\n }\"\n (click)=\"onNewTabClick()\"\n >\n <sky-icon icon=\"plus-circle\" size=\"lg\" />\n </button>\n <button\n *ngIf=\"openTab.observers.length > 0\"\n class=\"sky-btn sky-btn-icon sky-tabset-btn-open sky-margin-inline-compact\"\n type=\"button\"\n [attr.aria-label]=\"'skyux_tab_open' | skyLibResources\"\n [skyThemeClass]=\"{\n 'sky-margin-inline-sm': 'modern'\n }\"\n (click)=\"onOpenTabClick()\"\n >\n <sky-icon icon=\"folder-open-o\" size=\"lg\" />\n </button>\n </span>\n</div>\n<ng-content />\n\n<ng-template let-tabButton #tabButtonTemplate>\n <sky-tab-button\n [active]=\"tabButton.active\"\n [ariaControls]=\"tabButton.ariaControls\"\n [buttonHref]=\"tabButton.buttonHref\"\n [buttonId]=\"tabButton.buttonId\"\n [buttonText]=\"tabButton.buttonText\"\n [buttonTextCount]=\"tabButton.buttonTextCount\"\n [closeable]=\"tabButton.closeable\"\n [disabled]=\"tabButton.disabled\"\n [tabIndex]=\"tabButton.tabIndex\"\n [tabStyle]=\"tabStyle\"\n [tabNumber]=\"tabButton.tabNumber\"\n [totalTabsCount]=\"tabButton.totalTabsCount\"\n (buttonClick)=\"onTabButtonClick(tabButton)\"\n (closeClick)=\"onTabCloseClick(tabButton)\"\n ></sky-tab-button>\n</ng-template>\n", styles: ["sky-tabset.sky-tabset-layout-fit{position:absolute;inset:0;display:flex;flex-direction:column}sky-tabset.sky-tabset-layout-fit .sky-tabset{flex-grow:0}.sky-tabset{--sky-tabset-margin: 0;align-items:center;border-bottom:2px solid #0974a1;display:flex;list-style-type:none;margin:var(--sky-tabset-margin);padding:0 0 0 var(--sky-layout-host-tab-content-spacing, 15px);white-space:nowrap;flex-grow:var(--sky-layout-host-content-flex-grow, 0);overflow:var(--sky-layout-host-content-overflow, hidden);position:var(--sky-layout-host-content-position, static)}.sky-tabset.sky-tabset-style-wizard{border-bottom:none;padding-left:0}.sky-modal-content .sky-tabset-style-tabs{--sky-tabset-margin: var( --sky-compat-tabset-tabs-modal-margin, 0 -15px 20px )}.sky-modal-content .sky-tabset-style-wizard{--sky-tabset-margin: var( --sky-compat-tabset-wizard-modal-margin, 0 0 20px )}.sky-tabset-btns{order:1;padding-left:10px}.sky-tabset-dropdown{order:0;max-width:100%}.sky-tabset-mode-dropdown{line-height:0}.sky-tabset-mode-dropdown .sky-tabset-tabs{visibility:hidden;order:2}.sky-tab-dropdown-menu-item sky-tab-button{display:flex;min-width:300px}.sky-tab-dropdown-menu-item .sky-dropdown-item{margin:0}.sky-tab-dropdown-menu-item .sky-btn-tab-wrapper{width:100%;margin-right:0}.sky-tab-dropdown-menu-item .sky-btn-tab{margin:0;border-radius:0;width:100%;display:flex}.sky-tab-dropdown-menu-item .sky-btn-tab>.sky-tab-heading{flex:1 1 auto}.sky-tab-dropdown-menu-item .sky-btn-tab>.sky-btn-tab-close{flex:0 1 auto}.sky-tabset-tabs{order:0;white-space:nowrap}.sky-tabset-btn-new,.sky-tabset-btn-open{color:#0974a1}.sky-theme-modern .sky-modal-content .sky-tabset{--sky-tabset-margin: -10px -30px 30px;padding-left:30px;padding-right:30px}.sky-theme-modern .sky-tabset{border-bottom:1px solid #d2d2d2;overflow:visible}.sky-theme-modern .sky-tab-dropdown-menu-item .sky-btn-tab-wrapper{margin-right:0}\n"], dependencies: [{ kind: "directive", type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i5.λ2, selector: "sky-dropdown-button" }, { kind: "component", type: i5.λ3, selector: "sky-dropdown", inputs: ["buttonStyle", "buttonType", "disabled", "dismissOnBlur", "label", "horizontalAlignment", "messageStream", "title", "trigger"] }, { kind: "component", type: i5.λ1, selector: "sky-dropdown-item", inputs: ["ariaRole"] }, { kind: "component", type: i5.λ4, selector: "sky-dropdown-menu", inputs: ["ariaLabelledBy", "ariaRole", "useNativeFocus"], outputs: ["menuChanges"] }, { kind: "component", type: i6.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant"] }, { kind: "directive", type: i7.λ2, selector: "[skyThemeClass]", inputs: ["class", "skyThemeClass"] }, { kind: "component", type: SkyTabButtonComponent, selector: "sky-tab-button", inputs: ["active", "ariaControls", "buttonHref", "buttonId", "buttonText", "buttonTextCount", "closeable", "disabled", "tabIndex", "tabNumber", "totalTabsCount", "tabStyle"], outputs: ["buttonClick", "closeClick"] }, { kind: "pipe", type: i3.SkyLibResourcesPipe, name: "skyLibResources" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
2709
2709
  }
2710
2710
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: SkyTabsetComponent, decorators: [{
2711
2711
  type: Component,