import {
  TextInput
} from "./chunk-H5MRGJQP.js";
import {
  InputSubtext,
  inputBlockStyle
} from "./chunk-FTMB6R72.js";
import {
  Pill
} from "./chunk-OSYLTDKI.js";
import {
  useClipboard
} from "./chunk-QHODHUW2.js";
import {
  UnstyledButton
} from "./chunk-5NUOBJXP.js";
import {
  Icon
} from "./chunk-DMPXNHDT.js";
import {
  useBreakpoints
} from "./chunk-JSGRNWSB.js";
import {
  __async
} from "./chunk-W7FAWX6T.js";

// src/components/ReadClipboardButton.tsx
import styled from "@emotion/styled";
import { Fragment, useCallback, useEffect, useRef, useState } from "react";
import { jsx, jsxs } from "@emotion/react/jsx-runtime";
function ReadClipboardButton({
  onChangeTextInput = () => {
  },
  onPasteValue,
  onRemoveValue,
  valueLoading = false,
  value,
  errorMsg,
  description,
  autoButtonText,
  onClickAutoButton,
  hint,
  clipboardCallbacks
}) {
  const bp = useBreakpoints();
  const { canReadFromClipboard, readTextFromClipboard } = useClipboard(clipboardCallbacks);
  const [isEditingTextInput, setIsEditingTextInput] = useState(false);
  const isDeleting = useRef(false);
  const getTextFromClipboard = useCallback(() => __async(this, null, function* () {
    const text = yield readTextFromClipboard();
    if (text !== null) {
      const value2 = text.trim();
      if (value2 === "") {
        setIsEditingTextInput(true);
      } else {
        onPasteValue(value2);
      }
    }
  }), [onPasteValue, readTextFromClipboard]);
  function onClick() {
    if (!isDeleting.current) {
      void getTextFromClipboard();
    } else {
      isDeleting.current = false;
    }
  }
  function onDeleteMouseDown(e) {
    e.stopPropagation();
    isDeleting.current = true;
    onRemoveValue();
  }
  function onDeleteMouseUp() {
    isDeleting.current = false;
  }
  const onKeyDown = useCallback(
    (event) => {
      const charCode = String.fromCharCode(event.which).toLowerCase();
      if (document.activeElement === document.body) {
        if (canReadFromClipboard) {
          if ((event.ctrlKey || event.metaKey) && charCode === "v") {
            event.preventDefault();
            void getTextFromClipboard();
            return;
          }
        }
        if (event.key === "Escape" || event.key === "Delete") {
          onRemoveValue();
        } else if (charCode.match(/^[a-z0-9]$/i)) {
          setIsEditingTextInput(true);
        }
      }
    },
    [getTextFromClipboard, canReadFromClipboard, onRemoveValue]
  );
  useEffect(() => {
    document.addEventListener("keydown", onKeyDown);
    return () => {
      document.removeEventListener("keydown", onKeyDown);
    };
  }, [onKeyDown]);
  return (canReadFromClipboard || onClickAutoButton) && !bp.isSm() ? /* @__PURE__ */ jsxs(Fragment, { children: [
    /* @__PURE__ */ jsx(
      ReadClipboardButtonContainer,
      {
        onClick: onClickAutoButton ? onClickAutoButton : onClick,
        hasAddress: Boolean(value),
        hasError: Boolean(errorMsg),
        onMouseUp: onDeleteMouseUp,
        children: autoButtonText ? /* @__PURE__ */ jsx(
          UnstyledButton,
          {
            onClick: onClickAutoButton,
            css: { cursor: "pointer" },
            children: /* @__PURE__ */ jsx(
              Pill,
              {
                text: autoButtonText,
                icon: "MagicWand",
                cursor: "pointer",
                loading: valueLoading,
                onClickPillBody: onClickAutoButton
              }
            )
          }
        ) : /* @__PURE__ */ jsxs(Fragment, { children: [
          !value && !isEditingTextInput ? /* @__PURE__ */ jsxs(UnstyledButton, { onClick, children: [
            /* @__PURE__ */ jsx(Icon, { name: "Copy", width: 19 }),
            /* @__PURE__ */ jsx("div", { css: { marginTop: "8px" }, children: description })
          ] }) : null,
          value || isEditingTextInput ? /* @__PURE__ */ jsx(
            Pill,
            {
              text: value,
              onDeleteMouseDown,
              loading: valueLoading,
              isEditing: isEditingTextInput,
              onChangeTextInput: (value2) => {
                onChangeTextInput(value2);
              },
              onFocusTextInput: () => setIsEditingTextInput(true),
              onBlurTextInput: () => setIsEditingTextInput(false),
              onClickPillBody: onClickAutoButton ? onClickAutoButton : () => setIsEditingTextInput(true)
            }
          ) : null
        ] })
      }
    ),
    /* @__PURE__ */ jsx(InputSubtext, { text: errorMsg || hint, hasError: Boolean(errorMsg) })
  ] }) : /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(
    TextInput,
    {
      onChange: onChangeTextInput,
      value,
      hint,
      error: errorMsg || void 0
    }
  ) });
}
var ReadClipboardButtonContainer = styled.div`
  ${({ theme, hasAddress, hasError }) => inputBlockStyle({ theme, hasValue: hasAddress, hasError })}
`;

export {
  ReadClipboardButton
};
