import { _objectSpread2 } from "../../_virtual/_@oxc-project_runtime@0.122.0/helpers/objectSpread2.js";
import React, { useRef } from "react";
import { Button } from "antd";
import classNames from "classnames";
import { useEventListener, useMemoizedFn, useSize } from "ahooks";
import "./index.less";
//#region src/components/keyboard/index.tsx
const list = [
	"1",
	"2",
	"3",
	"4",
	"5",
	"6",
	"7",
	"8",
	"9",
	"0",
	"+",
	"ok"
];
const defaultArr = [
	{
		value: 1,
		label: "1",
		disabled: false,
		type: "text"
	},
	{
		value: 2,
		label: "2",
		disabled: false,
		type: "text"
	},
	{
		value: 3,
		label: "3",
		disabled: false,
		type: "text"
	},
	{
		value: 4,
		label: "4",
		disabled: false,
		type: "text"
	},
	{
		value: 5,
		label: "5",
		disabled: false,
		type: "text"
	},
	{
		value: 6,
		label: "6",
		disabled: false,
		type: "text"
	},
	{
		value: 7,
		label: "7",
		disabled: false,
		type: "text"
	},
	{
		value: 8,
		label: "8",
		disabled: false,
		type: "text"
	},
	{
		value: 9,
		label: "9",
		disabled: false,
		type: "text"
	},
	{
		value: "0",
		label: "0",
		disabled: false,
		type: "text"
	},
	{
		value: "00",
		label: "00",
		disabled: false,
		type: "text"
	},
	{
		value: ".",
		label: ".",
		disabled: false,
		type: "text"
	}
];
const Keyboard = (props) => {
	const { items = defaultArr, className, style, onChange, rightItems, keydown = true } = props;
	const contentRef = useRef(null);
	const size = useSize(contentRef);
	useEventListener("keydown", (ev) => {
		console.log("ev", ev);
		if (!keydown) return;
		let key = ev.key;
		if (key === "Enter") key = "ok";
		if (key === "keydown") key = "+";
		if (key === "Backspace") key = "delete";
		if (list.includes(key)) onChange === null || onChange === void 0 || onChange(key);
	});
	const getHeight = useMemoizedFn((itemSize = 1) => {
		return ((size === null || size === void 0 ? void 0 : size.width) || 0) / 4 * itemSize + (itemSize - 1) * 7;
	});
	return /* @__PURE__ */ React.createElement("div", {
		id: props.id || "",
		className: classNames("pisell-virtual-keyboard-wrap", className),
		style
	}, /* @__PURE__ */ React.createElement("div", {
		className: classNames("pisell-virtual-keyboard-content"),
		ref: contentRef
	}, items.map((item) => {
		var _item$style;
		return /* @__PURE__ */ React.createElement("div", {
			className: "pisell-virtual-keyboard-item",
			style: item.style
		}, /* @__PURE__ */ React.createElement(Button, {
			id: `pisell-virtual-keyboard-${item.value}`,
			key: item.value,
			type: item.type,
			className: "pisell-virtual-keyboard-item-button",
			style: { color: item.type === "primary" ? "#fff" : ((_item$style = item.style) === null || _item$style === void 0 ? void 0 : _item$style.color) || void 0 },
			disabled: item.disabled,
			onClick: (e) => {
				onChange === null || onChange === void 0 || onChange(item.value);
			}
		}, item.label));
	})), rightItems && /* @__PURE__ */ React.createElement("div", {
		className: classNames("pisell-virtual-keyboard-content", "pisell-virtual-keyboard-right"),
		style: { flex: `0 0 calc((100% - 21px) / 4 * 1)` }
	}, rightItems === null || rightItems === void 0 ? void 0 : rightItems.map((item) => {
		var _item$style2, _item$style3;
		return /* @__PURE__ */ React.createElement("div", {
			className: "pisell-virtual-keyboard-item",
			style: _objectSpread2(_objectSpread2({}, item.style || {}), {}, { height: getHeight(item.size) })
		}, /* @__PURE__ */ React.createElement(Button, {
			id: `pisell-virtual-keyboard-${item.value}`,
			key: item.value,
			type: item.type,
			className: "pisell-virtual-keyboard-item-button",
			style: _objectSpread2({
				fontSize: ((_item$style2 = item.style) === null || _item$style2 === void 0 ? void 0 : _item$style2.fontSize) || 25,
				color: item.type === "primary" ? "#fff" : ((_item$style3 = item.style) === null || _item$style3 === void 0 ? void 0 : _item$style3.color) || void 0
			}, item.type === "primary" ? item.style || {} : {}),
			disabled: item.disabled,
			onClick: (e) => {
				onChange === null || onChange === void 0 || onChange(item.value);
			}
		}, item.label));
	})));
};
var keyboard_default = React.memo(Keyboard);
//#endregion
export { keyboard_default as default };
