import { jsx } from "react/jsx-runtime";
import { forwardRef, useMemo } from "react";
/* empty css                 */
import Card$1 from "../../node_modules/@mui/material/Card/Card.js";
const Card = forwardRef(
  ({
    children,
    size = "medium",
    padding = "20px",
    width = "100%",
    maxWidth = 500,
    minHeight = 300,
    clickable = false,
    className = "",
    onClick,
    "aria-label": ariaLabel,
    sx,
    ...args
  }, ref) => {
    const classStr = useMemo(() => {
      let retVal = `ia-styles ia-card ia-card-${size} ${className}`;
      if (clickable) {
        retVal += " ia-card-clickable";
      }
      return retVal.trim();
    }, [size, className, clickable]);
    const handleClick = (event) => {
      if (onClick) {
        onClick(event);
      }
    };
    const handleKeyDown = (event) => {
      if (clickable && onClick && (event.key === "Enter" || event.key === " ")) {
        event.preventDefault();
        onClick(event);
      }
    };
    return /* @__PURE__ */ jsx(
      Card$1,
      {
        ref,
        "aria-label": ariaLabel,
        className: classStr,
        role: clickable ? "button" : void 0,
        tabIndex: clickable ? 0 : void 0,
        onClick: clickable ? handleClick : void 0,
        onKeyDown: clickable ? handleKeyDown : void 0,
        ...args,
        sx: {
          padding,
          width,
          maxWidth,
          minHeight,
          cursor: clickable ? "pointer" : "default",
          ...sx
        },
        children
      }
    );
  }
);
Card.displayName = "Card";
export {
  Card
};
