brightyui
Version:
Brighty UI library
23 lines • 1.41 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { useRef } from 'react';
import styles from '../../../src/styles/SearchBar.module.scss';
import { cnb } from 'cnbuilder';
import { CloseIcon } from '../../images/IconComponents/CloseIcon';
import { SearchIcon } from '../../images/IconComponents/SearchIcon';
var SearchBar = function (_a) {
var _b;
var className = _a.className, value = _a.value, onChange = _a.onChange, placeholder = _a.placeholder, name = _a.name, disabled = _a.disabled, clearable = _a.clearable;
var inputRef = useRef(null);
var handleClear = function (e) {
e.preventDefault();
e.stopPropagation();
if (inputRef.current) {
inputRef.current.value = '';
}
};
return (_jsx("div", { className: styles.wrapper, children: _jsxs("div", { className: cnb(styles.root, className), children: [_jsx("div", { className: styles.searchIcon, children: _jsx(SearchIcon, {}) }), _jsx("input", { className: cnb(styles.input, (_b = {},
_b[styles.input__clearable] = clearable,
_b)), value: value, onChange: onChange, placeholder: placeholder, disabled: disabled, name: name, ref: inputRef }), _jsx("button", { className: styles.closeButton, onClick: handleClear, children: _jsx(CloseIcon, {}) })] }) }));
};
export default SearchBar;
//# sourceMappingURL=SearchBar.js.map