@jumoo/usync 17.5.0 → 17.5.1
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/LICENCE +372 -372
- package/README.md +10 -10
- package/dist/components/usync-action-box.js +61 -61
- package/dist/components/usync-change-detail.js +409 -409
- package/dist/components/usync-change-view.js +49 -49
- package/dist/components/usync-progress-box.js +106 -106
- package/dist/components/usync-result-row.js +61 -61
- package/dist/components/usync-results-group-view.js +55 -55
- package/dist/components/usync-results-view.js +63 -63
- package/dist/components/usync-sync-file-info-view.js +10 -10
- package/dist/dialogs/details-modal-element.js +37 -37
- package/dist/dialogs/error-modal-element.js +21 -21
- package/dist/dialogs/legacy-modal-element.js +22 -22
- package/dist/dialogs/single-import-modal.element.js +30 -30
- package/dist/icons/svg/logo.js +20 -20
- package/dist/lang/files/da-dk.js +12 -12
- package/dist/lang/files/de-de.js +12 -12
- package/dist/lang/files/en-us.js +12 -12
- package/dist/lang/files/es-es.js +12 -12
- package/dist/lang/files/fr-fr.js +12 -12
- package/dist/lang/files/nl-nl.js +12 -12
- package/dist/tree/usync.menu-element.js +8 -8
- package/dist/workspace/components/usync-action-button.js +50 -50
- package/dist/workspace/components/usync-file-picker.element.js +33 -33
- package/dist/workspace/components/usync-file-upload.element.js +25 -25
- package/dist/workspace/dialogs/import-modal.element.js +22 -22
- package/dist/workspace/views/addons/addons.element.js +97 -97
- package/dist/workspace/views/default/default.element.js +186 -186
- package/dist/workspace/views/legacy/legacy.element.js +81 -81
- package/dist/workspace/views/settings/components/usyncSettingItem.element.js +38 -38
- package/dist/workspace/views/settings/settings.element.js +124 -124
- package/dist/workspace/workspace.element.js +16 -16
- package/package.json +70 -70
|
@@ -9,106 +9,106 @@ import { LitElement, css, customElement, html, } from '@umbraco-cms/backoffice/e
|
|
|
9
9
|
const logo = '/App_Plugins/uSync/img/usync-complete.png';
|
|
10
10
|
let uSyncAddOnsElement = class uSyncAddOnsElement extends UmbElementMixin(LitElement) {
|
|
11
11
|
render() {
|
|
12
|
-
return html `
|
|
13
|
-
<umb-body-layout>
|
|
14
|
-
<div class="addon-view">
|
|
15
|
-
<div>
|
|
16
|
-
<div class="header">
|
|
17
|
-
<img src=${logo} />
|
|
18
|
-
<h1>uSync Complete</h1>
|
|
19
|
-
<p>
|
|
20
|
-
uSync Complete gives you total control over your Umbraco settings and
|
|
21
|
-
content.
|
|
22
|
-
</p>
|
|
23
|
-
</div>
|
|
24
|
-
|
|
25
|
-
<div class="logos">
|
|
26
|
-
<div class="logo">
|
|
27
|
-
<uui-icon name="icon-shift"></uui-icon>
|
|
28
|
-
<h4>publish</h4>
|
|
29
|
-
</div>
|
|
30
|
-
<div class="logo">
|
|
31
|
-
<uui-icon name="icon-compress"></uui-icon>
|
|
32
|
-
<h4>export</h4>
|
|
33
|
-
</div>
|
|
34
|
-
<div class="logo">
|
|
35
|
-
<uui-icon name="icon-connection"></uui-icon>
|
|
36
|
-
<h4>snapshot</h4>
|
|
37
|
-
</div>
|
|
38
|
-
<div class="logo">
|
|
39
|
-
<uui-icon name="icon-undo"></uui-icon>
|
|
40
|
-
<h4>restore</h4>
|
|
41
|
-
</div>
|
|
42
|
-
<div class="logo">
|
|
43
|
-
<uui-icon name="icon-operator"></uui-icon>
|
|
44
|
-
<h4>people</h4>
|
|
45
|
-
</div>
|
|
46
|
-
</div>
|
|
47
|
-
|
|
48
|
-
<div class="cta">
|
|
49
|
-
<uui-button
|
|
50
|
-
href="https://jumoo.co.uk/uSync/complete/"
|
|
51
|
-
target="_blank"
|
|
52
|
-
color="positive"
|
|
53
|
-
look="primary"
|
|
54
|
-
label="Find out more"></uui-button>
|
|
55
|
-
</div>
|
|
56
|
-
</div>
|
|
57
|
-
</div>
|
|
58
|
-
</umb-body-layout>
|
|
12
|
+
return html `
|
|
13
|
+
<umb-body-layout>
|
|
14
|
+
<div class="addon-view">
|
|
15
|
+
<div>
|
|
16
|
+
<div class="header">
|
|
17
|
+
<img src=${logo} />
|
|
18
|
+
<h1>uSync Complete</h1>
|
|
19
|
+
<p>
|
|
20
|
+
uSync Complete gives you total control over your Umbraco settings and
|
|
21
|
+
content.
|
|
22
|
+
</p>
|
|
23
|
+
</div>
|
|
24
|
+
|
|
25
|
+
<div class="logos">
|
|
26
|
+
<div class="logo">
|
|
27
|
+
<uui-icon name="icon-shift"></uui-icon>
|
|
28
|
+
<h4>publish</h4>
|
|
29
|
+
</div>
|
|
30
|
+
<div class="logo">
|
|
31
|
+
<uui-icon name="icon-compress"></uui-icon>
|
|
32
|
+
<h4>export</h4>
|
|
33
|
+
</div>
|
|
34
|
+
<div class="logo">
|
|
35
|
+
<uui-icon name="icon-connection"></uui-icon>
|
|
36
|
+
<h4>snapshot</h4>
|
|
37
|
+
</div>
|
|
38
|
+
<div class="logo">
|
|
39
|
+
<uui-icon name="icon-undo"></uui-icon>
|
|
40
|
+
<h4>restore</h4>
|
|
41
|
+
</div>
|
|
42
|
+
<div class="logo">
|
|
43
|
+
<uui-icon name="icon-operator"></uui-icon>
|
|
44
|
+
<h4>people</h4>
|
|
45
|
+
</div>
|
|
46
|
+
</div>
|
|
47
|
+
|
|
48
|
+
<div class="cta">
|
|
49
|
+
<uui-button
|
|
50
|
+
href="https://jumoo.co.uk/uSync/complete/"
|
|
51
|
+
target="_blank"
|
|
52
|
+
color="positive"
|
|
53
|
+
look="primary"
|
|
54
|
+
label="Find out more"></uui-button>
|
|
55
|
+
</div>
|
|
56
|
+
</div>
|
|
57
|
+
</div>
|
|
58
|
+
</umb-body-layout>
|
|
59
59
|
`;
|
|
60
60
|
}
|
|
61
61
|
};
|
|
62
|
-
uSyncAddOnsElement.styles = css `
|
|
63
|
-
umb-body-layout {
|
|
64
|
-
// background: linear-gradient(#e3e3f1,#f6f4f4);
|
|
65
|
-
background: linear-gradient(var(--uui-color-background), var(--uui-color-border));
|
|
66
|
-
}
|
|
67
|
-
|
|
68
|
-
.addon-view {
|
|
69
|
-
display: flex;
|
|
70
|
-
justify-content: center;
|
|
71
|
-
align-items: center;
|
|
72
|
-
height: 100%;
|
|
73
|
-
}
|
|
74
|
-
|
|
75
|
-
.addon-view > div {
|
|
76
|
-
margin-top: -15vh;
|
|
77
|
-
}
|
|
78
|
-
|
|
79
|
-
.header,
|
|
80
|
-
.cta {
|
|
81
|
-
display: flex;
|
|
82
|
-
flex-direction: column;
|
|
83
|
-
align-items: center;
|
|
84
|
-
}
|
|
85
|
-
|
|
86
|
-
.header {
|
|
87
|
-
font-size: larger;
|
|
88
|
-
margin-bottom: var(--uui-size-space-6);
|
|
89
|
-
}
|
|
90
|
-
|
|
91
|
-
.logos {
|
|
92
|
-
display: flex;
|
|
93
|
-
justify-content: space-between;
|
|
94
|
-
font-size: var(--uui-type-h3-size);
|
|
95
|
-
}
|
|
96
|
-
|
|
97
|
-
.logo {
|
|
98
|
-
display: flex;
|
|
99
|
-
flex-direction: column;
|
|
100
|
-
align-items: center;
|
|
101
|
-
margin: var(--uui-size-space-2) var(--uui-size-space-6);
|
|
102
|
-
color: var(--uui-color-text-alt);
|
|
103
|
-
}
|
|
104
|
-
|
|
105
|
-
.cta {
|
|
106
|
-
margin: var(--uui-size-space-6) 0;
|
|
107
|
-
}
|
|
108
|
-
|
|
109
|
-
uui-button {
|
|
110
|
-
font-size: var(--uui-type-h4-size);
|
|
111
|
-
}
|
|
62
|
+
uSyncAddOnsElement.styles = css `
|
|
63
|
+
umb-body-layout {
|
|
64
|
+
// background: linear-gradient(#e3e3f1,#f6f4f4);
|
|
65
|
+
background: linear-gradient(var(--uui-color-background), var(--uui-color-border));
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
.addon-view {
|
|
69
|
+
display: flex;
|
|
70
|
+
justify-content: center;
|
|
71
|
+
align-items: center;
|
|
72
|
+
height: 100%;
|
|
73
|
+
}
|
|
74
|
+
|
|
75
|
+
.addon-view > div {
|
|
76
|
+
margin-top: -15vh;
|
|
77
|
+
}
|
|
78
|
+
|
|
79
|
+
.header,
|
|
80
|
+
.cta {
|
|
81
|
+
display: flex;
|
|
82
|
+
flex-direction: column;
|
|
83
|
+
align-items: center;
|
|
84
|
+
}
|
|
85
|
+
|
|
86
|
+
.header {
|
|
87
|
+
font-size: larger;
|
|
88
|
+
margin-bottom: var(--uui-size-space-6);
|
|
89
|
+
}
|
|
90
|
+
|
|
91
|
+
.logos {
|
|
92
|
+
display: flex;
|
|
93
|
+
justify-content: space-between;
|
|
94
|
+
font-size: var(--uui-type-h3-size);
|
|
95
|
+
}
|
|
96
|
+
|
|
97
|
+
.logo {
|
|
98
|
+
display: flex;
|
|
99
|
+
flex-direction: column;
|
|
100
|
+
align-items: center;
|
|
101
|
+
margin: var(--uui-size-space-2) var(--uui-size-space-6);
|
|
102
|
+
color: var(--uui-color-text-alt);
|
|
103
|
+
}
|
|
104
|
+
|
|
105
|
+
.cta {
|
|
106
|
+
margin: var(--uui-size-space-6) 0;
|
|
107
|
+
}
|
|
108
|
+
|
|
109
|
+
uui-button {
|
|
110
|
+
font-size: var(--uui-type-h4-size);
|
|
111
|
+
}
|
|
112
112
|
`;
|
|
113
113
|
uSyncAddOnsElement = __decorate([
|
|
114
114
|
customElement('usync-addons-view')
|
|
@@ -120,16 +120,16 @@ let uSyncDefaultViewElement = class uSyncDefaultViewElement extends UmbLitElemen
|
|
|
120
120
|
return html `<uui-loader></uui-loader>`;
|
|
121
121
|
}
|
|
122
122
|
else {
|
|
123
|
-
return html `
|
|
124
|
-
<umb-body-layout>
|
|
125
|
-
${__classPrivateFieldGet(this, _uSyncDefaultViewElement_instances, "m", _uSyncDefaultViewElement_renderBackgroundBanner).call(this)}
|
|
126
|
-
${__classPrivateFieldGet(this, _uSyncDefaultViewElement_instances, "m", _uSyncDefaultViewElement_renderSyncFileInfo).call(this)} ${__classPrivateFieldGet(this, _uSyncDefaultViewElement_instances, "m", _uSyncDefaultViewElement_renderLegacyBanner).call(this)}
|
|
127
|
-
${__classPrivateFieldGet(this, _uSyncDefaultViewElement_instances, "m", _uSyncDefaultViewElement_renderSetPicker).call(this)}
|
|
128
|
-
<div class="wrapper">
|
|
129
|
-
${__classPrivateFieldGet(this, _uSyncDefaultViewElement_instances, "m", _uSyncDefaultViewElement_renderActions).call(this)} ${__classPrivateFieldGet(this, _uSyncDefaultViewElement_instances, "m", _uSyncDefaultViewElement_renderBanner).call(this)}
|
|
130
|
-
${__classPrivateFieldGet(this, _uSyncDefaultViewElement_instances, "m", _uSyncDefaultViewElement_renderProcessBox).call(this)}${__classPrivateFieldGet(this, _uSyncDefaultViewElement_instances, "m", _uSyncDefaultViewElement_renderReport).call(this)}
|
|
131
|
-
</div>
|
|
132
|
-
</umb-body-layout>
|
|
123
|
+
return html `
|
|
124
|
+
<umb-body-layout>
|
|
125
|
+
${__classPrivateFieldGet(this, _uSyncDefaultViewElement_instances, "m", _uSyncDefaultViewElement_renderBackgroundBanner).call(this)}
|
|
126
|
+
${__classPrivateFieldGet(this, _uSyncDefaultViewElement_instances, "m", _uSyncDefaultViewElement_renderSyncFileInfo).call(this)} ${__classPrivateFieldGet(this, _uSyncDefaultViewElement_instances, "m", _uSyncDefaultViewElement_renderLegacyBanner).call(this)}
|
|
127
|
+
${__classPrivateFieldGet(this, _uSyncDefaultViewElement_instances, "m", _uSyncDefaultViewElement_renderSetPicker).call(this)}
|
|
128
|
+
<div class="wrapper">
|
|
129
|
+
${__classPrivateFieldGet(this, _uSyncDefaultViewElement_instances, "m", _uSyncDefaultViewElement_renderActions).call(this)} ${__classPrivateFieldGet(this, _uSyncDefaultViewElement_instances, "m", _uSyncDefaultViewElement_renderBanner).call(this)}
|
|
130
|
+
${__classPrivateFieldGet(this, _uSyncDefaultViewElement_instances, "m", _uSyncDefaultViewElement_renderProcessBox).call(this)}${__classPrivateFieldGet(this, _uSyncDefaultViewElement_instances, "m", _uSyncDefaultViewElement_renderReport).call(this)}
|
|
131
|
+
</div>
|
|
132
|
+
</umb-body-layout>
|
|
133
133
|
`;
|
|
134
134
|
}
|
|
135
135
|
}
|
|
@@ -179,30 +179,30 @@ _uSyncDefaultViewElement_renderSetPicker = function _uSyncDefaultViewElement_ren
|
|
|
179
179
|
selected: set.name === this._setName,
|
|
180
180
|
};
|
|
181
181
|
});
|
|
182
|
-
return html `<div class="set-picker">
|
|
183
|
-
<label for="set-select"
|
|
184
|
-
>${this.localize.termOrDefault('USyncSettings_currentHandlerSet', 'Current Set')}</label
|
|
185
|
-
>
|
|
186
|
-
<uui-select
|
|
187
|
-
id="set-select"
|
|
188
|
-
.label=${this.localize.termOrDefault('USyncSettings_currentHandlerSet', 'Current Set')}
|
|
189
|
-
.options=${options}
|
|
182
|
+
return html `<div class="set-picker">
|
|
183
|
+
<label for="set-select"
|
|
184
|
+
>${this.localize.termOrDefault('USyncSettings_currentHandlerSet', 'Current Set')}</label
|
|
185
|
+
>
|
|
186
|
+
<uui-select
|
|
187
|
+
id="set-select"
|
|
188
|
+
.label=${this.localize.termOrDefault('USyncSettings_currentHandlerSet', 'Current Set')}
|
|
189
|
+
.options=${options}
|
|
190
190
|
@change=${(e) => {
|
|
191
191
|
const select = e.target;
|
|
192
192
|
this._setName = select.value;
|
|
193
193
|
__classPrivateFieldGet(this, _uSyncDefaultViewElement_actionContext, "f")?.getActions(this._setName);
|
|
194
|
-
}}>
|
|
195
|
-
</uui-select>
|
|
194
|
+
}}>
|
|
195
|
+
</uui-select>
|
|
196
196
|
</div> `;
|
|
197
197
|
};
|
|
198
198
|
_uSyncDefaultViewElement_renderLegacyBanner = function _uSyncDefaultViewElement_renderLegacyBanner() {
|
|
199
199
|
return !this._legacy?.hasLegacy
|
|
200
200
|
? nothing
|
|
201
|
-
: html `
|
|
202
|
-
<div class="legacy-banner">
|
|
203
|
-
<umb-icon name="icon-alert"></umb-icon>
|
|
204
|
-
${this.localize.termOrDefault('uSync_legacyBanner', 'This site contains files from a previous version of uSync, view the details in the legacy tab.')}
|
|
205
|
-
</div>
|
|
201
|
+
: html `
|
|
202
|
+
<div class="legacy-banner">
|
|
203
|
+
<umb-icon name="icon-alert"></umb-icon>
|
|
204
|
+
${this.localize.termOrDefault('uSync_legacyBanner', 'This site contains files from a previous version of uSync, view the details in the legacy tab.')}
|
|
205
|
+
</div>
|
|
206
206
|
`;
|
|
207
207
|
};
|
|
208
208
|
_uSyncDefaultViewElement_renderSyncFileInfo = function _uSyncDefaultViewElement_renderSyncFileInfo() {
|
|
@@ -217,13 +217,13 @@ _uSyncDefaultViewElement_renderActions = function _uSyncDefaultViewElement_rende
|
|
|
217
217
|
if (!this._actions || !Array.isArray(this._actions))
|
|
218
218
|
return nothing;
|
|
219
219
|
var actions = this._actions?.map((group) => {
|
|
220
|
-
return html `
|
|
221
|
-
<usync-action-box
|
|
222
|
-
.disabled=${this._disabled}
|
|
223
|
-
.group="${group}"
|
|
224
|
-
.state=${this._buttonState}
|
|
225
|
-
@perform-action=${__classPrivateFieldGet(this, _uSyncDefaultViewElement_instances, "m", _uSyncDefaultViewElement_performAction)}>
|
|
226
|
-
</usync-action-box>
|
|
220
|
+
return html `
|
|
221
|
+
<usync-action-box
|
|
222
|
+
.disabled=${this._disabled}
|
|
223
|
+
.group="${group}"
|
|
224
|
+
.state=${this._buttonState}
|
|
225
|
+
@perform-action=${__classPrivateFieldGet(this, _uSyncDefaultViewElement_instances, "m", _uSyncDefaultViewElement_performAction)}>
|
|
226
|
+
</usync-action-box>
|
|
227
227
|
`;
|
|
228
228
|
});
|
|
229
229
|
return html ` <div class="action-buttons-box">${actions}</div> `;
|
|
@@ -231,23 +231,23 @@ _uSyncDefaultViewElement_renderActions = function _uSyncDefaultViewElement_rende
|
|
|
231
231
|
_uSyncDefaultViewElement_renderBanner = function _uSyncDefaultViewElement_renderBanner() {
|
|
232
232
|
if (this._showProgress === true || this._completed === true)
|
|
233
233
|
return nothing;
|
|
234
|
-
return html `
|
|
235
|
-
<umb-empty-state>
|
|
236
|
-
<h2>
|
|
237
|
-
<uui-icon name="usync-logo"></uui-icon>
|
|
238
|
-
<umb-localize key="uSync_banner"></umb-localize>
|
|
239
|
-
</h2>
|
|
240
|
-
</umb-empty-state>
|
|
234
|
+
return html `
|
|
235
|
+
<umb-empty-state>
|
|
236
|
+
<h2>
|
|
237
|
+
<uui-icon name="usync-logo"></uui-icon>
|
|
238
|
+
<umb-localize key="uSync_banner"></umb-localize>
|
|
239
|
+
</h2>
|
|
240
|
+
</umb-empty-state>
|
|
241
241
|
`;
|
|
242
242
|
};
|
|
243
243
|
_uSyncDefaultViewElement_renderProcessBox = function _uSyncDefaultViewElement_renderProcessBox() {
|
|
244
244
|
if (this._showProgress == false && this._completed == false)
|
|
245
245
|
return nothing;
|
|
246
|
-
return html `
|
|
247
|
-
<usync-progress-box
|
|
248
|
-
.title=${this._group?.groupName ?? 'doh!'}
|
|
249
|
-
.actions=${this._workingActions}
|
|
250
|
-
.complete=${this._completed}></usync-progress-box>
|
|
246
|
+
return html `
|
|
247
|
+
<usync-progress-box
|
|
248
|
+
.title=${this._group?.groupName ?? 'doh!'}
|
|
249
|
+
.actions=${this._workingActions}
|
|
250
|
+
.complete=${this._completed}></usync-progress-box>
|
|
251
251
|
`;
|
|
252
252
|
};
|
|
253
253
|
_uSyncDefaultViewElement_renderReport = function _uSyncDefaultViewElement_renderReport() {
|
|
@@ -259,156 +259,156 @@ _uSyncDefaultViewElement_renderBackgroundBanner = function _uSyncDefaultViewElem
|
|
|
259
259
|
if (!this._inBackground || !this._working)
|
|
260
260
|
return nothing;
|
|
261
261
|
if (!this._connected) {
|
|
262
|
-
return html ` <uui-box class="banner warning">
|
|
263
|
-
<div class="banner-row">
|
|
264
|
-
<uui-icon name="icon-alert"></uui-icon>
|
|
265
|
-
<div class="banner-text">
|
|
266
|
-
${this.localize.termOrDefault('uSync_runningInBackground', 'uSync is running this process in background, if you navigate away from this page it will continue to run.')}
|
|
267
|
-
<br />
|
|
268
|
-
${this.localize.termOrDefault('uSync_connectionLost', 'the connection to the server has been lost, the process will continue to run in the background but you will not see updates here.')}
|
|
269
|
-
</div>
|
|
270
|
-
${__classPrivateFieldGet(this, _uSyncDefaultViewElement_instances, "m", _uSyncDefaultViewElement_renderDismissBackgroundRun).call(this)}
|
|
271
|
-
</div>
|
|
262
|
+
return html ` <uui-box class="banner warning">
|
|
263
|
+
<div class="banner-row">
|
|
264
|
+
<uui-icon name="icon-alert"></uui-icon>
|
|
265
|
+
<div class="banner-text">
|
|
266
|
+
${this.localize.termOrDefault('uSync_runningInBackground', 'uSync is running this process in background, if you navigate away from this page it will continue to run.')}
|
|
267
|
+
<br />
|
|
268
|
+
${this.localize.termOrDefault('uSync_connectionLost', 'the connection to the server has been lost, the process will continue to run in the background but you will not see updates here.')}
|
|
269
|
+
</div>
|
|
270
|
+
${__classPrivateFieldGet(this, _uSyncDefaultViewElement_instances, "m", _uSyncDefaultViewElement_renderDismissBackgroundRun).call(this)}
|
|
271
|
+
</div>
|
|
272
272
|
</uui-box>`;
|
|
273
273
|
}
|
|
274
|
-
return html `<uui-box class="banner info">
|
|
275
|
-
<div class="banner-row">
|
|
276
|
-
<uui-icon name="icon-info"></uui-icon>
|
|
277
|
-
<div class="banner-text">
|
|
278
|
-
${this.localize.termOrDefault('uSync_runningInBackground', 'uSync is running this process in background, if you navigate away from this page it will continue to run.')}
|
|
279
|
-
</div>
|
|
280
|
-
${__classPrivateFieldGet(this, _uSyncDefaultViewElement_instances, "m", _uSyncDefaultViewElement_renderDismissBackgroundRun).call(this)}
|
|
281
|
-
</div>
|
|
274
|
+
return html `<uui-box class="banner info">
|
|
275
|
+
<div class="banner-row">
|
|
276
|
+
<uui-icon name="icon-info"></uui-icon>
|
|
277
|
+
<div class="banner-text">
|
|
278
|
+
${this.localize.termOrDefault('uSync_runningInBackground', 'uSync is running this process in background, if you navigate away from this page it will continue to run.')}
|
|
279
|
+
</div>
|
|
280
|
+
${__classPrivateFieldGet(this, _uSyncDefaultViewElement_instances, "m", _uSyncDefaultViewElement_renderDismissBackgroundRun).call(this)}
|
|
281
|
+
</div>
|
|
282
282
|
</uui-box>`;
|
|
283
283
|
};
|
|
284
284
|
_uSyncDefaultViewElement_renderDismissBackgroundRun = function _uSyncDefaultViewElement_renderDismissBackgroundRun() {
|
|
285
|
-
return html `
|
|
286
|
-
<uui-button
|
|
287
|
-
class="dismiss"
|
|
288
|
-
look="secondary"
|
|
289
|
-
compact
|
|
290
|
-
label=${this.localize.termOrDefault('uSync_dismissBackgroundRun', 'Not actually running? Reset this view')}
|
|
291
|
-
@click=${() => __classPrivateFieldGet(this, _uSyncDefaultViewElement_actionContext, "f")?.dismissBackgroundRun()}>
|
|
292
|
-
<uui-icon name="icon-remove"></uui-icon>
|
|
293
|
-
</uui-button>
|
|
285
|
+
return html `
|
|
286
|
+
<uui-button
|
|
287
|
+
class="dismiss"
|
|
288
|
+
look="secondary"
|
|
289
|
+
compact
|
|
290
|
+
label=${this.localize.termOrDefault('uSync_dismissBackgroundRun', 'Not actually running? Reset this view')}
|
|
291
|
+
@click=${() => __classPrivateFieldGet(this, _uSyncDefaultViewElement_actionContext, "f")?.dismissBackgroundRun()}>
|
|
292
|
+
<uui-icon name="icon-remove"></uui-icon>
|
|
293
|
+
</uui-button>
|
|
294
294
|
`;
|
|
295
295
|
};
|
|
296
296
|
uSyncDefaultViewElement.styles = [
|
|
297
|
-
css `
|
|
298
|
-
:host {
|
|
299
|
-
display: block;
|
|
300
|
-
// margin-top: calc(var(--uui-size-space-4) * -1);
|
|
301
|
-
}
|
|
302
|
-
|
|
303
|
-
.wrapper {
|
|
304
|
-
display: flex;
|
|
305
|
-
flex-direction: column;
|
|
306
|
-
gap: var(--uui-size-space-4);
|
|
307
|
-
}
|
|
308
|
-
|
|
309
|
-
.legacy-banner {
|
|
310
|
-
display: flex;
|
|
311
|
-
gap: var(--uui-size-space-2);
|
|
312
|
-
padding: var(--uui-size-space-4);
|
|
313
|
-
margin: var(--uui-size-space-4) 0;
|
|
314
|
-
background-color: var(--uui-color-warning);
|
|
315
|
-
color: var(--uui-color-warning-contrast);
|
|
316
|
-
}
|
|
317
|
-
|
|
318
|
-
.results-box {
|
|
319
|
-
position: relative;
|
|
320
|
-
display: block;
|
|
321
|
-
z-index: 1;
|
|
322
|
-
}
|
|
323
|
-
|
|
324
|
-
.action-buttons-box {
|
|
325
|
-
display: grid;
|
|
326
|
-
grid-template-columns: repeat(auto-fit, minmax(430px, 1fr));
|
|
327
|
-
position: relative;
|
|
328
|
-
gap: var(--uui-size-space-5);
|
|
329
|
-
flex-wrap: wrap;
|
|
330
|
-
align-content: stretch;
|
|
331
|
-
z-index: 1;
|
|
332
|
-
}
|
|
333
|
-
|
|
334
|
-
umb-empty-state {
|
|
335
|
-
position: absolute;
|
|
336
|
-
top: 50%;
|
|
337
|
-
transform: translateY(-50%);
|
|
338
|
-
left: 0;
|
|
339
|
-
right: 0;
|
|
340
|
-
margin: 0 auto;
|
|
341
|
-
text-align: center;
|
|
342
|
-
color: var(--uui-color-border);
|
|
343
|
-
z-index: 0;
|
|
344
|
-
}
|
|
345
|
-
|
|
346
|
-
umb-empty-state h2 {
|
|
347
|
-
font-size: var(--uui-type-h2-size);
|
|
348
|
-
}
|
|
349
|
-
|
|
350
|
-
umb-empty-state uui-icon {
|
|
351
|
-
position: relative;
|
|
352
|
-
top: var(--uui-size-2);
|
|
353
|
-
}
|
|
354
|
-
|
|
355
|
-
.set-picker {
|
|
356
|
-
display: flex;
|
|
357
|
-
flex-direction: row;
|
|
358
|
-
align-items: center;
|
|
359
|
-
justify-content: flex-end;
|
|
360
|
-
gap: var(--uui-size-space-2);
|
|
361
|
-
margin-bottom: var(--uui-size-space-4);
|
|
362
|
-
border: 1px solid var(--uui-color-border);
|
|
363
|
-
padding: var(--uui-size-space-4);
|
|
364
|
-
}
|
|
365
|
-
|
|
366
|
-
.set-picker label {
|
|
367
|
-
font-weight: 700;
|
|
368
|
-
}
|
|
369
|
-
|
|
370
|
-
.set-picker label::after {
|
|
371
|
-
content: ':';
|
|
372
|
-
}
|
|
373
|
-
|
|
374
|
-
.info {
|
|
375
|
-
background-color: var(--uui-color-positive);
|
|
376
|
-
color: var(--uui-color-positive-contrast);
|
|
377
|
-
}
|
|
378
|
-
|
|
379
|
-
.banner-row {
|
|
380
|
-
display: flex;
|
|
381
|
-
align-items: flex-start;
|
|
382
|
-
gap: var(--uui-size-space-3);
|
|
383
|
-
}
|
|
384
|
-
|
|
385
|
-
.banner-text {
|
|
386
|
-
flex: 1 1 auto;
|
|
387
|
-
}
|
|
388
|
-
|
|
389
|
-
.banner-row uui-button.dismiss {
|
|
390
|
-
flex: 0 0 auto;
|
|
391
|
-
margin: calc(var(--uui-size-space-2) * -1) calc(var(--uui-size-space-2) * -1) 0 0;
|
|
392
|
-
/* blend into the alert - same colour as its background/text, so it
|
|
393
|
-
doesn't draw attention unless someone's actually looking for it */
|
|
394
|
-
color: inherit;
|
|
395
|
-
--uui-button-background-color: transparent;
|
|
396
|
-
--uui-button-background-color-hover: rgb(0 0 0 / 8%);
|
|
397
|
-
--uui-button-contrast: currentColor;
|
|
398
|
-
--uui-button-contrast-hover: currentColor;
|
|
399
|
-
--uui-button-border-color: transparent;
|
|
400
|
-
--uui-button-border-color-hover: transparent;
|
|
401
|
-
}
|
|
402
|
-
|
|
403
|
-
.banner {
|
|
404
|
-
display: block;
|
|
405
|
-
margin-bottom: var(--uui-size-space-4);
|
|
406
|
-
}
|
|
407
|
-
|
|
408
|
-
.warning {
|
|
409
|
-
background-color: var(--uui-color-warning);
|
|
410
|
-
color: var(--uui-color-warning-contrast);
|
|
411
|
-
}
|
|
297
|
+
css `
|
|
298
|
+
:host {
|
|
299
|
+
display: block;
|
|
300
|
+
// margin-top: calc(var(--uui-size-space-4) * -1);
|
|
301
|
+
}
|
|
302
|
+
|
|
303
|
+
.wrapper {
|
|
304
|
+
display: flex;
|
|
305
|
+
flex-direction: column;
|
|
306
|
+
gap: var(--uui-size-space-4);
|
|
307
|
+
}
|
|
308
|
+
|
|
309
|
+
.legacy-banner {
|
|
310
|
+
display: flex;
|
|
311
|
+
gap: var(--uui-size-space-2);
|
|
312
|
+
padding: var(--uui-size-space-4);
|
|
313
|
+
margin: var(--uui-size-space-4) 0;
|
|
314
|
+
background-color: var(--uui-color-warning);
|
|
315
|
+
color: var(--uui-color-warning-contrast);
|
|
316
|
+
}
|
|
317
|
+
|
|
318
|
+
.results-box {
|
|
319
|
+
position: relative;
|
|
320
|
+
display: block;
|
|
321
|
+
z-index: 1;
|
|
322
|
+
}
|
|
323
|
+
|
|
324
|
+
.action-buttons-box {
|
|
325
|
+
display: grid;
|
|
326
|
+
grid-template-columns: repeat(auto-fit, minmax(430px, 1fr));
|
|
327
|
+
position: relative;
|
|
328
|
+
gap: var(--uui-size-space-5);
|
|
329
|
+
flex-wrap: wrap;
|
|
330
|
+
align-content: stretch;
|
|
331
|
+
z-index: 1;
|
|
332
|
+
}
|
|
333
|
+
|
|
334
|
+
umb-empty-state {
|
|
335
|
+
position: absolute;
|
|
336
|
+
top: 50%;
|
|
337
|
+
transform: translateY(-50%);
|
|
338
|
+
left: 0;
|
|
339
|
+
right: 0;
|
|
340
|
+
margin: 0 auto;
|
|
341
|
+
text-align: center;
|
|
342
|
+
color: var(--uui-color-border);
|
|
343
|
+
z-index: 0;
|
|
344
|
+
}
|
|
345
|
+
|
|
346
|
+
umb-empty-state h2 {
|
|
347
|
+
font-size: var(--uui-type-h2-size);
|
|
348
|
+
}
|
|
349
|
+
|
|
350
|
+
umb-empty-state uui-icon {
|
|
351
|
+
position: relative;
|
|
352
|
+
top: var(--uui-size-2);
|
|
353
|
+
}
|
|
354
|
+
|
|
355
|
+
.set-picker {
|
|
356
|
+
display: flex;
|
|
357
|
+
flex-direction: row;
|
|
358
|
+
align-items: center;
|
|
359
|
+
justify-content: flex-end;
|
|
360
|
+
gap: var(--uui-size-space-2);
|
|
361
|
+
margin-bottom: var(--uui-size-space-4);
|
|
362
|
+
border: 1px solid var(--uui-color-border);
|
|
363
|
+
padding: var(--uui-size-space-4);
|
|
364
|
+
}
|
|
365
|
+
|
|
366
|
+
.set-picker label {
|
|
367
|
+
font-weight: 700;
|
|
368
|
+
}
|
|
369
|
+
|
|
370
|
+
.set-picker label::after {
|
|
371
|
+
content: ':';
|
|
372
|
+
}
|
|
373
|
+
|
|
374
|
+
.info {
|
|
375
|
+
background-color: var(--uui-color-positive);
|
|
376
|
+
color: var(--uui-color-positive-contrast);
|
|
377
|
+
}
|
|
378
|
+
|
|
379
|
+
.banner-row {
|
|
380
|
+
display: flex;
|
|
381
|
+
align-items: flex-start;
|
|
382
|
+
gap: var(--uui-size-space-3);
|
|
383
|
+
}
|
|
384
|
+
|
|
385
|
+
.banner-text {
|
|
386
|
+
flex: 1 1 auto;
|
|
387
|
+
}
|
|
388
|
+
|
|
389
|
+
.banner-row uui-button.dismiss {
|
|
390
|
+
flex: 0 0 auto;
|
|
391
|
+
margin: calc(var(--uui-size-space-2) * -1) calc(var(--uui-size-space-2) * -1) 0 0;
|
|
392
|
+
/* blend into the alert - same colour as its background/text, so it
|
|
393
|
+
doesn't draw attention unless someone's actually looking for it */
|
|
394
|
+
color: inherit;
|
|
395
|
+
--uui-button-background-color: transparent;
|
|
396
|
+
--uui-button-background-color-hover: rgb(0 0 0 / 8%);
|
|
397
|
+
--uui-button-contrast: currentColor;
|
|
398
|
+
--uui-button-contrast-hover: currentColor;
|
|
399
|
+
--uui-button-border-color: transparent;
|
|
400
|
+
--uui-button-border-color-hover: transparent;
|
|
401
|
+
}
|
|
402
|
+
|
|
403
|
+
.banner {
|
|
404
|
+
display: block;
|
|
405
|
+
margin-bottom: var(--uui-size-space-4);
|
|
406
|
+
}
|
|
407
|
+
|
|
408
|
+
.warning {
|
|
409
|
+
background-color: var(--uui-color-warning);
|
|
410
|
+
color: var(--uui-color-warning-contrast);
|
|
411
|
+
}
|
|
412
412
|
`,
|
|
413
413
|
];
|
|
414
414
|
__decorate([
|