@addev-be/ui 0.2.5 → 0.2.6

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 (133) hide show
  1. package/assets/icons/arrow-down-a-z.svg +1 -1
  2. package/assets/icons/arrow-up-z-a.svg +1 -1
  3. package/assets/icons/check.svg +1 -1
  4. package/assets/icons/down.svg +1 -1
  5. package/assets/icons/filter-full.svg +1 -1
  6. package/assets/icons/filter.svg +1 -1
  7. package/assets/icons/hashtag.svg +1 -1
  8. package/assets/icons/image-slash.svg +1 -1
  9. package/assets/icons/left.svg +1 -1
  10. package/assets/icons/magnifier.svg +1 -1
  11. package/assets/icons/phone.svg +1 -1
  12. package/assets/icons/right.svg +1 -1
  13. package/assets/icons/spinner-third.svg +1 -1
  14. package/assets/icons/table-columns.svg +1 -1
  15. package/assets/icons/up.svg +1 -1
  16. package/assets/icons/user-tie.svg +1 -1
  17. package/dist/components/data/DataGrid/AdvancedRequestDataGrid.d.ts +1 -2
  18. package/dist/components/data/DataGrid/AdvancedRequestDataGrid.js +3 -5
  19. package/dist/components/data/DataGrid/DataGridCell.d.ts +1 -1
  20. package/dist/components/data/DataGrid/DataGridCell.js +5 -5
  21. package/dist/components/data/DataGrid/DataGridEditableCell.js +2 -7
  22. package/dist/components/data/DataGrid/DataGridFilterMenu/index.js +10 -8
  23. package/dist/components/data/DataGrid/DataGridFooter.js +4 -14
  24. package/dist/components/data/DataGrid/DataGridHeader.js +1 -3
  25. package/dist/components/data/DataGrid/DataGridHeaderCell.js +6 -5
  26. package/dist/components/data/DataGrid/FilterModalContent/index.d.ts +5 -5
  27. package/dist/components/data/DataGrid/FilterModalContent/index.js +11 -9
  28. package/dist/components/data/DataGrid/FilterValuesScroller.d.ts +8 -7
  29. package/dist/components/data/DataGrid/FilterValuesScroller.js +5 -6
  30. package/dist/components/data/DataGrid/helpers/columns.js +1 -4
  31. package/dist/components/data/DataGrid/helpers/filters.d.ts +4 -3
  32. package/dist/components/data/DataGrid/helpers/filters.js +13 -5
  33. package/dist/components/data/DataGrid/hooks/useDataGrid.js +2 -2
  34. package/dist/components/data/DataGrid/hooks/useDataGridCopy.js +0 -1
  35. package/dist/components/data/DataGrid/hooks/useDataGridSettings.js +0 -1
  36. package/dist/components/data/DataGrid/index.js +16 -5
  37. package/dist/components/data/DataGrid/styles.d.ts +4 -1
  38. package/dist/components/data/DataGrid/styles.js +11 -8
  39. package/dist/components/data/DataGrid/types.d.ts +20 -15
  40. package/dist/components/data/SqlRequestDataGrid/helpers/columns.js +7 -9
  41. package/dist/components/data/SqlRequestDataGrid/index.js +34 -18
  42. package/dist/components/data/SqlRequestDataGrid/types.d.ts +1 -0
  43. package/dist/components/data/index.d.ts +2 -0
  44. package/dist/components/data/index.js +2 -0
  45. package/dist/helpers/dates.d.ts +2 -0
  46. package/dist/helpers/dates.js +13 -0
  47. package/package.json +1 -1
  48. package/src/Icons.tsx +80 -80
  49. package/src/components/data/AdvancedRequestDataGrid/helpers/advancedRequests.ts +93 -93
  50. package/src/components/data/AdvancedRequestDataGrid/helpers/columns.tsx +262 -262
  51. package/src/components/data/AdvancedRequestDataGrid/helpers/index.ts +2 -2
  52. package/src/components/data/AdvancedRequestDataGrid/index.tsx +269 -269
  53. package/src/components/data/AdvancedRequestDataGrid/types.ts +47 -47
  54. package/src/components/data/DataGrid/DataGridCell.tsx +73 -73
  55. package/src/components/data/DataGrid/DataGridColumnsModal/helpers.ts +14 -14
  56. package/src/components/data/DataGrid/DataGridColumnsModal/hooks.tsx +58 -58
  57. package/src/components/data/DataGrid/DataGridColumnsModal/index.tsx +181 -181
  58. package/src/components/data/DataGrid/DataGridColumnsModal/styles.ts +104 -104
  59. package/src/components/data/DataGrid/DataGridEditableCell.tsx +43 -54
  60. package/src/components/data/DataGrid/DataGridFilterMenu/hooks.tsx +75 -75
  61. package/src/components/data/DataGrid/DataGridFilterMenu/index.tsx +200 -190
  62. package/src/components/data/DataGrid/DataGridFilterMenu/styles.ts +100 -100
  63. package/src/components/data/DataGrid/DataGridFooter.tsx +44 -64
  64. package/src/components/data/DataGrid/DataGridHeader.tsx +126 -126
  65. package/src/components/data/DataGrid/DataGridHeaderCell.tsx +167 -167
  66. package/src/components/data/DataGrid/FilterModalContent/index.tsx +124 -125
  67. package/src/components/data/DataGrid/FilterModalContent/styles.ts +22 -22
  68. package/src/components/data/DataGrid/FilterValuesScroller.tsx +133 -131
  69. package/src/components/data/DataGrid/VirtualScroller.tsx +46 -46
  70. package/src/components/data/DataGrid/helpers/columns.tsx +196 -196
  71. package/src/components/data/DataGrid/helpers/filters.ts +220 -207
  72. package/src/components/data/DataGrid/helpers/index.ts +2 -2
  73. package/src/components/data/DataGrid/hooks/index.ts +30 -30
  74. package/src/components/data/DataGrid/hooks/useDataGrid.tsx +264 -264
  75. package/src/components/data/DataGrid/hooks/useDataGridCopy.ts +165 -165
  76. package/src/components/data/DataGrid/hooks/useDataGridSettings.ts +48 -48
  77. package/src/components/data/DataGrid/index.tsx +132 -132
  78. package/src/components/data/DataGrid/styles.ts +326 -326
  79. package/src/components/data/DataGrid/types.ts +241 -240
  80. package/src/components/data/SqlRequestDataGrid/helpers/columns.tsx +224 -224
  81. package/src/components/data/SqlRequestDataGrid/helpers/index.ts +2 -2
  82. package/src/components/data/SqlRequestDataGrid/helpers/sqlRequests.ts +16 -16
  83. package/src/components/data/SqlRequestDataGrid/index.tsx +252 -252
  84. package/src/components/data/SqlRequestDataGrid/types.ts +47 -47
  85. package/src/components/data/index.ts +8 -8
  86. package/src/components/forms/Button.tsx +99 -99
  87. package/src/components/forms/IconButton.tsx +56 -56
  88. package/src/components/forms/IndeterminateCheckbox.tsx +46 -46
  89. package/src/components/forms/Select.tsx +40 -40
  90. package/src/components/forms/index.ts +5 -5
  91. package/src/components/forms/styles.ts +20 -20
  92. package/src/components/index.ts +3 -3
  93. package/src/components/layout/Dropdown/index.tsx +79 -79
  94. package/src/components/layout/Dropdown/styles.ts +44 -44
  95. package/src/components/layout/Loading/index.tsx +29 -29
  96. package/src/components/layout/Loading/styles.ts +29 -29
  97. package/src/components/layout/Modal/index.tsx +51 -51
  98. package/src/components/layout/Modal/styles.ts +110 -110
  99. package/src/components/layout/index.ts +3 -3
  100. package/src/config/index.ts +14 -14
  101. package/src/helpers/dates.ts +9 -9
  102. package/src/helpers/getScrollbarSize.ts +14 -14
  103. package/src/helpers/numbers.ts +20 -20
  104. package/src/hooks/index.ts +2 -2
  105. package/src/hooks/useElementSize.ts +24 -24
  106. package/src/hooks/useWindowSize.ts +20 -20
  107. package/src/index.ts +7 -7
  108. package/src/providers/PortalsProvider/index.tsx +54 -54
  109. package/src/providers/PortalsProvider/styles.ts +27 -27
  110. package/src/providers/SettingsProvider/index.tsx +70 -70
  111. package/src/providers/ThemeProvider/ThemeProvider.ts +55 -55
  112. package/src/providers/ThemeProvider/defaultTheme.ts +444 -444
  113. package/src/providers/ThemeProvider/index.ts +3 -3
  114. package/src/providers/ThemeProvider/types.ts +123 -123
  115. package/src/providers/UiProviders/index.tsx +65 -65
  116. package/src/providers/UiProviders/styles.ts +10 -10
  117. package/src/providers/hooks.ts +8 -8
  118. package/src/providers/index.ts +5 -5
  119. package/src/services/HttpService.ts +80 -80
  120. package/src/services/WebSocketService.ts +147 -147
  121. package/src/services/advancedRequests.ts +101 -101
  122. package/src/services/base.ts +31 -31
  123. package/src/services/hooks.ts +23 -23
  124. package/src/services/index.ts +2 -2
  125. package/src/services/sqlRequests.ts +99 -99
  126. package/src/styles/animations.scss +30 -30
  127. package/src/styles/index.scss +42 -42
  128. package/src/typings.d.ts +6 -6
  129. package/tsconfig.tsbuildinfo +1 -1
  130. package/dist/components/data/DataGrid/helpers.d.ts +0 -28
  131. package/dist/components/data/DataGrid/helpers.js +0 -436
  132. package/dist/config/types.d.ts +0 -11
  133. package/dist/config/types.js +0 -2
@@ -1,165 +1,165 @@
1
- /* eslint-disable @typescript-eslint/no-explicit-any */
2
-
3
- import { DataGridColumn, DataGridColumns } from '../types';
4
-
5
- import { useCallback } from 'react';
6
-
7
- export const useDataGridCopy = <R>(
8
- rows: R[],
9
- columns: DataGridColumns<R>,
10
- loadCopyRows?: () => Promise<R[]>
11
- ) => {
12
- const generateHeadersHtml = useCallback(() => {
13
- return `<tr>
14
- ${Object.values(columns ?? {})
15
- .map(
16
- (col) =>
17
- `<th style="
18
- text-align: left;
19
- font-weight: bold;
20
- white-space: nowrap;
21
- ">
22
- ${col.name}
23
- </th>`
24
- )
25
- .join('\n')}
26
- </tr>`;
27
- }, [columns]);
28
-
29
- const generateFootersHtml = useCallback(
30
- (rowsToCopy: R[]) => {
31
- return `<tr>
32
- ${Object.values(columns ?? {})
33
- .map(
34
- (col) =>
35
- `<td style="
36
- font-weight: bold;
37
- white-space: nowrap;
38
- ">
39
- ${
40
- col.footer
41
- ? col.footer(rowsToCopy, rowsToCopy, [])
42
- : ''
43
- }
44
- </td>`
45
- )
46
- .join('\n')}
47
- </tr>`;
48
- },
49
- [columns]
50
- );
51
-
52
- const generateCellText = useCallback((col: DataGridColumn<R>, value: any) => {
53
- return col.excelValue ? col.excelValue(value) : value?.toString() ?? '';
54
- }, []);
55
-
56
- const generateCellHtml = useCallback(
57
- (col: DataGridColumn<R>, value: any) => `<td style="
58
- ${
59
- col.excelFormatter
60
- ? "mso-number-format: '" + col.excelFormatter(col) + "';"
61
- : ''
62
- }
63
- white-space: nowrap;
64
- ">
65
- ${generateCellText(col, value)}
66
- </td>`,
67
- [generateCellText]
68
- );
69
-
70
- const generateCopyHtml = useCallback(
71
- (rowsToCopy: R[], includeHeaders: boolean, includeFooters: boolean) => {
72
- return `
73
- <table>
74
- ${includeHeaders ? generateHeadersHtml() : ''}
75
- ${(rowsToCopy || [])
76
- .map(
77
- (row) =>
78
- `<tr>
79
- ${Object.values(columns ?? {})
80
- .map((col) => {
81
- const value: any =
82
- col.getter && row ? col.getter(row) : '';
83
- return generateCellHtml(col, value);
84
- })
85
- .join('\n')}
86
- </tr>`
87
- )
88
- .join('\n')}
89
- ${includeFooters ? generateFootersHtml(rowsToCopy) : ''}
90
- </table>
91
- `;
92
- },
93
- [columns, generateCellHtml, generateFootersHtml, generateHeadersHtml]
94
- );
95
-
96
- const generateHeadersText = useCallback(() => {
97
- return Object.values(columns ?? {})
98
- .map((col) => col.name)
99
- .join('\t');
100
- }, [columns]);
101
-
102
- const generateFootersText = useCallback(
103
- (rowsToCopy: R[]) => {
104
- return Object.values(columns ?? {})
105
- .map((col) =>
106
- col.footer ? col.footer(rowsToCopy, rowsToCopy, []) : ''
107
- )
108
- .join('\t');
109
- },
110
- [columns]
111
- );
112
-
113
- const generateCopyText = useCallback(
114
- (rowsToCopy: R[], includeHeaders: boolean, includeFooters: boolean) => {
115
- return [
116
- includeHeaders ? generateHeadersText() : '',
117
- ...(rowsToCopy || []).map((row) =>
118
- Object.values(columns ?? {})
119
- .map((col) => {
120
- const value: any = col.getter && row ? col.getter(row) : '';
121
- return col.excelValue
122
- ? col.excelValue(value)
123
- : value != null && value !== undefined
124
- ? value.toString()
125
- : '';
126
- })
127
- .join('\t')
128
- ),
129
- includeFooters ? generateFootersText(rowsToCopy) : '',
130
- ]
131
- .filter((s) => s != null)
132
- .join('\n');
133
- },
134
- [columns, generateFootersText, generateHeadersText]
135
- );
136
-
137
- const copyTable = useCallback(
138
- async (includeHeaders = true, includeFooters = true) => {
139
- const rowsToCopy = loadCopyRows ? await loadCopyRows() : rows;
140
-
141
- const copyHtml = generateCopyHtml(
142
- rowsToCopy,
143
- includeHeaders,
144
- includeFooters
145
- );
146
- const copyText = generateCopyText(
147
- rowsToCopy,
148
- includeHeaders,
149
- includeFooters
150
- );
151
-
152
- await navigator['clipboard'].write([
153
- new ClipboardItem({
154
- 'text/plain': new Blob([copyText], { type: 'text/plain' }),
155
- 'text/html': new Blob([copyHtml], { type: 'text/html' }),
156
- }),
157
- ]);
158
- },
159
- [generateCopyHtml, generateCopyText, loadCopyRows, rows]
160
- );
161
-
162
- return {
163
- copyTable,
164
- };
165
- };
1
+ /* eslint-disable @typescript-eslint/no-explicit-any */
2
+
3
+ import { DataGridColumn, DataGridColumns } from '../types';
4
+
5
+ import { useCallback } from 'react';
6
+
7
+ export const useDataGridCopy = <R>(
8
+ rows: R[],
9
+ columns: DataGridColumns<R>,
10
+ loadCopyRows?: () => Promise<R[]>
11
+ ) => {
12
+ const generateHeadersHtml = useCallback(() => {
13
+ return `<tr>
14
+ ${Object.values(columns ?? {})
15
+ .map(
16
+ (col) =>
17
+ `<th style="
18
+ text-align: left;
19
+ font-weight: bold;
20
+ white-space: nowrap;
21
+ ">
22
+ ${col.name}
23
+ </th>`
24
+ )
25
+ .join('\n')}
26
+ </tr>`;
27
+ }, [columns]);
28
+
29
+ const generateFootersHtml = useCallback(
30
+ (rowsToCopy: R[]) => {
31
+ return `<tr>
32
+ ${Object.values(columns ?? {})
33
+ .map(
34
+ (col) =>
35
+ `<td style="
36
+ font-weight: bold;
37
+ white-space: nowrap;
38
+ ">
39
+ ${
40
+ col.footer
41
+ ? col.footer(rowsToCopy, rowsToCopy, [])
42
+ : ''
43
+ }
44
+ </td>`
45
+ )
46
+ .join('\n')}
47
+ </tr>`;
48
+ },
49
+ [columns]
50
+ );
51
+
52
+ const generateCellText = useCallback((col: DataGridColumn<R>, value: any) => {
53
+ return col.excelValue ? col.excelValue(value) : value?.toString() ?? '';
54
+ }, []);
55
+
56
+ const generateCellHtml = useCallback(
57
+ (col: DataGridColumn<R>, value: any) => `<td style="
58
+ ${
59
+ col.excelFormatter
60
+ ? "mso-number-format: '" + col.excelFormatter(col) + "';"
61
+ : ''
62
+ }
63
+ white-space: nowrap;
64
+ ">
65
+ ${generateCellText(col, value)}
66
+ </td>`,
67
+ [generateCellText]
68
+ );
69
+
70
+ const generateCopyHtml = useCallback(
71
+ (rowsToCopy: R[], includeHeaders: boolean, includeFooters: boolean) => {
72
+ return `
73
+ <table>
74
+ ${includeHeaders ? generateHeadersHtml() : ''}
75
+ ${(rowsToCopy || [])
76
+ .map(
77
+ (row) =>
78
+ `<tr>
79
+ ${Object.values(columns ?? {})
80
+ .map((col) => {
81
+ const value: any =
82
+ col.getter && row ? col.getter(row) : '';
83
+ return generateCellHtml(col, value);
84
+ })
85
+ .join('\n')}
86
+ </tr>`
87
+ )
88
+ .join('\n')}
89
+ ${includeFooters ? generateFootersHtml(rowsToCopy) : ''}
90
+ </table>
91
+ `;
92
+ },
93
+ [columns, generateCellHtml, generateFootersHtml, generateHeadersHtml]
94
+ );
95
+
96
+ const generateHeadersText = useCallback(() => {
97
+ return Object.values(columns ?? {})
98
+ .map((col) => col.name)
99
+ .join('\t');
100
+ }, [columns]);
101
+
102
+ const generateFootersText = useCallback(
103
+ (rowsToCopy: R[]) => {
104
+ return Object.values(columns ?? {})
105
+ .map((col) =>
106
+ col.footer ? col.footer(rowsToCopy, rowsToCopy, []) : ''
107
+ )
108
+ .join('\t');
109
+ },
110
+ [columns]
111
+ );
112
+
113
+ const generateCopyText = useCallback(
114
+ (rowsToCopy: R[], includeHeaders: boolean, includeFooters: boolean) => {
115
+ return [
116
+ includeHeaders ? generateHeadersText() : '',
117
+ ...(rowsToCopy || []).map((row) =>
118
+ Object.values(columns ?? {})
119
+ .map((col) => {
120
+ const value: any = col.getter && row ? col.getter(row) : '';
121
+ return col.excelValue
122
+ ? col.excelValue(value)
123
+ : value != null && value !== undefined
124
+ ? value.toString()
125
+ : '';
126
+ })
127
+ .join('\t')
128
+ ),
129
+ includeFooters ? generateFootersText(rowsToCopy) : '',
130
+ ]
131
+ .filter((s) => s != null)
132
+ .join('\n');
133
+ },
134
+ [columns, generateFootersText, generateHeadersText]
135
+ );
136
+
137
+ const copyTable = useCallback(
138
+ async (includeHeaders = true, includeFooters = true) => {
139
+ const rowsToCopy = loadCopyRows ? await loadCopyRows() : rows;
140
+
141
+ const copyHtml = generateCopyHtml(
142
+ rowsToCopy,
143
+ includeHeaders,
144
+ includeFooters
145
+ );
146
+ const copyText = generateCopyText(
147
+ rowsToCopy,
148
+ includeHeaders,
149
+ includeFooters
150
+ );
151
+
152
+ await navigator['clipboard'].write([
153
+ new ClipboardItem({
154
+ 'text/plain': new Blob([copyText], { type: 'text/plain' }),
155
+ 'text/html': new Blob([copyHtml], { type: 'text/html' }),
156
+ }),
157
+ ]);
158
+ },
159
+ [generateCopyHtml, generateCopyText, loadCopyRows, rows]
160
+ );
161
+
162
+ return {
163
+ copyTable,
164
+ };
165
+ };
@@ -1,48 +1,48 @@
1
- import { useCallback, useEffect, useState } from 'react';
2
-
3
- import { DataGridSettings } from '../types';
4
- import { useSettings } from '../../../../providers';
5
-
6
- export const useDataGridSettings = (name?: string) => {
7
- // TODO: Implement settings context
8
- const { settings, updateSettings } = useSettings();
9
- const [dataGridSettings, setDataGridSettings] = useState<DataGridSettings>(
10
- {}
11
- );
12
-
13
- useEffect(() => {
14
- if (name) {
15
- const settingName = `user.datagrid.settings.${name}`;
16
- const gridSettingsJson = settings?.[settingName] || '{}';
17
- let gridSettings: DataGridSettings = {};
18
- try {
19
- gridSettings = JSON.parse(gridSettingsJson);
20
- } catch (error) {
21
- console.error('[GRID] cannot decode datagrid settings for', {
22
- name,
23
- gridSettingsJson,
24
- error,
25
- });
26
- }
27
- setDataGridSettings(gridSettings);
28
- }
29
- }, [name, settings]);
30
-
31
- const saveSettings = useCallback(
32
- (newValue?: DataGridSettings) => {
33
- if (name) {
34
- const settingName = `user.datagrid.settings.${name}`;
35
- const newSettings = newValue ?? dataGridSettings;
36
- const newSettingsJson = JSON.stringify(newSettings);
37
- updateSettings({ [settingName]: newSettingsJson });
38
- }
39
- },
40
- [dataGridSettings, name, updateSettings]
41
- );
42
-
43
- return {
44
- settings: dataGridSettings,
45
- setSettings: setDataGridSettings,
46
- saveSettings,
47
- };
48
- };
1
+ import { useCallback, useEffect, useState } from 'react';
2
+
3
+ import { DataGridSettings } from '../types';
4
+ import { useSettings } from '../../../../providers';
5
+
6
+ export const useDataGridSettings = (name?: string) => {
7
+ // TODO: Implement settings context
8
+ const { settings, updateSettings } = useSettings();
9
+ const [dataGridSettings, setDataGridSettings] = useState<DataGridSettings>(
10
+ {}
11
+ );
12
+
13
+ useEffect(() => {
14
+ if (name) {
15
+ const settingName = `user.datagrid.settings.${name}`;
16
+ const gridSettingsJson = settings?.[settingName] || '{}';
17
+ let gridSettings: DataGridSettings = {};
18
+ try {
19
+ gridSettings = JSON.parse(gridSettingsJson);
20
+ } catch (error) {
21
+ console.error('[GRID] cannot decode datagrid settings for', {
22
+ name,
23
+ gridSettingsJson,
24
+ error,
25
+ });
26
+ }
27
+ setDataGridSettings(gridSettings);
28
+ }
29
+ }, [name, settings]);
30
+
31
+ const saveSettings = useCallback(
32
+ (newValue?: DataGridSettings) => {
33
+ if (name) {
34
+ const settingName = `user.datagrid.settings.${name}`;
35
+ const newSettings = newValue ?? dataGridSettings;
36
+ const newSettingsJson = JSON.stringify(newSettings);
37
+ updateSettings({ [settingName]: newSettingsJson });
38
+ }
39
+ },
40
+ [dataGridSettings, name, updateSettings]
41
+ );
42
+
43
+ return {
44
+ settings: dataGridSettings,
45
+ setSettings: setDataGridSettings,
46
+ saveSettings,
47
+ };
48
+ };