leo-design-ui/dist/components/Input/input.js

React Design Library

var __assign = (this && this.__assign) || function () {
    __assign = Object.assign || function(t) {
        for (var s, i = 1, n = arguments.length; i < n; i++) {
            s = arguments[i];
            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
                t[p] = s[p];
        }
        return t;
    };
    return __assign.apply(this, arguments);
};
var __rest = (this && this.__rest) || function (s, e) {
    var t = {};
    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
        t[p] = s[p];
    if (s != null && typeof Object.getOwnPropertySymbols === "function")
        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
                t[p[i]] = s[p[i]];
        }
    return t;
};
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import classNames from "classnames";
import { useRef } from "react";
import Icon from "../Icon/icon";
var Input = function (_a) {
    var _b;
    var disabled = _a.disabled, size = _a.size, style = _a.style, icon = _a.icon, append = _a.append, prepend = _a.prepend, allowClear = _a.allowClear, onClear = _a.onClear, restProps = __rest(_a, ["disabled", "size", "style", "icon", "append", "prepend", "allowClear", "onClear"]);
    var classes = classNames('leo-input-wrapper', (_b = {},
        _b["input-size-".concat(size)] = size,
        _b['is-disabled'] = disabled,
        _b['input-group'] = prepend || append,
        _b['input-group-append'] = !!append,
        _b['input-group-prepend'] = !!prepend,
        _b));
    var fixControlledValue = function (value) {
        if (typeof value === 'undefined' || value === null) {
            return '';
        }
        return value;
    };
    if ('value' in restProps) {
        delete restProps.defaultValue;
        restProps.value = fixControlledValue(restProps.value);
    }
    var ref = useRef(null);
    var handClear = function (e) {
        var _a;
        onClear && onClear();
        e.target.value = '';
        (_a = ref.current) === null || _a === void 0 ? void 0 : _a.focus();
        restProps.onChange && (restProps === null || restProps === void 0 ? void 0 : restProps.onChange(e));
    };
    return (_jsxs("div", { className: classes, style: style, children: [icon && _jsx("div", { className: "icon-wrapper", children: _jsx(Icon, { icon: icon }) }), allowClear && restProps.value && !icon && _jsx("div", { className: "icon-wrapper", style: { cursor: 'pointer' }, onClick: handClear, children: _jsx(Icon, { icon: "circle-xmark" }) }), prepend && _jsx("div", { className: "leo-input-group-prepend", children: prepend }), _jsx("input", __assign({ ref: ref, className: "leo-input-inner", disabled: disabled }, restProps)), append && _jsx("div", { className: "leo-input-group-append", children: append })] }));
};
export default Input;