brightyui
Version:
Brighty UI library
26 lines • 1.73 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import styles from '../../../src/styles/Selectbox.module.scss';
import { ChevronRightIcon } from '../../images/IconComponents/ChevronRightIcon';
import { cnb } from 'cnbuilder';
import { EColors } from '../../types/EColors';
import Typography from '../Typography/Typography';
import useBool from '../../hooks/useBool';
var Selectbox = function (_a) {
var _b;
var placeholder = _a.placeholder, value = _a.value, disabled = _a.disabled, onClick = _a.onClick, icon = _a.icon, error = _a.error;
var isActive = useBool();
var hadleClick = function (e) {
e.preventDefault();
e.stopPropagation();
if (!disabled) {
isActive.onToggle();
onClick();
}
};
return (_jsxs("div", { className: styles.wrapper, children: [_jsxs("button", { className: cnb(styles.root, (_b = {},
_b[styles.root__disabled] = disabled,
_b[styles.root__active] = isActive.value,
_b)), onClick: hadleClick, children: [icon, _jsxs("div", { className: styles.container, children: [_jsx(Typography, { variant: value ? 'captionRegular' : 'pSmallRegular', color: value ? EColors.text2 : EColors.secondary, children: placeholder }), _jsx(Typography, { variant: 'pSmallRegular', children: value })] }), _jsx("div", { className: styles.button, children: _jsx(ChevronRightIcon, { color: value ? EColors.fill3 : EColors.secondary }) })] }), !!error && (_jsx("div", { className: styles.errorContainer, children: _jsx(Typography, { variant: 'captionRegular', color: EColors.error, children: error }) }))] }));
};
export default Selectbox;
//# sourceMappingURL=Selectbox.js.map