@smart-react-components/ui
Version:
SRC UI includes React and Styled components.
75 lines (74 loc) • 6.27 kB
JavaScript
"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
const Div_1 = __importDefault(require("@smart-react-components/core/Element/Div"));
const element_props_1 = __importDefault(require("@smart-react-components/core/element-props"));
const change_events_1 = __importDefault(require("@smart-react-components/core/element-props/change-events"));
const focus_events_1 = __importDefault(require("@smart-react-components/core/element-props/focus-events"));
const intrinsic_styled_flex_props_1 = __importDefault(require("@smart-react-components/core/element-props/intrinsic-styled-flex-props"));
const intrinsic_styled_margin_props_1 = __importDefault(require("@smart-react-components/core/element-props/intrinsic-styled-margin-props"));
const intrinsic_styled_size_props_1 = __importDefault(require("@smart-react-components/core/element-props/intrinsic-styled-size-props"));
const keyboard_events_1 = __importDefault(require("@smart-react-components/core/element-props/keyboard-events"));
const react_1 = __importDefault(require("react"));
const FormBlockLabel_1 = __importDefault(require("../components/Form/FormBlockLabel"));
const InputElement_1 = __importDefault(require("../components/Input/InputElement"));
const InputWrapper_1 = __importDefault(require("../components/Input/InputWrapper"));
const useAddons_1 = __importDefault(require("../hooks/useAddons"));
const useInputMethods_1 = __importDefault(require("../hooks/useInputMethods"));
const types_1 = require("../types");
const InputAddon_1 = __importDefault(require("./InputAddon"));
const Input = react_1.default.forwardRef((props, forwardRef) => {
var _a, _b, _c, _d, _e, _f;
const { handleOnBlur, handleOnChange, handleOnFocus, isFocused } = (0, useInputMethods_1.default)({
isDisabled: props.isDisabled,
isReadOnly: props.isReadOnly,
onBlur: props.onBlur,
onChange: props.onChange,
onFocus: props.onFocus,
setValue: props.setValue,
});
const { leftAddon, rightAddon } = (0, useAddons_1.default)({
Component: InputAddon_1.default,
leftAddon: props.leftAddon,
rightAddon: props.rightAddon,
props: {
cursorKey: 'input',
hasBorder: props.hasBorder,
isDisabled: props.isDisabled,
isFocused,
isOutline: props.isOutline,
isSoft: props.isSoft,
palette: props.palette,
shape: props.shape,
size: props.size,
sizeSm: props.sizeSm,
sizeMd: props.sizeMd,
sizeLg: props.sizeLg,
sizeXl: props.sizeXl,
},
});
return (react_1.default.createElement(FormBlockLabel_1.default, Object.assign({}, (0, element_props_1.default)(props, [intrinsic_styled_flex_props_1.default, intrinsic_styled_margin_props_1.default]), props.containerProps, { cursorKey: "input", formSize: props.size, formSizeSm: props.sizeSm, formSizeMd: props.sizeMd, formSizeLg: props.sizeLg, formSizeXl: props.sizeXl, isBlock: props.isBlock, isDisabled: props.isDisabled, palette: props.palette }),
props.label && react_1.default.createElement("span", null, props.label),
react_1.default.createElement(Div_1.default, { display: "flex", flex: "1 1 auto" },
((_a = leftAddon === null || leftAddon === void 0 ? void 0 : leftAddon.props) === null || _a === void 0 ? void 0 : _a.isSeparated) && leftAddon,
react_1.default.createElement(InputWrapper_1.default, { hasBorder: props.hasBorder, hasSeparatedLeftAddon: (_b = leftAddon === null || leftAddon === void 0 ? void 0 : leftAddon.props) === null || _b === void 0 ? void 0 : _b.isSeparated, hasSeparatedRightAddon: (_c = rightAddon === null || rightAddon === void 0 ? void 0 : rightAddon.props) === null || _c === void 0 ? void 0 : _c.isSeparated, isDisabled: props.isDisabled, isFocused: isFocused, isOutline: props.isOutline, isSoft: props.isSoft, palette: props.palette, shape: props.shape },
(leftAddon && !((_d = leftAddon === null || leftAddon === void 0 ? void 0 : leftAddon.props) === null || _d === void 0 ? void 0 : _d.isSeparated)) && leftAddon,
react_1.default.cloneElement(props.template, Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, (0, element_props_1.default)(props, [change_events_1.default, focus_events_1.default, keyboard_events_1.default, intrinsic_styled_size_props_1.default])), (typeof props.defaultValue !== 'undefined' && { defaultValue: props.defaultValue })), (typeof props.hasSpellCheck !== 'undefined' && { spellCheck: props.hasSpellCheck })), (props.isDisabled && { disabled: true })), (props.isReadOnly && { readOnly: true })), (props.isRequired && { required: true })), (typeof props.placeholder !== 'undefined' && { placeholder: props.placeholder })), (typeof props.value !== 'undefined' && { value: props.value })), props.inputProps), { hasBorder: props.hasBorder, hasLeftAddon: !!leftAddon, hasRightAddon: !!rightAddon, inputSize: props.size, inputSizeSm: props.sizeSm, inputSizeMd: props.sizeMd, inputSizeLg: props.sizeLg, inputSizeXl: props.sizeXl, isDisabled: props.isDisabled, isFocused, isOutline: props.isOutline, isSoft: props.isSoft, onBlur: handleOnBlur, onChange: handleOnChange, onFocus: handleOnFocus, palette: props.palette, ref: forwardRef, shape: props.shape, type: props.type })),
(rightAddon && !((_e = rightAddon === null || rightAddon === void 0 ? void 0 : rightAddon.props) === null || _e === void 0 ? void 0 : _e.isSeparated)) && rightAddon),
((_f = rightAddon === null || rightAddon === void 0 ? void 0 : rightAddon.props) === null || _f === void 0 ? void 0 : _f.isSeparated) && rightAddon)));
});
Input.defaultProps = {
containerProps: {},
hasBorder: true,
inputProps: {},
isBlock: true,
isOutline: true,
palette: 'primary',
shape: 'rectangle',
size: 'medium',
template: react_1.default.createElement(InputElement_1.default, null),
type: types_1.InputType.TEXT,
};
exports.default = Input;