@beeq/core 1.11.0-beta.1 → 1.11.0-beta.2

package/dist/custom-elements.json

@@ -655,6 +655,231 @@
         }
       ]
     },
+    {
+      "kind": "javascript-module",
+      "path": "components/bq-accordion-group.js",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "The accordion group component is a container for multiple accordion elements.\nIt allows to manage the appearance and size of all accordions at once.\n\n## Examples\n\n<figure class=\"example\"><figcaption>How to use it</figcaption>\n\n```html\n<bq-accordion-group appearance=\"filled\" size=\"medium\">\n<bq-accordion> ... </bq-accordion>\n<bq-accordion> ... </bq-accordion>\n<bq-accordion> ... </bq-accordion>\n</bq-accordion-group>\n```\n\n</figure>",
+          "name": "BqAccordionGroup",
+          "cssProperties": [
+            {
+              "description": "Accordion group distance between elements",
+              "name": "--bq-accordion-group--gap"
+            }
+          ],
+          "cssParts": [
+            {
+              "description": "The component's base wrapper.",
+              "name": "base"
+            }
+          ],
+          "slots": [
+            {
+              "description": "The default slot where the bq-accordion elements are placed.",
+              "name": ""
+            }
+          ],
+          "members": [
+            {
+              "kind": "field",
+              "name": "el",
+              "type": {
+                "text": "HTMLBqAccordionGroupElement"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "appearance",
+              "type": {
+                "text": "TAccordionAppearance"
+              },
+              "default": "'filled'",
+              "description": "The appearance style of accordion to be applied to all accordions",
+              "parsedType": {
+                "text": "'filled' | 'ghost'"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "expandAll",
+              "type": {
+                "text": "boolean"
+              },
+              "description": "If true all accordions are expanded"
+            },
+            {
+              "kind": "field",
+              "name": "noAnimation",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Animation is set through JS when the browser does not support CSS calc-size()\nIf true, the accordion animation, will be disabled. No animation will be applied."
+            },
+            {
+              "kind": "field",
+              "name": "multiple",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "If true multiple accordions can be expanded at the same time"
+            },
+            {
+              "kind": "field",
+              "name": "size",
+              "type": {
+                "text": "TAccordionSize"
+              },
+              "default": "'medium'",
+              "description": "The size of accordion to be applied to all accordions",
+              "parsedType": {
+                "text": "'small' | 'medium'"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "checkPropValues"
+            },
+            {
+              "kind": "method",
+              "name": "onBqClick",
+              "parameters": [
+                {
+                  "name": "event",
+                  "type": {
+                    "text": "CustomEvent<HTMLBqAccordionElement>"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "field",
+              "name": "bqAccordionElements",
+              "type": {
+                "text": "HTMLBqAccordionElement[]"
+              },
+              "privacy": "private",
+              "readonly": true
+            },
+            {
+              "kind": "method",
+              "name": "render"
+            }
+          ],
+          "attributes": [
+            {
+              "type": {
+                "text": "\"filled\" | \"ghost\""
+              },
+              "description": "The appearance style of accordion to be applied to all accordions",
+              "name": "appearance",
+              "default": "\"filled\""
+            },
+            {
+              "type": {
+                "text": "boolean"
+              },
+              "description": "If true all accordions are expanded",
+              "name": "expandAll",
+              "default": "false"
+            },
+            {
+              "type": {
+                "text": "boolean"
+              },
+              "description": "Animation is set through JS when the browser does not support CSS calc-size() If true, the accordion animation, will be disabled. No animation will be applied.",
+              "name": "no-animation",
+              "default": "false"
+            },
+            {
+              "type": {
+                "text": "boolean"
+              },
+              "description": "If true multiple accordions can be expanded at the same time",
+              "name": "multiple",
+              "default": "false"
+            },
+            {
+              "type": {
+                "text": "\"small\" | \"medium\""
+              },
+              "description": "The size of accordion to be applied to all accordions",
+              "name": "size",
+              "default": "\"medium\""
+            },
+            {
+              "name": "appearance",
+              "fieldName": "appearance",
+              "type": {
+                "text": "TAccordionAppearance"
+              },
+              "parsedType": {
+                "text": "'filled' | 'ghost'"
+              }
+            },
+            {
+              "name": "expand-all",
+              "fieldName": "expandAll",
+              "type": {
+                "text": "boolean"
+              }
+            },
+            {
+              "name": "no-animation",
+              "fieldName": "noAnimation",
+              "type": {
+                "text": "boolean"
+              }
+            },
+            {
+              "name": "multiple",
+              "fieldName": "multiple",
+              "type": {
+                "text": "boolean"
+              }
+            },
+            {
+              "name": "size",
+              "fieldName": "size",
+              "type": {
+                "text": "TAccordionSize"
+              },
+              "parsedType": {
+                "text": "'small' | 'medium'"
+              }
+            }
+          ],
+          "tagName": "bq-accordion-group",
+          "csspart": {
+            "name": "base",
+            "description": "The component's base wrapper."
+          },
+          "events": [],
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "BqAccordionGroup",
+          "declaration": {
+            "name": "BqAccordionGroup",
+            "module": "components/bq-accordion-group.js"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "bq-accordion-group",
+          "declaration": {
+            "name": "BqAccordionGroup",
+            "module": "components/bq-accordion-group.js"
+          }
+        }
+      ]
+    },
     {
       "kind": "javascript-module",
       "path": "components/bq-alert.js",
@@ -1269,250 +1494,25 @@
     },
     {
       "kind": "javascript-module",
-      "path": "components/bq-accordion-group.js",
+      "path": "components/bq-avatar.js",
       "declarations": [
         {
           "kind": "class",
-          "description": "The accordion group component is a container for multiple accordion elements.\nIt allows to manage the appearance and size of all accordions at once.\n\n## Examples\n\n<figure class=\"example\"><figcaption>How to use it</figcaption>\n\n```html\n<bq-accordion-group appearance=\"filled\" size=\"medium\">\n<bq-accordion> ... </bq-accordion>\n<bq-accordion> ... </bq-accordion>\n<bq-accordion> ... </bq-accordion>\n</bq-accordion-group>\n```\n\n</figure>",
-          "name": "BqAccordionGroup",
+          "description": "The Avatar component is a simple and customizable element that displays an image or initials in a circular or square shape.\nThis component is useful for displaying user profile pictures or any other image that represents a person or an entity.\n\n## Examples\n\n<figure class=\"example\"><figcaption>How to use it</figcaption>\n\n```html\n<bq-avatar\nalt-text=\"John Doe profile picture\"\nimage=\"/image/url/photo-1524593689594.jpeg\"\nlabel=\"John Doe profile picture\"\nshape=\"circle\"\nsize=\"medium\"\n>\n<bq-badge slot=\"badge\" text-color=\"#fff\">9</bq-badge>\n</bq-avatar>\n```\n\n</figure>",
+          "name": "BqAvatar",
           "cssProperties": [
             {
-              "description": "Accordion group distance between elements",
-              "name": "--bq-accordion-group--gap"
-            }
-          ],
-          "cssParts": [
+              "description": "Avatar background color",
+              "name": "--bq-avatar--background"
+            },
             {
-              "description": "The component's base wrapper.",
-              "name": "base"
-            }
-          ],
-          "slots": [
+              "description": "Avatar border color",
+              "name": "--bq-avatar--border-color"
+            },
             {
-              "description": "The default slot where the bq-accordion elements are placed.",
-              "name": ""
-            }
-          ],
-          "members": [
-            {
-              "kind": "field",
-              "name": "el",
-              "type": {
-                "text": "HTMLBqAccordionGroupElement"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "appearance",
-              "type": {
-                "text": "TAccordionAppearance"
-              },
-              "default": "'filled'",
-              "description": "The appearance style of accordion to be applied to all accordions",
-              "parsedType": {
-                "text": "'filled' | 'ghost'"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "expandAll",
-              "type": {
-                "text": "boolean"
-              },
-              "description": "If true all accordions are expanded"
-            },
-            {
-              "kind": "field",
-              "name": "noAnimation",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "Animation is set through JS when the browser does not support CSS calc-size()\nIf true, the accordion animation, will be disabled. No animation will be applied."
-            },
-            {
-              "kind": "field",
-              "name": "multiple",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "If true multiple accordions can be expanded at the same time"
-            },
-            {
-              "kind": "field",
-              "name": "size",
-              "type": {
-                "text": "TAccordionSize"
-              },
-              "default": "'medium'",
-              "description": "The size of accordion to be applied to all accordions",
-              "parsedType": {
-                "text": "'small' | 'medium'"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "checkPropValues"
-            },
-            {
-              "kind": "method",
-              "name": "onBqClick",
-              "parameters": [
-                {
-                  "name": "event",
-                  "type": {
-                    "text": "CustomEvent<HTMLBqAccordionElement>"
-                  }
-                }
-              ]
-            },
-            {
-              "kind": "field",
-              "name": "bqAccordionElements",
-              "type": {
-                "text": "HTMLBqAccordionElement[]"
-              },
-              "privacy": "private",
-              "readonly": true
-            },
-            {
-              "kind": "method",
-              "name": "render"
-            }
-          ],
-          "attributes": [
-            {
-              "type": {
-                "text": "\"filled\" | \"ghost\""
-              },
-              "description": "The appearance style of accordion to be applied to all accordions",
-              "name": "appearance",
-              "default": "\"filled\""
-            },
-            {
-              "type": {
-                "text": "boolean"
-              },
-              "description": "If true all accordions are expanded",
-              "name": "expandAll",
-              "default": "false"
-            },
-            {
-              "type": {
-                "text": "boolean"
-              },
-              "description": "Animation is set through JS when the browser does not support CSS calc-size() If true, the accordion animation, will be disabled. No animation will be applied.",
-              "name": "no-animation",
-              "default": "false"
-            },
-            {
-              "type": {
-                "text": "boolean"
-              },
-              "description": "If true multiple accordions can be expanded at the same time",
-              "name": "multiple",
-              "default": "false"
-            },
-            {
-              "type": {
-                "text": "\"small\" | \"medium\""
-              },
-              "description": "The size of accordion to be applied to all accordions",
-              "name": "size",
-              "default": "\"medium\""
-            },
-            {
-              "name": "appearance",
-              "fieldName": "appearance",
-              "type": {
-                "text": "TAccordionAppearance"
-              },
-              "parsedType": {
-                "text": "'filled' | 'ghost'"
-              }
-            },
-            {
-              "name": "expand-all",
-              "fieldName": "expandAll",
-              "type": {
-                "text": "boolean"
-              }
-            },
-            {
-              "name": "no-animation",
-              "fieldName": "noAnimation",
-              "type": {
-                "text": "boolean"
-              }
-            },
-            {
-              "name": "multiple",
-              "fieldName": "multiple",
-              "type": {
-                "text": "boolean"
-              }
-            },
-            {
-              "name": "size",
-              "fieldName": "size",
-              "type": {
-                "text": "TAccordionSize"
-              },
-              "parsedType": {
-                "text": "'small' | 'medium'"
-              }
-            }
-          ],
-          "tagName": "bq-accordion-group",
-          "csspart": {
-            "name": "base",
-            "description": "The component's base wrapper."
-          },
-          "events": [],
-          "customElement": true
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "BqAccordionGroup",
-          "declaration": {
-            "name": "BqAccordionGroup",
-            "module": "components/bq-accordion-group.js"
-          }
-        },
-        {
-          "kind": "custom-element-definition",
-          "name": "bq-accordion-group",
-          "declaration": {
-            "name": "BqAccordionGroup",
-            "module": "components/bq-accordion-group.js"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "components/bq-avatar.js",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "The Avatar component is a simple and customizable element that displays an image or initials in a circular or square shape.\nThis component is useful for displaying user profile pictures or any other image that represents a person or an entity.\n\n## Examples\n\n<figure class=\"example\"><figcaption>How to use it</figcaption>\n\n```html\n<bq-avatar\nalt-text=\"John Doe profile picture\"\nimage=\"/image/url/photo-1524593689594.jpeg\"\nlabel=\"John Doe profile picture\"\nshape=\"circle\"\nsize=\"medium\"\n>\n<bq-badge slot=\"badge\" text-color=\"#fff\">9</bq-badge>\n</bq-avatar>\n```\n\n</figure>",
-          "name": "BqAvatar",
-          "cssProperties": [
-            {
-              "description": "Avatar background color",
-              "name": "--bq-avatar--background"
-            },
-            {
-              "description": "Avatar border color",
-              "name": "--bq-avatar--border-color"
-            },
-            {
-              "description": "Avatar border style",
-              "name": "--bq-avatar--border-style"
-            },
+              "description": "Avatar border style",
+              "name": "--bq-avatar--border-style"
+            },
             {
               "description": "Avatar border width",
               "name": "--bq-avatar--border-width"
@@ -2068,169 +2068,28 @@
     },
     {
       "kind": "javascript-module",
-      "path": "components/bq-breadcrumb.js",
+      "path": "components/bq-breadcrumb-item.js",
       "declarations": [
         {
           "kind": "class",
-          "description": "The Breadcrumb is used to wraps a series of breadcrumb items to indicate the current page's location within a navigational hierarchy.\n\n## Examples\n\n<figure class=\"example\"><figcaption>How to use it</figcaption>\n\n```html\n<bq-breadcrumb label=\"Breadcrumb\">\n<bq-breadcrumb-item>Home</bq-breadcrumb-item>\n<bq-breadcrumb-item>Men's clothing</bq-breadcrumb-item>\n<bq-breadcrumb-item>Shirt</bq-breadcrumb-item>\n<bq-breadcrumb-item>Casual shirts</bq-breadcrumb-item>\n</bq-breadcrumb>\n```\n\n</figure>",
-          "name": "BqBreadcrumb",
-          "cssParts": [
+          "description": "The Breadcrumb Item helps users understand their current location within a website or application's hierarchical structure.\n\n## Examples\n\n<figure class=\"example\"><figcaption>How to use it</figcaption>\n\n```html\n<bq-breadcrumb-item label=\"Home page\">\n<bq-icon name=\"house-line\" size=\"16\"></bq-icon>\nHome\n</bq-breadcrumb-item>\n```\n\n</figure>",
+          "name": "BqBreadcrumbItem",
+          "cssProperties": [
             {
-              "description": "The `nav` tag that loads the breadcrumb items",
-              "name": "navigation"
+              "description": "Background color of the breadcrumb item",
+              "name": "--bq-breadcrumb-item--background"
             },
             {
-              "description": "The container that wraps the separator element",
-              "name": "separator"
-            }
-          ],
-          "slots": [
-            {
-              "description": "The default slot is used to add `bq-breadcrumb-item` items to the breadcrumb.",
-              "name": ""
+              "description": "Box shadow of the breadcrumb item",
+              "name": "--bq-breadcrumb-item--box-shadow"
             },
             {
-              "description": "The slot to add a separator between breadcrumb items. Default separator is `/`.",
-              "name": "separator"
-            }
-          ],
-          "members": [
+              "description": "Border color of the breadcrumb item",
+              "name": "--bq-breadcrumb-item--border-color"
+            },
             {
-              "kind": "field",
-              "name": "navElem",
-              "type": {
-                "text": "HTMLElement"
-              },
-              "privacy": "private"
-            },
-            {
-              "kind": "field",
-              "name": "spanElem",
-              "type": {
-                "text": "HTMLElement"
-              },
-              "privacy": "private"
-            },
-            {
-              "kind": "field",
-              "name": "el",
-              "type": {
-                "text": "HTMLBqBreadcrumbElement"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "label",
-              "type": {
-                "text": "string"
-              },
-              "default": "'Breadcrumbs'",
-              "description": "The `aria-label` attribute to describe the type of navigation"
-            },
-            {
-              "kind": "field",
-              "name": "handleSlotChange",
-              "privacy": "private"
-            },
-            {
-              "kind": "field",
-              "name": "getSeparatorElem",
-              "privacy": "private"
-            },
-            {
-              "kind": "field",
-              "name": "separatorFromSlot",
-              "privacy": "private",
-              "readonly": true
-            },
-            {
-              "kind": "field",
-              "name": "breadcrumbItems",
-              "type": {
-                "text": "HTMLBqBreadcrumbItemElement[]"
-              },
-              "privacy": "private",
-              "readonly": true
-            },
-            {
-              "kind": "method",
-              "name": "render"
-            }
-          ],
-          "attributes": [
-            {
-              "type": {
-                "text": "string"
-              },
-              "description": "The `aria-label` attribute to describe the type of navigation",
-              "name": "label"
-            },
-            {
-              "name": "label",
-              "fieldName": "label",
-              "type": {
-                "text": "string"
-              }
-            }
-          ],
-          "tagName": "bq-breadcrumb",
-          "csspart": [
-            {
-              "name": "navigation",
-              "description": "The `nav` tag that loads the breadcrumb items"
-            },
-            {
-              "name": "separator",
-              "description": "The container that wraps the separator element"
-            }
-          ],
-          "events": [],
-          "customElement": true
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "BqBreadcrumb",
-          "declaration": {
-            "name": "BqBreadcrumb",
-            "module": "components/bq-breadcrumb.js"
-          }
-        },
-        {
-          "kind": "custom-element-definition",
-          "name": "bq-breadcrumb",
-          "declaration": {
-            "name": "BqBreadcrumb",
-            "module": "components/bq-breadcrumb.js"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "components/bq-breadcrumb-item.js",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "The Breadcrumb Item helps users understand their current location within a website or application's hierarchical structure.\n\n## Examples\n\n<figure class=\"example\"><figcaption>How to use it</figcaption>\n\n```html\n<bq-breadcrumb-item label=\"Home page\">\n<bq-icon name=\"house-line\" size=\"16\"></bq-icon>\nHome\n</bq-breadcrumb-item>\n```\n\n</figure>",
-          "name": "BqBreadcrumbItem",
-          "cssProperties": [
-            {
-              "description": "Background color of the breadcrumb item",
-              "name": "--bq-breadcrumb-item--background"
-            },
-            {
-              "description": "Box shadow of the breadcrumb item",
-              "name": "--bq-breadcrumb-item--box-shadow"
-            },
-            {
-              "description": "Border color of the breadcrumb item",
-              "name": "--bq-breadcrumb-item--border-color"
-            },
-            {
-              "description": "Border style of the breadcrumb item",
-              "name": "--bq-breadcrumb-item--border-style"
+              "description": "Border style of the breadcrumb item",
+              "name": "--bq-breadcrumb-item--border-style"
             },
             {
               "description": "Border width of the breadcrumb item",
@@ -2478,6 +2337,147 @@
         }
       ]
     },
+    {
+      "kind": "javascript-module",
+      "path": "components/bq-breadcrumb.js",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "The Breadcrumb is used to wraps a series of breadcrumb items to indicate the current page's location within a navigational hierarchy.\n\n## Examples\n\n<figure class=\"example\"><figcaption>How to use it</figcaption>\n\n```html\n<bq-breadcrumb label=\"Breadcrumb\">\n<bq-breadcrumb-item>Home</bq-breadcrumb-item>\n<bq-breadcrumb-item>Men's clothing</bq-breadcrumb-item>\n<bq-breadcrumb-item>Shirt</bq-breadcrumb-item>\n<bq-breadcrumb-item>Casual shirts</bq-breadcrumb-item>\n</bq-breadcrumb>\n```\n\n</figure>",
+          "name": "BqBreadcrumb",
+          "cssParts": [
+            {
+              "description": "The `nav` tag that loads the breadcrumb items",
+              "name": "navigation"
+            },
+            {
+              "description": "The container that wraps the separator element",
+              "name": "separator"
+            }
+          ],
+          "slots": [
+            {
+              "description": "The default slot is used to add `bq-breadcrumb-item` items to the breadcrumb.",
+              "name": ""
+            },
+            {
+              "description": "The slot to add a separator between breadcrumb items. Default separator is `/`.",
+              "name": "separator"
+            }
+          ],
+          "members": [
+            {
+              "kind": "field",
+              "name": "navElem",
+              "type": {
+                "text": "HTMLElement"
+              },
+              "privacy": "private"
+            },
+            {
+              "kind": "field",
+              "name": "spanElem",
+              "type": {
+                "text": "HTMLElement"
+              },
+              "privacy": "private"
+            },
+            {
+              "kind": "field",
+              "name": "el",
+              "type": {
+                "text": "HTMLBqBreadcrumbElement"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "label",
+              "type": {
+                "text": "string"
+              },
+              "default": "'Breadcrumbs'",
+              "description": "The `aria-label` attribute to describe the type of navigation"
+            },
+            {
+              "kind": "field",
+              "name": "handleSlotChange",
+              "privacy": "private"
+            },
+            {
+              "kind": "field",
+              "name": "getSeparatorElem",
+              "privacy": "private"
+            },
+            {
+              "kind": "field",
+              "name": "separatorFromSlot",
+              "privacy": "private",
+              "readonly": true
+            },
+            {
+              "kind": "field",
+              "name": "breadcrumbItems",
+              "type": {
+                "text": "HTMLBqBreadcrumbItemElement[]"
+              },
+              "privacy": "private",
+              "readonly": true
+            },
+            {
+              "kind": "method",
+              "name": "render"
+            }
+          ],
+          "attributes": [
+            {
+              "type": {
+                "text": "string"
+              },
+              "description": "The `aria-label` attribute to describe the type of navigation",
+              "name": "label"
+            },
+            {
+              "name": "label",
+              "fieldName": "label",
+              "type": {
+                "text": "string"
+              }
+            }
+          ],
+          "tagName": "bq-breadcrumb",
+          "csspart": [
+            {
+              "name": "navigation",
+              "description": "The `nav` tag that loads the breadcrumb items"
+            },
+            {
+              "name": "separator",
+              "description": "The container that wraps the separator element"
+            }
+          ],
+          "events": [],
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "BqBreadcrumb",
+          "declaration": {
+            "name": "BqBreadcrumb",
+            "module": "components/bq-breadcrumb.js"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "bq-breadcrumb",
+          "declaration": {
+            "name": "BqBreadcrumb",
+            "module": "components/bq-breadcrumb.js"
+          }
+        }
+      ]
+    },
     {
       "kind": "javascript-module",
       "path": "components/bq-button.js",
@@ -8831,98 +8831,243 @@
               }
             },
             {
-              "name": "time",
-              "fieldName": "time",
-              "type": {
-                "text": "number"
-              }
+              "name": "time",
+              "fieldName": "time",
+              "type": {
+                "text": "number"
+              }
+            },
+            {
+              "name": "type",
+              "fieldName": "type",
+              "type": {
+                "text": "TNotificationType"
+              },
+              "parsedType": {
+                "text": "'info' | 'success' | 'warning' | 'error' | 'neutral'"
+              }
+            }
+          ],
+          "tagName": "bq-notification",
+          "dependencies": [
+            {
+              "name": "bq-button",
+              "description": ""
+            },
+            {
+              "name": "bq-icon",
+              "description": ""
+            }
+          ],
+          "csspart": [
+            {
+              "name": "base",
+              "description": "The `<div>` container of the predefined bq-icon component."
+            },
+            {
+              "name": "body",
+              "description": "The container `<div>` that wraps the notification description content"
+            },
+            {
+              "name": "btn-close",
+              "description": "The `bq-button` used to close the notification"
+            },
+            {
+              "name": "content",
+              "description": "The container `<div>` that wraps all the notification content (title, description, footer)"
+            },
+            {
+              "name": "footer",
+              "description": "The container `<div>` that wraps the notification footer content"
+            },
+            {
+              "name": "icon",
+              "description": "The `<bq-icon>` element used to render a predefined icon based on the notification type"
+            },
+            {
+              "name": "icon-outline",
+              "description": "The container `<div>` that wraps the icon element"
+            },
+            {
+              "name": "main",
+              "description": "The container `<div>` that wraps the notification main content (title, description)"
+            },
+            {
+              "name": "svg",
+              "description": "The `<svg>` element of the predefined bq-icon component."
+            },
+            {
+              "name": "title",
+              "description": "The container `<div>` that wraps the notification title content"
+            },
+            {
+              "name": "wrapper",
+              "description": "The wrapper container `<div>` of the element inside the shadow DOM"
+            }
+          ],
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "BqNotification",
+          "declaration": {
+            "name": "BqNotification",
+            "module": "components/bq-notification.js"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "bq-notification",
+          "declaration": {
+            "name": "BqNotification",
+            "module": "components/bq-notification.js"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "components/bq-option-group.js",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "The option group component is a container for multiple option elements.\nIt allows to manage the appearance and size of all options at once.\n\n## Examples\n\n<figure class=\"example\"><figcaption>How to use it</figcaption>\n\n```html\n<bq-option-group class=\"hydrated\">\n<span slot=\"header-label\">Sport</span>\n<bq-option value=\"football\">Football</bq-option>\n<bq-option value=\"basketball\">Basketball</bq-option>\n<bq-option value=\"tennis\">Tennis</bq-option>\n</bq-option-group>\n```\n\n</figure>",
+          "name": "BqOptionGroup",
+          "cssProperties": [
+            {
+              "description": "option group background color",
+              "name": "--bq-option-group--background"
+            },
+            {
+              "description": "option group font size",
+              "name": "--bq-option-group--font-size"
+            },
+            {
+              "description": "option group line height",
+              "name": "--bq-option-group--line-height"
+            },
+            {
+              "description": "option group header padding start",
+              "name": "--bq-option-group--label-padding-start"
+            },
+            {
+              "description": "option group header padding start",
+              "name": "--bq-option-group--label-padding-end"
+            },
+            {
+              "description": "option group header padding Y axis",
+              "name": "--bq-option-group--label-paddingY"
+            },
+            {
+              "description": "option group text within label padding start",
+              "name": "--bq-option-group--label-text-padding-start"
+            },
+            {
+              "description": "option group text within label padding start",
+              "name": "--bq-option-group--label-text-padding-end"
             },
             {
-              "name": "type",
-              "fieldName": "type",
-              "type": {
-                "text": "TNotificationType"
-              },
-              "parsedType": {
-                "text": "'info' | 'success' | 'warning' | 'error' | 'neutral'"
-              }
+              "description": "option group container padding start",
+              "name": "--bq-option-group--container-padding-start"
             }
           ],
-          "tagName": "bq-notification",
-          "dependencies": [
+          "cssParts": [
             {
-              "name": "bq-button",
-              "description": ""
+              "description": "The `legend` tag element which acts as a container for the label",
+              "name": "label"
             },
             {
-              "name": "bq-icon",
-              "description": ""
-            }
-          ],
-          "csspart": [
+              "description": "The prefix of the label",
+              "name": "prefix"
+            },
             {
-              "name": "base",
-              "description": "The `<div>` container of the predefined bq-icon component."
+              "description": "The text of the label",
+              "name": "label"
             },
             {
-              "name": "body",
-              "description": "The container `<div>` that wraps the notification description content"
+              "description": "The suffix of the label",
+              "name": "suffix"
             },
             {
-              "name": "btn-close",
-              "description": "The `bq-button` used to close the notification"
+              "description": "The `div` element which holds the option items",
+              "name": "group"
+            }
+          ],
+          "slots": [
+            {
+              "description": "The label of the option group",
+              "name": "header-label"
             },
             {
-              "name": "content",
-              "description": "The container `<div>` that wraps all the notification content (title, description, footer)"
+              "description": "The prefix of the label",
+              "name": "header-prefix"
             },
             {
-              "name": "footer",
-              "description": "The container `<div>` that wraps the notification footer content"
+              "description": "The suffix of the label",
+              "name": "header-suffix"
             },
             {
-              "name": "icon",
-              "description": "The `<bq-icon>` element used to render a predefined icon based on the notification type"
+              "description": "The option items",
+              "name": ""
+            }
+          ],
+          "members": [
+            {
+              "kind": "field",
+              "name": "el",
+              "type": {
+                "text": "HTMLElement"
+              }
             },
             {
-              "name": "icon-outline",
-              "description": "The container `<div>` that wraps the icon element"
+              "kind": "method",
+              "name": "render"
+            }
+          ],
+          "tagName": "bq-option-group",
+          "csspart": [
+            {
+              "name": "label",
+              "description": "The `legend` tag element which acts as a container for the label"
             },
             {
-              "name": "main",
-              "description": "The container `<div>` that wraps the notification main content (title, description)"
+              "name": "prefix",
+              "description": "The prefix of the label"
             },
             {
-              "name": "svg",
-              "description": "The `<svg>` element of the predefined bq-icon component."
+              "name": "label",
+              "description": "The text of the label"
             },
             {
-              "name": "title",
-              "description": "The container `<div>` that wraps the notification title content"
+              "name": "suffix",
+              "description": "The suffix of the label"
             },
             {
-              "name": "wrapper",
-              "description": "The wrapper container `<div>` of the element inside the shadow DOM"
+              "name": "group",
+              "description": "The `div` element which holds the option items"
             }
           ],
+          "events": [],
           "customElement": true
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "BqNotification",
+          "name": "BqOptionGroup",
           "declaration": {
-            "name": "BqNotification",
-            "module": "components/bq-notification.js"
+            "name": "BqOptionGroup",
+            "module": "components/bq-option-group.js"
           }
         },
         {
           "kind": "custom-element-definition",
-          "name": "bq-notification",
+          "name": "bq-option-group",
           "declaration": {
-            "name": "BqNotification",
-            "module": "components/bq-notification.js"
+            "name": "BqOptionGroup",
+            "module": "components/bq-option-group.js"
           }
         }
       ]
@@ -9276,151 +9421,6 @@
         }
       ]
     },
-    {
-      "kind": "javascript-module",
-      "path": "components/bq-option-group.js",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "The option group component is a container for multiple option elements.\nIt allows to manage the appearance and size of all options at once.\n\n## Examples\n\n<figure class=\"example\"><figcaption>How to use it</figcaption>\n\n```html\n<bq-option-group class=\"hydrated\">\n<span slot=\"header-label\">Sport</span>\n<bq-option value=\"football\">Football</bq-option>\n<bq-option value=\"basketball\">Basketball</bq-option>\n<bq-option value=\"tennis\">Tennis</bq-option>\n</bq-option-group>\n```\n\n</figure>",
-          "name": "BqOptionGroup",
-          "cssProperties": [
-            {
-              "description": "option group background color",
-              "name": "--bq-option-group--background"
-            },
-            {
-              "description": "option group font size",
-              "name": "--bq-option-group--font-size"
-            },
-            {
-              "description": "option group line height",
-              "name": "--bq-option-group--line-height"
-            },
-            {
-              "description": "option group header padding start",
-              "name": "--bq-option-group--label-padding-start"
-            },
-            {
-              "description": "option group header padding start",
-              "name": "--bq-option-group--label-padding-end"
-            },
-            {
-              "description": "option group header padding Y axis",
-              "name": "--bq-option-group--label-paddingY"
-            },
-            {
-              "description": "option group text within label padding start",
-              "name": "--bq-option-group--label-text-padding-start"
-            },
-            {
-              "description": "option group text within label padding start",
-              "name": "--bq-option-group--label-text-padding-end"
-            },
-            {
-              "description": "option group container padding start",
-              "name": "--bq-option-group--container-padding-start"
-            }
-          ],
-          "cssParts": [
-            {
-              "description": "The `legend` tag element which acts as a container for the label",
-              "name": "label"
-            },
-            {
-              "description": "The prefix of the label",
-              "name": "prefix"
-            },
-            {
-              "description": "The text of the label",
-              "name": "label"
-            },
-            {
-              "description": "The suffix of the label",
-              "name": "suffix"
-            },
-            {
-              "description": "The `div` element which holds the option items",
-              "name": "group"
-            }
-          ],
-          "slots": [
-            {
-              "description": "The label of the option group",
-              "name": "header-label"
-            },
-            {
-              "description": "The prefix of the label",
-              "name": "header-prefix"
-            },
-            {
-              "description": "The suffix of the label",
-              "name": "header-suffix"
-            },
-            {
-              "description": "The option items",
-              "name": ""
-            }
-          ],
-          "members": [
-            {
-              "kind": "field",
-              "name": "el",
-              "type": {
-                "text": "HTMLElement"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "render"
-            }
-          ],
-          "tagName": "bq-option-group",
-          "csspart": [
-            {
-              "name": "label",
-              "description": "The `legend` tag element which acts as a container for the label"
-            },
-            {
-              "name": "prefix",
-              "description": "The prefix of the label"
-            },
-            {
-              "name": "label",
-              "description": "The text of the label"
-            },
-            {
-              "name": "suffix",
-              "description": "The suffix of the label"
-            },
-            {
-              "name": "group",
-              "description": "The `div` element which holds the option items"
-            }
-          ],
-          "events": [],
-          "customElement": true
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "BqOptionGroup",
-          "declaration": {
-            "name": "BqOptionGroup",
-            "module": "components/bq-option-group.js"
-          }
-        },
-        {
-          "kind": "custom-element-definition",
-          "name": "bq-option-group",
-          "declaration": {
-            "name": "BqOptionGroup",
-            "module": "components/bq-option-group.js"
-          }
-        }
-      ]
-    },
     {
       "kind": "javascript-module",
       "path": "components/bq-option-list.js",