@platformbuilders/fluid-react
Version:
Builders React for Fluid Design System
24 lines (23 loc) • 1.27 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import Icons from '../Icons';
import { ContentWrapper, Loading, TextButton, Touchable } from './styles';
const Button = ({ id, children, onPress, accessibility, disabled = false, loading = false, $fullWidth = false, variant = 'filled', typographyVariant = 'md', leftIconName, rightIconName, $colorVariant = 'primary', size = 'normal', ...rest }) => {
const LeftIcon = leftIconName ? Icons[leftIconName] : undefined;
const RightIcon = rightIconName ? Icons[rightIconName] : undefined;
const contentWrapperProps = {
variant,
size,
$fullWidth,
};
const touchableProps = {
accessibility,
disabled: loading || disabled,
variant,
onPress,
$colorVariant,
size,
};
return (_jsx(Touchable, { id: id || accessibility, ...touchableProps, ...rest, children: loading ? (_jsx(Loading, {})) : (_jsxs(ContentWrapper, { accessibility: "container button", ...contentWrapperProps, children: [LeftIcon ? _jsx(LeftIcon, {}) : null, _jsx(TextButton, { className: "text-button", variant: typographyVariant, children: children }), RightIcon ? _jsx(RightIcon, {}) : null] })) }));
};
export default Button;
export * from './types';