"use client";
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
const require_chunk = require("../chunk-BN4qSVkS.cjs");
let _emotion_styled = require("@emotion/styled");
_emotion_styled = require_chunk.__toESM(_emotion_styled);
let _emotion_react_jsx_runtime = require("@emotion/react/jsx-runtime");
//#region src/components/CommandKey.tsx
const CommandKey = ({ keyboardKey, size, color, backgroundColor }) => {
	return /* @__PURE__ */ (0, _emotion_react_jsx_runtime.jsx)(StyledCommandKey, {
		color,
		size,
		backgroundColor,
		children: keyboardKey
	});
};
const StyledCommandKey = _emotion_styled.default.div`
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 500;
  color: ${(props) => props.color || "black"};
  ${(props) => props.backgroundColor ? `background-color: ${props.backgroundColor};` : ""}
  border-radius: 3.6px;
  min-width: ${(props) => props.size === "sm" ? 20 : 24}px;
  height: ${(props) => props.size === "sm" ? 20 : 24}px;
  font-size: ${(props) => props.size === "sm" ? 12 : 14}px;
  padding: 3px 6px;
`;
//#endregion
exports.CommandKey = CommandKey;
