@hisptz/dhis2-analytics 2.0.3 → 2.0.4
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/components/ChartAnalytics/DHIS2Chart.js +7 -2
- package/dist/components/ChartAnalytics/DHIS2Chart.js.map +1 -1
- package/dist/esm/components/ChartAnalytics/DHIS2Chart.js +7 -2
- package/dist/esm/components/ChartAnalytics/DHIS2Chart.js.map +1 -1
- package/dist/types/components/ChartAnalytics/DHIS2Chart.d.ts +3 -3
- package/dist/types/components/ChartAnalytics/DHIS2Chart.d.ts.map +1 -1
- package/dist/types/components/ChartAnalytics/types/props.d.ts +2 -0
- package/dist/types/components/ChartAnalytics/types/props.d.ts.map +1 -1
- package/package.json +5 -5
|
@@ -16,7 +16,12 @@ function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
|
16
16
|
var HighCharts__default = /*#__PURE__*/_interopDefault(HighCharts);
|
|
17
17
|
var HighchartsReact__default = /*#__PURE__*/_interopDefault(HighchartsReact);
|
|
18
18
|
|
|
19
|
-
function ChartAnalyticsComponent({
|
|
19
|
+
function ChartAnalyticsComponent({
|
|
20
|
+
analytics,
|
|
21
|
+
config,
|
|
22
|
+
containerProps,
|
|
23
|
+
setRef
|
|
24
|
+
}) {
|
|
20
25
|
const id = react.useRef(`${dhis2Utils.uid()}-chart-item`);
|
|
21
26
|
const { chart } = useChart_js.useChart({ id: id.current, analytics, config });
|
|
22
27
|
if (!chart) {
|
|
@@ -26,7 +31,7 @@ function ChartAnalyticsComponent({ analytics, config, containerProps }, ref) {
|
|
|
26
31
|
HighchartsReact__default.default,
|
|
27
32
|
{
|
|
28
33
|
immutable: true,
|
|
29
|
-
ref,
|
|
34
|
+
ref: setRef,
|
|
30
35
|
containerProps: { id: id.current, ...containerProps ?? {} },
|
|
31
36
|
highcharts: HighCharts__default.default,
|
|
32
37
|
options: { ...chart }
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/ChartAnalytics/DHIS2Chart.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"sources":["../../../src/components/ChartAnalytics/DHIS2Chart.tsx"],"names":[],"mappings":"AAyBE;AAzBF,SAAS,WAAW;AACpB,OAAO,gBAAgB;AACvB,OAAO,qBAAqB;AAC5B,SAAgB,YAAY,cAAc;AAC1C,SAAS,gBAAgB;AACzB,OAAO;AAGP,cAAc;AACd,cAAc;AACd,cAAc;AAEd,SAAS,wBAAwB;AAAA,EAChC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAwB;AACvB,QAAM,KAAK,OAAO,GAAG,IAAI,CAAC,aAAa;AACvC,QAAM,EAAE,MAAM,IAAI,SAAS,EAAE,IAAI,GAAG,SAAS,WAAW,OAAO,CAAC;AAEhE,MAAI,CAAC,OAAO;AACX,WAAO;AAAA,EACR;AACA,SACC;AAAA,IAAC;AAAA;AAAA,MACA,WAAS;AAAA,MACT,KAAK;AAAA,MACL,gBAAgB,EAAE,IAAI,GAAG,SAAS,GAAI,kBAAkB,CAAC,EAAG;AAAA,MAC5D,YAAY;AAAA,MACZ,SAAS,EAAE,GAAG,MAAM;AAAA;AAAA,EACrB;AAEF;AAgBO,MAAM,aACZ;AAAA,EACC;AACD;AAKM,MAAM,iBAAiB","sourcesContent":["import { uid } from \"@hisptz/dhis2-utils\";\nimport HighCharts from \"highcharts\";\nimport HighchartsReact from \"highcharts-react-official\";\nimport React, { forwardRef, useRef } from \"react\";\nimport { useChart } from \"./hooks/useChart.js\";\nimport \"./styles/custom-highchart.css\";\nimport { ChartAnalyticsProps } from \"./types/props.js\";\n\nexport * from \"./services/export.js\";\nexport * from \"./types/props.js\";\nexport * from \"./components/DownloadMenu/index.js\";\n\nfunction ChartAnalyticsComponent({\n\tanalytics,\n\tconfig,\n\tcontainerProps,\n\tsetRef,\n}: ChartAnalyticsProps) {\n\tconst id = useRef(`${uid()}-chart-item`);\n\tconst { chart } = useChart({ id: id.current, analytics, config });\n\n\tif (!chart) {\n\t\treturn null;\n\t}\n\treturn (\n\t\t<HighchartsReact\n\t\t\timmutable\n\t\t\tref={setRef}\n\t\t\tcontainerProps={{ id: id.current, ...(containerProps ?? {}) }}\n\t\t\thighcharts={HighCharts}\n\t\t\toptions={{ ...chart }}\n\t\t/>\n\t);\n}\n\n/**\n * The `DHIS2Chart` component allows you to render a chart visualization from DHIS2 analytics data.\n * It accepts the DHIS2 analytics payload as well as configuration on how to visualize the data.\n *\n * @component\n *\n * @param {ChartAnalyticsProps} props\n * @param {Analytics} [props.analytics] - Analytics data from DHIS2\n * @param {ChartConfig} [props.config] - Visualization configuration. See stories for more information\n * @param {Record<string, any>} [props.containerProps] - Props that will be passed to the chart container\n * @param {forwardRef} forwardRef - A function that creates a higher order component that forwards the ref through the component tree.\n *\n * @returns {React.ForwardRefExoticComponent<ChartAnalyticsProps>} - The DHIS2 chart component with forward ref support.\n */\nexport const DHIS2Chart: React.ForwardRefExoticComponent<ChartAnalyticsProps> =\n\tforwardRef<HighchartsReact.RefObject, ChartAnalyticsProps>(\n\t\tChartAnalyticsComponent,\n\t);\n\n/**\n * @deprecated since `v2`. Use `DHIS2Chart` instead\n * */\nexport const ChartAnalytics = DHIS2Chart;\n"]}
|
|
@@ -9,7 +9,12 @@ export * from './services/export.js';
|
|
|
9
9
|
export * from './types/props.js';
|
|
10
10
|
export * from './components/DownloadMenu/index.js';
|
|
11
11
|
|
|
12
|
-
function ChartAnalyticsComponent({
|
|
12
|
+
function ChartAnalyticsComponent({
|
|
13
|
+
analytics,
|
|
14
|
+
config,
|
|
15
|
+
containerProps,
|
|
16
|
+
setRef
|
|
17
|
+
}) {
|
|
13
18
|
const id = useRef(`${uid()}-chart-item`);
|
|
14
19
|
const { chart } = useChart({ id: id.current, analytics, config });
|
|
15
20
|
if (!chart) {
|
|
@@ -19,7 +24,7 @@ function ChartAnalyticsComponent({ analytics, config, containerProps }, ref) {
|
|
|
19
24
|
HighchartsReact,
|
|
20
25
|
{
|
|
21
26
|
immutable: true,
|
|
22
|
-
ref,
|
|
27
|
+
ref: setRef,
|
|
23
28
|
containerProps: { id: id.current, ...containerProps ?? {} },
|
|
24
29
|
highcharts: HighCharts,
|
|
25
30
|
options: { ...chart }
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/ChartAnalytics/DHIS2Chart.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/ChartAnalytics/DHIS2Chart.tsx"],"names":[],"mappings":"AAyBE;AAzBF,SAAS,WAAW;AACpB,OAAO,gBAAgB;AACvB,OAAO,qBAAqB;AAC5B,SAAgB,YAAY,cAAc;AAC1C,SAAS,gBAAgB;AACzB,OAAO;AAGP,cAAc;AACd,cAAc;AACd,cAAc;AAEd,SAAS,wBAAwB;AAAA,EAChC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAwB;AACvB,QAAM,KAAK,OAAO,GAAG,IAAI,CAAC,aAAa;AACvC,QAAM,EAAE,MAAM,IAAI,SAAS,EAAE,IAAI,GAAG,SAAS,WAAW,OAAO,CAAC;AAEhE,MAAI,CAAC,OAAO;AACX,WAAO;AAAA,EACR;AACA,SACC;AAAA,IAAC;AAAA;AAAA,MACA,WAAS;AAAA,MACT,KAAK;AAAA,MACL,gBAAgB,EAAE,IAAI,GAAG,SAAS,GAAI,kBAAkB,CAAC,EAAG;AAAA,MAC5D,YAAY;AAAA,MACZ,SAAS,EAAE,GAAG,MAAM;AAAA;AAAA,EACrB;AAEF;AAgBO,MAAM,aACZ;AAAA,EACC;AACD;AAKM,MAAM,iBAAiB","sourcesContent":["import { uid } from \"@hisptz/dhis2-utils\";\nimport HighCharts from \"highcharts\";\nimport HighchartsReact from \"highcharts-react-official\";\nimport React, { forwardRef, useRef } from \"react\";\nimport { useChart } from \"./hooks/useChart.js\";\nimport \"./styles/custom-highchart.css\";\nimport { ChartAnalyticsProps } from \"./types/props.js\";\n\nexport * from \"./services/export.js\";\nexport * from \"./types/props.js\";\nexport * from \"./components/DownloadMenu/index.js\";\n\nfunction ChartAnalyticsComponent({\n\tanalytics,\n\tconfig,\n\tcontainerProps,\n\tsetRef,\n}: ChartAnalyticsProps) {\n\tconst id = useRef(`${uid()}-chart-item`);\n\tconst { chart } = useChart({ id: id.current, analytics, config });\n\n\tif (!chart) {\n\t\treturn null;\n\t}\n\treturn (\n\t\t<HighchartsReact\n\t\t\timmutable\n\t\t\tref={setRef}\n\t\t\tcontainerProps={{ id: id.current, ...(containerProps ?? {}) }}\n\t\t\thighcharts={HighCharts}\n\t\t\toptions={{ ...chart }}\n\t\t/>\n\t);\n}\n\n/**\n * The `DHIS2Chart` component allows you to render a chart visualization from DHIS2 analytics data.\n * It accepts the DHIS2 analytics payload as well as configuration on how to visualize the data.\n *\n * @component\n *\n * @param {ChartAnalyticsProps} props\n * @param {Analytics} [props.analytics] - Analytics data from DHIS2\n * @param {ChartConfig} [props.config] - Visualization configuration. See stories for more information\n * @param {Record<string, any>} [props.containerProps] - Props that will be passed to the chart container\n * @param {forwardRef} forwardRef - A function that creates a higher order component that forwards the ref through the component tree.\n *\n * @returns {React.ForwardRefExoticComponent<ChartAnalyticsProps>} - The DHIS2 chart component with forward ref support.\n */\nexport const DHIS2Chart: React.ForwardRefExoticComponent<ChartAnalyticsProps> =\n\tforwardRef<HighchartsReact.RefObject, ChartAnalyticsProps>(\n\t\tChartAnalyticsComponent,\n\t);\n\n/**\n * @deprecated since `v2`. Use `DHIS2Chart` instead\n * */\nexport const ChartAnalytics = DHIS2Chart;\n"]}
|
|
@@ -16,11 +16,11 @@ export * from "./components/DownloadMenu/index.js";
|
|
|
16
16
|
* @param {Record<string, any>} [props.containerProps] - Props that will be passed to the chart container
|
|
17
17
|
* @param {forwardRef} forwardRef - A function that creates a higher order component that forwards the ref through the component tree.
|
|
18
18
|
*
|
|
19
|
-
* @returns {React.
|
|
19
|
+
* @returns {React.ForwardRefExoticComponent<ChartAnalyticsProps>} - The DHIS2 chart component with forward ref support.
|
|
20
20
|
*/
|
|
21
|
-
export declare const DHIS2Chart: React.
|
|
21
|
+
export declare const DHIS2Chart: React.ForwardRefExoticComponent<ChartAnalyticsProps>;
|
|
22
22
|
/**
|
|
23
23
|
* @deprecated since `v2`. Use `DHIS2Chart` instead
|
|
24
24
|
* */
|
|
25
|
-
export declare const ChartAnalytics: React.
|
|
25
|
+
export declare const ChartAnalytics: React.ForwardRefExoticComponent<ChartAnalyticsProps>;
|
|
26
26
|
//# sourceMappingURL=DHIS2Chart.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DHIS2Chart.d.ts","sourceRoot":"","sources":["../../../../src/components/ChartAnalytics/DHIS2Chart.tsx"],"names":[],"mappings":"AAGA,OAAO,KAA6B,MAAM,OAAO,CAAC;AAElD,OAAO,+BAA+B,CAAC;AACvC,OAAO,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AAEvD,cAAc,sBAAsB,CAAC;AACrC,cAAc,kBAAkB,CAAC;AACjC,cAAc,oCAAoC,CAAC;
|
|
1
|
+
{"version":3,"file":"DHIS2Chart.d.ts","sourceRoot":"","sources":["../../../../src/components/ChartAnalytics/DHIS2Chart.tsx"],"names":[],"mappings":"AAGA,OAAO,KAA6B,MAAM,OAAO,CAAC;AAElD,OAAO,+BAA+B,CAAC;AACvC,OAAO,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AAEvD,cAAc,sBAAsB,CAAC;AACrC,cAAc,kBAAkB,CAAC;AACjC,cAAc,oCAAoC,CAAC;AAyBnD;;;;;;;;;;;;;GAaG;AACH,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,yBAAyB,CAAC,mBAAmB,CAG1E,CAAC;AAEH;;KAEK;AACL,eAAO,MAAM,cAAc,sDAAa,CAAC"}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import type { Analytics } from "@hisptz/dhis2-utils";
|
|
2
2
|
import HighCharts, { DashStyleValue, YAxisOptions, YAxisPlotLinesLabelOptions } from "highcharts";
|
|
3
|
+
import HighchartsReact from "highcharts-react-official";
|
|
3
4
|
export type ChartType = "column" | "pie" | "stacked-column" | "line" | "multi-series" | "bar" | "stacked-bar";
|
|
4
5
|
export interface MultiSeriesConfig {
|
|
5
6
|
series?: Array<{
|
|
@@ -39,6 +40,7 @@ export type ChartConfig = {
|
|
|
39
40
|
export type ChartAnalyticsProps = {
|
|
40
41
|
analytics: Analytics;
|
|
41
42
|
config: ChartConfig;
|
|
43
|
+
setRef?: (ref: HighchartsReact.RefObject) => void;
|
|
42
44
|
containerProps?: Record<string, any>;
|
|
43
45
|
};
|
|
44
46
|
//# sourceMappingURL=props.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../../../../src/components/ChartAnalytics/types/props.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,
|
|
1
|
+
{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../../../../src/components/ChartAnalytics/types/props.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAC;AACrD,OAAO,UAAU,EAAE,EAClB,cAAc,EACd,YAAY,EACZ,0BAA0B,EAC1B,MAAM,YAAY,CAAC;AACpB,OAAO,eAAe,MAAM,2BAA2B,CAAC;AAExD,MAAM,MAAM,SAAS,GAClB,QAAQ,GACR,KAAK,GACL,gBAAgB,GAChB,MAAM,GACN,cAAc,GACd,KAAK,GACL,aAAa,CAAC;AAEjB,MAAM,WAAW,iBAAiB;IACjC,MAAM,CAAC,EAAE,KAAK,CAAC;QACd,EAAE,EAAE,MAAM,CAAC;QACX,EAAE,EAAE,QAAQ,GAAG,MAAM,CAAC;QACtB,UAAU,CAAC,EAAE,OAAO,CAAC;QACrB,KAAK,CAAC,EAAE,MAAM,CAAC;KACf,CAAC,CAAC;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,CAAC;IAC5B,MAAM,CAAC,EAAE,YAAY,CAAC;CACtB;AAED,MAAM,WAAW,YAAY;IAC5B,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,0BAA0B,CAAC;IACnC,MAAM,EAAE;QACP,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,SAAS,CAAC,EAAE,cAAc,CAAC;QAC3B,MAAM,CAAC,EAAE,MAAM,CAAC;KAChB,CAAC;CACF;AAED,MAAM,MAAM,WAAW,GAAG;IACzB,MAAM,EAAE;QACP,MAAM,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;QACtB,QAAQ,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;QACxB,MAAM,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;KACtB,CAAC;IACF,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;IACvB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,kBAAkB,CAAC,EAChB,OAAO,CAAC,UAAU,CAAC,OAAO,CAAC,GAC3B,CAAC,CAAC,MAAM,EAAE,UAAU,CAAC,OAAO,KAAK,OAAO,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC,CAAC;IACjE,WAAW,CAAC,EAAE,iBAAiB,CAAC;CAChC,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG;IACjC,SAAS,EAAE,SAAS,CAAC;IACrB,MAAM,EAAE,WAAW,CAAC;IACpB,MAAM,CAAC,EAAE,CAAC,GAAG,EAAE,eAAe,CAAC,SAAS,KAAK,IAAI,CAAC;IAClD,cAAc,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;CACrC,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@hisptz/dhis2-analytics",
|
|
3
|
-
"version": "2.0.
|
|
3
|
+
"version": "2.0.4",
|
|
4
4
|
"main": "./dist/index.js",
|
|
5
5
|
"module": "./dist/esm/index.js",
|
|
6
6
|
"types": "./dist/types/index.d.ts",
|
|
@@ -36,8 +36,8 @@
|
|
|
36
36
|
"tsup": "^8.0.1",
|
|
37
37
|
"typescript": "^5.3.3",
|
|
38
38
|
"usehooks-ts": "^2.9.2",
|
|
39
|
-
"@repo/
|
|
40
|
-
"@repo/
|
|
39
|
+
"@repo/typescript-config": "0.0.0",
|
|
40
|
+
"@repo/eslint-config": "0.0.0"
|
|
41
41
|
},
|
|
42
42
|
"dependencies": {
|
|
43
43
|
"@react-leaflet/core": "^2.1.0",
|
|
@@ -55,8 +55,8 @@
|
|
|
55
55
|
"react-query": "^3.39.3",
|
|
56
56
|
"react-spring": "^9.6.1",
|
|
57
57
|
"screenfull": "^6.0.2",
|
|
58
|
-
"@hisptz/dhis2-
|
|
59
|
-
"@hisptz/dhis2-
|
|
58
|
+
"@hisptz/dhis2-ui": "2.0.4",
|
|
59
|
+
"@hisptz/dhis2-utils": "2.0.4"
|
|
60
60
|
},
|
|
61
61
|
"peerDependencies": {
|
|
62
62
|
"@dhis2/app-runtime": "^3.10.2",
|