@blackbaud/skyux/dist/modules/tabs/tabset.component.metadata.json

SKY UX built on Angular 2

[{"__symbolic":"module","version":3,"metadata":{"SkyTabsetComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"sky-tabset","styles":[".sky-tabset{align-items:baseline;border-bottom:2px solid #007ca6;display:flex;list-style-type:none;margin:0;overflow:hidden;padding:0;white-space:nowrap}.sky-tabset.sky-tabset-style-wizard{border-bottom:none;padding-bottom:10px}.sky-tabset-btns{order:1;padding-left:10px}.sky-tabset-dropdown{order:0;max-width:100%}.sky-tabset-mode-dropdown .sky-tabset-tabs{visibility:hidden;order:2}.sky-tabset-tabs{order:0;white-space:nowrap}.sky-tabset-btn-new,.sky-tabset-btn-open{color:#007ca6}\n"],"template":"<div\n    class=\"sky-tabset\" role=\"tablist\"\n    [ngClass]=\"'sky-tabset-mode-' + tabDisplayMode + ' sky-tabset-style-' + tabStyle\"\n    (window:resize)=\"windowResize()\"\n>\n  <span class=\"sky-tabset-dropdown\">\n    <sky-tab-dropdown\n        *ngIf=\"tabDisplayMode === 'dropdown'\"\n        [tabs]=\"tabs\"\n        (tabClick)=\"selectTab($event)\"\n        (closeClick)=\"tabCloseClick($event)\"\n    >\n    </sky-tab-dropdown>\n  </span>\n  <span class=\"sky-tabset-tabs\">\n    <sky-tab-button\n        *ngFor=\"let tab of tabs; let i = index\"\n        [tabHeading]=\"tab.tabHeading\"\n        [tabHeaderCount]=\"tab.tabHeaderCount\"\n        [tabStyle]=\"tabStyle\"\n        [active]=\"tab.active\"\n        [allowClose]=\"tab.allowClose\"\n        [disabled]=\"tab.disabled\"\n        (tabClick)=\"selectTab(tab)\"\n        (closeClick)=\"tabCloseClick(tab)\"\n    ></sky-tab-button>\n  </span>\n  <span class=\"sky-tabset-btns\">\n    <button\n        type=\"button\"\n        class=\"sky-btn sky-btn-default sky-tabset-btn-new\"\n        (click)=\"newTabClick()\"\n        [attr.aria-label]=\"'tab_add' | skyResources\"\n        *ngIf=\"newTab.observers.length > 0\"\n    >\n      <i class=\"fa fa-lg fa-plus-circle\"></i>\n    </button>\n    <button\n        type=\"button\"\n        class=\"sky-btn sky-btn-default sky-tabset-btn-open\"\n        (click)=\"openTabClick()\"\n        [attr.aria-label]=\"'tab_open' | skyResources\"\n        *ngIf=\"openTab.observers.length > 0\"\n    >\n      <i class=\"fa fa-lg fa-folder-open-o\"></i>\n    </button>\n  </span>\n</div>\n<ng-content></ng-content>\n","providers":[{"__symbolic":"reference","module":"./tabset-adapter.service","name":"SkyTabsetAdapterService"},{"__symbolic":"reference","module":"./tabset.service","name":"SkyTabsetService"}]}]}],"members":{"tabStyle":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"active":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"newTab":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"openTab":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"activeChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"tabs":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChildren"},"arguments":[{"__symbolic":"reference","module":"./tab.component","name":"SkyTabComponent"}]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"./tabset.service","name":"SkyTabsetService"},{"__symbolic":"reference","module":"./tabset-adapter.service","name":"SkyTabsetAdapterService"},{"__symbolic":"reference","module":"@angular/core","name":"ElementRef"},{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef"}]}],"tabCloseClick":[{"__symbolic":"method"}],"newTabClick":[{"__symbolic":"method"}],"openTabClick":[{"__symbolic":"method"}],"windowResize":[{"__symbolic":"method"}],"selectTab":[{"__symbolic":"method"}],"ngOnChanges":[{"__symbolic":"method"}],"ngAfterContentInit":[{"__symbolic":"method"}],"ngAfterViewInit":[{"__symbolic":"method"}],"ngDoCheck":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"updateDisplayMode":[{"__symbolic":"method"}]}}}},{"__symbolic":"module","version":1,"metadata":{"SkyTabsetComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"sky-tabset","styles":[".sky-tabset{align-items:baseline;border-bottom:2px solid #007ca6;display:flex;list-style-type:none;margin:0;overflow:hidden;padding:0;white-space:nowrap}.sky-tabset.sky-tabset-style-wizard{border-bottom:none;padding-bottom:10px}.sky-tabset-btns{order:1;padding-left:10px}.sky-tabset-dropdown{order:0;max-width:100%}.sky-tabset-mode-dropdown .sky-tabset-tabs{visibility:hidden;order:2}.sky-tabset-tabs{order:0;white-space:nowrap}.sky-tabset-btn-new,.sky-tabset-btn-open{color:#007ca6}\n"],"template":"<div\n    class=\"sky-tabset\" role=\"tablist\"\n    [ngClass]=\"'sky-tabset-mode-' + tabDisplayMode + ' sky-tabset-style-' + tabStyle\"\n    (window:resize)=\"windowResize()\"\n>\n  <span class=\"sky-tabset-dropdown\">\n    <sky-tab-dropdown\n        *ngIf=\"tabDisplayMode === 'dropdown'\"\n        [tabs]=\"tabs\"\n        (tabClick)=\"selectTab($event)\"\n        (closeClick)=\"tabCloseClick($event)\"\n    >\n    </sky-tab-dropdown>\n  </span>\n  <span class=\"sky-tabset-tabs\">\n    <sky-tab-button\n        *ngFor=\"let tab of tabs; let i = index\"\n        [tabHeading]=\"tab.tabHeading\"\n        [tabHeaderCount]=\"tab.tabHeaderCount\"\n        [tabStyle]=\"tabStyle\"\n        [active]=\"tab.active\"\n        [allowClose]=\"tab.allowClose\"\n        [disabled]=\"tab.disabled\"\n        (tabClick)=\"selectTab(tab)\"\n        (closeClick)=\"tabCloseClick(tab)\"\n    ></sky-tab-button>\n  </span>\n  <span class=\"sky-tabset-btns\">\n    <button\n        type=\"button\"\n        class=\"sky-btn sky-btn-default sky-tabset-btn-new\"\n        (click)=\"newTabClick()\"\n        [attr.aria-label]=\"'tab_add' | skyResources\"\n        *ngIf=\"newTab.observers.length > 0\"\n    >\n      <i class=\"fa fa-lg fa-plus-circle\"></i>\n    </button>\n    <button\n        type=\"button\"\n        class=\"sky-btn sky-btn-default sky-tabset-btn-open\"\n        (click)=\"openTabClick()\"\n        [attr.aria-label]=\"'tab_open' | skyResources\"\n        *ngIf=\"openTab.observers.length > 0\"\n    >\n      <i class=\"fa fa-lg fa-folder-open-o\"></i>\n    </button>\n  </span>\n</div>\n<ng-content></ng-content>\n","providers":[{"__symbolic":"reference","module":"./tabset-adapter.service","name":"SkyTabsetAdapterService"},{"__symbolic":"reference","module":"./tabset.service","name":"SkyTabsetService"}]}]}],"members":{"tabStyle":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"active":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"newTab":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"openTab":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"activeChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"tabs":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChildren"},"arguments":[{"__symbolic":"reference","module":"./tab.component","name":"SkyTabComponent"}]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"./tabset.service","name":"SkyTabsetService"},{"__symbolic":"reference","module":"./tabset-adapter.service","name":"SkyTabsetAdapterService"},{"__symbolic":"reference","module":"@angular/core","name":"ElementRef"},{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef"}]}],"tabCloseClick":[{"__symbolic":"method"}],"newTabClick":[{"__symbolic":"method"}],"openTabClick":[{"__symbolic":"method"}],"windowResize":[{"__symbolic":"method"}],"selectTab":[{"__symbolic":"method"}],"ngOnChanges":[{"__symbolic":"method"}],"ngAfterContentInit":[{"__symbolic":"method"}],"ngAfterViewInit":[{"__symbolic":"method"}],"ngDoCheck":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"updateDisplayMode":[{"__symbolic":"method"}]}}}}]