@theia/messages 1.48.1 → 1.48.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 (37) hide show
  1. package/README.md +30 -30
  2. package/lib/browser/messages-frontend-module.d.ts +4 -4
  3. package/lib/browser/messages-frontend-module.js +41 -41
  4. package/lib/browser/notification-center-component.d.ts +18 -18
  5. package/lib/browser/notification-center-component.js +67 -67
  6. package/lib/browser/notification-component.d.ts +15 -15
  7. package/lib/browser/notification-component.js +88 -88
  8. package/lib/browser/notification-content-renderer.d.ts +5 -5
  9. package/lib/browser/notification-content-renderer.js +35 -35
  10. package/lib/browser/notification-content-renderer.spec.d.ts +1 -1
  11. package/lib/browser/notification-content-renderer.spec.js +41 -41
  12. package/lib/browser/notification-preferences.d.ts +11 -11
  13. package/lib/browser/notification-preferences.js +46 -46
  14. package/lib/browser/notification-toasts-component.d.ts +18 -18
  15. package/lib/browser/notification-toasts-component.js +48 -48
  16. package/lib/browser/notifications-commands.d.ts +7 -7
  17. package/lib/browser/notifications-commands.js +47 -47
  18. package/lib/browser/notifications-contribution.d.ts +21 -21
  19. package/lib/browser/notifications-contribution.js +203 -203
  20. package/lib/browser/notifications-manager.d.ts +71 -71
  21. package/lib/browser/notifications-manager.js +274 -274
  22. package/lib/browser/notifications-renderer.d.ts +13 -13
  23. package/lib/browser/notifications-renderer.js +67 -67
  24. package/package.json +4 -4
  25. package/src/browser/messages-frontend-module.ts +42 -42
  26. package/src/browser/notification-center-component.tsx +95 -95
  27. package/src/browser/notification-component.tsx +128 -128
  28. package/src/browser/notification-content-renderer.spec.ts +73 -73
  29. package/src/browser/notification-content-renderer.ts +31 -31
  30. package/src/browser/notification-preferences.ts +58 -58
  31. package/src/browser/notification-toasts-component.tsx +67 -67
  32. package/src/browser/notifications-commands.ts +50 -50
  33. package/src/browser/notifications-contribution.ts +218 -218
  34. package/src/browser/notifications-manager.ts +305 -305
  35. package/src/browser/notifications-renderer.tsx +61 -61
  36. package/src/browser/style/index.css +17 -17
  37. package/src/browser/style/notifications.css +283 -283
@@ -1,283 +1,283 @@
1
- /********************************************************************************
2
- * Copyright (C) 2019 TypeFox and others.
3
- *
4
- * This program and the accompanying materials are made available under the
5
- * terms of the Eclipse Public License v. 2.0 which is available at
6
- * http://www.eclipse.org/legal/epl-2.0.
7
- *
8
- * This Source Code may also be made available under the following Secondary
9
- * Licenses when the conditions for such availability set forth in the Eclipse
10
- * Public License v. 2.0 are satisfied: GNU General Public License, version 2
11
- * with the GNU Classpath Exception which is available at
12
- * https://www.gnu.org/software/classpath/license.html.
13
- *
14
- * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0-only WITH Classpath-exception-2.0
15
- ********************************************************************************/
16
-
17
- /* Container */
18
-
19
- .theia-notifications-overlay {
20
- height: 0px;
21
- }
22
-
23
- .theia-notifications-container {
24
- position: absolute;
25
- bottom: 36px;
26
- right: 16px;
27
- width: 500px;
28
- user-select: none;
29
- z-index: 1111;
30
- }
31
- .theia-notifications-container.closed {
32
- display: none;
33
- }
34
- .theia-notifications-container > * {
35
- position: relative;
36
- }
37
-
38
- /* Toasts */
39
-
40
- .theia-notifications-container.theia-notification-toasts .theia-notification-list-item-container {
41
- border-radius: 4px;
42
- margin-top: 6px;
43
- }
44
-
45
- .theia-notifications-container.theia-notification-toasts .theia-notification-list-item {
46
- box-shadow: 0px 0px 4px 0px var(--theia-widget-shadow);
47
- border: 1px solid var(--theia-notificationToast-border);
48
- border-radius: 4px;
49
- }
50
-
51
- /* Center */
52
-
53
- .theia-notifications-container.theia-notification-center {
54
- background-color: var(--theia-notifications-background);
55
- border: 1px solid var(--theia-notificationCenter-border);
56
- border-radius: 4px;
57
- overflow: hidden;
58
- box-shadow: 0px 0px 6px 0px var(--theia-widget-shadow);
59
- }
60
-
61
- /* Center > Header */
62
-
63
- .theia-notification-center-header {
64
- color: var(--theia-notificationCenterHeader-foreground);
65
- background-color: var(--theia-notificationCenterHeader-background);
66
- display: flex;
67
- flex-direction: row;
68
- flex-wrap: nowrap;
69
- justify-content: flex-end;
70
- min-height: 30px;
71
- align-items: center;
72
- }
73
-
74
- .theia-notification-center-header-title {
75
- font-size: calc(var(--theia-ui-font-size1) / 1.1);
76
- font-family: var(--theia-ui-font-family);
77
- margin: 8px;
78
- flex-grow: 2;
79
- }
80
-
81
- .theia-notification-center-header-actions {
82
- margin: 8px;
83
- }
84
-
85
- /* List */
86
-
87
- .theia-notification-list-scroll-container {
88
- max-height: 300px;
89
- overflow: auto;
90
- border-bottom-left-radius: 4px;
91
- border-bottom-right-radius: 4px;
92
- }
93
-
94
- .theia-notification-list {
95
- display: flex;
96
- flex-direction: column-reverse;
97
- flex-wrap: nowrap;
98
- }
99
-
100
- /* List > Item */
101
-
102
- .theia-notification-list-item {
103
- background-color: var(--theia-notifications-background);
104
- width: 100%;
105
- cursor: pointer;
106
- flex-grow: 1;
107
- display: flex;
108
- flex-direction: column;
109
- flex-wrap: nowrap;
110
- justify-content: space-between;
111
- }
112
-
113
- .theia-notification-list-item:focus {
114
- border-color: var(--theia-focusBorder);
115
- }
116
-
117
- .theia-notification-center .theia-notification-list-item:not(:last-child) {
118
- border-top: 1px var(--theia-notifications-border) solid;
119
- }
120
-
121
- .theia-notification-list-item-content {
122
- margin: 6px;
123
- flex-grow: 3;
124
- }
125
- .theia-notification-list-item-content.collapsed
126
- .theia-notification-list-item-content-bottom {
127
- display: none;
128
- }
129
- .theia-notification-list-item-content.collapsed .theia-notification-message {
130
- overflow: hidden;
131
- text-overflow: ellipsis;
132
- white-space: nowrap;
133
- }
134
-
135
- .theia-notification-list-item-content-main {
136
- display: flex;
137
- flex-direction: row;
138
- flex-wrap: nowrap;
139
- justify-content: space-between;
140
- padding: 5px 4px 7px 4px;
141
- }
142
-
143
- .theia-notification-message {
144
- font-size: var(--theia-ui-font-size1);
145
- font-family: var(--theia-ui-font-family);
146
- overflow-wrap: break-word;
147
- box-sizing: border-box;
148
- flex-basis: 0%;
149
- flex-grow: 1;
150
- flex-shrink: 1;
151
- display: block;
152
- overflow: hidden;
153
- user-select: text;
154
- margin-top: 3px;
155
- }
156
-
157
- .theia-notification-message a {
158
- border: none;
159
- color: var(--theia-notificationLink-foreground);
160
- outline: 0;
161
- text-decoration: none;
162
- }
163
- .theia-notification-message a:focus {
164
- outline-color: var(--theia-focusBorder);
165
- }
166
-
167
- .theia-notification-icon {
168
- margin-top: 1px;
169
- }
170
-
171
- .theia-notification-icon:before {
172
- font-size: 18px;
173
- padding-right: 4px;
174
- }
175
-
176
- .theia-notification-icon.info:before {
177
- color: var(--theia-notificationsInfoIcon-foreground);
178
- }
179
-
180
- .theia-notification-icon.warning:before {
181
- color: var(--theia-notificationsWarningIcon-foreground);
182
- }
183
-
184
- .theia-notification-icon.error:before {
185
- color: var(--theia-notificationsErrorIcon-foreground);
186
- }
187
-
188
- .theia-notification-actions {
189
- display: flex;
190
- flex-direction: row;
191
- flex-wrap: nowrap;
192
- justify-content: space-between;
193
- margin: 0px;
194
- padding: 0px;
195
- }
196
-
197
- .theia-notification-actions > li {
198
- display: inline-block;
199
- height: 16px;
200
- width: 16px;
201
- cursor: pointer;
202
- margin-left: 4px;
203
- }
204
-
205
- .theia-notification-actions > .expand {
206
- transform: rotate(180deg);
207
- }
208
-
209
- .theia-notification-list-item-content-bottom {
210
- display: flex;
211
- flex-direction: row;
212
- flex-wrap: wrap;
213
- justify-content: space-between;
214
- }
215
-
216
- .theia-notification-source {
217
- font-size: var(--theia-ui-font-size0);
218
- font-family: var(--theia-ui-font-family);
219
- overflow-wrap: break-word;
220
- box-sizing: border-box;
221
- flex-grow: 1;
222
- padding: 4px;
223
- display: block;
224
- overflow: hidden;
225
- }
226
-
227
- .theia-notification-buttons {
228
- flex-grow: 2;
229
- display: flex;
230
- flex-direction: row;
231
- justify-content: flex-end;
232
- flex-wrap: wrap;
233
- }
234
-
235
- .theia-notification-buttons > button {
236
- margin: 4px;
237
- max-width: 160px;
238
- text-overflow: ellipsis;
239
- white-space: nowrap;
240
- overflow: hidden;
241
- }
242
-
243
- .theia-notification-item-progress {
244
- display: block;
245
- }
246
-
247
- .theia-notification-item-progressbar {
248
- height: 2px;
249
- background-color: var(--theia-progressBar-background);
250
- width: 66%;
251
- }
252
-
253
- .theia-notification-item-progressbar.indeterminate {
254
- /* `progress-animation` is defined in `packages/core/src/browser/style/progress-bar.css` */
255
- animation: progress-animation 1.3s 0s infinite
256
- cubic-bezier(0.645, 0.045, 0.355, 1);
257
- }
258
-
259
- /* Perfect scrollbar */
260
-
261
- .theia-notification-list-scroll-container .ps__rail-y {
262
- width: var(--theia-scrollbar-rail-width);
263
- }
264
-
265
- .theia-notification-list-scroll-container .ps__rail-y:hover > .ps__thumb-y,
266
- .theia-notification-list-scroll-container .ps__rail-y:focus > .ps__thumb-y,
267
- .theia-notification-list-scroll-container
268
- .ps__rail-y.ps--clicking
269
- .ps__thumb-y {
270
- right: calc(
271
- (var(--theia-scrollbar-rail-width) - var(--theia-scrollbar-width)) / 2
272
- );
273
- width: var(--theia-scrollbar-width);
274
- }
275
-
276
- .theia-notification-list-scroll-container .ps__rail-y > .ps__thumb-y {
277
- width: var(--theia-scrollbar-width);
278
- right: calc(
279
- (var(--theia-scrollbar-rail-width) - var(--theia-scrollbar-width)) / 2
280
- );
281
- background: var(--theia-scrollbarSlider-background);
282
- border-radius: 0px;
283
- }
1
+ /********************************************************************************
2
+ * Copyright (C) 2019 TypeFox and others.
3
+ *
4
+ * This program and the accompanying materials are made available under the
5
+ * terms of the Eclipse Public License v. 2.0 which is available at
6
+ * http://www.eclipse.org/legal/epl-2.0.
7
+ *
8
+ * This Source Code may also be made available under the following Secondary
9
+ * Licenses when the conditions for such availability set forth in the Eclipse
10
+ * Public License v. 2.0 are satisfied: GNU General Public License, version 2
11
+ * with the GNU Classpath Exception which is available at
12
+ * https://www.gnu.org/software/classpath/license.html.
13
+ *
14
+ * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0-only WITH Classpath-exception-2.0
15
+ ********************************************************************************/
16
+
17
+ /* Container */
18
+
19
+ .theia-notifications-overlay {
20
+ height: 0px;
21
+ }
22
+
23
+ .theia-notifications-container {
24
+ position: absolute;
25
+ bottom: 36px;
26
+ right: 16px;
27
+ width: 500px;
28
+ user-select: none;
29
+ z-index: 1111;
30
+ }
31
+ .theia-notifications-container.closed {
32
+ display: none;
33
+ }
34
+ .theia-notifications-container > * {
35
+ position: relative;
36
+ }
37
+
38
+ /* Toasts */
39
+
40
+ .theia-notifications-container.theia-notification-toasts .theia-notification-list-item-container {
41
+ border-radius: 4px;
42
+ margin-top: 6px;
43
+ }
44
+
45
+ .theia-notifications-container.theia-notification-toasts .theia-notification-list-item {
46
+ box-shadow: 0px 0px 4px 0px var(--theia-widget-shadow);
47
+ border: 1px solid var(--theia-notificationToast-border);
48
+ border-radius: 4px;
49
+ }
50
+
51
+ /* Center */
52
+
53
+ .theia-notifications-container.theia-notification-center {
54
+ background-color: var(--theia-notifications-background);
55
+ border: 1px solid var(--theia-notificationCenter-border);
56
+ border-radius: 4px;
57
+ overflow: hidden;
58
+ box-shadow: 0px 0px 6px 0px var(--theia-widget-shadow);
59
+ }
60
+
61
+ /* Center > Header */
62
+
63
+ .theia-notification-center-header {
64
+ color: var(--theia-notificationCenterHeader-foreground);
65
+ background-color: var(--theia-notificationCenterHeader-background);
66
+ display: flex;
67
+ flex-direction: row;
68
+ flex-wrap: nowrap;
69
+ justify-content: flex-end;
70
+ min-height: 30px;
71
+ align-items: center;
72
+ }
73
+
74
+ .theia-notification-center-header-title {
75
+ font-size: calc(var(--theia-ui-font-size1) / 1.1);
76
+ font-family: var(--theia-ui-font-family);
77
+ margin: 8px;
78
+ flex-grow: 2;
79
+ }
80
+
81
+ .theia-notification-center-header-actions {
82
+ margin: 8px;
83
+ }
84
+
85
+ /* List */
86
+
87
+ .theia-notification-list-scroll-container {
88
+ max-height: 300px;
89
+ overflow: auto;
90
+ border-bottom-left-radius: 4px;
91
+ border-bottom-right-radius: 4px;
92
+ }
93
+
94
+ .theia-notification-list {
95
+ display: flex;
96
+ flex-direction: column-reverse;
97
+ flex-wrap: nowrap;
98
+ }
99
+
100
+ /* List > Item */
101
+
102
+ .theia-notification-list-item {
103
+ background-color: var(--theia-notifications-background);
104
+ width: 100%;
105
+ cursor: pointer;
106
+ flex-grow: 1;
107
+ display: flex;
108
+ flex-direction: column;
109
+ flex-wrap: nowrap;
110
+ justify-content: space-between;
111
+ }
112
+
113
+ .theia-notification-list-item:focus {
114
+ border-color: var(--theia-focusBorder);
115
+ }
116
+
117
+ .theia-notification-center .theia-notification-list-item:not(:last-child) {
118
+ border-top: 1px var(--theia-notifications-border) solid;
119
+ }
120
+
121
+ .theia-notification-list-item-content {
122
+ margin: 6px;
123
+ flex-grow: 3;
124
+ }
125
+ .theia-notification-list-item-content.collapsed
126
+ .theia-notification-list-item-content-bottom {
127
+ display: none;
128
+ }
129
+ .theia-notification-list-item-content.collapsed .theia-notification-message {
130
+ overflow: hidden;
131
+ text-overflow: ellipsis;
132
+ white-space: nowrap;
133
+ }
134
+
135
+ .theia-notification-list-item-content-main {
136
+ display: flex;
137
+ flex-direction: row;
138
+ flex-wrap: nowrap;
139
+ justify-content: space-between;
140
+ padding: 5px 4px 7px 4px;
141
+ }
142
+
143
+ .theia-notification-message {
144
+ font-size: var(--theia-ui-font-size1);
145
+ font-family: var(--theia-ui-font-family);
146
+ overflow-wrap: break-word;
147
+ box-sizing: border-box;
148
+ flex-basis: 0%;
149
+ flex-grow: 1;
150
+ flex-shrink: 1;
151
+ display: block;
152
+ overflow: hidden;
153
+ user-select: text;
154
+ margin-top: 3px;
155
+ }
156
+
157
+ .theia-notification-message a {
158
+ border: none;
159
+ color: var(--theia-notificationLink-foreground);
160
+ outline: 0;
161
+ text-decoration: none;
162
+ }
163
+ .theia-notification-message a:focus {
164
+ outline-color: var(--theia-focusBorder);
165
+ }
166
+
167
+ .theia-notification-icon {
168
+ margin-top: 1px;
169
+ }
170
+
171
+ .theia-notification-icon:before {
172
+ font-size: 18px;
173
+ padding-right: 4px;
174
+ }
175
+
176
+ .theia-notification-icon.info:before {
177
+ color: var(--theia-notificationsInfoIcon-foreground);
178
+ }
179
+
180
+ .theia-notification-icon.warning:before {
181
+ color: var(--theia-notificationsWarningIcon-foreground);
182
+ }
183
+
184
+ .theia-notification-icon.error:before {
185
+ color: var(--theia-notificationsErrorIcon-foreground);
186
+ }
187
+
188
+ .theia-notification-actions {
189
+ display: flex;
190
+ flex-direction: row;
191
+ flex-wrap: nowrap;
192
+ justify-content: space-between;
193
+ margin: 0px;
194
+ padding: 0px;
195
+ }
196
+
197
+ .theia-notification-actions > li {
198
+ display: inline-block;
199
+ height: 16px;
200
+ width: 16px;
201
+ cursor: pointer;
202
+ margin-left: 4px;
203
+ }
204
+
205
+ .theia-notification-actions > .expand {
206
+ transform: rotate(180deg);
207
+ }
208
+
209
+ .theia-notification-list-item-content-bottom {
210
+ display: flex;
211
+ flex-direction: row;
212
+ flex-wrap: wrap;
213
+ justify-content: space-between;
214
+ }
215
+
216
+ .theia-notification-source {
217
+ font-size: var(--theia-ui-font-size0);
218
+ font-family: var(--theia-ui-font-family);
219
+ overflow-wrap: break-word;
220
+ box-sizing: border-box;
221
+ flex-grow: 1;
222
+ padding: 4px;
223
+ display: block;
224
+ overflow: hidden;
225
+ }
226
+
227
+ .theia-notification-buttons {
228
+ flex-grow: 2;
229
+ display: flex;
230
+ flex-direction: row;
231
+ justify-content: flex-end;
232
+ flex-wrap: wrap;
233
+ }
234
+
235
+ .theia-notification-buttons > button {
236
+ margin: 4px;
237
+ max-width: 160px;
238
+ text-overflow: ellipsis;
239
+ white-space: nowrap;
240
+ overflow: hidden;
241
+ }
242
+
243
+ .theia-notification-item-progress {
244
+ display: block;
245
+ }
246
+
247
+ .theia-notification-item-progressbar {
248
+ height: 2px;
249
+ background-color: var(--theia-progressBar-background);
250
+ width: 66%;
251
+ }
252
+
253
+ .theia-notification-item-progressbar.indeterminate {
254
+ /* `progress-animation` is defined in `packages/core/src/browser/style/progress-bar.css` */
255
+ animation: progress-animation 1.3s 0s infinite
256
+ cubic-bezier(0.645, 0.045, 0.355, 1);
257
+ }
258
+
259
+ /* Perfect scrollbar */
260
+
261
+ .theia-notification-list-scroll-container .ps__rail-y {
262
+ width: var(--theia-scrollbar-rail-width);
263
+ }
264
+
265
+ .theia-notification-list-scroll-container .ps__rail-y:hover > .ps__thumb-y,
266
+ .theia-notification-list-scroll-container .ps__rail-y:focus > .ps__thumb-y,
267
+ .theia-notification-list-scroll-container
268
+ .ps__rail-y.ps--clicking
269
+ .ps__thumb-y {
270
+ right: calc(
271
+ (var(--theia-scrollbar-rail-width) - var(--theia-scrollbar-width)) / 2
272
+ );
273
+ width: var(--theia-scrollbar-width);
274
+ }
275
+
276
+ .theia-notification-list-scroll-container .ps__rail-y > .ps__thumb-y {
277
+ width: var(--theia-scrollbar-width);
278
+ right: calc(
279
+ (var(--theia-scrollbar-rail-width) - var(--theia-scrollbar-width)) / 2
280
+ );
281
+ background: var(--theia-scrollbarSlider-background);
282
+ border-radius: 0px;
283
+ }