npm - carbon-components-angular - Versions diffs - 5.51.0 → 5.52.0 - Mend

carbon-components-angular 5.51.0 → 5.52.0

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 (193) hide show

package/docs/documentation.json CHANGED Viewed

@@ -11514,6 +11514,58 @@
                 }
             }
         },
+        {
+            "name": "ClickableTileIconDirective",
+            "id": "directive-ClickableTileIconDirective-fa5916c0819be0532c4ac5cdb691ae98ed64330482b5f926e8908d4553bac142acceaf5aa1433441ad004b6a3f3f95ca0086fb12bd39e0ec0c6b7b698190883c",
+            "file": "src/tiles/clickable-tile-icon.directive.ts",
+            "type": "directive",
+            "description": "",
+            "rawdescription": "\n",
+            "sourceCode": "import { Directive, HostBinding } from \"@angular/core\";\n\n@Directive({\n\tselector: \"[cdsClickableTileIcon], [ibmClickableTileIcon]\"\n})\nexport class ClickableTileIconDirective {\n\t@HostBinding(\"class.cds--tile--icon\") icon = true;\n}\n",
+            "selector": "[cdsClickableTileIcon], [ibmClickableTileIcon]",
+            "providers": [],
+            "hostDirectives": [],
+            "standalone": false,
+            "inputsClass": [],
+            "outputsClass": [],
+            "deprecated": false,
+            "deprecationMessage": "",
+            "hostBindings": [
+                {
+                    "name": "class.cds--tile--icon",
+                    "defaultValue": "true",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "line": 7,
+                    "type": "boolean",
+                    "decorators": []
+                }
+            ],
+            "hostListeners": [],
+            "propertiesClass": [
+                {
+                    "name": "icon",
+                    "defaultValue": "true",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "type": "",
+                    "optional": false,
+                    "description": "",
+                    "line": 7,
+                    "decorators": [
+                        {
+                            "name": "HostBinding",
+                            "stringifiedArguments": "'class.cds--tile--icon'"
+                        }
+                    ],
+                    "modifierKind": [
+                        170
+                    ]
+                }
+            ],
+            "methodsClass": [],
+            "extends": []
+        },
         {
             "name": "ColumnDirective",
             "id": "directive-ColumnDirective-16fe516e9b51bd48ec634b2af4811ab3d25003cf401d48dd723538b3d00d673c939688b9109e099ab2fc8c0271c9b5acdae62fb614c2d1eab7c24d65341dde38",
@@ -71998,13 +72050,13 @@
         },
         {
             "name": "TilesModule",
-            "id": "module-TilesModule-be7553ce1e8f3f4af7b5c76a38e25875159e6018a7cb3ef453ce2d303ded9093c80f01a10b61e0946cf14dbf5bfda4d2001a22b54f258517e46946f2058954f6",
+            "id": "module-TilesModule-32c0ae9593720eb80e96bb268959c86fd7898f7fab623d3a15fa750db7a9d3d086bf9d9a31bf5ae2a9d791ff4ee9d98276ddc45b64252a48d58c21ec7fc5d78a",
             "description": "",
             "deprecationMessage": "",
             "deprecated": false,
             "file": "src/tiles/tiles.module.ts",
             "methods": [],
-            "sourceCode": "import { NgModule } from \"@angular/core\";\nimport { CommonModule } from \"@angular/common\";\n\nimport { Tile } from \"./tile.component\";\nimport { ClickableTile } from \"./clickable-tile.component\";\nimport { ExpandableTile } from \"./expandable-tile.component\";\nimport { ExpandableTileAboveFoldDirective } from \"./expandable-tile-above.directive\";\nimport { ExpandableTileBelowFoldDirective } from \"./expandable-tile-below.directive\";\nimport { SelectionTile } from \"./selection-tile.component\";\nimport { TileGroup } from \"./tile-group.component\";\nimport { I18nModule } from \"carbon-components-angular/i18n\";\nimport { IconModule } from \"carbon-components-angular/icon\";\nimport { LinkModule } from \"carbon-components-angular/link\";\n\n@NgModule({\n\tdeclarations: [\n\t\tTile,\n\t\tClickableTile,\n\t\tExpandableTileAboveFoldDirective,\n\t\tExpandableTileBelowFoldDirective,\n\t\tExpandableTile,\n\t\tSelectionTile,\n\t\tTileGroup\n\t],\n\texports: [\n\t\tTile,\n\t\tClickableTile,\n\t\tExpandableTileAboveFoldDirective,\n\t\tExpandableTileBelowFoldDirective,\n\t\tExpandableTile,\n\t\tSelectionTile,\n\t\tTileGroup\n\t],\n\timports: [\n\t\tCommonModule,\n\t\tI18nModule,\n\t\tIconModule,\n\t\tLinkModule\n\t]\n})\nexport class TilesModule {}\n",
+            "sourceCode": "import { NgModule } from \"@angular/core\";\nimport { CommonModule } from \"@angular/common\";\n\nimport { Tile } from \"./tile.component\";\nimport { ClickableTile } from \"./clickable-tile.component\";\nimport { ClickableTileIconDirective } from \"./clickable-tile-icon.directive\";\nimport { ExpandableTile } from \"./expandable-tile.component\";\nimport { ExpandableTileAboveFoldDirective } from \"./expandable-tile-above.directive\";\nimport { ExpandableTileBelowFoldDirective } from \"./expandable-tile-below.directive\";\nimport { SelectionTile } from \"./selection-tile.component\";\nimport { TileGroup } from \"./tile-group.component\";\nimport { I18nModule } from \"carbon-components-angular/i18n\";\nimport { IconModule } from \"carbon-components-angular/icon\";\nimport { LinkModule } from \"carbon-components-angular/link\";\n\n@NgModule({\n\tdeclarations: [\n\t\tTile,\n\t\tClickableTile,\n\t\tClickableTileIconDirective,\n\t\tExpandableTileAboveFoldDirective,\n\t\tExpandableTileBelowFoldDirective,\n\t\tExpandableTile,\n\t\tSelectionTile,\n\t\tTileGroup\n\t],\n\texports: [\n\t\tTile,\n\t\tClickableTile,\n\t\tClickableTileIconDirective,\n\t\tExpandableTileAboveFoldDirective,\n\t\tExpandableTileBelowFoldDirective,\n\t\tExpandableTile,\n\t\tSelectionTile,\n\t\tTileGroup\n\t],\n\timports: [\n\t\tCommonModule,\n\t\tI18nModule,\n\t\tIconModule,\n\t\tLinkModule\n\t]\n})\nexport class TilesModule {}\n",
             "children": [
                 {
                     "type": "providers",
@@ -72016,6 +72068,9 @@
                         {
                             "name": "ClickableTile"
                         },
+                        {
+                            "name": "ClickableTileIconDirective"
+                        },
                         {
                             "name": "ExpandableTile"
                         },
@@ -72056,6 +72111,9 @@
                         {
                             "name": "ClickableTile"
                         },
+                        {
+                            "name": "ClickableTileIconDirective"
+                        },
                         {
                             "name": "ExpandableTile"
                         },
@@ -72681,7 +72739,7 @@
                 "name": "Basic",
                 "ctype": "miscellaneous",
                 "subtype": "variable",
-                "file": "src/button/button-set.stories.ts",
+                "file": "src/breadcrumb/breadcrumb.stories.ts",
                 "deprecated": false,
                 "deprecationMessage": "",
                 "type": "",
@@ -72691,7 +72749,7 @@
                 "name": "Basic",
                 "ctype": "miscellaneous",
                 "subtype": "variable",
-                "file": "src/button/button.stories.ts",
+                "file": "src/button/button-set.stories.ts",
                 "deprecated": false,
                 "deprecationMessage": "",
                 "type": "",
@@ -72701,7 +72759,7 @@
                 "name": "Basic",
                 "ctype": "miscellaneous",
                 "subtype": "variable",
-                "file": "src/button/icon-button.stories.ts",
+                "file": "src/button/button.stories.ts",
                 "deprecated": false,
                 "deprecationMessage": "",
                 "type": "",
@@ -72711,7 +72769,7 @@
                 "name": "Basic",
                 "ctype": "miscellaneous",
                 "subtype": "variable",
-                "file": "src/breadcrumb/breadcrumb.stories.ts",
+                "file": "src/button/icon-button.stories.ts",
                 "deprecated": false,
                 "deprecationMessage": "",
                 "type": "",
@@ -73051,7 +73109,7 @@
                 "name": "Basic",
                 "ctype": "miscellaneous",
                 "subtype": "variable",
-                "file": "src/tabs/tabs.stories.ts",
+                "file": "src/table/table.stories.ts",
                 "deprecated": false,
                 "deprecationMessage": "",
                 "type": "",
@@ -73061,7 +73119,7 @@
                 "name": "Basic",
                 "ctype": "miscellaneous",
                 "subtype": "variable",
-                "file": "src/tag/tag.stories.ts",
+                "file": "src/tabs/tabs.stories.ts",
                 "deprecated": false,
                 "deprecationMessage": "",
                 "type": "",
@@ -73071,7 +73129,7 @@
                 "name": "Basic",
                 "ctype": "miscellaneous",
                 "subtype": "variable",
-                "file": "src/table/table.stories.ts",
+                "file": "src/tag/tag.stories.ts",
                 "deprecated": false,
                 "deprecationMessage": "",
                 "type": "",
@@ -75233,7 +75291,7 @@
                 "name": "Skeleton",
                 "ctype": "miscellaneous",
                 "subtype": "variable",
-                "file": "src/tabs/tabs.stories.ts",
+                "file": "src/table/table.stories.ts",
                 "deprecated": false,
                 "deprecationMessage": "",
                 "type": "",
@@ -75243,7 +75301,7 @@
                 "name": "Skeleton",
                 "ctype": "miscellaneous",
                 "subtype": "variable",
-                "file": "src/table/table.stories.ts",
+                "file": "src/tabs/tabs.stories.ts",
                 "deprecated": false,
                 "deprecationMessage": "",
                 "type": "",
@@ -75353,21 +75411,21 @@
                 "name": "SkeletonTemplate",
                 "ctype": "miscellaneous",
                 "subtype": "variable",
-                "file": "src/tabs/tabs.stories.ts",
+                "file": "src/table/table.stories.ts",
                 "deprecated": false,
                 "deprecationMessage": "",
                 "type": "",
-                "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-tabs skeleton=\"true\">\n\t\t\t<cds-tab></cds-tab>\n\t\t\t<cds-tab></cds-tab>\n\t\t</cds-tabs>\n\n\t\t<div style=\"margin-top: 5rem\">\n\t\t\t<p>Tab skeleton component for cds-tab-header-group:</p>\n\t\t\t<cds-tabs-skeleton></cds-tabs-skeleton>\n\t\t</div>\n\t`\n})"
+                "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<!--\n\t\tapp-* components are for demo purposes only.\n\t\tYou can create your own implementation by using the component source found at:\n\t\thttps://github.com/IBM/carbon-components-angular/tree/master/src/table/stories/app-skeleton-table.component.ts\n\t\t-->\n\t\t<app-skeleton-table\n\t\t\t[skeletonModel]=\"skeletonModel\"\n\t\t\t[size]=\"size\"\n\t\t\t[striped]=\"striped\">\n\t\t</app-skeleton-table>\n\t`\n})"
             },
             {
                 "name": "SkeletonTemplate",
                 "ctype": "miscellaneous",
                 "subtype": "variable",
-                "file": "src/table/table.stories.ts",
+                "file": "src/tabs/tabs.stories.ts",
                 "deprecated": false,
                 "deprecationMessage": "",
                 "type": "",
-                "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<!--\n\t\tapp-* components are for demo purposes only.\n\t\tYou can create your own implementation by using the component source found at:\n\t\thttps://github.com/IBM/carbon-components-angular/tree/master/src/table/stories/app-skeleton-table.component.ts\n\t\t-->\n\t\t<app-skeleton-table\n\t\t\t[skeletonModel]=\"skeletonModel\"\n\t\t\t[size]=\"size\"\n\t\t\t[striped]=\"striped\">\n\t\t</app-skeleton-table>\n\t`\n})"
+                "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-tabs skeleton=\"true\">\n\t\t\t<cds-tab></cds-tab>\n\t\t\t<cds-tab></cds-tab>\n\t\t</cds-tabs>\n\n\t\t<div style=\"margin-top: 5rem\">\n\t\t\t<p>Tab skeleton component for cds-tab-header-group:</p>\n\t\t\t<cds-tabs-skeleton></cds-tabs-skeleton>\n\t\t</div>\n\t`\n})"
             },
             {
                 "name": "SkeletonTemplate",
@@ -75463,41 +75521,41 @@
                 "name": "Template",
                 "ctype": "miscellaneous",
                 "subtype": "variable",
-                "file": "src/button/button-set.stories.ts",
+                "file": "src/breadcrumb/breadcrumb.stories.ts",
                 "deprecated": false,
                 "deprecationMessage": "",
                 "type": "",
-                "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-button-set>\n\t\t\t<button cdsButton=\"secondary\" [size]=\"size\" [isExpressive]=\"isExpressive\">Button</button>\n\t\t\t<button cdsButton [size]=\"size\" [isExpressive]=\"isExpressive\">Button</button>\n\t\t</cds-button-set>\n\t`\n})"
+                "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-breadcrumb [noTrailingSlash]=\"noTrailingSlash\">\n\t\t\t<cds-breadcrumb-item href=\"#1\">\n\t\t\t\tBreadcrumb 1\n\t\t\t</cds-breadcrumb-item>\n\t\t\t<cds-breadcrumb-item href=\"#2\">\n\t\t\t\tBreadcrumb 2\n\t\t\t</cds-breadcrumb-item>\n\t\t\t<cds-breadcrumb-item href=\"#3\">\n\t\t\t\tBreadcrumb 3\n\t\t\t</cds-breadcrumb-item>\n\t\t</cds-breadcrumb>\n\t`\n})"
             },
             {
                 "name": "Template",
                 "ctype": "miscellaneous",
                 "subtype": "variable",
-                "file": "src/button/button.stories.ts",
+                "file": "src/button/button-set.stories.ts",
                 "deprecated": false,
                 "deprecationMessage": "",
                 "type": "",
-                "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<button\n\t\t\t[cdsButton]=\"kind\"\n\t\t\t[size]=\"size\"\n\t\t\t[isExpressive]=\"isExpressive\"\n\t\t\t[disabled]=\"disabled\"\n\t\t\t(click)=\"onClick($event)\"\n\t\t\t(mouseenter)=\"onMouseEnter($event)\"\n\t\t\t(mouseleave)=\"onMouseLeave($event)\"\n\t\t\t(focus)=\"onFocus($event)\"\n\t\t\t(blur)=\"onBlur($event)\">\n\t\t\tButton\n\t\t</button>\n\t`\n})"
+                "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-button-set>\n\t\t\t<button cdsButton=\"secondary\" [size]=\"size\" [isExpressive]=\"isExpressive\">Button</button>\n\t\t\t<button cdsButton [size]=\"size\" [isExpressive]=\"isExpressive\">Button</button>\n\t\t</cds-button-set>\n\t`\n})"
             },
             {
                 "name": "Template",
                 "ctype": "miscellaneous",
                 "subtype": "variable",
-                "file": "src/button/icon-button.stories.ts",
+                "file": "src/button/button.stories.ts",
                 "deprecated": false,
                 "deprecationMessage": "",
                 "type": "",
-                "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-icon-button\n\t\t\tbuttonId=\"icon-btn1\"\n\t\t\ttype=\"button\"\n\t\t\t[kind]=\"kind\"\n\t\t\t[size]=\"size\"\n\t\t\t[align]=\"align\"\n\t\t\t[buttonNgClass]=\"buttonNgClass\"\n\t\t\t[buttonAttributes]=\"buttonAttributes\"\n\t\t\t[disabled]=\"disabled\"\n\t\t\tdescription=\"Icon Description\"\n\t\t\t(click)=\"onClick($event)\"\n\t\t\t(mouseenter)=\"onMouseEnter($event)\"\n\t\t\t(mouseleave)=\"onMouseLeave($event)\"\n\t\t\t(focus)=\"onFocus($event)\"\n\t\t\t(blur)=\"onBlur($event)\">\n\t\t\t<svg class=\"cds--btn__icon\" cdsIcon=\"copy\" size=\"16\"></svg>\n\t\t</cds-icon-button>\n\t`\n})"
+                "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<button\n\t\t\t[cdsButton]=\"kind\"\n\t\t\t[size]=\"size\"\n\t\t\t[isExpressive]=\"isExpressive\"\n\t\t\t[disabled]=\"disabled\"\n\t\t\t(click)=\"onClick($event)\"\n\t\t\t(mouseenter)=\"onMouseEnter($event)\"\n\t\t\t(mouseleave)=\"onMouseLeave($event)\"\n\t\t\t(focus)=\"onFocus($event)\"\n\t\t\t(blur)=\"onBlur($event)\">\n\t\t\tButton\n\t\t</button>\n\t`\n})"
             },
             {
                 "name": "Template",
                 "ctype": "miscellaneous",
                 "subtype": "variable",
-                "file": "src/breadcrumb/breadcrumb.stories.ts",
+                "file": "src/button/icon-button.stories.ts",
                 "deprecated": false,
                 "deprecationMessage": "",
                 "type": "",
-                "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-breadcrumb [noTrailingSlash]=\"noTrailingSlash\">\n\t\t\t<cds-breadcrumb-item href=\"#1\">\n\t\t\t\tBreadcrumb 1\n\t\t\t</cds-breadcrumb-item>\n\t\t\t<cds-breadcrumb-item href=\"#2\">\n\t\t\t\tBreadcrumb 2\n\t\t\t</cds-breadcrumb-item>\n\t\t\t<cds-breadcrumb-item href=\"#3\">\n\t\t\t\tBreadcrumb 3\n\t\t\t</cds-breadcrumb-item>\n\t\t</cds-breadcrumb>\n\t`\n})"
+                "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-icon-button\n\t\t\tbuttonId=\"icon-btn1\"\n\t\t\ttype=\"button\"\n\t\t\t[kind]=\"kind\"\n\t\t\t[size]=\"size\"\n\t\t\t[align]=\"align\"\n\t\t\t[buttonNgClass]=\"buttonNgClass\"\n\t\t\t[buttonAttributes]=\"buttonAttributes\"\n\t\t\t[disabled]=\"disabled\"\n\t\t\tdescription=\"Icon Description\"\n\t\t\t(click)=\"onClick($event)\"\n\t\t\t(mouseenter)=\"onMouseEnter($event)\"\n\t\t\t(mouseleave)=\"onMouseLeave($event)\"\n\t\t\t(focus)=\"onFocus($event)\"\n\t\t\t(blur)=\"onBlur($event)\">\n\t\t\t<svg class=\"cds--btn__icon\" cdsIcon=\"copy\" size=\"16\"></svg>\n\t\t</cds-icon-button>\n\t`\n})"
             },
             {
                 "name": "Template",
@@ -75833,31 +75891,31 @@
                 "name": "Template",
                 "ctype": "miscellaneous",
                 "subtype": "variable",
-                "file": "src/tabs/tabs.stories.ts",
+                "file": "src/table/table.stories.ts",
                 "deprecated": false,
                 "deprecationMessage": "",
                 "type": "",
-                "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-tabs\n\t\t\t[type]=\"type\"\n\t\t\t[followFocus]=\"followFocus\"\n\t\t\t[isNavigation]=\"isNavigation\"\n\t\t\t[cacheActive]=\"cacheActive\">\n\t\t\t<cds-tab heading=\"one\">Tab Content 1</cds-tab>\n\t\t\t<cds-tab heading=\"two\">Tab Content 2</cds-tab>\n\t\t\t<cds-tab heading=\"three\" [tabContent]=\"three\"></cds-tab>\n\t\t\t<cds-tab heading=\"four\" [tabContent]=\"four\"></cds-tab>\n\t\t</cds-tabs>\n\n\t\t<!-- Use templates if you would like to have lifecycle hooks called when cacheActive is false -->\n\t\t<ng-template #three>\n\t\t\tTab Content 3\n\t\t</ng-template>\n\n\t\t<ng-template #four>\n\t\t\tTab Content 4\n\t\t</ng-template>\n\t`\n})"
+                "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-table-container>\n\t\t\t<cds-table-header>\n\t\t\t\t<h4 cdsTableHeaderTitle>{{title}}</h4>\n\t\t\t\t<p cdsTableHeaderDescription>{{description}}</p>\n\t\t\t</cds-table-header>\n\n\t\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 found at:\n\t\t\thttps://github.com/IBM/carbon-components-angular/tree/master/src/table/stories/app-table.component.ts\n\t\t\t-->\n\t\t\t<app-table\n\t\t\t\t[model]=\"model\"\n\t\t\t\t[stickyHeader]=\"stickyHeader\"\n\t\t\t\t[size]=\"size\"\n\t\t\t\t[skeleton]=\"skeleton\"\n\t\t\t\t[enableSingleSelect]=\"enableSingleSelect\"\n\t\t\t\t[showSelectionColumn]=\"showSelectionColumn\"\n\t\t\t\t[striped]=\"striped\"\n\t\t\t\t[sortable]=\"sortable\"\n\t\t\t\t[isDataGrid]=\"isDataGrid\">\n\t\t\t</app-table>\n\t\t</cds-table-container>\n\t`\n})"
             },
             {
                 "name": "Template",
                 "ctype": "miscellaneous",
                 "subtype": "variable",
-                "file": "src/tag/tag.stories.ts",
+                "file": "src/tabs/tabs.stories.ts",
                 "deprecated": false,
                 "deprecationMessage": "",
                 "type": "",
-                "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-tag [type]=\"type\" [size]=\"size\">Tag</cds-tag>\n\t`\n})"
+                "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-tabs\n\t\t\t[type]=\"type\"\n\t\t\t[followFocus]=\"followFocus\"\n\t\t\t[isNavigation]=\"isNavigation\"\n\t\t\t[cacheActive]=\"cacheActive\">\n\t\t\t<cds-tab heading=\"one\">Tab Content 1</cds-tab>\n\t\t\t<cds-tab heading=\"two\">Tab Content 2</cds-tab>\n\t\t\t<cds-tab heading=\"three\" [tabContent]=\"three\"></cds-tab>\n\t\t\t<cds-tab heading=\"four\" [tabContent]=\"four\"></cds-tab>\n\t\t</cds-tabs>\n\n\t\t<!-- Use templates if you would like to have lifecycle hooks called when cacheActive is false -->\n\t\t<ng-template #three>\n\t\t\tTab Content 3\n\t\t</ng-template>\n\n\t\t<ng-template #four>\n\t\t\tTab Content 4\n\t\t</ng-template>\n\t`\n})"
             },
             {
                 "name": "Template",
                 "ctype": "miscellaneous",
                 "subtype": "variable",
-                "file": "src/table/table.stories.ts",
+                "file": "src/tag/tag.stories.ts",
                 "deprecated": false,
                 "deprecationMessage": "",
                 "type": "",
-                "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-table-container>\n\t\t\t<cds-table-header>\n\t\t\t\t<h4 cdsTableHeaderTitle>{{title}}</h4>\n\t\t\t\t<p cdsTableHeaderDescription>{{description}}</p>\n\t\t\t</cds-table-header>\n\n\t\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 found at:\n\t\t\thttps://github.com/IBM/carbon-components-angular/tree/master/src/table/stories/app-table.component.ts\n\t\t\t-->\n\t\t\t<app-table\n\t\t\t\t[model]=\"model\"\n\t\t\t\t[stickyHeader]=\"stickyHeader\"\n\t\t\t\t[size]=\"size\"\n\t\t\t\t[skeleton]=\"skeleton\"\n\t\t\t\t[enableSingleSelect]=\"enableSingleSelect\"\n\t\t\t\t[showSelectionColumn]=\"showSelectionColumn\"\n\t\t\t\t[striped]=\"striped\"\n\t\t\t\t[sortable]=\"sortable\"\n\t\t\t\t[isDataGrid]=\"isDataGrid\">\n\t\t\t</app-table>\n\t\t</cds-table-container>\n\t`\n})"
+                "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-tag [type]=\"type\" [size]=\"size\">Tag</cds-tag>\n\t`\n})"
             },
             {
                 "name": "Template",
@@ -75877,7 +75935,7 @@
                 "deprecated": false,
                 "deprecationMessage": "",
                 "type": "",
-                "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-clickable-tile\n\t\t\t[disabled]=\"disabled\"\n\t\t\t[href]=\"href\"\n\t\t\ttarget=\"_blank\">\n\t\t\tClick the tile to open the Carbon Design System\n\t\t</cds-clickable-tile>\n\t`\n})"
+                "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-clickable-tile\n\t\t\t[disabled]=\"disabled\"\n\t\t\t[href]=\"href\"\n\t\t\ttarget=\"_blank\">\n\t\t\tClick the tile to open the Carbon Design System\n\t\t\t<svg\n\t\t\t\tcdsClickableTileIcon\n\t\t\t\tcdsIcon=\"caret--right\"\n\t\t\t\tsize=\"16\">\n\t\t\t</svg>\n\t\t</cds-clickable-tile>\n\t`\n})"
             },
             {
                 "name": "Template",
@@ -79273,199 +79331,199 @@
                     "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<div style=\"width: 500px\">\n\t\t\t<cds-accordion>\n\t\t\t\t<cds-accordion-item [title]=\"title\" (selected)=\"selected($event)\">\n\t\t\t\t\tLorem ipsum dolor sit amet, \\\n\t\t\t\t\tconsectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore \\\n\t\t\t\t\tet dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation \\\n\t\t\t\t\tullamco laboris nisi ut aliquip ex ea commodo consequat.\n\t\t\t\t</cds-accordion-item>\n\t\t\t\t<cds-accordion-item [title]=\"titleWithContext\" [context]=\"{ index: 2 }\" (selected)=\"selected($event)\">\n\t\t\t\t\tLorem ipsum dolor sit amet, \\\n\t\t\t\t\tconsectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore \\\n\t\t\t\t\tet dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation \\\n\t\t\t\t\tullamco laboris nisi ut aliquip ex ea commodo consequat.\n\t\t\t\t</cds-accordion-item>\n\t\t\t</cds-accordion>\n\t\t</div>\n\t\t<ng-template #title>\n\t\t\t<p class=\"cds--accordion__title\">Section 1 title</p>\n\t\t</ng-template>\n\t\t<ng-template #titleWithContext let-index=\"index\">\n\t\t\t<p class=\"cds--accordion__title\">Section {{ index }} title</p>\n\t\t</ng-template>\n\t`\n})"
                 }
             ],
-            "src/button/button-set.stories.ts": [
+            "src/breadcrumb/breadcrumb.stories.ts": [
                 {
                     "name": "Basic",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
-                    "file": "src/button/button-set.stories.ts",
+                    "file": "src/breadcrumb/breadcrumb.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
                     "defaultValue": "Template.bind({})"
                 },
                 {
-                    "name": "Template",
+                    "name": "breadcrumbItems",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
-                    "file": "src/button/button-set.stories.ts",
+                    "file": "src/breadcrumb/breadcrumb.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
-                    "type": "",
-                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-button-set>\n\t\t\t<button cdsButton=\"secondary\" [size]=\"size\" [isExpressive]=\"isExpressive\">Button</button>\n\t\t\t<button cdsButton [size]=\"size\" [isExpressive]=\"isExpressive\">Button</button>\n\t\t</cds-button-set>\n\t`\n})"
-                }
-            ],
-            "src/button/button.stories.ts": [
+                    "type": ""
+                },
                 {
-                    "name": "Basic",
+                    "name": "createBreadcrumbItems",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
-                    "file": "src/button/button.stories.ts",
+                    "file": "src/breadcrumb/breadcrumb.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "Template.bind({})"
+                    "defaultValue": "(count: number, content = \"Breadcrumb\"): Array<BreadcrumbItem> => {\n\tif (breadcrumbItems && count === breadcrumbItems.length) {\n\t\treturn breadcrumbItems;\n\t}\n\tbreadcrumbItems = Array(count).fill(0).map((x, i) => ({\n\t\tcontent: `${content} ${i + 1}`,\n\t\thref: \"#\" + (i + 1)\n\t}));\n\treturn breadcrumbItems;\n}"
                 },
                 {
-                    "name": "Template",
+                    "name": "CurrentPage",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
-                    "file": "src/button/button.stories.ts",
+                    "file": "src/breadcrumb/breadcrumb.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<button\n\t\t\t[cdsButton]=\"kind\"\n\t\t\t[size]=\"size\"\n\t\t\t[isExpressive]=\"isExpressive\"\n\t\t\t[disabled]=\"disabled\"\n\t\t\t(click)=\"onClick($event)\"\n\t\t\t(mouseenter)=\"onMouseEnter($event)\"\n\t\t\t(mouseleave)=\"onMouseLeave($event)\"\n\t\t\t(focus)=\"onFocus($event)\"\n\t\t\t(blur)=\"onBlur($event)\">\n\t\t\tButton\n\t\t</button>\n\t`\n})"
+                    "defaultValue": "CurrentPageTemplate.bind({})"
                 },
                 {
-                    "name": "WithIcon",
+                    "name": "CurrentPageTemplate",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
-                    "file": "src/button/button.stories.ts",
+                    "file": "src/breadcrumb/breadcrumb.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "WithIconTemplate.bind({})"
+                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-breadcrumb>\n\t\t\t<cds-breadcrumb-item href=\"#1\">\n\t\t\t\tBreadcrumb 1\n\t\t\t</cds-breadcrumb-item>\n\t\t\t<cds-breadcrumb-item href=\"#2\">\n\t\t\t\tBreadcrumb 2\n\t\t\t</cds-breadcrumb-item>\n\t\t\t<cds-breadcrumb-item current=\"true\" href=\"#3\">\n\t\t\t\tBreadcrumb 3\n\t\t\t</cds-breadcrumb-item>\n\t\t</cds-breadcrumb>\n\t`\n})"
                 },
                 {
-                    "name": "WithIconTemplate",
+                    "name": "Model",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
-                    "file": "src/button/button.stories.ts",
+                    "file": "src/breadcrumb/breadcrumb.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<button\n\t\t\t[cdsButton]=\"kind\"\n\t\t\t[size]=\"size\"\n\t\t\t[isExpressive]=\"isExpressive\"\n\t\t\t[disabled]=\"disabled\"\n\t\t\t(click)=\"onClick($event)\"\n\t\t\t(mouseenter)=\"onMouseEnter($event)\"\n\t\t\t(mouseleave)=\"onMouseleave($event)\"\n\t\t\t(focus)=\"onFocus($event)\"\n\t\t\t(blur)=\"onBlur($event)\">\n\t\t\tWith icon\n\t\t\t<svg class=\"cds--btn__icon\" cdsIcon=\"add\" size=\"16\"></svg>\n\t\t</button>\n\t`\n})"
-                }
-            ],
-            "src/breadcrumb/breadcrumb.stories.ts": [
+                    "defaultValue": "ModelTemplate.bind({})"
+                },
                 {
-                    "name": "Basic",
+                    "name": "ModelTemplate",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
                     "file": "src/breadcrumb/breadcrumb.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "Template.bind({})"
+                    "defaultValue": "(args) => ({\n\tprops: {\n\t\t...args,\n\t\tcreateBreadcrumbItems\n\t},\n\ttemplate: `\n\t\t<cds-breadcrumb\n\t\t\t[noTrailingSlash]=\"noTrailingSlash\"\n\t\t\t[threshold]=\"threshold\"\n\t\t\t[items]=\"createBreadcrumbItems(itemCount, content)\">\n\t\t</cds-breadcrumb>\n\t`\n})"
                 },
                 {
-                    "name": "breadcrumbItems",
+                    "name": "ModelWithTemplate",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
                     "file": "src/breadcrumb/breadcrumb.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
-                    "type": ""
+                    "type": "",
+                    "defaultValue": "ModelWTemplate.bind({})"
                 },
                 {
-                    "name": "createBreadcrumbItems",
+                    "name": "ModelWTemplate",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
                     "file": "src/breadcrumb/breadcrumb.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "(count: number, content = \"Breadcrumb\"): Array<BreadcrumbItem> => {\n\tif (breadcrumbItems && count === breadcrumbItems.length) {\n\t\treturn breadcrumbItems;\n\t}\n\tbreadcrumbItems = Array(count).fill(0).map((x, i) => ({\n\t\tcontent: `${content} ${i + 1}`,\n\t\thref: \"#\" + (i + 1)\n\t}));\n\treturn breadcrumbItems;\n}"
+                    "defaultValue": "(args) => ({\n\tprops: {\n\t\t...args,\n\t\tcreateBreadcrumbItems,\n\t\twithTemplate\n\t},\n\ttemplate: `\n\t\t<ng-template #breadcrumbTemplate let-item>\n\t\t\t{{ templateContent }}{{ item.content }}\n\t\t</ng-template>\n\t\t<cds-breadcrumb\n\t\t\t[noTrailingSlash]=\"noTrailingSlash\"\n\t\t\t[threshold]=\"threshold\"\n\t\t\t[items]=\"withTemplate(breadcrumbTemplate, createBreadcrumbItems(itemCount, content))\">\n\t\t</cds-breadcrumb>\n\t`\n})"
                 },
                 {
-                    "name": "CurrentPage",
+                    "name": "Skeleton",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
                     "file": "src/breadcrumb/breadcrumb.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "CurrentPageTemplate.bind({})"
+                    "defaultValue": "WithSkeleton.bind({})"
                 },
                 {
-                    "name": "CurrentPageTemplate",
+                    "name": "Template",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
                     "file": "src/breadcrumb/breadcrumb.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-breadcrumb>\n\t\t\t<cds-breadcrumb-item href=\"#1\">\n\t\t\t\tBreadcrumb 1\n\t\t\t</cds-breadcrumb-item>\n\t\t\t<cds-breadcrumb-item href=\"#2\">\n\t\t\t\tBreadcrumb 2\n\t\t\t</cds-breadcrumb-item>\n\t\t\t<cds-breadcrumb-item current=\"true\" href=\"#3\">\n\t\t\t\tBreadcrumb 3\n\t\t\t</cds-breadcrumb-item>\n\t\t</cds-breadcrumb>\n\t`\n})"
+                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-breadcrumb [noTrailingSlash]=\"noTrailingSlash\">\n\t\t\t<cds-breadcrumb-item href=\"#1\">\n\t\t\t\tBreadcrumb 1\n\t\t\t</cds-breadcrumb-item>\n\t\t\t<cds-breadcrumb-item href=\"#2\">\n\t\t\t\tBreadcrumb 2\n\t\t\t</cds-breadcrumb-item>\n\t\t\t<cds-breadcrumb-item href=\"#3\">\n\t\t\t\tBreadcrumb 3\n\t\t\t</cds-breadcrumb-item>\n\t\t</cds-breadcrumb>\n\t`\n})"
                 },
                 {
-                    "name": "Model",
+                    "name": "WithSkeleton",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
                     "file": "src/breadcrumb/breadcrumb.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "ModelTemplate.bind({})"
+                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-breadcrumb skeleton=\"true\" [noTrailingSlash]=\"noTrailingSlash\">\n\t\t\t<cds-breadcrumb-item></cds-breadcrumb-item>\n\t\t\t<cds-breadcrumb-item></cds-breadcrumb-item>\n\t\t\t<cds-breadcrumb-item></cds-breadcrumb-item>\n\t\t\t<cds-breadcrumb-item></cds-breadcrumb-item>\n\t\t</cds-breadcrumb>\n\t`\n})"
                 },
                 {
-                    "name": "ModelTemplate",
+                    "name": "withTemplate",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
                     "file": "src/breadcrumb/breadcrumb.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "(args) => ({\n\tprops: {\n\t\t...args,\n\t\tcreateBreadcrumbItems\n\t},\n\ttemplate: `\n\t\t<cds-breadcrumb\n\t\t\t[noTrailingSlash]=\"noTrailingSlash\"\n\t\t\t[threshold]=\"threshold\"\n\t\t\t[items]=\"createBreadcrumbItems(itemCount, content)\">\n\t\t</cds-breadcrumb>\n\t`\n})"
-                },
+                    "defaultValue": "(templateRef, items) => items.map(item => Object.assign(item, { template: templateRef }))"
+                }
+            ],
+            "src/button/button-set.stories.ts": [
                 {
-                    "name": "ModelWithTemplate",
+                    "name": "Basic",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
-                    "file": "src/breadcrumb/breadcrumb.stories.ts",
+                    "file": "src/button/button-set.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "ModelWTemplate.bind({})"
+                    "defaultValue": "Template.bind({})"
                 },
                 {
-                    "name": "ModelWTemplate",
+                    "name": "Template",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
-                    "file": "src/breadcrumb/breadcrumb.stories.ts",
+                    "file": "src/button/button-set.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "(args) => ({\n\tprops: {\n\t\t...args,\n\t\tcreateBreadcrumbItems,\n\t\twithTemplate\n\t},\n\ttemplate: `\n\t\t<ng-template #breadcrumbTemplate let-item>\n\t\t\t{{ templateContent }}{{ item.content }}\n\t\t</ng-template>\n\t\t<cds-breadcrumb\n\t\t\t[noTrailingSlash]=\"noTrailingSlash\"\n\t\t\t[threshold]=\"threshold\"\n\t\t\t[items]=\"withTemplate(breadcrumbTemplate, createBreadcrumbItems(itemCount, content))\">\n\t\t</cds-breadcrumb>\n\t`\n})"
-                },
+                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-button-set>\n\t\t\t<button cdsButton=\"secondary\" [size]=\"size\" [isExpressive]=\"isExpressive\">Button</button>\n\t\t\t<button cdsButton [size]=\"size\" [isExpressive]=\"isExpressive\">Button</button>\n\t\t</cds-button-set>\n\t`\n})"
+                }
+            ],
+            "src/button/button.stories.ts": [
                 {
-                    "name": "Skeleton",
+                    "name": "Basic",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
-                    "file": "src/breadcrumb/breadcrumb.stories.ts",
+                    "file": "src/button/button.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "WithSkeleton.bind({})"
+                    "defaultValue": "Template.bind({})"
                 },
                 {
                     "name": "Template",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
-                    "file": "src/breadcrumb/breadcrumb.stories.ts",
+                    "file": "src/button/button.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-breadcrumb [noTrailingSlash]=\"noTrailingSlash\">\n\t\t\t<cds-breadcrumb-item href=\"#1\">\n\t\t\t\tBreadcrumb 1\n\t\t\t</cds-breadcrumb-item>\n\t\t\t<cds-breadcrumb-item href=\"#2\">\n\t\t\t\tBreadcrumb 2\n\t\t\t</cds-breadcrumb-item>\n\t\t\t<cds-breadcrumb-item href=\"#3\">\n\t\t\t\tBreadcrumb 3\n\t\t\t</cds-breadcrumb-item>\n\t\t</cds-breadcrumb>\n\t`\n})"
+                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<button\n\t\t\t[cdsButton]=\"kind\"\n\t\t\t[size]=\"size\"\n\t\t\t[isExpressive]=\"isExpressive\"\n\t\t\t[disabled]=\"disabled\"\n\t\t\t(click)=\"onClick($event)\"\n\t\t\t(mouseenter)=\"onMouseEnter($event)\"\n\t\t\t(mouseleave)=\"onMouseLeave($event)\"\n\t\t\t(focus)=\"onFocus($event)\"\n\t\t\t(blur)=\"onBlur($event)\">\n\t\t\tButton\n\t\t</button>\n\t`\n})"
                 },
                 {
-                    "name": "WithSkeleton",
+                    "name": "WithIcon",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
-                    "file": "src/breadcrumb/breadcrumb.stories.ts",
+                    "file": "src/button/button.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-breadcrumb skeleton=\"true\" [noTrailingSlash]=\"noTrailingSlash\">\n\t\t\t<cds-breadcrumb-item></cds-breadcrumb-item>\n\t\t\t<cds-breadcrumb-item></cds-breadcrumb-item>\n\t\t\t<cds-breadcrumb-item></cds-breadcrumb-item>\n\t\t\t<cds-breadcrumb-item></cds-breadcrumb-item>\n\t\t</cds-breadcrumb>\n\t`\n})"
+                    "defaultValue": "WithIconTemplate.bind({})"
                 },
                 {
-                    "name": "withTemplate",
+                    "name": "WithIconTemplate",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
-                    "file": "src/breadcrumb/breadcrumb.stories.ts",
+                    "file": "src/button/button.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "(templateRef, items) => items.map(item => Object.assign(item, { template: templateRef }))"
+                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<button\n\t\t\t[cdsButton]=\"kind\"\n\t\t\t[size]=\"size\"\n\t\t\t[isExpressive]=\"isExpressive\"\n\t\t\t[disabled]=\"disabled\"\n\t\t\t(click)=\"onClick($event)\"\n\t\t\t(mouseenter)=\"onMouseEnter($event)\"\n\t\t\t(mouseleave)=\"onMouseleave($event)\"\n\t\t\t(focus)=\"onFocus($event)\"\n\t\t\t(blur)=\"onBlur($event)\">\n\t\t\tWith icon\n\t\t\t<svg class=\"cds--btn__icon\" cdsIcon=\"add\" size=\"16\"></svg>\n\t\t</button>\n\t`\n})"
                 }
             ],
             "src/checkbox/checkbox.stories.ts": [
@@ -81210,440 +81268,440 @@
                     "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-structured-list [condensed]=\"condensed\">\n\t\t\t<cds-list-header>\n\t\t\t\t<cds-list-column nowrap=\"true\">Column 1</cds-list-column>\n\t\t\t\t<cds-list-column nowrap=\"true\">Column 2</cds-list-column>\n\t\t\t\t<cds-list-column>Column 3</cds-list-column>\n\t\t\t</cds-list-header>\n\t\t\t<cds-list-row>\n\t\t\t\t<cds-list-column>Row 1</cds-list-column>\n\t\t\t\t<cds-list-column nowrap=\"true\">Row One</cds-list-column>\n\t\t\t\t<cds-list-column>\n\t\t\t\t\tLorem ipsum dolor sit amet,\n\t\t\t\t\tconsectetur adipiscing elit. Nunc dui magna,\n\t\t\t\t\tfinibus id tortor sed, aliquet bibendum augue.\n\t\t\t\t\tAenean posuere sem vel euismod dignissim. Nulla ut cursus dolor.\n\t\t\t\t\tPellentesque vulputate nisl a porttitor interdum.\n\t\t\t\t</cds-list-column>\n\t\t\t</cds-list-row>\n\t\t\t<cds-list-row>\n\t\t\t\t<cds-list-column>Row 2</cds-list-column>\n\t\t\t\t<cds-list-column nowrap=\"true\">Row Two</cds-list-column>\n\t\t\t\t<cds-list-column>\n\t\t\t\t\tLorem ipsum dolor sit amet,\n\t\t\t\t\tconsectetur adipiscing elit. Nunc dui magna,\n\t\t\t\t\tfinibus id tortor sed, aliquet bibendum augue.\n\t\t\t\t\tAenean posuere sem vel euismod dignissim. Nulla ut cursus dolor.\n\t\t\t\t\tPellentesque vulputate nisl a porttitor interdum.\n\t\t\t\t</cds-list-column>\n\t\t\t</cds-list-row>\n\t\t</cds-structured-list>\n\t`\n})"
                 }
             ],
-            "src/tabs/tabs.stories.ts": [
+            "src/table/table.stories.ts": [
                 {
                     "name": "Basic",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
-                    "file": "src/tabs/tabs.stories.ts",
+                    "file": "src/table/table.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
                     "defaultValue": "Template.bind({})"
                 },
                 {
-                    "name": "BeforeAndAfter",
+                    "name": "DisabledRowsTemplate",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
-                    "file": "src/tabs/tabs.stories.ts",
+                    "file": "src/table/table.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "BeforeAndAfterTemplate.bind({})"
+                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-table-container>\n\t\t\t<cds-table-header>\n\t\t\t\t<h4 cdsTableHeaderTitle>{{title}}</h4>\n\t\t\t\t<p cdsTableHeaderDescription>{{description}}</p>\n\t\t\t</cds-table-header>\n\t\t\t<cds-table-toolbar [model]=\"model\" [batchText]=\"batchText\" #toolbar>\n\t\t\t\t<cds-table-toolbar-actions>\n\t\t\t\t\t<button cdsButton=\"primary\">\n\t\t\t\t\t\tDelete\n\t\t\t\t\t\t<svg cdsIcon=\"delete\" size=\"16\" class=\"cds--btn__icon\"></svg>\n\t\t\t\t\t</button>\n\t\t\t\t\t<button cdsButton=\"primary\">\n\t\t\t\t\t\tSave\n\t\t\t\t\t\t<svg cdsIcon=\"save\" size=\"16\" class=\"cds--btn__icon\"></svg>\n\t\t\t\t\t</button>\n\t\t\t\t\t<button cdsButton=\"primary\">\n\t\t\t\t\t\tDownload\n\t\t\t\t\t\t<svg cdsIcon=\"download\" size=\"16\" class=\"cds--btn__icon\"></svg>\n\t\t\t\t\t</button>\n\t\t\t\t</cds-table-toolbar-actions>\n\t\t\t\t<cds-table-toolbar-content *ngIf=\"!toolbar.selected\">\n\t\t\t\t\t<cds-table-toolbar-search [expandable]=\"true\"></cds-table-toolbar-search>\n\t\t\t\t\t<button cdsButton=\"ghost\" class=\"toolbar-action\">\n\t\t\t\t\t\t<svg cdsIcon=\"settings\" size=\"16\" class=\"cds--toolbar-action__icon\"></svg>\n\t\t\t\t\t</button>\n\t\t\t\t\t<button cdsButton=\"primary\" size=\"sm\">\n\t\t\t\t\t\tPrimary button<svg cdsIcon=\"add\" size=\"20\" class=\"cds--btn__icon\"></svg>\n\t\t\t\t\t</button>\n\t\t\t\t</cds-table-toolbar-content>\n\t\t\t</cds-table-toolbar>\n\t\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 found at:\n\t\t\thttps://github.com/IBM/carbon-components-angular/tree/master/src/table/stories/app-no-data-table.component.ts\n\t\t\t-->\n\t\t\t<app-no-data-table\n\t\t\t\t[model]=\"model\"\n\t\t\t\t[size]=\"lg\"\n\t\t\t\t[showSelectionColumn]=\"true\"\n\t\t\t\t[striped]=\"striped\"\n\t\t\t\t[sortable]=\"sortable\"\n\t\t\t\t[isDataGrid]=\"isDataGrid\">\n\t\t\t</app-no-data-table>\n\t\t</cds-table-container>\n\t`\n})"
                 },
                 {
-                    "name": "BeforeAndAfterTemplate",
+                    "name": "DyanmicContentTemplate",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
-                    "file": "src/tabs/tabs.stories.ts",
+                    "file": "src/table/table.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<div style=\"font-weight: 600; padding-bottom: 10px; padding-top: 20px;\">before</div>\n\t\t<cds-tabs [type]=\"type\" [followFocus]=\"followFocus\" [isNavigation]=\"isNavigation\">\n\t\t\t<cds-tab heading=\"one\">foo</cds-tab>\n\t\t\t<cds-tab heading=\"two\">bar</cds-tab>\n\t\t\t<span before>content before</span>\n\t\t</cds-tabs>\n\t\t<div style=\"font-weight: 600; padding-bottom: 10px; padding-top: 20px;\">after</div>\n\t\t<cds-tabs [type]=\"type\" [followFocus]=\"followFocus\" [isNavigation]=\"isNavigation\">\n\t\t\t<cds-tab heading=\"one\">foo</cds-tab>\n\t\t\t<cds-tab heading=\"two\">bar</cds-tab>\n\t\t\t<span after>content after</span>\n\t\t</cds-tabs>\n\t\t<div style=\"font-weight: 600; padding-bottom: 10px; padding-top: 20px;\">both</div>\n\t\t<cds-tabs [type]=\"type\" [followFocus]=\"followFocus\" [isNavigation]=\"isNavigation\">\n\t\t\t<cds-tab heading=\"one\">foo</cds-tab>\n\t\t\t<cds-tab heading=\"two\">bar</cds-tab>\n\t\t\t<span before>content before</span>\n\t\t\t<span after>content after</span>\n\t\t</cds-tabs>\n\t`\n})"
+                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-table-container>\n\t\t\t<cds-table-header>\n\t\t\t\t<h4 cdsTableHeaderTitle>{{title}}</h4>\n\t\t\t\t<p cdsTableHeaderDescription>{{description}}</p>\n\t\t\t</cds-table-header>\n\t\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 found at:\n\t\t\thttps://github.com/IBM/carbon-components-angular/tree/master/src/table/stories/app-custom-table.component.ts\n\t\t\t-->\n\t\t\t<app-custom-table\n\t\t\t\t[size]=\"size\"\n\t\t\t\t[showSelectionColumn]=\"showSelectionColumn\"\n\t\t\t\t[sortable]=\"sortable\"\n\t\t\t\t[stickyHeader]=\"stickyHeader\"\n\t\t\t\t[skeleton]=\"skeleton\"\n\t\t\t\t[striped]=\"striped\"\n\t\t\t\t[isDataGrid]=\"isDataGrid\">\n\t\t\t</app-custom-table>\n\t\t</cds-table-container>\n\t`\n})"
                 },
                 {
-                    "name": "Skeleton",
+                    "name": "emptyModel",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
-                    "file": "src/tabs/tabs.stories.ts",
+                    "file": "src/table/table.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "SkeletonTemplate.bind({})"
+                    "defaultValue": "new TableModel()"
                 },
                 {
-                    "name": "SkeletonTemplate",
+                    "name": "ExpansionTemplate",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
-                    "file": "src/tabs/tabs.stories.ts",
+                    "file": "src/table/table.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-tabs skeleton=\"true\">\n\t\t\t<cds-tab></cds-tab>\n\t\t\t<cds-tab></cds-tab>\n\t\t</cds-tabs>\n\n\t\t<div style=\"margin-top: 5rem\">\n\t\t\t<p>Tab skeleton component for cds-tab-header-group:</p>\n\t\t\t<cds-tabs-skeleton></cds-tabs-skeleton>\n\t\t</div>\n\t`\n})"
+                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-table-container>\n\t\t\t<cds-table-header>\n\t\t\t\t<h4 cdsTableHeaderTitle>{{title}}</h4>\n\t\t\t\t<p cdsTableHeaderDescription>{{description}}</p>\n\t\t\t</cds-table-header>\n\t\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 found at:\n\t\t\thttps://github.com/IBM/carbon-components-angular/tree/master/src/table/stories/app-expansion-table.component.ts\n\t\t\t-->\n\t\t\t<app-expansion-table\n\t\t\t\t[size]=\"size\"\n\t\t\t\t[showSelectionColumn]=\"showSelectionColumn\"\n\t\t\t\t[sortable]=\"sortable\"\n\t\t\t\t[stickyHeader]=\"stickyHeader\"\n\t\t\t\t[skeleton]=\"skeleton\"\n\t\t\t\t[striped]=\"striped\"\n\t\t\t\t[isDataGrid]=\"isDataGrid\"\n\t\t\t\t[showExpandAllToggle]=\"showExpandAllToggle\">\n\t\t\t</app-expansion-table>\n\t\t</cds-table-container>\n\t`\n})"
                 },
                 {
-                    "name": "TabheaderGroup",
+                    "name": "Filtering",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
-                    "file": "src/tabs/tabs.stories.ts",
+                    "file": "src/table/table.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "TabHeaderGroupTemplate.bind({})"
+                    "defaultValue": "FilteringTemplate.bind({})"
                 },
                 {
-                    "name": "TabHeaderGroupTemplate",
+                    "name": "FilteringOverriding",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
-                    "file": "src/tabs/tabs.stories.ts",
+                    "file": "src/table/table.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<!--\n\t\tapp-* components are for demo purposes only.\n\t\tYou can create your own implementation by using the component source found at:\n\t\thttps://github.com/IBM/carbon-components-angular/tree/master/src/pagination/stories/pagination.component.ts\n\t\t-->\n\t\t<app-header-group\n\t\t\t[type]=\"type\"\n\t\t\t[followFocus]=\"followFocus\"\n\t\t\t[cacheActive]=\"cacheActive\"\n\t\t\t[isNavigation]=\"isNavigation\">\n\t\t</app-header-group>\n\t`\n})"
+                    "defaultValue": "FilteringOverridingTemplate.bind({})"
                 },
                 {
-                    "name": "Template",
+                    "name": "FilteringOverridingTemplate",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
-                    "file": "src/tabs/tabs.stories.ts",
+                    "file": "src/table/table.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-tabs\n\t\t\t[type]=\"type\"\n\t\t\t[followFocus]=\"followFocus\"\n\t\t\t[isNavigation]=\"isNavigation\"\n\t\t\t[cacheActive]=\"cacheActive\">\n\t\t\t<cds-tab heading=\"one\">Tab Content 1</cds-tab>\n\t\t\t<cds-tab heading=\"two\">Tab Content 2</cds-tab>\n\t\t\t<cds-tab heading=\"three\" [tabContent]=\"three\"></cds-tab>\n\t\t\t<cds-tab heading=\"four\" [tabContent]=\"four\"></cds-tab>\n\t\t</cds-tabs>\n\n\t\t<!-- Use templates if you would like to have lifecycle hooks called when cacheActive is false -->\n\t\t<ng-template #three>\n\t\t\tTab Content 3\n\t\t</ng-template>\n\n\t\t<ng-template #four>\n\t\t\tTab Content 4\n\t\t</ng-template>\n\t`\n})"
+                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<!--\n\t\tapp-* components are for demo purposes only.\n\t\tYou can create your own implementation by using the component source found at:\n\t\thttps://github.com/IBM/carbon-components-angular/tree/master/src/table/stories/app-function-override-filter-table.component.ts\n\t\t-->\n\t\t<app-function-override-filter-table\n\t\t\t[stickyHeader]=\"stickyHeader\"\n\t\t\t[size]=\"size\"\n\t\t\t[skeleton]=\"skeleton\"\n\t\t\t[showSelectionColumn]=\"showSelectionColumn\"\n\t\t\t[striped]=\"striped\"\n\t\t\t[isDataGrid]=\"isDataGrid\">\n\t\t</app-function-override-filter-table>\n\t`\n})"
                 },
                 {
-                    "name": "With",
+                    "name": "FilteringTemplate",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
-                    "file": "src/tabs/tabs.stories.ts",
+                    "file": "src/table/table.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "WithTemplate.bind({})"
+                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<!--\n\t\tapp-* components are for demo purposes only.\n\t\tYou can create your own implementation by using the component source found at:\n\t\thttps://github.com/IBM/carbon-components-angular/tree/master/src/table/stories/app-model-filter-table.component.ts\n\t\t-->\n\t\t<app-model-filter-table\n\t\t\t[stickyHeader]=\"stickyHeader\"\n\t\t\t[size]=\"size\"\n\t\t\t[skeleton]=\"skeleton\"\n\t\t\t[showSelectionColumn]=\"showSelectionColumn\"\n\t\t\t[striped]=\"striped\"\n\t\t\t[isDataGrid]=\"isDataGrid\">\n\t\t</app-model-filter-table>\n\t`\n})"
                 },
                 {
-                    "name": "WithTemplate",
+                    "name": "FromComponents",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
-                    "file": "src/tabs/tabs.stories.ts",
+                    "file": "src/table/table.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<ng-template #customTabs let-item>\n\t\t\t{{item ? item.name : \"wait for it\"}}\n\t\t</ng-template>\n\t\t<ng-template #iconTab>\n\t\t\t<div style=\"height: 14px;\">\n\t\t\t\tSomething custom\n\t\t\t\t<svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\n\t\t\t\tstyle=\"height: 14px; width: 14px; fill: #3d70b2;\">\n\t\t\t\t\t<path d=\"M8 14.5a6.5 6.5 0 1 0 0-13 6.5 6.5 0 0 0 0 13zM8 16A8 8 0 1 1 8 0a8 8 0 0 1 0 16z\"></path>\n\t\t\t\t\t<path d=\"M9 13H7V7h2z\"></path>\n\t\t\t\t\t<path d=\"M7 4a1 1 0 1 1 2 0 1 1 0 1 1-2 0\"></path>\n\t\t\t\t</svg>\n\t\t\t</div>\n\t\t</ng-template>\n\t\t<cds-tabs [type]=\"type\" [followFocus]=\"followFocus\" [isNavigation]=\"isNavigation\">\n\t\t\t<cds-tab\n\t\t\t\t*ngFor=\"let item of data; let i = index;\"\n\t\t\t\t[heading]=\"customTabs\"\n\t\t\t\ttitle=\"Tab Content\"\n\t\t\t\t[context]=\"item\">\n\t\t\t\tTab Content {{i + 1}}\n\t\t\t</cds-tab>\n\t\t\t<cds-tab [heading]=\"iconTab\" title=\"Custom tab content\">Tab Content Custom</cds-tab>\n\t\t</cds-tabs>\n\t`\n})"
-                }
-            ],
-            "src/tag/tag.stories.ts": [
+                    "defaultValue": "FromComponentsTemplate.bind({})"
+                },
                 {
-                    "name": "Basic",
+                    "name": "FromComponentsTemplate",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
-                    "file": "src/tag/tag.stories.ts",
+                    "file": "src/table/table.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "Template.bind({})"
+                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<table cdsTable [sortable]=\"false\">\n\t\t\t<thead cdsTableHead>\n\t\t\t\t<tr>\n\t\t\t\t\t<th\n\t\t\t\t\t\tscope=\"col\"\n\t\t\t\t\t\tcdsTableHeadCell\n\t\t\t\t\t\t*ngFor=\"let column of model.header\"\n\t\t\t\t\t\t[column]=\"column\">\n\t\t\t\t\t</th>\n\t\t\t\t</tr>\n\t\t\t</thead>\n\t\t\t<tbody cdsTableBody>\n\t\t\t\t<tr\n\t\t\t\t\t*ngFor=\"let row of model.data\"\n\t\t\t\t\tcdsTableRow\n\t\t\t\t\t[row]=\"row\">\n\t\t\t\t\t<td\n\t\t\t\t\t\t*ngFor=\"let item of row; let j = index\"\n\t\t\t\t\t\tcdsTableData\n\t\t\t\t\t\t[item]=\"item\"\n\t\t\t\t\t\t[class]=\"model.header[j].className\"\n\t\t\t\t\t\t[ngStyle]=\"model.header[j].style\">\n\t\t\t\t\t</td>\n\t\t\t\t</tr>\n\t\t\t</tbody>\n\t\t</table>\n\t`\n})"
                 },
                 {
-                    "name": "Filter",
+                    "name": "getProps",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
-                    "file": "src/tag/tag.stories.ts",
+                    "file": "src/table/table.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "FilteredTemplate.bind({})"
+                    "defaultValue": "(more = {}, type: \"args\" | \"argTypes\") => {\n\tconst defaultProps = type === \"args\" ? {\n\t\tmodel: simpleModel,\n\t\ttitle: \"Table title\",\n\t\tdescription: \"\",\n\t\tsize: \"md\",\n\t\tshowSelectionColumn: true,\n\t\tstriped: false,\n\t\tsortable: true,\n\t\tisDataGrid: true,\n\t\tstickyHeader: false,\n\t\tskeleton: false\n\t} : {\n\t\tsize: {\n\t\t\toptions: [\"xs\", \"sm\", \"md\", \"lg\", \"xl\"],\n\t\t\tcontrol: \"select\"\n\t\t}\n\t};\n\treturn { ...defaultProps, ...more };\n}"
                 },
                 {
-                    "name": "FilteredTemplate",
+                    "name": "NoDataTemplate",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
-                    "file": "src/tag/tag.stories.ts",
+                    "file": "src/table/table.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-tag-filter\n\t\t\t[type]=\"type\"\n\t\t\t[size]=\"size\"\n\t\t\ttitle=\"Filter\"\n\t\t\tcloseButtonLabel=\"Clear\">\n\t\t\tfilter\n\t\t</cds-tag-filter>\n\t`\n})"
+                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-table-container>\n\t\t\t<cds-table-header>\n\t\t\t\t<h4 cdsTableHeaderTitle id=\"table-header\">{{title}}</h4>\n\t\t\t\t<p cdsTableHeaderDescription id=\"table-description\">{{description}}</p>\n\t\t\t</cds-table-header>\n\n\t\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 found at:\n\t\t\thttps://github.com/IBM/carbon-components-angular/tree/master/src/table/stories/app-no-data.component.ts\n\t\t\t-->\n\t\t\t<app-no-data-table\n\t\t\t\t[model]=\"model\"\n\t\t\t\t[size]=\"size\"\n\t\t\t\t[skeleton]=\"skeleton\"\n\t\t\t\t[showSelectionColumn]=\"showSelectionColumn\"\n\t\t\t\t[striped]=\"striped\"\n\t\t\t\tariaLabelledby=\"table-header\"\n\t\t\t\tariaDescribedby=\"table-description\">\n\t\t\t\t<tbody><tr><td class=\"no-data\" colspan=\"3\"><div>No data.</div></td></tr></tbody>\n\t\t\t</app-no-data-table>\n\t\t</cds-table-container>\n\t`,\n\tstyles: [`\n\t\t.no-data {\n\t\t\twidth: 100%;\n\t\t\theight: 150px;\n\t\t\ttext-align: center;\n\t\t}\n\t`]\n})"
                 },
                 {
-                    "name": "Template",
+                    "name": "OverflowMenuTemplate",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
-                    "file": "src/tag/tag.stories.ts",
+                    "file": "src/table/table.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-tag [type]=\"type\" [size]=\"size\">Tag</cds-tag>\n\t`\n})"
-                }
-            ],
-            "src/table/table.stories.ts": [
+                    "defaultValue": "(args) => ({\n\tprops: {\n\t\t...getProps({\n\t\t\tdescription: \"With overflow menu\"\n\t\t}, \"args\")\n\t},\n\ttemplate: `\n\t\t<cds-table-container>\n\t\t\t<cds-table-header>\n\t\t\t\t<h4 cdsTableHeaderTitle>{{title}}</h4>\n\t\t\t\t<p cdsTableHeaderDescription>{{description}}</p>\n\t\t\t</cds-table-header>\n\t\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 found at:\n\t\t\thttps://github.com/IBM/carbon-components-angular/tree/master/src/table/stories/app-overflow-table.component.ts\n\t\t\t-->\n\t\t\t<app-overflow-table\n\t\t\t\t[size]=\"size\"\n\t\t\t\t[showSelectionColumn]=\"showSelectionColumn\"\n\t\t\t\t[sortable]=\"sortable\"\n\t\t\t\t[stickyHeader]=\"stickyHeader\"\n\t\t\t\t[skeleton]=\"skeleton\"\n\t\t\t\t[striped]=\"striped\"\n\t\t\t\t[isDataGrid]=\"isDataGrid\">\n\t\t\t</app-overflow-table>\n\t\t</cds-table-container>\n\t`\n})"
+                },
                 {
-                    "name": "Basic",
+                    "name": "PaginationTemplate",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
                     "file": "src/table/table.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "Template.bind({})"
+                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-table-container>\n\t\t\t<cds-table-header>\n\t\t\t\t<h4 cdsTableHeaderTitle>{{title}}</h4>\n\t\t\t\t<p cdsTableHeaderDescription>{{description}}</p>\n\t\t\t</cds-table-header>\n\t\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 found at:\n\t\t\thttps://github.com/IBM/carbon-components-angular/tree/master/src/table/stories/app-pagination-table.component.ts\n\t\t\t-->\n\t\t\t<app-pagination-table\n\t\t\t\t[skeleton]=\"skeleton\"\n\t\t\t\t[sortable]=\"sortable\"\n\t\t\t\t[totalDataLength]=\"totalDataLength\"\n\t\t\t\t[showSelectionColumn]=\"showSelectionColumn\"\n\t\t\t\t[stickyHeader]=\"stickyHeader\"\n\t\t\t\t[skeleton]=\"skeleton\"\n\t\t\t\t[model]=\"model\">\n\t\t\t</app-pagination-table>\n\t\t</cds-table-container>\n\t`\n})"
                 },
                 {
-                    "name": "DisabledRowsTemplate",
+                    "name": "simpleModel",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
                     "file": "src/table/table.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-table-container>\n\t\t\t<cds-table-header>\n\t\t\t\t<h4 cdsTableHeaderTitle>{{title}}</h4>\n\t\t\t\t<p cdsTableHeaderDescription>{{description}}</p>\n\t\t\t</cds-table-header>\n\t\t\t<cds-table-toolbar [model]=\"model\" [batchText]=\"batchText\" #toolbar>\n\t\t\t\t<cds-table-toolbar-actions>\n\t\t\t\t\t<button cdsButton=\"primary\">\n\t\t\t\t\t\tDelete\n\t\t\t\t\t\t<svg cdsIcon=\"delete\" size=\"16\" class=\"cds--btn__icon\"></svg>\n\t\t\t\t\t</button>\n\t\t\t\t\t<button cdsButton=\"primary\">\n\t\t\t\t\t\tSave\n\t\t\t\t\t\t<svg cdsIcon=\"save\" size=\"16\" class=\"cds--btn__icon\"></svg>\n\t\t\t\t\t</button>\n\t\t\t\t\t<button cdsButton=\"primary\">\n\t\t\t\t\t\tDownload\n\t\t\t\t\t\t<svg cdsIcon=\"download\" size=\"16\" class=\"cds--btn__icon\"></svg>\n\t\t\t\t\t</button>\n\t\t\t\t</cds-table-toolbar-actions>\n\t\t\t\t<cds-table-toolbar-content *ngIf=\"!toolbar.selected\">\n\t\t\t\t\t<cds-table-toolbar-search [expandable]=\"true\"></cds-table-toolbar-search>\n\t\t\t\t\t<button cdsButton=\"ghost\" class=\"toolbar-action\">\n\t\t\t\t\t\t<svg cdsIcon=\"settings\" size=\"16\" class=\"cds--toolbar-action__icon\"></svg>\n\t\t\t\t\t</button>\n\t\t\t\t\t<button cdsButton=\"primary\" size=\"sm\">\n\t\t\t\t\t\tPrimary button<svg cdsIcon=\"add\" size=\"20\" class=\"cds--btn__icon\"></svg>\n\t\t\t\t\t</button>\n\t\t\t\t</cds-table-toolbar-content>\n\t\t\t</cds-table-toolbar>\n\t\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 found at:\n\t\t\thttps://github.com/IBM/carbon-components-angular/tree/master/src/table/stories/app-no-data-table.component.ts\n\t\t\t-->\n\t\t\t<app-no-data-table\n\t\t\t\t[model]=\"model\"\n\t\t\t\t[size]=\"lg\"\n\t\t\t\t[showSelectionColumn]=\"true\"\n\t\t\t\t[striped]=\"striped\"\n\t\t\t\t[sortable]=\"sortable\"\n\t\t\t\t[isDataGrid]=\"isDataGrid\">\n\t\t\t</app-no-data-table>\n\t\t</cds-table-container>\n\t`\n})"
+                    "defaultValue": "new TableModel()"
                 },
                 {
-                    "name": "DyanmicContentTemplate",
+                    "name": "Skeleton",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
                     "file": "src/table/table.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-table-container>\n\t\t\t<cds-table-header>\n\t\t\t\t<h4 cdsTableHeaderTitle>{{title}}</h4>\n\t\t\t\t<p cdsTableHeaderDescription>{{description}}</p>\n\t\t\t</cds-table-header>\n\t\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 found at:\n\t\t\thttps://github.com/IBM/carbon-components-angular/tree/master/src/table/stories/app-custom-table.component.ts\n\t\t\t-->\n\t\t\t<app-custom-table\n\t\t\t\t[size]=\"size\"\n\t\t\t\t[showSelectionColumn]=\"showSelectionColumn\"\n\t\t\t\t[sortable]=\"sortable\"\n\t\t\t\t[stickyHeader]=\"stickyHeader\"\n\t\t\t\t[skeleton]=\"skeleton\"\n\t\t\t\t[striped]=\"striped\"\n\t\t\t\t[isDataGrid]=\"isDataGrid\">\n\t\t\t</app-custom-table>\n\t\t</cds-table-container>\n\t`\n})"
+                    "defaultValue": "SkeletonTemplate.bind({})"
                 },
                 {
-                    "name": "emptyModel",
+                    "name": "SkeletonTemplate",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
                     "file": "src/table/table.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "new TableModel()"
+                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<!--\n\t\tapp-* components are for demo purposes only.\n\t\tYou can create your own implementation by using the component source found at:\n\t\thttps://github.com/IBM/carbon-components-angular/tree/master/src/table/stories/app-skeleton-table.component.ts\n\t\t-->\n\t\t<app-skeleton-table\n\t\t\t[skeletonModel]=\"skeletonModel\"\n\t\t\t[size]=\"size\"\n\t\t\t[striped]=\"striped\">\n\t\t</app-skeleton-table>\n\t`\n})"
                 },
                 {
-                    "name": "ExpansionTemplate",
+                    "name": "Template",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
                     "file": "src/table/table.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-table-container>\n\t\t\t<cds-table-header>\n\t\t\t\t<h4 cdsTableHeaderTitle>{{title}}</h4>\n\t\t\t\t<p cdsTableHeaderDescription>{{description}}</p>\n\t\t\t</cds-table-header>\n\t\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 found at:\n\t\t\thttps://github.com/IBM/carbon-components-angular/tree/master/src/table/stories/app-expansion-table.component.ts\n\t\t\t-->\n\t\t\t<app-expansion-table\n\t\t\t\t[size]=\"size\"\n\t\t\t\t[showSelectionColumn]=\"showSelectionColumn\"\n\t\t\t\t[sortable]=\"sortable\"\n\t\t\t\t[stickyHeader]=\"stickyHeader\"\n\t\t\t\t[skeleton]=\"skeleton\"\n\t\t\t\t[striped]=\"striped\"\n\t\t\t\t[isDataGrid]=\"isDataGrid\"\n\t\t\t\t[showExpandAllToggle]=\"showExpandAllToggle\">\n\t\t\t</app-expansion-table>\n\t\t</cds-table-container>\n\t`\n})"
+                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-table-container>\n\t\t\t<cds-table-header>\n\t\t\t\t<h4 cdsTableHeaderTitle>{{title}}</h4>\n\t\t\t\t<p cdsTableHeaderDescription>{{description}}</p>\n\t\t\t</cds-table-header>\n\n\t\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 found at:\n\t\t\thttps://github.com/IBM/carbon-components-angular/tree/master/src/table/stories/app-table.component.ts\n\t\t\t-->\n\t\t\t<app-table\n\t\t\t\t[model]=\"model\"\n\t\t\t\t[stickyHeader]=\"stickyHeader\"\n\t\t\t\t[size]=\"size\"\n\t\t\t\t[skeleton]=\"skeleton\"\n\t\t\t\t[enableSingleSelect]=\"enableSingleSelect\"\n\t\t\t\t[showSelectionColumn]=\"showSelectionColumn\"\n\t\t\t\t[striped]=\"striped\"\n\t\t\t\t[sortable]=\"sortable\"\n\t\t\t\t[isDataGrid]=\"isDataGrid\">\n\t\t\t</app-table>\n\t\t</cds-table-container>\n\t`\n})"
                 },
                 {
-                    "name": "Filtering",
+                    "name": "ToolbarTemplate",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
                     "file": "src/table/table.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "FilteringTemplate.bind({})"
+                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-table-container>\n\t\t\t<cds-table-header>\n\t\t\t\t<h4 cdsTableHeaderTitle>{{title}}</h4>\n\t\t\t\t<p cdsTableHeaderDescription>{{description}}</p>\n\t\t\t</cds-table-header>\n\t\t\t<cds-table-toolbar\n\t\t\t\t[model]=\"model\"\n\t\t\t\t[batchText]=\"batchText\"\n\t\t\t\t[size]=\"size\"\n\t\t\t\t(cancel)=\"cancelMethod()\"\n\t\t\t\t#toolbar>\n\t\t\t\t<cds-table-toolbar-actions>\n\t\t\t\t\t<button cdsButton=\"primary\" [tabindex]=\"toolbar.selected ? 0 : -1\">\n\t\t\t\t\t\tDelete\n\t\t\t\t\t\t<svg cdsIcon=\"trash-can\" size=\"16\" class=\"cds--btn__icon\"></svg>\n\t\t\t\t\t</button>\n\t\t\t\t\t<button cdsButton=\"primary\" [tabindex]=\"toolbar.selected ? 0 : -1\">\n\t\t\t\t\t\tSave\n\t\t\t\t\t\t<svg cdsIcon=\"save\" size=\"16\" class=\"cds--btn__icon\"></svg>\n\t\t\t\t\t</button>\n\t\t\t\t\t<button cdsButton=\"primary\" [tabindex]=\"toolbar.selected ? 0 : -1\">\n\t\t\t\t\t\tDownload\n\t\t\t\t\t\t<svg cdsIcon=\"download\" size=\"16\" class=\"cds--btn__icon\"></svg>\n\t\t\t\t\t</button>\n\t\t\t\t</cds-table-toolbar-actions>\n\t\t\t\t<cds-table-toolbar-content *ngIf=\"!toolbar.selected\">\n\t\t\t\t\t<cds-table-toolbar-search\n\t\t\t\t\t\tngDefaultControl\n\t\t\t\t\t\t[expandable]=\"searchExpandable\"\n\t\t\t\t\t\t[(ngModel)]=\"searchModel\">\n\t\t\t\t\t</cds-table-toolbar-search>\n\t\t\t\t\t<cds-overflow-menu\n\t\t\t\t\t\ttriggerClass=\"cds--toolbar-action\"\n\t\t\t\t\t\t[customTrigger]=\"customTrigger\"\n\t\t\t\t\t\tplacement=\"bottom\"\n\t\t\t\t\t\t[offset]=\"size === 'sm' ? null : offset\">\n\t\t\t\t\t\t<cds-overflow-menu-option>Option 1</cds-overflow-menu-option>\n\t\t\t\t\t\t<cds-overflow-menu-option>Option 2</cds-overflow-menu-option>\n\t\t\t\t\t\t<cds-overflow-menu-option disabled=\"true\">Disabled</cds-overflow-menu-option>\n\t\t\t\t\t\t<cds-overflow-menu-option type=\"danger\">Danger option</cds-overflow-menu-option>\n\t\t\t\t\t</cds-overflow-menu>\n\t\t\t\t\t<button cdsButton=\"primary\" size=\"sm\" [tabindex]=\"toolbar.selected ? -1 : 0\">\n\t\t\t\t\t\tPrimary button<svg cdsIcon=\"add\" size=\"20\" class=\"cds--btn__icon\"></svg>\n\t\t\t\t\t</button>\n\t\t\t\t</cds-table-toolbar-content>\n\t\t\t</cds-table-toolbar>\n\t\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 found at:\n\t\t\thttps://github.com/IBM/carbon-components-angular/tree/master/src/table/stories/app-table.component.ts\n\t\t\t-->\n\t\t\t<app-table\n\t\t\t\t[model]=\"model\"\n\t\t\t\t[size]=\"size\"\n\t\t\t\t[showSelectionColumn]=\"showSelectionColumn\"\n\t\t\t\t[enableSingleSelect]=\"enableSingleSelect\"\n\t\t\t\t[striped]=\"striped\"\n\t\t\t\t[sortable]=\"sortable\"\n\t\t\t\t[skeleton]=\"skeleton\"\n\t\t\t\t[stickyHeader]=\"stickyHeader\"\n\t\t\t\t[isDataGrid]=\"isDataGrid\">\n\t\t\t</app-table>\n\t\t\t<ng-template #customTrigger><svg cdsIcon=\"settings\" size=\"16\"></svg></ng-template>\n\t\t</cds-table-container>\n\t`\n})"
                 },
                 {
-                    "name": "FilteringOverriding",
+                    "name": "WithDisabledRows",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
                     "file": "src/table/table.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "FilteringOverridingTemplate.bind({})"
+                    "defaultValue": "DisabledRowsTemplate.bind({})"
                 },
                 {
-                    "name": "FilteringOverridingTemplate",
+                    "name": "WithDynamicContent",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
                     "file": "src/table/table.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<!--\n\t\tapp-* components are for demo purposes only.\n\t\tYou can create your own implementation by using the component source found at:\n\t\thttps://github.com/IBM/carbon-components-angular/tree/master/src/table/stories/app-function-override-filter-table.component.ts\n\t\t-->\n\t\t<app-function-override-filter-table\n\t\t\t[stickyHeader]=\"stickyHeader\"\n\t\t\t[size]=\"size\"\n\t\t\t[skeleton]=\"skeleton\"\n\t\t\t[showSelectionColumn]=\"showSelectionColumn\"\n\t\t\t[striped]=\"striped\"\n\t\t\t[isDataGrid]=\"isDataGrid\">\n\t\t</app-function-override-filter-table>\n\t`\n})"
+                    "defaultValue": "DyanmicContentTemplate.bind({})"
                 },
                 {
-                    "name": "FilteringTemplate",
+                    "name": "WithExpansion",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
                     "file": "src/table/table.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<!--\n\t\tapp-* components are for demo purposes only.\n\t\tYou can create your own implementation by using the component source found at:\n\t\thttps://github.com/IBM/carbon-components-angular/tree/master/src/table/stories/app-model-filter-table.component.ts\n\t\t-->\n\t\t<app-model-filter-table\n\t\t\t[stickyHeader]=\"stickyHeader\"\n\t\t\t[size]=\"size\"\n\t\t\t[skeleton]=\"skeleton\"\n\t\t\t[showSelectionColumn]=\"showSelectionColumn\"\n\t\t\t[striped]=\"striped\"\n\t\t\t[isDataGrid]=\"isDataGrid\">\n\t\t</app-model-filter-table>\n\t`\n})"
+                    "defaultValue": "ExpansionTemplate.bind({})"
                 },
                 {
-                    "name": "FromComponents",
+                    "name": "WithoutActionTemplate",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
                     "file": "src/table/table.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "FromComponentsTemplate.bind({})"
+                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-table-container>\n\t\t\t<cds-table-header>\n\t\t\t\t<h4 cdsTableHeaderTitle id=\"table-header\">{{title}}</h4>\n\t\t\t\t<p cdsTableHeaderDescription id=\"table-description\">{{description}}</p>\n\t\t\t</cds-table-header>\n\t\t\t<cds-table-toolbar>\n\t\t\t\t<cds-table-toolbar-content>\n\t\t\t\t\t<cds-table-toolbar-search [expandable]=\"true\"></cds-table-toolbar-search>\n\t\t\t\t\t<button cdsButton=\"ghost\" class=\"toolbar-action\">\n\t\t\t\t\t\t<svg cdsIcon=\"settings\" size=\"16\" class=\"cds--toolbar-action__icon\"></svg>\n\t\t\t\t\t</button>\n\t\t\t\t\t<button cdsButton=\"primary\" size=\"sm\">\n\t\t\t\t\t\tPrimary button<svg cdsIcon=\"add\" size=\"20\" class=\"cds--btn__icon\"></svg>\n\t\t\t\t\t</button>\n\t\t\t\t</cds-table-toolbar-content>\n\t\t\t</cds-table-toolbar>\n\n\t\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 found at:\n\t\t\thttps://github.com/IBM/carbon-components-angular/tree/master/src/table/stories/app-table.component.ts\n\t\t\t-->\n\t\t\t<app-table\n\t\t\t\t[model]=\"model\"\n\t\t\t\t[size]=\"size\"\n\t\t\t\t[showSelectionColumn]=\"showSelectionColumn\"\n\t\t\t\t[enableSingleSelect]=\"enableSingleSelect\"\n\t\t\t\t[stickyHeader]=\"stickyHeader\"\n\t\t\t\t[skeleton]=\"skeleton\"\n\t\t\t\t[striped]=\"striped\"\n\t\t\t\t[sortable]=\"sortable\"\n\t\t\t\t[isDataGrid]=\"isDataGrid\"\n\t\t\t\tariaLabelledby=\"table-header\"\n\t\t\t\tariaDescribedby=\"table-description\">\n\t\t\t</app-table>\n\t\t</cds-table-container>\n\t`\n})"
                 },
                 {
-                    "name": "FromComponentsTemplate",
+                    "name": "WithoutData",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
                     "file": "src/table/table.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<table cdsTable [sortable]=\"false\">\n\t\t\t<thead cdsTableHead>\n\t\t\t\t<tr>\n\t\t\t\t\t<th\n\t\t\t\t\t\tscope=\"col\"\n\t\t\t\t\t\tcdsTableHeadCell\n\t\t\t\t\t\t*ngFor=\"let column of model.header\"\n\t\t\t\t\t\t[column]=\"column\">\n\t\t\t\t\t</th>\n\t\t\t\t</tr>\n\t\t\t</thead>\n\t\t\t<tbody cdsTableBody>\n\t\t\t\t<tr\n\t\t\t\t\t*ngFor=\"let row of model.data\"\n\t\t\t\t\tcdsTableRow\n\t\t\t\t\t[row]=\"row\">\n\t\t\t\t\t<td\n\t\t\t\t\t\t*ngFor=\"let item of row; let j = index\"\n\t\t\t\t\t\tcdsTableData\n\t\t\t\t\t\t[item]=\"item\"\n\t\t\t\t\t\t[class]=\"model.header[j].className\"\n\t\t\t\t\t\t[ngStyle]=\"model.header[j].style\">\n\t\t\t\t\t</td>\n\t\t\t\t</tr>\n\t\t\t</tbody>\n\t\t</table>\n\t`\n})"
+                    "defaultValue": "NoDataTemplate.bind({})"
                 },
                 {
-                    "name": "getProps",
+                    "name": "WithOverflowMenu",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
                     "file": "src/table/table.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "(more = {}, type: \"args\" | \"argTypes\") => {\n\tconst defaultProps = type === \"args\" ? {\n\t\tmodel: simpleModel,\n\t\ttitle: \"Table title\",\n\t\tdescription: \"\",\n\t\tsize: \"md\",\n\t\tshowSelectionColumn: true,\n\t\tstriped: false,\n\t\tsortable: true,\n\t\tisDataGrid: true,\n\t\tstickyHeader: false,\n\t\tskeleton: false\n\t} : {\n\t\tsize: {\n\t\t\toptions: [\"xs\", \"sm\", \"md\", \"lg\", \"xl\"],\n\t\t\tcontrol: \"select\"\n\t\t}\n\t};\n\treturn { ...defaultProps, ...more };\n}"
+                    "defaultValue": "OverflowMenuTemplate.bind({})"
                 },
                 {
-                    "name": "NoDataTemplate",
+                    "name": "WithPagination",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
                     "file": "src/table/table.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-table-container>\n\t\t\t<cds-table-header>\n\t\t\t\t<h4 cdsTableHeaderTitle id=\"table-header\">{{title}}</h4>\n\t\t\t\t<p cdsTableHeaderDescription id=\"table-description\">{{description}}</p>\n\t\t\t</cds-table-header>\n\n\t\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 found at:\n\t\t\thttps://github.com/IBM/carbon-components-angular/tree/master/src/table/stories/app-no-data.component.ts\n\t\t\t-->\n\t\t\t<app-no-data-table\n\t\t\t\t[model]=\"model\"\n\t\t\t\t[size]=\"size\"\n\t\t\t\t[skeleton]=\"skeleton\"\n\t\t\t\t[showSelectionColumn]=\"showSelectionColumn\"\n\t\t\t\t[striped]=\"striped\"\n\t\t\t\tariaLabelledby=\"table-header\"\n\t\t\t\tariaDescribedby=\"table-description\">\n\t\t\t\t<tbody><tr><td class=\"no-data\" colspan=\"3\"><div>No data.</div></td></tr></tbody>\n\t\t\t</app-no-data-table>\n\t\t</cds-table-container>\n\t`,\n\tstyles: [`\n\t\t.no-data {\n\t\t\twidth: 100%;\n\t\t\theight: 150px;\n\t\t\ttext-align: center;\n\t\t}\n\t`]\n})"
+                    "defaultValue": "PaginationTemplate.bind({})"
                 },
                 {
-                    "name": "OverflowMenuTemplate",
+                    "name": "WithToolbar",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
                     "file": "src/table/table.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "(args) => ({\n\tprops: {\n\t\t...getProps({\n\t\t\tdescription: \"With overflow menu\"\n\t\t}, \"args\")\n\t},\n\ttemplate: `\n\t\t<cds-table-container>\n\t\t\t<cds-table-header>\n\t\t\t\t<h4 cdsTableHeaderTitle>{{title}}</h4>\n\t\t\t\t<p cdsTableHeaderDescription>{{description}}</p>\n\t\t\t</cds-table-header>\n\t\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 found at:\n\t\t\thttps://github.com/IBM/carbon-components-angular/tree/master/src/table/stories/app-overflow-table.component.ts\n\t\t\t-->\n\t\t\t<app-overflow-table\n\t\t\t\t[size]=\"size\"\n\t\t\t\t[showSelectionColumn]=\"showSelectionColumn\"\n\t\t\t\t[sortable]=\"sortable\"\n\t\t\t\t[stickyHeader]=\"stickyHeader\"\n\t\t\t\t[skeleton]=\"skeleton\"\n\t\t\t\t[striped]=\"striped\"\n\t\t\t\t[isDataGrid]=\"isDataGrid\">\n\t\t\t</app-overflow-table>\n\t\t</cds-table-container>\n\t`\n})"
+                    "defaultValue": "ToolbarTemplate.bind({})"
                 },
                 {
-                    "name": "PaginationTemplate",
+                    "name": "WithToolbarWithoutToolbarAction",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
                     "file": "src/table/table.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-table-container>\n\t\t\t<cds-table-header>\n\t\t\t\t<h4 cdsTableHeaderTitle>{{title}}</h4>\n\t\t\t\t<p cdsTableHeaderDescription>{{description}}</p>\n\t\t\t</cds-table-header>\n\t\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 found at:\n\t\t\thttps://github.com/IBM/carbon-components-angular/tree/master/src/table/stories/app-pagination-table.component.ts\n\t\t\t-->\n\t\t\t<app-pagination-table\n\t\t\t\t[skeleton]=\"skeleton\"\n\t\t\t\t[sortable]=\"sortable\"\n\t\t\t\t[totalDataLength]=\"totalDataLength\"\n\t\t\t\t[showSelectionColumn]=\"showSelectionColumn\"\n\t\t\t\t[stickyHeader]=\"stickyHeader\"\n\t\t\t\t[skeleton]=\"skeleton\"\n\t\t\t\t[model]=\"model\">\n\t\t\t</app-pagination-table>\n\t\t</cds-table-container>\n\t`\n})"
-                },
+                    "defaultValue": "WithoutActionTemplate.bind({})"
+                }
+            ],
+            "src/tabs/tabs.stories.ts": [
                 {
-                    "name": "simpleModel",
+                    "name": "Basic",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
-                    "file": "src/table/table.stories.ts",
+                    "file": "src/tabs/tabs.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "new TableModel()"
+                    "defaultValue": "Template.bind({})"
                 },
                 {
-                    "name": "Skeleton",
+                    "name": "BeforeAndAfter",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
-                    "file": "src/table/table.stories.ts",
+                    "file": "src/tabs/tabs.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "SkeletonTemplate.bind({})"
+                    "defaultValue": "BeforeAndAfterTemplate.bind({})"
                 },
                 {
-                    "name": "SkeletonTemplate",
+                    "name": "BeforeAndAfterTemplate",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
-                    "file": "src/table/table.stories.ts",
+                    "file": "src/tabs/tabs.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<!--\n\t\tapp-* components are for demo purposes only.\n\t\tYou can create your own implementation by using the component source found at:\n\t\thttps://github.com/IBM/carbon-components-angular/tree/master/src/table/stories/app-skeleton-table.component.ts\n\t\t-->\n\t\t<app-skeleton-table\n\t\t\t[skeletonModel]=\"skeletonModel\"\n\t\t\t[size]=\"size\"\n\t\t\t[striped]=\"striped\">\n\t\t</app-skeleton-table>\n\t`\n})"
+                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<div style=\"font-weight: 600; padding-bottom: 10px; padding-top: 20px;\">before</div>\n\t\t<cds-tabs [type]=\"type\" [followFocus]=\"followFocus\" [isNavigation]=\"isNavigation\">\n\t\t\t<cds-tab heading=\"one\">foo</cds-tab>\n\t\t\t<cds-tab heading=\"two\">bar</cds-tab>\n\t\t\t<span before>content before</span>\n\t\t</cds-tabs>\n\t\t<div style=\"font-weight: 600; padding-bottom: 10px; padding-top: 20px;\">after</div>\n\t\t<cds-tabs [type]=\"type\" [followFocus]=\"followFocus\" [isNavigation]=\"isNavigation\">\n\t\t\t<cds-tab heading=\"one\">foo</cds-tab>\n\t\t\t<cds-tab heading=\"two\">bar</cds-tab>\n\t\t\t<span after>content after</span>\n\t\t</cds-tabs>\n\t\t<div style=\"font-weight: 600; padding-bottom: 10px; padding-top: 20px;\">both</div>\n\t\t<cds-tabs [type]=\"type\" [followFocus]=\"followFocus\" [isNavigation]=\"isNavigation\">\n\t\t\t<cds-tab heading=\"one\">foo</cds-tab>\n\t\t\t<cds-tab heading=\"two\">bar</cds-tab>\n\t\t\t<span before>content before</span>\n\t\t\t<span after>content after</span>\n\t\t</cds-tabs>\n\t`\n})"
                 },
                 {
-                    "name": "Template",
+                    "name": "Skeleton",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
-                    "file": "src/table/table.stories.ts",
+                    "file": "src/tabs/tabs.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-table-container>\n\t\t\t<cds-table-header>\n\t\t\t\t<h4 cdsTableHeaderTitle>{{title}}</h4>\n\t\t\t\t<p cdsTableHeaderDescription>{{description}}</p>\n\t\t\t</cds-table-header>\n\n\t\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 found at:\n\t\t\thttps://github.com/IBM/carbon-components-angular/tree/master/src/table/stories/app-table.component.ts\n\t\t\t-->\n\t\t\t<app-table\n\t\t\t\t[model]=\"model\"\n\t\t\t\t[stickyHeader]=\"stickyHeader\"\n\t\t\t\t[size]=\"size\"\n\t\t\t\t[skeleton]=\"skeleton\"\n\t\t\t\t[enableSingleSelect]=\"enableSingleSelect\"\n\t\t\t\t[showSelectionColumn]=\"showSelectionColumn\"\n\t\t\t\t[striped]=\"striped\"\n\t\t\t\t[sortable]=\"sortable\"\n\t\t\t\t[isDataGrid]=\"isDataGrid\">\n\t\t\t</app-table>\n\t\t</cds-table-container>\n\t`\n})"
+                    "defaultValue": "SkeletonTemplate.bind({})"
                 },
                 {
-                    "name": "ToolbarTemplate",
+                    "name": "SkeletonTemplate",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
-                    "file": "src/table/table.stories.ts",
+                    "file": "src/tabs/tabs.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-table-container>\n\t\t\t<cds-table-header>\n\t\t\t\t<h4 cdsTableHeaderTitle>{{title}}</h4>\n\t\t\t\t<p cdsTableHeaderDescription>{{description}}</p>\n\t\t\t</cds-table-header>\n\t\t\t<cds-table-toolbar\n\t\t\t\t[model]=\"model\"\n\t\t\t\t[batchText]=\"batchText\"\n\t\t\t\t[size]=\"size\"\n\t\t\t\t(cancel)=\"cancelMethod()\"\n\t\t\t\t#toolbar>\n\t\t\t\t<cds-table-toolbar-actions>\n\t\t\t\t\t<button cdsButton=\"primary\" [tabindex]=\"toolbar.selected ? 0 : -1\">\n\t\t\t\t\t\tDelete\n\t\t\t\t\t\t<svg cdsIcon=\"trash-can\" size=\"16\" class=\"cds--btn__icon\"></svg>\n\t\t\t\t\t</button>\n\t\t\t\t\t<button cdsButton=\"primary\" [tabindex]=\"toolbar.selected ? 0 : -1\">\n\t\t\t\t\t\tSave\n\t\t\t\t\t\t<svg cdsIcon=\"save\" size=\"16\" class=\"cds--btn__icon\"></svg>\n\t\t\t\t\t</button>\n\t\t\t\t\t<button cdsButton=\"primary\" [tabindex]=\"toolbar.selected ? 0 : -1\">\n\t\t\t\t\t\tDownload\n\t\t\t\t\t\t<svg cdsIcon=\"download\" size=\"16\" class=\"cds--btn__icon\"></svg>\n\t\t\t\t\t</button>\n\t\t\t\t</cds-table-toolbar-actions>\n\t\t\t\t<cds-table-toolbar-content *ngIf=\"!toolbar.selected\">\n\t\t\t\t\t<cds-table-toolbar-search\n\t\t\t\t\t\tngDefaultControl\n\t\t\t\t\t\t[expandable]=\"searchExpandable\"\n\t\t\t\t\t\t[(ngModel)]=\"searchModel\">\n\t\t\t\t\t</cds-table-toolbar-search>\n\t\t\t\t\t<cds-overflow-menu\n\t\t\t\t\t\ttriggerClass=\"cds--toolbar-action\"\n\t\t\t\t\t\t[customTrigger]=\"customTrigger\"\n\t\t\t\t\t\tplacement=\"bottom\"\n\t\t\t\t\t\t[offset]=\"size === 'sm' ? null : offset\">\n\t\t\t\t\t\t<cds-overflow-menu-option>Option 1</cds-overflow-menu-option>\n\t\t\t\t\t\t<cds-overflow-menu-option>Option 2</cds-overflow-menu-option>\n\t\t\t\t\t\t<cds-overflow-menu-option disabled=\"true\">Disabled</cds-overflow-menu-option>\n\t\t\t\t\t\t<cds-overflow-menu-option type=\"danger\">Danger option</cds-overflow-menu-option>\n\t\t\t\t\t</cds-overflow-menu>\n\t\t\t\t\t<button cdsButton=\"primary\" size=\"sm\" [tabindex]=\"toolbar.selected ? -1 : 0\">\n\t\t\t\t\t\tPrimary button<svg cdsIcon=\"add\" size=\"20\" class=\"cds--btn__icon\"></svg>\n\t\t\t\t\t</button>\n\t\t\t\t</cds-table-toolbar-content>\n\t\t\t</cds-table-toolbar>\n\t\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 found at:\n\t\t\thttps://github.com/IBM/carbon-components-angular/tree/master/src/table/stories/app-table.component.ts\n\t\t\t-->\n\t\t\t<app-table\n\t\t\t\t[model]=\"model\"\n\t\t\t\t[size]=\"size\"\n\t\t\t\t[showSelectionColumn]=\"showSelectionColumn\"\n\t\t\t\t[enableSingleSelect]=\"enableSingleSelect\"\n\t\t\t\t[striped]=\"striped\"\n\t\t\t\t[sortable]=\"sortable\"\n\t\t\t\t[skeleton]=\"skeleton\"\n\t\t\t\t[stickyHeader]=\"stickyHeader\"\n\t\t\t\t[isDataGrid]=\"isDataGrid\">\n\t\t\t</app-table>\n\t\t\t<ng-template #customTrigger><svg cdsIcon=\"settings\" size=\"16\"></svg></ng-template>\n\t\t</cds-table-container>\n\t`\n})"
+                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-tabs skeleton=\"true\">\n\t\t\t<cds-tab></cds-tab>\n\t\t\t<cds-tab></cds-tab>\n\t\t</cds-tabs>\n\n\t\t<div style=\"margin-top: 5rem\">\n\t\t\t<p>Tab skeleton component for cds-tab-header-group:</p>\n\t\t\t<cds-tabs-skeleton></cds-tabs-skeleton>\n\t\t</div>\n\t`\n})"
                 },
                 {
-                    "name": "WithDisabledRows",
+                    "name": "TabheaderGroup",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
-                    "file": "src/table/table.stories.ts",
+                    "file": "src/tabs/tabs.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "DisabledRowsTemplate.bind({})"
+                    "defaultValue": "TabHeaderGroupTemplate.bind({})"
                 },
                 {
-                    "name": "WithDynamicContent",
+                    "name": "TabHeaderGroupTemplate",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
-                    "file": "src/table/table.stories.ts",
+                    "file": "src/tabs/tabs.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "DyanmicContentTemplate.bind({})"
+                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<!--\n\t\tapp-* components are for demo purposes only.\n\t\tYou can create your own implementation by using the component source found at:\n\t\thttps://github.com/IBM/carbon-components-angular/tree/master/src/pagination/stories/pagination.component.ts\n\t\t-->\n\t\t<app-header-group\n\t\t\t[type]=\"type\"\n\t\t\t[followFocus]=\"followFocus\"\n\t\t\t[cacheActive]=\"cacheActive\"\n\t\t\t[isNavigation]=\"isNavigation\">\n\t\t</app-header-group>\n\t`\n})"
                 },
                 {
-                    "name": "WithExpansion",
+                    "name": "Template",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
-                    "file": "src/table/table.stories.ts",
+                    "file": "src/tabs/tabs.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "ExpansionTemplate.bind({})"
+                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-tabs\n\t\t\t[type]=\"type\"\n\t\t\t[followFocus]=\"followFocus\"\n\t\t\t[isNavigation]=\"isNavigation\"\n\t\t\t[cacheActive]=\"cacheActive\">\n\t\t\t<cds-tab heading=\"one\">Tab Content 1</cds-tab>\n\t\t\t<cds-tab heading=\"two\">Tab Content 2</cds-tab>\n\t\t\t<cds-tab heading=\"three\" [tabContent]=\"three\"></cds-tab>\n\t\t\t<cds-tab heading=\"four\" [tabContent]=\"four\"></cds-tab>\n\t\t</cds-tabs>\n\n\t\t<!-- Use templates if you would like to have lifecycle hooks called when cacheActive is false -->\n\t\t<ng-template #three>\n\t\t\tTab Content 3\n\t\t</ng-template>\n\n\t\t<ng-template #four>\n\t\t\tTab Content 4\n\t\t</ng-template>\n\t`\n})"
                 },
                 {
-                    "name": "WithoutActionTemplate",
+                    "name": "With",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
-                    "file": "src/table/table.stories.ts",
+                    "file": "src/tabs/tabs.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-table-container>\n\t\t\t<cds-table-header>\n\t\t\t\t<h4 cdsTableHeaderTitle id=\"table-header\">{{title}}</h4>\n\t\t\t\t<p cdsTableHeaderDescription id=\"table-description\">{{description}}</p>\n\t\t\t</cds-table-header>\n\t\t\t<cds-table-toolbar>\n\t\t\t\t<cds-table-toolbar-content>\n\t\t\t\t\t<cds-table-toolbar-search [expandable]=\"true\"></cds-table-toolbar-search>\n\t\t\t\t\t<button cdsButton=\"ghost\" class=\"toolbar-action\">\n\t\t\t\t\t\t<svg cdsIcon=\"settings\" size=\"16\" class=\"cds--toolbar-action__icon\"></svg>\n\t\t\t\t\t</button>\n\t\t\t\t\t<button cdsButton=\"primary\" size=\"sm\">\n\t\t\t\t\t\tPrimary button<svg cdsIcon=\"add\" size=\"20\" class=\"cds--btn__icon\"></svg>\n\t\t\t\t\t</button>\n\t\t\t\t</cds-table-toolbar-content>\n\t\t\t</cds-table-toolbar>\n\n\t\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 found at:\n\t\t\thttps://github.com/IBM/carbon-components-angular/tree/master/src/table/stories/app-table.component.ts\n\t\t\t-->\n\t\t\t<app-table\n\t\t\t\t[model]=\"model\"\n\t\t\t\t[size]=\"size\"\n\t\t\t\t[showSelectionColumn]=\"showSelectionColumn\"\n\t\t\t\t[enableSingleSelect]=\"enableSingleSelect\"\n\t\t\t\t[stickyHeader]=\"stickyHeader\"\n\t\t\t\t[skeleton]=\"skeleton\"\n\t\t\t\t[striped]=\"striped\"\n\t\t\t\t[sortable]=\"sortable\"\n\t\t\t\t[isDataGrid]=\"isDataGrid\"\n\t\t\t\tariaLabelledby=\"table-header\"\n\t\t\t\tariaDescribedby=\"table-description\">\n\t\t\t</app-table>\n\t\t</cds-table-container>\n\t`\n})"
+                    "defaultValue": "WithTemplate.bind({})"
                 },
                 {
-                    "name": "WithoutData",
+                    "name": "WithTemplate",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
-                    "file": "src/table/table.stories.ts",
+                    "file": "src/tabs/tabs.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "NoDataTemplate.bind({})"
-                },
+                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<ng-template #customTabs let-item>\n\t\t\t{{item ? item.name : \"wait for it\"}}\n\t\t</ng-template>\n\t\t<ng-template #iconTab>\n\t\t\t<div style=\"height: 14px;\">\n\t\t\t\tSomething custom\n\t\t\t\t<svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\n\t\t\t\tstyle=\"height: 14px; width: 14px; fill: #3d70b2;\">\n\t\t\t\t\t<path d=\"M8 14.5a6.5 6.5 0 1 0 0-13 6.5 6.5 0 0 0 0 13zM8 16A8 8 0 1 1 8 0a8 8 0 0 1 0 16z\"></path>\n\t\t\t\t\t<path d=\"M9 13H7V7h2z\"></path>\n\t\t\t\t\t<path d=\"M7 4a1 1 0 1 1 2 0 1 1 0 1 1-2 0\"></path>\n\t\t\t\t</svg>\n\t\t\t</div>\n\t\t</ng-template>\n\t\t<cds-tabs [type]=\"type\" [followFocus]=\"followFocus\" [isNavigation]=\"isNavigation\">\n\t\t\t<cds-tab\n\t\t\t\t*ngFor=\"let item of data; let i = index;\"\n\t\t\t\t[heading]=\"customTabs\"\n\t\t\t\ttitle=\"Tab Content\"\n\t\t\t\t[context]=\"item\">\n\t\t\t\tTab Content {{i + 1}}\n\t\t\t</cds-tab>\n\t\t\t<cds-tab [heading]=\"iconTab\" title=\"Custom tab content\">Tab Content Custom</cds-tab>\n\t\t</cds-tabs>\n\t`\n})"
+                }
+            ],
+            "src/tag/tag.stories.ts": [
                 {
-                    "name": "WithOverflowMenu",
+                    "name": "Basic",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
-                    "file": "src/table/table.stories.ts",
+                    "file": "src/tag/tag.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "OverflowMenuTemplate.bind({})"
+                    "defaultValue": "Template.bind({})"
                 },
                 {
-                    "name": "WithPagination",
+                    "name": "Filter",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
-                    "file": "src/table/table.stories.ts",
+                    "file": "src/tag/tag.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "PaginationTemplate.bind({})"
+                    "defaultValue": "FilteredTemplate.bind({})"
                 },
                 {
-                    "name": "WithToolbar",
+                    "name": "FilteredTemplate",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
-                    "file": "src/table/table.stories.ts",
+                    "file": "src/tag/tag.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "ToolbarTemplate.bind({})"
+                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-tag-filter\n\t\t\t[type]=\"type\"\n\t\t\t[size]=\"size\"\n\t\t\ttitle=\"Filter\"\n\t\t\tcloseButtonLabel=\"Clear\">\n\t\t\tfilter\n\t\t</cds-tag-filter>\n\t`\n})"
                 },
                 {
-                    "name": "WithToolbarWithoutToolbarAction",
+                    "name": "Template",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
-                    "file": "src/table/table.stories.ts",
+                    "file": "src/tag/tag.stories.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "WithoutActionTemplate.bind({})"
+                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-tag [type]=\"type\" [size]=\"size\">Tag</cds-tag>\n\t`\n})"
                 }
             ],
             "src/theme/theme.stories.ts": [
@@ -81717,7 +81775,7 @@
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-clickable-tile\n\t\t\t[disabled]=\"disabled\"\n\t\t\t[href]=\"href\"\n\t\t\ttarget=\"_blank\">\n\t\t\tClick the tile to open the Carbon Design System\n\t\t</cds-clickable-tile>\n\t`\n})"
+                    "defaultValue": "(args) => ({\n\tprops: args,\n\ttemplate: `\n\t\t<cds-clickable-tile\n\t\t\t[disabled]=\"disabled\"\n\t\t\t[href]=\"href\"\n\t\t\ttarget=\"_blank\">\n\t\t\tClick the tile to open the Carbon Design System\n\t\t\t<svg\n\t\t\t\tcdsClickableTileIcon\n\t\t\t\tcdsIcon=\"caret--right\"\n\t\t\t\tsize=\"16\">\n\t\t\t</svg>\n\t\t</cds-clickable-tile>\n\t`\n})"
                 },
                 {
                     "name": "WithLayers",
@@ -89857,6 +89915,15 @@
                 "coverageCount": "0/1",
                 "status": "low"
             },
+            {
+                "filePath": "src/tiles/clickable-tile-icon.directive.ts",
+                "type": "directive",
+                "linktype": "directive",
+                "name": "ClickableTileIconDirective",
+                "coveragePercent": 0,
+                "coverageCount": "0/3",
+                "status": "low"
+            },
             {
                 "filePath": "src/tiles/clickable-tile.component.ts",
                 "type": "component",