@adyen/bento-vue2 1.52.0 → 1.53.0

package/dist/web-types.json

@@ -1,7 +1,7 @@
 {
   "framework": "vue",
   "name": "@adyen/bento-vue2",
-  "version": "1.52.0",
+  "version": "1.53.0",
   "contributions": {
     "html": {
       "description-markup": "markdown",
@@ -1912,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"
@@ -1928,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.",
@@ -2710,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": {
@@ -2756,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": [
@@ -2764,6 +2796,9 @@
             }
           ],
           "slots": [
+            {
+              "name": "dashed-underline"
+            },
             {
               "name": "default"
             }
@@ -2875,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": {
@@ -2984,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": {
@@ -3039,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": {
@@ -4774,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",
@@ -6169,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"
@@ -6817,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.",
@@ -6882,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"
@@ -6973,6 +7077,13 @@
                 "type": "BentoDropdownOptionsContainer.props.open"
               }
             },
+            {
+              "name": "componentLoading",
+              "value": {
+                "kind": "expression",
+                "type": "BentoDropdownOptionsContainer.props.componentLoading"
+              }
+            },
             {
               "name": "selectedValue",
               "value": {
@@ -7528,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"
@@ -8250,6 +8361,388 @@
             "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": "open:all-views",
+              "description": "Emitted when the \"all views\" menu is requested to be opened."
+            },
+            {
+              "name": "open:view-menu",
+              "description": "Emitted when a specific view's action menu is requested to be opened."
+            },
+            {
+              "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/header-with-views/components/header-with-views-all-views/header-with-views-all-views.vue",
+            "symbol": "default"
+          }
+        },
+        {
+          "name": "header-with-views-and-toast-stub",
+          "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"
+              }
+            },
+            {
+              "name": "description",
+              "required": false,
+              "description": "Optional secondary description text to display below the title.",
+              "value": {
+                "kind": "expression",
+                "type": "string"
+              }
+            },
+            {
+              "name": "title",
+              "required": true,
+              "description": "Main title text for the header. This prop is required.",
+              "value": {
+                "kind": "expression",
+                "type": "string"
+              }
+            },
+            {
+              "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"
+              }
+            },
+            {
+              "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": "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."
+            }
+          ],
+          "source": {
+            "module": "./src/components/header-with-views/__tests__/header-with-views-and-toast-stub.vue",
+            "symbol": "default"
+          }
+        },
+        {
+          "name": "header-with-views-edit-form",
+          "description": "",
+          "attributes": [
+            {
+              "name": "additionalFormItem",
+              "required": false,
+              "value": {
+                "kind": "expression",
+                "type": "BentoHeaderWithViewsItemAdditionalConfig"
+              },
+              "default": "null"
+            },
+            {
+              "name": "context",
+              "required": false,
+              "value": {
+                "kind": "expression",
+                "type": "HeaderWithViewsEditFormContext"
+              },
+              "default": "HeaderWithViewsEditFormContextEnum.CREATE"
+            },
+            {
+              "name": "errors",
+              "required": false,
+              "value": {
+                "kind": "expression",
+                "type": "BentoHeaderWithViewsItemErrors"
+              },
+              "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": "''"
+            }
+          ],
+          "events": [
+            {
+              "name": "cancel",
+              "description": "Emitted when form is canceled."
+            },
+            {
+              "name": "update",
+              "description": "Emitted when the item is updated.\nTypically used to sync changes to the parent component."
+            },
+            {
+              "name": "delete",
+              "description": "Emitted when the item is requested to be deleted."
+            },
+            {
+              "name": "input:label",
+              "description": "Emitted when the label of the item is modified via input."
+            },
+            {
+              "name": "blur:label",
+              "description": "Emitted when the label input loses focus (blur event)."
+            },
+            {
+              "name": "keydown:enter",
+              "description": "Emitted when the Enter key is pressed while interacting with the item."
+            }
+          ],
+          "source": {
+            "module": "./src/components/header-with-views/components/header-with-views-item-edit-form/header-with-views-edit-form.vue",
+            "symbol": "default"
+          }
+        },
         {
           "name": "hot-swap-link-stub",
           "description": "",
@@ -8624,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,
@@ -12947,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"
             },

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@adyen/bento-vue2",
-  "version": "1.52.0",
+  "version": "1.53.0",
   "description": "Adyen Bento Vue2 components",
   "main": "dist/index.js",
   "module": "dist/index.js",
@@ -15,7 +15,8 @@
       "default": "./dist/index.js"
     },
     "./fonts.css": "./dist/fonts/fonts.css",
-    "./styles/*": "./dist/styles/*.css"
+    "./styles/*": "./dist/styles/*.css",
+    "./use-form-v4": "./dist/use-form-v4.js"
   },
   "sideEffects": [
     "**/*.css"
@@ -36,13 +37,13 @@
     "libphonenumber-js": "1.11.7",
     "mime": "4.0.6",
     "uuid": "11.0.5",
-    "@adyen/bento-design-tokens": "1.52.0",
+    "@adyen/bento-design-tokens": "1.53.0",
     "@adyen/ui-assets-icons-16": "6.1.0"
   },
   "peerDependencies": {
     "vue": "~2.7",
     "vue-i18n": "8.26.7",
-    "zod": "^3.22"
+    "zod": "^3.25"
   },
   "overrides": {
     "@codemirror/state": "catalog:",
@@ -113,7 +114,7 @@
     "vue-tsc": "1.0.24",
     "@adyen/bento-cli": "0.2.4",
     "@adyen/bento-core": "0.0.1",
-    "@adyen/bento-tailwind": "0.3.3",
+    "@adyen/bento-tailwind": "0.3.4",
     "@adyen/ui-assets-payment-method-icons": "8.2.0"
   },
   "optionalDependencies": {