@zohodesk/dot 1.0.0-temp-117 → 1.0.0-temp-118

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 (45) hide show
  1. package/README.md +4 -0
  2. package/assets/Appearance/dark/mode/dotDarkMode.module.css +7 -2
  3. package/assets/Appearance/default/mode/dotDefaultMode.module.css +7 -2
  4. package/assets/Appearance/pureDark/mode/dotPureDarkMode.module.css +7 -2
  5. package/css_error.log +13 -1
  6. package/es/AttachmentViewer/AttachmentViewer.module.css +4 -5
  7. package/es/Drawer/Drawer.module.css +42 -3
  8. package/es/Message/Message.module.css +1 -1
  9. package/es/PlusIcon/PlusIcon.module.css +5 -2
  10. package/es/Separator/Separator.js +57 -0
  11. package/es/Separator/Separator.module.css +34 -0
  12. package/es/Separator/props/defaultProps.js +12 -0
  13. package/es/Separator/props/propTypes.js +11 -0
  14. package/es/ToastMessage/ToastMessage.module.css +7 -6
  15. package/es/common/boxShadow.module.css +77 -0
  16. package/es/form/fields/TextEditor/TextEditor.js +3 -3
  17. package/es/form/fields/TextEditor/TextEditor.module.css +161 -63
  18. package/es/layout/SubtabLayout/SubtabLayout.module.css +21 -2
  19. package/es/list/DotNew/DotNew.module.css +8 -5
  20. package/es/list/TagNew/TagNew.module.css +4 -2
  21. package/es/lookup/Section/LookupSection.module.css +2 -2
  22. package/es/utils/editorUtils.js +1 -1
  23. package/es/version2/GlobalNotification/GlobalNotification.module.css +4 -1
  24. package/es/version2/notification/DesktopNotification/DesktopNotification.module.css +23 -2
  25. package/install.md +12 -0
  26. package/lib/AttachmentViewer/AttachmentViewer.module.css +4 -5
  27. package/lib/Drawer/Drawer.module.css +42 -3
  28. package/lib/Message/Message.module.css +1 -1
  29. package/lib/PlusIcon/PlusIcon.module.css +5 -2
  30. package/lib/Separator/Separator.js +82 -0
  31. package/lib/Separator/Separator.module.css +34 -0
  32. package/lib/Separator/props/defaultProps.js +19 -0
  33. package/lib/Separator/props/propTypes.js +19 -0
  34. package/lib/ToastMessage/ToastMessage.module.css +7 -6
  35. package/lib/common/boxShadow.module.css +77 -0
  36. package/lib/form/fields/TextEditor/TextEditor.js +3 -3
  37. package/lib/form/fields/TextEditor/TextEditor.module.css +161 -63
  38. package/lib/layout/SubtabLayout/SubtabLayout.module.css +21 -2
  39. package/lib/list/DotNew/DotNew.module.css +8 -5
  40. package/lib/list/TagNew/TagNew.module.css +4 -2
  41. package/lib/lookup/Section/LookupSection.module.css +2 -2
  42. package/lib/utils/editorUtils.js +1 -1
  43. package/lib/version2/GlobalNotification/GlobalNotification.module.css +4 -1
  44. package/lib/version2/notification/DesktopNotification/DesktopNotification.module.css +23 -2
  45. package/package.json +3 -3
@@ -1,11 +1,13 @@
1
1
  .varClass {
2
2
  --borderColor: var(--zdt_subtablayout_border);
3
3
  }
4
+
4
5
  .tabHead,
5
6
  .shadowStyle {
6
7
  position: relative;
7
8
  composes: varClass;
8
9
  }
10
+
9
11
  .tabHead, .shadowStyle {
10
12
  background: var(--zdt_subtablayout_tabhead_bg);
11
13
  }
@@ -44,6 +46,7 @@
44
46
  .primary_borderStyle, .secondary_borderStyle {
45
47
  border-bottom: 1px solid var(--zdt_subtablayout_primary_border);
46
48
  }
49
+
47
50
  .tertiary_borderStyle {
48
51
  border-bottom: 1px solid var(--borderColor);
49
52
  }
@@ -54,7 +57,7 @@
54
57
  position: absolute;
55
58
  top: var(--zd_size20);
56
59
  z-index: -1;
57
- box-shadow: 0 0 6px var(--zdt_subtablayout_shadowstyle_box_shadow);
60
+ box-shadow: var(--bs_subtablayout_shadow);
58
61
  border-radius: 100px/10px;
59
62
  }
60
63
 
@@ -94,53 +97,69 @@
94
97
  [dir=rtl] .primary, [dir=rtl] .primary_peek, [dir=rtl] .secondary, [dir=rtl] .secondary_peek, [dir=rtl] .primary_detailFooter, [dir=rtl] .primary_peekFooter, [dir=rtl] .secondary_detailFooter, [dir=rtl] .secondary_peekFooter {
95
98
  padding-right: var(--zd_size25);
96
99
  }
100
+
97
101
  [dir=ltr] .primary, [dir=ltr] .primary_peek {
98
102
  padding-right: var(--zd_size25);
99
103
  }
104
+
100
105
  [dir=rtl] .primary, [dir=rtl] .primary_peek {
101
106
  padding-left: var(--zd_size25);
102
107
  }
108
+
103
109
  [dir=ltr] .secondary, [dir=ltr] .secondary_peek {
104
110
  padding-right: var(--zd_size115);
105
111
  }
112
+
106
113
  [dir=rtl] .secondary, [dir=rtl] .secondary_peek {
107
114
  padding-left: var(--zd_size115);
108
115
  }
116
+
109
117
  [dir=ltr] .primary_detailFooter, [dir=ltr] .primary_peekFooter {
110
118
  padding-right: var(--zd_size25);
111
119
  }
120
+
112
121
  [dir=rtl] .primary_detailFooter, [dir=rtl] .primary_peekFooter {
113
122
  padding-left: var(--zd_size25);
114
123
  }
124
+
115
125
  [dir=ltr] .secondary_detailFooter, [dir=ltr] .secondary_peekFooter {
116
126
  padding-right: var(--zd_size115);
117
127
  }
128
+
118
129
  [dir=rtl] .secondary_detailFooter, [dir=rtl] .secondary_peekFooter {
119
130
  padding-left: var(--zd_size115);
120
131
  }
132
+
121
133
  .tertiary,
122
134
  .tertiary_peek {
123
135
  height: var(--zd_size50);
124
136
  }
137
+
125
138
  .tertiary, .tertiary_detailFooter {
126
139
  padding: 0 var(--zd_size65);
127
140
  }
141
+
128
142
  .tertiary_peek, .tertiary_peekFooter {
129
143
  padding: 0 var(--zd_size42);
130
144
  }
145
+
131
146
  .cursor {
132
147
  cursor: pointer;
133
148
  }
149
+
134
150
  .footer {
135
151
  composes: varClass;
136
152
  border-top: 1px solid var(--borderColor);
137
153
  }
154
+
138
155
  .medium {
139
156
  height: var(--zd_size40);
140
157
  }
158
+
141
159
  .large {
142
160
  height: var(--zd_size45);
143
161
  }
162
+
144
163
  .xlarge {
145
164
  height: var(--zd_size50);
146
- }
165
+ }
@@ -2,21 +2,24 @@
2
2
  width: var(--zd_size6);
3
3
  height: var(--zd_size6);
4
4
  }
5
- .small{
5
+
6
+ .small {
6
7
  width: var(--zd_size5);
7
8
  height: var(--zd_size5);
8
9
  }
9
- .container{
10
+
11
+ .container {
10
12
  composes: dInflex alignVertical from '~@zohodesk/components/lib/common/common.module.css';
11
- /* animation: dotAnimation 1.25s infinite cubic-bezier(0.66, 0.33, 0, 1);
13
+ /* animation: dotAnimation 1.25s infinite cubic-bezier(0.66, 0.33, 0, 1);
12
14
  box-shadow: 0 0 0 0 var(--dot_catskillWhite),
13
15
  0 0 0 0 rgba(10, 115, 235, 0.6); */
14
16
  border-radius: 50%;
15
17
  background-color: var(--zdt_dotnew_default_bg);
16
- box-shadow: 0 0 15px 1px var(--zdt_dotnew_default_box_shadow);
18
+ box-shadow: var(--bs_dotnew_shadow);
17
19
  }
20
+
18
21
  @keyframes dotAnimation {
19
22
  to {
20
23
  box-shadow: 0 0 0 12px var(--zdt_dotnew_animate_box_shadow), 0 0 0 8px var(--zdt_dotnew_animate_to_box_shadow);
21
24
  }
22
- }
25
+ }
@@ -10,7 +10,7 @@
10
10
  visibility: hidden;
11
11
  border-radius: var(--zd_size14);
12
12
  background-color: var(--zdt_tagnew_default_bg);
13
- box-shadow: 0 8px 30px 0 var(--zdt_tagnew_default_box_shadow);
13
+ box-shadow: var(--bs_tagnew_shadow);
14
14
  padding: 0 var(--zd_size15);
15
15
  transform: scale(0);
16
16
  cursor: pointer;
@@ -31,6 +31,7 @@
31
31
  }
32
32
 
33
33
  @keyframes bounceIn {
34
+
34
35
  0%,
35
36
  20%,
36
37
  40%,
@@ -73,6 +74,7 @@
73
74
  }
74
75
 
75
76
  @-webkit-keyframes bounceIn {
77
+
76
78
  0%,
77
79
  20%,
78
80
  40%,
@@ -112,4 +114,4 @@
112
114
  -webkit-transform: scale3d(1, 1, 1);
113
115
  transform: scale3d(1, 1, 1);
114
116
  }
115
- }
117
+ }
@@ -4,5 +4,5 @@
4
4
  height: auto;
5
5
  border-radius: 0 0 var(--zd_size10) var(--zd_size10);
6
6
  background-color: var(--zdt_lookupsection_bg);
7
- box-shadow: 0px 4px 20px var(--zdt_lookupsection_box_shadow);
8
- }
7
+ box-shadow: var(--bs_lookupsection_shadow);
8
+ }
@@ -82,7 +82,7 @@ function triggerKeyup(elem) {
82
82
  // editor
83
83
 
84
84
  function getRichEditorContent(key) {
85
- var richTextEditor = editor[key];
85
+ var richTextEditor = global.editor[key];
86
86
  if (richTextEditor != undefined) {
87
87
  var content = richTextEditor.getContent();
88
88
  content = content.trim();
@@ -5,6 +5,7 @@
5
5
  --globalnotification_text_color: var(--zdt_globalnotification_default_text);
6
6
  --globalnotification_box_shadow: var(--zdt_globalnotification_default_box_shadow);
7
7
  }
8
+
8
9
  .message {
9
10
  composes: varClass;
10
11
  position: absolute;
@@ -14,10 +15,12 @@
14
15
  pointer-events: none;
15
16
  text-align: center;
16
17
  }
18
+
17
19
  [dir=ltr] .message {
18
20
  right: 0;
19
21
  left: 0;
20
22
  }
23
+
21
24
  [dir=rtl] .message {
22
25
  left: 0;
23
26
  right: 0;
@@ -29,7 +32,7 @@
29
32
  color: var(--globalnotification_text_color);
30
33
  max-width: var(--zd_size490);
31
34
  composes: wbreak from '~@zohodesk/components/lib/common/common.module.css';
32
- box-shadow: 0 4px 20px var(--globalnotification_box_shadow);
35
+ box-shadow: var(--bs_globalnotification_container);
33
36
  border-radius: 0 0 var(--zd_size10) var(--zd_size10);
34
37
  background-color: var(--globalnotification_bg_color);
35
38
  border-style: solid;
@@ -2,6 +2,7 @@
2
2
  position: relative;
3
3
  margin-bottom: var(--zd_size7);
4
4
  }
5
+
5
6
  .container {
6
7
  color: var(--zdt_desktopnotification_text);
7
8
  transition: all var(--zd_transition4);
@@ -9,56 +10,69 @@
9
10
  max-height: 100%;
10
11
  pointer-events: auto;
11
12
  background-color: var(--zdt_desktopnotification_bg);
12
- box-shadow: 0 4px 20px var(--zdt_desktopnotification_box_shadow);
13
+ box-shadow: var(--bs_desktopnotification_container);
13
14
  border-radius: 0 0 var(--zd_size10) var(--zd_size10);
14
15
  }
16
+
15
17
  [dir=ltr] .container {
16
18
  transform-origin: right center;
17
19
  }
20
+
18
21
  [dir=rtl] .container {
19
22
  transform-origin: left center;
20
23
  }
24
+
21
25
  .globalNotify {
22
26
  max-width: var(--zd_size490);
23
27
  min-width: var(--zd_size394);
24
28
  }
29
+
25
30
  /* Size */
26
31
  .medium {
27
32
  width: var(--zd_size452);
28
33
  }
34
+
29
35
  .large {
30
36
  width: var(--zd_size580);
31
37
  }
38
+
32
39
  /* Animation Style */
33
40
  .closeAnimation {
34
41
  max-height: 0;
35
42
  transition: all var(--zd_transition3) 0.4s;
36
43
  margin-bottom: 0;
37
44
  }
45
+
38
46
  .animation {
39
47
  composes: modeForward from '~@zohodesk/components/lib/common/animation.module.css';
40
48
  }
49
+
41
50
  [dir=ltr] .animation {
42
51
  animation-duration: var(--zd_transition4);
43
52
  -webkit-animation-duration: var(--zd_transition4);
44
53
  }
54
+
45
55
  [dir=rtl] .animation {
46
56
  animation-duration: var(--zd_transition4);
47
57
  -webkit-animation-duration: var(--zd_transition4);
48
58
  }
59
+
49
60
  .leftanimate {
50
61
  composes: slideLeft from '~@zohodesk/components/lib/common/animation.module.css';
51
62
  composes: animation;
52
63
  }
64
+
53
65
  .leftnoanimate {
54
66
  opacity: 1;
55
67
  transform: translateX(0) scale(1);
56
68
  }
69
+
57
70
  .rightanimate {
58
71
  composes: slideRight from '~@zohodesk/components/lib/common/animation.module.css';
59
72
  composes: animation;
60
73
  composes: closeAnimation;
61
74
  }
75
+
62
76
  /* Container Style */
63
77
  .message {
64
78
  position: relative;
@@ -76,31 +90,38 @@
76
90
  [dir=rtl] .message {
77
91
  padding: var(--zd_size10) var(--zd_size76) var(--zd_size10) var(--zd_size20);
78
92
  }
93
+
79
94
  .message:hover {
80
95
  background: var(--zd_alabaster);
81
96
  }
97
+
82
98
  /* Section */
83
99
  .section {
84
100
  padding: var(--zd_size15) var(--zd_size30) var(--zd_size30);
85
101
  }
102
+
86
103
  .subTitle {
87
104
  font-size: var(--zd_font_size15);
88
105
  line-height: var(--zd_size20);
89
106
  font-family: var(--zd_semibold);
90
107
  composes: ftsmooth wbreak from '~@zohodesk/components/lib/common/common.module.css';
91
108
  }
109
+
92
110
  .subTitleMargin {
93
111
  margin-bottom: var(--zd_size17);
94
112
  }
113
+
95
114
  .infoText {
96
115
  font-size: var(--zd_font_size14);
97
116
  line-height: var(--zd_size18);
98
117
  composes: wbreak from '~@zohodesk/components/lib/common/common.module.css';
99
118
  }
119
+
100
120
  .secondaryInfo {
101
121
  margin-top: var(--zd_size20);
102
122
  }
123
+
103
124
  .footer {
104
125
  overflow: hidden;
105
126
  border-radius: 0 0 var(--zd_size10) var(--zd_size10);
106
- }
127
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@zohodesk/dot",
3
- "version": "1.0.0-temp-117",
3
+ "version": "1.0.0-temp-118",
4
4
  "main": "lib/index",
5
5
  "module": "es/index.js",
6
6
  "private": false,
@@ -44,7 +44,7 @@
44
44
  "velocity-react": "1.4.3",
45
45
  "@zohodesk/variables": "1.0.0-temp.30",
46
46
  "@zohodesk/i18n": "1.0.0-beta.7",
47
- "@zohodesk/components": "1.0.0-temp-116",
47
+ "@zohodesk/components": "1.0.0-temp-117",
48
48
  "@zohodesk/icons": "1.0.0-beta.109",
49
49
  "@zohodesk/svg": "1.0.0-temp.48",
50
50
  "@zohodesk/virtualizer": "1.0.3",
@@ -55,7 +55,7 @@
55
55
  "velocity-react": "1.4.3",
56
56
  "@zohodesk/variables": "1.0.0-temp.30",
57
57
  "@zohodesk/i18n": "1.0.0-beta.7",
58
- "@zohodesk/components": "1.0.0-temp-116",
58
+ "@zohodesk/components": "1.0.0-temp-117",
59
59
  "@zohodesk/icons": "1.0.0-beta.109",
60
60
  "@zohodesk/svg": "1.0.0-temp.48",
61
61
  "@zohodesk/a11y": "1.3.7"