@adyen/bento-vue3 0.10.1 → 1.0.0-rc-2

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

@@ -22,6 +22,7 @@ declare const _default: import("vue").DefineComponent<{
     }>;
     computedRole: import("vue").ComputedRef<"alert" | "status">;
     onCloseButtonClick: () => void;
+    hasSlot: (name: string) => boolean;
     BentoButtonVariant: typeof BentoButtonVariant;
     BentoAlertSeverityOption: typeof BentoAlertSeverityOption;
     BentoTypographyVariant: typeof BentoTypographyVariant;

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

@@ -5,7 +5,6 @@ export declare enum BentoButtonVariant {
 }
 export declare enum BentoButtonPropClass {
     CONDENSED = "condensed",
-    GROUPED = "grouped",
     DESTRUCTIVE = "critical",
     ICON_ONLY = "icon-only"
 }

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

@@ -1,5 +1,4 @@
 export { default as BentoButton } from './button.vue';
 export * from './button.types';
-export { default as BentoButtonGroup } from './components/button-group.vue';
 export * from './components/button-actions';
 export * from './components/loading-button';

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

@@ -55,10 +55,14 @@ declare const _default: import("vue").DefineComponent<{
         'b-card__actions--without-content': boolean;
         'b-card__actions--without-content-and-with-header': boolean;
     }>;
+    cardHeaderTitleConditionalClasses: import("vue").ComputedRef<{
+        'b-card__title--truncated': boolean;
+    }>;
     showCardBody: import("vue").ComputedRef<boolean>;
     showContent: import("vue").Ref<boolean>;
     tabIndex: import("vue").ComputedRef<-1 | 0>;
     showHeader: import("vue").ComputedRef<boolean>;
+    showTitleWrapper: import("vue").ComputedRef<boolean>;
     typography: import("vue").ComputedRef<{
         el: BentoTypographyElement;
         variant: BentoTypographyVariant;
@@ -66,12 +70,13 @@ declare const _default: import("vue").DefineComponent<{
         strongest: boolean;
         wide: boolean;
     }>;
+    hasSlot: (name: string) => boolean;
     onClick: () => void;
+    t: any;
     toggleExpansion: () => void;
-    hasSlot: (name: string) => boolean;
     BentoTypographyVariant: typeof BentoTypographyVariant;
     BentoTypographyElement: typeof BentoTypographyElement;
-}, {}, {}, {}, import("vue/types/v3-component-options.js").ComponentOptionsMixin, import("vue/types/v3-component-options.js").ComponentOptionsMixin, ("click" | "expanded")[], string, Readonly<import("vue").ExtractPropTypes<{
+}, {}, {}, {}, import("vue/types/v3-component-options").ComponentOptionsMixin, import("vue/types/v3-component-options").ComponentOptionsMixin, ("click" | "expanded")[], string, Readonly<import("vue").ExtractPropTypes<{
     background: {
         type: PropType<BentoCardBackground>;
         default: BentoCardBackground;

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

@@ -5,3 +5,6 @@ export declare enum BentoCheckboxState {
     DISABLED = "disabled",
     ERROR = "error"
 }
+export declare enum BentoCheckboxEvent {
+    UPDATE = "update:modelValue"
+}

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

@@ -1,13 +1,14 @@
 import { PropType } from 'vue';
-import { BentoCheckboxType } from './checkbox.types';
+import { BentoCheckboxEvent, BentoCheckboxType } from './checkbox.types';
 import { BentoTypographyElement, BentoTypographyVariant } from '@/components/typography';
+import { BentoCheckboxGroupItems } from './components/checkbox-group/checkbox-group.types';
 declare const _default: import("vue").DefineComponent<{
     value: {
         type: (StringConstructor | NumberConstructor)[];
         default: any;
     };
     modelValue: {
-        type: PropType<BentoCheckboxType>;
+        type: PropType<BentoCheckboxType | BentoCheckboxGroupItems>;
         default: boolean;
     };
     disabled: {
@@ -44,13 +45,13 @@ declare const _default: import("vue").DefineComponent<{
     BentoTypographyElement: typeof BentoTypographyElement;
     BentoTypographyVariant: typeof BentoTypographyVariant;
     onChange: (event: Event) => void;
-}, {}, {}, {}, import("vue/types/v3-component-options").ComponentOptionsMixin, import("vue/types/v3-component-options").ComponentOptionsMixin, "input"[], string, Readonly<import("vue").ExtractPropTypes<{
+}, {}, {}, {}, import("vue/types/v3-component-options").ComponentOptionsMixin, import("vue/types/v3-component-options").ComponentOptionsMixin, BentoCheckboxEvent[], string, Readonly<import("vue").ExtractPropTypes<{
     value: {
         type: (StringConstructor | NumberConstructor)[];
         default: any;
     };
     modelValue: {
-        type: PropType<BentoCheckboxType>;
+        type: PropType<BentoCheckboxType | BentoCheckboxGroupItems>;
         default: boolean;
     };
     disabled: {
@@ -73,7 +74,7 @@ declare const _default: import("vue").DefineComponent<{
     value: string | number;
     disabled: boolean;
     ariaLabel: string;
-    modelValue: BentoCheckboxType;
+    modelValue: BentoCheckboxType | BentoCheckboxGroupItems;
     hasError: boolean;
     indeterminate: boolean;
 }>;

package/dist/@types/components/checkbox/components/checkbox-group/checkbox-group.vue.d.ts

@@ -1,10 +1,28 @@
 import { PropType } from 'vue';
 import { BentoCheckboxGroupItems, BentoCheckboxGroupVariant } from './checkbox-group.types';
+import { BentoCheckboxEvent } from '../../checkbox.types';
 declare const _default: import("vue").DefineComponent<{
     items: {
         type: PropType<BentoCheckboxGroupItems>;
         required: true;
     };
+    modelValue: {
+        type: {
+            (arrayLength: number): (string | number)[];
+            (...items: (string | number)[]): (string | number)[];
+            new (arrayLength: number): (string | number)[];
+            new (...items: (string | number)[]): (string | number)[];
+            isArray(arg: any): arg is any[];
+            readonly prototype: any[];
+            from<T>(arrayLike: ArrayLike<T>): T[];
+            from<T_1, U>(arrayLike: ArrayLike<T_1>, mapfn: (v: T_1, k: number) => U, thisArg?: any): U[];
+            from<T_2>(iterable: Iterable<T_2> | ArrayLike<T_2>): T_2[];
+            from<T_3, U_1>(iterable: Iterable<T_3> | ArrayLike<T_3>, mapfn: (v: T_3, k: number) => U_1, thisArg?: any): U_1[];
+            of<T_4>(...items: T_4[]): T_4[];
+            readonly [Symbol.species]: ArrayConstructor;
+        };
+        default: () => any[];
+    };
     variant: {
         type: PropType<BentoCheckboxGroupVariant>;
         default: BentoCheckboxGroupVariant;
@@ -30,13 +48,30 @@ declare const _default: import("vue").DefineComponent<{
     conditionalClasses: import("vue").ComputedRef<{
         'b-checkbox-group--horizontal': boolean;
     }>;
-    modelValue: import("vue").Ref<any[]>;
+    inputValue: import("vue").Ref<(string | number)[]>;
     onInput: (value: any) => void;
-}, {}, {}, {}, import("vue/types/v3-component-options").ComponentOptionsMixin, import("vue/types/v3-component-options").ComponentOptionsMixin, "input"[], string, Readonly<import("vue").ExtractPropTypes<{
+}, {}, {}, {}, import("vue/types/v3-component-options").ComponentOptionsMixin, import("vue/types/v3-component-options").ComponentOptionsMixin, BentoCheckboxEvent[], string, Readonly<import("vue").ExtractPropTypes<{
     items: {
         type: PropType<BentoCheckboxGroupItems>;
         required: true;
     };
+    modelValue: {
+        type: {
+            (arrayLength: number): (string | number)[];
+            (...items: (string | number)[]): (string | number)[];
+            new (arrayLength: number): (string | number)[];
+            new (...items: (string | number)[]): (string | number)[];
+            isArray(arg: any): arg is any[];
+            readonly prototype: any[];
+            from<T>(arrayLike: ArrayLike<T>): T[];
+            from<T_1, U>(arrayLike: ArrayLike<T_1>, mapfn: (v: T_1, k: number) => U, thisArg?: any): U[];
+            from<T_2>(iterable: Iterable<T_2> | ArrayLike<T_2>): T_2[];
+            from<T_3, U_1>(iterable: Iterable<T_3> | ArrayLike<T_3>, mapfn: (v: T_3, k: number) => U_1, thisArg?: any): U_1[];
+            of<T_4>(...items: T_4[]): T_4[];
+            readonly [Symbol.species]: ArrayConstructor;
+        };
+        default: () => any[];
+    };
     variant: {
         type: PropType<BentoCheckboxGroupVariant>;
         default: BentoCheckboxGroupVariant;
@@ -61,6 +96,7 @@ declare const _default: import("vue").DefineComponent<{
 }>>, {
     variant: BentoCheckboxGroupVariant;
     disabled: boolean;
+    modelValue: (string | number)[];
     hasError: boolean;
     formId: string;
 }>;

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

@@ -34,8 +34,8 @@ declare const _default: import("vue").DefineComponent<{
         default: boolean;
     };
 }>>, {
+    disableTypography: boolean;
     currency: BentoCurrencyISOCode;
     majorUnits: boolean;
-    disableTypography: boolean;
 }>;
 export default _default;

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

@@ -1,5 +1,5 @@
 import { PropType } from 'vue';
-import { BentoColumn, BentoDatagridAllItemsSelectedState, BentoDatagridSortByColumn, BentoDatagridSortDirection } from '../../data-grid.types';
+import { BentoColumn, BentoDatagridAllItemsSelectedState, BentoDatagridAriaSortValue, BentoDatagridSortByColumn, BentoDatagridSortDirection } from '../../data-grid.types';
 import { BentoTypographyElement } from '@/components/typography';
 import { BentoDatagridDraggingColumnState, DatagridColumnsEvent } from './data-grid-columns-types';
 import type { BentoMenuItem } from '@/components/menu/components';
@@ -73,8 +73,12 @@ declare const _default: import("vue").DefineComponent<{
         '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;

package/dist/@types/components/data-grid/components/data-grid-config-settings/data-grid-config-settings.vue.d.ts

@@ -15,6 +15,7 @@ declare const _default: import("vue").DefineComponent<{
     };
 }, {
     configSettingsButtonRef: any;
+    popoverId: string;
     isConfigSettingsPanelOpen: import("vue").Ref<boolean>;
     allColumnsVisbilityToggleState: import("vue").Ref<boolean>;
     filteredColumnVisibilityColumns: import("vue").ComputedRef<BentoColumn[]>;

package/dist/@types/components/data-grid/composables/index.d.ts

@@ -2,5 +2,6 @@ export { default as useResizer } from './useResizer';
 export { default as useCalculateColumnWidth, DATAGRID_SELECT_FIELD_NAME, } from './useCalculateColumnWidth/useCalculateColumnWidth';
 export { useSorter } from './useSorter';
 export { useSelector } from './useSelector';
+export { useKeyboardNavigator } from './useKeyboardNavigator/useKeyboardNavigator';
 export { useColumnReorderer } from './useColumnReorderer/useColumnReorderer';
 export { useConfigSettings } from './useConfigSettings/useConfigSettings';

package/dist/@types/components/data-grid/composables/useKeyboardNavigator/useKeyboardNavigator.d.ts

@@ -0,0 +1,6 @@
+import { Ref } from 'vue';
+import { BentoDatagridNavigationKeyCode } from './useKeyboardNavigator.types';
+export declare const useKeyboardNavigator: (gridcellRefs: Ref<HTMLDivElement[]>, columnsCount: Ref<number>) => {
+    focusOnNextGridcell: (target: EventTarget, keyCode: BentoDatagridNavigationKeyCode, ctrlKey: boolean) => void;
+    isNavigationKeyCode: (keyCode: number) => boolean;
+};

package/dist/@types/components/data-grid/composables/useKeyboardNavigator/useKeyboardNavigator.types.d.ts

@@ -0,0 +1,10 @@
+export declare enum BentoDatagridNavigationKeyCode {
+    ARROW_DOWN = 40,
+    ARROW_UP = 38,
+    ARROW_LEFT = 37,
+    ARROW_RIGHT = 39,
+    PAGE_UP = 33,
+    PAGE_DOWN = 34,
+    END = 35,
+    HOME = 36
+}

package/dist/@types/components/data-grid/composables/useSelector.d.ts

@@ -2,7 +2,7 @@ import { Ref } from 'vue';
 import { BentoDatagridData, BentoDatagridDataItemId, BentoDatagridGetDataItemIdFn, BentoDatagridIsDataItemDisabledFn } from '../data-grid.types';
 export declare const useSelector: (selection: Ref<BentoDatagridDataItemId[]>, emit: (event: string, emitedSelectedItems: BentoDatagridDataItemId[]) => void, data: Ref<BentoDatagridData>, getDataItemId: BentoDatagridGetDataItemIdFn, isDataItemDisabled: BentoDatagridIsDataItemDisabledFn) => {
     onAllRowSelect: (allItemsSelected: boolean) => void;
-    onRowSelect: () => void;
+    onRowSelect: (value: BentoDatagridDataItemId[]) => void;
     allItemsSelectedState: {
         allItemsSelected: boolean;
         isIndeterminate: boolean;

package/dist/@types/components/data-grid/data-grid.types.d.ts

@@ -67,3 +67,8 @@ export declare enum BentoDatagridEvent {
     SELECT = "select",
     SORT = "sort"
 }
+export declare enum BentoDatagridAriaSortValue {
+    ASCENDING = "ascending",
+    DESCENDING = "descending",
+    NONE = "none"
+}

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

@@ -1,4 +1,5 @@
 import { PropType } from 'vue';
+import { Booleanish } from '@/types';
 import { BentoColumn, BentoColumnOverflow, BentoDatagridData, BentoDatagridDataItem, BentoDatagridDataItemId, BentoDatagridEvent, BentoDatagridGetDataItemIdFn, BentoDatagridIsDataItemDisabledFn, BentoDatagridSortByColumn, BentoDatagridSortDirection } from './data-grid.types';
 import { BentoTypographyElement, BentoTypographyVariant } from '@/components/typography';
 declare const _default: import("vue").DefineComponent<{
@@ -131,6 +132,10 @@ declare const _default: import("vue").DefineComponent<{
         type: PropType<BentoDatagridDataItemId[]>;
         default: () => any[];
     };
+    highlightedRows: {
+        type: PropType<BentoDatagridDataItemId[]>;
+        default: () => any[];
+    };
     sortBy: {
         type: PropType<BentoDatagridSortByColumn[]>;
         default: () => any[];
@@ -198,6 +203,8 @@ declare const _default: import("vue").DefineComponent<{
         id: string;
         isFrozenColumns?: undefined;
     })[]>;
+    gridcellRefs: import("vue").Ref<HTMLDivElement[]>;
+    slots: import("vue/types/v3-setup-context").Slots;
     ariaGridHeaderText: import("vue").ComputedRef<string>;
     conditionalTitleAttribute: (column: BentoColumn, content: unknown) => string;
     getRowData: (rowData: unknown) => unknown;
@@ -211,6 +218,7 @@ declare const _default: import("vue").DefineComponent<{
         'b-data-grid__row--disabled': boolean;
         'b-data-grid__row--row-clicks-enabled': boolean;
         'b-data-grid__cell--is-re-ordering': boolean;
+        'b-data-grid__row--highlighted': boolean;
     };
     conditionalRowSetClasses: (isFrozenRowSet: boolean) => {
         'b-data-grid__row-cell-set--frozen': boolean;
@@ -244,9 +252,10 @@ declare const _default: import("vue").DefineComponent<{
     };
     selectedItems: import("vue").Ref<BentoDatagridDataItemId[]>;
     onAllRowSelect: (allItemsSelected: boolean) => void;
-    onRowSelect: () => void;
+    onRowSelect: (value: BentoDatagridDataItemId[]) => void;
     DATAGRID_SELECT_FIELD_NAME: string;
     onRowClick: (row: BentoDatagridDataItem, event: MouseEvent) => void;
+    getRowAriaSelectedValue: (row: BentoDatagridDataItem) => Booleanish;
     onConfigSettingsUpdate: (isCompactView: boolean) => void;
     onConfigSettingsColumnsUpdate: (newColumns: BentoColumn[]) => void;
     onConfigSettingsColumnUpdate: (updatedColumn: BentoColumn) => void;
@@ -322,6 +331,12 @@ declare const _default: import("vue").DefineComponent<{
         dragover: (e: DragEvent) => void;
     }>;
     computedColumnPanelAlignment: import("vue").ComputedRef<number>;
+    gridcellEvents: (column: any) => {
+        [eventName: string]: (e: Event) => void;
+    };
+    getCellindex: (rowIndex: number, colIndex: number, colSetIndex: number) => number;
+    getColIndex: (colIndex: number, colSetIndex: number) => number;
+    navigationInput: (event: KeyboardEvent) => void;
 }, {}, {}, {}, import("vue/types/v3-component-options").ComponentOptionsMixin, import("vue/types/v3-component-options").ComponentOptionsMixin, (BentoDatagridEvent.COLUMNS | BentoDatagridEvent.COLUMN_RESIZE | BentoDatagridEvent.ITEMS_PAGE | BentoDatagridEvent.NAVIGATE | BentoDatagridEvent.FILTER_SEARCH_INPUT | BentoDatagridEvent.FILTER_SEARCH_CLEAR | BentoDatagridEvent.UPDATE_COLUMNS | BentoDatagridEvent.UPDATE_FILTERS | BentoDatagridEvent.UPDATE_FILTER_SEARCH_TERM | BentoDatagridEvent.UPDATE_SORT_BY | BentoDatagridEvent.ROW_CLICK | BentoDatagridEvent.SELECT | BentoDatagridEvent.SORT)[], string, Readonly<import("vue").ExtractPropTypes<{
     allowRowClicks: {
         type: BooleanConstructor;
@@ -452,6 +467,10 @@ declare const _default: import("vue").DefineComponent<{
         type: PropType<BentoDatagridDataItemId[]>;
         default: () => any[];
     };
+    highlightedRows: {
+        type: PropType<BentoDatagridDataItemId[]>;
+        default: () => any[];
+    };
     sortBy: {
         type: PropType<BentoDatagridSortByColumn[]>;
         default: () => any[];
@@ -473,5 +492,6 @@ declare const _default: import("vue").DefineComponent<{
     stickyPagination: boolean;
     selectable: boolean;
     selection: BentoDatagridDataItemId[];
+    highlightedRows: BentoDatagridDataItemId[];
 }>;
 export default _default;

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

@@ -32,8 +32,8 @@ declare const _default: import("vue").DefineComponent<{
         default: boolean;
     };
 }>>, {
-    disableTypography: boolean;
     date: string | number | Date;
     format: BentoDateFormat;
+    disableTypography: boolean;
 }>;
 export default _default;

package/dist/@types/components/date-picker/composables/use-date-picker-single-calendar-text.d.ts

@@ -1,2 +1,2 @@
-import { UseDateDisplayText } from '../date-picker.types';
+import { UseDateDisplayText } from './use-date-picker-single-calendar-text.types';
 export declare const useDatePickerSingleCalendarText: UseDateDisplayText<Date>;

package/dist/@types/components/date-picker/composables/use-date-picker-single-calendar-text.types.d.ts

@@ -0,0 +1,10 @@
+import { ComputedRef, Ref } from 'vue';
+export interface UseDateDisplayTextProps<T> {
+    datePickerValue: Ref<T>;
+    isDateIncorrect: Ref<boolean>;
+}
+export type UseDateDisplayText<T> = (props: UseDateDisplayTextProps<T>) => {
+    dateDisplayValue: ComputedRef<string>;
+    textInputDisplayValue: Ref<string>;
+    formatTextInputDisplayValue: (dateToFormat?: Date) => void;
+};

package/dist/@types/components/date-picker/date-picker.types.d.ts

@@ -1,24 +1,5 @@
-import { ComputedRef, Ref } from 'vue';
-export { DatePickerCalendarFirstDayOfWeek as BentoDatePickerFirstDayOfWeek } from './components/date-picker-calendar';
-export type { DatePickerCalendarIsDateDisabled as BentoDatePickerIsDateDisabled } from './components/date-picker-calendar';
-export type { DatePickerCalendarPaneValue as BentoDatePickerValue, DatePickerCalendarPaneRangeDate as BentoDatePickerRangeDate, } from './components/date-picker-calendar-pane/date-picker-calendar-pane.types';
-export interface DatePickerCalendarPaneRangeFormData {
-    startDate: string;
-    endDate: string;
-}
-export interface UseDateDisplayTextProps<T> {
-    datePickerValue: Ref<T>;
-    isDateIncorrect: Ref<boolean>;
-}
-export type UseDateDisplayText<T> = (props: UseDateDisplayTextProps<T>) => {
-    dateDisplayValue: ComputedRef<string>;
-    textInputDisplayValue: Ref<string> | DatePickerCalendarPaneRangeFormData;
-    formatTextInputDisplayValue: () => void;
-};
+export { CalendarFirstDayOfWeek as BentoDatePickerFirstDayOfWeek } from '@/internal';
+export type { CalendarIsDateDisabled as BentoDatePickerIsDateDisabled, CalendarSingleDateValue as BentoDatePickerValue, } from '@/internal';
 export declare enum BentoDatePickerEvent {
     INPUT = "input"
 }
-export declare enum BentoDatePickerVariant {
-    SINGLE_CALENDAR = "single-calendar",
-    RANGE_CALENDAR = "range-calendar"
-}

package/dist/@types/components/date-picker/date-picker.vue.d.ts

@@ -1,5 +1,5 @@
 import { PropType, Ref } from 'vue';
-import { BentoDatePickerEvent, BentoDatePickerFirstDayOfWeek, BentoDatePickerIsDateDisabled, BentoDatePickerRangeDate, BentoDatePickerValue, BentoDatePickerVariant, DatePickerCalendarPaneRangeFormData } from './date-picker.types';
+import { BentoDatePickerEvent } from './date-picker.types';
 import { BentoTypographyElement, BentoTypographyVariant } from '../typography';
 declare const _default: import("vue").DefineComponent<{
     description: {
@@ -11,12 +11,12 @@ declare const _default: import("vue").DefineComponent<{
         default: boolean;
     };
     firstDayOfWeek: {
-        type: PropType<BentoDatePickerFirstDayOfWeek>;
-        default: BentoDatePickerFirstDayOfWeek;
-        validator: (value: BentoDatePickerFirstDayOfWeek) => boolean;
+        type: PropType<import("@/internal").CalendarFirstDayOfWeek>;
+        default: import("@/internal").CalendarFirstDayOfWeek;
+        validator: (value: import("@/internal").CalendarFirstDayOfWeek) => boolean;
     };
     isDateDisabled: {
-        type: PropType<BentoDatePickerIsDateDisabled>;
+        type: PropType<import("@/internal").CalendarIsDateDisabled>;
         default: any;
     };
     label: {
@@ -37,16 +37,12 @@ declare const _default: import("vue").DefineComponent<{
         validator: (n: number) => boolean;
     };
     value: {
-        type: PropType<BentoDatePickerValue>;
+        type: PropType<Date>;
         default: any;
     };
-    variant: {
-        type: PropType<BentoDatePickerVariant>;
-        default: BentoDatePickerVariant;
-        validator: (value: BentoDatePickerVariant) => boolean;
-    };
 }, {
     inputContainerRef: any;
+    calendarContainerRef: any;
     dateDisplayValue: import("vue").ComputedRef<string>;
     datePickerContainerId: string;
     descriptionConditionalClasses: import("vue").ComputedRef<{
@@ -57,11 +53,8 @@ declare const _default: import("vue").DefineComponent<{
     isDatePickerOpen: Ref<boolean>;
     labelId: string;
     popoverAriaLabel: import("vue").ComputedRef<any>;
-    popoverConditionalClasses: import("vue").ComputedRef<{
-        'b-date-picker__container-range': boolean;
-    }>;
     supportDescriptionText: import("vue").ComputedRef<any>;
-    textInputDisplayValue: Ref<string> | DatePickerCalendarPaneRangeFormData;
+    textInputDisplayValue: Ref<string>;
     BentoTypographyElement: typeof BentoTypographyElement;
     BentoTypographyVariant: typeof BentoTypographyVariant;
     BentoPopoverPositions: {
@@ -81,16 +74,14 @@ declare const _default: import("vue").DefineComponent<{
         BOTTOM: import("../popper-container").PopperContainerPositionBasic.BOTTOM;
         LEFT: import("../popper-container").PopperContainerPositionBasic.LEFT;
     };
-    BentoDatePickerVariant: typeof BentoDatePickerVariant;
     closeDatePicker: () => void;
     clearDatePickerValue: () => Promise<void>;
     onDateSelected: (selectedDate: Date) => void;
     openDatePicker: () => void;
     onDateInputChange: (stringDate: any) => void;
     onEnterPressedOverInput: () => void;
-    onDatePickerRangeInput: (selectedRange: BentoDatePickerRangeDate) => void;
-    onDatePickerRangeError: (dateTextInput: any) => void;
-    onDatePickerRangeFormDateInputUpdate: () => void;
+    onEscape: () => void;
+    onSpaceBar: (event: KeyboardEvent) => void;
 }, {}, {}, {}, import("vue/types/v3-component-options").ComponentOptionsMixin, import("vue/types/v3-component-options").ComponentOptionsMixin, BentoDatePickerEvent[], string, Readonly<import("vue").ExtractPropTypes<{
     description: {
         type: StringConstructor;
@@ -101,12 +92,12 @@ declare const _default: import("vue").DefineComponent<{
         default: boolean;
     };
     firstDayOfWeek: {
-        type: PropType<BentoDatePickerFirstDayOfWeek>;
-        default: BentoDatePickerFirstDayOfWeek;
-        validator: (value: BentoDatePickerFirstDayOfWeek) => boolean;
+        type: PropType<import("@/internal").CalendarFirstDayOfWeek>;
+        default: import("@/internal").CalendarFirstDayOfWeek;
+        validator: (value: import("@/internal").CalendarFirstDayOfWeek) => boolean;
     };
     isDateDisabled: {
-        type: PropType<BentoDatePickerIsDateDisabled>;
+        type: PropType<import("@/internal").CalendarIsDateDisabled>;
         default: any;
     };
     label: {
@@ -127,24 +118,18 @@ declare const _default: import("vue").DefineComponent<{
         validator: (n: number) => boolean;
     };
     value: {
-        type: PropType<BentoDatePickerValue>;
+        type: PropType<Date>;
         default: any;
     };
-    variant: {
-        type: PropType<BentoDatePickerVariant>;
-        default: BentoDatePickerVariant;
-        validator: (value: BentoDatePickerVariant) => boolean;
-    };
 }>>, {
-    value: BentoDatePickerValue;
+    value: Date;
     description: string;
     label: string;
-    variant: BentoDatePickerVariant;
     required: boolean;
     disabled: boolean;
-    optional: boolean;
-    firstDayOfWeek: BentoDatePickerFirstDayOfWeek;
-    isDateDisabled: BentoDatePickerIsDateDisabled;
+    isDateDisabled: import("@/internal").CalendarIsDateDisabled;
+    firstDayOfWeek: import("@/internal").CalendarFirstDayOfWeek;
     numberOfMonths: number;
+    optional: boolean;
 }>;
 export default _default;

package/dist/@types/components/date-range-picker/components/date-range-picker-calendar/date-range-picker-calendar.types.d.ts

@@ -0,0 +1,9 @@
+export interface DateRangePickerCalendarFormData {
+    startDate: string;
+    endDate: string;
+}
+export declare enum DateRangePickerCalendarEvent {
+    INPUT = "input",
+    ERROR = "error",
+    FORM_DATE = "form-date"
+}

package/dist/@types/components/{date-picker/components/date-picker-calendar-range/date-picker-calendar-range.vue.d.ts → date-range-picker/components/date-range-picker-calendar/date-range-picker-calendar.vue.d.ts}

@@ -1,15 +1,15 @@
 import { PropType } from 'vue';
+import { CalendarRangeDateValue } from '@/internal';
 import { BentoTypographyElement } from '@/components/typography';
-import { DatePickerCalendarPaneValue } from '../date-picker-calendar-pane/date-picker-calendar-pane.types';
-import { DatePickerCalendarRangeEvent } from './date-picker-calendar-range.types';
+import { DateRangePickerCalendarEvent, DateRangePickerCalendarFormData } from './date-range-picker-calendar.types';
 declare const _default: import("vue").DefineComponent<{
     firstDayOfWeek: {
-        type: PropType<import("../date-picker-calendar").DatePickerCalendarFirstDayOfWeek>;
-        default: import("../date-picker-calendar").DatePickerCalendarFirstDayOfWeek;
-        validator: (value: import("../date-picker-calendar").DatePickerCalendarFirstDayOfWeek) => boolean;
+        type: PropType<import("@/internal").CalendarFirstDayOfWeek>;
+        default: import("@/internal").CalendarFirstDayOfWeek;
+        validator: (value: import("@/internal").CalendarFirstDayOfWeek) => boolean;
     };
     isDateDisabled: {
-        type: PropType<import("../date-picker-calendar").DatePickerCalendarIsDateDisabled>;
+        type: PropType<import("@/internal").CalendarIsDateDisabled>;
         default: any;
     };
     numberOfMonths: {
@@ -18,20 +18,20 @@ declare const _default: import("vue").DefineComponent<{
         validator: (n: number) => boolean;
     };
     dateFormData: {
-        type: ObjectConstructor;
+        type: PropType<DateRangePickerCalendarFormData>;
         default: () => {
             startDate: any;
             endDate: any;
         };
     };
     value: {
-        type: PropType<DatePickerCalendarPaneValue>;
+        type: PropType<CalendarRangeDateValue>;
         default: any;
     };
 }, {
     dateTextInput: {
-        startDate: any;
-        endDate: any;
+        startDate: string;
+        endDate: string;
     };
     endDateError: import("vue").Ref<boolean>;
     startDateError: import("vue").Ref<boolean>;
@@ -42,14 +42,14 @@ declare const _default: import("vue").DefineComponent<{
     onEndDateSelected: (newEndDate: Date) => void;
     onStartDateInput: (startDateText: string) => void;
     onEndDateInput: (endDateText: string) => void;
-}, {}, {}, {}, import("vue/types/v3-component-options").ComponentOptionsMixin, import("vue/types/v3-component-options").ComponentOptionsMixin, DatePickerCalendarRangeEvent[], string, Readonly<import("vue").ExtractPropTypes<{
+}, {}, {}, {}, import("vue/types/v3-component-options").ComponentOptionsMixin, import("vue/types/v3-component-options").ComponentOptionsMixin, DateRangePickerCalendarEvent[], string, Readonly<import("vue").ExtractPropTypes<{
     firstDayOfWeek: {
-        type: PropType<import("../date-picker-calendar").DatePickerCalendarFirstDayOfWeek>;
-        default: import("../date-picker-calendar").DatePickerCalendarFirstDayOfWeek;
-        validator: (value: import("../date-picker-calendar").DatePickerCalendarFirstDayOfWeek) => boolean;
+        type: PropType<import("@/internal").CalendarFirstDayOfWeek>;
+        default: import("@/internal").CalendarFirstDayOfWeek;
+        validator: (value: import("@/internal").CalendarFirstDayOfWeek) => boolean;
     };
     isDateDisabled: {
-        type: PropType<import("../date-picker-calendar").DatePickerCalendarIsDateDisabled>;
+        type: PropType<import("@/internal").CalendarIsDateDisabled>;
         default: any;
     };
     numberOfMonths: {
@@ -58,21 +58,21 @@ declare const _default: import("vue").DefineComponent<{
         validator: (n: number) => boolean;
     };
     dateFormData: {
-        type: ObjectConstructor;
+        type: PropType<DateRangePickerCalendarFormData>;
         default: () => {
             startDate: any;
             endDate: any;
         };
     };
     value: {
-        type: PropType<DatePickerCalendarPaneValue>;
+        type: PropType<CalendarRangeDateValue>;
         default: any;
     };
 }>>, {
-    value: DatePickerCalendarPaneValue;
-    firstDayOfWeek: import("../date-picker-calendar").DatePickerCalendarFirstDayOfWeek;
-    isDateDisabled: import("../date-picker-calendar").DatePickerCalendarIsDateDisabled;
+    value: CalendarRangeDateValue;
+    isDateDisabled: import("@/internal").CalendarIsDateDisabled;
+    firstDayOfWeek: import("@/internal").CalendarFirstDayOfWeek;
     numberOfMonths: number;
-    dateFormData: Record<string, any>;
+    dateFormData: DateRangePickerCalendarFormData;
 }>;
 export default _default;

package/dist/@types/components/date-range-picker/components/date-range-picker-calendar/index.d.ts

@@ -0,0 +1 @@
+export { default as DateRangePickerCalendar } from './date-range-picker-calendar.vue';

package/dist/@types/components/date-range-picker/composables/use-date-range-picker-calendar-text.d.ts

@@ -0,0 +1,3 @@
+import { UseDateDisplayText } from './use-date-range-picker-calendar-text.types';
+import { CalendarRangeDateValue } from '@/internal';
+export declare const useDateRangePickerCalendarText: UseDateDisplayText<CalendarRangeDateValue>;