@adyen/bento-vue2 1.2.0 → 1.3.0

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.
Files changed (227) hide show
  1. package/README.md +60 -29
  2. package/dist/@types/components.d.ts +12 -0
  3. package/dist/@types/packages/vue2/src/components/button/components/loading-button/loading-button.vue.d.ts +3 -3
  4. package/dist/@types/packages/vue2/src/components/checkbox/components/checkbox-group/checkbox-group.vue.d.ts +76 -30
  5. package/dist/@types/packages/vue2/src/components/country/composables/index.d.ts +0 -1
  6. package/dist/@types/packages/vue2/src/components/country/country.vue.d.ts +1 -2
  7. package/dist/@types/packages/vue2/src/components/date-picker/date-picker.vue.d.ts +11 -1
  8. package/dist/@types/packages/vue2/src/components/date-range-picker/date-range-picker.vue.d.ts +11 -1
  9. package/dist/@types/packages/vue2/src/components/dropdown/components/variants/dropdown-avatar/dropdown-avatar.vue.d.ts +1 -1
  10. package/dist/@types/packages/vue2/src/components/dropdown/components/variants/dropdown-country/dropdown-country.vue.d.ts +1 -1
  11. package/dist/@types/packages/vue2/src/components/dropdown/components/variants/dropdown-currency/dropdown-currency.vue.d.ts +1 -1
  12. package/dist/@types/packages/vue2/src/components/dropdown/components/variants/dropdown-payment-method/dropdown-payment-method.vue.d.ts +1 -1
  13. package/dist/@types/packages/vue2/src/components/dropdown/components/variants/dropdown-tag/dropdown-tag.vue.d.ts +1 -1
  14. package/dist/@types/packages/vue2/src/components/dropdown/dropdown.vue.d.ts +2 -1
  15. package/dist/@types/packages/vue2/src/components/filter-bar/components/date-range-filter/date-range-filter.vue.d.ts +0 -2
  16. package/dist/@types/packages/vue2/src/components/form-layout/components/form-layout-field-tip/form-layout-field-tip.vue.d.ts +10 -0
  17. package/dist/@types/packages/vue2/src/components/form-layout/components/form-layout-field-tip/index.d.ts +1 -0
  18. package/dist/@types/packages/vue2/src/components/form-layout/components/form-layout-group/composable/use-form-layout-group-percentage.d.ts +3 -0
  19. package/dist/@types/packages/vue2/src/components/form-layout/components/form-layout-group/form-layout-group.types.d.ts +1 -0
  20. package/dist/@types/packages/vue2/src/components/form-layout/components/form-layout-group/form-layout-group.vue.d.ts +23 -0
  21. package/dist/@types/packages/vue2/src/components/form-layout/components/form-layout-group/index.d.ts +1 -0
  22. package/dist/@types/packages/vue2/src/components/form-layout/components/form-layout-title/form-layout-title.vue.d.ts +33 -0
  23. package/dist/@types/packages/vue2/src/components/form-layout/components/form-layout-title/index.d.ts +1 -0
  24. package/dist/@types/packages/vue2/src/components/form-layout/components/index.d.ts +3 -0
  25. package/dist/@types/packages/vue2/src/components/form-layout/form-layout.types.d.ts +1 -0
  26. package/dist/@types/packages/vue2/src/components/form-layout/form-layout.vue.d.ts +33 -0
  27. package/dist/@types/packages/vue2/src/components/form-layout/index.d.ts +2 -0
  28. package/dist/@types/packages/vue2/src/components/input-field/input-field.vue.d.ts +2 -1
  29. package/dist/@types/packages/vue2/src/components/internal/controls-group/controls-group.vue.d.ts +53 -22
  30. package/dist/@types/packages/vue2/src/components/modal/components/base-modal/__mocks__/base-modal.vue.d.ts +3 -3
  31. package/dist/@types/packages/vue2/src/components/modal/components/base-modal/base-modal.vue.d.ts +51 -44
  32. package/dist/@types/packages/vue2/src/components/modal/components/modal-default/modal-default.vue.d.ts +3 -3
  33. package/dist/@types/packages/vue2/src/components/modal/modal.vue.d.ts +4 -12
  34. package/dist/@types/packages/vue2/src/components/radio-group/radio-group.vue.d.ts +50 -4
  35. package/dist/@types/packages/vue2/src/components/search-bar/search-bar.vue.d.ts +2 -1
  36. package/dist/@types/packages/vue2/src/components/sidepanel/components/sidepanel-page.vue.d.ts +68 -0
  37. package/dist/@types/packages/vue2/src/components/sidepanel/index.d.ts +3 -0
  38. package/dist/@types/packages/vue2/src/components/sidepanel/sidepanel.keys.d.ts +2 -0
  39. package/dist/@types/packages/vue2/src/components/sidepanel/sidepanel.types.d.ts +21 -0
  40. package/dist/@types/packages/vue2/src/components/sidepanel/sidepanel.vue.d.ts +43 -0
  41. package/dist/@types/packages/vue2/src/components/tabs/tabs.types.d.ts +1 -1
  42. package/dist/@types/packages/vue2/src/components/textarea/textarea.vue.d.ts +2 -1
  43. package/dist/@types/packages/vue2/src/components/timeline/timeline.types.d.ts +1 -1
  44. package/dist/@types/packages/vue2/src/composables/index.d.ts +1 -0
  45. package/dist/@types/packages/vue2/src/composables/use-form-layout-loading/use-form-layout-loading.d.ts +4 -0
  46. package/dist/@types/packages/vue2/src/index.d.ts +2 -0
  47. package/dist/@types/packages/vue2/src/types/utils-events.d.ts +0 -1
  48. package/dist/@types/packages/vue2/src/utils/ts/dev-environment.d.ts +1 -0
  49. package/dist/accordion.js +1 -1
  50. package/dist/alert.js +3 -3
  51. package/dist/assets/arrow-left.css +1 -0
  52. package/dist/assets/base-button.css +1 -1
  53. package/dist/assets/button.css +1 -1
  54. package/dist/assets/calendar.css +1 -1
  55. package/dist/assets/checkbox.css +1 -1
  56. package/dist/assets/controls-group.css +1 -1
  57. package/dist/assets/copy.css +1 -1
  58. package/dist/assets/dropdown-default-textbox.css +1 -1
  59. package/dist/assets/dropdown.css +1 -1
  60. package/dist/assets/error-message.css +1 -1
  61. package/dist/assets/footer-actions.css +1 -0
  62. package/dist/assets/grid-layout.css +1 -1
  63. package/dist/assets/index.css +1 -1
  64. package/dist/assets/index10.css +1 -1
  65. package/dist/assets/index11.css +1 -1
  66. package/dist/assets/index12.css +1 -1
  67. package/dist/assets/index13.css +1 -1
  68. package/dist/assets/index14.css +1 -1
  69. package/dist/assets/index15.css +1 -1
  70. package/dist/assets/index16.css +1 -1
  71. package/dist/assets/index17.css +1 -1
  72. package/dist/assets/index18.css +1 -1
  73. package/dist/assets/index19.css +1 -1
  74. package/dist/assets/index2.css +1 -1
  75. package/dist/assets/index20.css +1 -1
  76. package/dist/assets/index21.css +1 -1
  77. package/dist/assets/index22.css +1 -1
  78. package/dist/assets/index23.css +1 -1
  79. package/dist/assets/index24.css +1 -1
  80. package/dist/assets/index25.css +1 -1
  81. package/dist/assets/index26.css +1 -1
  82. package/dist/assets/index27.css +1 -1
  83. package/dist/assets/index28.css +1 -1
  84. package/dist/assets/index29.css +1 -1
  85. package/dist/assets/index3.css +1 -1
  86. package/dist/assets/index30.css +1 -1
  87. package/dist/assets/index31.css +1 -1
  88. package/dist/assets/index32.css +1 -1
  89. package/dist/assets/index33.css +1 -1
  90. package/dist/assets/index34.css +1 -1
  91. package/dist/assets/index35.css +1 -1
  92. package/dist/assets/index36.css +1 -1
  93. package/dist/assets/index37.css +1 -1
  94. package/dist/assets/index38.css +1 -1
  95. package/dist/assets/index39.css +1 -1
  96. package/dist/assets/index4.css +1 -1
  97. package/dist/assets/index40.css +1 -0
  98. package/dist/assets/index41.css +1 -0
  99. package/dist/assets/index5.css +1 -1
  100. package/dist/assets/index6.css +1 -1
  101. package/dist/assets/index7.css +1 -1
  102. package/dist/assets/index8.css +1 -1
  103. package/dist/assets/index9.css +1 -1
  104. package/dist/assets/listbox-option-tag.css +1 -1
  105. package/dist/assets/listbox.css +1 -1
  106. package/dist/assets/loading-button.css +1 -1
  107. package/dist/assets/tooltip.css +1 -1
  108. package/dist/avatar-image.js +1 -1
  109. package/dist/badge.js +1 -1
  110. package/dist/button.js +3 -3
  111. package/dist/card.js +3 -3
  112. package/dist/checkbox.js +93 -84
  113. package/dist/checkbox.js.map +1 -1
  114. package/dist/chunks/arrow-left.1d5d08bd.js +26 -0
  115. package/dist/chunks/arrow-left.1d5d08bd.js.map +1 -0
  116. package/dist/chunks/{base-button.d4487ac9.js → base-button.98379576.js} +2 -2
  117. package/dist/chunks/{base-button.d4487ac9.js.map → base-button.98379576.js.map} +1 -1
  118. package/dist/chunks/{button-actions.cf73ed47.js → button-actions.bd397c79.js} +2 -2
  119. package/dist/chunks/{button-actions.cf73ed47.js.map → button-actions.bd397c79.js.map} +1 -1
  120. package/dist/chunks/{button.c27a7ce2.js → button.d0c9527d.js} +2 -2
  121. package/dist/chunks/{button.c27a7ce2.js.map → button.d0c9527d.js.map} +1 -1
  122. package/dist/chunks/{calendar.8f50a65a.js → calendar.0ae43a96.js} +6 -6
  123. package/dist/chunks/calendar.0ae43a96.js.map +1 -0
  124. package/dist/chunks/{checkbox.c06daf12.js → checkbox.f8457c93.js} +3 -3
  125. package/dist/chunks/{checkbox.c06daf12.js.map → checkbox.f8457c93.js.map} +1 -1
  126. package/dist/chunks/controls-group.b827382b.js +87 -0
  127. package/dist/chunks/controls-group.b827382b.js.map +1 -0
  128. package/dist/chunks/{copy.b62beae5.js → copy.5a4cbd4d.js} +3 -3
  129. package/dist/chunks/{copy.b62beae5.js.map → copy.5a4cbd4d.js.map} +1 -1
  130. package/dist/chunks/{dropdown-default-textbox.a5eca928.js → dropdown-default-textbox.819e43f7.js} +32 -30
  131. package/dist/chunks/dropdown-default-textbox.819e43f7.js.map +1 -0
  132. package/dist/chunks/{dropdown.368486b1.js → dropdown.c05678d0.js} +142 -139
  133. package/dist/chunks/dropdown.c05678d0.js.map +1 -0
  134. package/dist/chunks/{error-message.a581a172.js → error-message.0433b539.js} +2 -2
  135. package/dist/chunks/{error-message.a581a172.js.map → error-message.0433b539.js.map} +1 -1
  136. package/dist/chunks/footer-actions.67642347.js +98 -0
  137. package/dist/chunks/footer-actions.67642347.js.map +1 -0
  138. package/dist/chunks/form-layout.types.a7a1438d.js +5 -0
  139. package/dist/chunks/form-layout.types.a7a1438d.js.map +1 -0
  140. package/dist/chunks/{index.3b6fc08a.js → index.0cf00b47.js} +6 -6
  141. package/dist/chunks/{index.3b6fc08a.js.map → index.0cf00b47.js.map} +1 -1
  142. package/dist/chunks/{index.f0d99471.js → index.10aaf539.js} +198 -192
  143. package/dist/chunks/{index.f0d99471.js.map → index.10aaf539.js.map} +1 -1
  144. package/dist/chunks/{index.ad39b625.js → index.133e4da0.js} +2 -2
  145. package/dist/chunks/{index.ad39b625.js.map → index.133e4da0.js.map} +1 -1
  146. package/dist/chunks/{index.175f9e2d.js → index.56858f4e.js} +15 -14
  147. package/dist/chunks/index.56858f4e.js.map +1 -0
  148. package/dist/chunks/{index.d07f9800.js → index.73d50fa6.js} +2 -2
  149. package/dist/chunks/{index.d07f9800.js.map → index.73d50fa6.js.map} +1 -1
  150. package/dist/chunks/{index.3dfea3bd.js → index.f0f8ed98.js} +3 -3
  151. package/dist/chunks/{index.3dfea3bd.js.map → index.f0f8ed98.js.map} +1 -1
  152. package/dist/chunks/{listbox-option-tag.c7e9a228.js → listbox-option-tag.8d6cccac.js} +3 -3
  153. package/dist/chunks/{listbox-option-tag.c7e9a228.js.map → listbox-option-tag.8d6cccac.js.map} +1 -1
  154. package/dist/chunks/{listbox.f51e92cd.js → listbox.116ed0c1.js} +177 -177
  155. package/dist/chunks/listbox.116ed0c1.js.map +1 -0
  156. package/dist/chunks/{loading-button.6d34f66f.js → loading-button.1c201f87.js} +10 -10
  157. package/dist/chunks/loading-button.1c201f87.js.map +1 -0
  158. package/dist/chunks/{tooltip.9af34fba.js → tooltip.2aff4fa6.js} +2 -2
  159. package/dist/chunks/tooltip.2aff4fa6.js.map +1 -0
  160. package/dist/chunks/use-form-layout-loading.d03e5d48.js +12 -0
  161. package/dist/chunks/use-form-layout-loading.d03e5d48.js.map +1 -0
  162. package/dist/code-snippet.js +6 -6
  163. package/dist/code-snippet.js.map +1 -1
  164. package/dist/country.js +149 -174
  165. package/dist/country.js.map +1 -1
  166. package/dist/currency.js +1 -1
  167. package/dist/data-grid.js +482 -499
  168. package/dist/data-grid.js.map +1 -1
  169. package/dist/date-picker.js +80 -74
  170. package/dist/date-picker.js.map +1 -1
  171. package/dist/date-range-picker.js +2 -2
  172. package/dist/date.js +1 -1
  173. package/dist/divider.js +1 -1
  174. package/dist/dropdown.js +72 -67
  175. package/dist/dropdown.js.map +1 -1
  176. package/dist/filter-bar.js +268 -265
  177. package/dist/filter-bar.js.map +1 -1
  178. package/dist/focus-trap.js +1 -1
  179. package/dist/form-layout.js +174 -0
  180. package/dist/form-layout.js.map +1 -0
  181. package/dist/header.js +3 -3
  182. package/dist/index.js +164 -155
  183. package/dist/index.js.map +1 -1
  184. package/dist/info-icon.js +2 -2
  185. package/dist/input-field.js +69 -67
  186. package/dist/input-field.js.map +1 -1
  187. package/dist/internal.js +6 -6
  188. package/dist/link.js +2 -2
  189. package/dist/loading-indicator.js +1 -1
  190. package/dist/menu.js +4 -4
  191. package/dist/modal.js +203 -324
  192. package/dist/modal.js.map +1 -1
  193. package/dist/pagination.js +4 -4
  194. package/dist/payment-method.js +2 -2
  195. package/dist/popover.js +4 -4
  196. package/dist/popper-container.js +2 -2
  197. package/dist/radio-group.js +97 -99
  198. package/dist/radio-group.js.map +1 -1
  199. package/dist/search-bar.js +2 -2
  200. package/dist/segmented-control.js +4 -4
  201. package/dist/sidepanel.js +218 -0
  202. package/dist/sidepanel.js.map +1 -0
  203. package/dist/status.js +2 -2
  204. package/dist/structured-list.js +1 -1
  205. package/dist/summary-grid.js +3 -3
  206. package/dist/tabs.js +3 -3
  207. package/dist/tabs.js.map +1 -1
  208. package/dist/tag.js +3 -3
  209. package/dist/textarea.js +84 -82
  210. package/dist/textarea.js.map +1 -1
  211. package/dist/timeline.js +23 -23
  212. package/dist/timeline.js.map +1 -1
  213. package/dist/toast.js +2 -2
  214. package/dist/toggle.js +2 -2
  215. package/dist/typography.js +1 -1
  216. package/dist/web-types.json +455 -73
  217. package/package.json +10 -8
  218. package/dist/@types/packages/vue2/src/components/country/composables/useCountryFlag.d.ts +0 -2
  219. package/dist/chunks/calendar.8f50a65a.js.map +0 -1
  220. package/dist/chunks/controls-group.9d58a091.js +0 -64
  221. package/dist/chunks/controls-group.9d58a091.js.map +0 -1
  222. package/dist/chunks/dropdown-default-textbox.a5eca928.js.map +0 -1
  223. package/dist/chunks/dropdown.368486b1.js.map +0 -1
  224. package/dist/chunks/index.175f9e2d.js.map +0 -1
  225. package/dist/chunks/listbox.f51e92cd.js.map +0 -1
  226. package/dist/chunks/loading-button.6d34f66f.js.map +0 -1
  227. package/dist/chunks/tooltip.9af34fba.js.map +0 -1
@@ -1 +1 @@
1
- {"version":3,"file":"data-grid.js","sources":["../src/components/data-grid/composables/useCalculateBodyFitContentDynamicStyles/useCalculateBodyFitContentDynamicStyles.ts","../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/useResizer.ts","../src/components/data-grid/composables/useCalculateColumnWidth/useCalculateColumnWidth.ts","../src/components/data-grid/composables/useSorter.ts","../src/components/data-grid/composables/useSelector.ts","../src/components/data-grid/composables/useKeyboardNavigator/useKeyboardNavigator.types.ts","../src/components/data-grid/composables/useKeyboardNavigator/useKeyboardNavigator.ts","../src/components/data-grid/composables/useColumnReorderer/useColumnReorderer.ts","../src/components/data-grid/composables/useConfigSettings/useConfigSettings.ts","../../../node_modules/@adyen/ui-assets-icons-16/dist/vue/triangle-up.vue","../../../node_modules/@adyen/ui-assets-icons-16/dist/vue/triangle-down.vue","../../../node_modules/@adyen/ui-assets-icons-16/dist/vue/arrow-left.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/show.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/data-grid.vue"],"sourcesContent":["import { nextTick, onMounted, onUnmounted, ref, watch } from 'vue';\nimport { observeSizeOfElement } from '@/utils/ts/resize';\nimport { UseCalculateBodyFitContentDynamicStyles } from './useCalculateBodyFitContentDynamicStyles.types';\n\n/**\n * Calculates the `bento-data-grid` body class' dynamic height based on the pagination\n * height for the `fit-content` modifier of the component.\n *\n * This is so that the component can be rendered inside a small container\n * (Card or Modal) and allow vertical and horizontal scrolling.\n *\n * @param {Ref<HTMLDivElement>} options.paginationRef Reference to the pagination container if it exists\n * @param {Ref<boolean>} options.fitContent Reference to the prop `fit-content`\n * @returns Body dynamic styles object\n */\nexport const useCalculateBodyFitContentDynamicStyles: UseCalculateBodyFitContentDynamicStyles = ({\n paginationRef,\n fitContent,\n}) => {\n const height = ref(undefined);\n let paginationElementObserver: ResizeObserver | null = null;\n\n onMounted(() => {\n if (fitContent) {\n nextTick(() => {\n // Keep watching pagination element till it's defined, if it is then observe it's offsetHeight\n const stop = watch(\n paginationRef,\n () => {\n if (paginationRef.value) {\n nextTick(() => stop());\n paginationElementObserver = observeSizeOfElement(paginationRef.value, () => {\n if (paginationRef.value) {\n height.value = `calc(100% - ${paginationRef.value?.offsetHeight}px)`;\n }\n });\n }\n },\n { immediate: true }\n );\n });\n }\n });\n\n onUnmounted(() => {\n paginationElementObserver?.disconnect();\n });\n\n return { height };\n};\n","import { BentoPagination } from '@/components/pagination';\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 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}\n\nexport enum BentoDatagridStyleState {\n OUTLINE = 'outline',\n FIT_CONTENT = 'fit-content',\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 minWidth: BentoColumn['minWidth'];\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_SEARCH_TERM = 'update:filter-search-term',\n UPDATE_PAGINATION = 'update:pagination',\n UPDATE_SELECTION = 'update:selection',\n UPDATE_SORT_BY = 'update:sort-by',\n ROW_CLICK = 'row-click',\n SELECT = 'select',\n SORT = 'sort',\n}\n\nexport enum BentoDatagridAriaSortValue {\n ASCENDING = 'ascending',\n DESCENDING = 'descending',\n NONE = 'none',\n}\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 COLUMN_MOVE = 'column-move',\n COLUMN_UPDATE = 'column-update',\n COLUMN_MENU_OPEN = 'column-menu-open',\n COLUMN_MENU_CLOSE = 'column-menu-close',\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\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, watchEffect } from 'vue';\nimport { listen } from '@/utils/ts/events';\nimport { BentoColumn, BentoColumnWidthOverridesLookup } from '../data-grid.types';\nimport { DatagridColumnsEvent } from '../components/data-grid-columns/data-grid-columns-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 * @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 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 > columnWidthOverridesLookup.value[currResizingColumnField].minWidth\n ? resizedColumnWidth\n : columnWidthOverridesLookup.value[currResizingColumnField].minWidth;\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 return { resizeData: columnWidthOverridesLookup, allColumnRefs, startResize, isResizing };\n};\n\nexport default useResizer;\n","import { computed, nextTick, onMounted, onUnmounted, ref, watch } from 'vue';\nimport { BentoColumn, BentoColumnWidthOverridesLookup } from '../../data-grid.types';\nimport { CalculateColumnWidthOptions, FlexColumnLookup } from './useCalculateColumnWidth.types';\nimport { MaybeRef } from '@/types';\nimport { observeSizeOfElement } from '@/utils/ts/resize';\n\n// Default constants\nexport const DEFAULT_COLUMN_WIDTH = 100;\nexport const DEFAULT_COLUMN_MIN_WIDTH = 50;\nexport const DATAGRID_SELECT_FIELD_NAME = 'b-select';\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 the width of the columns using width, minWidth and/or a fluid number.\n *\n * @param columns an array of column definitions\n * @param gridWidth the width of the data grid\n * @param options optional options for the calculator to be aware of.\n */\nexport const useCalculateColumnWidth = (\n newColumns: MaybeRef<BentoColumn[]>,\n bodyRef: MaybeRef<HTMLDivElement | undefined>,\n options?: CalculateColumnWidthOptions\n) => {\n const columns = ref(newColumns);\n const body = ref(bodyRef);\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\n const caclulatedWidths = 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 // Prepend a column if needs selecting functionality\n if (options?.hasSelectableColumn.value) {\n columnDefs = [{ field: DATAGRID_SELECT_FIELD_NAME, label: '', width: 40 }, ...columnDefs];\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 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 const processedColumns = computed(() =>\n caclulatedWidths.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(() => processedColumns.value.reduce((acc, val) => val.width + acc, 0));\n\n const gridColumnWidthStyle = computed(() => ({\n width: gridWidth.value > totalWidthOfAllColumns.value ? '100%' : 'fit-content',\n }));\n\n return { columnDefs: processedColumns, gridColumnWidthStyle, onColumnWidthOverride };\n};\n\nexport default useCalculateColumnWidth;\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\nexport const useSorter = (\n sortBy: Ref<BentoDatagridSortByColumn[]>,\n columns: Ref<BentoColumn[]>,\n emit: (event: DatagridColumnsEvent, updatedSortBy: BentoDatagridSortByColumn[]) => void\n) => {\n // Get column sort direction if it has been sorted\n const conditionalSortDirectionClasses = (field: string, direction: BentoDatagridSortDirection) => ({\n 'b-data-grid-columns__column-sort-icon--sorted': sortBy.value.some(\n sortedCol => sortedCol.field === field && sortedCol.direction === direction\n ),\n });\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 { conditionalSortDirectionClasses, sortByColumnField };\n};\n","import { nextTick, reactive, ref, Ref } 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 const onAllRowSelect = (allItemsSelected: boolean) => {\n nextTick(() => {\n if (allItemsSelected) {\n // eslint-disable-next-line no-param-reassign\n selectedItems.value = data.value\n ?.filter(dataItem => !isDataItemDisabled(dataItem))\n ?.map(dataItem => getDataItemId(dataItem));\n } else {\n // eslint-disable-next-line no-param-reassign\n selectedItems.value = [];\n }\n allItemsSelectedState.allItemsSelected = allItemsSelected;\n allItemsSelectedState.isIndeterminate = false;\n emitSelect();\n });\n };\n\n const onRowSelect = (value: BentoDatagridDataItemId[]) => {\n nextTick(() => {\n selectedItems.value = value;\n const isEveryItemSelected = data.value\n ?.filter(dataItem => !isDataItemDisabled(dataItem))\n .every(item => selectedItems.value.includes(getDataItemId(item)));\n allItemsSelectedState.isIndeterminate = selectedItems.value.length > 0 && !isEveryItemSelected;\n\n if (isEveryItemSelected) {\n allItemsSelectedState.allItemsSelected = true;\n } else if (allItemsSelectedState.isIndeterminate || !isEveryItemSelected) {\n allItemsSelectedState.allItemsSelected = false;\n }\n\n emitSelect();\n });\n };\n\n onRowSelect(selection.value);\n\n return { onAllRowSelect, onRowSelect, allItemsSelectedState, selectedItems };\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 { Ref } from 'vue';\nimport { BentoDatagridNavigationKeyCode } from './useKeyboardNavigator.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 columnsCount - number of visible columns on the data-grid\n */\nexport const useKeyboardNavigator = (gridcellRefs: Ref<HTMLDivElement[]>, columnsCount: Ref<number>) => {\n // Returns the index of the row that a given cell is found\n const getCurrentRowIndex = (currentIndex: number) => Math.floor(currentIndex / columnsCount.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 = gridcellRefs.value.length - 1;\n const lastColumnIndex = columnsCount.value - 1;\n const currentRowIndex = getCurrentRowIndex(currentIndex);\n const currentColumn = currentIndex - columnsCount.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 : columnsCount.value * currentRowIndex + lastColumnIndex,\n [BentoDatagridNavigationKeyCode.HOME]: ctrlKey ? 0 : columnsCount.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]: columnsCount.value,\n [BentoDatagridNavigationKeyCode.ARROW_UP]: -columnsCount.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 >= gridcellRefs.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 = gridcellRefs.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 (!gridcellRefs.value.includes(target as HTMLDivElement)) {\n return;\n }\n\n const cellIndex = getTargetCellIndex(target, keyCode, ctrlKey);\n gridcellRefs.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 return {\n focusOnNextGridcell,\n isNavigationKeyCode,\n };\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) return;\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) return {};\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) return {};\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 '../useCalculateColumnWidth/useCalculateColumnWidth';\nimport type { SetupContext } from 'vue/types/v3-setup-context';\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 * @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(() => sortedColumnsByFreezeState.value.filter(col => col.frozen));\n const unfrozenColumns = computed(() => sortedColumnsByFreezeState.value.filter(col => !col.frozen));\n const columnSets = computed(() =>\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","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" 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\" fill-rule=\"evenodd\" d=\"M11 10.75C11.2841 10.75 11.5438 10.5895 11.6708 10.3354C11.7979 10.0813 11.7705 9.77726 11.6 9.55L8.6 5.55C8.45836 5.36115 8.23607 5.25 8.00001 5.25C7.76394 5.25 7.54165 5.36115 7.40001 5.55L4.4 9.55C4.22956 9.77726 4.20214 10.0813 4.32918 10.3354C4.45623 10.5895 4.71593 10.75 5 10.75L11 10.75Z\" clip-rule=\"evenodd\"/></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 scoped lang=\"scss\">\n svg {\n display: inline-flex;\n flex-shrink: 0;\n }\n \n svg,\n svg * {\n fill: currentcolor;\n }\n</style>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" 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\" fill-rule=\"evenodd\" d=\"M5 5.25C4.71593 5.25 4.45623 5.4105 4.32918 5.66459C4.20214 5.91868 4.22956 6.22274 4.4 6.45L7.4 10.45C7.54165 10.6389 7.76394 10.75 8 10.75C8.23607 10.75 8.45836 10.6389 8.6 10.45L11.6 6.45C11.7705 6.22274 11.7979 5.91868 11.6708 5.66459C11.5438 5.4105 11.2841 5.25 11 5.25H5Z\" clip-rule=\"evenodd\"/></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 scoped lang=\"scss\">\n svg {\n display: inline-flex;\n flex-shrink: 0;\n }\n \n svg,\n svg * {\n fill: currentcolor;\n }\n</style>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" 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\" fill-rule=\"evenodd\" d=\"M6.46998 2.45129L1.46998 7.45129C1.39987 7.52054 1.3443 7.60309 1.30652 7.6941C1.26874 7.78511 1.24952 7.88275 1.24998 7.98129C1.24529 8.03118 1.24529 8.0814 1.24998 8.13129C1.24544 8.17117 1.24544 8.21142 1.24998 8.25129C1.28579 8.35526 1.34778 8.44825 1.42998 8.52129L6.42998 13.5213C6.57187 13.6672 6.7659 13.7507 6.96938 13.7535C7.17285 13.7563 7.36911 13.6782 7.51498 13.5363C7.66085 13.3944 7.74438 13.2004 7.74719 12.9969C7.75001 12.7934 7.67187 12.5972 7.52998 12.4513L3.80998 8.73129H14C14.1989 8.73129 14.3897 8.65228 14.5303 8.51162C14.671 8.37097 14.75 8.18021 14.75 7.98129C14.75 7.78238 14.671 7.59162 14.5303 7.45096C14.3897 7.31031 14.1989 7.23129 14 7.23129L3.80998 7.23129L7.52998 3.51129C7.66246 3.36912 7.73459 3.18107 7.73116 2.98677C7.72773 2.79247 7.64902 2.60709 7.51161 2.46967C7.37419 2.33226 7.18881 2.25355 6.99451 2.25012C6.8002 2.24669 6.61216 2.31881 6.46998 2.45129Z\" clip-rule=\"evenodd\"/></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 scoped lang=\"scss\">\n svg {\n display: inline-flex;\n flex-shrink: 0;\n }\n \n svg,\n svg * {\n fill: currentcolor;\n }\n</style>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" 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\" fill-rule=\"evenodd\" d=\"M9.53 13.55L14.53 8.55C14.6 8.48 14.66 8.4 14.69 8.31C14.72 8.22 14.75 8.12 14.75 8.02C14.75 8.02 14.75 7.92 14.75 7.87C14.75 7.83 14.75 7.79 14.75 7.75C14.71 7.65 14.65 7.55 14.57 7.48L9.57 2.48C9.43 2.34 9.23 2.25 9.03 2.25C8.83 2.25 8.63 2.33 8.48 2.47C8.33 2.61 8.25 2.81 8.25 3.01C8.25 3.21 8.33 3.41 8.47 3.56L12.19 7.28H2C1.8 7.28 1.61 7.36 1.47 7.5C1.33 7.64 1.25 7.83 1.25 8.03C1.25 8.23 1.33 8.42 1.47 8.56C1.61 8.7 1.8 8.78 2 8.78H12.19L8.47 12.5C8.34 12.64 8.27 12.83 8.27 13.02C8.27 13.21 8.35 13.4 8.49 13.54C8.63 13.68 8.81 13.76 9.01 13.76C9.2 13.76 9.39 13.69 9.53 13.56V13.55Z\" clip-rule=\"evenodd\"/></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 scoped lang=\"scss\">\n svg {\n display: inline-flex;\n flex-shrink: 0;\n }\n \n svg,\n svg * {\n fill: currentcolor;\n }\n</style>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" 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\" fill-rule=\"evenodd\" d=\"M7.03033 0.96967C6.73744 0.676777 6.26256 0.676777 5.96967 0.96967C5.67678 1.26256 5.67678 1.73744 5.96967 2.03033L7.25 3.31066V5.06654L5.83093 5.88398L4.3138 5.00601L3.8442 3.25567C3.73686 2.8556 3.32553 2.6183 2.92547 2.72563C2.5254 2.83297 2.2881 3.2443 2.39543 3.64436L2.75109 4.96998L1.42547 5.32563C1.0254 5.43297 0.788098 5.8443 0.895433 6.24436C1.00277 6.64443 1.4141 6.88173 1.81416 6.7744L3.56372 6.305L5.08008 7.18253V8.81748L3.56369 9.69502L1.81416 9.22563C1.4141 9.1183 1.00277 9.3556 0.895433 9.75567C0.788098 10.1557 1.0254 10.5671 1.42547 10.6744L2.75109 11.0301L2.39543 12.3557C2.2881 12.7557 2.5254 13.1671 2.92547 13.2744C3.32553 13.3817 3.73686 13.1444 3.8442 12.7444L4.31381 10.994L5.83093 10.116L7.25 10.9335V12.6893L5.96967 13.9697C5.67678 14.2626 5.67678 14.7374 5.96967 15.0303C6.26256 15.3232 6.73744 15.3232 7.03033 15.0303L8 14.0607L8.96967 15.0303C9.26256 15.3232 9.73744 15.3232 10.0303 15.0303C10.3232 14.7374 10.3232 14.2626 10.0303 13.9697L8.75 12.6893V10.9336L10.1692 10.116L11.6857 10.9936L12.1554 12.7444C12.2627 13.1444 12.6741 13.3817 13.0741 13.2744C13.4742 13.1671 13.7115 12.7557 13.6042 12.3557L13.4374 11.7342C13.4337 11.7143 13.4292 11.6943 13.4238 11.6745L13.2497 11.0297L14.5741 10.6744C14.9742 10.5671 15.2115 10.1557 15.1042 9.75567C14.9968 9.3556 14.5855 9.1183 14.1854 9.22563L13.564 9.39237C13.5441 9.39606 13.5241 9.40058 13.5042 9.40595L12.4356 9.69456L10.9201 8.81752V7.18249L12.4363 6.30504L14.1857 6.7744C14.5858 6.88173 14.9971 6.64443 15.1045 6.24436C15.2118 5.8443 14.9745 5.43297 14.5744 5.32563L13.2488 4.96998L13.6045 3.64436C13.7118 3.2443 13.4745 2.83297 13.0744 2.72563C12.6744 2.6183 12.263 2.8556 12.1557 3.25567L11.6861 5.00615L10.1692 5.88396L8.75 5.06645V3.31066L10.0303 2.03033C10.3232 1.73744 10.3232 1.26256 10.0303 0.96967C9.73744 0.676777 9.26256 0.676777 8.96967 0.96967L8 1.93934L7.03033 0.96967ZM6.58008 8.81649V7.18351L8.00008 6.36553L9.42008 7.18351V8.81649L8.00008 9.63447L6.58008 8.81649Z\" clip-rule=\"evenodd\"/></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 scoped lang=\"scss\">\n svg {\n display: inline-flex;\n flex-shrink: 0;\n }\n \n svg,\n svg * {\n fill: currentcolor;\n }\n</style>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" 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\" fill-rule=\"evenodd\" d=\"M1.85822 8.00063C2.23115 8.61494 2.6599 9.19394 3.1392 9.73021C3.41522 10.0391 3.38862 10.5132 3.07978 10.7892C2.77094 11.0652 2.29681 11.0386 2.02078 10.7298C1.37391 10.006 0.808653 9.21323 0.335231 8.36577C0.209001 8.13981 0.2082 7.86474 0.333112 7.63805C0.481818 7.36817 1.22715 6.04687 2.49452 4.78481C3.75589 3.52873 5.61815 2.25 7.98999 2.25H7.99122C8.59964 2.251 9.20512 2.33426 9.79122 2.4975C10.1903 2.60864 10.4236 3.02221 10.3125 3.42123C10.2014 3.82026 9.78778 4.05364 9.38876 3.9425C8.9331 3.81559 8.46237 3.75083 7.98937 3.75C6.18148 3.75022 4.67897 4.7264 3.55296 5.84769C2.73159 6.66562 2.15512 7.51757 1.85822 8.00063Z\" clip-rule=\"evenodd\"/><path fill=\"#00112C\" fill-rule=\"evenodd\" d=\"M12.9002 5.21082C13.209 4.9348 13.6832 4.9614 13.9592 5.27024C14.6061 5.99402 15.1713 6.7868 15.6448 7.63425C15.771 7.86021 15.7718 8.13529 15.6469 8.36198C15.4982 8.63186 14.7528 9.95316 13.4855 11.2152C12.2241 12.4713 10.3618 13.75 7.98999 13.75L7.98876 13.75C7.38034 13.749 6.77486 13.6658 6.18876 13.5025C5.78973 13.3914 5.55635 12.9778 5.66749 12.5788C5.77863 12.1798 6.1922 11.9464 6.59123 12.0575C7.0469 12.1844 7.51763 12.2492 7.99064 12.25C9.79852 12.2498 11.301 11.2736 12.427 10.1523C13.2484 9.3344 13.8249 8.48246 14.1218 7.99939C13.7488 7.38508 13.3201 6.80609 12.8408 6.26982C12.5648 5.96097 12.5914 5.48685 12.9002 5.21082Z\" clip-rule=\"evenodd\"/><path fill=\"#00112C\" fill-rule=\"evenodd\" d=\"M13.5203 3.53033C13.8132 3.23744 13.8132 2.76256 13.5203 2.46967C13.2274 2.17678 12.7526 2.17678 12.4597 2.46967L2.45966 12.4697C2.16677 12.7626 2.16677 13.2374 2.45966 13.5303C2.75255 13.8232 3.22743 13.8232 3.52032 13.5303L13.5203 3.53033Z\" clip-rule=\"evenodd\"/></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 scoped lang=\"scss\">\n svg {\n display: inline-flex;\n flex-shrink: 0;\n }\n \n svg,\n svg * {\n fill: currentcolor;\n }\n</style>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" 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\" fill-rule=\"evenodd\" d=\"M5.2525 8C5.2525 6.48 6.4825 5.25 8.0025 5.25C9.5225 5.25 10.7525 6.48 10.7525 8C10.7525 9.52 9.5225 10.75 8.0025 10.75C6.4825 10.75 5.2525 9.52 5.2525 8ZM6.7525 8C6.7525 8.69 7.3125 9.25 8.0025 9.25C8.6925 9.25 9.2525 8.69 9.2525 8C9.2525 7.31 8.6925 6.75 8.0025 6.75C7.3125 6.75 6.7525 7.31 6.7525 8Z\" clip-rule=\"evenodd\"/><path fill=\"#00112C\" fill-rule=\"evenodd\" d=\"M8.0025 2.25C12.8125 2.25 15.5625 7.43 15.6725 7.65C15.7825 7.87 15.7825 8.12 15.6725 8.34C15.6711 8.34265 15.6692 8.34603 15.667 8.35011C15.4859 8.6842 12.7446 13.74 8.0025 13.74C3.2025 13.74 0.4425 8.56 0.3325 8.34C0.2225 8.13 0.2225 7.87 0.3325 7.65C0.334097 7.64707 0.336157 7.64327 0.33868 7.63861C0.525781 7.29307 3.2565 2.25 8.0025 2.25ZM1.8725 8C2.5325 9.07 4.7525 12.25 8.0025 12.25C11.2425 12.25 13.4725 9.07 14.1325 8C13.4725 6.93 11.2425 3.75 8.0025 3.75C4.7625 3.75 2.5325 6.93 1.8725 8Z\" clip-rule=\"evenodd\"/></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 scoped lang=\"scss\">\n svg {\n display: inline-flex;\n flex-shrink: 0;\n }\n \n svg,\n svg * {\n fill: currentcolor;\n }\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 :aria-colindex=\"index + 1\"\n :aria-label=\"column.label\"\n :aria-sort=\"getSortingColumnDirection(column)\"\n :class=\"conditionalColumnClasses(column)\"\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 ? '0' : '-1'\"\n :style=\"{ width: `${column.width}px` }\"\n v-on=\"dataGridColumnEvents(column)\"\n >\n <template v-if=\"!isSelectColumn(column)\">\n <bento-typography :el=\"BentoTypographyElement.DIV\" strongest class=\"b-data-grid-columns__column-header\">\n <slot :column=\"column\" :name=\"`head-${column.field}`\">\n <span>{{ column.label }}</span>\n <bento-info-icon v-if=\"column.infoIconTooltip\" :tooltip-text=\"column.infoIconTooltip\" />\n </slot>\n </bento-typography>\n <div v-if=\"column.sortable || hasColumnPanel\" class=\"b-data-grid-columns__column-actions\">\n <div v-if=\"column.sortable\" class=\"b-data-grid-columns__column-sort\">\n <triangle-up\n class=\"b-data-grid-columns__column-sort-icon\"\n :class=\"conditionalSortDirectionClasses(column.field, BentoDatagridSortDirection.ASCENDING)\"\n :svg-title=\"`${column.field} sort ascending`\"\n :data-testid=\"`${column.field}-sort-icon-asc`\"\n />\n <triangle-down\n class=\"b-data-grid-columns__column-sort-icon\"\n :class=\"\n conditionalSortDirectionClasses(column.field, BentoDatagridSortDirection.DESCENDING)\n \"\n :svg-title=\"`${column.field}sort descending`\"\n :data-testid=\"`${column.field}-sort-icon-desc`\"\n />\n </div>\n <bento-menu\n v-if=\"hasColumnPanel\"\n class=\"b-data-grid-columns__menu\"\n :data=\"contextualMenuData(column)\"\n :menu-position=\"\n hasFirstColumnPanelRightAligned && index === 0\n ? BentoPopoverPositions.BOTTOM_START\n : BentoPopoverPositions.BOTTOM_END\n \"\n :menu-fixed-positioning=\"true\"\n :button=\"{ variant: BentoButtonVariant.TERTIARY }\"\n @open=\"$emit(DatagridColumnsEvent.COLUMN_MENU_OPEN)\"\n @close=\"$emit(DatagridColumnsEvent.COLUMN_MENU_CLOSE)\"\n />\n </div>\n <div\n :data-testid=\"`data-grid-column-${column.field}`\"\n class=\"b-data-grid-columns__column-separator-container\"\n :class=\"conditionalColumnSeparatorClasses\"\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 <template v-else>\n <bento-checkbox\n :model-value=\"allItemsSelectedCheckboxState.allItemsSelected\"\n data-testid=\"checkbox-select-all\"\n :indeterminate=\"allItemsSelectedCheckboxState.isIndeterminate\"\n value=\"data-grid-select-all\"\n @update:model-value=\"onAllRowSelect\"\n />\n </template>\n </div>\n </div>\n</template>\n\n<script lang=\"ts\">\n import { computed, defineComponent, PropType, ref, toRefs } from 'vue';\n import { BentoCheckbox } from '@/components/checkbox';\n import {\n BentoColumn,\n BentoDatagridAllItemsSelectedState,\n BentoDatagridAriaSortValue,\n BentoDatagridSortByColumn,\n BentoDatagridSortDirection,\n } from '../../data-grid.types';\n import { BentoTypography, BentoTypographyElement } from '@/components/typography';\n import { DATAGRID_SELECT_FIELD_NAME, useResizer, useSorter } from '../../composables';\n import { BentoInfoIcon } from '@/components/info-icon';\n import { BentoDatagridDraggingColumnState, DatagridColumnsEvent } from './data-grid-columns-types';\n import { BentoMenu } from '@/components/menu';\n import { useI18n } from '@/utils/ts/i18n';\n import type { BentoMenuItem } from '@/components/menu/components';\n import { BentoPopoverPositions } from '@/components/popover';\n import { BentoButtonVariant } from '@/components/button';\n import { KeyCode } from '@/types/utils-events';\n import TriangleUp from '@adyen/ui-assets-icons-16/vue/triangle-up';\n import TriangleDown from '@adyen/ui-assets-icons-16/vue/triangle-down';\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 ShowIcon from '@adyen/ui-assets-icons-16/vue/show';\n import messages from './messages.json';\n\n type MessageSchema = (typeof messages)['en-US'];\n\n export default defineComponent({\n i18n: { messages },\n name: 'data-grid-columns',\n components: {\n BentoCheckbox,\n BentoInfoIcon,\n BentoTypography,\n BentoMenu,\n TriangleUp,\n TriangleDown,\n },\n props: {\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 * 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 * The column all items selected state\n */\n allItemsSelectedState: {\n type: Object as PropType<BentoDatagridAllItemsSelectedState>,\n default: undefined,\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 emits: [\n DatagridColumnsEvent.COLUMN_RESIZE,\n DatagridColumnsEvent.SORT,\n DatagridColumnsEvent.SELECT_ALL_ROWS,\n DatagridColumnsEvent.COLUMN_DRAG_START,\n DatagridColumnsEvent.COLUMN_DRAG_ENTER,\n DatagridColumnsEvent.COLUMN_DROP,\n DatagridColumnsEvent.COLUMN_DRAG_END,\n DatagridColumnsEvent.COLUMN_MOVE,\n DatagridColumnsEvent.COLUMN_UPDATE,\n DatagridColumnsEvent.COLUMN_MENU_OPEN,\n DatagridColumnsEvent.COLUMN_MENU_CLOSE,\n ],\n setup(props, { emit }) {\n const { t } = useI18n<{ message: MessageSchema }>({ messages });\n const { columns, sortBy } = toRefs(props);\n\n // Selecting\n const allItemsSelectedCheckboxState = ref(props.allItemsSelectedState);\n const onAllRowSelect = (areAllItemsSelected: boolean) =>\n emit(DatagridColumnsEvent.SELECT_ALL_ROWS, areAllItemsSelected);\n const isSelectColumn = (column: BentoColumn) => column.field === DATAGRID_SELECT_FIELD_NAME;\n // Resizing\n const { startResize, isResizing } = useResizer(columns, emit);\n\n // Sorting\n const { conditionalSortDirectionClasses, 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) return {};\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\n // Column events\n const dataGridColumnEvents = (column: BentoColumn) => {\n let events: { [eventName: string]: (e: Event) => void } = {};\n if (!isSelectColumn(column)) {\n events = {\n ...draggingEventsForColumn.value(column),\n };\n }\n if (column.sortable) {\n events.click = () => sortByColumnField(column.field);\n events.keydown = (event: KeyboardEvent) => {\n if (event.keyCode !== KeyCode.ENTER) {\n return;\n }\n sortByColumnField(column.field);\n };\n }\n return events;\n };\n\n // Conditional column styles\n // Conditional styles\n const conditionalColumnsClasses = computed(() =>\n columns.value[0]?.frozen\n ? { 'b-data-grid-columns--frozen': true }\n : {\n 'b-data-grid-columns--unfrozen': true,\n 'b-data-grid-columns--config-settings-margin': props.hasColumnPanel,\n }\n );\n\n const conditionalColumnClasses = (column: BentoColumn) => ({\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 });\n\n const conditionalColumnSeparatorClasses = computed(() => ({\n 'b-data-grid-columns__column-separator-container--is-resizeable': props.hasResizableColumns,\n }));\n\n return {\n // Values\n DATAGRID_SELECT_FIELD_NAME,\n\n // Styles and classes\n conditionalColumnClasses,\n conditionalColumnSeparatorClasses,\n conditionalColumnsClasses,\n\n // Selecting\n allItemsSelectedCheckboxState,\n isSelectColumn,\n onAllRowSelect,\n\n // Sorting\n conditionalSortDirectionClasses,\n sortByColumnField,\n getSortingColumnDirection,\n\n // Resizing\n startResize,\n isResizing,\n\n // Event handlers\n dataGridColumnEvents,\n\n // Dragging\n draggingEventsForColumn,\n\n // Contextual menu\n contextualMenuData,\n\n // Enums\n BentoButtonVariant,\n BentoDatagridSortDirection,\n BentoTypographyElement,\n BentoPopoverPositions,\n DatagridColumnsEvent,\n };\n },\n });\n</script>\n\n<style lang=\"scss\" scoped>\n @import 'data-grid-columns';\n</style>\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\" 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-settings__a' + uuid + ')'\"><path fill=\"#00112C\" fill-rule=\"evenodd\" d=\"M8.75 1C8.75 0.585786 8.41421 0.25 8 0.25C7.58579 0.25 7.25 0.585786 7.25 1V1.2979C6.57635 1.37321 5.91783 1.54959 5.29672 1.82106L5.15026 1.56623C4.94387 1.2071 4.48542 1.08329 4.12629 1.28969C3.76716 1.49608 3.64335 1.95453 3.84974 2.31366L3.99751 2.57078C3.45281 2.97189 2.97145 3.45265 2.56967 3.99684L2.31372 3.84974C1.95459 3.64335 1.49614 3.76716 1.28975 4.12629C1.08335 4.48542 1.20717 4.94387 1.56629 5.15026L1.81832 5.29511C1.54577 5.91658 1.36849 6.57567 1.29247 7.25H1C0.585786 7.25 0.25 7.58579 0.25 8C0.25 8.41421 0.585786 8.75 1 8.75H1.29249C1.36851 9.42433 1.54581 10.0834 1.81837 10.7049L1.56629 10.8497C1.20717 11.0561 1.08335 11.5146 1.28975 11.8737C1.49614 12.2328 1.95459 12.3567 2.31372 12.1503L2.56974 12.0031C2.97151 12.5473 3.45284 13.028 3.99752 13.4291L3.84974 13.6862C3.64335 14.0454 3.76716 14.5038 4.12629 14.7102C4.48542 14.9166 4.94387 14.7928 5.15027 14.4337L5.29669 14.1789C5.91781 14.4504 6.57634 14.6267 7.25 14.7021V15C7.25 15.4142 7.58579 15.75 8 15.75C8.41421 15.75 8.75 15.4142 8.75 15V14.7021C9.42366 14.6267 10.0822 14.4504 10.7033 14.1789L10.8497 14.4337C11.0561 14.7928 11.5146 14.9166 11.8737 14.7102C12.2328 14.5038 12.3567 14.0454 12.1503 13.6862L12.0025 13.4291C12.5472 13.028 13.0285 12.5473 13.4303 12.0031L13.6863 12.1503C14.0454 12.3567 14.5039 12.2328 14.7103 11.8737C14.9167 11.5146 14.7928 11.0561 14.4337 10.8497L14.1817 10.7049C14.4542 10.0834 14.6315 9.42433 14.7075 8.75H15C15.4142 8.75 15.75 8.41421 15.75 8C15.75 7.58579 15.4142 7.25 15 7.25H14.7075C14.6315 6.57567 14.4542 5.91659 14.1817 5.29512L14.4337 5.15027C14.7928 4.94387 14.9167 4.48542 14.7103 4.12629C14.5039 3.76716 14.0454 3.64335 13.6863 3.84974L13.4303 3.99685C13.0285 3.45266 12.5472 2.9719 12.0025 2.57079L12.1503 2.31366C12.3567 1.95453 12.2328 1.49608 11.8737 1.28969C11.5146 1.08329 11.0561 1.2071 10.8497 1.56623L10.7033 1.82106C10.0822 1.54959 9.42365 1.37321 8.75 1.2979V1ZM3.46027 10.6263C3.46894 10.6414 3.47703 10.6567 3.48455 10.6721C3.81553 11.2301 4.24603 11.7202 4.75273 12.119L6.02977 9.90977C5.87643 9.75181 5.74113 9.57619 5.62698 9.38602L5.62041 9.37508C5.5299 9.2183 5.45553 9.0535 5.39784 8.88345C5.36087 8.77446 5.33077 8.66327 5.30773 8.55053C5.27085 8.37007 5.25205 8.18563 5.25205 7.99994C5.25205 7.51721 5.37912 7.04299 5.62048 6.62494L5.62686 6.61388C5.74103 6.4237 5.87643 6.24812 6.02979 6.09014L4.75273 3.88083C4.24621 4.27955 3.81584 4.76943 3.4849 5.32721C3.47729 5.34287 3.46908 5.35839 3.46027 5.37372C3.45059 5.39055 3.44036 5.40687 3.42962 5.42266C2.98528 6.20874 2.75106 7.09641 2.75 7.99994C2.75106 8.90376 2.98543 9.79172 3.43005 10.578C3.44064 10.5936 3.45072 10.6097 3.46027 10.6263ZM9.22412 7.75044C9.24103 7.83222 9.24976 7.9158 9.25 7.99998C9.24939 8.21721 9.19217 8.4305 9.08403 8.61885C8.96887 8.80892 8.80952 8.96837 8.61952 9.08363C8.43083 9.1913 8.21731 9.24795 8 9.24795C7.78331 9.24795 7.57039 9.19162 7.3821 9.08455C7.19161 8.96935 7.03182 8.80977 6.91637 8.61945C6.876 8.5487 6.84279 8.47445 6.81706 8.39782C6.80127 8.35077 6.78829 8.30283 6.77819 8.25425C6.76089 8.17096 6.75208 8.08579 6.75208 8.00002C6.75208 7.78271 6.80873 7.56919 6.91639 7.38051C7.03152 7.19073 7.19073 7.03152 7.38051 6.91639C7.56919 6.80873 7.78271 6.75208 8.00002 6.75208C8.21734 6.75208 8.43085 6.80873 8.61954 6.91639C8.80954 7.03165 8.96889 7.1911 9.08405 7.38117C9.12468 7.45192 9.15811 7.52619 9.18406 7.60287C9.20042 7.6512 9.21379 7.70048 9.22412 7.75044ZM10.6447 7.24995H13.1953C13.102 6.60939 12.8908 5.98951 12.5703 5.4225C12.5596 5.40676 12.5494 5.39049 12.5397 5.37372C12.531 5.35844 12.5228 5.34299 12.5152 5.32739C12.0559 4.55324 11.4051 3.90987 10.625 3.45947C9.8269 2.99869 8.92157 2.7561 8 2.7561C7.33041 2.7561 6.66938 2.88417 6.05183 3.13095L7.32631 5.3358C7.54562 5.28038 7.77186 5.252 8 5.252C8.48273 5.252 8.95695 5.37907 9.375 5.62043L9.38606 5.62681C9.79104 5.86991 10.1299 6.20898 10.373 6.61395L10.3788 6.62358C10.4505 6.74721 10.5122 6.87582 10.5635 7.00811C10.5944 7.08748 10.6214 7.16818 10.6447 7.24995ZM6.05183 12.869L7.3263 10.6642C7.54562 10.7196 7.77187 10.748 8.00002 10.748C8.48275 10.748 8.95697 10.6209 9.37502 10.3795L9.38602 10.3731C9.791 10.13 10.13 9.791 10.3731 9.38602L10.3788 9.37636C10.4935 9.17854 10.5826 8.96807 10.6448 8.75H13.1953C13.102 9.3907 12.8907 10.0107 12.5701 10.5778C12.5594 10.5935 12.5493 10.6096 12.5397 10.6263C12.531 10.6415 12.5229 10.6568 12.5154 10.6723C12.0574 11.4444 11.4089 12.0864 10.6317 12.5366L10.6263 12.5397L10.6183 12.5443C9.82186 13.0026 8.919 13.2438 8 13.2438C7.33041 13.2438 6.66938 13.1158 6.05183 12.869Z\" clip-rule=\"evenodd\"/></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 scoped lang=\"scss\">\n svg {\n display: inline-flex;\n flex-shrink: 0;\n }\n \n svg,\n svg * {\n fill: currentcolor;\n }\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=\"BentoToggleLabelPosition.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 { BentoTypographyElement, BentoTypographyVariant } from '@/components/typography';\n import { BentoToggle, BentoToggleLabelPosition } 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 // Enum\n BentoToggleLabelPosition,\n BentoTypographyElement,\n BentoTypographyVariant,\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-seperator\">\n <div class=\"b-data-grid-config-settings__column-separator\"></div>\n <div class=\"b-data-grid-config-settings__button-container\">\n <bento-button\n ref=\"configSettingsButtonRef\"\n :aria-controls=\"isConfigSettingsPanelOpen ? popoverId : null\"\n :variant=\"BentoButtonVariant.TERTIARY\"\n @click=\"setConfigSettingsPanelVisibility(!isConfigSettingsPanelOpen)\"\n >\n <template #iconLeft>\n <bento-settings-icon :svg-title=\"$t('toggleConfigSettingsPanelVisibility')\" />\n </template>\n </bento-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=\"BentoPopoverPositions.BOTTOM\"\n >\n <div class=\"b-data-grid-config-settings__panel-header\">\n <bento-typography :el=\"BentoTypographyElement.SPAN\" strongest>\n {{ $t('displayOptions') }}\n </bento-typography>\n <bento-button :variant=\"BentoButtonVariant.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\n class=\"b-data-grid-config-settings__condensed-view-title\"\n :el=\"BentoTypographyElement.SPAN\"\n stronger\n >\n {{ $t('size') }}\n </bento-typography>\n <bento-toggle\n :label-position=\"BentoToggleLabelPosition.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\n class=\"b-data-grid-config-settings__column-visibility-title\"\n :el=\"BentoTypographyElement.SPAN\"\n stronger\n >\n {{ $t('columns') }}\n </bento-typography>\n <bento-button\n v-if=\"!isColumnVisibilityFilterShown\"\n :variant=\"BentoButtonVariant.TERTIARY\"\n @click=\"toggleColumnFilter\"\n >\n <template #iconLeft>\n <bento-search-icon />\n </template>\n {{ $t('search') }}\n </bento-button>\n <bento-button v-else :variant=\"BentoButtonVariant.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=\"BentoToggleLabelPosition.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=\"BentoTypographyElement.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, BentoPopoverPositions } from '@/components/popover';\n import { BentoButton, BentoButtonVariant } from '@/components/button';\n import { BentoTypography, BentoTypographyElement, BentoTypographyVariant } from '@/components/typography';\n import { BentoToggle, BentoToggleLabelPosition } 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 BentoCrossIcon,\n BentoPopover,\n BentoSettingsIcon,\n BentoButton,\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 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.bentoInputField.focusInput());\n }\n allColumnsVisbilityToggleState.value = areAllNonMandatoryColumnsHidden.value;\n };\n\n // Column visibility\n const visibleColumns = computed(() => props.columns.filter(col => col?.visible !== false));\n const isColumnVisibilityToggleDisabled = (column: BentoColumn) =>\n column.mandatory || (visibleColumns.value.length === 1 && column?.visible !== 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 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 // Enum\n BentoToggleLabelPosition,\n BentoTypographyElement,\n BentoTypographyVariant,\n BentoButtonVariant,\n BentoPopoverPositions,\n };\n },\n });\n</script>\n\n<style lang=\"scss\" scoped src=\"./data-grid-config-settings.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 v-if=\"filters\" class=\"b-data-grid__filters\">\n <bento-filter-bar\n v-if=\"filters\"\n :value=\"filters\"\n :search-term=\"filterSearchTerm\"\n @search-input=\"onSearchTermInput\"\n @search-clear=\"onSearchTermCleared\"\n @input=\"filters => $emit(BentoDatagridEvent.UPDATE_FILTERS, filters)\"\n />\n </div>\n <div v-if=\"$slots.header\" class=\"b-data-grid__header\">\n <slot name=\"header\"></slot>\n </div>\n <div\n ref=\"body\"\n class=\"b-data-grid__body\"\n :tabindex=\"loading ? '0' : '-1'\"\n :aria-busy=\"loading\"\n :style=\"fitContent ? { height: bodyDynamicStyles.height.value } : undefined\"\n aria-live=\"polite\"\n >\n <bento-data-grid-config-settings\n v-if=\"columnPanel\"\n class=\"b-data-grid__config-settings\"\n :style=\"configSettingsButtonStyle\"\n :columns=\"columns\"\n :condensed=\"condensed\"\n @config-settings=\"onConfigSettingsUpdate\"\n @update:columns=\"onConfigSettingsColumnsUpdate\"\n />\n <div ref=\"columnsRef\" role=\"rowgroup\" class=\"b-data-grid__columns-row\">\n <div\n :style=\"gridColumnWidthStyle\"\n class=\"b-data-grid__columns\"\n role=\"row\"\n :class=\"conditionalColumnsClasses\"\n >\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 :columns=\"columnSet\"\n :has-resizable-columns=\"hasResizableColumns\"\n :sort-by=\"sortBy\"\n :all-items-selected-state=\"allItemsSelectedState\"\n :is-frozen-columns=\"isFrozenColumns\"\n :dragging-columns=\"draggingColumns\"\n :has-draggable-columns=\"allowColumnDragAndDrop\"\n :has-column-panel=\"columnPanel\"\n :has-first-column-panel-right-aligned=\"index === computedColumnPanelAlignment\"\n :is-only-one-visible-column=\"isOnlyOneVisibleColumn\"\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 @sort=\"onSort\"\n @column-menu-open=\"isColumnMenuOpen = true\"\n @column-menu-close=\"isColumnMenuOpen = false\"\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 v-if=\"loading\" class=\"b-data-grid__loading\">\n <bento-loading-indicator class=\"b-data-grid__loading-indicator\" large />\n <bento-typography :el=\"BentoTypographyElement.SPAN\" :variant=\"BentoTypographyVariant.CAPTION\">{{\n t('gettingYourData')\n }}</bento-typography>\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)\"\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=\"conditionalRowSetClasses(isFrozenColumns)\"\n :data-testid=\"`data-grid-${id}-rows`\"\n >\n <div\n v-for=\"(column, colIndex) in columnSet\"\n :key=\"`cell-${column.field}`\"\n ref=\"gridcellRefs\"\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=\"{ width: `${column.width}px` }\"\n v-on=\"gridcellEvents(column)\"\n >\n <template v-if=\"column.field !== DATAGRID_SELECT_FIELD_NAME\">\n <bento-typography :el=\"BentoTypographyElement.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 </template>\n <template v-else>\n <bento-checkbox\n :aria-label=\"t('selectRow')\"\n :model-value=\"selectedItems\"\n :disabled=\"isDataItemDisabled(rowData)\"\n :value=\"getDataItemId(rowData)\"\n @update:model-value=\"onRowSelect\"\n />\n </template>\n </div>\n </div>\n </template>\n </div>\n </div>\n </div>\n <div\n v-if=\"pagination\"\n ref=\"paginationRef\"\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 </div>\n</template>\n\n<script lang=\"ts\">\n import { computed, defineComponent, PropType, ref, toRef, toRefs } from 'vue';\n import { useCalculateBodyFitContentDynamicStyles } from './composables/useCalculateBodyFitContentDynamicStyles/useCalculateBodyFitContentDynamicStyles';\n import { useAriaLabel } from '@/utils/ts/aria-label';\n import { BentoCheckbox } from '@/components/checkbox';\n import { BentoPagination } from '@/components/pagination';\n import { BentoLoadingIndicator } from '@/components/loading-indicator';\n import { Booleanish } from '@/types';\n import {\n BentoColumn,\n BentoColumnOverflow,\n BentoDatagridData,\n BentoDatagridDataItem,\n BentoDatagridDataItemId,\n BentoDatagridEvent,\n BentoDatagridGetDataItemIdFn,\n BentoDatagridIsDataItemDisabledFn,\n BentoDatagridPaginationProps,\n BentoDatagridSortByColumn,\n BentoDatagridSortDirection,\n BentoDatagridStyleState,\n } from './data-grid.types';\n import { BentoTypography, BentoTypographyElement, BentoTypographyVariant } from '@/components/typography';\n import { BentoDataGridConfigSettings, DataGridColumns } from './components';\n import {\n DATAGRID_SELECT_FIELD_NAME,\n useCalculateColumnWidth,\n useColumnReorderer,\n useConfigSettings,\n useKeyboardNavigator,\n useSelector,\n } from './composables';\n import { getSlotText } from '@/utils/ts/get-slot-text';\n import { useI18n } from '@/utils/ts/i18n';\n import BentoFilterBar from '@/components/filter-bar/filter-bar.vue';\n import messages from './messages.json';\n\n type MessageSchema = (typeof messages)['en-US'];\n\n export default defineComponent({\n i18n: { messages },\n name: 'bento-data-grid',\n components: {\n BentoCheckbox,\n DataGridColumns,\n BentoDataGridConfigSettings,\n BentoLoadingIndicator,\n BentoPagination,\n BentoFilterBar,\n BentoTypography,\n },\n props: {\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 * 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 * filter-bar value (i.e. filters) that will be passed down to inner filter-bar component\n */\n filters: {\n type: BentoFilterBar.props.value.type,\n default: undefined,\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 * 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 * 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 * 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 * 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 emits: [\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_FILTERS,\n BentoDatagridEvent.UPDATE_FILTER_SEARCH_TERM,\n BentoDatagridEvent.UPDATE_PAGINATION,\n BentoDatagridEvent.UPDATE_SELECTION,\n BentoDatagridEvent.UPDATE_SORT_BY,\n BentoDatagridEvent.ROW_CLICK,\n BentoDatagridEvent.SELECT,\n BentoDatagridEvent.SORT,\n ],\n setup(props, { emit, slots }) {\n /* == Variables and references == */\n // Create refs for elements\n const body = ref<HTMLDivElement>(null);\n const columnsRef = ref<HTMLDivElement>();\n const gridcellRefs = ref<HTMLDivElement[]>(null);\n const { columns, selectable, data, selection, allowColumnDragAndDrop } = toRefs(props);\n const { t } = useI18n<{ message: MessageSchema }>({ messages });\n\n /* == Composable logic == */\n // Column width calculation\n const { columnDefs, onColumnWidthOverride, gridColumnWidthStyle } = useCalculateColumnWidth(columns, body, {\n hasSelectableColumn: selectable,\n });\n\n // Calculate dynamic heights on fitContent\n const paginationRef = ref<HTMLDivElement>(null);\n const bodyDynamicStyles = useCalculateBodyFitContentDynamicStyles({\n paginationRef,\n fitContent: toRef(props, 'fitContent'),\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 // 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 /* == Styles == */\n // Conditional grid classes\n const conditionalGridClasses = computed(() => ({\n [`b-data-grid--${BentoDatagridStyleState.OUTLINE}`]: props.outline,\n [`b-data-grid--${BentoDatagridStyleState.FIT_CONTENT}`]: props.fitContent,\n }));\n\n const computedColumnPanelAlignment = computed(() => columnSets.value.findIndex(el => el.columnSet.length));\n\n // Conditional row classes\n const conditionalRowClasses = (row: BentoDatagridDataItem) => ({\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': props.highlightedRows.includes(row.id),\n });\n const conditionalRowSetClasses = (isFrozenRowSet: boolean) => ({\n 'b-data-grid__row-cell-set--frozen': isFrozenRowSet,\n 'b-data-grid__row-cell-set--unfrozen': !isFrozenRowSet,\n 'b-data-grid__row-cell-set--config-settings-margin': !isFrozenRowSet && props.columnPanel,\n });\n const conditionalRowCellClasses = (column: BentoColumn) => ({\n 'b-data-grid__cell--padding-left-unset': column?.padding?.left === false,\n 'b-data-grid__cell--padding-right-unset': column?.padding?.right === false,\n 'b-data-grid__cell--numeric': column?.numeric,\n 'b-data-grid__cell--condensed': props.condensed,\n 'b-data-grid__cell--frozen': column?.frozen,\n [`b-data-grid__cell--overflow-${BentoColumnOverflow.ELLIPSIS}`]:\n column?.overflow === BentoColumnOverflow.ELLIPSIS,\n 'b-data-grid__cell--is-column-re-ordering': draggingColumns.dragging?.field === column.field,\n 'b-data-grid__cell--is-column-re-order-target-left':\n draggingColumns.target?.field === column.field && draggingColumns?.dragToLeft,\n 'b-data-grid__cell--is-column-re-order-target-right':\n draggingColumns.target?.field === column.field && !draggingColumns?.dragToLeft,\n });\n\n const isColumnMenuOpen = ref(false);\n\n const conditionalColumnsClasses = computed(() => ({\n 'b-data-grid__columns--menu-open': isColumnMenuOpen.value,\n }));\n\n const conditionalTitleAttribute = (column: BentoColumn, content: unknown) =>\n column?.overflow === BentoColumnOverflow.ELLIPSIS ? `${content}` : undefined;\n\n const getRowData = (rowData: unknown) => rowData ?? '-';\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,\n }));\n\n // Get the columns header height and use for the height of the config settings button overlay\n const configSettingsButtonStyle = computed(() => ({\n height: `${columnsRef.value?.clientHeight}px`,\n }));\n\n // TODO: Fix the issue where users provide components into the slot\n // a11y grid header label text\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 /* == Emits == */\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) => {\n emit(BentoDatagridEvent.NAVIGATE, page);\n emit(BentoDatagridEvent.UPDATE_PAGINATION, {\n ...props.pagination,\n page,\n });\n };\n const onItemsPerPageChange = (itemsPerPage: number) => emit(BentoDatagridEvent.ITEMS_PAGE, itemsPerPage);\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 // Row selecting\n const onRowClick = (row: BentoDatagridDataItem, event: MouseEvent) => {\n if (props.allowRowClicks) {\n emit(BentoDatagridEvent.ROW_CLICK, row, event);\n }\n };\n // Keyboard navigation\n const columnsCount = 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 const sortedGridCellRefs = computed(() =>\n [...gridcellRefs.value].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 const { focusOnNextGridcell, isNavigationKeyCode } = useKeyboardNavigator(sortedGridCellRefs, columnsCount);\n const navigationInput = (event: KeyboardEvent) => {\n const { ctrlKey, keyCode, target } = event;\n\n const isFocusedOnGridcell = gridcellRefs.value.includes(target as HTMLDivElement);\n if (isFocusedOnGridcell && isNavigationKeyCode(keyCode)) {\n focusOnNextGridcell(target, keyCode, ctrlKey);\n }\n };\n const updateScrollPositionOnFrozenColumnsNavigation = () => {\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 const gridcellEvents = column => {\n const events: { [eventName: string]: (e: Event) => void } = {\n ...draggingEventsForRowCell.value(column),\n };\n if (column.frozen) {\n events.focus = updateScrollPositionOnFrozenColumnsNavigation;\n }\n return events;\n };\n const getColIndex = (colIndex: number, colSetIndex: number) =>\n colIndex + columnSets.value.length * colSetIndex;\n const getCellindex = (rowIndex: number, colIndex: number, colSetIndex: number) =>\n columns.value.length * rowIndex + getColIndex(colIndex, colSetIndex);\n\n return {\n // Refs\n body,\n columnDefs,\n columnSets,\n gridcellRefs,\n isColumnMenuOpen,\n\n // Calculate dynamic fit-content height\n paginationRef,\n bodyDynamicStyles,\n\n // $scopedSlots/$slots children\n slots,\n\n // Labels and text\n ariaGridHeaderText,\n conditionalTitleAttribute,\n getRowData,\n\n // Styles and classes\n gridColumnWidthStyle,\n conditionalGridClasses,\n conditionalRowClasses,\n conditionalRowSetClasses,\n conditionalRowCellClasses,\n conditionalPaginationClasses,\n conditionalColumnsClasses,\n\n // Resizing\n onColumnWidthOverride,\n onColumnResized,\n\n // Sorting\n onSort,\n\n // Select\n allItemsSelectedState,\n selectedItems,\n onAllRowSelect,\n onRowSelect,\n DATAGRID_SELECT_FIELD_NAME,\n onRowClick,\n getRowAriaSelectedValue,\n\n // Config settings (and column updating)\n onConfigSettingsUpdate,\n onConfigSettingsColumnsUpdate,\n onConfigSettingsColumnUpdate,\n columnsRef,\n configSettingsButtonStyle,\n isOnlyOneVisibleColumn,\n\n // Enums\n BentoDatagridSortDirection,\n BentoTypographyElement,\n BentoTypographyVariant,\n BentoDatagridEvent,\n\n // Pagination props and events\n onPaginationNavigate,\n onItemsPerPageChange,\n\n // Filterbar events\n onSearchTermCleared,\n onSearchTermInput,\n\n // Re-ordering columns\n onMoveColumnByOffset,\n draggingColumns,\n draggingEventsForColumns,\n draggingEventsForRowCell,\n\n // Leftmost column panel alignment\n computedColumnPanelAlignment,\n\n // Gridcells events\n gridcellEvents,\n\n // Keyboard navigation\n getCellindex,\n getColIndex,\n navigationInput,\n\n // Translations\n t,\n };\n },\n });\n</script>\n\n<style lang=\"scss\" scoped src=\"./data-grid.scss\" />\n"],"names":["useCalculateBodyFitContentDynamicStyles","paginationRef","fitContent","height","ref","paginationElementObserver","onMounted","nextTick","stop","watch","observeSizeOfElement","_a","onUnmounted","BentoColumnOverflow","BentoColumnOverflow2","BentoDatagridStyleState","BentoDatagridStyleState2","BentoDatagridSortDirection","BentoDatagridSortDirection2","BentoDatagridEvent","BentoDatagridEvent2","BentoDatagridAriaSortValue","BentoDatagridAriaSortValue2","DatagridColumnsEvent","DatagridColumnsEvent2","useResizer","columns","emit","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","hasResizableColumns","listen","useResizer$1","DEFAULT_COLUMN_WIDTH","DEFAULT_COLUMN_MIN_WIDTH","DATAGRID_SELECT_FIELD_NAME","computeFlexColumnsWidth","initialFreeSpace","totalFlexUnits","flexCols","flexColumnsLookup","frozenColumnKeys","freezeColumn","value","processFlexItems","violationsLookup","remainingFreeSpace","flexUnits","totalViolation","i","flexColsLength","column","computedWidth","key","useCalculateColumnWidth","newColumns","bodyRef","options","body","gridWidth","bodyElementObserver","caclulatedWidths","widthAllocatedBeforeFlex","columnsLookup","columnDefs","fluidCol","computedColumnWidths","onColumnWidthOverride","newColumnWidthOverridesLookup","processedColumns","_b","totalWidthOfAllColumns","val","gridColumnWidthStyle","useCalculateColumnWidth$1","useSorter","sortBy","direction","sortedCol","updatedSortBy","useSelector","selection","data","getDataItemId","isDataItemDisabled","selectedItems","allItemsSelectedState","emitSelect","onAllRowSelect","allItemsSelected","dataItem","onRowSelect","isEveryItemSelected","item","BentoDatagridNavigationKeyCode","BentoDatagridNavigationKeyCode2","KeyCode","useKeyboardNavigator","gridcellRefs","columnsCount","getCurrentRowIndex","currentIndex","getEdgeCellIndex","ctrlKey","lastCellIndex","lastColumnIndex","currentRowIndex","currentColumn","getCellIndex","directionDiff","newCellIndex","isEdgeNavigationKeyCode","keyCode","getTargetCellIndex","target","directionKeyCode","currentCellIndex","cellIndex","useColumnReorderer","columnsRef","hasDraggableColumnsRef","hasDraggableColumns","draggingColumns","onMoveColumnByOffset","movingColumn","offset","fromIndex","c","toIndex","reorderedColumns","onDragStart","e","onDragEnter","dragEvent","targetRect","midpoint","clientX","onDrop","toIndexInitial","toLeftOfToIndex","firstUnfrozenColumn","onDragEnd","draggingEventsForColumns","draggingEventsForRowCell","useConfigSettings","sortedColumnsByFreezeState","a","b","frozenColumns","unfrozenColumns","columnSets","columnSet","isOnlyOneVisibleColumn","onConfigSettingsUpdate","isCondensedView","onConfigSettingsColumnsUpdate","updatedColumn","updatedColumns","uuid$7","_sfc_main$b","uuid$6","_sfc_main$a","uuid$5","_sfc_main$9","uuid$4","_sfc_main$8","uuid$3","_sfc_main$7","uuid$2","_sfc_main$6","uuid$1","_sfc_main$5","_sfc_main$4","defineComponent","messages$3","BentoCheckbox","BentoInfoIcon","BentoTypography","BentoMenu","TriangleUp","TriangleDown","props","t","useI18n","allItemsSelectedCheckboxState","areAllItemsSelected","isSelectColumn","startResize","conditionalSortDirectionClasses","sortByColumnField","getSortingColumnDirection","sortingDirection","draggingEventsForColumn","contextualMenuData","ArrowLeftIcon","ArrowRightIcon","BentoFreezeIcon","HideIcon","ShowIcon","dataGridColumnEvents","events","conditionalColumnsClasses","conditionalColumnClasses","_d","_c","_f","_e","_g","_i","_h","_j","conditionalColumnSeparatorClasses","BentoButtonVariant","BentoTypographyElement","BentoPopoverPositions","DatagridConfigSettingsEvent","DatagridConfigSettingsEvent2","uuid","_sfc_main$3","_sfc_main$2","messages$2","BentoToggle","isFreezeIconOptionShown","isColumnFrozen","isColumnVisible","toggleColumnVisibility","toggleColumnFreeze","showFreezeIcon","hideFreezeIcon","freezeIconConditionalClasses","BentoToggleLabelPosition","BentoTypographyVariant","_sfc_main$1","messages$1","CrossIcon","BentoPopover","BentoSettingsIcon","BentoButton","BentoDataGridConfigSettingsConfigRow","BentoSearchBar","SearchIcon","BentoClickOutsideDirective","configSettingsButtonRef","popoverId","generateUid","searchBarRef","isConfigSettingsPanelOpen","allColumnsVisbilityToggleState","searchTerm","toRef","isColumnVisibilityFilterShown","filteredColumnVisibilityColumns","useSearchBarFilter","clearAction","areAllNonMandatoryColumnsHidden","toggleColumnFilter","visibleColumns","isColumnVisibilityToggleDisabled","emitVisibleColumns","toggleAllColumnVisibility","toggleState","emitFrozenColumns","setConfigSettingsPanelVisibility","isVisible","_sfc_main","messages","DataGridColumns","BentoDataGridConfigSettings","BentoLoadingIndicator","BentoPagination","BentoFilterBar","slots","selectable","allowColumnDragAndDrop","bodyDynamicStyles","sortedColumns","onConfigSettingsColumnUpdate","conditionalGridClasses","computedColumnPanelAlignment","el","conditionalRowClasses","row","conditionalRowSetClasses","isFrozenRowSet","conditionalRowCellClasses","isColumnMenuOpen","conditionalTitleAttribute","content","getRowData","rowData","conditionalPaginationClasses","configSettingsButtonStyle","ariaGridHeaderText","useAriaLabel","getSlotText","getRowAriaSelectedValue","id","onColumnResized","resizeEvent","onSort","onPaginationNavigate","page","onItemsPerPageChange","itemsPerPage","onSearchTermCleared","onSearchTermInput","newSearchTerm","onRowClick","visible","sortedGridCellRefs","indexA","indexB","focusOnNextGridcell","isNavigationKeyCode","navigationInput","updateScrollPositionOnFrozenColumnsNavigation","gridcellEvents","getColIndex","colIndex","colSetIndex","rowIndex"],"mappings":"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","x_google_ignoreList":[11,12,13,14,15,16,17,20]}
1
+ {"version":3,"file":"data-grid.js","sources":["../src/components/data-grid/composables/useCalculateBodyFitContentDynamicStyles/useCalculateBodyFitContentDynamicStyles.ts","../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/useResizer.ts","../src/components/data-grid/composables/useCalculateColumnWidth/useCalculateColumnWidth.ts","../src/components/data-grid/composables/useSorter.ts","../src/components/data-grid/composables/useSelector.ts","../src/components/data-grid/composables/useKeyboardNavigator/useKeyboardNavigator.types.ts","../src/components/data-grid/composables/useKeyboardNavigator/useKeyboardNavigator.ts","../src/components/data-grid/composables/useColumnReorderer/useColumnReorderer.ts","../src/components/data-grid/composables/useConfigSettings/useConfigSettings.ts","../../../node_modules/@adyen/ui-assets-icons-16/dist/vue/triangle-up.vue","../../../node_modules/@adyen/ui-assets-icons-16/dist/vue/triangle-down.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/show.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/data-grid.vue"],"sourcesContent":["import { nextTick, onMounted, onUnmounted, ref, watch } from 'vue';\nimport { observeSizeOfElement } from '@/utils/ts/resize';\nimport { UseCalculateBodyFitContentDynamicStyles } from './useCalculateBodyFitContentDynamicStyles.types';\n\n/**\n * Calculates the `bento-data-grid` body class' dynamic height based on the pagination\n * height for the `fit-content` modifier of the component.\n *\n * This is so that the component can be rendered inside a small container\n * (Card or Modal) and allow vertical and horizontal scrolling.\n *\n * @param {Ref<HTMLDivElement>} options.paginationRef Reference to the pagination container if it exists\n * @param {Ref<boolean>} options.fitContent Reference to the prop `fit-content`\n * @returns Body dynamic styles object\n */\nexport const useCalculateBodyFitContentDynamicStyles: UseCalculateBodyFitContentDynamicStyles = ({\n paginationRef,\n fitContent,\n}) => {\n const height = ref(undefined);\n let paginationElementObserver: ResizeObserver | null = null;\n\n onMounted(() => {\n if (fitContent) {\n nextTick(() => {\n // Keep watching pagination element till it's defined, if it is then observe it's offsetHeight\n const stop = watch(\n paginationRef,\n () => {\n if (paginationRef.value) {\n nextTick(() => stop());\n paginationElementObserver = observeSizeOfElement(paginationRef.value, () => {\n if (paginationRef.value) {\n height.value = `calc(100% - ${paginationRef.value?.offsetHeight}px)`;\n }\n });\n }\n },\n { immediate: true }\n );\n });\n }\n });\n\n onUnmounted(() => {\n paginationElementObserver?.disconnect();\n });\n\n return { height };\n};\n","import { BentoPagination } from '@/components/pagination';\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 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}\n\nexport enum BentoDatagridStyleState {\n OUTLINE = 'outline',\n FIT_CONTENT = 'fit-content',\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 minWidth: BentoColumn['minWidth'];\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_SEARCH_TERM = 'update:filter-search-term',\n UPDATE_PAGINATION = 'update:pagination',\n UPDATE_SELECTION = 'update:selection',\n UPDATE_SORT_BY = 'update:sort-by',\n ROW_CLICK = 'row-click',\n SELECT = 'select',\n SORT = 'sort',\n}\n\nexport enum BentoDatagridAriaSortValue {\n ASCENDING = 'ascending',\n DESCENDING = 'descending',\n NONE = 'none',\n}\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 COLUMN_MOVE = 'column-move',\n COLUMN_UPDATE = 'column-update',\n COLUMN_MENU_OPEN = 'column-menu-open',\n COLUMN_MENU_CLOSE = 'column-menu-close',\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\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, watchEffect } from 'vue';\nimport { listen } from '@/utils/ts/events';\nimport { BentoColumn, BentoColumnWidthOverridesLookup } from '../data-grid.types';\nimport { DatagridColumnsEvent } from '../components/data-grid-columns/data-grid-columns-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 * @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 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 > columnWidthOverridesLookup.value[currResizingColumnField].minWidth\n ? resizedColumnWidth\n : columnWidthOverridesLookup.value[currResizingColumnField].minWidth;\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 return { resizeData: columnWidthOverridesLookup, allColumnRefs, startResize, isResizing };\n};\n\nexport default useResizer;\n","import { computed, nextTick, onMounted, onUnmounted, ref, watch } from 'vue';\nimport { BentoColumn, BentoColumnWidthOverridesLookup } from '../../data-grid.types';\nimport { CalculateColumnWidthOptions, FlexColumnLookup } from './useCalculateColumnWidth.types';\nimport { MaybeRef } from '@/types';\nimport { observeSizeOfElement } from '@/utils/ts/resize';\n\n// Default constants\nexport const DEFAULT_COLUMN_WIDTH = 100;\nexport const DEFAULT_COLUMN_MIN_WIDTH = 50;\nexport const DATAGRID_SELECT_FIELD_NAME = 'b-select';\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 the width of the columns using width, minWidth and/or a fluid number.\n *\n * @param columns an array of column definitions\n * @param gridWidth the width of the data grid\n * @param options optional options for the calculator to be aware of.\n */\nexport const useCalculateColumnWidth = (\n newColumns: MaybeRef<BentoColumn[]>,\n bodyRef: MaybeRef<HTMLDivElement | undefined>,\n options?: CalculateColumnWidthOptions\n) => {\n const columns = ref(newColumns);\n const body = ref(bodyRef);\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\n const caclulatedWidths = 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 // Prepend a column if needs selecting functionality\n if (options?.hasSelectableColumn.value) {\n columnDefs = [{ field: DATAGRID_SELECT_FIELD_NAME, label: '', width: 40 }, ...columnDefs];\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 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 const processedColumns = computed(() =>\n caclulatedWidths.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(() => processedColumns.value.reduce((acc, val) => val.width + acc, 0));\n\n const gridColumnWidthStyle = computed(() => ({\n width: gridWidth.value > totalWidthOfAllColumns.value ? '100%' : 'fit-content',\n }));\n\n return { columnDefs: processedColumns, gridColumnWidthStyle, onColumnWidthOverride };\n};\n\nexport default useCalculateColumnWidth;\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\nexport const useSorter = (\n sortBy: Ref<BentoDatagridSortByColumn[]>,\n columns: Ref<BentoColumn[]>,\n emit: (event: DatagridColumnsEvent, updatedSortBy: BentoDatagridSortByColumn[]) => void\n) => {\n // Get column sort direction if it has been sorted\n const conditionalSortDirectionClasses = (field: string, direction: BentoDatagridSortDirection) => ({\n 'b-data-grid-columns__column-sort-icon--sorted': sortBy.value.some(\n sortedCol => sortedCol.field === field && sortedCol.direction === direction\n ),\n });\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 { conditionalSortDirectionClasses, sortByColumnField };\n};\n","import { nextTick, reactive, ref, Ref } 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 const onAllRowSelect = (allItemsSelected: boolean) => {\n nextTick(() => {\n if (allItemsSelected) {\n // eslint-disable-next-line no-param-reassign\n selectedItems.value = data.value\n ?.filter(dataItem => !isDataItemDisabled(dataItem))\n ?.map(dataItem => getDataItemId(dataItem));\n } else {\n // eslint-disable-next-line no-param-reassign\n selectedItems.value = [];\n }\n allItemsSelectedState.allItemsSelected = allItemsSelected;\n allItemsSelectedState.isIndeterminate = false;\n emitSelect();\n });\n };\n\n const onRowSelect = (value: BentoDatagridDataItemId[]) => {\n nextTick(() => {\n selectedItems.value = value;\n const isEveryItemSelected = data.value\n ?.filter(dataItem => !isDataItemDisabled(dataItem))\n .every(item => selectedItems.value.includes(getDataItemId(item)));\n allItemsSelectedState.isIndeterminate = selectedItems.value.length > 0 && !isEveryItemSelected;\n\n if (isEveryItemSelected) {\n allItemsSelectedState.allItemsSelected = true;\n } else if (allItemsSelectedState.isIndeterminate || !isEveryItemSelected) {\n allItemsSelectedState.allItemsSelected = false;\n }\n\n emitSelect();\n });\n };\n\n onRowSelect(selection.value);\n\n return { onAllRowSelect, onRowSelect, allItemsSelectedState, selectedItems };\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 { Ref } from 'vue';\nimport { BentoDatagridNavigationKeyCode } from './useKeyboardNavigator.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 columnsCount - number of visible columns on the data-grid\n */\nexport const useKeyboardNavigator = (gridcellRefs: Ref<HTMLDivElement[]>, columnsCount: Ref<number>) => {\n // Returns the index of the row that a given cell is found\n const getCurrentRowIndex = (currentIndex: number) => Math.floor(currentIndex / columnsCount.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 = gridcellRefs.value.length - 1;\n const lastColumnIndex = columnsCount.value - 1;\n const currentRowIndex = getCurrentRowIndex(currentIndex);\n const currentColumn = currentIndex - columnsCount.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 : columnsCount.value * currentRowIndex + lastColumnIndex,\n [BentoDatagridNavigationKeyCode.HOME]: ctrlKey ? 0 : columnsCount.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]: columnsCount.value,\n [BentoDatagridNavigationKeyCode.ARROW_UP]: -columnsCount.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 >= gridcellRefs.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 = gridcellRefs.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 (!gridcellRefs.value.includes(target as HTMLDivElement)) {\n return;\n }\n\n const cellIndex = getTargetCellIndex(target, keyCode, ctrlKey);\n gridcellRefs.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 return {\n focusOnNextGridcell,\n isNavigationKeyCode,\n };\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) return;\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) return {};\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) return {};\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 '../useCalculateColumnWidth/useCalculateColumnWidth';\nimport type { SetupContext } from 'vue/types/v3-setup-context';\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 * @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(() => sortedColumnsByFreezeState.value.filter(col => col.frozen));\n const unfrozenColumns = computed(() => sortedColumnsByFreezeState.value.filter(col => !col.frozen));\n const columnSets = computed(() =>\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","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" 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\" fill-rule=\"evenodd\" d=\"M11 10.75C11.2841 10.75 11.5438 10.5895 11.6708 10.3354C11.7979 10.0813 11.7705 9.77726 11.6 9.55L8.6 5.55C8.45836 5.36115 8.23607 5.25 8.00001 5.25C7.76394 5.25 7.54165 5.36115 7.40001 5.55L4.4 9.55C4.22956 9.77726 4.20214 10.0813 4.32918 10.3354C4.45623 10.5895 4.71593 10.75 5 10.75L11 10.75Z\" clip-rule=\"evenodd\"/></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 scoped lang=\"scss\">\n svg {\n display: inline-flex;\n flex-shrink: 0;\n }\n \n svg,\n svg * {\n fill: currentcolor;\n }\n</style>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" 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\" fill-rule=\"evenodd\" d=\"M5 5.25C4.71593 5.25 4.45623 5.4105 4.32918 5.66459C4.20214 5.91868 4.22956 6.22274 4.4 6.45L7.4 10.45C7.54165 10.6389 7.76394 10.75 8 10.75C8.23607 10.75 8.45836 10.6389 8.6 10.45L11.6 6.45C11.7705 6.22274 11.7979 5.91868 11.6708 5.66459C11.5438 5.4105 11.2841 5.25 11 5.25H5Z\" clip-rule=\"evenodd\"/></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 scoped lang=\"scss\">\n svg {\n display: inline-flex;\n flex-shrink: 0;\n }\n \n svg,\n svg * {\n fill: currentcolor;\n }\n</style>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" 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\" fill-rule=\"evenodd\" d=\"M9.53 13.55L14.53 8.55C14.6 8.48 14.66 8.4 14.69 8.31C14.72 8.22 14.75 8.12 14.75 8.02C14.75 8.02 14.75 7.92 14.75 7.87C14.75 7.83 14.75 7.79 14.75 7.75C14.71 7.65 14.65 7.55 14.57 7.48L9.57 2.48C9.43 2.34 9.23 2.25 9.03 2.25C8.83 2.25 8.63 2.33 8.48 2.47C8.33 2.61 8.25 2.81 8.25 3.01C8.25 3.21 8.33 3.41 8.47 3.56L12.19 7.28H2C1.8 7.28 1.61 7.36 1.47 7.5C1.33 7.64 1.25 7.83 1.25 8.03C1.25 8.23 1.33 8.42 1.47 8.56C1.61 8.7 1.8 8.78 2 8.78H12.19L8.47 12.5C8.34 12.64 8.27 12.83 8.27 13.02C8.27 13.21 8.35 13.4 8.49 13.54C8.63 13.68 8.81 13.76 9.01 13.76C9.2 13.76 9.39 13.69 9.53 13.56V13.55Z\" clip-rule=\"evenodd\"/></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 scoped lang=\"scss\">\n svg {\n display: inline-flex;\n flex-shrink: 0;\n }\n \n svg,\n svg * {\n fill: currentcolor;\n }\n</style>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" 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\" fill-rule=\"evenodd\" d=\"M7.03033 0.96967C6.73744 0.676777 6.26256 0.676777 5.96967 0.96967C5.67678 1.26256 5.67678 1.73744 5.96967 2.03033L7.25 3.31066V5.06654L5.83093 5.88398L4.3138 5.00601L3.8442 3.25567C3.73686 2.8556 3.32553 2.6183 2.92547 2.72563C2.5254 2.83297 2.2881 3.2443 2.39543 3.64436L2.75109 4.96998L1.42547 5.32563C1.0254 5.43297 0.788098 5.8443 0.895433 6.24436C1.00277 6.64443 1.4141 6.88173 1.81416 6.7744L3.56372 6.305L5.08008 7.18253V8.81748L3.56369 9.69502L1.81416 9.22563C1.4141 9.1183 1.00277 9.3556 0.895433 9.75567C0.788098 10.1557 1.0254 10.5671 1.42547 10.6744L2.75109 11.0301L2.39543 12.3557C2.2881 12.7557 2.5254 13.1671 2.92547 13.2744C3.32553 13.3817 3.73686 13.1444 3.8442 12.7444L4.31381 10.994L5.83093 10.116L7.25 10.9335V12.6893L5.96967 13.9697C5.67678 14.2626 5.67678 14.7374 5.96967 15.0303C6.26256 15.3232 6.73744 15.3232 7.03033 15.0303L8 14.0607L8.96967 15.0303C9.26256 15.3232 9.73744 15.3232 10.0303 15.0303C10.3232 14.7374 10.3232 14.2626 10.0303 13.9697L8.75 12.6893V10.9336L10.1692 10.116L11.6857 10.9936L12.1554 12.7444C12.2627 13.1444 12.6741 13.3817 13.0741 13.2744C13.4742 13.1671 13.7115 12.7557 13.6042 12.3557L13.4374 11.7342C13.4337 11.7143 13.4292 11.6943 13.4238 11.6745L13.2497 11.0297L14.5741 10.6744C14.9742 10.5671 15.2115 10.1557 15.1042 9.75567C14.9968 9.3556 14.5855 9.1183 14.1854 9.22563L13.564 9.39237C13.5441 9.39606 13.5241 9.40058 13.5042 9.40595L12.4356 9.69456L10.9201 8.81752V7.18249L12.4363 6.30504L14.1857 6.7744C14.5858 6.88173 14.9971 6.64443 15.1045 6.24436C15.2118 5.8443 14.9745 5.43297 14.5744 5.32563L13.2488 4.96998L13.6045 3.64436C13.7118 3.2443 13.4745 2.83297 13.0744 2.72563C12.6744 2.6183 12.263 2.8556 12.1557 3.25567L11.6861 5.00615L10.1692 5.88396L8.75 5.06645V3.31066L10.0303 2.03033C10.3232 1.73744 10.3232 1.26256 10.0303 0.96967C9.73744 0.676777 9.26256 0.676777 8.96967 0.96967L8 1.93934L7.03033 0.96967ZM6.58008 8.81649V7.18351L8.00008 6.36553L9.42008 7.18351V8.81649L8.00008 9.63447L6.58008 8.81649Z\" clip-rule=\"evenodd\"/></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 scoped lang=\"scss\">\n svg {\n display: inline-flex;\n flex-shrink: 0;\n }\n \n svg,\n svg * {\n fill: currentcolor;\n }\n</style>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" 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\" fill-rule=\"evenodd\" d=\"M1.85822 8.00063C2.23115 8.61494 2.6599 9.19394 3.1392 9.73021C3.41522 10.0391 3.38862 10.5132 3.07978 10.7892C2.77094 11.0652 2.29681 11.0386 2.02078 10.7298C1.37391 10.006 0.808653 9.21323 0.335231 8.36577C0.209001 8.13981 0.2082 7.86474 0.333112 7.63805C0.481818 7.36817 1.22715 6.04687 2.49452 4.78481C3.75589 3.52873 5.61815 2.25 7.98999 2.25H7.99122C8.59964 2.251 9.20512 2.33426 9.79122 2.4975C10.1903 2.60864 10.4236 3.02221 10.3125 3.42123C10.2014 3.82026 9.78778 4.05364 9.38876 3.9425C8.9331 3.81559 8.46237 3.75083 7.98937 3.75C6.18148 3.75022 4.67897 4.7264 3.55296 5.84769C2.73159 6.66562 2.15512 7.51757 1.85822 8.00063Z\" clip-rule=\"evenodd\"/><path fill=\"#00112C\" fill-rule=\"evenodd\" d=\"M12.9002 5.21082C13.209 4.9348 13.6832 4.9614 13.9592 5.27024C14.6061 5.99402 15.1713 6.7868 15.6448 7.63425C15.771 7.86021 15.7718 8.13529 15.6469 8.36198C15.4982 8.63186 14.7528 9.95316 13.4855 11.2152C12.2241 12.4713 10.3618 13.75 7.98999 13.75L7.98876 13.75C7.38034 13.749 6.77486 13.6658 6.18876 13.5025C5.78973 13.3914 5.55635 12.9778 5.66749 12.5788C5.77863 12.1798 6.1922 11.9464 6.59123 12.0575C7.0469 12.1844 7.51763 12.2492 7.99064 12.25C9.79852 12.2498 11.301 11.2736 12.427 10.1523C13.2484 9.3344 13.8249 8.48246 14.1218 7.99939C13.7488 7.38508 13.3201 6.80609 12.8408 6.26982C12.5648 5.96097 12.5914 5.48685 12.9002 5.21082Z\" clip-rule=\"evenodd\"/><path fill=\"#00112C\" fill-rule=\"evenodd\" d=\"M13.5203 3.53033C13.8132 3.23744 13.8132 2.76256 13.5203 2.46967C13.2274 2.17678 12.7526 2.17678 12.4597 2.46967L2.45966 12.4697C2.16677 12.7626 2.16677 13.2374 2.45966 13.5303C2.75255 13.8232 3.22743 13.8232 3.52032 13.5303L13.5203 3.53033Z\" clip-rule=\"evenodd\"/></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 scoped lang=\"scss\">\n svg {\n display: inline-flex;\n flex-shrink: 0;\n }\n \n svg,\n svg * {\n fill: currentcolor;\n }\n</style>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" 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\" fill-rule=\"evenodd\" d=\"M5.2525 8C5.2525 6.48 6.4825 5.25 8.0025 5.25C9.5225 5.25 10.7525 6.48 10.7525 8C10.7525 9.52 9.5225 10.75 8.0025 10.75C6.4825 10.75 5.2525 9.52 5.2525 8ZM6.7525 8C6.7525 8.69 7.3125 9.25 8.0025 9.25C8.6925 9.25 9.2525 8.69 9.2525 8C9.2525 7.31 8.6925 6.75 8.0025 6.75C7.3125 6.75 6.7525 7.31 6.7525 8Z\" clip-rule=\"evenodd\"/><path fill=\"#00112C\" fill-rule=\"evenodd\" d=\"M8.0025 2.25C12.8125 2.25 15.5625 7.43 15.6725 7.65C15.7825 7.87 15.7825 8.12 15.6725 8.34C15.6711 8.34265 15.6692 8.34603 15.667 8.35011C15.4859 8.6842 12.7446 13.74 8.0025 13.74C3.2025 13.74 0.4425 8.56 0.3325 8.34C0.2225 8.13 0.2225 7.87 0.3325 7.65C0.334097 7.64707 0.336157 7.64327 0.33868 7.63861C0.525781 7.29307 3.2565 2.25 8.0025 2.25ZM1.8725 8C2.5325 9.07 4.7525 12.25 8.0025 12.25C11.2425 12.25 13.4725 9.07 14.1325 8C13.4725 6.93 11.2425 3.75 8.0025 3.75C4.7625 3.75 2.5325 6.93 1.8725 8Z\" clip-rule=\"evenodd\"/></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 scoped lang=\"scss\">\n svg {\n display: inline-flex;\n flex-shrink: 0;\n }\n \n svg,\n svg * {\n fill: currentcolor;\n }\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 :aria-colindex=\"index + 1\"\n :aria-label=\"column.label\"\n :aria-sort=\"getSortingColumnDirection(column)\"\n :class=\"conditionalColumnClasses(column)\"\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 ? '0' : '-1'\"\n :style=\"{ width: `${column.width}px` }\"\n v-on=\"dataGridColumnEvents(column)\"\n >\n <template v-if=\"!isSelectColumn(column)\">\n <bento-typography :el=\"BentoTypographyElement.DIV\" strongest class=\"b-data-grid-columns__column-header\">\n <slot :column=\"column\" :name=\"`head-${column.field}`\">\n <span>{{ column.label }}</span>\n <bento-info-icon v-if=\"column.infoIconTooltip\" :tooltip-text=\"column.infoIconTooltip\" />\n </slot>\n </bento-typography>\n <div v-if=\"column.sortable || hasColumnPanel\" class=\"b-data-grid-columns__column-actions\">\n <div v-if=\"column.sortable\" class=\"b-data-grid-columns__column-sort\">\n <triangle-up\n class=\"b-data-grid-columns__column-sort-icon\"\n :class=\"conditionalSortDirectionClasses(column.field, BentoDatagridSortDirection.ASCENDING)\"\n :svg-title=\"`${column.field} sort ascending`\"\n :data-testid=\"`${column.field}-sort-icon-asc`\"\n />\n <triangle-down\n class=\"b-data-grid-columns__column-sort-icon\"\n :class=\"\n conditionalSortDirectionClasses(column.field, BentoDatagridSortDirection.DESCENDING)\n \"\n :svg-title=\"`${column.field}sort descending`\"\n :data-testid=\"`${column.field}-sort-icon-desc`\"\n />\n </div>\n <bento-menu\n v-if=\"hasColumnPanel\"\n class=\"b-data-grid-columns__menu\"\n :data=\"contextualMenuData(column)\"\n :menu-position=\"\n hasFirstColumnPanelRightAligned && index === 0\n ? BentoPopoverPositions.BOTTOM_START\n : BentoPopoverPositions.BOTTOM_END\n \"\n :menu-fixed-positioning=\"true\"\n :button=\"{ variant: BentoButtonVariant.TERTIARY }\"\n @open=\"$emit(DatagridColumnsEvent.COLUMN_MENU_OPEN)\"\n @close=\"$emit(DatagridColumnsEvent.COLUMN_MENU_CLOSE)\"\n />\n </div>\n <div\n :data-testid=\"`data-grid-column-${column.field}`\"\n class=\"b-data-grid-columns__column-separator-container\"\n :class=\"conditionalColumnSeparatorClasses\"\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 <template v-else>\n <bento-checkbox\n :model-value=\"allItemsSelectedCheckboxState.allItemsSelected\"\n data-testid=\"checkbox-select-all\"\n :indeterminate=\"allItemsSelectedCheckboxState.isIndeterminate\"\n value=\"data-grid-select-all\"\n @update:model-value=\"onAllRowSelect\"\n />\n </template>\n </div>\n </div>\n</template>\n\n<script lang=\"ts\">\n import { computed, defineComponent, PropType, ref, toRefs } from 'vue';\n import { BentoCheckbox } from '@/components/checkbox';\n import {\n BentoColumn,\n BentoDatagridAllItemsSelectedState,\n BentoDatagridAriaSortValue,\n BentoDatagridSortByColumn,\n BentoDatagridSortDirection,\n } from '../../data-grid.types';\n import { BentoTypography, BentoTypographyElement } from '@/components/typography';\n import { DATAGRID_SELECT_FIELD_NAME, useResizer, useSorter } from '../../composables';\n import { BentoInfoIcon } from '@/components/info-icon';\n import { BentoDatagridDraggingColumnState, DatagridColumnsEvent } from './data-grid-columns-types';\n import { BentoMenu } from '@/components/menu';\n import { useI18n } from '@/utils/ts/i18n';\n import type { BentoMenuItem } from '@/components/menu/components';\n import { BentoPopoverPositions } from '@/components/popover';\n import { BentoButtonVariant } from '@/components/button';\n import { KeyCode } from '@/types/utils-events';\n import TriangleUp from '@adyen/ui-assets-icons-16/vue/triangle-up';\n import TriangleDown from '@adyen/ui-assets-icons-16/vue/triangle-down';\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 ShowIcon from '@adyen/ui-assets-icons-16/vue/show';\n import messages from './messages.json';\n\n type MessageSchema = (typeof messages)['en-US'];\n\n export default defineComponent({\n i18n: { messages },\n name: 'data-grid-columns',\n components: {\n BentoCheckbox,\n BentoInfoIcon,\n BentoTypography,\n BentoMenu,\n TriangleUp,\n TriangleDown,\n },\n props: {\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 * 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 * The column all items selected state\n */\n allItemsSelectedState: {\n type: Object as PropType<BentoDatagridAllItemsSelectedState>,\n default: undefined,\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 emits: [\n DatagridColumnsEvent.COLUMN_RESIZE,\n DatagridColumnsEvent.SORT,\n DatagridColumnsEvent.SELECT_ALL_ROWS,\n DatagridColumnsEvent.COLUMN_DRAG_START,\n DatagridColumnsEvent.COLUMN_DRAG_ENTER,\n DatagridColumnsEvent.COLUMN_DROP,\n DatagridColumnsEvent.COLUMN_DRAG_END,\n DatagridColumnsEvent.COLUMN_MOVE,\n DatagridColumnsEvent.COLUMN_UPDATE,\n DatagridColumnsEvent.COLUMN_MENU_OPEN,\n DatagridColumnsEvent.COLUMN_MENU_CLOSE,\n ],\n setup(props, { emit }) {\n const { t } = useI18n<{ message: MessageSchema }>({ messages });\n const { columns, sortBy } = toRefs(props);\n\n // Selecting\n const allItemsSelectedCheckboxState = ref(props.allItemsSelectedState);\n const onAllRowSelect = (areAllItemsSelected: boolean) =>\n emit(DatagridColumnsEvent.SELECT_ALL_ROWS, areAllItemsSelected);\n const isSelectColumn = (column: BentoColumn) => column.field === DATAGRID_SELECT_FIELD_NAME;\n // Resizing\n const { startResize, isResizing } = useResizer(columns, emit);\n\n // Sorting\n const { conditionalSortDirectionClasses, 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) return {};\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\n // Column events\n const dataGridColumnEvents = (column: BentoColumn) => {\n let events: { [eventName: string]: (e: Event) => void } = {};\n if (!isSelectColumn(column)) {\n events = {\n ...draggingEventsForColumn.value(column),\n };\n }\n if (column.sortable) {\n events.click = () => sortByColumnField(column.field);\n events.keydown = (event: KeyboardEvent) => {\n if (event.keyCode !== KeyCode.ENTER) {\n return;\n }\n sortByColumnField(column.field);\n };\n }\n return events;\n };\n\n // Conditional column styles\n // Conditional styles\n const conditionalColumnsClasses = computed(() =>\n columns.value[0]?.frozen\n ? { 'b-data-grid-columns--frozen': true }\n : {\n 'b-data-grid-columns--unfrozen': true,\n 'b-data-grid-columns--config-settings-margin': props.hasColumnPanel,\n }\n );\n\n const conditionalColumnClasses = (column: BentoColumn) => ({\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 });\n\n const conditionalColumnSeparatorClasses = computed(() => ({\n 'b-data-grid-columns__column-separator-container--is-resizeable': props.hasResizableColumns,\n }));\n\n return {\n // Values\n DATAGRID_SELECT_FIELD_NAME,\n\n // Styles and classes\n conditionalColumnClasses,\n conditionalColumnSeparatorClasses,\n conditionalColumnsClasses,\n\n // Selecting\n allItemsSelectedCheckboxState,\n isSelectColumn,\n onAllRowSelect,\n\n // Sorting\n conditionalSortDirectionClasses,\n sortByColumnField,\n getSortingColumnDirection,\n\n // Resizing\n startResize,\n isResizing,\n\n // Event handlers\n dataGridColumnEvents,\n\n // Dragging\n draggingEventsForColumn,\n\n // Contextual menu\n contextualMenuData,\n\n // Enums\n BentoButtonVariant,\n BentoDatagridSortDirection,\n BentoTypographyElement,\n BentoPopoverPositions,\n DatagridColumnsEvent,\n };\n },\n });\n</script>\n\n<style lang=\"scss\" scoped>\n @import 'data-grid-columns';\n</style>\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\" 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-settings__a' + uuid + ')'\"><path fill=\"#00112C\" fill-rule=\"evenodd\" d=\"M8.75 1C8.75 0.585786 8.41421 0.25 8 0.25C7.58579 0.25 7.25 0.585786 7.25 1V1.2979C6.57635 1.37321 5.91783 1.54959 5.29672 1.82106L5.15026 1.56623C4.94387 1.2071 4.48542 1.08329 4.12629 1.28969C3.76716 1.49608 3.64335 1.95453 3.84974 2.31366L3.99751 2.57078C3.45281 2.97189 2.97145 3.45265 2.56967 3.99684L2.31372 3.84974C1.95459 3.64335 1.49614 3.76716 1.28975 4.12629C1.08335 4.48542 1.20717 4.94387 1.56629 5.15026L1.81832 5.29511C1.54577 5.91658 1.36849 6.57567 1.29247 7.25H1C0.585786 7.25 0.25 7.58579 0.25 8C0.25 8.41421 0.585786 8.75 1 8.75H1.29249C1.36851 9.42433 1.54581 10.0834 1.81837 10.7049L1.56629 10.8497C1.20717 11.0561 1.08335 11.5146 1.28975 11.8737C1.49614 12.2328 1.95459 12.3567 2.31372 12.1503L2.56974 12.0031C2.97151 12.5473 3.45284 13.028 3.99752 13.4291L3.84974 13.6862C3.64335 14.0454 3.76716 14.5038 4.12629 14.7102C4.48542 14.9166 4.94387 14.7928 5.15027 14.4337L5.29669 14.1789C5.91781 14.4504 6.57634 14.6267 7.25 14.7021V15C7.25 15.4142 7.58579 15.75 8 15.75C8.41421 15.75 8.75 15.4142 8.75 15V14.7021C9.42366 14.6267 10.0822 14.4504 10.7033 14.1789L10.8497 14.4337C11.0561 14.7928 11.5146 14.9166 11.8737 14.7102C12.2328 14.5038 12.3567 14.0454 12.1503 13.6862L12.0025 13.4291C12.5472 13.028 13.0285 12.5473 13.4303 12.0031L13.6863 12.1503C14.0454 12.3567 14.5039 12.2328 14.7103 11.8737C14.9167 11.5146 14.7928 11.0561 14.4337 10.8497L14.1817 10.7049C14.4542 10.0834 14.6315 9.42433 14.7075 8.75H15C15.4142 8.75 15.75 8.41421 15.75 8C15.75 7.58579 15.4142 7.25 15 7.25H14.7075C14.6315 6.57567 14.4542 5.91659 14.1817 5.29512L14.4337 5.15027C14.7928 4.94387 14.9167 4.48542 14.7103 4.12629C14.5039 3.76716 14.0454 3.64335 13.6863 3.84974L13.4303 3.99685C13.0285 3.45266 12.5472 2.9719 12.0025 2.57079L12.1503 2.31366C12.3567 1.95453 12.2328 1.49608 11.8737 1.28969C11.5146 1.08329 11.0561 1.2071 10.8497 1.56623L10.7033 1.82106C10.0822 1.54959 9.42365 1.37321 8.75 1.2979V1ZM3.46027 10.6263C3.46894 10.6414 3.47703 10.6567 3.48455 10.6721C3.81553 11.2301 4.24603 11.7202 4.75273 12.119L6.02977 9.90977C5.87643 9.75181 5.74113 9.57619 5.62698 9.38602L5.62041 9.37508C5.5299 9.2183 5.45553 9.0535 5.39784 8.88345C5.36087 8.77446 5.33077 8.66327 5.30773 8.55053C5.27085 8.37007 5.25205 8.18563 5.25205 7.99994C5.25205 7.51721 5.37912 7.04299 5.62048 6.62494L5.62686 6.61388C5.74103 6.4237 5.87643 6.24812 6.02979 6.09014L4.75273 3.88083C4.24621 4.27955 3.81584 4.76943 3.4849 5.32721C3.47729 5.34287 3.46908 5.35839 3.46027 5.37372C3.45059 5.39055 3.44036 5.40687 3.42962 5.42266C2.98528 6.20874 2.75106 7.09641 2.75 7.99994C2.75106 8.90376 2.98543 9.79172 3.43005 10.578C3.44064 10.5936 3.45072 10.6097 3.46027 10.6263ZM9.22412 7.75044C9.24103 7.83222 9.24976 7.9158 9.25 7.99998C9.24939 8.21721 9.19217 8.4305 9.08403 8.61885C8.96887 8.80892 8.80952 8.96837 8.61952 9.08363C8.43083 9.1913 8.21731 9.24795 8 9.24795C7.78331 9.24795 7.57039 9.19162 7.3821 9.08455C7.19161 8.96935 7.03182 8.80977 6.91637 8.61945C6.876 8.5487 6.84279 8.47445 6.81706 8.39782C6.80127 8.35077 6.78829 8.30283 6.77819 8.25425C6.76089 8.17096 6.75208 8.08579 6.75208 8.00002C6.75208 7.78271 6.80873 7.56919 6.91639 7.38051C7.03152 7.19073 7.19073 7.03152 7.38051 6.91639C7.56919 6.80873 7.78271 6.75208 8.00002 6.75208C8.21734 6.75208 8.43085 6.80873 8.61954 6.91639C8.80954 7.03165 8.96889 7.1911 9.08405 7.38117C9.12468 7.45192 9.15811 7.52619 9.18406 7.60287C9.20042 7.6512 9.21379 7.70048 9.22412 7.75044ZM10.6447 7.24995H13.1953C13.102 6.60939 12.8908 5.98951 12.5703 5.4225C12.5596 5.40676 12.5494 5.39049 12.5397 5.37372C12.531 5.35844 12.5228 5.34299 12.5152 5.32739C12.0559 4.55324 11.4051 3.90987 10.625 3.45947C9.8269 2.99869 8.92157 2.7561 8 2.7561C7.33041 2.7561 6.66938 2.88417 6.05183 3.13095L7.32631 5.3358C7.54562 5.28038 7.77186 5.252 8 5.252C8.48273 5.252 8.95695 5.37907 9.375 5.62043L9.38606 5.62681C9.79104 5.86991 10.1299 6.20898 10.373 6.61395L10.3788 6.62358C10.4505 6.74721 10.5122 6.87582 10.5635 7.00811C10.5944 7.08748 10.6214 7.16818 10.6447 7.24995ZM6.05183 12.869L7.3263 10.6642C7.54562 10.7196 7.77187 10.748 8.00002 10.748C8.48275 10.748 8.95697 10.6209 9.37502 10.3795L9.38602 10.3731C9.791 10.13 10.13 9.791 10.3731 9.38602L10.3788 9.37636C10.4935 9.17854 10.5826 8.96807 10.6448 8.75H13.1953C13.102 9.3907 12.8907 10.0107 12.5701 10.5778C12.5594 10.5935 12.5493 10.6096 12.5397 10.6263C12.531 10.6415 12.5229 10.6568 12.5154 10.6723C12.0574 11.4444 11.4089 12.0864 10.6317 12.5366L10.6263 12.5397L10.6183 12.5443C9.82186 13.0026 8.919 13.2438 8 13.2438C7.33041 13.2438 6.66938 13.1158 6.05183 12.869Z\" clip-rule=\"evenodd\"/></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 scoped lang=\"scss\">\n svg {\n display: inline-flex;\n flex-shrink: 0;\n }\n \n svg,\n svg * {\n fill: currentcolor;\n }\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=\"BentoToggleLabelPosition.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 { BentoTypographyElement, BentoTypographyVariant } from '@/components/typography';\n import { BentoToggle, BentoToggleLabelPosition } 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 // Enum\n BentoToggleLabelPosition,\n BentoTypographyElement,\n BentoTypographyVariant,\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-seperator\">\n <div class=\"b-data-grid-config-settings__column-separator\"></div>\n <div class=\"b-data-grid-config-settings__button-container\">\n <bento-button\n ref=\"configSettingsButtonRef\"\n :aria-controls=\"isConfigSettingsPanelOpen ? popoverId : null\"\n :variant=\"BentoButtonVariant.TERTIARY\"\n @click=\"setConfigSettingsPanelVisibility(!isConfigSettingsPanelOpen)\"\n >\n <template #iconLeft>\n <bento-settings-icon :svg-title=\"$t('toggleConfigSettingsPanelVisibility')\" />\n </template>\n </bento-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=\"BentoPopoverPositions.BOTTOM\"\n >\n <div class=\"b-data-grid-config-settings__panel-header\">\n <bento-typography :el=\"BentoTypographyElement.SPAN\" strongest>\n {{ $t('displayOptions') }}\n </bento-typography>\n <bento-button :variant=\"BentoButtonVariant.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\n class=\"b-data-grid-config-settings__condensed-view-title\"\n :el=\"BentoTypographyElement.SPAN\"\n stronger\n >\n {{ $t('size') }}\n </bento-typography>\n <bento-toggle\n :label-position=\"BentoToggleLabelPosition.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\n class=\"b-data-grid-config-settings__column-visibility-title\"\n :el=\"BentoTypographyElement.SPAN\"\n stronger\n >\n {{ $t('columns') }}\n </bento-typography>\n <bento-button\n v-if=\"!isColumnVisibilityFilterShown\"\n :variant=\"BentoButtonVariant.TERTIARY\"\n @click=\"toggleColumnFilter\"\n >\n <template #iconLeft>\n <bento-search-icon />\n </template>\n {{ $t('search') }}\n </bento-button>\n <bento-button v-else :variant=\"BentoButtonVariant.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=\"BentoToggleLabelPosition.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=\"BentoTypographyElement.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, BentoPopoverPositions } from '@/components/popover';\n import { BentoButton, BentoButtonVariant } from '@/components/button';\n import { BentoTypography, BentoTypographyElement, BentoTypographyVariant } from '@/components/typography';\n import { BentoToggle, BentoToggleLabelPosition } 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 BentoCrossIcon,\n BentoPopover,\n BentoSettingsIcon,\n BentoButton,\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 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.bentoInputField.focusInput());\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 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 // Enum\n BentoToggleLabelPosition,\n BentoTypographyElement,\n BentoTypographyVariant,\n BentoButtonVariant,\n BentoPopoverPositions,\n };\n },\n });\n</script>\n\n<style lang=\"scss\" scoped src=\"./data-grid-config-settings.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 v-if=\"filters\" class=\"b-data-grid__filters\">\n <bento-filter-bar\n v-if=\"filters\"\n :value=\"filters\"\n :search-term=\"filterSearchTerm\"\n @search-input=\"onSearchTermInput\"\n @search-clear=\"onSearchTermCleared\"\n @input=\"filters => $emit(BentoDatagridEvent.UPDATE_FILTERS, filters)\"\n />\n </div>\n <div v-if=\"$slots.header\" class=\"b-data-grid__header\">\n <slot name=\"header\"></slot>\n </div>\n <div\n ref=\"body\"\n class=\"b-data-grid__body\"\n :tabindex=\"loading ? '0' : '-1'\"\n :aria-busy=\"loading\"\n :style=\"fitContent ? { height: bodyDynamicStyles.height.value } : undefined\"\n aria-live=\"polite\"\n >\n <bento-data-grid-config-settings\n v-if=\"columnPanel\"\n class=\"b-data-grid__config-settings\"\n :style=\"configSettingsButtonStyle\"\n :columns=\"columns\"\n :condensed=\"condensed\"\n @config-settings=\"onConfigSettingsUpdate\"\n @update:columns=\"onConfigSettingsColumnsUpdate\"\n />\n <div ref=\"columnsRef\" role=\"rowgroup\" class=\"b-data-grid__columns-row\">\n <div\n :style=\"gridColumnWidthStyle\"\n class=\"b-data-grid__columns\"\n role=\"row\"\n :class=\"conditionalColumnsClasses\"\n >\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 :columns=\"columnSet\"\n :has-resizable-columns=\"hasResizableColumns\"\n :sort-by=\"sortBy\"\n :all-items-selected-state=\"allItemsSelectedState\"\n :is-frozen-columns=\"isFrozenColumns\"\n :dragging-columns=\"draggingColumns\"\n :has-draggable-columns=\"allowColumnDragAndDrop\"\n :has-column-panel=\"columnPanel\"\n :has-first-column-panel-right-aligned=\"index === computedColumnPanelAlignment\"\n :is-only-one-visible-column=\"isOnlyOneVisibleColumn\"\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 @sort=\"onSort\"\n @column-menu-open=\"isColumnMenuOpen = true\"\n @column-menu-close=\"isColumnMenuOpen = false\"\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 v-if=\"loading\" class=\"b-data-grid__loading\">\n <bento-loading-indicator class=\"b-data-grid__loading-indicator\" large />\n <bento-typography :el=\"BentoTypographyElement.SPAN\" :variant=\"BentoTypographyVariant.CAPTION\">{{\n t('gettingYourData')\n }}</bento-typography>\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)\"\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=\"conditionalRowSetClasses(isFrozenColumns)\"\n :data-testid=\"`data-grid-${id}-rows`\"\n >\n <div\n v-for=\"(column, colIndex) in columnSet\"\n :key=\"`cell-${column.field}`\"\n ref=\"gridcellRefs\"\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=\"{ width: `${column.width}px` }\"\n v-on=\"gridcellEvents(column)\"\n >\n <template v-if=\"column.field !== DATAGRID_SELECT_FIELD_NAME\">\n <bento-typography :el=\"BentoTypographyElement.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 </template>\n <template v-else>\n <bento-checkbox\n :aria-label=\"t('selectRow')\"\n :model-value=\"selectedItems\"\n :disabled=\"isDataItemDisabled(rowData)\"\n :value=\"getDataItemId(rowData)\"\n @update:model-value=\"onRowSelect\"\n />\n </template>\n </div>\n </div>\n </template>\n </div>\n </div>\n </div>\n <div\n v-if=\"pagination\"\n ref=\"paginationRef\"\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 </div>\n</template>\n\n<script lang=\"ts\">\n import { computed, defineComponent, PropType, ref, toRef, toRefs } from 'vue';\n import { useCalculateBodyFitContentDynamicStyles } from './composables/useCalculateBodyFitContentDynamicStyles/useCalculateBodyFitContentDynamicStyles';\n import { useAriaLabel } from '@/utils/ts/aria-label';\n import { BentoCheckbox } from '@/components/checkbox';\n import { BentoPagination } from '@/components/pagination';\n import { BentoLoadingIndicator } from '@/components/loading-indicator';\n import { Booleanish } from '@/types';\n import {\n BentoColumn,\n BentoColumnOverflow,\n BentoDatagridData,\n BentoDatagridDataItem,\n BentoDatagridDataItemId,\n BentoDatagridEvent,\n BentoDatagridGetDataItemIdFn,\n BentoDatagridIsDataItemDisabledFn,\n BentoDatagridPaginationProps,\n BentoDatagridSortByColumn,\n BentoDatagridSortDirection,\n BentoDatagridStyleState,\n } from './data-grid.types';\n import { BentoTypography, BentoTypographyElement, BentoTypographyVariant } from '@/components/typography';\n import { BentoDataGridConfigSettings, DataGridColumns } from './components';\n import {\n DATAGRID_SELECT_FIELD_NAME,\n useCalculateColumnWidth,\n useColumnReorderer,\n useConfigSettings,\n useKeyboardNavigator,\n useSelector,\n } from './composables';\n import { getSlotText } from '@/utils/ts/get-slot-text';\n import { useI18n } from '@/utils/ts/i18n';\n import BentoFilterBar from '@/components/filter-bar/filter-bar.vue';\n import messages from './messages.json';\n import { isDevelopmentEnviroment } from '@/utils/ts/dev-environment';\n\n type MessageSchema = (typeof messages)['en-US'];\n\n export default defineComponent({\n i18n: { messages },\n name: 'bento-data-grid',\n components: {\n BentoCheckbox,\n DataGridColumns,\n BentoDataGridConfigSettings,\n BentoLoadingIndicator,\n BentoPagination,\n BentoFilterBar,\n BentoTypography,\n },\n props: {\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 * 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 * filter-bar value (i.e. filters) that will be passed down to inner filter-bar component\n */\n filters: {\n type: BentoFilterBar.props.value.type,\n default: undefined,\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 * 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 * 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 * 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 * 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 emits: [\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_FILTERS,\n BentoDatagridEvent.UPDATE_FILTER_SEARCH_TERM,\n BentoDatagridEvent.UPDATE_PAGINATION,\n BentoDatagridEvent.UPDATE_SELECTION,\n BentoDatagridEvent.UPDATE_SORT_BY,\n BentoDatagridEvent.ROW_CLICK,\n BentoDatagridEvent.SELECT,\n BentoDatagridEvent.SORT,\n ],\n setup(props, { emit, slots }) {\n /* == Variables and references == */\n // Create refs for elements\n const body = ref<HTMLDivElement>(null);\n const columnsRef = ref<HTMLDivElement>();\n const gridcellRefs = ref<HTMLDivElement[]>(null);\n const { columns, selectable, data, selection, allowColumnDragAndDrop } = toRefs(props);\n const { t } = useI18n<{ message: MessageSchema }>({ messages });\n\n /* == Composable logic == */\n // Column width calculation\n const { columnDefs, onColumnWidthOverride, gridColumnWidthStyle } = useCalculateColumnWidth(columns, body, {\n hasSelectableColumn: selectable,\n });\n\n // Calculate dynamic heights on fitContent\n const paginationRef = ref<HTMLDivElement>(null);\n const bodyDynamicStyles = useCalculateBodyFitContentDynamicStyles({\n paginationRef,\n fitContent: toRef(props, 'fitContent'),\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 // 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 /* == Styles == */\n // Conditional grid classes\n const conditionalGridClasses = computed(() => ({\n [`b-data-grid--${BentoDatagridStyleState.OUTLINE}`]: props.outline,\n [`b-data-grid--${BentoDatagridStyleState.FIT_CONTENT}`]: props.fitContent,\n }));\n\n const computedColumnPanelAlignment = computed(() => columnSets.value.findIndex(el => el.columnSet.length));\n\n // Conditional row classes\n const conditionalRowClasses = (row: BentoDatagridDataItem) => ({\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': props.highlightedRows.includes(row.id),\n });\n const conditionalRowSetClasses = (isFrozenRowSet: boolean) => ({\n 'b-data-grid__row-cell-set--frozen': isFrozenRowSet,\n 'b-data-grid__row-cell-set--unfrozen': !isFrozenRowSet,\n 'b-data-grid__row-cell-set--config-settings-margin': !isFrozenRowSet && props.columnPanel,\n });\n const conditionalRowCellClasses = (column: BentoColumn) => ({\n 'b-data-grid__cell--padding-left-unset': column?.padding?.left === false,\n 'b-data-grid__cell--padding-right-unset': column?.padding?.right === false,\n 'b-data-grid__cell--numeric': column?.numeric,\n 'b-data-grid__cell--condensed': props.condensed,\n 'b-data-grid__cell--frozen': column?.frozen,\n [`b-data-grid__cell--overflow-${BentoColumnOverflow.ELLIPSIS}`]:\n column?.overflow === BentoColumnOverflow.ELLIPSIS,\n 'b-data-grid__cell--is-column-re-ordering': draggingColumns.dragging?.field === column.field,\n 'b-data-grid__cell--is-column-re-order-target-left':\n draggingColumns.target?.field === column.field && draggingColumns?.dragToLeft,\n 'b-data-grid__cell--is-column-re-order-target-right':\n draggingColumns.target?.field === column.field && !draggingColumns?.dragToLeft,\n });\n\n const isColumnMenuOpen = ref(false);\n\n const conditionalColumnsClasses = computed(() => ({\n 'b-data-grid__columns--menu-open': isColumnMenuOpen.value,\n }));\n\n const conditionalTitleAttribute = (column: BentoColumn, content: unknown) =>\n column?.overflow === BentoColumnOverflow.ELLIPSIS ? `${content}` : undefined;\n\n const getRowData = (rowData: unknown) => rowData ?? '-';\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,\n }));\n\n // Get the columns header height and use for the height of the config settings button overlay\n const configSettingsButtonStyle = computed(() => ({\n height: `${columnsRef.value?.clientHeight}px`,\n }));\n\n // TODO: Fix the issue where users provide components into the slot\n // a11y grid header label text\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 /* == Emits == */\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) => {\n emit(BentoDatagridEvent.NAVIGATE, page);\n emit(BentoDatagridEvent.UPDATE_PAGINATION, {\n ...props.pagination,\n page,\n });\n };\n const onItemsPerPageChange = (itemsPerPage: number) => emit(BentoDatagridEvent.ITEMS_PAGE, itemsPerPage);\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 // Row selecting\n const onRowClick = (row: BentoDatagridDataItem, event: MouseEvent) => {\n if (props.allowRowClicks) {\n emit(BentoDatagridEvent.ROW_CLICK, row, event);\n }\n };\n // Keyboard navigation\n const columnsCount = 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 const sortedGridCellRefs = computed(() =>\n [...gridcellRefs.value].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 const { focusOnNextGridcell, isNavigationKeyCode } = useKeyboardNavigator(sortedGridCellRefs, columnsCount);\n const navigationInput = (event: KeyboardEvent) => {\n const { ctrlKey, keyCode, target } = event;\n\n const isFocusedOnGridcell = gridcellRefs.value.includes(target as HTMLDivElement);\n if (isFocusedOnGridcell && isNavigationKeyCode(keyCode)) {\n focusOnNextGridcell(target, keyCode, ctrlKey);\n }\n };\n const updateScrollPositionOnFrozenColumnsNavigation = () => {\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 const gridcellEvents = column => {\n const events: { [eventName: string]: (e: Event) => void } = {\n ...draggingEventsForRowCell.value(column),\n };\n if (column.frozen) {\n events.focus = updateScrollPositionOnFrozenColumnsNavigation;\n }\n return events;\n };\n const getColIndex = (colIndex: number, colSetIndex: number) =>\n colIndex + columnSets.value.length * colSetIndex;\n const getCellindex = (rowIndex: number, colIndex: number, colSetIndex: number) =>\n columns.value.length * rowIndex + getColIndex(colIndex, colSetIndex);\n\n const hasMandatoryColumn = computed(() => columns.value.some(column => column.mandatory));\n\n if (!hasMandatoryColumn.value && isDevelopmentEnviroment()) {\n // eslint-disable-next-line no-console\n console.warn(\n 'WARNING: At least one BentoDataGrid column should be set as mandatory to ensure data is always displayed correctly.'\n );\n }\n\n return {\n // Refs\n body,\n columnDefs,\n columnSets,\n gridcellRefs,\n isColumnMenuOpen,\n\n // Calculate dynamic fit-content height\n paginationRef,\n bodyDynamicStyles,\n\n // $scopedSlots/$slots children\n slots,\n\n // Labels and text\n ariaGridHeaderText,\n conditionalTitleAttribute,\n getRowData,\n\n // Styles and classes\n gridColumnWidthStyle,\n conditionalGridClasses,\n conditionalRowClasses,\n conditionalRowSetClasses,\n conditionalRowCellClasses,\n conditionalPaginationClasses,\n conditionalColumnsClasses,\n\n // Resizing\n onColumnWidthOverride,\n onColumnResized,\n\n // Sorting\n onSort,\n\n // Select\n allItemsSelectedState,\n selectedItems,\n onAllRowSelect,\n onRowSelect,\n DATAGRID_SELECT_FIELD_NAME,\n onRowClick,\n getRowAriaSelectedValue,\n\n // Config settings (and column updating)\n onConfigSettingsUpdate,\n onConfigSettingsColumnsUpdate,\n onConfigSettingsColumnUpdate,\n columnsRef,\n configSettingsButtonStyle,\n isOnlyOneVisibleColumn,\n\n // Enums\n BentoDatagridSortDirection,\n BentoTypographyElement,\n BentoTypographyVariant,\n BentoDatagridEvent,\n\n // Pagination props and events\n onPaginationNavigate,\n onItemsPerPageChange,\n\n // Filterbar events\n onSearchTermCleared,\n onSearchTermInput,\n\n // Re-ordering columns\n onMoveColumnByOffset,\n draggingColumns,\n draggingEventsForColumns,\n draggingEventsForRowCell,\n\n // Leftmost column panel alignment\n computedColumnPanelAlignment,\n\n // Gridcells events\n gridcellEvents,\n\n // Keyboard navigation\n getCellindex,\n getColIndex,\n navigationInput,\n\n // Translations\n t,\n };\n },\n });\n</script>\n\n<style lang=\"scss\" scoped src=\"./data-grid.scss\" />@/utils/ts/dev-environment\n"],"names":["useCalculateBodyFitContentDynamicStyles","paginationRef","fitContent","height","ref","paginationElementObserver","onMounted","nextTick","stop","watch","observeSizeOfElement","_a","onUnmounted","BentoColumnOverflow","BentoColumnOverflow2","BentoDatagridStyleState","BentoDatagridStyleState2","BentoDatagridSortDirection","BentoDatagridSortDirection2","BentoDatagridEvent","BentoDatagridEvent2","BentoDatagridAriaSortValue","BentoDatagridAriaSortValue2","DatagridColumnsEvent","DatagridColumnsEvent2","useResizer","columns","emit","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","hasResizableColumns","listen","useResizer$1","DEFAULT_COLUMN_WIDTH","DEFAULT_COLUMN_MIN_WIDTH","DATAGRID_SELECT_FIELD_NAME","computeFlexColumnsWidth","initialFreeSpace","totalFlexUnits","flexCols","flexColumnsLookup","frozenColumnKeys","freezeColumn","value","processFlexItems","violationsLookup","remainingFreeSpace","flexUnits","totalViolation","i","flexColsLength","column","computedWidth","key","useCalculateColumnWidth","newColumns","bodyRef","options","body","gridWidth","bodyElementObserver","caclulatedWidths","widthAllocatedBeforeFlex","columnsLookup","columnDefs","fluidCol","computedColumnWidths","onColumnWidthOverride","newColumnWidthOverridesLookup","processedColumns","_b","totalWidthOfAllColumns","val","gridColumnWidthStyle","useCalculateColumnWidth$1","useSorter","sortBy","direction","sortedCol","updatedSortBy","useSelector","selection","data","getDataItemId","isDataItemDisabled","selectedItems","allItemsSelectedState","emitSelect","onAllRowSelect","allItemsSelected","dataItem","onRowSelect","isEveryItemSelected","item","BentoDatagridNavigationKeyCode","BentoDatagridNavigationKeyCode2","KeyCode","useKeyboardNavigator","gridcellRefs","columnsCount","getCurrentRowIndex","currentIndex","getEdgeCellIndex","ctrlKey","lastCellIndex","lastColumnIndex","currentRowIndex","currentColumn","getCellIndex","directionDiff","newCellIndex","isEdgeNavigationKeyCode","keyCode","getTargetCellIndex","target","directionKeyCode","currentCellIndex","cellIndex","useColumnReorderer","columnsRef","hasDraggableColumnsRef","hasDraggableColumns","draggingColumns","onMoveColumnByOffset","movingColumn","offset","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","uuid$6","_sfc_main$a","uuid$5","_sfc_main$9","uuid$4","_sfc_main$8","uuid$3","_sfc_main$7","uuid$2","_sfc_main$6","uuid$1","_sfc_main$5","_sfc_main$4","defineComponent","messages$3","BentoCheckbox","BentoInfoIcon","BentoTypography","BentoMenu","TriangleUp","TriangleDown","props","t","useI18n","allItemsSelectedCheckboxState","areAllItemsSelected","isSelectColumn","startResize","conditionalSortDirectionClasses","sortByColumnField","getSortingColumnDirection","sortingDirection","draggingEventsForColumn","contextualMenuData","ArrowLeftIcon","ArrowRightIcon","BentoFreezeIcon","HideIcon","ShowIcon","dataGridColumnEvents","events","conditionalColumnsClasses","conditionalColumnClasses","_d","_c","_f","_e","_g","_i","_h","_j","conditionalColumnSeparatorClasses","BentoButtonVariant","BentoTypographyElement","BentoPopoverPositions","DatagridConfigSettingsEvent","DatagridConfigSettingsEvent2","uuid","_sfc_main$3","_sfc_main$2","messages$2","BentoToggle","isFreezeIconOptionShown","isColumnFrozen","isColumnVisible","toggleColumnVisibility","toggleColumnFreeze","showFreezeIcon","hideFreezeIcon","freezeIconConditionalClasses","BentoToggleLabelPosition","BentoTypographyVariant","_sfc_main$1","messages$1","CrossIcon","BentoPopover","BentoSettingsIcon","BentoButton","BentoDataGridConfigSettingsConfigRow","BentoSearchBar","SearchIcon","BentoClickOutsideDirective","configSettingsButtonRef","popoverId","generateUid","searchBarRef","isConfigSettingsPanelOpen","allColumnsVisbilityToggleState","searchTerm","toRef","isColumnVisibilityFilterShown","filteredColumnVisibilityColumns","useSearchBarFilter","clearAction","areAllNonMandatoryColumnsHidden","toggleColumnFilter","isColumnVisibilityToggleDisabled","emitVisibleColumns","toggleAllColumnVisibility","toggleState","emitFrozenColumns","setConfigSettingsPanelVisibility","isVisible","_sfc_main","messages","DataGridColumns","BentoDataGridConfigSettings","BentoLoadingIndicator","BentoPagination","BentoFilterBar","slots","selectable","allowColumnDragAndDrop","bodyDynamicStyles","sortedColumns","onConfigSettingsColumnUpdate","conditionalGridClasses","computedColumnPanelAlignment","el","conditionalRowClasses","row","conditionalRowSetClasses","isFrozenRowSet","conditionalRowCellClasses","isColumnMenuOpen","conditionalTitleAttribute","content","getRowData","rowData","conditionalPaginationClasses","configSettingsButtonStyle","ariaGridHeaderText","useAriaLabel","getSlotText","getRowAriaSelectedValue","id","onColumnResized","resizeEvent","onSort","onPaginationNavigate","page","onItemsPerPageChange","itemsPerPage","onSearchTermCleared","onSearchTermInput","newSearchTerm","onRowClick","visibleColumns","visible","sortedGridCellRefs","b","indexA","indexB","focusOnNextGridcell","isNavigationKeyCode","navigationInput","updateScrollPositionOnFrozenColumnsNavigation","gridcellEvents","getColIndex","colIndex","colSetIndex","getCellindex","rowIndex","isDevelopmentEnviroment"],"mappings":"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","x_google_ignoreList":[11,12,13,14,15,16,19]}