@panneau/field-text 1.0.0-alpha.21 → 1.0.0-alpha.224
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/assets/css/styles.css +1 -0
- package/es/index.js +121 -45
- package/lib/index.js +152 -72
- package/package.json +9 -9
package/assets/css/styles.css
CHANGED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.panneau-field-text-inputElement[type=search]::-webkit-search-cancel-button,.panneau-field-text-inputElement[type=search]::-webkit-search-decoration,.panneau-field-text-inputElement[type=search]::-webkit-search-results-button,.panneau-field-text-inputElement[type=search]::-webkit-search-results-decoration{-webkit-appearance:none;appearance:none}
|
package/es/index.js
CHANGED
|
@@ -1,29 +1,51 @@
|
|
|
1
|
-
import _defineProperty from '@babel/runtime/helpers/defineProperty';
|
|
2
|
-
import _objectSpread from '@babel/runtime/helpers/objectSpread2';
|
|
3
|
-
import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
|
|
4
1
|
import React, { useMemo } from 'react';
|
|
5
|
-
import
|
|
6
|
-
import
|
|
7
|
-
import classNames from 'classnames';
|
|
2
|
+
import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
|
|
3
|
+
import _defineProperty from '@babel/runtime/helpers/defineProperty';
|
|
8
4
|
import InputGroup from '@panneau/field-input-group';
|
|
5
|
+
import classNames from 'classnames';
|
|
6
|
+
import isEmpty from 'lodash/isEmpty';
|
|
7
|
+
import PropTypes from 'prop-types';
|
|
9
8
|
import { v1 } from 'uuid';
|
|
10
9
|
|
|
11
|
-
var
|
|
10
|
+
var definition = [{
|
|
11
|
+
id: 'text',
|
|
12
|
+
component: 'text'
|
|
13
|
+
}, {
|
|
14
|
+
id: 'email',
|
|
15
|
+
component: 'email'
|
|
16
|
+
}, {
|
|
17
|
+
id: 'password',
|
|
18
|
+
component: 'password'
|
|
19
|
+
}, {
|
|
20
|
+
id: 'telephone',
|
|
21
|
+
component: 'telephone'
|
|
22
|
+
}, {
|
|
23
|
+
id: 'textarea',
|
|
24
|
+
component: 'textarea'
|
|
25
|
+
}];
|
|
26
|
+
|
|
27
|
+
var styles = {"inputElement":"panneau-field-text-inputElement"};
|
|
12
28
|
|
|
13
|
-
var
|
|
29
|
+
var _excluded = ["horizontal"];
|
|
30
|
+
var propTypes$5 = {
|
|
14
31
|
feedback: PropTypes.oneOf(['valid', 'invalid', 'loading']),
|
|
15
32
|
value: PropTypes.string,
|
|
16
33
|
errors: PropTypes.oneOfType([PropTypes.string, PropTypes.arrayOf(PropTypes.string)]),
|
|
17
34
|
required: PropTypes.bool,
|
|
35
|
+
disabled: PropTypes.bool,
|
|
18
36
|
nativeOnChange: PropTypes.bool,
|
|
19
|
-
type: PropTypes.oneOf(['text', 'email', 'tel', 'password', 'textarea']),
|
|
37
|
+
type: PropTypes.oneOf(['text', 'email', 'tel', 'password', 'textarea', 'number']),
|
|
20
38
|
placeholder: PropTypes.string,
|
|
21
39
|
onChange: PropTypes.func,
|
|
22
40
|
onFocus: PropTypes.func,
|
|
23
41
|
onBlur: PropTypes.func,
|
|
24
42
|
align: PropTypes.oneOf(['left', 'center', 'right']),
|
|
43
|
+
size: PropTypes.oneOf([null, 'lg', 'sm']),
|
|
44
|
+
maxLength: PropTypes.number,
|
|
25
45
|
prepend: PropTypes.node,
|
|
26
46
|
append: PropTypes.node,
|
|
47
|
+
min: PropTypes.number,
|
|
48
|
+
max: PropTypes.number,
|
|
27
49
|
dataList: PropTypes.arrayOf(PropTypes.string),
|
|
28
50
|
inputRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({
|
|
29
51
|
current: PropTypes.any // eslint-disable-line
|
|
@@ -31,11 +53,12 @@ var propTypes = {
|
|
|
31
53
|
})]),
|
|
32
54
|
className: PropTypes.string
|
|
33
55
|
};
|
|
34
|
-
var defaultProps = {
|
|
56
|
+
var defaultProps$5 = {
|
|
35
57
|
feedback: null,
|
|
36
58
|
value: null,
|
|
37
59
|
errors: null,
|
|
38
60
|
required: false,
|
|
61
|
+
disabled: false,
|
|
39
62
|
nativeOnChange: false,
|
|
40
63
|
type: null,
|
|
41
64
|
placeholder: null,
|
|
@@ -43,20 +66,25 @@ var defaultProps = {
|
|
|
43
66
|
onFocus: null,
|
|
44
67
|
onBlur: null,
|
|
45
68
|
align: null,
|
|
69
|
+
size: null,
|
|
70
|
+
maxLength: null,
|
|
46
71
|
prepend: null,
|
|
47
72
|
append: null,
|
|
73
|
+
min: null,
|
|
74
|
+
max: null,
|
|
48
75
|
dataList: null,
|
|
49
76
|
inputRef: null,
|
|
50
77
|
className: null
|
|
51
78
|
};
|
|
52
79
|
|
|
53
|
-
var
|
|
80
|
+
var InputField = function InputField(_ref) {
|
|
54
81
|
var _ref2;
|
|
55
82
|
|
|
56
83
|
var feedback = _ref.feedback,
|
|
57
84
|
value = _ref.value,
|
|
58
85
|
errors = _ref.errors,
|
|
59
86
|
required = _ref.required,
|
|
87
|
+
disabled = _ref.disabled,
|
|
60
88
|
nativeOnChange = _ref.nativeOnChange,
|
|
61
89
|
type = _ref.type,
|
|
62
90
|
placeholder = _ref.placeholder,
|
|
@@ -64,20 +92,21 @@ var TextField = function TextField(_ref) {
|
|
|
64
92
|
onFocus = _ref.onFocus,
|
|
65
93
|
onBlur = _ref.onBlur,
|
|
66
94
|
align = _ref.align,
|
|
95
|
+
size = _ref.size,
|
|
96
|
+
maxLength = _ref.maxLength,
|
|
67
97
|
prepend = _ref.prepend,
|
|
68
98
|
append = _ref.append,
|
|
99
|
+
min = _ref.min,
|
|
100
|
+
max = _ref.max,
|
|
69
101
|
dataList = _ref.dataList,
|
|
70
102
|
inputRef = _ref.inputRef,
|
|
71
|
-
className = _ref.className
|
|
72
|
-
props = _objectWithoutProperties(_ref, ["feedback", "value", "errors", "required", "nativeOnChange", "type", "placeholder", "onChange", "onFocus", "onBlur", "align", "prepend", "append", "dataList", "inputRef", "className"]);
|
|
73
|
-
|
|
103
|
+
className = _ref.className;
|
|
74
104
|
var dataListId = useMemo(function () {
|
|
75
105
|
return dataList !== null ? v1() : null;
|
|
76
106
|
}, [dataList]);
|
|
77
|
-
|
|
78
|
-
var elProps = _objectSpread(_objectSpread({}, props), {}, {
|
|
107
|
+
var elProps = {
|
|
79
108
|
ref: inputRef,
|
|
80
|
-
className: classNames([styles.inputElement, 'form-control', (_ref2 = {}, _defineProperty(_ref2,
|
|
109
|
+
className: classNames([styles.inputElement, 'form-control', (_ref2 = {}, _defineProperty(_ref2, "form-control-".concat(size), size !== null), _defineProperty(_ref2, 'is-valid', feedback === 'valid'), _defineProperty(_ref2, 'is-invalid', feedback === 'invalid' || errors !== null), _defineProperty(_ref2, className, className !== null), _ref2)]),
|
|
81
110
|
onFocus: onFocus,
|
|
82
111
|
onBlur: onBlur,
|
|
83
112
|
value: value !== null ? value : '',
|
|
@@ -86,17 +115,21 @@ var TextField = function TextField(_ref) {
|
|
|
86
115
|
},
|
|
87
116
|
placeholder: placeholder,
|
|
88
117
|
type: type,
|
|
118
|
+
maxLength: maxLength,
|
|
119
|
+
min: min,
|
|
120
|
+
max: max,
|
|
89
121
|
required: required,
|
|
122
|
+
disabled: disabled,
|
|
90
123
|
list: dataListId,
|
|
91
124
|
onChange: nativeOnChange ? onChange : function (_ref3) {
|
|
92
125
|
var _ref3$target$value = _ref3.target.value,
|
|
93
126
|
newValue = _ref3$target$value === void 0 ? '' : _ref3$target$value;
|
|
94
127
|
return onChange !== null ? onChange(!isEmpty(newValue) ? newValue : null) : null;
|
|
95
128
|
}
|
|
96
|
-
}
|
|
129
|
+
};
|
|
97
130
|
|
|
98
131
|
elProps.horizontal;
|
|
99
|
-
var cleanProps = _objectWithoutProperties(elProps,
|
|
132
|
+
var cleanProps = _objectWithoutProperties(elProps, _excluded);
|
|
100
133
|
|
|
101
134
|
var inputElement = type !== 'textarea' ? /*#__PURE__*/React.createElement("input", cleanProps) : /*#__PURE__*/React.createElement("textarea", cleanProps);
|
|
102
135
|
var withInputGroup = prepend !== null || append !== null;
|
|
@@ -112,34 +145,77 @@ var TextField = function TextField(_ref) {
|
|
|
112
145
|
})) : null);
|
|
113
146
|
};
|
|
114
147
|
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
var
|
|
118
|
-
return /*#__PURE__*/React.createElement(
|
|
148
|
+
InputField.propTypes = propTypes$5;
|
|
149
|
+
InputField.defaultProps = defaultProps$5;
|
|
150
|
+
var InputField$1 = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
151
|
+
return /*#__PURE__*/React.createElement(InputField, Object.assign({
|
|
119
152
|
inputRef: ref
|
|
120
153
|
}, props));
|
|
121
154
|
});
|
|
122
155
|
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
}
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
156
|
+
/* eslint-disable react/jsx-props-no-spreading */
|
|
157
|
+
var propTypes$4 = {};
|
|
158
|
+
var defaultProps$4 = {};
|
|
159
|
+
|
|
160
|
+
var EmailField = function EmailField(props) {
|
|
161
|
+
return /*#__PURE__*/React.createElement(InputField$1, Object.assign({}, props, {
|
|
162
|
+
type: "email"
|
|
163
|
+
}));
|
|
164
|
+
};
|
|
165
|
+
|
|
166
|
+
EmailField.propTypes = propTypes$4;
|
|
167
|
+
EmailField.defaultProps = defaultProps$4;
|
|
168
|
+
|
|
169
|
+
/* eslint-disable react/jsx-props-no-spreading */
|
|
170
|
+
var propTypes$3 = {};
|
|
171
|
+
var defaultProps$3 = {};
|
|
172
|
+
|
|
173
|
+
var PasswordField = function PasswordField(props) {
|
|
174
|
+
return /*#__PURE__*/React.createElement(InputField$1, Object.assign({}, props, {
|
|
175
|
+
type: "password"
|
|
176
|
+
}));
|
|
177
|
+
};
|
|
178
|
+
|
|
179
|
+
PasswordField.propTypes = propTypes$3;
|
|
180
|
+
PasswordField.defaultProps = defaultProps$3;
|
|
181
|
+
|
|
182
|
+
/* eslint-disable react/jsx-props-no-spreading */
|
|
183
|
+
var propTypes$2 = {};
|
|
184
|
+
var defaultProps$2 = {};
|
|
185
|
+
|
|
186
|
+
var TelephoneField = function TelephoneField(props) {
|
|
187
|
+
return /*#__PURE__*/React.createElement(InputField$1, Object.assign({}, props, {
|
|
188
|
+
type: "tel"
|
|
189
|
+
}));
|
|
190
|
+
};
|
|
191
|
+
|
|
192
|
+
TelephoneField.propTypes = propTypes$2;
|
|
193
|
+
TelephoneField.defaultProps = defaultProps$2;
|
|
194
|
+
|
|
195
|
+
/* eslint-disable react/jsx-props-no-spreading */
|
|
196
|
+
var propTypes$1 = {};
|
|
197
|
+
var defaultProps$1 = {};
|
|
198
|
+
|
|
199
|
+
var TextareaField = function TextareaField(props) {
|
|
200
|
+
return /*#__PURE__*/React.createElement(InputField$1, Object.assign({}, props, {
|
|
201
|
+
type: "textarea"
|
|
202
|
+
}));
|
|
203
|
+
};
|
|
204
|
+
|
|
205
|
+
TextareaField.propTypes = propTypes$1;
|
|
206
|
+
TextareaField.defaultProps = defaultProps$1;
|
|
207
|
+
|
|
208
|
+
/* eslint-disable react/jsx-props-no-spreading */
|
|
209
|
+
var propTypes = {};
|
|
210
|
+
var defaultProps = {};
|
|
211
|
+
|
|
212
|
+
var TextField = function TextField(props) {
|
|
213
|
+
return /*#__PURE__*/React.createElement(InputField$1, Object.assign({}, props, {
|
|
214
|
+
type: "text"
|
|
215
|
+
}));
|
|
216
|
+
};
|
|
217
|
+
|
|
218
|
+
TextField.propTypes = propTypes;
|
|
219
|
+
TextField.defaultProps = defaultProps;
|
|
143
220
|
|
|
144
|
-
export default
|
|
145
|
-
export { definition };
|
|
221
|
+
export { EmailField as Email, PasswordField as Password, TelephoneField as Telephone, TextareaField as Textarea, TextField as default, definition };
|
package/lib/index.js
CHANGED
|
@@ -2,55 +2,77 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
|
|
6
|
-
var _objectSpread = require('@babel/runtime/helpers/objectSpread2');
|
|
7
|
-
var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
|
|
8
5
|
var React = require('react');
|
|
9
|
-
var
|
|
10
|
-
var
|
|
11
|
-
var classNames = require('classnames');
|
|
6
|
+
var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
|
|
7
|
+
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
|
|
12
8
|
var InputGroup = require('@panneau/field-input-group');
|
|
9
|
+
var classNames = require('classnames');
|
|
10
|
+
var isEmpty = require('lodash/isEmpty');
|
|
11
|
+
var PropTypes = require('prop-types');
|
|
13
12
|
var uuid = require('uuid');
|
|
14
13
|
|
|
15
14
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
16
15
|
|
|
17
|
-
var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
|
|
18
|
-
var _objectSpread__default = /*#__PURE__*/_interopDefaultLegacy(_objectSpread);
|
|
19
|
-
var _objectWithoutProperties__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutProperties);
|
|
20
16
|
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
21
|
-
var
|
|
22
|
-
var
|
|
23
|
-
var classNames__default = /*#__PURE__*/_interopDefaultLegacy(classNames);
|
|
17
|
+
var _objectWithoutProperties__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutProperties);
|
|
18
|
+
var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
|
|
24
19
|
var InputGroup__default = /*#__PURE__*/_interopDefaultLegacy(InputGroup);
|
|
20
|
+
var classNames__default = /*#__PURE__*/_interopDefaultLegacy(classNames);
|
|
21
|
+
var isEmpty__default = /*#__PURE__*/_interopDefaultLegacy(isEmpty);
|
|
22
|
+
var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
|
|
25
23
|
|
|
26
|
-
var
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
24
|
+
var definition = [{
|
|
25
|
+
id: 'text',
|
|
26
|
+
component: 'text'
|
|
27
|
+
}, {
|
|
28
|
+
id: 'email',
|
|
29
|
+
component: 'email'
|
|
30
|
+
}, {
|
|
31
|
+
id: 'password',
|
|
32
|
+
component: 'password'
|
|
33
|
+
}, {
|
|
34
|
+
id: 'telephone',
|
|
35
|
+
component: 'telephone'
|
|
36
|
+
}, {
|
|
37
|
+
id: 'textarea',
|
|
38
|
+
component: 'textarea'
|
|
39
|
+
}];
|
|
40
|
+
|
|
41
|
+
var styles = {"inputElement":"panneau-field-text-inputElement"};
|
|
42
|
+
|
|
43
|
+
var _excluded = ["horizontal"];
|
|
44
|
+
var propTypes$5 = {
|
|
45
|
+
feedback: PropTypes__default["default"].oneOf(['valid', 'invalid', 'loading']),
|
|
46
|
+
value: PropTypes__default["default"].string,
|
|
47
|
+
errors: PropTypes__default["default"].oneOfType([PropTypes__default["default"].string, PropTypes__default["default"].arrayOf(PropTypes__default["default"].string)]),
|
|
48
|
+
required: PropTypes__default["default"].bool,
|
|
49
|
+
disabled: PropTypes__default["default"].bool,
|
|
50
|
+
nativeOnChange: PropTypes__default["default"].bool,
|
|
51
|
+
type: PropTypes__default["default"].oneOf(['text', 'email', 'tel', 'password', 'textarea', 'number']),
|
|
52
|
+
placeholder: PropTypes__default["default"].string,
|
|
53
|
+
onChange: PropTypes__default["default"].func,
|
|
54
|
+
onFocus: PropTypes__default["default"].func,
|
|
55
|
+
onBlur: PropTypes__default["default"].func,
|
|
56
|
+
align: PropTypes__default["default"].oneOf(['left', 'center', 'right']),
|
|
57
|
+
size: PropTypes__default["default"].oneOf([null, 'lg', 'sm']),
|
|
58
|
+
maxLength: PropTypes__default["default"].number,
|
|
59
|
+
prepend: PropTypes__default["default"].node,
|
|
60
|
+
append: PropTypes__default["default"].node,
|
|
61
|
+
min: PropTypes__default["default"].number,
|
|
62
|
+
max: PropTypes__default["default"].number,
|
|
63
|
+
dataList: PropTypes__default["default"].arrayOf(PropTypes__default["default"].string),
|
|
64
|
+
inputRef: PropTypes__default["default"].oneOfType([PropTypes__default["default"].func, PropTypes__default["default"].shape({
|
|
65
|
+
current: PropTypes__default["default"].any // eslint-disable-line
|
|
45
66
|
|
|
46
67
|
})]),
|
|
47
|
-
className: PropTypes__default[
|
|
68
|
+
className: PropTypes__default["default"].string
|
|
48
69
|
};
|
|
49
|
-
var defaultProps = {
|
|
70
|
+
var defaultProps$5 = {
|
|
50
71
|
feedback: null,
|
|
51
72
|
value: null,
|
|
52
73
|
errors: null,
|
|
53
74
|
required: false,
|
|
75
|
+
disabled: false,
|
|
54
76
|
nativeOnChange: false,
|
|
55
77
|
type: null,
|
|
56
78
|
placeholder: null,
|
|
@@ -58,20 +80,25 @@ var defaultProps = {
|
|
|
58
80
|
onFocus: null,
|
|
59
81
|
onBlur: null,
|
|
60
82
|
align: null,
|
|
83
|
+
size: null,
|
|
84
|
+
maxLength: null,
|
|
61
85
|
prepend: null,
|
|
62
86
|
append: null,
|
|
87
|
+
min: null,
|
|
88
|
+
max: null,
|
|
63
89
|
dataList: null,
|
|
64
90
|
inputRef: null,
|
|
65
91
|
className: null
|
|
66
92
|
};
|
|
67
93
|
|
|
68
|
-
var
|
|
94
|
+
var InputField = function InputField(_ref) {
|
|
69
95
|
var _ref2;
|
|
70
96
|
|
|
71
97
|
var feedback = _ref.feedback,
|
|
72
98
|
value = _ref.value,
|
|
73
99
|
errors = _ref.errors,
|
|
74
100
|
required = _ref.required,
|
|
101
|
+
disabled = _ref.disabled,
|
|
75
102
|
nativeOnChange = _ref.nativeOnChange,
|
|
76
103
|
type = _ref.type,
|
|
77
104
|
placeholder = _ref.placeholder,
|
|
@@ -79,20 +106,21 @@ var TextField = function TextField(_ref) {
|
|
|
79
106
|
onFocus = _ref.onFocus,
|
|
80
107
|
onBlur = _ref.onBlur,
|
|
81
108
|
align = _ref.align,
|
|
109
|
+
size = _ref.size,
|
|
110
|
+
maxLength = _ref.maxLength,
|
|
82
111
|
prepend = _ref.prepend,
|
|
83
112
|
append = _ref.append,
|
|
113
|
+
min = _ref.min,
|
|
114
|
+
max = _ref.max,
|
|
84
115
|
dataList = _ref.dataList,
|
|
85
116
|
inputRef = _ref.inputRef,
|
|
86
|
-
className = _ref.className
|
|
87
|
-
props = _objectWithoutProperties__default['default'](_ref, ["feedback", "value", "errors", "required", "nativeOnChange", "type", "placeholder", "onChange", "onFocus", "onBlur", "align", "prepend", "append", "dataList", "inputRef", "className"]);
|
|
88
|
-
|
|
117
|
+
className = _ref.className;
|
|
89
118
|
var dataListId = React.useMemo(function () {
|
|
90
119
|
return dataList !== null ? uuid.v1() : null;
|
|
91
120
|
}, [dataList]);
|
|
92
|
-
|
|
93
|
-
var elProps = _objectSpread__default['default'](_objectSpread__default['default']({}, props), {}, {
|
|
121
|
+
var elProps = {
|
|
94
122
|
ref: inputRef,
|
|
95
|
-
className: classNames__default[
|
|
123
|
+
className: classNames__default["default"]([styles.inputElement, 'form-control', (_ref2 = {}, _defineProperty__default["default"](_ref2, "form-control-".concat(size), size !== null), _defineProperty__default["default"](_ref2, 'is-valid', feedback === 'valid'), _defineProperty__default["default"](_ref2, 'is-invalid', feedback === 'invalid' || errors !== null), _defineProperty__default["default"](_ref2, className, className !== null), _ref2)]),
|
|
96
124
|
onFocus: onFocus,
|
|
97
125
|
onBlur: onBlur,
|
|
98
126
|
value: value !== null ? value : '',
|
|
@@ -101,60 +129,112 @@ var TextField = function TextField(_ref) {
|
|
|
101
129
|
},
|
|
102
130
|
placeholder: placeholder,
|
|
103
131
|
type: type,
|
|
132
|
+
maxLength: maxLength,
|
|
133
|
+
min: min,
|
|
134
|
+
max: max,
|
|
104
135
|
required: required,
|
|
136
|
+
disabled: disabled,
|
|
105
137
|
list: dataListId,
|
|
106
138
|
onChange: nativeOnChange ? onChange : function (_ref3) {
|
|
107
139
|
var _ref3$target$value = _ref3.target.value,
|
|
108
140
|
newValue = _ref3$target$value === void 0 ? '' : _ref3$target$value;
|
|
109
|
-
return onChange !== null ? onChange(!isEmpty__default[
|
|
141
|
+
return onChange !== null ? onChange(!isEmpty__default["default"](newValue) ? newValue : null) : null;
|
|
110
142
|
}
|
|
111
|
-
}
|
|
143
|
+
};
|
|
112
144
|
|
|
113
145
|
elProps.horizontal;
|
|
114
|
-
var cleanProps = _objectWithoutProperties__default[
|
|
146
|
+
var cleanProps = _objectWithoutProperties__default["default"](elProps, _excluded);
|
|
115
147
|
|
|
116
|
-
var inputElement = type !== 'textarea' ? /*#__PURE__*/React__default[
|
|
148
|
+
var inputElement = type !== 'textarea' ? /*#__PURE__*/React__default["default"].createElement("input", cleanProps) : /*#__PURE__*/React__default["default"].createElement("textarea", cleanProps);
|
|
117
149
|
var withInputGroup = prepend !== null || append !== null;
|
|
118
|
-
return /*#__PURE__*/React__default[
|
|
150
|
+
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, withInputGroup ? /*#__PURE__*/React__default["default"].createElement(InputGroup__default["default"], {
|
|
119
151
|
prepend: prepend,
|
|
120
152
|
append: append
|
|
121
|
-
}, inputElement) : inputElement, dataListId !== null ? /*#__PURE__*/React__default[
|
|
153
|
+
}, inputElement) : inputElement, dataListId !== null ? /*#__PURE__*/React__default["default"].createElement("datalist", {
|
|
122
154
|
id: dataListId
|
|
123
155
|
}, dataList.map(function (data, dataIndex) {
|
|
124
|
-
return /*#__PURE__*/React__default[
|
|
156
|
+
return /*#__PURE__*/React__default["default"].createElement("option", {
|
|
125
157
|
key: "option-".concat(dataIndex)
|
|
126
158
|
}, data);
|
|
127
159
|
})) : null);
|
|
128
160
|
};
|
|
129
161
|
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
var
|
|
133
|
-
return /*#__PURE__*/React__default[
|
|
162
|
+
InputField.propTypes = propTypes$5;
|
|
163
|
+
InputField.defaultProps = defaultProps$5;
|
|
164
|
+
var InputField$1 = /*#__PURE__*/React__default["default"].forwardRef(function (props, ref) {
|
|
165
|
+
return /*#__PURE__*/React__default["default"].createElement(InputField, Object.assign({
|
|
134
166
|
inputRef: ref
|
|
135
167
|
}, props));
|
|
136
168
|
});
|
|
137
169
|
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
}
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
170
|
+
/* eslint-disable react/jsx-props-no-spreading */
|
|
171
|
+
var propTypes$4 = {};
|
|
172
|
+
var defaultProps$4 = {};
|
|
173
|
+
|
|
174
|
+
var EmailField = function EmailField(props) {
|
|
175
|
+
return /*#__PURE__*/React__default["default"].createElement(InputField$1, Object.assign({}, props, {
|
|
176
|
+
type: "email"
|
|
177
|
+
}));
|
|
178
|
+
};
|
|
179
|
+
|
|
180
|
+
EmailField.propTypes = propTypes$4;
|
|
181
|
+
EmailField.defaultProps = defaultProps$4;
|
|
182
|
+
|
|
183
|
+
/* eslint-disable react/jsx-props-no-spreading */
|
|
184
|
+
var propTypes$3 = {};
|
|
185
|
+
var defaultProps$3 = {};
|
|
186
|
+
|
|
187
|
+
var PasswordField = function PasswordField(props) {
|
|
188
|
+
return /*#__PURE__*/React__default["default"].createElement(InputField$1, Object.assign({}, props, {
|
|
189
|
+
type: "password"
|
|
190
|
+
}));
|
|
191
|
+
};
|
|
192
|
+
|
|
193
|
+
PasswordField.propTypes = propTypes$3;
|
|
194
|
+
PasswordField.defaultProps = defaultProps$3;
|
|
195
|
+
|
|
196
|
+
/* eslint-disable react/jsx-props-no-spreading */
|
|
197
|
+
var propTypes$2 = {};
|
|
198
|
+
var defaultProps$2 = {};
|
|
199
|
+
|
|
200
|
+
var TelephoneField = function TelephoneField(props) {
|
|
201
|
+
return /*#__PURE__*/React__default["default"].createElement(InputField$1, Object.assign({}, props, {
|
|
202
|
+
type: "tel"
|
|
203
|
+
}));
|
|
204
|
+
};
|
|
205
|
+
|
|
206
|
+
TelephoneField.propTypes = propTypes$2;
|
|
207
|
+
TelephoneField.defaultProps = defaultProps$2;
|
|
208
|
+
|
|
209
|
+
/* eslint-disable react/jsx-props-no-spreading */
|
|
210
|
+
var propTypes$1 = {};
|
|
211
|
+
var defaultProps$1 = {};
|
|
212
|
+
|
|
213
|
+
var TextareaField = function TextareaField(props) {
|
|
214
|
+
return /*#__PURE__*/React__default["default"].createElement(InputField$1, Object.assign({}, props, {
|
|
215
|
+
type: "textarea"
|
|
216
|
+
}));
|
|
217
|
+
};
|
|
218
|
+
|
|
219
|
+
TextareaField.propTypes = propTypes$1;
|
|
220
|
+
TextareaField.defaultProps = defaultProps$1;
|
|
221
|
+
|
|
222
|
+
/* eslint-disable react/jsx-props-no-spreading */
|
|
223
|
+
var propTypes = {};
|
|
224
|
+
var defaultProps = {};
|
|
225
|
+
|
|
226
|
+
var TextField = function TextField(props) {
|
|
227
|
+
return /*#__PURE__*/React__default["default"].createElement(InputField$1, Object.assign({}, props, {
|
|
228
|
+
type: "text"
|
|
229
|
+
}));
|
|
230
|
+
};
|
|
231
|
+
|
|
232
|
+
TextField.propTypes = propTypes;
|
|
233
|
+
TextField.defaultProps = defaultProps;
|
|
158
234
|
|
|
159
|
-
exports.
|
|
235
|
+
exports.Email = EmailField;
|
|
236
|
+
exports.Password = PasswordField;
|
|
237
|
+
exports.Telephone = TelephoneField;
|
|
238
|
+
exports.Textarea = TextareaField;
|
|
239
|
+
exports["default"] = TextField;
|
|
160
240
|
exports.definition = definition;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@panneau/field-text",
|
|
3
|
-
"version": "1.0.0-alpha.
|
|
3
|
+
"version": "1.0.0-alpha.224",
|
|
4
4
|
"description": "A text field",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"javascript"
|
|
@@ -44,18 +44,18 @@
|
|
|
44
44
|
"prepare": "../../scripts/prepare-package.sh"
|
|
45
45
|
},
|
|
46
46
|
"devDependencies": {
|
|
47
|
-
"react": "^16.8.0",
|
|
48
|
-
"react-dom": "^16.8.0"
|
|
47
|
+
"react": "^16.8.0 || ^17.0.0",
|
|
48
|
+
"react-dom": "^16.8.0 || ^17.0.0"
|
|
49
49
|
},
|
|
50
50
|
"peerDependencies": {
|
|
51
|
-
"react": "^16.8.0",
|
|
52
|
-
"react-dom": "^16.8.0"
|
|
51
|
+
"react": "^16.8.0 || ^17.0.0",
|
|
52
|
+
"react-dom": "^16.8.0 || ^17.0.0"
|
|
53
53
|
},
|
|
54
54
|
"dependencies": {
|
|
55
55
|
"@babel/runtime": "^7.12.5",
|
|
56
|
-
"@panneau/core": "^1.0.0-alpha.
|
|
57
|
-
"@panneau/field-input-group": "^1.0.0-alpha.
|
|
58
|
-
"@panneau/themes": "^1.0.0-alpha.
|
|
56
|
+
"@panneau/core": "^1.0.0-alpha.224",
|
|
57
|
+
"@panneau/field-input-group": "^1.0.0-alpha.224",
|
|
58
|
+
"@panneau/themes": "^1.0.0-alpha.224",
|
|
59
59
|
"classnames": "^2.2.6",
|
|
60
60
|
"lodash": "^4.17.21",
|
|
61
61
|
"prop-types": "^15.7.2",
|
|
@@ -64,5 +64,5 @@
|
|
|
64
64
|
"publishConfig": {
|
|
65
65
|
"access": "public"
|
|
66
66
|
},
|
|
67
|
-
"gitHead": "
|
|
67
|
+
"gitHead": "3ff8c0088bc2e64b2572d28142e3a80426b440cd"
|
|
68
68
|
}
|