@adyen/bento-vue2 1.40.0 → 1.42.0

package/dist/@types/index.d.ts

@@ -45,8 +45,22 @@ declare type __VLS_NonUndefinedable_16<T> = T extends undefined ? never : T;
 
 declare type __VLS_NonUndefinedable_17<T> = T extends undefined ? never : T;
 
+declare type __VLS_NonUndefinedable_18<T> = T extends undefined ? never : T;
+
+declare type __VLS_NonUndefinedable_19<T> = T extends undefined ? never : T;
+
 declare type __VLS_NonUndefinedable_2<T> = T extends undefined ? never : T;
 
+declare type __VLS_NonUndefinedable_20<T> = T extends undefined ? never : T;
+
+declare type __VLS_NonUndefinedable_21<T> = T extends undefined ? never : T;
+
+declare type __VLS_NonUndefinedable_22<T> = T extends undefined ? never : T;
+
+declare type __VLS_NonUndefinedable_23<T> = T extends undefined ? never : T;
+
+declare type __VLS_NonUndefinedable_24<T> = T extends undefined ? never : T;
+
 declare type __VLS_NonUndefinedable_3<T> = T extends undefined ? never : T;
 
 declare type __VLS_NonUndefinedable_4<T> = T extends undefined ? never : T;
@@ -160,6 +174,28 @@ declare type __VLS_TypePropsToRuntimeProps_17<T> = {
           };
 };
 
+declare type __VLS_TypePropsToRuntimeProps_18<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K>
+        ? {
+              type: PropType<__VLS_NonUndefinedable_18<T[K]>>;
+          }
+        : {
+              type: PropType<T[K]>;
+              required: true;
+          };
+};
+
+declare type __VLS_TypePropsToRuntimeProps_19<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K>
+        ? {
+              type: PropType<__VLS_NonUndefinedable_19<T[K]>>;
+          }
+        : {
+              type: PropType<T[K]>;
+              required: true;
+          };
+};
+
 declare type __VLS_TypePropsToRuntimeProps_2<T> = {
     [K in keyof T]-?: {} extends Pick<T, K>
         ? {
@@ -171,6 +207,61 @@ declare type __VLS_TypePropsToRuntimeProps_2<T> = {
           };
 };
 
+declare type __VLS_TypePropsToRuntimeProps_20<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K>
+        ? {
+              type: PropType<__VLS_NonUndefinedable_20<T[K]>>;
+          }
+        : {
+              type: PropType<T[K]>;
+              required: true;
+          };
+};
+
+declare type __VLS_TypePropsToRuntimeProps_21<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K>
+        ? {
+              type: PropType<__VLS_NonUndefinedable_21<T[K]>>;
+          }
+        : {
+              type: PropType<T[K]>;
+              required: true;
+          };
+};
+
+declare type __VLS_TypePropsToRuntimeProps_22<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K>
+        ? {
+              type: PropType<__VLS_NonUndefinedable_22<T[K]>>;
+          }
+        : {
+              type: PropType<T[K]>;
+              required: true;
+          };
+};
+
+declare type __VLS_TypePropsToRuntimeProps_23<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K>
+        ? {
+              type: PropType<__VLS_NonUndefinedable_23<T[K]>>;
+          }
+        : {
+              type: PropType<T[K]>;
+              required: true;
+          };
+};
+
+declare type __VLS_TypePropsToRuntimeProps_24<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K>
+        ? {
+              type: PropType<__VLS_NonUndefinedable_24<T[K]>>;
+          }
+        : {
+              type: PropType<T[K]>;
+              required: true;
+          };
+};
+
 declare type __VLS_TypePropsToRuntimeProps_3<T> = {
     [K in keyof T]-?: {} extends Pick<T, K>
         ? {
@@ -296,6 +387,46 @@ declare type __VLS_WithDefaults_14<P, D> = {
         : P[K];
 };
 
+declare type __VLS_WithDefaults_15<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D
+        ? P[K] & {
+              default: D[K];
+          }
+        : P[K];
+};
+
+declare type __VLS_WithDefaults_16<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D
+        ? P[K] & {
+              default: D[K];
+          }
+        : P[K];
+};
+
+declare type __VLS_WithDefaults_17<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D
+        ? P[K] & {
+              default: D[K];
+          }
+        : P[K];
+};
+
+declare type __VLS_WithDefaults_18<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D
+        ? P[K] & {
+              default: D[K];
+          }
+        : P[K];
+};
+
+declare type __VLS_WithDefaults_19<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D
+        ? P[K] & {
+              default: D[K];
+          }
+        : P[K];
+};
+
 declare type __VLS_WithDefaults_2<P, D> = {
     [K in keyof Pick<P, keyof P>]: K extends keyof D
         ? P[K] & {
@@ -304,6 +435,22 @@ declare type __VLS_WithDefaults_2<P, D> = {
         : P[K];
 };
 
+declare type __VLS_WithDefaults_20<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D
+        ? P[K] & {
+              default: D[K];
+          }
+        : P[K];
+};
+
+declare type __VLS_WithDefaults_21<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D
+        ? P[K] & {
+              default: D[K];
+          }
+        : P[K];
+};
+
 declare type __VLS_WithDefaults_3<P, D> = {
     [K in keyof Pick<P, keyof P>]: K extends keyof D
         ? P[K] & {
@@ -564,6 +711,24 @@ declare type __VLS_WithTemplateSlots_4<T, S> = T & {
     };
 };
 
+declare type __VLS_WithTemplateSlots_40<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+
+declare type __VLS_WithTemplateSlots_41<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+
+declare type __VLS_WithTemplateSlots_42<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+
 declare type __VLS_WithTemplateSlots_5<T, S> = T & {
     new (): {
         $slots: S;
@@ -3283,43 +3448,29 @@ export declare enum BentoCountryVariant {
  * A Currency component is used to display a formatted currency value.
  *
  * @example
- * import { BentoCurrency } from '@adyen/adl-vue-components';
- * import { BentoCurrency, BentoCurrencyCode } from '@adyen/bento-vue2';
+ * import { BentoCurrency, BentoCurrencyISOCode } from '@adyen/bento-vue2';
  *
  * export default {
  *     components: { BentoCurrency },
  *     template: `
- *          <bento-currency :currency="CurrencyCode.USD">
- *              76.33
- *          </bento-currency>
+ *          <bento-currency
+ *              :currency="BentoCurrencyISOCode.USD"
+ *              :value="76.33"
+ *          />
  *     `
  * }
  */
 export declare const BentoCurrency: DefineComponent<
-    {
-        currency: {
-            type: PropType<BentoCurrencyISOCode | `${BentoCurrencyISOCode}`>;
-            default: BentoCurrencyISOCode;
-            validator: (value: BentoCurrencyISOCode) => boolean;
-        };
-        /**
-         * Accepts currency value in major units instead of minor ones
-         */
-        majorUnits: {
-            type: BooleanConstructor;
-            default: boolean;
-        };
-        /**
-         * Disable the default typography for the component. Only use this when the component is inside another typography component.
-         */
-        disableTypography: {
-            type: BooleanConstructor;
-            default: boolean;
-        };
-    },
-    {
-        formattedCurrency: ComputedRef<string>;
-    },
+    __VLS_WithDefaults_7<
+        __VLS_TypePropsToRuntimeProps_7<BentoCurrencyProps>,
+        {
+            currency: BentoCurrencyISOCode;
+            disableTypography: boolean;
+            majorUnits: boolean;
+            value: any;
+        }
+    >,
+    {},
     {},
     {},
     {},
@@ -3328,200 +3479,22 @@ export declare const BentoCurrency: DefineComponent<
     {},
     string,
     Readonly<
-        ExtractPropTypes<{
-            currency: {
-                type: PropType<BentoCurrencyISOCode | `${BentoCurrencyISOCode}`>;
-                default: BentoCurrencyISOCode;
-                validator: (value: BentoCurrencyISOCode) => boolean;
-            };
-            /**
-             * Accepts currency value in major units instead of minor ones
-             */
-            majorUnits: {
-                type: BooleanConstructor;
-                default: boolean;
-            };
-            /**
-             * Disable the default typography for the component. Only use this when the component is inside another typography component.
-             */
-            disableTypography: {
-                type: BooleanConstructor;
-                default: boolean;
-            };
-        }>
+        ExtractPropTypes<
+            __VLS_WithDefaults_7<
+                __VLS_TypePropsToRuntimeProps_7<BentoCurrencyProps>,
+                {
+                    currency: BentoCurrencyISOCode;
+                    disableTypography: boolean;
+                    majorUnits: boolean;
+                    value: any;
+                }
+            >
+        >
     >,
     {
+        value: number;
         disableTypography: boolean;
-        currency:
-            | 'TOP'
-            | 'CVE'
-            | 'DJF'
-            | 'GNF'
-            | 'IDR'
-            | 'JPY'
-            | 'KMF'
-            | 'KRW'
-            | 'PYG'
-            | 'RWF'
-            | 'UGX'
-            | 'VND'
-            | 'VUV'
-            | 'XAF'
-            | 'XOF'
-            | 'XPF'
-            | 'MRO'
-            | 'BHD'
-            | 'IQD'
-            | 'JOD'
-            | 'KWD'
-            | 'LYD'
-            | 'OMR'
-            | 'TND'
-            | 'AFA'
-            | 'ALL'
-            | 'DZD'
-            | 'AOA'
-            | 'ARS'
-            | 'AMD'
-            | 'AWG'
-            | 'AUD'
-            | 'AZN'
-            | 'BSD'
-            | 'BDT'
-            | 'BBD'
-            | 'BYR'
-            | 'BEF'
-            | 'BZD'
-            | 'BMD'
-            | 'BTN'
-            | 'BTC'
-            | 'BOB'
-            | 'BAM'
-            | 'BWP'
-            | 'BRL'
-            | 'GBP'
-            | 'BND'
-            | 'BGN'
-            | 'BIF'
-            | 'KHR'
-            | 'CAD'
-            | 'KYD'
-            | 'CLP'
-            | 'CLF'
-            | 'CNY'
-            | 'COP'
-            | 'CDF'
-            | 'CRC'
-            | 'HRK'
-            | 'CUC'
-            | 'CZK'
-            | 'DKK'
-            | 'DOP'
-            | 'XCD'
-            | 'EGP'
-            | 'ERN'
-            | 'EEK'
-            | 'ETB'
-            | 'EUR'
-            | 'FKP'
-            | 'FJD'
-            | 'GMD'
-            | 'GEL'
-            | 'DEM'
-            | 'GHS'
-            | 'GIP'
-            | 'GRD'
-            | 'GTQ'
-            | 'GYD'
-            | 'HTG'
-            | 'HNL'
-            | 'HKD'
-            | 'HUF'
-            | 'ISK'
-            | 'INR'
-            | 'IRR'
-            | 'ILS'
-            | 'ITL'
-            | 'JMD'
-            | 'KZT'
-            | 'KES'
-            | 'KGS'
-            | 'LAK'
-            | 'LVL'
-            | 'LBP'
-            | 'LSL'
-            | 'LRD'
-            | 'LTC'
-            | 'LTL'
-            | 'MOP'
-            | 'MKD'
-            | 'MGA'
-            | 'MWK'
-            | 'MYR'
-            | 'MVR'
-            | 'MUR'
-            | 'MXN'
-            | 'MDL'
-            | 'MNT'
-            | 'MAD'
-            | 'MZM'
-            | 'MMK'
-            | 'NAD'
-            | 'NPR'
-            | 'ANG'
-            | 'TWD'
-            | 'NZD'
-            | 'NIO'
-            | 'NGN'
-            | 'KPW'
-            | 'NOK'
-            | 'PKR'
-            | 'PAB'
-            | 'PGK'
-            | 'PEN'
-            | 'PHP'
-            | 'PLN'
-            | 'QAR'
-            | 'RON'
-            | 'RUB'
-            | 'SVC'
-            | 'WST'
-            | 'STD'
-            | 'SAR'
-            | 'RSD'
-            | 'SCR'
-            | 'SLL'
-            | 'SGD'
-            | 'SKK'
-            | 'SBD'
-            | 'SOS'
-            | 'ZAR'
-            | 'SSP'
-            | 'XDR'
-            | 'LKR'
-            | 'SHP'
-            | 'SDG'
-            | 'SRD'
-            | 'SZL'
-            | 'SEK'
-            | 'CHF'
-            | 'SYP'
-            | 'TJS'
-            | 'TZS'
-            | 'THB'
-            | 'TTD'
-            | 'TRY'
-            | 'TMT'
-            | 'UAH'
-            | 'AED'
-            | 'UYU'
-            | 'USD'
-            | 'UZS'
-            | 'VEF'
-            | 'YER'
-            | 'ZMK'
-            | 'ZWL'
-            | BentoCurrencyISOCode;
+        currency: BentoCurrencyISOCode | `${BentoCurrencyISOCode}`;
         majorUnits: boolean;
     }
 >;
@@ -3703,6 +3676,25 @@ export declare type BentoCurrencyListboxOptionItem = OmitStrict<BentoListboxOpti
 
 export declare type BentoCurrencyListboxOptions = BentoCurrencyListboxOptionItem[];
 
+export declare interface BentoCurrencyProps {
+    /**
+     * Currency code based on the ISO 4217 standard
+     */
+    currency?: BentoCurrencyISOCode | `${BentoCurrencyISOCode}`;
+    /**
+     * Disable the default typography for the component. Only use this when the component is inside another typography component.
+     */
+    disableTypography?: boolean;
+    /**
+     * Accepts currency value in major units instead of minor ones
+     */
+    majorUnits?: boolean;
+    /**
+     * Currency value to be formatted
+     */
+    value?: number;
+}
+
 /**
  * Dashboard section is subcomponent of Dashboard template meant to be used to create the different sections within the page.
  *
@@ -3729,10 +3721,10 @@ export declare type BentoCurrencyListboxOptions = BentoCurrencyListboxOptionItem
  *     `
  * }
  */
-export declare const BentoDashboardSection: __VLS_WithTemplateSlots_38<
+export declare const BentoDashboardSection: __VLS_WithTemplateSlots_41<
     DefineComponent<
-        __VLS_WithDefaults_14<
-            __VLS_TypePropsToRuntimeProps_17<{
+        __VLS_WithDefaults_21<
+            __VLS_TypePropsToRuntimeProps_24<{
                 /**
                  * The header of the section
                  */
@@ -3756,8 +3748,8 @@ export declare const BentoDashboardSection: __VLS_WithTemplateSlots_38<
         string,
         Readonly<
             ExtractPropTypes<
-                __VLS_WithDefaults_14<
-                    __VLS_TypePropsToRuntimeProps_17<{
+                __VLS_WithDefaults_21<
+                    __VLS_TypePropsToRuntimeProps_24<{
                         /**
                          * The header of the section
                          */
@@ -3813,10 +3805,10 @@ export declare const BentoDashboardSection: __VLS_WithTemplateSlots_38<
  *     `
  * }
  */
-export declare const BentoDashboardTemplate: __VLS_WithTemplateSlots_37<
+export declare const BentoDashboardTemplate: __VLS_WithTemplateSlots_40<
     DefineComponent<
-        __VLS_WithDefaults_13<
-            __VLS_TypePropsToRuntimeProps_16<{
+        __VLS_WithDefaults_20<
+            __VLS_TypePropsToRuntimeProps_23<{
                 /**
                  * The header that goes to the top of the template
                  */
@@ -3852,8 +3844,8 @@ export declare const BentoDashboardTemplate: __VLS_WithTemplateSlots_37<
         string,
         Readonly<
             ExtractPropTypes<
-                __VLS_WithDefaults_13<
-                    __VLS_TypePropsToRuntimeProps_16<{
+                __VLS_WithDefaults_20<
+                    __VLS_TypePropsToRuntimeProps_23<{
                         /**
                          * The header that goes to the top of the template
                          */
@@ -4200,6 +4192,13 @@ export declare const BentoDataGrid: __VLS_WithTemplateSlots_8<
                 type: BooleanConstructor;
                 default: boolean;
             };
+            /**
+             * Sticks the horizontal scrollbar to the bottom of the screen if the data-grid is larger than the screen height.
+             */
+            stickyHorizontalScrollbar: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
             /**
              * Make pagination stick to the bottom of the page when the data-grid is bigger than the screen.
              * Because styles have to be applied to pagination container element, this has to be a data-grid prop (rather than a pagination prop).
@@ -4448,6 +4447,13 @@ export declare const BentoDataGrid: __VLS_WithTemplateSlots_8<
                     type: BooleanConstructor;
                     default: boolean;
                 };
+                /**
+                 * Sticks the horizontal scrollbar to the bottom of the screen if the data-grid is larger than the screen height.
+                 */
+                stickyHorizontalScrollbar: {
+                    type: BooleanConstructor;
+                    default: boolean;
+                };
                 /**
                  * Make pagination stick to the bottom of the page when the data-grid is bigger than the screen.
                  * Because styles have to be applied to pagination container element, this has to be a data-grid prop (rather than a pagination prop).
@@ -4535,6 +4541,7 @@ export declare const BentoDataGrid: __VLS_WithTemplateSlots_8<
             columnPanel: boolean;
             filterSearchTerm: string;
             noSpacingTop: boolean;
+            stickyHorizontalScrollbar: boolean;
             stickyPagination: boolean;
             stickyFilters: boolean;
             selection: BentoDatagridDataItemId[];
@@ -4718,7 +4725,7 @@ export declare enum BentoDatagridStyleState {
  *     `
  * }
  */
-export declare const BentoDataGridTemplate: __VLS_WithTemplateSlots_39<
+export declare const BentoDataGridTemplate: __VLS_WithTemplateSlots_42<
     DefineComponent<
         {
             /**
@@ -7916,6 +7923,153 @@ export declare enum BentoEmptyStateVariant {
     CONDENSED = 'condensed',
 }
 
+/**
+ * The file uploader component enables users to upload one or multiple files from their device to our system.
+ *
+ * @example
+ * import { BentoFileUploader, type BentoFileValue } from '@adyen/bento-vue2';
+ *
+ * export default {
+ *     components: { BentoFileUploader },
+ *     template: `
+ *          <bento-file-uploader
+ *              accept="image/*,video/*,.pdf,.png"
+ *              condensed
+ *              description="Custom supporting text"
+ *              disabled
+ *              errorMessage="Custom error message"
+ *              label="Bento file uploader"
+ *              :maxCount="1"
+ *              :maxDimensions="{ width: 200, height: 100 }"
+ *              :maxSize="1000"
+ *              v-model="files"
+ *              multiple
+ *              :optional="false"
+ *              required
+ *              tooltipText="Useful information"
+ *          />
+ *     `,
+ *      setup() {
+ *          const files = ref<BentoFileValue>()
+ *      }
+ * }
+ */
+export declare const BentoFileUploader: DefineComponent<
+    __VLS_WithDefaults_8<
+        __VLS_TypePropsToRuntimeProps_8<BentoFileUploaderProps>,
+        {
+            accept: any;
+            description: any;
+            errorMessage: any;
+            maxCount: number;
+            maxDimensions: any;
+            maxSize: any;
+            modelValue: any;
+            tooltipText: any;
+        }
+    >,
+    {},
+    {},
+    {},
+    {},
+    ComponentOptionsMixin,
+    ComponentOptionsMixin,
+    {
+        change: (value?: FileList) => void;
+    } & {
+        'update:modelValue': (value?: FileList) => void;
+    },
+    string,
+    Readonly<
+        ExtractPropTypes<
+            __VLS_WithDefaults_8<
+                __VLS_TypePropsToRuntimeProps_8<BentoFileUploaderProps>,
+                {
+                    accept: any;
+                    description: any;
+                    errorMessage: any;
+                    maxCount: number;
+                    maxDimensions: any;
+                    maxSize: any;
+                    modelValue: any;
+                    tooltipText: any;
+                }
+            >
+        >
+    >,
+    {
+        description: string;
+        tooltipText: string;
+        errorMessage: string;
+        modelValue: BentoFileUploaderValue;
+        accept: HTMLInputElement['accept'];
+        maxCount: number;
+        maxDimensions: any;
+        maxSize: number;
+    }
+>;
+
+export declare interface BentoFileUploaderProps {
+    /**
+     * A string that defines the file types the file input should accept.
+     * https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#accept
+     */
+    accept?: HTMLInputElement['accept'];
+    /**
+     * Reduces the size of the uploader area.
+     */
+    condensed?: boolean;
+    /**
+     * Descriptive supporting text visbile underneath the label.
+     */
+    description?: string;
+    /**
+     * Disable the radio button (optional).
+     */
+    disabled?: boolean;
+    /**
+     * Renders file-uploader with an error state and the error message beneath the input box
+     */
+    errorMessage?: string;
+    /**
+     * The label of the component.
+     */
+    label: string;
+    /**
+     * Sets a maximum file count. Allows for uploading multiple files.
+     */
+    maxCount?: number;
+    /**
+     * Sets a maximum image size (for image file types only).
+     */
+    maxDimensions?: {
+        width?: number;
+        height?: number;
+    };
+    /**
+     * Sets a maximum file size in Bytes
+     */
+    maxSize?: number;
+    /**
+     * Used to support `v-model`. Doesn't actually set the value of the file uploader.
+     */
+    modelValue?: BentoFileUploaderValue;
+    /**
+     * Sets the field as optional.
+     */
+    optional?: boolean;
+    /**
+     * Sets the field as required.
+     */
+    required?: boolean;
+    /**
+     * Adds a info icon next to the label to display the passed tooltip message.
+     */
+    tooltipText?: string;
+}
+
+export declare type BentoFileUploaderValue = string | Array<string> | File | Array<File>;
+
 /**
  * The filter bar filters item lists and tables according to various filter criteria.
  *
@@ -8167,6 +8321,7 @@ export declare interface BentoFilterModel extends BentoFilterValue {
     description?: string;
     type: BentoFilterItemType;
     options?: BentoFilterOptions;
+    disabled?: boolean;
     defaultValue?: BentoFilterBarValue;
     visible?: boolean;
     /**
@@ -8751,45 +8906,34 @@ declare enum BentoHeaderVariant {
     COMPONENT = 'component',
 }
 
+/**
+ * Image component used for resizing images to certain aspect ratios and fit strategies.
+ *
+ * @example
+ * import { BentoImage } from '@adyen/bento-vue2';
+ *
+ * export default {
+ *     components: { BentoImage },
+ *     template: `
+ *       <bento-image
+ *           :src="imageSrc"
+ *           alt="alternative text"
+ *           aspect-ratio="landscape"
+ *           object-fit="cover"
+ *
+ *       />
+ *     `
+ * }
+ */
 export declare const BentoImage: DefineComponent<
-    {
-        /**
-         * Url to image, same as src attribute of `<img>` tag
-         */
-        src: {
-            type: StringConstructor;
-            required: true;
-        };
-        /**
-         * Accessible text describing the image, same as alt attribute of `<img>` tag
-         */
-        alt: {
-            type: StringConstructor;
-            required: true;
-        };
-        /**
-         * Aspect ratio of the image, maps to css aspect-ratio
-         */
-        aspectRatio: {
-            type: PropType<BentoImageAspectRatio | `${BentoImageAspectRatio}`>;
-            default: any;
-            validator: (value: BentoImageAspectRatio) => boolean;
-        };
-        /**
-         * Object fitting strategy, maps to css object-fit
-         */
-        objectFit: {
-            type: PropType<BentoImageObjectFit | `${BentoImageObjectFit}`>;
-            default: any;
-            validator: (value: BentoImageObjectFit) => boolean;
-        };
-    },
-    {
-        imageStyles: ComputedRef<{
-            aspectRatio: string;
-            objectFit: 'fill' | 'contain' | 'cover' | BentoImageObjectFit;
-        }>;
-    },
+    __VLS_WithDefaults_9<
+        __VLS_TypePropsToRuntimeProps_9<BentoImageProps>,
+        {
+            aspectRatio: any;
+            objectFit: any;
+        }
+    >,
+    {},
     {},
     {},
     {},
@@ -8798,55 +8942,19 @@ export declare const BentoImage: DefineComponent<
     {},
     string,
     Readonly<
-        ExtractPropTypes<{
-            /**
-             * Url to image, same as src attribute of `<img>` tag
-             */
-            src: {
-                type: StringConstructor;
-                required: true;
-            };
-            /**
-             * Accessible text describing the image, same as alt attribute of `<img>` tag
-             */
-            alt: {
-                type: StringConstructor;
-                required: true;
-            };
-            /**
-             * Aspect ratio of the image, maps to css aspect-ratio
-             */
-            aspectRatio: {
-                type: PropType<BentoImageAspectRatio | `${BentoImageAspectRatio}`>;
-                default: any;
-                validator: (value: BentoImageAspectRatio) => boolean;
-            };
-            /**
-             * Object fitting strategy, maps to css object-fit
-             */
-            objectFit: {
-                type: PropType<BentoImageObjectFit | `${BentoImageObjectFit}`>;
-                default: any;
-                validator: (value: BentoImageObjectFit) => boolean;
-            };
-        }>
+        ExtractPropTypes<
+            __VLS_WithDefaults_9<
+                __VLS_TypePropsToRuntimeProps_9<BentoImageProps>,
+                {
+                    aspectRatio: any;
+                    objectFit: any;
+                }
+            >
+        >
     >,
     {
-        aspectRatio:
-            | 'square'
-            | 'landscape'
-            | '4:3'
-            | '3:3'
-            | '16:9'
-            | '2:1'
-            | 'portrait'
-            | '3:4'
-            | '2:3'
-            | '9:16'
-            | '1:2'
-            | '1:1'
-            | BentoImageAspectRatio;
-        objectFit: 'fill' | 'contain' | 'cover' | BentoImageObjectFit;
+        aspectRatio: BentoImageAspectRatio | `${BentoImageAspectRatio}` | null;
+        objectFit: BentoImageObjectFit | `${BentoImageObjectFit}` | null;
     }
 >;
 
@@ -8871,6 +8979,20 @@ export declare enum BentoImageObjectFit {
     CONTAIN = 'contain',
 }
 
+export declare interface BentoImageProps {
+    /** Url to image, same as src attribute of `<img>` tag */
+    src: string;
+
+    /** Accessible text describing the image, same as alt attribute of `<img>` tag */
+    alt: string;
+
+    /** Aspect ratio of the image, maps to css aspect-ratio */
+    aspectRatio?: BentoImageAspectRatio | `${BentoImageAspectRatio}` | null;
+
+    /** Object fitting strategy, maps to css object-fit */
+    objectFit?: BentoImageObjectFit | `${BentoImageObjectFit}` | null;
+}
+
 /**
  * @example
  * import { BentoInfoIcon } from '@adyen/adl-vue-components';
@@ -9143,6 +9265,8 @@ export declare const BentoInputField: __VLS_WithTemplateSlots_17<
             focus: () => void;
         } & {
             keydown: (event: KeyboardEvent) => void;
+        } & {
+            keyup: (event: KeyboardEvent) => void;
         } & {
             input: (inputValue: string) => void;
         },
@@ -9327,30 +9451,197 @@ export declare const BentoInputField: __VLS_WithTemplateSlots_17<
     }
 >;
 
-/**
- * @deprecated for usage with properties since version 2.0. Use the string literal instead.
- */
-export declare enum BentoInputFieldElementPosition {
-    START = 'start',
-    END = 'end',
+/**
+ * @deprecated for usage with properties since version 2.0. Use the string literal instead.
+ */
+export declare enum BentoInputFieldElementPosition {
+    START = 'start',
+    END = 'end',
+}
+
+/**
+ * @deprecated The use of these enums is no longer supported.
+ * Use `v-on:` or `@` to listen to the events being emitted.
+ * This enum will be removed in 2.0.
+ */
+export declare enum BentoInputFieldEvent {
+    INPUT = 'input',
+    ESCAPE_PRESSED = 'escape-pressed',
+    UPDATE_DROPDOWN = 'update:dropdown',
+    DROPDOWN_INPUT = 'dropdown-input',
+    FOCUS = 'focus',
+    CHANGE = 'change',
+    BLUR = 'blur',
+    KEYDOWN = 'keydown',
+}
+
+/**
+ * The input field password is a component designed to support users' preference for entering values securely.
+ * This is an extension of the `bento-input-field` component.
+ *
+ * @example
+ * import { BentoInputFieldPassword } from '@adyen/bento-vue2';
+ *
+ * export default {
+ *     components: { BentoInputFieldPassword },
+ *     template: `
+ *          <bento-input-field-password
+ *              label="Label"
+ *              error-message="Error"
+ *              :validation="{
+ *                  title: 'Password must contain at least:',
+ *                  suggestion: 'Avoid using currency symbols or accented letters.',
+ *                  list: [
+ *                      { label: '8 characters', validate: minLength, additionalArgs: [8] },
+ *                      { label: '1 lowercase (a-z)', validate: requireLowercase },
+ *                      { label: '1 uppercase (A-Z)', validate: requireUppercase },
+ *                      { label: '1 numerical (0-9)', validate: requireNumeric },
+ *                      { label: '1 special character', validate: requireSpecialCharacter },
+ *                      {
+ *                          label: 'Always true',
+ *                          validate: () => {
+ *                              const example = 'Example';
+ *
+ *                              return () => example.length > 1;
+ *                          },
+ *                      },
+ *                  ],
+ *              }"
+ *          />
+ *     `
+ * }
+ */
+export declare const BentoInputFieldPassword: DefineComponent<
+    __VLS_WithDefaults_10<
+        __VLS_TypePropsToRuntimeProps_10<BentoInputFieldPasswordProps>,
+        {
+            condensed: boolean;
+            disabled: boolean;
+            label: any;
+            errorMessage: any;
+            placeholder: string;
+            readonly: boolean;
+            validation: any;
+            value: any;
+            withHint: boolean;
+        }
+    >,
+    {},
+    {},
+    {},
+    {},
+    ComponentOptionsMixin,
+    ComponentOptionsMixin,
+    {
+        'input:valid': () => void;
+    } & {
+        input: (value: BentoInputFieldValue) => void;
+    },
+    string,
+    Readonly<
+        ExtractPropTypes<
+            __VLS_WithDefaults_10<
+                __VLS_TypePropsToRuntimeProps_10<BentoInputFieldPasswordProps>,
+                {
+                    condensed: boolean;
+                    disabled: boolean;
+                    label: any;
+                    errorMessage: any;
+                    placeholder: string;
+                    readonly: boolean;
+                    validation: any;
+                    value: any;
+                    withHint: boolean;
+                }
+            >
+        >
+    >,
+    {
+        value: BentoInputFieldProps['value'];
+        label: string;
+        condensed: BentoInputFieldProps['condensed'];
+        disabled: BentoInputFieldProps['disabled'];
+        validation: BentoInputFieldPasswordValidation;
+        errorMessage: BentoInputFieldProps['errorMessage'];
+        readonly: BentoInputFieldProps['readonly'];
+        placeholder: BentoInputFieldProps['placeholder'];
+        withHint: boolean;
+    }
+>;
+
+export declare interface BentoInputFieldPasswordProps {
+    /**
+     * Reduces height of the input
+     */
+    condensed?: BentoInputFieldProps['condensed'];
+    /**
+     * Disables the possibility of changing value in the input-field
+     */
+    disabled?: BentoInputFieldProps['disabled'];
+    /**
+     * Renders input-field with an error state and the error message beneath the input box
+     */
+    errorMessage?: BentoInputFieldProps['errorMessage'];
+    /**
+     * Text displayed as the placeholder of the input-field
+     */
+    placeholder?: BentoInputFieldProps['placeholder'];
+    /**
+     * Setting this property to true will set the input field to read only state.
+     */
+    readonly?: BentoInputFieldProps['readonly'];
+    /**
+     * Text displayed as the value of the input-field
+     */
+    value?: BentoInputFieldProps['value'];
+    /**
+     * Label to be shown with the input field
+     */
+    label?: string;
+    /**
+     * Configuration object for password field validation.
+     *
+     * This object defines the validation criteria and associated messages for a password field.
+     * It includes the following properties:
+     *
+     * - `title`: The title displayed at the top of the validation hint.
+     * - `suggestion`: The message displayed at the bottom of the validation hint, providing additional guidance.
+     * - `list`: An array of callback functions to be executed on the value after each user input, validating the password against the specified rules.
+     *
+     * By default, the validation checks that:
+     *
+     * - The value has a minimum length of 8 characters.
+     * - The value contains at least one lowercase letter.
+     * - The value contains at least one uppercase letter.
+     * - The value contains at least one numeric digit.
+     * - The value contains at least one special character.
+     *
+     *
+     */
+    validation?: BentoInputFieldPasswordValidation;
+    /**
+     * Whether the password validation hint is displayed when the input field is activated via focus or input
+     */
+    withHint?: boolean;
+}
+
+export declare interface BentoInputFieldPasswordValidation {
+    title?: string;
+    suggestion?: string;
+    list: BentoInputFieldPasswordValidationListItem[];
 }
 
 /**
- * @deprecated The use of these enums is no longer supported.
- * Use `v-on:` or `@` to listen to the events being emitted.
- * This enum will be removed in 2.0.
+ * Public
  */
-export declare enum BentoInputFieldEvent {
-    INPUT = 'input',
-    ESCAPE_PRESSED = 'escape-pressed',
-    UPDATE_DROPDOWN = 'update:dropdown',
-    DROPDOWN_INPUT = 'dropdown-input',
-    FOCUS = 'focus',
-    CHANGE = 'change',
-    BLUR = 'blur',
-    KEYDOWN = 'keydown',
+export declare interface BentoInputFieldPasswordValidationListItem {
+    label: string;
+    validate: (value: BentoInputFieldValue, ...args: any[]) => boolean;
+    additionalArgs?: any[];
 }
 
+declare type BentoInputFieldProps = InstanceType<typeof BentoInputField>['$props'];
+
 export declare enum BentoInputFieldStateClass {
     CONDENSED = 'condensed',
     DISABLED = 'disabled',
@@ -9424,8 +9715,8 @@ export declare type BentoInpuWithDropdowntFilterValue = {
  */
 export declare const BentoInspector: __VLS_WithTemplateSlots_18<
     DefineComponent<
-        __VLS_WithDefaults_7<
-            __VLS_TypePropsToRuntimeProps_7<{
+        __VLS_WithDefaults_11<
+            __VLS_TypePropsToRuntimeProps_11<{
                 /**
                  * Shows the Expand icon in the inspector
                  */
@@ -9468,8 +9759,8 @@ export declare const BentoInspector: __VLS_WithTemplateSlots_18<
         string,
         Readonly<
             ExtractPropTypes<
-                __VLS_WithDefaults_7<
-                    __VLS_TypePropsToRuntimeProps_7<{
+                __VLS_WithDefaults_11<
+                    __VLS_TypePropsToRuntimeProps_11<{
                         /**
                          * Shows the Expand icon in the inspector
                          */
@@ -9541,6 +9832,64 @@ export declare enum BentoKeyboardNavigationKeyDownEvent {
     SPACE = 'keydown:space',
 }
 
+/**
+ * Layout is a basic scaffolding of a page that defines spacing, some functionality and responsive behaviour of its top level sections.
+ *
+ * @example
+ * import { BentoLayout, BentoLayoutRow } from '@adyen/bento-vue2';
+ *
+ * export default {
+ *     components: { BentoLayout, BentoLayoutRow },
+ *     template: `
+ *          <bento-layout size="narrow">
+ *              <bento-layout-row>
+ *                  Row 1
+ *              </bento-layout-row>
+ *              <bento-layout-row>
+ *                  Row 2
+ *              </bento-layout-row>
+ *          </bento-layout>
+ *     `
+ * }
+ */
+export declare const BentoLayout: __VLS_WithTemplateSlots_19<
+    DefineComponent<
+        __VLS_WithDefaults_12<
+            __VLS_TypePropsToRuntimeProps_12<BentoLayoutProps>,
+            {
+                size: string;
+                variant: string;
+            }
+        >,
+        {},
+        {},
+        {},
+        {},
+        ComponentOptionsMixin,
+        ComponentOptionsMixin,
+        {},
+        string,
+        Readonly<
+            ExtractPropTypes<
+                __VLS_WithDefaults_12<
+                    __VLS_TypePropsToRuntimeProps_12<BentoLayoutProps>,
+                    {
+                        size: string;
+                        variant: string;
+                    }
+                >
+            >
+        >,
+        {
+            variant: BentoLayoutVariant;
+            size: BentoLayoutSize;
+        }
+    >,
+    {
+        default: (_: {}) => any;
+    }
+>;
+
 declare type BentoLayoutGroupProportions =
     | '33-33-33'
     | '50-50'
@@ -9555,6 +9904,92 @@ declare type BentoLayoutGroupProportions =
 
 declare const BentoLayoutGroupProportions: string[];
 
+export declare interface BentoLayoutProps {
+    /** Defines if the layout is used in a page or only a section */
+    variant?: BentoLayoutVariant;
+    /** Defines the size of the page */
+    size?: BentoLayoutSize;
+}
+
+/**
+ * Page row is subcomponent of Layout meant to be used to generate the row layout.
+ *
+ * @example
+ * import { BentoLayout, BentoLayoutRow } from '@adyen/bento-vue2';
+ *
+ * export default {
+ *     components: { BentoLayout, BentoLayoutRow },
+ *     template: `
+ *          <bento-layout>
+ *              <bento-layout-row columns-layout="3-9">
+ *                  <template #col-1>Narrow 3-9</template>
+ *                  <template #col-2>Wide 3-9</template>
+ *              </bento-layout-row>
+ *              <bento-layout-row>
+ *                  <template #col-1>6-6</template>
+ *                  <template #col-2>6-6</template>
+ *              </bento-layout-row>
+ *          </bento-layout>
+ *     `
+ * }
+ */
+export declare const BentoLayoutRow: __VLS_WithTemplateSlots_20<
+    DefineComponent<
+        __VLS_WithDefaults_13<
+            __VLS_TypePropsToRuntimeProps_13<BentoLayoutRowProps>,
+            {
+                columnsLayout: string;
+            }
+        >,
+        {},
+        {},
+        {},
+        {},
+        ComponentOptionsMixin,
+        ComponentOptionsMixin,
+        {},
+        string,
+        Readonly<
+            ExtractPropTypes<
+                __VLS_WithDefaults_13<
+                    __VLS_TypePropsToRuntimeProps_13<BentoLayoutRowProps>,
+                    {
+                        columnsLayout: string;
+                    }
+                >
+            >
+        >,
+        {
+            columnsLayout: BentoLayoutRowColumnLayout;
+        }
+    >,
+    {
+        default: (_: {}) => any;
+        'col-1': (_: {}) => any;
+        'col-2': (_: {}) => any;
+    }
+>;
+
+export declare type BentoLayoutRowColumnLayout = (typeof BentoLayoutRowColumnLayoutOptions)[number];
+
+declare const BentoLayoutRowColumnLayoutOptions: readonly ['3-9', '9-3', '4-8', '8-4', '6-6'];
+
+export declare interface BentoLayoutRowProps {
+    /** Sets the layout of the columns when multiple columns are used */
+    columnsLayout?: BentoLayoutRowColumnLayout;
+}
+
+export declare type BentoLayoutSize = (typeof BentoLayoutSizeOptions)[number];
+
+declare const BentoLayoutSizeOptions: readonly ['full-width', 'narrow', 'half-width'];
+
+export declare type BentoLayoutVariant = (typeof BentoLayoutVariantOptions)[number];
+
+/**
+ * @private
+ */
+declare const BentoLayoutVariantOptions: readonly ['page', 'component'];
+
 export declare type BentoLazyLoadType = 'automatic' | 'button' | 'none';
 
 /**
@@ -9572,10 +10007,10 @@ export declare type BentoLazyLoadType = 'automatic' | 'button' | 'none';
  *     `
  * }
  */
-export declare const BentoLink: __VLS_WithTemplateSlots_19<
+export declare const BentoLink: __VLS_WithTemplateSlots_21<
     DefineComponent<
-        __VLS_WithDefaults_8<
-            __VLS_TypePropsToRuntimeProps_8<BentoLinkProps>,
+        __VLS_WithDefaults_14<
+            __VLS_TypePropsToRuntimeProps_14<BentoLinkProps>,
             {
                 target: any;
                 variant: BentoLinkVariant;
@@ -9593,8 +10028,8 @@ export declare const BentoLink: __VLS_WithTemplateSlots_19<
         string,
         Readonly<
             ExtractPropTypes<
-                __VLS_WithDefaults_8<
-                    __VLS_TypePropsToRuntimeProps_8<BentoLinkProps>,
+                __VLS_WithDefaults_14<
+                    __VLS_TypePropsToRuntimeProps_14<BentoLinkProps>,
                     {
                         target: any;
                         variant: BentoLinkVariant;
@@ -10140,7 +10575,7 @@ export declare interface BentoMenuItem {
  *     `
  * };
  */
-export declare const BentoModal: __VLS_WithTemplateSlots_21<
+export declare const BentoModal: __VLS_WithTemplateSlots_23<
     DefineComponent<
         {
             /**
@@ -10499,7 +10934,7 @@ export declare enum BentoModalEvent {
  *     `
  * }
  */
-export declare const BentoModalFullscreen: __VLS_WithTemplateSlots_22<
+export declare const BentoModalFullscreen: __VLS_WithTemplateSlots_24<
     DefineComponent<
         {
             /**
@@ -10656,7 +11091,7 @@ export declare const BentoModalFullscreen: __VLS_WithTemplateSlots_22<
  *     `
  * }
  */
-export declare const BentoModalFullscreenPage: __VLS_WithTemplateSlots_23<
+export declare const BentoModalFullscreenPage: __VLS_WithTemplateSlots_25<
     DefineComponent<
         {
             /**
@@ -10815,7 +11250,7 @@ export declare const BentoModalFullscreenPage: __VLS_WithTemplateSlots_23<
  *     `
  * }
  */
-export declare const BentoModalPage: __VLS_WithTemplateSlots_20<
+export declare const BentoModalPage: __VLS_WithTemplateSlots_22<
     DefineComponent<
         {
             /**
@@ -12396,7 +12831,7 @@ export declare enum BentoPaymentMethodType {
  *     `
  * }
  */
-export declare const BentoPopover: __VLS_WithTemplateSlots_24<
+export declare const BentoPopover: __VLS_WithTemplateSlots_26<
     DefineComponent<
         {
             /**
@@ -12815,6 +13250,164 @@ export declare const BentoPopoverPositions: {
 
 export declare type BentoPopoverPositions = PopperContainerPosition;
 
+/**
+ * Promotional Banner highlights important information, announcements, or promotions.
+ *
+ * @example
+ * import { BentoPromoBanner } from '@adyen/bento-vue2';
+ *
+ * export default {
+ *     components: { BentoPromoBanner },
+ *     template: `
+ *         <bento-promo-banner
+ *              title="Title"
+ *              description="Brief description explaining and giving more information about the title"
+ *              :image="{ src: '16-1.png', aspectRatio: '16:9' }"
+ *              :actions="[{ title: 'Primary', event: () => {} }]"
+ *         >
+ *         </bento-promo-banner>
+ *     `
+ * };
+ */
+export declare const BentoPromoBanner: __VLS_WithTemplateSlots_27<
+    DefineComponent<
+        __VLS_WithDefaults_15<
+            __VLS_TypePropsToRuntimeProps_15<BentoPromoBannerProps>,
+            {
+                actions: any;
+                color: BentoPromoBannerColor;
+                isDismissible: boolean;
+                dismissButtonText: any;
+                layout: BentoPromoBannerLayout;
+            }
+        >,
+        {},
+        {},
+        {},
+        {},
+        ComponentOptionsMixin,
+        ComponentOptionsMixin,
+        {
+            dismiss: () => void;
+        },
+        string,
+        Readonly<
+            ExtractPropTypes<
+                __VLS_WithDefaults_15<
+                    __VLS_TypePropsToRuntimeProps_15<BentoPromoBannerProps>,
+                    {
+                        actions: any;
+                        color: BentoPromoBannerColor;
+                        isDismissible: boolean;
+                        dismissButtonText: any;
+                        layout: BentoPromoBannerLayout;
+                    }
+                >
+            >
+        >,
+        {
+            actions: BentoPromoBannerAction[];
+            layout: `${BentoPromoBannerLayout}`;
+            color: `${BentoPromoBannerColor}`;
+            isDismissible: boolean;
+            dismissButtonText: string;
+        }
+    >,
+    {
+        description: (_: {}) => any;
+    }
+>;
+
+export declare type BentoPromoBannerAction<IconType = object> = BentoButtonActionObject_2<IconType> & {
+    variant: BentoPromoBannerButtonVariant;
+};
+
+export declare type BentoPromoBannerButtonVariant = `${BentoButtonVariant.PRIMARY | BentoButtonVariant.SECONDARY}`;
+
+export declare enum BentoPromoBannerColor {
+    BLUE = 'blue',
+    GREY = 'grey',
+    GREEN = 'green',
+}
+
+export declare type BentoPromoBannerImage = {
+    src: BentoImageProps['src'];
+    alt?: BentoImageProps['alt'];
+    aspectRatio: BentoPromoBannerImageAspectRatio;
+};
+
+export declare type BentoPromoBannerImageAspectRatio = `${
+    | BentoImageAspectRatio.P16_9
+    | BentoImageAspectRatio.P2_1
+    | BentoImageAspectRatio.P1_1}`;
+
+export declare enum BentoPromoBannerLayout {
+    HORIZONTAL = 'horizontal',
+    VERTICAL = 'vertical',
+}
+
+export declare interface BentoPromoBannerProps {
+    /**
+     * List of actions that will be used to render the buttons.
+     *
+     * Each object in the list should have a `title`, an `event` and a `variant`.
+     *
+     * `title`: Button's text.
+     * `event`: Event triggered when clicking the Button.
+     * `variant`: Button's style.
+     *
+     * ```
+     * [{
+     *   title: 'Primary',
+     *   event: () => { ... },
+     *   variant: 'primary'
+     * }, {
+     *   title: 'Secondary',
+     *   event: () => { ... }
+     *   variant: 'secondary'
+     * }]
+     * ```
+     */
+    actions?: BentoPromoBannerAction[];
+    /**
+     * Defines the color of banner's background
+     */
+    color?: `${BentoPromoBannerColor}`;
+    /**
+     * Defines whether the banner has a `Dismiss` button
+     */
+    isDismissible?: boolean;
+    /**
+     * Defines whether the banner has a `Dismiss` button
+     */
+    dismissButtonText?: string;
+    /**
+     * Defines the image used in the banner.
+     *
+     * The promotional banner adapts to different container sizes based on the image's `aspect-ratio`.
+     * Only the following `aspect-ratio` values are supported: `16:9`, `2:1`, and `1:1`.
+     *
+     * In Storybook, to verify the image display, update `image.src` and `image.aspectRatio` as follows:
+     *  - `./1-1.png` with an aspect ratio of `1:1`
+     *  - `./2-1.png` with an aspect ratio of `2:1`
+     *  - `./16-9.png` with an aspect ratio of `16:9`
+     */
+    image: BentoPromoBannerImage;
+    /**
+     * Defines style of the banner.
+     *
+     * The horizontal layout is responsive to the container size and
+     * changes depending on the image aspect ratio.
+     *
+     * The vertical layout remains the same regardless of container size.
+     */
+    layout?: `${BentoPromoBannerLayout}`;
+    /**
+     * Defines the title text to be shown on the banner
+     */
+    title: string;
+}
+
 /**
  * Radio buttons are used when two or more options are mutually exclusive,
  * the user can only select a single option from a list of pre-defined options.
@@ -12848,7 +13441,7 @@ export declare type BentoPopoverPositions = PopperContainerPosition;
  *     }
  * }
  */
-export declare const BentoRadioButton: __VLS_WithTemplateSlots_26<
+export declare const BentoRadioButton: __VLS_WithTemplateSlots_29<
     DefineComponent<
         {
             /**
@@ -13018,7 +13611,7 @@ export declare type BentoRadioButtonValue = string | number;
  *     `
  * };
  */
-export declare const BentoRadioGroup: __VLS_WithTemplateSlots_25<
+export declare const BentoRadioGroup: __VLS_WithTemplateSlots_28<
     DefineComponent<
         {
             /**
@@ -13493,7 +14086,7 @@ export declare interface BentoSearchBarItem {
  * }
  */
 export declare const BentoSecondaryNav: DefineComponent<
-    __VLS_TypePropsToRuntimeProps_10<{
+    __VLS_TypePropsToRuntimeProps_17<{
         /**
          * An array containing all the items on the nav. The array can have either {@see BentoSecondaryNavItemsCategory },
          * which is used to group different items or {@see BentoSecondaryNavItemsItem } if you don't need to group them.
@@ -13517,7 +14110,7 @@ export declare const BentoSecondaryNav: DefineComponent<
     string,
     Readonly<
         ExtractPropTypes<
-            __VLS_TypePropsToRuntimeProps_10<{
+            __VLS_TypePropsToRuntimeProps_17<{
                 /**
                  * An array containing all the items on the nav. The array can have either {@see BentoSecondaryNavItemsCategory },
                  * which is used to group different items or {@see BentoSecondaryNavItemsItem } if you don't need to group them.
@@ -13567,8 +14160,8 @@ export declare interface BentoSecondaryNavState {
  * }
  */
 export declare const BentoSegmentedControl: DefineComponent<
-    __VLS_WithDefaults_10<
-        __VLS_TypePropsToRuntimeProps_11<{
+    __VLS_WithDefaults_17<
+        __VLS_TypePropsToRuntimeProps_18<{
             /**
              * Accessible name describing the segmented control.
              * @deprecated from version 2.0.0. Use the aria-label attribute instead.
@@ -13609,8 +14202,8 @@ export declare const BentoSegmentedControl: DefineComponent<
     string,
     Readonly<
         ExtractPropTypes<
-            __VLS_WithDefaults_10<
-                __VLS_TypePropsToRuntimeProps_11<{
+            __VLS_WithDefaults_17<
+                __VLS_TypePropsToRuntimeProps_18<{
                     /**
                      * Accessible name describing the segmented control.
                      * @deprecated from version 2.0.0. Use the aria-label attribute instead.
@@ -13688,6 +14281,7 @@ export declare interface BentoSelectFilterOptions {
      */
     multiple?: boolean;
     /**
+     * @deprecated from version 2.0.0. The persistent filter label now uses a counter instead of custom strings. This property is now redundant.
      * The translation object to handle any custom transations. e.g. perisistent filter labels.
      */
     messages?: {
@@ -13698,11 +14292,13 @@ export declare interface BentoSelectFilterOptions {
         };
     };
     /**
+     * @deprecated from version 2.0.0. The persistent filter label now uses a counter instead of custom strings. This property is now redundant.
      * The unique key to use in the messages translation object to use for the persistent button label
      * when the select filter has partially selected items.
      */
     messagesPersistentButtonLabelPartiallySelectedKey?: string;
     /**
+     * @deprecated from version 2.0.0. The persistent filter label now uses a counter instead of custom strings. This property is now redundant.
      * The unique key to use in the messages translation object to use for the persistent button label
      * when the select filter has all items selected.
      */
@@ -13767,7 +14363,7 @@ export declare type BentoSelectFilterValue = BentoListboxSelectedValue;
  *     `
  * }
  */
-export declare const BentoSelectionCard: __VLS_WithTemplateSlots_27<
+export declare const BentoSelectionCard: __VLS_WithTemplateSlots_30<
     DefineComponent<
         {
             /**
@@ -13977,7 +14573,7 @@ export declare const BentoSelectionCard: __VLS_WithTemplateSlots_27<
  *     `,
  * }
  */
-export declare const BentoSelectionCardGroup: __VLS_WithTemplateSlots_28<
+export declare const BentoSelectionCardGroup: __VLS_WithTemplateSlots_31<
     DefineComponent<
         {
             /**
@@ -14037,6 +14633,13 @@ export declare const BentoSelectionCardGroup: __VLS_WithTemplateSlots_28<
                 type: PropType<BentoSelectionCardItem[]>;
                 required: true;
             };
+            /**
+             * Sets the responsive number of items rendered in each row.
+             */
+            itemsPerRow: {
+                type: PropType<BentoSelectionCardGroupItemsPerRow>;
+                default: any;
+            };
             /**
              * Determines the initially selected value of the group. Corresponds to the BentoSelectionCardItem's value.
              * Defaults to no value selected.
@@ -14153,6 +14756,13 @@ export declare const BentoSelectionCardGroup: __VLS_WithTemplateSlots_28<
                     type: PropType<BentoSelectionCardItem[]>;
                     required: true;
                 };
+                /**
+                 * Sets the responsive number of items rendered in each row.
+                 */
+                itemsPerRow: {
+                    type: PropType<BentoSelectionCardGroupItemsPerRow>;
+                    default: any;
+                };
                 /**
                  * Determines the initially selected value of the group. Corresponds to the BentoSelectionCardItem's value.
                  * Defaults to no value selected.
@@ -14212,15 +14822,18 @@ export declare const BentoSelectionCardGroup: __VLS_WithTemplateSlots_28<
             readonly: boolean;
             modelValue: BentoSelectionCardModelValue;
             formId: string;
+            itemsPerRow: GridLayoutColumnWidth;
         }
     >,
     {
-        icon: (_: BentoSelectionCardItem) => any;
-        content: (_: BentoSelectionCardItem) => any;
-        dynamicContent: (_: BentoSelectionCardItem) => any;
+        icon: (_: any) => any;
+        content: (_: any) => any;
+        dynamicContent: (_: any) => any;
     }
 >;
 
+export declare type BentoSelectionCardGroupItemsPerRow = GridLayoutColumnWidth;
+
 export declare type BentoSelectionCardGroupLayout = 'horizontal' | 'vertical';
 
 export declare type BentoSelectionCardGroupVariant = 'checkbox' | 'radio';
@@ -14293,7 +14906,7 @@ export declare type BentoSelectTagFilterOptions = OmitStrict<BentoSelectFilterOp
  *     `
  * }
  */
-export declare const BentoSidepanel: __VLS_WithTemplateSlots_30<
+export declare const BentoSidepanel: __VLS_WithTemplateSlots_33<
     DefineComponent<
         {
             /**
@@ -14438,7 +15051,7 @@ export declare enum BentoSidepanelEvent {
  *     `
  * }
  */
-export declare const BentoSidepanelPage: __VLS_WithTemplateSlots_29<
+export declare const BentoSidepanelPage: __VLS_WithTemplateSlots_32<
     DefineComponent<
         {
             /**
@@ -14598,9 +15211,9 @@ export declare const BentoSidepanelPage: __VLS_WithTemplateSlots_29<
  *     `
  * }
  */
-export declare const BentoStatus: __VLS_WithTemplateSlots_31<
+export declare const BentoStatus: __VLS_WithTemplateSlots_34<
     DefineComponent<
-        __VLS_TypePropsToRuntimeProps_12<{
+        __VLS_TypePropsToRuntimeProps_19<{
             variant: BentoStatusVariant | `${BentoStatusVariant}`;
         }>,
         {},
@@ -14613,7 +15226,7 @@ export declare const BentoStatus: __VLS_WithTemplateSlots_31<
         string,
         Readonly<
             ExtractPropTypes<
-                __VLS_TypePropsToRuntimeProps_12<{
+                __VLS_TypePropsToRuntimeProps_19<{
                     variant: BentoStatusVariant | `${BentoStatusVariant}`;
                 }>
             >
@@ -14659,7 +15272,7 @@ export declare enum BentoStatusVariant {
  *     `
  * }
  */
-export declare const BentoStep: __VLS_WithTemplateSlots_33<
+export declare const BentoStep: __VLS_WithTemplateSlots_36<
     DefineComponent<
         {
             /**
@@ -14733,7 +15346,7 @@ export declare const BentoStep: __VLS_WithTemplateSlots_33<
  *     `
  * }
  */
-export declare const BentoStepper: __VLS_WithTemplateSlots_32<
+export declare const BentoStepper: __VLS_WithTemplateSlots_35<
     DefineComponent<
         {
             /**
@@ -14851,18 +15464,16 @@ export declare enum BentoStepperVariantOption {
  *               <bento-payment-method label="Klarna" type="Klarna"  />
  *         </bento-structured-list-item>
  *         <bento-structured-list-item label="Amount">
- *               <bento-currency :currency="BentoCurrencyISOCode.USD">
- *                   123456
- *               </bento-currency>
+ *               <bento-currency :currency="BentoCurrencyISOCode.USD" :value="123456" />
  *         </bento-structured-list-item>
  *       </bento-structured-list>
  *     `
  * }
  */
-export declare const BentoStructuredList: __VLS_WithTemplateSlots_34<
+export declare const BentoStructuredList: __VLS_WithTemplateSlots_37<
     DefineComponent<
-        __VLS_WithDefaults_11<
-            __VLS_TypePropsToRuntimeProps_13<{
+        __VLS_WithDefaults_18<
+            __VLS_TypePropsToRuntimeProps_20<{
                 /**
                  * Width of the labels container, in pixels. Overrides layout prop.
                  */
@@ -14896,8 +15507,8 @@ export declare const BentoStructuredList: __VLS_WithTemplateSlots_34<
         string,
         Readonly<
             ExtractPropTypes<
-                __VLS_WithDefaults_11<
-                    __VLS_TypePropsToRuntimeProps_13<{
+                __VLS_WithDefaults_18<
+                    __VLS_TypePropsToRuntimeProps_20<{
                         /**
                          * Width of the labels container, in pixels. Overrides layout prop.
                          */
@@ -14950,17 +15561,15 @@ export declare const BentoStructuredList: __VLS_WithTemplateSlots_34<
  *               </bento-status>
  *         </bento-structured-list-item>
  *         <bento-structured-list-item label="Amount" copy='123456'>
- *               <bento-currency :currency="BentoCurrencyISOCode.USD">
- *                   123456
- *               </bento-currency>
+ *               <bento-currency :currency="BentoCurrencyISOCode.USD" :value="123456" />
  *         </bento-structured-list-item>
  *       </bento-structured-list>
  *     `
  * }
  */
-export declare const BentoStructuredListItem: __VLS_WithTemplateSlots_35<
+export declare const BentoStructuredListItem: __VLS_WithTemplateSlots_38<
     DefineComponent<
-        __VLS_TypePropsToRuntimeProps_14<{
+        __VLS_TypePropsToRuntimeProps_21<{
             /**
              * Label to display for the value
              */
@@ -14996,7 +15605,7 @@ export declare const BentoStructuredListItem: __VLS_WithTemplateSlots_35<
         string,
         Readonly<
             ExtractPropTypes<
-                __VLS_TypePropsToRuntimeProps_14<{
+                __VLS_TypePropsToRuntimeProps_21<{
                     /**
                      * Label to display for the value
                      */
@@ -16196,8 +16805,8 @@ declare enum BentoTabsEvent {
 }
 
 export declare const BentoTag: DefineComponent<
-    __VLS_WithDefaults_9<
-        __VLS_TypePropsToRuntimeProps_9<BentoTagProps>,
+    __VLS_WithDefaults_16<
+        __VLS_TypePropsToRuntimeProps_16<BentoTagProps>,
         {
             label: any;
             truncate: any;
@@ -16214,8 +16823,8 @@ export declare const BentoTag: DefineComponent<
     string,
     Readonly<
         ExtractPropTypes<
-            __VLS_WithDefaults_9<
-                __VLS_TypePropsToRuntimeProps_9<BentoTagProps>,
+            __VLS_WithDefaults_16<
+                __VLS_TypePropsToRuntimeProps_16<BentoTagProps>,
                 {
                     label: any;
                     truncate: any;
@@ -17464,10 +18073,10 @@ export declare interface BentoTutorialStep {
  *     `
  * }
  */
-export declare const BentoTypography: __VLS_WithTemplateSlots_36<
+export declare const BentoTypography: __VLS_WithTemplateSlots_39<
     DefineComponent<
-        __VLS_WithDefaults_12<
-            __VLS_TypePropsToRuntimeProps_15<{
+        __VLS_WithDefaults_19<
+            __VLS_TypePropsToRuntimeProps_22<{
                 /**
                  * Sets the HTML DOM element.
                  * @values h1, h2, h3, h4, h5, h6, div, p, span
@@ -17528,8 +18137,8 @@ export declare const BentoTypography: __VLS_WithTemplateSlots_36<
         string,
         Readonly<
             ExtractPropTypes<
-                __VLS_WithDefaults_12<
-                    __VLS_TypePropsToRuntimeProps_15<{
+                __VLS_WithDefaults_19<
+                    __VLS_TypePropsToRuntimeProps_22<{
                         /**
                          * Sets the HTML DOM element.
                          * @values h1, h2, h3, h4, h5, h6, div, p, span
@@ -17861,6 +18470,15 @@ export declare type MaybeReadonlyRef<T> = (() => T) | ComputedRef<T>;
  */
 export declare type MaybeRef<T> = T | Ref<T> | Ref<UnwrapRef<T>>;
 
+/**
+ * Validates if the length of the provided value is greater than or equal to the specified length.
+ *
+ * @param value - The input value to check.
+ * @param length - The minimum required length of the value. Defaults to 8.
+ * @returns `true` if the length of the value is greater than or equal to the specified length, `false` otherwise.
+ */
+export declare function minLength(value: BentoInputFieldValue, length?: number): boolean;
+
 export declare type OmitStrict<T, K extends keyof T> = Pick<T, Exclude<keyof T, K>>;
 
 declare type OnClickOutsideHandler = (evt: PointerEvent | FocusEvent) => void;
@@ -17930,6 +18548,38 @@ declare enum PopperContainerPositionExtended {
     LEFT_END = 'left-end',
 }
 
+/**
+ * Validates if the provided value contains at least one lowercase letter.
+ *
+ * @param value - The input value to check.
+ * @returns `true` if the value contains at least one lowercase letter, `false` otherwise.
+ */
+export declare function requireLowercase(value: BentoInputFieldValue): boolean;
+
+/**
+ * Validates if the provided value contains at least one numerical digit.
+ *
+ * @param value - The input value to check.
+ * @returns `true` if the value contains at least one numerical digit, `false` otherwise.
+ */
+export declare function requireNumeric(value: BentoInputFieldValue): boolean;
+
+/**
+ * Validates if the provided value contains at least one special character (non-alphanumeric).
+ *
+ * @param value - The input value to check.
+ * @returns `true` if the value contains at least one special character, `false` otherwise.
+ */
+export declare function requireSpecialCharacter(value: BentoInputFieldValue): boolean;
+
+/**
+ * Validates if the provided value contains at least one uppercase letter.
+ *
+ * @param value - The input value to check.
+ * @returns `true` if the value contains at least one uppercase letter, `false` otherwise.
+ */
+export declare function requireUppercase(value: BentoInputFieldValue): boolean;
+
 declare interface Toast {
     dismiss: () => void;
 }