@adyen/bento-vue2 1.40.0 → 1.42.0

package/dist/web-types.json

@@ -1,7 +1,7 @@
 {
   "framework": "vue",
   "name": "@adyen/bento-vue2",
-  "version": "1.40.0",
+  "version": "1.42.0",
   "contributions": {
     "html": {
       "description-markup": "markdown",
@@ -672,6 +672,15 @@
               },
               "default": "undefined"
             },
+            {
+              "name": "disabled",
+              "description": "Disables the filter from being interacted with.",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              },
+              "default": "false"
+            },
             {
               "name": "defaultValue",
               "description": "Default value of the filter to reset to.",
@@ -758,6 +767,15 @@
           "name": "bento-boolean-filter",
           "description": "Example description of the component...",
           "attributes": [
+            {
+              "name": "disabled",
+              "description": "Disables the filter from being interacted with.",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              },
+              "default": "false"
+            },
             {
               "name": "defaultValue",
               "description": "Default value of the filter to reset to.",
@@ -1103,42 +1121,6 @@
             "symbol": "default"
           }
         },
-        {
-          "name": "bento-currency",
-          "description": "A Currency component is used to display a formatted currency value.",
-          "attributes": [
-            {
-              "name": "currency",
-              "value": {
-                "kind": "expression",
-                "type": "BentoCurrencyISOCode | `${BentoCurrencyISOCode}`"
-              },
-              "default": "BentoCurrencyISOCode.EUR"
-            },
-            {
-              "name": "majorUnits",
-              "description": "Accepts currency value in major units instead of minor ones",
-              "value": {
-                "kind": "expression",
-                "type": "boolean"
-              },
-              "default": "false"
-            },
-            {
-              "name": "disableTypography",
-              "description": "Disable the default typography for the component. Only use this when the component is inside another typography component.",
-              "value": {
-                "kind": "expression",
-                "type": "boolean"
-              },
-              "default": "false"
-            }
-          ],
-          "source": {
-            "module": "./src/components/currency/currency.vue",
-            "symbol": "default"
-          }
-        },
         {
           "name": "bento-data-grid",
           "description": "",
@@ -1244,6 +1226,15 @@
           "name": "bento-date-filter",
           "description": "The Date filter displays a calendar that allows\nto select a single date.",
           "attributes": [
+            {
+              "name": "disabled",
+              "description": "Disables the filter from being interacted with.",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              },
+              "default": "false"
+            },
             {
               "name": "isDateInput",
               "value": {
@@ -1439,6 +1430,15 @@
           "name": "bento-date-range-filter",
           "description": "The Date filter displays a calendar that allows\nto select a single date.",
           "attributes": [
+            {
+              "name": "disabled",
+              "description": "Disables the filter from being interacted with.",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              },
+              "default": "false"
+            },
             {
               "name": "defaultValue",
               "description": "Default value of the filter to reset to.",
@@ -1797,52 +1797,6 @@
             "symbol": "default"
           }
         },
-        {
-          "name": "bento-image",
-          "description": "",
-          "attributes": [
-            {
-              "name": "src",
-              "required": true,
-              "description": "Url to image, same as src attribute of `<img>` tag",
-              "value": {
-                "kind": "expression",
-                "type": "string"
-              }
-            },
-            {
-              "name": "alt",
-              "required": true,
-              "description": "Accessible text describing the image, same as alt attribute of `<img>` tag",
-              "value": {
-                "kind": "expression",
-                "type": "string"
-              }
-            },
-            {
-              "name": "aspectRatio",
-              "description": "Aspect ratio of the image, maps to css aspect-ratio",
-              "value": {
-                "kind": "expression",
-                "type": "BentoImageAspectRatio | `${BentoImageAspectRatio}`"
-              },
-              "default": "null"
-            },
-            {
-              "name": "objectFit",
-              "description": "Object fitting strategy, maps to css object-fit",
-              "value": {
-                "kind": "expression",
-                "type": "BentoImageObjectFit | `${BentoImageObjectFit}`"
-              },
-              "default": "null"
-            }
-          ],
-          "source": {
-            "module": "./src/components/image/image.vue",
-            "symbol": "default"
-          }
-        },
         {
           "name": "bento-info-icon",
           "description": "",
@@ -1875,6 +1829,15 @@
           "name": "bento-input-filter",
           "description": "",
           "attributes": [
+            {
+              "name": "disabled",
+              "description": "Disables the filter from being interacted with.",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              },
+              "default": "false"
+            },
             {
               "name": "defaultValue",
               "description": "Default value of the filter to reset to.",
@@ -2563,6 +2526,15 @@
           "name": "bento-range-filter",
           "description": "Range filter used in the filter-bar component.",
           "attributes": [
+            {
+              "name": "disabled",
+              "description": "Disables the filter from being interacted with.",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              },
+              "default": "false"
+            },
             {
               "name": "defaultValue",
               "description": "Default value of the filter to reset to.",
@@ -4392,6 +4364,56 @@
             "symbol": "default"
           }
         },
+        {
+          "name": "currency",
+          "description": "",
+          "attributes": [
+            {
+              "name": "currency",
+              "required": false,
+              "description": "Currency code based on the ISO 4217 standard",
+              "value": {
+                "kind": "expression",
+                "type": "union"
+              },
+              "default": "BentoCurrencyISOCode.EUR"
+            },
+            {
+              "name": "disableTypography",
+              "required": false,
+              "description": "Disable the default typography for the component. Only use this when the component is inside another typography component.",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              },
+              "default": "false"
+            },
+            {
+              "name": "majorUnits",
+              "required": false,
+              "description": "Accepts currency value in major units instead of minor ones",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              },
+              "default": "false"
+            },
+            {
+              "name": "value",
+              "required": false,
+              "description": "Currency value to be formatted",
+              "value": {
+                "kind": "expression",
+                "type": "number"
+              },
+              "default": "undefined"
+            }
+          ],
+          "source": {
+            "module": "./src/components/currency/currency.vue",
+            "symbol": "default"
+          }
+        },
         {
           "name": "dashed-underline",
           "description": "",
@@ -4661,6 +4683,15 @@
               },
               "default": "false"
             },
+            {
+              "name": "stickyHorizontalScrollbar",
+              "description": "Sticks the horizontal scrollbar to the bottom of the screen if the data-grid is larger than the screen height.",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              },
+              "default": "false"
+            },
             {
               "name": "stickyPagination",
               "description": "Make pagination stick to the bottom of the page when the data-grid is bigger than the screen.\nBecause styles have to be applied to pagination container element, this has to be a data-grid prop (rather than a pagination prop).",
@@ -5172,6 +5203,10 @@
             {
               "name": "<undefined>"
             },
+            {
+              "name": "sort",
+              "description": "Triggered when a column is sorted."
+            },
             {
               "name": "column-hover",
               "description": "Emitted when a column header is hovered over."
@@ -7081,94 +7116,427 @@
           }
         },
         {
-          "name": "filter-bar",
+          "name": "file-uploader",
           "description": "",
           "attributes": [
             {
-              "name": "config",
-              "description": "Array of filters based on {@see BentoFilterBarModel}.\nEach one of the elements in the array correspond to a filter that will\nbe created and rendered in the FilterBar.",
+              "name": "accept",
+              "required": false,
+              "description": "A string that defines the file types the file input should accept.\nhttps://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#accept",
               "value": {
                 "kind": "expression",
-                "type": "BentoFilterBarModel"
+                "type": "TSIndexedAccessType"
               },
-              "default": "() => []"
+              "default": "null"
             },
             {
-              "name": "searchTerm",
-              "description": "Search term useful to filter all the data by text.\nIf the value is non-existant (null or undefined) the search bar won't be enabled.",
+              "name": "condensed",
+              "required": false,
+              "description": "Reduces the size of the uploader area.",
               "value": {
                 "kind": "expression",
-                "type": "BentoSearchBar.props.value.type"
-              },
-              "default": "undefined"
+                "type": "boolean"
+              }
             },
             {
-              "name": "value",
-              "description": "Array of filters based on {@see BentoFilterBarModel}.\nEach one of the elements in the array correspond to a filter that will\nbe created and rendered in the FilterBar.\n\nCan be used with v-model or independently with the @input event.",
+              "name": "description",
+              "required": false,
+              "description": "Descriptive supporting text visbile underneath the label.",
               "value": {
                 "kind": "expression",
-                "type": "BentoFilterBarModel"
+                "type": "string"
               },
-              "default": "() => []"
+              "default": "null"
             },
             {
-              "name": "filterValues",
-              "description": "An array of the values for each filter in the filter bar.\n{@see BentoFilterValues}",
+              "name": "disabled",
+              "required": false,
+              "description": "Disable the radio button (optional).",
               "value": {
                 "kind": "expression",
-                "type": "BentoFilterValues"
-              },
-              "default": "() => []"
+                "type": "boolean"
+              }
             },
             {
-              "name": "showAppliedHiddenFilters",
-              "description": "Will show all applied filters even if their visibility is set to false.",
+              "name": "errorMessage",
+              "required": false,
+              "description": "Renders file-uploader with an error state and the error message beneath the input box",
               "value": {
                 "kind": "expression",
-                "type": "boolean"
+                "type": "string"
               },
-              "default": "false"
-            }
-          ],
-          "source": {
-            "module": "./src/components/filter-bar/filter-bar.vue",
-            "symbol": "default"
-          }
-        },
-        {
-          "name": "filter-bar-button",
-          "description": "",
-          "attributes": [
+              "default": "null"
+            },
             {
-              "name": "appliedFiltersCount",
-              "description": "The number of applied values within the filter.\nText can also be applied here such as 'All'.\ne.g. if 2 items in a dropdown filter have been applied, the number 2 will be shown here.",
+              "name": "label",
+              "required": true,
+              "description": "The label of the component.",
               "value": {
                 "kind": "expression",
-                "type": "string|number"
-              },
-              "default": "null"
+                "type": "string"
+              }
             },
             {
-              "name": "disabled",
-              "description": "Disables button functionality.",
+              "name": "maxCount",
+              "required": false,
+              "description": "Sets a maximum file count. Allows for uploading multiple files.",
               "value": {
                 "kind": "expression",
-                "type": "boolean"
+                "type": "number"
               },
-              "default": "false"
+              "default": "1"
             },
             {
-              "name": "isFilterOpen",
-              "description": "Signifies if the filter is open or closed.",
+              "name": "maxDimensions",
+              "required": false,
+              "description": "Sets a maximum image size (for image file types only).",
               "value": {
                 "kind": "expression",
-                "type": "boolean"
+                "type": "{\n    width?: number;\n    height?: number;\n}"
               },
-              "default": "false"
+              "default": "null"
             },
             {
-              "name": "hasChevron",
-              "description": "Toggles if a chevron icon should be displayed in the button.\nThe chevron will change depending on the open state of the filter.",
+              "name": "maxSize",
+              "required": false,
+              "description": "Sets a maximum file size in Bytes",
+              "value": {
+                "kind": "expression",
+                "type": "number"
+              },
+              "default": "null"
+            },
+            {
+              "name": "modelValue",
+              "required": false,
+              "description": "Used to support `v-model`. Doesn't actually set the value of the file uploader.",
+              "value": {
+                "kind": "expression",
+                "type": "BentoFileUploaderValue"
+              },
+              "default": "null"
+            },
+            {
+              "name": "optional",
+              "required": false,
+              "description": "Sets the field as optional.",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              }
+            },
+            {
+              "name": "required",
+              "required": false,
+              "description": "Sets the field as required.",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              }
+            },
+            {
+              "name": "tooltipText",
+              "required": false,
+              "description": "Adds a info icon next to the label to display the passed tooltip message.",
+              "value": {
+                "kind": "expression",
+                "type": "string"
+              },
+              "default": "null"
+            }
+          ],
+          "events": [
+            {
+              "name": "change",
+              "description": "Emit that emits the input value"
+            },
+            {
+              "name": "update:modelValue",
+              "description": "Emit that emits the input value"
+            }
+          ],
+          "source": {
+            "module": "./src/components/file-uploader/file-uploader.vue",
+            "symbol": "default"
+          }
+        },
+        {
+          "name": "file-uploader-file-card",
+          "description": "",
+          "attributes": [
+            {
+              "name": "file",
+              "required": true,
+              "description": "File to be uploaded",
+              "value": {
+                "kind": "expression",
+                "type": "FileObject"
+              }
+            },
+            {
+              "name": "supportedFileTypes",
+              "required": false,
+              "description": "Supported file types message",
+              "value": {
+                "kind": "expression",
+                "type": "SupportedFileTypes"
+              },
+              "default": "null"
+            }
+          ],
+          "events": [
+            {
+              "name": "cancel",
+              "description": "Triggered when the \"cancel\" button is clicked"
+            },
+            {
+              "name": "remove",
+              "description": "Triggered when the \"remove\" button is clicked"
+            },
+            {
+              "name": "retry",
+              "description": "Triggered when the \"retry\" button is clicked"
+            }
+          ],
+          "source": {
+            "module": "./src/components/file-uploader/components/file-uploader-file-card/file-uploader-file-card.vue",
+            "symbol": "default"
+          }
+        },
+        {
+          "name": "file-uploader-file-card-animation",
+          "description": "",
+          "attributes": [
+            {
+              "name": "name",
+              "required": true,
+              "value": {
+                "kind": "expression",
+                "type": "string"
+              }
+            },
+            {
+              "name": "showFileIcon",
+              "required": true,
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              }
+            }
+          ],
+          "slots": [
+            {
+              "name": "default"
+            }
+          ],
+          "source": {
+            "module": "./src/components/file-uploader/components/file-uploader-file-card/components/file-uploader-file-card-animation/file-uploader-file-card-animation.vue",
+            "symbol": "default"
+          }
+        },
+        {
+          "name": "file-uploader-file-card-stub",
+          "description": "",
+          "attributes": [
+            {
+              "name": "file",
+              "required": false,
+              "value": {
+                "kind": "expression",
+                "type": "{\n    name: string;\n    type: string;\n    progress?: number;\n}"
+              },
+              "default": "() => ({ name: 'file.text', type: 'text/plain' })"
+            },
+            {
+              "name": "fileType",
+              "required": false,
+              "value": {
+                "kind": "expression",
+                "type": "FileType"
+              },
+              "default": "FileType.GENERIC"
+            },
+            {
+              "name": "fileState",
+              "required": true,
+              "value": {
+                "kind": "expression",
+                "type": "FileState"
+              }
+            },
+            {
+              "name": "supportedFileTypes",
+              "required": false,
+              "value": {
+                "kind": "expression",
+                "type": "string"
+              }
+            }
+          ],
+          "source": {
+            "module": "./src/components/file-uploader/components/file-uploader-file-card/__tests__/file-uploader-file-card-stub.vue",
+            "symbol": "default"
+          }
+        },
+        {
+          "name": "file-uploader-restrictions",
+          "description": "",
+          "attributes": [
+            {
+              "name": "condensed",
+              "required": false,
+              "description": "Reduces the size of the uploader area.",
+              "value": {
+                "kind": "expression",
+                "type": "TSIndexedAccessType"
+              },
+              "default": "null"
+            },
+            {
+              "name": "disabled",
+              "required": false,
+              "description": "Disables the File uploader",
+              "value": {
+                "kind": "expression",
+                "type": "TSIndexedAccessType"
+              },
+              "default": "null"
+            },
+            {
+              "name": "maxCount",
+              "required": false,
+              "description": "Sets a maximum file count.",
+              "value": {
+                "kind": "expression",
+                "type": "{\n    value: BentoFileUploaderProps[\"maxCount\"];\n    error: boolean;\n}"
+              },
+              "default": "null"
+            },
+            {
+              "name": "maxDimensions",
+              "required": false,
+              "description": "Sets a maximum image size (for image file types only).",
+              "value": {
+                "kind": "expression",
+                "type": "{\n    value: BentoFileUploaderProps[\"maxDimensions\"];\n    error: boolean;\n}"
+              },
+              "default": "null"
+            },
+            {
+              "name": "maxSize",
+              "required": false,
+              "description": "Sets a maximum file size in Bytes",
+              "value": {
+                "kind": "expression",
+                "type": "{\n    value: BentoFileUploaderProps[\"maxSize\"];\n    error: boolean;\n}"
+              },
+              "default": "null"
+            },
+            {
+              "name": "supportedFileTypes",
+              "required": false,
+              "description": "Supported file types message",
+              "value": {
+                "kind": "expression",
+                "type": "{\n    value: SupportedFileTypes;\n    error: boolean;\n}"
+              },
+              "default": "null"
+            }
+          ],
+          "source": {
+            "module": "./src/components/file-uploader/components/file-uploader-restrictions/file-uploader-restrictions.vue",
+            "symbol": "default"
+          }
+        },
+        {
+          "name": "filter-bar",
+          "description": "",
+          "attributes": [
+            {
+              "name": "config",
+              "description": "Array of filters based on {@see BentoFilterBarModel}.\nEach one of the elements in the array correspond to a filter that will\nbe created and rendered in the FilterBar.",
+              "value": {
+                "kind": "expression",
+                "type": "BentoFilterBarModel"
+              },
+              "default": "() => []"
+            },
+            {
+              "name": "searchTerm",
+              "description": "Search term useful to filter all the data by text.\nIf the value is non-existant (null or undefined) the search bar won't be enabled.",
+              "value": {
+                "kind": "expression",
+                "type": "BentoSearchBar.props.value.type"
+              },
+              "default": "undefined"
+            },
+            {
+              "name": "value",
+              "description": "Array of filters based on {@see BentoFilterBarModel}.\nEach one of the elements in the array correspond to a filter that will\nbe created and rendered in the FilterBar.\n\nCan be used with v-model or independently with the @input event.",
+              "value": {
+                "kind": "expression",
+                "type": "BentoFilterBarModel"
+              },
+              "default": "() => []"
+            },
+            {
+              "name": "filterValues",
+              "description": "An array of the values for each filter in the filter bar.\n{@see BentoFilterValues}",
+              "value": {
+                "kind": "expression",
+                "type": "BentoFilterValues"
+              },
+              "default": "() => []"
+            },
+            {
+              "name": "showAppliedHiddenFilters",
+              "description": "Will show all applied filters even if their visibility is set to false.",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              },
+              "default": "false"
+            }
+          ],
+          "source": {
+            "module": "./src/components/filter-bar/filter-bar.vue",
+            "symbol": "default"
+          }
+        },
+        {
+          "name": "filter-bar-button",
+          "description": "",
+          "attributes": [
+            {
+              "name": "appliedFiltersCount",
+              "description": "The number of applied values within the filter.\nText can also be applied here such as 'All'.\ne.g. if 2 items in a dropdown filter have been applied, the number 2 will be shown here.",
+              "value": {
+                "kind": "expression",
+                "type": "string|number"
+              },
+              "default": "null"
+            },
+            {
+              "name": "disabled",
+              "description": "Disables button functionality.",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              },
+              "default": "false"
+            },
+            {
+              "name": "isFilterOpen",
+              "description": "Signifies if the filter is open or closed.",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              },
+              "default": "false"
+            },
+            {
+              "name": "isPersistentFilter",
+              "description": "Signifies if the filter is a persistent filter",
               "value": {
                 "kind": "expression",
                 "type": "boolean"
@@ -7536,6 +7904,54 @@
             "symbol": "default"
           }
         },
+        {
+          "name": "image",
+          "description": "",
+          "attributes": [
+            {
+              "name": "src",
+              "required": true,
+              "description": "Url to image, same as src attribute of `<img>` tag",
+              "value": {
+                "kind": "expression",
+                "type": "string"
+              }
+            },
+            {
+              "name": "alt",
+              "required": true,
+              "description": "Accessible text describing the image, same as alt attribute of `<img>` tag",
+              "value": {
+                "kind": "expression",
+                "type": "string"
+              }
+            },
+            {
+              "name": "aspectRatio",
+              "required": false,
+              "description": "Aspect ratio of the image, maps to css aspect-ratio",
+              "value": {
+                "kind": "expression",
+                "type": "union"
+              },
+              "default": "null"
+            },
+            {
+              "name": "objectFit",
+              "required": false,
+              "description": "Object fitting strategy, maps to css object-fit",
+              "value": {
+                "kind": "expression",
+                "type": "union"
+              },
+              "default": "null"
+            }
+          ],
+          "source": {
+            "module": "./src/components/image/image.vue",
+            "symbol": "default"
+          }
+        },
         {
           "name": "info-icon-with-popover",
           "description": "",
@@ -7695,106 +8111,220 @@
               "description": "Position of Static Value before or after input value",
               "value": {
                 "kind": "expression",
-                "type": "BentoInputFieldElementPosition | `${BentoInputFieldElementPosition}`"
+                "type": "BentoInputFieldElementPosition | `${BentoInputFieldElementPosition}`"
+              },
+              "default": "BentoInputFieldElementPosition.START"
+            },
+            {
+              "name": "tooltipText",
+              "description": "Adds a info icon next to the label to display the passed tooltip message.",
+              "value": {
+                "kind": "expression",
+                "type": "string"
+              },
+              "default": "null"
+            },
+            {
+              "name": "type",
+              "description": "A string specifying the type of control to render.\nAll `input` types are available but only `search`, `text` and `number` are fully supported.\n\nIf `type` is `search`, use `bento-search-bar` instead.",
+              "value": {
+                "kind": "expression",
+                "type": "BentoInputFieldType | `${BentoInputFieldType}` | HTMLInputElement['type']"
+              },
+              "default": "BentoInputFieldType.TEXT"
+            },
+            {
+              "name": "value",
+              "description": "Text displayed as the value of the input-field",
+              "value": {
+                "kind": "expression",
+                "type": "BentoInputFieldValue"
+              },
+              "default": "undefined"
+            },
+            {
+              "name": "variant",
+              "description": "Describes the different variants for the input element",
+              "value": {
+                "kind": "expression",
+                "type": "BentoInputFieldVariant | `${BentoInputFieldVariant}`"
+              },
+              "default": "BentoInputFieldVariant.DEFAULT"
+            }
+          ],
+          "events": [
+            {
+              "name": "update:dropdown",
+              "description": "Emitted when the Input Field's internal dropdown changes it's value. Contains every dropdown prop passed with the updated selected value as 'value'"
+            },
+            {
+              "name": "blur",
+              "description": "Emitted when the element has lost focus"
+            },
+            {
+              "name": "change",
+              "description": "Emitted when the user modifies the element's value. Unlike the 'input' event, the change event is not necessarily fired for each alteration to an element's value"
+            },
+            {
+              "name": "dropdown-input",
+              "description": "Emitted when the Input Field's internal dropdown changes it's value"
+            },
+            {
+              "name": "escape-pressed",
+              "description": "Emitted when the \"ESC\" key is pressed"
+            },
+            {
+              "name": "focus",
+              "description": "Emitted when the element has received focus"
+            },
+            {
+              "name": "keydown",
+              "description": "Emitted when a key is pressed down"
+            },
+            {
+              "name": "keyup",
+              "description": "Emitted when a key is pressed and lifted up"
+            },
+            {
+              "name": "input",
+              "description": "Emitted when the component's model changes"
+            }
+          ],
+          "slots": [
+            {
+              "name": "default"
+            },
+            {
+              "name": "iconBefore"
+            },
+            {
+              "name": "defaultIconBefore"
+            },
+            {
+              "name": "paymentMethod"
+            },
+            {
+              "name": "staticValue"
+            },
+            {
+              "name": "iconAfter"
+            },
+            {
+              "name": "description"
+            }
+          ],
+          "source": {
+            "module": "./src/components/input-field/input-field.vue",
+            "symbol": "default"
+          }
+        },
+        {
+          "name": "input-field-password",
+          "description": "",
+          "attributes": [
+            {
+              "name": "condensed",
+              "required": false,
+              "description": "Reduces height of the input",
+              "value": {
+                "kind": "expression",
+                "type": "TSIndexedAccessType"
+              },
+              "default": "false"
+            },
+            {
+              "name": "disabled",
+              "required": false,
+              "description": "Disables the possibility of changing value in the input-field",
+              "value": {
+                "kind": "expression",
+                "type": "TSIndexedAccessType"
+              },
+              "default": "false"
+            },
+            {
+              "name": "errorMessage",
+              "required": false,
+              "description": "Renders input-field with an error state and the error message beneath the input box",
+              "value": {
+                "kind": "expression",
+                "type": "TSIndexedAccessType"
+              },
+              "default": "null"
+            },
+            {
+              "name": "placeholder",
+              "required": false,
+              "description": "Text displayed as the placeholder of the input-field",
+              "value": {
+                "kind": "expression",
+                "type": "TSIndexedAccessType"
+              },
+              "default": "''"
+            },
+            {
+              "name": "readonly",
+              "required": false,
+              "description": "Setting this property to true will set the input field to read only state.",
+              "value": {
+                "kind": "expression",
+                "type": "TSIndexedAccessType"
               },
-              "default": "BentoInputFieldElementPosition.START"
+              "default": "false"
             },
             {
-              "name": "tooltipText",
-              "description": "Adds a info icon next to the label to display the passed tooltip message.",
+              "name": "value",
+              "required": false,
+              "description": "Text displayed as the value of the input-field",
               "value": {
                 "kind": "expression",
-                "type": "string"
+                "type": "TSIndexedAccessType"
               },
-              "default": "null"
+              "default": "undefined"
             },
             {
-              "name": "type",
-              "description": "A string specifying the type of control to render.\nAll `input` types are available but only `search`, `text` and `number` are fully supported.\n\nIf `type` is `search`, use `bento-search-bar` instead.",
+              "name": "label",
+              "required": false,
+              "description": "Label to be shown with the input field",
               "value": {
                 "kind": "expression",
-                "type": "BentoInputFieldType | `${BentoInputFieldType}` | HTMLInputElement['type']"
+                "type": "string"
               },
-              "default": "BentoInputFieldType.TEXT"
+              "default": "null"
             },
             {
-              "name": "value",
-              "description": "Text displayed as the value of the input-field",
+              "name": "validation",
+              "required": false,
+              "description": "Configuration object for password field validation.\n\nThis object defines the validation criteria and associated messages for a password field.\nIt includes the following properties:\n\n- `title`: The title displayed at the top of the validation hint.\n- `suggestion`: The message displayed at the bottom of the validation hint, providing additional guidance.\n- `list`: An array of callback functions to be executed on the value after each user input, validating the password against the specified rules.\n\nBy default, the validation checks that:\n\n- The value has a minimum length of 8 characters.\n- The value contains at least one lowercase letter.\n- The value contains at least one uppercase letter.\n- The value contains at least one numeric digit.\n- The value contains at least one special character.",
               "value": {
                 "kind": "expression",
-                "type": "BentoInputFieldValue"
+                "type": "BentoInputFieldPasswordValidation"
               },
               "default": "undefined"
             },
             {
-              "name": "variant",
-              "description": "Describes the different variants for the input element",
+              "name": "withHint",
+              "required": false,
+              "description": "Whether the password validation hint is displayed when the input field is activated via focus or input",
               "value": {
                 "kind": "expression",
-                "type": "BentoInputFieldVariant | `${BentoInputFieldVariant}`"
+                "type": "boolean"
               },
-              "default": "BentoInputFieldVariant.DEFAULT"
+              "default": "true"
             }
           ],
           "events": [
             {
-              "name": "update:dropdown",
-              "description": "Emitted when the Input Field's internal dropdown changes it's value. Contains every dropdown prop passed with the updated selected value as 'value'"
-            },
-            {
-              "name": "blur",
-              "description": "Emitted when the element has lost focus"
-            },
-            {
-              "name": "change",
-              "description": "Emitted when the user modifies the element's value. Unlike the 'input' event, the change event is not necessarily fired for each alteration to an element's value"
-            },
-            {
-              "name": "dropdown-input",
-              "description": "Emitted when the Input Field's internal dropdown changes it's value"
-            },
-            {
-              "name": "escape-pressed",
-              "description": "Emitted when the \"ESC\" key is pressed"
-            },
-            {
-              "name": "focus",
-              "description": "Emitted when the element has received focus"
-            },
-            {
-              "name": "keydown",
-              "description": "Emitted when a key is pressed"
+              "name": "input:valid",
+              "description": "Emits an `input:valid` event when the value is validated against the provided validations.\nThis emission has a debounce and is emitted after an `input` event."
             },
             {
               "name": "input",
-              "description": "Emitted when the component's model changes"
-            }
-          ],
-          "slots": [
-            {
-              "name": "default"
-            },
-            {
-              "name": "iconBefore"
-            },
-            {
-              "name": "defaultIconBefore"
-            },
-            {
-              "name": "paymentMethod"
-            },
-            {
-              "name": "staticValue"
-            },
-            {
-              "name": "iconAfter"
-            },
-            {
-              "name": "description"
+              "description": "Emits an `input` event whenever the value in the input is changed."
             }
           ],
           "source": {
-            "module": "./src/components/input-field/input-field.vue",
+            "module": "./src/components/input-field-password/input-field-password.vue",
             "symbol": "default"
           }
         },
@@ -7802,6 +8332,15 @@
           "name": "input-with-dropdown-filter",
           "description": "",
           "attributes": [
+            {
+              "name": "disabled",
+              "required": false,
+              "description": "Disables the filter from being interacted with.",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              }
+            },
             {
               "name": "defaultValue",
               "required": false,
@@ -7959,6 +8498,72 @@
             "symbol": "default"
           }
         },
+        {
+          "name": "layout",
+          "description": "",
+          "attributes": [
+            {
+              "name": "variant",
+              "required": false,
+              "description": "Defines if the layout is used in a page or only a section",
+              "value": {
+                "kind": "expression",
+                "type": "BentoLayoutVariant"
+              },
+              "default": "'page'"
+            },
+            {
+              "name": "size",
+              "required": false,
+              "description": "Defines the size of the page",
+              "value": {
+                "kind": "expression",
+                "type": "BentoLayoutSize"
+              },
+              "default": "'full-width'"
+            }
+          ],
+          "slots": [
+            {
+              "name": "default"
+            }
+          ],
+          "source": {
+            "module": "./src/components/layout/layout.vue",
+            "symbol": "default"
+          }
+        },
+        {
+          "name": "layout-row",
+          "description": "",
+          "attributes": [
+            {
+              "name": "columnsLayout",
+              "required": false,
+              "description": "Sets the layout of the columns when multiple columns are used",
+              "value": {
+                "kind": "expression",
+                "type": "BentoLayoutRowColumnLayout"
+              },
+              "default": "'6-6'"
+            }
+          ],
+          "slots": [
+            {
+              "name": "default"
+            },
+            {
+              "name": "col-1"
+            },
+            {
+              "name": "col-2"
+            }
+          ],
+          "source": {
+            "module": "./src/components/layout/components/layout-row/layout-row.vue",
+            "symbol": "default"
+          }
+        },
         {
           "name": "link",
           "description": "",
@@ -9800,6 +10405,95 @@
             "symbol": "default"
           }
         },
+        {
+          "name": "promo-banner",
+          "description": "",
+          "attributes": [
+            {
+              "name": "actions",
+              "required": false,
+              "description": "List of actions that will be used to render the buttons.\n\nEach object in the list should have a `title`, an `event` and a `variant`.\n\n`title`: Button's text.\n`event`: Event triggered when clicking the Button.\n`variant`: Button's style.\n\n```\n[{\n  title: 'Primary',\n  event: () => { ... },\n  variant: 'primary'\n}, {\n  title: 'Secondary',\n  event: () => { ... }\n  variant: 'secondary'\n}]\n```",
+              "value": {
+                "kind": "expression",
+                "type": "Array"
+              },
+              "default": "null"
+            },
+            {
+              "name": "color",
+              "required": false,
+              "description": "Defines the color of banner's background",
+              "value": {
+                "kind": "expression",
+                "type": "TSLiteralType"
+              },
+              "default": "BentoPromoBannerColor.GREY"
+            },
+            {
+              "name": "isDismissible",
+              "required": false,
+              "description": "Defines whether the banner has a `Dismiss` button",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              },
+              "default": "true"
+            },
+            {
+              "name": "dismissButtonText",
+              "required": false,
+              "description": "Defines whether the banner has a `Dismiss` button",
+              "value": {
+                "kind": "expression",
+                "type": "string"
+              },
+              "default": "null"
+            },
+            {
+              "name": "image",
+              "required": true,
+              "description": "Defines the image used in the banner.\n\nThe promotional banner adapts to different container sizes based on the image's `aspect-ratio`.\nOnly the following `aspect-ratio` values are supported: `16:9`, `2:1`, and `1:1`.\n\nIn Storybook, to verify the image display, update `image.src` and `image.aspectRatio` as follows:\n - `./1-1.png` with an aspect ratio of `1:1`\n - `./2-1.png` with an aspect ratio of `2:1`\n - `./16-9.png` with an aspect ratio of `16:9`",
+              "value": {
+                "kind": "expression",
+                "type": "BentoPromoBannerImage"
+              }
+            },
+            {
+              "name": "layout",
+              "required": false,
+              "description": "Defines style of the banner.\n\nThe horizontal layout is responsive to the container size and\nchanges depending on the image aspect ratio.\n\nThe vertical layout remains the same regardless of container size.",
+              "value": {
+                "kind": "expression",
+                "type": "TSLiteralType"
+              },
+              "default": "BentoPromoBannerLayout.HORIZONTAL"
+            },
+            {
+              "name": "title",
+              "required": true,
+              "description": "Defines the title text to be shown on the banner",
+              "value": {
+                "kind": "expression",
+                "type": "string"
+              }
+            }
+          ],
+          "events": [
+            {
+              "name": "dismiss",
+              "description": "Emits a dismiss event when dismiss button on the promotional banner is pressed"
+            }
+          ],
+          "slots": [
+            {
+              "name": "description"
+            }
+          ],
+          "source": {
+            "module": "./src/components/promo-banner/promo-banner.vue",
+            "symbol": "default"
+          }
+        },
         {
           "name": "radio-button",
           "description": "",
@@ -10529,6 +11223,15 @@
           "name": "select-filter-button",
           "description": "",
           "attributes": [
+            {
+              "name": "disabled",
+              "description": "Disables the filter from being interacted with.",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              },
+              "default": "false"
+            },
             {
               "name": "defaultValue",
               "description": "Default value of the filter to reset to.",
@@ -10606,6 +11309,15 @@
           "name": "select-filter-dropdown",
           "description": "",
           "attributes": [
+            {
+              "name": "disabled",
+              "description": "Disables the filter from being interacted with.",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              },
+              "default": "false"
+            },
             {
               "name": "defaultValue",
               "description": "Default value of the filter to reset to.",
@@ -10867,6 +11579,15 @@
                 "type": "BentoSelectionCardItem[]"
               }
             },
+            {
+              "name": "itemsPerRow",
+              "description": "Sets the responsive number of items rendered in each row.",
+              "value": {
+                "kind": "expression",
+                "type": "BentoSelectionCardGroupItemsPerRow"
+              },
+              "default": "undefined"
+            },
             {
               "name": "modelValue",
               "description": "Determines the initially selected value of the group. Corresponds to the BentoSelectionCardItem's value.\nDefaults to no value selected.",
@@ -12018,6 +12739,24 @@
                 "type": "boolean"
               },
               "default": "false"
+            },
+            {
+              "name": "fallbackPosition",
+              "description": "Allows to configure to fallback position to the one specified, it could be 'auto' or ['right', 'top', ...].\nUseful when not using auto as starting placement.",
+              "value": {
+                "kind": "expression",
+                "type": "FallbackPositionProp"
+              },
+              "default": "() => ['top', 'bottom', 'right', 'left']"
+            },
+            {
+              "name": "disabledFocusTrap",
+              "description": "Disables focus-trap for tooltip.\nUseful for maintaining focus on the target element.",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              },
+              "default": "false"
             }
           ],
           "source": {