UNPKG

@nestbotics/nct_frontend_common_components

Version:

A collection of reusable React components with theme management and styling utilities

113 lines (112 loc) 5.22 kB
"use strict"; var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault"); Object.defineProperty(exports, "__esModule", { value: true }); exports.default = void 0; var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty")); var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties")); var _react = _interopRequireDefault(require("react")); var _material = require("@mui/material"); var _propTypes = _interopRequireDefault(require("prop-types")); var _jsxRuntime = require("react/jsx-runtime"); var _excluded = ["buttonType", "label", "onClick", "icon", "fullWidth", "className", "sx", "disabled", "size", "startIcon", "endIcon", "type"]; /** * CustomButton component that provides styled buttons with different variants * * @param {object} props - Component props * @param {'primary'|'secondary'|'tertiary'} [props.buttonType='primary'] - Button type/variant * @param {string} props.label - Button label text * @param {function} props.onClick - Click handler function * @param {React.ReactNode} [props.icon] - Icon to display (legacy support) * @param {boolean} [props.fullWidth=false] - Whether button should take full width * @param {string} [props.className] - Additional class names * @param {object} [props.sx] - MUI sx prop for additional styling * @param {boolean} [props.disabled=false] - Whether button is disabled * @param {'small'|'medium'|'large'} [props.size='medium'] - Button size * @param {React.ReactNode} [props.startIcon] - Icon to display before label * @param {React.ReactNode} [props.endIcon] - Icon to display after label * @param {string} [props.type='button'] - HTML button type (button, submit, reset) * @param {any} [props.rest] - Additional props to pass to Button component */ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; } function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; } var CustomButton = function CustomButton(_ref) { var _ref$buttonType = _ref.buttonType, buttonType = _ref$buttonType === void 0 ? 'primary' : _ref$buttonType, label = _ref.label, onClick = _ref.onClick, icon = _ref.icon, _ref$fullWidth = _ref.fullWidth, fullWidth = _ref$fullWidth === void 0 ? false : _ref$fullWidth, _ref$className = _ref.className, className = _ref$className === void 0 ? '' : _ref$className, _ref$sx = _ref.sx, sx = _ref$sx === void 0 ? {} : _ref$sx, _ref$disabled = _ref.disabled, disabled = _ref$disabled === void 0 ? false : _ref$disabled, _ref$size = _ref.size, size = _ref$size === void 0 ? 'medium' : _ref$size, startIcon = _ref.startIcon, endIcon = _ref.endIcon, _ref$type = _ref.type, type = _ref$type === void 0 ? 'button' : _ref$type, rest = (0, _objectWithoutProperties2.default)(_ref, _excluded); // Convert buttonType to appropriate variant prop and class var getButtonProps = function getButtonProps() { switch (buttonType) { case 'primary': return { variant: 'contained', className: "btn-primary ".concat(className) }; case 'secondary': return { variant: 'outlined', className: "btn-secondary ".concat(className) }; case 'tertiary': return { variant: 'text', className: "btn-tertiary ".concat(className) }; default: return { variant: 'contained', className: "btn-primary ".concat(className) }; } }; var _getButtonProps = getButtonProps(), variant = _getButtonProps.variant, btnClassName = _getButtonProps.className; return /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Button, _objectSpread(_objectSpread({ variant: variant, onClick: onClick, fullWidth: fullWidth, className: btnClassName, sx: sx, disabled: disabled, size: size, startIcon: startIcon || icon, endIcon: endIcon, type: type }, rest), {}, { children: label })); }; CustomButton.propTypes = { buttonType: _propTypes.default.oneOf(['primary', 'secondary', 'tertiary']), label: _propTypes.default.string.isRequired, onClick: _propTypes.default.func, icon: _propTypes.default.node, fullWidth: _propTypes.default.bool, className: _propTypes.default.string, sx: _propTypes.default.object, disabled: _propTypes.default.bool, size: _propTypes.default.oneOf(['small', 'medium', 'large']), startIcon: _propTypes.default.node, endIcon: _propTypes.default.node, type: _propTypes.default.string }; var _default = exports.default = CustomButton;