@redsift/dashboard 11.5.0 → 11.6.0-alpha.0

package/index.js

@@ -1,17 +1,11 @@
-import { ColorTheme, useColor, scheme } from '@redsift/charts';
 export { ChartSize, ColorTheme } from '@redsift/charts';
-import React, { forwardRef, useRef, useState, useReducer, useMemo, useContext, useEffect, isValidElement } from 'react';
-import { mdiRefresh } from '@redsift/icons';
-import styled, { css } from 'styled-components';
-import { Button, Spinner, RedsiftColorBlueD1, Flexbox, useId, useTheme, isComponent } from '@redsift/design-system';
-import classNames from 'classnames';
-import { useGridApiRef, gridFilteredSortedRowEntriesSelector, gridVisibleColumnDefinitionsSelector, gridColumnsTotalWidthSelector } from '@mui/x-data-grid-pro';
-import crossfilter from 'crossfilter2';
-import { saveAs } from 'file-saver';
-import { Font, StyleSheet, Document, Page, View, Image, Text, pdf } from '@react-pdf/renderer';
-import domToImage from 'dom-to-image';
-import { config, barChart, filters, redrawAll, filterAll } from 'dc';
-import { utcParse, timeFormat, isoParse, timeMonth, scaleTime, timeMonths, timeYear, timeYears, timeWeek, timeWeeks, timeDay, timeDays, timeHour, timeHours } from 'd3';
+export { C as ChartEmptyState } from './_internal/ChartEmptyState2.js';
+export { D as Dashboard, a as DashboardReducer } from './_internal/Dashboard2.js';
+export { D as DashboardContext, i as initialState } from './_internal/context.js';
+export { D as DashboardReducerActionType } from './_internal/types.js';
+export { P as PdfExportButton } from './_internal/PdfExportButton2.js';
+export { T as TimeSeriesBarChart, a as TimeSeriesBarChartSize, b as TimeSeriesBarChartTheme } from './_internal/TimeSeriesBarChart2.js';
+export { W as WithFilters } from './_internal/WithFilters2.js';
 
 const groupReduceCount = d => d.group().reduceCount();
 const COUNT = groupReduceCount;
@@ -19,1940 +13,5 @@ const COUNT = groupReduceCount;
 const groupReduceSum = field => d => d.group().reduceSum(d => d[field]);
 const SUM = groupReduceSum;
 
-/**
- * Component style.
- */
-const StyledChartEmptyState = styled.div`
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-  align-items: center;
-  margin-top: 16px;
-
-  .redsift-chart-empty-state__title {
-    font-family: var(--redsift-typography-h4-font-family);
-    font-size: var(--redsift-typography-h4-font-size);
-    font-weight: var(--redsift-typography-h4-font-weight);
-    line-height: var(--redsift-typography-h4-line-height);
-  }
-
-  .redsift-chart-empty-state__subtitle {
-    font-family: var(--redsift-typography-body-font-family);
-    font-size: var(--redsift-typography-body-font-size);
-    font-weight: var(--redsift-typography-body-font-weight);
-    line-height: var(--redsift-typography-body-line-height);
-    margin-top: 8px;
-    text-align: center;
-  }
-`;
-const StyledResetButton = styled(Button)`
-  margin-top: 8px;
-`;
-
-const COMPONENT_NAME$3 = 'ChartEmptyState';
-const CLASSNAME$3 = 'redsift-chart-empty-state';
-const ChartEmptyState = /*#__PURE__*/forwardRef((props, ref) => {
-  const {
-    onReset,
-    title = 'No Data Available',
-    subtitle = 'Please check the applied filters',
-    resetLabel = 'Reset all filters'
-  } = props;
-  return /*#__PURE__*/React.createElement(StyledChartEmptyState, {
-    ref: ref,
-    className: "redsift-chart-empty-state"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: `${ChartEmptyState.className}__img`
-  }, /*#__PURE__*/React.createElement("svg", {
-    width: "86",
-    height: "86",
-    viewBox: "0 0 86 86",
-    fill: "none",
-    xmlns: "http://www.w3.org/2000/svg"
-  }, /*#__PURE__*/React.createElement("path", {
-    opacity: "0.2",
-    d: "M43 86C66.7482 86 86 66.7482 86 43C86 19.2518 66.7482 0 43 0C19.2518 0 0 19.2518 0 43C0 66.7482 19.2518 86 43 86Z",
-    fill: "#4285F4"
-  }), /*#__PURE__*/React.createElement("path", {
-    opacity: "0.4",
-    d: "M13.4479 45.9299C13.4479 44.8254 14.3434 43.9299 15.4479 43.9299H29.3785C30.4831 43.9299 31.3785 44.8254 31.3785 45.9299V60.0675H13.4479V45.9299Z",
-    fill: "#4285F4"
-  }), /*#__PURE__*/React.createElement("path", {
-    opacity: "0.4",
-    d: "M34.0681 27.9993C34.0681 26.8948 34.9636 25.9993 36.0681 25.9993H49.9987C51.1033 25.9993 51.9987 26.8948 51.9987 27.9993V60.0675H34.0681V27.9993Z",
-    fill: "#4285F4"
-  }), /*#__PURE__*/React.createElement("path", {
-    opacity: "0.4",
-    d: "M54.6883 53.1022C54.6883 51.9976 55.5837 51.1022 56.6883 51.1022H70.6189C71.7235 51.1022 72.6189 51.9976 72.6189 53.1022V60.0675H54.6883V53.1022Z",
-    fill: "#4285F4"
-  }), /*#__PURE__*/React.createElement("line", {
-    x1: "10.3618",
-    y1: "60.464",
-    x2: "75.705",
-    y2: "60.464",
-    stroke: "#305AA2",
-    strokeLinecap: "round"
-  }), /*#__PURE__*/React.createElement("path", {
-    d: "M48.7345 25.9993H46.9414L51.9987 28.9192V27.8839L48.7345 25.9993Z",
-    fill: "#4285F4"
-  }), /*#__PURE__*/React.createElement("path", {
-    d: "M41.5622 25.9993L51.9987 32.0249V30.9896L43.3553 25.9993H41.5622Z",
-    fill: "#4285F4"
-  }), /*#__PURE__*/React.createElement("path", {
-    d: "M36.183 25.9993L51.9987 35.1305V34.0953L37.9761 25.9993H36.183Z",
-    fill: "#4285F4"
-  }), /*#__PURE__*/React.createElement("path", {
-    d: "M34.0771 27.622C34.0681 27.6758 34.0681 27.7296 34.0681 27.7924V27.8839L51.9987 38.2362V37.201L34.281 26.9716C34.1776 27.171 34.097 27.3834 34.0771 27.622Z",
-    fill: "#4285F4"
-  }), /*#__PURE__*/React.createElement("path", {
-    d: "M34.0681 30.9896L51.9987 41.3418V40.3066L34.0681 29.9544V30.9896Z",
-    fill: "#4285F4"
-  }), /*#__PURE__*/React.createElement("path", {
-    d: "M34.0681 34.0953L51.9987 44.4475V43.4123L34.0681 33.06V34.0953Z",
-    fill: "#4285F4"
-  }), /*#__PURE__*/React.createElement("path", {
-    d: "M34.0681 37.2009L51.9987 47.5531V46.518L34.0681 36.1657V37.2009Z",
-    fill: "#4285F4"
-  }), /*#__PURE__*/React.createElement("path", {
-    d: "M34.0681 40.3066L51.9987 50.6588V49.6236L34.0681 39.2714V40.3066Z",
-    fill: "#4285F4"
-  }), /*#__PURE__*/React.createElement("path", {
-    d: "M34.0681 43.4123L51.9987 53.7645V52.7293L34.0681 42.377V43.4123Z",
-    fill: "#4285F4"
-  }), /*#__PURE__*/React.createElement("path", {
-    d: "M34.0681 46.518L51.9987 56.8702V55.835L34.0681 45.4827V46.518Z",
-    fill: "#4285F4"
-  }), /*#__PURE__*/React.createElement("path", {
-    d: "M34.0681 49.6236L51.9987 59.9759V58.9407L34.0681 48.5884V49.6236Z",
-    fill: "#4285F4"
-  }), /*#__PURE__*/React.createElement("path", {
-    d: "M34.0681 52.7293L46.7782 60.0675H48.5712L34.0681 51.6941V52.7293Z",
-    fill: "#4285F4"
-  }), /*#__PURE__*/React.createElement("path", {
-    d: "M34.0681 55.835L41.399 60.0675H43.192L34.0681 54.7997V55.835Z",
-    fill: "#4285F4"
-  }), /*#__PURE__*/React.createElement("path", {
-    d: "M34.0681 58.9406L36.0198 60.0675H37.8129L34.0681 57.9054V58.9406Z",
-    fill: "#4285F4"
-  }), /*#__PURE__*/React.createElement("circle", {
-    opacity: "0.6",
-    cx: "50.5506",
-    cy: "29.9304",
-    r: "10.1549",
-    transform: "rotate(-45 50.5506 29.9304)",
-    fill: "white",
-    stroke: "#305AA2",
-    strokeWidth: "3"
-  }), /*#__PURE__*/React.createElement("circle", {
-    cx: "50.5506",
-    cy: "29.9304",
-    r: "10.1549",
-    transform: "rotate(-45 50.5506 29.9304)",
-    stroke: "#305AA2",
-    strokeWidth: "3"
-  }), /*#__PURE__*/React.createElement("path", {
-    d: "M59.2186 36.4771L58.1579 35.4164L56.0366 37.5377L57.0973 38.5984L59.2186 36.4771ZM65.9725 47.4736C66.5582 48.0594 67.508 48.0594 68.0938 47.4736C68.6796 46.8878 68.6796 45.938 68.0938 45.3522L65.9725 47.4736ZM57.0973 38.5984L65.9725 47.4736L68.0938 45.3522L59.2186 36.4771L57.0973 38.5984Z",
-    fill: "#305AA2"
-  }))), /*#__PURE__*/React.createElement("div", {
-    className: `${ChartEmptyState.className}__title`
-  }, title), /*#__PURE__*/React.createElement("div", {
-    className: `${ChartEmptyState.className}__subtitle`
-  }, subtitle), onReset ? /*#__PURE__*/React.createElement(StyledResetButton, {
-    variant: "unstyled",
-    leftIcon: mdiRefresh,
-    onClick: onReset
-  }, resetLabel) : null);
-});
-ChartEmptyState.className = CLASSNAME$3;
-ChartEmptyState.displayName = COMPONENT_NAME$3;
-
-function ownKeys(object, enumerableOnly) {
-  var keys = Object.keys(object);
-  if (Object.getOwnPropertySymbols) {
-    var symbols = Object.getOwnPropertySymbols(object);
-    enumerableOnly && (symbols = symbols.filter(function (sym) {
-      return Object.getOwnPropertyDescriptor(object, sym).enumerable;
-    })), keys.push.apply(keys, symbols);
-  }
-  return keys;
-}
-function _objectSpread2(target) {
-  for (var i = 1; i < arguments.length; i++) {
-    var source = null != arguments[i] ? arguments[i] : {};
-    i % 2 ? ownKeys(Object(source), !0).forEach(function (key) {
-      _defineProperty(target, key, source[key]);
-    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) {
-      Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
-    });
-  }
-  return target;
-}
-function _defineProperty(obj, key, value) {
-  key = _toPropertyKey(key);
-  if (key in obj) {
-    Object.defineProperty(obj, key, {
-      value: value,
-      enumerable: true,
-      configurable: true,
-      writable: true
-    });
-  } else {
-    obj[key] = value;
-  }
-  return 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);
-}
-function _objectWithoutPropertiesLoose(source, excluded) {
-  if (source == null) return {};
-  var target = {};
-  var sourceKeys = Object.keys(source);
-  var key, i;
-  for (i = 0; i < sourceKeys.length; i++) {
-    key = sourceKeys[i];
-    if (excluded.indexOf(key) >= 0) continue;
-    target[key] = source[key];
-  }
-  return target;
-}
-function _objectWithoutProperties(source, excluded) {
-  if (source == null) return {};
-  var target = _objectWithoutPropertiesLoose(source, excluded);
-  var key, i;
-  if (Object.getOwnPropertySymbols) {
-    var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
-    for (i = 0; i < sourceSymbolKeys.length; i++) {
-      key = sourceSymbolKeys[i];
-      if (excluded.indexOf(key) >= 0) continue;
-      if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
-      target[key] = source[key];
-    }
-  }
-  return target;
-}
-function _toPrimitive(input, hint) {
-  if (typeof input !== "object" || input === null) return input;
-  var prim = input[Symbol.toPrimitive];
-  if (prim !== undefined) {
-    var res = prim.call(input, hint || "default");
-    if (typeof res !== "object") return res;
-    throw new TypeError("@@toPrimitive must return a primitive value.");
-  }
-  return (hint === "string" ? String : Number)(input);
-}
-function _toPropertyKey(arg) {
-  var key = _toPrimitive(arg, "string");
-  return typeof key === "symbol" ? key : String(key);
-}
-
-const initialState = {
-  tableFilters: []
-};
-const DashboardContext = /*#__PURE__*/React.createContext({
-  state: initialState
-});
-
-/**
- * Context props.
- */
-
-/**
- * Reducer props.
- */
-
-let DashboardReducerActionType = /*#__PURE__*/function (DashboardReducerActionType) {
-  DashboardReducerActionType["ResetFilter"] = "reset-filter";
-  DashboardReducerActionType["ResetFilters"] = "reset-filters";
-  DashboardReducerActionType["FilterTable"] = "filter-table";
-  DashboardReducerActionType["FilterTableBatch"] = "filter-table-batch";
-  DashboardReducerActionType["AppendFilterTableBatch"] = "append-filter-table-batch";
-  return DashboardReducerActionType;
-}({});
-
-/**
- * Component props.
- */
-
-const areEquals = (tableFilter, actionFilter) => {
-  return tableFilter.field === actionFilter.field && tableFilter.operator === actionFilter.operator;
-};
-const addOrUpdateFilter = (oldFilters, newFilter) => {
-  if (oldFilters.find(f => areEquals(f, newFilter))) {
-    return oldFilters.map(f => {
-      if (areEquals(f, newFilter)) {
-        return newFilter;
-      }
-      return f;
-    });
-  } else {
-    return [...oldFilters, newFilter];
-  }
-};
-const addOrUpdateFilters = (oldFilters, newFilters) => {
-  let updatedFilters = oldFilters;
-  for (let i = 0; i < newFilters.length; i++) {
-    updatedFilters = addOrUpdateFilter(updatedFilters, newFilters[i]);
-  }
-  return updatedFilters;
-};
-const replaceFilters = newFilters => {
-  return Array.isArray(newFilters) ? newFilters : [newFilters];
-};
-const removeFilter = (oldFilters, newFilter) => {
-  return oldFilters.filter(f => !areEquals(f, newFilter));
-};
-const removeAllFilters = () => {
-  return [];
-};
-const DashboardReducer = (state, action) => {
-  switch (action.type) {
-    case DashboardReducerActionType.ResetFilter:
-      return _objectSpread2(_objectSpread2({}, state), {}, {
-        tableFilters: removeFilter(state.tableFilters, action.filter)
-      });
-    case DashboardReducerActionType.ResetFilters:
-      return _objectSpread2(_objectSpread2({}, state), {}, {
-        tableFilters: removeAllFilters()
-      });
-    case DashboardReducerActionType.FilterTable:
-      return _objectSpread2(_objectSpread2({}, state), {}, {
-        tableFilters: addOrUpdateFilter(state.tableFilters, action.filter)
-      });
-    case DashboardReducerActionType.FilterTableBatch:
-      return _objectSpread2(_objectSpread2({}, state), {}, {
-        tableFilters: replaceFilters(action.filter)
-      });
-    case DashboardReducerActionType.AppendFilterTableBatch:
-      return _objectSpread2(_objectSpread2({}, state), {}, {
-        tableFilters: addOrUpdateFilters(state.tableFilters, action.filter)
-      });
-  }
-};
-
-const CrossfilterRegistry = (() => {
-  const instances = new WeakMap();
-  const get = data => {
-    let instance = instances.get(data);
-    if (!instance) {
-      instance = crossfilter(data);
-      instances.set(data, instance);
-    }
-    return instance;
-  };
-  const remove = data => {
-    instances.delete(data);
-  };
-  return {
-    get,
-    remove
-  };
-})();
-
-const _excluded$2 = ["children", "className", "data", "dataGridApiRef"];
-const COMPONENT_NAME$2 = 'Dashboard';
-const CLASSNAME$2 = 'redsift-dashboard-container';
-const Dashboard = /*#__PURE__*/forwardRef((props, ref) => {
-  const {
-      children,
-      className,
-      data,
-      dataGridApiRef: propsDataGridApiRef
-    } = props,
-    forwardedProps = _objectWithoutProperties(props, _excluded$2);
-  const providerRef = ref || useRef();
-  const dataGridApiRef = propsDataGridApiRef || useGridApiRef();
-  const [updateContext, setUpdateContext] = useState(false);
-  const [state, dispatch] = useReducer(DashboardReducer, {
-    tableFilters: []
-  });
-  const value = useMemo(() => ({
-    dashboardRef: providerRef,
-    data,
-    dataGridApiRef,
-    dispatch,
-    ndx: CrossfilterRegistry.get(data),
-    state,
-    toggleUpdateContext: () => setUpdateContext(!updateContext)
-  }), [data, state, updateContext]);
-  return /*#__PURE__*/React.createElement("div", _extends({}, forwardedProps, {
-    className: classNames(Dashboard.className, className),
-    ref: providerRef
-  }), /*#__PURE__*/React.createElement(DashboardContext.Provider, {
-    value: value
-  }, children));
-});
-Dashboard.className = CLASSNAME$2;
-Dashboard.displayName = COMPONENT_NAME$2;
-
-// istanbul ignore file
-const BACKGROUND_COLOR = '#F8F8F8';
-const GREY_1 = '#E2E6EA';
-const GREY_2 = '#bff0fd';
-const getPdfStyles = primaryColor => {
-  Font.register({
-    family: 'Source Code Pro',
-    fonts: [{
-      src: 'https://fonts.gstatic.com/s/sourcecodepro/v7/HI_SiYsKILxRpg3hIP6sJ7fM7PqlM-vT.ttf'
-    }]
-  });
-  Font.register({
-    family: 'Roboto',
-    fonts: [{
-      fontWeight: 700,
-      src: 'https://cdnjs.cloudflare.com/ajax/libs/materialize/0.98.0/fonts/roboto/Roboto-Regular.ttf'
-    }, {
-      fontWeight: 400,
-      src: 'https://cdnjs.cloudflare.com/ajax/libs/ink/3.1.10/fonts/Roboto/roboto-light-webfont.ttf'
-    }]
-  });
-  return StyleSheet.create({
-    page: {
-      borderTopStyle: 'solid',
-      borderTopWidth: 32,
-      borderTopColor: primaryColor,
-      borderBottomStyle: 'solid',
-      borderBottomWidth: 6,
-      borderBottomColor: primaryColor,
-      backgroundColor: BACKGROUND_COLOR,
-      paddingTop: 20,
-      paddingBottom: 40
-    },
-    logoContainer: {
-      margin: 0,
-      paddingBottom: 10,
-      alignItems: 'center',
-      width: '100%'
-    },
-    logo: {
-      width: 'auto',
-      height: 30
-    },
-    introductionContainer: {
-      lineHeight: 1.4,
-      textAlign: 'center',
-      marginHorizontal: 40,
-      marginVertical: 10
-    },
-    introductionText: {
-      fontSize: 8,
-      fontFamily: 'Roboto',
-      fontWeight: 400,
-      color: 'black'
-    },
-    pageNumber: {
-      fontFamily: 'Source Code Pro',
-      position: 'absolute',
-      fontSize: 6,
-      bottom: 5,
-      right: 20,
-      left: 0,
-      textAlign: 'right',
-      color: 'black'
-    },
-    pageContinue: {
-      fontSize: 8,
-      fontFamily: 'Roboto',
-      fontWeight: 400,
-      top: -10,
-      left: 20
-    },
-    tableContainer: {
-      backgroundColor: 'white',
-      marginHorizontal: 20,
-      marginVertical: 10,
-      paddingTop: 10,
-      paddingLeft: 10,
-      borderRightWidth: 1,
-      borderBottomWidth: 1,
-      borderRightColor: BACKGROUND_COLOR,
-      borderBottomColor: GREY_1,
-      width: 'auto'
-    },
-    tableRowContainer: {
-      flexDirection: 'row',
-      borderBottomColor: GREY_2,
-      alignItems: 'flex-start',
-      fontSize: 8,
-      marginLeft: 16,
-      marginRight: 24,
-      height: 'auto'
-    },
-    tableHeaderContainer: {
-      flexDirection: 'row',
-      alignItems: 'flex-start',
-      fontSize: 7,
-      fontFamily: 'Roboto',
-      fontWeight: 700,
-      marginLeft: 16,
-      marginRight: 24,
-      marginBottom: 12,
-      paddingTop: 12,
-      paddingBottom: 12,
-      borderBottomWidth: 2,
-      borderBottomColor: primaryColor
-    },
-    tableCellHeaderText: {
-      fontSize: 7,
-      fontFamily: 'Roboto',
-      fontWeight: 700,
-      color: 'black',
-      overflow: 'hidden'
-    },
-    tableCellText: {
-      fontSize: 6,
-      lineHeight: 1.5,
-      fontFamily: 'Roboto',
-      fontWeight: 400,
-      color: 'black',
-      overflow: 'hidden'
-    },
-    dashboardImageContainer: {
-      marginHorizontal: 20,
-      marginTop: 0,
-      marginBottom: 10
-    },
-    constraintsContainer: {
-      width: 'auto',
-      height: 'auto',
-      paddingVertical: 30,
-      textAlign: 'center'
-    },
-    constraints: {
-      fontSize: 6,
-      fontFamily: 'Roboto',
-      fontWeight: 700,
-      color: 'black'
-    }
-  });
-};
-
-// istanbul ignore file
-const DEFAULT_COLUMN_WIDTH = 100;
-const getWidthColumn = (width, totalW, nrColumns) => {
-  // calculation width column where the 7px margin between the columns is included
-  return `${Math.round(width * 100 / (totalW - 7 * (nrColumns - 1)))}%`;
-};
-const PdfTableRow = _ref => {
-  let {
-    rowIndex,
-    rowData,
-    columns,
-    styles,
-    totalWidth
-  } = _ref;
-  return /*#__PURE__*/React.createElement(View, {
-    style: styles.tableRowContainer,
-    key: `row-${rowIndex}`
-  }, columns.map((column, index) => {
-    const {
-      field,
-      width
-    } = column;
-    let totalW = totalWidth;
-    let nrColumns = columns.length;
-
-    // The checkbox in the table will not be printed
-    if (field === '__check__') {
-      totalW = totalW - (width || 50);
-      nrColumns = nrColumns - 1;
-      return;
-    }
-    const widthColumn = getWidthColumn(width || DEFAULT_COLUMN_WIDTH, totalW, nrColumns);
-
-    // Empty value will print '-'
-    if (!rowData[field]) {
-      return /*#__PURE__*/React.createElement(View, {
-        style: {
-          width: widthColumn,
-          paddingVertical: 2,
-          marginRight: 7
-        },
-        key: `cell-${rowIndex}-${index}`
-      }, /*#__PURE__*/React.createElement(Text, {
-        style: styles.tableCellText
-      }, '-'));
-    }
-    return /*#__PURE__*/React.createElement(View, {
-      style: {
-        width: widthColumn,
-        paddingVertical: 2,
-        marginRight: 7
-      },
-      key: `cell-${rowIndex}-${index}`
-    }, /*#__PURE__*/React.createElement(Text, {
-      style: styles.tableCellText
-    }, Array.isArray(rowData[field]) ? rowData[field].join(', ') : rowData[field]));
-  }));
-};
-const PdfTable = _ref2 => {
-  let {
-    dataTable,
-    styles,
-    localeText
-  } = _ref2;
-  const {
-    data,
-    columns,
-    totalWidth
-  } = dataTable;
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(View, {
-    style: styles.tableHeaderContainer
-  }, columns.map(column => {
-    let totalW = totalWidth;
-    let nrColumns = columns.length;
-    const {
-      field,
-      headerName,
-      width
-    } = column;
-
-    // The checkbox in the table will not be printed
-    if (field === '__check__') {
-      totalW = totalW - (width || 50);
-      nrColumns = nrColumns - 1;
-      return;
-    }
-    const widthColumn = getWidthColumn(width || DEFAULT_COLUMN_WIDTH, totalW, nrColumns);
-    return /*#__PURE__*/React.createElement(View, {
-      style: {
-        width: widthColumn,
-        paddingVertical: 2,
-        marginRight: 7
-      },
-      key: `heading-${field}`
-    }, /*#__PURE__*/React.createElement(Text, {
-      style: styles.tableCellHeaderText
-    }, headerName));
-  })), /*#__PURE__*/React.createElement(View, null, data.map((row, index) => {
-    if (index < 1000) {
-      return /*#__PURE__*/React.createElement(PdfTableRow, {
-        key: index,
-        rowIndex: index,
-        rowData: data[index],
-        columns: columns,
-        styles: styles,
-        totalWidth: totalWidth
-      });
-    }
-  })), data.length >= 1000 ? /*#__PURE__*/React.createElement(View, {
-    style: styles.constraintsContainer
-  }, /*#__PURE__*/React.createElement(Text, {
-    style: styles.constraints
-  }, (localeText === null || localeText === void 0 ? void 0 : localeText.maxSizeDisclaimer) || 'Due to processing constraints this pdf is limited to the first 1000 rows of data.')) : null);
-};
-const Pagination = _ref3 => {
-  let {
-    styles
-  } = _ref3;
-  return /*#__PURE__*/React.createElement(Text, {
-    style: styles.pageNumber,
-    render: _ref4 => {
-      let {
-        pageNumber,
-        totalPages
-      } = _ref4;
-      return `${pageNumber}/${totalPages}`;
-    },
-    fixed: true
-  });
-};
-const PdfDocument = _ref5 => {
-  let {
-    dashboardImage,
-    introduction,
-    localeText,
-    logo,
-    dataTable,
-    primaryColor
-  } = _ref5;
-  const styles = getPdfStyles(primaryColor);
-  return /*#__PURE__*/React.createElement(Document, null, /*#__PURE__*/React.createElement(Page, {
-    size: "A4",
-    style: styles.page
-  }, /*#__PURE__*/React.createElement(React.Fragment, null, logo ? /*#__PURE__*/React.createElement(View, {
-    style: styles.logoContainer
-  }, /*#__PURE__*/React.createElement(Image, {
-    src: logo,
-    style: styles.logo
-  })) : null, introduction ? /*#__PURE__*/React.createElement(View, {
-    style: styles.introductionContainer
-  }, /*#__PURE__*/React.createElement(Text, {
-    style: styles.introductionText
-  }, introduction)) : null, dashboardImage ? /*#__PURE__*/React.createElement(View, {
-    style: styles.dashboardImageContainer
-  }, /*#__PURE__*/React.createElement(Image, {
-    src: dashboardImage
-  })) : null, dataTable ? /*#__PURE__*/React.createElement(View, {
-    style: styles.tableContainer
-  }, /*#__PURE__*/React.createElement(PdfTable, {
-    dataTable: dataTable,
-    styles: styles,
-    localeText: localeText
-  })) : null, /*#__PURE__*/React.createElement(Pagination, {
-    styles: styles
-  }))));
-};
-
-const _excluded$1 = ["children", "className", "componentRef", "fileName", "introduction", "localeText", "logo", "onClick", "primaryColor"];
-const COMPONENT_NAME$1 = 'PdfExportButton';
-const CLASSNAME$1 = 'redsift-pdf-export-button';
-const getDashboardImage = async componentRef => {
-  var _componentRef$current, _componentRef$current2, _componentRef$current3, _componentRef$current4;
-  const filter = el => {
-    const classList = el.classList;
-    return !(classList !== null && classList !== void 0 && classList.contains('redsift-datagrid') || classList !== null && classList !== void 0 && classList.contains('redsift-button'));
-  };
-  const dashboardHeight = componentRef.current.getBoundingClientRect().height;
-  const datagridHeight = ((_componentRef$current = componentRef.current) === null || _componentRef$current === void 0 ? void 0 : (_componentRef$current2 = _componentRef$current.getElementsByClassName('redsift-datagrid')) === null || _componentRef$current2 === void 0 ? void 0 : (_componentRef$current3 = _componentRef$current2[0]) === null || _componentRef$current3 === void 0 ? void 0 : (_componentRef$current4 = _componentRef$current3.getBoundingClientRect()) === null || _componentRef$current4 === void 0 ? void 0 : _componentRef$current4.height) || 0;
-  return new Promise(resolve => {
-    domToImage.toPng(componentRef.current, {
-      filter,
-      height: dashboardHeight - datagridHeight
-    }).then(function (dataUrl) {
-      resolve(dataUrl);
-    }).catch(() => {
-      resolve('');
-    });
-  });
-};
-const PdfExportButton = /*#__PURE__*/forwardRef((props, ref) => {
-  const {
-      children,
-      className,
-      componentRef: propComponentRef,
-      fileName,
-      introduction,
-      localeText,
-      logo,
-      onClick,
-      primaryColor
-    } = props,
-    forwardedProps = _objectWithoutProperties(props, _excluded$1);
-  const [componentRef, setComponentRef] = useState(propComponentRef);
-  const [isLoading, setIsLoading] = useState(false);
-  const {
-    dashboardRef,
-    dataGridApiRef
-  } = useContext(DashboardContext);
-  useEffect(() => {
-    if (!componentRef || !componentRef.current) {
-      setComponentRef(dashboardRef);
-    }
-  }, [dashboardRef]);
-  const exportPdf = async () => {
-    if (onClick) {
-      onClick();
-    }
-    setIsLoading(true);
-    try {
-      const dashboardImage = await getDashboardImage(componentRef || dashboardRef);
-      let dataTable;
-      if (dataGridApiRef && dataGridApiRef.current && Object.keys(dataGridApiRef.current).length) {
-        dataTable = {
-          data: gridFilteredSortedRowEntriesSelector(dataGridApiRef.current.state, dataGridApiRef.current.instanceId).slice(0, 1000).map(_ref => {
-            let {
-              model
-            } = _ref;
-            return model;
-          }),
-          columns: gridVisibleColumnDefinitionsSelector(dataGridApiRef.current.state, dataGridApiRef.current.instanceId),
-          totalWidth: gridColumnsTotalWidthSelector(dataGridApiRef.current.state, dataGridApiRef.current.instanceId)
-        };
-      }
-      const doc = /*#__PURE__*/React.createElement(PdfDocument, {
-        localeText: localeText,
-        dashboardImage: dashboardImage,
-        introduction: introduction,
-        logo: logo,
-        primaryColor: primaryColor || RedsiftColorBlueD1,
-        dataTable: dataTable
-      });
-      const asPdf = pdf([]);
-      asPdf.updateContainer(doc);
-      const blob = await asPdf.toBlob();
-      saveAs(blob, fileName || 'redsift-dashboard.pdf');
-    } catch (e) {
-      console.log('error:', e);
-    }
-    setIsLoading(false);
-  };
-  return /*#__PURE__*/React.createElement(Button, _extends({
-    className: classNames(PdfExportButton.className, className),
-    onClick: exportPdf,
-    isDisabled: isLoading
-  }, forwardedProps, {
-    ref: ref
-  }), isLoading ? /*#__PURE__*/React.createElement(Spinner, {
-    size: "xsmall",
-    isColored: false
-  }) : null, " ", children);
-});
-PdfExportButton.className = CLASSNAME$1;
-PdfExportButton.displayName = COMPONENT_NAME$1;
-
-// istanbul ignore file
-/**
- * Component size.
- */
-const TimeSeriesBarChartSize = {
-  large: 'large',
-  medium: 'medium',
-  small: 'small'
-};
-/**
- * Component theme.
- */
-const TimeSeriesBarChartTheme = ColorTheme;
-
-/**
- * Component props.
- */
-
-// istanbul ignore file
-/**
- * Component style.
- */
-const StyledTimeSeriesBarChart = styled.div`
-  margin: 16px;
-  padding: 16px;
-
-  text {
-    fill: ${_ref => {
-  let {
-    $theme
-  } = _ref;
-  return `var(--redsift-color-${$theme}-components-text-primary)`;
-}};
-  }
-
-  .redsift-timeseries-barchart__chart {
-    display: flex;
-    font-family: var(--redsift-typography-font-family-poppins);
-    font-size: 12px;
-    justify-content: center;
-    margin: 8px 0;
-  }
-
-  svg > g {
-    margin: 8px;
-  }
-
-  .grid-line,
-  .axis .grid-line,
-  .grid-line line,
-  .axis .grid-line line {
-    fill: none;
-    stroke: #ccc;
-    shape-rendering: crispEdges;
-  }
-
-  .axis text {
-    font-family: var(--redsift-typography-font-family-poppins);
-    font-size: 10px;
-  }
-
-  g.stack rect.bar.deselected {
-    fill-opacity: 0.5;
-    fill: var(--redsift-color-neutral-mid-grey);
-  }
-
-  .brush .custom-brush-handle {
-    fill: #eee;
-    stroke: #666;
-    cursor: ew-resize;
-  }
-
-  text {
-    user-select: none;
-  }
-`;
-const StyledTimeSeriesBarChartTitle = styled(Flexbox)`
-  font-family: var(--redsift-typography-h4-font-family);
-  font-size: var(--redsift-typography-h4-font-size);
-  font-weight: var(--redsift-typography-h4-font-weight);
-  line-height: var(--redsift-typography-h4-line-height);
-`;
-const StyledTimeSeriesBarChartCaption = styled.p`
-  font-family: var(--redsift-typography-caption-font-family);
-  font-size: var(--redsift-typography-caption-font-size);
-  font-weight: var(--redsift-typography-caption-font-weight);
-  line-height: var(--redsift-typography-caption-line-height);
-`;
-const StyledTimeSeriesBarChartContainer = styled.div`
-  display: flex;
-  align-items: center;
-  gap: 16px;
-  font-family: var(--redsift-typography-font-family-poppins);
-  font-size: 11px;
-  justify-content: center;
-  margin: 8px 0;
-  position: relative;
-
-  .redsift-timeseries-barchart-container__chart {
-    position: relative;
-    ${_ref2 => {
-  let {
-    $isEmpty
-  } = _ref2;
-  return $isEmpty ? css`
-            display: none;
-          ` : '';
-}};
-  }
-`;
-
-const _excluded = ["areXLabelsRotated", "caption", "className", "colorTheme", "columnToFilter", "data", "dateTimeFieldName", "dateTimeFormat", "dateTimeGroup", "dimension", "isResetable", "localeText", "onFilter", "size", "stackedCategory", "title", "xAxisLabel", "yAxisLabel"];
-const COMPONENT_NAME = 'TimeSeriesBarChart';
-const CLASSNAME = 'redsift-timeseries-barchart';
-const getStartDate = dates => new Date(Math.min(...dates.map(Number)));
-const getEndDate = dates => new Date(Math.max(...dates.map(Number)));
-const sizeToDimension = size => {
-  switch (size) {
-    case TimeSeriesBarChartSize.small:
-      return {
-        width: 400,
-        height: 200,
-        marginLeft: 16,
-        marginTop: 16,
-        marginRight: 16,
-        marginBottom: 32
-      };
-    case TimeSeriesBarChartSize.large:
-      return {
-        width: 1000,
-        height: 300,
-        marginLeft: 16,
-        marginTop: 16,
-        marginRight: 16,
-        marginBottom: 32
-      };
-    case TimeSeriesBarChartSize.medium:
-    default:
-      return {
-        width: 600,
-        height: 250,
-        marginLeft: 16,
-        marginTop: 16,
-        marginRight: 16,
-        marginBottom: 32
-      };
-  }
-};
-const parseDateTimeGroup = (data, dateTimeGroup, dateTimeFieldName) => {
-  const dates = [...data.map(d => new Date(d[dateTimeFieldName]))];
-  const startDate = getStartDate(dates);
-  const endDate = getEndDate(dates);
-  switch (dateTimeGroup) {
-    case 'hour':
-      return {
-        group: g => timeHour(g),
-        round: x => timeHour(x),
-        x: scaleTime().domain([timeHour.offset(startDate, -1), timeHour.offset(endDate, 2)]),
-        xUnits: timeHours
-      };
-    case 'day':
-      return {
-        group: g => timeDay(g),
-        round: x => timeDay(x),
-        x: scaleTime().domain([timeDay.offset(startDate, -1), timeDay.offset(endDate, 2)]),
-        xUnits: timeDays
-      };
-    case 'week':
-      return {
-        group: g => timeWeek(g),
-        round: x => timeWeek(x),
-        x: scaleTime().domain([timeWeek.offset(startDate, -1), timeWeek.offset(endDate, 2)]),
-        xUnits: timeWeeks
-      };
-    case 'year':
-      return {
-        group: g => timeYear(g),
-        round: x => timeYear(x),
-        x: scaleTime().domain([timeYear.offset(startDate, -2), timeYear.offset(endDate, 2)]),
-        xUnits: timeYears
-      };
-    case 'month':
-    default:
-      return {
-        group: g => timeMonth(g),
-        round: x => timeMonth(x),
-        x: scaleTime().domain([timeMonth.offset(startDate, -1), timeMonth.offset(endDate, 2)]),
-        xUnits: timeMonths
-      };
-  }
-};
-const TimeSeriesBarChart = /*#__PURE__*/forwardRef((props, ref) => {
-  const containerRef = ref || useRef();
-  const chartRef = useRef();
-  const [id] = useId();
-  const [chart, setChart] = useState();
-  const {
-      areXLabelsRotated,
-      caption,
-      className,
-      colorTheme = props.stackedCategory ? TimeSeriesBarChartTheme.default : TimeSeriesBarChartTheme.monochrome,
-      columnToFilter,
-      data: propsData,
-      dateTimeFieldName,
-      dateTimeFormat = '%Y-%m-%d %H:%M:%S',
-      dateTimeGroup = 'month',
-      dimension,
-      isResetable = true,
-      localeText,
-      onFilter,
-      size = TimeSeriesBarChartSize.medium,
-      stackedCategory,
-      title,
-      xAxisLabel,
-      yAxisLabel
-    } = props,
-    forwardedProps = _objectWithoutProperties(props, _excluded);
-  const theme = useTheme();
-
-  // Get overriden labels and texts.
-  const {
-    emptyChartTitle,
-    emptyChartSubtitle,
-    emptyChartResetLabel,
-    resetLabel
-  } = _objectSpread2({
-    resetLabel: 'Reset'
-  }, localeText);
-
-  // Get charts dimensions based on the selected size.
-  const chartDimensions = sizeToDimension(size);
-
-  // Get ndx from context or initialize it.
-  const {
-    dispatch,
-    state,
-    data
-  } = useContext(DashboardContext);
-  const {
-    tableFilters
-  } = state;
-
-  // Set color scheme.
-  const colorScale = useColor({
-    data: propsData !== null && propsData !== void 0 ? propsData : data,
-    colorTheme: colorTheme,
-    category: stackedCategory !== null && stackedCategory !== void 0 ? stackedCategory : '',
-    theme
-  });
-  const ndx = CrossfilterRegistry.get(propsData ? propsData : data);
-
-  // useEffect called only once to initialize the chart.
-  useEffect(() => {
-    if (chartRef.current) {
-      config.defaultColors(scheme.default);
-      const parseTime = utcParse(dateTimeFormat);
-      const barChart$1 = barChart(chartRef.current);
-      const dataset = ndx.all();
-
-      // Get time methods based on props
-      const {
-        group,
-        round,
-        x,
-        xUnits
-      } = parseDateTimeGroup(dataset, dateTimeGroup, dateTimeFieldName);
-
-      // Compute dimension and group.
-      const computedDimension = ndx.dimension(d => parseTime(dimension(d)));
-      const timeGroup = computedDimension.group(group);
-
-      // Initialize the chart.
-      barChart$1.width(chartDimensions.width).height(chartDimensions.height - (areXLabelsRotated ? 30 : 0)).dimension(computedDimension).x(x).xUnits(xUnits).round(round).centerBar(true).alwaysUseRounding(true).renderHorizontalGridLines(true).margins({
-        left: chartDimensions.marginLeft + (yAxisLabel ? 24 : 0),
-        top: chartDimensions.marginTop,
-        right: chartDimensions.marginRight,
-        bottom: chartDimensions.marginBottom
-      }).barPadding(0.2);
-      barChart$1.yAxis().ticks(5);
-
-      // Add label to axis.
-      if (xAxisLabel) {
-        barChart$1.xAxisLabel(xAxisLabel);
-      }
-      if (yAxisLabel) {
-        barChart$1.yAxisLabel(yAxisLabel);
-      }
-
-      // Rotate labels and reset the height, if asked for.
-      if (areXLabelsRotated) {
-        barChart$1.on('pretransition', rowChart => {
-          barChart$1.select('.axis').attr('text-anchor', 'end').selectAll('text').attr('transform', 'translate(-6,5) rotate(-45)');
-          rowChart.select('svg').attr('height', chartDimensions.height);
-        });
-      }
-
-      // Set group whether the chart is stacked or not.
-      if (!stackedCategory) {
-        barChart$1.group(timeGroup).colors(colorScale);
-      } else if (dataset.length) {
-        if (!Array.isArray(dataset[0][stackedCategory])) {
-          const categories = dataset.reduce((acc, curr) => {
-            if (acc.indexOf(curr[stackedCategory]) === -1) {
-              acc.push(curr[stackedCategory]);
-            }
-            return acc;
-          }, []);
-          const stackedTimeGroup = timeGroup.reduce((p, v) => {
-            p[v[stackedCategory]] = (p[v[stackedCategory]] || 0) + 1;
-            return p;
-          }, (p, v) => {
-            p[v[stackedCategory]] = (p[v[stackedCategory]] || 0) - 1;
-            return p;
-          }, () => ({}));
-          barChart$1.group(stackedTimeGroup, categories[0],
-          // @ts-expect-error
-          (cat => d => d.value[cat])(categories[0])).colors(colorScale);
-          for (var i = 1; i < categories.length; ++i) {
-            barChart$1.stack(stackedTimeGroup, categories[i], (cat => d => d.value[cat])(categories[i]));
-          }
-        } else {
-          const categories = dataset.reduce((acc, curr) => {
-            curr[stackedCategory].forEach(val => {
-              if (acc.indexOf(val) === -1) {
-                acc.push(val);
-              }
-            });
-            return acc;
-          }, []);
-          const stackedTimeGroup = timeGroup.reduce((p, v) => {
-            v[stackedCategory].forEach(val => {
-              p[val] = (p[val] || 0) + 1;
-            });
-            return p;
-          }, (p, v) => {
-            v[stackedCategory].forEach(val => {
-              p[val] = (p[val] || 0) - 1;
-            });
-            return p;
-          }, () => ({}));
-          barChart$1.group(stackedTimeGroup, categories[0],
-          // @ts-expect-error
-          (cat => d => d.value[cat])(categories[0])).colors(colorScale);
-          for (var i = 1; i < categories.length; ++i) {
-            barChart$1.stack(stackedTimeGroup, categories[i], (cat => d => d.value[cat])(categories[i]));
-          }
-        }
-      }
-
-      // Dispatch filters to datagrid when a value is selected or unselected.
-      const formatTime = timeFormat('%Y-%m-%dT%H:%M');
-      barChart$1.on('filtered', () => {
-        if (columnToFilter) {
-          var _barChart$filters;
-          const dateArray = (_barChart$filters = barChart$1.filters()) === null || _barChart$filters === void 0 ? void 0 : _barChart$filters[0];
-          if (Array.isArray(dateArray) && dateArray.length === 2) {
-            dispatch === null || dispatch === void 0 ? void 0 : dispatch({
-              type: DashboardReducerActionType.FilterTableBatch,
-              filter: [{
-                id: `${barChart$1.anchorName()}-start`,
-                field: columnToFilter,
-                operator: 'after',
-                value: formatTime(dateArray[0])
-              }, {
-                id: `${barChart$1.anchorName()}-end`,
-                field: columnToFilter,
-                operator: 'onOrBefore',
-                value: formatTime(dateArray[1])
-              }]
-            });
-          }
-        }
-        onFilter === null || onFilter === void 0 ? void 0 : onFilter(barChart$1.filters(), ndx.allFiltered());
-      });
-
-      // Render the chart.
-      barChart$1.render();
-
-      // Store chart for further use.
-      setChart(barChart$1);
-    }
-  }, [propsData, data]);
-
-  // Filter chart if context is updated by an external component.
-  const filterStart = tableFilters.find(filter => filter.field === columnToFilter && filter.operator === 'after');
-  const filterEnd = tableFilters.find(filter => filter.field === columnToFilter && filter.operator === 'onOrBefore');
-  useEffect(() => {
-    if (chart && filterStart && filterEnd && filterStart.value && filterEnd.value) {
-      const chartFiltersObj = chart.filters();
-      const chartFilters = chartFiltersObj === null || chartFiltersObj === void 0 ? void 0 : chartFiltersObj[0];
-      const chartFilterStart = chartFilters === null || chartFilters === void 0 ? void 0 : chartFilters[0];
-      const chartFilterEnd = chartFilters === null || chartFilters === void 0 ? void 0 : chartFilters[1];
-      if (chartFilterStart !== isoParse(filterStart.value) && chartFilterEnd !== isoParse(filterEnd.value)) {
-        var _d3isoParse, _d3isoParse2;
-        chart.filter(null);
-        chart.filter(filters.RangedFilter(((_d3isoParse = isoParse(filterStart.value)) === null || _d3isoParse === void 0 ? void 0 : _d3isoParse.getTime()) || 0, ((_d3isoParse2 = isoParse(filterEnd.value)) === null || _d3isoParse2 === void 0 ? void 0 : _d3isoParse2.getTime()) || 0));
-        redrawAll();
-      }
-    }
-  }, [filterStart === null || filterStart === void 0 ? void 0 : filterStart.value, filterEnd === null || filterEnd === void 0 ? void 0 : filterEnd.value]);
-  return /*#__PURE__*/React.createElement(StyledTimeSeriesBarChart, _extends({}, forwardedProps, {
-    className: classNames(TimeSeriesBarChart.className, className),
-    ref: containerRef,
-    $theme: theme
-  }), /*#__PURE__*/React.createElement(StyledTimeSeriesBarChartTitle, {
-    className: `${TimeSeriesBarChart.className}__title`,
-    alignItems: "center",
-    $theme: theme
-  }, title ? /*#__PURE__*/React.createElement("div", {
-    id: `id${id}__title`
-  }, title) : null, chart && isResetable ? /*#__PURE__*/React.createElement(Button, {
-    variant: "unstyled",
-    onClick: () => {
-      chart.filter(null);
-      redrawAll();
-      if (columnToFilter) {
-        dispatch === null || dispatch === void 0 ? void 0 : dispatch({
-          type: DashboardReducerActionType.ResetFilter,
-          filter: {
-            id: `${chart.anchorName()}-start`,
-            field: columnToFilter,
-            operator: 'after'
-          }
-        });
-        dispatch === null || dispatch === void 0 ? void 0 : dispatch({
-          type: DashboardReducerActionType.ResetFilter,
-          filter: {
-            id: `${chart.anchorName()}-end`,
-            field: columnToFilter,
-            operator: 'onOrBefore'
-          }
-        });
-      }
-    }
-  }, resetLabel) : null), /*#__PURE__*/React.createElement(StyledTimeSeriesBarChartContainer, {
-    className: `${TimeSeriesBarChart.className}__container`,
-    $isEmpty: ndx.all().length === 0
-  }, /*#__PURE__*/React.createElement("div", {
-    className: `${TimeSeriesBarChart.className}-container__chart`,
-    ref: chartRef
-  }), ndx.all().length === 0 ? /*#__PURE__*/React.createElement(ChartEmptyState, {
-    title: emptyChartTitle,
-    subtitle: emptyChartSubtitle,
-    resetLabel: emptyChartResetLabel,
-    onReset: () => {
-      filterAll();
-      redrawAll();
-      dispatch === null || dispatch === void 0 ? void 0 : dispatch({
-        type: DashboardReducerActionType.ResetFilters
-      });
-    }
-  }) : null), caption ? /*#__PURE__*/React.createElement(StyledTimeSeriesBarChartCaption, {
-    className: `${TimeSeriesBarChart.className}__caption`,
-    id: `id${id}__caption`,
-    $theme: theme
-  }, caption) : null);
-});
-TimeSeriesBarChart.className = CLASSNAME;
-TimeSeriesBarChart.displayName = COMPONENT_NAME;
-
-/**
- * Hook to give to a chart the roles, events and attributes of a listbox.
- */
-const useCategoricalChartAsListbox = _ref => {
-  let {
-    id,
-    ref,
-    type,
-    ndxGroup,
-    orientation = 'horizontal'
-  } = _ref;
-  const currentIndexRef = useRef(0);
-  const props = useMemo(() => {
-    const numberOfGroups = ndxGroup === null || ndxGroup === void 0 ? void 0 : ndxGroup.all().filter(datum => datum.value).length;
-    if (ref && numberOfGroups) {
-      const getCurrentOption = () => ref.current.querySelector(`._${currentIndexRef.current}`);
-      const next = () => {
-        getCurrentOption().classList.remove('focused');
-        const index = currentIndexRef.current === numberOfGroups - 1 ? 0 : currentIndexRef.current + 1;
-        currentIndexRef.current = index;
-        ref.current.setAttribute('aria-activedescendant', `id${id}__${type}-${currentIndexRef.current}`);
-        getCurrentOption().classList.add('focused');
-      };
-      const previous = () => {
-        getCurrentOption().classList.remove('focused');
-        const index = currentIndexRef.current === 0 ? numberOfGroups - 1 : currentIndexRef.current - 1;
-        currentIndexRef.current = index;
-        ref.current.setAttribute('aria-activedescendant', `id${id}__${type}-${currentIndexRef.current}`);
-        getCurrentOption().classList.add('focused');
-      };
-      const focus = () => {
-        ref.current.setAttribute('aria-activedescendant', `id${id}__${type}-0`);
-        getCurrentOption().classList.add('focused');
-      };
-      const blur = () => {
-        getCurrentOption().classList.remove('focused');
-        currentIndexRef.current = 0;
-        ref.current.setAttribute('aria-activedescendant', '');
-      };
-      const keydown = e => {
-        e.stopPropagation();
-        switch (e.code) {
-          case 'ArrowRight':
-            if (orientation === 'horizontal') {
-              e.preventDefault();
-              next();
-            }
-            break;
-          case 'ArrowLeft':
-            if (orientation === 'horizontal') {
-              e.preventDefault();
-              previous();
-            }
-            break;
-          case 'ArrowDown':
-            if (orientation === 'vertical') {
-              e.preventDefault();
-              next();
-            }
-            break;
-          case 'ArrowUp':
-            if (orientation === 'vertical') {
-              e.preventDefault();
-              previous();
-            }
-            break;
-          case 'Enter':
-          case 'Space':
-            e.preventDefault();
-            getCurrentOption().dispatchEvent(new Event('click'));
-            break;
-        }
-      };
-      return {
-        'aria-activedescendant': '',
-        'aria-multiselectable': 'true',
-        'aria-orientation': orientation,
-        role: 'listbox',
-        tabIndex: 0,
-        onFocus: focus,
-        onBlur: blur,
-        onMouseDown: event => event.preventDefault(),
-        onMouseLeave: blur,
-        onKeyDown: keydown
-      };
-    }
-  }, [ref, ref.current, ndxGroup, JSON.parse(JSON.stringify((ndxGroup === null || ndxGroup === void 0 ? void 0 : ndxGroup.all()) || ''))]);
-  return props;
-};
-
-const FilterableBarChart = props => {
-  const {
-    children,
-    datagridCategoryDimFilter,
-    dimension,
-    group,
-    id: propsId,
-    isDimensionArray,
-    isResetable,
-    localeText,
-    onFilter
-  } = props;
-  const [_id] = useId();
-  const id = propsId !== null && propsId !== void 0 ? propsId : _id;
-  const ref = useRef();
-  const {
-    emptyChartTitle,
-    emptyChartSubtitle,
-    emptyChartResetLabel
-  } = _objectSpread2({}, localeText);
-  const {
-    data,
-    dispatch,
-    toggleUpdateContext,
-    state: {
-      tableFilters
-    }
-  } = useContext(DashboardContext);
-  const [ndxDimension, setNdxDimension] = useState();
-  const [ndxGroup, setNdxGroup] = useState();
-  useEffect(() => {
-    const computedNdxDimension = CrossfilterRegistry.get(data).dimension(dimension, isDimensionArray);
-    const computedNdxGroup = group ? group(computedNdxDimension) : computedNdxDimension.group();
-    setNdxDimension(computedNdxDimension);
-    setNdxGroup(computedNdxGroup);
-    return function cleanup() {
-      computedNdxDimension.filterAll();
-    };
-  }, [dimension, data, group]);
-  const [filters, setFilters] = useState([]);
-  const handleFilter = category => {
-    let newFilters;
-    if (filters.includes(category)) {
-      newFilters = filters.filter(f => f !== category);
-    } else {
-      newFilters = [...filters, category];
-    }
-    setFilters(newFilters);
-    if (newFilters.length) {
-      ndxDimension.filter(d => newFilters.includes(d));
-    } else {
-      ndxDimension.filterAll();
-    }
-    toggleUpdateContext === null || toggleUpdateContext === void 0 ? void 0 : toggleUpdateContext();
-    if (datagridCategoryDimFilter) {
-      dispatch === null || dispatch === void 0 ? void 0 : dispatch({
-        type: DashboardReducerActionType.FilterTable,
-        filter: {
-          id: id,
-          field: datagridCategoryDimFilter.field,
-          operator: datagridCategoryDimFilter.operator,
-          value: newFilters
-        }
-      });
-    }
-    if (onFilter) {
-      onFilter(newFilters);
-    }
-  };
-  const resetFilters = () => {
-    setFilters([]);
-    ndxDimension.filterAll();
-    toggleUpdateContext === null || toggleUpdateContext === void 0 ? void 0 : toggleUpdateContext();
-    if (datagridCategoryDimFilter) {
-      dispatch === null || dispatch === void 0 ? void 0 : dispatch({
-        type: DashboardReducerActionType.ResetFilter,
-        filter: {
-          id: id,
-          field: datagridCategoryDimFilter.field,
-          operator: datagridCategoryDimFilter.operator
-        }
-      });
-    }
-    if (onFilter) {
-      onFilter();
-    }
-  };
-  useEffect(() => {
-    var _tableFilters$find;
-    if (!datagridCategoryDimFilter) {
-      return;
-    }
-    const updatedFilters = (_tableFilters$find = tableFilters.find(filter => filter.field === datagridCategoryDimFilter.field && filter.operator === datagridCategoryDimFilter.operator)) === null || _tableFilters$find === void 0 ? void 0 : _tableFilters$find.value;
-    if (updatedFilters && updatedFilters !== filters && ndxDimension) {
-      setFilters(updatedFilters);
-      if (updatedFilters.length) {
-        ndxDimension.filter(d => updatedFilters.includes(d));
-      } else {
-        ndxDimension.filterAll();
-      }
-      toggleUpdateContext === null || toggleUpdateContext === void 0 ? void 0 : toggleUpdateContext();
-    }
-  }, [tableFilters]);
-  const emptyComponent = /*#__PURE__*/React.createElement(ChartEmptyState, {
-    title: emptyChartTitle,
-    subtitle: emptyChartSubtitle,
-    resetLabel: emptyChartResetLabel,
-    onReset: resetFilters
-  });
-  const chartProps = useCategoricalChartAsListbox({
-    id,
-    ref: ref,
-    type: 'bar',
-    ndxGroup,
-    orientation: 'vertical'
-  });
-  const filterProps = {
-    barProps: {
-      tabIndex: -1
-    },
-    barRole: 'option',
-    role: 'listbox',
-    chartProps: chartProps,
-    chartRef: ref,
-    data: ndxGroup ? JSON.parse(JSON.stringify(ndxGroup.all())) : undefined,
-    emptyComponent,
-    id,
-    isBarSelected: datum => {
-      return filters.length === 0 || filters.includes(Array.isArray(datum.data.key) ? datum.data.key[1] : datum.data.key);
-    },
-    onBarClick: datum => {
-      handleFilter(Array.isArray(datum.data.key) ? datum.data.key[1] : datum.data.key);
-    },
-    onReset: isResetable ? resetFilters : undefined
-  };
-  if ( /*#__PURE__*/isValidElement(children)) {
-    return /*#__PURE__*/React.cloneElement(children, _objectSpread2({}, filterProps));
-  }
-  return null;
-};
-
-const FilterableDataGrid = props => {
-  const {
-    children,
-    onFilter
-  } = props;
-  const {
-    state,
-    data,
-    dispatch,
-    dataGridApiRef
-  } = useContext(DashboardContext);
-  const {
-    tableFilters
-  } = state;
-  const [filterModel, setFilterModel] = useState();
-  useEffect(() => {
-    setFilterModel(_objectSpread2(_objectSpread2({}, filterModel), {}, {
-      items: tableFilters
-    }));
-  }, [tableFilters]);
-  const updateChartFilters = filterModel => {
-    dispatch === null || dispatch === void 0 ? void 0 : dispatch({
-      type: DashboardReducerActionType.FilterTableBatch,
-      filter: filterModel.items
-    });
-  };
-  if ( /*#__PURE__*/isValidElement(children)) {
-    var _children$props$apiRe;
-    const filterProps = {
-      apiRef: (_children$props$apiRe = children.props.apiRef) !== null && _children$props$apiRe !== void 0 ? _children$props$apiRe : dataGridApiRef,
-      rows: data || [],
-      filterModel,
-      onFilterModelChange: filterModel => {
-        if (onFilter) {
-          onFilter(filterModel);
-        }
-        updateChartFilters(filterModel);
-      }
-    };
-    return /*#__PURE__*/React.cloneElement(children, _objectSpread2({}, filterProps));
-  }
-  return null;
-};
-
-const FilterablePieChart = props => {
-  var _tableFilters$find;
-  const {
-    children,
-    datagridCategoryDimFilter,
-    dimension,
-    group,
-    id: propsId,
-    isDimensionArray,
-    isResetable,
-    localeText,
-    onFilter
-  } = props;
-  const [_id] = useId();
-  const id = propsId !== null && propsId !== void 0 ? propsId : _id;
-  const ref = useRef();
-  const {
-    emptyChartTitle,
-    emptyChartSubtitle,
-    emptyChartResetLabel
-  } = _objectSpread2({}, localeText);
-  const {
-    data,
-    dispatch,
-    toggleUpdateContext,
-    state: {
-      tableFilters
-    }
-  } = useContext(DashboardContext);
-  const [ndxDimension, setNdxDimension] = useState();
-  const [ndxGroup, setNdxGroup] = useState();
-  useEffect(() => {
-    const computedNdxDimension = CrossfilterRegistry.get(data).dimension(dimension, isDimensionArray);
-    const computedNdxGroup = group ? group(computedNdxDimension) : computedNdxDimension.group();
-    setNdxDimension(computedNdxDimension);
-    setNdxGroup(computedNdxGroup);
-    return function cleanup() {
-      computedNdxDimension.filterAll();
-    };
-  }, [dimension, data, group]);
-  const [filters, setFilters] = useState([]);
-  const handleFilter = category => {
-    let newFilters;
-    if (filters.includes(category)) {
-      newFilters = filters.filter(f => f !== category);
-    } else {
-      newFilters = [...filters, category];
-    }
-    setFilters(newFilters);
-    if (newFilters.length) {
-      ndxDimension.filter(d => newFilters.includes(d));
-    } else {
-      ndxDimension.filterAll();
-    }
-    toggleUpdateContext === null || toggleUpdateContext === void 0 ? void 0 : toggleUpdateContext();
-    if (datagridCategoryDimFilter) {
-      dispatch === null || dispatch === void 0 ? void 0 : dispatch({
-        type: DashboardReducerActionType.FilterTable,
-        filter: {
-          id: id,
-          field: datagridCategoryDimFilter.field,
-          operator: datagridCategoryDimFilter.operator,
-          value: newFilters
-        }
-      });
-    }
-    if (onFilter) {
-      onFilter(newFilters);
-    }
-  };
-  const resetFilters = () => {
-    setFilters([]);
-    ndxDimension.filterAll();
-    toggleUpdateContext === null || toggleUpdateContext === void 0 ? void 0 : toggleUpdateContext();
-    if (datagridCategoryDimFilter) {
-      dispatch === null || dispatch === void 0 ? void 0 : dispatch({
-        type: DashboardReducerActionType.ResetFilter,
-        filter: {
-          id: id,
-          field: datagridCategoryDimFilter.field,
-          operator: datagridCategoryDimFilter.operator
-        }
-      });
-    }
-    if (onFilter) {
-      onFilter();
-    }
-  };
-  const updatedFilters = datagridCategoryDimFilter ? (_tableFilters$find = tableFilters.find(filter => filter.field === datagridCategoryDimFilter.field && filter.operator === datagridCategoryDimFilter.operator)) === null || _tableFilters$find === void 0 ? void 0 : _tableFilters$find.value : null;
-  useEffect(() => {
-    if (updatedFilters && updatedFilters !== filters && ndxDimension) {
-      setFilters(updatedFilters);
-      if (updatedFilters.length) {
-        ndxDimension.filter(d => updatedFilters.includes(d));
-      } else {
-        ndxDimension.filterAll();
-      }
-      toggleUpdateContext === null || toggleUpdateContext === void 0 ? void 0 : toggleUpdateContext();
-    }
-  }, [updatedFilters]);
-  const emptyComponent = /*#__PURE__*/React.createElement(ChartEmptyState, {
-    title: emptyChartTitle,
-    subtitle: emptyChartSubtitle,
-    resetLabel: emptyChartResetLabel,
-    onReset: resetFilters
-  });
-  const chartProps = useCategoricalChartAsListbox({
-    id,
-    ref: ref,
-    type: 'bar',
-    ndxGroup,
-    orientation: 'horizontal'
-  });
-  const legendProps = {
-    onLegendItemClick: datum => {
-      handleFilter(datum.data.key);
-    },
-    isLegendItemSelected: datum => {
-      return filters.length === 0 || filters.includes(datum.data.key);
-    },
-    legendItemRole: 'option',
-    role: 'group'
-  };
-  const filterProps = {
-    sliceProps: {
-      tabIndex: -1
-    },
-    sliceRole: 'option',
-    role: 'listbox',
-    chartProps,
-    legendProps,
-    chartRef: ref,
-    data: ndxGroup ? JSON.parse(JSON.stringify(ndxGroup.all())) : undefined,
-    emptyComponent,
-    id,
-    isSliceSelected: datum => {
-      return filters.length === 0 || filters.includes(datum.data.key);
-    },
-    onSliceClick: datum => {
-      handleFilter(datum.data.key);
-    },
-    onReset: isResetable ? resetFilters : undefined
-  };
-  if ( /*#__PURE__*/isValidElement(children)) {
-    return /*#__PURE__*/React.cloneElement(children, _objectSpread2({}, filterProps));
-  }
-  return null;
-};
-
-const filter = (legendFilters, brushFilters) => d => {
-  if (legendFilters && legendFilters.length && brushFilters) {
-    return d[0] >= brushFilters.minX && d[0] <= brushFilters.maxX && d[1] >= brushFilters.minY && d[1] <= brushFilters.maxY && legendFilters.includes(d[2]);
-  } else if (legendFilters && legendFilters.length) {
-    return legendFilters.includes(d[2]);
-  } else if (brushFilters) {
-    return d[0] >= brushFilters.minX && d[0] <= brushFilters.maxX && d[1] >= brushFilters.minY && d[1] <= brushFilters.maxY;
-  } else {
-    return true;
-  }
-};
-const isFiltered = (legendFilters, brushFilters) => datum => {
-  if (legendFilters && legendFilters.length && brushFilters) {
-    return datum.data.key[0] >= brushFilters.minX && datum.data.key[0] <= brushFilters.maxX && datum.data.key[1] >= brushFilters.minY && datum.data.key[1] <= brushFilters.maxY && legendFilters.includes(datum.data.key[2]);
-  } else if (legendFilters && legendFilters.length) {
-    return legendFilters.includes(datum.data.key[2]);
-  } else if (brushFilters) {
-    return datum.data.key[0] >= brushFilters.minX && datum.data.key[0] <= brushFilters.maxX && datum.data.key[1] >= brushFilters.minY && datum.data.key[1] <= brushFilters.maxY;
-  } else {
-    return true;
-  }
-};
-const FilterableScatterPlot = props => {
-  const {
-    children,
-    datagridCoordinatesCategoryDimFilter,
-    dimension,
-    group,
-    id: propsId,
-    isDimensionArray,
-    isResetable,
-    localeText,
-    onFilter
-  } = props;
-  const [_id] = useId();
-  const id = propsId !== null && propsId !== void 0 ? propsId : _id;
-  const {
-    emptyChartTitle,
-    emptyChartSubtitle,
-    emptyChartResetLabel
-  } = _objectSpread2({}, localeText);
-  const {
-    data,
-    dispatch,
-    toggleUpdateContext
-    // state: { tableFilters },
-  } = useContext(DashboardContext);
-  const [ndxDimension, setNdxDimension] = useState();
-  const [ndxGroup, setNdxGroup] = useState();
-  useEffect(() => {
-    const computedNdxDimension = CrossfilterRegistry.get(data).dimension(dimension, isDimensionArray);
-    const computedNdxGroup = group ? group(computedNdxDimension) : computedNdxDimension.group();
-    setNdxDimension(computedNdxDimension);
-    setNdxGroup(computedNdxGroup);
-    return function cleanup() {
-      computedNdxDimension.filterAll();
-    };
-  }, [dimension, data, group]);
-  const [brushFilters, setBrushFilters] = useState();
-  const [legendFilters, setLegendFilters] = useState([]);
-  const handleBrushFilter = newFilters => {
-    setBrushFilters(newFilters);
-    ndxDimension.filter(d => filter(legendFilters, newFilters)(d));
-    toggleUpdateContext === null || toggleUpdateContext === void 0 ? void 0 : toggleUpdateContext();
-    if (datagridCoordinatesCategoryDimFilter) {
-      dispatch === null || dispatch === void 0 ? void 0 : dispatch({
-        type: DashboardReducerActionType.FilterTable,
-        filter: {
-          id: `${id}-x`,
-          field: datagridCoordinatesCategoryDimFilter[0].field,
-          operator: datagridCoordinatesCategoryDimFilter[0].operator,
-          value: [newFilters.minX, newFilters.maxX]
-        }
-      });
-      dispatch === null || dispatch === void 0 ? void 0 : dispatch({
-        type: DashboardReducerActionType.FilterTable,
-        filter: {
-          id: `${id}-y`,
-          field: datagridCoordinatesCategoryDimFilter[1].field,
-          operator: datagridCoordinatesCategoryDimFilter[1].operator,
-          value: [newFilters.minY, newFilters.maxY]
-        }
-      });
-    }
-    if (onFilter) {
-      onFilter(newFilters);
-    }
-  };
-  const handleLegendFilter = category => {
-    let newFilters;
-    if (legendFilters.includes(category)) {
-      newFilters = legendFilters.filter(f => f !== category);
-    } else {
-      newFilters = [...legendFilters, category];
-    }
-    setLegendFilters(newFilters);
-    ndxDimension.filter(d => filter(newFilters, brushFilters)(d));
-    toggleUpdateContext === null || toggleUpdateContext === void 0 ? void 0 : toggleUpdateContext();
-    if ((datagridCoordinatesCategoryDimFilter === null || datagridCoordinatesCategoryDimFilter === void 0 ? void 0 : datagridCoordinatesCategoryDimFilter.length) === 3) {
-      dispatch === null || dispatch === void 0 ? void 0 : dispatch({
-        type: DashboardReducerActionType.FilterTable,
-        filter: {
-          id: `${id}-category`,
-          field: datagridCoordinatesCategoryDimFilter[2].field,
-          operator: datagridCoordinatesCategoryDimFilter[2].operator,
-          value: newFilters
-        }
-      });
-    }
-    if (onFilter) {
-      onFilter(newFilters);
-    }
-  };
-  const resetFilters = function () {
-    let brush = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
-    let legend = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
-    if (brush) {
-      setBrushFilters(undefined);
-    }
-    if (legend) {
-      setLegendFilters([]);
-    }
-    ndxDimension.filter(d => filter(legend ? [] : legendFilters, brush ? undefined : brushFilters)(d));
-    toggleUpdateContext === null || toggleUpdateContext === void 0 ? void 0 : toggleUpdateContext();
-    if (datagridCoordinatesCategoryDimFilter) {
-      if (brush) {
-        dispatch === null || dispatch === void 0 ? void 0 : dispatch({
-          type: DashboardReducerActionType.ResetFilter,
-          filter: {
-            id: `${id}-x`,
-            field: datagridCoordinatesCategoryDimFilter[0].field,
-            operator: datagridCoordinatesCategoryDimFilter[0].operator
-          }
-        });
-        dispatch === null || dispatch === void 0 ? void 0 : dispatch({
-          type: DashboardReducerActionType.ResetFilter,
-          filter: {
-            id: `${id}-y`,
-            field: datagridCoordinatesCategoryDimFilter[1].field,
-            operator: datagridCoordinatesCategoryDimFilter[1].operator
-          }
-        });
-      }
-      if (legend && datagridCoordinatesCategoryDimFilter.length === 3) {
-        dispatch === null || dispatch === void 0 ? void 0 : dispatch({
-          type: DashboardReducerActionType.ResetFilter,
-          filter: {
-            id: `${id}-category`,
-            field: datagridCoordinatesCategoryDimFilter[2].field,
-            operator: datagridCoordinatesCategoryDimFilter[2].operator
-          }
-        });
-      }
-    }
-    if (onFilter) {
-      onFilter();
-    }
-  };
-
-  // useEffect(() => {
-  //   if (!datagridCoordinatesCategoryDimFilter) {
-  //     return;
-  //   }
-
-  //   const updatedXFilters = tableFilters.find(
-  //     (filter) =>
-  //       filter.field === datagridCoordinatesCategoryDimFilter[0].field &&
-  //       filter.operator ===
-  //         datagridCoordinatesCategoryDimFilter[0].operator
-  //   )?.value;
-  //   const updatedYFilters = tableFilters.find(
-  //     (filter) =>
-  //       filter.field === datagridCoordinatesCategoryDimFilter[1].field &&
-  //       filter.operator ===
-  //         datagridCoordinatesCategoryDimFilter[1].operator
-  //   )?.value;
-  //   console.log(updatedXFilters, updatedYFilters, brushFilters);
-  //   const updatedFilters = {
-  //     minX: Number(updatedXFilters[0]),
-  //     maxX: Number(updatedXFilters[0]),
-  //     minY: Number(updatedYFilters[1]),
-  //     maxY: Number(updatedYFilters[1]),
-  //   }
-  //   if (updatedFilters && JSON.stringify(updatedFilters) !== JSON.stringify(brushFilters)) {
-  //   }
-  // }, [tableFilters]);
-
-  const emptyComponent = /*#__PURE__*/React.createElement(ChartEmptyState, {
-    title: emptyChartTitle,
-    subtitle: emptyChartSubtitle,
-    resetLabel: emptyChartResetLabel,
-    onReset: resetFilters
-  });
-  const legendProps = {
-    onLegendItemClick: datum => {
-      handleLegendFilter(datum.data.key);
-    },
-    isLegendItemSelected: datum => {
-      return legendFilters.length === 0 || legendFilters.includes(datum.data.key);
-    },
-    legendItemRole: 'option',
-    role: 'group'
-  };
-  const filterProps = {
-    isBrushable: true,
-    data: ndxGroup ? JSON.parse(JSON.stringify(ndxGroup.all())) : undefined,
-    dotRole: 'option',
-    role: 'listbox',
-    emptyComponent,
-    id,
-    legendProps,
-    onBrush: (selection, scaleX, scaleY) => {
-      if (selection) {
-        setBrushFilters({
-          minX: scaleX.invert(selection[0][0]),
-          minY: scaleY.invert(selection[1][1]),
-          maxX: scaleX.invert(selection[1][0]),
-          maxY: scaleY.invert(selection[0][1])
-        });
-      }
-    },
-    onBrushEnd: (selection, scaleX, scaleY) => {
-      if (selection && scaleX && scaleY) {
-        handleBrushFilter({
-          minX: scaleX.invert(selection[0][0]),
-          minY: scaleY.invert(selection[1][1]),
-          maxX: scaleX.invert(selection[1][0]),
-          maxY: scaleY.invert(selection[0][1])
-        });
-      } else {
-        resetFilters(true, false);
-      }
-    },
-    onReset: isResetable ? resetFilters : undefined,
-    isDotSelected: datum => isFiltered(legendFilters, brushFilters)(datum)
-  };
-  if ( /*#__PURE__*/isValidElement(children)) {
-    return /*#__PURE__*/React.cloneElement(children, _objectSpread2({}, filterProps));
-  }
-  return null;
-};
-
-const WithFilters = props => {
-  if (isComponent('DataGrid')(props.children)) {
-    return /*#__PURE__*/React.createElement(FilterableDataGrid, props);
-  }
-  const {
-    dimension
-  } = props;
-  if (!dimension) {
-    return null;
-  }
-  if (isComponent('BarChart')(props.children)) {
-    return /*#__PURE__*/React.createElement(FilterableBarChart, _extends({}, props, {
-      dimension: dimension
-    }));
-  } else if (isComponent('PieChart')(props.children)) {
-    return /*#__PURE__*/React.createElement(FilterablePieChart, _extends({}, props, {
-      dimension: dimension
-    }));
-  } else if (isComponent('ScatterPlot')(props.children)) {
-    return /*#__PURE__*/React.createElement(FilterableScatterPlot, _extends({}, props, {
-      dimension: dimension
-    }));
-  }
-  return /*#__PURE__*/React.isValidElement(props.children) ? props.children : null;
-};
-
-export { COUNT, ChartEmptyState, Dashboard, DashboardContext, DashboardReducer, DashboardReducerActionType, PdfExportButton, SUM, TimeSeriesBarChart, TimeSeriesBarChartSize, TimeSeriesBarChartTheme, WithFilters, groupReduceSum, initialState };
+export { COUNT, SUM, groupReduceSum };
 //# sourceMappingURL=index.js.map