@quillsql/react 2.10.36 → 2.10.38

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 (116) hide show
  1. package/dist/cjs/BarList.d.ts +1 -1
  2. package/dist/cjs/BarList.d.ts.map +1 -1
  3. package/dist/cjs/Chart.d.ts +2 -1
  4. package/dist/cjs/Chart.d.ts.map +1 -1
  5. package/dist/cjs/Chart.js +70 -73
  6. package/dist/cjs/ChartBuilder.d.ts +8 -4
  7. package/dist/cjs/ChartBuilder.d.ts.map +1 -1
  8. package/dist/cjs/ChartBuilder.js +206 -126
  9. package/dist/cjs/ChartEditor.js +1 -1
  10. package/dist/cjs/Dashboard.d.ts.map +1 -1
  11. package/dist/cjs/Dashboard.js +9 -1
  12. package/dist/cjs/PieChart.d.ts +1 -0
  13. package/dist/cjs/PieChart.d.ts.map +1 -1
  14. package/dist/cjs/PieChart.js +2 -2
  15. package/dist/cjs/QuillProvider.d.ts +1 -0
  16. package/dist/cjs/QuillProvider.d.ts.map +1 -1
  17. package/dist/cjs/Table.d.ts.map +1 -1
  18. package/dist/cjs/Table.js +0 -4
  19. package/dist/cjs/components/Chart/BarChart.d.ts +1 -1
  20. package/dist/cjs/components/Chart/BarChart.d.ts.map +1 -1
  21. package/dist/cjs/components/Chart/LineChart.d.ts +2 -1
  22. package/dist/cjs/components/Chart/LineChart.d.ts.map +1 -1
  23. package/dist/cjs/components/Dashboard/DataLoader.d.ts +1 -1
  24. package/dist/cjs/components/Dashboard/DataLoader.d.ts.map +1 -1
  25. package/dist/cjs/components/Dashboard/DataLoader.js +2 -7
  26. package/dist/cjs/components/Dashboard/TableComponent.d.ts +1 -1
  27. package/dist/cjs/components/Dashboard/TableComponent.d.ts.map +1 -1
  28. package/dist/cjs/components/Dashboard/TableComponent.js +5 -21
  29. package/dist/cjs/components/QuillTable.d.ts.map +1 -1
  30. package/dist/cjs/components/QuillTable.js +5 -2
  31. package/dist/cjs/components/UiComponents.d.ts +6 -18
  32. package/dist/cjs/components/UiComponents.d.ts.map +1 -1
  33. package/dist/cjs/components/UiComponents.js +21 -3
  34. package/dist/cjs/hooks/useQuill.d.ts +1 -1
  35. package/dist/cjs/hooks/useQuill.d.ts.map +1 -1
  36. package/dist/cjs/index.d.ts +3 -2
  37. package/dist/cjs/index.d.ts.map +1 -1
  38. package/dist/cjs/internals/ReportBuilder/PivotList.d.ts +1 -1
  39. package/dist/cjs/internals/ReportBuilder/PivotList.d.ts.map +1 -1
  40. package/dist/cjs/internals/ReportBuilder/PivotList.js +9 -3
  41. package/dist/cjs/internals/ReportBuilder/PivotModal.d.ts +1 -1
  42. package/dist/cjs/internals/ReportBuilder/PivotModal.d.ts.map +1 -1
  43. package/dist/cjs/internals/ReportBuilder/PivotModal.js +31 -28
  44. package/dist/cjs/models/Pivots.d.ts +2 -0
  45. package/dist/cjs/models/Pivots.d.ts.map +1 -0
  46. package/dist/cjs/models/Pivots.js +2 -0
  47. package/dist/cjs/models/Tables.d.ts +16 -0
  48. package/dist/cjs/models/Tables.d.ts.map +1 -0
  49. package/dist/cjs/models/Tables.js +2 -0
  50. package/dist/cjs/utils/aggregate.d.ts.map +1 -1
  51. package/dist/cjs/utils/aggregate.js +26 -23
  52. package/dist/cjs/utils/textProcessing.d.ts +5 -0
  53. package/dist/cjs/utils/textProcessing.d.ts.map +1 -0
  54. package/dist/cjs/utils/textProcessing.js +37 -0
  55. package/dist/cjs/utils/types.d.ts +4 -0
  56. package/dist/cjs/utils/types.d.ts.map +1 -0
  57. package/dist/cjs/utils/types.js +52 -0
  58. package/dist/esm/BarList.d.ts +1 -1
  59. package/dist/esm/BarList.d.ts.map +1 -1
  60. package/dist/esm/Chart.d.ts +2 -1
  61. package/dist/esm/Chart.d.ts.map +1 -1
  62. package/dist/esm/Chart.js +70 -73
  63. package/dist/esm/ChartBuilder.d.ts +8 -4
  64. package/dist/esm/ChartBuilder.d.ts.map +1 -1
  65. package/dist/esm/ChartBuilder.js +206 -125
  66. package/dist/esm/ChartEditor.js +1 -1
  67. package/dist/esm/Dashboard.d.ts.map +1 -1
  68. package/dist/esm/Dashboard.js +9 -1
  69. package/dist/esm/PieChart.d.ts +1 -0
  70. package/dist/esm/PieChart.d.ts.map +1 -1
  71. package/dist/esm/PieChart.js +2 -2
  72. package/dist/esm/QuillProvider.d.ts +1 -0
  73. package/dist/esm/QuillProvider.d.ts.map +1 -1
  74. package/dist/esm/Table.d.ts.map +1 -1
  75. package/dist/esm/Table.js +1 -5
  76. package/dist/esm/components/Chart/BarChart.d.ts +1 -1
  77. package/dist/esm/components/Chart/BarChart.d.ts.map +1 -1
  78. package/dist/esm/components/Chart/LineChart.d.ts +2 -1
  79. package/dist/esm/components/Chart/LineChart.d.ts.map +1 -1
  80. package/dist/esm/components/Dashboard/DataLoader.d.ts +1 -1
  81. package/dist/esm/components/Dashboard/DataLoader.d.ts.map +1 -1
  82. package/dist/esm/components/Dashboard/DataLoader.js +4 -9
  83. package/dist/esm/components/Dashboard/TableComponent.d.ts +1 -1
  84. package/dist/esm/components/Dashboard/TableComponent.d.ts.map +1 -1
  85. package/dist/esm/components/Dashboard/TableComponent.js +5 -18
  86. package/dist/esm/components/QuillTable.d.ts.map +1 -1
  87. package/dist/esm/components/QuillTable.js +2 -2
  88. package/dist/esm/components/UiComponents.d.ts +6 -18
  89. package/dist/esm/components/UiComponents.d.ts.map +1 -1
  90. package/dist/esm/components/UiComponents.js +19 -2
  91. package/dist/esm/hooks/useQuill.d.ts +1 -1
  92. package/dist/esm/hooks/useQuill.d.ts.map +1 -1
  93. package/dist/esm/index.d.ts +3 -2
  94. package/dist/esm/index.d.ts.map +1 -1
  95. package/dist/esm/index.js +1 -1
  96. package/dist/esm/internals/ReportBuilder/PivotList.d.ts +1 -1
  97. package/dist/esm/internals/ReportBuilder/PivotList.d.ts.map +1 -1
  98. package/dist/esm/internals/ReportBuilder/PivotList.js +9 -3
  99. package/dist/esm/internals/ReportBuilder/PivotModal.d.ts +1 -1
  100. package/dist/esm/internals/ReportBuilder/PivotModal.d.ts.map +1 -1
  101. package/dist/esm/internals/ReportBuilder/PivotModal.js +28 -25
  102. package/dist/esm/models/Pivots.d.ts +2 -0
  103. package/dist/esm/models/Pivots.d.ts.map +1 -0
  104. package/dist/esm/models/Pivots.js +1 -0
  105. package/dist/esm/models/Tables.d.ts +16 -0
  106. package/dist/esm/models/Tables.d.ts.map +1 -0
  107. package/dist/esm/models/Tables.js +1 -0
  108. package/dist/esm/utils/aggregate.d.ts.map +1 -1
  109. package/dist/esm/utils/aggregate.js +26 -23
  110. package/dist/esm/utils/textProcessing.d.ts +5 -0
  111. package/dist/esm/utils/textProcessing.d.ts.map +1 -0
  112. package/dist/esm/utils/textProcessing.js +30 -0
  113. package/dist/esm/utils/types.d.ts +4 -0
  114. package/dist/esm/utils/types.d.ts.map +1 -0
  115. package/dist/esm/utils/types.js +48 -0
  116. package/package.json +1 -1
package/dist/esm/Chart.js CHANGED
@@ -1,5 +1,4 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- // @ts-nocheck
3
2
  import { useState, useEffect, useContext, useMemo } from 'react';
4
3
  import { differenceInHours } from 'date-fns';
5
4
  import BarList from './BarList';
@@ -25,8 +24,8 @@ function sumByKey(arr, key) {
25
24
  return isNaN(val) ? acc : acc + val;
26
25
  }, 0);
27
26
  }
28
- function areDatesNearby(dateStr1, dateStr2) {
29
- return Math.abs(differenceInHours(dateStr1, dateStr2)) < 24;
27
+ function areDatesNearby(date1, date2) {
28
+ return Math.abs(differenceInHours(date1, date2)) < 24;
30
29
  }
31
30
  function isEquivalent(filters1, filters2) {
32
31
  if (Object.keys(filters2).length !== Object.keys(filters1).length) {
@@ -35,6 +34,9 @@ function isEquivalent(filters1, filters2) {
35
34
  const filterKeys = Object.keys(filters2);
36
35
  for (let i = 0; i < filterKeys.length; i++) {
37
36
  const currentKeyWereLookingAt = filterKeys[i];
37
+ if (!currentKeyWereLookingAt) {
38
+ return false;
39
+ }
38
40
  const filter1 = filters1[currentKeyWereLookingAt];
39
41
  if (!filter1) {
40
42
  return false;
@@ -70,25 +72,27 @@ export function didFiltersChange(dashboardItem, filters) {
70
72
  }
71
73
  return !isEquivalent(dashboardItem.filtersApplied, filters);
72
74
  }
73
- const Chart = ({ chartId, config, colors, containerStyle, query, SelectComponent, dateRangeFilterDisabled = false, isAnimationActive = true, hideXAxis = false, hideYAxis = false, hideCartesianGrid = false, }) => {
74
- const { dispatch, dashboard } = useContext(DashboardContext);
75
- const { dashboardFilters } = useContext(DashboardFiltersContext);
76
- // eslint-disable-next-line no-unused-vars
77
- const [client, _] = useContext(ClientContext);
75
+ const Chart = (data) => {
76
+ if ('config' in data) {
77
+ return (_jsx(ChartDisplay, { ...data, loading: false, isComparison: !!data.config.compareRows?.length }));
78
+ }
78
79
  const [theme] = useContext(ThemeContext);
79
80
  const chartColors = useMemo(() => {
80
- return colors?.length
81
- ? colors
81
+ return data.colors?.length
82
+ ? data.colors
82
83
  : theme && theme.chartColors.length
83
84
  ? theme.chartColors
84
85
  : ['#4E80EE', '#E14F62', '#55B5A6', '#E9A23B', '#6466E9', '#55B685'];
85
- }, [colors]);
86
- return (_jsx(ChartUpdater, { config: config, dispatch: dispatch, dashboard: dashboard, chartId: chartId, containerStyle: containerStyle, colors: chartColors, client: client, theme: theme, dashboardFilters: dashboardFilters, query: query, isAnimationActive: isAnimationActive, hideXAxis: hideXAxis, hideYAxis: hideYAxis, hideCartesianGrid: hideCartesianGrid, dateRangeFilterDisabled: dateRangeFilterDisabled }));
86
+ }, [data.colors]);
87
+ return (_jsx(ChartUpdater, { chartId: data.chartId, containerStyle: data.containerStyle, colors: chartColors, theme: theme, isAnimationActive: data.isAnimationActive, hideXAxis: data.hideXAxis, hideYAxis: data.hideYAxis, hideCartesianGrid: data.hideCartesianGrid, dateRangeFilterDisabled: data.dateRangeFilterDisabled }));
87
88
  };
88
- const ChartUpdater = ({ colors, chartId, config, containerStyle, dashboard, dispatch, client, theme, dashboardFilters, isAnimationActive, hideXAxis, hideYAxis, hideCartesianGrid, dateRangeFilterDisabled, }) => {
89
+ const ChartUpdater = ({ colors, chartId, containerStyle, theme, isAnimationActive, hideXAxis, hideYAxis, hideCartesianGrid, dateRangeFilterDisabled, }) => {
90
+ const { dispatch, dashboard } = useContext(DashboardContext);
91
+ const { dashboardFilters } = useContext(DashboardFiltersContext);
89
92
  const [initialLoad, setInitialLoad] = useState(true);
90
93
  const [loading, setLoading] = useState(false);
91
94
  const [isComparison, setIsComparison] = useState(false);
95
+ const [client, _] = useContext(ClientContext);
92
96
  useEffect(() => {
93
97
  async function getChartOptions() {
94
98
  if (!didFiltersChange(dashboard[chartId], dashboardFilters)) {
@@ -148,22 +152,30 @@ const ChartUpdater = ({ colors, chartId, config, containerStyle, dashboard, disp
148
152
  setLoading(false);
149
153
  }
150
154
  }
151
- if (config) {
152
- setLoading(false);
153
- return;
154
- }
155
155
  setInitialLoad(false);
156
156
  getChartOptions();
157
157
  }, [dashboardFilters, client, chartId]);
158
- const dateFilter = Object.values(dashboardFilters ?? {}).find((filter) => filter.filterType == 'date_range');
159
- const isPivot = dashboard[chartId]?.pivot || config?.pivot;
158
+ return (_jsx(ChartDisplay, { config: dashboard[chartId], colors: colors, containerStyle: containerStyle, hideXAxis: hideXAxis, hideYAxis: hideYAxis, hideCartesianGrid: hideCartesianGrid, isAnimationActive: isAnimationActive, isComparison: isComparison, loading: loading || initialLoad }));
159
+ };
160
+ const ChartDisplay = ({ config, colors, containerStyle, hideXAxis, hideYAxis, hideCartesianGrid, isAnimationActive, loading = false, isComparison = false, }) => {
161
+ const { dashboardFilters } = useContext(DashboardFiltersContext);
162
+ const [theme] = useContext(ThemeContext);
163
+ const chartColors = useMemo(() => {
164
+ return colors?.length
165
+ ? colors
166
+ : theme && theme.chartColors.length
167
+ ? theme.chartColors
168
+ : ['#4E80EE', '#E14F62', '#55B5A6', '#E9A23B', '#6466E9', '#55B685'];
169
+ }, [colors]);
170
+ const dateFilter = Object.values(dashboardFilters).find((filter) => filter.filterType == 'date_range');
171
+ const isPivot = config?.pivot;
160
172
  const pivotTable = useMemo(() => {
161
- const pivot = dashboard[chartId]?.pivot || config?.pivot;
162
- const data = dashboard[chartId] ? dashboard[chartId] : config;
173
+ const pivot = config?.pivot;
174
+ const data = config;
163
175
  return pivot && data?.rows
164
176
  ? generatePivotTable(pivot, JSON.parse(JSON.stringify(data.rows)), // deep copy
165
- dateFilter?.startDate
166
- ? [dateFilter?.startDate, dateFilter?.endDate, null]
177
+ dateFilter
178
+ ? [dateFilter.startDate || null, dateFilter.endDate || null, null]
167
179
  : [null, null, null], Boolean(dateFilter?.comparisonRange?.startDate), -1, dateFilter?.comparisonRange?.startDate
168
180
  ? [
169
181
  dateFilter?.comparisonRange.startDate,
@@ -172,21 +184,19 @@ const ChartUpdater = ({ colors, chartId, config, containerStyle, dashboard, disp
172
184
  ]
173
185
  : [null, null, null])
174
186
  : null;
175
- }, [dashboard, chartId, dashboard[chartId], config, dateFilter]);
187
+ }, [config, dateFilter]);
176
188
  const pivotTableYAxis = useMemo(() => {
177
189
  if (!pivotTable) {
178
190
  return null;
179
191
  }
180
- const pivot = dashboard[chartId]?.pivot || config?.pivot;
181
- const yAxisFields = config
182
- ? config.yAxisFields
183
- : dashboard[chartId]?.yAxisFields;
192
+ const pivot = config?.pivot;
193
+ const yAxisFields = config.yAxisFields;
184
194
  return yAxisFields
185
195
  ? generatePivotTableYAxis(pivot, pivotTable.columns, yAxisFields?.[0]?.format)
186
196
  : null;
187
197
  }, [pivotTable]);
188
- if (!config && (!dashboard[chartId] || loading)) {
189
- if (loading || initialLoad) {
198
+ if (!config || loading) {
199
+ if (loading) {
190
200
  return _jsx(ChartSkeleton, { containerStyle: containerStyle });
191
201
  }
192
202
  else {
@@ -194,34 +204,31 @@ const ChartUpdater = ({ colors, chartId, config, containerStyle, dashboard, disp
194
204
  }
195
205
  }
196
206
  // TODO: Figure out if we can use ?? to coalesce these into the variable.
197
- const chartTypes = [config?.chartType, dashboard[chartId]?.chartType];
207
+ const chartTypes = [config?.chartType];
198
208
  if (chartTypes.includes('pie')) {
199
- const rows = pivotTable
200
- ? pivotTable.rows
201
- : config
202
- ? config.rows
203
- : dashboard[chartId].rows;
204
- const yAxisFields = pivotTableYAxis
205
- ? pivotTableYAxis
206
- : config
207
- ? config.yAxisFields
208
- : dashboard[chartId].yAxisFields;
209
- const xAxisField = config
210
- ? config.xAxisField
211
- : dashboard[chartId].xAxisField;
209
+ const rows = pivotTable ? pivotTable.rows : config.rows;
210
+ const yAxisFields = pivotTableYAxis ? pivotTableYAxis : config.yAxisFields;
211
+ const xAxisField = config.xAxisField;
212
212
  return (_jsx(PieChart, { containerStyle: containerStyle, data: rows.map((row) => {
213
213
  return {
214
214
  ...row,
215
215
  count: parseInt(row[yAxisFields[0].field]) /
216
216
  sumByKey(rows, yAxisFields[0].field),
217
217
  };
218
- }), category: yAxisFields[0].field, index: xAxisField, colors: colors, theme: theme }));
218
+ }), category: yAxisFields[0].field, index: xAxisField, colors: chartColors, theme: theme }));
219
219
  }
220
220
  if (chartTypes.includes('table')) {
221
- const data = dashboard[chartId] ? dashboard[chartId] : config;
221
+ const data = config;
222
222
  const columns = pivotTable?.columns ?? data.columns ?? data.yAxisFields;
223
+ const rows = pivotTable?.rows ?? data.rows ?? [];
224
+ // FOR PIVOTS - ADD THE RIGHT FIELD TYPE FOR THE VALUE COLUMNS
225
+ const valueFieldType = config?.pivot?.valueFieldType || undefined;
223
226
  // Walk through data.columns and pick off the labels from yAxisFields
224
- columns.forEach((col) => {
227
+ columns.forEach((col, index) => {
228
+ // ADD THE RIGHT FIELD TYPE FOR THE VALUE COLUMNS
229
+ if (valueFieldType && index !== 0) {
230
+ col.format = valueFieldType;
231
+ }
225
232
  if (!data.yAxisFields)
226
233
  return;
227
234
  const matchingCol = data.yAxisFields.find((c) => c.field === col.field);
@@ -230,7 +237,7 @@ const ChartUpdater = ({ colors, chartId, config, containerStyle, dashboard, disp
230
237
  col.format = matchingCol.format;
231
238
  }
232
239
  });
233
- const rows = data.rows.map((row) => {
240
+ const formattedRows = rows.map((row) => {
234
241
  return columns.reduce((formattedRow, column) => {
235
242
  // Apply the format function to each field in the row
236
243
  const formattedValue = quillFormat({
@@ -241,57 +248,43 @@ const ChartUpdater = ({ colors, chartId, config, containerStyle, dashboard, disp
241
248
  return formattedRow;
242
249
  }, {});
243
250
  });
244
- return (_jsx(QuillTable, { rows: pivotTable?.rows ?? rows ?? [], columns: pivotTable?.columns ?? columns ?? data.yAxisFields, containerStyle: {
251
+ return (_jsx(QuillTable, { rows: formattedRows ?? [], columns: columns ?? data.yAxisFields, containerStyle: {
245
252
  height: '400px',
246
253
  width: containerStyle?.width || '100%',
247
254
  }, showDownloadCSVButton: true, downloadCSV: () => {
248
255
  downloadCSV({
249
256
  rows: pivotTable?.rows ?? data.rows ?? [],
250
- fields: pivotTable?.columns ?? data.columns ?? data.yAxisFields,
257
+ fields: columns ?? data.yAxisFields,
251
258
  name: data.name || '',
252
259
  });
253
260
  } }));
254
261
  }
255
262
  if (chartTypes.includes('bar')) {
256
- return (_jsx(BarList, { data: pivotTable
257
- ? pivotTable.rows
258
- : config
259
- ? config.rows
260
- : dashboard[chartId].rows, theme: theme, yAxisFields: pivotTableYAxis
261
- ? pivotTableYAxis
262
- : config
263
- ? config.yAxisFields
264
- : dashboard[chartId].yAxisFields, colors: colors, xAxisField: config ? config.xAxisField : dashboard[chartId].xAxisField, xAxisFormat: config ? config.xAxisFormat : dashboard[chartId].xAxisFormat, containerStyle: containerStyle }));
263
+ return (_jsx(BarList, { data: pivotTable ? pivotTable.rows : config.rows, theme: theme, yAxisFields: pivotTableYAxis ? pivotTableYAxis : config.yAxisFields, colors: chartColors, xAxisField: config.xAxisField, xAxisFormat: config.xAxisFormat, containerStyle: containerStyle }));
265
264
  }
266
265
  const yAxisFields = pivotTableYAxis
267
266
  ? pivotTableYAxis
268
- : config
269
- ? config.yAxisFields
270
- : dashboard[chartId].yAxisFields;
267
+ : config.yAxisFields;
271
268
  if (isComparison && yAxisFields.length == 1) {
272
269
  const sampleField = yAxisFields[0];
273
270
  yAxisFields[yAxisFields.length] = {
274
271
  ...sampleField,
275
- field: `comparison_${sampleField.field}`,
276
- label: `comparison ${sampleField.label}`,
272
+ field: `comparison_${sampleField?.field}`,
273
+ label: `comparison ${sampleField?.label}`,
277
274
  };
278
275
  }
279
- const data = (pivotTable
280
- ? pivotTable.rows
281
- : config
282
- ? config.rows
283
- : dashboard[chartId].rows)
276
+ const data = (pivotTable ? pivotTable.rows : config.rows)
284
277
  // filter out any rows with a comparison key but no corresponding primary
285
278
  ?.filter((row) => Object.keys(row).every((key) => !key.startsWith('comparison_') ||
286
279
  (key.startsWith('comparison_') &&
287
280
  Boolean(row[key.replace('comparison_', '')]))));
288
281
  if (chartTypes.includes('column')) {
289
- return (_jsx(BarChart, { colors: colors, theme: theme, isStacked: isPivot && yAxisFields.length > (dateFilter?.comparison ? 2 : 1), yAxisFields: yAxisFields,
282
+ return (_jsx(BarChart, { colors: chartColors, theme: theme, isStacked: isPivot && yAxisFields.length > (dateFilter?.comparison ? 2 : 1), yAxisFields: yAxisFields,
290
283
  // @ts-ignore
291
- data: data, xAxisField: config ? config.xAxisField : dashboard[chartId].xAxisField, xAxisLabel: config ? config.xAxisLabel : dashboard[chartId].xAxisLabel, xAxisFormat: config ? config.xAxisFormat : dashboard[chartId].xAxisFormat, containerStyle: containerStyle, comparison: dateFilter?.comparison, isAnimationActive: isAnimationActive, hideXAxis: hideXAxis, hideYAxis: hideYAxis, hideCartesianGrid: hideCartesianGrid }));
284
+ data: data, xAxisField: config.xAxisField, xAxisLabel: config.xAxisLabel, xAxisFormat: config.xAxisFormat, containerStyle: containerStyle, comparison: dateFilter?.comparison, isAnimationActive: isAnimationActive, hideXAxis: hideXAxis, hideYAxis: hideYAxis, hideCartesianGrid: hideCartesianGrid }));
292
285
  }
293
286
  if (chartTypes.includes('metric')) {
294
- const data = dashboard[chartId] ? dashboard[chartId] : config;
287
+ const data = config; // THIS SHOULD ACCOUNT FOR PIVOT TABLES IN THE FUTURE
295
288
  const isComparison = data.rows.length > 0 &&
296
289
  Object.keys(data.rows[0]).includes(`comparison_${data.xAxisField}`);
297
290
  const primaryMetricLabel = data?.filtersApplied?.date_range?.preset?.label;
@@ -326,6 +319,8 @@ const ChartUpdater = ({ colors, chartId, config, containerStyle, dashboard, disp
326
319
  {
327
320
  field: data.xAxisField,
328
321
  format: data.xAxisFormat,
322
+ label: data.xAxisLabel,
323
+ _id: data._id || 'dummy',
329
324
  },
330
325
  ],
331
326
  }) }), isComparison && (_jsx("span", { style: {
@@ -355,6 +350,8 @@ const ChartUpdater = ({ colors, chartId, config, containerStyle, dashboard, disp
355
350
  {
356
351
  field: data.xAxisField,
357
352
  format: data.xAxisFormat,
353
+ label: data.xAxisLabel,
354
+ _id: data._id || 'dummy',
358
355
  },
359
356
  ],
360
357
  }) }), _jsx("span", { style: {
@@ -367,6 +364,6 @@ const ChartUpdater = ({ colors, chartId, config, containerStyle, dashboard, disp
367
364
  ? 'in ' + comparisonLabel.toLowerCase()
368
365
  : 'previous period' })] }))] }));
369
366
  }
370
- return (_jsx(LineChart, { colors: colors, yAxisFields: yAxisFields, data: data, xAxisField: config ? config.xAxisField : dashboard[chartId].xAxisField, xAxisLabel: config ? config.xAxisLabel : dashboard[chartId].xAxisLabel, xAxisFormat: config ? config.xAxisFormat : dashboard[chartId].xAxisFormat, containerStyle: containerStyle, theme: theme, comparison: dateFilter?.comparison, isAnimationActive: isAnimationActive, hideXAxis: hideXAxis, hideYAxis: hideYAxis, hideCartesianGrid: hideCartesianGrid }));
367
+ return (_jsx(LineChart, { colors: chartColors, yAxisFields: yAxisFields, data: data, xAxisField: config.xAxisField, xAxisLabel: config.xAxisLabel, xAxisFormat: config.xAxisFormat, containerStyle: containerStyle, theme: theme, comparison: dateFilter?.comparison, isAnimationActive: isAnimationActive, hideXAxis: hideXAxis, hideYAxis: hideYAxis, hideCartesianGrid: hideCartesianGrid }));
371
368
  };
372
369
  export default Chart;
@@ -1,8 +1,10 @@
1
1
  import React from 'react';
2
2
  import { Pivot } from './internals/ReportBuilder/PivotModal';
3
3
  import { SelectComponentProps, TextInputComponentProps, ButtonComponentProps, ModalComponentProps, HeaderProps, LabelProps, TextProps, DeleteButtonProps, PopoverComponentProps } from './components/UiComponents';
4
- export declare function snakeCaseToTitleCase(str: any): any;
4
+ import { Column } from './models/Tables';
5
+ import { Field } from './hooks/useQuill';
5
6
  export declare const numberFormatOptions: string[];
7
+ export declare const dateFormatOptions: string[];
6
8
  interface ChartBuilderProps {
7
9
  isOpen: boolean;
8
10
  setIsOpen: (isOpen: boolean) => void;
@@ -16,8 +18,10 @@ interface ChartBuilderProps {
16
18
  DeleteButton?: (props: DeleteButtonProps) => JSX.Element;
17
19
  Modal?: (props: ModalComponentProps) => JSX.Element;
18
20
  Popover?: (props: PopoverComponentProps) => JSX.Element;
19
- rows: object[];
20
- columns: object[];
21
+ rows: {
22
+ [key: string]: any;
23
+ }[];
24
+ columns: Column[];
21
25
  query?: string;
22
26
  isEditMode?: boolean;
23
27
  formHeaderStyle?: React.CSSProperties;
@@ -28,7 +32,7 @@ interface ChartBuilderProps {
28
32
  showDashboardDropdown?: boolean;
29
33
  onAddToDashboardComplete?: () => void;
30
34
  onDelete?: () => void;
31
- fields?: object[];
35
+ fields?: Field[];
32
36
  pivot?: Pivot;
33
37
  dateRange?: (string | Date)[];
34
38
  dashboardItem?: any;
@@ -1 +1 @@
1
- {"version":3,"file":"ChartBuilder.d.ts","sourceRoot":"","sources":["../../src/ChartBuilder.tsx"],"names":[],"mappings":"AACA,OAAO,KAA2D,MAAM,OAAO,CAAC;AAWhF,OAAO,EACL,KAAK,EAIN,MAAM,sCAAsC,CAAC;AAG9C,OAAO,EACL,oBAAoB,EACpB,uBAAuB,EACvB,oBAAoB,EACpB,mBAAmB,EACnB,WAAW,EACX,UAAU,EACV,SAAS,EACT,iBAAiB,EAUjB,qBAAqB,EAEtB,MAAM,2BAA2B,CAAC;AAgBnC,wBAAgB,oBAAoB,CAAC,GAAG,KAAA,OAavC;AAqED,eAAO,MAAM,mBAAmB,UAM/B,CAAC;AAoBF,UAAU,iBAAiB;IACzB,MAAM,EAAE,OAAO,CAAC;IAChB,SAAS,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACrC,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,oBAAoB,KAAK,GAAG,CAAC,OAAO,CAAC;IACtD,SAAS,CAAC,EAAE,CAAC,KAAK,EAAE,uBAAuB,KAAK,GAAG,CAAC,OAAO,CAAC;IAC5D,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,oBAAoB,KAAK,GAAG,CAAC,OAAO,CAAC;IACtD,eAAe,CAAC,EAAE,CAAC,KAAK,EAAE,oBAAoB,KAAK,GAAG,CAAC,OAAO,CAAC;IAC/D,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,KAAK,GAAG,CAAC,OAAO,CAAC;IAC7C,KAAK,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,KAAK,GAAG,CAAC,OAAO,CAAC;IAC3C,IAAI,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,GAAG,CAAC,OAAO,CAAC;IACzC,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,GAAG,CAAC,OAAO,CAAC;IACzD,KAAK,CAAC,EAAE,CAAC,KAAK,EAAE,mBAAmB,KAAK,GAAG,CAAC,OAAO,CAAC;IACpD,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,qBAAqB,KAAK,GAAG,CAAC,OAAO,CAAC;IACxD,IAAI,EAAE,MAAM,EAAE,CAAC;IACf,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,eAAe,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IACtC,cAAc,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IACrC,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,wBAAwB,CAAC,EAAE,OAAO,CAAC;IACnC,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,wBAAwB,CAAC,EAAE,MAAM,IAAI,CAAC;IACtC,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,MAAM,CAAC,EAAE,MAAM,EAAE,CAAC;IAClB,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,SAAS,CAAC,EAAE,CAAC,MAAM,GAAG,IAAI,CAAC,EAAE,CAAC;IAC9B,aAAa,CAAC,EAAE,GAAG,CAAC;IACpB,iBAAiB,CAAC,EAAE,KAAK,EAAE,CAAC;IAC5B,aAAa,CAAC,EAAE,KAAK,EAAE,CAAC;IACxB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B;AACD,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,KAAK,EAAE,iBAAiB,2CA4B5D"}
1
+ {"version":3,"file":"ChartBuilder.d.ts","sourceRoot":"","sources":["../../src/ChartBuilder.tsx"],"names":[],"mappings":"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"}