UNPKG

@kubit-ui-web/react-components

Version:

Kubit React Components is a customizable, accessible library of React web components, designed to enhance your application's user experience

38 lines 2.04 kB
import { jsx as _jsx } from "react/jsx-runtime"; import React from 'react'; import { STYLES_NAME } from '../../constants/stylesName/stylesName'; import { useManageState } from '../../hooks/useManageState/useManageState'; import { useStyles } from '../../hooks/useStyles/useStyles'; import { ErrorBoundary } from '../../provider/errorBoundary/errorBoundary'; import { FallbackComponent } from '../../provider/errorBoundary/fallbackComponent'; import { ButtonStandAlone } from './buttonStandAlone'; import { ButtonStateType } from './types/state'; import { ButtonType } from './types/type'; const ButtonComponent = React.forwardRef(({ type = ButtonType.BUTTON, disabled = false, loading = false, ctv, cts, ...props }, ref) => { const variantStyles = useStyles(STYLES_NAME.BUTTON, props.variant, ctv); const sizeStyles = useStyles(STYLES_NAME.BUTTON, props.size, cts); const { state, setRef } = useManageState({ states: Object.values(ButtonStateType), ref: ref, disabled, loading, }); if (!props.children && !props.icon?.icon) return null; return (_jsx(ButtonStandAlone, { ...props, ref: setRef, loading: loading, sizeStyles: sizeStyles, state: state, styles: variantStyles, type: type, children: props.children })); }); ButtonComponent.displayName = 'ButtonComponent'; const ButtonBoundary = (props, ref) => (_jsx(ErrorBoundary, { fallBackComponent: _jsx(FallbackComponent, { children: _jsx(ButtonStandAlone, { ...props, ref: ref, type: ButtonType.BUTTON }) }), children: _jsx(ButtonComponent, { ...props, ref: ref }) })); const Button = React.forwardRef(ButtonBoundary); /** * Represents the button component. * * @function Button * @category Atoms * @param {React.PropsWithChildren<IButton>} props - The props for the component. * @param {React.ForwardedRef<HTMLButtonElement>} ref - The ref for the component. * @returns {JSX.Element} - The JSX element representing the button component. */ export { Button }; export default Button; //# sourceMappingURL=button.js.map