wix-style-react/dist/src/providers/useCopyClipboard/useCopyClipboard.js

wix-style-react

"use strict";

exports.__esModule = true;
exports.default = void 0;
var _react = require("react");
/**
 * @typedef {Object} Clipboard
 * @prop {boolean} isCopied - a return boolean with status of clipboard action
 * @prop {function} copyToClipboard - a return function that allows to initiate copying
 * @prop {function} resetState - an optional return function
 */

/**
 * A custom hook for copying to clipboard. Returns copying to clipboard status and function to initiate copying to clipboard
 * @param {Object} props -  an object for value, onCopy, and resetTimeout props
 * @param {string} props.value -  a string that should be copied to clipboard
 * @param {function} [props.onCopy] - an optional parameter to apply additional logic when copying to clipboard
 * @param {number} [props.resetTimeout] - an optional parameter to set interval which after copying to clipboard will reset status
 * @return {Clipboard}
 */

function useCopyClipboard(_ref) {
  var {
    value,
    onCopy,
    resetTimeout
  } = _ref;
  var [isCopied, setCopied] = (0, _react.useState)(null);
  var copyToClipboard = (0, _react.useCallback)(() => {
    navigator.clipboard.writeText(value).then(() => {
      setCopied(true);
      onCopy == null || onCopy();
    });
  }, [value, onCopy]);
  var reset = (0, _react.useCallback)(() => {
    setCopied(null);
  }, [setCopied]);
  (0, _react.useEffect)(() => {
    var timeout;
    if (isCopied && resetTimeout) {
      timeout = setTimeout(reset, resetTimeout);
    }
    return () => {
      clearTimeout(timeout);
    };
  }, [isCopied, reset, resetTimeout]);
  (0, _react.useEffect)(reset, [value, reset]);
  return {
    isCopied,
    copyToClipboard,
    reset
  };
}
var _default = exports.default = useCopyClipboard;
//# sourceMappingURL=useCopyClipboard.js.map