@adyen/bento-vue2 1.51.0 → 1.53.0

package/dist/web-types.json

@@ -1,7 +1,7 @@
 {
   "framework": "vue",
   "name": "@adyen/bento-vue2",
-  "version": "1.51.0",
+  "version": "1.53.0",
   "contributions": {
     "html": {
       "description-markup": "markdown",
@@ -1420,6 +1420,15 @@
               },
               "default": "null"
             },
+            {
+              "name": "variant",
+              "description": "The type of calendar to display. Defaults to showing days.",
+              "value": {
+                "kind": "expression",
+                "type": "`${BentoDatePickerVariant}`"
+              },
+              "default": "undefined"
+            },
             {
               "name": "defaultDisplayMonth",
               "description": "Default start date for the calendar pane",
@@ -1675,6 +1684,15 @@
                 "type": "DateRangePickerCalendar.props.value"
               }
             },
+            {
+              "name": "variant",
+              "description": "The type of calendar to display. Defaults to showing days.",
+              "value": {
+                "kind": "expression",
+                "type": "`${BentoDateRangePickerVariant}`"
+              },
+              "default": "undefined"
+            },
             {
               "name": "hasActions",
               "description": "Enables the date picker selection to persist until it is explicitly applied.\nDisplays a set of buttons: Apply and Cancel.",
@@ -1834,79 +1852,6 @@
             "symbol": "default"
           }
         },
-        {
-          "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.",
-              "value": {
-                "kind": "expression",
-                "type": "string"
-              },
-              "default": "null"
-            },
-            {
-              "name": "field",
-              "required": true,
-              "description": "Filter name/key referencing the actual property name in the data set.\nShould be unique per filter bar.",
-              "value": {
-                "kind": "expression",
-                "type": "string"
-              }
-            },
-            {
-              "name": "label",
-              "required": true,
-              "description": "Label text to be displayed",
-              "value": {
-                "kind": "expression",
-                "type": "string"
-              }
-            },
-            {
-              "name": "value",
-              "description": "Current value of the filter.\nIf the options.variant is equal to 'dropdown', the value should be of type `{ inputValue: string | null; dropdownValue?: string }`.",
-              "value": {
-                "kind": "expression",
-                "type": "BentoInputFilterValue"
-              },
-              "default": "null"
-            },
-            {
-              "name": "onlySlot",
-              "description": "Renders the base filter's slot content only - leaving out the button and the popover.\nUsed for the allFiltersModal component.",
-              "value": {
-                "kind": "expression",
-                "type": "boolean"
-              },
-              "default": "false"
-            },
-            {
-              "name": "options",
-              "description": "List of options that are needed to setup the filter\nAvailable options:\n  - dropdown: all the dropdown properties that can be set in the inner dropdown of the input field. @see BentoDropdown for more info.\n  - dropdownPosition: allow the user to set the dropdown on the left or right side. Accepts the `start` or `end` values.",
-              "value": {
-                "kind": "expression",
-                "type": "BentoInputFilterOptions"
-              },
-              "default": "undefined"
-            }
-          ],
-          "source": {
-            "module": "./src/components/filter-bar/components/input-filter/input-filter.vue",
-            "symbol": "default"
-          }
-        },
         {
           "name": "bento-listbox",
           "description": "Listbox container.\nIt lists all the available options.",
@@ -1967,7 +1912,7 @@
             },
             {
               "name": "loading",
-              "description": "Indicates if new options are loading.",
+              "description": "Indicates if new options are lazy loading.",
               "value": {
                 "kind": "expression",
                 "type": "boolean"
@@ -1983,6 +1928,15 @@
               },
               "default": "BentoListboxLazyLoadType.NONE"
             },
+            {
+              "name": "componentLoading",
+              "description": "Indicates the listbox is loading filtered items.",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              },
+              "default": "false"
+            },
             {
               "name": "multiple",
               "description": "If enabled, the user will be able to select multiple items.",
@@ -2765,6 +2719,20 @@
                 "type": "BentoSummaryGridItemSize | `${BentoSummaryGridItemSize}`"
               },
               "default": "BentoSummaryGridItemSize.SMALL"
+            },
+            {
+              "name": "underlineTooltipText",
+              "description": "Text showed in the info-icon tooltip on hover",
+              "value": {
+                "kind": "expression",
+                "type": "string"
+              },
+              "default": "null"
+            }
+          ],
+          "slots": [
+            {
+              "name": "dashed-underline"
             }
           ],
           "source": {
@@ -2811,6 +2779,15 @@
                 "type": "boolean"
               },
               "default": "false"
+            },
+            {
+              "name": "underlineTooltipText",
+              "description": "Text showed in the info-icon tooltip on hover",
+              "value": {
+                "kind": "expression",
+                "type": "string"
+              },
+              "default": "null"
             }
           ],
           "events": [
@@ -2819,6 +2796,9 @@
             }
           ],
           "slots": [
+            {
+              "name": "dashed-underline"
+            },
             {
               "name": "default"
             }
@@ -2930,6 +2910,20 @@
                 "type": "BentoSummaryGridItemSize | `${BentoSummaryGridItemSize}`"
               },
               "default": "BentoSummaryGridItemSize.SMALL"
+            },
+            {
+              "name": "underlineTooltipText",
+              "description": "Text showed in the info-icon tooltip on hover",
+              "value": {
+                "kind": "expression",
+                "type": "string"
+              },
+              "default": "null"
+            }
+          ],
+          "slots": [
+            {
+              "name": "dashed-underline"
             }
           ],
           "source": {
@@ -3039,6 +3033,20 @@
                 "type": "BentoSummaryGridItemSize | `${BentoSummaryGridItemSize}`"
               },
               "default": "BentoSummaryGridItemSize.SMALL"
+            },
+            {
+              "name": "underlineTooltipText",
+              "description": "Text showed in the info-icon tooltip on hover",
+              "value": {
+                "kind": "expression",
+                "type": "string"
+              },
+              "default": "null"
+            }
+          ],
+          "slots": [
+            {
+              "name": "dashed-underline"
             }
           ],
           "source": {
@@ -3094,6 +3102,20 @@
                 "type": "boolean"
               },
               "default": "false"
+            },
+            {
+              "name": "underlineTooltipText",
+              "description": "Text showed in the info-icon tooltip on hover",
+              "value": {
+                "kind": "expression",
+                "type": "string"
+              },
+              "default": "null"
+            }
+          ],
+          "slots": [
+            {
+              "name": "dashed-underline"
             }
           ],
           "source": {
@@ -3482,6 +3504,15 @@
                 "type": "BentoButtonActionsList"
               }
             },
+            {
+              "name": "actionsLayout",
+              "description": "Defines the layout in which the button actions is presented.",
+              "value": {
+                "kind": "expression",
+                "type": "`${BentoButtonActionsLayout}`"
+              },
+              "default": "BentoButtonActionsLayout.BUTTONS_END"
+            },
             {
               "name": "disableResponsiveBehavior",
               "description": "The number of actions to be displayed. The rest of the actions will be collapsed in a menu component.",
@@ -3509,6 +3540,15 @@
               },
               "default": "false"
             },
+            {
+              "name": "hideDisplayedActionsBreakpoint",
+              "description": "The min-width breakpoint to hide the button actions.\n\nFor example, a value of 200 means that buttons will be hidden at <= 200px.\n\nDefaults to 0 i.e. it shows all buttons.",
+              "value": {
+                "kind": "expression",
+                "type": "number"
+              },
+              "default": "0"
+            },
             {
               "name": "menuPosition",
               "description": "The position of where the menu should open.",
@@ -3541,8 +3581,9 @@
               "description": "Allows you to set the first day of the week. 0 is sunday, 1 is monday, 6 is saturday",
               "value": {
                 "kind": "expression",
-                "type": "CalendarMonth.props.firstDayOfWeek"
-              }
+                "type": "CalendarMonthFirstDayOfWeek"
+              },
+              "default": "CalendarMonthFirstDayOfWeek.MONDAY"
             },
             {
               "name": "granularity",
@@ -3558,16 +3599,18 @@
               "description": "Indicate if a date should be disabled or not",
               "value": {
                 "kind": "expression",
-                "type": "CalendarMonth.props.isDateDisabled"
-              }
+                "type": "CalendarMonthIsDateDisabled"
+              },
+              "default": "undefined"
             },
             {
               "name": "isRange",
               "description": "Enables the Date Range calendar",
               "value": {
                 "kind": "expression",
-                "type": "CalendarMonth.props.isRange"
-              }
+                "type": "boolean"
+              },
+              "default": "false"
             },
             {
               "name": "maxRange",
@@ -3583,16 +3626,18 @@
               "description": "Sets a minimum limit for selectable dates - dates before `min` will not be selectable",
               "value": {
                 "kind": "expression",
-                "type": "CalendarMonth.props.min"
-              }
+                "type": "date"
+              },
+              "default": "null"
             },
             {
               "name": "max",
               "description": "Sets a maximum limit for selectable dates - dates after `max` will not be selectable",
               "value": {
                 "kind": "expression",
-                "type": "CalendarMonth.props.max"
-              }
+                "type": "date"
+              },
+              "default": "null"
             },
             {
               "name": "numberOfMonths",
@@ -3629,6 +3674,15 @@
                 "type": "string"
               },
               "default": "null"
+            },
+            {
+              "name": "variant",
+              "description": "The type of calendar to display. Defaults to showing days.",
+              "value": {
+                "kind": "expression",
+                "type": "`${CalendarVariant}`"
+              },
+              "default": "'day'"
             }
           ],
           "source": {
@@ -3708,9 +3762,9 @@
               "description": "When rendering multiple calendars, this property allows to render the\nNext and Previous calendar buttons to the right, left or not at all\ndepending on the position: Unique (only 1), First, Middle or Last",
               "value": {
                 "kind": "expression",
-                "type": "CalendarMonthPosition"
+                "type": "`${CalendarPosition}`"
               },
-              "default": "CalendarMonthPosition.UNIQUE"
+              "default": "'unique'"
             },
             {
               "name": "startDate",
@@ -3759,95 +3813,300 @@
           }
         },
         {
-          "name": "card",
+          "name": "calendar-year",
           "description": "",
           "attributes": [
             {
-              "name": "actions",
+              "name": "endDate",
               "required": false,
-              "description": "List of actions that will be used to render the buttons.\nFirst element in the list will be rendered as \"primary\".\nAll elements after the first will be rendered as \"secondary\".\n\nEach object in the list should have a `title`, an `event` and\n(optional) a Vue `icon` from the library `@adyen/ui-assets-icons-16`.\n\n`title`: Button's text.\n\n`event`: Event triggered when clicking the Button.\n\n`icon`: Vue Icon from the library `@adyen/ui-assets-icons-16`.\n\n```\n[{\n  title: 'Primary',\n  event: () => { ... },\n  icon: FourPeopleIcon\n}, {\n  title: 'Secondary',\n  event: () => { ... }\n}]\n```",
+              "description": "end of the selected range",
               "value": {
                 "kind": "expression",
-                "type": "BentoButtonActionsList"
+                "type": "Date"
               },
               "default": "null"
             },
             {
-              "name": "actionsLayout",
+              "name": "isDateDisabled",
               "required": false,
-              "description": "Defines the layout in which the button actions is presented.\nIt can be one of:",
+              "description": "Indicate if a date should be disabled or not",
               "value": {
                 "kind": "expression",
-                "type": "union"
+                "type": "TSFunctionType"
               },
-              "default": "BentoButtonActionsLayout.BUTTONS_END"
+              "default": "undefined"
             },
             {
-              "name": "background",
+              "name": "isRange",
               "required": false,
-              "description": "Defines the color of card background",
+              "description": "Indicates if the calendar is part of a range date picker or a single date picker",
               "value": {
                 "kind": "expression",
-                "type": "union"
+                "type": "boolean"
               },
-              "default": "BentoCardBackground.PRIMARY"
+              "default": "false"
             },
             {
-              "name": "closed",
+              "name": "min",
               "required": false,
-              "description": "Sets the expandable card in a closed state",
+              "description": "Sets a minimum limit for selectable dates - dates before `min` will not be selectable",
               "value": {
                 "kind": "expression",
-                "type": "boolean"
+                "type": "Date"
               },
-              "default": "false"
+              "default": "null"
             },
             {
-              "name": "disabled",
+              "name": "max",
               "required": false,
-              "description": "Disables the expandable card",
+              "description": "Sets a maximum limit for selectable dates - dates after `max` will not be selectable",
               "value": {
                 "kind": "expression",
-                "type": "boolean"
+                "type": "Date"
               },
-              "default": "false"
+              "default": "null"
             },
             {
-              "name": "expandable",
+              "name": "position",
               "required": false,
-              "description": "The whole content of the card will be expandable in accordion manner",
+              "description": "When rendering multiple calendars, this property allows to render the\nNext and Previous calendar buttons to the right, left or not at all\ndepending on the position: Unique (only 1), First, Middle or Last",
               "value": {
                 "kind": "expression",
-                "type": "boolean"
+                "type": "TSLiteralType"
               },
-              "default": "false"
+              "default": "'unique'"
             },
             {
-              "name": "titleSize",
+              "name": "startDate",
               "required": false,
-              "description": "Defines the title size of the card header",
+              "description": "start of the selected range",
               "value": {
                 "kind": "expression",
-                "type": "union"
+                "type": "Date"
               },
-              "default": "BentoCardTitleSize.DEFAULT"
+              "default": "null"
+            },
+            {
+              "name": "year",
+              "required": true,
+              "description": "Year to be displayed in the calendar",
+              "value": {
+                "kind": "expression",
+                "type": "Date"
+              }
             }
           ],
           "events": [
             {
-              "name": "click"
+              "name": "input"
             },
             {
-              "name": "expanded"
+              "name": "mouseover"
             }
           ],
-          "slots": [
-            {
-              "name": "image"
-            },
-            {
-              "name": "default"
-            },
+          "source": {
+            "module": "./src/components/internal/calendar/components/calendar-year/calendar-year.vue",
+            "symbol": "default"
+          }
+        },
+        {
+          "name": "calendar-year-month",
+          "description": "",
+          "attributes": [
+            {
+              "name": "month",
+              "required": true,
+              "description": "Date to be displayed as the calendar month. From 1st to 12th.",
+              "value": {
+                "kind": "expression",
+                "type": "Date"
+              }
+            },
+            {
+              "name": "disabled",
+              "required": false,
+              "description": "Indicate if a date should be disabled or not",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              },
+              "default": "false"
+            },
+            {
+              "name": "selected",
+              "required": false,
+              "description": "Changes the state of the calendar month to selected.",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              },
+              "default": "false"
+            },
+            {
+              "name": "variant",
+              "required": false,
+              "description": "When the month is selected, this indicates if the selection is a single month or part of a range.\nIf it's a range it can be at the beginning, middle or end of the selection.",
+              "value": {
+                "kind": "expression",
+                "type": "TSLiteralType"
+              },
+              "default": "CalendarYearMonthVariant.SINGLE"
+            }
+          ],
+          "events": [
+            {
+              "name": "click"
+            },
+            {
+              "name": "mouseover"
+            }
+          ],
+          "source": {
+            "module": "./src/components/internal/calendar/components/calendar-year/components/calendar-year-month.vue/calendar-year-month.vue",
+            "symbol": "default"
+          }
+        },
+        {
+          "name": "calendar-year-month-stub",
+          "description": "",
+          "attributes": [
+            {
+              "name": "month",
+              "required": true,
+              "description": "Date to be displayed as the calendar month. From 1st to 12th.",
+              "value": {
+                "kind": "expression",
+                "type": "Date"
+              }
+            },
+            {
+              "name": "disabled",
+              "required": false,
+              "description": "Indicate if a date should be disabled or not",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              }
+            },
+            {
+              "name": "selected",
+              "required": false,
+              "description": "Changes the state of the calendar month to selected.",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              }
+            },
+            {
+              "name": "variant",
+              "required": false,
+              "description": "When the month is selected, this indicates if the selection is a single month or part of a range.\nIf it's a range it can be at the beginning, middle or end of the selection.",
+              "value": {
+                "kind": "expression",
+                "type": "TSLiteralType"
+              }
+            }
+          ],
+          "events": [
+            {
+              "name": "<undefined>"
+            }
+          ],
+          "source": {
+            "module": "./src/components/internal/calendar/components/calendar-year/components/calendar-year-month.vue/__test__/calendar-year-month-stub.vue",
+            "symbol": "default"
+          }
+        },
+        {
+          "name": "card",
+          "description": "",
+          "attributes": [
+            {
+              "name": "actions",
+              "required": false,
+              "description": "List of actions that will be used to render the buttons.\nFirst element in the list will be rendered as \"primary\".\nAll elements after the first will be rendered as \"secondary\".\n\nEach object in the list should have a `title`, an `event` and\n(optional) a Vue `icon` from the library `@adyen/ui-assets-icons-16`.\n\n`title`: Button's text.\n\n`event`: Event triggered when clicking the Button.\n\n`icon`: Vue Icon from the library `@adyen/ui-assets-icons-16`.\n\n```\n[{\n  title: 'Primary',\n  event: () => { ... },\n  icon: FourPeopleIcon\n}, {\n  title: 'Secondary',\n  event: () => { ... }\n}]\n```",
+              "value": {
+                "kind": "expression",
+                "type": "BentoButtonActionsList"
+              },
+              "default": "null"
+            },
+            {
+              "name": "actionsLayout",
+              "required": false,
+              "description": "Defines the layout in which the button actions is presented.\nIt can be one of:",
+              "value": {
+                "kind": "expression",
+                "type": "union"
+              },
+              "default": "BentoButtonActionsLayout.BUTTONS_END"
+            },
+            {
+              "name": "background",
+              "required": false,
+              "description": "Defines the color of card background",
+              "value": {
+                "kind": "expression",
+                "type": "union"
+              },
+              "default": "BentoCardBackground.PRIMARY"
+            },
+            {
+              "name": "closed",
+              "required": false,
+              "description": "Sets the expandable card in a closed state",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              },
+              "default": "false"
+            },
+            {
+              "name": "disabled",
+              "required": false,
+              "description": "Disables the expandable card",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              },
+              "default": "false"
+            },
+            {
+              "name": "expandable",
+              "required": false,
+              "description": "The whole content of the card will be expandable in accordion manner",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              },
+              "default": "false"
+            },
+            {
+              "name": "titleSize",
+              "required": false,
+              "description": "Defines the title size of the card header",
+              "value": {
+                "kind": "expression",
+                "type": "union"
+              },
+              "default": "BentoCardTitleSize.DEFAULT"
+            }
+          ],
+          "events": [
+            {
+              "name": "click"
+            },
+            {
+              "name": "expanded"
+            }
+          ],
+          "slots": [
+            {
+              "name": "image"
+            },
+            {
+              "name": "default"
+            },
             {
               "name": "header"
             },
@@ -4592,6 +4851,15 @@
               },
               "default": "() => []"
             },
+            {
+              "name": "filterSearchConfig",
+              "description": "Filter's search bar properties with which the placeholder, hint and other\n\"bento-search-bar\" properties can be set. @see {@link BentoFilterBarSearchBarProps}",
+              "value": {
+                "kind": "expression",
+                "type": "BentoFilterBarSearchBarProps"
+              },
+              "default": "undefined"
+            },
             {
               "name": "filterSearchTerm",
               "description": "Filter bar search term useful to filter all the data by text",
@@ -5741,6 +6009,14 @@
                 "type": "BentoDateRangePickerValue"
               },
               "default": "undefined"
+            },
+            {
+              "name": "variant",
+              "description": "The type of calendar to display. Defaults to showing days.",
+              "value": {
+                "kind": "expression",
+                "type": "Calendar.props.variant"
+              }
             }
           ],
           "slots": [
@@ -5979,7 +6255,16 @@
             },
             {
               "name": "loading",
-              "description": "Indicates if new options are loading.",
+              "description": "Indicates if new options are lazy loading.",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              },
+              "default": "false"
+            },
+            {
+              "name": "componentLoading",
+              "description": "Indicates that dropdown items are loading",
               "value": {
                 "kind": "expression",
                 "type": "boolean"
@@ -6627,6 +6912,15 @@
               },
               "default": "null"
             },
+            {
+              "name": "componentLoading",
+              "description": "Indicates that dropdown items are loading",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              },
+              "default": "false"
+            },
             {
               "name": "emptyState",
               "description": "Empty state props used with the inner empty state component which is displayed when no search results are found.",
@@ -6692,7 +6986,7 @@
             },
             {
               "name": "loading",
-              "description": "Indicates if new options are loading.",
+              "description": "Indicates if new options are lazy loading.",
               "value": {
                 "kind": "expression",
                 "type": "boolean"
@@ -6783,6 +7077,13 @@
                 "type": "BentoDropdownOptionsContainer.props.open"
               }
             },
+            {
+              "name": "componentLoading",
+              "value": {
+                "kind": "expression",
+                "type": "BentoDropdownOptionsContainer.props.componentLoading"
+              }
+            },
             {
               "name": "selectedValue",
               "value": {
@@ -7338,7 +7639,7 @@
             {
               "name": "modelValue",
               "required": false,
-              "description": "Used to support `v-model`. Doesn't actually set the value of the file uploader.",
+              "description": "Used to support `v-model`. Can be used to set value of FileUploader if FileList",
               "value": {
                 "kind": "expression",
                 "type": "BentoFileUploaderValue"
@@ -7891,166 +8192,554 @@
               "default": "false"
             }
           ],
+          "events": [
+            {
+              "name": "submit",
+              "description": "Emits the submit event from the form"
+            }
+          ],
           "slots": [
             {
-              "name": "error-message"
+              "name": "error-message"
+            },
+            {
+              "name": "default"
+            },
+            {
+              "name": "actions-left"
+            },
+            {
+              "name": "actions-right"
+            }
+          ],
+          "source": {
+            "module": "./src/components/form-layout/form-layout.vue",
+            "symbol": "default"
+          }
+        },
+        {
+          "name": "form-layout-field-tip",
+          "description": "",
+          "attributes": [
+            {
+              "name": "type",
+              "description": "Type of a alert; set a distinctive icon and color. Defaults to highlight.",
+              "value": {
+                "kind": "expression",
+                "type": "BentoFormLayoutFieldTipTypeOption"
+              },
+              "default": "'highlight'"
+            }
+          ],
+          "slots": [
+            {
+              "name": "default"
+            },
+            {
+              "name": "message"
+            }
+          ],
+          "source": {
+            "module": "./src/components/form-layout/components/form-layout-field-tip/form-layout-field-tip.vue",
+            "symbol": "default"
+          }
+        },
+        {
+          "name": "form-layout-group",
+          "description": "",
+          "attributes": [
+            {
+              "name": "layout",
+              "description": "The layout of the pair group of components.\nThis will render the components within the width of the proportions.\nOnly two colums are available.\n\nIf only one value is entered, then it will assume there's only one child in the group.\nIf two values are entered, the first value will be use for the first child and the second\nvalue for the second child.\n\nIf the value entered is not listed in the example\nlist below it will use 100% by default.",
+              "value": {
+                "kind": "expression",
+                "type": "BentoLayoutGroupProportions"
+              },
+              "default": "'100'"
+            }
+          ],
+          "slots": [
+            {
+              "name": "default"
+            }
+          ],
+          "source": {
+            "module": "./src/components/form-layout/components/form-layout-group/form-layout-group.vue",
+            "symbol": "default"
+          }
+        },
+        {
+          "name": "form-layout-title",
+          "description": "",
+          "attributes": [
+            {
+              "name": "subsection",
+              "description": "Defines if the Form Layout title is\na \"section\" or a \"subsection\".\nDefault is \"section\" (false). Turn into \"true\" for \"subsection\"",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              },
+              "default": "false"
+            },
+            {
+              "name": "el",
+              "required": true,
+              "description": "Sets the HTML DOM element.",
+              "value": {
+                "kind": "expression",
+                "type": "BentoTypography.props.el.type"
+              }
+            }
+          ],
+          "slots": [
+            {
+              "name": "default"
+            },
+            {
+              "name": "description"
+            }
+          ],
+          "source": {
+            "module": "./src/components/form-layout/components/form-layout-title/form-layout-title.vue",
+            "symbol": "default"
+          }
+        },
+        {
+          "name": "grid-layout",
+          "description": "Component used to render the grid layout in the bento-summary-grid. For internal use only",
+          "attributes": [
+            {
+              "name": "columnWidth",
+              "description": "Sets the responsive columns widths for the grid.",
+              "value": {
+                "kind": "expression",
+                "type": "GridLayoutColumnWidths"
+              },
+              "default": "null"
+            },
+            {
+              "name": "containerType",
+              "description": "Set the type of CSS container the grid layout has",
+              "value": {
+                "kind": "expression",
+                "type": "GridLayoutContainerType"
+              },
+              "default": "GridLayoutContainerType.INLINE"
+            },
+            {
+              "name": "noGap",
+              "description": "Sets the gap in the grid to 0.",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              },
+              "default": "false"
+            }
+          ],
+          "slots": [
+            {
+              "name": "col-1"
+            },
+            {
+              "name": "col-2"
+            },
+            {
+              "name": "col-3"
+            },
+            {
+              "name": "col-4"
+            },
+            {
+              "name": "col-5"
+            },
+            {
+              "name": "col-6"
+            }
+          ],
+          "source": {
+            "module": "./src/components/internal/grid-layout/grid-layout.vue",
+            "symbol": "default"
+          }
+        },
+        {
+          "name": "header-with-views",
+          "description": "",
+          "attributes": [
+            {
+              "name": "actions",
+              "required": false,
+              "description": "Optional list of actions (buttons) to display in the header.\nThe structure of each action is defined by the `BentoButtonActionsList` type.",
+              "value": {
+                "kind": "expression",
+                "type": "BentoButtonActionsList"
+              },
+              "default": "() => []"
+            },
+            {
+              "name": "description",
+              "required": false,
+              "description": "Optional secondary description text to display below the title.",
+              "value": {
+                "kind": "expression",
+                "type": "string"
+              },
+              "default": "null"
+            },
+            {
+              "name": "title",
+              "required": true,
+              "description": "Main title text for the header. This prop is required.",
+              "value": {
+                "kind": "expression",
+                "type": "string"
+              },
+              "default": "null"
+            },
+            {
+              "name": "views",
+              "required": false,
+              "description": "Optional array of view items to display as selectable views or tabs.\nEach item's structure is defined by the `BentoHeaderWithViewsItem` interface.",
+              "value": {
+                "kind": "expression",
+                "type": "Array"
+              },
+              "default": "() => []"
+            },
+            {
+              "name": "additionalViewSetting",
+              "required": false,
+              "description": "Optional configuration for an additional view setting, such as a filter or option.\nDefined by the `BentoHeaderWithViewsItemAdditionalConfig` interface.",
+              "value": {
+                "kind": "expression",
+                "type": "BentoHeaderWithViewsItemAdditionalConfig"
+              },
+              "default": "null"
+            },
+            {
+              "name": "hasChanges",
+              "required": true,
+              "description": "Boolean indicating whether there are unsaved changes on the page.\nThis might be used to visually indicate to the user that they need to save their work.",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              }
+            },
+            {
+              "name": "skipUnsavedChangesText",
+              "required": true,
+              "description": "String indicating whether to display a prompt, reminding the user to save their changes whenever they switch view tabs.\nIf null, no prompt is shown and changes will always be restored to it's previous settings on view tab change.",
+              "value": {
+                "kind": "expression",
+                "type": "union"
+              }
+            }
+          ],
+          "events": [
+            {
+              "name": "add:view",
+              "description": "Emitted when a new view is added to the list of views."
+            },
+            {
+              "name": "delete:view",
+              "description": "Emitted when a view is deleted from the list of views."
+            },
+            {
+              "name": "duplicate:view",
+              "description": "Emitted when a view is duplicated."
+            },
+            {
+              "name": "reorder:view",
+              "description": "Emitted when the user reorganises the order of the views.\nNo `targetViewLabel` is emitted as the views are reordered as a whole."
+            },
+            {
+              "name": "restore:view",
+              "description": "Emitted when the user requests to restore a previously saved or default view."
+            },
+            {
+              "name": "save:view",
+              "description": "Emitted when the user requests to save the current view."
+            },
+            {
+              "name": "select:view",
+              "description": "Emitted when the user selects a different view from the available options."
+            },
+            {
+              "name": "update:view",
+              "description": "Emitted when a property of a view is updated."
+            },
+            {
+              "name": "update:skip-unsaved-changes",
+              "description": "Emitted when the user selects the prompt checkbox and closes the modal with a valid button action.\nOnly works when a string is pass into the `skipUnsavedChangesText` prop."
+            }
+          ],
+          "slots": [
+            {
+              "name": "infoIconTooltipContent"
+            }
+          ],
+          "source": {
+            "module": "./src/components/header-with-views/header-with-views.vue",
+            "symbol": "default"
+          }
+        },
+        {
+          "name": "header-with-views-all-views",
+          "description": "",
+          "attributes": [
+            {
+              "name": "menuCloseOnClickOutsideOptions",
+              "required": false,
+              "value": {
+                "kind": "expression",
+                "type": "TSIndexedAccessType"
+              }
+            },
+            {
+              "name": "menuItems",
+              "required": true,
+              "value": {
+                "kind": "expression",
+                "type": "Array"
+              }
+            },
+            {
+              "name": "menuItemsActions",
+              "required": true,
+              "value": {
+                "kind": "expression",
+                "type": "Array"
+              }
+            }
+          ],
+          "events": [
+            {
+              "name": "close:all-views",
+              "description": "Emitted when the \"all views\" menu is requested to be closed."
+            },
+            {
+              "name": "close:view-menu",
+              "description": "Emitted when a specific view's action menu is requested to be closed."
             },
             {
-              "name": "default"
+              "name": "open:all-views",
+              "description": "Emitted when the \"all views\" menu is requested to be opened."
             },
             {
-              "name": "actions-left"
+              "name": "open:view-menu",
+              "description": "Emitted when a specific view's action menu is requested to be opened."
             },
             {
-              "name": "actions-right"
+              "name": "select:view",
+              "description": "Emitted when a view item is selected from the \"all views\" menu."
+            },
+            {
+              "name": "reorder:view",
+              "description": "Emitted when the order of views has been changed due to drag and drop."
             }
           ],
           "source": {
-            "module": "./src/components/form-layout/form-layout.vue",
+            "module": "./src/components/header-with-views/components/header-with-views-all-views/header-with-views-all-views.vue",
             "symbol": "default"
           }
         },
         {
-          "name": "form-layout-field-tip",
+          "name": "header-with-views-and-toast-stub",
           "description": "",
           "attributes": [
             {
-              "name": "type",
-              "description": "Type of a alert; set a distinctive icon and color. Defaults to highlight.",
+              "name": "actions",
+              "required": false,
+              "description": "Optional list of actions (buttons) to display in the header.\nThe structure of each action is defined by the `BentoButtonActionsList` type.",
               "value": {
                 "kind": "expression",
-                "type": "BentoFormLayoutFieldTipTypeOption"
-              },
-              "default": "'highlight'"
-            }
-          ],
-          "slots": [
+                "type": "BentoButtonActionsList"
+              }
+            },
             {
-              "name": "default"
+              "name": "description",
+              "required": false,
+              "description": "Optional secondary description text to display below the title.",
+              "value": {
+                "kind": "expression",
+                "type": "string"
+              }
             },
             {
-              "name": "message"
-            }
-          ],
-          "source": {
-            "module": "./src/components/form-layout/components/form-layout-field-tip/form-layout-field-tip.vue",
-            "symbol": "default"
-          }
-        },
-        {
-          "name": "form-layout-group",
-          "description": "",
-          "attributes": [
+              "name": "title",
+              "required": true,
+              "description": "Main title text for the header. This prop is required.",
+              "value": {
+                "kind": "expression",
+                "type": "string"
+              }
+            },
             {
-              "name": "layout",
-              "description": "The layout of the pair group of components.\nThis will render the components within the width of the proportions.\nOnly two colums are available.\n\nIf only one value is entered, then it will assume there's only one child in the group.\nIf two values are entered, the first value will be use for the first child and the second\nvalue for the second child.\n\nIf the value entered is not listed in the example\nlist below it will use 100% by default.",
+              "name": "views",
+              "required": false,
+              "description": "Optional array of view items to display as selectable views or tabs.\nEach item's structure is defined by the `BentoHeaderWithViewsItem` interface.",
               "value": {
                 "kind": "expression",
-                "type": "BentoLayoutGroupProportions"
-              },
-              "default": "'100'"
-            }
-          ],
-          "slots": [
+                "type": "Array"
+              }
+            },
             {
-              "name": "default"
-            }
-          ],
-          "source": {
-            "module": "./src/components/form-layout/components/form-layout-group/form-layout-group.vue",
-            "symbol": "default"
-          }
-        },
-        {
-          "name": "form-layout-title",
-          "description": "",
-          "attributes": [
+              "name": "additionalViewSetting",
+              "required": false,
+              "description": "Optional configuration for an additional view setting, such as a filter or option.\nDefined by the `BentoHeaderWithViewsItemAdditionalConfig` interface.",
+              "value": {
+                "kind": "expression",
+                "type": "BentoHeaderWithViewsItemAdditionalConfig"
+              }
+            },
             {
-              "name": "subsection",
-              "description": "Defines if the Form Layout title is\na \"section\" or a \"subsection\".\nDefault is \"section\" (false). Turn into \"true\" for \"subsection\"",
+              "name": "hasChanges",
+              "required": true,
+              "description": "Boolean indicating whether there are unsaved changes on the page.\nThis might be used to visually indicate to the user that they need to save their work.",
               "value": {
                 "kind": "expression",
                 "type": "boolean"
-              },
-              "default": "false"
+              }
             },
             {
-              "name": "el",
+              "name": "skipUnsavedChangesText",
               "required": true,
-              "description": "Sets the HTML DOM element.",
+              "description": "String indicating whether to display a prompt, reminding the user to save their changes whenever they switch view tabs.\nIf null, no prompt is shown and changes will always be restored to it's previous settings on view tab change.",
               "value": {
                 "kind": "expression",
-                "type": "BentoTypography.props.el.type"
+                "type": "union"
               }
             }
           ],
-          "slots": [
+          "events": [
             {
-              "name": "default"
+              "name": "add:view",
+              "description": "Emitted when a new view is added to the list of views."
             },
             {
-              "name": "description"
+              "name": "delete:view",
+              "description": "Emitted when a view is deleted from the list of views."
+            },
+            {
+              "name": "duplicate:view",
+              "description": "Emitted when a view is duplicated."
+            },
+            {
+              "name": "reorder:view",
+              "description": "Emitted when the user reorganises the order of the views.\nNo `targetViewLabel` is emitted as the views are reordered as a whole."
+            },
+            {
+              "name": "restore:view",
+              "description": "Emitted when the user requests to restore a previously saved or default view."
+            },
+            {
+              "name": "save:view",
+              "description": "Emitted when the user requests to save the current view."
+            },
+            {
+              "name": "select:view",
+              "description": "Emitted when the user selects a different view from the available options."
+            },
+            {
+              "name": "update:view",
+              "description": "Emitted when a property of a view is updated."
+            },
+            {
+              "name": "update:skip-unsaved-changes",
+              "description": "Emitted when the user selects the prompt checkbox and closes the modal with a valid button action.\nOnly works when a string is pass into the `skipUnsavedChangesText` prop."
             }
           ],
           "source": {
-            "module": "./src/components/form-layout/components/form-layout-title/form-layout-title.vue",
+            "module": "./src/components/header-with-views/__tests__/header-with-views-and-toast-stub.vue",
             "symbol": "default"
           }
         },
         {
-          "name": "grid-layout",
-          "description": "Component used to render the grid layout in the bento-summary-grid. For internal use only",
+          "name": "header-with-views-edit-form",
+          "description": "",
           "attributes": [
             {
-              "name": "columnWidth",
-              "description": "Sets the responsive columns widths for the grid.",
+              "name": "additionalFormItem",
+              "required": false,
               "value": {
                 "kind": "expression",
-                "type": "GridLayoutColumnWidths"
+                "type": "BentoHeaderWithViewsItemAdditionalConfig"
               },
               "default": "null"
             },
             {
-              "name": "containerType",
-              "description": "Set the type of CSS container the grid layout has",
+              "name": "context",
+              "required": false,
               "value": {
                 "kind": "expression",
-                "type": "GridLayoutContainerType"
+                "type": "HeaderWithViewsEditFormContext"
               },
-              "default": "GridLayoutContainerType.INLINE"
+              "default": "HeaderWithViewsEditFormContextEnum.CREATE"
             },
             {
-              "name": "noGap",
-              "description": "Sets the gap in the grid to 0.",
+              "name": "errors",
+              "required": false,
               "value": {
                 "kind": "expression",
-                "type": "boolean"
+                "type": "BentoHeaderWithViewsItemErrors"
               },
-              "default": "false"
+              "default": "null"
+            },
+            {
+              "name": "icon",
+              "required": false,
+              "value": {
+                "kind": "expression",
+                "type": "BentoHeaderWithViewsItemIcon"
+              },
+              "default": "BentoHeaderWithViewsItemIconEnum.STACK"
+            },
+            {
+              "name": "iconColor",
+              "required": false,
+              "value": {
+                "kind": "expression",
+                "type": "BentoHeaderWithViewsItemIconColor"
+              },
+              "default": "BentoHeaderWithViewsItemIconColorEnum.PRIMARY"
+            },
+            {
+              "name": "label",
+              "required": false,
+              "value": {
+                "kind": "expression",
+                "type": "string"
+              },
+              "default": "''"
             }
           ],
-          "slots": [
+          "events": [
             {
-              "name": "col-1"
+              "name": "cancel",
+              "description": "Emitted when form is canceled."
             },
             {
-              "name": "col-2"
+              "name": "update",
+              "description": "Emitted when the item is updated.\nTypically used to sync changes to the parent component."
             },
             {
-              "name": "col-3"
+              "name": "delete",
+              "description": "Emitted when the item is requested to be deleted."
             },
             {
-              "name": "col-4"
+              "name": "input:label",
+              "description": "Emitted when the label of the item is modified via input."
             },
             {
-              "name": "col-5"
+              "name": "blur:label",
+              "description": "Emitted when the label input loses focus (blur event)."
             },
             {
-              "name": "col-6"
+              "name": "keydown:enter",
+              "description": "Emitted when the Enter key is pressed while interacting with the item."
             }
           ],
           "source": {
-            "module": "./src/components/internal/grid-layout/grid-layout.vue",
+            "module": "./src/components/header-with-views/components/header-with-views-item-edit-form/header-with-views-edit-form.vue",
             "symbol": "default"
           }
         },
@@ -8428,6 +9117,16 @@
               },
               "default": "false"
             },
+            {
+              "name": "disableValidation",
+              "required": false,
+              "description": "Performs real-time validations over the input value. Default: `false`.\nDisabling the option (set to `true`) will not run pre-defined validations or custom validations defined in the `validation` field.",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              },
+              "default": "false"
+            },
             {
               "name": "errorMessage",
               "required": false,
@@ -8665,6 +9364,94 @@
             "symbol": "default"
           }
         },
+        {
+          "name": "input-filter",
+          "description": "",
+          "attributes": [
+            {
+              "name": "defaultValue",
+              "required": false,
+              "description": "Default value of the filter to reset to.",
+              "value": {
+                "kind": "expression",
+                "type": "string"
+              },
+              "default": "null"
+            },
+            {
+              "name": "disabled",
+              "required": false,
+              "description": "Disables the filter from being interacted with.",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              },
+              "default": "false"
+            },
+            {
+              "name": "field",
+              "required": true,
+              "description": "Filter name/key referencing the actual property name in the data set.\nShould be unique per filter bar.",
+              "value": {
+                "kind": "expression",
+                "type": "string"
+              }
+            },
+            {
+              "name": "label",
+              "required": true,
+              "description": "Label text to be displayed",
+              "value": {
+                "kind": "expression",
+                "type": "string"
+              }
+            },
+            {
+              "name": "onlySlot",
+              "required": false,
+              "description": "Renders the base filter's slot content only - leaving out the button and the popover.\nUsed for the allFiltersModal component.",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              },
+              "default": "false"
+            },
+            {
+              "name": "options",
+              "required": false,
+              "description": "List of options that are needed to setup the filter\nAvailable options:\n  - placeholder: allows to set a placeholder to the search bar\n  - dropdown (deprecated): all the dropdown properties that can be set in the inner dropdown of the input field. @see BentoDropdown for more info.\n  - dropdownPosition (deprecated): allow the user to set the dropdown on the left or right side. Accepts the `start` or `end` values.\n  - variant (deprecated): can be `undefined` or set to `dropdown`. Enables dropdown input variant.",
+              "value": {
+                "kind": "expression",
+                "type": "BentoInputFilterOptions"
+              },
+              "default": "undefined"
+            },
+            {
+              "name": "value",
+              "required": false,
+              "description": "Current value of the filter.\nIf the options.variant is equal to 'dropdown', the value should be of type `{ inputValue: string | null; dropdownValue?: string }`.",
+              "value": {
+                "kind": "expression",
+                "type": "BentoInputFilterValue"
+              },
+              "default": "null"
+            }
+          ],
+          "events": [
+            {
+              "name": "input",
+              "description": "Fires upon the user interacting with the filter"
+            },
+            {
+              "name": "update",
+              "description": "Fires on the (new) filter values being applied"
+            }
+          ],
+          "source": {
+            "module": "./src/components/filter-bar/components/input-filter/input-filter.vue",
+            "symbol": "default"
+          }
+        },
         {
           "name": "input-with-dropdown-filter",
           "description": "",
@@ -12663,9 +13450,21 @@
                 "type": "BentoSummaryGridItemTrendDirection | `${BentoSummaryGridItemTrendDirection}`"
               },
               "default": "BentoSummaryGridItemTrendDirection.POSITIVE"
+            },
+            {
+              "name": "underlineTooltipText",
+              "description": "Text showed in a dashed-underline title tooltip on hover",
+              "value": {
+                "kind": "expression",
+                "type": "string"
+              },
+              "default": "null"
             }
           ],
           "slots": [
+            {
+              "name": "dashed-underline"
+            },
             {
               "name": "default"
             },