@adyen/bento-vue2 1.66.0 → 1.68.0

package/dist/web-types.json

@@ -1,7 +1,7 @@
 {
   "framework": "vue",
   "name": "@adyen/bento-vue2",
-  "version": "1.66.0",
+  "version": "1.68.0",
   "contributions": {
     "html": {
       "description-markup": "markdown",
@@ -4283,7 +4283,7 @@
             },
             {
               "name": "fitContent",
-              "description": "Allows the grid to be rendered inside a confined space.",
+              "description": "Allows the grid to be rendered inside a confined space.\nThis makes the data-grid expand to fill the height of its parent container, with the grid body becoming scrollable.",
               "value": {
                 "kind": "expression",
                 "type": "boolean"
@@ -4969,6 +4969,15 @@
               },
               "default": "false"
             },
+            {
+              "name": "selectionState",
+              "description": "Determines which state of row selection is currently active. Used to display the \"Select all\" menu options.",
+              "value": {
+                "kind": "expression",
+                "type": "BentoDatagridColumnSelectionState"
+              },
+              "default": "undefined"
+            },
             {
               "name": "sortBy",
               "description": "Sortby handles proper rendering of sort icon in header. Sorting currently is only supported server side.\nIt does make sure the currently sorted column has a more visible sort icon, and the sort icon points in the right direction.",
@@ -5020,6 +5029,30 @@
             "symbol": "default"
           }
         },
+        {
+          "name": "data-grid-fit-content-in-card-example",
+          "description": "",
+          "source": {
+            "module": "./src/components/data-grid/__tests__/data-grid-fit-content-in-card-example.vue",
+            "symbol": "default"
+          }
+        },
+        {
+          "name": "data-grid-fit-content-in-modal-example",
+          "description": "",
+          "source": {
+            "module": "./src/components/data-grid/__tests__/data-grid-fit-content-in-modal-example.vue",
+            "symbol": "default"
+          }
+        },
+        {
+          "name": "data-grid-fit-content-in-modal-fullscreen-example",
+          "description": "",
+          "source": {
+            "module": "./src/components/data-grid/__tests__/data-grid-fit-content-in-modal-fullscreen-example.vue",
+            "symbol": "default"
+          }
+        },
         {
           "name": "data-grid-interactive-elements-in-cells-and-headers",
           "description": "",
@@ -5753,7 +5786,7 @@
           "attributes": [
             {
               "name": "ariaLabel",
-              "description": "Defines a string value that labels an interactive element.",
+              "required": false,
               "value": {
                 "kind": "expression",
                 "type": "string"
@@ -5762,6 +5795,7 @@
             },
             {
               "name": "condensed",
+              "required": false,
               "description": "Renders the dropdown with a condensed style.",
               "value": {
                 "kind": "expression",
@@ -5771,6 +5805,7 @@
             },
             {
               "name": "emptyState",
+              "required": false,
               "description": "Empty state props used with the inner empty state component which is displayed when no search results are found.",
               "value": {
                 "kind": "expression",
@@ -5780,6 +5815,7 @@
             },
             {
               "name": "disabled",
+              "required": false,
               "description": "Disables dropdown functionality.",
               "value": {
                 "kind": "expression",
@@ -5789,6 +5825,7 @@
             },
             {
               "name": "dynamicFiltering",
+              "required": false,
               "description": "Sets the possibility to type into the textbox.",
               "value": {
                 "kind": "expression",
@@ -5798,6 +5835,7 @@
             },
             {
               "name": "error",
+              "required": false,
               "description": "Highlights the dropdown in an erroneous state.",
               "value": {
                 "kind": "expression",
@@ -5807,6 +5845,7 @@
             },
             {
               "name": "errorMessage",
+              "required": false,
               "description": "Highlights the dropdown in an erroneous state with an error message.",
               "value": {
                 "kind": "expression",
@@ -5816,6 +5855,7 @@
             },
             {
               "name": "description",
+              "required": false,
               "description": "Descriptive supporting text visbile underneath the dropdown.",
               "value": {
                 "kind": "expression",
@@ -5825,6 +5865,7 @@
             },
             {
               "name": "hasMoreItems",
+              "required": false,
               "description": "Indicates whether there are more items to load",
               "value": {
                 "kind": "expression",
@@ -5834,6 +5875,7 @@
             },
             {
               "name": "isOptionDisabled",
+              "required": false,
               "description": "Function that dertermines which options are disabled from interaction.",
               "value": {
                 "kind": "expression",
@@ -5843,7 +5885,8 @@
             },
             {
               "name": "items",
-              "description": "The option elements to populate the dropdown with.\nIt must be an array of {@see BentoListboxOptionItem }\n * @property {string} value.label - Text to be displayed in the option\n * @property {string,number} value.value - Value of the option",
+              "required": false,
+              "description": "The option elements to populate the dropdown with.\nIt must be an array of {@see BentoListboxOptionItem }",
               "value": {
                 "kind": "expression",
                 "type": "BentoListboxOptions"
@@ -5852,6 +5895,7 @@
             },
             {
               "name": "label",
+              "required": false,
               "description": "Text that is displayed as a label above the element.",
               "value": {
                 "kind": "expression",
@@ -5861,6 +5905,7 @@
             },
             {
               "name": "loading",
+              "required": false,
               "description": "Indicates if new options are lazy loading.",
               "value": {
                 "kind": "expression",
@@ -5870,6 +5915,7 @@
             },
             {
               "name": "componentLoading",
+              "required": false,
               "description": "Indicates that dropdown items are loading",
               "value": {
                 "kind": "expression",
@@ -5879,15 +5925,18 @@
             },
             {
               "name": "lazyLoadType",
+              "required": false,
               "description": "The type of `Lazy Load`.\nType \"automatic\" will enable infinite scrolling\nType \"button\" will enable lazy loading with \"Show more\" button",
               "value": {
                 "kind": "expression",
-                "type": "BentoDropdownLazyLoadType | `${BentoDropdownLazyLoadType}`"
+                "type": "union"
               },
               "default": "BentoListbox.props.lazyLoadType.default"
             },
             {
               "name": "multiple",
+              "required": false,
+              "description": "If enabled, the user will be able to select multiple items.",
               "value": {
                 "kind": "expression",
                 "type": "boolean"
@@ -5896,6 +5945,7 @@
             },
             {
               "name": "optional",
+              "required": false,
               "description": "Highlights the dropdown is optional.",
               "value": {
                 "kind": "expression",
@@ -5905,6 +5955,7 @@
             },
             {
               "name": "placeholder",
+              "required": false,
               "description": "Text that appears in the form control when it has no value set",
               "value": {
                 "kind": "expression",
@@ -5914,6 +5965,7 @@
             },
             {
               "name": "readonly",
+              "required": false,
               "description": "Sets the dropdown to readonly state",
               "value": {
                 "kind": "expression",
@@ -5923,6 +5975,7 @@
             },
             {
               "name": "required",
+              "required": false,
               "description": "Highlights the dropdown is required.",
               "value": {
                 "kind": "expression",
@@ -5932,6 +5985,7 @@
             },
             {
               "name": "search",
+              "required": false,
               "description": "Dropdown search options and events.",
               "value": {
                 "kind": "expression",
@@ -5941,6 +5995,7 @@
             },
             {
               "name": "showSlotContentInMultiple",
+              "required": false,
               "description": "Toggles whether to use the slot content select items shown in the textbox in multiple mode.",
               "value": {
                 "kind": "expression",
@@ -5950,14 +6005,16 @@
             },
             {
               "name": "size",
+              "required": false,
               "value": {
                 "kind": "expression",
-                "type": "BentoDropdownSize | `${BentoDropdownSize}`"
+                "type": "union"
               },
               "default": "null"
             },
             {
               "name": "staticCategories",
+              "required": false,
               "description": "If enabled, dropdown will display non-selectable, static categories",
               "value": {
                 "kind": "expression",
@@ -5967,6 +6024,7 @@
             },
             {
               "name": "tooltipText",
+              "required": false,
               "description": "Adds a info icon next to the label to display the passed tooltip message.",
               "value": {
                 "kind": "expression",
@@ -5976,6 +6034,7 @@
             },
             {
               "name": "value",
+              "required": false,
               "description": "The `input` value.\nProviding an empty string will select no options.\nSet to an empty string `''` if you don't want any of the available options to be selected.",
               "value": {
                 "kind": "expression",
@@ -5985,6 +6044,7 @@
             },
             {
               "name": "virtualScroll",
+              "required": false,
               "description": "Enables virtual scrolling if set to true or by providing an object with itemHeight function.\nThe itemHeight function is used to calculate the height of rendered item given it's index.",
               "value": {
                 "kind": "expression",
@@ -5994,6 +6054,7 @@
             },
             {
               "name": "enableValueLabelPair",
+              "required": false,
               "description": "Enables value/label value handling. When `true`, the component expects and emits value/label\npair objects instead of primitive values.\n\nThis affects both the `value` prop and the `input` event payload.\n\n- **Input (`value` prop):** Expects a `{ value: string | number, label: string }` object (or an array of them for multi-select).\n- **Output (`input` event):** Emits a `{ value: string | number, label: string }` object (or an array of them) upon selection.\n\nThis is particularly useful when a selected item's label is not available in the `items` prop,\nallowing the component to display the correct label for values loaded from external sources.",
               "value": {
                 "kind": "expression",
@@ -7584,6 +7645,16 @@
                 "type": "BentoFilterBarModel"
               },
               "default": "() => []"
+            },
+            {
+              "name": "filterValuesObject",
+              "required": false,
+              "description": "An object of the values for each filter in the filter bar where key is a the field name and the value is the BentoFilterBarValue.",
+              "value": {
+                "kind": "expression",
+                "type": "BentoFilterValueObject"
+              },
+              "default": "undefined"
             }
           ],
           "source": {
@@ -7740,6 +7811,22 @@
             "symbol": "default"
           }
         },
+        {
+          "name": "filter-bar-config-filter-values-example",
+          "description": "",
+          "source": {
+            "module": "./src/components/filter-bar/__tests__/filter-bar-config-filter-values-example.vue",
+            "symbol": "default"
+          }
+        },
+        {
+          "name": "filter-bar-config-filter-values-object-example",
+          "description": "",
+          "source": {
+            "module": "./src/components/filter-bar/__tests__/filter-bar-config-filter-values-object-example.vue",
+            "symbol": "default"
+          }
+        },
         {
           "name": "filter-bar-toast-stub",
           "description": "",
@@ -8071,29 +8158,64 @@
           }
         },
         {
-          "name": "header-with-views",
+          "name": "header-meta",
           "description": "",
           "attributes": [
             {
-              "name": "actions",
+              "name": "description",
               "required": false,
-              "description": "Optional list of actions (buttons) to display in the header.\nThe structure of each action is defined by the `BentoButtonActionsList` type.",
+              "description": "Meta description for the header component",
               "value": {
                 "kind": "expression",
-                "type": "BentoButtonActionsList"
+                "type": "string"
               },
-              "default": "() => []"
+              "default": "null"
             },
             {
-              "name": "description",
+              "name": "lastUpdated",
               "required": false,
-              "description": "Optional secondary description text to display below the title.",
+              "description": "JavaScript \"Date\" object for when the content was last updated",
               "value": {
                 "kind": "expression",
-                "type": "string"
+                "type": "union"
               },
               "default": "null"
             },
+            {
+              "name": "reloadButton",
+              "required": false,
+              "description": "Reload button which shows next to the header's timestamp",
+              "value": {
+                "kind": "expression",
+                "type": "BentoHeaderReloadButton"
+              },
+              "default": "null"
+            }
+          ],
+          "slots": [
+            {
+              "name": "description"
+            }
+          ],
+          "source": {
+            "module": "./src/components/internal/header-meta/header-meta.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": "title",
               "required": true,
@@ -8141,6 +8263,56 @@
                 "kind": "expression",
                 "type": "union"
               }
+            },
+            {
+              "name": "disableCustomization",
+              "required": false,
+              "description": "Boolean indicating whether icon and icon selection is allowed on view creation and edit.",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              },
+              "default": "false"
+            },
+            {
+              "name": "infoIconTooltipText",
+              "required": false,
+              "description": "Text showed in the info-icon tooltip on hover",
+              "value": {
+                "kind": "expression",
+                "type": "string"
+              },
+              "default": "null"
+            },
+            {
+              "name": "description",
+              "required": false,
+              "description": "Meta description for the header component",
+              "value": {
+                "kind": "expression",
+                "type": "string"
+              },
+              "default": "null"
+            },
+            {
+              "name": "lastUpdated",
+              "required": false,
+              "description": "JavaScript \"Date\" object for when the content was last updated",
+              "value": {
+                "kind": "expression",
+                "type": "union"
+              },
+              "default": "null"
+            },
+            {
+              "name": "reloadButton",
+              "required": false,
+              "description": "Reload button which shows next to the header's timestamp",
+              "value": {
+                "kind": "expression",
+                "type": "TSIndexedAccessType"
+              },
+              "default": "null"
             }
           ],
           "events": [
@@ -8184,6 +8356,9 @@
           "slots": [
             {
               "name": "infoIconTooltipContent"
+            },
+            {
+              "name": "description"
             }
           ],
           "source": {
@@ -8264,15 +8439,6 @@
                 "type": "BentoButtonActionsList"
               }
             },
-            {
-              "name": "description",
-              "required": false,
-              "description": "Optional secondary description text to display below the title.",
-              "value": {
-                "kind": "expression",
-                "type": "string"
-              }
-            },
             {
               "name": "title",
               "required": true,
@@ -8317,6 +8483,51 @@
                 "kind": "expression",
                 "type": "union"
               }
+            },
+            {
+              "name": "disableCustomization",
+              "required": false,
+              "description": "Boolean indicating whether icon and icon selection is allowed on view creation and edit.",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              }
+            },
+            {
+              "name": "infoIconTooltipText",
+              "required": false,
+              "description": "Text showed in the info-icon tooltip on hover",
+              "value": {
+                "kind": "expression",
+                "type": "string"
+              }
+            },
+            {
+              "name": "description",
+              "required": false,
+              "description": "Meta description for the header component",
+              "value": {
+                "kind": "expression",
+                "type": "string"
+              }
+            },
+            {
+              "name": "lastUpdated",
+              "required": false,
+              "description": "JavaScript \"Date\" object for when the content was last updated",
+              "value": {
+                "kind": "expression",
+                "type": "union"
+              }
+            },
+            {
+              "name": "reloadButton",
+              "required": false,
+              "description": "Reload button which shows next to the header's timestamp",
+              "value": {
+                "kind": "expression",
+                "type": "TSIndexedAccessType"
+              }
             }
           ],
           "events": [
@@ -8384,6 +8595,15 @@
               },
               "default": "HeaderWithViewsEditFormContextEnum.CREATE"
             },
+            {
+              "name": "disableCustomization",
+              "required": false,
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              },
+              "default": "false"
+            },
             {
               "name": "errors",
               "required": false,
@@ -8561,9 +8781,9 @@
               "description": "Position the popover should take if space is available",
               "value": {
                 "kind": "expression",
-                "type": "BentoPopover.props.position.type"
+                "type": "BentoPopoverProps['position']"
               },
-              "default": "BentoPopover.props.position.default"
+              "default": "'bottom-start'"
             }
           ],
           "slots": [
@@ -8623,7 +8843,7 @@
             {
               "name": "dropdown",
               "required": false,
-              "description": "Dropdown props for the small selectable dropdown menu.\nProperties supported:\n\n - `value`: Selected value of the dropdown\n - `items`: List of available items\n - `aria-label`: Text that labels the dropdown element",
+              "description": "Dropdown props for the small selectable dropdown menu.\nProperties supported:\n\n - `aria-label`: Text that labels the dropdown element\n - `dynamicFiltering`: Enables dynamic filtering\n - `items`: List of available items\n - `readonly`: Sets the dropdown in read-only mode\n - `value`: Selected value of the dropdown",
               "value": {
                 "kind": "expression",
                 "type": "BentoInputDropdownProps"
@@ -8683,7 +8903,7 @@
             {
               "name": "required",
               "required": false,
-              "description": "Highlights the dropdown is required.",
+              "description": "When present, indicates that the user must specify a value for the input before the owning form can be submitted.\nThe `required` attribute is supported by input types like `text`, `search`, and `number`.",
               "value": {
                 "kind": "expression",
                 "type": "boolean"
@@ -8851,6 +9071,16 @@
               },
               "default": "false"
             },
+            {
+              "name": "debounceTime",
+              "required": false,
+              "description": "The debounce time in milliseconds for running validation and emitting the `input` event after the user has stopped typing.\nThis helps to avoid excessive validation checks on every keystroke. Defaults to `500`.",
+              "value": {
+                "kind": "expression",
+                "type": "number"
+              },
+              "default": "DEBOUNCE_DURATION"
+            },
             {
               "name": "disabled",
               "required": false,
@@ -9064,23 +9294,23 @@
               }
             },
             {
-              "name": "selectedCountry",
+              "name": "countries",
               "required": false,
-              "description": "Selected country code",
+              "description": "Array of country codes to show on the dropdown",
               "value": {
                 "kind": "expression",
-                "type": "CountryCode"
-              }
+                "type": "Array"
+              },
+              "default": "() => getSupportedCountries()"
             },
             {
-              "name": "countries",
+              "name": "dropdown",
               "required": false,
-              "description": "Array of country codes to show on the dropdown",
+              "description": "Dropdown props for the small selectable dropdown menu.\nProperties supported:\n\n - `readonly`: Sets the dropdown in read-only mode",
               "value": {
                 "kind": "expression",
-                "type": "Array"
-              },
-              "default": "() => getCountries()"
+                "type": "BentoInputFieldPhoneNumberDropdownProps"
+              }
             },
             {
               "name": "dynamicFiltering",
@@ -9091,6 +9321,15 @@
                 "type": "boolean"
               },
               "default": "true"
+            },
+            {
+              "name": "selectedCountry",
+              "required": false,
+              "description": "Selected country code",
+              "value": {
+                "kind": "expression",
+                "type": "CountryCode"
+              }
             }
           ],
           "events": [
@@ -10644,12 +10883,16 @@
           ],
           "events": [
             {
-              "name": "update:is-open",
-              "description": "Emits 'update:is-open' event when the modal is closed"
+              "name": "before-close",
+              "description": "Handles closing the modal. The behavior changes depending on whether a `before-close` event listener is present.\n\n- **When listening for the `before-close` event:**\n  The `before-close` event is emitted immediately, skipping the animation. This allows for logic to run before the modal closes.\n  The `isOpen` prop must then be set to `false` to trigger the closing animation.\n\n- **When not listening for the `before-close` event:**\n  The closing animation plays, then `update:is-open` is emitted with `false`.\n  This is the default behavior, compatible with `v-model` or `.sync` on the `isOpen` prop."
             },
             {
               "name": "update:active-page",
               "description": "Emits update event when page is changed internally"
+            },
+            {
+              "name": "update:is-open",
+              "description": "Emits 'update:is-open' event when the modal is closed"
             }
           ],
           "slots": [
@@ -10734,7 +10977,8 @@
           "attributes": [
             {
               "name": "actions",
-              "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\".\nBut you may change the color of 1-st action to red with 'critial' key\nNot more than 3 action buttons can be provided\nOr 2 action buttons and 1 Label for them\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',2\n  event: () => { ... },\n  icon: FourPeopleIcon\n}, {\n  title: 'Secondary',\n  event: () => { ... }\n}]\n```",
+              "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\".\nBut you may change the color of 1-st action to red with 'critical' key\nNot more than 3 action buttons can be provided\nOr 2 action buttons and 1 Label for them\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"
@@ -10743,6 +10987,7 @@
             },
             {
               "name": "actionsLabel",
+              "required": false,
               "description": "Text label that is displayed left to the action buttons",
               "value": {
                 "kind": "expression",
@@ -10752,15 +10997,17 @@
             },
             {
               "name": "columnsSize",
+              "required": false,
               "description": "If a column layout is provided, it renders the respective left column width variant. This can be smaller than the second column, the same size as the second column or bigger than the second column.",
               "value": {
                 "kind": "expression",
-                "type": "BentoModalColumnLayoutVariant"
+                "type": "union"
               },
               "default": "BentoModalColumnLayoutVariant.SMALLER"
             },
             {
               "name": "customPadding",
+              "required": false,
               "description": "If provided, manages the padding of the whole modal container",
               "value": {
                 "kind": "expression",
@@ -10770,6 +11017,7 @@
             },
             {
               "name": "destructiveActions",
+              "required": false,
               "description": "If passed - sets first button color to red",
               "value": {
                 "kind": "expression",
@@ -10779,7 +11027,8 @@
             },
             {
               "name": "withColumnLayout",
-              "description": "If provided, renders the modal's content in a two-column layout an wth dividers separating its content",
+              "required": false,
+              "description": "If provided, renders the modal's content in a two-column layout an with dividers separating its content",
               "value": {
                 "kind": "expression",
                 "type": "boolean"
@@ -10788,6 +11037,7 @@
             },
             {
               "name": "pageId",
+              "required": false,
               "description": "Identifier of the page, used with activePage prop to handle modal navigation",
               "value": {
                 "kind": "expression",
@@ -10797,10 +11047,11 @@
             },
             {
               "name": "previousPage",
+              "required": false,
               "description": "ID of the page for the back button to navigate to. Only use it to overwrite the default back behavior\nUsed when the back button should not take the user to the natural previous page\nSet to `null` to hide back button in the page",
               "value": {
                 "kind": "expression",
-                "type": "string"
+                "type": "union"
               },
               "default": "undefined"
             }
@@ -10843,6 +11094,14 @@
             "symbol": "default"
           }
         },
+        {
+          "name": "modal-with-multiple-pages",
+          "description": "",
+          "source": {
+            "module": "./src/components/modal/__tests__/modal-with-multiple-pages.vue",
+            "symbol": "default"
+          }
+        },
         {
           "name": "multiple-radio-group-stub",
           "description": "",
@@ -11123,33 +11382,37 @@
           "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"
+              "default": "undefined"
             },
             {
               "name": "actionsLayout",
+              "required": false,
               "description": "Defines the layout in which the button actions is presented.\nIt can be one of:",
               "value": {
                 "kind": "expression",
-                "type": "BentoButtonActionsLayout | `${BentoButtonActionsLayout}`"
+                "type": "union"
               },
-              "default": "BentoButtonActionsLayout.BUTTONS_END"
+              "default": "'buttons-end'"
             },
             {
               "name": "ariaLabel",
+              "required": false,
               "description": "Defines a string value that provides an accessible name for the popover.",
               "value": {
                 "kind": "expression",
                 "type": "string"
               },
-              "default": "null"
+              "default": "undefined"
             },
             {
               "name": "divider",
+              "required": false,
               "description": "Adds a divider line to the actions section, reduces the top/bottom paddings and removes all padding in the \"default\" slot.",
               "value": {
                 "kind": "expression",
@@ -11159,6 +11422,7 @@
             },
             {
               "name": "disableFocusTrap",
+              "required": false,
               "description": "Supports disabling focus trap functionality to avoid scroll into view behavior when we don't need it.",
               "value": {
                 "kind": "expression",
@@ -11168,6 +11432,7 @@
             },
             {
               "name": "dismissible",
+              "required": false,
               "description": "Adds a \"dismiss\" icon that triggers the \"dismiss\" event. Requires the `title` prop to be set.",
               "value": {
                 "kind": "expression",
@@ -11177,15 +11442,17 @@
             },
             {
               "name": "fallbackPosition",
+              "required": false,
               "description": "Allows to configure to fallback position to the one specified, it could be ['right', 'top', ...].\nUseful when not using auto as starting placement.\nhttps://floating-ui.com/docs/flip#fallbackplacements",
               "value": {
                 "kind": "expression",
-                "type": "Placement[]"
+                "type": "Array"
               },
               "default": "() => ['bottom-start', 'right-start', 'top-start', 'left-start']"
             },
             {
               "name": "fitContent",
+              "required": false,
               "description": "Sets the size of the container to fit its content",
               "value": {
                 "kind": "expression",
@@ -11195,6 +11462,7 @@
             },
             {
               "name": "fixedPositioning",
+              "required": false,
               "description": "Instructs popover to be visible outside of the containing container.\nUseful when component would be used in limited containers like Modal, Side panel, etc.",
               "value": {
                 "kind": "expression",
@@ -11204,6 +11472,7 @@
             },
             {
               "name": "open",
+              "required": false,
               "description": "Toggles the popover open and closed",
               "value": {
                 "kind": "expression",
@@ -11213,6 +11482,7 @@
             },
             {
               "name": "large",
+              "required": false,
               "description": "Displays the popover in a large size.",
               "value": {
                 "kind": "expression",
@@ -11222,23 +11492,26 @@
             },
             {
               "name": "modifiers",
+              "required": false,
               "value": {
                 "kind": "expression",
-                "type": "array"
+                "type": "Array"
               },
-              "default": "null"
+              "default": "undefined"
             },
             {
               "name": "position",
+              "required": false,
               "description": "Popover's position relative to the target element.\nPossible values are:\n'auto',    'auto-start',    'auto-end',\n'top',     'top-start',     'top-end'\n'right',   'right-start',   'right-end'\n'bottom',  'bottom-start',  'bottom-end'\n'left',    'left-start',    'left-end'",
               "value": {
                 "kind": "expression",
-                "type": "BentoPopoverPositions | `${BentoPopoverPositions}`"
+                "type": "union"
               },
-              "default": "BentoPopoverPositions.BOTTOM_START"
+              "default": "'bottom-start'"
             },
             {
               "name": "small",
+              "required": false,
               "description": "Displays the popover in a small size.",
               "value": {
                 "kind": "expression",
@@ -11248,12 +11521,13 @@
             },
             {
               "name": "title",
+              "required": false,
               "description": "Indicates the title you want to give the popover.",
               "value": {
                 "kind": "expression",
                 "type": "string"
               },
-              "default": "null"
+              "default": "undefined"
             },
             {
               "name": "targetElement",
@@ -11261,11 +11535,12 @@
               "description": "Popover's target element.\nThe popover will position itself relatively to target element, in specified position.",
               "value": {
                 "kind": "expression",
-                "type": "PopperContainer.props?.targetElement.type"
+                "type": "union"
               }
             },
             {
               "name": "withoutSpace",
+              "required": false,
               "description": "Displays the popover without padding.",
               "value": {
                 "kind": "expression",
@@ -11275,6 +11550,7 @@
             },
             {
               "name": "overflowVisible",
+              "required": false,
               "description": "Allows content to appear outside of the popover. Used when there are nested popovers.",
               "value": {
                 "kind": "expression",