@scaleflex/uploader 0.2.6 → 0.2.7
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 +3 -3
- package/dist/components/drop-zone.d.ts.map +1 -1
- package/dist/components/file-list.d.ts.map +1 -1
- package/dist/define.cjs +1 -1
- package/dist/define.js +1 -1
- package/dist/index.cjs +1 -1
- package/dist/index.js +1 -1
- package/dist/{provider-browser-DcYDZQos.js → provider-browser-B33dyOPN.js} +1 -1
- package/dist/{provider-browser-B85iISh9.cjs → provider-browser-CXFOnoRc.cjs} +1 -1
- package/dist/{search-provider-browser-DqKnNu87.cjs → search-provider-browser-CIRU1j5X.cjs} +1 -1
- package/dist/{search-provider-browser-Cn0v6Gcq.js → search-provider-browser-gtlEKi5h.js} +1 -1
- package/dist/{sfx-uploader-C3Z9k-Q8.js → sfx-uploader-BBQinsQB.js} +554 -539
- package/dist/{sfx-uploader-C_E3gvgv.cjs → sfx-uploader-DNjq8DwX.cjs} +61 -59
- package/dist/utils/portal-target.d.ts +4 -2
- package/dist/utils/portal-target.d.ts.map +1 -1
- package/package.json +1 -1
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import { LitElement as U, css as S, svg as
|
|
2
|
-
import { property as b, state as g, query as
|
|
3
|
-
import { unsafeSVG as
|
|
1
|
+
import { LitElement as U, css as S, svg as O, html as l, render as T, nothing as c } from "lit";
|
|
2
|
+
import { property as b, state as g, query as Fe } from "lit/decorators.js";
|
|
3
|
+
import { unsafeSVG as F } from "lit/directives/unsafe-svg.js";
|
|
4
4
|
import { unsafeHTML as M } from "lit/directives/unsafe-html.js";
|
|
5
|
-
class
|
|
5
|
+
class Me {
|
|
6
6
|
constructor(e) {
|
|
7
7
|
this.listeners = /* @__PURE__ */ new Set(), this._notifying = !1, this._pendingState = null, this.state = e;
|
|
8
8
|
}
|
|
@@ -17,13 +17,13 @@ class Oe {
|
|
|
17
17
|
const t = this.state;
|
|
18
18
|
this.state = { ...t, ...e }, this._notifying = !0;
|
|
19
19
|
try {
|
|
20
|
-
this.listeners.forEach((
|
|
20
|
+
this.listeners.forEach((o) => o(this.state, t));
|
|
21
21
|
} finally {
|
|
22
22
|
this._notifying = !1;
|
|
23
23
|
}
|
|
24
24
|
if (this._pendingState) {
|
|
25
|
-
const
|
|
26
|
-
this._pendingState = null, this.setState(
|
|
25
|
+
const o = this._pendingState;
|
|
26
|
+
this._pendingState = null, this.setState(o);
|
|
27
27
|
}
|
|
28
28
|
}
|
|
29
29
|
subscribe(e) {
|
|
@@ -34,23 +34,23 @@ class Oe {
|
|
|
34
34
|
}
|
|
35
35
|
}
|
|
36
36
|
function P(a, e, t) {
|
|
37
|
-
const
|
|
37
|
+
const o = a.getState().files, r = o.get(e);
|
|
38
38
|
if (!r) return;
|
|
39
|
-
const
|
|
40
|
-
|
|
39
|
+
const i = new Map(o);
|
|
40
|
+
i.set(e, { ...r, ...t }), a.setState({ files: i });
|
|
41
41
|
}
|
|
42
42
|
function H(a, e) {
|
|
43
43
|
const t = new Map(a.getState().files);
|
|
44
44
|
t.set(e.id, e), a.setState({ files: t });
|
|
45
45
|
}
|
|
46
|
-
function
|
|
46
|
+
function Se(a, e) {
|
|
47
47
|
const t = a.getState().files;
|
|
48
48
|
if (!t.has(e)) return;
|
|
49
|
-
const
|
|
50
|
-
|
|
49
|
+
const o = new Map(t);
|
|
50
|
+
o.delete(e), a.setState({ files: o });
|
|
51
51
|
}
|
|
52
|
-
function
|
|
53
|
-
return new
|
|
52
|
+
function Te() {
|
|
53
|
+
return new Me({
|
|
54
54
|
files: /* @__PURE__ */ new Map(),
|
|
55
55
|
queueConfig: {
|
|
56
56
|
concurrency: 3,
|
|
@@ -79,7 +79,7 @@ function Re() {
|
|
|
79
79
|
isUploading: !1
|
|
80
80
|
});
|
|
81
81
|
}
|
|
82
|
-
class
|
|
82
|
+
class Be {
|
|
83
83
|
constructor(e, t) {
|
|
84
84
|
this.host = e, this.store = t, e.addController(this);
|
|
85
85
|
}
|
|
@@ -99,17 +99,17 @@ class Me {
|
|
|
99
99
|
(e = this.unsubscribe) == null || e.call(this);
|
|
100
100
|
}
|
|
101
101
|
}
|
|
102
|
-
function
|
|
102
|
+
function Le(a, e) {
|
|
103
103
|
const t = new XMLHttpRequest();
|
|
104
|
-
let
|
|
105
|
-
const
|
|
106
|
-
t.open("POST",
|
|
104
|
+
let o = !1;
|
|
105
|
+
const i = `${e.apiBase.replace(/\/+$/, "")}/v4/files?folder=${encodeURIComponent(e.folder)}`;
|
|
106
|
+
t.open("POST", i);
|
|
107
107
|
for (const [n, d] of Object.entries(e.authHeaders))
|
|
108
108
|
t.setRequestHeader(n, d);
|
|
109
109
|
t.upload.addEventListener("progress", (n) => {
|
|
110
|
-
n.lengthComputable && !
|
|
110
|
+
n.lengthComputable && !o && e.onProgress(n.loaded, n.total);
|
|
111
111
|
}), t.addEventListener("load", () => {
|
|
112
|
-
if (
|
|
112
|
+
if (o) return;
|
|
113
113
|
let n;
|
|
114
114
|
try {
|
|
115
115
|
n = JSON.parse(t.responseText);
|
|
@@ -119,9 +119,9 @@ function Te(a, e) {
|
|
|
119
119
|
}
|
|
120
120
|
t.status >= 200 && t.status < 300 && n.status === "success" ? e.onComplete(n) : e.onError(new Error(n.hint || n.msg || `Upload failed (HTTP ${t.status})`));
|
|
121
121
|
}), t.addEventListener("error", () => {
|
|
122
|
-
|
|
122
|
+
o || e.onError(new Error("Network error — check your connection"));
|
|
123
123
|
}), t.addEventListener("timeout", () => {
|
|
124
|
-
|
|
124
|
+
o || e.onError(new Error("Upload timed out"));
|
|
125
125
|
});
|
|
126
126
|
const s = new FormData();
|
|
127
127
|
if (a.file) {
|
|
@@ -133,19 +133,19 @@ function Te(a, e) {
|
|
|
133
133
|
}
|
|
134
134
|
return t.timeout = 6e4, t.send(s), {
|
|
135
135
|
abort() {
|
|
136
|
-
|
|
136
|
+
o = !0, t.abort();
|
|
137
137
|
}
|
|
138
138
|
};
|
|
139
139
|
}
|
|
140
|
-
function
|
|
140
|
+
function Ae(a, e) {
|
|
141
141
|
const t = new XMLHttpRequest();
|
|
142
|
-
let
|
|
143
|
-
const
|
|
144
|
-
t.open("POST",
|
|
142
|
+
let o = !1;
|
|
143
|
+
const i = `${e.apiBase.replace(/\/+$/, "")}/v4/files/upload_url`;
|
|
144
|
+
t.open("POST", i);
|
|
145
145
|
for (const [n, d] of Object.entries(e.authHeaders))
|
|
146
146
|
t.setRequestHeader(n, d);
|
|
147
147
|
if (t.setRequestHeader("Content-Type", "application/json"), t.addEventListener("load", () => {
|
|
148
|
-
if (
|
|
148
|
+
if (o) return;
|
|
149
149
|
let n;
|
|
150
150
|
try {
|
|
151
151
|
n = JSON.parse(t.responseText);
|
|
@@ -155,9 +155,9 @@ function Be(a, e) {
|
|
|
155
155
|
}
|
|
156
156
|
t.status >= 200 && t.status < 300 && n.status === "success" ? e.onComplete(n) : e.onError(new Error(n.hint || n.msg || `Upload failed (HTTP ${t.status})`));
|
|
157
157
|
}), t.addEventListener("error", () => {
|
|
158
|
-
|
|
158
|
+
o || e.onError(new Error("Network error — check your connection"));
|
|
159
159
|
}), t.addEventListener("timeout", () => {
|
|
160
|
-
|
|
160
|
+
o || e.onError(new Error("Upload timed out"));
|
|
161
161
|
}), !a.remoteUrl)
|
|
162
162
|
return e.onError(new Error("Remote URL is required for URL upload")), { abort() {
|
|
163
163
|
} };
|
|
@@ -167,7 +167,7 @@ function Be(a, e) {
|
|
|
167
167
|
};
|
|
168
168
|
return t.timeout = 6e4, t.send(JSON.stringify(s)), {
|
|
169
169
|
abort() {
|
|
170
|
-
|
|
170
|
+
o = !0, t.abort();
|
|
171
171
|
}
|
|
172
172
|
};
|
|
173
173
|
}
|
|
@@ -181,7 +181,7 @@ function re(a) {
|
|
|
181
181
|
function N(a) {
|
|
182
182
|
return a.replace(/\/+$/, "");
|
|
183
183
|
}
|
|
184
|
-
const
|
|
184
|
+
const Ie = {
|
|
185
185
|
"google-drive": "drive",
|
|
186
186
|
dropbox: "dropbox",
|
|
187
187
|
onedrive: "onedrive",
|
|
@@ -191,42 +191,42 @@ const Le = {
|
|
|
191
191
|
unsplash: "unsplash"
|
|
192
192
|
};
|
|
193
193
|
function G(a) {
|
|
194
|
-
return
|
|
194
|
+
return Ie[a] ?? a;
|
|
195
195
|
}
|
|
196
|
-
function
|
|
197
|
-
const t = N(a),
|
|
198
|
-
return `${t}/${r}/connect?state=${encodeURIComponent(
|
|
196
|
+
function _t(a, e) {
|
|
197
|
+
const t = N(a), o = btoa(JSON.stringify({ origin: window.location.origin })), r = G(e);
|
|
198
|
+
return `${t}/${r}/connect?state=${encodeURIComponent(o)}`;
|
|
199
199
|
}
|
|
200
|
-
async function
|
|
201
|
-
const r = N(a),
|
|
200
|
+
async function kt(a, e, t, o = "") {
|
|
201
|
+
const r = N(a), i = o ? `/${o}` : "", s = G(e), n = await fetch(`${r}/${s}/list${i}`, {
|
|
202
202
|
method: "GET",
|
|
203
203
|
headers: re(t),
|
|
204
204
|
credentials: "same-origin"
|
|
205
205
|
});
|
|
206
206
|
if (n.status === 401)
|
|
207
|
-
throw new
|
|
207
|
+
throw new ce();
|
|
208
208
|
if (!n.ok) {
|
|
209
209
|
const d = await n.json().catch(() => null);
|
|
210
210
|
throw new Error((d == null ? void 0 : d.message) || `Companion list failed (HTTP ${n.status})`);
|
|
211
211
|
}
|
|
212
212
|
return n.json();
|
|
213
213
|
}
|
|
214
|
-
async function
|
|
215
|
-
const
|
|
214
|
+
async function Ct(a, e, t) {
|
|
215
|
+
const o = N(a), r = await fetch(`${o}/${t}`, {
|
|
216
216
|
method: "GET",
|
|
217
217
|
headers: re(e),
|
|
218
218
|
credentials: "same-origin"
|
|
219
219
|
});
|
|
220
220
|
if (r.status === 401)
|
|
221
|
-
throw new
|
|
221
|
+
throw new ce();
|
|
222
222
|
if (!r.ok) {
|
|
223
|
-
const
|
|
224
|
-
throw new Error((
|
|
223
|
+
const i = await r.json().catch(() => null);
|
|
224
|
+
throw new Error((i == null ? void 0 : i.message) || `Companion list failed (HTTP ${r.status})`);
|
|
225
225
|
}
|
|
226
226
|
return r.json();
|
|
227
227
|
}
|
|
228
|
-
async function
|
|
229
|
-
const r = N(a),
|
|
228
|
+
async function $t(a, e, t, o) {
|
|
229
|
+
const r = N(a), i = G(e), s = o ? `q=${encodeURIComponent(t)}&${o}` : `q=${encodeURIComponent(t)}`, n = await fetch(`${r}/search/${i}/list?${s}`, {
|
|
230
230
|
method: "GET",
|
|
231
231
|
headers: {
|
|
232
232
|
Accept: "application/json",
|
|
@@ -240,8 +240,8 @@ async function kt(a, e, t, i) {
|
|
|
240
240
|
}
|
|
241
241
|
return n.json();
|
|
242
242
|
}
|
|
243
|
-
async function
|
|
244
|
-
const s = N(a), n = G(e), d =
|
|
243
|
+
async function He(a, e, t, o, r, i = !1) {
|
|
244
|
+
const s = N(a), n = G(e), d = i ? `${s}/search/${n}/get/${o}` : `${s}/${n}/get/${o}`, p = i ? { Accept: "application/json", "Content-Type": "application/json" } : re(t), h = await fetch(d, {
|
|
245
245
|
method: "POST",
|
|
246
246
|
headers: p,
|
|
247
247
|
credentials: "same-origin",
|
|
@@ -253,49 +253,49 @@ async function Ae(a, e, t, i, r, o = !1) {
|
|
|
253
253
|
})
|
|
254
254
|
});
|
|
255
255
|
if (h.status === 401)
|
|
256
|
-
throw new
|
|
256
|
+
throw new ce();
|
|
257
257
|
if (!h.ok) {
|
|
258
258
|
const u = await h.json().catch(() => null);
|
|
259
259
|
throw new Error((u == null ? void 0 : u.message) || `Companion upload failed (HTTP ${h.status})`);
|
|
260
260
|
}
|
|
261
261
|
return h.json();
|
|
262
262
|
}
|
|
263
|
-
async function
|
|
264
|
-
const
|
|
263
|
+
async function St(a, e, t) {
|
|
264
|
+
const o = N(a), r = G(e), i = await fetch(`${o}/${r}/logout`, {
|
|
265
265
|
method: "GET",
|
|
266
266
|
headers: re(t),
|
|
267
267
|
credentials: "same-origin"
|
|
268
268
|
});
|
|
269
|
-
return
|
|
269
|
+
return i.ok ? i.json() : { ok: !1, revoked: !1 };
|
|
270
270
|
}
|
|
271
|
-
function
|
|
271
|
+
function qe(a) {
|
|
272
272
|
var r;
|
|
273
273
|
const t = ((r = /^(?:https?:\/\/|\/\/)?(?:[^@\n]+@)?(?:www\.)?([^\n]+)/i.exec(a)) == null ? void 0 : r[1]) ?? a;
|
|
274
274
|
return `${location.protocol === "https:" ? "wss" : "ws"}://${t}`;
|
|
275
275
|
}
|
|
276
|
-
class
|
|
276
|
+
class ce extends Error {
|
|
277
277
|
constructor() {
|
|
278
278
|
super("Authentication expired"), this.name = "AuthExpiredError";
|
|
279
279
|
}
|
|
280
280
|
}
|
|
281
|
-
function
|
|
281
|
+
function Ye(a, e) {
|
|
282
282
|
const t = a.remoteInfo;
|
|
283
283
|
if (!t)
|
|
284
284
|
return e.onError(new Error("remoteInfo is required for companion upload")), { abort() {
|
|
285
285
|
} };
|
|
286
|
-
let
|
|
286
|
+
let o = !1, r = null;
|
|
287
287
|
const s = `${e.apiBase.replace(/\/+$/, "")}/v4/files?folder=${encodeURIComponent(e.folder)}`, n = {};
|
|
288
288
|
a.meta && Object.keys(a.meta).length > 0 && Object.assign(n, a.meta), a.tags && a.tags.length > 0 && (n.tags = a.tags);
|
|
289
289
|
const d = !t.token;
|
|
290
|
-
return
|
|
290
|
+
return He(t.companionUrl, t.provider, t.token, t.requestPath, {
|
|
291
291
|
fileId: t.fileId,
|
|
292
292
|
endpoint: s,
|
|
293
293
|
headers: e.authHeaders,
|
|
294
294
|
size: t.size,
|
|
295
295
|
metadata: Object.keys(n).length > 0 ? n : void 0
|
|
296
296
|
}, d).then((p) => {
|
|
297
|
-
if (
|
|
298
|
-
const u = `${
|
|
297
|
+
if (o) return;
|
|
298
|
+
const u = `${qe(t.companionUrl)}/api/${p.token}`;
|
|
299
299
|
try {
|
|
300
300
|
r = new WebSocket(u);
|
|
301
301
|
} catch {
|
|
@@ -304,7 +304,7 @@ function He(a, e) {
|
|
|
304
304
|
}
|
|
305
305
|
r.onmessage = (x) => {
|
|
306
306
|
var f, m, _;
|
|
307
|
-
if (!
|
|
307
|
+
if (!o)
|
|
308
308
|
try {
|
|
309
309
|
const w = JSON.parse(x.data);
|
|
310
310
|
switch (w.action) {
|
|
@@ -346,15 +346,15 @@ function He(a, e) {
|
|
|
346
346
|
} catch {
|
|
347
347
|
}
|
|
348
348
|
}, r.onerror = () => {
|
|
349
|
-
|
|
349
|
+
o || e.onError(new Error("Upload progress connection failed"));
|
|
350
350
|
}, r.onclose = () => {
|
|
351
351
|
r = null;
|
|
352
352
|
};
|
|
353
353
|
}).catch((p) => {
|
|
354
|
-
|
|
354
|
+
o || e.onError(p instanceof Error ? p : new Error(String(p)));
|
|
355
355
|
}), {
|
|
356
356
|
abort() {
|
|
357
|
-
if (
|
|
357
|
+
if (o = !0, r) {
|
|
358
358
|
try {
|
|
359
359
|
r.send(JSON.stringify({ action: "cancel", payload: {} }));
|
|
360
360
|
} catch {
|
|
@@ -364,7 +364,7 @@ function He(a, e) {
|
|
|
364
364
|
}
|
|
365
365
|
};
|
|
366
366
|
}
|
|
367
|
-
class
|
|
367
|
+
class Ve {
|
|
368
368
|
constructor(e, t) {
|
|
369
369
|
this.activeUploads = /* @__PURE__ */ new Map(), this.retryTimers = /* @__PURE__ */ new Map(), this.unsubscribe = null, this.store = e, this.config = t;
|
|
370
370
|
}
|
|
@@ -381,8 +381,8 @@ class qe {
|
|
|
381
381
|
uploadAll() {
|
|
382
382
|
const { files: e } = this.store.getState();
|
|
383
383
|
let t = !1;
|
|
384
|
-
for (const
|
|
385
|
-
|
|
384
|
+
for (const o of e.values())
|
|
385
|
+
o.status === "idle" ? (P(this.store, o.id, { status: "queued" }), t = !0) : o.status === "queued" && (t = !0);
|
|
386
386
|
t && (this.store.setState({ isUploading: !0 }), this.processQueue());
|
|
387
387
|
}
|
|
388
388
|
/**
|
|
@@ -418,7 +418,7 @@ class qe {
|
|
|
418
418
|
*/
|
|
419
419
|
cancelFile(e) {
|
|
420
420
|
const t = this.store.getState().files.get(e);
|
|
421
|
-
!t ||
|
|
421
|
+
!t || !Ee(t.status) || (this.abortUpload(e), P(this.store, e, { status: "cancelled" }));
|
|
422
422
|
}
|
|
423
423
|
/**
|
|
424
424
|
* Cancel all active/queued uploads.
|
|
@@ -426,7 +426,7 @@ class qe {
|
|
|
426
426
|
cancelAll() {
|
|
427
427
|
const { files: e } = this.store.getState();
|
|
428
428
|
for (const t of e.values())
|
|
429
|
-
|
|
429
|
+
Ee(t.status) && (this.abortUpload(t.id), P(this.store, t.id, { status: "cancelled" }));
|
|
430
430
|
this.store.setState({ isUploading: !1 });
|
|
431
431
|
}
|
|
432
432
|
/**
|
|
@@ -450,7 +450,7 @@ class qe {
|
|
|
450
450
|
processQueue() {
|
|
451
451
|
const e = this.store.getState();
|
|
452
452
|
if (e.isPaused) return;
|
|
453
|
-
const { concurrency: t } = e.queueConfig,
|
|
453
|
+
const { concurrency: t } = e.queueConfig, o = this.activeUploads.size, r = t - o;
|
|
454
454
|
if (r <= 0) return;
|
|
455
455
|
const s = [...e.files.values()].filter((n) => n.status === "queued").sort((n, d) => n.retryCount !== d.retryCount ? d.retryCount - n.retryCount : n.addedAt - d.addedAt).slice(0, r);
|
|
456
456
|
for (const n of s)
|
|
@@ -458,25 +458,25 @@ class qe {
|
|
|
458
458
|
}
|
|
459
459
|
startUpload(e) {
|
|
460
460
|
P(this.store, e.id, { status: "uploading", error: null });
|
|
461
|
-
let t = 0,
|
|
462
|
-
const
|
|
461
|
+
let t = 0, o = Date.now(), r = 0;
|
|
462
|
+
const i = {
|
|
463
463
|
apiBase: this.config.apiBase,
|
|
464
464
|
authHeaders: this.config.authHeaders,
|
|
465
465
|
folder: this.store.getState().targetFolder,
|
|
466
466
|
onComplete: (d) => this.handleComplete(e.id, d),
|
|
467
467
|
onError: (d) => this.handleError(e.id, d)
|
|
468
468
|
}, s = (d, p) => {
|
|
469
|
-
const h = Date.now(), u = (h -
|
|
469
|
+
const h = Date.now(), u = (h - o) / 1e3;
|
|
470
470
|
if (u > 0) {
|
|
471
471
|
const f = (d - t) / u;
|
|
472
472
|
r = r === 0 ? f : 0.3 * f + 0.7 * r;
|
|
473
473
|
}
|
|
474
|
-
t = d,
|
|
474
|
+
t = d, o = h;
|
|
475
475
|
const x = p > 0 ? Math.min(d / p * 100, 100) : 0;
|
|
476
476
|
P(this.store, e.id, { progress: x, bytesUploaded: d, speed: r }), this.updateTotalProgress();
|
|
477
477
|
};
|
|
478
478
|
let n;
|
|
479
|
-
e.remoteInfo ? n =
|
|
479
|
+
e.remoteInfo ? n = Ye(e, { ...i, onProgress: s }) : e.remoteUrl ? n = Ae(e, i) : n = Le(e, { ...i, onProgress: s }), this.activeUploads.set(e.id, n);
|
|
480
480
|
}
|
|
481
481
|
handleComplete(e, t) {
|
|
482
482
|
this.activeUploads.delete(e), P(this.store, e, {
|
|
@@ -487,18 +487,18 @@ class qe {
|
|
|
487
487
|
}
|
|
488
488
|
handleError(e, t) {
|
|
489
489
|
this.activeUploads.delete(e);
|
|
490
|
-
const
|
|
491
|
-
if (!
|
|
492
|
-
const { retryConfig: r } = this.store.getState().queueConfig,
|
|
493
|
-
if (
|
|
490
|
+
const o = this.store.getState().files.get(e);
|
|
491
|
+
if (!o) return;
|
|
492
|
+
const { retryConfig: r } = this.store.getState().queueConfig, i = o.retryCount + 1;
|
|
493
|
+
if (i <= r.maxRetries) {
|
|
494
494
|
const s = Math.min(
|
|
495
|
-
r.baseDelay * Math.pow(r.backoffFactor,
|
|
495
|
+
r.baseDelay * Math.pow(r.backoffFactor, o.retryCount),
|
|
496
496
|
r.maxDelay
|
|
497
497
|
);
|
|
498
498
|
P(this.store, e, {
|
|
499
499
|
status: "retrying",
|
|
500
500
|
error: t.message,
|
|
501
|
-
retryCount:
|
|
501
|
+
retryCount: i
|
|
502
502
|
});
|
|
503
503
|
const n = setTimeout(() => {
|
|
504
504
|
this.retryTimers.delete(e), P(this.store, e, { status: "queued" }), this.processQueue();
|
|
@@ -511,48 +511,48 @@ class qe {
|
|
|
511
511
|
}), this.checkAllComplete(), this.processQueue();
|
|
512
512
|
}
|
|
513
513
|
abortUpload(e) {
|
|
514
|
-
var
|
|
515
|
-
(
|
|
514
|
+
var o;
|
|
515
|
+
(o = this.activeUploads.get(e)) == null || o.abort(), this.activeUploads.delete(e);
|
|
516
516
|
const t = this.retryTimers.get(e);
|
|
517
517
|
t && (clearTimeout(t), this.retryTimers.delete(e));
|
|
518
518
|
}
|
|
519
519
|
updateTotalProgress() {
|
|
520
520
|
const { files: e } = this.store.getState();
|
|
521
|
-
let t = 0,
|
|
522
|
-
for (const
|
|
523
|
-
(
|
|
521
|
+
let t = 0, o = 0, r = 0;
|
|
522
|
+
for (const i of e.values())
|
|
523
|
+
(i.status === "queued" || i.status === "uploading" || i.status === "retrying" || i.status === "complete" || i.status === "failed") && (t += i.size, o += i.status === "complete" ? i.size : i.bytesUploaded), i.status === "uploading" && (r += i.speed);
|
|
524
524
|
this.store.setState({
|
|
525
525
|
totalBytes: t,
|
|
526
|
-
totalBytesUploaded:
|
|
526
|
+
totalBytesUploaded: o,
|
|
527
527
|
totalSpeed: r,
|
|
528
|
-
totalProgress: t > 0 ? Math.min(
|
|
528
|
+
totalProgress: t > 0 ? Math.min(o / t * 100, 100) : 0
|
|
529
529
|
});
|
|
530
530
|
}
|
|
531
531
|
checkAllComplete() {
|
|
532
532
|
const { files: e } = this.store.getState();
|
|
533
533
|
![...e.values()].some(
|
|
534
|
-
(
|
|
534
|
+
(o) => o.status === "queued" || o.status === "uploading" || o.status === "retrying"
|
|
535
535
|
) && this.store.getState().isUploading && this.store.setState({ isUploading: !1 });
|
|
536
536
|
}
|
|
537
537
|
}
|
|
538
|
-
function
|
|
538
|
+
function Ee(a) {
|
|
539
539
|
return a === "queued" || a === "uploading" || a === "retrying";
|
|
540
540
|
}
|
|
541
|
-
function
|
|
541
|
+
function fe(a) {
|
|
542
542
|
return `https://api.filerobot.com/${a}`;
|
|
543
543
|
}
|
|
544
|
-
async function
|
|
545
|
-
const t = `${
|
|
544
|
+
async function Ne(a, e) {
|
|
545
|
+
const t = `${fe(a)}/key/${encodeURIComponent(e)}`, o = new AbortController(), r = setTimeout(() => o.abort(), 3e4);
|
|
546
546
|
try {
|
|
547
|
-
const
|
|
548
|
-
if (clearTimeout(r), !
|
|
549
|
-
throw new Error(`SASS key exchange failed (HTTP ${
|
|
550
|
-
const s = await
|
|
547
|
+
const i = await fetch(t, { signal: o.signal });
|
|
548
|
+
if (clearTimeout(r), !i.ok)
|
|
549
|
+
throw new Error(`SASS key exchange failed (HTTP ${i.status})`);
|
|
550
|
+
const s = await i.json();
|
|
551
551
|
if (s.status === "error")
|
|
552
552
|
throw new Error(`SASS key exchange failed: ${s.msg || "Unknown error"}`);
|
|
553
553
|
return s.key;
|
|
554
|
-
} catch (
|
|
555
|
-
throw clearTimeout(r),
|
|
554
|
+
} catch (i) {
|
|
555
|
+
throw clearTimeout(r), i instanceof DOMException && i.name === "AbortError" ? new Error("SASS key exchange timed out") : i;
|
|
556
556
|
}
|
|
557
557
|
}
|
|
558
558
|
function se(a, e) {
|
|
@@ -571,10 +571,10 @@ function se(a, e) {
|
|
|
571
571
|
}
|
|
572
572
|
return a.airboxPuid && (t["X-Filerobot-Airbox-Puid"] = a.airboxPuid), t;
|
|
573
573
|
}
|
|
574
|
-
async function
|
|
575
|
-
const e =
|
|
574
|
+
async function Xe(a) {
|
|
575
|
+
const e = fe(a.container);
|
|
576
576
|
if (a.mode === "security-template") {
|
|
577
|
-
const t = await
|
|
577
|
+
const t = await Ne(a.container, a.securityTemplateId);
|
|
578
578
|
return { apiBase: e, headers: se(a, t), sassKey: t };
|
|
579
579
|
}
|
|
580
580
|
return { apiBase: e, headers: se(a) };
|
|
@@ -598,32 +598,32 @@ const v = {
|
|
|
598
598
|
FILE_PREVIEW: "sfx-file-preview",
|
|
599
599
|
FILL_METADATA: "sfx-fill-metadata"
|
|
600
600
|
};
|
|
601
|
-
let
|
|
601
|
+
let We = 0;
|
|
602
602
|
function q() {
|
|
603
|
-
return `file-${Date.now()}-${++
|
|
603
|
+
return `file-${Date.now()}-${++We}`;
|
|
604
604
|
}
|
|
605
605
|
function Y(a) {
|
|
606
606
|
if (a <= 0) return "0 B";
|
|
607
|
-
const e = ["B", "KB", "MB", "GB"], t = Math.min(Math.floor(Math.log(a) / Math.log(1024)), e.length - 1),
|
|
608
|
-
return `${t === 0 ?
|
|
607
|
+
const e = ["B", "KB", "MB", "GB"], t = Math.min(Math.floor(Math.log(a) / Math.log(1024)), e.length - 1), o = a / Math.pow(1024, t);
|
|
608
|
+
return `${t === 0 ? o : o.toFixed(1)} ${e[t]}`;
|
|
609
609
|
}
|
|
610
|
-
function
|
|
610
|
+
function ie(a) {
|
|
611
611
|
if (!isFinite(a) || a <= 0) return "0s";
|
|
612
612
|
const e = Math.round(a);
|
|
613
613
|
if (e < 60) return `${e}s`;
|
|
614
|
-
const t = Math.floor(e / 60),
|
|
615
|
-
return
|
|
614
|
+
const t = Math.floor(e / 60), o = e % 60;
|
|
615
|
+
return o > 0 ? `${t}m ${o}s` : `${t}m`;
|
|
616
616
|
}
|
|
617
617
|
function X(a) {
|
|
618
618
|
var t;
|
|
619
619
|
const e = ((t = a.name.split(".").pop()) == null ? void 0 : t.toLowerCase()) ?? "";
|
|
620
620
|
return a.type.startsWith("image/") ? "image" : a.type.startsWith("video/") || ["mp4", "mov", "avi", "webm", "mkv"].includes(e) ? "vid" : a.type === "application/pdf" || e === "pdf" ? "pdf" : ["doc", "docx", "xls", "xlsx", "ppt", "pptx", "txt", "rtf", "odt"].includes(e) ? "doc" : ["zip", "rar", "7z", "tar", "gz", "bz2"].includes(e) ? "zip" : "gen";
|
|
621
621
|
}
|
|
622
|
-
function
|
|
622
|
+
function Ke(a) {
|
|
623
623
|
const e = a.lastIndexOf(".");
|
|
624
624
|
return e >= 0 ? a.slice(e + 1).toUpperCase() : "";
|
|
625
625
|
}
|
|
626
|
-
const
|
|
626
|
+
const Ge = {
|
|
627
627
|
jpg: "image/jpeg",
|
|
628
628
|
jpeg: "image/jpeg",
|
|
629
629
|
png: "image/png",
|
|
@@ -641,19 +641,19 @@ const We = {
|
|
|
641
641
|
doc: "application/msword",
|
|
642
642
|
docx: "application/vnd.openxmlformats-officedocument.wordprocessingml.document"
|
|
643
643
|
};
|
|
644
|
-
function
|
|
644
|
+
function Ze(a) {
|
|
645
645
|
var t;
|
|
646
646
|
const e = ((t = a.split(".").pop()) == null ? void 0 : t.toLowerCase()) ?? "";
|
|
647
|
-
return
|
|
647
|
+
return Ge[e] || "";
|
|
648
648
|
}
|
|
649
|
-
function
|
|
649
|
+
function Je(a) {
|
|
650
650
|
return new Promise((e) => {
|
|
651
651
|
const t = document.createElement("video");
|
|
652
652
|
t.preload = "metadata", t.muted = !0, t.playsInline = !0;
|
|
653
|
-
const
|
|
653
|
+
const o = URL.createObjectURL(a);
|
|
654
654
|
let r = !1;
|
|
655
|
-
const
|
|
656
|
-
r || (r = !0, e(null)), t.removeAttribute("src"), t.load(), URL.revokeObjectURL(
|
|
655
|
+
const i = () => {
|
|
656
|
+
r || (r = !0, e(null)), t.removeAttribute("src"), t.load(), URL.revokeObjectURL(o);
|
|
657
657
|
};
|
|
658
658
|
t.addEventListener("seeked", () => {
|
|
659
659
|
try {
|
|
@@ -662,53 +662,53 @@ function Ge(a) {
|
|
|
662
662
|
const n = s.getContext("2d");
|
|
663
663
|
if (n) {
|
|
664
664
|
n.drawImage(t, 0, 0, s.width, s.height), s.toBlob((d) => {
|
|
665
|
-
r || (r = !0, e(d ? URL.createObjectURL(d) : null), t.removeAttribute("src"), t.load(), URL.revokeObjectURL(
|
|
665
|
+
r || (r = !0, e(d ? URL.createObjectURL(d) : null), t.removeAttribute("src"), t.load(), URL.revokeObjectURL(o));
|
|
666
666
|
}, "image/jpeg", 0.7);
|
|
667
667
|
return;
|
|
668
668
|
}
|
|
669
669
|
} catch {
|
|
670
670
|
}
|
|
671
|
-
|
|
672
|
-
}, { once: !0 }), t.addEventListener("error", () =>
|
|
671
|
+
i();
|
|
672
|
+
}, { once: !0 }), t.addEventListener("error", () => i(), { once: !0 }), setTimeout(() => i(), 5e3), t.src = o, t.addEventListener("loadeddata", () => {
|
|
673
673
|
t.currentTime = 0.1;
|
|
674
674
|
}, { once: !0 });
|
|
675
675
|
});
|
|
676
676
|
}
|
|
677
677
|
function ae(a, e, t) {
|
|
678
|
-
var
|
|
678
|
+
var o, r;
|
|
679
679
|
if (e.maxFileSize != null && a.size > 0 && a.size > e.maxFileSize)
|
|
680
680
|
return `File exceeds ${(e.maxFileSize / 1048576).toFixed(1)} MB limit`;
|
|
681
681
|
if (e.maxTotalFilesSize != null && a.size > 0) {
|
|
682
|
-
let
|
|
682
|
+
let i = a.size;
|
|
683
683
|
for (const s of t.values())
|
|
684
|
-
s.status !== "rejected" && s.status !== "cancelled" && (
|
|
685
|
-
if (
|
|
684
|
+
s.status !== "rejected" && s.status !== "cancelled" && (i += s.size);
|
|
685
|
+
if (i > e.maxTotalFilesSize)
|
|
686
686
|
return "Total file size limit exceeded";
|
|
687
687
|
}
|
|
688
688
|
if (e.maxNumberOfFiles != null) {
|
|
689
|
-
let
|
|
689
|
+
let i = 0;
|
|
690
690
|
for (const s of t.values())
|
|
691
|
-
s.status !== "rejected" && s.status !== "cancelled" &&
|
|
692
|
-
if (
|
|
691
|
+
s.status !== "rejected" && s.status !== "cancelled" && i++;
|
|
692
|
+
if (i >= e.maxNumberOfFiles)
|
|
693
693
|
return `Maximum ${e.maxNumberOfFiles} files allowed`;
|
|
694
694
|
}
|
|
695
695
|
if (e.allowedFileTypes != null) {
|
|
696
|
-
const
|
|
697
|
-
if (!
|
|
696
|
+
const i = e.allowedFileTypes, s = "." + (((o = a.name.split(".").pop()) == null ? void 0 : o.toLowerCase()) ?? "");
|
|
697
|
+
if (!i.some((d) => d.startsWith(".") ? s === d.toLowerCase() : d.endsWith("/*") ? a.type.startsWith(d.slice(0, -1)) : a.type === d)) return "File type not allowed";
|
|
698
698
|
}
|
|
699
699
|
if (e.blockedFileTypes != null) {
|
|
700
|
-
const
|
|
701
|
-
if (
|
|
700
|
+
const i = e.blockedFileTypes, s = "." + (((r = a.name.split(".").pop()) == null ? void 0 : r.toLowerCase()) ?? "");
|
|
701
|
+
if (i.some((d) => d.startsWith(".") ? s === d.toLowerCase() : d.endsWith("/*") ? a.type.startsWith(d.slice(0, -1)) : a.type === d)) return "File type is blocked";
|
|
702
702
|
}
|
|
703
703
|
return null;
|
|
704
704
|
}
|
|
705
|
-
function
|
|
705
|
+
function Qe(a, e, t) {
|
|
706
706
|
return ae(a, e, t);
|
|
707
707
|
}
|
|
708
|
-
function
|
|
708
|
+
function ze(a) {
|
|
709
709
|
return a.allowedFileTypes ? a.allowedFileTypes.join(",") : "";
|
|
710
710
|
}
|
|
711
|
-
const
|
|
711
|
+
const Pe = {
|
|
712
712
|
"google-drive": {
|
|
713
713
|
id: "google-drive",
|
|
714
714
|
label: "Google Drive",
|
|
@@ -759,20 +759,20 @@ const Ee = {
|
|
|
759
759
|
brandHtml: '<span class="brand-ico" style="background:#111"><svg width="12" height="12" viewBox="0 0 24 24" fill="white"><path d="M8.5 11.5v5h7v-5h5.5V21h-18v-9.5h5.5zm7-8v5h-7v-5h7z"/></svg></span>'
|
|
760
760
|
}
|
|
761
761
|
};
|
|
762
|
-
function
|
|
763
|
-
return a.filter((e) => e in
|
|
762
|
+
function et(a) {
|
|
763
|
+
return a.filter((e) => e in Pe).map((e) => Pe[e]);
|
|
764
764
|
}
|
|
765
|
-
var
|
|
766
|
-
for (var r = void 0,
|
|
767
|
-
(s = a[
|
|
768
|
-
return r &&
|
|
765
|
+
var tt = Object.defineProperty, rt = (a, e, t, o) => {
|
|
766
|
+
for (var r = void 0, i = a.length - 1, s; i >= 0; i--)
|
|
767
|
+
(s = a[i]) && (r = s(e, t, r) || r);
|
|
768
|
+
return r && tt(e, t, r), r;
|
|
769
769
|
};
|
|
770
|
-
const
|
|
771
|
-
{ id: "device", label: "My Device", icon:
|
|
772
|
-
{ id: "url", label: "URL link", icon:
|
|
773
|
-
{ id: "camera", label: "Camera", icon:
|
|
774
|
-
{ id: "screen-cast", label: "Screen capture", icon:
|
|
775
|
-
],
|
|
770
|
+
const ot = '<rect x="2" y="3" width="20" height="14" rx="2"/><line x1="8" y1="21" x2="16" y2="21"/><line x1="12" y1="17" x2="12" y2="21"/>', it = '<path d="M10 13a5 5 0 007.54.54l3-3a5 5 0 00-7.07-7.07l-1.72 1.71"/><path d="M14 11a5 5 0 00-7.54-.54l-3 3a5 5 0 007.07 7.07l1.71-1.71"/>', st = '<path d="M23 19a2 2 0 01-2 2H3a2 2 0 01-2-2V8a2 2 0 012-2h4l2-3h6l2 3h4a2 2 0 012 2z"/><circle cx="12" cy="13" r="4"/>', at = '<rect x="2" y="3" width="20" height="14" rx="2"/><circle cx="12" cy="10" r="1"/><path d="M7 21l5-5 5 5"/>', W = [
|
|
771
|
+
{ id: "device", label: "My Device", icon: ot, iconColor: "#2563eb" },
|
|
772
|
+
{ id: "url", label: "URL link", icon: it, iconColor: "#16a34a" },
|
|
773
|
+
{ id: "camera", label: "Camera", icon: st, iconColor: "#7c3aed" },
|
|
774
|
+
{ id: "screen-cast", label: "Screen capture", icon: at, iconColor: "#ea580c" }
|
|
775
|
+
], xe = class xe extends U {
|
|
776
776
|
constructor() {
|
|
777
777
|
super(...arguments), this.sources = W;
|
|
778
778
|
}
|
|
@@ -790,7 +790,7 @@ const tt = '<rect x="2" y="3" width="20" height="14" rx="2"/><line x1="8" y1="21
|
|
|
790
790
|
${this.sources.map(
|
|
791
791
|
(e) => l`
|
|
792
792
|
<button @click=${() => this._handleClick(e)}>
|
|
793
|
-
${e.brandHtml ? M(e.brandHtml) :
|
|
793
|
+
${e.brandHtml ? M(e.brandHtml) : O`<svg viewBox="0 0 24 24" class=${e.fillIcon ? "fill-icon" : ""}>${F(e.icon)}</svg>`}
|
|
794
794
|
${e.label}
|
|
795
795
|
</button>
|
|
796
796
|
`
|
|
@@ -798,7 +798,7 @@ const tt = '<rect x="2" y="3" width="20" height="14" rx="2"/><line x1="8" y1="21
|
|
|
798
798
|
`;
|
|
799
799
|
}
|
|
800
800
|
};
|
|
801
|
-
|
|
801
|
+
xe.styles = S`
|
|
802
802
|
:host {
|
|
803
803
|
display: flex;
|
|
804
804
|
flex-wrap: wrap;
|
|
@@ -871,61 +871,84 @@ he.styles = S`
|
|
|
871
871
|
stroke-width: 0;
|
|
872
872
|
}
|
|
873
873
|
`;
|
|
874
|
-
let ne =
|
|
875
|
-
|
|
874
|
+
let ne = xe;
|
|
875
|
+
rt([
|
|
876
876
|
b({ type: Array })
|
|
877
877
|
], ne.prototype, "sources");
|
|
878
|
-
function
|
|
878
|
+
function Oe(a) {
|
|
879
879
|
let e = a;
|
|
880
880
|
for (; e; ) {
|
|
881
|
+
if (e instanceof ShadowRoot) {
|
|
882
|
+
e = e.host;
|
|
883
|
+
continue;
|
|
884
|
+
}
|
|
881
885
|
if (e instanceof HTMLDialogElement && e.open)
|
|
882
886
|
return e;
|
|
883
|
-
e instanceof
|
|
887
|
+
if (e instanceof Element && e.shadowRoot) {
|
|
888
|
+
const t = e.shadowRoot.querySelector("dialog[open]");
|
|
889
|
+
if (t instanceof HTMLDialogElement)
|
|
890
|
+
return t;
|
|
891
|
+
}
|
|
892
|
+
e = e.parentNode;
|
|
884
893
|
}
|
|
885
894
|
return document.body;
|
|
886
895
|
}
|
|
887
|
-
var
|
|
888
|
-
for (var r = void 0,
|
|
889
|
-
(s = a[
|
|
890
|
-
return r &&
|
|
896
|
+
var nt = Object.defineProperty, R = (a, e, t, o) => {
|
|
897
|
+
for (var r = void 0, i = a.length - 1, s; i >= 0; i--)
|
|
898
|
+
(s = a[i]) && (r = s(e, t, r) || r);
|
|
899
|
+
return r && nt(e, t, r), r;
|
|
891
900
|
};
|
|
892
|
-
const
|
|
901
|
+
const Ue = 3, le = new CSSStyleSheet();
|
|
902
|
+
le.replaceSync(`
|
|
903
|
+
[data-sfx-more-dropdown] { position:absolute; top:0; left:0; width:0; height:0; overflow:visible; pointer-events:none; }
|
|
904
|
+
[data-sfx-more-dropdown] .sfx-more-dropdown { position:fixed; background:#fff; border-radius:12px; box-shadow:0 12px 40px rgba(0,0,0,0.14),0 2px 8px rgba(0,0,0,0.06); border:1px solid #e8edf5; padding:6px; min-width:210px; max-height:340px; overflow-y:auto; z-index:99999; opacity:0; visibility:hidden; pointer-events:none; transition:opacity .18s ease,visibility .18s ease,transform .18s ease; font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif; }
|
|
905
|
+
[data-sfx-more-dropdown] .sfx-more-dropdown.open { opacity:1; visibility:visible; pointer-events:all; }
|
|
906
|
+
[data-sfx-more-dropdown] .sfx-more-item { display:flex; align-items:center; gap:10px; padding:10px 14px; border-radius:6px; border:none; background:none; width:100%; font-size:13px; font-weight:500; color:#1e293b; cursor:pointer; transition:background .15s; font-family:inherit; white-space:nowrap; }
|
|
907
|
+
[data-sfx-more-dropdown] .sfx-more-item:hover { background:#f5f7fa; }
|
|
908
|
+
[data-sfx-more-dropdown] .sfx-more-item-ico { width:32px; height:32px; border-radius:8px; background:#f8fafc; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
|
|
909
|
+
[data-sfx-more-dropdown] .sfx-more-item-ico svg { width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; }
|
|
910
|
+
[data-sfx-more-dropdown] .sfx-more-item .brand-ico { width:20px; height:20px; border-radius:5px; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
|
|
911
|
+
[data-sfx-more-dropdown] .sfx-more-item .brand-ico svg { fill:white; stroke:none; stroke-width:0; }
|
|
912
|
+
[data-sfx-more-dropdown] .sfx-more-item .canva-ico { width:22px; height:22px; }
|
|
913
|
+
[data-sfx-more-dropdown] .sfx-more-item .canva-ico svg { width:22px; height:22px; }
|
|
914
|
+
`);
|
|
915
|
+
const ge = class ge extends U {
|
|
893
916
|
constructor() {
|
|
894
|
-
super(...arguments), this.compact = !1, this.externalDragOver = !1, this.accept = "", this.sources = [], this.sourcesLayout = "pills", this._dragOver = !1, this._moreOpen = !1, this._visiblePills =
|
|
917
|
+
super(...arguments), this.compact = !1, this.externalDragOver = !1, this.accept = "", this.sources = [], this.sourcesLayout = "pills", this._dragOver = !1, this._moreOpen = !1, this._visiblePills = Ue, this._dragCounter = 0, this._onDragEnter = (e) => {
|
|
895
918
|
e.preventDefault(), this._dragCounter++, this._dragCounter === 1 && (this._dragOver = !0);
|
|
896
919
|
}, this._onDragOver = (e) => {
|
|
897
920
|
e.preventDefault();
|
|
898
921
|
}, this._onDragLeave = (e) => {
|
|
899
922
|
e.preventDefault(), this._dragCounter--, this._dragCounter <= 0 && (this._dragCounter = 0, this._dragOver = !1);
|
|
900
923
|
}, this._onDrop = (e) => {
|
|
901
|
-
var
|
|
924
|
+
var o;
|
|
902
925
|
e.preventDefault(), e.stopPropagation(), this._dragCounter = 0, this._dragOver = !1;
|
|
903
|
-
const t = Array.from(((
|
|
926
|
+
const t = Array.from(((o = e.dataTransfer) == null ? void 0 : o.files) ?? []);
|
|
904
927
|
t.length > 0 && this._emitFiles(t);
|
|
905
928
|
}, this._onClick = (e) => {
|
|
906
929
|
const t = this.shadowRoot.querySelector(".drop-zone");
|
|
907
930
|
if (t && this._rippleEl) {
|
|
908
|
-
const
|
|
909
|
-
this._rippleEl.style.left = `${e.clientX -
|
|
931
|
+
const o = t.getBoundingClientRect();
|
|
932
|
+
this._rippleEl.style.left = `${e.clientX - o.left}px`, this._rippleEl.style.top = `${e.clientY - o.top}px`, this._rippleEl.classList.remove("go"), this._rippleEl.offsetWidth, this._rippleEl.classList.add("go");
|
|
910
933
|
}
|
|
911
934
|
this.browse();
|
|
912
935
|
}, this._onKeyDown = (e) => {
|
|
913
936
|
(e.key === "Enter" || e.key === " ") && (e.preventDefault(), this.browse());
|
|
914
937
|
}, this._onFileChange = (e) => {
|
|
915
|
-
const t = e.target,
|
|
916
|
-
|
|
938
|
+
const t = e.target, o = Array.from(t.files ?? []);
|
|
939
|
+
o.length > 0 && this._emitFiles(o), t.value = "";
|
|
917
940
|
}, this._onPaste = (e) => {
|
|
918
941
|
var r;
|
|
919
942
|
if (!this.isConnected || this.offsetWidth === 0) return;
|
|
920
943
|
const t = (r = e.clipboardData) == null ? void 0 : r.items;
|
|
921
944
|
if (!t) return;
|
|
922
|
-
const
|
|
923
|
-
for (const
|
|
924
|
-
if (
|
|
925
|
-
const s =
|
|
926
|
-
s &&
|
|
945
|
+
const o = [];
|
|
946
|
+
for (const i of t)
|
|
947
|
+
if (i.kind === "file") {
|
|
948
|
+
const s = i.getAsFile();
|
|
949
|
+
s && o.push(s);
|
|
927
950
|
}
|
|
928
|
-
|
|
951
|
+
o.length > 0 && (e.preventDefault(), this._emitFiles(o));
|
|
929
952
|
}, this._portalContainer = null, this._onDocClick = (e) => {
|
|
930
953
|
var t;
|
|
931
954
|
this._moreOpen && ((t = this._portalContainer) != null && t.contains(e.target) || (this._moreOpen = !1, this._updateDropdownPortal()));
|
|
@@ -964,13 +987,13 @@ const ze = 3, ue = class ue extends U {
|
|
|
964
987
|
_updateDropdownPortal() {
|
|
965
988
|
if (this._moreOpen) {
|
|
966
989
|
const e = this.sources.slice(this._visiblePills);
|
|
967
|
-
this._portalContainer || (this._portalContainer = document.createElement("div"), this._portalContainer.setAttribute("data-sfx-more-dropdown", ""),
|
|
990
|
+
this._portalContainer || (this._portalContainer = document.createElement("div"), this._portalContainer.setAttribute("data-sfx-more-dropdown", ""), Oe(this).appendChild(this._portalContainer), this._injectDropdownStyles()), T(
|
|
968
991
|
l`<div class="sfx-more-dropdown open">
|
|
969
992
|
${e.map(
|
|
970
993
|
(t) => l`
|
|
971
|
-
<button class="sfx-more-item" @click=${(
|
|
994
|
+
<button class="sfx-more-item" @click=${(o) => this._onMoreItemClick(t, o)}>
|
|
972
995
|
<div class="sfx-more-item-ico">
|
|
973
|
-
${t.brandHtml ? M(t.brandHtml) : t.iconColor ? l`<svg viewBox="0 0 24 24" style="color:${t.iconColor}">${
|
|
996
|
+
${t.brandHtml ? M(t.brandHtml) : t.iconColor ? l`<svg viewBox="0 0 24 24" style="color:${t.iconColor}">${F(t.icon)}</svg>` : O`<svg viewBox="0 0 24 24">${F(t.icon)}</svg>`}
|
|
974
997
|
</div>
|
|
975
998
|
${t.label}
|
|
976
999
|
</button>
|
|
@@ -982,29 +1005,18 @@ const ze = 3, ue = class ue extends U {
|
|
|
982
1005
|
} else this._portalContainer && (T(c, this._portalContainer), this._portalContainer.remove(), this._portalContainer = null);
|
|
983
1006
|
}
|
|
984
1007
|
_injectDropdownStyles() {
|
|
985
|
-
|
|
986
|
-
const e =
|
|
987
|
-
e.
|
|
988
|
-
[data-sfx-more-dropdown] .sfx-more-dropdown { position:fixed; background:#fff; border-radius:12px; box-shadow:0 12px 40px rgba(0,0,0,0.14),0 2px 8px rgba(0,0,0,0.06); border:1px solid #e8edf5; padding:6px; min-width:210px; max-height:340px; overflow-y:auto; z-index:99999; opacity:0; visibility:hidden; pointer-events:none; transition:opacity .18s ease,visibility .18s ease,transform .18s ease; font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif; }
|
|
989
|
-
[data-sfx-more-dropdown] .sfx-more-dropdown.open { opacity:1; visibility:visible; pointer-events:all; }
|
|
990
|
-
[data-sfx-more-dropdown] .sfx-more-item { display:flex; align-items:center; gap:10px; padding:10px 14px; border-radius:6px; border:none; background:none; width:100%; font-size:13px; font-weight:500; color:#1e293b; cursor:pointer; transition:background .15s; font-family:inherit; white-space:nowrap; }
|
|
991
|
-
[data-sfx-more-dropdown] .sfx-more-item:hover { background:#f5f7fa; }
|
|
992
|
-
[data-sfx-more-dropdown] .sfx-more-item-ico { width:32px; height:32px; border-radius:8px; background:#f8fafc; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
|
|
993
|
-
[data-sfx-more-dropdown] .sfx-more-item-ico svg { width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; }
|
|
994
|
-
[data-sfx-more-dropdown] .sfx-more-item .brand-ico { width:20px; height:20px; border-radius:5px; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
|
|
995
|
-
[data-sfx-more-dropdown] .sfx-more-item .brand-ico svg { fill:white; stroke:none; stroke-width:0; }
|
|
996
|
-
[data-sfx-more-dropdown] .sfx-more-item .canva-ico { width:22px; height:22px; }
|
|
997
|
-
[data-sfx-more-dropdown] .sfx-more-item .canva-ico svg { width:22px; height:22px; }
|
|
998
|
-
`, document.head.appendChild(e);
|
|
1008
|
+
var t;
|
|
1009
|
+
const e = (t = this._portalContainer) == null ? void 0 : t.getRootNode();
|
|
1010
|
+
e && (e.adoptedStyleSheets.includes(le) || (e.adoptedStyleSheets = [...e.adoptedStyleSheets, le]));
|
|
999
1011
|
}
|
|
1000
1012
|
/** Position the fixed dropdown, choosing above or below based on available space. */
|
|
1001
1013
|
_positionDropdown() {
|
|
1002
1014
|
var u, x;
|
|
1003
1015
|
const e = (u = this.shadowRoot) == null ? void 0 : u.querySelector(".more-wrap > button"), t = (x = this._portalContainer) == null ? void 0 : x.querySelector(".sfx-more-dropdown");
|
|
1004
1016
|
if (!e || !t) return;
|
|
1005
|
-
const
|
|
1006
|
-
n >=
|
|
1007
|
-
let h =
|
|
1017
|
+
const o = e.getBoundingClientRect(), r = 8, i = t.scrollHeight, s = t.offsetWidth, n = o.top, d = window.innerHeight - o.bottom;
|
|
1018
|
+
n >= i + r || n > d ? t.style.top = `${o.top - i - r}px` : t.style.top = `${o.bottom + r}px`;
|
|
1019
|
+
let h = o.right - s;
|
|
1008
1020
|
h = Math.max(8, Math.min(h, window.innerWidth - s - 8)), t.style.left = `${h}px`;
|
|
1009
1021
|
}
|
|
1010
1022
|
_onMoreItemClick(e, t) {
|
|
@@ -1012,7 +1024,7 @@ const ze = 3, ue = class ue extends U {
|
|
|
1012
1024
|
}
|
|
1013
1025
|
_updateVisiblePills() {
|
|
1014
1026
|
const e = window.innerWidth;
|
|
1015
|
-
this.sourcesLayout === "cards" ? e <= 480 ? this._visiblePills = 2 : e <= 768 ? this._visiblePills = 3 : this._visiblePills = 5 : e <= 480 ? this._visiblePills = 1 : e <= 768 ? this._visiblePills = 2 : this._visiblePills =
|
|
1027
|
+
this.sourcesLayout === "cards" ? e <= 480 ? this._visiblePills = 2 : e <= 768 ? this._visiblePills = 3 : this._visiblePills = 5 : e <= 480 ? this._visiblePills = 1 : e <= 768 ? this._visiblePills = 2 : this._visiblePills = Ue;
|
|
1016
1028
|
}
|
|
1017
1029
|
connectedCallback() {
|
|
1018
1030
|
super.connectedCallback(), document.addEventListener("paste", this._onPaste), document.addEventListener("click", this._onDocClick), document.addEventListener("keydown", this._onDocKeyDown), window.addEventListener("scroll", this._onScrollOrResize, !0), window.addEventListener("resize", this._onScrollOrResize), this._updateVisiblePills();
|
|
@@ -1032,7 +1044,7 @@ const ze = 3, ue = class ue extends U {
|
|
|
1032
1044
|
}}
|
|
1033
1045
|
>
|
|
1034
1046
|
${e.brandHtml ? M(e.brandHtml) : l`<span class="pill-ico" style=${e.iconColor ? `color:${e.iconColor}` : ""}>
|
|
1035
|
-
${
|
|
1047
|
+
${O`<svg viewBox="0 0 24 24" class=${e.fillIcon ? "fill-icon" : ""}>${F(e.icon)}</svg>`}
|
|
1036
1048
|
</span>`}
|
|
1037
1049
|
${e.label}
|
|
1038
1050
|
</button>
|
|
@@ -1048,7 +1060,7 @@ const ze = 3, ue = class ue extends U {
|
|
|
1048
1060
|
}}
|
|
1049
1061
|
>
|
|
1050
1062
|
${e.brandHtml ? l`<span class="card-ico">${M(e.brandHtml)}</span>` : l`<span class="card-ico" style=${e.iconColor ? `color:${e.iconColor}` : ""}>
|
|
1051
|
-
${
|
|
1063
|
+
${O`<svg viewBox="0 0 24 24" class=${e.fillIcon ? "fill-icon" : ""}>${F(e.icon)}</svg>`}
|
|
1052
1064
|
</span>`}
|
|
1053
1065
|
<span class="card-label">${e.label}</span>
|
|
1054
1066
|
</button>
|
|
@@ -1085,7 +1097,7 @@ const ze = 3, ue = class ue extends U {
|
|
|
1085
1097
|
"drop-zone",
|
|
1086
1098
|
this._dragOver || this.externalDragOver ? "drag-over" : "",
|
|
1087
1099
|
this.compact ? "compact" : ""
|
|
1088
|
-
].filter(Boolean).join(" "), t = this.sources.slice(0, this._visiblePills),
|
|
1100
|
+
].filter(Boolean).join(" "), t = this.sources.slice(0, this._visiblePills), o = this.sources.slice(this._visiblePills);
|
|
1089
1101
|
return l`
|
|
1090
1102
|
<div
|
|
1091
1103
|
class=${e}
|
|
@@ -1122,12 +1134,12 @@ const ze = 3, ue = class ue extends U {
|
|
|
1122
1134
|
${this.sourcesLayout === "cards" ? l`
|
|
1123
1135
|
<div class="sources-cards">
|
|
1124
1136
|
${t.map((r) => this._renderCard(r))}
|
|
1125
|
-
${
|
|
1137
|
+
${o.length > 0 ? this._renderMoreCard() : c}
|
|
1126
1138
|
</div>
|
|
1127
1139
|
` : l`
|
|
1128
1140
|
<div class="sources-grid">
|
|
1129
1141
|
${t.map((r) => this._renderPill(r))}
|
|
1130
|
-
${
|
|
1142
|
+
${o.length > 0 ? this._renderMoreDropdown() : c}
|
|
1131
1143
|
</div>
|
|
1132
1144
|
`}
|
|
1133
1145
|
` : c}
|
|
@@ -1141,11 +1153,11 @@ const ze = 3, ue = class ue extends U {
|
|
|
1141
1153
|
style=${r.iconColor && !r.brandHtml ? `color:${r.iconColor}` : ""}
|
|
1142
1154
|
data-tip=${r.label}
|
|
1143
1155
|
aria-label=${r.label}
|
|
1144
|
-
@click=${(
|
|
1145
|
-
|
|
1156
|
+
@click=${(i) => {
|
|
1157
|
+
i.stopPropagation(), this._onSourceIconClick(r);
|
|
1146
1158
|
}}
|
|
1147
1159
|
>
|
|
1148
|
-
${r.brandHtml ? M(r.brandHtml) :
|
|
1160
|
+
${r.brandHtml ? M(r.brandHtml) : O`<svg viewBox="0 0 24 24" class=${r.fillIcon ? "fill-icon" : ""}>${F(r.icon)}</svg>`}
|
|
1149
1161
|
</button>
|
|
1150
1162
|
`
|
|
1151
1163
|
)}
|
|
@@ -1163,7 +1175,7 @@ const ze = 3, ue = class ue extends U {
|
|
|
1163
1175
|
`;
|
|
1164
1176
|
}
|
|
1165
1177
|
};
|
|
1166
|
-
|
|
1178
|
+
ge.styles = S`
|
|
1167
1179
|
:host {
|
|
1168
1180
|
display: flex;
|
|
1169
1181
|
flex-shrink: 0;
|
|
@@ -1946,38 +1958,38 @@ ue.styles = S`
|
|
|
1946
1958
|
}
|
|
1947
1959
|
}
|
|
1948
1960
|
`;
|
|
1949
|
-
let z =
|
|
1950
|
-
|
|
1961
|
+
let z = ge;
|
|
1962
|
+
R([
|
|
1951
1963
|
b({ type: Boolean, reflect: !0 })
|
|
1952
1964
|
], z.prototype, "compact");
|
|
1953
|
-
|
|
1965
|
+
R([
|
|
1954
1966
|
b({ type: Boolean, attribute: "external-drag-over" })
|
|
1955
1967
|
], z.prototype, "externalDragOver");
|
|
1956
|
-
|
|
1968
|
+
R([
|
|
1957
1969
|
b({ type: String })
|
|
1958
1970
|
], z.prototype, "accept");
|
|
1959
|
-
|
|
1971
|
+
R([
|
|
1960
1972
|
b({ type: Array })
|
|
1961
1973
|
], z.prototype, "sources");
|
|
1962
|
-
|
|
1974
|
+
R([
|
|
1963
1975
|
b({ type: String, attribute: "sources-layout" })
|
|
1964
1976
|
], z.prototype, "sourcesLayout");
|
|
1965
|
-
|
|
1977
|
+
R([
|
|
1966
1978
|
g()
|
|
1967
1979
|
], z.prototype, "_dragOver");
|
|
1968
|
-
|
|
1980
|
+
R([
|
|
1969
1981
|
g()
|
|
1970
1982
|
], z.prototype, "_moreOpen");
|
|
1971
|
-
|
|
1983
|
+
R([
|
|
1972
1984
|
g()
|
|
1973
1985
|
], z.prototype, "_visiblePills");
|
|
1974
|
-
|
|
1975
|
-
|
|
1986
|
+
R([
|
|
1987
|
+
Fe(".ripple")
|
|
1976
1988
|
], z.prototype, "_rippleEl");
|
|
1977
|
-
|
|
1978
|
-
|
|
1989
|
+
R([
|
|
1990
|
+
Fe('input[type="file"]')
|
|
1979
1991
|
], z.prototype, "fileInput");
|
|
1980
|
-
const
|
|
1992
|
+
const ve = class ve extends U {
|
|
1981
1993
|
render() {
|
|
1982
1994
|
return l`
|
|
1983
1995
|
<div class="line"></div>
|
|
@@ -1986,7 +1998,7 @@ const xe = class xe extends U {
|
|
|
1986
1998
|
`;
|
|
1987
1999
|
}
|
|
1988
2000
|
};
|
|
1989
|
-
|
|
2001
|
+
ve.styles = S`
|
|
1990
2002
|
:host {
|
|
1991
2003
|
display: flex;
|
|
1992
2004
|
align-items: center;
|
|
@@ -2009,19 +2021,34 @@ xe.styles = S`
|
|
|
2009
2021
|
white-space: nowrap;
|
|
2010
2022
|
}
|
|
2011
2023
|
`;
|
|
2012
|
-
let
|
|
2013
|
-
var
|
|
2014
|
-
for (var r = void 0,
|
|
2015
|
-
(s = a[
|
|
2016
|
-
return r &&
|
|
2024
|
+
let De = ve;
|
|
2025
|
+
var lt = Object.defineProperty, Z = (a, e, t, o) => {
|
|
2026
|
+
for (var r = void 0, i = a.length - 1, s; i >= 0; i--)
|
|
2027
|
+
(s = a[i]) && (r = s(e, t, r) || r);
|
|
2028
|
+
return r && lt(e, t, r), r;
|
|
2017
2029
|
};
|
|
2018
|
-
const
|
|
2030
|
+
const de = new CSSStyleSheet();
|
|
2031
|
+
de.replaceSync(`
|
|
2032
|
+
[data-sfx-tile-dropdown] { position:absolute; top:0; left:0; width:0; height:0; overflow:visible; pointer-events:none; }
|
|
2033
|
+
[data-sfx-tile-dropdown] .sfx-tile-dropdown { position:fixed; background:#fff; border:1px solid #e2e8f0; border-radius:10px; box-shadow:0 4px 20px rgba(0,0,0,0.12); padding:6px; z-index:99999; min-width:180px; font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif; animation:sfxTileDropIn .15s ease; }
|
|
2034
|
+
[data-sfx-tile-dropdown] .sfx-tile-dropdown-item { display:flex; align-items:center; gap:10px; width:100%; padding:8px 12px; border:none; background:none; border-radius:6px; cursor:pointer; font-size:13px; font-weight:500; color:#1e293b; white-space:nowrap; transition:background .15s; font-family:inherit; }
|
|
2035
|
+
[data-sfx-tile-dropdown] .sfx-tile-dropdown-item:hover { background:#f5f7fa; }
|
|
2036
|
+
[data-sfx-tile-dropdown] .sfx-tile-dropdown-ico { width:32px; height:32px; border-radius:8px; background:#f8fafc; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
|
|
2037
|
+
[data-sfx-tile-dropdown] .sfx-tile-dropdown-ico svg { width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
|
|
2038
|
+
[data-sfx-tile-dropdown] .sfx-tile-dropdown-ico svg.fill-icon { fill:currentColor; stroke:none; }
|
|
2039
|
+
[data-sfx-tile-dropdown] .sfx-tile-dropdown-ico .brand-ico { width:20px; height:20px; border-radius:5px; display:flex; align-items:center; justify-content:center; }
|
|
2040
|
+
[data-sfx-tile-dropdown] .sfx-tile-dropdown-ico .brand-ico svg { fill:white; stroke:none; stroke-width:0; }
|
|
2041
|
+
[data-sfx-tile-dropdown] .sfx-tile-dropdown-ico .canva-ico { width:22px; height:22px; }
|
|
2042
|
+
[data-sfx-tile-dropdown] .sfx-tile-dropdown-ico .canva-ico svg { width:22px; height:22px; }
|
|
2043
|
+
@keyframes sfxTileDropIn { from{opacity:0;transform:translateY(-4px)} to{opacity:1;transform:translateY(0)} }
|
|
2044
|
+
`);
|
|
2045
|
+
const be = class be extends U {
|
|
2019
2046
|
constructor() {
|
|
2020
2047
|
super(...arguments), this.files = [], this.showDropTile = !1, this.sources = [], this.accept = "", this._moreOpen = !1, this._portalContainer = null, this._outsideClickHandler = (e) => {
|
|
2021
2048
|
var r;
|
|
2022
2049
|
if ((r = this._portalContainer) != null && r.contains(e.target)) return;
|
|
2023
|
-
const t = this.renderRoot.querySelector(".drop-tile-more-wrap"),
|
|
2024
|
-
t &&
|
|
2050
|
+
const t = this.renderRoot.querySelector(".drop-tile-more-wrap"), o = e.composedPath();
|
|
2051
|
+
t && o.includes(t) || (this._moreOpen = !1, this._closePortal(), document.removeEventListener("click", this._outsideClickHandler, !0));
|
|
2025
2052
|
}, this._onScrollOrResize = () => {
|
|
2026
2053
|
this._moreOpen && this._positionPortal();
|
|
2027
2054
|
}, this._onKeyDown = (e) => {
|
|
@@ -2033,13 +2060,13 @@ const ge = class ge extends U {
|
|
|
2033
2060
|
e == null || e.click();
|
|
2034
2061
|
}
|
|
2035
2062
|
_onFileInput(e) {
|
|
2036
|
-
const t = e.target,
|
|
2037
|
-
|
|
2063
|
+
const t = e.target, o = Array.from(t.files ?? []);
|
|
2064
|
+
o.length > 0 && this.dispatchEvent(new CustomEvent("files-selected", { detail: { files: o }, bubbles: !0, composed: !0 })), t.value = "";
|
|
2038
2065
|
}
|
|
2039
2066
|
_onSourceClick(e, t) {
|
|
2040
2067
|
if (e.stopPropagation(), t.id === "device") {
|
|
2041
|
-
const
|
|
2042
|
-
|
|
2068
|
+
const o = this.renderRoot.querySelector('input[type="file"]');
|
|
2069
|
+
o == null || o.click();
|
|
2043
2070
|
return;
|
|
2044
2071
|
}
|
|
2045
2072
|
this.dispatchEvent(new CustomEvent("source-click", { detail: { source: t }, bubbles: !0, composed: !0 }));
|
|
@@ -2055,15 +2082,15 @@ const ge = class ge extends U {
|
|
|
2055
2082
|
}
|
|
2056
2083
|
_openPortal() {
|
|
2057
2084
|
const e = this.sources.slice(3);
|
|
2058
|
-
this._portalContainer || (this._portalContainer = document.createElement("div"), this._portalContainer.setAttribute("data-sfx-tile-dropdown", ""),
|
|
2085
|
+
this._portalContainer || (this._portalContainer = document.createElement("div"), this._portalContainer.setAttribute("data-sfx-tile-dropdown", ""), Oe(this).appendChild(this._portalContainer), this._injectTileDropdownStyles()), T(
|
|
2059
2086
|
l`<div class="sfx-tile-dropdown">
|
|
2060
2087
|
${e.map((t) => l`
|
|
2061
2088
|
<button
|
|
2062
2089
|
class="sfx-tile-dropdown-item"
|
|
2063
|
-
@click=${(
|
|
2090
|
+
@click=${(o) => this._onMoreSourceClick(o, t)}
|
|
2064
2091
|
>
|
|
2065
2092
|
<span class="sfx-tile-dropdown-ico" style=${t.iconColor && !t.brandHtml ? `color:${t.iconColor}` : ""}>
|
|
2066
|
-
${t.brandHtml ? M(t.brandHtml) :
|
|
2093
|
+
${t.brandHtml ? M(t.brandHtml) : O`<svg viewBox="0 0 24 24" class=${t.fillIcon ? "fill-icon" : ""}>${F(t.icon)}</svg>`}
|
|
2067
2094
|
</span>
|
|
2068
2095
|
${t.label}
|
|
2069
2096
|
</button>
|
|
@@ -2076,30 +2103,18 @@ const ge = class ge extends U {
|
|
|
2076
2103
|
var u;
|
|
2077
2104
|
const e = this.renderRoot.querySelector(".drop-tile-more"), t = (u = this._portalContainer) == null ? void 0 : u.querySelector(".sfx-tile-dropdown");
|
|
2078
2105
|
if (!e || !t) return;
|
|
2079
|
-
const
|
|
2080
|
-
n >=
|
|
2081
|
-
let h =
|
|
2106
|
+
const o = e.getBoundingClientRect(), r = 6, i = t.scrollHeight, s = t.offsetWidth, n = o.top, d = window.innerHeight - o.bottom;
|
|
2107
|
+
n >= i + r || n > d ? t.style.top = `${o.top - i - r}px` : t.style.top = `${o.bottom + r}px`;
|
|
2108
|
+
let h = o.right - s;
|
|
2082
2109
|
h = Math.max(8, Math.min(h, window.innerWidth - s - 8)), t.style.left = `${h}px`;
|
|
2083
2110
|
}
|
|
2084
2111
|
_closePortal() {
|
|
2085
2112
|
this._portalContainer && (T(c, this._portalContainer), this._portalContainer.remove(), this._portalContainer = null);
|
|
2086
2113
|
}
|
|
2087
2114
|
_injectTileDropdownStyles() {
|
|
2088
|
-
|
|
2089
|
-
const e =
|
|
2090
|
-
e.
|
|
2091
|
-
[data-sfx-tile-dropdown] .sfx-tile-dropdown { position:fixed; background:#fff; border:1px solid #e2e8f0; border-radius:10px; box-shadow:0 4px 20px rgba(0,0,0,0.12); padding:6px; z-index:99999; min-width:180px; font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif; animation:sfxTileDropIn .15s ease; }
|
|
2092
|
-
[data-sfx-tile-dropdown] .sfx-tile-dropdown-item { display:flex; align-items:center; gap:10px; width:100%; padding:8px 12px; border:none; background:none; border-radius:6px; cursor:pointer; font-size:13px; font-weight:500; color:#1e293b; white-space:nowrap; transition:background .15s; font-family:inherit; }
|
|
2093
|
-
[data-sfx-tile-dropdown] .sfx-tile-dropdown-item:hover { background:#f5f7fa; }
|
|
2094
|
-
[data-sfx-tile-dropdown] .sfx-tile-dropdown-ico { width:32px; height:32px; border-radius:8px; background:#f8fafc; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
|
|
2095
|
-
[data-sfx-tile-dropdown] .sfx-tile-dropdown-ico svg { width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
|
|
2096
|
-
[data-sfx-tile-dropdown] .sfx-tile-dropdown-ico svg.fill-icon { fill:currentColor; stroke:none; }
|
|
2097
|
-
[data-sfx-tile-dropdown] .sfx-tile-dropdown-ico .brand-ico { width:20px; height:20px; border-radius:5px; display:flex; align-items:center; justify-content:center; }
|
|
2098
|
-
[data-sfx-tile-dropdown] .sfx-tile-dropdown-ico .brand-ico svg { fill:white; stroke:none; stroke-width:0; }
|
|
2099
|
-
[data-sfx-tile-dropdown] .sfx-tile-dropdown-ico .canva-ico { width:22px; height:22px; }
|
|
2100
|
-
[data-sfx-tile-dropdown] .sfx-tile-dropdown-ico .canva-ico svg { width:22px; height:22px; }
|
|
2101
|
-
@keyframes sfxTileDropIn { from{opacity:0;transform:translateY(-4px)} to{opacity:1;transform:translateY(0)} }
|
|
2102
|
-
`, document.head.appendChild(e);
|
|
2115
|
+
var t;
|
|
2116
|
+
const e = (t = this._portalContainer) == null ? void 0 : t.getRootNode();
|
|
2117
|
+
e && (e.adoptedStyleSheets.includes(de) || (e.adoptedStyleSheets = [...e.adoptedStyleSheets, de]));
|
|
2103
2118
|
}
|
|
2104
2119
|
disconnectedCallback() {
|
|
2105
2120
|
super.disconnectedCallback(), this._moreOpen = !1, this._closePortal(), this._removeGlobalListeners();
|
|
@@ -2108,7 +2123,7 @@ const ge = class ge extends U {
|
|
|
2108
2123
|
this._moreOpen = !1, this._closePortal(), this._removeGlobalListeners(), this._onSourceClick(e, t);
|
|
2109
2124
|
}
|
|
2110
2125
|
_renderDropTile() {
|
|
2111
|
-
const t = this.sources.slice(0, 3),
|
|
2126
|
+
const t = this.sources.slice(0, 3), o = this.sources.slice(3);
|
|
2112
2127
|
return l`
|
|
2113
2128
|
<div class="drop-tile" @click=${this._onDropTileClick}>
|
|
2114
2129
|
<div class="drop-tile-rings">
|
|
@@ -2130,12 +2145,12 @@ const ge = class ge extends U {
|
|
|
2130
2145
|
class="drop-tile-src"
|
|
2131
2146
|
style=${r.iconColor && !r.brandHtml ? `color:${r.iconColor}` : ""}
|
|
2132
2147
|
title=${r.label}
|
|
2133
|
-
@click=${(
|
|
2148
|
+
@click=${(i) => this._onSourceClick(i, r)}
|
|
2134
2149
|
>
|
|
2135
|
-
${r.brandHtml ? M(r.brandHtml) :
|
|
2150
|
+
${r.brandHtml ? M(r.brandHtml) : O`<svg viewBox="0 0 24 24" class=${r.fillIcon ? "fill-icon" : ""}>${F(r.icon)}</svg>`}
|
|
2136
2151
|
</button>
|
|
2137
2152
|
`)}
|
|
2138
|
-
${
|
|
2153
|
+
${o.length > 0 ? l`
|
|
2139
2154
|
<div class="drop-tile-more-wrap">
|
|
2140
2155
|
<button class="drop-tile-more" title="More sources" @click=${(r) => this._toggleMore(r)}>···</button>
|
|
2141
2156
|
</div>
|
|
@@ -2157,7 +2172,7 @@ const ge = class ge extends U {
|
|
|
2157
2172
|
`;
|
|
2158
2173
|
}
|
|
2159
2174
|
};
|
|
2160
|
-
|
|
2175
|
+
be.styles = S`
|
|
2161
2176
|
:host {
|
|
2162
2177
|
display: block;
|
|
2163
2178
|
flex: 1;
|
|
@@ -2459,7 +2474,7 @@ ge.styles = S`
|
|
|
2459
2474
|
display: none;
|
|
2460
2475
|
}
|
|
2461
2476
|
`;
|
|
2462
|
-
let B =
|
|
2477
|
+
let B = be;
|
|
2463
2478
|
Z([
|
|
2464
2479
|
b({ attribute: !1 })
|
|
2465
2480
|
], B.prototype, "files");
|
|
@@ -2475,12 +2490,12 @@ Z([
|
|
|
2475
2490
|
Z([
|
|
2476
2491
|
g()
|
|
2477
2492
|
], B.prototype, "_moreOpen");
|
|
2478
|
-
var
|
|
2479
|
-
for (var r = void 0,
|
|
2480
|
-
(s = a[
|
|
2481
|
-
return r &&
|
|
2493
|
+
var dt = Object.defineProperty, pt = (a, e, t, o) => {
|
|
2494
|
+
for (var r = void 0, i = a.length - 1, s; i >= 0; i--)
|
|
2495
|
+
(s = a[i]) && (r = s(e, t, r) || r);
|
|
2496
|
+
return r && dt(e, t, r), r;
|
|
2482
2497
|
};
|
|
2483
|
-
const
|
|
2498
|
+
const me = class me extends U {
|
|
2484
2499
|
_remove() {
|
|
2485
2500
|
this.dispatchEvent(
|
|
2486
2501
|
new CustomEvent("file-remove", {
|
|
@@ -2511,9 +2526,9 @@ const ve = class ve extends U {
|
|
|
2511
2526
|
render() {
|
|
2512
2527
|
const e = this.file;
|
|
2513
2528
|
if (!e) return c;
|
|
2514
|
-
const t = X(e),
|
|
2529
|
+
const t = X(e), o = e.status === "complete", r = e.status === "uploading", i = e.status === "error" || e.status === "failed", s = e.status === "rejected", n = Ke(e.name), d = [
|
|
2515
2530
|
"tile",
|
|
2516
|
-
|
|
2531
|
+
o ? "done" : "",
|
|
2517
2532
|
r ? "uploading" : "",
|
|
2518
2533
|
s ? "rejected" : ""
|
|
2519
2534
|
].filter(Boolean).join(" ");
|
|
@@ -2532,7 +2547,7 @@ const ve = class ve extends U {
|
|
|
2532
2547
|
`}
|
|
2533
2548
|
|
|
2534
2549
|
<!-- Preview button -->
|
|
2535
|
-
${!
|
|
2550
|
+
${!o && !r && !i && e.status !== "rejected" ? l`
|
|
2536
2551
|
<button class="preview-btn" @click=${this._preview} aria-label="Preview file">
|
|
2537
2552
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round">
|
|
2538
2553
|
<path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"/>
|
|
@@ -2548,7 +2563,7 @@ const ve = class ve extends U {
|
|
|
2548
2563
|
</div>
|
|
2549
2564
|
|
|
2550
2565
|
<!-- Done badge -->
|
|
2551
|
-
${
|
|
2566
|
+
${o ? l`<div class="done-badge">
|
|
2552
2567
|
<svg viewBox="0 0 24 24" fill="none" stroke="#fff" stroke-width="3" stroke-linecap="round">
|
|
2553
2568
|
<polyline points="20 6 9 17 4 12" />
|
|
2554
2569
|
</svg>
|
|
@@ -2562,15 +2577,15 @@ const ve = class ve extends U {
|
|
|
2562
2577
|
` : c}
|
|
2563
2578
|
|
|
2564
2579
|
<!-- Error / rejected badge -->
|
|
2565
|
-
${(
|
|
2580
|
+
${(i || s) && e.error ? l`<div class="error-badge" title=${e.error}>${e.error}</div>` : c}
|
|
2566
2581
|
|
|
2567
2582
|
<!-- Video duration badge (hidden when error badge is shown to avoid overlap) -->
|
|
2568
|
-
${!(
|
|
2583
|
+
${!(i || s) && e.duration != null && e.duration > 0 ? l`<div class="duration-badge">${this._formatDuration(e.duration)}</div>` : c}
|
|
2569
2584
|
</div>
|
|
2570
2585
|
|
|
2571
2586
|
<!-- Action buttons -->
|
|
2572
2587
|
<div class="actions">
|
|
2573
|
-
${
|
|
2588
|
+
${i ? l`
|
|
2574
2589
|
<button class="act-btn retry" @click=${this._retry} title="Retry" aria-label="Retry upload">
|
|
2575
2590
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round">
|
|
2576
2591
|
<polyline points="23 4 23 10 17 10" />
|
|
@@ -2598,8 +2613,8 @@ const ve = class ve extends U {
|
|
|
2598
2613
|
`;
|
|
2599
2614
|
}
|
|
2600
2615
|
_formatDuration(e) {
|
|
2601
|
-
const t = Math.floor(e / 60),
|
|
2602
|
-
return `${t}:${
|
|
2616
|
+
const t = Math.floor(e / 60), o = Math.floor(e % 60);
|
|
2617
|
+
return `${t}:${o.toString().padStart(2, "0")}`;
|
|
2603
2618
|
}
|
|
2604
2619
|
_renderTypeIcon(e) {
|
|
2605
2620
|
switch (e) {
|
|
@@ -2616,7 +2631,7 @@ const ve = class ve extends U {
|
|
|
2616
2631
|
}
|
|
2617
2632
|
}
|
|
2618
2633
|
};
|
|
2619
|
-
|
|
2634
|
+
me.styles = S`
|
|
2620
2635
|
:host {
|
|
2621
2636
|
display: block;
|
|
2622
2637
|
}
|
|
@@ -2998,10 +3013,10 @@ ve.styles = S`
|
|
|
2998
3013
|
.spin-ring { animation: none; }
|
|
2999
3014
|
}
|
|
3000
3015
|
`;
|
|
3001
|
-
let
|
|
3002
|
-
|
|
3016
|
+
let pe = me;
|
|
3017
|
+
pt([
|
|
3003
3018
|
b({ attribute: !1 })
|
|
3004
|
-
],
|
|
3019
|
+
], pe.prototype, "file");
|
|
3005
3020
|
const J = S`
|
|
3006
3021
|
.btn,
|
|
3007
3022
|
.btn-ghost,
|
|
@@ -3077,12 +3092,12 @@ const J = S`
|
|
|
3077
3092
|
outline-offset: 2px;
|
|
3078
3093
|
}
|
|
3079
3094
|
`;
|
|
3080
|
-
var
|
|
3081
|
-
for (var r = void 0,
|
|
3082
|
-
(s = a[
|
|
3083
|
-
return r &&
|
|
3095
|
+
var ct = Object.defineProperty, ee = (a, e, t, o) => {
|
|
3096
|
+
for (var r = void 0, i = a.length - 1, s; i >= 0; i--)
|
|
3097
|
+
(s = a[i]) && (r = s(e, t, r) || r);
|
|
3098
|
+
return r && ct(e, t, r), r;
|
|
3084
3099
|
};
|
|
3085
|
-
const
|
|
3100
|
+
const Re = 7, we = class we extends U {
|
|
3086
3101
|
constructor() {
|
|
3087
3102
|
super(...arguments), this.fileCount = 0, this.totalSize = 0, this.thumbnails = [], this.primaryLabel = "Done", this.failedFiles = [];
|
|
3088
3103
|
}
|
|
@@ -3112,14 +3127,14 @@ const Ue = 7, be = class be extends U {
|
|
|
3112
3127
|
);
|
|
3113
3128
|
}
|
|
3114
3129
|
render() {
|
|
3115
|
-
const e = this.thumbnails.slice(0,
|
|
3130
|
+
const e = this.thumbnails.slice(0, Re), t = this.thumbnails.length - Re, o = this.fileCount > 0, r = this.failedFiles.length > 0, i = r && !o;
|
|
3116
3131
|
return l`
|
|
3117
3132
|
<button class="close-btn" title="Close" @click=${this._close}>
|
|
3118
3133
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><line x1="18" y1="6" x2="6" y2="18"/><line x1="6" y1="6" x2="18" y2="18"/></svg>
|
|
3119
3134
|
</button>
|
|
3120
3135
|
<div class="card" role="status" aria-live="polite">
|
|
3121
|
-
<div class="icon ${
|
|
3122
|
-
${
|
|
3136
|
+
<div class="icon ${i ? "error" : r ? "warning" : ""}">
|
|
3137
|
+
${i ? l`<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
3123
3138
|
<circle cx="12" cy="12" r="10"/><line x1="12" y1="8" x2="12" y2="12"/><line x1="12" y1="16" x2="12.01" y2="16"/>
|
|
3124
3139
|
</svg>` : r ? l`<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
3125
3140
|
<path d="M10.29 3.86L1.82 18a2 2 0 001.71 3h16.94a2 2 0 001.71-3L13.71 3.86a2 2 0 00-3.42 0z"/><line x1="12" y1="9" x2="12" y2="13"/><line x1="12" y1="17" x2="12.01" y2="17"/>
|
|
@@ -3127,8 +3142,8 @@ const Ue = 7, be = class be extends U {
|
|
|
3127
3142
|
<polyline points="20 6 9 17 4 12" />
|
|
3128
3143
|
</svg>`}
|
|
3129
3144
|
</div>
|
|
3130
|
-
<div class="title">${
|
|
3131
|
-
<div class="subtitle">${
|
|
3145
|
+
<div class="title">${i ? "Upload failed" : r ? "Partially uploaded" : "Uploaded successfully!"}</div>
|
|
3146
|
+
<div class="subtitle">${i ? `${this.failedFiles.length === 1 ? "File" : "Files"} could not be uploaded` : r ? `${this.fileCount} ${this.fileCount === 1 ? "file" : "files"} uploaded, ${this.failedFiles.length} failed` : "All files are ready for use"}</div>
|
|
3132
3147
|
|
|
3133
3148
|
${e.length > 0 ? l`
|
|
3134
3149
|
<div class="thumbs">
|
|
@@ -3139,7 +3154,7 @@ const Ue = 7, be = class be extends U {
|
|
|
3139
3154
|
</div>
|
|
3140
3155
|
` : c}
|
|
3141
3156
|
|
|
3142
|
-
${
|
|
3157
|
+
${o ? l`<div class="summary">${this.fileCount} ${this.fileCount === 1 ? "file" : "files"} · ${Y(this.totalSize)} uploaded</div>` : c}
|
|
3143
3158
|
|
|
3144
3159
|
${r ? l`
|
|
3145
3160
|
<div class="failed-list">
|
|
@@ -3167,7 +3182,7 @@ const Ue = 7, be = class be extends U {
|
|
|
3167
3182
|
`;
|
|
3168
3183
|
}
|
|
3169
3184
|
};
|
|
3170
|
-
|
|
3185
|
+
we.styles = [J, Q, S`
|
|
3171
3186
|
:host {
|
|
3172
3187
|
display: flex;
|
|
3173
3188
|
flex: 1;
|
|
@@ -3447,7 +3462,7 @@ be.styles = [J, Q, S`
|
|
|
3447
3462
|
.icon { animation: none; }
|
|
3448
3463
|
}
|
|
3449
3464
|
`];
|
|
3450
|
-
let L =
|
|
3465
|
+
let L = we;
|
|
3451
3466
|
ee([
|
|
3452
3467
|
b({ type: Number })
|
|
3453
3468
|
], L.prototype, "fileCount");
|
|
@@ -3463,12 +3478,12 @@ ee([
|
|
|
3463
3478
|
ee([
|
|
3464
3479
|
b({ type: Array })
|
|
3465
3480
|
], L.prototype, "failedFiles");
|
|
3466
|
-
var
|
|
3467
|
-
for (var r = void 0,
|
|
3468
|
-
(s = a[
|
|
3469
|
-
return r &&
|
|
3481
|
+
var ft = Object.defineProperty, I = (a, e, t, o) => {
|
|
3482
|
+
for (var r = void 0, i = a.length - 1, s; i >= 0; i--)
|
|
3483
|
+
(s = a[i]) && (r = s(e, t, r) || r);
|
|
3484
|
+
return r && ft(e, t, r), r;
|
|
3470
3485
|
};
|
|
3471
|
-
const
|
|
3486
|
+
const ye = class ye extends U {
|
|
3472
3487
|
constructor() {
|
|
3473
3488
|
super(...arguments), this.uploadState = "idle", this.fileCount = 0, this.totalSize = 0, this.failedCount = 0, this.showFillMetadata = !1, this.completedCount = 0, this.uploadProgress = 0;
|
|
3474
3489
|
}
|
|
@@ -3546,10 +3561,10 @@ const me = class me extends U {
|
|
|
3546
3561
|
`;
|
|
3547
3562
|
}
|
|
3548
3563
|
_renderUploadButton() {
|
|
3549
|
-
const e = this.uploadState === "uploading", t = this.uploadState === "done",
|
|
3564
|
+
const e = this.uploadState === "uploading", t = this.uploadState === "done", o = ["btn-primary", t ? "done-state" : ""].filter(Boolean).join(" ");
|
|
3550
3565
|
return l`
|
|
3551
3566
|
<button
|
|
3552
|
-
class=${
|
|
3567
|
+
class=${o}
|
|
3553
3568
|
@click=${this._upload}
|
|
3554
3569
|
?disabled=${e}
|
|
3555
3570
|
>
|
|
@@ -3570,7 +3585,7 @@ const me = class me extends U {
|
|
|
3570
3585
|
`;
|
|
3571
3586
|
}
|
|
3572
3587
|
};
|
|
3573
|
-
|
|
3588
|
+
ye.styles = [J, Q, S`
|
|
3574
3589
|
:host {
|
|
3575
3590
|
display: flex;
|
|
3576
3591
|
flex-direction: column;
|
|
@@ -3719,48 +3734,48 @@ me.styles = [J, Q, S`
|
|
|
3719
3734
|
.btn-spin { animation: none; }
|
|
3720
3735
|
}
|
|
3721
3736
|
`];
|
|
3722
|
-
let
|
|
3737
|
+
let j = ye;
|
|
3723
3738
|
I([
|
|
3724
3739
|
b({ type: String })
|
|
3725
|
-
],
|
|
3740
|
+
], j.prototype, "uploadState");
|
|
3726
3741
|
I([
|
|
3727
3742
|
b({ type: Number })
|
|
3728
|
-
],
|
|
3743
|
+
], j.prototype, "fileCount");
|
|
3729
3744
|
I([
|
|
3730
3745
|
b({ type: Number })
|
|
3731
|
-
],
|
|
3746
|
+
], j.prototype, "totalSize");
|
|
3732
3747
|
I([
|
|
3733
3748
|
b({ type: Number })
|
|
3734
|
-
],
|
|
3749
|
+
], j.prototype, "failedCount");
|
|
3735
3750
|
I([
|
|
3736
3751
|
b({ type: Boolean })
|
|
3737
|
-
],
|
|
3752
|
+
], j.prototype, "showFillMetadata");
|
|
3738
3753
|
I([
|
|
3739
3754
|
b({ type: Number })
|
|
3740
|
-
],
|
|
3755
|
+
], j.prototype, "completedCount");
|
|
3741
3756
|
I([
|
|
3742
3757
|
b({ type: Number })
|
|
3743
|
-
],
|
|
3744
|
-
const
|
|
3745
|
-
function
|
|
3758
|
+
], j.prototype, "uploadProgress");
|
|
3759
|
+
const ht = 'button:not([disabled]), [href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"])';
|
|
3760
|
+
function he(a, e) {
|
|
3746
3761
|
return (t) => {
|
|
3747
3762
|
if (t.key !== "Tab") return;
|
|
3748
|
-
const
|
|
3749
|
-
if (!
|
|
3750
|
-
const r =
|
|
3763
|
+
const o = a();
|
|
3764
|
+
if (!o) return;
|
|
3765
|
+
const r = o.querySelector(e);
|
|
3751
3766
|
if (!r) return;
|
|
3752
|
-
const
|
|
3753
|
-
if (
|
|
3754
|
-
const s =
|
|
3767
|
+
const i = Array.from(r.querySelectorAll(ht));
|
|
3768
|
+
if (i.length === 0) return;
|
|
3769
|
+
const s = i[0], n = i[i.length - 1], d = o.activeElement;
|
|
3755
3770
|
t.shiftKey ? (d === s || !r.contains(d)) && (t.preventDefault(), n.focus()) : (d === n || !r.contains(d)) && (t.preventDefault(), s.focus());
|
|
3756
3771
|
};
|
|
3757
3772
|
}
|
|
3758
|
-
var
|
|
3759
|
-
for (var r = void 0,
|
|
3760
|
-
(s = a[
|
|
3761
|
-
return r &&
|
|
3773
|
+
var ut = Object.defineProperty, ue = (a, e, t, o) => {
|
|
3774
|
+
for (var r = void 0, i = a.length - 1, s; i >= 0; i--)
|
|
3775
|
+
(s = a[i]) && (r = s(e, t, r) || r);
|
|
3776
|
+
return r && ut(e, t, r), r;
|
|
3762
3777
|
};
|
|
3763
|
-
const
|
|
3778
|
+
const _e = class _e extends U {
|
|
3764
3779
|
constructor() {
|
|
3765
3780
|
super(...arguments), this._url = "", this._name = "", this._error = "", this._onBackdropClick = (e) => {
|
|
3766
3781
|
e.target === e.currentTarget && this._cancel();
|
|
@@ -3768,7 +3783,7 @@ const we = class we extends U {
|
|
|
3768
3783
|
this._url = e.target.value, this._error = "", this._autoName();
|
|
3769
3784
|
}, this._onNameInput = (e) => {
|
|
3770
3785
|
this._name = e.target.value;
|
|
3771
|
-
}, this._focusTrap =
|
|
3786
|
+
}, this._focusTrap = he(() => this.shadowRoot, ".card"), this._onKeyDown = (e) => {
|
|
3772
3787
|
var t;
|
|
3773
3788
|
e.key === "Escape" && this._cancel(), e.key === "Enter" && ((t = e.target) == null ? void 0 : t.tagName) === "INPUT" && this._submit(), this._focusTrap(e);
|
|
3774
3789
|
};
|
|
@@ -3777,10 +3792,10 @@ const we = class we extends U {
|
|
|
3777
3792
|
var e;
|
|
3778
3793
|
if (!this._name)
|
|
3779
3794
|
try {
|
|
3780
|
-
const t = new URL(this._url).pathname.split("/"),
|
|
3781
|
-
if (
|
|
3795
|
+
const t = new URL(this._url).pathname.split("/"), o = t[t.length - 1];
|
|
3796
|
+
if (o) {
|
|
3782
3797
|
const r = (e = this.shadowRoot) == null ? void 0 : e.querySelector("#nameInput");
|
|
3783
|
-
r && (r.placeholder =
|
|
3798
|
+
r && (r.placeholder = o);
|
|
3784
3799
|
}
|
|
3785
3800
|
} catch {
|
|
3786
3801
|
}
|
|
@@ -3804,8 +3819,8 @@ const we = class we extends U {
|
|
|
3804
3819
|
let t = this._name.trim();
|
|
3805
3820
|
if (!t)
|
|
3806
3821
|
try {
|
|
3807
|
-
const
|
|
3808
|
-
t =
|
|
3822
|
+
const o = new URL(e).pathname.split("/");
|
|
3823
|
+
t = o[o.length - 1] || "imported-file";
|
|
3809
3824
|
} catch {
|
|
3810
3825
|
t = "imported-file";
|
|
3811
3826
|
}
|
|
@@ -3871,7 +3886,7 @@ const we = class we extends U {
|
|
|
3871
3886
|
`;
|
|
3872
3887
|
}
|
|
3873
3888
|
};
|
|
3874
|
-
|
|
3889
|
+
_e.styles = [J, Q, S`
|
|
3875
3890
|
:host {
|
|
3876
3891
|
display: block;
|
|
3877
3892
|
}
|
|
@@ -4045,30 +4060,30 @@ we.styles = [J, Q, S`
|
|
|
4045
4060
|
}
|
|
4046
4061
|
|
|
4047
4062
|
`];
|
|
4048
|
-
let K =
|
|
4049
|
-
|
|
4063
|
+
let K = _e;
|
|
4064
|
+
ue([
|
|
4050
4065
|
g()
|
|
4051
4066
|
], K.prototype, "_url");
|
|
4052
|
-
|
|
4067
|
+
ue([
|
|
4053
4068
|
g()
|
|
4054
4069
|
], K.prototype, "_name");
|
|
4055
|
-
|
|
4070
|
+
ue([
|
|
4056
4071
|
g()
|
|
4057
4072
|
], K.prototype, "_error");
|
|
4058
|
-
var
|
|
4059
|
-
for (var r = void 0,
|
|
4060
|
-
(s = a[
|
|
4061
|
-
return r &&
|
|
4073
|
+
var xt = Object.defineProperty, oe = (a, e, t, o) => {
|
|
4074
|
+
for (var r = void 0, i = a.length - 1, s; i >= 0; i--)
|
|
4075
|
+
(s = a[i]) && (r = s(e, t, r) || r);
|
|
4076
|
+
return r && xt(e, t, r), r;
|
|
4062
4077
|
};
|
|
4063
|
-
const
|
|
4078
|
+
const ke = class ke extends U {
|
|
4064
4079
|
constructor() {
|
|
4065
4080
|
super(...arguments), this._stream = null, this._error = "", this._captured = null, this._previewUrl = "", this._onBackdropClick = (e) => {
|
|
4066
4081
|
e.target === e.currentTarget && this._cancel();
|
|
4067
|
-
}, this._focusTrap =
|
|
4082
|
+
}, this._focusTrap = he(() => this.shadowRoot, ".card"), this._onKeyDown = (e) => {
|
|
4068
4083
|
e.key === "Escape" && this._cancel(), this._focusTrap(e);
|
|
4069
4084
|
}, this._capture = () => {
|
|
4070
|
-
var r,
|
|
4071
|
-
const e = (r = this.shadowRoot) == null ? void 0 : r.querySelector("video"), t = (
|
|
4085
|
+
var r, i;
|
|
4086
|
+
const e = (r = this.shadowRoot) == null ? void 0 : r.querySelector("video"), t = (i = this.shadowRoot) == null ? void 0 : i.querySelector("canvas");
|
|
4072
4087
|
if (!e || !t) return;
|
|
4073
4088
|
t.width = e.videoWidth, t.height = e.videoHeight, t.getContext("2d").drawImage(e, 0, 0), t.toBlob((s) => {
|
|
4074
4089
|
s && (this._captured = s, this._previewUrl = URL.createObjectURL(s), this._stopStream());
|
|
@@ -4138,7 +4153,7 @@ const ye = class ye extends U {
|
|
|
4138
4153
|
`;
|
|
4139
4154
|
}
|
|
4140
4155
|
};
|
|
4141
|
-
|
|
4156
|
+
ke.styles = [J, Q, S`
|
|
4142
4157
|
:host { display: block; }
|
|
4143
4158
|
|
|
4144
4159
|
.backdrop {
|
|
@@ -4219,29 +4234,29 @@ ye.styles = [J, Q, S`
|
|
|
4219
4234
|
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
|
|
4220
4235
|
@keyframes slideUp { from { transform: translateY(18px) scale(0.97); } to { transform: translateY(0) scale(1); } }
|
|
4221
4236
|
`];
|
|
4222
|
-
let V =
|
|
4223
|
-
|
|
4237
|
+
let V = ke;
|
|
4238
|
+
oe([
|
|
4224
4239
|
g()
|
|
4225
4240
|
], V.prototype, "_stream");
|
|
4226
|
-
|
|
4241
|
+
oe([
|
|
4227
4242
|
g()
|
|
4228
4243
|
], V.prototype, "_error");
|
|
4229
|
-
|
|
4244
|
+
oe([
|
|
4230
4245
|
g()
|
|
4231
4246
|
], V.prototype, "_captured");
|
|
4232
|
-
|
|
4247
|
+
oe([
|
|
4233
4248
|
g()
|
|
4234
4249
|
], V.prototype, "_previewUrl");
|
|
4235
|
-
var
|
|
4236
|
-
for (var r = void 0,
|
|
4237
|
-
(s = a[
|
|
4238
|
-
return r &&
|
|
4250
|
+
var gt = Object.defineProperty, te = (a, e, t, o) => {
|
|
4251
|
+
for (var r = void 0, i = a.length - 1, s; i >= 0; i--)
|
|
4252
|
+
(s = a[i]) && (r = s(e, t, r) || r);
|
|
4253
|
+
return r && gt(e, t, r), r;
|
|
4239
4254
|
};
|
|
4240
|
-
const
|
|
4255
|
+
const Ce = class Ce extends U {
|
|
4241
4256
|
constructor() {
|
|
4242
4257
|
super(...arguments), this._stream = null, this._recording = !1, this._error = "", this._recordedBlob = null, this._previewUrl = "", this._recorder = null, this._chunks = [], this._onBackdropClick = (e) => {
|
|
4243
4258
|
e.target === e.currentTarget && this._cancel();
|
|
4244
|
-
}, this._focusTrap =
|
|
4259
|
+
}, this._focusTrap = he(() => this.shadowRoot, ".card"), this._onKeyDown = (e) => {
|
|
4245
4260
|
e.key === "Escape" && this._cancel(), this._focusTrap(e);
|
|
4246
4261
|
}, this._startRecording = async () => {
|
|
4247
4262
|
var e;
|
|
@@ -4254,13 +4269,13 @@ const _e = class _e extends U {
|
|
|
4254
4269
|
}), this._recording = !0, await this.updateComplete;
|
|
4255
4270
|
const t = (e = this.shadowRoot) == null ? void 0 : e.querySelector("video");
|
|
4256
4271
|
t && (t.srcObject = this._stream), this._chunks = [];
|
|
4257
|
-
const
|
|
4258
|
-
this._recorder = new MediaRecorder(this._stream, { mimeType:
|
|
4272
|
+
const o = MediaRecorder.isTypeSupported("video/webm;codecs=vp9") ? "video/webm;codecs=vp9" : "video/webm";
|
|
4273
|
+
this._recorder = new MediaRecorder(this._stream, { mimeType: o }), this._recorder.ondataavailable = (r) => {
|
|
4259
4274
|
r.data.size > 0 && this._chunks.push(r.data);
|
|
4260
4275
|
}, this._recorder.onstop = () => {
|
|
4261
|
-
var
|
|
4276
|
+
var i;
|
|
4262
4277
|
const r = new Blob(this._chunks, { type: "video/webm" });
|
|
4263
|
-
this._recordedBlob = r, this._previewUrl = URL.createObjectURL(r), (
|
|
4278
|
+
this._recordedBlob = r, this._previewUrl = URL.createObjectURL(r), (i = this._stream) == null || i.getTracks().forEach((s) => s.stop()), this._stream = null;
|
|
4264
4279
|
}, this._recorder.start();
|
|
4265
4280
|
} catch {
|
|
4266
4281
|
this._error = "Could not start screen capture. Please check your permissions.";
|
|
@@ -4281,7 +4296,7 @@ const _e = class _e extends U {
|
|
|
4281
4296
|
}
|
|
4282
4297
|
_stopAll() {
|
|
4283
4298
|
var e, t;
|
|
4284
|
-
(e = this._recorder) == null || e.stop(), this._recorder = null, (t = this._stream) == null || t.getTracks().forEach((
|
|
4299
|
+
(e = this._recorder) == null || e.stop(), this._recorder = null, (t = this._stream) == null || t.getTracks().forEach((o) => o.stop()), this._stream = null;
|
|
4285
4300
|
}
|
|
4286
4301
|
_cancel() {
|
|
4287
4302
|
this._stopAll(), this.dispatchEvent(new CustomEvent("screencast-cancel", { bubbles: !0, composed: !0 }));
|
|
@@ -4336,7 +4351,7 @@ const _e = class _e extends U {
|
|
|
4336
4351
|
`;
|
|
4337
4352
|
}
|
|
4338
4353
|
};
|
|
4339
|
-
|
|
4354
|
+
Ce.styles = [J, Q, S`
|
|
4340
4355
|
:host { display: block; }
|
|
4341
4356
|
|
|
4342
4357
|
.backdrop {
|
|
@@ -4435,7 +4450,7 @@ _e.styles = [J, Q, S`
|
|
|
4435
4450
|
@keyframes slideUp { from { transform: translateY(18px) scale(0.97); } to { transform: translateY(0) scale(1); } }
|
|
4436
4451
|
@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.3; } }
|
|
4437
4452
|
`];
|
|
4438
|
-
let A =
|
|
4453
|
+
let A = Ce;
|
|
4439
4454
|
te([
|
|
4440
4455
|
g()
|
|
4441
4456
|
], A.prototype, "_stream");
|
|
@@ -4451,12 +4466,12 @@ te([
|
|
|
4451
4466
|
te([
|
|
4452
4467
|
g()
|
|
4453
4468
|
], A.prototype, "_previewUrl");
|
|
4454
|
-
var
|
|
4455
|
-
for (var r = void 0,
|
|
4456
|
-
(s = a[
|
|
4457
|
-
return r &&
|
|
4469
|
+
var vt = Object.defineProperty, $ = (a, e, t, o) => {
|
|
4470
|
+
for (var r = void 0, i = a.length - 1, s; i >= 0; i--)
|
|
4471
|
+
(s = a[i]) && (r = s(e, t, r) || r);
|
|
4472
|
+
return r && vt(e, t, r), r;
|
|
4458
4473
|
};
|
|
4459
|
-
const
|
|
4474
|
+
const je = /* @__PURE__ */ new Set(["unsplash"]);
|
|
4460
4475
|
var E;
|
|
4461
4476
|
const k = (E = class extends U {
|
|
4462
4477
|
constructor() {
|
|
@@ -4467,7 +4482,7 @@ const k = (E = class extends U {
|
|
|
4467
4482
|
}, this._onSourceClick = async (e) => {
|
|
4468
4483
|
this._handleSourceActivation(e.detail.source);
|
|
4469
4484
|
}, this._handleSourceActivation = async (e) => {
|
|
4470
|
-
var r,
|
|
4485
|
+
var r, i;
|
|
4471
4486
|
const t = this._mergedSources.find((s) => s.id === e);
|
|
4472
4487
|
if (t != null && t.onActivate) {
|
|
4473
4488
|
try {
|
|
@@ -4494,14 +4509,14 @@ const k = (E = class extends U {
|
|
|
4494
4509
|
this._showScreenCastDialog = !0;
|
|
4495
4510
|
return;
|
|
4496
4511
|
}
|
|
4497
|
-
if ((((
|
|
4498
|
-
if (
|
|
4512
|
+
if ((((i = (r = this.config) == null ? void 0 : r.connectors) == null ? void 0 : i.providers) ?? []).includes(e)) {
|
|
4513
|
+
if (je.has(e)) {
|
|
4499
4514
|
if (!customElements.get("sfx-search-provider-browser")) {
|
|
4500
|
-
const { SfxSearchProviderBrowser: n } = await import("./search-provider-browser-
|
|
4515
|
+
const { SfxSearchProviderBrowser: n } = await import("./search-provider-browser-gtlEKi5h.js");
|
|
4501
4516
|
customElements.define("sfx-search-provider-browser", n);
|
|
4502
4517
|
}
|
|
4503
4518
|
} else if (!customElements.get("sfx-provider-browser")) {
|
|
4504
|
-
const { SfxProviderBrowser: n } = await import("./provider-browser-
|
|
4519
|
+
const { SfxProviderBrowser: n } = await import("./provider-browser-B33dyOPN.js");
|
|
4505
4520
|
customElements.define("sfx-provider-browser", n);
|
|
4506
4521
|
}
|
|
4507
4522
|
this._activeConnector = e;
|
|
@@ -4509,16 +4524,16 @@ const k = (E = class extends U {
|
|
|
4509
4524
|
}, this._onUrlSubmit = (e) => {
|
|
4510
4525
|
var h, u, x;
|
|
4511
4526
|
this._showUrlDialog = !1;
|
|
4512
|
-
const { url: t, name:
|
|
4527
|
+
const { url: t, name: o } = e.detail, r = (h = this.config) == null ? void 0 : h.callbacks, i = Ze(o), s = i.startsWith("image/"), n = this._store.getState(), d = ae({ name: o, size: 0, type: i }, n.restrictions, n.files);
|
|
4513
4528
|
if (d) {
|
|
4514
4529
|
const f = {
|
|
4515
4530
|
id: q(),
|
|
4516
4531
|
status: "rejected",
|
|
4517
4532
|
file: null,
|
|
4518
4533
|
remoteUrl: t,
|
|
4519
|
-
name:
|
|
4534
|
+
name: o,
|
|
4520
4535
|
size: 0,
|
|
4521
|
-
type:
|
|
4536
|
+
type: i,
|
|
4522
4537
|
previewUrl: null,
|
|
4523
4538
|
duration: null,
|
|
4524
4539
|
progress: 0,
|
|
@@ -4540,9 +4555,9 @@ const k = (E = class extends U {
|
|
|
4540
4555
|
status: "idle",
|
|
4541
4556
|
file: null,
|
|
4542
4557
|
remoteUrl: t,
|
|
4543
|
-
name:
|
|
4558
|
+
name: o,
|
|
4544
4559
|
size: 0,
|
|
4545
|
-
type:
|
|
4560
|
+
type: i,
|
|
4546
4561
|
previewUrl: s ? t : null,
|
|
4547
4562
|
duration: null,
|
|
4548
4563
|
progress: 0,
|
|
@@ -4570,15 +4585,15 @@ const k = (E = class extends U {
|
|
|
4570
4585
|
}, this._onFileRemove = (e) => {
|
|
4571
4586
|
this._removeFile(e.detail.fileId);
|
|
4572
4587
|
}, this._onFilePreview = (e) => {
|
|
4573
|
-
var
|
|
4588
|
+
var o, r, i;
|
|
4574
4589
|
const t = this._store.getState().files.get(e.detail.fileId);
|
|
4575
|
-
t && (this._previewFileId = t.id, this._dispatchPublic(v.FILE_PREVIEW, { file: t }), (
|
|
4590
|
+
t && (this._previewFileId = t.id, this._dispatchPublic(v.FILE_PREVIEW, { file: t }), (i = (r = (o = this.config) == null ? void 0 : o.callbacks) == null ? void 0 : r.onFilePreview) == null || i.call(r, t));
|
|
4576
4591
|
}, this._onFillMetadata = () => {
|
|
4577
|
-
var t,
|
|
4592
|
+
var t, o, r;
|
|
4578
4593
|
const e = [...this._store.getState().files.values()].filter(
|
|
4579
|
-
(
|
|
4594
|
+
(i) => E._MODIFIABLE_STATUSES.has(i.status)
|
|
4580
4595
|
);
|
|
4581
|
-
this._dispatchPublic(v.FILL_METADATA, { files: e }), (r = (
|
|
4596
|
+
this._dispatchPublic(v.FILL_METADATA, { files: e }), (r = (o = (t = this.config) == null ? void 0 : t.callbacks) == null ? void 0 : o.onFillMetadata) == null || r.call(o, e);
|
|
4582
4597
|
}, this._onFileRetry = (e) => {
|
|
4583
4598
|
var t;
|
|
4584
4599
|
this._ensureEngine(), (t = this._engine) == null || t.retryFile(e.detail.fileId);
|
|
@@ -4586,12 +4601,12 @@ const k = (E = class extends U {
|
|
|
4586
4601
|
var e;
|
|
4587
4602
|
this._ensureEngine(), (e = this._engine) == null || e.retryAll();
|
|
4588
4603
|
}, this._onClearAll = () => {
|
|
4589
|
-
var
|
|
4590
|
-
const e = (
|
|
4604
|
+
var o, r, i;
|
|
4605
|
+
const e = (o = this.config) == null ? void 0 : o.callbacks;
|
|
4591
4606
|
this._closeOnCompleteTimer && (clearTimeout(this._closeOnCompleteTimer), this._closeOnCompleteTimer = null), (r = this._engine) == null || r.cancelAll();
|
|
4592
4607
|
const t = [...this._store.getState().files.values()];
|
|
4593
4608
|
for (const s of t)
|
|
4594
|
-
s.previewUrl && URL.revokeObjectURL(s.previewUrl), this._dispatchPublic(v.FILE_REMOVED, { file: s }), (
|
|
4609
|
+
s.previewUrl && URL.revokeObjectURL(s.previewUrl), this._dispatchPublic(v.FILE_REMOVED, { file: s }), (i = e == null ? void 0 : e.onFileRemoved) == null || i.call(e, s);
|
|
4595
4610
|
this._revokeVideoBlobUrls();
|
|
4596
4611
|
for (const s of this._rejectedTimers.values()) clearTimeout(s);
|
|
4597
4612
|
this._rejectedTimers.clear(), this._dimCache.clear(), this._previewFileId = null, this._fullscreenPreviewUrl = null, this._fullscreenVideoFile = null, this._store.setState({
|
|
@@ -4609,8 +4624,8 @@ const k = (E = class extends U {
|
|
|
4609
4624
|
e.browse();
|
|
4610
4625
|
return;
|
|
4611
4626
|
}
|
|
4612
|
-
const t = this.shadowRoot.querySelector("sfx-file-list"),
|
|
4613
|
-
|
|
4627
|
+
const t = this.shadowRoot.querySelector("sfx-file-list"), o = (r = t == null ? void 0 : t.shadowRoot) == null ? void 0 : r.querySelector('input[type="file"]');
|
|
4628
|
+
o == null || o.click();
|
|
4614
4629
|
}, this._onUploadStart = () => {
|
|
4615
4630
|
var e;
|
|
4616
4631
|
if (this._phase === "complete") {
|
|
@@ -4621,8 +4636,8 @@ const k = (E = class extends U {
|
|
|
4621
4636
|
}, this._onUploadMore = () => {
|
|
4622
4637
|
this._onClearAll();
|
|
4623
4638
|
}, this._onConnectorFilesSelected = (e) => {
|
|
4624
|
-
var
|
|
4625
|
-
const t = (
|
|
4639
|
+
var o, r, i;
|
|
4640
|
+
const t = (o = this.config) == null ? void 0 : o.callbacks;
|
|
4626
4641
|
for (const s of e.detail.files) {
|
|
4627
4642
|
const n = this._store.getState(), d = ae(
|
|
4628
4643
|
{ name: s.name, size: s.size, type: s.mimeType },
|
|
@@ -4675,7 +4690,7 @@ const k = (E = class extends U {
|
|
|
4675
4690
|
tags: [],
|
|
4676
4691
|
remoteInfo: s
|
|
4677
4692
|
};
|
|
4678
|
-
H(this._store, p), this._dispatchPublic(v.FILE_ADDED, { file: p }), (
|
|
4693
|
+
H(this._store, p), this._dispatchPublic(v.FILE_ADDED, { file: p }), (i = t == null ? void 0 : t.onFileAdded) == null || i.call(t, p);
|
|
4679
4694
|
}
|
|
4680
4695
|
this._activeConnector = null, this._store.getState().queueConfig.autoProceed && this.upload();
|
|
4681
4696
|
}, this._onConnectorClose = () => {
|
|
@@ -4683,17 +4698,17 @@ const k = (E = class extends U {
|
|
|
4683
4698
|
}, this._onConnectorBackdropClick = (e) => {
|
|
4684
4699
|
e.target === e.currentTarget && (this._activeConnector = null);
|
|
4685
4700
|
}, this._onPrimaryAction = () => {
|
|
4686
|
-
var e, t,
|
|
4687
|
-
this._dispatchPublic(v.COMPLETE_ACTION, {}), (
|
|
4701
|
+
var e, t, o, r, i;
|
|
4702
|
+
this._dispatchPublic(v.COMPLETE_ACTION, {}), (o = (t = (e = this.config) == null ? void 0 : e.callbacks) == null ? void 0 : t.onCompleteAction) == null || o.call(t), ((r = this.config) == null ? void 0 : r.mode) === "modal" ? this.close() : ((i = this.config) == null ? void 0 : i.clearOnComplete) !== !1 && this._onClearAll();
|
|
4688
4703
|
}, this._onInlineDismiss = () => {
|
|
4689
|
-
var e, t,
|
|
4690
|
-
(
|
|
4704
|
+
var e, t, o;
|
|
4705
|
+
(o = (t = (e = this.config) == null ? void 0 : e.callbacks) == null ? void 0 : t.onCancel) == null || o.call(t), this._dispatchPublic(v.CANCEL, {});
|
|
4691
4706
|
}, this._onSuccessCardClose = () => {
|
|
4692
|
-
var e, t,
|
|
4693
|
-
((e = this.config) == null ? void 0 : e.mode) === "inline" ? (this._dispatchPublic(v.COMPLETE_ACTION, {}), (r = (
|
|
4707
|
+
var e, t, o, r;
|
|
4708
|
+
((e = this.config) == null ? void 0 : e.mode) === "inline" ? (this._dispatchPublic(v.COMPLETE_ACTION, {}), (r = (o = (t = this.config) == null ? void 0 : t.callbacks) == null ? void 0 : o.onCompleteAction) == null || r.call(o), this._onClearAll()) : this._onModalDismiss();
|
|
4694
4709
|
}, this._onModalDismiss = () => {
|
|
4695
|
-
var e, t,
|
|
4696
|
-
this._phase === "uploading" && ((e = this._engine) == null || e.cancelAll()), (r = (
|
|
4710
|
+
var e, t, o, r;
|
|
4711
|
+
this._phase === "uploading" && ((e = this._engine) == null || e.cancelAll()), (r = (o = (t = this.config) == null ? void 0 : t.callbacks) == null ? void 0 : o.onCancel) == null || r.call(o), this._dispatchPublic(v.CANCEL, {}), this.close();
|
|
4697
4712
|
}, this._onMinimize = () => {
|
|
4698
4713
|
this._isMinimized = !0, this._isPillExpanded = !0, this.requestUpdate();
|
|
4699
4714
|
}, this._onPillClick = () => {
|
|
@@ -4701,8 +4716,8 @@ const k = (E = class extends U {
|
|
|
4701
4716
|
}, this._onPillExpand = () => {
|
|
4702
4717
|
this._isMinimized = !1, this._isPillExpanded = !1, this._isOpen = !0, this.requestUpdate();
|
|
4703
4718
|
}, this._onPillDismiss = () => {
|
|
4704
|
-
var e, t,
|
|
4705
|
-
this._isMinimized = !1, this._isPillExpanded = !1, this._phase === "uploading" && ((e = this._engine) == null || e.cancelAll()), (r = (
|
|
4719
|
+
var e, t, o, r;
|
|
4720
|
+
this._isMinimized = !1, this._isPillExpanded = !1, this._phase === "uploading" && ((e = this._engine) == null || e.cancelAll()), (r = (o = (t = this.config) == null ? void 0 : t.callbacks) == null ? void 0 : o.onCancel) == null || r.call(o), this._dispatchPublic(v.CANCEL, {}), this.close();
|
|
4706
4721
|
}, this._onModalBackdropClick = (e) => {
|
|
4707
4722
|
e.target === e.currentTarget && this._onModalDismiss();
|
|
4708
4723
|
}, this._onBodyDragEnter = (e) => {
|
|
@@ -4712,25 +4727,25 @@ const k = (E = class extends U {
|
|
|
4712
4727
|
}, this._onBodyDragLeave = (e) => {
|
|
4713
4728
|
e.preventDefault(), this._bodyDragCounter--, this._bodyDragCounter <= 0 && (this._bodyDragCounter = 0, this._bodyDragOver = !1);
|
|
4714
4729
|
}, this._onBodyDrop = (e) => {
|
|
4715
|
-
var
|
|
4730
|
+
var o;
|
|
4716
4731
|
e.preventDefault(), this._bodyDragCounter = 0, this._bodyDragOver = !1;
|
|
4717
|
-
const t = Array.from(((
|
|
4732
|
+
const t = Array.from(((o = e.dataTransfer) == null ? void 0 : o.files) ?? []);
|
|
4718
4733
|
t.length > 0 && this._onFilesSelected(
|
|
4719
4734
|
new CustomEvent("files-selected", { detail: { files: t } })
|
|
4720
4735
|
);
|
|
4721
4736
|
}, this._onKeyDown = (e) => {
|
|
4722
|
-
var t,
|
|
4737
|
+
var t, o;
|
|
4723
4738
|
if (e.key === "Escape") {
|
|
4724
4739
|
if (this._fullscreenPreviewUrl || this._fullscreenVideoFile) {
|
|
4725
4740
|
this._onFsClose();
|
|
4726
4741
|
return;
|
|
4727
4742
|
}
|
|
4728
|
-
this._isOpen && ((t = this.config) == null ? void 0 : t.mode) === "modal" && (((
|
|
4743
|
+
this._isOpen && ((t = this.config) == null ? void 0 : t.mode) === "modal" && (((o = this.config) == null ? void 0 : o.headerButton) ?? "close") !== "none" && this._onModalDismiss();
|
|
4729
4744
|
}
|
|
4730
4745
|
}, this._dimCache = /* @__PURE__ */ new Map(), this._onSplitPointerDown = (e) => {
|
|
4731
|
-
var
|
|
4746
|
+
var o;
|
|
4732
4747
|
e.preventDefault(), this._isResizing = !0;
|
|
4733
|
-
const t = (
|
|
4748
|
+
const t = (o = this.shadowRoot) == null ? void 0 : o.querySelector(".preview-layout");
|
|
4734
4749
|
t == null || t.classList.add("resizing"), e.target.setPointerCapture(e.pointerId);
|
|
4735
4750
|
}, this._onSplitPointerMove = (e) => {
|
|
4736
4751
|
if (!this._isResizing || this._splitRafId) return;
|
|
@@ -4738,10 +4753,10 @@ const k = (E = class extends U {
|
|
|
4738
4753
|
this._splitRafId = requestAnimationFrame(() => {
|
|
4739
4754
|
var s;
|
|
4740
4755
|
this._splitRafId = 0;
|
|
4741
|
-
const
|
|
4742
|
-
if (!
|
|
4743
|
-
const r =
|
|
4744
|
-
this._splitPct = Math.max(25, Math.min(75,
|
|
4756
|
+
const o = (s = this.shadowRoot) == null ? void 0 : s.querySelector(".preview-layout");
|
|
4757
|
+
if (!o) return;
|
|
4758
|
+
const r = o.getBoundingClientRect(), i = (t - r.left) / r.width * 100;
|
|
4759
|
+
this._splitPct = Math.max(25, Math.min(75, i));
|
|
4745
4760
|
});
|
|
4746
4761
|
}, this._onSplitPointerUp = () => {
|
|
4747
4762
|
var t;
|
|
@@ -4756,8 +4771,8 @@ const k = (E = class extends U {
|
|
|
4756
4771
|
this._fullscreenZoomed && (this._fsDragging = !0, this._fsDragDidMove = !1, this._fsDragStartX = e.clientX, this._fsDragStartY = e.clientY, this._fsPanStartX = this._fsPanX, this._fsPanStartY = this._fsPanY, e.preventDefault());
|
|
4757
4772
|
}, this._onFsPanMove = (e) => {
|
|
4758
4773
|
if (!this._fsDragging) return;
|
|
4759
|
-
const t = e.clientX - this._fsDragStartX,
|
|
4760
|
-
(Math.abs(t) > 3 || Math.abs(
|
|
4774
|
+
const t = e.clientX - this._fsDragStartX, o = e.clientY - this._fsDragStartY;
|
|
4775
|
+
(Math.abs(t) > 3 || Math.abs(o) > 3) && (this._fsDragDidMove = !0), this._fsPanX = this._fsPanStartX + t, this._fsPanY = this._fsPanStartY + o, this.requestUpdate();
|
|
4761
4776
|
}, this._onFsPanEnd = () => {
|
|
4762
4777
|
this._fsDragging = !1, requestAnimationFrame(() => {
|
|
4763
4778
|
this._fsDragDidMove = !1;
|
|
@@ -4768,26 +4783,26 @@ const k = (E = class extends U {
|
|
|
4768
4783
|
this._fsDragging = !0, this._fsDragDidMove = !1, this._fsDragStartX = t.clientX, this._fsDragStartY = t.clientY, this._fsPanStartX = this._fsPanX, this._fsPanStartY = this._fsPanY;
|
|
4769
4784
|
}, this._onFsTouchMove = (e) => {
|
|
4770
4785
|
if (!this._fsDragging || e.touches.length !== 1) return;
|
|
4771
|
-
const t = e.touches[0],
|
|
4772
|
-
(Math.abs(
|
|
4786
|
+
const t = e.touches[0], o = t.clientX - this._fsDragStartX, r = t.clientY - this._fsDragStartY;
|
|
4787
|
+
(Math.abs(o) > 3 || Math.abs(r) > 3) && (this._fsDragDidMove = !0), this._fsPanX = this._fsPanStartX + o, this._fsPanY = this._fsPanStartY + r, this.requestUpdate(), e.preventDefault();
|
|
4773
4788
|
}, this._onFsClose = (e) => {
|
|
4774
4789
|
e == null || e.stopPropagation(), this._fullscreenPreviewUrl = null, this._fullscreenVideoFile = null, this._fullscreenZoomed = !1, this._fsPanX = 0, this._fsPanY = 0;
|
|
4775
|
-
}, this._store =
|
|
4790
|
+
}, this._store = Te(), this._storeCtrl = new Be(this, this._store);
|
|
4776
4791
|
}
|
|
4777
4792
|
// --- Public API ---
|
|
4778
4793
|
/** Open the uploader (modal mode). */
|
|
4779
4794
|
open() {
|
|
4780
|
-
var e, t,
|
|
4781
|
-
this._isMinimized && (this._isMinimized = !1, this._isPillExpanded = !1), !this._isOpen && (this._isOpen = !0, (
|
|
4795
|
+
var e, t, o;
|
|
4796
|
+
this._isMinimized && (this._isMinimized = !1, this._isPillExpanded = !1), !this._isOpen && (this._isOpen = !0, (o = (t = (e = this.config) == null ? void 0 : e.callbacks) == null ? void 0 : t.onOpen) == null || o.call(t), this._dispatchPublic(v.OPEN, {}), this.requestUpdate());
|
|
4782
4797
|
}
|
|
4783
4798
|
/** Close the uploader (modal mode). Optionally clears all files (controlled by clearOnClose config). */
|
|
4784
4799
|
close() {
|
|
4785
|
-
var e, t,
|
|
4786
|
-
this._isOpen && (this._isOpen = !1, this._closeOnCompleteTimer && (clearTimeout(this._closeOnCompleteTimer), this._closeOnCompleteTimer = null), ((e = this.config) == null ? void 0 : e.clearOnClose) !== !1 && this._onClearAll(), this._previewFileId = null, (r = (
|
|
4800
|
+
var e, t, o, r;
|
|
4801
|
+
this._isOpen && (this._isOpen = !1, this._closeOnCompleteTimer && (clearTimeout(this._closeOnCompleteTimer), this._closeOnCompleteTimer = null), ((e = this.config) == null ? void 0 : e.clearOnClose) !== !1 && this._onClearAll(), this._previewFileId = null, (r = (o = (t = this.config) == null ? void 0 : t.callbacks) == null ? void 0 : o.onClose) == null || r.call(o), this._dispatchPublic(v.CLOSE, {}), this.requestUpdate());
|
|
4787
4802
|
}
|
|
4788
4803
|
/** Start uploading all queued files. */
|
|
4789
4804
|
upload() {
|
|
4790
|
-
var r,
|
|
4805
|
+
var r, i, s, n, d, p, h;
|
|
4791
4806
|
if (this._ensureEngine(), !this._engine) {
|
|
4792
4807
|
console.warn("[sfx-uploader] Cannot upload: auth not resolved yet");
|
|
4793
4808
|
return;
|
|
@@ -4795,7 +4810,7 @@ const k = (E = class extends U {
|
|
|
4795
4810
|
const e = [...this._store.getState().files.values()].filter(
|
|
4796
4811
|
(u) => u.status === "idle" || u.status === "queued"
|
|
4797
4812
|
);
|
|
4798
|
-
if ((
|
|
4813
|
+
if ((i = (r = this.config) == null ? void 0 : r.callbacks) != null && i.onBeforeUpload && this.config.callbacks.onBeforeUpload(e) === !1)
|
|
4799
4814
|
return;
|
|
4800
4815
|
const t = new CustomEvent(v.BEFORE_UPLOAD, {
|
|
4801
4816
|
bubbles: !0,
|
|
@@ -4813,13 +4828,13 @@ const k = (E = class extends U {
|
|
|
4813
4828
|
resumeUpload(e) {
|
|
4814
4829
|
var t;
|
|
4815
4830
|
if (e && e.length > 0) {
|
|
4816
|
-
const
|
|
4817
|
-
let
|
|
4831
|
+
const o = this._store.getState().files, r = new Map(o);
|
|
4832
|
+
let i = !1;
|
|
4818
4833
|
for (const s of e) {
|
|
4819
|
-
const n =
|
|
4820
|
-
n && (r.set(s.id, { ...n, ...s }),
|
|
4834
|
+
const n = o.get(s.id);
|
|
4835
|
+
n && (r.set(s.id, { ...n, ...s }), i = !0);
|
|
4821
4836
|
}
|
|
4822
|
-
|
|
4837
|
+
i && this._store.setState({ files: r });
|
|
4823
4838
|
}
|
|
4824
4839
|
this._ensureEngine(), (t = this._engine) == null || t.uploadAll();
|
|
4825
4840
|
}
|
|
@@ -4837,35 +4852,35 @@ const k = (E = class extends U {
|
|
|
4837
4852
|
return this._store.getState().files.get(e);
|
|
4838
4853
|
}
|
|
4839
4854
|
/** Update metadata and/or tags for a single file. */
|
|
4840
|
-
updateFileMeta(e, t,
|
|
4841
|
-
const r = this._store.getState().files,
|
|
4842
|
-
if (!
|
|
4855
|
+
updateFileMeta(e, t, o) {
|
|
4856
|
+
const r = this._store.getState().files, i = r.get(e);
|
|
4857
|
+
if (!i || !E._MODIFIABLE_STATUSES.has(i.status)) return;
|
|
4843
4858
|
const s = new Map(r);
|
|
4844
4859
|
s.set(e, {
|
|
4845
|
-
...
|
|
4846
|
-
meta: t != null ? { ...
|
|
4847
|
-
tags:
|
|
4860
|
+
...i,
|
|
4861
|
+
meta: t != null ? { ...i.meta, ...t } : i.meta,
|
|
4862
|
+
tags: o ?? i.tags
|
|
4848
4863
|
}), this._store.setState({ files: s });
|
|
4849
4864
|
}
|
|
4850
4865
|
/** Batch-update metadata and/or tags for multiple files. */
|
|
4851
4866
|
updateFilesMeta(e) {
|
|
4852
|
-
const t = this._store.getState().files,
|
|
4867
|
+
const t = this._store.getState().files, o = new Map(t);
|
|
4853
4868
|
let r = !1;
|
|
4854
|
-
for (const { fileId:
|
|
4855
|
-
const d = t.get(
|
|
4856
|
-
!d || !E._MODIFIABLE_STATUSES.has(d.status) || (
|
|
4869
|
+
for (const { fileId: i, meta: s, tags: n } of e) {
|
|
4870
|
+
const d = t.get(i);
|
|
4871
|
+
!d || !E._MODIFIABLE_STATUSES.has(d.status) || (o.set(i, {
|
|
4857
4872
|
...d,
|
|
4858
4873
|
meta: s != null ? { ...d.meta, ...s } : d.meta,
|
|
4859
4874
|
tags: n ?? d.tags
|
|
4860
4875
|
}), r = !0);
|
|
4861
4876
|
}
|
|
4862
|
-
r && this._store.setState({ files:
|
|
4877
|
+
r && this._store.setState({ files: o });
|
|
4863
4878
|
}
|
|
4864
4879
|
// --- Lifecycle ---
|
|
4865
4880
|
updated(e) {
|
|
4866
4881
|
if (e.has("config") && this.config && this._applyConfig(this.config), e.has("_previewFileId") && this._previewFileId) {
|
|
4867
|
-
const t = this._previewFileId,
|
|
4868
|
-
|
|
4882
|
+
const t = this._previewFileId, o = this._store.getState().files.get(t);
|
|
4883
|
+
o ? this._getImageDimensions(o).then((r) => {
|
|
4869
4884
|
this._previewFileId === t && (this._previewDims = r ? `${r.w} × ${r.h}` : "—");
|
|
4870
4885
|
}) : this._previewDims = "—";
|
|
4871
4886
|
}
|
|
@@ -4946,12 +4961,12 @@ const k = (E = class extends U {
|
|
|
4946
4961
|
super.connectedCallback(), document.addEventListener("keydown", this._onKeyDown), this._prevStoreState = this._store.getState(), this._unsubStoreEvents = this._store.subscribe(() => this._onStoreChange());
|
|
4947
4962
|
}
|
|
4948
4963
|
disconnectedCallback() {
|
|
4949
|
-
var e, t,
|
|
4950
|
-
super.disconnectedCallback(), document.removeEventListener("keydown", this._onKeyDown), (e = this._unsubStoreEvents) == null || e.call(this), this._unsubStoreEvents = null, this._prevStoreState = null, (t = this._portalContainer) == null || t.remove(), this._portalContainer = null, document.querySelector("[data-sfx-upload-float]") || (
|
|
4951
|
-
for (const
|
|
4964
|
+
var e, t, o, r;
|
|
4965
|
+
super.disconnectedCallback(), document.removeEventListener("keydown", this._onKeyDown), (e = this._unsubStoreEvents) == null || e.call(this), this._unsubStoreEvents = null, this._prevStoreState = null, (t = this._portalContainer) == null || t.remove(), this._portalContainer = null, document.querySelector("[data-sfx-upload-float]") || (o = document.querySelector("style[data-sfx-upload-float-styles]")) == null || o.remove(), this._revokeVideoBlobUrls();
|
|
4966
|
+
for (const i of this._rejectedTimers.values()) clearTimeout(i);
|
|
4952
4967
|
this._rejectedTimers.clear(), this._closeOnCompleteTimer && (clearTimeout(this._closeOnCompleteTimer), this._closeOnCompleteTimer = null);
|
|
4953
|
-
for (const
|
|
4954
|
-
|
|
4968
|
+
for (const i of this._store.getState().files.values())
|
|
4969
|
+
i.previewUrl && URL.revokeObjectURL(i.previewUrl);
|
|
4955
4970
|
(r = this._engine) == null || r.destroy(), this._engine = null;
|
|
4956
4971
|
}
|
|
4957
4972
|
// --- Config ---
|
|
@@ -4961,40 +4976,40 @@ const k = (E = class extends U {
|
|
|
4961
4976
|
...this._store.getState().restrictions,
|
|
4962
4977
|
...e.restrictions
|
|
4963
4978
|
}), e.concurrency != null) {
|
|
4964
|
-
const
|
|
4965
|
-
t.queueConfig = { ...
|
|
4979
|
+
const o = this._store.getState().queueConfig;
|
|
4980
|
+
t.queueConfig = { ...o, concurrency: e.concurrency };
|
|
4966
4981
|
}
|
|
4967
4982
|
if (e.autoProceed != null) {
|
|
4968
|
-
const
|
|
4969
|
-
t.queueConfig = { ...
|
|
4983
|
+
const o = t.queueConfig ?? this._store.getState().queueConfig;
|
|
4984
|
+
t.queueConfig = { ...o, autoProceed: e.autoProceed };
|
|
4970
4985
|
}
|
|
4971
4986
|
Object.keys(t).length > 0 && this._store.setState(t), this._resolveAuthAndEngine(e), (e.mode === "inline" || !e.mode) && (this._isOpen = !0);
|
|
4972
4987
|
}
|
|
4973
4988
|
async _resolveAuthAndEngine(e) {
|
|
4974
|
-
var r,
|
|
4989
|
+
var r, i;
|
|
4975
4990
|
const t = e.auth;
|
|
4976
4991
|
if (t.mode === "sass-key") {
|
|
4977
|
-
this._apiBase =
|
|
4992
|
+
this._apiBase = fe(t.container), this._authHeaders = se(t), this._ensureEngine(), (r = this._engine) == null || r.updateConfig({
|
|
4978
4993
|
apiBase: this._apiBase,
|
|
4979
4994
|
authHeaders: this._authHeaders
|
|
4980
4995
|
});
|
|
4981
4996
|
return;
|
|
4982
4997
|
}
|
|
4983
|
-
const
|
|
4998
|
+
const o = ++this._authResolveId;
|
|
4984
4999
|
try {
|
|
4985
|
-
const s = await
|
|
4986
|
-
if (
|
|
4987
|
-
this._apiBase = s.apiBase, this._authHeaders = s.headers, this._ensureEngine(), (
|
|
5000
|
+
const s = await Xe(t);
|
|
5001
|
+
if (o !== this._authResolveId) return;
|
|
5002
|
+
this._apiBase = s.apiBase, this._authHeaders = s.headers, this._ensureEngine(), (i = this._engine) == null || i.updateConfig({
|
|
4988
5003
|
apiBase: this._apiBase,
|
|
4989
5004
|
authHeaders: this._authHeaders
|
|
4990
5005
|
});
|
|
4991
5006
|
} catch (s) {
|
|
4992
|
-
if (
|
|
5007
|
+
if (o !== this._authResolveId) return;
|
|
4993
5008
|
console.error("[sfx-uploader] Auth resolution failed:", s);
|
|
4994
5009
|
}
|
|
4995
5010
|
}
|
|
4996
5011
|
_ensureEngine() {
|
|
4997
|
-
!this._engine && this._apiBase && this._authHeaders && (this._engine = new
|
|
5012
|
+
!this._engine && this._apiBase && this._authHeaders && (this._engine = new Ve(this._store, {
|
|
4998
5013
|
apiBase: this._apiBase,
|
|
4999
5014
|
authHeaders: this._authHeaders
|
|
5000
5015
|
}), this._engine.start());
|
|
@@ -5010,10 +5025,10 @@ const k = (E = class extends U {
|
|
|
5010
5025
|
* for file status transitions.
|
|
5011
5026
|
*/
|
|
5012
5027
|
_onStoreChange() {
|
|
5013
|
-
var r,
|
|
5028
|
+
var r, i, s, n, d, p, h, u;
|
|
5014
5029
|
const e = this._store.getState(), t = this._prevStoreState;
|
|
5015
5030
|
if (this._prevStoreState = e, !t) return;
|
|
5016
|
-
const
|
|
5031
|
+
const o = (r = this.config) == null ? void 0 : r.callbacks;
|
|
5017
5032
|
for (const [x, f] of e.files) {
|
|
5018
5033
|
const m = t.files.get(x);
|
|
5019
5034
|
if (m) {
|
|
@@ -5022,19 +5037,19 @@ const k = (E = class extends U {
|
|
|
5022
5037
|
case "uploading":
|
|
5023
5038
|
break;
|
|
5024
5039
|
case "complete":
|
|
5025
|
-
f.response && (this._dispatchPublic(v.UPLOAD_COMPLETE, { file: f, response: f.response }), (
|
|
5040
|
+
f.response && (this._dispatchPublic(v.UPLOAD_COMPLETE, { file: f, response: f.response }), (i = o == null ? void 0 : o.onUploadComplete) == null || i.call(o, f, f.response));
|
|
5026
5041
|
break;
|
|
5027
5042
|
case "error":
|
|
5028
5043
|
case "failed": {
|
|
5029
5044
|
const _ = new Error(f.error ?? "Upload failed");
|
|
5030
|
-
this._dispatchPublic(v.UPLOAD_ERROR, { file: f, error: _ }), (s =
|
|
5045
|
+
this._dispatchPublic(v.UPLOAD_ERROR, { file: f, error: _ }), (s = o == null ? void 0 : o.onUploadError) == null || s.call(o, f, _);
|
|
5031
5046
|
break;
|
|
5032
5047
|
}
|
|
5033
5048
|
case "retrying":
|
|
5034
|
-
this._dispatchPublic(v.UPLOAD_RETRY, { file: f, attempt: f.retryCount }), (n =
|
|
5049
|
+
this._dispatchPublic(v.UPLOAD_RETRY, { file: f, attempt: f.retryCount }), (n = o == null ? void 0 : o.onUploadRetry) == null || n.call(o, f, f.retryCount);
|
|
5035
5050
|
break;
|
|
5036
5051
|
}
|
|
5037
|
-
f.status === "uploading" && m.progress !== f.progress && (this._dispatchPublic(v.UPLOAD_PROGRESS, { file: f, progress: f.progress, speed: f.speed }), (d =
|
|
5052
|
+
f.status === "uploading" && m.progress !== f.progress && (this._dispatchPublic(v.UPLOAD_PROGRESS, { file: f, progress: f.progress, speed: f.speed }), (d = o == null ? void 0 : o.onUploadProgress) == null || d.call(o, f, f.progress, f.speed));
|
|
5038
5053
|
}
|
|
5039
5054
|
}
|
|
5040
5055
|
if (e.totalProgress !== t.totalProgress || e.totalSpeed !== t.totalSpeed) {
|
|
@@ -5043,19 +5058,19 @@ const k = (E = class extends U {
|
|
|
5043
5058
|
percentage: e.totalProgress,
|
|
5044
5059
|
speed: e.totalSpeed,
|
|
5045
5060
|
eta: x
|
|
5046
|
-
}), (p =
|
|
5061
|
+
}), (p = o == null ? void 0 : o.onTotalProgress) == null || p.call(o, e.totalProgress, e.totalSpeed, x);
|
|
5047
5062
|
}
|
|
5048
5063
|
if (t.isUploading && !e.isUploading) {
|
|
5049
5064
|
const x = [...e.files.values()];
|
|
5050
5065
|
if (!x.some((m) => m.status === "cancelled")) {
|
|
5051
5066
|
const m = x.filter((y) => y.status === "complete"), _ = x.filter((y) => y.status === "failed" || y.status === "error");
|
|
5052
|
-
this._dispatchPublic(v.ALL_COMPLETE, { successful: m, failed: _ }), (h =
|
|
5067
|
+
this._dispatchPublic(v.ALL_COMPLETE, { successful: m, failed: _ }), (h = o == null ? void 0 : o.onAllComplete) == null || h.call(o, m, _);
|
|
5053
5068
|
const w = (u = this.config) == null ? void 0 : u.closeOnComplete;
|
|
5054
5069
|
if (w) {
|
|
5055
5070
|
const y = typeof w == "number" ? w : 1500;
|
|
5056
5071
|
this._closeOnCompleteTimer = setTimeout(() => {
|
|
5057
|
-
var C, D,
|
|
5058
|
-
this._closeOnCompleteTimer = null, this._phase === "complete" && (this._dispatchPublic(v.COMPLETE_ACTION, {}), (
|
|
5072
|
+
var C, D, $e;
|
|
5073
|
+
this._closeOnCompleteTimer = null, this._phase === "complete" && (this._dispatchPublic(v.COMPLETE_ACTION, {}), ($e = (D = (C = this.config) == null ? void 0 : C.callbacks) == null ? void 0 : D.onCompleteAction) == null || $e.call(D), this.close());
|
|
5059
5074
|
}, y);
|
|
5060
5075
|
}
|
|
5061
5076
|
}
|
|
@@ -5067,8 +5082,8 @@ const k = (E = class extends U {
|
|
|
5067
5082
|
if (e === this._cachedSourcesConfig) return this._cachedSources;
|
|
5068
5083
|
if (this._cachedSourcesConfig = e, !e)
|
|
5069
5084
|
return this._cachedSources = W, this._cachedSources;
|
|
5070
|
-
const t = e.providers.length > 0 ?
|
|
5071
|
-
for (const p of [...r, ...t, ...
|
|
5085
|
+
const t = e.providers.length > 0 ? et(e.providers) : [], o = e.customSources ?? [], r = W.filter((p) => p.id === "device" || p.id === "url"), i = W.filter((p) => p.id !== "device" && p.id !== "url"), s = /* @__PURE__ */ new Set(), n = [];
|
|
5086
|
+
for (const p of [...r, ...t, ...i, ...o])
|
|
5072
5087
|
if (!s.has(p.id)) {
|
|
5073
5088
|
if (E._RESERVED_IDS.has(p.id) && p.onActivate) {
|
|
5074
5089
|
console.warn(`[sfx-uploader] Custom source id "${p.id}" conflicts with a built-in source and was skipped.`);
|
|
@@ -5083,15 +5098,15 @@ const k = (E = class extends U {
|
|
|
5083
5098
|
const e = this._storeCtrl.state, t = [...e.files.values()];
|
|
5084
5099
|
if (t.length === 0) return "empty";
|
|
5085
5100
|
if (e.isUploading) return "uploading";
|
|
5086
|
-
const
|
|
5087
|
-
return t.every((r) =>
|
|
5101
|
+
const o = /* @__PURE__ */ new Set(["complete", "rejected", "cancelled", "failed"]);
|
|
5102
|
+
return t.every((r) => o.has(r.status)) && t.some((r) => r.status === "complete" || r.status === "failed") ? "complete" : "ready";
|
|
5088
5103
|
}
|
|
5089
5104
|
// --- File handling ---
|
|
5090
5105
|
_processIncomingFiles(e) {
|
|
5091
|
-
var
|
|
5092
|
-
const t = (
|
|
5106
|
+
var o, r, i, s;
|
|
5107
|
+
const t = (o = this.config) == null ? void 0 : o.callbacks;
|
|
5093
5108
|
for (const n of e) {
|
|
5094
|
-
const d = this._store.getState(), p =
|
|
5109
|
+
const d = this._store.getState(), p = Qe(n, d.restrictions, d.files);
|
|
5095
5110
|
if (p) {
|
|
5096
5111
|
const x = n.type.startsWith("image/") ? URL.createObjectURL(n) : null, f = {
|
|
5097
5112
|
id: q(),
|
|
@@ -5115,12 +5130,12 @@ const k = (E = class extends U {
|
|
|
5115
5130
|
remoteInfo: null
|
|
5116
5131
|
};
|
|
5117
5132
|
H(this._store, f), this._dispatchPublic(v.FILE_REJECTED, { file: f, reason: p }), (r = t == null ? void 0 : t.onFileRejected) == null || r.call(t, f, p);
|
|
5118
|
-
const m = (
|
|
5133
|
+
const m = (i = this.config) == null ? void 0 : i.rejectedFileAutoRemoveDelay, _ = m === !1 || m === 0 || m === void 0 ? 0 : m;
|
|
5119
5134
|
if (_ > 0) {
|
|
5120
5135
|
const w = f.id, y = setTimeout(() => {
|
|
5121
5136
|
this._rejectedTimers.delete(w);
|
|
5122
5137
|
const C = this._store.getState().files.get(w);
|
|
5123
|
-
C && C.status === "rejected" &&
|
|
5138
|
+
C && C.status === "rejected" && Se(this._store, w);
|
|
5124
5139
|
}, _);
|
|
5125
5140
|
this._rejectedTimers.set(w, y);
|
|
5126
5141
|
}
|
|
@@ -5150,7 +5165,7 @@ const k = (E = class extends U {
|
|
|
5150
5165
|
remoteInfo: null
|
|
5151
5166
|
};
|
|
5152
5167
|
if (H(this._store, u), this._dispatchPublic(v.FILE_ADDED, { file: u }), (s = t == null ? void 0 : t.onFileAdded) == null || s.call(t, u), n.type.startsWith("video/")) {
|
|
5153
|
-
|
|
5168
|
+
Je(n).then((f) => {
|
|
5154
5169
|
if (!f) return;
|
|
5155
5170
|
const m = this._store.getState(), _ = m.files.get(u.id);
|
|
5156
5171
|
if (_) {
|
|
@@ -5176,21 +5191,21 @@ const k = (E = class extends U {
|
|
|
5176
5191
|
this._store.getState().queueConfig.autoProceed && this.upload();
|
|
5177
5192
|
}
|
|
5178
5193
|
_removeFile(e) {
|
|
5179
|
-
var
|
|
5194
|
+
var i, s, n, d;
|
|
5180
5195
|
const t = this._store.getState().files.get(e);
|
|
5181
5196
|
if (!t) return;
|
|
5182
|
-
const
|
|
5197
|
+
const o = { ...t };
|
|
5183
5198
|
if ((this._fullscreenPreviewUrl && this._fullscreenPreviewUrl === t.previewUrl || this._fullscreenVideoFile && this._fullscreenVideoFile === t.file) && (this._fullscreenPreviewUrl = null, this._fullscreenVideoFile = null), t.previewUrl && URL.revokeObjectURL(t.previewUrl), t.file) {
|
|
5184
5199
|
const p = this._videoBlobUrls.get(t.file);
|
|
5185
5200
|
p && (URL.revokeObjectURL(p), this._videoBlobUrls.delete(t.file));
|
|
5186
5201
|
}
|
|
5187
|
-
(t.status === "uploading" || t.status === "queued" || t.status === "retrying") && ((
|
|
5202
|
+
(t.status === "uploading" || t.status === "queued" || t.status === "retrying") && ((i = this._engine) == null || i.cancelFile(e)), Se(this._store, e), this._dimCache.delete(e);
|
|
5188
5203
|
const r = this._rejectedTimers.get(e);
|
|
5189
5204
|
if (r && (clearTimeout(r), this._rejectedTimers.delete(e)), this._previewFileId === e) {
|
|
5190
5205
|
const p = [...this._store.getState().files.values()];
|
|
5191
5206
|
this._previewFileId = p.length > 0 ? p[0].id : null;
|
|
5192
5207
|
}
|
|
5193
|
-
this._dispatchPublic(v.FILE_REMOVED, { file:
|
|
5208
|
+
this._dispatchPublic(v.FILE_REMOVED, { file: o }), (d = (n = (s = this.config) == null ? void 0 : s.callbacks) == null ? void 0 : n.onFileRemoved) == null || d.call(n, o);
|
|
5194
5209
|
}
|
|
5195
5210
|
// --- Render ---
|
|
5196
5211
|
render() {
|
|
@@ -5225,17 +5240,17 @@ const k = (E = class extends U {
|
|
|
5225
5240
|
</div>
|
|
5226
5241
|
<div>
|
|
5227
5242
|
<div class="float-title">Uploading ${p.length} ${p.length === 1 ? "file" : "files"}</div>
|
|
5228
|
-
<div class="float-subtitle">${h} of ${p.length}${u > 0 ? ` · ~${
|
|
5243
|
+
<div class="float-subtitle">${h} of ${p.length}${u > 0 ? ` · ~${ie(u)} left` : ""}</div>
|
|
5229
5244
|
</div>
|
|
5230
5245
|
</div>
|
|
5231
5246
|
</div>
|
|
5232
5247
|
`;
|
|
5233
5248
|
}
|
|
5234
|
-
const e = ((s = this.config) == null ? void 0 : s.mode) ?? "modal", t = ((n = this.config) == null ? void 0 : n.headerButton) ?? (e === "modal" ? "close" : "none"),
|
|
5249
|
+
const e = ((s = this.config) == null ? void 0 : s.mode) ?? "modal", t = ((n = this.config) == null ? void 0 : n.headerButton) ?? (e === "modal" ? "close" : "none"), o = e === "modal" ? this._onModalDismiss : this._onInlineDismiss, r = t === "back" ? l`<button class="header-btn header-btn-back" aria-label="Back to Asset Picker" @click=${o}>
|
|
5235
5250
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
5236
5251
|
<polyline points="15 18 9 12 15 6"/>
|
|
5237
5252
|
</svg>
|
|
5238
|
-
</button>` : c,
|
|
5253
|
+
</button>` : c, i = t === "close" ? l`<button class="header-btn header-btn-close" aria-label="Close" @click=${o}>
|
|
5239
5254
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round">
|
|
5240
5255
|
<line x1="18" y1="6" x2="6" y2="18" />
|
|
5241
5256
|
<line x1="6" y1="6" x2="18" y2="18" />
|
|
@@ -5253,45 +5268,45 @@ const k = (E = class extends U {
|
|
|
5253
5268
|
</svg>
|
|
5254
5269
|
</div>` : c}
|
|
5255
5270
|
<div class="header-title">Upload Files</div>
|
|
5256
|
-
${
|
|
5271
|
+
${i}
|
|
5257
5272
|
</div>
|
|
5258
5273
|
`;
|
|
5259
5274
|
}
|
|
5260
5275
|
_getImageDimensions(e) {
|
|
5261
5276
|
return e.previewUrl ? this._dimCache.has(e.id) ? Promise.resolve(this._dimCache.get(e.id)) : new Promise((t) => {
|
|
5262
|
-
const
|
|
5263
|
-
|
|
5264
|
-
const r = { w:
|
|
5277
|
+
const o = new Image();
|
|
5278
|
+
o.onload = () => {
|
|
5279
|
+
const r = { w: o.naturalWidth, h: o.naturalHeight };
|
|
5265
5280
|
this._dimCache.set(e.id, r), t(r);
|
|
5266
|
-
},
|
|
5281
|
+
}, o.onerror = () => {
|
|
5267
5282
|
this._dimCache.set(e.id, null), t(null);
|
|
5268
|
-
},
|
|
5283
|
+
}, o.src = e.previewUrl;
|
|
5269
5284
|
}) : Promise.resolve(null);
|
|
5270
5285
|
}
|
|
5271
5286
|
_renderUploadOverlay(e) {
|
|
5272
5287
|
var s;
|
|
5273
|
-
const t = this._storeCtrl.state,
|
|
5288
|
+
const t = this._storeCtrl.state, o = Math.round(t.totalProgress ?? 0), r = e.filter((n) => n.status === "complete").length, i = t.totalSpeed > 0 ? (t.totalBytes - t.totalBytesUploaded) / t.totalSpeed : 0;
|
|
5274
5289
|
return l`
|
|
5275
5290
|
<div class="upload-overlay">
|
|
5276
5291
|
<div class="upload-overlay-spinner"></div>
|
|
5277
|
-
<div class="upload-overlay-percent">${
|
|
5292
|
+
<div class="upload-overlay-percent">${o}%</div>
|
|
5278
5293
|
<div class="upload-overlay-title">Uploading ${e.length} ${e.length === 1 ? "file" : "files"}</div>
|
|
5279
|
-
<div class="upload-overlay-subtitle">${r} of ${e.length} complete${
|
|
5294
|
+
<div class="upload-overlay-subtitle">${r} of ${e.length} complete${i > 0 ? l` · ~${ie(i)} left` : c}</div>
|
|
5280
5295
|
<div class="upload-overlay-bar">
|
|
5281
|
-
<div class="upload-overlay-bar-fill" style="width:${
|
|
5296
|
+
<div class="upload-overlay-bar-fill" style="width:${o}%"></div>
|
|
5282
5297
|
</div>
|
|
5283
5298
|
${(s = this.config) != null && s.minimizeOnUpload ? l`<button class="upload-overlay-minimize" @click=${this._onMinimize}>Minimize & continue in background</button>` : c}
|
|
5284
5299
|
</div>
|
|
5285
5300
|
`;
|
|
5286
5301
|
}
|
|
5287
5302
|
_renderFloatingPill(e) {
|
|
5288
|
-
const t = this._storeCtrl.state,
|
|
5303
|
+
const t = this._storeCtrl.state, o = Math.round(t.totalProgress ?? 0), r = this._phase === "complete", i = e.filter((d) => d.status === "complete").length, s = e.filter((d) => d.status === "failed").length, n = t.totalSpeed > 0 ? (t.totalBytes - t.totalBytesUploaded) / t.totalSpeed : 0;
|
|
5289
5304
|
return this._isPillExpanded === !1 ? l`
|
|
5290
5305
|
<div class="upload-float float-collapsed">
|
|
5291
5306
|
<div class="float-collapsed-left">
|
|
5292
|
-
${r ? s > 0 ?
|
|
5293
|
-
<span class="float-collapsed-text">${r ? s > 0 ?
|
|
5294
|
-
${r ? c : l`<span class="float-collapsed-pct">${
|
|
5307
|
+
${r ? s > 0 ? i > 0 ? l`<div class="float-collapsed-icon warn"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M10.29 3.86L1.82 18a2 2 0 001.71 3h16.94a2 2 0 001.71-3L13.71 3.86a2 2 0 00-3.42 0z"/><line x1="12" y1="9" x2="12" y2="13"/><line x1="12" y1="17" x2="12.01" y2="17"/></svg></div>` : l`<div class="float-collapsed-icon error"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><line x1="12" y1="8" x2="12" y2="12"/><line x1="12" y1="16" x2="12.01" y2="16"/></svg></div>` : l`<div class="float-collapsed-icon done"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round"><polyline points="20 6 9 17 4 12"/></svg></div>` : l`<div class="float-collapsed-spinner"></div>`}
|
|
5308
|
+
<span class="float-collapsed-text">${r ? s > 0 ? i > 0 ? "Partially uploaded" : "Upload failed" : "Upload complete" : `Uploading ${e.length} ${e.length === 1 ? "file" : "files"}`}</span>
|
|
5309
|
+
${r ? c : l`<span class="float-collapsed-pct">${o}%</span>`}
|
|
5295
5310
|
</div>
|
|
5296
5311
|
<div class="float-collapsed-actions">
|
|
5297
5312
|
<button title="Open uploader" @click=${this._onPillExpand}>
|
|
@@ -5309,12 +5324,12 @@ const k = (E = class extends U {
|
|
|
5309
5324
|
<div class="upload-float">
|
|
5310
5325
|
<div class="float-header">
|
|
5311
5326
|
<div class="float-header-left">
|
|
5312
|
-
<div class="float-icon ${r ? s > 0 ?
|
|
5313
|
-
${r ? s > 0 ?
|
|
5327
|
+
<div class="float-icon ${r ? s > 0 ? i > 0 ? "warn" : "error" : "done" : ""}">
|
|
5328
|
+
${r ? s > 0 ? i > 0 ? l`<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M10.29 3.86L1.82 18a2 2 0 001.71 3h16.94a2 2 0 001.71-3L13.71 3.86a2 2 0 00-3.42 0z"/><line x1="12" y1="9" x2="12" y2="13"/><line x1="12" y1="17" x2="12.01" y2="17"/></svg>` : l`<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><line x1="12" y1="8" x2="12" y2="12"/><line x1="12" y1="16" x2="12.01" y2="16"/></svg>` : l`<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round"><polyline points="20 6 9 17 4 12"/></svg>` : l`<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round"><polyline points="16 16 12 12 8 16"/><line x1="12" y1="12" x2="12" y2="21"/><path d="M20.39 18.39A5 5 0 0018 9h-1.26A8 8 0 103 16.3"/></svg>`}
|
|
5314
5329
|
</div>
|
|
5315
5330
|
<div>
|
|
5316
|
-
<div class="float-title">${r ? s > 0 ?
|
|
5317
|
-
<div class="float-subtitle">${r ? `${
|
|
5331
|
+
<div class="float-title">${r ? s > 0 ? i > 0 ? "Partially uploaded" : "Upload failed" : "Upload complete" : `Uploading ${e.length} ${e.length === 1 ? "file" : "files"}`}</div>
|
|
5332
|
+
<div class="float-subtitle">${r ? `${i} ${i === 1 ? "file" : "files"} uploaded${s > 0 ? `, ${s} failed` : ""}` : `${i} of ${e.length}${n > 0 ? ` · ~${ie(n)} left` : ""}`}</div>
|
|
5318
5333
|
</div>
|
|
5319
5334
|
</div>
|
|
5320
5335
|
<div class="float-actions">
|
|
@@ -5332,9 +5347,9 @@ const k = (E = class extends U {
|
|
|
5332
5347
|
<div class="float-progress">
|
|
5333
5348
|
<div class="float-progress-top">
|
|
5334
5349
|
<span class="float-progress-label">Overall progress</span>
|
|
5335
|
-
<span class="float-progress-pct ${r ? s > 0 ?
|
|
5350
|
+
<span class="float-progress-pct ${r ? s > 0 ? i > 0 ? "warn" : "error" : "done" : ""}">${r ? "Done" : `${o}%`}</span>
|
|
5336
5351
|
</div>
|
|
5337
|
-
<div class="float-bar"><div class="float-bar-fill ${r ? s > 0 ?
|
|
5352
|
+
<div class="float-bar"><div class="float-bar-fill ${r ? s > 0 ? i > 0 ? "warn" : "error" : "done" : ""}" style="width:${r ? 100 : o}%"></div></div>
|
|
5338
5353
|
</div>
|
|
5339
5354
|
<div class="float-items">
|
|
5340
5355
|
${e.map((d) => {
|
|
@@ -5371,7 +5386,7 @@ const k = (E = class extends U {
|
|
|
5371
5386
|
_renderPreviewLayout(e) {
|
|
5372
5387
|
var n;
|
|
5373
5388
|
if (e.length === 0) return c;
|
|
5374
|
-
const t = e.find((d) => d.id === this._previewFileId) ?? e[0],
|
|
5389
|
+
const t = e.find((d) => d.id === this._previewFileId) ?? e[0], o = ((n = t.name.split(".").pop()) == null ? void 0 : n.toUpperCase()) || "", r = new Date(t.addedAt).toLocaleDateString("en-US", { month: "short", day: "numeric", year: "numeric" }), i = this._store.getState().targetFolder, s = e.reduce((d, p) => d + (p.size || 0), 0);
|
|
5375
5390
|
return l`
|
|
5376
5391
|
<div class="preview-topbar"></div>
|
|
5377
5392
|
<div class="preview-layout">
|
|
@@ -5383,7 +5398,7 @@ const k = (E = class extends U {
|
|
|
5383
5398
|
.files=${e}
|
|
5384
5399
|
.showDropTile=${!0}
|
|
5385
5400
|
.sources=${this._mergedSources}
|
|
5386
|
-
.accept=${
|
|
5401
|
+
.accept=${ze(this._storeCtrl.state.restrictions)}
|
|
5387
5402
|
@source-click=${this._onDropTileSourceClick}
|
|
5388
5403
|
></sfx-file-list>
|
|
5389
5404
|
</div>
|
|
@@ -5443,7 +5458,7 @@ const k = (E = class extends U {
|
|
|
5443
5458
|
<div class="preview-doc-wrap ${X(t)}">
|
|
5444
5459
|
<div class="preview-doc-icon ${X(t)}">
|
|
5445
5460
|
${this._renderDocTypeIcon(X(t))}
|
|
5446
|
-
<span class="preview-doc-ext ${X(t)}">${
|
|
5461
|
+
<span class="preview-doc-ext ${X(t)}">${o}</span>
|
|
5447
5462
|
</div>
|
|
5448
5463
|
<button class="preview-nav prev" ?disabled=${e.indexOf(t) === 0} @click=${() => this._navigatePreview(e, -1)}>
|
|
5449
5464
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round"><polyline points="15 18 9 12 15 6"/></svg>
|
|
@@ -5456,7 +5471,7 @@ const k = (E = class extends U {
|
|
|
5456
5471
|
<div class="preview-meta-list">
|
|
5457
5472
|
<div class="preview-meta-row">
|
|
5458
5473
|
<span class="preview-meta-label">Type</span>
|
|
5459
|
-
<span class="preview-meta-value">${
|
|
5474
|
+
<span class="preview-meta-value">${o}</span>
|
|
5460
5475
|
</div>
|
|
5461
5476
|
<div class="preview-meta-row">
|
|
5462
5477
|
<span class="preview-meta-label">Size</span>
|
|
@@ -5470,10 +5485,10 @@ const k = (E = class extends U {
|
|
|
5470
5485
|
<span class="preview-meta-label">Name</span>
|
|
5471
5486
|
<span class="preview-meta-value truncate" title=${t.name}>${t.name}</span>
|
|
5472
5487
|
</div>
|
|
5473
|
-
${
|
|
5488
|
+
${i ? l`
|
|
5474
5489
|
<div class="preview-meta-row">
|
|
5475
5490
|
<span class="preview-meta-label">Folder</span>
|
|
5476
|
-
<span class="preview-meta-value">${
|
|
5491
|
+
<span class="preview-meta-value">${i}</span>
|
|
5477
5492
|
</div>` : l`
|
|
5478
5493
|
<div class="preview-meta-row">
|
|
5479
5494
|
<span class="preview-meta-label">Added</span>
|
|
@@ -5499,16 +5514,16 @@ const k = (E = class extends U {
|
|
|
5499
5514
|
}
|
|
5500
5515
|
}
|
|
5501
5516
|
_navigatePreview(e, t) {
|
|
5502
|
-
var
|
|
5517
|
+
var i;
|
|
5503
5518
|
const r = e.findIndex((s) => s.id === this._previewFileId) + t;
|
|
5504
5519
|
if (r >= 0 && r < e.length) {
|
|
5505
|
-
const s = (
|
|
5520
|
+
const s = (i = this.shadowRoot) == null ? void 0 : i.querySelector(".preview-image[controls]");
|
|
5506
5521
|
s && (s.pause(), s.removeAttribute("src"), s.load()), this._previewFileId = e[r].id;
|
|
5507
5522
|
}
|
|
5508
5523
|
}
|
|
5509
5524
|
_renderBody() {
|
|
5510
5525
|
var s, n, d;
|
|
5511
|
-
const e = this._storeCtrl.state, t = [...e.files.values()],
|
|
5526
|
+
const e = this._storeCtrl.state, t = [...e.files.values()], o = this._phase, r = ze(e.restrictions), i = t.length > 0;
|
|
5512
5527
|
return l`
|
|
5513
5528
|
<div class="content"
|
|
5514
5529
|
@files-selected=${this._onFilesSelected}
|
|
@@ -5533,13 +5548,13 @@ const k = (E = class extends U {
|
|
|
5533
5548
|
@screencast-cancel=${this._onScreenCastCancel}
|
|
5534
5549
|
>
|
|
5535
5550
|
<div
|
|
5536
|
-
class="body ${
|
|
5537
|
-
@dragenter=${
|
|
5538
|
-
@dragover=${
|
|
5539
|
-
@dragleave=${
|
|
5540
|
-
@drop=${
|
|
5551
|
+
class="body ${i ? "has-files" : ""} ${this._bodyDragOver ? "body-drag-over" : ""}"
|
|
5552
|
+
@dragenter=${i ? this._onBodyDragEnter : c}
|
|
5553
|
+
@dragover=${i ? this._onBodyDragOver : c}
|
|
5554
|
+
@dragleave=${i ? this._onBodyDragLeave : c}
|
|
5555
|
+
@drop=${i ? this._onBodyDrop : c}
|
|
5541
5556
|
>
|
|
5542
|
-
${
|
|
5557
|
+
${o === "complete" ? l`
|
|
5543
5558
|
<sfx-success-card
|
|
5544
5559
|
.fileCount=${t.filter((p) => p.status === "complete").length}
|
|
5545
5560
|
.totalSize=${t.filter((p) => p.status === "complete").reduce((p, h) => p + (h.size || 0), 0)}
|
|
@@ -5549,16 +5564,16 @@ const k = (E = class extends U {
|
|
|
5549
5564
|
@file-retry=${this._onFileRetry}
|
|
5550
5565
|
@retry-all=${this._onRetryAll}
|
|
5551
5566
|
></sfx-success-card>
|
|
5552
|
-
` :
|
|
5553
|
-
${
|
|
5554
|
-
.compact=${
|
|
5567
|
+
` : o === "uploading" ? this._renderUploadOverlay(t) : l`
|
|
5568
|
+
${i ? c : l`<sfx-drop-zone
|
|
5569
|
+
.compact=${i}
|
|
5555
5570
|
.externalDragOver=${this._bodyDragOver}
|
|
5556
5571
|
.accept=${r}
|
|
5557
5572
|
.sources=${this._mergedSources}
|
|
5558
5573
|
.sourcesLayout=${((s = this.config) == null ? void 0 : s.sourcesLayout) ?? "pills"}
|
|
5559
5574
|
></sfx-drop-zone>`}
|
|
5560
5575
|
|
|
5561
|
-
${
|
|
5576
|
+
${i ? this._previewFileId ? this._renderPreviewLayout(t) : l`
|
|
5562
5577
|
<div class="asset-count">${t.length} ${t.length === 1 ? "file" : "files"} · ${Y(t.reduce((p, h) => p + (h.size || 0), 0))}</div>
|
|
5563
5578
|
<sfx-file-list
|
|
5564
5579
|
.files=${t}
|
|
@@ -5571,7 +5586,7 @@ const k = (E = class extends U {
|
|
|
5571
5586
|
`}
|
|
5572
5587
|
</div>
|
|
5573
5588
|
|
|
5574
|
-
${
|
|
5589
|
+
${i && o !== "complete" && o !== "uploading" ? l`
|
|
5575
5590
|
<sfx-actions-bar
|
|
5576
5591
|
.uploadState=${"idle"}
|
|
5577
5592
|
.fileCount=${t.length}
|
|
@@ -5589,7 +5604,7 @@ const k = (E = class extends U {
|
|
|
5589
5604
|
${this._activeConnector && ((d = this.config) != null && d.connectors) ? l`
|
|
5590
5605
|
<div class="connector-modal-backdrop" @click=${this._onConnectorBackdropClick}>
|
|
5591
5606
|
<div class="connector-modal">
|
|
5592
|
-
${
|
|
5607
|
+
${je.has(this._activeConnector) ? l`
|
|
5593
5608
|
<sfx-search-provider-browser
|
|
5594
5609
|
.provider=${this._activeConnector}
|
|
5595
5610
|
.companionUrl=${this.config.connectors.companionUrl}
|
|
@@ -5656,13 +5671,13 @@ const k = (E = class extends U {
|
|
|
5656
5671
|
}
|
|
5657
5672
|
_navigateFs(e) {
|
|
5658
5673
|
const t = [...this._store.getState().files.values()].filter(
|
|
5659
|
-
(
|
|
5660
|
-
),
|
|
5661
|
-
if (
|
|
5662
|
-
const r =
|
|
5674
|
+
(i) => i.previewUrl || i.type.startsWith("video/") && i.file
|
|
5675
|
+
), o = t.findIndex((i) => i.id === this._previewFileId);
|
|
5676
|
+
if (o === -1) return;
|
|
5677
|
+
const r = o + e;
|
|
5663
5678
|
if (r >= 0 && r < t.length) {
|
|
5664
|
-
const
|
|
5665
|
-
this._fullscreenPreviewUrl =
|
|
5679
|
+
const i = t[r];
|
|
5680
|
+
this._fullscreenPreviewUrl = i.previewUrl, this._fullscreenVideoFile = i.type.startsWith("video/") && i.file ? i.file : null, this._previewFileId = i.id, this._fullscreenZoomed = !1, this._fsPanX = 0, this._fsPanY = 0;
|
|
5666
5681
|
}
|
|
5667
5682
|
}
|
|
5668
5683
|
_getVideoBlobUrl(e) {
|
|
@@ -6991,33 +7006,33 @@ $([
|
|
|
6991
7006
|
$([
|
|
6992
7007
|
g()
|
|
6993
7008
|
], k.prototype, "_isPillExpanded");
|
|
6994
|
-
let
|
|
7009
|
+
let Et = k;
|
|
6995
7010
|
export {
|
|
6996
|
-
|
|
7011
|
+
ce as A,
|
|
6997
7012
|
W as C,
|
|
6998
7013
|
v as P,
|
|
6999
|
-
|
|
7000
|
-
|
|
7014
|
+
j as S,
|
|
7015
|
+
Ve as U,
|
|
7001
7016
|
z as a,
|
|
7002
|
-
|
|
7017
|
+
pe as b,
|
|
7003
7018
|
B as c,
|
|
7004
|
-
|
|
7019
|
+
De as d,
|
|
7005
7020
|
ne as e,
|
|
7006
7021
|
L as f,
|
|
7007
|
-
|
|
7008
|
-
|
|
7022
|
+
Et as g,
|
|
7023
|
+
Me as h,
|
|
7009
7024
|
se as i,
|
|
7010
|
-
|
|
7011
|
-
|
|
7012
|
-
|
|
7013
|
-
|
|
7025
|
+
Te as j,
|
|
7026
|
+
Ne as k,
|
|
7027
|
+
fe as l,
|
|
7028
|
+
et as m,
|
|
7014
7029
|
K as n,
|
|
7015
7030
|
V as o,
|
|
7016
7031
|
A as p,
|
|
7017
|
-
|
|
7018
|
-
|
|
7019
|
-
|
|
7020
|
-
|
|
7021
|
-
|
|
7022
|
-
|
|
7032
|
+
_t as q,
|
|
7033
|
+
Xe as r,
|
|
7034
|
+
$t as s,
|
|
7035
|
+
St as t,
|
|
7036
|
+
kt as u,
|
|
7037
|
+
Ct as v
|
|
7023
7038
|
};
|