diff --git a/src/cryptometrics/components/button/Button.js b/src/cryptometrics/components/button/Button.js index cf14da84404ad8460e12220e853e1650154a4a75..c2208b1175c5ac12f5937fb8de6c2f57595e8314 100644 --- a/src/cryptometrics/components/button/Button.js +++ b/src/cryptometrics/components/button/Button.js @@ -1,7 +1,19 @@ -import classNames from "classnames"; import React from "react"; +import PropTypes from "prop-types"; +import classNames from "classnames"; -export default function Button({ children, className, onClick }) { +/** + * Custom button component + * + * @component + * @example + * return ( + * <Button className="bg-indigo-500 text-white" onClick={() => console.log("Button pressed")}> + * Hello! + * </Button> + * ) + */ +function Button({ children, className, onClick }) { return ( <button className={classNames("py-2 px-5 rounded-xl", className)} @@ -11,3 +23,20 @@ export default function Button({ children, className, onClick }) { </button> ); } + +Button.propTypes = { + /** + * The content inside the button + */ + children: PropTypes.node.isRequired, + /** + * Additional CSS classes for the button (optional) + */ + className: PropTypes.string, + /** + * The function to run when button is pressed + */ + onClick: PropTypes.func, +}; + +export default Button;