import React, { useContext, useMemo, useRef } from "react";
import classNames from "classnames";
import { Popup } from "../popup";
import { genCustomKeys, genDefaultKeys } from "./utils";
import ConfigProviderContext from "../config-provider/ConfigProviderContext";
import NumberKeyboardKey from "./NumberKeyboardKey";
import useClickAway from "../hooks/use-click-away";
const NumberKeyboard = (props) => {
  const {
    prefixCls,
    createNamespace
  } = useContext(ConfigProviderContext);
  const [bem] = createNamespace("number-keyboard", prefixCls);
  const {
    visible,
    safeAreaInsetBottom,
    theme,
    blurOnClose,
    showDeleteKey,
    hideOnClickOutside,
    zIndex,
    teleport,
    title,
    closeButtonText,
    titleLeft
  } = props;
  const root = useRef(null);
  const showClose = closeButtonText && theme === "default";
  const showTitle = !!(title || showClose || titleLeft);
  const keys = useMemo(() => theme === "custom" ? genCustomKeys(props) : genDefaultKeys(props), [theme]);
  const onBlur = () => {
    var _a;
    if (visible) {
      (_a = props.onBlur) == null ? void 0 : _a.call(props);
    }
  };
  const onClose = () => {
    var _a;
    (_a = props.onClose) == null ? void 0 : _a.call(props);
    if (blurOnClose) {
      onBlur();
    }
  };
  const onPress = (text, type) => {
    var _a, _b;
    if (text === "") {
      if (type === "extra") {
        onBlur();
      }
      return;
    }
    if (type === "delete") {
      (_a = props.onDelete) == null ? void 0 : _a.call(props);
    } else if (type === "close") {
      onClose();
    } else {
      (_b = props.onInput) == null ? void 0 : _b.call(props, text);
    }
  };
  const renderTitle = () => {
    if (!showTitle) {
      return null;
    }
    return /* @__PURE__ */ React.createElement("div", {
      className: classNames(bem("header"))
    }, titleLeft && /* @__PURE__ */ React.createElement("span", {
      className: classNames(bem("title-left"))
    }, titleLeft), title && /* @__PURE__ */ React.createElement("h2", {
      className: classNames(bem("title"))
    }, title), showClose && /* @__PURE__ */ React.createElement("button", {
      type: "button",
      className: classNames(bem("close")),
      onClick: onClose
    }, closeButtonText));
  };
  const renderKeys = () => {
    return keys.map((key) => {
      return /* @__PURE__ */ React.createElement(NumberKeyboardKey, {
        key: `${key.text}${key.type}`,
        text: key.text,
        type: key.type,
        wider: key.wider,
        color: key.color,
        onPress
      });
    });
  };
  const renderSidebar = () => {
    if (theme === "custom") {
      return /* @__PURE__ */ React.createElement("div", {
        className: classNames(bem("sidebar"))
      }, showDeleteKey && /* @__PURE__ */ React.createElement(NumberKeyboardKey, {
        large: true,
        text: props.deleteButtonText,
        type: "delete",
        onPress
      }), /* @__PURE__ */ React.createElement(NumberKeyboardKey, {
        large: true,
        text: props.closeButtonText,
        type: "close",
        color: "blue",
        loading: props.closeButtonLoading,
        onPress
      }));
    }
    return null;
  };
  useClickAway(root, onBlur, "touchstart", hideOnClickOutside);
  return /* @__PURE__ */ React.createElement(Popup, {
    visible,
    preventDefaultMouseDown: true,
    overlay: false,
    round: showTitle,
    zIndex,
    position: "bottom",
    duration: 300,
    teleport,
    safeAreaInsetBottom,
    onClose
  }, /* @__PURE__ */ React.createElement("div", {
    ref: root,
    className: classNames(bem())
  }, renderTitle(), /* @__PURE__ */ React.createElement("div", {
    className: classNames(bem("body"))
  }, /* @__PURE__ */ React.createElement("div", {
    className: classNames(bem("keys"))
  }, renderKeys()), renderSidebar())));
};
NumberKeyboard.defaultProps = {
  theme: "default",
  visible: false,
  extraKey: "",
  showDeleteKey: true,
  zIndex: 100,
  closeButtonLoading: false,
  hideOnClickOutside: true,
  randomKeyOrder: false,
  safeAreaInsetBottom: true,
  blurOnClose: true
};
var stdin_default = NumberKeyboard;
export {
  stdin_default as default
};
