@hipay/hipay-material-ui 2.0.0-beta.60 → 2.0.0-beta.62
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/CHANGELOG.md +126 -0
- package/HiDatePicker/HiDatePicker.js +37 -12
- package/HiDatePicker/HiDateRangePicker.js +71 -57
- package/HiDatePicker/HiDateRangeSelector.js +34 -20
- package/HiDatePicker/stylesheet.js +32 -17
- package/HiSelect/HiSelect.js +489 -607
- package/HiSelect/index.js +41 -3
- package/HiSelectableList/HiSelectableList.js +68 -3
- package/HiSelectableList/HiSelectableListItem.js +22 -10
- package/README.md +15 -0
- package/es/HiDatePicker/HiDatePicker.js +30 -10
- package/es/HiDatePicker/HiDateRangePicker.js +38 -21
- package/es/HiDatePicker/HiDateRangeSelector.js +24 -13
- package/es/HiDatePicker/stylesheet.js +32 -17
- package/es/{HiSelectNew → HiSelect}/HiNestedSelect.js +1 -1
- package/es/{HiSelectNew → HiSelect}/HiNestedSelectContent.js +1 -1
- package/es/HiSelect/HiSelect.js +441 -564
- package/es/{HiSelectNew → HiSelect}/HiSelectContent.js +1 -1
- package/es/HiSelect/index.js +4 -1
- package/es/HiSelectableList/HiSelectableList.js +65 -4
- package/es/HiSelectableList/HiSelectableListItem.js +18 -10
- package/es/styles/createPalette.js +1 -1
- package/es/utils/helpers.js +9 -1
- package/index.es.js +1 -1
- package/index.js +1 -1
- package/package.json +1 -1
- package/styles/createPalette.js +1 -1
- package/umd/hipay-material-ui.development.js +7860 -7749
- package/umd/hipay-material-ui.production.min.js +2 -2
- package/utils/helpers.js +9 -1
- package/HiSelect/SelectInput.js +0 -369
- package/HiSelectNew/HiSelect.js +0 -929
- package/HiSelectNew/HiSelectField.js +0 -146
- package/HiSelectNew/index.js +0 -69
- package/es/HiSelect/SelectInput.js +0 -321
- package/es/HiSelectNew/HiSelect.js +0 -852
- package/es/HiSelectNew/HiSelectField.js +0 -111
- package/es/HiSelectNew/index.js +0 -6
- /package/{HiSelectNew → HiSelect}/HiDynamicSelect.js +0 -0
- /package/{HiSelectNew → HiSelect}/HiDynamicSelectField.js +0 -0
- /package/{HiSelectNew → HiSelect}/HiNestedSelect.js +0 -0
- /package/{HiSelectNew → HiSelect}/HiNestedSelectContent.js +0 -0
- /package/{HiSelectNew → HiSelect}/HiNestedSelectField.js +0 -0
- /package/{HiSelectNew → HiSelect}/HiSelectContent.js +0 -0
- /package/{HiSelectNew → HiSelect}/HiSelectInput.js +0 -0
- /package/es/{HiSelectNew → HiSelect}/HiDynamicSelect.js +0 -0
- /package/es/{HiSelectNew → HiSelect}/HiDynamicSelectField.js +0 -0
- /package/es/{HiSelectNew → HiSelect}/HiNestedSelectField.js +0 -0
- /package/es/{HiSelectNew → HiSelect}/HiSelectInput.js +0 -0
package/utils/helpers.js
CHANGED
@@ -310,7 +310,7 @@ function getNextItemSelectable(node, direction) {
|
|
310
310
|
|
311
311
|
|
312
312
|
function foldAccents(toFold) {
|
313
|
-
return toFold.replace(/([àáâãäå])|([ç])|([èéêë])|([ìíîï])|([ñ])|([òóôõöø])|([ß])|([ùúûü])|([ÿ])|([æ])|([œ])/g, function (str, a, c, e, i, n, o, s, u, y, ae, oe) {
|
313
|
+
return toFold.replace(/([àáâãäå])|([ç])|([èéêë])|([ìíîï])|([ñ])|([òóôõöø])|([ß])|([ùúûü])|([ÿ])|([æ])|([œ])|([+])|([\\])|([\[])|([\]])|([\(])|([\)])|([?])|([*])/g, function (str, a, c, e, i, n, o, s, u, y, ae, oe, plus, backSlash, lc, rc, lp, rp, interogation, star) {
|
314
314
|
if (a) return 'a';
|
315
315
|
if (c) return 'c';
|
316
316
|
if (e) return 'e';
|
@@ -322,6 +322,14 @@ function foldAccents(toFold) {
|
|
322
322
|
if (y) return 'y';
|
323
323
|
if (ae) return 'ae';
|
324
324
|
if (oe) return 'oe';
|
325
|
+
if (plus) return '\\+';
|
326
|
+
if (backSlash) return '\\\\';
|
327
|
+
if (lc) return '\\[';
|
328
|
+
if (rc) return '\\]';
|
329
|
+
if (lp) return '\\(';
|
330
|
+
if (rp) return '\\)';
|
331
|
+
if (interogation) return '\\?';
|
332
|
+
if (star) return '\\*';
|
325
333
|
return str;
|
326
334
|
});
|
327
335
|
}
|
package/HiSelect/SelectInput.js
DELETED
@@ -1,369 +0,0 @@
|
|
1
|
-
"use strict";
|
2
|
-
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
4
|
-
|
5
|
-
Object.defineProperty(exports, "__esModule", {
|
6
|
-
value: true
|
7
|
-
});
|
8
|
-
exports.default = exports.styles = void 0;
|
9
|
-
|
10
|
-
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
11
|
-
|
12
|
-
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
|
13
|
-
|
14
|
-
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
|
15
|
-
|
16
|
-
var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
|
17
|
-
|
18
|
-
var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
|
19
|
-
|
20
|
-
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
|
21
|
-
|
22
|
-
var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
|
23
|
-
|
24
|
-
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
25
|
-
|
26
|
-
var _react = _interopRequireDefault(require("react"));
|
27
|
-
|
28
|
-
var _propTypes = _interopRequireDefault(require("prop-types"));
|
29
|
-
|
30
|
-
var _classnames = _interopRequireDefault(require("classnames"));
|
31
|
-
|
32
|
-
var _keycode = _interopRequireDefault(require("keycode"));
|
33
|
-
|
34
|
-
var _HiIcon = _interopRequireDefault(require("../HiIcon"));
|
35
|
-
|
36
|
-
var _styles = require("../styles");
|
37
|
-
|
38
|
-
var _ButtonBase = _interopRequireDefault(require("@material-ui/core/ButtonBase"));
|
39
|
-
|
40
|
-
var styles = function styles(theme) {
|
41
|
-
return {
|
42
|
-
root: {
|
43
|
-
width: '100%',
|
44
|
-
height: 40,
|
45
|
-
maxWidth: 500,
|
46
|
-
display: 'flex',
|
47
|
-
justifyContent: 'center',
|
48
|
-
paddingTop: 7,
|
49
|
-
paddingBottom: 9,
|
50
|
-
paddingRight: 8,
|
51
|
-
paddingLeft: 8,
|
52
|
-
cursor: 'pointer'
|
53
|
-
},
|
54
|
-
underline: {
|
55
|
-
'&:before': {
|
56
|
-
backgroundColor: theme.palette.input.bottomLine,
|
57
|
-
left: 0,
|
58
|
-
bottom: 0,
|
59
|
-
// Doing the other way around crash on IE11 "''" https://github.com/cssinjs/jss/issues/242
|
60
|
-
content: '""',
|
61
|
-
height: 1,
|
62
|
-
position: 'absolute',
|
63
|
-
right: 0,
|
64
|
-
transition: theme.transitions.create('background-color', {
|
65
|
-
duration: theme.transitions.duration.shorter,
|
66
|
-
easing: theme.transitions.easing.ease
|
67
|
-
}),
|
68
|
-
pointerEvents: 'none' // Transparent to the hover style.
|
69
|
-
|
70
|
-
},
|
71
|
-
'&:hover:not($disabled):before': {
|
72
|
-
backgroundColor: theme.palette.input.bottomLine,
|
73
|
-
height: 2
|
74
|
-
},
|
75
|
-
'&$disabled:before': {
|
76
|
-
background: 'transparent',
|
77
|
-
backgroundImage: "linear-gradient(to right, ".concat(theme.palette.input.bottomLine, " 33%, transparent 0%)"),
|
78
|
-
backgroundPosition: 'left top',
|
79
|
-
backgroundRepeat: 'repeat-x',
|
80
|
-
backgroundSize: '5px 1px'
|
81
|
-
}
|
82
|
-
},
|
83
|
-
inkbar: {
|
84
|
-
'&:not($disabled)': {
|
85
|
-
'&:not($error):after': {
|
86
|
-
backgroundColor: theme.palette.primary.main,
|
87
|
-
left: 0,
|
88
|
-
bottom: 0,
|
89
|
-
// Doing the other way around crash on IE11 "''" https://github.com/cssinjs/jss/issues/242
|
90
|
-
content: '""',
|
91
|
-
height: 1,
|
92
|
-
position: 'absolute',
|
93
|
-
right: 0,
|
94
|
-
transform: 'scaleX(0)',
|
95
|
-
transition: theme.transitions.create('transform', {
|
96
|
-
duration: theme.transitions.duration.shorter,
|
97
|
-
easing: theme.transitions.easing.easeOut
|
98
|
-
}),
|
99
|
-
pointerEvents: 'none' // Transparent to the hover style.
|
100
|
-
|
101
|
-
},
|
102
|
-
'&:hover:after': {
|
103
|
-
transform: 'scaleX(1)'
|
104
|
-
},
|
105
|
-
'&$focused:after': {
|
106
|
-
transform: 'scaleX(1)'
|
107
|
-
},
|
108
|
-
'&$error': {
|
109
|
-
border: "1px solid ".concat(theme.palette.negative.normal),
|
110
|
-
borderRadius: 2
|
111
|
-
}
|
112
|
-
}
|
113
|
-
},
|
114
|
-
disabled: {
|
115
|
-
color: "".concat(theme.palette.text.disabled),
|
116
|
-
'&:before': {
|
117
|
-
display: 'none'
|
118
|
-
}
|
119
|
-
},
|
120
|
-
focused: {
|
121
|
-
backgroundColor: theme.palette.background3
|
122
|
-
},
|
123
|
-
error: {},
|
124
|
-
label: (0, _extends2.default)({
|
125
|
-
whiteSpace: 'nowrap',
|
126
|
-
overflow: 'hidden',
|
127
|
-
textOverflow: 'ellipsis'
|
128
|
-
}, theme.typography.b1, {
|
129
|
-
display: 'inline-flex',
|
130
|
-
width: '100%'
|
131
|
-
}),
|
132
|
-
icon: {
|
133
|
-
transition: theme.transitions.create(['opacity', 'transform'], {
|
134
|
-
duration: theme.transitions.duration.shorter
|
135
|
-
})
|
136
|
-
},
|
137
|
-
iconOpen: {
|
138
|
-
transform: 'rotate(90deg)'
|
139
|
-
},
|
140
|
-
iconClose: {
|
141
|
-
transform: 'rotate(0deg)'
|
142
|
-
}
|
143
|
-
};
|
144
|
-
};
|
145
|
-
/**
|
146
|
-
* @ignore - internal component.
|
147
|
-
*/
|
148
|
-
|
149
|
-
|
150
|
-
exports.styles = styles;
|
151
|
-
|
152
|
-
var SelectInput =
|
153
|
-
/*#__PURE__*/
|
154
|
-
function (_React$PureComponent) {
|
155
|
-
(0, _inherits2.default)(SelectInput, _React$PureComponent);
|
156
|
-
|
157
|
-
function SelectInput(props) {
|
158
|
-
var _this;
|
159
|
-
|
160
|
-
(0, _classCallCheck2.default)(this, SelectInput);
|
161
|
-
_this = (0, _possibleConstructorReturn2.default)(this, (0, _getPrototypeOf2.default)(SelectInput).call(this, props));
|
162
|
-
|
163
|
-
_this.handleKeyDown = function (event) {
|
164
|
-
var key = (0, _keycode.default)(event);
|
165
|
-
|
166
|
-
if (['up', 'down', 'space'].includes(key)) {
|
167
|
-
event.preventDefault();
|
168
|
-
|
169
|
-
_this.props.onClick();
|
170
|
-
} else if (key === 'enter' && _this.props.onSubmit) {
|
171
|
-
event.preventDefault();
|
172
|
-
|
173
|
-
_this.props.onSubmit(event);
|
174
|
-
}
|
175
|
-
};
|
176
|
-
|
177
|
-
_this.handleClick = function (event) {
|
178
|
-
if ((!_this.resetIcon || !_this.resetIcon.contains(event.target)) && _this.props.onClick) {
|
179
|
-
_this.props.onClick(event);
|
180
|
-
}
|
181
|
-
};
|
182
|
-
|
183
|
-
_this.handleKeyDown = _this.handleKeyDown.bind((0, _assertThisInitialized2.default)((0, _assertThisInitialized2.default)(_this)));
|
184
|
-
_this.handleClick = _this.handleClick.bind((0, _assertThisInitialized2.default)((0, _assertThisInitialized2.default)(_this)));
|
185
|
-
return _this;
|
186
|
-
}
|
187
|
-
|
188
|
-
(0, _createClass2.default)(SelectInput, [{
|
189
|
-
key: "render",
|
190
|
-
value: function render() {
|
191
|
-
var _classNames,
|
192
|
-
_classNames2,
|
193
|
-
_this2 = this;
|
194
|
-
|
195
|
-
var _this$props = this.props,
|
196
|
-
classes = _this$props.classes,
|
197
|
-
noButton = _this$props.noButton,
|
198
|
-
disabled = _this$props.disabled,
|
199
|
-
onClick = _this$props.onClick,
|
200
|
-
onReset = _this$props.onReset,
|
201
|
-
value = _this$props.value,
|
202
|
-
open = _this$props.open,
|
203
|
-
focused = _this$props.focused,
|
204
|
-
error = _this$props.error,
|
205
|
-
id = _this$props.id,
|
206
|
-
refElement = _this$props.refElement,
|
207
|
-
theme = _this$props.theme; // On utilise classNames pour variabiliser les styles et merge les classes appliquées
|
208
|
-
|
209
|
-
var rootClass = (0, _classnames.default)(classes.root, classes.inkbar, classes.underline, (_classNames = {}, (0, _defineProperty2.default)(_classNames, classes.disabled, disabled), (0, _defineProperty2.default)(_classNames, classes.focused, focused), (0, _defineProperty2.default)(_classNames, classes.error, error && !focused), _classNames));
|
210
|
-
var iconClass = (0, _classnames.default)(classes.icon, (_classNames2 = {}, (0, _defineProperty2.default)(_classNames2, classes.iconOpen, open), (0, _defineProperty2.default)(_classNames2, classes.iconClose, !open), _classNames2));
|
211
|
-
var render = noButton ? _react.default.createElement("div", {
|
212
|
-
id: id,
|
213
|
-
className: rootClass,
|
214
|
-
onClick: onClick,
|
215
|
-
disabled: disabled,
|
216
|
-
onMouseEnter: this.props.onMouseEnter,
|
217
|
-
onMouseLeave: this.props.onMouseLeave,
|
218
|
-
onKeyDown: this.handleKeyDown,
|
219
|
-
onFocus: this.props.onFocus,
|
220
|
-
onBlur: this.props.onBlur,
|
221
|
-
role: "button",
|
222
|
-
tabIndex: "0",
|
223
|
-
ref: function ref(el) {
|
224
|
-
if (refElement) refElement(el);
|
225
|
-
}
|
226
|
-
}, _react.default.createElement("span", {
|
227
|
-
className: classes.label
|
228
|
-
}, value), _react.default.createElement(_HiIcon.default, {
|
229
|
-
className: iconClass,
|
230
|
-
icon: "arrow_drop_down"
|
231
|
-
})) : _react.default.createElement(_ButtonBase.default, {
|
232
|
-
component: "div",
|
233
|
-
id: id,
|
234
|
-
classes: {
|
235
|
-
root: rootClass
|
236
|
-
},
|
237
|
-
onClick: this.handleClick,
|
238
|
-
disabled: disabled,
|
239
|
-
onMouseEnter: this.props.onMouseEnter,
|
240
|
-
onMouseLeave: this.props.onMouseLeave,
|
241
|
-
onKeyDown: this.handleKeyDown,
|
242
|
-
onFocus: this.props.onFocus,
|
243
|
-
onBlur: this.props.onBlur,
|
244
|
-
buttonRef: function buttonRef(el) {
|
245
|
-
if (refElement) refElement(el);
|
246
|
-
}
|
247
|
-
}, _react.default.createElement("span", {
|
248
|
-
className: classes.label
|
249
|
-
}, value), onReset && focused && _react.default.createElement("div", {
|
250
|
-
ref: function ref(el) {
|
251
|
-
_this2.resetIcon = el;
|
252
|
-
}
|
253
|
-
}, _react.default.createElement(_HiIcon.default, {
|
254
|
-
icon: "close",
|
255
|
-
size: 24,
|
256
|
-
color: theme.palette.neutral.main,
|
257
|
-
onClick: onReset
|
258
|
-
})), _react.default.createElement(_HiIcon.default, {
|
259
|
-
className: iconClass,
|
260
|
-
icon: "arrow_drop_down"
|
261
|
-
}));
|
262
|
-
return render;
|
263
|
-
}
|
264
|
-
}]);
|
265
|
-
return SelectInput;
|
266
|
-
}(_react.default.PureComponent);
|
267
|
-
|
268
|
-
SelectInput.defaultProps = {
|
269
|
-
disabled: false,
|
270
|
-
open: false,
|
271
|
-
focused: false,
|
272
|
-
noButton: false,
|
273
|
-
error: false
|
274
|
-
};
|
275
|
-
SelectInput.propTypes = process.env.NODE_ENV !== "production" ? {
|
276
|
-
/**
|
277
|
-
* Useful to extend the style applied to components.
|
278
|
-
*/
|
279
|
-
classes: _propTypes.default.object,
|
280
|
-
|
281
|
-
/**
|
282
|
-
* If `true`, the select will be disabled.
|
283
|
-
*/
|
284
|
-
disabled: _propTypes.default.bool,
|
285
|
-
|
286
|
-
/**
|
287
|
-
* Applique le style error
|
288
|
-
*/
|
289
|
-
error: _propTypes.default.bool,
|
290
|
-
|
291
|
-
/**
|
292
|
-
* Applique le style focused
|
293
|
-
*/
|
294
|
-
focused: _propTypes.default.bool,
|
295
|
-
|
296
|
-
/**
|
297
|
-
* id du select
|
298
|
-
*/
|
299
|
-
id: _propTypes.default.string,
|
300
|
-
|
301
|
-
/**
|
302
|
-
* Affiche sous forme de div à la place d'un bouton.
|
303
|
-
* Si des éléments cliquables sont à l'intérieur.
|
304
|
-
*/
|
305
|
-
noButton: _propTypes.default.bool,
|
306
|
-
|
307
|
-
/**
|
308
|
-
* Fonction de callback au blur du bouton
|
309
|
-
*/
|
310
|
-
onBlur: _propTypes.default.func,
|
311
|
-
|
312
|
-
/**
|
313
|
-
* Fonction de callback au click sur l'input/bouton
|
314
|
-
*/
|
315
|
-
onClick: _propTypes.default.func,
|
316
|
-
|
317
|
-
/**
|
318
|
-
* Fonction de callback au focus l'input/bouton
|
319
|
-
*/
|
320
|
-
onFocus: _propTypes.default.func,
|
321
|
-
|
322
|
-
/**
|
323
|
-
* Fonction de callback appelée lorsqu'on survole le champs
|
324
|
-
*/
|
325
|
-
onMouseEnter: _propTypes.default.func,
|
326
|
-
|
327
|
-
/**
|
328
|
-
* Fonction de callback appelée lorsque le curseur quitte le champs
|
329
|
-
*/
|
330
|
-
onMouseLeave: _propTypes.default.func,
|
331
|
-
|
332
|
-
/**
|
333
|
-
* Fonction de callback appelée lorsqu'on vide le champs
|
334
|
-
*/
|
335
|
-
onReset: _propTypes.default.func,
|
336
|
-
|
337
|
-
/**
|
338
|
-
* Fonction de callback à la pression de la touche "Entrée"
|
339
|
-
*/
|
340
|
-
onSubmit: _propTypes.default.func,
|
341
|
-
|
342
|
-
/**
|
343
|
-
* Applique le style open et effectue une rotation de l'icône
|
344
|
-
*/
|
345
|
-
open: _propTypes.default.bool,
|
346
|
-
|
347
|
-
/**
|
348
|
-
* Use that property to pass a ref callback to the native component.
|
349
|
-
*/
|
350
|
-
refElement: _propTypes.default.func,
|
351
|
-
|
352
|
-
/**
|
353
|
-
* Theme object
|
354
|
-
*/
|
355
|
-
theme: _propTypes.default.object,
|
356
|
-
|
357
|
-
/**
|
358
|
-
* Valeur à afficher (déjà formattée)
|
359
|
-
*/
|
360
|
-
value: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number, _propTypes.default.node])
|
361
|
-
} : {};
|
362
|
-
|
363
|
-
var _default = (0, _styles.withStyles)(styles, {
|
364
|
-
hiComponent: true,
|
365
|
-
name: 'HmuiSelectInput',
|
366
|
-
withTheme: true
|
367
|
-
})(SelectInput);
|
368
|
-
|
369
|
-
exports.default = _default;
|