@adyen/bento-vue2 1.17.1 → 1.18.0-1

package/README.md

@@ -131,7 +131,7 @@ const app = new Vue({
 
 ```typescript
 import BentoVue from '@adyen/bento-vue3';
-import VueI18n from 'vue-i18n';
+import { createI18n } from 'vue-i18n';
 
 const i18n = createI18n({
     locale: 'en-US',

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

@@ -44,6 +44,7 @@ import {
     BentoLoadingIndicator,
     BentoMenu,
     BentoModal,
+    BentoModalFullscreen,
     BentoPagination,
     BentoPaymentMethod,
     BentoPopover,
@@ -124,6 +125,7 @@ declare module 'vue' {
         BentoLoadingIndicator: typeof BentoLoadingIndicator;
         BentoMenu: typeof BentoMenu;
         BentoModal: typeof BentoModal;
+        BentoModalFullscreen: typeof BentoModalFullscreen;
         BentoPagination: typeof BentoPagination;
         BentoPaymentMethod: typeof BentoPaymentMethod;
         BentoPopover: typeof BentoPopover;

package/dist/@types/packages/vue2/src/components/data-grid/components/data-grid-cell/data-grid-cell.types.d.ts

@@ -0,0 +1,34 @@
+import type { BentoColumn } from '../../data-grid.types';
+export declare enum DataGridCellPropClass {
+    PADDING_LEFT_UNSET = "padding-left-unset",
+    PADDING_RIGHT_UNSET = "padding-right-unset",
+    NUMERIC = "numeric",
+    CONDENSED = "condensed",
+    FROZEN = "frozen",
+    OVERFLOW_ELLIPSIS = "ellipsis",
+    IS_COLUMN_REORDERING = "is-column-re-ordering",
+    IS_COLUMN_REORDERING_TARGET_LEFT = "is-column-re-order-target-left",
+    IS_COLUMN_REORDERING_TARGET_RIGHT = "is-column-re-order-target-right"
+}
+export interface DataGridCellDragEvents {
+    dragenter?: (e: DragEvent) => void;
+    drop?: () => void;
+    dragover?: (e: DragEvent) => void;
+}
+export type DataGridCellDragEventsForColumn = (column: BentoColumn) => {
+    dragenter?: (e: DragEvent) => void;
+    drop?: () => void;
+    dragover?: (e: DragEvent) => void;
+};
+export interface DataGridCellColumnSet {
+    columnSet: BentoColumn[];
+    id: string;
+    isFrozenColumns?: boolean;
+}
+export interface DataGridCellEvents extends DataGridCellDragEvents {
+    keyup?: (event: KeyboardEvent) => void;
+    keydown?: (event: KeyboardEvent) => void;
+    mouseenter?: () => void;
+    mouseleave?: () => void;
+}
+export type DataGridCellEventsForColumn = (column: BentoColumn) => DataGridCellEvents;

package/dist/@types/packages/vue2/src/components/data-grid/components/data-grid-cell/data-grid-cell.vue.d.ts

@@ -0,0 +1,133 @@
+import { PropType } from 'vue';
+import { BentoColumn, BentoDatagridDataItem, BentoDatagridDataItemId, BentoDatagridGetDataItemIdFn, BentoDatagridIsDataItemDisabledFn } from "../../data-grid.types";
+import { DataGridCellColumnSet, DataGridCellDragEventsForColumn } from './data-grid-cell.types';
+import type { BentoDatagridDraggingColumnState } from '../data-grid-columns/data-grid-columns.types';
+declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
+    draggingEventsForRowCell: {
+        type: PropType<DataGridCellDragEventsForColumn>;
+        required: true;
+    };
+    columnSets: {
+        type: PropType<DataGridCellColumnSet[]>;
+        required: true;
+    };
+    column: {
+        type: PropType<BentoColumn>;
+        required: true;
+    };
+    colIndex: {
+        type: NumberConstructor;
+        required: true;
+    };
+    columnSetIndex: {
+        type: NumberConstructor;
+        required: true;
+    };
+    condensed: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    draggingColumns: {
+        type: PropType<BentoDatagridDraggingColumnState>;
+        default: any;
+    };
+    getDataItemId: {
+        type: PropType<BentoDatagridGetDataItemIdFn>;
+        default: (item: BentoDatagridDataItem) => BentoDatagridDataItemId;
+    };
+    isDataItemDisabled: {
+        type: PropType<BentoDatagridIsDataItemDisabledFn>;
+        default: () => false;
+    };
+    isMeasuringColumnWidths: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    rowData: {
+        type: PropType<BentoDatagridDataItem>;
+        required: true;
+    };
+    rowIndex: {
+        type: NumberConstructor;
+        required: true;
+    };
+    selectedItems: {
+        type: PropType<BentoDatagridDataItemId[]>;
+        required: true;
+    };
+}, {
+    gridcellRef: import("vue").Ref<HTMLDivElement>;
+}, {}, {}, {}, import("vue/types/v3-component-options").ComponentOptionsMixin, import("vue/types/v3-component-options").ComponentOptionsMixin, {
+    "on-frozen-columns-key-press": (event: Event) => void;
+} & {
+    "select-row": (value: BentoDatagridDataItemId[]) => void;
+} & {
+    "register-row-cell-element": (el: Element, field: string, rowIndex: number) => void;
+}, string, Readonly<import("vue").ExtractPropTypes<{
+    draggingEventsForRowCell: {
+        type: PropType<DataGridCellDragEventsForColumn>;
+        required: true;
+    };
+    columnSets: {
+        type: PropType<DataGridCellColumnSet[]>;
+        required: true;
+    };
+    column: {
+        type: PropType<BentoColumn>;
+        required: true;
+    };
+    colIndex: {
+        type: NumberConstructor;
+        required: true;
+    };
+    columnSetIndex: {
+        type: NumberConstructor;
+        required: true;
+    };
+    condensed: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    draggingColumns: {
+        type: PropType<BentoDatagridDraggingColumnState>;
+        default: any;
+    };
+    getDataItemId: {
+        type: PropType<BentoDatagridGetDataItemIdFn>;
+        default: (item: BentoDatagridDataItem) => BentoDatagridDataItemId;
+    };
+    isDataItemDisabled: {
+        type: PropType<BentoDatagridIsDataItemDisabledFn>;
+        default: () => false;
+    };
+    isMeasuringColumnWidths: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    rowData: {
+        type: PropType<BentoDatagridDataItem>;
+        required: true;
+    };
+    rowIndex: {
+        type: NumberConstructor;
+        required: true;
+    };
+    selectedItems: {
+        type: PropType<BentoDatagridDataItemId[]>;
+        required: true;
+    };
+}>>, {
+    condensed: boolean;
+    draggingColumns: any;
+    getDataItemId: BentoDatagridGetDataItemIdFn;
+    isDataItemDisabled: BentoDatagridIsDataItemDisabledFn;
+    isMeasuringColumnWidths: boolean;
+}>, Record<string, (_: {
+    item: BentoDatagridDataItem;
+}) => any>>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/@types/packages/vue2/src/components/data-grid/components/data-grid-columns/data-grid-columns.vue.d.ts

@@ -1,8 +1,7 @@
 import { PropType } from 'vue';
-import { BentoColumn, BentoDatagridAllItemsSelectedState, BentoDatagridAriaSortValue, BentoDatagridSortByColumn, BentoDatagridSortDirection } from '../../data-grid.types';
-import { BentoDatagridDraggingColumnState, DatagridColumnsEvent } from './data-grid-columns-types';
-import type { BentoMenuItem } from "../../../menu/components";
-declare const _default: import("vue").DefineComponent<{
+import { BentoColumn, BentoColumnWidthOverridesLookup, BentoDatagridAllItemsSelectedState, BentoDatagridSortByColumn } from '../../data-grid.types';
+import { BentoDatagridDraggingColumnState } from './data-grid-columns.types';
+declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     columns: {
         type: PropType<BentoColumn[]>;
         required: true;
@@ -31,6 +30,10 @@ declare const _default: import("vue").DefineComponent<{
         type: BooleanConstructor;
         default: boolean;
     };
+    isMeasuringColunWidths: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
     isOnlyOneVisibleColumn: {
         type: BooleanConstructor;
         default: boolean;
@@ -59,72 +62,36 @@ declare const _default: import("vue").DefineComponent<{
         type: BooleanConstructor;
         default: boolean;
     };
-}, {
-    DATAGRID_SELECT_FIELD_NAME: string;
-    conditionalColumnClasses: (column: BentoColumn) => {
-        'b-data-grid-columns__column--sortable': boolean;
-        'b-data-grid-columns__column--padding-left-unset': boolean;
-        'b-data-grid-columns__column--padding-right-unset': boolean;
-        'b-data-grid-columns__column--numeric': boolean;
-        'b-data-grid-columns__column--frozen': boolean;
-        'b-data-grid-columns__column--is-re-ordering': boolean;
-        'b-data-grid-columns__column--is-re-ordering-target-left': any;
-        'b-data-grid-columns__column--is-re-ordering-target-right': boolean;
-    };
-    conditionalColumnSeparatorClasses: import("vue").ComputedRef<{
-        'b-data-grid-columns__column-separator-container--is-resizeable': boolean;
-    }>;
-    conditionalColumnsClasses: import("vue").ComputedRef<{
-        'b-data-grid-columns--frozen': boolean;
-        'b-data-grid-columns--frozen-separator': boolean;
-        'b-data-grid-columns--overflow-shadow-left': boolean;
-        'b-data-grid-columns--unfrozen'?: undefined;
-        'b-data-grid-columns--config-settings-margin'?: undefined;
-    } | {
-        'b-data-grid-columns--unfrozen': boolean;
-        'b-data-grid-columns--config-settings-margin': boolean;
-        'b-data-grid-columns--frozen'?: undefined;
-        'b-data-grid-columns--frozen-separator'?: undefined;
-        'b-data-grid-columns--overflow-shadow-left'?: undefined;
-    }>;
-    conditionalColumnHeaderClasses: import("vue").ComputedRef<{
-        'b-data-grid-columns__column-header--truncated': boolean;
-    }>;
-    isSelectColumn: (column: BentoColumn) => boolean;
-    onAllRowSelect: (areAllItemsSelected: boolean) => void;
-    selectAllMenu: import("vue").ComputedRef<{
-        text: string;
-        handler: () => void;
-    }[]>;
-    conditionalSortDirectionClasses: (field: string, direction: BentoDatagridSortDirection) => {
-        'b-data-grid-columns__column-sort-icon--sorted': boolean;
-    };
-    sortByColumnField: (field: string) => void;
-    getSortingColumnDirection: (column: BentoColumn) => BentoDatagridAriaSortValue;
-    startResize: (hasResizableColumns: boolean, field: string, event: MouseEvent) => void;
-    isResizing: import("vue").Ref<boolean>;
-    dataGridColumnEvents: (column: BentoColumn) => {
-        [eventName: string]: (e: Event) => void;
-    };
-    draggingEventsForColumn: import("vue").ComputedRef<(column: BentoColumn) => {
-        dragstart?: undefined;
-        dragover?: undefined;
-        dragenter?: undefined;
-        drop?: undefined;
-        dragend?: undefined;
-    } | {
-        dragstart: (e: DragEvent & Event) => void;
-        dragover: (e: DragEvent) => void;
-        dragenter: (e: DragEvent) => void;
-        drop: () => void;
-        dragend: () => void;
-    }>;
-    contextualMenuData: import("vue").ComputedRef<(col: BentoColumn) => BentoMenuItem[]>;
-    computeMenuPosition: (hasFirstColumnPanelRightAligned: any, index: any) => import("../../../popper-container").PopperContainerPositionExtended.BOTTOM_START | import("../../../popper-container").PopperContainerPositionExtended.BOTTOM_END;
-    BentoDatagridSortDirection: typeof BentoDatagridSortDirection;
-    DatagridColumnsEvent: typeof DatagridColumnsEvent;
-    t: (key: "selectAll" | "freezeColumn" | "hideColumn" | "moveColumnLeft" | "moveColumnRight" | "selectPage" | "selectionMenu" | "showColumn" | "unfreezeColumn", values?: import("vue-i18n").default.Values) => string;
-}, {}, {}, {}, import("vue/types/v3-component-options").ComponentOptionsMixin, import("vue/types/v3-component-options").ComponentOptionsMixin, DatagridColumnsEvent[], string, Readonly<import("vue").ExtractPropTypes<{
+}, {}, {}, {}, {}, import("vue/types/v3-component-options").ComponentOptionsMixin, import("vue/types/v3-component-options").ComponentOptionsMixin, {
+    "column-resize": (column: {
+        field: string;
+        width: number;
+    }) => void;
+} & {
+    "column-resizing": (value: BentoColumnWidthOverridesLookup) => void;
+} & {
+    sort: (updatedSortBy: BentoDatagridSortByColumn[]) => void;
+} & {
+    "select-all-rows": (areAllItemsSelected: boolean) => void;
+} & {
+    "select-all-across-pages": () => void;
+} & {
+    "column-dragstart": (column: BentoColumn, event: DragEvent & Event) => void;
+} & {
+    "column-dragenter": (column: BentoColumn, event: DragEvent & Event) => void;
+} & {
+    "column-drop": (column: BentoColumn) => void;
+} & {
+    "column-dragend": () => void;
+} & {
+    "column-move": (movingColumn: BentoColumn, offset: number) => void;
+} & {
+    "column-update": (column: BentoColumn) => void;
+} & {
+    "column-menu-open": () => void;
+} & {
+    "column-menu-close": () => void;
+}, string, Readonly<import("vue").ExtractPropTypes<{
     columns: {
         type: PropType<BentoColumn[]>;
         required: true;
@@ -153,6 +120,10 @@ declare const _default: import("vue").DefineComponent<{
         type: BooleanConstructor;
         default: boolean;
     };
+    isMeasuringColunWidths: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
     isOnlyOneVisibleColumn: {
         type: BooleanConstructor;
         default: boolean;
@@ -189,11 +160,19 @@ declare const _default: import("vue").DefineComponent<{
     hasColumnPanel: boolean;
     hasFirstColumnPanelRightAligned: boolean;
     hasLeftOverflow: boolean;
+    isMeasuringColunWidths: boolean;
     isOnlyOneVisibleColumn: boolean;
     showFrozenColumnsSeparator: boolean;
     allItemsSelectedState: BentoDatagridAllItemsSelectedState;
     selectableAcrossPages: boolean;
     sortBy: BentoDatagridSortByColumn[];
     truncateColumnHeaders: boolean;
-}>;
+}>, Record<string, (_: {
+    column: BentoColumn;
+}) => any>>;
 export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/@types/packages/vue2/src/components/data-grid/components/index.d.ts

@@ -1,4 +1,5 @@
 export { default as DataGridColumns } from './data-grid-columns/data-grid-columns.vue';
 export { default as BentoDataGridConfigSettings } from './data-grid-config-settings/data-grid-config-settings.vue';
 export { default as DataGridLazyLoad } from './data-grid-lazy-load/data-grid-lazy-load.vue';
+export { default as DataGridCell } from './data-grid-cell/data-grid-cell.vue';
 export { default as DataGridCellActions } from './data-grid-cell-actions/data-grid-cell-actions.vue';

package/dist/@types/packages/vue2/src/components/data-grid/composables/use-resizer.d.ts

@@ -1,6 +1,6 @@
 import { Ref } from 'vue';
 import { BentoColumn, BentoColumnWidthOverridesLookup } from '../data-grid.types';
-import { DatagridColumnsEvent } from '../components/data-grid-columns/data-grid-columns-types';
+import { DatagridColumnsEvent } from '../components/data-grid-columns/data-grid-columns.types';
 export declare const useResizer: (columns: Ref<BentoColumn[]>, emit: (event: DatagridColumnsEvent, ...args: unknown[]) => void) => {
     resizeData: Ref<BentoColumnWidthOverridesLookup>;
     allColumnRefs: import("vue").ToRefs<{}>;

package/dist/@types/packages/vue2/src/components/data-grid/composables/use-sorter.d.ts

@@ -1,6 +1,6 @@
 import { Ref } from 'vue';
 import { BentoColumn, BentoDatagridSortByColumn, BentoDatagridSortDirection } from '../data-grid.types';
-import { DatagridColumnsEvent } from '../components/data-grid-columns/data-grid-columns-types';
+import { DatagridColumnsEvent } from '../components/data-grid-columns/data-grid-columns.types';
 export declare const useSorter: (sortBy: Ref<BentoDatagridSortByColumn[]>, columns: Ref<BentoColumn[]>, emit: (event: DatagridColumnsEvent, updatedSortBy: BentoDatagridSortByColumn[]) => void) => {
     conditionalSortDirectionClasses: (field: string, direction: BentoDatagridSortDirection) => {
         'b-data-grid-columns__column-sort-icon--sorted': boolean;

package/dist/@types/packages/vue2/src/components/data-grid/data-grid.vue.d.ts

@@ -514,14 +514,14 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     selectableAcrossPages: boolean;
     sortBy: BentoDatagridSortByColumn[];
     truncateColumnHeaders: boolean;
+    getDataItemId: BentoDatagridGetDataItemIdFn;
+    isDataItemDisabled: BentoDatagridIsDataItemDisabledFn;
     filterValues: import("../filter-bar").BentoFilterValues;
     allowRowClicks: boolean;
     allowColumnDragAndDrop: boolean;
     bulkActions: BentoButtonActionsList;
     columnPanel: boolean;
     filterSearchTerm: string;
-    getDataItemId: BentoDatagridGetDataItemIdFn;
-    isDataItemDisabled: BentoDatagridIsDataItemDisabledFn;
     pagination: any;
     stickyPagination: boolean;
     stickyFilters: boolean;
@@ -529,9 +529,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     selection: BentoDatagridDataItemId[];
     highlightedRows: BentoDatagridDataItemId[];
     tabTitle: string;
-}>, Record<string, (_: any) => any> & Record<string, (_: {
-    item: BentoDatagridDataItem;
-}) => any> & {
+}>, Record<string, (_: any) => any> & Record<string, (_: any) => any> & {
     header: (_: {}) => any;
     footer: (_: {}) => any;
 }>;

package/dist/@types/packages/vue2/src/components/date-range-picker/components/date-range-picker-calendar/date-range-picker-calendar.vue.d.ts

@@ -1,8 +1,8 @@
 import { PropType } from 'vue';
-import { CalendarRangeDateValue } from "../../../internal";
+import { CalendarGranularityType } from "../../../internal";
 import { type BentoSegmentedControlItem } from "../../../segmented-control";
 import { DateRangePickerCalendarEvent, DateRangePickerCalendarFormData, DateRangePickerCalendarRangeSelectorItems } from './date-range-picker-calendar.types';
-import type { BentoDateRangePickerGranularityConfig } from '../../date-range-picker.types';
+import type { BentoDateRangePickerGranularityConfig, BentoDateRangePickerValue } from '../../date-range-picker.types';
 declare const _default: import("vue").DefineComponent<{
     allowTimeInput: {
         type: BooleanConstructor;
@@ -23,7 +23,7 @@ declare const _default: import("vue").DefineComponent<{
         validator: (value: import("../../../internal").CalendarFirstDayOfWeek) => boolean;
     };
     granularities: {
-        type: PropType<BentoDateRangePickerGranularityConfig<import("../../../internal").CalendarGranularityType>[]>;
+        type: PropType<BentoDateRangePickerGranularityConfig<CalendarGranularityType>[]>;
         default: any;
     };
     isDateDisabled: {
@@ -53,12 +53,12 @@ declare const _default: import("vue").DefineComponent<{
         default: any;
     };
     value: {
-        type: PropType<CalendarRangeDateValue>;
+        type: PropType<BentoDateRangePickerValue>;
         default: any;
     };
 }, {
     internalRangeDate: {
-        granularity?: import("../../../internal").CalendarGranularityType;
+        granularity?: CalendarGranularityType;
         startDate: {
             toString: () => string;
             toDateString: () => string;
@@ -197,7 +197,7 @@ declare const _default: import("vue").DefineComponent<{
     endDateError: import("vue").Ref<boolean>;
     endTimeError: import("vue").Ref<boolean>;
     granularityItems: import("vue").ComputedRef<BentoSegmentedControlItem[]>;
-    selectedGranularity: import("vue").ComputedRef<BentoDateRangePickerGranularityConfig<import("../../../internal").CalendarGranularityType>>;
+    selectedGranularity: import("vue").ComputedRef<BentoDateRangePickerGranularityConfig<CalendarGranularityType>>;
     computedMinMax: import("vue").ComputedRef<{
         min: Date;
         max: Date;
@@ -214,11 +214,12 @@ declare const _default: import("vue").DefineComponent<{
     }>;
     hasSlot: (name: string) => boolean;
     t: (key: "daily" | "weekly" | "monthly" | "customRange" | "dateFrom" | "dateTo" | "lastMonth" | "lastSevenDays" | "lastThreeMonths" | "timeFrom" | "timeTo", values?: import("vue-i18n").default.Values) => string;
-    onDateInput: (selectedRange: CalendarRangeDateValue) => void;
+    onDateInput: (selectedRange: BentoDateRangePickerValue) => void;
     onDateInputKeyDown: (event: KeyboardEvent) => void;
     onEndDateInput: (endDateText: string) => void;
     onEndDateSelected: (newEndDate: Date) => void;
     onEndTimeInput: (endDateText: string) => void;
+    onGranularityInput: (value: CalendarGranularityType) => void;
     onRangeSelectorInput: (newCustomRangeValue: string) => void;
     onStartDateInput: (startDateText: string) => void;
     onStartDateSelected: (newStartDate: Date) => void;
@@ -244,7 +245,7 @@ declare const _default: import("vue").DefineComponent<{
         validator: (value: import("../../../internal").CalendarFirstDayOfWeek) => boolean;
     };
     granularities: {
-        type: PropType<BentoDateRangePickerGranularityConfig<import("../../../internal").CalendarGranularityType>[]>;
+        type: PropType<BentoDateRangePickerGranularityConfig<CalendarGranularityType>[]>;
         default: any;
     };
     isDateDisabled: {
@@ -274,11 +275,11 @@ declare const _default: import("vue").DefineComponent<{
         default: any;
     };
     value: {
-        type: PropType<CalendarRangeDateValue>;
+        type: PropType<BentoDateRangePickerValue>;
         default: any;
     };
 }>>, {
-    value: CalendarRangeDateValue;
+    value: BentoDateRangePickerValue;
     isDateDisabled: import("../../../internal").CalendarIsDateDisabled;
     firstDayOfWeek: import("../../../internal").CalendarFirstDayOfWeek;
     min: Date;
@@ -287,7 +288,7 @@ declare const _default: import("vue").DefineComponent<{
     numberOfMonths: number;
     allowTimeInput: boolean;
     dateFormData: DateRangePickerCalendarFormData;
-    granularities: BentoDateRangePickerGranularityConfig<import("../../../internal").CalendarGranularityType>[];
+    granularities: BentoDateRangePickerGranularityConfig<CalendarGranularityType>[];
     quickSelectRanges: DateRangePickerCalendarRangeSelectorItems;
 }>;
 export default _default;

package/dist/@types/packages/vue2/src/components/{internal/calendar → date-range-picker}/composables/use-granularity-memory.types.d.ts

@@ -1,4 +1,4 @@
-import type { CalendarGranularityType } from '../calendar.types';
+import type { CalendarGranularityType } from '../../internal/calendar/calendar.types';
 export type UseGranularityMemory = () => {
     savedRanges: {
         daily: {
@@ -18,5 +18,5 @@ export type UseGranularityMemory = () => {
         startDate: Date;
         endDate: Date;
     }) => void;
-    resetSavedRange: (type: CalendarGranularityType) => void;
+    resetSavedRanges: () => void;
 };

package/dist/@types/packages/vue2/src/components/filter-bar/components/all-filters-modal/all-filters-modal.vue.d.ts

@@ -371,6 +371,19 @@ declare const _default: import("vue").DefineComponent<{
                 label: string;
                 value: string | boolean;
             };
+        } | {
+            dropdown: {
+                items: {
+                    data?: unknown;
+                    description?: string;
+                    value: import("../../../..").BentoListboxValue;
+                    items?: any[];
+                    label: string;
+                }[];
+                value: import("../../../..").BentoListboxValue | import("../../../..").BentoListboxValue[];
+            };
+            dropdownPosition?: "end" | "start" | import("../../../input-field").BentoInputFieldElementPosition;
+            variant: "default" | "payment-method" | "static-value" | "dropdown" | import("../../../input-field").BentoInputFieldVariant;
         } | {
             firstDayOfWeek?: import("../../../date-range-picker").BentoDateRangePickerFirstDayOfWeek;
             isDateDisabled?: import("../../../date-range-picker").BentoDateRangePickerIsDateDisabled;
@@ -776,7 +789,7 @@ declare const _default: import("vue").DefineComponent<{
                 };
             }[];
         };
-        defaultValue?: import("../../../..").BentoListboxValue | {
+        defaultValue?: string | number | {
             toString: () => string;
             toDateString: () => string;
             toTimeString: () => string;
@@ -969,9 +982,12 @@ declare const _default: import("vue").DefineComponent<{
                 };
             };
             granularity?: import("../../../internal").CalendarGranularityType;
-        } | import("../../../..").BentoListboxValue[];
+        } | import("../../../..").BentoListboxValue[] | {
+            inputValue: string;
+            dropdownValue?: string;
+        };
         visible?: boolean;
-        value?: import("../../../..").BentoListboxValue | {
+        value?: string | number | {
             toString: () => string;
             toDateString: () => string;
             toTimeString: () => string;
@@ -1164,7 +1180,10 @@ declare const _default: import("vue").DefineComponent<{
                 };
             };
             granularity?: import("../../../internal").CalendarGranularityType;
-        } | import("../../../..").BentoListboxValue[];
+        } | import("../../../..").BentoListboxValue[] | {
+            inputValue: string;
+            dropdownValue?: string;
+        };
         field: string;
     }>;
     selectedFilterRef: any;
@@ -1513,6 +1532,19 @@ declare const _default: import("vue").DefineComponent<{
                     label: string;
                     value: string | boolean;
                 };
+            } | {
+                dropdown: {
+                    items: {
+                        data?: unknown;
+                        description?: string;
+                        value: import("../../../..").BentoListboxValue;
+                        items?: any[];
+                        label: string;
+                    }[];
+                    value: import("../../../..").BentoListboxValue | import("../../../..").BentoListboxValue[];
+                };
+                dropdownPosition?: "end" | "start" | import("../../../input-field").BentoInputFieldElementPosition;
+                variant: "default" | "payment-method" | "static-value" | "dropdown" | import("../../../input-field").BentoInputFieldVariant;
             } | {
                 firstDayOfWeek?: import("../../../date-range-picker").BentoDateRangePickerFirstDayOfWeek;
                 isDateDisabled?: import("../../../date-range-picker").BentoDateRangePickerIsDateDisabled;
@@ -1918,7 +1950,7 @@ declare const _default: import("vue").DefineComponent<{
                     };
                 }[];
             };
-            defaultValue?: import("../../../..").BentoListboxValue | {
+            defaultValue?: string | number | {
                 toString: () => string;
                 toDateString: () => string;
                 toTimeString: () => string;
@@ -2111,9 +2143,12 @@ declare const _default: import("vue").DefineComponent<{
                     };
                 };
                 granularity?: import("../../../internal").CalendarGranularityType;
-            } | import("../../../..").BentoListboxValue[];
+            } | import("../../../..").BentoListboxValue[] | {
+                inputValue: string;
+                dropdownValue?: string;
+            };
             visible?: boolean;
-            value?: import("../../../..").BentoListboxValue | {
+            value?: string | number | {
                 toString: () => string;
                 toDateString: () => string;
                 toTimeString: () => string;
@@ -2306,7 +2341,10 @@ declare const _default: import("vue").DefineComponent<{
                     };
                 };
                 granularity?: import("../../../internal").CalendarGranularityType;
-            } | import("../../../..").BentoListboxValue[];
+            } | import("../../../..").BentoListboxValue[] | {
+                inputValue: string;
+                dropdownValue?: string;
+            };
             field: string;
         }[];
     };

package/dist/@types/packages/vue2/src/components/filter-bar/components/input-filter/input-filter.keys.d.ts

@@ -0,0 +1 @@
+export declare const INPUT_FILTER_POPOVER_INJECTION_KEY: unique symbol;