umwd-components 0.1.757 → 0.1.759

package/dist/esm/node_modules/recharts/lib/state/store.js

@@ -0,0 +1,99 @@
+/*
+ * UMWD-Components
+ * @copyright Jelle Paulus
+ * @license MIT
+ */
+  
+import { __exports as store } from '../../../../_virtual/store.js';
+import require$$0 from '../../../../_virtual/redux-toolkit.modern.js';
+import './optionsSlice.js';
+import './tooltipSlice.js';
+import './chartDataSlice.js';
+import './layoutSlice.js';
+import './mouseEventsMiddleware.js';
+import './reduxDevtoolsJsonStringifyReplacer.js';
+import './cartesianAxisSlice.js';
+import './graphicalItemsSlice.js';
+import './referenceElementsSlice.js';
+import './brushSlice.js';
+import './legendSlice.js';
+import './rootPropsSlice.js';
+import './polarAxisSlice.js';
+import './polarOptionsSlice.js';
+import './keyboardEventsMiddleware.js';
+import './externalEventsMiddleware.js';
+import './touchEventsMiddleware.js';
+import { __exports as tooltipSlice } from '../../../../_virtual/tooltipSlice.js';
+import { __exports as rootPropsSlice } from '../../../../_virtual/rootPropsSlice.js';
+import { __exports as referenceElementsSlice } from '../../../../_virtual/referenceElementsSlice.js';
+import { __exports as polarOptionsSlice } from '../../../../_virtual/polarOptionsSlice.js';
+import { __exports as polarAxisSlice } from '../../../../_virtual/polarAxisSlice.js';
+import { __exports as optionsSlice } from '../../../../_virtual/optionsSlice.js';
+import { __exports as legendSlice } from '../../../../_virtual/legendSlice.js';
+import { __exports as layoutSlice } from '../../../../_virtual/layoutSlice.js';
+import { __exports as graphicalItemsSlice } from '../../../../_virtual/graphicalItemsSlice.js';
+import { __exports as chartDataSlice } from '../../../../_virtual/chartDataSlice.js';
+import { __exports as cartesianAxisSlice } from '../../../../_virtual/cartesianAxisSlice.js';
+import { __exports as brushSlice } from '../../../../_virtual/brushSlice.js';
+import { __exports as reduxDevtoolsJsonStringifyReplacer } from '../../../../_virtual/reduxDevtoolsJsonStringifyReplacer.js';
+import { __exports as mouseEventsMiddleware } from '../../../../_virtual/mouseEventsMiddleware.js';
+import { __exports as keyboardEventsMiddleware } from '../../../../_virtual/keyboardEventsMiddleware.js';
+import { __exports as externalEventsMiddleware } from '../../../../_virtual/externalEventsMiddleware.js';
+import { __exports as touchEventsMiddleware } from '../../../../_virtual/touchEventsMiddleware.js';
+
+Object.defineProperty(store, "__esModule", {
+  value: true
+});
+store.createRechartsStore = void 0;
+var _toolkit = require$$0;
+var _optionsSlice = optionsSlice;
+var _tooltipSlice = tooltipSlice;
+var _chartDataSlice = chartDataSlice;
+var _layoutSlice = layoutSlice;
+var _mouseEventsMiddleware = mouseEventsMiddleware;
+var _reduxDevtoolsJsonStringifyReplacer = reduxDevtoolsJsonStringifyReplacer;
+var _cartesianAxisSlice = cartesianAxisSlice;
+var _graphicalItemsSlice = graphicalItemsSlice;
+var _referenceElementsSlice = referenceElementsSlice;
+var _brushSlice = brushSlice;
+var _legendSlice = legendSlice;
+var _rootPropsSlice = rootPropsSlice;
+var _polarAxisSlice = polarAxisSlice;
+var _polarOptionsSlice = polarOptionsSlice;
+var _keyboardEventsMiddleware = keyboardEventsMiddleware;
+var _externalEventsMiddleware = externalEventsMiddleware;
+var _touchEventsMiddleware = touchEventsMiddleware;
+var rootReducer = (0, _toolkit.combineReducers)({
+  brush: _brushSlice.brushReducer,
+  cartesianAxis: _cartesianAxisSlice.cartesianAxisReducer,
+  chartData: _chartDataSlice.chartDataReducer,
+  graphicalItems: _graphicalItemsSlice.graphicalItemsReducer,
+  layout: _layoutSlice.chartLayoutReducer,
+  legend: _legendSlice.legendReducer,
+  options: _optionsSlice.optionsReducer,
+  polarAxis: _polarAxisSlice.polarAxisReducer,
+  polarOptions: _polarOptionsSlice.polarOptionsReducer,
+  referenceElements: _referenceElementsSlice.referenceElementsReducer,
+  rootProps: _rootPropsSlice.rootPropsReducer,
+  tooltip: _tooltipSlice.tooltipReducer
+});
+store.createRechartsStore = function createRechartsStore(preloadedState) {
+  var chartName = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'Chart';
+  return (0, _toolkit.configureStore)({
+    reducer: rootReducer,
+    // redux-toolkit v1 types are unhappy with the preloadedState type. Remove the `as any` when bumping to v2
+    preloadedState: preloadedState,
+    // @ts-expect-error redux-toolkit v1 types are unhappy with the middleware array. Remove this comment when bumping to v2
+    middleware: getDefaultMiddleware => getDefaultMiddleware({
+      serializableCheck: false
+    }).concat([_mouseEventsMiddleware.mouseClickMiddleware.middleware, _mouseEventsMiddleware.mouseMoveMiddleware.middleware, _keyboardEventsMiddleware.keyboardEventsMiddleware.middleware, _externalEventsMiddleware.externalEventsMiddleware.middleware, _touchEventsMiddleware.touchEventMiddleware.middleware]),
+    devTools: {
+      serialize: {
+        replacer: _reduxDevtoolsJsonStringifyReplacer.reduxDevtoolsJsonStringifyReplacer
+      },
+      name: "recharts-".concat(chartName)
+    }
+  });
+};
+
+export { store as default };

package/dist/esm/node_modules/recharts/lib/state/tooltipSlice.js

@@ -0,0 +1,210 @@
+/*
+ * UMWD-Components
+ * @copyright Jelle Paulus
+ * @license MIT
+ */
+  
+import { __exports as tooltipSlice$1 } from '../../../../_virtual/tooltipSlice.js';
+import require$$0 from '../../../../_virtual/redux-toolkit.modern.js';
+import { c as cjsExports } from '../../../immer/dist/cjs/index.js';
+
+Object.defineProperty(tooltipSlice$1, "__esModule", {
+  value: true
+});
+tooltipSlice$1.tooltipReducer = tooltipSlice$1.setTooltipSettingsState = tooltipSlice$1.setSyncInteraction = tooltipSlice$1.setMouseOverAxisIndex = tooltipSlice$1.setMouseClickAxisIndex = tooltipSlice$1.setKeyboardInteraction = tooltipSlice$1.setActiveMouseOverItemIndex = tooltipSlice$1.setActiveClickItemIndex = tooltipSlice$1.removeTooltipEntrySettings = tooltipSlice$1.noInteraction = tooltipSlice$1.mouseLeaveItem = tooltipSlice$1.mouseLeaveChart = tooltipSlice$1.initialState = tooltipSlice$1.addTooltipEntrySettings = void 0;
+var _toolkit = require$$0;
+var _immer = cjsExports;
+/**
+ * One Tooltip can display multiple TooltipPayloadEntries at a time.
+ */
+
+/**
+ * So what happens is that the tooltip payload is decided based on the available data, and the dataKey.
+ * The dataKey can either be defined on the graphical element (like Line, or Bar)
+ * or on the tooltip itself.
+ *
+ * The data can be defined in the chart element, or in the graphical item.
+ *
+ * So this type is all the settings, other than the data + dataKey complications.
+ */
+
+/**
+ * This is what Tooltip renders.
+ */
+
+/**
+ * null means no active index
+ * string means: whichever index from the chart data it is.
+ * Different charts have different requirements on data shapes,
+ * and are also responsible for providing a function that will accept this index
+ * and return data.
+ */
+
+/**
+ * Different items have different data shapes so the state has no opinion on what the data shape should be;
+ * the only requirement is that the chart also provides a searcher function
+ * that accepts the data, and a key, and returns whatever the payload in Tooltip should be.
+ */
+
+/**
+ * So this informs the "tooltip event type". Tooltip event type can be either "axis" or "item"
+ * and it is used for two things:
+ * 1. Sets the active area
+ * 2. Sets the background and cursor highlights
+ *
+ * Some charts only allow to have one type of tooltip event type, some allow both.
+ * Those charts that allow both will have one default, and the "shared" prop will be used to switch between them.
+ * Undefined means "use the chart default".
+ *
+ * Charts that only allow one tooltip event type, will ignore the shared prop.
+ */
+
+/**
+ * A generic state for user interaction with the chart.
+ * User interaction can come through multiple channels: mouse events, keyboard events, or hardcoded in props, or synchronised from other charts.
+ *
+ * Each of the interaction states is represented as TooltipInteractionState,
+ * and then the selectors and Tooltip will decide which of the interaction states to use.
+ */
+
+var noInteraction = tooltipSlice$1.noInteraction = {
+  active: false,
+  index: null,
+  dataKey: undefined,
+  coordinate: undefined
+};
+
+/**
+ * The tooltip interaction state stores:
+ *
+ * - Which graphical item is user interacting with at the moment,
+ * - which axis (or, which part of chart background) is user interacting with at the moment
+ * - The data that individual graphical items wish to be displayed in case the tooltip gets activated
+ */
+
+var initialState = tooltipSlice$1.initialState = {
+  itemInteraction: {
+    click: noInteraction,
+    hover: noInteraction
+  },
+  axisInteraction: {
+    click: noInteraction,
+    hover: noInteraction
+  },
+  keyboardInteraction: noInteraction,
+  syncInteraction: {
+    active: false,
+    index: null,
+    dataKey: undefined,
+    label: undefined,
+    coordinate: undefined
+  },
+  tooltipItemPayloads: [],
+  settings: {
+    shared: undefined,
+    trigger: 'hover',
+    axisId: 0,
+    active: false,
+    defaultIndex: undefined
+  }
+};
+var tooltipSlice = (0, _toolkit.createSlice)({
+  name: 'tooltip',
+  initialState,
+  reducers: {
+    addTooltipEntrySettings(state, action) {
+      state.tooltipItemPayloads.push((0, _immer.castDraft)(action.payload));
+    },
+    removeTooltipEntrySettings(state, action) {
+      var index = (0, _toolkit.current)(state).tooltipItemPayloads.indexOf((0, _immer.castDraft)(action.payload));
+      if (index > -1) {
+        state.tooltipItemPayloads.splice(index, 1);
+      }
+    },
+    setTooltipSettingsState(state, action) {
+      state.settings = action.payload;
+    },
+    setActiveMouseOverItemIndex(state, action) {
+      state.syncInteraction.active = false;
+      state.keyboardInteraction.active = false;
+      state.itemInteraction.hover.active = true;
+      state.itemInteraction.hover.index = action.payload.activeIndex;
+      state.itemInteraction.hover.dataKey = action.payload.activeDataKey;
+      state.itemInteraction.hover.coordinate = action.payload.activeCoordinate;
+    },
+    mouseLeaveChart(state) {
+      /*
+       * Clear only the active flags. Why?
+       * 1. Keep Coordinate to preserve animation - next time the Tooltip appears, we want to render it from
+       * the last place where it was when it disappeared.
+       * 2. We want to keep all the properties anyway just in case the tooltip has `active=true` prop
+       * and continues being visible even after the mouse has left the chart.
+       */
+      state.itemInteraction.hover.active = false;
+      state.axisInteraction.hover.active = false;
+    },
+    mouseLeaveItem(state) {
+      state.itemInteraction.hover.active = false;
+    },
+    setActiveClickItemIndex(state, action) {
+      state.syncInteraction.active = false;
+      state.itemInteraction.click.active = true;
+      state.keyboardInteraction.active = false;
+      state.itemInteraction.click.index = action.payload.activeIndex;
+      state.itemInteraction.click.dataKey = action.payload.activeDataKey;
+      state.itemInteraction.click.coordinate = action.payload.activeCoordinate;
+    },
+    setMouseOverAxisIndex(state, action) {
+      state.syncInteraction.active = false;
+      state.axisInteraction.hover.active = true;
+      state.keyboardInteraction.active = false;
+      state.axisInteraction.hover.index = action.payload.activeIndex;
+      state.axisInteraction.hover.dataKey = action.payload.activeDataKey;
+      state.axisInteraction.hover.coordinate = action.payload.activeCoordinate;
+    },
+    setMouseClickAxisIndex(state, action) {
+      state.syncInteraction.active = false;
+      state.keyboardInteraction.active = false;
+      state.axisInteraction.click.active = true;
+      state.axisInteraction.click.index = action.payload.activeIndex;
+      state.axisInteraction.click.dataKey = action.payload.activeDataKey;
+      state.axisInteraction.click.coordinate = action.payload.activeCoordinate;
+    },
+    setSyncInteraction(state, action) {
+      state.syncInteraction = action.payload;
+    },
+    setKeyboardInteraction(state, action) {
+      state.keyboardInteraction.active = action.payload.active;
+      state.keyboardInteraction.index = action.payload.activeIndex;
+      state.keyboardInteraction.coordinate = action.payload.activeCoordinate;
+      state.keyboardInteraction.dataKey = action.payload.activeDataKey;
+    }
+  }
+});
+var {
+  addTooltipEntrySettings,
+  removeTooltipEntrySettings,
+  setTooltipSettingsState,
+  setActiveMouseOverItemIndex,
+  mouseLeaveItem,
+  mouseLeaveChart,
+  setActiveClickItemIndex,
+  setMouseOverAxisIndex,
+  setMouseClickAxisIndex,
+  setSyncInteraction,
+  setKeyboardInteraction
+} = tooltipSlice.actions;
+tooltipSlice$1.setKeyboardInteraction = setKeyboardInteraction;
+tooltipSlice$1.setSyncInteraction = setSyncInteraction;
+tooltipSlice$1.setMouseClickAxisIndex = setMouseClickAxisIndex;
+tooltipSlice$1.setMouseOverAxisIndex = setMouseOverAxisIndex;
+tooltipSlice$1.setActiveClickItemIndex = setActiveClickItemIndex;
+tooltipSlice$1.mouseLeaveChart = mouseLeaveChart;
+tooltipSlice$1.mouseLeaveItem = mouseLeaveItem;
+tooltipSlice$1.setActiveMouseOverItemIndex = setActiveMouseOverItemIndex;
+tooltipSlice$1.setTooltipSettingsState = setTooltipSettingsState;
+tooltipSlice$1.removeTooltipEntrySettings = removeTooltipEntrySettings;
+tooltipSlice$1.addTooltipEntrySettings = addTooltipEntrySettings;
+tooltipSlice$1.tooltipReducer = tooltipSlice.reducer;
+
+export { tooltipSlice$1 as default };

package/dist/esm/node_modules/recharts/lib/state/touchEventsMiddleware.js

@@ -0,0 +1,73 @@
+/*
+ * UMWD-Components
+ * @copyright Jelle Paulus
+ * @license MIT
+ */
+  
+import { __exports as touchEventsMiddleware } from '../../../../_virtual/touchEventsMiddleware.js';
+import require$$0 from '../../../../_virtual/redux-toolkit.modern.js';
+import './tooltipSlice.js';
+import './selectors/selectActivePropsFromChartPointer.js';
+import '../util/getChartPointer.js';
+import './selectors/selectTooltipEventType.js';
+import '../util/Constants.js';
+import './selectors/touchSelectors.js';
+import { __exports as selectTooltipEventType } from '../../../../_virtual/selectTooltipEventType.js';
+import { __exports as selectActivePropsFromChartPointer } from '../../../../_virtual/selectActivePropsFromChartPointer.js';
+import { __exports as getChartPointer } from '../../../../_virtual/getChartPointer.js';
+import { __exports as tooltipSlice } from '../../../../_virtual/tooltipSlice.js';
+import { __exports as Constants } from '../../../../_virtual/Constants.js';
+import { __exports as touchSelectors } from '../../../../_virtual/touchSelectors.js';
+
+Object.defineProperty(touchEventsMiddleware, "__esModule", {
+  value: true
+});
+touchEventsMiddleware.touchEventMiddleware = touchEventsMiddleware.touchEventAction = void 0;
+var _toolkit = require$$0;
+var _tooltipSlice = tooltipSlice;
+var _selectActivePropsFromChartPointer = selectActivePropsFromChartPointer;
+var _getChartPointer = getChartPointer;
+var _selectTooltipEventType = selectTooltipEventType;
+var _Constants = Constants;
+var _touchSelectors = touchSelectors;
+var touchEventAction = touchEventsMiddleware.touchEventAction = (0, _toolkit.createAction)('touchMove');
+var touchEventMiddleware = touchEventsMiddleware.touchEventMiddleware = (0, _toolkit.createListenerMiddleware)();
+touchEventMiddleware.startListening({
+  actionCreator: touchEventAction,
+  effect: (action, listenerApi) => {
+    var touchEvent = action.payload;
+    var state = listenerApi.getState();
+    var tooltipEventType = (0, _selectTooltipEventType.selectTooltipEventType)(state, state.tooltip.settings.shared);
+    if (tooltipEventType === 'axis') {
+      var activeProps = (0, _selectActivePropsFromChartPointer.selectActivePropsFromChartPointer)(state, (0, _getChartPointer.getChartPointer)({
+        clientX: touchEvent.touches[0].clientX,
+        clientY: touchEvent.touches[0].clientY,
+        currentTarget: touchEvent.currentTarget
+      }));
+      if ((activeProps === null || activeProps === void 0 ? void 0 : activeProps.activeIndex) != null) {
+        listenerApi.dispatch((0, _tooltipSlice.setMouseOverAxisIndex)({
+          activeIndex: activeProps.activeIndex,
+          activeDataKey: undefined,
+          activeCoordinate: activeProps.activeCoordinate
+        }));
+      }
+    } else if (tooltipEventType === 'item') {
+      var _target$getAttribute;
+      var touch = touchEvent.touches[0];
+      var target = document.elementFromPoint(touch.clientX, touch.clientY);
+      if (!target || !target.getAttribute) {
+        return;
+      }
+      var itemIndex = target.getAttribute(_Constants.DATA_ITEM_INDEX_ATTRIBUTE_NAME);
+      var dataKey = (_target$getAttribute = target.getAttribute(_Constants.DATA_ITEM_DATAKEY_ATTRIBUTE_NAME)) !== null && _target$getAttribute !== void 0 ? _target$getAttribute : undefined;
+      var coordinate = (0, _touchSelectors.selectTooltipCoordinate)(listenerApi.getState(), itemIndex, dataKey);
+      listenerApi.dispatch((0, _tooltipSlice.setActiveMouseOverItemIndex)({
+        activeDataKey: dataKey,
+        activeIndex: itemIndex,
+        activeCoordinate: coordinate
+      }));
+    }
+  }
+});
+
+export { touchEventsMiddleware as default };

package/dist/esm/node_modules/recharts/lib/synchronisation/syncSelectors.js

@@ -0,0 +1,17 @@
+/*
+ * UMWD-Components
+ * @copyright Jelle Paulus
+ * @license MIT
+ */
+  
+import { __exports as syncSelectors } from '../../../../_virtual/syncSelectors.js';
+
+Object.defineProperty(syncSelectors, "__esModule", {
+  value: true
+});
+syncSelectors.selectSynchronisedTooltipState = selectSynchronisedTooltipState;
+function selectSynchronisedTooltipState(state) {
+  return state.tooltip.syncInteraction;
+}
+
+export { syncSelectors as default };

package/dist/esm/node_modules/recharts/lib/synchronisation/useChartSynchronisation.js

@@ -0,0 +1,251 @@
+/*
+ * UMWD-Components
+ * @copyright Jelle Paulus
+ * @license MIT
+ */
+  
+import { __exports as useChartSynchronisation } from '../../../../_virtual/useChartSynchronisation.js';
+import require$$0 from 'react';
+import '../state/hooks.js';
+import '../state/selectors/rootPropsSelectors.js';
+import '../util/Events.js';
+import '../state/optionsSlice.js';
+import '../state/tooltipSlice.js';
+import '../state/selectors/selectors.js';
+import '../state/selectors/tooltipSelectors.js';
+import './syncSelectors.js';
+import '../context/chartLayoutContext.js';
+import '../state/chartDataSlice.js';
+import { __exports as hooks } from '../../../../_virtual/hooks.js';
+import { __exports as optionsSlice } from '../../../../_virtual/optionsSlice.js';
+import { __exports as selectors } from '../../../../_virtual/selectors.js';
+import { __exports as rootPropsSelectors } from '../../../../_virtual/rootPropsSelectors.js';
+import { __exports as syncSelectors } from '../../../../_virtual/syncSelectors.js';
+import { __exports as tooltipSlice } from '../../../../_virtual/tooltipSlice.js';
+import { __exports as Events } from '../../../../_virtual/Events.js';
+import { __exports as tooltipSelectors } from '../../../../_virtual/tooltipSelectors.js';
+import { __exports as chartLayoutContext } from '../../../../_virtual/chartLayoutContext.js';
+import { __exports as chartDataSlice } from '../../../../_virtual/chartDataSlice.js';
+
+Object.defineProperty(useChartSynchronisation, "__esModule", {
+  value: true
+});
+useChartSynchronisation.useBrushChartSynchronisation = useBrushChartSynchronisation;
+useChartSynchronisation.useSynchronisedEventsFromOtherCharts = useSynchronisedEventsFromOtherCharts;
+useChartSynchronisation.useTooltipChartSynchronisation = useTooltipChartSynchronisation;
+var _react = require$$0;
+var _hooks = hooks;
+var _rootPropsSelectors = rootPropsSelectors;
+var _Events = Events;
+var _optionsSlice = optionsSlice;
+var _tooltipSlice = tooltipSlice;
+var _selectors = selectors;
+var _tooltipSelectors = tooltipSelectors;
+var _syncSelectors = syncSelectors;
+var _chartLayoutContext = chartLayoutContext;
+var _chartDataSlice = chartDataSlice;
+var noop = () => {};
+function useTooltipSyncEventsListener() {
+  var mySyncId = (0, _hooks.useAppSelector)(_rootPropsSelectors.selectSyncId);
+  var myEventEmitter = (0, _hooks.useAppSelector)(_rootPropsSelectors.selectEventEmitter);
+  var dispatch = (0, _hooks.useAppDispatch)();
+  var syncMethod = (0, _hooks.useAppSelector)(_rootPropsSelectors.selectSyncMethod);
+  var tooltipTicks = (0, _hooks.useAppSelector)(_tooltipSelectors.selectTooltipAxisTicks);
+  var layout = (0, _chartLayoutContext.useChartLayout)();
+  var viewBox = (0, _chartLayoutContext.useViewBox)();
+  var className = (0, _hooks.useAppSelector)(state => state.rootProps.className);
+  (0, _react.useEffect)(() => {
+    if (mySyncId == null) {
+      // This chart is not synchronised with any other chart so we don't need to listen for any events.
+      return noop;
+    }
+    var listener = (incomingSyncId, action, emitter) => {
+      if (myEventEmitter === emitter) {
+        // We don't want to dispatch actions that we sent ourselves.
+        return;
+      }
+      if (mySyncId !== incomingSyncId) {
+        // This event is not for this chart
+        return;
+      }
+      if (syncMethod === 'index') {
+        dispatch(action);
+        // This is the default behaviour, we don't need to do anything else.
+        return;
+      }
+      if (tooltipTicks == null) {
+        // for the other two sync methods, we need the ticks to be available
+        return;
+      }
+      var activeTick;
+      if (typeof syncMethod === 'function') {
+        /*
+         * This is what the data shape in 2.x CategoricalChartState used to look like.
+         * In 3.x we store things differently but let's try to keep the old shape for compatibility.
+         */
+        var syncMethodParam = {
+          activeTooltipIndex: action.payload.index == null ? undefined : Number(action.payload.index),
+          isTooltipActive: action.payload.active,
+          activeIndex: action.payload.index == null ? undefined : Number(action.payload.index),
+          activeLabel: action.payload.label,
+          activeDataKey: action.payload.dataKey,
+          activeCoordinate: action.payload.coordinate
+        };
+        // Call a callback function. If there is an application specific algorithm
+        var activeTooltipIndex = syncMethod(tooltipTicks, syncMethodParam);
+        activeTick = tooltipTicks[activeTooltipIndex];
+      } else if (syncMethod === 'value') {
+        // labels are always strings, tick.value might be a string or a number, depending on axis type
+        activeTick = tooltipTicks.find(tick => String(tick.value) === action.payload.label);
+      }
+      var {
+        coordinate
+      } = action.payload;
+      if (activeTick == null || action.payload.active === false || coordinate == null || viewBox == null) {
+        dispatch((0, _tooltipSlice.setSyncInteraction)({
+          active: false,
+          coordinate: undefined,
+          dataKey: undefined,
+          index: null,
+          label: undefined
+        }));
+        return;
+      }
+      var {
+        x,
+        y
+      } = coordinate;
+      var validateChartX = Math.min(x, viewBox.x + viewBox.width);
+      var validateChartY = Math.min(y, viewBox.y + viewBox.height);
+      var activeCoordinate = {
+        x: layout === 'horizontal' ? activeTick.coordinate : validateChartX,
+        y: layout === 'horizontal' ? validateChartY : activeTick.coordinate
+      };
+      var syncAction = (0, _tooltipSlice.setSyncInteraction)({
+        active: action.payload.active,
+        coordinate: activeCoordinate,
+        dataKey: action.payload.dataKey,
+        index: String(activeTick.index),
+        label: action.payload.label
+      });
+      dispatch(syncAction);
+    };
+    _Events.eventCenter.on(_Events.TOOLTIP_SYNC_EVENT, listener);
+    return () => {
+      _Events.eventCenter.off(_Events.TOOLTIP_SYNC_EVENT, listener);
+    };
+  }, [className, dispatch, myEventEmitter, mySyncId, syncMethod, tooltipTicks, layout, viewBox]);
+}
+function useBrushSyncEventsListener() {
+  var mySyncId = (0, _hooks.useAppSelector)(_rootPropsSelectors.selectSyncId);
+  var myEventEmitter = (0, _hooks.useAppSelector)(_rootPropsSelectors.selectEventEmitter);
+  var dispatch = (0, _hooks.useAppDispatch)();
+  (0, _react.useEffect)(() => {
+    if (mySyncId == null) {
+      // This chart is not synchronised with any other chart so we don't need to listen for any events.
+      return noop;
+    }
+    var listener = (incomingSyncId, action, emitter) => {
+      if (myEventEmitter === emitter) {
+        // We don't want to dispatch actions that we sent ourselves.
+        return;
+      }
+      if (mySyncId === incomingSyncId) {
+        dispatch((0, _chartDataSlice.setDataStartEndIndexes)(action));
+      }
+    };
+    _Events.eventCenter.on(_Events.BRUSH_SYNC_EVENT, listener);
+    return () => {
+      _Events.eventCenter.off(_Events.BRUSH_SYNC_EVENT, listener);
+    };
+  }, [dispatch, myEventEmitter, mySyncId]);
+}
+
+/**
+ * Will receive synchronisation events from other charts.
+ *
+ * Reads syncMethod from state and decides how to synchronise the tooltip based on that.
+ *
+ * @returns void
+ */
+function useSynchronisedEventsFromOtherCharts() {
+  var dispatch = (0, _hooks.useAppDispatch)();
+  (0, _react.useEffect)(() => {
+    dispatch((0, _optionsSlice.createEventEmitter)());
+  }, [dispatch]);
+  useTooltipSyncEventsListener();
+  useBrushSyncEventsListener();
+}
+
+/**
+ * Will send events to other charts.
+ * If syncId is undefined, no events will be sent.
+ *
+ * This ignores the syncMethod, because that is set and computed on the receiving end.
+ *
+ * @param tooltipEventType from Tooltip
+ * @param trigger from Tooltip
+ * @param activeCoordinate from state
+ * @param activeLabel from state
+ * @param activeIndex from state
+ * @param isTooltipActive from state
+ * @returns void
+ */
+function useTooltipChartSynchronisation(tooltipEventType, trigger, activeCoordinate, activeLabel, activeIndex, isTooltipActive) {
+  var activeDataKey = (0, _hooks.useAppSelector)(state => (0, _selectors.selectTooltipDataKey)(state, tooltipEventType, trigger));
+  var eventEmitterSymbol = (0, _hooks.useAppSelector)(_rootPropsSelectors.selectEventEmitter);
+  var syncId = (0, _hooks.useAppSelector)(_rootPropsSelectors.selectSyncId);
+  var syncMethod = (0, _hooks.useAppSelector)(_rootPropsSelectors.selectSyncMethod);
+  var tooltipState = (0, _hooks.useAppSelector)(_syncSelectors.selectSynchronisedTooltipState);
+  var isReceivingSynchronisation = tooltipState === null || tooltipState === void 0 ? void 0 : tooltipState.active;
+  (0, _react.useEffect)(() => {
+    if (isReceivingSynchronisation) {
+      /*
+       * This chart currently has active tooltip, synchronised from another chart.
+       * Let's not send any outgoing synchronisation events while that's happening
+       * to avoid infinite loops.
+       */
+      return;
+    }
+    if (syncId == null) {
+      /*
+       * syncId is not set, means that this chart is not synchronised with any other chart,
+       * means we don't need to send synchronisation events
+       */
+      return;
+    }
+    if (eventEmitterSymbol == null) {
+      /*
+       * When using Recharts internal hooks and selectors outside charts context,
+       * these properties will be undefined. Let's return silently instead of throwing an error.
+       */
+      return;
+    }
+    var syncAction = (0, _tooltipSlice.setSyncInteraction)({
+      active: isTooltipActive,
+      coordinate: activeCoordinate,
+      dataKey: activeDataKey,
+      index: activeIndex,
+      label: typeof activeLabel === 'number' ? String(activeLabel) : activeLabel
+    });
+    _Events.eventCenter.emit(_Events.TOOLTIP_SYNC_EVENT, syncId, syncAction, eventEmitterSymbol);
+  }, [isReceivingSynchronisation, activeCoordinate, activeDataKey, activeIndex, activeLabel, eventEmitterSymbol, syncId, syncMethod, isTooltipActive]);
+}
+function useBrushChartSynchronisation() {
+  var syncId = (0, _hooks.useAppSelector)(_rootPropsSelectors.selectSyncId);
+  var eventEmitterSymbol = (0, _hooks.useAppSelector)(_rootPropsSelectors.selectEventEmitter);
+  var brushStartIndex = (0, _hooks.useAppSelector)(state => state.chartData.dataStartIndex);
+  var brushEndIndex = (0, _hooks.useAppSelector)(state => state.chartData.dataEndIndex);
+  (0, _react.useEffect)(() => {
+    if (syncId == null || brushStartIndex == null || brushEndIndex == null || eventEmitterSymbol == null) {
+      return;
+    }
+    var syncAction = {
+      startIndex: brushStartIndex,
+      endIndex: brushEndIndex
+    };
+    _Events.eventCenter.emit(_Events.BRUSH_SYNC_EVENT, syncId, syncAction, eventEmitterSymbol);
+  }, [brushEndIndex, brushStartIndex, eventEmitterSymbol, syncId]);
+}
+
+export { useChartSynchronisation as default };