@quillsql/react 2.13.47 → 2.13.49
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/cjs/Chart.d.ts +2 -2
- package/dist/cjs/Chart.d.ts.map +1 -1
- package/dist/cjs/Chart.js +56 -49
- package/dist/cjs/ChartBuilder.d.ts +3 -2
- package/dist/cjs/ChartBuilder.d.ts.map +1 -1
- package/dist/cjs/ChartBuilder.js +172 -138
- package/dist/cjs/ChartEditor.d.ts +2 -2
- package/dist/cjs/ChartEditor.d.ts.map +1 -1
- package/dist/cjs/ChartEditor.js +5 -2
- package/dist/cjs/Context.d.ts +121 -41
- package/dist/cjs/Context.d.ts.map +1 -1
- package/dist/cjs/Context.js +449 -261
- package/dist/cjs/Dashboard.d.ts.map +1 -1
- package/dist/cjs/Dashboard.js +26 -25
- package/dist/cjs/DateRangePicker/QuillDateRangePicker.js +0 -3
- package/dist/cjs/DateRangePicker/dateRangePickerUtils.d.ts +24 -10
- package/dist/cjs/DateRangePicker/dateRangePickerUtils.d.ts.map +1 -1
- package/dist/cjs/DateRangePicker/dateRangePickerUtils.js +472 -96
- package/dist/cjs/QuillProvider.d.ts +3 -1
- package/dist/cjs/QuillProvider.d.ts.map +1 -1
- package/dist/cjs/QuillProvider.js +2 -2
- package/dist/cjs/ReportBuilder.d.ts.map +1 -1
- package/dist/cjs/ReportBuilder.js +25 -14
- package/dist/cjs/SQLEditor.d.ts +1 -1
- package/dist/cjs/SQLEditor.d.ts.map +1 -1
- package/dist/cjs/SQLEditor.js +51 -16
- package/dist/cjs/Table.d.ts.map +1 -1
- package/dist/cjs/Table.js +85 -14
- package/dist/cjs/assets/ExclamationFilledIcon.d.ts.map +1 -1
- package/dist/cjs/components/Chart/BarChart.d.ts.map +1 -1
- package/dist/cjs/components/Chart/BarChart.js +2 -1
- package/dist/cjs/components/Chart/CustomReferenceLine.d.ts +1 -1
- package/dist/cjs/components/Chart/CustomReferenceLine.d.ts.map +1 -1
- package/dist/cjs/components/Chart/CustomReferenceLine.js +7 -6
- package/dist/cjs/components/Chart/GaugeChart.d.ts +1 -1
- package/dist/cjs/components/Chart/GaugeChart.d.ts.map +1 -1
- package/dist/cjs/components/Chart/GaugeChart.js +63 -36
- package/dist/cjs/components/Chart/InternalChart.d.ts.map +1 -1
- package/dist/cjs/components/Chart/InternalChart.js +30 -33
- package/dist/cjs/components/Chart/LineChart.d.ts.map +1 -1
- package/dist/cjs/components/Chart/LineChart.js +3 -1
- package/dist/cjs/components/Chart/MapChart.d.ts +3 -3
- package/dist/cjs/components/Chart/MapChart.d.ts.map +1 -1
- package/dist/cjs/components/Chart/MapChart.js +62 -34
- package/dist/cjs/components/Chart/PieChart.d.ts +3 -1
- package/dist/cjs/components/Chart/PieChart.d.ts.map +1 -1
- package/dist/cjs/components/Chart/PieChart.js +80 -39
- package/dist/cjs/components/Dashboard/DashboardFilter.d.ts.map +1 -1
- package/dist/cjs/components/Dashboard/DashboardFilter.js +4 -20
- package/dist/cjs/components/Dashboard/DashboardTemplate.d.ts.map +1 -1
- package/dist/cjs/components/Dashboard/DashboardTemplate.js +2 -1
- package/dist/cjs/components/Dashboard/DataLoader.d.ts +4 -4
- package/dist/cjs/components/Dashboard/DataLoader.d.ts.map +1 -1
- package/dist/cjs/components/Dashboard/DataLoader.js +101 -65
- package/dist/cjs/components/Dashboard/MetricComponent.d.ts.map +1 -1
- package/dist/cjs/components/Dashboard/MetricComponent.js +2 -2
- package/dist/cjs/components/Dashboard/util.d.ts +1 -1
- package/dist/cjs/components/Dashboard/util.d.ts.map +1 -1
- package/dist/cjs/components/Dashboard/util.js +7 -6
- package/dist/cjs/components/QuillMultiSelectSectionList.d.ts.map +1 -1
- package/dist/cjs/components/QuillMultiSelectSectionList.js +32 -22
- package/dist/cjs/components/QuillMultiSelectWithCombo.d.ts.map +1 -1
- package/dist/cjs/components/QuillMultiSelectWithCombo.js +186 -159
- package/dist/cjs/components/QuillSelect.d.ts.map +1 -1
- package/dist/cjs/components/QuillSelect.js +83 -75
- package/dist/cjs/components/QuillSelectWithCombo.d.ts.map +1 -1
- package/dist/cjs/components/QuillSelectWithCombo.js +18 -11
- package/dist/cjs/components/QuillTable.d.ts.map +1 -1
- package/dist/cjs/components/QuillTable.js +59 -61
- package/dist/cjs/components/ReportBuilder/FilterStack.d.ts +2 -1
- package/dist/cjs/components/ReportBuilder/FilterStack.d.ts.map +1 -1
- package/dist/cjs/components/ReportBuilder/FilterStack.js +3 -4
- package/dist/cjs/components/ReportBuilder/ui.d.ts +2 -2
- package/dist/cjs/components/ReportBuilder/ui.d.ts.map +1 -1
- package/dist/cjs/components/ReportBuilder/ui.js +4 -7
- package/dist/cjs/components/UiComponents.d.ts +1 -1
- package/dist/cjs/hooks/useAskQuill.d.ts.map +1 -1
- package/dist/cjs/hooks/useAskQuill.js +5 -1
- package/dist/cjs/hooks/useDashboard.d.ts +2 -2
- package/dist/cjs/hooks/useDashboard.d.ts.map +1 -1
- package/dist/cjs/hooks/useDashboard.js +160 -69
- package/dist/cjs/hooks/useExport.d.ts.map +1 -1
- package/dist/cjs/hooks/useExport.js +29 -15
- package/dist/cjs/hooks/useOnClickOutside.d.ts.map +1 -1
- package/dist/cjs/hooks/useQuill.d.ts +1 -0
- package/dist/cjs/hooks/useQuill.d.ts.map +1 -1
- package/dist/cjs/hooks/useQuill.js +22 -12
- package/dist/cjs/hooks/useReport.d.ts +2 -2
- package/dist/cjs/hooks/useReport.d.ts.map +1 -1
- package/dist/cjs/hooks/useReport.js +3 -4
- package/dist/cjs/hooks/useVirtualTables.d.ts.map +1 -1
- package/dist/cjs/hooks/useVirtualTables.js +16 -22
- package/dist/cjs/index.d.ts +2 -2
- package/dist/cjs/index.d.ts.map +1 -1
- package/dist/cjs/index.js +2 -1
- package/dist/cjs/internals/ReportBuilder/PivotModal.d.ts +2 -1
- package/dist/cjs/internals/ReportBuilder/PivotModal.d.ts.map +1 -1
- package/dist/cjs/internals/ReportBuilder/PivotModal.js +19 -7
- package/dist/cjs/models/Client.d.ts +0 -1
- package/dist/cjs/models/Client.d.ts.map +1 -1
- package/dist/cjs/models/Data.d.ts +20 -0
- package/dist/cjs/models/Data.d.ts.map +1 -0
- package/dist/cjs/models/Data.js +2 -0
- package/dist/cjs/models/Filter.d.ts +42 -4
- package/dist/cjs/models/Filter.d.ts.map +1 -1
- package/dist/cjs/models/Pivot.d.ts.map +1 -1
- package/dist/cjs/utils/astProcessing.d.ts +3 -2
- package/dist/cjs/utils/astProcessing.d.ts.map +1 -1
- package/dist/cjs/utils/astProcessing.js +28 -37
- package/dist/cjs/utils/client.d.ts +3 -2
- package/dist/cjs/utils/client.d.ts.map +1 -1
- package/dist/cjs/utils/client.js +38 -39
- package/dist/cjs/utils/columnProcessing.d.ts.map +1 -1
- package/dist/cjs/utils/columnProcessing.js +14 -3
- package/dist/cjs/utils/constants.d.ts +1 -0
- package/dist/cjs/utils/constants.d.ts.map +1 -1
- package/dist/cjs/utils/constants.js +2 -1
- package/dist/cjs/utils/dashboard.d.ts +3 -2
- package/dist/cjs/utils/dashboard.d.ts.map +1 -1
- package/dist/cjs/utils/dashboard.js +30 -12
- package/dist/cjs/utils/dataFetcher.d.ts +8 -5
- package/dist/cjs/utils/dataFetcher.d.ts.map +1 -1
- package/dist/cjs/utils/dataFetcher.js +189 -65
- package/dist/cjs/utils/filterProcessing.d.ts +2 -1
- package/dist/cjs/utils/filterProcessing.d.ts.map +1 -1
- package/dist/cjs/utils/filterProcessing.js +24 -38
- package/dist/cjs/utils/getDomain.d.ts.map +1 -1
- package/dist/cjs/utils/paginationProcessing.d.ts +1 -0
- package/dist/cjs/utils/paginationProcessing.d.ts.map +1 -1
- package/dist/cjs/utils/paginationProcessing.js +6 -1
- package/dist/cjs/utils/pivotConstructor.d.ts +2 -1
- package/dist/cjs/utils/pivotConstructor.d.ts.map +1 -1
- package/dist/cjs/utils/pivotConstructor.js +15 -9
- package/dist/cjs/utils/pivotProcessing.d.ts.map +1 -1
- package/dist/cjs/utils/pivotProcessing.js +3 -5
- package/dist/cjs/utils/queryConstructor.js +1 -1
- package/dist/cjs/utils/report.d.ts +10 -7
- package/dist/cjs/utils/report.d.ts.map +1 -1
- package/dist/cjs/utils/report.js +52 -60
- package/dist/cjs/utils/schema.d.ts +4 -3
- package/dist/cjs/utils/schema.d.ts.map +1 -1
- package/dist/cjs/utils/schema.js +30 -44
- package/dist/cjs/utils/tableProcessing.d.ts +16 -10
- package/dist/cjs/utils/tableProcessing.d.ts.map +1 -1
- package/dist/cjs/utils/tableProcessing.js +92 -90
- package/dist/cjs/utils/textProcessing.d.ts.map +1 -1
- package/dist/cjs/utils/textProcessing.js +2 -1
- package/dist/cjs/utils/ui.d.ts.map +1 -1
- package/dist/esm/Chart.d.ts +2 -2
- package/dist/esm/Chart.d.ts.map +1 -1
- package/dist/esm/Chart.js +60 -53
- package/dist/esm/ChartBuilder.d.ts +3 -2
- package/dist/esm/ChartBuilder.d.ts.map +1 -1
- package/dist/esm/ChartBuilder.js +173 -139
- package/dist/esm/ChartEditor.d.ts +2 -2
- package/dist/esm/ChartEditor.d.ts.map +1 -1
- package/dist/esm/ChartEditor.js +6 -3
- package/dist/esm/Context.d.ts +121 -41
- package/dist/esm/Context.d.ts.map +1 -1
- package/dist/esm/Context.js +450 -262
- package/dist/esm/Dashboard.d.ts.map +1 -1
- package/dist/esm/Dashboard.js +28 -27
- package/dist/esm/DateRangePicker/QuillDateRangePicker.js +0 -3
- package/dist/esm/DateRangePicker/dateRangePickerUtils.d.ts +24 -10
- package/dist/esm/DateRangePicker/dateRangePickerUtils.d.ts.map +1 -1
- package/dist/esm/DateRangePicker/dateRangePickerUtils.js +471 -95
- package/dist/esm/QuillProvider.d.ts +3 -1
- package/dist/esm/QuillProvider.d.ts.map +1 -1
- package/dist/esm/QuillProvider.js +2 -2
- package/dist/esm/ReportBuilder.d.ts.map +1 -1
- package/dist/esm/ReportBuilder.js +28 -17
- package/dist/esm/SQLEditor.d.ts +1 -1
- package/dist/esm/SQLEditor.d.ts.map +1 -1
- package/dist/esm/SQLEditor.js +54 -19
- package/dist/esm/Table.d.ts.map +1 -1
- package/dist/esm/Table.js +88 -17
- package/dist/esm/assets/ExclamationFilledIcon.d.ts.map +1 -1
- package/dist/esm/components/Chart/BarChart.d.ts.map +1 -1
- package/dist/esm/components/Chart/BarChart.js +2 -1
- package/dist/esm/components/Chart/CustomReferenceLine.d.ts +1 -1
- package/dist/esm/components/Chart/CustomReferenceLine.d.ts.map +1 -1
- package/dist/esm/components/Chart/CustomReferenceLine.js +8 -7
- package/dist/esm/components/Chart/GaugeChart.d.ts +1 -1
- package/dist/esm/components/Chart/GaugeChart.d.ts.map +1 -1
- package/dist/esm/components/Chart/GaugeChart.js +65 -38
- package/dist/esm/components/Chart/InternalChart.d.ts.map +1 -1
- package/dist/esm/components/Chart/InternalChart.js +32 -35
- package/dist/esm/components/Chart/LineChart.d.ts.map +1 -1
- package/dist/esm/components/Chart/LineChart.js +3 -1
- package/dist/esm/components/Chart/MapChart.d.ts +3 -3
- package/dist/esm/components/Chart/MapChart.d.ts.map +1 -1
- package/dist/esm/components/Chart/MapChart.js +67 -39
- package/dist/esm/components/Chart/PieChart.d.ts +3 -1
- package/dist/esm/components/Chart/PieChart.d.ts.map +1 -1
- package/dist/esm/components/Chart/PieChart.js +80 -39
- package/dist/esm/components/Dashboard/DashboardFilter.d.ts.map +1 -1
- package/dist/esm/components/Dashboard/DashboardFilter.js +5 -21
- package/dist/esm/components/Dashboard/DashboardSection.js +2 -2
- package/dist/esm/components/Dashboard/DashboardTemplate.d.ts.map +1 -1
- package/dist/esm/components/Dashboard/DashboardTemplate.js +3 -2
- package/dist/esm/components/Dashboard/DataLoader.d.ts +4 -4
- package/dist/esm/components/Dashboard/DataLoader.d.ts.map +1 -1
- package/dist/esm/components/Dashboard/DataLoader.js +102 -66
- package/dist/esm/components/Dashboard/MetricComponent.d.ts.map +1 -1
- package/dist/esm/components/Dashboard/MetricComponent.js +2 -2
- package/dist/esm/components/Dashboard/util.d.ts +1 -1
- package/dist/esm/components/Dashboard/util.d.ts.map +1 -1
- package/dist/esm/components/Dashboard/util.js +8 -7
- package/dist/esm/components/QuillMultiSelectSectionList.d.ts.map +1 -1
- package/dist/esm/components/QuillMultiSelectSectionList.js +32 -22
- package/dist/esm/components/QuillMultiSelectWithCombo.d.ts.map +1 -1
- package/dist/esm/components/QuillMultiSelectWithCombo.js +187 -160
- package/dist/esm/components/QuillSelect.d.ts.map +1 -1
- package/dist/esm/components/QuillSelect.js +85 -77
- package/dist/esm/components/QuillSelectWithCombo.d.ts.map +1 -1
- package/dist/esm/components/QuillSelectWithCombo.js +18 -11
- package/dist/esm/components/QuillTable.d.ts.map +1 -1
- package/dist/esm/components/QuillTable.js +59 -61
- package/dist/esm/components/ReportBuilder/FilterStack.d.ts +2 -1
- package/dist/esm/components/ReportBuilder/FilterStack.d.ts.map +1 -1
- package/dist/esm/components/ReportBuilder/FilterStack.js +3 -4
- package/dist/esm/components/ReportBuilder/ui.d.ts +2 -2
- package/dist/esm/components/ReportBuilder/ui.d.ts.map +1 -1
- package/dist/esm/components/ReportBuilder/ui.js +4 -7
- package/dist/esm/components/UiComponents.d.ts +1 -1
- package/dist/esm/hooks/useAskQuill.d.ts.map +1 -1
- package/dist/esm/hooks/useAskQuill.js +6 -2
- package/dist/esm/hooks/useDashboard.d.ts +2 -2
- package/dist/esm/hooks/useDashboard.d.ts.map +1 -1
- package/dist/esm/hooks/useDashboard.js +162 -71
- package/dist/esm/hooks/useExport.d.ts.map +1 -1
- package/dist/esm/hooks/useExport.js +31 -17
- package/dist/esm/hooks/useOnClickOutside.d.ts.map +1 -1
- package/dist/esm/hooks/useQuill.d.ts +1 -0
- package/dist/esm/hooks/useQuill.d.ts.map +1 -1
- package/dist/esm/hooks/useQuill.js +23 -13
- package/dist/esm/hooks/useReport.d.ts +2 -2
- package/dist/esm/hooks/useReport.d.ts.map +1 -1
- package/dist/esm/hooks/useReport.js +4 -5
- package/dist/esm/hooks/useVirtualTables.d.ts.map +1 -1
- package/dist/esm/hooks/useVirtualTables.js +17 -23
- package/dist/esm/index.d.ts +2 -2
- package/dist/esm/index.d.ts.map +1 -1
- package/dist/esm/index.js +1 -1
- package/dist/esm/internals/ReportBuilder/PivotModal.d.ts +2 -1
- package/dist/esm/internals/ReportBuilder/PivotModal.d.ts.map +1 -1
- package/dist/esm/internals/ReportBuilder/PivotModal.js +20 -8
- package/dist/esm/models/Client.d.ts +0 -1
- package/dist/esm/models/Client.d.ts.map +1 -1
- package/dist/esm/models/Data.d.ts +20 -0
- package/dist/esm/models/Data.d.ts.map +1 -0
- package/dist/esm/models/Data.js +1 -0
- package/dist/esm/models/Filter.d.ts +42 -4
- package/dist/esm/models/Filter.d.ts.map +1 -1
- package/dist/esm/models/Pivot.d.ts.map +1 -1
- package/dist/esm/utils/astProcessing.d.ts +3 -2
- package/dist/esm/utils/astProcessing.d.ts.map +1 -1
- package/dist/esm/utils/astProcessing.js +28 -37
- package/dist/esm/utils/client.d.ts +3 -2
- package/dist/esm/utils/client.d.ts.map +1 -1
- package/dist/esm/utils/client.js +38 -39
- package/dist/esm/utils/columnProcessing.d.ts.map +1 -1
- package/dist/esm/utils/columnProcessing.js +14 -3
- package/dist/esm/utils/constants.d.ts +1 -0
- package/dist/esm/utils/constants.d.ts.map +1 -1
- package/dist/esm/utils/constants.js +1 -0
- package/dist/esm/utils/dashboard.d.ts +3 -2
- package/dist/esm/utils/dashboard.d.ts.map +1 -1
- package/dist/esm/utils/dashboard.js +31 -13
- package/dist/esm/utils/dataFetcher.d.ts +8 -5
- package/dist/esm/utils/dataFetcher.d.ts.map +1 -1
- package/dist/esm/utils/dataFetcher.js +187 -65
- package/dist/esm/utils/filterProcessing.d.ts +2 -1
- package/dist/esm/utils/filterProcessing.d.ts.map +1 -1
- package/dist/esm/utils/filterProcessing.js +25 -39
- package/dist/esm/utils/getDomain.d.ts.map +1 -1
- package/dist/esm/utils/paginationProcessing.d.ts +1 -0
- package/dist/esm/utils/paginationProcessing.d.ts.map +1 -1
- package/dist/esm/utils/paginationProcessing.js +5 -0
- package/dist/esm/utils/pivotConstructor.d.ts +2 -1
- package/dist/esm/utils/pivotConstructor.d.ts.map +1 -1
- package/dist/esm/utils/pivotConstructor.js +16 -10
- package/dist/esm/utils/pivotProcessing.d.ts.map +1 -1
- package/dist/esm/utils/pivotProcessing.js +5 -7
- package/dist/esm/utils/queryConstructor.js +1 -1
- package/dist/esm/utils/report.d.ts +10 -7
- package/dist/esm/utils/report.d.ts.map +1 -1
- package/dist/esm/utils/report.js +53 -61
- package/dist/esm/utils/schema.d.ts +4 -3
- package/dist/esm/utils/schema.d.ts.map +1 -1
- package/dist/esm/utils/schema.js +30 -44
- package/dist/esm/utils/tableProcessing.d.ts +16 -10
- package/dist/esm/utils/tableProcessing.d.ts.map +1 -1
- package/dist/esm/utils/tableProcessing.js +94 -92
- package/dist/esm/utils/textProcessing.d.ts.map +1 -1
- package/dist/esm/utils/textProcessing.js +2 -1
- package/dist/esm/utils/ui.d.ts.map +1 -1
- package/package.json +2 -1
|
@@ -102,5 +102,6 @@ function BarChart({ colors, colorMap, yAxisFields, data, containerStyle, classNa
|
|
|
102
102
|
(0, color_1.selectColor)(elem, colors.length >= yAxisFields.length / (comparison ? 2 : 1)
|
|
103
103
|
? colors
|
|
104
104
|
: (0, color_1.generateArrayFromColor)(colors.slice(0, 2), yAxisFields.length), yAxisFields.findIndex((field) => field.field === elem.field?.replace('comparison_', ''))), isAnimationActive: isAnimationActive }, elem.field));
|
|
105
|
-
}), referenceLines &&
|
|
105
|
+
}), referenceLines &&
|
|
106
|
+
referenceLines.map(({ label, query }) => ((0, jsx_runtime_1.jsx)(recharts_1.Customized, { component: (props) => ((0, jsx_runtime_1.jsx)(CustomReferenceLine_1.default, { ...props, referenceLine: query, label: label })) }, label)))] }) }) }));
|
|
106
107
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export default function CustomReferenceLine({ xAxisMap, yAxisMap, referenceLine, label, color }: any): import("react/jsx-runtime").JSX.Element | null;
|
|
1
|
+
export default function CustomReferenceLine({ xAxisMap, yAxisMap, referenceLine, label, color, }: any): import("react/jsx-runtime").JSX.Element | null;
|
|
2
2
|
//# sourceMappingURL=CustomReferenceLine.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CustomReferenceLine.d.ts","sourceRoot":"","sources":["../../../../src/components/Chart/CustomReferenceLine.tsx"],"names":[],"mappings":"AAEA,MAAM,CAAC,OAAO,UAAU,mBAAmB,CAAC,
|
|
1
|
+
{"version":3,"file":"CustomReferenceLine.d.ts","sourceRoot":"","sources":["../../../../src/components/Chart/CustomReferenceLine.tsx"],"names":[],"mappings":"AAEA,MAAM,CAAC,OAAO,UAAU,mBAAmB,CAAC,EAC1C,QAAQ,EACR,QAAQ,EACR,aAAa,EACb,KAAK,EACL,KAAK,GACN,EAAE,GAAG,kDA6EL"}
|
|
@@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
3
3
|
exports.default = CustomReferenceLine;
|
|
4
4
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
5
5
|
const constants_1 = require("../../utils/constants");
|
|
6
|
-
function CustomReferenceLine({ xAxisMap, yAxisMap, referenceLine, label, color }) {
|
|
6
|
+
function CustomReferenceLine({ xAxisMap, yAxisMap, referenceLine, label, color, }) {
|
|
7
7
|
const xAxisKey = Object.keys(xAxisMap)[0];
|
|
8
8
|
const yAxisKey = Object.keys(yAxisMap)[0];
|
|
9
9
|
if (!xAxisKey || !yAxisKey)
|
|
@@ -14,13 +14,14 @@ function CustomReferenceLine({ xAxisMap, yAxisMap, referenceLine, label, color }
|
|
|
14
14
|
const y1 = yScale(referenceLine[0]);
|
|
15
15
|
const y2 = yScale(referenceLine[1]);
|
|
16
16
|
const textY = yScale(referenceLine[referenceLine.length - 1]) - 5;
|
|
17
|
-
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [referenceLine.length === 2 &&
|
|
18
|
-
(0, jsx_runtime_1.jsx)("line", { x1: xMin, y1: y1, x2: xMax, y2: y2, stroke: color || "gray", strokeDasharray: "5 5", strokeWidth: 1, pointerEvents: "none" }), referenceLine.length > 2 &&
|
|
17
|
+
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [referenceLine.length === 2 && ((0, jsx_runtime_1.jsx)("line", { x1: xMin, y1: y1, x2: xMax, y2: y2, stroke: color || 'gray', strokeDasharray: "5 5", strokeWidth: 1, pointerEvents: "none" })), referenceLine.length > 2 &&
|
|
19
18
|
referenceLine.slice(1).map((point, index) => {
|
|
20
19
|
const x1 = xMin + (xMax - xMin) * (index / (referenceLine.length - 1));
|
|
21
20
|
const x2 = xMin + (xMax - xMin) * ((index + 1) / (referenceLine.length - 1));
|
|
22
|
-
return ((0, jsx_runtime_1.jsx)("line", { x1: x1, y1: yScale(referenceLine[index]), x2: x2, y2: yScale(point), stroke: color ||
|
|
23
|
-
}), (0, jsx_runtime_1.jsxs)("text", { x: xMax - 5, y: textY, fontSize: "12", fill: color ||
|
|
21
|
+
return ((0, jsx_runtime_1.jsx)("line", { x1: x1, y1: yScale(referenceLine[index]), x2: x2, y2: yScale(point), stroke: color || 'gray', strokeDasharray: "5 5", strokeWidth: 1, pointerEvents: "none" }, index));
|
|
22
|
+
}), (0, jsx_runtime_1.jsxs)("text", { x: xMax - 5, y: textY, fontSize: "12", fill: color || 'gray',
|
|
24
23
|
// stroke="white"
|
|
25
|
-
strokeWidth: 0.4, strokeLinejoin: "round", paintOrder: "stroke fill", fontWeight: "light", textAnchor: "end", z: 10000, children: [label === constants_1.REFERENCE_LINE ? '' : label,
|
|
24
|
+
strokeWidth: 0.4, strokeLinejoin: "round", paintOrder: "stroke fill", fontWeight: "light", textAnchor: "end", z: 10000, children: [label === constants_1.REFERENCE_LINE ? '' : label, ' ', referenceLine.length > 2
|
|
25
|
+
? ''
|
|
26
|
+
: `(${referenceLine[0] === referenceLine[1] ? referenceLine[0] : referenceLine.join(', ')})`] })] }));
|
|
26
27
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import 'd3-transition';
|
|
2
|
-
import { AxisFormat } from
|
|
2
|
+
import { AxisFormat } from '../../Dashboard';
|
|
3
3
|
export default function GaugeChart({ data, xAxisField, xAxisFormat, containerStyle, colors, isAnimationActive, }: {
|
|
4
4
|
data: any[];
|
|
5
5
|
xAxisField: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"GaugeChart.d.ts","sourceRoot":"","sources":["../../../../src/components/Chart/GaugeChart.tsx"],"names":[],"mappings":"AAOA,OAAO,eAAe,CAAC;AAGvB,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAE7C,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,EACjC,IAAI,EACJ,UAAU,EACV,WAAW,EACX,cAAc,EACd,MAAM,EACN,iBAAwB,GACzB,EAAE;IACD,IAAI,EAAE,GAAG,EAAE,CAAC;IACZ,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,EAAE,UAAU,CAAC;IACxB,cAAc,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IACrC,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC7B,
|
|
1
|
+
{"version":3,"file":"GaugeChart.d.ts","sourceRoot":"","sources":["../../../../src/components/Chart/GaugeChart.tsx"],"names":[],"mappings":"AAOA,OAAO,eAAe,CAAC;AAGvB,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAE7C,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,EACjC,IAAI,EACJ,UAAU,EACV,WAAW,EACX,cAAc,EACd,MAAM,EACN,iBAAwB,GACzB,EAAE;IACD,IAAI,EAAE,GAAG,EAAE,CAAC;IACZ,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,EAAE,UAAU,CAAC;IACxB,cAAc,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IACrC,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC7B,2CAiBA"}
|
|
@@ -43,13 +43,13 @@ const react_1 = require("react");
|
|
|
43
43
|
require("d3-transition");
|
|
44
44
|
const axisFormatter_1 = require("../../utils/axisFormatter");
|
|
45
45
|
function GaugeChart({ data, xAxisField, xAxisFormat, containerStyle, colors, isAnimationActive = true, }) {
|
|
46
|
-
const percentage = parseFloat(data[0][xAxisField]) || 0;
|
|
46
|
+
const percentage = parseFloat(data[0]?.[xAxisField]) || 0;
|
|
47
47
|
const normalizedPercentage = ['whole_number', 'two_decimal_places'].includes(xAxisFormat)
|
|
48
48
|
? Math.max(Math.min(percentage / 100, 1), 0)
|
|
49
49
|
: Math.max(Math.min(percentage, 1), 0);
|
|
50
50
|
return ((0, jsx_runtime_1.jsx)(D3Gauge, { percentage: normalizedPercentage, xAxisFormat: xAxisFormat, containerStyle: { ...containerStyle }, colors: colors, isAnimationActive: isAnimationActive }));
|
|
51
51
|
}
|
|
52
|
-
function D3Gauge({ percentage, containerStyle, xAxisFormat, colors, isAnimationActive }) {
|
|
52
|
+
function D3Gauge({ percentage, containerStyle, xAxisFormat, colors, isAnimationActive, }) {
|
|
53
53
|
const containerRef = (0, react_1.useRef)(null);
|
|
54
54
|
const svgRef = (0, react_1.useRef)(null);
|
|
55
55
|
const gaugeGroupRef = (0, react_1.useRef)(null);
|
|
@@ -68,13 +68,13 @@ function D3Gauge({ percentage, containerStyle, xAxisFormat, colors, isAnimationA
|
|
|
68
68
|
(0, react_1.useEffect)(() => {
|
|
69
69
|
Promise.resolve().then(() => __importStar(require('d3-shape'))).then(({ arc }) => {
|
|
70
70
|
setArc(() => arc);
|
|
71
|
-
})
|
|
71
|
+
});
|
|
72
72
|
Promise.resolve().then(() => __importStar(require('d3-interpolate'))).then(({ interpolate }) => {
|
|
73
73
|
setInterpolate(() => interpolate);
|
|
74
|
-
})
|
|
74
|
+
});
|
|
75
75
|
Promise.resolve().then(() => __importStar(require('d3-selection'))).then(({ select }) => {
|
|
76
76
|
setSelect(() => select);
|
|
77
|
-
})
|
|
77
|
+
});
|
|
78
78
|
}, []);
|
|
79
79
|
// --- Initialization ---
|
|
80
80
|
(0, react_1.useEffect)(() => {
|
|
@@ -97,16 +97,19 @@ function D3Gauge({ percentage, containerStyle, xAxisFormat, colors, isAnimationA
|
|
|
97
97
|
gaugeGroupRef.current.append('path').attr('class', `arc-seg seg${i}`);
|
|
98
98
|
}
|
|
99
99
|
// Create needle outline and needle.
|
|
100
|
-
needleOutlineRef.current = gaugeGroupRef.current
|
|
100
|
+
needleOutlineRef.current = gaugeGroupRef.current
|
|
101
|
+
.append('line')
|
|
101
102
|
.attr('stroke', 'white')
|
|
102
103
|
.attr('stroke-width', 8)
|
|
103
104
|
.attr('stroke-linecap', 'round');
|
|
104
|
-
needleRef.current = gaugeGroupRef.current
|
|
105
|
+
needleRef.current = gaugeGroupRef.current
|
|
106
|
+
.append('line')
|
|
105
107
|
.attr('stroke', 'black')
|
|
106
108
|
.attr('stroke-width', 4)
|
|
107
109
|
.attr('stroke-linecap', 'round');
|
|
108
110
|
// Create text label.
|
|
109
|
-
textRef.current = gaugeGroupRef.current
|
|
111
|
+
textRef.current = gaugeGroupRef.current
|
|
112
|
+
.append('text')
|
|
110
113
|
.attr('class', 'gauge-label')
|
|
111
114
|
.attr('text-anchor', 'middle')
|
|
112
115
|
.attr('fill', '#000')
|
|
@@ -143,21 +146,31 @@ function D3Gauge({ percentage, containerStyle, xAxisFormat, colors, isAnimationA
|
|
|
143
146
|
// Vertical offset to visually center the 270° arc.
|
|
144
147
|
const verticalOffset = gaugeHeight * 0.05;
|
|
145
148
|
// Update viewBox so our internal coordinates scale.
|
|
146
|
-
svgRef.current
|
|
147
|
-
.attr('viewBox', `0 0 ${gaugeWidth} ${gaugeHeight}`);
|
|
149
|
+
svgRef.current.attr('viewBox', `0 0 ${gaugeWidth} ${gaugeHeight}`);
|
|
148
150
|
// Center the gauge group.
|
|
149
151
|
gaugeGroupRef.current.attr('transform', `translate(${gaugeWidth / 2}, ${gaugeHeight / 2 + verticalOffset})`);
|
|
150
152
|
// Draw the arc segments.
|
|
151
153
|
const segments = [
|
|
152
|
-
{
|
|
153
|
-
|
|
154
|
-
|
|
154
|
+
{
|
|
155
|
+
start: startAngle,
|
|
156
|
+
end: startAngle + totalAngle / 3,
|
|
157
|
+
color: colors[1] || 'red',
|
|
158
|
+
},
|
|
159
|
+
{
|
|
160
|
+
start: startAngle + totalAngle / 3,
|
|
161
|
+
end: startAngle + (2 * totalAngle) / 3,
|
|
162
|
+
color: colors[3] || 'yellow',
|
|
163
|
+
},
|
|
164
|
+
{
|
|
165
|
+
start: startAngle + (2 * totalAngle) / 3,
|
|
166
|
+
end: startAngle + totalAngle,
|
|
167
|
+
color: colors[2] || 'green',
|
|
168
|
+
},
|
|
155
169
|
];
|
|
156
|
-
const arcGenerator = arc()
|
|
157
|
-
.innerRadius(innerRadius)
|
|
158
|
-
.outerRadius(radius);
|
|
170
|
+
const arcGenerator = arc().innerRadius(innerRadius).outerRadius(radius);
|
|
159
171
|
segments.forEach((seg, i) => {
|
|
160
|
-
gaugeGroupRef.current
|
|
172
|
+
gaugeGroupRef.current
|
|
173
|
+
?.select(`.arc-seg.seg${i}`)
|
|
161
174
|
.attr('d', arcGenerator({
|
|
162
175
|
innerRadius,
|
|
163
176
|
outerRadius: radius,
|
|
@@ -180,47 +193,53 @@ function D3Gauge({ percentage, containerStyle, xAxisFormat, colors, isAnimationA
|
|
|
180
193
|
const newAngle = startAngle + totalAngle * percentage - Math.PI / 2;
|
|
181
194
|
const endpoints = calcEndpoints(newAngle);
|
|
182
195
|
// Update text font-size relative to radius.
|
|
183
|
-
textRef.current
|
|
196
|
+
textRef.current
|
|
197
|
+
.attr('font-size', radius / 3)
|
|
184
198
|
// Position text below the gauge center.
|
|
185
199
|
.attr('y', radius * 0.1);
|
|
186
200
|
if (isAnimationActive) {
|
|
187
201
|
const prevAngle = startAngle + totalAngle * previousPercentageRef.current - Math.PI / 2;
|
|
188
202
|
const angleInterpolator = interpolate(prevAngle, newAngle);
|
|
189
203
|
const textInterpolator = interpolate(previousPercentageRef.current, percentage);
|
|
190
|
-
needleRef.current
|
|
204
|
+
needleRef.current
|
|
205
|
+
.interrupt()
|
|
191
206
|
.transition()
|
|
192
207
|
.duration(1000)
|
|
193
|
-
.tween(
|
|
208
|
+
.tween('needle', function () {
|
|
194
209
|
return function (t) {
|
|
195
210
|
const currentAngle = angleInterpolator(t);
|
|
196
211
|
const { x1, y1, x2, y2 } = calcEndpoints(currentAngle);
|
|
197
|
-
needleRef
|
|
198
|
-
.attr(
|
|
199
|
-
.attr(
|
|
200
|
-
.attr(
|
|
201
|
-
.attr(
|
|
202
|
-
needleOutlineRef
|
|
203
|
-
.attr(
|
|
204
|
-
.attr(
|
|
205
|
-
.attr(
|
|
206
|
-
.attr(
|
|
212
|
+
needleRef
|
|
213
|
+
.current.attr('x1', x1)
|
|
214
|
+
.attr('y1', y1)
|
|
215
|
+
.attr('x2', x2)
|
|
216
|
+
.attr('y2', y2);
|
|
217
|
+
needleOutlineRef
|
|
218
|
+
.current.attr('x1', x1)
|
|
219
|
+
.attr('y1', y1)
|
|
220
|
+
.attr('x2', x2)
|
|
221
|
+
.attr('y2', y2);
|
|
207
222
|
const currentPercentage = textInterpolator(t);
|
|
208
223
|
const percentText = (0, axisFormatter_1.axisFormatter)({
|
|
209
|
-
value: xAxisFormat === 'percent'
|
|
224
|
+
value: xAxisFormat === 'percent'
|
|
225
|
+
? currentPercentage
|
|
226
|
+
: currentPercentage * 100,
|
|
210
227
|
field: 'amount',
|
|
211
|
-
fields: [{ field: 'amount', format: xAxisFormat }]
|
|
228
|
+
fields: [{ field: 'amount', format: xAxisFormat }],
|
|
212
229
|
}) + (xAxisFormat === 'percent' ? '' : '%');
|
|
213
230
|
textRef.current?.text(percentText);
|
|
214
231
|
};
|
|
215
232
|
});
|
|
216
233
|
}
|
|
217
234
|
else {
|
|
218
|
-
needleRef.current
|
|
235
|
+
needleRef.current
|
|
236
|
+
.interrupt()
|
|
219
237
|
.attr('x1', endpoints.x1)
|
|
220
238
|
.attr('y1', endpoints.y1)
|
|
221
239
|
.attr('x2', endpoints.x2)
|
|
222
240
|
.attr('y2', endpoints.y2);
|
|
223
|
-
needleOutlineRef.current
|
|
241
|
+
needleOutlineRef.current
|
|
242
|
+
.interrupt()
|
|
224
243
|
.attr('x1', endpoints.x1)
|
|
225
244
|
.attr('y1', endpoints.y1)
|
|
226
245
|
.attr('x2', endpoints.x2)
|
|
@@ -228,13 +247,21 @@ function D3Gauge({ percentage, containerStyle, xAxisFormat, colors, isAnimationA
|
|
|
228
247
|
const percentText = (0, axisFormatter_1.axisFormatter)({
|
|
229
248
|
value: xAxisFormat === 'percent' ? percentage : percentage * 100,
|
|
230
249
|
field: 'amount',
|
|
231
|
-
fields: [{ field: 'amount', format: xAxisFormat }]
|
|
250
|
+
fields: [{ field: 'amount', format: xAxisFormat }],
|
|
232
251
|
}) + (xAxisFormat === 'percent' ? '' : '%');
|
|
233
252
|
textRef.current.text(percentText);
|
|
234
253
|
}
|
|
235
254
|
previousPercentageRef.current = percentage;
|
|
236
255
|
firstMountRef.current = false;
|
|
237
|
-
}, [
|
|
256
|
+
}, [
|
|
257
|
+
percentage,
|
|
258
|
+
colors,
|
|
259
|
+
isAnimationActive,
|
|
260
|
+
xAxisFormat,
|
|
261
|
+
select,
|
|
262
|
+
arc,
|
|
263
|
+
interpolate,
|
|
264
|
+
]);
|
|
238
265
|
// Use ResizeObserver to trigger updates on container size changes.
|
|
239
266
|
(0, react_1.useEffect)(() => {
|
|
240
267
|
if (!containerRef.current)
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InternalChart.d.ts","sourceRoot":"","sources":["../../../../src/components/Chart/InternalChart.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"InternalChart.d.ts","sourceRoot":"","sources":["../../../../src/components/Chart/InternalChart.tsx"],"names":[],"mappings":"AAmCA,OAAO,EAAgB,UAAU,EAAE,MAAM,aAAa,CAAC;AACvD,OAAO,EAAE,WAAW,EAAkB,MAAM,qBAAqB,CAAC;AAQlE,wBAAgB,YAAY,CAAC,QAAQ,EAAE,GAAG,EAAE,EAAE,QAAQ,EAAE,GAAG,EAAE,WAiH5D;AAyFD,MAAM,MAAM,YAAY,GAAG;IACzB,CAAC,GAAG,EAAE,MAAM,GAAG;QACb,OAAO,EAAE,MAAM,CAAC;QAChB,UAAU,CAAC,EAAE,MAAM,CAAC;QACpB,oBAAoB,CAAC,EAAE,MAAM,CAAC;QAC9B,mBAAmB,CAAC,EAAE,MAAM,CAAC;QAC7B,uBAAuB,CAAC,EAAE,MAAM,CAAC;QACjC,sBAAsB,CAAC,EAAE,MAAM,CAAC;KACjC,CAAC;CACH,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,EACpC,MAAM,EACN,MAAM,EACN,SAAS,EACT,cAAc,EACd,iBAAiB,EACjB,SAAS,EACT,SAAS,EACT,iBAAiB,EACjB,2BAAmC,EACnC,yBAAgC,EAChC,wBAAgC,EAChC,sBAAgC,EAChC,sBAAsB,EACtB,mBAAmB,EACnB,mBAA2B,EAC3B,cAAc,EACd,iBAAiB,EACjB,iBAAiB,EACjB,gBAAuC,EACvC,eAA+C,EAC/C,oBAAyD,EACzD,wBAA+C,EAC/C,eAAsC,EACtC,OAAO,EACP,uBAAuB,EACvB,mBAAmB,EACnB,OAAO,EACP,KAAK,EACL,OAAO,EACP,oBAAoB,EACpB,aAAa,GACd,EAAE,IAAI,CAAC,UAAU,EAAE,UAAU,CAAC,GAAG;IAChC,MAAM,EAAE,WAAW,CAAC;IACpB,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,cAAc,EAAE,OAAO,CAAC;IACxB,iBAAiB,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IAC3C,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,uBAAuB,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,KAAK,IAAI,CAAC;IAC7D,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB,2CA+dA"}
|
|
@@ -14,13 +14,13 @@ const ChartError_1 = __importDefault(require("../../components/Chart/ChartError"
|
|
|
14
14
|
const Filter_1 = require("../../models/Filter");
|
|
15
15
|
const filterProcessing_1 = require("../../utils/filterProcessing");
|
|
16
16
|
const DashboardFilter_1 = require("../../components/Dashboard/DashboardFilter");
|
|
17
|
-
const QuillSelect_1 = require("../../components/QuillSelect");
|
|
18
17
|
const QuillDateRangePicker_1 = require("../../DateRangePicker/QuillDateRangePicker");
|
|
19
18
|
const MetricComponent_1 = __importDefault(require("../../components/Dashboard/MetricComponent"));
|
|
20
19
|
const dateRangePickerUtils_1 = require("../../DateRangePicker/dateRangePickerUtils");
|
|
21
20
|
const Chart_1 = require("../../Chart");
|
|
22
21
|
const Report_1 = require("../../models/Report");
|
|
23
22
|
const QuillMultiSelectWithCombo_1 = require("../QuillMultiSelectWithCombo");
|
|
23
|
+
const QuillSelectWithCombo_1 = require("../QuillSelectWithCombo");
|
|
24
24
|
function areDatesNearby(date1, date2) {
|
|
25
25
|
return Math.abs((0, date_fns_1.differenceInHours)(date1, date2)) < 24;
|
|
26
26
|
}
|
|
@@ -165,7 +165,7 @@ const TogglePrimitive = ({ value, onClick, style, disabled, }) => {
|
|
|
165
165
|
color: '#607D8B',
|
|
166
166
|
} }))] }));
|
|
167
167
|
};
|
|
168
|
-
function InternalChart({ report, colors, className, containerStyle, isAnimationActive, hideXAxis, hideYAxis, hideCartesianGrid, hideHorizontalCartesianGrid = false, hideVerticalCartesianGrid = true, hideSubsequentXAxisTicks = false, cartesianGridLineStyle = 'solid', cartesianGridLineColor, comparisonLineStyle, hideDateRangeFilter = false, filtersEnabled, setFiltersEnabled, mapColorsToFields, LoadingComponent = ChartSkeleton_1.QuillLoadingSkeleton, SelectComponent =
|
|
168
|
+
function InternalChart({ report, colors, className, containerStyle, isAnimationActive, hideXAxis, hideYAxis, hideCartesianGrid, hideHorizontalCartesianGrid = false, hideVerticalCartesianGrid = true, hideSubsequentXAxisTicks = false, cartesianGridLineStyle = 'solid', cartesianGridLineColor, comparisonLineStyle, hideDateRangeFilter = false, filtersEnabled, setFiltersEnabled, mapColorsToFields, LoadingComponent = ChartSkeleton_1.QuillLoadingSkeleton, SelectComponent = QuillSelectWithCombo_1.QuillSelectComponentWithCombo, MultiSelectComponent = QuillMultiSelectWithCombo_1.QuillMultiSelectComponentWithCombo, DateRangePickerComponent = QuillDateRangePicker_1.QuillDateRangePicker, MetricComponent = MetricComponent_1.default, filters, onDashboardFilterChange, onClickChartElement, loading, error, isAdmin, filterToggleDisabled, layoutChanged, }) {
|
|
169
169
|
const { reportFilters } = (0, react_1.useContext)(Context_1.ReportFiltersContext);
|
|
170
170
|
const { dashboardConfig } = (0, react_1.useContext)(Context_1.DashboardConfigContext);
|
|
171
171
|
const currentReportFilters = (0, react_1.useMemo)(() => {
|
|
@@ -189,28 +189,12 @@ function InternalChart({ report, colors, className, containerStyle, isAnimationA
|
|
|
189
189
|
});
|
|
190
190
|
}, [reportFilters, report?.id]);
|
|
191
191
|
const reportDateFilter = (0, react_1.useMemo)(() => {
|
|
192
|
-
return Object.values(reportFilters[report?.id ?? Report_1.TEMP_REPORT_ID] ?? {}).find((f) => f.filter.filterType === 'date_range')
|
|
192
|
+
return Object.values(reportFilters[report?.id ?? Report_1.TEMP_REPORT_ID] ?? {}).find((f) => f.filter.filterType === 'date_range')
|
|
193
|
+
?.filter;
|
|
193
194
|
}, [reportFilters, report?.id]);
|
|
194
195
|
const presetOptions = (0, react_1.useMemo)(() => {
|
|
195
196
|
return reportDateFilter
|
|
196
|
-
? (reportDateFilter.
|
|
197
|
-
if (!elem.isStatic) {
|
|
198
|
-
return {
|
|
199
|
-
label: elem.label,
|
|
200
|
-
value: elem.value,
|
|
201
|
-
startDate: dateRangePickerUtils_1.PRIMARY_RANGE[elem.value]?.startDate ??
|
|
202
|
-
dateRangePickerUtils_1.PRIMARY_RANGE['LAST_30_DAYS'].startDate,
|
|
203
|
-
endDate: dateRangePickerUtils_1.PRIMARY_RANGE[elem.value]?.endDate ??
|
|
204
|
-
dateRangePickerUtils_1.PRIMARY_RANGE['LAST_30_DAYS'].endDate,
|
|
205
|
-
};
|
|
206
|
-
}
|
|
207
|
-
return {
|
|
208
|
-
label: elem.label,
|
|
209
|
-
value: elem.value,
|
|
210
|
-
startDate: new Date(elem.startDate),
|
|
211
|
-
endDate: new Date(elem.endDate),
|
|
212
|
-
};
|
|
213
|
-
}) ?? dateRangePickerUtils_1.defaultOptionsV2)
|
|
197
|
+
? (0, dateRangePickerUtils_1.convertPresetOptionsToSelectableList)(reportDateFilter.presetOptions ?? [], reportDateFilter.defaultPresetRanges ?? [])
|
|
214
198
|
: dateRangePickerUtils_1.defaultOptionsV2;
|
|
215
199
|
}, [reportDateFilter]);
|
|
216
200
|
// const userFilters = useMemo(() => {
|
|
@@ -226,10 +210,7 @@ function InternalChart({ report, colors, className, containerStyle, isAnimationA
|
|
|
226
210
|
(0, react_1.useEffect)(() => {
|
|
227
211
|
if (reportDateFilter) {
|
|
228
212
|
// Filter for custom date filter that applies to the report's dateField
|
|
229
|
-
const customDateFilter = filters?.find((f) => f.filterType === Filter_1.FilterType.Date
|
|
230
|
-
// FIXME: this is the correct way to do it but the demo has a hardcoded filter field
|
|
231
|
-
// && f.field === report?.dateField?.field && f.table === report?.dateField?.table,
|
|
232
|
-
);
|
|
213
|
+
const customDateFilter = filters?.find((f) => f.filterType === Filter_1.FilterType.Date);
|
|
233
214
|
if (!customDateFilter) {
|
|
234
215
|
return;
|
|
235
216
|
}
|
|
@@ -348,8 +329,8 @@ function InternalChart({ report, colors, className, containerStyle, isAnimationA
|
|
|
348
329
|
const handleResize = () => {
|
|
349
330
|
measureItems();
|
|
350
331
|
};
|
|
351
|
-
window.addEventListener(
|
|
352
|
-
return () => window.removeEventListener(
|
|
332
|
+
window.addEventListener('resize', handleResize);
|
|
333
|
+
return () => window.removeEventListener('resize', handleResize);
|
|
353
334
|
}, [currentReportFilters, filtersEnabled, layoutChanged]);
|
|
354
335
|
if (error) {
|
|
355
336
|
return ((0, jsx_runtime_1.jsx)("div", { style: containerStyle, className: className, children: (0, jsx_runtime_1.jsx)(ChartError_1.default, { errorMessage: error }) }));
|
|
@@ -407,7 +388,9 @@ function InternalChart({ report, colors, className, containerStyle, isAnimationA
|
|
|
407
388
|
// If filters are expanded, show all filters, otherwise show only the first row
|
|
408
389
|
maxHeight: filtersExpanded ? undefined : 108,
|
|
409
390
|
minWidth: 500,
|
|
410
|
-
paddingBottom: !filtersExpanded && filtersOverflowing && filtersEnabled
|
|
391
|
+
paddingBottom: !filtersExpanded && filtersOverflowing && filtersEnabled
|
|
392
|
+
? 116
|
|
393
|
+
: 0,
|
|
411
394
|
position: 'relative',
|
|
412
395
|
}, children: [filtersEnabled &&
|
|
413
396
|
currentReportFilters.map((filter, index) => ((0, jsx_runtime_1.jsx)(DashboardFilter_1.DashboardFilter, { filter: {
|
|
@@ -418,7 +401,9 @@ function InternalChart({ report, colors, className, containerStyle, isAnimationA
|
|
|
418
401
|
...filterValues[filter.filter.label],
|
|
419
402
|
}, isLoading: filter.loading, onChangeFilter: updateFilter, theme: theme, SelectComponent: SelectComponent, MultiSelectComponent: MultiSelectComponent, DateRangePickerComponent: DateRangePickerComponent, disabled: !filtersEnabled, containerStyle: {
|
|
420
403
|
// display: !filtersExpanded && visibleFilters[index] ? 'none' : 'inline',
|
|
421
|
-
visibility: !filtersExpanded && visibleFilters[index]
|
|
404
|
+
visibility: !filtersExpanded && visibleFilters[index]
|
|
405
|
+
? 'hidden'
|
|
406
|
+
: 'visible',
|
|
422
407
|
} }, index))), filtersOverflowing && filtersEnabled && ((0, jsx_runtime_1.jsx)("div", { style: {
|
|
423
408
|
width: '100%',
|
|
424
409
|
position: filtersExpanded ? 'static' : 'absolute',
|
|
@@ -467,9 +452,21 @@ function InternalChart({ report, colors, className, containerStyle, isAnimationA
|
|
|
467
452
|
display: 'flex',
|
|
468
453
|
}, children: (0, jsx_runtime_1.jsx)(MetricComponent, { error: error, isLoading: loading, report: report, children: report?.rows?.[0]?.[report.xAxisField] }) })), report.chartType !== 'table' && report.chartType !== 'metric' && ((0, jsx_runtime_1.jsx)(Chart_1.ChartDisplay, { config: report, containerStyle: {
|
|
469
454
|
minHeight: 300,
|
|
470
|
-
width: ['US map', 'World map'].includes(report.chartType)
|
|
471
|
-
|
|
472
|
-
|
|
473
|
-
|
|
455
|
+
width: ['US map', 'World map'].includes(report.chartType)
|
|
456
|
+
? '70%'
|
|
457
|
+
: ['gauge'].includes(report.chartType)
|
|
458
|
+
? undefined
|
|
459
|
+
: '100%',
|
|
460
|
+
height: ['US map', 'World map'].includes(report.chartType)
|
|
461
|
+
? 'fit-content'
|
|
462
|
+
: ['gauge'].includes(report.chartType)
|
|
463
|
+
? 500
|
|
464
|
+
: undefined,
|
|
465
|
+
marginLeft: ['gauge'].includes(report.chartType)
|
|
466
|
+
? 'undefined'
|
|
467
|
+
: 'auto',
|
|
468
|
+
marginRight: ['gauge'].includes(report.chartType)
|
|
469
|
+
? 'undefined'
|
|
470
|
+
: 'auto',
|
|
474
471
|
}, reportId: report.id, colors: colors, className: className, hideXAxis: hideXAxis, hideYAxis: hideYAxis, hideCartesianGrid: hideCartesianGrid, hideHorizontalCartesianGrid: hideHorizontalCartesianGrid, hideVerticalCartesianGrid: hideVerticalCartesianGrid, hideSubsequentXAxisTicks: hideSubsequentXAxisTicks, cartesianGridLineStyle: cartesianGridLineStyle, cartesianGridLineColor: cartesianGridLineColor, hideDateRangeFilter: hideDateRangeFilter, comparisonLineStyle: comparisonLineStyle, isAnimationActive: isAnimationActive, loading: loading, scrollable: true, colorMap: colorMap, LoadingComponent: LoadingComponent, onClickChartElement: onClickChartElement, referenceLines: report.referenceLineYValues }))] }))] }));
|
|
475
472
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LineChart.d.ts","sourceRoot":"","sources":["../../../../src/components/Chart/LineChart.tsx"],"names":[],"mappings":"AAeA,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,aAAa,CAAC;AAEhD,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AA4B7C,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAChC,MAAM,EACN,QAAa,EACb,WAAW,EACX,IAAI,EACJ,cAAc,EACd,SAAS,EACT,UAAU,EACV,WAAW,EACX,KAAK,EACL,UAAU,EACV,iBAAwB,EACxB,SAAiB,EACjB,SAAiB,EACjB,iBAAyB,EACzB,2BAAmC,EACnC,yBAAgC,EAChC,wBAAgC,EAChC,sBAAgC,EAChC,mBAA6B,EAC7B,sBAAsB,EACtB,mBAA8B,EAC9B,UAAU,EACV,cAAc,GACf,EAAE;IACD,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB,QAAQ,CAAC,EAAE,YAAY,CAAC;IACxB,WAAW,EAAE,GAAG,EAAE,CAAC;IACnB,IAAI,EAAE,GAAG,EAAE,CAAC;IACZ,cAAc,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IACrC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,EAAE,UAAU,CAAC;IACxB,KAAK,EAAE,GAAG,CAAC;IACX,UAAU,EAAE,GAAG,CAAC;IAChB,iBAAiB,EAAE,OAAO,CAAC;IAC3B,SAAS,EAAE,OAAO,CAAC;IACnB,SAAS,EAAE,OAAO,CAAC;IACnB,iBAAiB,EAAE,OAAO,CAAC;IAC3B,2BAA2B,EAAE,OAAO,CAAC;IACrC,yBAAyB,EAAE,OAAO,CAAC;IACnC,wBAAwB,EAAE,OAAO,CAAC;IAClC,sBAAsB,EAAE,OAAO,GAAG,QAAQ,CAAC;IAC3C,mBAAmB,EAAE,OAAO,GAAG,QAAQ,CAAC;IACxC,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,mBAAmB,CAAC,EAAE,CAAC,CAAC,EAAE,GAAG,KAAK,IAAI,CAAC;IACvC,UAAU,CAAC,EAAE,GAAG,CAAC;IACjB,cAAc,CAAC,EAAE;
|
|
1
|
+
{"version":3,"file":"LineChart.d.ts","sourceRoot":"","sources":["../../../../src/components/Chart/LineChart.tsx"],"names":[],"mappings":"AAeA,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,aAAa,CAAC;AAEhD,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AA4B7C,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAChC,MAAM,EACN,QAAa,EACb,WAAW,EACX,IAAI,EACJ,cAAc,EACd,SAAS,EACT,UAAU,EACV,WAAW,EACX,KAAK,EACL,UAAU,EACV,iBAAwB,EACxB,SAAiB,EACjB,SAAiB,EACjB,iBAAyB,EACzB,2BAAmC,EACnC,yBAAgC,EAChC,wBAAgC,EAChC,sBAAgC,EAChC,mBAA6B,EAC7B,sBAAsB,EACtB,mBAA8B,EAC9B,UAAU,EACV,cAAc,GACf,EAAE;IACD,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB,QAAQ,CAAC,EAAE,YAAY,CAAC;IACxB,WAAW,EAAE,GAAG,EAAE,CAAC;IACnB,IAAI,EAAE,GAAG,EAAE,CAAC;IACZ,cAAc,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IACrC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,EAAE,UAAU,CAAC;IACxB,KAAK,EAAE,GAAG,CAAC;IACX,UAAU,EAAE,GAAG,CAAC;IAChB,iBAAiB,EAAE,OAAO,CAAC;IAC3B,SAAS,EAAE,OAAO,CAAC;IACnB,SAAS,EAAE,OAAO,CAAC;IACnB,iBAAiB,EAAE,OAAO,CAAC;IAC3B,2BAA2B,EAAE,OAAO,CAAC;IACrC,yBAAyB,EAAE,OAAO,CAAC;IACnC,wBAAwB,EAAE,OAAO,CAAC;IAClC,sBAAsB,EAAE,OAAO,GAAG,QAAQ,CAAC;IAC3C,mBAAmB,EAAE,OAAO,GAAG,QAAQ,CAAC;IACxC,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,mBAAmB,CAAC,EAAE,CAAC,CAAC,EAAE,GAAG,KAAK,IAAI,CAAC;IACvC,UAAU,CAAC,EAAE,GAAG,CAAC;IACjB,cAAc,CAAC,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,EAAE,CAAA;KAAE,EAAE,CAAC;CACvD,2CAySA"}
|
|
@@ -166,7 +166,9 @@ function LineChart({ colors, colorMap = {}, yAxisFields, data, containerStyle, c
|
|
|
166
166
|
const gradientStop = getCustomColor(index, elem.field, 'stop') ?? '#00000000';
|
|
167
167
|
const uniqueId = `gradient_${(0, crypto_1.hashCode)(gradientStart)}_${(0, crypto_1.hashCode)(gradientStop)}`;
|
|
168
168
|
return ((0, jsx_runtime_1.jsx)("defs", { children: (0, jsx_runtime_1.jsxs)("linearGradient", { id: uniqueId, x1: "0", y1: "0", x2: "0", y2: "1", children: [(0, jsx_runtime_1.jsx)("stop", { offset: "5%", stopColor: gradientStart, stopOpacity: 0.4 }), (0, jsx_runtime_1.jsx)("stop", { offset: "95%", stopColor: gradientStop, stopOpacity: 0 })] }) }, `defs_${uniqueId}_${index}`));
|
|
169
|
-
}), referenceLines &&
|
|
169
|
+
}), referenceLines &&
|
|
170
|
+
Array.isArray(referenceLines) &&
|
|
171
|
+
referenceLines.map(({ label, query }) => ((0, jsx_runtime_1.jsx)(recharts_1.Customized, { component: (props) => ((0, jsx_runtime_1.jsx)(CustomReferenceLine_1.default, { ...props, referenceLine: query, label: label })) }, label))), yAxisFields &&
|
|
170
172
|
yAxisFields.map((elem, index) => {
|
|
171
173
|
const gradientStart = (0, crypto_1.hashCode)(getCustomColor(index, elem.field, 'start') ??
|
|
172
174
|
getCustomColor(index, elem.field) ??
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { QuillTheme } from
|
|
2
|
-
import { AxisFormat } from
|
|
3
|
-
import { ColorMapType } from
|
|
1
|
+
import { QuillTheme } from '../../QuillProvider';
|
|
2
|
+
import { AxisFormat } from '../../Dashboard';
|
|
3
|
+
import { ColorMapType } from '../../Chart';
|
|
4
4
|
export declare function USMap({ theme, data, xAxisField, xAxisFormat, yAxisFields, onClickChartElement, colors, colorMap, className, containerStyle, }: {
|
|
5
5
|
theme: QuillTheme | null;
|
|
6
6
|
data: any[];
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MapChart.d.ts","sourceRoot":"","sources":["../../../../src/components/Chart/MapChart.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"MapChart.d.ts","sourceRoot":"","sources":["../../../../src/components/Chart/MapChart.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AACjD,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAG7C,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AA+T3C,wBAAgB,KAAK,CAAC,EACpB,KAAK,EACL,IAAI,EACJ,UAAU,EACV,WAAW,EACX,WAAW,EACX,mBAAmB,EACnB,MAAM,EACN,QAAQ,EACR,SAAS,EACT,cAAc,GACf,EAAE;IACD,KAAK,EAAE,UAAU,GAAG,IAAI,CAAC;IACzB,IAAI,EAAE,GAAG,EAAE,CAAC;IACZ,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,EAAE,UAAU,CAAC;IACxB,WAAW,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,UAAU,CAAA;KAAE,EAAE,CAAC;IACpE,mBAAmB,CAAC,EAAE,CAAC,IAAI,EAAE,GAAG,KAAK,IAAI,CAAC;IAC1C,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB,QAAQ,CAAC,EAAE,YAAY,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CACtC,2CAsLA;AAED,wBAAgB,QAAQ,CAAC,EACvB,KAAK,EACL,IAAI,EACJ,UAAU,EACV,WAAW,EACX,WAAW,EACX,mBAAmB,EACnB,MAAM,EACN,QAAQ,EACR,SAAS,EACT,cAAc,GACf,EAAE;IACD,KAAK,EAAE,UAAU,GAAG,IAAI,CAAC;IACzB,IAAI,EAAE,GAAG,EAAE,CAAC;IACZ,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,EAAE,UAAU,CAAC;IACxB,WAAW,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,UAAU,CAAA;KAAE,EAAE,CAAC;IACpE,mBAAmB,CAAC,EAAE,CAAC,IAAI,EAAE,GAAG,KAAK,IAAI,CAAC;IAC1C,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB,QAAQ,CAAC,EAAE,YAAY,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CACtC,2CAuLA"}
|