@hisptz/dhis2-analytics 2.0.14 → 2.0.16

package/dist/esm/components/Scorecard/components/ScorecardTable/components/FurtherAnalysisMenu.js

@@ -0,0 +1,146 @@
+import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
+import { useMemo, useState } from 'react';
+import { Popover, Menu, MenuItem, IconVisualizationColumnStacked16, IconDimensionOrgUnit16, IconVisualizationLine24, IconVisualizationColumnStacked24 } from '@dhis2/ui';
+import i18n from '@dhis2/d2-i18n';
+import { useLowestOrgUnitLevel } from '../../../hooks/orgUnit';
+import { getOrgUnitLevel } from '../../../utils/orgUnits';
+
+function FurtherAnalysisMenu({
+  stateActionRef,
+  setStateActionRef,
+  orgUnit,
+  onSelect,
+  periodId,
+  dataSources
+}) {
+  const lowestLevel = useLowestOrgUnitLevel();
+  const orgUnitInLowestLevel = useMemo(() => {
+    return getOrgUnitLevel(orgUnit) === lowestLevel?.level;
+  }, [lowestLevel, orgUnit]);
+  const [showSubMenu, setShowSubMenu] = useState(false);
+  return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(
+    Popover,
+    {
+      onClickOutside: () => setStateActionRef(void 0),
+      placement: "bottom-start",
+      reference: stateActionRef,
+      children: /* @__PURE__ */ jsxs(Menu, { children: [
+        /* @__PURE__ */ jsx(
+          MenuItem,
+          {
+            dense: true,
+            onClick: () => {
+              onSelect({
+                periodSelection: {
+                  periods: [
+                    {
+                      id: periodId
+                    }
+                  ]
+                },
+                orgUnitSelection: {
+                  levels: [],
+                  groups: [],
+                  orgUnits: [
+                    {
+                      id: orgUnit.uid
+                    }
+                  ]
+                },
+                dataSources
+              });
+              setStateActionRef(void 0);
+            },
+            label: i18n.t("Further Analysis"),
+            icon: /* @__PURE__ */ jsx(IconVisualizationColumnStacked16, {})
+          }
+        ),
+        !orgUnitInLowestLevel && /* @__PURE__ */ jsx(
+          MenuItem,
+          {
+            dense: true,
+            onClick: () => {
+              setStateActionRef(void 0);
+            },
+            label: i18n.t("Lower Organisation Unit Levels"),
+            icon: /* @__PURE__ */ jsx(IconDimensionOrgUnit16, {})
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          MenuItem,
+          {
+            dense: true,
+            showSubMenu,
+            active: showSubMenu,
+            toggleSubMenu: () => {
+              setShowSubMenu((prevState) => !prevState);
+            },
+            label: i18n.t("Trend Analysis "),
+            icon: /* @__PURE__ */ jsx(IconVisualizationLine24, {}),
+            children: [
+              /* @__PURE__ */ jsx(
+                MenuItem,
+                {
+                  dense: true,
+                  onClick: () => {
+                    setStateActionRef(void 0);
+                  },
+                  label: i18n.t("Last 3 Months"),
+                  icon: /* @__PURE__ */ jsx(IconVisualizationColumnStacked24, {})
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                MenuItem,
+                {
+                  dense: true,
+                  onClick: () => {
+                    setStateActionRef(void 0);
+                  },
+                  label: i18n.t("Last 6 Months"),
+                  icon: /* @__PURE__ */ jsx(IconVisualizationColumnStacked24, {})
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                MenuItem,
+                {
+                  dense: true,
+                  onClick: () => {
+                    setStateActionRef(void 0);
+                  },
+                  label: i18n.t("Last 12 Months"),
+                  icon: /* @__PURE__ */ jsx(IconVisualizationColumnStacked24, {})
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                MenuItem,
+                {
+                  dense: true,
+                  onClick: () => {
+                    setStateActionRef(void 0);
+                  },
+                  label: i18n.t("Last 4 Quarters"),
+                  icon: /* @__PURE__ */ jsx(IconVisualizationColumnStacked24, {})
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                MenuItem,
+                {
+                  dense: true,
+                  onClick: () => {
+                    setStateActionRef(void 0);
+                  },
+                  label: i18n.t("Last 5 Years"),
+                  icon: /* @__PURE__ */ jsx(IconVisualizationColumnStacked24, {})
+                }
+              )
+            ]
+          }
+        )
+      ] })
+    }
+  ) });
+}
+
+export { FurtherAnalysisMenu };
+//# sourceMappingURL=out.js.map
+//# sourceMappingURL=FurtherAnalysisMenu.js.map

package/dist/esm/components/Scorecard/components/ScorecardTable/components/FurtherAnalysisMenu.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../../src/components/Scorecard/components/ScorecardTable/components/FurtherAnalysisMenu.tsx"],"names":[],"mappings":"AAyCE,mBAgCU,KAYP,YA5CH;AAzCF,SAAS,SAAS,gBAAgB;AAClC;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OAEM;AACP,OAAO,UAAU;AACjB,SAAS,6BAA6B;AAEtC,SAAS,uBAAuB;AAIzB,SAAS,oBAAoB;AAAA,EACnC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAOG;AACF,QAAM,cAAc,sBAAsB;AAE1C,QAAM,uBAAuB,QAAQ,MAAM;AAC1C,WAAO,gBAAgB,OAAO,MAAM,aAAa;AAAA,EAClD,GAAG,CAAC,aAAa,OAAO,CAAC;AAEzB,QAAM,CAAC,aAAa,cAAc,IAAI,SAAS,KAAK;AACpD,SACC,gCACC;AAAA,IAAC;AAAA;AAAA,MACA,gBAAgB,MAAM,kBAAkB,MAAS;AAAA,MACjD,WAAU;AAAA,MACV,WAAW;AAAA,MAEX,+BAAC,QACA;AAAA;AAAA,UAAC;AAAA;AAAA,YACA,OAAK;AAAA,YACL,SAAS,MAAM;AACd,uBAAS;AAAA,gBACR,iBAAiB;AAAA,kBAChB,SAAS;AAAA,oBACR;AAAA,sBACC,IAAI;AAAA,oBACL;AAAA,kBACD;AAAA,gBACD;AAAA,gBACA,kBAAkB;AAAA,kBACjB,QAAQ,CAAC;AAAA,kBACT,QAAQ,CAAC;AAAA,kBACT,UAAU;AAAA,oBACT;AAAA,sBACC,IAAI,QAAQ;AAAA,oBACb;AAAA,kBACD;AAAA,gBACD;AAAA,gBACA;AAAA,cACD,CAAC;AACD,gCAAkB,MAAS;AAAA,YAC5B;AAAA,YACA,OAAO,KAAK,EAAE,kBAAkB;AAAA,YAChC,MAAM,oBAAC,oCAAiC;AAAA;AAAA,QACzC;AAAA,QACC,CAAC,wBACD;AAAA,UAAC;AAAA;AAAA,YACA,OAAK;AAAA,YACL,SAAS,MAAM;AACd,gCAAkB,MAAS;AAAA,YAC5B;AAAA,YACA,OAAO,KAAK,EAAE,gCAAgC;AAAA,YAC9C,MAAM,oBAAC,0BAAuB;AAAA;AAAA,QAC/B;AAAA,QAED;AAAA,UAAC;AAAA;AAAA,YACA,OAAK;AAAA,YACL;AAAA,YACA,QAAQ;AAAA,YACR,eAAe,MAAM;AACpB,6BAAe,CAAC,cAAc,CAAC,SAAS;AAAA,YACzC;AAAA,YACA,OAAO,KAAK,EAAE,iBAAiB;AAAA,YAC/B,MAAM,oBAAC,2BAAwB;AAAA,YAE/B;AAAA;AAAA,gBAAC;AAAA;AAAA,kBACA,OAAK;AAAA,kBACL,SAAS,MAAM;AACd,sCAAkB,MAAS;AAAA,kBAC5B;AAAA,kBACA,OAAO,KAAK,EAAE,eAAe;AAAA,kBAC7B,MAAM,oBAAC,oCAAiC;AAAA;AAAA,cACzC;AAAA,cACA;AAAA,gBAAC;AAAA;AAAA,kBACA,OAAK;AAAA,kBACL,SAAS,MAAM;AACd,sCAAkB,MAAS;AAAA,kBAC5B;AAAA,kBACA,OAAO,KAAK,EAAE,eAAe;AAAA,kBAC7B,MAAM,oBAAC,oCAAiC;AAAA;AAAA,cACzC;AAAA,cACA;AAAA,gBAAC;AAAA;AAAA,kBACA,OAAK;AAAA,kBACL,SAAS,MAAM;AACd,sCAAkB,MAAS;AAAA,kBAC5B;AAAA,kBACA,OAAO,KAAK,EAAE,gBAAgB;AAAA,kBAC9B,MAAM,oBAAC,oCAAiC;AAAA;AAAA,cACzC;AAAA,cACA;AAAA,gBAAC;AAAA;AAAA,kBACA,OAAK;AAAA,kBACL,SAAS,MAAM;AACd,sCAAkB,MAAS;AAAA,kBAC5B;AAAA,kBACA,OAAO,KAAK,EAAE,iBAAiB;AAAA,kBAC/B,MAAM,oBAAC,oCAAiC;AAAA;AAAA,cACzC;AAAA,cACA;AAAA,gBAAC;AAAA;AAAA,kBACA,OAAK;AAAA,kBACL,SAAS,MAAM;AACd,sCAAkB,MAAS;AAAA,kBAC5B;AAAA,kBACA,OAAO,KAAK,EAAE,cAAc;AAAA,kBAC5B,MAAM,oBAAC,oCAAiC;AAAA;AAAA,cACzC;AAAA;AAAA;AAAA,QACD;AAAA,SACD;AAAA;AAAA,EACD,GACD;AAEF","sourcesContent":["import { useMemo, useState } from \"react\";\nimport {\n\tIconDimensionOrgUnit16,\n\tIconVisualizationColumnStacked16,\n\tIconVisualizationColumnStacked24,\n\tIconVisualizationLine24,\n\tMenu,\n\tMenuItem,\n\tPopover,\n\ttype ReferenceElement,\n} from \"@dhis2/ui\";\nimport i18n from \"@dhis2/d2-i18n\";\nimport { useLowestOrgUnitLevel } from \"../../../hooks/orgUnit\";\nimport type { ItemMeta } from \"../../../hooks/metadata\";\nimport { getOrgUnitLevel } from \"../../../utils/orgUnits\";\nimport type { FurtherAnalysisConfig } from \"./FurtherAnalysisModal\";\nimport type { ScorecardDataSource } from \"../../../schemas/config\";\n\nexport function FurtherAnalysisMenu({\n\tstateActionRef,\n\tsetStateActionRef,\n\torgUnit,\n\tonSelect,\n\tperiodId,\n\tdataSources,\n}: {\n\tstateActionRef: ReferenceElement;\n\tsetStateActionRef: (val: undefined) => void;\n\torgUnit: ItemMeta & { hierarchy: string };\n\tonSelect: (config: FurtherAnalysisConfig) => void;\n\tperiodId: string;\n\tdataSources: ScorecardDataSource[];\n}) {\n\tconst lowestLevel = useLowestOrgUnitLevel();\n\n\tconst orgUnitInLowestLevel = useMemo(() => {\n\t\treturn getOrgUnitLevel(orgUnit) === lowestLevel?.level;\n\t}, [lowestLevel, orgUnit]);\n\n\tconst [showSubMenu, setShowSubMenu] = useState(false);\n\treturn (\n\t\t<>\n\t\t\t<Popover\n\t\t\t\tonClickOutside={() => setStateActionRef(undefined)}\n\t\t\t\tplacement=\"bottom-start\"\n\t\t\t\treference={stateActionRef}\n\t\t\t>\n\t\t\t\t<Menu>\n\t\t\t\t\t<MenuItem\n\t\t\t\t\t\tdense\n\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\tonSelect({\n\t\t\t\t\t\t\t\tperiodSelection: {\n\t\t\t\t\t\t\t\t\tperiods: [\n\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\tid: periodId,\n\t\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\t],\n\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\torgUnitSelection: {\n\t\t\t\t\t\t\t\t\tlevels: [],\n\t\t\t\t\t\t\t\t\tgroups: [],\n\t\t\t\t\t\t\t\t\torgUnits: [\n\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\tid: orgUnit.uid,\n\t\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\t],\n\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\tdataSources,\n\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\tsetStateActionRef(undefined);\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tlabel={i18n.t(\"Further Analysis\")}\n\t\t\t\t\t\ticon={<IconVisualizationColumnStacked16 />}\n\t\t\t\t\t/>\n\t\t\t\t\t{!orgUnitInLowestLevel && (\n\t\t\t\t\t\t<MenuItem\n\t\t\t\t\t\t\tdense\n\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\tsetStateActionRef(undefined);\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tlabel={i18n.t(\"Lower Organisation Unit Levels\")}\n\t\t\t\t\t\t\ticon={<IconDimensionOrgUnit16 />}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t\t<MenuItem\n\t\t\t\t\t\tdense\n\t\t\t\t\t\tshowSubMenu={showSubMenu}\n\t\t\t\t\t\tactive={showSubMenu}\n\t\t\t\t\t\ttoggleSubMenu={() => {\n\t\t\t\t\t\t\tsetShowSubMenu((prevState) => !prevState);\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tlabel={i18n.t(\"Trend Analysis \")}\n\t\t\t\t\t\ticon={<IconVisualizationLine24 />}\n\t\t\t\t\t>\n\t\t\t\t\t\t<MenuItem\n\t\t\t\t\t\t\tdense\n\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\tsetStateActionRef(undefined);\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tlabel={i18n.t(\"Last 3 Months\")}\n\t\t\t\t\t\t\ticon={<IconVisualizationColumnStacked24 />}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<MenuItem\n\t\t\t\t\t\t\tdense\n\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\tsetStateActionRef(undefined);\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tlabel={i18n.t(\"Last 6 Months\")}\n\t\t\t\t\t\t\ticon={<IconVisualizationColumnStacked24 />}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<MenuItem\n\t\t\t\t\t\t\tdense\n\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\tsetStateActionRef(undefined);\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tlabel={i18n.t(\"Last 12 Months\")}\n\t\t\t\t\t\t\ticon={<IconVisualizationColumnStacked24 />}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<MenuItem\n\t\t\t\t\t\t\tdense\n\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\tsetStateActionRef(undefined);\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tlabel={i18n.t(\"Last 4 Quarters\")}\n\t\t\t\t\t\t\ticon={<IconVisualizationColumnStacked24 />}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<MenuItem\n\t\t\t\t\t\t\tdense\n\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\tsetStateActionRef(undefined);\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tlabel={i18n.t(\"Last 5 Years\")}\n\t\t\t\t\t\t\ticon={<IconVisualizationColumnStacked24 />}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</MenuItem>\n\t\t\t\t</Menu>\n\t\t\t</Popover>\n\t\t</>\n\t);\n}\n"]}

package/dist/esm/components/Scorecard/components/ScorecardTable/components/FurtherAnalysisModal.js

@@ -0,0 +1,52 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { Modal, ModalTitle, ModalContent, ModalActions, Button } from '@dhis2/ui';
+import i18n from '@dhis2/d2-i18n';
+import { useState } from 'react';
+import { FurtherAnalysisVisualization } from '../FurtherAnalysisVisualization';
+import { FurtherAnalysisDictionary } from '../FurtherAnalysisDictionary';
+
+function FurtherAnalysis({
+  hide,
+  onClose,
+  config
+}) {
+  const [activeElement, setActiveElement] = useState("visualization");
+  return /* @__PURE__ */ jsxs(Modal, { onClose, hide, large: true, position: "middle", children: [
+    /* @__PURE__ */ jsx(ModalTitle, { children: i18n.t("Further Analysis") }),
+    /* @__PURE__ */ jsx(ModalContent, { children: /* @__PURE__ */ jsx(
+      "div",
+      {
+        style: {
+          width: "100%",
+          height: "100%",
+          flexDirection: "column",
+          display: "flex"
+        },
+        children: /* @__PURE__ */ jsxs(
+          "div",
+          {
+            style: {
+              flex: 1,
+              width: "100%",
+              height: "100%"
+            },
+            children: [
+              activeElement === "dictionary" && /* @__PURE__ */ jsx(
+                FurtherAnalysisDictionary,
+                {
+                  config
+                }
+              ),
+              activeElement === "visualization" && /* @__PURE__ */ jsx(FurtherAnalysisVisualization, { config })
+            ]
+          }
+        )
+      }
+    ) }),
+    /* @__PURE__ */ jsx(ModalActions, { children: /* @__PURE__ */ jsx(Button, { onClick: onClose, children: i18n.t("Close") }) })
+  ] });
+}
+
+export { FurtherAnalysis };
+//# sourceMappingURL=out.js.map
+//# sourceMappingURL=FurtherAnalysisModal.js.map

package/dist/esm/components/Scorecard/components/ScorecardTable/components/FurtherAnalysisModal.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../../src/components/Scorecard/components/ScorecardTable/components/FurtherAnalysisModal.tsx"],"names":[],"mappings":"AAwCG,cA4BE,YA5BF;AAnCH;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACM;AACP,OAAO,UAAU;AACjB,SAAS,gBAAgB;AACzB,SAAS,oCAAoC;AAC7C,SAAS,iCAAiC;AAcnC,SAAS,gBAAgB;AAAA,EAC/B;AAAA,EACA;AAAA,EACA;AACD,GAAyB;AACxB,QAAM,CAAC,eAAe,gBAAgB,IAAI,SAExC,eAAe;AAEjB,SACC,qBAAC,SAAM,SAAkB,MAAY,OAAK,MAAC,UAAS,UACnD;AAAA,wBAAC,cAAY,eAAK,EAAE,kBAAkB,GAAE;AAAA,IACxC,oBAAC,gBAmBA;AAAA,MAAC;AAAA;AAAA,QACA,OAAO;AAAA,UACN,OAAO;AAAA,UACP,QAAQ;AAAA,UACR,eAAe;AAAA,UACf,SAAS;AAAA,QACV;AAAA,QAEA;AAAA,UAAC;AAAA;AAAA,YACA,OAAO;AAAA,cACN,MAAM;AAAA,cACN,OAAO;AAAA,cACP,QAAQ;AAAA,YACT;AAAA,YAEC;AAAA,gCAAkB,gBAClB;AAAA,gBAAC;AAAA;AAAA,kBACA;AAAA;AAAA,cACA;AAAA,cAED,kBAAkB,mBAClB,oBAAC,gCAA6B,QAAgB;AAAA;AAAA;AAAA,QAEhD;AAAA;AAAA,IACD,GACD;AAAA,IACA,oBAAC,gBACA,8BAAC,UAAO,SAAS,SAAU,eAAK,EAAE,OAAO,GAAE,GAC5C;AAAA,KACD;AAEF","sourcesContent":["import type {\n\tOrgUnitSelection,\n\tPeriodSelection,\n\tScorecardDataSource,\n} from \"../../../schemas/config\";\nimport {\n\tButton,\n\tModal,\n\tModalActions,\n\tModalContent,\n\tModalTitle,\n} from \"@dhis2/ui\";\nimport i18n from \"@dhis2/d2-i18n\";\nimport { useState } from \"react\";\nimport { FurtherAnalysisVisualization } from \"../FurtherAnalysisVisualization\";\nimport { FurtherAnalysisDictionary } from \"../FurtherAnalysisDictionary\";\n\nexport interface FurtherAnalysisConfig {\n\torgUnitSelection: OrgUnitSelection;\n\tperiodSelection: PeriodSelection;\n\tdataSources: ScorecardDataSource[];\n}\n\nexport interface FurtherAnalysisProps {\n\thide: boolean;\n\tonClose: () => void;\n\tconfig: FurtherAnalysisConfig;\n}\n\nexport function FurtherAnalysis({\n\thide,\n\tonClose,\n\tconfig,\n}: FurtherAnalysisProps) {\n\tconst [activeElement, setActiveElement] = useState<\n\t\t\"visualization\" | \"dictionary\" | undefined\n\t>(\"visualization\");\n\n\treturn (\n\t\t<Modal onClose={onClose} hide={hide} large position=\"middle\">\n\t\t\t<ModalTitle>{i18n.t(\"Further Analysis\")}</ModalTitle>\n\t\t\t<ModalContent>\n\t\t\t\t{/*<SegmentedControl*/}\n\t\t\t\t{/*\toptions={[*/}\n\t\t\t\t{/*\t\t{*/}\n\t\t\t\t{/*\t\t\tvalue: \"visualization\",*/}\n\t\t\t\t{/*\t\t\tlabel: i18n.t(\"Visualization\"),*/}\n\t\t\t\t{/*\t\t},*/}\n\t\t\t\t{/*\t\t{*/}\n\t\t\t\t{/*\t\t\tvalue: \"dictionary\",*/}\n\t\t\t\t{/*\t\t\tlabel: i18n.t(\"Dictionary\"),*/}\n\t\t\t\t{/*\t\t},*/}\n\t\t\t\t{/*\t]}*/}\n\t\t\t\t{/*\tselected={activeElement!}*/}\n\t\t\t\t{/*\tonChange={({ value }) =>*/}\n\t\t\t\t{/*\t\tsetActiveElement(*/}\n\t\t\t\t{/*\t\t\tvalue as \"visualization\" | \"dictionary\",*/}\n\t\t\t\t{/*\t\t)*/}\n\t\t\t\t{/*\t}*/}\n\t\t\t\t{/*/>*/}\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\twidth: \"100%\",\n\t\t\t\t\t\theight: \"100%\",\n\t\t\t\t\t\tflexDirection: \"column\",\n\t\t\t\t\t\tdisplay: \"flex\",\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tflex: 1,\n\t\t\t\t\t\t\twidth: \"100%\",\n\t\t\t\t\t\t\theight: \"100%\",\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t{activeElement === \"dictionary\" && (\n\t\t\t\t\t\t\t<FurtherAnalysisDictionary\n\t\t\t\t\t\t\t\tconfig={config}\n\t\t\t\t\t\t\t></FurtherAnalysisDictionary>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t{activeElement === \"visualization\" && (\n\t\t\t\t\t\t\t<FurtherAnalysisVisualization config={config} />\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</ModalContent>\n\t\t\t<ModalActions>\n\t\t\t\t<Button onClick={onClose}>{i18n.t(\"Close\")}</Button>\n\t\t\t</ModalActions>\n\t\t</Modal>\n\t);\n}\n"]}

package/dist/esm/components/Scorecard/components/ScorecardTable/components/LinkedCell.js

@@ -0,0 +1,94 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { DataTableCell, colors } from '@dhis2/ui';
+import { getTextColorFromBackgroundColor } from '../../../utils/legends';
+import { DataValue } from './DataValue';
+import { useElementSize } from 'usehooks-ts';
+import React, { useMemo } from 'react';
+
+function LinkedCellComponent({ top, bottom, ...props }) {
+  const [ref, { height, width }] = useElementSize();
+  const {
+    legendDefinition: topLegendDefinition,
+    dataSource: topDataSource,
+    value: topValue
+  } = top;
+  const {
+    legendDefinition: bottomLegendDefinition,
+    dataSource: bottomDataSource,
+    value: bottomValue
+  } = bottom;
+  const angle = useMemo(() => {
+    return Math.tan(height / width);
+  }, [height, width]);
+  return /* @__PURE__ */ jsx(
+    DataTableCell,
+    {
+      ...props,
+      ref,
+      style: {
+        padding: 8,
+        minWidth: 120,
+        background: `linear-gradient(-${angle}rad, ${bottomLegendDefinition?.color ?? colors.white} 0%, ${bottomLegendDefinition?.color ?? colors.white} 49%, ${colors.white} 49%, ${colors.white} 50%, ${topLegendDefinition?.color ?? colors.white} 50%, ${topLegendDefinition?.color ?? colors.white} 100%)`
+      },
+      bordered: true,
+      children: /* @__PURE__ */ jsxs(
+        "div",
+        {
+          style: {
+            display: "flex",
+            width: "100%",
+            height: "100%",
+            flexDirection: "column"
+          },
+          children: [
+            /* @__PURE__ */ jsx(
+              "div",
+              {
+                style: {
+                  background: "inherit",
+                  display: "flex",
+                  width: "100%",
+                  alignItems: "flex-start",
+                  justifyContent: "flex-start",
+                  color: topLegendDefinition ? getTextColorFromBackgroundColor(
+                    topLegendDefinition?.color ?? "#FFFFFF"
+                  ) : void 0
+                },
+                children: /* @__PURE__ */ jsx(DataValue, { value: topValue, dataSource: topDataSource })
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              "div",
+              {
+                style: {
+                  background: "inherit",
+                  display: "flex",
+                  width: "100%",
+                  alignItems: "flex-end",
+                  justifyContent: "flex-end",
+                  color: bottomLegendDefinition ? getTextColorFromBackgroundColor(
+                    bottomLegendDefinition?.color ?? "#FFFFFF"
+                  ) : void 0
+                },
+                children: /* @__PURE__ */ jsx(
+                  DataValue,
+                  {
+                    value: bottomValue,
+                    dataSource: bottomDataSource
+                  }
+                )
+              }
+            )
+          ]
+        }
+      )
+    }
+  );
+}
+const LinkedCell = React.memo(LinkedCellComponent, (prev, next) => {
+  return prev.top.value === next.top.value && prev.bottom.value === next.bottom.value;
+});
+
+export { LinkedCell };
+//# sourceMappingURL=out.js.map
+//# sourceMappingURL=LinkedCell.js.map

package/dist/esm/components/Scorecard/components/ScorecardTable/components/LinkedCell.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../../src/components/Scorecard/components/ScorecardTable/components/LinkedCell.tsx"],"names":[],"mappings":"AA8DG,SAsBE,KAtBF;AA9DH,SAAS,QAAQ,qBAAqB;AACtC,SAAS,uCAAuC;AAChD,SAAS,iBAAiB;AAC1B,SAAS,sBAAsB;AAC/B,OAAO,SAAS,eAAe;AAqB/B,SAAS,oBAAoB,EAAE,KAAK,QAAQ,GAAG,MAAM,GAAoB;AACxE,QAAM,CAAC,KAAK,EAAE,QAAQ,MAAM,CAAC,IAAI,eAAe;AAEhD,QAAM;AAAA,IACL,kBAAkB;AAAA,IAClB,YAAY;AAAA,IACZ,OAAO;AAAA,EACR,IAAI;AACJ,QAAM;AAAA,IACL,kBAAkB;AAAA,IAClB,YAAY;AAAA,IACZ,OAAO;AAAA,EACR,IAAI;AAEJ,QAAM,QAAQ,QAAQ,MAAM;AAC3B,WAAO,KAAK,IAAI,SAAS,KAAK;AAAA,EAC/B,GAAG,CAAC,QAAQ,KAAK,CAAC;AAElB,SACC;AAAA,IAAC;AAAA;AAAA,MACC,GAAG;AAAA,MAGJ;AAAA,MACA,OAAO;AAAA,QACN,SAAS;AAAA,QACT,UAAU;AAAA,QACV,YAAY,oBAAoB,KAAK,QACpC,wBAAwB,SAAS,OAAO,KACzC,QAAQ,wBAAwB,SAAS,OAAO,KAAK,SACpD,OAAO,KACR,SAAS,OAAO,KAAK,SACpB,qBAAqB,SAAS,OAAO,KACtC,SAAS,qBAAqB,SAAS,OAAO,KAAK;AAAA,MACpD;AAAA,MACA,UAAQ;AAAA,MAER;AAAA,QAAC;AAAA;AAAA,UACA,OAAO;AAAA,YACN,SAAS;AAAA,YACT,OAAO;AAAA,YACP,QAAQ;AAAA,YACR,eAAe;AAAA,UAChB;AAAA,UAEA;AAAA;AAAA,cAAC;AAAA;AAAA,gBACA,OAAO;AAAA,kBACN,YAAY;AAAA,kBACZ,SAAS;AAAA,kBACT,OAAO;AAAA,kBACP,YAAY;AAAA,kBACZ,gBAAgB;AAAA,kBAChB,OAAO,sBACJ;AAAA,oBACA,qBAAqB,SAAS;AAAA,kBAC/B,IACC;AAAA,gBACJ;AAAA,gBAEA,8BAAC,aAAU,OAAO,UAAU,YAAY,eAAe;AAAA;AAAA,YACxD;AAAA,YACA;AAAA,cAAC;AAAA;AAAA,gBACA,OAAO;AAAA,kBACN,YAAY;AAAA,kBACZ,SAAS;AAAA,kBACT,OAAO;AAAA,kBACP,YAAY;AAAA,kBACZ,gBAAgB;AAAA,kBAChB,OAAO,yBACJ;AAAA,oBACA,wBAAwB,SAAS;AAAA,kBAClC,IACC;AAAA,gBACJ;AAAA,gBAEA;AAAA,kBAAC;AAAA;AAAA,oBACA,OAAO;AAAA,oBACP,YAAY;AAAA;AAAA,gBACb;AAAA;AAAA,YACD;AAAA;AAAA;AAAA,MACD;AAAA;AAAA,EACD;AAEF;AAEO,MAAM,aAAa,MAAM,KAAK,qBAAqB,CAAC,MAAM,SAAS;AACzE,SACC,KAAK,IAAI,UAAU,KAAK,IAAI,SAC5B,KAAK,OAAO,UAAU,KAAK,OAAO;AAEpC,CAAC","sourcesContent":["import { colors, DataTableCell } from \"@dhis2/ui\";\nimport { getTextColorFromBackgroundColor } from \"../../../utils/legends\";\nimport { DataValue } from \"./DataValue\";\nimport { useElementSize } from \"usehooks-ts\";\nimport React, { useMemo } from \"react\";\nimport type {\n\tLegendDefinition,\n\tScorecardTableCellData,\n} from \"../../../schemas/config\";\n\nexport interface LinkedCellProps {\n\ttop: {\n\t\tdataSource: ScorecardTableCellData[\"dataSources\"][number];\n\t\tlegendDefinition?: LegendDefinition;\n\t\tvalue?: number;\n\t};\n\tbottom: {\n\t\tdataSource: ScorecardTableCellData[\"dataSources\"][number];\n\t\tlegendDefinition?: LegendDefinition;\n\t\tvalue?: number;\n\t};\n\n\t[key: string]: unknown;\n}\n\nfunction LinkedCellComponent({ top, bottom, ...props }: LinkedCellProps) {\n\tconst [ref, { height, width }] = useElementSize();\n\n\tconst {\n\t\tlegendDefinition: topLegendDefinition,\n\t\tdataSource: topDataSource,\n\t\tvalue: topValue,\n\t} = top;\n\tconst {\n\t\tlegendDefinition: bottomLegendDefinition,\n\t\tdataSource: bottomDataSource,\n\t\tvalue: bottomValue,\n\t} = bottom;\n\n\tconst angle = useMemo(() => {\n\t\treturn Math.tan(height / width);\n\t}, [height, width]);\n\n\treturn (\n\t\t<DataTableCell\n\t\t\t{...props}\n\t\t\t/*\n      // @ts-ignore */\n\t\t\tref={ref}\n\t\t\tstyle={{\n\t\t\t\tpadding: 8,\n\t\t\t\tminWidth: 120,\n\t\t\t\tbackground: `linear-gradient(-${angle}rad, ${\n\t\t\t\t\tbottomLegendDefinition?.color ?? colors.white\n\t\t\t\t} 0%, ${bottomLegendDefinition?.color ?? colors.white} 49%, ${\n\t\t\t\t\tcolors.white\n\t\t\t\t} 49%, ${colors.white} 50%, ${\n\t\t\t\t\ttopLegendDefinition?.color ?? colors.white\n\t\t\t\t} 50%, ${topLegendDefinition?.color ?? colors.white} 100%)`,\n\t\t\t}}\n\t\t\tbordered\n\t\t>\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\tdisplay: \"flex\",\n\t\t\t\t\twidth: \"100%\",\n\t\t\t\t\theight: \"100%\",\n\t\t\t\t\tflexDirection: \"column\",\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tbackground: \"inherit\",\n\t\t\t\t\t\tdisplay: \"flex\",\n\t\t\t\t\t\twidth: \"100%\",\n\t\t\t\t\t\talignItems: \"flex-start\",\n\t\t\t\t\t\tjustifyContent: \"flex-start\",\n\t\t\t\t\t\tcolor: topLegendDefinition\n\t\t\t\t\t\t\t? getTextColorFromBackgroundColor(\n\t\t\t\t\t\t\t\t\ttopLegendDefinition?.color ?? \"#FFFFFF\",\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t: undefined,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<DataValue value={topValue} dataSource={topDataSource} />\n\t\t\t\t</div>\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tbackground: \"inherit\",\n\t\t\t\t\t\tdisplay: \"flex\",\n\t\t\t\t\t\twidth: \"100%\",\n\t\t\t\t\t\talignItems: \"flex-end\",\n\t\t\t\t\t\tjustifyContent: \"flex-end\",\n\t\t\t\t\t\tcolor: bottomLegendDefinition\n\t\t\t\t\t\t\t? getTextColorFromBackgroundColor(\n\t\t\t\t\t\t\t\t\tbottomLegendDefinition?.color ?? \"#FFFFFF\",\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t: undefined,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<DataValue\n\t\t\t\t\t\tvalue={bottomValue}\n\t\t\t\t\t\tdataSource={bottomDataSource}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</DataTableCell>\n\t);\n}\n\nexport const LinkedCell = React.memo(LinkedCellComponent, (prev, next) => {\n\treturn (\n\t\tprev.top.value === next.top.value &&\n\t\tprev.bottom.value === next.bottom.value\n\t);\n});\n"]}

package/dist/esm/components/Scorecard/components/ScorecardTable/components/LinkedDataCell.js

@@ -0,0 +1,93 @@
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+import { useCellData } from '../../../hooks/cellData';
+import { LinkedCell } from './LinkedCell';
+import { memo, useState } from 'react';
+import { FurtherAnalysisMenu } from './FurtherAnalysisMenu';
+import { FurtherAnalysis } from './FurtherAnalysisModal';
+
+function LinkedDataCellComponent({
+  dataSources,
+  orgUnit,
+  period
+}) {
+  const [furtherAnalysisConfig, setFurtherAnalysisConfig] = useState(null);
+  const [stateActionRef, setStateActionRef] = useState(void 0);
+  const [top, bottom] = dataSources ?? [];
+  const { legendDefinition: topLegendDefinition } = useCellData({
+    dataSource: top,
+    orgUnit,
+    period
+  });
+  const { legendDefinition: bottomLegendDefinition } = useCellData({
+    dataSource: bottom,
+    orgUnit,
+    period
+  });
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    !!furtherAnalysisConfig && /* @__PURE__ */ jsx(
+      FurtherAnalysis,
+      {
+        onClose: () => {
+          setFurtherAnalysisConfig(null);
+        },
+        hide: !furtherAnalysisConfig,
+        config: furtherAnalysisConfig
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      LinkedCell,
+      {
+        onContextMenu: (e) => {
+          e.preventDefault();
+          setStateActionRef(e.target);
+        },
+        onClick: (event) => {
+          event.stopPropagation();
+          setFurtherAnalysisConfig({
+            periodSelection: {
+              periods: [
+                {
+                  id: period
+                }
+              ]
+            },
+            orgUnitSelection: {
+              levels: [],
+              groups: [],
+              orgUnits: [
+                {
+                  id: orgUnit.uid
+                }
+              ]
+            },
+            dataSources
+          });
+        },
+        top: {
+          legendDefinition: topLegendDefinition,
+          dataSource: top
+        },
+        bottom: {
+          legendDefinition: bottomLegendDefinition,
+          dataSource: bottom
+        }
+      }
+    ),
+    stateActionRef && /* @__PURE__ */ jsx(
+      FurtherAnalysisMenu,
+      {
+        dataSources,
+        onSelect: setFurtherAnalysisConfig,
+        stateActionRef,
+        setStateActionRef,
+        orgUnit,
+        periodId: period
+      }
+    )
+  ] });
+}
+const LinkedDataCell = memo(LinkedDataCellComponent);
+
+export { LinkedDataCell };
+//# sourceMappingURL=out.js.map
+//# sourceMappingURL=LinkedDataCell.js.map

package/dist/esm/components/Scorecard/components/ScorecardTable/components/LinkedDataCell.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../../src/components/Scorecard/components/ScorecardTable/components/LinkedDataCell.tsx"],"names":[],"mappings":"AAuCE,mBAEE,KAFF;AArCF,SAAS,mBAAmB;AAC5B,SAAS,kBAAkB;AAC3B,SAAS,MAAM,gBAAgB;AAC/B,SAAS,2BAA2B;AACpC;AAAA,EACC;AAAA,OAEM;AAQP,SAAS,wBAAwB;AAAA,EAChC;AAAA,EACA;AAAA,EACA;AACD,GAAwB;AACvB,QAAM,CAAC,uBAAuB,wBAAwB,IACrD,SAAuC,IAAI;AAC5C,QAAM,CAAC,gBAAgB,iBAAiB,IAAI,SAAS,MAAS;AAE9D,QAAM,CAAC,KAAK,MAAM,IAAI,eAAe,CAAC;AACtC,QAAM,EAAE,kBAAkB,oBAAoB,IAAI,YAAY;AAAA,IAC7D,YAAY;AAAA,IACZ;AAAA,IACA;AAAA,EACD,CAAC;AACD,QAAM,EAAE,kBAAkB,uBAAuB,IAAI,YAAY;AAAA,IAChE,YAAY;AAAA,IACZ;AAAA,IACA;AAAA,EACD,CAAC;AAED,SACC,iCACE;AAAA,KAAC,CAAC,yBACF;AAAA,MAAC;AAAA;AAAA,QACA,SAAS,MAAM;AACd,mCAAyB,IAAI;AAAA,QAC9B;AAAA,QACA,MAAM,CAAC;AAAA,QACP,QAAQ;AAAA;AAAA,IACT;AAAA,IAED;AAAA,MAAC;AAAA;AAAA,QACA,eAAe,CAAC,MAAW;AAC1B,YAAE,eAAe;AACjB,4BAAkB,EAAE,MAAM;AAAA,QAC3B;AAAA,QACA,SAAS,CAAC,UAAsB;AAC/B,gBAAM,gBAAgB;AACtB,mCAAyB;AAAA,YACxB,iBAAiB;AAAA,cAChB,SAAS;AAAA,gBACR;AAAA,kBACC,IAAI;AAAA,gBACL;AAAA,cACD;AAAA,YACD;AAAA,YACA,kBAAkB;AAAA,cACjB,QAAQ,CAAC;AAAA,cACT,QAAQ,CAAC;AAAA,cACT,UAAU;AAAA,gBACT;AAAA,kBACC,IAAI,QAAQ;AAAA,gBACb;AAAA,cACD;AAAA,YACD;AAAA,YACA;AAAA,UACD,CAAC;AAAA,QACF;AAAA,QACA,KAAK;AAAA,UACJ,kBAAkB;AAAA,UAClB,YAAY;AAAA,QACb;AAAA,QACA,QAAQ;AAAA,UACP,kBAAkB;AAAA,UAClB,YAAY;AAAA,QACb;AAAA;AAAA,IACD;AAAA,IACC,kBACA;AAAA,MAAC;AAAA;AAAA,QACA;AAAA,QACA,UAAU;AAAA,QACV;AAAA,QACA;AAAA,QACA;AAAA,QACA,UAAU;AAAA;AAAA,IACX;AAAA,KAEF;AAEF;AAEO,MAAM,iBAAiB,KAAK,uBAAuB","sourcesContent":["import type { ScorecardTableCellData } from \"../../../schemas/config\";\nimport type { ItemMeta } from \"../../../hooks/metadata\";\nimport { useCellData } from \"../../../hooks/cellData\";\nimport { LinkedCell } from \"./LinkedCell\";\nimport { memo, useState } from \"react\";\nimport { FurtherAnalysisMenu } from \"./FurtherAnalysisMenu\";\nimport {\n\tFurtherAnalysis,\n\ttype FurtherAnalysisConfig,\n} from \"./FurtherAnalysisModal\";\n\nexport interface LinkedDataCellProps {\n\tdataSources: ScorecardTableCellData[\"dataSources\"];\n\torgUnit: ItemMeta & { hierarchy: string };\n\tperiod: string;\n}\n\nfunction LinkedDataCellComponent({\n\tdataSources,\n\torgUnit,\n\tperiod,\n}: LinkedDataCellProps) {\n\tconst [furtherAnalysisConfig, setFurtherAnalysisConfig] =\n\t\tuseState<FurtherAnalysisConfig | null>(null);\n\tconst [stateActionRef, setStateActionRef] = useState(undefined);\n\n\tconst [top, bottom] = dataSources ?? [];\n\tconst { legendDefinition: topLegendDefinition } = useCellData({\n\t\tdataSource: top,\n\t\torgUnit,\n\t\tperiod,\n\t});\n\tconst { legendDefinition: bottomLegendDefinition } = useCellData({\n\t\tdataSource: bottom,\n\t\torgUnit,\n\t\tperiod,\n\t});\n\n\treturn (\n\t\t<>\n\t\t\t{!!furtherAnalysisConfig && (\n\t\t\t\t<FurtherAnalysis\n\t\t\t\t\tonClose={() => {\n\t\t\t\t\t\tsetFurtherAnalysisConfig(null);\n\t\t\t\t\t}}\n\t\t\t\t\thide={!furtherAnalysisConfig}\n\t\t\t\t\tconfig={furtherAnalysisConfig}\n\t\t\t\t/>\n\t\t\t)}\n\t\t\t<LinkedCell\n\t\t\t\tonContextMenu={(e: any) => {\n\t\t\t\t\te.preventDefault();\n\t\t\t\t\tsetStateActionRef(e.target);\n\t\t\t\t}}\n\t\t\t\tonClick={(event: MouseEvent) => {\n\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\tsetFurtherAnalysisConfig({\n\t\t\t\t\t\tperiodSelection: {\n\t\t\t\t\t\t\tperiods: [\n\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\tid: period,\n\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t],\n\t\t\t\t\t\t},\n\t\t\t\t\t\torgUnitSelection: {\n\t\t\t\t\t\t\tlevels: [],\n\t\t\t\t\t\t\tgroups: [],\n\t\t\t\t\t\t\torgUnits: [\n\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\tid: orgUnit.uid,\n\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t],\n\t\t\t\t\t\t},\n\t\t\t\t\t\tdataSources,\n\t\t\t\t\t});\n\t\t\t\t}}\n\t\t\t\ttop={{\n\t\t\t\t\tlegendDefinition: topLegendDefinition,\n\t\t\t\t\tdataSource: top,\n\t\t\t\t}}\n\t\t\t\tbottom={{\n\t\t\t\t\tlegendDefinition: bottomLegendDefinition,\n\t\t\t\t\tdataSource: bottom,\n\t\t\t\t}}\n\t\t\t/>\n\t\t\t{stateActionRef && (\n\t\t\t\t<FurtherAnalysisMenu\n\t\t\t\t\tdataSources={dataSources}\n\t\t\t\t\tonSelect={setFurtherAnalysisConfig}\n\t\t\t\t\tstateActionRef={stateActionRef}\n\t\t\t\t\tsetStateActionRef={setStateActionRef}\n\t\t\t\t\torgUnit={orgUnit}\n\t\t\t\t\tperiodId={period}\n\t\t\t\t/>\n\t\t\t)}\n\t\t</>\n\t);\n}\n\nexport const LinkedDataCell = memo(LinkedDataCellComponent);\n"]}

package/dist/esm/components/Scorecard/components/ScorecardTable/components/LinkedDataFooterCell.js

@@ -0,0 +1,43 @@
+import { jsx } from 'react/jsx-runtime';
+import { useAverage } from '../../../hooks/average';
+import { LinkedCell } from './LinkedCell';
+
+function LinkedDataFooterCell({
+  table,
+  column,
+  header,
+  dataSources
+}) {
+  const [top, bottom] = dataSources ?? [];
+  const { average: topAverage, legendDefinition: topLegendDefinition } = useAverage({
+    dataSource: top,
+    column,
+    header,
+    table
+  });
+  const { average: bottomAverage, legendDefinition: bottomLegendDefinition } = useAverage({
+    dataSource: bottom,
+    column,
+    header,
+    table
+  });
+  return /* @__PURE__ */ jsx(
+    LinkedCell,
+    {
+      top: {
+        dataSource: top,
+        legendDefinition: topLegendDefinition,
+        value: topAverage
+      },
+      bottom: {
+        dataSource: bottom,
+        legendDefinition: topLegendDefinition,
+        value: bottomAverage
+      }
+    }
+  );
+}
+
+export { LinkedDataFooterCell };
+//# sourceMappingURL=out.js.map
+//# sourceMappingURL=LinkedDataFooterCell.js.map

package/dist/esm/components/Scorecard/components/ScorecardTable/components/LinkedDataFooterCell.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../../src/components/Scorecard/components/ScorecardTable/components/LinkedDataFooterCell.tsx"],"names":[],"mappings":"AAkCE;AA7BF,SAAS,kBAAkB;AAC3B,SAAS,kBAAkB;AAEpB,SAAS,qBAAqB;AAAA,EACpC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAEG;AACF,QAAM,CAAC,KAAK,MAAM,IAAI,eAAe,CAAC;AAEtC,QAAM,EAAE,SAAS,YAAY,kBAAkB,oBAAoB,IAClE,WAAW;AAAA,IACV,YAAY;AAAA,IACZ;AAAA,IACA;AAAA,IACA;AAAA,EACD,CAAC;AACF,QAAM,EAAE,SAAS,eAAe,kBAAkB,uBAAuB,IACxE,WAAW;AAAA,IACV,YAAY;AAAA,IACZ;AAAA,IACA;AAAA,IACA;AAAA,EACD,CAAC;AAEF,SACC;AAAA,IAAC;AAAA;AAAA,MACA,KAAK;AAAA,QACJ,YAAY;AAAA,QACZ,kBAAkB;AAAA,QAClB,OAAO;AAAA,MACR;AAAA,MACA,QAAQ;AAAA,QACP,YAAY;AAAA,QACZ,kBAAkB;AAAA,QAClB,OAAO;AAAA,MACR;AAAA;AAAA,EACD;AAEF","sourcesContent":["import type { HeaderContext } from \"@tanstack/react-table\";\nimport type {\n\tScorecardTableCellData,\n\tScorecardTableData,\n} from \"../../../schemas/config\";\nimport { useAverage } from \"../../../hooks/average\";\nimport { LinkedCell } from \"./LinkedCell\";\n\nexport function LinkedDataFooterCell({\n\ttable,\n\tcolumn,\n\theader,\n\tdataSources,\n}: HeaderContext<ScorecardTableData, ScorecardTableCellData> & {\n\tdataSources: ScorecardTableCellData[\"dataSources\"];\n}) {\n\tconst [top, bottom] = dataSources ?? [];\n\n\tconst { average: topAverage, legendDefinition: topLegendDefinition } =\n\t\tuseAverage({\n\t\t\tdataSource: top,\n\t\t\tcolumn,\n\t\t\theader,\n\t\t\ttable,\n\t\t});\n\tconst { average: bottomAverage, legendDefinition: bottomLegendDefinition } =\n\t\tuseAverage({\n\t\t\tdataSource: bottom,\n\t\t\tcolumn,\n\t\t\theader,\n\t\t\ttable,\n\t\t});\n\n\treturn (\n\t\t<LinkedCell\n\t\t\ttop={{\n\t\t\t\tdataSource: top,\n\t\t\t\tlegendDefinition: topLegendDefinition,\n\t\t\t\tvalue: topAverage,\n\t\t\t}}\n\t\t\tbottom={{\n\t\t\t\tdataSource: bottom,\n\t\t\t\tlegendDefinition: topLegendDefinition,\n\t\t\t\tvalue: bottomAverage,\n\t\t\t}}\n\t\t/>\n\t);\n}\n"]}

package/dist/esm/components/Scorecard/components/ScorecardTable/components/MetaFooterCell.js

@@ -0,0 +1,14 @@
+import { jsx } from 'react/jsx-runtime';
+import { DataTableCell } from '@dhis2/ui';
+import i18n from '@dhis2/d2-i18n';
+import { useScorecardState } from '../../StateProvider';
+
+function MetaFooterCell(props) {
+  const state = useScorecardState();
+  const itemNumber = state?.options.itemNumber ?? false;
+  return /* @__PURE__ */ jsx(DataTableCell, { align: "center", colSpan: itemNumber ? "3" : "2", fixed: true, children: /* @__PURE__ */ jsx("b", { style: { padding: "8px 0" }, children: i18n.t("Average") }) });
+}
+
+export { MetaFooterCell };
+//# sourceMappingURL=out.js.map
+//# sourceMappingURL=MetaFooterCell.js.map

package/dist/esm/components/Scorecard/components/ScorecardTable/components/MetaFooterCell.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../../src/components/Scorecard/components/ScorecardTable/components/MetaFooterCell.tsx"],"names":[],"mappings":"AAcG;AAdH,SAAS,qBAAqB;AAG9B,OAAO,UAAU;AACjB,SAAS,yBAAyB;AAE3B,SAAS,eACf,OACC;AACD,QAAM,QAAQ,kBAAkB;AAChC,QAAM,aAAa,OAAO,QAAQ,cAAc;AAEhD,SACC,oBAAC,iBAAc,OAAM,UAAS,SAAS,aAAa,MAAM,KAAK,OAAK,MACnE,8BAAC,OAAE,OAAO,EAAE,SAAS,QAAQ,GAAI,eAAK,EAAE,SAAS,GAAE,GACpD;AAEF","sourcesContent":["import { DataTableCell } from \"@dhis2/ui\";\nimport type { HeaderContext } from \"@tanstack/react-table\";\nimport type { ScorecardTableData } from \"../../../schemas/config\";\nimport i18n from \"@dhis2/d2-i18n\";\nimport { useScorecardState } from \"../../StateProvider\";\n\nexport function MetaFooterCell(\n\tprops: HeaderContext<ScorecardTableData, unknown>,\n) {\n\tconst state = useScorecardState();\n\tconst itemNumber = state?.options.itemNumber ?? false;\n\n\treturn (\n\t\t<DataTableCell align=\"center\" colSpan={itemNumber ? \"3\" : \"2\"} fixed>\n\t\t\t<b style={{ padding: \"8px 0\" }}>{i18n.t(\"Average\")}</b>\n\t\t</DataTableCell>\n\t);\n}\n"]}

package/dist/esm/components/Scorecard/components/ScorecardTable/components/SingleDataCell.js

@@ -0,0 +1,96 @@
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { memo, useState } from 'react';
+import { head } from 'lodash';
+import { DataTableCell } from '@dhis2/ui';
+import { getTextColorFromBackgroundColor } from '../../../utils/legends';
+import { DataValue } from './DataValue';
+import { useCellData } from '../../../hooks/cellData';
+import { FurtherAnalysisMenu } from './FurtherAnalysisMenu';
+import { FurtherAnalysis } from './FurtherAnalysisModal';
+
+function SingleDataCellComponent({
+  dataSources,
+  period,
+  orgUnit
+}) {
+  const [furtherAnalysisConfig, setFurtherAnalysisConfig] = useState(null);
+  const dataSource = head(dataSources);
+  const [stateActionRef, setStateActionRef] = useState(void 0);
+  const { legendDefinition } = useCellData({
+    dataSource,
+    period,
+    orgUnit
+  });
+  if (!dataSource) {
+    return /* @__PURE__ */ jsx(DataTableCell, { bordered: true });
+  }
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    !!furtherAnalysisConfig && /* @__PURE__ */ jsx(
+      FurtherAnalysis,
+      {
+        onClose: () => {
+          setFurtherAnalysisConfig(null);
+        },
+        hide: !furtherAnalysisConfig,
+        config: furtherAnalysisConfig
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      DataTableCell,
+      {
+        onClick: (event) => {
+          event.stopPropagation();
+          setFurtherAnalysisConfig({
+            periodSelection: {
+              periods: [
+                {
+                  id: period
+                }
+              ]
+            },
+            orgUnitSelection: {
+              levels: [],
+              groups: [],
+              orgUnits: [
+                {
+                  id: orgUnit.uid
+                }
+              ]
+            },
+            dataSources
+          });
+        },
+        onContextMenu: (e) => {
+          e.preventDefault();
+          setStateActionRef(e.target);
+        },
+        bordered: true,
+        style: {
+          background: legendDefinition?.color,
+          textAlign: "center",
+          minWidth: 100,
+          color: legendDefinition ? getTextColorFromBackgroundColor(
+            legendDefinition?.color
+          ) : void 0
+        },
+        children: /* @__PURE__ */ jsx(DataValue, { dataSource })
+      }
+    ),
+    stateActionRef && /* @__PURE__ */ jsx(
+      FurtherAnalysisMenu,
+      {
+        dataSources,
+        onSelect: setFurtherAnalysisConfig,
+        stateActionRef,
+        setStateActionRef,
+        orgUnit,
+        periodId: period
+      }
+    )
+  ] });
+}
+const SingleDataCell = memo(SingleDataCellComponent);
+
+export { SingleDataCell };
+//# sourceMappingURL=out.js.map
+//# sourceMappingURL=SingleDataCell.js.map

package/dist/esm/components/Scorecard/components/ScorecardTable/components/SingleDataCell.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../../src/components/Scorecard/components/ScorecardTable/components/SingleDataCell.tsx"],"names":[],"mappings":"AAsCS,SAIP,UAJO,KAIP,YAJO;AApCT,SAAS,MAAsB,gBAAgB;AAC/C,SAAS,YAAY;AACrB,SAAS,qBAAqB;AAC9B,SAAS,uCAAuC;AAChD,SAAS,iBAAiB;AAC1B,SAAS,mBAAmB;AAC5B,SAAS,2BAA2B;AACpC;AAAA,EACC;AAAA,OAEM;AAQP,SAAS,wBAAwB;AAAA,EAChC;AAAA,EACA;AAAA,EACA;AACD,GAAmC;AAClC,QAAM,CAAC,uBAAuB,wBAAwB,IACrD,SAAuC,IAAI;AAE5C,QAAM,aAAa,KAAK,WAAW;AACnC,QAAM,CAAC,gBAAgB,iBAAiB,IAAI,SAAS,MAAS;AAE9D,QAAM,EAAE,iBAAiB,IAAI,YAAY;AAAA,IACxC;AAAA,IACA;AAAA,IACA;AAAA,EACD,CAAC;AAED,MAAI,CAAC,YAAY;AAChB,WAAO,oBAAC,iBAAc,UAAQ,MAAC;AAAA,EAChC;AAEA,SACC,iCACE;AAAA,KAAC,CAAC,yBACF;AAAA,MAAC;AAAA;AAAA,QACA,SAAS,MAAM;AACd,mCAAyB,IAAI;AAAA,QAC9B;AAAA,QACA,MAAM,CAAC;AAAA,QACP,QAAQ;AAAA;AAAA,IACT;AAAA,IAED;AAAA,MAAC;AAAA;AAAA,QACA,SAAS,CAAC,UAAU;AACnB,gBAAM,gBAAgB;AACtB,mCAAyB;AAAA,YACxB,iBAAiB;AAAA,cAChB,SAAS;AAAA,gBACR;AAAA,kBACC,IAAI;AAAA,gBACL;AAAA,cACD;AAAA,YACD;AAAA,YACA,kBAAkB;AAAA,cACjB,QAAQ,CAAC;AAAA,cACT,QAAQ,CAAC;AAAA,cACT,UAAU;AAAA,gBACT;AAAA,kBACC,IAAI,QAAQ;AAAA,gBACb;AAAA,cACD;AAAA,YACD;AAAA,YACA;AAAA,UACD,CAAC;AAAA,QACF;AAAA,QACA,eAAe,CAAC,MAAW;AAC1B,YAAE,eAAe;AACjB,4BAAkB,EAAE,MAAM;AAAA,QAC3B;AAAA,QACA,UAAQ;AAAA,QACR,OAAO;AAAA,UACN,YAAY,kBAAkB;AAAA,UAC9B,WAAW;AAAA,UACX,UAAU;AAAA,UACV,OAAO,mBACJ;AAAA,YACA,kBAAkB;AAAA,UACnB,IACC;AAAA,QACJ;AAAA,QAEA,8BAAC,aAAU,YAAwB;AAAA;AAAA,IACpC;AAAA,IAEC,kBACA;AAAA,MAAC;AAAA;AAAA,QACA;AAAA,QACA,UAAU;AAAA,QACV;AAAA,QACA;AAAA,QACA;AAAA,QACA,UAAU;AAAA;AAAA,IACX;AAAA,KAEF;AAEF;AAEO,MAAM,iBAAiB,KAAK,uBAAuB","sourcesContent":["import { type ScorecardTableCellData } from \"../../../schemas/config\";\nimport { type ItemMeta } from \"../../../hooks/metadata\";\nimport { memo, type ReactNode, useState } from \"react\";\nimport { head } from \"lodash\";\nimport { DataTableCell } from \"@dhis2/ui\";\nimport { getTextColorFromBackgroundColor } from \"../../../utils/legends\";\nimport { DataValue } from \"./DataValue\";\nimport { useCellData } from \"../../../hooks/cellData\";\nimport { FurtherAnalysisMenu } from \"./FurtherAnalysisMenu\";\nimport {\n\tFurtherAnalysis,\n\ttype FurtherAnalysisConfig,\n} from \"./FurtherAnalysisModal\";\n\nexport interface SingleDataCellProps {\n\tdataSources: ScorecardTableCellData[\"dataSources\"];\n\torgUnit: ItemMeta & { hierarchy: string };\n\tperiod: string;\n}\n\nfunction SingleDataCellComponent({\n\tdataSources,\n\tperiod,\n\torgUnit,\n}: SingleDataCellProps): ReactNode {\n\tconst [furtherAnalysisConfig, setFurtherAnalysisConfig] =\n\t\tuseState<FurtherAnalysisConfig | null>(null);\n\n\tconst dataSource = head(dataSources);\n\tconst [stateActionRef, setStateActionRef] = useState(undefined);\n\n\tconst { legendDefinition } = useCellData({\n\t\tdataSource,\n\t\tperiod,\n\t\torgUnit,\n\t});\n\n\tif (!dataSource) {\n\t\treturn <DataTableCell bordered />;\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t{!!furtherAnalysisConfig && (\n\t\t\t\t<FurtherAnalysis\n\t\t\t\t\tonClose={() => {\n\t\t\t\t\t\tsetFurtherAnalysisConfig(null);\n\t\t\t\t\t}}\n\t\t\t\t\thide={!furtherAnalysisConfig}\n\t\t\t\t\tconfig={furtherAnalysisConfig}\n\t\t\t\t/>\n\t\t\t)}\n\t\t\t<DataTableCell\n\t\t\t\tonClick={(event) => {\n\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\tsetFurtherAnalysisConfig({\n\t\t\t\t\t\tperiodSelection: {\n\t\t\t\t\t\t\tperiods: [\n\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\tid: period,\n\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t],\n\t\t\t\t\t\t},\n\t\t\t\t\t\torgUnitSelection: {\n\t\t\t\t\t\t\tlevels: [],\n\t\t\t\t\t\t\tgroups: [],\n\t\t\t\t\t\t\torgUnits: [\n\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\tid: orgUnit.uid,\n\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t],\n\t\t\t\t\t\t},\n\t\t\t\t\t\tdataSources,\n\t\t\t\t\t});\n\t\t\t\t}}\n\t\t\t\tonContextMenu={(e: any) => {\n\t\t\t\t\te.preventDefault();\n\t\t\t\t\tsetStateActionRef(e.target);\n\t\t\t\t}}\n\t\t\t\tbordered\n\t\t\t\tstyle={{\n\t\t\t\t\tbackground: legendDefinition?.color,\n\t\t\t\t\ttextAlign: \"center\",\n\t\t\t\t\tminWidth: 100,\n\t\t\t\t\tcolor: legendDefinition\n\t\t\t\t\t\t? getTextColorFromBackgroundColor(\n\t\t\t\t\t\t\t\tlegendDefinition?.color,\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t: undefined,\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<DataValue dataSource={dataSource} />\n\t\t\t</DataTableCell>\n\n\t\t\t{stateActionRef && (\n\t\t\t\t<FurtherAnalysisMenu\n\t\t\t\t\tdataSources={dataSources}\n\t\t\t\t\tonSelect={setFurtherAnalysisConfig}\n\t\t\t\t\tstateActionRef={stateActionRef}\n\t\t\t\t\tsetStateActionRef={setStateActionRef}\n\t\t\t\t\torgUnit={orgUnit}\n\t\t\t\t\tperiodId={period}\n\t\t\t\t/>\n\t\t\t)}\n\t\t</>\n\t);\n}\n\nexport const SingleDataCell = memo(SingleDataCellComponent);\n"]}

package/dist/esm/components/Scorecard/components/ScorecardTable/components/SingleDataFooterCell.js

@@ -0,0 +1,36 @@
+import { jsx } from 'react/jsx-runtime';
+import { DataTableCell } from '@dhis2/ui';
+import { getTextColorFromBackgroundColor } from '../../../utils/legends';
+import { useAverage } from '../../../hooks/average';
+
+function SingleDataFooterCell({
+  dataSource,
+  table,
+  column,
+  header
+}) {
+  const { legendDefinition, average } = useAverage({
+    dataSource,
+    table,
+    column,
+    header
+  });
+  return /* @__PURE__ */ jsx(
+    DataTableCell,
+    {
+      bordered: true,
+      style: {
+        background: legendDefinition?.color,
+        textAlign: "center",
+        minWidth: 100,
+        color: legendDefinition ? getTextColorFromBackgroundColor(legendDefinition?.color) : void 0
+      },
+      align: "center",
+      children: /* @__PURE__ */ jsx("b", { children: average })
+    }
+  );
+}
+
+export { SingleDataFooterCell };
+//# sourceMappingURL=out.js.map
+//# sourceMappingURL=SingleDataFooterCell.js.map

package/dist/esm/components/Scorecard/components/ScorecardTable/components/SingleDataFooterCell.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../../src/components/Scorecard/components/ScorecardTable/components/SingleDataFooterCell.tsx"],"names":[],"mappings":"AAqCG;AArCH,SAAS,qBAAqB;AAM9B,SAAS,uCAAuC;AAChD,SAAS,kBAAkB;AAEpB,SAAS,qBAAqB;AAAA,EACpC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAEG;AACF,QAAM,EAAE,kBAAkB,QAAQ,IAAI,WAAW;AAAA,IAChD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD,CAAC;AAED,SACC;AAAA,IAAC;AAAA;AAAA,MACA,UAAQ;AAAA,MACR,OAAO;AAAA,QACN,YAAY,kBAAkB;AAAA,QAC9B,WAAW;AAAA,QACX,UAAU;AAAA,QACV,OAAO,mBACJ,gCAAgC,kBAAkB,KAAK,IACvD;AAAA,MACJ;AAAA,MACA,OAAM;AAAA,MAEN,8BAAC,OAAG,mBAAQ;AAAA;AAAA,EACb;AAEF","sourcesContent":["import { DataTableCell } from \"@dhis2/ui\";\nimport type { HeaderContext } from \"@tanstack/react-table\";\nimport type {\n\tScorecardTableCellData,\n\tScorecardTableData,\n} from \"../../../schemas/config\";\nimport { getTextColorFromBackgroundColor } from \"../../../utils/legends\";\nimport { useAverage } from \"../../../hooks/average\";\n\nexport function SingleDataFooterCell({\n\tdataSource,\n\ttable,\n\tcolumn,\n\theader,\n}: HeaderContext<ScorecardTableData, ScorecardTableCellData> & {\n\tdataSource: ScorecardTableCellData[\"dataSources\"][number];\n}) {\n\tconst { legendDefinition, average } = useAverage({\n\t\tdataSource,\n\t\ttable,\n\t\tcolumn,\n\t\theader,\n\t});\n\n\treturn (\n\t\t<DataTableCell\n\t\t\tbordered\n\t\t\tstyle={{\n\t\t\t\tbackground: legendDefinition?.color,\n\t\t\t\ttextAlign: \"center\",\n\t\t\t\tminWidth: 100,\n\t\t\t\tcolor: legendDefinition\n\t\t\t\t\t? getTextColorFromBackgroundColor(legendDefinition?.color)\n\t\t\t\t\t: undefined,\n\t\t\t}}\n\t\t\talign=\"center\"\n\t\t>\n\t\t\t<b>{average}</b>\n\t\t</DataTableCell>\n\t);\n}\n"]}