@adyen/bento-vue2 1.28.0 → 1.28.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1 +1 @@
1
- {"version":3,"file":"data-grid.CvHAdmvs.js","sources":["../../src/components/data-grid/data-grid.types.ts","../../src/components/data-grid/components/data-grid-columns/data-grid-columns.types.ts","../../src/components/data-grid/composables/use-resizer.ts","../../src/components/data-grid/composables/use-calculate-column-width/use-calculate-column-width.ts","../../src/components/data-grid/composables/use-selector.ts","../../src/components/data-grid/composables/use-sorter.ts","../../src/components/data-grid/composables/use-keyboard-navigator/use-keyboard-navigator.types.ts","../../src/components/data-grid/composables/use-keyboard-navigator/use-keyboard-navigator.ts","../../src/components/data-grid/composables/use-lazy-loading/use-lazy-loading.ts","../../src/components/data-grid/composables/use-column-reorderer/use-column-reorderer.ts","../../src/components/data-grid/composables/use-config-settings/use-config-settings.ts","../../src/components/data-grid/composables/use-calculate-sticky-element-height/use-calculate-sticky-element-height.ts","../../src/components/data-grid/composables/use-scroller/use-scroller.ts","../../src/components/data-grid/composables/use-column-hovering/use-column-hovering.ts","../../../../node_modules/@adyen/ui-assets-icons-16/dist/vue/arrow-up-down-sort.vue","../../../../node_modules/@adyen/ui-assets-icons-16/dist/vue/arrow-right.vue","../../../../node_modules/@adyen/ui-assets-icons-16/dist/vue/freeze.vue","../../../../node_modules/@adyen/ui-assets-icons-16/dist/vue/hide.vue","../../../../node_modules/@adyen/ui-assets-icons-16/dist/vue/sort-ascending.vue","../../../../node_modules/@adyen/ui-assets-icons-16/dist/vue/sort-descending.vue","../../../../node_modules/@adyen/ui-assets-icons-16/dist/vue/show.vue","../../../../node_modules/@adyen/ui-assets-icons-16/dist/vue/triangle-down.vue","../../src/components/data-grid/components/data-grid-columns/data-grid-columns.vue","../../src/components/data-grid/components/data-grid-config-settings/data-grid-config-settings.types.ts","../../../../node_modules/@adyen/ui-assets-icons-16/dist/vue/settings.vue","../../src/components/data-grid/components/data-grid-config-settings/components/data-grid-config-settings-column-row/data-grid-config-settings-column-row.vue","../../src/components/data-grid/components/data-grid-config-settings/data-grid-config-settings.vue","../../src/components/data-grid/components/data-grid-lazy-load/data-grid-lazy-load.vue","../../../../node_modules/@adyen/ui-assets-icons-16/dist/vue/edit-1.vue","../../src/components/data-grid/components/data-grid-cell-actions/data-grid-cell-actions.vue","../../src/components/data-grid/components/data-grid-cell/data-grid-cell.types.ts","../../src/components/data-grid/components/data-grid-cell/data-grid-cell.vue","../../../../node_modules/@adyen/ui-assets-icons-16/dist/vue/warning-circle-fill.vue","../../src/components/data-grid/components/data-grid-static-icon/data-grid-static-icon.vue","../../src/components/data-grid/data-grid.vue"],"sourcesContent":["import type { BentoPagination } from '@/components/pagination';\nimport type { BentoEmptyState } from '@/components/empty-state';\nimport type { BentoColumnCellActions } from './components/data-grid-cell-actions/data-grid-cell-actions.types';\n\nexport enum BentoColumnOverflow {\n WRAP = 'wrap',\n ELLIPSIS = 'ellipsis',\n}\n\nexport interface BentoColumn {\n field: string;\n label: string;\n width?: number;\n autoWidth?: boolean;\n minWidth?: number;\n flex?: number;\n sortable?: boolean;\n numeric?: boolean;\n infoIconTooltip?: string;\n padding?: {\n left?: boolean;\n right?: boolean;\n };\n overflow?: BentoColumnOverflow;\n visible?: boolean;\n mandatory?: boolean;\n frozen?: boolean;\n cellActions?: BentoColumnCellActions;\n}\n\nexport enum BentoDatagridStyleState {\n OUTLINE = 'outline',\n SCROLL = 'scroll',\n STICKY_FILTERS = 'sticky-filters',\n OVERFLOW_SHADOW_LEFT = 'overflow-shadow-left',\n OVERFLOW_SHADOW_RIGHT = 'overflow-shadow-right',\n NO_SPACING_TOP = 'no-spacing-top',\n}\n\nexport enum BentoDatagridSortDirection {\n ASCENDING = 'asc',\n DESCENDING = 'desc',\n}\n\nexport interface BentoDatagridSortByColumn {\n field: BentoColumn['field'];\n direction: BentoDatagridSortDirection;\n}\n\nexport type BentoDatagridDataItemId = string | number;\n\nexport type BentoDatagridSelection = BentoDatagridDataItemId[];\n\nexport interface BentoDatagridDataItem {\n id?: BentoDatagridDataItemId;\n [fieldName: string]: unknown;\n}\n\nexport type BentoDatagridData = BentoDatagridDataItem[];\n\nexport type BentoDatagridGetDataItemIdFn = (item: BentoDatagridDataItem) => BentoDatagridDataItemId;\n\nexport type BentoDatagridIsDataItemDisabledFn = (item: BentoDatagridDataItem) => boolean;\n\nexport type BentoDatagridPaginationProps = InstanceType<typeof BentoPagination>['$props'];\n\nexport interface BentoColumnWidthOverridesLookup {\n [field: string]: {\n width: BentoColumn['width'];\n };\n}\n\nexport interface BentoDatagridAllItemsSelectedState {\n allItemsSelected: boolean;\n isIndeterminate: boolean;\n}\n\nexport enum BentoDatagridEvent {\n COLUMNS = 'columns',\n COLUMN_RESIZE = 'column-resize',\n ITEMS_PAGE = 'items-page',\n NAVIGATE = 'navigate',\n FILTER_SEARCH_INPUT = 'filter-search-input',\n FILTER_SEARCH_CLEAR = 'filter-search-clear',\n UPDATE_COLUMNS = 'update:columns',\n UPDATE_CONDENSED = 'update:condensed',\n UPDATE_FILTERS = 'update:filters',\n UPDATE_FILTER_VALUES = 'update:filter-values',\n UPDATE_FILTER_SEARCH_TERM = 'update:filter-search-term',\n UPDATE_PAGINATION = 'update:pagination',\n UPDATE_SELECTION = 'update:selection',\n UPDATE_SHOW_MORE = 'update:show-more',\n UPDATE_SORT_BY = 'update:sort-by',\n ROW_CLICK = 'row-click',\n SELECT = 'select',\n SELECT_ALL_ACROSS_PAGES = 'select-all-across-pages',\n SORT = 'sort',\n}\n\nexport enum BentoDatagridAriaSortValue {\n ASCENDING = 'ascending',\n DESCENDING = 'descending',\n NONE = 'none',\n}\n\nexport type BentoDatagridEmptyStateProps = InstanceType<typeof BentoEmptyState>['$props'];\n","import { BentoColumn } from '../../data-grid.types';\n\n/**\n * All the emit events provided by the DatagridColumns component\n */\nexport enum DatagridColumnsEvent {\n COLUMN_RESIZE = 'column-resize',\n COLUMN_RESIZING = 'column-resizing',\n SORT = 'sort',\n SELECT_ALL_ROWS = 'select-all-rows',\n SELECT_ALL_ACROSS_PAGES = 'select-all-across-pages',\n COLUMN_MOVE = 'column-move',\n COLUMN_UPDATE = 'column-update',\n COLUMN_MENU_OPEN = 'column-menu-open',\n COLUMN_MENU_CLOSE = 'column-menu-close',\n COLUMN_HOVER = 'column-hover',\n\n // Dragging events\n COLUMN_DRAG_START = 'column-dragstart',\n COLUMN_DRAG_ENTER = 'column-dragenter',\n COLUMN_DRAG_END = 'column-dragend',\n COLUMN_DROP = 'column-drop',\n}\n\nexport interface DatagridColumnsHeaderReferences {\n [key: string]: HTMLDivElement | null;\n}\n\n/**\n * The Datagrid column dragging state.\n * @interface BentoDatagridDraggingColumnState\n * @field dragging - The column currently being dragged.\n * @field target - The column being dragged over during dragging another column.\n */\nexport interface BentoDatagridDraggingColumnState {\n dragging?: BentoColumn;\n dragToLeft?: boolean;\n target?: BentoColumn;\n}\n","/* eslint-disable no-param-reassign */\nimport { computed, reactive, ref, Ref, toRefs, watch, watchEffect } from 'vue';\nimport { listen } from '@/utils/ts/events';\nimport { DatagridColumnsEvent } from '../components/data-grid-columns/data-grid-columns.types';\nimport type { BentoColumn, BentoColumnWidthOverridesLookup } from '../data-grid.types';\n\n/**\n * Contains all the resize methods and logic to allow users to resize column widths.\n * We listen for 3 main events:\n * - startResize: when the user clicks on a column divider.\n * - onResize: the tracking of the user dragging the columns divider left or right.\n * - stopResize: when the user fires the mouseup event and the column needs to be resized.\n *\n * With these 3 events we can track and store users manually changing column width.\n *\n * @param columns An array of columns definitions\n * @param emit The `bento-data-grid` emit function\n * @returns All resize refs, variables and methods\n */\nexport const useResizer = (\n columns: Ref<BentoColumn[]>,\n emit: (event: DatagridColumnsEvent, ...args: unknown[]) => void\n) => {\n const columnHoverEventToEmitAfterResizing = ref<BentoColumn>(null);\n const isResizing = ref(false);\n const columnWidthOverridesLookup = ref<BentoColumnWidthOverridesLookup>(undefined);\n // Initalise resize refs, reactive obects and computed variables\n // Set up column refs for each column header identified by the key\n const colKeyLookup = columns.value.reduce((acc, col) => {\n acc[col.field] = null;\n return acc;\n }, {});\n const columnsRefs = reactive(colKeyLookup);\n const allColumnRefs = toRefs(columnsRefs);\n\n let stepPositionX = 0;\n let resizingColumnField = '';\n\n // Setup the reactive resize data object to be used in all the event methods\n const defaultResizedColumnWidths = computed(() =>\n Object.fromEntries(columns.value.map(({ field, width, minWidth }) => [field, { width, minWidth }]))\n );\n\n // eslint-disable-next-line no-return-assign\n watchEffect(() => (columnWidthOverridesLookup.value = defaultResizedColumnWidths.value));\n\n // Intialise resize methods\n let removeMouseMoveResizeListener: () => void = null;\n let removeMouseUpResizeListener: () => void = null;\n\n // When the user is resizing the column keep track of mouse position and update column width\n const onResizeColumn = (event: MouseEvent) => {\n const sizeChange = event.clientX - stepPositionX;\n const currResizingColumnField = resizingColumnField;\n\n const resizedColumnWidth = columnWidthOverridesLookup.value[currResizingColumnField].width + sizeChange;\n // If the column width is more than the minWidth set the new resized width or else use the minWidth\n columnWidthOverridesLookup.value[currResizingColumnField].width =\n resizedColumnWidth > defaultResizedColumnWidths.value[currResizingColumnField].minWidth\n ? resizedColumnWidth\n : defaultResizedColumnWidths.value[currResizingColumnField].minWidth;\n\n /**\n * Triggered when a column is resized\n *\n * @event column-resizing\n * @property BentoColumnWidthOverridesLookup columnWidthOverridesLookup - the column width overrides.\n */\n emit(DatagridColumnsEvent.COLUMN_RESIZING, columnWidthOverridesLookup.value);\n\n stepPositionX = event.clientX;\n };\n\n // When the user fires the mouse up event, set the resizing column width\n const stopResize = () => {\n isResizing.value = false;\n removeMouseMoveResizeListener?.();\n removeMouseUpResizeListener?.();\n\n if (resizingColumnField) {\n /**\n * Triggered when a column is resized\n *\n * @event column-resize\n * @property {field: string; width: number;} resizedColumn - the resized columns field name and new width.\n */\n emit(DatagridColumnsEvent.COLUMN_RESIZE, {\n field: resizingColumnField,\n width: columnWidthOverridesLookup.value[resizingColumnField].width,\n });\n }\n\n // Reset all resize vars back to defaults\n removeMouseMoveResizeListener = null;\n removeMouseUpResizeListener = null;\n resizingColumnField = '';\n stepPositionX = null;\n };\n\n // When the user interacts with the column resizer, set it's start position and the column we are interacting with\n const startResize = (hasResizableColumns: boolean, field: BentoColumn['field'], event: MouseEvent) => {\n event.preventDefault();\n if (hasResizableColumns) {\n isResizing.value = true;\n if (event.buttons !== 1) {\n stopResize();\n return;\n }\n\n resizingColumnField = field;\n stepPositionX = event.clientX;\n\n removeMouseMoveResizeListener = listen(window, 'mousemove', onResizeColumn);\n removeMouseUpResizeListener = listen(window, 'mouseup', stopResize);\n }\n };\n\n // When resizing we need to keep track of what the last column-hover emit was so we can emit that when we're finished resizing\n watch(\n () => isResizing.value,\n (newIsResizing, oldIsResizing) => {\n if (!newIsResizing && oldIsResizing) {\n emit(DatagridColumnsEvent.COLUMN_HOVER, columnHoverEventToEmitAfterResizing.value);\n columnHoverEventToEmitAfterResizing.value = null;\n }\n }\n );\n return {\n resizeData: columnWidthOverridesLookup,\n allColumnRefs,\n startResize,\n isResizing,\n columnHoverEventToEmitAfterResizing,\n };\n};\n","import { computed, nextTick, onBeforeUpdate, onMounted, onUnmounted, type Ref, ref, watch } from 'vue';\nimport { observeSizeOfElement } from '@/utils/ts/resize';\nimport { isVue3 } from 'vue-demi';\nimport type { BentoColumn, BentoColumnWidthOverridesLookup, BentoDatagridData } from '../../data-grid.types';\nimport type { CalculateColumnWidthOptions, FlexColumnLookup } from './use-calculate-column-width.types';\nimport type { MaybeRef } from '@/types';\nimport type { DatagridColumnsHeaderReferences } from '../../components/data-grid-columns/data-grid-columns.types';\n\n// Default constants\nexport const DEFAULT_COLUMN_WIDTH = 100;\nexport const DEFAULT_COLUMN_MIN_WIDTH = 50;\n\n// Select column constants\nexport const DATAGRID_SELECT_FIELD_NAME = 'b-select';\nexport const DATAGRID_SELECT_WIDTH = 32;\n// If select all pages is enabled we need to make the select column larger\nexport const DATAGRID_SELECT_WIDTH_WITH_SELECT_ALL_PAGES_ENABLED = 56;\n\n// Cell and Column header offset constants\nexport const DATAGRID_CELL_OFFSET_INITIAL = 4;\nexport const DATAGRID_CELL_OFFSET_PADDING = 16;\n\n/**\n * For fluid width caclulations we adhere to the caclulations done for the CSS flexbox:\n * https://drafts.csswg.org/css-flexbox-1/#resolve-flexible-lengths\n *\n * @param initialFreeSpace The amount of freespace to allow flex columns within\n * @param totalFlexUnits The total amount of flex units to allocate\n * @param flexCols An array of columns with a flex unit assigned to them\n * @returns A keyed object of columns and their computed widths\n */\nconst computeFlexColumnsWidth = (initialFreeSpace: number, totalFlexUnits: number, flexCols: BentoColumn[]) => {\n const flexColumnsLookup: FlexColumnLookup = {};\n const frozenColumnKeys: BentoColumn['field'][] = [];\n\n const freezeColumn = (field: BentoColumn['field']) => {\n const value = flexColumnsLookup[field];\n if (value && value.frozen !== true) {\n flexColumnsLookup[field].frozen = true;\n frozenColumnKeys.push(field);\n }\n };\n\n // Step 5 of https://drafts.csswg.org/css-flexbox-1/#resolve-flexible-lengths\n function processFlexItems() {\n // 5a: If all the flex items on the line are frozen, free space has been distributed.\n if (frozenColumnKeys.length === flexCols.length) {\n return;\n }\n\n const violationsLookup: {\n min: Record<BentoColumn['field'], boolean>;\n max: Record<BentoColumn['field'], boolean>;\n } = { min: {}, max: {} };\n\n let remainingFreeSpace = initialFreeSpace;\n let flexUnits = totalFlexUnits;\n let totalViolation = 0;\n\n // 5b: Calculate the remaining free space\n frozenColumnKeys.forEach(field => {\n remainingFreeSpace -= flexColumnsLookup[field].computedWidth;\n flexUnits -= flexColumnsLookup[field].flex;\n });\n\n for (let i = 0, flexColsLength = flexCols.length; i < flexColsLength; i += 1) {\n const column = flexCols[i];\n\n // If this column is frozen no need to re-recalculate it's width\n if (flexColumnsLookup[column.field] && flexColumnsLookup[column.field].frozen === true) {\n // NOTE: the following eslint rule was disabled because we check each column's frozen status\n // and if one exists we need to keep recursively caclulating the flex column widths.\n // eslint-disable-next-line no-continue\n continue;\n }\n\n // 5c: Distribute remaining free space proportional to the flex factors\n const widthPerFlexUnit = remainingFreeSpace / flexUnits;\n let computedWidth = widthPerFlexUnit * column.flex;\n\n // 5d: Fix minWidth violations\n if (computedWidth < column.minWidth) {\n totalViolation += column.minWidth - computedWidth;\n computedWidth = column.minWidth;\n violationsLookup.min[column.field] = true;\n }\n\n flexColumnsLookup[column.field] = {\n frozen: false,\n computedWidth,\n flex: column.flex,\n };\n }\n\n // 5e: Freeze over-flexed items\n if (totalViolation > 0) {\n // Freeze all the items with minWidth violations\n Object.keys(violationsLookup.min).forEach(field => {\n freezeColumn(field);\n });\n } else {\n // Freeze all items\n flexCols.forEach(({ field: key }) => {\n freezeColumn(key);\n });\n }\n\n // 5f: Return to the start of this loop\n processFlexItems();\n }\n\n processFlexItems();\n\n return flexColumnsLookup;\n};\n\n/**\n * Calculates width of HTMLDivElement including any additional offset depending on if:\n * - An edge occurs where sometimes the padding CSS has not loaded yet\n * - When calculating column header width, if the column panel is enabled\n *\n * @param el - an HTML Div element\n * @param hasColumnPanel - if provided and true will be used to calculate the offset\n * @returns the width of the element including offset values\n */\nconst getElementWidthIncludingOffset = (el: HTMLDivElement, hasColumnPanel?: boolean) => {\n let offset = DATAGRID_CELL_OFFSET_INITIAL;\n if (el) {\n const computedStyleOfEl = getComputedStyle(el);\n // If paddings have not been applied yet the manually adjust the offset\n if (computedStyleOfEl?.padding === '0px') {\n offset += DATAGRID_CELL_OFFSET_PADDING * 2; // 16px padding on left & right\n }\n }\n // If we include column panel in the calculation we should add 2 spacers to leave room for the contextual menu button\n if (hasColumnPanel) {\n offset += DATAGRID_CELL_OFFSET_PADDING * 2;\n }\n\n return el?.offsetWidth ? el.offsetWidth + offset : 0;\n};\n\n/**\n * Calculates the width of the columns using width, minWidth and/or a fluid number.\n *\n * @param newColumns An array of column definitions\n * @param newData An array of data objects to display.\n * @param bodyRef Ref to the `bento-data-grid` body container\n * @param gridCellRefs An array of Ref for each one of the cells available by Column\n * @param options Optional options for the calculator to be aware of.\n */\nexport const useCalculateColumnWidth = (\n newColumns: Ref<BentoColumn[]>,\n newData: MaybeRef<BentoDatagridData>,\n bodyRef: MaybeRef<HTMLDivElement | undefined>,\n gridColumnsComponentRefs: MaybeRef<DatagridColumnsHeaderReferences>,\n gridCellRefs: MaybeRef<{ [key: string]: HTMLDivElement[] } | undefined>,\n options?: CalculateColumnWidthOptions\n) => {\n const columns = ref(newColumns.value);\n const data = ref(newData);\n const body = ref(bodyRef);\n const gridColumnsComponents = ref(gridColumnsComponentRefs);\n const gridCells = ref(gridCellRefs);\n const isMeasuringColumnWidths = ref(false);\n\n // Watch for updates to columns property but don't change order or width\n watch(\n () => newColumns.value,\n () => {\n columns.value =\n columns.value?.length === 0\n ? newColumns.value\n : newColumns.value\n // Keep the order the same as it was, adding any new columns to the end\n .sort((colA, colB) => {\n // Find the index of each item in the orderArray\n const indexA = columns.value.findIndex(item => item.field === colA.field);\n const indexB = columns.value.findIndex(item => item.field === colB.field);\n // Place items not in orderArray at the end\n if (indexA === -1) {\n return 1;\n }\n if (indexB === -1) {\n return -1;\n }\n return indexA - indexB;\n });\n }\n );\n\n // Observe the size of the table body and store the width for column and CSS width calculations\n const gridWidth = ref<number>();\n let bodyElementObserver: ResizeObserver | null = null;\n\n onMounted(() => {\n nextTick(() => {\n if (body.value) {\n gridWidth.value = body.value.getBoundingClientRect().width;\n }\n // Keep watching element till it's defined, when it is observe element's width\n const stop = watch(\n body,\n () => {\n if (body.value) {\n nextTick(() => stop());\n bodyElementObserver = observeSizeOfElement(body.value, ({ width }) => {\n gridWidth.value = width;\n });\n }\n },\n { immediate: true }\n );\n });\n });\n onUnmounted(() => {\n bodyElementObserver?.disconnect();\n });\n onBeforeUpdate(() => {\n if (gridCells.value && Object.keys(gridCells.value)?.length > 0) {\n const columnKeys = Object.keys(gridCells.value);\n columnKeys.forEach(key => {\n gridCells.value[key] = [];\n });\n }\n });\n\n const calculatedWidths = computed(() => {\n // Setup vars\n const flexCols = [];\n let totalFlexUnits = 0;\n let widthAllocatedBeforeFlex = 0;\n // reduce columns into keyed object\n const columnsLookup: {\n [columnKey: string]: BentoColumn;\n } = {};\n let columnDefs: BentoColumn[] = columns.value.filter(col => col.visible !== false);\n const invisibleColumnDefs: BentoColumn[] = columns.value.filter(col => col.visible === false);\n // Prepend a column if needs selecting functionality\n if (options?.hasSelectableColumn?.value) {\n const columnWidth = options?.hasSelectableAcrossPages?.value\n ? DATAGRID_SELECT_WIDTH_WITH_SELECT_ALL_PAGES_ENABLED\n : DATAGRID_SELECT_WIDTH;\n columnDefs = [\n {\n field: DATAGRID_SELECT_FIELD_NAME,\n label: '',\n minWidth: columnWidth,\n width: columnWidth,\n frozen: true,\n padding: { left: false, right: false },\n },\n ...columnDefs,\n ];\n }\n\n // For the non-flex columns, compute their width\n // For the flex columns, compute there minimum width and how much width must be allocated during the flex allocation\n columnDefs.forEach(col => {\n const fluidCol: BentoColumn = { ...col };\n let width: number;\n if (fluidCol.flex && fluidCol.flex > 0) {\n // If a fluid column, add flex units to total and prepare them for calculation\n totalFlexUnits += fluidCol.flex;\n width = 0;\n flexCols.push(fluidCol);\n } else {\n // If not a fluid column use the width (or minWidth if this is a larger value)\n width = Math.max(\n fluidCol?.width ?? DEFAULT_COLUMN_WIDTH,\n fluidCol?.minWidth ?? DEFAULT_COLUMN_MIN_WIDTH\n );\n }\n\n widthAllocatedBeforeFlex += width;\n fluidCol.width = width;\n fluidCol.minWidth = fluidCol?.minWidth ?? DEFAULT_COLUMN_MIN_WIDTH;\n\n columnsLookup[fluidCol.field] = fluidCol;\n });\n\n // Calculate how much space we have available for fluids widths by subtracting the non-fluid column widths\n const initialFreeSpace = Math.max(gridWidth.value - widthAllocatedBeforeFlex, 0);\n\n // Allocate the remaining space to the flex columns\n if (totalFlexUnits > 0 && gridWidth.value > 0) {\n const computedColumnWidths = computeFlexColumnsWidth(initialFreeSpace, totalFlexUnits, flexCols);\n\n Object.keys(computedColumnWidths).forEach(field => {\n columnsLookup[field].width = computedColumnWidths[field].computedWidth;\n });\n }\n\n // Add in invisible columns\n invisibleColumnDefs.forEach(col => {\n const fluidCol: BentoColumn = { ...col };\n columnsLookup[fluidCol.field] = fluidCol;\n });\n\n return Object.values(columnsLookup);\n });\n\n // RESIZE OBJECT\n const columnWidthOverridesLookup = ref<BentoColumnWidthOverridesLookup>(undefined);\n\n const onColumnWidthOverride = (newColumnWidthOverridesLookup: BentoColumnWidthOverridesLookup) => {\n columnWidthOverridesLookup.value = { ...columnWidthOverridesLookup.value, ...newColumnWidthOverridesLookup };\n };\n\n // Auto-width logic\n watch(\n [() => columns.value, () => data.value],\n async () => {\n if (columns.value.some(column => column?.autoWidth)) {\n // First we need to measure the row cells for each column after 1 tick\n isMeasuringColumnWidths.value = true;\n await nextTick();\n // Need to await an extra tick for vue 3 because of how vue 3 re-renders children component when changing props\n if (isVue3) {\n await nextTick();\n }\n // Now we find the biggest cell for each auto width column\n columns?.value\n .filter(column => column?.autoWidth)\n .forEach(({ field, minWidth }) => {\n const columnHeaderWidth = getElementWidthIncludingOffset(\n gridColumnsComponents.value?.[field],\n options?.hasColumnPanel?.value\n );\n\n const largestRowCellWidth = gridCells.value?.[field]?.reduce(\n (max, el) => Math.max(max, getElementWidthIncludingOffset(el)),\n 0\n );\n\n const largestColumnHeaderAndRowCellWidth = Math.max(\n columnHeaderWidth,\n largestRowCellWidth ?? 0\n );\n\n if (minWidth === undefined || largestColumnHeaderAndRowCellWidth > minWidth) {\n onColumnWidthOverride({\n [field]: {\n width: largestColumnHeaderAndRowCellWidth,\n },\n });\n }\n });\n\n isMeasuringColumnWidths.value = false;\n }\n },\n { immediate: true }\n );\n\n const processedColumns = computed(() =>\n calculatedWidths.value.map(col => ({\n ...col,\n // Override column width with resized ones\n width: columnWidthOverridesLookup.value?.[col.field]?.width ?? col.width,\n }))\n );\n\n // Generate grid width styles\n const totalWidthOfAllColumns = computed(() =>\n processedColumns.value?.filter(({ visible }) => visible !== false).reduce((acc, val) => val.width + acc, 0)\n );\n\n const isTotalWidthOfColumnsTakingUpAllAvailableGridWidth = computed(\n () => gridWidth.value <= totalWidthOfAllColumns.value\n );\n\n const gridColumnWidthStyle = computed(() => ({\n width: gridWidth.value > totalWidthOfAllColumns.value ? '100%' : 'fit-content',\n }));\n\n return {\n columnDefs: processedColumns,\n gridColumnWidthStyle,\n onColumnWidthOverride,\n isMeasuringColumnWidths,\n isTotalWidthOfColumnsTakingUpAllAvailableGridWidth,\n columns,\n };\n};\n","import { nextTick, reactive, ref, Ref, watch } from 'vue';\nimport {\n BentoDatagridAllItemsSelectedState,\n BentoDatagridData,\n BentoDatagridDataItemId,\n BentoDatagridEvent,\n BentoDatagridGetDataItemIdFn,\n BentoDatagridIsDataItemDisabledFn,\n} from '../data-grid.types';\n\n/**\n * Exposed selection variables and methods for a data component to use and react to.\n * @param selection A list of unique IDs\n * @param emit The emit function to fire upon selection\n * @param data The list of data items\n * @param getDataItemId The method to retrieve the unique ID of a data item\n * @param isDataItemDisabled The method to determine if the data item is disabled for selection\n */\nexport const useSelector = (\n selection: Ref<BentoDatagridDataItemId[]>,\n emit: (event: string, emitedSelectedItems: BentoDatagridDataItemId[]) => void,\n data: Ref<BentoDatagridData>,\n getDataItemId: BentoDatagridGetDataItemIdFn,\n isDataItemDisabled: BentoDatagridIsDataItemDisabledFn\n) => {\n const selectedItems = ref<BentoDatagridDataItemId[]>(selection.value ?? []);\n const allItemsSelectedState = reactive<BentoDatagridAllItemsSelectedState>({\n allItemsSelected: false,\n isIndeterminate: false,\n });\n\n const emitSelect = () => {\n emit(BentoDatagridEvent.SELECT, selectedItems.value);\n emit(BentoDatagridEvent.UPDATE_SELECTION, selectedItems.value);\n };\n\n // Update the selected items state & the select / de-select all column checkbox state by:\n // - Set the selected items state\n // - Set the \"select / de-select all\" checked state\n // - If all seletcted, set indeterminate to true if not all items were selected including disabled ones.\n // - If not all selected, set indeterminate to true if at least 1 item has been selected in the currently shown data.\n const updateSelectedItems = (value: BentoDatagridDataItemId[]) => {\n selectedItems.value = value;\n // Check every item except for disabled items\n const isEveryItemSelected =\n data.value?.length > 0 &&\n data.value\n ?.filter(dataItem => !isDataItemDisabled(dataItem))\n .every(item => selectedItems.value.includes(getDataItemId(item)));\n if (isEveryItemSelected) {\n allItemsSelectedState.allItemsSelected = true;\n // If all items are checked, we should check if there are disabled items that are not checked, if so then we set isIndeterminate to true\n const isEveryItemIncludingDisabledSelected =\n data.value?.length > 0 && data.value.every(item => selectedItems.value.includes(getDataItemId(item)));\n\n allItemsSelectedState.isIndeterminate = !isEveryItemIncludingDisabledSelected;\n } else {\n allItemsSelectedState.allItemsSelected = false;\n // Check if at least 1 item in the currently shown data is selected\n allItemsSelectedState.isIndeterminate =\n selectedItems.value?.length > 0 &&\n data.value?.length > 0 &&\n data.value.some(item => selectedItems.value.includes(getDataItemId(item)));\n }\n };\n\n // Reacts to the \"select / de-select all\" checkbox updates\n // 1. Set the \"select / de-select all\" checked state to incoming parameter\n // 2. Set the selected items state\n // - If selecting all then interminate state to true if checked state is checked but not all items (including disabled ones) are selected\n // - If de-selecting all, then set interminate state to false\n // 3. Emit selected state\n const onAllRowSelect = (selectAllItems: boolean) => {\n nextTick(() => {\n // The allItemsSelected must be kept in sync with the checked checkbox state\n allItemsSelectedState.allItemsSelected = selectAllItems;\n if (selectAllItems) {\n // Check all undisabled rows\n selectedItems.value = data.value\n ?.filter(dataItem => !isDataItemDisabled(dataItem))\n ?.map(dataItem => getDataItemId(dataItem));\n // If all items are checked, we should check if there are disabled items that are not checked, if so then we set isIndeterminate to true\n const isEveryItemIncludingDisabledSelected =\n data.value?.length > 0 &&\n data.value.every(item => selectedItems.value.includes(getDataItemId(item)));\n allItemsSelectedState.isIndeterminate =\n selectedItems.value.length > 0 && !isEveryItemIncludingDisabledSelected;\n } else {\n selectedItems.value = [];\n allItemsSelectedState.isIndeterminate = false;\n }\n emitSelect();\n });\n };\n\n const onRowSelect = (value: BentoDatagridDataItemId[]) => {\n nextTick(() => {\n updateSelectedItems(value);\n emitSelect();\n });\n };\n\n // If the selection prop is changed we should update local selection state\n watch(\n () => selection.value,\n () => {\n updateSelectedItems(selection.value ?? []);\n },\n { immediate: true }\n );\n\n // If the data is changed then we should update the select all checkbox if needed\n watch(\n () => data.value,\n () => {\n updateSelectedItems(selectedItems.value);\n }\n );\n\n return { onAllRowSelect, onRowSelect, allItemsSelectedState, selectedItems };\n};\n","import { Ref } from 'vue';\nimport { BentoColumn, BentoDatagridSortByColumn, BentoDatagridSortDirection } from '../data-grid.types';\nimport { DatagridColumnsEvent } from '../components/data-grid-columns/data-grid-columns.types';\n\n/**\n * Handles the sort direction logic of the columns in DataGrid.\n * Emits the `sort` event with the new direction when the field sort direction changes.\n * @param sortBy Sort directions per field that is `sortable: true`\n * @param columns Array of all columns in the grid\n * @param emit The `bento-data-grid` emit function\n */\nexport const useSorter = (\n sortBy: Ref<BentoDatagridSortByColumn[]>,\n columns: Ref<BentoColumn[]>,\n emit: (event: DatagridColumnsEvent, updatedSortBy: BentoDatagridSortByColumn[]) => void\n) => {\n const isSorting = (field: string) => sortBy.value.some(sortedCol => sortedCol.field === field);\n\n const getSortingDirection = (field: string) => sortBy.value.find(sortedCol => sortedCol.field === field)?.direction;\n\n // The column head click event to sort data by certain field and direction\n const sortByColumnField = (field: string) => {\n // First check if column is sortable\n if (!columns.value.some(col => col.field === field && col.sortable)) {\n return;\n }\n\n // Return the updated sortBy array of sorted columns\n const newColumnSort: BentoDatagridSortByColumn = {\n field,\n direction:\n sortBy.value.find(sortedCol => sortedCol.field === field)?.direction ===\n BentoDatagridSortDirection.ASCENDING\n ? BentoDatagridSortDirection.DESCENDING\n : BentoDatagridSortDirection.ASCENDING,\n };\n\n const updatedSortBy = [newColumnSort];\n\n emit(DatagridColumnsEvent.SORT, updatedSortBy);\n };\n\n return { isSorting, getSortingDirection, sortByColumnField };\n};\n","import { KeyCode } from '@/types/utils-events';\n\nexport enum BentoDatagridNavigationKeyCode {\n ARROW_DOWN = KeyCode.ARROW_DOWN,\n ARROW_UP = KeyCode.ARROW_UP,\n ARROW_LEFT = KeyCode.ARROW_LEFT,\n ARROW_RIGHT = KeyCode.ARROW_RIGHT,\n PAGE_UP = KeyCode.PAGE_UP,\n PAGE_DOWN = KeyCode.PAGE_DOWN,\n END = KeyCode.END,\n HOME = KeyCode.HOME,\n}\n","import { computed, Ref } from 'vue';\nimport { BentoDatagridNavigationKeyCode } from './use-keyboard-navigator.types';\nimport type { BentoColumn } from '../../data-grid.types';\n\n/**\n * A composable that handles all the keyboard navigation logic within the data-grid.\n * This provide grid navigation by moving focus among cells of the grid using the keyboard\n * @param gridcellRefs Array of references to the HTML elements of the cells.\n * @param columns The reference to the array of column configurations\n * @param selectable The reference to the selectable prop that enable row to be selected via a checkbox.\n */\nexport const useKeyboardNavigator = (\n gridcellRefs: Ref<{ [key: string]: HTMLDivElement[] }>,\n columns: Ref<BentoColumn[]>,\n selectable: Ref<boolean>\n) => {\n // Count the number of visible columns\n const visibleColumnsCount = computed(() => {\n const visibleColumns = columns.value.filter(({ visible }) => visible !== false);\n if (selectable.value) {\n return visibleColumns.length + 1;\n }\n return visibleColumns.length;\n });\n\n // Sort the grid cell references by their cellindex value\n const sortedGridCellRefs = computed(() =>\n [...Object.values(gridcellRefs.value)].flat(1).sort((a, b) => {\n const indexA = Number(a.getAttribute('data-cellindex'));\n const indexB = Number(b.getAttribute('data-cellindex'));\n if (indexA > indexB) {\n return 1;\n }\n if (indexB > indexA) {\n return -1;\n }\n return 0;\n })\n );\n // Returns the index of the row that a given cell is found\n const getCurrentRowIndex = (currentIndex: number) => Math.floor(currentIndex / visibleColumnsCount.value);\n\n // Calculates the next focused cell index when users navigates using keys to navigate on the edge of the grid\n // e.g. Home, Page Up, Page Down, ...\n const getEdgeCellIndex = (currentIndex: number, direction: BentoDatagridNavigationKeyCode, ctrlKey: boolean) => {\n const lastCellIndex = sortedGridCellRefs.value.length - 1;\n const lastColumnIndex = visibleColumnsCount.value - 1;\n const currentRowIndex = getCurrentRowIndex(currentIndex);\n const currentColumn = currentIndex - visibleColumnsCount.value * currentRowIndex;\n\n const cellIndexByDirection = {\n [BentoDatagridNavigationKeyCode.PAGE_UP]: currentColumn,\n [BentoDatagridNavigationKeyCode.PAGE_DOWN]: lastCellIndex - lastColumnIndex + currentColumn,\n [BentoDatagridNavigationKeyCode.END]: ctrlKey\n ? lastCellIndex\n : visibleColumnsCount.value * currentRowIndex + lastColumnIndex,\n [BentoDatagridNavigationKeyCode.HOME]: ctrlKey ? 0 : visibleColumnsCount.value * currentRowIndex,\n };\n\n return cellIndexByDirection[direction];\n };\n\n // Calculates the next focused cell index when users navigates using keys to navigate cell by cell\n // e.g. Arrow Right, Arrow Left, Arrow Up, Arrow Down\n const getCellIndex = (currentIndex: number, direction: BentoDatagridNavigationKeyCode) => {\n const directionDiffMap = {\n [BentoDatagridNavigationKeyCode.ARROW_DOWN]: visibleColumnsCount.value,\n [BentoDatagridNavigationKeyCode.ARROW_UP]: -visibleColumnsCount.value,\n [BentoDatagridNavigationKeyCode.ARROW_LEFT]: -1,\n [BentoDatagridNavigationKeyCode.ARROW_RIGHT]: 1,\n };\n\n const directionDiff = directionDiffMap[direction];\n const newCellIndex = currentIndex + directionDiff;\n\n if (newCellIndex < 0 || newCellIndex >= sortedGridCellRefs.value.length) {\n return currentIndex;\n }\n\n return newCellIndex;\n };\n\n // Verifies if a key is used to navigate on the edges of the data-grid\n const isEdgeNavigationKeyCode = (keyCode: BentoDatagridNavigationKeyCode) =>\n [\n BentoDatagridNavigationKeyCode.PAGE_UP,\n BentoDatagridNavigationKeyCode.PAGE_DOWN,\n BentoDatagridNavigationKeyCode.END,\n BentoDatagridNavigationKeyCode.HOME,\n ].includes(keyCode);\n\n // Returns the next cell to be focused based on the keys pressed by the user\n const getTargetCellIndex = (\n target: EventTarget,\n directionKeyCode: BentoDatagridNavigationKeyCode,\n ctrlKey: boolean\n ): number => {\n const currentCellIndex = sortedGridCellRefs.value.indexOf(target as HTMLDivElement);\n\n if (isEdgeNavigationKeyCode(directionKeyCode)) {\n return getEdgeCellIndex(currentCellIndex, directionKeyCode, ctrlKey);\n }\n\n return getCellIndex(currentCellIndex, directionKeyCode);\n };\n\n // Find the next cell to be focused and apply the focus on it\n const focusOnNextGridcell = (target: EventTarget, keyCode: BentoDatagridNavigationKeyCode, ctrlKey: boolean) => {\n if (!sortedGridCellRefs.value.includes(target as HTMLDivElement)) {\n return;\n }\n\n const cellIndex = getTargetCellIndex(target, keyCode, ctrlKey);\n sortedGridCellRefs.value[cellIndex].focus();\n };\n\n // Verifies if a key is used to navigate on the data-grid\n const isNavigationKeyCode = (keyCode: number) => keyCode in BentoDatagridNavigationKeyCode;\n\n // On keyboard input for DataGrid row elements\n const navigationInput = (event: KeyboardEvent) => {\n const { ctrlKey, keyCode, target } = event;\n\n const isFocusedOnGridcell = Object.values(gridcellRefs.value)\n .flat(1)\n .includes(target as HTMLDivElement);\n if (isFocusedOnGridcell && isNavigationKeyCode(keyCode)) {\n focusOnNextGridcell(target, keyCode, ctrlKey);\n }\n };\n\n return {\n isNavigationKeyCode,\n focusOnNextGridcell,\n navigationInput,\n };\n};\n","import { computed, ref, watch } from 'vue';\nimport { SetupContext } from 'vue/types/v3-setup-context';\nimport { BentoLazyLoadType, MaybeRef } from '@/types';\nimport { BentoDatagridEvent } from '../../data-grid.types';\n\n/**\n * The percentage of how much height of the element that has been scrolled before a\n * `BentoDatagridEvent.UPDATE_SHOW_MORE` event is emitted.\n */\nconst LAZY_LOAD_BUFFER_PERCENTAGE = 90;\n\n/**\n * Handles the \"lazy load\" logic for the DataGrid so the data can be\n * loaded. If `lazyLoadTypeRef` is set to automatic, then the event `update:show-more`\n * is triggered when the scroll gets to the bottom of the DataGrid.\n *\n * @param lazyLoadTypeRef Lazy load type: automatic, button or none\n * @param verticalScrollPositionRef Current vertical position of the scroll\n * @param bodyRef Ref to the `bento-data-grid` body container\n * @param emit The `bento-data-grid` emit function\n */\nexport const useLazyLoading = (\n lazyLoadTypeRef: MaybeRef<BentoLazyLoadType>,\n verticalScrollPositionRef: MaybeRef<number>,\n bodyRef: MaybeRef<HTMLDivElement | undefined>,\n loading: MaybeRef<boolean>,\n emit: SetupContext['emit']\n) => {\n const lazyLoadType = ref(lazyLoadTypeRef);\n const verticalScrollPosition = ref(verticalScrollPositionRef);\n const body = ref(bodyRef);\n const isLoading = ref(loading);\n\n const isLazyLoad = computed(() => lazyLoadType.value !== 'none');\n\n const isInfiniteScroll = computed(() => lazyLoadType.value === 'automatic');\n\n const emitLazyLoadEvent = () => {\n emit(BentoDatagridEvent.UPDATE_SHOW_MORE);\n };\n\n watch(\n () => verticalScrollPosition.value,\n () => {\n if (isInfiniteScroll.value) {\n const height = body.value.offsetHeight;\n const percentageOffset = (height / verticalScrollPosition.value) * 100;\n if (percentageOffset > LAZY_LOAD_BUFFER_PERCENTAGE && !isLoading.value) {\n emitLazyLoadEvent();\n }\n }\n }\n );\n\n return { isLazyLoad, isInfiniteScroll, verticalScrollPosition, emitLazyLoadEvent };\n};\n","import { computed, reactive, ref } from 'vue';\nimport { MaybeRef } from '@/types';\nimport { BentoColumn, BentoDatagridEvent } from '../../data-grid.types';\nimport type { SetupContext } from 'vue/types/v3-setup-context';\nimport {\n BentoDatagridDraggingColumnState,\n DatagridColumnsEvent,\n} from '@/components/data-grid/components/data-grid-columns/data-grid-columns.types';\n\n/**\n * A composable that handles all the column dragging logic.\n * This allows users to re-arrange the column order.\n * @param columnsRef The reference to the array of columns.\n * @param hasDraggableColumnsRef The reference to the hasDraggableColumns prop.\n * @param emit The Datagrid emit function.\n */\nexport const useColumnReorderer = (\n columnsRef: MaybeRef<BentoColumn[]>,\n hasDraggableColumnsRef: MaybeRef<boolean>,\n emit: SetupContext['emit']\n) => {\n const columns = ref(columnsRef);\n const hasDraggableColumns = ref(hasDraggableColumnsRef);\n\n const draggingColumns = reactive<BentoDatagridDraggingColumnState>({\n dragging: null,\n dragToLeft: null,\n target: null,\n });\n\n const onMoveColumnByOffset = (movingColumn: BentoColumn, offset = 0) => {\n const fromIndex = columns.value.findIndex(c => c.field === movingColumn.field);\n const toIndex = fromIndex + offset;\n if (toIndex < 0 || toIndex > columns.value.length - 1) {\n return;\n }\n\n // If the move is inside the bounds of the columns array, we can move\n // const toColumn = columns.value[toIndex];\n const reorderedColumns = [...columns.value];\n reorderedColumns.splice(toIndex, 0, reorderedColumns.splice(fromIndex, 1)[0]);\n\n emit(BentoDatagridEvent.COLUMNS, reorderedColumns);\n emit(BentoDatagridEvent.UPDATE_COLUMNS, reorderedColumns);\n };\n\n const onDragStart = (column: BentoColumn, e: DragEvent & Event) => {\n draggingColumns.dragging = column;\n e.dataTransfer.setData('text', ''); // dataTransfer needed for firefox\n e.dataTransfer.dropEffect = 'move';\n };\n\n const onDragEnter = (column: BentoColumn, dragEvent: DragEvent) => {\n draggingColumns.target = column;\n const targetRect = (dragEvent.currentTarget as HTMLElement).getBoundingClientRect();\n const midpoint = targetRect.left + targetRect.width / 2;\n const clientX = dragEvent.clientX ?? 0;\n draggingColumns.dragToLeft = clientX <= midpoint;\n };\n\n const onDrop = (column: BentoColumn) => {\n if (draggingColumns.dragging?.field !== column.field) {\n // Re-order columns\n const fromIndex = columns.value.findIndex(c => c.field === draggingColumns.dragging?.field);\n const toIndexInitial = columns.value.findIndex(c => c.field === column.field);\n const toIndex = draggingColumns.dragToLeft ? toIndexInitial : toIndexInitial + 1;\n const toLeftOfToIndex = toIndex > fromIndex ? toIndex - 1 : toIndex;\n let reorderedColumns = [...columns.value];\n\n reorderedColumns.splice(\n toLeftOfToIndex === -1 ? 0 : toLeftOfToIndex,\n 0,\n reorderedColumns.splice(fromIndex, 1)[0]\n );\n\n const firstUnfrozenColumn = columns.value.findIndex(c => !c?.frozen);\n // Make sure to change the frozen state of the dragged column to the column the user is dropping on\n // However don't change the state if we are dragging over the first un-frozen column\n if (draggingColumns.dragging?.frozen !== column.frozen && toIndex !== firstUnfrozenColumn) {\n reorderedColumns = reorderedColumns.map(col =>\n draggingColumns.dragging?.field === col.field ? { ...col, frozen: !!column?.frozen } : col\n );\n }\n\n emit(BentoDatagridEvent.COLUMNS, reorderedColumns);\n emit(BentoDatagridEvent.UPDATE_COLUMNS, reorderedColumns);\n }\n\n draggingColumns.dragging = null;\n draggingColumns.target = null;\n };\n\n const onDragEnd = () => {\n draggingColumns.dragging = null;\n draggingColumns.dragToLeft = null;\n draggingColumns.target = null;\n };\n\n // Drag events for the `data-grid-columns`\n const draggingEventsForColumns = computed(() => {\n if (!hasDraggableColumns.value) {\n return {};\n }\n\n return {\n [DatagridColumnsEvent.COLUMN_DRAG_START]: (column: BentoColumn, e: DragEvent & Event) =>\n onDragStart(column, e),\n [DatagridColumnsEvent.COLUMN_DRAG_ENTER]: (column: BentoColumn, dragEvent: DragEvent) =>\n onDragEnter(column, dragEvent),\n [DatagridColumnsEvent.COLUMN_DROP]: (column: BentoColumn) => onDrop(column),\n [DatagridColumnsEvent.COLUMN_DRAG_END]: () => onDragEnd(),\n };\n });\n\n // Drag events for row cell\n const draggingEventsForRowCell = computed(() => (column: BentoColumn) => {\n if (!hasDraggableColumns.value) {\n return {};\n }\n\n return {\n dragenter: (e: DragEvent) => {\n e.preventDefault();\n onDragEnter(column, e);\n },\n drop: () => {\n onDrop(column);\n },\n dragover: (e: DragEvent) => {\n e.preventDefault();\n },\n };\n });\n\n return {\n // Values\n draggingColumns,\n\n // Methods\n draggingEventsForColumns,\n draggingEventsForRowCell,\n onMoveColumnByOffset,\n };\n};\n","import { MaybeRef } from '@/types';\nimport { BentoColumn, BentoDatagridEvent } from '../../data-grid.types';\nimport { computed, ref } from 'vue';\nimport { DATAGRID_SELECT_FIELD_NAME } from '../use-calculate-column-width/use-calculate-column-width';\nimport type { SetupContext } from 'vue/types/v3-setup-context';\nimport { DatagridConfigSettingsColumnSets } from './use-config.settings.types';\n\n/**\n * All Datagrid configuration settings logic:\n * - Condensed view toggle\n * - Frozen / unfrozen columns sorting and column sets\n * - Emitting a new array of colums with a new updated column\n * - Emitting new updated array of columns\n *\n * @param condensed Initial state of condensed view toggle\n * @param emit The `bento-data-grid` emit function\n * @returns Condensed view data & event handler\n */\nexport const useConfigSettings = (columnsRef: MaybeRef<BentoColumn[]>, emit: SetupContext['emit']) => {\n const columns = ref(columnsRef);\n\n // Frozen and unfrozen columns\n const sortedColumnsByFreezeState = computed(() =>\n [...columns.value].sort((a, b) => {\n if (a.frozen === b.frozen) {\n return 0;\n }\n return a.frozen ? -1 : 1;\n })\n );\n const frozenColumns = computed(() =>\n sortedColumnsByFreezeState.value.filter(col => col.frozen && col.visible !== false)\n );\n const unfrozenColumns = computed(() =>\n sortedColumnsByFreezeState.value.filter(col => !col.frozen && col.visible !== false)\n );\n const columnSets = computed<DatagridConfigSettingsColumnSets>(() =>\n [\n { columnSet: frozenColumns.value, id: 'frozen', isFrozenColumns: true },\n { columnSet: unfrozenColumns.value, id: 'unfrozen' },\n ].filter(({ columnSet }) => columnSet.length)\n );\n const isOnlyOneVisibleColumn = computed(\n () =>\n columns.value.filter(col => col?.visible !== false && col?.field !== DATAGRID_SELECT_FIELD_NAME).length ===\n 1\n );\n\n const onConfigSettingsUpdate = (isCondensedView: boolean) =>\n emit(BentoDatagridEvent.UPDATE_CONDENSED, isCondensedView);\n\n // Emits an updated array of columns\n const onConfigSettingsColumnsUpdate = (newColumns: BentoColumn[]) => {\n emit(BentoDatagridEvent.COLUMNS, newColumns);\n emit(BentoDatagridEvent.UPDATE_COLUMNS, newColumns);\n };\n\n // Updates and then emits an updated array of columns\n const onConfigSettingsColumnUpdate = (updatedColumn: BentoColumn) => {\n const updatedColumns = sortedColumnsByFreezeState.value.map(col =>\n col?.field === updatedColumn.field ? updatedColumn : col\n );\n onConfigSettingsColumnsUpdate(updatedColumns);\n };\n\n return {\n // Values\n columnSets,\n isOnlyOneVisibleColumn,\n sortedColumns: sortedColumnsByFreezeState,\n\n // Methods\n onConfigSettingsUpdate,\n onConfigSettingsColumnsUpdate,\n onConfigSettingsColumnUpdate,\n };\n};\n","import { nextTick, onMounted, onUnmounted, ref, Ref, watch } from 'vue';\nimport { observeSizeOfElement } from '@/utils/ts/resize';\n\n/**\n * Calculates the height of an element based on its ref and whether it is sticky or not\n *\n * @param {Ref<HTMLDivElement>} elementRef Reference to the element\n * @param {Ref<boolean>} options.fitContent Reference to a sticky prop\n * @returns Height of the element\n */\nexport const useCalculateStickyElementHeight = (elementRef: Ref<HTMLDivElement>, isSticky: Ref<boolean>) => {\n const topPosition = ref(0);\n let filtersElementObserver: ResizeObserver | null = null;\n\n const setTopPosition = () => {\n if (elementRef?.value && isSticky.value) {\n topPosition.value = elementRef.value.offsetHeight;\n }\n };\n\n onMounted(() => {\n nextTick(() => {\n // Keep watching element until it's defined, then observe its offsetHeight\n const stop = watch(\n elementRef,\n () => {\n if (elementRef?.value) {\n nextTick(() => stop());\n filtersElementObserver = observeSizeOfElement(elementRef.value, () => {\n setTopPosition();\n });\n }\n },\n { immediate: true }\n );\n watch(\n isSticky,\n () => {\n if (isSticky.value) {\n setTopPosition();\n } else {\n topPosition.value = 0;\n }\n },\n { immediate: true }\n );\n });\n });\n\n onUnmounted(() => {\n filtersElementObserver?.disconnect();\n });\n\n return topPosition;\n};\n","import { nextTick, onMounted, ref, Ref, watch } from 'vue';\nimport { isVue3 } from 'vue-demi';\n\n/**\n * Handles all scroll events & logic for the DataGrid.\n * @param body The reference to the DataGrid body element.\n * @param columnsRef The reference to the row of column headers element.\n * @param verticalScrollPosition The reference to scroll top position number.\n * @returns Update methods for updating the scroll ppsotion references & the body scroll & overflow attributes.\n */\nexport const useScroller = (\n body: Ref<HTMLDivElement>,\n columnsRef: Ref<HTMLDivElement>,\n verticalScrollPosition: Ref<number>\n) => {\n const scrollLeftPosition = ref(0);\n const hasLeftOverflow = ref(false);\n const hasRightOverflow = ref(false);\n\n /* eslint-disable no-param-reassign */\n /* == Scrolling == */\n // Sync body and column headers scrolling\n watch(\n () => scrollLeftPosition.value,\n () => {\n body.value.scrollLeft = scrollLeftPosition.value;\n columnsRef.value.scrollLeft = scrollLeftPosition.value;\n hasLeftOverflow.value = !!scrollLeftPosition.value;\n hasRightOverflow.value =\n columnsRef.value.scrollWidth - columnsRef.value.offsetWidth > scrollLeftPosition.value;\n }\n );\n\n onMounted(async () => {\n await nextTick();\n // Because there is an extra nextTick() for vue3 when rendering fluid columns in `use-calculate-column-width`,\n // we also need to wait an extra tick here in order to get the right widths\n if (isVue3) {\n await nextTick();\n }\n if (columnsRef.value?.offsetWidth < columnsRef.value?.scrollWidth) {\n hasRightOverflow.value = true;\n }\n });\n\n const updateScrollPosition = (event: Event) => {\n scrollLeftPosition.value = (event.target as HTMLDivElement).scrollLeft;\n verticalScrollPosition.value = body.value.scrollHeight - (event.target as HTMLDivElement).scrollTop;\n };\n\n const updateScrollPositionOnFrozenColumnsNavigation = (event: KeyboardEvent) => {\n if (event.key !== 'Tab' && event.key !== 'ArrowRight' && event.key !== 'ArrowLeft') {\n return;\n }\n\n event.preventDefault();\n\n body.value.scrollLeft = 0;\n // Using setTimeout to override the browser behavior of scrolling the parent element when a child is focused\n body.value.style.overflowX = 'hidden';\n setTimeout(() => {\n body.value.style.overflowX = 'auto';\n });\n };\n /* eslint-enable no-param-reassign */\n\n return {\n // Values\n scrollLeftPosition,\n hasLeftOverflow,\n hasRightOverflow,\n\n // Methods\n updateScrollPosition,\n updateScrollPositionOnFrozenColumnsNavigation,\n };\n};\n","import { computed, type Ref, ref } from 'vue';\nimport { DATAGRID_SELECT_FIELD_NAME } from '../use-calculate-column-width';\nimport type { BentoColumn } from '@/components/data-grid';\nimport type { DatagridConfigSettingsColumnSets } from '../use-config-settings/use-config.settings.types';\nimport type { DatagridColumnHoveringState } from './use-column-hovering.types';\n\nexport const useColumnHovering = (\n columnSets: Ref<DatagridConfigSettingsColumnSets>,\n selectable: Ref<boolean>,\n outline: Ref<boolean>,\n isTotalWidthOfColumnsTakingUpAllAvailableGridWidth: Ref<boolean>\n) => {\n const hoveredOverColumn = ref<BentoColumn>(null);\n const hoveredOverColumnState = computed<DatagridColumnHoveringState>(() => {\n if (!hoveredOverColumn.value || hoveredOverColumn.value.field === DATAGRID_SELECT_FIELD_NAME) {\n return {\n hoveredOverColumnField: '',\n isSeparatorOffset: false,\n noBorderLeft: false,\n noBorderRight: false,\n };\n }\n\n const frozenColumnSet = columnSets.value\n .find(colSet => colSet.isFrozenColumns)\n ?.columnSet?.filter(col => col.field !== DATAGRID_SELECT_FIELD_NAME);\n const unFrozenColumnSet = columnSets.value.find(colSet => !colSet?.isFrozenColumns);\n\n const isFirstFrozenColumn =\n hoveredOverColumn.value.frozen && frozenColumnSet?.[0].field === hoveredOverColumn.value.field;\n const isFirstUnfrozenColumn =\n !hoveredOverColumn.value.frozen &&\n unFrozenColumnSet?.columnSet?.[0].field === hoveredOverColumn.value.field;\n\n // Cases where no left border should be shown\n // If Frozen, selectable off, outline on, first column\n const isFrozenSelectableOutlineOnFirstCol = (selectable.value || outline.value) && isFirstFrozenColumn;\n // If No frozen columns & not frozen, selectable off, outline on, first column\n const isNoFrozenColAndNotFrozenSelectableOutlineOnFirstCol =\n (selectable.value || outline.value) && !frozenColumnSet && isFirstUnfrozenColumn;\n // If are frozen columns & not frozen, first column\n const isFrozenColumnsAndNotFrozenFirstColumn = frozenColumnSet && isFirstUnfrozenColumn;\n\n // Cases where no right border should be shown\n // If frozen column, last column\n const isFrozenColumnsAndLastFrozenColumn =\n frozenColumnSet?.length > 0 &&\n hoveredOverColumn.value.frozen &&\n frozenColumnSet?.[frozenColumnSet.length - 1].field === hoveredOverColumn.value.field;\n // If outline is on, all columns are taking up width of the grid container and is last column\n const isOutlineOnAllColumnWidthFitContainerAndLastColumn =\n outline.value &&\n isTotalWidthOfColumnsTakingUpAllAvailableGridWidth.value &&\n !hoveredOverColumn.value.frozen &&\n unFrozenColumnSet?.columnSet?.[unFrozenColumnSet.columnSet.length - 1].field ===\n hoveredOverColumn.value.field;\n\n return {\n hoveredOverColumnField: hoveredOverColumn.value.field,\n isSeparatorOffset: isOutlineOnAllColumnWidthFitContainerAndLastColumn,\n noBorderLeft:\n !!isFrozenSelectableOutlineOnFirstCol ||\n !!isNoFrozenColAndNotFrozenSelectableOutlineOnFirstCol ||\n !!isFrozenColumnsAndNotFrozenFirstColumn,\n\n noBorderRight: !!isFrozenColumnsAndLastFrozenColumn || !!isOutlineOnAllColumnWidthFitContainerAndLastColumn,\n };\n });\n\n return {\n hoveredOverColumn,\n hoveredOverColumnState,\n };\n};\n\nexport default useColumnHovering;\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><g fill=\"#00112C\" :clip-path=\"'url(#uia-icons-16-arrow_up_down_sort__a' + uuid + ')'\"><path d=\"M9.06077 4.00011L5.00011 -0.0605469L0.939453 4.00011L2.00011 5.06077L4.25 2.81089V10.75H5.75V2.81066L8.00011 5.06077L9.06077 4.00011Z\"/><path d=\"M10.25 13.1893L8.00011 10.9395L6.93945 12.0001L11.0001 16.0608L15.0608 12.0001L14.0001 10.9395L11.75 13.1896V5.25H10.25V13.1893Z\"/></g><defs><clipPath :id=\"'uia-icons-16-arrow_up_down_sort__a' + uuid\"><rect width=\"16\" height=\"16\" fill=\"#fff\"/></clipPath></defs></svg>\n</template>\n<script>\n let uuid = 0;\n\n export default {\n beforeCreate() {\n this.uuid = uuid.toString();\n uuid += 1;\n },\n };\n</script>\n<style>\n @import '../css/main.css';\n</style>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#00112C\" d=\"M12.1933 8.7454L7.93903 12.9996L8.99969 14.0603L15.0604 7.99963L8.99969 1.93896L7.93903 2.99963L12.1848 7.24541L1.24902 7.25658L1.25056 8.75658L12.1933 8.7454Z\"/></svg>\n</template>\n<script>\n let uuid = 0;\n\n export default {\n beforeCreate() {\n this.uuid = uuid.toString();\n uuid += 1;\n },\n };\n</script>\n<style>\n @import '../css/main.css';\n</style>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><g :clip-path=\"'url(#uia-icons-16-freeze__a' + uuid + ')'\"><path fill=\"#00112C\" d=\"M7.99989 14.0605L9.49989 15.5605L10.5605 14.4999L8.75 12.6893V10.9334L10.169 10.116L11.6861 10.9939L12.3501 13.4688L13.7988 13.0801L13.2488 11.0301L15.2988 10.4801L14.9101 9.03129L12.4363 9.695L10.9199 8.81745V7.18276L12.4365 6.3051L14.9101 6.96875L15.2988 5.51999L13.2488 4.96999L13.7988 2.91999L12.3501 2.53129L11.686 5.00635L10.1693 5.88407L8.75 5.06648L8.75 3.31043L10.5605 1.49989L9.49989 0.439226L7.99989 1.93923L6.49989 0.439226L5.43923 1.49989L7.25 3.31066V5.06639L5.83078 5.88392L4.31419 5.00626L3.65018 2.53129L2.20141 2.91998L2.384 3.60052L2.38063 3.60143L2.75032 4.97028L0.701408 5.51999L1.0901 6.96875L1.7708 6.78612L1.77173 6.78955L3.56437 6.30541L5.07992 7.18246L5.07992 8.81775L3.564 9.69502L1.0901 9.03129L0.701408 10.4801L2.75141 11.0301L2.20141 13.0801L3.65018 13.4687L4.31414 10.994L5.83106 10.1161L7.25 10.9335V12.6891L5.43923 14.4999L6.49989 15.5605L7.99989 14.0605ZM9.41992 7.18345V8.81644L7.99992 9.63441L6.57992 8.81644L6.57992 7.18345L7.99992 6.36548L9.41992 7.18345Z\"/></g><defs><clipPath :id=\"'uia-icons-16-freeze__a' + uuid\"><rect width=\"16\" height=\"16\" fill=\"#fff\" transform=\"matrix(1 0 0 -1 0 16)\"/></clipPath></defs></svg>\n</template>\n<script>\n let uuid = 0;\n\n export default {\n beforeCreate() {\n this.uuid = uuid.toString();\n uuid += 1;\n },\n };\n</script>\n<style>\n @import '../css/main.css';\n</style>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#00112C\" d=\"M2.99035 14.0608L14.051 3.00011L12.9903 1.93945L1.92969 13.0001L2.99035 14.0608Z\"/><path fill=\"#00112C\" d=\"M13.9404 5.23L12.8704 6.3C13.4704 6.97 13.9004 7.62 14.1304 8C13.4704 9.07 11.2504 12.25 8.00039 12.25C7.67039 12.25 7.34039 12.22 7.03039 12.14L5.80039 13.37C6.48039 13.61 7.21039 13.75 8.00039 13.75C12.7425 13.75 15.4838 8.69421 15.6649 8.36011C15.6671 8.35603 15.6689 8.35265 15.6704 8.35L15.8504 8L15.6704 7.65C15.6204 7.55 15.0204 6.43 13.9404 5.23Z\"/><path fill=\"#00112C\" d=\"M8.96039 3.85C8.65039 3.78 8.33039 3.75 8.00039 3.75C4.75039 3.75 2.53039 6.93 1.87039 8C2.10039 8.38 2.53039 9.02 3.12039 9.69L2.06039 10.75C0.98039 9.56 0.380391 8.45 0.330391 8.35L0.150391 8L0.330391 7.65C0.331838 7.64735 0.333668 7.64397 0.33588 7.63989C0.517034 7.30578 3.25829 2.25 8.00039 2.25C8.79039 2.25 9.52039 2.39 10.1904 2.62L8.96039 3.85Z\"/></svg>\n</template>\n<script>\n let uuid = 0;\n\n export default {\n beforeCreate() {\n this.uuid = uuid.toString();\n uuid += 1;\n },\n };\n</script>\n<style>\n @import '../css/main.css';\n</style>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><g fill=\"#00112C\" :clip-path=\"'url(#uia-icons-16-sort_ascending__a' + uuid + ')'\"><path d=\"M12.0001 1.93945L16.0608 6.00011L15.0001 7.06077L12.75 4.81066V12.75H11.25V4.81089L9.00011 7.06077L7.93945 6.00011L12.0001 1.93945Z\"/><path d=\"M6.75 7.25H1.25V8.75H6.75V7.25Z\"/><path d=\"M1.25 11.25H8.75V12.75H1.25V11.25Z\"/><path d=\"M6.75 3.25H1.25V4.75H6.75V3.25Z\"/></g><defs><clipPath :id=\"'uia-icons-16-sort_ascending__a' + uuid\"><rect width=\"16\" height=\"16\" fill=\"#fff\"/></clipPath></defs></svg>\n</template>\n<script>\n let uuid = 0;\n\n export default {\n beforeCreate() {\n this.uuid = uuid.toString();\n uuid += 1;\n },\n };\n</script>\n<style>\n @import '../css/main.css';\n</style>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><g fill=\"#00112C\" :clip-path=\"'url(#uia-icons-16-sort_descending__a' + uuid + ')'\"><path d=\"M12.75 3.25V11.1896L15.0001 8.93945L16.0608 10.0001L12.0001 14.0608L7.93945 10.0001L9.00011 8.93945L11.25 11.1893V3.25H12.75Z\"/><path d=\"M6.75 7.25H1.25V8.75H6.75V7.25Z\"/><path d=\"M1.25 3.25H9.09V4.75H1.25V3.25Z\"/><path d=\"M6.75 11.25H1.25V12.75H6.75V11.25Z\"/></g><defs><clipPath :id=\"'uia-icons-16-sort_descending__a' + uuid\"><rect width=\"16\" height=\"16\" fill=\"#fff\"/></clipPath></defs></svg>\n</template>\n<script>\n let uuid = 0;\n\n export default {\n beforeCreate() {\n this.uuid = uuid.toString();\n uuid += 1;\n },\n };\n</script>\n<style>\n @import '../css/main.css';\n</style>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#00112C\" d=\"M8 5.25C6.48122 5.25 5.25 6.48122 5.25 8C5.25 9.51878 6.48122 10.75 8 10.75C9.51878 10.75 10.75 9.51878 10.75 8C10.75 6.48122 9.51878 5.25 8 5.25ZM6.75 8C6.75 7.30964 7.30964 6.75 8 6.75C8.69036 6.75 9.25 7.30964 9.25 8C9.25 8.69036 8.69036 9.25 8 9.25C7.30964 9.25 6.75 8.69036 6.75 8Z\"/><path fill=\"#00112C\" d=\"M7.99964 2.25C5.50387 2.25 3.57073 3.66588 2.3086 4.9806C1.6704 5.64539 1.18078 6.30745 0.850599 6.80272C0.685043 7.05106 0.558349 7.2593 0.471981 7.40748C0.428769 7.48162 0.395568 7.54087 0.372564 7.58275C0.36106 7.60369 0.352097 7.6203 0.345701 7.63227L0.338032 7.64672L0.335646 7.65126L0.334488 7.65348L0.154297 8L0.334225 8.34601L0.999638 8C0.334225 8.34601 0.334814 8.34715 0.334814 8.34715L0.335646 8.34874L0.338032 8.35328L0.345701 8.36773C0.352097 8.3797 0.36106 8.39631 0.372564 8.41725C0.395568 8.45913 0.428769 8.51838 0.471981 8.59252C0.558349 8.7407 0.685043 8.94894 0.850599 9.19728C1.18078 9.69255 1.6704 10.3546 2.3086 11.0194C3.57073 12.3341 5.50387 13.75 7.99964 13.75C10.4954 13.75 12.4285 12.3341 13.6907 11.0194C14.3289 10.3546 14.8185 9.69255 15.1487 9.19728C15.3142 8.94894 15.4409 8.7407 15.5273 8.59252C15.5705 8.51838 15.6037 8.45913 15.6267 8.41725C15.6382 8.39631 15.6472 8.3797 15.6536 8.36773L15.6612 8.35328L15.6636 8.34874L15.6648 8.34652L15.845 8L15.6651 7.65399L14.9996 8C15.6651 7.65399 15.6645 7.65285 15.6645 7.65285L15.6636 7.65126L15.6612 7.64672L15.6536 7.63227C15.6472 7.6203 15.6382 7.60369 15.6267 7.58275C15.6037 7.54087 15.5705 7.48162 15.5273 7.40748C15.4409 7.2593 15.3142 7.05106 15.1487 6.80272C14.8185 6.30745 14.3289 5.64539 13.6907 4.9806C12.4285 3.66588 10.4954 2.25 7.99964 2.25ZM14.9996 8L15.6648 8.34652C15.6648 8.34652 15.6651 8.34601 14.9996 8ZM0.999638 8L0.334488 7.65348C0.334488 7.65348 0.334225 7.65399 0.999638 8ZM2.09867 8.36522C2.00649 8.22694 1.92852 8.10363 1.86519 8C1.92852 7.89637 2.00649 7.77306 2.09867 7.63478C2.39349 7.19255 2.82887 6.60461 3.39068 6.0194C4.52855 4.83412 6.09541 3.75 7.99964 3.75C9.90387 3.75 11.4707 4.83412 12.6086 6.0194C13.1704 6.60461 13.6058 7.19255 13.9006 7.63478C13.9928 7.77306 14.0708 7.89637 14.1341 8C14.0708 8.10363 13.9928 8.22694 13.9006 8.36522C13.6058 8.80745 13.1704 9.39539 12.6086 9.9806C11.4707 11.1659 9.90387 12.25 7.99964 12.25C6.09541 12.25 4.52855 11.1659 3.39068 9.9806C2.82887 9.39539 2.39349 8.80745 2.09867 8.36522Z\"/></svg>\n</template>\n<script>\n let uuid = 0;\n\n export default {\n beforeCreate() {\n this.uuid = uuid.toString();\n uuid += 1;\n },\n };\n</script>\n<style>\n @import '../css/main.css';\n</style>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#00112C\" d=\"M8 11.25L12.5 5.25H3.5L8 11.25Z\"/></svg>\n</template>\n<script>\n let uuid = 0;\n\n export default {\n beforeCreate() {\n this.uuid = uuid.toString();\n uuid += 1;\n },\n };\n</script>\n<style>\n @import '../css/main.css';\n</style>\n","<template>\n <div class=\"b-data-grid-columns\" :class=\"conditionalColumnsClasses\" data-testid=\"data-grid-columns\">\n <div\n v-for=\"(column, index) in columns\"\n :key=\"column.field\"\n :ref=\"el => registerColumnsRefs(el, column.field)\"\n :aria-colindex=\"index + 1\"\n :aria-label=\"column.label\"\n :aria-sort=\"getSortingColumnDirection(column)\"\n :class=\"conditionalColumnClasses(column, index)\"\n :data-testid=\"`${column.field}-column-header`\"\n :draggable=\"hasDraggableColumns && !isResizing && !isSelectColumn(column)\"\n class=\"b-data-grid-columns__column\"\n role=\"columnheader\"\n :tabindex=\"column.sortable || hasColumnPanel || column.infoIconTooltip ? '0' : '-1'\"\n :style=\"{ width: column.autoWidth && isMeasuringColumnWidths ? 'auto' : `${column.width}px` }\"\n v-on=\"dataGridColumnEvents(column)\"\n >\n <template v-if=\"!isSelectColumn(column)\">\n <div\n :aria-label=\"t('columnActions', { name: column.label })\"\n aria-live=\"polite\"\n role=\"region\"\n class=\"b-data-grid-columns__column-header-and-actions\"\n :class=\"conditionalColumnHeaderAndActionsClasses(column)\"\n >\n <bento-typography\n el=\"div\"\n strongest\n class=\"b-data-grid-columns__column-header\"\n :class=\"conditionalColumnHeaderClasses\"\n >\n <slot :column=\"column\" :name=\"`head-${column.field}`\">\n <span class=\"b-data-grid-columns__label\">{{ column.label }}</span>\n </slot>\n </bento-typography>\n <div\n v-if=\"hasColumnActions(column)\"\n class=\"b-data-grid-columns__column-actions\"\n :class=\"conditionalColumnActionsClasses(column)\"\n >\n <div v-if=\"column.infoIconTooltip\" class=\"b-data-grid-columns__column-info-icon\">\n <bento-info-icon :tooltip-text=\"column.infoIconTooltip\" />\n </div>\n <div v-if=\"column.sortable\" class=\"b-data-grid-columns__column-sort\">\n <bento-toggle-button\n condensed\n :toggled=\"isSorting(column.field)\"\n variant=\"tertiary\"\n @click=\"sortByColumnField(column.field)\"\n >\n <template #iconLeft>\n <arrow-up-and-down-sort-icon\n v-if=\"!getSortingDirection(column.field)\"\n :svg-title=\"t('sortColumn', { name: column.label })\"\n />\n <sort-ascending-icon\n v-else-if=\"\n getSortingDirection(column.field) === BentoDatagridSortDirection.ASCENDING\n \"\n :svg-title=\"t('sortColumnInDescendingOrder', { name: column.label })\"\n />\n <sort-descending-icon\n v-else-if=\"\n getSortingDirection(column.field) === BentoDatagridSortDirection.DESCENDING\n \"\n :svg-title=\"t('sortColumnInAscendingOrder', { name: column.label })\"\n />\n </template>\n </bento-toggle-button>\n </div>\n <bento-menu\n v-if=\"hasColumnPanel && hoveredColumnField === column.field\"\n :ref=\"el => (contextMenuRef[column.field] = el)\"\n class=\"b-data-grid-columns__menu\"\n :data=\"contextualMenuData(column)\"\n :menu-position=\"computeMenuPosition(hasFirstColumnPanelRightAligned, index)\"\n :menu-fixed-positioning=\"true\"\n :button=\"{ variant: 'tertiary', condensed: true }\"\n @open=\"$emit(DatagridColumnsEvent.COLUMN_MENU_OPEN)\"\n @close=\"$emit(DatagridColumnsEvent.COLUMN_MENU_CLOSE)\"\n />\n </div>\n </div>\n <div\n :data-testid=\"`data-grid-column-${column.field}`\"\n class=\"b-data-grid-columns__column-separator-container\"\n :class=\"conditionalColumnSeparatorClasses(column)\"\n role=\"presentation\"\n @mousedown=\"startResize(hasResizableColumns, column.field, $event)\"\n @click.stop\n >\n <div\n v-if=\"!isFrozenColumns || (isFrozenColumns && index !== columns.length - 1)\"\n class=\"b-data-grid-columns__column-separator\"\n ></div>\n </div>\n </template>\n <div v-else class=\"b-data-grid-columns__select-column\">\n <bento-checkbox\n :model-value=\"allItemsSelectedState.allItemsSelected\"\n data-testid=\"checkbox-select-all\"\n :indeterminate=\"allItemsSelectedState.isIndeterminate\"\n value=\"data-grid-select-all\"\n @update:model-value=\"onAllRowSelect\"\n />\n <template v-if=\"selectableAcrossPages\">\n <bento-menu\n class=\"b-data-grid-columns__select-column-menu\"\n :data=\"selectAllMenu\"\n menu-position=\"bottom-start\"\n menu-fixed-positioning\n :button=\"{ variant: 'tertiary', condensed: true }\"\n >\n <template #iconLeft>\n <triangle-down :svg-title=\"t('selectionMenu')\" />\n </template>\n </bento-menu>\n </template>\n </div>\n </div>\n </div>\n</template>\n\n<script lang=\"ts\" setup>\n import { type ComponentPublicInstance, computed, PropType, ref, toRefs } from 'vue';\n import { BentoCheckbox } from '@/components/checkbox';\n import {\n BentoColumn,\n BentoColumnWidthOverridesLookup,\n BentoDatagridAllItemsSelectedState,\n BentoDatagridAriaSortValue,\n BentoDatagridSortByColumn,\n BentoDatagridSortDirection,\n } from '../../data-grid.types';\n import { BentoTypography } from '@/components/typography';\n import { DATAGRID_SELECT_FIELD_NAME, useResizer, useSorter } from '../../composables';\n import { BentoInfoIcon } from '@/components/info-icon';\n import {\n BentoDatagridDraggingColumnState,\n DatagridColumnsEvent,\n DatagridColumnsHeaderReferences,\n } from './data-grid-columns.types';\n import { BentoMenu } from '@/components/menu';\n import { BentoToggleButton } from '@/components/button';\n import { useI18n } from '@/utils/ts/i18n';\n import type { BentoMenuItem } from '@/components/menu/components';\n import type { DatagridColumnHoveringState } from '@/components/data-grid/composables/use-column-hovering';\n import { BentoPopoverPositions } from '@/components/popover';\n import ArrowUpAndDownSortIcon from '@adyen/ui-assets-icons-16/vue/arrow-up-down-sort';\n import ArrowLeftIcon from '@adyen/ui-assets-icons-16/vue/arrow-left';\n import ArrowRightIcon from '@adyen/ui-assets-icons-16/vue/arrow-right';\n import FreezeIcon from '@adyen/ui-assets-icons-16/vue/freeze';\n import HideIcon from '@adyen/ui-assets-icons-16/vue/hide';\n import SortAscendingIcon from '@adyen/ui-assets-icons-16/vue/sort-ascending';\n import SortDescendingIcon from '@adyen/ui-assets-icons-16/vue/sort-descending';\n import ShowIcon from '@adyen/ui-assets-icons-16/vue/show';\n import TriangleDown from '@adyen/ui-assets-icons-16/vue/triangle-down';\n import messages from './messages.json';\n\n type MessageSchema = (typeof messages)['en-US'];\n\n const props = defineProps({\n /**\n * Column definitions using 'key' to relate to data object.\n */\n columns: {\n type: Array as PropType<BentoColumn[]>,\n required: true,\n },\n\n /**\n * Columns being dragged, contains dragging column and a target column\n */\n draggingColumns: {\n type: Object as PropType<BentoDatagridDraggingColumnState>,\n default: undefined,\n },\n\n /**\n * Toggle the columns draggable events.\n */\n hasDraggableColumns: {\n type: Boolean,\n default: true,\n },\n\n /**\n * If resize is enabled\n */\n hasResizableColumns: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Signifies if the column panel is enabled.\n */\n hasColumnPanel: {\n type: Boolean,\n default: false,\n },\n\n /**\n * If set to true, aligns the first column panel to the right of its button.\n */\n hasFirstColumnPanelRightAligned: {\n type: Boolean,\n default: false,\n },\n\n /**\n * If the data grid has overflow on the left side\n */\n hasLeftOverflow: {\n type: Boolean,\n default: false,\n },\n\n /**\n * The column hovered over state and whether the hovered over column should show a border right or left.\n */\n hoveredOverColumnState: {\n type: Object as PropType<DatagridColumnHoveringState>,\n required: true,\n },\n\n /**\n * Toggled to true when the DataGrid has auto width columns and is measuring the\n */\n isMeasuringColumnWidths: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Used to disable hiding the last visible column.\n */\n isOnlyOneVisibleColumn: {\n type: Boolean,\n default: false,\n },\n\n /**\n * If these columns are frozen (pinned) columns\n */\n isFrozenColumns: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Show frozen columns separator\n */\n showFrozenColumnsSeparator: {\n type: Boolean,\n default: false,\n },\n /**\n * The column all items selected state\n */\n allItemsSelectedState: {\n type: Object as PropType<BentoDatagridAllItemsSelectedState>,\n default: undefined,\n },\n\n /**\n * Adds an extra option when selecting all, to select items in other pages too\n */\n selectableAcrossPages: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Sortby handles proper rendering of sort icon in header. Sorting currently is only supported server side.\n * It does make sure the currently sorted column has a more visible sort icon, and the sort icon points in the right direction.\n */\n sortBy: {\n type: Array as PropType<BentoDatagridSortByColumn[]>, // NOTE: is an array to allow multi-sorting in the future\n default: () => [],\n },\n\n /**\n * Truncates all data grid column headers\n */\n truncateColumnHeaders: {\n type: Boolean,\n default: false,\n },\n });\n\n const emit = defineEmits<{\n /**\n * Emitted when a user manually resizes a column width.\n */\n (\n e: DatagridColumnsEvent.COLUMN_RESIZE,\n column: {\n field: string;\n width: number;\n }\n );\n\n /**\n * Triggered when a column is resized.\n */\n (e: DatagridColumnsEvent.COLUMN_RESIZING, value: BentoColumnWidthOverridesLookup);\n\n /**\n * Triggered when a column is sorted.\n */\n (e: DatagridColumnsEvent.SORT, updatedSortBy: BentoDatagridSortByColumn[]);\n\n /**\n * Triggered when selecting all rows.\n */\n (e: DatagridColumnsEvent.SELECT_ALL_ROWS, areAllItemsSelected: boolean);\n\n /**\n * Triggered when all rows across all pages are selected.\n */\n (e: DatagridColumnsEvent.SELECT_ALL_ACROSS_PAGES);\n\n /**\n * Triggered when a columns started to be dragged.\n */\n (e: DatagridColumnsEvent.COLUMN_DRAG_START, column: BentoColumn, event: DragEvent & Event);\n\n /**\n * Triggered when a column is being dragged over another DOM element.\n */\n (e: DatagridColumnsEvent.COLUMN_DRAG_ENTER, column: BentoColumn, event: DragEvent & Event);\n\n /**\n * Triggered when a column is being dragged and is dropped over another DOM element.\n */\n (e: DatagridColumnsEvent.COLUMN_DROP, column: BentoColumn);\n\n /**\n * Triggered when a column drag operation has ended.\n */\n (e: DatagridColumnsEvent.COLUMN_DRAG_END);\n\n /**\n * Triggered when a column is being moved by a certain offset.\n */\n (e: DatagridColumnsEvent.COLUMN_MOVE, movingColumn: BentoColumn, offset: number);\n\n /**\n * Triggered when a column is updated.\n */\n (e: DatagridColumnsEvent.COLUMN_UPDATE, column: BentoColumn);\n\n /**\n * Triggered when the column contextual menu is opened.\n */\n (e: DatagridColumnsEvent.COLUMN_MENU_OPEN);\n\n /**\n * Triggered when the column contextual menu is closed.\n */\n (e: DatagridColumnsEvent.COLUMN_MENU_CLOSE);\n\n /**\n * Emitted when a column header is hovered over.\n */\n (e: 'column-hover', columnKey: BentoColumn);\n }>();\n\n const CLOSING_CONTEXTUAL_MENU_DELAY_MS = 100;\n const { t } = useI18n<{ message: MessageSchema }>({ messages });\n const { columns, sortBy } = toRefs(props);\n const columnHeaderRefs = ref<DatagridColumnsHeaderReferences>({});\n const contextMenuRef = ref({});\n const hoveredColumnField = ref();\n const closingTimeOutId = ref();\n\n // Selecting\n const onAllRowSelect = (areAllItemsSelected: boolean) =>\n emit(DatagridColumnsEvent.SELECT_ALL_ROWS, areAllItemsSelected);\n const isSelectColumn = (column: BentoColumn) => column.field === DATAGRID_SELECT_FIELD_NAME;\n\n // Select all menu\n const selectAllMenu = computed(() => [\n {\n text: t('selectPage') as string,\n handler: () => onAllRowSelect(true),\n },\n {\n text: t('selectAll') as string,\n handler: () => emit(DatagridColumnsEvent.SELECT_ALL_ACROSS_PAGES),\n },\n ]);\n\n // Resizing\n const { startResize, isResizing, columnHoverEventToEmitAfterResizing } = useResizer(columns, emit);\n\n // Sorting\n const { isSorting, getSortingDirection, sortByColumnField } = useSorter(sortBy, columns, emit);\n const getSortingColumnDirection = (column: BentoColumn): BentoDatagridAriaSortValue => {\n if (!column.sortable) {\n return null;\n }\n\n const sortingDirection = props.sortBy.find(({ field }) => field === column.field)?.direction;\n\n if (!sortingDirection) {\n return BentoDatagridAriaSortValue.NONE;\n }\n\n const ariaSortingDirectionMap: { [key in BentoDatagridSortDirection]: BentoDatagridAriaSortValue } = {\n [BentoDatagridSortDirection.ASCENDING]: BentoDatagridAriaSortValue.ASCENDING,\n [BentoDatagridSortDirection.DESCENDING]: BentoDatagridAriaSortValue.DESCENDING,\n };\n\n return ariaSortingDirectionMap[sortingDirection];\n };\n\n // Dragging emit events and methods\n const draggingEventsForColumn = computed(() => (column: BentoColumn) => {\n if (!props.hasDraggableColumns) {\n return {};\n }\n\n return {\n dragstart: (e: DragEvent & Event) => {\n emit(DatagridColumnsEvent.COLUMN_DRAG_START, column, e);\n },\n dragover: (e: DragEvent) => {\n e.preventDefault();\n },\n dragenter: (e: DragEvent) => {\n e.preventDefault();\n emit(DatagridColumnsEvent.COLUMN_DRAG_ENTER, column, e);\n },\n drop: () => {\n emit(DatagridColumnsEvent.COLUMN_DROP, column);\n },\n dragend: () => {\n emit(DatagridColumnsEvent.COLUMN_DRAG_END);\n },\n };\n });\n\n // Contextual menu (moving, visiblity and freezing)\n const contextualMenuData = computed<(col: BentoColumn) => BentoMenuItem[]>(() => (column: BentoColumn) => [\n {\n text: t('moveColumnLeft') as string,\n handler: () => emit(DatagridColumnsEvent.COLUMN_MOVE, column, -1),\n icon: ArrowLeftIcon,\n disabled: props.columns[0].field === column.field,\n },\n {\n text: t('moveColumnRight') as string,\n handler: () => emit(DatagridColumnsEvent.COLUMN_MOVE, column, 1),\n icon: ArrowRightIcon,\n disabled: props.columns[props.columns.length - 1].field === column.field,\n },\n {\n text: (column?.frozen ? t('unfreezeColumn') : t('freezeColumn')) as string,\n handler: () => emit(DatagridColumnsEvent.COLUMN_UPDATE, { ...column, frozen: !column?.frozen }),\n icon: FreezeIcon,\n },\n {\n text: (column?.visible !== false ? t('hideColumn') : t('showColumn')) as string,\n handler: () => {\n emit(DatagridColumnsEvent.COLUMN_UPDATE, {\n ...column,\n visible: !(column?.visible !== false),\n });\n },\n icon: column?.visible !== false ? HideIcon : ShowIcon,\n disabled: column?.mandatory || (column?.visible !== false && props.isOnlyOneVisibleColumn),\n },\n ]);\n const showContextualMenu = (column: BentoColumn) => {\n hoveredColumnField.value = column.field;\n if (closingTimeOutId.value) {\n clearTimeout(closingTimeOutId.value);\n }\n };\n const hideContextualMenu = () => {\n // We want to delay closing for a couple of seconds so\n // it doesn't flicker if a user hovers over the icon and then inside the popover.\n const timeOutId = setTimeout(() => {\n hoveredColumnField.value = '';\n }, CLOSING_CONTEXTUAL_MENU_DELAY_MS);\n closingTimeOutId.value = timeOutId;\n };\n\n /**\n * Generates events for a Datagrid Column.\n * @param column - the BentoColumn we are attaching events onto.\n */\n const dataGridColumnEvents = (column: BentoColumn) => {\n let events: { [eventName: string]: (e: Event) => void } = {\n mouseenter: () => {\n showContextualMenu(column);\n if (!isResizing.value) {\n emit('column-hover', column);\n } else {\n columnHoverEventToEmitAfterResizing.value = column;\n }\n },\n mouseleave: () => {\n hideContextualMenu();\n if (!isResizing.value) {\n emit('column-hover', null);\n } else {\n columnHoverEventToEmitAfterResizing.value = null;\n }\n },\n focus: () => showContextualMenu(column),\n };\n if (!isSelectColumn(column)) {\n events = {\n ...events,\n ...draggingEventsForColumn.value(column),\n };\n }\n return events;\n };\n\n const hasColumnActions = (column: BentoColumn) => column.infoIconTooltip || column.sortable || props.hasColumnPanel;\n\n const registerColumnsRefs = (el: Element | ComponentPublicInstance, field: string) => {\n if (columnHeaderRefs.value?.[field] === undefined) {\n columnHeaderRefs.value = { ...columnHeaderRefs.value, [field]: null };\n }\n if (el !== null) {\n columnHeaderRefs.value[field] = el as HTMLDivElement;\n }\n };\n\n // Conditional column styles\n // Conditional styles\n const conditionalColumnsClasses = computed(() =>\n columns.value[0]?.frozen\n ? {\n 'b-data-grid-columns--frozen': true,\n 'b-data-grid-columns--frozen-separator': props.showFrozenColumnsSeparator,\n 'b-data-grid-columns--overflow-shadow-left': props.hasLeftOverflow,\n }\n : {\n 'b-data-grid-columns--unfrozen': true,\n }\n );\n\n const computeMenuPosition = (hasFirstColumnPanelRightAligned, index) =>\n hasFirstColumnPanelRightAligned && index === 0\n ? BentoPopoverPositions.BOTTOM_START\n : BentoPopoverPositions.BOTTOM_END;\n\n const conditionalColumnClasses = (column: BentoColumn, columnIndex: number) => ({\n 'b-data-grid-columns__column--column-hovered':\n column.field === props.hoveredOverColumnState.hoveredOverColumnField,\n 'b-data-grid-columns__column--column-hovered-no-border-left':\n column.field === props.hoveredOverColumnState.hoveredOverColumnField &&\n props.hoveredOverColumnState.noBorderLeft,\n 'b-data-grid-columns__column--column-hovered-no-border-right':\n column.field === props.hoveredOverColumnState.hoveredOverColumnField &&\n props.hoveredOverColumnState.noBorderRight,\n 'b-data-grid-columns__column--last-frozen-frozen-column':\n props.isFrozenColumns && columnIndex === columns.value.length - 1,\n 'b-data-grid-columns__column--sortable': column.sortable,\n 'b-data-grid-columns__column--padding-left-unset': column?.padding?.left === false,\n 'b-data-grid-columns__column--padding-right-unset': column?.padding?.right === false,\n 'b-data-grid-columns__column--numeric': column?.numeric,\n 'b-data-grid-columns__column--frozen': column?.frozen,\n 'b-data-grid-columns__column--is-re-ordering': column?.field === props.draggingColumns?.dragging?.field,\n 'b-data-grid-columns__column--is-re-ordering-target-left':\n column?.field === props.draggingColumns?.target?.field && props.draggingColumns?.dragToLeft,\n 'b-data-grid-columns__column--is-re-ordering-target-right':\n column?.field === props.draggingColumns?.target?.field && !props.draggingColumns?.dragToLeft,\n 'b-data-grid-columns__column--with-sorting-or-column-panel':\n column.sortable ||\n column.infoIconTooltip ||\n (props.hasColumnPanel && hoveredColumnField.value === column.field) ||\n props.selectableAcrossPages,\n });\n\n const conditionalColumnHeaderAndActionsClasses = (column: BentoColumn) => ({\n 'b-data-grid-columns__column-header-and-actions--numeric': column?.numeric,\n });\n\n const conditionalColumnActionsClasses = (column: BentoColumn) => ({\n 'b-data-grid-columns__column-actions--numeric': column?.numeric,\n });\n\n const conditionalColumnSeparatorClasses = (column: BentoColumn) => ({\n 'b-data-grid-columns__column-separator-container--is-resizeable': props.hasResizableColumns,\n 'b-data-grid-columns__column-separator-container--is-offset':\n props.hoveredOverColumnState.hoveredOverColumnField === column.field &&\n props.hoveredOverColumnState.isSeparatorOffset,\n });\n\n const conditionalColumnHeaderClasses = computed(() => ({\n 'b-data-grid-columns__column-header--truncated': props.truncateColumnHeaders,\n }));\n\n // Exposed refs\n defineExpose({\n columnHeaderRefs,\n });\n</script>\n\n<script lang=\"ts\">\n /**\n * A component to display the BentoDataGrid columns\n *\n * @example\n *\n * export default {\n * components: { DataGridColumns },\n * template: `\n * <data-grid-columns\n * v-if=\"columnSet?.length\"\n * :key=\"`data-grid-columns-${id}`\"\n * :columns=\"columnSet\"\n * :has-resizable-columns=\"hasResizableColumns\"\n * :sort-by=\"sortBy\"\n * :all-items-selected-state=\"allItemsSelectedState\"\n * :is-frozen-columns=\"isFrozenColumns\"\n * :show-frozen-columns-separator=\"showFrozenColumnsSeparator\"\n * :dragging-columns=\"draggingColumns\"\n * :has-draggable-columns=\"allowColumnDragAndDrop\"\n * :has-column-panel=\"columnPanel\"\n * :has-left-overflow=\"hasLeftOverflow\"\n * :has-first-column-panel-right-aligned=\"index === computedColumnPanelAlignment\"\n * :is-only-one-visible-column=\"isOnlyOneVisibleColumn\"\n * :selectable-across-pages=\"selectableAcrossPagesComputed\"\n * :truncate-column-headers=\"truncateColumnHeaders\"\n * v-on=\"draggingEventsForColumns\"\n * @column-move=\"onMoveColumnByOffset\"\n * @column-update=\"onConfigSettingsColumnUpdate\"\n * @column-resize=\"onColumnResized\"\n * @column-resizing=\"onColumnWidthOverride\"\n * @select-all-rows=\"onAllRowSelect\"\n * @select-all-across-pages=\"emit(BentoDatagridEvent.SELECT_ALL_ACROSS_PAGES)\"\n * @sort=\"onSort\"\n * >\n * <template v-for=\"(_, innerSlot) of slots\" #[innerSlot]=\"scope\">\n * <slot :name=\"innerSlot\" v-bind=\"scope\" />\n * </template>\n * </data-grid-columns>\n * `\n * }\n */\n export default {\n i18n: { messages },\n name: 'data-grid-columns',\n };\n</script>\n\n<style lang=\"scss\" scoped src=\"./data-grid-columns.scss\" />\n","/**\n * All the emit events provided by the DatagridConfigSettings component\n */\nexport enum DatagridConfigSettingsEvent {\n CONFIG_SETTINGS = 'config-settings',\n UPDATE_COLUMNS = 'update:columns',\n}\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><g fill=\"#00112C\" :clip-path=\"'url(#uia-icons-16-settings__a' + uuid + ')'\"><path d=\"M8 5.25C6.48122 5.25 5.25 6.48122 5.25 8C5.25 9.51878 6.48122 10.75 8 10.75C9.51878 10.75 10.75 9.51878 10.75 8C10.75 6.48122 9.51878 5.25 8 5.25ZM6.75 8C6.75 7.30964 7.30964 6.75 8 6.75C8.69036 6.75 9.25 7.30964 9.25 8C9.25 8.69036 8.69036 9.25 8 9.25C7.30964 9.25 6.75 8.69036 6.75 8Z\"/><path d=\"M6.84701 0.973015L6.59985 0.35083L5.9537 0.526056C4.64534 0.880867 3.48225 1.56808 2.55285 2.48641L2.07533 2.95826L2.49158 3.48495C2.79648 3.87074 2.85279 4.419 2.58992 4.87589C2.32905 5.32931 1.82436 5.55631 1.33473 5.48726L0.677319 5.39455L0.505539 6.03586C0.33838 6.65992 0.25 7.32519 0.25 7.99991C0.25 8.67463 0.33838 9.3399 0.505539 9.96396L0.677319 10.6053L1.33473 10.5126C1.82436 10.4435 2.32905 10.6705 2.58992 11.1239C2.85279 11.5808 2.79648 12.1291 2.49158 12.5149L2.07533 13.0416L2.55285 13.5134C3.48225 14.4317 4.64534 15.119 5.9537 15.4738L6.59985 15.649L6.84701 15.0268C7.02659 14.5748 7.47549 14.2499 8 14.2499C8.52452 14.2499 8.97341 14.5748 9.15299 15.0268L9.40016 15.649L10.0463 15.4738C11.3547 15.119 12.5177 14.4317 13.4471 13.5134L13.9247 13.0416L13.5084 12.5149C13.2035 12.1291 13.1472 11.5808 13.4101 11.1239C13.671 10.6705 14.1756 10.4435 14.6653 10.5126L15.3227 10.6053L15.4945 9.96396C15.6616 9.3399 15.75 8.67463 15.75 7.99991C15.75 7.32519 15.6616 6.65992 15.4945 6.03586L15.3227 5.39455L14.6653 5.48726C14.1756 5.55631 13.671 5.32931 13.4101 4.87589C13.1472 4.419 13.2035 3.87074 13.5084 3.48495L13.9247 2.95826L13.4471 2.48641C12.5177 1.56808 11.3547 0.880867 10.0463 0.526056L9.40016 0.35083L9.15299 0.973015C8.97341 1.42506 8.52452 1.74991 8 1.74991C7.47549 1.74991 7.02659 1.42506 6.84701 0.973015ZM3.89008 5.62393C4.33946 4.84286 4.36394 3.9353 4.03405 3.16853C4.55803 2.73795 5.15349 2.39116 5.80146 2.14902C6.30062 2.81653 7.10051 3.24991 8 3.24991C8.89949 3.24991 9.69938 2.81653 10.1985 2.14902C10.8465 2.39116 11.442 2.73795 11.966 3.16853C11.6361 3.9353 11.6605 4.84287 12.1099 5.62393C12.5612 6.40839 13.3382 6.88092 14.1658 6.97982C14.221 7.31075 14.25 7.65319 14.25 7.99991C14.25 8.34663 14.221 8.68908 14.1658 9.02001C13.3382 9.11891 12.5612 9.59143 12.1099 10.3759C11.6605 11.157 11.6361 12.0645 11.9659 12.8313C11.442 13.2619 10.8465 13.6087 10.1985 13.8508C9.69938 13.1833 8.89949 12.7499 8 12.7499C7.10051 12.7499 6.30062 13.1833 5.80146 13.8508C5.15349 13.6087 4.55803 13.2619 4.03405 12.8313C4.36394 12.0645 4.33946 11.157 3.89008 10.3759C3.43875 9.59143 2.66177 9.1189 1.8342 9.02C1.77896 8.68908 1.75 8.34663 1.75 7.99991C1.75 7.65319 1.77896 7.31074 1.8342 6.97982C2.66177 6.88092 3.43875 6.40839 3.89008 5.62393Z\"/></g><defs><clipPath :id=\"'uia-icons-16-settings__a' + uuid\"><rect width=\"16\" height=\"16\" fill=\"#fff\"/></clipPath></defs></svg>\n</template>\n<script>\n let uuid = 0;\n\n export default {\n beforeCreate() {\n this.uuid = uuid.toString();\n uuid += 1;\n },\n };\n</script>\n<style>\n @import '../css/main.css';\n</style>\n","<template>\n <div class=\"b-data-grid-config-settings-column-row\" @mouseover=\"showFreezeIcon\" @mouseleave=\"hideFreezeIcon\">\n <bento-toggle\n :aria-label=\"$t('toggleColumnVisibility', { label: column.label })\"\n :disabled=\"isColumnVisibilityToggleDisabled\"\n label-position=\"after\"\n :value=\"isColumnVisible\"\n @input=\"toggleColumnVisibility\"\n >\n {{ column.label }}\n </bento-toggle>\n <bento-freeze-icon\n v-show=\"isColumnFrozen || isFreezeIconOptionShown\"\n :aria-label=\"$t('toggleColumnFreeze', { label: column.label })\"\n class=\"b-data-grid-config-settings-column-row__freeze-icon\"\n :class=\"freezeIconConditionalClasses\"\n @click.native=\"toggleColumnFreeze\"\n />\n </div>\n</template>\n\n<script lang=\"ts\">\n import { computed, defineComponent, PropType, ref } from 'vue';\n import { BentoToggle } from '@/components/toggle';\n import { BentoColumn } from '@/components/data-grid';\n import BentoFreezeIcon from '@adyen/ui-assets-icons-16/vue/freeze';\n import messages from './messages.json';\n\n export default defineComponent({\n i18n: { messages },\n name: 'bento-data-grid',\n components: {\n BentoFreezeIcon,\n BentoToggle,\n },\n props: {\n /**\n * Is column visibitlity toggle disabled\n */\n isColumnVisibilityToggleDisabled: {\n type: Boolean,\n required: true,\n },\n /**\n * Column definition\n */\n column: {\n type: Object as PropType<BentoColumn>,\n required: true,\n },\n },\n emits: ['visible-column', 'updated-column'],\n setup(props, { emit }) {\n const isFreezeIconOptionShown = ref(false);\n const isColumnFrozen = computed(() => props.column?.frozen);\n const isColumnVisible = computed(() => props.column?.visible !== false);\n\n const toggleColumnVisibility = () => {\n emit('visible-column', { ...props.column, visible: !isColumnVisible.value });\n };\n\n const toggleColumnFreeze = () => {\n emit('updated-column', { ...props.column, frozen: !isColumnFrozen.value });\n };\n\n const showFreezeIcon = () => {\n if (!isColumnFrozen.value) {\n isFreezeIconOptionShown.value = true;\n }\n };\n\n const hideFreezeIcon = () => {\n if (!isColumnFrozen.value) {\n isFreezeIconOptionShown.value = false;\n }\n };\n\n const freezeIconConditionalClasses = computed(() => ({\n [`b-data-grid-config-settings-column-row__freeze-icon--frozen`]: isColumnFrozen.value,\n }));\n\n return {\n // Values\n isFreezeIconOptionShown,\n isColumnFrozen,\n freezeIconConditionalClasses,\n isColumnVisible,\n\n // Methods\n toggleColumnVisibility,\n showFreezeIcon,\n hideFreezeIcon,\n toggleColumnFreeze,\n };\n },\n });\n</script>\n\n<style lang=\"scss\" scoped src=\"./data-grid-config-settings-column-row.scss\" />\n","<!-- TODO: Remove aria props from search-bar as these name clashes with JSX type /vue/types/jsx.d.ts -->\n<!-- eslint-disable vue/attribute-hyphenation -->\n<template>\n <div v-bento-click-outside-directive=\"onClickOutside\" class=\"b-data-grid-config-settings\">\n <div class=\"b-data-grid-config-settings__button-and-separator\">\n <div ref=\"configSettingsButtonRef\" class=\"b-data-grid-config-settings__button-container\">\n <bento-toggle-button\n :aria-controls=\"isConfigSettingsPanelOpen ? popoverId : null\"\n variant=\"tertiary\"\n condensed\n :toggled=\"isConfigSettingsPanelOpen\"\n @click=\"setConfigSettingsPanelVisibility(!isConfigSettingsPanelOpen)\"\n >\n <template #iconLeft>\n <bento-settings-icon :svg-title=\"$t('toggleConfigSettingsPanelVisibility')\" />\n </template>\n </bento-toggle-button>\n </div>\n </div>\n <bento-popover\n v-if=\"configSettingsButtonRef\"\n :id=\"popoverId\"\n :open=\"isConfigSettingsPanelOpen\"\n class=\"b-data-grid-config-settings__panel\"\n :aria-label=\"$t('configSettingsPanel')\"\n :target-element=\"configSettingsButtonRef\"\n position=\"bottom-end\"\n >\n <div class=\"b-data-grid-config-settings__panel-header\">\n <bento-typography el=\"span\" strongest>\n {{ $t('displayOptions') }}\n </bento-typography>\n <bento-button variant=\"tertiary\" @click=\"setConfigSettingsPanelVisibility(false)\">\n <template #iconLeft>\n <bento-cross-icon :svg-title=\"$t('closeConfigSettingsPanel')\" />\n </template>\n </bento-button>\n </div>\n <div class=\"b-data-grid-config-settings__condensed-view-settings\">\n <bento-typography class=\"b-data-grid-config-settings__condensed-view-title\" el=\"span\" stronger>\n {{ $t('size') }}\n </bento-typography>\n <bento-toggle\n label-position=\"after\"\n :aria-label=\"$t('condensedToggle')\"\n :value=\"condensed\"\n @input=\"emitCondensedToggle\"\n >\n {{ $t('condensed') }}\n </bento-toggle>\n </div>\n <div class=\"b-data-grid-config-settings__column-visibility-settings\">\n <div class=\"b-data-grid-config-settings__column-visibility-header\">\n <bento-typography class=\"b-data-grid-config-settings__column-visibility-title\" el=\"span\" stronger>\n {{ $t('columns') }}\n </bento-typography>\n <bento-button\n v-if=\"!isColumnVisibilityFilterShown\"\n ref=\"searchButtonRef\"\n variant=\"tertiary\"\n @click=\"toggleColumnFilter\"\n >\n <template #iconLeft><bento-search-icon /> </template>{{ $t('search') }}</bento-button\n >\n <bento-button v-else variant=\"tertiary\" @click=\"toggleColumnFilter\">\n <template #iconLeft>\n <bento-cross-icon />\n </template>\n {{ $t('closeSearch') }}\n </bento-button>\n </div>\n <div v-if=\"isColumnVisibilityFilterShown\" class=\"b-data-grid-config-settings__column-visibility-search\">\n <bento-search-bar\n ref=\"searchBarRef\"\n :value=\"searchTerm\"\n :input-field-aria-label=\"$t('columnVisibilitySearchFilter').toString()\"\n @input=\"searchTerm = $event\"\n @clear=\"clearAction\"\n @escape-pressed=\"toggleColumnFilter\"\n />\n </div>\n <div v-else class=\"b-data-grid-config-settings__column-visibility-show-all\">\n <bento-toggle\n label-position=\"after\"\n :value=\"allColumnsVisbilityToggleState\"\n @input=\"toggleAllColumnVisibility\"\n >\n {{ $t('showAllColumns', { numberOfColumns: columns.length }) }}\n </bento-toggle>\n </div>\n <div class=\"b-data-grid-config-settings__column-visibility-toggles\">\n <div v-for=\"column of filteredColumnVisibilityColumns\" :key=\"column.field\">\n <bento-data-grid-config-settings-config-row\n v-if=\"column.field !== DATAGRID_SELECT_FIELD_NAME\"\n :column=\"column\"\n :is-column-visibility-toggle-disabled=\"isColumnVisibilityToggleDisabled(column)\"\n @visible-column=\"emitVisibleColumns\"\n @updated-column=\"emitFrozenColumns\"\n />\n </div>\n <bento-typography\n v-if=\"filteredColumnVisibilityColumns.length === 0\"\n el=\"span\"\n class=\"b-data-grid-config-settings__column-visibility-empty-search-message\"\n >\n {{ $t('noColumnsMatch') }}\n </bento-typography>\n </div>\n </div>\n </bento-popover>\n </div>\n</template>\n\n<script lang=\"ts\">\n import { computed, defineComponent, nextTick, PropType, ref, toRef } from 'vue';\n import { BentoPopover } from '@/components/popover';\n import { BentoButton, BentoToggleButton } from '@/components/button';\n import { BentoTypography } from '@/components/typography';\n import { BentoToggle } from '@/components/toggle';\n import { BentoColumn } from '../../data-grid.types';\n import { BentoSearchBar, useSearchBarFilter } from '@/components/search-bar';\n import { BentoClickOutsideDirective } from '@/directives';\n import { DatagridConfigSettingsEvent } from './data-grid-config-settings.types';\n import BentoSettingsIcon from '@adyen/ui-assets-icons-16/vue/settings';\n import BentoCrossIcon from '@adyen/ui-assets-icons-16/vue/cross';\n import BentoSearchIcon from '@adyen/ui-assets-icons-16/vue/search';\n import BentoDataGridConfigSettingsConfigRow from './components/data-grid-config-settings-column-row/data-grid-config-settings-column-row.vue';\n import messages from './messages.json';\n import { generateUid } from '@/utils/ts/unique-id';\n import { DATAGRID_SELECT_FIELD_NAME } from '../../composables';\n\n export default defineComponent({\n i18n: { messages },\n name: 'bento-data-grid',\n components: {\n BentoButton,\n BentoCrossIcon,\n BentoPopover,\n BentoSettingsIcon,\n BentoToggleButton,\n BentoDataGridConfigSettingsConfigRow,\n BentoSearchBar,\n BentoSearchIcon,\n BentoToggle,\n BentoTypography,\n },\n directives: { BentoClickOutsideDirective },\n props: {\n /**\n * Column definitions\n */\n columns: {\n type: Array as PropType<BentoColumn[]>,\n required: true,\n },\n\n /**\n * Sets the row cells to the condensed padding state.\n */\n condensed: {\n type: Boolean,\n default: false,\n },\n },\n emits: [DatagridConfigSettingsEvent.CONFIG_SETTINGS, DatagridConfigSettingsEvent.UPDATE_COLUMNS],\n setup(props, { emit }) {\n const configSettingsButtonRef = ref(null);\n const popoverId = generateUid('data-grid-config-settings-popover');\n const searchBarRef = ref(null);\n const isConfigSettingsPanelOpen = ref<boolean>(false);\n const allColumnsVisbilityToggleState = ref<boolean>(true);\n const searchButtonRef = ref(null);\n const searchTerm = ref<string>('');\n const columnsRef = toRef(props, 'columns');\n const isColumnVisibilityFilterShown = ref<boolean>(false);\n\n // Column Visibility Filtering\n const filteredColumnVisibilityColumns = useSearchBarFilter<BentoColumn>(searchTerm, columnsRef);\n const clearAction = () => {\n searchTerm.value = '';\n };\n const areAllNonMandatoryColumnsHidden = computed(\n () => !props.columns.some(col => col.visible === false && !col.mandatory)\n );\n const toggleColumnFilter = () => {\n clearAction();\n isColumnVisibilityFilterShown.value = !isColumnVisibilityFilterShown.value;\n if (isColumnVisibilityFilterShown.value) {\n nextTick(() => searchBarRef.value.$refs.bentoInputField?.focusInput());\n } else {\n nextTick(() => searchButtonRef?.value?.$el?.focus());\n }\n allColumnsVisbilityToggleState.value = areAllNonMandatoryColumnsHidden.value;\n };\n\n // Column visibility\n const isColumnVisibilityToggleDisabled = (column: BentoColumn) => column.mandatory ?? false;\n\n const emitVisibleColumns = (updatedColumn: BentoColumn) => {\n const updatedColumns = props.columns.map(col => ({\n ...col,\n visible: updatedColumn.field === col.field ? updatedColumn.visible : col.visible,\n }));\n\n emit(DatagridConfigSettingsEvent.UPDATE_COLUMNS, updatedColumns);\n };\n\n const toggleAllColumnVisibility = (toggleState: boolean) => {\n if (toggleState) {\n // Show all columns\n emit(\n DatagridConfigSettingsEvent.UPDATE_COLUMNS,\n props.columns.map(col => ({ ...col, visible: true }))\n );\n } else {\n // Hide all columns except for mandatory columns\n emit(\n DatagridConfigSettingsEvent.UPDATE_COLUMNS,\n props.columns.map(col => ({ ...col, visible: col?.mandatory === true }))\n );\n }\n };\n\n // Column freeze\n // TODO to convert this function to 'emitUpdatedColumns', that will emit both: visible and frozen columns\n const emitFrozenColumns = (updatedColumn: BentoColumn) => {\n const updatedColumns = props.columns.map(col => ({\n ...col,\n frozen: updatedColumn.field === col.field ? !!updatedColumn?.frozen : !!col?.frozen,\n }));\n\n emit(DatagridConfigSettingsEvent.UPDATE_COLUMNS, updatedColumns);\n };\n\n // Panel visibility\n const setConfigSettingsPanelVisibility = (isVisible: boolean) => {\n isConfigSettingsPanelOpen.value = isVisible;\n allColumnsVisbilityToggleState.value = areAllNonMandatoryColumnsHidden.value;\n };\n const onClickOutside = () => setConfigSettingsPanelVisibility(false);\n // Condensed view\n const emitCondensedToggle = (isCondensedView: boolean) =>\n emit(DatagridConfigSettingsEvent.CONFIG_SETTINGS, isCondensedView);\n\n return {\n // Values\n configSettingsButtonRef,\n popoverId,\n isConfigSettingsPanelOpen,\n allColumnsVisbilityToggleState,\n filteredColumnVisibilityColumns,\n searchTerm,\n isColumnVisibilityFilterShown,\n searchBarRef,\n searchButtonRef,\n DATAGRID_SELECT_FIELD_NAME,\n\n // Methods\n setConfigSettingsPanelVisibility,\n emitCondensedToggle,\n toggleAllColumnVisibility,\n clearAction,\n toggleColumnFilter,\n emitVisibleColumns,\n emitFrozenColumns,\n onClickOutside,\n isColumnVisibilityToggleDisabled,\n };\n },\n });\n</script>\n\n<style lang=\"scss\" scoped src=\"./data-grid-config-settings.scss\" />\n","<template>\n <div class=\"b-data-grid-lazy-load\">\n <bento-loading-indicator v-if=\"loading && isInfiniteScroll\" />\n <bento-loading-button\n v-if=\"loading && !isInfiniteScroll\"\n variant=\"secondary\"\n :state=\"BentoLoadingButtonState.LOADING\"\n >{{ $t('loading') }}</bento-loading-button\n >\n <bento-loading-button\n v-if=\"!loading && !isInfiniteScroll\"\n :state=\"BentoLoadingButtonState.START\"\n variant=\"secondary\"\n @click=\"$emit(BentoDatagridEvent.UPDATE_SHOW_MORE)\"\n >{{ $t('showMore') }}</bento-loading-button\n >\n </div>\n</template>\n\n<script setup lang=\"ts\">\n import { BentoLoadingButton, BentoLoadingButtonState } from '@/components/button';\n import { BentoLoadingIndicator } from '@/components/loading-indicator';\n import { BentoDatagridEvent } from '../../data-grid.types';\n import messages from '../../messages.json';\n\n defineProps<{\n /**\n * Indicates whether the component is in a loading state.\n */\n loading: boolean;\n\n /**\n * If set to true, displays a loading indicator. Otherwise displays a loading button.\n */\n isInfiniteScroll: boolean;\n }>();\n</script>\n\n<script lang=\"ts\">\n /**\n * Internal component to display the bento-data-grid's lazy loading.\n * The component can render a 'Show more' loading button or a loading indicator.\n */\n export default {\n i18n: { messages },\n };\n</script>\n\n<style lang=\"scss\" scoped src=\"./data-grid-lazy-load.scss\" />\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#00112C\" d=\"M12.9243 1.86372C12.0456 0.985043 10.621 0.985041 9.74234 1.86372L1.25 10.3561V14.7501H5.64399L14.1363 6.25772C15.015 5.37904 15.015 3.95442 14.1363 3.07574L12.9243 1.86372ZM10.803 2.92438C11.0959 2.63149 11.5708 2.63149 11.8637 2.92438L13.0757 4.1364C13.3686 4.42929 13.3686 4.90416 13.0757 5.19706L12.3333 5.93947L10.0606 3.6668L10.803 2.92438ZM8.99993 4.72746L11.2726 7.00013L5.02267 13.2501H2.75V10.9774L8.99993 4.72746Z\"/></svg>\n</template>\n<script>\n let uuid = 0;\n\n export default {\n beforeCreate() {\n this.uuid = uuid.toString();\n uuid += 1;\n },\n };\n</script>\n<style>\n @import '../css/main.css';\n</style>\n","<template>\n <Transition name=\"b-data-grid-cell-actions__animation\" appear>\n <div class=\"b-data-grid-cell-actions\">\n <div class=\"b-data-grid-cell-actions__background-gradient\"></div>\n <div class=\"b-data-grid-cell-actions__actions\" role=\"group\">\n <div\n v-for=\"(button, index) in limitedRowCellActionsProps\"\n :key=\"index\"\n class=\"b-data-grid-cell-actions__action\"\n >\n <bento-menu\n v-if=\"button.menuData\"\n :data=\"transformMenuEvents(button.menuData)\"\n :button=\"{\n condensed: true,\n variant: 'secondary',\n disabled: button.disabled,\n }\"\n teleport\n @menu-item-click=\"emit('menu-item-click-close')\"\n >\n <template v-if=\"shouldShowMenuIconLeft(button)\" #iconLeft>\n <options-vertical-icon\n v-if=\"button?.variant === 'more'\"\n :svg-title=\"getButtonTitle(button, true)\"\n />\n <component :is=\"button.iconLeft\" v-else :svg-title=\"getButtonTitle(button, true)\" />\n </template>\n <template v-if=\"!button?.isShort\" #default>\n {{ getButtonTitle(button) }}\n </template>\n <template v-if=\"shouldShowMenuIconRight(button)\" #iconRight>\n <external-link-icon\n v-if=\"button?.variant === 'open'\"\n :svg-title=\"getButtonTitle(button, true)\"\n />\n <component :is=\"button.iconRight\" v-else :svg-title=\"button.title\" />\n </template>\n </bento-menu>\n <copy\n v-else-if=\"button.variant === 'copy'\"\n :text=\"getCopyText(button)\"\n :button-text=\"getButtonTitle(button)\"\n :button=\"{\n condensed: true,\n variant: 'secondary',\n }\"\n />\n <bento-button\n v-else\n condensed\n variant=\"secondary\"\n :critical=\"button.critical\"\n :disabled=\"button.disabled\"\n :link=\"button.link\"\n v-on=\"generateButtonEvents(button)\"\n >\n <template v-if=\"button.iconLeft || button.variant === 'edit'\" #iconLeft>\n <edit1-icon v-if=\"button?.variant === 'edit'\" :svg-title=\"getButtonTitle(button, true)\" />\n <component :is=\"button.iconLeft\" v-else :svg-title=\"button.title\" />\n </template>\n <template v-if=\"!button?.isShort\" #default>\n {{ getButtonTitle(button) }}\n </template>\n <template v-if=\"button.iconRight || button.variant === 'open'\" #iconRight>\n <external-link-icon\n v-if=\"button?.variant === 'open'\"\n :svg-title=\"getButtonTitle(button, true)\"\n />\n <component :is=\"button.iconRight\" v-else :svg-title=\"button.title\" />\n </template>\n </bento-button>\n </div>\n </div>\n </div>\n </Transition>\n</template>\n\n<script setup lang=\"ts\">\n import { computed, PropType } from 'vue';\n import { BentoButton } from '@/components/button';\n import { BentoMenu, BentoMenuItem } from '@/components/menu';\n import { Copy } from '@/internal';\n import { printDevelopmentWarning } from '@/utils/ts/print-development-warning';\n import { BentoDatagridDataItem } from '@/components/data-grid/data-grid.types';\n import Edit1Icon from '@adyen/ui-assets-icons-16/vue/edit-1';\n import ExternalLinkIcon from '@adyen/ui-assets-icons-16/vue/external-link';\n import OptionsVerticalIcon from '@adyen/ui-assets-icons-16/vue/options-vertical';\n\n // Types\n import type {\n BentoColumnCellAction,\n BentoColumnCellActionMenuItem,\n BentoColumnCellActions,\n } from './data-grid-cell-actions.types';\n\n // Translations\n import messages from './messages.json';\n import { useI18n } from '@/utils/ts/i18n';\n\n type MessageSchema = (typeof messages)['en-US'];\n const { t } = useI18n<{ message: MessageSchema }>({ messages });\n\n const props = defineProps({\n /**\n * Column definitions using 'key' to relate to data object.\n */\n cellActions: {\n type: Array as PropType<BentoColumnCellActions>,\n required: true,\n validator: (value: BentoColumnCellActions) => value?.length <= 2,\n },\n\n /**\n * The column field key.\n */\n columnKey: {\n type: String,\n required: true,\n },\n\n /**\n * The row data item object.\n */\n rowDataItem: {\n type: Object as PropType<BentoDatagridDataItem>,\n required: true,\n },\n });\n\n const emit = defineEmits<{\n /**\n * Emits when a cell actions menu button closes due to a menu item click\n */\n (e: 'menu-item-click-close'): void;\n }>();\n\n // Do not allow users to provide more than 2 cell action buttons\n const limitedRowCellActionsProps = computed(() => {\n if (props.cellActions?.length > 2) {\n printDevelopmentWarning(\n 'WARNING: BentoDataGrid Cell actions can only have a maximum of 2 actions, if you need more consider using the menuData property instead.'\n );\n }\n\n return props.cellActions.slice(0, 2);\n });\n\n const getButtonTitle = computed(() => (button: BentoColumnCellAction, isForSvgTitle?: boolean) => {\n if ((!isForSvgTitle && button.isShort) || (isForSvgTitle && !button.isShort)) {\n return undefined;\n }\n\n switch (button.variant) {\n case 'copy':\n return t('copy');\n case 'edit':\n return t('edit');\n case 'open':\n return t('open');\n case 'more':\n return t('more');\n default:\n return button.title;\n }\n });\n\n const generateButtonEvents = (button: BentoColumnCellAction) =>\n button?.event !== undefined\n ? {\n click: () => button.event(props.rowDataItem, props.columnKey),\n }\n : {};\n\n const generateMenuEvents = (menuDataItem: BentoColumnCellActionMenuItem): BentoMenuItem => ({\n ...menuDataItem,\n handler: () => {\n if (menuDataItem?.handler && typeof menuDataItem.handler === 'function') {\n menuDataItem?.handler();\n }\n if (menuDataItem?.event && typeof menuDataItem.event === 'function') {\n menuDataItem?.event(props.rowDataItem, props.columnKey);\n }\n },\n });\n\n const transformMenuEvents = (menuData: BentoColumnCellActionMenuItem[]) =>\n menuData.map(menuDataItem => {\n const transformedMenuData = menuDataItem;\n if (transformedMenuData?.items) {\n transformedMenuData.items = transformMenuEvents(transformedMenuData.items);\n }\n return { ...generateMenuEvents(transformedMenuData) };\n });\n\n const getCopyText = (button: BentoColumnCellAction) =>\n button?.getCopyData !== undefined\n ? button.getCopyData(props.rowDataItem, props.columnKey)\n : (props.rowDataItem?.[props.columnKey]?.toString() as string);\n\n const shouldShowMenuIconRight = (button: BentoColumnCellAction) =>\n button.iconRight || ((button?.variant === 'more' || button?.variant === 'open') && !button.isShort);\n\n const shouldShowMenuIconLeft = (button: BentoColumnCellAction) => button.iconLeft || button?.variant === 'more';\n</script>\n\n<script lang=\"ts\">\n /**\n * Internal component to display the data-grid actions.\n * There are 4 different pre-defined buttons that can be used by using the `variant` property.\n *\n * The component renders buttons or a menu depending on the actions provided.\n *\n * @example\n * <data-grid-cell-actions\n * :cell-actions=\"[\n * { variant: 'edit', event: () => {} },\n * {\n * variant: 'more',\n * isShort: true,\n * menuData: [\n * {\n * text: 'Cancel payment',\n * handler: () => {}),\n * critical: true,\n * },\n * {\n * text: 'Transfer payment',\n * handler: () => {},\n * },\n * {\n * text: 'Delete payment',\n * handler: () => {},\n * disabled: true,\n * },\n * ],\n * },\n * ]\"\n * column-key=\"payment\"\n * :row-data-item=\"rowData\"\n * />\n */\n export default {\n i18n: { messages },\n name: 'data-grid-cell-actions',\n };\n</script>\n\n<style lang=\"scss\" scoped src=\"./data-grid-cell-actions.scss\" />\n","import type { BentoColumn } from '../../data-grid.types';\nimport type { Ref } from 'vue';\n\nexport enum DataGridCellPropClass {\n COLUMN_HOVERED = 'column-hovered',\n COLUMN_HOVERED_NO_BORDER_LEFT = 'column-hovered-no-border-left',\n COLUMN_HOVERED_NO_BORDER_RIGHT = 'column-hovered-no-border-right',\n CONDENSED = 'condensed',\n FROZEN = 'frozen',\n IS_COLUMN_REORDERING = 'is-column-re-ordering',\n IS_COLUMN_REORDERING_TARGET_LEFT = 'is-column-re-order-target-left',\n IS_COLUMN_REORDERING_TARGET_RIGHT = 'is-column-re-order-target-right',\n LAST_FROZEN_COLUMN_CELL = 'last-frozen-column-cell',\n NUMERIC = 'numeric',\n OVERFLOW_ELLIPSIS = 'overflow-ellipsis',\n PADDING_LEFT_UNSET = 'padding-left-unset',\n PADDING_RIGHT_UNSET = 'padding-right-unset',\n}\n\nexport interface DataGridCellDragEvents {\n dragenter?: (e: DragEvent) => void;\n drop?: () => void;\n dragover?: (e: DragEvent) => void;\n}\n\nexport type DataGridCellDragEventsForColumn = (column: BentoColumn) => {\n dragenter?: (e: DragEvent) => void;\n drop?: () => void;\n dragover?: (e: DragEvent) => void;\n};\n\nexport interface DataGridCellColumnSet {\n columnSet: BentoColumn[];\n id: string;\n isFrozenColumns?: boolean;\n}\n\nexport interface DataGridCellEvents extends DataGridCellDragEvents {\n keyup?: (event: KeyboardEvent) => void;\n keydown?: (event: KeyboardEvent) => void;\n mouseenter?: () => void;\n mouseleave?: (e: MouseEvent) => void;\n focus?: (e: FocusEvent) => void;\n focusout?: (e: FocusEvent) => void;\n}\n\nexport type DataGridCellEventsForColumn = (column: BentoColumn) => DataGridCellEvents;\nexport type DataGridCellRegisterMenu = {\n registerMenuContainerElement: (menuContainerElement: Ref<HTMLDivElement>) => void;\n menuMouseLeave: (e: MouseEvent) => void;\n};\n","<template>\n <div\n :key=\"`cell-${column.field}`\"\n ref=\"gridcellRef\"\n :data-testid=\"`cell-${column.field}`\"\n :data-cellindex=\"getCellIndex(rowIndex, colIndex, columnSetIndex)\"\n class=\"b-data-grid-cell\"\n :class=\"conditionalRowCellClasses(column)\"\n role=\"gridcell\"\n :tabindex=\"getCellIndex(rowIndex, colIndex, columnSetIndex) === 0 ? '0' : '-1'\"\n :aria-colindex=\"getColIndex(colIndex, columnSetIndex) + 1\"\n :style=\"{\n width: column.autoWidth && isMeasuringColumnWidths ? 'auto' : `${column.width}px`,\n }\"\n v-on=\"getGridcellEvents(column)\"\n >\n <template v-if=\"column.field !== DATAGRID_SELECT_FIELD_NAME\">\n <bento-typography el=\"div\">\n <slot :item=\"rowData\" :name=\"`item-${column.field}`\">\n <span :title=\"conditionalTitleAttribute(column, rowData[column.field])\">{{\n getRowData(rowData[column.field])\n }}</span>\n </slot>\n </bento-typography>\n <div v-if=\"column.cellActions?.length > 0\" class=\"b-data-grid-cell__cell-actions\">\n <data-grid-cell-actions\n v-if=\"shouldShowCellActions\"\n ref=\"cellActionsRef\"\n :cell-actions=\"column.cellActions\"\n :column-key=\"column.field\"\n :row-data-item=\"rowData\"\n @menu-item-click-close=\"onMenuClose\"\n />\n </div>\n </template>\n <template v-else>\n <bento-checkbox\n class=\"b-data-grid-cell__select-cell\"\n :aria-label=\"t('selectRow')\"\n :model-value=\"selectedItems\"\n :disabled=\"isDataItemDisabled(rowData)\"\n :value=\"getDataItemId(rowData)\"\n @update:model-value=\"$emit('select-row', $event)\"\n />\n </template>\n </div>\n</template>\n\n<script setup lang=\"ts\">\n import { PropType, provide, ref, Ref, watch } from 'vue';\n import { DATAGRID_SELECT_FIELD_NAME } from '../../composables';\n import { BentoCheckbox } from '@/components/checkbox';\n import { BentoTypography } from '@/components/typography';\n import DataGridCellActions from '../data-grid-cell-actions/data-grid-cell-actions.vue';\n import { DATA_GRID_CELL_MENU_REGISTERING_INJECTION_KEY } from '@/components/data-grid/components/data-grid-cell/data-grid-cell.keys';\n\n // Types and enums\n import {\n BentoColumn,\n BentoColumnOverflow,\n BentoDatagridDataItem,\n BentoDatagridDataItemId,\n BentoDatagridGetDataItemIdFn,\n BentoDatagridIsDataItemDisabledFn,\n } from '@/components/data-grid/data-grid.types';\n import {\n DataGridCellColumnSet,\n DataGridCellDragEventsForColumn,\n DataGridCellEvents,\n DataGridCellEventsForColumn,\n DataGridCellPropClass,\n DataGridCellRegisterMenu,\n } from './data-grid-cell.types';\n import type { BentoDatagridDraggingColumnState } from '../data-grid-columns/data-grid-columns.types';\n import type { DatagridColumnHoveringState } from '@/components/data-grid/composables/use-column-hovering';\n\n // Translations\n import messages from './messages.json';\n import { useI18n } from '@/utils/ts/i18n';\n\n type MessageSchema = (typeof messages)['en-US'];\n const { t } = useI18n<{ message: MessageSchema }>({ messages });\n\n const props = defineProps({\n draggingEventsForRowCell: {\n type: Function as PropType<DataGridCellDragEventsForColumn>,\n required: true,\n },\n\n /**\n * The columns sets including\n */\n columnSets: {\n type: Array as PropType<DataGridCellColumnSet[]>,\n required: true,\n },\n\n /**\n * The columns set we are iterating over\n */\n column: {\n type: Object as PropType<BentoColumn>,\n required: true,\n },\n\n colIndex: {\n type: Number,\n required: true,\n },\n\n columnSetIndex: {\n type: Number,\n required: true,\n },\n\n /**\n * Sets the row cells to the condensed padding state.\n */\n condensed: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Columns being dragged, contains dragging column and a target column\n */\n draggingColumns: {\n type: Object as PropType<BentoDatagridDraggingColumnState>,\n default: undefined,\n },\n\n /**\n * A customisable method to retrieve a unique identifier for a data item in the array of data supplied.\n * This is used selecting and performance reasons and must exist in each data item.\n */\n getDataItemId: {\n type: Function as PropType<BentoDatagridGetDataItemIdFn>,\n default: (item: BentoDatagridDataItem) => item.id,\n },\n\n /**\n * The column hovered over state and whether the hovered over column should show a border right or left.\n */\n hoveredOverColumnState: {\n type: Object as PropType<DatagridColumnHoveringState>,\n required: true,\n },\n\n /**\n * A customisable method to determine if a row is not selectable.\n * The default is that every row is selectable.\n */\n isDataItemDisabled: {\n type: Function as PropType<BentoDatagridIsDataItemDisabledFn>,\n default: () => false,\n },\n\n isMeasuringColumnWidths: {\n type: Boolean,\n default: false,\n },\n\n /**\n * The row data object\n */\n rowData: {\n type: Object as PropType<BentoDatagridDataItem>,\n required: true,\n },\n\n rowIndex: {\n type: Number,\n required: true,\n },\n\n selectedItems: {\n type: Array as PropType<BentoDatagridDataItemId[]>,\n required: true,\n },\n });\n\n const emit = defineEmits<{\n /**\n * Emitted when an a frozen column cell fires a key up or down event.\n */\n (e: 'on-frozen-columns-key-press', event: Event);\n\n /**\n * Emitted when a row has been selected.\n */\n (e: 'select-row', value: BentoDatagridDataItemId[]);\n\n /**\n * Emitted when a row has been selected.\n */\n (e: 'register-row-cell-element', el: Element, field: string, rowIndex: number);\n\n /**\n * Emitted when a cell has been hovered over. This is used to keep the row in a hovered state when hovering over a menu.\n */\n (e: 'cell-hovered', value: number);\n }>();\n\n // References\n const gridcellRef = ref<HTMLDivElement | null>(null);\n const cellActionsRef = ref<InstanceType<typeof DataGridCellActions>>(null);\n const shouldShowCellActions = ref(false);\n const childrenMenuContainerElements = ref<Ref<HTMLDivElement>[]>([]);\n\n // Row data retrieval methods\n const conditionalTitleAttribute = (column: BentoColumn, content: unknown) =>\n column?.overflow === BentoColumnOverflow.ELLIPSIS ? `${content}` : undefined;\n const getRowData = (rowData: unknown) => rowData ?? '-';\n\n // Cell and Columns index calculation\n const sumColumnAmountsInColumnSets = (limitIndex?: number) =>\n props.columnSets.slice(0, limitIndex).reduce((total, { columnSet }) => total + columnSet.length, 0);\n // Sums the amount of columns on every previous column set to find\n // the absolute column index (useful for frozen columns use case)\n const getColIndex = (colIndex: number, colSetIndex: number) => colIndex + sumColumnAmountsInColumnSets(colSetIndex);\n const getCellIndex = (rowIndex: number, colIndex: number, colSetIndex: number) =>\n sumColumnAmountsInColumnSets() * rowIndex + getColIndex(colIndex, colSetIndex);\n\n /**\n * We check here if we are leaving the cell but mouse into a child menu\n * If this is the case we don't want to hide the cell actions.\n * @param relatedTarget\n */\n const isLeavingCellFocus = (relatedTarget: EventTarget) => {\n if (\n relatedTarget === null ||\n (!gridcellRef.value.contains(relatedTarget as Node) &&\n !childrenMenuContainerElements.value\n ?.map(registeredMenuRef => registeredMenuRef.value)\n .some(menuElement => menuElement === relatedTarget || menuElement?.contains(relatedTarget as Node)))\n ) {\n shouldShowCellActions.value = false;\n }\n };\n\n const onMenuClose = () => {\n // TODO: we need an emit that fires on when clicking on menu item, not when closing menu due to the toggle button....\n shouldShowCellActions.value = false;\n };\n\n // Events\n const getGridcellEvents: DataGridCellEventsForColumn = (column: BentoColumn) => {\n const defaultEvents: DataGridCellEvents = {\n ...props.draggingEventsForRowCell(column),\n };\n\n const gridCellEvents: DataGridCellEvents = { ...defaultEvents };\n\n if (column.frozen) {\n gridCellEvents.keyup = (event: Event) => emit('on-frozen-columns-key-press', event);\n gridCellEvents.keydown = (event: Event) => emit('on-frozen-columns-key-press', event);\n }\n if (column.cellActions) {\n gridCellEvents.mouseenter = () => {\n shouldShowCellActions.value = true;\n };\n gridCellEvents.mouseleave = (e: MouseEvent) => {\n shouldShowCellActions.value = false;\n isLeavingCellFocus(e?.relatedTarget);\n };\n gridCellEvents.mouseleave = (e: MouseEvent) => {\n isLeavingCellFocus(e?.relatedTarget);\n };\n gridCellEvents.focus = (e: FocusEvent) => {\n shouldShowCellActions.value = true;\n };\n gridCellEvents.focusout = (e: FocusEvent) => {\n isLeavingCellFocus(e?.relatedTarget);\n };\n }\n return gridCellEvents;\n };\n // Each cell knows it's on hover state but this state needs to be emitted up\n // in order for the DataGrid to know which row to set the hovered state on.\n watch(\n () => shouldShowCellActions.value,\n () => {\n if (shouldShowCellActions.value === true) {\n emit('cell-hovered', props.rowIndex);\n } else {\n emit('cell-hovered', -1);\n }\n }\n );\n\n const registerMenuContainerElement = (menuContainerElement: Ref<HTMLDivElement>) => {\n childrenMenuContainerElements.value.push(menuContainerElement);\n };\n\n const menuMouseLeave = (e: MouseEvent) => {\n if (!gridcellRef.value.contains(e?.relatedTarget as Node)) {\n shouldShowCellActions.value = false;\n }\n };\n\n provide<DataGridCellRegisterMenu>(DATA_GRID_CELL_MENU_REGISTERING_INJECTION_KEY, {\n registerMenuContainerElement,\n menuMouseLeave,\n });\n\n // Styling\n const conditionalRowCellClasses = (column: BentoColumn) => ({\n [`b-data-grid-cell--${DataGridCellPropClass.COLUMN_HOVERED}`]:\n column?.field === props.hoveredOverColumnState.hoveredOverColumnField,\n [`b-data-grid-cell--${DataGridCellPropClass.COLUMN_HOVERED_NO_BORDER_LEFT}`]:\n column?.field === props.hoveredOverColumnState.hoveredOverColumnField &&\n props.hoveredOverColumnState.noBorderLeft,\n [`b-data-grid-cell--${DataGridCellPropClass.COLUMN_HOVERED_NO_BORDER_RIGHT}`]:\n column?.field === props.hoveredOverColumnState.hoveredOverColumnField &&\n props.hoveredOverColumnState.noBorderRight,\n [`b-data-grid-cell--${DataGridCellPropClass.PADDING_LEFT_UNSET}`]: column?.padding?.left === false,\n [`b-data-grid-cell--${DataGridCellPropClass.PADDING_RIGHT_UNSET}`]: column?.padding?.right === false,\n [`b-data-grid-cell--${DataGridCellPropClass.NUMERIC}`]: column?.numeric,\n [`b-data-grid-cell--${DataGridCellPropClass.CONDENSED}`]: props.condensed,\n [`b-data-grid-cell--${DataGridCellPropClass.OVERFLOW_ELLIPSIS}`]:\n column?.overflow === BentoColumnOverflow.ELLIPSIS,\n [`b-data-grid-cell--${DataGridCellPropClass.IS_COLUMN_REORDERING}`]:\n props.draggingColumns.dragging?.field === column.field,\n [`b-data-grid-cell--${DataGridCellPropClass.IS_COLUMN_REORDERING_TARGET_LEFT}`]:\n props.draggingColumns.target?.field === column.field && props.draggingColumns?.dragToLeft,\n [`b-data-grid-cell--${DataGridCellPropClass.IS_COLUMN_REORDERING_TARGET_RIGHT}`]:\n props.draggingColumns.target?.field === column.field && !props.draggingColumns?.dragToLeft,\n [`b-data-grid-cell--${DataGridCellPropClass.FROZEN}`]: column?.frozen,\n });\n\n // Exposed refs\n defineExpose({\n gridcellRef,\n });\n</script>\n\n<script lang=\"ts\">\n /**\n * Internal component to display the BentoDataGrid cells.\n *\n * The component can also render the selecting row checkbox as well as cell actions.\n *\n * @example\n * <data-grid-cell\n *\n * />\n */\n export default {\n i18n: { messages },\n name: 'data-grid-cell',\n };\n</script>\n\n<style lang=\"scss\" scoped src=\"./data-grid-cell.scss\" />\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><g :clip-path=\"'url(#uia-icons-16-warning_circle_fill__a' + uuid + ')'\"><path fill=\"#00112C\" d=\"M0.25 8C0.25 3.71979 3.71979 0.25 8 0.25C12.2802 0.25 15.75 3.71979 15.75 8C15.75 12.2802 12.2802 15.75 8 15.75C3.71979 15.75 0.25 12.2802 0.25 8ZM8.75 8.75V4.25H7.25V8.75H8.75ZM8 11.5C8.41421 11.5 8.75 11.1642 8.75 10.75C8.75 10.3358 8.41421 10 8 10C7.58579 10 7.25 10.3358 7.25 10.75C7.25 11.1642 7.58579 11.5 8 11.5Z\"/></g><defs><clipPath :id=\"'uia-icons-16-warning_circle_fill__a' + uuid\"><rect width=\"16\" height=\"16\" fill=\"#fff\"/></clipPath></defs></svg>\n</template>\n<script>\n let uuid = 0;\n\n export default {\n beforeCreate() {\n this.uuid = uuid.toString();\n uuid += 1;\n },\n };\n</script>\n<style>\n @import '../css/main.css';\n</style>\n","<template>\n <div\n v-bento-tooltip-directive:[tooltipPosition]=\"tooltipText\"\n :aria-label=\"tooltipText\"\n class=\"b-data-grid-static-icon\"\n :class=\"conditionalClasses\"\n tabindex=\"0\"\n >\n <component :is=\"computedIcon\" :class=\"computedIconClass\" :svg-title=\"tooltipText\" />\n </div>\n</template>\n\n<script setup lang=\"ts\">\n import { computed } from 'vue';\n import CheckmarkIcon from '@adyen/ui-assets-icons-16/vue/checkmark-circle-fill';\n import WarningIcon from '@adyen/ui-assets-icons-16/vue/warning-filled';\n import ErrorIcon from '@adyen/ui-assets-icons-16/vue/warning-circle-fill';\n import CrossIcon from '@adyen/ui-assets-icons-16/vue/cross';\n import NoValueIcon from '@adyen/ui-assets-icons-16/vue/minus-small';\n import { BentoTooltipDirective as vBentoTooltipDirective } from '@/directives';\n import { PopperContainerPosition } from '@/components/popper-container';\n import { BentoDataGridStaticIconVariant } from './data-grid-static-icon.types';\n\n const props = withDefaults(\n defineProps<{\n /**\n * Renderes the icon with color.\n */\n colored?: boolean;\n\n /**\n * The text displaying in the tooltip.\n */\n tooltipText: string;\n\n /**\n * The variant of the icon.\n */\n variant?: BentoDataGridStaticIconVariant;\n }>(),\n {\n variant: 'no-value',\n colored: false,\n }\n );\n\n const computedIcon = computed(() => {\n switch (props.variant) {\n case 'checkmark':\n return CheckmarkIcon;\n case 'warning':\n return WarningIcon;\n case 'error':\n return ErrorIcon;\n case 'cross':\n return CrossIcon;\n case 'no-value':\n return NoValueIcon;\n default:\n return NoValueIcon;\n }\n });\n\n const conditionalClasses = computed(() => ({\n [`b-data-grid-static-icon--colored`]: props.colored && props.variant !== 'no-value',\n }));\n\n const computedIconClass = computed(() => `b-data-grid-static-icon__${props.variant}`);\n\n const tooltipPosition = computed(() => PopperContainerPosition.AUTO);\n</script>\n\n<script lang=\"ts\">\n /**\n * The bento-data-grid-static-icon is an icon component with an associated toltip to be used within cellls of the bento-data-grid\n *\n * @example\n * import { BentoDataGridStaticIcon } from '@adyen/bento-vue2';\n *\n * export default {\n * components: { BentoDataGridStaticIcon },\n * template: `\n * <bento-data-grid-static-icon variant=\"warning\" text=\"Your tooltip text\" />\n * `\n * }\n */\n export default {};\n</script>\n\n<style lang=\"scss\" scoped src=\"./data-grid-static-icon.scss\" />\n","<template>\n <div\n class=\"b-data-grid\"\n role=\"grid\"\n :class=\"conditionalGridClasses\"\n :aria-rowcount=\"data.length\"\n :aria-colcount=\"columns.length\"\n :aria-label=\"ariaGridHeaderText\"\n >\n <div\n v-if=\"filters\"\n ref=\"filtersRef\"\n class=\"b-data-grid__filters\"\n :style=\"{ top: computedStickyFiltersTopPosition }\"\n >\n <bento-filter-bar\n v-if=\"filters\"\n ref=\"filterBarRef\"\n :config=\"filters\"\n :filter-values=\"filterValues\"\n :search-term=\"filterSearchTerm\"\n @search-input=\"onSearchTermInput\"\n @search-clear=\"onSearchTermCleared\"\n @input=\"filters => $emit(BentoDatagridEvent.UPDATE_FILTERS, filters)\"\n @update:filter-values=\"filterValues => $emit(BentoDatagridEvent.UPDATE_FILTER_VALUES, filterValues)\"\n />\n </div>\n <div v-if=\"$slots.header\" class=\"b-data-grid__header\">\n <slot name=\"header\"></slot>\n </div>\n <div class=\"b-data-grid__column-headers\" :style=\"{ top: computedColumnHeadersTopPosition }\">\n <bento-data-grid-config-settings\n v-if=\"columnPanel\"\n class=\"b-data-grid__config-settings\"\n :columns=\"localColumnsState\"\n :condensed=\"condensed\"\n @config-settings=\"onConfigSettingsUpdate\"\n @update:columns=\"onConfigSettingsColumnsUpdate\"\n />\n <div\n ref=\"columnsRef\"\n role=\"rowgroup\"\n class=\"b-data-grid__columns-row\"\n :tabindex=\"computedColumnsTabIndex\"\n @scroll=\"updateScrollPosition\"\n >\n <div :style=\"gridColumnWidthStyle\" class=\"b-data-grid__columns\" role=\"row\">\n <template v-for=\"({ columnSet, id, isFrozenColumns }, index) of columnSets\">\n <data-grid-columns\n v-if=\"columnSet?.length\"\n :key=\"`data-grid-columns-${id}`\"\n :ref=\"el => registerColumnHeaderRefs(el)\"\n :columns=\"columnSet\"\n :has-resizable-columns=\"hasResizableColumns\"\n :sort-by=\"sortBy\"\n :all-items-selected-state=\"allItemsSelectedState\"\n :is-frozen-columns=\"isFrozenColumns\"\n :show-frozen-columns-separator=\"showFrozenColumnsSeparator\"\n :dragging-columns=\"draggingColumns\"\n :has-draggable-columns=\"allowColumnDragAndDrop\"\n :has-column-panel=\"columnPanel\"\n :has-left-overflow=\"hasLeftOverflow\"\n :has-first-column-panel-right-aligned=\"index === computedColumnPanelAlignment\"\n :hovered-over-column-state=\"hoveredOverColumnState\"\n :is-measuring-column-widths=\"isMeasuringColumnWidths\"\n :is-only-one-visible-column=\"isOnlyOneVisibleColumn\"\n :selectable-across-pages=\"selectableAcrossPagesComputed\"\n :truncate-column-headers=\"truncateColumnHeaders\"\n v-on=\"draggingEventsForColumns\"\n @column-hover=\"hoveredOverColumn = $event\"\n @column-move=\"onMoveColumnByOffset\"\n @column-update=\"onConfigSettingsColumnUpdate\"\n @column-resize=\"onColumnResized\"\n @column-resizing=\"onColumnWidthOverride\"\n @select-all-rows=\"onAllRowSelect\"\n @select-all-across-pages=\"emit(BentoDatagridEvent.SELECT_ALL_ACROSS_PAGES)\"\n @sort=\"onSort\"\n >\n <template v-for=\"(_, innerSlot) of slots\" #[innerSlot]=\"scope\">\n <slot :name=\"innerSlot\" v-bind=\"scope\" />\n </template>\n </data-grid-columns>\n </template>\n </div>\n </div>\n </div>\n <div\n ref=\"body\"\n data-testid=\"data-grid-body\"\n class=\"b-data-grid__body\"\n :tabindex=\"loading ? '0' : '-1'\"\n :aria-busy=\"loading\"\n aria-live=\"polite\"\n @scroll=\"updateScrollPosition\"\n >\n <div v-if=\"loading && !isLazyLoad\" class=\"b-data-grid__loading\">\n <bento-loading-indicator class=\"b-data-grid__loading-indicator\" large />\n <bento-typography el=\"span\" variant=\"caption\">{{ t('gettingYourData') }}</bento-typography>\n </div>\n <div v-else-if=\"data?.length === 0 && emptyState\" class=\"b-data-grid__empty-state\">\n <bento-empty-state v-bind=\"limitedEmptyStateProps\" />\n </div>\n <div v-else class=\"b-data-grid__rows\" role=\"rowgroup\" @keydown=\"navigationInput\">\n <div\n v-for=\"(rowData, rowIndex) in data\"\n :key=\"rowIndex\"\n :style=\"gridColumnWidthStyle\"\n class=\"b-data-grid__row\"\n :class=\"conditionalRowClasses(rowData, rowIndex)\"\n role=\"row\"\n :aria-rowindex=\"rowIndex + 1\"\n :aria-selected=\"getRowAriaSelectedValue(rowData)\"\n @click=\"onRowClick(rowData, $event)\"\n >\n <template v-for=\"({ columnSet, id, isFrozenColumns }, columnSetIndex) of columnSets\">\n <div\n v-if=\"columnSet?.length\"\n :key=\"`data-grid-rows-${id}`\"\n class=\"b-data-grid__cells\"\n :class=\"conditionalRowSetClasses(isFrozenColumns)\"\n :data-testid=\"`data-grid-${id}-rows`\"\n >\n <data-grid-cell\n v-for=\"(column, colIndex) in columnSet\"\n :key=\"`cell-${column.field}`\"\n :ref=\"el => registerRowCellRef(el, column.field, rowIndex)\"\n :column=\"column\"\n :column-set-index=\"columnSetIndex\"\n :col-index=\"colIndex\"\n :column-sets=\"columnSets\"\n :condensed=\"condensed\"\n :dragging-columns=\"draggingColumns\"\n :dragging-events-for-row-cell=\"draggingEventsForRowCell\"\n :get-data-item-id=\"getDataItemId\"\n :hovered-over-column-state=\"hoveredOverColumnState\"\n :is-data-item-disabled=\"isDataItemDisabled\"\n :is-measuring-column-widths=\"isMeasuringColumnWidths\"\n :row-data=\"rowData\"\n :row-index=\"rowIndex\"\n :selected-items=\"selectedItems\"\n @cell-hover=\"columnField => (hoveredOverColumn = columnField)\"\n @on-frozen-columns-key-press=\"updateScrollPositionOnFrozenColumnsNavigation\"\n @select-row=\"onRowSelect\"\n @cell-hovered=\"onCellHover\"\n >\n <template v-for=\"(_, innerSlot) of slots\" #[innerSlot]=\"scope\">\n <slot :name=\"innerSlot\" v-bind=\"scope\" />\n </template>\n </data-grid-cell>\n </div>\n </template>\n </div>\n </div>\n </div>\n <data-grid-lazy-load\n v-if=\"isLazyLoad\"\n :loading=\"loading\"\n :is-infinite-scroll=\"isInfiniteScroll\"\n @update:show-more=\"emitLazyLoadEvent\"\n />\n <div\n v-if=\"pagination && !isLazyLoad\"\n data-testid=\"pagination-container\"\n class=\"b-data-grid__pagination\"\n :class=\"conditionalPaginationClasses\"\n >\n <bento-pagination\n v-bind=\"pagination\"\n :aria-label=\"`${ariaGridHeaderText} navigation`\"\n @navigate=\"onPaginationNavigate\"\n @items-page=\"onItemsPerPageChange\"\n />\n </div>\n <div v-if=\"$slots.footer\" class=\"b-data-grid__footer\"><slot name=\"footer\"></slot></div>\n <bento-action-bar\n v-if=\"showActionBar\"\n :actions=\"bulkActions\"\n :item-counter=\"itemsSelectedCounter\"\n :extra-bottom-spacing=\"stickyPagination\"\n @close=\"onAllRowSelect(false)\"\n />\n </div>\n</template>\n\n<script lang=\"ts\" setup>\n import { ComponentPublicInstance, computed, inject, PropType, ref, toRef, toRefs, useSlots } from 'vue';\n\n // Components\n import { BentoActionBar } from '@/components/action-bar';\n import { BentoPagination } from '@/components/pagination';\n import { BentoLoadingIndicator } from '@/components/loading-indicator';\n import { BentoTypography } from '@/components/typography';\n import { BentoDataGridConfigSettings, DataGridCell, DataGridColumns, DataGridLazyLoad } from './components';\n\n // Composables\n import {\n useCalculateColumnWidth,\n useCalculateStickyElementHeight,\n useColumnHovering,\n useColumnReorderer,\n useConfigSettings,\n useKeyboardNavigator,\n useLazyLoading,\n useScroller,\n useSelector,\n } from './composables';\n\n // Utils\n import { useAriaLabel } from '@/utils/ts/aria-label';\n import { getSlotText } from '@/utils/ts/get-slot-text';\n import { useI18n } from '@/utils/ts/i18n';\n import { printDevelopmentWarning } from '@/utils/ts/print-development-warning';\n\n // Types\n import {\n BentoColumn,\n BentoDatagridData,\n BentoDatagridDataItem,\n BentoDatagridDataItemId,\n BentoDatagridEmptyStateProps,\n BentoDatagridEvent,\n BentoDatagridGetDataItemIdFn,\n BentoDatagridIsDataItemDisabledFn,\n BentoDatagridPaginationProps,\n BentoDatagridSortByColumn,\n BentoDatagridStyleState,\n } from './data-grid.types';\n import { BentoTabProvidedTitle } from '../tabs/components/tab.types';\n import { BentoDataGridTemplateDataGrid } from '@/templates/data-grid-template/data-grid-template.types';\n import { BentoLazyLoadType, Booleanish } from '@/types';\n import type { BentoButtonActionsList } from '@/components/button';\n\n import { BentoEmptyState } from '@/components/empty-state';\n import BentoFilterBar from '@/components/filter-bar/filter-bar.vue';\n\n // Keys\n import { EXTERNAL_TITLE_REGISTER_ENTRY_INJECTION_KEY } from '@/components/tabs/tabs.keys';\n import { DATA_GRID_REGISTER_TEMPLATE_INJECTION_KEY } from '@/templates/data-grid-template/data-grid-template.keys';\n\n // Translations\n import messages from './messages.json';\n import { DatagridColumnsHeaderReferences } from '@/components/data-grid/components/data-grid-columns/data-grid-columns.types';\n\n type MessageSchema = (typeof messages)['en-US'];\n\n const props = defineProps({\n /**\n * When true, will emit a 'rowClick' event when a row is clicked. Will add cursor: pointer to rows.\n */\n allowRowClicks: { type: Boolean, default: false },\n\n /**\n * When true, column headers will become draggable, allowing users to rearrange columns.\n */\n allowColumnDragAndDrop: { type: Boolean, default: true },\n\n /**\n * List of actions that will be rendered in the action bar when user selects items.\n *\n * Each object in the list should have a `title`, an `event` and,\n * optionally, an `icon`.\n *\n * The component will display 4 actions and the hide the rest inside a menu.\n *\n * @see BentoButton for a list of all the other props supported by each button action.\n */\n bulkActions: {\n type: Array as PropType<BentoButtonActionsList>,\n default: null,\n },\n\n /**\n * Sets the row cells to the condensed padding state.\n */\n condensed: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Column definitions using 'key' to relate to data object.\n */\n columns: {\n type: Array as PropType<BentoColumn[]>,\n required: true,\n },\n\n /**\n * Enables / hides the display options panel and the column contextual menu functionality.\n */\n columnPanel: { type: Boolean, default: false },\n\n /**\n * An array of data objects to display.\n */\n data: {\n type: Array as PropType<BentoDatagridData>,\n required: true,\n },\n\n /**\n * Empty state props that will be passed down to inner empty-state component\n */\n emptyState: {\n type: Object as PropType<BentoDatagridEmptyStateProps>,\n default: undefined,\n },\n\n /**\n * filter-bar value (i.e. filters) that will be passed down to inner filter-bar component\n * {@see BentoFilterBarModel}\n */\n filters: {\n type: BentoFilterBar.props.value.type,\n default: undefined,\n },\n\n /**\n * An array of the values for each filter set in `value`.\n * {@see BentoFilterValues}\n */\n filterValues: {\n type: BentoFilterBar.props.filterValues.type,\n default: () => [],\n },\n\n /**\n * Filter bar search term useful to filter all the data by text\n */\n filterSearchTerm: {\n type: BentoFilterBar.props.searchTerm.type,\n default: undefined,\n },\n\n /**\n * Allows the grid to be rendered inside a confined space.\n */\n fitContent: { type: Boolean, default: false },\n\n /**\n * A customisable method to retrieve a unique identifier for a data item in the array of data supplied.\n * This is used selecting and performance reasons and must exist in each data item.\n */\n getDataItemId: {\n type: Function as PropType<BentoDatagridGetDataItemIdFn>,\n default: (item: BentoDatagridDataItem) => item.id,\n },\n\n /**\n * If resize is enabled\n */\n hasResizableColumns: {\n type: Boolean,\n default: true,\n },\n\n /**\n * A customisable method to determine if a row is not selectable.\n * The default is that every row is selectable.\n */\n isDataItemDisabled: {\n type: Function as PropType<BentoDatagridIsDataItemDisabledFn>,\n default: () => false,\n },\n\n /**\n * The type of `Lazy Load`.\n * Type \"automatic\" will enable infinite scrolling\n * Type \"button\" will enable lazy loading with \"Show more\" button\n * @values automatic, button, none\n */\n lazyLoadType: {\n type: String as PropType<BentoLazyLoadType>,\n default: 'none',\n validator: (value: BentoLazyLoadType) => ['automatic', 'button', 'none'].includes(value),\n },\n\n /**\n * If the loading indicator should be shown.\n */\n loading: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Enables / Disables the table's surrounding border.\n */\n outline: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Pagination props that will be passed down to inner pagination component\n */\n pagination: {\n type: Object as PropType<BentoDatagridPaginationProps>,\n default: undefined,\n },\n\n /**\n * Adds an extra option when selecting all items that allows user to select items in other pages too.\n */\n selectableAcrossPages: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Make pagination stick to the bottom of the page when the data-grid is bigger than the screen.\n * Because styles have to be applied to pagination container element, this has to be a data-grid prop (rather than a pagination prop).\n */\n stickyPagination: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Make data-grid filters stick to the top of the page along with the data-grid headers.\n * Defaults to true.\n */\n stickyFilters: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Enables / Disables rows to be selected via a checkbox. On select the \"select\" event will be emitted.\n */\n selectable: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Selected items\n */\n selection: {\n type: Array as PropType<BentoDatagridDataItemId[]>,\n default: () => [],\n },\n\n /**\n * Highlighted items\n */\n highlightedRows: {\n type: Array as PropType<BentoDatagridDataItemId[]>,\n default: () => [],\n },\n\n /**\n * Renders the data grid with no top spacing, to render inside containers that already have spacing\n */\n noSpacingTop: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Sortby handles proper rendering of sort icon in header. Sorting currently is only supported server side.\n * It does make sure the currently sorted column has a more visible sort icon, and the sort icon points in the right direction.\n */\n sortBy: {\n type: Array as PropType<BentoDatagridSortByColumn[]>, // NOTE: is an array to allow multi-sorting in the future\n default: () => [],\n },\n /**\n * Title of the data grid to be rendered as tab title when a data grid is passed in a tab layout.\n */\n tabTitle: {\n type: String,\n default: null,\n },\n\n /**\n * Truncates all data grid column headers\n */\n truncateColumnHeaders: {\n type: Boolean,\n default: false,\n },\n });\n\n const slots = useSlots();\n\n /* == Variables and references == */\n // Create refs for elements\n const body = ref<HTMLDivElement>(null);\n const columnsRef = ref<HTMLDivElement>();\n const columnHeaderRefs = ref<DatagridColumnsHeaderReferences>({});\n const gridcellRefs = ref<{ [key: string]: HTMLDivElement[] }>(null);\n const filtersRef = ref<HTMLDivElement>(null);\n const filterBarRef = ref<InstanceType<typeof BentoFilterBar>>();\n const verticalScrollPositionRef = ref(null);\n const {\n allowColumnDragAndDrop,\n columns,\n columnPanel,\n data,\n lazyLoadType,\n selectable,\n selection,\n loading,\n selectableAcrossPages,\n outline,\n } = toRefs(props);\n const hoveredRowIndex = ref(-1);\n\n const { t } = useI18n<{ message: MessageSchema }>({ messages });\n const frozenColumnsLength = computed(() => columnDefs.value.filter(column => column.frozen).length);\n\n /* == Data-grid template == */\n const registerDatagridInDataGridTemplate: BentoDataGridTemplateDataGrid = inject(\n DATA_GRID_REGISTER_TEMPLATE_INJECTION_KEY,\n () => ({\n isDataGridTemplate: false,\n stickyTabs: ref(false),\n tabsRef: ref(null),\n })\n );\n const { isDataGridTemplate, stickyTabs, tabsRef } = registerDatagridInDataGridTemplate();\n const computedColumnsTabIndex = computed(() => (props.fitContent || isDataGridTemplate ? 0 : null));\n\n /* == Composable logic == */\n // Column width calculation\n const {\n columnDefs,\n onColumnWidthOverride,\n gridColumnWidthStyle,\n isMeasuringColumnWidths,\n isTotalWidthOfColumnsTakingUpAllAvailableGridWidth,\n columns: localColumnsState,\n } = useCalculateColumnWidth(columns, data, body, columnHeaderRefs, gridcellRefs, {\n hasColumnPanel: columnPanel,\n hasSelectableColumn: selectable,\n hasSelectableAcrossPages: selectableAcrossPages,\n });\n\n /* == Emitting logic == */\n const definedEmitsFunction = defineEmits([\n BentoDatagridEvent.COLUMNS,\n BentoDatagridEvent.COLUMN_RESIZE,\n BentoDatagridEvent.ITEMS_PAGE,\n BentoDatagridEvent.FILTER_SEARCH_INPUT,\n BentoDatagridEvent.FILTER_SEARCH_CLEAR,\n BentoDatagridEvent.NAVIGATE,\n BentoDatagridEvent.UPDATE_COLUMNS,\n BentoDatagridEvent.UPDATE_CONDENSED,\n BentoDatagridEvent.UPDATE_FILTER_VALUES,\n BentoDatagridEvent.UPDATE_FILTERS,\n BentoDatagridEvent.UPDATE_FILTER_SEARCH_TERM,\n BentoDatagridEvent.UPDATE_SHOW_MORE,\n BentoDatagridEvent.UPDATE_PAGINATION,\n BentoDatagridEvent.UPDATE_SELECTION,\n BentoDatagridEvent.UPDATE_SORT_BY,\n BentoDatagridEvent.ROW_CLICK,\n BentoDatagridEvent.SELECT,\n BentoDatagridEvent.SELECT_ALL_ACROSS_PAGES,\n BentoDatagridEvent.SORT,\n ]);\n\n /**\n * Hooks into the emit function and updates the local columns state if we're updating columns.\n * This is so if users use a computed ref with the columns property the ordering / toggling visibility will still function correctly.\n */\n const emit: typeof definedEmitsFunction = (event, ...args) => {\n // If we updating columns update the local columns state\n if (event === BentoDatagridEvent.COLUMNS || event === BentoDatagridEvent.UPDATE_COLUMNS) {\n [localColumnsState.value] = args;\n }\n definedEmitsFunction(event, ...args);\n };\n\n // Calculate dynamic top position of sticky filters\n const stickyFiltersHeight = useCalculateStickyElementHeight(tabsRef, stickyTabs);\n const computedStickyFiltersTopPosition = computed(() =>\n props.stickyFilters ? `${stickyFiltersHeight.value}px` : null\n );\n // Calculate dynamic top position of column headers\n const columnHeadersHeight = useCalculateStickyElementHeight(filtersRef, toRef(props, 'stickyFilters'));\n const computedColumnHeadersTopPosition = computed(\n () => `${columnHeadersHeight.value + stickyFiltersHeight.value}px`\n );\n\n // Config Settings (condensed, visbility and freezing settings)\n const {\n sortedColumns,\n columnSets,\n isOnlyOneVisibleColumn,\n onConfigSettingsUpdate,\n onConfigSettingsColumnsUpdate,\n onConfigSettingsColumnUpdate,\n } = useConfigSettings(columnDefs, emit);\n\n // Column hovering\n const { hoveredOverColumn, hoveredOverColumnState } = useColumnHovering(\n columnSets,\n selectable,\n outline,\n isTotalWidthOfColumnsTakingUpAllAvailableGridWidth\n );\n\n // Re-ordering column (dragging)\n const { draggingColumns, draggingEventsForColumns, draggingEventsForRowCell, onMoveColumnByOffset } =\n useColumnReorderer(sortedColumns, allowColumnDragAndDrop, emit);\n\n // Selecting\n const { onAllRowSelect, onRowSelect, selectedItems, allItemsSelectedState } = useSelector(\n selection,\n emit,\n data,\n props.getDataItemId,\n props.isDataItemDisabled\n );\n\n // Keyboard navigation\n const { navigationInput } = useKeyboardNavigator(gridcellRefs, columns, selectable);\n\n // Lazy loading\n const { isLazyLoad, isInfiniteScroll, verticalScrollPosition, emitLazyLoadEvent } = useLazyLoading(\n lazyLoadType,\n verticalScrollPositionRef,\n body,\n loading,\n emit\n );\n\n // Scrolling\n const { updateScrollPosition, updateScrollPositionOnFrozenColumnsNavigation, hasLeftOverflow, hasRightOverflow } =\n useScroller(body, columnsRef, verticalScrollPosition);\n\n /* == Empty State == */\n const onEmptyStateClearResetButtonClick = () => {\n if (filterBarRef.value.isClearAllVisible) {\n filterBarRef.value.clearAllFilters();\n } else if (filterBarRef.value.isResetAllVisible) {\n filterBarRef.value.resetAllFilters();\n }\n };\n const limitedEmptyStateProps = computed<BentoDatagridEmptyStateProps>(() => ({\n ...props.emptyState,\n variant:\n props.emptyState?.variant === 'embedded' || props.emptyState?.variant === 'basic'\n ? props.emptyState.variant\n : 'basic',\n }));\n\n /* == Styles == */\n // Conditional grid classes\n const conditionalGridClasses = computed(() => ({\n [`b-data-grid--${BentoDatagridStyleState.OUTLINE}`]: props.outline,\n [`b-data-grid--${BentoDatagridStyleState.SCROLL}`]: props.fitContent || isLazyLoad.value,\n [`b-data-grid--${BentoDatagridStyleState.STICKY_FILTERS}`]: props.filters && props.stickyFilters,\n [`b-data-grid--${BentoDatagridStyleState.OVERFLOW_SHADOW_LEFT}`]:\n hasLeftOverflow.value && !frozenColumnsLength.value,\n [`b-data-grid--${BentoDatagridStyleState.OVERFLOW_SHADOW_RIGHT}`]: hasRightOverflow.value,\n [`b-data-grid--${BentoDatagridStyleState.NO_SPACING_TOP}`]: props.noSpacingTop,\n }));\n\n const computedColumnPanelAlignment = computed(() => columnSets.value.findIndex(el => el.columnSet.length));\n\n // Conditional row classes\n const conditionalRowClasses = (row: BentoDatagridDataItem, rowIndex: number) => ({\n 'b-data-grid__row--disabled': props.isDataItemDisabled(row),\n 'b-data-grid__row--row-clicks-enabled': props.allowRowClicks,\n 'b-data-grid__cell--is-re-ordering': draggingColumns.target?.field !== undefined,\n 'b-data-grid__row--highlighted':\n props.highlightedRows.includes(props.getDataItemId(row)) ||\n selectedItems.value.includes(props.getDataItemId(row)),\n 'b-data-grid__row--hovered': hoveredRowIndex.value === rowIndex,\n });\n\n const showFrozenColumnsSeparator = computed(() => {\n const isSelectionOnlyFrozenColumn = props.selectable && frozenColumnsLength.value === 1;\n return !isSelectionOnlyFrozenColumn || hasLeftOverflow.value;\n });\n\n const conditionalRowSetClasses = (isFrozenRowSet: boolean) => ({\n 'b-data-grid__row-cell-set--frozen': isFrozenRowSet,\n [`b-data-grid__row-cell-set--${BentoDatagridStyleState.OVERFLOW_SHADOW_LEFT}`]:\n isFrozenRowSet && hasLeftOverflow.value,\n 'b-data-grid__row-cell-set--frozen-separator': isFrozenRowSet && showFrozenColumnsSeparator.value,\n 'b-data-grid__row-cell-set--unfrozen': !isFrozenRowSet,\n });\n\n // Conditional pagination classes\n const conditionalPaginationClasses = computed(() => ({\n 'b-data-grid__pagination--padding-left-unset': props.columns?.[0]?.padding?.left === false,\n 'b-data-grid__pagination--padding-right-unset':\n props.columns?.[props.columns.length - 1]?.padding?.right === false,\n 'b-data-grid__pagination--sticky': !!props.stickyPagination || isDataGridTemplate,\n }));\n\n /* == Ref registration methods == */\n const registerColumnHeaderRefs = (el: Element | ComponentPublicInstance) => {\n // We always know this will be used on a DataGridColumns component so we can cast it\n const datagridColumnsComponent = el as InstanceType<typeof DataGridColumns>;\n if (el !== null && datagridColumnsComponent?.columnHeaderRefs) {\n Object.entries(datagridColumnsComponent?.columnHeaderRefs).forEach(([fieldName, colHeaderEl]) => {\n columnHeaderRefs.value[fieldName] = colHeaderEl;\n });\n }\n };\n const registerRowCellRef = (el: Element | ComponentPublicInstance, field: string, rowIndex: number) => {\n // We always know this will be used on a DataGridCell component so we can cast it\n const gridCellComponent = el as InstanceType<typeof DataGridCell>;\n if (gridcellRefs.value?.[field] === undefined) {\n gridcellRefs.value = { ...gridcellRefs.value, [field]: [] };\n }\n if (el !== null && gridCellComponent?.gridcellRef) {\n gridcellRefs.value[field][rowIndex] = gridCellComponent.gridcellRef;\n }\n };\n\n /* == Row methods == */\n // Row selecting\n const onRowClick = (row: BentoDatagridDataItem, event: MouseEvent) => {\n if (props.allowRowClicks) {\n emit(BentoDatagridEvent.ROW_CLICK, row, event);\n }\n };\n // Programmatically set the hover state on a row\n const onCellHover = (rowIndex: number) => {\n hoveredRowIndex.value = rowIndex;\n };\n\n const selectableAcrossPagesComputed = computed(() => !!props.selectableAcrossPages && !!props.pagination);\n\n /* == a11y == */\n // TODO: Fix the issue where users provide components into the slot\n const ariaGridHeaderText = useAriaLabel({\n label: slots?.header ? getSlotText(slots)('header') : null,\n defaultFallback: 'data grid',\n });\n const getRowAriaSelectedValue = (row: BentoDatagridDataItem): Booleanish => {\n if (!props.selectable) {\n return null;\n }\n\n const id = props.getDataItemId(row);\n return selectedItems.value.includes(id).toString() as Booleanish;\n };\n\n /* == Action bar == */\n const itemsSelectedCounter = computed(() => selectedItems.value?.length ?? 0);\n const showActionBar = computed(() => props.bulkActions && itemsSelectedCounter.value > 0);\n\n /* == Emits & Events == */\n // Resizing\n const onColumnResized = (resizeEvent: { field: string; width: number }) =>\n emit(BentoDatagridEvent.COLUMN_RESIZE, resizeEvent);\n // Sorting\n const onSort = (updatedSortBy: BentoDatagridSortByColumn[]) => {\n emit(BentoDatagridEvent.UPDATE_SORT_BY, updatedSortBy);\n emit(BentoDatagridEvent.SORT, updatedSortBy);\n };\n // Pagination\n const onPaginationNavigate = (page: number, size: number) => {\n emit(BentoDatagridEvent.NAVIGATE, page);\n emit(BentoDatagridEvent.UPDATE_PAGINATION, {\n ...props.pagination,\n size,\n page,\n });\n };\n const onItemsPerPageChange = (itemsPerPage: number) => {\n emit(BentoDatagridEvent.ITEMS_PAGE, itemsPerPage);\n };\n // Filter bar\n const onSearchTermCleared = () => {\n emit(BentoDatagridEvent.FILTER_SEARCH_CLEAR);\n };\n const onSearchTermInput = newSearchTerm => {\n emit(BentoDatagridEvent.UPDATE_FILTER_SEARCH_TERM, newSearchTerm);\n emit(BentoDatagridEvent.FILTER_SEARCH_INPUT, newSearchTerm);\n };\n\n /* == Warnings == */\n const hasMandatoryColumn = computed(() => columns.value.some(column => column.mandatory));\n if (!hasMandatoryColumn.value) {\n // eslint-disable-next-line no-console\n printDevelopmentWarning(\n 'WARNING: At least one BentoDataGrid column should be set as mandatory to ensure data is always displayed correctly.'\n );\n }\n\n /* == Provide/inject == */\n const setTitle: BentoTabProvidedTitle = inject(EXTERNAL_TITLE_REGISTER_ENTRY_INJECTION_KEY, () => null);\n setTitle(props.tabTitle);\n\n /* == Expose methods == */\n defineExpose({ onEmptyStateClearResetButtonClick });\n</script>\n\n<script lang=\"ts\">\n /**\n * A component to display data in columns and row format with a whole array of configuration for visualization and interaction.\n *\n * @example\n * import { BentoDataGrid } from '@adyen/bento-vue2';\n *\n * export default {\n * components: { BentoDataGrid },\n * template: `\n * <bento-data-grid\n * :data=\"[\n * { id: '123', name: 'John', company: 'TestCompany', 'payment': 200 }\n * { id: '321', name: 'Jane', company: 'Adyen', 'payment': 300 }\n * ]\"\n * :columns=\"[\n * { field: 'name', label: 'Name', minWidth: 300, mandatory: true },\n * { field: 'company', label: 'Reference' },\n * { field: 'payment', label: 'Payment', width: 200, minWidth: 150 },\n * ]\"\n * />\n * `\n * }\n */\n export default {\n i18n: { messages },\n name: 'bento-data-grid',\n };\n</script>\n\n<style lang=\"scss\" scoped src=\"./data-grid.scss\" />\n"],"names":["BentoColumnOverflow","BentoColumnOverflow2","BentoDatagridStyleState","BentoDatagridStyleState2","BentoDatagridSortDirection","BentoDatagridSortDirection2","BentoDatagridEvent","BentoDatagridEvent2","BentoDatagridAriaSortValue","BentoDatagridAriaSortValue2","DatagridColumnsEvent","DatagridColumnsEvent2","useResizer","columns","emit","columnHoverEventToEmitAfterResizing","ref","isResizing","columnWidthOverridesLookup","colKeyLookup","acc","col","columnsRefs","reactive","allColumnRefs","toRefs","stepPositionX","resizingColumnField","defaultResizedColumnWidths","computed","field","width","minWidth","watchEffect","removeMouseMoveResizeListener","removeMouseUpResizeListener","onResizeColumn","event","sizeChange","currResizingColumnField","resizedColumnWidth","stopResize","startResize","hasResizableColumns","listen","watch","newIsResizing","oldIsResizing","DEFAULT_COLUMN_WIDTH","DEFAULT_COLUMN_MIN_WIDTH","DATAGRID_SELECT_FIELD_NAME","DATAGRID_SELECT_WIDTH","DATAGRID_SELECT_WIDTH_WITH_SELECT_ALL_PAGES_ENABLED","DATAGRID_CELL_OFFSET_INITIAL","DATAGRID_CELL_OFFSET_PADDING","computeFlexColumnsWidth","initialFreeSpace","totalFlexUnits","flexCols","flexColumnsLookup","frozenColumnKeys","freezeColumn","value","processFlexItems","violationsLookup","remainingFreeSpace","flexUnits","totalViolation","i","flexColsLength","column","computedWidth","key","getElementWidthIncludingOffset","el","hasColumnPanel","offset","computedStyleOfEl","useCalculateColumnWidth","newColumns","newData","bodyRef","gridColumnsComponentRefs","gridCellRefs","options","data","body","gridColumnsComponents","gridCells","isMeasuringColumnWidths","_a","colA","colB","indexA","item","indexB","gridWidth","bodyElementObserver","onMounted","nextTick","stop","observeSizeOfElement","onUnmounted","onBeforeUpdate","calculatedWidths","widthAllocatedBeforeFlex","columnsLookup","columnDefs","invisibleColumnDefs","columnWidth","_b","fluidCol","computedColumnWidths","onColumnWidthOverride","newColumnWidthOverridesLookup","columnHeaderWidth","largestRowCellWidth","_d","_c","max","largestColumnHeaderAndRowCellWidth","processedColumns","totalWidthOfAllColumns","visible","val","isTotalWidthOfColumnsTakingUpAllAvailableGridWidth","gridColumnWidthStyle","useSelector","selection","getDataItemId","isDataItemDisabled","selectedItems","allItemsSelectedState","emitSelect","updateSelectedItems","dataItem","isEveryItemIncludingDisabledSelected","_e","onAllRowSelect","selectAllItems","onRowSelect","useSorter","sortBy","sortedCol","updatedSortBy","BentoDatagridNavigationKeyCode","BentoDatagridNavigationKeyCode2","KeyCode","useKeyboardNavigator","gridcellRefs","selectable","visibleColumnsCount","visibleColumns","sortedGridCellRefs","b","getCurrentRowIndex","currentIndex","getEdgeCellIndex","direction","ctrlKey","lastCellIndex","lastColumnIndex","currentRowIndex","currentColumn","getCellIndex","directionDiff","newCellIndex","isEdgeNavigationKeyCode","keyCode","getTargetCellIndex","target","directionKeyCode","currentCellIndex","focusOnNextGridcell","cellIndex","isNavigationKeyCode","LAZY_LOAD_BUFFER_PERCENTAGE","useLazyLoading","lazyLoadTypeRef","verticalScrollPositionRef","loading","lazyLoadType","verticalScrollPosition","isLoading","isLazyLoad","isInfiniteScroll","emitLazyLoadEvent","useColumnReorderer","columnsRef","hasDraggableColumnsRef","hasDraggableColumns","draggingColumns","onMoveColumnByOffset","movingColumn","fromIndex","c","toIndex","reorderedColumns","onDragStart","e","onDragEnter","dragEvent","targetRect","midpoint","clientX","onDrop","toIndexInitial","toLeftOfToIndex","firstUnfrozenColumn","onDragEnd","draggingEventsForColumns","draggingEventsForRowCell","useConfigSettings","sortedColumnsByFreezeState","a","frozenColumns","unfrozenColumns","columnSets","columnSet","isOnlyOneVisibleColumn","onConfigSettingsUpdate","isCondensedView","onConfigSettingsColumnsUpdate","updatedColumn","updatedColumns","useCalculateStickyElementHeight","elementRef","isSticky","topPosition","filtersElementObserver","setTopPosition","useScroller","scrollLeftPosition","hasLeftOverflow","hasRightOverflow","useColumnHovering","outline","hoveredOverColumn","hoveredOverColumnState","frozenColumnSet","colSet","unFrozenColumnSet","isFirstFrozenColumn","isFirstUnfrozenColumn","isFrozenSelectableOutlineOnFirstCol","isNoFrozenColAndNotFrozenSelectableOutlineOnFirstCol","isFrozenColumnsAndNotFrozenFirstColumn","isFrozenColumnsAndLastFrozenColumn","isOutlineOnAllColumnWidthFitContainerAndLastColumn","uuid$a","_sfc_main$i","uuid$9","_sfc_main$h","uuid$8","_sfc_main$g","uuid$7","_sfc_main$f","uuid$6","_sfc_main$e","uuid$5","_sfc_main$d","uuid$4","_sfc_main$c","uuid$3","_sfc_main$b","__default__$5","messages$5","CLOSING_CONTEXTUAL_MENU_DELAY_MS","t","useI18n","props","columnHeaderRefs","contextMenuRef","hoveredColumnField","closingTimeOutId","areAllItemsSelected","isSelectColumn","selectAllMenu","isSorting","getSortingDirection","sortByColumnField","getSortingColumnDirection","sortingDirection","draggingEventsForColumn","contextualMenuData","ArrowLeftIcon","ArrowRightIcon","BentoFreezeIcon","HideIcon","ShowIcon","showContextualMenu","hideContextualMenu","timeOutId","dataGridColumnEvents","events","hasColumnActions","registerColumnsRefs","conditionalColumnsClasses","computeMenuPosition","hasFirstColumnPanelRightAligned","index","BentoPopoverPositions","conditionalColumnClasses","columnIndex","_f","_g","_i","_h","_j","conditionalColumnHeaderAndActionsClasses","conditionalColumnActionsClasses","conditionalColumnSeparatorClasses","conditionalColumnHeaderClasses","expose","DatagridConfigSettingsEvent","DatagridConfigSettingsEvent2","uuid$2","_sfc_main$9","_sfc_main$8","defineComponent","messages$4","BentoToggle","isFreezeIconOptionShown","isColumnFrozen","isColumnVisible","toggleColumnVisibility","toggleColumnFreeze","showFreezeIcon","hideFreezeIcon","freezeIconConditionalClasses","_sfc_main$7","messages$3","BentoButton","CrossIcon","BentoPopover","BentoSettingsIcon","BentoToggleButton","BentoDataGridConfigSettingsConfigRow","BentoSearchBar","SearchIcon","BentoTypography","BentoClickOutsideDirective","configSettingsButtonRef","popoverId","generateUid","searchBarRef","isConfigSettingsPanelOpen","allColumnsVisbilityToggleState","searchButtonRef","searchTerm","toRef","isColumnVisibilityFilterShown","filteredColumnVisibilityColumns","useSearchBarFilter","clearAction","areAllNonMandatoryColumnsHidden","toggleColumnFilter","isColumnVisibilityToggleDisabled","emitVisibleColumns","toggleAllColumnVisibility","toggleState","emitFrozenColumns","setConfigSettingsPanelVisibility","isVisible","__default__$4","messages$2","uuid$1","_sfc_main$5","__default__$3","messages$1","limitedRowCellActionsProps","printDevelopmentWarning","getButtonTitle","button","isForSvgTitle","generateButtonEvents","generateMenuEvents","menuDataItem","transformMenuEvents","menuData","transformedMenuData","DataGridCellPropClass","DataGridCellPropClass2","__default__$2","messages","gridcellRef","cellActionsRef","shouldShowCellActions","childrenMenuContainerElements","conditionalTitleAttribute","content","getRowData","rowData","sumColumnAmountsInColumnSets","limitIndex","total","getColIndex","colIndex","colSetIndex","rowIndex","isLeavingCellFocus","relatedTarget","registeredMenuRef","menuElement","onMenuClose","getGridcellEvents","gridCellEvents","registerMenuContainerElement","menuContainerElement","menuMouseLeave","provide","DATA_GRID_CELL_MENU_REGISTERING_INJECTION_KEY","conditionalRowCellClasses","uuid","_sfc_main$2","__default__$1","computedIcon","CheckmarkIcon","WarningIcon","ErrorIcon","NoValueIcon","conditionalClasses","computedIconClass","tooltipPosition","PopperContainerPosition","__default__","slots","useSlots","filtersRef","filterBarRef","allowColumnDragAndDrop","columnPanel","selectableAcrossPages","hoveredRowIndex","frozenColumnsLength","registerDatagridInDataGridTemplate","inject","DATA_GRID_REGISTER_TEMPLATE_INJECTION_KEY","isDataGridTemplate","stickyTabs","tabsRef","computedColumnsTabIndex","localColumnsState","args","definedEmitsFunction","stickyFiltersHeight","computedStickyFiltersTopPosition","columnHeadersHeight","computedColumnHeadersTopPosition","sortedColumns","onConfigSettingsColumnUpdate","navigationInput","updateScrollPosition","updateScrollPositionOnFrozenColumnsNavigation","onEmptyStateClearResetButtonClick","limitedEmptyStateProps","conditionalGridClasses","computedColumnPanelAlignment","conditionalRowClasses","row","showFrozenColumnsSeparator","conditionalRowSetClasses","isFrozenRowSet","conditionalPaginationClasses","registerColumnHeaderRefs","datagridColumnsComponent","fieldName","colHeaderEl","registerRowCellRef","gridCellComponent","onRowClick","onCellHover","selectableAcrossPagesComputed","ariaGridHeaderText","useAriaLabel","getSlotText","getRowAriaSelectedValue","id","itemsSelectedCounter","showActionBar","onColumnResized","resizeEvent","onSort","onPaginationNavigate","page","size","onItemsPerPageChange","itemsPerPage","onSearchTermCleared","onSearchTermInput","newSearchTerm","hasMandatoryColumn","setTitle","EXTERNAL_TITLE_REGISTER_ENTRY_INJECTION_KEY"],"mappings":"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","x_google_ignoreList":[14,15,16,17,18,19,20,21,24,28,32]}
1
+ {"version":3,"file":"data-grid.XsiB40Po.js","sources":["../../src/components/data-grid/data-grid.types.ts","../../src/components/data-grid/components/data-grid-columns/data-grid-columns.types.ts","../../src/components/data-grid/composables/use-resizer.ts","../../src/components/data-grid/composables/use-calculate-column-width/use-calculate-column-width.ts","../../src/components/data-grid/composables/use-selector.ts","../../src/components/data-grid/composables/use-sorter.ts","../../src/components/data-grid/composables/use-keyboard-navigator/use-keyboard-navigator.types.ts","../../src/components/data-grid/composables/use-keyboard-navigator/use-keyboard-navigator.ts","../../src/components/data-grid/composables/use-lazy-loading/use-lazy-loading.ts","../../src/components/data-grid/composables/use-column-reorderer/use-column-reorderer.ts","../../src/components/data-grid/composables/use-config-settings/use-config-settings.ts","../../src/components/data-grid/composables/use-calculate-sticky-element-height/use-calculate-sticky-element-height.ts","../../src/components/data-grid/composables/use-scroller/use-scroller.ts","../../src/components/data-grid/composables/use-column-hovering/use-column-hovering.ts","../../../../node_modules/@adyen/ui-assets-icons-16/dist/vue/arrow-up-down-sort.vue","../../../../node_modules/@adyen/ui-assets-icons-16/dist/vue/arrow-right.vue","../../../../node_modules/@adyen/ui-assets-icons-16/dist/vue/freeze.vue","../../../../node_modules/@adyen/ui-assets-icons-16/dist/vue/hide.vue","../../../../node_modules/@adyen/ui-assets-icons-16/dist/vue/sort-ascending.vue","../../../../node_modules/@adyen/ui-assets-icons-16/dist/vue/sort-descending.vue","../../../../node_modules/@adyen/ui-assets-icons-16/dist/vue/show.vue","../../../../node_modules/@adyen/ui-assets-icons-16/dist/vue/triangle-down.vue","../../src/components/data-grid/components/data-grid-columns/data-grid-columns.vue","../../src/components/data-grid/components/data-grid-config-settings/data-grid-config-settings.types.ts","../../../../node_modules/@adyen/ui-assets-icons-16/dist/vue/settings.vue","../../src/components/data-grid/components/data-grid-config-settings/components/data-grid-config-settings-column-row/data-grid-config-settings-column-row.vue","../../src/components/data-grid/components/data-grid-config-settings/data-grid-config-settings.vue","../../src/components/data-grid/components/data-grid-lazy-load/data-grid-lazy-load.vue","../../../../node_modules/@adyen/ui-assets-icons-16/dist/vue/edit-1.vue","../../src/components/data-grid/components/data-grid-cell-actions/data-grid-cell-actions.vue","../../src/components/data-grid/components/data-grid-cell/data-grid-cell.types.ts","../../src/components/data-grid/components/data-grid-cell/data-grid-cell.vue","../../../../node_modules/@adyen/ui-assets-icons-16/dist/vue/warning-circle-fill.vue","../../src/components/data-grid/components/data-grid-static-icon/data-grid-static-icon.vue","../../src/components/data-grid/data-grid.vue"],"sourcesContent":["import type { BentoPagination } from '@/components/pagination';\nimport type { BentoEmptyState } from '@/components/empty-state';\nimport type { BentoColumnCellActions } from './components/data-grid-cell-actions/data-grid-cell-actions.types';\n\nexport enum BentoColumnOverflow {\n WRAP = 'wrap',\n ELLIPSIS = 'ellipsis',\n}\n\nexport interface BentoColumn {\n field: string;\n label: string;\n width?: number;\n autoWidth?: boolean;\n minWidth?: number;\n flex?: number;\n sortable?: boolean;\n numeric?: boolean;\n infoIconTooltip?: string;\n padding?: {\n left?: boolean;\n right?: boolean;\n };\n overflow?: BentoColumnOverflow;\n visible?: boolean;\n mandatory?: boolean;\n frozen?: boolean;\n cellActions?: BentoColumnCellActions;\n}\n\nexport enum BentoDatagridStyleState {\n OUTLINE = 'outline',\n SCROLL = 'scroll',\n STICKY_FILTERS = 'sticky-filters',\n OVERFLOW_SHADOW_LEFT = 'overflow-shadow-left',\n OVERFLOW_SHADOW_RIGHT = 'overflow-shadow-right',\n NO_SPACING_TOP = 'no-spacing-top',\n}\n\nexport enum BentoDatagridSortDirection {\n ASCENDING = 'asc',\n DESCENDING = 'desc',\n}\n\nexport interface BentoDatagridSortByColumn {\n field: BentoColumn['field'];\n direction: BentoDatagridSortDirection;\n}\n\nexport type BentoDatagridDataItemId = string | number;\n\nexport type BentoDatagridSelection = BentoDatagridDataItemId[];\n\nexport interface BentoDatagridDataItem {\n id?: BentoDatagridDataItemId;\n [fieldName: string]: unknown;\n}\n\nexport type BentoDatagridData = BentoDatagridDataItem[];\n\nexport type BentoDatagridGetDataItemIdFn = (item: BentoDatagridDataItem) => BentoDatagridDataItemId;\n\nexport type BentoDatagridIsDataItemDisabledFn = (item: BentoDatagridDataItem) => boolean;\n\nexport type BentoDatagridPaginationProps = InstanceType<typeof BentoPagination>['$props'];\n\nexport interface BentoColumnWidthOverridesLookup {\n [field: string]: {\n width: BentoColumn['width'];\n };\n}\n\nexport interface BentoDatagridAllItemsSelectedState {\n allItemsSelected: boolean;\n isIndeterminate: boolean;\n}\n\nexport enum BentoDatagridEvent {\n COLUMNS = 'columns',\n COLUMN_RESIZE = 'column-resize',\n ITEMS_PAGE = 'items-page',\n NAVIGATE = 'navigate',\n FILTER_SEARCH_INPUT = 'filter-search-input',\n FILTER_SEARCH_CLEAR = 'filter-search-clear',\n UPDATE_COLUMNS = 'update:columns',\n UPDATE_CONDENSED = 'update:condensed',\n UPDATE_FILTERS = 'update:filters',\n UPDATE_FILTER_VALUES = 'update:filter-values',\n UPDATE_FILTER_SEARCH_TERM = 'update:filter-search-term',\n UPDATE_PAGINATION = 'update:pagination',\n UPDATE_SELECTION = 'update:selection',\n UPDATE_SHOW_MORE = 'update:show-more',\n UPDATE_SORT_BY = 'update:sort-by',\n ROW_CLICK = 'row-click',\n SELECT = 'select',\n SELECT_ALL_ACROSS_PAGES = 'select-all-across-pages',\n SORT = 'sort',\n}\n\nexport enum BentoDatagridAriaSortValue {\n ASCENDING = 'ascending',\n DESCENDING = 'descending',\n NONE = 'none',\n}\n\nexport type BentoDatagridEmptyStateProps = InstanceType<typeof BentoEmptyState>['$props'];\n","import { BentoColumn } from '../../data-grid.types';\n\n/**\n * All the emit events provided by the DatagridColumns component\n */\nexport enum DatagridColumnsEvent {\n COLUMN_RESIZE = 'column-resize',\n COLUMN_RESIZING = 'column-resizing',\n SORT = 'sort',\n SELECT_ALL_ROWS = 'select-all-rows',\n SELECT_ALL_ACROSS_PAGES = 'select-all-across-pages',\n COLUMN_MOVE = 'column-move',\n COLUMN_UPDATE = 'column-update',\n COLUMN_MENU_OPEN = 'column-menu-open',\n COLUMN_MENU_CLOSE = 'column-menu-close',\n COLUMN_HOVER = 'column-hover',\n\n // Dragging events\n COLUMN_DRAG_START = 'column-dragstart',\n COLUMN_DRAG_ENTER = 'column-dragenter',\n COLUMN_DRAG_END = 'column-dragend',\n COLUMN_DROP = 'column-drop',\n}\n\nexport interface DatagridColumnsHeaderReferences {\n [key: string]: HTMLDivElement | null;\n}\n\n/**\n * The Datagrid column dragging state.\n * @interface BentoDatagridDraggingColumnState\n * @field dragging - The column currently being dragged.\n * @field target - The column being dragged over during dragging another column.\n */\nexport interface BentoDatagridDraggingColumnState {\n dragging?: BentoColumn;\n dragToLeft?: boolean;\n target?: BentoColumn;\n}\n","/* eslint-disable no-param-reassign */\nimport { computed, reactive, ref, Ref, toRefs, watch, watchEffect } from 'vue';\nimport { listen } from '@/utils/ts/events';\nimport { DatagridColumnsEvent } from '../components/data-grid-columns/data-grid-columns.types';\nimport type { BentoColumn, BentoColumnWidthOverridesLookup } from '../data-grid.types';\n\n/**\n * Contains all the resize methods and logic to allow users to resize column widths.\n * We listen for 3 main events:\n * - startResize: when the user clicks on a column divider.\n * - onResize: the tracking of the user dragging the columns divider left or right.\n * - stopResize: when the user fires the mouseup event and the column needs to be resized.\n *\n * With these 3 events we can track and store users manually changing column width.\n *\n * @param columns An array of columns definitions\n * @param emit The `bento-data-grid` emit function\n * @returns All resize refs, variables and methods\n */\nexport const useResizer = (\n columns: Ref<BentoColumn[]>,\n emit: (event: DatagridColumnsEvent, ...args: unknown[]) => void\n) => {\n const columnHoverEventToEmitAfterResizing = ref<BentoColumn>(null);\n const isResizing = ref(false);\n const columnWidthOverridesLookup = ref<BentoColumnWidthOverridesLookup>(undefined);\n // Initalise resize refs, reactive obects and computed variables\n // Set up column refs for each column header identified by the key\n const colKeyLookup = columns.value.reduce((acc, col) => {\n acc[col.field] = null;\n return acc;\n }, {});\n const columnsRefs = reactive(colKeyLookup);\n const allColumnRefs = toRefs(columnsRefs);\n\n let stepPositionX = 0;\n let resizingColumnField = '';\n\n // Setup the reactive resize data object to be used in all the event methods\n const defaultResizedColumnWidths = computed(() =>\n Object.fromEntries(columns.value.map(({ field, width, minWidth }) => [field, { width, minWidth }]))\n );\n\n // eslint-disable-next-line no-return-assign\n watchEffect(() => (columnWidthOverridesLookup.value = defaultResizedColumnWidths.value));\n\n // Intialise resize methods\n let removeMouseMoveResizeListener: () => void = null;\n let removeMouseUpResizeListener: () => void = null;\n\n // When the user is resizing the column keep track of mouse position and update column width\n const onResizeColumn = (event: MouseEvent) => {\n const sizeChange = event.clientX - stepPositionX;\n const currResizingColumnField = resizingColumnField;\n\n const resizedColumnWidth = columnWidthOverridesLookup.value[currResizingColumnField].width + sizeChange;\n // If the column width is more than the minWidth set the new resized width or else use the minWidth\n columnWidthOverridesLookup.value[currResizingColumnField].width =\n resizedColumnWidth > defaultResizedColumnWidths.value[currResizingColumnField].minWidth\n ? resizedColumnWidth\n : defaultResizedColumnWidths.value[currResizingColumnField].minWidth;\n\n /**\n * Triggered when a column is resized\n *\n * @event column-resizing\n * @property BentoColumnWidthOverridesLookup columnWidthOverridesLookup - the column width overrides.\n */\n emit(DatagridColumnsEvent.COLUMN_RESIZING, columnWidthOverridesLookup.value);\n\n stepPositionX = event.clientX;\n };\n\n // When the user fires the mouse up event, set the resizing column width\n const stopResize = () => {\n isResizing.value = false;\n removeMouseMoveResizeListener?.();\n removeMouseUpResizeListener?.();\n\n if (resizingColumnField) {\n /**\n * Triggered when a column is resized\n *\n * @event column-resize\n * @property {field: string; width: number;} resizedColumn - the resized columns field name and new width.\n */\n emit(DatagridColumnsEvent.COLUMN_RESIZE, {\n field: resizingColumnField,\n width: columnWidthOverridesLookup.value[resizingColumnField].width,\n });\n }\n\n // Reset all resize vars back to defaults\n removeMouseMoveResizeListener = null;\n removeMouseUpResizeListener = null;\n resizingColumnField = '';\n stepPositionX = null;\n };\n\n // When the user interacts with the column resizer, set it's start position and the column we are interacting with\n const startResize = (hasResizableColumns: boolean, field: BentoColumn['field'], event: MouseEvent) => {\n event.preventDefault();\n if (hasResizableColumns) {\n isResizing.value = true;\n if (event.buttons !== 1) {\n stopResize();\n return;\n }\n\n resizingColumnField = field;\n stepPositionX = event.clientX;\n\n removeMouseMoveResizeListener = listen(window, 'mousemove', onResizeColumn);\n removeMouseUpResizeListener = listen(window, 'mouseup', stopResize);\n }\n };\n\n // When resizing we need to keep track of what the last column-hover emit was so we can emit that when we're finished resizing\n watch(\n () => isResizing.value,\n (newIsResizing, oldIsResizing) => {\n if (!newIsResizing && oldIsResizing) {\n emit(DatagridColumnsEvent.COLUMN_HOVER, columnHoverEventToEmitAfterResizing.value);\n columnHoverEventToEmitAfterResizing.value = null;\n }\n }\n );\n return {\n resizeData: columnWidthOverridesLookup,\n allColumnRefs,\n startResize,\n isResizing,\n columnHoverEventToEmitAfterResizing,\n };\n};\n","import { computed, nextTick, onBeforeUpdate, onMounted, onUnmounted, type Ref, ref, watch } from 'vue';\nimport { observeSizeOfElement } from '@/utils/ts/resize';\nimport { isVue3 } from 'vue-demi';\nimport type { BentoColumn, BentoColumnWidthOverridesLookup, BentoDatagridData } from '../../data-grid.types';\nimport type { CalculateColumnWidthOptions, FlexColumnLookup } from './use-calculate-column-width.types';\nimport type { MaybeRef } from '@/types';\nimport type { DatagridColumnsHeaderReferences } from '../../components/data-grid-columns/data-grid-columns.types';\n\n// Default constants\nexport const DEFAULT_COLUMN_WIDTH = 100;\nexport const DEFAULT_COLUMN_MIN_WIDTH = 50;\n\n// Select column constants\nexport const DATAGRID_SELECT_FIELD_NAME = 'b-select';\nexport const DATAGRID_SELECT_WIDTH = 32;\n// If select all pages is enabled we need to make the select column larger\nexport const DATAGRID_SELECT_WIDTH_WITH_SELECT_ALL_PAGES_ENABLED = 56;\n\n// Cell and Column header offset constants\nexport const DATAGRID_CELL_OFFSET_INITIAL = 4;\nexport const DATAGRID_CELL_OFFSET_PADDING = 16;\n\n/**\n * For fluid width caclulations we adhere to the caclulations done for the CSS flexbox:\n * https://drafts.csswg.org/css-flexbox-1/#resolve-flexible-lengths\n *\n * @param initialFreeSpace The amount of freespace to allow flex columns within\n * @param totalFlexUnits The total amount of flex units to allocate\n * @param flexCols An array of columns with a flex unit assigned to them\n * @returns A keyed object of columns and their computed widths\n */\nconst computeFlexColumnsWidth = (initialFreeSpace: number, totalFlexUnits: number, flexCols: BentoColumn[]) => {\n const flexColumnsLookup: FlexColumnLookup = {};\n const frozenColumnKeys: BentoColumn['field'][] = [];\n\n const freezeColumn = (field: BentoColumn['field']) => {\n const value = flexColumnsLookup[field];\n if (value && value.frozen !== true) {\n flexColumnsLookup[field].frozen = true;\n frozenColumnKeys.push(field);\n }\n };\n\n // Step 5 of https://drafts.csswg.org/css-flexbox-1/#resolve-flexible-lengths\n function processFlexItems() {\n // 5a: If all the flex items on the line are frozen, free space has been distributed.\n if (frozenColumnKeys.length === flexCols.length) {\n return;\n }\n\n const violationsLookup: {\n min: Record<BentoColumn['field'], boolean>;\n max: Record<BentoColumn['field'], boolean>;\n } = { min: {}, max: {} };\n\n let remainingFreeSpace = initialFreeSpace;\n let flexUnits = totalFlexUnits;\n let totalViolation = 0;\n\n // 5b: Calculate the remaining free space\n frozenColumnKeys.forEach(field => {\n remainingFreeSpace -= flexColumnsLookup[field].computedWidth;\n flexUnits -= flexColumnsLookup[field].flex;\n });\n\n for (let i = 0, flexColsLength = flexCols.length; i < flexColsLength; i += 1) {\n const column = flexCols[i];\n\n // If this column is frozen no need to re-recalculate it's width\n if (flexColumnsLookup[column.field] && flexColumnsLookup[column.field].frozen === true) {\n // NOTE: the following eslint rule was disabled because we check each column's frozen status\n // and if one exists we need to keep recursively caclulating the flex column widths.\n // eslint-disable-next-line no-continue\n continue;\n }\n\n // 5c: Distribute remaining free space proportional to the flex factors\n const widthPerFlexUnit = remainingFreeSpace / flexUnits;\n let computedWidth = widthPerFlexUnit * column.flex;\n\n // 5d: Fix minWidth violations\n if (computedWidth < column.minWidth) {\n totalViolation += column.minWidth - computedWidth;\n computedWidth = column.minWidth;\n violationsLookup.min[column.field] = true;\n }\n\n flexColumnsLookup[column.field] = {\n frozen: false,\n computedWidth,\n flex: column.flex,\n };\n }\n\n // 5e: Freeze over-flexed items\n if (totalViolation > 0) {\n // Freeze all the items with minWidth violations\n Object.keys(violationsLookup.min).forEach(field => {\n freezeColumn(field);\n });\n } else {\n // Freeze all items\n flexCols.forEach(({ field: key }) => {\n freezeColumn(key);\n });\n }\n\n // 5f: Return to the start of this loop\n processFlexItems();\n }\n\n processFlexItems();\n\n return flexColumnsLookup;\n};\n\n/**\n * Calculates width of HTMLDivElement including any additional offset depending on if:\n * - An edge occurs where sometimes the padding CSS has not loaded yet\n * - When calculating column header width, if the column panel is enabled\n *\n * @param el - an HTML Div element\n * @param hasColumnPanel - if provided and true will be used to calculate the offset\n * @returns the width of the element including offset values\n */\nconst getElementWidthIncludingOffset = (el: HTMLDivElement, hasColumnPanel?: boolean) => {\n let offset = DATAGRID_CELL_OFFSET_INITIAL;\n if (el) {\n const computedStyleOfEl = getComputedStyle(el);\n // If paddings have not been applied yet the manually adjust the offset\n if (computedStyleOfEl?.padding === '0px') {\n offset += DATAGRID_CELL_OFFSET_PADDING * 2; // 16px padding on left & right\n }\n }\n // If we include column panel in the calculation we should add 2 spacers to leave room for the contextual menu button\n if (hasColumnPanel) {\n offset += DATAGRID_CELL_OFFSET_PADDING * 2;\n }\n\n return el?.offsetWidth ? el.offsetWidth + offset : 0;\n};\n\n/**\n * Calculates the width of the columns using width, minWidth and/or a fluid number.\n *\n * @param newColumns An array of column definitions\n * @param newData An array of data objects to display.\n * @param bodyRef Ref to the `bento-data-grid` body container\n * @param gridCellRefs An array of Ref for each one of the cells available by Column\n * @param options Optional options for the calculator to be aware of.\n */\nexport const useCalculateColumnWidth = (\n newColumns: Ref<BentoColumn[]>,\n newData: MaybeRef<BentoDatagridData>,\n bodyRef: MaybeRef<HTMLDivElement | undefined>,\n gridColumnsComponentRefs: MaybeRef<DatagridColumnsHeaderReferences>,\n gridCellRefs: MaybeRef<{ [key: string]: HTMLDivElement[] } | undefined>,\n options?: CalculateColumnWidthOptions\n) => {\n const columns = ref(newColumns.value);\n const data = ref(newData);\n const body = ref(bodyRef);\n const gridColumnsComponents = ref(gridColumnsComponentRefs);\n const gridCells = ref(gridCellRefs);\n const isMeasuringColumnWidths = ref(false);\n\n // Watch for updates to columns property but don't change order or width\n watch(\n () => newColumns.value,\n () => {\n columns.value =\n columns.value?.length === 0\n ? newColumns.value\n : newColumns.value\n // Keep the order the same as it was, adding any new columns to the end\n .sort((colA, colB) => {\n // Find the index of each item in the orderArray\n const indexA = columns.value.findIndex(item => item.field === colA.field);\n const indexB = columns.value.findIndex(item => item.field === colB.field);\n // Place items not in orderArray at the end\n if (indexA === -1) {\n return 1;\n }\n if (indexB === -1) {\n return -1;\n }\n return indexA - indexB;\n });\n }\n );\n\n // Observe the size of the table body and store the width for column and CSS width calculations\n const gridWidth = ref<number>();\n let bodyElementObserver: ResizeObserver | null = null;\n\n onMounted(() => {\n nextTick(() => {\n if (body.value) {\n gridWidth.value = body.value.getBoundingClientRect().width;\n }\n // Keep watching element till it's defined, when it is observe element's width\n const stop = watch(\n body,\n () => {\n if (body.value) {\n nextTick(() => stop());\n bodyElementObserver = observeSizeOfElement(body.value, ({ width }) => {\n gridWidth.value = width;\n });\n }\n },\n { immediate: true }\n );\n });\n });\n onUnmounted(() => {\n bodyElementObserver?.disconnect();\n });\n onBeforeUpdate(() => {\n if (gridCells.value && Object.keys(gridCells.value)?.length > 0) {\n const columnKeys = Object.keys(gridCells.value);\n columnKeys.forEach(key => {\n gridCells.value[key] = [];\n });\n }\n });\n\n const calculatedWidths = computed(() => {\n // Setup vars\n const flexCols = [];\n let totalFlexUnits = 0;\n let widthAllocatedBeforeFlex = 0;\n // reduce columns into keyed object\n const columnsLookup: {\n [columnKey: string]: BentoColumn;\n } = {};\n let columnDefs: BentoColumn[] = columns.value.filter(col => col.visible !== false);\n const invisibleColumnDefs: BentoColumn[] = columns.value.filter(col => col.visible === false);\n // Prepend a column if needs selecting functionality\n if (options?.hasSelectableColumn?.value) {\n const columnWidth = options?.hasSelectableAcrossPages?.value\n ? DATAGRID_SELECT_WIDTH_WITH_SELECT_ALL_PAGES_ENABLED\n : DATAGRID_SELECT_WIDTH;\n columnDefs = [\n {\n field: DATAGRID_SELECT_FIELD_NAME,\n label: '',\n minWidth: columnWidth,\n width: columnWidth,\n frozen: true,\n padding: { left: false, right: false },\n },\n ...columnDefs,\n ];\n }\n\n // For the non-flex columns, compute their width\n // For the flex columns, compute there minimum width and how much width must be allocated during the flex allocation\n columnDefs.forEach(col => {\n const fluidCol: BentoColumn = { ...col };\n let width: number;\n if (fluidCol.flex && fluidCol.flex > 0) {\n // If a fluid column, add flex units to total and prepare them for calculation\n totalFlexUnits += fluidCol.flex;\n width = 0;\n flexCols.push(fluidCol);\n } else {\n // If not a fluid column use the width (or minWidth if this is a larger value)\n width = Math.max(\n fluidCol?.width ?? DEFAULT_COLUMN_WIDTH,\n fluidCol?.minWidth ?? DEFAULT_COLUMN_MIN_WIDTH\n );\n }\n\n widthAllocatedBeforeFlex += width;\n fluidCol.width = width;\n fluidCol.minWidth = fluidCol?.minWidth ?? DEFAULT_COLUMN_MIN_WIDTH;\n\n columnsLookup[fluidCol.field] = fluidCol;\n });\n\n // Calculate how much space we have available for fluids widths by subtracting the non-fluid column widths\n const initialFreeSpace = Math.max(gridWidth.value - widthAllocatedBeforeFlex, 0);\n\n // Allocate the remaining space to the flex columns\n if (totalFlexUnits > 0 && gridWidth.value > 0) {\n const computedColumnWidths = computeFlexColumnsWidth(initialFreeSpace, totalFlexUnits, flexCols);\n\n Object.keys(computedColumnWidths).forEach(field => {\n columnsLookup[field].width = computedColumnWidths[field].computedWidth;\n });\n }\n\n // Add in invisible columns\n invisibleColumnDefs.forEach(col => {\n const fluidCol: BentoColumn = { ...col };\n columnsLookup[fluidCol.field] = fluidCol;\n });\n\n return Object.values(columnsLookup);\n });\n\n // RESIZE OBJECT\n const columnWidthOverridesLookup = ref<BentoColumnWidthOverridesLookup>(undefined);\n\n const onColumnWidthOverride = (newColumnWidthOverridesLookup: BentoColumnWidthOverridesLookup) => {\n columnWidthOverridesLookup.value = { ...columnWidthOverridesLookup.value, ...newColumnWidthOverridesLookup };\n };\n\n // Auto-width logic\n watch(\n [() => columns.value, () => data.value],\n async () => {\n if (columns.value.some(column => column?.autoWidth)) {\n // First we need to measure the row cells for each column after 1 tick\n isMeasuringColumnWidths.value = true;\n await nextTick();\n // Need to await an extra tick for vue 3 because of how vue 3 re-renders children component when changing props\n if (isVue3) {\n await nextTick();\n }\n // Now we find the biggest cell for each auto width column\n columns?.value\n .filter(column => column?.autoWidth)\n .forEach(({ field, minWidth }) => {\n const columnHeaderWidth = getElementWidthIncludingOffset(\n gridColumnsComponents.value?.[field],\n options?.hasColumnPanel?.value\n );\n\n const largestRowCellWidth = gridCells.value?.[field]?.reduce(\n (max, el) => Math.max(max, getElementWidthIncludingOffset(el)),\n 0\n );\n\n const largestColumnHeaderAndRowCellWidth = Math.max(\n columnHeaderWidth,\n largestRowCellWidth ?? 0\n );\n\n if (minWidth === undefined || largestColumnHeaderAndRowCellWidth > minWidth) {\n onColumnWidthOverride({\n [field]: {\n width: largestColumnHeaderAndRowCellWidth,\n },\n });\n }\n });\n\n isMeasuringColumnWidths.value = false;\n }\n },\n { immediate: true }\n );\n\n const processedColumns = computed(() =>\n calculatedWidths.value.map(col => ({\n ...col,\n // Override column width with resized ones\n width: columnWidthOverridesLookup.value?.[col.field]?.width ?? col.width,\n }))\n );\n\n // Generate grid width styles\n const totalWidthOfAllColumns = computed(() =>\n processedColumns.value?.filter(({ visible }) => visible !== false).reduce((acc, val) => val.width + acc, 0)\n );\n\n const isTotalWidthOfColumnsTakingUpAllAvailableGridWidth = computed(\n () => gridWidth.value <= totalWidthOfAllColumns.value\n );\n\n const gridColumnWidthStyle = computed(() => ({\n width: gridWidth.value > totalWidthOfAllColumns.value ? '100%' : 'fit-content',\n }));\n\n return {\n columnDefs: processedColumns,\n gridColumnWidthStyle,\n onColumnWidthOverride,\n isMeasuringColumnWidths,\n isTotalWidthOfColumnsTakingUpAllAvailableGridWidth,\n columns,\n };\n};\n","import { nextTick, reactive, ref, Ref, watch } from 'vue';\nimport {\n BentoDatagridAllItemsSelectedState,\n BentoDatagridData,\n BentoDatagridDataItemId,\n BentoDatagridEvent,\n BentoDatagridGetDataItemIdFn,\n BentoDatagridIsDataItemDisabledFn,\n} from '../data-grid.types';\n\n/**\n * Exposed selection variables and methods for a data component to use and react to.\n * @param selection A list of unique IDs\n * @param emit The emit function to fire upon selection\n * @param data The list of data items\n * @param getDataItemId The method to retrieve the unique ID of a data item\n * @param isDataItemDisabled The method to determine if the data item is disabled for selection\n */\nexport const useSelector = (\n selection: Ref<BentoDatagridDataItemId[]>,\n emit: (event: string, emitedSelectedItems: BentoDatagridDataItemId[]) => void,\n data: Ref<BentoDatagridData>,\n getDataItemId: BentoDatagridGetDataItemIdFn,\n isDataItemDisabled: BentoDatagridIsDataItemDisabledFn\n) => {\n const selectedItems = ref<BentoDatagridDataItemId[]>(selection.value ?? []);\n const allItemsSelectedState = reactive<BentoDatagridAllItemsSelectedState>({\n allItemsSelected: false,\n isIndeterminate: false,\n });\n\n const emitSelect = () => {\n emit(BentoDatagridEvent.SELECT, selectedItems.value);\n emit(BentoDatagridEvent.UPDATE_SELECTION, selectedItems.value);\n };\n\n // Update the selected items state & the select / de-select all column checkbox state by:\n // - Set the selected items state\n // - Set the \"select / de-select all\" checked state\n // - If all seletcted, set indeterminate to true if not all items were selected including disabled ones.\n // - If not all selected, set indeterminate to true if at least 1 item has been selected in the currently shown data.\n const updateSelectedItems = (value: BentoDatagridDataItemId[]) => {\n selectedItems.value = value;\n // Check every item except for disabled items\n const isEveryItemSelected =\n data.value?.length > 0 &&\n data.value\n ?.filter(dataItem => !isDataItemDisabled(dataItem))\n .every(item => selectedItems.value.includes(getDataItemId(item)));\n if (isEveryItemSelected) {\n allItemsSelectedState.allItemsSelected = true;\n // If all items are checked, we should check if there are disabled items that are not checked, if so then we set isIndeterminate to true\n const isEveryItemIncludingDisabledSelected =\n data.value?.length > 0 && data.value.every(item => selectedItems.value.includes(getDataItemId(item)));\n\n allItemsSelectedState.isIndeterminate = !isEveryItemIncludingDisabledSelected;\n } else {\n allItemsSelectedState.allItemsSelected = false;\n // Check if at least 1 item in the currently shown data is selected\n allItemsSelectedState.isIndeterminate =\n selectedItems.value?.length > 0 &&\n data.value?.length > 0 &&\n data.value.some(item => selectedItems.value.includes(getDataItemId(item)));\n }\n };\n\n // Reacts to the \"select / de-select all\" checkbox updates\n // 1. Set the \"select / de-select all\" checked state to incoming parameter\n // 2. Set the selected items state\n // - If selecting all then interminate state to true if checked state is checked but not all items (including disabled ones) are selected\n // - If de-selecting all, then set interminate state to false\n // 3. Emit selected state\n const onAllRowSelect = (selectAllItems: boolean) => {\n nextTick(() => {\n // The allItemsSelected must be kept in sync with the checked checkbox state\n allItemsSelectedState.allItemsSelected = selectAllItems;\n if (selectAllItems) {\n // Check all undisabled rows\n selectedItems.value = data.value\n ?.filter(dataItem => !isDataItemDisabled(dataItem))\n ?.map(dataItem => getDataItemId(dataItem));\n // If all items are checked, we should check if there are disabled items that are not checked, if so then we set isIndeterminate to true\n const isEveryItemIncludingDisabledSelected =\n data.value?.length > 0 &&\n data.value.every(item => selectedItems.value.includes(getDataItemId(item)));\n allItemsSelectedState.isIndeterminate =\n selectedItems.value.length > 0 && !isEveryItemIncludingDisabledSelected;\n } else {\n selectedItems.value = [];\n allItemsSelectedState.isIndeterminate = false;\n }\n emitSelect();\n });\n };\n\n const onRowSelect = (value: BentoDatagridDataItemId[]) => {\n nextTick(() => {\n updateSelectedItems(value);\n emitSelect();\n });\n };\n\n // If the selection prop is changed we should update local selection state\n watch(\n () => selection.value,\n () => {\n updateSelectedItems(selection.value ?? []);\n },\n { immediate: true }\n );\n\n // If the data is changed then we should update the select all checkbox if needed\n watch(\n () => data.value,\n () => {\n updateSelectedItems(selectedItems.value);\n }\n );\n\n return { onAllRowSelect, onRowSelect, allItemsSelectedState, selectedItems };\n};\n","import { Ref } from 'vue';\nimport { BentoColumn, BentoDatagridSortByColumn, BentoDatagridSortDirection } from '../data-grid.types';\nimport { DatagridColumnsEvent } from '../components/data-grid-columns/data-grid-columns.types';\n\n/**\n * Handles the sort direction logic of the columns in DataGrid.\n * Emits the `sort` event with the new direction when the field sort direction changes.\n * @param sortBy Sort directions per field that is `sortable: true`\n * @param columns Array of all columns in the grid\n * @param emit The `bento-data-grid` emit function\n */\nexport const useSorter = (\n sortBy: Ref<BentoDatagridSortByColumn[]>,\n columns: Ref<BentoColumn[]>,\n emit: (event: DatagridColumnsEvent, updatedSortBy: BentoDatagridSortByColumn[]) => void\n) => {\n const isSorting = (field: string) => sortBy.value.some(sortedCol => sortedCol.field === field);\n\n const getSortingDirection = (field: string) => sortBy.value.find(sortedCol => sortedCol.field === field)?.direction;\n\n // The column head click event to sort data by certain field and direction\n const sortByColumnField = (field: string) => {\n // First check if column is sortable\n if (!columns.value.some(col => col.field === field && col.sortable)) {\n return;\n }\n\n // Return the updated sortBy array of sorted columns\n const newColumnSort: BentoDatagridSortByColumn = {\n field,\n direction:\n sortBy.value.find(sortedCol => sortedCol.field === field)?.direction ===\n BentoDatagridSortDirection.ASCENDING\n ? BentoDatagridSortDirection.DESCENDING\n : BentoDatagridSortDirection.ASCENDING,\n };\n\n const updatedSortBy = [newColumnSort];\n\n emit(DatagridColumnsEvent.SORT, updatedSortBy);\n };\n\n return { isSorting, getSortingDirection, sortByColumnField };\n};\n","import { KeyCode } from '@/types/utils-events';\n\nexport enum BentoDatagridNavigationKeyCode {\n ARROW_DOWN = KeyCode.ARROW_DOWN,\n ARROW_UP = KeyCode.ARROW_UP,\n ARROW_LEFT = KeyCode.ARROW_LEFT,\n ARROW_RIGHT = KeyCode.ARROW_RIGHT,\n PAGE_UP = KeyCode.PAGE_UP,\n PAGE_DOWN = KeyCode.PAGE_DOWN,\n END = KeyCode.END,\n HOME = KeyCode.HOME,\n}\n","import { computed, Ref } from 'vue';\nimport { BentoDatagridNavigationKeyCode } from './use-keyboard-navigator.types';\nimport type { BentoColumn } from '../../data-grid.types';\n\n/**\n * A composable that handles all the keyboard navigation logic within the data-grid.\n * This provide grid navigation by moving focus among cells of the grid using the keyboard\n * @param gridcellRefs Array of references to the HTML elements of the cells.\n * @param columns The reference to the array of column configurations\n * @param selectable The reference to the selectable prop that enable row to be selected via a checkbox.\n */\nexport const useKeyboardNavigator = (\n gridcellRefs: Ref<{ [key: string]: HTMLDivElement[] }>,\n columns: Ref<BentoColumn[]>,\n selectable: Ref<boolean>\n) => {\n // Count the number of visible columns\n const visibleColumnsCount = computed(() => {\n const visibleColumns = columns.value.filter(({ visible }) => visible !== false);\n if (selectable.value) {\n return visibleColumns.length + 1;\n }\n return visibleColumns.length;\n });\n\n // Sort the grid cell references by their cellindex value\n const sortedGridCellRefs = computed(() =>\n [...Object.values(gridcellRefs.value)].flat(1).sort((a, b) => {\n const indexA = Number(a.getAttribute('data-cellindex'));\n const indexB = Number(b.getAttribute('data-cellindex'));\n if (indexA > indexB) {\n return 1;\n }\n if (indexB > indexA) {\n return -1;\n }\n return 0;\n })\n );\n // Returns the index of the row that a given cell is found\n const getCurrentRowIndex = (currentIndex: number) => Math.floor(currentIndex / visibleColumnsCount.value);\n\n // Calculates the next focused cell index when users navigates using keys to navigate on the edge of the grid\n // e.g. Home, Page Up, Page Down, ...\n const getEdgeCellIndex = (currentIndex: number, direction: BentoDatagridNavigationKeyCode, ctrlKey: boolean) => {\n const lastCellIndex = sortedGridCellRefs.value.length - 1;\n const lastColumnIndex = visibleColumnsCount.value - 1;\n const currentRowIndex = getCurrentRowIndex(currentIndex);\n const currentColumn = currentIndex - visibleColumnsCount.value * currentRowIndex;\n\n const cellIndexByDirection = {\n [BentoDatagridNavigationKeyCode.PAGE_UP]: currentColumn,\n [BentoDatagridNavigationKeyCode.PAGE_DOWN]: lastCellIndex - lastColumnIndex + currentColumn,\n [BentoDatagridNavigationKeyCode.END]: ctrlKey\n ? lastCellIndex\n : visibleColumnsCount.value * currentRowIndex + lastColumnIndex,\n [BentoDatagridNavigationKeyCode.HOME]: ctrlKey ? 0 : visibleColumnsCount.value * currentRowIndex,\n };\n\n return cellIndexByDirection[direction];\n };\n\n // Calculates the next focused cell index when users navigates using keys to navigate cell by cell\n // e.g. Arrow Right, Arrow Left, Arrow Up, Arrow Down\n const getCellIndex = (currentIndex: number, direction: BentoDatagridNavigationKeyCode) => {\n const directionDiffMap = {\n [BentoDatagridNavigationKeyCode.ARROW_DOWN]: visibleColumnsCount.value,\n [BentoDatagridNavigationKeyCode.ARROW_UP]: -visibleColumnsCount.value,\n [BentoDatagridNavigationKeyCode.ARROW_LEFT]: -1,\n [BentoDatagridNavigationKeyCode.ARROW_RIGHT]: 1,\n };\n\n const directionDiff = directionDiffMap[direction];\n const newCellIndex = currentIndex + directionDiff;\n\n if (newCellIndex < 0 || newCellIndex >= sortedGridCellRefs.value.length) {\n return currentIndex;\n }\n\n return newCellIndex;\n };\n\n // Verifies if a key is used to navigate on the edges of the data-grid\n const isEdgeNavigationKeyCode = (keyCode: BentoDatagridNavigationKeyCode) =>\n [\n BentoDatagridNavigationKeyCode.PAGE_UP,\n BentoDatagridNavigationKeyCode.PAGE_DOWN,\n BentoDatagridNavigationKeyCode.END,\n BentoDatagridNavigationKeyCode.HOME,\n ].includes(keyCode);\n\n // Returns the next cell to be focused based on the keys pressed by the user\n const getTargetCellIndex = (\n target: EventTarget,\n directionKeyCode: BentoDatagridNavigationKeyCode,\n ctrlKey: boolean\n ): number => {\n const currentCellIndex = sortedGridCellRefs.value.indexOf(target as HTMLDivElement);\n\n if (isEdgeNavigationKeyCode(directionKeyCode)) {\n return getEdgeCellIndex(currentCellIndex, directionKeyCode, ctrlKey);\n }\n\n return getCellIndex(currentCellIndex, directionKeyCode);\n };\n\n // Find the next cell to be focused and apply the focus on it\n const focusOnNextGridcell = (target: EventTarget, keyCode: BentoDatagridNavigationKeyCode, ctrlKey: boolean) => {\n if (!sortedGridCellRefs.value.includes(target as HTMLDivElement)) {\n return;\n }\n\n const cellIndex = getTargetCellIndex(target, keyCode, ctrlKey);\n sortedGridCellRefs.value[cellIndex].focus();\n };\n\n // Verifies if a key is used to navigate on the data-grid\n const isNavigationKeyCode = (keyCode: number) => keyCode in BentoDatagridNavigationKeyCode;\n\n // On keyboard input for DataGrid row elements\n const navigationInput = (event: KeyboardEvent) => {\n const { ctrlKey, keyCode, target } = event;\n\n const isFocusedOnGridcell = Object.values(gridcellRefs.value)\n .flat(1)\n .includes(target as HTMLDivElement);\n if (isFocusedOnGridcell && isNavigationKeyCode(keyCode)) {\n focusOnNextGridcell(target, keyCode, ctrlKey);\n }\n };\n\n return {\n isNavigationKeyCode,\n focusOnNextGridcell,\n navigationInput,\n };\n};\n","import { computed, ref, watch } from 'vue';\nimport { SetupContext } from 'vue/types/v3-setup-context';\nimport { BentoLazyLoadType, MaybeRef } from '@/types';\nimport { BentoDatagridEvent } from '../../data-grid.types';\n\n/**\n * The percentage of how much height of the element that has been scrolled before a\n * `BentoDatagridEvent.UPDATE_SHOW_MORE` event is emitted.\n */\nconst LAZY_LOAD_BUFFER_PERCENTAGE = 90;\n\n/**\n * Handles the \"lazy load\" logic for the DataGrid so the data can be\n * loaded. If `lazyLoadTypeRef` is set to automatic, then the event `update:show-more`\n * is triggered when the scroll gets to the bottom of the DataGrid.\n *\n * @param lazyLoadTypeRef Lazy load type: automatic, button or none\n * @param verticalScrollPositionRef Current vertical position of the scroll\n * @param bodyRef Ref to the `bento-data-grid` body container\n * @param emit The `bento-data-grid` emit function\n */\nexport const useLazyLoading = (\n lazyLoadTypeRef: MaybeRef<BentoLazyLoadType>,\n verticalScrollPositionRef: MaybeRef<number>,\n bodyRef: MaybeRef<HTMLDivElement | undefined>,\n loading: MaybeRef<boolean>,\n emit: SetupContext['emit']\n) => {\n const lazyLoadType = ref(lazyLoadTypeRef);\n const verticalScrollPosition = ref(verticalScrollPositionRef);\n const body = ref(bodyRef);\n const isLoading = ref(loading);\n\n const isLazyLoad = computed(() => lazyLoadType.value !== 'none');\n\n const isInfiniteScroll = computed(() => lazyLoadType.value === 'automatic');\n\n const emitLazyLoadEvent = () => {\n emit(BentoDatagridEvent.UPDATE_SHOW_MORE);\n };\n\n watch(\n () => verticalScrollPosition.value,\n () => {\n if (isInfiniteScroll.value) {\n const height = body.value.offsetHeight;\n const percentageOffset = (height / verticalScrollPosition.value) * 100;\n if (percentageOffset > LAZY_LOAD_BUFFER_PERCENTAGE && !isLoading.value) {\n emitLazyLoadEvent();\n }\n }\n }\n );\n\n return { isLazyLoad, isInfiniteScroll, verticalScrollPosition, emitLazyLoadEvent };\n};\n","import { computed, reactive, ref } from 'vue';\nimport { MaybeRef } from '@/types';\nimport { BentoColumn, BentoDatagridEvent } from '../../data-grid.types';\nimport type { SetupContext } from 'vue/types/v3-setup-context';\nimport {\n BentoDatagridDraggingColumnState,\n DatagridColumnsEvent,\n} from '@/components/data-grid/components/data-grid-columns/data-grid-columns.types';\n\n/**\n * A composable that handles all the column dragging logic.\n * This allows users to re-arrange the column order.\n * @param columnsRef The reference to the array of columns.\n * @param hasDraggableColumnsRef The reference to the hasDraggableColumns prop.\n * @param emit The Datagrid emit function.\n */\nexport const useColumnReorderer = (\n columnsRef: MaybeRef<BentoColumn[]>,\n hasDraggableColumnsRef: MaybeRef<boolean>,\n emit: SetupContext['emit']\n) => {\n const columns = ref(columnsRef);\n const hasDraggableColumns = ref(hasDraggableColumnsRef);\n\n const draggingColumns = reactive<BentoDatagridDraggingColumnState>({\n dragging: null,\n dragToLeft: null,\n target: null,\n });\n\n const onMoveColumnByOffset = (movingColumn: BentoColumn, offset = 0) => {\n const fromIndex = columns.value.findIndex(c => c.field === movingColumn.field);\n const toIndex = fromIndex + offset;\n if (toIndex < 0 || toIndex > columns.value.length - 1) {\n return;\n }\n\n // If the move is inside the bounds of the columns array, we can move\n // const toColumn = columns.value[toIndex];\n const reorderedColumns = [...columns.value];\n reorderedColumns.splice(toIndex, 0, reorderedColumns.splice(fromIndex, 1)[0]);\n\n emit(BentoDatagridEvent.COLUMNS, reorderedColumns);\n emit(BentoDatagridEvent.UPDATE_COLUMNS, reorderedColumns);\n };\n\n const onDragStart = (column: BentoColumn, e: DragEvent & Event) => {\n draggingColumns.dragging = column;\n e.dataTransfer.setData('text', ''); // dataTransfer needed for firefox\n e.dataTransfer.dropEffect = 'move';\n };\n\n const onDragEnter = (column: BentoColumn, dragEvent: DragEvent) => {\n draggingColumns.target = column;\n const targetRect = (dragEvent.currentTarget as HTMLElement).getBoundingClientRect();\n const midpoint = targetRect.left + targetRect.width / 2;\n const clientX = dragEvent.clientX ?? 0;\n draggingColumns.dragToLeft = clientX <= midpoint;\n };\n\n const onDrop = (column: BentoColumn) => {\n if (draggingColumns.dragging?.field !== column.field) {\n // Re-order columns\n const fromIndex = columns.value.findIndex(c => c.field === draggingColumns.dragging?.field);\n const toIndexInitial = columns.value.findIndex(c => c.field === column.field);\n const toIndex = draggingColumns.dragToLeft ? toIndexInitial : toIndexInitial + 1;\n const toLeftOfToIndex = toIndex > fromIndex ? toIndex - 1 : toIndex;\n let reorderedColumns = [...columns.value];\n\n reorderedColumns.splice(\n toLeftOfToIndex === -1 ? 0 : toLeftOfToIndex,\n 0,\n reorderedColumns.splice(fromIndex, 1)[0]\n );\n\n const firstUnfrozenColumn = columns.value.findIndex(c => !c?.frozen);\n // Make sure to change the frozen state of the dragged column to the column the user is dropping on\n // However don't change the state if we are dragging over the first un-frozen column\n if (draggingColumns.dragging?.frozen !== column.frozen && toIndex !== firstUnfrozenColumn) {\n reorderedColumns = reorderedColumns.map(col =>\n draggingColumns.dragging?.field === col.field ? { ...col, frozen: !!column?.frozen } : col\n );\n }\n\n emit(BentoDatagridEvent.COLUMNS, reorderedColumns);\n emit(BentoDatagridEvent.UPDATE_COLUMNS, reorderedColumns);\n }\n\n draggingColumns.dragging = null;\n draggingColumns.target = null;\n };\n\n const onDragEnd = () => {\n draggingColumns.dragging = null;\n draggingColumns.dragToLeft = null;\n draggingColumns.target = null;\n };\n\n // Drag events for the `data-grid-columns`\n const draggingEventsForColumns = computed(() => {\n if (!hasDraggableColumns.value) {\n return {};\n }\n\n return {\n [DatagridColumnsEvent.COLUMN_DRAG_START]: (column: BentoColumn, e: DragEvent & Event) =>\n onDragStart(column, e),\n [DatagridColumnsEvent.COLUMN_DRAG_ENTER]: (column: BentoColumn, dragEvent: DragEvent) =>\n onDragEnter(column, dragEvent),\n [DatagridColumnsEvent.COLUMN_DROP]: (column: BentoColumn) => onDrop(column),\n [DatagridColumnsEvent.COLUMN_DRAG_END]: () => onDragEnd(),\n };\n });\n\n // Drag events for row cell\n const draggingEventsForRowCell = computed(() => (column: BentoColumn) => {\n if (!hasDraggableColumns.value) {\n return {};\n }\n\n return {\n dragenter: (e: DragEvent) => {\n e.preventDefault();\n onDragEnter(column, e);\n },\n drop: () => {\n onDrop(column);\n },\n dragover: (e: DragEvent) => {\n e.preventDefault();\n },\n };\n });\n\n return {\n // Values\n draggingColumns,\n\n // Methods\n draggingEventsForColumns,\n draggingEventsForRowCell,\n onMoveColumnByOffset,\n };\n};\n","import { MaybeRef } from '@/types';\nimport { BentoColumn, BentoDatagridEvent } from '../../data-grid.types';\nimport { computed, ref } from 'vue';\nimport { DATAGRID_SELECT_FIELD_NAME } from '../use-calculate-column-width/use-calculate-column-width';\nimport type { SetupContext } from 'vue/types/v3-setup-context';\nimport { DatagridConfigSettingsColumnSets } from './use-config.settings.types';\n\n/**\n * All Datagrid configuration settings logic:\n * - Condensed view toggle\n * - Frozen / unfrozen columns sorting and column sets\n * - Emitting a new array of colums with a new updated column\n * - Emitting new updated array of columns\n *\n * @param condensed Initial state of condensed view toggle\n * @param emit The `bento-data-grid` emit function\n * @returns Condensed view data & event handler\n */\nexport const useConfigSettings = (columnsRef: MaybeRef<BentoColumn[]>, emit: SetupContext['emit']) => {\n const columns = ref(columnsRef);\n\n // Frozen and unfrozen columns\n const sortedColumnsByFreezeState = computed(() =>\n [...columns.value].sort((a, b) => {\n if (a.frozen === b.frozen) {\n return 0;\n }\n return a.frozen ? -1 : 1;\n })\n );\n const frozenColumns = computed(() =>\n sortedColumnsByFreezeState.value.filter(col => col.frozen && col.visible !== false)\n );\n const unfrozenColumns = computed(() =>\n sortedColumnsByFreezeState.value.filter(col => !col.frozen && col.visible !== false)\n );\n const columnSets = computed<DatagridConfigSettingsColumnSets>(() =>\n [\n { columnSet: frozenColumns.value, id: 'frozen', isFrozenColumns: true },\n { columnSet: unfrozenColumns.value, id: 'unfrozen' },\n ].filter(({ columnSet }) => columnSet.length)\n );\n const isOnlyOneVisibleColumn = computed(\n () =>\n columns.value.filter(col => col?.visible !== false && col?.field !== DATAGRID_SELECT_FIELD_NAME).length ===\n 1\n );\n\n const onConfigSettingsUpdate = (isCondensedView: boolean) =>\n emit(BentoDatagridEvent.UPDATE_CONDENSED, isCondensedView);\n\n // Emits an updated array of columns\n const onConfigSettingsColumnsUpdate = (newColumns: BentoColumn[]) => {\n emit(BentoDatagridEvent.COLUMNS, newColumns);\n emit(BentoDatagridEvent.UPDATE_COLUMNS, newColumns);\n };\n\n // Updates and then emits an updated array of columns\n const onConfigSettingsColumnUpdate = (updatedColumn: BentoColumn) => {\n const updatedColumns = sortedColumnsByFreezeState.value.map(col =>\n col?.field === updatedColumn.field ? updatedColumn : col\n );\n onConfigSettingsColumnsUpdate(updatedColumns);\n };\n\n return {\n // Values\n columnSets,\n isOnlyOneVisibleColumn,\n sortedColumns: sortedColumnsByFreezeState,\n\n // Methods\n onConfigSettingsUpdate,\n onConfigSettingsColumnsUpdate,\n onConfigSettingsColumnUpdate,\n };\n};\n","import { nextTick, onMounted, onUnmounted, ref, Ref, watch } from 'vue';\nimport { observeSizeOfElement } from '@/utils/ts/resize';\n\n/**\n * Calculates the height of an element based on its ref and whether it is sticky or not\n *\n * @param {Ref<HTMLDivElement>} elementRef Reference to the element\n * @param {Ref<boolean>} options.fitContent Reference to a sticky prop\n * @returns Height of the element\n */\nexport const useCalculateStickyElementHeight = (elementRef: Ref<HTMLDivElement>, isSticky: Ref<boolean>) => {\n const topPosition = ref(0);\n let filtersElementObserver: ResizeObserver | null = null;\n\n const setTopPosition = () => {\n if (elementRef?.value && isSticky.value) {\n topPosition.value = elementRef.value.offsetHeight;\n }\n };\n\n onMounted(() => {\n nextTick(() => {\n // Keep watching element until it's defined, then observe its offsetHeight\n const stop = watch(\n elementRef,\n () => {\n if (elementRef?.value) {\n nextTick(() => stop());\n filtersElementObserver = observeSizeOfElement(elementRef.value, () => {\n setTopPosition();\n });\n }\n },\n { immediate: true }\n );\n watch(\n isSticky,\n () => {\n if (isSticky.value) {\n setTopPosition();\n } else {\n topPosition.value = 0;\n }\n },\n { immediate: true }\n );\n });\n });\n\n onUnmounted(() => {\n filtersElementObserver?.disconnect();\n });\n\n return topPosition;\n};\n","import { nextTick, onMounted, ref, Ref, watch } from 'vue';\nimport { isVue3 } from 'vue-demi';\n\n/**\n * Handles all scroll events & logic for the DataGrid.\n * @param body The reference to the DataGrid body element.\n * @param columnsRef The reference to the row of column headers element.\n * @param verticalScrollPosition The reference to scroll top position number.\n * @returns Update methods for updating the scroll ppsotion references & the body scroll & overflow attributes.\n */\nexport const useScroller = (\n body: Ref<HTMLDivElement>,\n columnsRef: Ref<HTMLDivElement>,\n verticalScrollPosition: Ref<number>\n) => {\n const scrollLeftPosition = ref(0);\n const hasLeftOverflow = ref(false);\n const hasRightOverflow = ref(false);\n\n /* eslint-disable no-param-reassign */\n /* == Scrolling == */\n // Sync body and column headers scrolling\n watch(\n () => scrollLeftPosition.value,\n () => {\n body.value.scrollLeft = scrollLeftPosition.value;\n columnsRef.value.scrollLeft = scrollLeftPosition.value;\n hasLeftOverflow.value = !!scrollLeftPosition.value;\n hasRightOverflow.value =\n columnsRef.value.scrollWidth - columnsRef.value.offsetWidth > scrollLeftPosition.value;\n }\n );\n\n onMounted(async () => {\n await nextTick();\n // Because there is an extra nextTick() for vue3 when rendering fluid columns in `use-calculate-column-width`,\n // we also need to wait an extra tick here in order to get the right widths\n if (isVue3) {\n await nextTick();\n }\n if (columnsRef.value?.offsetWidth < columnsRef.value?.scrollWidth) {\n hasRightOverflow.value = true;\n }\n });\n\n const updateScrollPosition = (event: Event) => {\n scrollLeftPosition.value = (event.target as HTMLDivElement).scrollLeft;\n verticalScrollPosition.value = body.value.scrollHeight - (event.target as HTMLDivElement).scrollTop;\n };\n\n const updateScrollPositionOnFrozenColumnsNavigation = (event: KeyboardEvent) => {\n if (event.key !== 'Tab' && event.key !== 'ArrowRight' && event.key !== 'ArrowLeft') {\n return;\n }\n\n event.preventDefault();\n\n body.value.scrollLeft = 0;\n // Using setTimeout to override the browser behavior of scrolling the parent element when a child is focused\n body.value.style.overflowX = 'hidden';\n setTimeout(() => {\n body.value.style.overflowX = 'auto';\n });\n };\n /* eslint-enable no-param-reassign */\n\n return {\n // Values\n scrollLeftPosition,\n hasLeftOverflow,\n hasRightOverflow,\n\n // Methods\n updateScrollPosition,\n updateScrollPositionOnFrozenColumnsNavigation,\n };\n};\n","import { computed, type Ref, ref } from 'vue';\nimport { DATAGRID_SELECT_FIELD_NAME } from '../use-calculate-column-width';\nimport type { BentoColumn } from '@/components/data-grid';\nimport type { DatagridConfigSettingsColumnSets } from '../use-config-settings/use-config.settings.types';\nimport type { DatagridColumnHoveringState } from './use-column-hovering.types';\n\nexport const useColumnHovering = (\n columnSets: Ref<DatagridConfigSettingsColumnSets>,\n selectable: Ref<boolean>,\n outline: Ref<boolean>,\n isTotalWidthOfColumnsTakingUpAllAvailableGridWidth: Ref<boolean>\n) => {\n const hoveredOverColumn = ref<BentoColumn>(null);\n const hoveredOverColumnState = computed<DatagridColumnHoveringState>(() => {\n if (!hoveredOverColumn.value || hoveredOverColumn.value.field === DATAGRID_SELECT_FIELD_NAME) {\n return {\n hoveredOverColumnField: '',\n isSeparatorOffset: false,\n noBorderLeft: false,\n noBorderRight: false,\n };\n }\n\n const frozenColumnSet = columnSets.value\n .find(colSet => colSet.isFrozenColumns)\n ?.columnSet?.filter(col => col.field !== DATAGRID_SELECT_FIELD_NAME);\n const unFrozenColumnSet = columnSets.value.find(colSet => !colSet?.isFrozenColumns);\n\n const isFirstFrozenColumn =\n hoveredOverColumn.value.frozen && frozenColumnSet?.[0].field === hoveredOverColumn.value.field;\n const isFirstUnfrozenColumn =\n !hoveredOverColumn.value.frozen &&\n unFrozenColumnSet?.columnSet?.[0].field === hoveredOverColumn.value.field;\n\n // Cases where no left border should be shown\n // If Frozen, selectable off, outline on, first column\n const isFrozenSelectableOutlineOnFirstCol = (selectable.value || outline.value) && isFirstFrozenColumn;\n // If No frozen columns & not frozen, selectable off, outline on, first column\n const isNoFrozenColAndNotFrozenSelectableOutlineOnFirstCol =\n (selectable.value || outline.value) && !frozenColumnSet && isFirstUnfrozenColumn;\n // If are frozen columns & not frozen, first column\n const isFrozenColumnsAndNotFrozenFirstColumn = frozenColumnSet && isFirstUnfrozenColumn;\n\n // Cases where no right border should be shown\n // If frozen column, last column\n const isFrozenColumnsAndLastFrozenColumn =\n frozenColumnSet?.length > 0 &&\n hoveredOverColumn.value.frozen &&\n frozenColumnSet?.[frozenColumnSet.length - 1].field === hoveredOverColumn.value.field;\n // If outline is on, all columns are taking up width of the grid container and is last column\n const isOutlineOnAllColumnWidthFitContainerAndLastColumn =\n outline.value &&\n isTotalWidthOfColumnsTakingUpAllAvailableGridWidth.value &&\n !hoveredOverColumn.value.frozen &&\n unFrozenColumnSet?.columnSet?.[unFrozenColumnSet.columnSet.length - 1].field ===\n hoveredOverColumn.value.field;\n\n return {\n hoveredOverColumnField: hoveredOverColumn.value.field,\n isSeparatorOffset: isOutlineOnAllColumnWidthFitContainerAndLastColumn,\n noBorderLeft:\n !!isFrozenSelectableOutlineOnFirstCol ||\n !!isNoFrozenColAndNotFrozenSelectableOutlineOnFirstCol ||\n !!isFrozenColumnsAndNotFrozenFirstColumn,\n\n noBorderRight: !!isFrozenColumnsAndLastFrozenColumn || !!isOutlineOnAllColumnWidthFitContainerAndLastColumn,\n };\n });\n\n return {\n hoveredOverColumn,\n hoveredOverColumnState,\n };\n};\n\nexport default useColumnHovering;\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><g fill=\"#00112C\" :clip-path=\"'url(#uia-icons-16-arrow_up_down_sort__a' + uuid + ')'\"><path d=\"M9.06077 4.00011L5.00011 -0.0605469L0.939453 4.00011L2.00011 5.06077L4.25 2.81089V10.75H5.75V2.81066L8.00011 5.06077L9.06077 4.00011Z\"/><path d=\"M10.25 13.1893L8.00011 10.9395L6.93945 12.0001L11.0001 16.0608L15.0608 12.0001L14.0001 10.9395L11.75 13.1896V5.25H10.25V13.1893Z\"/></g><defs><clipPath :id=\"'uia-icons-16-arrow_up_down_sort__a' + uuid\"><rect width=\"16\" height=\"16\" fill=\"#fff\"/></clipPath></defs></svg>\n</template>\n<script>\n let uuid = 0;\n\n export default {\n beforeCreate() {\n this.uuid = uuid.toString();\n uuid += 1;\n },\n };\n</script>\n<style>\n @import '../css/main.css';\n</style>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#00112C\" d=\"M12.1933 8.7454L7.93903 12.9996L8.99969 14.0603L15.0604 7.99963L8.99969 1.93896L7.93903 2.99963L12.1848 7.24541L1.24902 7.25658L1.25056 8.75658L12.1933 8.7454Z\"/></svg>\n</template>\n<script>\n let uuid = 0;\n\n export default {\n beforeCreate() {\n this.uuid = uuid.toString();\n uuid += 1;\n },\n };\n</script>\n<style>\n @import '../css/main.css';\n</style>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><g :clip-path=\"'url(#uia-icons-16-freeze__a' + uuid + ')'\"><path fill=\"#00112C\" d=\"M7.99989 14.0605L9.49989 15.5605L10.5605 14.4999L8.75 12.6893V10.9334L10.169 10.116L11.6861 10.9939L12.3501 13.4688L13.7988 13.0801L13.2488 11.0301L15.2988 10.4801L14.9101 9.03129L12.4363 9.695L10.9199 8.81745V7.18276L12.4365 6.3051L14.9101 6.96875L15.2988 5.51999L13.2488 4.96999L13.7988 2.91999L12.3501 2.53129L11.686 5.00635L10.1693 5.88407L8.75 5.06648L8.75 3.31043L10.5605 1.49989L9.49989 0.439226L7.99989 1.93923L6.49989 0.439226L5.43923 1.49989L7.25 3.31066V5.06639L5.83078 5.88392L4.31419 5.00626L3.65018 2.53129L2.20141 2.91998L2.384 3.60052L2.38063 3.60143L2.75032 4.97028L0.701408 5.51999L1.0901 6.96875L1.7708 6.78612L1.77173 6.78955L3.56437 6.30541L5.07992 7.18246L5.07992 8.81775L3.564 9.69502L1.0901 9.03129L0.701408 10.4801L2.75141 11.0301L2.20141 13.0801L3.65018 13.4687L4.31414 10.994L5.83106 10.1161L7.25 10.9335V12.6891L5.43923 14.4999L6.49989 15.5605L7.99989 14.0605ZM9.41992 7.18345V8.81644L7.99992 9.63441L6.57992 8.81644L6.57992 7.18345L7.99992 6.36548L9.41992 7.18345Z\"/></g><defs><clipPath :id=\"'uia-icons-16-freeze__a' + uuid\"><rect width=\"16\" height=\"16\" fill=\"#fff\" transform=\"matrix(1 0 0 -1 0 16)\"/></clipPath></defs></svg>\n</template>\n<script>\n let uuid = 0;\n\n export default {\n beforeCreate() {\n this.uuid = uuid.toString();\n uuid += 1;\n },\n };\n</script>\n<style>\n @import '../css/main.css';\n</style>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#00112C\" d=\"M2.99035 14.0608L14.051 3.00011L12.9903 1.93945L1.92969 13.0001L2.99035 14.0608Z\"/><path fill=\"#00112C\" d=\"M13.9404 5.23L12.8704 6.3C13.4704 6.97 13.9004 7.62 14.1304 8C13.4704 9.07 11.2504 12.25 8.00039 12.25C7.67039 12.25 7.34039 12.22 7.03039 12.14L5.80039 13.37C6.48039 13.61 7.21039 13.75 8.00039 13.75C12.7425 13.75 15.4838 8.69421 15.6649 8.36011C15.6671 8.35603 15.6689 8.35265 15.6704 8.35L15.8504 8L15.6704 7.65C15.6204 7.55 15.0204 6.43 13.9404 5.23Z\"/><path fill=\"#00112C\" d=\"M8.96039 3.85C8.65039 3.78 8.33039 3.75 8.00039 3.75C4.75039 3.75 2.53039 6.93 1.87039 8C2.10039 8.38 2.53039 9.02 3.12039 9.69L2.06039 10.75C0.98039 9.56 0.380391 8.45 0.330391 8.35L0.150391 8L0.330391 7.65C0.331838 7.64735 0.333668 7.64397 0.33588 7.63989C0.517034 7.30578 3.25829 2.25 8.00039 2.25C8.79039 2.25 9.52039 2.39 10.1904 2.62L8.96039 3.85Z\"/></svg>\n</template>\n<script>\n let uuid = 0;\n\n export default {\n beforeCreate() {\n this.uuid = uuid.toString();\n uuid += 1;\n },\n };\n</script>\n<style>\n @import '../css/main.css';\n</style>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><g fill=\"#00112C\" :clip-path=\"'url(#uia-icons-16-sort_ascending__a' + uuid + ')'\"><path d=\"M12.0001 1.93945L16.0608 6.00011L15.0001 7.06077L12.75 4.81066V12.75H11.25V4.81089L9.00011 7.06077L7.93945 6.00011L12.0001 1.93945Z\"/><path d=\"M6.75 7.25H1.25V8.75H6.75V7.25Z\"/><path d=\"M1.25 11.25H8.75V12.75H1.25V11.25Z\"/><path d=\"M6.75 3.25H1.25V4.75H6.75V3.25Z\"/></g><defs><clipPath :id=\"'uia-icons-16-sort_ascending__a' + uuid\"><rect width=\"16\" height=\"16\" fill=\"#fff\"/></clipPath></defs></svg>\n</template>\n<script>\n let uuid = 0;\n\n export default {\n beforeCreate() {\n this.uuid = uuid.toString();\n uuid += 1;\n },\n };\n</script>\n<style>\n @import '../css/main.css';\n</style>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><g fill=\"#00112C\" :clip-path=\"'url(#uia-icons-16-sort_descending__a' + uuid + ')'\"><path d=\"M12.75 3.25V11.1896L15.0001 8.93945L16.0608 10.0001L12.0001 14.0608L7.93945 10.0001L9.00011 8.93945L11.25 11.1893V3.25H12.75Z\"/><path d=\"M6.75 7.25H1.25V8.75H6.75V7.25Z\"/><path d=\"M1.25 3.25H9.09V4.75H1.25V3.25Z\"/><path d=\"M6.75 11.25H1.25V12.75H6.75V11.25Z\"/></g><defs><clipPath :id=\"'uia-icons-16-sort_descending__a' + uuid\"><rect width=\"16\" height=\"16\" fill=\"#fff\"/></clipPath></defs></svg>\n</template>\n<script>\n let uuid = 0;\n\n export default {\n beforeCreate() {\n this.uuid = uuid.toString();\n uuid += 1;\n },\n };\n</script>\n<style>\n @import '../css/main.css';\n</style>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#00112C\" d=\"M8 5.25C6.48122 5.25 5.25 6.48122 5.25 8C5.25 9.51878 6.48122 10.75 8 10.75C9.51878 10.75 10.75 9.51878 10.75 8C10.75 6.48122 9.51878 5.25 8 5.25ZM6.75 8C6.75 7.30964 7.30964 6.75 8 6.75C8.69036 6.75 9.25 7.30964 9.25 8C9.25 8.69036 8.69036 9.25 8 9.25C7.30964 9.25 6.75 8.69036 6.75 8Z\"/><path fill=\"#00112C\" d=\"M7.99964 2.25C5.50387 2.25 3.57073 3.66588 2.3086 4.9806C1.6704 5.64539 1.18078 6.30745 0.850599 6.80272C0.685043 7.05106 0.558349 7.2593 0.471981 7.40748C0.428769 7.48162 0.395568 7.54087 0.372564 7.58275C0.36106 7.60369 0.352097 7.6203 0.345701 7.63227L0.338032 7.64672L0.335646 7.65126L0.334488 7.65348L0.154297 8L0.334225 8.34601L0.999638 8C0.334225 8.34601 0.334814 8.34715 0.334814 8.34715L0.335646 8.34874L0.338032 8.35328L0.345701 8.36773C0.352097 8.3797 0.36106 8.39631 0.372564 8.41725C0.395568 8.45913 0.428769 8.51838 0.471981 8.59252C0.558349 8.7407 0.685043 8.94894 0.850599 9.19728C1.18078 9.69255 1.6704 10.3546 2.3086 11.0194C3.57073 12.3341 5.50387 13.75 7.99964 13.75C10.4954 13.75 12.4285 12.3341 13.6907 11.0194C14.3289 10.3546 14.8185 9.69255 15.1487 9.19728C15.3142 8.94894 15.4409 8.7407 15.5273 8.59252C15.5705 8.51838 15.6037 8.45913 15.6267 8.41725C15.6382 8.39631 15.6472 8.3797 15.6536 8.36773L15.6612 8.35328L15.6636 8.34874L15.6648 8.34652L15.845 8L15.6651 7.65399L14.9996 8C15.6651 7.65399 15.6645 7.65285 15.6645 7.65285L15.6636 7.65126L15.6612 7.64672L15.6536 7.63227C15.6472 7.6203 15.6382 7.60369 15.6267 7.58275C15.6037 7.54087 15.5705 7.48162 15.5273 7.40748C15.4409 7.2593 15.3142 7.05106 15.1487 6.80272C14.8185 6.30745 14.3289 5.64539 13.6907 4.9806C12.4285 3.66588 10.4954 2.25 7.99964 2.25ZM14.9996 8L15.6648 8.34652C15.6648 8.34652 15.6651 8.34601 14.9996 8ZM0.999638 8L0.334488 7.65348C0.334488 7.65348 0.334225 7.65399 0.999638 8ZM2.09867 8.36522C2.00649 8.22694 1.92852 8.10363 1.86519 8C1.92852 7.89637 2.00649 7.77306 2.09867 7.63478C2.39349 7.19255 2.82887 6.60461 3.39068 6.0194C4.52855 4.83412 6.09541 3.75 7.99964 3.75C9.90387 3.75 11.4707 4.83412 12.6086 6.0194C13.1704 6.60461 13.6058 7.19255 13.9006 7.63478C13.9928 7.77306 14.0708 7.89637 14.1341 8C14.0708 8.10363 13.9928 8.22694 13.9006 8.36522C13.6058 8.80745 13.1704 9.39539 12.6086 9.9806C11.4707 11.1659 9.90387 12.25 7.99964 12.25C6.09541 12.25 4.52855 11.1659 3.39068 9.9806C2.82887 9.39539 2.39349 8.80745 2.09867 8.36522Z\"/></svg>\n</template>\n<script>\n let uuid = 0;\n\n export default {\n beforeCreate() {\n this.uuid = uuid.toString();\n uuid += 1;\n },\n };\n</script>\n<style>\n @import '../css/main.css';\n</style>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#00112C\" d=\"M8 11.25L12.5 5.25H3.5L8 11.25Z\"/></svg>\n</template>\n<script>\n let uuid = 0;\n\n export default {\n beforeCreate() {\n this.uuid = uuid.toString();\n uuid += 1;\n },\n };\n</script>\n<style>\n @import '../css/main.css';\n</style>\n","<template>\n <div class=\"b-data-grid-columns\" :class=\"conditionalColumnsClasses\" data-testid=\"data-grid-columns\">\n <div\n v-for=\"(column, index) in columns\"\n :key=\"column.field\"\n :ref=\"el => registerColumnsRefs(el, column.field)\"\n :aria-colindex=\"index + 1\"\n :aria-label=\"column.label\"\n :aria-sort=\"getSortingColumnDirection(column)\"\n :class=\"conditionalColumnClasses(column, index)\"\n :data-testid=\"`${column.field}-column-header`\"\n :draggable=\"hasDraggableColumns && !isResizing && !isSelectColumn(column)\"\n class=\"b-data-grid-columns__column\"\n role=\"columnheader\"\n :tabindex=\"column.sortable || hasColumnPanel || column.infoIconTooltip ? '0' : '-1'\"\n :style=\"{ width: column.autoWidth && isMeasuringColumnWidths ? 'auto' : `${column.width}px` }\"\n v-on=\"dataGridColumnEvents(column)\"\n >\n <template v-if=\"!isSelectColumn(column)\">\n <div\n :aria-label=\"t('columnActions', { name: column.label })\"\n aria-live=\"polite\"\n role=\"region\"\n class=\"b-data-grid-columns__column-header-and-actions\"\n :class=\"conditionalColumnHeaderAndActionsClasses(column)\"\n >\n <bento-typography\n el=\"div\"\n strongest\n class=\"b-data-grid-columns__column-header\"\n :class=\"conditionalColumnHeaderClasses\"\n >\n <slot :column=\"column\" :name=\"`head-${column.field}`\">\n <span class=\"b-data-grid-columns__label\">{{ column.label }}</span>\n </slot>\n </bento-typography>\n <div\n v-if=\"hasColumnActions(column)\"\n class=\"b-data-grid-columns__column-actions\"\n :class=\"conditionalColumnActionsClasses(column)\"\n >\n <div v-if=\"column.infoIconTooltip\" class=\"b-data-grid-columns__column-info-icon\">\n <bento-info-icon :tooltip-text=\"column.infoIconTooltip\" />\n </div>\n <div v-if=\"column.sortable\" class=\"b-data-grid-columns__column-sort\">\n <bento-toggle-button\n condensed\n :toggled=\"isSorting(column.field)\"\n variant=\"tertiary\"\n @click=\"sortByColumnField(column.field)\"\n >\n <template #iconLeft>\n <arrow-up-and-down-sort-icon\n v-if=\"!getSortingDirection(column.field)\"\n :svg-title=\"t('sortColumn', { name: column.label })\"\n />\n <sort-ascending-icon\n v-else-if=\"\n getSortingDirection(column.field) === BentoDatagridSortDirection.ASCENDING\n \"\n :svg-title=\"t('sortColumnInDescendingOrder', { name: column.label })\"\n />\n <sort-descending-icon\n v-else-if=\"\n getSortingDirection(column.field) === BentoDatagridSortDirection.DESCENDING\n \"\n :svg-title=\"t('sortColumnInAscendingOrder', { name: column.label })\"\n />\n </template>\n </bento-toggle-button>\n </div>\n <bento-menu\n v-if=\"hasColumnPanel && hoveredColumnField === column.field\"\n :ref=\"el => (contextMenuRef[column.field] = el)\"\n class=\"b-data-grid-columns__menu\"\n :data=\"contextualMenuData(column)\"\n :menu-position=\"computeMenuPosition(hasFirstColumnPanelRightAligned, index)\"\n :menu-fixed-positioning=\"true\"\n :button=\"{ variant: 'tertiary', condensed: true }\"\n @open=\"$emit(DatagridColumnsEvent.COLUMN_MENU_OPEN)\"\n @close=\"$emit(DatagridColumnsEvent.COLUMN_MENU_CLOSE)\"\n />\n </div>\n </div>\n <div\n :data-testid=\"`data-grid-column-${column.field}`\"\n class=\"b-data-grid-columns__column-separator-container\"\n :class=\"conditionalColumnSeparatorClasses(column)\"\n role=\"presentation\"\n @mousedown=\"startResize(hasResizableColumns, column.field, $event)\"\n @click.stop\n >\n <div\n v-if=\"!isFrozenColumns || (isFrozenColumns && index !== columns.length - 1)\"\n class=\"b-data-grid-columns__column-separator\"\n ></div>\n </div>\n </template>\n <div v-else class=\"b-data-grid-columns__select-column\">\n <bento-checkbox\n :model-value=\"allItemsSelectedState.allItemsSelected\"\n data-testid=\"checkbox-select-all\"\n :indeterminate=\"allItemsSelectedState.isIndeterminate\"\n value=\"data-grid-select-all\"\n @update:model-value=\"onAllRowSelect\"\n />\n <template v-if=\"selectableAcrossPages\">\n <bento-menu\n class=\"b-data-grid-columns__select-column-menu\"\n :data=\"selectAllMenu\"\n menu-position=\"bottom-start\"\n menu-fixed-positioning\n :button=\"{ variant: 'tertiary', condensed: true }\"\n >\n <template #iconLeft>\n <triangle-down :svg-title=\"t('selectionMenu')\" />\n </template>\n </bento-menu>\n </template>\n </div>\n </div>\n </div>\n</template>\n\n<script lang=\"ts\" setup>\n import { type ComponentPublicInstance, computed, PropType, ref, toRefs } from 'vue';\n import { BentoCheckbox } from '@/components/checkbox';\n import {\n BentoColumn,\n BentoColumnWidthOverridesLookup,\n BentoDatagridAllItemsSelectedState,\n BentoDatagridAriaSortValue,\n BentoDatagridSortByColumn,\n BentoDatagridSortDirection,\n } from '../../data-grid.types';\n import { BentoTypography } from '@/components/typography';\n import { DATAGRID_SELECT_FIELD_NAME, useResizer, useSorter } from '../../composables';\n import { BentoInfoIcon } from '@/components/info-icon';\n import {\n BentoDatagridDraggingColumnState,\n DatagridColumnsEvent,\n DatagridColumnsHeaderReferences,\n } from './data-grid-columns.types';\n import { BentoMenu } from '@/components/menu';\n import { BentoToggleButton } from '@/components/button';\n import { useI18n } from '@/utils/ts/i18n';\n import type { BentoMenuItem } from '@/components/menu/components';\n import type { DatagridColumnHoveringState } from '@/components/data-grid/composables/use-column-hovering';\n import { BentoPopoverPositions } from '@/components/popover';\n import ArrowUpAndDownSortIcon from '@adyen/ui-assets-icons-16/vue/arrow-up-down-sort';\n import ArrowLeftIcon from '@adyen/ui-assets-icons-16/vue/arrow-left';\n import ArrowRightIcon from '@adyen/ui-assets-icons-16/vue/arrow-right';\n import FreezeIcon from '@adyen/ui-assets-icons-16/vue/freeze';\n import HideIcon from '@adyen/ui-assets-icons-16/vue/hide';\n import SortAscendingIcon from '@adyen/ui-assets-icons-16/vue/sort-ascending';\n import SortDescendingIcon from '@adyen/ui-assets-icons-16/vue/sort-descending';\n import ShowIcon from '@adyen/ui-assets-icons-16/vue/show';\n import TriangleDown from '@adyen/ui-assets-icons-16/vue/triangle-down';\n import messages from './messages.json';\n\n type MessageSchema = (typeof messages)['en-US'];\n\n const props = defineProps({\n /**\n * Column definitions using 'key' to relate to data object.\n */\n columns: {\n type: Array as PropType<BentoColumn[]>,\n required: true,\n },\n\n /**\n * Columns being dragged, contains dragging column and a target column\n */\n draggingColumns: {\n type: Object as PropType<BentoDatagridDraggingColumnState>,\n default: undefined,\n },\n\n /**\n * Toggle the columns draggable events.\n */\n hasDraggableColumns: {\n type: Boolean,\n default: true,\n },\n\n /**\n * If resize is enabled\n */\n hasResizableColumns: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Signifies if the column panel is enabled.\n */\n hasColumnPanel: {\n type: Boolean,\n default: false,\n },\n\n /**\n * If set to true, aligns the first column panel to the right of its button.\n */\n hasFirstColumnPanelRightAligned: {\n type: Boolean,\n default: false,\n },\n\n /**\n * If the data grid has overflow on the left side\n */\n hasLeftOverflow: {\n type: Boolean,\n default: false,\n },\n\n /**\n * The column hovered over state and whether the hovered over column should show a border right or left.\n */\n hoveredOverColumnState: {\n type: Object as PropType<DatagridColumnHoveringState>,\n required: true,\n },\n\n /**\n * Toggled to true when the DataGrid has auto width columns and is measuring the\n */\n isMeasuringColumnWidths: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Used to disable hiding the last visible column.\n */\n isOnlyOneVisibleColumn: {\n type: Boolean,\n default: false,\n },\n\n /**\n * If these columns are frozen (pinned) columns\n */\n isFrozenColumns: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Show frozen columns separator\n */\n showFrozenColumnsSeparator: {\n type: Boolean,\n default: false,\n },\n /**\n * The column all items selected state\n */\n allItemsSelectedState: {\n type: Object as PropType<BentoDatagridAllItemsSelectedState>,\n default: undefined,\n },\n\n /**\n * Adds an extra option when selecting all, to select items in other pages too\n */\n selectableAcrossPages: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Sortby handles proper rendering of sort icon in header. Sorting currently is only supported server side.\n * It does make sure the currently sorted column has a more visible sort icon, and the sort icon points in the right direction.\n */\n sortBy: {\n type: Array as PropType<BentoDatagridSortByColumn[]>, // NOTE: is an array to allow multi-sorting in the future\n default: () => [],\n },\n\n /**\n * Truncates all data grid column headers\n */\n truncateColumnHeaders: {\n type: Boolean,\n default: false,\n },\n });\n\n const emit = defineEmits<{\n /**\n * Emitted when a user manually resizes a column width.\n */\n (\n e: DatagridColumnsEvent.COLUMN_RESIZE,\n column: {\n field: string;\n width: number;\n }\n );\n\n /**\n * Triggered when a column is resized.\n */\n (e: DatagridColumnsEvent.COLUMN_RESIZING, value: BentoColumnWidthOverridesLookup);\n\n /**\n * Triggered when a column is sorted.\n */\n (e: DatagridColumnsEvent.SORT, updatedSortBy: BentoDatagridSortByColumn[]);\n\n /**\n * Triggered when selecting all rows.\n */\n (e: DatagridColumnsEvent.SELECT_ALL_ROWS, areAllItemsSelected: boolean);\n\n /**\n * Triggered when all rows across all pages are selected.\n */\n (e: DatagridColumnsEvent.SELECT_ALL_ACROSS_PAGES);\n\n /**\n * Triggered when a columns started to be dragged.\n */\n (e: DatagridColumnsEvent.COLUMN_DRAG_START, column: BentoColumn, event: DragEvent & Event);\n\n /**\n * Triggered when a column is being dragged over another DOM element.\n */\n (e: DatagridColumnsEvent.COLUMN_DRAG_ENTER, column: BentoColumn, event: DragEvent & Event);\n\n /**\n * Triggered when a column is being dragged and is dropped over another DOM element.\n */\n (e: DatagridColumnsEvent.COLUMN_DROP, column: BentoColumn);\n\n /**\n * Triggered when a column drag operation has ended.\n */\n (e: DatagridColumnsEvent.COLUMN_DRAG_END);\n\n /**\n * Triggered when a column is being moved by a certain offset.\n */\n (e: DatagridColumnsEvent.COLUMN_MOVE, movingColumn: BentoColumn, offset: number);\n\n /**\n * Triggered when a column is updated.\n */\n (e: DatagridColumnsEvent.COLUMN_UPDATE, column: BentoColumn);\n\n /**\n * Triggered when the column contextual menu is opened.\n */\n (e: DatagridColumnsEvent.COLUMN_MENU_OPEN);\n\n /**\n * Triggered when the column contextual menu is closed.\n */\n (e: DatagridColumnsEvent.COLUMN_MENU_CLOSE);\n\n /**\n * Emitted when a column header is hovered over.\n */\n (e: 'column-hover', columnKey: BentoColumn);\n }>();\n\n const CLOSING_CONTEXTUAL_MENU_DELAY_MS = 100;\n const { t } = useI18n<{ message: MessageSchema }>({ messages });\n const { columns, sortBy } = toRefs(props);\n const columnHeaderRefs = ref<DatagridColumnsHeaderReferences>({});\n const contextMenuRef = ref({});\n const hoveredColumnField = ref();\n const closingTimeOutId = ref();\n\n // Selecting\n const onAllRowSelect = (areAllItemsSelected: boolean) =>\n emit(DatagridColumnsEvent.SELECT_ALL_ROWS, areAllItemsSelected);\n const isSelectColumn = (column: BentoColumn) => column.field === DATAGRID_SELECT_FIELD_NAME;\n\n // Select all menu\n const selectAllMenu = computed(() => [\n {\n text: t('selectPage') as string,\n handler: () => onAllRowSelect(true),\n },\n {\n text: t('selectAll') as string,\n handler: () => emit(DatagridColumnsEvent.SELECT_ALL_ACROSS_PAGES),\n },\n ]);\n\n // Resizing\n const { startResize, isResizing, columnHoverEventToEmitAfterResizing } = useResizer(columns, emit);\n\n // Sorting\n const { isSorting, getSortingDirection, sortByColumnField } = useSorter(sortBy, columns, emit);\n const getSortingColumnDirection = (column: BentoColumn): BentoDatagridAriaSortValue => {\n if (!column.sortable) {\n return null;\n }\n\n const sortingDirection = props.sortBy.find(({ field }) => field === column.field)?.direction;\n\n if (!sortingDirection) {\n return BentoDatagridAriaSortValue.NONE;\n }\n\n const ariaSortingDirectionMap: { [key in BentoDatagridSortDirection]: BentoDatagridAriaSortValue } = {\n [BentoDatagridSortDirection.ASCENDING]: BentoDatagridAriaSortValue.ASCENDING,\n [BentoDatagridSortDirection.DESCENDING]: BentoDatagridAriaSortValue.DESCENDING,\n };\n\n return ariaSortingDirectionMap[sortingDirection];\n };\n\n // Dragging emit events and methods\n const draggingEventsForColumn = computed(() => (column: BentoColumn) => {\n if (!props.hasDraggableColumns) {\n return {};\n }\n\n return {\n dragstart: (e: DragEvent & Event) => {\n emit(DatagridColumnsEvent.COLUMN_DRAG_START, column, e);\n },\n dragover: (e: DragEvent) => {\n e.preventDefault();\n },\n dragenter: (e: DragEvent) => {\n e.preventDefault();\n emit(DatagridColumnsEvent.COLUMN_DRAG_ENTER, column, e);\n },\n drop: () => {\n emit(DatagridColumnsEvent.COLUMN_DROP, column);\n },\n dragend: () => {\n emit(DatagridColumnsEvent.COLUMN_DRAG_END);\n },\n };\n });\n\n // Contextual menu (moving, visiblity and freezing)\n const contextualMenuData = computed<(col: BentoColumn) => BentoMenuItem[]>(() => (column: BentoColumn) => [\n {\n text: t('moveColumnLeft') as string,\n handler: () => emit(DatagridColumnsEvent.COLUMN_MOVE, column, -1),\n icon: ArrowLeftIcon,\n disabled: props.columns[0].field === column.field,\n },\n {\n text: t('moveColumnRight') as string,\n handler: () => emit(DatagridColumnsEvent.COLUMN_MOVE, column, 1),\n icon: ArrowRightIcon,\n disabled: props.columns[props.columns.length - 1].field === column.field,\n },\n {\n text: (column?.frozen ? t('unfreezeColumn') : t('freezeColumn')) as string,\n handler: () => emit(DatagridColumnsEvent.COLUMN_UPDATE, { ...column, frozen: !column?.frozen }),\n icon: FreezeIcon,\n },\n {\n text: (column?.visible !== false ? t('hideColumn') : t('showColumn')) as string,\n handler: () => {\n emit(DatagridColumnsEvent.COLUMN_UPDATE, {\n ...column,\n visible: !(column?.visible !== false),\n });\n },\n icon: column?.visible !== false ? HideIcon : ShowIcon,\n disabled: column?.mandatory || (column?.visible !== false && props.isOnlyOneVisibleColumn),\n },\n ]);\n const showContextualMenu = (column: BentoColumn) => {\n hoveredColumnField.value = column.field;\n if (closingTimeOutId.value) {\n clearTimeout(closingTimeOutId.value);\n }\n };\n const hideContextualMenu = () => {\n // We want to delay closing for a couple of seconds so\n // it doesn't flicker if a user hovers over the icon and then inside the popover.\n const timeOutId = setTimeout(() => {\n hoveredColumnField.value = '';\n }, CLOSING_CONTEXTUAL_MENU_DELAY_MS);\n closingTimeOutId.value = timeOutId;\n };\n\n /**\n * Generates events for a Datagrid Column.\n * @param column - the BentoColumn we are attaching events onto.\n */\n const dataGridColumnEvents = (column: BentoColumn) => {\n let events: { [eventName: string]: (e: Event) => void } = {\n mouseenter: () => {\n showContextualMenu(column);\n if (!isResizing.value) {\n emit('column-hover', column);\n } else {\n columnHoverEventToEmitAfterResizing.value = column;\n }\n },\n mouseleave: () => {\n hideContextualMenu();\n if (!isResizing.value) {\n emit('column-hover', null);\n } else {\n columnHoverEventToEmitAfterResizing.value = null;\n }\n },\n focus: () => showContextualMenu(column),\n };\n if (!isSelectColumn(column)) {\n events = {\n ...events,\n ...draggingEventsForColumn.value(column),\n };\n }\n return events;\n };\n\n const hasColumnActions = (column: BentoColumn) => column.infoIconTooltip || column.sortable || props.hasColumnPanel;\n\n const registerColumnsRefs = (el: Element | ComponentPublicInstance, field: string) => {\n if (columnHeaderRefs.value?.[field] === undefined) {\n columnHeaderRefs.value = { ...columnHeaderRefs.value, [field]: null };\n }\n if (el !== null) {\n columnHeaderRefs.value[field] = el as HTMLDivElement;\n }\n };\n\n // Conditional column styles\n // Conditional styles\n const conditionalColumnsClasses = computed(() =>\n columns.value[0]?.frozen\n ? {\n 'b-data-grid-columns--frozen': true,\n 'b-data-grid-columns--frozen-separator': props.showFrozenColumnsSeparator,\n 'b-data-grid-columns--overflow-shadow-left': props.hasLeftOverflow,\n }\n : {\n 'b-data-grid-columns--unfrozen': true,\n }\n );\n\n const computeMenuPosition = (hasFirstColumnPanelRightAligned, index) =>\n hasFirstColumnPanelRightAligned && index === 0\n ? BentoPopoverPositions.BOTTOM_START\n : BentoPopoverPositions.BOTTOM_END;\n\n const conditionalColumnClasses = (column: BentoColumn, columnIndex: number) => ({\n 'b-data-grid-columns__column--column-hovered':\n column.field === props.hoveredOverColumnState.hoveredOverColumnField,\n 'b-data-grid-columns__column--column-hovered-no-border-left':\n column.field === props.hoveredOverColumnState.hoveredOverColumnField &&\n props.hoveredOverColumnState.noBorderLeft,\n 'b-data-grid-columns__column--column-hovered-no-border-right':\n column.field === props.hoveredOverColumnState.hoveredOverColumnField &&\n props.hoveredOverColumnState.noBorderRight,\n 'b-data-grid-columns__column--last-frozen-frozen-column':\n props.isFrozenColumns && columnIndex === columns.value.length - 1,\n 'b-data-grid-columns__column--sortable': column.sortable,\n 'b-data-grid-columns__column--padding-left-unset': column?.padding?.left === false,\n 'b-data-grid-columns__column--padding-right-unset': column?.padding?.right === false,\n 'b-data-grid-columns__column--numeric': column?.numeric,\n 'b-data-grid-columns__column--frozen': column?.frozen,\n 'b-data-grid-columns__column--is-re-ordering': column?.field === props.draggingColumns?.dragging?.field,\n 'b-data-grid-columns__column--is-re-ordering-target-left':\n column?.field === props.draggingColumns?.target?.field && props.draggingColumns?.dragToLeft,\n 'b-data-grid-columns__column--is-re-ordering-target-right':\n column?.field === props.draggingColumns?.target?.field && !props.draggingColumns?.dragToLeft,\n 'b-data-grid-columns__column--with-sorting-or-column-panel':\n column.sortable ||\n column.infoIconTooltip ||\n (props.hasColumnPanel && hoveredColumnField.value === column.field) ||\n props.selectableAcrossPages,\n });\n\n const conditionalColumnHeaderAndActionsClasses = (column: BentoColumn) => ({\n 'b-data-grid-columns__column-header-and-actions--numeric': column?.numeric,\n });\n\n const conditionalColumnActionsClasses = (column: BentoColumn) => ({\n 'b-data-grid-columns__column-actions--numeric': column?.numeric,\n });\n\n const conditionalColumnSeparatorClasses = (column: BentoColumn) => ({\n 'b-data-grid-columns__column-separator-container--is-resizeable': props.hasResizableColumns,\n 'b-data-grid-columns__column-separator-container--is-offset':\n props.hoveredOverColumnState.hoveredOverColumnField === column.field &&\n props.hoveredOverColumnState.isSeparatorOffset,\n });\n\n const conditionalColumnHeaderClasses = computed(() => ({\n 'b-data-grid-columns__column-header--truncated': props.truncateColumnHeaders,\n }));\n\n // Exposed refs\n defineExpose({\n columnHeaderRefs,\n });\n</script>\n\n<script lang=\"ts\">\n /**\n * A component to display the BentoDataGrid columns\n *\n * @example\n *\n * export default {\n * components: { DataGridColumns },\n * template: `\n * <data-grid-columns\n * v-if=\"columnSet?.length\"\n * :key=\"`data-grid-columns-${id}`\"\n * :columns=\"columnSet\"\n * :has-resizable-columns=\"hasResizableColumns\"\n * :sort-by=\"sortBy\"\n * :all-items-selected-state=\"allItemsSelectedState\"\n * :is-frozen-columns=\"isFrozenColumns\"\n * :show-frozen-columns-separator=\"showFrozenColumnsSeparator\"\n * :dragging-columns=\"draggingColumns\"\n * :has-draggable-columns=\"allowColumnDragAndDrop\"\n * :has-column-panel=\"columnPanel\"\n * :has-left-overflow=\"hasLeftOverflow\"\n * :has-first-column-panel-right-aligned=\"index === computedColumnPanelAlignment\"\n * :is-only-one-visible-column=\"isOnlyOneVisibleColumn\"\n * :selectable-across-pages=\"selectableAcrossPagesComputed\"\n * :truncate-column-headers=\"truncateColumnHeaders\"\n * v-on=\"draggingEventsForColumns\"\n * @column-move=\"onMoveColumnByOffset\"\n * @column-update=\"onConfigSettingsColumnUpdate\"\n * @column-resize=\"onColumnResized\"\n * @column-resizing=\"onColumnWidthOverride\"\n * @select-all-rows=\"onAllRowSelect\"\n * @select-all-across-pages=\"emit(BentoDatagridEvent.SELECT_ALL_ACROSS_PAGES)\"\n * @sort=\"onSort\"\n * >\n * <template v-for=\"(_, innerSlot) of slots\" #[innerSlot]=\"scope\">\n * <slot :name=\"innerSlot\" v-bind=\"scope\" />\n * </template>\n * </data-grid-columns>\n * `\n * }\n */\n export default {\n i18n: { messages },\n name: 'data-grid-columns',\n };\n</script>\n\n<style lang=\"scss\" scoped src=\"./data-grid-columns.scss\" />\n","/**\n * All the emit events provided by the DatagridConfigSettings component\n */\nexport enum DatagridConfigSettingsEvent {\n CONFIG_SETTINGS = 'config-settings',\n UPDATE_COLUMNS = 'update:columns',\n}\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><g fill=\"#00112C\" :clip-path=\"'url(#uia-icons-16-settings__a' + uuid + ')'\"><path d=\"M8 5.25C6.48122 5.25 5.25 6.48122 5.25 8C5.25 9.51878 6.48122 10.75 8 10.75C9.51878 10.75 10.75 9.51878 10.75 8C10.75 6.48122 9.51878 5.25 8 5.25ZM6.75 8C6.75 7.30964 7.30964 6.75 8 6.75C8.69036 6.75 9.25 7.30964 9.25 8C9.25 8.69036 8.69036 9.25 8 9.25C7.30964 9.25 6.75 8.69036 6.75 8Z\"/><path d=\"M6.84701 0.973015L6.59985 0.35083L5.9537 0.526056C4.64534 0.880867 3.48225 1.56808 2.55285 2.48641L2.07533 2.95826L2.49158 3.48495C2.79648 3.87074 2.85279 4.419 2.58992 4.87589C2.32905 5.32931 1.82436 5.55631 1.33473 5.48726L0.677319 5.39455L0.505539 6.03586C0.33838 6.65992 0.25 7.32519 0.25 7.99991C0.25 8.67463 0.33838 9.3399 0.505539 9.96396L0.677319 10.6053L1.33473 10.5126C1.82436 10.4435 2.32905 10.6705 2.58992 11.1239C2.85279 11.5808 2.79648 12.1291 2.49158 12.5149L2.07533 13.0416L2.55285 13.5134C3.48225 14.4317 4.64534 15.119 5.9537 15.4738L6.59985 15.649L6.84701 15.0268C7.02659 14.5748 7.47549 14.2499 8 14.2499C8.52452 14.2499 8.97341 14.5748 9.15299 15.0268L9.40016 15.649L10.0463 15.4738C11.3547 15.119 12.5177 14.4317 13.4471 13.5134L13.9247 13.0416L13.5084 12.5149C13.2035 12.1291 13.1472 11.5808 13.4101 11.1239C13.671 10.6705 14.1756 10.4435 14.6653 10.5126L15.3227 10.6053L15.4945 9.96396C15.6616 9.3399 15.75 8.67463 15.75 7.99991C15.75 7.32519 15.6616 6.65992 15.4945 6.03586L15.3227 5.39455L14.6653 5.48726C14.1756 5.55631 13.671 5.32931 13.4101 4.87589C13.1472 4.419 13.2035 3.87074 13.5084 3.48495L13.9247 2.95826L13.4471 2.48641C12.5177 1.56808 11.3547 0.880867 10.0463 0.526056L9.40016 0.35083L9.15299 0.973015C8.97341 1.42506 8.52452 1.74991 8 1.74991C7.47549 1.74991 7.02659 1.42506 6.84701 0.973015ZM3.89008 5.62393C4.33946 4.84286 4.36394 3.9353 4.03405 3.16853C4.55803 2.73795 5.15349 2.39116 5.80146 2.14902C6.30062 2.81653 7.10051 3.24991 8 3.24991C8.89949 3.24991 9.69938 2.81653 10.1985 2.14902C10.8465 2.39116 11.442 2.73795 11.966 3.16853C11.6361 3.9353 11.6605 4.84287 12.1099 5.62393C12.5612 6.40839 13.3382 6.88092 14.1658 6.97982C14.221 7.31075 14.25 7.65319 14.25 7.99991C14.25 8.34663 14.221 8.68908 14.1658 9.02001C13.3382 9.11891 12.5612 9.59143 12.1099 10.3759C11.6605 11.157 11.6361 12.0645 11.9659 12.8313C11.442 13.2619 10.8465 13.6087 10.1985 13.8508C9.69938 13.1833 8.89949 12.7499 8 12.7499C7.10051 12.7499 6.30062 13.1833 5.80146 13.8508C5.15349 13.6087 4.55803 13.2619 4.03405 12.8313C4.36394 12.0645 4.33946 11.157 3.89008 10.3759C3.43875 9.59143 2.66177 9.1189 1.8342 9.02C1.77896 8.68908 1.75 8.34663 1.75 7.99991C1.75 7.65319 1.77896 7.31074 1.8342 6.97982C2.66177 6.88092 3.43875 6.40839 3.89008 5.62393Z\"/></g><defs><clipPath :id=\"'uia-icons-16-settings__a' + uuid\"><rect width=\"16\" height=\"16\" fill=\"#fff\"/></clipPath></defs></svg>\n</template>\n<script>\n let uuid = 0;\n\n export default {\n beforeCreate() {\n this.uuid = uuid.toString();\n uuid += 1;\n },\n };\n</script>\n<style>\n @import '../css/main.css';\n</style>\n","<template>\n <div class=\"b-data-grid-config-settings-column-row\" @mouseover=\"showFreezeIcon\" @mouseleave=\"hideFreezeIcon\">\n <bento-toggle\n :aria-label=\"$t('toggleColumnVisibility', { label: column.label })\"\n :disabled=\"isColumnVisibilityToggleDisabled\"\n label-position=\"after\"\n :value=\"isColumnVisible\"\n @input=\"toggleColumnVisibility\"\n >\n {{ column.label }}\n </bento-toggle>\n <bento-freeze-icon\n v-show=\"isColumnFrozen || isFreezeIconOptionShown\"\n :aria-label=\"$t('toggleColumnFreeze', { label: column.label })\"\n class=\"b-data-grid-config-settings-column-row__freeze-icon\"\n :class=\"freezeIconConditionalClasses\"\n @click.native=\"toggleColumnFreeze\"\n />\n </div>\n</template>\n\n<script lang=\"ts\">\n import { computed, defineComponent, PropType, ref } from 'vue';\n import { BentoToggle } from '@/components/toggle';\n import { BentoColumn } from '@/components/data-grid';\n import BentoFreezeIcon from '@adyen/ui-assets-icons-16/vue/freeze';\n import messages from './messages.json';\n\n export default defineComponent({\n i18n: { messages },\n name: 'bento-data-grid',\n components: {\n BentoFreezeIcon,\n BentoToggle,\n },\n props: {\n /**\n * Is column visibitlity toggle disabled\n */\n isColumnVisibilityToggleDisabled: {\n type: Boolean,\n required: true,\n },\n /**\n * Column definition\n */\n column: {\n type: Object as PropType<BentoColumn>,\n required: true,\n },\n },\n emits: ['visible-column', 'updated-column'],\n setup(props, { emit }) {\n const isFreezeIconOptionShown = ref(false);\n const isColumnFrozen = computed(() => props.column?.frozen);\n const isColumnVisible = computed(() => props.column?.visible !== false);\n\n const toggleColumnVisibility = () => {\n emit('visible-column', { ...props.column, visible: !isColumnVisible.value });\n };\n\n const toggleColumnFreeze = () => {\n emit('updated-column', { ...props.column, frozen: !isColumnFrozen.value });\n };\n\n const showFreezeIcon = () => {\n if (!isColumnFrozen.value) {\n isFreezeIconOptionShown.value = true;\n }\n };\n\n const hideFreezeIcon = () => {\n if (!isColumnFrozen.value) {\n isFreezeIconOptionShown.value = false;\n }\n };\n\n const freezeIconConditionalClasses = computed(() => ({\n [`b-data-grid-config-settings-column-row__freeze-icon--frozen`]: isColumnFrozen.value,\n }));\n\n return {\n // Values\n isFreezeIconOptionShown,\n isColumnFrozen,\n freezeIconConditionalClasses,\n isColumnVisible,\n\n // Methods\n toggleColumnVisibility,\n showFreezeIcon,\n hideFreezeIcon,\n toggleColumnFreeze,\n };\n },\n });\n</script>\n\n<style lang=\"scss\" scoped src=\"./data-grid-config-settings-column-row.scss\" />\n","<!-- TODO: Remove aria props from search-bar as these name clashes with JSX type /vue/types/jsx.d.ts -->\n<!-- eslint-disable vue/attribute-hyphenation -->\n<template>\n <div v-bento-click-outside-directive=\"onClickOutside\" class=\"b-data-grid-config-settings\">\n <div class=\"b-data-grid-config-settings__button-and-separator\">\n <div ref=\"configSettingsButtonRef\" class=\"b-data-grid-config-settings__button-container\">\n <bento-toggle-button\n :aria-controls=\"isConfigSettingsPanelOpen ? popoverId : null\"\n variant=\"tertiary\"\n condensed\n :toggled=\"isConfigSettingsPanelOpen\"\n @click=\"setConfigSettingsPanelVisibility(!isConfigSettingsPanelOpen)\"\n >\n <template #iconLeft>\n <bento-settings-icon :svg-title=\"$t('toggleConfigSettingsPanelVisibility')\" />\n </template>\n </bento-toggle-button>\n </div>\n </div>\n <bento-popover\n v-if=\"configSettingsButtonRef\"\n :id=\"popoverId\"\n :open=\"isConfigSettingsPanelOpen\"\n class=\"b-data-grid-config-settings__panel\"\n :aria-label=\"$t('configSettingsPanel')\"\n :target-element=\"configSettingsButtonRef\"\n position=\"bottom-end\"\n >\n <div class=\"b-data-grid-config-settings__panel-header\">\n <bento-typography el=\"span\" strongest>\n {{ $t('displayOptions') }}\n </bento-typography>\n <bento-button variant=\"tertiary\" @click=\"setConfigSettingsPanelVisibility(false)\">\n <template #iconLeft>\n <bento-cross-icon :svg-title=\"$t('closeConfigSettingsPanel')\" />\n </template>\n </bento-button>\n </div>\n <div class=\"b-data-grid-config-settings__condensed-view-settings\">\n <bento-typography class=\"b-data-grid-config-settings__condensed-view-title\" el=\"span\" stronger>\n {{ $t('size') }}\n </bento-typography>\n <bento-toggle\n label-position=\"after\"\n :aria-label=\"$t('condensedToggle')\"\n :value=\"condensed\"\n @input=\"emitCondensedToggle\"\n >\n {{ $t('condensed') }}\n </bento-toggle>\n </div>\n <div class=\"b-data-grid-config-settings__column-visibility-settings\">\n <div class=\"b-data-grid-config-settings__column-visibility-header\">\n <bento-typography class=\"b-data-grid-config-settings__column-visibility-title\" el=\"span\" stronger>\n {{ $t('columns') }}\n </bento-typography>\n <bento-button\n v-if=\"!isColumnVisibilityFilterShown\"\n ref=\"searchButtonRef\"\n variant=\"tertiary\"\n @click=\"toggleColumnFilter\"\n >\n <template #iconLeft><bento-search-icon /> </template>{{ $t('search') }}</bento-button\n >\n <bento-button v-else variant=\"tertiary\" @click=\"toggleColumnFilter\">\n <template #iconLeft>\n <bento-cross-icon />\n </template>\n {{ $t('closeSearch') }}\n </bento-button>\n </div>\n <div v-if=\"isColumnVisibilityFilterShown\" class=\"b-data-grid-config-settings__column-visibility-search\">\n <bento-search-bar\n ref=\"searchBarRef\"\n :value=\"searchTerm\"\n :input-field-aria-label=\"$t('columnVisibilitySearchFilter').toString()\"\n @input=\"searchTerm = $event\"\n @clear=\"clearAction\"\n @escape-pressed=\"toggleColumnFilter\"\n />\n </div>\n <div v-else class=\"b-data-grid-config-settings__column-visibility-show-all\">\n <bento-toggle\n label-position=\"after\"\n :value=\"allColumnsVisbilityToggleState\"\n @input=\"toggleAllColumnVisibility\"\n >\n {{ $t('showAllColumns', { numberOfColumns: columns.length }) }}\n </bento-toggle>\n </div>\n <div class=\"b-data-grid-config-settings__column-visibility-toggles\">\n <div v-for=\"column of filteredColumnVisibilityColumns\" :key=\"column.field\">\n <bento-data-grid-config-settings-config-row\n v-if=\"column.field !== DATAGRID_SELECT_FIELD_NAME\"\n :column=\"column\"\n :is-column-visibility-toggle-disabled=\"isColumnVisibilityToggleDisabled(column)\"\n @visible-column=\"emitVisibleColumns\"\n @updated-column=\"emitFrozenColumns\"\n />\n </div>\n <bento-typography\n v-if=\"filteredColumnVisibilityColumns.length === 0\"\n el=\"span\"\n class=\"b-data-grid-config-settings__column-visibility-empty-search-message\"\n >\n {{ $t('noColumnsMatch') }}\n </bento-typography>\n </div>\n </div>\n </bento-popover>\n </div>\n</template>\n\n<script lang=\"ts\">\n import { computed, defineComponent, nextTick, PropType, ref, toRef } from 'vue';\n import { BentoPopover } from '@/components/popover';\n import { BentoButton, BentoToggleButton } from '@/components/button';\n import { BentoTypography } from '@/components/typography';\n import { BentoToggle } from '@/components/toggle';\n import { BentoColumn } from '../../data-grid.types';\n import { BentoSearchBar, useSearchBarFilter } from '@/components/search-bar';\n import { BentoClickOutsideDirective } from '@/directives';\n import { DatagridConfigSettingsEvent } from './data-grid-config-settings.types';\n import BentoSettingsIcon from '@adyen/ui-assets-icons-16/vue/settings';\n import BentoCrossIcon from '@adyen/ui-assets-icons-16/vue/cross';\n import BentoSearchIcon from '@adyen/ui-assets-icons-16/vue/search';\n import BentoDataGridConfigSettingsConfigRow from './components/data-grid-config-settings-column-row/data-grid-config-settings-column-row.vue';\n import messages from './messages.json';\n import { generateUid } from '@/utils/ts/unique-id';\n import { DATAGRID_SELECT_FIELD_NAME } from '../../composables';\n\n export default defineComponent({\n i18n: { messages },\n name: 'bento-data-grid',\n components: {\n BentoButton,\n BentoCrossIcon,\n BentoPopover,\n BentoSettingsIcon,\n BentoToggleButton,\n BentoDataGridConfigSettingsConfigRow,\n BentoSearchBar,\n BentoSearchIcon,\n BentoToggle,\n BentoTypography,\n },\n directives: { BentoClickOutsideDirective },\n props: {\n /**\n * Column definitions\n */\n columns: {\n type: Array as PropType<BentoColumn[]>,\n required: true,\n },\n\n /**\n * Sets the row cells to the condensed padding state.\n */\n condensed: {\n type: Boolean,\n default: false,\n },\n },\n emits: [DatagridConfigSettingsEvent.CONFIG_SETTINGS, DatagridConfigSettingsEvent.UPDATE_COLUMNS],\n setup(props, { emit }) {\n const configSettingsButtonRef = ref(null);\n const popoverId = generateUid('data-grid-config-settings-popover');\n const searchBarRef = ref(null);\n const isConfigSettingsPanelOpen = ref<boolean>(false);\n const allColumnsVisbilityToggleState = ref<boolean>(true);\n const searchButtonRef = ref(null);\n const searchTerm = ref<string>('');\n const columnsRef = toRef(props, 'columns');\n const isColumnVisibilityFilterShown = ref<boolean>(false);\n\n // Column Visibility Filtering\n const filteredColumnVisibilityColumns = useSearchBarFilter<BentoColumn>(searchTerm, columnsRef);\n const clearAction = () => {\n searchTerm.value = '';\n };\n const areAllNonMandatoryColumnsHidden = computed(\n () => !props.columns.some(col => col.visible === false && !col.mandatory)\n );\n const toggleColumnFilter = () => {\n clearAction();\n isColumnVisibilityFilterShown.value = !isColumnVisibilityFilterShown.value;\n if (isColumnVisibilityFilterShown.value) {\n nextTick(() => searchBarRef.value.$refs.bentoInputField?.focusInput());\n } else {\n nextTick(() => searchButtonRef?.value?.$el?.focus());\n }\n allColumnsVisbilityToggleState.value = areAllNonMandatoryColumnsHidden.value;\n };\n\n // Column visibility\n const isColumnVisibilityToggleDisabled = (column: BentoColumn) => column.mandatory ?? false;\n\n const emitVisibleColumns = (updatedColumn: BentoColumn) => {\n const updatedColumns = props.columns.map(col => ({\n ...col,\n visible: updatedColumn.field === col.field ? updatedColumn.visible : col.visible,\n }));\n\n emit(DatagridConfigSettingsEvent.UPDATE_COLUMNS, updatedColumns);\n };\n\n const toggleAllColumnVisibility = (toggleState: boolean) => {\n if (toggleState) {\n // Show all columns\n emit(\n DatagridConfigSettingsEvent.UPDATE_COLUMNS,\n props.columns.map(col => ({ ...col, visible: true }))\n );\n } else {\n // Hide all columns except for mandatory columns\n emit(\n DatagridConfigSettingsEvent.UPDATE_COLUMNS,\n props.columns.map(col => ({ ...col, visible: col?.mandatory === true }))\n );\n }\n };\n\n // Column freeze\n // TODO to convert this function to 'emitUpdatedColumns', that will emit both: visible and frozen columns\n const emitFrozenColumns = (updatedColumn: BentoColumn) => {\n const updatedColumns = props.columns.map(col => ({\n ...col,\n frozen: updatedColumn.field === col.field ? !!updatedColumn?.frozen : !!col?.frozen,\n }));\n\n emit(DatagridConfigSettingsEvent.UPDATE_COLUMNS, updatedColumns);\n };\n\n // Panel visibility\n const setConfigSettingsPanelVisibility = (isVisible: boolean) => {\n isConfigSettingsPanelOpen.value = isVisible;\n allColumnsVisbilityToggleState.value = areAllNonMandatoryColumnsHidden.value;\n };\n const onClickOutside = () => setConfigSettingsPanelVisibility(false);\n // Condensed view\n const emitCondensedToggle = (isCondensedView: boolean) =>\n emit(DatagridConfigSettingsEvent.CONFIG_SETTINGS, isCondensedView);\n\n return {\n // Values\n configSettingsButtonRef,\n popoverId,\n isConfigSettingsPanelOpen,\n allColumnsVisbilityToggleState,\n filteredColumnVisibilityColumns,\n searchTerm,\n isColumnVisibilityFilterShown,\n searchBarRef,\n searchButtonRef,\n DATAGRID_SELECT_FIELD_NAME,\n\n // Methods\n setConfigSettingsPanelVisibility,\n emitCondensedToggle,\n toggleAllColumnVisibility,\n clearAction,\n toggleColumnFilter,\n emitVisibleColumns,\n emitFrozenColumns,\n onClickOutside,\n isColumnVisibilityToggleDisabled,\n };\n },\n });\n</script>\n\n<style lang=\"scss\" scoped src=\"./data-grid-config-settings.scss\" />\n","<template>\n <div class=\"b-data-grid-lazy-load\">\n <bento-loading-indicator v-if=\"loading && isInfiniteScroll\" />\n <bento-loading-button\n v-if=\"loading && !isInfiniteScroll\"\n variant=\"secondary\"\n :state=\"BentoLoadingButtonState.LOADING\"\n >{{ $t('loading') }}</bento-loading-button\n >\n <bento-loading-button\n v-if=\"!loading && !isInfiniteScroll\"\n :state=\"BentoLoadingButtonState.START\"\n variant=\"secondary\"\n @click=\"$emit(BentoDatagridEvent.UPDATE_SHOW_MORE)\"\n >{{ $t('showMore') }}</bento-loading-button\n >\n </div>\n</template>\n\n<script setup lang=\"ts\">\n import { BentoLoadingButton, BentoLoadingButtonState } from '@/components/button';\n import { BentoLoadingIndicator } from '@/components/loading-indicator';\n import { BentoDatagridEvent } from '../../data-grid.types';\n import messages from '../../messages.json';\n\n defineProps<{\n /**\n * Indicates whether the component is in a loading state.\n */\n loading: boolean;\n\n /**\n * If set to true, displays a loading indicator. Otherwise displays a loading button.\n */\n isInfiniteScroll: boolean;\n }>();\n</script>\n\n<script lang=\"ts\">\n /**\n * Internal component to display the bento-data-grid's lazy loading.\n * The component can render a 'Show more' loading button or a loading indicator.\n */\n export default {\n i18n: { messages },\n };\n</script>\n\n<style lang=\"scss\" scoped src=\"./data-grid-lazy-load.scss\" />\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#00112C\" d=\"M12.9243 1.86372C12.0456 0.985043 10.621 0.985041 9.74234 1.86372L1.25 10.3561V14.7501H5.64399L14.1363 6.25772C15.015 5.37904 15.015 3.95442 14.1363 3.07574L12.9243 1.86372ZM10.803 2.92438C11.0959 2.63149 11.5708 2.63149 11.8637 2.92438L13.0757 4.1364C13.3686 4.42929 13.3686 4.90416 13.0757 5.19706L12.3333 5.93947L10.0606 3.6668L10.803 2.92438ZM8.99993 4.72746L11.2726 7.00013L5.02267 13.2501H2.75V10.9774L8.99993 4.72746Z\"/></svg>\n</template>\n<script>\n let uuid = 0;\n\n export default {\n beforeCreate() {\n this.uuid = uuid.toString();\n uuid += 1;\n },\n };\n</script>\n<style>\n @import '../css/main.css';\n</style>\n","<template>\n <Transition name=\"b-data-grid-cell-actions__animation\" appear>\n <div class=\"b-data-grid-cell-actions\">\n <div class=\"b-data-grid-cell-actions__background-gradient\"></div>\n <div class=\"b-data-grid-cell-actions__actions\" role=\"group\">\n <div\n v-for=\"(button, index) in limitedRowCellActionsProps\"\n :key=\"index\"\n class=\"b-data-grid-cell-actions__action\"\n >\n <bento-menu\n v-if=\"button.menuData\"\n :data=\"transformMenuEvents(button.menuData)\"\n :button=\"{\n condensed: true,\n variant: 'secondary',\n disabled: button.disabled,\n }\"\n teleport\n @menu-item-click=\"emit('menu-item-click-close')\"\n >\n <template v-if=\"shouldShowMenuIconLeft(button)\" #iconLeft>\n <options-vertical-icon\n v-if=\"button?.variant === 'more'\"\n :svg-title=\"getButtonTitle(button, true)\"\n />\n <component :is=\"button.iconLeft\" v-else :svg-title=\"getButtonTitle(button, true)\" />\n </template>\n <template v-if=\"!button?.isShort\" #default>\n {{ getButtonTitle(button) }}\n </template>\n <template v-if=\"shouldShowMenuIconRight(button)\" #iconRight>\n <external-link-icon\n v-if=\"button?.variant === 'open'\"\n :svg-title=\"getButtonTitle(button, true)\"\n />\n <component :is=\"button.iconRight\" v-else :svg-title=\"button.title\" />\n </template>\n </bento-menu>\n <copy\n v-else-if=\"button.variant === 'copy'\"\n :text=\"getCopyText(button)\"\n :button-text=\"getButtonTitle(button)\"\n :button=\"{\n condensed: true,\n variant: 'secondary',\n }\"\n />\n <bento-button\n v-else\n condensed\n variant=\"secondary\"\n :critical=\"button.critical\"\n :disabled=\"button.disabled\"\n :link=\"button.link\"\n v-on=\"generateButtonEvents(button)\"\n >\n <template v-if=\"button.iconLeft || button.variant === 'edit'\" #iconLeft>\n <edit1-icon v-if=\"button?.variant === 'edit'\" :svg-title=\"getButtonTitle(button, true)\" />\n <component :is=\"button.iconLeft\" v-else :svg-title=\"button.title\" />\n </template>\n <template v-if=\"!button?.isShort\" #default>\n {{ getButtonTitle(button) }}\n </template>\n <template v-if=\"button.iconRight || button.variant === 'open'\" #iconRight>\n <external-link-icon\n v-if=\"button?.variant === 'open'\"\n :svg-title=\"getButtonTitle(button, true)\"\n />\n <component :is=\"button.iconRight\" v-else :svg-title=\"button.title\" />\n </template>\n </bento-button>\n </div>\n </div>\n </div>\n </Transition>\n</template>\n\n<script setup lang=\"ts\">\n import { computed, PropType } from 'vue';\n import { BentoButton } from '@/components/button';\n import { BentoMenu, BentoMenuItem } from '@/components/menu';\n import { Copy } from '@/internal';\n import { printDevelopmentWarning } from '@/utils/ts/print-development-warning';\n import { BentoDatagridDataItem } from '@/components/data-grid/data-grid.types';\n import Edit1Icon from '@adyen/ui-assets-icons-16/vue/edit-1';\n import ExternalLinkIcon from '@adyen/ui-assets-icons-16/vue/external-link';\n import OptionsVerticalIcon from '@adyen/ui-assets-icons-16/vue/options-vertical';\n\n // Types\n import type {\n BentoColumnCellAction,\n BentoColumnCellActionMenuItem,\n BentoColumnCellActions,\n } from './data-grid-cell-actions.types';\n\n // Translations\n import messages from './messages.json';\n import { useI18n } from '@/utils/ts/i18n';\n\n type MessageSchema = (typeof messages)['en-US'];\n const { t } = useI18n<{ message: MessageSchema }>({ messages });\n\n const props = defineProps({\n /**\n * Column definitions using 'key' to relate to data object.\n */\n cellActions: {\n type: Array as PropType<BentoColumnCellActions>,\n required: true,\n validator: (value: BentoColumnCellActions) => value?.length <= 2,\n },\n\n /**\n * The column field key.\n */\n columnKey: {\n type: String,\n required: true,\n },\n\n /**\n * The row data item object.\n */\n rowDataItem: {\n type: Object as PropType<BentoDatagridDataItem>,\n required: true,\n },\n });\n\n const emit = defineEmits<{\n /**\n * Emits when a cell actions menu button closes due to a menu item click\n */\n (e: 'menu-item-click-close'): void;\n }>();\n\n // Do not allow users to provide more than 2 cell action buttons\n const limitedRowCellActionsProps = computed(() => {\n if (props.cellActions?.length > 2) {\n printDevelopmentWarning(\n 'WARNING: BentoDataGrid Cell actions can only have a maximum of 2 actions, if you need more consider using the menuData property instead.'\n );\n }\n\n return props.cellActions.slice(0, 2);\n });\n\n const getButtonTitle = computed(() => (button: BentoColumnCellAction, isForSvgTitle?: boolean) => {\n if ((!isForSvgTitle && button.isShort) || (isForSvgTitle && !button.isShort)) {\n return undefined;\n }\n\n switch (button.variant) {\n case 'copy':\n return t('copy');\n case 'edit':\n return t('edit');\n case 'open':\n return t('open');\n case 'more':\n return t('more');\n default:\n return button.title;\n }\n });\n\n const generateButtonEvents = (button: BentoColumnCellAction) =>\n button?.event !== undefined\n ? {\n click: () => button.event(props.rowDataItem, props.columnKey),\n }\n : {};\n\n const generateMenuEvents = (menuDataItem: BentoColumnCellActionMenuItem): BentoMenuItem => ({\n ...menuDataItem,\n handler: () => {\n if (menuDataItem?.handler && typeof menuDataItem.handler === 'function') {\n menuDataItem?.handler();\n }\n if (menuDataItem?.event && typeof menuDataItem.event === 'function') {\n menuDataItem?.event(props.rowDataItem, props.columnKey);\n }\n },\n });\n\n const transformMenuEvents = (menuData: BentoColumnCellActionMenuItem[]) =>\n menuData.map(menuDataItem => {\n const transformedMenuData = menuDataItem;\n if (transformedMenuData?.items) {\n transformedMenuData.items = transformMenuEvents(transformedMenuData.items);\n }\n return { ...generateMenuEvents(transformedMenuData) };\n });\n\n const getCopyText = (button: BentoColumnCellAction) =>\n button?.getCopyData !== undefined\n ? button.getCopyData(props.rowDataItem, props.columnKey)\n : (props.rowDataItem?.[props.columnKey]?.toString() as string);\n\n const shouldShowMenuIconRight = (button: BentoColumnCellAction) =>\n button.iconRight || ((button?.variant === 'more' || button?.variant === 'open') && !button.isShort);\n\n const shouldShowMenuIconLeft = (button: BentoColumnCellAction) => button.iconLeft || button?.variant === 'more';\n</script>\n\n<script lang=\"ts\">\n /**\n * Internal component to display the data-grid actions.\n * There are 4 different pre-defined buttons that can be used by using the `variant` property.\n *\n * The component renders buttons or a menu depending on the actions provided.\n *\n * @example\n * <data-grid-cell-actions\n * :cell-actions=\"[\n * { variant: 'edit', event: () => {} },\n * {\n * variant: 'more',\n * isShort: true,\n * menuData: [\n * {\n * text: 'Cancel payment',\n * handler: () => {}),\n * critical: true,\n * },\n * {\n * text: 'Transfer payment',\n * handler: () => {},\n * },\n * {\n * text: 'Delete payment',\n * handler: () => {},\n * disabled: true,\n * },\n * ],\n * },\n * ]\"\n * column-key=\"payment\"\n * :row-data-item=\"rowData\"\n * />\n */\n export default {\n i18n: { messages },\n name: 'data-grid-cell-actions',\n };\n</script>\n\n<style lang=\"scss\" scoped src=\"./data-grid-cell-actions.scss\" />\n","import type { BentoColumn } from '../../data-grid.types';\nimport type { Ref } from 'vue';\n\nexport enum DataGridCellPropClass {\n COLUMN_HOVERED = 'column-hovered',\n COLUMN_HOVERED_NO_BORDER_LEFT = 'column-hovered-no-border-left',\n COLUMN_HOVERED_NO_BORDER_RIGHT = 'column-hovered-no-border-right',\n CONDENSED = 'condensed',\n FROZEN = 'frozen',\n IS_COLUMN_REORDERING = 'is-column-re-ordering',\n IS_COLUMN_REORDERING_TARGET_LEFT = 'is-column-re-order-target-left',\n IS_COLUMN_REORDERING_TARGET_RIGHT = 'is-column-re-order-target-right',\n LAST_FROZEN_COLUMN_CELL = 'last-frozen-column-cell',\n NUMERIC = 'numeric',\n OVERFLOW_ELLIPSIS = 'overflow-ellipsis',\n PADDING_LEFT_UNSET = 'padding-left-unset',\n PADDING_RIGHT_UNSET = 'padding-right-unset',\n}\n\nexport interface DataGridCellDragEvents {\n dragenter?: (e: DragEvent) => void;\n drop?: () => void;\n dragover?: (e: DragEvent) => void;\n}\n\nexport type DataGridCellDragEventsForColumn = (column: BentoColumn) => {\n dragenter?: (e: DragEvent) => void;\n drop?: () => void;\n dragover?: (e: DragEvent) => void;\n};\n\nexport interface DataGridCellColumnSet {\n columnSet: BentoColumn[];\n id: string;\n isFrozenColumns?: boolean;\n}\n\nexport interface DataGridCellEvents extends DataGridCellDragEvents {\n keyup?: (event: KeyboardEvent) => void;\n keydown?: (event: KeyboardEvent) => void;\n mouseenter?: () => void;\n mouseleave?: (e: MouseEvent) => void;\n focus?: (e: FocusEvent) => void;\n focusout?: (e: FocusEvent) => void;\n}\n\nexport type DataGridCellEventsForColumn = (column: BentoColumn) => DataGridCellEvents;\nexport type DataGridCellRegisterMenu = {\n registerMenuContainerElement: (menuContainerElement: Ref<HTMLDivElement>) => void;\n menuMouseLeave: (e: MouseEvent) => void;\n};\n","<template>\n <div\n :key=\"`cell-${column.field}`\"\n ref=\"gridcellRef\"\n :data-testid=\"`cell-${column.field}`\"\n :data-cellindex=\"getCellIndex(rowIndex, colIndex, columnSetIndex)\"\n class=\"b-data-grid-cell\"\n :class=\"conditionalRowCellClasses(column)\"\n role=\"gridcell\"\n :tabindex=\"getCellIndex(rowIndex, colIndex, columnSetIndex) === 0 ? '0' : '-1'\"\n :aria-colindex=\"getColIndex(colIndex, columnSetIndex) + 1\"\n :style=\"{\n width: column.autoWidth && isMeasuringColumnWidths ? 'auto' : `${column.width}px`,\n }\"\n v-on=\"getGridcellEvents(column)\"\n >\n <template v-if=\"column.field !== DATAGRID_SELECT_FIELD_NAME\">\n <bento-typography el=\"div\">\n <slot :item=\"rowData\" :name=\"`item-${column.field}`\">\n <span :title=\"conditionalTitleAttribute(column, rowData[column.field])\">{{\n getRowData(rowData[column.field])\n }}</span>\n </slot>\n </bento-typography>\n <div v-if=\"column.cellActions?.length > 0\" class=\"b-data-grid-cell__cell-actions\">\n <data-grid-cell-actions\n v-if=\"shouldShowCellActions\"\n ref=\"cellActionsRef\"\n :cell-actions=\"column.cellActions\"\n :column-key=\"column.field\"\n :row-data-item=\"rowData\"\n @menu-item-click-close=\"onMenuClose\"\n />\n </div>\n </template>\n <template v-else>\n <bento-checkbox\n class=\"b-data-grid-cell__select-cell\"\n :aria-label=\"t('selectRow')\"\n :model-value=\"selectedItems\"\n :disabled=\"isDataItemDisabled(rowData)\"\n :value=\"getDataItemId(rowData)\"\n @update:model-value=\"$emit('select-row', $event)\"\n />\n </template>\n </div>\n</template>\n\n<script setup lang=\"ts\">\n import { PropType, provide, ref, Ref, watch } from 'vue';\n import { DATAGRID_SELECT_FIELD_NAME } from '../../composables';\n import { BentoCheckbox } from '@/components/checkbox';\n import { BentoTypography } from '@/components/typography';\n import DataGridCellActions from '../data-grid-cell-actions/data-grid-cell-actions.vue';\n import { DATA_GRID_CELL_MENU_REGISTERING_INJECTION_KEY } from '@/components/data-grid/components/data-grid-cell/data-grid-cell.keys';\n\n // Types and enums\n import {\n BentoColumn,\n BentoColumnOverflow,\n BentoDatagridDataItem,\n BentoDatagridDataItemId,\n BentoDatagridGetDataItemIdFn,\n BentoDatagridIsDataItemDisabledFn,\n } from '@/components/data-grid/data-grid.types';\n import {\n DataGridCellColumnSet,\n DataGridCellDragEventsForColumn,\n DataGridCellEvents,\n DataGridCellEventsForColumn,\n DataGridCellPropClass,\n DataGridCellRegisterMenu,\n } from './data-grid-cell.types';\n import type { BentoDatagridDraggingColumnState } from '../data-grid-columns/data-grid-columns.types';\n import type { DatagridColumnHoveringState } from '@/components/data-grid/composables/use-column-hovering';\n\n // Translations\n import messages from './messages.json';\n import { useI18n } from '@/utils/ts/i18n';\n\n type MessageSchema = (typeof messages)['en-US'];\n const { t } = useI18n<{ message: MessageSchema }>({ messages });\n\n const props = defineProps({\n draggingEventsForRowCell: {\n type: Function as PropType<DataGridCellDragEventsForColumn>,\n required: true,\n },\n\n /**\n * The columns sets including\n */\n columnSets: {\n type: Array as PropType<DataGridCellColumnSet[]>,\n required: true,\n },\n\n /**\n * The columns set we are iterating over\n */\n column: {\n type: Object as PropType<BentoColumn>,\n required: true,\n },\n\n colIndex: {\n type: Number,\n required: true,\n },\n\n columnSetIndex: {\n type: Number,\n required: true,\n },\n\n /**\n * Sets the row cells to the condensed padding state.\n */\n condensed: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Columns being dragged, contains dragging column and a target column\n */\n draggingColumns: {\n type: Object as PropType<BentoDatagridDraggingColumnState>,\n default: undefined,\n },\n\n /**\n * A customisable method to retrieve a unique identifier for a data item in the array of data supplied.\n * This is used selecting and performance reasons and must exist in each data item.\n */\n getDataItemId: {\n type: Function as PropType<BentoDatagridGetDataItemIdFn>,\n default: (item: BentoDatagridDataItem) => item.id,\n },\n\n /**\n * The column hovered over state and whether the hovered over column should show a border right or left.\n */\n hoveredOverColumnState: {\n type: Object as PropType<DatagridColumnHoveringState>,\n required: true,\n },\n\n /**\n * A customisable method to determine if a row is not selectable.\n * The default is that every row is selectable.\n */\n isDataItemDisabled: {\n type: Function as PropType<BentoDatagridIsDataItemDisabledFn>,\n default: () => false,\n },\n\n isMeasuringColumnWidths: {\n type: Boolean,\n default: false,\n },\n\n /**\n * The row data object\n */\n rowData: {\n type: Object as PropType<BentoDatagridDataItem>,\n required: true,\n },\n\n rowIndex: {\n type: Number,\n required: true,\n },\n\n selectedItems: {\n type: Array as PropType<BentoDatagridDataItemId[]>,\n required: true,\n },\n });\n\n const emit = defineEmits<{\n /**\n * Emitted when an a frozen column cell fires a key up or down event.\n */\n (e: 'on-frozen-columns-key-press', event: Event);\n\n /**\n * Emitted when a row has been selected.\n */\n (e: 'select-row', value: BentoDatagridDataItemId[]);\n\n /**\n * Emitted when a row has been selected.\n */\n (e: 'register-row-cell-element', el: Element, field: string, rowIndex: number);\n\n /**\n * Emitted when a cell has been hovered over. This is used to keep the row in a hovered state when hovering over a menu.\n */\n (e: 'cell-hovered', value: number);\n }>();\n\n // References\n const gridcellRef = ref<HTMLDivElement | null>(null);\n const cellActionsRef = ref<InstanceType<typeof DataGridCellActions>>(null);\n const shouldShowCellActions = ref(false);\n const childrenMenuContainerElements = ref<Ref<HTMLDivElement>[]>([]);\n\n // Row data retrieval methods\n const conditionalTitleAttribute = (column: BentoColumn, content: unknown) =>\n column?.overflow === BentoColumnOverflow.ELLIPSIS ? `${content}` : undefined;\n const getRowData = (rowData: unknown) => rowData ?? '-';\n\n // Cell and Columns index calculation\n const sumColumnAmountsInColumnSets = (limitIndex?: number) =>\n props.columnSets.slice(0, limitIndex).reduce((total, { columnSet }) => total + columnSet.length, 0);\n // Sums the amount of columns on every previous column set to find\n // the absolute column index (useful for frozen columns use case)\n const getColIndex = (colIndex: number, colSetIndex: number) => colIndex + sumColumnAmountsInColumnSets(colSetIndex);\n const getCellIndex = (rowIndex: number, colIndex: number, colSetIndex: number) =>\n sumColumnAmountsInColumnSets() * rowIndex + getColIndex(colIndex, colSetIndex);\n\n /**\n * We check here if we are leaving the cell but mouse into a child menu\n * If this is the case we don't want to hide the cell actions.\n * @param relatedTarget\n */\n const isLeavingCellFocus = (relatedTarget: EventTarget) => {\n if (\n relatedTarget === null ||\n (!gridcellRef.value.contains(relatedTarget as Node) &&\n !childrenMenuContainerElements.value\n ?.map(registeredMenuRef => registeredMenuRef.value)\n .some(menuElement => menuElement === relatedTarget || menuElement?.contains(relatedTarget as Node)))\n ) {\n shouldShowCellActions.value = false;\n }\n };\n\n const onMenuClose = () => {\n // TODO: we need an emit that fires on when clicking on menu item, not when closing menu due to the toggle button....\n shouldShowCellActions.value = false;\n };\n\n // Events\n const getGridcellEvents: DataGridCellEventsForColumn = (column: BentoColumn) => {\n const defaultEvents: DataGridCellEvents = {\n ...props.draggingEventsForRowCell(column),\n };\n\n const gridCellEvents: DataGridCellEvents = { ...defaultEvents };\n\n if (column.frozen) {\n gridCellEvents.keyup = (event: Event) => emit('on-frozen-columns-key-press', event);\n gridCellEvents.keydown = (event: Event) => emit('on-frozen-columns-key-press', event);\n }\n if (column.cellActions) {\n gridCellEvents.mouseenter = () => {\n shouldShowCellActions.value = true;\n };\n gridCellEvents.mouseleave = (e: MouseEvent) => {\n shouldShowCellActions.value = false;\n isLeavingCellFocus(e?.relatedTarget);\n };\n gridCellEvents.mouseleave = (e: MouseEvent) => {\n isLeavingCellFocus(e?.relatedTarget);\n };\n gridCellEvents.focus = (e: FocusEvent) => {\n shouldShowCellActions.value = true;\n };\n gridCellEvents.focusout = (e: FocusEvent) => {\n isLeavingCellFocus(e?.relatedTarget);\n };\n }\n return gridCellEvents;\n };\n // Each cell knows it's on hover state but this state needs to be emitted up\n // in order for the DataGrid to know which row to set the hovered state on.\n watch(\n () => shouldShowCellActions.value,\n () => {\n if (shouldShowCellActions.value === true) {\n emit('cell-hovered', props.rowIndex);\n } else {\n emit('cell-hovered', -1);\n }\n }\n );\n\n const registerMenuContainerElement = (menuContainerElement: Ref<HTMLDivElement>) => {\n childrenMenuContainerElements.value.push(menuContainerElement);\n };\n\n const menuMouseLeave = (e: MouseEvent) => {\n if (!gridcellRef.value.contains(e?.relatedTarget as Node)) {\n shouldShowCellActions.value = false;\n }\n };\n\n provide<DataGridCellRegisterMenu>(DATA_GRID_CELL_MENU_REGISTERING_INJECTION_KEY, {\n registerMenuContainerElement,\n menuMouseLeave,\n });\n\n // Styling\n const conditionalRowCellClasses = (column: BentoColumn) => ({\n [`b-data-grid-cell--${DataGridCellPropClass.COLUMN_HOVERED}`]:\n column?.field === props.hoveredOverColumnState.hoveredOverColumnField,\n [`b-data-grid-cell--${DataGridCellPropClass.COLUMN_HOVERED_NO_BORDER_LEFT}`]:\n column?.field === props.hoveredOverColumnState.hoveredOverColumnField &&\n props.hoveredOverColumnState.noBorderLeft,\n [`b-data-grid-cell--${DataGridCellPropClass.COLUMN_HOVERED_NO_BORDER_RIGHT}`]:\n column?.field === props.hoveredOverColumnState.hoveredOverColumnField &&\n props.hoveredOverColumnState.noBorderRight,\n [`b-data-grid-cell--${DataGridCellPropClass.PADDING_LEFT_UNSET}`]: column?.padding?.left === false,\n [`b-data-grid-cell--${DataGridCellPropClass.PADDING_RIGHT_UNSET}`]: column?.padding?.right === false,\n [`b-data-grid-cell--${DataGridCellPropClass.NUMERIC}`]: column?.numeric,\n [`b-data-grid-cell--${DataGridCellPropClass.CONDENSED}`]: props.condensed,\n [`b-data-grid-cell--${DataGridCellPropClass.OVERFLOW_ELLIPSIS}`]:\n column?.overflow === BentoColumnOverflow.ELLIPSIS,\n [`b-data-grid-cell--${DataGridCellPropClass.IS_COLUMN_REORDERING}`]:\n props.draggingColumns.dragging?.field === column.field,\n [`b-data-grid-cell--${DataGridCellPropClass.IS_COLUMN_REORDERING_TARGET_LEFT}`]:\n props.draggingColumns.target?.field === column.field && props.draggingColumns?.dragToLeft,\n [`b-data-grid-cell--${DataGridCellPropClass.IS_COLUMN_REORDERING_TARGET_RIGHT}`]:\n props.draggingColumns.target?.field === column.field && !props.draggingColumns?.dragToLeft,\n [`b-data-grid-cell--${DataGridCellPropClass.FROZEN}`]: column?.frozen,\n });\n\n // Exposed refs\n defineExpose({\n gridcellRef,\n });\n</script>\n\n<script lang=\"ts\">\n /**\n * Internal component to display the BentoDataGrid cells.\n *\n * The component can also render the selecting row checkbox as well as cell actions.\n *\n * @example\n * <data-grid-cell\n *\n * />\n */\n export default {\n i18n: { messages },\n name: 'data-grid-cell',\n };\n</script>\n\n<style lang=\"scss\" scoped src=\"./data-grid-cell.scss\" />\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><g :clip-path=\"'url(#uia-icons-16-warning_circle_fill__a' + uuid + ')'\"><path fill=\"#00112C\" d=\"M0.25 8C0.25 3.71979 3.71979 0.25 8 0.25C12.2802 0.25 15.75 3.71979 15.75 8C15.75 12.2802 12.2802 15.75 8 15.75C3.71979 15.75 0.25 12.2802 0.25 8ZM8.75 8.75V4.25H7.25V8.75H8.75ZM8 11.5C8.41421 11.5 8.75 11.1642 8.75 10.75C8.75 10.3358 8.41421 10 8 10C7.58579 10 7.25 10.3358 7.25 10.75C7.25 11.1642 7.58579 11.5 8 11.5Z\"/></g><defs><clipPath :id=\"'uia-icons-16-warning_circle_fill__a' + uuid\"><rect width=\"16\" height=\"16\" fill=\"#fff\"/></clipPath></defs></svg>\n</template>\n<script>\n let uuid = 0;\n\n export default {\n beforeCreate() {\n this.uuid = uuid.toString();\n uuid += 1;\n },\n };\n</script>\n<style>\n @import '../css/main.css';\n</style>\n","<template>\n <div\n v-bento-tooltip-directive:[tooltipPosition]=\"tooltipText\"\n :aria-label=\"tooltipText\"\n class=\"b-data-grid-static-icon\"\n :class=\"conditionalClasses\"\n tabindex=\"0\"\n >\n <component :is=\"computedIcon\" :class=\"computedIconClass\" :svg-title=\"tooltipText\" />\n </div>\n</template>\n\n<script setup lang=\"ts\">\n import { computed } from 'vue';\n import CheckmarkIcon from '@adyen/ui-assets-icons-16/vue/checkmark-circle-fill';\n import WarningIcon from '@adyen/ui-assets-icons-16/vue/warning-filled';\n import ErrorIcon from '@adyen/ui-assets-icons-16/vue/warning-circle-fill';\n import CrossIcon from '@adyen/ui-assets-icons-16/vue/cross';\n import NoValueIcon from '@adyen/ui-assets-icons-16/vue/minus-small';\n import { BentoTooltipDirective as vBentoTooltipDirective } from '@/directives';\n import { PopperContainerPosition } from '@/components/popper-container';\n import { BentoDataGridStaticIconVariant } from './data-grid-static-icon.types';\n\n const props = withDefaults(\n defineProps<{\n /**\n * Renderes the icon with color.\n */\n colored?: boolean;\n\n /**\n * The text displaying in the tooltip.\n */\n tooltipText: string;\n\n /**\n * The variant of the icon.\n */\n variant?: BentoDataGridStaticIconVariant;\n }>(),\n {\n variant: 'no-value',\n colored: false,\n }\n );\n\n const computedIcon = computed(() => {\n switch (props.variant) {\n case 'checkmark':\n return CheckmarkIcon;\n case 'warning':\n return WarningIcon;\n case 'error':\n return ErrorIcon;\n case 'cross':\n return CrossIcon;\n case 'no-value':\n return NoValueIcon;\n default:\n return NoValueIcon;\n }\n });\n\n const conditionalClasses = computed(() => ({\n [`b-data-grid-static-icon--colored`]: props.colored && props.variant !== 'no-value',\n }));\n\n const computedIconClass = computed(() => `b-data-grid-static-icon__${props.variant}`);\n\n const tooltipPosition = computed(() => PopperContainerPosition.AUTO);\n</script>\n\n<script lang=\"ts\">\n /**\n * The bento-data-grid-static-icon is an icon component with an associated toltip to be used within cellls of the bento-data-grid\n *\n * @example\n * import { BentoDataGridStaticIcon } from '@adyen/bento-vue2';\n *\n * export default {\n * components: { BentoDataGridStaticIcon },\n * template: `\n * <bento-data-grid-static-icon variant=\"warning\" text=\"Your tooltip text\" />\n * `\n * }\n */\n export default {};\n</script>\n\n<style lang=\"scss\" scoped src=\"./data-grid-static-icon.scss\" />\n","<template>\n <div\n class=\"b-data-grid\"\n role=\"grid\"\n :class=\"conditionalGridClasses\"\n :aria-rowcount=\"data.length\"\n :aria-colcount=\"columns.length\"\n :aria-label=\"ariaGridHeaderText\"\n >\n <div\n v-if=\"filters\"\n ref=\"filtersRef\"\n class=\"b-data-grid__filters\"\n :style=\"{ top: computedStickyFiltersTopPosition }\"\n >\n <bento-filter-bar\n v-if=\"filters\"\n ref=\"filterBarRef\"\n :config=\"filters\"\n :filter-values=\"filterValues\"\n :search-term=\"filterSearchTerm\"\n @search-input=\"onSearchTermInput\"\n @search-clear=\"onSearchTermCleared\"\n @input=\"filters => $emit(BentoDatagridEvent.UPDATE_FILTERS, filters)\"\n @update:filter-values=\"filterValues => $emit(BentoDatagridEvent.UPDATE_FILTER_VALUES, filterValues)\"\n />\n </div>\n <div v-if=\"$slots.header\" class=\"b-data-grid__header\">\n <slot name=\"header\"></slot>\n </div>\n <div class=\"b-data-grid__column-headers\" :style=\"{ top: computedColumnHeadersTopPosition }\">\n <bento-data-grid-config-settings\n v-if=\"columnPanel\"\n class=\"b-data-grid__config-settings\"\n :columns=\"localColumnsState\"\n :condensed=\"condensed\"\n @config-settings=\"onConfigSettingsUpdate\"\n @update:columns=\"onConfigSettingsColumnsUpdate\"\n />\n <div\n ref=\"columnsRef\"\n role=\"rowgroup\"\n class=\"b-data-grid__columns-row\"\n :tabindex=\"computedColumnsTabIndex\"\n @scroll=\"updateScrollPosition\"\n >\n <div :style=\"gridColumnWidthStyle\" class=\"b-data-grid__columns\" role=\"row\">\n <template v-for=\"({ columnSet, id, isFrozenColumns }, index) of columnSets\">\n <data-grid-columns\n v-if=\"columnSet?.length\"\n :key=\"`data-grid-columns-${id}`\"\n :ref=\"el => registerColumnHeaderRefs(el)\"\n :columns=\"columnSet\"\n :has-resizable-columns=\"hasResizableColumns\"\n :sort-by=\"sortBy\"\n :all-items-selected-state=\"allItemsSelectedState\"\n :is-frozen-columns=\"isFrozenColumns\"\n :show-frozen-columns-separator=\"showFrozenColumnsSeparator\"\n :dragging-columns=\"draggingColumns\"\n :has-draggable-columns=\"allowColumnDragAndDrop\"\n :has-column-panel=\"columnPanel\"\n :has-left-overflow=\"hasLeftOverflow\"\n :has-first-column-panel-right-aligned=\"index === computedColumnPanelAlignment\"\n :hovered-over-column-state=\"hoveredOverColumnState\"\n :is-measuring-column-widths=\"isMeasuringColumnWidths\"\n :is-only-one-visible-column=\"isOnlyOneVisibleColumn\"\n :selectable-across-pages=\"selectableAcrossPagesComputed\"\n :truncate-column-headers=\"truncateColumnHeaders\"\n v-on=\"draggingEventsForColumns\"\n @column-hover=\"hoveredOverColumn = $event\"\n @column-move=\"onMoveColumnByOffset\"\n @column-update=\"onConfigSettingsColumnUpdate\"\n @column-resize=\"onColumnResized\"\n @column-resizing=\"onColumnWidthOverride\"\n @select-all-rows=\"onAllRowSelect\"\n @select-all-across-pages=\"emit(BentoDatagridEvent.SELECT_ALL_ACROSS_PAGES)\"\n @sort=\"onSort\"\n >\n <template v-for=\"(_, innerSlot) of slots\" #[innerSlot]=\"scope\">\n <slot :name=\"innerSlot\" v-bind=\"scope\" />\n </template>\n </data-grid-columns>\n </template>\n </div>\n </div>\n </div>\n <div\n ref=\"body\"\n data-testid=\"data-grid-body\"\n class=\"b-data-grid__body\"\n :tabindex=\"loading ? '0' : '-1'\"\n :aria-busy=\"loading\"\n aria-live=\"polite\"\n @scroll=\"updateScrollPosition\"\n >\n <div v-if=\"loading && !isLazyLoad\" class=\"b-data-grid__loading\">\n <bento-loading-indicator class=\"b-data-grid__loading-indicator\" large />\n <bento-typography el=\"span\" variant=\"caption\">{{ t('gettingYourData') }}</bento-typography>\n </div>\n <div v-else-if=\"data?.length === 0 && emptyState\" class=\"b-data-grid__empty-state\">\n <bento-empty-state v-bind=\"limitedEmptyStateProps\" />\n </div>\n <div v-else class=\"b-data-grid__rows\" role=\"rowgroup\" @keydown=\"navigationInput\">\n <div\n v-for=\"(rowData, rowIndex) in data\"\n :key=\"rowIndex\"\n :style=\"gridColumnWidthStyle\"\n class=\"b-data-grid__row\"\n :class=\"conditionalRowClasses(rowData, rowIndex)\"\n role=\"row\"\n :aria-rowindex=\"rowIndex + 1\"\n :aria-selected=\"getRowAriaSelectedValue(rowData)\"\n @click=\"onRowClick(rowData, $event)\"\n >\n <template v-for=\"({ columnSet, id, isFrozenColumns }, columnSetIndex) of columnSets\">\n <div\n v-if=\"columnSet?.length\"\n :key=\"`data-grid-rows-${id}`\"\n class=\"b-data-grid__cells\"\n :class=\"conditionalRowSetClasses(isFrozenColumns)\"\n :data-testid=\"`data-grid-${id}-rows`\"\n >\n <data-grid-cell\n v-for=\"(column, colIndex) in columnSet\"\n :key=\"`cell-${column.field}`\"\n :ref=\"el => registerRowCellRef(el, column.field, rowIndex)\"\n :column=\"column\"\n :column-set-index=\"columnSetIndex\"\n :col-index=\"colIndex\"\n :column-sets=\"columnSets\"\n :condensed=\"condensed\"\n :dragging-columns=\"draggingColumns\"\n :dragging-events-for-row-cell=\"draggingEventsForRowCell\"\n :get-data-item-id=\"getDataItemId\"\n :hovered-over-column-state=\"hoveredOverColumnState\"\n :is-data-item-disabled=\"isDataItemDisabled\"\n :is-measuring-column-widths=\"isMeasuringColumnWidths\"\n :row-data=\"rowData\"\n :row-index=\"rowIndex\"\n :selected-items=\"selectedItems\"\n @cell-hover=\"columnField => (hoveredOverColumn = columnField)\"\n @on-frozen-columns-key-press=\"updateScrollPositionOnFrozenColumnsNavigation\"\n @select-row=\"onRowSelect\"\n @cell-hovered=\"onCellHover\"\n >\n <template v-for=\"(_, innerSlot) of slots\" #[innerSlot]=\"scope\">\n <slot :name=\"innerSlot\" v-bind=\"scope\" />\n </template>\n </data-grid-cell>\n </div>\n </template>\n </div>\n </div>\n </div>\n <data-grid-lazy-load\n v-if=\"isLazyLoad\"\n :loading=\"loading\"\n :is-infinite-scroll=\"isInfiniteScroll\"\n @update:show-more=\"emitLazyLoadEvent\"\n />\n <div\n v-if=\"pagination && !isLazyLoad\"\n data-testid=\"pagination-container\"\n class=\"b-data-grid__pagination\"\n :class=\"conditionalPaginationClasses\"\n >\n <bento-pagination\n v-bind=\"pagination\"\n :aria-label=\"`${ariaGridHeaderText} navigation`\"\n @navigate=\"onPaginationNavigate\"\n @items-page=\"onItemsPerPageChange\"\n />\n </div>\n <div v-if=\"$slots.footer\" class=\"b-data-grid__footer\"><slot name=\"footer\"></slot></div>\n <bento-action-bar\n v-if=\"showActionBar\"\n :actions=\"bulkActions\"\n :item-counter=\"itemsSelectedCounter\"\n :extra-bottom-spacing=\"stickyPagination\"\n @close=\"onAllRowSelect(false)\"\n />\n </div>\n</template>\n\n<script lang=\"ts\" setup>\n import { ComponentPublicInstance, computed, inject, PropType, ref, toRef, toRefs, useSlots } from 'vue';\n\n // Components\n import { BentoActionBar } from '@/components/action-bar';\n import { BentoPagination } from '@/components/pagination';\n import { BentoLoadingIndicator } from '@/components/loading-indicator';\n import { BentoTypography } from '@/components/typography';\n import { BentoDataGridConfigSettings, DataGridCell, DataGridColumns, DataGridLazyLoad } from './components';\n\n // Composables\n import {\n useCalculateColumnWidth,\n useCalculateStickyElementHeight,\n useColumnHovering,\n useColumnReorderer,\n useConfigSettings,\n useKeyboardNavigator,\n useLazyLoading,\n useScroller,\n useSelector,\n } from './composables';\n\n // Utils\n import { useAriaLabel } from '@/utils/ts/aria-label';\n import { getSlotText } from '@/utils/ts/get-slot-text';\n import { useI18n } from '@/utils/ts/i18n';\n import { printDevelopmentWarning } from '@/utils/ts/print-development-warning';\n\n // Types\n import {\n BentoColumn,\n BentoDatagridData,\n BentoDatagridDataItem,\n BentoDatagridDataItemId,\n BentoDatagridEmptyStateProps,\n BentoDatagridEvent,\n BentoDatagridGetDataItemIdFn,\n BentoDatagridIsDataItemDisabledFn,\n BentoDatagridPaginationProps,\n BentoDatagridSortByColumn,\n BentoDatagridStyleState,\n } from './data-grid.types';\n import { BentoTabProvidedTitle } from '../tabs/components/tab.types';\n import { BentoDataGridTemplateDataGrid } from '@/templates/data-grid-template/data-grid-template.types';\n import { BentoLazyLoadType, Booleanish } from '@/types';\n import type { BentoButtonActionsList } from '@/components/button';\n\n import { BentoEmptyState } from '@/components/empty-state';\n import BentoFilterBar from '@/components/filter-bar/filter-bar.vue';\n\n // Keys\n import { EXTERNAL_TITLE_REGISTER_ENTRY_INJECTION_KEY } from '@/components/tabs/tabs.keys';\n import { DATA_GRID_REGISTER_TEMPLATE_INJECTION_KEY } from '@/templates/data-grid-template/data-grid-template.keys';\n\n // Translations\n import messages from './messages.json';\n import { DatagridColumnsHeaderReferences } from '@/components/data-grid/components/data-grid-columns/data-grid-columns.types';\n\n type MessageSchema = (typeof messages)['en-US'];\n\n const props = defineProps({\n /**\n * When true, will emit a 'rowClick' event when a row is clicked. Will add cursor: pointer to rows.\n */\n allowRowClicks: { type: Boolean, default: false },\n\n /**\n * When true, column headers will become draggable, allowing users to rearrange columns.\n */\n allowColumnDragAndDrop: { type: Boolean, default: true },\n\n /**\n * List of actions that will be rendered in the action bar when user selects items.\n *\n * Each object in the list should have a `title`, an `event` and,\n * optionally, an `icon`.\n *\n * The component will display 4 actions and the hide the rest inside a menu.\n *\n * @see BentoButton for a list of all the other props supported by each button action.\n */\n bulkActions: {\n type: Array as PropType<BentoButtonActionsList>,\n default: null,\n },\n\n /**\n * Sets the row cells to the condensed padding state.\n */\n condensed: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Column definitions using 'key' to relate to data object.\n */\n columns: {\n type: Array as PropType<BentoColumn[]>,\n required: true,\n },\n\n /**\n * Enables / hides the display options panel and the column contextual menu functionality.\n */\n columnPanel: { type: Boolean, default: false },\n\n /**\n * An array of data objects to display.\n */\n data: {\n type: Array as PropType<BentoDatagridData>,\n required: true,\n },\n\n /**\n * Empty state props that will be passed down to inner empty-state component\n */\n emptyState: {\n type: Object as PropType<BentoDatagridEmptyStateProps>,\n default: undefined,\n },\n\n /**\n * filter-bar value (i.e. filters) that will be passed down to inner filter-bar component\n * {@see BentoFilterBarModel}\n */\n filters: {\n type: BentoFilterBar.props.value.type,\n default: undefined,\n },\n\n /**\n * An array of the values for each filter set in `value`.\n * {@see BentoFilterValues}\n */\n filterValues: {\n type: BentoFilterBar.props.filterValues.type,\n default: () => [],\n },\n\n /**\n * Filter bar search term useful to filter all the data by text\n */\n filterSearchTerm: {\n type: BentoFilterBar.props.searchTerm.type,\n default: undefined,\n },\n\n /**\n * Allows the grid to be rendered inside a confined space.\n */\n fitContent: { type: Boolean, default: false },\n\n /**\n * A customisable method to retrieve a unique identifier for a data item in the array of data supplied.\n * This is used selecting and performance reasons and must exist in each data item.\n */\n getDataItemId: {\n type: Function as PropType<BentoDatagridGetDataItemIdFn>,\n default: (item: BentoDatagridDataItem) => item.id,\n },\n\n /**\n * If resize is enabled\n */\n hasResizableColumns: {\n type: Boolean,\n default: true,\n },\n\n /**\n * A customisable method to determine if a row is not selectable.\n * The default is that every row is selectable.\n */\n isDataItemDisabled: {\n type: Function as PropType<BentoDatagridIsDataItemDisabledFn>,\n default: () => false,\n },\n\n /**\n * The type of `Lazy Load`.\n * Type \"automatic\" will enable infinite scrolling\n * Type \"button\" will enable lazy loading with \"Show more\" button\n * @values automatic, button, none\n */\n lazyLoadType: {\n type: String as PropType<BentoLazyLoadType>,\n default: 'none',\n validator: (value: BentoLazyLoadType) => ['automatic', 'button', 'none'].includes(value),\n },\n\n /**\n * If the loading indicator should be shown.\n */\n loading: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Enables / Disables the table's surrounding border.\n */\n outline: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Pagination props that will be passed down to inner pagination component\n */\n pagination: {\n type: Object as PropType<BentoDatagridPaginationProps>,\n default: undefined,\n },\n\n /**\n * Adds an extra option when selecting all items that allows user to select items in other pages too.\n */\n selectableAcrossPages: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Make pagination stick to the bottom of the page when the data-grid is bigger than the screen.\n * Because styles have to be applied to pagination container element, this has to be a data-grid prop (rather than a pagination prop).\n */\n stickyPagination: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Make data-grid filters stick to the top of the page along with the data-grid headers.\n * Defaults to true.\n */\n stickyFilters: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Enables / Disables rows to be selected via a checkbox. On select the \"select\" event will be emitted.\n */\n selectable: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Selected items\n */\n selection: {\n type: Array as PropType<BentoDatagridDataItemId[]>,\n default: () => [],\n },\n\n /**\n * Highlighted items\n */\n highlightedRows: {\n type: Array as PropType<BentoDatagridDataItemId[]>,\n default: () => [],\n },\n\n /**\n * Renders the data grid with no top spacing, to render inside containers that already have spacing\n */\n noSpacingTop: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Sortby handles proper rendering of sort icon in header. Sorting currently is only supported server side.\n * It does make sure the currently sorted column has a more visible sort icon, and the sort icon points in the right direction.\n */\n sortBy: {\n type: Array as PropType<BentoDatagridSortByColumn[]>, // NOTE: is an array to allow multi-sorting in the future\n default: () => [],\n },\n /**\n * Title of the data grid to be rendered as tab title when a data grid is passed in a tab layout.\n */\n tabTitle: {\n type: String,\n default: null,\n },\n\n /**\n * Truncates all data grid column headers\n */\n truncateColumnHeaders: {\n type: Boolean,\n default: false,\n },\n });\n\n const slots = useSlots();\n\n /* == Variables and references == */\n // Create refs for elements\n const body = ref<HTMLDivElement>(null);\n const columnsRef = ref<HTMLDivElement>();\n const columnHeaderRefs = ref<DatagridColumnsHeaderReferences>({});\n const gridcellRefs = ref<{ [key: string]: HTMLDivElement[] }>(null);\n const filtersRef = ref<HTMLDivElement>(null);\n const filterBarRef = ref<InstanceType<typeof BentoFilterBar>>();\n const verticalScrollPositionRef = ref(null);\n const {\n allowColumnDragAndDrop,\n columns,\n columnPanel,\n data,\n lazyLoadType,\n selectable,\n selection,\n loading,\n selectableAcrossPages,\n outline,\n } = toRefs(props);\n const hoveredRowIndex = ref(-1);\n\n const { t } = useI18n<{ message: MessageSchema }>({ messages });\n const frozenColumnsLength = computed(() => columnDefs.value.filter(column => column.frozen).length);\n\n /* == Data-grid template == */\n const registerDatagridInDataGridTemplate: BentoDataGridTemplateDataGrid = inject(\n DATA_GRID_REGISTER_TEMPLATE_INJECTION_KEY,\n () => ({\n isDataGridTemplate: false,\n stickyTabs: ref(false),\n tabsRef: ref(null),\n })\n );\n const { isDataGridTemplate, stickyTabs, tabsRef } = registerDatagridInDataGridTemplate();\n const computedColumnsTabIndex = computed(() => (props.fitContent || isDataGridTemplate ? 0 : null));\n\n /* == Composable logic == */\n // Column width calculation\n const {\n columnDefs,\n onColumnWidthOverride,\n gridColumnWidthStyle,\n isMeasuringColumnWidths,\n isTotalWidthOfColumnsTakingUpAllAvailableGridWidth,\n columns: localColumnsState,\n } = useCalculateColumnWidth(columns, data, body, columnHeaderRefs, gridcellRefs, {\n hasColumnPanel: columnPanel,\n hasSelectableColumn: selectable,\n hasSelectableAcrossPages: selectableAcrossPages,\n });\n\n /* == Emitting logic == */\n const definedEmitsFunction = defineEmits([\n BentoDatagridEvent.COLUMNS,\n BentoDatagridEvent.COLUMN_RESIZE,\n BentoDatagridEvent.ITEMS_PAGE,\n BentoDatagridEvent.FILTER_SEARCH_INPUT,\n BentoDatagridEvent.FILTER_SEARCH_CLEAR,\n BentoDatagridEvent.NAVIGATE,\n BentoDatagridEvent.UPDATE_COLUMNS,\n BentoDatagridEvent.UPDATE_CONDENSED,\n BentoDatagridEvent.UPDATE_FILTER_VALUES,\n BentoDatagridEvent.UPDATE_FILTERS,\n BentoDatagridEvent.UPDATE_FILTER_SEARCH_TERM,\n BentoDatagridEvent.UPDATE_SHOW_MORE,\n BentoDatagridEvent.UPDATE_PAGINATION,\n BentoDatagridEvent.UPDATE_SELECTION,\n BentoDatagridEvent.UPDATE_SORT_BY,\n BentoDatagridEvent.ROW_CLICK,\n BentoDatagridEvent.SELECT,\n BentoDatagridEvent.SELECT_ALL_ACROSS_PAGES,\n BentoDatagridEvent.SORT,\n ]);\n\n /**\n * Hooks into the emit function and updates the local columns state if we're updating columns.\n * This is so if users use a computed ref with the columns property the ordering / toggling visibility will still function correctly.\n */\n const emit: typeof definedEmitsFunction = (event, ...args) => {\n // If we updating columns update the local columns state\n if (event === BentoDatagridEvent.COLUMNS || event === BentoDatagridEvent.UPDATE_COLUMNS) {\n [localColumnsState.value] = args;\n }\n definedEmitsFunction(event, ...args);\n };\n\n // Calculate dynamic top position of sticky filters\n const stickyFiltersHeight = useCalculateStickyElementHeight(tabsRef, stickyTabs);\n const computedStickyFiltersTopPosition = computed(() =>\n props.stickyFilters ? `${stickyFiltersHeight.value}px` : null\n );\n // Calculate dynamic top position of column headers\n const columnHeadersHeight = useCalculateStickyElementHeight(filtersRef, toRef(props, 'stickyFilters'));\n const computedColumnHeadersTopPosition = computed(\n () => `${columnHeadersHeight.value + stickyFiltersHeight.value}px`\n );\n\n // Config Settings (condensed, visbility and freezing settings)\n const {\n sortedColumns,\n columnSets,\n isOnlyOneVisibleColumn,\n onConfigSettingsUpdate,\n onConfigSettingsColumnsUpdate,\n onConfigSettingsColumnUpdate,\n } = useConfigSettings(columnDefs, emit);\n\n // Column hovering\n const { hoveredOverColumn, hoveredOverColumnState } = useColumnHovering(\n columnSets,\n selectable,\n outline,\n isTotalWidthOfColumnsTakingUpAllAvailableGridWidth\n );\n\n // Re-ordering column (dragging)\n const { draggingColumns, draggingEventsForColumns, draggingEventsForRowCell, onMoveColumnByOffset } =\n useColumnReorderer(sortedColumns, allowColumnDragAndDrop, emit);\n\n // Selecting\n const { onAllRowSelect, onRowSelect, selectedItems, allItemsSelectedState } = useSelector(\n selection,\n emit,\n data,\n props.getDataItemId,\n props.isDataItemDisabled\n );\n\n // Keyboard navigation\n const { navigationInput } = useKeyboardNavigator(gridcellRefs, columns, selectable);\n\n // Lazy loading\n const { isLazyLoad, isInfiniteScroll, verticalScrollPosition, emitLazyLoadEvent } = useLazyLoading(\n lazyLoadType,\n verticalScrollPositionRef,\n body,\n loading,\n emit\n );\n\n // Scrolling\n const { updateScrollPosition, updateScrollPositionOnFrozenColumnsNavigation, hasLeftOverflow, hasRightOverflow } =\n useScroller(body, columnsRef, verticalScrollPosition);\n\n /* == Empty State == */\n const onEmptyStateClearResetButtonClick = () => {\n if (filterBarRef.value.isClearAllVisible) {\n filterBarRef.value.clearAllFilters();\n } else if (filterBarRef.value.isResetAllVisible) {\n filterBarRef.value.resetAllFilters();\n }\n };\n const limitedEmptyStateProps = computed<BentoDatagridEmptyStateProps>(() => ({\n ...props.emptyState,\n variant:\n props.emptyState?.variant === 'embedded' || props.emptyState?.variant === 'basic'\n ? props.emptyState.variant\n : 'basic',\n }));\n\n /* == Styles == */\n // Conditional grid classes\n const conditionalGridClasses = computed(() => ({\n [`b-data-grid--${BentoDatagridStyleState.OUTLINE}`]: props.outline,\n [`b-data-grid--${BentoDatagridStyleState.SCROLL}`]: props.fitContent || isLazyLoad.value,\n [`b-data-grid--${BentoDatagridStyleState.STICKY_FILTERS}`]: props.filters && props.stickyFilters,\n [`b-data-grid--${BentoDatagridStyleState.OVERFLOW_SHADOW_LEFT}`]:\n hasLeftOverflow.value && !frozenColumnsLength.value,\n [`b-data-grid--${BentoDatagridStyleState.OVERFLOW_SHADOW_RIGHT}`]: hasRightOverflow.value,\n [`b-data-grid--${BentoDatagridStyleState.NO_SPACING_TOP}`]: props.noSpacingTop,\n }));\n\n const computedColumnPanelAlignment = computed(() => columnSets.value.findIndex(el => el.columnSet.length));\n\n // Conditional row classes\n const conditionalRowClasses = (row: BentoDatagridDataItem, rowIndex: number) => ({\n 'b-data-grid__row--disabled': props.isDataItemDisabled(row),\n 'b-data-grid__row--row-clicks-enabled': props.allowRowClicks,\n 'b-data-grid__cell--is-re-ordering': draggingColumns.target?.field !== undefined,\n 'b-data-grid__row--highlighted':\n props.highlightedRows.includes(props.getDataItemId(row)) ||\n selectedItems.value.includes(props.getDataItemId(row)),\n 'b-data-grid__row--hovered': hoveredRowIndex.value === rowIndex,\n });\n\n const showFrozenColumnsSeparator = computed(() => {\n const isSelectionOnlyFrozenColumn = props.selectable && frozenColumnsLength.value === 1;\n return !isSelectionOnlyFrozenColumn || hasLeftOverflow.value;\n });\n\n const conditionalRowSetClasses = (isFrozenRowSet: boolean) => ({\n 'b-data-grid__row-cell-set--frozen': isFrozenRowSet,\n [`b-data-grid__row-cell-set--${BentoDatagridStyleState.OVERFLOW_SHADOW_LEFT}`]:\n isFrozenRowSet && hasLeftOverflow.value,\n 'b-data-grid__row-cell-set--frozen-separator': isFrozenRowSet && showFrozenColumnsSeparator.value,\n 'b-data-grid__row-cell-set--unfrozen': !isFrozenRowSet,\n });\n\n // Conditional pagination classes\n const conditionalPaginationClasses = computed(() => ({\n 'b-data-grid__pagination--padding-left-unset': props.columns?.[0]?.padding?.left === false,\n 'b-data-grid__pagination--padding-right-unset':\n props.columns?.[props.columns.length - 1]?.padding?.right === false,\n 'b-data-grid__pagination--sticky': !!props.stickyPagination || isDataGridTemplate,\n }));\n\n /* == Ref registration methods == */\n const registerColumnHeaderRefs = (el: Element | ComponentPublicInstance) => {\n // We always know this will be used on a DataGridColumns component so we can cast it\n const datagridColumnsComponent = el as InstanceType<typeof DataGridColumns>;\n if (el !== null && datagridColumnsComponent?.columnHeaderRefs) {\n Object.entries(datagridColumnsComponent?.columnHeaderRefs).forEach(([fieldName, colHeaderEl]) => {\n columnHeaderRefs.value[fieldName] = colHeaderEl;\n });\n }\n };\n const registerRowCellRef = (el: Element | ComponentPublicInstance, field: string, rowIndex: number) => {\n // We always know this will be used on a DataGridCell component so we can cast it\n const gridCellComponent = el as InstanceType<typeof DataGridCell>;\n if (gridcellRefs.value?.[field] === undefined) {\n gridcellRefs.value = { ...gridcellRefs.value, [field]: [] };\n }\n if (el !== null && gridCellComponent?.gridcellRef) {\n gridcellRefs.value[field][rowIndex] = gridCellComponent.gridcellRef;\n }\n };\n\n /* == Row methods == */\n // Row selecting\n const onRowClick = (row: BentoDatagridDataItem, event: MouseEvent) => {\n if (props.allowRowClicks) {\n emit(BentoDatagridEvent.ROW_CLICK, row, event);\n }\n };\n // Programmatically set the hover state on a row\n const onCellHover = (rowIndex: number) => {\n hoveredRowIndex.value = rowIndex;\n };\n\n const selectableAcrossPagesComputed = computed(() => !!props.selectableAcrossPages && !!props.pagination);\n\n /* == a11y == */\n // TODO: Fix the issue where users provide components into the slot\n const ariaGridHeaderText = useAriaLabel({\n label: slots?.header ? getSlotText(slots)('header') : null,\n defaultFallback: 'data grid',\n });\n const getRowAriaSelectedValue = (row: BentoDatagridDataItem): Booleanish => {\n if (!props.selectable) {\n return null;\n }\n\n const id = props.getDataItemId(row);\n return selectedItems.value.includes(id).toString() as Booleanish;\n };\n\n /* == Action bar == */\n const itemsSelectedCounter = computed(() => selectedItems.value?.length ?? 0);\n const showActionBar = computed(() => props.bulkActions && itemsSelectedCounter.value > 0);\n\n /* == Emits & Events == */\n // Resizing\n const onColumnResized = (resizeEvent: { field: string; width: number }) =>\n emit(BentoDatagridEvent.COLUMN_RESIZE, resizeEvent);\n // Sorting\n const onSort = (updatedSortBy: BentoDatagridSortByColumn[]) => {\n emit(BentoDatagridEvent.UPDATE_SORT_BY, updatedSortBy);\n emit(BentoDatagridEvent.SORT, updatedSortBy);\n };\n // Pagination\n const onPaginationNavigate = (page: number, size: number) => {\n emit(BentoDatagridEvent.NAVIGATE, page);\n emit(BentoDatagridEvent.UPDATE_PAGINATION, {\n ...props.pagination,\n size,\n page,\n });\n };\n const onItemsPerPageChange = (itemsPerPage: number) => {\n emit(BentoDatagridEvent.ITEMS_PAGE, itemsPerPage);\n };\n // Filter bar\n const onSearchTermCleared = () => {\n emit(BentoDatagridEvent.FILTER_SEARCH_CLEAR);\n };\n const onSearchTermInput = newSearchTerm => {\n emit(BentoDatagridEvent.UPDATE_FILTER_SEARCH_TERM, newSearchTerm);\n emit(BentoDatagridEvent.FILTER_SEARCH_INPUT, newSearchTerm);\n };\n\n /* == Warnings == */\n const hasMandatoryColumn = computed(() => columns.value.some(column => column.mandatory));\n if (!hasMandatoryColumn.value) {\n // eslint-disable-next-line no-console\n printDevelopmentWarning(\n 'WARNING: At least one BentoDataGrid column should be set as mandatory to ensure data is always displayed correctly.'\n );\n }\n\n /* == Provide/inject == */\n const setTitle: BentoTabProvidedTitle = inject(EXTERNAL_TITLE_REGISTER_ENTRY_INJECTION_KEY, () => null);\n setTitle(props.tabTitle);\n\n /* == Expose methods == */\n defineExpose({ onEmptyStateClearResetButtonClick });\n</script>\n\n<script lang=\"ts\">\n /**\n * A component to display data in columns and row format with a whole array of configuration for visualization and interaction.\n *\n * @example\n * import { BentoDataGrid } from '@adyen/bento-vue2';\n *\n * export default {\n * components: { BentoDataGrid },\n * template: `\n * <bento-data-grid\n * :data=\"[\n * { id: '123', name: 'John', company: 'TestCompany', 'payment': 200 }\n * { id: '321', name: 'Jane', company: 'Adyen', 'payment': 300 }\n * ]\"\n * :columns=\"[\n * { field: 'name', label: 'Name', minWidth: 300, mandatory: true },\n * { field: 'company', label: 'Reference' },\n * { field: 'payment', label: 'Payment', width: 200, minWidth: 150 },\n * ]\"\n * />\n * `\n * }\n */\n export default {\n i18n: { messages },\n name: 'bento-data-grid',\n };\n</script>\n\n<style lang=\"scss\" scoped src=\"./data-grid.scss\" />\n"],"names":["BentoColumnOverflow","BentoColumnOverflow2","BentoDatagridStyleState","BentoDatagridStyleState2","BentoDatagridSortDirection","BentoDatagridSortDirection2","BentoDatagridEvent","BentoDatagridEvent2","BentoDatagridAriaSortValue","BentoDatagridAriaSortValue2","DatagridColumnsEvent","DatagridColumnsEvent2","useResizer","columns","emit","columnHoverEventToEmitAfterResizing","ref","isResizing","columnWidthOverridesLookup","colKeyLookup","acc","col","columnsRefs","reactive","allColumnRefs","toRefs","stepPositionX","resizingColumnField","defaultResizedColumnWidths","computed","field","width","minWidth","watchEffect","removeMouseMoveResizeListener","removeMouseUpResizeListener","onResizeColumn","event","sizeChange","currResizingColumnField","resizedColumnWidth","stopResize","startResize","hasResizableColumns","listen","watch","newIsResizing","oldIsResizing","DEFAULT_COLUMN_WIDTH","DEFAULT_COLUMN_MIN_WIDTH","DATAGRID_SELECT_FIELD_NAME","DATAGRID_SELECT_WIDTH","DATAGRID_SELECT_WIDTH_WITH_SELECT_ALL_PAGES_ENABLED","DATAGRID_CELL_OFFSET_INITIAL","DATAGRID_CELL_OFFSET_PADDING","computeFlexColumnsWidth","initialFreeSpace","totalFlexUnits","flexCols","flexColumnsLookup","frozenColumnKeys","freezeColumn","value","processFlexItems","violationsLookup","remainingFreeSpace","flexUnits","totalViolation","i","flexColsLength","column","computedWidth","key","getElementWidthIncludingOffset","el","hasColumnPanel","offset","computedStyleOfEl","useCalculateColumnWidth","newColumns","newData","bodyRef","gridColumnsComponentRefs","gridCellRefs","options","data","body","gridColumnsComponents","gridCells","isMeasuringColumnWidths","_a","colA","colB","indexA","item","indexB","gridWidth","bodyElementObserver","onMounted","nextTick","stop","observeSizeOfElement","onUnmounted","onBeforeUpdate","calculatedWidths","widthAllocatedBeforeFlex","columnsLookup","columnDefs","invisibleColumnDefs","columnWidth","_b","fluidCol","computedColumnWidths","onColumnWidthOverride","newColumnWidthOverridesLookup","columnHeaderWidth","largestRowCellWidth","_d","_c","max","largestColumnHeaderAndRowCellWidth","processedColumns","totalWidthOfAllColumns","visible","val","isTotalWidthOfColumnsTakingUpAllAvailableGridWidth","gridColumnWidthStyle","useSelector","selection","getDataItemId","isDataItemDisabled","selectedItems","allItemsSelectedState","emitSelect","updateSelectedItems","dataItem","isEveryItemIncludingDisabledSelected","_e","onAllRowSelect","selectAllItems","onRowSelect","useSorter","sortBy","sortedCol","updatedSortBy","BentoDatagridNavigationKeyCode","BentoDatagridNavigationKeyCode2","KeyCode","useKeyboardNavigator","gridcellRefs","selectable","visibleColumnsCount","visibleColumns","sortedGridCellRefs","b","getCurrentRowIndex","currentIndex","getEdgeCellIndex","direction","ctrlKey","lastCellIndex","lastColumnIndex","currentRowIndex","currentColumn","getCellIndex","directionDiff","newCellIndex","isEdgeNavigationKeyCode","keyCode","getTargetCellIndex","target","directionKeyCode","currentCellIndex","focusOnNextGridcell","cellIndex","isNavigationKeyCode","LAZY_LOAD_BUFFER_PERCENTAGE","useLazyLoading","lazyLoadTypeRef","verticalScrollPositionRef","loading","lazyLoadType","verticalScrollPosition","isLoading","isLazyLoad","isInfiniteScroll","emitLazyLoadEvent","useColumnReorderer","columnsRef","hasDraggableColumnsRef","hasDraggableColumns","draggingColumns","onMoveColumnByOffset","movingColumn","fromIndex","c","toIndex","reorderedColumns","onDragStart","e","onDragEnter","dragEvent","targetRect","midpoint","clientX","onDrop","toIndexInitial","toLeftOfToIndex","firstUnfrozenColumn","onDragEnd","draggingEventsForColumns","draggingEventsForRowCell","useConfigSettings","sortedColumnsByFreezeState","a","frozenColumns","unfrozenColumns","columnSets","columnSet","isOnlyOneVisibleColumn","onConfigSettingsUpdate","isCondensedView","onConfigSettingsColumnsUpdate","updatedColumn","updatedColumns","useCalculateStickyElementHeight","elementRef","isSticky","topPosition","filtersElementObserver","setTopPosition","useScroller","scrollLeftPosition","hasLeftOverflow","hasRightOverflow","useColumnHovering","outline","hoveredOverColumn","hoveredOverColumnState","frozenColumnSet","colSet","unFrozenColumnSet","isFirstFrozenColumn","isFirstUnfrozenColumn","isFrozenSelectableOutlineOnFirstCol","isNoFrozenColAndNotFrozenSelectableOutlineOnFirstCol","isFrozenColumnsAndNotFrozenFirstColumn","isFrozenColumnsAndLastFrozenColumn","isOutlineOnAllColumnWidthFitContainerAndLastColumn","uuid$a","_sfc_main$i","uuid$9","_sfc_main$h","uuid$8","_sfc_main$g","uuid$7","_sfc_main$f","uuid$6","_sfc_main$e","uuid$5","_sfc_main$d","uuid$4","_sfc_main$c","uuid$3","_sfc_main$b","__default__$5","messages$5","CLOSING_CONTEXTUAL_MENU_DELAY_MS","t","useI18n","props","columnHeaderRefs","contextMenuRef","hoveredColumnField","closingTimeOutId","areAllItemsSelected","isSelectColumn","selectAllMenu","isSorting","getSortingDirection","sortByColumnField","getSortingColumnDirection","sortingDirection","draggingEventsForColumn","contextualMenuData","ArrowLeftIcon","ArrowRightIcon","BentoFreezeIcon","HideIcon","ShowIcon","showContextualMenu","hideContextualMenu","timeOutId","dataGridColumnEvents","events","hasColumnActions","registerColumnsRefs","conditionalColumnsClasses","computeMenuPosition","hasFirstColumnPanelRightAligned","index","BentoPopoverPositions","conditionalColumnClasses","columnIndex","_f","_g","_i","_h","_j","conditionalColumnHeaderAndActionsClasses","conditionalColumnActionsClasses","conditionalColumnSeparatorClasses","conditionalColumnHeaderClasses","expose","DatagridConfigSettingsEvent","DatagridConfigSettingsEvent2","uuid$2","_sfc_main$9","_sfc_main$8","defineComponent","messages$4","BentoToggle","isFreezeIconOptionShown","isColumnFrozen","isColumnVisible","toggleColumnVisibility","toggleColumnFreeze","showFreezeIcon","hideFreezeIcon","freezeIconConditionalClasses","_sfc_main$7","messages$3","BentoButton","CrossIcon","BentoPopover","BentoSettingsIcon","BentoToggleButton","BentoDataGridConfigSettingsConfigRow","BentoSearchBar","SearchIcon","BentoTypography","BentoClickOutsideDirective","configSettingsButtonRef","popoverId","generateUid","searchBarRef","isConfigSettingsPanelOpen","allColumnsVisbilityToggleState","searchButtonRef","searchTerm","toRef","isColumnVisibilityFilterShown","filteredColumnVisibilityColumns","useSearchBarFilter","clearAction","areAllNonMandatoryColumnsHidden","toggleColumnFilter","isColumnVisibilityToggleDisabled","emitVisibleColumns","toggleAllColumnVisibility","toggleState","emitFrozenColumns","setConfigSettingsPanelVisibility","isVisible","__default__$4","messages$2","uuid$1","_sfc_main$5","__default__$3","messages$1","limitedRowCellActionsProps","printDevelopmentWarning","getButtonTitle","button","isForSvgTitle","generateButtonEvents","generateMenuEvents","menuDataItem","transformMenuEvents","menuData","transformedMenuData","DataGridCellPropClass","DataGridCellPropClass2","__default__$2","messages","gridcellRef","cellActionsRef","shouldShowCellActions","childrenMenuContainerElements","conditionalTitleAttribute","content","getRowData","rowData","sumColumnAmountsInColumnSets","limitIndex","total","getColIndex","colIndex","colSetIndex","rowIndex","isLeavingCellFocus","relatedTarget","registeredMenuRef","menuElement","onMenuClose","getGridcellEvents","gridCellEvents","registerMenuContainerElement","menuContainerElement","menuMouseLeave","provide","DATA_GRID_CELL_MENU_REGISTERING_INJECTION_KEY","conditionalRowCellClasses","uuid","_sfc_main$2","__default__$1","computedIcon","CheckmarkIcon","WarningIcon","ErrorIcon","NoValueIcon","conditionalClasses","computedIconClass","tooltipPosition","PopperContainerPosition","__default__","slots","useSlots","filtersRef","filterBarRef","allowColumnDragAndDrop","columnPanel","selectableAcrossPages","hoveredRowIndex","frozenColumnsLength","registerDatagridInDataGridTemplate","inject","DATA_GRID_REGISTER_TEMPLATE_INJECTION_KEY","isDataGridTemplate","stickyTabs","tabsRef","computedColumnsTabIndex","localColumnsState","args","definedEmitsFunction","stickyFiltersHeight","computedStickyFiltersTopPosition","columnHeadersHeight","computedColumnHeadersTopPosition","sortedColumns","onConfigSettingsColumnUpdate","navigationInput","updateScrollPosition","updateScrollPositionOnFrozenColumnsNavigation","onEmptyStateClearResetButtonClick","limitedEmptyStateProps","conditionalGridClasses","computedColumnPanelAlignment","conditionalRowClasses","row","showFrozenColumnsSeparator","conditionalRowSetClasses","isFrozenRowSet","conditionalPaginationClasses","registerColumnHeaderRefs","datagridColumnsComponent","fieldName","colHeaderEl","registerRowCellRef","gridCellComponent","onRowClick","onCellHover","selectableAcrossPagesComputed","ariaGridHeaderText","useAriaLabel","getSlotText","getRowAriaSelectedValue","id","itemsSelectedCounter","showActionBar","onColumnResized","resizeEvent","onSort","onPaginationNavigate","page","size","onItemsPerPageChange","itemsPerPage","onSearchTermCleared","onSearchTermInput","newSearchTerm","hasMandatoryColumn","setTitle","EXTERNAL_TITLE_REGISTER_ENTRY_INJECTION_KEY"],"mappings":"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","x_google_ignoreList":[14,15,16,17,18,19,20,21,24,28,32]}