@viasat/beam-web-components 2.38.0 → 2.38.1

package/custom-elements.json

@@ -292,138 +292,6 @@
         }
       ]
     },
-    {
-      "kind": "javascript-module",
-      "path": "libs/web-components/src/lib/BadgeDot/BadgeDot.ts",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "`bm-badge-dot`\n\n### Attributes:\n- **theme**  - Specify the theme of the BadgeDot. By default it inherits the theme from the parent\n- **appearance**  - Specify the appearance of the BadgeDot\n- **emphasis**  - Specify the emphasis of the BadgeDot\n- **overrideDotColor**  - Overrides default dot color",
-          "name": "BmBadgeDot",
-          "slots": [
-            {
-              "description": "Provide text for the BadgeDot",
-              "name": "default"
-            }
-          ],
-          "members": [
-            {
-              "kind": "field",
-              "name": "theme",
-              "type": {
-                "text": "'light' | 'dark' | undefined"
-              },
-              "description": "Specify the theme of the BadgeDot. By default it inherits the theme from the parent",
-              "attribute": "theme"
-            },
-            {
-              "kind": "field",
-              "name": "appearance",
-              "type": {
-                "text": "'infoPrimary' | 'infoSecondary' | 'positive' | 'warning' | 'negative'"
-              },
-              "default": "'infoPrimary'",
-              "description": "Specify the appearance of the BadgeDot",
-              "attribute": "appearance"
-            },
-            {
-              "kind": "field",
-              "name": "emphasis",
-              "type": {
-                "text": "'strong' | 'subtle'"
-              },
-              "default": "'strong'",
-              "description": "Specify the emphasis of the BadgeDot",
-              "attribute": "emphasis"
-            },
-            {
-              "kind": "field",
-              "name": "overrideDotColor",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "Overrides default dot color",
-              "attribute": "overrideDotColor"
-            }
-          ],
-          "attributes": [
-            {
-              "name": "theme",
-              "type": {
-                "text": "'light' | 'dark' | undefined"
-              },
-              "description": "Specify the theme of the BadgeDot. By default it inherits the theme from the parent",
-              "fieldName": "theme"
-            },
-            {
-              "name": "appearance",
-              "type": {
-                "text": "'infoPrimary' | 'infoSecondary' | 'positive' | 'warning' | 'negative'"
-              },
-              "default": "'infoPrimary'",
-              "description": "Specify the appearance of the BadgeDot",
-              "fieldName": "appearance"
-            },
-            {
-              "name": "emphasis",
-              "type": {
-                "text": "'strong' | 'subtle'"
-              },
-              "default": "'strong'",
-              "description": "Specify the emphasis of the BadgeDot",
-              "fieldName": "emphasis"
-            },
-            {
-              "name": "overrideDotColor",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "Overrides default dot color",
-              "fieldName": "overrideDotColor"
-            }
-          ],
-          "superclass": {
-            "name": "LitElement",
-            "package": "lit"
-          },
-          "tagName": "bm-badge-dot",
-          "customElement": true
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "BmBadgeDot",
-          "declaration": {
-            "name": "BmBadgeDot",
-            "module": "libs/web-components/src/lib/BadgeDot/BadgeDot.ts"
-          }
-        },
-        {
-          "kind": "custom-element-definition",
-          "name": "bm-badge-dot",
-          "declaration": {
-            "name": "BmBadgeDot",
-            "module": "libs/web-components/src/lib/BadgeDot/BadgeDot.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "libs/web-components/src/lib/BadgeDot/index.ts",
-      "declarations": [],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "*",
-          "declaration": {
-            "name": "*",
-            "package": "./BadgeDot"
-          }
-        }
-      ]
-    },
     {
       "kind": "javascript-module",
       "path": "libs/web-components/src/lib/Badge/Badge.ts",
@@ -581,686 +449,805 @@
     },
     {
       "kind": "javascript-module",
-      "path": "libs/web-components/src/lib/Box/Box.ts",
+      "path": "libs/web-components/src/lib/Alert/Alert.ts",
       "declarations": [
         {
           "kind": "class",
-          "description": "`bm-box`\n\n### Attributes:\n- **backgroundColor**  - Specify the background color of a Box\n- **borderColor**  - Specify the border color of a Box\n- **borderWidth**  - Specify the border width of a Box\n- **borderRadius**  - Specify the border radius of a Box\n- **px**  - Specify before and after padding of a Box\n- **py**  - Specify top and bottom padding of a Box\n- **pTop**  - Specify top padding of a Box\n- **pBottom**  - Specify bottom padding of a Box\n- **pBefore**  - Specify before padding of a Box\n- **pAfter**  - Specify after padding of a Box\n- **mx**  - Specify before and after margin of a Box\n- **my**  - Specify top and bottom margin of a Box\n- **mTop**  - Specify top margin of a Box\n- **mBottom**  - Specify bottom margin of a Box\n- **mBefore**  - Specify before margin of a Box\n- **mAfter**  - Specify after margin of a Box\n- **m**  - Specify all margin\n- **p**  - Specify all padding\n- **gap**  - Specify gap between child elements\n- **shadow**  - Specify if a Box has a shadow",
-          "name": "BmBox",
+          "description": "`bm-alert`\n\n### Attributes:\n- **heading**  - Specify the heading text for Alert\n- **body**  - Specify the body text for Alert\n- **size**  - Specify the size of the Alert\n- **fullWidth**  - Specify if the Alert has no border radius\n- **theme**  - Specify the theme of the Alert. By default it inherits the theme from the parent\n- **appearance**  - Specify the appearance of the Alert\n- **hidden**  - Specify if the Alert is hidden\n- **hideIcon**  - Specify if the icon displays on the Alert\n- **dismissible**  - Specify if the Alert can be dismissed\n- **disableAutoFocus**  - Prevent autofocus on show\n- **disableCloseOnEscape**  - Prevent Escape from closing",
+          "name": "BmAlert",
           "slots": [
             {
-              "description": "Provide content for the Box",
-              "name": "default"
+              "description": "Specify a different icon for the Alert",
+              "name": "icon"
+            },
+            {
+              "description": "Specify the heading text for Alert or pass the `heading` attribute to set the heading",
+              "name": "heading"
+            },
+            {
+              "description": "Specify the body text for Alert or pass the `body` attribute to set the body",
+              "name": "body"
+            },
+            {
+              "description": "Specify if actions display on the Alert",
+              "name": "actions"
             }
           ],
           "members": [
             {
               "kind": "field",
-              "name": "backgroundColor",
+              "name": "heading",
               "type": {
-                "text": "'positive' | 'warning' | 'negative' | 'inverse' | 'selected' | 'expressive' | '00' | '00-alt' | '01' | '02' | '03' | 'info-primary' | 'info-secondary' | 'positive-strong' | 'warning-strong' | 'negative-strong' | 'info-primary-strong' | 'info-secondary-strong' | 'selected-subtle' | 'highlight' | 'transparent' | 'expressive-stronger' | 'expressive-inverse' | undefined"
+                "text": "string | undefined"
               },
-              "description": "Specify the background color of a Box",
-              "attribute": "backgroundColor"
+              "description": "Specify the heading text for Alert",
+              "attribute": "heading"
             },
             {
               "kind": "field",
-              "name": "borderColor",
+              "name": "body",
               "type": {
-                "text": "'positive' | 'warning' | 'negative' | 'inverse' | 'selected' | 'expressive' | 'strong' | '00' | '00-alt' | '01' | '02' | '03' | 'info-primary' | 'info-secondary' | 'positive-strong' | 'warning-strong' | 'negative-strong' | 'info-primary-strong' | 'info-secondary-strong' | 'transparent' | 'expressive-stronger' | 'focus' | undefined"
+                "text": "string | undefined"
               },
-              "description": "Specify the border color of a Box",
-              "attribute": "borderColor"
+              "description": "Specify the body text for Alert",
+              "attribute": "body"
             },
             {
               "kind": "field",
-              "name": "borderWidth",
+              "name": "size",
               "type": {
-                "text": "'md' | 'lg' | 'xl' | 'none' | 'divider' | undefined"
+                "text": "'sm' | 'md'"
               },
-              "description": "Specify the border width of a Box",
-              "attribute": "borderWidth"
+              "default": "'sm'",
+              "description": "Specify the size of the Alert",
+              "attribute": "size"
             },
             {
               "kind": "field",
-              "name": "borderRadius",
+              "name": "fullWidth",
               "type": {
-                "text": "'xs' | 'sm' | 'md' | 'lg' | 'none' | 'round' | undefined"
+                "text": "boolean"
               },
-              "description": "Specify the border radius of a Box",
-              "attribute": "borderRadius"
+              "default": "false",
+              "description": "Specify if the Alert has no border radius",
+              "attribute": "fullWidth"
             },
             {
               "kind": "field",
-              "name": "px",
+              "name": "theme",
               "type": {
-                "text": "'0' | '12' | '25' | '50' | '75' | '100' | '125' | '150' | '200' | '300' | '400' | '500' | '700' | '800' | undefined"
+                "text": "'light' | 'dark' | undefined"
               },
-              "description": "Specify before and after padding of a Box",
-              "attribute": "px"
+              "description": "Specify the theme of the Alert. By default it inherits the theme from the parent",
+              "attribute": "theme"
             },
             {
               "kind": "field",
-              "name": "py",
+              "name": "appearance",
               "type": {
-                "text": "'0' | '12' | '25' | '50' | '75' | '100' | '125' | '150' | '200' | '300' | '400' | '500' | '700' | '800' | undefined"
+                "text": "'infoPrimary' | 'infoSecondary' | 'positive' | 'warning' | 'negative'"
               },
-              "description": "Specify top and bottom padding of a Box",
-              "attribute": "py"
+              "default": "'infoPrimary'",
+              "description": "Specify the appearance of the Alert",
+              "attribute": "appearance"
             },
             {
               "kind": "field",
-              "name": "pTop",
+              "name": "hidden",
               "type": {
-                "text": "'0' | '12' | '25' | '50' | '75' | '100' | '125' | '150' | '200' | '300' | '400' | '500' | '700' | '800' | undefined"
+                "text": "boolean"
               },
-              "description": "Specify top padding of a Box",
-              "attribute": "pTop"
+              "default": "false",
+              "description": "Specify if the Alert is hidden",
+              "attribute": "hidden"
             },
             {
               "kind": "field",
-              "name": "pBottom",
+              "name": "hideIcon",
               "type": {
-                "text": "'0' | '12' | '25' | '50' | '75' | '100' | '125' | '150' | '200' | '300' | '400' | '500' | '700' | '800' | undefined"
+                "text": "boolean"
               },
-              "description": "Specify bottom padding of a Box",
-              "attribute": "pBottom"
+              "default": "false",
+              "description": "Specify if the icon displays on the Alert",
+              "attribute": "hideIcon"
             },
             {
               "kind": "field",
-              "name": "pBefore",
+              "name": "dismissible",
               "type": {
-                "text": "'0' | '12' | '25' | '50' | '75' | '100' | '125' | '150' | '200' | '300' | '400' | '500' | '700' | '800' | undefined"
+                "text": "boolean"
               },
-              "description": "Specify before padding of a Box",
-              "attribute": "pBefore"
+              "default": "false",
+              "description": "Specify if the Alert can be dismissed",
+              "attribute": "dismissible"
             },
             {
               "kind": "field",
-              "name": "pAfter",
+              "name": "disableAutoFocus",
               "type": {
-                "text": "'0' | '12' | '25' | '50' | '75' | '100' | '125' | '150' | '200' | '300' | '400' | '500' | '700' | '800' | undefined"
+                "text": "boolean"
               },
-              "description": "Specify after padding of a Box",
-              "attribute": "pAfter"
+              "default": "false",
+              "description": "Prevent autofocus on show",
+              "attribute": "disableAutoFocus"
             },
             {
               "kind": "field",
-              "name": "mx",
+              "name": "disableCloseOnEscape",
               "type": {
-                "text": "'0' | '12' | '25' | '50' | '75' | '100' | '125' | '150' | '200' | '300' | '400' | '500' | '700' | '800' | undefined"
+                "text": "boolean"
               },
-              "description": "Specify before and after margin of a Box",
-              "attribute": "mx"
-            },
+              "default": "false",
+              "description": "Prevent Escape from closing",
+              "attribute": "disableCloseOnEscape"
+            }
+          ],
+          "events": [
             {
-              "kind": "field",
-              "name": "my",
+              "description": "Dispatched when the Alert has been dismissed",
+              "name": "bm-dismiss"
+            }
+          ],
+          "attributes": [
+            {
+              "name": "heading",
               "type": {
-                "text": "'0' | '12' | '25' | '50' | '75' | '100' | '125' | '150' | '200' | '300' | '400' | '500' | '700' | '800' | undefined"
+                "text": "string | undefined"
               },
-              "description": "Specify top and bottom margin of a Box",
-              "attribute": "my"
+              "description": "Specify the heading text for Alert",
+              "fieldName": "heading"
             },
             {
-              "kind": "field",
-              "name": "mTop",
+              "name": "body",
               "type": {
-                "text": "'0' | '12' | '25' | '50' | '75' | '100' | '125' | '150' | '200' | '300' | '400' | '500' | '700' | '800' | undefined"
+                "text": "string | undefined"
               },
-              "description": "Specify top margin of a Box",
-              "attribute": "mTop"
+              "description": "Specify the body text for Alert",
+              "fieldName": "body"
             },
             {
-              "kind": "field",
-              "name": "mBottom",
+              "name": "size",
               "type": {
-                "text": "'0' | '12' | '25' | '50' | '75' | '100' | '125' | '150' | '200' | '300' | '400' | '500' | '700' | '800' | undefined"
+                "text": "'sm' | 'md'"
               },
-              "description": "Specify bottom margin of a Box",
-              "attribute": "mBottom"
+              "default": "'sm'",
+              "description": "Specify the size of the Alert",
+              "fieldName": "size"
             },
             {
-              "kind": "field",
-              "name": "mBefore",
+              "name": "fullWidth",
               "type": {
-                "text": "'0' | '12' | '25' | '50' | '75' | '100' | '125' | '150' | '200' | '300' | '400' | '500' | '700' | '800' | undefined"
+                "text": "boolean"
               },
-              "description": "Specify before margin of a Box",
-              "attribute": "mBefore"
+              "default": "false",
+              "description": "Specify if the Alert has no border radius",
+              "fieldName": "fullWidth"
             },
             {
-              "kind": "field",
-              "name": "mAfter",
+              "name": "theme",
               "type": {
-                "text": "'0' | '12' | '25' | '50' | '75' | '100' | '125' | '150' | '200' | '300' | '400' | '500' | '700' | '800' | undefined"
+                "text": "'light' | 'dark' | undefined"
               },
-              "description": "Specify after margin of a Box",
-              "attribute": "mAfter"
+              "description": "Specify the theme of the Alert. By default it inherits the theme from the parent",
+              "fieldName": "theme"
+            },
+            {
+              "name": "appearance",
+              "type": {
+                "text": "'infoPrimary' | 'infoSecondary' | 'positive' | 'warning' | 'negative'"
+              },
+              "default": "'infoPrimary'",
+              "description": "Specify the appearance of the Alert",
+              "fieldName": "appearance"
+            },
+            {
+              "name": "hidden",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Specify if the Alert is hidden",
+              "fieldName": "hidden"
+            },
+            {
+              "name": "hideIcon",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Specify if the icon displays on the Alert",
+              "fieldName": "hideIcon"
+            },
+            {
+              "name": "dismissible",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Specify if the Alert can be dismissed",
+              "fieldName": "dismissible"
             },
+            {
+              "name": "disableAutoFocus",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Prevent autofocus on show",
+              "fieldName": "disableAutoFocus"
+            },
+            {
+              "name": "disableCloseOnEscape",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Prevent Escape from closing",
+              "fieldName": "disableCloseOnEscape"
+            }
+          ],
+          "superclass": {
+            "name": "LitElement",
+            "package": "lit"
+          },
+          "tagName": "bm-alert",
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "BmAlert",
+          "declaration": {
+            "name": "BmAlert",
+            "module": "libs/web-components/src/lib/Alert/Alert.ts"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "bm-alert",
+          "declaration": {
+            "name": "BmAlert",
+            "module": "libs/web-components/src/lib/Alert/Alert.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "libs/web-components/src/lib/Alert/index.ts",
+      "declarations": [],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "*",
+          "declaration": {
+            "name": "*",
+            "package": "./Alert"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "libs/web-components/src/lib/BadgeDot/BadgeDot.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "`bm-badge-dot`\n\n### Attributes:\n- **theme**  - Specify the theme of the BadgeDot. By default it inherits the theme from the parent\n- **appearance**  - Specify the appearance of the BadgeDot\n- **emphasis**  - Specify the emphasis of the BadgeDot\n- **overrideDotColor**  - Overrides default dot color",
+          "name": "BmBadgeDot",
+          "slots": [
+            {
+              "description": "Provide text for the BadgeDot",
+              "name": "default"
+            }
+          ],
+          "members": [
             {
               "kind": "field",
-              "name": "m",
+              "name": "theme",
               "type": {
-                "text": "'0' | '12' | '25' | '50' | '75' | '100' | '125' | '150' | '200' | '300' | '400' | '500' | '700' | '800' | undefined"
+                "text": "'light' | 'dark' | undefined"
               },
-              "description": "Specify all margin",
-              "attribute": "m"
+              "description": "Specify the theme of the BadgeDot. By default it inherits the theme from the parent",
+              "attribute": "theme"
             },
             {
               "kind": "field",
-              "name": "p",
+              "name": "appearance",
               "type": {
-                "text": "'0' | '12' | '25' | '50' | '75' | '100' | '125' | '150' | '200' | '300' | '400' | '500' | '700' | '800' | undefined"
+                "text": "'infoPrimary' | 'infoSecondary' | 'positive' | 'warning' | 'negative'"
               },
-              "description": "Specify all padding",
-              "attribute": "p"
+              "default": "'infoPrimary'",
+              "description": "Specify the appearance of the BadgeDot",
+              "attribute": "appearance"
             },
             {
               "kind": "field",
-              "name": "gap",
+              "name": "emphasis",
               "type": {
-                "text": "'0' | '12' | '25' | '50' | '75' | '100' | '125' | '150' | '200' | '300' | '400' | '500' | '700' | '800' | undefined"
+                "text": "'strong' | 'subtle'"
               },
-              "description": "Specify gap between child elements",
-              "attribute": "gap"
+              "default": "'strong'",
+              "description": "Specify the emphasis of the BadgeDot",
+              "attribute": "emphasis"
             },
             {
               "kind": "field",
-              "name": "shadow",
+              "name": "overrideDotColor",
               "type": {
-                "text": "'sm' | 'md' | 'lg' | 'none' | 'overlay' | undefined"
+                "text": "string | undefined"
               },
-              "description": "Specify if a Box has a shadow",
-              "attribute": "shadow"
+              "description": "Overrides default dot color",
+              "attribute": "overrideDotColor"
             }
           ],
           "attributes": [
             {
+              "name": "theme",
+              "type": {
+                "text": "'light' | 'dark' | undefined"
+              },
+              "description": "Specify the theme of the BadgeDot. By default it inherits the theme from the parent",
+              "fieldName": "theme"
+            },
+            {
+              "name": "appearance",
+              "type": {
+                "text": "'infoPrimary' | 'infoSecondary' | 'positive' | 'warning' | 'negative'"
+              },
+              "default": "'infoPrimary'",
+              "description": "Specify the appearance of the BadgeDot",
+              "fieldName": "appearance"
+            },
+            {
+              "name": "emphasis",
+              "type": {
+                "text": "'strong' | 'subtle'"
+              },
+              "default": "'strong'",
+              "description": "Specify the emphasis of the BadgeDot",
+              "fieldName": "emphasis"
+            },
+            {
+              "name": "overrideDotColor",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "Overrides default dot color",
+              "fieldName": "overrideDotColor"
+            }
+          ],
+          "superclass": {
+            "name": "LitElement",
+            "package": "lit"
+          },
+          "tagName": "bm-badge-dot",
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "BmBadgeDot",
+          "declaration": {
+            "name": "BmBadgeDot",
+            "module": "libs/web-components/src/lib/BadgeDot/BadgeDot.ts"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "bm-badge-dot",
+          "declaration": {
+            "name": "BmBadgeDot",
+            "module": "libs/web-components/src/lib/BadgeDot/BadgeDot.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "libs/web-components/src/lib/BadgeDot/index.ts",
+      "declarations": [],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "*",
+          "declaration": {
+            "name": "*",
+            "package": "./BadgeDot"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "libs/web-components/src/lib/Box/Box.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "`bm-box`\n\n### Attributes:\n- **backgroundColor**  - Specify the background color of a Box\n- **borderColor**  - Specify the border color of a Box\n- **borderWidth**  - Specify the border width of a Box\n- **borderRadius**  - Specify the border radius of a Box\n- **px**  - Specify before and after padding of a Box\n- **py**  - Specify top and bottom padding of a Box\n- **pTop**  - Specify top padding of a Box\n- **pBottom**  - Specify bottom padding of a Box\n- **pBefore**  - Specify before padding of a Box\n- **pAfter**  - Specify after padding of a Box\n- **mx**  - Specify before and after margin of a Box\n- **my**  - Specify top and bottom margin of a Box\n- **mTop**  - Specify top margin of a Box\n- **mBottom**  - Specify bottom margin of a Box\n- **mBefore**  - Specify before margin of a Box\n- **mAfter**  - Specify after margin of a Box\n- **m**  - Specify all margin\n- **p**  - Specify all padding\n- **gap**  - Specify gap between child elements\n- **shadow**  - Specify if a Box has a shadow",
+          "name": "BmBox",
+          "slots": [
+            {
+              "description": "Provide content for the Box",
+              "name": "default"
+            }
+          ],
+          "members": [
+            {
+              "kind": "field",
               "name": "backgroundColor",
               "type": {
                 "text": "'positive' | 'warning' | 'negative' | 'inverse' | 'selected' | 'expressive' | '00' | '00-alt' | '01' | '02' | '03' | 'info-primary' | 'info-secondary' | 'positive-strong' | 'warning-strong' | 'negative-strong' | 'info-primary-strong' | 'info-secondary-strong' | 'selected-subtle' | 'highlight' | 'transparent' | 'expressive-stronger' | 'expressive-inverse' | undefined"
               },
               "description": "Specify the background color of a Box",
-              "fieldName": "backgroundColor"
+              "attribute": "backgroundColor"
             },
             {
+              "kind": "field",
               "name": "borderColor",
               "type": {
                 "text": "'positive' | 'warning' | 'negative' | 'inverse' | 'selected' | 'expressive' | 'strong' | '00' | '00-alt' | '01' | '02' | '03' | 'info-primary' | 'info-secondary' | 'positive-strong' | 'warning-strong' | 'negative-strong' | 'info-primary-strong' | 'info-secondary-strong' | 'transparent' | 'expressive-stronger' | 'focus' | undefined"
               },
               "description": "Specify the border color of a Box",
-              "fieldName": "borderColor"
+              "attribute": "borderColor"
             },
             {
+              "kind": "field",
               "name": "borderWidth",
               "type": {
                 "text": "'md' | 'lg' | 'xl' | 'none' | 'divider' | undefined"
               },
               "description": "Specify the border width of a Box",
-              "fieldName": "borderWidth"
+              "attribute": "borderWidth"
             },
             {
+              "kind": "field",
               "name": "borderRadius",
               "type": {
                 "text": "'xs' | 'sm' | 'md' | 'lg' | 'none' | 'round' | undefined"
               },
               "description": "Specify the border radius of a Box",
-              "fieldName": "borderRadius"
+              "attribute": "borderRadius"
             },
             {
+              "kind": "field",
               "name": "px",
               "type": {
                 "text": "'0' | '12' | '25' | '50' | '75' | '100' | '125' | '150' | '200' | '300' | '400' | '500' | '700' | '800' | undefined"
               },
               "description": "Specify before and after padding of a Box",
-              "fieldName": "px"
+              "attribute": "px"
             },
             {
+              "kind": "field",
               "name": "py",
               "type": {
                 "text": "'0' | '12' | '25' | '50' | '75' | '100' | '125' | '150' | '200' | '300' | '400' | '500' | '700' | '800' | undefined"
               },
               "description": "Specify top and bottom padding of a Box",
-              "fieldName": "py"
+              "attribute": "py"
             },
             {
+              "kind": "field",
               "name": "pTop",
               "type": {
                 "text": "'0' | '12' | '25' | '50' | '75' | '100' | '125' | '150' | '200' | '300' | '400' | '500' | '700' | '800' | undefined"
               },
               "description": "Specify top padding of a Box",
-              "fieldName": "pTop"
+              "attribute": "pTop"
             },
             {
+              "kind": "field",
               "name": "pBottom",
               "type": {
                 "text": "'0' | '12' | '25' | '50' | '75' | '100' | '125' | '150' | '200' | '300' | '400' | '500' | '700' | '800' | undefined"
               },
               "description": "Specify bottom padding of a Box",
-              "fieldName": "pBottom"
+              "attribute": "pBottom"
             },
             {
+              "kind": "field",
               "name": "pBefore",
               "type": {
                 "text": "'0' | '12' | '25' | '50' | '75' | '100' | '125' | '150' | '200' | '300' | '400' | '500' | '700' | '800' | undefined"
               },
               "description": "Specify before padding of a Box",
-              "fieldName": "pBefore"
+              "attribute": "pBefore"
             },
             {
+              "kind": "field",
               "name": "pAfter",
               "type": {
                 "text": "'0' | '12' | '25' | '50' | '75' | '100' | '125' | '150' | '200' | '300' | '400' | '500' | '700' | '800' | undefined"
               },
               "description": "Specify after padding of a Box",
-              "fieldName": "pAfter"
+              "attribute": "pAfter"
             },
             {
+              "kind": "field",
               "name": "mx",
               "type": {
                 "text": "'0' | '12' | '25' | '50' | '75' | '100' | '125' | '150' | '200' | '300' | '400' | '500' | '700' | '800' | undefined"
               },
               "description": "Specify before and after margin of a Box",
-              "fieldName": "mx"
+              "attribute": "mx"
             },
             {
+              "kind": "field",
               "name": "my",
               "type": {
                 "text": "'0' | '12' | '25' | '50' | '75' | '100' | '125' | '150' | '200' | '300' | '400' | '500' | '700' | '800' | undefined"
               },
               "description": "Specify top and bottom margin of a Box",
-              "fieldName": "my"
+              "attribute": "my"
             },
             {
+              "kind": "field",
               "name": "mTop",
               "type": {
                 "text": "'0' | '12' | '25' | '50' | '75' | '100' | '125' | '150' | '200' | '300' | '400' | '500' | '700' | '800' | undefined"
               },
               "description": "Specify top margin of a Box",
-              "fieldName": "mTop"
+              "attribute": "mTop"
             },
             {
+              "kind": "field",
               "name": "mBottom",
               "type": {
                 "text": "'0' | '12' | '25' | '50' | '75' | '100' | '125' | '150' | '200' | '300' | '400' | '500' | '700' | '800' | undefined"
               },
               "description": "Specify bottom margin of a Box",
-              "fieldName": "mBottom"
+              "attribute": "mBottom"
             },
             {
+              "kind": "field",
               "name": "mBefore",
               "type": {
                 "text": "'0' | '12' | '25' | '50' | '75' | '100' | '125' | '150' | '200' | '300' | '400' | '500' | '700' | '800' | undefined"
               },
               "description": "Specify before margin of a Box",
-              "fieldName": "mBefore"
+              "attribute": "mBefore"
             },
             {
+              "kind": "field",
               "name": "mAfter",
               "type": {
                 "text": "'0' | '12' | '25' | '50' | '75' | '100' | '125' | '150' | '200' | '300' | '400' | '500' | '700' | '800' | undefined"
               },
               "description": "Specify after margin of a Box",
-              "fieldName": "mAfter"
+              "attribute": "mAfter"
             },
             {
+              "kind": "field",
               "name": "m",
               "type": {
                 "text": "'0' | '12' | '25' | '50' | '75' | '100' | '125' | '150' | '200' | '300' | '400' | '500' | '700' | '800' | undefined"
               },
               "description": "Specify all margin",
-              "fieldName": "m"
+              "attribute": "m"
             },
             {
+              "kind": "field",
               "name": "p",
               "type": {
                 "text": "'0' | '12' | '25' | '50' | '75' | '100' | '125' | '150' | '200' | '300' | '400' | '500' | '700' | '800' | undefined"
               },
               "description": "Specify all padding",
-              "fieldName": "p"
+              "attribute": "p"
             },
             {
+              "kind": "field",
               "name": "gap",
               "type": {
                 "text": "'0' | '12' | '25' | '50' | '75' | '100' | '125' | '150' | '200' | '300' | '400' | '500' | '700' | '800' | undefined"
               },
               "description": "Specify gap between child elements",
-              "fieldName": "gap"
+              "attribute": "gap"
             },
             {
+              "kind": "field",
               "name": "shadow",
               "type": {
                 "text": "'sm' | 'md' | 'lg' | 'none' | 'overlay' | undefined"
               },
               "description": "Specify if a Box has a shadow",
-              "fieldName": "shadow"
-            }
-          ],
-          "superclass": {
-            "name": "LitElement",
-            "package": "lit"
-          },
-          "tagName": "bm-box",
-          "customElement": true
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "BmBox",
-          "declaration": {
-            "name": "BmBox",
-            "module": "libs/web-components/src/lib/Box/Box.ts"
-          }
-        },
-        {
-          "kind": "custom-element-definition",
-          "name": "bm-box",
-          "declaration": {
-            "name": "BmBox",
-            "module": "libs/web-components/src/lib/Box/Box.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "libs/web-components/src/lib/Box/index.ts",
-      "declarations": [],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "*",
-          "declaration": {
-            "name": "*",
-            "package": "./Box"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "libs/web-components/src/lib/Breadcrumbs/Breadcrumbs.context.ts",
-      "declarations": [
-        {
-          "kind": "variable",
-          "name": "BreadcrumbGroupCtx"
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "BreadcrumbGroupCtx",
-          "declaration": {
-            "name": "BreadcrumbGroupCtx",
-            "module": "libs/web-components/src/lib/Breadcrumbs/Breadcrumbs.context.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "libs/web-components/src/lib/Breadcrumbs/Breadcrumbs.ts",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "`bm-breadcrumb`\n\n### Attributes:\n- **wrap**  - Specify if items wrap or collapse to an ellipsis\n- **itemsBeforeCollapse**  - Specify how many items show before ellipsis\n- **itemsAfterCollapse**  - Specify how many items show after ellipsis\n- **theme**  - Specify the theme of the Breadcrumbs. By default, it inherits the theme from the parent",
-          "name": "BmBreadcrumbs",
-          "slots": [
-            {
-              "description": "Pass items to the Breadcrumb",
-              "name": "default"
+              "attribute": "shadow"
             }
           ],
-          "members": [
+          "attributes": [
             {
-              "kind": "field",
-              "name": "wrap",
+              "name": "backgroundColor",
               "type": {
-                "text": "boolean"
+                "text": "'positive' | 'warning' | 'negative' | 'inverse' | 'selected' | 'expressive' | '00' | '00-alt' | '01' | '02' | '03' | 'info-primary' | 'info-secondary' | 'positive-strong' | 'warning-strong' | 'negative-strong' | 'info-primary-strong' | 'info-secondary-strong' | 'selected-subtle' | 'highlight' | 'transparent' | 'expressive-stronger' | 'expressive-inverse' | undefined"
               },
-              "default": "true",
-              "description": "Specify if items wrap or collapse to an ellipsis",
-              "attribute": "wrap"
+              "description": "Specify the background color of a Box",
+              "fieldName": "backgroundColor"
             },
             {
-              "kind": "field",
-              "name": "itemsBeforeCollapse",
+              "name": "borderColor",
               "type": {
-                "text": "number"
+                "text": "'positive' | 'warning' | 'negative' | 'inverse' | 'selected' | 'expressive' | 'strong' | '00' | '00-alt' | '01' | '02' | '03' | 'info-primary' | 'info-secondary' | 'positive-strong' | 'warning-strong' | 'negative-strong' | 'info-primary-strong' | 'info-secondary-strong' | 'transparent' | 'expressive-stronger' | 'focus' | undefined"
               },
-              "default": "1",
-              "description": "Specify how many items show before ellipsis",
-              "attribute": "itemsBeforeCollapse"
+              "description": "Specify the border color of a Box",
+              "fieldName": "borderColor"
             },
             {
-              "kind": "field",
-              "name": "itemsAfterCollapse",
+              "name": "borderWidth",
               "type": {
-                "text": "number"
+                "text": "'md' | 'lg' | 'xl' | 'none' | 'divider' | undefined"
               },
-              "default": "1",
-              "description": "Specify how many items show after ellipsis",
-              "attribute": "itemsAfterCollapse"
+              "description": "Specify the border width of a Box",
+              "fieldName": "borderWidth"
             },
             {
-              "kind": "field",
-              "name": "theme",
+              "name": "borderRadius",
               "type": {
-                "text": "'light' | 'dark' | undefined"
+                "text": "'xs' | 'sm' | 'md' | 'lg' | 'none' | 'round' | undefined"
               },
-              "description": "Specify the theme of the Breadcrumbs. By default, it inherits the theme from the parent",
-              "attribute": "theme"
-            }
-          ],
-          "attributes": [
+              "description": "Specify the border radius of a Box",
+              "fieldName": "borderRadius"
+            },
             {
-              "name": "wrap",
+              "name": "px",
               "type": {
-                "text": "boolean"
+                "text": "'0' | '12' | '25' | '50' | '75' | '100' | '125' | '150' | '200' | '300' | '400' | '500' | '700' | '800' | undefined"
               },
-              "default": "true",
-              "description": "Specify if items wrap or collapse to an ellipsis",
-              "fieldName": "wrap"
+              "description": "Specify before and after padding of a Box",
+              "fieldName": "px"
             },
             {
-              "name": "itemsBeforeCollapse",
+              "name": "py",
               "type": {
-                "text": "number"
+                "text": "'0' | '12' | '25' | '50' | '75' | '100' | '125' | '150' | '200' | '300' | '400' | '500' | '700' | '800' | undefined"
               },
-              "default": "1",
-              "description": "Specify how many items show before ellipsis",
-              "fieldName": "itemsBeforeCollapse"
+              "description": "Specify top and bottom padding of a Box",
+              "fieldName": "py"
             },
             {
-              "name": "itemsAfterCollapse",
+              "name": "pTop",
               "type": {
-                "text": "number"
+                "text": "'0' | '12' | '25' | '50' | '75' | '100' | '125' | '150' | '200' | '300' | '400' | '500' | '700' | '800' | undefined"
               },
-              "default": "1",
-              "description": "Specify how many items show after ellipsis",
-              "fieldName": "itemsAfterCollapse"
+              "description": "Specify top padding of a Box",
+              "fieldName": "pTop"
             },
             {
-              "name": "theme",
+              "name": "pBottom",
               "type": {
-                "text": "'light' | 'dark' | undefined"
+                "text": "'0' | '12' | '25' | '50' | '75' | '100' | '125' | '150' | '200' | '300' | '400' | '500' | '700' | '800' | undefined"
               },
-              "description": "Specify the theme of the Breadcrumbs. By default, it inherits the theme from the parent",
-              "fieldName": "theme"
-            }
-          ],
-          "superclass": {
-            "name": "LitElement",
-            "package": "lit"
-          },
-          "tagName": "bm-breadcrumb",
-          "customElement": true
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "BmBreadcrumbs",
-          "declaration": {
-            "name": "BmBreadcrumbs",
-            "module": "libs/web-components/src/lib/Breadcrumbs/Breadcrumbs.ts"
-          }
-        },
-        {
-          "kind": "custom-element-definition",
-          "name": "bm-breadcrumb",
-          "declaration": {
-            "name": "BmBreadcrumbs",
-            "module": "libs/web-components/src/lib/Breadcrumbs/Breadcrumbs.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "libs/web-components/src/lib/Breadcrumbs/BreadcrumbsItem.ts",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "`bm-breadcrumb-item`\n\n### Attributes:\n- **href**  - Pass href to an item\n- **clickable**  - Specify if the item is interactive without an href\n- **truncationWidth**  - Specify truncation width of the items. Sets max-width for all items but the last.\n- **isCurrent**  - Specify explicitly if the item is the last one\n- **isCollapsed** ",
-          "name": "BmBreadcrumbsItem",
-          "slots": [
+              "description": "Specify bottom padding of a Box",
+              "fieldName": "pBottom"
+            },
             {
-              "description": "Pass text to an item",
-              "name": "default"
+              "name": "pBefore",
+              "type": {
+                "text": "'0' | '12' | '25' | '50' | '75' | '100' | '125' | '150' | '200' | '300' | '400' | '500' | '700' | '800' | undefined"
+              },
+              "description": "Specify before padding of a Box",
+              "fieldName": "pBefore"
             },
             {
-              "description": "Pass icon to an item",
-              "name": "icon"
-            }
-          ],
-          "members": [
+              "name": "pAfter",
+              "type": {
+                "text": "'0' | '12' | '25' | '50' | '75' | '100' | '125' | '150' | '200' | '300' | '400' | '500' | '700' | '800' | undefined"
+              },
+              "description": "Specify after padding of a Box",
+              "fieldName": "pAfter"
+            },
             {
-              "kind": "field",
-              "name": "href",
+              "name": "mx",
               "type": {
-                "text": "string | undefined"
+                "text": "'0' | '12' | '25' | '50' | '75' | '100' | '125' | '150' | '200' | '300' | '400' | '500' | '700' | '800' | undefined"
               },
-              "description": "Pass href to an item",
-              "attribute": "href"
+              "description": "Specify before and after margin of a Box",
+              "fieldName": "mx"
             },
             {
-              "kind": "field",
-              "name": "clickable",
+              "name": "my",
               "type": {
-                "text": "boolean"
+                "text": "'0' | '12' | '25' | '50' | '75' | '100' | '125' | '150' | '200' | '300' | '400' | '500' | '700' | '800' | undefined"
               },
-              "default": "false",
-              "description": "Specify if the item is interactive without an href",
-              "attribute": "clickable"
+              "description": "Specify top and bottom margin of a Box",
+              "fieldName": "my"
             },
             {
-              "kind": "field",
-              "name": "truncationWidth",
+              "name": "mTop",
               "type": {
-                "text": "string | undefined"
+                "text": "'0' | '12' | '25' | '50' | '75' | '100' | '125' | '150' | '200' | '300' | '400' | '500' | '700' | '800' | undefined"
               },
-              "description": "Specify truncation width of the items. Sets max-width for all items but the last.",
-              "attribute": "truncationWidth"
+              "description": "Specify top margin of a Box",
+              "fieldName": "mTop"
             },
             {
-              "kind": "field",
-              "name": "isCurrent",
+              "name": "mBottom",
               "type": {
-                "text": "boolean"
+                "text": "'0' | '12' | '25' | '50' | '75' | '100' | '125' | '150' | '200' | '300' | '400' | '500' | '700' | '800' | undefined"
               },
-              "default": "false",
-              "description": "Specify explicitly if the item is the last one",
-              "attribute": "isCurrent",
-              "reflects": true
+              "description": "Specify bottom margin of a Box",
+              "fieldName": "mBottom"
             },
             {
-              "kind": "field",
-              "name": "isCollapsed",
+              "name": "mBefore",
               "type": {
-                "text": "boolean"
+                "text": "'0' | '12' | '25' | '50' | '75' | '100' | '125' | '150' | '200' | '300' | '400' | '500' | '700' | '800' | undefined"
               },
-              "default": "false",
-              "attribute": "isCollapsed",
-              "reflects": true
-            }
-          ],
-          "attributes": [
+              "description": "Specify before margin of a Box",
+              "fieldName": "mBefore"
+            },
             {
-              "name": "href",
+              "name": "mAfter",
               "type": {
-                "text": "string | undefined"
+                "text": "'0' | '12' | '25' | '50' | '75' | '100' | '125' | '150' | '200' | '300' | '400' | '500' | '700' | '800' | undefined"
               },
-              "description": "Pass href to an item",
-              "fieldName": "href"
+              "description": "Specify after margin of a Box",
+              "fieldName": "mAfter"
             },
             {
-              "name": "clickable",
+              "name": "m",
               "type": {
-                "text": "boolean"
+                "text": "'0' | '12' | '25' | '50' | '75' | '100' | '125' | '150' | '200' | '300' | '400' | '500' | '700' | '800' | undefined"
               },
-              "default": "false",
-              "description": "Specify if the item is interactive without an href",
-              "fieldName": "clickable"
+              "description": "Specify all margin",
+              "fieldName": "m"
             },
             {
-              "name": "truncationWidth",
+              "name": "p",
               "type": {
-                "text": "string | undefined"
+                "text": "'0' | '12' | '25' | '50' | '75' | '100' | '125' | '150' | '200' | '300' | '400' | '500' | '700' | '800' | undefined"
               },
-              "description": "Specify truncation width of the items. Sets max-width for all items but the last.",
-              "fieldName": "truncationWidth"
+              "description": "Specify all padding",
+              "fieldName": "p"
             },
             {
-              "name": "isCurrent",
+              "name": "gap",
               "type": {
-                "text": "boolean"
+                "text": "'0' | '12' | '25' | '50' | '75' | '100' | '125' | '150' | '200' | '300' | '400' | '500' | '700' | '800' | undefined"
               },
-              "default": "false",
-              "description": "Specify explicitly if the item is the last one",
-              "fieldName": "isCurrent"
+              "description": "Specify gap between child elements",
+              "fieldName": "gap"
             },
             {
-              "name": "isCollapsed",
+              "name": "shadow",
               "type": {
-                "text": "boolean"
+                "text": "'sm' | 'md' | 'lg' | 'none' | 'overlay' | undefined"
               },
-              "default": "false",
-              "fieldName": "isCollapsed"
+              "description": "Specify if a Box has a shadow",
+              "fieldName": "shadow"
             }
           ],
           "superclass": {
             "name": "LitElement",
             "package": "lit"
           },
-          "tagName": "bm-breadcrumb-item",
+          "tagName": "bm-box",
           "customElement": true
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "BmBreadcrumbsItem",
+          "name": "BmBox",
           "declaration": {
-            "name": "BmBreadcrumbsItem",
-            "module": "libs/web-components/src/lib/Breadcrumbs/BreadcrumbsItem.ts"
+            "name": "BmBox",
+            "module": "libs/web-components/src/lib/Box/Box.ts"
           }
         },
         {
           "kind": "custom-element-definition",
-          "name": "bm-breadcrumb-item",
+          "name": "bm-box",
           "declaration": {
-            "name": "BmBreadcrumbsItem",
-            "module": "libs/web-components/src/lib/Breadcrumbs/BreadcrumbsItem.ts"
+            "name": "BmBox",
+            "module": "libs/web-components/src/lib/Box/Box.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "libs/web-components/src/lib/Breadcrumbs/index.ts",
+      "path": "libs/web-components/src/lib/Box/index.ts",
       "declarations": [],
       "exports": [
         {
@@ -1268,15 +1255,7 @@
           "name": "*",
           "declaration": {
             "name": "*",
-            "package": "./Breadcrumbs"
-          }
-        },
-        {
-          "kind": "js",
-          "name": "*",
-          "declaration": {
-            "name": "*",
-            "package": "./BreadcrumbsItem"
+            "package": "./Box"
           }
         }
       ]
@@ -1614,317 +1593,347 @@
               "fieldName": "size"
             },
             {
-              "name": "layout",
+              "name": "layout",
+              "type": {
+                "text": "'stacked' | 'spaced' | undefined"
+              },
+              "default": "'stacked'",
+              "description": "Specify the kind of the group.",
+              "fieldName": "layout"
+            }
+          ],
+          "superclass": {
+            "name": "LitElement",
+            "package": "lit"
+          },
+          "tagName": "bm-avatar-group",
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "BmAvatarGroup",
+          "declaration": {
+            "name": "BmAvatarGroup",
+            "module": "libs/web-components/src/lib/Avatar/AvatarGroup.ts"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "bm-avatar-group",
+          "declaration": {
+            "name": "BmAvatarGroup",
+            "module": "libs/web-components/src/lib/Avatar/AvatarGroup.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "libs/web-components/src/lib/Avatar/index.ts",
+      "declarations": [],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "*",
+          "declaration": {
+            "name": "*",
+            "package": "./Avatar"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "*",
+          "declaration": {
+            "name": "*",
+            "package": "./AvatarGroup"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "libs/web-components/src/lib/Breadcrumbs/Breadcrumbs.context.ts",
+      "declarations": [
+        {
+          "kind": "variable",
+          "name": "BreadcrumbGroupCtx"
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "BreadcrumbGroupCtx",
+          "declaration": {
+            "name": "BreadcrumbGroupCtx",
+            "module": "libs/web-components/src/lib/Breadcrumbs/Breadcrumbs.context.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "libs/web-components/src/lib/Breadcrumbs/Breadcrumbs.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "`bm-breadcrumb`\n\n### Attributes:\n- **wrap**  - Specify if items wrap or collapse to an ellipsis\n- **itemsBeforeCollapse**  - Specify how many items show before ellipsis\n- **itemsAfterCollapse**  - Specify how many items show after ellipsis\n- **theme**  - Specify the theme of the Breadcrumbs. By default, it inherits the theme from the parent",
+          "name": "BmBreadcrumbs",
+          "slots": [
+            {
+              "description": "Pass items to the Breadcrumb",
+              "name": "default"
+            }
+          ],
+          "members": [
+            {
+              "kind": "field",
+              "name": "wrap",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "true",
+              "description": "Specify if items wrap or collapse to an ellipsis",
+              "attribute": "wrap"
+            },
+            {
+              "kind": "field",
+              "name": "itemsBeforeCollapse",
+              "type": {
+                "text": "number"
+              },
+              "default": "1",
+              "description": "Specify how many items show before ellipsis",
+              "attribute": "itemsBeforeCollapse"
+            },
+            {
+              "kind": "field",
+              "name": "itemsAfterCollapse",
+              "type": {
+                "text": "number"
+              },
+              "default": "1",
+              "description": "Specify how many items show after ellipsis",
+              "attribute": "itemsAfterCollapse"
+            },
+            {
+              "kind": "field",
+              "name": "theme",
+              "type": {
+                "text": "'light' | 'dark' | undefined"
+              },
+              "description": "Specify the theme of the Breadcrumbs. By default, it inherits the theme from the parent",
+              "attribute": "theme"
+            }
+          ],
+          "attributes": [
+            {
+              "name": "wrap",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "true",
+              "description": "Specify if items wrap or collapse to an ellipsis",
+              "fieldName": "wrap"
+            },
+            {
+              "name": "itemsBeforeCollapse",
+              "type": {
+                "text": "number"
+              },
+              "default": "1",
+              "description": "Specify how many items show before ellipsis",
+              "fieldName": "itemsBeforeCollapse"
+            },
+            {
+              "name": "itemsAfterCollapse",
+              "type": {
+                "text": "number"
+              },
+              "default": "1",
+              "description": "Specify how many items show after ellipsis",
+              "fieldName": "itemsAfterCollapse"
+            },
+            {
+              "name": "theme",
               "type": {
-                "text": "'stacked' | 'spaced' | undefined"
+                "text": "'light' | 'dark' | undefined"
               },
-              "default": "'stacked'",
-              "description": "Specify the kind of the group.",
-              "fieldName": "layout"
+              "description": "Specify the theme of the Breadcrumbs. By default, it inherits the theme from the parent",
+              "fieldName": "theme"
             }
           ],
           "superclass": {
             "name": "LitElement",
             "package": "lit"
           },
-          "tagName": "bm-avatar-group",
+          "tagName": "bm-breadcrumb",
           "customElement": true
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "BmAvatarGroup",
+          "name": "BmBreadcrumbs",
           "declaration": {
-            "name": "BmAvatarGroup",
-            "module": "libs/web-components/src/lib/Avatar/AvatarGroup.ts"
+            "name": "BmBreadcrumbs",
+            "module": "libs/web-components/src/lib/Breadcrumbs/Breadcrumbs.ts"
           }
         },
         {
           "kind": "custom-element-definition",
-          "name": "bm-avatar-group",
-          "declaration": {
-            "name": "BmAvatarGroup",
-            "module": "libs/web-components/src/lib/Avatar/AvatarGroup.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "libs/web-components/src/lib/Avatar/index.ts",
-      "declarations": [],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "*",
-          "declaration": {
-            "name": "*",
-            "package": "./Avatar"
-          }
-        },
-        {
-          "kind": "js",
-          "name": "*",
+          "name": "bm-breadcrumb",
           "declaration": {
-            "name": "*",
-            "package": "./AvatarGroup"
+            "name": "BmBreadcrumbs",
+            "module": "libs/web-components/src/lib/Breadcrumbs/Breadcrumbs.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "libs/web-components/src/lib/Button/Button.ts",
+      "path": "libs/web-components/src/lib/Breadcrumbs/BreadcrumbsItem.ts",
       "declarations": [
         {
           "kind": "class",
-          "description": "`bm-button`\n\n### Attributes:\n- **appearance**  - Specify the appearance of a Button\n- **kind**  - Specify the kind of Button\n- **size**  - Specify the size of a Button\n- **disabled**  - Specify if the Button is disabled\n- **fluid**  - Specify if Button is fluid\n- **width**  - Specify the width of a Button\n- **height**  - Specify the height of a Button\n- **theme**  - Specify the theme of the Button\n- **iconOnly**  - Specify if the icon displays without text\n- **type** ",
-          "name": "BmButton",
+          "description": "`bm-breadcrumb-item`\n\n### Attributes:\n- **href**  - Pass href to an item\n- **clickable**  - Specify if the item is interactive without an href\n- **truncationWidth**  - Specify truncation width of the items. Sets max-width for all items but the last.\n- **isCurrent**  - Specify explicitly if the item is the last one\n- **isCollapsed** ",
+          "name": "BmBreadcrumbsItem",
           "slots": [
             {
-              "description": "Provide content for the Button",
+              "description": "Pass text to an item",
               "name": "default"
             },
             {
-              "description": "Specify if the Button displays icon before the text",
-              "name": "iconBefore"
-            },
-            {
-              "description": "Specify if the Button displays icon after the text",
-              "name": "iconAfter"
+              "description": "Pass icon to an item",
+              "name": "icon"
             }
           ],
           "members": [
             {
               "kind": "field",
-              "name": "formAssociated",
-              "type": {
-                "text": "boolean"
-              },
-              "static": true,
-              "default": "true"
-            },
-            {
-              "kind": "field",
-              "name": "appearance",
+              "name": "href",
               "type": {
-                "text": "'accent' | 'neutral' | 'neutral-subtle' | 'destructive'"
+                "text": "string | undefined"
               },
-              "default": "'accent'",
-              "description": "Specify the appearance of a Button",
-              "attribute": "appearance"
+              "description": "Pass href to an item",
+              "attribute": "href"
             },
             {
               "kind": "field",
-              "name": "kind",
+              "name": "clickable",
               "type": {
-                "text": "'filled' | 'outline' | 'ghost' | 'bare'"
+                "text": "boolean"
               },
-              "default": "'filled'",
-              "description": "Specify the kind of Button",
-              "attribute": "kind"
+              "default": "false",
+              "description": "Specify if the item is interactive without an href",
+              "attribute": "clickable"
             },
             {
               "kind": "field",
-              "name": "size",
+              "name": "truncationWidth",
               "type": {
-                "text": "'sm' | 'md' | 'lg'"
+                "text": "string | undefined"
               },
-              "default": "'md'",
-              "description": "Specify the size of a Button",
-              "attribute": "size"
+              "description": "Specify truncation width of the items. Sets max-width for all items but the last.",
+              "attribute": "truncationWidth"
             },
             {
               "kind": "field",
-              "name": "disabled",
+              "name": "isCurrent",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Specify if the Button is disabled",
-              "attribute": "disabled"
+              "description": "Specify explicitly if the item is the last one",
+              "attribute": "isCurrent",
+              "reflects": true
             },
             {
               "kind": "field",
-              "name": "fluid",
+              "name": "isCollapsed",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Specify if Button is fluid",
-              "attribute": "fluid"
-            },
-            {
-              "kind": "field",
-              "name": "width",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "Specify the width of a Button",
-              "attribute": "width"
-            },
-            {
-              "kind": "field",
-              "name": "height",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "Specify the height of a Button",
-              "attribute": "height"
-            },
-            {
-              "kind": "field",
-              "name": "theme",
-              "type": {
-                "text": "'light' | 'dark' | undefined"
-              },
-              "description": "Specify the theme of the Button",
-              "attribute": "theme"
-            },
-            {
-              "kind": "field",
-              "name": "iconOnly",
-              "type": {
-                "text": "boolean | undefined"
-              },
-              "description": "Specify if the icon displays without text",
-              "attribute": "iconOnly"
-            },
-            {
-              "kind": "field",
-              "name": "type",
-              "type": {
-                "text": "string"
-              },
-              "default": "'button'",
-              "attribute": "type"
-            },
-            {
-              "kind": "field",
-              "name": "formContext",
-              "type": {
-                "text": "BmFormContext"
-              }
+              "attribute": "isCollapsed",
+              "reflects": true
             }
           ],
           "attributes": [
             {
-              "name": "appearance",
+              "name": "href",
               "type": {
-                "text": "'accent' | 'neutral' | 'neutral-subtle' | 'destructive'"
+                "text": "string | undefined"
               },
-              "default": "'accent'",
-              "description": "Specify the appearance of a Button",
-              "fieldName": "appearance"
+              "description": "Pass href to an item",
+              "fieldName": "href"
             },
             {
-              "name": "kind",
+              "name": "clickable",
               "type": {
-                "text": "'filled' | 'outline' | 'ghost' | 'bare'"
+                "text": "boolean"
               },
-              "default": "'filled'",
-              "description": "Specify the kind of Button",
-              "fieldName": "kind"
+              "default": "false",
+              "description": "Specify if the item is interactive without an href",
+              "fieldName": "clickable"
             },
             {
-              "name": "size",
+              "name": "truncationWidth",
               "type": {
-                "text": "'sm' | 'md' | 'lg'"
+                "text": "string | undefined"
               },
-              "default": "'md'",
-              "description": "Specify the size of a Button",
-              "fieldName": "size"
+              "description": "Specify truncation width of the items. Sets max-width for all items but the last.",
+              "fieldName": "truncationWidth"
             },
             {
-              "name": "disabled",
+              "name": "isCurrent",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Specify if the Button is disabled",
-              "fieldName": "disabled"
+              "description": "Specify explicitly if the item is the last one",
+              "fieldName": "isCurrent"
             },
             {
-              "name": "fluid",
+              "name": "isCollapsed",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Specify if Button is fluid",
-              "fieldName": "fluid"
-            },
-            {
-              "name": "width",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "Specify the width of a Button",
-              "fieldName": "width"
-            },
-            {
-              "name": "height",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "Specify the height of a Button",
-              "fieldName": "height"
-            },
-            {
-              "name": "theme",
-              "type": {
-                "text": "'light' | 'dark' | undefined"
-              },
-              "description": "Specify the theme of the Button",
-              "fieldName": "theme"
-            },
-            {
-              "name": "iconOnly",
-              "type": {
-                "text": "boolean | undefined"
-              },
-              "description": "Specify if the icon displays without text",
-              "fieldName": "iconOnly"
-            },
-            {
-              "name": "type",
-              "type": {
-                "text": "string"
-              },
-              "default": "'button'",
-              "fieldName": "type"
+              "fieldName": "isCollapsed"
             }
           ],
           "superclass": {
             "name": "LitElement",
             "package": "lit"
           },
-          "tagName": "bm-button",
+          "tagName": "bm-breadcrumb-item",
           "customElement": true
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "BmButton",
+          "name": "BmBreadcrumbsItem",
           "declaration": {
-            "name": "BmButton",
-            "module": "libs/web-components/src/lib/Button/Button.ts"
+            "name": "BmBreadcrumbsItem",
+            "module": "libs/web-components/src/lib/Breadcrumbs/BreadcrumbsItem.ts"
           }
         },
         {
           "kind": "custom-element-definition",
-          "name": "bm-button",
-          "declaration": {
-            "name": "BmButton",
-            "module": "libs/web-components/src/lib/Button/Button.ts"
+          "name": "bm-breadcrumb-item",
+          "declaration": {
+            "name": "BmBreadcrumbsItem",
+            "module": "libs/web-components/src/lib/Breadcrumbs/BreadcrumbsItem.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "libs/web-components/src/lib/Button/index.ts",
+      "path": "libs/web-components/src/lib/Breadcrumbs/index.ts",
       "declarations": [],
       "exports": [
         {
@@ -1932,280 +1941,271 @@
           "name": "*",
           "declaration": {
             "name": "*",
-            "package": "./Button"
+            "package": "./Breadcrumbs"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "*",
+          "declaration": {
+            "name": "*",
+            "package": "./BreadcrumbsItem"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "libs/web-components/src/lib/Alert/Alert.ts",
+      "path": "libs/web-components/src/lib/Button/Button.ts",
       "declarations": [
         {
           "kind": "class",
-          "description": "`bm-alert`\n\n### Attributes:\n- **heading**  - Specify the heading text for Alert\n- **body**  - Specify the body text for Alert\n- **size**  - Specify the size of the Alert\n- **fullWidth**  - Specify if the Alert has no border radius\n- **theme**  - Specify the theme of the Alert. By default it inherits the theme from the parent\n- **appearance**  - Specify the appearance of the Alert\n- **hidden**  - Specify if the Alert is hidden\n- **hideIcon**  - Specify if the icon displays on the Alert\n- **dismissible**  - Specify if the Alert can be dismissed\n- **disableAutoFocus**  - Prevent autofocus on show\n- **disableCloseOnEscape**  - Prevent Escape from closing",
-          "name": "BmAlert",
+          "description": "`bm-button`\n\n### Attributes:\n- **appearance**  - Specify the appearance of a Button\n- **kind**  - Specify the kind of Button\n- **size**  - Specify the size of a Button\n- **disabled**  - Specify if the Button is disabled\n- **fluid**  - Specify if Button is fluid\n- **width**  - Specify the width of a Button\n- **height**  - Specify the height of a Button\n- **theme**  - Specify the theme of the Button\n- **iconOnly**  - Specify if the icon displays without text\n- **type** ",
+          "name": "BmButton",
           "slots": [
             {
-              "description": "Specify a different icon for the Alert",
-              "name": "icon"
-            },
-            {
-              "description": "Specify the heading text for Alert or pass the `heading` attribute to set the heading",
-              "name": "heading"
+              "description": "Provide content for the Button",
+              "name": "default"
             },
             {
-              "description": "Specify the body text for Alert or pass the `body` attribute to set the body",
-              "name": "body"
+              "description": "Specify if the Button displays icon before the text",
+              "name": "iconBefore"
             },
             {
-              "description": "Specify if actions display on the Alert",
-              "name": "actions"
+              "description": "Specify if the Button displays icon after the text",
+              "name": "iconAfter"
             }
           ],
           "members": [
             {
               "kind": "field",
-              "name": "heading",
+              "name": "formAssociated",
               "type": {
-                "text": "string | undefined"
+                "text": "boolean"
               },
-              "description": "Specify the heading text for Alert",
-              "attribute": "heading"
+              "static": true,
+              "default": "true"
             },
             {
               "kind": "field",
-              "name": "body",
+              "name": "appearance",
               "type": {
-                "text": "string | undefined"
+                "text": "'accent' | 'neutral' | 'neutral-subtle' | 'destructive'"
               },
-              "description": "Specify the body text for Alert",
-              "attribute": "body"
+              "default": "'accent'",
+              "description": "Specify the appearance of a Button",
+              "attribute": "appearance"
+            },
+            {
+              "kind": "field",
+              "name": "kind",
+              "type": {
+                "text": "'filled' | 'outline' | 'ghost' | 'bare'"
+              },
+              "default": "'filled'",
+              "description": "Specify the kind of Button",
+              "attribute": "kind"
             },
             {
               "kind": "field",
               "name": "size",
               "type": {
-                "text": "'sm' | 'md'"
+                "text": "'sm' | 'md' | 'lg'"
               },
-              "default": "'sm'",
-              "description": "Specify the size of the Alert",
+              "default": "'md'",
+              "description": "Specify the size of a Button",
               "attribute": "size"
             },
             {
               "kind": "field",
-              "name": "fullWidth",
+              "name": "disabled",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Specify if the Alert has no border radius",
-              "attribute": "fullWidth"
+              "description": "Specify if the Button is disabled",
+              "attribute": "disabled"
             },
             {
               "kind": "field",
-              "name": "theme",
+              "name": "fluid",
               "type": {
-                "text": "'light' | 'dark' | undefined"
+                "text": "boolean"
               },
-              "description": "Specify the theme of the Alert. By default it inherits the theme from the parent",
-              "attribute": "theme"
+              "default": "false",
+              "description": "Specify if Button is fluid",
+              "attribute": "fluid"
             },
             {
               "kind": "field",
-              "name": "appearance",
+              "name": "width",
               "type": {
-                "text": "'infoPrimary' | 'infoSecondary' | 'positive' | 'warning' | 'negative'"
+                "text": "string | undefined"
               },
-              "default": "'infoPrimary'",
-              "description": "Specify the appearance of the Alert",
-              "attribute": "appearance"
+              "description": "Specify the width of a Button",
+              "attribute": "width"
             },
             {
               "kind": "field",
-              "name": "hidden",
+              "name": "height",
               "type": {
-                "text": "boolean"
+                "text": "string | undefined"
               },
-              "default": "false",
-              "description": "Specify if the Alert is hidden",
-              "attribute": "hidden"
+              "description": "Specify the height of a Button",
+              "attribute": "height"
             },
             {
               "kind": "field",
-              "name": "hideIcon",
+              "name": "theme",
               "type": {
-                "text": "boolean"
+                "text": "'light' | 'dark' | undefined"
               },
-              "default": "false",
-              "description": "Specify if the icon displays on the Alert",
-              "attribute": "hideIcon"
+              "description": "Specify the theme of the Button",
+              "attribute": "theme"
             },
             {
               "kind": "field",
-              "name": "dismissible",
+              "name": "iconOnly",
               "type": {
-                "text": "boolean"
+                "text": "boolean | undefined"
               },
-              "default": "false",
-              "description": "Specify if the Alert can be dismissed",
-              "attribute": "dismissible"
+              "description": "Specify if the icon displays without text",
+              "attribute": "iconOnly"
             },
             {
               "kind": "field",
-              "name": "disableAutoFocus",
+              "name": "type",
               "type": {
-                "text": "boolean"
+                "text": "string"
               },
-              "default": "false",
-              "description": "Prevent autofocus on show",
-              "attribute": "disableAutoFocus"
+              "default": "'button'",
+              "attribute": "type"
             },
             {
               "kind": "field",
-              "name": "disableCloseOnEscape",
+              "name": "formContext",
               "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "Prevent Escape from closing",
-              "attribute": "disableCloseOnEscape"
-            }
-          ],
-          "events": [
-            {
-              "description": "Dispatched when the Alert has been dismissed",
-              "name": "bm-dismiss"
+                "text": "BmFormContext"
+              }
             }
           ],
           "attributes": [
             {
-              "name": "heading",
+              "name": "appearance",
               "type": {
-                "text": "string | undefined"
+                "text": "'accent' | 'neutral' | 'neutral-subtle' | 'destructive'"
               },
-              "description": "Specify the heading text for Alert",
-              "fieldName": "heading"
+              "default": "'accent'",
+              "description": "Specify the appearance of a Button",
+              "fieldName": "appearance"
             },
             {
-              "name": "body",
+              "name": "kind",
               "type": {
-                "text": "string | undefined"
+                "text": "'filled' | 'outline' | 'ghost' | 'bare'"
               },
-              "description": "Specify the body text for Alert",
-              "fieldName": "body"
+              "default": "'filled'",
+              "description": "Specify the kind of Button",
+              "fieldName": "kind"
             },
             {
               "name": "size",
               "type": {
-                "text": "'sm' | 'md'"
+                "text": "'sm' | 'md' | 'lg'"
               },
-              "default": "'sm'",
-              "description": "Specify the size of the Alert",
+              "default": "'md'",
+              "description": "Specify the size of a Button",
               "fieldName": "size"
             },
             {
-              "name": "fullWidth",
+              "name": "disabled",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Specify if the Alert has no border radius",
-              "fieldName": "fullWidth"
-            },
-            {
-              "name": "theme",
-              "type": {
-                "text": "'light' | 'dark' | undefined"
-              },
-              "description": "Specify the theme of the Alert. By default it inherits the theme from the parent",
-              "fieldName": "theme"
+              "description": "Specify if the Button is disabled",
+              "fieldName": "disabled"
             },
             {
-              "name": "appearance",
+              "name": "fluid",
               "type": {
-                "text": "'infoPrimary' | 'infoSecondary' | 'positive' | 'warning' | 'negative'"
+                "text": "boolean"
               },
-              "default": "'infoPrimary'",
-              "description": "Specify the appearance of the Alert",
-              "fieldName": "appearance"
+              "default": "false",
+              "description": "Specify if Button is fluid",
+              "fieldName": "fluid"
             },
             {
-              "name": "hidden",
+              "name": "width",
               "type": {
-                "text": "boolean"
+                "text": "string | undefined"
               },
-              "default": "false",
-              "description": "Specify if the Alert is hidden",
-              "fieldName": "hidden"
+              "description": "Specify the width of a Button",
+              "fieldName": "width"
             },
             {
-              "name": "hideIcon",
+              "name": "height",
               "type": {
-                "text": "boolean"
+                "text": "string | undefined"
               },
-              "default": "false",
-              "description": "Specify if the icon displays on the Alert",
-              "fieldName": "hideIcon"
+              "description": "Specify the height of a Button",
+              "fieldName": "height"
             },
             {
-              "name": "dismissible",
+              "name": "theme",
               "type": {
-                "text": "boolean"
+                "text": "'light' | 'dark' | undefined"
               },
-              "default": "false",
-              "description": "Specify if the Alert can be dismissed",
-              "fieldName": "dismissible"
+              "description": "Specify the theme of the Button",
+              "fieldName": "theme"
             },
             {
-              "name": "disableAutoFocus",
+              "name": "iconOnly",
               "type": {
-                "text": "boolean"
+                "text": "boolean | undefined"
               },
-              "default": "false",
-              "description": "Prevent autofocus on show",
-              "fieldName": "disableAutoFocus"
+              "description": "Specify if the icon displays without text",
+              "fieldName": "iconOnly"
             },
             {
-              "name": "disableCloseOnEscape",
+              "name": "type",
               "type": {
-                "text": "boolean"
+                "text": "string"
               },
-              "default": "false",
-              "description": "Prevent Escape from closing",
-              "fieldName": "disableCloseOnEscape"
+              "default": "'button'",
+              "fieldName": "type"
             }
           ],
           "superclass": {
             "name": "LitElement",
             "package": "lit"
           },
-          "tagName": "bm-alert",
+          "tagName": "bm-button",
           "customElement": true
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "BmAlert",
+          "name": "BmButton",
           "declaration": {
-            "name": "BmAlert",
-            "module": "libs/web-components/src/lib/Alert/Alert.ts"
+            "name": "BmButton",
+            "module": "libs/web-components/src/lib/Button/Button.ts"
           }
         },
         {
           "kind": "custom-element-definition",
-          "name": "bm-alert",
+          "name": "bm-button",
           "declaration": {
-            "name": "BmAlert",
-            "module": "libs/web-components/src/lib/Alert/Alert.ts"
+            "name": "BmButton",
+            "module": "libs/web-components/src/lib/Button/Button.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "libs/web-components/src/lib/Alert/index.ts",
+      "path": "libs/web-components/src/lib/Button/index.ts",
       "declarations": [],
       "exports": [
         {
@@ -2213,7 +2213,7 @@
           "name": "*",
           "declaration": {
             "name": "*",
-            "package": "./Alert"
+            "package": "./Button"
           }
         }
       ]