@s-ui/react-atom-input
Version:
> Inputs are the text fields that users fill in with different types of information. These include dates, passwords or even short answers. It’s a field where users can write alphanumeric texts.
32 lines • 1.11 kB
JavaScript
import cx from 'classnames';
import PropTypes from 'prop-types';
import { INPUT_SHAPES, SIZES } from '../../../config.js';
import { ADDON_TYPES, BASE_CLASS_ADDON_WRAPPER, getClassName } from './config.js';
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
var InputAddon = function InputAddon(_ref) {
var leftAddon = _ref.leftAddon,
rightAddon = _ref.rightAddon,
shape = _ref.shape,
size = _ref.size,
children = _ref.children;
if (!(leftAddon || rightAddon)) {
return children;
}
return /*#__PURE__*/_jsxs("div", {
className: cx(BASE_CLASS_ADDON_WRAPPER, shape && BASE_CLASS_ADDON_WRAPPER + "-shape-" + shape, size && BASE_CLASS_ADDON_WRAPPER + "-size-" + size),
children: [leftAddon && /*#__PURE__*/_jsx("span", {
className: getClassName({
type: ADDON_TYPES.LEFT,
shape: shape
}),
children: leftAddon
}), children, rightAddon && /*#__PURE__*/_jsx("span", {
className: getClassName({
type: ADDON_TYPES.RIGHT,
shape: shape
}),
children: rightAddon
})]
});
};
export default InputAddon;