@adyen/bento-vue3 1.42.0 → 1.44.0

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

@@ -1,8 +1,3 @@
-import { PropType } from "../../../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue";
-import { BentoDatagridDataItem, BentoDatagridDataItemId, BentoDatagridGetDataItemIdFn, BentoDatagridIsDataItemDisabledFn, BentoDatagridShouldShowNestedContentFn } from "../../data-grid.types";
-import type { DataGridCellColumnSet, DataGridCellDragEventsForColumn } from '../data-grid-cell/data-grid-cell.types';
-import type { BentoDatagridDraggingColumnState } from '../data-grid-columns/data-grid-columns.types';
-import type { DatagridColumnHoveringState } from "../../composables/use-column-hovering";
 /**
  * Internal component to display the BentoDataGrid data rows containig the data row cells.
  *
@@ -42,349 +37,5 @@ import type { DatagridColumnHoveringState } from "../../composables/use-column-h
  *          </data-grid-row>
  *     `
  */
-declare const _default: __VLS_WithTemplateSlots<import("../../../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").DefineComponent<import("../../../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").ExtractPropTypes<{
-    /**
-     * When true, will emit a 'rowClick' event when a row is clicked. Will add cursor: pointer to rows.
-     */
-    allowRowClicks: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    /**
-     * The columns sets including
-     */
-    columnSets: {
-        type: PropType<DataGridCellColumnSet[]>;
-        required: true;
-    };
-    /**
-     * Sets the row cells to the condensed padding state.
-     */
-    condensed: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    /**
-     * Columns being dragged, contains dragging column and a target column
-     */
-    draggingColumns: {
-        type: PropType<BentoDatagridDraggingColumnState>;
-        default: any;
-    };
-    /**
-     * Dragging event handlers for each row cell
-     */
-    draggingEventsForRowCell: {
-        type: PropType<DataGridCellDragEventsForColumn>;
-        required: true;
-    };
-    /**
-     * A customisable method to retrieve a unique identifier for a data item in the array of data supplied.
-     * This is used selecting and performance reasons and must exist in each data item.
-     */
-    getDataItemId: {
-        type: PropType<BentoDatagridGetDataItemIdFn>;
-        default: (item: BentoDatagridDataItem) => BentoDatagridDataItemId;
-    };
-    /**
-     * Set to true if the datagrid has been scrolled and the left side has overflowing space.
-     */
-    hasLeftOverflow: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    /**
-     * Enables the nested content slot functionality.
-     */
-    hasNestedContent: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    /**
-     * Highlighted row IDs.
-     */
-    highlightedRows: {
-        type: PropType<BentoDatagridDataItemId[]>;
-        default: () => any[];
-    };
-    /**
-     * The row index of a currently hovered row.
-     */
-    hoveredRowIndex: {
-        type: NumberConstructor;
-        default: number;
-    };
-    /**
-     * The column hovered over state and whether the hovered over column should show a border right or left.
-     */
-    hoveredOverColumnState: {
-        type: PropType<DatagridColumnHoveringState>;
-        required: true;
-    };
-    /**
-     * A customisable method to determine if a row is not selectable.
-     * The default is that every row is selectable.
-     */
-    isDataItemDisabled: {
-        type: PropType<BentoDatagridIsDataItemDisabledFn>;
-        default: () => boolean;
-    };
-    /**
-     * If the row is the last child in it's parent container.
-     */
-    isRowLastChild: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    /**
-     * If columns are being measured for the autoWidth functionality.
-     */
-    isMeasuringColumnWidths: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    /**
-     * The row data object
-     */
-    rowData: {
-        type: PropType<BentoDatagridDataItem>;
-        required: true;
-    };
-    /**
-     * The row index.
-     */
-    rowIndex: {
-        type: NumberConstructor;
-        required: true;
-    };
-    /**
-     * The number of rows that this row is within.
-     */
-    rowSetSize: {
-        type: NumberConstructor;
-        default: number;
-    };
-    /**
-     * Determines whether to render frozen seperator on the row.
-     */
-    showFrozenColumnsSeparator: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    /**
-     * Determines if the row selection is enabled.
-     */
-    selectable: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    /**
-     * The array of IDs for the selected rows.
-     */
-    selectedItems: {
-        type: PropType<BentoDatagridDataItemId[]>;
-        required: true;
-    };
-    /**
-     * Enables / Disables the nested-content slot
-     */
-    shouldShowNestedContent: {
-        type: PropType<BentoDatagridShouldShowNestedContentFn>;
-        default: (_item: BentoDatagridDataItem) => true;
-    };
-}>, {
-    gridcellRefs: import("../../../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").Ref<{
-        [key: string]: HTMLDivElement;
-    }, {
-        [key: string]: HTMLDivElement;
-    }>;
-}, {}, {}, {}, import("../../../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").ComponentOptionsMixin, import("../../../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").ComponentOptionsMixin, {
-    "cell-hovered": (value: number) => void;
-} & {
-    "on-frozen-columns-key-press": (event: Event) => void;
-} & {
-    "select-row": (value: BentoDatagridDataItemId[]) => void;
-} & {
-    "row-click": (rowData: BentoDatagridDataItem, event: MouseEvent) => void;
-}, string, import("../../../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").PublicProps, Readonly<import("../../../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").ExtractPropTypes<{
-    /**
-     * When true, will emit a 'rowClick' event when a row is clicked. Will add cursor: pointer to rows.
-     */
-    allowRowClicks: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    /**
-     * The columns sets including
-     */
-    columnSets: {
-        type: PropType<DataGridCellColumnSet[]>;
-        required: true;
-    };
-    /**
-     * Sets the row cells to the condensed padding state.
-     */
-    condensed: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    /**
-     * Columns being dragged, contains dragging column and a target column
-     */
-    draggingColumns: {
-        type: PropType<BentoDatagridDraggingColumnState>;
-        default: any;
-    };
-    /**
-     * Dragging event handlers for each row cell
-     */
-    draggingEventsForRowCell: {
-        type: PropType<DataGridCellDragEventsForColumn>;
-        required: true;
-    };
-    /**
-     * A customisable method to retrieve a unique identifier for a data item in the array of data supplied.
-     * This is used selecting and performance reasons and must exist in each data item.
-     */
-    getDataItemId: {
-        type: PropType<BentoDatagridGetDataItemIdFn>;
-        default: (item: BentoDatagridDataItem) => BentoDatagridDataItemId;
-    };
-    /**
-     * Set to true if the datagrid has been scrolled and the left side has overflowing space.
-     */
-    hasLeftOverflow: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    /**
-     * Enables the nested content slot functionality.
-     */
-    hasNestedContent: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    /**
-     * Highlighted row IDs.
-     */
-    highlightedRows: {
-        type: PropType<BentoDatagridDataItemId[]>;
-        default: () => any[];
-    };
-    /**
-     * The row index of a currently hovered row.
-     */
-    hoveredRowIndex: {
-        type: NumberConstructor;
-        default: number;
-    };
-    /**
-     * The column hovered over state and whether the hovered over column should show a border right or left.
-     */
-    hoveredOverColumnState: {
-        type: PropType<DatagridColumnHoveringState>;
-        required: true;
-    };
-    /**
-     * A customisable method to determine if a row is not selectable.
-     * The default is that every row is selectable.
-     */
-    isDataItemDisabled: {
-        type: PropType<BentoDatagridIsDataItemDisabledFn>;
-        default: () => boolean;
-    };
-    /**
-     * If the row is the last child in it's parent container.
-     */
-    isRowLastChild: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    /**
-     * If columns are being measured for the autoWidth functionality.
-     */
-    isMeasuringColumnWidths: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    /**
-     * The row data object
-     */
-    rowData: {
-        type: PropType<BentoDatagridDataItem>;
-        required: true;
-    };
-    /**
-     * The row index.
-     */
-    rowIndex: {
-        type: NumberConstructor;
-        required: true;
-    };
-    /**
-     * The number of rows that this row is within.
-     */
-    rowSetSize: {
-        type: NumberConstructor;
-        default: number;
-    };
-    /**
-     * Determines whether to render frozen seperator on the row.
-     */
-    showFrozenColumnsSeparator: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    /**
-     * Determines if the row selection is enabled.
-     */
-    selectable: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    /**
-     * The array of IDs for the selected rows.
-     */
-    selectedItems: {
-        type: PropType<BentoDatagridDataItemId[]>;
-        required: true;
-    };
-    /**
-     * Enables / Disables the nested-content slot
-     */
-    shouldShowNestedContent: {
-        type: PropType<BentoDatagridShouldShowNestedContentFn>;
-        default: (_item: BentoDatagridDataItem) => true;
-    };
-}>> & Readonly<{
-    "onOn-frozen-columns-key-press"?: (event: Event) => any;
-    "onSelect-row"?: (value: BentoDatagridDataItemId[]) => any;
-    "onCell-hovered"?: (value: number) => any;
-    "onRow-click"?: (rowData: BentoDatagridDataItem, event: MouseEvent) => any;
-}>, {
-    condensed: boolean;
-    draggingColumns: BentoDatagridDraggingColumnState;
-    hasLeftOverflow: boolean;
-    isMeasuringColumnWidths: boolean;
-    showFrozenColumnsSeparator: boolean;
-    selectable: boolean;
-    getDataItemId: BentoDatagridGetDataItemIdFn;
-    isDataItemDisabled: BentoDatagridIsDataItemDisabledFn;
-    allowRowClicks: boolean;
-    hasNestedContent: boolean;
-    highlightedRows: BentoDatagridDataItemId[];
-    hoveredRowIndex: number;
-    isRowLastChild: boolean;
-    rowSetSize: number;
-    shouldShowNestedContent: BentoDatagridShouldShowNestedContentFn;
-}, {}, {}, {}, string, import("../../../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").ComponentProvideOptions, true, {}, any>, Record<NonNullable<string | number>, (_: any) => any> & {
-    'nested-slot': (_: {
-        item: BentoDatagridDataItem;
-    }) => any;
-}>;
+declare const _default: any;
 export default _default;
-type __VLS_WithTemplateSlots<T, S> = T & {
-    new (): {
-        $slots: S;
-    };
-};

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

@@ -9,6 +9,7 @@ export interface CalculateColumnWidthOptions {
     allowColumnDragAndDrop?: Ref<boolean>;
     hasColumnPanel?: Ref<boolean>;
     hasNestedContent?: Ref<boolean>;
+    hasNestedRows?: Ref<boolean>;
     hasSelectableColumn?: Ref<boolean>;
     hasSelectableAcrossPages?: Ref<boolean>;
     isDataGridTemplate?: boolean;

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

@@ -11,6 +11,7 @@ export declare const useScroller: (body: Ref<UnwrapRef<HTMLDivElement>>, columns
     isLazyLoad?: Ref<UnwrapRef<boolean>>;
     pagination?: Ref<UnwrapRef<BentoDatagridPaginationProps | undefined>>;
     stickyPagination: Ref<UnwrapRef<boolean>>;
+    isDataGridTemplate?: boolean;
 }) => {
     scrollLeftPosition: Ref<number, number>;
     hasLeftOverflow: Ref<boolean, boolean>;

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

@@ -1,5 +1,5 @@
 import { Ref } from "../../../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue";
-import { BentoDatagridData, BentoDatagridDataItemId, BentoDatagridGetDataItemIdFn, BentoDatagridIsDataItemDisabledFn } from '../../data-grid.types';
+import { BentoDatagridData, BentoDatagridDataItem, BentoDatagridDataItemId, BentoDatagridGetDataItemIdFn, BentoDatagridIsDataItemDisabledFn } from '../../data-grid.types';
 /**
  * Exposed selection variables and methods for a data component to use and react to.
  * @param selection A list of unique IDs
@@ -10,7 +10,8 @@ import { BentoDatagridData, BentoDatagridDataItemId, BentoDatagridGetDataItemIdF
  */
 export declare const useSelector: (selection: Ref<BentoDatagridDataItemId[]>, emit: (event: string, emitedSelectedItems: BentoDatagridDataItemId[]) => void, data: Ref<BentoDatagridData>, getDataItemId: BentoDatagridGetDataItemIdFn, isDataItemDisabled: BentoDatagridIsDataItemDisabledFn) => {
     onAllRowSelect: (selectAllItems: boolean) => void;
-    onRowSelect: (value: BentoDatagridDataItemId[]) => void;
+    onRowSelect: (value: BentoDatagridDataItemId[], rowData: BentoDatagridDataItem) => void;
+    onNestedRowSelect: (value: BentoDatagridDataItemId[], parentRowData: BentoDatagridDataItem, rowData: BentoDatagridDataItem) => void;
     allItemsSelectedState: {
         allItemsSelected: boolean;
         isIndeterminate: boolean;

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

@@ -45,6 +45,7 @@ export type BentoDatagridDataItemId = string | number;
 export type BentoDatagridSelection = BentoDatagridDataItemId[];
 export interface BentoDatagridDataItem {
     id?: BentoDatagridDataItemId;
+    children?: BentoDatagridDataItem[];
     [fieldName: string]: unknown;
 }
 export type BentoDatagridData = BentoDatagridDataItem[];
@@ -65,6 +66,7 @@ export declare enum BentoDatagridEvent {
     COLUMN_RESIZE = "column-resize",
     ITEMS_PAGE = "items-page",
     NAVIGATE = "navigate",
+    NESTED_CONTENT_TOGGLED = "nested-content-toggled",
     FILTER_SEARCH_INPUT = "filter-search-input",
     FILTER_SEARCH_CLEAR = "filter-search-clear",
     UPDATE_COLUMNS = "update:columns",
@@ -88,3 +90,4 @@ export declare enum BentoDatagridAriaSortValue {
 }
 export type BentoDatagridEmptyStateProps = InstanceType<typeof BentoEmptyState>['$props'];
 export type BentoDatagridShouldShowNestedContentFn = (item: BentoDatagridDataItem) => boolean;
+export type BentoDatagridShouldShowNestedRowsFn = (item: BentoDatagridDataItem) => boolean;

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

@@ -1,5 +1,5 @@
 import { PropType } from "../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue";
-import { BentoColumn, BentoDatagridData, BentoDatagridDataItem, BentoDatagridDataItemId, BentoDatagridEmptyStateProps, BentoDatagridEvent, BentoDatagridGetDataItemIdFn, BentoDatagridIsDataItemDisabledFn, BentoDatagridPaginationProps, BentoDatagridShouldShowNestedContentFn, BentoDatagridSortByColumn } from './data-grid.types';
+import { BentoColumn, BentoDatagridData, BentoDatagridDataItem, BentoDatagridDataItemId, BentoDatagridEmptyStateProps, BentoDatagridEvent, BentoDatagridGetDataItemIdFn, BentoDatagridIsDataItemDisabledFn, BentoDatagridPaginationProps, BentoDatagridShouldShowNestedContentFn, BentoDatagridShouldShowNestedRowsFn, BentoDatagridSortByColumn } from './data-grid.types';
 import type { BentoLazyLoadType } from "../../types";
 import type { BentoButtonActionsList } from "../button";
 /**
@@ -141,6 +141,13 @@ declare const _default: __VLS_WithTemplateSlots<import("../../../../../node_modu
         type: BooleanConstructor;
         default: boolean;
     };
+    /**
+     * Enables the nested content slot functionality.
+     */
+    hasNestedRows: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
     /**
      * Highlighted items
      */
@@ -246,6 +253,13 @@ declare const _default: __VLS_WithTemplateSlots<import("../../../../../node_modu
         type: PropType<BentoDatagridShouldShowNestedContentFn>;
         default: (_item: BentoDatagridDataItem) => true;
     };
+    /**
+     * Returns the nested rows for a given BentoDatagridDataItem.
+     */
+    shouldShowNestedRows: {
+        type: PropType<BentoDatagridShouldShowNestedRowsFn>;
+        default: (_item: BentoDatagridDataItem) => true;
+    };
     /**
      * Sortby handles proper rendering of sort icon in header. Sorting currently is only supported server side.
      * It does make sure the currently sorted column has a more visible sort icon, and the sort icon points in the right direction.
@@ -386,6 +400,13 @@ declare const _default: __VLS_WithTemplateSlots<import("../../../../../node_modu
         type: BooleanConstructor;
         default: boolean;
     };
+    /**
+     * Enables the nested content slot functionality.
+     */
+    hasNestedRows: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
     /**
      * Highlighted items
      */
@@ -491,6 +512,13 @@ declare const _default: __VLS_WithTemplateSlots<import("../../../../../node_modu
         type: PropType<BentoDatagridShouldShowNestedContentFn>;
         default: (_item: BentoDatagridDataItem) => true;
     };
+    /**
+     * Returns the nested rows for a given BentoDatagridDataItem.
+     */
+    shouldShowNestedRows: {
+        type: PropType<BentoDatagridShouldShowNestedRowsFn>;
+        default: (_item: BentoDatagridDataItem) => true;
+    };
     /**
      * Sortby handles proper rendering of sort icon in header. Sorting currently is only supported server side.
      * It does make sure the currently sorted column has a more visible sort icon, and the sort icon points in the right direction.
@@ -521,6 +549,7 @@ declare const _default: __VLS_WithTemplateSlots<import("../../../../../node_modu
     "onColumn-resize"?: (...args: any[]) => any;
     "onSelect-all-across-pages"?: (...args: any[]) => any;
     "onUpdate:columns"?: (...args: any[]) => any;
+    "onNested-content-toggled"?: (...args: any[]) => any;
     "onRow-click"?: (...args: any[]) => any;
     "onUpdate:filter-values"?: (...args: any[]) => any;
     onColumns?: (...args: any[]) => any;
@@ -543,17 +572,17 @@ declare const _default: __VLS_WithTemplateSlots<import("../../../../../node_modu
         title: string;
         image: "success" | "1-generic-use" | "2-generic-use" | "3-generic-use" | "4-generic-use" | "adding-payment-methods" | "adyen-giving" | "internal-error" | "no-results-found" | "notifications-cleared" | "page-not-found" | "planned-maintenance" | "referrals" | "upload-files" | "wrong-environment";
         variant: "condensed" | "full-page" | "embedded" | "basic";
-        action: import("../button").BentoButtonActionObject;
         description: string;
+        action: import("../button").BentoButtonActionObject;
         headingEl: "div" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "p" | "span";
     }> & Omit<{
         readonly title: string;
         readonly variant: "condensed" | "full-page" | "embedded" | "basic";
         readonly image?: "success" | "1-generic-use" | "2-generic-use" | "3-generic-use" | "4-generic-use" | "adding-payment-methods" | "adyen-giving" | "internal-error" | "no-results-found" | "notifications-cleared" | "page-not-found" | "planned-maintenance" | "referrals" | "upload-files" | "wrong-environment";
-        readonly action?: import("../button").BentoButtonActionObject;
         readonly description?: string;
+        readonly action?: import("../button").BentoButtonActionObject;
         readonly headingEl?: "div" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "p" | "span";
-    } & import("../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").VNodeProps & import("../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").AllowedComponentProps & import("../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").ComponentCustomProps, "title" | "image" | "variant" | "action" | "description" | "headingEl">;
+    } & import("../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").VNodeProps & import("../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").AllowedComponentProps & import("../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").ComponentCustomProps, "title" | "image" | "variant" | "description" | "action" | "headingEl">;
     fitContent: boolean;
     pagination: Partial<{
         size: number;
@@ -585,8 +614,10 @@ declare const _default: __VLS_WithTemplateSlots<import("../../../../../node_modu
     isDataItemDisabled: BentoDatagridIsDataItemDisabledFn;
     allowRowClicks: boolean;
     hasNestedContent: boolean;
+    hasNestedRows: boolean;
     highlightedRows: BentoDatagridDataItemId[];
     shouldShowNestedContent: BentoDatagridShouldShowNestedContentFn;
+    shouldShowNestedRows: BentoDatagridShouldShowNestedRowsFn;
     filterValues: any;
     allowColumnDragAndDrop: boolean;
     bulkActions: BentoButtonActionsList;
@@ -600,6 +631,7 @@ declare const _default: __VLS_WithTemplateSlots<import("../../../../../node_modu
     tabTitle: string;
 }, {}, {}, {}, string, import("../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").ComponentProvideOptions, true, {}, any>, Record<NonNullable<string | number>, (_: any) => any> & Record<NonNullable<string | number>, (_: any) => any> & {
     header: (_: {}) => any;
+    'pagination-slot': (_: {}) => any;
     footer: (_: {}) => any;
 }>;
 export default _default;