carbon-components-angular 5.10.1 → 5.10.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (67) hide show
  1. package/docs/documentation/components/Tab.html +62 -26
  2. package/docs/documentation/components/TabHeaders.html +3 -3
  3. package/docs/documentation/coverage.html +3 -15
  4. package/docs/documentation/js/search/search_index.js +2 -2
  5. package/docs/documentation/miscellaneous/variables.html +0 -32
  6. package/docs/documentation/modules/CodeSnippetModule/dependencies.svg +4 -4
  7. package/docs/documentation/modules/CodeSnippetModule.html +4 -4
  8. package/docs/documentation/modules/DatePickerInputModule/dependencies.svg +38 -42
  9. package/docs/documentation/modules/DatePickerInputModule.html +38 -42
  10. package/docs/documentation/modules/FileUploaderModule/dependencies.svg +4 -4
  11. package/docs/documentation/modules/FileUploaderModule.html +4 -4
  12. package/docs/documentation/modules/NumberModule/dependencies.svg +4 -4
  13. package/docs/documentation/modules/NumberModule.html +4 -4
  14. package/docs/documentation/modules/PanelModule/dependencies.svg +36 -36
  15. package/docs/documentation/modules/PanelModule.html +36 -36
  16. package/docs/documentation/modules/RadioModule/dependencies.svg +49 -49
  17. package/docs/documentation/modules/RadioModule.html +49 -49
  18. package/docs/documentation/modules/SelectModule/dependencies.svg +43 -43
  19. package/docs/documentation/modules/SelectModule.html +43 -43
  20. package/docs/documentation/modules/SliderModule/dependencies.svg +4 -4
  21. package/docs/documentation/modules/SliderModule.html +4 -4
  22. package/docs/documentation/modules/TableModule/dependencies.svg +216 -216
  23. package/docs/documentation/modules/TableModule.html +216 -216
  24. package/docs/documentation/modules/TabsModule/dependencies.svg +4 -4
  25. package/docs/documentation/modules/TabsModule.html +4 -4
  26. package/docs/documentation/modules/TagModule/dependencies.svg +28 -28
  27. package/docs/documentation/modules/TagModule.html +28 -28
  28. package/docs/documentation/modules/ThemeModule/dependencies.svg +13 -13
  29. package/docs/documentation/modules/ThemeModule.html +13 -13
  30. package/docs/documentation/modules/TilesModule/dependencies.svg +98 -98
  31. package/docs/documentation/modules/TilesModule.html +98 -98
  32. package/docs/documentation/modules/TimePickerModule/dependencies.svg +40 -36
  33. package/docs/documentation/modules/TimePickerModule.html +40 -36
  34. package/docs/documentation/modules/TimePickerSelectModule/dependencies.svg +30 -30
  35. package/docs/documentation/modules/TimePickerSelectModule.html +30 -30
  36. package/docs/documentation/modules/ToggleModule/dependencies.svg +4 -4
  37. package/docs/documentation/modules/ToggleModule.html +4 -4
  38. package/docs/documentation/modules/ToggletipModule/dependencies.svg +4 -4
  39. package/docs/documentation/modules/ToggletipModule.html +4 -4
  40. package/docs/documentation/modules/TooltipModule/dependencies.svg +4 -4
  41. package/docs/documentation/modules/TooltipModule.html +4 -4
  42. package/docs/documentation/modules/UIShellModule/dependencies.svg +4 -4
  43. package/docs/documentation/modules/UIShellModule.html +4 -4
  44. package/docs/documentation.json +22 -54
  45. package/docs/storybook/9115.e3ed2f59.iframe.bundle.js +1 -0
  46. package/docs/storybook/iframe.html +2 -2
  47. package/docs/storybook/{main.e1ee5785.iframe.bundle.js → main.fef29d4d.iframe.bundle.js} +1 -1
  48. package/docs/storybook/project.json +1 -1
  49. package/docs/storybook/{runtime~main.ceeada28.iframe.bundle.js → runtime~main.fc6e3901.iframe.bundle.js} +1 -1
  50. package/docs/storybook/tabs-tabs-stories.3cea9985.iframe.bundle.js +1 -0
  51. package/esm2020/i18n/en.mjs +8 -69
  52. package/esm2020/tabs/tab-headers.component.mjs +3 -3
  53. package/esm2020/tabs/tab.component.mjs +3 -4
  54. package/fesm2015/carbon-components-angular-i18n.mjs +7 -68
  55. package/fesm2015/carbon-components-angular-i18n.mjs.map +1 -1
  56. package/fesm2015/carbon-components-angular-tabs.mjs +4 -5
  57. package/fesm2015/carbon-components-angular-tabs.mjs.map +1 -1
  58. package/fesm2020/carbon-components-angular-i18n.mjs +7 -68
  59. package/fesm2020/carbon-components-angular-i18n.mjs.map +1 -1
  60. package/fesm2020/carbon-components-angular-tabs.mjs +4 -5
  61. package/fesm2020/carbon-components-angular-tabs.mjs.map +1 -1
  62. package/i18n/en.d.ts +0 -47
  63. package/i18n/i18n.service.d.ts +1 -54
  64. package/package.json +1 -1
  65. package/tabs/tab.component.d.ts +1 -0
  66. package/docs/storybook/9115.e6e0100b.iframe.bundle.js +0 -1
  67. package/docs/storybook/tabs-tabs-stories.675b2d72.iframe.bundle.js +0 -1
@@ -48939,7 +48939,7 @@
48939
48939
  },
48940
48940
  {
48941
48941
  "name": "Tab",
48942
- "id": "component-Tab-15855643a629abfbacab0435a5c47295b3ccbffc70e3296e56eeac274c11ddebc41dff20f279399508eaeec3695081375d91b985162cabd5a75556eb0e3aa7ee",
48942
+ "id": "component-Tab-d9c16ea6b09d5d4ed79137ec965849c2a771ec977c65b7431c8aaac9fef90cc488cb01c19683b36b404d6478171306c04b1b67d229d17c878a1189d96a22d895",
48943
48943
  "file": "src/tabs/tab.component.ts",
48944
48944
  "encapsulation": [],
48945
48945
  "entryComponents": [],
@@ -48961,7 +48961,7 @@
48961
48961
  "deprecationMessage": "",
48962
48962
  "rawdescription": "\n\nIndicates whether the `Tab` is active/selected.\nDetermines whether it's `TabPanel` is rendered.\n",
48963
48963
  "description": "<p>Indicates whether the <code>Tab</code> is active/selected.\nDetermines whether it&#39;s <code>TabPanel</code> is rendered.</p>\n",
48964
- "line": 98,
48964
+ "line": 97,
48965
48965
  "type": "boolean",
48966
48966
  "decorators": []
48967
48967
  },
@@ -48971,7 +48971,7 @@
48971
48971
  "deprecationMessage": "",
48972
48972
  "rawdescription": "\n\nSet to true to have Tab items cached and not reloaded on tab switching.\n",
48973
48973
  "description": "<p>Set to true to have Tab items cached and not reloaded on tab switching.</p>\n",
48974
- "line": 113,
48974
+ "line": 111,
48975
48975
  "type": "boolean",
48976
48976
  "decorators": []
48977
48977
  },
@@ -48981,7 +48981,7 @@
48981
48981
  "deprecationMessage": "",
48982
48982
  "rawdescription": "\n\nAllows the user to pass data to the custom template for the `Tab` heading.\n",
48983
48983
  "description": "<p>Allows the user to pass data to the custom template for the <code>Tab</code> heading.</p>\n",
48984
- "line": 93,
48984
+ "line": 92,
48985
48985
  "type": "any",
48986
48986
  "decorators": []
48987
48987
  },
@@ -48992,7 +48992,7 @@
48992
48992
  "deprecationMessage": "",
48993
48993
  "rawdescription": "\n\nIndicates whether or not the `Tab` item is disabled.\n",
48994
48994
  "description": "<p>Indicates whether or not the <code>Tab</code> item is disabled.</p>\n",
48995
- "line": 102,
48995
+ "line": 101,
48996
48996
  "type": "boolean",
48997
48997
  "decorators": []
48998
48998
  },
@@ -49002,18 +49002,18 @@
49002
49002
  "deprecationMessage": "",
49003
49003
  "rawdescription": "\n\nThe `Tab`'s title to be displayed or custom temaplate for the `Tab` heading.\n",
49004
49004
  "description": "<p>The <code>Tab</code>&#39;s title to be displayed or custom temaplate for the <code>Tab</code> heading.</p>\n",
49005
- "line": 82,
49005
+ "line": 81,
49006
49006
  "type": "string | TemplateRef<any>",
49007
49007
  "decorators": []
49008
49008
  },
49009
49009
  {
49010
49010
  "name": "id",
49011
- "defaultValue": "`n-tab-${nextId++}`",
49011
+ "defaultValue": "`n-tab-${Tab.counter++}`",
49012
49012
  "deprecated": false,
49013
49013
  "deprecationMessage": "",
49014
49014
  "rawdescription": "\n\nSets the id of the `Tab`. Will be uniquely generated if not provided.\n",
49015
49015
  "description": "<p>Sets the id of the <code>Tab</code>. Will be uniquely generated if not provided.</p>\n",
49016
- "line": 109,
49016
+ "line": 107,
49017
49017
  "type": "string",
49018
49018
  "decorators": []
49019
49019
  },
@@ -49022,7 +49022,7 @@
49022
49022
  "defaultValue": "0",
49023
49023
  "deprecated": false,
49024
49024
  "deprecationMessage": "",
49025
- "line": 104,
49025
+ "line": 103,
49026
49026
  "type": "number",
49027
49027
  "decorators": []
49028
49028
  },
@@ -49032,7 +49032,7 @@
49032
49032
  "deprecationMessage": "",
49033
49033
  "rawdescription": "\n\nOptional override for the `tabItem's`'s title attribute which is set in `TabHeaders`.\n`tabItem`'s title attribute is automatically set to `heading`.\n\nYou might want to use this if you set `heading` to a `TemplateRef`.\n",
49034
49034
  "description": "<p>Optional override for the <code>tabItem&#39;s</code>&#39;s title attribute which is set in <code>TabHeaders</code>.\n<code>tabItem</code>&#39;s title attribute is automatically set to <code>heading</code>.</p>\n<p>You might want to use this if you set <code>heading</code> to a <code>TemplateRef</code>.</p>\n",
49035
- "line": 89,
49035
+ "line": 88,
49036
49036
  "type": "string",
49037
49037
  "decorators": []
49038
49038
  }
@@ -49045,7 +49045,7 @@
49045
49045
  "deprecationMessage": "",
49046
49046
  "rawdescription": "\n\nValue 'selected' to be emitted after a new `Tab` is selected.\n",
49047
49047
  "description": "<p>Value &#39;selected&#39; to be emitted after a new <code>Tab</code> is selected.</p>\n",
49048
- "line": 119,
49048
+ "line": 117,
49049
49049
  "type": "EventEmitter<void>"
49050
49050
  }
49051
49051
  ],
@@ -49058,7 +49058,7 @@
49058
49058
  "type": "",
49059
49059
  "optional": false,
49060
49060
  "description": "<p>Used to set the id property on the element.</p>\n",
49061
- "line": 124,
49061
+ "line": 122,
49062
49062
  "rawdescription": "\n\nUsed to set the id property on the element.\n",
49063
49063
  "decorators": [
49064
49064
  {
@@ -49078,7 +49078,7 @@
49078
49078
  "type": "",
49079
49079
  "optional": false,
49080
49080
  "description": "<p>Boolean value reflects if the <code>Tab</code> is using a custom template for the heading.\nDefault value is false.</p>\n",
49081
- "line": 77,
49081
+ "line": 76,
49082
49082
  "rawdescription": "\n\nBoolean value reflects if the `Tab` is using a custom template for the heading.\nDefault value is false.\n",
49083
49083
  "modifierKind": [
49084
49084
  123
@@ -49092,7 +49092,7 @@
49092
49092
  "optional": false,
49093
49093
  "returnType": "void",
49094
49094
  "typeParameters": [],
49095
- "line": 145,
49095
+ "line": 143,
49096
49096
  "deprecated": false,
49097
49097
  "deprecationMessage": "",
49098
49098
  "rawdescription": "\n\nEmit the status of the `Tab`, specifically 'select' and 'selected' properties.\n",
@@ -49104,7 +49104,7 @@
49104
49104
  "optional": false,
49105
49105
  "returnType": "boolean",
49106
49106
  "typeParameters": [],
49107
- "line": 152,
49107
+ "line": 150,
49108
49108
  "deprecated": false,
49109
49109
  "deprecationMessage": "",
49110
49110
  "rawdescription": "\n\nReturns value indicating whether this `Tab` should be rendered in a `TabPanel`.\n",
@@ -49121,7 +49121,7 @@
49121
49121
  "deprecationMessage": "",
49122
49122
  "rawdescription": "\n\nUsed to set the id property on the element.\n",
49123
49123
  "description": "<p>Used to set the id property on the element.</p>\n",
49124
- "line": 124,
49124
+ "line": 122,
49125
49125
  "type": "string",
49126
49126
  "decorators": []
49127
49127
  }
@@ -49132,7 +49132,7 @@
49132
49132
  "description": "<p>The <code>Tab</code> component is a child of the <code>Tabs</code> component.\nIt represents one <code>Tab</code> item and its content within a panel of other <code>Tab</code> items.</p>\n<p><code>Tab</code> takes a string or <code>TemplateRef</code> for the header, and any content for the body of the tab.\nDisabled states should be handled by the application (ie. switch to the tab, but display some\nindication as to <em>why</em> the tab is disabled).</p>\n<p>When the tab is selected the <code>select</code> output will be triggered.\nThe <code>select</code> output will also be triggered for the active tab when the tabs are loaded or updated.</p>\n<p>Tab with string header:</p>\n<div><pre class=\"line-numbers\"><code class=\"language-html\">&lt;cds-tab heading=&#39;tab1&#39;&gt;\n tab 1 content\n&lt;/cds-tab&gt;</code></pre></div><p>Tab with custom header:</p>\n<div><pre class=\"line-numbers\"><code class=\"language-html\">&lt;ng-template #tabHeading&gt;\n &lt;svg cdsIcon=&quot;facebook&quot;\n size=&quot;sm&quot;\n style=&quot;margin-right: 7px;&quot;&gt;\n &lt;/svg&gt;\n Hello Tab 1\n&lt;/ng-template&gt;\n&lt;cds-tabs&gt;\n &lt;cds-tab [heading]=&quot;tabHeading&quot;&gt;\n Tab 1 content &lt;svg cdsIcon=&quot;alert&quot; size=&quot;lg&quot;&gt;&lt;/svg&gt;\n &lt;/cds-tab&gt;\n &lt;cds-tab heading=&#39;Tab2&#39;&gt;\n Tab 2 content\n &lt;/cds-tab&gt;\n &lt;cds-tab heading=&#39;Tab3&#39;&gt;\n Tab 3 content\n &lt;/cds-tab&gt;\n&lt;/cds-tabs&gt;</code></pre></div>",
49133
49133
  "rawdescription": "\n\nThe `Tab` component is a child of the `Tabs` component.\nIt represents one `Tab` item and its content within a panel of other `Tab` items.\n\n\n`Tab` takes a string or `TemplateRef` for the header, and any content for the body of the tab.\nDisabled states should be handled by the application (ie. switch to the tab, but display some\nindication as to _why_ the tab is disabled).\n\nWhen the tab is selected the `select` output will be triggered.\nThe `select` output will also be triggered for the active tab when the tabs are loaded or updated.\n\n\nTab with string header:\n\n```html\n<cds-tab heading='tab1'>\n\ttab 1 content\n</cds-tab>\n```\n\nTab with custom header:\n\n```html\n<ng-template #tabHeading>\n\t<svg cdsIcon=\"facebook\"\n\t\tsize=\"sm\"\n\t\tstyle=\"margin-right: 7px;\">\n\t</svg>\n\tHello Tab 1\n</ng-template>\n<cds-tabs>\n\t<cds-tab [heading]=\"tabHeading\">\n\t\tTab 1 content <svg cdsIcon=\"alert\" size=\"lg\"></svg>\n\t</cds-tab>\n\t<cds-tab heading='Tab2'>\n\t\tTab 2 content\n\t</cds-tab>\n\t<cds-tab heading='Tab3'>\n\t\tTab 3 content\n\t</cds-tab>\n</cds-tabs>\n```\n",
49134
49134
  "type": "component",
49135
- "sourceCode": "import {\n\tComponent,\n\tOnInit,\n\tInput,\n\tOutput,\n\tEventEmitter,\n\tTemplateRef,\n\tHostBinding\n} from \"@angular/core\";\n\nlet nextId = 0;\n\n/**\n* The `Tab` component is a child of the `Tabs` component.\n* It represents one `Tab` item and its content within a panel of other `Tab` items.\n*\n*\n* `Tab` takes a string or `TemplateRef` for the header, and any content for the body of the tab.\n* Disabled states should be handled by the application (ie. switch to the tab, but display some\n* indication as to _why_ the tab is disabled).\n*\n* When the tab is selected the `select` output will be triggered.\n* The `select` output will also be triggered for the active tab when the tabs are loaded or updated.\n*\n*\n* Tab with string header:\n*\n* ```html\n* <cds-tab heading='tab1'>\n* \ttab 1 content\n* </cds-tab>\n* ```\n*\n* Tab with custom header:\n*\n* ```html\n* <ng-template #tabHeading>\n* \t<svg cdsIcon=\"facebook\"\n* \t\tsize=\"sm\"\n* \t\tstyle=\"margin-right: 7px;\">\n* \t</svg>\n* \tHello Tab 1\n* </ng-template>\n* <cds-tabs>\n* \t<cds-tab [heading]=\"tabHeading\">\n* \t\tTab 1 content <svg cdsIcon=\"alert\" size=\"lg\"></svg>\n* \t</cds-tab>\n* \t<cds-tab heading='Tab2'>\n* \t\tTab 2 content\n* \t</cds-tab>\n* \t<cds-tab heading='Tab3'>\n* \t\tTab 3 content\n* \t</cds-tab>\n* </cds-tabs>\n* ```\n*/\n@Component({\n\tselector: \"cds-tab, ibm-tab\",\n\ttemplate: `\n\t\t<div\n\t\t\t[attr.tabindex]=\"tabIndex\"\n\t\t\trole=\"tabpanel\"\n\t\t\t*ngIf=\"shouldRender()\"\n\t\t\tclass=\"cds--tab-content\"\n\t\t\t[ngStyle]=\"{'display': active ? null : 'none'}\"\n\t\t\t[attr.aria-labelledby]=\"id + '-header'\"\n\t\t\taria-live=\"polite\">\n\t\t\t<ng-content></ng-content>\n\t\t</div>\n\t`\n})\nexport class Tab implements OnInit {\n\t/**\n\t * Boolean value reflects if the `Tab` is using a custom template for the heading.\n\t * Default value is false.\n\t */\n\tpublic headingIsTemplate = false;\n\n\t/**\n\t * The `Tab`'s title to be displayed or custom temaplate for the `Tab` heading.\n\t */\n\t@Input() heading: string | TemplateRef<any>;\n\t/**\n\t * Optional override for the `tabItem's`'s title attribute which is set in `TabHeaders`.\n\t * `tabItem`'s title attribute is automatically set to `heading`.\n\t *\n\t * You might want to use this if you set `heading` to a `TemplateRef`.\n\t */\n\t@Input() title: string;\n\t/**\n\t * Allows the user to pass data to the custom template for the `Tab` heading.\n\t */\n\t@Input() context: any;\n\t/**\n\t * Indicates whether the `Tab` is active/selected.\n\t * Determines whether it's `TabPanel` is rendered.\n\t */\n\t@Input() active = false;\n\t/**\n\t * Indicates whether or not the `Tab` item is disabled.\n\t */\n\t@Input() disabled = false;\n\n\t@Input() tabIndex = 0;\n\t// do we need id's?\n\t/**\n\t * Sets the id of the `Tab`. Will be uniquely generated if not provided.\n\t */\n\t@Input() id = `n-tab-${nextId++}`;\n\t/**\n\t * Set to true to have Tab items cached and not reloaded on tab switching.\n\t */\n\t@Input() set cacheActive(shouldCache: boolean) {\n\t\tthis._cacheActive = shouldCache;\n\t}\n\t/**\n\t * Value 'selected' to be emitted after a new `Tab` is selected.\n\t */\n\t@Output() selected: EventEmitter<void> = new EventEmitter<void>();\n\n\t/**\n\t * Used to set the id property on the element.\n\t */\n\t@HostBinding(\"attr.id\") attrClass = this.id;\n\n\tget cacheActive() {\n\t\treturn this._cacheActive;\n\t}\n\n\tprotected _cacheActive = false;\n\n\t/**\n\t * Checks for custom heading template on initialization and updates the value\n\t * of the boolean 'headingIsTemplate'.\n\t */\n\tngOnInit() {\n\t\tif (this.heading instanceof TemplateRef) {\n\t\t\tthis.headingIsTemplate = true;\n\t\t}\n\t}\n\n\t/**\n\t * Emit the status of the `Tab`, specifically 'select' and 'selected' properties.\n\t */\n\tdoSelect() {\n\t\tthis.selected.emit();\n\t}\n\n\t/**\n\t* Returns value indicating whether this `Tab` should be rendered in a `TabPanel`.\n\t*/\n\tshouldRender() {\n\t\treturn this.active || this.cacheActive;\n\t}\n}\n",
49135
+ "sourceCode": "import {\n\tComponent,\n\tOnInit,\n\tInput,\n\tOutput,\n\tEventEmitter,\n\tTemplateRef,\n\tHostBinding\n} from \"@angular/core\";\n\n/**\n* The `Tab` component is a child of the `Tabs` component.\n* It represents one `Tab` item and its content within a panel of other `Tab` items.\n*\n*\n* `Tab` takes a string or `TemplateRef` for the header, and any content for the body of the tab.\n* Disabled states should be handled by the application (ie. switch to the tab, but display some\n* indication as to _why_ the tab is disabled).\n*\n* When the tab is selected the `select` output will be triggered.\n* The `select` output will also be triggered for the active tab when the tabs are loaded or updated.\n*\n*\n* Tab with string header:\n*\n* ```html\n* <cds-tab heading='tab1'>\n* \ttab 1 content\n* </cds-tab>\n* ```\n*\n* Tab with custom header:\n*\n* ```html\n* <ng-template #tabHeading>\n* \t<svg cdsIcon=\"facebook\"\n* \t\tsize=\"sm\"\n* \t\tstyle=\"margin-right: 7px;\">\n* \t</svg>\n* \tHello Tab 1\n* </ng-template>\n* <cds-tabs>\n* \t<cds-tab [heading]=\"tabHeading\">\n* \t\tTab 1 content <svg cdsIcon=\"alert\" size=\"lg\"></svg>\n* \t</cds-tab>\n* \t<cds-tab heading='Tab2'>\n* \t\tTab 2 content\n* \t</cds-tab>\n* \t<cds-tab heading='Tab3'>\n* \t\tTab 3 content\n* \t</cds-tab>\n* </cds-tabs>\n* ```\n*/\n@Component({\n\tselector: \"cds-tab, ibm-tab\",\n\ttemplate: `\n\t\t<div\n\t\t\t[attr.tabindex]=\"tabIndex\"\n\t\t\trole=\"tabpanel\"\n\t\t\t*ngIf=\"shouldRender()\"\n\t\t\tclass=\"cds--tab-content\"\n\t\t\t[ngStyle]=\"{'display': active ? null : 'none'}\"\n\t\t\t[attr.aria-labelledby]=\"id + '-header'\"\n\t\t\taria-live=\"polite\">\n\t\t\t<ng-content></ng-content>\n\t\t</div>\n\t`\n})\nexport class Tab implements OnInit {\n\tprivate static counter = 0;\n\t/**\n\t * Boolean value reflects if the `Tab` is using a custom template for the heading.\n\t * Default value is false.\n\t */\n\tpublic headingIsTemplate = false;\n\n\t/**\n\t * The `Tab`'s title to be displayed or custom temaplate for the `Tab` heading.\n\t */\n\t@Input() heading: string | TemplateRef<any>;\n\t/**\n\t * Optional override for the `tabItem's`'s title attribute which is set in `TabHeaders`.\n\t * `tabItem`'s title attribute is automatically set to `heading`.\n\t *\n\t * You might want to use this if you set `heading` to a `TemplateRef`.\n\t */\n\t@Input() title: string;\n\t/**\n\t * Allows the user to pass data to the custom template for the `Tab` heading.\n\t */\n\t@Input() context: any;\n\t/**\n\t * Indicates whether the `Tab` is active/selected.\n\t * Determines whether it's `TabPanel` is rendered.\n\t */\n\t@Input() active = false;\n\t/**\n\t * Indicates whether or not the `Tab` item is disabled.\n\t */\n\t@Input() disabled = false;\n\n\t@Input() tabIndex = 0;\n\t/**\n\t * Sets the id of the `Tab`. Will be uniquely generated if not provided.\n\t */\n\t@Input() id = `n-tab-${Tab.counter++}`;\n\t/**\n\t * Set to true to have Tab items cached and not reloaded on tab switching.\n\t */\n\t@Input() set cacheActive(shouldCache: boolean) {\n\t\tthis._cacheActive = shouldCache;\n\t}\n\t/**\n\t * Value 'selected' to be emitted after a new `Tab` is selected.\n\t */\n\t@Output() selected: EventEmitter<void> = new EventEmitter<void>();\n\n\t/**\n\t * Used to set the id property on the element.\n\t */\n\t@HostBinding(\"attr.id\") attrClass = this.id;\n\n\tget cacheActive() {\n\t\treturn this._cacheActive;\n\t}\n\n\tprotected _cacheActive = false;\n\n\t/**\n\t * Checks for custom heading template on initialization and updates the value\n\t * of the boolean 'headingIsTemplate'.\n\t */\n\tngOnInit() {\n\t\tif (this.heading instanceof TemplateRef) {\n\t\t\tthis.headingIsTemplate = true;\n\t\t}\n\t}\n\n\t/**\n\t * Emit the status of the `Tab`, specifically 'select' and 'selected' properties.\n\t */\n\tdoSelect() {\n\t\tthis.selected.emit();\n\t}\n\n\t/**\n\t* Returns value indicating whether this `Tab` should be rendered in a `TabPanel`.\n\t*/\n\tshouldRender() {\n\t\treturn this.active || this.cacheActive;\n\t}\n}\n",
49136
49136
  "assetsDirs": [],
49137
49137
  "styleUrlsData": "",
49138
49138
  "stylesData": "",
@@ -49156,7 +49156,7 @@
49156
49156
  }
49157
49157
  ],
49158
49158
  "returnType": "void",
49159
- "line": 113,
49159
+ "line": 111,
49160
49160
  "rawdescription": "\n\nSet to true to have Tab items cached and not reloaded on tab switching.\n",
49161
49161
  "description": "<p>Set to true to have Tab items cached and not reloaded on tab switching.</p>\n",
49162
49162
  "jsdoctags": [
@@ -49175,7 +49175,7 @@
49175
49175
  "name": "cacheActive",
49176
49176
  "type": "",
49177
49177
  "returnType": "",
49178
- "line": 126
49178
+ "line": 124
49179
49179
  }
49180
49180
  }
49181
49181
  }
@@ -49750,7 +49750,7 @@
49750
49750
  },
49751
49751
  {
49752
49752
  "name": "TabHeaders",
49753
- "id": "component-TabHeaders-34d8b97ba0faa78107c241daf3905d5dd7587afcbecc98ecb99fe55582315e45991377c6b7648d19a01d9bc377b2e2f330ba5fc87e686ce190b520aa5d8f57a4",
49753
+ "id": "component-TabHeaders-d0a00ee3062556c969878317a06c7bc30d5f08e965f1fb3eb024ef8b0087fcab4797d3052029ad5897214aa84828299c795dacb2dac65a0c621f240ea19ce408",
49754
49754
  "file": "src/tabs/tab-headers.component.ts",
49755
49755
  "encapsulation": [],
49756
49756
  "entryComponents": [],
@@ -49760,7 +49760,7 @@
49760
49760
  "selector": "cds-tab-headers, ibm-tab-headers",
49761
49761
  "styleUrls": [],
49762
49762
  "styles": [],
49763
- "template": "<button\n\ttype=\"button\"\n\t(click)=\"handleOverflowNavClick(-1, tabs.length)\"\n\t(pointerdown)=\"handleOverflowNavMouseDown(-1)\"\n\t(pointerup)=\"handleOverflowNavMouseUp()\"\n\t(pointerleave)=\"handleOverflowNavMouseUp()\"\n\t(pointerout)=\"handleOverflowNavMouseUp()\"\n\tclass=\"cds--tab--overflow-nav-button cds--tab--overflow-nav-button--previous\"\n\t[ngClass]=\"{\n\t\t'cds--tab--overflow-nav-button--hidden': leftOverflowNavButtonHidden\n\t}\"\n\t[title]=\"translations.BUTTON_ARIA_RIGHT\">\n\t<svg\n\t\tfocusable=\"false\"\n\t\tpreserveAspectRatio=\"xMidYMid meet\"\n\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\tfill=\"currentColor\"\n\t\twidth=\"16\"\n\t\theight=\"16\"\n\t\tviewBox=\"0 0 16 16\"\n\t\taria-hidden=\"true\">\n\t\t<path d=\"M5 8L10 3 10.7 3.7 6.4 8 10.7 12.3 10 13z\"></path>\n\t</svg>\n</button>\n<div\n\t#tabList\n\tclass=\"cds--tab--list\"\n\trole=\"tablist\"\n\t[attr.aria-label]=\"ariaLabel || translations.HEADER_ARIA_LABEL\"\n\t(scroll)=\"handleScroll()\">\n\t<ng-container [ngTemplateOutlet]=\"contentBefore\"></ng-container>\n\t<button\n\t\t*ngFor=\"let tab of tabs; let i = index;\"\n\t\t#tabItem\n\t\trole=\"tab\"\n\t\t[attr.aria-selected]=\"tab.active\"\n\t\t[attr.tabindex]=\"(tab.active?0:-1)\"\n\t\t[attr.aria-controls]=\"tab.id\"\n\t\t[attr.aria-disabled]=\"tab.disabled\"\n\t\t[ngClass]=\"{\n\t\t\t'cds--tabs__nav-item--selected': tab.active,\n\t\t\t'cds--tabs__nav-item--disabled': tab.disabled\n\t\t}\"\n\t\tclass=\"cds--tabs__nav-item cds--tabs__nav-link\"\n\t\ttype=\"button\"\n\t\tdraggable=\"false\"\n\t\tid=\"{{tab.id}}-header\"\n\t\t(focus)=\"onTabFocus(tabItem, i)\"\n\t\t(click)=\"selectTab(tabItem, tab, i)\">\n\t\t<ng-container *ngIf=\"!tab.headingIsTemplate\">\n\t\t\t{{ tab.heading }}\n\t\t</ng-container>\n\t\t<ng-template\n\t\t\t*ngIf=\"tab.headingIsTemplate\"\n\t\t\t[ngTemplateOutlet]=\"tab.heading\"\n\t\t\t[ngTemplateOutletContext]=\"{$implicit: tab.context}\">\n\t\t</ng-template>\n\t</button>\n\t<ng-container [ngTemplateOutlet]=\"contentAfter\"></ng-container>\n</div>\n<button\n\ttype=\"button\"\n\t(click)=\"handleOverflowNavClick(1, tabs.length)\"\n\t(pointerdown)=\"handleOverflowNavMouseDown(1)\"\n\t(pointerup)=\"handleOverflowNavMouseUp()\"\n\t(pointerleave)=\"handleOverflowNavMouseUp()\"\n\t(pointerout)=\"handleOverflowNavMouseUp()\"\n\tclass=\"cds--tab--overflow-nav-button cds--tab--overflow-nav-button--next\"\n\t[ngClass]=\"{\n\t\t'cds--tab--overflow-nav-button--hidden': rightOverflowNavButtonHidden\n\t}\"\n\t[title]=\"translations.BUTTON_ARIA_RIGHT\">\n\t<svg\n\t\tfocusable=\"false\"\n\t\tpreserveAspectRatio=\"xMidYMid meet\"\n\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\tfill=\"currentColor\"\n\t\twidth=\"16\"\n\t\theight=\"16\"\n\t\tviewBox=\"0 0 16 16\"\n\t\taria-hidden=\"true\">\n\t\t<path d=\"M11 8L6 13 5.3 12.3 9.6 8 5.3 3.7 6 3z\"></path>\n\t</svg>\n</button>\n\t",
49763
+ "template": "<button\n\ttype=\"button\"\n\t(click)=\"handleOverflowNavClick(-1, tabs.length)\"\n\t(pointerdown)=\"handleOverflowNavMouseDown(-1)\"\n\t(pointerup)=\"handleOverflowNavMouseUp()\"\n\t(pointerleave)=\"handleOverflowNavMouseUp()\"\n\t(pointerout)=\"handleOverflowNavMouseUp()\"\n\tclass=\"cds--tab--overflow-nav-button cds--tab--overflow-nav-button--previous\"\n\t[ngClass]=\"{\n\t\t'cds--tab--overflow-nav-button--hidden': leftOverflowNavButtonHidden\n\t}\"\n\t[title]=\"translations.BUTTON_ARIA_LEFT\">\n\t<svg\n\t\tfocusable=\"false\"\n\t\tpreserveAspectRatio=\"xMidYMid meet\"\n\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\tfill=\"currentColor\"\n\t\twidth=\"16\"\n\t\theight=\"16\"\n\t\tviewBox=\"0 0 16 16\"\n\t\taria-hidden=\"true\">\n\t\t<path d=\"M5 8L10 3 10.7 3.7 6.4 8 10.7 12.3 10 13z\"></path>\n\t</svg>\n</button>\n<div\n\t#tabList\n\tclass=\"cds--tab--list\"\n\trole=\"tablist\"\n\t[attr.aria-label]=\"ariaLabel || translations.HEADER_ARIA_LABEL\"\n\t(scroll)=\"handleScroll()\">\n\t<ng-container [ngTemplateOutlet]=\"contentBefore\"></ng-container>\n\t<button\n\t\t*ngFor=\"let tab of tabs; let i = index;\"\n\t\t#tabItem\n\t\trole=\"tab\"\n\t\t[attr.aria-selected]=\"tab.active\"\n\t\t[attr.tabindex]=\"(tab.active?0:-1)\"\n\t\t[attr.aria-controls]=\"tab.id\"\n\t\t[attr.aria-disabled]=\"tab.disabled\"\n\t\t[ngClass]=\"{\n\t\t\t'cds--tabs__nav-item--selected': tab.active,\n\t\t\t'cds--tabs__nav-item--disabled': tab.disabled\n\t\t}\"\n\t\tclass=\"cds--tabs__nav-item cds--tabs__nav-link\"\n\t\ttype=\"button\"\n\t\tdraggable=\"false\"\n\t\tid=\"{{tab.id}}-header\"\n\t\t(focus)=\"onTabFocus(tabItem, i)\"\n\t\t(click)=\"selectTab(tabItem, tab, i)\">\n\t\t<ng-container *ngIf=\"!tab.headingIsTemplate\">\n\t\t\t{{ tab.heading }}\n\t\t</ng-container>\n\t\t<ng-template\n\t\t\t*ngIf=\"tab.headingIsTemplate\"\n\t\t\t[ngTemplateOutlet]=\"tab.heading\"\n\t\t\t[ngTemplateOutletContext]=\"{$implicit: tab.context}\">\n\t\t</ng-template>\n\t</button>\n\t<ng-container [ngTemplateOutlet]=\"contentAfter\"></ng-container>\n</div>\n<button\n\ttype=\"button\"\n\t(click)=\"handleOverflowNavClick(1, tabs.length)\"\n\t(pointerdown)=\"handleOverflowNavMouseDown(1)\"\n\t(pointerup)=\"handleOverflowNavMouseUp()\"\n\t(pointerleave)=\"handleOverflowNavMouseUp()\"\n\t(pointerout)=\"handleOverflowNavMouseUp()\"\n\tclass=\"cds--tab--overflow-nav-button cds--tab--overflow-nav-button--next\"\n\t[ngClass]=\"{\n\t\t'cds--tab--overflow-nav-button--hidden': rightOverflowNavButtonHidden\n\t}\"\n\t[title]=\"translations.BUTTON_ARIA_RIGHT\">\n\t<svg\n\t\tfocusable=\"false\"\n\t\tpreserveAspectRatio=\"xMidYMid meet\"\n\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\tfill=\"currentColor\"\n\t\twidth=\"16\"\n\t\theight=\"16\"\n\t\tviewBox=\"0 0 16 16\"\n\t\taria-hidden=\"true\">\n\t\t<path d=\"M11 8L6 13 5.3 12.3 9.6 8 5.3 3.7 6 3z\"></path>\n\t</svg>\n</button>\n\t",
49764
49764
  "templateUrl": [],
49765
49765
  "viewProviders": [],
49766
49766
  "hostDirectives": [],
@@ -50378,7 +50378,7 @@
50378
50378
  "description": "<p>The <code>TabHeaders</code> component contains the <code>Tab</code> items and controls scroll functionality\nif content has overflow.</p>\n",
50379
50379
  "rawdescription": "\n\nThe `TabHeaders` component contains the `Tab` items and controls scroll functionality\nif content has overflow.\n",
50380
50380
  "type": "component",
50381
- "sourceCode": "import {\n\tComponent,\n\tQueryList,\n\tInput,\n\tHostListener,\n\tViewChild,\n\tContentChildren,\n\tAfterContentInit,\n\tViewChildren,\n\tElementRef,\n\tOnChanges,\n\tSimpleChanges,\n\tOnDestroy,\n\tOnInit,\n\tChangeDetectorRef,\n\tRenderer2\n} from \"@angular/core\";\nimport { EventService } from \"carbon-components-angular/utils\";\nimport { I18n } from \"carbon-components-angular/i18n\";\n\nimport { BaseTabHeader } from \"./base-tab-header.component\";\nimport { Tab } from \"./tab.component\";\n\n/**\n * The `TabHeaders` component contains the `Tab` items and controls scroll functionality\n * if content has overflow.\n */\n@Component({\n\tselector: \"cds-tab-headers, ibm-tab-headers\",\n\ttemplate: `\n\t\t<button\n\t\t\ttype=\"button\"\n\t\t\t(click)=\"handleOverflowNavClick(-1, tabs.length)\"\n\t\t\t(pointerdown)=\"handleOverflowNavMouseDown(-1)\"\n\t\t\t(pointerup)=\"handleOverflowNavMouseUp()\"\n\t\t\t(pointerleave)=\"handleOverflowNavMouseUp()\"\n\t\t\t(pointerout)=\"handleOverflowNavMouseUp()\"\n\t\t\tclass=\"cds--tab--overflow-nav-button cds--tab--overflow-nav-button--previous\"\n\t\t\t[ngClass]=\"{\n\t\t\t\t'cds--tab--overflow-nav-button--hidden': leftOverflowNavButtonHidden\n\t\t\t}\"\n\t\t\t[title]=\"translations.BUTTON_ARIA_RIGHT\">\n\t\t\t<svg\n\t\t\t\tfocusable=\"false\"\n\t\t\t\tpreserveAspectRatio=\"xMidYMid meet\"\n\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\tfill=\"currentColor\"\n\t\t\t\twidth=\"16\"\n\t\t\t\theight=\"16\"\n\t\t\t\tviewBox=\"0 0 16 16\"\n\t\t\t\taria-hidden=\"true\">\n\t\t\t\t<path d=\"M5 8L10 3 10.7 3.7 6.4 8 10.7 12.3 10 13z\"></path>\n\t\t\t</svg>\n\t\t</button>\n\t\t<div\n\t\t\t#tabList\n\t\t\tclass=\"cds--tab--list\"\n\t\t\trole=\"tablist\"\n\t\t\t[attr.aria-label]=\"ariaLabel || translations.HEADER_ARIA_LABEL\"\n\t\t\t(scroll)=\"handleScroll()\">\n\t\t\t<ng-container [ngTemplateOutlet]=\"contentBefore\"></ng-container>\n\t\t\t<button\n\t\t\t\t*ngFor=\"let tab of tabs; let i = index;\"\n\t\t\t\t#tabItem\n\t\t\t\trole=\"tab\"\n\t\t\t\t[attr.aria-selected]=\"tab.active\"\n\t\t\t\t[attr.tabindex]=\"(tab.active?0:-1)\"\n\t\t\t\t[attr.aria-controls]=\"tab.id\"\n\t\t\t\t[attr.aria-disabled]=\"tab.disabled\"\n\t\t\t\t[ngClass]=\"{\n\t\t\t\t\t'cds--tabs__nav-item--selected': tab.active,\n\t\t\t\t\t'cds--tabs__nav-item--disabled': tab.disabled\n\t\t\t\t}\"\n\t\t\t\tclass=\"cds--tabs__nav-item cds--tabs__nav-link\"\n\t\t\t\ttype=\"button\"\n\t\t\t\tdraggable=\"false\"\n\t\t\t\tid=\"{{tab.id}}-header\"\n\t\t\t\t(focus)=\"onTabFocus(tabItem, i)\"\n\t\t\t\t(click)=\"selectTab(tabItem, tab, i)\">\n\t\t\t\t<ng-container *ngIf=\"!tab.headingIsTemplate\">\n\t\t\t\t\t{{ tab.heading }}\n\t\t\t\t</ng-container>\n\t\t\t\t<ng-template\n\t\t\t\t\t*ngIf=\"tab.headingIsTemplate\"\n\t\t\t\t\t[ngTemplateOutlet]=\"tab.heading\"\n\t\t\t\t\t[ngTemplateOutletContext]=\"{$implicit: tab.context}\">\n\t\t\t\t</ng-template>\n\t\t\t</button>\n\t\t\t<ng-container [ngTemplateOutlet]=\"contentAfter\"></ng-container>\n\t\t</div>\n\t\t<button\n\t\t\ttype=\"button\"\n\t\t\t(click)=\"handleOverflowNavClick(1, tabs.length)\"\n\t\t\t(pointerdown)=\"handleOverflowNavMouseDown(1)\"\n\t\t\t(pointerup)=\"handleOverflowNavMouseUp()\"\n\t\t\t(pointerleave)=\"handleOverflowNavMouseUp()\"\n\t\t\t(pointerout)=\"handleOverflowNavMouseUp()\"\n\t\t\tclass=\"cds--tab--overflow-nav-button cds--tab--overflow-nav-button--next\"\n\t\t\t[ngClass]=\"{\n\t\t\t\t'cds--tab--overflow-nav-button--hidden': rightOverflowNavButtonHidden\n\t\t\t}\"\n\t\t\t[title]=\"translations.BUTTON_ARIA_RIGHT\">\n\t\t\t<svg\n\t\t\t\tfocusable=\"false\"\n\t\t\t\tpreserveAspectRatio=\"xMidYMid meet\"\n\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\tfill=\"currentColor\"\n\t\t\t\twidth=\"16\"\n\t\t\t\theight=\"16\"\n\t\t\t\tviewBox=\"0 0 16 16\"\n\t\t\t\taria-hidden=\"true\">\n\t\t\t\t<path d=\"M11 8L6 13 5.3 12.3 9.6 8 5.3 3.7 6 3z\"></path>\n\t\t\t</svg>\n\t\t</button>\n\t`\n})\n\nexport class TabHeaders extends BaseTabHeader implements AfterContentInit, OnChanges, OnDestroy, OnInit {\n\t/**\n\t * List of `Tab` components.\n\t */\n\t// disable the next line because we need to rename the input\n\t// tslint:disable-next-line\n\t@Input(\"tabs\") tabInput: QueryList<Tab>;\n\n\t@Input() translations = this.i18n.get().TABS;\n\n\t/**\n\t * Gets the Unordered List element that holds the `Tab` headings from the view DOM.\n\t */\n\t@ViewChild(\"tabList\", { static: true }) headerContainer: ElementRef<HTMLElement>;\n\t/**\n\t * ContentChild of all the n-tabs\n\t */\n\t@ContentChildren(Tab) tabQuery: QueryList<Tab>;\n\t/**\n\t * set to tabQuery if tabInput is empty\n\t */\n\ttabs: QueryList<Tab>;\n\t/**\n\t * The index of the first visible tab.\n\t */\n\tfirstVisibleTab = 0;\n\t/**\n\t * The DOM element containing the `Tab` headings displayed.\n\t */\n\t@ViewChildren(\"tabItem\") allTabHeaders: QueryList<ElementRef>;\n\tprivate resizeObserver: ResizeObserver;\n\n\tconstructor(\n\t\tprotected elementRef: ElementRef,\n\t\tprotected changeDetectorRef: ChangeDetectorRef,\n\t\tprotected eventService: EventService,\n\t\tprotected renderer: Renderer2,\n\t\tprotected i18n: I18n\n\t) {\n\t\tsuper(elementRef, changeDetectorRef, eventService, renderer);\n\t}\n\n\t// keyboard accessibility\n\t/**\n\t * Controls the keydown events used for tabbing through the headings.\n\t */\n\t@HostListener(\"keydown\", [\"$event\"])\n\tkeyboardInput(event) {\n\t\tlet tabsArray = this.tabs.toArray();\n\n\t\tif (event.key === \"ArrowRight\") {\n\t\t\tif (this.currentSelectedTab < this.allTabHeaders.length - 1) {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tif (this.followFocus) {\n\t\t\t\t\tthis.selectTab(event.target, tabsArray[this.currentSelectedTab + 1], this.currentSelectedTab);\n\t\t\t\t}\n\t\t\t\tthis.allTabHeaders.toArray()[this.currentSelectedTab + 1].nativeElement.focus();\n\t\t\t} else {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tif (this.followFocus) {\n\t\t\t\t\tthis.selectTab(event.target, tabsArray[0], 0);\n\t\t\t\t}\n\t\t\t\tthis.allTabHeaders.first.nativeElement.focus();\n\t\t\t}\n\t\t}\n\n\t\tif (event.key === \"ArrowLeft\") {\n\t\t\tif (this.currentSelectedTab > 0) {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tif (this.followFocus) {\n\t\t\t\t\tthis.selectTab(event.target, tabsArray[this.currentSelectedTab - 1], this.currentSelectedTab);\n\t\t\t\t}\n\t\t\t\tthis.allTabHeaders.toArray()[this.currentSelectedTab - 1].nativeElement.focus();\n\t\t\t} else {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tif (this.followFocus) {\n\t\t\t\t\tthis.selectTab(event.target, tabsArray[this.allTabHeaders.length - 1], this.allTabHeaders.length);\n\t\t\t\t}\n\t\t\t\tthis.allTabHeaders.toArray()[this.allTabHeaders.length - 1].nativeElement.focus();\n\t\t\t}\n\t\t}\n\n\t\tif (event.key === \"Home\") {\n\t\t\tevent.preventDefault();\n\t\t\tif (this.followFocus) {\n\t\t\t\tthis.selectTab(event.target, tabsArray[0], 0);\n\t\t\t}\n\t\t\tthis.allTabHeaders.toArray()[0].nativeElement.focus();\n\t\t}\n\n\t\tif (event.key === \"End\") {\n\t\t\tevent.preventDefault();\n\t\t\tif (this.followFocus) {\n\t\t\t\tthis.selectTab(event.target, tabsArray[this.allTabHeaders.length - 1], this.allTabHeaders.length);\n\t\t\t}\n\t\t\tthis.allTabHeaders.toArray()[this.allTabHeaders.length - 1].nativeElement.focus();\n\t\t}\n\n\t\tif ((event.key === \" \" || event.key === \"Spacebar\") && !this.followFocus) {\n\t\t\tthis.selectTab(event.target, tabsArray[this.currentSelectedTab], this.currentSelectedTab);\n\t\t}\n\t}\n\n\tngOnInit(): void {\n\t\t// Update scroll on resize\n\t\tthis.resizeObserver = new ResizeObserver(() => {\n\t\t\t// Need to explicitly trigger change detection since this runs outside Angular zone\n\t\t\tthis.changeDetectorRef.detectChanges();\n\t\t});\n\t\tthis.resizeObserver.observe(this.headerContainer.nativeElement);\n\t}\n\n\tngOnDestroy(): void {\n\t\tthis.resizeObserver.unobserve(this.headerContainer.nativeElement);\n\t}\n\n\tngAfterContentInit() {\n\t\tif (!this.tabInput) {\n\t\t\tthis.tabs = this.tabQuery;\n\t\t} else {\n\t\t\tthis.tabs = this.tabInput;\n\t\t}\n\n\t\tthis.tabs.forEach(tab => tab.cacheActive = this.cacheActive);\n\t\tthis.tabs.changes.subscribe(() => {\n\t\t\tthis.setFirstTab();\n\t\t});\n\t\tthis.setFirstTab();\n\t}\n\n\tngOnChanges(changes: SimpleChanges) {\n\t\tif (this.tabs && changes.cacheActive) {\n\t\t\tthis.tabs.forEach(tab => tab.cacheActive = this.cacheActive);\n\t\t}\n\t}\n\n\t/**\n\t * Controls manually focusing tabs.\n\t */\n\tonTabFocus(ref: HTMLElement, index: number) {\n\t\tthis.currentSelectedTab = index;\n\t\t// reset scroll left because we're already handling it\n\t\tthis.headerContainer.nativeElement.parentElement.scrollLeft = 0;\n\t}\n\n\tgetSelectedTab(): any {\n\t\tconst selected = this.tabs.find(tab => tab.active);\n\t\tif (selected) {\n\t\t\treturn selected;\n\t\t}\n\t\treturn { headingIsTemplate: false, heading: \"\" };\n\t}\n\n\t/**\n\t * Selects `Tab` 'tab' and moves it into view on the view DOM if it is not already.\n\t */\n\tselectTab(ref: HTMLElement, tab: Tab, tabIndex: number) {\n\t\tif (tab.disabled) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis.currentSelectedTab = tabIndex;\n\t\tthis.tabs.forEach(_tab => _tab.active = false);\n\t\ttab.active = true;\n\t\ttab.doSelect();\n\t}\n\n\t/**\n\t * Determines which `Tab` is initially selected.\n\t */\n\tprotected setFirstTab() {\n\t\tsetTimeout(() => {\n\t\t\tlet firstTab = this.tabs.find(tab => tab.active);\n\t\t\tif (!firstTab && this.tabs.first) {\n\t\t\t\tfirstTab = this.tabs.first;\n\t\t\t\tfirstTab.active = true;\n\t\t\t}\n\t\t\tif (firstTab) {\n\t\t\t\tfirstTab.doSelect();\n\t\t\t}\n\t\t});\n\t}\n}\n",
50381
+ "sourceCode": "import {\n\tComponent,\n\tQueryList,\n\tInput,\n\tHostListener,\n\tViewChild,\n\tContentChildren,\n\tAfterContentInit,\n\tViewChildren,\n\tElementRef,\n\tOnChanges,\n\tSimpleChanges,\n\tOnDestroy,\n\tOnInit,\n\tChangeDetectorRef,\n\tRenderer2\n} from \"@angular/core\";\nimport { EventService } from \"carbon-components-angular/utils\";\nimport { I18n } from \"carbon-components-angular/i18n\";\n\nimport { BaseTabHeader } from \"./base-tab-header.component\";\nimport { Tab } from \"./tab.component\";\n\n/**\n * The `TabHeaders` component contains the `Tab` items and controls scroll functionality\n * if content has overflow.\n */\n@Component({\n\tselector: \"cds-tab-headers, ibm-tab-headers\",\n\ttemplate: `\n\t\t<button\n\t\t\ttype=\"button\"\n\t\t\t(click)=\"handleOverflowNavClick(-1, tabs.length)\"\n\t\t\t(pointerdown)=\"handleOverflowNavMouseDown(-1)\"\n\t\t\t(pointerup)=\"handleOverflowNavMouseUp()\"\n\t\t\t(pointerleave)=\"handleOverflowNavMouseUp()\"\n\t\t\t(pointerout)=\"handleOverflowNavMouseUp()\"\n\t\t\tclass=\"cds--tab--overflow-nav-button cds--tab--overflow-nav-button--previous\"\n\t\t\t[ngClass]=\"{\n\t\t\t\t'cds--tab--overflow-nav-button--hidden': leftOverflowNavButtonHidden\n\t\t\t}\"\n\t\t\t[title]=\"translations.BUTTON_ARIA_LEFT\">\n\t\t\t<svg\n\t\t\t\tfocusable=\"false\"\n\t\t\t\tpreserveAspectRatio=\"xMidYMid meet\"\n\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\tfill=\"currentColor\"\n\t\t\t\twidth=\"16\"\n\t\t\t\theight=\"16\"\n\t\t\t\tviewBox=\"0 0 16 16\"\n\t\t\t\taria-hidden=\"true\">\n\t\t\t\t<path d=\"M5 8L10 3 10.7 3.7 6.4 8 10.7 12.3 10 13z\"></path>\n\t\t\t</svg>\n\t\t</button>\n\t\t<div\n\t\t\t#tabList\n\t\t\tclass=\"cds--tab--list\"\n\t\t\trole=\"tablist\"\n\t\t\t[attr.aria-label]=\"ariaLabel || translations.HEADER_ARIA_LABEL\"\n\t\t\t(scroll)=\"handleScroll()\">\n\t\t\t<ng-container [ngTemplateOutlet]=\"contentBefore\"></ng-container>\n\t\t\t<button\n\t\t\t\t*ngFor=\"let tab of tabs; let i = index;\"\n\t\t\t\t#tabItem\n\t\t\t\trole=\"tab\"\n\t\t\t\t[attr.aria-selected]=\"tab.active\"\n\t\t\t\t[attr.tabindex]=\"(tab.active?0:-1)\"\n\t\t\t\t[attr.aria-controls]=\"tab.id\"\n\t\t\t\t[attr.aria-disabled]=\"tab.disabled\"\n\t\t\t\t[ngClass]=\"{\n\t\t\t\t\t'cds--tabs__nav-item--selected': tab.active,\n\t\t\t\t\t'cds--tabs__nav-item--disabled': tab.disabled\n\t\t\t\t}\"\n\t\t\t\tclass=\"cds--tabs__nav-item cds--tabs__nav-link\"\n\t\t\t\ttype=\"button\"\n\t\t\t\tdraggable=\"false\"\n\t\t\t\tid=\"{{tab.id}}-header\"\n\t\t\t\t(focus)=\"onTabFocus(tabItem, i)\"\n\t\t\t\t(click)=\"selectTab(tabItem, tab, i)\">\n\t\t\t\t<ng-container *ngIf=\"!tab.headingIsTemplate\">\n\t\t\t\t\t{{ tab.heading }}\n\t\t\t\t</ng-container>\n\t\t\t\t<ng-template\n\t\t\t\t\t*ngIf=\"tab.headingIsTemplate\"\n\t\t\t\t\t[ngTemplateOutlet]=\"tab.heading\"\n\t\t\t\t\t[ngTemplateOutletContext]=\"{$implicit: tab.context}\">\n\t\t\t\t</ng-template>\n\t\t\t</button>\n\t\t\t<ng-container [ngTemplateOutlet]=\"contentAfter\"></ng-container>\n\t\t</div>\n\t\t<button\n\t\t\ttype=\"button\"\n\t\t\t(click)=\"handleOverflowNavClick(1, tabs.length)\"\n\t\t\t(pointerdown)=\"handleOverflowNavMouseDown(1)\"\n\t\t\t(pointerup)=\"handleOverflowNavMouseUp()\"\n\t\t\t(pointerleave)=\"handleOverflowNavMouseUp()\"\n\t\t\t(pointerout)=\"handleOverflowNavMouseUp()\"\n\t\t\tclass=\"cds--tab--overflow-nav-button cds--tab--overflow-nav-button--next\"\n\t\t\t[ngClass]=\"{\n\t\t\t\t'cds--tab--overflow-nav-button--hidden': rightOverflowNavButtonHidden\n\t\t\t}\"\n\t\t\t[title]=\"translations.BUTTON_ARIA_RIGHT\">\n\t\t\t<svg\n\t\t\t\tfocusable=\"false\"\n\t\t\t\tpreserveAspectRatio=\"xMidYMid meet\"\n\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\tfill=\"currentColor\"\n\t\t\t\twidth=\"16\"\n\t\t\t\theight=\"16\"\n\t\t\t\tviewBox=\"0 0 16 16\"\n\t\t\t\taria-hidden=\"true\">\n\t\t\t\t<path d=\"M11 8L6 13 5.3 12.3 9.6 8 5.3 3.7 6 3z\"></path>\n\t\t\t</svg>\n\t\t</button>\n\t`\n})\n\nexport class TabHeaders extends BaseTabHeader implements AfterContentInit, OnChanges, OnDestroy, OnInit {\n\t/**\n\t * List of `Tab` components.\n\t */\n\t// disable the next line because we need to rename the input\n\t// tslint:disable-next-line\n\t@Input(\"tabs\") tabInput: QueryList<Tab>;\n\n\t@Input() translations = this.i18n.get().TABS;\n\n\t/**\n\t * Gets the Unordered List element that holds the `Tab` headings from the view DOM.\n\t */\n\t@ViewChild(\"tabList\", { static: true }) headerContainer: ElementRef<HTMLElement>;\n\t/**\n\t * ContentChild of all the n-tabs\n\t */\n\t@ContentChildren(Tab) tabQuery: QueryList<Tab>;\n\t/**\n\t * set to tabQuery if tabInput is empty\n\t */\n\ttabs: QueryList<Tab>;\n\t/**\n\t * The index of the first visible tab.\n\t */\n\tfirstVisibleTab = 0;\n\t/**\n\t * The DOM element containing the `Tab` headings displayed.\n\t */\n\t@ViewChildren(\"tabItem\") allTabHeaders: QueryList<ElementRef>;\n\tprivate resizeObserver: ResizeObserver;\n\n\tconstructor(\n\t\tprotected elementRef: ElementRef,\n\t\tprotected changeDetectorRef: ChangeDetectorRef,\n\t\tprotected eventService: EventService,\n\t\tprotected renderer: Renderer2,\n\t\tprotected i18n: I18n\n\t) {\n\t\tsuper(elementRef, changeDetectorRef, eventService, renderer);\n\t}\n\n\t// keyboard accessibility\n\t/**\n\t * Controls the keydown events used for tabbing through the headings.\n\t */\n\t@HostListener(\"keydown\", [\"$event\"])\n\tkeyboardInput(event) {\n\t\tlet tabsArray = this.tabs.toArray();\n\n\t\tif (event.key === \"ArrowRight\") {\n\t\t\tif (this.currentSelectedTab < this.allTabHeaders.length - 1) {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tif (this.followFocus) {\n\t\t\t\t\tthis.selectTab(event.target, tabsArray[this.currentSelectedTab + 1], this.currentSelectedTab);\n\t\t\t\t}\n\t\t\t\tthis.allTabHeaders.toArray()[this.currentSelectedTab + 1].nativeElement.focus();\n\t\t\t} else {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tif (this.followFocus) {\n\t\t\t\t\tthis.selectTab(event.target, tabsArray[0], 0);\n\t\t\t\t}\n\t\t\t\tthis.allTabHeaders.first.nativeElement.focus();\n\t\t\t}\n\t\t}\n\n\t\tif (event.key === \"ArrowLeft\") {\n\t\t\tif (this.currentSelectedTab > 0) {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tif (this.followFocus) {\n\t\t\t\t\tthis.selectTab(event.target, tabsArray[this.currentSelectedTab - 1], this.currentSelectedTab);\n\t\t\t\t}\n\t\t\t\tthis.allTabHeaders.toArray()[this.currentSelectedTab - 1].nativeElement.focus();\n\t\t\t} else {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tif (this.followFocus) {\n\t\t\t\t\tthis.selectTab(event.target, tabsArray[this.allTabHeaders.length - 1], this.allTabHeaders.length);\n\t\t\t\t}\n\t\t\t\tthis.allTabHeaders.toArray()[this.allTabHeaders.length - 1].nativeElement.focus();\n\t\t\t}\n\t\t}\n\n\t\tif (event.key === \"Home\") {\n\t\t\tevent.preventDefault();\n\t\t\tif (this.followFocus) {\n\t\t\t\tthis.selectTab(event.target, tabsArray[0], 0);\n\t\t\t}\n\t\t\tthis.allTabHeaders.toArray()[0].nativeElement.focus();\n\t\t}\n\n\t\tif (event.key === \"End\") {\n\t\t\tevent.preventDefault();\n\t\t\tif (this.followFocus) {\n\t\t\t\tthis.selectTab(event.target, tabsArray[this.allTabHeaders.length - 1], this.allTabHeaders.length);\n\t\t\t}\n\t\t\tthis.allTabHeaders.toArray()[this.allTabHeaders.length - 1].nativeElement.focus();\n\t\t}\n\n\t\tif ((event.key === \" \" || event.key === \"Spacebar\") && !this.followFocus) {\n\t\t\tthis.selectTab(event.target, tabsArray[this.currentSelectedTab], this.currentSelectedTab);\n\t\t}\n\t}\n\n\tngOnInit(): void {\n\t\t// Update scroll on resize\n\t\tthis.resizeObserver = new ResizeObserver(() => {\n\t\t\t// Need to explicitly trigger change detection since this runs outside Angular zone\n\t\t\tthis.changeDetectorRef.detectChanges();\n\t\t});\n\t\tthis.resizeObserver.observe(this.headerContainer.nativeElement);\n\t}\n\n\tngOnDestroy(): void {\n\t\tthis.resizeObserver.unobserve(this.headerContainer.nativeElement);\n\t}\n\n\tngAfterContentInit() {\n\t\tif (!this.tabInput) {\n\t\t\tthis.tabs = this.tabQuery;\n\t\t} else {\n\t\t\tthis.tabs = this.tabInput;\n\t\t}\n\n\t\tthis.tabs.forEach(tab => tab.cacheActive = this.cacheActive);\n\t\tthis.tabs.changes.subscribe(() => {\n\t\t\tthis.setFirstTab();\n\t\t});\n\t\tthis.setFirstTab();\n\t}\n\n\tngOnChanges(changes: SimpleChanges) {\n\t\tif (this.tabs && changes.cacheActive) {\n\t\t\tthis.tabs.forEach(tab => tab.cacheActive = this.cacheActive);\n\t\t}\n\t}\n\n\t/**\n\t * Controls manually focusing tabs.\n\t */\n\tonTabFocus(ref: HTMLElement, index: number) {\n\t\tthis.currentSelectedTab = index;\n\t\t// reset scroll left because we're already handling it\n\t\tthis.headerContainer.nativeElement.parentElement.scrollLeft = 0;\n\t}\n\n\tgetSelectedTab(): any {\n\t\tconst selected = this.tabs.find(tab => tab.active);\n\t\tif (selected) {\n\t\t\treturn selected;\n\t\t}\n\t\treturn { headingIsTemplate: false, heading: \"\" };\n\t}\n\n\t/**\n\t * Selects `Tab` 'tab' and moves it into view on the view DOM if it is not already.\n\t */\n\tselectTab(ref: HTMLElement, tab: Tab, tabIndex: number) {\n\t\tif (tab.disabled) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis.currentSelectedTab = tabIndex;\n\t\tthis.tabs.forEach(_tab => _tab.active = false);\n\t\ttab.active = true;\n\t\ttab.doSelect();\n\t}\n\n\t/**\n\t * Determines which `Tab` is initially selected.\n\t */\n\tprotected setFirstTab() {\n\t\tsetTimeout(() => {\n\t\t\tlet firstTab = this.tabs.find(tab => tab.active);\n\t\t\tif (!firstTab && this.tabs.first) {\n\t\t\t\tfirstTab = this.tabs.first;\n\t\t\t\tfirstTab.active = true;\n\t\t\t}\n\t\t\tif (firstTab) {\n\t\t\t\tfirstTab.doSelect();\n\t\t\t}\n\t\t});\n\t}\n}\n",
50382
50382
  "assetsDirs": [],
50383
50383
  "styleUrlsData": "",
50384
50384
  "stylesData": "",
@@ -68366,16 +68366,6 @@
68366
68366
  "type": "Story<List>",
68367
68367
  "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<p>Ordered List</p>\n\t\t<ol cdsList>\n\t\t\t<li cdsListItem>\n\t\t\t\tOne\n\t\t\t\t<ol cdsList>\n\t\t\t\t\t<li cdsListItem>Nested one</li>\n\t\t\t\t\t<li cdsListItem>Nested two</li>\n\t\t\t\t\t<li cdsListItem>Nested three</li>\n\t\t\t\t</ol>\n\t\t\t</li>\n\t\t\t<li cdsListItem>Two</li>\n\t\t\t<li cdsListItem>Three</li>\n\t\t</ol>\n\t\t<p>Unordered List</p>\n\t\t<ul cdsList>\n\t\t\t<li cdsListItem>\n\t\t\t\tOne\n\t\t\t\t<ul cdsList>\n\t\t\t\t\t<li cdsListItem>Nested one</li>\n\t\t\t\t\t<li cdsListItem>Nested two</li>\n\t\t\t\t\t<li cdsListItem>Nested three</li>\n\t\t\t\t</ul>\n\t\t\t</li>\n\t\t\t<li cdsListItem>Two</li>\n\t\t\t<li cdsListItem>Three</li>\n\t\t</ul>\n\t`\n})"
68368
68368
  },
68369
- {
68370
- "name": "nextId",
68371
- "ctype": "miscellaneous",
68372
- "subtype": "variable",
68373
- "file": "src/tabs/tab.component.ts",
68374
- "deprecated": false,
68375
- "deprecationMessage": "",
68376
- "type": "number",
68377
- "defaultValue": "0"
68378
- },
68379
68369
  {
68380
68370
  "name": "NgModel",
68381
68371
  "ctype": "miscellaneous",
@@ -75432,18 +75422,6 @@
75432
75422
  "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<!--\n\t\t\tapp-* components are for demo purposes only.\n\t\t\tYou can create your own implementation by using the component source as an example.\n\t\t-->\n\t\t<app-multi-step-form></app-multi-step-form>\n\t`\n})"
75433
75423
  }
75434
75424
  ],
75435
- "src/tabs/tab.component.ts": [
75436
- {
75437
- "name": "nextId",
75438
- "ctype": "miscellaneous",
75439
- "subtype": "variable",
75440
- "file": "src/tabs/tab.component.ts",
75441
- "deprecated": false,
75442
- "deprecationMessage": "",
75443
- "type": "number",
75444
- "defaultValue": "0"
75445
- }
75446
- ],
75447
75425
  "src/file-uploader/file-uploader.component.ts": [
75448
75426
  {
75449
75427
  "name": "noop",
@@ -82092,16 +82070,6 @@
82092
82070
  "coverageCount": "14/15",
82093
82071
  "status": "very-good"
82094
82072
  },
82095
- {
82096
- "filePath": "src/tabs/tab.component.ts",
82097
- "type": "variable",
82098
- "linktype": "miscellaneous",
82099
- "linksubtype": "variable",
82100
- "name": "nextId",
82101
- "coveragePercent": 0,
82102
- "coverageCount": "0/1",
82103
- "status": "low"
82104
- },
82105
82073
  {
82106
82074
  "filePath": "src/tabs/tabs.component.ts",
82107
82075
  "type": "component",
@@ -0,0 +1 @@
1
+ "use strict";(self.webpackChunkcarbon_components_angular=self.webpackChunkcarbon_components_angular||[]).push([[9115],{"./src/i18n/index.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{oc:()=>I18n,LU:()=>I18nModule});var tslib_es6=__webpack_require__("./node_modules/tslib/tslib.es6.js"),core=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs"),BehaviorSubject=__webpack_require__("./node_modules/rxjs/dist/esm5/internal/BehaviorSubject.js"),iif=__webpack_require__("./node_modules/rxjs/dist/esm5/internal/observable/iif.js"),isObservable=__webpack_require__("./node_modules/rxjs/dist/esm5/internal/util/isObservable.js"),map=__webpack_require__("./node_modules/rxjs/dist/esm5/internal/operators/map.js"),utils=__webpack_require__("./src/utils/index.ts");const en={BREADCRUMB:{LABEL:"Breadcrumb"},CODE_SNIPPET:{CODE_SNIPPET_TEXT:"Code Snippet Text",SHOW_MORE:"Show more",SHOW_LESS:"Show less",SHOW_MORE_ICON:"Show more icon",COPY_CODE:"Copy code",COPIED:"Copied!"},COMBOBOX:{PLACEHOLDER:"Filter...",CLEAR_SELECTIONS:"Clear all selected items",CLEAR_SELECTED:"Clear selected item",A11Y:{OPEN_MENU:"Open menu",CLOSE_MENU:"Close menu",CLEAR_SELECTIONS:"Clear all selected items",CLEAR_SELECTED:"Clear Selection"}},DROPDOWN:{OPEN:"Open menu",SELECTED:"Selected",CLEAR:"Clear all selected items",FILTER:{SELECTED_ONLY:"Show selected only",SEARCH:"Search",NO_RESULTS:"No search results",RESET_SEARCH:"Reset search"}},DROPDOWN_LIST:{LABEL:"Listbox"},FILE_UPLOADER:{CHECKMARK:"Checkmark",OPEN:"Add file",REMOVE_BUTTON:"Close button"},LOADING:{TITLE:"Loading"},MODAL:{CLOSE:"Close modal"},NOTIFICATION:{CLOSE_BUTTON:"Close alert notification"},NUMBER:{INCREMENT:"Increment value",DECREMENT:"Decrement value"},OVERFLOW_MENU:{OVERFLOW:"Overflow"},SEARCH:{LABEL:"Search",PLACEHOLDER:"Search",CLEAR_BUTTON:"Clear search input"},PAGINATION:{ITEMS_PER_PAGE:"Items per page:",OPEN_LIST_OF_OPTIONS:"Open list of options",BACKWARD:"Backward",FORWARD:"Forward",TOTAL_ITEMS_UNKNOWN:"{{start}}-{{end}} items",TOTAL_ITEMS:"{{start}}-{{end}} of {{total}} items",TOTAL_ITEM:"{{start}}-{{end}} of {{total}} item",PAGE:"page",OF_LAST_PAGES:"of {{last}} pages",OF_LAST_PAGE:"of {{last}} page",NEXT:"Next",PREVIOUS:"Previous",SELECT_ARIA:"Select page number"},PROGRESS_INDICATOR:{CURRENT:"Current",INCOMPLETE:"Incomplete",COMPLETE:"Complete",INVALID:"Invalid"},TABLE:{FILTER:"Filter",END_OF_DATA:"You've reached the end of your content",SCROLL_TOP:"Scroll to top",CHECKBOX_HEADER:"Select all rows",CHECKBOX_ROW:"Select {{value}}",EXPAND_BUTTON:"Expand row",SORT_DESCENDING:"Sort rows by this header in descending order",SORT_ASCENDING:"Sort rows by this header in ascending order",ROW:"row"},TABLE_TOOLBAR:{ACTION_BAR:"Table action bar",BATCH_TEXT:"",BATCH_TEXT_SINGLE:"1 item selected",BATCH_TEXT_MULTIPLE:"{{count}} items selected",CANCEL:"Cancel"},TABS:{BUTTON_ARIA_LEFT:"Go to the previous tab",BUTTON_ARIA_RIGHT:"Go to the next tab",HEADER_ARIA_LABEL:"List of tabs"},TILES:{TILE:"tile",EXPAND:"Expand",COLLAPSE:"Collapse"},TOGGLE:{OFF:"Off",ON:"On"},UI_SHELL:{SKIP_TO:"Skip to content",HEADER:{OPEN_MENU:"Open menu",CLOSE_MENU:"Close menu"},SIDE_NAV:{TOGGLE_OPEN:"Open",TOGGLE_CLOSE:"Close"}}},replace=(subject,variables)=>subject.pipe((0,map.U)((str=>{const keys=Object.keys(variables);for(const key of keys){const value=variables[key];str=str.replace(new RegExp(`{{\\s*${key}\\s*}}`,"g"),value)}return str})));class Overridable{constructor(path,i18n){this.path=path,this.i18n=i18n,this.baseTranslation=this.i18n.get(this.path),this.isOverridden=!1;const value=this.i18n.getValueFromPath(this.path);this.$override=new BehaviorSubject.X(value),this._value=value}get value(){return this._value}set value(v){this.override(v)}get subject(){return(0,iif.s)((()=>this.isOverridden),this.$override,this.baseTranslation)}override(value){this.isOverridden=!0,this.subscription&&(this.subscription.unsubscribe(),this.subscription=null),this._value=value,(0,isObservable.b)(value)?this.subscription=value.subscribe((v=>{this.$override.next(v)})):this.$override.next(value)}}let I18n=class I18n{constructor(){this.translationStrings=en,this.translations=new Map,this.locale=new BehaviorSubject.X("en")}setLocale(language,strings){this.locale.next(language),strings&&this.set(strings)}getLocale(){return this.locale.value}getLocaleObservable(){return this.locale.asObservable()}set(strings){this.translationStrings=(0,utils.TS)({},en,strings);const translations=Array.from(this.translations);for(const[path,subject]of translations)subject.next(this.getValueFromPath(path))}get(path){return path?this.getSubject(path):this.translationStrings}getMultiple(partialPath){const values=this.getValueFromPath(partialPath),subjects={};for(const key of Object.keys(values))values[key]===Object(values[key])?subjects[key]=this.getMultiple(`${partialPath}.${key}`):subjects[key]=this.getSubject(`${partialPath}.${key}`);return subjects}getOverridable(path){return new Overridable(path,this)}replace(subject,variables){return replace(subject,variables)}getValueFromPath(path){let value=this.translationStrings;for(const segment of path.split(".")){if(void 0===value[segment]||null===value[segment])throw new Error(`no key ${segment} at ${path}`);value=value[segment]}return value}getSubject(path){try{const value=this.getValueFromPath(path);if(this.translations.has(path))return this.translations.get(path);const translation=new BehaviorSubject.X(value);return this.translations.set(path,translation),translation}catch(error){console.error(error)}}};I18n=(0,tslib_es6.gn)([(0,core.Injectable)()],I18n);let ReplacePipe=class ReplacePipe{transform(value,variables){return replace(value,variables)}};ReplacePipe=(0,tslib_es6.gn)([(0,core.Pipe)({name:"i18nReplace"})],ReplacePipe);const I18N_SERVICE_PROVIDER={provide:I18n,deps:[[new core.Optional,new core.SkipSelf,I18n]],useFactory:function I18N_SERVICE_PROVIDER_FACTORY(parentService){return parentService||new I18n}};let I18nModule=class I18nModule{};I18nModule=(0,tslib_es6.gn)([(0,core.NgModule)({declarations:[ReplacePipe],exports:[ReplacePipe],providers:[I18n,I18N_SERVICE_PROVIDER]})],I18nModule)},"./src/utils/index.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{NV:()=>AnimationFrameService,Zg:()=>DocumentService,d2:()=>ElementService,PO:()=>EventService,As:()=>UtilsModule,d9:()=>clone,_K:()=>closestAttr,O3:()=>getScrollableParents,np:()=>getScrollbarWidth,OQ:()=>hasScrollableParents,TS:()=>object_merge});var tslib_es6=__webpack_require__("./node_modules/tslib/tslib.es6.js"),core=__webpack_require__("./node_modules/@angular/core/fesm2020/core.mjs"),Subject=__webpack_require__("./node_modules/rxjs/dist/esm5/internal/Subject.js"),from=__webpack_require__("./node_modules/rxjs/dist/esm5/internal/observable/from.js");let AnimationFrameServiceSingleton=class AnimationFrameServiceSingleton{constructor(ngZone){this.ngZone=ngZone,this.frameSource=new Subject.x,this.tick=this.frameSource.asObservable(),this.ngZone.runOutsideAngular((()=>{this.animationFrameId=requestAnimationFrame(this.doTick.bind(this))}))}ngOnDestroy(){cancelAnimationFrame(this.animationFrameId)}doTick(frame){this.frameSource.next(frame),this.ngZone.runOutsideAngular((()=>{requestAnimationFrame(this.doTick.bind(this))}))}};AnimationFrameServiceSingleton.ctorParameters=()=>[{type:core.NgZone}],AnimationFrameServiceSingleton=(0,tslib_es6.gn)([(0,core.Injectable)()],AnimationFrameServiceSingleton);let AnimationFrameService=class AnimationFrameService{constructor(singleton){this.singleton=singleton,this.tick=(0,from.D)(this.singleton.tick)}};AnimationFrameService.ctorParameters=()=>[{type:AnimationFrameServiceSingleton}],AnimationFrameService=(0,tslib_es6.gn)([(0,core.Injectable)()],AnimationFrameService);const object_merge=(target,...objects)=>{for(const object of objects)for(const key in object)object.hasOwnProperty(key)&&(object[key]instanceof Object?(target[key]||(target[key]={}),target[key]=object_merge(target[key],object[key])):target[key]=object[key]);return target};__webpack_require__("./node_modules/@carbon/utils-position/index.js");const isScrollableElement=element=>{const computedStyle=getComputedStyle(element);return"auto"===computedStyle.overflow||"scroll"===computedStyle.overflow||"auto"===computedStyle["overflow-y"]||"scroll"===computedStyle["overflow-y"]||"auto"===computedStyle["overflow-x"]||"scroll"===computedStyle["overflow-x"]},isVisibleInContainer=(element,container)=>{const elementRect=element.getBoundingClientRect(),containerRect=container.getBoundingClientRect();if("BODY"===container.tagName||"HTML"===container.tagName){const isAboveViewport=elementRect.top<0&&elementRect.top+element.clientHeight<0,isLeftOfViewport=elementRect.left<0,isBelowViewport=elementRect.bottom-element.clientHeight>(window.innerHeight||document.documentElement.clientHeight),isRightOfViewport=elementRect.right>(window.innerWidth||document.documentElement.clientWidth);return!(isAboveViewport||isBelowViewport||isLeftOfViewport||isRightOfViewport)}return elementRect.bottom-element.clientHeight<=containerRect.bottom+(container.offsetHeight-container.clientHeight)/2&&elementRect.top>=-element.clientHeight},getScrollableParents=node=>{const elements=[document.body];for(;node.parentElement&&node!==document.body;)isScrollableElement(node)&&elements.push(node),node=node.parentElement;return elements},hasScrollableParents=node=>{for(;node.parentElement&&node!==document.body;){if(isScrollableElement(node))return!0;node=node.parentElement}return!1};function clone(obj){return JSON.parse(JSON.stringify(obj))}function matchesAttr(el,attr,val){const styles=window.getComputedStyle(el);return val.includes(styles[attr])}function closestAttr(s,t,element){let el=element;if(!element)return null;do{if(matchesAttr(el,s,t))return el;el=el.parentElement||el.parentNode}while(null!==el&&1===el.nodeType);return null}var operators_map=__webpack_require__("./node_modules/rxjs/dist/esm5/internal/operators/map.js");let ElementService=class ElementService{constructor(singleton){this.singleton=singleton,this.tick=(0,from.D)(this.singleton.tick)}visibility(target,parentElement=target){const scrollableParents=getScrollableParents(parentElement);return this.tick.pipe((0,operators_map.U)((()=>{for(const parent of scrollableParents)if(!isVisibleInContainer(target,parent))return{visible:!1};return{visible:!0}})))}};ElementService.ctorParameters=()=>[{type:AnimationFrameServiceSingleton}],ElementService=(0,tslib_es6.gn)([(0,core.Injectable)()],ElementService);var Subscription=__webpack_require__("./node_modules/rxjs/dist/esm5/internal/Subscription.js"),Observable=__webpack_require__("./node_modules/rxjs/dist/esm5/internal/Observable.js"),observable_fromEvent=__webpack_require__("./node_modules/rxjs/dist/esm5/internal/observable/fromEvent.js");const getEventObservable=(targetElement,eventType)=>{switch(eventType){case"scroll":case"resize":case"touchstart":case"touchmove":case"touchend":return(0,observable_fromEvent.R)(targetElement,eventType,{passive:!0});default:return(0,observable_fromEvent.R)(targetElement,eventType)}};let DocumentService=class DocumentService{constructor(){this.globalEvents=new Map,this.documentRef=document,this.subscriptions=new Subscription.w0}handleEvent(eventType,callback){this.globalEvents.has(eventType)||(this.documentRef?this.globalEvents.set(eventType,getEventObservable(this.documentRef,eventType)):this.globalEvents.set(eventType,new Observable.y));const observable=this.globalEvents.get(eventType);this.subscriptions.add(observable.subscribe(callback))}handleClick(callback){this.handleEvent("click",callback)}ngOnDestroy(){this.subscriptions.unsubscribe(),this.globalEvents=null}};DocumentService=(0,tslib_es6.gn)([(0,core.Injectable)()],DocumentService);let EventService=class EventService{constructor(documentService){this.documentService=documentService,this.subscriptions=new Subscription.w0,this.targets=new WeakMap}on(targetElement,eventType,callback){this.targets.has(targetElement)||this.targets.set(targetElement,new Map);const eventMap=this.targets.get(targetElement);eventMap.has(eventType)||eventMap.set(eventType,getEventObservable(targetElement,eventType));const subscription=eventMap.get(eventType).subscribe(callback);this.subscriptions.add(subscription)}onDocument(eventType,callback){this.documentService.handleEvent(eventType,callback)}ngOnDestroy(){this.subscriptions.unsubscribe()}};EventService.ctorParameters=()=>[{type:DocumentService}],EventService=(0,tslib_es6.gn)([(0,core.Injectable)()],EventService);const DOCUMENT_SERVICE_PROVIDER={provide:DocumentService,deps:[[new core.Optional,new core.SkipSelf,DocumentService]],useFactory:function DOCUMENT_SERVICE_PROVIDER_FACTORY(parentService){return parentService||new DocumentService}};const ANIMATION_FRAME_SERVICE_SINGLETON_PROVIDER={provide:AnimationFrameServiceSingleton,deps:[[new core.Optional,new core.SkipSelf,AnimationFrameServiceSingleton],core.NgZone],useFactory:function ANIMATION_FRAME_SERVICE_SINGLETON_PROVIDER_FACTORY(parentService,ngZone){return parentService||new AnimationFrameServiceSingleton(ngZone)}};let UtilsModule=class UtilsModule{};UtilsModule=(0,tslib_es6.gn)([(0,core.NgModule)({providers:[DOCUMENT_SERVICE_PROVIDER,ANIMATION_FRAME_SERVICE_SINGLETON_PROVIDER,AnimationFrameServiceSingleton,DocumentService,AnimationFrameService,ElementService,EventService]})],UtilsModule);let _scrollbarWidth=-1;function getScrollbarWidth(){if(_scrollbarWidth>=0)return _scrollbarWidth;const outer=document.createElement("div");outer.style.visibility="hidden",outer.style.width="100px",outer.style.msOverflowStyle="scrollbar",document.body.appendChild(outer);const widthNoScroll=outer.offsetWidth;outer.style.overflow="scroll";const inner=document.createElement("div");inner.style.width="100%",outer.appendChild(inner);const widthWithScroll=inner.offsetWidth;return outer.parentNode.removeChild(outer),_scrollbarWidth=widthNoScroll-widthWithScroll,_scrollbarWidth}}}]);
@@ -348,8 +348,8 @@
348
348
  window['DOCS_OPTIONS'] = {"defaultName":"Docs","autodocs":true};</script><script type="module">import './sb-preview/runtime.js';
349
349
 
350
350
 
351
- import './runtime~main.ceeada28.iframe.bundle.js';
351
+ import './runtime~main.fc6e3901.iframe.bundle.js';
352
352
 
353
353
  import './795.c2864771.iframe.bundle.js';
354
354
 
355
- import './main.e1ee5785.iframe.bundle.js';</script></body></html>
355
+ import './main.fef29d4d.iframe.bundle.js';</script></body></html>