@invoicebox/ui 0.1.0-alpha.125 → 0.1.0-alpha.127
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/form/PhoneInput/index.d.ts +1 -1
- package/dist/components/form/PhoneInput/index.js +2 -2
- package/dist/components/form/PhoneInput/index.stories.js +1 -5
- package/dist/components/form/TextInput/index.d.ts +3 -0
- package/dist/components/form/TextInput/index.js +16 -3
- package/dist/components/form/TextInput/index.stories.js +2 -1
- package/package.json +1 -1
|
@@ -9,7 +9,7 @@ type TFieldProps = Pick<TPureInputProps, 'name' | 'onBlur' | 'onFocus'> & {
|
|
|
9
9
|
};
|
|
10
10
|
type TControlProps = Pick<TPureInputProps, 'disabled' | 'id'> & {
|
|
11
11
|
label: string;
|
|
12
|
-
countrySelectProps
|
|
12
|
+
countrySelectProps?: Pick<TCountrySelectProps, 'selectedLabel' | 'placeholder'>;
|
|
13
13
|
onCountryChange?: (countryCode: string) => void;
|
|
14
14
|
countries?: Array<{
|
|
15
15
|
label: string;
|
|
@@ -151,12 +151,12 @@ var PhoneInput = exports.PhoneInput = function PhoneInput(_ref) {
|
|
|
151
151
|
options: countrySelectOptions,
|
|
152
152
|
onChange: handleCountryChange,
|
|
153
153
|
value: country,
|
|
154
|
-
placeholder: countrySelectProps.placeholder,
|
|
154
|
+
placeholder: (countrySelectProps === null || countrySelectProps === void 0 ? void 0 : countrySelectProps.placeholder) || '',
|
|
155
155
|
positionVertical: 16,
|
|
156
156
|
positionRight: "0",
|
|
157
157
|
positionLeft: "-20px",
|
|
158
158
|
disabled: disabled,
|
|
159
|
-
selectedLabel: countrySelectProps.selectedLabel
|
|
159
|
+
selectedLabel: (countrySelectProps === null || countrySelectProps === void 0 ? void 0 : countrySelectProps.selectedLabel) || ''
|
|
160
160
|
}))), /*#__PURE__*/_react["default"].createElement(_reactInputMask["default"], {
|
|
161
161
|
value: inputValue,
|
|
162
162
|
onFocus: focusHandler,
|
|
@@ -54,11 +54,7 @@ var Component = function Component(props) {
|
|
|
54
54
|
};
|
|
55
55
|
var commonProps = {
|
|
56
56
|
disabled: false,
|
|
57
|
-
label: 'Телефон'
|
|
58
|
-
countrySelectProps: {
|
|
59
|
-
placeholder: 'Поиск',
|
|
60
|
-
selectedLabel: '(выбрано)'
|
|
61
|
-
}
|
|
57
|
+
label: 'Телефон'
|
|
62
58
|
};
|
|
63
59
|
var MultiCountry = exports.MultiCountry = {
|
|
64
60
|
args: _objectSpread(_objectSpread({}, commonProps), {}, {
|
|
@@ -1,10 +1,13 @@
|
|
|
1
1
|
import { FC, ReactNode } from 'react';
|
|
2
2
|
import { TProps as TInputLabelProps } from '../InputLabel';
|
|
3
3
|
import { TProps as TPureInputProps } from '../PureInput';
|
|
4
|
+
type TSizes = 'M' | 'L';
|
|
4
5
|
export type TProps = Pick<TInputLabelProps, 'label'> & Pick<TPureInputProps, 'placeholder' | 'hasError' | 'onFocus' | 'onBlur' | 'disabled' | 'name' | 'paddingRight' | 'type'> & {
|
|
5
6
|
value: string;
|
|
6
7
|
onChange: (value: string) => void;
|
|
7
8
|
maxLength?: number;
|
|
9
|
+
size?: TSizes;
|
|
8
10
|
children?: ReactNode;
|
|
9
11
|
};
|
|
10
12
|
export declare const TextInput: FC<TProps>;
|
|
13
|
+
export {};
|
|
@@ -12,6 +12,17 @@ var _PureInput = require("../PureInput");
|
|
|
12
12
|
var _useInputFocus2 = require("../../../hooks/useInputFocus");
|
|
13
13
|
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); }
|
|
14
14
|
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; }
|
|
15
|
+
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); }
|
|
16
|
+
var SIZE_PADDING_MAP = {
|
|
17
|
+
L: {
|
|
18
|
+
paddingTop: 12,
|
|
19
|
+
paddingBottom: 12
|
|
20
|
+
},
|
|
21
|
+
M: {
|
|
22
|
+
paddingTop: 8,
|
|
23
|
+
paddingBottom: 8
|
|
24
|
+
}
|
|
25
|
+
};
|
|
15
26
|
var TextInput = exports.TextInput = function TextInput(_ref) {
|
|
16
27
|
var _ref$hasError = _ref.hasError,
|
|
17
28
|
hasError = _ref$hasError === void 0 ? false : _ref$hasError,
|
|
@@ -26,7 +37,9 @@ var TextInput = exports.TextInput = function TextInput(_ref) {
|
|
|
26
37
|
placeholder = _ref.placeholder,
|
|
27
38
|
paddingRight = _ref.paddingRight,
|
|
28
39
|
type = _ref.type,
|
|
29
|
-
children = _ref.children
|
|
40
|
+
children = _ref.children,
|
|
41
|
+
_ref$size = _ref.size,
|
|
42
|
+
size = _ref$size === void 0 ? 'L' : _ref$size;
|
|
30
43
|
var _useInputFocus = (0, _useInputFocus2.useInputFocus)({
|
|
31
44
|
onFocus: onFocus,
|
|
32
45
|
onBlur: onBlur
|
|
@@ -41,7 +54,7 @@ var TextInput = exports.TextInput = function TextInput(_ref) {
|
|
|
41
54
|
inFocus: inFocus,
|
|
42
55
|
label: label,
|
|
43
56
|
disabled: disabled
|
|
44
|
-
}, /*#__PURE__*/_react["default"].createElement(S.InputLabelContent, null, /*#__PURE__*/_react["default"].createElement(_PureInput.PureInput, {
|
|
57
|
+
}, /*#__PURE__*/_react["default"].createElement(S.InputLabelContent, null, /*#__PURE__*/_react["default"].createElement(_PureInput.PureInput, _extends({
|
|
45
58
|
name: name,
|
|
46
59
|
disabled: disabled,
|
|
47
60
|
hasError: hasError,
|
|
@@ -53,5 +66,5 @@ var TextInput = exports.TextInput = function TextInput(_ref) {
|
|
|
53
66
|
placeholder: placeholder,
|
|
54
67
|
paddingRight: paddingRight,
|
|
55
68
|
type: type
|
|
56
|
-
}), children && /*#__PURE__*/_react["default"].createElement(S.ChildrenWrapper, null, children)));
|
|
69
|
+
}, SIZE_PADDING_MAP[size])), children && /*#__PURE__*/_react["default"].createElement(S.ChildrenWrapper, null, children)));
|
|
57
70
|
};
|
|
@@ -43,7 +43,8 @@ var Default = exports.Default = {
|
|
|
43
43
|
maxLength: 30,
|
|
44
44
|
placeholder: 'Placeholder',
|
|
45
45
|
disabled: false,
|
|
46
|
-
children: /*#__PURE__*/_react["default"].createElement("div", null, "Children")
|
|
46
|
+
children: /*#__PURE__*/_react["default"].createElement("div", null, "Children"),
|
|
47
|
+
size: 'L'
|
|
47
48
|
},
|
|
48
49
|
render: Component
|
|
49
50
|
};
|