@invoicebox/ui 0.1.0-alpha.169 → 0.1.0-alpha.170

package/dist/components/form/Autocomplete/components/Autocomplete/index.d.ts

@@ -1,4 +1,5 @@
 import React, { InputHTMLAttributes, ReactNode } from 'react';
+import { TSizes } from '../../../constants';
 type TOption = {
     value: string;
     entity?: any;
@@ -21,6 +22,7 @@ type TControlProps = {
     hasError?: boolean;
     isLoading?: boolean;
     optionsLoader?: ReactNode;
+    size?: TSizes;
 };
 export type TProps = TFieldProps & TControlProps;
 export declare const Autocomplete: React.ForwardRefExoticComponent<Pick<React.InputHTMLAttributes<HTMLInputElement>, "name" | "onFocus" | "onBlur"> & {

package/dist/components/form/Autocomplete/components/Autocomplete/index.js

@@ -16,8 +16,10 @@ var _InputLabel = require("../../../InputLabel");
 var _PureInput = require("../../../PureInput");
 var _Dropdown = require("../../../../common/Dropdown");
 var _Scrollbar = require("../../../../common/Scrollbar");
+var _constants = require("../../../constants");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
 function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
@@ -49,7 +51,9 @@ var Autocomplete = exports.Autocomplete = /*#__PURE__*/(0, _react.forwardRef)(fu
     optionsLoader = _ref.optionsLoader,
     inputMaxLength = _ref.inputMaxLength,
     _ref$isInputOnlyNumbe = _ref.isInputOnlyNumbers,
-    isInputOnlyNumbers = _ref$isInputOnlyNumbe === void 0 ? false : _ref$isInputOnlyNumbe;
+    isInputOnlyNumbers = _ref$isInputOnlyNumbe === void 0 ? false : _ref$isInputOnlyNumbe,
+    _ref$size = _ref.size,
+    size = _ref$size === void 0 ? 'L' : _ref$size;
   var isMobile = (0, _useMedia.useMobile)();
   var _useState = (0, _react.useState)(false),
     _useState2 = _slicedToArray(_useState, 2),
@@ -88,7 +92,7 @@ var Autocomplete = exports.Autocomplete = /*#__PURE__*/(0, _react.forwardRef)(fu
     inFocus: inFocus,
     label: label,
     disabled: disabled
-  }, /*#__PURE__*/_react["default"].createElement(S.InputLabelContent, null, children ? /*#__PURE__*/_react["default"].createElement(S.ChildrenWrapper, null, children) : null, /*#__PURE__*/_react["default"].createElement(_PureInput.PureInput, {
+  }, /*#__PURE__*/_react["default"].createElement(S.InputLabelContent, null, children ? /*#__PURE__*/_react["default"].createElement(S.ChildrenWrapper, null, children) : null, /*#__PURE__*/_react["default"].createElement(_PureInput.PureInput, _extends({
     ref: ref,
     hasError: hasError,
     inFocus: inFocus,
@@ -102,7 +106,7 @@ var Autocomplete = exports.Autocomplete = /*#__PURE__*/(0, _react.forwardRef)(fu
     paddingLeft: inputPaddingLeft,
     maxLength: inputMaxLength,
     isOnlyNumbers: isInputOnlyNumbers
-  }))), /*#__PURE__*/_react["default"].createElement(_Dropdown.Dropdown, {
+  }, _constants.SIZE_PADDING_MAP[size])))), /*#__PURE__*/_react["default"].createElement(_Dropdown.Dropdown, {
     isOpen: isOpen && (!!options.length || !!isLoading),
     isAutoPosition: true,
     width: "100%",

package/dist/components/form/DateInput/index.d.ts

@@ -2,9 +2,12 @@ import { FC } from 'react';
 import { TProps as TInputLabelProps } from '../InputLabel';
 import { TProps as TPureInputProps } from '../PureInput';
 import { TProps as TCalendarProps } from '../../common/Calendar';
+import { TSizes } from '../constants';
 export type TProps = {
     value: Date | null;
     onChange: (value: Date) => void;
     withTime?: boolean;
-} & Pick<TPureInputProps, 'hasError' | 'name' | 'onBlur' | 'onFocus'> & Pick<TInputLabelProps, 'label'> & Pick<TCalendarProps, 'maxDate' | 'minDate'>;
+} & Pick<TPureInputProps, 'hasError' | 'name' | 'onBlur' | 'onFocus'> & Pick<TInputLabelProps, 'label'> & Pick<TCalendarProps, 'maxDate' | 'minDate'> & {
+    size?: TSizes;
+};
 export declare const DateInput: FC<TProps>;

package/dist/components/form/DateInput/index.js

@@ -16,8 +16,10 @@ var _Dropdown = require("../../common/Dropdown");
 var _Calendar = require("../../common/Calendar");
 var _Icon = require("./components/Icon");
 var _palette = require("../../../palette");
+var _constants = require("../constants");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
 function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
@@ -36,7 +38,9 @@ var DateInput = exports.DateInput = function DateInput(_ref) {
     minDate = _ref.minDate,
     maxDate = _ref.maxDate,
     _ref$withTime = _ref.withTime,
-    withTime = _ref$withTime === void 0 ? false : _ref$withTime;
+    withTime = _ref$withTime === void 0 ? false : _ref$withTime,
+    _ref$size = _ref.size,
+    size = _ref$size === void 0 ? 'L' : _ref$size;
   var palette = (0, _palette.useComponentPalette)('dateInput');
   var inputRef = (0, _react.useRef)(null);
   var _useState = (0, _react.useState)(false),
@@ -102,7 +106,7 @@ var DateInput = exports.DateInput = function DateInput(_ref) {
   }, /*#__PURE__*/_react["default"].createElement(_InputLabel.InputLabel, {
     inFocus: inFocus,
     label: label
-  }, /*#__PURE__*/_react["default"].createElement(S.InputWrapper, null, /*#__PURE__*/_react["default"].createElement(_PureInput.PureInput, {
+  }, /*#__PURE__*/_react["default"].createElement(S.InputWrapper, null, /*#__PURE__*/_react["default"].createElement(_PureInput.PureInput, _extends({
     ref: inputRef,
     hasError: hasError,
     inFocus: inFocus,
@@ -113,7 +117,7 @@ var DateInput = exports.DateInput = function DateInput(_ref) {
     value: stringValue,
     onChange: handleStringValueChange,
     paddingRight: 44
-  }), /*#__PURE__*/_react["default"].createElement(S.Icon, {
+  }, _constants.SIZE_PADDING_MAP[size])), /*#__PURE__*/_react["default"].createElement(S.Icon, {
     onClick: handleTrigger,
     $palette: palette
   }, /*#__PURE__*/_react["default"].createElement(_Icon.Icon, null)))), /*#__PURE__*/_react["default"].createElement(_Dropdown.Dropdown, {

package/dist/components/form/PositiveIntegerInput/index.d.ts

@@ -1,10 +1,13 @@
 import { FC } from 'react';
 import { TProps as TInputLabelProps } from '../InputLabel';
 import { TProps as TPureInputProps } from '../PureInput';
+import { TSizes } from '../constants';
 export type TProps = {
     value: number | null;
     onChange: (value: number | null) => void;
     max?: number;
     upAndDown?: boolean;
-} & Pick<TInputLabelProps, 'label'> & Pick<TPureInputProps, 'placeholder' | 'hasError' | 'onFocus' | 'onBlur' | 'disabled' | 'name'>;
+} & Pick<TInputLabelProps, 'label'> & Pick<TPureInputProps, 'placeholder' | 'hasError' | 'onFocus' | 'onBlur' | 'disabled' | 'name'> & {
+    size?: TSizes;
+};
 export declare const PositiveIntegerInput: FC<TProps>;

package/dist/components/form/PositiveIntegerInput/index.js

@@ -15,8 +15,10 @@ var _useFilters = require("./hooks/useFilters");
 var _useNormalizers2 = require("./hooks/useNormalizers");
 var _useIncrement2 = require("./hooks/useIncrement");
 var _useIncrementDisabledFlags = require("./hooks/useIncrementDisabledFlags");
+var _constants = require("../constants");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 var PositiveIntegerInput = exports.PositiveIntegerInput = function PositiveIntegerInput(_ref) {
   var value = _ref.value,
     onChange = _ref.onChange,
@@ -29,7 +31,9 @@ var PositiveIntegerInput = exports.PositiveIntegerInput = function PositiveInteg
     hasError = _ref.hasError,
     onFocus = _ref.onFocus,
     onBlur = _ref.onBlur,
-    name = _ref.name;
+    name = _ref.name,
+    _ref$size = _ref.size,
+    size = _ref$size === void 0 ? 'L' : _ref$size;
   var _useInputFocus = (0, _useInputFocus2.useInputFocus)({
       onFocus: onFocus,
       onBlur: onBlur
@@ -68,7 +72,7 @@ var PositiveIntegerInput = exports.PositiveIntegerInput = function PositiveInteg
   return /*#__PURE__*/_react["default"].createElement(_InputLabel.InputLabel, {
     inFocus: inFocus,
     label: label
-  }, /*#__PURE__*/_react["default"].createElement(S.ControlWrapper, null, /*#__PURE__*/_react["default"].createElement(_PureInput.PureInput, {
+  }, /*#__PURE__*/_react["default"].createElement(S.ControlWrapper, null, /*#__PURE__*/_react["default"].createElement(_PureInput.PureInput, _extends({
     name: name,
     hasError: hasError,
     inFocus: inFocus,
@@ -78,7 +82,7 @@ var PositiveIntegerInput = exports.PositiveIntegerInput = function PositiveInteg
     value: normalizeFrom(value),
     onChange: handleChange,
     paddingRight: upAndDown ? 44 : undefined
-  }), upAndDown && /*#__PURE__*/_react["default"].createElement(S.Arrows, null, /*#__PURE__*/_react["default"].createElement(S.Arrow, {
+  }, _constants.SIZE_PADDING_MAP[size])), upAndDown && /*#__PURE__*/_react["default"].createElement(S.Arrows, null, /*#__PURE__*/_react["default"].createElement(S.Arrow, {
     onClick: handleUp,
     $disabled: isIncrementDisabled
   }, /*#__PURE__*/_react["default"].createElement(_Arrow.Arrow, {

package/dist/components/form/PureInput/index.js

@@ -16,13 +16,13 @@ function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i
 function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (e.includes(n)) continue; t[n] = r[n]; } return t; }
 var PureInput = exports.PureInput = /*#__PURE__*/_react["default"].forwardRef(function (_ref, ref) {
   var _ref$paddingLeft = _ref.paddingLeft,
-    paddingLeft = _ref$paddingLeft === void 0 ? 18 : _ref$paddingLeft,
+    paddingLeft = _ref$paddingLeft === void 0 ? 20 : _ref$paddingLeft,
     _ref$paddingRight = _ref.paddingRight,
-    paddingRight = _ref$paddingRight === void 0 ? 18 : _ref$paddingRight,
+    paddingRight = _ref$paddingRight === void 0 ? 12 : _ref$paddingRight,
     _ref$paddingTop = _ref.paddingTop,
-    paddingTop = _ref$paddingTop === void 0 ? 12 : _ref$paddingTop,
+    paddingTop = _ref$paddingTop === void 0 ? 16 : _ref$paddingTop,
     _ref$paddingBottom = _ref.paddingBottom,
-    paddingBottom = _ref$paddingBottom === void 0 ? 12 : _ref$paddingBottom,
+    paddingBottom = _ref$paddingBottom === void 0 ? 16 : _ref$paddingBottom,
     _ref$hasError = _ref.hasError,
     hasError = _ref$hasError === void 0 ? false : _ref$hasError,
     _ref$inFocus = _ref.inFocus,

package/dist/components/form/SearchInput/index.d.ts

@@ -1,10 +1,13 @@
 import React from 'react';
 import { TProps as PureInputProps } from '../PureInput';
+import { TSizes } from '../constants';
 export type TProps = Pick<PureInputProps, 'placeholder' | 'hasBorder' | 'autoFocus' | 'name' | 'onFocus' | 'onBlur' | 'isOnlyNumbers' | 'maxLength'> & {
     value: string;
     onChange: (value: string) => void;
+    size?: TSizes;
 };
 export declare const SearchInput: React.ForwardRefExoticComponent<Pick<PureInputProps, "name" | "maxLength" | "placeholder" | "autoFocus" | "onFocus" | "onBlur" | "hasBorder" | "isOnlyNumbers"> & {
     value: string;
     onChange: (value: string) => void;
+    size?: TSizes | undefined;
 } & React.RefAttributes<HTMLInputElement>>;

package/dist/components/form/SearchInput/index.js

@@ -13,8 +13,10 @@ var _useInputFocus2 = require("../../../hooks/useInputFocus");
 var _SearchIcon = require("./components/SearchIcon");
 var _palette = require("../../../palette");
 var _ResetButton = require("../ResetButton");
+var _constants = require("../constants");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 var SearchInput = exports.SearchInput = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
   var name = _ref.name,
     onFocus = _ref.onFocus,
@@ -25,7 +27,9 @@ var SearchInput = exports.SearchInput = /*#__PURE__*/(0, _react.forwardRef)(func
     value = _ref.value,
     autoFocus = _ref.autoFocus,
     isOnlyNumbers = _ref.isOnlyNumbers,
-    maxLength = _ref.maxLength;
+    maxLength = _ref.maxLength,
+    _ref$size = _ref.size,
+    size = _ref$size === void 0 ? 'L' : _ref$size;
   var _useInputFocus = (0, _useInputFocus2.useInputFocus)({
       onFocus: onFocus,
       onBlur: onBlur
@@ -40,7 +44,7 @@ var SearchInput = exports.SearchInput = /*#__PURE__*/(0, _react.forwardRef)(func
   var handleInputChange = (0, _react.useCallback)(function (event) {
     onChange(event.target.value);
   }, [onChange]);
-  return /*#__PURE__*/_react["default"].createElement(_InputLabel.InputLabel, null, /*#__PURE__*/_react["default"].createElement(_PureInput.PureInput, {
+  return /*#__PURE__*/_react["default"].createElement(_InputLabel.InputLabel, null, /*#__PURE__*/_react["default"].createElement(_PureInput.PureInput, _extends({
     ref: ref,
     paddingRight: 56,
     hasBorder: hasBorder,
@@ -54,7 +58,7 @@ var SearchInput = exports.SearchInput = /*#__PURE__*/(0, _react.forwardRef)(func
     name: name,
     maxLength: maxLength,
     isOnlyNumbers: isOnlyNumbers
-  }), /*#__PURE__*/_react["default"].createElement(S.IconWrapper, {
+  }, _constants.SIZE_PADDING_MAP[size])), /*#__PURE__*/_react["default"].createElement(S.IconWrapper, {
     $inFocus: inFocus,
     $palette: palette
   }, value ? /*#__PURE__*/_react["default"].createElement(_ResetButton.ResetButton, {

package/dist/components/form/Select/components/Input/index.d.ts

@@ -2,7 +2,9 @@ import { FC } from 'react';
 import { TProps as TInputLabelProps } from '../../../InputLabel';
 import { TProps as TPureInputProps } from '../../../PureInput';
 import { TProps as TArrowProps } from '../../../../common/Arrow';
+import { TSizes } from '../../../constants';
 export type TProps = Pick<TInputLabelProps, 'inFocus' | 'label'> & Pick<TPureInputProps, 'hasError' | 'placeholder' | 'name' | 'onFocus' | 'onBlur' | 'value'> & Pick<TArrowProps, 'isOpen'> & {
     onReset?: () => void;
+    size?: TSizes;
 };
 export declare const Input: FC<TProps>;

package/dist/components/form/Select/components/Input/index.js

@@ -11,9 +11,11 @@ var _InputLabel = require("../../../InputLabel");
 var _PureInput = require("../../../PureInput");
 var _Arrow = require("../../../../common/Arrow");
 var _ResetButton = require("../../../ResetButton");
+var _constants = require("../../../constants");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 var Input = exports.Input = function Input(_ref) {
   var hasError = _ref.hasError,
     inFocus = _ref.inFocus,
@@ -24,12 +26,14 @@ var Input = exports.Input = function Input(_ref) {
     name = _ref.name,
     label = _ref.label,
     isOpen = _ref.isOpen,
-    onReset = _ref.onReset;
+    onReset = _ref.onReset,
+    _ref$size = _ref.size,
+    size = _ref$size === void 0 ? 'L' : _ref$size;
   var isShowResetIcon = !!value && !!onReset;
   return /*#__PURE__*/_react["default"].createElement(_InputLabel.InputLabel, {
     inFocus: inFocus,
     label: label
-  }, /*#__PURE__*/_react["default"].createElement(S.ControlWrapper, null, /*#__PURE__*/_react["default"].createElement(_PureInput.PureInput, {
+  }, /*#__PURE__*/_react["default"].createElement(S.ControlWrapper, null, /*#__PURE__*/_react["default"].createElement(_PureInput.PureInput, _extends({
     hasError: hasError,
     inFocus: inFocus,
     name: name,
@@ -39,7 +43,7 @@ var Input = exports.Input = function Input(_ref) {
     value: value,
     readOnly: true,
     paddingRight: 52
-  }), /*#__PURE__*/_react["default"].createElement(S.IconWrapper, {
+  }, _constants.SIZE_PADDING_MAP[size])), /*#__PURE__*/_react["default"].createElement(S.IconWrapper, {
     $pointerEvents: isShowResetIcon ? 'default' : 'none'
   }, isShowResetIcon ? /*#__PURE__*/_react["default"].createElement(_ResetButton.ResetButton, {
     onClick: onReset

package/dist/components/form/constants.d.ts

@@ -1,4 +1,4 @@
-export type TSizes = 'M' | 'L';
+export type TSizes = 'M' | 'L' | 'XS';
 export declare const SIZE_PADDING_MAP: Record<TSizes, {
     paddingTop: number;
     paddingBottom: number;

package/dist/components/form/constants.js

@@ -6,11 +6,15 @@ Object.defineProperty(exports, "__esModule", {
 exports.SIZE_PADDING_MAP = void 0;
 var SIZE_PADDING_MAP = exports.SIZE_PADDING_MAP = {
   L: {
-    paddingTop: 12,
-    paddingBottom: 12
+    paddingTop: 16,
+    paddingBottom: 16
   },
   M: {
-    paddingTop: 8,
-    paddingBottom: 8
+    paddingTop: 13,
+    paddingBottom: 13
+  },
+  XS: {
+    paddingTop: 10,
+    paddingBottom: 10
   }
 };

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@invoicebox/ui",
-    "version": "0.1.0-alpha.169",
+    "version": "0.1.0-alpha.170",
     "description": "Invoicebox UI",
     "license": "Apache License 2.0",
     "scripts": {