@getflip/swirl-components 0.347.0 → 0.349.0
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/components.json +3 -3
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/swirl-components.cjs.js +1 -1
- package/dist/cjs/swirl-file-chip.cjs.entry.js +32 -10
- package/dist/collection/components/swirl-file-chip/swirl-file-chip.css +35 -0
- package/dist/collection/components/swirl-file-chip/swirl-file-chip.js +36 -10
- package/dist/components/assets/pdfjs/pdf.worker.min.mjs +1 -1
- package/dist/components/swirl-file-chip.js +36 -11
- package/dist/esm/loader.js +1 -1
- package/dist/esm/swirl-components.js +1 -1
- package/dist/esm/swirl-file-chip.entry.js +32 -10
- package/dist/swirl-components/p-3a676730.entry.js +1 -0
- package/dist/swirl-components/swirl-components.esm.js +1 -1
- package/dist/types/components/swirl-file-chip/swirl-file-chip.d.ts +7 -0
- package/package.json +2 -2
- package/dist/swirl-components/p-13c538de.entry.js +0 -1
|
@@ -8,6 +8,16 @@ export class SwirlFileChip {
|
|
|
8
8
|
this.downloadButtonLabel = "Download";
|
|
9
9
|
this.previewButtonLabel = "Preview";
|
|
10
10
|
this.isHovered = false;
|
|
11
|
+
this.fileType = "unknown";
|
|
12
|
+
this.fileIconMap = {
|
|
13
|
+
image: h("swirl-icon-image", null),
|
|
14
|
+
video: h("swirl-icon-video-player", null),
|
|
15
|
+
audio: h("swirl-icon-audio-file", null),
|
|
16
|
+
pdf: h("swirl-icon-picture-as-pdf", null),
|
|
17
|
+
compressed: h("swirl-icon-folder", null),
|
|
18
|
+
document: h("swirl-icon-file", null),
|
|
19
|
+
unknown: h("swirl-icon-attachment", null),
|
|
20
|
+
};
|
|
11
21
|
this.handleDownloadClick = () => {
|
|
12
22
|
this.download.emit();
|
|
13
23
|
if (this.skipNativeDownload) {
|
|
@@ -24,40 +34,49 @@ export class SwirlFileChip {
|
|
|
24
34
|
this.preview.emit();
|
|
25
35
|
};
|
|
26
36
|
}
|
|
37
|
+
componentWillLoad() {
|
|
38
|
+
this.setFileType();
|
|
39
|
+
}
|
|
40
|
+
watchType() {
|
|
41
|
+
this.setFileType();
|
|
42
|
+
}
|
|
27
43
|
getFileIcon() {
|
|
28
44
|
if (this.loading) {
|
|
29
45
|
return h("swirl-spinner", { size: "s", label: this.loadingLabel });
|
|
30
46
|
}
|
|
47
|
+
return this.fileIconMap[this.fileType];
|
|
48
|
+
}
|
|
49
|
+
setFileType() {
|
|
31
50
|
if (isImageMimeType(this.type)) {
|
|
32
|
-
|
|
51
|
+
this.fileType = "image";
|
|
33
52
|
}
|
|
34
53
|
else if (isVideoMimeType(this.type)) {
|
|
35
|
-
|
|
54
|
+
this.fileType = "video";
|
|
36
55
|
}
|
|
37
56
|
else if (isAudioMimeType(this.type)) {
|
|
38
|
-
|
|
57
|
+
this.fileType = "audio";
|
|
39
58
|
}
|
|
40
59
|
else if (isPdfMimeType(this.type)) {
|
|
41
|
-
|
|
60
|
+
this.fileType = "pdf";
|
|
42
61
|
}
|
|
43
62
|
else if (isCompressedArchiveMimeType(this.type)) {
|
|
44
|
-
|
|
63
|
+
this.fileType = "compressed";
|
|
45
64
|
}
|
|
46
65
|
else if (isDocumentMimeType(this.type)) {
|
|
47
|
-
|
|
66
|
+
this.fileType = "document";
|
|
48
67
|
}
|
|
49
68
|
else {
|
|
50
|
-
|
|
69
|
+
this.fileType = "unknown";
|
|
51
70
|
}
|
|
52
71
|
}
|
|
53
72
|
render() {
|
|
54
73
|
const actionCount = +this.showPreviewButton + +this.showDownloadButton;
|
|
55
|
-
const className = classnames("file-chip", {
|
|
74
|
+
const className = classnames("file-chip", `file-chip--type-${this.fileType}`, {
|
|
56
75
|
"file-chip--loading": this.loading,
|
|
57
76
|
"file-chip--one-action": actionCount === 1,
|
|
58
77
|
"file-chip--two-actions": actionCount === 2,
|
|
59
78
|
});
|
|
60
|
-
return (h(Host, { key: '
|
|
79
|
+
return (h(Host, { key: 'bad5b12da5f316338ad188b90cec107a9bd31e1a' }, h("span", { key: 'ca2761999829fc848f7b22ffbbc49d8fb5d50bcb', role: "group", class: className }, h("span", { key: '91f42a95a89294dcd269994e152599af9b8c6fc9', class: "file-chip__icon" }, this.getFileIcon()), h("span", { key: 'ab18c9b4714e0a918c9cc7d46b1f49203b318af2', class: "file-chip__info" }, h("span", { key: 'f0b4850881e0e68ac81ecb515618ee905be36aa0', class: "file-chip__name", title: this.name }, this.name), this.description && (h("span", { key: 'a445b2fc6a1bacac3e219e6870a1fe9b07ab5ab4', class: "file-chip__description" }, this.description))), h("swirl-button-group", { key: '37b77ae3c8ba34015189da4e0c935d6f85dc52bd', class: "file-chip__actions" }, this.showPreviewButton && (h("swirl-button", { key: 'a9ee556a3fa270fd0f8b983bb63f63fa8f2f46bf', variant: "flat", icon: "<swirl-icon-preview></swirl-icon-preview>", onClick: this.handlePreviewClick, label: this.previewButtonLabel, hideLabel: true, part: "file-chip__preview" })), this.showDownloadButton && (h("swirl-button", { key: '3158fd84ba35efd77d3dcc4f50a429af1ef41dbf', variant: "flat", icon: "<swirl-icon-download></swirl-icon-download>", onClick: this.handleDownloadClick, label: this.downloadButtonLabel, hideLabel: true, part: "file-chip__download" }))))));
|
|
61
80
|
}
|
|
62
81
|
static get is() { return "swirl-file-chip"; }
|
|
63
82
|
static get encapsulation() { return "shadow"; }
|
|
@@ -289,7 +308,8 @@ export class SwirlFileChip {
|
|
|
289
308
|
}
|
|
290
309
|
static get states() {
|
|
291
310
|
return {
|
|
292
|
-
"isHovered": {}
|
|
311
|
+
"isHovered": {},
|
|
312
|
+
"fileType": {}
|
|
293
313
|
};
|
|
294
314
|
}
|
|
295
315
|
static get events() {
|
|
@@ -325,4 +345,10 @@ export class SwirlFileChip {
|
|
|
325
345
|
}
|
|
326
346
|
}];
|
|
327
347
|
}
|
|
348
|
+
static get watchers() {
|
|
349
|
+
return [{
|
|
350
|
+
"propName": "type",
|
|
351
|
+
"methodName": "watchType"
|
|
352
|
+
}];
|
|
353
|
+
}
|
|
328
354
|
}
|