@vuu-ui/vuu-table-extras 0.8.34 → 0.8.35

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 (166) hide show
  1. package/package.json +12 -14
  2. package/cjs/cell-edit-validators/CaseValidator.js +0 -24
  3. package/cjs/cell-edit-validators/CaseValidator.js.map +0 -1
  4. package/cjs/cell-edit-validators/PatternValidator.js +0 -26
  5. package/cjs/cell-edit-validators/PatternValidator.js.map +0 -1
  6. package/cjs/cell-renderers/background-cell/BackgroundCell.css +0 -105
  7. package/cjs/cell-renderers/background-cell/BackgroundCell.js +0 -64
  8. package/cjs/cell-renderers/background-cell/BackgroundCell.js.map +0 -1
  9. package/cjs/cell-renderers/background-cell/BackgroundCellConfigurationEditor.css +0 -4
  10. package/cjs/cell-renderers/background-cell/BackgroundCellConfigurationEditor.js +0 -58
  11. package/cjs/cell-renderers/background-cell/BackgroundCellConfigurationEditor.js.map +0 -1
  12. package/cjs/cell-renderers/background-cell/BackgroundKeyframes.css +0 -169
  13. package/cjs/cell-renderers/background-cell/useDirection.js +0 -20
  14. package/cjs/cell-renderers/background-cell/useDirection.js.map +0 -1
  15. package/cjs/cell-renderers/dropdown-cell/DropdownCell.css +0 -18
  16. package/cjs/cell-renderers/dropdown-cell/DropdownCell.js +0 -56
  17. package/cjs/cell-renderers/dropdown-cell/DropdownCell.js.map +0 -1
  18. package/cjs/cell-renderers/lookup-cell/LookupCell.js +0 -26
  19. package/cjs/cell-renderers/lookup-cell/LookupCell.js.map +0 -1
  20. package/cjs/cell-renderers/pct-progress-cell/PctProgressCell.css +0 -30
  21. package/cjs/cell-renderers/pct-progress-cell/PctProgressCell.js +0 -53
  22. package/cjs/cell-renderers/pct-progress-cell/PctProgressCell.js.map +0 -1
  23. package/cjs/cell-renderers/progress-cell/ProgressCell.css +0 -39
  24. package/cjs/cell-renderers/progress-cell/ProgressCell.js +0 -60
  25. package/cjs/cell-renderers/progress-cell/ProgressCell.js.map +0 -1
  26. package/cjs/column-expression-input/ColumnExpressionInput.css +0 -92
  27. package/cjs/column-expression-input/ColumnExpressionInput.js +0 -30
  28. package/cjs/column-expression-input/ColumnExpressionInput.js.map +0 -1
  29. package/cjs/column-expression-input/column-function-descriptors.js +0 -307
  30. package/cjs/column-expression-input/column-function-descriptors.js.map +0 -1
  31. package/cjs/column-expression-input/column-language-parser/ColumnExpressionLanguage.js +0 -29
  32. package/cjs/column-expression-input/column-language-parser/ColumnExpressionLanguage.js.map +0 -1
  33. package/cjs/column-expression-input/column-language-parser/ColumnExpressionTreeWalker.js +0 -469
  34. package/cjs/column-expression-input/column-language-parser/ColumnExpressionTreeWalker.js.map +0 -1
  35. package/cjs/column-expression-input/column-language-parser/column-expression-parse-utils.js +0 -61
  36. package/cjs/column-expression-input/column-language-parser/column-expression-parse-utils.js.map +0 -1
  37. package/cjs/column-expression-input/column-language-parser/generated/column-parser.js +0 -21
  38. package/cjs/column-expression-input/column-language-parser/generated/column-parser.js.map +0 -1
  39. package/cjs/column-expression-input/functionDocInfo.js +0 -39
  40. package/cjs/column-expression-input/functionDocInfo.js.map +0 -1
  41. package/cjs/column-expression-input/highlighting.js +0 -16
  42. package/cjs/column-expression-input/highlighting.js.map +0 -1
  43. package/cjs/column-expression-input/theme.js +0 -63
  44. package/cjs/column-expression-input/theme.js.map +0 -1
  45. package/cjs/column-expression-input/useColumnAutoComplete.js +0 -358
  46. package/cjs/column-expression-input/useColumnAutoComplete.js.map +0 -1
  47. package/cjs/column-expression-input/useColumnExpressionEditor.js +0 -131
  48. package/cjs/column-expression-input/useColumnExpressionEditor.js.map +0 -1
  49. package/cjs/column-expression-input/useColumnExpressionSuggestionProvider.js +0 -212
  50. package/cjs/column-expression-input/useColumnExpressionSuggestionProvider.js.map +0 -1
  51. package/cjs/column-expression-panel/ColumnExpressionPanel.js +0 -87
  52. package/cjs/column-expression-panel/ColumnExpressionPanel.js.map +0 -1
  53. package/cjs/column-expression-panel/useColumnExpression.js +0 -69
  54. package/cjs/column-expression-panel/useColumnExpression.js.map +0 -1
  55. package/cjs/column-formatting-settings/BaseNumericFormattingSettings.js +0 -97
  56. package/cjs/column-formatting-settings/BaseNumericFormattingSettings.js.map +0 -1
  57. package/cjs/column-formatting-settings/ColumnFormattingPanel.js +0 -107
  58. package/cjs/column-formatting-settings/ColumnFormattingPanel.js.map +0 -1
  59. package/cjs/column-formatting-settings/DateTimeFormattingSettings.js +0 -90
  60. package/cjs/column-formatting-settings/DateTimeFormattingSettings.js.map +0 -1
  61. package/cjs/column-formatting-settings/LongTypeFormattingSettings.css +0 -6
  62. package/cjs/column-formatting-settings/LongTypeFormattingSettings.js +0 -40
  63. package/cjs/column-formatting-settings/LongTypeFormattingSettings.js.map +0 -1
  64. package/cjs/column-list/ColumnList.css +0 -60
  65. package/cjs/column-list/ColumnList.js +0 -106
  66. package/cjs/column-list/ColumnList.js.map +0 -1
  67. package/cjs/column-settings/ColumnNameLabel.css +0 -13
  68. package/cjs/column-settings/ColumnNameLabel.js +0 -36
  69. package/cjs/column-settings/ColumnNameLabel.js.map +0 -1
  70. package/cjs/column-settings/ColumnSettingsPanel.css +0 -77
  71. package/cjs/column-settings/ColumnSettingsPanel.js +0 -186
  72. package/cjs/column-settings/ColumnSettingsPanel.js.map +0 -1
  73. package/cjs/column-settings/useColumnSettings.js +0 -235
  74. package/cjs/column-settings/useColumnSettings.js.map +0 -1
  75. package/cjs/datasource-stats/DatasourceStats.css +0 -11
  76. package/cjs/datasource-stats/DatasourceStats.js +0 -39
  77. package/cjs/datasource-stats/DatasourceStats.js.map +0 -1
  78. package/cjs/index.js.map +0 -1
  79. package/cjs/table-settings/TableSettingsPanel.css +0 -64
  80. package/cjs/table-settings/TableSettingsPanel.js +0 -114
  81. package/cjs/table-settings/TableSettingsPanel.js.map +0 -1
  82. package/cjs/table-settings/useTableSettings.js +0 -182
  83. package/cjs/table-settings/useTableSettings.js.map +0 -1
  84. package/esm/cell-edit-validators/CaseValidator.js +0 -22
  85. package/esm/cell-edit-validators/CaseValidator.js.map +0 -1
  86. package/esm/cell-edit-validators/PatternValidator.js +0 -24
  87. package/esm/cell-edit-validators/PatternValidator.js.map +0 -1
  88. package/esm/cell-renderers/background-cell/BackgroundCell.css +0 -105
  89. package/esm/cell-renderers/background-cell/BackgroundCell.js +0 -62
  90. package/esm/cell-renderers/background-cell/BackgroundCell.js.map +0 -1
  91. package/esm/cell-renderers/background-cell/BackgroundCellConfigurationEditor.css +0 -4
  92. package/esm/cell-renderers/background-cell/BackgroundCellConfigurationEditor.js +0 -56
  93. package/esm/cell-renderers/background-cell/BackgroundCellConfigurationEditor.js.map +0 -1
  94. package/esm/cell-renderers/background-cell/BackgroundKeyframes.css +0 -169
  95. package/esm/cell-renderers/background-cell/useDirection.js +0 -18
  96. package/esm/cell-renderers/background-cell/useDirection.js.map +0 -1
  97. package/esm/cell-renderers/dropdown-cell/DropdownCell.css +0 -18
  98. package/esm/cell-renderers/dropdown-cell/DropdownCell.js +0 -54
  99. package/esm/cell-renderers/dropdown-cell/DropdownCell.js.map +0 -1
  100. package/esm/cell-renderers/lookup-cell/LookupCell.js +0 -24
  101. package/esm/cell-renderers/lookup-cell/LookupCell.js.map +0 -1
  102. package/esm/cell-renderers/pct-progress-cell/PctProgressCell.css +0 -30
  103. package/esm/cell-renderers/pct-progress-cell/PctProgressCell.js +0 -51
  104. package/esm/cell-renderers/pct-progress-cell/PctProgressCell.js.map +0 -1
  105. package/esm/cell-renderers/progress-cell/ProgressCell.css +0 -39
  106. package/esm/cell-renderers/progress-cell/ProgressCell.js +0 -58
  107. package/esm/cell-renderers/progress-cell/ProgressCell.js.map +0 -1
  108. package/esm/column-expression-input/ColumnExpressionInput.css +0 -92
  109. package/esm/column-expression-input/ColumnExpressionInput.js +0 -28
  110. package/esm/column-expression-input/ColumnExpressionInput.js.map +0 -1
  111. package/esm/column-expression-input/column-function-descriptors.js +0 -305
  112. package/esm/column-expression-input/column-function-descriptors.js.map +0 -1
  113. package/esm/column-expression-input/column-language-parser/ColumnExpressionLanguage.js +0 -27
  114. package/esm/column-expression-input/column-language-parser/ColumnExpressionLanguage.js.map +0 -1
  115. package/esm/column-expression-input/column-language-parser/ColumnExpressionTreeWalker.js +0 -467
  116. package/esm/column-expression-input/column-language-parser/ColumnExpressionTreeWalker.js.map +0 -1
  117. package/esm/column-expression-input/column-language-parser/column-expression-parse-utils.js +0 -56
  118. package/esm/column-expression-input/column-language-parser/column-expression-parse-utils.js.map +0 -1
  119. package/esm/column-expression-input/column-language-parser/generated/column-parser.js +0 -19
  120. package/esm/column-expression-input/column-language-parser/generated/column-parser.js.map +0 -1
  121. package/esm/column-expression-input/functionDocInfo.js +0 -37
  122. package/esm/column-expression-input/functionDocInfo.js.map +0 -1
  123. package/esm/column-expression-input/highlighting.js +0 -14
  124. package/esm/column-expression-input/highlighting.js.map +0 -1
  125. package/esm/column-expression-input/theme.js +0 -61
  126. package/esm/column-expression-input/theme.js.map +0 -1
  127. package/esm/column-expression-input/useColumnAutoComplete.js +0 -356
  128. package/esm/column-expression-input/useColumnAutoComplete.js.map +0 -1
  129. package/esm/column-expression-input/useColumnExpressionEditor.js +0 -129
  130. package/esm/column-expression-input/useColumnExpressionEditor.js.map +0 -1
  131. package/esm/column-expression-input/useColumnExpressionSuggestionProvider.js +0 -210
  132. package/esm/column-expression-input/useColumnExpressionSuggestionProvider.js.map +0 -1
  133. package/esm/column-expression-panel/ColumnExpressionPanel.js +0 -85
  134. package/esm/column-expression-panel/ColumnExpressionPanel.js.map +0 -1
  135. package/esm/column-expression-panel/useColumnExpression.js +0 -67
  136. package/esm/column-expression-panel/useColumnExpression.js.map +0 -1
  137. package/esm/column-formatting-settings/BaseNumericFormattingSettings.js +0 -95
  138. package/esm/column-formatting-settings/BaseNumericFormattingSettings.js.map +0 -1
  139. package/esm/column-formatting-settings/ColumnFormattingPanel.js +0 -105
  140. package/esm/column-formatting-settings/ColumnFormattingPanel.js.map +0 -1
  141. package/esm/column-formatting-settings/DateTimeFormattingSettings.js +0 -88
  142. package/esm/column-formatting-settings/DateTimeFormattingSettings.js.map +0 -1
  143. package/esm/column-formatting-settings/LongTypeFormattingSettings.css +0 -6
  144. package/esm/column-formatting-settings/LongTypeFormattingSettings.js +0 -38
  145. package/esm/column-formatting-settings/LongTypeFormattingSettings.js.map +0 -1
  146. package/esm/column-list/ColumnList.css +0 -60
  147. package/esm/column-list/ColumnList.js +0 -104
  148. package/esm/column-list/ColumnList.js.map +0 -1
  149. package/esm/column-settings/ColumnNameLabel.css +0 -13
  150. package/esm/column-settings/ColumnNameLabel.js +0 -34
  151. package/esm/column-settings/ColumnNameLabel.js.map +0 -1
  152. package/esm/column-settings/ColumnSettingsPanel.css +0 -77
  153. package/esm/column-settings/ColumnSettingsPanel.js +0 -184
  154. package/esm/column-settings/ColumnSettingsPanel.js.map +0 -1
  155. package/esm/column-settings/useColumnSettings.js +0 -233
  156. package/esm/column-settings/useColumnSettings.js.map +0 -1
  157. package/esm/datasource-stats/DatasourceStats.css +0 -11
  158. package/esm/datasource-stats/DatasourceStats.js +0 -37
  159. package/esm/datasource-stats/DatasourceStats.js.map +0 -1
  160. package/esm/index.js +0 -24
  161. package/esm/index.js.map +0 -1
  162. package/esm/table-settings/TableSettingsPanel.css +0 -64
  163. package/esm/table-settings/TableSettingsPanel.js +0 -112
  164. package/esm/table-settings/TableSettingsPanel.js.map +0 -1
  165. package/esm/table-settings/useTableSettings.js +0 -180
  166. package/esm/table-settings/useTableSettings.js.map +0 -1
@@ -1,77 +0,0 @@
1
- .vuuColumnSettingsPanel {
2
- --vuu-svg-align-left: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M9.33333 10H2.66667C2.3 10 2 10.3 2 10.6667C2 11.0333 2.3 11.3333 2.66667 11.3333H9.33333C9.7 11.3333 10 11.0333 10 10.6667C10 10.3 9.7 10 9.33333 10ZM9.33333 4.66667H2.66667C2.3 4.66667 2 4.96667 2 5.33333C2 5.7 2.3 6 2.66667 6H9.33333C9.7 6 10 5.7 10 5.33333C10 4.96667 9.7 4.66667 9.33333 4.66667ZM2.66667 8.66667H13.3333C13.7 8.66667 14 8.36667 14 8C14 7.63333 13.7 7.33333 13.3333 7.33333H2.66667C2.3 7.33333 2 7.63333 2 8C2 8.36667 2.3 8.66667 2.66667 8.66667ZM2.66667 14H13.3333C13.7 14 14 13.7 14 13.3333C14 12.9667 13.7 12.6667 13.3333 12.6667H2.66667C2.3 12.6667 2 12.9667 2 13.3333C2 13.7 2.3 14 2.66667 14ZM2 2.66667C2 3.03333 2.3 3.33333 2.66667 3.33333H13.3333C13.7 3.33333 14 3.03333 14 2.66667C14 2.3 13.7 2 13.3333 2H2.66667C2.3 2 2 2.3 2 2.66667Z" /></svg>');
3
- --vuu-svg-align-right: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M2.66667 14H13.3333C13.7 14 14 13.7 14 13.3333C14 12.9667 13.7 12.6667 13.3333 12.6667H2.66667C2.3 12.6667 2 12.9667 2 13.3333C2 13.7 2.3 14 2.66667 14ZM6.66667 11.3333H13.3333C13.7 11.3333 14 11.0333 14 10.6667C14 10.3 13.7 10 13.3333 10H6.66667C6.3 10 6 10.3 6 10.6667C6 11.0333 6.3 11.3333 6.66667 11.3333ZM2.66667 8.66667H13.3333C13.7 8.66667 14 8.36667 14 8C14 7.63333 13.7 7.33333 13.3333 7.33333H2.66667C2.3 7.33333 2 7.63333 2 8C2 8.36667 2.3 8.66667 2.66667 8.66667ZM6.66667 6H13.3333C13.7 6 14 5.7 14 5.33333C14 4.96667 13.7 4.66667 13.3333 4.66667H6.66667C6.3 4.66667 6 4.96667 6 5.33333C6 5.7 6.3 6 6.66667 6ZM2 2.66667C2 3.03333 2.3 3.33333 2.66667 3.33333H13.3333C13.7 3.33333 14 3.03333 14 2.66667C14 2.3 13.7 2 13.3333 2H2.66667C2.3 2 2 2.3 2 2.66667Z" /></svg>');
4
- --vuu-svg-pin-left: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M7.33333 9.86V8.66666H13.3333C13.7 8.66666 14 8.36666 14 8C14 7.63333 13.7 7.33333 13.3333 7.33333L7.33333 7.33333V6.14C7.33333 5.84 6.97333 5.69333 6.76667 5.90666L4.90667 7.76666C4.77333 7.89999 4.77333 8.10666 4.90667 8.24L6.76667 10.1C6.97333 10.3067 7.33333 10.16 7.33333 9.86ZM2.66667 13.3333C3.03333 13.3333 3.33333 13.0333 3.33333 12.6667L3.33333 3.33333C3.33333 2.96666 3.03333 2.66666 2.66667 2.66666C2.3 2.66666 2 2.96666 2 3.33333L2 12.6667C2 13.0333 2.3 13.3333 2.66667 13.3333Z" /></svg>');
5
- --vuu-svg-pin-float: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M6 4.66667H4.66667V6H6V4.66667ZM6 7.33333H4.66667V8.66667H6V7.33333ZM6 2C5.26 2 4.66667 2.6 4.66667 3.33333H6V2ZM8.66667 10H7.33333V11.3333H8.66667V10ZM12.6667 2V3.33333H14C14 2.6 13.4 2 12.6667 2ZM8.66667 2H7.33333V3.33333H8.66667V2ZM6 11.3333V10H4.66667C4.66667 10.7333 5.26 11.3333 6 11.3333ZM12.6667 8.66667H14V7.33333H12.6667V8.66667ZM12.6667 6H14V4.66667H12.6667V6ZM12.6667 11.3333C13.4 11.3333 14 10.7333 14 10H12.6667V11.3333ZM2.66667 4.66667C2.3 4.66667 2 4.96667 2 5.33333V12.6667C2 13.4 2.6 14 3.33333 14H10.6667C11.0333 14 11.3333 13.7 11.3333 13.3333C11.3333 12.9667 11.0333 12.6667 10.6667 12.6667H4C3.63333 12.6667 3.33333 12.3667 3.33333 12V5.33333C3.33333 4.96667 3.03333 4.66667 2.66667 4.66667ZM10 3.33333H11.3333V2H10V3.33333ZM10 11.3333H11.3333V10H10V11.3333Z" /></svg>');
6
- --vuu-svg-pin-right: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M8.66667 6.14V7.33333H2.66667C2.3 7.33333 2 7.63333 2 8C2 8.36666 2.3 8.66666 2.66667 8.66666H8.66667V9.86C8.66667 10.16 9.02667 10.3067 9.23333 10.0933L11.0933 8.23333C11.2267 8.1 11.2267 7.89333 11.0933 7.76L9.23333 5.9C9.02667 5.69333 8.66667 5.84 8.66667 6.14ZM13.3333 13.3333C13.7 13.3333 14 13.0333 14 12.6667V3.33333C14 2.96666 13.7 2.66666 13.3333 2.66666C12.9667 2.66666 12.6667 2.96666 12.6667 3.33333V12.6667C12.6667 13.0333 12.9667 13.3333 13.3333 13.3333Z"/></svg>');
7
- --vuuDropdown-height: 24px;
8
- --vuuDropdown-width: 100%;
9
-
10
- display: flex;
11
- flex-direction: column;
12
- gap: 24px;
13
- height: 100%;
14
- padding-top: 24px;
15
- }
16
-
17
- .vuuColumnSettingsPanel-header {
18
- border-top: solid 2px var(--vuu-color-gray-30);
19
- font-size: 14px;
20
- font-weight: 600;
21
- padding: 24px 2px 0 2px;
22
- }
23
-
24
-
25
- .vuuColumnSettingsPanel-buttonBar {
26
- align-items: center;
27
- display: flex;
28
- justify-content: space-between;
29
- margin-top: auto;
30
- }
31
-
32
- .vuuColumnSettingsPanel-buttonBar[data-align="right"]{
33
- gap: 6px;
34
- justify-content: flex-end;
35
- }
36
-
37
- .vuuColumnSettingsPanel-buttonNavPrev {
38
- --vuu-icon-left: 6px;
39
- padding-left: 24px
40
- }
41
-
42
- .vuuColumnSettingsPanel-buttonNavNext {
43
- --vuu-icon-left: calc(100% - 18px);
44
- padding-right: 24px
45
- }
46
-
47
-
48
-
49
- [data-icon='align-left'] {
50
- --vuu-icon-svg: var(--vuu-svg-align-left);
51
- }
52
-
53
- [data-icon='align-right'] {
54
- --vuu-icon-svg: var(--vuu-svg-align-right);
55
- }
56
-
57
- [data-icon='pin-left'] {
58
- --vuu-icon-svg: var(--vuu-svg-pin-left);
59
- }
60
- [data-icon='pin-float'] {
61
- --vuu-icon-svg: var(--vuu-svg-pin-float);
62
- }
63
- [data-icon='pin-right'] {
64
- --vuu-icon-svg: var(--vuu-svg-pin-right);
65
- }
66
-
67
- .vuuColumnSettingsPanel-editing .vuuColumnNameLabel-edit {
68
- display: none;
69
- }
70
-
71
-
72
-
73
-
74
-
75
-
76
-
77
-
@@ -1,184 +0,0 @@
1
- import { jsxs, jsx } from 'react/jsx-runtime';
2
- import { VuuInput, Icon } from '@vuu-ui/vuu-ui-controls';
3
- import { getDefaultAlignment, isCalculatedColumn, getCalculatedColumnName } from '@vuu-ui/vuu-utils';
4
- import { FormField, FormFieldLabel, ToggleButtonGroup, ToggleButton, Button } from '@salt-ds/core';
5
- import cx from 'clsx';
6
- import { ColumnExpressionPanel } from '../column-expression-panel/ColumnExpressionPanel.js';
7
- import { ColumnFormattingPanel } from '../column-formatting-settings/ColumnFormattingPanel.js';
8
- import 'react';
9
- import { ColumnNameLabel } from './ColumnNameLabel.js';
10
- import { useColumnSettings } from './useColumnSettings.js';
11
-
12
- const classBase = "vuuColumnSettingsPanel";
13
- const getColumnLabel = (column) => {
14
- const { name, label } = column;
15
- if (isCalculatedColumn(name)) {
16
- return label ?? getCalculatedColumnName(column);
17
- } else {
18
- return label ?? name;
19
- }
20
- };
21
- const ColumnSettingsPanel = ({
22
- column: columnProp,
23
- onCancelCreateColumn,
24
- onConfigChange,
25
- onCreateCalculatedColumn,
26
- tableConfig,
27
- vuuTable
28
- }) => {
29
- const isNewCalculatedColumn = columnProp.name === "::";
30
- const {
31
- availableRenderers,
32
- editCalculatedColumn,
33
- column,
34
- navigateNextColumn,
35
- navigatePrevColumn,
36
- onCancel,
37
- onChange,
38
- onChangeCalculatedColumnName,
39
- onChangeFormatting,
40
- onChangeRendering,
41
- onChangeServerDataType,
42
- onChangeToggleButton,
43
- onChangeType,
44
- onEditCalculatedColumn,
45
- onInputCommit,
46
- onSave
47
- } = useColumnSettings({
48
- column: columnProp,
49
- onCancelCreateColumn,
50
- onConfigChange,
51
- onCreateCalculatedColumn,
52
- tableConfig
53
- });
54
- const {
55
- serverDataType,
56
- align = getDefaultAlignment(serverDataType),
57
- pin,
58
- width
59
- } = column;
60
- return /* @__PURE__ */ jsxs(
61
- "div",
62
- {
63
- className: cx(classBase, {
64
- [`${classBase}-editing`]: editCalculatedColumn
65
- }),
66
- children: [
67
- /* @__PURE__ */ jsx("div", { className: `${classBase}-header`, children: /* @__PURE__ */ jsx(ColumnNameLabel, { column, onClick: onEditCalculatedColumn }) }),
68
- editCalculatedColumn ? /* @__PURE__ */ jsx(
69
- ColumnExpressionPanel,
70
- {
71
- column,
72
- onChangeName: onChangeCalculatedColumnName,
73
- onChangeServerDataType,
74
- tableConfig,
75
- vuuTable
76
- }
77
- ) : null,
78
- /* @__PURE__ */ jsxs(FormField, { "data-field": "column-label", children: [
79
- /* @__PURE__ */ jsx(FormFieldLabel, { children: "Column Label" }),
80
- /* @__PURE__ */ jsx(
81
- VuuInput,
82
- {
83
- className: "vuuInput",
84
- "data-embedded": true,
85
- onChange,
86
- onCommit: onInputCommit,
87
- value: getColumnLabel(column)
88
- }
89
- )
90
- ] }),
91
- /* @__PURE__ */ jsxs(FormField, { "data-field": "column-width", children: [
92
- /* @__PURE__ */ jsx(FormFieldLabel, { children: "Column Width" }),
93
- /* @__PURE__ */ jsx(
94
- VuuInput,
95
- {
96
- className: "vuuInput",
97
- "data-embedded": true,
98
- onChange,
99
- value: width,
100
- onCommit: onInputCommit
101
- }
102
- )
103
- ] }),
104
- /* @__PURE__ */ jsxs(FormField, { "data-field": "column-alignment", children: [
105
- /* @__PURE__ */ jsx(FormFieldLabel, { children: "Alignment" }),
106
- /* @__PURE__ */ jsxs(ToggleButtonGroup, { onChange: onChangeToggleButton, value: align, children: [
107
- /* @__PURE__ */ jsx(ToggleButton, { value: "left", children: /* @__PURE__ */ jsx(Icon, { name: "align-left", size: 16 }) }),
108
- /* @__PURE__ */ jsx(ToggleButton, { value: "right", children: /* @__PURE__ */ jsx(Icon, { name: "align-right", size: 16 }) })
109
- ] })
110
- ] }),
111
- /* @__PURE__ */ jsxs(FormField, { "data-field": "column-pin", children: [
112
- /* @__PURE__ */ jsx(FormFieldLabel, { children: "Pin Column" }),
113
- /* @__PURE__ */ jsxs(ToggleButtonGroup, { onChange: onChangeToggleButton, value: pin ?? "", children: [
114
- /* @__PURE__ */ jsx(ToggleButton, { value: "left", children: /* @__PURE__ */ jsx(Icon, { name: "pin-left", size: 16 }) }),
115
- /* @__PURE__ */ jsx(ToggleButton, { value: "floating", children: /* @__PURE__ */ jsx(Icon, { name: "pin-float", size: 16 }) }),
116
- /* @__PURE__ */ jsx(ToggleButton, { value: "right", children: /* @__PURE__ */ jsx(Icon, { name: "pin-right", size: 16 }) }),
117
- /* @__PURE__ */ jsx(ToggleButton, { value: "", children: /* @__PURE__ */ jsx(Icon, { name: "cross-circle", size: 16 }) })
118
- ] })
119
- ] }),
120
- /* @__PURE__ */ jsx(
121
- ColumnFormattingPanel,
122
- {
123
- availableRenderers,
124
- column,
125
- onChangeFormatting,
126
- onChangeRendering,
127
- onChangeColumnType: onChangeType
128
- }
129
- ),
130
- editCalculatedColumn ? /* @__PURE__ */ jsxs("div", { className: "vuuColumnSettingsPanel-buttonBar", "data-align": "right", children: [
131
- /* @__PURE__ */ jsx(
132
- Button,
133
- {
134
- className: `${classBase}-buttonCancel`,
135
- onClick: onCancel,
136
- tabIndex: -1,
137
- children: "cancel"
138
- }
139
- ),
140
- /* @__PURE__ */ jsx(
141
- Button,
142
- {
143
- className: `${classBase}-buttonSave`,
144
- onClick: onSave,
145
- variant: "cta",
146
- children: "save"
147
- }
148
- )
149
- ] }) : /* @__PURE__ */ jsxs(
150
- "div",
151
- {
152
- className: `${classBase}-buttonBar`,
153
- "data-align": isNewCalculatedColumn ? "right" : void 0,
154
- children: [
155
- /* @__PURE__ */ jsx(
156
- Button,
157
- {
158
- className: `${classBase}-buttonNavPrev`,
159
- variant: "secondary",
160
- "data-icon": "arrow-left",
161
- onClick: navigatePrevColumn,
162
- children: "PREVIOUS"
163
- }
164
- ),
165
- /* @__PURE__ */ jsx(
166
- Button,
167
- {
168
- className: `${classBase}-buttonNavNext`,
169
- variant: "secondary",
170
- "data-icon": "arrow-right",
171
- onClick: navigateNextColumn,
172
- children: "NEXT"
173
- }
174
- )
175
- ]
176
- }
177
- )
178
- ]
179
- }
180
- );
181
- };
182
-
183
- export { ColumnSettingsPanel };
184
- //# sourceMappingURL=ColumnSettingsPanel.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"ColumnSettingsPanel.js","sources":["../../src/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 getCalculatedColumnName,\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 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 \"./ColumnSettingsPanel.css\";\n\nconst classBase = \"vuuColumnSettingsPanel\";\n\nconst getColumnLabel = (column: ColumnDescriptor) => {\n const { name, label } = column;\n if (isCalculatedColumn(name)) {\n return label ?? getCalculatedColumnName(column);\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 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 onChange={onChangeToggleButton} value={pin ?? \"\"}>\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":[],"mappings":"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"}
@@ -1,233 +0,0 @@
1
- import { queryClosest, isValidPinLocation, isValidColumnAlignment, setCalculatedColumnName, updateColumnFormatting, updateColumnType, updateColumnRenderProps, getRegisteredCellRenderers } from '@vuu-ui/vuu-utils';
2
- import { useState, useRef, useCallback, useEffect, useMemo } from 'react';
3
-
4
- const integerCellRenderers = [
5
- {
6
- description: "Default formatter for columns with data type integer",
7
- label: "Default Renderer (int, long)",
8
- name: "default-int"
9
- }
10
- ];
11
- const doubleCellRenderers = [
12
- {
13
- description: "Default formatter for columns with data type double",
14
- label: "Default Renderer (double)",
15
- name: "default-double"
16
- }
17
- ];
18
- const stringCellRenderers = [
19
- {
20
- description: "Default formatter for columns with data type string",
21
- label: "Default Renderer (string)",
22
- name: "default-string"
23
- }
24
- ];
25
- const booleanCellRenderers = [];
26
- const getAvailableCellRenderers = (column) => {
27
- switch (column.serverDataType) {
28
- case "char":
29
- case "string":
30
- return stringCellRenderers.concat(getRegisteredCellRenderers("string"));
31
- case "int":
32
- case "long":
33
- return integerCellRenderers.concat(getRegisteredCellRenderers("int"));
34
- case "double":
35
- return doubleCellRenderers.concat(getRegisteredCellRenderers("double"));
36
- case "boolean":
37
- return booleanCellRenderers.concat(getRegisteredCellRenderers("boolean"));
38
- default:
39
- return stringCellRenderers;
40
- }
41
- };
42
- const getFieldName = (input) => {
43
- const saltFormField = input.closest(".saltFormField");
44
- if (saltFormField && saltFormField.dataset.field) {
45
- const {
46
- dataset: { field }
47
- } = saltFormField;
48
- return field;
49
- } else {
50
- throw Error("named form field not found");
51
- }
52
- };
53
- const getColumn = (columns, column) => {
54
- if (column.name === "::") {
55
- return column;
56
- } else {
57
- const col = columns.find((col2) => col2.name === column.name);
58
- if (col) {
59
- return col;
60
- }
61
- throw Error(`columns does not contain column ${name}`);
62
- }
63
- };
64
- const replaceColumn = (tableConfig, column) => ({
65
- ...tableConfig,
66
- columns: tableConfig.columns.map(
67
- (col) => col.name === column.name ? column : col
68
- )
69
- });
70
- const useColumnSettings = ({
71
- column: columnProp,
72
- onCancelCreateColumn,
73
- onConfigChange,
74
- onCreateCalculatedColumn,
75
- tableConfig
76
- }) => {
77
- const [column, setColumn] = useState(
78
- getColumn(tableConfig.columns, columnProp)
79
- );
80
- const columnRef = useRef(column);
81
- const [inEditMode, setEditMode] = useState(column.name === "::");
82
- const handleEditCalculatedcolumn = useCallback(() => {
83
- columnRef.current = column;
84
- setEditMode(true);
85
- }, [column]);
86
- useEffect(() => {
87
- setColumn(columnProp);
88
- setEditMode(columnProp.name === "::");
89
- }, [columnProp]);
90
- const availableRenderers = useMemo(() => {
91
- return getAvailableCellRenderers(column);
92
- }, [column]);
93
- const handleInputCommit = useCallback(() => {
94
- onConfigChange(replaceColumn(tableConfig, column));
95
- }, [column, onConfigChange, tableConfig]);
96
- const handleChangeToggleButton = useCallback(
97
- (evt) => {
98
- const button = queryClosest(evt.target, "button");
99
- if (button) {
100
- const fieldName = getFieldName(button);
101
- const { value } = button;
102
- switch (fieldName) {
103
- case "column-alignment":
104
- if (isValidColumnAlignment(value)) {
105
- const newColumn = {
106
- ...column,
107
- align: value || void 0
108
- };
109
- setColumn(newColumn);
110
- onConfigChange(replaceColumn(tableConfig, newColumn));
111
- }
112
- break;
113
- case "column-pin":
114
- if (isValidPinLocation(value)) {
115
- const newColumn = {
116
- ...column,
117
- pin: value || void 0
118
- };
119
- setColumn(newColumn);
120
- onConfigChange(replaceColumn(tableConfig, newColumn));
121
- break;
122
- }
123
- }
124
- }
125
- },
126
- [column, onConfigChange, tableConfig]
127
- );
128
- const handleChange = useCallback((evt) => {
129
- const input = evt.target;
130
- const fieldName = getFieldName(input);
131
- const { value } = input;
132
- switch (fieldName) {
133
- case "column-label":
134
- setColumn((state) => ({ ...state, label: value }));
135
- break;
136
- case "column-name":
137
- setColumn((state) => setCalculatedColumnName(state, value));
138
- break;
139
- case "column-width":
140
- setColumn((state) => ({ ...state, width: parseInt(value) }));
141
- break;
142
- }
143
- }, []);
144
- const handleChangeCalculatedColumnName = useCallback((name2) => {
145
- setColumn((state) => ({ ...state, name: name2 }));
146
- }, []);
147
- const handleChangeFormatting = useCallback(
148
- (formatting) => {
149
- const newColumn = updateColumnFormatting(column, formatting);
150
- setColumn(newColumn);
151
- onConfigChange(replaceColumn(tableConfig, newColumn));
152
- },
153
- [column, onConfigChange, tableConfig]
154
- );
155
- const handleChangeType = useCallback(
156
- (type) => {
157
- const updatedColumn = updateColumnType(column, type);
158
- setColumn(updatedColumn);
159
- onConfigChange(replaceColumn(tableConfig, updatedColumn));
160
- },
161
- [column, onConfigChange, tableConfig]
162
- );
163
- const handleChangeServerDataType = useCallback(
164
- (serverDataType) => {
165
- setColumn((col) => ({ ...col, serverDataType }));
166
- },
167
- []
168
- );
169
- const handleChangeRendering = useCallback(
170
- (renderProps) => {
171
- if (renderProps) {
172
- const newColumn = updateColumnRenderProps(
173
- column,
174
- renderProps
175
- );
176
- setColumn(newColumn);
177
- onConfigChange(replaceColumn(tableConfig, newColumn));
178
- }
179
- },
180
- [column, onConfigChange, tableConfig]
181
- );
182
- const navigateColumn = useCallback(
183
- ({ moveBy }) => {
184
- const { columns } = tableConfig;
185
- const index = columns.indexOf(column) + moveBy;
186
- const newColumn = columns[index];
187
- if (newColumn) {
188
- setColumn(newColumn);
189
- }
190
- },
191
- [column, tableConfig]
192
- );
193
- const navigateNextColumn = useCallback(() => {
194
- navigateColumn({ moveBy: 1 });
195
- }, [navigateColumn]);
196
- const navigatePrevColumn = useCallback(() => {
197
- navigateColumn({ moveBy: -1 });
198
- }, [navigateColumn]);
199
- const handleSaveCalculatedColumn = useCallback(() => {
200
- onCreateCalculatedColumn(column);
201
- }, [column, onCreateCalculatedColumn]);
202
- const handleCancelEdit = useCallback(() => {
203
- if (columnProp.name === "::") {
204
- onCancelCreateColumn();
205
- } else {
206
- if (columnRef.current !== void 0 && columnRef.current !== column) {
207
- setColumn(columnRef.current);
208
- }
209
- setEditMode(false);
210
- }
211
- }, [column, columnProp.name, onCancelCreateColumn]);
212
- return {
213
- availableRenderers,
214
- editCalculatedColumn: inEditMode,
215
- column,
216
- navigateNextColumn,
217
- navigatePrevColumn,
218
- onCancel: handleCancelEdit,
219
- onChange: handleChange,
220
- onChangeCalculatedColumnName: handleChangeCalculatedColumnName,
221
- onChangeFormatting: handleChangeFormatting,
222
- onChangeRendering: handleChangeRendering,
223
- onChangeServerDataType: handleChangeServerDataType,
224
- onChangeToggleButton: handleChangeToggleButton,
225
- onChangeType: handleChangeType,
226
- onEditCalculatedColumn: handleEditCalculatedcolumn,
227
- onInputCommit: handleInputCommit,
228
- onSave: handleSaveCalculatedColumn
229
- };
230
- };
231
-
232
- export { useColumnSettings };
233
- //# sourceMappingURL=useColumnSettings.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useColumnSettings.js","sources":["../../src/column-settings/useColumnSettings.ts"],"sourcesContent":["import {\n ColumnDescriptor,\n TableConfig,\n ColumnTypeFormatting,\n ColumnSettingsProps,\n ColumnTypeSimple,\n} from \"@vuu-ui/vuu-table-types\";\n\nimport {\n CellRendererDescriptor,\n ColumnRenderPropsChangeHandler,\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\";\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];\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(getRegisteredCellRenderers(\"double\"));\n case \"boolean\":\n return booleanCellRenderers.concat(getRegisteredCellRenderers(\"boolean\"));\n default:\n return stringCellRenderers;\n }\n};\n\nconst getFieldName = (input: HTMLInputElement | HTMLButtonElement): string => {\n const saltFormField = input.closest(\".saltFormField\") as HTMLElement;\n if (saltFormField && saltFormField.dataset.field) {\n const {\n dataset: { field },\n } = saltFormField;\n return field;\n } else {\n throw Error(\"named form field not found\");\n }\n};\n\nconst getColumn = (columns: ColumnDescriptor[], column: ColumnDescriptor) => {\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: ColumnTypeSimple) => {\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":["col","name"],"mappings":"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"}
@@ -1,11 +0,0 @@
1
- .vuuDatasourceStats {
2
- color: black;
3
- display: flex;
4
- font-size: 10px;
5
- gap: var(--salt-size-unit);
6
- padding: 4px 0 0 12px;
7
- }
8
-
9
- .vuuDatasourceStats-label {
10
- color: var(--vuu-color-gray-50);
11
- }
@@ -1,37 +0,0 @@
1
- import { jsxs, jsx } from 'react/jsx-runtime';
2
- import cx from 'clsx';
3
- import { useState, useEffect } from 'react';
4
-
5
- const classBase = "vuuDatasourceStats";
6
- const numberFormatter = new Intl.NumberFormat();
7
- const DataSourceStats = ({
8
- className: classNameProp,
9
- dataSource
10
- }) => {
11
- const [range, setRange] = useState(dataSource.range);
12
- const [size, setSize] = useState(dataSource.size);
13
- useEffect(() => {
14
- setSize(dataSource.size);
15
- dataSource.on("resize", setSize);
16
- dataSource.on("range", setRange);
17
- return () => {
18
- dataSource.removeListener("resize", setSize);
19
- dataSource.removeListener("range", setRange);
20
- };
21
- }, [dataSource]);
22
- const className = cx(classBase, classNameProp);
23
- const from = numberFormatter.format(range.from + 1);
24
- const to = numberFormatter.format(Math.min(range.to, size));
25
- const value = numberFormatter.format(size);
26
- return /* @__PURE__ */ jsxs("div", { className, children: [
27
- /* @__PURE__ */ jsx("span", { className: `${classBase}-label`, children: "Row count" }),
28
- /* @__PURE__ */ jsx("span", { className: `${classBase}-range`, children: from }),
29
- /* @__PURE__ */ jsx("span", { children: "-" }),
30
- /* @__PURE__ */ jsx("span", { className: `${classBase}-range`, children: to }),
31
- /* @__PURE__ */ jsx("span", { children: "of" }),
32
- /* @__PURE__ */ jsx("span", { className: `${classBase}-size`, children: value })
33
- ] });
34
- };
35
-
36
- export { DataSourceStats };
37
- //# sourceMappingURL=DatasourceStats.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"DatasourceStats.js","sources":["../../src/datasource-stats/DatasourceStats.tsx"],"sourcesContent":["import { DataSource } from \"@vuu-ui/vuu-data-types\";\nimport { VuuRange } from \"@vuu-ui/vuu-protocol-types\";\nimport cx from \"clsx\";\nimport { HTMLAttributes, useEffect, useState } from \"react\";\n\nimport \"./DatasourceStats.css\";\n\ninterface DataSourceStatsProps extends HTMLAttributes<HTMLSpanElement> {\n dataSource: DataSource;\n}\n\nconst classBase = \"vuuDatasourceStats\";\n\nconst numberFormatter = new Intl.NumberFormat();\n\nexport const DataSourceStats = ({\n className: classNameProp,\n dataSource,\n}: DataSourceStatsProps) => {\n const [range, setRange] = useState<VuuRange>(dataSource.range);\n const [size, setSize] = useState(dataSource.size);\n useEffect(() => {\n setSize(dataSource.size);\n dataSource.on(\"resize\", setSize);\n dataSource.on(\"range\", setRange);\n return () => {\n dataSource.removeListener(\"resize\", setSize);\n dataSource.removeListener(\"range\", setRange);\n };\n }, [dataSource]);\n\n const className = cx(classBase, classNameProp);\n const from = numberFormatter.format(range.from + 1);\n const to = numberFormatter.format(Math.min(range.to, size));\n const value = numberFormatter.format(size);\n return (\n <div className={className}>\n <span className={`${classBase}-label`}>Row count</span>\n <span className={`${classBase}-range`}>{from}</span>\n <span>-</span>\n <span className={`${classBase}-range`}>{to}</span>\n <span>of</span>\n <span className={`${classBase}-size`}>{value}</span>\n </div>\n );\n};\n"],"names":[],"mappings":";;;;AAWA,MAAM,SAAY,GAAA,oBAAA,CAAA;AAElB,MAAM,eAAA,GAAkB,IAAI,IAAA,CAAK,YAAa,EAAA,CAAA;AAEvC,MAAM,kBAAkB,CAAC;AAAA,EAC9B,SAAW,EAAA,aAAA;AAAA,EACX,UAAA;AACF,CAA4B,KAAA;AAC1B,EAAA,MAAM,CAAC,KAAO,EAAA,QAAQ,CAAI,GAAA,QAAA,CAAmB,WAAW,KAAK,CAAA,CAAA;AAC7D,EAAA,MAAM,CAAC,IAAM,EAAA,OAAO,CAAI,GAAA,QAAA,CAAS,WAAW,IAAI,CAAA,CAAA;AAChD,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,OAAA,CAAQ,WAAW,IAAI,CAAA,CAAA;AACvB,IAAW,UAAA,CAAA,EAAA,CAAG,UAAU,OAAO,CAAA,CAAA;AAC/B,IAAW,UAAA,CAAA,EAAA,CAAG,SAAS,QAAQ,CAAA,CAAA;AAC/B,IAAA,OAAO,MAAM;AACX,MAAW,UAAA,CAAA,cAAA,CAAe,UAAU,OAAO,CAAA,CAAA;AAC3C,MAAW,UAAA,CAAA,cAAA,CAAe,SAAS,QAAQ,CAAA,CAAA;AAAA,KAC7C,CAAA;AAAA,GACF,EAAG,CAAC,UAAU,CAAC,CAAA,CAAA;AAEf,EAAM,MAAA,SAAA,GAAY,EAAG,CAAA,SAAA,EAAW,aAAa,CAAA,CAAA;AAC7C,EAAA,MAAM,IAAO,GAAA,eAAA,CAAgB,MAAO,CAAA,KAAA,CAAM,OAAO,CAAC,CAAA,CAAA;AAClD,EAAM,MAAA,EAAA,GAAK,gBAAgB,MAAO,CAAA,IAAA,CAAK,IAAI,KAAM,CAAA,EAAA,EAAI,IAAI,CAAC,CAAA,CAAA;AAC1D,EAAM,MAAA,KAAA,GAAQ,eAAgB,CAAA,MAAA,CAAO,IAAI,CAAA,CAAA;AACzC,EACE,uBAAA,IAAA,CAAC,SAAI,SACH,EAAA,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,MAAK,EAAA,EAAA,SAAA,EAAW,CAAG,EAAA,SAAS,UAAU,QAAS,EAAA,WAAA,EAAA,CAAA;AAAA,wBAC/C,MAAK,EAAA,EAAA,SAAA,EAAW,CAAG,EAAA,SAAS,UAAW,QAAK,EAAA,IAAA,EAAA,CAAA;AAAA,oBAC7C,GAAA,CAAC,UAAK,QAAC,EAAA,GAAA,EAAA,CAAA;AAAA,wBACN,MAAK,EAAA,EAAA,SAAA,EAAW,CAAG,EAAA,SAAS,UAAW,QAAG,EAAA,EAAA,EAAA,CAAA;AAAA,oBAC3C,GAAA,CAAC,UAAK,QAAE,EAAA,IAAA,EAAA,CAAA;AAAA,wBACP,MAAK,EAAA,EAAA,SAAA,EAAW,CAAG,EAAA,SAAS,SAAU,QAAM,EAAA,KAAA,EAAA,CAAA;AAAA,GAC/C,EAAA,CAAA,CAAA;AAEJ;;;;"}
package/esm/index.js DELETED
@@ -1,24 +0,0 @@
1
- export { CaseValidator } from './cell-edit-validators/CaseValidator.js';
2
- export { PatternValidator } from './cell-edit-validators/PatternValidator.js';
3
- export { BackgroundCell } from './cell-renderers/background-cell/BackgroundCell.js';
4
- export { BackgroundCellConfigurationEditor } from './cell-renderers/background-cell/BackgroundCellConfigurationEditor.js';
5
- export { DropdownCell } from './cell-renderers/dropdown-cell/DropdownCell.js';
6
- export { LookupCell } from './cell-renderers/lookup-cell/LookupCell.js';
7
- export { PctProgressCell } from './cell-renderers/pct-progress-cell/PctProgressCell.js';
8
- import './cell-renderers/progress-cell/ProgressCell.js';
9
- export { ColumnList } from './column-list/ColumnList.js';
10
- export { ColumnSettingsPanel } from './column-settings/ColumnSettingsPanel.js';
11
- export { ColumnExpressionInput } from './column-expression-input/ColumnExpressionInput.js';
12
- export { columnExpressionLanguageSupport } from './column-expression-input/column-language-parser/ColumnExpressionLanguage.js';
13
- export { walkTree } from './column-expression-input/column-language-parser/ColumnExpressionTreeWalker.js';
14
- export { ColumnNamedTerms, isCompleteExpression, isCompleteRelationalExpression, lastNamedChild } from './column-expression-input/column-language-parser/column-expression-parse-utils.js';
15
- export { useColumnExpressionEditor } from './column-expression-input/useColumnExpressionEditor.js';
16
- export { useColumnExpressionSuggestionProvider } from './column-expression-input/useColumnExpressionSuggestionProvider.js';
17
- export { ColumnExpressionPanel } from './column-expression-panel/ColumnExpressionPanel.js';
18
- export { ColumnFormattingPanel } from './column-formatting-settings/ColumnFormattingPanel.js';
19
- export { BaseNumericFormattingSettings } from './column-formatting-settings/BaseNumericFormattingSettings.js';
20
- export { DateTimeFormattingSettings } from './column-formatting-settings/DateTimeFormattingSettings.js';
21
- export { DataSourceStats } from './datasource-stats/DatasourceStats.js';
22
- export { TableSettingsPanel } from './table-settings/TableSettingsPanel.js';
23
- export { useTableSettings } from './table-settings/useTableSettings.js';
24
- //# sourceMappingURL=index.js.map
package/esm/index.js.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;"}