@adyen/bento-vue2 1.50.0 → 1.52.0

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

@@ -11,6 +11,7 @@ import { DirectiveBinding } from 'vue';
 import type { DirectiveHook } from 'vue';
 import { EditorView } from '@codemirror/view';
 import { ExtractPropTypes } from 'vue';
+import type { HTMLAttributes } from 'vue/types/jsx.d.ts';
 import { Placement } from '@floating-ui/vue';
 import type { PluginObject } from 'vue';
 import { PropType } from 'vue';
@@ -64,8 +65,14 @@ declare type __VLS_NonUndefinedable_27<T> = T extends undefined ? never : T;
 
 declare type __VLS_NonUndefinedable_28<T> = T extends undefined ? never : T;
 
+declare type __VLS_NonUndefinedable_29<T> = T extends undefined ? never : T;
+
 declare type __VLS_NonUndefinedable_3<T> = T extends undefined ? never : T;
 
+declare type __VLS_NonUndefinedable_30<T> = T extends undefined ? never : T;
+
+declare type __VLS_NonUndefinedable_31<T> = T extends undefined ? never : T;
+
 declare type __VLS_NonUndefinedable_4<T> = T extends undefined ? never : T;
 
 declare type __VLS_NonUndefinedable_5<T> = T extends undefined ? never : T;
@@ -267,6 +274,15 @@ declare type __VLS_TypePropsToRuntimeProps_28<T> = {
     };
 };
 
+declare type __VLS_TypePropsToRuntimeProps_29<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: PropType<__VLS_NonUndefinedable_29<T[K]>>;
+    } : {
+        type: PropType<T[K]>;
+        required: true;
+    };
+};
+
 declare type __VLS_TypePropsToRuntimeProps_3<T> = {
     [K in keyof T]-?: {} extends Pick<T, K> ? {
         type: PropType<__VLS_NonUndefinedable_3<T[K]>>;
@@ -276,6 +292,24 @@ declare type __VLS_TypePropsToRuntimeProps_3<T> = {
     };
 };
 
+declare type __VLS_TypePropsToRuntimeProps_30<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: PropType<__VLS_NonUndefinedable_30<T[K]>>;
+    } : {
+        type: PropType<T[K]>;
+        required: true;
+    };
+};
+
+declare type __VLS_TypePropsToRuntimeProps_31<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: PropType<__VLS_NonUndefinedable_31<T[K]>>;
+    } : {
+        type: PropType<T[K]>;
+        required: true;
+    };
+};
+
 declare type __VLS_TypePropsToRuntimeProps_4<T> = {
     [K in keyof T]-?: {} extends Pick<T, K> ? {
         type: PropType<__VLS_NonUndefinedable_4<T[K]>>;
@@ -438,6 +472,24 @@ declare type __VLS_WithDefaults_25<P, D> = {
     } : P[K];
 };
 
+declare type __VLS_WithDefaults_26<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? P[K] & {
+        default: D[K];
+    } : P[K];
+};
+
+declare type __VLS_WithDefaults_27<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? P[K] & {
+        default: D[K];
+    } : P[K];
+};
+
+declare type __VLS_WithDefaults_28<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] & {
         default: D[K];
@@ -1864,6 +1916,10 @@ shouldShowError: ComputedRef<boolean>;
 shouldShowErrorMessage: ComputedRef<boolean>;
 contentSlotAvailable: ComputedRef<boolean>;
 hasContentSlot: ComputedRef<boolean>;
+styleAttrs: ComputedRef<    {
+class: HTMLAttributes["class"];
+style: HTMLAttributes["style"];
+}>;
 hasSlot: (name: string) => boolean;
 onChange: (newValue: BentoCheckboxType | BentoCheckboxGroupItems) => void;
 t: (key: "required" | "optional" | "checkbox", values?: default_2.Values) => string;
@@ -3262,7 +3318,7 @@ export declare interface BentoCurrencyProps {
  *     `
  * }
  */
-export declare const BentoDashboardSection: __VLS_WithTemplateSlots_42<DefineComponent<__VLS_WithDefaults_25<__VLS_TypePropsToRuntimeProps_28<{
+export declare const BentoDashboardSection: __VLS_WithTemplateSlots_42<DefineComponent<__VLS_WithDefaults_28<__VLS_TypePropsToRuntimeProps_31<{
 /**
 * The header of the section
 */
@@ -3273,7 +3329,7 @@ header: BentoDashboardTemplateHeader;
 halfWidth?: boolean;
 }>, {
 halfWidth: boolean;
-}>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, Readonly<ExtractPropTypes<__VLS_WithDefaults_25<__VLS_TypePropsToRuntimeProps_28<{
+}>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, Readonly<ExtractPropTypes<__VLS_WithDefaults_28<__VLS_TypePropsToRuntimeProps_31<{
 /**
 * The header of the section
 */
@@ -3321,7 +3377,7 @@ halfWidth: boolean;
  *     `
  * }
  */
-export declare const BentoDashboardTemplate: __VLS_WithTemplateSlots_41<DefineComponent<__VLS_WithDefaults_24<__VLS_TypePropsToRuntimeProps_27<{
+export declare const BentoDashboardTemplate: __VLS_WithTemplateSlots_41<DefineComponent<__VLS_WithDefaults_27<__VLS_TypePropsToRuntimeProps_30<{
 /**
 * The header that goes to the top of the template
 */
@@ -3344,7 +3400,7 @@ stickyFilters?: boolean;
 tabs: any;
 stickyTabs: boolean;
 stickyFilters: boolean;
-}>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, Readonly<ExtractPropTypes<__VLS_WithDefaults_24<__VLS_TypePropsToRuntimeProps_27<{
+}>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, Readonly<ExtractPropTypes<__VLS_WithDefaults_27<__VLS_TypePropsToRuntimeProps_30<{
 /**
 * The header that goes to the top of the template
 */
@@ -3563,7 +3619,7 @@ default: () => any[];
 * Filter bar search term useful to filter all the data by text
 */
 filterSearchTerm: {
-type: StringConstructor;
+type: PropType<string>;
 default: any;
 };
 /**
@@ -3829,7 +3885,7 @@ default: () => any[];
 * Filter bar search term useful to filter all the data by text
 */
 filterSearchTerm: {
-type: StringConstructor;
+type: PropType<string>;
 default: any;
 };
 /**
@@ -4345,7 +4401,7 @@ default: boolean;
 }>>, {
 disableTypography: boolean;
 date: string | number | Date;
-format: "d" | "EEEE" | "h:mm aa" | "H:mm" | "h:mm:ss aa" | "H:mm:ss" | "LLLL dd, yyyy" | "LLL dd, yyyy" | BentoDateFormat | "LLL dd, yyyy, h:mm:ss aa" | "LLL dd, yyyy, H:mm:ss" | "LLL dd, yyyy, h:mm:ss aa O" | "LLL dd, yyyy, H:mm:ss O" | "LLL dd, yyyy, h:mm aa" | "LLL dd, yyyy, h:mm aa O" | "LLL dd, yyyy, H:mm" | "LLL dd, yyyy, H:mm O";
+format: "d" | "LLL" | "EEEE" | "h:mm aa" | "H:mm" | "h:mm:ss aa" | "H:mm:ss" | "LLLL dd, yyyy" | "LLL dd, yyyy" | BentoDateFormat | "LLL dd, yyyy, h:mm:ss aa" | "LLL dd, yyyy, H:mm:ss" | "LLL dd, yyyy, h:mm:ss aa O" | "LLL dd, yyyy, H:mm:ss O" | "LLL dd, yyyy, h:mm aa" | "LLL dd, yyyy, h:mm aa O" | "LLL dd, yyyy, H:mm" | "LLL dd, yyyy, H:mm O";
 }>;
 
 export declare interface BentoDateFilterOptions {
@@ -4356,6 +4412,7 @@ export declare interface BentoDateFilterOptions {
 export declare type BentoDateFilterValue = Date | null;
 
 export declare enum BentoDateFormat {
+    SHORT_MONTH = "LLL",// Jun
     DAY_OF_MONTH = "d",// 1, 2, ..., 31,
     LONG_WEEKDAY = "EEEE",// Friday
     SHORT_TIME_WITH_PERIOD = "h:mm aa",// 2:44 PM
@@ -4495,6 +4552,13 @@ type: PropType<BentoDatePickerValue>;
 default: any;
 };
 /**
+* The type of calendar to display. Defaults to showing days.
+*/
+variant: {
+type: PropType<`${CalendarVariant}`>;
+default: any;
+};
+/**
 * Default start date for the calendar pane
 */
 defaultDisplayMonth: {
@@ -4622,6 +4686,13 @@ type: PropType<BentoDatePickerValue>;
 default: any;
 };
 /**
+* The type of calendar to display. Defaults to showing days.
+*/
+variant: {
+type: PropType<`${CalendarVariant}`>;
+default: any;
+};
+/**
 * Default start date for the calendar pane
 */
 defaultDisplayMonth: {
@@ -4633,6 +4704,7 @@ validator: (value: string) => boolean;
 value: Date;
 description: string;
 label: string;
+variant: "day" | "month";
 required: boolean;
 disabled: boolean;
 optional: boolean;
@@ -4837,6 +4909,13 @@ type: PropType<BentoDateRangePickerValue>;
 default: any;
 };
 /**
+* The type of calendar to display. Defaults to showing days.
+*/
+variant: {
+type: PropType<`${CalendarVariant}`>;
+default: any;
+};
+/**
 * Enables the date picker selection to persist until it is explicitly applied.
 * Displays a set of buttons: Apply and Cancel.
 *
@@ -4882,6 +4961,7 @@ FILL_CONTAINER: import("../../components/button").BentoButtonActionsLayoutBasic.
 SPACE_BETWEEN: import("../../components/button").BentoButtonActionsLayoutBasic.SPACE_BETWEEN;
 VERTICAL_STACK: import("../../components/button").BentoButtonActionsLayoutBasic.VERTICAL_STACK;
 };
+withTimeInput: ComputedRef<boolean>;
 closeDateRangePicker: () => void;
 clearDateRangePickerValue: () => Promise<void>;
 openDateRangePicker: () => void;
@@ -5034,6 +5114,13 @@ type: PropType<BentoDateRangePickerValue>;
 default: any;
 };
 /**
+* The type of calendar to display. Defaults to showing days.
+*/
+variant: {
+type: PropType<`${CalendarVariant}`>;
+default: any;
+};
+/**
 * Enables the date picker selection to persist until it is explicitly applied.
 * Displays a set of buttons: Apply and Cancel.
 *
@@ -5047,6 +5134,7 @@ default: boolean;
 value: BentoDateRangePickerValue;
 description: string;
 label: string;
+variant: "day" | "month";
 required: boolean;
 disabled: boolean;
 optional: boolean;
@@ -7368,175 +7456,30 @@ export declare type BentoFileUploaderValue = string | Array<string> | File | Arr
  *   `
  * }
  */
-export declare const BentoFilterBar: DefineComponent<    {
-/**
-* Array of filters based on {@see BentoFilterBarModel}.
-* Each one of the elements in the array correspond to a filter that will
-* be created and rendered in the FilterBar.
-*
-* @example
-* [{
-*   field: 'company',
-*   label: 'Company',
-*   type: FilterType.TEXT,
-* }, {
-*   field: 'name',
-*   label: 'Name',
-*   type: FilterType.TEXT,
-* }]
-*/
-config: {
-type: PropType<BentoFilterBarModel>;
-default: () => any[];
-};
-/**
-* Search term useful to filter all the data by text.
-* If the value is non-existant (null or undefined) the search bar won't be enabled.
-*/
-searchTerm: {
-type: StringConstructor;
-default: any;
-};
-/**
-* @deprecated from version 2.0.0. Use the config property instead.
-*/
-/**
-* Array of filters based on {@see BentoFilterBarModel}.
-* Each one of the elements in the array correspond to a filter that will
-* be created and rendered in the FilterBar.
-*
-* Can be used with v-model or independently with the @input event.
-*
-* @example
-* [{
-*   field: 'company',
-*   label: 'Company',
-*   value: '200',
-*   type: FilterType.TEXT,
-* }, {
-*   field: 'name',
-*   label: 'Name',
-*   value: null,
-*   type: FilterType.TEXT,
-* }]
-*/
-value: {
-type: PropType<BentoFilterBarModel>;
-default: () => any[];
-};
-/**
-* An array of the values for each filter in the filter bar.
-* {@see BentoFilterValues}
-*
-*  @example
-* [{
-*   field: 'company',
-*   value: '200',
-* }, {
-*   field: 'name',
-*   value: 'some text',
-* }]
-*/
-filterValues: {
-type: PropType<BentoFilterValues>;
-default: () => any[];
-};
-/**
-* Will show all applied filters even if their visibility is set to false.
-*/
-showAppliedHiddenFilters: {
-type: BooleanConstructor;
-default: boolean;
-};
-}, {
+export declare const BentoFilterBar: DefineComponent<__VLS_WithDefaults_11<__VLS_TypePropsToRuntimeProps_11<BentoFilterBarProps>, {
+config: () => any[];
+filterValues: () => any[];
+search: any;
+searchTerm: any;
+value: () => any[];
+showAppliedHiddenFilters: boolean;
+}>, {
 isClearAllVisible: ComputedRef<boolean>;
 clearAllFilters: () => void;
 isResetAllVisible: ComputedRef<boolean>;
 resetAllFilters: () => void;
-}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, (BentoFilterBarEvent | BentoSearchBarEvent)[], string, Readonly<ExtractPropTypes<    {
-/**
-* Array of filters based on {@see BentoFilterBarModel}.
-* Each one of the elements in the array correspond to a filter that will
-* be created and rendered in the FilterBar.
-*
-* @example
-* [{
-*   field: 'company',
-*   label: 'Company',
-*   type: FilterType.TEXT,
-* }, {
-*   field: 'name',
-*   label: 'Name',
-*   type: FilterType.TEXT,
-* }]
-*/
-config: {
-type: PropType<BentoFilterBarModel>;
-default: () => any[];
-};
-/**
-* Search term useful to filter all the data by text.
-* If the value is non-existant (null or undefined) the search bar won't be enabled.
-*/
-searchTerm: {
-type: StringConstructor;
-default: any;
-};
-/**
-* @deprecated from version 2.0.0. Use the config property instead.
-*/
-/**
-* Array of filters based on {@see BentoFilterBarModel}.
-* Each one of the elements in the array correspond to a filter that will
-* be created and rendered in the FilterBar.
-*
-* Can be used with v-model or independently with the @input event.
-*
-* @example
-* [{
-*   field: 'company',
-*   label: 'Company',
-*   value: '200',
-*   type: FilterType.TEXT,
-* }, {
-*   field: 'name',
-*   label: 'Name',
-*   value: null,
-*   type: FilterType.TEXT,
-* }]
-*/
-value: {
-type: PropType<BentoFilterBarModel>;
-default: () => any[];
-};
-/**
-* An array of the values for each filter in the filter bar.
-* {@see BentoFilterValues}
-*
-*  @example
-* [{
-*   field: 'company',
-*   value: '200',
-* }, {
-*   field: 'name',
-*   value: 'some text',
-* }]
-*/
-filterValues: {
-type: PropType<BentoFilterValues>;
-default: () => any[];
-};
-/**
-* Will show all applied filters even if their visibility is set to false.
-*/
-showAppliedHiddenFilters: {
-type: BooleanConstructor;
-default: boolean;
-};
-}>>, {
+}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, (BentoFilterBarEvent | BentoSearchBarEvent)[], string, Readonly<ExtractPropTypes<__VLS_WithDefaults_11<__VLS_TypePropsToRuntimeProps_11<BentoFilterBarProps>, {
+config: () => any[];
+filterValues: () => any[];
+search: any;
+searchTerm: any;
+value: () => any[];
+showAppliedHiddenFilters: boolean;
+}>>>, {
+search: BentoFilterBarSearchBarProps;
 value: BentoFilterBarModel;
 config: BentoFilterBarModel;
-searchTerm: string;
+searchTerm: BentoFilterBarSearchTerm;
 filterValues: BentoFilterValues;
 showAppliedHiddenFilters: boolean;
 }>;
@@ -7548,6 +7491,82 @@ export declare enum BentoFilterBarEvent {
 
 export declare type BentoFilterBarModel = Array<BentoFilterModel>;
 
+export declare interface BentoFilterBarProps {
+    /**
+     * Array of filters based on @see {@link BentoFilterBarModel}.
+     * Each one of the elements in the array correspond to a filter that will
+     * be created and rendered in the FilterBar.
+     *
+     * @example
+     * [{
+     *   field: 'company',
+     *   label: 'Company',
+     *   type: FilterType.TEXT,
+     * }, {
+     *   field: 'name',
+     *   label: 'Name',
+     *   type: FilterType.TEXT,
+     * }]
+     */
+    config?: BentoFilterBarModel;
+    /**
+     * An array of the values for each filter in the filter bar.
+     * @see {@link BentoFilterValues}
+     *
+     *  @example
+     * [{
+     *   field: 'company',
+     *   value: '200',
+     * }, {
+     *   field: 'name',
+     *   value: 'some text',
+     * }]
+     */
+    filterValues?: BentoFilterValues;
+    /**
+     * Search bar properties with which the placeholder, hint and other
+     * "bento-search-bar" properties can be set. @see {@link BentoFilterBarSearchBarProps}
+     */
+    search?: BentoFilterBarSearchBarProps;
+    /**
+     * Search term useful to filter all the data by text.
+     * If the value is non-existant (null or undefined) the search bar won't be enabled.
+     * Can be used with `.sync`
+     */
+    searchTerm?: BentoFilterBarSearchTerm;
+    /**
+     * Will show all applied filters even if their visibility is set to false.
+     */
+    showAppliedHiddenFilters?: boolean;
+    /**
+     * Array of filters based on @see {@link BentoFilterBarModel}.
+     * Each one of the elements in the array correspond to a filter that will
+     * be created and rendered in the FilterBar.
+     *
+     * Can be used with v-model or independently with the @input event.
+     *
+     * @example
+     * [{
+     *   field: 'company',
+     *   label: 'Company',
+     *   value: '200',
+     *   type: FilterType.TEXT,
+     * }, {
+     *   field: 'name',
+     *   label: 'Name',
+     *   value: null,
+     *   type: FilterType.TEXT,
+     * }]
+     *
+     * @deprecated from version 2.0.0. Use the config property instead.
+     */
+    value?: BentoFilterBarModel;
+}
+
+export declare type BentoFilterBarSearchBarProps = OmitStrict<BentoSearchBarProps, 'value' | 'condensed'>;
+
+export declare type BentoFilterBarSearchTerm = BentoSearchBarProps['value'];
+
 export declare type BentoFilterBarValue = BentoInputFilterValue | BentoInpuWithDropdowntFilterValue | BentoSelectFilterValue | BentoBooleanFilterValue | BentoDateFilterValue | BentoDateRangeFilterValue;
 
 export declare enum BentoFilterEvent {
@@ -7584,7 +7603,7 @@ export declare interface BentoFilterModel extends BentoFilterValue {
     value?: BentoFilterBarValue;
 }
 
-export declare type BentoFilterOptions = BentoSelectFilterOptions | BentoSelectAvatarFilterOptions | BentoSelectCountryFilterOptions | BentoSelectCurrencyFilterOptions | BentoSelectPaymentMethodFilterOptions | BentoSelectTagFilterOptions | BentoDateFilterOptions | BentoDateRangeFilterOptions | BentoBooleanFilterOptions | BentoInputWithDropdownFilterOptions | undefined;
+export declare type BentoFilterOptions = BentoSelectFilterOptions | BentoSelectAvatarFilterOptions | BentoSelectCountryFilterOptions | BentoSelectCurrencyFilterOptions | BentoSelectPaymentMethodFilterOptions | BentoSelectTagFilterOptions | BentoDateFilterOptions | BentoDateRangeFilterOptions | BentoBooleanFilterOptions | BentoInputFilterOptions | BentoInputWithDropdownFilterOptions | undefined;
 
 export declare interface BentoFilterValue {
     field: string;
@@ -7644,7 +7663,9 @@ loading: {
 type: BooleanConstructor;
 default: boolean;
 };
-}, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, Readonly<ExtractPropTypes<    {
+}, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
+submit: (event: SubmitEvent) => void;
+}, string, Readonly<ExtractPropTypes<    {
 /**
 * Renders the form layout as an HTML `form`
 */
@@ -8034,10 +8055,10 @@ declare enum BentoHeaderVariant {
  *     `
  * }
  */
-export declare const BentoImage: DefineComponent<__VLS_WithDefaults_11<__VLS_TypePropsToRuntimeProps_11<BentoImageProps>, {
+export declare const BentoImage: DefineComponent<__VLS_WithDefaults_12<__VLS_TypePropsToRuntimeProps_12<BentoImageProps>, {
 aspectRatio: any;
 objectFit: any;
-}>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, Readonly<ExtractPropTypes<__VLS_WithDefaults_11<__VLS_TypePropsToRuntimeProps_11<BentoImageProps>, {
+}>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, Readonly<ExtractPropTypes<__VLS_WithDefaults_12<__VLS_TypePropsToRuntimeProps_12<BentoImageProps>, {
 aspectRatio: any;
 objectFit: any;
 }>>>, {
@@ -8152,159 +8173,27 @@ export declare type BentoInputDropdownProps = {
  *          >
  * }
  */
-export declare const BentoInputField: __VLS_WithTemplateSlots_17<DefineComponent<    {
-/**
-* Indicates whether the element is exposed to an accessibility API.
-*/
-ariaHidden: {
-type: BooleanConstructor;
-default: boolean;
-};
-/**
-* @deprecated from version 2.0.0. Use the aria-label attribute instead.
-*/
-/**
-* Text that labels an the input element
-*/
-ariaLabel: {
-type: StringConstructor;
-default: any;
-};
-/**
-* Reduces height of the input
-*/
-condensed: {
-type: BooleanConstructor;
-default: boolean;
-};
-/**
-* Disables the possibility of changing value in the input-field
-*/
-disabled: {
-type: BooleanConstructor;
-default: boolean;
-};
-/**
-* Dropdown props for the small selectable dropdown menu.
-* Properties supported:
-*
-*  - `value`: Selected value of the dropdown
-*  - `items`: List of available items
-*  - `aria-label`: Text that labels the dropdown element
-*
-*/
-dropdown: {
-type: PropType<BentoInputDropdownProps>;
-default: any;
-};
-/**
-* Position of the dropdown before or after input value
-*/
-dropdownPosition: {
-type: PropType<BentoInputFieldElementPosition | `${BentoInputFieldElementPosition}`>;
-default: BentoInputFieldElementPosition;
-validator: (value: BentoInputFieldElementPosition) => boolean;
-};
-/**
-* Adds error validation class for outlining input-field.
-*
-* @deprecated Use "errorMessage" prop instead
-*/
-error: {
-type: BooleanConstructor;
-default: boolean;
-};
-/**
-* Renders input-field with an error state and the error message beneath the input box
-*/
-errorMessage: {
-type: StringConstructor;
-default: any;
-};
-/**
-* Highlights the dropdown is optional.
-*/
-optional: {
-type: BooleanConstructor;
-default: boolean;
-};
-/**
-* Text displayed as the placeholder of the input-field
-*/
-placeholder: {
-type: StringConstructor;
-default: string;
-};
-/**
-* Highlights the dropdown is required.
-*/
-required: {
-type: BooleanConstructor;
-default: boolean;
-};
-/**
-* Setting this property to true will set the input field to read only state.
-*/
-readonly: {
-type: BooleanConstructor;
-default: boolean;
-};
-/**
-* Renders a font numeric style with slashed zeros instead of normal ones.
-*/
-slashedZero: {
-type: BooleanConstructor;
-default: boolean;
-};
-/**
-* Static text that displayed before or after input value
-* Applicable to the Static Value variant
-*/
-staticValue: {
-type: StringConstructor;
-default: string;
-};
-/**
-* Position of Static Value before or after input value
-*/
-staticValuePosition: {
-type: PropType<BentoInputFieldElementPosition | `${BentoInputFieldElementPosition}`>;
-default: BentoInputFieldElementPosition;
-validator: (value: BentoInputFieldElementPosition) => boolean;
-};
-/**
-* Adds a info icon next to the label to display the passed tooltip message.
-*/
-tooltipText: {
-type: StringConstructor;
-default: any;
-};
-/**
-* A string specifying the type of control to render.
-* All `input` types are available but only `search`, `text` and `number` are fully supported.
-*
-* If `type` is `search`, use `bento-search-bar` instead.
-*/
-type: {
-type: PropType<BentoInputFieldType | `${BentoInputFieldType}` | HTMLInputElement["type"]>;
-default: BentoInputFieldType;
-};
-/**
-* Text displayed as the value of the input-field
-*/
-value: {
-type: PropType<BentoInputFieldValue>;
-default: any;
-};
-/**
-* Describes the different variants for the input element
-*/
-variant: {
-type: PropType<BentoInputFieldVariant | `${BentoInputFieldVariant}`>;
-default: BentoInputFieldVariant;
-validator: (value: BentoInputFieldVariant) => boolean;
-};
-}, {
+export declare const BentoInputField: __VLS_WithTemplateSlots_17<DefineComponent<__VLS_WithDefaults_13<__VLS_TypePropsToRuntimeProps_13<BentoInputFieldProps>, {
+ariaHidden: boolean;
+ariaLabel: any;
+condensed: boolean;
+disabled: boolean;
+dropdown: any;
+dropdownPosition: BentoInputFieldElementPosition;
+error: boolean;
+errorMessage: any;
+optional: boolean;
+placeholder: string;
+required: boolean;
+readonly: boolean;
+slashedZero: boolean;
+staticValue: string;
+staticValuePosition: BentoInputFieldElementPosition;
+tooltipText: any;
+type: BentoInputFieldType;
+value: any;
+variant: BentoInputFieldVariant;
+}>, {
 focusInput: () => void;
 focus: () => void;
 }, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
@@ -8325,162 +8214,30 @@ keydown: (event: KeyboardEvent) => void;
 keyup: (event: KeyboardEvent) => void;
 } & {
 input: (inputValue: string) => void;
-}, string, Readonly<ExtractPropTypes<    {
-/**
-* Indicates whether the element is exposed to an accessibility API.
-*/
-ariaHidden: {
-type: BooleanConstructor;
-default: boolean;
-};
-/**
-* @deprecated from version 2.0.0. Use the aria-label attribute instead.
-*/
-/**
-* Text that labels an the input element
-*/
-ariaLabel: {
-type: StringConstructor;
-default: any;
-};
-/**
-* Reduces height of the input
-*/
-condensed: {
-type: BooleanConstructor;
-default: boolean;
-};
-/**
-* Disables the possibility of changing value in the input-field
-*/
-disabled: {
-type: BooleanConstructor;
-default: boolean;
-};
-/**
-* Dropdown props for the small selectable dropdown menu.
-* Properties supported:
-*
-*  - `value`: Selected value of the dropdown
-*  - `items`: List of available items
-*  - `aria-label`: Text that labels the dropdown element
-*
-*/
-dropdown: {
-type: PropType<BentoInputDropdownProps>;
-default: any;
-};
-/**
-* Position of the dropdown before or after input value
-*/
-dropdownPosition: {
-type: PropType<BentoInputFieldElementPosition | `${BentoInputFieldElementPosition}`>;
-default: BentoInputFieldElementPosition;
-validator: (value: BentoInputFieldElementPosition) => boolean;
-};
-/**
-* Adds error validation class for outlining input-field.
-*
-* @deprecated Use "errorMessage" prop instead
-*/
-error: {
-type: BooleanConstructor;
-default: boolean;
-};
-/**
-* Renders input-field with an error state and the error message beneath the input box
-*/
-errorMessage: {
-type: StringConstructor;
-default: any;
-};
-/**
-* Highlights the dropdown is optional.
-*/
-optional: {
-type: BooleanConstructor;
-default: boolean;
-};
-/**
-* Text displayed as the placeholder of the input-field
-*/
-placeholder: {
-type: StringConstructor;
-default: string;
-};
-/**
-* Highlights the dropdown is required.
-*/
-required: {
-type: BooleanConstructor;
-default: boolean;
-};
-/**
-* Setting this property to true will set the input field to read only state.
-*/
-readonly: {
-type: BooleanConstructor;
-default: boolean;
-};
-/**
-* Renders a font numeric style with slashed zeros instead of normal ones.
-*/
-slashedZero: {
-type: BooleanConstructor;
-default: boolean;
-};
-/**
-* Static text that displayed before or after input value
-* Applicable to the Static Value variant
-*/
-staticValue: {
-type: StringConstructor;
-default: string;
-};
-/**
-* Position of Static Value before or after input value
-*/
-staticValuePosition: {
-type: PropType<BentoInputFieldElementPosition | `${BentoInputFieldElementPosition}`>;
-default: BentoInputFieldElementPosition;
-validator: (value: BentoInputFieldElementPosition) => boolean;
-};
-/**
-* Adds a info icon next to the label to display the passed tooltip message.
-*/
-tooltipText: {
-type: StringConstructor;
-default: any;
-};
-/**
-* A string specifying the type of control to render.
-* All `input` types are available but only `search`, `text` and `number` are fully supported.
-*
-* If `type` is `search`, use `bento-search-bar` instead.
-*/
-type: {
-type: PropType<BentoInputFieldType | `${BentoInputFieldType}` | HTMLInputElement["type"]>;
-default: BentoInputFieldType;
-};
-/**
-* Text displayed as the value of the input-field
-*/
-value: {
-type: PropType<BentoInputFieldValue>;
-default: any;
-};
-/**
-* Describes the different variants for the input element
-*/
-variant: {
-type: PropType<BentoInputFieldVariant | `${BentoInputFieldVariant}`>;
-default: BentoInputFieldVariant;
-validator: (value: BentoInputFieldVariant) => boolean;
-};
-}>>, {
+}, string, Readonly<ExtractPropTypes<__VLS_WithDefaults_13<__VLS_TypePropsToRuntimeProps_13<BentoInputFieldProps>, {
+ariaHidden: boolean;
+ariaLabel: any;
+condensed: boolean;
+disabled: boolean;
+dropdown: any;
+dropdownPosition: BentoInputFieldElementPosition;
+error: boolean;
+errorMessage: any;
+optional: boolean;
+placeholder: string;
+required: boolean;
+readonly: boolean;
+slashedZero: boolean;
+staticValue: string;
+staticValuePosition: BentoInputFieldElementPosition;
+tooltipText: any;
+type: BentoInputFieldType;
+value: any;
+variant: BentoInputFieldVariant;
+}>>>, {
 value: BentoInputFieldValue;
-type: string;
-variant: "default" | "payment-method" | "static-value" | "dropdown" | BentoInputFieldVariant;
+type: BentoInputFieldType | `${BentoInputFieldType}` | HTMLInputElement["type"];
+variant: BentoInputFieldVariant | `${BentoInputFieldVariant}`;
 required: boolean;
 condensed: boolean;
 disabled: boolean;
@@ -8494,9 +8251,9 @@ placeholder: string;
 ariaHidden: boolean;
 slashedZero: boolean;
 dropdown: BentoInputDropdownProps;
-dropdownPosition: "start" | "end" | BentoInputFieldElementPosition;
+dropdownPosition: BentoInputFieldElementPosition | `${BentoInputFieldElementPosition}`;
 staticValue: string;
-staticValuePosition: "start" | "end" | BentoInputFieldElementPosition;
+staticValuePosition: BentoInputFieldElementPosition | `${BentoInputFieldElementPosition}`;
 }>, {
     default: (_: {}) => any;
     iconBefore: (_: {}) => any;
@@ -8569,7 +8326,7 @@ export declare enum BentoInputFieldEvent {
  *     `
  * }
  */
-export declare const BentoInputFieldPassword: DefineComponent<__VLS_WithDefaults_12<__VLS_TypePropsToRuntimeProps_12<BentoInputFieldPasswordProps>, {
+export declare const BentoInputFieldPassword: DefineComponent<__VLS_WithDefaults_14<__VLS_TypePropsToRuntimeProps_14<BentoInputFieldPasswordProps>, {
 condensed: boolean;
 disabled: boolean;
 label: any;
@@ -8583,7 +8340,7 @@ withHint: boolean;
 "input:valid": () => void;
 } & {
 input: (value: BentoInputFieldValue) => void;
-}, string, Readonly<ExtractPropTypes<__VLS_WithDefaults_12<__VLS_TypePropsToRuntimeProps_12<BentoInputFieldPasswordProps>, {
+}, string, Readonly<ExtractPropTypes<__VLS_WithDefaults_14<__VLS_TypePropsToRuntimeProps_14<BentoInputFieldPasswordProps>, {
 condensed: boolean;
 disabled: boolean;
 label: any;
@@ -8694,7 +8451,7 @@ export declare interface BentoInputFieldPasswordValidationListItem {
  *     `
  * }
  */
-export declare const BentoInputFieldPhoneNumber: __VLS_WithTemplateSlots_18<DefineComponent<__VLS_WithDefaults_13<__VLS_TypePropsToRuntimeProps_13<BentoInputFieldPhoneNumberProps>, {
+export declare const BentoInputFieldPhoneNumber: __VLS_WithTemplateSlots_18<DefineComponent<__VLS_WithDefaults_15<__VLS_TypePropsToRuntimeProps_15<BentoInputFieldPhoneNumberProps>, {
 countries: () => CountryCode_2[];
 dynamicFiltering: boolean;
 }>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
@@ -8703,7 +8460,7 @@ blur: () => void;
 input: (value: string) => void;
 } & {
 "update:selected-country": (country: CountryCode_2) => void;
-}, string, Readonly<ExtractPropTypes<__VLS_WithDefaults_13<__VLS_TypePropsToRuntimeProps_13<BentoInputFieldPhoneNumberProps>, {
+}, string, Readonly<ExtractPropTypes<__VLS_WithDefaults_15<__VLS_TypePropsToRuntimeProps_15<BentoInputFieldPhoneNumberProps>, {
 countries: () => CountryCode_2[];
 dynamicFiltering: boolean;
 }>>>, {
@@ -8729,7 +8486,98 @@ export declare interface BentoInputFieldPhoneNumberProps extends FormField {
     dynamicFiltering?: boolean;
 }
 
-declare type BentoInputFieldProps = InstanceType<typeof BentoInputField>['$props'];
+export declare interface BentoInputFieldProps {
+    /**
+     * Indicates whether the element is exposed to an accessibility API.
+     */
+    ariaHidden?: boolean;
+    /**
+     * Text that labels an the input element
+     *
+     * @deprecated from version 2.0.0. Use the aria-label attribute instead.
+     */
+    ariaLabel?: string;
+    /**
+     * Reduces height of the input
+     */
+    condensed?: boolean;
+    /**
+     * Disables the possibility of changing value in the input-field
+     */
+    disabled?: boolean;
+    /**
+     * Dropdown props for the small selectable dropdown menu.
+     * Properties supported:
+     *
+     *  - `value`: Selected value of the dropdown
+     *  - `items`: List of available items
+     *  - `aria-label`: Text that labels the dropdown element
+     *
+     */
+    dropdown?: BentoInputDropdownProps;
+    /**
+     * Position of the dropdown before or after input value
+     */
+    dropdownPosition?: BentoInputFieldElementPosition | `${BentoInputFieldElementPosition}`;
+    /**
+     * Adds error validation class for outlining input-field.
+     *
+     * @deprecated Use "errorMessage" prop instead
+     */
+    error?: boolean;
+    /**
+     * Renders input-field with an error state and the error message beneath the input box
+     */
+    errorMessage?: string;
+    /**
+     * Highlights the dropdown is optional.
+     */
+    optional?: boolean;
+    /**
+     * Text displayed as the placeholder of the input-field
+     */
+    placeholder?: string;
+    /**
+     * Highlights the dropdown is required.
+     */
+    required?: boolean;
+    /**
+     * Setting this property to true will set the input field to read only state.
+     */
+    readonly?: boolean;
+    /**
+     * Renders a font numeric style with slashed zeros instead of normal ones.
+     */
+    slashedZero?: boolean;
+    /**
+     * Static text that displayed before or after input value
+     * Applicable to the Static Value variant
+     */
+    staticValue?: string;
+    /**
+     * Position of Static Value before or after input value
+     */
+    staticValuePosition?: BentoInputFieldElementPosition | `${BentoInputFieldElementPosition}`;
+    /**
+     * Adds a info icon next to the label to display the passed tooltip message.
+     */
+    tooltipText?: string;
+    /**
+     * A string specifying the type of control to render.
+     * All `input` types are available but only `search`, `text` and `number` are fully supported.
+     *
+     * If `type` is `search`, use `bento-search-bar` instead.
+     */
+    type?: BentoInputFieldType | `${BentoInputFieldType}` | HTMLInputElement['type'];
+    /**
+     * Text displayed as the value of the input-field
+     */
+    value?: BentoInputFieldValue;
+    /**
+     * Describes the different variants for the input element
+     */
+    variant?: BentoInputFieldVariant | `${BentoInputFieldVariant}`;
+}
 
 export declare enum BentoInputFieldStateClass {
     CONDENSED = "condensed",
@@ -8767,7 +8615,63 @@ export declare type BentoInputFilterInputAndDropdownValues = {
     dropdownValue?: string;
 };
 
-export declare type BentoInputFilterOptions = {};
+export declare interface BentoInputFilterOptions {
+    /**
+     * @deprecated BentoInputFilter "options" no longer supports "dropdown".  Use the "BentoFilterItemType.INPUT_DROPDOWN" instead of "BentoFilterItemType.INPUT"
+     */
+    dropdown?: any;
+    /**
+     * @deprecated BentoInputFilter "options" no longer supports "dropdownPosition".  Use the "BentoFilterItemType.INPUT_DROPDOWN" instead of "BentoFilterItemType.INPUT"
+     */
+    dropdownPosition?: any;
+    /**
+     * Sets a placeholder in the input field
+     */
+    placeholder?: BentoInputFieldProps['placeholder'];
+    /**
+     * @deprecated from version 2.0.0. BentoInputFilter "options" no longer supports "variant".  Use the "BentoFilterItemType.INPUT_DROPDOWN" instead of "BentoFilterItemType.INPUT"
+     */
+    variant?: 'dropdown';
+}
+
+export declare interface BentoInputFilterProps {
+    /**
+     * Default value of the filter to reset to.
+     */
+    defaultValue?: string;
+    /**
+     * Disables the filter from being interacted with.
+     */
+    disabled?: boolean;
+    /**
+     * Filter name/key referencing the actual property name in the data set.
+     * Should be unique per filter bar.
+     */
+    field: string;
+    /**
+     * Label text to be displayed
+     */
+    label: string;
+    /**
+     * Renders the base filter's slot content only - leaving out the button and the popover.
+     * Used for the allFiltersModal component.
+     */
+    onlySlot?: boolean;
+    /**
+     * List of options that are needed to setup the filter
+     * Available options:
+     *   - placeholder: allows to set a placeholder to the search bar
+     *   - dropdown (deprecated): all the dropdown properties that can be set in the inner dropdown of the input field. @see BentoDropdown for more info.
+     *   - dropdownPosition (deprecated): allow the user to set the dropdown on the left or right side. Accepts the `start` or `end` values.
+     *   - variant (deprecated): can be `undefined` or set to `dropdown`. Enables dropdown input variant.
+     */
+    options?: BentoInputFilterOptions;
+    /**
+     * Current value of the filter.
+     * If the options.variant is equal to 'dropdown', the value should be of type `{ inputValue: string | null; dropdownValue?: string }`.
+     */
+    value?: BentoInputFilterValue;
+}
 
 export declare type BentoInputFilterValue = string | null | BentoInputFilterInputAndDropdownValues;
 
@@ -8805,7 +8709,7 @@ export declare type BentoInpuWithDropdowntFilterValue = {
  *     `
  * }
  */
-export declare const BentoInspector: __VLS_WithTemplateSlots_19<DefineComponent<__VLS_WithDefaults_14<__VLS_TypePropsToRuntimeProps_14<{
+export declare const BentoInspector: __VLS_WithTemplateSlots_19<DefineComponent<__VLS_WithDefaults_16<__VLS_TypePropsToRuntimeProps_16<{
 /**
 * ID of the current active inspector page
 */
@@ -8842,7 +8746,7 @@ size: string;
 "update:active-page": (value: string) => void;
 } & {
 expand: () => void;
-}, string, Readonly<ExtractPropTypes<__VLS_WithDefaults_14<__VLS_TypePropsToRuntimeProps_14<{
+}, string, Readonly<ExtractPropTypes<__VLS_WithDefaults_16<__VLS_TypePropsToRuntimeProps_16<{
 /**
 * ID of the current active inspector page
 */
@@ -8932,10 +8836,10 @@ export declare enum BentoKeyboardNavigationKeyDownEvent {
  *     `
  * }
  */
-export declare const BentoLayout: __VLS_WithTemplateSlots_20<DefineComponent<__VLS_WithDefaults_15<__VLS_TypePropsToRuntimeProps_15<BentoLayoutProps>, {
+export declare const BentoLayout: __VLS_WithTemplateSlots_20<DefineComponent<__VLS_WithDefaults_17<__VLS_TypePropsToRuntimeProps_17<BentoLayoutProps>, {
 size: string;
 variant: string;
-}>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, Readonly<ExtractPropTypes<__VLS_WithDefaults_15<__VLS_TypePropsToRuntimeProps_15<BentoLayoutProps>, {
+}>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, Readonly<ExtractPropTypes<__VLS_WithDefaults_17<__VLS_TypePropsToRuntimeProps_17<BentoLayoutProps>, {
 size: string;
 variant: string;
 }>>>, {
@@ -8978,9 +8882,9 @@ export declare interface BentoLayoutProps {
  *     `
  * }
  */
-export declare const BentoLayoutRow: __VLS_WithTemplateSlots_21<DefineComponent<__VLS_WithDefaults_16<__VLS_TypePropsToRuntimeProps_16<BentoLayoutRowProps>, {
+export declare const BentoLayoutRow: __VLS_WithTemplateSlots_21<DefineComponent<__VLS_WithDefaults_18<__VLS_TypePropsToRuntimeProps_18<BentoLayoutRowProps>, {
 columnsLayout: string;
-}>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, Readonly<ExtractPropTypes<__VLS_WithDefaults_16<__VLS_TypePropsToRuntimeProps_16<BentoLayoutRowProps>, {
+}>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, Readonly<ExtractPropTypes<__VLS_WithDefaults_18<__VLS_TypePropsToRuntimeProps_18<BentoLayoutRowProps>, {
 columnsLayout: string;
 }>>>, {
 columnsLayout: BentoLayoutRowColumnLayout;
@@ -9027,12 +8931,12 @@ export declare type BentoLazyLoadType = 'automatic' | 'button' | 'none';
  *     `
  * }
  */
-export declare const BentoLink: __VLS_WithTemplateSlots_22<DefineComponent<__VLS_WithDefaults_17<__VLS_TypePropsToRuntimeProps_17<BentoLinkProps>, {
+export declare const BentoLink: __VLS_WithTemplateSlots_22<DefineComponent<__VLS_WithDefaults_19<__VLS_TypePropsToRuntimeProps_19<BentoLinkProps>, {
 target: any;
 variant: BentoLinkVariant;
 }>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
 click: (clickEvent: MouseEvent) => void;
-}, string, Readonly<ExtractPropTypes<__VLS_WithDefaults_17<__VLS_TypePropsToRuntimeProps_17<BentoLinkProps>, {
+}, string, Readonly<ExtractPropTypes<__VLS_WithDefaults_19<__VLS_TypePropsToRuntimeProps_19<BentoLinkProps>, {
 target: any;
 variant: BentoLinkVariant;
 }>>>, {
@@ -9402,9 +9306,20 @@ teleport: {
 type: BooleanConstructor;
 default: boolean;
 };
+/**
+* Can be used to set the inner teleport component to render the menu's popover in the root `body` DOM node
+* (or `dialog` if popover is inside a dialog).
+*
+* @see {@link OnClickOutsideOptions}
+*/
+closeOnClickOutsideOptions: {
+type: PropType<OnClickOutsideOptions>;
+default: any;
+};
 }, {
 popoverRef: Ref<HTMLElement>;
 menuButtonRef: any;
+menuItemListRef: any;
 menuId: string;
 popoverId: string;
 showMenu: Ref<boolean>;
@@ -9418,13 +9333,13 @@ computedClasses: ComputedRef<    {
 }>;
 isInverseColorSet: Ref<boolean>;
 hasSlot: (name: string) => boolean;
-onKeyDown: () => void;
-onKeyUp: () => void;
-closeMenu: () => void;
+onKeyDown: (event: KeyboardEvent) => void;
+onKeyUp: (event: KeyboardEvent) => void;
+closeMenu: (revertFocus?: boolean) => void;
 menuItemClick: () => void;
 toggleShowMenu: (e: MouseEvent) => void;
 t: (key: "backButton" | "menuButton", values?: default_2.Values) => string;
-}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, (BentoMenuEvent.CLOSE | BentoMenuEvent.OPEN | "menu-item-click")[], string, Readonly<ExtractPropTypes<    {
+}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, (BentoMenuEvent.CLOSE | BentoMenuEvent.OPEN | "menu-item-click" | "click-outside")[], string, Readonly<ExtractPropTypes<    {
 /**
 * Object containing props to change the menu button appearance. Accepts the same props present in BentoButton.
 */
@@ -9487,6 +9402,16 @@ teleport: {
 type: BooleanConstructor;
 default: boolean;
 };
+/**
+* Can be used to set the inner teleport component to render the menu's popover in the root `body` DOM node
+* (or `dialog` if popover is inside a dialog).
+*
+* @see {@link OnClickOutsideOptions}
+*/
+closeOnClickOutsideOptions: {
+type: PropType<OnClickOutsideOptions>;
+default: any;
+};
 }>>, {
 button: BentoMenuButtonProps;
 teleport: boolean;
@@ -9495,6 +9420,7 @@ menuPosition: "top" | "right" | "bottom" | "left" | "auto" | "auto-start" | "aut
 menuFixedPositioning: boolean;
 menuWidth: number;
 revertFocusToButton: boolean;
+closeOnClickOutsideOptions: any;
 }>;
 
 export declare type BentoMenuButtonProps = {
@@ -9520,6 +9446,7 @@ export declare interface BentoMenuItem {
     critical?: boolean;
     indent?: boolean;
     addDivider?: boolean;
+    skipClose?: boolean;
 }
 
 /**
@@ -10522,10 +10449,10 @@ hidePageSize: boolean;
  *     `
  * }
  */
-export declare const BentoPaymentMethod: DefineComponent<__VLS_WithDefaults_18<__VLS_TypePropsToRuntimeProps_18<BentoPaymentMethodProps>, {
+export declare const BentoPaymentMethod: DefineComponent<__VLS_WithDefaults_20<__VLS_TypePropsToRuntimeProps_20<BentoPaymentMethodProps>, {
 type: string;
 small: boolean;
-}>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, Readonly<ExtractPropTypes<__VLS_WithDefaults_18<__VLS_TypePropsToRuntimeProps_18<BentoPaymentMethodProps>, {
+}>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, Readonly<ExtractPropTypes<__VLS_WithDefaults_20<__VLS_TypePropsToRuntimeProps_20<BentoPaymentMethodProps>, {
 type: string;
 small: boolean;
 }>>>, {
@@ -11819,6 +11746,13 @@ withoutSpace: {
 type: BooleanConstructor;
 default: boolean;
 };
+/**
+* Allows content to appear outside of the popover. Used when there are nested popovers.
+*/
+overflowVisible: {
+type: BooleanConstructor;
+default: boolean;
+};
 }, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
 dismiss: () => void;
 } & {
@@ -11988,6 +11922,13 @@ withoutSpace: {
 type: BooleanConstructor;
 default: boolean;
 };
+/**
+* Allows content to appear outside of the popover. Used when there are nested popovers.
+*/
+overflowVisible: {
+type: BooleanConstructor;
+default: boolean;
+};
 }>>, {
 small: boolean;
 title: string;
@@ -12005,6 +11946,7 @@ disableFocusTrap: boolean;
 dismissible: boolean;
 fitContent: boolean;
 withoutSpace: boolean;
+overflowVisible: boolean;
 }>, {
     image: (_: {}) => any;
     headerIcon: (_: {}) => any;
@@ -12053,7 +11995,7 @@ export declare type BentoPopoverPositions = PopperContainerPosition;
  *     `
  * };
  */
-export declare const BentoPromoBanner: __VLS_WithTemplateSlots_28<DefineComponent<__VLS_WithDefaults_19<__VLS_TypePropsToRuntimeProps_19<BentoPromoBannerProps>, {
+export declare const BentoPromoBanner: __VLS_WithTemplateSlots_28<DefineComponent<__VLS_WithDefaults_21<__VLS_TypePropsToRuntimeProps_21<BentoPromoBannerProps>, {
 actions: any;
 color: BentoPromoBannerColor;
 isDismissible: boolean;
@@ -12061,7 +12003,7 @@ dismissButtonText: any;
 layout: BentoPromoBannerLayout;
 }>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
 dismiss: () => void;
-}, string, Readonly<ExtractPropTypes<__VLS_WithDefaults_19<__VLS_TypePropsToRuntimeProps_19<BentoPromoBannerProps>, {
+}, string, Readonly<ExtractPropTypes<__VLS_WithDefaults_21<__VLS_TypePropsToRuntimeProps_21<BentoPromoBannerProps>, {
 actions: any;
 color: BentoPromoBannerColor;
 isDismissible: boolean;
@@ -12646,50 +12588,13 @@ export declare enum BentoRadioGroupVariant {
  *     }
  * }
  */
-export declare const BentoSearchBar: DefineComponent<    {
-/**
-* Text that labels an the search bar input element
-*/
-inputFieldAriaLabel: {
-type: StringConstructor;
-required: true;
-};
-/**
-* Reduces height of the search bar
-*/
-condensed: {
-type: BooleanConstructor;
-default: boolean;
-};
-/**
-* Custom debounce time. Default: 300
-*/
-debounceTime: {
-type: NumberConstructor;
-default: number;
-};
-/**
-* Text displayed as a hint when the field is not empty
-*/
-hint: {
-type: StringConstructor;
-default: string;
-};
-/**
-* Text displayed as the placeholder of the input-field
-*/
-placeholder: {
-type: StringConstructor;
-default: string;
-};
-/**
-* Text displayed as the value being searched
-*/
-value: {
-type: StringConstructor;
-default: any;
-};
-}, {
+export declare const BentoSearchBar: DefineComponent<__VLS_WithDefaults_23<__VLS_TypePropsToRuntimeProps_23<BentoSearchBarProps>, {
+condensed: boolean;
+debounceTime: number;
+hint: string;
+placeholder: string;
+value: any;
+}>, {
 /**
 * Focus on the input field when called.
 */
@@ -12704,50 +12609,13 @@ clear: () => void;
 blur: () => void;
 } & {
 focus: () => void;
-}, string, Readonly<ExtractPropTypes<    {
-/**
-* Text that labels an the search bar input element
-*/
-inputFieldAriaLabel: {
-type: StringConstructor;
-required: true;
-};
-/**
-* Reduces height of the search bar
-*/
-condensed: {
-type: BooleanConstructor;
-default: boolean;
-};
-/**
-* Custom debounce time. Default: 300
-*/
-debounceTime: {
-type: NumberConstructor;
-default: number;
-};
-/**
-* Text displayed as a hint when the field is not empty
-*/
-hint: {
-type: StringConstructor;
-default: string;
-};
-/**
-* Text displayed as the placeholder of the input-field
-*/
-placeholder: {
-type: StringConstructor;
-default: string;
-};
-/**
-* Text displayed as the value being searched
-*/
-value: {
-type: StringConstructor;
-default: any;
-};
-}>>, {
+}, string, Readonly<ExtractPropTypes<__VLS_WithDefaults_23<__VLS_TypePropsToRuntimeProps_23<BentoSearchBarProps>, {
+condensed: boolean;
+debounceTime: number;
+hint: string;
+placeholder: string;
+value: any;
+}>>>, {
 value: string;
 condensed: boolean;
 debounceTime: number;
@@ -12775,6 +12643,33 @@ export declare interface BentoSearchBarItem {
     items?: Array<BentoSearchBarItem>;
 }
 
+export declare interface BentoSearchBarProps {
+    /**
+     * Text that labels an the search bar input element
+     */
+    inputFieldAriaLabel: string;
+    /**
+     * Reduces height of the search bar. Default: false
+     */
+    condensed?: boolean;
+    /**
+     * Custom debounce time. Default: 300
+     */
+    debounceTime?: number;
+    /**
+     * Text displayed as a hint when the field is not empty
+     */
+    hint?: string;
+    /**
+     * Text displayed as the placeholder of the input-field
+     */
+    placeholder?: string;
+    /**
+     * Text displayed as the value being searched
+     */
+    value?: string;
+}
+
 /**
  * Secondary Nav offers users a structured way to access information.
  * It also provides a clear hierarchy for users to understand and navigate through various information.
@@ -12797,7 +12692,7 @@ export declare interface BentoSearchBarItem {
  *     }
  * }
  */
-export declare const BentoSecondaryNav: DefineComponent<__VLS_TypePropsToRuntimeProps_21<{
+export declare const BentoSecondaryNav: DefineComponent<__VLS_TypePropsToRuntimeProps_24<{
 /**
 * 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.
@@ -12810,7 +12705,7 @@ items: BentoSecondaryNavItems;
 value?: string;
 }>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
 change: (category: string) => void;
-}, string, Readonly<ExtractPropTypes<__VLS_TypePropsToRuntimeProps_21<{
+}, string, Readonly<ExtractPropTypes<__VLS_TypePropsToRuntimeProps_24<{
 /**
 * 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.
@@ -12855,7 +12750,7 @@ export declare interface BentoSecondaryNavState {
  *     `
  * }
  */
-export declare const BentoSegmentedControl: DefineComponent<__VLS_WithDefaults_21<__VLS_TypePropsToRuntimeProps_22<BentoSegmentedControlProps>, {
+export declare const BentoSegmentedControl: DefineComponent<__VLS_WithDefaults_24<__VLS_TypePropsToRuntimeProps_25<BentoSegmentedControlProps>, {
 ariaLabel: any;
 fullWidth: boolean;
 wrap: boolean;
@@ -12864,7 +12759,7 @@ modelValue: any;
 "update:model-value": (value: any) => void;
 } & {
 input: (value: BentoSegmentedControlValue) => void;
-}, string, Readonly<ExtractPropTypes<__VLS_WithDefaults_21<__VLS_TypePropsToRuntimeProps_22<BentoSegmentedControlProps>, {
+}, string, Readonly<ExtractPropTypes<__VLS_WithDefaults_24<__VLS_TypePropsToRuntimeProps_25<BentoSegmentedControlProps>, {
 ariaLabel: any;
 fullWidth: boolean;
 wrap: boolean;
@@ -13804,7 +13699,7 @@ destructiveActions: boolean;
  *     `
  * }
  */
-export declare const BentoStatus: __VLS_WithTemplateSlots_35<DefineComponent<__VLS_TypePropsToRuntimeProps_23<BentoStatusProps>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, Readonly<ExtractPropTypes<__VLS_TypePropsToRuntimeProps_23<BentoStatusProps>>>, {}>, {
+export declare const BentoStatus: __VLS_WithTemplateSlots_35<DefineComponent<__VLS_TypePropsToRuntimeProps_26<BentoStatusProps>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, Readonly<ExtractPropTypes<__VLS_TypePropsToRuntimeProps_26<BentoStatusProps>>>, {}>, {
     default: (_: {}) => any;
 }>;
 
@@ -14013,7 +13908,7 @@ export declare enum BentoStepperVariantOption {
  *     `
  * }
  */
-export declare const BentoStructuredList: __VLS_WithTemplateSlots_38<DefineComponent<__VLS_WithDefaults_22<__VLS_TypePropsToRuntimeProps_24<{
+export declare const BentoStructuredList: __VLS_WithTemplateSlots_38<DefineComponent<__VLS_WithDefaults_25<__VLS_TypePropsToRuntimeProps_27<{
 /**
 * Width of the labels container, in pixels. Overrides layout prop.
 */
@@ -14034,7 +13929,7 @@ layout?: BentoStructuredListLayoutOptions;
 }>, {
 labelsWidth: any;
 layout: string;
-}>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, Readonly<ExtractPropTypes<__VLS_WithDefaults_22<__VLS_TypePropsToRuntimeProps_24<{
+}>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, Readonly<ExtractPropTypes<__VLS_WithDefaults_25<__VLS_TypePropsToRuntimeProps_27<{
 /**
 * Width of the labels container, in pixels. Overrides layout prop.
 */
@@ -14085,7 +13980,7 @@ labelsWidth: number;
  *     `
  * }
  */
-export declare const BentoStructuredListItem: __VLS_WithTemplateSlots_39<DefineComponent<__VLS_TypePropsToRuntimeProps_25<{
+export declare const BentoStructuredListItem: __VLS_WithTemplateSlots_39<DefineComponent<__VLS_TypePropsToRuntimeProps_28<{
 /**
 * Label to display for the value
 */
@@ -14110,7 +14005,7 @@ searchTooltip?: string;
 * Truncates the value of the item
 */
 truncate?: boolean;
-}>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, Readonly<ExtractPropTypes<__VLS_TypePropsToRuntimeProps_25<{
+}>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, Readonly<ExtractPropTypes<__VLS_TypePropsToRuntimeProps_28<{
 /**
 * Label to display for the value
 */
@@ -15138,11 +15033,11 @@ declare enum BentoTabsEvent {
     ACTIVE_TAB_INDEX = "update:active-tab-index"
 }
 
-export declare const BentoTag: DefineComponent<__VLS_WithDefaults_20<__VLS_TypePropsToRuntimeProps_20<BentoTagProps>, {
+export declare const BentoTag: DefineComponent<__VLS_WithDefaults_22<__VLS_TypePropsToRuntimeProps_22<BentoTagProps>, {
 label: any;
 truncate: any;
 variant: BentoTagVariant;
-}>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, Readonly<ExtractPropTypes<__VLS_WithDefaults_20<__VLS_TypePropsToRuntimeProps_20<BentoTagProps>, {
+}>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, Readonly<ExtractPropTypes<__VLS_WithDefaults_22<__VLS_TypePropsToRuntimeProps_22<BentoTagProps>, {
 label: any;
 truncate: any;
 variant: BentoTagVariant;
@@ -15425,8 +15320,8 @@ height: string;
 tooltipText: string;
 errorMessage: string;
 ariaLabel: string;
-placeholder: string;
 characterLimit: number;
+placeholder: string;
 clearable: boolean;
 resizable: "none" | "vertical" | "horizontal" | "both" | BentoTextareaResizeOption;
 }>;
@@ -16279,7 +16174,7 @@ export declare interface BentoTutorialStep {
  *     `
  * }
  */
-export declare const BentoTypography: __VLS_WithTemplateSlots_40<DefineComponent<__VLS_WithDefaults_23<__VLS_TypePropsToRuntimeProps_26<{
+export declare const BentoTypography: __VLS_WithTemplateSlots_40<DefineComponent<__VLS_WithDefaults_26<__VLS_TypePropsToRuntimeProps_29<{
 /**
 * Sets the HTML DOM element.
 * @values h1, h2, h3, h4, h5, h6, div, p, span
@@ -16327,7 +16222,7 @@ stronger: boolean;
 strongest: boolean;
 variant: BentoTypographyVariant;
 wide: boolean;
-}>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, Readonly<ExtractPropTypes<__VLS_WithDefaults_23<__VLS_TypePropsToRuntimeProps_26<{
+}>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, Readonly<ExtractPropTypes<__VLS_WithDefaults_26<__VLS_TypePropsToRuntimeProps_29<{
 /**
 * Sets the HTML DOM element.
 * @values h1, h2, h3, h4, h5, h6, div, p, span
@@ -16451,6 +16346,16 @@ declare type CalendarMonthIsDateDisabled = (date: Date) => boolean;
 export { CalendarMonthIsDateDisabled as BentoDatePickerIsDateDisabled }
 export { CalendarMonthIsDateDisabled as BentoDateRangePickerIsDateDisabled }
 
+/**
+ * Private types
+ */
+declare enum CalendarVariant {
+    DAY = "day",
+    MONTH = "month"
+}
+export { CalendarVariant as BentoDatePickerVariant }
+export { CalendarVariant as BentoDateRangePickerVariant }
+
 export declare type Component = object;
 
 export declare enum DateFormat {