carbon-components-angular 5.46.0 → 5.47.0

package/docs/documentation.json

@@ -20723,7 +20723,7 @@
         },
         {
             "name": "Breadcrumb",
-            "id": "component-Breadcrumb-50fdbb145d44b956e0820c8bc66feaa9977d2f6fe446a92dcc491ef7dca2b2d8f2c20f9b94abc5c707acf159dadefc21c3b21cae8199c62eb9b7beabaf045e16",
+            "id": "component-Breadcrumb-f39b2ab2cd5f1dc2cb81fdd804326a1c4ac85918d35c8a6d4bbf6e8b31a146792a0b020796fc3c6482e197fef5fc5eebea240964875537407e9cd8a7233dcbf7",
             "file": "src/breadcrumb/breadcrumb.component.ts",
             "encapsulation": [],
             "entryComponents": [],
@@ -20733,7 +20733,7 @@
             "selector": "cds-breadcrumb, ibm-breadcrumb",
             "styleUrls": [],
             "styles": [],
-            "template": "<nav #nav class=\"cds--breadcrumb\"\n\t[ngClass]=\"{\n\t\t'cds--skeleton' : skeleton,\n\t\t'cds--breadcrumb--no-trailing-slash' : noTrailingSlash\n\t}\"\n\t[attr.aria-label]=\"ariaLabel\">\n\t<ng-template [ngIf]=\"shouldShowContent\">\n\t\t<ng-content></ng-content>\n\t</ng-template>\n\t<ng-template [ngIf]=\"!shouldShowOverflow\">\n\t\t<cds-breadcrumb-item\n\t\t\t*ngFor=\"let item of items\"\n\t\t\t[href]=\"item.href\"\n\t\t\t[route]=\"item.route\"\n\t\t\t[routeExtras]=\"item.routeExtras\"\n\t\t\t[current]=\"item.current\"\n\t\t\t[ariaCurrent]=\"item.ariaCurrent\"\n\t\t\t(navigation)=\"navigation.emit($event)\">\n\t\t\t<ng-container *ngIf=\"!item.template\">{{item.content}}</ng-container>\n\t\t\t<ng-template\n\t\t\t\t*ngIf=\"item.template\"\n\t\t\t\t[ngTemplateOutlet]=\"item.template\"\n\t\t\t\t[ngTemplateOutletContext]=\"{ $implicit: item }\">\n\t\t\t</ng-template>\n\t\t</cds-breadcrumb-item>\n\t</ng-template>\n\t<ng-template [ngIf]=\"shouldShowOverflow\">\n\t\t<cds-breadcrumb-item\n\t\t\t[href]=\"first?.href\"\n\t\t\t[route]=\"first?.route\"\n\t\t\t[routeExtras]=\"first?.routeExtras\"\n\t\t\t[current]=\"first?.current\"\n\t\t\t[ariaCurrent]=\"first?.ariaCurrent\"\n\t\t\t(navigation)=\"navigation.emit($event)\">\n\t\t\t<ng-container *ngIf=\"!first?.template\">{{first?.content}}</ng-container>\n\t\t\t<ng-template\n\t\t\t\t*ngIf=\"first?.template\"\n\t\t\t\t[ngTemplateOutlet]=\"first?.template\"\n\t\t\t\t[ngTemplateOutletContext]=\"{ $implicit: first }\">\n\t\t\t</ng-template>\n\t\t</cds-breadcrumb-item>\n\t\t<cds-breadcrumb-item>\n\t\t\t<cds-overflow-menu>\n\t\t\t\t<li class=\"cds--overflow-menu-options__option\"\n\t\t\t\t\t*ngFor=\"let item of overflowItems\">\n\t\t\t\t\t<a class=\"cds--overflow-menu-options__btn\"\n\t\t\t\t\t\thref=\"{{item?.href}}\"\n\t\t\t\t\t\t(click)=\"navigate($event, item)\"\n\t\t\t\t\t\tstyle=\"text-decoration: none;\">\n\t\t\t\t\t\t<ng-container *ngIf=\"!item?.template\">{{item?.content}}</ng-container>\n\t\t\t\t\t\t<ng-template\n\t\t\t\t\t\t\t*ngIf=\"item?.template\"\n\t\t\t\t\t\t\t[ngTemplateOutlet]=\"item?.template\"\n\t\t\t\t\t\t\t[ngTemplateOutletContext]=\"{ $implicit: item }\">\n\t\t\t\t\t\t</ng-template>\n\t\t\t\t\t</a>\n\t\t\t\t</li>\n\t\t\t</cds-overflow-menu>\n\t\t</cds-breadcrumb-item>\n\t\t<cds-breadcrumb-item\n\t\t\t[href]=\"secondLast?.href\"\n\t\t\t[route]=\"secondLast?.route\"\n\t\t\t[routeExtras]=\"secondLast?.routeExtras\"\n\t\t\t[current]=\"secondLast?.current\"\n\t\t\t[ariaCurrent]=\"secondLast?.ariaCurrent\"\n\t\t\t(navigation)=\"navigation.emit($event)\">\n\t\t\t<ng-container *ngIf=\"!secondLast?.template\">{{secondLast?.content}}</ng-container>\n\t\t\t<ng-template\n\t\t\t\t*ngIf=\"secondLast?.template\"\n\t\t\t\t[ngTemplateOutlet]=\"secondLast?.template\"\n\t\t\t\t[ngTemplateOutletContext]=\"{ $implicit: secondLast }\">\n\t\t\t</ng-template>\n\t\t</cds-breadcrumb-item>\n\t\t<cds-breadcrumb-item\n\t\t\t[href]=\"last?.href\"\n\t\t\t[route]=\"last?.route\"\n\t\t\t[routeExtras]=\"last?.routeExtras\"\n\t\t\t[current]=\"last?.current\"\n\t\t\t[ariaCurrent]=\"last?.ariaCurrent\"\n\t\t\t(navigation)=\"navigation.emit($event)\">\n\t\t\t<ng-container *ngIf=\"!last?.template\">{{last?.content}}</ng-container>\n\t\t\t<ng-template\n\t\t\t\t*ngIf=\"last?.template\"\n\t\t\t\t[ngTemplateOutlet]=\"last?.template\"\n\t\t\t\t[ngTemplateOutletContext]=\"{ $implicit: last }\">\n\t\t\t</ng-template>\n\t\t</cds-breadcrumb-item>\n\t</ng-template>\n</nav>",
+            "template": "<nav #nav class=\"cds--breadcrumb\"\n\t[ngClass]=\"{\n\t\t'cds--skeleton' : skeleton,\n\t\t'cds--breadcrumb--no-trailing-slash' : noTrailingSlash\n\t}\"\n\t[attr.aria-label]=\"ariaLabel\">\n\t<ng-template [ngIf]=\"shouldShowContent\">\n\t\t<ng-content></ng-content>\n\t</ng-template>\n\t<ng-template [ngIf]=\"!shouldShowOverflow\">\n\t\t<cds-breadcrumb-item\n\t\t\t*ngFor=\"let item of items\"\n\t\t\t[href]=\"item.href\"\n\t\t\t[route]=\"item.route\"\n\t\t\t[routeExtras]=\"item.routeExtras\"\n\t\t\t[current]=\"item.current\"\n\t\t\t[ariaCurrent]=\"item.ariaCurrent\"\n\t\t\t(navigation)=\"navigation.emit($event)\">\n\t\t\t<ng-container *ngIf=\"!item.template\">{{item.content}}</ng-container>\n\t\t\t<ng-template\n\t\t\t\t*ngIf=\"item.template\"\n\t\t\t\t[ngTemplateOutlet]=\"item.template\"\n\t\t\t\t[ngTemplateOutletContext]=\"{ $implicit: item }\">\n\t\t\t</ng-template>\n\t\t</cds-breadcrumb-item>\n\t</ng-template>\n\t<ng-template [ngIf]=\"shouldShowOverflow\">\n\t\t<cds-breadcrumb-item\n\t\t\t[href]=\"first?.href\"\n\t\t\t[route]=\"first?.route\"\n\t\t\t[routeExtras]=\"first?.routeExtras\"\n\t\t\t[current]=\"first?.current\"\n\t\t\t[ariaCurrent]=\"first?.ariaCurrent\"\n\t\t\t(navigation)=\"navigation.emit($event)\">\n\t\t\t<ng-container *ngIf=\"!first?.template\">{{first?.content}}</ng-container>\n\t\t\t<ng-template\n\t\t\t\t*ngIf=\"first?.template\"\n\t\t\t\t[ngTemplateOutlet]=\"first?.template\"\n\t\t\t\t[ngTemplateOutletContext]=\"{ $implicit: first }\">\n\t\t\t</ng-template>\n\t\t</cds-breadcrumb-item>\n\t\t<cds-breadcrumb-item>\n\t\t\t<ng-template #overflowMenuTrigger>\n\t\t\t\t<svg class=\"cds--overflow-menu__icon\" cdsIcon=\"overflow-menu--horizontal\" size=\"16\"></svg>\n\t\t\t</ng-template>\n\t\t\t<cds-overflow-menu\n\t\t\t\t[customTrigger]=\"overflowMenuTrigger\"\n\t\t\t\ttriggerClass=\"cds--btn--icon-only\"\n\t\t\t\t[description]=\"description\"\n\t\t\t\t[autoAlign]=\"autoAlign\">\n\t\t\t\t<li class=\"cds--overflow-menu-options__option\"\n\t\t\t\t\t*ngFor=\"let item of overflowItems\">\n\t\t\t\t\t<a class=\"cds--overflow-menu-options__btn\"\n\t\t\t\t\t\thref=\"{{item?.href}}\"\n\t\t\t\t\t\t(click)=\"navigate($event, item)\"\n\t\t\t\t\t\tstyle=\"text-decoration: none;\">\n\t\t\t\t\t\t<ng-container *ngIf=\"!item?.template\">{{item?.content}}</ng-container>\n\t\t\t\t\t\t<ng-template\n\t\t\t\t\t\t\t*ngIf=\"item?.template\"\n\t\t\t\t\t\t\t[ngTemplateOutlet]=\"item?.template\"\n\t\t\t\t\t\t\t[ngTemplateOutletContext]=\"{ $implicit: item }\">\n\t\t\t\t\t\t</ng-template>\n\t\t\t\t\t</a>\n\t\t\t\t</li>\n\t\t\t</cds-overflow-menu>\n\t\t</cds-breadcrumb-item>\n\t\t<cds-breadcrumb-item\n\t\t\t[href]=\"secondLast?.href\"\n\t\t\t[route]=\"secondLast?.route\"\n\t\t\t[routeExtras]=\"secondLast?.routeExtras\"\n\t\t\t[current]=\"secondLast?.current\"\n\t\t\t[ariaCurrent]=\"secondLast?.ariaCurrent\"\n\t\t\t(navigation)=\"navigation.emit($event)\">\n\t\t\t<ng-container *ngIf=\"!secondLast?.template\">{{secondLast?.content}}</ng-container>\n\t\t\t<ng-template\n\t\t\t\t*ngIf=\"secondLast?.template\"\n\t\t\t\t[ngTemplateOutlet]=\"secondLast?.template\"\n\t\t\t\t[ngTemplateOutletContext]=\"{ $implicit: secondLast }\">\n\t\t\t</ng-template>\n\t\t</cds-breadcrumb-item>\n\t\t<cds-breadcrumb-item\n\t\t\t[href]=\"last?.href\"\n\t\t\t[route]=\"last?.route\"\n\t\t\t[routeExtras]=\"last?.routeExtras\"\n\t\t\t[current]=\"last?.current\"\n\t\t\t[ariaCurrent]=\"last?.ariaCurrent\"\n\t\t\t(navigation)=\"navigation.emit($event)\">\n\t\t\t<ng-container *ngIf=\"!last?.template\">{{last?.content}}</ng-container>\n\t\t\t<ng-template\n\t\t\t\t*ngIf=\"last?.template\"\n\t\t\t\t[ngTemplateOutlet]=\"last?.template\"\n\t\t\t\t[ngTemplateOutletContext]=\"{ $implicit: last }\">\n\t\t\t</ng-template>\n\t\t</cds-breadcrumb-item>\n\t</ng-template>\n</nav>",
             "templateUrl": [],
             "viewProviders": [],
             "hostDirectives": [],
@@ -20743,7 +20743,27 @@
                     "defaultValue": "this.i18n.get().BREADCRUMB.LABEL",
                     "deprecated": false,
                     "deprecationMessage": "",
-                    "line": 129,
+                    "line": 136,
+                    "type": "string",
+                    "decorators": []
+                },
+                {
+                    "name": "autoAlign",
+                    "defaultValue": "false",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "rawdescription": "\n\n**Experimental**: Auto align menu tooltip position\n",
+                    "description": "<p><strong>Experimental</strong>: Auto align menu tooltip position</p>\n",
+                    "line": 163,
+                    "type": "boolean",
+                    "decorators": []
+                },
+                {
+                    "name": "description",
+                    "defaultValue": "this.i18n.get().BREADCRUMB.OVERFLOW_MENU_DESCRIPTION",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "line": 164,
                     "type": "string",
                     "decorators": []
                 },
@@ -20751,7 +20771,7 @@
                     "name": "items",
                     "deprecated": false,
                     "deprecationMessage": "",
-                    "line": 125,
+                    "line": 132,
                     "type": "Array<BreadcrumbItem>",
                     "decorators": []
                 },
@@ -20760,7 +20780,7 @@
                     "defaultValue": "false",
                     "deprecated": false,
                     "deprecationMessage": "",
-                    "line": 127,
+                    "line": 134,
                     "type": "boolean",
                     "decorators": []
                 },
@@ -20768,7 +20788,7 @@
                     "name": "skeleton",
                     "deprecated": false,
                     "deprecationMessage": "",
-                    "line": 132,
+                    "line": 139,
                     "type": "any",
                     "decorators": []
                 },
@@ -20776,7 +20796,7 @@
                     "name": "threshold",
                     "deprecated": false,
                     "deprecationMessage": "",
-                    "line": 142,
+                    "line": 149,
                     "type": "number",
                     "decorators": []
                 }
@@ -20789,7 +20809,7 @@
                     "deprecationMessage": "",
                     "rawdescription": "\n\nEmits the navigation status promise when the link is activated\n",
                     "description": "<p>Emits the navigation status promise when the link is activated</p>\n",
-                    "line": 156,
+                    "line": 169,
                     "type": "EventEmitter"
                 }
             ],
@@ -20801,7 +20821,7 @@
                     "type": "QueryList<BreadcrumbItemComponent>",
                     "optional": false,
                     "description": "",
-                    "line": 123,
+                    "line": 130,
                     "decorators": [
                         {
                             "name": "ContentChildren",
@@ -20833,7 +20853,7 @@
                     "optional": false,
                     "returnType": "void",
                     "typeParameters": [],
-                    "line": 194,
+                    "line": 207,
                     "deprecated": false,
                     "deprecationMessage": "",
                     "jsdoctags": [
@@ -20867,7 +20887,7 @@
             "description": "<p>Get started with importing the module:</p>\n<b>Example :</b><div><pre class=\"line-numbers\"><code class=\"language-typescript\">import { BreadcrumbModule } from &#39;carbon-components-angular&#39;;</code></pre></div><p><a href=\"../../?path=/story/components-breadcrumb--basic\">See demo</a></p>\n",
             "rawdescription": "\n\nGet started with importing the module:\n\n```typescript\nimport { BreadcrumbModule } from 'carbon-components-angular';\n```\n\n[See demo](../../?path=/story/components-breadcrumb--basic)\n",
             "type": "component",
-            "sourceCode": "import {\n\tComponent,\n\tInput,\n\tContentChildren,\n\tQueryList,\n\tAfterContentInit,\n\tTemplateRef,\n\tOptional,\n\tOutput,\n\tEventEmitter\n} from \"@angular/core\";\n\nimport { BreadcrumbItem } from \"./breadcrumb-item.interface\";\nimport { BreadcrumbItemComponent } from \"./breadcrumb-item.component\";\nimport { Router } from \"@angular/router\";\nimport { I18n } from \"carbon-components-angular/i18n\";\n\nconst MINIMUM_OVERFLOW_THRESHOLD = 4;\n\n/**\n * Get started with importing the module:\n *\n * ```typescript\n * import { BreadcrumbModule } from 'carbon-components-angular';\n * ```\n *\n * [See demo](../../?path=/story/components-breadcrumb--basic)\n */\n@Component({\n\tselector: \"cds-breadcrumb, ibm-breadcrumb\",\n\ttemplate: `\n\t<nav #nav class=\"cds--breadcrumb\"\n\t\t[ngClass]=\"{\n\t\t\t'cds--skeleton' : skeleton,\n\t\t\t'cds--breadcrumb--no-trailing-slash' : noTrailingSlash\n\t\t}\"\n\t\t[attr.aria-label]=\"ariaLabel\">\n\t\t<ng-template [ngIf]=\"shouldShowContent\">\n\t\t\t<ng-content></ng-content>\n\t\t</ng-template>\n\t\t<ng-template [ngIf]=\"!shouldShowOverflow\">\n\t\t\t<cds-breadcrumb-item\n\t\t\t\t*ngFor=\"let item of items\"\n\t\t\t\t[href]=\"item.href\"\n\t\t\t\t[route]=\"item.route\"\n\t\t\t\t[routeExtras]=\"item.routeExtras\"\n\t\t\t\t[current]=\"item.current\"\n\t\t\t\t[ariaCurrent]=\"item.ariaCurrent\"\n\t\t\t\t(navigation)=\"navigation.emit($event)\">\n\t\t\t\t<ng-container *ngIf=\"!item.template\">{{item.content}}</ng-container>\n\t\t\t\t<ng-template\n\t\t\t\t\t*ngIf=\"item.template\"\n\t\t\t\t\t[ngTemplateOutlet]=\"item.template\"\n\t\t\t\t\t[ngTemplateOutletContext]=\"{ $implicit: item }\">\n\t\t\t\t</ng-template>\n\t\t\t</cds-breadcrumb-item>\n\t\t</ng-template>\n\t\t<ng-template [ngIf]=\"shouldShowOverflow\">\n\t\t\t<cds-breadcrumb-item\n\t\t\t\t[href]=\"first?.href\"\n\t\t\t\t[route]=\"first?.route\"\n\t\t\t\t[routeExtras]=\"first?.routeExtras\"\n\t\t\t\t[current]=\"first?.current\"\n\t\t\t\t[ariaCurrent]=\"first?.ariaCurrent\"\n\t\t\t\t(navigation)=\"navigation.emit($event)\">\n\t\t\t\t<ng-container *ngIf=\"!first?.template\">{{first?.content}}</ng-container>\n\t\t\t\t<ng-template\n\t\t\t\t\t*ngIf=\"first?.template\"\n\t\t\t\t\t[ngTemplateOutlet]=\"first?.template\"\n\t\t\t\t\t[ngTemplateOutletContext]=\"{ $implicit: first }\">\n\t\t\t\t</ng-template>\n\t\t\t</cds-breadcrumb-item>\n\t\t\t<cds-breadcrumb-item>\n\t\t\t\t<cds-overflow-menu>\n\t\t\t\t\t<li class=\"cds--overflow-menu-options__option\"\n\t\t\t\t\t\t*ngFor=\"let item of overflowItems\">\n\t\t\t\t\t\t<a class=\"cds--overflow-menu-options__btn\"\n\t\t\t\t\t\t\thref=\"{{item?.href}}\"\n\t\t\t\t\t\t\t(click)=\"navigate($event, item)\"\n\t\t\t\t\t\t\tstyle=\"text-decoration: none;\">\n\t\t\t\t\t\t\t<ng-container *ngIf=\"!item?.template\">{{item?.content}}</ng-container>\n\t\t\t\t\t\t\t<ng-template\n\t\t\t\t\t\t\t\t*ngIf=\"item?.template\"\n\t\t\t\t\t\t\t\t[ngTemplateOutlet]=\"item?.template\"\n\t\t\t\t\t\t\t\t[ngTemplateOutletContext]=\"{ $implicit: item }\">\n\t\t\t\t\t\t\t</ng-template>\n\t\t\t\t\t\t</a>\n\t\t\t\t\t</li>\n\t\t\t\t</cds-overflow-menu>\n\t\t\t</cds-breadcrumb-item>\n\t\t\t<cds-breadcrumb-item\n\t\t\t\t[href]=\"secondLast?.href\"\n\t\t\t\t[route]=\"secondLast?.route\"\n\t\t\t\t[routeExtras]=\"secondLast?.routeExtras\"\n\t\t\t\t[current]=\"secondLast?.current\"\n\t\t\t\t[ariaCurrent]=\"secondLast?.ariaCurrent\"\n\t\t\t\t(navigation)=\"navigation.emit($event)\">\n\t\t\t\t<ng-container *ngIf=\"!secondLast?.template\">{{secondLast?.content}}</ng-container>\n\t\t\t\t<ng-template\n\t\t\t\t\t*ngIf=\"secondLast?.template\"\n\t\t\t\t\t[ngTemplateOutlet]=\"secondLast?.template\"\n\t\t\t\t\t[ngTemplateOutletContext]=\"{ $implicit: secondLast }\">\n\t\t\t\t</ng-template>\n\t\t\t</cds-breadcrumb-item>\n\t\t\t<cds-breadcrumb-item\n\t\t\t\t[href]=\"last?.href\"\n\t\t\t\t[route]=\"last?.route\"\n\t\t\t\t[routeExtras]=\"last?.routeExtras\"\n\t\t\t\t[current]=\"last?.current\"\n\t\t\t\t[ariaCurrent]=\"last?.ariaCurrent\"\n\t\t\t\t(navigation)=\"navigation.emit($event)\">\n\t\t\t\t<ng-container *ngIf=\"!last?.template\">{{last?.content}}</ng-container>\n\t\t\t\t<ng-template\n\t\t\t\t\t*ngIf=\"last?.template\"\n\t\t\t\t\t[ngTemplateOutlet]=\"last?.template\"\n\t\t\t\t\t[ngTemplateOutletContext]=\"{ $implicit: last }\">\n\t\t\t\t</ng-template>\n\t\t\t</cds-breadcrumb-item>\n\t\t</ng-template>\n\t</nav>`\n})\nexport class Breadcrumb implements AfterContentInit {\n\t@ContentChildren(BreadcrumbItemComponent) children: QueryList<BreadcrumbItemComponent>;\n\n\t@Input() items: Array<BreadcrumbItem>;\n\n\t@Input() noTrailingSlash = false;\n\n\t@Input() ariaLabel: string = this.i18n.get().BREADCRUMB.LABEL;\n\n\t@Input()\n\tset skeleton(value: any) {\n\t\tthis._skeleton = value;\n\t\tthis.updateChildren();\n\t}\n\n\tget skeleton(): any {\n\t\treturn this._skeleton;\n\t}\n\n\t@Input()\n\tset threshold(threshold: number) {\n\t\tthis._threshold = threshold;\n\t\tif (isNaN(threshold) || threshold < MINIMUM_OVERFLOW_THRESHOLD) {\n\t\t\tthis._threshold = MINIMUM_OVERFLOW_THRESHOLD;\n\t\t}\n\t}\n\n\tget threshold(): number {\n\t\treturn this._threshold;\n\t}\n\n\t/**\n\t * Emits the navigation status promise when the link is activated\n\t */\n\t@Output() navigation = new EventEmitter<Promise<boolean>>();\n\n\tget shouldShowContent(): boolean {\n\t\treturn !this.items;\n\t}\n\n\tget shouldShowOverflow(): boolean {\n\t\tif (!this.items) {\n\t\t\treturn false;\n\t\t}\n\t\treturn this.items.length > this.threshold;\n\t}\n\n\tget first(): BreadcrumbItem {\n\t\treturn this.shouldShowOverflow ? this.items[0] : null;\n\t}\n\n\tget overflowItems(): Array<BreadcrumbItem> {\n\t\treturn this.shouldShowOverflow ? this.items.slice(1, this.items.length - 2) : [];\n\t}\n\n\tget secondLast(): BreadcrumbItem {\n\t\treturn this.shouldShowOverflow ? this.items[this.items.length - 2] : null;\n\t}\n\n\tget last(): BreadcrumbItem {\n\t\treturn this.shouldShowOverflow ? this.items[this.items.length - 1] : null;\n\t}\n\n\tprotected _threshold: number;\n\tprotected _skeleton = false;\n\n\tconstructor(protected i18n: I18n, @Optional() protected router: Router) { }\n\n\tngAfterContentInit() {\n\t\tthis.updateChildren();\n\t}\n\n\tnavigate(event, item: BreadcrumbItem) {\n\t\tif (this.router && item.route) {\n\t\t\tevent.preventDefault();\n\t\t\tconst status = this.router.navigate(item.route, item.routeExtras);\n\t\t\tthis.navigation.emit(status);\n\t\t}\n\t}\n\n\tprotected updateChildren() {\n\t\tif (this.children) {\n\t\t\tthis.children.toArray().forEach(child => child.skeleton = this.skeleton);\n\t\t}\n\t}\n}\n",
+            "sourceCode": "import {\n\tComponent,\n\tInput,\n\tContentChildren,\n\tQueryList,\n\tAfterContentInit,\n\tTemplateRef,\n\tOptional,\n\tOutput,\n\tEventEmitter\n} from \"@angular/core\";\n\nimport { BreadcrumbItem } from \"./breadcrumb-item.interface\";\nimport { BreadcrumbItemComponent } from \"./breadcrumb-item.component\";\nimport { Router } from \"@angular/router\";\nimport { I18n } from \"carbon-components-angular/i18n\";\n\nconst MINIMUM_OVERFLOW_THRESHOLD = 4;\n\n/**\n * Get started with importing the module:\n *\n * ```typescript\n * import { BreadcrumbModule } from 'carbon-components-angular';\n * ```\n *\n * [See demo](../../?path=/story/components-breadcrumb--basic)\n */\n@Component({\n\tselector: \"cds-breadcrumb, ibm-breadcrumb\",\n\ttemplate: `\n\t<nav #nav class=\"cds--breadcrumb\"\n\t\t[ngClass]=\"{\n\t\t\t'cds--skeleton' : skeleton,\n\t\t\t'cds--breadcrumb--no-trailing-slash' : noTrailingSlash\n\t\t}\"\n\t\t[attr.aria-label]=\"ariaLabel\">\n\t\t<ng-template [ngIf]=\"shouldShowContent\">\n\t\t\t<ng-content></ng-content>\n\t\t</ng-template>\n\t\t<ng-template [ngIf]=\"!shouldShowOverflow\">\n\t\t\t<cds-breadcrumb-item\n\t\t\t\t*ngFor=\"let item of items\"\n\t\t\t\t[href]=\"item.href\"\n\t\t\t\t[route]=\"item.route\"\n\t\t\t\t[routeExtras]=\"item.routeExtras\"\n\t\t\t\t[current]=\"item.current\"\n\t\t\t\t[ariaCurrent]=\"item.ariaCurrent\"\n\t\t\t\t(navigation)=\"navigation.emit($event)\">\n\t\t\t\t<ng-container *ngIf=\"!item.template\">{{item.content}}</ng-container>\n\t\t\t\t<ng-template\n\t\t\t\t\t*ngIf=\"item.template\"\n\t\t\t\t\t[ngTemplateOutlet]=\"item.template\"\n\t\t\t\t\t[ngTemplateOutletContext]=\"{ $implicit: item }\">\n\t\t\t\t</ng-template>\n\t\t\t</cds-breadcrumb-item>\n\t\t</ng-template>\n\t\t<ng-template [ngIf]=\"shouldShowOverflow\">\n\t\t\t<cds-breadcrumb-item\n\t\t\t\t[href]=\"first?.href\"\n\t\t\t\t[route]=\"first?.route\"\n\t\t\t\t[routeExtras]=\"first?.routeExtras\"\n\t\t\t\t[current]=\"first?.current\"\n\t\t\t\t[ariaCurrent]=\"first?.ariaCurrent\"\n\t\t\t\t(navigation)=\"navigation.emit($event)\">\n\t\t\t\t<ng-container *ngIf=\"!first?.template\">{{first?.content}}</ng-container>\n\t\t\t\t<ng-template\n\t\t\t\t\t*ngIf=\"first?.template\"\n\t\t\t\t\t[ngTemplateOutlet]=\"first?.template\"\n\t\t\t\t\t[ngTemplateOutletContext]=\"{ $implicit: first }\">\n\t\t\t\t</ng-template>\n\t\t\t</cds-breadcrumb-item>\n\t\t\t<cds-breadcrumb-item>\n\t\t\t\t<ng-template #overflowMenuTrigger>\n\t\t\t\t\t<svg class=\"cds--overflow-menu__icon\" cdsIcon=\"overflow-menu--horizontal\" size=\"16\"></svg>\n\t\t\t\t</ng-template>\n\t\t\t\t<cds-overflow-menu\n\t\t\t\t\t[customTrigger]=\"overflowMenuTrigger\"\n\t\t\t\t\ttriggerClass=\"cds--btn--icon-only\"\n\t\t\t\t\t[description]=\"description\"\n\t\t\t\t\t[autoAlign]=\"autoAlign\">\n\t\t\t\t\t<li class=\"cds--overflow-menu-options__option\"\n\t\t\t\t\t\t*ngFor=\"let item of overflowItems\">\n\t\t\t\t\t\t<a class=\"cds--overflow-menu-options__btn\"\n\t\t\t\t\t\t\thref=\"{{item?.href}}\"\n\t\t\t\t\t\t\t(click)=\"navigate($event, item)\"\n\t\t\t\t\t\t\tstyle=\"text-decoration: none;\">\n\t\t\t\t\t\t\t<ng-container *ngIf=\"!item?.template\">{{item?.content}}</ng-container>\n\t\t\t\t\t\t\t<ng-template\n\t\t\t\t\t\t\t\t*ngIf=\"item?.template\"\n\t\t\t\t\t\t\t\t[ngTemplateOutlet]=\"item?.template\"\n\t\t\t\t\t\t\t\t[ngTemplateOutletContext]=\"{ $implicit: item }\">\n\t\t\t\t\t\t\t</ng-template>\n\t\t\t\t\t\t</a>\n\t\t\t\t\t</li>\n\t\t\t\t</cds-overflow-menu>\n\t\t\t</cds-breadcrumb-item>\n\t\t\t<cds-breadcrumb-item\n\t\t\t\t[href]=\"secondLast?.href\"\n\t\t\t\t[route]=\"secondLast?.route\"\n\t\t\t\t[routeExtras]=\"secondLast?.routeExtras\"\n\t\t\t\t[current]=\"secondLast?.current\"\n\t\t\t\t[ariaCurrent]=\"secondLast?.ariaCurrent\"\n\t\t\t\t(navigation)=\"navigation.emit($event)\">\n\t\t\t\t<ng-container *ngIf=\"!secondLast?.template\">{{secondLast?.content}}</ng-container>\n\t\t\t\t<ng-template\n\t\t\t\t\t*ngIf=\"secondLast?.template\"\n\t\t\t\t\t[ngTemplateOutlet]=\"secondLast?.template\"\n\t\t\t\t\t[ngTemplateOutletContext]=\"{ $implicit: secondLast }\">\n\t\t\t\t</ng-template>\n\t\t\t</cds-breadcrumb-item>\n\t\t\t<cds-breadcrumb-item\n\t\t\t\t[href]=\"last?.href\"\n\t\t\t\t[route]=\"last?.route\"\n\t\t\t\t[routeExtras]=\"last?.routeExtras\"\n\t\t\t\t[current]=\"last?.current\"\n\t\t\t\t[ariaCurrent]=\"last?.ariaCurrent\"\n\t\t\t\t(navigation)=\"navigation.emit($event)\">\n\t\t\t\t<ng-container *ngIf=\"!last?.template\">{{last?.content}}</ng-container>\n\t\t\t\t<ng-template\n\t\t\t\t\t*ngIf=\"last?.template\"\n\t\t\t\t\t[ngTemplateOutlet]=\"last?.template\"\n\t\t\t\t\t[ngTemplateOutletContext]=\"{ $implicit: last }\">\n\t\t\t\t</ng-template>\n\t\t\t</cds-breadcrumb-item>\n\t\t</ng-template>\n\t</nav>`\n})\nexport class Breadcrumb implements AfterContentInit {\n\t@ContentChildren(BreadcrumbItemComponent) children: QueryList<BreadcrumbItemComponent>;\n\n\t@Input() items: Array<BreadcrumbItem>;\n\n\t@Input() noTrailingSlash = false;\n\n\t@Input() ariaLabel: string = this.i18n.get().BREADCRUMB.LABEL;\n\n\t@Input()\n\tset skeleton(value: any) {\n\t\tthis._skeleton = value;\n\t\tthis.updateChildren();\n\t}\n\n\tget skeleton(): any {\n\t\treturn this._skeleton;\n\t}\n\n\t@Input()\n\tset threshold(threshold: number) {\n\t\tthis._threshold = threshold;\n\t\tif (isNaN(threshold) || threshold < MINIMUM_OVERFLOW_THRESHOLD) {\n\t\t\tthis._threshold = MINIMUM_OVERFLOW_THRESHOLD;\n\t\t}\n\t}\n\n\tget threshold(): number {\n\t\treturn this._threshold;\n\t}\n\n\t/**\n\t * **Experimental**: Auto align menu tooltip position\n\t */\n\t@Input() autoAlign = false;\n\t@Input() description: string = this.i18n.get().BREADCRUMB.OVERFLOW_MENU_DESCRIPTION;\n\n\t/**\n\t * Emits the navigation status promise when the link is activated\n\t */\n\t@Output() navigation = new EventEmitter<Promise<boolean>>();\n\n\tget shouldShowContent(): boolean {\n\t\treturn !this.items;\n\t}\n\n\tget shouldShowOverflow(): boolean {\n\t\tif (!this.items) {\n\t\t\treturn false;\n\t\t}\n\t\treturn this.items.length > this.threshold;\n\t}\n\n\tget first(): BreadcrumbItem {\n\t\treturn this.shouldShowOverflow ? this.items[0] : null;\n\t}\n\n\tget overflowItems(): Array<BreadcrumbItem> {\n\t\treturn this.shouldShowOverflow ? this.items.slice(1, this.items.length - 2) : [];\n\t}\n\n\tget secondLast(): BreadcrumbItem {\n\t\treturn this.shouldShowOverflow ? this.items[this.items.length - 2] : null;\n\t}\n\n\tget last(): BreadcrumbItem {\n\t\treturn this.shouldShowOverflow ? this.items[this.items.length - 1] : null;\n\t}\n\n\tprotected _threshold: number;\n\tprotected _skeleton = false;\n\n\tconstructor(protected i18n: I18n, @Optional() protected router: Router) { }\n\n\tngAfterContentInit() {\n\t\tthis.updateChildren();\n\t}\n\n\tnavigate(event, item: BreadcrumbItem) {\n\t\tif (this.router && item.route) {\n\t\t\tevent.preventDefault();\n\t\t\tconst status = this.router.navigate(item.route, item.routeExtras);\n\t\t\tthis.navigation.emit(status);\n\t\t}\n\t}\n\n\tprotected updateChildren() {\n\t\tif (this.children) {\n\t\t\tthis.children.toArray().forEach(child => child.skeleton = this.skeleton);\n\t\t}\n\t}\n}\n",
             "assetsDirs": [],
             "styleUrlsData": "",
             "stylesData": "",
@@ -20890,7 +20910,7 @@
                         "deprecationMessage": ""
                     }
                 ],
-                "line": 186,
+                "line": 199,
                 "jsdoctags": [
                     {
                         "name": "i18n",
@@ -20933,7 +20953,7 @@
                             }
                         ],
                         "returnType": "void",
-                        "line": 132,
+                        "line": 139,
                         "jsdoctags": [
                             {
                                 "name": "value",
@@ -20950,7 +20970,7 @@
                         "name": "skeleton",
                         "type": "any",
                         "returnType": "any",
-                        "line": 137
+                        "line": 144
                     }
                 },
                 "threshold": {
@@ -20969,7 +20989,7 @@
                             }
                         ],
                         "returnType": "void",
-                        "line": 142,
+                        "line": 149,
                         "jsdoctags": [
                             {
                                 "name": "threshold",
@@ -20986,7 +21006,7 @@
                         "name": "threshold",
                         "type": "number",
                         "returnType": "number",
-                        "line": 149
+                        "line": 156
                     }
                 },
                 "shouldShowContent": {
@@ -20995,7 +21015,7 @@
                         "name": "shouldShowContent",
                         "type": "boolean",
                         "returnType": "boolean",
-                        "line": 158
+                        "line": 171
                     }
                 },
                 "shouldShowOverflow": {
@@ -21004,7 +21024,7 @@
                         "name": "shouldShowOverflow",
                         "type": "boolean",
                         "returnType": "boolean",
-                        "line": 162
+                        "line": 175
                     }
                 },
                 "first": {
@@ -21013,7 +21033,7 @@
                         "name": "first",
                         "type": "",
                         "returnType": "BreadcrumbItem",
-                        "line": 169
+                        "line": 182
                     }
                 },
                 "overflowItems": {
@@ -21022,7 +21042,7 @@
                         "name": "overflowItems",
                         "type": "",
                         "returnType": "Array<BreadcrumbItem>",
-                        "line": 173
+                        "line": 186
                     }
                 },
                 "secondLast": {
@@ -21031,7 +21051,7 @@
                         "name": "secondLast",
                         "type": "",
                         "returnType": "BreadcrumbItem",
-                        "line": 177
+                        "line": 190
                     }
                 },
                 "last": {
@@ -21040,7 +21060,7 @@
                         "name": "last",
                         "type": "",
                         "returnType": "BreadcrumbItem",
-                        "line": 181
+                        "line": 194
                     }
                 }
             }
@@ -39098,7 +39118,7 @@
         },
         {
             "name": "OverflowMenu",
-            "id": "component-OverflowMenu-05b8e7ea37aadf08a22ac2b9e916713b2d31897424967a698749718f1deb87967fb3fa4720341cf85bb23b4ac99eab725e8c5deaf2dd348c251770a9f7a58a0c",
+            "id": "component-OverflowMenu-ba2c9b6536aa1371e8dd32e5d2ab1ee283127d2e390926dcd032d6467c2415d4f02770e416b13e472cf883e3abf4e0a108cb3312281bf98b01d940b403054a60",
             "file": "src/dialog/overflow-menu/overflow-menu.component.ts",
             "encapsulation": [
                 "ViewEncapsulation.None"
@@ -39112,7 +39132,7 @@
             "styles": [
                 "\n\t\t.cds--overflow-menu--open {\n\t\t\topacity: 1\n\t\t}\n\n\t\t/*\n\t\tRotate the overflow menu container as well as the icon, since\n\t\twe calculate our menu position based on the container, not the icon.\n\t\t*/\n\t\t.cds--data-table-v2 .cds--overflow-menu {\n\t\t\ttransform: rotate(90deg);\n\t\t}\n\n\t\t.cds--data-table-v2 .cds--overflow-menu__icon {\n\t\t\ttransform: rotate(180deg);\n\t\t}\n\t"
             ],
-            "template": "<button\n\t[cdsOverflowMenu]=\"options\"\n\t[ngClass]=\"{'cds--overflow-menu--open': open}\"\n\tclass=\"cds--overflow-menu {{triggerClass}}\"\n\t[attr.aria-label]=\"buttonLabel\"\n\t[flip]=\"flip\"\n\t[isOpen]=\"open\"\n\t(isOpenChange)=\"handleOpenChange($event)\"\n\t[offset]=\"offset\"\n\t[wrapperClass]=\"wrapperClass\"\n\taria-haspopup=\"true\"\n\tclass=\"cds--overflow-menu\"\n\ttype=\"button\"\n\t[placement]=\"placement\">\n\t<ng-template *ngIf=\"customTrigger; else defaultIcon\" [ngTemplateOutlet]=\"customTrigger\"></ng-template>\n</button>\n<ng-template #options>\n\t<ng-content></ng-content>\n</ng-template>\n<ng-template #defaultIcon>\n\t<svg cdsIcon=\"overflow-menu--vertical\" size=\"16\" class=\"cds--overflow-menu__icon\"></svg>\n</ng-template>\n\t",
+            "template": "<cds-tooltip\n\tclass=\"cds--icon-tooltip\"\n\t[description]=\"description\"\n\t[caret]=\"caret\"\n\t[dropShadow]=\"dropShadow\"\n\t[highContrast]=\"highContrast\"\n\t[isOpen]=\"isOpen\"\n\t[align]=\"align\"\n\t[autoAlign]=\"autoAlign\"\n\t[enterDelayMs]=\"enterDelayMs\"\n\t[leaveDelayMs]=\"leaveDelayMs\">\n\t<button\n\t\tcdsButton=\"ghost\"\n\t\t[cdsOverflowMenu]=\"options\"\n\t\t[ngClass]=\"{'cds--overflow-menu--open': open}\"\n\t\tclass=\"cds--overflow-menu {{triggerClass}}\"\n\t\t[iconOnly]=\"true\"\n\t\t[attr.aria-label]=\"buttonLabel\"\n\t\t[flip]=\"flip\"\n\t\t[isOpen]=\"open\"\n\t\t(isOpenChange)=\"handleOpenChange($event)\"\n\t\t[offset]=\"offset\"\n\t\t[wrapperClass]=\"wrapperClass\"\n\t\taria-haspopup=\"true\"\n\t\ttype=\"button\"\n\t\t[placement]=\"placement\">\n\t\t<ng-template *ngIf=\"customTrigger; else defaultIcon\" [ngTemplateOutlet]=\"customTrigger\"></ng-template>\n\t</button>\n</cds-tooltip>\n\n<ng-template #options>\n\t<ng-content></ng-content>\n</ng-template>\n<ng-template #defaultIcon>\n\t<svg cdsIcon=\"overflow-menu--vertical\" size=\"16\" class=\"cds--overflow-menu__icon\"></svg>\n</ng-template>\n\t",
             "templateUrl": [],
             "viewProviders": [],
             "hostDirectives": [],
@@ -39122,7 +39142,7 @@
                     "defaultValue": "this.i18n.get().OVERFLOW_MENU.OVERFLOW",
                     "deprecated": false,
                     "deprecationMessage": "",
-                    "line": 78,
+                    "line": 93,
                     "type": "any",
                     "decorators": []
                 },
@@ -39132,16 +39152,25 @@
                     "deprecationMessage": "",
                     "rawdescription": "\n\nSets the custom overflow menu trigger\n",
                     "description": "<p>Sets the custom overflow menu trigger</p>\n",
-                    "line": 90,
+                    "line": 107,
                     "type": "TemplateRef<any>",
                     "decorators": []
                 },
+                {
+                    "name": "description",
+                    "defaultValue": "this.i18n.get().OVERFLOW_MENU.ICON_DESCRIPTION",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "line": 95,
+                    "type": "any",
+                    "decorators": []
+                },
                 {
                     "name": "flip",
                     "defaultValue": "false",
                     "deprecated": false,
                     "deprecationMessage": "",
-                    "line": 80,
+                    "line": 97,
                     "type": "boolean",
                     "decorators": []
                 },
@@ -39151,7 +39180,7 @@
                     "deprecationMessage": "",
                     "rawdescription": "\n\nThis specifies any vertical and horizontal offset for the position of the dialog\n",
                     "description": "<p>This specifies any vertical and horizontal offset for the position of the dialog</p>\n",
-                    "line": 95,
+                    "line": 112,
                     "type": "literal type",
                     "decorators": []
                 },
@@ -39160,7 +39189,7 @@
                     "defaultValue": "false",
                     "deprecated": false,
                     "deprecationMessage": "",
-                    "line": 84,
+                    "line": 101,
                     "type": "boolean",
                     "decorators": []
                 },
@@ -39169,7 +39198,7 @@
                     "defaultValue": "\"bottom\"",
                     "deprecated": false,
                     "deprecationMessage": "",
-                    "line": 82,
+                    "line": 99,
                     "type": "\"bottom\" | \"top\"",
                     "decorators": []
                 },
@@ -39180,7 +39209,7 @@
                     "deprecationMessage": "",
                     "rawdescription": "\n\nThis appends additional classes to the overflow trigger/button.\n",
                     "description": "<p>This appends additional classes to the overflow trigger/button.</p>\n",
-                    "line": 102,
+                    "line": 119,
                     "type": "string",
                     "decorators": []
                 },
@@ -39189,9 +39218,121 @@
                     "defaultValue": "\"\"",
                     "deprecated": false,
                     "deprecationMessage": "",
-                    "line": 97,
+                    "line": 114,
                     "type": "string",
                     "decorators": []
+                },
+                {
+                    "name": "align",
+                    "defaultValue": "\"bottom\"",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "rawdescription": "\n\nSet popover alignment\n",
+                    "description": "<p>Set popover alignment</p>\n",
+                    "line": 32,
+                    "type": "\"top\" | \"top-left\" | \"top-right\" | \"bottom\" | \"bottom-left\" | \"bottom-right\" | \"left\" | \"left-bottom\" | \"left-top\" | \"right\" | \"right-bottom\" | \"right-top\"",
+                    "decorators": [],
+                    "inheritance": {
+                        "file": "BaseIconButton"
+                    }
+                },
+                {
+                    "name": "autoAlign",
+                    "defaultValue": "false",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "rawdescription": "\n\n**Experimental**: Use floating-ui to position the tooltip\nThis is not toggleable - should be assigned once\n",
+                    "description": "<p><strong>Experimental</strong>: Use floating-ui to position the tooltip\nThis is not toggleable - should be assigned once</p>\n",
+                    "line": 40,
+                    "type": "boolean",
+                    "decorators": [],
+                    "inheritance": {
+                        "file": "BaseIconButton"
+                    }
+                },
+                {
+                    "name": "caret",
+                    "defaultValue": "true",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "rawdescription": "\n\nSet to `false` to hide caret\n",
+                    "description": "<p>Set to <code>false</code> to hide caret</p>\n",
+                    "line": 16,
+                    "type": "boolean",
+                    "decorators": [],
+                    "inheritance": {
+                        "file": "BaseIconButton"
+                    }
+                },
+                {
+                    "name": "dropShadow",
+                    "defaultValue": "true",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "rawdescription": "\n\nSet to `false` to hide shadow\n",
+                    "description": "<p>Set to <code>false</code> to hide shadow</p>\n",
+                    "line": 20,
+                    "type": "boolean",
+                    "decorators": [],
+                    "inheritance": {
+                        "file": "BaseIconButton"
+                    }
+                },
+                {
+                    "name": "enterDelayMs",
+                    "defaultValue": "100",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "rawdescription": "\n\nSet delay before tooltip is shown\n",
+                    "description": "<p>Set delay before tooltip is shown</p>\n",
+                    "line": 44,
+                    "type": "number",
+                    "decorators": [],
+                    "inheritance": {
+                        "file": "BaseIconButton"
+                    }
+                },
+                {
+                    "name": "highContrast",
+                    "defaultValue": "true",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "rawdescription": "\n\nSet to `true` to enable high contrast\n",
+                    "description": "<p>Set to <code>true</code> to enable high contrast</p>\n",
+                    "line": 24,
+                    "type": "boolean",
+                    "decorators": [],
+                    "inheritance": {
+                        "file": "BaseIconButton"
+                    }
+                },
+                {
+                    "name": "isOpen",
+                    "defaultValue": "false",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "rawdescription": "\n\nSet to `true` to have the popover open by default\n",
+                    "description": "<p>Set to <code>true</code> to have the popover open by default</p>\n",
+                    "line": 28,
+                    "type": "boolean",
+                    "decorators": [],
+                    "inheritance": {
+                        "file": "BaseIconButton"
+                    }
+                },
+                {
+                    "name": "leaveDelayMs",
+                    "defaultValue": "300",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "rawdescription": "\n\nSet delay when tooltip disappears\n",
+                    "description": "<p>Set delay when tooltip disappears</p>\n",
+                    "line": 48,
+                    "type": "number",
+                    "decorators": [],
+                    "inheritance": {
+                        "file": "BaseIconButton"
+                    }
                 }
             ],
             "outputsClass": [
@@ -39200,7 +39341,7 @@
                     "defaultValue": "new EventEmitter<boolean>()",
                     "deprecated": false,
                     "deprecationMessage": "",
-                    "line": 86,
+                    "line": 103,
                     "type": "EventEmitter"
                 }
             ],
@@ -39212,7 +39353,7 @@
                     "type": "OverflowMenuDirective",
                     "optional": false,
                     "description": "",
-                    "line": 104,
+                    "line": 121,
                     "decorators": [
                         {
                             "name": "ContentChild",
@@ -39238,7 +39379,7 @@
                     "optional": false,
                     "returnType": "void",
                     "typeParameters": [],
-                    "line": 108,
+                    "line": 127,
                     "deprecated": false,
                     "deprecationMessage": "",
                     "jsdoctags": [
@@ -39263,7 +39404,7 @@
             "description": "<p>The OverFlow menu component encapsulates the OverFlowMenu directive, and the menu iconography into one convienent component.</p>\n<p>Get started with importing the module:</p>\n<b>Example :</b><div><pre class=\"line-numbers\"><code class=\"language-typescript\">import { DialogModule } from &#39;carbon-components-angular&#39;;</code></pre></div><b>Example :</b><div><pre class=\"line-numbers\"><code class=\"language-html\">&lt;cds-overflow-menu&gt;\n    &lt;cds-overflow-menu-option&gt;Option 1&lt;/cds-overflow-menu-option&gt;\n    &lt;cds-overflow-menu-option&gt;Option 2&lt;/cds-overflow-menu-option&gt;\n&lt;/cds-overflow-menu&gt;</code></pre></div><p><a href=\"../../?path=/story/components-overflow-menu--basic\">See demo</a></p>\n",
             "rawdescription": "\n\nThe OverFlow menu component encapsulates the OverFlowMenu directive, and the menu iconography into one convienent component.\n\nGet started with importing the module:\n\n```typescript\nimport { DialogModule } from 'carbon-components-angular';\n```\n\n```html\n<cds-overflow-menu>\n\t<cds-overflow-menu-option>Option 1</cds-overflow-menu-option>\n\t<cds-overflow-menu-option>Option 2</cds-overflow-menu-option>\n</cds-overflow-menu>\n```\n\n[See demo](../../?path=/story/components-overflow-menu--basic)\n",
             "type": "component",
-            "sourceCode": "import {\n\tComponent,\n\tContentChild,\n\tElementRef,\n\tEventEmitter,\n\tInput,\n\tOutput,\n\tTemplateRef,\n\tViewEncapsulation\n} from \"@angular/core\";\nimport { I18n } from \"carbon-components-angular/i18n\";\nimport { OverflowMenuDirective } from \"./overflow-menu.directive\";\n\n/**\n * The OverFlow menu component encapsulates the OverFlowMenu directive, and the menu iconography into one convienent component.\n *\n * Get started with importing the module:\n *\n * ```typescript\n * import { DialogModule } from 'carbon-components-angular';\n * ```\n *\n * ```html\n * <cds-overflow-menu>\n *\t<cds-overflow-menu-option>Option 1</cds-overflow-menu-option>\n *\t<cds-overflow-menu-option>Option 2</cds-overflow-menu-option>\n * </cds-overflow-menu>\n * ```\n *\n * [See demo](../../?path=/story/components-overflow-menu--basic)\n */\n@Component({\n\tselector: \"cds-overflow-menu, ibm-overflow-menu\",\n\ttemplate: `\n\t\t<button\n\t\t\t[cdsOverflowMenu]=\"options\"\n\t\t\t[ngClass]=\"{'cds--overflow-menu--open': open}\"\n\t\t\tclass=\"cds--overflow-menu {{triggerClass}}\"\n\t\t\t[attr.aria-label]=\"buttonLabel\"\n\t\t\t[flip]=\"flip\"\n\t\t\t[isOpen]=\"open\"\n\t\t\t(isOpenChange)=\"handleOpenChange($event)\"\n\t\t\t[offset]=\"offset\"\n\t\t\t[wrapperClass]=\"wrapperClass\"\n\t\t\taria-haspopup=\"true\"\n\t\t\tclass=\"cds--overflow-menu\"\n\t\t\ttype=\"button\"\n\t\t\t[placement]=\"placement\">\n\t\t\t<ng-template *ngIf=\"customTrigger; else defaultIcon\" [ngTemplateOutlet]=\"customTrigger\"></ng-template>\n\t\t</button>\n\t\t<ng-template #options>\n\t\t\t<ng-content></ng-content>\n\t\t</ng-template>\n\t\t<ng-template #defaultIcon>\n\t\t\t<svg cdsIcon=\"overflow-menu--vertical\" size=\"16\" class=\"cds--overflow-menu__icon\"></svg>\n\t\t</ng-template>\n\t`,\n\tstyles: [`\n\t\t.cds--overflow-menu--open {\n\t\t\topacity: 1\n\t\t}\n\n\t\t/*\n\t\tRotate the overflow menu container as well as the icon, since\n\t\twe calculate our menu position based on the container, not the icon.\n\t\t*/\n\t\t.cds--data-table-v2 .cds--overflow-menu {\n\t\t\ttransform: rotate(90deg);\n\t\t}\n\n\t\t.cds--data-table-v2 .cds--overflow-menu__icon {\n\t\t\ttransform: rotate(180deg);\n\t\t}\n\t`],\n\tencapsulation: ViewEncapsulation.None\n})\nexport class OverflowMenu {\n\t@Input() buttonLabel = this.i18n.get().OVERFLOW_MENU.OVERFLOW;\n\n\t@Input() flip = false;\n\n\t@Input() placement: \"bottom\" | \"top\" = \"bottom\";\n\n\t@Input() open = false;\n\n\t@Output() openChange = new EventEmitter<boolean>();\n\t/**\n\t * Sets the custom overflow menu trigger\n\t */\n\t@Input() customTrigger: TemplateRef<any>;\n\n\t/**\n\t * This specifies any vertical and horizontal offset for the position of the dialog\n\t */\n\t@Input() offset: { x: number, y: number };\n\n\t@Input() wrapperClass = \"\";\n\n\t/**\n\t * This appends additional classes to the overflow trigger/button.\n\t */\n\t@Input() triggerClass = \"\";\n\n\t@ContentChild(OverflowMenuDirective) overflowMenuDirective: OverflowMenuDirective;\n\n\tconstructor(protected elementRef: ElementRef, protected i18n: I18n) {}\n\n\thandleOpenChange(event: boolean) {\n\t\tthis.open = event;\n\t\tthis.openChange.emit(event);\n\t}\n}\n",
+            "sourceCode": "import {\n\tComponent,\n\tContentChild,\n\tElementRef,\n\tEventEmitter,\n\tInput,\n\tOutput,\n\tTemplateRef,\n\tViewEncapsulation\n} from \"@angular/core\";\nimport { I18n } from \"carbon-components-angular/i18n\";\nimport { OverflowMenuDirective } from \"./overflow-menu.directive\";\nimport { BaseIconButton } from \"carbon-components-angular/button\";\n\n/**\n * The OverFlow menu component encapsulates the OverFlowMenu directive, and the menu iconography into one convienent component.\n *\n * Get started with importing the module:\n *\n * ```typescript\n * import { DialogModule } from 'carbon-components-angular';\n * ```\n *\n * ```html\n * <cds-overflow-menu>\n *\t<cds-overflow-menu-option>Option 1</cds-overflow-menu-option>\n *\t<cds-overflow-menu-option>Option 2</cds-overflow-menu-option>\n * </cds-overflow-menu>\n * ```\n *\n * [See demo](../../?path=/story/components-overflow-menu--basic)\n */\n@Component({\n\tselector: \"cds-overflow-menu, ibm-overflow-menu\",\n\ttemplate: `\n\t\t<cds-tooltip\n\t\t\tclass=\"cds--icon-tooltip\"\n\t\t\t[description]=\"description\"\n\t\t\t[caret]=\"caret\"\n\t\t\t[dropShadow]=\"dropShadow\"\n\t\t\t[highContrast]=\"highContrast\"\n\t\t\t[isOpen]=\"isOpen\"\n\t\t\t[align]=\"align\"\n\t\t\t[autoAlign]=\"autoAlign\"\n\t\t\t[enterDelayMs]=\"enterDelayMs\"\n\t\t\t[leaveDelayMs]=\"leaveDelayMs\">\n\t\t\t<button\n\t\t\t\tcdsButton=\"ghost\"\n\t\t\t\t[cdsOverflowMenu]=\"options\"\n\t\t\t\t[ngClass]=\"{'cds--overflow-menu--open': open}\"\n\t\t\t\tclass=\"cds--overflow-menu {{triggerClass}}\"\n\t\t\t\t[iconOnly]=\"true\"\n\t\t\t\t[attr.aria-label]=\"buttonLabel\"\n\t\t\t\t[flip]=\"flip\"\n\t\t\t\t[isOpen]=\"open\"\n\t\t\t\t(isOpenChange)=\"handleOpenChange($event)\"\n\t\t\t\t[offset]=\"offset\"\n\t\t\t\t[wrapperClass]=\"wrapperClass\"\n\t\t\t\taria-haspopup=\"true\"\n\t\t\t\ttype=\"button\"\n\t\t\t\t[placement]=\"placement\">\n\t\t\t\t<ng-template *ngIf=\"customTrigger; else defaultIcon\" [ngTemplateOutlet]=\"customTrigger\"></ng-template>\n\t\t\t</button>\n\t\t</cds-tooltip>\n\n\t\t<ng-template #options>\n\t\t\t<ng-content></ng-content>\n\t\t</ng-template>\n\t\t<ng-template #defaultIcon>\n\t\t\t<svg cdsIcon=\"overflow-menu--vertical\" size=\"16\" class=\"cds--overflow-menu__icon\"></svg>\n\t\t</ng-template>\n\t`,\n\tstyles: [`\n\t\t.cds--overflow-menu--open {\n\t\t\topacity: 1\n\t\t}\n\n\t\t/*\n\t\tRotate the overflow menu container as well as the icon, since\n\t\twe calculate our menu position based on the container, not the icon.\n\t\t*/\n\t\t.cds--data-table-v2 .cds--overflow-menu {\n\t\t\ttransform: rotate(90deg);\n\t\t}\n\n\t\t.cds--data-table-v2 .cds--overflow-menu__icon {\n\t\t\ttransform: rotate(180deg);\n\t\t}\n\t`],\n\tencapsulation: ViewEncapsulation.None\n})\nexport class OverflowMenu extends BaseIconButton {\n\t@Input() buttonLabel = this.i18n.get().OVERFLOW_MENU.OVERFLOW;\n\n\t@Input() description = this.i18n.get().OVERFLOW_MENU.ICON_DESCRIPTION;\n\n\t@Input() flip = false;\n\n\t@Input() placement: \"bottom\" | \"top\" = \"bottom\";\n\n\t@Input() open = false;\n\n\t@Output() openChange = new EventEmitter<boolean>();\n\t/**\n\t * Sets the custom overflow menu trigger\n\t */\n\t@Input() customTrigger: TemplateRef<any>;\n\n\t/**\n\t * This specifies any vertical and horizontal offset for the position of the dialog\n\t */\n\t@Input() offset: { x: number, y: number };\n\n\t@Input() wrapperClass = \"\";\n\n\t/**\n\t * This appends additional classes to the overflow trigger/button.\n\t */\n\t@Input() triggerClass = \"\";\n\n\t@ContentChild(OverflowMenuDirective) overflowMenuDirective: OverflowMenuDirective;\n\n\tconstructor(protected elementRef: ElementRef, protected i18n: I18n) {\n\t\tsuper();\n\t}\n\n\thandleOpenChange(event: boolean) {\n\t\tthis.open = event;\n\t\tthis.openChange.emit(event);\n\t}\n}\n",
             "assetsDirs": [],
             "styleUrlsData": "",
             "stylesData": "\n\t\t.cds--overflow-menu--open {\n\t\t\topacity: 1\n\t\t}\n\n\t\t/*\n\t\tRotate the overflow menu container as well as the icon, since\n\t\twe calculate our menu position based on the container, not the icon.\n\t\t*/\n\t\t.cds--data-table-v2 .cds--overflow-menu {\n\t\t\ttransform: rotate(90deg);\n\t\t}\n\n\t\t.cds--data-table-v2 .cds--overflow-menu__icon {\n\t\t\ttransform: rotate(180deg);\n\t\t}\n\t\n",
@@ -39286,7 +39427,7 @@
                         "deprecationMessage": ""
                     }
                 ],
-                "line": 104,
+                "line": 121,
                 "jsdoctags": [
                     {
                         "name": "elementRef",
@@ -39308,7 +39449,9 @@
                     }
                 ]
             },
-            "extends": []
+            "extends": [
+                "BaseIconButton"
+            ]
         },
         {
             "name": "OverflowMenuCustomPane",
@@ -68626,13 +68769,13 @@
         },
         {
             "name": "BreadcrumbModule",
-            "id": "module-BreadcrumbModule-90b6d8186e21e24a02f0f43bbbbee27d83e1c3c91438d5f5ef8389128661f2132ebcd76d25dca13ea605d85c0cc7cbe81dc4d4606638748598449130781f4cd2",
+            "id": "module-BreadcrumbModule-136f75a31aee3841f41ff9d7178ab0707770b9ccd9f8f1dfdd28d4408511b05804aa608c25147f19a9b1348293d70435f1bbdc3d25704aacd328b0cc075478c0",
             "description": "",
             "deprecationMessage": "",
             "deprecated": false,
             "file": "src/breadcrumb/breadcrumb.module.ts",
             "methods": [],
-            "sourceCode": "import { NgModule } from \"@angular/core\";\nimport { CommonModule } from \"@angular/common\";\n\nimport { DialogModule } from \"carbon-components-angular/dialog\";\nimport { I18nModule } from \"carbon-components-angular/i18n\";\n\nimport { Breadcrumb } from \"./breadcrumb.component\";\nimport { BreadcrumbItemComponent } from \"./breadcrumb-item.component\";\n\n@NgModule({\n\tdeclarations: [\n\t\tBreadcrumb,\n\t\tBreadcrumbItemComponent\n\t],\n\texports: [\n\t\tBreadcrumb,\n\t\tBreadcrumbItemComponent\n\t],\n\timports: [\n\t\tCommonModule,\n\t\tDialogModule,\n\t\tI18nModule\n\t]\n})\nexport class BreadcrumbModule { }\n",
+            "sourceCode": "import { NgModule } from \"@angular/core\";\nimport { CommonModule } from \"@angular/common\";\n\nimport { DialogModule } from \"carbon-components-angular/dialog\";\nimport { I18nModule } from \"carbon-components-angular/i18n\";\n\nimport { Breadcrumb } from \"./breadcrumb.component\";\nimport { BreadcrumbItemComponent } from \"./breadcrumb-item.component\";\nimport { ButtonModule } from \"carbon-components-angular/button\";\nimport { IconModule } from \"carbon-components-angular/icon\";\n\n@NgModule({\n\tdeclarations: [\n\t\tBreadcrumb,\n\t\tBreadcrumbItemComponent\n\t],\n\texports: [\n\t\tBreadcrumb,\n\t\tBreadcrumbItemComponent\n\t],\n\timports: [\n\t\tCommonModule,\n\t\tButtonModule,\n\t\tDialogModule,\n\t\tI18nModule,\n\t\tIconModule\n\t]\n})\nexport class BreadcrumbModule { }\n",
             "children": [
                 {
                     "type": "providers",
@@ -68652,11 +68795,17 @@
                 {
                     "type": "imports",
                     "elements": [
+                        {
+                            "name": "ButtonModule"
+                        },
                         {
                             "name": "DialogModule"
                         },
                         {
                             "name": "I18nModule"
+                        },
+                        {
+                            "name": "IconModule"
                         }
                     ]
                 },
@@ -69222,13 +69371,13 @@
         },
         {
             "name": "DialogModule",
-            "id": "module-DialogModule-317c87c3f6ab148ba8b406333a25dda4f0418062758bc883705b6979ac876f7e1a2ebb40e48ef87115d695202c132f4c57b3d6fcdd11848daca20135d19bed6d",
+            "id": "module-DialogModule-f1dc81a45ce1eb89e0d92553b0274dc12a6d4bf84cd9a268e3d5f99c3dac14b3608f6a47456b44f06d47e5475d37a4a31cb7329e2841b496443f6d22eca6fcb4",
             "description": "",
             "deprecationMessage": "",
             "deprecated": false,
             "file": "src/dialog/dialog.module.ts",
             "methods": [],
-            "sourceCode": "// modules\nimport { NgModule } from \"@angular/core\";\nimport { CommonModule } from \"@angular/common\";\n\n// imports\nimport { DialogService } from \"./dialog.service\";\nimport { Dialog } from \"./dialog.component\";\nimport { DialogDirective } from \"./dialog.directive\";\n\nimport { OverflowMenu } from \"./overflow-menu/overflow-menu.component\";\nimport { OverflowMenuPane } from \"./overflow-menu/overflow-menu-pane.component\";\nimport { OverflowMenuCustomPane } from \"./overflow-menu/overflow-menu-custom-pane.component\";\nimport { OverflowMenuDirective } from \"./overflow-menu/overflow-menu.directive\";\nimport { OverflowMenuOption } from \"./overflow-menu/overflow-menu-option.component\";\nimport { I18nModule } from \"carbon-components-angular/i18n\";\nimport { PlaceholderModule } from \"carbon-components-angular/placeholder\";\nimport { ExperimentalModule } from \"carbon-components-angular/experimental\";\nimport { UtilsModule } from \"carbon-components-angular/utils\";\nimport { IconModule } from \"carbon-components-angular/icon\";\n\n@NgModule({\n\tdeclarations: [\n\t\tDialog,\n\t\tOverflowMenu,\n\t\tOverflowMenuPane,\n\t\tOverflowMenuCustomPane,\n\t\tDialogDirective,\n\t\tOverflowMenuDirective,\n\t\tOverflowMenuOption\n\t],\n\texports: [\n\t\tDialog,\n\t\tOverflowMenu,\n\t\tOverflowMenuPane,\n\t\tOverflowMenuCustomPane,\n\t\tDialogDirective,\n\t\tOverflowMenuDirective,\n\t\tOverflowMenuOption\n\t],\n\tproviders: [ DialogService ],\n\timports: [\n\t\tCommonModule,\n\t\tI18nModule,\n\t\tPlaceholderModule,\n\t\tExperimentalModule,\n\t\tUtilsModule,\n\t\tIconModule\n\t]\n})\nexport class DialogModule {}\n",
+            "sourceCode": "// modules\nimport { NgModule } from \"@angular/core\";\nimport { CommonModule } from \"@angular/common\";\n\n// imports\nimport { DialogService } from \"./dialog.service\";\nimport { Dialog } from \"./dialog.component\";\nimport { DialogDirective } from \"./dialog.directive\";\n\nimport { OverflowMenu } from \"./overflow-menu/overflow-menu.component\";\nimport { OverflowMenuPane } from \"./overflow-menu/overflow-menu-pane.component\";\nimport { OverflowMenuCustomPane } from \"./overflow-menu/overflow-menu-custom-pane.component\";\nimport { OverflowMenuDirective } from \"./overflow-menu/overflow-menu.directive\";\nimport { OverflowMenuOption } from \"./overflow-menu/overflow-menu-option.component\";\nimport { I18nModule } from \"carbon-components-angular/i18n\";\nimport { PlaceholderModule } from \"carbon-components-angular/placeholder\";\nimport { ExperimentalModule } from \"carbon-components-angular/experimental\";\nimport { UtilsModule } from \"carbon-components-angular/utils\";\nimport { IconModule } from \"carbon-components-angular/icon\";\nimport { ButtonModule } from \"carbon-components-angular/button\";\nimport { TooltipModule } from \"carbon-components-angular/tooltip\";\n\n@NgModule({\n\tdeclarations: [\n\t\tDialog,\n\t\tOverflowMenu,\n\t\tOverflowMenuPane,\n\t\tOverflowMenuCustomPane,\n\t\tDialogDirective,\n\t\tOverflowMenuDirective,\n\t\tOverflowMenuOption\n\t],\n\texports: [\n\t\tDialog,\n\t\tOverflowMenu,\n\t\tOverflowMenuPane,\n\t\tOverflowMenuCustomPane,\n\t\tDialogDirective,\n\t\tOverflowMenuDirective,\n\t\tOverflowMenuOption\n\t],\n\tproviders: [ DialogService ],\n\timports: [\n\t\tCommonModule,\n\t\tI18nModule,\n\t\tPlaceholderModule,\n\t\tExperimentalModule,\n\t\tUtilsModule,\n\t\tIconModule,\n\t\tButtonModule,\n\t\tTooltipModule\n\t]\n})\nexport class DialogModule {}\n",
             "children": [
                 {
                     "type": "providers",
@@ -69267,6 +69416,9 @@
                 {
                     "type": "imports",
                     "elements": [
+                        {
+                            "name": "ButtonModule"
+                        },
                         {
                             "name": "ExperimentalModule"
                         },
@@ -69279,6 +69431,9 @@
                         {
                             "name": "PlaceholderModule"
                         },
+                        {
+                            "name": "TooltipModule"
+                        },
                         {
                             "name": "UtilsModule"
                         }
@@ -83973,8 +84128,8 @@
                 "type": "component",
                 "linktype": "component",
                 "name": "Breadcrumb",
-                "coveragePercent": 20,
-                "coverageCount": "2/10",
+                "coveragePercent": 25,
+                "coverageCount": "3/12",
                 "status": "low"
             },
             {
@@ -85231,9 +85386,9 @@
                 "type": "component",
                 "linktype": "component",
                 "name": "OverflowMenu",
-                "coveragePercent": 30,
-                "coverageCount": "4/13",
-                "status": "medium"
+                "coveragePercent": 54,
+                "coverageCount": "12/22",
+                "status": "good"
             },
             {
                 "filePath": "src/dialog/overflow-menu/overflow-menu.directive.ts",