import { cs } from "../utils/styles.js";
import { omitThemingProps, useStyleConfig } from "../core/theme.js";
import vui from "../core/vui.js";
import Box from "../box/box.js";
import { jsx } from "react/jsx-runtime";

//#region src/card/card.tsx
/**
* Displays static, partially interactive or fully interactive content, such as text, images or buttons.
* Supports use cases like a single card or multiple tiles.
*/
const Card = vui((props, ref) => {
	const { className, isInteractive = props.onClick !== void 0, ...rest } = omitThemingProps(props);
	const styles = useStyleConfig("Card", props);
	const interactiveProps = isInteractive ? {
		cursor: "pointer",
		focusRing: 2,
		hoverRingColor: "seaBlue.main",
		outline: "none",
		tabIndex: 0,
		userSelect: "none"
	} : {};
	return /* @__PURE__ */ jsx(Box, {
		className: cs("vui-card", className),
		ref,
		...styles,
		...interactiveProps,
		...rest
	});
});
Card.displayName = "Card";

//#endregion
export { Card as default };
globalThis.__vuiVersion__ = "4.0.1"
//# sourceMappingURL=card.js.map