import { _objectSpread2 } from "../../../_virtual/_@oxc-project_runtime@0.122.0/helpers/objectSpread2.js";
import { _objectWithoutProperties } from "../../../_virtual/_@oxc-project_runtime@0.122.0/helpers/objectWithoutProperties.js";
import usePisellConfig from "../../pisell-config-provider/hooks/usePisellConfig.js";
import BaseNumberKeyboard from "../BaseNumberKeyboard/index.js";
import { numberThemeConfig } from "./themeConfig.js";
import React, { useEffect, useMemo } from "react";
import { setTheme } from "@pisell/utils";
import classNames from "classnames";
import { useControllableValue } from "ahooks";
import "./index.less";
//#region src/components/virtual-keyboard/Number/index.tsx
const _excluded = [
	"min",
	"max",
	"doneText",
	"resetText",
	"defaultValue",
	"placeholder",
	"onEnter",
	"selectType",
	"defaultSelect"
];
const Number = (props) => {
	const { min, max, doneText, resetText, defaultValue, placeholder, onEnter, selectType = "light", defaultSelect } = props;
	_objectWithoutProperties(props, _excluded);
	usePisellConfig();
	const [value, setValue] = useControllableValue(props, { defaultValue: defaultValue || "" });
	useEffect(() => {
		document.body.id = "body";
	}, []);
	/**
	* 配置颜色
	* 根据 props 和 selectType 生成最终的配置颜色
	*/
	const configColor = useMemo(() => {
		const currentConfig = numberThemeConfig[selectType];
		const validProps = Object.entries(props).reduce((acc, [key, value]) => {
			if (value !== void 0 && key in currentConfig) acc[key] = value;
			return acc;
		}, {});
		return _objectSpread2(_objectSpread2({}, currentConfig), validProps);
	}, [selectType, props]);
	useEffect(() => {
		setTheme({
			"--pisell-number-background-color": configColor.backgroundColor,
			"--pisell-number-container-background-color": configColor.containerBackgroundColor,
			"--pisell-number-text-color": configColor.textColor,
			"--pisell-number-keyboard-background-color": configColor.keyboardBackgroundColor,
			"--pisell-number-keyboard-button-background-color": configColor.keyboardButtonBackgroundColor,
			"--pisell-number-keyboard-button-text-color": configColor.keyboardButtonTextColor,
			"--pisell-number-keyboard-button-hover-color": configColor.keyboardButtonHoverColor,
			"--pisell-number-reset-button-background-color": configColor.resetButtonBackgroundColor,
			"--pisell-number-reset-button-text-color": configColor.resetButtonTextColor,
			"--pisell-number-done-button-background-color": configColor.doneButtonBackgroundColor,
			"--pisell-number-done-button-text-color": configColor.doneButtonTextColor
		});
	}, [configColor]);
	return /* @__PURE__ */ React.createElement("div", { className: classNames("pisell-number-keyboard-wrap", {
		"pisell-number-keyboard-dark": selectType === "dark",
		"pisell-number-keyboard-light": selectType === "light"
	}) }, /* @__PURE__ */ React.createElement(BaseNumberKeyboard, {
		max,
		min,
		value,
		defaultValue,
		onChange: setValue,
		placeholder,
		doneText,
		resetText,
		onEnter,
		defaultSelect,
		rightItemsStyle: {
			buttonBackgroundColor: configColor.buttonBackgroundColor,
			textColor: configColor.textColor,
			resetButtonBackgroundColor: configColor.resetButtonBackgroundColor,
			resetButtonTextColor: configColor.resetButtonTextColor,
			isDoneButtonFollowTheme: configColor.isDoneButtonFollowTheme,
			doneButtonBackgroundColor: configColor.doneButtonBackgroundColor,
			doneButtonTextColor: configColor.doneButtonTextColor
		}
	}));
};
//#endregion
export { Number as default };
