@hisptz/dhis2-analytics 1.0.41 → 1.0.43

package/build/cjs/components/Visualization/components/VisualizationTypeProvider/index.js

@@ -0,0 +1,40 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.VisualizationTypeContext = exports.VisualizationConfigContext = void 0;
+exports.VisualizationTypeProvider = VisualizationTypeProvider;
+exports.VisualizationTypeSetter = void 0;
+exports.useVisualizationConfig = useVisualizationConfig;
+exports.useVisualizationType = useVisualizationType;
+var _react = _interopRequireWildcard(require("react"));
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+const VisualizationTypeContext = /*#__PURE__*/(0, _react.createContext)('pivotTable');
+exports.VisualizationTypeContext = VisualizationTypeContext;
+const VisualizationConfigContext = /*#__PURE__*/(0, _react.createContext)(undefined);
+exports.VisualizationConfigContext = VisualizationConfigContext;
+const VisualizationTypeSetter = /*#__PURE__*/(0, _react.createContext)(undefined);
+exports.VisualizationTypeSetter = VisualizationTypeSetter;
+function useVisualizationType() {
+  return [(0, _react.useContext)(VisualizationTypeContext), (0, _react.useContext)(VisualizationTypeSetter)];
+}
+function useVisualizationConfig() {
+  return (0, _react.useContext)(VisualizationConfigContext);
+}
+function VisualizationTypeProvider(_ref) {
+  let {
+    children,
+    defaultType,
+    config
+  } = _ref;
+  const [type, setType] = (0, _react.useState)(defaultType);
+  return /*#__PURE__*/_react.default.createElement(VisualizationTypeContext.Provider, {
+    value: type
+  }, /*#__PURE__*/_react.default.createElement(VisualizationConfigContext.Provider, {
+    value: config
+  }, /*#__PURE__*/_react.default.createElement(VisualizationTypeSetter.Provider, {
+    value: setType
+  }, children)));
+}

package/build/cjs/components/Visualization/components/VisualizationTypeSelector/index.js

@@ -0,0 +1,54 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.VisualizationTypeSelector = VisualizationTypeSelector;
+var _react = _interopRequireWildcard(require("react"));
+var _VisualizationTypeProvider = require("../VisualizationTypeProvider");
+var _ui = require("@dhis2/ui");
+var _d2I18n = _interopRequireDefault(require("@dhis2/d2-i18n"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+const supportedVisualizationTypes = [{
+  id: "pivotTable",
+  icon: /*#__PURE__*/_react.default.createElement(_ui.IconTable24, null),
+  label: _d2I18n.default.t("Pivot table")
+}, {
+  id: "chart",
+  icon: /*#__PURE__*/_react.default.createElement(_ui.IconVisualizationColumn24, null),
+  label: _d2I18n.default.t("Chart")
+}, {
+  id: "map",
+  icon: /*#__PURE__*/_react.default.createElement(_ui.IconWorld24, null),
+  label: _d2I18n.default.t("Map")
+}];
+function VisualizationTypeSelector() {
+  const [type, setType] = (0, _VisualizationTypeProvider.useVisualizationType)();
+  const config = (0, _VisualizationTypeProvider.useVisualizationConfig)();
+  const types = (0, _react.useMemo)(() => supportedVisualizationTypes.filter(supportedType => {
+    return Object.keys(config !== null && config !== void 0 ? config : {}).includes(supportedType.id) && supportedType.id !== type;
+  }), [type, config]);
+  return /*#__PURE__*/_react.default.createElement("div", {
+    style: {
+      display: "flex",
+      gap: 8
+    }
+  }, types.map(_ref => {
+    let {
+      icon,
+      label,
+      id
+    } = _ref;
+    return /*#__PURE__*/_react.default.createElement(_ui.Tooltip, {
+      key: `${label}-tooltip`,
+      content: _d2I18n.default.t("View as {{type}}", {
+        type: label.toLowerCase()
+      })
+    }, /*#__PURE__*/_react.default.createElement(_ui.Button, {
+      onClick: () => setType(id),
+      icon: icon
+    }));
+  }));
+}

package/build/cjs/components/Visualization/index.js

@@ -0,0 +1,104 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Visualization = Visualization;
+var _react = _interopRequireDefault(require("react"));
+var _VisualizationProvider = require("./components/VisualizationProvider");
+var _VisualizationTypeSelector = require("./components/VisualizationTypeSelector");
+var _VisualizationDimensionSelector = require("./components/VisualizationDimensionSelector");
+var _VisualizationSelector = require("./components/VisualizationSelector");
+var _reactErrorBoundary = require("react-error-boundary");
+var _d2I18n = _interopRequireDefault(require("@dhis2/d2-i18n"));
+var _ui = require("@dhis2/ui");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+/**
+ *  An analytics component that allows visualization of `chart`, `map`, and `pivot table` by passing analytics object and the default layout and type
+ *
+ * */
+
+function ErrorFallback(_ref) {
+  let {
+    error,
+    resetErrorBoundary,
+    height
+  } = _ref;
+  return /*#__PURE__*/_react.default.createElement("div", {
+    style: {
+      width: "100%",
+      textAlign: "center",
+      height: height !== null && height !== void 0 ? height : 500,
+      display: "flex",
+      flexDirection: "column",
+      alignItems: "center",
+      justifyContent: "center",
+      gap: 16,
+      padding: 16
+    }
+  }, /*#__PURE__*/_react.default.createElement(_ui.IconError24, null), /*#__PURE__*/_react.default.createElement("h3", {
+    style: {
+      color: _ui.colors.grey800,
+      margin: 0
+    }
+  }, _d2I18n.default.t("Could not load visualization")), /*#__PURE__*/_react.default.createElement("p", {
+    style: {
+      margin: 0
+    }
+  }, error.message), resetErrorBoundary && /*#__PURE__*/_react.default.createElement(_ui.Button, {
+    onClick: resetErrorBoundary,
+    small: true
+  }, _d2I18n.default.t("Try again")));
+}
+function Visualization(_ref2) {
+  let {
+    dimensions,
+    layout,
+    defaultVisualizationType,
+    config,
+    height,
+    showToolbar
+  } = _ref2;
+  return /*#__PURE__*/_react.default.createElement(_reactErrorBoundary.ErrorBoundary, {
+    onReset: () => {
+      //TODO: reset the visualization
+    },
+    resetKeys: [dimensions, layout, defaultVisualizationType, config],
+    fallbackRender: props => /*#__PURE__*/_react.default.createElement(ErrorFallback, _extends({
+      height: height
+    }, props))
+  }, /*#__PURE__*/_react.default.createElement(_VisualizationProvider.VisualizationProvider, {
+    config: config,
+    type: defaultVisualizationType,
+    layout: layout,
+    dimensions: dimensions
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    style: {
+      display: "flex",
+      flexDirection: "column",
+      width: "100%",
+      height: "100%",
+      padding: 16,
+      gap: 16
+    }
+  }, showToolbar && /*#__PURE__*/_react.default.createElement("div", {
+    style: {
+      display: "flex",
+      flexDirection: "row",
+      gap: 16,
+      justifyContent: "space-between"
+    }
+  }, /*#__PURE__*/_react.default.createElement(_VisualizationTypeSelector.VisualizationTypeSelector, null), /*#__PURE__*/_react.default.createElement(_VisualizationDimensionSelector.VisualizationDimensionSelector, null)), /*#__PURE__*/_react.default.createElement("div", {
+    style: {
+      display: "flex",
+      flexDirection: "column",
+      alignItems: "center",
+      justifyContent: "center",
+      height: height !== null && height !== void 0 ? height : 500
+    }
+  }, /*#__PURE__*/_react.default.createElement(_VisualizationSelector.VisualizationSelector, {
+    height: height !== null && height !== void 0 ? height : 500,
+    config: config
+  })))));
+}

package/build/cjs/index.js

@@ -57,4 +57,15 @@ Object.keys(_CustomPivotTable).forEach(function (key) {
       return _CustomPivotTable[key];
     }
   });
+});
+var _Visualization = require("./components/Visualization");
+Object.keys(_Visualization).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _Visualization[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _Visualization[key];
+    }
+  });
 });

package/build/cjs/locales/en/translations.json

@@ -124,5 +124,15 @@
     "Legend set is required": "Legend set is required",
     "Radius": "Radius",
     "Configure Thematic Layer": "Configure Thematic Layer",
-    "Loading ...": "Loading ..."
+    "Loading ...": "Loading ...",
+    "Select location(s)": "Select location(s)",
+    "Location": "Location",
+    "Organisation unit": "Organisation unit",
+    "Data": "Data",
+    "Pivot table": "Pivot table",
+    "Chart": "Chart",
+    "Map": "Map",
+    "View as {{type}}": "View as {{type}}",
+    "Could not load visualization": "Could not load visualization",
+    "Try again": "Try again"
 }

package/build/es/components/Map/components/MapProvider/components/MapLayerProvider/hooks/index.js

@@ -186,6 +186,9 @@ export function useThematicLayers() {
       const layersWithData = differenceBy(layers, layersWithoutData, "id");
       const dx = layersWithoutData.map(layer => layer.dataItem.id);
       let sanitizedLayersWithData = [];
+      console.log({
+        layersWithoutData
+      });
       if (!isEmpty(dx)) {
         const data = await engine.query(analyticsQuery, {
           variables: {

package/build/es/components/Map/constants/colors.js

@@ -416,5 +416,6 @@ export const COLOR_PALETTES = {
     9: ["#000000", "#252525", "#525252", "#737373", "#969696", "#bdbdbd", "#d9d9d9", "#f0f0f0", "#ffffff"]
   }
 };
+
 // Qualitative colors From ColorBrewer (reordered 12-class)
 export const qualitativeColors = ["#1f78b4", "#ff7f00", "#33a02c", "#a6cee3", "#b2df8a", "#fb9a99", "#fdbf6f", "#cab2d6", "#ffff99", "#b15928", "#6a3d9a", "#e31a1c"];

package/build/es/components/Visualization/Visualization.stories.js

@@ -0,0 +1,129 @@
+import { setupHighchartsModules } from "../ChartAnalytics";
+import { Visualization } from "./index";
+import HighCharts from "highcharts";
+import React from "react";
+import { Box, Card, CssReset } from "@dhis2/ui";
+const Template = args => /*#__PURE__*/React.createElement(Visualization, args);
+setupHighchartsModules(HighCharts);
+export const Default = Template.bind({});
+Default.args = {
+  dimensions: {
+    dx: ["Uvn6LCg7dVU", "OdiHJayrsKo", "sB79w2hiLp8", "AUqdhY4mpvp"],
+    pe: ["LAST_6_MONTHS"],
+    ou: ["USER_ORGUNIT_CHILDREN"]
+  },
+  layout: {
+    columns: ["dx"],
+    filters: [],
+    rows: ["ou", "pe"]
+  },
+  defaultVisualizationType: "pivot-table",
+  config: {
+    chart: {
+      layout: {
+        series: ["dx"],
+        category: ["pe"],
+        filter: ["ou"]
+      },
+      type: "column"
+    },
+    map: {
+      thematicLayers: [{
+        type: "choropleth",
+        id: "Uvn6LCg7dVU",
+        enabled: true,
+        control: {
+          enabled: true,
+          position: "topright"
+        },
+        dataItem: {
+          displayName: "Uvn6LCg7dVU",
+          id: "Uvn6LCg7dVU",
+          type: "indicator",
+          legendConfig: {
+            colorClass: "BrBG",
+            scale: 7
+          }
+        }
+      }, {
+        type: "choropleth",
+        id: "OdiHJayrsKo",
+        enabled: true,
+        control: {
+          enabled: true,
+          position: "topright"
+        },
+        dataItem: {
+          displayName: "OdiHJayrsKo",
+          id: "OdiHJayrsKo",
+          type: "indicator",
+          legendConfig: {
+            colorClass: "BrBG",
+            scale: 7
+          }
+        }
+      }, {
+        type: "choropleth",
+        id: "sB79w2hiLp8",
+        enabled: true,
+        control: {
+          enabled: true,
+          position: "topright"
+        },
+        dataItem: {
+          displayName: "sB79w2hiLp8",
+          id: "sB79w2hiLp8",
+          type: "indicator",
+          legendConfig: {
+            colorClass: "BrBG",
+            scale: 7
+          }
+        }
+      }, {
+        type: "choropleth",
+        id: "AUqdhY4mpvp",
+        enabled: true,
+        control: {
+          enabled: true,
+          position: "topright"
+        },
+        dataItem: {
+          displayName: "AUqdhY4mpvp",
+          id: "AUqdhY4mpvp",
+          type: "indicator",
+          legendConfig: {
+            colorClass: "BrBG",
+            scale: 7
+          }
+        }
+      }],
+      legends: {
+        enabled: true,
+        position: "topright",
+        collapsible: true
+      }
+    },
+    pivotTable: {
+      fixColumnHeaders: true,
+      fixRowHeaders: true
+    }
+  }
+};
+export default {
+  title: "Analytics/Visualization",
+  component: Visualization,
+  decorators: [ChartStory => {
+    return /*#__PURE__*/React.createElement(Box, {
+      width: "600",
+      height: "500"
+    }, /*#__PURE__*/React.createElement(Card, null, /*#__PURE__*/React.createElement("div", {
+      style: {
+        width: 1000,
+        height: "100%",
+        display: "flex",
+        gap: 8,
+        flexDirection: "column"
+      }
+    }, /*#__PURE__*/React.createElement(CssReset, null), /*#__PURE__*/React.createElement(ChartStory, null))));
+  }]
+};

package/build/es/components/Visualization/components/AnalyticsDataProvider/index.js

@@ -0,0 +1,90 @@
+import React, { createContext, useContext, useEffect, useMemo } from "react";
+import { useDimensions } from "../DimensionsProvider";
+import { useDataQuery } from "@dhis2/app-runtime";
+import { useLayout } from "../LayoutProvider";
+import { forEach, set } from "lodash";
+const AnalyticsContext = /*#__PURE__*/createContext(undefined);
+const analyticsQuery = {
+  analytics: {
+    resource: "analytics",
+    params: _ref => {
+      let {
+        dimensions,
+        filters
+      } = _ref;
+      return {
+        dimension: Object.keys(dimensions).map(dimension => {
+          var _dimensions$dimension;
+          return `${dimension}:${(_dimensions$dimension = dimensions[dimension]) === null || _dimensions$dimension === void 0 ? void 0 : _dimensions$dimension.join(';')}`;
+        }),
+        filters: Object.keys(filters).map(dimension => {
+          var _dimensions$dimension2;
+          return `${dimension}:${(_dimensions$dimension2 = dimensions[dimension]) === null || _dimensions$dimension2 === void 0 ? void 0 : _dimensions$dimension2.join(';')}`;
+        }),
+        includeMetadataDetails: true
+      };
+    }
+  }
+};
+export function useAnalyticsData() {
+  var _useContext;
+  return (_useContext = useContext(AnalyticsContext)) !== null && _useContext !== void 0 ? _useContext : {
+    analytics: {},
+    loading: false
+  };
+}
+export function AnalyticsDataProvider(_ref2) {
+  let {
+    children
+  } = _ref2;
+  const [analyticsDimensions] = useDimensions();
+  const [layout] = useLayout();
+  const {
+    dimensions,
+    filters
+  } = useMemo(() => {
+    var _layout$columns, _layout$rows, _layout$filters;
+    const dimensions = {};
+    const filters = {};
+    forEach([...((_layout$columns = layout === null || layout === void 0 ? void 0 : layout.columns) !== null && _layout$columns !== void 0 ? _layout$columns : []), ...((_layout$rows = layout === null || layout === void 0 ? void 0 : layout.rows) !== null && _layout$rows !== void 0 ? _layout$rows : [])], dimension => {
+      set(dimensions, [dimension], analyticsDimensions === null || analyticsDimensions === void 0 ? void 0 : analyticsDimensions[dimension]);
+    });
+    forEach([...((_layout$filters = layout === null || layout === void 0 ? void 0 : layout.filters) !== null && _layout$filters !== void 0 ? _layout$filters : [])], dimension => {
+      set(dimensions, [dimension], analyticsDimensions === null || analyticsDimensions === void 0 ? void 0 : analyticsDimensions[dimension]);
+    });
+    return {
+      dimensions,
+      filters
+    };
+  }, [layout, analyticsDimensions.pe, analyticsDimensions.ou]);
+  const {
+    data: analytics,
+    error,
+    loading,
+    refetch,
+    called
+  } = useDataQuery(analyticsQuery, {
+    variables: {
+      dimensions,
+      filters
+    },
+    lazy: true
+  });
+  useEffect(() => {
+    refetch({
+      dimensions,
+      filters
+    });
+  }, [dimensions, filters]);
+  useEffect(() => {
+    if (error) {
+      throw error;
+    }
+  }, [error]);
+  return /*#__PURE__*/React.createElement(AnalyticsContext.Provider, {
+    value: {
+      analytics: analytics === null || analytics === void 0 ? void 0 : analytics.analytics,
+      loading
+    }
+  }, children);
+}

package/build/es/components/Visualization/components/DimensionsProvider/index.js

@@ -0,0 +1,34 @@
+import React, { createContext, useContext, useReducer } from "react";
+import { set } from "lodash";
+export const DimensionState = /*#__PURE__*/createContext({
+  dx: [],
+  pe: [],
+  ou: []
+});
+export const DimensionUpdateState = /*#__PURE__*/createContext(undefined);
+function reducer(state, _ref) {
+  let {
+    dimension,
+    value
+  } = _ref;
+  const updatedState = {
+    ...(state !== null && state !== void 0 ? state : {})
+  };
+  set(updatedState, [dimension], value);
+  return updatedState;
+}
+export function useDimensions() {
+  return [useContext(DimensionState), useContext(DimensionUpdateState)];
+}
+export function DimensionsProvider(_ref2) {
+  let {
+    children,
+    dimensions
+  } = _ref2;
+  const [state, dispatch] = useReducer(reducer, dimensions);
+  return /*#__PURE__*/React.createElement(DimensionState.Provider, {
+    value: state
+  }, /*#__PURE__*/React.createElement(DimensionUpdateState.Provider, {
+    value: dispatch
+  }, children));
+}

package/build/es/components/Visualization/components/LayoutProvider/index.js

@@ -0,0 +1,20 @@
+import React, { createContext, useContext, useState } from "react";
+export const LayoutState = /*#__PURE__*/createContext(undefined);
+export function useLayout() {
+  var _useContext;
+  return [(_useContext = useContext(LayoutState)) !== null && _useContext !== void 0 ? _useContext : {
+    rows: [],
+    filters: [],
+    columns: []
+  }];
+}
+export function LayoutProvider(_ref) {
+  let {
+    defaultLayout,
+    children
+  } = _ref;
+  const [layout, setLayout] = useState(defaultLayout);
+  return /*#__PURE__*/React.createElement(LayoutState.Provider, {
+    value: layout
+  }, children);
+}

package/build/es/components/Visualization/components/VisualizationDimensionSelector/index.js

@@ -0,0 +1,64 @@
+import React, { useCallback, useMemo, useState } from "react";
+import { Button, IconClock24, IconLocation24, Tooltip } from "@dhis2/ui";
+import i18n from '@dhis2/d2-i18n';
+import { useDimensions } from "../DimensionsProvider";
+import { OrgUnitSelectorModal, PeriodSelectorModal } from "@hisptz/dhis2-ui";
+import { getOrgUnitSelectionFromIds } from "../VisualizationSelector";
+import { getOrgUnitsSelection } from "../../../Map/utils/map";
+export function VisualizationDimensionSelector() {
+  const [dimensions, setDimensions] = useDimensions();
+  const periods = useMemo(() => dimensions.pe, [dimensions.pe]);
+  const orgUnitSelection = useMemo(() => {
+    var _dimensions$ou;
+    return getOrgUnitSelectionFromIds((_dimensions$ou = dimensions.ou) !== null && _dimensions$ou !== void 0 ? _dimensions$ou : []);
+  }, [dimensions.ou]);
+  const [openFilter, setOpenFilter] = useState();
+  const onFilterUpdate = useCallback(type => data => {
+    setOpenFilter(undefined);
+    if (type === "ou") {
+      setDimensions({
+        dimension: "ou",
+        value: getOrgUnitsSelection(data)
+      });
+      return;
+    }
+    if (type === "pe") {
+      setDimensions({
+        dimension: "pe",
+        value: data
+      });
+      return;
+    }
+  }, [setDimensions]);
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(PeriodSelectorModal, {
+    position: "middle",
+    enablePeriodSelector: true,
+    selectedPeriods: periods,
+    onClose: () => setOpenFilter(undefined),
+    hide: openFilter !== "pe",
+    onUpdate: onFilterUpdate("pe")
+  }), /*#__PURE__*/React.createElement(OrgUnitSelectorModal, {
+    showUserOptions: true,
+    searchable: true,
+    title: i18n.t("Select location(s)"),
+    value: orgUnitSelection,
+    onClose: () => setOpenFilter(undefined),
+    hide: openFilter !== "ou",
+    onUpdate: onFilterUpdate("ou")
+  }), /*#__PURE__*/React.createElement("div", {
+    style: {
+      display: "flex",
+      gap: 8
+    }
+  }, /*#__PURE__*/React.createElement(Tooltip, {
+    content: i18n.t("Period")
+  }, /*#__PURE__*/React.createElement(Button, {
+    onClick: () => setOpenFilter("pe"),
+    icon: /*#__PURE__*/React.createElement(IconClock24, null)
+  })), /*#__PURE__*/React.createElement(Tooltip, {
+    content: i18n.t("Location")
+  }, /*#__PURE__*/React.createElement(Button, {
+    onClick: () => setOpenFilter("ou"),
+    icon: /*#__PURE__*/React.createElement(IconLocation24, null)
+  }))));
+}

package/build/es/components/Visualization/components/VisualizationProvider/index.js

@@ -0,0 +1,22 @@
+import React from "react";
+import { LayoutProvider } from "../LayoutProvider";
+import { DimensionsProvider } from "../DimensionsProvider";
+import { AnalyticsDataProvider } from "../AnalyticsDataProvider";
+import { VisualizationTypeProvider } from "../VisualizationTypeProvider";
+export function VisualizationProvider(_ref) {
+  let {
+    layout,
+    dimensions,
+    children,
+    type,
+    config
+  } = _ref;
+  return /*#__PURE__*/React.createElement(DimensionsProvider, {
+    dimensions: dimensions
+  }, /*#__PURE__*/React.createElement(VisualizationTypeProvider, {
+    config: config,
+    defaultType: type
+  }, /*#__PURE__*/React.createElement(LayoutProvider, {
+    defaultLayout: layout
+  }, /*#__PURE__*/React.createElement(AnalyticsDataProvider, null, children))));
+}