@zohodesk/components 1.0.0-temp-40 → 1.0.0-temp-41
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/README.md +33 -20
- package/es/AppContainer/AppContainer.js +3 -6
- package/es/Appearance/dark/themes/blue/blueDarkCTATheme.module.css +33 -33
- package/es/Appearance/dark/themes/blue/blueDarkComponentTheme.module.css +41 -47
- package/es/Appearance/dark/themes/green/greenDarkCTATheme.module.css +32 -32
- package/es/Appearance/dark/themes/green/greenDarkComponentTheme.module.css +40 -46
- package/es/Appearance/dark/themes/orange/orangeDarkCTATheme.module.css +32 -32
- package/es/Appearance/dark/themes/orange/orangeDarkComponentTheme.module.css +40 -46
- package/es/Appearance/dark/themes/red/redDarkCTATheme.module.css +32 -32
- package/es/Appearance/dark/themes/red/redDarkComponentTheme.module.css +40 -46
- package/es/Appearance/dark/themes/yellow/yellowDarkCTATheme.module.css +32 -32
- package/es/Appearance/dark/themes/yellow/yellowDarkComponentTheme.module.css +40 -46
- package/es/Appearance/default/mode/defaultMode.module.css +1 -1
- package/es/Appearance/default/themes/blue/blueDefaultCTATheme.module.css +33 -33
- package/es/Appearance/default/themes/blue/blueDefaultComponentTheme.module.css +41 -47
- package/es/Appearance/default/themes/green/greenDefaultCTATheme.module.css +32 -32
- package/es/Appearance/default/themes/green/greenDefaultComponentTheme.module.css +40 -46
- package/es/Appearance/default/themes/orange/orangeDefaultCTATheme.module.css +32 -32
- package/es/Appearance/default/themes/orange/orangeDefaultComponentTheme.module.css +40 -46
- package/es/Appearance/default/themes/red/redDefaultCTATheme.module.css +32 -32
- package/es/Appearance/default/themes/red/redDefaultComponentTheme.module.css +40 -46
- package/es/Appearance/default/themes/yellow/yellowDefaultCTATheme.module.css +32 -32
- package/es/Appearance/default/themes/yellow/yellowDefaultComponentTheme.module.css +40 -46
- package/es/Avatar/Avatar.js +1 -2
- package/es/Avatar/__tests__/Avatar.spec.js +1 -0
- package/es/AvatarTeam/__tests__/AvatarTeam.spec.js +1 -0
- package/es/Button/__tests__/Button.spec.js +1 -0
- package/es/Buttongroup/__test__/Buttongroup.spec.js +1 -0
- package/es/DateTime/DateTime.js +3 -6
- package/es/DateTime/DateWidget.js +2 -5
- package/es/DateTime/DateWidget.module.css +0 -4
- package/es/DateTime/YearView.js +5 -6
- package/es/DateTime/common.js +2 -9
- package/es/DateTime/dateFormatUtils/dateFormat.js +57 -76
- package/es/DateTime/dateFormatUtils/index.js +7 -12
- package/es/DateTime/dateFormatUtils/timeChange.js +3 -4
- package/es/DateTime/dateFormatUtils/yearChange.js +3 -4
- package/es/DateTime/validator.js +1 -0
- package/es/Label/__tests__/Label.spec.js +2 -0
- package/es/Layout/utils.js +1 -2
- package/es/ListItem/ListItem.js +2 -0
- package/es/ListItem/ListItemWithIcon.js +2 -0
- package/es/MultiSelect/AdvancedGroupMultiSelect.js +10 -15
- package/es/MultiSelect/AdvancedMultiSelect.js +7 -6
- package/es/MultiSelect/AdvancedMultiSelect.module.css +8 -8
- package/es/MultiSelect/MultiSelect.js +10 -15
- package/es/MultiSelect/MultiSelect.module.css +8 -13
- package/es/MultiSelect/MultiSelectWithAvatar.js +6 -3
- package/es/MultiSelect/SelectedOptions.js +3 -2
- package/es/MultiSelect/docs/AdvancedGroupMultiSelect__default.docs.js +1 -2
- package/es/Popup/Popup.js +8 -14
- package/es/Popup/viewPort.js +9 -14
- package/es/Provider/Config.js +2 -1
- package/es/Provider/IdProvider.js +4 -5
- package/es/Provider/LibraryContext.js +5 -6
- package/es/Provider/NumberGenerator/NumberGenerator.js +15 -17
- package/es/Provider/ZindexProvider.js +4 -5
- package/es/Radio/Radio.js +1 -2
- package/es/Radio/Radio.module.css +2 -2
- package/es/Responsive/CustomResponsive.js +8 -11
- package/es/Responsive/ResizeComponent.js +1 -3
- package/es/Responsive/Responsive.js +9 -12
- package/es/Responsive/docs/Responsive__Custom.docs.js +44 -49
- package/es/Responsive/docs/Responsive__default.docs.js +74 -77
- package/es/Responsive/sizeObservers.js +1 -5
- package/es/Ribbon/__tests__/Ribbon.spec.js +1 -0
- package/es/RippleEffect/RippleEffect.js +7 -4
- package/es/RippleEffect/RippleEffect.module.css +3 -0
- package/es/Select/GroupSelect.js +1 -2
- package/es/Select/Select.js +1 -2
- package/es/Select/Select.module.css +1 -1
- package/es/Select/SelectWithAvatar.js +7 -4
- package/es/Select/docs/Select__default.docs.js +1 -2
- package/es/Stencils/__tests__/Stencils.spec.js +1 -0
- package/es/Tab/Tab.js +26 -27
- package/es/Tab/TabContent.js +14 -17
- package/es/Tab/TabContentWrapper.js +14 -17
- package/es/Tab/TabWrapper.js +14 -15
- package/es/Tab/Tabs.js +15 -4
- package/es/Tab/docs/Tab__default.docs.js +1 -0
- package/es/Tag/Tag.js +10 -4
- package/es/Tag/Tag.module.css +14 -11
- package/es/Tag/docs/Tag__default.docs.js +70 -0
- package/es/TextBox/__tests__/TextBox.spec.js +1 -0
- package/es/TextBoxIcon/TextBoxIcon.js +1 -1
- package/es/TextBoxIcon/TextBoxIcon.module.css +5 -2
- package/es/TextBoxIcon/__tests__/TextBoxIcon.spec.js +1 -0
- package/es/Textarea/__tests__/Textarea.spec.js +1 -0
- package/es/Tooltip/Tooltip.js +1 -0
- package/es/a11y/FocusScope/FocusScope.js +4 -10
- package/es/beta/FocusRing/FocusRing.js +1 -4
- package/es/utils/Common.js +11 -31
- package/es/utils/datetime/common.js +3 -6
- package/es/utils/dropDownUtils.js +5 -6
- package/es/utils/getInitial.js +1 -3
- package/lib/AppContainer/AppContainer.js +4 -6
- package/lib/Appearance/dark/themes/blue/blueDarkCTATheme.module.css +33 -33
- package/lib/Appearance/dark/themes/blue/blueDarkComponentTheme.module.css +41 -47
- package/lib/Appearance/dark/themes/green/greenDarkCTATheme.module.css +32 -32
- package/lib/Appearance/dark/themes/green/greenDarkComponentTheme.module.css +40 -46
- package/lib/Appearance/dark/themes/orange/orangeDarkCTATheme.module.css +32 -32
- package/lib/Appearance/dark/themes/orange/orangeDarkComponentTheme.module.css +40 -46
- package/lib/Appearance/dark/themes/red/redDarkCTATheme.module.css +32 -32
- package/lib/Appearance/dark/themes/red/redDarkComponentTheme.module.css +40 -46
- package/lib/Appearance/dark/themes/yellow/yellowDarkCTATheme.module.css +32 -32
- package/lib/Appearance/dark/themes/yellow/yellowDarkComponentTheme.module.css +40 -46
- package/lib/Appearance/default/mode/defaultMode.module.css +1 -1
- package/lib/Appearance/default/themes/blue/blueDefaultCTATheme.module.css +33 -33
- package/lib/Appearance/default/themes/blue/blueDefaultComponentTheme.module.css +41 -47
- package/lib/Appearance/default/themes/green/greenDefaultCTATheme.module.css +32 -32
- package/lib/Appearance/default/themes/green/greenDefaultComponentTheme.module.css +40 -46
- package/lib/Appearance/default/themes/orange/orangeDefaultCTATheme.module.css +32 -32
- package/lib/Appearance/default/themes/orange/orangeDefaultComponentTheme.module.css +40 -46
- package/lib/Appearance/default/themes/red/redDefaultCTATheme.module.css +32 -32
- package/lib/Appearance/default/themes/red/redDefaultComponentTheme.module.css +40 -46
- package/lib/Appearance/default/themes/yellow/yellowDefaultCTATheme.module.css +32 -32
- package/lib/Appearance/default/themes/yellow/yellowDefaultComponentTheme.module.css +40 -46
- package/lib/Card/Card.js +1 -1
- package/lib/Card/index.js +6 -6
- package/lib/DateTime/CalendarView.js +1 -1
- package/lib/DateTime/DateWidget.module.css +0 -4
- package/lib/DateTime/constants.js +1 -1
- package/lib/DateTime/dateFormatUtils/dateFormat.js +2 -2
- package/lib/DateTime/dateFormatUtils/index.js +13 -13
- package/lib/DateTime/objectUtils.js +1 -1
- package/lib/DropDown/DropDown.js +1 -1
- package/lib/Layout/Box.js +1 -1
- package/lib/Layout/Container.js +1 -1
- package/lib/Layout/index.js +4 -4
- package/lib/Layout/utils.js +2 -2
- package/lib/MultiSelect/AdvancedGroupMultiSelect.js +7 -4
- package/lib/MultiSelect/AdvancedMultiSelect.js +6 -3
- package/lib/MultiSelect/AdvancedMultiSelect.module.css +8 -8
- package/lib/MultiSelect/MultiSelect.js +7 -4
- package/lib/MultiSelect/MultiSelect.module.css +8 -13
- package/lib/MultiSelect/MultiSelectWithAvatar.js +6 -3
- package/lib/MultiSelect/SelectedOptions.js +3 -2
- package/lib/PopOver/PopOver.js +1 -1
- package/lib/Provider/Config.js +2 -1
- package/lib/Provider/IdProvider.js +3 -3
- package/lib/Provider/NumberGenerator/NumberGenerator.js +1 -1
- package/lib/Provider/ZindexProvider.js +1 -1
- package/lib/Radio/Radio.js +1 -3
- package/lib/Radio/Radio.module.css +2 -2
- package/lib/Responsive/CustomResponsive.js +1 -1
- package/lib/Responsive/Responsive.js +2 -3
- package/lib/Responsive/sizeObservers.js +2 -3
- package/lib/Responsive/utils/index.js +2 -3
- package/lib/RippleEffect/RippleEffect.js +7 -4
- package/lib/RippleEffect/RippleEffect.module.css +3 -0
- package/lib/Select/Select.module.css +1 -1
- package/lib/Select/SelectWithAvatar.js +7 -4
- package/lib/Tab/Tabs.js +13 -2
- package/lib/Tab/index.js +10 -10
- package/lib/Tag/Tag.js +10 -4
- package/lib/Tag/Tag.module.css +14 -11
- package/lib/Tag/docs/Tag__default.docs.js +70 -0
- package/lib/TextBoxIcon/TextBoxIcon.js +1 -1
- package/lib/TextBoxIcon/TextBoxIcon.module.css +5 -2
- package/lib/a11y/FocusScope/FocusScope.js +1 -1
- package/lib/index.js +308 -308
- package/lib/utils/Common.js +16 -20
- package/lib/utils/datetime/common.js +9 -9
- package/lib/utils/dropDownUtils.js +1 -1
- package/package.json +7 -3
- package/preprocess/componentThemeColors.js +119 -0
- package/preprocess/ctaThemeColors.js +95 -0
- package/preprocess/index.js +2 -0
- package/preprocess/json/componentVariableJson.js +259 -0
- package/preprocess/json/ctaVariableJson.js +337 -0
|
@@ -708,8 +708,7 @@ class DateWidgetComponent extends React.Component {
|
|
|
708
708
|
}
|
|
709
709
|
}
|
|
710
710
|
|
|
711
|
-
handleSelection() {
|
|
712
|
-
let focusOrder = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
|
|
711
|
+
handleSelection(focusOrder = 0) {
|
|
713
712
|
const isAllowedDateType = this.handleGetAllowedType();
|
|
714
713
|
|
|
715
714
|
if (isAllowedDateType) {
|
|
@@ -908,9 +907,7 @@ class DateWidgetComponent extends React.Component {
|
|
|
908
907
|
});
|
|
909
908
|
}
|
|
910
909
|
|
|
911
|
-
handleBlurSelectionRange() {
|
|
912
|
-
let focusOrder = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
|
|
913
|
-
let oldFocusOrder = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
|
|
910
|
+
handleBlurSelectionRange(focusOrder = '', oldFocusOrder = '') {
|
|
914
911
|
const isAllowedDateType = this.handleGetAllowedType();
|
|
915
912
|
|
|
916
913
|
if (isAllowedDateType) {
|
package/es/DateTime/YearView.js
CHANGED
|
@@ -185,12 +185,11 @@ export default class YearView extends React.PureComponent {
|
|
|
185
185
|
onSelectYear && onSelectYear(year);
|
|
186
186
|
}
|
|
187
187
|
|
|
188
|
-
renderListItem(
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
} = _ref;
|
|
188
|
+
renderListItem({
|
|
189
|
+
index,
|
|
190
|
+
style: virtualizerStyle,
|
|
191
|
+
ref
|
|
192
|
+
}) {
|
|
194
193
|
const {
|
|
195
194
|
years
|
|
196
195
|
} = this;
|
package/es/DateTime/common.js
CHANGED
|
@@ -1,16 +1,9 @@
|
|
|
1
|
-
export function bind() {
|
|
2
|
-
for (var _len = arguments.length, handlers = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
3
|
-
handlers[_key] = arguments[_key];
|
|
4
|
-
}
|
|
5
|
-
|
|
1
|
+
export function bind(...handlers) {
|
|
6
2
|
handlers.forEach(handler => {
|
|
7
3
|
this[handler] = this[handler].bind(this);
|
|
8
4
|
});
|
|
9
5
|
}
|
|
10
|
-
export function formatValue() {
|
|
11
|
-
let values = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
|
|
12
|
-
let valueField = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'id';
|
|
13
|
-
let textField = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'name';
|
|
6
|
+
export function formatValue(values = [], valueField = 'id', textField = 'name') {
|
|
14
7
|
return values && values.map(value => {
|
|
15
8
|
let formattedValue = value;
|
|
16
9
|
|
|
@@ -1,3 +1,5 @@
|
|
|
1
|
+
import "core-js/modules/es.string.replace";
|
|
2
|
+
|
|
1
3
|
/* eslint-disable no-param-reassign */
|
|
2
4
|
|
|
3
5
|
/** * Libraries ** */
|
|
@@ -12,9 +14,7 @@ import { formatDate } from '../../utils/datetime/common';
|
|
|
12
14
|
import { defaultFormat, supportedPatterns, // patternChangeStr,
|
|
13
15
|
patternSplitStr, INCONSTANT, flags } from '../constants';
|
|
14
16
|
|
|
15
|
-
function getDateFormatString() {
|
|
16
|
-
let dateFormatArr = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
|
|
17
|
-
let datePatternArr = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
|
|
17
|
+
function getDateFormatString(dateFormatArr = [], datePatternArr = []) {
|
|
18
18
|
return dateFormatArr.reduce((res, dateStr, index) => {
|
|
19
19
|
const patternStr = datePatternArr[index] || '';
|
|
20
20
|
res += dateStr + patternStr;
|
|
@@ -22,14 +22,8 @@ function getDateFormatString() {
|
|
|
22
22
|
}, '');
|
|
23
23
|
}
|
|
24
24
|
|
|
25
|
-
function getIsValidPattern() {
|
|
26
|
-
|
|
27
|
-
let datePatternArr = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
|
|
28
|
-
|
|
29
|
-
const isValueInArray = function () {
|
|
30
|
-
let possibleFormat = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
|
|
31
|
-
return possibleFormat.some(str => dateFormatArr.indexOf(str) >= 0);
|
|
32
|
-
};
|
|
25
|
+
function getIsValidPattern(dateFormatArr = [], datePatternArr = []) {
|
|
26
|
+
const isValueInArray = (possibleFormat = []) => possibleFormat.some(str => dateFormatArr.indexOf(str) >= 0);
|
|
33
27
|
|
|
34
28
|
const haveDay = isValueInArray(flags.day);
|
|
35
29
|
const haveMonth = isValueInArray(flags.month);
|
|
@@ -38,14 +32,12 @@ function getIsValidPattern() {
|
|
|
38
32
|
return haveDay && haveMonth && (haveYear || !haveYear) && isValidPattern;
|
|
39
33
|
}
|
|
40
34
|
|
|
41
|
-
export function getDateFormatDetails(
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
isDateTime
|
|
48
|
-
} = arguments.length > 1 ? arguments[1] : undefined;
|
|
35
|
+
export function getDateFormatDetails(dateFormat = '', {
|
|
36
|
+
isHideCurrentYear,
|
|
37
|
+
value,
|
|
38
|
+
timeZone,
|
|
39
|
+
isDateTime
|
|
40
|
+
}) {
|
|
49
41
|
let dayInfo = {};
|
|
50
42
|
let monthInfo = {};
|
|
51
43
|
let yearInfo = {};
|
|
@@ -126,11 +118,10 @@ export function getDateFormatDetails() {
|
|
|
126
118
|
};
|
|
127
119
|
}
|
|
128
120
|
|
|
129
|
-
function getDisplayFormatValue(dateVal, formatVal
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
} = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
|
|
121
|
+
function getDisplayFormatValue(dateVal, formatVal, {
|
|
122
|
+
i18nShortMonths = [],
|
|
123
|
+
i18nMonths = []
|
|
124
|
+
} = {}) {
|
|
134
125
|
const {
|
|
135
126
|
length,
|
|
136
127
|
type
|
|
@@ -151,11 +142,10 @@ function getDisplayFormatValue(dateVal, formatVal) {
|
|
|
151
142
|
return addZero(dateVal, length);
|
|
152
143
|
}
|
|
153
144
|
|
|
154
|
-
function concatDate(values, dateFormatArr, patternArr, fillPlaceHolder
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
} = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : {};
|
|
145
|
+
function concatDate(values, dateFormatArr, patternArr, fillPlaceHolder, {
|
|
146
|
+
i18nShortMonths,
|
|
147
|
+
i18nMonths
|
|
148
|
+
} = {}) {
|
|
159
149
|
const dateString = dateFormatArr.reduce((res, formatVal, index) => {
|
|
160
150
|
const {
|
|
161
151
|
type: dateFormatVal = ''
|
|
@@ -172,15 +162,11 @@ function concatDate(values, dateFormatArr, patternArr, fillPlaceHolder) {
|
|
|
172
162
|
return dateString;
|
|
173
163
|
}
|
|
174
164
|
|
|
175
|
-
export function getDateTimeString(
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
i18nShortMonths,
|
|
181
|
-
i18nMonths,
|
|
182
|
-
is24Hour
|
|
183
|
-
} = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {};
|
|
165
|
+
export function getDateTimeString(values = {}, dateFormatDetails = {}, isDateTime, {
|
|
166
|
+
i18nShortMonths,
|
|
167
|
+
i18nMonths,
|
|
168
|
+
is24Hour
|
|
169
|
+
} = {}) {
|
|
184
170
|
const {
|
|
185
171
|
day,
|
|
186
172
|
month,
|
|
@@ -213,10 +199,9 @@ export function getDateTimeString() {
|
|
|
213
199
|
|
|
214
200
|
return `${dateString}${timeString}`;
|
|
215
201
|
}
|
|
216
|
-
export function getDateDetails(value, localValues, isDateTime, timeZone,
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
} = _ref;
|
|
202
|
+
export function getDateDetails(value, localValues, isDateTime, timeZone, {
|
|
203
|
+
is24Hour
|
|
204
|
+
}) {
|
|
220
205
|
const {
|
|
221
206
|
day,
|
|
222
207
|
month,
|
|
@@ -266,10 +251,9 @@ export function getDateDetails(value, localValues, isDateTime, timeZone, _ref) {
|
|
|
266
251
|
|
|
267
252
|
return localValues;
|
|
268
253
|
}
|
|
269
|
-
export function getIsValidDate(values, isDateTime,
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
} = _ref2;
|
|
254
|
+
export function getIsValidDate(values, isDateTime, {
|
|
255
|
+
is24Hour
|
|
256
|
+
}) {
|
|
273
257
|
const {
|
|
274
258
|
day,
|
|
275
259
|
month,
|
|
@@ -425,22 +409,20 @@ export function getSelectedDate(values, props) {
|
|
|
425
409
|
};
|
|
426
410
|
}
|
|
427
411
|
|
|
428
|
-
function getDateFormatLength(type, length
|
|
429
|
-
|
|
430
|
-
|
|
431
|
-
|
|
432
|
-
|
|
433
|
-
|
|
434
|
-
|
|
435
|
-
|
|
436
|
-
|
|
437
|
-
|
|
438
|
-
|
|
439
|
-
|
|
440
|
-
|
|
441
|
-
|
|
442
|
-
is24Hour
|
|
443
|
-
} = arguments.length > 3 ? arguments[3] : undefined;
|
|
412
|
+
function getDateFormatLength(type, length, formatVal = '', {
|
|
413
|
+
i18nShortMonths,
|
|
414
|
+
i18nMonths,
|
|
415
|
+
selectedValue,
|
|
416
|
+
day,
|
|
417
|
+
month,
|
|
418
|
+
year,
|
|
419
|
+
hour,
|
|
420
|
+
minute,
|
|
421
|
+
noon,
|
|
422
|
+
timeZone,
|
|
423
|
+
isDateTime,
|
|
424
|
+
is24Hour
|
|
425
|
+
}) {
|
|
444
426
|
const {
|
|
445
427
|
month: selectedMonth
|
|
446
428
|
} = getDateDetails(selectedValue, {
|
|
@@ -467,20 +449,19 @@ function getDateFormatLength(type, length) {
|
|
|
467
449
|
return length;
|
|
468
450
|
}
|
|
469
451
|
|
|
470
|
-
export function getDateFormatSelection(dateFormatDetails, isDateTime
|
|
471
|
-
|
|
472
|
-
|
|
473
|
-
|
|
474
|
-
|
|
475
|
-
|
|
476
|
-
|
|
477
|
-
|
|
478
|
-
|
|
479
|
-
|
|
480
|
-
|
|
481
|
-
|
|
482
|
-
|
|
483
|
-
} = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
|
|
452
|
+
export function getDateFormatSelection(dateFormatDetails, isDateTime, {
|
|
453
|
+
i18nShortMonths,
|
|
454
|
+
i18nMonths,
|
|
455
|
+
selectedValue,
|
|
456
|
+
day,
|
|
457
|
+
month,
|
|
458
|
+
year,
|
|
459
|
+
hour,
|
|
460
|
+
minute,
|
|
461
|
+
noon,
|
|
462
|
+
timeZone,
|
|
463
|
+
is24Hour
|
|
464
|
+
} = {}) {
|
|
484
465
|
const {
|
|
485
466
|
dateFormatArr = [],
|
|
486
467
|
patternArr = []
|
|
@@ -11,9 +11,7 @@ import { flags, INVALID_DATE } from '../constants';
|
|
|
11
11
|
export function convertYearToTwoDigit(year) {
|
|
12
12
|
return parseInt(year.toString().slice(-2));
|
|
13
13
|
}
|
|
14
|
-
export function addZero() {
|
|
15
|
-
let value = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
|
|
16
|
-
let length = arguments.length > 1 ? arguments[1] : undefined;
|
|
14
|
+
export function addZero(value = '', length) {
|
|
17
15
|
let newValue = value.toString();
|
|
18
16
|
|
|
19
17
|
for (let i = 0; i < length; i++) {
|
|
@@ -100,9 +98,7 @@ export function getYearDetails(yearLength) {
|
|
|
100
98
|
currentYear: year
|
|
101
99
|
};
|
|
102
100
|
}
|
|
103
|
-
export function convertTwoDigitToYear() {
|
|
104
|
-
let digitValue = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
|
|
105
|
-
let selectedYear = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
|
|
101
|
+
export function convertTwoDigitToYear(digitValue = '', selectedYear = '') {
|
|
106
102
|
const dateObj = new Date();
|
|
107
103
|
let year = dateObj.getFullYear();
|
|
108
104
|
const digitValueStr = addZero(digitValue.toString(), 2);
|
|
@@ -195,12 +191,11 @@ export function getIsEmptyYear(value, yearLength) {
|
|
|
195
191
|
} = getYearDetails(yearLength);
|
|
196
192
|
return getIsEmptyValue(value, startPoint, endPoint);
|
|
197
193
|
}
|
|
198
|
-
export function getIsCurrentYear(
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
} = _ref;
|
|
194
|
+
export function getIsCurrentYear({
|
|
195
|
+
isDateTime,
|
|
196
|
+
value,
|
|
197
|
+
timeZone
|
|
198
|
+
}) {
|
|
204
199
|
let isCurrentYear = false;
|
|
205
200
|
|
|
206
201
|
if (value && value !== INVALID_DATE) {
|
|
@@ -1,10 +1,9 @@
|
|
|
1
1
|
/** * Methods ** */
|
|
2
2
|
import { getIsNewValueType, getIsNumberTyped, getIsDeleteTyped, getHourDetails, getMinuteDetails, getNoonDetails, getIsNoonValueTyped, getIsEmptyHour } from './index';
|
|
3
3
|
import { getIsEmptyValue } from '../../utils/Common';
|
|
4
|
-
export function getChangedHour(values, event, focusOrders, keyActions
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
} = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : {};
|
|
4
|
+
export function getChangedHour(values, event, focusOrders, keyActions, {
|
|
5
|
+
is24Hour = false
|
|
6
|
+
} = {}) {
|
|
8
7
|
const {
|
|
9
8
|
keyCode,
|
|
10
9
|
which
|
|
@@ -1,9 +1,8 @@
|
|
|
1
1
|
/** * Methods ** */
|
|
2
2
|
import { getIsNewValueType, getIsNumberTyped, getIsDeleteTyped, getDayEnd, convertYearToTwoDigit, getYearDetails, convertTwoDigitToYear, getIsEmptyYear } from './index';
|
|
3
|
-
export function getChangedYear(values, event, focusOrders, keyActions,
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
} = _ref;
|
|
3
|
+
export function getChangedYear(values, event, focusOrders, keyActions, {
|
|
4
|
+
yearInfo
|
|
5
|
+
}) {
|
|
7
6
|
const {
|
|
8
7
|
keyCode,
|
|
9
8
|
which
|
package/es/DateTime/validator.js
CHANGED
package/es/Layout/utils.js
CHANGED
|
@@ -15,8 +15,7 @@ export function createProps(propTypes, props, classNames) {
|
|
|
15
15
|
export function isInteger(value) {
|
|
16
16
|
return typeof value === 'number' && isFinite(value) && Math.floor(value) === value;
|
|
17
17
|
}
|
|
18
|
-
export function setProps(childProps, props) {
|
|
19
|
-
let values = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
|
|
18
|
+
export function setProps(childProps, props, values = {}) {
|
|
20
19
|
Object.keys(values).map(value => {
|
|
21
20
|
if (props[value]) {
|
|
22
21
|
childProps[values[value]] = props[value];
|
package/es/ListItem/ListItem.js
CHANGED
|
@@ -1,3 +1,5 @@
|
|
|
1
|
+
import "core-js/modules/es.string.replace";
|
|
2
|
+
|
|
1
3
|
function _extends() { _extends = Object.assign || 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); }
|
|
2
4
|
|
|
3
5
|
/**** Libraries ****/
|
|
@@ -1,3 +1,5 @@
|
|
|
1
|
+
import "core-js/modules/es.string.replace";
|
|
2
|
+
|
|
1
3
|
function _extends() { _extends = Object.assign || 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); }
|
|
2
4
|
|
|
3
5
|
/**** Libraries ****/
|
|
@@ -254,9 +254,7 @@ class AdvancedGroupMultiSelect extends React.Component {
|
|
|
254
254
|
}) : this.togglePopup(e);
|
|
255
255
|
}
|
|
256
256
|
|
|
257
|
-
handleClickSelectedOption() {
|
|
258
|
-
let id = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
|
|
259
|
-
let e = arguments.length > 1 ? arguments[1] : undefined;
|
|
257
|
+
handleClickSelectedOption(id = '', e) {
|
|
260
258
|
let {
|
|
261
259
|
selectedOptionIds
|
|
262
260
|
} = this.state;
|
|
@@ -527,11 +525,7 @@ class AdvancedGroupMultiSelect extends React.Component {
|
|
|
527
525
|
});
|
|
528
526
|
}
|
|
529
527
|
|
|
530
|
-
handleFetchOptions() {
|
|
531
|
-
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
532
|
-
args[_key] = arguments[_key];
|
|
533
|
-
}
|
|
534
|
-
|
|
528
|
+
handleFetchOptions(...args) {
|
|
535
529
|
let [APICall, searchStr] = args;
|
|
536
530
|
let {
|
|
537
531
|
isFetchingOptions
|
|
@@ -644,9 +638,7 @@ class AdvancedGroupMultiSelect extends React.Component {
|
|
|
644
638
|
this.handleChange([]);
|
|
645
639
|
}
|
|
646
640
|
|
|
647
|
-
handleChange() {
|
|
648
|
-
let selectedOptions = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
|
|
649
|
-
let e = arguments.length > 1 ? arguments[1] : undefined;
|
|
641
|
+
handleChange(selectedOptions = [], e) {
|
|
650
642
|
let {
|
|
651
643
|
onChange,
|
|
652
644
|
needToCloseOnSelect,
|
|
@@ -855,7 +847,8 @@ class AdvancedGroupMultiSelect extends React.Component {
|
|
|
855
847
|
i18nKeys,
|
|
856
848
|
a11y,
|
|
857
849
|
isSearchClearOnSelect,
|
|
858
|
-
palette
|
|
850
|
+
palette,
|
|
851
|
+
needEffect
|
|
859
852
|
} = this.props;
|
|
860
853
|
let {
|
|
861
854
|
clearText = 'Clear all'
|
|
@@ -884,7 +877,7 @@ class AdvancedGroupMultiSelect extends React.Component {
|
|
|
884
877
|
let setAriaId = this.getNextAriaId();
|
|
885
878
|
let ariaErrorId = this.getNextAriaId();
|
|
886
879
|
return /*#__PURE__*/React.createElement("div", {
|
|
887
|
-
className: `${style.wrapper} ${isDisabled ? style.disabled : ''}`,
|
|
880
|
+
className: `${style.wrapper} ${isDisabled ? style.disabled : ''} ${needEffect && !(isDisabled || isReadOnly) ? style.effect : ''}`,
|
|
888
881
|
"data-id": `${isDisabled ? `${dataId}_disabled` : isReadOnly ? `${dataId}_readOnly` : dataId}`,
|
|
889
882
|
"data-title": isDisabled ? title : '',
|
|
890
883
|
onClick: this.handleInputFocus
|
|
@@ -1060,7 +1053,8 @@ AdvancedGroupMultiSelect.defaultProps = {
|
|
|
1060
1053
|
isPadding: false,
|
|
1061
1054
|
i18nKeys: {},
|
|
1062
1055
|
a11y: {},
|
|
1063
|
-
isSearchClearOnSelect: true
|
|
1056
|
+
isSearchClearOnSelect: true,
|
|
1057
|
+
needEffect: PropTypes.bool
|
|
1064
1058
|
};
|
|
1065
1059
|
AdvancedGroupMultiSelect.propTypes = {
|
|
1066
1060
|
animationStyle: PropTypes.string,
|
|
@@ -1110,7 +1104,8 @@ AdvancedGroupMultiSelect.propTypes = {
|
|
|
1110
1104
|
variant: PropTypes.string,
|
|
1111
1105
|
htmlId: PropTypes.string,
|
|
1112
1106
|
isSearchClearOnSelect: PropTypes.bool,
|
|
1113
|
-
palette: PropTypes.oneOf(['default', 'dark'])
|
|
1107
|
+
palette: PropTypes.oneOf(['default', 'dark']),
|
|
1108
|
+
needEffect: true
|
|
1114
1109
|
};
|
|
1115
1110
|
|
|
1116
1111
|
if (false) {
|
|
@@ -76,9 +76,7 @@ export class AdvancedMultiSelectComponent extends MultiSelectComponent {
|
|
|
76
76
|
return suggestions;
|
|
77
77
|
}
|
|
78
78
|
|
|
79
|
-
handleChange() {
|
|
80
|
-
let selectedOptions = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
|
|
81
|
-
let e = arguments.length > 1 ? arguments[1] : undefined;
|
|
79
|
+
handleChange(selectedOptions = [], e) {
|
|
82
80
|
const {
|
|
83
81
|
optionsNormalize,
|
|
84
82
|
searchStr
|
|
@@ -349,7 +347,8 @@ export class AdvancedMultiSelectComponent extends MultiSelectComponent {
|
|
|
349
347
|
borderColor,
|
|
350
348
|
isBoxPaddingNeed,
|
|
351
349
|
getFooter,
|
|
352
|
-
customProps
|
|
350
|
+
customProps,
|
|
351
|
+
needEffect
|
|
353
352
|
} = this.props;
|
|
354
353
|
let {
|
|
355
354
|
SuggestionsProps = {},
|
|
@@ -382,7 +381,7 @@ export class AdvancedMultiSelectComponent extends MultiSelectComponent {
|
|
|
382
381
|
const setAriaId = this.getNextAriaId();
|
|
383
382
|
const ariaErrorId = this.getNextAriaId();
|
|
384
383
|
return /*#__PURE__*/React.createElement("div", {
|
|
385
|
-
className: `${style.wrapper} ${isDisabled ? style.disabled : ''} ${borderColor === 'transparent' ? style.transparentContainer : ''}`,
|
|
384
|
+
className: `${style.wrapper} ${isDisabled ? style.disabled : ''} ${borderColor === 'transparent' ? style.transparentContainer : ''} ${needEffect && !(isDisabled || isReadOnly) ? style.effect : ''}`,
|
|
386
385
|
"data-id": dataIdMultiSelectComp,
|
|
387
386
|
"data-title": isDisabled ? title : '',
|
|
388
387
|
onClick: this.handleInputFocus
|
|
@@ -525,6 +524,7 @@ AdvancedMultiSelectComponent.propTypes = {
|
|
|
525
524
|
//For grouping multiSelect
|
|
526
525
|
getPublicMethods: PropTypes.func,
|
|
527
526
|
optionType: PropTypes.oneOf(['default', 'avatar', 'icon']),
|
|
527
|
+
needEffect: PropTypes.bool,
|
|
528
528
|
animationStyle: PropTypes.string,
|
|
529
529
|
defaultDropBoxPosition: PropTypes.oneOf(['bottom', 'top', 'left', 'right']),
|
|
530
530
|
dropBoxSize: PropTypes.oneOf(['small', 'medium', 'large']),
|
|
@@ -599,7 +599,8 @@ AdvancedMultiSelectComponent.defaultProps = {
|
|
|
599
599
|
borderColor: 'default',
|
|
600
600
|
isBoxPaddingNeed: true,
|
|
601
601
|
isSearchClearOnSelect: true,
|
|
602
|
-
customProps: {}
|
|
602
|
+
customProps: {},
|
|
603
|
+
needEffect: true
|
|
603
604
|
};
|
|
604
605
|
AdvancedMultiSelectComponent.displayName = 'AdvancedMultiSelect';
|
|
605
606
|
const AdvancedMultiSelect = Popup(AdvancedMultiSelectComponent);
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
.wrapper {
|
|
2
2
|
position: relative;
|
|
3
3
|
}
|
|
4
|
-
.disabled {
|
|
5
|
-
|
|
4
|
+
.disabled, .readOnly {
|
|
5
|
+
cursor: not-allowed;
|
|
6
6
|
}
|
|
7
7
|
.container {
|
|
8
8
|
max-height: var(--zd_size120);
|
|
@@ -16,28 +16,28 @@
|
|
|
16
16
|
.borderColor_transparent {
|
|
17
17
|
border-bottom-color: var(--zdt_advancedmultiselect_transparent_border);
|
|
18
18
|
}
|
|
19
|
-
.borderColor_transparent:hover {
|
|
19
|
+
.effect .borderColor_transparent:hover {
|
|
20
20
|
border-bottom-color: var(--zdt_advancedmultiselect_transparent_hover_border);
|
|
21
21
|
}
|
|
22
|
-
.borderColor_transparent.active {
|
|
22
|
+
.effect .borderColor_transparent.active {
|
|
23
23
|
border-bottom-color: var(--zdt_advancedmultiselect_transparent_active_border);
|
|
24
24
|
}
|
|
25
25
|
.borderColor_default {
|
|
26
26
|
border-bottom-color: var(--zdt_advancedmultiselect_default_border);
|
|
27
27
|
}
|
|
28
|
-
.borderColor_default:hover {
|
|
28
|
+
.effect .borderColor_default:hover {
|
|
29
29
|
border-bottom-color: var(--zdt_advancedmultiselect_default_hover_border);
|
|
30
30
|
}
|
|
31
|
-
.borderColor_default.active {
|
|
31
|
+
.effect .borderColor_default.active {
|
|
32
32
|
border-bottom-color: var(--zdt_advancedmultiselect_default_active_border);
|
|
33
33
|
}
|
|
34
34
|
.borderColor_dark {
|
|
35
35
|
border-bottom-color: var(--zdt_advancedmultiselect_dark_border);
|
|
36
36
|
}
|
|
37
|
-
.borderColor_dark:hover {
|
|
37
|
+
.effect .borderColor_dark:hover {
|
|
38
38
|
border-bottom-color: var(--zdt_advancedmultiselect_dark_hover_border);
|
|
39
39
|
}
|
|
40
|
-
.borderColor_dark.active {
|
|
40
|
+
.effect .borderColor_dark.active {
|
|
41
41
|
border-bottom-color: var(--zdt_advancedmultiselect_dark_active_border);
|
|
42
42
|
}
|
|
43
43
|
[dir=ltr] .container.medium {
|
|
@@ -535,11 +535,7 @@ export class MultiSelectComponent extends React.Component {
|
|
|
535
535
|
}
|
|
536
536
|
}
|
|
537
537
|
|
|
538
|
-
handleFetchOptions() {
|
|
539
|
-
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
540
|
-
args[_key] = arguments[_key];
|
|
541
|
-
}
|
|
542
|
-
|
|
538
|
+
handleFetchOptions(...args) {
|
|
543
539
|
const [APICall, searchStr] = args;
|
|
544
540
|
const {
|
|
545
541
|
isFetchingOptions
|
|
@@ -605,9 +601,7 @@ export class MultiSelectComponent extends React.Component {
|
|
|
605
601
|
});
|
|
606
602
|
}
|
|
607
603
|
|
|
608
|
-
handleClickSelectedOption() {
|
|
609
|
-
let id = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
|
|
610
|
-
let e = arguments.length > 1 ? arguments[1] : undefined;
|
|
604
|
+
handleClickSelectedOption(id = '', e) {
|
|
611
605
|
const {
|
|
612
606
|
selectedOptions
|
|
613
607
|
} = this.props;
|
|
@@ -688,9 +682,7 @@ export class MultiSelectComponent extends React.Component {
|
|
|
688
682
|
getNextOptions && getNextOptions(searchStr);
|
|
689
683
|
}
|
|
690
684
|
|
|
691
|
-
handleChange() {
|
|
692
|
-
let selectedOptions = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
|
|
693
|
-
let e = arguments.length > 1 ? arguments[1] : undefined;
|
|
685
|
+
handleChange(selectedOptions = [], e) {
|
|
694
686
|
const {
|
|
695
687
|
optionsNormalize
|
|
696
688
|
} = this.state;
|
|
@@ -863,7 +855,8 @@ export class MultiSelectComponent extends React.Component {
|
|
|
863
855
|
a11y,
|
|
864
856
|
children,
|
|
865
857
|
customChildrenClass,
|
|
866
|
-
getFooter
|
|
858
|
+
getFooter,
|
|
859
|
+
needEffect
|
|
867
860
|
} = this.props;
|
|
868
861
|
const {
|
|
869
862
|
clearText = 'Clear all',
|
|
@@ -891,7 +884,7 @@ export class MultiSelectComponent extends React.Component {
|
|
|
891
884
|
const ariaErrorId = this.getNextAriaId();
|
|
892
885
|
const isShowClearIcon = !isReadOnly && !isDisabled && !disableAction && selectedOptions.length > 1;
|
|
893
886
|
return /*#__PURE__*/React.createElement("div", {
|
|
894
|
-
className: `${style.wrapper} ${isDisabled ? style.disabled : ''} ${isReadOnly ? style.readOnly : ''} ${disableAction ? CssProvider('isBlock') : ''} ${borderColor === 'transparent' ? style.transparentContainer : ''}`,
|
|
887
|
+
className: `${style.wrapper} ${isDisabled ? style.disabled : ''} ${isReadOnly ? style.readOnly : ''} ${disableAction ? CssProvider('isBlock') : ''} ${borderColor === 'transparent' ? style.transparentContainer : ''} ${needEffect && !(isDisabled || isReadOnly) ? style.effect : ''}`,
|
|
895
888
|
"data-id": `${isDisabled ? `${dataId}_disabled` : isReadOnly ? `${dataId}_readOnly` : dataId}`,
|
|
896
889
|
"data-title": isDisabled ? title : '',
|
|
897
890
|
onClick: this.handleInputFocus
|
|
@@ -1095,7 +1088,8 @@ MultiSelectComponent.propTypes = {
|
|
|
1095
1088
|
children: PropTypes.node,
|
|
1096
1089
|
customChildrenClass: PropTypes.string,
|
|
1097
1090
|
disabledOptions: PropTypes.arrayOf(PropTypes.string),
|
|
1098
|
-
getFooter: PropTypes.func
|
|
1091
|
+
getFooter: PropTypes.func,
|
|
1092
|
+
needEffect: PropTypes.bool
|
|
1099
1093
|
};
|
|
1100
1094
|
MultiSelectComponent.defaultProps = {
|
|
1101
1095
|
animationStyle: 'bounce',
|
|
@@ -1125,7 +1119,8 @@ MultiSelectComponent.defaultProps = {
|
|
|
1125
1119
|
a11y: {},
|
|
1126
1120
|
textBoxClass: '',
|
|
1127
1121
|
palette: 'default',
|
|
1128
|
-
isSearchClearOnSelect: true
|
|
1122
|
+
isSearchClearOnSelect: true,
|
|
1123
|
+
needEffect: true
|
|
1129
1124
|
};
|
|
1130
1125
|
|
|
1131
1126
|
if (false) {
|