@zohodesk/dot 1.0.0-beta.215 → 1.0.0-beta.218
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +13 -0
- package/assets/Appearance/dark/mode/dotDarkMode.module.css +10 -0
- package/assets/Appearance/dark/themes/blue/blueDarkDotTheme.module.css +6 -0
- package/assets/Appearance/dark/themes/green/greenDarkDotTheme.module.css +6 -0
- package/assets/Appearance/dark/themes/orange/orangeDarkDotTheme.module.css +6 -0
- package/assets/Appearance/dark/themes/red/redDarkDotTheme.module.css +6 -0
- package/assets/Appearance/dark/themes/yellow/yellowDarkDotTheme.module.css +6 -0
- package/assets/Appearance/default/mode/dotDefaultMode.module.css +10 -0
- package/assets/Appearance/default/themes/blue/blueDefaultDotTheme.module.css +6 -0
- package/assets/Appearance/default/themes/green/greenDefaultDotTheme.module.css +6 -0
- package/assets/Appearance/default/themes/orange/orangeDefaultDotTheme.module.css +6 -0
- package/assets/Appearance/default/themes/red/redDefaultDotTheme.module.css +6 -0
- package/assets/Appearance/default/themes/yellow/yellowDefaultDotTheme.module.css +6 -0
- package/es/ActionButton/ActionButton.module.css +25 -9
- package/es/AlphabeticList/AlphabeticList.module.css +7 -4
- package/es/Attachment/Attachment.module.css +20 -9
- package/es/AttachmentViewer/Attachment.js +17 -0
- package/es/AttachmentViewer/AttachmentImage.js +85 -0
- package/es/AttachmentViewer/AttachmentViewer.js +530 -0
- package/es/AttachmentViewer/AttachmentViewer.module.css +346 -0
- package/es/AttachmentViewer/utils.js +107 -0
- package/es/ChannelIcon/ChannelIcon.module.css +30 -21
- package/es/Drawer/Drawer.module.css +59 -11
- package/es/FlipCard/FlipCard.module.css +14 -5
- package/es/FormAction/FormAction.module.css +34 -9
- package/es/FreezeLayer/FreezeLayer.module.css +6 -2
- package/es/IconButton/IconButton.module.css +1 -1
- package/es/ImportantNotes/ImportantNotes.module.css +7 -2
- package/es/Loader/Loader.module.css +25 -4
- package/es/Message/Message.module.css +42 -9
- package/es/MessageBanner/MessageBanner.module.css +12 -4
- package/es/NewStar/NewStar.module.css +42 -5
- package/es/ToastMessage/ToastMessage.module.css +96 -25
- package/es/Upload/Upload.module.css +27 -8
- package/es/alert/AlertHeader/AlertHeader.module.css +21 -3
- package/es/alert/AlertLookup/AlertLookup.module.css +6 -2
- package/es/avatar/AvatarClose/AvatarClose.module.css +9 -3
- package/es/avatar/AvatarCollision/AvatarCollision.module.css +18 -4
- package/es/avatar/AvatarIcon/AvatarIcon.module.css +3 -4
- package/es/avatar/AvatarStatus/AvatarStatus.module.css +59 -9
- package/es/avatar/AvatarThread/AvatarThread.module.css +55 -5
- package/es/avatar/AvatarUser/AvatarUser.module.css +81 -10
- package/es/avatar/AvatarWithTeam/AvatarWithTeam.module.css +10 -3
- package/es/common/dot_animation.module.css +27 -0
- package/es/common/dot_common.module.css +4 -0
- package/es/deprecated/SelectDropdown/SelectDropdown.module.css +11 -3
- package/es/dropdown/ToggleDropDown/ToggleDropDown.module.css +19 -6
- package/es/emptystate/CommonEmptyState/CommonEmptyState.module.css +12 -4
- package/es/emptystate/EditionPage/EditionPage.css +9 -3
- package/es/errorstate/EmptyStates.module.css +13 -10
- package/es/errorstate/Inconvenience/Inconvenience.module.css +3 -0
- package/es/errorstate/LinkText/LinkText.module.css +1 -1
- package/es/errorstate/PermissionPlay/PermissionPlay.module.css +2 -2
- package/es/errorstate/WillBack/WillBack.module.css +1 -3
- package/es/form/fields/CurrencyField/CurrencyField.js +1 -1
- package/es/form/fields/Fields.module.css +49 -14
- package/es/form/fields/TagsMultiSelect/TagsMultiSelect.js +7 -4
- package/es/form/fields/TagsMultiSelect/TagsMultiSelect.module.css +19 -7
- package/es/form/fields/TagsMultiSelectField/TagsMultiSelectField.module.css +4 -1
- package/es/form/fields/TextEditor/TextEditor.module.css +149 -72
- package/es/form/fields/TextEditorWrapper/TextEditorWrapper.module.css +13 -2
- package/es/form/fields/ValidationMessage/ValidationMessage.module.css +9 -4
- package/es/layout/SetupDetailLayout/SetupDetailLayout.module.css +52 -16
- package/es/layout/SubtabLayout/SubtabLayout.module.css +55 -29
- package/es/list/BluePrintStatus/BluePrintStatus.module.css +4 -1
- package/es/list/Comment/Comment.module.css +5 -0
- package/es/list/DotNew/DotNew.module.css +3 -3
- package/es/list/GridStencils/GridStencils.module.css +70 -16
- package/es/list/Icons/Icons.module.css +1 -1
- package/es/list/ListLayout/ListLayout.module.css +22 -14
- package/es/list/ListStencils/ListStencils.module.css +11 -6
- package/es/list/SecondaryText/SecondaryText.module.css +13 -3
- package/es/list/SentimentStatus/SentimentStatus.module.css +4 -1
- package/es/list/TagNew/TagNew.module.css +14 -7
- package/es/list/Thread/Thread.module.css +13 -1
- package/es/list/UserTime/UserTime.module.css +6 -0
- package/es/list/listCommon.module.css +9 -1
- package/es/list/status/StatusDropdown/StatusDropdown.module.css +19 -6
- package/es/list/status/StatusListItem/StatusListItem.module.css +38 -15
- package/es/lookup/Lookup/Lookup.module.css +2 -2
- package/es/lookup/Section/LookupSection.module.css +2 -2
- package/es/lookup/header/Close/LookupClose.module.css +4 -4
- package/es/lookup/header/Search/LookupSearch.module.css +21 -12
- package/es/lookup/header/TicketHeader/TicketHeader.module.css +5 -2
- package/es/lookup/header/ViewDropDown/ViewDropDown.module.css +8 -3
- package/es/lookup/header/lookupHeaderCommon.module.css +16 -6
- package/es/lookup/header/lookupHeaderCommonResponsive.module.css +12 -3
- package/es/setup/header/Button/HeaderButton.module.css +3 -1
- package/es/setup/header/Link/HeaderLink.module.css +7 -1
- package/es/setup/header/Search/Search.module.css +19 -8
- package/es/setup/header/Views/Views.module.css +15 -5
- package/es/setup/helptips/Link/HelpTipsLink.module.css +1 -0
- package/es/setup/helptips/ListGroup/ListGroup.module.css +6 -1
- package/es/setup/table/TableData/SetupTableData.module.css +11 -3
- package/es/setup/table/TableHead/SetupTableHead.module.css +4 -0
- package/es/setup/table/TableRow/SetupTableRow.module.css +6 -2
- package/es/version2/AlertClose/AlertClose.module.css +1 -1
- package/es/version2/GlobalNotification/GlobalNotification.module.css +44 -9
- package/es/version2/lookup/AlertHeader/AlertHeaderNew.module.css +25 -2
- package/es/version2/lookup/AlertLookup/AlertLookupNew.module.css +7 -3
- package/es/version2/lookup/alertLookupCommonNew.module.css +8 -1
- package/es/version2/notification/DesktopNotification/DesktopNotification.module.css +26 -10
- package/es/version2/notification/DesktopNotificationHeader/DesktopNotificationHeader.module.css +47 -10
- package/images/audio_thumbnail.png +0 -0
- package/lib/ActionButton/ActionButton.module.css +0 -1
- package/lib/AttachmentViewer/Attachment.js +28 -0
- package/lib/AttachmentViewer/AttachmentImage.js +129 -0
- package/lib/AttachmentViewer/AttachmentViewer.js +613 -0
- package/lib/AttachmentViewer/AttachmentViewer.module.css +346 -0
- package/lib/AttachmentViewer/utils.js +134 -0
- package/lib/FreezeLayer/FreezeLayer.js +31 -4
- package/lib/Provider/Config.js +21 -0
- package/lib/common/dot_animation.module.css +27 -0
- package/lib/common/dot_common.module.css +4 -0
- package/lib/deprecated/utils/General.js +29 -0
- package/lib/form/fields/CheckBoxField/CheckBoxField.js +1 -1
- package/lib/form/fields/CurrencyField/CurrencyField.js +9 -8
- package/lib/form/fields/DateField/DateField.js +1 -1
- package/lib/form/fields/MultiSelectField/MultiSelectField.js +1 -1
- package/lib/form/fields/PhoneField/PhoneField.js +1 -1
- package/lib/form/fields/RadioField/RadioField.js +1 -1
- package/lib/form/fields/SelectField/SelectField.js +1 -1
- package/lib/form/fields/TagsMultiSelect/TagsMultiSelect.js +7 -4
- package/lib/form/fields/TextBoxField/TextBoxField.js +1 -1
- package/lib/form/fields/TextEditor/TextEditor.module.css +13 -2
- package/lib/form/fields/TextareaField/TextareaField.js +1 -1
- package/lib/list/status/StatusDropdown/StatusDropdown.js +44 -37
- package/lib/setup/header/Views/Views.js +2 -2
- package/lib/utils/General.js +0 -24
- package/package.json +15 -13
|
@@ -1,5 +1,7 @@
|
|
|
1
|
-
.container {
|
|
1
|
+
[dir=ltr] .container {
|
|
2
2
|
padding-left: var(--zd_size20);
|
|
3
|
+
}[dir=rtl] .container {
|
|
4
|
+
padding-right: var(--zd_size20);
|
|
3
5
|
}
|
|
4
6
|
.size70 {
|
|
5
7
|
flex-basis: var(--zd_size70);
|
|
@@ -28,9 +30,15 @@
|
|
|
28
30
|
.center {
|
|
29
31
|
text-align: center;
|
|
30
32
|
}
|
|
31
|
-
.left {
|
|
33
|
+
[dir=ltr] .left {
|
|
32
34
|
text-align: left;
|
|
33
35
|
}
|
|
34
|
-
.
|
|
36
|
+
[dir=rtl] .left {
|
|
35
37
|
text-align: right;
|
|
36
38
|
}
|
|
39
|
+
[dir=ltr] .right {
|
|
40
|
+
text-align: right;
|
|
41
|
+
}
|
|
42
|
+
[dir=rtl] .right {
|
|
43
|
+
text-align: left;
|
|
44
|
+
}
|
|
@@ -1,7 +1,11 @@
|
|
|
1
1
|
.container {
|
|
2
2
|
border-bottom: 1px solid var(--zdt_setuptablehead_border);
|
|
3
|
+
}[dir=ltr] .container {
|
|
3
4
|
padding-right: var(--zd_size40);
|
|
4
5
|
padding-left: var(--zd_size40);
|
|
6
|
+
}[dir=rtl] .container {
|
|
7
|
+
padding-left: var(--zd_size40);
|
|
8
|
+
padding-right: var(--zd_size40);
|
|
5
9
|
}
|
|
6
10
|
.subContainer {
|
|
7
11
|
height: var(--zd_size40);
|
|
@@ -1,9 +1,13 @@
|
|
|
1
1
|
.container {
|
|
2
2
|
position: relative;
|
|
3
|
+
height: var(--zd_size52);
|
|
4
|
+
border-bottom: 1px solid var(--zdt_setuptablerow_border);
|
|
5
|
+
}[dir=ltr] .container {
|
|
3
6
|
margin-right: var(--zd_size40);
|
|
4
7
|
margin-left: var(--zd_size40);
|
|
5
|
-
|
|
6
|
-
|
|
8
|
+
}[dir=rtl] .container {
|
|
9
|
+
margin-left: var(--zd_size40);
|
|
10
|
+
margin-right: var(--zd_size40);
|
|
7
11
|
}
|
|
8
12
|
.container:hover {
|
|
9
13
|
background-color: var( --zdt_setuptablerow_hover_bg);
|
|
@@ -11,25 +11,38 @@
|
|
|
11
11
|
top: 0;
|
|
12
12
|
z-index: 1000;
|
|
13
13
|
/*Hook for editor alert*/
|
|
14
|
-
|
|
14
|
+
pointer-events: none;
|
|
15
15
|
text-align: center;
|
|
16
|
+
}
|
|
17
|
+
[dir=ltr] .message {
|
|
18
|
+
right: 0;
|
|
16
19
|
left: 0;
|
|
17
|
-
|
|
20
|
+
}
|
|
21
|
+
[dir=rtl] .message {
|
|
22
|
+
left: 0;
|
|
23
|
+
right: 0;
|
|
18
24
|
}
|
|
19
25
|
|
|
20
26
|
.container {
|
|
21
|
-
padding: var(--zd_size18) var(--zd_size70) var(--zd_size19) var(--zd_size75);
|
|
22
27
|
position: relative;
|
|
23
28
|
pointer-events: initial;
|
|
29
|
+
color: var(--globalnotification_text_color);
|
|
30
|
+
max-width: var(--zd_size490);
|
|
31
|
+
composes: wbreak from '~@zohodesk/components/lib/common/common.module.css';
|
|
24
32
|
box-shadow: 0 4px 20px var(--globalnotification_box_shadow);
|
|
25
33
|
border-radius: 0 0 var(--zd_size10) var(--zd_size10);
|
|
26
34
|
background-color: var(--globalnotification_bg_color);
|
|
27
35
|
border-style: solid;
|
|
28
36
|
border-color: var(--commonalert_border_color);
|
|
29
37
|
border-width: 2px 1px 1px 1px;
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
[dir=ltr] .container {
|
|
41
|
+
padding: var(--zd_size18) var(--zd_size70) var(--zd_size19) var(--zd_size75);
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
[dir=rtl] .container {
|
|
45
|
+
padding: var(--zd_size18) var(--zd_size75) var(--zd_size19) var(--zd_size70);
|
|
33
46
|
}
|
|
34
47
|
|
|
35
48
|
.icon {
|
|
@@ -38,10 +51,17 @@
|
|
|
38
51
|
position: absolute;
|
|
39
52
|
top: 0;
|
|
40
53
|
bottom: 0;
|
|
41
|
-
left: var(--zd_size18);
|
|
42
54
|
margin: auto 0;
|
|
43
55
|
}
|
|
44
56
|
|
|
57
|
+
[dir=ltr] .icon {
|
|
58
|
+
left: var(--zd_size18);
|
|
59
|
+
}
|
|
60
|
+
|
|
61
|
+
[dir=rtl] .icon {
|
|
62
|
+
right: var(--zd_size18);
|
|
63
|
+
}
|
|
64
|
+
|
|
45
65
|
.success {
|
|
46
66
|
--commonalert_border_color: var(--zdt_commonalert_success_border);
|
|
47
67
|
--globalnotification_bg_color: var(--zdt_globalnotification_success_bg);
|
|
@@ -76,15 +96,30 @@
|
|
|
76
96
|
font-size: var(--zd_font_size14);
|
|
77
97
|
font-family: var(--zd_semibold);
|
|
78
98
|
composes: ftsmooth from '~@zohodesk/components/lib/common/common.module.css';
|
|
79
|
-
text-align: left;
|
|
80
99
|
line-height: var(--zd_size20);
|
|
81
100
|
}
|
|
82
101
|
|
|
102
|
+
[dir=ltr] .text {
|
|
103
|
+
text-align: left;
|
|
104
|
+
}
|
|
105
|
+
|
|
106
|
+
[dir=rtl] .text {
|
|
107
|
+
text-align: right;
|
|
108
|
+
}
|
|
109
|
+
|
|
83
110
|
.close {
|
|
84
111
|
position: absolute;
|
|
85
112
|
top: 0;
|
|
86
113
|
bottom: 0;
|
|
114
|
+
height: var(--zd_size25);
|
|
115
|
+
}
|
|
116
|
+
|
|
117
|
+
[dir=ltr] .close {
|
|
87
118
|
right: var(--zd_size12);
|
|
88
119
|
margin: auto 0 auto var(--zd_size25);
|
|
89
|
-
|
|
120
|
+
}
|
|
121
|
+
|
|
122
|
+
[dir=rtl] .close {
|
|
123
|
+
left: var(--zd_size12);
|
|
124
|
+
margin: auto var(--zd_size25) auto 0;
|
|
90
125
|
}
|
|
@@ -11,8 +11,13 @@
|
|
|
11
11
|
}
|
|
12
12
|
.headerLayout {
|
|
13
13
|
min-height: var(--zd_size54);
|
|
14
|
+
}
|
|
15
|
+
[dir=ltr] .headerLayout {
|
|
14
16
|
padding: var(--zd_size15) var(--zd_size45) 0 var(--zd_size20);
|
|
15
17
|
}
|
|
18
|
+
[dir=rtl] .headerLayout {
|
|
19
|
+
padding: var(--zd_size15) var(--zd_size20) 0 var(--zd_size45);
|
|
20
|
+
}
|
|
16
21
|
|
|
17
22
|
.success {
|
|
18
23
|
--commonalert_border_color: var(--zdt_commonalert_success_border);
|
|
@@ -34,10 +39,14 @@
|
|
|
34
39
|
--commonalert_border_color: var(--zdt_commonalert_warning_border);
|
|
35
40
|
}
|
|
36
41
|
|
|
37
|
-
.extraSmall {
|
|
42
|
+
[dir=ltr] .extraSmall {
|
|
38
43
|
padding: var(--zd_size12) var(--zd_size45) var(--zd_size12) var(--zd_size16);
|
|
39
44
|
}
|
|
40
45
|
|
|
46
|
+
[dir=rtl] .extraSmall {
|
|
47
|
+
padding: var(--zd_size12) var(--zd_size16) var(--zd_size12) var(--zd_size45);
|
|
48
|
+
}
|
|
49
|
+
|
|
41
50
|
.iconContainer {
|
|
42
51
|
height: var(--zd_size51);
|
|
43
52
|
width: var(--zd_size51);
|
|
@@ -45,7 +54,6 @@
|
|
|
45
54
|
|
|
46
55
|
.title {
|
|
47
56
|
color: var(--zdt_alertlookupnew_text);
|
|
48
|
-
margin: 0 var(--zd_size5) 0 var(--zd_size10);
|
|
49
57
|
font-size: var(--zd_font_size18);
|
|
50
58
|
line-height: var(--zd_size22);
|
|
51
59
|
font-family: var(--zd_bold);
|
|
@@ -53,6 +61,14 @@
|
|
|
53
61
|
vertical-align: middle;
|
|
54
62
|
}
|
|
55
63
|
|
|
64
|
+
[dir=ltr] .title {
|
|
65
|
+
margin: 0 var(--zd_size5) 0 var(--zd_size10);
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
[dir=rtl] .title {
|
|
69
|
+
margin: 0 var(--zd_size10) 0 var(--zd_size5);
|
|
70
|
+
}
|
|
71
|
+
|
|
56
72
|
.iconStyle {
|
|
57
73
|
display: block;
|
|
58
74
|
}
|
|
@@ -60,5 +76,12 @@
|
|
|
60
76
|
.close {
|
|
61
77
|
position: absolute;
|
|
62
78
|
top: var(--zd_size12);
|
|
79
|
+
}
|
|
80
|
+
|
|
81
|
+
[dir=ltr] .close {
|
|
63
82
|
right: var(--zd_size12);
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
[dir=rtl] .close {
|
|
86
|
+
left: var(--zd_size12);
|
|
64
87
|
}
|
|
@@ -3,17 +3,21 @@
|
|
|
3
3
|
}
|
|
4
4
|
|
|
5
5
|
.innerSection {
|
|
6
|
-
padding: var(--zd_size17) var(--zd_size30) var(--zd_size30);
|
|
7
6
|
color: var(--zdt_alertlookupnew_text);
|
|
8
7
|
font-size: var(--zd_font_size14);
|
|
9
8
|
line-height: var(--zd_size18);
|
|
10
9
|
composes: wbreak from '~@zohodesk/components/lib/common/common.module.css';
|
|
10
|
+
padding: var(--zd_size17) var(--zd_size30) var(--zd_size30);
|
|
11
11
|
}
|
|
12
12
|
|
|
13
|
-
.buttonGap {
|
|
13
|
+
[dir=ltr] .buttonGap {
|
|
14
14
|
margin: 0 0 0 var(--zd_size12);
|
|
15
15
|
}
|
|
16
16
|
|
|
17
|
+
[dir=rtl] .buttonGap {
|
|
18
|
+
margin: 0 var(--zd_size12) 0 0;
|
|
19
|
+
}
|
|
20
|
+
|
|
17
21
|
.confirmMsgText {
|
|
18
22
|
margin-top: var(--zd_size20);
|
|
19
23
|
}
|
|
@@ -23,8 +27,8 @@
|
|
|
23
27
|
}
|
|
24
28
|
|
|
25
29
|
.footer {
|
|
26
|
-
border-radius: 0 0 var(--zd_size10) var(--zd_size10);
|
|
27
30
|
overflow: hidden;
|
|
31
|
+
border-radius: 0 0 var(--zd_size10) var(--zd_size10);
|
|
28
32
|
}
|
|
29
33
|
.horizontalScroll, .verticalScroll, .bothScroll {
|
|
30
34
|
height: 100%;
|
|
@@ -2,9 +2,16 @@
|
|
|
2
2
|
|
|
3
3
|
.noteContainer {
|
|
4
4
|
padding: var(--zd_size4) var(--zd_size30) 0;
|
|
5
|
+
}
|
|
6
|
+
|
|
7
|
+
[dir=ltr] .noteContainer {
|
|
5
8
|
border-left: solid 1px var(--zdt_alertlookup_border);
|
|
6
9
|
}
|
|
7
10
|
|
|
11
|
+
[dir=rtl] .noteContainer {
|
|
12
|
+
border-right: solid 1px var(--zdt_alertlookup_border);
|
|
13
|
+
}
|
|
14
|
+
|
|
8
15
|
.noteTitle {
|
|
9
16
|
font-size: var(--zd_font_size13);
|
|
10
17
|
font-family: var(--zd_semibold);
|
|
@@ -20,7 +27,7 @@
|
|
|
20
27
|
font-size: var(--zd_font_size12);
|
|
21
28
|
/* line-height: var(--zd_size14); */
|
|
22
29
|
color: var(--zdt_alertlookuop_text);
|
|
23
|
-
margin-bottom: var(--zd_size15);
|
|
24
30
|
list-style-type: disc;
|
|
25
31
|
line-height: initial;
|
|
32
|
+
margin-bottom: var(--zd_size15);
|
|
26
33
|
}
|
|
@@ -1,17 +1,22 @@
|
|
|
1
1
|
.parentElement {
|
|
2
|
-
margin-bottom: var(--zd_size7);
|
|
3
2
|
position: relative;
|
|
3
|
+
margin-bottom: var(--zd_size7);
|
|
4
4
|
}
|
|
5
5
|
.container {
|
|
6
|
-
background-color: var(--zdt_desktopnotification_bg);
|
|
7
6
|
color: var(--zdt_desktopnotification_text);
|
|
8
7
|
transition: all var(--zd_transition4);
|
|
9
8
|
position: relative;
|
|
10
|
-
transform-origin: right center;
|
|
11
9
|
max-height: 100%;
|
|
10
|
+
pointer-events: auto;
|
|
11
|
+
background-color: var(--zdt_desktopnotification_bg);
|
|
12
12
|
box-shadow: 0 4px 20px var(--zdt_desktopnotification_box_shadow);
|
|
13
13
|
border-radius: 0 0 var(--zd_size10) var(--zd_size10);
|
|
14
|
-
|
|
14
|
+
}
|
|
15
|
+
[dir=ltr] .container {
|
|
16
|
+
transform-origin: right center;
|
|
17
|
+
}
|
|
18
|
+
[dir=rtl] .container {
|
|
19
|
+
transform-origin: left center;
|
|
15
20
|
}
|
|
16
21
|
.globalNotify {
|
|
17
22
|
max-width: var(--zd_size490);
|
|
@@ -27,11 +32,17 @@
|
|
|
27
32
|
/* Animation Style */
|
|
28
33
|
.closeAnimation {
|
|
29
34
|
max-height: 0;
|
|
30
|
-
margin-bottom: 0;
|
|
31
35
|
transition: all var(--zd_transition3) 0.4s;
|
|
36
|
+
margin-bottom: 0;
|
|
32
37
|
}
|
|
33
38
|
.animation {
|
|
34
39
|
composes: modeForward from '~@zohodesk/components/lib/common/animation.module.css';
|
|
40
|
+
}
|
|
41
|
+
[dir=ltr] .animation {
|
|
42
|
+
animation-duration: var(--zd_transition4);
|
|
43
|
+
-webkit-animation-duration: var(--zd_transition4);
|
|
44
|
+
}
|
|
45
|
+
[dir=rtl] .animation {
|
|
35
46
|
animation-duration: var(--zd_transition4);
|
|
36
47
|
-webkit-animation-duration: var(--zd_transition4);
|
|
37
48
|
}
|
|
@@ -40,8 +51,8 @@
|
|
|
40
51
|
composes: animation;
|
|
41
52
|
}
|
|
42
53
|
.leftnoanimate {
|
|
43
|
-
transform: translateX(0) scale(1);
|
|
44
54
|
opacity: 1;
|
|
55
|
+
transform: translateX(0) scale(1);
|
|
45
56
|
}
|
|
46
57
|
.rightanimate {
|
|
47
58
|
composes: slideRight from '~@zohodesk/components/lib/common/animation.module.css';
|
|
@@ -50,15 +61,20 @@
|
|
|
50
61
|
}
|
|
51
62
|
/* Container Style */
|
|
52
63
|
.message {
|
|
53
|
-
padding: var(--zd_size10) var(--zd_size20) var(--zd_size10) var(--zd_size76);
|
|
54
|
-
border-top: 1px solid var(--zd_smoke1);
|
|
55
|
-
cursor: pointer;
|
|
56
64
|
position: relative;
|
|
57
65
|
color: var(--zd_smoke18);
|
|
58
66
|
font-size: var(--zd_font_size11);
|
|
59
67
|
composes: dotted textCap from '~@zohodesk/components/lib/common/common.module.css';
|
|
60
68
|
height: var(--zd_size33);
|
|
61
69
|
transition: padding var(--zd_transition3), height var(--zd_transition3);
|
|
70
|
+
border-top: 1px solid var(--zd_smoke1);
|
|
71
|
+
cursor: pointer;
|
|
72
|
+
}
|
|
73
|
+
[dir=ltr] .message {
|
|
74
|
+
padding: var(--zd_size10) var(--zd_size20) var(--zd_size10) var(--zd_size76);
|
|
75
|
+
}
|
|
76
|
+
[dir=rtl] .message {
|
|
77
|
+
padding: var(--zd_size10) var(--zd_size76) var(--zd_size10) var(--zd_size20);
|
|
62
78
|
}
|
|
63
79
|
.message:hover {
|
|
64
80
|
background: var(--zd_alabaster);
|
|
@@ -85,6 +101,6 @@
|
|
|
85
101
|
margin-top: var(--zd_size20);
|
|
86
102
|
}
|
|
87
103
|
.footer {
|
|
88
|
-
border-radius: 0 0 var(--zd_size10) var(--zd_size10);
|
|
89
104
|
overflow: hidden;
|
|
105
|
+
border-radius: 0 0 var(--zd_size10) var(--zd_size10);
|
|
90
106
|
}
|
package/es/version2/notification/DesktopNotificationHeader/DesktopNotificationHeader.module.css
CHANGED
|
@@ -5,20 +5,27 @@
|
|
|
5
5
|
composes: varClass;
|
|
6
6
|
min-height: var(--zd_size54);
|
|
7
7
|
position: relative;
|
|
8
|
+
color: var(--zdt_desktopnotification_text);
|
|
8
9
|
background-color: var(--alert_lookup_bg_color);
|
|
9
10
|
border-style: solid;
|
|
10
11
|
border-color: var(--commonalert_border_color);
|
|
11
12
|
border-width: 2px 0 0 0;
|
|
12
|
-
color: var(--zdt_desktopnotification_text);
|
|
13
13
|
}
|
|
14
14
|
|
|
15
15
|
.title {
|
|
16
|
-
margin: 0 var(--zd_size5) 0 var(--zd_size10);
|
|
17
16
|
font-size: var(--zd_font_size18);
|
|
18
17
|
line-height: var(--zd_size22);
|
|
19
18
|
font-family: var(--zd_bold);
|
|
20
19
|
composes: ftsmooth wbreak from '~@zohodesk/components/lib/common/common.module.css';
|
|
21
20
|
}
|
|
21
|
+
|
|
22
|
+
[dir=ltr] .title {
|
|
23
|
+
margin: 0 var(--zd_size5) 0 var(--zd_size10);
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
[dir=rtl] .title {
|
|
27
|
+
margin: 0 var(--zd_size10) 0 var(--zd_size5);
|
|
28
|
+
}
|
|
22
29
|
|
|
23
30
|
.infoText {
|
|
24
31
|
font-size: var(--zd_font_size14);
|
|
@@ -50,8 +57,11 @@
|
|
|
50
57
|
|
|
51
58
|
|
|
52
59
|
/* Primary Header */
|
|
53
|
-
.primary {
|
|
54
|
-
|
|
60
|
+
[dir=ltr] .primary {
|
|
61
|
+
padding: var(--zd_size15) var(--zd_size45) 0 var(--zd_size20);
|
|
62
|
+
}
|
|
63
|
+
[dir=rtl] .primary {
|
|
64
|
+
padding: var(--zd_size15) var(--zd_size20) 0 var(--zd_size45);
|
|
55
65
|
}
|
|
56
66
|
|
|
57
67
|
.primary .iconContainer {
|
|
@@ -66,14 +76,26 @@
|
|
|
66
76
|
.primary .close {
|
|
67
77
|
position: absolute;
|
|
68
78
|
top: var(--zd_size12);
|
|
69
|
-
|
|
79
|
+
}
|
|
80
|
+
|
|
81
|
+
[dir=ltr] .primary .close {
|
|
82
|
+
right: var(--zd_size12);
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
[dir=rtl] .primary .close {
|
|
86
|
+
left: var(--zd_size12);
|
|
70
87
|
}
|
|
71
88
|
|
|
72
89
|
/* Secondary Header */
|
|
73
90
|
.secondary {
|
|
74
|
-
padding: var(--zd_size18) var(--zd_size70) var(--zd_size19) var(--zd_size75);
|
|
75
|
-
border-radius: 0 0 var(--zd_size10) var(--zd_size10);
|
|
76
91
|
composes: wbreak from '~@zohodesk/components/lib/common/common.module.css';
|
|
92
|
+
border-radius: 0 0 var(--zd_size10) var(--zd_size10);
|
|
93
|
+
}
|
|
94
|
+
[dir=ltr] .secondary {
|
|
95
|
+
padding: var(--zd_size18) var(--zd_size70) var(--zd_size19) var(--zd_size75);
|
|
96
|
+
}
|
|
97
|
+
[dir=rtl] .secondary {
|
|
98
|
+
padding: var(--zd_size18) var(--zd_size75) var(--zd_size19) var(--zd_size70);
|
|
77
99
|
}
|
|
78
100
|
|
|
79
101
|
.secondary .infoText {
|
|
@@ -86,15 +108,30 @@
|
|
|
86
108
|
position: absolute;
|
|
87
109
|
top: 0;
|
|
88
110
|
bottom: 0;
|
|
89
|
-
left: var(--zd_size18);
|
|
90
111
|
margin: auto 0;
|
|
91
112
|
}
|
|
92
113
|
|
|
114
|
+
[dir=ltr] .secondary .iconContainer {
|
|
115
|
+
left: var(--zd_size18);
|
|
116
|
+
}
|
|
117
|
+
|
|
118
|
+
[dir=rtl] .secondary .iconContainer {
|
|
119
|
+
right: var(--zd_size18);
|
|
120
|
+
}
|
|
121
|
+
|
|
93
122
|
.secondary .close {
|
|
94
123
|
position: absolute;
|
|
95
124
|
top: 0;
|
|
96
125
|
bottom: 0;
|
|
97
|
-
right: var(--zd_size12);
|
|
98
|
-
margin: auto 0 auto var(--zd_size25);
|
|
99
126
|
height: var(--zd_size25);
|
|
127
|
+
}
|
|
128
|
+
|
|
129
|
+
[dir=ltr] .secondary .close {
|
|
130
|
+
right: var(--zd_size12);
|
|
131
|
+
margin: auto 0 auto var(--zd_size25);
|
|
132
|
+
}
|
|
133
|
+
|
|
134
|
+
[dir=rtl] .secondary .close {
|
|
135
|
+
left: var(--zd_size12);
|
|
136
|
+
margin: auto var(--zd_size25) auto 0;
|
|
100
137
|
}
|
|
Binary file
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.getExtensionFromFileName = getExtensionFromFileName;
|
|
7
|
+
exports.isAudioFile = isAudioFile;
|
|
8
|
+
exports.isBrowserSupportedFile = isBrowserSupportedFile;
|
|
9
|
+
var UNASSIGNED = 'Unassigned';
|
|
10
|
+
var BROWSER_SUPPORTED_FILES = ['pdf', 'text', 'txt', 'css', 'jpg', 'jpeg', 'gif', 'png', 'bmp', 'ico', 'sh', 'mp3', 'wav', 'ogg'];
|
|
11
|
+
|
|
12
|
+
function isAudioFile(fileName) {
|
|
13
|
+
var extension = getExtensionFromFileName(fileName);
|
|
14
|
+
return /mp3|wav|ogg/i.test(extension);
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
function getExtensionFromFileName(fileName) {
|
|
18
|
+
if (fileName && fileName.indexOf(".") !== -1) {
|
|
19
|
+
return fileName.substring(fileName.lastIndexOf(".") + 1, fileName.length).toLowerCase();
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
return "";
|
|
23
|
+
}
|
|
24
|
+
|
|
25
|
+
function isBrowserSupportedFile(fileName) {
|
|
26
|
+
var extension = getExtensionFromFileName(fileName);
|
|
27
|
+
return BROWSER_SUPPORTED_FILES.indexOf(extension) !== -1;
|
|
28
|
+
}
|
|
@@ -0,0 +1,129 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
|
|
4
|
+
|
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
|
6
|
+
value: true
|
|
7
|
+
});
|
|
8
|
+
exports["default"] = void 0;
|
|
9
|
+
|
|
10
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
11
|
+
|
|
12
|
+
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
13
|
+
|
|
14
|
+
var _AttachmentViewerModule = _interopRequireDefault(require("./AttachmentViewer.module.css"));
|
|
15
|
+
|
|
16
|
+
var _Image = _interopRequireDefault(require("../Image/Image"));
|
|
17
|
+
|
|
18
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
19
|
+
|
|
20
|
+
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
21
|
+
|
|
22
|
+
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
23
|
+
|
|
24
|
+
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
|
25
|
+
|
|
26
|
+
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); } }
|
|
27
|
+
|
|
28
|
+
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
|
|
29
|
+
|
|
30
|
+
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
|
|
31
|
+
|
|
32
|
+
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
|
|
33
|
+
|
|
34
|
+
function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
|
|
35
|
+
|
|
36
|
+
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
|
|
37
|
+
|
|
38
|
+
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
|
|
39
|
+
|
|
40
|
+
function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
|
|
41
|
+
|
|
42
|
+
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
|
|
43
|
+
|
|
44
|
+
var AttachmentImage = /*#__PURE__*/function (_Component) {
|
|
45
|
+
_inherits(AttachmentImage, _Component);
|
|
46
|
+
|
|
47
|
+
var _super = _createSuper(AttachmentImage);
|
|
48
|
+
|
|
49
|
+
function AttachmentImage(props) {
|
|
50
|
+
var _this;
|
|
51
|
+
|
|
52
|
+
_classCallCheck(this, AttachmentImage);
|
|
53
|
+
|
|
54
|
+
_this = _super.call(this, props);
|
|
55
|
+
_this.imageEle = /*#__PURE__*/_react["default"].createRef();
|
|
56
|
+
_this.state = {
|
|
57
|
+
isLoading: true
|
|
58
|
+
};
|
|
59
|
+
_this.imgLoad = _this.imgLoad.bind(_assertThisInitialized(_this));
|
|
60
|
+
return _this;
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
_createClass(AttachmentImage, [{
|
|
64
|
+
key: "componentDidMount",
|
|
65
|
+
value: function componentDidMount() {
|
|
66
|
+
var isImage = this.props.isImage;
|
|
67
|
+
|
|
68
|
+
if (isImage) {
|
|
69
|
+
var image = this.imageEle.current;
|
|
70
|
+
image.addEventListener('load', this.imgLoad);
|
|
71
|
+
} else {
|
|
72
|
+
this.setState({
|
|
73
|
+
isLoading: false
|
|
74
|
+
});
|
|
75
|
+
}
|
|
76
|
+
}
|
|
77
|
+
}, {
|
|
78
|
+
key: "imgLoad",
|
|
79
|
+
value: function imgLoad() {
|
|
80
|
+
this.setState({
|
|
81
|
+
isLoading: false
|
|
82
|
+
});
|
|
83
|
+
var onLoad = this.props.onLoad;
|
|
84
|
+
onLoad && onLoad();
|
|
85
|
+
}
|
|
86
|
+
}, {
|
|
87
|
+
key: "render",
|
|
88
|
+
value: function render() {
|
|
89
|
+
var _this$props = this.props,
|
|
90
|
+
src = _this$props.src,
|
|
91
|
+
onClick = _this$props.onClick,
|
|
92
|
+
alt = _this$props.alt,
|
|
93
|
+
dataId = _this$props.dataId,
|
|
94
|
+
id = _this$props.id,
|
|
95
|
+
className = _this$props.className,
|
|
96
|
+
isCover = _this$props.isCover;
|
|
97
|
+
var isLoading = this.state.isLoading;
|
|
98
|
+
return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, isLoading ? /*#__PURE__*/_react["default"].createElement("div", {
|
|
99
|
+
className: "".concat(_AttachmentViewerModule["default"].spinLoad)
|
|
100
|
+
}, /*#__PURE__*/_react["default"].createElement("div", {
|
|
101
|
+
className: _AttachmentViewerModule["default"].loader
|
|
102
|
+
})) : null, /*#__PURE__*/_react["default"].createElement(_Image["default"], {
|
|
103
|
+
htmlId: id,
|
|
104
|
+
eleRef: this.imageEle,
|
|
105
|
+
dataId: dataId,
|
|
106
|
+
src: src,
|
|
107
|
+
onClick: onClick,
|
|
108
|
+
className: "".concat(isLoading ? _AttachmentViewerModule["default"].hide : '', " ").concat(className),
|
|
109
|
+
alt: alt,
|
|
110
|
+
isCover: isCover
|
|
111
|
+
}));
|
|
112
|
+
}
|
|
113
|
+
}]);
|
|
114
|
+
|
|
115
|
+
return AttachmentImage;
|
|
116
|
+
}(_react.Component);
|
|
117
|
+
|
|
118
|
+
exports["default"] = AttachmentImage;
|
|
119
|
+
AttachmentImage.propTypes = {
|
|
120
|
+
alt: _propTypes["default"].string,
|
|
121
|
+
className: _propTypes["default"].string,
|
|
122
|
+
dataId: _propTypes["default"].string,
|
|
123
|
+
id: _propTypes["default"].string,
|
|
124
|
+
isCover: _propTypes["default"].bool,
|
|
125
|
+
isImage: _propTypes["default"].string,
|
|
126
|
+
onClick: _propTypes["default"].func,
|
|
127
|
+
onLoad: _propTypes["default"].func,
|
|
128
|
+
src: _propTypes["default"].string
|
|
129
|
+
};
|