@codacy/ui-components 0.66.24 → 0.66.26

package/lib/Input/Input.js

@@ -1,160 +1,132 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard")["default"];
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.Input = void 0;
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectWithoutProperties"));
-var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
-var _react = _interopRequireWildcard(require("react"));
-var _styles = require("./styles");
-var _ = require("../");
-var _Icon = require("../Icon");
-var _Icons = require("../Icons");
-var _jsxRuntime = require("react/jsx-runtime");
-var _excluded = ["id", "disabled", "required", "name", "maxLength", "type", "size", "value", "label", "aria-label", "placeholder", "readOnly", "showClearButton", "help", "hasError", "hasSuccess", "isLoading", "errorMessage", "onChange", "onClick", "onClear", "onFocus", "onBlur", "leftIcon", "rightIcon", "moreInfo", "min", "max", "step"];
-var InputIcon = function InputIcon(_ref) {
-  var icon = _ref.icon,
-    _ref$toRight = _ref.toRight,
-    toRight = _ref$toRight === void 0 ? false : _ref$toRight,
-    onClick = _ref.onClick;
-  var IconComponent = toRight ? _styles.RightIcon : _styles.LeftIcon;
-  return icon.hasOwnProperty('icon') ? /*#__PURE__*/(0, _jsxRuntime.jsx)(IconComponent, {
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+import React, { useCallback } from 'react';
+import { InputElement, InputHelp, InputErrorMessage, InputContainer, InputWrapper, LeftIcon, RightIcon, RightIcons } from './styles';
+import { MoreInfo, Labeled } from '../';
+import { Icon } from '../Icon';
+import { SpinnerIcon, CloseIcon } from '../Icons';
+const InputIcon = ({
+  icon,
+  toRight = false,
+  onClick
+}) => {
+  const IconComponent = toRight ? RightIcon : LeftIcon;
+  return icon.hasOwnProperty('icon') ? /*#__PURE__*/React.createElement(IconComponent, {
     isClickable: !!onClick,
-    onClick: onClick,
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.Icon, (0, _objectSpread2["default"])({}, icon))
-  }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(IconComponent, {
+    onClick: onClick
+  }, /*#__PURE__*/React.createElement(Icon, icon)) : /*#__PURE__*/React.createElement(IconComponent, {
     isClickable: !!onClick,
-    onClick: onClick,
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.Icon, {
-      icon: icon,
-      color: "input-icon-enabled"
-    })
-  });
+    onClick: onClick
+  }, /*#__PURE__*/React.createElement(Icon, {
+    icon: icon,
+    color: "input-icon-enabled"
+  }));
 };
 
 /**
  * Basic Input
  */
-var Input = exports.Input = /*#__PURE__*/_react["default"].forwardRef(function (_ref2, ref) {
-  var id = _ref2.id,
-    disabled = _ref2.disabled,
-    required = _ref2.required,
-    name = _ref2.name,
-    maxLength = _ref2.maxLength,
-    type = _ref2.type,
-    size = _ref2.size,
-    value = _ref2.value,
-    label = _ref2.label,
-    ariaLabel = _ref2['aria-label'],
-    placeholder = _ref2.placeholder,
-    _ref2$readOnly = _ref2.readOnly,
-    readOnly = _ref2$readOnly === void 0 ? false : _ref2$readOnly,
-    _ref2$showClearButton = _ref2.showClearButton,
-    showClearButton = _ref2$showClearButton === void 0 ? false : _ref2$showClearButton,
-    help = _ref2.help,
-    hasError = _ref2.hasError,
-    hasSuccess = _ref2.hasSuccess,
-    isLoading = _ref2.isLoading,
-    errorMessage = _ref2.errorMessage,
-    onChange = _ref2.onChange,
-    onClick = _ref2.onClick,
-    onClear = _ref2.onClear,
-    onFocus = _ref2.onFocus,
-    onBlur = _ref2.onBlur,
-    leftIcon = _ref2.leftIcon,
-    rightIcon = _ref2.rightIcon,
-    moreInfo = _ref2.moreInfo,
-    min = _ref2.min,
-    max = _ref2.max,
-    step = _ref2.step,
-    props = (0, _objectWithoutProperties2["default"])(_ref2, _excluded);
-  var handleFocus = (0, _react.useCallback)(function (event) {
-    onFocus === null || onFocus === void 0 ? void 0 : onFocus(event);
+const Input = /*#__PURE__*/React.forwardRef(({
+  id,
+  disabled,
+  required,
+  name,
+  maxLength,
+  type,
+  size,
+  value,
+  label,
+  'aria-label': ariaLabel,
+  placeholder,
+  readOnly = false,
+  showClearButton = false,
+  help,
+  hasError,
+  hasSuccess,
+  isLoading,
+  errorMessage,
+  onChange,
+  onClick,
+  onClear,
+  onFocus,
+  onBlur,
+  leftIcon,
+  rightIcon,
+  moreInfo,
+  min,
+  max,
+  step,
+  ...props
+}, ref) => {
+  const handleFocus = useCallback(event => {
+    onFocus === null || onFocus === void 0 || onFocus(event);
   }, [onFocus]);
-  var handleBlur = (0, _react.useCallback)(function (event) {
-    onBlur === null || onBlur === void 0 ? void 0 : onBlur(event);
+  const handleBlur = useCallback(event => {
+    onBlur === null || onBlur === void 0 || onBlur(event);
   }, [onBlur]);
-  var content = /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.InputContainer, {
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.InputElement, {
-        id: id,
-        ref: ref,
-        name: name,
-        value: value === null || value === undefined ? '' : value,
-        type: type || 'text',
-        maxLength: maxLength,
-        disabled: disabled,
-        readOnly: readOnly || !onChange,
-        placeholder: placeholder,
-        required: required,
-        "aria-label": ariaLabel || label || undefined,
-        "aria-describedby": id && "help-".concat(id),
-        "aria-errormessage": id && "error-".concat(id),
-        hasError: hasError,
-        hasLeftIcon: !!leftIcon,
-        hasRightIcon: !!rightIcon,
-        hasClearButton: showClearButton,
-        onChange: !disabled ? onChange : undefined,
-        onClick: !disabled ? onClick : undefined,
-        onFocus: handleFocus,
-        onBlur: handleBlur,
-        min: min,
-        max: max,
-        step: step
-      }), !!leftIcon && /*#__PURE__*/(0, _jsxRuntime.jsx)(InputIcon, {
-        icon: leftIcon
-      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.RightIcons, {
-        children: [isLoading && /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.RightIcon, {
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.Icon, {
-            icon: _Icons.SpinnerIcon,
-            spin: true,
-            color: "input-icon-enabled",
-            title: "spinner-icon"
-          })
-        }), showClearButton && !!value && /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.RightIcon, {
-          isClickable: true,
-          onClick: onClear,
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.Icon, {
-            icon: _Icons.CloseIcon,
-            color: "input-icon-enabled",
-            title: "close-icon"
-          })
-        }), !!rightIcon && /*#__PURE__*/(0, _jsxRuntime.jsx)(InputIcon, {
-          icon: rightIcon,
-          toRight: true,
-          onClick: !disabled ? onClick : undefined
-        })]
-      }), !label && moreInfo && /*#__PURE__*/(0, _jsxRuntime.jsx)(_.MoreInfo, {
-        ml: 2,
-        helpContent: moreInfo,
-        textAlignment: "center"
-      })]
-    }), help && !hasError && /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.InputHelp, {
-      id: "help-".concat(id),
-      disabled: disabled,
-      children: help
-    }), hasError && /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.InputErrorMessage, {
-      id: "error-".concat(id),
-      children: errorMessage
-    })]
-  });
+  const content = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(InputContainer, null, /*#__PURE__*/React.createElement(InputElement, {
+    id: id,
+    ref: ref,
+    name: name,
+    value: value === null || value === undefined ? '' : value,
+    type: type || 'text',
+    maxLength: maxLength,
+    disabled: disabled,
+    readOnly: readOnly || !onChange,
+    placeholder: placeholder,
+    required: required,
+    "aria-label": ariaLabel || label || undefined,
+    "aria-describedby": id && `help-${id}`,
+    "aria-errormessage": id && `error-${id}`,
+    hasError: hasError,
+    hasLeftIcon: !!leftIcon,
+    hasRightIcon: !!rightIcon,
+    hasClearButton: showClearButton,
+    onChange: !disabled ? onChange : undefined,
+    onClick: !disabled ? onClick : undefined,
+    onFocus: handleFocus,
+    onBlur: handleBlur,
+    min: min,
+    max: max,
+    step: step
+  }), !!leftIcon && /*#__PURE__*/React.createElement(InputIcon, {
+    icon: leftIcon
+  }), /*#__PURE__*/React.createElement(RightIcons, null, isLoading && /*#__PURE__*/React.createElement(RightIcon, null, /*#__PURE__*/React.createElement(Icon, {
+    icon: SpinnerIcon,
+    spin: true,
+    color: "input-icon-enabled",
+    title: "spinner-icon"
+  })), showClearButton && !!value && /*#__PURE__*/React.createElement(RightIcon, {
+    isClickable: true,
+    onClick: onClear
+  }, /*#__PURE__*/React.createElement(Icon, {
+    icon: CloseIcon,
+    color: "input-icon-enabled",
+    title: "close-icon"
+  })), !!rightIcon && /*#__PURE__*/React.createElement(InputIcon, {
+    icon: rightIcon,
+    toRight: true,
+    onClick: !disabled ? onClick : undefined
+  })), !label && moreInfo && /*#__PURE__*/React.createElement(MoreInfo, {
+    ml: 2,
+    helpContent: moreInfo,
+    textAlignment: "center"
+  })), help && !hasError && /*#__PURE__*/React.createElement(InputHelp, {
+    id: `help-${id}`,
+    disabled: disabled
+  }, help), hasError && /*#__PURE__*/React.createElement(InputErrorMessage, {
+    id: `error-${id}`
+  }, errorMessage));
   if (!!label) {
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Labeled, (0, _objectSpread2["default"])((0, _objectSpread2["default"])({
+    return /*#__PURE__*/React.createElement(Labeled, _extends({
       forId: id,
       moreInfo: moreInfo,
       label: label,
       required: required,
       size: size
-    }, props), {}, {
-      children: content
-    }));
+    }, props), content);
   }
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.InputWrapper, (0, _objectSpread2["default"])((0, _objectSpread2["default"])({
+  return /*#__PURE__*/React.createElement(InputWrapper, _extends({
     size: size
-  }, props), {}, {
-    children: content
-  }));
-});
+  }, props), content);
+});
+export { Input };