@zohodesk/dot 1.0.0-temp-175.1 → 1.0.0-temp-175.2

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 (40) 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 +12 -41
  28. package/es/form/fields/TagsMultiSelect/props/defaultProps.js +1 -2
  29. package/es/form/fields/TagsMultiSelect/props/propTypes.js +1 -10
  30. package/es/version2/GlobalNotification/GlobalNotification.js +53 -26
  31. package/es/version2/GlobalNotification/GlobalNotification.module.css +58 -11
  32. package/es/version2/GlobalNotification/props/propTypes.js +11 -4
  33. package/lib/form/fields/TagsMultiSelect/TagsMultiSelect.js +12 -44
  34. package/lib/form/fields/TagsMultiSelect/props/defaultProps.js +1 -2
  35. package/lib/form/fields/TagsMultiSelect/props/propTypes.js +1 -10
  36. package/lib/version2/GlobalNotification/GlobalNotification.js +52 -29
  37. package/lib/version2/GlobalNotification/GlobalNotification.module.css +58 -11
  38. package/lib/version2/GlobalNotification/props/propTypes.js +11 -4
  39. package/package.json +1 -1
  40. package/result.json +1 -1
@@ -9,19 +9,26 @@ export const propTypes = {
9
9
  i18nKeys: PropTypes.object,
10
10
  customProps: PropTypes.shape({
11
11
  ExtraProps: PropTypes.object
12
- })
12
+ }),
13
+ id: PropTypes.number,
14
+ hideTime: PropTypes.number,
15
+ needAutoClose: PropTypes.bool,
16
+ isCollapseView: PropTypes.bool,
17
+ shadowCount: PropTypes.number
13
18
  };
14
19
  export const UI_propTypes = {
15
20
  dataSelectorId: PropTypes.string,
16
- onClose: PropTypes.func,
17
21
  closeTitle: PropTypes.string,
18
- hideMessage: PropTypes.func,
19
22
  message: PropTypes.string,
20
23
  onClick: PropTypes.func,
21
24
  type: PropTypes.oneOf(['success', 'danger', 'info', 'warning', 'error']),
22
25
  customProps: PropTypes.shape({
23
26
  ExtraProps: PropTypes.object
24
- })
27
+ }),
28
+ needShadow: PropTypes.bool,
29
+ shadowCount: PropTypes.number,
30
+ id: PropTypes.number,
31
+ onClose: PropTypes.func
25
32
  };
26
33
  export const new_propTypes = {
27
34
  Element: PropTypes.element,
@@ -37,14 +37,10 @@ var _General = require("../../../utils/General");
37
37
 
38
38
  var _Common = require("@zohodesk/components/lib/utils/Common.js");
39
39
 
40
- var _MultiSelectHeader = _interopRequireDefault(require("@zohodesk/components/lib/MultiSelect/MultiSelectHeader"));
41
-
42
40
  var _TagsMultiSelectModule = _interopRequireDefault(require("./TagsMultiSelect.module.css"));
43
41
 
44
42
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
45
43
 
46
- 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); }
47
-
48
44
  function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
49
45
 
50
46
  function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
@@ -204,26 +200,9 @@ var TagsMultiSelect = /*#__PURE__*/function (_React$Component) {
204
200
  boxSize = _this$props3.boxSize,
205
201
  onSelectTag = _this$props3.onSelectTag,
206
202
  clickableTag = _this$props3.clickableTag,
207
- dataSelectorId = _this$props3.dataSelectorId,
208
- handleSelectAll = _this$props3.handleSelectAll,
209
- selectAllText = _this$props3.selectAllText,
210
- needSelectAll = _this$props3.needSelectAll,
211
- customClass = _this$props3.customClass,
212
- customProps = _this$props3.customProps;
203
+ dataSelectorId = _this$props3.dataSelectorId;
213
204
  var showAll = this.state.showAll;
214
205
  var chipLimit = !isPopupReady ? showAll ? tagsList.length : chipNeedToShow : tagsList.length;
215
- var _customClass$tagCusto = customClass.tagCustomClass,
216
- tagCustomClass = _customClass$tagCusto === void 0 ? '' : _customClass$tagCusto,
217
- _customClass$listItem = customClass.listItemClass,
218
- listItemClass = _customClass$listItem === void 0 ? '' : _customClass$listItem,
219
- _customClass$textBoxI = customClass.textBoxIconWrapper,
220
- textBoxIconWrapper = _customClass$textBoxI === void 0 ? '' : _customClass$textBoxI;
221
- var _customProps$TextBoxI = customProps.TextBoxIconProps,
222
- TextBoxIconProps = _customProps$TextBoxI === void 0 ? {} : _customProps$TextBoxI,
223
- _customProps$tagWrapp = customProps.tagWrapperProps,
224
- tagWrapperProps = _customProps$tagWrapp === void 0 ? {} : _customProps$tagWrapp,
225
- _customProps$tagProps = customProps.tagProps,
226
- tagProps = _customProps$tagProps === void 0 ? {} : _customProps$tagProps;
227
206
  return /*#__PURE__*/_react["default"].createElement("div", {
228
207
  className: " ".concat(!isReadOnly ? " ".concat(needBorder ? _TagsMultiSelectModule["default"].hasBorder : '', "\n ").concat(needBorder ? _TagsMultiSelectModule["default"]["borderColor_".concat(borderColor)] : _TagsMultiSelectModule["default"].borderColor_transparent, " ").concat(isPopupReady && needBorder ? _TagsMultiSelectModule["default"].active : '') : '', " ").concat(className),
229
208
  onClick: _General.stopBubbling,
@@ -234,29 +213,26 @@ var TagsMultiSelect = /*#__PURE__*/function (_React$Component) {
234
213
  alignBox: "row",
235
214
  align: "vertical",
236
215
  isCover: false,
237
- className: "".concat(_TagsMultiSelectModule["default"].tagDiv, " ").concat(textBoxIconWrapper),
216
+ className: _TagsMultiSelectModule["default"].tagDiv,
238
217
  wrap: "wrap",
239
218
  eleRef: getTargetRef,
240
219
  scroll: "vertical"
241
220
  }, tagsList.length ? /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, tagsList.map(function (tag, index) {
242
221
  var name = tag.name,
243
222
  tagType = tag.tagType,
244
- id = tag.id,
245
- boxCustomProps = tag.boxCustomProps,
246
- tagCustomProps = tag.tagCustomProps;
247
- return index < chipLimit ? /*#__PURE__*/_react["default"].createElement(_Layout.Box, _extends({
223
+ id = tag.id;
224
+ return index < chipLimit ? /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
248
225
  className: _TagsMultiSelectModule["default"].tag,
249
226
  key: index
250
- }, boxCustomProps, tagWrapperProps), /*#__PURE__*/_react["default"].createElement(_Tag["default"], _extends({
227
+ }, /*#__PURE__*/_react["default"].createElement(_Tag["default"], {
251
228
  id: id,
252
229
  text: name,
253
230
  onRemove: isReadOnly ? null : deleteTag.bind(_this3, name),
254
231
  closeTitle: i18nKeys.deleteText,
255
232
  palette: clickableTag ? 'defaultLink' : tagType === 'SYSTEM' ? 'primary' : 'default',
256
233
  isReadOnly: isReadOnly,
257
- onSelectTag: onSelectTag ? onSelectTag : undefined,
258
- customClass: tagCustomClass
259
- }, tagCustomProps, tagProps))) : null;
234
+ onSelectTag: onSelectTag ? onSelectTag : undefined
235
+ })) : null;
260
236
  }), tagsList.length > chipNeedToShow && !isPopupReady ? /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
261
237
  className: _TagsMultiSelectModule["default"].moreLess,
262
238
  dataId: "".concat(dataId, "_tagsMore"),
@@ -268,7 +244,7 @@ var TagsMultiSelect = /*#__PURE__*/function (_React$Component) {
268
244
  className: _TagsMultiSelectModule["default"].inputWrapper
269
245
  }, /*#__PURE__*/_react["default"].createElement("span", {
270
246
  className: _TagsMultiSelectModule["default"].custmSpan
271
- }, name), /*#__PURE__*/_react["default"].createElement(_TextBoxIcon["default"], _extends({
247
+ }, name), /*#__PURE__*/_react["default"].createElement(_TextBoxIcon["default"], {
272
248
  htmlId: htmlId,
273
249
  dataId: "".concat(dataId, "_tagInp"),
274
250
  value: name,
@@ -285,7 +261,7 @@ var TagsMultiSelect = /*#__PURE__*/function (_React$Component) {
285
261
  },
286
262
  size: "xsmall",
287
263
  inputRef: this.textInputRef
288
- }, TextBoxIconProps), getTextBoxChildren ? getTextBoxChildren() : null))), isPopupOpen ? /*#__PURE__*/_react["default"].createElement(_CustomResponsive.ResponsiveReceiver, {
264
+ }, getTextBoxChildren ? getTextBoxChildren() : null))), isPopupOpen ? /*#__PURE__*/_react["default"].createElement(_CustomResponsive.ResponsiveReceiver, {
289
265
  query: this.responsiveFunc,
290
266
  responsiveId: "Helmet"
291
267
  }, function (_ref2) {
@@ -307,12 +283,7 @@ var TagsMultiSelect = /*#__PURE__*/function (_React$Component) {
307
283
  alignBox: "row"
308
284
  }, /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
309
285
  flexible: true
310
- }, needSelectAll ? /*#__PURE__*/_react["default"].createElement(_MultiSelectHeader["default"], {
311
- onSelect: handleSelectAll,
312
- selectAllText: selectAllText,
313
- suggestions: searchList,
314
- dataId: "".concat(dataId, "_selectAll")
315
- }) : null, isTagListLoading ? /*#__PURE__*/_react["default"].createElement(_Layout.Container, {
286
+ }, isTagListLoading ? /*#__PURE__*/_react["default"].createElement(_Layout.Container, {
316
287
  align: "both",
317
288
  className: "".concat(tabletMode ? '' : _TagsMultiSelectModule["default"].viewpopNew)
318
289
  }, /*#__PURE__*/_react["default"].createElement(_Loader["default"], null)) : /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_Layout.Container, {
@@ -325,8 +296,7 @@ var TagsMultiSelect = /*#__PURE__*/function (_React$Component) {
325
296
  shrink: true
326
297
  }, searchList.map(function (item, index) {
327
298
  var name = item.name,
328
- isNew = item.isNew,
329
- listItemProps = item.listItemProps;
299
+ isNew = item.isNew;
330
300
  return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, searchList.length > 1 && isNew ? /*#__PURE__*/_react["default"].createElement(_DropDownSeparator["default"], null) : null, /*#__PURE__*/_react["default"].createElement(_ListItem["default"], {
331
301
  key: index,
332
302
  index: index,
@@ -337,9 +307,7 @@ var TagsMultiSelect = /*#__PURE__*/function (_React$Component) {
337
307
  needTick: true,
338
308
  highlight: selectSearchIndex === index,
339
309
  getRef: _this3.getSelectedItemRef,
340
- isDisabled: listDisabled,
341
- customProps: listItemProps,
342
- customClass: listItemClass
310
+ isDisabled: listDisabled
343
311
  }, isNew ? /*#__PURE__*/_react["default"].createElement(_Layout.Container, {
344
312
  alignBox: "row",
345
313
  align: "vertical"
@@ -13,7 +13,6 @@ var defaultProps = {
13
13
  dataId: '',
14
14
  boxSize: 'default',
15
15
  clickableTag: false,
16
- dataSelectorId: 'tagsMultiSelectField',
17
- customClass: {}
16
+ dataSelectorId: 'tagsMultiSelectField'
18
17
  };
19
18
  exports.defaultProps = defaultProps;
@@ -50,15 +50,6 @@ var propTypes = {
50
50
  boxSize: _propTypes["default"].string,
51
51
  onSelectTag: _propTypes["default"].func,
52
52
  clickableTag: _propTypes["default"].bool,
53
- dataSelectorId: _propTypes["default"].string,
54
- handleSelectAll: _propTypes["default"].func,
55
- selectAllText: _propTypes["default"].string,
56
- needSelectAll: _propTypes["default"].bool,
57
- customClass: _propTypes["default"].object,
58
- customProps: _propTypes["default"].shape({
59
- TextBoxIconProps: _propTypes["default"].object,
60
- tagWrapperProps: _propTypes["default"].object,
61
- tagProps: _propTypes["default"].object
62
- })
53
+ dataSelectorId: _propTypes["default"].string
63
54
  };
64
55
  exports.propTypes = propTypes;
@@ -25,6 +25,8 @@ var _GlobalNotificationModule = _interopRequireDefault(require("./GlobalNotifica
25
25
 
26
26
  var _Layout = require("@zohodesk/components/lib/Layout");
27
27
 
28
+ var _Common = require("@zohodesk/components/es/utils/Common");
29
+
28
30
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
29
31
 
30
32
  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); }
@@ -60,41 +62,49 @@ var GlobalNotification = /*#__PURE__*/function (_React$Component) {
60
62
  _classCallCheck(this, GlobalNotification);
61
63
 
62
64
  _this = _super.call(this, props);
65
+ _this.hideMessageTimer = null;
63
66
  _this.state = {
64
- hideMessage: false
67
+ shadowClose: true
65
68
  };
69
+ _this.onClose = _this.onClose.bind(_assertThisInitialized(_this));
66
70
  return _this;
67
71
  }
68
72
 
69
73
  _createClass(GlobalNotification, [{
70
- key: "UNSAFE_componentWillReceiveProps",
71
- value: function UNSAFE_componentWillReceiveProps(nextProps) {
74
+ key: "componentDidMount",
75
+ value: function componentDidMount() {
72
76
  var _this$props = this.props,
73
- showMessage = _this$props.showMessage,
74
77
  hideMessage = _this$props.hideMessage,
75
- type = _this$props.type;
76
-
77
- if (showMessage !== nextProps.showMessage || type !== nextProps.type) {
78
- if (!['danger', 'error', 'warning'].includes(nextProps.type)) {
79
- setTimeout(function () {
80
- hideMessage();
81
- }, 3000);
82
- }
78
+ hideTime = _this$props.hideTime,
79
+ id = _this$props.id,
80
+ needAutoClose = _this$props.needAutoClose;
81
+
82
+ if (needAutoClose) {
83
+ this.hideMessageTimer = setTimeout(function () {
84
+ hideMessage(id);
85
+ }, hideTime);
83
86
  }
84
87
  }
85
88
  }, {
86
- key: "componentDidMount",
87
- value: function componentDidMount() {
88
- var _this$props2 = this.props,
89
- type = _this$props2.type,
90
- hideMessage = _this$props2.hideMessage;
91
-
92
- if (!['danger', 'error', 'warning'].includes(type)) {
93
- setTimeout(function () {
94
- hideMessage();
95
- }, 3000);
89
+ key: "componentWillUnmount",
90
+ value: function componentWillUnmount() {
91
+ if (this.hideMessageTimer) {
92
+ clearTimeout(this.hideMessageTimer);
96
93
  }
97
94
  }
95
+ }, {
96
+ key: "onClose",
97
+ value: function onClose(e) {
98
+ var _this$props2 = this.props,
99
+ onClose = _this$props2.onClose,
100
+ hideMessage = _this$props2.hideMessage,
101
+ id = _this$props2.id;
102
+ this.setState({
103
+ shadowClose: false
104
+ });
105
+ hideMessage && hideMessage(id);
106
+ onClose && onClose(e);
107
+ }
98
108
  }, {
99
109
  key: "render",
100
110
  value: function render() {
@@ -106,7 +116,12 @@ var GlobalNotification = /*#__PURE__*/function (_React$Component) {
106
116
  _this$props3$i18nKeys = _this$props3.i18nKeys,
107
117
  i18nKeys = _this$props3$i18nKeys === void 0 ? {} : _this$props3$i18nKeys,
108
118
  customProps = _this$props3.customProps,
109
- dataSelectorId = _this$props3.dataSelectorId;
119
+ dataSelectorId = _this$props3.dataSelectorId,
120
+ id = _this$props3.id,
121
+ isCollapseView = _this$props3.isCollapseView,
122
+ shadowCount = _this$props3.shadowCount,
123
+ eleRef = _this$props3.eleRef;
124
+ var shadowClose = this.state.shadowClose;
110
125
  var _i18nKeys$closeTitle = i18nKeys.closeTitle,
111
126
  closeTitle = _i18nKeys$closeTitle === void 0 ? 'Close' : _i18nKeys$closeTitle;
112
127
  return /*#__PURE__*/_react["default"].createElement(GlobalNotificationUI, {
@@ -116,7 +131,12 @@ var GlobalNotification = /*#__PURE__*/function (_React$Component) {
116
131
  onClick: onClick,
117
132
  closeTitle: closeTitle,
118
133
  customProps: customProps,
119
- dataSelectorId: dataSelectorId
134
+ dataSelectorId: dataSelectorId,
135
+ id: id,
136
+ shadowCount: shadowCount,
137
+ onClose: this.onClose,
138
+ needShadow: shadowClose && isCollapseView,
139
+ eleRef: eleRef
120
140
  });
121
141
  }
122
142
  }]);
@@ -135,9 +155,8 @@ GlobalNotification.defaultProps = _defaultProps.defaultProps; // if (__DOCS__) {
135
155
 
136
156
  function GlobalNotificationUI(props) {
137
157
  function onClose(e) {
138
- var hideMessage = props.hideMessage,
139
- onClose = props.onClose;
140
- hideMessage && hideMessage(e);
158
+ var onClose = props.onClose;
159
+ (0, _Common.cancelBubblingEffect)(e);
141
160
  onClose && onClose(e);
142
161
  }
143
162
 
@@ -149,11 +168,15 @@ function GlobalNotificationUI(props) {
149
168
  closeTitle = _props$closeTitle === void 0 ? '' : _props$closeTitle,
150
169
  _props$customProps = props.customProps,
151
170
  customProps = _props$customProps === void 0 ? {} : _props$customProps,
152
- dataSelectorId = props.dataSelectorId;
171
+ dataSelectorId = props.dataSelectorId,
172
+ shadowCount = props.shadowCount,
173
+ needShadow = props.needShadow,
174
+ eleRef = props.eleRef;
153
175
  var _customProps$ExtraPro = customProps.ExtraProps,
154
176
  ExtraProps = _customProps$ExtraPro === void 0 ? {} : _customProps$ExtraPro;
155
177
  return /*#__PURE__*/_react["default"].createElement("div", _extends({
156
- className: "".concat(_GlobalNotificationModule["default"].message, " ").concat(type ? _GlobalNotificationModule["default"][type] : ''),
178
+ ref: eleRef,
179
+ className: " ".concat(_GlobalNotificationModule["default"].message, " \n ").concat(needShadow ? "".concat(shadowCount > 1 ? _GlobalNotificationModule["default"].stackShadowOne : '', " \n ").concat(shadowCount > 2 ? _GlobalNotificationModule["default"].stackShadowTwo : '') : '', "\n ").concat(type ? _GlobalNotificationModule["default"][type] : '', "\n "),
157
180
  "data-id": "show_".concat(type, "_message"),
158
181
  "data-test-id": "show_".concat(type, "_message"),
159
182
  tabIndex: 0,
@@ -8,22 +8,66 @@
8
8
 
9
9
  .message {
10
10
  composes: varClass;
11
- position: absolute;
11
+ /* position: relative; */
12
12
  top: 0 ;
13
- z-index: 1000;
13
+ z-index: 1;
14
+ justify-self: center;
15
+ /* overflow: hidden; */
14
16
  /*Hook for editor alert*/
15
- pointer-events: none;
17
+ /* right: 0;
16
18
  text-align: center;
19
+ left: 0;
20
+ pointer-events: none; */
21
+ }
22
+
23
+ .stackShadowOne::after,
24
+ .stackShadowTwo::before {
25
+ content: '';
26
+ position: absolute;
27
+ /* css:theme-validation:ignore */
28
+ height: var(--zd_size20) ;
29
+ }
30
+
31
+ .stackShadowOne::after, .stackShadowTwo::before {
32
+ background-color: var(--globalnotification_bg_color);
33
+ border-radius: 0 0 6px 6px;
34
+ box-shadow: 0px 4px 4px 0px var(--zdt_message_default_box_shadow);
17
35
  }
18
36
 
19
- [dir=ltr] .message {
20
- right: 0 ;
21
- left: 0 ;
37
+ [dir=ltr] .stackShadowOne::after, [dir=ltr] .stackShadowTwo::before {
38
+ left: 50% ;
39
+ right: 50% ;
40
+ transform: translate(-50%);
41
+ animation: behindInfo 0.8s forwards;
22
42
  }
23
43
 
24
- [dir=rtl] .message {
25
- left: 0 ;
26
- right: 0 ;
44
+ [dir=rtl] .stackShadowOne::after, [dir=rtl] .stackShadowTwo::before {
45
+ right: 50% ;
46
+ left: 50% ;
47
+ transform: translate(50%);
48
+ animation: behindInfo 0.8s forwards;
49
+ }
50
+
51
+ .stackShadowTwo::before {
52
+ width: 90% ;
53
+ bottom: calc( var(--zd_size10) * -1 ) ;
54
+ }
55
+
56
+ .stackShadowOne::after {
57
+ width: 95% ;
58
+ bottom: calc( var(--zd_size5) * -1 ) ;
59
+ }
60
+
61
+ @keyframes behindInfo {
62
+
63
+ 0%,
64
+ 40% {
65
+ opacity: 0;
66
+ }
67
+
68
+ 100% {
69
+ opacity: 1;
70
+ }
27
71
  }
28
72
 
29
73
  .container {
@@ -33,9 +77,10 @@
33
77
  /* css:theme-validation:ignore */
34
78
  /* css:theme-validation:ignore */
35
79
  color: var(--globalnotification_text_color);
36
- max-width: var(--zd_size490) ;
80
+ width: var(--zd_size420) ;
81
+ z-index: 1;
37
82
  composes: wbreak from '~@zohodesk/components/lib/common/common.module.css';
38
- box-shadow: var(--zd_bs_globalnotification_container);
83
+ box-shadow: 0px 4px 4px 0px var(--zdt_message_default_box_shadow);
39
84
  border-radius: 0 0 var(--zd_size10) var(--zd_size10);
40
85
  background-color: var(--globalnotification_bg_color);
41
86
  border-style: solid;
@@ -103,6 +148,8 @@
103
148
  font-family: var(--zd_semibold);
104
149
  composes: ftsmooth from '~@zohodesk/components/lib/common/common.module.css';
105
150
  line-height: 1.4286;
151
+ composes: oflow from '~@zohodesk/components/lib/common/common.module.css';
152
+ text-overflow: ellipsis;
106
153
  }
107
154
 
108
155
  [dir=ltr] .text {
@@ -19,20 +19,27 @@ var propTypes = {
19
19
  i18nKeys: _propTypes["default"].object,
20
20
  customProps: _propTypes["default"].shape({
21
21
  ExtraProps: _propTypes["default"].object
22
- })
22
+ }),
23
+ id: _propTypes["default"].number,
24
+ hideTime: _propTypes["default"].number,
25
+ needAutoClose: _propTypes["default"].bool,
26
+ isCollapseView: _propTypes["default"].bool,
27
+ shadowCount: _propTypes["default"].number
23
28
  };
24
29
  exports.propTypes = propTypes;
25
30
  var UI_propTypes = {
26
31
  dataSelectorId: _propTypes["default"].string,
27
- onClose: _propTypes["default"].func,
28
32
  closeTitle: _propTypes["default"].string,
29
- hideMessage: _propTypes["default"].func,
30
33
  message: _propTypes["default"].string,
31
34
  onClick: _propTypes["default"].func,
32
35
  type: _propTypes["default"].oneOf(['success', 'danger', 'info', 'warning', 'error']),
33
36
  customProps: _propTypes["default"].shape({
34
37
  ExtraProps: _propTypes["default"].object
35
- })
38
+ }),
39
+ needShadow: _propTypes["default"].bool,
40
+ shadowCount: _propTypes["default"].number,
41
+ id: _propTypes["default"].number,
42
+ onClose: _propTypes["default"].func
36
43
  };
37
44
  exports.UI_propTypes = UI_propTypes;
38
45
  var new_propTypes = {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@zohodesk/dot",
3
- "version": "1.0.0-temp-175.1",
3
+ "version": "1.0.0-temp-175.2",
4
4
  "main": "lib/index",
5
5
  "module": "es/index.js",
6
6
  "private": false,
package/result.json CHANGED
@@ -1 +1 @@
1
- {"jobDetails":{"isRunByLocal":true,"hostName":"muthu-19990","platForm":"Darwin","branchName":"react-live-fix"},"tests":{"unitCase":{"isExecuted":"Yes","numberOfSuccess":36,"numberOfFails":0,"numberOfCases":36,"numberOfSuites":4,"endTime":1705552329399,"startTime":1705552325909,"coverageDetail":{"codeCoveragePercentage":84.23,"fileCoveragePercentage":0},"fileDetails":[{"fileName":"/Users/muthu-19990/REACT/Library/MuthuReact_Library/jsapps/dot/dot/src/ExternalLink/__tests__/ExternalLink.spec.js","CaseList":{"passedCaseList":["should add http/https to href tag if it is not already present","should not add http/https to href tag if it is already present","should default to / if href is undefined"],"failedCaseList":[]}},{"fileName":"/Users/muthu-19990/REACT/Library/MuthuReact_Library/jsapps/dot/dot/src/avatar/AvatarWithTeam/__tests__/AvatarWithTeam.spec.js","CaseList":{"passedCaseList":["Check whether Avatar mounted or not","Check children length ","Check whether AvatarWithTeam mounted or not","Check whether AvatarTeam mounted or not"],"failedCaseList":[]}},{"fileName":"/Users/muthu-19990/REACT/Library/MuthuReact_Library/jsapps/dot/dot/src/Image/__tests__/Image.spec.js","CaseList":{"passedCaseList":["rendering the default props","checking \"isCover\" is false","rendering \"alt\" and \"src\" value ","rendering \"dataid\" value","rendering \"Original\" value","rendering \"Id\" value","rendering \"title\" value"],"failedCaseList":[]}},{"fileName":"/Users/muthu-19990/REACT/Library/MuthuReact_Library/jsapps/dot/dot/src/IconButton/__tests__/IconButton.spec.js","CaseList":{"passedCaseList":["rendering the defult props","rendering the palette of- primary","rendering the palette of- primaryFilled","rendering the palette of- default","rendering the isActive true with palette of- primary","rendering the isActive true with palette of- primaryFilled","rendering the isActive true with palette of- default","rendering the hovertypes- default","rendering the hovertypes- border","rendering the hovertypes- bg","rendering isNeedEffect is False","rendering ally","rendering ally","rendering needButtonTag","rendering tourId","rendering in Icon","rendering in dataIsHtml is True","rendering in isDisabled is True","rendering in ClassName","rendering in title","eleRef prop is a function","Checking the \"Children\""],"failedCaseList":[]}},{"fileName":"/Users/muthu-19990/REACT/Library/MuthuReact_Library/jsapps/dot/dot/src/ExternalLink/__tests__/ExternalLink.spec.js","CaseList":{"passedCaseList":["should add http/https to href tag if it is not already present","should not add http/https to href tag if it is already present","should default to / if href is undefined"],"failedCaseList":[]}},{"fileName":"/Users/muthu-19990/REACT/Library/MuthuReact_Library/jsapps/dot/dot/src/avatar/AvatarWithTeam/__tests__/AvatarWithTeam.spec.js","CaseList":{"passedCaseList":["Check whether Avatar mounted or not","Check children length ","Check whether AvatarWithTeam mounted or not","Check whether AvatarTeam mounted or not"],"failedCaseList":[]}},{"fileName":"/Users/muthu-19990/REACT/Library/MuthuReact_Library/jsapps/dot/dot/src/Image/__tests__/Image.spec.js","CaseList":{"passedCaseList":["rendering the default props","checking \"isCover\" is false","rendering \"alt\" and \"src\" value ","rendering \"dataid\" value","rendering \"Original\" value","rendering \"Id\" value","rendering \"title\" value"],"failedCaseList":[]}},{"fileName":"/Users/muthu-19990/REACT/Library/MuthuReact_Library/jsapps/dot/dot/src/IconButton/__tests__/IconButton.spec.js","CaseList":{"passedCaseList":["rendering the defult props","rendering the palette of- primary","rendering the palette of- primaryFilled","rendering the palette of- default","rendering the isActive true with palette of- primary","rendering the isActive true with palette of- primaryFilled","rendering the isActive true with palette of- default","rendering the hovertypes- default","rendering the hovertypes- border","rendering the hovertypes- bg","rendering isNeedEffect is False","rendering ally","rendering ally","rendering needButtonTag","rendering tourId","rendering in Icon","rendering in dataIsHtml is True","rendering in isDisabled is True","rendering in ClassName","rendering in title","eleRef prop is a function","Checking the \"Children\""],"failedCaseList":[]}}]}}}
1
+ {"jobDetails":{"isRunByLocal":true,"hostName":"muthu-19990","platForm":"Darwin","branchName":"react-live-fix"},"tests":{"unitCase":{"isExecuted":"Yes","numberOfSuccess":36,"numberOfFails":0,"numberOfCases":36,"numberOfSuites":4,"endTime":1705648659793,"startTime":1705648656211,"coverageDetail":{"codeCoveragePercentage":84.23,"fileCoveragePercentage":0},"fileDetails":[{"fileName":"/Users/muthu-19990/REACT/Library/MuthuReact_Library/jsapps/dot/dot/src/ExternalLink/__tests__/ExternalLink.spec.js","CaseList":{"passedCaseList":["should add http/https to href tag if it is not already present","should not add http/https to href tag if it is already present","should default to / if href is undefined"],"failedCaseList":[]}},{"fileName":"/Users/muthu-19990/REACT/Library/MuthuReact_Library/jsapps/dot/dot/src/avatar/AvatarWithTeam/__tests__/AvatarWithTeam.spec.js","CaseList":{"passedCaseList":["Check whether Avatar mounted or not","Check children length ","Check whether AvatarWithTeam mounted or not","Check whether AvatarTeam mounted or not"],"failedCaseList":[]}},{"fileName":"/Users/muthu-19990/REACT/Library/MuthuReact_Library/jsapps/dot/dot/src/Image/__tests__/Image.spec.js","CaseList":{"passedCaseList":["rendering the default props","checking \"isCover\" is false","rendering \"alt\" and \"src\" value ","rendering \"dataid\" value","rendering \"Original\" value","rendering \"Id\" value","rendering \"title\" value"],"failedCaseList":[]}},{"fileName":"/Users/muthu-19990/REACT/Library/MuthuReact_Library/jsapps/dot/dot/src/IconButton/__tests__/IconButton.spec.js","CaseList":{"passedCaseList":["rendering the defult props","rendering the palette of- primary","rendering the palette of- primaryFilled","rendering the palette of- default","rendering the isActive true with palette of- primary","rendering the isActive true with palette of- primaryFilled","rendering the isActive true with palette of- default","rendering the hovertypes- default","rendering the hovertypes- border","rendering the hovertypes- bg","rendering isNeedEffect is False","rendering ally","rendering ally","rendering needButtonTag","rendering tourId","rendering in Icon","rendering in dataIsHtml is True","rendering in isDisabled is True","rendering in ClassName","rendering in title","eleRef prop is a function","Checking the \"Children\""],"failedCaseList":[]}},{"fileName":"/Users/muthu-19990/REACT/Library/MuthuReact_Library/jsapps/dot/dot/src/ExternalLink/__tests__/ExternalLink.spec.js","CaseList":{"passedCaseList":["should add http/https to href tag if it is not already present","should not add http/https to href tag if it is already present","should default to / if href is undefined"],"failedCaseList":[]}},{"fileName":"/Users/muthu-19990/REACT/Library/MuthuReact_Library/jsapps/dot/dot/src/avatar/AvatarWithTeam/__tests__/AvatarWithTeam.spec.js","CaseList":{"passedCaseList":["Check whether Avatar mounted or not","Check children length ","Check whether AvatarWithTeam mounted or not","Check whether AvatarTeam mounted or not"],"failedCaseList":[]}},{"fileName":"/Users/muthu-19990/REACT/Library/MuthuReact_Library/jsapps/dot/dot/src/Image/__tests__/Image.spec.js","CaseList":{"passedCaseList":["rendering the default props","checking \"isCover\" is false","rendering \"alt\" and \"src\" value ","rendering \"dataid\" value","rendering \"Original\" value","rendering \"Id\" value","rendering \"title\" value"],"failedCaseList":[]}},{"fileName":"/Users/muthu-19990/REACT/Library/MuthuReact_Library/jsapps/dot/dot/src/IconButton/__tests__/IconButton.spec.js","CaseList":{"passedCaseList":["rendering the defult props","rendering the palette of- primary","rendering the palette of- primaryFilled","rendering the palette of- default","rendering the isActive true with palette of- primary","rendering the isActive true with palette of- primaryFilled","rendering the isActive true with palette of- default","rendering the hovertypes- default","rendering the hovertypes- border","rendering the hovertypes- bg","rendering isNeedEffect is False","rendering ally","rendering ally","rendering needButtonTag","rendering tourId","rendering in Icon","rendering in dataIsHtml is True","rendering in isDisabled is True","rendering in ClassName","rendering in title","eleRef prop is a function","Checking the \"Children\""],"failedCaseList":[]}},{"fileName":"/Users/muthu-19990/REACT/Library/MuthuReact_Library/jsapps/dot/dot/src/ExternalLink/__tests__/ExternalLink.spec.js","CaseList":{"passedCaseList":["should add http/https to href tag if it is not already present","should not add http/https to href tag if it is already present","should default to / if href is undefined"],"failedCaseList":[]}},{"fileName":"/Users/muthu-19990/REACT/Library/MuthuReact_Library/jsapps/dot/dot/src/avatar/AvatarWithTeam/__tests__/AvatarWithTeam.spec.js","CaseList":{"passedCaseList":["Check whether Avatar mounted or not","Check children length ","Check whether AvatarWithTeam mounted or not","Check whether AvatarTeam mounted or not"],"failedCaseList":[]}},{"fileName":"/Users/muthu-19990/REACT/Library/MuthuReact_Library/jsapps/dot/dot/src/Image/__tests__/Image.spec.js","CaseList":{"passedCaseList":["rendering the default props","checking \"isCover\" is false","rendering \"alt\" and \"src\" value ","rendering \"dataid\" value","rendering \"Original\" value","rendering \"Id\" value","rendering \"title\" value"],"failedCaseList":[]}},{"fileName":"/Users/muthu-19990/REACT/Library/MuthuReact_Library/jsapps/dot/dot/src/IconButton/__tests__/IconButton.spec.js","CaseList":{"passedCaseList":["rendering the defult props","rendering the palette of- primary","rendering the palette of- primaryFilled","rendering the palette of- default","rendering the isActive true with palette of- primary","rendering the isActive true with palette of- primaryFilled","rendering the isActive true with palette of- default","rendering the hovertypes- default","rendering the hovertypes- border","rendering the hovertypes- bg","rendering isNeedEffect is False","rendering ally","rendering ally","rendering needButtonTag","rendering tourId","rendering in Icon","rendering in dataIsHtml is True","rendering in isDisabled is True","rendering in ClassName","rendering in title","eleRef prop is a function","Checking the \"Children\""],"failedCaseList":[]}}]}}}