@quillsql/react 2.8.5 → 2.8.7
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.
- package/dist/AddToDashboardModal.js +146 -180
- package/dist/BarList.js +36 -43
- package/dist/Chart.js +99 -131
- package/dist/ChartBuilder.js +80 -88
- package/dist/ChartEditor.js +14 -20
- package/dist/Context.js +52 -56
- package/dist/Dashboard.d.ts.map +1 -1
- package/dist/Dashboard.js +246 -305
- package/dist/DateRangePicker/Calendar.js +41 -45
- package/dist/DateRangePicker/DateRangePicker.js +32 -60
- package/dist/DateRangePicker/DateRangePickerButton.js +14 -16
- package/dist/DateRangePicker/dateRangePickerUtils.d.ts +6 -0
- package/dist/DateRangePicker/dateRangePickerUtils.d.ts.map +1 -1
- package/dist/DateRangePicker/dateRangePickerUtils.js +89 -89
- package/dist/DateRangePicker/index.js +1 -8
- package/dist/PieChart.js +35 -69
- package/dist/QuillProvider.js +4 -6
- package/dist/ReportBuilder.js +120 -128
- package/dist/SQLEditor.js +56 -64
- package/dist/Table.d.ts +2 -1
- package/dist/Table.d.ts.map +1 -1
- package/dist/Table.js +71 -69
- package/dist/TableChart.js +17 -44
- package/dist/assets/ArrowDownHeadIcon.js +3 -5
- package/dist/assets/ArrowDownIcon.js +3 -5
- package/dist/assets/ArrowDownRightIcon.js +3 -5
- package/dist/assets/ArrowLeftHeadIcon.js +3 -5
- package/dist/assets/ArrowRightHeadIcon.js +3 -5
- package/dist/assets/ArrowRightIcon.js +3 -5
- package/dist/assets/ArrowUpHeadIcon.js +3 -5
- package/dist/assets/ArrowUpIcon.js +3 -5
- package/dist/assets/ArrowUpRightIcon.js +3 -5
- package/dist/assets/CalendarIcon.js +3 -5
- package/dist/assets/CalendarNormalIcon.js +3 -5
- package/dist/assets/DoubleArrowLeftHeadIcon.js +3 -5
- package/dist/assets/DoubleArrowRightHeadIcon.js +3 -5
- package/dist/assets/ExclamationFilledIcon.js +3 -5
- package/dist/assets/FilterIcon.js +3 -5
- package/dist/assets/LoadingSpinner.js +3 -5
- package/dist/assets/RefreshIcon.js +3 -5
- package/dist/assets/SearchIcon.js +3 -5
- package/dist/assets/UpLeftArrowsIcon.js +3 -5
- package/dist/assets/XCircleIcon.js +3 -5
- package/dist/assets/XIcon.js +3 -5
- package/dist/assets/index.js +21 -48
- package/dist/components/BigModal/BigModal.js +13 -38
- package/dist/components/Dropdown/Dropdown.js +24 -52
- package/dist/components/Dropdown/DropdownItem.js +9 -34
- package/dist/components/Dropdown/index.js +2 -10
- package/dist/components/Modal/Modal.js +13 -38
- package/dist/components/Modal/index.js +1 -8
- package/dist/components/QuillCard.js +8 -12
- package/dist/components/SqlTextEditor.d.ts +7 -0
- package/dist/components/SqlTextEditor.d.ts.map +1 -0
- package/dist/components/SqlTextEditor.js +14 -0
- package/dist/components/UiComponents.js +37 -50
- package/dist/components/selectUtils.js +6 -16
- package/dist/contexts/BaseColorContext.js +3 -5
- package/dist/contexts/HoveredValueContext.js +3 -5
- package/dist/contexts/RootStylesContext.js +3 -5
- package/dist/contexts/SelectedValueContext.js +3 -5
- package/dist/contexts/index.js +4 -14
- package/dist/hooks/index.js +4 -14
- package/dist/hooks/useDashboard.d.ts +7 -0
- package/dist/hooks/useDashboard.d.ts.map +1 -0
- package/dist/hooks/useDashboard.js +49 -0
- package/dist/hooks/useInternalState.js +3 -5
- package/dist/hooks/useOnClickOutside.js +3 -5
- package/dist/hooks/useOnWindowResize.js +4 -6
- package/dist/hooks/useQuill.js +11 -15
- package/dist/hooks/useSelectOnKeyDown.js +4 -6
- package/dist/index.d.ts +2 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +13 -28
- package/dist/internals/ReportBuilder/PivotList.js +14 -19
- package/dist/internals/ReportBuilder/PivotModal.js +84 -91
- package/dist/internals/ReportBuilder/PivotModal.spec.js +70 -72
- package/dist/lib/font.js +2 -5
- package/dist/lib/index.js +3 -19
- package/dist/lib/inputTypes.js +1 -2
- package/dist/lib/utils.js +8 -18
- package/dist/utils/aggregate.js +28 -34
- package/dist/utils/colorToHex.js +1 -4
- package/dist/utils/dataFetcher.js +2 -7
- package/dist/utils/downloadCSV.js +1 -5
- package/package.json +2 -1
package/dist/Table.js
CHANGED
|
@@ -1,18 +1,15 @@
|
|
|
1
|
-
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.SpecialTable = void 0;
|
|
4
|
-
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
5
2
|
/* eslint-disable @typescript-eslint/ban-ts-comment */
|
|
6
3
|
// @ts-nocheck
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
4
|
+
import { useContext, useEffect, useState } from 'react';
|
|
5
|
+
import { ClientContext, DashboardContext, ThemeContext, DashboardFiltersContext, } from './Context';
|
|
6
|
+
import { valueFormatter } from './Chart';
|
|
7
|
+
import { getData } from './utils/dataFetcher';
|
|
11
8
|
const Table = ({ chartId, columns, rows, containerStyle, csvFilename, showDownloadCsvButton, LoadingComponent, }) => {
|
|
12
|
-
const { dispatch, dashboard } =
|
|
13
|
-
const { dashboardFilters } =
|
|
14
|
-
const [client, _] =
|
|
15
|
-
const [theme] =
|
|
9
|
+
const { dispatch, dashboard } = useContext(DashboardContext);
|
|
10
|
+
const { dashboardFilters } = useContext(DashboardFiltersContext);
|
|
11
|
+
const [client, _] = useContext(ClientContext);
|
|
12
|
+
const [theme] = useContext(ThemeContext);
|
|
16
13
|
const downloadCSV = (rows, name) => {
|
|
17
14
|
// report.rows
|
|
18
15
|
if (!rows.length) {
|
|
@@ -41,9 +38,9 @@ const Table = ({ chartId, columns, rows, containerStyle, csvFilename, showDownlo
|
|
|
41
38
|
document.body.removeChild(downloadLink);
|
|
42
39
|
};
|
|
43
40
|
if (!chartId && rows && columns) {
|
|
44
|
-
return ((
|
|
41
|
+
return (_jsx(SpecialTable, { showDownloadCsvButton: showDownloadCsvButton, csvFilename: csvFilename || 'table', columns: columns, rows: rows, height: containerStyle?.height || '100%', theme: theme, containerStyle: containerStyle, LoadingComponent: LoadingComponent }));
|
|
45
42
|
}
|
|
46
|
-
return ((
|
|
43
|
+
return (_jsx(ChartUpdater, { showDownloadCsvButton: showDownloadCsvButton, dispatch: dispatch, dashboard: dashboard, chartId: chartId, containerStyle: containerStyle, dashboardFilters: dashboardFilters, client: client, theme: theme, downloadCSV: downloadCSV, csvFilename: csvFilename, LoadingComponent: LoadingComponent }));
|
|
47
44
|
};
|
|
48
45
|
const compareValues = (a, b, column) => {
|
|
49
46
|
const valueA = a[column];
|
|
@@ -62,13 +59,13 @@ const compareValues = (a, b, column) => {
|
|
|
62
59
|
// For strings
|
|
63
60
|
return valueA.localeCompare(valueB);
|
|
64
61
|
};
|
|
65
|
-
function SpecialTable({ columns, rows, height, containerStyle, loading, LoadingComponent, theme, showDownloadCsvButton = true, csvFilename, DownloadCSVButtonComponent, AddToDashboardButtonComponent, isTableChart = false, name, }) {
|
|
66
|
-
const [activeRows, setActiveRows] =
|
|
67
|
-
const [page, setPage] =
|
|
68
|
-
const [maxPage, setMaxPage] =
|
|
69
|
-
const [sortColumn, setSortColumn] =
|
|
70
|
-
const [sortDirection, setSortDirection] =
|
|
71
|
-
|
|
62
|
+
export function SpecialTable({ columns, rows, height, containerStyle, loading, LoadingComponent, theme, showDownloadCsvButton = true, csvFilename, DownloadCSVButtonComponent, AddToDashboardButtonComponent, isTableChart = false, name, }) {
|
|
63
|
+
const [activeRows, setActiveRows] = useState([]);
|
|
64
|
+
const [page, setPage] = useState(1);
|
|
65
|
+
const [maxPage, setMaxPage] = useState(1);
|
|
66
|
+
const [sortColumn, setSortColumn] = useState(null);
|
|
67
|
+
const [sortDirection, setSortDirection] = useState('desc');
|
|
68
|
+
useEffect(() => {
|
|
72
69
|
const sortedRows = [...rows];
|
|
73
70
|
if (sortColumn) {
|
|
74
71
|
sortedRows.sort((a, b) => {
|
|
@@ -114,7 +111,7 @@ function SpecialTable({ columns, rows, height, containerStyle, loading, LoadingC
|
|
|
114
111
|
const newRows = [];
|
|
115
112
|
for (let i = 0; i < rows.length; i++) {
|
|
116
113
|
const newRow = {};
|
|
117
|
-
Object.keys(rows[i]).forEach((field) => (newRow[field] =
|
|
114
|
+
Object.keys(rows[i]).forEach((field) => (newRow[field] = valueFormatter({
|
|
118
115
|
value: rows[i][field],
|
|
119
116
|
field: field,
|
|
120
117
|
fields: columns,
|
|
@@ -127,7 +124,13 @@ function SpecialTable({ columns, rows, height, containerStyle, loading, LoadingC
|
|
|
127
124
|
csvRows.push(columns.map((col) => col.label || col.field).join(','));
|
|
128
125
|
// Data rows
|
|
129
126
|
for (const row of newRows) {
|
|
130
|
-
const values = fields.map((field) =>
|
|
127
|
+
const values = fields.map((field) => {
|
|
128
|
+
let value = JSON.stringify(row[field] || '');
|
|
129
|
+
if (value.includes('\\"')) {
|
|
130
|
+
value = value.replaceAll('\\"', '""');
|
|
131
|
+
}
|
|
132
|
+
return value;
|
|
133
|
+
});
|
|
131
134
|
csvRows.push(values.join(','));
|
|
132
135
|
}
|
|
133
136
|
// Create CSV string and create a 'blob' with it
|
|
@@ -166,7 +169,7 @@ function SpecialTable({ columns, rows, height, containerStyle, loading, LoadingC
|
|
|
166
169
|
document.body.removeChild(downloadLink);
|
|
167
170
|
};
|
|
168
171
|
if (loading) {
|
|
169
|
-
return ((
|
|
172
|
+
return (_jsx("div", { style: {
|
|
170
173
|
...containerStyle,
|
|
171
174
|
// paddingLeft: 25,
|
|
172
175
|
// paddingRight: 25,
|
|
@@ -178,7 +181,7 @@ function SpecialTable({ columns, rows, height, containerStyle, loading, LoadingC
|
|
|
178
181
|
// overflow: 'hidden',
|
|
179
182
|
// @ts-ignore
|
|
180
183
|
// boxShadow: 'rgba(231, 231, 231, 0.5) 0px 1px 2px 0px',
|
|
181
|
-
}, children: (
|
|
184
|
+
}, children: _jsxs("div", { style: {
|
|
182
185
|
height: '100%',
|
|
183
186
|
overflow: 'scroll',
|
|
184
187
|
borderRadius: 6,
|
|
@@ -193,7 +196,7 @@ function SpecialTable({ columns, rows, height, containerStyle, loading, LoadingC
|
|
|
193
196
|
justifyContent: 'center',
|
|
194
197
|
alignItems: 'center',
|
|
195
198
|
// maxHeight: 600,
|
|
196
|
-
}, children: [LoadingComponent && (
|
|
199
|
+
}, children: [LoadingComponent && _jsx(LoadingComponent, {}), !LoadingComponent && (_jsxs("svg", { width: "24", height: "24", children: [_jsx("circle", { cx: "12", cy: "12", r: "9.375", strokeWidth: "3.75", strokeDasharray: "calc(2 * 3.14 * 9.375 / 3) calc(2 * 3.14 * 9.375 * 2 / 3)", strokeDashoffset: "calc(2 * 3.14 * 9.375 / 6)", stroke: theme?.primaryTextColor || '#364153', fill: "none", transform: "rotate(-90 12 12)", children: _jsx("animateTransform", { attributeName: "transform", attributeType: "XML", type: "rotate", from: "-180 12 12", to: "180 12 12", dur: "0.8s", repeatCount: "indefinite" }) }), _jsx("circle", { cx: "12", cy: "12", r: "9.375", strokeWidth: "3.75", strokeDasharray: "calc(2 * 3.14 * 9.375 / 3) calc(2 * 3.14 * 9.375 * 1 / 3)", strokeDashoffset: "calc(2 * 3.14 * 9.375 / 3) calc(2 * 3.14 * 9.375 * 2 / 3)", stroke: '#ADB1B9', fill: "none", transform: "rotate(90 12 12)", children: _jsx("animateTransform", { attributeName: "transform", attributeType: "XML", type: "rotate", from: "0 12 12", to: "360 12 12", dur: "0.8s", repeatCount: "indefinite" }) })] }))] }) }));
|
|
197
200
|
}
|
|
198
201
|
if (!columns || !columns.length || !activeRows) {
|
|
199
202
|
return null;
|
|
@@ -213,7 +216,7 @@ function SpecialTable({ columns, rows, height, containerStyle, loading, LoadingC
|
|
|
213
216
|
return null;
|
|
214
217
|
}
|
|
215
218
|
}
|
|
216
|
-
return ((
|
|
219
|
+
return (_jsxs("div", { style: {
|
|
217
220
|
...containerStyle,
|
|
218
221
|
// paddingLeft: 25,
|
|
219
222
|
// paddingRight: 25,
|
|
@@ -226,7 +229,7 @@ function SpecialTable({ columns, rows, height, containerStyle, loading, LoadingC
|
|
|
226
229
|
// overflow: 'hidden',
|
|
227
230
|
// @ts-ignore
|
|
228
231
|
// boxShadow: 'rgba(231, 231, 231, 0.5) 0px 1px 2px 0px',
|
|
229
|
-
}, children: [(
|
|
232
|
+
}, children: [_jsx("div", { style: {
|
|
230
233
|
height: '100%',
|
|
231
234
|
overflow: 'auto',
|
|
232
235
|
borderRadius: 6,
|
|
@@ -237,12 +240,12 @@ function SpecialTable({ columns, rows, height, containerStyle, loading, LoadingC
|
|
|
237
240
|
boxSizing: 'border-box',
|
|
238
241
|
outline: 'none',
|
|
239
242
|
// maxHeight: 600,
|
|
240
|
-
}, children: (
|
|
243
|
+
}, children: _jsxs("div", { role: "table", className: "table", style: { minWidth: '0px', width: '100%', height: '100%' }, children: [_jsx("div", { className: "thead", children: _jsx("div", { role: "row", className: "tr", style: {
|
|
241
244
|
display: 'flex',
|
|
242
245
|
flex: '1 0 auto',
|
|
243
246
|
minWidth: '100px',
|
|
244
247
|
boxSizing: 'border-box',
|
|
245
|
-
}, children: columns.map((column, index) => ((
|
|
248
|
+
}, children: columns.map((column, index) => (_jsxs("div", { onClick: () => toggleSort(column),
|
|
246
249
|
// @ts-ignore
|
|
247
250
|
style: {
|
|
248
251
|
boxSizing: 'border-box',
|
|
@@ -268,7 +271,7 @@ function SpecialTable({ columns, rows, height, containerStyle, loading, LoadingC
|
|
|
268
271
|
display: 'flex',
|
|
269
272
|
flexDirection: 'row',
|
|
270
273
|
justifyContent: 'space-between',
|
|
271
|
-
}, children: [(
|
|
274
|
+
}, children: [_jsx("div", { "aria-haspopup": "dialog", "aria-expanded": "false", "aria-controls": "mantine-r6-dropdown",
|
|
272
275
|
// @ts-ignore
|
|
273
276
|
style: {
|
|
274
277
|
// fontFamily:
|
|
@@ -284,16 +287,16 @@ function SpecialTable({ columns, rows, height, containerStyle, loading, LoadingC
|
|
|
284
287
|
textOverflow: 'ellipsis',
|
|
285
288
|
whiteSpace: 'nowrap',
|
|
286
289
|
overflow: 'hidden',
|
|
287
|
-
}, children: column.label || column.field }), column.field === sortColumn && ((
|
|
290
|
+
}, children: column.label || column.field }), column.field === sortColumn && (_jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 20 20", fill: theme?.primaryTextColor, height: "14px", width: "14px", style: {
|
|
288
291
|
transform: sortDirection === 'desc'
|
|
289
292
|
? 'rotate(180deg)'
|
|
290
293
|
: undefined,
|
|
291
|
-
}, children: (
|
|
294
|
+
}, children: _jsx("path", { fillRule: "evenodd", d: "M10 3a.75.75 0 01.75.75v10.638l3.96-4.158a.75.75 0 111.08 1.04l-5.25 5.5a.75.75 0 01-1.08 0l-5.25-5.5a.75.75 0 111.08-1.04l3.96 4.158V3.75A.75.75 0 0110 3z", clipRule: "evenodd" }) }))] }, 'sqlcol' + index))) }) }), _jsx("div", { role: "rowgroup", className: "tbody", children: activeRows.map((row, rowIndex) => (_jsx("div", { role: "row", className: "tr", style: {
|
|
292
295
|
display: 'flex',
|
|
293
296
|
flex: '1 0 auto',
|
|
294
297
|
minWidth: '100px',
|
|
295
298
|
boxSizing: 'border-box',
|
|
296
|
-
}, children: columns.map((column, columnIndex) => ((
|
|
299
|
+
}, children: columns.map((column, columnIndex) => (_jsx("div", { role: "cell", style: {
|
|
297
300
|
boxSizing: 'border-box',
|
|
298
301
|
flex: '150 0 auto',
|
|
299
302
|
minWidth: '50px',
|
|
@@ -313,14 +316,14 @@ function SpecialTable({ columns, rows, height, containerStyle, loading, LoadingC
|
|
|
313
316
|
? '1px solid rgb(229, 231, 235)'
|
|
314
317
|
: undefined,
|
|
315
318
|
userSelect: 'none',
|
|
316
|
-
}, children: (
|
|
319
|
+
}, children: _jsx("div", { style: {
|
|
317
320
|
lineHeight: '24px',
|
|
318
321
|
width: '100%',
|
|
319
322
|
display: 'flex',
|
|
320
323
|
cursor: 'default',
|
|
321
324
|
position: 'relative',
|
|
322
325
|
userSelect: 'none',
|
|
323
|
-
}, "data-testid": "static-cell", children: (
|
|
326
|
+
}, "data-testid": "static-cell", children: _jsx("div", { "aria-haspopup": "dialog", "aria-expanded": "false", style: {
|
|
324
327
|
fontFamily: theme?.fontFamily ||
|
|
325
328
|
'Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji"',
|
|
326
329
|
WebkitTapHighlightColor: 'transparent',
|
|
@@ -336,7 +339,7 @@ function SpecialTable({ columns, rows, height, containerStyle, loading, LoadingC
|
|
|
336
339
|
padding: '8px 16px',
|
|
337
340
|
userSelect: 'none',
|
|
338
341
|
}, children: column.format
|
|
339
|
-
?
|
|
342
|
+
? valueFormatter({
|
|
340
343
|
value: row[column.field],
|
|
341
344
|
field: column.field,
|
|
342
345
|
fields: columns,
|
|
@@ -347,7 +350,7 @@ function SpecialTable({ columns, rows, height, containerStyle, loading, LoadingC
|
|
|
347
350
|
: JSON.stringify(row[column.field])
|
|
348
351
|
: row[column.field].length > 55
|
|
349
352
|
? row[column.field].substring(0, 52) + '...'
|
|
350
|
-
: row[column.field] }) }) }, 'sqlcell' + columnIndex))) }, 'sqlrow' + rowIndex))) }), activeRows.length === 0 && ((
|
|
353
|
+
: row[column.field] }) }) }, 'sqlcell' + columnIndex))) }, 'sqlrow' + rowIndex))) }), activeRows.length === 0 && (_jsx("div", { style: {
|
|
351
354
|
paddingTop: '60px',
|
|
352
355
|
display: 'flex',
|
|
353
356
|
flex: '1 0 auto',
|
|
@@ -355,8 +358,8 @@ function SpecialTable({ columns, rows, height, containerStyle, loading, LoadingC
|
|
|
355
358
|
justifyContent: 'center',
|
|
356
359
|
alignItems: 'center',
|
|
357
360
|
fontSize: 13,
|
|
358
|
-
color: theme
|
|
359
|
-
}, children: "No results found for specified time period." }))] }) }), (
|
|
361
|
+
color: theme?.secondaryTextColor || 'rgb(55, 65, 81)',
|
|
362
|
+
}, children: "No results found for specified time period." }))] }) }), _jsx("div", { style: { position: 'relative' }, children: _jsx("div", { style: {
|
|
360
363
|
display: 'flex',
|
|
361
364
|
flex: '1 0 auto',
|
|
362
365
|
minWidth: '100px',
|
|
@@ -374,44 +377,43 @@ function SpecialTable({ columns, rows, height, containerStyle, loading, LoadingC
|
|
|
374
377
|
borderBottomRightRadius: 6,
|
|
375
378
|
borderBottomLeftRadius: 6,
|
|
376
379
|
width: '100%',
|
|
377
|
-
}, children: (
|
|
380
|
+
}, children: _jsxs("div", { style: {
|
|
378
381
|
display: 'flex',
|
|
379
382
|
flexDirection: 'row',
|
|
380
383
|
alignItems: 'center',
|
|
381
384
|
justifyContent: 'space-between',
|
|
382
385
|
width: '100%',
|
|
383
|
-
}, children: [(
|
|
386
|
+
}, children: [_jsx("button", { onClick: showDownloadCsvButton ? downloadCSV : undefined, style: {
|
|
384
387
|
fontSize: 14,
|
|
385
388
|
paddingLeft: 12,
|
|
386
|
-
fontFamily: theme
|
|
387
|
-
color: theme
|
|
389
|
+
fontFamily: theme?.fontFamily,
|
|
390
|
+
color: theme?.primaryTextColor,
|
|
388
391
|
background: 'transparent',
|
|
389
392
|
fontWeight: 500,
|
|
390
393
|
cursor: 'pointer',
|
|
391
394
|
border: 'none',
|
|
392
|
-
}, children: showDownloadCsvButton ? 'Download CSV' : '' }), (
|
|
395
|
+
}, children: showDownloadCsvButton ? 'Download CSV' : '' }), _jsxs("div", { style: {
|
|
393
396
|
display: 'flex',
|
|
394
397
|
flexDirection: 'row',
|
|
395
398
|
alignItems: 'center',
|
|
396
|
-
}, children: [(
|
|
399
|
+
}, children: [_jsxs("div", { style: {
|
|
397
400
|
fontSize: 12,
|
|
398
|
-
fontFamily: theme
|
|
399
|
-
color: theme
|
|
400
|
-
}, children: [page, ' of ', maxPage] }), (
|
|
401
|
+
fontFamily: theme?.fontFamily,
|
|
402
|
+
color: theme?.primaryTextColor,
|
|
403
|
+
}, children: [page, ' of ', maxPage] }), _jsx("div", { style: { width: 8 } }), _jsx("button", { onClick: decreasePage, style: {
|
|
401
404
|
cursor: 'pointer',
|
|
402
405
|
border: 'none',
|
|
403
406
|
background: 'transparent',
|
|
404
|
-
}, children: (
|
|
407
|
+
}, children: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 20 20", fill: theme?.chartLabelFontFamily || theme?.fontFamily, height: "16px", width: "16px", children: _jsx("path", { fillRule: "evenodd", d: "M12.79 5.23a.75.75 0 01-.02 1.06L8.832 10l3.938 3.71a.75.75 0 11-1.04 1.08l-4.5-4.25a.75.75 0 010-1.08l4.5-4.25a.75.75 0 011.06.02z", clipRule: "evenodd" }) }) }), _jsx("button", { onClick: increasePage, style: {
|
|
405
408
|
cursor: 'pointer',
|
|
406
409
|
border: 'none',
|
|
407
410
|
background: 'transparent',
|
|
408
|
-
}, children: (
|
|
411
|
+
}, children: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 20 20", fill: theme?.chartLabelFontFamily || theme?.fontFamily, height: "16px", width: "16px", children: _jsx("path", { fillRule: "evenodd", d: "M7.21 14.77a.75.75 0 01.02-1.06L11.168 10 7.23 6.29a.75.75 0 111.04-1.08l4.5 4.25a.75.75 0 010 1.08l-4.5 4.25a.75.75 0 01-1.06-.02z", clipRule: "evenodd" }) }) }), _jsx("div", { style: { width: 12 } })] })] }) }) })] }));
|
|
409
412
|
}
|
|
410
|
-
exports.SpecialTable = SpecialTable;
|
|
411
413
|
const ChartUpdater = ({ chartId, containerStyle, dashboard, dispatch, client, dashboardFilters, theme, downloadCSV, csvFilename, showDownloadCsvButton = true, LoadingComponent, }) => {
|
|
412
|
-
const [chartConfig, setChartConfig] =
|
|
413
|
-
const [loading, setLoading] =
|
|
414
|
-
|
|
414
|
+
const [chartConfig, setChartConfig] = useState(null);
|
|
415
|
+
const [loading, setLoading] = useState(true);
|
|
416
|
+
useEffect(() => {
|
|
415
417
|
let isSubscribed = true;
|
|
416
418
|
async function getChartOptions() {
|
|
417
419
|
if (isSubscribed) {
|
|
@@ -437,7 +439,7 @@ const ChartUpdater = ({ chartId, containerStyle, dashboard, dispatch, client, da
|
|
|
437
439
|
id: chartId,
|
|
438
440
|
filters: [...Object.values(dashboardFilters)],
|
|
439
441
|
};
|
|
440
|
-
const resp = await
|
|
442
|
+
const resp = await getData(client, 'itempost', 'omit', hostedBody, cloudBody);
|
|
441
443
|
if (resp) {
|
|
442
444
|
setLoading(false);
|
|
443
445
|
dispatch({
|
|
@@ -480,7 +482,7 @@ const ChartUpdater = ({ chartId, containerStyle, dashboard, dispatch, client, da
|
|
|
480
482
|
// : null;
|
|
481
483
|
// }, [dashboard, chartId, dateFilter]);
|
|
482
484
|
if (!dashboard[chartId] || loading) {
|
|
483
|
-
return ((
|
|
485
|
+
return (_jsx("div", {
|
|
484
486
|
// className="flex flex-col flex-1 h-[100%]"
|
|
485
487
|
style: {
|
|
486
488
|
...containerStyle,
|
|
@@ -491,36 +493,36 @@ const ChartUpdater = ({ chartId, containerStyle, dashboard, dispatch, client, da
|
|
|
491
493
|
display: 'flex',
|
|
492
494
|
flexDirection: 'column',
|
|
493
495
|
flex: 1,
|
|
494
|
-
}, children: (
|
|
496
|
+
}, children: _jsx("div", { style: {
|
|
495
497
|
height: containerStyle?.height || 300,
|
|
496
498
|
width: '100%',
|
|
497
499
|
boxSizing: 'content-box',
|
|
498
|
-
}, children: (
|
|
500
|
+
}, children: _jsxs("svg", { width: "100%", height: "100%", xmlns: "http://www.w3.org/2000/svg", xmlnsXlink: "http://www.w3.org/1999/xlink", children: [_jsx("rect", { width: "100%", height: "100%", fill: "#F9F9FA" }), _jsx("defs", { fill: "#F9F9FA", children: _jsxs("linearGradient", { id: "skeletonGradient", x1: "0%", y1: "0%", x2: "10%", y2: "0%", gradientUnits: "userSpaceOnUse", children: [_jsx("stop", { offset: "0%", stopColor: "rgba(255,255,255,0)" }), _jsx("stop", { offset: "50%", stopColor: "#FEFEFE" }), _jsx("stop", { offset: "100%", stopColor: "rgba(255,255,255,0)" }), _jsx("animate", { attributeName: "x1", from: "-100%", to: "100%", dur: "2s", repeatCount: "indefinite" }), _jsx("animate", { attributeName: "x2", from: "-50%", to: "150%", dur: "2s", repeatCount: "indefinite" })] }) }), _jsx("rect", { width: "50%", height: "100%", fill: "url(#skeletonGradient)", children: _jsx("animate", { attributeName: "x", from: "-100%", to: "100%", dur: "2s", repeatCount: "indefinite" }) })] }) }) }));
|
|
499
501
|
}
|
|
500
|
-
return ((
|
|
502
|
+
return (_jsx(SpecialTable, { showDownloadCsvButton: showDownloadCsvButton, csvFilename: csvFilename || dashboard[chartId].name, columns: dashboard[chartId].columns, rows: dashboard[chartId].rows, height: containerStyle?.height || '100%', theme: theme, containerStyle: containerStyle, LoadingComponent: LoadingComponent }));
|
|
501
503
|
};
|
|
502
504
|
function Columns({ columns, data, theme, handleDownloadCSV, numToShow }) {
|
|
503
|
-
return ((
|
|
505
|
+
return (_jsxs("div", { style: { display: 'flex', flexDirection: 'column', height: '100%' }, children: [_jsx("div", { style: {
|
|
504
506
|
display: 'flex',
|
|
505
507
|
flexDirection: 'row',
|
|
506
508
|
// overflowX: 'scroll',
|
|
507
509
|
// overflowY: 'hidden',
|
|
508
510
|
overflow: 'scroll',
|
|
509
511
|
height: '100%',
|
|
510
|
-
}, children: columns.map((elem) => ((
|
|
512
|
+
}, children: columns.map((elem) => (_jsx(Column, { column: elem, data: data, theme: theme }, elem.field))) }), _jsxs("div", { style: {
|
|
511
513
|
display: 'flex',
|
|
512
514
|
flexDirection: 'row',
|
|
513
515
|
alignItems: 'center',
|
|
514
516
|
justifyContent: 'space-between',
|
|
515
517
|
// background: 'black',
|
|
516
|
-
}, children: [data.length > numToShow && ((
|
|
518
|
+
}, children: [data.length > numToShow && (_jsxs("div", { style: {
|
|
517
519
|
color: theme?.chartLabelColor,
|
|
518
520
|
boxSizing: 'content-box',
|
|
519
521
|
fontFamily: theme?.chartLabelFontFamily || theme?.fontFamily,
|
|
520
522
|
fontSize: theme?.fontSizeSmall || '0.875rem',
|
|
521
523
|
marginLeft: 12,
|
|
522
524
|
marginTop: 8,
|
|
523
|
-
}, children: ["...", data.length - numToShow, " more"] })), (
|
|
525
|
+
}, children: ["...", data.length - numToShow, " more"] })), _jsx("div", { onClick: handleDownloadCSV, style: {
|
|
524
526
|
height: 40,
|
|
525
527
|
minHeight: 40,
|
|
526
528
|
color: theme?.primaryTextColor,
|
|
@@ -534,14 +536,14 @@ function Columns({ columns, data, theme, handleDownloadCSV, numToShow }) {
|
|
|
534
536
|
}, children: "Download CSV" })] })] }));
|
|
535
537
|
}
|
|
536
538
|
function Column({ column, data, theme }) {
|
|
537
|
-
return ((
|
|
539
|
+
return (_jsxs("div", { style: {
|
|
538
540
|
paddingLeft: 20,
|
|
539
541
|
paddingRight: 20,
|
|
540
542
|
// width: 'max-content',
|
|
541
543
|
display: 'inline-flex',
|
|
542
544
|
flexDirection: 'column',
|
|
543
545
|
whiteSpace: 'nowrap',
|
|
544
|
-
}, children: [(
|
|
546
|
+
}, children: [_jsx("div", { style: {
|
|
545
547
|
height: 40,
|
|
546
548
|
minHeight: 40,
|
|
547
549
|
color: theme?.primaryTextColor,
|
|
@@ -549,10 +551,10 @@ function Column({ column, data, theme }) {
|
|
|
549
551
|
fontFamily: theme?.chartLabelFontFamily || theme?.fontFamily,
|
|
550
552
|
fontSize: theme?.fontSizeSmall || '0.875rem',
|
|
551
553
|
fontWeight: theme?.fontWeightMedium || '500',
|
|
552
|
-
}, children: column.label || column.field }), data.map((elem) => ((
|
|
554
|
+
}, children: column.label || column.field }), data.map((elem) => (_jsx(Cell, { item: elem[column.field], theme: theme })))] }));
|
|
553
555
|
}
|
|
554
556
|
function Cell({ item, theme }) {
|
|
555
|
-
return ((
|
|
557
|
+
return (_jsx("div", { style: {
|
|
556
558
|
height: 40,
|
|
557
559
|
minHeight: 40,
|
|
558
560
|
whiteSpace: 'nowrap',
|
|
@@ -562,4 +564,4 @@ function Cell({ item, theme }) {
|
|
|
562
564
|
color: theme?.chartLabelColor,
|
|
563
565
|
}, children: item }));
|
|
564
566
|
}
|
|
565
|
-
|
|
567
|
+
export default Table;
|
package/dist/TableChart.js
CHANGED
|
@@ -1,34 +1,8 @@
|
|
|
1
|
-
|
|
2
|
-
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
-
if (k2 === undefined) k2 = k;
|
|
4
|
-
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
-
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
-
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
-
}
|
|
8
|
-
Object.defineProperty(o, k2, desc);
|
|
9
|
-
}) : (function(o, m, k, k2) {
|
|
10
|
-
if (k2 === undefined) k2 = k;
|
|
11
|
-
o[k2] = m[k];
|
|
12
|
-
}));
|
|
13
|
-
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
-
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
-
}) : function(o, v) {
|
|
16
|
-
o["default"] = v;
|
|
17
|
-
});
|
|
18
|
-
var __importStar = (this && this.__importStar) || function (mod) {
|
|
19
|
-
if (mod && mod.__esModule) return mod;
|
|
20
|
-
var result = {};
|
|
21
|
-
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
22
|
-
__setModuleDefault(result, mod);
|
|
23
|
-
return result;
|
|
24
|
-
};
|
|
25
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
26
|
-
exports.hexToRgbaWith10PercentAlpha = void 0;
|
|
27
|
-
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
28
2
|
/* eslint-disable react/display-name */
|
|
29
3
|
// @ts-nocheck
|
|
30
|
-
|
|
31
|
-
|
|
4
|
+
import React, { useMemo } from 'react';
|
|
5
|
+
import { valueFormatter } from './Chart';
|
|
32
6
|
const getWidthsFromValues = (dataValues) => {
|
|
33
7
|
let maxValue = -Infinity;
|
|
34
8
|
dataValues.forEach((value) => {
|
|
@@ -40,7 +14,7 @@ const getWidthsFromValues = (dataValues) => {
|
|
|
40
14
|
return Math.max((value / maxValue) * 100, 1);
|
|
41
15
|
});
|
|
42
16
|
};
|
|
43
|
-
function hexToRgbaWith10PercentAlpha(hex) {
|
|
17
|
+
export function hexToRgbaWith10PercentAlpha(hex) {
|
|
44
18
|
// Convert the hex color to RGB
|
|
45
19
|
const r = parseInt(hex.slice(1, 3), 16);
|
|
46
20
|
const g = parseInt(hex.slice(3, 5), 16);
|
|
@@ -50,26 +24,25 @@ function hexToRgbaWith10PercentAlpha(hex) {
|
|
|
50
24
|
// Return the color as an rgba string
|
|
51
25
|
return `rgba(${r}, ${g}, ${b}, ${alpha})`;
|
|
52
26
|
}
|
|
53
|
-
exports.hexToRgbaWith10PercentAlpha = hexToRgbaWith10PercentAlpha;
|
|
54
27
|
function Columns({ columns, data, theme }) {
|
|
55
|
-
return ((
|
|
28
|
+
return (_jsx("div", { style: {
|
|
56
29
|
display: 'flex',
|
|
57
30
|
flexDirection: 'row',
|
|
58
31
|
// overflowX: 'scroll',
|
|
59
32
|
// overflowY: 'hidden',
|
|
60
33
|
overflow: 'scroll',
|
|
61
34
|
height: '100%',
|
|
62
|
-
}, children: columns.map((elem) => ((
|
|
35
|
+
}, children: columns.map((elem) => (_jsx(Column, { column: elem, data: data, theme: theme }, elem.field))) }));
|
|
63
36
|
}
|
|
64
37
|
function Column({ column, data, theme }) {
|
|
65
|
-
return ((
|
|
38
|
+
return (_jsxs("div", { style: {
|
|
66
39
|
paddingLeft: 20,
|
|
67
40
|
paddingRight: 20,
|
|
68
41
|
// width: 'max-content',
|
|
69
42
|
display: 'inline-flex',
|
|
70
43
|
flexDirection: 'column',
|
|
71
44
|
whiteSpace: 'nowrap',
|
|
72
|
-
}, children: [(
|
|
45
|
+
}, children: [_jsx("div", { style: {
|
|
73
46
|
height: 40,
|
|
74
47
|
minHeight: 40,
|
|
75
48
|
color: theme?.primaryTextColor,
|
|
@@ -77,10 +50,10 @@ function Column({ column, data, theme }) {
|
|
|
77
50
|
fontFamily: theme?.chartLabelFontFamily || theme?.fontFamily,
|
|
78
51
|
fontSize: theme?.fontSizeSmall || '0.875rem',
|
|
79
52
|
fontWeight: theme?.fontWeightMedium || '500',
|
|
80
|
-
}, children: column.label }), data.map((elem) => ((
|
|
53
|
+
}, children: column.label }), data.map((elem) => (_jsx(Cell, { item: elem[column.field], theme: theme })))] }));
|
|
81
54
|
}
|
|
82
55
|
function Cell({ item, theme }) {
|
|
83
|
-
return ((
|
|
56
|
+
return (_jsx("div", { style: {
|
|
84
57
|
height: 40,
|
|
85
58
|
minHeight: 40,
|
|
86
59
|
whiteSpace: 'nowrap',
|
|
@@ -90,18 +63,18 @@ function Cell({ item, theme }) {
|
|
|
90
63
|
color: theme?.chartLabelColor,
|
|
91
64
|
}, children: item }));
|
|
92
65
|
}
|
|
93
|
-
const TableChart =
|
|
66
|
+
const TableChart = React.forwardRef((props, ref) => {
|
|
94
67
|
const { data = [], yAxisFields, containerStyle, theme, ...other } = props;
|
|
95
68
|
// const widths = getWidthsFromValues(
|
|
96
69
|
// data.map(item => item[yAxisFields[0].field])
|
|
97
70
|
// );
|
|
98
71
|
const NUM_TO_SHOW = Math.floor(containerStyle?.height / 40) - 1 || 6;
|
|
99
|
-
const memoizedData =
|
|
72
|
+
const memoizedData = useMemo(() => {
|
|
100
73
|
return data.slice(0, NUM_TO_SHOW).map((item) => {
|
|
101
74
|
const fieldsWithFormattedValues = {};
|
|
102
75
|
for (const field of yAxisFields) {
|
|
103
76
|
const value = item[field.field];
|
|
104
|
-
fieldsWithFormattedValues[field.field] =
|
|
77
|
+
fieldsWithFormattedValues[field.field] = valueFormatter({
|
|
105
78
|
value,
|
|
106
79
|
field: field.field,
|
|
107
80
|
fields: yAxisFields,
|
|
@@ -111,7 +84,7 @@ const TableChart = react_1.default.forwardRef((props, ref) => {
|
|
|
111
84
|
});
|
|
112
85
|
}, [data, NUM_TO_SHOW]);
|
|
113
86
|
if (!memoizedData.length) {
|
|
114
|
-
return ((
|
|
87
|
+
return (_jsx("div", { ref: ref, style: {
|
|
115
88
|
// width: '100%',
|
|
116
89
|
boxSizing: 'content-box',
|
|
117
90
|
height: '100%',
|
|
@@ -126,7 +99,7 @@ const TableChart = react_1.default.forwardRef((props, ref) => {
|
|
|
126
99
|
justifyContent: 'space-between',
|
|
127
100
|
}, ...other }));
|
|
128
101
|
}
|
|
129
|
-
return ((
|
|
102
|
+
return (_jsxs("div", { style: {
|
|
130
103
|
boxSizing: 'content-box',
|
|
131
104
|
height: containerStyle?.height || '100%',
|
|
132
105
|
marginTop: 20,
|
|
@@ -135,7 +108,7 @@ const TableChart = react_1.default.forwardRef((props, ref) => {
|
|
|
135
108
|
marginLeft: '1rem',
|
|
136
109
|
flexDirection: 'column',
|
|
137
110
|
// justifyContent: 'space-between',
|
|
138
|
-
}, children: [(
|
|
111
|
+
}, children: [_jsx(Columns, { columns: yAxisFields, data: memoizedData, theme: theme }), data.length > NUM_TO_SHOW && (_jsxs("div", { style: {
|
|
139
112
|
color: theme?.chartLabelColor,
|
|
140
113
|
boxSizing: 'content-box',
|
|
141
114
|
fontFamily: theme?.chartLabelFontFamily || theme?.fontFamily,
|
|
@@ -314,4 +287,4 @@ const TableChart = react_1.default.forwardRef((props, ref) => {
|
|
|
314
287
|
// </div>
|
|
315
288
|
// );
|
|
316
289
|
});
|
|
317
|
-
|
|
290
|
+
export default TableChart;
|
|
@@ -1,5 +1,3 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
const ArrowDownHeadIcon = ({ ...props }) => ((0, jsx_runtime_1.jsxs)("svg", { ...props, xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", width: "24", height: "24", children: [(0, jsx_runtime_1.jsx)("path", { fill: "none", d: "M0 0h24v24H0z" }), (0, jsx_runtime_1.jsx)("path", { fill: "currentColor", d: "M12 13.172l4.95-4.95 1.414 1.414L12 16 5.636 9.636 7.05 8.222z" })] }));
|
|
5
|
-
exports.default = ArrowDownHeadIcon;
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
const ArrowDownHeadIcon = ({ ...props }) => (_jsxs("svg", { ...props, xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", width: "24", height: "24", children: [_jsx("path", { fill: "none", d: "M0 0h24v24H0z" }), _jsx("path", { fill: "currentColor", d: "M12 13.172l4.95-4.95 1.414 1.414L12 16 5.636 9.636 7.05 8.222z" })] }));
|
|
3
|
+
export default ArrowDownHeadIcon;
|
|
@@ -1,5 +1,3 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
const ArrowDownIcon = ({ ...props }) => ((0, jsx_runtime_1.jsxs)("svg", { ...props, xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", width: "24", height: "24", children: [(0, jsx_runtime_1.jsx)("path", { fill: "none", d: "M0 0h24v24H0z" }), (0, jsx_runtime_1.jsx)("path", { fill: "currentColor", d: "M13 16.172l5.364-5.364 1.414 1.414L12 20l-7.778-7.778 1.414-1.414L11 16.172V4h2v12.172z" })] }));
|
|
5
|
-
exports.default = ArrowDownIcon;
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
const ArrowDownIcon = ({ ...props }) => (_jsxs("svg", { ...props, xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", width: "24", height: "24", children: [_jsx("path", { fill: "none", d: "M0 0h24v24H0z" }), _jsx("path", { fill: "currentColor", d: "M13 16.172l5.364-5.364 1.414 1.414L12 20l-7.778-7.778 1.414-1.414L11 16.172V4h2v12.172z" })] }));
|
|
3
|
+
export default ArrowDownIcon;
|
|
@@ -1,5 +1,3 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
const ArrowDownRightIcon = ({ ...props }) => ((0, jsx_runtime_1.jsxs)("svg", { ...props, xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", width: "24", height: "24", children: [(0, jsx_runtime_1.jsx)("path", { fill: "none", d: "M0 0h24v24H0z" }), (0, jsx_runtime_1.jsx)("path", { fill: "currentColor", d: "M14.59 16.004L5.982 7.397l1.414-1.414 8.607 8.606V7.004h2v11h-11v-2z" })] }));
|
|
5
|
-
exports.default = ArrowDownRightIcon;
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
const ArrowDownRightIcon = ({ ...props }) => (_jsxs("svg", { ...props, xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", width: "24", height: "24", children: [_jsx("path", { fill: "none", d: "M0 0h24v24H0z" }), _jsx("path", { fill: "currentColor", d: "M14.59 16.004L5.982 7.397l1.414-1.414 8.607 8.606V7.004h2v11h-11v-2z" })] }));
|
|
3
|
+
export default ArrowDownRightIcon;
|
|
@@ -1,5 +1,3 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
const ArrowLeftHeadIcon = ({ ...props }) => ((0, jsx_runtime_1.jsxs)("svg", { ...props, xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", children: [(0, jsx_runtime_1.jsx)("path", { fill: "none", d: "M0 0h24v24H0z" }), (0, jsx_runtime_1.jsx)("path", { d: "M10.828 12l4.95 4.95-1.414 1.414L8 12l6.364-6.364 1.414 1.414z" })] }));
|
|
5
|
-
exports.default = ArrowLeftHeadIcon;
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
const ArrowLeftHeadIcon = ({ ...props }) => (_jsxs("svg", { ...props, xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", children: [_jsx("path", { fill: "none", d: "M0 0h24v24H0z" }), _jsx("path", { d: "M10.828 12l4.95 4.95-1.414 1.414L8 12l6.364-6.364 1.414 1.414z" })] }));
|
|
3
|
+
export default ArrowLeftHeadIcon;
|
|
@@ -1,5 +1,3 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
const ArrowRightHeadIcon = ({ ...props }) => ((0, jsx_runtime_1.jsxs)("svg", { ...props, xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", children: [(0, jsx_runtime_1.jsx)("path", { fill: "none", d: "M0 0h24v24H0z" }), (0, jsx_runtime_1.jsx)("path", { d: "M13.172 12l-4.95-4.95 1.414-1.414L16 12l-6.364 6.364-1.414-1.414z" })] }));
|
|
5
|
-
exports.default = ArrowRightHeadIcon;
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
const ArrowRightHeadIcon = ({ ...props }) => (_jsxs("svg", { ...props, xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", children: [_jsx("path", { fill: "none", d: "M0 0h24v24H0z" }), _jsx("path", { d: "M13.172 12l-4.95-4.95 1.414-1.414L16 12l-6.364 6.364-1.414-1.414z" })] }));
|
|
3
|
+
export default ArrowRightHeadIcon;
|
|
@@ -1,5 +1,3 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
const ArrowRightIcon = ({ ...props }) => ((0, jsx_runtime_1.jsxs)("svg", { ...props, xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", width: "24", height: "24", children: [(0, jsx_runtime_1.jsx)("path", { fill: "none", d: "M0 0h24v24H0z" }), (0, jsx_runtime_1.jsx)("path", { fill: "currentColor", d: "M16.172 11l-5.364-5.364 1.414-1.414L20 12l-7.778 7.778-1.414-1.414L16.172 13H4v-2z" })] }));
|
|
5
|
-
exports.default = ArrowRightIcon;
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
const ArrowRightIcon = ({ ...props }) => (_jsxs("svg", { ...props, xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", width: "24", height: "24", children: [_jsx("path", { fill: "none", d: "M0 0h24v24H0z" }), _jsx("path", { fill: "currentColor", d: "M16.172 11l-5.364-5.364 1.414-1.414L20 12l-7.778 7.778-1.414-1.414L16.172 13H4v-2z" })] }));
|
|
3
|
+
export default ArrowRightIcon;
|
|
@@ -1,5 +1,3 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
const ArrowUpHeadIcon = ({ ...props }) => ((0, jsx_runtime_1.jsxs)("svg", { ...props, xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", width: "24", height: "24", children: [(0, jsx_runtime_1.jsx)("path", { fill: "none", d: "M0 0h24v24H0z" }), (0, jsx_runtime_1.jsx)("path", { fill: "currentColor", d: "M12 10.828l-4.95 4.95-1.414-1.414L12 8l6.364 6.364-1.414 1.414z" })] }));
|
|
5
|
-
exports.default = ArrowUpHeadIcon;
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
const ArrowUpHeadIcon = ({ ...props }) => (_jsxs("svg", { ...props, xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", width: "24", height: "24", children: [_jsx("path", { fill: "none", d: "M0 0h24v24H0z" }), _jsx("path", { fill: "currentColor", d: "M12 10.828l-4.95 4.95-1.414-1.414L12 8l6.364 6.364-1.414 1.414z" })] }));
|
|
3
|
+
export default ArrowUpHeadIcon;
|