@zohodesk/dot 1.0.0-temp-184.2 → 1.0.0-temp-186
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/.cli/propValidation_report.html +1 -1
- package/README.md +8 -0
- package/coverage/ExternalLink/ExternalLink.js.html +1 -1
- package/coverage/ExternalLink/ExternalLink.module.css.html +1 -1
- package/coverage/ExternalLink/index.html +1 -1
- package/coverage/ExternalLink/props/defaultProps.js.html +1 -1
- package/coverage/ExternalLink/props/index.html +1 -1
- package/coverage/ExternalLink/props/propTypes.js.html +1 -1
- package/coverage/IconButton/IconButton.js.html +1 -1
- package/coverage/IconButton/IconButton.module.css.html +1 -1
- package/coverage/IconButton/index.html +1 -1
- package/coverage/IconButton/props/defaultProps.js.html +1 -1
- package/coverage/IconButton/props/index.html +1 -1
- package/coverage/IconButton/props/propTypes.js.html +1 -1
- package/coverage/Image/Image.js.html +1 -1
- package/coverage/Image/Image.module.css.html +1 -1
- package/coverage/Image/index.html +1 -1
- package/coverage/Image/props/defaultProps.js.html +1 -1
- package/coverage/Image/props/index.html +1 -1
- package/coverage/Image/props/propTypes.js.html +1 -1
- package/coverage/avatar/AvatarWithTeam/AvatarWithTeam.js.html +1 -1
- package/coverage/avatar/AvatarWithTeam/AvatarWithTeam.module.css.html +1 -1
- package/coverage/avatar/AvatarWithTeam/index.html +1 -1
- package/coverage/avatar/AvatarWithTeam/props/defaultProps.js.html +1 -1
- package/coverage/avatar/AvatarWithTeam/props/index.html +1 -1
- package/coverage/avatar/AvatarWithTeam/props/propTypes.js.html +1 -1
- package/coverage/index.html +1 -1
- package/es/Drawer/Drawer.js +4 -5
- package/es/ExternalLink/ExternalLink.js +4 -5
- package/es/FlipCard/FlipCard.js +14 -12
- package/es/IconButton/IconButton.js +4 -5
- package/es/Link/Link.js +8 -10
- package/es/Message/Message.js +4 -5
- package/es/ToastMessage/ToastMessage.js +2 -4
- package/es/actions/AutoClose.js +2 -1
- package/es/alert/AlertLookup/AlertLookup.js +14 -12
- package/es/avatar/AvatarClose/AvatarClose.js +7 -7
- package/es/avatar/AvatarCollision/AvatarCollision.js +7 -7
- package/es/avatar/AvatarIcon/AvatarIcon.js +4 -5
- package/es/avatar/AvatarStatus/AvatarStatus.js +7 -8
- package/es/avatar/AvatarThread/AvatarThread.js +7 -7
- package/es/avatar/AvatarUser/AvatarUser.js +10 -9
- package/es/avatar/AvatarWithTeam/AvatarWithTeam.js +17 -14
- package/es/dropdown/ToggleDropDown/ToggleDropDown.js +28 -24
- package/es/form/fields/CheckBoxField/CheckBoxField.js +15 -13
- package/es/form/fields/CurrencyField/CurrencyField.js +14 -12
- package/es/form/fields/DateField/DateField.js +14 -14
- package/es/form/fields/MultiSelectField/MultiSelectField.js +13 -12
- package/es/form/fields/PhoneField/PhoneField.js +7 -7
- package/es/form/fields/RadioField/RadioField.js +18 -15
- package/es/form/fields/SelectField/SelectField.js +14 -14
- package/es/form/fields/TagsMultiSelect/TagsMultiSelect.js +15 -11
- package/es/form/fields/TagsMultiSelectField/TagsMultiSelectField.js +11 -11
- package/es/form/fields/TextBoxField/TextBoxField.js +14 -14
- package/es/form/fields/TextEditorField/TextEditorField.js +11 -10
- package/es/form/fields/TextEditorWrapper/TextEditorWrapper.js +11 -10
- package/es/form/fields/TextareaField/TextareaField.js +14 -13
- package/es/layout/SubtabLayout/SubtabLayout.js +4 -6
- package/es/list/ListLayout/ListLayout.js +4 -5
- package/es/list/SecondaryText/AccountName.js +12 -12
- package/es/list/SecondaryText/ContactName.js +8 -9
- package/es/list/SecondaryText/Email.js +8 -8
- package/es/list/SecondaryText/PhoneNumber.js +8 -8
- package/es/list/SecondaryText/SecondaryText.js +4 -5
- package/es/list/SecondaryText/TicketId.js +7 -7
- package/es/list/Subject/Subject.js +7 -7
- package/es/list/status/StatusDropdown/StatusDropdown.js +30 -115
- package/es/list/status/StatusDropdown/StatusDropdown.module.css +1 -10
- package/es/list/status/StatusDropdown/props/defaultProps.js +2 -1
- package/es/list/status/StatusDropdown/props/propTypes.js +1 -1
- package/es/list/status/StatusListItem/StatusListItem.js +5 -5
- package/es/lookup/Lookup/Lookup.js +4 -5
- package/es/lookup/header/Search/Search.js +5 -3
- package/es/v1/Drawer/Drawer.js +4 -5
- package/es/v1/ExternalLink/ExternalLink.js +4 -5
- package/es/v1/FlipCard/FlipCard.js +14 -12
- package/es/v1/GlobalNotification/GlobalNotification.js +6 -7
- package/es/v1/IconButton/IconButton.js +4 -5
- package/es/v1/Link/Link.js +8 -10
- package/es/v1/Message/Message.js +4 -5
- package/es/v1/ToastMessage/ToastMessage.js +2 -4
- package/es/v1/actions/AutoClose.js +2 -1
- package/es/v1/alert/AlertLookup/AlertLookup.js +15 -15
- package/es/v1/avatar/AvatarClose/AvatarClose.js +7 -7
- package/es/v1/avatar/AvatarCollision/AvatarCollision.js +7 -7
- package/es/v1/avatar/AvatarIcon/AvatarIcon.js +4 -5
- package/es/v1/avatar/AvatarStatus/AvatarStatus.js +7 -8
- package/es/v1/avatar/AvatarThread/AvatarThread.js +7 -7
- package/es/v1/avatar/AvatarUser/AvatarUser.js +10 -9
- package/es/v1/avatar/AvatarWithTeam/AvatarWithTeam.js +17 -14
- package/es/v1/dropdown/ToggleDropDown/ToggleDropDown.js +28 -24
- package/es/v1/form/fields/CheckBoxField/CheckBoxField.js +15 -13
- package/es/v1/form/fields/CurrencyField/CurrencyField.js +14 -12
- package/es/v1/form/fields/DateField/DateField.js +14 -14
- package/es/v1/form/fields/MultiSelectField/MultiSelectField.js +13 -12
- package/es/v1/form/fields/PhoneField/PhoneField.js +7 -7
- package/es/v1/form/fields/RadioField/RadioField.js +18 -16
- package/es/v1/form/fields/SelectField/SelectField.js +14 -14
- package/es/v1/form/fields/TagsMultiSelect/TagsMultiSelect.js +15 -11
- package/es/v1/form/fields/TagsMultiSelectField/TagsMultiSelectField.js +11 -11
- package/es/v1/form/fields/TextBoxField/TextBoxField.js +14 -14
- package/es/v1/form/fields/TextEditorField/TextEditorField.js +11 -10
- package/es/v1/form/fields/TextEditorWrapper/TextEditorWrapper.js +11 -10
- package/es/v1/form/fields/TextareaField/TextareaField.js +14 -13
- package/es/v1/layout/SubtabLayout/SubtabLayout.js +4 -6
- package/es/v1/list/ListLayout/ListLayout.js +4 -5
- package/es/v1/list/SecondaryText/AccountName.js +12 -12
- package/es/v1/list/SecondaryText/ContactName.js +8 -9
- package/es/v1/list/SecondaryText/Email.js +8 -8
- package/es/v1/list/SecondaryText/PhoneNumber.js +8 -8
- package/es/v1/list/SecondaryText/SecondaryText.js +4 -5
- package/es/v1/list/SecondaryText/TicketId.js +7 -7
- package/es/v1/list/Subject/Subject.js +7 -7
- package/es/v1/list/status/StatusDropdown/StatusDropdown.js +32 -106
- package/es/v1/list/status/StatusDropdown/props/defaultProps.js +2 -1
- package/es/v1/list/status/StatusDropdown/props/propTypes.js +1 -1
- package/es/v1/list/status/StatusListItem/StatusListItem.js +5 -5
- package/es/v1/lookup/Lookup/Lookup.js +4 -5
- package/es/v1/lookup/header/Search/Search.js +5 -3
- package/es/v1/notification/DesktopNotification/DesktopNotification.js +6 -7
- package/es/version2/GlobalNotification/GlobalNotification.js +6 -7
- package/es/version2/lookup/AlertLookup/AlertLookup.js +15 -15
- package/es/version2/notification/DesktopNotification/DesktopNotification.js +6 -7
- package/lib/form/fields/TagsMultiSelect/TagsMultiSelect.js +2 -1
- package/lib/list/status/StatusDropdown/StatusDropdown.js +77 -161
- package/lib/list/status/StatusDropdown/StatusDropdown.module.css +1 -10
- package/lib/list/status/StatusDropdown/props/defaultProps.js +2 -1
- package/lib/list/status/StatusDropdown/props/propTypes.js +1 -1
- package/lib/v1/form/fields/TagsMultiSelect/TagsMultiSelect.js +2 -1
- package/lib/v1/list/status/StatusDropdown/StatusDropdown.js +31 -103
- package/lib/v1/list/status/StatusDropdown/props/defaultProps.js +2 -1
- package/lib/v1/list/status/StatusDropdown/props/propTypes.js +1 -1
- package/package.json +3 -3
- package/result.json +1 -1
|
@@ -1,5 +1,3 @@
|
|
|
1
|
-
function _extends() { _extends = Object.assign ? Object.assign.bind() : 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
|
-
|
|
3
1
|
import React, { Component } from 'react';
|
|
4
2
|
import { ContactName_defaultProps } from './props/defaultProps';
|
|
5
3
|
import { ContactName_propTypes } from './props/propTypes';
|
|
@@ -54,22 +52,23 @@ export default class ContactName extends Component {
|
|
|
54
52
|
iconClass: style.icon
|
|
55
53
|
})), /*#__PURE__*/React.createElement(Box, {
|
|
56
54
|
flexible: true
|
|
57
|
-
}, isLink ? /*#__PURE__*/React.createElement(Link,
|
|
55
|
+
}, isLink ? /*#__PURE__*/React.createElement(Link, {
|
|
58
56
|
urlName: urlName,
|
|
59
57
|
href: href,
|
|
60
58
|
urlData: urlData,
|
|
61
59
|
onClick: onClick,
|
|
62
60
|
title: dataTitle,
|
|
63
61
|
dataId: `${dataId}_link`,
|
|
64
|
-
className: style.link
|
|
65
|
-
|
|
62
|
+
className: style.link,
|
|
63
|
+
...LinkProps,
|
|
66
64
|
ariaLabel: `Contact Name ${text}`
|
|
67
|
-
}
|
|
65
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
68
66
|
className: `${style.textStyle} ${style[`font_${fontWeight}`]} ${className ? className : ''}`
|
|
69
|
-
}, text)) : /*#__PURE__*/React.createElement("div",
|
|
67
|
+
}, text)) : /*#__PURE__*/React.createElement("div", {
|
|
70
68
|
className: `${style.secondaryText} ${style[`font_${fontWeight}`]} ${className ? className : ''} ${notAccessible ? style.disable : ''}`,
|
|
71
|
-
"data-title": dataTitle
|
|
72
|
-
|
|
69
|
+
"data-title": dataTitle,
|
|
70
|
+
...TextProps
|
|
71
|
+
}, text)), sentimentType && /*#__PURE__*/React.createElement(Box, null, /*#__PURE__*/React.createElement(SentimentStatus, {
|
|
73
72
|
type: sentimentType,
|
|
74
73
|
dataTitle: sentimentDataTitle
|
|
75
74
|
})));
|
|
@@ -1,5 +1,3 @@
|
|
|
1
|
-
function _extends() { _extends = Object.assign ? Object.assign.bind() : 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
|
-
|
|
3
1
|
/* eslint-disable react/forbid-component-props */
|
|
4
2
|
|
|
5
3
|
/**** Libraries ****/
|
|
@@ -30,19 +28,21 @@ export default class Email extends Component {
|
|
|
30
28
|
LinkProps = {},
|
|
31
29
|
TextProps = {}
|
|
32
30
|
} = customProps;
|
|
33
|
-
return /*#__PURE__*/React.createElement(React.Fragment, null, isLink ? /*#__PURE__*/React.createElement(Link,
|
|
31
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, isLink ? /*#__PURE__*/React.createElement(Link, {
|
|
34
32
|
href: href,
|
|
35
33
|
title: title,
|
|
36
34
|
urlData: urlData,
|
|
37
35
|
urlName: urlName,
|
|
38
36
|
target: target,
|
|
39
|
-
className: style.link
|
|
40
|
-
|
|
37
|
+
className: style.link,
|
|
38
|
+
...LinkProps
|
|
39
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
41
40
|
className: `${style.textStyle} ${style[`font_${fontWeight}`]} ${className ? className : ''}`
|
|
42
|
-
}, text)) : /*#__PURE__*/React.createElement("div",
|
|
41
|
+
}, text)) : /*#__PURE__*/React.createElement("div", {
|
|
43
42
|
className: `${style.secondaryText} ${style[`font_${fontWeight}`]} ${className ? className : ''}`,
|
|
44
|
-
"data-title": title
|
|
45
|
-
|
|
43
|
+
"data-title": title,
|
|
44
|
+
...TextProps
|
|
45
|
+
}, text));
|
|
46
46
|
}
|
|
47
47
|
|
|
48
48
|
}
|
|
@@ -1,5 +1,3 @@
|
|
|
1
|
-
function _extends() { _extends = Object.assign ? Object.assign.bind() : 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
|
-
|
|
3
1
|
/* eslint-disable react/forbid-component-props */
|
|
4
2
|
|
|
5
3
|
/**** Libraries ****/
|
|
@@ -32,7 +30,7 @@ export default class PhoneNumber extends Component {
|
|
|
32
30
|
LinkProps = {},
|
|
33
31
|
TextProps = {}
|
|
34
32
|
} = customProps;
|
|
35
|
-
return /*#__PURE__*/React.createElement(React.Fragment, null, isLink ? /*#__PURE__*/React.createElement(Link,
|
|
33
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, isLink ? /*#__PURE__*/React.createElement(Link, {
|
|
36
34
|
href: href,
|
|
37
35
|
title: title,
|
|
38
36
|
urlData: urlData,
|
|
@@ -40,13 +38,15 @@ export default class PhoneNumber extends Component {
|
|
|
40
38
|
dataId: dataId,
|
|
41
39
|
target: target,
|
|
42
40
|
hasReload: hasReload,
|
|
43
|
-
className: style.link
|
|
44
|
-
|
|
41
|
+
className: style.link,
|
|
42
|
+
...LinkProps
|
|
43
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
45
44
|
className: `${style.phoneNumber} ${style[`font_${fontWeight}`]} ${className ? className : ''}`
|
|
46
|
-
}, text)) : /*#__PURE__*/React.createElement("div",
|
|
45
|
+
}, text)) : /*#__PURE__*/React.createElement("div", {
|
|
47
46
|
className: `${style.secondaryText} ${style[`font_${fontWeight}`]} ${className ? className : ''}`,
|
|
48
|
-
"data-title": title
|
|
49
|
-
|
|
47
|
+
"data-title": title,
|
|
48
|
+
...TextProps
|
|
49
|
+
}, text));
|
|
50
50
|
}
|
|
51
51
|
|
|
52
52
|
}
|
|
@@ -1,5 +1,3 @@
|
|
|
1
|
-
function _extends() { _extends = Object.assign ? Object.assign.bind() : 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
|
-
|
|
3
1
|
import React, { Component } from 'react';
|
|
4
2
|
import { SecondaryText_defaultProps } from './props/defaultProps';
|
|
5
3
|
import { SecondaryText_propTypes } from './props/propTypes';
|
|
@@ -21,13 +19,14 @@ export default class SecondaryText extends Component {
|
|
|
21
19
|
let {
|
|
22
20
|
SecondaryTextProps
|
|
23
21
|
} = customProps;
|
|
24
|
-
return /*#__PURE__*/React.createElement("div",
|
|
22
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
25
23
|
className: `${style.secondaryText} ${className ? className : ''}`,
|
|
26
24
|
"data-title": dataTitle,
|
|
27
25
|
"data-id": dataId,
|
|
28
26
|
"data-test-id": dataId,
|
|
29
|
-
onClick: onClick
|
|
30
|
-
|
|
27
|
+
onClick: onClick,
|
|
28
|
+
...SecondaryTextProps
|
|
29
|
+
}, text);
|
|
31
30
|
}
|
|
32
31
|
|
|
33
32
|
}
|
|
@@ -1,5 +1,3 @@
|
|
|
1
|
-
function _extends() { _extends = Object.assign ? Object.assign.bind() : 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
|
-
|
|
3
1
|
import React, { Component } from 'react';
|
|
4
2
|
import { TicketId_defaultProps } from './props/defaultProps';
|
|
5
3
|
import { TicketId_propTypes } from './props/propTypes';
|
|
@@ -28,19 +26,21 @@ export default class TicketId extends Component {
|
|
|
28
26
|
LinkProps = {},
|
|
29
27
|
TicketIdProps = {}
|
|
30
28
|
} = customProps;
|
|
31
|
-
return /*#__PURE__*/React.createElement("div",
|
|
29
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
32
30
|
className: `${style.ticketId} ${isLink ? style.ticketIdLink : ''} ${className ? className : ''}`,
|
|
33
31
|
"data-id": dataId,
|
|
34
32
|
"data-test-id": dataId,
|
|
35
33
|
"data-title": dataTitle,
|
|
36
|
-
onClick: !isLink && onClick
|
|
37
|
-
|
|
34
|
+
onClick: !isLink && onClick,
|
|
35
|
+
...TicketIdProps
|
|
36
|
+
}, isLink ? /*#__PURE__*/React.createElement(Link, {
|
|
38
37
|
urlName: urlName,
|
|
39
38
|
urlData: urlData,
|
|
40
39
|
href: url,
|
|
41
40
|
target: target,
|
|
42
|
-
onClick: onClick
|
|
43
|
-
|
|
41
|
+
onClick: onClick,
|
|
42
|
+
...LinkProps
|
|
43
|
+
}, text) : text);
|
|
44
44
|
}
|
|
45
45
|
|
|
46
46
|
}
|
|
@@ -1,5 +1,3 @@
|
|
|
1
|
-
function _extends() { _extends = Object.assign ? Object.assign.bind() : 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
|
-
|
|
3
1
|
import React, { Component } from 'react';
|
|
4
2
|
import { defaultProps } from './props/defaultProps';
|
|
5
3
|
import { propTypes } from './props/propTypes';
|
|
@@ -30,7 +28,7 @@ export default class Subject extends Component {
|
|
|
30
28
|
LinkProps = {},
|
|
31
29
|
TextProps = {}
|
|
32
30
|
} = customProps;
|
|
33
|
-
return /*#__PURE__*/React.createElement(React.Fragment, null, isLink ? /*#__PURE__*/React.createElement(Link,
|
|
31
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, isLink ? /*#__PURE__*/React.createElement(Link, {
|
|
34
32
|
urlName: urlName,
|
|
35
33
|
href: href,
|
|
36
34
|
urlData: urlData,
|
|
@@ -38,13 +36,15 @@ export default class Subject extends Component {
|
|
|
38
36
|
className: `${style.subject} ${isDotted ? style.dotted : ''} ${className} ${style[`font_${fontWeight}`]} ${style.cursorPointer}`,
|
|
39
37
|
dataId: dataId,
|
|
40
38
|
title: text,
|
|
41
|
-
target: target
|
|
42
|
-
|
|
39
|
+
target: target,
|
|
40
|
+
...LinkProps
|
|
41
|
+
}, children ? children : text) : /*#__PURE__*/React.createElement("span", {
|
|
43
42
|
className: `${style.subject} ${isDotted ? style.dotted : ''} ${className} ${style[`font_${fontWeight}`]}`,
|
|
44
43
|
"data-title": text,
|
|
45
44
|
"data-id": dataId,
|
|
46
|
-
"data-test-id": dataId
|
|
47
|
-
|
|
45
|
+
"data-test-id": dataId,
|
|
46
|
+
...TextProps
|
|
47
|
+
}, text));
|
|
48
48
|
}
|
|
49
49
|
|
|
50
50
|
}
|
|
@@ -7,9 +7,7 @@ import { Box, Container } from '@zohodesk/components/lib/Layout';
|
|
|
7
7
|
import DropDownHeading from '@zohodesk/components/lib/DropDown/DropDownHeading';
|
|
8
8
|
import TextBoxIcon from '@zohodesk/components/lib/TextBoxIcon/TextBoxIcon';
|
|
9
9
|
import Loader from '@zohodesk/svg/lib/Loader/Loader';
|
|
10
|
-
import EmptySearch from '@zohodesk/svg/lib/emptystate/version3/EmptySearch';
|
|
11
|
-
// import TextBox from '@zohodesk/components/lib/TextBox/TextBox';
|
|
12
|
-
|
|
10
|
+
import EmptySearch from '@zohodesk/svg/lib/emptystate/version3/EmptySearch';
|
|
13
11
|
import CommonEmptyState from '../../../emptystate/CommonEmptyState/CommonEmptyState';
|
|
14
12
|
import StatusListItem from '../StatusListItem/StatusListItem';
|
|
15
13
|
import commonStyle from '@zohodesk/components/lib/common/common.module.css';
|
|
@@ -23,20 +21,13 @@ export class StatusDropdown extends React.Component {
|
|
|
23
21
|
super(props);
|
|
24
22
|
this.state = {
|
|
25
23
|
searchString: '',
|
|
26
|
-
// selectedIndex: 0,
|
|
27
24
|
options: props.options
|
|
28
25
|
};
|
|
29
|
-
this.handleChange = this.handleChange.bind(this);
|
|
30
|
-
|
|
26
|
+
this.handleChange = this.handleChange.bind(this);
|
|
31
27
|
this.onSelect = this.onSelect.bind(this);
|
|
32
28
|
this.handleTogglePopup = this.handleTogglePopup.bind(this);
|
|
33
29
|
this.onSearchClear = this.onSearchClear.bind(this);
|
|
34
|
-
this.searchList = this.searchList.bind(this);
|
|
35
|
-
// this.handleMouseEnter = this.handleMouseEnter.bind(this);
|
|
36
|
-
// this.searchInputRef = this.searchInputRef.bind(this);
|
|
37
|
-
// this.itemRef = this.itemRef.bind(this);
|
|
38
|
-
// this.inputRef = this.inputRef.bind(this);
|
|
39
|
-
|
|
30
|
+
this.searchList = this.searchList.bind(this);
|
|
40
31
|
this.handleScroll = this.handleScroll.bind(this);
|
|
41
32
|
this.emptySearchSVG = this.emptySearchSVG.bind(this);
|
|
42
33
|
this.getAriaId = getUniqueId(this);
|
|
@@ -46,16 +37,7 @@ export class StatusDropdown extends React.Component {
|
|
|
46
37
|
return /*#__PURE__*/React.createElement(EmptySearch, {
|
|
47
38
|
size: "small"
|
|
48
39
|
});
|
|
49
|
-
}
|
|
50
|
-
// this.hiddenInput = el;
|
|
51
|
-
// }
|
|
52
|
-
// itemRef(ele, index, id) {
|
|
53
|
-
// this[`suggestion_${id}`] = ele;
|
|
54
|
-
// }
|
|
55
|
-
// searchInputRef(el) {
|
|
56
|
-
// this.searchInput = el;
|
|
57
|
-
// }
|
|
58
|
-
|
|
40
|
+
}
|
|
59
41
|
|
|
60
42
|
handleTogglePopup(e) {
|
|
61
43
|
let {
|
|
@@ -68,13 +50,7 @@ export class StatusDropdown extends React.Component {
|
|
|
68
50
|
!isPopupOpen && onSelectLabel && onSelectLabel(e);
|
|
69
51
|
onTogglePopup && onTogglePopup(isPopupOpen);
|
|
70
52
|
togglePopup(e, boxPosition);
|
|
71
|
-
}
|
|
72
|
-
// let { isPopupOpen } = this.props;
|
|
73
|
-
// if (isPopupOpen) {
|
|
74
|
-
// this.optionsContainer = el;
|
|
75
|
-
// }
|
|
76
|
-
// }
|
|
77
|
-
|
|
53
|
+
}
|
|
78
54
|
|
|
79
55
|
componentWillReceiveProps(nextProps) {
|
|
80
56
|
if (nextProps.options.length != this.props.options.length) {
|
|
@@ -97,68 +73,10 @@ export class StatusDropdown extends React.Component {
|
|
|
97
73
|
}
|
|
98
74
|
|
|
99
75
|
componentDidUpdate(prevProps) {
|
|
100
|
-
// let { isPopupOpen, isSearch, idName } = this.props;
|
|
101
|
-
// let { selectedIndex, options } = this.state;
|
|
102
|
-
// if (prevProps.isPopupOpen != isPopupOpen) {
|
|
103
|
-
// setTimeout(() => {
|
|
104
|
-
// isPopupOpen && isSearch
|
|
105
|
-
// ? this.searchInput && this.searchInput.focus()
|
|
106
|
-
// : this.hiddenInput && this.hiddenInput.focus();
|
|
107
|
-
// }, 10);
|
|
108
|
-
// }
|
|
109
|
-
// let mergeOptions = options;
|
|
110
|
-
// let option = mergeOptions[selectedIndex];
|
|
111
|
-
// let id = (option && option[idName]) || {};
|
|
112
|
-
// let selSuggestion = this[`suggestion_${id}`];
|
|
113
|
-
// if (isPopupOpen) {
|
|
114
|
-
// this.optionsContainer && scrollTo(this.optionsContainer, selSuggestion);
|
|
115
|
-
// }
|
|
116
76
|
if (!prevProps.isPopupOpen && this.props.isPopupOpen) {
|
|
117
77
|
this.onSearchClear();
|
|
118
78
|
}
|
|
119
|
-
}
|
|
120
|
-
// let { keyCode } = e;
|
|
121
|
-
// let { selectedIndex, options } = this.state;
|
|
122
|
-
// let totalIndex = options.length;
|
|
123
|
-
// let { togglePopup, onClick, boxPosition, isPopupReady, isNextOptions, getNextOptions, onTogglePopup, isPopupOpen } =
|
|
124
|
-
// this.props;
|
|
125
|
-
// if (isPopupReady && (keyCode === 38 || keyCode === 40) && e.preventDefault) {
|
|
126
|
-
// e.preventDefault(); //prevent body scroll
|
|
127
|
-
// }
|
|
128
|
-
// if (isPopupReady) {
|
|
129
|
-
// switch (keyCode) {
|
|
130
|
-
// case 40:
|
|
131
|
-
// if (selectedIndex === totalIndex - 1) {
|
|
132
|
-
// this.setState({ selectedIndex: 0 });
|
|
133
|
-
// } else {
|
|
134
|
-
// if (selectedIndex === totalIndex - 3) {
|
|
135
|
-
// isNextOptions && getNextOptions && getNextOptions();
|
|
136
|
-
// }
|
|
137
|
-
// this.setState({ selectedIndex: selectedIndex + 1 });
|
|
138
|
-
// }
|
|
139
|
-
// break;
|
|
140
|
-
// case 38:
|
|
141
|
-
// if (selectedIndex === 0) {
|
|
142
|
-
// this.setState({ selectedIndex: totalIndex - 1 });
|
|
143
|
-
// } else {
|
|
144
|
-
// this.setState({ selectedIndex: selectedIndex - 1 });
|
|
145
|
-
// }
|
|
146
|
-
// break;
|
|
147
|
-
// case 13:
|
|
148
|
-
// onClick && onClick(options[selectedIndex].name, e);
|
|
149
|
-
// onTogglePopup && onTogglePopup(isPopupOpen);
|
|
150
|
-
// togglePopup(e, boxPosition);
|
|
151
|
-
// break;
|
|
152
|
-
// default:
|
|
153
|
-
// break;
|
|
154
|
-
// }
|
|
155
|
-
// } else {
|
|
156
|
-
// if (keyCode === 13 || keyCode === 40) {
|
|
157
|
-
// togglePopup(e, boxPosition);
|
|
158
|
-
// }
|
|
159
|
-
// }
|
|
160
|
-
// }
|
|
161
|
-
|
|
79
|
+
}
|
|
162
80
|
|
|
163
81
|
searchList(value) {
|
|
164
82
|
let {
|
|
@@ -173,7 +91,6 @@ export class StatusDropdown extends React.Component {
|
|
|
173
91
|
let foptions = this.searchList(value);
|
|
174
92
|
this.setState({
|
|
175
93
|
searchString: value,
|
|
176
|
-
// selectedIndex: -1,
|
|
177
94
|
options: foptions
|
|
178
95
|
});
|
|
179
96
|
}
|
|
@@ -184,21 +101,15 @@ export class StatusDropdown extends React.Component {
|
|
|
184
101
|
searchString: '',
|
|
185
102
|
options: foptions
|
|
186
103
|
});
|
|
187
|
-
}
|
|
188
|
-
// this.setState({
|
|
189
|
-
// selectedIndex: index
|
|
190
|
-
// });
|
|
191
|
-
// }
|
|
192
|
-
|
|
104
|
+
}
|
|
193
105
|
|
|
194
106
|
handleScroll(e) {
|
|
195
107
|
const {
|
|
196
|
-
isNextOptions,
|
|
197
108
|
getNextOptions
|
|
198
109
|
} = this.props;
|
|
199
110
|
|
|
200
111
|
if (e.target.scrollTop + e.target.offsetHeight > e.target.scrollHeight - 1) {
|
|
201
|
-
|
|
112
|
+
getNextOptions && getNextOptions(e);
|
|
202
113
|
}
|
|
203
114
|
}
|
|
204
115
|
|
|
@@ -259,6 +170,8 @@ export class StatusDropdown extends React.Component {
|
|
|
259
170
|
needExternalPopupState = false,
|
|
260
171
|
isPopupActive = false,
|
|
261
172
|
needMultiLineText,
|
|
173
|
+
isFetchingOptions,
|
|
174
|
+
getNextOptions,
|
|
262
175
|
a11y = {}
|
|
263
176
|
} = this.props;
|
|
264
177
|
const {
|
|
@@ -328,7 +241,14 @@ export class StatusDropdown extends React.Component {
|
|
|
328
241
|
needResponsive: needResponsive,
|
|
329
242
|
isResponsivePadding: true,
|
|
330
243
|
needFocusScope: true,
|
|
331
|
-
onClose: this.handleTogglePopup
|
|
244
|
+
onClose: this.handleTogglePopup,
|
|
245
|
+
customProps: {
|
|
246
|
+
focusScopeProps: {
|
|
247
|
+
loadNextOptions: getNextOptions,
|
|
248
|
+
searchValue: searchString,
|
|
249
|
+
isFetchingOptions: isFetchingOptions
|
|
250
|
+
}
|
|
251
|
+
}
|
|
332
252
|
}, /*#__PURE__*/React.createElement(React.Fragment, null, isSearch ? /*#__PURE__*/React.createElement(Box, {
|
|
333
253
|
className: style.search
|
|
334
254
|
}, /*#__PURE__*/React.createElement(TextBoxIcon, {
|
|
@@ -336,9 +256,7 @@ export class StatusDropdown extends React.Component {
|
|
|
336
256
|
onChange: this.handleChange,
|
|
337
257
|
value: searchString,
|
|
338
258
|
onClear: this.onSearchClear,
|
|
339
|
-
size: searchBoxSize
|
|
340
|
-
// onKeyDown={this.handleKeyDown}
|
|
341
|
-
,
|
|
259
|
+
size: searchBoxSize,
|
|
342
260
|
customProps: {
|
|
343
261
|
TextBoxProps: {
|
|
344
262
|
'data-a11y-autofocus': true
|
|
@@ -365,30 +283,24 @@ export class StatusDropdown extends React.Component {
|
|
|
365
283
|
shrink: true,
|
|
366
284
|
dataId: `${dataId}_list`,
|
|
367
285
|
preventParentScroll: "vertical",
|
|
368
|
-
className: `${tabletMode ? style.responsivemaxHgt : style.maxHgt}
|
|
369
|
-
,
|
|
286
|
+
className: `${tabletMode ? style.responsivemaxHgt : style.maxHgt}`,
|
|
370
287
|
onScroll: this.handleScroll,
|
|
371
288
|
role: isSearch ? 'listbox' : 'menu',
|
|
372
289
|
tabindex: "-1",
|
|
373
|
-
|
|
290
|
+
isScrollAttribute: true
|
|
374
291
|
}, options.length != 0 && isDataLoaded ? /*#__PURE__*/React.createElement(React.Fragment, null, options.map((item, i) => {
|
|
375
292
|
const listItemText = item[keyName];
|
|
376
|
-
;
|
|
377
293
|
const isActive = value === listItemText;
|
|
378
|
-
return /*#__PURE__*/React.createElement(
|
|
379
|
-
key: i
|
|
380
|
-
}, /*#__PURE__*/React.createElement(StatusListItem, {
|
|
294
|
+
return /*#__PURE__*/React.createElement(StatusListItem, {
|
|
295
|
+
key: i,
|
|
381
296
|
dataId: `dataid_${i}`,
|
|
382
297
|
value: listItemText,
|
|
383
298
|
id: item[idName],
|
|
384
299
|
active: isActive,
|
|
385
300
|
onClick: this.onSelect.bind(this, item),
|
|
386
|
-
index: i
|
|
387
|
-
,
|
|
301
|
+
index: i,
|
|
388
302
|
needTick: needTick,
|
|
389
|
-
needBorder: false
|
|
390
|
-
// getRef={this.itemRef}
|
|
391
|
-
,
|
|
303
|
+
needBorder: false,
|
|
392
304
|
bulletColor: item[statusColor],
|
|
393
305
|
title: listItemText,
|
|
394
306
|
needMultiLineText: needMultiLineText,
|
|
@@ -398,8 +310,11 @@ export class StatusDropdown extends React.Component {
|
|
|
398
310
|
ariaSelected: isActive,
|
|
399
311
|
ariaLabel: listItemText
|
|
400
312
|
}
|
|
401
|
-
})
|
|
402
|
-
})
|
|
313
|
+
});
|
|
314
|
+
}), isFetchingOptions && /*#__PURE__*/React.createElement(Container, {
|
|
315
|
+
isCover: false,
|
|
316
|
+
align: "both"
|
|
317
|
+
}, /*#__PURE__*/React.createElement(Loader, null))) : isDataLoaded ? /*#__PURE__*/React.createElement(CommonEmptyState, {
|
|
403
318
|
className: style.svgWrapper,
|
|
404
319
|
title: searchErrorText || 'No results',
|
|
405
320
|
description: searchEmptyHint,
|
|
@@ -80,13 +80,4 @@
|
|
|
80
80
|
height: var(--zd_size1) ;
|
|
81
81
|
border-bottom: 1px solid var(--zdt_statusdropdown_line_border);
|
|
82
82
|
margin: var(--zd_size9) 0 var(--zd_size10) ;
|
|
83
|
-
}
|
|
84
|
-
/* .hiddenInput {
|
|
85
|
-
width: 0;
|
|
86
|
-
height: 0;
|
|
87
|
-
opacity: 0;
|
|
88
|
-
}
|
|
89
|
-
.hiddenInput > input {
|
|
90
|
-
width: 100%;
|
|
91
|
-
padding: 0;
|
|
92
|
-
} */
|
|
83
|
+
}
|
|
@@ -19,7 +19,7 @@ export const propTypes = {
|
|
|
19
19
|
isDataLoaded: PropTypes.bool,
|
|
20
20
|
isDisabled: PropTypes.bool,
|
|
21
21
|
isEditable: PropTypes.bool,
|
|
22
|
-
|
|
22
|
+
isFetchingOptions: PropTypes.bool,
|
|
23
23
|
isPopupActive: PropTypes.bool,
|
|
24
24
|
isPopupOpen: PropTypes.bool,
|
|
25
25
|
isPopupReady: PropTypes.bool,
|
|
@@ -1,5 +1,3 @@
|
|
|
1
|
-
function _extends() { _extends = Object.assign ? Object.assign.bind() : 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
|
-
|
|
3
1
|
/**** Libraries ****/
|
|
4
2
|
import React from 'react';
|
|
5
3
|
import { defaultProps } from './props/defaultProps';
|
|
@@ -86,7 +84,7 @@ export default class StatusListItem extends React.Component {
|
|
|
86
84
|
options.target = `_${target}`;
|
|
87
85
|
}
|
|
88
86
|
|
|
89
|
-
return /*#__PURE__*/React.createElement(Container,
|
|
87
|
+
return /*#__PURE__*/React.createElement(Container, {
|
|
90
88
|
role: role,
|
|
91
89
|
"aria-selected": ariaSelected,
|
|
92
90
|
"aria-label": ariaLabel,
|
|
@@ -101,8 +99,10 @@ export default class StatusListItem extends React.Component {
|
|
|
101
99
|
eleRef: this.getRef,
|
|
102
100
|
tagName: isLink ? 'a' : 'li',
|
|
103
101
|
"data-title": isDisabled ? disableTitle : null,
|
|
104
|
-
tabindex: isDisabled ? '-1' : '0'
|
|
105
|
-
|
|
102
|
+
tabindex: isDisabled ? '-1' : '0',
|
|
103
|
+
...options,
|
|
104
|
+
...a11y
|
|
105
|
+
}, /*#__PURE__*/React.createElement(Box, {
|
|
106
106
|
className: `${style.statusType} ${style[bulletColor]}`
|
|
107
107
|
}), /*#__PURE__*/React.createElement(Box, {
|
|
108
108
|
flexible: true,
|
|
@@ -1,5 +1,3 @@
|
|
|
1
|
-
function _extends() { _extends = Object.assign ? Object.assign.bind() : 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
|
-
|
|
3
1
|
/*** Libraries ***/
|
|
4
2
|
import React, { Component } from 'react';
|
|
5
3
|
import { defaultProps } from './props/defaultProps';
|
|
@@ -78,7 +76,7 @@ export default class Lookup extends Component {
|
|
|
78
76
|
needFocusLoop = true,
|
|
79
77
|
needEnterAction = true
|
|
80
78
|
} = focusScopeProps;
|
|
81
|
-
const content = /*#__PURE__*/React.createElement("div",
|
|
79
|
+
const content = /*#__PURE__*/React.createElement("div", {
|
|
82
80
|
ref: this.createRef,
|
|
83
81
|
tabIndex: "-1",
|
|
84
82
|
"data-a11y-need-focus-style": "false",
|
|
@@ -90,8 +88,9 @@ export default class Lookup extends Component {
|
|
|
90
88
|
id: htmlId,
|
|
91
89
|
className: `${style.box} ${style[`${size}Size`]} ${lookupClass ? lookupClass : ''}`,
|
|
92
90
|
"data-id": dataId,
|
|
93
|
-
"data-test-id": dataId
|
|
94
|
-
|
|
91
|
+
"data-test-id": dataId,
|
|
92
|
+
...a11yAttributes
|
|
93
|
+
}, /*#__PURE__*/React.createElement(Container, {
|
|
95
94
|
"data-drag-container": "true",
|
|
96
95
|
isCover: false,
|
|
97
96
|
className: isMinHeight ? `${style.wrapper}` : `${style.coverwrap}`
|
|
@@ -1,5 +1,3 @@
|
|
|
1
|
-
function _extends() { _extends = Object.assign ? Object.assign.bind() : 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
|
-
|
|
3
1
|
/* eslint-disable react/forbid-component-props */
|
|
4
2
|
|
|
5
3
|
/*** Libraries ***/
|
|
@@ -100,7 +98,11 @@ export default class Search extends Component {
|
|
|
100
98
|
selectedId: selectedId,
|
|
101
99
|
onDropDownOpen: this.handleDropDownOpen,
|
|
102
100
|
onDropDownClose: this.handleDropDownClose
|
|
103
|
-
}, /*#__PURE__*/React.createElement(SearchUI,
|
|
101
|
+
}, /*#__PURE__*/React.createElement(SearchUI, { ...this.props,
|
|
102
|
+
...searchUIExtraProps
|
|
103
|
+
})) : /*#__PURE__*/React.createElement(SearchUI, { ...this.props,
|
|
104
|
+
...searchUIExtraProps
|
|
105
|
+
});
|
|
104
106
|
}
|
|
105
107
|
|
|
106
108
|
}
|
package/es/v1/Drawer/Drawer.js
CHANGED
|
@@ -1,5 +1,3 @@
|
|
|
1
|
-
function _extends() { _extends = Object.assign ? Object.assign.bind() : 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
|
-
|
|
3
1
|
import React, { useRef } from 'react';
|
|
4
2
|
import { Header_defaultProps, Footer_defaultProps, Drawer_defaultProps } from './props/defaultProps';
|
|
5
3
|
import { Header_propTypes, Content_propTypes, Footer_propTypes, Drawer_propTypes } from './props/propTypes';
|
|
@@ -161,12 +159,13 @@ export default function Drawer(props) {
|
|
|
161
159
|
|
|
162
160
|
return child;
|
|
163
161
|
});
|
|
164
|
-
let content = /*#__PURE__*/React.createElement(Box,
|
|
162
|
+
let content = /*#__PURE__*/React.createElement(Box, {
|
|
165
163
|
className: `${style.container} ${style.columns} ${style.drawerModal} ${uptoTablet ? style.mbleSize : style[size]}`,
|
|
166
164
|
"data-a11y-need-focus-style": "false",
|
|
167
165
|
tabindex: -1,
|
|
168
|
-
eleRef: contentRef
|
|
169
|
-
|
|
166
|
+
eleRef: contentRef,
|
|
167
|
+
...a11y
|
|
168
|
+
}, /*#__PURE__*/React.createElement(Card, {
|
|
170
169
|
onClick: e => {
|
|
171
170
|
e && e.stopPropagation && e.stopPropagation();
|
|
172
171
|
onBodyClick(e);
|
|
@@ -1,5 +1,3 @@
|
|
|
1
|
-
function _extends() { _extends = Object.assign ? Object.assign.bind() : 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
|
-
|
|
3
1
|
/**** Libraries ****/
|
|
4
2
|
import React from 'react';
|
|
5
3
|
import { defaultProps } from './props/defaultProps';
|
|
@@ -32,7 +30,7 @@ const ExternalLink = props => {
|
|
|
32
30
|
};
|
|
33
31
|
|
|
34
32
|
let urlOutput = href && typeof href !== 'boolean' ? addHttp(String(href)) : 'javascript:void(0);';
|
|
35
|
-
return /*#__PURE__*/React.createElement("a",
|
|
33
|
+
return /*#__PURE__*/React.createElement("a", {
|
|
36
34
|
href: urlOutput,
|
|
37
35
|
target: target,
|
|
38
36
|
className: `${style.link} ${className ? className : ''}`,
|
|
@@ -40,8 +38,9 @@ const ExternalLink = props => {
|
|
|
40
38
|
rel: rel,
|
|
41
39
|
"data-id": dataId,
|
|
42
40
|
"data-test-id": dataId,
|
|
43
|
-
onClick: onClick
|
|
44
|
-
|
|
41
|
+
onClick: onClick,
|
|
42
|
+
...customProps
|
|
43
|
+
}, children);
|
|
45
44
|
};
|
|
46
45
|
|
|
47
46
|
ExternalLink.defaultProps = defaultProps;
|