@vuu-ui/vuu-table-extras 1.0.2 → 2.0.0-alpha.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (187) hide show
  1. package/cjs/{column-expression-panel/ColumnExpressionPanel.js → calculated-column/CalculatedColumnPanel.js} +13 -13
  2. package/cjs/calculated-column/CalculatedColumnPanel.js.map +1 -0
  3. package/cjs/{column-expression-panel/useColumnExpression.js → calculated-column/useCalculatedColumnPanel.js} +12 -10
  4. package/cjs/calculated-column/useCalculatedColumnPanel.js.map +1 -0
  5. package/cjs/calculated-column/useEditCalculatedColumn.js +138 -0
  6. package/cjs/calculated-column/useEditCalculatedColumn.js.map +1 -0
  7. package/cjs/column-formatting-settings/BaseNumericFormattingSettings.js +1 -0
  8. package/cjs/column-formatting-settings/BaseNumericFormattingSettings.js.map +1 -1
  9. package/cjs/column-formatting-settings/ColumnFormattingPanel.js +1 -0
  10. package/cjs/column-formatting-settings/ColumnFormattingPanel.js.map +1 -1
  11. package/cjs/column-menu/ColumnMenu.js +2 -3
  12. package/cjs/column-menu/ColumnMenu.js.map +1 -1
  13. package/cjs/column-menu/column-menu-utils.js +3 -18
  14. package/cjs/column-menu/column-menu-utils.js.map +1 -1
  15. package/cjs/column-menu/useColumnActions.js +0 -2
  16. package/cjs/column-menu/useColumnActions.js.map +1 -1
  17. package/cjs/column-picker/ColumnModel.js +58 -0
  18. package/cjs/column-picker/ColumnModel.js.map +1 -1
  19. package/cjs/column-picker/ColumnPicker.css.js +1 -1
  20. package/cjs/column-picker/ColumnPicker.js +37 -14
  21. package/cjs/column-picker/ColumnPicker.js.map +1 -1
  22. package/cjs/column-picker/ColumnPickerAction.js +34 -0
  23. package/cjs/column-picker/ColumnPickerAction.js.map +1 -0
  24. package/cjs/column-picker/useColumnPicker.js +2 -1
  25. package/cjs/column-picker/useColumnPicker.js.map +1 -1
  26. package/cjs/column-picker/useTableColumnPicker.js +35 -0
  27. package/cjs/column-picker/useTableColumnPicker.js.map +1 -0
  28. package/cjs/column-settings-panel/ColumnNameLabel.js.map +1 -0
  29. package/cjs/{table-column-settings → column-settings-panel}/ColumnSettingsPanel.css.js +1 -1
  30. package/cjs/column-settings-panel/ColumnSettingsPanel.js +161 -0
  31. package/cjs/column-settings-panel/ColumnSettingsPanel.js.map +1 -0
  32. package/cjs/{table-column-settings → column-settings-panel}/useColumnSettings.js +42 -79
  33. package/cjs/column-settings-panel/useColumnSettings.js.map +1 -0
  34. package/cjs/column-settings-panel/useTableAndColumnSettings.js +37 -0
  35. package/cjs/column-settings-panel/useTableAndColumnSettings.js.map +1 -0
  36. package/cjs/datasource-stats/DatasourceStats.css.js +1 -1
  37. package/cjs/index.js +22 -17
  38. package/cjs/index.js.map +1 -1
  39. package/cjs/tabbed-table-config-panel/TabbedTableConfigPanel.css.js +6 -0
  40. package/cjs/tabbed-table-config-panel/TabbedTableConfigPanel.css.js.map +1 -0
  41. package/cjs/tabbed-table-config-panel/TabbedTableConfigPanel.js +90 -0
  42. package/cjs/tabbed-table-config-panel/TabbedTableConfigPanel.js.map +1 -0
  43. package/cjs/tabbed-table-config-panel/TabbedTableSettingsAction.js +44 -0
  44. package/cjs/tabbed-table-config-panel/TabbedTableSettingsAction.js.map +1 -0
  45. package/cjs/tabbed-table-config-panel/useTabbedTableConfigPanel.js +49 -0
  46. package/cjs/tabbed-table-config-panel/useTabbedTableConfigPanel.js.map +1 -0
  47. package/cjs/table-footer/TableFooter.css.js +6 -0
  48. package/cjs/table-footer/TableFooter.css.js.map +1 -0
  49. package/cjs/table-footer/TableFooter.js +47 -0
  50. package/cjs/table-footer/TableFooter.js.map +1 -0
  51. package/cjs/{table-column-settings → table-settings-panel}/TableSettingsPanel.css.js +1 -1
  52. package/cjs/{table-column-settings → table-settings-panel}/TableSettingsPanel.js +12 -47
  53. package/cjs/table-settings-panel/TableSettingsPanel.js.map +1 -0
  54. package/cjs/table-settings-panel/useTableSettings.js +60 -0
  55. package/cjs/table-settings-panel/useTableSettings.js.map +1 -0
  56. package/esm/{column-expression-panel/ColumnExpressionPanel.js → calculated-column/CalculatedColumnPanel.js} +13 -13
  57. package/esm/calculated-column/CalculatedColumnPanel.js.map +1 -0
  58. package/esm/{column-expression-panel/useColumnExpression.js → calculated-column/useCalculatedColumnPanel.js} +12 -10
  59. package/esm/calculated-column/useCalculatedColumnPanel.js.map +1 -0
  60. package/esm/calculated-column/useEditCalculatedColumn.js +136 -0
  61. package/esm/calculated-column/useEditCalculatedColumn.js.map +1 -0
  62. package/esm/column-formatting-settings/BaseNumericFormattingSettings.js +1 -0
  63. package/esm/column-formatting-settings/BaseNumericFormattingSettings.js.map +1 -1
  64. package/esm/column-formatting-settings/ColumnFormattingPanel.js +1 -0
  65. package/esm/column-formatting-settings/ColumnFormattingPanel.js.map +1 -1
  66. package/esm/column-menu/ColumnMenu.js +2 -3
  67. package/esm/column-menu/ColumnMenu.js.map +1 -1
  68. package/esm/column-menu/column-menu-utils.js +3 -18
  69. package/esm/column-menu/column-menu-utils.js.map +1 -1
  70. package/esm/column-menu/useColumnActions.js +0 -2
  71. package/esm/column-menu/useColumnActions.js.map +1 -1
  72. package/esm/column-picker/ColumnModel.js +58 -0
  73. package/esm/column-picker/ColumnModel.js.map +1 -1
  74. package/esm/column-picker/ColumnPicker.css.js +1 -1
  75. package/esm/column-picker/ColumnPicker.js +39 -16
  76. package/esm/column-picker/ColumnPicker.js.map +1 -1
  77. package/esm/column-picker/ColumnPickerAction.js +32 -0
  78. package/esm/column-picker/ColumnPickerAction.js.map +1 -0
  79. package/esm/column-picker/useColumnPicker.js +2 -1
  80. package/esm/column-picker/useColumnPicker.js.map +1 -1
  81. package/esm/column-picker/useTableColumnPicker.js +33 -0
  82. package/esm/column-picker/useTableColumnPicker.js.map +1 -0
  83. package/esm/column-settings-panel/ColumnNameLabel.js.map +1 -0
  84. package/esm/{table-column-settings → column-settings-panel}/ColumnSettingsPanel.css.js +1 -1
  85. package/esm/column-settings-panel/ColumnSettingsPanel.js +159 -0
  86. package/esm/column-settings-panel/ColumnSettingsPanel.js.map +1 -0
  87. package/esm/{table-column-settings → column-settings-panel}/useColumnSettings.js +44 -81
  88. package/esm/column-settings-panel/useColumnSettings.js.map +1 -0
  89. package/esm/column-settings-panel/useTableAndColumnSettings.js +33 -0
  90. package/esm/column-settings-panel/useTableAndColumnSettings.js.map +1 -0
  91. package/esm/datasource-stats/DatasourceStats.css.js +1 -1
  92. package/esm/index.js +10 -7
  93. package/esm/index.js.map +1 -1
  94. package/esm/tabbed-table-config-panel/TabbedTableConfigPanel.css.js +4 -0
  95. package/esm/tabbed-table-config-panel/TabbedTableConfigPanel.css.js.map +1 -0
  96. package/esm/tabbed-table-config-panel/TabbedTableConfigPanel.js +88 -0
  97. package/esm/tabbed-table-config-panel/TabbedTableConfigPanel.js.map +1 -0
  98. package/esm/tabbed-table-config-panel/TabbedTableSettingsAction.js +42 -0
  99. package/esm/tabbed-table-config-panel/TabbedTableSettingsAction.js.map +1 -0
  100. package/esm/tabbed-table-config-panel/useTabbedTableConfigPanel.js +47 -0
  101. package/esm/tabbed-table-config-panel/useTabbedTableConfigPanel.js.map +1 -0
  102. package/esm/table-footer/TableFooter.css.js +4 -0
  103. package/esm/table-footer/TableFooter.css.js.map +1 -0
  104. package/esm/table-footer/TableFooter.js +44 -0
  105. package/esm/table-footer/TableFooter.js.map +1 -0
  106. package/esm/{table-column-settings → table-settings-panel}/TableSettingsPanel.css.js +1 -1
  107. package/esm/{table-column-settings → table-settings-panel}/TableSettingsPanel.js +13 -48
  108. package/esm/table-settings-panel/TableSettingsPanel.js.map +1 -0
  109. package/esm/table-settings-panel/useTableSettings.js +58 -0
  110. package/esm/table-settings-panel/useTableSettings.js.map +1 -0
  111. package/package.json +12 -11
  112. package/types/calculated-column/CalculatedColumnPanel.d.ts +12 -0
  113. package/types/calculated-column/useCalculatedColumnPanel.d.ts +10 -0
  114. package/types/calculated-column/useEditCalculatedColumn.d.ts +13 -0
  115. package/types/column-menu/column-action-types.d.ts +1 -4
  116. package/types/column-menu/column-menu-utils.d.ts +4 -4
  117. package/types/column-picker/ColumnModel.d.ts +26 -3
  118. package/types/column-picker/ColumnPicker.d.ts +7 -3
  119. package/types/column-picker/ColumnPickerAction.d.ts +5 -0
  120. package/types/column-picker/useColumnPicker.d.ts +5 -4
  121. package/types/column-picker/useTableColumnPicker.d.ts +7 -0
  122. package/types/column-picker/useTableColumnPickerDeprecated.d.ts +14 -0
  123. package/types/{table-column-settings → column-settings-panel}/ColumnNameLabel.d.ts +1 -1
  124. package/types/column-settings-panel/ColumnSettingsPanel.d.ts +5 -0
  125. package/types/{table-column-settings → column-settings-panel}/useColumnSettings.d.ts +14 -7
  126. package/types/column-settings-panel/useTableAndColumnSettings.d.ts +13 -0
  127. package/types/index.d.ts +11 -9
  128. package/types/tabbed-table-config-panel/TabbedTableConfigPanel.d.ts +17 -0
  129. package/types/tabbed-table-config-panel/TabbedTableSettingsAction.d.ts +7 -0
  130. package/types/tabbed-table-config-panel/useTabbedTableConfigPanel.d.ts +13 -0
  131. package/types/table-footer/TableFooter.d.ts +9 -0
  132. package/types/table-settings-panel/TableSettingsPanel.d.ts +22 -0
  133. package/types/table-settings-panel/useTableSettings.d.ts +14 -0
  134. package/cjs/column-expression-panel/ColumnExpressionPanel.js.map +0 -1
  135. package/cjs/column-expression-panel/useColumnExpression.js.map +0 -1
  136. package/cjs/column-list/ColumnList.css.js +0 -6
  137. package/cjs/column-list/ColumnList.css.js.map +0 -1
  138. package/cjs/column-list/ColumnList.js +0 -218
  139. package/cjs/column-list/ColumnList.js.map +0 -1
  140. package/cjs/column-list/useColumnList.js +0 -66
  141. package/cjs/column-list/useColumnList.js.map +0 -1
  142. package/cjs/table-column-settings/ColumnNameLabel.js.map +0 -1
  143. package/cjs/table-column-settings/ColumnSettingsPanel.js +0 -202
  144. package/cjs/table-column-settings/ColumnSettingsPanel.js.map +0 -1
  145. package/cjs/table-column-settings/TableSettingsPanel.js.map +0 -1
  146. package/cjs/table-column-settings/useColumnSettings.js.map +0 -1
  147. package/cjs/table-column-settings/useTableAndColumnSettings.js +0 -129
  148. package/cjs/table-column-settings/useTableAndColumnSettings.js.map +0 -1
  149. package/cjs/table-column-settings/useTableSettings.js +0 -176
  150. package/cjs/table-column-settings/useTableSettings.js.map +0 -1
  151. package/esm/column-expression-panel/ColumnExpressionPanel.js.map +0 -1
  152. package/esm/column-expression-panel/useColumnExpression.js.map +0 -1
  153. package/esm/column-list/ColumnList.css.js +0 -4
  154. package/esm/column-list/ColumnList.css.js.map +0 -1
  155. package/esm/column-list/ColumnList.js +0 -214
  156. package/esm/column-list/ColumnList.js.map +0 -1
  157. package/esm/column-list/useColumnList.js +0 -64
  158. package/esm/column-list/useColumnList.js.map +0 -1
  159. package/esm/table-column-settings/ColumnNameLabel.js.map +0 -1
  160. package/esm/table-column-settings/ColumnSettingsPanel.js +0 -200
  161. package/esm/table-column-settings/ColumnSettingsPanel.js.map +0 -1
  162. package/esm/table-column-settings/TableSettingsPanel.js.map +0 -1
  163. package/esm/table-column-settings/useColumnSettings.js.map +0 -1
  164. package/esm/table-column-settings/useTableAndColumnSettings.js +0 -125
  165. package/esm/table-column-settings/useTableAndColumnSettings.js.map +0 -1
  166. package/esm/table-column-settings/useTableSettings.js +0 -174
  167. package/esm/table-column-settings/useTableSettings.js.map +0 -1
  168. package/types/column-expression-panel/ColumnExpressionPanel.d.ts +0 -13
  169. package/types/column-expression-panel/index.d.ts +0 -1
  170. package/types/column-expression-panel/useColumnExpression.d.ts +0 -10
  171. package/types/column-list/ColumnList.d.ts +0 -11
  172. package/types/column-list/index.d.ts +0 -2
  173. package/types/column-list/useColumnList.d.ts +0 -22
  174. package/types/table-column-settings/ColumnSettingsPanel.d.ts +0 -2
  175. package/types/table-column-settings/TableSettingsPanel.d.ts +0 -9
  176. package/types/table-column-settings/useTableAndColumnSettings.d.ts +0 -18
  177. package/types/table-column-settings/useTableSettings.d.ts +0 -18
  178. /package/cjs/{table-column-settings → column-settings-panel}/ColumnNameLabel.css.js +0 -0
  179. /package/cjs/{table-column-settings → column-settings-panel}/ColumnNameLabel.css.js.map +0 -0
  180. /package/cjs/{table-column-settings → column-settings-panel}/ColumnNameLabel.js +0 -0
  181. /package/cjs/{table-column-settings → column-settings-panel}/ColumnSettingsPanel.css.js.map +0 -0
  182. /package/cjs/{table-column-settings → table-settings-panel}/TableSettingsPanel.css.js.map +0 -0
  183. /package/esm/{table-column-settings → column-settings-panel}/ColumnNameLabel.css.js +0 -0
  184. /package/esm/{table-column-settings → column-settings-panel}/ColumnNameLabel.css.js.map +0 -0
  185. /package/esm/{table-column-settings → column-settings-panel}/ColumnNameLabel.js +0 -0
  186. /package/esm/{table-column-settings → column-settings-panel}/ColumnSettingsPanel.css.js.map +0 -0
  187. /package/esm/{table-column-settings → table-settings-panel}/TableSettingsPanel.css.js.map +0 -0
@@ -1,218 +0,0 @@
1
- 'use strict';
2
-
3
- var jsxRuntime = require('react/jsx-runtime');
4
- var core = require('@salt-ds/core');
5
- var styles = require('@salt-ds/styles');
6
- var window = require('@salt-ds/window');
7
- var vuuUiControls = require('@vuu-ui/vuu-ui-controls');
8
- var vuuUtils = require('@vuu-ui/vuu-utils');
9
- var cx = require('clsx');
10
- var react = require('react');
11
- var useColumnList = require('./useColumnList.js');
12
- var ColumnList$1 = require('./ColumnList.css.js');
13
- var vuuTable = require('@vuu-ui/vuu-table');
14
-
15
- const classBase = "vuuColumnList";
16
- const classBaseListItem = "vuuColumnListItem";
17
- const searchIcon = /* @__PURE__ */ jsxRuntime.jsx("span", { "data-icon": "search" });
18
- const NO_SELECTION = [];
19
- const useSorting = (id, index, allowSort = true) => {
20
- const { handleRef: sortableHandleRef, ref: sortableRef } = vuuUtils.useSortable({
21
- id,
22
- index
23
- });
24
- const noopRef = react.useCallback(() => {
25
- }, []);
26
- const [handleRef, ref] = react.useMemo(() => {
27
- return allowSort ? [sortableHandleRef, sortableRef] : [noopRef, noopRef];
28
- }, [allowSort, noopRef, sortableHandleRef, sortableRef]);
29
- return {
30
- handleRef,
31
- ref
32
- };
33
- };
34
- const defaultPermissions = {
35
- allowColumnSearch: false,
36
- allowHideColumns: true,
37
- allowRemoveColumns: true,
38
- allowReorderColumns: true
39
- };
40
- const ColumnListItem = ({
41
- className: classNameProp,
42
- index,
43
- item,
44
- permissions: { allowHideColumns, allowRemoveColumns, allowReorderColumns },
45
- searchPattern = "",
46
- ...optionProps
47
- }) => {
48
- const hideOnly = allowHideColumns && !allowRemoveColumns;
49
- const removeOnly = !allowHideColumns && allowRemoveColumns;
50
- const hideAndRemove = allowHideColumns && allowRemoveColumns;
51
- const { handleRef, ref } = useSorting(item.name, index, allowReorderColumns);
52
- const value = vuuUtils.getColumnLabel(item);
53
- const valueWithHighlighting = vuuTable.useHighlighting(value, searchPattern);
54
- return /* @__PURE__ */ jsxRuntime.jsxs(
55
- core.Option,
56
- {
57
- ...optionProps,
58
- className: cx(classNameProp, classBaseListItem),
59
- "data-name": item.name,
60
- id: item.name,
61
- ref,
62
- children: [
63
- allowReorderColumns ? /* @__PURE__ */ jsxRuntime.jsx(
64
- vuuUiControls.IconButton,
65
- {
66
- "data-embedded": true,
67
- appearance: "transparent",
68
- icon: "draggable",
69
- ref: handleRef,
70
- size: 16
71
- }
72
- ) : null,
73
- item?.isCalculated ? /* @__PURE__ */ jsxRuntime.jsx(vuuUiControls.Icon, { name: "function" }) : null,
74
- hideAndRemove || hideOnly || removeOnly ? /* @__PURE__ */ jsxRuntime.jsx(
75
- core.Checkbox,
76
- {
77
- className: `${classBase}-checkBox`,
78
- checked: hideOnly ? item?.hidden !== true : item?.subscribed
79
- }
80
- ) : null,
81
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: `${classBase}-text`, children: valueWithHighlighting }),
82
- hideAndRemove ? /* @__PURE__ */ jsxRuntime.jsx(
83
- core.Switch,
84
- {
85
- className: `${classBase}-switch`,
86
- checked: item?.hidden !== true,
87
- disabled: item?.subscribed !== true
88
- }
89
- ) : null
90
- ]
91
- }
92
- );
93
- };
94
- const ColumnList = ({
95
- className,
96
- columnItems,
97
- onChange,
98
- onNavigateToColumn,
99
- onReorderColumnItems,
100
- permissions: {
101
- allowColumnSearch = defaultPermissions.allowColumnSearch,
102
- allowHideColumns = defaultPermissions.allowHideColumns,
103
- allowRemoveColumns = defaultPermissions.allowRemoveColumns,
104
- allowReorderColumns = defaultPermissions.allowReorderColumns
105
- } = defaultPermissions,
106
- ...htmlAttributes
107
- }) => {
108
- const targetWindow = window.useWindow();
109
- styles.useComponentCssInjection({
110
- testId: "vuu-column-list",
111
- css: ColumnList$1,
112
- window: targetWindow
113
- });
114
- const listRef = react.useRef(null);
115
- const permissions = react.useMemo(
116
- () => ({
117
- allowHideColumns,
118
- allowRemoveColumns,
119
- allowReorderColumns
120
- }),
121
- [allowHideColumns, allowRemoveColumns, allowReorderColumns]
122
- );
123
- const {
124
- onChangeListItem,
125
- onChangeSearchInput,
126
- searchState,
127
- visibleColumnItems
128
- } = useColumnList.useColumnList({
129
- classBase,
130
- classBaseListItem,
131
- columnItems,
132
- permissions,
133
- onChange
134
- });
135
- const handleClick = react.useCallback(
136
- (evt) => {
137
- const targetEl = evt.target;
138
- if (targetEl.classList.contains("vuuColumnList-text")) {
139
- const listItemEl = targetEl.closest(".vuuListItem");
140
- if (listItemEl?.dataset.name) {
141
- onNavigateToColumn?.(listItemEl.dataset.name);
142
- }
143
- }
144
- },
145
- [onNavigateToColumn]
146
- );
147
- const handleDragEnd = react.useCallback(() => {
148
- setTimeout(() => {
149
- const listItems = listRef.current?.querySelectorAll(".saltOption");
150
- if (listItems) {
151
- const orderedIds = Array.from(listItems).map(({ id }) => id);
152
- onReorderColumnItems?.(vuuUtils.reorderColumnItems(columnItems, orderedIds));
153
- }
154
- }, 300);
155
- }, [columnItems, onReorderColumnItems]);
156
- const searchCallbackRef = react.useCallback((el) => {
157
- setTimeout(() => {
158
- el?.querySelector("input")?.focus();
159
- }, 100);
160
- }, []);
161
- const handleToggleAll = react.useCallback(() => {
162
- console.log("toggle all");
163
- }, []);
164
- return /* @__PURE__ */ jsxRuntime.jsx(vuuUtils.DragDropProvider, { onDragEnd: handleDragEnd, children: /* @__PURE__ */ jsxRuntime.jsxs(
165
- "div",
166
- {
167
- ...htmlAttributes,
168
- className: cx(classBase, className, {
169
- [`${classBase}-withColumnNavigation`]: typeof onNavigateToColumn === "function"
170
- }),
171
- children: [
172
- allowColumnSearch ? /* @__PURE__ */ jsxRuntime.jsx("form", { className: `${classBase}-search`, role: "search", children: /* @__PURE__ */ jsxRuntime.jsx(
173
- core.Input,
174
- {
175
- startAdornment: searchIcon,
176
- placeholder: "Find column",
177
- ref: searchCallbackRef,
178
- value: searchState.searchText,
179
- onChange: onChangeSearchInput
180
- }
181
- ) }) : null,
182
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `${classBase}-header`, children: [
183
- allowHideColumns || allowRemoveColumns ? /* @__PURE__ */ jsxRuntime.jsx(
184
- core.Checkbox,
185
- {
186
- className: `${classBase}-checkBox`,
187
- checked: false,
188
- onClick: handleToggleAll
189
- }
190
- ) : null,
191
- /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Column Name" })
192
- ] }),
193
- allowHideColumns && allowRemoveColumns ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `${classBase}-colHeadings`, children: [
194
- /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Column subscription" }),
195
- /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Visibility" })
196
- ] }) : null,
197
- /* @__PURE__ */ jsxRuntime.jsx(core.ListBox, { ref: listRef, selected: NO_SELECTION, children: visibleColumnItems.map((columnItem, index) => /* @__PURE__ */ jsxRuntime.jsx(
198
- ColumnListItem,
199
- {
200
- item: columnItem,
201
- index,
202
- onChange: onChangeListItem,
203
- onClick: handleClick,
204
- permissions,
205
- searchPattern: searchState.searchText.toLowerCase(),
206
- value: columnItem
207
- },
208
- columnItem.name
209
- )) })
210
- ]
211
- }
212
- ) });
213
- };
214
-
215
- exports.ColumnList = ColumnList;
216
- exports.classBase = classBase;
217
- exports.classBaseListItem = classBaseListItem;
218
- //# sourceMappingURL=ColumnList.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"ColumnList.js","sources":["../../../../packages/vuu-table-extras/src/column-list/ColumnList.tsx"],"sourcesContent":["import {\n Checkbox,\n Input,\n ListBox,\n Option,\n OptionProps,\n Switch,\n} from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport {\n ColumnDescriptor,\n ColumnListPermissions,\n} from \"@vuu-ui/vuu-table-types\";\nimport { Icon, IconButton } from \"@vuu-ui/vuu-ui-controls\";\nimport {\n DragDropProvider,\n getColumnLabel,\n reorderColumnItems,\n useSortable,\n} from \"@vuu-ui/vuu-utils\";\nimport cx from \"clsx\";\nimport {\n HTMLAttributes,\n MouseEventHandler,\n RefCallback,\n useCallback,\n useMemo,\n useRef,\n} from \"react\";\nimport {\n type ColumnItem,\n type ColumnSearchProps,\n useColumnList,\n} from \"./useColumnList\";\n\nimport cssColumnList from \"./ColumnList.css\";\nimport { useHighlighting } from \"@vuu-ui/vuu-table\";\n\nexport const classBase = \"vuuColumnList\";\nexport const classBaseListItem = \"vuuColumnListItem\";\n\nconst searchIcon = <span data-icon=\"search\" />;\nconst NO_SELECTION: string[] = [] as const;\n\nconst useSorting = (id: string, index: number, allowSort = true) => {\n const { handleRef: sortableHandleRef, ref: sortableRef } = useSortable({\n id,\n index,\n });\n\n const noopRef = useCallback(() => {\n // do nothing\n }, []);\n\n const [handleRef, ref] = useMemo(() => {\n return allowSort ? [sortableHandleRef, sortableRef] : [noopRef, noopRef];\n }, [allowSort, noopRef, sortableHandleRef, sortableRef]);\n\n return {\n handleRef,\n ref,\n };\n};\n\nexport interface ColumnListProps\n extends Pick<ColumnSearchProps, \"columnItems\" | \"onChange\">,\n Omit<HTMLAttributes<HTMLDivElement>, \"onChange\"> {\n onNavigateToColumn?: (columnName: string) => void;\n onReorderColumnItems?: (columnItems: ColumnItem[]) => void;\n permissions?: ColumnListPermissions;\n}\n\nconst defaultPermissions: ColumnListPermissions = {\n allowColumnSearch: false,\n allowHideColumns: true,\n allowRemoveColumns: true,\n allowReorderColumns: true,\n};\n\nconst ColumnListItem = ({\n className: classNameProp,\n index,\n item,\n permissions: { allowHideColumns, allowRemoveColumns, allowReorderColumns },\n searchPattern = \"\",\n ...optionProps\n}: OptionProps & {\n index: number;\n item: ColumnItem;\n permissions: ColumnListPermissions;\n searchPattern?: Lowercase<string>;\n}) => {\n const hideOnly = allowHideColumns && !allowRemoveColumns;\n const removeOnly = !allowHideColumns && allowRemoveColumns;\n const hideAndRemove = allowHideColumns && allowRemoveColumns;\n\n const { handleRef, ref } = useSorting(item.name, index, allowReorderColumns);\n const value = getColumnLabel(item as ColumnDescriptor);\n const valueWithHighlighting = useHighlighting(value, searchPattern);\n\n return (\n <Option\n {...optionProps}\n className={cx(classNameProp, classBaseListItem)}\n data-name={item.name}\n id={item.name}\n ref={ref}\n >\n {allowReorderColumns ? (\n <IconButton\n data-embedded\n appearance=\"transparent\"\n icon=\"draggable\"\n ref={handleRef}\n size={16}\n />\n ) : null}\n {item?.isCalculated ? <Icon name=\"function\" /> : null}\n {hideAndRemove || hideOnly || removeOnly ? (\n <Checkbox\n className={`${classBase}-checkBox`}\n checked={hideOnly ? item?.hidden !== true : item?.subscribed}\n />\n ) : null}\n <span className={`${classBase}-text`}>{valueWithHighlighting}</span>\n {hideAndRemove ? (\n <Switch\n className={`${classBase}-switch`}\n checked={item?.hidden !== true}\n disabled={item?.subscribed !== true}\n />\n ) : null}\n </Option>\n );\n};\n\nexport const ColumnList = ({\n className,\n columnItems,\n onChange,\n onNavigateToColumn,\n onReorderColumnItems,\n permissions: {\n allowColumnSearch = defaultPermissions.allowColumnSearch,\n allowHideColumns = defaultPermissions.allowHideColumns,\n allowRemoveColumns = defaultPermissions.allowRemoveColumns,\n allowReorderColumns = defaultPermissions.allowReorderColumns,\n } = defaultPermissions,\n ...htmlAttributes\n}: ColumnListProps) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"vuu-column-list\",\n css: cssColumnList,\n window: targetWindow,\n });\n const listRef = useRef<HTMLDivElement>(null);\n const permissions = useMemo(\n () => ({\n allowHideColumns,\n allowRemoveColumns,\n allowReorderColumns,\n }),\n [allowHideColumns, allowRemoveColumns, allowReorderColumns],\n );\n\n const {\n onChangeListItem,\n onChangeSearchInput,\n searchState,\n visibleColumnItems,\n } = useColumnList({\n classBase,\n classBaseListItem,\n columnItems,\n permissions,\n onChange,\n });\n\n const handleClick = useCallback<MouseEventHandler>(\n (evt) => {\n const targetEl = evt.target as HTMLElement;\n if (targetEl.classList.contains(\"vuuColumnList-text\")) {\n const listItemEl = targetEl.closest(\".vuuListItem\") as HTMLElement;\n if (listItemEl?.dataset.name) {\n onNavigateToColumn?.(listItemEl.dataset.name);\n }\n }\n },\n [onNavigateToColumn],\n );\n\n const handleDragEnd = useCallback(() => {\n setTimeout(() => {\n const listItems =\n listRef.current?.querySelectorAll<HTMLDivElement>(\".saltOption\");\n if (listItems) {\n const orderedIds = Array.from(listItems).map(({ id }) => id);\n onReorderColumnItems?.(reorderColumnItems(columnItems, orderedIds));\n }\n }, 300);\n }, [columnItems, onReorderColumnItems]);\n\n const searchCallbackRef = useCallback<RefCallback<HTMLElement>>((el) => {\n setTimeout(() => {\n el?.querySelector(\"input\")?.focus();\n }, 100);\n }, []);\n\n const handleToggleAll = useCallback(() => {\n console.log(\"toggle all\");\n }, []);\n\n return (\n <DragDropProvider onDragEnd={handleDragEnd}>\n <div\n {...htmlAttributes}\n className={cx(classBase, className, {\n [`${classBase}-withColumnNavigation`]:\n typeof onNavigateToColumn === \"function\",\n })}\n >\n {allowColumnSearch ? (\n <form className={`${classBase}-search`} role=\"search\">\n <Input\n startAdornment={searchIcon}\n placeholder=\"Find column\"\n ref={searchCallbackRef}\n value={searchState.searchText}\n onChange={onChangeSearchInput}\n />\n </form>\n ) : null}\n <div className={`${classBase}-header`}>\n {allowHideColumns || allowRemoveColumns ? (\n <Checkbox\n className={`${classBase}-checkBox`}\n checked={false}\n onClick={handleToggleAll}\n />\n ) : null}\n\n <span>Column Name</span>\n </div>\n {allowHideColumns && allowRemoveColumns ? (\n <div className={`${classBase}-colHeadings`}>\n <span>Column subscription</span>\n <span>Visibility</span>\n </div>\n ) : null}\n <ListBox ref={listRef} selected={NO_SELECTION}>\n {visibleColumnItems.map((columnItem, index) => (\n <ColumnListItem\n item={columnItem}\n index={index}\n key={columnItem.name}\n onChange={onChangeListItem}\n onClick={handleClick}\n permissions={permissions}\n searchPattern={\n searchState.searchText.toLowerCase() as Lowercase<string>\n }\n value={columnItem}\n />\n ))}\n </ListBox>\n </div>\n </DragDropProvider>\n );\n};\n"],"names":["jsx","useSortable","useCallback","useMemo","getColumnLabel","useHighlighting","jsxs","Option","IconButton","Icon","Checkbox","Switch","useWindow","useComponentCssInjection","cssColumnList","useRef","useColumnList","reorderColumnItems","DragDropProvider","Input","ListBox"],"mappings":"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"}
@@ -1,66 +0,0 @@
1
- 'use strict';
2
-
3
- var react = require('react');
4
- var vuuUtils = require('@vuu-ui/vuu-utils');
5
-
6
- const useColumnList = ({
7
- classBase,
8
- classBaseListItem,
9
- columnItems,
10
- onChange,
11
- permissions: { allowHideColumns, allowRemoveColumns }
12
- }) => {
13
- const [searchState, setSearchState] = react.useState({ searchText: "" });
14
- const visibleColumnsRef = react.useRef(void 0);
15
- const hideOnly = react.useMemo(
16
- () => allowHideColumns && !allowRemoveColumns,
17
- [allowHideColumns, allowRemoveColumns]
18
- );
19
- react.useMemo(() => {
20
- const value = searchState.searchText.toLowerCase();
21
- if (value) {
22
- const pattern = value.toLowerCase();
23
- visibleColumnsRef.current = columnItems.filter(
24
- ({ name, label = name }) => label.toLowerCase().indexOf(pattern) !== -1
25
- );
26
- } else {
27
- visibleColumnsRef.current = void 0;
28
- }
29
- }, [columnItems, searchState.searchText]);
30
- const handleChangeSearchInput = react.useCallback((evt) => {
31
- const { value } = evt.target;
32
- setSearchState({
33
- searchText: value
34
- });
35
- }, []);
36
- const handleChangeListItem = react.useCallback(
37
- ({ target }) => {
38
- const input = target;
39
- const listItem = vuuUtils.queryClosest(target, `.${classBaseListItem}`);
40
- if (listItem) {
41
- const {
42
- dataset: { name }
43
- } = listItem;
44
- if (name) {
45
- const saltCheckbox = vuuUtils.queryClosest(target, `.${classBase}-checkBox`);
46
- const saltSwitch = vuuUtils.queryClosest(target, `.${classBase}-switch`);
47
- if (saltCheckbox && !hideOnly) {
48
- onChange(name, "subscribed", input.checked);
49
- } else if (saltSwitch || hideOnly) {
50
- onChange(name, "hidden", input.checked === false);
51
- }
52
- }
53
- }
54
- },
55
- [classBase, classBaseListItem, hideOnly, onChange]
56
- );
57
- return {
58
- onChangeSearchInput: handleChangeSearchInput,
59
- onChangeListItem: handleChangeListItem,
60
- searchState,
61
- visibleColumnItems: visibleColumnsRef.current ?? columnItems
62
- };
63
- };
64
-
65
- exports.useColumnList = useColumnList;
66
- //# sourceMappingURL=useColumnList.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useColumnList.js","sources":["../../../../packages/vuu-table-extras/src/column-list/useColumnList.ts"],"sourcesContent":["import {\n ColumnDescriptor,\n ColumnListPermissions,\n} from \"@vuu-ui/vuu-table-types\";\nimport {\n FormEventHandler,\n SyntheticEvent,\n useCallback,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport { queryClosest } from \"@vuu-ui/vuu-utils\";\n\nexport type ColumnChangeHandler = (\n columnName: string,\n propertyName: keyof ColumnDescriptor | \"subscribed\",\n value: string | number | boolean,\n) => void;\n\nexport type ColumnItem = Pick<\n ColumnDescriptor,\n \"hidden\" | \"label\" | \"name\" | \"serverDataType\"\n> & {\n isCalculated: boolean;\n subscribed: boolean;\n};\n\nexport interface ColumnSearchProps {\n classBase: string;\n classBaseListItem: string;\n columnItems: ColumnItem[];\n onChange: ColumnChangeHandler;\n permissions: ColumnListPermissions;\n}\n\nexport const useColumnList = ({\n classBase,\n classBaseListItem,\n columnItems,\n onChange,\n permissions: { allowHideColumns, allowRemoveColumns },\n}: ColumnSearchProps) => {\n const [searchState, setSearchState] = useState<{\n searchText: string;\n }>({ searchText: \"\" });\n\n const visibleColumnsRef = useRef<ColumnItem[] | undefined>(undefined);\n\n const hideOnly = useMemo(\n () => allowHideColumns && !allowRemoveColumns,\n [allowHideColumns, allowRemoveColumns],\n );\n\n useMemo(() => {\n const value = searchState.searchText.toLowerCase();\n if (value) {\n const pattern = value.toLowerCase();\n visibleColumnsRef.current = columnItems.filter(\n ({ name, label = name }) => label.toLowerCase().indexOf(pattern) !== -1,\n );\n } else {\n visibleColumnsRef.current = undefined;\n }\n }, [columnItems, searchState.searchText]);\n\n const handleChangeSearchInput = useCallback<FormEventHandler>((evt) => {\n const { value } = evt.target as HTMLInputElement;\n setSearchState({\n searchText: value,\n });\n }, []);\n\n const handleChangeListItem = useCallback(\n ({ target }: SyntheticEvent) => {\n const input = target as HTMLInputElement;\n const listItem = queryClosest(target, `.${classBaseListItem}`);\n if (listItem) {\n const {\n dataset: { name },\n } = listItem;\n if (name) {\n const saltCheckbox = queryClosest(target, `.${classBase}-checkBox`);\n const saltSwitch = queryClosest(target, `.${classBase}-switch`);\n\n if (saltCheckbox && !hideOnly) {\n onChange(name, \"subscribed\", input.checked);\n } else if (saltSwitch || hideOnly) {\n onChange(name, \"hidden\", input.checked === false);\n }\n }\n }\n },\n [classBase, classBaseListItem, hideOnly, onChange],\n );\n\n return {\n onChangeSearchInput: handleChangeSearchInput,\n onChangeListItem: handleChangeListItem,\n searchState,\n visibleColumnItems: visibleColumnsRef.current ?? columnItems,\n };\n};\n"],"names":["useState","useRef","useMemo","useCallback","queryClosest"],"mappings":";;;;;AAoCO,MAAM,gBAAgB,CAAC;AAAA,EAC5B,SAAA;AAAA,EACA,iBAAA;AAAA,EACA,WAAA;AAAA,EACA,QAAA;AAAA,EACA,WAAA,EAAa,EAAE,gBAAA,EAAkB,kBAAmB;AACtD,CAAyB,KAAA;AACvB,EAAM,MAAA,CAAC,aAAa,cAAc,CAAA,GAAIA,eAEnC,EAAE,UAAA,EAAY,IAAI,CAAA;AAErB,EAAM,MAAA,iBAAA,GAAoBC,aAAiC,KAAS,CAAA,CAAA;AAEpE,EAAA,MAAM,QAAW,GAAAC,aAAA;AAAA,IACf,MAAM,oBAAoB,CAAC,kBAAA;AAAA,IAC3B,CAAC,kBAAkB,kBAAkB;AAAA,GACvC;AAEA,EAAAA,aAAA,CAAQ,MAAM;AACZ,IAAM,MAAA,KAAA,GAAQ,WAAY,CAAA,UAAA,CAAW,WAAY,EAAA;AACjD,IAAA,IAAI,KAAO,EAAA;AACT,MAAM,MAAA,OAAA,GAAU,MAAM,WAAY,EAAA;AAClC,MAAA,iBAAA,CAAkB,UAAU,WAAY,CAAA,MAAA;AAAA,QACtC,CAAC,EAAE,IAAA,EAAM,KAAQ,GAAA,IAAA,EAAW,KAAA,KAAA,CAAM,WAAY,EAAA,CAAE,OAAQ,CAAA,OAAO,CAAM,KAAA,CAAA;AAAA,OACvE;AAAA,KACK,MAAA;AACL,MAAA,iBAAA,CAAkB,OAAU,GAAA,KAAA,CAAA;AAAA;AAC9B,GACC,EAAA,CAAC,WAAa,EAAA,WAAA,CAAY,UAAU,CAAC,CAAA;AAExC,EAAM,MAAA,uBAAA,GAA0BC,iBAA8B,CAAA,CAAC,GAAQ,KAAA;AACrE,IAAM,MAAA,EAAE,KAAM,EAAA,GAAI,GAAI,CAAA,MAAA;AACtB,IAAe,cAAA,CAAA;AAAA,MACb,UAAY,EAAA;AAAA,KACb,CAAA;AAAA,GACH,EAAG,EAAE,CAAA;AAEL,EAAA,MAAM,oBAAuB,GAAAA,iBAAA;AAAA,IAC3B,CAAC,EAAE,MAAA,EAA6B,KAAA;AAC9B,MAAA,MAAM,KAAQ,GAAA,MAAA;AACd,MAAA,MAAM,QAAW,GAAAC,qBAAA,CAAa,MAAQ,EAAA,CAAA,CAAA,EAAI,iBAAiB,CAAE,CAAA,CAAA;AAC7D,MAAA,IAAI,QAAU,EAAA;AACZ,QAAM,MAAA;AAAA,UACJ,OAAA,EAAS,EAAE,IAAK;AAAA,SACd,GAAA,QAAA;AACJ,QAAA,IAAI,IAAM,EAAA;AACR,UAAA,MAAM,YAAe,GAAAA,qBAAA,CAAa,MAAQ,EAAA,CAAA,CAAA,EAAI,SAAS,CAAW,SAAA,CAAA,CAAA;AAClE,UAAA,MAAM,UAAa,GAAAA,qBAAA,CAAa,MAAQ,EAAA,CAAA,CAAA,EAAI,SAAS,CAAS,OAAA,CAAA,CAAA;AAE9D,UAAI,IAAA,YAAA,IAAgB,CAAC,QAAU,EAAA;AAC7B,YAAS,QAAA,CAAA,IAAA,EAAM,YAAc,EAAA,KAAA,CAAM,OAAO,CAAA;AAAA,WAC5C,MAAA,IAAW,cAAc,QAAU,EAAA;AACjC,YAAA,QAAA,CAAS,IAAM,EAAA,QAAA,EAAU,KAAM,CAAA,OAAA,KAAY,KAAK,CAAA;AAAA;AAClD;AACF;AACF,KACF;AAAA,IACA,CAAC,SAAA,EAAW,iBAAmB,EAAA,QAAA,EAAU,QAAQ;AAAA,GACnD;AAEA,EAAO,OAAA;AAAA,IACL,mBAAqB,EAAA,uBAAA;AAAA,IACrB,gBAAkB,EAAA,oBAAA;AAAA,IAClB,WAAA;AAAA,IACA,kBAAA,EAAoB,kBAAkB,OAAW,IAAA;AAAA,GACnD;AACF;;;;"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"ColumnNameLabel.js","sources":["../../../../packages/vuu-table-extras/src/table-column-settings/ColumnNameLabel.tsx"],"sourcesContent":["import { ColumnDescriptor } from \"@vuu-ui/vuu-table-types\";\nimport cx from \"clsx\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport {\n getCalculatedColumnDetails,\n isCalculatedColumn,\n} from \"@vuu-ui/vuu-utils\";\nimport { MouseEventHandler } from \"react\";\n\nimport columnNameLabelCss from \"./ColumnNameLabel.css\";\n\nconst classBase = \"vuuColumnNameLabel\";\n\nexport interface ColumnNameLabelProps {\n column: ColumnDescriptor;\n onClick: MouseEventHandler;\n}\n\nexport const ColumnNameLabel = ({ column, onClick }: ColumnNameLabelProps) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"vuu-column-label\",\n css: columnNameLabelCss,\n window: targetWindow,\n });\n\n if (isCalculatedColumn(column.name)) {\n const { name, serverDataType, expression } =\n getCalculatedColumnDetails(column);\n const displayName = name || \"name\";\n const displayExpression = \"=expression\";\n\n const nameClass =\n displayName === \"name\" ? `${classBase}-placeholder` : undefined;\n const expressionClass =\n expression === \"\" ? `${classBase}-placeholder` : undefined;\n return (\n <div\n className={cx(classBase, `${classBase}-calculated`)}\n onClick={onClick}\n >\n <span className={nameClass}>{displayName}</span>\n <span>:</span>\n <span>{serverDataType || \"string\"}</span>\n <span>:</span>\n <span className={expressionClass}>{displayExpression}</span>\n <span className={`${classBase}-edit`} data-icon=\"edit\" />\n </div>\n );\n } else {\n return <div className={classBase}>{column.name}</div>;\n }\n};\n"],"names":["useWindow","useComponentCssInjection","columnNameLabelCss","isCalculatedColumn","getCalculatedColumnDetails","jsxs","jsx"],"mappings":";;;;;;;;;AAYA,MAAM,SAAY,GAAA,oBAAA;AAOX,MAAM,eAAkB,GAAA,CAAC,EAAE,MAAA,EAAQ,SAAoC,KAAA;AAC5E,EAAA,MAAM,eAAeA,gBAAU,EAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,kBAAA;AAAA,IACR,GAAK,EAAAC,iBAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAI,IAAAC,2BAAA,CAAmB,MAAO,CAAA,IAAI,CAAG,EAAA;AACnC,IAAA,MAAM,EAAE,IAAM,EAAA,cAAA,EAAgB,UAAW,EAAA,GACvCC,oCAA2B,MAAM,CAAA;AACnC,IAAA,MAAM,cAAc,IAAQ,IAAA,MAAA;AAC5B,IAAA,MAAM,iBAAoB,GAAA,aAAA;AAE1B,IAAA,MAAM,SACJ,GAAA,WAAA,KAAgB,MAAS,GAAA,CAAA,EAAG,SAAS,CAAiB,YAAA,CAAA,GAAA,KAAA,CAAA;AACxD,IAAA,MAAM,eACJ,GAAA,UAAA,KAAe,EAAK,GAAA,CAAA,EAAG,SAAS,CAAiB,YAAA,CAAA,GAAA,KAAA,CAAA;AACnD,IACE,uBAAAC,eAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,SAAW,EAAA,EAAA,CAAG,SAAW,EAAA,CAAA,EAAG,SAAS,CAAa,WAAA,CAAA,CAAA;AAAA,QAClD,OAAA;AAAA,QAEA,QAAA,EAAA;AAAA,0BAACC,cAAA,CAAA,MAAA,EAAA,EAAK,SAAW,EAAA,SAAA,EAAY,QAAY,EAAA,WAAA,EAAA,CAAA;AAAA,0BACzCA,cAAA,CAAC,UAAK,QAAC,EAAA,GAAA,EAAA,CAAA;AAAA,0BACPA,cAAA,CAAC,MAAM,EAAA,EAAA,QAAA,EAAA,cAAA,IAAkB,QAAS,EAAA,CAAA;AAAA,0BAClCA,cAAA,CAAC,UAAK,QAAC,EAAA,GAAA,EAAA,CAAA;AAAA,0BACNA,cAAA,CAAA,MAAA,EAAA,EAAK,SAAW,EAAA,eAAA,EAAkB,QAAkB,EAAA,iBAAA,EAAA,CAAA;AAAA,yCACpD,MAAK,EAAA,EAAA,SAAA,EAAW,GAAG,SAAS,CAAA,KAAA,CAAA,EAAS,aAAU,MAAO,EAAA;AAAA;AAAA;AAAA,KACzD;AAAA,GAEG,MAAA;AACL,IAAA,uBAAQA,cAAA,CAAA,KAAA,EAAA,EAAI,SAAW,EAAA,SAAA,EAAY,iBAAO,IAAK,EAAA,CAAA;AAAA;AAEnD;;;;"}
@@ -1,202 +0,0 @@
1
- 'use strict';
2
-
3
- var jsxRuntime = require('react/jsx-runtime');
4
- var vuuUiControls = require('@vuu-ui/vuu-ui-controls');
5
- var vuuUtils = require('@vuu-ui/vuu-utils');
6
- var core = require('@salt-ds/core');
7
- var styles = require('@salt-ds/styles');
8
- var window = require('@salt-ds/window');
9
- var cx = require('clsx');
10
- var ColumnExpressionPanel = require('../column-expression-panel/ColumnExpressionPanel.js');
11
- var ColumnFormattingPanel = require('../column-formatting-settings/ColumnFormattingPanel.js');
12
- require('react');
13
- var ColumnNameLabel = require('./ColumnNameLabel.js');
14
- var useColumnSettings = require('./useColumnSettings.js');
15
- var ColumnSettingsPanel$1 = require('./ColumnSettingsPanel.css.js');
16
-
17
- const classBase = "vuuColumnSettingsPanel";
18
- const getColumnLabel = (column) => {
19
- const { name, label } = column;
20
- if (vuuUtils.isCalculatedColumn(name)) {
21
- return label ?? vuuUtils.getCalculatedColumnDetails(column).name;
22
- } else {
23
- return label ?? name;
24
- }
25
- };
26
- const ColumnSettingsPanel = ({
27
- column: columnProp,
28
- onCancelCreateColumn,
29
- onConfigChange,
30
- onCreateCalculatedColumn,
31
- tableConfig,
32
- vuuTable
33
- }) => {
34
- const targetWindow = window.useWindow();
35
- styles.useComponentCssInjection({
36
- testId: "vuu-column-settings-panel",
37
- css: ColumnSettingsPanel$1,
38
- window: targetWindow
39
- });
40
- const isNewCalculatedColumn = columnProp.name === "::";
41
- const {
42
- availableRenderers,
43
- editCalculatedColumn,
44
- column,
45
- navigateNextColumn,
46
- navigatePrevColumn,
47
- onCancel,
48
- onChange,
49
- onChangeCalculatedColumnName,
50
- onChangeFormatting,
51
- onChangeRendering,
52
- onChangeServerDataType,
53
- onChangeToggleButton,
54
- onChangeType,
55
- onEditCalculatedColumn,
56
- onInputCommit,
57
- onSave
58
- } = useColumnSettings.useColumnSettings({
59
- column: columnProp,
60
- onCancelCreateColumn,
61
- onConfigChange,
62
- onCreateCalculatedColumn,
63
- tableConfig
64
- });
65
- const {
66
- serverDataType,
67
- align = vuuUtils.getDefaultAlignment(serverDataType),
68
- pin,
69
- width
70
- } = column;
71
- return /* @__PURE__ */ jsxRuntime.jsxs(
72
- "div",
73
- {
74
- className: cx(classBase, {
75
- [`${classBase}-editing`]: editCalculatedColumn
76
- }),
77
- children: [
78
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${classBase}-header`, children: /* @__PURE__ */ jsxRuntime.jsx(ColumnNameLabel.ColumnNameLabel, { column, onClick: onEditCalculatedColumn }) }),
79
- editCalculatedColumn ? /* @__PURE__ */ jsxRuntime.jsx(
80
- ColumnExpressionPanel.ColumnExpressionPanel,
81
- {
82
- column,
83
- onChangeName: onChangeCalculatedColumnName,
84
- onChangeServerDataType,
85
- tableConfig,
86
- vuuTable
87
- }
88
- ) : null,
89
- /* @__PURE__ */ jsxRuntime.jsxs(core.FormField, { "data-field": "column-label", children: [
90
- /* @__PURE__ */ jsxRuntime.jsx(core.FormFieldLabel, { children: "Column Label" }),
91
- /* @__PURE__ */ jsxRuntime.jsx(
92
- vuuUiControls.VuuInput,
93
- {
94
- className: "vuuInput",
95
- "data-embedded": true,
96
- onChange,
97
- onCommit: onInputCommit,
98
- value: getColumnLabel(column)
99
- }
100
- )
101
- ] }),
102
- /* @__PURE__ */ jsxRuntime.jsxs(core.FormField, { "data-field": "column-width", children: [
103
- /* @__PURE__ */ jsxRuntime.jsx(core.FormFieldLabel, { children: "Column Width" }),
104
- /* @__PURE__ */ jsxRuntime.jsx(
105
- vuuUiControls.VuuInput,
106
- {
107
- className: "vuuInput",
108
- "data-embedded": true,
109
- onChange,
110
- value: width,
111
- onCommit: onInputCommit
112
- }
113
- )
114
- ] }),
115
- /* @__PURE__ */ jsxRuntime.jsxs(core.FormField, { "data-field": "column-alignment", children: [
116
- /* @__PURE__ */ jsxRuntime.jsx(core.FormFieldLabel, { children: "Alignment" }),
117
- /* @__PURE__ */ jsxRuntime.jsxs(core.ToggleButtonGroup, { onChange: onChangeToggleButton, value: align, children: [
118
- /* @__PURE__ */ jsxRuntime.jsx(core.ToggleButton, { value: "left", children: /* @__PURE__ */ jsxRuntime.jsx(vuuUiControls.Icon, { name: "align-left", size: 16 }) }),
119
- /* @__PURE__ */ jsxRuntime.jsx(core.ToggleButton, { value: "right", children: /* @__PURE__ */ jsxRuntime.jsx(vuuUiControls.Icon, { name: "align-right", size: 16 }) })
120
- ] })
121
- ] }),
122
- /* @__PURE__ */ jsxRuntime.jsxs(core.FormField, { "data-field": "column-pin", children: [
123
- /* @__PURE__ */ jsxRuntime.jsx(core.FormFieldLabel, { children: "Pin Column" }),
124
- /* @__PURE__ */ jsxRuntime.jsxs(
125
- core.ToggleButtonGroup,
126
- {
127
- onChange: onChangeToggleButton,
128
- value: pin || "false",
129
- children: [
130
- /* @__PURE__ */ jsxRuntime.jsx(core.ToggleButton, { value: "left", children: /* @__PURE__ */ jsxRuntime.jsx(vuuUiControls.Icon, { name: "pin-left", size: 16 }) }),
131
- /* @__PURE__ */ jsxRuntime.jsx(core.ToggleButton, { value: "floating", children: /* @__PURE__ */ jsxRuntime.jsx(vuuUiControls.Icon, { name: "pin-float", size: 16 }) }),
132
- /* @__PURE__ */ jsxRuntime.jsx(core.ToggleButton, { value: "right", children: /* @__PURE__ */ jsxRuntime.jsx(vuuUiControls.Icon, { name: "pin-right", size: 16 }) }),
133
- /* @__PURE__ */ jsxRuntime.jsx(core.ToggleButton, { value: "", children: /* @__PURE__ */ jsxRuntime.jsx(vuuUiControls.Icon, { name: "cross-circle", size: 16 }) })
134
- ]
135
- }
136
- )
137
- ] }),
138
- /* @__PURE__ */ jsxRuntime.jsx(
139
- ColumnFormattingPanel.ColumnFormattingPanel,
140
- {
141
- availableRenderers,
142
- column,
143
- onChangeFormatting,
144
- onChangeRendering,
145
- onChangeColumnType: onChangeType
146
- }
147
- ),
148
- editCalculatedColumn ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "vuuColumnSettingsPanel-buttonBar", "data-align": "right", children: [
149
- /* @__PURE__ */ jsxRuntime.jsx(
150
- core.Button,
151
- {
152
- className: `${classBase}-buttonCancel`,
153
- onClick: onCancel,
154
- tabIndex: -1,
155
- children: "cancel"
156
- }
157
- ),
158
- /* @__PURE__ */ jsxRuntime.jsx(
159
- core.Button,
160
- {
161
- className: `${classBase}-buttonSave`,
162
- onClick: onSave,
163
- variant: "cta",
164
- children: "save"
165
- }
166
- )
167
- ] }) : /* @__PURE__ */ jsxRuntime.jsxs(
168
- "div",
169
- {
170
- className: `${classBase}-buttonBar`,
171
- "data-align": isNewCalculatedColumn ? "right" : void 0,
172
- children: [
173
- /* @__PURE__ */ jsxRuntime.jsx(
174
- core.Button,
175
- {
176
- className: `${classBase}-buttonNavPrev`,
177
- variant: "secondary",
178
- "data-icon": "arrow-left",
179
- onClick: navigatePrevColumn,
180
- children: "PREVIOUS"
181
- }
182
- ),
183
- /* @__PURE__ */ jsxRuntime.jsx(
184
- core.Button,
185
- {
186
- className: `${classBase}-buttonNavNext`,
187
- variant: "secondary",
188
- "data-icon": "arrow-right",
189
- onClick: navigateNextColumn,
190
- children: "NEXT"
191
- }
192
- )
193
- ]
194
- }
195
- )
196
- ]
197
- }
198
- );
199
- };
200
-
201
- exports.ColumnSettingsPanel = ColumnSettingsPanel;
202
- //# sourceMappingURL=ColumnSettingsPanel.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"ColumnSettingsPanel.js","sources":["../../../../packages/vuu-table-extras/src/table-column-settings/ColumnSettingsPanel.tsx"],"sourcesContent":["import { ColumnDescriptor, ColumnSettingsProps } from \"@vuu-ui/vuu-table-types\";\nimport { Icon, VuuInput } from \"@vuu-ui/vuu-ui-controls\";\nimport {\n getCalculatedColumnDetails,\n getDefaultAlignment,\n isCalculatedColumn,\n} from \"@vuu-ui/vuu-utils\";\nimport {\n Button,\n FormField,\n FormFieldLabel,\n ToggleButton,\n ToggleButtonGroup,\n} from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport cx from \"clsx\";\nimport { ColumnExpressionPanel } from \"../column-expression-panel\";\nimport { ColumnFormattingPanel } from \"../column-formatting-settings\";\nimport { ColumnNameLabel } from \"./ColumnNameLabel\";\nimport { useColumnSettings } from \"./useColumnSettings\";\n\nimport colunSettingsPanelCss from \"./ColumnSettingsPanel.css\";\n\nconst classBase = \"vuuColumnSettingsPanel\";\n\nconst getColumnLabel = (column: ColumnDescriptor) => {\n const { name, label } = column;\n if (isCalculatedColumn(name)) {\n return label ?? getCalculatedColumnDetails(column).name;\n } else {\n return label ?? name;\n }\n};\n\nexport const ColumnSettingsPanel = ({\n column: columnProp,\n onCancelCreateColumn,\n onConfigChange,\n onCreateCalculatedColumn,\n tableConfig,\n vuuTable,\n}: ColumnSettingsProps) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"vuu-column-settings-panel\",\n css: colunSettingsPanelCss,\n window: targetWindow,\n });\n\n const isNewCalculatedColumn = columnProp.name === \"::\";\n const {\n availableRenderers,\n editCalculatedColumn,\n column,\n navigateNextColumn,\n navigatePrevColumn,\n onCancel,\n onChange,\n onChangeCalculatedColumnName,\n onChangeFormatting,\n onChangeRendering,\n onChangeServerDataType,\n onChangeToggleButton,\n onChangeType,\n onEditCalculatedColumn,\n onInputCommit,\n onSave,\n } = useColumnSettings({\n column: columnProp,\n onCancelCreateColumn,\n onConfigChange,\n onCreateCalculatedColumn,\n tableConfig,\n });\n\n const {\n serverDataType,\n align = getDefaultAlignment(serverDataType),\n pin,\n width,\n } = column;\n\n return (\n <div\n className={cx(classBase, {\n [`${classBase}-editing`]: editCalculatedColumn,\n })}\n >\n <div className={`${classBase}-header`}>\n <ColumnNameLabel column={column} onClick={onEditCalculatedColumn} />\n </div>\n\n {editCalculatedColumn ? (\n <ColumnExpressionPanel\n column={column}\n onChangeName={onChangeCalculatedColumnName}\n onChangeServerDataType={onChangeServerDataType}\n tableConfig={tableConfig}\n vuuTable={vuuTable}\n />\n ) : null}\n\n <FormField data-field=\"column-label\">\n <FormFieldLabel>Column Label</FormFieldLabel>\n <VuuInput\n className=\"vuuInput\"\n data-embedded\n onChange={onChange}\n onCommit={onInputCommit}\n value={getColumnLabel(column)}\n />\n </FormField>\n\n <FormField data-field=\"column-width\">\n <FormFieldLabel>Column Width</FormFieldLabel>\n <VuuInput\n className=\"vuuInput\"\n data-embedded\n onChange={onChange}\n value={width}\n onCommit={onInputCommit}\n />\n </FormField>\n <FormField data-field=\"column-alignment\">\n <FormFieldLabel>Alignment</FormFieldLabel>\n <ToggleButtonGroup onChange={onChangeToggleButton} value={align}>\n <ToggleButton value=\"left\">\n <Icon name=\"align-left\" size={16} />\n </ToggleButton>\n <ToggleButton value=\"right\">\n <Icon name=\"align-right\" size={16} />\n </ToggleButton>\n </ToggleButtonGroup>\n </FormField>\n <FormField data-field=\"column-pin\">\n <FormFieldLabel>Pin Column</FormFieldLabel>\n <ToggleButtonGroup\n onChange={onChangeToggleButton}\n value={pin || \"false\"}\n >\n <ToggleButton value=\"left\">\n <Icon name=\"pin-left\" size={16} />\n </ToggleButton>\n <ToggleButton value=\"floating\">\n <Icon name=\"pin-float\" size={16} />\n </ToggleButton>\n <ToggleButton value=\"right\">\n <Icon name=\"pin-right\" size={16} />\n </ToggleButton>\n <ToggleButton value=\"\">\n <Icon name=\"cross-circle\" size={16} />\n </ToggleButton>\n </ToggleButtonGroup>\n </FormField>\n <ColumnFormattingPanel\n availableRenderers={availableRenderers}\n column={column}\n onChangeFormatting={onChangeFormatting}\n onChangeRendering={onChangeRendering}\n onChangeColumnType={onChangeType}\n />\n\n {editCalculatedColumn ? (\n <div className=\"vuuColumnSettingsPanel-buttonBar\" data-align=\"right\">\n <Button\n className={`${classBase}-buttonCancel`}\n onClick={onCancel}\n tabIndex={-1}\n >\n cancel\n </Button>\n <Button\n className={`${classBase}-buttonSave`}\n onClick={onSave}\n variant=\"cta\"\n >\n save\n </Button>\n </div>\n ) : (\n <div\n className={`${classBase}-buttonBar`}\n data-align={isNewCalculatedColumn ? \"right\" : undefined}\n >\n <Button\n className={`${classBase}-buttonNavPrev`}\n variant=\"secondary\"\n data-icon=\"arrow-left\"\n onClick={navigatePrevColumn}\n >\n PREVIOUS\n </Button>\n <Button\n className={`${classBase}-buttonNavNext`}\n variant=\"secondary\"\n data-icon=\"arrow-right\"\n onClick={navigateNextColumn}\n >\n NEXT\n </Button>\n </div>\n )}\n </div>\n );\n};\n"],"names":["isCalculatedColumn","getCalculatedColumnDetails","useWindow","useComponentCssInjection","colunSettingsPanelCss","useColumnSettings","getDefaultAlignment","jsxs","jsx","ColumnNameLabel","ColumnExpressionPanel","FormField","FormFieldLabel","VuuInput","ToggleButtonGroup","ToggleButton","Icon","ColumnFormattingPanel","Button"],"mappings":"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"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"TableSettingsPanel.js","sources":["../../../../packages/vuu-table-extras/src/table-column-settings/TableSettingsPanel.tsx"],"sourcesContent":["import {\n Button,\n FormField,\n FormFieldLabel,\n ToggleButton,\n ToggleButtonGroup,\n} from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport {\n TableSettingsPermissions,\n TableSettingsProps,\n} from \"@vuu-ui/vuu-table-types\";\nimport { ColumnList } from \"../column-list\";\nimport { useTableSettings } from \"./useTableSettings\";\nimport { Icon } from \"@vuu-ui/vuu-ui-controls\";\nimport { VuuInput } from \"@vuu-ui/vuu-ui-controls\";\nimport cx from \"clsx\";\n\nimport tableSettingsPanelCss from \"./TableSettingsPanel.css\";\n\nconst classBase = \"vuuTableSettingsPanel\";\n\nexport const defaultTableSettingsPermissions: Readonly<TableSettingsPermissions> =\n {\n allowColumnLabelCase: true,\n allowColumnDefaultWidth: true,\n allowGridSeparators: true,\n allowReorderColumns: true,\n allowRemoveColumns: true,\n allowHideColumns: true,\n allowCalculatedColumns: true,\n };\nexport const noTableSettingsPermissions: Readonly<TableSettingsPermissions> = {\n allowColumnLabelCase: false,\n allowColumnDefaultWidth: false,\n allowGridSeparators: false,\n allowReorderColumns: false,\n allowRemoveColumns: false,\n allowHideColumns: false,\n allowCalculatedColumns: false,\n};\n\n/**\n The TableSettingsPanel assumes 'ownership' of the tableSettings.\n It updates the settings in state locally and notifies caller of\n every change via onChange callback\n */\nexport const TableSettingsPanel = ({\n availableColumns,\n onAddCalculatedColumn,\n onConfigChange,\n onDataSourceConfigChange,\n onNavigateToColumn,\n tableConfig: tableConfigProp,\n permissions: permissionsProp,\n}: TableSettingsProps) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"vuu-table-settings-panel\",\n css: tableSettingsPanelCss,\n window: targetWindow,\n });\n\n const permissions =\n permissionsProp === undefined || permissionsProp === true\n ? defaultTableSettingsPermissions\n : permissionsProp === false\n ? noTableSettingsPermissions\n : permissionsProp;\n\n const {\n columnItems,\n columnLabelsValue,\n onChangeColumnLabels,\n onChangeTableAttribute,\n onReorderColumnItems,\n onColumnChange,\n onCommitColumnWidth,\n tableConfig,\n } = useTableSettings({\n availableColumns,\n onConfigChange,\n onDataSourceConfigChange,\n tableConfig: tableConfigProp,\n });\n\n const {\n allowColumnLabelCase = true,\n allowColumnDefaultWidth = true,\n allowGridSeparators = true,\n allowCalculatedColumns = true,\n ...columnListPermissions\n } = permissions;\n\n return (\n <div className={classBase}>\n {allowColumnLabelCase ||\n allowColumnDefaultWidth ||\n allowGridSeparators ? (\n <div className={`${classBase}-header`}>\n <span>Column Settings</span>\n </div>\n ) : null}\n\n {allowColumnDefaultWidth ? (\n <FormField>\n <FormFieldLabel>Column Width</FormFieldLabel>\n <VuuInput\n className=\"vuuInput\"\n data-embedded\n onCommit={onCommitColumnWidth}\n />\n </FormField>\n ) : null}\n\n {allowColumnLabelCase ? (\n <FormField>\n <FormFieldLabel>Column Labels</FormFieldLabel>\n <ToggleButtonGroup\n className=\"vuuToggleButtonGroup\"\n onChange={onChangeColumnLabels}\n value={columnLabelsValue}\n >\n <ToggleButton className=\"vuuIconToggleButton\" value={0}>\n <Icon name=\"text-strikethrough\" size={48} />\n </ToggleButton>\n <ToggleButton className=\"vuuIconToggleButton\" value={1}>\n <Icon name=\"text-Tt\" size={48} />\n </ToggleButton>\n <ToggleButton className=\"vuuIconToggleButton\" value={2}>\n <Icon name=\"text-T\" size={48} />\n </ToggleButton>\n </ToggleButtonGroup>\n </FormField>\n ) : null}\n\n {allowGridSeparators ? (\n <FormField>\n <FormFieldLabel>Grid separators</FormFieldLabel>\n <div className=\"saltToggleButtonGroup vuuStateButtonGroup saltToggleButtonGroup-horizontal\">\n <ToggleButton\n selected={tableConfig.zebraStripes ?? false}\n onChange={onChangeTableAttribute}\n value=\"zebraStripes\"\n >\n <Icon name=\"row-striping\" size={16} />\n </ToggleButton>\n <ToggleButton\n selected={tableConfig.rowSeparators ?? false}\n onChange={onChangeTableAttribute}\n value=\"rowSeparators\"\n >\n <Icon name=\"row-lines\" size={16} />\n </ToggleButton>\n <ToggleButton\n selected={tableConfig.columnSeparators ?? false}\n onChange={onChangeTableAttribute}\n value=\"columnSeparators\"\n >\n <Icon name=\"col-lines\" size={16} />\n </ToggleButton>\n </div>\n </FormField>\n ) : null}\n\n <div className={cx(`${classBase}-columnListContainer`, \"vuuScrollable\")}>\n <ColumnList\n columnItems={columnItems}\n permissions={columnListPermissions}\n onChange={onColumnChange}\n onNavigateToColumn={onNavigateToColumn}\n onReorderColumnItems={onReorderColumnItems}\n />\n </div>\n\n {allowCalculatedColumns ? (\n <div className={`${classBase}-calculatedButtonbar`}>\n <Button data-icon=\"plus\" onClick={onAddCalculatedColumn} />\n <span className={`${classBase}-calculatedLabel`}>\n Add calculated column\n </span>\n </div>\n ) : null}\n </div>\n );\n};\n"],"names":["useWindow","useComponentCssInjection","tableSettingsPanelCss","useTableSettings","jsxs","jsx","FormField","FormFieldLabel","VuuInput","ToggleButtonGroup","ToggleButton","Icon","ColumnList","Button"],"mappings":"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"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"useColumnSettings.js","sources":["../../../../packages/vuu-table-extras/src/table-column-settings/useColumnSettings.ts"],"sourcesContent":["import {\n ColumnDescriptor,\n TableConfig,\n ColumnTypeFormatting,\n ColumnSettingsProps,\n} from \"@vuu-ui/vuu-table-types\";\n\nimport {\n CellRendererDescriptor,\n ColumnRenderPropsChangeHandler,\n getFieldName,\n getRegisteredCellRenderers,\n isValidColumnAlignment,\n isValidPinLocation,\n setCalculatedColumnName,\n updateColumnRenderProps,\n updateColumnFormatting,\n updateColumnType,\n queryClosest,\n} from \"@vuu-ui/vuu-utils\";\nimport { VuuColumnDataType } from \"@vuu-ui/vuu-protocol-types\";\nimport {\n FormEventHandler,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport { DataValueTypeSimple } from \"@vuu-ui/vuu-data-types\";\n\nconst integerCellRenderers: CellRendererDescriptor[] = [\n {\n description: \"Default formatter for columns with data type integer\",\n label: \"Default Renderer (int, long)\",\n name: \"default-int\",\n },\n];\nconst doubleCellRenderers: CellRendererDescriptor[] = [\n {\n description: \"Default formatter for columns with data type double\",\n label: \"Default Renderer (double)\",\n name: \"default-double\",\n },\n];\nconst decimalCellRenderers: CellRendererDescriptor[] = [\n {\n description:\n \"Default formatter for columns with data type decimal (2,4,6 or 8)\",\n label: \"Default Renderer (decimal)\",\n name: \"default-decimal\",\n },\n];\n\nconst stringCellRenderers: CellRendererDescriptor[] = [\n {\n description: \"Default formatter for columns with data type string\",\n label: \"Default Renderer (string)\",\n name: \"default-string\",\n },\n];\n\nconst booleanCellRenderers: CellRendererDescriptor[] = [];\n\nconst getAvailableCellRenderers = (\n column: ColumnDescriptor,\n): CellRendererDescriptor[] => {\n switch (column.serverDataType) {\n case \"char\":\n case \"string\":\n return stringCellRenderers.concat(getRegisteredCellRenderers(\"string\"));\n case \"int\":\n case \"long\":\n return integerCellRenderers.concat(getRegisteredCellRenderers(\"int\"));\n case \"double\":\n return doubleCellRenderers.concat(\n getRegisteredCellRenderers(column.serverDataType),\n );\n case \"scaleddecimal2\":\n case \"scaleddecimal4\":\n case \"scaleddecimal6\":\n case \"scaleddecimal8\":\n return decimalCellRenderers.concat(\n getRegisteredCellRenderers(column.serverDataType),\n );\n case \"boolean\":\n return booleanCellRenderers.concat(getRegisteredCellRenderers(\"boolean\"));\n default:\n return stringCellRenderers;\n }\n};\n\nconst getColumn = (\n columns: readonly ColumnDescriptor[],\n column: ColumnDescriptor,\n) => {\n if (column.name === \"::\") {\n // this is a new calculated column\n return column;\n } else {\n const col = columns.find((col) => col.name === column.name);\n if (col) {\n return col;\n }\n throw Error(`columns does not contain column ${name}`);\n }\n};\n\nconst replaceColumn = (\n tableConfig: TableConfig,\n column: ColumnDescriptor,\n): TableConfig => ({\n ...tableConfig,\n columns: tableConfig.columns.map((col) =>\n col.name === column.name ? column : col,\n ),\n});\n\nexport const useColumnSettings = ({\n column: columnProp,\n onCancelCreateColumn,\n onConfigChange,\n onCreateCalculatedColumn,\n tableConfig,\n}: Omit<ColumnSettingsProps, \"vuuTable\">) => {\n const [column, setColumn] = useState<ColumnDescriptor>(\n getColumn(tableConfig.columns, columnProp),\n );\n const columnRef = useRef<ColumnDescriptor>(column);\n const [inEditMode, setEditMode] = useState(column.name === \"::\");\n\n const handleEditCalculatedcolumn = useCallback(() => {\n columnRef.current = column;\n setEditMode(true);\n }, [column]);\n\n useEffect(() => {\n setColumn(columnProp);\n setEditMode(columnProp.name === \"::\");\n }, [columnProp]);\n\n const availableRenderers = useMemo(() => {\n return getAvailableCellRenderers(column);\n }, [column]);\n\n const handleInputCommit = useCallback(() => {\n onConfigChange(replaceColumn(tableConfig, column));\n }, [column, onConfigChange, tableConfig]);\n\n const handleChangeToggleButton = useCallback<FormEventHandler>(\n (evt) => {\n const button = queryClosest<HTMLButtonElement>(evt.target, \"button\");\n if (button) {\n const fieldName = getFieldName(button);\n const { value } = button;\n switch (fieldName) {\n case \"column-alignment\":\n if (isValidColumnAlignment(value)) {\n const newColumn: ColumnDescriptor = {\n ...column,\n align: value || undefined,\n };\n setColumn(newColumn);\n onConfigChange(replaceColumn(tableConfig, newColumn));\n }\n break;\n case \"column-pin\":\n if (isValidPinLocation(value)) {\n const newColumn: ColumnDescriptor = {\n ...column,\n pin: value || undefined,\n };\n setColumn(newColumn);\n onConfigChange(replaceColumn(tableConfig, newColumn));\n\n break;\n }\n }\n }\n },\n [column, onConfigChange, tableConfig],\n );\n\n const handleChange = useCallback<FormEventHandler>((evt) => {\n const input = evt.target as HTMLInputElement;\n const fieldName = getFieldName(input);\n const { value } = input;\n switch (fieldName) {\n case \"column-label\":\n setColumn((state) => ({ ...state, label: value }));\n break;\n case \"column-name\":\n setColumn((state) => setCalculatedColumnName(state, value));\n break;\n case \"column-width\":\n setColumn((state) => ({ ...state, width: parseInt(value) }));\n break;\n }\n }, []);\n\n const handleChangeCalculatedColumnName = useCallback((name: string) => {\n setColumn((state) => ({ ...state, name }));\n }, []);\n\n const handleChangeFormatting = useCallback(\n (formatting: ColumnTypeFormatting) => {\n const newColumn = updateColumnFormatting(column, formatting);\n setColumn(newColumn);\n onConfigChange(replaceColumn(tableConfig, newColumn));\n },\n [column, onConfigChange, tableConfig],\n );\n\n const handleChangeType = useCallback(\n (type: DataValueTypeSimple) => {\n const updatedColumn = updateColumnType(column, type);\n setColumn(updatedColumn);\n onConfigChange(replaceColumn(tableConfig, updatedColumn));\n },\n [column, onConfigChange, tableConfig],\n );\n\n // Changing the server data type applies only to calculated columns\n const handleChangeServerDataType = useCallback(\n (serverDataType: VuuColumnDataType) => {\n setColumn((col) => ({ ...col, serverDataType }));\n },\n [],\n );\n\n const handleChangeRendering = useCallback<ColumnRenderPropsChangeHandler>(\n (renderProps) => {\n if (renderProps) {\n const newColumn: ColumnDescriptor = updateColumnRenderProps(\n column,\n renderProps,\n );\n setColumn(newColumn);\n onConfigChange(replaceColumn(tableConfig, newColumn));\n }\n },\n [column, onConfigChange, tableConfig],\n );\n\n const navigateColumn = useCallback(\n ({ moveBy }: { moveBy: number }) => {\n const { columns } = tableConfig;\n const index = columns.indexOf(column) + moveBy;\n const newColumn = columns[index];\n if (newColumn) {\n setColumn(newColumn);\n }\n },\n [column, tableConfig],\n );\n const navigateNextColumn = useCallback(() => {\n navigateColumn({ moveBy: 1 });\n }, [navigateColumn]);\n\n const navigatePrevColumn = useCallback(() => {\n navigateColumn({ moveBy: -1 });\n }, [navigateColumn]);\n\n const handleSaveCalculatedColumn = useCallback(() => {\n // TODO validate expression, unique name\n onCreateCalculatedColumn(column);\n }, [column, onCreateCalculatedColumn]);\n\n const handleCancelEdit = useCallback(() => {\n if (columnProp.name === \"::\") {\n onCancelCreateColumn();\n } else {\n if (columnRef.current !== undefined && columnRef.current !== column) {\n setColumn(columnRef.current);\n }\n setEditMode(false);\n }\n }, [column, columnProp.name, onCancelCreateColumn]);\n\n return {\n availableRenderers,\n editCalculatedColumn: inEditMode,\n column,\n navigateNextColumn,\n navigatePrevColumn,\n onCancel: handleCancelEdit,\n onChange: handleChange,\n onChangeCalculatedColumnName: handleChangeCalculatedColumnName,\n onChangeFormatting: handleChangeFormatting,\n onChangeRendering: handleChangeRendering,\n onChangeServerDataType: handleChangeServerDataType,\n onChangeToggleButton: handleChangeToggleButton,\n onChangeType: handleChangeType,\n onEditCalculatedColumn: handleEditCalculatedcolumn,\n onInputCommit: handleInputCommit,\n onSave: handleSaveCalculatedColumn,\n };\n};\n"],"names":["getRegisteredCellRenderers","col","useState","useRef","useCallback","useEffect","useMemo","queryClosest","getFieldName","isValidColumnAlignment","isValidPinLocation","setCalculatedColumnName","name","updateColumnFormatting","updateColumnType","updateColumnRenderProps"],"mappings":"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"}