@zohodesk/dot 1.0.0-temp-220.2 → 1.0.0-temp-223

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 (30) hide show
  1. package/README.md +0 -5
  2. package/assets/Appearance/dark/mode/Dot_DarkMode.module.css +315 -315
  3. package/assets/Appearance/dark/themes/blue/blue_DotTheme_DarkTheme.module.css +15 -15
  4. package/assets/Appearance/dark/themes/green/green_DotTheme_DarkTheme.module.css +15 -15
  5. package/assets/Appearance/dark/themes/orange/orange_DotTheme_DarkTheme.module.css +15 -15
  6. package/assets/Appearance/dark/themes/red/red_DotTheme_DarkTheme.module.css +15 -15
  7. package/assets/Appearance/dark/themes/yellow/yellow_DotTheme_DarkTheme.module.css +15 -15
  8. package/assets/Appearance/light/mode/Dot_LightMode.module.css +307 -307
  9. package/assets/Appearance/light/themes/blue/blue_DotTheme_LightTheme.module.css +15 -15
  10. package/assets/Appearance/light/themes/green/green_DotTheme_LightTheme.module.css +15 -15
  11. package/assets/Appearance/light/themes/orange/orange_DotTheme_LightTheme.module.css +15 -15
  12. package/assets/Appearance/light/themes/red/red_DotTheme_LightTheme.module.css +15 -15
  13. package/assets/Appearance/light/themes/yellow/yellow_DotTheme_LightTheme.module.css +15 -15
  14. package/assets/Appearance/pureDark/mode/Dot_PureDarkMode.module.css +317 -317
  15. package/assets/Appearance/pureDark/themes/blue/blue_DotTheme_PureDarkTheme.module.css +15 -15
  16. package/assets/Appearance/pureDark/themes/green/green_DotTheme_PureDarkTheme.module.css +15 -15
  17. package/assets/Appearance/pureDark/themes/orange/orange_DotTheme_PureDarkTheme.module.css +15 -15
  18. package/assets/Appearance/pureDark/themes/red/red_DotTheme_PureDarkTheme.module.css +15 -15
  19. package/assets/Appearance/pureDark/themes/yellow/yellow_DotTheme_PureDarkTheme.module.css +15 -15
  20. package/es/common/dot_boxShadow.module.css +1 -2
  21. package/es/version2/GlobalNotification/GlobalNotification.js +7 -46
  22. package/es/version2/GlobalNotification/__tests__/GlobalNotification.spec.js +0 -9
  23. package/es/version2/GlobalNotification/props/propTypes.js +3 -4
  24. package/lib/common/dot_boxShadow.module.css +1 -2
  25. package/lib/version2/GlobalNotification/GlobalNotification.js +18 -68
  26. package/lib/version2/GlobalNotification/__tests__/GlobalNotification.spec.js +0 -10
  27. package/lib/version2/GlobalNotification/props/propTypes.js +3 -4
  28. package/package.json +9 -9
  29. package/es/version2/GlobalNotification/utils/constants.js +0 -6
  30. package/lib/version2/GlobalNotification/utils/constants.js +0 -13
@@ -1,26 +1,26 @@
1
1
  [data-mode='pureDark'][data-theme='blue'] {
2
2
  /* freezelayer */
3
- --zdt_freezelayer_darklight_bg: hsla(0, 0.00%, calc(6.27% + var(--zdc_default)), calc( 0.9 + var(--zdc_alpha_high)));
3
+ --zdt_freezelayer_darklight_bg: hsla(0, calc(var(--zd-saturation) * 0.00%), calc(6.27% + var(--zdc_default)), calc( 0.9 + var(--zdc_alpha_high)));
4
4
 
5
5
  /* common empty state */
6
- --zdt_commonEmptyState_dark_title: hsla(0, 0.00%, calc(100.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
7
- --zdt_commonEmptyState_dark_description: hsla(0, 0.00%, calc(100.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
8
- --zdt_commonEmptyState_dark_link: hsla(212, 100.00%, calc(63.92% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
9
- --zdt_commonEmptyState_dark_link_hover: hsla(221, 100.00%, calc(57.06% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
6
+ --zdt_commonEmptyState_dark_title: hsla(0, calc(var(--zd-saturation) * 0.00%), calc(100.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
7
+ --zdt_commonEmptyState_dark_description: hsla(0, calc(var(--zd-saturation) * 0.00%), calc(100.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
8
+ --zdt_commonEmptyState_dark_link: hsla(212, calc(var(--zd-saturation) * 100.00%), calc(63.92% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
9
+ --zdt_commonEmptyState_dark_link_hover: hsla(221, calc(var(--zd-saturation) * 100.00%), calc(57.06% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
10
10
 
11
11
  /* onboarding */
12
- --zdt_onboarding_primary_gradient_border: hsla(212, 91.84%, calc(48.04% + var(--zdc_default_inverse_low)), calc( 0.3 + var(--zdc_alpha_low)));
13
- --zdt_onboarding_secondary_gradient_border: hsla(220, 72.24%, calc(51.96% + var(--zdc_default_inverse_low)), calc( 0.51 + var(--zdc_alpha_low)));
14
- --zdt_onboarding_gradient_border: hsla(220, 72.24%, calc(51.96% + var(--zdc_default_inverse_low)), calc( 0 + var(--zdc_alpha_low)));
15
- --zdt_onboarding_primary_button_shadow: rgba(10, 115, 235, 0.25);
16
- --zdt_onboarding_gradient_bg: hsla(213, 19.57%, calc(18.04% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
12
+ --zdt_onboarding_primary_gradient_border: hsla(212, calc(var(--zd-saturation) * 91.84%), calc(48.04% + var(--zdc_default_inverse_low)), calc( 0.3 + var(--zdc_alpha_low)));
13
+ --zdt_onboarding_secondary_gradient_border: hsla(220, calc(var(--zd-saturation) * 72.24%), calc(51.96% + var(--zdc_default_inverse_low)), calc( 0.51 + var(--zdc_alpha_low)));
14
+ --zdt_onboarding_gradient_border: hsla(220, calc(var(--zd-saturation) * 72.24%), calc(51.96% + var(--zdc_default_inverse_low)), calc( 0 + var(--zdc_alpha_low)));
15
+ --zdt_onboarding_primary_button_shadow: hsla(212, calc(var(--zd-saturation) * 91.84%), 48.04, 0.25);
16
+ --zdt_onboarding_gradient_bg: hsla(213, calc(var(--zd-saturation) * 19.57%), calc(18.04% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
17
17
 
18
18
  /* attachment viewer */
19
- --zdt_attachmentviewer_header_bg: hsla(0, 0.00%, calc(9.02% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
20
- --zdt_attachmentviewer_header_border: hsla(0, 0.00%, calc(13.33% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
21
- --zdt_attachmentviewer_footer_bg: hsla(0, 0.00%, calc(9.02% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
22
- --zdt_attachmentviewer_arrow_bg_hover: hsla(0, 0.00%, calc(6.27% + var(--zdc_default)), calc( 0.4 + var(--zdc_alpha_high)));
19
+ --zdt_attachmentviewer_header_bg: hsla(0, calc(var(--zd-saturation) * 0.00%), calc(9.02% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
20
+ --zdt_attachmentviewer_header_border: hsla(0, calc(var(--zd-saturation) * 0.00%), calc(13.33% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
21
+ --zdt_attachmentviewer_footer_bg: hsla(0, calc(var(--zd-saturation) * 0.00%), calc(9.02% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
22
+ --zdt_attachmentviewer_arrow_bg_hover: hsla(0, calc(var(--zd-saturation) * 0.00%), calc(6.27% + var(--zdc_default)), calc( 0.4 + var(--zdc_alpha_high)));
23
23
 
24
24
  /* loader */
25
- --zdt_loader_bg: rgb(71,157,255);
25
+ --zdt_loader_bg: hsla(212, calc(var(--zd-saturation) * 100.00%), 63.92, 1);
26
26
  }
@@ -1,26 +1,26 @@
1
1
  [data-mode='pureDark'][data-theme='green'] {
2
2
  /* freezelayer */
3
- --zdt_freezelayer_darklight_bg: hsla(0, 0.00%, calc(6.27% + var(--zdc_default)), calc( 0.9 + var(--zdc_alpha_high)));
3
+ --zdt_freezelayer_darklight_bg: hsla(0, calc(var(--zd-saturation) * 0.00%), calc(6.27% + var(--zdc_default)), calc( 0.9 + var(--zdc_alpha_high)));
4
4
 
5
5
  /* common empty state */
6
- --zdt_commonEmptyState_dark_title: hsla(0, 0.00%, calc(100.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
7
- --zdt_commonEmptyState_dark_description: hsla(0, 0.00%, calc(100.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
8
- --zdt_commonEmptyState_dark_link: hsla(133, 40.00%, calc(45.10% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
9
- --zdt_commonEmptyState_dark_link_hover: hsla(128, 79.71%, calc(27.06% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
6
+ --zdt_commonEmptyState_dark_title: hsla(0, calc(var(--zd-saturation) * 0.00%), calc(100.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
7
+ --zdt_commonEmptyState_dark_description: hsla(0, calc(var(--zd-saturation) * 0.00%), calc(100.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
8
+ --zdt_commonEmptyState_dark_link: hsla(133, calc(var(--zd-saturation) * 40.00%), calc(45.10% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
9
+ --zdt_commonEmptyState_dark_link_hover: hsla(128, calc(var(--zd-saturation) * 79.71%), calc(27.06% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
10
10
 
11
11
  /* onboarding */
12
- --zdt_onboarding_primary_gradient_border: hsla(133, 62.68%, calc(40.98% + var(--zdc_default_inverse_low)), calc( 0.3 + var(--zdc_alpha_low)));
13
- --zdt_onboarding_secondary_gradient_border: hsla(133, 62.68%, calc(40.98% + var(--zdc_default_inverse_low)), calc( 0.51 + var(--zdc_alpha_low)));
14
- --zdt_onboarding_gradient_border: hsla(133, 62.68%, calc(40.98% + var(--zdc_default_inverse_low)), calc( 0 + var(--zdc_alpha_low)));
15
- --zdt_onboarding_primary_button_shadow: rgba(39, 170, 67, 0.25);
16
- --zdt_onboarding_gradient_bg: hsla(133, 10.84%, calc(16.27% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
12
+ --zdt_onboarding_primary_gradient_border: hsla(133, calc(var(--zd-saturation) * 62.68%), calc(40.98% + var(--zdc_default_inverse_low)), calc( 0.3 + var(--zdc_alpha_low)));
13
+ --zdt_onboarding_secondary_gradient_border: hsla(133, calc(var(--zd-saturation) * 62.68%), calc(40.98% + var(--zdc_default_inverse_low)), calc( 0.51 + var(--zdc_alpha_low)));
14
+ --zdt_onboarding_gradient_border: hsla(133, calc(var(--zd-saturation) * 62.68%), calc(40.98% + var(--zdc_default_inverse_low)), calc( 0 + var(--zdc_alpha_low)));
15
+ --zdt_onboarding_primary_button_shadow: hsla(133, calc(var(--zd-saturation) * 62.68%), 40.98, 0.25);
16
+ --zdt_onboarding_gradient_bg: hsla(133, calc(var(--zd-saturation) * 10.84%), calc(16.27% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
17
17
 
18
18
  /* attachment viewer */
19
- --zdt_attachmentviewer_header_bg: hsla(0, 0.00%, calc(9.02% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
20
- --zdt_attachmentviewer_header_border: hsla(0, 0.00%, calc(13.33% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
21
- --zdt_attachmentviewer_footer_bg: hsla(0, 0.00%, calc(9.02% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
22
- --zdt_attachmentviewer_arrow_bg_hover: hsla(0, 0.00%, calc(6.27% + var(--zdc_default)), calc( 0.4 + var(--zdc_alpha_high)));
19
+ --zdt_attachmentviewer_header_bg: hsla(0, calc(var(--zd-saturation) * 0.00%), calc(9.02% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
20
+ --zdt_attachmentviewer_header_border: hsla(0, calc(var(--zd-saturation) * 0.00%), calc(13.33% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
21
+ --zdt_attachmentviewer_footer_bg: hsla(0, calc(var(--zd-saturation) * 0.00%), calc(9.02% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
22
+ --zdt_attachmentviewer_arrow_bg_hover: hsla(0, calc(var(--zd-saturation) * 0.00%), calc(6.27% + var(--zdc_default)), calc( 0.4 + var(--zdc_alpha_high)));
23
23
 
24
24
  /* loader */
25
- --zdt_loader_bg: rgb(69,161,89);
25
+ --zdt_loader_bg: hsla(133, calc(var(--zd-saturation) * 40.00%), 45.10, 1);
26
26
  }
@@ -1,26 +1,26 @@
1
1
  [data-mode='pureDark'][data-theme='orange'] {
2
2
  /* freezelayer */
3
- --zdt_freezelayer_darklight_bg: hsla(0, 0.00%, calc(6.27% + var(--zdc_default)), calc( 0.9 + var(--zdc_alpha_high)));
3
+ --zdt_freezelayer_darklight_bg: hsla(0, calc(var(--zd-saturation) * 0.00%), calc(6.27% + var(--zdc_default)), calc( 0.9 + var(--zdc_alpha_high)));
4
4
 
5
5
  /* common empty state */
6
- --zdt_commonEmptyState_dark_title: hsla(0, 0.00%, calc(100.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
7
- --zdt_commonEmptyState_dark_description: hsla(0, 0.00%, calc(100.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
8
- --zdt_commonEmptyState_dark_link: hsla(26, 100.00%, calc(56.08% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
9
- --zdt_commonEmptyState_dark_link_hover: hsla(29, 100.00%, calc(32.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
6
+ --zdt_commonEmptyState_dark_title: hsla(0, calc(var(--zd-saturation) * 0.00%), calc(100.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
7
+ --zdt_commonEmptyState_dark_description: hsla(0, calc(var(--zd-saturation) * 0.00%), calc(100.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
8
+ --zdt_commonEmptyState_dark_link: hsla(26, calc(var(--zd-saturation) * 100.00%), calc(56.08% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
9
+ --zdt_commonEmptyState_dark_link_hover: hsla(29, calc(var(--zd-saturation) * 100.00%), calc(32.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
10
10
 
11
11
  /* onboarding */
12
- --zdt_onboarding_primary_gradient_border: hsla(28, 81.75%, calc(49.41% + var(--zdc_default_inverse_low)), calc( 0.3 + var(--zdc_alpha_low)));
13
- --zdt_onboarding_secondary_gradient_border: hsla(28, 81.75%, calc(49.41% + var(--zdc_default_inverse_low)), calc( 0.51 + var(--zdc_alpha_low)));
14
- --zdt_onboarding_gradient_border: hsla(28, 81.75%, calc(49.41% + var(--zdc_default_inverse_low)), calc( 0 + var(--zdc_alpha_low)));
15
- --zdt_onboarding_primary_button_shadow: rgba(229, 119, 23, 0.25);
16
- --zdt_onboarding_gradient_bg: hsla(26, 19.51%, calc(16.08% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
12
+ --zdt_onboarding_primary_gradient_border: hsla(28, calc(var(--zd-saturation) * 81.75%), calc(49.41% + var(--zdc_default_inverse_low)), calc( 0.3 + var(--zdc_alpha_low)));
13
+ --zdt_onboarding_secondary_gradient_border: hsla(28, calc(var(--zd-saturation) * 81.75%), calc(49.41% + var(--zdc_default_inverse_low)), calc( 0.51 + var(--zdc_alpha_low)));
14
+ --zdt_onboarding_gradient_border: hsla(28, calc(var(--zd-saturation) * 81.75%), calc(49.41% + var(--zdc_default_inverse_low)), calc( 0 + var(--zdc_alpha_low)));
15
+ --zdt_onboarding_primary_button_shadow: hsla(28, calc(var(--zd-saturation) * 81.75%), 49.41, 0.25);
16
+ --zdt_onboarding_gradient_bg: hsla(26, calc(var(--zd-saturation) * 19.51%), calc(16.08% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
17
17
 
18
18
  /* attachment viewer */
19
- --zdt_attachmentviewer_header_bg: hsla(0, 0.00%, calc(9.02% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
20
- --zdt_attachmentviewer_header_border: hsla(0, 0.00%, calc(13.33% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
21
- --zdt_attachmentviewer_footer_bg: hsla(0, 0.00%, calc(9.02% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
22
- --zdt_attachmentviewer_arrow_bg_hover: hsla(0, 0.00%, calc(6.27% + var(--zdc_default)), calc( 0.4 + var(--zdc_alpha_high)));
19
+ --zdt_attachmentviewer_header_bg: hsla(0, calc(var(--zd-saturation) * 0.00%), calc(9.02% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
20
+ --zdt_attachmentviewer_header_border: hsla(0, calc(var(--zd-saturation) * 0.00%), calc(13.33% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
21
+ --zdt_attachmentviewer_footer_bg: hsla(0, calc(var(--zd-saturation) * 0.00%), calc(9.02% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
22
+ --zdt_attachmentviewer_arrow_bg_hover: hsla(0, calc(var(--zd-saturation) * 0.00%), calc(6.27% + var(--zdc_default)), calc( 0.4 + var(--zdc_alpha_high)));
23
23
 
24
24
  /* loader */
25
- --zdt_loader_bg: rgb(255,128,31);
25
+ --zdt_loader_bg: hsla(26, calc(var(--zd-saturation) * 100.00%), 56.08, 1);
26
26
  }
@@ -1,26 +1,26 @@
1
1
  [data-mode='pureDark'][data-theme='red'] {
2
2
  /* freezelayer */
3
- --zdt_freezelayer_darklight_bg: hsla(0, 0.00%, calc(6.27% + var(--zdc_default)), calc( 0.9 + var(--zdc_alpha_high)));
3
+ --zdt_freezelayer_darklight_bg: hsla(0, calc(var(--zd-saturation) * 0.00%), calc(6.27% + var(--zdc_default)), calc( 0.9 + var(--zdc_alpha_high)));
4
4
 
5
5
  /* common empty state */
6
- --zdt_commonEmptyState_dark_title: hsla(0, 0.00%, calc(100.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
7
- --zdt_commonEmptyState_dark_description: hsla(0, 0.00%, calc(100.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
8
- --zdt_commonEmptyState_dark_link: hsla(0, 77.78%, calc(61.18% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
9
- --zdt_commonEmptyState_dark_link_hover: hsla(0, 81.62%, calc(36.27% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
6
+ --zdt_commonEmptyState_dark_title: hsla(0, calc(var(--zd-saturation) * 0.00%), calc(100.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
7
+ --zdt_commonEmptyState_dark_description: hsla(0, calc(var(--zd-saturation) * 0.00%), calc(100.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
8
+ --zdt_commonEmptyState_dark_link: hsla(0, calc(var(--zd-saturation) * 77.78%), calc(61.18% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
9
+ --zdt_commonEmptyState_dark_link_hover: hsla(0, calc(var(--zd-saturation) * 81.62%), calc(36.27% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
10
10
 
11
11
  /* onboarding */
12
- --zdt_onboarding_primary_gradient_border: hsla(0, 73.81%, calc(49.41% + var(--zdc_default_inverse_low)), calc( 0.3 + var(--zdc_alpha_low)));
13
- --zdt_onboarding_secondary_gradient_border: hsla(0, 73.81%, calc(49.41% + var(--zdc_default_inverse_low)), calc( 0.51 + var(--zdc_alpha_low)));
14
- --zdt_onboarding_gradient_border: hsla(0, 73.81%, calc(49.41% + var(--zdc_default_inverse_low)), calc( 0 + var(--zdc_alpha_low)));
15
- --zdt_onboarding_primary_button_shadow: rgba(219, 33, 33, 0.25);
16
- --zdt_onboarding_gradient_bg: hsla(0, 13.25%, calc(16.27% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
12
+ --zdt_onboarding_primary_gradient_border: hsla(0, calc(var(--zd-saturation) * 73.81%), calc(49.41% + var(--zdc_default_inverse_low)), calc( 0.3 + var(--zdc_alpha_low)));
13
+ --zdt_onboarding_secondary_gradient_border: hsla(0, calc(var(--zd-saturation) * 73.81%), calc(49.41% + var(--zdc_default_inverse_low)), calc( 0.51 + var(--zdc_alpha_low)));
14
+ --zdt_onboarding_gradient_border: hsla(0, calc(var(--zd-saturation) * 73.81%), calc(49.41% + var(--zdc_default_inverse_low)), calc( 0 + var(--zdc_alpha_low)));
15
+ --zdt_onboarding_primary_button_shadow: hsla(0, calc(var(--zd-saturation) * 73.81%), 49.41, 0.25);
16
+ --zdt_onboarding_gradient_bg: hsla(0, calc(var(--zd-saturation) * 13.25%), calc(16.27% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
17
17
 
18
18
  /* attachment viewer */
19
- --zdt_attachmentviewer_header_bg: hsla(0, 0.00%, calc(9.02% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
20
- --zdt_attachmentviewer_header_border: hsla(0, 0.00%, calc(13.33% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
21
- --zdt_attachmentviewer_footer_bg: hsla(0, 0.00%, calc(9.02% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
22
- --zdt_attachmentviewer_arrow_bg_hover: hsla(0, 0.00%, calc(6.27% + var(--zdc_default)), calc( 0.4 + var(--zdc_alpha_high)));
19
+ --zdt_attachmentviewer_header_bg: hsla(0, calc(var(--zd-saturation) * 0.00%), calc(9.02% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
20
+ --zdt_attachmentviewer_header_border: hsla(0, calc(var(--zd-saturation) * 0.00%), calc(13.33% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
21
+ --zdt_attachmentviewer_footer_bg: hsla(0, calc(var(--zd-saturation) * 0.00%), calc(9.02% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
22
+ --zdt_attachmentviewer_arrow_bg_hover: hsla(0, calc(var(--zd-saturation) * 0.00%), calc(6.27% + var(--zdc_default)), calc( 0.4 + var(--zdc_alpha_high)));
23
23
 
24
24
  /* loader */
25
- --zdt_loader_bg: rgb(233,79,79);
25
+ --zdt_loader_bg: hsla(0, calc(var(--zd-saturation) * 77.78%), 61.18, 1);
26
26
  }
@@ -1,26 +1,26 @@
1
1
  [data-mode='pureDark'][data-theme='yellow'] {
2
2
  /* freezelayer */
3
- --zdt_freezelayer_darklight_bg: hsla(0, 0.00%, calc(6.27% + var(--zdc_default)), calc( 0.9 + var(--zdc_alpha_high)));
3
+ --zdt_freezelayer_darklight_bg: hsla(0, calc(var(--zd-saturation) * 0.00%), calc(6.27% + var(--zdc_default)), calc( 0.9 + var(--zdc_alpha_high)));
4
4
 
5
5
  /* common empty state */
6
- --zdt_commonEmptyState_dark_title: hsla(0, 0.00%, calc(100.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
7
- --zdt_commonEmptyState_dark_description: hsla(0, 0.00%, calc(100.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
8
- --zdt_commonEmptyState_dark_link: hsla(37, 66.94%, calc(52.55% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
9
- --zdt_commonEmptyState_dark_link_hover: hsla(39, 90.18%, calc(31.96% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
6
+ --zdt_commonEmptyState_dark_title: hsla(0, calc(var(--zd-saturation) * 0.00%), calc(100.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
7
+ --zdt_commonEmptyState_dark_description: hsla(0, calc(var(--zd-saturation) * 0.00%), calc(100.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
8
+ --zdt_commonEmptyState_dark_link: hsla(37, calc(var(--zd-saturation) * 66.94%), calc(52.55% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
9
+ --zdt_commonEmptyState_dark_link_hover: hsla(39, calc(var(--zd-saturation) * 90.18%), calc(31.96% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
10
10
 
11
11
  /* onboarding */
12
- --zdt_onboarding_primary_gradient_border: hsla(43, 90.39%, calc(44.90% + var(--zdc_default_inverse_low)), calc( 0.3 + var(--zdc_alpha_low)));
13
- --zdt_onboarding_secondary_gradient_border: hsla(43, 90.39%, calc(44.90% + var(--zdc_default_inverse_low)), calc( 0.51 + var(--zdc_alpha_low)));
14
- --zdt_onboarding_gradient_border: hsla(43, 90.39%, calc(44.90% + var(--zdc_default_inverse_low)), calc( 0 + var(--zdc_alpha_low)));
15
- --zdt_onboarding_primary_button_shadow: rgba(218, 160, 11, 0.25);
16
- --zdt_onboarding_gradient_bg: hsla(35, 15.00%, calc(15.69% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
12
+ --zdt_onboarding_primary_gradient_border: hsla(43, calc(var(--zd-saturation) * 90.39%), calc(44.90% + var(--zdc_default_inverse_low)), calc( 0.3 + var(--zdc_alpha_low)));
13
+ --zdt_onboarding_secondary_gradient_border: hsla(43, calc(var(--zd-saturation) * 90.39%), calc(44.90% + var(--zdc_default_inverse_low)), calc( 0.51 + var(--zdc_alpha_low)));
14
+ --zdt_onboarding_gradient_border: hsla(43, calc(var(--zd-saturation) * 90.39%), calc(44.90% + var(--zdc_default_inverse_low)), calc( 0 + var(--zdc_alpha_low)));
15
+ --zdt_onboarding_primary_button_shadow: hsla(43, calc(var(--zd-saturation) * 90.39%), 44.90, 0.25);
16
+ --zdt_onboarding_gradient_bg: hsla(35, calc(var(--zd-saturation) * 15.00%), calc(15.69% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
17
17
 
18
18
  /* attachment viewer */
19
- --zdt_attachmentviewer_header_bg: hsla(0, 0.00%, calc(9.02% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
20
- --zdt_attachmentviewer_header_border: hsla(0, 0.00%, calc(13.33% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
21
- --zdt_attachmentviewer_footer_bg: hsla(0, 0.00%, calc(9.02% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
22
- --zdt_attachmentviewer_arrow_bg_hover: hsla(0, 0.00%, calc(6.27% + var(--zdc_default)), calc( 0.4 + var(--zdc_alpha_high)));
19
+ --zdt_attachmentviewer_header_bg: hsla(0, calc(var(--zd-saturation) * 0.00%), calc(9.02% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
20
+ --zdt_attachmentviewer_header_border: hsla(0, calc(var(--zd-saturation) * 0.00%), calc(13.33% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
21
+ --zdt_attachmentviewer_footer_bg: hsla(0, calc(var(--zd-saturation) * 0.00%), calc(9.02% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
22
+ --zdt_attachmentviewer_arrow_bg_hover: hsla(0, calc(var(--zd-saturation) * 0.00%), calc(6.27% + var(--zdc_default)), calc( 0.4 + var(--zdc_alpha_high)));
23
23
 
24
24
  /* loader */
25
- --zdt_loader_bg: rgb(215,152,53);
25
+ --zdt_loader_bg: hsla(37, calc(var(--zd-saturation) * 66.94%), 52.55, 1);
26
26
  }
@@ -37,8 +37,7 @@
37
37
  --zd_bs_desktopnotification_container: var(--zd_bs_contrast_outline, 0 4px 20px var(--zdt_desktopnotification_box_shadow));
38
38
 
39
39
  /* onboarding */
40
- --zd_bs_onboarding_close_icon: var(--zd_bs_contrast_outline, 0px 2px 15px rgba(0, 0, 0, 0.09));
40
+ --zd_bs_onboarding_close_icon: var(--zd_bs_contrast_outline, 0px 2px 15px var(--zd-shadow-saturation, rgba(0, 0, 0, 0.09)));
41
41
  --zd_bs_onboarding_gradient: var(--zd_bs_contrast_outline, 0px 20px 30px 0px var(--zdt_onboarding_bg_box_shadow));
42
42
  --zd_bs_onboarding_primary_button: var(--zd_bs_contrast_outline, 0px 4px 20px 0px var(--zdt_onboarding_primary_button_shadow));
43
-
44
43
  }
@@ -7,8 +7,6 @@ import AlertClose from "../AlertClose/AlertClose";
7
7
  import style from "./GlobalNotification.module.css";
8
8
  import { Container, Box } from '@zohodesk/components/es/Layout';
9
9
  import { cancelBubblingEffect } from '@zohodesk/components/es/utils/Common';
10
- import getCurrentTime from '@zohodesk/utils/es/getCurrentTime';
11
- import { STATUS } from "./utils/constants";
12
10
  export default class GlobalNotification extends React.Component {
13
11
  constructor(props) {
14
12
  super(props);
@@ -17,8 +15,6 @@ export default class GlobalNotification extends React.Component {
17
15
  shadowClose: true
18
16
  };
19
17
  this.onClose = this.onClose.bind(this);
20
- this.getNotiifcationData = this.getNotiifcationData.bind(this);
21
- this.handleStatusChange = this.handleStatusChange.bind(this);
22
18
  }
23
19
 
24
20
  componentDidMount() {
@@ -28,44 +24,18 @@ export default class GlobalNotification extends React.Component {
28
24
  id,
29
25
  needAutoClose
30
26
  } = this.props;
31
- this.handleStatusChange(STATUS.MOUNTED);
32
27
 
33
28
  if (needAutoClose) {
34
29
  this.hideMessageTimer = setTimeout(() => {
35
30
  hideMessage(id);
36
- this.handleStatusChange(STATUS.DISMISSING);
37
31
  }, hideTime);
38
32
  }
39
33
  }
40
34
 
41
- componentDidUpdate(prevProps) {
42
- if (prevProps.id === this.props.id && (prevProps.message !== this.props.message || prevProps.type !== this.props.type)) {
43
- this.handleStatusChange(STATUS.UPDATED);
44
- }
45
- }
46
-
47
35
  componentWillUnmount() {
48
36
  if (this.hideMessageTimer) {
49
37
  clearTimeout(this.hideMessageTimer);
50
38
  }
51
-
52
- this.handleStatusChange(STATUS.UNMOUNTED);
53
- }
54
-
55
- handleStatusChange(status) {
56
- const {
57
- onStatusChange
58
- } = this.props;
59
-
60
- if (typeof onStatusChange == 'function') {
61
- const notificationData = this.getNotiifcationData();
62
- const currentTime = getCurrentTime();
63
- onStatusChange({
64
- status,
65
- ...notificationData,
66
- time: currentTime
67
- });
68
- }
69
39
  }
70
40
 
71
41
  onClose(e) {
@@ -77,31 +47,20 @@ export default class GlobalNotification extends React.Component {
77
47
  this.setState({
78
48
  shadowClose: false
79
49
  });
80
- this.handleStatusChange(STATUS.DISMISSING);
81
50
  hideMessage && hideMessage(id);
82
51
  onClose && onClose(e);
83
52
  }
84
53
 
85
- getNotiifcationData() {
86
- const {
87
- id,
88
- type,
89
- message
90
- } = this.props;
91
- return {
92
- id,
93
- type,
94
- message
95
- };
96
- }
97
-
98
54
  render() {
99
55
  let {
56
+ type,
57
+ message,
100
58
  hideMessage,
101
59
  onClick,
102
60
  i18nKeys = {},
103
61
  customProps,
104
62
  dataSelectorId,
63
+ id,
105
64
  needShadow,
106
65
  shadowCount,
107
66
  eleRef
@@ -112,13 +71,15 @@ export default class GlobalNotification extends React.Component {
112
71
  let {
113
72
  closeTitle = 'Close'
114
73
  } = i18nKeys;
115
- const notificationData = this.getNotiifcationData();
116
- return /*#__PURE__*/React.createElement(GlobalNotificationUI, { ...notificationData,
74
+ return /*#__PURE__*/React.createElement(GlobalNotificationUI, {
75
+ type: type,
76
+ message: message,
117
77
  hideMessage: hideMessage,
118
78
  onClick: onClick,
119
79
  closeTitle: closeTitle,
120
80
  customProps: customProps,
121
81
  dataSelectorId: dataSelectorId,
82
+ id: id,
122
83
  shadowCount: shadowCount,
123
84
  onClose: this.onClose,
124
85
  needShadow: shadowClose && needShadow,
@@ -1,7 +1,6 @@
1
1
  import React from 'react';
2
2
  import { render } from '@testing-library/react';
3
3
  import GlobalNotification from "../GlobalNotification";
4
- import { STATUS } from "../utils/constants";
5
4
  describe('GlobalNotification', () => {
6
5
  test('rendering the defult props', () => {
7
6
  const {
@@ -9,12 +8,4 @@ describe('GlobalNotification', () => {
9
8
  } = render( /*#__PURE__*/React.createElement(GlobalNotification, null));
10
9
  expect(asFragment()).toMatchSnapshot();
11
10
  });
12
- });
13
- describe('GlobalNotification Constants', () => {
14
- test('should have correct constant values', () => {
15
- expect(STATUS.MOUNTED).toBe('mounted');
16
- expect(STATUS.UPDATED).toBe('updated');
17
- expect(STATUS.DISMISSING).toBe('dismissing');
18
- expect(STATUS.UNMOUNTED).toBe('unmounted');
19
- });
20
11
  });
@@ -10,13 +10,12 @@ export const propTypes = {
10
10
  customProps: PropTypes.shape({
11
11
  ExtraProps: PropTypes.object
12
12
  }),
13
- id: PropTypes.string,
13
+ id: PropTypes.number,
14
14
  hideTime: PropTypes.number,
15
15
  needAutoClose: PropTypes.bool,
16
16
  isCollapseView: PropTypes.bool,
17
17
  shadowCount: PropTypes.number,
18
- needShadow: PropTypes.bool,
19
- onStatusChange: PropTypes.func
18
+ needShadow: PropTypes.bool
20
19
  };
21
20
  export const UI_propTypes = {
22
21
  dataSelectorId: PropTypes.string,
@@ -29,7 +28,7 @@ export const UI_propTypes = {
29
28
  }),
30
29
  needShadow: PropTypes.bool,
31
30
  shadowCount: PropTypes.number,
32
- id: PropTypes.string,
31
+ id: PropTypes.number,
33
32
  onClose: PropTypes.func
34
33
  };
35
34
  export const new_propTypes = {
@@ -37,8 +37,7 @@
37
37
  --zd_bs_desktopnotification_container: var(--zd_bs_contrast_outline, 0 4px 20px var(--zdt_desktopnotification_box_shadow));
38
38
 
39
39
  /* onboarding */
40
- --zd_bs_onboarding_close_icon: var(--zd_bs_contrast_outline, 0px 2px 15px rgba(0, 0, 0, 0.09));
40
+ --zd_bs_onboarding_close_icon: var(--zd_bs_contrast_outline, 0px 2px 15px var(--zd-shadow-saturation, rgba(0, 0, 0, 0.09)));
41
41
  --zd_bs_onboarding_gradient: var(--zd_bs_contrast_outline, 0px 20px 30px 0px var(--zdt_onboarding_bg_box_shadow));
42
42
  --zd_bs_onboarding_primary_button: var(--zd_bs_contrast_outline, 0px 4px 20px 0px var(--zdt_onboarding_primary_button_shadow));
43
-
44
43
  }
@@ -27,20 +27,10 @@ var _Layout = require("@zohodesk/components/es/Layout");
27
27
 
28
28
  var _Common = require("@zohodesk/components/es/utils/Common");
29
29
 
30
- var _getCurrentTime = _interopRequireDefault(require("@zohodesk/utils/es/getCurrentTime"));
31
-
32
- var _constants = require("./utils/constants");
33
-
34
30
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
35
31
 
36
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); }
37
33
 
38
- function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
39
-
40
- function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
41
-
42
- function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
43
-
44
34
  function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
45
35
 
46
36
  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); } }
@@ -77,61 +67,30 @@ var GlobalNotification = /*#__PURE__*/function (_React$Component) {
77
67
  shadowClose: true
78
68
  };
79
69
  _this.onClose = _this.onClose.bind(_assertThisInitialized(_this));
80
- _this.getNotiifcationData = _this.getNotiifcationData.bind(_assertThisInitialized(_this));
81
- _this.handleStatusChange = _this.handleStatusChange.bind(_assertThisInitialized(_this));
82
70
  return _this;
83
71
  }
84
72
 
85
73
  _createClass(GlobalNotification, [{
86
74
  key: "componentDidMount",
87
75
  value: function componentDidMount() {
88
- var _this2 = this;
89
-
90
76
  var _this$props = this.props,
91
77
  hideMessage = _this$props.hideMessage,
92
78
  hideTime = _this$props.hideTime,
93
79
  id = _this$props.id,
94
80
  needAutoClose = _this$props.needAutoClose;
95
- this.handleStatusChange(_constants.STATUS.MOUNTED);
96
81
 
97
82
  if (needAutoClose) {
98
83
  this.hideMessageTimer = setTimeout(function () {
99
84
  hideMessage(id);
100
-
101
- _this2.handleStatusChange(_constants.STATUS.DISMISSING);
102
85
  }, hideTime);
103
86
  }
104
87
  }
105
- }, {
106
- key: "componentDidUpdate",
107
- value: function componentDidUpdate(prevProps) {
108
- if (prevProps.id === this.props.id && (prevProps.message !== this.props.message || prevProps.type !== this.props.type)) {
109
- this.handleStatusChange(_constants.STATUS.UPDATED);
110
- }
111
- }
112
88
  }, {
113
89
  key: "componentWillUnmount",
114
90
  value: function componentWillUnmount() {
115
91
  if (this.hideMessageTimer) {
116
92
  clearTimeout(this.hideMessageTimer);
117
93
  }
118
-
119
- this.handleStatusChange(_constants.STATUS.UNMOUNTED);
120
- }
121
- }, {
122
- key: "handleStatusChange",
123
- value: function handleStatusChange(status) {
124
- var onStatusChange = this.props.onStatusChange;
125
-
126
- if (typeof onStatusChange == 'function') {
127
- var notificationData = this.getNotiifcationData();
128
- var currentTime = (0, _getCurrentTime["default"])();
129
- onStatusChange(_objectSpread(_objectSpread({
130
- status: status
131
- }, notificationData), {}, {
132
- time: currentTime
133
- }));
134
- }
135
94
  }
136
95
  }, {
137
96
  key: "onClose",
@@ -143,51 +102,42 @@ var GlobalNotification = /*#__PURE__*/function (_React$Component) {
143
102
  this.setState({
144
103
  shadowClose: false
145
104
  });
146
- this.handleStatusChange(_constants.STATUS.DISMISSING);
147
105
  hideMessage && hideMessage(id);
148
106
  onClose && onClose(e);
149
107
  }
150
- }, {
151
- key: "getNotiifcationData",
152
- value: function getNotiifcationData() {
153
- var _this$props3 = this.props,
154
- id = _this$props3.id,
155
- type = _this$props3.type,
156
- message = _this$props3.message;
157
- return {
158
- id: id,
159
- type: type,
160
- message: message
161
- };
162
- }
163
108
  }, {
164
109
  key: "render",
165
110
  value: function render() {
166
- var _this$props4 = this.props,
167
- hideMessage = _this$props4.hideMessage,
168
- onClick = _this$props4.onClick,
169
- _this$props4$i18nKeys = _this$props4.i18nKeys,
170
- i18nKeys = _this$props4$i18nKeys === void 0 ? {} : _this$props4$i18nKeys,
171
- customProps = _this$props4.customProps,
172
- dataSelectorId = _this$props4.dataSelectorId,
173
- needShadow = _this$props4.needShadow,
174
- shadowCount = _this$props4.shadowCount,
175
- eleRef = _this$props4.eleRef;
111
+ var _this$props3 = this.props,
112
+ type = _this$props3.type,
113
+ message = _this$props3.message,
114
+ hideMessage = _this$props3.hideMessage,
115
+ onClick = _this$props3.onClick,
116
+ _this$props3$i18nKeys = _this$props3.i18nKeys,
117
+ i18nKeys = _this$props3$i18nKeys === void 0 ? {} : _this$props3$i18nKeys,
118
+ customProps = _this$props3.customProps,
119
+ dataSelectorId = _this$props3.dataSelectorId,
120
+ id = _this$props3.id,
121
+ needShadow = _this$props3.needShadow,
122
+ shadowCount = _this$props3.shadowCount,
123
+ eleRef = _this$props3.eleRef;
176
124
  var shadowClose = this.state.shadowClose;
177
125
  var _i18nKeys$closeTitle = i18nKeys.closeTitle,
178
126
  closeTitle = _i18nKeys$closeTitle === void 0 ? 'Close' : _i18nKeys$closeTitle;
179
- var notificationData = this.getNotiifcationData();
180
- return /*#__PURE__*/_react["default"].createElement(GlobalNotificationUI, _extends({}, notificationData, {
127
+ return /*#__PURE__*/_react["default"].createElement(GlobalNotificationUI, {
128
+ type: type,
129
+ message: message,
181
130
  hideMessage: hideMessage,
182
131
  onClick: onClick,
183
132
  closeTitle: closeTitle,
184
133
  customProps: customProps,
185
134
  dataSelectorId: dataSelectorId,
135
+ id: id,
186
136
  shadowCount: shadowCount,
187
137
  onClose: this.onClose,
188
138
  needShadow: shadowClose && needShadow,
189
139
  eleRef: eleRef
190
- }));
140
+ });
191
141
  }
192
142
  }]);
193
143
 
@@ -6,8 +6,6 @@ var _react2 = require("@testing-library/react");
6
6
 
7
7
  var _GlobalNotification = _interopRequireDefault(require("../GlobalNotification"));
8
8
 
9
- var _constants = require("../utils/constants");
10
-
11
9
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
12
10
 
13
11
  describe('GlobalNotification', function () {
@@ -17,12 +15,4 @@ describe('GlobalNotification', function () {
17
15
 
18
16
  expect(asFragment()).toMatchSnapshot();
19
17
  });
20
- });
21
- describe('GlobalNotification Constants', function () {
22
- test('should have correct constant values', function () {
23
- expect(_constants.STATUS.MOUNTED).toBe('mounted');
24
- expect(_constants.STATUS.UPDATED).toBe('updated');
25
- expect(_constants.STATUS.DISMISSING).toBe('dismissing');
26
- expect(_constants.STATUS.UNMOUNTED).toBe('unmounted');
27
- });
28
18
  });
@@ -20,13 +20,12 @@ var propTypes = {
20
20
  customProps: _propTypes["default"].shape({
21
21
  ExtraProps: _propTypes["default"].object
22
22
  }),
23
- id: _propTypes["default"].string,
23
+ id: _propTypes["default"].number,
24
24
  hideTime: _propTypes["default"].number,
25
25
  needAutoClose: _propTypes["default"].bool,
26
26
  isCollapseView: _propTypes["default"].bool,
27
27
  shadowCount: _propTypes["default"].number,
28
- needShadow: _propTypes["default"].bool,
29
- onStatusChange: _propTypes["default"].func
28
+ needShadow: _propTypes["default"].bool
30
29
  };
31
30
  exports.propTypes = propTypes;
32
31
  var UI_propTypes = {
@@ -40,7 +39,7 @@ var UI_propTypes = {
40
39
  }),
41
40
  needShadow: _propTypes["default"].bool,
42
41
  shadowCount: _propTypes["default"].number,
43
- id: _propTypes["default"].string,
42
+ id: _propTypes["default"].number,
44
43
  onClose: _propTypes["default"].func
45
44
  };
46
45
  exports.UI_propTypes = UI_propTypes;