packages/ui 문서 모음집

import { Button } from "@hwangchongmu/ui";
import FileDownloadOutlinedIcon from "@mui/icons-material/FileDownloadOutlined";

export function Example() {
  return (
    <Button
      color="primary"
      variant="fill"
      size="large"
      leftIcon={<FileDownloadOutlinedIcon />}
    >
      저장하기
    </Button>
  );
}

type ButtonAs = "button" | "a";
type ButtonColor = "primary" | "danger" | "light" | "dark";
type ButtonVariant = "fill" | "weak";
type ButtonDisplay = "inline" | "block" | "full";
type ButtonSize = "small" | "medium" | "large" | "xlarge";

interface ButtonProps {
  as?: ButtonAs;
  color?: ButtonColor;
  variant?: ButtonVariant;
  display?: ButtonDisplay;
  size?: ButtonSize;
  loading?: boolean;
  disabled?: boolean;
  type?: "button" | "submit" | "reset";
  htmlStyle?: React.CSSProperties;
  onClick?: React.MouseEventHandler<HTMLButtonElement | HTMLAnchorElement>;
  leftIcon?: React.ReactNode;
  rightIcon?: React.ReactNode;
}