@libs-ui/components-preview-file 0.2.356-8 → 0.2.357-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/README.md
CHANGED
|
@@ -1,35 +1,33 @@
|
|
|
1
1
|
# @libs-ui/components-preview-file
|
|
2
2
|
|
|
3
|
-
> Component xem trước tệp tin hỗ trợ
|
|
3
|
+
> Component modal xem trước tệp tin hỗ trợ đa định dạng: hình ảnh, PDF, tài liệu Office — tự động chọn viewer phù hợp (Google Viewer, Microsoft Online Viewer, hoặc iframe trực tiếp).
|
|
4
4
|
|
|
5
5
|
## Giới thiệu
|
|
6
6
|
|
|
7
|
-
`LibsUiComponentsPreviewFileComponent`
|
|
7
|
+
`LibsUiComponentsPreviewFileComponent` cung cấp giao diện modal để xem nhanh nội dung tệp tin mà không cần tải về. Component tự động nhận diện MIME type để định tuyến sang viewer tối ưu: hình ảnh hiển thị trực tiếp, tài liệu Office dùng Microsoft Online Viewer, PDF và các loại khác dùng Google Docs Viewer. Hỗ trợ điều hướng qua danh sách nhiều tệp bằng nút Prev/Next và cho phép thêm các nút hành động tùy chỉnh trên thanh tiêu đề.
|
|
8
8
|
|
|
9
|
-
|
|
9
|
+
## Tính năng
|
|
10
10
|
|
|
11
|
-
- ✅ **Hỗ trợ đa định dạng**:
|
|
12
|
-
- ✅ **
|
|
13
|
-
- ✅
|
|
14
|
-
- ✅
|
|
15
|
-
- ✅ **
|
|
16
|
-
- ✅ **
|
|
17
|
-
- ✅ **
|
|
11
|
+
- ✅ **Hỗ trợ đa định dạng**: Hình ảnh (JPEG, PNG, GIF, SVG), PDF, Word (DOC/DOCX), Excel (XLS/XLSX), PowerPoint (PPT/PPTX)
|
|
12
|
+
- ✅ **Tự động chọn Viewer**: Microsoft Online Viewer cho Office, Google Docs Viewer cho PDF/các định dạng khác
|
|
13
|
+
- ✅ **Chế độ Iframe trực tiếp**: Bỏ qua map viewer — dùng URL gốc làm src iframe (cho Google Drive, Dropbox share link)
|
|
14
|
+
- ✅ **Điều hướng Prev/Next**: Duyệt qua danh sách nhiều tệp với two-way binding index
|
|
15
|
+
- ✅ **Nút hành động tùy chỉnh**: Thêm Download, Share hoặc bất kỳ action nào lên header modal
|
|
16
|
+
- ✅ **Loading state**: Spinner cho hình ảnh, Skeleton cho iframe — reset tự động khi chuyển tệp
|
|
17
|
+
- ✅ **Fallback ảnh lỗi**: Hỗ trợ injection token `LINK_IMAGE_ERROR_TOKEN_INJECT` cho ảnh placeholder khi lỗi load
|
|
18
|
+
- ✅ **OnPush Change Detection** + **Angular Signals**
|
|
18
19
|
|
|
19
20
|
## Khi nào sử dụng
|
|
20
21
|
|
|
21
|
-
-
|
|
22
|
-
-
|
|
23
|
-
-
|
|
22
|
+
- Xem nhanh nội dung tệp đính kèm (hợp đồng, báo cáo, ảnh sản phẩm) mà không cần tải về máy
|
|
23
|
+
- Duyệt gallery ảnh hoặc danh sách tài liệu PDF/Office trong workflow phê duyệt
|
|
24
|
+
- Nhúng preview tệp từ Google Drive, Dropbox hoặc CDN nội bộ vào trong ứng dụng
|
|
25
|
+
- Cho phép người dùng thực hiện hành động (download, share) ngay từ giao diện xem trước
|
|
24
26
|
|
|
25
27
|
## Cài đặt
|
|
26
28
|
|
|
27
29
|
```bash
|
|
28
|
-
# npm
|
|
29
30
|
npm install @libs-ui/components-preview-file
|
|
30
|
-
|
|
31
|
-
# yarn
|
|
32
|
-
yarn add @libs-ui/components-preview-file
|
|
33
31
|
```
|
|
34
32
|
|
|
35
33
|
## Import
|
|
@@ -45,108 +43,361 @@ import { LibsUiComponentsPreviewFileComponent } from '@libs-ui/components-previe
|
|
|
45
43
|
export class YourComponent {}
|
|
46
44
|
```
|
|
47
45
|
|
|
48
|
-
## Ví dụ
|
|
46
|
+
## Ví dụ sử dụng
|
|
47
|
+
|
|
48
|
+
### Ví dụ 1 — Cơ bản (xem danh sách tệp)
|
|
49
|
+
|
|
50
|
+
**TypeScript:**
|
|
51
|
+
|
|
52
|
+
```typescript
|
|
53
|
+
import { ChangeDetectionStrategy, Component, signal } from '@angular/core';
|
|
54
|
+
import { LibsUiComponentsPreviewFileComponent } from '@libs-ui/components-preview-file';
|
|
55
|
+
import { IFile } from '@libs-ui/interfaces-types';
|
|
56
|
+
|
|
57
|
+
@Component({
|
|
58
|
+
selector: 'app-document-list',
|
|
59
|
+
templateUrl: './document-list.component.html',
|
|
60
|
+
standalone: true,
|
|
61
|
+
imports: [LibsUiComponentsPreviewFileComponent],
|
|
62
|
+
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
63
|
+
})
|
|
64
|
+
export class DocumentListComponent {
|
|
65
|
+
protected showPreview = signal(false);
|
|
66
|
+
protected currentIndex = signal(0);
|
|
67
|
+
|
|
68
|
+
protected fileList: IFile[] = [
|
|
69
|
+
{
|
|
70
|
+
name: 'Bao cao thang 6.pdf',
|
|
71
|
+
url: 'https://example.com/files/report-june.pdf',
|
|
72
|
+
mimetype: 'application/pdf',
|
|
73
|
+
},
|
|
74
|
+
{
|
|
75
|
+
name: 'Anh san pham.jpg',
|
|
76
|
+
url: 'https://example.com/images/product.jpg',
|
|
77
|
+
mimetype: 'image/jpeg',
|
|
78
|
+
},
|
|
79
|
+
{
|
|
80
|
+
name: 'Du lieu Excel.xlsx',
|
|
81
|
+
url: 'https://example.com/files/data.xlsx',
|
|
82
|
+
mimetype: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
|
|
83
|
+
},
|
|
84
|
+
];
|
|
85
|
+
|
|
86
|
+
protected handlerOpenPreview(index: number): void {
|
|
87
|
+
this.currentIndex.set(index);
|
|
88
|
+
this.showPreview.set(true);
|
|
89
|
+
}
|
|
90
|
+
|
|
91
|
+
protected handlerClosePreview(): void {
|
|
92
|
+
this.showPreview.set(false);
|
|
93
|
+
}
|
|
94
|
+
}
|
|
95
|
+
```
|
|
49
96
|
|
|
50
|
-
|
|
97
|
+
**HTML:**
|
|
51
98
|
|
|
52
99
|
```html
|
|
53
|
-
<
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
100
|
+
<button (click)="handlerOpenPreview(0)">Xem tài liệu</button>
|
|
101
|
+
|
|
102
|
+
@if (showPreview()) {
|
|
103
|
+
<libs_ui-components-preview_file
|
|
104
|
+
[data]="fileList"
|
|
105
|
+
[(index)]="currentIndex"
|
|
106
|
+
(outClose)="handlerClosePreview()" />
|
|
107
|
+
}
|
|
108
|
+
```
|
|
109
|
+
|
|
110
|
+
---
|
|
111
|
+
|
|
112
|
+
### Ví dụ 2 — Với nút hành động tùy chỉnh (Download, Share)
|
|
113
|
+
|
|
114
|
+
**TypeScript:**
|
|
115
|
+
|
|
116
|
+
```typescript
|
|
117
|
+
import { ChangeDetectionStrategy, Component, signal } from '@angular/core';
|
|
118
|
+
import { IButton, LibsUiComponentsButtonsButtonComponent } from '@libs-ui/components-buttons-button';
|
|
119
|
+
import { LibsUiComponentsPreviewFileComponent } from '@libs-ui/components-preview-file';
|
|
120
|
+
import { IFile } from '@libs-ui/interfaces-types';
|
|
121
|
+
|
|
122
|
+
@Component({
|
|
123
|
+
selector: 'app-file-gallery',
|
|
124
|
+
templateUrl: './file-gallery.component.html',
|
|
125
|
+
standalone: true,
|
|
126
|
+
imports: [LibsUiComponentsPreviewFileComponent, LibsUiComponentsButtonsButtonComponent],
|
|
127
|
+
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
128
|
+
})
|
|
129
|
+
export class FileGalleryComponent {
|
|
130
|
+
protected showPreview = signal(false);
|
|
131
|
+
protected currentIndex = signal(0);
|
|
132
|
+
|
|
133
|
+
protected fileList: IFile[] = [
|
|
134
|
+
{
|
|
135
|
+
name: 'Hop dong dich vu.docx',
|
|
136
|
+
url: 'https://example.com/files/contract.docx',
|
|
137
|
+
mimetype: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
|
|
138
|
+
},
|
|
139
|
+
{
|
|
140
|
+
name: 'Thuyet trinh Q2.pptx',
|
|
141
|
+
url: 'https://example.com/files/presentation-q2.pptx',
|
|
142
|
+
mimetype: 'application/vnd.openxmlformats-officedocument.presentationml.presentation',
|
|
143
|
+
},
|
|
144
|
+
];
|
|
145
|
+
|
|
146
|
+
protected customButtons: IButton[] = [
|
|
147
|
+
{
|
|
148
|
+
key: 'download',
|
|
149
|
+
label: 'Tai xuong',
|
|
150
|
+
type: 'button-primary',
|
|
151
|
+
classIconLeft: 'libs-ui-icon-download',
|
|
152
|
+
action: async (index: number) => {
|
|
153
|
+
const file = this.fileList[index];
|
|
154
|
+
window.open(file.url, '_blank');
|
|
155
|
+
},
|
|
156
|
+
},
|
|
157
|
+
{
|
|
158
|
+
key: 'share',
|
|
159
|
+
label: '',
|
|
160
|
+
type: 'button-outline',
|
|
161
|
+
classIconLeft: 'libs-ui-icon-share',
|
|
162
|
+
iconOnlyType: true,
|
|
163
|
+
action: async (index: number) => {
|
|
164
|
+
const file = this.fileList[index];
|
|
165
|
+
await navigator.clipboard.writeText(file.url || '');
|
|
166
|
+
},
|
|
167
|
+
},
|
|
168
|
+
];
|
|
169
|
+
|
|
170
|
+
protected handlerOpenPreview(index: number): void {
|
|
171
|
+
this.currentIndex.set(index);
|
|
172
|
+
this.showPreview.set(true);
|
|
173
|
+
}
|
|
174
|
+
|
|
175
|
+
protected handlerClosePreview(): void {
|
|
176
|
+
this.showPreview.set(false);
|
|
177
|
+
}
|
|
178
|
+
|
|
179
|
+
protected handlerChangeIndex(newIndex: number): void {
|
|
180
|
+
// Cập nhật nút theo tệp hiện tại nếu cần
|
|
181
|
+
console.log('Chuyển sang tệp index:', newIndex);
|
|
182
|
+
}
|
|
183
|
+
}
|
|
184
|
+
```
|
|
185
|
+
|
|
186
|
+
**HTML:**
|
|
187
|
+
|
|
188
|
+
```html
|
|
189
|
+
<div class="flex flex-col gap-2">
|
|
190
|
+
@for (file of fileList; track file.url) {
|
|
191
|
+
<div class="flex items-center justify-between p-3 border rounded-lg">
|
|
192
|
+
<span>{{ file.name }}</span>
|
|
193
|
+
<button (click)="handlerOpenPreview($index)">Xem truoc</button>
|
|
194
|
+
</div>
|
|
195
|
+
}
|
|
196
|
+
</div>
|
|
197
|
+
|
|
198
|
+
@if (showPreview()) {
|
|
199
|
+
<libs_ui-components-preview_file
|
|
200
|
+
[data]="fileList"
|
|
201
|
+
[(index)]="currentIndex"
|
|
202
|
+
[buttons]="customButtons"
|
|
203
|
+
(outClose)="handlerClosePreview()"
|
|
204
|
+
(outChangeIndex)="handlerChangeIndex($event)" />
|
|
205
|
+
}
|
|
206
|
+
```
|
|
207
|
+
|
|
208
|
+
---
|
|
209
|
+
|
|
210
|
+
### Ví dụ 3 — Chế độ Iframe trực tiếp (Google Drive, Dropbox)
|
|
211
|
+
|
|
212
|
+
Dùng khi URL đã là embed link sẵn (ví dụ Google Drive `/preview`), không cần qua Google Docs Viewer hay Microsoft Viewer.
|
|
213
|
+
|
|
214
|
+
**TypeScript:**
|
|
215
|
+
|
|
216
|
+
```typescript
|
|
217
|
+
import { ChangeDetectionStrategy, Component, signal } from '@angular/core';
|
|
218
|
+
import { LibsUiComponentsPreviewFileComponent } from '@libs-ui/components-preview-file';
|
|
219
|
+
import { IFile } from '@libs-ui/interfaces-types';
|
|
220
|
+
|
|
221
|
+
@Component({
|
|
222
|
+
selector: 'app-drive-preview',
|
|
223
|
+
templateUrl: './drive-preview.component.html',
|
|
224
|
+
standalone: true,
|
|
225
|
+
imports: [LibsUiComponentsPreviewFileComponent],
|
|
226
|
+
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
227
|
+
})
|
|
228
|
+
export class DrivePreviewComponent {
|
|
229
|
+
protected showPreview = signal(false);
|
|
230
|
+
protected currentIndex = signal(0);
|
|
231
|
+
|
|
232
|
+
protected driveFiles: IFile[] = [
|
|
233
|
+
{
|
|
234
|
+
name: 'Tai lieu Google Drive',
|
|
235
|
+
url: 'https://drive.google.com/file/d/1B9Ke75VYIznY4cjyZTnXRsRYPkmJ1AgK/preview',
|
|
236
|
+
mimetype: 'application/pdf',
|
|
237
|
+
},
|
|
238
|
+
{
|
|
239
|
+
name: 'Dropbox Shared File',
|
|
240
|
+
url: 'https://www.dropbox.com/s/abc123/file.pdf?dl=0&raw=1',
|
|
241
|
+
mimetype: 'application/pdf',
|
|
242
|
+
},
|
|
243
|
+
];
|
|
244
|
+
|
|
245
|
+
protected handlerOpen(): void {
|
|
246
|
+
this.currentIndex.set(0);
|
|
247
|
+
this.showPreview.set(true);
|
|
248
|
+
}
|
|
249
|
+
|
|
250
|
+
protected handlerClose(): void {
|
|
251
|
+
this.showPreview.set(false);
|
|
252
|
+
}
|
|
253
|
+
}
|
|
57
254
|
```
|
|
58
255
|
|
|
59
|
-
|
|
256
|
+
**HTML:**
|
|
60
257
|
|
|
61
258
|
```html
|
|
62
|
-
<
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
259
|
+
<button (click)="handlerOpen()">Mo Google Drive Preview</button>
|
|
260
|
+
|
|
261
|
+
@if (showPreview()) {
|
|
262
|
+
<libs_ui-components-preview_file
|
|
263
|
+
[data]="driveFiles"
|
|
264
|
+
[(index)]="currentIndex"
|
|
265
|
+
[isSourceIframe]="true"
|
|
266
|
+
(outClose)="handlerClose()" />
|
|
267
|
+
}
|
|
67
268
|
```
|
|
68
269
|
|
|
69
|
-
|
|
270
|
+
---
|
|
271
|
+
|
|
272
|
+
### Ví dụ 4 — Với `LINK_IMAGE_ERROR_TOKEN_INJECT` (ảnh placeholder khi lỗi)
|
|
273
|
+
|
|
274
|
+
```typescript
|
|
275
|
+
import { Component } from '@angular/core';
|
|
276
|
+
import { LibsUiComponentsPreviewFileComponent } from '@libs-ui/components-preview-file';
|
|
277
|
+
import { LINK_IMAGE_ERROR_TOKEN_INJECT } from '@libs-ui/utils';
|
|
70
278
|
|
|
71
|
-
|
|
279
|
+
@Component({
|
|
280
|
+
// ...
|
|
281
|
+
imports: [LibsUiComponentsPreviewFileComponent],
|
|
282
|
+
providers: [
|
|
283
|
+
{
|
|
284
|
+
provide: LINK_IMAGE_ERROR_TOKEN_INJECT,
|
|
285
|
+
useValue: 'https://example.com/assets/image-error-placeholder.png',
|
|
286
|
+
},
|
|
287
|
+
],
|
|
288
|
+
})
|
|
289
|
+
export class AppComponent {}
|
|
290
|
+
```
|
|
72
291
|
|
|
73
|
-
|
|
292
|
+
## @Input()
|
|
74
293
|
|
|
75
|
-
|
|
|
76
|
-
|
|
77
|
-
| `[data]`
|
|
78
|
-
| `[(index)]` | `number`
|
|
79
|
-
| `[buttons]` | `IButton[]` | `
|
|
80
|
-
| `[zIndex]`
|
|
294
|
+
| Input | Type | Default | Mô tả | Ví dụ |
|
|
295
|
+
|---|---|---|---|---|
|
|
296
|
+
| `[data]` | `IFile[]` | **Bắt buộc** | Danh sách tệp cần xem trước. Phải là mảng `IFile[]`. | `[data]="fileList"` |
|
|
297
|
+
| `[(index)]` | `number` | **Bắt buộc** | Index tệp hiện tại trong mảng `data`. Hỗ trợ two-way binding (model). | `[(index)]="currentIndex"` |
|
|
298
|
+
| `[buttons]` | `IButton[]` | `undefined` | Danh sách nút hành động tùy chỉnh hiển thị trên header modal (Download, Share...). | `[buttons]="customButtons"` |
|
|
299
|
+
| `[zIndex]` | `number` | `undefined` | Z-index CSS cho modal. Dùng khi cần kiểm soát lớp hiển thị. | `[zIndex]="1050"` |
|
|
300
|
+
| `[isSourceIframe]` | `boolean` | `undefined` (falsy) | Bỏ qua logic map viewer — dùng `url` hoặc `origin_url` trực tiếp làm `src` của iframe. Dùng cho Google Drive share link, Dropbox, v.v. | `[isSourceIframe]="true"` |
|
|
81
301
|
|
|
82
|
-
|
|
302
|
+
## @Output()
|
|
83
303
|
|
|
84
|
-
|
|
|
85
|
-
|
|
86
|
-
| `(outClose)` | `void` | Phát ra khi người dùng nhấn nút
|
|
304
|
+
| Output | Type | Mô tả | Handler TS | Binding HTML |
|
|
305
|
+
|---|---|---|---|---|
|
|
306
|
+
| `(outClose)` | `void` | Phát ra khi người dùng đóng modal (nhấn nút X hoặc click backdrop). | `handlerClosePreview(): void { this.showPreview.set(false); }` | `(outClose)="handlerClosePreview()"` |
|
|
307
|
+
| `(outChangeIndex)` | `number` | Phát ra index mới sau khi nhấn Prev/Next để chuyển tệp. | `handlerChangeIndex(index: number): void { console.log(index); }` | `(outChangeIndex)="handlerChangeIndex($event)"` |
|
|
87
308
|
|
|
88
309
|
## Types & Interfaces
|
|
89
310
|
|
|
311
|
+
Các type được import từ `@libs-ui/interfaces-types`:
|
|
312
|
+
|
|
313
|
+
```typescript
|
|
314
|
+
import { IFile } from '@libs-ui/interfaces-types';
|
|
315
|
+
import { IButton } from '@libs-ui/components-buttons-button';
|
|
316
|
+
```
|
|
317
|
+
|
|
90
318
|
```typescript
|
|
91
319
|
export interface IFile {
|
|
92
320
|
id?: string;
|
|
93
|
-
name?: string;
|
|
94
|
-
file?: File;
|
|
95
|
-
size?: string;
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
321
|
+
name?: string; // Tên tệp hiển thị trên header modal
|
|
322
|
+
file?: File; // Native File object (dùng khi upload)
|
|
323
|
+
size?: string; // Kích thước tệp (chuỗi, vd: "2.5MB")
|
|
324
|
+
isUploading?: boolean;
|
|
325
|
+
percentUploading?: number;
|
|
326
|
+
isUpdate?: boolean;
|
|
327
|
+
url?: string; // URL công khai để hiển thị tệp
|
|
328
|
+
origin_url?: string; // URL gốc (fallback khi url không có)
|
|
329
|
+
mimetype?: string; // MIME type — dùng để chọn viewer phù hợp
|
|
99
330
|
type?: 'document' | 'image' | 'video' | 'audio';
|
|
100
|
-
|
|
331
|
+
error?: string;
|
|
332
|
+
isAvatar?: boolean;
|
|
101
333
|
}
|
|
102
334
|
|
|
103
335
|
export interface IButton {
|
|
104
|
-
key: string;
|
|
105
|
-
label?: string;
|
|
106
|
-
type?: string;
|
|
107
|
-
classIconLeft?: string;
|
|
108
|
-
|
|
109
|
-
|
|
336
|
+
key: string; // ID duy nhất cho button
|
|
337
|
+
label?: string; // Text hiển thị
|
|
338
|
+
type?: string; // Kiểu button (button-primary, button-outline...)
|
|
339
|
+
classIconLeft?: string; // Class icon bên trái
|
|
340
|
+
classIconRight?: string; // Class icon bên phải
|
|
341
|
+
iconOnlyType?: boolean; // Chỉ hiện icon, ẩn label
|
|
342
|
+
classInclude?: string; // Class CSS bổ sung
|
|
343
|
+
action?: (index: number) => Promise<void>; // Callback nhận index tệp hiện tại
|
|
110
344
|
}
|
|
111
345
|
```
|
|
112
346
|
|
|
113
|
-
##
|
|
347
|
+
## Logic ẩn quan trọng
|
|
114
348
|
|
|
115
|
-
###
|
|
349
|
+
### 1. Tự động chọn Viewer theo MIME Type
|
|
116
350
|
|
|
117
|
-
|
|
118
|
-
| ------------------------- | -------------------------------------------------- |
|
|
119
|
-
| `.preview-file-container` | Container chính của modal preview. |
|
|
120
|
-
| `.preview-header` | Thanh tiêu đề chứa tên file và các nút điều hướng. |
|
|
121
|
-
| `.preview-body` | Vùng hiển thị nội dung file (iframe/img). |
|
|
351
|
+
Component ưu tiên theo thứ tự:
|
|
122
352
|
|
|
123
|
-
|
|
353
|
+
1. Nếu `isSourceIframe = true` → dùng `url` / `origin_url` làm src trực tiếp (bỏ qua tất cả logic map)
|
|
354
|
+
2. Nếu MIME type thuộc nhóm Microsoft Office → dùng `https://view.officeapps.live.com/op/embed.aspx?src=...`
|
|
355
|
+
3. Mọi trường hợp còn lại (PDF, ảnh embed, v.v.) → dùng `https://docs.google.com/viewer?url=...`
|
|
124
356
|
|
|
125
|
-
|
|
126
|
-
| ----------------------- | ------- | ----------------------- |
|
|
127
|
-
| Angular | 18+ | Framework |
|
|
128
|
-
| Google Viewer | - | PDF & Image Viewing |
|
|
129
|
-
| Microsoft Office Online | - | Office Document Viewing |
|
|
130
|
-
| Angular Signals | - | State management |
|
|
357
|
+
**Các MIME type được nhận diện là Office (dùng Microsoft Viewer):**
|
|
131
358
|
|
|
132
|
-
|
|
359
|
+
| MIME Type | Loại tệp |
|
|
360
|
+
|---|---|
|
|
361
|
+
| `application/msword` | Word DOC |
|
|
362
|
+
| `application/vnd.openxmlformats-officedocument.wordprocessingml.document` | Word DOCX |
|
|
363
|
+
| `application/vnd.openxmlformats-officedocument.wordprocessingml.template` | Word DOTX |
|
|
364
|
+
| `application/vnd.ms-excel` | Excel XLS |
|
|
365
|
+
| `application/vnd.openxmlformats-officedocument.spreadsheetml.sheet` | Excel XLSX |
|
|
366
|
+
| `application/vnd.openxmlformats-officedocument.spreadsheetml.template` | Excel XLTX |
|
|
367
|
+
| `application/vnd.ms-excel.sheet.macroEnabled.12` | Excel XLSM |
|
|
368
|
+
| `application/vnd.ms-powerpoint` | PowerPoint PPT |
|
|
369
|
+
| `application/vnd.openxmlformats-officedocument.presentationml.presentation` | PowerPoint PPTX |
|
|
370
|
+
| `application/vnd.ms-powerpoint.presentation.macroEnabled.12` | PowerPoint PPTM |
|
|
371
|
+
| `application/vnd.openxmlformats-officedocument.presentationml.slideshow` | PowerPoint PPSX |
|
|
133
372
|
|
|
134
|
-
|
|
135
|
-
npx nx serve core-ui
|
|
136
|
-
```
|
|
373
|
+
### 2. Kiểm tra hình ảnh bằng Pipe
|
|
137
374
|
|
|
138
|
-
|
|
375
|
+
Hình ảnh được render bằng thẻ `<img>` (không qua iframe) khi `LibsUiPipesCheckFileExtensionPipe` trả về `true` cho loại `'image'`. Pipe này kiểm tra cả `mimetype` lẫn extension từ tên tệp.
|
|
139
376
|
|
|
140
|
-
|
|
377
|
+
### 3. Reset loading khi chuyển tệp
|
|
141
378
|
|
|
142
|
-
|
|
143
|
-
# Chạy tests
|
|
144
|
-
npx nx test components-preview-file
|
|
379
|
+
Khi `index` thay đổi, `computed()` tính lại `fileView` và dùng `untracked()` để set `loading = true` mà không tạo vòng lặp reactive. Trạng thái loading chỉ về `false` sau khi `(load)` event của `<img>` hoặc `<iframe>` kích hoạt.
|
|
145
380
|
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
381
|
+
### 4. Bảo vệ điều hướng biên
|
|
382
|
+
|
|
383
|
+
Nút Prev chỉ hiển thị khi `index() > 0`. Nút Next chỉ hiển thị khi `index() < data().length - 1`. Component không tự động wrap vòng (không nhảy từ cuối về đầu).
|
|
384
|
+
|
|
385
|
+
## Lưu ý quan trọng
|
|
386
|
+
|
|
387
|
+
⚠️ **Yêu cầu kết nối Internet**: Google Viewer và Microsoft Online Viewer là dịch vụ bên ngoài. Tệp phải có URL công khai (public URL) để các viewer này truy cập được. Không hoạt động với URL nội bộ hoặc localhost.
|
|
149
388
|
|
|
150
|
-
|
|
389
|
+
⚠️ **CORS và embed permissions**: Một số máy chủ cấu hình header `X-Frame-Options: DENY` hoặc `Content-Security-Policy` chặn nhúng iframe. Kiểm tra cấu hình server nếu tệp không hiển thị được.
|
|
390
|
+
|
|
391
|
+
⚠️ **Chỉ dùng HTTPS**: Trình duyệt sẽ chặn nội dung Mixed Content nếu trang web dùng HTTPS nhưng URL tệp là HTTP. Luôn dùng link HTTPS cho tệp cần preview.
|
|
392
|
+
|
|
393
|
+
⚠️ **`isSourceIframe` cho Google Drive**: Khi chia sẻ file từ Google Drive, dùng link dạng `https://drive.google.com/file/d/{fileId}/preview` kết hợp với `[isSourceIframe]="true"`. Không dùng link `/view` thông thường vì Google Drive chặn nhúng iframe.
|
|
394
|
+
|
|
395
|
+
⚠️ **Two-way binding bắt buộc cho `index`**: Input `index` là `model.required()`, phải truyền bằng `[(index)]` hoặc cả `[index]` lẫn `(indexChange)`. Không có giá trị mặc định.
|
|
396
|
+
|
|
397
|
+
## Demo
|
|
398
|
+
|
|
399
|
+
```bash
|
|
400
|
+
npx nx serve core-ui
|
|
401
|
+
```
|
|
151
402
|
|
|
152
|
-
|
|
403
|
+
Truy cập: `http://localhost:4500/components/preview-file`
|
|
@@ -20,6 +20,9 @@ export class LibsUiComponentsPreviewFileComponent {
|
|
|
20
20
|
untracked(() => this.loading.set(true));
|
|
21
21
|
const mimeType = file.mimetype || file.file?.type;
|
|
22
22
|
const url = file.url || file.origin_url;
|
|
23
|
+
if (this.isSourceIframe()) {
|
|
24
|
+
return { ...file, urlFile: url };
|
|
25
|
+
}
|
|
23
26
|
if (mimeType && this.mineTypeMicroSoftSupport().includes(mimeType)) {
|
|
24
27
|
return { ...file, urlFile: `https://view.officeapps.live.com/op/embed.aspx?src=${encodeURIComponent(url || '')}` };
|
|
25
28
|
}
|
|
@@ -29,7 +32,9 @@ export class LibsUiComponentsPreviewFileComponent {
|
|
|
29
32
|
index = model.required();
|
|
30
33
|
data = input.required();
|
|
31
34
|
buttons = input();
|
|
35
|
+
isSourceIframe = input();
|
|
32
36
|
outClose = output();
|
|
37
|
+
outChangeIndex = output();
|
|
33
38
|
constructor(linkImageError) {
|
|
34
39
|
this.linkImageError = linkImageError;
|
|
35
40
|
}
|
|
@@ -58,9 +63,11 @@ export class LibsUiComponentsPreviewFileComponent {
|
|
|
58
63
|
}
|
|
59
64
|
handlerPrev() {
|
|
60
65
|
this.index.update((value) => value - 1);
|
|
66
|
+
this.outChangeIndex.emit(this.index());
|
|
61
67
|
}
|
|
62
68
|
handlerNext() {
|
|
63
69
|
this.index.update((value) => value + 1);
|
|
70
|
+
this.outChangeIndex.emit(this.index());
|
|
64
71
|
}
|
|
65
72
|
async handlerImageError(event) {
|
|
66
73
|
if (!this.linkImageError) {
|
|
@@ -69,7 +76,7 @@ export class LibsUiComponentsPreviewFileComponent {
|
|
|
69
76
|
event.target.src = this.linkImageError;
|
|
70
77
|
}
|
|
71
78
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LibsUiComponentsPreviewFileComponent, deps: [{ token: LINK_IMAGE_ERROR_TOKEN_INJECT, optional: true }], target: i0.ɵɵFactoryTarget.Component });
|
|
72
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: LibsUiComponentsPreviewFileComponent, isStandalone: true, selector: "libs_ui-components-preview_file", inputs: { zIndex: { classPropertyName: "zIndex", publicName: "zIndex", isSignal: true, isRequired: false, transformFunction: null }, index: { classPropertyName: "index", publicName: "index", isSignal: true, isRequired: true, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: true, transformFunction: null }, buttons: { classPropertyName: "buttons", publicName: "buttons", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { index: "indexChange", outClose: "outClose" }, ngImport: i0, template: "<libs_ui-components-modal\n [minWidth]=\"'1200px'\"\n [headerConfig]=\"{ ignoreHeaderTheme: true, classButtonCloseInclude: '!mr-[24px]' }\"\n [bodyConfig]=\"{ classInclude: '!p-0', scrollOverlayOptions: { scrollX: 'hidden', scrollY: 'hidden' } }\"\n [footerConfig]=\"{ hidden: true }\"\n [zIndex]=\"zIndex()\"\n [buttonsFooter]=\"[]\"\n [mode]=\"'center'\"\n (outEvent)=\"handlerClose($event)\">\n <div class=\"libs-ui-modal-header-custom w-full flex items-center justify-between min-w-0\">\n <div class=\"w-full ml-[24px] mr-[8px] flex justify-between items-center min-w-0 gap-[16px]\">\n <div class=\"w-2/8 flex-1\"></div>\n <div class=\"flex libs-ui-font-h4s min-w-0 w-4/8 justify-center flex-1\">\n <libs_ui-components-popover\n [type]=\"'text'\"\n [config]=\"{ zIndex: zIndex() }\">\n {{ fileView()?.name }}\n </libs_ui-components-popover>\n </div>\n @if (buttons()?.length) {\n <div class=\"flex gap-[8px] items-center w-2/8 justify-end flex-1\">\n @for (button of buttons(); track button.key) {\n <libs_ui-components-buttons-button\n [type]=\"button.type || 'button-third'\"\n [label]=\"button.label || ''\"\n [classIconLeft]=\"button.classIconLeft || ''\"\n [iconOnlyType]=\"button.iconOnlyType || false\"\n [classInclude]=\"button.classInclude || '!py-[4px] !px-[12px]'\"\n (outClick)=\"button.action?.(index())\" />\n }\n <div class=\"h-[12px] libs-ui-border-left-general\"></div>\n </div>\n }\n </div>\n </div>\n <div class=\"libs-ui-modal-body-custom h-full w-full flex rounded-b-[8px] overflow-hidden relative\">\n @if (index() > 0) {\n <div class=\"absolute top-[50%] left-[24px] transform -translate-y-[50%] z-[1]\">\n <libs_ui-components-buttons-button\n [type]=\"'button-outline'\"\n [iconOnlyType]=\"true\"\n [classInclude]=\"'!p-[11px] !rounded-[8px]'\"\n [classIconLeft]=\"'libs-ui-icon-chevron-right rotate-180 before:!text-[20px]'\"\n (outClick)=\"handlerPrev()\" />\n </div>\n }\n @if (fileView(); as fileView) {\n @if (fileView | LibsUiPipesCheckFileExtensionPipe: 'image') {\n <div class=\"w-full h-full relative flex items-center justify-center\">\n @if (fileView.url || fileView.origin_url; as url) {\n <img\n [src]=\"url\"\n alt=\"\"\n class=\"max-w-full max-h-full object-contain\"\n (load)=\"handlerOnLoad()\"\n (error)=\"handlerImageError($event)\" />\n @if (loading()) {\n <libs_ui-components-spinner [size]=\"'medium'\" />\n }\n }\n </div>\n } @else {\n <iframe\n id=\"google\"\n [class.hidden]=\"loading()\"\n [src]=\"fileView.urlFile | LibsUiPipesSecurityTrustPipe: 'resourceUrl' | async\"\n width=\"100%\"\n height=\"100%\"\n
|
|
79
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: LibsUiComponentsPreviewFileComponent, isStandalone: true, selector: "libs_ui-components-preview_file", inputs: { zIndex: { classPropertyName: "zIndex", publicName: "zIndex", isSignal: true, isRequired: false, transformFunction: null }, index: { classPropertyName: "index", publicName: "index", isSignal: true, isRequired: true, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: true, transformFunction: null }, buttons: { classPropertyName: "buttons", publicName: "buttons", isSignal: true, isRequired: false, transformFunction: null }, isSourceIframe: { classPropertyName: "isSourceIframe", publicName: "isSourceIframe", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { index: "indexChange", outClose: "outClose", outChangeIndex: "outChangeIndex" }, ngImport: i0, template: "<libs_ui-components-modal\n [minWidth]=\"'1200px'\"\n [headerConfig]=\"{ ignoreHeaderTheme: true, classButtonCloseInclude: '!mr-[24px]' }\"\n [bodyConfig]=\"{ classInclude: '!p-0', scrollOverlayOptions: { scrollX: 'hidden', scrollY: 'hidden' } }\"\n [footerConfig]=\"{ hidden: true }\"\n [zIndex]=\"zIndex()\"\n [buttonsFooter]=\"[]\"\n [mode]=\"'center'\"\n (outEvent)=\"handlerClose($event)\">\n <div class=\"libs-ui-modal-header-custom w-full flex items-center justify-between min-w-0\">\n <div class=\"w-full ml-[24px] mr-[8px] flex justify-between items-center min-w-0 gap-[16px]\">\n <div class=\"w-2/8 flex-1\"></div>\n <div class=\"flex libs-ui-font-h4s min-w-0 w-4/8 justify-center flex-1\">\n <libs_ui-components-popover\n [type]=\"'text'\"\n [config]=\"{ zIndex: zIndex() }\">\n {{ fileView()?.name }}\n </libs_ui-components-popover>\n </div>\n @if (buttons()?.length) {\n <div class=\"flex gap-[8px] items-center w-2/8 justify-end flex-1\">\n @for (button of buttons(); track button.key) {\n <libs_ui-components-buttons-button\n [type]=\"button.type || 'button-third'\"\n [label]=\"button.label || ''\"\n [classIconLeft]=\"button.classIconLeft || ''\"\n [classIconRight]=\"button.classIconRight || ''\"\n [iconOnlyType]=\"button.iconOnlyType || false\"\n [classInclude]=\"button.classInclude || '!py-[4px] !px-[12px]'\"\n (outClick)=\"button.action?.(index())\" />\n }\n <div class=\"h-[12px] libs-ui-border-left-general\"></div>\n </div>\n }\n </div>\n </div>\n <div class=\"libs-ui-modal-body-custom h-full w-full flex rounded-b-[8px] overflow-hidden relative\">\n @if (index() > 0) {\n <div class=\"absolute top-[50%] left-[24px] transform -translate-y-[50%] z-[1]\">\n <libs_ui-components-buttons-button\n [type]=\"'button-outline'\"\n [iconOnlyType]=\"true\"\n [classInclude]=\"'!p-[11px] !rounded-[8px]'\"\n [classIconLeft]=\"'libs-ui-icon-chevron-right rotate-180 before:!text-[20px]'\"\n (outClick)=\"handlerPrev()\" />\n </div>\n }\n @if (fileView(); as fileView) {\n @if (fileView | LibsUiPipesCheckFileExtensionPipe: 'image') {\n <div class=\"w-full h-full relative flex items-center justify-center\">\n @if (fileView.url || fileView.origin_url; as url) {\n <img\n [src]=\"url\"\n alt=\"\"\n class=\"max-w-full max-h-full object-contain\"\n (load)=\"handlerOnLoad()\"\n (error)=\"handlerImageError($event)\" />\n @if (loading()) {\n <libs_ui-components-spinner [size]=\"'medium'\" />\n }\n }\n </div>\n } @else {\n <iframe\n id=\"google\"\n title=\"File preview\"\n [class.hidden]=\"loading()\"\n [src]=\"fileView.urlFile ?? '' | LibsUiPipesSecurityTrustPipe: 'resourceUrl' | async\"\n width=\"100%\"\n height=\"100%\"\n class=\"border-0\"\n allowfullscreen=\"allowfullscreen\"\n (load)=\"handlerOnLoad()\"></iframe>\n @if (loading()) {\n <libs_ui-components-skeleton [class]=\"'w-full h-full'\" />\n }\n }\n @if (index() < data().length - 1) {\n <div class=\"absolute top-[50%] right-[24px] transform -translate-y-[50%] z-[1]\">\n <libs_ui-components-buttons-button\n [type]=\"'button-outline'\"\n [iconOnlyType]=\"true\"\n [classInclude]=\"'!p-[11px] !rounded-[8px]'\"\n [classIconLeft]=\"'libs-ui-icon-chevron-right before:!text-[20px]'\"\n (outClick)=\"handlerNext()\" />\n </div>\n }\n }\n </div>\n</libs_ui-components-modal>\n", dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "component", type: LibsUiComponentsModalComponent, selector: "libs_ui-components-modal", inputs: ["show", "mode", "isBackdropTransparent", "isBackgroundTransparentModal", "isSizeBackdropByWidthHeightInput", "hasShadowBoxWhenHiddenBackDropTransparent", "classIncludeModalWrapper", "zIndex", "width", "height", "maxWidth", "maxHeight", "minWidth", "isFullScreen", "disable", "ignoreCommunicateMicroEvent", "escapeKeyboardCloseModal", "isClickOutsideClose", "headerConfig", "bodyConfig", "footerConfig", "buttonsFooter", "title", "titleUseXssFilter", "titleUseTooltip", "titleUseInnerText"], outputs: ["showChange", "widthChange", "heightChange", "maxWidthChange", "maxHeightChange", "minWidthChange", "disableChange", "buttonsFooterChange", "outScrollContent", "outEvent", "outFunctionControl", "outClose"] }, { kind: "pipe", type: LibsUiPipesSecurityTrustPipe, name: "LibsUiPipesSecurityTrustPipe" }, { kind: "component", type: LibsUiComponentsSkeletonComponent, selector: "libs_ui-components-skeleton", inputs: ["config"] }, { kind: "component", type: LibsUiComponentsPopoverComponent, selector: "libs_ui-components-popover,[LibsUiComponentsPopoverDirective]", inputs: ["debugId", "flagMouse", "type", "mode", "config", "ignoreShowPopover", "elementRefCustom", "initEventInElementRefCustom", "classInclude", "ignoreHiddenPopoverContentWhenMouseLeave", "ignoreStopPropagationEvent", "ignoreCursorPointerModeLikeClick", "isAddContentToParentDocument", "ignoreClickOutside"], outputs: ["outEvent", "outChangStageFlagMouse", "outEventPopoverContent", "outFunctionsControl"] }, { kind: "component", type: LibsUiComponentsButtonsButtonComponent, selector: "libs_ui-components-buttons-button", inputs: ["flagMouse", "type", "buttonCustom", "sizeButton", "label", "disable", "isPending", "imageLeft", "classInclude", "classIconLeft", "classIconRight", "classLabel", "iconOnlyType", "popover", "ignoreStopPropagationEvent", "zIndex", "widthLabelPopover", "styleIconLeft", "styleButton", "ignoreFocusWhenInputTab", "ignoreSetClickWhenShowPopover", "ignorePointerEvent", "isActive", "isHandlerEnterDocumentClickButton"], outputs: ["outClick", "outPopoverEvent", "outFunctionsControl"] }, { kind: "pipe", type: LibsUiPipesCheckFileExtensionPipe, name: "LibsUiPipesCheckFileExtensionPipe" }, { kind: "component", type: LibsUiComponentsSpinnerComponent, selector: "libs_ui-components-spinner", inputs: ["type", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
73
80
|
}
|
|
74
81
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LibsUiComponentsPreviewFileComponent, decorators: [{
|
|
75
82
|
type: Component,
|
|
@@ -82,11 +89,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
|
|
|
82
89
|
LibsUiComponentsButtonsButtonComponent,
|
|
83
90
|
LibsUiPipesCheckFileExtensionPipe,
|
|
84
91
|
LibsUiComponentsSpinnerComponent,
|
|
85
|
-
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<libs_ui-components-modal\n [minWidth]=\"'1200px'\"\n [headerConfig]=\"{ ignoreHeaderTheme: true, classButtonCloseInclude: '!mr-[24px]' }\"\n [bodyConfig]=\"{ classInclude: '!p-0', scrollOverlayOptions: { scrollX: 'hidden', scrollY: 'hidden' } }\"\n [footerConfig]=\"{ hidden: true }\"\n [zIndex]=\"zIndex()\"\n [buttonsFooter]=\"[]\"\n [mode]=\"'center'\"\n (outEvent)=\"handlerClose($event)\">\n <div class=\"libs-ui-modal-header-custom w-full flex items-center justify-between min-w-0\">\n <div class=\"w-full ml-[24px] mr-[8px] flex justify-between items-center min-w-0 gap-[16px]\">\n <div class=\"w-2/8 flex-1\"></div>\n <div class=\"flex libs-ui-font-h4s min-w-0 w-4/8 justify-center flex-1\">\n <libs_ui-components-popover\n [type]=\"'text'\"\n [config]=\"{ zIndex: zIndex() }\">\n {{ fileView()?.name }}\n </libs_ui-components-popover>\n </div>\n @if (buttons()?.length) {\n <div class=\"flex gap-[8px] items-center w-2/8 justify-end flex-1\">\n @for (button of buttons(); track button.key) {\n <libs_ui-components-buttons-button\n [type]=\"button.type || 'button-third'\"\n [label]=\"button.label || ''\"\n [classIconLeft]=\"button.classIconLeft || ''\"\n [iconOnlyType]=\"button.iconOnlyType || false\"\n [classInclude]=\"button.classInclude || '!py-[4px] !px-[12px]'\"\n (outClick)=\"button.action?.(index())\" />\n }\n <div class=\"h-[12px] libs-ui-border-left-general\"></div>\n </div>\n }\n </div>\n </div>\n <div class=\"libs-ui-modal-body-custom h-full w-full flex rounded-b-[8px] overflow-hidden relative\">\n @if (index() > 0) {\n <div class=\"absolute top-[50%] left-[24px] transform -translate-y-[50%] z-[1]\">\n <libs_ui-components-buttons-button\n [type]=\"'button-outline'\"\n [iconOnlyType]=\"true\"\n [classInclude]=\"'!p-[11px] !rounded-[8px]'\"\n [classIconLeft]=\"'libs-ui-icon-chevron-right rotate-180 before:!text-[20px]'\"\n (outClick)=\"handlerPrev()\" />\n </div>\n }\n @if (fileView(); as fileView) {\n @if (fileView | LibsUiPipesCheckFileExtensionPipe: 'image') {\n <div class=\"w-full h-full relative flex items-center justify-center\">\n @if (fileView.url || fileView.origin_url; as url) {\n <img\n [src]=\"url\"\n alt=\"\"\n class=\"max-w-full max-h-full object-contain\"\n (load)=\"handlerOnLoad()\"\n (error)=\"handlerImageError($event)\" />\n @if (loading()) {\n <libs_ui-components-spinner [size]=\"'medium'\" />\n }\n }\n </div>\n } @else {\n <iframe\n id=\"google\"\n [class.hidden]=\"loading()\"\n [src]=\"fileView.urlFile | LibsUiPipesSecurityTrustPipe: 'resourceUrl' | async\"\n width=\"100%\"\n height=\"100%\"\n
|
|
92
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<libs_ui-components-modal\n [minWidth]=\"'1200px'\"\n [headerConfig]=\"{ ignoreHeaderTheme: true, classButtonCloseInclude: '!mr-[24px]' }\"\n [bodyConfig]=\"{ classInclude: '!p-0', scrollOverlayOptions: { scrollX: 'hidden', scrollY: 'hidden' } }\"\n [footerConfig]=\"{ hidden: true }\"\n [zIndex]=\"zIndex()\"\n [buttonsFooter]=\"[]\"\n [mode]=\"'center'\"\n (outEvent)=\"handlerClose($event)\">\n <div class=\"libs-ui-modal-header-custom w-full flex items-center justify-between min-w-0\">\n <div class=\"w-full ml-[24px] mr-[8px] flex justify-between items-center min-w-0 gap-[16px]\">\n <div class=\"w-2/8 flex-1\"></div>\n <div class=\"flex libs-ui-font-h4s min-w-0 w-4/8 justify-center flex-1\">\n <libs_ui-components-popover\n [type]=\"'text'\"\n [config]=\"{ zIndex: zIndex() }\">\n {{ fileView()?.name }}\n </libs_ui-components-popover>\n </div>\n @if (buttons()?.length) {\n <div class=\"flex gap-[8px] items-center w-2/8 justify-end flex-1\">\n @for (button of buttons(); track button.key) {\n <libs_ui-components-buttons-button\n [type]=\"button.type || 'button-third'\"\n [label]=\"button.label || ''\"\n [classIconLeft]=\"button.classIconLeft || ''\"\n [classIconRight]=\"button.classIconRight || ''\"\n [iconOnlyType]=\"button.iconOnlyType || false\"\n [classInclude]=\"button.classInclude || '!py-[4px] !px-[12px]'\"\n (outClick)=\"button.action?.(index())\" />\n }\n <div class=\"h-[12px] libs-ui-border-left-general\"></div>\n </div>\n }\n </div>\n </div>\n <div class=\"libs-ui-modal-body-custom h-full w-full flex rounded-b-[8px] overflow-hidden relative\">\n @if (index() > 0) {\n <div class=\"absolute top-[50%] left-[24px] transform -translate-y-[50%] z-[1]\">\n <libs_ui-components-buttons-button\n [type]=\"'button-outline'\"\n [iconOnlyType]=\"true\"\n [classInclude]=\"'!p-[11px] !rounded-[8px]'\"\n [classIconLeft]=\"'libs-ui-icon-chevron-right rotate-180 before:!text-[20px]'\"\n (outClick)=\"handlerPrev()\" />\n </div>\n }\n @if (fileView(); as fileView) {\n @if (fileView | LibsUiPipesCheckFileExtensionPipe: 'image') {\n <div class=\"w-full h-full relative flex items-center justify-center\">\n @if (fileView.url || fileView.origin_url; as url) {\n <img\n [src]=\"url\"\n alt=\"\"\n class=\"max-w-full max-h-full object-contain\"\n (load)=\"handlerOnLoad()\"\n (error)=\"handlerImageError($event)\" />\n @if (loading()) {\n <libs_ui-components-spinner [size]=\"'medium'\" />\n }\n }\n </div>\n } @else {\n <iframe\n id=\"google\"\n title=\"File preview\"\n [class.hidden]=\"loading()\"\n [src]=\"fileView.urlFile ?? '' | LibsUiPipesSecurityTrustPipe: 'resourceUrl' | async\"\n width=\"100%\"\n height=\"100%\"\n class=\"border-0\"\n allowfullscreen=\"allowfullscreen\"\n (load)=\"handlerOnLoad()\"></iframe>\n @if (loading()) {\n <libs_ui-components-skeleton [class]=\"'w-full h-full'\" />\n }\n }\n @if (index() < data().length - 1) {\n <div class=\"absolute top-[50%] right-[24px] transform -translate-y-[50%] z-[1]\">\n <libs_ui-components-buttons-button\n [type]=\"'button-outline'\"\n [iconOnlyType]=\"true\"\n [classInclude]=\"'!p-[11px] !rounded-[8px]'\"\n [classIconLeft]=\"'libs-ui-icon-chevron-right before:!text-[20px]'\"\n (outClick)=\"handlerNext()\" />\n </div>\n }\n }\n </div>\n</libs_ui-components-modal>\n" }]
|
|
86
93
|
}], ctorParameters: () => [{ type: undefined, decorators: [{
|
|
87
94
|
type: Optional
|
|
88
95
|
}, {
|
|
89
96
|
type: Inject,
|
|
90
97
|
args: [LINK_IMAGE_ERROR_TOKEN_INJECT]
|
|
91
98
|
}] }] });
|
|
92
|
-
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHJldmlldy1maWxlLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL2xpYnMtdWkvY29tcG9uZW50cy9wcmV2aWV3LWZpbGUvc3JjL3ByZXZpZXctZmlsZS5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi9saWJzLXVpL2NvbXBvbmVudHMvcHJldmlldy1maWxlL3NyYy9wcmV2aWV3LWZpbGUuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQzVDLE9BQU8sRUFBRSx1QkFBdUIsRUFBRSxTQUFTLEVBQUUsUUFBUSxFQUFFLE1BQU0sRUFBRSxLQUFLLEVBQUUsS0FBSyxFQUFFLFFBQVEsRUFBRSxNQUFNLEVBQUUsTUFBTSxFQUFFLFNBQVMsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUN4SSxPQUFPLEVBQVcsc0NBQXNDLEVBQUUsTUFBTSxvQ0FBb0MsQ0FBQztBQUNyRyxPQUFPLEVBQUUsOEJBQThCLEVBQW9CLE1BQU0sMkJBQTJCLENBQUM7QUFDN0YsT0FBTyxFQUFFLGdDQUFnQyxFQUFFLE1BQU0sNkJBQTZCLENBQUM7QUFDL0UsT0FBTyxFQUFFLGlDQUFpQyxFQUFFLE1BQU0sOEJBQThCLENBQUM7QUFDakYsT0FBTyxFQUFFLGdDQUFnQyxFQUFFLE1BQU0sNkJBQTZCLENBQUM7QUFFL0UsT0FBTyxFQUFFLGlDQUFpQyxFQUFFLE1BQU0scUNBQXFDLENBQUM7QUFDeEYsT0FBTyxFQUFFLDRCQUE0QixFQUFFLE1BQU0sK0JBQStCLENBQUM7QUFDN0UsT0FBTyxFQUFFLDZCQUE2QixFQUFFLE1BQU0sZ0JBQWdCLENBQUM7O0FBbUIvRCxNQUFNLE9BQU8sb0NBQW9DO0lBMEJ3QjtJQXpCN0QsT0FBTyxHQUFHLE1BQU0sQ0FBQyxJQUFJLENBQUMsQ0FBQztJQUN2QixRQUFRLEdBQUcsUUFBUSxDQUFDLEdBQUcs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aWpCQUN0QyxpQ0FBaUMsMEVBQ2pDLGdDQUFnQzs7NEZBSXZCLG9DQUFvQztrQkFqQmhELFNBQVM7K0JBRUUsaUNBQWlDLGNBRS9CLElBQUksV0FDUDt3QkFDUCxTQUFTO3dCQUNULDhCQUE4Qjt3QkFDOUIsNEJBQTRCO3dCQUM1QixpQ0FBaUM7d0JBQ2pDLGdDQUFnQzt3QkFDaEMsc0NBQXNDO3dCQUN0QyxpQ0FBaUM7d0JBQ2pDLGdDQUFnQztxQkFDakMsbUJBQ2dCLHVCQUF1QixDQUFDLE1BQU07OzBCQTRCbEMsUUFBUTs7MEJBQUksTUFBTTsyQkFBQyw2QkFBNkIiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBBc3luY1BpcGUgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuaW1wb3J0IHsgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksIENvbXBvbmVudCwgY29tcHV0ZWQsIEluamVjdCwgaW5wdXQsIG1vZGVsLCBPcHRpb25hbCwgb3V0cHV0LCBzaWduYWwsIHVudHJhY2tlZCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgSUJ1dHRvbiwgTGlic1VpQ29tcG9uZW50c0J1dHRvbnNCdXR0b25Db21wb25lbnQgfSBmcm9tICdAbGlicy11aS9jb21wb25lbnRzLWJ1dHRvbnMtYnV0dG9uJztcbmltcG9ydCB7IExpYnNVaUNvbXBvbmVudHNNb2RhbENvbXBvbmVudCwgVFlQRV9NT0RBTF9FVkVOVCB9IGZyb20gJ0BsaWJzLXVpL2NvbXBvbmVudHMtbW9kYWwnO1xuaW1wb3J0IHsgTGlic1VpQ29tcG9uZW50c1BvcG92ZXJDb21wb25lbnQgfSBmcm9tICdAbGlicy11aS9jb21wb25lbnRzLXBvcG92ZXInO1xuaW1wb3J0IHsgTGlic1VpQ29tcG9uZW50c1NrZWxldG9uQ29tcG9uZW50IH0gZnJvbSAnQGxpYnMtdWkvY29tcG9uZW50cy1za2VsZXRvbic7XG5pbXBvcnQgeyBMaWJzVWlDb21wb25lbnRzU3Bpbm5lckNvbXBvbmVudCB9IGZyb20gJ0BsaWJzLXVpL2NvbXBvbmVudHMtc3Bpbm5lcic7XG5pbXBvcnQgeyBJRXZlbnQsIElGaWxlIH0gZnJvbSAnQGxpYnMtdWkvaW50ZXJmYWNlcy10eXBlcyc7XG5pbXBvcnQgeyBMaWJzVWlQaXBlc0NoZWNrRmlsZUV4dGVuc2lvblBpcGUgfSBmcm9tICdAbGlicy11aS9waXBlcy1jaGVjay1maWxlLWV4dGVuc2lvbic7XG5pbXBvcnQgeyBMaWJzVWlQaXBlc1NlY3VyaXR5VHJ1c3RQaXBlIH0gZnJvbSAnQGxpYnMtdWkvcGlwZXMtc2VjdXJpdHktdHJ1c3QnO1xuaW1wb3J0IHsgTElOS19JTUFHRV9FUlJPUl9UT0tFTl9JTkpFQ1QgfSBmcm9tICdAbGlicy11aS91dGlscyc7XG5cbkBDb21wb25lbnQoe1xuICAvLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgQGFuZ3VsYXItZXNsaW50L2NvbXBvbmVudC1zZWxlY3RvclxuICBzZWxlY3RvcjogJ2xpYnNfdWktY29tcG9uZW50cy1wcmV2aWV3X2ZpbGUnLFxuICB0ZW1wbGF0ZVVybDogJy4vcHJldmlldy1maWxlLmNvbXBvbmVudC5odG1sJyxcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcbiAgaW1wb3J0czogW1xuICAgIEFzeW5jUGlwZSxcbiAgICBMaWJzVWlDb21wb25lbnRzTW9kYWxDb21wb25lbnQsXG4gICAgTGlic1VpUGlwZXNTZWN1cml0eVRydXN0UGlwZSxcbiAgICBMaWJzVWlDb21wb25lbnRzU2tlbGV0b25Db21wb25lbnQsXG4gICAgTGlic1VpQ29tcG9uZW50c1BvcG92ZXJDb21wb25lbnQsXG4gICAgTGlic1VpQ29tcG9uZW50c0J1dHRvbnNCdXR0b25Db21wb25lbnQsXG4gICAgTGlic1VpUGlwZXNDaGVja0ZpbGVFeHRlbnNpb25QaXBlLFxuICAgIExpYnNVaUNvbXBvbmVudHNTcGlubmVyQ29tcG9uZW50LFxuICBdLFxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcbn0pXG5leHBvcnQgY2xhc3MgTGlic1VpQ29tcG9uZW50c1ByZXZpZXdGaWxlQ29tcG9uZW50IHtcbiAgcHJvdGVjdGVkIGxvYWRpbmcgPSBzaWduYWwodHJ1ZSk7XG4gIHByb3RlY3RlZCBmaWxlVmlldyA9IGNvbXB1dGVkKCgpID0+IHtcbiAgICBjb25zdCBmaWxlID0gdGhpcy5kYXRhKClbdGhpcy5pbmRleCgpXTtcblxuICAgIGlmICghZmlsZSkge1xuICAgICAgcmV0dXJuIG51bGw7XG4gICAgfVxuICAgIHVudHJhY2tlZCgoKSA9PiB0aGlzLmxvYWRpbmcuc2V0KHRydWUpKTtcbiAgICBjb25zdCBtaW1lVHlwZSA9IGZpbGUubWltZXR5cGUgfHwgZmlsZS5maWxlPy50eXBlO1xuICAgIGNvbnN0IHVybCA9IGZpbGUudXJsIHx8IGZpbGUub3JpZ2luX3VybDtcblxuICAgIGlmIChtaW1lVHlwZSAmJiB0aGlzLm1pbmVUeXBlTWljcm9Tb2Z0U3VwcG9ydCgpLmluY2x1ZGVzKG1pbWVUeXBlKSkge1xuICAgICAgcmV0dXJuIHsgLi4uZmlsZSwgdXJsRmlsZTogYGh0dHBzOi8vdmlldy5vZmZpY2VhcHBzLmxpdmUuY29tL29wL2VtYmVkLmFzcHg/c3JjPSR7ZW5jb2RlVVJJQ29tcG9uZW50KHVybCB8fCAnJyl9YCB9O1xuICAgIH1cblxuICAgIHJldHVybiB7IC4uLmZpbGUsIHVybEZpbGU6IGBodHRwczovL2RvY3MuZ29vZ2xlLmNvbS9hL3VtZC5lZHUvdmlld2VyP3VybD0ke2VuY29kZVVSSUNvbXBvbmVudCh1cmwgfHwgJycpfSZlbWJlZGRlZD10cnVlYCB9O1xuICB9KTtcblxuICByZWFkb25seSB6SW5kZXggPSBpbnB1dDxudW1iZXI+KCk7XG4gIHJlYWRvbmx5IGluZGV4ID0gbW9kZWwucmVxdWlyZWQ8bnVtYmVyPigpO1xuICByZWFkb25seSBkYXRhID0gaW5wdXQucmVxdWlyZWQ8SUZpbGVbXT4oKTtcbiAgcmVhZG9ubHkgYnV0dG9ucyA9IGlucHV0PElCdXR0b25bXT4oKTtcblxuICByZWFkb25seSBvdXRDbG9zZSA9IG91dHB1dDx2b2lkPigpO1xuXG4gIGNvbnN0cnVjdG9yKEBPcHRpb25hbCgpIEBJbmplY3QoTElOS19JTUFHRV9FUlJPUl9UT0tFTl9JTkpFQ1QpIHByaXZhdGUgbGlua0ltYWdlRXJyb3I6IHN0cmluZykge31cblxuICBwcm90ZWN0ZWQgYXN5bmMgaGFuZGxlck9uTG9hZCgpIHtcbiAgICB0aGlzLmxvYWRpbmcuc2V0KGZhbHNlKTtcbiAgfVxuXG4gIHByb3RlY3RlZCBhc3luYyBoYW5kbGVyQ2xvc2UodHlwZTogVFlQRV9NT0RBTF9FVkVOVCkge1xuICAgIGlmICh0eXBlID09PSAnY2xvc2UnKSB7XG4gICAgICB0aGlzLm91dENsb3NlLmVtaXQoKTtcbiAgICB9XG4gIH1cblxuICBwcml2YXRlIG1pbmVUeXBlTWljcm9Tb2Z0U3VwcG9ydCgpIHtcbiAgICByZXR1cm4gW1xuICAgICAgJ2FwcGxpY2F0aW9uL21zd29yZCcsXG4gICAgICAnYXBwbGljYXRpb24vdm5kLm9wZW54bWxmb3JtYXRzLW9mZmljZWRvY3VtZW50LndvcmRwcm9jZXNzaW5nbWwuZG9jdW1lbnQnLFxuICAgICAgJ2FwcGxpY2F0aW9uL3ZuZC5vcGVueG1sZm9ybWF0cy1vZmZpY2Vkb2N1bWVudC53b3JkcHJvY2Vzc2luZ21sLnRlbXBsYXRlJyxcbiAgICAgICdhcHBsaWNhdGlvbi92bmQub3BlbnhtbGZvcm1hdHMtb2ZmaWNlZG9jdW1lbnQuc3ByZWFkc2hlZXRtbC5zaGVldCcsXG4gICAgICAnYXBwbGljYXRpb24vdm5kLm1zLWV4Y2VsLnNoZWV0Lm1hY3JvRW5hYmxlZC4xMicsXG4gICAgICAnYXBwbGljYXRpb24vdm5kLm1zLWV4Y2VsJyxcbiAgICAgICdhcHBsaWNhdGlvbi92bmQub3BlbnhtbGZvcm1hdHMtb2ZmaWNlZG9jdW1lbnQuc3ByZWFkc2hlZXRtbC50ZW1wbGF0ZScsXG4gICAgICAnYXBwbGljYXRpb24vdm5kLm1zLXBvd2VycG9pbnQnLFxuICAgICAgJ2FwcGxpY2F0aW9uL3ZuZC5vcGVueG1sZm9ybWF0cy1vZmZpY2Vkb2N1bWVudC5wcmVzZW50YXRpb25tbC5wcmVzZW50YXRpb24nLFxuICAgICAgJ2FwcGxpY2F0aW9uL3ZuZC5tcy1wb3dlcnBvaW50LnByZXNlbnRhdGlvbi5tYWNyb0VuYWJsZWQuMTInLFxuICAgICAgJ2FwcGxpY2F0aW9uL3ZuZC5vcGVueG1sZm9ybWF0cy1vZmZpY2Vkb2N1bWVudC5wcmVzZW50YXRpb25tbC5zbGlkZXNob3cnLFxuICAgIF07XG4gIH1cblxuICBwcm90ZWN0ZWQgaGFuZGxlclByZXYoKSB7XG4gICAgdGhpcy5pbmRleC51cGRhdGUoKHZhbHVlKSA9PiB2YWx1ZSAtIDEpO1xuICB9XG5cbiAgcHJvdGVjdGVkIGhhbmRsZXJOZXh0KCkge1xuICAgIHRoaXMuaW5kZXgudXBkYXRlKCh2YWx1ZSkgPT4gdmFsdWUgKyAxKTtcbiAgfVxuXG4gIHByb3RlY3RlZCBhc3luYyBoYW5kbGVySW1hZ2VFcnJvcihldmVudDogRXZlbnQpIHtcbiAgICBpZiAoIXRoaXMubGlua0ltYWdlRXJyb3IpIHtcbiAgICAgIHJldHVybjtcbiAgICB9XG4gICAgKGV2ZW50IGFzIElFdmVudCkudGFyZ2V0LnNyYyA9IHRoaXMubGlua0ltYWdlRXJyb3I7XG4gIH1cbn1cbiIsIjxsaWJzX3VpLWNvbXBvbmVudHMtbW9kYWxcbiAgW21pbldpZHRoXT1cIicxMjAwcHgnXCJcbiAgW2hlYWRlckNvbmZpZ109XCJ7IGlnbm9yZUhlYWRlclRoZW1lOiB0cnVlLCBjbGFzc0J1dHRvbkNsb3NlSW5jbHVkZTogJyFtci1bMjRweF0nIH1cIlxuICBbYm9keUNvbmZpZ109XCJ7IGNsYXNzSW5jbHVkZTogJyFwLTAnLCBzY3JvbGxPdmVybGF5T3B0aW9uczogeyBzY3JvbGxYOiAnaGlkZGVuJywgc2Nyb2xsWTogJ2hpZGRlbicgfSB9XCJcbiAgW2Zvb3RlckNvbmZpZ109XCJ7IGhpZGRlbjogdHJ1ZSB9XCJcbiAgW3pJbmRleF09XCJ6SW5kZXgoKVwiXG4gIFtidXR0b25zRm9vdGVyXT1cIltdXCJcbiAgW21vZGVdPVwiJ2NlbnRlcidcIlxuICAob3V0RXZlbnQpPVwiaGFuZGxlckNsb3NlKCRldmVudClcIj5cbiAgPGRpdiBjbGFzcz1cImxpYnMtdWktbW9kYWwtaGVhZGVyLWN1c3RvbSB3LWZ1bGwgZmxleCBpdGVtcy1jZW50ZXIganVzdGlmeS1iZXR3ZWVuIG1pbi13LTBcIj5cbiAgICA8ZGl2IGNsYXNzPVwidy1mdWxsIG1sLVsyNHB4XSBtci1bOHB4XSBmbGV4IGp1c3RpZnktYmV0d2VlbiBpdGVtcy1jZW50ZXIgbWluLXctMCBnYXAtWzE2cHhdXCI+XG4gICAgICA8ZGl2IGNsYXNzPVwidy0yLzggZmxleC0xXCI+PC9kaXY+XG4gICAgICA8ZGl2IGNsYXNzPVwiZmxleCBsaWJzLXVpLWZvbnQtaDRzIG1pbi13LTAgdy00LzgganVzdGlmeS1jZW50ZXIgZmxleC0xXCI+XG4gICAgICAgIDxsaWJzX3VpLWNvbXBvbmVudHMtcG9wb3ZlclxuICAgICAgICAgIFt0eXBlXT1cIid0ZXh0J1wiXG4gICAgICAgICAgW2NvbmZpZ109XCJ7IHpJbmRleDogekluZGV4KCkgfVwiPlxuICAgICAgICAgIHt7IGZpbGVWaWV3KCk/Lm5hbWUgfX1cbiAgICAgICAgPC9saWJzX3VpLWNvbXBvbmVudHMtcG9wb3Zlcj5cbiAgICAgIDwvZGl2PlxuICAgICAgQGlmIChidXR0b25zKCk/Lmxlbmd0aCkge1xuICAgICAgICA8ZGl2IGNsYXNzPVwiZmxleCBnYXAtWzhweF0gaXRlbXMtY2VudGVyIHctMi84IGp1c3RpZnktZW5kIGZsZXgtMVwiPlxuICAgICAgICAgIEBmb3IgKGJ1dHRvbiBvZiBidXR0b25zKCk7IHRyYWNrIGJ1dHRvbi5rZXkpIHtcbiAgICAgICAgICAgIDxsaWJzX3VpLWNvbXBvbmVudHMtYnV0dG9ucy1idXR0b25cbiAgICAgICAgICAgICAgW3R5cGVdPVwiYnV0dG9uLnR5cGUgfHwgJ2J1dHRvbi10aGlyZCdcIlxuICAgICAgICAgICAgICBbbGFiZWxdPVwiYnV0dG9uLmxhYmVsIHx8ICcnXCJcbiAgICAgICAgICAgICAgW2NsYXNzSWNvbkxlZnRdPVwiYnV0dG9uLmNsYXNzSWNvbkxlZnQgfHwgJydcIlxuICAgICAgICAgICAgICBbaWNvbk9ubHlUeXBlXT1cImJ1dHRvbi5pY29uT25seVR5cGUgfHwgZmFsc2VcIlxuICAgICAgICAgICAgICBbY2xhc3NJbmNsdWRlXT1cImJ1dHRvbi5jbGFzc0luY2x1ZGUgfHwgJyFweS1bNHB4XSAhcHgtWzEycHhdJ1wiXG4gICAgICAgICAgICAgIChvdXRDbGljayk9XCJidXR0b24uYWN0aW9uPy4oaW5kZXgoKSlcIiAvPlxuICAgICAgICAgIH1cbiAgICAgICAgICA8ZGl2IGNsYXNzPVwiaC1bMTJweF0gbGlicy11aS1ib3JkZXItbGVmdC1nZW5lcmFsXCI+PC9kaXY+XG4gICAgICAgIDwvZGl2PlxuICAgICAgfVxuICAgIDwvZGl2PlxuICA8L2Rpdj5cbiAgPGRpdiBjbGFzcz1cImxpYnMtdWktbW9kYWwtYm9keS1jdXN0b20gaC1mdWxsIHctZnVsbCBmbGV4IHJvdW5kZWQtYi1bOHB4XSBvdmVyZmxvdy1oaWRkZW4gcmVsYXRpdmVcIj5cbiAgICBAaWYgKGluZGV4KCkgPiAwKSB7XG4gICAgICA8ZGl2IGNsYXNzPVwiYWJzb2x1dGUgdG9wLVs1MCVdIGxlZnQtWzI0cHhdIHRyYW5zZm9ybSAtdHJhbnNsYXRlLXktWzUwJV0gei1bMV1cIj5cbiAgICAgICAgPGxpYnNfdWktY29tcG9uZW50cy1idXR0b25zLWJ1dHRvblxuICAgICAgICAgIFt0eXBlXT1cIididXR0b24tb3V0bGluZSdcIlxuICAgICAgICAgIFtpY29uT25seVR5cGVdPVwidHJ1ZVwiXG4gICAgICAgICAgW2NsYXNzSW5jbHVkZV09XCInIXAtWzExcHhdICFyb3VuZGVkLVs4cHhdJ1wiXG4gICAgICAgICAgW2NsYXNzSWNvbkxlZnRdPVwiJ2xpYnMtdWktaWNvbi1jaGV2cm9uLXJpZ2h0IHJvdGF0ZS0xODAgYmVmb3JlOiF0ZXh0LVsyMHB4XSdcIlxuICAgICAgICAgIChvdXRDbGljayk9XCJoYW5kbGVyUHJldigpXCIgLz5cbiAgICAgIDwvZGl2PlxuICAgIH1cbiAgICBAaWYgKGZpbGVWaWV3KCk7IGFzIGZpbGVWaWV3KSB7XG4gICAgICBAaWYgKGZpbGVWaWV3IHwgTGlic1VpUGlwZXNDaGVja0ZpbGVFeHRlbnNpb25QaXBlOiAnaW1hZ2UnKSB7XG4gICAgICAgIDxkaXYgY2xhc3M9XCJ3LWZ1bGwgaC1mdWxsIHJlbGF0aXZlIGZsZXggaXRlbXMtY2VudGVyIGp1c3RpZnktY2VudGVyXCI+XG4gICAgICAgICAgQGlmIChmaWxlVmlldy51cmwgfHwgZmlsZVZpZXcub3JpZ2luX3VybDsgYXMgdXJsKSB7XG4gICAgICAgICAgICA8aW1nXG4gICAgICAgICAgICAgIFtzcmNdPVwidXJsXCJcbiAgICAgICAgICAgICAgYWx0PVwiXCJcbiAgICAgICAgICAgICAgY2xhc3M9XCJtYXgtdy1mdWxsIG1heC1oLWZ1bGwgb2JqZWN0LWNvbnRhaW5cIlxuICAgICAgICAgICAgICAobG9hZCk9XCJoYW5kbGVyT25Mb2FkKClcIlxuICAgICAgICAgICAgICAoZXJyb3IpPVwiaGFuZGxlckltYWdlRXJyb3IoJGV2ZW50KVwiIC8+XG4gICAgICAgICAgICBAaWYgKGxvYWRpbmcoKSkge1xuICAgICAgICAgICAgICA8bGlic191aS1jb21wb25lbnRzLXNwaW5uZXIgW3NpemVdPVwiJ21lZGl1bSdcIiAvPlxuICAgICAgICAgICAgfVxuICAgICAgICAgIH1cbiAgICAgICAgPC9kaXY+XG4gICAgICB9IEBlbHNlIHtcbiAgICAgICAgPGlmcmFtZVxuICAgICAgICAgIGlkPVwiZ29vZ2xlXCJcbiAgICAgICAgICBbY2xhc3MuaGlkZGVuXT1cImxvYWRpbmcoKVwiXG4gICAgICAgICAgW3NyY109XCJmaWxlVmlldy51cmxGaWxlIHwgTGlic1VpUGlwZXNTZWN1cml0eVRydXN0UGlwZTogJ3Jlc291cmNlVXJsJyB8IGFzeW5jXCJcbiAgICAgICAgICB3aWR0aD1cIjEwMCVcIlxuICAgICAgICAgIGhlaWdodD1cIjEwMCVcIlxuICAgICAgICAgIGZyYW1lYm9yZGVyPVwiMFwiXG4gICAgICAgICAgYWxsb3dmdWxsc2NyZWVuPVwiYWxsb3dmdWxsc2NyZWVuXCJcbiAgICAgICAgICAobG9hZCk9XCJoYW5kbGVyT25Mb2FkKClcIj48L2lmcmFtZT5cbiAgICAgICAgQGlmIChsb2FkaW5nKCkpIHtcbiAgICAgICAgICA8bGlic191aS1jb21wb25lbnRzLXNrZWxldG9uIFtjbGFzc109XCIndy1mdWxsIGgtZnVsbCdcIiAvPlxuICAgICAgICB9XG4gICAgICB9XG4gICAgICBAaWYgKGluZGV4KCkgPCBkYXRhKCkubGVuZ3RoIC0gMSkge1xuICAgICAgICA8ZGl2IGNsYXNzPVwiYWJzb2x1dGUgdG9wLVs1MCVdIHJpZ2h0LVsyNHB4XSB0cmFuc2Zvcm0gLXRyYW5zbGF0ZS15LVs1MCVdIHotWzFdXCI+XG4gICAgICAgICAgPGxpYnNfdWktY29tcG9uZW50cy1idXR0b25zLWJ1dHRvblxuICAgICAgICAgICAgW3R5cGVdPVwiJ2J1dHRvbi1vdXRsaW5lJ1wiXG4gICAgICAgICAgICBbaWNvbk9ubHlUeXBlXT1cInRydWVcIlxuICAgICAgICAgICAgW2NsYXNzSW5jbHVkZV09XCInIXAtWzExcHhdICFyb3VuZGVkLVs4cHhdJ1wiXG4gICAgICAgICAgICBbY2xhc3NJY29uTGVmdF09XCInbGlicy11aS1pY29uLWNoZXZyb24tcmlnaHQgYmVmb3JlOiF0ZXh0LVsyMHB4XSdcIlxuICAgICAgICAgICAgKG91dENsaWNrKT1cImhhbmRsZXJOZXh0KClcIiAvPlxuICAgICAgICA8L2Rpdj5cbiAgICAgIH1cbiAgICB9XG4gIDwvZGl2PlxuPC9saWJzX3VpLWNvbXBvbmVudHMtbW9kYWw+XG4iXX0=
|
|
99
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHJldmlldy1maWxlLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL2xpYnMtdWkvY29tcG9uZW50cy9wcmV2aWV3LWZpbGUvc3JjL3ByZXZpZXctZmlsZS5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi9saWJzLXVpL2NvbXBvbmVudHMvcHJldmlldy1maWxlL3NyYy9wcmV2aWV3LWZpbGUuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQzVDLE9BQU8sRUFBRSx1QkFBdUIsRUFBRSxTQUFTLEVBQUUsUUFBUSxFQUFFLE1BQU0sRUFBRSxLQUFLLEVBQUUsS0FBSyxFQUFFLFFBQVEsRUFBRSxNQUFNLEVBQUUsTUFBTSxFQUFFLFNBQVMsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUN4SSxPQUFPLEVBQVcsc0NBQXNDLEVBQUUsTUFBTSxvQ0FBb0MsQ0FBQztBQUNyRyxPQUFPLEVBQUUsOEJBQThCLEVBQW9CLE1BQU0sMkJBQTJCLENBQUM7QUFDN0YsT0FBTyxFQUFFLGdDQUFnQyxFQUFFLE1BQU0sNkJBQTZCLENBQUM7QUFDL0UsT0FBTyxFQUFFLGlDQUFpQyxFQUFFLE1BQU0sOEJBQThCLENBQUM7QUFDakYsT0FBTyxFQUFFLGdDQUFnQyxFQUFFLE1BQU0sNkJBQTZCLENBQUM7QUFFL0UsT0FBTyxFQUFFLGlDQUFpQyxFQUFFLE1BQU0scUNBQXFDLENBQUM7QUFDeEYsT0FBTyxFQUFFLDRCQUE0QixFQUFFLE1BQU0sK0JBQStCLENBQUM7QUFDN0UsT0FBTyxFQUFFLDZCQUE2QixFQUFFLE1BQU0sZ0JBQWdCLENBQUM7O0FBbUIvRCxNQUFNLE9BQU8sb0NBQW9DO0lBZ0NpQztJQS9CdEUsT0FBTyxHQUFHLE1BQU0sQ0FBQyxJQUFJLENBQUMsQ0FBQztJQUN2QixRQUFRLEdBQUcsUUFBUSxDQUFDLEdBQUcs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UyxLQUFLLENBQUMsaUJBQWlCLENBQUMsS0FBWTtRQUM1QyxJQUFJLENBQUMsSUFBSSxDQUFDLGNBQWMsRUFBRSxDQUFDO1lBQ3pCLE9BQU87UUFDVCxDQUFDO1FBQ0EsS0FBZ0IsQ0FBQyxNQUFNLENBQUMsR0FBRyxHQUFHLElBQUksQ0FBQyxjQUFjLENBQUM7SUFDckQsQ0FBQzt3R0EzRVUsb0NBQW9DLGtCQWdDZiw2QkFBNkI7NEZBaENsRCxvQ0FBb0MseXpCQzdCakQsMjBIQTBGQSx1Q0R4RUksU0FBUyw4Q0FDVCw4QkFBOEIsNndCQUM5Qiw0QkFBNEIscUVBQzVCLGlDQUFpQyw0RkFDakMsZ0NBQWdDLG9nQkFDaEMsc0NBQXNDLGlqQkFDdEMsaUNBQWlDLDBFQUNqQyxnQ0FBZ0M7OzRGQUl2QixvQ0FBb0M7a0JBakJoRCxTQUFTOytCQUVFLGlDQUFpQyxjQUUvQixJQUFJLFdBQ1A7d0JBQ1AsU0FBUzt3QkFDVCw4QkFBOEI7d0JBQzlCLDRCQUE0Qjt3QkFDNUIsaUNBQWlDO3dCQUNqQyxnQ0FBZ0M7d0JBQ2hDLHNDQUFzQzt3QkFDdEMsaUNBQWlDO3dCQUNqQyxnQ0FBZ0M7cUJBQ2pDLG1CQUNnQix1QkFBdUIsQ0FBQyxNQUFNOzswQkFrQ2xDLFFBQVE7OzBCQUFJLE1BQU07MkJBQUMsNkJBQTZCIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQXN5bmNQaXBlIH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcbmltcG9ydCB7IENoYW5nZURldGVjdGlvblN0cmF0ZWd5LCBDb21wb25lbnQsIGNvbXB1dGVkLCBJbmplY3QsIGlucHV0LCBtb2RlbCwgT3B0aW9uYWwsIG91dHB1dCwgc2lnbmFsLCB1bnRyYWNrZWQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IElCdXR0b24sIExpYnNVaUNvbXBvbmVudHNCdXR0b25zQnV0dG9uQ29tcG9uZW50IH0gZnJvbSAnQGxpYnMtdWkvY29tcG9uZW50cy1idXR0b25zLWJ1dHRvbic7XG5pbXBvcnQgeyBMaWJzVWlDb21wb25lbnRzTW9kYWxDb21wb25lbnQsIFRZUEVfTU9EQUxfRVZFTlQgfSBmcm9tICdAbGlicy11aS9jb21wb25lbnRzLW1vZGFsJztcbmltcG9ydCB7IExpYnNVaUNvbXBvbmVudHNQb3BvdmVyQ29tcG9uZW50IH0gZnJvbSAnQGxpYnMtdWkvY29tcG9uZW50cy1wb3BvdmVyJztcbmltcG9ydCB7IExpYnNVaUNvbXBvbmVudHNTa2VsZXRvbkNvbXBvbmVudCB9IGZyb20gJ0BsaWJzLXVpL2NvbXBvbmVudHMtc2tlbGV0b24nO1xuaW1wb3J0IHsgTGlic1VpQ29tcG9uZW50c1NwaW5uZXJDb21wb25lbnQgfSBmcm9tICdAbGlicy11aS9jb21wb25lbnRzLXNwaW5uZXInO1xuaW1wb3J0IHsgSUV2ZW50LCBJRmlsZSB9IGZyb20gJ0BsaWJzLXVpL2ludGVyZmFjZXMtdHlwZXMnO1xuaW1wb3J0IHsgTGlic1VpUGlwZXNDaGVja0ZpbGVFeHRlbnNpb25QaXBlIH0gZnJvbSAnQGxpYnMtdWkvcGlwZXMtY2hlY2stZmlsZS1leHRlbnNpb24nO1xuaW1wb3J0IHsgTGlic1VpUGlwZXNTZWN1cml0eVRydXN0UGlwZSB9IGZyb20gJ0BsaWJzLXVpL3BpcGVzLXNlY3VyaXR5LXRydXN0JztcbmltcG9ydCB7IExJTktfSU1BR0VfRVJST1JfVE9LRU5fSU5KRUNUIH0gZnJvbSAnQGxpYnMtdWkvdXRpbHMnO1xuXG5AQ29tcG9uZW50KHtcbiAgLy8gZXNsaW50LWRpc2FibGUtbmV4dC1saW5lIEBhbmd1bGFyLWVzbGludC9jb21wb25lbnQtc2VsZWN0b3JcbiAgc2VsZWN0b3I6ICdsaWJzX3VpLWNvbXBvbmVudHMtcHJldmlld19maWxlJyxcbiAgdGVtcGxhdGVVcmw6ICcuL3ByZXZpZXctZmlsZS5jb21wb25lbnQuaHRtbCcsXG4gIHN0YW5kYWxvbmU6IHRydWUsXG4gIGltcG9ydHM6IFtcbiAgICBBc3luY1BpcGUsXG4gICAgTGlic1VpQ29tcG9uZW50c01vZGFsQ29tcG9uZW50LFxuICAgIExpYnNVaVBpcGVzU2VjdXJpdHlUcnVzdFBpcGUsXG4gICAgTGlic1VpQ29tcG9uZW50c1NrZWxldG9uQ29tcG9uZW50LFxuICAgIExpYnNVaUNvbXBvbmVudHNQb3BvdmVyQ29tcG9uZW50LFxuICAgIExpYnNVaUNvbXBvbmVudHNCdXR0b25zQnV0dG9uQ29tcG9uZW50LFxuICAgIExpYnNVaVBpcGVzQ2hlY2tGaWxlRXh0ZW5zaW9uUGlwZSxcbiAgICBMaWJzVWlDb21wb25lbnRzU3Bpbm5lckNvbXBvbmVudCxcbiAgXSxcbiAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG59KVxuZXhwb3J0IGNsYXNzIExpYnNVaUNvbXBvbmVudHNQcmV2aWV3RmlsZUNvbXBvbmVudCB7XG4gIHByb3RlY3RlZCBsb2FkaW5nID0gc2lnbmFsKHRydWUpO1xuICBwcm90ZWN0ZWQgZmlsZVZpZXcgPSBjb21wdXRlZCgoKSA9PiB7XG4gICAgY29uc3QgZmlsZSA9IHRoaXMuZGF0YSgpW3RoaXMuaW5kZXgoKV07XG5cbiAgICBpZiAoIWZpbGUpIHtcbiAgICAgIHJldHVybiBudWxsO1xuICAgIH1cbiAgICB1bnRyYWNrZWQoKCkgPT4gdGhpcy5sb2FkaW5nLnNldCh0cnVlKSk7XG4gICAgY29uc3QgbWltZVR5cGUgPSBmaWxlLm1pbWV0eXBlIHx8IGZpbGUuZmlsZT8udHlwZTtcbiAgICBjb25zdCB1cmwgPSBmaWxlLnVybCB8fCBmaWxlLm9yaWdpbl91cmw7XG5cbiAgICBpZiAodGhpcy5pc1NvdXJjZUlmcmFtZSgpKSB7XG4gICAgICByZXR1cm4geyAuLi5maWxlLCB1cmxGaWxlOiB1cmwgfTtcbiAgICB9XG5cbiAgICBpZiAobWltZVR5cGUgJiYgdGhpcy5taW5lVHlwZU1pY3JvU29mdFN1cHBvcnQoKS5pbmNsdWRlcyhtaW1lVHlwZSkpIHtcbiAgICAgIHJldHVybiB7IC4uLmZpbGUsIHVybEZpbGU6IGBodHRwczovL3ZpZXcub2ZmaWNlYXBwcy5saXZlLmNvbS9vcC9lbWJlZC5hc3B4P3NyYz0ke2VuY29kZVVSSUNvbXBvbmVudCh1cmwgfHwgJycpfWAgfTtcbiAgICB9XG5cbiAgICByZXR1cm4geyAuLi5maWxlLCB1cmxGaWxlOiBgaHR0cHM6Ly9kb2NzLmdvb2dsZS5jb20vYS91bWQuZWR1L3ZpZXdlcj91cmw9JHtlbmNvZGVVUklDb21wb25lbnQodXJsIHx8ICcnKX0mZW1iZWRkZWQ9dHJ1ZWAgfTtcbiAgfSk7XG5cbiAgcmVhZG9ubHkgekluZGV4ID0gaW5wdXQ8bnVtYmVyPigpO1xuICByZWFkb25seSBpbmRleCA9IG1vZGVsLnJlcXVpcmVkPG51bWJlcj4oKTtcbiAgcmVhZG9ubHkgZGF0YSA9IGlucHV0LnJlcXVpcmVkPElGaWxlW10+KCk7XG4gIHJlYWRvbmx5IGJ1dHRvbnMgPSBpbnB1dDxJQnV0dG9uW10+KCk7XG4gIHJlYWRvbmx5IGlzU291cmNlSWZyYW1lID0gaW5wdXQ8Ym9vbGVhbj4oKTtcblxuICByZWFkb25seSBvdXRDbG9zZSA9IG91dHB1dDx2b2lkPigpO1xuICByZWFkb25seSBvdXRDaGFuZ2VJbmRleCA9IG91dHB1dDxudW1iZXI+KCk7XG5cbiAgY29uc3RydWN0b3IoQE9wdGlvbmFsKCkgQEluamVjdChMSU5LX0lNQUdFX0VSUk9SX1RPS0VOX0lOSkVDVCkgcHJpdmF0ZSByZWFkb25seSBsaW5rSW1hZ2VFcnJvcjogc3RyaW5nKSB7fVxuXG4gIHByb3RlY3RlZCBhc3luYyBoYW5kbGVyT25Mb2FkKCkge1xuICAgIHRoaXMubG9hZGluZy5zZXQoZmFsc2UpO1xuICB9XG5cbiAgcHJvdGVjdGVkIGFzeW5jIGhhbmRsZXJDbG9zZSh0eXBlOiBUWVBFX01PREFMX0VWRU5UKSB7XG4gICAgaWYgKHR5cGUgPT09ICdjbG9zZScpIHtcbiAgICAgIHRoaXMub3V0Q2xvc2UuZW1pdCgpO1xuICAgIH1cbiAgfVxuXG4gIHByaXZhdGUgbWluZVR5cGVNaWNyb1NvZnRTdXBwb3J0KCkge1xuICAgIHJldHVybiBbXG4gICAgICAnYXBwbGljYXRpb24vbXN3b3JkJyxcbiAgICAgICdhcHBsaWNhdGlvbi92bmQub3BlbnhtbGZvcm1hdHMtb2ZmaWNlZG9jdW1lbnQud29yZHByb2Nlc3NpbmdtbC5kb2N1bWVudCcsXG4gICAgICAnYXBwbGljYXRpb24vdm5kLm9wZW54bWxmb3JtYXRzLW9mZmljZWRvY3VtZW50LndvcmRwcm9jZXNzaW5nbWwudGVtcGxhdGUnLFxuICAgICAgJ2FwcGxpY2F0aW9uL3ZuZC5vcGVueG1sZm9ybWF0cy1vZmZpY2Vkb2N1bWVudC5zcHJlYWRzaGVldG1sLnNoZWV0JyxcbiAgICAgICdhcHBsaWNhdGlvbi92bmQubXMtZXhjZWwuc2hlZXQubWFjcm9FbmFibGVkLjEyJyxcbiAgICAgICdhcHBsaWNhdGlvbi92bmQubXMtZXhjZWwnLFxuICAgICAgJ2FwcGxpY2F0aW9uL3ZuZC5vcGVueG1sZm9ybWF0cy1vZmZpY2Vkb2N1bWVudC5zcHJlYWRzaGVldG1sLnRlbXBsYXRlJyxcbiAgICAgICdhcHBsaWNhdGlvbi92bmQubXMtcG93ZXJwb2ludCcsXG4gICAgICAnYXBwbGljYXRpb24vdm5kLm9wZW54bWxmb3JtYXRzLW9mZmljZWRvY3VtZW50LnByZXNlbnRhdGlvbm1sLnByZXNlbnRhdGlvbicsXG4gICAgICAnYXBwbGljYXRpb24vdm5kLm1zLXBvd2VycG9pbnQucHJlc2VudGF0aW9uLm1hY3JvRW5hYmxlZC4xMicsXG4gICAgICAnYXBwbGljYXRpb24vdm5kLm9wZW54bWxmb3JtYXRzLW9mZmljZWRvY3VtZW50LnByZXNlbnRhdGlvbm1sLnNsaWRlc2hvdycsXG4gICAgXTtcbiAgfVxuXG4gIHByb3RlY3RlZCBoYW5kbGVyUHJldigpIHtcbiAgICB0aGlzLmluZGV4LnVwZGF0ZSgodmFsdWUpID0+IHZhbHVlIC0gMSk7XG4gICAgdGhpcy5vdXRDaGFuZ2VJbmRleC5lbWl0KHRoaXMuaW5kZXgoKSk7XG4gIH1cblxuICBwcm90ZWN0ZWQgaGFuZGxlck5leHQoKSB7XG4gICAgdGhpcy5pbmRleC51cGRhdGUoKHZhbHVlKSA9PiB2YWx1ZSArIDEpO1xuICAgIHRoaXMub3V0Q2hhbmdlSW5kZXguZW1pdCh0aGlzLmluZGV4KCkpO1xuICB9XG5cbiAgcHJvdGVjdGVkIGFzeW5jIGhhbmRsZXJJbWFnZUVycm9yKGV2ZW50OiBFdmVudCkge1xuICAgIGlmICghdGhpcy5saW5rSW1hZ2VFcnJvcikge1xuICAgICAgcmV0dXJuO1xuICAgIH1cbiAgICAoZXZlbnQgYXMgSUV2ZW50KS50YXJnZXQuc3JjID0gdGhpcy5saW5rSW1hZ2VFcnJvcjtcbiAgfVxufVxuIiwiPGxpYnNfdWktY29tcG9uZW50cy1tb2RhbFxuICBbbWluV2lkdGhdPVwiJzEyMDBweCdcIlxuICBbaGVhZGVyQ29uZmlnXT1cInsgaWdub3JlSGVhZGVyVGhlbWU6IHRydWUsIGNsYXNzQnV0dG9uQ2xvc2VJbmNsdWRlOiAnIW1yLVsyNHB4XScgfVwiXG4gIFtib2R5Q29uZmlnXT1cInsgY2xhc3NJbmNsdWRlOiAnIXAtMCcsIHNjcm9sbE92ZXJsYXlPcHRpb25zOiB7IHNjcm9sbFg6ICdoaWRkZW4nLCBzY3JvbGxZOiAnaGlkZGVuJyB9IH1cIlxuICBbZm9vdGVyQ29uZmlnXT1cInsgaGlkZGVuOiB0cnVlIH1cIlxuICBbekluZGV4XT1cInpJbmRleCgpXCJcbiAgW2J1dHRvbnNGb290ZXJdPVwiW11cIlxuICBbbW9kZV09XCInY2VudGVyJ1wiXG4gIChvdXRFdmVudCk9XCJoYW5kbGVyQ2xvc2UoJGV2ZW50KVwiPlxuICA8ZGl2IGNsYXNzPVwibGlicy11aS1tb2RhbC1oZWFkZXItY3VzdG9tIHctZnVsbCBmbGV4IGl0ZW1zLWNlbnRlciBqdXN0aWZ5LWJldHdlZW4gbWluLXctMFwiPlxuICAgIDxkaXYgY2xhc3M9XCJ3LWZ1bGwgbWwtWzI0cHhdIG1yLVs4cHhdIGZsZXgganVzdGlmeS1iZXR3ZWVuIGl0ZW1zLWNlbnRlciBtaW4tdy0wIGdhcC1bMTZweF1cIj5cbiAgICAgIDxkaXYgY2xhc3M9XCJ3LTIvOCBmbGV4LTFcIj48L2Rpdj5cbiAgICAgIDxkaXYgY2xhc3M9XCJmbGV4IGxpYnMtdWktZm9udC1oNHMgbWluLXctMCB3LTQvOCBqdXN0aWZ5LWNlbnRlciBmbGV4LTFcIj5cbiAgICAgICAgPGxpYnNfdWktY29tcG9uZW50cy1wb3BvdmVyXG4gICAgICAgICAgW3R5cGVdPVwiJ3RleHQnXCJcbiAgICAgICAgICBbY29uZmlnXT1cInsgekluZGV4OiB6SW5kZXgoKSB9XCI+XG4gICAgICAgICAge3sgZmlsZVZpZXcoKT8ubmFtZSB9fVxuICAgICAgICA8L2xpYnNfdWktY29tcG9uZW50cy1wb3BvdmVyPlxuICAgICAgPC9kaXY+XG4gICAgICBAaWYgKGJ1dHRvbnMoKT8ubGVuZ3RoKSB7XG4gICAgICAgIDxkaXYgY2xhc3M9XCJmbGV4IGdhcC1bOHB4XSBpdGVtcy1jZW50ZXIgdy0yLzgganVzdGlmeS1lbmQgZmxleC0xXCI+XG4gICAgICAgICAgQGZvciAoYnV0dG9uIG9mIGJ1dHRvbnMoKTsgdHJhY2sgYnV0dG9uLmtleSkge1xuICAgICAgICAgICAgPGxpYnNfdWktY29tcG9uZW50cy1idXR0b25zLWJ1dHRvblxuICAgICAgICAgICAgICBbdHlwZV09XCJidXR0b24udHlwZSB8fCAnYnV0dG9uLXRoaXJkJ1wiXG4gICAgICAgICAgICAgIFtsYWJlbF09XCJidXR0b24ubGFiZWwgfHwgJydcIlxuICAgICAgICAgICAgICBbY2xhc3NJY29uTGVmdF09XCJidXR0b24uY2xhc3NJY29uTGVmdCB8fCAnJ1wiXG4gICAgICAgICAgICAgIFtjbGFzc0ljb25SaWdodF09XCJidXR0b24uY2xhc3NJY29uUmlnaHQgfHwgJydcIlxuICAgICAgICAgICAgICBbaWNvbk9ubHlUeXBlXT1cImJ1dHRvbi5pY29uT25seVR5cGUgfHwgZmFsc2VcIlxuICAgICAgICAgICAgICBbY2xhc3NJbmNsdWRlXT1cImJ1dHRvbi5jbGFzc0luY2x1ZGUgfHwgJyFweS1bNHB4XSAhcHgtWzEycHhdJ1wiXG4gICAgICAgICAgICAgIChvdXRDbGljayk9XCJidXR0b24uYWN0aW9uPy4oaW5kZXgoKSlcIiAvPlxuICAgICAgICAgIH1cbiAgICAgICAgICA8ZGl2IGNsYXNzPVwiaC1bMTJweF0gbGlicy11aS1ib3JkZXItbGVmdC1nZW5lcmFsXCI+PC9kaXY+XG4gICAgICAgIDwvZGl2PlxuICAgICAgfVxuICAgIDwvZGl2PlxuICA8L2Rpdj5cbiAgPGRpdiBjbGFzcz1cImxpYnMtdWktbW9kYWwtYm9keS1jdXN0b20gaC1mdWxsIHctZnVsbCBmbGV4IHJvdW5kZWQtYi1bOHB4XSBvdmVyZmxvdy1oaWRkZW4gcmVsYXRpdmVcIj5cbiAgICBAaWYgKGluZGV4KCkgPiAwKSB7XG4gICAgICA8ZGl2IGNsYXNzPVwiYWJzb2x1dGUgdG9wLVs1MCVdIGxlZnQtWzI0cHhdIHRyYW5zZm9ybSAtdHJhbnNsYXRlLXktWzUwJV0gei1bMV1cIj5cbiAgICAgICAgPGxpYnNfdWktY29tcG9uZW50cy1idXR0b25zLWJ1dHRvblxuICAgICAgICAgIFt0eXBlXT1cIididXR0b24tb3V0bGluZSdcIlxuICAgICAgICAgIFtpY29uT25seVR5cGVdPVwidHJ1ZVwiXG4gICAgICAgICAgW2NsYXNzSW5jbHVkZV09XCInIXAtWzExcHhdICFyb3VuZGVkLVs4cHhdJ1wiXG4gICAgICAgICAgW2NsYXNzSWNvbkxlZnRdPVwiJ2xpYnMtdWktaWNvbi1jaGV2cm9uLXJpZ2h0IHJvdGF0ZS0xODAgYmVmb3JlOiF0ZXh0LVsyMHB4XSdcIlxuICAgICAgICAgIChvdXRDbGljayk9XCJoYW5kbGVyUHJldigpXCIgLz5cbiAgICAgIDwvZGl2PlxuICAgIH1cbiAgICBAaWYgKGZpbGVWaWV3KCk7IGFzIGZpbGVWaWV3KSB7XG4gICAgICBAaWYgKGZpbGVWaWV3IHwgTGlic1VpUGlwZXNDaGVja0ZpbGVFeHRlbnNpb25QaXBlOiAnaW1hZ2UnKSB7XG4gICAgICAgIDxkaXYgY2xhc3M9XCJ3LWZ1bGwgaC1mdWxsIHJlbGF0aXZlIGZsZXggaXRlbXMtY2VudGVyIGp1c3RpZnktY2VudGVyXCI+XG4gICAgICAgICAgQGlmIChmaWxlVmlldy51cmwgfHwgZmlsZVZpZXcub3JpZ2luX3VybDsgYXMgdXJsKSB7XG4gICAgICAgICAgICA8aW1nXG4gICAgICAgICAgICAgIFtzcmNdPVwidXJsXCJcbiAgICAgICAgICAgICAgYWx0PVwiXCJcbiAgICAgICAgICAgICAgY2xhc3M9XCJtYXgtdy1mdWxsIG1heC1oLWZ1bGwgb2JqZWN0LWNvbnRhaW5cIlxuICAgICAgICAgICAgICAobG9hZCk9XCJoYW5kbGVyT25Mb2FkKClcIlxuICAgICAgICAgICAgICAoZXJyb3IpPVwiaGFuZGxlckltYWdlRXJyb3IoJGV2ZW50KVwiIC8+XG4gICAgICAgICAgICBAaWYgKGxvYWRpbmcoKSkge1xuICAgICAgICAgICAgICA8bGlic191aS1jb21wb25lbnRzLXNwaW5uZXIgW3NpemVdPVwiJ21lZGl1bSdcIiAvPlxuICAgICAgICAgICAgfVxuICAgICAgICAgIH1cbiAgICAgICAgPC9kaXY+XG4gICAgICB9IEBlbHNlIHtcbiAgICAgICAgPGlmcmFtZVxuICAgICAgICAgIGlkPVwiZ29vZ2xlXCJcbiAgICAgICAgICB0aXRsZT1cIkZpbGUgcHJldmlld1wiXG4gICAgICAgICAgW2NsYXNzLmhpZGRlbl09XCJsb2FkaW5nKClcIlxuICAgICAgICAgIFtzcmNdPVwiZmlsZVZpZXcudXJsRmlsZSA/PyAnJyB8IExpYnNVaVBpcGVzU2VjdXJpdHlUcnVzdFBpcGU6ICdyZXNvdXJjZVVybCcgfCBhc3luY1wiXG4gICAgICAgICAgd2lkdGg9XCIxMDAlXCJcbiAgICAgICAgICBoZWlnaHQ9XCIxMDAlXCJcbiAgICAgICAgICBjbGFzcz1cImJvcmRlci0wXCJcbiAgICAgICAgICBhbGxvd2Z1bGxzY3JlZW49XCJhbGxvd2Z1bGxzY3JlZW5cIlxuICAgICAgICAgIChsb2FkKT1cImhhbmRsZXJPbkxvYWQoKVwiPjwvaWZyYW1lPlxuICAgICAgICBAaWYgKGxvYWRpbmcoKSkge1xuICAgICAgICAgIDxsaWJzX3VpLWNvbXBvbmVudHMtc2tlbGV0b24gW2NsYXNzXT1cIid3LWZ1bGwgaC1mdWxsJ1wiIC8+XG4gICAgICAgIH1cbiAgICAgIH1cbiAgICAgIEBpZiAoaW5kZXgoKSA8IGRhdGEoKS5sZW5ndGggLSAxKSB7XG4gICAgICAgIDxkaXYgY2xhc3M9XCJhYnNvbHV0ZSB0b3AtWzUwJV0gcmlnaHQtWzI0cHhdIHRyYW5zZm9ybSAtdHJhbnNsYXRlLXktWzUwJV0gei1bMV1cIj5cbiAgICAgICAgICA8bGlic191aS1jb21wb25lbnRzLWJ1dHRvbnMtYnV0dG9uXG4gICAgICAgICAgICBbdHlwZV09XCInYnV0dG9uLW91dGxpbmUnXCJcbiAgICAgICAgICAgIFtpY29uT25seVR5cGVdPVwidHJ1ZVwiXG4gICAgICAgICAgICBbY2xhc3NJbmNsdWRlXT1cIichcC1bMTFweF0gIXJvdW5kZWQtWzhweF0nXCJcbiAgICAgICAgICAgIFtjbGFzc0ljb25MZWZ0XT1cIidsaWJzLXVpLWljb24tY2hldnJvbi1yaWdodCBiZWZvcmU6IXRleHQtWzIwcHhdJ1wiXG4gICAgICAgICAgICAob3V0Q2xpY2spPVwiaGFuZGxlck5leHQoKVwiIC8+XG4gICAgICAgIDwvZGl2PlxuICAgICAgfVxuICAgIH1cbiAgPC9kaXY+XG48L2xpYnNfdWktY29tcG9uZW50cy1tb2RhbD5cbiJdfQ==
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { AsyncPipe } from '@angular/common';
|
|
2
2
|
import * as i0 from '@angular/core';
|
|
3
|
-
import { signal, computed, untracked, input, model, output,
|
|
3
|
+
import { signal, computed, untracked, input, model, output, Component, ChangeDetectionStrategy, Optional, Inject } from '@angular/core';
|
|
4
4
|
import { LibsUiComponentsButtonsButtonComponent } from '@libs-ui/components-buttons-button';
|
|
5
5
|
import { LibsUiComponentsModalComponent } from '@libs-ui/components-modal';
|
|
6
6
|
import { LibsUiComponentsPopoverComponent } from '@libs-ui/components-popover';
|
|
@@ -21,6 +21,9 @@ class LibsUiComponentsPreviewFileComponent {
|
|
|
21
21
|
untracked(() => this.loading.set(true));
|
|
22
22
|
const mimeType = file.mimetype || file.file?.type;
|
|
23
23
|
const url = file.url || file.origin_url;
|
|
24
|
+
if (this.isSourceIframe()) {
|
|
25
|
+
return { ...file, urlFile: url };
|
|
26
|
+
}
|
|
24
27
|
if (mimeType && this.mineTypeMicroSoftSupport().includes(mimeType)) {
|
|
25
28
|
return { ...file, urlFile: `https://view.officeapps.live.com/op/embed.aspx?src=${encodeURIComponent(url || '')}` };
|
|
26
29
|
}
|
|
@@ -30,7 +33,9 @@ class LibsUiComponentsPreviewFileComponent {
|
|
|
30
33
|
index = model.required();
|
|
31
34
|
data = input.required();
|
|
32
35
|
buttons = input();
|
|
36
|
+
isSourceIframe = input();
|
|
33
37
|
outClose = output();
|
|
38
|
+
outChangeIndex = output();
|
|
34
39
|
constructor(linkImageError) {
|
|
35
40
|
this.linkImageError = linkImageError;
|
|
36
41
|
}
|
|
@@ -59,9 +64,11 @@ class LibsUiComponentsPreviewFileComponent {
|
|
|
59
64
|
}
|
|
60
65
|
handlerPrev() {
|
|
61
66
|
this.index.update((value) => value - 1);
|
|
67
|
+
this.outChangeIndex.emit(this.index());
|
|
62
68
|
}
|
|
63
69
|
handlerNext() {
|
|
64
70
|
this.index.update((value) => value + 1);
|
|
71
|
+
this.outChangeIndex.emit(this.index());
|
|
65
72
|
}
|
|
66
73
|
async handlerImageError(event) {
|
|
67
74
|
if (!this.linkImageError) {
|
|
@@ -70,7 +77,7 @@ class LibsUiComponentsPreviewFileComponent {
|
|
|
70
77
|
event.target.src = this.linkImageError;
|
|
71
78
|
}
|
|
72
79
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LibsUiComponentsPreviewFileComponent, deps: [{ token: LINK_IMAGE_ERROR_TOKEN_INJECT, optional: true }], target: i0.ɵɵFactoryTarget.Component });
|
|
73
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: LibsUiComponentsPreviewFileComponent, isStandalone: true, selector: "libs_ui-components-preview_file", inputs: { zIndex: { classPropertyName: "zIndex", publicName: "zIndex", isSignal: true, isRequired: false, transformFunction: null }, index: { classPropertyName: "index", publicName: "index", isSignal: true, isRequired: true, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: true, transformFunction: null }, buttons: { classPropertyName: "buttons", publicName: "buttons", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { index: "indexChange", outClose: "outClose" }, ngImport: i0, template: "<libs_ui-components-modal\n [minWidth]=\"'1200px'\"\n [headerConfig]=\"{ ignoreHeaderTheme: true, classButtonCloseInclude: '!mr-[24px]' }\"\n [bodyConfig]=\"{ classInclude: '!p-0', scrollOverlayOptions: { scrollX: 'hidden', scrollY: 'hidden' } }\"\n [footerConfig]=\"{ hidden: true }\"\n [zIndex]=\"zIndex()\"\n [buttonsFooter]=\"[]\"\n [mode]=\"'center'\"\n (outEvent)=\"handlerClose($event)\">\n <div class=\"libs-ui-modal-header-custom w-full flex items-center justify-between min-w-0\">\n <div class=\"w-full ml-[24px] mr-[8px] flex justify-between items-center min-w-0 gap-[16px]\">\n <div class=\"w-2/8 flex-1\"></div>\n <div class=\"flex libs-ui-font-h4s min-w-0 w-4/8 justify-center flex-1\">\n <libs_ui-components-popover\n [type]=\"'text'\"\n [config]=\"{ zIndex: zIndex() }\">\n {{ fileView()?.name }}\n </libs_ui-components-popover>\n </div>\n @if (buttons()?.length) {\n <div class=\"flex gap-[8px] items-center w-2/8 justify-end flex-1\">\n @for (button of buttons(); track button.key) {\n <libs_ui-components-buttons-button\n [type]=\"button.type || 'button-third'\"\n [label]=\"button.label || ''\"\n [classIconLeft]=\"button.classIconLeft || ''\"\n [iconOnlyType]=\"button.iconOnlyType || false\"\n [classInclude]=\"button.classInclude || '!py-[4px] !px-[12px]'\"\n (outClick)=\"button.action?.(index())\" />\n }\n <div class=\"h-[12px] libs-ui-border-left-general\"></div>\n </div>\n }\n </div>\n </div>\n <div class=\"libs-ui-modal-body-custom h-full w-full flex rounded-b-[8px] overflow-hidden relative\">\n @if (index() > 0) {\n <div class=\"absolute top-[50%] left-[24px] transform -translate-y-[50%] z-[1]\">\n <libs_ui-components-buttons-button\n [type]=\"'button-outline'\"\n [iconOnlyType]=\"true\"\n [classInclude]=\"'!p-[11px] !rounded-[8px]'\"\n [classIconLeft]=\"'libs-ui-icon-chevron-right rotate-180 before:!text-[20px]'\"\n (outClick)=\"handlerPrev()\" />\n </div>\n }\n @if (fileView(); as fileView) {\n @if (fileView | LibsUiPipesCheckFileExtensionPipe: 'image') {\n <div class=\"w-full h-full relative flex items-center justify-center\">\n @if (fileView.url || fileView.origin_url; as url) {\n <img\n [src]=\"url\"\n alt=\"\"\n class=\"max-w-full max-h-full object-contain\"\n (load)=\"handlerOnLoad()\"\n (error)=\"handlerImageError($event)\" />\n @if (loading()) {\n <libs_ui-components-spinner [size]=\"'medium'\" />\n }\n }\n </div>\n } @else {\n <iframe\n id=\"google\"\n [class.hidden]=\"loading()\"\n [src]=\"fileView.urlFile | LibsUiPipesSecurityTrustPipe: 'resourceUrl' | async\"\n width=\"100%\"\n height=\"100%\"\n
|
|
80
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: LibsUiComponentsPreviewFileComponent, isStandalone: true, selector: "libs_ui-components-preview_file", inputs: { zIndex: { classPropertyName: "zIndex", publicName: "zIndex", isSignal: true, isRequired: false, transformFunction: null }, index: { classPropertyName: "index", publicName: "index", isSignal: true, isRequired: true, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: true, transformFunction: null }, buttons: { classPropertyName: "buttons", publicName: "buttons", isSignal: true, isRequired: false, transformFunction: null }, isSourceIframe: { classPropertyName: "isSourceIframe", publicName: "isSourceIframe", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { index: "indexChange", outClose: "outClose", outChangeIndex: "outChangeIndex" }, ngImport: i0, template: "<libs_ui-components-modal\n [minWidth]=\"'1200px'\"\n [headerConfig]=\"{ ignoreHeaderTheme: true, classButtonCloseInclude: '!mr-[24px]' }\"\n [bodyConfig]=\"{ classInclude: '!p-0', scrollOverlayOptions: { scrollX: 'hidden', scrollY: 'hidden' } }\"\n [footerConfig]=\"{ hidden: true }\"\n [zIndex]=\"zIndex()\"\n [buttonsFooter]=\"[]\"\n [mode]=\"'center'\"\n (outEvent)=\"handlerClose($event)\">\n <div class=\"libs-ui-modal-header-custom w-full flex items-center justify-between min-w-0\">\n <div class=\"w-full ml-[24px] mr-[8px] flex justify-between items-center min-w-0 gap-[16px]\">\n <div class=\"w-2/8 flex-1\"></div>\n <div class=\"flex libs-ui-font-h4s min-w-0 w-4/8 justify-center flex-1\">\n <libs_ui-components-popover\n [type]=\"'text'\"\n [config]=\"{ zIndex: zIndex() }\">\n {{ fileView()?.name }}\n </libs_ui-components-popover>\n </div>\n @if (buttons()?.length) {\n <div class=\"flex gap-[8px] items-center w-2/8 justify-end flex-1\">\n @for (button of buttons(); track button.key) {\n <libs_ui-components-buttons-button\n [type]=\"button.type || 'button-third'\"\n [label]=\"button.label || ''\"\n [classIconLeft]=\"button.classIconLeft || ''\"\n [classIconRight]=\"button.classIconRight || ''\"\n [iconOnlyType]=\"button.iconOnlyType || false\"\n [classInclude]=\"button.classInclude || '!py-[4px] !px-[12px]'\"\n (outClick)=\"button.action?.(index())\" />\n }\n <div class=\"h-[12px] libs-ui-border-left-general\"></div>\n </div>\n }\n </div>\n </div>\n <div class=\"libs-ui-modal-body-custom h-full w-full flex rounded-b-[8px] overflow-hidden relative\">\n @if (index() > 0) {\n <div class=\"absolute top-[50%] left-[24px] transform -translate-y-[50%] z-[1]\">\n <libs_ui-components-buttons-button\n [type]=\"'button-outline'\"\n [iconOnlyType]=\"true\"\n [classInclude]=\"'!p-[11px] !rounded-[8px]'\"\n [classIconLeft]=\"'libs-ui-icon-chevron-right rotate-180 before:!text-[20px]'\"\n (outClick)=\"handlerPrev()\" />\n </div>\n }\n @if (fileView(); as fileView) {\n @if (fileView | LibsUiPipesCheckFileExtensionPipe: 'image') {\n <div class=\"w-full h-full relative flex items-center justify-center\">\n @if (fileView.url || fileView.origin_url; as url) {\n <img\n [src]=\"url\"\n alt=\"\"\n class=\"max-w-full max-h-full object-contain\"\n (load)=\"handlerOnLoad()\"\n (error)=\"handlerImageError($event)\" />\n @if (loading()) {\n <libs_ui-components-spinner [size]=\"'medium'\" />\n }\n }\n </div>\n } @else {\n <iframe\n id=\"google\"\n title=\"File preview\"\n [class.hidden]=\"loading()\"\n [src]=\"fileView.urlFile ?? '' | LibsUiPipesSecurityTrustPipe: 'resourceUrl' | async\"\n width=\"100%\"\n height=\"100%\"\n class=\"border-0\"\n allowfullscreen=\"allowfullscreen\"\n (load)=\"handlerOnLoad()\"></iframe>\n @if (loading()) {\n <libs_ui-components-skeleton [class]=\"'w-full h-full'\" />\n }\n }\n @if (index() < data().length - 1) {\n <div class=\"absolute top-[50%] right-[24px] transform -translate-y-[50%] z-[1]\">\n <libs_ui-components-buttons-button\n [type]=\"'button-outline'\"\n [iconOnlyType]=\"true\"\n [classInclude]=\"'!p-[11px] !rounded-[8px]'\"\n [classIconLeft]=\"'libs-ui-icon-chevron-right before:!text-[20px]'\"\n (outClick)=\"handlerNext()\" />\n </div>\n }\n }\n </div>\n</libs_ui-components-modal>\n", dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "component", type: LibsUiComponentsModalComponent, selector: "libs_ui-components-modal", inputs: ["show", "mode", "isBackdropTransparent", "isBackgroundTransparentModal", "isSizeBackdropByWidthHeightInput", "hasShadowBoxWhenHiddenBackDropTransparent", "classIncludeModalWrapper", "zIndex", "width", "height", "maxWidth", "maxHeight", "minWidth", "isFullScreen", "disable", "ignoreCommunicateMicroEvent", "escapeKeyboardCloseModal", "isClickOutsideClose", "headerConfig", "bodyConfig", "footerConfig", "buttonsFooter", "title", "titleUseXssFilter", "titleUseTooltip", "titleUseInnerText"], outputs: ["showChange", "widthChange", "heightChange", "maxWidthChange", "maxHeightChange", "minWidthChange", "disableChange", "buttonsFooterChange", "outScrollContent", "outEvent", "outFunctionControl", "outClose"] }, { kind: "pipe", type: LibsUiPipesSecurityTrustPipe, name: "LibsUiPipesSecurityTrustPipe" }, { kind: "component", type: LibsUiComponentsSkeletonComponent, selector: "libs_ui-components-skeleton", inputs: ["config"] }, { kind: "component", type: LibsUiComponentsPopoverComponent, selector: "libs_ui-components-popover,[LibsUiComponentsPopoverDirective]", inputs: ["debugId", "flagMouse", "type", "mode", "config", "ignoreShowPopover", "elementRefCustom", "initEventInElementRefCustom", "classInclude", "ignoreHiddenPopoverContentWhenMouseLeave", "ignoreStopPropagationEvent", "ignoreCursorPointerModeLikeClick", "isAddContentToParentDocument", "ignoreClickOutside"], outputs: ["outEvent", "outChangStageFlagMouse", "outEventPopoverContent", "outFunctionsControl"] }, { kind: "component", type: LibsUiComponentsButtonsButtonComponent, selector: "libs_ui-components-buttons-button", inputs: ["flagMouse", "type", "buttonCustom", "sizeButton", "label", "disable", "isPending", "imageLeft", "classInclude", "classIconLeft", "classIconRight", "classLabel", "iconOnlyType", "popover", "ignoreStopPropagationEvent", "zIndex", "widthLabelPopover", "styleIconLeft", "styleButton", "ignoreFocusWhenInputTab", "ignoreSetClickWhenShowPopover", "ignorePointerEvent", "isActive", "isHandlerEnterDocumentClickButton"], outputs: ["outClick", "outPopoverEvent", "outFunctionsControl"] }, { kind: "pipe", type: LibsUiPipesCheckFileExtensionPipe, name: "LibsUiPipesCheckFileExtensionPipe" }, { kind: "component", type: LibsUiComponentsSpinnerComponent, selector: "libs_ui-components-spinner", inputs: ["type", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
74
81
|
}
|
|
75
82
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LibsUiComponentsPreviewFileComponent, decorators: [{
|
|
76
83
|
type: Component,
|
|
@@ -83,7 +90,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
|
|
|
83
90
|
LibsUiComponentsButtonsButtonComponent,
|
|
84
91
|
LibsUiPipesCheckFileExtensionPipe,
|
|
85
92
|
LibsUiComponentsSpinnerComponent,
|
|
86
|
-
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<libs_ui-components-modal\n [minWidth]=\"'1200px'\"\n [headerConfig]=\"{ ignoreHeaderTheme: true, classButtonCloseInclude: '!mr-[24px]' }\"\n [bodyConfig]=\"{ classInclude: '!p-0', scrollOverlayOptions: { scrollX: 'hidden', scrollY: 'hidden' } }\"\n [footerConfig]=\"{ hidden: true }\"\n [zIndex]=\"zIndex()\"\n [buttonsFooter]=\"[]\"\n [mode]=\"'center'\"\n (outEvent)=\"handlerClose($event)\">\n <div class=\"libs-ui-modal-header-custom w-full flex items-center justify-between min-w-0\">\n <div class=\"w-full ml-[24px] mr-[8px] flex justify-between items-center min-w-0 gap-[16px]\">\n <div class=\"w-2/8 flex-1\"></div>\n <div class=\"flex libs-ui-font-h4s min-w-0 w-4/8 justify-center flex-1\">\n <libs_ui-components-popover\n [type]=\"'text'\"\n [config]=\"{ zIndex: zIndex() }\">\n {{ fileView()?.name }}\n </libs_ui-components-popover>\n </div>\n @if (buttons()?.length) {\n <div class=\"flex gap-[8px] items-center w-2/8 justify-end flex-1\">\n @for (button of buttons(); track button.key) {\n <libs_ui-components-buttons-button\n [type]=\"button.type || 'button-third'\"\n [label]=\"button.label || ''\"\n [classIconLeft]=\"button.classIconLeft || ''\"\n [iconOnlyType]=\"button.iconOnlyType || false\"\n [classInclude]=\"button.classInclude || '!py-[4px] !px-[12px]'\"\n (outClick)=\"button.action?.(index())\" />\n }\n <div class=\"h-[12px] libs-ui-border-left-general\"></div>\n </div>\n }\n </div>\n </div>\n <div class=\"libs-ui-modal-body-custom h-full w-full flex rounded-b-[8px] overflow-hidden relative\">\n @if (index() > 0) {\n <div class=\"absolute top-[50%] left-[24px] transform -translate-y-[50%] z-[1]\">\n <libs_ui-components-buttons-button\n [type]=\"'button-outline'\"\n [iconOnlyType]=\"true\"\n [classInclude]=\"'!p-[11px] !rounded-[8px]'\"\n [classIconLeft]=\"'libs-ui-icon-chevron-right rotate-180 before:!text-[20px]'\"\n (outClick)=\"handlerPrev()\" />\n </div>\n }\n @if (fileView(); as fileView) {\n @if (fileView | LibsUiPipesCheckFileExtensionPipe: 'image') {\n <div class=\"w-full h-full relative flex items-center justify-center\">\n @if (fileView.url || fileView.origin_url; as url) {\n <img\n [src]=\"url\"\n alt=\"\"\n class=\"max-w-full max-h-full object-contain\"\n (load)=\"handlerOnLoad()\"\n (error)=\"handlerImageError($event)\" />\n @if (loading()) {\n <libs_ui-components-spinner [size]=\"'medium'\" />\n }\n }\n </div>\n } @else {\n <iframe\n id=\"google\"\n [class.hidden]=\"loading()\"\n [src]=\"fileView.urlFile | LibsUiPipesSecurityTrustPipe: 'resourceUrl' | async\"\n width=\"100%\"\n height=\"100%\"\n
|
|
93
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<libs_ui-components-modal\n [minWidth]=\"'1200px'\"\n [headerConfig]=\"{ ignoreHeaderTheme: true, classButtonCloseInclude: '!mr-[24px]' }\"\n [bodyConfig]=\"{ classInclude: '!p-0', scrollOverlayOptions: { scrollX: 'hidden', scrollY: 'hidden' } }\"\n [footerConfig]=\"{ hidden: true }\"\n [zIndex]=\"zIndex()\"\n [buttonsFooter]=\"[]\"\n [mode]=\"'center'\"\n (outEvent)=\"handlerClose($event)\">\n <div class=\"libs-ui-modal-header-custom w-full flex items-center justify-between min-w-0\">\n <div class=\"w-full ml-[24px] mr-[8px] flex justify-between items-center min-w-0 gap-[16px]\">\n <div class=\"w-2/8 flex-1\"></div>\n <div class=\"flex libs-ui-font-h4s min-w-0 w-4/8 justify-center flex-1\">\n <libs_ui-components-popover\n [type]=\"'text'\"\n [config]=\"{ zIndex: zIndex() }\">\n {{ fileView()?.name }}\n </libs_ui-components-popover>\n </div>\n @if (buttons()?.length) {\n <div class=\"flex gap-[8px] items-center w-2/8 justify-end flex-1\">\n @for (button of buttons(); track button.key) {\n <libs_ui-components-buttons-button\n [type]=\"button.type || 'button-third'\"\n [label]=\"button.label || ''\"\n [classIconLeft]=\"button.classIconLeft || ''\"\n [classIconRight]=\"button.classIconRight || ''\"\n [iconOnlyType]=\"button.iconOnlyType || false\"\n [classInclude]=\"button.classInclude || '!py-[4px] !px-[12px]'\"\n (outClick)=\"button.action?.(index())\" />\n }\n <div class=\"h-[12px] libs-ui-border-left-general\"></div>\n </div>\n }\n </div>\n </div>\n <div class=\"libs-ui-modal-body-custom h-full w-full flex rounded-b-[8px] overflow-hidden relative\">\n @if (index() > 0) {\n <div class=\"absolute top-[50%] left-[24px] transform -translate-y-[50%] z-[1]\">\n <libs_ui-components-buttons-button\n [type]=\"'button-outline'\"\n [iconOnlyType]=\"true\"\n [classInclude]=\"'!p-[11px] !rounded-[8px]'\"\n [classIconLeft]=\"'libs-ui-icon-chevron-right rotate-180 before:!text-[20px]'\"\n (outClick)=\"handlerPrev()\" />\n </div>\n }\n @if (fileView(); as fileView) {\n @if (fileView | LibsUiPipesCheckFileExtensionPipe: 'image') {\n <div class=\"w-full h-full relative flex items-center justify-center\">\n @if (fileView.url || fileView.origin_url; as url) {\n <img\n [src]=\"url\"\n alt=\"\"\n class=\"max-w-full max-h-full object-contain\"\n (load)=\"handlerOnLoad()\"\n (error)=\"handlerImageError($event)\" />\n @if (loading()) {\n <libs_ui-components-spinner [size]=\"'medium'\" />\n }\n }\n </div>\n } @else {\n <iframe\n id=\"google\"\n title=\"File preview\"\n [class.hidden]=\"loading()\"\n [src]=\"fileView.urlFile ?? '' | LibsUiPipesSecurityTrustPipe: 'resourceUrl' | async\"\n width=\"100%\"\n height=\"100%\"\n class=\"border-0\"\n allowfullscreen=\"allowfullscreen\"\n (load)=\"handlerOnLoad()\"></iframe>\n @if (loading()) {\n <libs_ui-components-skeleton [class]=\"'w-full h-full'\" />\n }\n }\n @if (index() < data().length - 1) {\n <div class=\"absolute top-[50%] right-[24px] transform -translate-y-[50%] z-[1]\">\n <libs_ui-components-buttons-button\n [type]=\"'button-outline'\"\n [iconOnlyType]=\"true\"\n [classInclude]=\"'!p-[11px] !rounded-[8px]'\"\n [classIconLeft]=\"'libs-ui-icon-chevron-right before:!text-[20px]'\"\n (outClick)=\"handlerNext()\" />\n </div>\n }\n }\n </div>\n</libs_ui-components-modal>\n" }]
|
|
87
94
|
}], ctorParameters: () => [{ type: undefined, decorators: [{
|
|
88
95
|
type: Optional
|
|
89
96
|
}, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"libs-ui-components-preview-file.mjs","sources":["../../../../../libs-ui/components/preview-file/src/preview-file.component.ts","../../../../../libs-ui/components/preview-file/src/preview-file.component.html","../../../../../libs-ui/components/preview-file/src/libs-ui-components-preview-file.ts"],"sourcesContent":["import { AsyncPipe } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, computed, Inject, input, model, Optional, output, signal, untracked } from '@angular/core';\nimport { IButton, LibsUiComponentsButtonsButtonComponent } from '@libs-ui/components-buttons-button';\nimport { LibsUiComponentsModalComponent, TYPE_MODAL_EVENT } from '@libs-ui/components-modal';\nimport { LibsUiComponentsPopoverComponent } from '@libs-ui/components-popover';\nimport { LibsUiComponentsSkeletonComponent } from '@libs-ui/components-skeleton';\nimport { LibsUiComponentsSpinnerComponent } from '@libs-ui/components-spinner';\nimport { IEvent, IFile } from '@libs-ui/interfaces-types';\nimport { LibsUiPipesCheckFileExtensionPipe } from '@libs-ui/pipes-check-file-extension';\nimport { LibsUiPipesSecurityTrustPipe } from '@libs-ui/pipes-security-trust';\nimport { LINK_IMAGE_ERROR_TOKEN_INJECT } from '@libs-ui/utils';\n\n@Component({\n // eslint-disable-next-line @angular-eslint/component-selector\n selector: 'libs_ui-components-preview_file',\n templateUrl: './preview-file.component.html',\n standalone: true,\n imports: [\n AsyncPipe,\n LibsUiComponentsModalComponent,\n LibsUiPipesSecurityTrustPipe,\n LibsUiComponentsSkeletonComponent,\n LibsUiComponentsPopoverComponent,\n LibsUiComponentsButtonsButtonComponent,\n LibsUiPipesCheckFileExtensionPipe,\n LibsUiComponentsSpinnerComponent,\n ],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class LibsUiComponentsPreviewFileComponent {\n protected loading = signal(true);\n protected fileView = computed(() => {\n const file = this.data()[this.index()];\n\n if (!file) {\n return null;\n }\n untracked(() => this.loading.set(true));\n const mimeType = file.mimetype || file.file?.type;\n const url = file.url || file.origin_url;\n\n if (mimeType && this.mineTypeMicroSoftSupport().includes(mimeType)) {\n return { ...file, urlFile: `https://view.officeapps.live.com/op/embed.aspx?src=${encodeURIComponent(url || '')}` };\n }\n\n return { ...file, urlFile: `https://docs.google.com/a/umd.edu/viewer?url=${encodeURIComponent(url || '')}&embedded=true` };\n });\n\n readonly zIndex = input<number>();\n readonly index = model.required<number>();\n readonly data = input.required<IFile[]>();\n readonly buttons = input<IButton[]>();\n\n readonly outClose = output<void>();\n\n constructor(@Optional() @Inject(LINK_IMAGE_ERROR_TOKEN_INJECT) private linkImageError: string) {}\n\n protected async handlerOnLoad() {\n this.loading.set(false);\n }\n\n protected async handlerClose(type: TYPE_MODAL_EVENT) {\n if (type === 'close') {\n this.outClose.emit();\n }\n }\n\n private mineTypeMicroSoftSupport() {\n return [\n 'application/msword',\n 'application/vnd.openxmlformats-officedocument.wordprocessingml.document',\n 'application/vnd.openxmlformats-officedocument.wordprocessingml.template',\n 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',\n 'application/vnd.ms-excel.sheet.macroEnabled.12',\n 'application/vnd.ms-excel',\n 'application/vnd.openxmlformats-officedocument.spreadsheetml.template',\n 'application/vnd.ms-powerpoint',\n 'application/vnd.openxmlformats-officedocument.presentationml.presentation',\n 'application/vnd.ms-powerpoint.presentation.macroEnabled.12',\n 'application/vnd.openxmlformats-officedocument.presentationml.slideshow',\n ];\n }\n\n protected handlerPrev() {\n this.index.update((value) => value - 1);\n }\n\n protected handlerNext() {\n this.index.update((value) => value + 1);\n }\n\n protected async handlerImageError(event: Event) {\n if (!this.linkImageError) {\n return;\n }\n (event as IEvent).target.src = this.linkImageError;\n }\n}\n","<libs_ui-components-modal\n [minWidth]=\"'1200px'\"\n [headerConfig]=\"{ ignoreHeaderTheme: true, classButtonCloseInclude: '!mr-[24px]' }\"\n [bodyConfig]=\"{ classInclude: '!p-0', scrollOverlayOptions: { scrollX: 'hidden', scrollY: 'hidden' } }\"\n [footerConfig]=\"{ hidden: true }\"\n [zIndex]=\"zIndex()\"\n [buttonsFooter]=\"[]\"\n [mode]=\"'center'\"\n (outEvent)=\"handlerClose($event)\">\n <div class=\"libs-ui-modal-header-custom w-full flex items-center justify-between min-w-0\">\n <div class=\"w-full ml-[24px] mr-[8px] flex justify-between items-center min-w-0 gap-[16px]\">\n <div class=\"w-2/8 flex-1\"></div>\n <div class=\"flex libs-ui-font-h4s min-w-0 w-4/8 justify-center flex-1\">\n <libs_ui-components-popover\n [type]=\"'text'\"\n [config]=\"{ zIndex: zIndex() }\">\n {{ fileView()?.name }}\n </libs_ui-components-popover>\n </div>\n @if (buttons()?.length) {\n <div class=\"flex gap-[8px] items-center w-2/8 justify-end flex-1\">\n @for (button of buttons(); track button.key) {\n <libs_ui-components-buttons-button\n [type]=\"button.type || 'button-third'\"\n [label]=\"button.label || ''\"\n [classIconLeft]=\"button.classIconLeft || ''\"\n [iconOnlyType]=\"button.iconOnlyType || false\"\n [classInclude]=\"button.classInclude || '!py-[4px] !px-[12px]'\"\n (outClick)=\"button.action?.(index())\" />\n }\n <div class=\"h-[12px] libs-ui-border-left-general\"></div>\n </div>\n }\n </div>\n </div>\n <div class=\"libs-ui-modal-body-custom h-full w-full flex rounded-b-[8px] overflow-hidden relative\">\n @if (index() > 0) {\n <div class=\"absolute top-[50%] left-[24px] transform -translate-y-[50%] z-[1]\">\n <libs_ui-components-buttons-button\n [type]=\"'button-outline'\"\n [iconOnlyType]=\"true\"\n [classInclude]=\"'!p-[11px] !rounded-[8px]'\"\n [classIconLeft]=\"'libs-ui-icon-chevron-right rotate-180 before:!text-[20px]'\"\n (outClick)=\"handlerPrev()\" />\n </div>\n }\n @if (fileView(); as fileView) {\n @if (fileView | LibsUiPipesCheckFileExtensionPipe: 'image') {\n <div class=\"w-full h-full relative flex items-center justify-center\">\n @if (fileView.url || fileView.origin_url; as url) {\n <img\n [src]=\"url\"\n alt=\"\"\n class=\"max-w-full max-h-full object-contain\"\n (load)=\"handlerOnLoad()\"\n (error)=\"handlerImageError($event)\" />\n @if (loading()) {\n <libs_ui-components-spinner [size]=\"'medium'\" />\n }\n }\n </div>\n } @else {\n <iframe\n id=\"google\"\n [class.hidden]=\"loading()\"\n [src]=\"fileView.urlFile | LibsUiPipesSecurityTrustPipe: 'resourceUrl' | async\"\n width=\"100%\"\n height=\"100%\"\n frameborder=\"0\"\n allowfullscreen=\"allowfullscreen\"\n (load)=\"handlerOnLoad()\"></iframe>\n @if (loading()) {\n <libs_ui-components-skeleton [class]=\"'w-full h-full'\" />\n }\n }\n @if (index() < data().length - 1) {\n <div class=\"absolute top-[50%] right-[24px] transform -translate-y-[50%] z-[1]\">\n <libs_ui-components-buttons-button\n [type]=\"'button-outline'\"\n [iconOnlyType]=\"true\"\n [classInclude]=\"'!p-[11px] !rounded-[8px]'\"\n [classIconLeft]=\"'libs-ui-icon-chevron-right before:!text-[20px]'\"\n (outClick)=\"handlerNext()\" />\n </div>\n }\n }\n </div>\n</libs_ui-components-modal>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"libs-ui-components-preview-file.mjs","sources":["../../../../../libs-ui/components/preview-file/src/preview-file.component.ts","../../../../../libs-ui/components/preview-file/src/preview-file.component.html","../../../../../libs-ui/components/preview-file/src/libs-ui-components-preview-file.ts"],"sourcesContent":["import { AsyncPipe } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, computed, Inject, input, model, Optional, output, signal, untracked } from '@angular/core';\nimport { IButton, LibsUiComponentsButtonsButtonComponent } from '@libs-ui/components-buttons-button';\nimport { LibsUiComponentsModalComponent, TYPE_MODAL_EVENT } from '@libs-ui/components-modal';\nimport { LibsUiComponentsPopoverComponent } from '@libs-ui/components-popover';\nimport { LibsUiComponentsSkeletonComponent } from '@libs-ui/components-skeleton';\nimport { LibsUiComponentsSpinnerComponent } from '@libs-ui/components-spinner';\nimport { IEvent, IFile } from '@libs-ui/interfaces-types';\nimport { LibsUiPipesCheckFileExtensionPipe } from '@libs-ui/pipes-check-file-extension';\nimport { LibsUiPipesSecurityTrustPipe } from '@libs-ui/pipes-security-trust';\nimport { LINK_IMAGE_ERROR_TOKEN_INJECT } from '@libs-ui/utils';\n\n@Component({\n // eslint-disable-next-line @angular-eslint/component-selector\n selector: 'libs_ui-components-preview_file',\n templateUrl: './preview-file.component.html',\n standalone: true,\n imports: [\n AsyncPipe,\n LibsUiComponentsModalComponent,\n LibsUiPipesSecurityTrustPipe,\n LibsUiComponentsSkeletonComponent,\n LibsUiComponentsPopoverComponent,\n LibsUiComponentsButtonsButtonComponent,\n LibsUiPipesCheckFileExtensionPipe,\n LibsUiComponentsSpinnerComponent,\n ],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class LibsUiComponentsPreviewFileComponent {\n protected loading = signal(true);\n protected fileView = computed(() => {\n const file = this.data()[this.index()];\n\n if (!file) {\n return null;\n }\n untracked(() => this.loading.set(true));\n const mimeType = file.mimetype || file.file?.type;\n const url = file.url || file.origin_url;\n\n if (this.isSourceIframe()) {\n return { ...file, urlFile: url };\n }\n\n if (mimeType && this.mineTypeMicroSoftSupport().includes(mimeType)) {\n return { ...file, urlFile: `https://view.officeapps.live.com/op/embed.aspx?src=${encodeURIComponent(url || '')}` };\n }\n\n return { ...file, urlFile: `https://docs.google.com/a/umd.edu/viewer?url=${encodeURIComponent(url || '')}&embedded=true` };\n });\n\n readonly zIndex = input<number>();\n readonly index = model.required<number>();\n readonly data = input.required<IFile[]>();\n readonly buttons = input<IButton[]>();\n readonly isSourceIframe = input<boolean>();\n\n readonly outClose = output<void>();\n readonly outChangeIndex = output<number>();\n\n constructor(@Optional() @Inject(LINK_IMAGE_ERROR_TOKEN_INJECT) private readonly linkImageError: string) {}\n\n protected async handlerOnLoad() {\n this.loading.set(false);\n }\n\n protected async handlerClose(type: TYPE_MODAL_EVENT) {\n if (type === 'close') {\n this.outClose.emit();\n }\n }\n\n private mineTypeMicroSoftSupport() {\n return [\n 'application/msword',\n 'application/vnd.openxmlformats-officedocument.wordprocessingml.document',\n 'application/vnd.openxmlformats-officedocument.wordprocessingml.template',\n 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',\n 'application/vnd.ms-excel.sheet.macroEnabled.12',\n 'application/vnd.ms-excel',\n 'application/vnd.openxmlformats-officedocument.spreadsheetml.template',\n 'application/vnd.ms-powerpoint',\n 'application/vnd.openxmlformats-officedocument.presentationml.presentation',\n 'application/vnd.ms-powerpoint.presentation.macroEnabled.12',\n 'application/vnd.openxmlformats-officedocument.presentationml.slideshow',\n ];\n }\n\n protected handlerPrev() {\n this.index.update((value) => value - 1);\n this.outChangeIndex.emit(this.index());\n }\n\n protected handlerNext() {\n this.index.update((value) => value + 1);\n this.outChangeIndex.emit(this.index());\n }\n\n protected async handlerImageError(event: Event) {\n if (!this.linkImageError) {\n return;\n }\n (event as IEvent).target.src = this.linkImageError;\n }\n}\n","<libs_ui-components-modal\n [minWidth]=\"'1200px'\"\n [headerConfig]=\"{ ignoreHeaderTheme: true, classButtonCloseInclude: '!mr-[24px]' }\"\n [bodyConfig]=\"{ classInclude: '!p-0', scrollOverlayOptions: { scrollX: 'hidden', scrollY: 'hidden' } }\"\n [footerConfig]=\"{ hidden: true }\"\n [zIndex]=\"zIndex()\"\n [buttonsFooter]=\"[]\"\n [mode]=\"'center'\"\n (outEvent)=\"handlerClose($event)\">\n <div class=\"libs-ui-modal-header-custom w-full flex items-center justify-between min-w-0\">\n <div class=\"w-full ml-[24px] mr-[8px] flex justify-between items-center min-w-0 gap-[16px]\">\n <div class=\"w-2/8 flex-1\"></div>\n <div class=\"flex libs-ui-font-h4s min-w-0 w-4/8 justify-center flex-1\">\n <libs_ui-components-popover\n [type]=\"'text'\"\n [config]=\"{ zIndex: zIndex() }\">\n {{ fileView()?.name }}\n </libs_ui-components-popover>\n </div>\n @if (buttons()?.length) {\n <div class=\"flex gap-[8px] items-center w-2/8 justify-end flex-1\">\n @for (button of buttons(); track button.key) {\n <libs_ui-components-buttons-button\n [type]=\"button.type || 'button-third'\"\n [label]=\"button.label || ''\"\n [classIconLeft]=\"button.classIconLeft || ''\"\n [classIconRight]=\"button.classIconRight || ''\"\n [iconOnlyType]=\"button.iconOnlyType || false\"\n [classInclude]=\"button.classInclude || '!py-[4px] !px-[12px]'\"\n (outClick)=\"button.action?.(index())\" />\n }\n <div class=\"h-[12px] libs-ui-border-left-general\"></div>\n </div>\n }\n </div>\n </div>\n <div class=\"libs-ui-modal-body-custom h-full w-full flex rounded-b-[8px] overflow-hidden relative\">\n @if (index() > 0) {\n <div class=\"absolute top-[50%] left-[24px] transform -translate-y-[50%] z-[1]\">\n <libs_ui-components-buttons-button\n [type]=\"'button-outline'\"\n [iconOnlyType]=\"true\"\n [classInclude]=\"'!p-[11px] !rounded-[8px]'\"\n [classIconLeft]=\"'libs-ui-icon-chevron-right rotate-180 before:!text-[20px]'\"\n (outClick)=\"handlerPrev()\" />\n </div>\n }\n @if (fileView(); as fileView) {\n @if (fileView | LibsUiPipesCheckFileExtensionPipe: 'image') {\n <div class=\"w-full h-full relative flex items-center justify-center\">\n @if (fileView.url || fileView.origin_url; as url) {\n <img\n [src]=\"url\"\n alt=\"\"\n class=\"max-w-full max-h-full object-contain\"\n (load)=\"handlerOnLoad()\"\n (error)=\"handlerImageError($event)\" />\n @if (loading()) {\n <libs_ui-components-spinner [size]=\"'medium'\" />\n }\n }\n </div>\n } @else {\n <iframe\n id=\"google\"\n title=\"File preview\"\n [class.hidden]=\"loading()\"\n [src]=\"fileView.urlFile ?? '' | LibsUiPipesSecurityTrustPipe: 'resourceUrl' | async\"\n width=\"100%\"\n height=\"100%\"\n class=\"border-0\"\n allowfullscreen=\"allowfullscreen\"\n (load)=\"handlerOnLoad()\"></iframe>\n @if (loading()) {\n <libs_ui-components-skeleton [class]=\"'w-full h-full'\" />\n }\n }\n @if (index() < data().length - 1) {\n <div class=\"absolute top-[50%] right-[24px] transform -translate-y-[50%] z-[1]\">\n <libs_ui-components-buttons-button\n [type]=\"'button-outline'\"\n [iconOnlyType]=\"true\"\n [classInclude]=\"'!p-[11px] !rounded-[8px]'\"\n [classIconLeft]=\"'libs-ui-icon-chevron-right before:!text-[20px]'\"\n (outClick)=\"handlerNext()\" />\n </div>\n }\n }\n </div>\n</libs_ui-components-modal>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,13 +1,18 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@libs-ui/components-preview-file",
|
|
3
|
-
"version": "0.2.
|
|
3
|
+
"version": "0.2.357-0",
|
|
4
4
|
"peerDependencies": {
|
|
5
5
|
"@angular/common": ">=18.0.0",
|
|
6
6
|
"@angular/core": ">=18.0.0",
|
|
7
|
-
"@libs-ui/components-modal": "0.2.
|
|
8
|
-
"@libs-ui/components-skeleton": "0.2.
|
|
9
|
-
"@libs-ui/interfaces-types": "0.2.
|
|
10
|
-
"@libs-ui/pipes-security-trust": "0.2.
|
|
7
|
+
"@libs-ui/components-modal": "0.2.357-0",
|
|
8
|
+
"@libs-ui/components-skeleton": "0.2.357-0",
|
|
9
|
+
"@libs-ui/interfaces-types": "0.2.357-0",
|
|
10
|
+
"@libs-ui/pipes-security-trust": "0.2.357-0",
|
|
11
|
+
"@libs-ui/components-buttons-button": "0.2.357-0",
|
|
12
|
+
"@libs-ui/components-popover": "0.2.357-0",
|
|
13
|
+
"@libs-ui/components-spinner": "0.2.357-0",
|
|
14
|
+
"@libs-ui/pipes-check-file-extension": "0.2.357-0",
|
|
15
|
+
"@libs-ui/utils": "0.2.357-0"
|
|
11
16
|
},
|
|
12
17
|
"sideEffects": false,
|
|
13
18
|
"module": "fesm2022/libs-ui-components-preview-file.mjs",
|
|
@@ -3,10 +3,10 @@ import { TYPE_MODAL_EVENT } from '@libs-ui/components-modal';
|
|
|
3
3
|
import { IFile } from '@libs-ui/interfaces-types';
|
|
4
4
|
import * as i0 from "@angular/core";
|
|
5
5
|
export declare class LibsUiComponentsPreviewFileComponent {
|
|
6
|
-
private linkImageError;
|
|
6
|
+
private readonly linkImageError;
|
|
7
7
|
protected loading: import("@angular/core").WritableSignal<boolean>;
|
|
8
8
|
protected fileView: import("@angular/core").Signal<{
|
|
9
|
-
urlFile: string;
|
|
9
|
+
urlFile: string | undefined;
|
|
10
10
|
id?: string;
|
|
11
11
|
name?: string;
|
|
12
12
|
file?: File;
|
|
@@ -25,7 +25,9 @@ export declare class LibsUiComponentsPreviewFileComponent {
|
|
|
25
25
|
readonly index: import("@angular/core").ModelSignal<number>;
|
|
26
26
|
readonly data: import("@angular/core").InputSignal<IFile[]>;
|
|
27
27
|
readonly buttons: import("@angular/core").InputSignal<IButton[] | undefined>;
|
|
28
|
+
readonly isSourceIframe: import("@angular/core").InputSignal<boolean | undefined>;
|
|
28
29
|
readonly outClose: import("@angular/core").OutputEmitterRef<void>;
|
|
30
|
+
readonly outChangeIndex: import("@angular/core").OutputEmitterRef<number>;
|
|
29
31
|
constructor(linkImageError: string);
|
|
30
32
|
protected handlerOnLoad(): Promise<void>;
|
|
31
33
|
protected handlerClose(type: TYPE_MODAL_EVENT): Promise<void>;
|
|
@@ -34,5 +36,5 @@ export declare class LibsUiComponentsPreviewFileComponent {
|
|
|
34
36
|
protected handlerNext(): void;
|
|
35
37
|
protected handlerImageError(event: Event): Promise<void>;
|
|
36
38
|
static ɵfac: i0.ɵɵFactoryDeclaration<LibsUiComponentsPreviewFileComponent, [{ optional: true; }]>;
|
|
37
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<LibsUiComponentsPreviewFileComponent, "libs_ui-components-preview_file", never, { "zIndex": { "alias": "zIndex"; "required": false; "isSignal": true; }; "index": { "alias": "index"; "required": true; "isSignal": true; }; "data": { "alias": "data"; "required": true; "isSignal": true; }; "buttons": { "alias": "buttons"; "required": false; "isSignal": true; }; }, { "index": "indexChange"; "outClose": "outClose"; }, never, never, true, never>;
|
|
39
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<LibsUiComponentsPreviewFileComponent, "libs_ui-components-preview_file", never, { "zIndex": { "alias": "zIndex"; "required": false; "isSignal": true; }; "index": { "alias": "index"; "required": true; "isSignal": true; }; "data": { "alias": "data"; "required": true; "isSignal": true; }; "buttons": { "alias": "buttons"; "required": false; "isSignal": true; }; "isSourceIframe": { "alias": "isSourceIframe"; "required": false; "isSignal": true; }; }, { "index": "indexChange"; "outClose": "outClose"; "outChangeIndex": "outChangeIndex"; }, never, never, true, never>;
|
|
38
40
|
}
|