@helpscout/hsds-react/components/CopyButton/CopyButton.utils.js

React component library for Help Scout's Design System

"use strict";

exports.__esModule = true;
exports.useCopyConfirmation = void 0;

var _react = require("react");

var useCopyConfirmation = function useCopyConfirmation(props) {
  var onClick = props.onClick,
      onReset = props.onReset,
      _props$resetTimeout = props.resetTimeout,
      resetTimeout = _props$resetTimeout === void 0 ? 2000 : _props$resetTimeout;

  var _useState = (0, _react.useState)(false),
      shouldRenderConfirmation = _useState[0],
      setConfirmation = _useState[1];

  var confirmationTimeout = (0, _react.useRef)();
  var isCancelled = (0, _react.useRef)(false);
  var handleClick = (0, _react.useCallback)(function (e) {
    if (confirmationTimeout.current) {
      clearTimeout(confirmationTimeout);
    }

    setConfirmation(true);
    onClick && onClick(e);
    confirmationTimeout.current = setTimeout(function () {
      if (!isCancelled.current) {
        setConfirmation(false);
        onReset && onReset();
      }
    }, resetTimeout);
  }, [onClick, onReset, resetTimeout]);
  (0, _react.useEffect)(function () {
    if (confirmationTimeout.current) {
      clearTimeout(confirmationTimeout);
    }

    return function () {
      isCancelled.current = true;

      if (confirmationTimeout.current) {
        clearTimeout(confirmationTimeout);
      }
    };
  }, []);
  return [shouldRenderConfirmation, handleClick];
};

exports.useCopyConfirmation = useCopyConfirmation;