/** @license MIT | @cube-dev/ui-kit v0.147.0 | Cube Dev Team */
import { useI18n } from "../../../i18n/useI18n.js";
import { DirectionIcon } from "../../../icons/DirectionIcon.js";
import { Button } from "../../actions/index.js";
import { tasty } from "@tenphi/tasty";
import { jsx } from "react/jsx-runtime";

//#region src/components/fields/NumberInput/StepButton.tsx
const StepButtonElement = tasty(Button, {
	preventDefault: true,
	type: "clear",
	styles: {
		width: "($local-size * 1.25)",
		height: "auto",
		radius: {
			"": "0 (1r - 1bw) 0 0",
			down: "0 0 (1r - 1bw) 0"
		},
		padding: 0,
		$size: "inherit",
		"$local-size": "(($size - 2bw) / 2)",
		Icon: {
			width: "auto",
			height: "auto"
		}
	}
});
/**
* Buttons for NumberField.
*/
function StepButton(props) {
	const { t } = useI18n();
	const label = props.direction === "up" ? t("numberInput.stepUp", "Step up") : t("numberInput.stepDown", "Step down");
	return /* @__PURE__ */ jsx(StepButtonElement, {
		preventDefault: true,
		type: "clear",
		mods: {
			up: props.direction === "up",
			down: props.direction === "down"
		},
		label,
		...props,
		children: /* @__PURE__ */ jsx(DirectionIcon, {
			to: props.direction,
			styles: { fontSize: "$local-size" }
		})
	});
}

//#endregion
export { StepButton };
//# sourceMappingURL=StepButton.js.map