victory-selection-container/es/victory-selection-container.js

Interactive Selection Component for Victory

import React from "react";
import { Rect, VictoryContainer } from "victory-core";
import { SelectionHelpers } from "./selection-helpers";
export const VICTORY_SELECTION_CONTAINER_DEFAULT_PROPS = {
  activateSelectedData: true,
  allowSelection: true,
  selectionComponent: /*#__PURE__*/React.createElement(Rect, null),
  selectionStyle: {
    stroke: "transparent",
    fill: "black",
    fillOpacity: 0.1
  }
};
export const useVictorySelectionContainer = initialProps => {
  const props = {
    ...VICTORY_SELECTION_CONTAINER_DEFAULT_PROPS,
    ...initialProps
  };
  const {
    x1,
    x2,
    y1,
    y2,
    selectionStyle,
    selectionComponent,
    children,
    name
  } = props;
  const width = Math.abs(x2 - x1) || 1;
  const height = Math.abs(y2 - y1) || 1;
  const x = Math.min(x1, x2);
  const y = Math.min(y1, y2);
  const shouldRenderRect = y1 && y2 && x1 && x2;
  return {
    props,
    children: [children, shouldRenderRect && /*#__PURE__*/React.cloneElement(selectionComponent, {
      key: `${name}-selection`,
      x,
      y,
      width,
      height,
      style: selectionStyle
    })]
  };
};
export const VictorySelectionContainer = initialProps => {
  const {
    props,
    children
  } = useVictorySelectionContainer(initialProps);
  return /*#__PURE__*/React.createElement(VictoryContainer, props, children);
};
VictorySelectionContainer.role = "container";
VictorySelectionContainer.defaultEvents = initialProps => {
  const props = {
    ...VICTORY_SELECTION_CONTAINER_DEFAULT_PROPS,
    ...initialProps
  };
  const createEventHandler = (handler, disabled) =>
  // eslint-disable-next-line max-params
  (event, targetProps, eventKey, context) => disabled || props.disable ? {} : handler(event, {
    ...props,
    ...targetProps
  }, eventKey, context);
  return [{
    target: "parent",
    eventHandlers: {
      onMouseDown: createEventHandler(SelectionHelpers.onMouseDown),
      onTouchStart: createEventHandler(SelectionHelpers.onMouseDown),
      onMouseMove: createEventHandler(SelectionHelpers.onMouseMove),
      onTouchMove: createEventHandler(SelectionHelpers.onMouseMove),
      onMouseUp: createEventHandler(SelectionHelpers.onMouseUp),
      onTouchEnd: createEventHandler(SelectionHelpers.onMouseUp)
    }
  }];
};