@zohodesk/dot 1.0.0-temp-171 → 1.0.0-temp-172

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.
Files changed (38) hide show
  1. package/.cli/propValidation_report.html +1 -1
  2. package/coverage/ExternalLink/ExternalLink.js.html +1 -1
  3. package/coverage/ExternalLink/ExternalLink.module.css.html +1 -1
  4. package/coverage/ExternalLink/index.html +1 -1
  5. package/coverage/ExternalLink/props/defaultProps.js.html +1 -1
  6. package/coverage/ExternalLink/props/index.html +1 -1
  7. package/coverage/ExternalLink/props/propTypes.js.html +1 -1
  8. package/coverage/IconButton/IconButton.js.html +1 -1
  9. package/coverage/IconButton/IconButton.module.css.html +1 -1
  10. package/coverage/IconButton/index.html +1 -1
  11. package/coverage/IconButton/props/defaultProps.js.html +1 -1
  12. package/coverage/IconButton/props/index.html +1 -1
  13. package/coverage/IconButton/props/propTypes.js.html +1 -1
  14. package/coverage/Image/Image.js.html +1 -1
  15. package/coverage/Image/Image.module.css.html +1 -1
  16. package/coverage/Image/index.html +1 -1
  17. package/coverage/Image/props/defaultProps.js.html +1 -1
  18. package/coverage/Image/props/index.html +1 -1
  19. package/coverage/Image/props/propTypes.js.html +1 -1
  20. package/coverage/avatar/AvatarWithTeam/AvatarWithTeam.js.html +1 -1
  21. package/coverage/avatar/AvatarWithTeam/AvatarWithTeam.module.css.html +1 -1
  22. package/coverage/avatar/AvatarWithTeam/index.html +1 -1
  23. package/coverage/avatar/AvatarWithTeam/props/defaultProps.js.html +1 -1
  24. package/coverage/avatar/AvatarWithTeam/props/index.html +1 -1
  25. package/coverage/avatar/AvatarWithTeam/props/propTypes.js.html +1 -1
  26. package/coverage/index.html +1 -1
  27. package/es/form/fields/TagsMultiSelect/TagsMultiSelect.js +29 -8
  28. package/es/form/fields/TagsMultiSelect/props/propTypes.js +5 -1
  29. package/es/version2/GlobalNotification/GlobalNotification.js +26 -33
  30. package/es/version2/GlobalNotification/GlobalNotification.module.css +11 -71
  31. package/es/version2/GlobalNotification/props/propTypes.js +4 -9
  32. package/lib/form/fields/TagsMultiSelect/TagsMultiSelect.js +28 -8
  33. package/lib/form/fields/TagsMultiSelect/props/propTypes.js +5 -1
  34. package/lib/version2/GlobalNotification/GlobalNotification.js +36 -64
  35. package/lib/version2/GlobalNotification/GlobalNotification.module.css +11 -71
  36. package/lib/version2/GlobalNotification/props/propTypes.js +4 -9
  37. package/package.json +1 -1
  38. package/result.json +1 -1
@@ -214,7 +214,7 @@ ExternalLink.propTypes = propTypes;
214
214
  <div class='footer quiet pad2 space-top1 center small'>
215
215
  Code coverage generated by
216
216
  <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
217
- at 2023-12-26T09:31:34.235Z
217
+ at 2023-12-27T06:18:05.230Z
218
218
  </div>
219
219
  <script src="../prettify.js"></script>
220
220
  <script>
@@ -79,7 +79,7 @@
79
79
  <div class='footer quiet pad2 space-top1 center small'>
80
80
  Code coverage generated by
81
81
  <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
82
- at 2023-12-26T09:31:34.235Z
82
+ at 2023-12-27T06:18:05.230Z
83
83
  </div>
84
84
  <script src="../prettify.js"></script>
85
85
  <script>
@@ -116,7 +116,7 @@
116
116
  <div class='footer quiet pad2 space-top1 center small'>
117
117
  Code coverage generated by
118
118
  <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
119
- at 2023-12-26T09:31:34.235Z
119
+ at 2023-12-27T06:18:05.230Z
120
120
  </div>
121
121
  <script src="../prettify.js"></script>
122
122
  <script>
@@ -85,7 +85,7 @@
85
85
  <div class='footer quiet pad2 space-top1 center small'>
86
86
  Code coverage generated by
87
87
  <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
88
- at 2023-12-26T09:31:34.235Z
88
+ at 2023-12-27T06:18:05.230Z
89
89
  </div>
90
90
  <script src="../../prettify.js"></script>
91
91
  <script>
@@ -116,7 +116,7 @@
116
116
  <div class='footer quiet pad2 space-top1 center small'>
117
117
  Code coverage generated by
118
118
  <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
119
- at 2023-12-26T09:31:34.235Z
119
+ at 2023-12-27T06:18:05.230Z
120
120
  </div>
121
121
  <script src="../../prettify.js"></script>
122
122
  <script>
@@ -109,7 +109,7 @@ export const propTypes = {
109
109
  <div class='footer quiet pad2 space-top1 center small'>
110
110
  Code coverage generated by
111
111
  <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
112
- at 2023-12-26T09:31:34.235Z
112
+ at 2023-12-27T06:18:05.230Z
113
113
  </div>
114
114
  <script src="../../prettify.js"></script>
115
115
  <script>
@@ -451,7 +451,7 @@ IconButton.defaultProps = defaultProps;
451
451
  <div class='footer quiet pad2 space-top1 center small'>
452
452
  Code coverage generated by
453
453
  <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
454
- at 2023-12-26T09:31:34.235Z
454
+ at 2023-12-27T06:18:05.230Z
455
455
  </div>
456
456
  <script src="../prettify.js"></script>
457
457
  <script>
@@ -139,7 +139,7 @@
139
139
  <div class='footer quiet pad2 space-top1 center small'>
140
140
  Code coverage generated by
141
141
  <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
142
- at 2023-12-26T09:31:34.235Z
142
+ at 2023-12-27T06:18:05.230Z
143
143
  </div>
144
144
  <script src="../prettify.js"></script>
145
145
  <script>
@@ -116,7 +116,7 @@
116
116
  <div class='footer quiet pad2 space-top1 center small'>
117
117
  Code coverage generated by
118
118
  <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
119
- at 2023-12-26T09:31:34.235Z
119
+ at 2023-12-27T06:18:05.230Z
120
120
  </div>
121
121
  <script src="../prettify.js"></script>
122
122
  <script>
@@ -121,7 +121,7 @@
121
121
  <div class='footer quiet pad2 space-top1 center small'>
122
122
  Code coverage generated by
123
123
  <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
124
- at 2023-12-26T09:31:34.235Z
124
+ at 2023-12-27T06:18:05.230Z
125
125
  </div>
126
126
  <script src="../../prettify.js"></script>
127
127
  <script>
@@ -116,7 +116,7 @@
116
116
  <div class='footer quiet pad2 space-top1 center small'>
117
117
  Code coverage generated by
118
118
  <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
119
- at 2023-12-26T09:31:34.235Z
119
+ at 2023-12-27T06:18:05.230Z
120
120
  </div>
121
121
  <script src="../../prettify.js"></script>
122
122
  <script>
@@ -172,7 +172,7 @@ export const propTypes = {
172
172
  <div class='footer quiet pad2 space-top1 center small'>
173
173
  Code coverage generated by
174
174
  <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
175
- at 2023-12-26T09:31:34.235Z
175
+ at 2023-12-27T06:18:05.230Z
176
176
  </div>
177
177
  <script src="../../prettify.js"></script>
178
178
  <script>
@@ -169,7 +169,7 @@ Image.defaultProps = defaultProps;
169
169
  <div class='footer quiet pad2 space-top1 center small'>
170
170
  Code coverage generated by
171
171
  <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
172
- at 2023-12-26T09:31:34.235Z
172
+ at 2023-12-27T06:18:05.230Z
173
173
  </div>
174
174
  <script src="../prettify.js"></script>
175
175
  <script>
@@ -103,7 +103,7 @@
103
103
  <div class='footer quiet pad2 space-top1 center small'>
104
104
  Code coverage generated by
105
105
  <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
106
- at 2023-12-26T09:31:34.235Z
106
+ at 2023-12-27T06:18:05.230Z
107
107
  </div>
108
108
  <script src="../prettify.js"></script>
109
109
  <script>
@@ -116,7 +116,7 @@
116
116
  <div class='footer quiet pad2 space-top1 center small'>
117
117
  Code coverage generated by
118
118
  <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
119
- at 2023-12-26T09:31:34.235Z
119
+ at 2023-12-27T06:18:05.230Z
120
120
  </div>
121
121
  <script src="../prettify.js"></script>
122
122
  <script>
@@ -82,7 +82,7 @@
82
82
  <div class='footer quiet pad2 space-top1 center small'>
83
83
  Code coverage generated by
84
84
  <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
85
- at 2023-12-26T09:31:34.235Z
85
+ at 2023-12-27T06:18:05.230Z
86
86
  </div>
87
87
  <script src="../../prettify.js"></script>
88
88
  <script>
@@ -116,7 +116,7 @@
116
116
  <div class='footer quiet pad2 space-top1 center small'>
117
117
  Code coverage generated by
118
118
  <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
119
- at 2023-12-26T09:31:34.235Z
119
+ at 2023-12-27T06:18:05.230Z
120
120
  </div>
121
121
  <script src="../../prettify.js"></script>
122
122
  <script>
@@ -112,7 +112,7 @@ export const propTypes = {
112
112
  <div class='footer quiet pad2 space-top1 center small'>
113
113
  Code coverage generated by
114
114
  <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
115
- at 2023-12-26T09:31:34.235Z
115
+ at 2023-12-27T06:18:05.230Z
116
116
  </div>
117
117
  <script src="../../prettify.js"></script>
118
118
  <script>
@@ -433,7 +433,7 @@ AvatarWithTeam.propTypes = propTypes;
433
433
  <div class='footer quiet pad2 space-top1 center small'>
434
434
  Code coverage generated by
435
435
  <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
436
- at 2023-12-26T09:31:34.235Z
436
+ at 2023-12-27T06:18:05.230Z
437
437
  </div>
438
438
  <script src="../../prettify.js"></script>
439
439
  <script>
@@ -118,7 +118,7 @@
118
118
  <div class='footer quiet pad2 space-top1 center small'>
119
119
  Code coverage generated by
120
120
  <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
121
- at 2023-12-26T09:31:34.235Z
121
+ at 2023-12-27T06:18:05.230Z
122
122
  </div>
123
123
  <script src="../../prettify.js"></script>
124
124
  <script>
@@ -116,7 +116,7 @@
116
116
  <div class='footer quiet pad2 space-top1 center small'>
117
117
  Code coverage generated by
118
118
  <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
119
- at 2023-12-26T09:31:34.235Z
119
+ at 2023-12-27T06:18:05.230Z
120
120
  </div>
121
121
  <script src="../../prettify.js"></script>
122
122
  <script>
@@ -97,7 +97,7 @@
97
97
  <div class='footer quiet pad2 space-top1 center small'>
98
98
  Code coverage generated by
99
99
  <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
100
- at 2023-12-26T09:31:34.235Z
100
+ at 2023-12-27T06:18:05.230Z
101
101
  </div>
102
102
  <script src="../../../prettify.js"></script>
103
103
  <script>
@@ -116,7 +116,7 @@
116
116
  <div class='footer quiet pad2 space-top1 center small'>
117
117
  Code coverage generated by
118
118
  <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
119
- at 2023-12-26T09:31:34.235Z
119
+ at 2023-12-27T06:18:05.230Z
120
120
  </div>
121
121
  <script src="../../../prettify.js"></script>
122
122
  <script>
@@ -148,7 +148,7 @@ export const propTypes = {
148
148
  <div class='footer quiet pad2 space-top1 center small'>
149
149
  Code coverage generated by
150
150
  <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
151
- at 2023-12-26T09:31:34.235Z
151
+ at 2023-12-27T06:18:05.230Z
152
152
  </div>
153
153
  <script src="../../../prettify.js"></script>
154
154
  <script>
@@ -206,7 +206,7 @@
206
206
  <div class='footer quiet pad2 space-top1 center small'>
207
207
  Code coverage generated by
208
208
  <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
209
- at 2023-12-26T09:31:34.235Z
209
+ at 2023-12-27T06:18:05.230Z
210
210
  </div>
211
211
  <script src="prettify.js"></script>
212
212
  <script>
@@ -1,3 +1,5 @@
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
+
1
3
  import React from 'react';
2
4
  import { defaultProps } from './props/defaultProps';
3
5
  import { propTypes } from './props/propTypes';
@@ -13,6 +15,7 @@ import ResponsiveDropBox from '@zohodesk/components/lib/ResponsiveDropBox/Respon
13
15
  import { ResponsiveReceiver } from '@zohodesk/components/lib/Responsive/CustomResponsive';
14
16
  import { stopBubbling } from '../../../utils/General';
15
17
  import { scrollTo, findScrollEnd } from '@zohodesk/components/lib/utils/Common.js';
18
+ import MultiSelectHeader from '@zohodesk/components/lib/MultiSelect/MultiSelectHeader';
16
19
  import style from './TagsMultiSelect.module.css';
17
20
  export default class TagsMultiSelect extends React.Component {
18
21
  constructor(props) {
@@ -140,12 +143,20 @@ export default class TagsMultiSelect extends React.Component {
140
143
  boxSize,
141
144
  onSelectTag,
142
145
  clickableTag,
143
- dataSelectorId
146
+ dataSelectorId,
147
+ handleSelectAll,
148
+ selectAllText,
149
+ needSelectAll,
150
+ customClass
144
151
  } = this.props;
145
152
  let {
146
153
  showAll
147
154
  } = this.state;
148
155
  let chipLimit = !isPopupReady ? showAll ? tagsList.length : chipNeedToShow : tagsList.length;
156
+ const {
157
+ tagCustomClass,
158
+ listItemClass
159
+ } = customClass;
149
160
  return /*#__PURE__*/React.createElement("div", {
150
161
  className: ` ${!isReadOnly ? ` ${needBorder ? style.hasBorder : ''}
151
162
  ${needBorder ? style[`borderColor_${borderColor}`] : style.borderColor_transparent} ${isPopupReady && needBorder ? style.active : ''}` : ''} ${className}`,
@@ -165,19 +176,21 @@ export default class TagsMultiSelect extends React.Component {
165
176
  let {
166
177
  name,
167
178
  tagType,
168
- id
179
+ id,
180
+ boxCustomProps
169
181
  } = tag;
170
- return index < chipLimit ? /*#__PURE__*/React.createElement(Box, {
182
+ return index < chipLimit ? /*#__PURE__*/React.createElement(Box, _extends({
171
183
  className: style.tag,
172
184
  key: index
173
- }, /*#__PURE__*/React.createElement(Tag, {
185
+ }, boxCustomProps), /*#__PURE__*/React.createElement(Tag, {
174
186
  id: id,
175
187
  text: name,
176
188
  onRemove: isReadOnly ? null : deleteTag.bind(this, name),
177
189
  closeTitle: i18nKeys.deleteText,
178
190
  palette: clickableTag ? 'defaultLink' : tagType === 'SYSTEM' ? 'primary' : 'default',
179
191
  isReadOnly: isReadOnly,
180
- onSelectTag: onSelectTag ? onSelectTag : undefined
192
+ onSelectTag: onSelectTag ? onSelectTag : undefined,
193
+ customClass: tagCustomClass
181
194
  })) : null;
182
195
  }), tagsList.length > chipNeedToShow && !isPopupReady ? /*#__PURE__*/React.createElement(Box, {
183
196
  className: style.moreLess,
@@ -231,7 +244,12 @@ export default class TagsMultiSelect extends React.Component {
231
244
  alignBox: "row"
232
245
  }, /*#__PURE__*/React.createElement(Box, {
233
246
  flexible: true
234
- }, isTagListLoading ? /*#__PURE__*/React.createElement(Container, {
247
+ }, needSelectAll ? /*#__PURE__*/React.createElement(MultiSelectHeader, {
248
+ onSelect: handleSelectAll,
249
+ selectAllText: selectAllText,
250
+ suggestions: searchList,
251
+ dataId: `${dataId}_selectAll`
252
+ }) : null, isTagListLoading ? /*#__PURE__*/React.createElement(Container, {
235
253
  align: "both",
236
254
  className: `${tabletMode ? '' : style.viewpopNew}`
237
255
  }, /*#__PURE__*/React.createElement(Loader, null)) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Container, {
@@ -245,7 +263,8 @@ export default class TagsMultiSelect extends React.Component {
245
263
  }, searchList.map((item, index) => {
246
264
  let {
247
265
  name,
248
- isNew
266
+ isNew,
267
+ listItemProps
249
268
  } = item;
250
269
  return /*#__PURE__*/React.createElement(React.Fragment, null, searchList.length > 1 && isNew ? /*#__PURE__*/React.createElement(DropDownSeparator, null) : null, /*#__PURE__*/React.createElement(ListItem, {
251
270
  key: index,
@@ -257,7 +276,9 @@ export default class TagsMultiSelect extends React.Component {
257
276
  needTick: true,
258
277
  highlight: selectSearchIndex === index,
259
278
  getRef: this.getSelectedItemRef,
260
- isDisabled: listDisabled
279
+ isDisabled: listDisabled,
280
+ customProps: listItemProps,
281
+ customClass: listItemClass
261
282
  }, isNew ? /*#__PURE__*/React.createElement(Container, {
262
283
  alignBox: "row",
263
284
  align: "vertical"
@@ -40,5 +40,9 @@ export const propTypes = {
40
40
  boxSize: PropTypes.string,
41
41
  onSelectTag: PropTypes.func,
42
42
  clickableTag: PropTypes.bool,
43
- dataSelectorId: PropTypes.string
43
+ dataSelectorId: PropTypes.string,
44
+ handleSelectAll: PropTypes.func,
45
+ selectAllText: PropTypes.string,
46
+ needSelectAll: PropTypes.bool,
47
+ customClass: PropTypes.object
44
48
  };
@@ -1,6 +1,6 @@
1
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
2
 
3
- import React, { useState } from 'react';
3
+ import React from 'react';
4
4
  import { defaultProps } from './props/defaultProps';
5
5
  import { propTypes, UI_propTypes, new_propTypes } from './props/propTypes';
6
6
  import AutoClose from '../../actions/AutoClose';
@@ -8,34 +8,40 @@ import AlertIcons from '../alertIcons/AlertIcons';
8
8
  import AlertClose from '../AlertClose/AlertClose';
9
9
  import style from './GlobalNotification.module.css';
10
10
  import { Container, Box } from '@zohodesk/components/lib/Layout';
11
- import { cancelBubblingEffect } from '@zohodesk/components/es/utils/Common';
12
11
  export default class GlobalNotification extends React.Component {
13
12
  constructor(props) {
14
13
  super(props);
15
14
  this.state = {
16
15
  hideMessage: false
17
16
  };
18
- this.setTimeoutId = null;
19
17
  }
20
18
 
21
- componentDidMount() {
19
+ UNSAFE_componentWillReceiveProps(nextProps) {
22
20
  let {
21
+ showMessage,
23
22
  hideMessage,
24
- hideTime,
25
- id,
26
- needAutoClose
23
+ type
27
24
  } = this.props;
28
25
 
29
- if (needAutoClose) {
30
- this.setTimoutId = setTimeout(() => {
31
- hideMessage(id);
32
- }, hideTime);
26
+ if (showMessage !== nextProps.showMessage || type !== nextProps.type) {
27
+ if (!['danger', 'error', 'warning'].includes(nextProps.type)) {
28
+ setTimeout(() => {
29
+ hideMessage();
30
+ }, 3000);
31
+ }
33
32
  }
34
33
  }
35
34
 
36
- componentWillUnmount() {
37
- if (this.setTimeoutId) {
38
- clearTimeout(this.setTimeoutId);
35
+ componentDidMount() {
36
+ let {
37
+ type,
38
+ hideMessage
39
+ } = this.props;
40
+
41
+ if (!['danger', 'error', 'warning'].includes(type)) {
42
+ setTimeout(() => {
43
+ hideMessage();
44
+ }, 3000);
39
45
  }
40
46
  }
41
47
 
@@ -47,10 +53,7 @@ export default class GlobalNotification extends React.Component {
47
53
  onClick,
48
54
  i18nKeys = {},
49
55
  customProps,
50
- dataSelectorId,
51
- id,
52
- needNotificationExpandUI,
53
- notificationCount
56
+ dataSelectorId
54
57
  } = this.props;
55
58
  let {
56
59
  closeTitle = 'Close'
@@ -62,10 +65,7 @@ export default class GlobalNotification extends React.Component {
62
65
  onClick: onClick,
63
66
  closeTitle: closeTitle,
64
67
  customProps: customProps,
65
- dataSelectorId: dataSelectorId,
66
- id: id,
67
- needNotificationExpandUI: needNotificationExpandUI,
68
- notificationCount: notificationCount
68
+ dataSelectorId: dataSelectorId
69
69
  });
70
70
  }
71
71
 
@@ -79,17 +79,12 @@ GlobalNotification.defaultProps = defaultProps; // if (__DOCS__) {
79
79
  // }
80
80
 
81
81
  export function GlobalNotificationUI(props) {
82
- const [shadowClose, setshadowClose] = useState(true);
83
-
84
82
  function onClose(e) {
85
- setshadowClose(false);
86
83
  let {
87
84
  hideMessage,
88
- onClose,
89
- id
85
+ onClose
90
86
  } = props;
91
- cancelBubblingEffect(e);
92
- hideMessage && hideMessage(id);
87
+ hideMessage && hideMessage(e);
93
88
  onClose && onClose(e);
94
89
  }
95
90
 
@@ -99,15 +94,13 @@ export function GlobalNotificationUI(props) {
99
94
  onClick,
100
95
  closeTitle = '',
101
96
  customProps = {},
102
- dataSelectorId,
103
- needNotificationExpandUI,
104
- notificationCount
97
+ dataSelectorId
105
98
  } = props;
106
99
  let {
107
100
  ExtraProps = {}
108
101
  } = customProps;
109
102
  return /*#__PURE__*/React.createElement("div", _extends({
110
- className: `${style.message} ${!needNotificationExpandUI && notificationCount > 1 && shadowClose ? style.stackShadowOne : ''} ${!needNotificationExpandUI && notificationCount > 2 && shadowClose ? style.stackShadowTwo : ''} ${type ? style[type] : ''}`,
103
+ className: `${style.message} ${type ? style[type] : ''}`,
111
104
  "data-id": `show_${type}_message`,
112
105
  "data-test-id": `show_${type}_message`,
113
106
  tabIndex: 0,
@@ -8,97 +8,39 @@
8
8
 
9
9
  .message {
10
10
  composes: varClass;
11
- /* position: relative; */
11
+ position: absolute;
12
12
  top: 0 ;
13
- z-index: 1;
14
- justify-self: center;
15
- /* overflow: hidden; */
13
+ z-index: 1000;
16
14
  /*Hook for editor alert*/
17
- /* right: 0;
15
+ pointer-events: none;
18
16
  text-align: center;
19
- left: 0;
20
- pointer-events: none; */
21
- }
22
-
23
- .stackShadowTwo::before {
24
- content: '';
25
- position: absolute;
26
- /* css:theme-validation:ignore */
27
- height: var(--zd_size20) ;
28
- width: 90% ;
29
- bottom: calc( var(--zd_size10) * -1 ) ;
30
- background-color: var(--globalnotification_bg_color);
31
- border-radius: 0 0 6px 6px;
32
- box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.15);
33
- }
34
-
35
- [dir=ltr] .stackShadowTwo::before {
36
- left: 50% ;
37
- right: 50% ;
38
- transform: translate(-50%);
39
- animation: behindInfo 0.8s forwards;
40
- }
41
-
42
- [dir=rtl] .stackShadowTwo::before {
43
- right: 50% ;
44
- left: 50% ;
45
- transform: translate(50%);
46
- animation: behindInfo 0.8s forwards;
47
17
  }
48
18
 
49
- .stackShadowOne::after {
50
- content: '';
51
- position: absolute;
52
- /* css:theme-validation:ignore */
53
- height: var(--zd_size20) ;
54
- width: 95% ;
55
- bottom: calc( var(--zd_size5) * -1 ) ;
56
- background-color: var(--globalnotification_bg_color);
57
- border-radius: 0 0 6px 6px;
58
- box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.15);
19
+ [dir=ltr] .message {
20
+ right: 0 ;
21
+ left: 0 ;
59
22
  }
60
23
 
61
- [dir=ltr] .stackShadowOne::after {
62
- left: 50% ;
63
- right: 50% ;
64
- transform: translate(-50%);
65
- animation: behindInfo 0.8s forwards;
66
- }
67
-
68
- [dir=rtl] .stackShadowOne::after {
69
- right: 50% ;
70
- left: 50% ;
71
- transform: translate(50%);
72
- animation: behindInfo 0.8s forwards;
73
- }
74
-
75
- @keyframes behindInfo {
76
- from, 40% {
77
- opacity: 0;
78
- }
79
-
80
- to {
81
- opacity: 1;
82
- }
24
+ [dir=rtl] .message {
25
+ left: 0 ;
26
+ right: 0 ;
83
27
  }
84
28
 
85
29
  .container {
86
30
  position: relative;
87
31
  pointer-events: initial;
88
- /* box-shadow: var(--zd_bs_globalnotification_container); */
89
32
  /* css:theme-validation:ignore */
90
33
  /* css:theme-validation:ignore */
91
34
  /* css:theme-validation:ignore */
92
35
  color: var(--globalnotification_text_color);
93
- width: var(--zd_size420) ;
94
- z-index: 1;
36
+ max-width: var(--zd_size490) ;
95
37
  composes: wbreak from '~@zohodesk/components/lib/common/common.module.css';
38
+ box-shadow: var(--zd_bs_globalnotification_container);
96
39
  border-radius: 0 0 var(--zd_size10) var(--zd_size10);
97
40
  background-color: var(--globalnotification_bg_color);
98
41
  border-style: solid;
99
42
  border-color: var(--commonalert_border_color);
100
43
  border-width: 2px 1px 1px 1px;
101
- box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.15);
102
44
  }
103
45
 
104
46
  [dir=ltr] .container {
@@ -161,8 +103,6 @@
161
103
  font-family: var(--zd_semibold);
162
104
  composes: ftsmooth from '~@zohodesk/components/lib/common/common.module.css';
163
105
  line-height: 1.4286;
164
- overflow: hidden;
165
- text-overflow: ellipsis;
166
106
  }
167
107
 
168
108
  [dir=ltr] .text {
@@ -9,24 +9,19 @@ export const propTypes = {
9
9
  i18nKeys: PropTypes.object,
10
10
  customProps: PropTypes.shape({
11
11
  ExtraProps: PropTypes.object
12
- }),
13
- id: PropTypes.number,
14
- hideTime: PropTypes.number,
15
- isFloating: PropTypes.bool,
16
- isExpand: PropTypes.bool,
17
- stack: PropTypes.number
12
+ })
18
13
  };
19
14
  export const UI_propTypes = {
20
15
  dataSelectorId: PropTypes.string,
16
+ onClose: PropTypes.func,
21
17
  closeTitle: PropTypes.string,
18
+ hideMessage: PropTypes.func,
22
19
  message: PropTypes.string,
23
20
  onClick: PropTypes.func,
24
21
  type: PropTypes.oneOf(['success', 'danger', 'info', 'warning', 'error']),
25
22
  customProps: PropTypes.shape({
26
23
  ExtraProps: PropTypes.object
27
- }),
28
- isExpand: PropTypes.bool,
29
- stack: PropTypes.number
24
+ })
30
25
  };
31
26
  export const new_propTypes = {
32
27
  Element: PropTypes.element,