react-jsx-highstock/dist/es/components/Navigator/NavigatorAxis.js

Highcharts (including Highstock) charts built using React components

import * as React from 'react';
import { useRef, useEffect, Children, cloneElement, isValidElement } from 'react';
import { useAxis, useModifiedProps, getNonEventHandlerProps } from 'react-jsx-highcharts';
import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
const NavigatorAxis = ({
  children,
  axisId,
  ...restProps
}) => {
  const axis = useAxis(axisId);
  const renderedRef = useRef(false);
  useEffect(() => {
    if (!axis) return;
    updateNavigatorAxis(getNonEventHandlerProps(restProps), axis);
  }, [axis]);
  const modifiedProps = useModifiedProps(restProps);
  useEffect(() => {
    if (!renderedRef.current) {
      // don't update on first render
      renderedRef.current = true;
      return;
    }
    if (!axis) return;
    if (modifiedProps !== false) {
      updateNavigatorAxis(modifiedProps, axis);
    }
  });
  if (!children) return null;
  const axisChildren = Children.map(children, child => {
    if (/*#__PURE__*/isValidElement(child) === false) return child;
    return /*#__PURE__*/cloneElement(child, {
      axisId
    });
  });
  return /*#__PURE__*/_jsx(_Fragment, {
    children: axisChildren
  });
};
const updateNavigatorAxis = (config, axis) => {
  axis.update(config);
};
export default NavigatorAxis;