carbon-components-angular 3.13.1 → 3.13.5

package/tabs/tab-headers.component.ngsummary.json

@@ -1 +1 @@
-{"moduleName":null,"summaries":[{"symbol":{"__symbol":0,"members":[]},"metadata":{"__symbolic":"class","members":{"tabInput":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]},"arguments":["tabs"]}]}],"cacheActive":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]}}]}],"followFocus":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]}}]}],"skeleton":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]}}]}],"contentBefore":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]}}]}],"contentAfter":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]}}]}],"headerContainer":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":2,"members":[]},"arguments":["tabList"]}]}],"tabQuery":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":3,"members":[]},"arguments":[{"__symbol":4,"members":[]}]}]}],"allTabHeaders":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":5,"members":[]},"arguments":["tabItem"]}]}],"keyboardInput":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbol":6,"members":[]},"arguments":["keydown",["$event"]]}]}],"ngAfterContentInit":[{"__symbolic":"method"}],"onTabFocus":[{"__symbolic":"method"}],"getSelectedTab":[{"__symbolic":"method"}],"showTabList":[{"__symbolic":"method"}],"selectTab":[{"__symbolic":"method"}],"setFirstTab":[{"__symbolic":"method"}]}},"type":{"summaryKind":1,"type":{"reference":{"__symbol":0,"members":[]},"diDeps":[],"lifecycleHooks":[4]},"isComponent":true,"selector":"ibm-tab-headers","exportAs":null,"inputs":{"tabInput":"tabs","cacheActive":"cacheActive","followFocus":"followFocus","skeleton":"skeleton","contentBefore":"contentBefore","contentAfter":"contentAfter"},"outputs":{},"hostListeners":{"keydown":"keyboardInput($event)"},"hostProperties":{},"hostAttributes":{},"providers":[],"viewProviders":[],"queries":[{"selectors":[{"identifier":{"reference":{"__symbol":4,"members":[]}}}],"first":false,"descendants":false,"propertyName":"tabQuery","read":null}],"guards":{},"viewQueries":[{"selectors":[{"value":"tabList"}],"first":true,"descendants":true,"propertyName":"headerContainer","read":null},{"selectors":[{"value":"tabItem"}],"first":false,"descendants":true,"propertyName":"allTabHeaders","read":null}],"entryComponents":[],"changeDetection":1,"template":{"ngContentSelectors":[],"encapsulation":2},"componentViewType":{"__symbol":7,"members":[]},"rendererType":{"__symbol":8,"members":[]},"componentFactory":{"__symbol":9,"members":[]}}}],"symbols":[{"__symbol":0,"name":"TabHeaders","filePath":"./tab-headers.component"},{"__symbol":1,"name":"Input","filePath":"@angular/core"},{"__symbol":2,"name":"ViewChild","filePath":"@angular/core"},{"__symbol":3,"name":"ContentChildren","filePath":"@angular/core"},{"__symbol":4,"name":"Tab","filePath":"./tab.component"},{"__symbol":5,"name":"ViewChildren","filePath":"@angular/core"},{"__symbol":6,"name":"HostListener","filePath":"@angular/core"},{"__symbol":7,"name":"View_TabHeaders_0","filePath":"./tab-headers.component.ngfactory"},{"__symbol":8,"name":"RenderType_TabHeaders","filePath":"./tab-headers.component.ngfactory"},{"__symbol":9,"name":"TabHeadersNgFactory","filePath":"./tab-headers.component.ngfactory"}]}
+{"moduleName":null,"summaries":[{"symbol":{"__symbol":0,"members":[]},"metadata":{"__symbolic":"class","members":{"tabInput":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]},"arguments":["tabs"]}]}],"cacheActive":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]}}]}],"followFocus":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]}}]}],"skeleton":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]}}]}],"ariaLabel":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]}}]}],"ariaLabelledby":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]}}]}],"contentBefore":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]}}]}],"contentAfter":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]}}]}],"headerContainer":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":2,"members":[]},"arguments":["tabList"]}]}],"tabQuery":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":3,"members":[]},"arguments":[{"__symbol":4,"members":[]}]}]}],"allTabHeaders":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":5,"members":[]},"arguments":["tabItem"]}]}],"keyboardInput":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbol":6,"members":[]},"arguments":["keydown",["$event"]]}]}],"focusOut":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbol":6,"members":[]},"arguments":["focusout",["$event"]]}]}],"ngAfterContentInit":[{"__symbolic":"method"}],"onTabFocus":[{"__symbolic":"method"}],"getSelectedTab":[{"__symbolic":"method"}],"showTabList":[{"__symbolic":"method"}],"selectTab":[{"__symbolic":"method"}],"setFirstTab":[{"__symbolic":"method"}]}},"type":{"summaryKind":1,"type":{"reference":{"__symbol":0,"members":[]},"diDeps":[],"lifecycleHooks":[4]},"isComponent":true,"selector":"ibm-tab-headers","exportAs":null,"inputs":{"tabInput":"tabs","cacheActive":"cacheActive","followFocus":"followFocus","skeleton":"skeleton","ariaLabel":"ariaLabel","ariaLabelledby":"ariaLabelledby","contentBefore":"contentBefore","contentAfter":"contentAfter"},"outputs":{},"hostListeners":{"keydown":"keyboardInput($event)","focusout":"focusOut($event)"},"hostProperties":{},"hostAttributes":{},"providers":[],"viewProviders":[],"queries":[{"selectors":[{"identifier":{"reference":{"__symbol":4,"members":[]}}}],"first":false,"descendants":false,"propertyName":"tabQuery","read":null}],"guards":{},"viewQueries":[{"selectors":[{"value":"tabList"}],"first":true,"descendants":true,"propertyName":"headerContainer","read":null},{"selectors":[{"value":"tabItem"}],"first":false,"descendants":true,"propertyName":"allTabHeaders","read":null}],"entryComponents":[],"changeDetection":1,"template":{"ngContentSelectors":[],"encapsulation":2},"componentViewType":{"__symbol":7,"members":[]},"rendererType":{"__symbol":8,"members":[]},"componentFactory":{"__symbol":9,"members":[]}}}],"symbols":[{"__symbol":0,"name":"TabHeaders","filePath":"./tab-headers.component"},{"__symbol":1,"name":"Input","filePath":"@angular/core"},{"__symbol":2,"name":"ViewChild","filePath":"@angular/core"},{"__symbol":3,"name":"ContentChildren","filePath":"@angular/core"},{"__symbol":4,"name":"Tab","filePath":"./tab.component"},{"__symbol":5,"name":"ViewChildren","filePath":"@angular/core"},{"__symbol":6,"name":"HostListener","filePath":"@angular/core"},{"__symbol":7,"name":"View_TabHeaders_0","filePath":"./tab-headers.component.ngfactory"},{"__symbol":8,"name":"RenderType_TabHeaders","filePath":"./tab-headers.component.ngfactory"},{"__symbol":9,"name":"TabHeadersNgFactory","filePath":"./tab-headers.component.ngfactory"}]}

package/tabs/tabs.component.d.ts

@@ -71,6 +71,14 @@ export declare class Tabs implements AfterContentInit {
      * Set to `true` to have the tabIndex of the all tabpanels be -1.
      */
     isNavigation: boolean;
+    /**
+     * Sets the aria label on the `TabHeader`s nav element.
+     */
+    ariaLabel: string;
+    /**
+     * Sets the aria labelledby on the `TabHeader`s nav element.
+     */
+    ariaLabelledby: string;
     /**
      * Maintains a `QueryList` of the `Tab` elements and updates if `Tab`s are added or removed.
      */

package/tabs/tabs.component.js

@@ -96,7 +96,7 @@ var Tabs = /** @class */ (function () {
     Tabs.decorators = [
         { type: Component, args: [{
                     selector: "ibm-tabs",
-                    template: "\n\t\t\t<ibm-tab-headers\n\t\t\t\t*ngIf=\"hasTabHeaders() && position === 'top'\"\n\t\t\t\t[skeleton]=\"skeleton\"\n\t\t\t\t[tabs]=\"tabs\"\n\t\t\t\t[followFocus]=\"followFocus\"\n\t\t\t\t[cacheActive]=\"cacheActive\"\n\t\t\t\t[contentBefore]=\"before\"\n\t\t\t\t[contentAfter]=\"after\">\n\t\t\t</ibm-tab-headers>\n\t\t\t<ng-content></ng-content>\n\t\t\t<ng-template #before>\n\t\t\t\t<ng-content select=\"[before]\"></ng-content>\n\t\t\t</ng-template>\n\t\t\t<ng-template #after>\n\t\t\t\t<ng-content select=\"[after]\"></ng-content>\n\t\t\t</ng-template>\n\t\t\t<ibm-tab-headers\n\t\t\t\t*ngIf=\"hasTabHeaders() && position === 'bottom'\"\n\t\t\t\t[skeleton]=\"skeleton\"\n\t\t\t\t[tabs]=\"tabs\"\n\t\t\t\t[cacheActive]=\"cacheActive\">\n\t\t\t</ibm-tab-headers>\n\t "
+                    template: "\n\t\t\t<ibm-tab-headers\n\t\t\t\t*ngIf=\"hasTabHeaders() && position === 'top'\"\n\t\t\t\t[skeleton]=\"skeleton\"\n\t\t\t\t[tabs]=\"tabs\"\n\t\t\t\t[followFocus]=\"followFocus\"\n\t\t\t\t[cacheActive]=\"cacheActive\"\n\t\t\t\t[contentBefore]=\"before\"\n\t\t\t\t[contentAfter]=\"after\"\n\t\t\t\t[ariaLabel]=\"ariaLabel\"\n\t\t\t\t[ariaLabelledby]=\"ariaLabelledby\">\n\t\t\t</ibm-tab-headers>\n\t\t\t<ng-content></ng-content>\n\t\t\t<ng-template #before>\n\t\t\t\t<ng-content select=\"[before]\"></ng-content>\n\t\t\t</ng-template>\n\t\t\t<ng-template #after>\n\t\t\t\t<ng-content select=\"[after]\"></ng-content>\n\t\t\t</ng-template>\n\t\t\t<ibm-tab-headers\n\t\t\t\t*ngIf=\"hasTabHeaders() && position === 'bottom'\"\n\t\t\t\t[skeleton]=\"skeleton\"\n\t\t\t\t[tabs]=\"tabs\"\n\t\t\t\t[cacheActive]=\"cacheActive\">\n\t\t\t</ibm-tab-headers>\n\t "
                 },] },
     ];
     Tabs.propDecorators = {
@@ -105,6 +105,8 @@ var Tabs = /** @class */ (function () {
         followFocus: [{ type: Input }],
         skeleton: [{ type: Input }],
         isNavigation: [{ type: Input }],
+        ariaLabel: [{ type: Input }],
+        ariaLabelledby: [{ type: Input }],
         tabs: [{ type: ContentChildren, args: [Tab, { descendants: false },] }],
         tabHeaders: [{ type: ContentChild, args: [TabHeaders,] }]
     };

package/tabs/tabs.component.js.map

@@ -1 +1 @@
-{"version":3,"file":"tabs.component.js","sourceRoot":"","sources":["../src/tabs/tabs.component.ts"],"names":[],"mappings":"AAAA,OAAO,EACN,SAAS,EACT,KAAK,EACL,eAAe,EACf,SAAS,EAET,YAAY,EAEZ,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,GAAG,EAAE,MAAM,iBAAiB,CAAC;AACtC,OAAO,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAGrD;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH;IAAA;QA4BC;;;WAGG;QACM,aAAQ,GAAqB,KAAK,CAAC;QAC5C;;WAEG;QACM,gBAAW,GAAG,KAAK,CAAC;QAC7B;;WAEG;QACM,gBAAW,GAAG,IAAI,CAAC;QAC5B;;WAEG;QACM,aAAQ,GAAG,KAAK,CAAC;QAC1B;;WAEG;QACM,iBAAY,GAAG,KAAK,CAAC;IA+B/B,CAAC;IApBA;;;OAGG;IACH,iCAAkB,GAAlB;QAAA,iBAQC;QAPA,IAAI,IAAI,CAAC,UAAU,EAAE;YACpB,IAAI,CAAC,UAAU,CAAC,WAAW,GAAG,IAAI,CAAC,WAAW,CAAC;SAC/C;QAED,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,UAAA,GAAG;YACpB,GAAG,CAAC,QAAQ,GAAG,KAAI,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QAC3C,CAAC,CAAC,CAAC;IACJ,CAAC;IAED;;OAEG;IACH,4BAAa,GAAb;QACC,OAAO,IAAI,CAAC,IAAI,CAAC,MAAM,GAAG,CAAC,CAAC;IAC7B,CAAC;;gBA9ED,SAAS,SAAC;oBACV,QAAQ,EAAE,UAAU;oBACpB,QAAQ,EAAE,owBAuBR;iBACF;;;2BAMC,KAAK;8BAIL,KAAK;8BAIL,KAAK;2BAIL,KAAK;+BAIL,KAAK;uBAKL,eAAe,SAAC,GAAG,EAAE,EAAE,WAAW,EAAE,KAAK,EAAE;6BAI3C,YAAY,SAAC,UAAU;;IAsBzB,WAAC;CAAA,AA/ED,IA+EC;SApDY,IAAI","sourcesContent":["import {\n\tComponent,\n\tInput,\n\tContentChildren,\n\tQueryList,\n\tAfterContentInit,\n\tContentChild,\n\tQuery\n} from \"@angular/core\";\nimport { Tab } from \"./tab.component\";\nimport { TabHeaders } from \"./tab-headers.component\";\n\n\n/**\n * Build out your application's tabs using this component.\n * This is the parent of the `Tab` and `TabHeader` components.\n *\n * [See demo](../../?path=/story/tabs--basic)\n *\n * `Tabs` expects a set of `n-tab` elements\n *\n * ```html\n * <ibm-tabs>\n * \t<ibm-tab heading='tab1'>\n * \t\ttab 1 content\n * \t</ibm-tab>\n * \t<ibm-tab heading='tab1'>\n * \t\ttab 2 content\n * \t</ibm-tab>\n * \t<!-- ... -->\n * \t<ibm-tab heading='tab1'>\n * \t\ttab n content\n * \t</ibm-tab>\n * </ibm-tabs>\n * ```\n *\n * <example-url>../../iframe.html?id=tabs--basic</example-url>\n *\n * @export\n * @class Tabs\n * @implements {AfterContentInit}\n */\n@Component({\n\tselector: \"ibm-tabs\",\n\ttemplate: `\n\t\t\t<ibm-tab-headers\n\t\t\t\t*ngIf=\"hasTabHeaders() && position === 'top'\"\n\t\t\t\t[skeleton]=\"skeleton\"\n\t\t\t\t[tabs]=\"tabs\"\n\t\t\t\t[followFocus]=\"followFocus\"\n\t\t\t\t[cacheActive]=\"cacheActive\"\n\t\t\t\t[contentBefore]=\"before\"\n\t\t\t\t[contentAfter]=\"after\">\n\t\t\t</ibm-tab-headers>\n\t\t\t<ng-content></ng-content>\n\t\t\t<ng-template #before>\n\t\t\t\t<ng-content select=\"[before]\"></ng-content>\n\t\t\t</ng-template>\n\t\t\t<ng-template #after>\n\t\t\t\t<ng-content select=\"[after]\"></ng-content>\n\t\t\t</ng-template>\n\t\t\t<ibm-tab-headers\n\t\t\t\t*ngIf=\"hasTabHeaders() && position === 'bottom'\"\n\t\t\t\t[skeleton]=\"skeleton\"\n\t\t\t\t[tabs]=\"tabs\"\n\t\t\t\t[cacheActive]=\"cacheActive\">\n\t\t\t</ibm-tab-headers>\n\t `\n})\nexport class Tabs implements AfterContentInit {\n\t/**\n\t * Takes either the string value 'top' or 'bottom' to place TabHeader\n\t * relative to the `TabPanel`s.\n\t */\n\t@Input() position: \"top\" | \"bottom\" = \"top\";\n\t/**\n\t * Set to 'true' to have `Tab` items cached and not reloaded on tab switching.\n\t */\n\t@Input() cacheActive = false;\n\t/**\n\t * Set to 'true' to have tabs automatically activated and have their content displayed when they receive focus.\n\t */\n\t@Input() followFocus = true;\n\t/**\n\t * Set to `true` to put tabs in a loading state.\n\t */\n\t@Input() skeleton = false;\n\t/**\n\t * Set to `true` to have the tabIndex of the all tabpanels be -1.\n\t */\n\t@Input() isNavigation = false;\n\n\t/**\n\t * Maintains a `QueryList` of the `Tab` elements and updates if `Tab`s are added or removed.\n\t */\n\t@ContentChildren(Tab, { descendants: false }) tabs: QueryList<Tab>;\n\t/**\n\t * Content child of the projected header component\n\t */\n\t@ContentChild(TabHeaders) tabHeaders;\n\n\t/**\n\t * After content is initialized update `Tab`s to cache (if turned on) and set the initial\n\t * selected Tab item.\n\t */\n\tngAfterContentInit() {\n\t\tif (this.tabHeaders) {\n\t\t\tthis.tabHeaders.cacheActive = this.cacheActive;\n\t\t}\n\n\t\tthis.tabs.forEach(tab => {\n\t\t\ttab.tabIndex = this.isNavigation ? -1 : 0;\n\t\t});\n\t}\n\n\t/**\n\t * true if the n-tab's are passed directly to the component as children\n\t */\n\thasTabHeaders() {\n\t\treturn this.tabs.length > 0;\n\t}\n}\n"]}
+{"version":3,"file":"tabs.component.js","sourceRoot":"","sources":["../src/tabs/tabs.component.ts"],"names":[],"mappings":"AAAA,OAAO,EACN,SAAS,EACT,KAAK,EACL,eAAe,EACf,SAAS,EAET,YAAY,EAEZ,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,GAAG,EAAE,MAAM,iBAAiB,CAAC;AACtC,OAAO,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAGrD;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH;IAAA;QA8BC;;;WAGG;QACM,aAAQ,GAAqB,KAAK,CAAC;QAC5C;;WAEG;QACM,gBAAW,GAAG,KAAK,CAAC;QAC7B;;WAEG;QACM,gBAAW,GAAG,IAAI,CAAC;QAC5B;;WAEG;QACM,aAAQ,GAAG,KAAK,CAAC;QAC1B;;WAEG;QACM,iBAAY,GAAG,KAAK,CAAC;IAuC/B,CAAC;IApBA;;;OAGG;IACH,iCAAkB,GAAlB;QAAA,iBAQC;QAPA,IAAI,IAAI,CAAC,UAAU,EAAE;YACpB,IAAI,CAAC,UAAU,CAAC,WAAW,GAAG,IAAI,CAAC,WAAW,CAAC;SAC/C;QAED,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,UAAA,GAAG;YACpB,GAAG,CAAC,QAAQ,GAAG,KAAI,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QAC3C,CAAC,CAAC,CAAC;IACJ,CAAC;IAED;;OAEG;IACH,4BAAa,GAAb;QACC,OAAO,IAAI,CAAC,IAAI,CAAC,MAAM,GAAG,CAAC,CAAC;IAC7B,CAAC;;gBAxFD,SAAS,SAAC;oBACV,QAAQ,EAAE,UAAU;oBACpB,QAAQ,EAAE,o1BAyBR;iBACF;;;2BAMC,KAAK;8BAIL,KAAK;8BAIL,KAAK;2BAIL,KAAK;+BAIL,KAAK;4BAIL,KAAK;iCAIL,KAAK;uBAKL,eAAe,SAAC,GAAG,EAAE,EAAE,WAAW,EAAE,KAAK,EAAE;6BAI3C,YAAY,SAAC,UAAU;;IAsBzB,WAAC;CAAA,AAzFD,IAyFC;SA5DY,IAAI","sourcesContent":["import {\n\tComponent,\n\tInput,\n\tContentChildren,\n\tQueryList,\n\tAfterContentInit,\n\tContentChild,\n\tQuery\n} from \"@angular/core\";\nimport { Tab } from \"./tab.component\";\nimport { TabHeaders } from \"./tab-headers.component\";\n\n\n/**\n * Build out your application's tabs using this component.\n * This is the parent of the `Tab` and `TabHeader` components.\n *\n * [See demo](../../?path=/story/tabs--basic)\n *\n * `Tabs` expects a set of `n-tab` elements\n *\n * ```html\n * <ibm-tabs>\n * \t<ibm-tab heading='tab1'>\n * \t\ttab 1 content\n * \t</ibm-tab>\n * \t<ibm-tab heading='tab1'>\n * \t\ttab 2 content\n * \t</ibm-tab>\n * \t<!-- ... -->\n * \t<ibm-tab heading='tab1'>\n * \t\ttab n content\n * \t</ibm-tab>\n * </ibm-tabs>\n * ```\n *\n * <example-url>../../iframe.html?id=tabs--basic</example-url>\n *\n * @export\n * @class Tabs\n * @implements {AfterContentInit}\n */\n@Component({\n\tselector: \"ibm-tabs\",\n\ttemplate: `\n\t\t\t<ibm-tab-headers\n\t\t\t\t*ngIf=\"hasTabHeaders() && position === 'top'\"\n\t\t\t\t[skeleton]=\"skeleton\"\n\t\t\t\t[tabs]=\"tabs\"\n\t\t\t\t[followFocus]=\"followFocus\"\n\t\t\t\t[cacheActive]=\"cacheActive\"\n\t\t\t\t[contentBefore]=\"before\"\n\t\t\t\t[contentAfter]=\"after\"\n\t\t\t\t[ariaLabel]=\"ariaLabel\"\n\t\t\t\t[ariaLabelledby]=\"ariaLabelledby\">\n\t\t\t</ibm-tab-headers>\n\t\t\t<ng-content></ng-content>\n\t\t\t<ng-template #before>\n\t\t\t\t<ng-content select=\"[before]\"></ng-content>\n\t\t\t</ng-template>\n\t\t\t<ng-template #after>\n\t\t\t\t<ng-content select=\"[after]\"></ng-content>\n\t\t\t</ng-template>\n\t\t\t<ibm-tab-headers\n\t\t\t\t*ngIf=\"hasTabHeaders() && position === 'bottom'\"\n\t\t\t\t[skeleton]=\"skeleton\"\n\t\t\t\t[tabs]=\"tabs\"\n\t\t\t\t[cacheActive]=\"cacheActive\">\n\t\t\t</ibm-tab-headers>\n\t `\n})\nexport class Tabs implements AfterContentInit {\n\t/**\n\t * Takes either the string value 'top' or 'bottom' to place TabHeader\n\t * relative to the `TabPanel`s.\n\t */\n\t@Input() position: \"top\" | \"bottom\" = \"top\";\n\t/**\n\t * Set to 'true' to have `Tab` items cached and not reloaded on tab switching.\n\t */\n\t@Input() cacheActive = false;\n\t/**\n\t * Set to 'true' to have tabs automatically activated and have their content displayed when they receive focus.\n\t */\n\t@Input() followFocus = true;\n\t/**\n\t * Set to `true` to put tabs in a loading state.\n\t */\n\t@Input() skeleton = false;\n\t/**\n\t * Set to `true` to have the tabIndex of the all tabpanels be -1.\n\t */\n\t@Input() isNavigation = false;\n\t/**\n\t * Sets the aria label on the `TabHeader`s nav element.\n\t */\n\t@Input() ariaLabel: string;\n\t/**\n\t * Sets the aria labelledby on the `TabHeader`s nav element.\n\t */\n\t@Input() ariaLabelledby: string;\n\n\t/**\n\t * Maintains a `QueryList` of the `Tab` elements and updates if `Tab`s are added or removed.\n\t */\n\t@ContentChildren(Tab, { descendants: false }) tabs: QueryList<Tab>;\n\t/**\n\t * Content child of the projected header component\n\t */\n\t@ContentChild(TabHeaders) tabHeaders;\n\n\t/**\n\t * After content is initialized update `Tab`s to cache (if turned on) and set the initial\n\t * selected Tab item.\n\t */\n\tngAfterContentInit() {\n\t\tif (this.tabHeaders) {\n\t\t\tthis.tabHeaders.cacheActive = this.cacheActive;\n\t\t}\n\n\t\tthis.tabs.forEach(tab => {\n\t\t\ttab.tabIndex = this.isNavigation ? -1 : 0;\n\t\t});\n\t}\n\n\t/**\n\t * true if the n-tab's are passed directly to the component as children\n\t */\n\thasTabHeaders() {\n\t\treturn this.tabs.length > 0;\n\t}\n}\n"]}

package/tabs/tabs.component.metadata.json

@@ -1 +1 @@
-[{"__symbolic":"module","version":4,"metadata":{"Tabs":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":42,"character":1},"arguments":[{"selector":"ibm-tabs","template":"\n\t\t\t<ibm-tab-headers\n\t\t\t\t*ngIf=\"hasTabHeaders() && position === 'top'\"\n\t\t\t\t[skeleton]=\"skeleton\"\n\t\t\t\t[tabs]=\"tabs\"\n\t\t\t\t[followFocus]=\"followFocus\"\n\t\t\t\t[cacheActive]=\"cacheActive\"\n\t\t\t\t[contentBefore]=\"before\"\n\t\t\t\t[contentAfter]=\"after\">\n\t\t\t</ibm-tab-headers>\n\t\t\t<ng-content></ng-content>\n\t\t\t<ng-template #before>\n\t\t\t\t<ng-content select=\"[before]\"></ng-content>\n\t\t\t</ng-template>\n\t\t\t<ng-template #after>\n\t\t\t\t<ng-content select=\"[after]\"></ng-content>\n\t\t\t</ng-template>\n\t\t\t<ibm-tab-headers\n\t\t\t\t*ngIf=\"hasTabHeaders() && position === 'bottom'\"\n\t\t\t\t[skeleton]=\"skeleton\"\n\t\t\t\t[tabs]=\"tabs\"\n\t\t\t\t[cacheActive]=\"cacheActive\">\n\t\t\t</ibm-tab-headers>\n\t "}]}],"members":{"position":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":74,"character":2}}]}],"cacheActive":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":78,"character":2}}]}],"followFocus":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":82,"character":2}}]}],"skeleton":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":86,"character":2}}]}],"isNavigation":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":90,"character":2}}]}],"tabs":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChildren","line":95,"character":2},"arguments":[{"__symbolic":"reference","module":"./tab.component","name":"Tab","line":95,"character":18},{"descendants":false}]}]}],"tabHeaders":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild","line":99,"character":2},"arguments":[{"__symbolic":"reference","module":"./tab-headers.component","name":"TabHeaders","line":99,"character":15}]}]}],"ngAfterContentInit":[{"__symbolic":"method"}],"hasTabHeaders":[{"__symbolic":"method"}]}}}}]
+[{"__symbolic":"module","version":4,"metadata":{"Tabs":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":42,"character":1},"arguments":[{"selector":"ibm-tabs","template":"\n\t\t\t<ibm-tab-headers\n\t\t\t\t*ngIf=\"hasTabHeaders() && position === 'top'\"\n\t\t\t\t[skeleton]=\"skeleton\"\n\t\t\t\t[tabs]=\"tabs\"\n\t\t\t\t[followFocus]=\"followFocus\"\n\t\t\t\t[cacheActive]=\"cacheActive\"\n\t\t\t\t[contentBefore]=\"before\"\n\t\t\t\t[contentAfter]=\"after\"\n\t\t\t\t[ariaLabel]=\"ariaLabel\"\n\t\t\t\t[ariaLabelledby]=\"ariaLabelledby\">\n\t\t\t</ibm-tab-headers>\n\t\t\t<ng-content></ng-content>\n\t\t\t<ng-template #before>\n\t\t\t\t<ng-content select=\"[before]\"></ng-content>\n\t\t\t</ng-template>\n\t\t\t<ng-template #after>\n\t\t\t\t<ng-content select=\"[after]\"></ng-content>\n\t\t\t</ng-template>\n\t\t\t<ibm-tab-headers\n\t\t\t\t*ngIf=\"hasTabHeaders() && position === 'bottom'\"\n\t\t\t\t[skeleton]=\"skeleton\"\n\t\t\t\t[tabs]=\"tabs\"\n\t\t\t\t[cacheActive]=\"cacheActive\">\n\t\t\t</ibm-tab-headers>\n\t "}]}],"members":{"position":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":76,"character":2}}]}],"cacheActive":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":80,"character":2}}]}],"followFocus":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":84,"character":2}}]}],"skeleton":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":88,"character":2}}]}],"isNavigation":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":92,"character":2}}]}],"ariaLabel":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":96,"character":2}}]}],"ariaLabelledby":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":100,"character":2}}]}],"tabs":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChildren","line":105,"character":2},"arguments":[{"__symbolic":"reference","module":"./tab.component","name":"Tab","line":105,"character":18},{"descendants":false}]}]}],"tabHeaders":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild","line":109,"character":2},"arguments":[{"__symbolic":"reference","module":"./tab-headers.component","name":"TabHeaders","line":109,"character":15}]}]}],"ngAfterContentInit":[{"__symbolic":"method"}],"hasTabHeaders":[{"__symbolic":"method"}]}}}}]

package/tabs/tabs.component.ngfactory.js

@@ -32,18 +32,24 @@ import * as i4 from "./tabs.component";
 var styles_Tabs = [];
 var RenderType_Tabs = i0.ɵcrt({ encapsulation: 2, styles: styles_Tabs, data: {} });
 export { RenderType_Tabs as RenderType_Tabs };
-function View_Tabs_1(_l) { return i0.ɵvid(0, [(_l()(), i0.ɵeld(0, 0, null, null, 2, "ibm-tab-headers", [], null, [[null, "keydown"]], function (_v, en, $event) { var ad = true; if (("keydown" === en)) {
+function View_Tabs_1(_l) { return i0.ɵvid(0, [(_l()(), i0.ɵeld(0, 0, null, null, 2, "ibm-tab-headers", [], null, [[null, "keydown"], [null, "focusout"]], function (_v, en, $event) { var ad = true; if (("keydown" === en)) {
         var pd_0 = (i0.ɵnov(_v, 1).keyboardInput($event) !== false);
         ad = (pd_0 && ad);
-    } return ad; }, i1.View_TabHeaders_0, i1.RenderType_TabHeaders)), i0.ɵdid(1, 1097728, null, 1, i2.TabHeaders, [], { tabInput: [0, "tabInput"], cacheActive: [1, "cacheActive"], followFocus: [2, "followFocus"], skeleton: [3, "skeleton"], contentBefore: [4, "contentBefore"], contentAfter: [5, "contentAfter"] }, null), i0.ɵqud(603979776, 1, { tabQuery: 1 })], function (_ck, _v) { var _co = _v.component; var currVal_0 = _co.tabs; var currVal_1 = _co.cacheActive; var currVal_2 = _co.followFocus; var currVal_3 = _co.skeleton; var currVal_4 = i0.ɵnov(_v.parent, 3); var currVal_5 = i0.ɵnov(_v.parent, 4); _ck(_v, 1, 0, currVal_0, currVal_1, currVal_2, currVal_3, currVal_4, currVal_5); }, null); }
+    } if (("focusout" === en)) {
+        var pd_1 = (i0.ɵnov(_v, 1).focusOut($event) !== false);
+        ad = (pd_1 && ad);
+    } return ad; }, i1.View_TabHeaders_0, i1.RenderType_TabHeaders)), i0.ɵdid(1, 1097728, null, 1, i2.TabHeaders, [], { tabInput: [0, "tabInput"], cacheActive: [1, "cacheActive"], followFocus: [2, "followFocus"], skeleton: [3, "skeleton"], ariaLabel: [4, "ariaLabel"], ariaLabelledby: [5, "ariaLabelledby"], contentBefore: [6, "contentBefore"], contentAfter: [7, "contentAfter"] }, null), i0.ɵqud(603979776, 1, { tabQuery: 1 })], function (_ck, _v) { var _co = _v.component; var currVal_0 = _co.tabs; var currVal_1 = _co.cacheActive; var currVal_2 = _co.followFocus; var currVal_3 = _co.skeleton; var currVal_4 = _co.ariaLabel; var currVal_5 = _co.ariaLabelledby; var currVal_6 = i0.ɵnov(_v.parent, 3); var currVal_7 = i0.ɵnov(_v.parent, 4); _ck(_v, 1, 0, currVal_0, currVal_1, currVal_2, currVal_3, currVal_4, currVal_5, currVal_6, currVal_7); }, null); }
 function View_Tabs_2(_l) { return i0.ɵvid(0, [i0.ɵncd(null, 1), (_l()(), i0.ɵand(0, null, null, 0))], null, null); }
 function View_Tabs_3(_l) { return i0.ɵvid(0, [i0.ɵncd(null, 2), (_l()(), i0.ɵand(0, null, null, 0))], null, null); }
-function View_Tabs_4(_l) { return i0.ɵvid(0, [(_l()(), i0.ɵeld(0, 0, null, null, 2, "ibm-tab-headers", [], null, [[null, "keydown"]], function (_v, en, $event) { var ad = true; if (("keydown" === en)) {
+function View_Tabs_4(_l) { return i0.ɵvid(0, [(_l()(), i0.ɵeld(0, 0, null, null, 2, "ibm-tab-headers", [], null, [[null, "keydown"], [null, "focusout"]], function (_v, en, $event) { var ad = true; if (("keydown" === en)) {
         var pd_0 = (i0.ɵnov(_v, 1).keyboardInput($event) !== false);
         ad = (pd_0 && ad);
+    } if (("focusout" === en)) {
+        var pd_1 = (i0.ɵnov(_v, 1).focusOut($event) !== false);
+        ad = (pd_1 && ad);
     } return ad; }, i1.View_TabHeaders_0, i1.RenderType_TabHeaders)), i0.ɵdid(1, 1097728, null, 1, i2.TabHeaders, [], { tabInput: [0, "tabInput"], cacheActive: [1, "cacheActive"], skeleton: [2, "skeleton"] }, null), i0.ɵqud(603979776, 2, { tabQuery: 1 })], function (_ck, _v) { var _co = _v.component; var currVal_0 = _co.tabs; var currVal_1 = _co.cacheActive; var currVal_2 = _co.skeleton; _ck(_v, 1, 0, currVal_0, currVal_1, currVal_2); }, null); }
 export function View_Tabs_0(_l) { return i0.ɵvid(0, [(_l()(), i0.ɵand(16777216, null, null, 1, null, View_Tabs_1)), i0.ɵdid(1, 16384, null, 0, i3.NgIf, [i0.ViewContainerRef, i0.TemplateRef], { ngIf: [0, "ngIf"] }, null), i0.ɵncd(null, 0), (_l()(), i0.ɵand(0, [["before", 2]], null, 0, null, View_Tabs_2)), (_l()(), i0.ɵand(0, [["after", 2]], null, 0, null, View_Tabs_3)), (_l()(), i0.ɵand(16777216, null, null, 1, null, View_Tabs_4)), i0.ɵdid(6, 16384, null, 0, i3.NgIf, [i0.ViewContainerRef, i0.TemplateRef], { ngIf: [0, "ngIf"] }, null)], function (_ck, _v) { var _co = _v.component; var currVal_0 = (_co.hasTabHeaders() && (_co.position === "top")); _ck(_v, 1, 0, currVal_0); var currVal_1 = (_co.hasTabHeaders() && (_co.position === "bottom")); _ck(_v, 6, 0, currVal_1); }, null); }
 export function View_Tabs_Host_0(_l) { return i0.ɵvid(0, [(_l()(), i0.ɵeld(0, 0, null, null, 3, "ibm-tabs", [], null, null, null, View_Tabs_0, RenderType_Tabs)), i0.ɵdid(1, 1097728, null, 2, i4.Tabs, [], null, null), i0.ɵqud(603979776, 1, { tabs: 1 }), i0.ɵqud(335544320, 2, { tabHeaders: 0 })], null, null); }
-var TabsNgFactory = i0.ɵccf("ibm-tabs", i4.Tabs, View_Tabs_Host_0, { position: "position", cacheActive: "cacheActive", followFocus: "followFocus", skeleton: "skeleton", isNavigation: "isNavigation" }, {}, ["*", "[before]", "[after]"]);
+var TabsNgFactory = i0.ɵccf("ibm-tabs", i4.Tabs, View_Tabs_Host_0, { position: "position", cacheActive: "cacheActive", followFocus: "followFocus", skeleton: "skeleton", isNavigation: "isNavigation", ariaLabel: "ariaLabel", ariaLabelledby: "ariaLabelledby" }, {}, ["*", "[before]", "[after]"]);
 export { TabsNgFactory as TabsNgFactory };
 //# sourceMappingURL=tabs.component.ngfactory.js.map

package/tabs/tabs.component.ngfactory.js.map

@@ -1 +1 @@
-{"version":3,"file":"tabs.component.ngfactory.js","sourceRoot":"","sources":["../src/tabs/tabs.component.ngfactory.ts","../src/tabs/tabs.component.ts.Tabs.html"],"names":[],"mappings":";;;;;;;;;;;;;;+CCCG;;;oWAOwB,mDAJvB,mBAAa,OAEb,mBAA2B,cAD3B,mBAA2B,cAF3B,mBAAqB,WAIrB,oCAAwB,GACxB,oCAAsB,GAPvB,YAOwB,EAJvB,SAAa,EAEb,SAA2B,EAD3B,SAA2B,EAF3B,SAAqB,EAIrB,SAAwB,EACxB,SAAsB;8CAItB,eAA8B;8CAG9B,eAA6B;+CAE9B;;;2PAI6B,mDAD5B,mBAAa,OACb,mBAA2B,cAF3B,mBAAqB,WAFtB,YAI6B,EAD5B,SAAa,EACb,SAA2B,EAF3B,SAAqB;sDAlBtB,oKAOwB,GAExB,eAAY,IACZ,8DAAqB,KAGrB,6DAAoB,KAGpB,oKAI6B,iDAnB5B,+DAA6C,IAD9C,YAOwB,EANvB,SAA6C,GAgB7C,kEAAgD,IADjD,YAI6B,EAH5B,SAAgD","sourcesContent":["import * as i0 from '@angular/core';\ni0.ComponentFactory;\n","\n\t\t\t<ibm-tab-headers\n\t\t\t\t*ngIf=\"hasTabHeaders() && position === 'top'\"\n\t\t\t\t[skeleton]=\"skeleton\"\n\t\t\t\t[tabs]=\"tabs\"\n\t\t\t\t[followFocus]=\"followFocus\"\n\t\t\t\t[cacheActive]=\"cacheActive\"\n\t\t\t\t[contentBefore]=\"before\"\n\t\t\t\t[contentAfter]=\"after\">\n\t\t\t</ibm-tab-headers>\n\t\t\t<ng-content></ng-content>\n\t\t\t<ng-template #before>\n\t\t\t\t<ng-content select=\"[before]\"></ng-content>\n\t\t\t</ng-template>\n\t\t\t<ng-template #after>\n\t\t\t\t<ng-content select=\"[after]\"></ng-content>\n\t\t\t</ng-template>\n\t\t\t<ibm-tab-headers\n\t\t\t\t*ngIf=\"hasTabHeaders() && position === 'bottom'\"\n\t\t\t\t[skeleton]=\"skeleton\"\n\t\t\t\t[tabs]=\"tabs\"\n\t\t\t\t[cacheActive]=\"cacheActive\">\n\t\t\t</ibm-tab-headers>\n\t "]}
+{"version":3,"file":"tabs.component.ngfactory.js","sourceRoot":"","sources":["../src/tabs/tabs.component.ngfactory.ts","../src/tabs/tabs.component.ts.Tabs.html"],"names":[],"mappings":";;;;;;;;;;;;;;+CCCG;;;;;;waASmC,mDANlC,mBAAa,OAEb,mBAA2B,cAD3B,mBAA2B,cAF3B,mBAAqB,WAMrB,mBAAuB,YACvB,mBAAiC,iBAHjC,oCAAwB,GACxB,oCAAsB,GAPvB,YASmC,EANlC,SAAa,EAEb,SAA2B,EAD3B,SAA2B,EAF3B,SAAqB,EAMrB,SAAuB,EACvB,SAAiC,EAHjC,SAAwB,EACxB,SAAsB;8CAMtB,eAA8B;8CAG9B,eAA6B;+CAE9B;;;;;;2PAI6B,mDAD5B,mBAAa,OACb,mBAA2B,cAF3B,mBAAqB,WAFtB,YAI6B,EAD5B,SAAa,EACb,SAA2B,EAF3B,SAAqB;sDApBtB,oKASmC,GAEnC,eAAY,IACZ,8DAAqB,KAGrB,6DAAoB,KAGpB,oKAI6B,iDArB5B,+DAA6C,IAD9C,YASmC,EARlC,SAA6C,GAkB7C,kEAAgD,IADjD,YAI6B,EAH5B,SAAgD","sourcesContent":["import * as i0 from '@angular/core';\ni0.ComponentFactory;\n","\n\t\t\t<ibm-tab-headers\n\t\t\t\t*ngIf=\"hasTabHeaders() && position === 'top'\"\n\t\t\t\t[skeleton]=\"skeleton\"\n\t\t\t\t[tabs]=\"tabs\"\n\t\t\t\t[followFocus]=\"followFocus\"\n\t\t\t\t[cacheActive]=\"cacheActive\"\n\t\t\t\t[contentBefore]=\"before\"\n\t\t\t\t[contentAfter]=\"after\"\n\t\t\t\t[ariaLabel]=\"ariaLabel\"\n\t\t\t\t[ariaLabelledby]=\"ariaLabelledby\">\n\t\t\t</ibm-tab-headers>\n\t\t\t<ng-content></ng-content>\n\t\t\t<ng-template #before>\n\t\t\t\t<ng-content select=\"[before]\"></ng-content>\n\t\t\t</ng-template>\n\t\t\t<ng-template #after>\n\t\t\t\t<ng-content select=\"[after]\"></ng-content>\n\t\t\t</ng-template>\n\t\t\t<ibm-tab-headers\n\t\t\t\t*ngIf=\"hasTabHeaders() && position === 'bottom'\"\n\t\t\t\t[skeleton]=\"skeleton\"\n\t\t\t\t[tabs]=\"tabs\"\n\t\t\t\t[cacheActive]=\"cacheActive\">\n\t\t\t</ibm-tab-headers>\n\t "]}

package/tabs/tabs.component.ngsummary.json

@@ -1 +1 @@
-{"moduleName":null,"summaries":[{"symbol":{"__symbol":0,"members":[]},"metadata":{"__symbolic":"class","members":{"position":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]}}]}],"cacheActive":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]}}]}],"followFocus":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]}}]}],"skeleton":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]}}]}],"isNavigation":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]}}]}],"tabs":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":2,"members":[]},"arguments":[{"__symbol":3,"members":[]},{"descendants":false}]}]}],"tabHeaders":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":4,"members":[]},"arguments":[{"__symbol":5,"members":[]}]}]}],"ngAfterContentInit":[{"__symbolic":"method"}],"hasTabHeaders":[{"__symbolic":"method"}]}},"type":{"summaryKind":1,"type":{"reference":{"__symbol":0,"members":[]},"diDeps":[],"lifecycleHooks":[4]},"isComponent":true,"selector":"ibm-tabs","exportAs":null,"inputs":{"position":"position","cacheActive":"cacheActive","followFocus":"followFocus","skeleton":"skeleton","isNavigation":"isNavigation"},"outputs":{},"hostListeners":{},"hostProperties":{},"hostAttributes":{},"providers":[],"viewProviders":[],"queries":[{"selectors":[{"identifier":{"reference":{"__symbol":3,"members":[]}}}],"first":false,"descendants":false,"propertyName":"tabs","read":null},{"selectors":[{"identifier":{"reference":{"__symbol":5,"members":[]}}}],"first":true,"descendants":true,"propertyName":"tabHeaders","read":null}],"guards":{},"viewQueries":[],"entryComponents":[],"changeDetection":1,"template":{"ngContentSelectors":["*","[before]","[after]"],"encapsulation":2},"componentViewType":{"__symbol":6,"members":[]},"rendererType":{"__symbol":7,"members":[]},"componentFactory":{"__symbol":8,"members":[]}}}],"symbols":[{"__symbol":0,"name":"Tabs","filePath":"./tabs.component"},{"__symbol":1,"name":"Input","filePath":"@angular/core"},{"__symbol":2,"name":"ContentChildren","filePath":"@angular/core"},{"__symbol":3,"name":"Tab","filePath":"./tab.component"},{"__symbol":4,"name":"ContentChild","filePath":"@angular/core"},{"__symbol":5,"name":"TabHeaders","filePath":"./tab-headers.component"},{"__symbol":6,"name":"View_Tabs_0","filePath":"./tabs.component.ngfactory"},{"__symbol":7,"name":"RenderType_Tabs","filePath":"./tabs.component.ngfactory"},{"__symbol":8,"name":"TabsNgFactory","filePath":"./tabs.component.ngfactory"}]}
+{"moduleName":null,"summaries":[{"symbol":{"__symbol":0,"members":[]},"metadata":{"__symbolic":"class","members":{"position":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]}}]}],"cacheActive":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]}}]}],"followFocus":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]}}]}],"skeleton":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]}}]}],"isNavigation":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]}}]}],"ariaLabel":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]}}]}],"ariaLabelledby":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]}}]}],"tabs":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":2,"members":[]},"arguments":[{"__symbol":3,"members":[]},{"descendants":false}]}]}],"tabHeaders":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":4,"members":[]},"arguments":[{"__symbol":5,"members":[]}]}]}],"ngAfterContentInit":[{"__symbolic":"method"}],"hasTabHeaders":[{"__symbolic":"method"}]}},"type":{"summaryKind":1,"type":{"reference":{"__symbol":0,"members":[]},"diDeps":[],"lifecycleHooks":[4]},"isComponent":true,"selector":"ibm-tabs","exportAs":null,"inputs":{"position":"position","cacheActive":"cacheActive","followFocus":"followFocus","skeleton":"skeleton","isNavigation":"isNavigation","ariaLabel":"ariaLabel","ariaLabelledby":"ariaLabelledby"},"outputs":{},"hostListeners":{},"hostProperties":{},"hostAttributes":{},"providers":[],"viewProviders":[],"queries":[{"selectors":[{"identifier":{"reference":{"__symbol":3,"members":[]}}}],"first":false,"descendants":false,"propertyName":"tabs","read":null},{"selectors":[{"identifier":{"reference":{"__symbol":5,"members":[]}}}],"first":true,"descendants":true,"propertyName":"tabHeaders","read":null}],"guards":{},"viewQueries":[],"entryComponents":[],"changeDetection":1,"template":{"ngContentSelectors":["*","[before]","[after]"],"encapsulation":2},"componentViewType":{"__symbol":6,"members":[]},"rendererType":{"__symbol":7,"members":[]},"componentFactory":{"__symbol":8,"members":[]}}}],"symbols":[{"__symbol":0,"name":"Tabs","filePath":"./tabs.component"},{"__symbol":1,"name":"Input","filePath":"@angular/core"},{"__symbol":2,"name":"ContentChildren","filePath":"@angular/core"},{"__symbol":3,"name":"Tab","filePath":"./tab.component"},{"__symbol":4,"name":"ContentChild","filePath":"@angular/core"},{"__symbol":5,"name":"TabHeaders","filePath":"./tab-headers.component"},{"__symbol":6,"name":"View_Tabs_0","filePath":"./tabs.component.ngfactory"},{"__symbol":7,"name":"RenderType_Tabs","filePath":"./tabs.component.ngfactory"},{"__symbol":8,"name":"TabsNgFactory","filePath":"./tabs.component.ngfactory"}]}

package/tabs/tabs.module.ngfactory.js.map

@@ -1 +1 @@
-{"version":3,"file":"tabs.module.ngfactory.js","sourceRoot":"","sources":["../src/tabs/tabs.module.ngfactory.ts"],"names":[],"mappings":"","sourcesContent":["import * as i0 from '@angular/core';\nimport * as i1 from './tabs.module';\nimport * as i2 from '@angular/common';\nimport * as i3 from './tabs.component';\nimport * as i4 from './tab.component';\nimport * as i5 from './tab-headers.component';\nexport const TabsModuleNgFactory:i0.NgModuleFactory<i1.TabsModule> = (null as any);\nvar _decl0_0:i2.NgClass = (<any>(null as any));\nvar _decl0_1:i2.NgComponentOutlet = (<any>(null as any));\nvar _decl0_2:i2.NgForOf<any> = (<any>(null as any));\nvar _decl0_3:i2.NgIf = (<any>(null as any));\nvar _decl0_4:i2.NgTemplateOutlet = (<any>(null as any));\nvar _decl0_5:i2.NgStyle = (<any>(null as any));\nvar _decl0_6:i2.NgSwitch = (<any>(null as any));\nvar _decl0_7:i2.NgSwitchCase = (<any>(null as any));\nvar _decl0_8:i2.NgSwitchDefault = (<any>(null as any));\nvar _decl0_9:i2.NgPlural = (<any>(null as any));\nvar _decl0_10:i2.NgPluralCase = (<any>(null as any));\nvar _decl0_11:i3.Tabs = (<any>(null as any));\nvar _decl0_12:i4.Tab = (<any>(null as any));\nvar _decl0_13:i5.TabHeaders = (<any>(null as any));\nvar _decl0_14:i2.AsyncPipe = (<any>(null as any));\nvar _decl0_15:i2.UpperCasePipe = (<any>(null as any));\nvar _decl0_16:i2.LowerCasePipe = (<any>(null as any));\nvar _decl0_17:i2.JsonPipe = (<any>(null as any));\nvar _decl0_18:i2.SlicePipe = (<any>(null as any));\nvar _decl0_19:i2.DecimalPipe = (<any>(null as any));\nvar _decl0_20:i2.PercentPipe = (<any>(null as any));\nvar _decl0_21:i2.TitleCasePipe = (<any>(null as any));\nvar _decl0_22:i2.CurrencyPipe = (<any>(null as any));\nvar _decl0_23:i2.DatePipe = (<any>(null as any));\nvar _decl0_24:i2.I18nPluralPipe = (<any>(null as any));\nvar _decl0_25:i2.I18nSelectPipe = (<any>(null as any));\nvar _decl0_26:i2.KeyValuePipe = (<any>(null as any));\nvar _decl0_27:i2.CommonModule = (<any>(null as any));\nvar _decl0_28:i0.TemplateRef<any> = (<any>(null as any));\nvar _decl0_29:i0.ElementRef<any> = (<any>(null as any));\nfunction _View_Tabs_Host_1_0():void {\n  var _any:any = (null as any);\n}\nfunction _View_Tabs_1_0():void {\n  var _any:any = (null as any);\n  const currVal_0:any = (_decl0_11.hasTabHeaders() && (_decl0_11.position === 'top'));\n  currVal_0;\n  const currVal_1:any = (_decl0_11.hasTabHeaders() && (_decl0_11.position === 'bottom'));\n  currVal_1;\n}\nfunction _View_Tab_Host_2_0():void {\n  var _any:any = (null as any);\n}\nfunction _View_Tab_2_0():void {\n  var _any:any = (null as any);\n  const currVal_0:any = _decl0_12.shouldRender();\n  currVal_0;\n}\nfunction _View_TabHeaders_Host_3_0():void {\n  var _any:any = (null as any);\n}\nfunction _View_TabHeaders_3_0():void {\n  var _any:any = (null as any);\n  const currVal_0:any = 'bx--tabs';\n  currVal_0;\n  const currVal_1:any = (<any>{'bx--skeleton':_decl0_13.skeleton});\n  currVal_1;\n  const currVal_2:any = !_decl0_13.getSelectedTab().headingIsTemplate;\n  currVal_2;\n  const currVal_3:any = _decl0_13.getSelectedTab().headingIsTemplate;\n  currVal_3;\n  const currVal_4:any = 'bx--tabs__nav';\n  currVal_4;\n  const currVal_5:any = (<any>{'bx--tabs__nav--hidden':!_decl0_13.tabListVisible});\n  currVal_5;\n  const currVal_6:any = _decl0_13.contentBefore;\n  currVal_6;\n  const currVal_7:any = _decl0_13.tabs;\n  currVal_7;\n  const currVal_8:any = _decl0_13.contentAfter;\n  currVal_8;\n  const pd_9:any = ((<any>_decl0_13.showTabList()) !== false);\n}\n"]}
+{"version":3,"file":"tabs.module.ngfactory.js","sourceRoot":"","sources":["../src/tabs/tabs.module.ngfactory.ts"],"names":[],"mappings":"","sourcesContent":["import * as i0 from '@angular/core';\nimport * as i1 from './tabs.module';\nimport * as i2 from '@angular/common';\nimport * as i3 from './tabs.component';\nimport * as i4 from './tab.component';\nimport * as i5 from './tab-headers.component';\nexport const TabsModuleNgFactory:i0.NgModuleFactory<i1.TabsModule> = (null as any);\nvar _decl0_0:i2.NgClass = (<any>(null as any));\nvar _decl0_1:i2.NgComponentOutlet = (<any>(null as any));\nvar _decl0_2:i2.NgForOf<any> = (<any>(null as any));\nvar _decl0_3:i2.NgIf = (<any>(null as any));\nvar _decl0_4:i2.NgTemplateOutlet = (<any>(null as any));\nvar _decl0_5:i2.NgStyle = (<any>(null as any));\nvar _decl0_6:i2.NgSwitch = (<any>(null as any));\nvar _decl0_7:i2.NgSwitchCase = (<any>(null as any));\nvar _decl0_8:i2.NgSwitchDefault = (<any>(null as any));\nvar _decl0_9:i2.NgPlural = (<any>(null as any));\nvar _decl0_10:i2.NgPluralCase = (<any>(null as any));\nvar _decl0_11:i3.Tabs = (<any>(null as any));\nvar _decl0_12:i4.Tab = (<any>(null as any));\nvar _decl0_13:i5.TabHeaders = (<any>(null as any));\nvar _decl0_14:i2.AsyncPipe = (<any>(null as any));\nvar _decl0_15:i2.UpperCasePipe = (<any>(null as any));\nvar _decl0_16:i2.LowerCasePipe = (<any>(null as any));\nvar _decl0_17:i2.JsonPipe = (<any>(null as any));\nvar _decl0_18:i2.SlicePipe = (<any>(null as any));\nvar _decl0_19:i2.DecimalPipe = (<any>(null as any));\nvar _decl0_20:i2.PercentPipe = (<any>(null as any));\nvar _decl0_21:i2.TitleCasePipe = (<any>(null as any));\nvar _decl0_22:i2.CurrencyPipe = (<any>(null as any));\nvar _decl0_23:i2.DatePipe = (<any>(null as any));\nvar _decl0_24:i2.I18nPluralPipe = (<any>(null as any));\nvar _decl0_25:i2.I18nSelectPipe = (<any>(null as any));\nvar _decl0_26:i2.KeyValuePipe = (<any>(null as any));\nvar _decl0_27:i2.CommonModule = (<any>(null as any));\nvar _decl0_28:i0.TemplateRef<any> = (<any>(null as any));\nvar _decl0_29:i0.ElementRef<any> = (<any>(null as any));\nfunction _View_Tabs_Host_1_0():void {\n  var _any:any = (null as any);\n}\nfunction _View_Tabs_1_0():void {\n  var _any:any = (null as any);\n  const currVal_0:any = (_decl0_11.hasTabHeaders() && (_decl0_11.position === 'top'));\n  currVal_0;\n  const currVal_1:any = (_decl0_11.hasTabHeaders() && (_decl0_11.position === 'bottom'));\n  currVal_1;\n}\nfunction _View_Tab_Host_2_0():void {\n  var _any:any = (null as any);\n}\nfunction _View_Tab_2_0():void {\n  var _any:any = (null as any);\n  const currVal_0:any = _decl0_12.shouldRender();\n  currVal_0;\n}\nfunction _View_TabHeaders_Host_3_0():void {\n  var _any:any = (null as any);\n}\nfunction _View_TabHeaders_3_0():void {\n  var _any:any = (null as any);\n  const currVal_0:any = 'bx--tabs';\n  currVal_0;\n  const currVal_1:any = (<any>{'bx--skeleton':_decl0_13.skeleton});\n  currVal_1;\n  const currVal_2:any = _decl0_13.ariaLabel;\n  currVal_2;\n  const currVal_3:any = _decl0_13.ariaLabelledby;\n  currVal_3;\n  const currVal_4:any = !_decl0_13.getSelectedTab().headingIsTemplate;\n  currVal_4;\n  const currVal_5:any = _decl0_13.getSelectedTab().headingIsTemplate;\n  currVal_5;\n  const currVal_6:any = 'bx--tabs__nav';\n  currVal_6;\n  const currVal_7:any = (<any>{'bx--tabs__nav--hidden':!_decl0_13.tabListVisible});\n  currVal_7;\n  const currVal_8:any = _decl0_13.contentBefore;\n  currVal_8;\n  const currVal_9:any = _decl0_13.tabs;\n  currVal_9;\n  const currVal_10:any = _decl0_13.contentAfter;\n  currVal_10;\n  const pd_11:any = ((<any>_decl0_13.showTabList()) !== false);\n}\n"]}

package/ui-shell/header/hamburger.component.d.ts

@@ -21,28 +21,21 @@
 import { EventEmitter } from "@angular/core";
 import { I18n } from "../../i18n/i18n.module";
 /**
- * A slide-out hamburger menu
- *
- * TODO: This is a stub component, and needs to be implemented.
+ * A toggle for the side navigation
  */
 export declare class Hamburger {
     i18n: I18n;
     /**
      * Controls the active/selected state for the `Hamburger` menu.
-     * @type {boolean}
-     * @memberof Hamburger
      */
     active: boolean;
     /**
      * `EventEmitter` to notify parent components of menu click events.
-     * @type {EventEmitter<Object>}
-     * @memberof Hamburger
      */
     selected: EventEmitter<Object>;
     constructor(i18n: I18n);
     /**
      * Emit the Hamburger click event upwards.
-     * @memberof Hamburger
      */
     doClick(): void;
 }

package/ui-shell/header/hamburger.component.js

@@ -21,29 +21,22 @@
 import { Component, Output, EventEmitter, Input } from "@angular/core";
 import { I18n } from "../../i18n/i18n.module";
 /**
- * A slide-out hamburger menu
- *
- * TODO: This is a stub component, and needs to be implemented.
+ * A toggle for the side navigation
  */
 var Hamburger = /** @class */ (function () {
     function Hamburger(i18n) {
         this.i18n = i18n;
         /**
          * Controls the active/selected state for the `Hamburger` menu.
-         * @type {boolean}
-         * @memberof Hamburger
          */
         this.active = false;
         /**
          * `EventEmitter` to notify parent components of menu click events.
-         * @type {EventEmitter<Object>}
-         * @memberof Hamburger
          */
         this.selected = new EventEmitter();
     }
     /**
      * Emit the Hamburger click event upwards.
-     * @memberof Hamburger
      */
     Hamburger.prototype.doClick = function () {
         this.selected.emit(this.active);
@@ -51,7 +44,7 @@ var Hamburger = /** @class */ (function () {
     Hamburger.decorators = [
         { type: Component, args: [{
                     selector: "ibm-hamburger",
-                    template: "\n\t\t<button\n\t\t\t(click)=\"doClick()\"\n\t\t\t[ngClass]=\"{'bx--header__action--active': active}\"\n\t\t\tclass=\"bx--header__menu-trigger bx--header__action\"\n\t\t\t[attr.aria-label]=\"i18n.get('UI_SHELL.HEADER.MENU') | async\"\n\t\t\t[attr.title]=\"i18n.get('UI_SHELL.HEADER.MENU') | async\">\n\n\t\t\t<svg *ngIf=\"!active\" aria-hidden=\"true\" width=\"20\" height=\"20\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 32 32\">\n\t\t\t\t<path d=\"M4 6h24v2H4zm0 18h24v2H4zm0-9h24v2H4z\" />\n\t\t\t</svg>\n\n\t\t\t<svg *ngIf=\"active\" aria-hidden=\"true\" height=\"20\" width=\"20\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 32 32\">\n\t\t\t\t<path d=\"M24 9.4L22.6 8 16 14.6 9.4 8 8 9.4l6.6 6.6L8 22.6 9.4 24l6.6-6.6 6.6 6.6 1.4-1.4-6.6-6.6L24 9.4z\" />\n\t\t\t</svg>\n\t\t</button>\n\t"
+                    template: "\n\t\t<button\n\t\t\ttype=\"button\"\n\t\t\t(click)=\"doClick()\"\n\t\t\t[ngClass]=\"{'bx--header__action--active': active}\"\n\t\t\tclass=\"bx--header__menu-trigger bx--header__action bx--header__menu-toggle\"\n\t\t\t[attr.aria-label]=\"i18n.get('UI_SHELL.HEADER.MENU') | async\"\n\t\t\t[attr.title]=\"i18n.get('UI_SHELL.HEADER.MENU') | async\">\n\n\t\t\t<svg *ngIf=\"!active\" aria-hidden=\"true\" width=\"20\" height=\"20\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 32 32\">\n\t\t\t\t<path d=\"M4 6h24v2H4zm0 18h24v2H4zm0-9h24v2H4z\" />\n\t\t\t</svg>\n\n\t\t\t<svg *ngIf=\"active\" aria-hidden=\"true\" height=\"20\" width=\"20\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 32 32\">\n\t\t\t\t<path d=\"M24 9.4L22.6 8 16 14.6 9.4 8 8 9.4l6.6 6.6L8 22.6 9.4 24l6.6-6.6 6.6 6.6 1.4-1.4-6.6-6.6L24 9.4z\" />\n\t\t\t</svg>\n\t\t</button>\n\t"
                 },] },
     ];
     /** @nocollapse */

package/ui-shell/header/hamburger.component.js.map

@@ -1 +1 @@
-{"version":3,"file":"hamburger.component.js","sourceRoot":"","sources":["../../src/ui-shell/header/hamburger.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EACjB,MAAM,EACN,YAAY,EACZ,KAAK,EACL,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,IAAI,EAAE,MAAM,wBAAwB,CAAC;AAE9C;;;;GAIG;AACH;IAmCC,mBAAmB,IAAU;QAAV,SAAI,GAAJ,IAAI,CAAM;QAd7B;;;;WAIG;QACM,WAAM,GAAG,KAAK,CAAC;QAExB;;;;WAIG;QACO,aAAQ,GAAyB,IAAI,YAAY,EAAU,CAAC;IAErC,CAAC;IAElC;;;OAGG;IACI,2BAAO,GAAd;QACC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;IACjC,CAAC;;gBA3CD,SAAS,SAAC;oBACV,QAAQ,EAAE,eAAe;oBACzB,QAAQ,EAAE,0yBAgBT;iBACD;;;;gBA1BQ,IAAI;;;yBAiCX,KAAK;2BAOL,MAAM;;IAYR,gBAAC;CAAA,AA7CD,IA6CC;SAzBY,SAAS","sourcesContent":["import { Component,\n\tOutput,\n\tEventEmitter,\n\tInput\n} from \"@angular/core\";\nimport { I18n } from \"../../i18n/i18n.module\";\n\n/**\n * A slide-out hamburger menu\n *\n * TODO: This is a stub component, and needs to be implemented.\n */\n@Component({\n\tselector: \"ibm-hamburger\",\n\ttemplate: `\n\t\t<button\n\t\t\t(click)=\"doClick()\"\n\t\t\t[ngClass]=\"{'bx--header__action--active': active}\"\n\t\t\tclass=\"bx--header__menu-trigger bx--header__action\"\n\t\t\t[attr.aria-label]=\"i18n.get('UI_SHELL.HEADER.MENU') | async\"\n\t\t\t[attr.title]=\"i18n.get('UI_SHELL.HEADER.MENU') | async\">\n\n\t\t\t<svg *ngIf=\"!active\" aria-hidden=\"true\" width=\"20\" height=\"20\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 32 32\">\n\t\t\t\t<path d=\"M4 6h24v2H4zm0 18h24v2H4zm0-9h24v2H4z\" />\n\t\t\t</svg>\n\n\t\t\t<svg *ngIf=\"active\" aria-hidden=\"true\" height=\"20\" width=\"20\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 32 32\">\n\t\t\t\t<path d=\"M24 9.4L22.6 8 16 14.6 9.4 8 8 9.4l6.6 6.6L8 22.6 9.4 24l6.6-6.6 6.6 6.6 1.4-1.4-6.6-6.6L24 9.4z\" />\n\t\t\t</svg>\n\t\t</button>\n\t`\n})\nexport class Hamburger {\n\t/**\n\t * Controls the active/selected state for the `Hamburger` menu.\n\t * @type {boolean}\n\t * @memberof Hamburger\n\t */\n\t@Input() active = false;\n\n\t/**\n\t * `EventEmitter` to notify parent components of menu click events.\n\t * @type {EventEmitter<Object>}\n\t * @memberof Hamburger\n\t */\n\t@Output() selected: EventEmitter<Object> = new EventEmitter<Object>();\n\n\tconstructor(public i18n: I18n) { }\n\n\t/**\n\t * Emit the Hamburger click event upwards.\n\t * @memberof Hamburger\n\t */\n\tpublic doClick() {\n\t\tthis.selected.emit(this.active);\n\t}\n\n}\n"]}
+{"version":3,"file":"hamburger.component.js","sourceRoot":"","sources":["../../src/ui-shell/header/hamburger.component.ts"],"names":[],"mappings":"AAAA,OAAO,EACN,SAAS,EACT,MAAM,EACN,YAAY,EACZ,KAAK,EACL,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,IAAI,EAAE,MAAM,wBAAwB,CAAC;AAE9C;;GAEG;AACH;IAgCC,mBAAmB,IAAU;QAAV,SAAI,GAAJ,IAAI,CAAM;QAV7B;;WAEG;QACM,WAAM,GAAG,KAAK,CAAC;QAExB;;WAEG;QACO,aAAQ,GAAyB,IAAI,YAAY,EAAU,CAAC;IAErC,CAAC;IAElC;;OAEG;IACI,2BAAO,GAAd;QACC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;IACjC,CAAC;;gBAvCD,SAAS,SAAC;oBACV,QAAQ,EAAE,eAAe;oBACzB,QAAQ,EAAE,y1BAiBT;iBACD;;;;gBAzBQ,IAAI;;;yBA8BX,KAAK;2BAKL,MAAM;;IAUR,gBAAC;CAAA,AAxCD,IAwCC;SAnBY,SAAS","sourcesContent":["import {\n\tComponent,\n\tOutput,\n\tEventEmitter,\n\tInput\n} from \"@angular/core\";\nimport { I18n } from \"../../i18n/i18n.module\";\n\n/**\n * A toggle for the side navigation\n */\n@Component({\n\tselector: \"ibm-hamburger\",\n\ttemplate: `\n\t\t<button\n\t\t\ttype=\"button\"\n\t\t\t(click)=\"doClick()\"\n\t\t\t[ngClass]=\"{'bx--header__action--active': active}\"\n\t\t\tclass=\"bx--header__menu-trigger bx--header__action bx--header__menu-toggle\"\n\t\t\t[attr.aria-label]=\"i18n.get('UI_SHELL.HEADER.MENU') | async\"\n\t\t\t[attr.title]=\"i18n.get('UI_SHELL.HEADER.MENU') | async\">\n\n\t\t\t<svg *ngIf=\"!active\" aria-hidden=\"true\" width=\"20\" height=\"20\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 32 32\">\n\t\t\t\t<path d=\"M4 6h24v2H4zm0 18h24v2H4zm0-9h24v2H4z\" />\n\t\t\t</svg>\n\n\t\t\t<svg *ngIf=\"active\" aria-hidden=\"true\" height=\"20\" width=\"20\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 32 32\">\n\t\t\t\t<path d=\"M24 9.4L22.6 8 16 14.6 9.4 8 8 9.4l6.6 6.6L8 22.6 9.4 24l6.6-6.6 6.6 6.6 1.4-1.4-6.6-6.6L24 9.4z\" />\n\t\t\t</svg>\n\t\t</button>\n\t`\n})\nexport class Hamburger {\n\t/**\n\t * Controls the active/selected state for the `Hamburger` menu.\n\t */\n\t@Input() active = false;\n\n\t/**\n\t * `EventEmitter` to notify parent components of menu click events.\n\t */\n\t@Output() selected: EventEmitter<Object> = new EventEmitter<Object>();\n\n\tconstructor(public i18n: I18n) { }\n\n\t/**\n\t * Emit the Hamburger click event upwards.\n\t */\n\tpublic doClick() {\n\t\tthis.selected.emit(this.active);\n\t}\n}\n"]}

package/ui-shell/header/hamburger.component.metadata.json

@@ -1 +1 @@
-[{"__symbolic":"module","version":4,"metadata":{"Hamburger":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":12,"character":1},"arguments":[{"selector":"ibm-hamburger","template":"\n\t\t<button\n\t\t\t(click)=\"doClick()\"\n\t\t\t[ngClass]=\"{'bx--header__action--active': active}\"\n\t\t\tclass=\"bx--header__menu-trigger bx--header__action\"\n\t\t\t[attr.aria-label]=\"i18n.get('UI_SHELL.HEADER.MENU') | async\"\n\t\t\t[attr.title]=\"i18n.get('UI_SHELL.HEADER.MENU') | async\">\n\n\t\t\t<svg *ngIf=\"!active\" aria-hidden=\"true\" width=\"20\" height=\"20\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 32 32\">\n\t\t\t\t<path d=\"M4 6h24v2H4zm0 18h24v2H4zm0-9h24v2H4z\" />\n\t\t\t</svg>\n\n\t\t\t<svg *ngIf=\"active\" aria-hidden=\"true\" height=\"20\" width=\"20\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 32 32\">\n\t\t\t\t<path d=\"M24 9.4L22.6 8 16 14.6 9.4 8 8 9.4l6.6 6.6L8 22.6 9.4 24l6.6-6.6 6.6 6.6 1.4-1.4-6.6-6.6L24 9.4z\" />\n\t\t\t</svg>\n\t\t</button>\n\t"}]}],"members":{"active":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":38,"character":2}}]}],"selected":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":45,"character":2}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"../../i18n/i18n.module","name":"I18n","line":47,"character":26}]}],"doClick":[{"__symbolic":"method"}]}}}}]
+[{"__symbolic":"module","version":4,"metadata":{"Hamburger":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":11,"character":1},"arguments":[{"selector":"ibm-hamburger","template":"\n\t\t<button\n\t\t\ttype=\"button\"\n\t\t\t(click)=\"doClick()\"\n\t\t\t[ngClass]=\"{'bx--header__action--active': active}\"\n\t\t\tclass=\"bx--header__menu-trigger bx--header__action bx--header__menu-toggle\"\n\t\t\t[attr.aria-label]=\"i18n.get('UI_SHELL.HEADER.MENU') | async\"\n\t\t\t[attr.title]=\"i18n.get('UI_SHELL.HEADER.MENU') | async\">\n\n\t\t\t<svg *ngIf=\"!active\" aria-hidden=\"true\" width=\"20\" height=\"20\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 32 32\">\n\t\t\t\t<path d=\"M4 6h24v2H4zm0 18h24v2H4zm0-9h24v2H4z\" />\n\t\t\t</svg>\n\n\t\t\t<svg *ngIf=\"active\" aria-hidden=\"true\" height=\"20\" width=\"20\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 32 32\">\n\t\t\t\t<path d=\"M24 9.4L22.6 8 16 14.6 9.4 8 8 9.4l6.6 6.6L8 22.6 9.4 24l6.6-6.6 6.6 6.6 1.4-1.4-6.6-6.6L24 9.4z\" />\n\t\t\t</svg>\n\t\t</button>\n\t"}]}],"members":{"active":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":36,"character":2}}]}],"selected":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":41,"character":2}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"../../i18n/i18n.module","name":"I18n","line":43,"character":26}]}],"doClick":[{"__symbolic":"method"}]}}}}]

package/ui-shell/header/hamburger.component.ngfactory.js

@@ -33,10 +33,10 @@ var RenderType_Hamburger = i0.ɵcrt({ encapsulation: 2, styles: styles_Hamburger
 export { RenderType_Hamburger as RenderType_Hamburger };
 function View_Hamburger_1(_l) { return i0.ɵvid(0, [(_l()(), i0.ɵeld(0, 0, null, null, 1, ":svg:svg", [["aria-hidden", "true"], ["height", "20"], ["viewBox", "0 0 32 32"], ["width", "20"], ["xmlns", "http://www.w3.org/2000/svg"]], null, null, null, null, null)), (_l()(), i0.ɵeld(1, 0, null, null, 0, ":svg:path", [["d", "M4 6h24v2H4zm0 18h24v2H4zm0-9h24v2H4z"]], null, null, null, null, null))], null, null); }
 function View_Hamburger_2(_l) { return i0.ɵvid(0, [(_l()(), i0.ɵeld(0, 0, null, null, 1, ":svg:svg", [["aria-hidden", "true"], ["height", "20"], ["viewBox", "0 0 32 32"], ["width", "20"], ["xmlns", "http://www.w3.org/2000/svg"]], null, null, null, null, null)), (_l()(), i0.ɵeld(1, 0, null, null, 0, ":svg:path", [["d", "M24 9.4L22.6 8 16 14.6 9.4 8 8 9.4l6.6 6.6L8 22.6 9.4 24l6.6-6.6 6.6 6.6 1.4-1.4-6.6-6.6L24 9.4z"]], null, null, null, null, null))], null, null); }
-export function View_Hamburger_0(_l) { return i0.ɵvid(0, [(_l()(), i0.ɵeld(0, 0, null, null, 8, "button", [["class", "bx--header__menu-trigger bx--header__action"]], [[1, "aria-label", 0], [1, "title", 0]], [[null, "click"]], function (_v, en, $event) { var ad = true; var _co = _v.component; if (("click" === en)) {
+export function View_Hamburger_0(_l) { return i0.ɵvid(0, [(_l()(), i0.ɵeld(0, 0, null, null, 8, "button", [["class", "bx--header__menu-trigger bx--header__action bx--header__menu-toggle"], ["type", "button"]], [[1, "aria-label", 0], [1, "title", 0]], [[null, "click"]], function (_v, en, $event) { var ad = true; var _co = _v.component; if (("click" === en)) {
         var pd_0 = (_co.doClick() !== false);
         ad = (pd_0 && ad);
-    } return ad; }, null, null)), i0.ɵdid(1, 278528, null, 0, i1.NgClass, [i0.IterableDiffers, i0.KeyValueDiffers, i0.ElementRef, i0.Renderer2], { klass: [0, "klass"], ngClass: [1, "ngClass"] }, null), i0.ɵpod(2, { "bx--header__action--active": 0 }), i0.ɵpid(131072, i1.AsyncPipe, [i0.ChangeDetectorRef]), i0.ɵpid(131072, i1.AsyncPipe, [i0.ChangeDetectorRef]), (_l()(), i0.ɵand(16777216, null, null, 1, null, View_Hamburger_1)), i0.ɵdid(6, 16384, null, 0, i1.NgIf, [i0.ViewContainerRef, i0.TemplateRef], { ngIf: [0, "ngIf"] }, null), (_l()(), i0.ɵand(16777216, null, null, 1, null, View_Hamburger_2)), i0.ɵdid(8, 16384, null, 0, i1.NgIf, [i0.ViewContainerRef, i0.TemplateRef], { ngIf: [0, "ngIf"] }, null)], function (_ck, _v) { var _co = _v.component; var currVal_2 = "bx--header__menu-trigger bx--header__action"; var currVal_3 = _ck(_v, 2, 0, _co.active); _ck(_v, 1, 0, currVal_2, currVal_3); var currVal_4 = !_co.active; _ck(_v, 6, 0, currVal_4); var currVal_5 = _co.active; _ck(_v, 8, 0, currVal_5); }, function (_ck, _v) { var _co = _v.component; var currVal_0 = i0.ɵunv(_v, 0, 0, i0.ɵnov(_v, 3).transform(_co.i18n.get("UI_SHELL.HEADER.MENU"))); var currVal_1 = i0.ɵunv(_v, 0, 1, i0.ɵnov(_v, 4).transform(_co.i18n.get("UI_SHELL.HEADER.MENU"))); _ck(_v, 0, 0, currVal_0, currVal_1); }); }
+    } return ad; }, null, null)), i0.ɵdid(1, 278528, null, 0, i1.NgClass, [i0.IterableDiffers, i0.KeyValueDiffers, i0.ElementRef, i0.Renderer2], { klass: [0, "klass"], ngClass: [1, "ngClass"] }, null), i0.ɵpod(2, { "bx--header__action--active": 0 }), i0.ɵpid(131072, i1.AsyncPipe, [i0.ChangeDetectorRef]), i0.ɵpid(131072, i1.AsyncPipe, [i0.ChangeDetectorRef]), (_l()(), i0.ɵand(16777216, null, null, 1, null, View_Hamburger_1)), i0.ɵdid(6, 16384, null, 0, i1.NgIf, [i0.ViewContainerRef, i0.TemplateRef], { ngIf: [0, "ngIf"] }, null), (_l()(), i0.ɵand(16777216, null, null, 1, null, View_Hamburger_2)), i0.ɵdid(8, 16384, null, 0, i1.NgIf, [i0.ViewContainerRef, i0.TemplateRef], { ngIf: [0, "ngIf"] }, null)], function (_ck, _v) { var _co = _v.component; var currVal_2 = "bx--header__menu-trigger bx--header__action bx--header__menu-toggle"; var currVal_3 = _ck(_v, 2, 0, _co.active); _ck(_v, 1, 0, currVal_2, currVal_3); var currVal_4 = !_co.active; _ck(_v, 6, 0, currVal_4); var currVal_5 = _co.active; _ck(_v, 8, 0, currVal_5); }, function (_ck, _v) { var _co = _v.component; var currVal_0 = i0.ɵunv(_v, 0, 0, i0.ɵnov(_v, 3).transform(_co.i18n.get("UI_SHELL.HEADER.MENU"))); var currVal_1 = i0.ɵunv(_v, 0, 1, i0.ɵnov(_v, 4).transform(_co.i18n.get("UI_SHELL.HEADER.MENU"))); _ck(_v, 0, 0, currVal_0, currVal_1); }); }
 export function View_Hamburger_Host_0(_l) { return i0.ɵvid(0, [(_l()(), i0.ɵeld(0, 0, null, null, 1, "ibm-hamburger", [], null, null, null, View_Hamburger_0, RenderType_Hamburger)), i0.ɵdid(1, 49152, null, 0, i2.Hamburger, [i3.I18n], null, null)], null, null); }
 var HamburgerNgFactory = i0.ɵccf("ibm-hamburger", i2.Hamburger, View_Hamburger_Host_0, { active: "active" }, { selected: "selected" }, []);
 export { HamburgerNgFactory as HamburgerNgFactory };

package/ui-shell/header/hamburger.component.ngfactory.js.map

@@ -1 +1 @@
-{"version":3,"file":"hamburger.component.ngfactory.js","sourceRoot":"","sources":["../../src/ui-shell/header/hamburger.component.ngfactory.ts","../../src/ui-shell/header/hamburger.component.ts.Hamburger.html"],"names":[],"mappings":";;;;;;;;;;;;;oDCQG,8MAAsH,KACrH,gIAAkD;oDAGnD,8MAAqH,KACpH,2LAA6G;2DAZ/G,8NAKyD,YAJxD;;wBAAmB;MADpB,iMAKyD,GAHxD,4CAAkD,KAElD,mDAA4D,IAC5D,mDAAuD,KAEvD,yKAAsH,IAItH,yKAAqH,iDARrH,6DAAmD,EADnD,iCAAkD,UAFnD,YAKyD,EAFxD,SAAmD,EADnD,SAAkD,GAK7C,oBAAe,SAApB,YAAsH,EAAjH,SAAe,GAIf,mBAAc,SAAnB,YAAqH,EAAhH,SAAc,mDAPnB,8FAA4D,KAC5D,8FAAuD,KALxD,YAKyD,EADxD,SAA4D,EAC5D,SAAuD","sourcesContent":["import * as i0 from '@angular/core';\ni0.ComponentFactory;\n","\n\t\t<button\n\t\t\t(click)=\"doClick()\"\n\t\t\t[ngClass]=\"{'bx--header__action--active': active}\"\n\t\t\tclass=\"bx--header__menu-trigger bx--header__action\"\n\t\t\t[attr.aria-label]=\"i18n.get('UI_SHELL.HEADER.MENU') | async\"\n\t\t\t[attr.title]=\"i18n.get('UI_SHELL.HEADER.MENU') | async\">\n\n\t\t\t<svg *ngIf=\"!active\" aria-hidden=\"true\" width=\"20\" height=\"20\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 32 32\">\n\t\t\t\t<path d=\"M4 6h24v2H4zm0 18h24v2H4zm0-9h24v2H4z\" />\n\t\t\t</svg>\n\n\t\t\t<svg *ngIf=\"active\" aria-hidden=\"true\" height=\"20\" width=\"20\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 32 32\">\n\t\t\t\t<path d=\"M24 9.4L22.6 8 16 14.6 9.4 8 8 9.4l6.6 6.6L8 22.6 9.4 24l6.6-6.6 6.6 6.6 1.4-1.4-6.6-6.6L24 9.4z\" />\n\t\t\t</svg>\n\t\t</button>\n\t"]}
+{"version":3,"file":"hamburger.component.ngfactory.js","sourceRoot":"","sources":["../../src/ui-shell/header/hamburger.component.ngfactory.ts","../../src/ui-shell/header/hamburger.component.ts.Hamburger.html"],"names":[],"mappings":";;;;;;;;;;;;;oDCSG,8MAAsH,KACrH,gIAAkD;oDAGnD,8MAAqH,KACpH,2LAA6G;2DAb/G,0QAMyD,YAJxD;;wBAAmB;MAFpB,iMAMyD,GAHxD,4CAAkD,KAElD,mDAA4D,IAC5D,mDAAuD,KAEvD,yKAAsH,IAItH,yKAAqH,iDARrH,qFAA2E,EAD3E,iCAAkD,UAHnD,YAMyD,EAFxD,SAA2E,EAD3E,SAAkD,GAK7C,oBAAe,SAApB,YAAsH,EAAjH,SAAe,GAIf,mBAAc,SAAnB,YAAqH,EAAhH,SAAc,mDAPnB,8FAA4D,KAC5D,8FAAuD,KANxD,YAMyD,EADxD,SAA4D,EAC5D,SAAuD","sourcesContent":["import * as i0 from '@angular/core';\ni0.ComponentFactory;\n","\n\t\t<button\n\t\t\ttype=\"button\"\n\t\t\t(click)=\"doClick()\"\n\t\t\t[ngClass]=\"{'bx--header__action--active': active}\"\n\t\t\tclass=\"bx--header__menu-trigger bx--header__action bx--header__menu-toggle\"\n\t\t\t[attr.aria-label]=\"i18n.get('UI_SHELL.HEADER.MENU') | async\"\n\t\t\t[attr.title]=\"i18n.get('UI_SHELL.HEADER.MENU') | async\">\n\n\t\t\t<svg *ngIf=\"!active\" aria-hidden=\"true\" width=\"20\" height=\"20\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 32 32\">\n\t\t\t\t<path d=\"M4 6h24v2H4zm0 18h24v2H4zm0-9h24v2H4z\" />\n\t\t\t</svg>\n\n\t\t\t<svg *ngIf=\"active\" aria-hidden=\"true\" height=\"20\" width=\"20\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 32 32\">\n\t\t\t\t<path d=\"M24 9.4L22.6 8 16 14.6 9.4 8 8 9.4l6.6 6.6L8 22.6 9.4 24l6.6-6.6 6.6 6.6 1.4-1.4-6.6-6.6L24 9.4z\" />\n\t\t\t</svg>\n\t\t</button>\n\t"]}

package/ui-shell/header/header-action.component.d.ts

@@ -19,9 +19,25 @@
 
 
 import { EventEmitter } from "@angular/core";
+/**
+ * Contained by `HeaderGlobal`. Generally used to trigger `Panel`s
+ */
 export declare class HeaderAction {
+    /**
+     * Title. Populates the aria-label as well as the browser `title` tooltip
+     */
     title: string;
+    /**
+     * Toggles the active state. May be used to toggle a `Panel`s active state.
+     */
     active: boolean;
+    /**
+     * "Change" emitter to allow double binding to the `active` Input.
+     */
+    activeChange: EventEmitter<boolean>;
+    /**
+     * Emits when the action has been clicked.
+     */
     selected: EventEmitter<boolean>;
     onClick(): void;
 }

package/ui-shell/header/header-action.component.js

@@ -19,15 +19,32 @@
 
 
 import { Component, Input, Output, EventEmitter } from "@angular/core";
+/**
+ * Contained by `HeaderGlobal`. Generally used to trigger `Panel`s
+ */
 var HeaderAction = /** @class */ (function () {
     function HeaderAction() {
+        /**
+         * Title. Populates the aria-label as well as the browser `title` tooltip
+         */
         this.title = "";
+        /**
+         * Toggles the active state. May be used to toggle a `Panel`s active state.
+         */
         this.active = false;
+        /**
+         * "Change" emitter to allow double binding to the `active` Input.
+         */
+        this.activeChange = new EventEmitter();
+        /**
+         * Emits when the action has been clicked.
+         */
         this.selected = new EventEmitter();
     }
     HeaderAction.prototype.onClick = function () {
         this.active = !this.active;
         this.selected.emit(this.active);
+        this.activeChange.emit(this.active);
     };
     HeaderAction.decorators = [
         { type: Component, args: [{
@@ -38,6 +55,7 @@ var HeaderAction = /** @class */ (function () {
     HeaderAction.propDecorators = {
         title: [{ type: Input }],
         active: [{ type: Input }],
+        activeChange: [{ type: Input }],
         selected: [{ type: Output }]
     };
     return HeaderAction;

package/ui-shell/header/header-action.component.js.map

@@ -1 +1 @@
-{"version":3,"file":"header-action.component.js","sourceRoot":"","sources":["../../src/ui-shell/header/header-action.component.ts"],"names":[],"mappings":"AAAA,OAAO,EACN,SAAS,EACT,KAAK,EACL,MAAM,EACN,YAAY,EACZ,MAAM,eAAe,CAAC;AAEvB;IAAA;QAiBU,UAAK,GAAG,EAAE,CAAC;QACX,WAAM,GAAG,KAAK,CAAC;QACd,aAAQ,GAAG,IAAI,YAAY,EAAW,CAAC;IAMlD,CAAC;IAJA,8BAAO,GAAP;QACC,IAAI,CAAC,MAAM,GAAG,CAAC,IAAI,CAAC,MAAM,CAAC;QAC3B,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;IACjC,CAAC;;gBAxBD,SAAS,SAAC;oBACV,QAAQ,EAAE,mBAAmB;oBAC7B,QAAQ,EAAE,mWAYT;iBACD;;;wBAEC,KAAK;yBACL,KAAK;2BACL,MAAM;;IAMR,mBAAC;CAAA,AAzBD,IAyBC;SATY,YAAY","sourcesContent":["import {\n\tComponent,\n\tInput,\n\tOutput,\n\tEventEmitter\n} from \"@angular/core\";\n\n@Component({\n\tselector: \"ibm-header-action\",\n\ttemplate: `\n\t\t<button\n\t\t\tclass=\"bx--header__action\"\n\t\t\t[ngClass]=\"{\n\t\t\t\t'bx--header__action--active': active\n\t\t\t}\"\n\t\t\t[attr.aria-label]=\"title\"\n\t\t\t[title]=\"title\"\n\t\t\t(click)=\"onClick()\">\n\t\t\t<ng-content></ng-content>\n\t\t\t<svg ibmIconClose20 class=\"bx--navigation-menu-panel-collapse-icon\"></svg>\n\t\t</button>\n\t`\n})\nexport class HeaderAction {\n\t@Input() title = \"\";\n\t@Input() active = false;\n\t@Output() selected = new EventEmitter<boolean>();\n\n\tonClick() {\n\t\tthis.active = !this.active;\n\t\tthis.selected.emit(this.active);\n\t}\n}\n"]}
+{"version":3,"file":"header-action.component.js","sourceRoot":"","sources":["../../src/ui-shell/header/header-action.component.ts"],"names":[],"mappings":"AAAA,OAAO,EACN,SAAS,EACT,KAAK,EACL,MAAM,EACN,YAAY,EACZ,MAAM,eAAe,CAAC;AAEvB;;GAEG;AACH;IAAA;QAiBC;;WAEG;QACM,UAAK,GAAG,EAAE,CAAC;QACpB;;WAEG;QACM,WAAM,GAAG,KAAK,CAAC;QACxB;;WAEG;QACM,iBAAY,GAAG,IAAI,YAAY,EAAW,CAAC;QACpD;;WAEG;QACO,aAAQ,GAAG,IAAI,YAAY,EAAW,CAAC;IAOlD,CAAC;IALA,8BAAO,GAAP;QACC,IAAI,CAAC,MAAM,GAAG,CAAC,IAAI,CAAC,MAAM,CAAC;QAC3B,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;QAChC,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;IACrC,CAAC;;gBAtCD,SAAS,SAAC;oBACV,QAAQ,EAAE,mBAAmB;oBAC7B,QAAQ,EAAE,mWAYT;iBACD;;;wBAKC,KAAK;yBAIL,KAAK;+BAIL,KAAK;2BAIL,MAAM;;IAOR,mBAAC;CAAA,AAvCD,IAuCC;SAvBY,YAAY","sourcesContent":["import {\n\tComponent,\n\tInput,\n\tOutput,\n\tEventEmitter\n} from \"@angular/core\";\n\n/**\n * Contained by `HeaderGlobal`. Generally used to trigger `Panel`s\n */\n@Component({\n\tselector: \"ibm-header-action\",\n\ttemplate: `\n\t\t<button\n\t\t\tclass=\"bx--header__action\"\n\t\t\t[ngClass]=\"{\n\t\t\t\t'bx--header__action--active': active\n\t\t\t}\"\n\t\t\t[attr.aria-label]=\"title\"\n\t\t\t[title]=\"title\"\n\t\t\t(click)=\"onClick()\">\n\t\t\t<ng-content></ng-content>\n\t\t\t<svg ibmIconClose20 class=\"bx--navigation-menu-panel-collapse-icon\"></svg>\n\t\t</button>\n\t`\n})\nexport class HeaderAction {\n\t/**\n\t * Title. Populates the aria-label as well as the browser `title` tooltip\n\t */\n\t@Input() title = \"\";\n\t/**\n\t * Toggles the active state. May be used to toggle a `Panel`s active state.\n\t */\n\t@Input() active = false;\n\t/**\n\t * \"Change\" emitter to allow double binding to the `active` Input.\n\t */\n\t@Input() activeChange = new EventEmitter<boolean>();\n\t/**\n\t * Emits when the action has been clicked.\n\t */\n\t@Output() selected = new EventEmitter<boolean>();\n\n\tonClick() {\n\t\tthis.active = !this.active;\n\t\tthis.selected.emit(this.active);\n\t\tthis.activeChange.emit(this.active);\n\t}\n}\n"]}

package/ui-shell/header/header-action.component.metadata.json

@@ -1 +1 @@
-[{"__symbolic":"module","version":4,"metadata":{"HeaderAction":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":7,"character":1},"arguments":[{"selector":"ibm-header-action","template":"\n\t\t<button\n\t\t\tclass=\"bx--header__action\"\n\t\t\t[ngClass]=\"{\n\t\t\t\t'bx--header__action--active': active\n\t\t\t}\"\n\t\t\t[attr.aria-label]=\"title\"\n\t\t\t[title]=\"title\"\n\t\t\t(click)=\"onClick()\">\n\t\t\t<ng-content></ng-content>\n\t\t\t<svg ibmIconClose20 class=\"bx--navigation-menu-panel-collapse-icon\"></svg>\n\t\t</button>\n\t"}]}],"members":{"title":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":24,"character":2}}]}],"active":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":25,"character":2}}]}],"selected":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":26,"character":2}}]}],"onClick":[{"__symbolic":"method"}]}}}}]
+[{"__symbolic":"module","version":4,"metadata":{"HeaderAction":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":10,"character":1},"arguments":[{"selector":"ibm-header-action","template":"\n\t\t<button\n\t\t\tclass=\"bx--header__action\"\n\t\t\t[ngClass]=\"{\n\t\t\t\t'bx--header__action--active': active\n\t\t\t}\"\n\t\t\t[attr.aria-label]=\"title\"\n\t\t\t[title]=\"title\"\n\t\t\t(click)=\"onClick()\">\n\t\t\t<ng-content></ng-content>\n\t\t\t<svg ibmIconClose20 class=\"bx--navigation-menu-panel-collapse-icon\"></svg>\n\t\t</button>\n\t"}]}],"members":{"title":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":30,"character":2}}]}],"active":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":34,"character":2}}]}],"activeChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":38,"character":2}}]}],"selected":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":42,"character":2}}]}],"onClick":[{"__symbolic":"method"}]}}}}]

package/ui-shell/header/header-action.component.ngfactory.js

@@ -36,6 +36,6 @@ export function View_HeaderAction_0(_l) { return i0.ɵvid(0, [(_l()(), i0.ɵeld(
         ad = (pd_0 && ad);
     } return ad; }, null, null)), i0.ɵdid(1, 278528, null, 0, i1.NgClass, [i0.IterableDiffers, i0.KeyValueDiffers, i0.ElementRef, i0.Renderer2], { klass: [0, "klass"], ngClass: [1, "ngClass"] }, null), i0.ɵpod(2, { "bx--header__action--active": 0 }), i0.ɵncd(null, 0), (_l()(), i0.ɵeld(4, 0, null, null, 1, ":svg:svg", [["class", "bx--navigation-menu-panel-collapse-icon"], ["ibmIconClose20", ""]], null, null, null, null, null)), i0.ɵdid(5, 4210688, null, 0, i2.Close20Directive, [i0.ElementRef], null, null)], function (_ck, _v) { var _co = _v.component; var currVal_2 = "bx--header__action"; var currVal_3 = _ck(_v, 2, 0, _co.active); _ck(_v, 1, 0, currVal_2, currVal_3); }, function (_ck, _v) { var _co = _v.component; var currVal_0 = _co.title; var currVal_1 = _co.title; _ck(_v, 0, 0, currVal_0, currVal_1); }); }
 export function View_HeaderAction_Host_0(_l) { return i0.ɵvid(0, [(_l()(), i0.ɵeld(0, 0, null, null, 1, "ibm-header-action", [], null, null, null, View_HeaderAction_0, RenderType_HeaderAction)), i0.ɵdid(1, 49152, null, 0, i3.HeaderAction, [], null, null)], null, null); }
-var HeaderActionNgFactory = i0.ɵccf("ibm-header-action", i3.HeaderAction, View_HeaderAction_Host_0, { title: "title", active: "active" }, { selected: "selected" }, ["*"]);
+var HeaderActionNgFactory = i0.ɵccf("ibm-header-action", i3.HeaderAction, View_HeaderAction_Host_0, { title: "title", active: "active", activeChange: "activeChange" }, { selected: "selected" }, ["*"]);
 export { HeaderActionNgFactory as HeaderActionNgFactory };
 //# sourceMappingURL=header-action.component.ngfactory.js.map

package/ui-shell/header/header-action.component.ngsummary.json

@@ -1 +1 @@
-{"moduleName":null,"summaries":[{"symbol":{"__symbol":0,"members":[]},"metadata":{"__symbolic":"class","members":{"title":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]}}]}],"active":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]}}]}],"selected":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":2,"members":[]}}]}],"onClick":[{"__symbolic":"method"}]}},"type":{"summaryKind":1,"type":{"reference":{"__symbol":0,"members":[]},"diDeps":[],"lifecycleHooks":[]},"isComponent":true,"selector":"ibm-header-action","exportAs":null,"inputs":{"title":"title","active":"active"},"outputs":{"selected":"selected"},"hostListeners":{},"hostProperties":{},"hostAttributes":{},"providers":[],"viewProviders":[],"queries":[],"guards":{},"viewQueries":[],"entryComponents":[],"changeDetection":1,"template":{"ngContentSelectors":["*"],"encapsulation":2},"componentViewType":{"__symbol":3,"members":[]},"rendererType":{"__symbol":4,"members":[]},"componentFactory":{"__symbol":5,"members":[]}}}],"symbols":[{"__symbol":0,"name":"HeaderAction","filePath":"./header-action.component"},{"__symbol":1,"name":"Input","filePath":"@angular/core"},{"__symbol":2,"name":"Output","filePath":"@angular/core"},{"__symbol":3,"name":"View_HeaderAction_0","filePath":"./header-action.component.ngfactory"},{"__symbol":4,"name":"RenderType_HeaderAction","filePath":"./header-action.component.ngfactory"},{"__symbol":5,"name":"HeaderActionNgFactory","filePath":"./header-action.component.ngfactory"}]}
+{"moduleName":null,"summaries":[{"symbol":{"__symbol":0,"members":[]},"metadata":{"__symbolic":"class","members":{"title":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]}}]}],"active":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]}}]}],"activeChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]}}]}],"selected":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":2,"members":[]}}]}],"onClick":[{"__symbolic":"method"}]}},"type":{"summaryKind":1,"type":{"reference":{"__symbol":0,"members":[]},"diDeps":[],"lifecycleHooks":[]},"isComponent":true,"selector":"ibm-header-action","exportAs":null,"inputs":{"title":"title","active":"active","activeChange":"activeChange"},"outputs":{"selected":"selected"},"hostListeners":{},"hostProperties":{},"hostAttributes":{},"providers":[],"viewProviders":[],"queries":[],"guards":{},"viewQueries":[],"entryComponents":[],"changeDetection":1,"template":{"ngContentSelectors":["*"],"encapsulation":2},"componentViewType":{"__symbol":3,"members":[]},"rendererType":{"__symbol":4,"members":[]},"componentFactory":{"__symbol":5,"members":[]}}}],"symbols":[{"__symbol":0,"name":"HeaderAction","filePath":"./header-action.component"},{"__symbol":1,"name":"Input","filePath":"@angular/core"},{"__symbol":2,"name":"Output","filePath":"@angular/core"},{"__symbol":3,"name":"View_HeaderAction_0","filePath":"./header-action.component.ngfactory"},{"__symbol":4,"name":"RenderType_HeaderAction","filePath":"./header-action.component.ngfactory"},{"__symbol":5,"name":"HeaderActionNgFactory","filePath":"./header-action.component.ngfactory"}]}

package/ui-shell/header/header-global.component.d.ts

@@ -18,6 +18,9 @@
  */
 
 
+/**
+ * Container for `HeaderAction`s.
+ */
 export declare class HeaderGlobal {
     hostClass: boolean;
 }

package/ui-shell/header/header-global.component.js

@@ -19,6 +19,9 @@
 
 
 import { Component, HostBinding } from "@angular/core";
+/**
+ * Container for `HeaderAction`s.
+ */
 var HeaderGlobal = /** @class */ (function () {
     function HeaderGlobal() {
         this.hostClass = true;

package/ui-shell/header/header-global.component.js.map

@@ -1 +1 @@
-{"version":3,"file":"header-global.component.js","sourceRoot":"","sources":["../../src/ui-shell/header/header-global.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAEvD;IAAA;QAO0C,cAAS,GAAG,IAAI,CAAC;IAC3D,CAAC;;gBARA,SAAS,SAAC;oBACV,QAAQ,EAAE,mBAAmB;oBAC7B,QAAQ,EAAE,qCAET;iBACD;;;4BAEC,WAAW,SAAC,0BAA0B;;IACxC,mBAAC;CAAA,AARD,IAQC;SAFY,YAAY","sourcesContent":["import { Component, HostBinding } from \"@angular/core\";\n\n@Component({\n\tselector: \"ibm-header-global\",\n\ttemplate: `\n\t\t<ng-content></ng-content>\n\t`\n})\nexport class HeaderGlobal {\n\t@HostBinding(\"class.bx--header__global\") hostClass = true;\n}\n"]}
+{"version":3,"file":"header-global.component.js","sourceRoot":"","sources":["../../src/ui-shell/header/header-global.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAEvD;;GAEG;AACH;IAAA;QAO0C,cAAS,GAAG,IAAI,CAAC;IAC3D,CAAC;;gBARA,SAAS,SAAC;oBACV,QAAQ,EAAE,mBAAmB;oBAC7B,QAAQ,EAAE,qCAET;iBACD;;;4BAEC,WAAW,SAAC,0BAA0B;;IACxC,mBAAC;CAAA,AARD,IAQC;SAFY,YAAY","sourcesContent":["import { Component, HostBinding } from \"@angular/core\";\n\n/**\n * Container for `HeaderAction`s.\n */\n@Component({\n\tselector: \"ibm-header-global\",\n\ttemplate: `\n\t\t<ng-content></ng-content>\n\t`\n})\nexport class HeaderGlobal {\n\t@HostBinding(\"class.bx--header__global\") hostClass = true;\n}\n"]}

package/ui-shell/header/header-global.component.metadata.json

@@ -1 +1 @@
-[{"__symbolic":"module","version":4,"metadata":{"HeaderGlobal":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":2,"character":1},"arguments":[{"selector":"ibm-header-global","template":"\n\t\t<ng-content></ng-content>\n\t"}]}],"members":{"hostClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":9,"character":2},"arguments":["class.bx--header__global"]}]}]}}}}]
+[{"__symbolic":"module","version":4,"metadata":{"HeaderGlobal":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":5,"character":1},"arguments":[{"selector":"ibm-header-global","template":"\n\t\t<ng-content></ng-content>\n\t"}]}],"members":{"hostClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":12,"character":2},"arguments":["class.bx--header__global"]}]}]}}}}]

package/ui-shell/header/header-item.component.d.ts

@@ -18,6 +18,13 @@
  */
 
 
+import { DomSanitizer } from "@angular/platform-browser";
+/**
+ * Individual item in the header. May be used a direct child of `HeaderNavigation` or `HeaderMenu`
+ */
 export declare class HeaderItem {
+    protected domSanitizer: DomSanitizer;
     href: string;
+    protected _href: string;
+    constructor(domSanitizer: DomSanitizer);
 }

package/ui-shell/header/header-item.component.js

@@ -19,16 +19,35 @@
 
 
 import { Component, Input } from "@angular/core";
+import { DomSanitizer } from "@angular/platform-browser";
+/**
+ * Individual item in the header. May be used a direct child of `HeaderNavigation` or `HeaderMenu`
+ */
 var HeaderItem = /** @class */ (function () {
-    function HeaderItem() {
-        this.href = "javascript:void(0)";
+    function HeaderItem(domSanitizer) {
+        this.domSanitizer = domSanitizer;
+        this._href = "javascript:void(0)";
     }
+    Object.defineProperty(HeaderItem.prototype, "href", {
+        get: function () {
+            return this.domSanitizer.bypassSecurityTrustUrl(this._href);
+        },
+        set: function (v) {
+            this._href = v;
+        },
+        enumerable: true,
+        configurable: true
+    });
     HeaderItem.decorators = [
         { type: Component, args: [{
                     selector: "ibm-header-item",
                     template: "\n\t\t<li style=\"height: 100%\">\n\t\t\t<a class=\"bx--header__menu-item\" [href]=\"href\" role=\"menuitem\" tabindex=\"0\">\n\t\t\t\t<ng-content></ng-content>\n\t\t\t</a>\n\t\t</li>\n\t"
                 },] },
     ];
+    /** @nocollapse */
+    HeaderItem.ctorParameters = function () { return [
+        { type: DomSanitizer }
+    ]; };
     HeaderItem.propDecorators = {
         href: [{ type: Input }]
     };

package/ui-shell/header/header-item.component.js.map

@@ -1 +1 @@
-{"version":3,"file":"header-item.component.js","sourceRoot":"","sources":["../../src/ui-shell/header/header-item.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAEjD;IAAA;QAWU,SAAI,GAAG,oBAAoB,CAAC;IACtC,CAAC;;gBAZA,SAAS,SAAC;oBACV,QAAQ,EAAE,iBAAiB;oBAC3B,QAAQ,EAAE,6LAMT;iBACD;;;uBAEC,KAAK;;IACP,iBAAC;CAAA,AAZD,IAYC;SAFY,UAAU","sourcesContent":["import { Component, Input } from \"@angular/core\";\n\n@Component({\n\tselector: \"ibm-header-item\",\n\ttemplate: `\n\t\t<li style=\"height: 100%\">\n\t\t\t<a class=\"bx--header__menu-item\" [href]=\"href\" role=\"menuitem\" tabindex=\"0\">\n\t\t\t\t<ng-content></ng-content>\n\t\t\t</a>\n\t\t</li>\n\t`\n})\nexport class HeaderItem {\n\t@Input() href = \"javascript:void(0)\";\n}\n"]}
+{"version":3,"file":"header-item.component.js","sourceRoot":"","sources":["../../src/ui-shell/header/header-item.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AACjD,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AAEzD;;GAEG;AACH;IAqBC,oBAAsB,YAA0B;QAA1B,iBAAY,GAAZ,YAAY,CAAc;QAFtC,UAAK,GAAG,oBAAoB,CAAC;IAEa,CAAC;IAVrD,sBAAa,4BAAI;aAIjB;YACC,OAAO,IAAI,CAAC,YAAY,CAAC,sBAAsB,CAAC,IAAI,CAAC,KAAK,CAAW,CAAC;QACvE,CAAC;aAND,UAAkB,CAAS;YAC1B,IAAI,CAAC,KAAK,GAAG,CAAC,CAAC;QAChB,CAAC;;;OAAA;;gBAbD,SAAS,SAAC;oBACV,QAAQ,EAAE,iBAAiB;oBAC3B,QAAQ,EAAE,6LAMT;iBACD;;;;gBAdQ,YAAY;;;uBAgBnB,KAAK;;IAWP,iBAAC;CAAA,AAtBD,IAsBC;SAZY,UAAU","sourcesContent":["import { Component, Input } from \"@angular/core\";\nimport { DomSanitizer } from \"@angular/platform-browser\";\n\n/**\n * Individual item in the header. May be used a direct child of `HeaderNavigation` or `HeaderMenu`\n */\n@Component({\n\tselector: \"ibm-header-item\",\n\ttemplate: `\n\t\t<li style=\"height: 100%\">\n\t\t\t<a class=\"bx--header__menu-item\" [href]=\"href\" role=\"menuitem\" tabindex=\"0\">\n\t\t\t\t<ng-content></ng-content>\n\t\t\t</a>\n\t\t</li>\n\t`\n})\nexport class HeaderItem {\n\t@Input() set href(v: string) {\n\t\tthis._href = v;\n\t}\n\n\tget href() {\n\t\treturn this.domSanitizer.bypassSecurityTrustUrl(this._href) as string;\n\t}\n\n\tprotected _href = \"javascript:void(0)\";\n\n\tconstructor(protected domSanitizer: DomSanitizer) { }\n}\n"]}