@acorex/components 20.8.33 → 20.9.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,736 @@
1
+ import * as i0 from '@angular/core';
2
+ import { signal, Injectable, APP_INITIALIZER, input, inject, computed, ChangeDetectionStrategy, Component, effect, ElementRef, viewChild, untracked, afterNextRender, ViewEncapsulation } from '@angular/core';
3
+ import { defineFileType, AX_IMAGE_FILE_TYPE, AX_VIDEO_FILE_TYPE, AX_AUDIO_FILE_TYPE, AX_DOCUMENT_FILE_TYPE, AX_FILE_FILE_TYPE, AXFileTypeRegistryService, AXFileTypeRendererOutletComponent } from '@acorex/core/file';
4
+ import { AXCarouselDirective } from '@acorex/cdk/carousel';
5
+ import { AXBadgeComponent } from '@acorex/components/badge';
6
+ import { AXButtonComponent } from '@acorex/components/button';
7
+ import { AXDecoratorFullScreenButtonComponent, AXDecoratorIconComponent } from '@acorex/components/decorators';
8
+ import { AXLoadingComponent } from '@acorex/components/loading';
9
+ import { AXTooltipDirective } from '@acorex/components/tooltip';
10
+ import { AXZIndexService } from '@acorex/core/z-index';
11
+ import { AXPdfReaderComponent } from '@acorex/components/pdf-reader';
12
+ import { DomSanitizer } from '@angular/platform-browser';
13
+
14
+ /** Carousel state shared between container, slides and thumbnails. Provided per-container. */
15
+ class AXFileViewerService {
16
+ constructor() {
17
+ this.items = signal([], ...(ngDevMode ? [{ debugName: "items" }] : []));
18
+ this.selectedIndex = signal(0, ...(ngDevMode ? [{ debugName: "selectedIndex" }] : []));
19
+ this.urlCache = new Map();
20
+ }
21
+ /** Resolve a potentially lazy URL — caches the result. */
22
+ async resolveUrl(item, key) {
23
+ const raw = item[key];
24
+ if (!raw) {
25
+ return undefined;
26
+ }
27
+ const cacheKey = `${item.id}:${key}`;
28
+ const cached = this.urlCache.get(cacheKey);
29
+ if (cached) {
30
+ return cached;
31
+ }
32
+ const resolved = typeof raw === 'function' ? await raw() : raw;
33
+ this.urlCache.set(cacheKey, resolved);
34
+ return resolved;
35
+ }
36
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXFileViewerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
37
+ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXFileViewerService }); }
38
+ }
39
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXFileViewerService, decorators: [{
40
+ type: Injectable
41
+ }] });
42
+
43
+ function createFileViewerFileTypes() {
44
+ return [
45
+ defineFileType({
46
+ ...AX_IMAGE_FILE_TYPE,
47
+ name: 'image',
48
+ component: () => Promise.resolve().then(function () { return imageViewer_component; }).then((m) => m.AXFileViewerImageComponent),
49
+ }),
50
+ defineFileType({
51
+ ...AX_VIDEO_FILE_TYPE,
52
+ name: 'video',
53
+ component: () => Promise.resolve().then(function () { return videoViewer_component; }).then((m) => m.AXFileViewerVideoComponent),
54
+ }),
55
+ defineFileType({
56
+ ...AX_AUDIO_FILE_TYPE,
57
+ name: 'audio',
58
+ component: () => Promise.resolve().then(function () { return audioViewer_component; }).then((m) => m.AXFileViewerAudioComponent),
59
+ }),
60
+ defineFileType({
61
+ ...AX_DOCUMENT_FILE_TYPE,
62
+ name: 'document',
63
+ component: () => Promise.resolve().then(function () { return pdfViewer_component; }).then((m) => m.AXFileViewerPdfComponent),
64
+ extensions: (AX_DOCUMENT_FILE_TYPE.extensions ?? []).map((extension) => extension.name.toLowerCase() === 'pdf'
65
+ ? {
66
+ ...extension,
67
+ component: () => Promise.resolve().then(function () { return pdfViewer_component; }).then((m) => m.AXFileViewerPdfComponent),
68
+ }
69
+ : extension),
70
+ }),
71
+ defineFileType({
72
+ ...AX_FILE_FILE_TYPE,
73
+ name: 'file',
74
+ component: () => Promise.resolve().then(function () { return fileFallbackViewer_component; }).then((m) => m.AXFileViewerFileFallbackComponent),
75
+ }),
76
+ ];
77
+ }
78
+
79
+ /** Registers file-viewer components on standard file-type catalog entries. */
80
+ function provideFileViewer() {
81
+ return [
82
+ {
83
+ provide: APP_INITIALIZER,
84
+ useFactory: (registry) => () => registry.registerTypes(createFileViewerFileTypes()),
85
+ deps: [AXFileTypeRegistryService],
86
+ multi: true,
87
+ },
88
+ ];
89
+ }
90
+
91
+ const MIME_PREFIX_MAP = {
92
+ 'image/': 'image',
93
+ 'video/': 'video',
94
+ 'audio/': 'audio',
95
+ 'application/pdf': 'document',
96
+ };
97
+ /** Infers a file-type catalog name from the item. */
98
+ function resolveFileViewerFileType(item) {
99
+ if (item.fileType) {
100
+ return item.fileType;
101
+ }
102
+ if (item.mimeType) {
103
+ const mime = item.mimeType.toLowerCase();
104
+ for (const [prefix, name] of Object.entries(MIME_PREFIX_MAP)) {
105
+ if (mime.startsWith(prefix) || mime === prefix) {
106
+ return name;
107
+ }
108
+ }
109
+ }
110
+ if (item.extension) {
111
+ const ext = item.extension.replace(/^\./, '').toLowerCase();
112
+ if (['jpg', 'jpeg', 'png', 'gif', 'webp', 'svg'].includes(ext))
113
+ return 'image';
114
+ if (['mp4', 'webm', 'ogg'].includes(ext))
115
+ return 'video';
116
+ if (['mp3', 'wav', 'm4a'].includes(ext))
117
+ return 'audio';
118
+ if (ext === 'pdf')
119
+ return 'document';
120
+ }
121
+ return 'file';
122
+ }
123
+ /** Builds an extension hint from item metadata. */
124
+ function buildFileViewerExtensionHint(item) {
125
+ if (!item.mimeType && !item.extension) {
126
+ return undefined;
127
+ }
128
+ return {
129
+ mimeType: item.mimeType,
130
+ extensionName: item.extension,
131
+ };
132
+ }
133
+
134
+ class AXFileViewerSlideComponent {
135
+ constructor() {
136
+ this.item = input.required(...(ngDevMode ? [{ debugName: "item" }] : []));
137
+ this.index = input.required(...(ngDevMode ? [{ debugName: "index" }] : []));
138
+ this.service = inject(AXFileViewerService);
139
+ this.fileTypeName = computed(() => resolveFileViewerFileType(this.item()), ...(ngDevMode ? [{ debugName: "fileTypeName" }] : []));
140
+ this.extensionHint = computed(() => buildFileViewerExtensionHint(this.item()), ...(ngDevMode ? [{ debugName: "extensionHint" }] : []));
141
+ this.viewPayload = computed(() => ({
142
+ item: this.item(),
143
+ index: this.index(),
144
+ active: this.service.selectedIndex() === this.index(),
145
+ }), ...(ngDevMode ? [{ debugName: "viewPayload" }] : []));
146
+ }
147
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXFileViewerSlideComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
148
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.3", type: AXFileViewerSlideComponent, isStandalone: true, selector: "ax-file-viewer-slide", inputs: { item: { classPropertyName: "item", publicName: "item", isSignal: true, isRequired: true, transformFunction: null }, index: { classPropertyName: "index", publicName: "index", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: `
149
+ <ax-file-type-renderer [fileType]="fileTypeName()" [payload]="viewPayload()" [extensionHint]="extensionHint()" />
150
+ `, isInline: true, styles: [":host{display:flex;width:100%;height:100%;min-width:0;min-height:0;align-items:stretch;justify-content:stretch;-webkit-user-select:none;user-select:none;box-sizing:border-box}\n"], dependencies: [{ kind: "component", type: AXFileTypeRendererOutletComponent, selector: "ax-file-type-renderer", inputs: ["fileType", "payload", "extensionHint", "inputs"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
151
+ }
152
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXFileViewerSlideComponent, decorators: [{
153
+ type: Component,
154
+ args: [{ selector: 'ax-file-viewer-slide', changeDetection: ChangeDetectionStrategy.OnPush, imports: [AXFileTypeRendererOutletComponent], template: `
155
+ <ax-file-type-renderer [fileType]="fileTypeName()" [payload]="viewPayload()" [extensionHint]="extensionHint()" />
156
+ `, styles: [":host{display:flex;width:100%;height:100%;min-width:0;min-height:0;align-items:stretch;justify-content:stretch;-webkit-user-select:none;user-select:none;box-sizing:border-box}\n"] }]
157
+ }] });
158
+
159
+ const TYPE_ICON_MAP$1 = {
160
+ image: 'fa-light fa-image',
161
+ video: 'fa-light fa-video',
162
+ audio: 'fa-light fa-music',
163
+ document: 'fa-light fa-file-pdf',
164
+ file: 'fa-light fa-file-zipper',
165
+ };
166
+ class AXFileViewerThumbPreviewComponent {
167
+ constructor() {
168
+ this.item = input.required(...(ngDevMode ? [{ debugName: "item" }] : []));
169
+ this.service = inject(AXFileViewerService);
170
+ this.src = signal(null, ...(ngDevMode ? [{ debugName: "src" }] : []));
171
+ this.icon = computed(() => {
172
+ const type = resolveFileViewerFileType(this.item());
173
+ return TYPE_ICON_MAP$1[type] ?? TYPE_ICON_MAP$1['file'];
174
+ }, ...(ngDevMode ? [{ debugName: "icon" }] : []));
175
+ this.#resolve = effect((onCleanup) => {
176
+ const item = this.item();
177
+ this.src.set(null);
178
+ let cancelled = false;
179
+ onCleanup(() => {
180
+ cancelled = true;
181
+ });
182
+ void this.resolvePreview(item).then((url) => {
183
+ if (!cancelled) {
184
+ this.src.set(url ?? null);
185
+ }
186
+ });
187
+ }, ...(ngDevMode ? [{ debugName: "#resolve" }] : []));
188
+ }
189
+ #resolve;
190
+ async resolvePreview(item) {
191
+ const thumbnail = await this.service.resolveUrl(item, 'thumbnailUrl');
192
+ if (thumbnail) {
193
+ return thumbnail;
194
+ }
195
+ // Images can use the main asset URL when no dedicated thumbnail is provided.
196
+ if (resolveFileViewerFileType(item) === 'image') {
197
+ return this.service.resolveUrl(item, 'url');
198
+ }
199
+ return undefined;
200
+ }
201
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXFileViewerThumbPreviewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
202
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.3", type: AXFileViewerThumbPreviewComponent, isStandalone: true, selector: "ax-file-viewer-thumb-preview", inputs: { item: { classPropertyName: "item", publicName: "item", isSignal: true, isRequired: true, transformFunction: null } }, host: { classAttribute: "ax-file-viewer__thumb-preview" }, ngImport: i0, template: `
203
+ @if (src()) {
204
+ <img [src]="src()!" [alt]="item().name ?? ''" loading="lazy" />
205
+ } @else {
206
+ <i [class]="icon()"></i>
207
+ }
208
+ `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
209
+ }
210
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXFileViewerThumbPreviewComponent, decorators: [{
211
+ type: Component,
212
+ args: [{
213
+ selector: 'ax-file-viewer-thumb-preview',
214
+ changeDetection: ChangeDetectionStrategy.OnPush,
215
+ host: { class: 'ax-file-viewer__thumb-preview' },
216
+ template: `
217
+ @if (src()) {
218
+ <img [src]="src()!" [alt]="item().name ?? ''" loading="lazy" />
219
+ } @else {
220
+ <i [class]="icon()"></i>
221
+ }
222
+ `,
223
+ }]
224
+ }] });
225
+
226
+ const TYPE_LABEL_MAP = {
227
+ image: 'IMAGE',
228
+ video: 'VIDEO',
229
+ audio: 'AUDIO',
230
+ document: 'PDF',
231
+ file: 'FILE',
232
+ };
233
+ const TYPE_COLOR_MAP = {
234
+ image: 'success',
235
+ video: 'primary',
236
+ audio: 'danger',
237
+ document: 'warning',
238
+ file: 'secondary',
239
+ };
240
+ class AXFileViewerContainerComponent {
241
+ constructor() {
242
+ this.items = input([], ...(ngDevMode ? [{ debugName: "items" }] : []));
243
+ this.thumbnail = input(true, ...(ngDevMode ? [{ debugName: "thumbnail" }] : []));
244
+ this.pagination = input(true, ...(ngDevMode ? [{ debugName: "pagination" }] : []));
245
+ this.download = input(true, ...(ngDevMode ? [{ debugName: "download" }] : []));
246
+ this.fullscreen = input(true, ...(ngDevMode ? [{ debugName: "fullscreen" }] : []));
247
+ /** External loading flag — show overlay while parent data is being fetched. */
248
+ this.loading = input(false, ...(ngDevMode ? [{ debugName: "loading" }] : []));
249
+ this.service = inject(AXFileViewerService);
250
+ this.host = inject((ElementRef));
251
+ this.zIndexService = inject(AXZIndexService);
252
+ this.mainCarouselRef = viewChild('mainCarousel', ...(ngDevMode ? [{ debugName: "mainCarouselRef" }] : []));
253
+ this.thumbCarouselRef = viewChild('thumbCarousel', ...(ngDevMode ? [{ debugName: "thumbCarouselRef" }] : []));
254
+ this.fullScreenButton = viewChild(AXDecoratorFullScreenButtonComponent, ...(ngDevMode ? [{ debugName: "fullScreenButton" }] : []));
255
+ this.zToken = null;
256
+ this.initToken = 0;
257
+ /** True while carousels are being (re)initialized. */
258
+ this.initializing = signal(true, ...(ngDevMode ? [{ debugName: "initializing" }] : []));
259
+ this.isBusy = computed(() => this.loading() || this.initializing(), ...(ngDevMode ? [{ debugName: "isBusy" }] : []));
260
+ this.isFirstSlide = computed(() => this.service.selectedIndex() <= 0, ...(ngDevMode ? [{ debugName: "isFirstSlide" }] : []));
261
+ this.isLastSlide = computed(() => this.service.selectedIndex() >= Math.max(this.service.items().length - 1, 0), ...(ngDevMode ? [{ debugName: "isLastSlide" }] : []));
262
+ this.currentItem = computed(() => this.service.items()[this.service.selectedIndex()], ...(ngDevMode ? [{ debugName: "currentItem" }] : []));
263
+ this.currentFileType = computed(() => {
264
+ const item = this.currentItem();
265
+ return item ? resolveFileViewerFileType(item) : 'file';
266
+ }, ...(ngDevMode ? [{ debugName: "currentFileType" }] : []));
267
+ this.currentTypeLabel = computed(() => TYPE_LABEL_MAP[this.currentFileType()] ?? 'FILE', ...(ngDevMode ? [{ debugName: "currentTypeLabel" }] : []));
268
+ this.currentTypeColor = computed(() => TYPE_COLOR_MAP[this.currentFileType()] ?? 'secondary', ...(ngDevMode ? [{ debugName: "currentTypeColor" }] : []));
269
+ this.slideCounter = computed(() => {
270
+ const total = this.service.items().length;
271
+ if (!total)
272
+ return '0 / 0';
273
+ return `${this.service.selectedIndex() + 1} / ${total}`;
274
+ }, ...(ngDevMode ? [{ debugName: "slideCounter" }] : []));
275
+ this.resolveFileType = resolveFileViewerFileType;
276
+ this.mainCarouselOptions = {
277
+ slidesPerView: 1,
278
+ observer: true,
279
+ observeParents: true,
280
+ updateOnWindowResize: true,
281
+ resizeObserver: true,
282
+ keyboard: true,
283
+ watchSlidesProgress: true,
284
+ speed: 300,
285
+ };
286
+ this.thumbnailCarouselOptions = {
287
+ spaceBetween: 10,
288
+ slidesPerView: 'auto',
289
+ watchSlidesProgress: true,
290
+ observer: true,
291
+ observeParents: true,
292
+ updateOnWindowResize: true,
293
+ resizeObserver: true,
294
+ };
295
+ this.#syncItems = effect(() => {
296
+ const items = this.items();
297
+ this.service.items.set(items);
298
+ if (items.length > 0) {
299
+ this.initializing.set(true);
300
+ setTimeout(() => void this.initCarousels());
301
+ }
302
+ else if (!this.loading()) {
303
+ this.initializing.set(false);
304
+ }
305
+ }, ...(ngDevMode ? [{ debugName: "#syncItems" }] : []));
306
+ this.#bindSlideChange = effect(() => {
307
+ const carousel = this.mainCarouselRef()?.carousel();
308
+ if (carousel) {
309
+ carousel.on('activeIndexChange', this.onSlideChange);
310
+ }
311
+ }, ...(ngDevMode ? [{ debugName: "#bindSlideChange" }] : []));
312
+ this.#bindFullscreenTarget = effect(() => {
313
+ const btn = this.fullScreenButton();
314
+ if (!btn)
315
+ return;
316
+ const host = this.host.nativeElement;
317
+ untracked(() => {
318
+ if (btn.element() !== host) {
319
+ btn.element.set(host);
320
+ }
321
+ });
322
+ }, ...(ngDevMode ? [{ debugName: "#bindFullscreenTarget" }] : []));
323
+ this.#init = afterNextRender(() => {
324
+ void this.initCarousels();
325
+ });
326
+ this.#fullScreenClass = effect(() => {
327
+ const active = this.fullScreenButton()?.isActive() ?? false;
328
+ const el = this.host.nativeElement;
329
+ if (active) {
330
+ el.classList.add('ax-file-viewer--fullscreen');
331
+ this.acquireFullscreenZIndex(el);
332
+ }
333
+ else {
334
+ el.classList.remove('ax-file-viewer--fullscreen');
335
+ this.releaseFullscreenZIndex(el);
336
+ }
337
+ }, ...(ngDevMode ? [{ debugName: "#fullScreenClass" }] : []));
338
+ this.onSlideChange = (swiper) => {
339
+ this.service.selectedIndex.set(swiper.activeIndex);
340
+ };
341
+ }
342
+ resolveTypeLabel(item) {
343
+ return TYPE_LABEL_MAP[resolveFileViewerFileType(item)] ?? 'FILE';
344
+ }
345
+ formatSize(size) {
346
+ if (size == null || Number.isNaN(size))
347
+ return '';
348
+ if (size < 1024)
349
+ return `${size} B`;
350
+ if (size < 1024 * 1024)
351
+ return `${(size / 1024).toFixed(1)} KB`;
352
+ return `${(size / (1024 * 1024)).toFixed(1)} MB`;
353
+ }
354
+ #syncItems;
355
+ #bindSlideChange;
356
+ #bindFullscreenTarget;
357
+ #init;
358
+ #fullScreenClass;
359
+ acquireFullscreenZIndex(el) {
360
+ if (this.zToken) {
361
+ this.zToken = this.zIndexService.bringToFront(this.zToken);
362
+ }
363
+ else {
364
+ this.zToken = this.zIndexService.acquire();
365
+ }
366
+ el.style.zIndex = String(this.zToken.zIndex);
367
+ }
368
+ releaseFullscreenZIndex(el) {
369
+ if (!this.zToken)
370
+ return;
371
+ this.zIndexService.release(this.zToken);
372
+ this.zToken = null;
373
+ el.style.zIndex = '';
374
+ }
375
+ async initCarousels() {
376
+ const token = ++this.initToken;
377
+ const mainRef = this.mainCarouselRef();
378
+ if (!mainRef || !this.service.items().length) {
379
+ if (!this.loading()) {
380
+ this.initializing.set(false);
381
+ }
382
+ return;
383
+ }
384
+ this.initializing.set(true);
385
+ try {
386
+ const thumbRef = this.thumbnail() ? this.thumbCarouselRef() : undefined;
387
+ if (thumbRef?.carousel()) {
388
+ thumbRef.carousel().destroy(true, true);
389
+ }
390
+ if (mainRef.carousel()) {
391
+ mainRef.carousel().destroy(true, true);
392
+ }
393
+ if (thumbRef) {
394
+ await thumbRef.init(this.thumbnailCarouselOptions);
395
+ await mainRef.init({
396
+ ...this.mainCarouselOptions,
397
+ thumbs: { swiper: thumbRef.carousel() },
398
+ });
399
+ }
400
+ else {
401
+ await mainRef.init(this.mainCarouselOptions);
402
+ }
403
+ if (token !== this.initToken)
404
+ return;
405
+ mainRef.carousel()?.slideTo(this.service.selectedIndex(), 0);
406
+ }
407
+ finally {
408
+ if (token === this.initToken) {
409
+ this.initializing.set(false);
410
+ }
411
+ }
412
+ }
413
+ next() {
414
+ if (this.isLastSlide())
415
+ return;
416
+ if (this.thumbnail()) {
417
+ this.thumbCarouselRef()?.carousel()?.slideNext();
418
+ }
419
+ this.mainCarouselRef()?.carousel()?.slideNext();
420
+ }
421
+ prev() {
422
+ if (this.isFirstSlide())
423
+ return;
424
+ if (this.thumbnail()) {
425
+ this.thumbCarouselRef()?.carousel()?.slidePrev();
426
+ }
427
+ this.mainCarouselRef()?.carousel()?.slidePrev();
428
+ }
429
+ goToIndex(index, speed = 300) {
430
+ this.service.selectedIndex.set(index);
431
+ this.mainCarouselRef()?.carousel()?.slideTo(index, speed);
432
+ if (this.thumbnail()) {
433
+ this.thumbCarouselRef()?.carousel()?.slideTo(index, speed);
434
+ }
435
+ }
436
+ async downloadCurrent() {
437
+ const item = this.currentItem();
438
+ if (!item)
439
+ return;
440
+ const url = await this.service.resolveUrl(item, 'url');
441
+ if (!url)
442
+ return;
443
+ const anchor = document.createElement('a');
444
+ anchor.href = url;
445
+ anchor.download = item.name ?? 'download';
446
+ anchor.target = '_blank';
447
+ anchor.rel = 'noopener';
448
+ anchor.click();
449
+ }
450
+ ngOnDestroy() {
451
+ this.mainCarouselRef()?.carousel()?.off('activeIndexChange', this.onSlideChange);
452
+ this.releaseFullscreenZIndex(this.host.nativeElement);
453
+ }
454
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXFileViewerContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
455
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.3", type: AXFileViewerContainerComponent, isStandalone: true, selector: "ax-file-viewer-container", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, thumbnail: { classPropertyName: "thumbnail", publicName: "thumbnail", isSignal: true, isRequired: false, transformFunction: null }, pagination: { classPropertyName: "pagination", publicName: "pagination", isSignal: true, isRequired: false, transformFunction: null }, download: { classPropertyName: "download", publicName: "download", isSignal: true, isRequired: false, transformFunction: null }, fullscreen: { classPropertyName: "fullscreen", publicName: "fullscreen", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null } }, providers: [AXFileViewerService], viewQueries: [{ propertyName: "mainCarouselRef", first: true, predicate: ["mainCarousel"], descendants: true, isSignal: true }, { propertyName: "thumbCarouselRef", first: true, predicate: ["thumbCarousel"], descendants: true, isSignal: true }, { propertyName: "fullScreenButton", first: true, predicate: AXDecoratorFullScreenButtonComponent, descendants: true, isSignal: true }], ngImport: i0, template: "@if (isBusy()) {\n <div class=\"ax-file-viewer__loading\" aria-busy=\"true\" aria-live=\"polite\">\n <ax-loading></ax-loading>\n </div>\n}\n\n@if (currentItem(); as item) {\n <header class=\"ax-file-viewer__header\">\n <div class=\"ax-file-viewer__meta\">\n <div class=\"ax-file-viewer__title-row\">\n <span class=\"ax-file-viewer__name\">{{ item.name || 'Untitled' }}</span>\n <ax-badge\n class=\"ax-file-viewer__type-badge ax-pill ax-sm\"\n look=\"outline\"\n [color]=\"currentTypeColor()\"\n [text]=\"currentTypeLabel()\"\n />\n </div>\n <div class=\"ax-file-viewer__submeta\">\n @if (formatSize(item.size); as sizeLabel) {\n <span>{{ sizeLabel }}</span>\n }\n @if (item.extension) {\n <span class=\"ax-file-viewer__dot\">\u00B7</span>\n <span>.{{ item.extension }}</span>\n } @else if (item.mimeType) {\n <span class=\"ax-file-viewer__dot\">\u00B7</span>\n <span>{{ item.mimeType }}</span>\n }\n </div>\n </div>\n\n @if (download() || fullscreen()) {\n <div class=\"ax-file-viewer__header-actions\">\n @if (download()) {\n <ax-button\n class=\"ax-file-viewer__action-btn\"\n look=\"outline\"\n color=\"default\"\n [iconOnly]=\"true\"\n [axTooltip]=\"'Download'\"\n (onClick)=\"downloadCurrent()\"\n >\n <ax-icon icon=\"fa-light fa-download\"></ax-icon>\n </ax-button>\n }\n\n @if (fullscreen()) {\n <div class=\"ax-file-viewer__action-btn ax-file-viewer__fullscreen-wrap\">\n <ax-fullscreen-button></ax-fullscreen-button>\n </div>\n }\n </div>\n }\n </header>\n}\n\n<div\n class=\"ax-file-viewer__stage\"\n [class.ax-file-viewer__stage--nav]=\"service.items().length > 1\"\n [class.ax-file-viewer__stage--hidden]=\"isBusy()\"\n>\n @if (service.items().length > 1) {\n <ax-button\n class=\"ax-file-viewer__nav ax-file-viewer__nav--prev\"\n look=\"solid\"\n color=\"default\"\n [iconOnly]=\"true\"\n [disabled]=\"isFirstSlide()\"\n (onClick)=\"prev()\"\n >\n <ax-icon icon=\"fa-light fa-chevron-left\"></ax-icon>\n </ax-button>\n }\n\n <div class=\"ax-file-viewer__canvas\">\n <div #mainCarousel=\"axCarousel\" axCarousel class=\"ax-carousel\">\n <div class=\"ax-carousel-wrapper\">\n @for (file of service.items(); track file.id) {\n <div class=\"ax-carousel-slide\">\n <ax-file-viewer-slide [item]=\"file\" [index]=\"$index\" />\n </div>\n }\n </div>\n </div>\n\n @if (service.items().length > 0) {\n <span class=\"ax-file-viewer__overlay-counter\">{{ slideCounter() }}</span>\n }\n </div>\n\n @if (service.items().length > 1) {\n <ax-button\n class=\"ax-file-viewer__nav ax-file-viewer__nav--next\"\n look=\"solid\"\n color=\"default\"\n [iconOnly]=\"true\"\n [disabled]=\"isLastSlide()\"\n (onClick)=\"next()\"\n >\n <ax-icon icon=\"fa-light fa-chevron-right\"></ax-icon>\n </ax-button>\n }\n</div>\n\n@if (thumbnail() && service.items().length > 1) {\n <footer class=\"ax-file-viewer__thumbs\" [class.ax-file-viewer__thumbs--hidden]=\"isBusy()\">\n <div class=\"ax-file-viewer__thumbs-track\">\n <div #thumbCarousel=\"axCarousel\" axCarousel class=\"ax-carousel\">\n <div class=\"ax-carousel-wrapper\">\n @for (file of service.items(); track file.id) {\n <div\n class=\"ax-carousel-slide ax-file-viewer__thumb\"\n [attr.data-type]=\"resolveFileType(file)\"\n [class.ax-file-viewer__thumb--active]=\"service.selectedIndex() === $index\"\n (click)=\"goToIndex($index)\"\n >\n <ax-file-viewer-thumb-preview [item]=\"file\" />\n <div class=\"ax-file-viewer__thumb-footer\">\n <span class=\"ax-file-viewer__thumb-index\">{{ $index + 1 }}</span>\n <span class=\"ax-file-viewer__thumb-name\">{{ file.name || resolveTypeLabel(file) }}</span>\n @if (formatSize(file.size); as sizeLabel) {\n <span class=\"ax-file-viewer__thumb-size\">{{ sizeLabel }}</span>\n }\n </div>\n </div>\n }\n </div>\n </div>\n </div>\n </footer>\n}\n", styles: ["@font-face{font-family:swiper-icons;src:url(data:application/font-woff;charset=utf-8;base64,\\ d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA);font-weight:400;font-style:normal}:root{--swiper-theme-color: #007aff}:host{position:relative;display:block;margin-left:auto;margin-right:auto;z-index:1}.swiper{margin-left:auto;margin-right:auto;position:relative;overflow:hidden;list-style:none;padding:0;z-index:1;display:block}.swiper-vertical>.swiper-wrapper{flex-direction:column}.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:flex;transition-property:transform;transition-timing-function:var(--swiper-wrapper-transition-timing-function, initial);box-sizing:content-box}.swiper-android .swiper-slide,.swiper-ios .swiper-slide,.swiper-wrapper{transform:translateZ(0)}.swiper-horizontal{touch-action:pan-y}.swiper-vertical{touch-action:pan-x}.swiper-slide{flex-shrink:0;width:100%;height:100%;position:relative;transition-property:transform;display:block}.swiper-slide-invisible-blank{visibility:hidden}.swiper-autoheight,.swiper-autoheight .swiper-slide{height:auto}.swiper-autoheight .swiper-wrapper{align-items:flex-start;transition-property:transform,height}.swiper-backface-hidden .swiper-slide{transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-3d.swiper-css-mode .swiper-wrapper{perspective:1200px}.swiper-3d .swiper-wrapper{transform-style:preserve-3d}.swiper-3d{perspective:1200px}.swiper-3d .swiper-slide,.swiper-3d .swiper-cube-shadow{transform-style:preserve-3d}.swiper-css-mode>.swiper-wrapper{overflow:auto;scrollbar-width:none;-ms-overflow-style:none}.swiper-css-mode>.swiper-wrapper::-webkit-scrollbar{display:none}.swiper-css-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:start start}.swiper-css-mode.swiper-horizontal>.swiper-wrapper{scroll-snap-type:x mandatory}.swiper-css-mode.swiper-vertical>.swiper-wrapper{scroll-snap-type:y mandatory}.swiper-css-mode.swiper-free-mode>.swiper-wrapper{scroll-snap-type:none}.swiper-css-mode.swiper-free-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:none}.swiper-css-mode.swiper-centered>.swiper-wrapper:before{content:\"\";flex-shrink:0;order:9999}.swiper-css-mode.swiper-centered>.swiper-wrapper>.swiper-slide{scroll-snap-align:center center;scroll-snap-stop:always}.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper>.swiper-slide:first-child{margin-inline-start:var(--swiper-centered-offset-before)}.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper:before{height:100%;min-height:1px;width:var(--swiper-centered-offset-after)}.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper>.swiper-slide:first-child{margin-block-start:var(--swiper-centered-offset-before)}.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper:before{width:100%;min-width:1px;height:var(--swiper-centered-offset-after)}.swiper-3d .swiper-slide-shadow,.swiper-3d .swiper-slide-shadow-left,.swiper-3d .swiper-slide-shadow-right,.swiper-3d .swiper-slide-shadow-top,.swiper-3d .swiper-slide-shadow-bottom{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10}.swiper-3d .swiper-slide-shadow{background:#00000026}.swiper-3d .swiper-slide-shadow-left{background-image:linear-gradient(to left,#00000080,#0000)}.swiper-3d .swiper-slide-shadow-right{background-image:linear-gradient(to right,#00000080,#0000)}.swiper-3d .swiper-slide-shadow-top{background-image:linear-gradient(to top,#00000080,#0000)}.swiper-3d .swiper-slide-shadow-bottom{background-image:linear-gradient(to bottom,#00000080,#0000)}.swiper-lazy-preloader{width:42px;height:42px;position:absolute;left:50%;top:50%;margin-left:-21px;margin-top:-21px;z-index:10;transform-origin:50%;box-sizing:border-box;border:4px solid var(--swiper-preloader-color, var(--swiper-theme-color));border-radius:50%;border-top-color:transparent}.swiper:not(.swiper-watch-progress) .swiper-lazy-preloader,.swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader{animation:swiper-preloader-spin 1s infinite linear}.swiper-lazy-preloader-white{--swiper-preloader-color: #fff}.swiper-lazy-preloader-black{--swiper-preloader-color: #000}@keyframes swiper-preloader-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.swiper-virtual .swiper-slide{-webkit-backface-visibility:hidden;transform:translateZ(0)}.swiper-virtual.swiper-css-mode .swiper-wrapper:after{content:\"\";position:absolute;left:0;top:0;pointer-events:none}.swiper-virtual.swiper-css-mode.swiper-horizontal .swiper-wrapper:after{height:1px;width:var(--swiper-virtual-size)}.swiper-virtual.swiper-css-mode.swiper-vertical .swiper-wrapper:after{width:1px;height:var(--swiper-virtual-size)}:root{--swiper-navigation-size: 44px}.swiper-button-prev,.swiper-button-next{position:absolute;top:var(--swiper-navigation-top-offset, 50%);width:calc(var(--swiper-navigation-size) / 44 * 27);height:var(--swiper-navigation-size);margin-top:calc(0px - var(--swiper-navigation-size) / 2);z-index:10;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--swiper-navigation-color, var(--swiper-theme-color))}.swiper-button-prev.swiper-button-disabled,.swiper-button-next.swiper-button-disabled{opacity:.35;cursor:auto;pointer-events:none}.swiper-button-prev.swiper-button-hidden,.swiper-button-next.swiper-button-hidden{opacity:0;cursor:auto;pointer-events:none}.swiper-navigation-disabled .swiper-button-prev,.swiper-navigation-disabled .swiper-button-next{display:none!important}.swiper-button-prev svg,.swiper-button-next svg{width:100%;height:100%;object-fit:contain;transform-origin:center}.swiper-rtl .swiper-button-prev svg,.swiper-rtl .swiper-button-next svg{transform:rotate(180deg)}.swiper-button-prev,.swiper-rtl .swiper-button-next{left:var(--swiper-navigation-sides-offset, 10px);right:auto}.swiper-button-lock{display:none}.swiper-button-prev:after,.swiper-button-next:after{font-family:swiper-icons;font-size:var(--swiper-navigation-size);text-transform:none!important;letter-spacing:0;font-variant:initial;line-height:1}.swiper-button-prev:after,.swiper-rtl .swiper-button-next:after{content:\"prev\"}.swiper-button-next,.swiper-rtl .swiper-button-prev{right:var(--swiper-navigation-sides-offset, 10px);left:auto}.swiper-button-next:after,.swiper-rtl .swiper-button-prev:after{content:\"next\"}.swiper-pagination{position:absolute;text-align:center;transition:.3s opacity;transform:translateZ(0);z-index:10}.swiper-pagination.swiper-pagination-hidden{opacity:0}.swiper-pagination-disabled>.swiper-pagination,.swiper-pagination.swiper-pagination-disabled{display:none!important}.swiper-pagination-fraction,.swiper-pagination-custom,.swiper-horizontal>.swiper-pagination-bullets,.swiper-pagination-bullets.swiper-pagination-horizontal{bottom:var(--swiper-pagination-bottom, 8px);top:var(--swiper-pagination-top, auto);left:0;width:100%}.swiper-pagination-bullets-dynamic{overflow:hidden;font-size:0}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transform:scale(.33);position:relative}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active,.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main{transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev{transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev{transform:scale(.33)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next{transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next{transform:scale(.33)}.swiper-pagination-bullet{width:var(--swiper-pagination-bullet-width, var(--swiper-pagination-bullet-size, 8px));height:var(--swiper-pagination-bullet-height, var(--swiper-pagination-bullet-size, 8px));display:inline-block;border-radius:var(--swiper-pagination-bullet-border-radius, 50%);background:var(--swiper-pagination-bullet-inactive-color, #000);opacity:var(--swiper-pagination-bullet-inactive-opacity, .2)}button.swiper-pagination-bullet{border:none;margin:0;padding:0;box-shadow:none;-webkit-appearance:none;appearance:none}.swiper-pagination-clickable .swiper-pagination-bullet{cursor:pointer}.swiper-pagination-bullet:only-child{display:none!important}.swiper-pagination-bullet-active{opacity:var(--swiper-pagination-bullet-opacity, 1);background:var(--swiper-pagination-color, var(--swiper-theme-color))}.swiper-vertical>.swiper-pagination-bullets,.swiper-pagination-vertical.swiper-pagination-bullets{right:var(--swiper-pagination-right, 8px);left:var(--swiper-pagination-left, auto);top:50%;transform:translate3d(0,-50%,0)}.swiper-vertical>.swiper-pagination-bullets .swiper-pagination-bullet,.swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet{margin:var(--swiper-pagination-bullet-vertical-gap, 6px) 0;display:block}.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{top:50%;transform:translateY(-50%);width:8px}.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{display:inline-block;transition:.2s transform,.2s top}.swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet,.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 var(--swiper-pagination-bullet-horizontal-gap, 4px)}.swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{left:50%;transform:translate(-50%);white-space:nowrap}.swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s left}.swiper-horizontal.swiper-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s right}.swiper-pagination-fraction{color:var(--swiper-pagination-fraction-color, inherit)}.swiper-pagination-progressbar{background:var(--swiper-pagination-progressbar-bg-color, rgba(0, 0, 0, .25));position:absolute}.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:var(--swiper-pagination-color, var(--swiper-theme-color));position:absolute;left:0;top:0;width:100%;height:100%;transform:scale(0);transform-origin:left top}.swiper-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{transform-origin:right top}.swiper-horizontal>.swiper-pagination-progressbar,.swiper-pagination-progressbar.swiper-pagination-horizontal,.swiper-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite{width:100%;height:var(--swiper-pagination-progressbar-size, 4px);left:0;top:0}.swiper-vertical>.swiper-pagination-progressbar,.swiper-pagination-progressbar.swiper-pagination-vertical,.swiper-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite{width:var(--swiper-pagination-progressbar-size, 4px);height:100%;left:0;top:0}.swiper-pagination-lock{display:none}.swiper-scrollbar{border-radius:var(--swiper-scrollbar-border-radius, 10px);position:relative;touch-action:none;background:var(--swiper-scrollbar-bg-color, rgba(0, 0, 0, .1))}.swiper-scrollbar-disabled>.swiper-scrollbar,.swiper-scrollbar.swiper-scrollbar-disabled{display:none!important}.swiper-horizontal>.swiper-scrollbar,.swiper-scrollbar.swiper-scrollbar-horizontal{position:absolute;left:var(--swiper-scrollbar-sides-offset, 1%);bottom:var(--swiper-scrollbar-bottom, 4px);top:var(--swiper-scrollbar-top, auto);z-index:50;height:var(--swiper-scrollbar-size, 4px);width:calc(100% - 2 * var(--swiper-scrollbar-sides-offset, 1%))}.swiper-vertical>.swiper-scrollbar,.swiper-scrollbar.swiper-scrollbar-vertical{position:absolute;left:var(--swiper-scrollbar-left, auto);right:var(--swiper-scrollbar-right, 4px);top:var(--swiper-scrollbar-sides-offset, 1%);z-index:50;width:var(--swiper-scrollbar-size, 4px);height:calc(100% - 2 * var(--swiper-scrollbar-sides-offset, 1%))}.swiper-scrollbar-drag{height:100%;width:100%;position:relative;background:var(--swiper-scrollbar-drag-bg-color, rgba(0, 0, 0, .5));border-radius:var(--swiper-scrollbar-border-radius, 10px);left:0;top:0}.swiper-scrollbar-cursor-drag{cursor:move}.swiper-scrollbar-lock{display:none}.swiper-zoom-container{width:100%;height:100%;display:flex;justify-content:center;align-items:center;text-align:center}.swiper-zoom-container>img,.swiper-zoom-container>svg,.swiper-zoom-container>canvas{max-width:100%;max-height:100%;object-fit:contain}.swiper-slide-zoomed{cursor:move;touch-action:none}.swiper .swiper-notification{position:absolute;left:0;top:0;pointer-events:none;opacity:0;z-index:-1000}.swiper-free-mode>.swiper-wrapper{transition-timing-function:ease-out;margin:0 auto}.swiper-grid>.swiper-wrapper{flex-wrap:wrap}.swiper-grid-column>.swiper-wrapper{flex-wrap:wrap;flex-direction:column}.swiper-fade.swiper-free-mode .swiper-slide{transition-timing-function:ease-out}.swiper-fade .swiper-slide{pointer-events:none;transition-property:opacity}.swiper-fade .swiper-slide .swiper-slide{pointer-events:none}.swiper-fade .swiper-slide-active,.swiper-fade .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper.swiper-cube{overflow:visible}.swiper-cube .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1;visibility:hidden;transform-origin:0 0;width:100%;height:100%}.swiper-cube .swiper-slide .swiper-slide{pointer-events:none}.swiper-cube.swiper-rtl .swiper-slide{transform-origin:100% 0}.swiper-cube .swiper-slide-active,.swiper-cube .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-cube .swiper-slide-active,.swiper-cube .swiper-slide-next,.swiper-cube .swiper-slide-prev{pointer-events:auto;visibility:visible}.swiper-cube .swiper-cube-shadow{position:absolute;left:0;bottom:0;width:100%;height:100%;opacity:.6;z-index:0}.swiper-cube .swiper-cube-shadow:before{content:\"\";background:#000;position:absolute;left:0;top:0;bottom:0;right:0;filter:blur(50px)}.swiper-cube .swiper-slide-next+.swiper-slide{pointer-events:auto;visibility:visible}.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-top,.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-bottom,.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-left,.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-right{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper.swiper-flip{overflow:visible}.swiper-flip .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1}.swiper-flip .swiper-slide .swiper-slide{pointer-events:none}.swiper-flip .swiper-slide-active,.swiper-flip .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-top,.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-bottom,.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-left,.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-right{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-creative .swiper-slide{-webkit-backface-visibility:hidden;backface-visibility:hidden;overflow:hidden;transition-property:transform,opacity,height}.swiper.swiper-cards{overflow:visible}.swiper-cards .swiper-slide{transform-origin:center bottom;-webkit-backface-visibility:hidden;backface-visibility:hidden;overflow:hidden}ax-file-viewer-container{--ax-fv-surface: rgb(var(--ax-sys-color-lightest-surface));--ax-fv-surface-2: rgb(var(--ax-sys-color-light-surface));--ax-fv-border: rgb(var(--ax-sys-color-border-lightest-surface));--ax-fv-border-strong: rgb(var(--ax-sys-color-border-lighter-surface));--ax-fv-text: rgb(var(--ax-sys-color-on-lightest-surface));--ax-fv-muted: rgba(var(--ax-sys-color-on-surface), .65);--ax-fv-shadow: 0 10px 30px rgba(var(--ax-sys-color-on-surface), .08);--ax-fv-nav-bg: rgb(var(--ax-sys-color-lightest-surface));--ax-fv-nav-shadow: 0 6px 18px rgba(var(--ax-sys-color-on-surface), .12);--ax-fv-counter-bg: rgb(var(--ax-sys-color-dark));--ax-fv-counter-text: rgb(var(--ax-sys-color-light));--ax-fv-thumb-bg: rgb(var(--ax-sys-color-lightest-surface));--ax-fv-thumb-preview: rgb(var(--ax-sys-color-lighter-surface));--ax-fv-image: rgb(var(--ax-sys-color-success-500));--ax-fv-video: rgb(var(--ax-sys-color-primary-500));--ax-fv-audio: rgb(var(--ax-sys-color-danger-500));--ax-fv-document: rgb(var(--ax-sys-color-warning-500));--ax-fv-file: rgb(var(--ax-sys-color-secondary-500));--ax-fv-on-accent: rgb(var(--ax-sys-color-light));--ax-fv-stage-pad: .75rem;--ax-fv-nav-size: 2.5rem;display:flex;flex-direction:column;position:relative;width:100%;max-width:100%;height:100%;min-width:0;min-height:0;overflow:hidden;box-sizing:border-box;border-radius:1.25rem;background:var(--ax-fv-surface);border:1px solid var(--ax-fv-border);box-shadow:var(--ax-fv-shadow);color:var(--ax-fv-text)}ax-file-viewer-container>.ax-file-viewer__header,ax-file-viewer-container>.ax-file-viewer__stage,ax-file-viewer-container>.ax-file-viewer__thumbs{background:--ax-fv-surface;width:100%;max-width:100%;min-width:0;box-sizing:border-box}ax-file-viewer-container.ax-file-viewer--fullscreen{border-radius:0;background:var(--ax-fv-surface)}ax-file-viewer-container .ax-file-viewer__loading{position:absolute;top:0;right:0;bottom:0;left:0;z-index:10;display:flex;align-items:center;justify-content:center;background:rgba(var(--ax-sys-color-lightest-surface),.72);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}ax-file-viewer-container .ax-file-viewer__stage--hidden,ax-file-viewer-container .ax-file-viewer__thumbs--hidden{visibility:hidden;pointer-events:none}ax-file-viewer-container .ax-file-viewer__header{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:.75rem 1rem;padding:.75rem 1rem;background:var(--ax-fv-surface);border-bottom:1px solid var(--ax-fv-border);flex-shrink:0;width:100%;max-width:100%;min-width:0;box-sizing:border-box}ax-file-viewer-container .ax-file-viewer__meta{min-width:0}ax-file-viewer-container .ax-file-viewer__title-row{display:flex;align-items:center;gap:.5rem;min-width:0}ax-file-viewer-container .ax-file-viewer__name{font-size:.95rem;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}ax-file-viewer-container .ax-file-viewer__type-badge{flex-shrink:0}ax-file-viewer-container .ax-file-viewer__submeta{display:flex;align-items:center;flex-wrap:wrap;gap:.35rem;margin-top:.2rem;font-size:.75rem;color:var(--ax-fv-muted)}ax-file-viewer-container .ax-file-viewer__dot{opacity:.5}ax-file-viewer-container .ax-file-viewer__header-actions{display:flex;align-items:center;gap:.4rem;flex-shrink:0}ax-file-viewer-container .ax-file-viewer__action-btn{width:2.25rem!important;height:2.25rem!important;min-width:2.25rem!important;border-radius:.65rem!important;background:var(--ax-fv-surface)!important;border:1px solid var(--ax-fv-border-strong)!important;color:var(--ax-fv-text)!important;box-shadow:none!important}ax-file-viewer-container .ax-file-viewer__action-btn:hover{background:var(--ax-fv-surface-2)!important}ax-file-viewer-container .ax-file-viewer__fullscreen-wrap{display:inline-flex;align-items:center;justify-content:center}ax-file-viewer-container .ax-file-viewer__fullscreen-wrap ax-fullscreen-button{display:flex;width:100%;height:100%;align-items:center;justify-content:center}ax-file-viewer-container .ax-file-viewer__fullscreen-wrap ax-fullscreen-button button{width:100%;height:100%;border:none;background:transparent;color:var(--ax-fv-text);cursor:pointer;display:flex;align-items:center;justify-content:center}ax-file-viewer-container .ax-file-viewer__stage{flex:1 1 auto;width:100%;max-width:100%;min-width:0;min-height:0;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr);grid-template-areas:\"canvas\";align-items:stretch;gap:.5rem;padding:var(--ax-fv-stage-pad);box-sizing:border-box}ax-file-viewer-container .ax-file-viewer__stage--nav{grid-template-columns:var(--ax-fv-nav-size) minmax(0,1fr) var(--ax-fv-nav-size);grid-template-areas:\"prev canvas next\";align-items:stretch}ax-file-viewer-container .ax-file-viewer__nav{z-index:2;width:var(--ax-fv-nav-size)!important;height:var(--ax-fv-nav-size)!important;min-width:var(--ax-fv-nav-size)!important;border-radius:999px!important;background:var(--ax-fv-nav-bg)!important;border:1px solid var(--ax-fv-border)!important;color:var(--ax-fv-text)!important;box-shadow:var(--ax-fv-nav-shadow)!important;justify-self:center;align-self:center}ax-file-viewer-container .ax-file-viewer__nav.ax-disabled,ax-file-viewer-container .ax-file-viewer__nav[disabled]{opacity:.35!important;cursor:not-allowed!important;box-shadow:none!important}ax-file-viewer-container .ax-file-viewer__nav--prev{grid-area:prev}ax-file-viewer-container .ax-file-viewer__nav--next{grid-area:next}ax-file-viewer-container .ax-file-viewer__canvas{grid-area:canvas;position:relative;width:100%;max-width:100%;height:100%;min-width:0;min-height:12rem;align-self:stretch;border-radius:1rem;overflow:hidden;box-sizing:border-box}ax-file-viewer-container .ax-file-viewer__canvas .ax-carousel,ax-file-viewer-container .ax-file-viewer__canvas .swiper{width:100%;height:100%;min-width:0;min-height:0;overflow:hidden;box-sizing:border-box}ax-file-viewer-container .ax-file-viewer__canvas .ax-carousel-wrapper,ax-file-viewer-container .ax-file-viewer__canvas .swiper-wrapper{height:100%;align-items:stretch;box-sizing:border-box}ax-file-viewer-container .ax-file-viewer__canvas .ax-carousel-slide,ax-file-viewer-container .ax-file-viewer__canvas .swiper-slide{display:flex!important;align-items:stretch;justify-content:stretch;height:100%;min-width:0;min-height:0;box-sizing:border-box;overflow:hidden}ax-file-viewer-container .ax-file-viewer__canvas img,ax-file-viewer-container .ax-file-viewer__canvas video,ax-file-viewer-container .ax-file-viewer__canvas audio,ax-file-viewer-container .ax-file-viewer__canvas iframe,ax-file-viewer-container .ax-file-viewer__canvas ax-pdf-reader{max-width:100%;max-height:100%}ax-file-viewer-container .ax-file-viewer__overlay-counter{position:absolute;left:50%;bottom:1.25rem;transform:translate(-50%);z-index:3;display:inline-flex;align-items:center;justify-content:center;min-width:3.25rem;padding:.3rem .7rem;border-radius:999px;background:var(--ax-fv-counter-bg);color:var(--ax-fv-counter-text);font-size:.72rem;font-weight:600;letter-spacing:.03em;pointer-events:none;opacity:.8}ax-file-viewer-container .ax-file-viewer__thumbs{width:100%;max-width:100%;min-width:0;padding:.75rem 1rem 1rem;background:var(--ax-fv-surface);border-top:1px solid var(--ax-fv-border);flex:0 0 auto;box-sizing:border-box;overflow:hidden}ax-file-viewer-container .ax-file-viewer__thumbs-track{width:100%;max-width:100%;min-width:0;overflow:hidden;box-sizing:border-box}ax-file-viewer-container .ax-file-viewer__thumbs-track .ax-carousel,ax-file-viewer-container .ax-file-viewer__thumbs-track .swiper{width:100%;max-width:100%;min-width:0;overflow:hidden;box-sizing:border-box}ax-file-viewer-container .ax-file-viewer__thumbs-track .ax-carousel-wrapper,ax-file-viewer-container .ax-file-viewer__thumbs-track .swiper-wrapper{align-items:stretch}ax-file-viewer-container .ax-file-viewer__thumbs-track .ax-carousel-slide,ax-file-viewer-container .ax-file-viewer__thumbs-track .swiper-slide{width:7.5rem;max-width:7.5rem;height:auto;box-sizing:border-box;overflow:hidden}ax-file-viewer-container .ax-file-viewer__thumb{cursor:pointer;width:7.5rem;max-width:7.5rem;display:flex;flex-direction:column;border-radius:.9rem;border:2px solid var(--ax-fv-border);background:var(--ax-fv-thumb-bg);overflow:hidden;box-sizing:border-box;transition:border-color .15s ease}ax-file-viewer-container .ax-file-viewer__thumb:hover{border-color:var(--ax-fv-border-strong)}ax-file-viewer-container .ax-file-viewer__thumb.swiper-slide-thumb-active,ax-file-viewer-container .ax-file-viewer__thumb.ax-file-viewer__thumb--active{border-color:var(--ax-fv-image)}ax-file-viewer-container .ax-file-viewer__thumb.swiper-slide-thumb-active .ax-file-viewer__thumb-index,ax-file-viewer-container .ax-file-viewer__thumb.ax-file-viewer__thumb--active .ax-file-viewer__thumb-index{background:var(--ax-fv-image);color:var(--ax-fv-on-accent)}ax-file-viewer-container .ax-file-viewer__thumb[data-type=video].ax-file-viewer__thumb--active,ax-file-viewer-container .ax-file-viewer__thumb[data-type=video].swiper-slide-thumb-active{border-color:var(--ax-fv-video)}ax-file-viewer-container .ax-file-viewer__thumb[data-type=video].ax-file-viewer__thumb--active .ax-file-viewer__thumb-index,ax-file-viewer-container .ax-file-viewer__thumb[data-type=video].swiper-slide-thumb-active .ax-file-viewer__thumb-index{background:var(--ax-fv-video)}ax-file-viewer-container .ax-file-viewer__thumb[data-type=audio].ax-file-viewer__thumb--active,ax-file-viewer-container .ax-file-viewer__thumb[data-type=audio].swiper-slide-thumb-active{border-color:var(--ax-fv-audio)}ax-file-viewer-container .ax-file-viewer__thumb[data-type=audio].ax-file-viewer__thumb--active .ax-file-viewer__thumb-index,ax-file-viewer-container .ax-file-viewer__thumb[data-type=audio].swiper-slide-thumb-active .ax-file-viewer__thumb-index{background:var(--ax-fv-audio)}ax-file-viewer-container .ax-file-viewer__thumb[data-type=document].ax-file-viewer__thumb--active,ax-file-viewer-container .ax-file-viewer__thumb[data-type=document].swiper-slide-thumb-active{border-color:var(--ax-fv-document)}ax-file-viewer-container .ax-file-viewer__thumb[data-type=document].ax-file-viewer__thumb--active .ax-file-viewer__thumb-index,ax-file-viewer-container .ax-file-viewer__thumb[data-type=document].swiper-slide-thumb-active .ax-file-viewer__thumb-index{background:var(--ax-fv-document)}ax-file-viewer-container .ax-file-viewer__thumb[data-type=file].ax-file-viewer__thumb--active,ax-file-viewer-container .ax-file-viewer__thumb[data-type=file].swiper-slide-thumb-active{border-color:var(--ax-fv-file)}ax-file-viewer-container .ax-file-viewer__thumb[data-type=file].ax-file-viewer__thumb--active .ax-file-viewer__thumb-index,ax-file-viewer-container .ax-file-viewer__thumb[data-type=file].swiper-slide-thumb-active .ax-file-viewer__thumb-index{background:var(--ax-fv-file)}ax-file-viewer-container .ax-file-viewer__thumb-preview{width:100%;max-width:100%;min-width:0;aspect-ratio:1.4;display:flex;align-items:center;justify-content:center;background:var(--ax-fv-thumb-preview);box-sizing:border-box;overflow:hidden}ax-file-viewer-container .ax-file-viewer__thumb-preview i{font-size:1.45rem;color:var(--ax-fv-muted)}ax-file-viewer-container .ax-file-viewer__thumb-preview img{width:100%;height:100%;object-fit:cover;display:block}ax-file-viewer-container .ax-file-viewer__thumb[data-type=image] .ax-file-viewer__thumb-preview i{color:var(--ax-fv-image)}ax-file-viewer-container .ax-file-viewer__thumb[data-type=video] .ax-file-viewer__thumb-preview i{color:var(--ax-fv-video)}ax-file-viewer-container .ax-file-viewer__thumb[data-type=audio] .ax-file-viewer__thumb-preview i{color:var(--ax-fv-audio)}ax-file-viewer-container .ax-file-viewer__thumb[data-type=document] .ax-file-viewer__thumb-preview i{color:var(--ax-fv-document)}ax-file-viewer-container .ax-file-viewer__thumb[data-type=file] .ax-file-viewer__thumb-preview i{color:var(--ax-fv-file)}ax-file-viewer-container .ax-file-viewer__thumb-footer{width:100%;max-width:100%;min-width:0;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:.3rem;align-items:center;padding:.4rem .45rem;border-top:1px solid var(--ax-fv-border);font-size:.65rem;color:var(--ax-fv-muted);box-sizing:border-box}ax-file-viewer-container .ax-file-viewer__thumb-index{display:inline-flex;align-items:center;justify-content:center;min-width:1.15rem;height:1.15rem;padding-inline:.2rem;border-radius:.3rem;background:var(--ax-fv-surface-2);color:var(--ax-fv-muted);font-weight:700}ax-file-viewer-container .ax-file-viewer__thumb-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--ax-fv-text);font-weight:500}ax-file-viewer-container .ax-file-viewer__thumb-size{white-space:nowrap}ax-file-viewer-container .ax-carousel-pagination{display:none}@media (max-width: 768px){ax-file-viewer-container{--ax-fv-stage-pad: .5rem;--ax-fv-nav-size: 2.25rem;border-radius:1rem}ax-file-viewer-container .ax-file-viewer__header{gap:.5rem .75rem;padding:.65rem .75rem;min-width:0}ax-file-viewer-container .ax-file-viewer__name{font-size:.85rem}ax-file-viewer-container .ax-file-viewer__action-btn{width:2rem!important;height:2rem!important;min-width:2rem!important}ax-file-viewer-container .ax-file-viewer__stage--nav{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:minmax(14rem,1fr) auto;grid-template-areas:\"canvas canvas\" \"prev next\";gap:.5rem;align-items:stretch}ax-file-viewer-container .ax-file-viewer__nav--prev{justify-self:end}ax-file-viewer-container .ax-file-viewer__nav--next{justify-self:start}ax-file-viewer-container .ax-file-viewer__canvas{min-height:14rem}ax-file-viewer-container .ax-file-viewer__thumbs{padding:.6rem .75rem .85rem}ax-file-viewer-container .ax-file-viewer__thumbs-track .ax-carousel-slide,ax-file-viewer-container .ax-file-viewer__thumbs-track .swiper-slide{width:5.75rem;max-width:5.75rem}ax-file-viewer-container .ax-file-viewer__thumb{width:5.75rem;max-width:5.75rem}ax-file-viewer-container .ax-file-viewer__thumb-footer{grid-template-columns:auto minmax(0,1fr)}ax-file-viewer-container .ax-file-viewer__thumb-size{display:none}}@media (max-width: 480px){ax-file-viewer-container{--ax-fv-nav-size: 2rem;border-radius:.75rem}ax-file-viewer-container .ax-file-viewer__type-badge{display:none}ax-file-viewer-container .ax-file-viewer__thumbs{padding:.5rem}ax-file-viewer-container .ax-file-viewer__thumbs-track .ax-carousel-slide,ax-file-viewer-container .ax-file-viewer__thumbs-track .swiper-slide{width:5.25rem;max-width:5.25rem}ax-file-viewer-container .ax-file-viewer__thumb{width:5.25rem;max-width:5.25rem}}ax-file-viewer-slide{display:flex;width:100%;height:100%;min-width:0;min-height:0;align-items:stretch;justify-content:stretch;padding:0;box-sizing:border-box;-webkit-user-select:none;user-select:none}ax-file-viewer-image,ax-file-viewer-video,ax-file-viewer-audio,ax-file-viewer-pdf,ax-file-viewer-fallback{display:flex!important;width:100%!important;height:100%!important;min-width:0;min-height:0;box-sizing:border-box}\n"], dependencies: [{ kind: "directive", type: AXCarouselDirective, selector: "[axCarousel]", exportAs: ["axCarousel"] }, { kind: "component", type: AXFileViewerSlideComponent, selector: "ax-file-viewer-slide", inputs: ["item", "index"] }, { kind: "component", type: AXFileViewerThumbPreviewComponent, selector: "ax-file-viewer-thumb-preview", inputs: ["item"] }, { kind: "component", type: AXBadgeComponent, selector: "ax-badge", inputs: ["color", "look", "text"] }, { kind: "component", type: AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "iconOnly", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "component", type: AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: AXDecoratorFullScreenButtonComponent, selector: "ax-fullscreen-button", inputs: ["element", "isActive"], outputs: ["elementChange", "isActiveChange"] }, { kind: "component", type: AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }, { kind: "directive", type: AXTooltipDirective, selector: "[axTooltip]", inputs: ["axTooltipDisabled", "axTooltip", "axTooltipContext", "axTooltipPlacement", "axTooltipOffsetX", "axTooltipOffsetY", "axTooltipOpenAfter", "axTooltipCloseAfter"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
456
+ }
457
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXFileViewerContainerComponent, decorators: [{
458
+ type: Component,
459
+ args: [{ selector: 'ax-file-viewer-container', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [AXFileViewerService], imports: [
460
+ AXCarouselDirective,
461
+ AXFileViewerSlideComponent,
462
+ AXFileViewerThumbPreviewComponent,
463
+ AXBadgeComponent,
464
+ AXButtonComponent,
465
+ AXDecoratorIconComponent,
466
+ AXDecoratorFullScreenButtonComponent,
467
+ AXLoadingComponent,
468
+ AXTooltipDirective,
469
+ ], template: "@if (isBusy()) {\n <div class=\"ax-file-viewer__loading\" aria-busy=\"true\" aria-live=\"polite\">\n <ax-loading></ax-loading>\n </div>\n}\n\n@if (currentItem(); as item) {\n <header class=\"ax-file-viewer__header\">\n <div class=\"ax-file-viewer__meta\">\n <div class=\"ax-file-viewer__title-row\">\n <span class=\"ax-file-viewer__name\">{{ item.name || 'Untitled' }}</span>\n <ax-badge\n class=\"ax-file-viewer__type-badge ax-pill ax-sm\"\n look=\"outline\"\n [color]=\"currentTypeColor()\"\n [text]=\"currentTypeLabel()\"\n />\n </div>\n <div class=\"ax-file-viewer__submeta\">\n @if (formatSize(item.size); as sizeLabel) {\n <span>{{ sizeLabel }}</span>\n }\n @if (item.extension) {\n <span class=\"ax-file-viewer__dot\">\u00B7</span>\n <span>.{{ item.extension }}</span>\n } @else if (item.mimeType) {\n <span class=\"ax-file-viewer__dot\">\u00B7</span>\n <span>{{ item.mimeType }}</span>\n }\n </div>\n </div>\n\n @if (download() || fullscreen()) {\n <div class=\"ax-file-viewer__header-actions\">\n @if (download()) {\n <ax-button\n class=\"ax-file-viewer__action-btn\"\n look=\"outline\"\n color=\"default\"\n [iconOnly]=\"true\"\n [axTooltip]=\"'Download'\"\n (onClick)=\"downloadCurrent()\"\n >\n <ax-icon icon=\"fa-light fa-download\"></ax-icon>\n </ax-button>\n }\n\n @if (fullscreen()) {\n <div class=\"ax-file-viewer__action-btn ax-file-viewer__fullscreen-wrap\">\n <ax-fullscreen-button></ax-fullscreen-button>\n </div>\n }\n </div>\n }\n </header>\n}\n\n<div\n class=\"ax-file-viewer__stage\"\n [class.ax-file-viewer__stage--nav]=\"service.items().length > 1\"\n [class.ax-file-viewer__stage--hidden]=\"isBusy()\"\n>\n @if (service.items().length > 1) {\n <ax-button\n class=\"ax-file-viewer__nav ax-file-viewer__nav--prev\"\n look=\"solid\"\n color=\"default\"\n [iconOnly]=\"true\"\n [disabled]=\"isFirstSlide()\"\n (onClick)=\"prev()\"\n >\n <ax-icon icon=\"fa-light fa-chevron-left\"></ax-icon>\n </ax-button>\n }\n\n <div class=\"ax-file-viewer__canvas\">\n <div #mainCarousel=\"axCarousel\" axCarousel class=\"ax-carousel\">\n <div class=\"ax-carousel-wrapper\">\n @for (file of service.items(); track file.id) {\n <div class=\"ax-carousel-slide\">\n <ax-file-viewer-slide [item]=\"file\" [index]=\"$index\" />\n </div>\n }\n </div>\n </div>\n\n @if (service.items().length > 0) {\n <span class=\"ax-file-viewer__overlay-counter\">{{ slideCounter() }}</span>\n }\n </div>\n\n @if (service.items().length > 1) {\n <ax-button\n class=\"ax-file-viewer__nav ax-file-viewer__nav--next\"\n look=\"solid\"\n color=\"default\"\n [iconOnly]=\"true\"\n [disabled]=\"isLastSlide()\"\n (onClick)=\"next()\"\n >\n <ax-icon icon=\"fa-light fa-chevron-right\"></ax-icon>\n </ax-button>\n }\n</div>\n\n@if (thumbnail() && service.items().length > 1) {\n <footer class=\"ax-file-viewer__thumbs\" [class.ax-file-viewer__thumbs--hidden]=\"isBusy()\">\n <div class=\"ax-file-viewer__thumbs-track\">\n <div #thumbCarousel=\"axCarousel\" axCarousel class=\"ax-carousel\">\n <div class=\"ax-carousel-wrapper\">\n @for (file of service.items(); track file.id) {\n <div\n class=\"ax-carousel-slide ax-file-viewer__thumb\"\n [attr.data-type]=\"resolveFileType(file)\"\n [class.ax-file-viewer__thumb--active]=\"service.selectedIndex() === $index\"\n (click)=\"goToIndex($index)\"\n >\n <ax-file-viewer-thumb-preview [item]=\"file\" />\n <div class=\"ax-file-viewer__thumb-footer\">\n <span class=\"ax-file-viewer__thumb-index\">{{ $index + 1 }}</span>\n <span class=\"ax-file-viewer__thumb-name\">{{ file.name || resolveTypeLabel(file) }}</span>\n @if (formatSize(file.size); as sizeLabel) {\n <span class=\"ax-file-viewer__thumb-size\">{{ sizeLabel }}</span>\n }\n </div>\n </div>\n }\n </div>\n </div>\n </div>\n </footer>\n}\n", styles: ["@font-face{font-family:swiper-icons;src:url(data:application/font-woff;charset=utf-8;base64,\\ d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA);font-weight:400;font-style:normal}:root{--swiper-theme-color: #007aff}:host{position:relative;display:block;margin-left:auto;margin-right:auto;z-index:1}.swiper{margin-left:auto;margin-right:auto;position:relative;overflow:hidden;list-style:none;padding:0;z-index:1;display:block}.swiper-vertical>.swiper-wrapper{flex-direction:column}.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:flex;transition-property:transform;transition-timing-function:var(--swiper-wrapper-transition-timing-function, initial);box-sizing:content-box}.swiper-android .swiper-slide,.swiper-ios .swiper-slide,.swiper-wrapper{transform:translateZ(0)}.swiper-horizontal{touch-action:pan-y}.swiper-vertical{touch-action:pan-x}.swiper-slide{flex-shrink:0;width:100%;height:100%;position:relative;transition-property:transform;display:block}.swiper-slide-invisible-blank{visibility:hidden}.swiper-autoheight,.swiper-autoheight .swiper-slide{height:auto}.swiper-autoheight .swiper-wrapper{align-items:flex-start;transition-property:transform,height}.swiper-backface-hidden .swiper-slide{transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-3d.swiper-css-mode .swiper-wrapper{perspective:1200px}.swiper-3d .swiper-wrapper{transform-style:preserve-3d}.swiper-3d{perspective:1200px}.swiper-3d .swiper-slide,.swiper-3d .swiper-cube-shadow{transform-style:preserve-3d}.swiper-css-mode>.swiper-wrapper{overflow:auto;scrollbar-width:none;-ms-overflow-style:none}.swiper-css-mode>.swiper-wrapper::-webkit-scrollbar{display:none}.swiper-css-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:start start}.swiper-css-mode.swiper-horizontal>.swiper-wrapper{scroll-snap-type:x mandatory}.swiper-css-mode.swiper-vertical>.swiper-wrapper{scroll-snap-type:y mandatory}.swiper-css-mode.swiper-free-mode>.swiper-wrapper{scroll-snap-type:none}.swiper-css-mode.swiper-free-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:none}.swiper-css-mode.swiper-centered>.swiper-wrapper:before{content:\"\";flex-shrink:0;order:9999}.swiper-css-mode.swiper-centered>.swiper-wrapper>.swiper-slide{scroll-snap-align:center center;scroll-snap-stop:always}.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper>.swiper-slide:first-child{margin-inline-start:var(--swiper-centered-offset-before)}.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper:before{height:100%;min-height:1px;width:var(--swiper-centered-offset-after)}.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper>.swiper-slide:first-child{margin-block-start:var(--swiper-centered-offset-before)}.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper:before{width:100%;min-width:1px;height:var(--swiper-centered-offset-after)}.swiper-3d .swiper-slide-shadow,.swiper-3d .swiper-slide-shadow-left,.swiper-3d .swiper-slide-shadow-right,.swiper-3d .swiper-slide-shadow-top,.swiper-3d .swiper-slide-shadow-bottom{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10}.swiper-3d .swiper-slide-shadow{background:#00000026}.swiper-3d .swiper-slide-shadow-left{background-image:linear-gradient(to left,#00000080,#0000)}.swiper-3d .swiper-slide-shadow-right{background-image:linear-gradient(to right,#00000080,#0000)}.swiper-3d .swiper-slide-shadow-top{background-image:linear-gradient(to top,#00000080,#0000)}.swiper-3d .swiper-slide-shadow-bottom{background-image:linear-gradient(to bottom,#00000080,#0000)}.swiper-lazy-preloader{width:42px;height:42px;position:absolute;left:50%;top:50%;margin-left:-21px;margin-top:-21px;z-index:10;transform-origin:50%;box-sizing:border-box;border:4px solid var(--swiper-preloader-color, var(--swiper-theme-color));border-radius:50%;border-top-color:transparent}.swiper:not(.swiper-watch-progress) .swiper-lazy-preloader,.swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader{animation:swiper-preloader-spin 1s infinite linear}.swiper-lazy-preloader-white{--swiper-preloader-color: #fff}.swiper-lazy-preloader-black{--swiper-preloader-color: #000}@keyframes swiper-preloader-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.swiper-virtual .swiper-slide{-webkit-backface-visibility:hidden;transform:translateZ(0)}.swiper-virtual.swiper-css-mode .swiper-wrapper:after{content:\"\";position:absolute;left:0;top:0;pointer-events:none}.swiper-virtual.swiper-css-mode.swiper-horizontal .swiper-wrapper:after{height:1px;width:var(--swiper-virtual-size)}.swiper-virtual.swiper-css-mode.swiper-vertical .swiper-wrapper:after{width:1px;height:var(--swiper-virtual-size)}:root{--swiper-navigation-size: 44px}.swiper-button-prev,.swiper-button-next{position:absolute;top:var(--swiper-navigation-top-offset, 50%);width:calc(var(--swiper-navigation-size) / 44 * 27);height:var(--swiper-navigation-size);margin-top:calc(0px - var(--swiper-navigation-size) / 2);z-index:10;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--swiper-navigation-color, var(--swiper-theme-color))}.swiper-button-prev.swiper-button-disabled,.swiper-button-next.swiper-button-disabled{opacity:.35;cursor:auto;pointer-events:none}.swiper-button-prev.swiper-button-hidden,.swiper-button-next.swiper-button-hidden{opacity:0;cursor:auto;pointer-events:none}.swiper-navigation-disabled .swiper-button-prev,.swiper-navigation-disabled .swiper-button-next{display:none!important}.swiper-button-prev svg,.swiper-button-next svg{width:100%;height:100%;object-fit:contain;transform-origin:center}.swiper-rtl .swiper-button-prev svg,.swiper-rtl .swiper-button-next svg{transform:rotate(180deg)}.swiper-button-prev,.swiper-rtl .swiper-button-next{left:var(--swiper-navigation-sides-offset, 10px);right:auto}.swiper-button-lock{display:none}.swiper-button-prev:after,.swiper-button-next:after{font-family:swiper-icons;font-size:var(--swiper-navigation-size);text-transform:none!important;letter-spacing:0;font-variant:initial;line-height:1}.swiper-button-prev:after,.swiper-rtl .swiper-button-next:after{content:\"prev\"}.swiper-button-next,.swiper-rtl .swiper-button-prev{right:var(--swiper-navigation-sides-offset, 10px);left:auto}.swiper-button-next:after,.swiper-rtl .swiper-button-prev:after{content:\"next\"}.swiper-pagination{position:absolute;text-align:center;transition:.3s opacity;transform:translateZ(0);z-index:10}.swiper-pagination.swiper-pagination-hidden{opacity:0}.swiper-pagination-disabled>.swiper-pagination,.swiper-pagination.swiper-pagination-disabled{display:none!important}.swiper-pagination-fraction,.swiper-pagination-custom,.swiper-horizontal>.swiper-pagination-bullets,.swiper-pagination-bullets.swiper-pagination-horizontal{bottom:var(--swiper-pagination-bottom, 8px);top:var(--swiper-pagination-top, auto);left:0;width:100%}.swiper-pagination-bullets-dynamic{overflow:hidden;font-size:0}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transform:scale(.33);position:relative}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active,.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main{transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev{transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev{transform:scale(.33)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next{transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next{transform:scale(.33)}.swiper-pagination-bullet{width:var(--swiper-pagination-bullet-width, var(--swiper-pagination-bullet-size, 8px));height:var(--swiper-pagination-bullet-height, var(--swiper-pagination-bullet-size, 8px));display:inline-block;border-radius:var(--swiper-pagination-bullet-border-radius, 50%);background:var(--swiper-pagination-bullet-inactive-color, #000);opacity:var(--swiper-pagination-bullet-inactive-opacity, .2)}button.swiper-pagination-bullet{border:none;margin:0;padding:0;box-shadow:none;-webkit-appearance:none;appearance:none}.swiper-pagination-clickable .swiper-pagination-bullet{cursor:pointer}.swiper-pagination-bullet:only-child{display:none!important}.swiper-pagination-bullet-active{opacity:var(--swiper-pagination-bullet-opacity, 1);background:var(--swiper-pagination-color, var(--swiper-theme-color))}.swiper-vertical>.swiper-pagination-bullets,.swiper-pagination-vertical.swiper-pagination-bullets{right:var(--swiper-pagination-right, 8px);left:var(--swiper-pagination-left, auto);top:50%;transform:translate3d(0,-50%,0)}.swiper-vertical>.swiper-pagination-bullets .swiper-pagination-bullet,.swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet{margin:var(--swiper-pagination-bullet-vertical-gap, 6px) 0;display:block}.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{top:50%;transform:translateY(-50%);width:8px}.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{display:inline-block;transition:.2s transform,.2s top}.swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet,.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 var(--swiper-pagination-bullet-horizontal-gap, 4px)}.swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{left:50%;transform:translate(-50%);white-space:nowrap}.swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s left}.swiper-horizontal.swiper-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s right}.swiper-pagination-fraction{color:var(--swiper-pagination-fraction-color, inherit)}.swiper-pagination-progressbar{background:var(--swiper-pagination-progressbar-bg-color, rgba(0, 0, 0, .25));position:absolute}.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:var(--swiper-pagination-color, var(--swiper-theme-color));position:absolute;left:0;top:0;width:100%;height:100%;transform:scale(0);transform-origin:left top}.swiper-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{transform-origin:right top}.swiper-horizontal>.swiper-pagination-progressbar,.swiper-pagination-progressbar.swiper-pagination-horizontal,.swiper-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite{width:100%;height:var(--swiper-pagination-progressbar-size, 4px);left:0;top:0}.swiper-vertical>.swiper-pagination-progressbar,.swiper-pagination-progressbar.swiper-pagination-vertical,.swiper-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite{width:var(--swiper-pagination-progressbar-size, 4px);height:100%;left:0;top:0}.swiper-pagination-lock{display:none}.swiper-scrollbar{border-radius:var(--swiper-scrollbar-border-radius, 10px);position:relative;touch-action:none;background:var(--swiper-scrollbar-bg-color, rgba(0, 0, 0, .1))}.swiper-scrollbar-disabled>.swiper-scrollbar,.swiper-scrollbar.swiper-scrollbar-disabled{display:none!important}.swiper-horizontal>.swiper-scrollbar,.swiper-scrollbar.swiper-scrollbar-horizontal{position:absolute;left:var(--swiper-scrollbar-sides-offset, 1%);bottom:var(--swiper-scrollbar-bottom, 4px);top:var(--swiper-scrollbar-top, auto);z-index:50;height:var(--swiper-scrollbar-size, 4px);width:calc(100% - 2 * var(--swiper-scrollbar-sides-offset, 1%))}.swiper-vertical>.swiper-scrollbar,.swiper-scrollbar.swiper-scrollbar-vertical{position:absolute;left:var(--swiper-scrollbar-left, auto);right:var(--swiper-scrollbar-right, 4px);top:var(--swiper-scrollbar-sides-offset, 1%);z-index:50;width:var(--swiper-scrollbar-size, 4px);height:calc(100% - 2 * var(--swiper-scrollbar-sides-offset, 1%))}.swiper-scrollbar-drag{height:100%;width:100%;position:relative;background:var(--swiper-scrollbar-drag-bg-color, rgba(0, 0, 0, .5));border-radius:var(--swiper-scrollbar-border-radius, 10px);left:0;top:0}.swiper-scrollbar-cursor-drag{cursor:move}.swiper-scrollbar-lock{display:none}.swiper-zoom-container{width:100%;height:100%;display:flex;justify-content:center;align-items:center;text-align:center}.swiper-zoom-container>img,.swiper-zoom-container>svg,.swiper-zoom-container>canvas{max-width:100%;max-height:100%;object-fit:contain}.swiper-slide-zoomed{cursor:move;touch-action:none}.swiper .swiper-notification{position:absolute;left:0;top:0;pointer-events:none;opacity:0;z-index:-1000}.swiper-free-mode>.swiper-wrapper{transition-timing-function:ease-out;margin:0 auto}.swiper-grid>.swiper-wrapper{flex-wrap:wrap}.swiper-grid-column>.swiper-wrapper{flex-wrap:wrap;flex-direction:column}.swiper-fade.swiper-free-mode .swiper-slide{transition-timing-function:ease-out}.swiper-fade .swiper-slide{pointer-events:none;transition-property:opacity}.swiper-fade .swiper-slide .swiper-slide{pointer-events:none}.swiper-fade .swiper-slide-active,.swiper-fade .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper.swiper-cube{overflow:visible}.swiper-cube .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1;visibility:hidden;transform-origin:0 0;width:100%;height:100%}.swiper-cube .swiper-slide .swiper-slide{pointer-events:none}.swiper-cube.swiper-rtl .swiper-slide{transform-origin:100% 0}.swiper-cube .swiper-slide-active,.swiper-cube .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-cube .swiper-slide-active,.swiper-cube .swiper-slide-next,.swiper-cube .swiper-slide-prev{pointer-events:auto;visibility:visible}.swiper-cube .swiper-cube-shadow{position:absolute;left:0;bottom:0;width:100%;height:100%;opacity:.6;z-index:0}.swiper-cube .swiper-cube-shadow:before{content:\"\";background:#000;position:absolute;left:0;top:0;bottom:0;right:0;filter:blur(50px)}.swiper-cube .swiper-slide-next+.swiper-slide{pointer-events:auto;visibility:visible}.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-top,.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-bottom,.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-left,.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-right{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper.swiper-flip{overflow:visible}.swiper-flip .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1}.swiper-flip .swiper-slide .swiper-slide{pointer-events:none}.swiper-flip .swiper-slide-active,.swiper-flip .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-top,.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-bottom,.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-left,.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-right{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-creative .swiper-slide{-webkit-backface-visibility:hidden;backface-visibility:hidden;overflow:hidden;transition-property:transform,opacity,height}.swiper.swiper-cards{overflow:visible}.swiper-cards .swiper-slide{transform-origin:center bottom;-webkit-backface-visibility:hidden;backface-visibility:hidden;overflow:hidden}ax-file-viewer-container{--ax-fv-surface: rgb(var(--ax-sys-color-lightest-surface));--ax-fv-surface-2: rgb(var(--ax-sys-color-light-surface));--ax-fv-border: rgb(var(--ax-sys-color-border-lightest-surface));--ax-fv-border-strong: rgb(var(--ax-sys-color-border-lighter-surface));--ax-fv-text: rgb(var(--ax-sys-color-on-lightest-surface));--ax-fv-muted: rgba(var(--ax-sys-color-on-surface), .65);--ax-fv-shadow: 0 10px 30px rgba(var(--ax-sys-color-on-surface), .08);--ax-fv-nav-bg: rgb(var(--ax-sys-color-lightest-surface));--ax-fv-nav-shadow: 0 6px 18px rgba(var(--ax-sys-color-on-surface), .12);--ax-fv-counter-bg: rgb(var(--ax-sys-color-dark));--ax-fv-counter-text: rgb(var(--ax-sys-color-light));--ax-fv-thumb-bg: rgb(var(--ax-sys-color-lightest-surface));--ax-fv-thumb-preview: rgb(var(--ax-sys-color-lighter-surface));--ax-fv-image: rgb(var(--ax-sys-color-success-500));--ax-fv-video: rgb(var(--ax-sys-color-primary-500));--ax-fv-audio: rgb(var(--ax-sys-color-danger-500));--ax-fv-document: rgb(var(--ax-sys-color-warning-500));--ax-fv-file: rgb(var(--ax-sys-color-secondary-500));--ax-fv-on-accent: rgb(var(--ax-sys-color-light));--ax-fv-stage-pad: .75rem;--ax-fv-nav-size: 2.5rem;display:flex;flex-direction:column;position:relative;width:100%;max-width:100%;height:100%;min-width:0;min-height:0;overflow:hidden;box-sizing:border-box;border-radius:1.25rem;background:var(--ax-fv-surface);border:1px solid var(--ax-fv-border);box-shadow:var(--ax-fv-shadow);color:var(--ax-fv-text)}ax-file-viewer-container>.ax-file-viewer__header,ax-file-viewer-container>.ax-file-viewer__stage,ax-file-viewer-container>.ax-file-viewer__thumbs{background:--ax-fv-surface;width:100%;max-width:100%;min-width:0;box-sizing:border-box}ax-file-viewer-container.ax-file-viewer--fullscreen{border-radius:0;background:var(--ax-fv-surface)}ax-file-viewer-container .ax-file-viewer__loading{position:absolute;top:0;right:0;bottom:0;left:0;z-index:10;display:flex;align-items:center;justify-content:center;background:rgba(var(--ax-sys-color-lightest-surface),.72);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}ax-file-viewer-container .ax-file-viewer__stage--hidden,ax-file-viewer-container .ax-file-viewer__thumbs--hidden{visibility:hidden;pointer-events:none}ax-file-viewer-container .ax-file-viewer__header{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:.75rem 1rem;padding:.75rem 1rem;background:var(--ax-fv-surface);border-bottom:1px solid var(--ax-fv-border);flex-shrink:0;width:100%;max-width:100%;min-width:0;box-sizing:border-box}ax-file-viewer-container .ax-file-viewer__meta{min-width:0}ax-file-viewer-container .ax-file-viewer__title-row{display:flex;align-items:center;gap:.5rem;min-width:0}ax-file-viewer-container .ax-file-viewer__name{font-size:.95rem;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}ax-file-viewer-container .ax-file-viewer__type-badge{flex-shrink:0}ax-file-viewer-container .ax-file-viewer__submeta{display:flex;align-items:center;flex-wrap:wrap;gap:.35rem;margin-top:.2rem;font-size:.75rem;color:var(--ax-fv-muted)}ax-file-viewer-container .ax-file-viewer__dot{opacity:.5}ax-file-viewer-container .ax-file-viewer__header-actions{display:flex;align-items:center;gap:.4rem;flex-shrink:0}ax-file-viewer-container .ax-file-viewer__action-btn{width:2.25rem!important;height:2.25rem!important;min-width:2.25rem!important;border-radius:.65rem!important;background:var(--ax-fv-surface)!important;border:1px solid var(--ax-fv-border-strong)!important;color:var(--ax-fv-text)!important;box-shadow:none!important}ax-file-viewer-container .ax-file-viewer__action-btn:hover{background:var(--ax-fv-surface-2)!important}ax-file-viewer-container .ax-file-viewer__fullscreen-wrap{display:inline-flex;align-items:center;justify-content:center}ax-file-viewer-container .ax-file-viewer__fullscreen-wrap ax-fullscreen-button{display:flex;width:100%;height:100%;align-items:center;justify-content:center}ax-file-viewer-container .ax-file-viewer__fullscreen-wrap ax-fullscreen-button button{width:100%;height:100%;border:none;background:transparent;color:var(--ax-fv-text);cursor:pointer;display:flex;align-items:center;justify-content:center}ax-file-viewer-container .ax-file-viewer__stage{flex:1 1 auto;width:100%;max-width:100%;min-width:0;min-height:0;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr);grid-template-areas:\"canvas\";align-items:stretch;gap:.5rem;padding:var(--ax-fv-stage-pad);box-sizing:border-box}ax-file-viewer-container .ax-file-viewer__stage--nav{grid-template-columns:var(--ax-fv-nav-size) minmax(0,1fr) var(--ax-fv-nav-size);grid-template-areas:\"prev canvas next\";align-items:stretch}ax-file-viewer-container .ax-file-viewer__nav{z-index:2;width:var(--ax-fv-nav-size)!important;height:var(--ax-fv-nav-size)!important;min-width:var(--ax-fv-nav-size)!important;border-radius:999px!important;background:var(--ax-fv-nav-bg)!important;border:1px solid var(--ax-fv-border)!important;color:var(--ax-fv-text)!important;box-shadow:var(--ax-fv-nav-shadow)!important;justify-self:center;align-self:center}ax-file-viewer-container .ax-file-viewer__nav.ax-disabled,ax-file-viewer-container .ax-file-viewer__nav[disabled]{opacity:.35!important;cursor:not-allowed!important;box-shadow:none!important}ax-file-viewer-container .ax-file-viewer__nav--prev{grid-area:prev}ax-file-viewer-container .ax-file-viewer__nav--next{grid-area:next}ax-file-viewer-container .ax-file-viewer__canvas{grid-area:canvas;position:relative;width:100%;max-width:100%;height:100%;min-width:0;min-height:12rem;align-self:stretch;border-radius:1rem;overflow:hidden;box-sizing:border-box}ax-file-viewer-container .ax-file-viewer__canvas .ax-carousel,ax-file-viewer-container .ax-file-viewer__canvas .swiper{width:100%;height:100%;min-width:0;min-height:0;overflow:hidden;box-sizing:border-box}ax-file-viewer-container .ax-file-viewer__canvas .ax-carousel-wrapper,ax-file-viewer-container .ax-file-viewer__canvas .swiper-wrapper{height:100%;align-items:stretch;box-sizing:border-box}ax-file-viewer-container .ax-file-viewer__canvas .ax-carousel-slide,ax-file-viewer-container .ax-file-viewer__canvas .swiper-slide{display:flex!important;align-items:stretch;justify-content:stretch;height:100%;min-width:0;min-height:0;box-sizing:border-box;overflow:hidden}ax-file-viewer-container .ax-file-viewer__canvas img,ax-file-viewer-container .ax-file-viewer__canvas video,ax-file-viewer-container .ax-file-viewer__canvas audio,ax-file-viewer-container .ax-file-viewer__canvas iframe,ax-file-viewer-container .ax-file-viewer__canvas ax-pdf-reader{max-width:100%;max-height:100%}ax-file-viewer-container .ax-file-viewer__overlay-counter{position:absolute;left:50%;bottom:1.25rem;transform:translate(-50%);z-index:3;display:inline-flex;align-items:center;justify-content:center;min-width:3.25rem;padding:.3rem .7rem;border-radius:999px;background:var(--ax-fv-counter-bg);color:var(--ax-fv-counter-text);font-size:.72rem;font-weight:600;letter-spacing:.03em;pointer-events:none;opacity:.8}ax-file-viewer-container .ax-file-viewer__thumbs{width:100%;max-width:100%;min-width:0;padding:.75rem 1rem 1rem;background:var(--ax-fv-surface);border-top:1px solid var(--ax-fv-border);flex:0 0 auto;box-sizing:border-box;overflow:hidden}ax-file-viewer-container .ax-file-viewer__thumbs-track{width:100%;max-width:100%;min-width:0;overflow:hidden;box-sizing:border-box}ax-file-viewer-container .ax-file-viewer__thumbs-track .ax-carousel,ax-file-viewer-container .ax-file-viewer__thumbs-track .swiper{width:100%;max-width:100%;min-width:0;overflow:hidden;box-sizing:border-box}ax-file-viewer-container .ax-file-viewer__thumbs-track .ax-carousel-wrapper,ax-file-viewer-container .ax-file-viewer__thumbs-track .swiper-wrapper{align-items:stretch}ax-file-viewer-container .ax-file-viewer__thumbs-track .ax-carousel-slide,ax-file-viewer-container .ax-file-viewer__thumbs-track .swiper-slide{width:7.5rem;max-width:7.5rem;height:auto;box-sizing:border-box;overflow:hidden}ax-file-viewer-container .ax-file-viewer__thumb{cursor:pointer;width:7.5rem;max-width:7.5rem;display:flex;flex-direction:column;border-radius:.9rem;border:2px solid var(--ax-fv-border);background:var(--ax-fv-thumb-bg);overflow:hidden;box-sizing:border-box;transition:border-color .15s ease}ax-file-viewer-container .ax-file-viewer__thumb:hover{border-color:var(--ax-fv-border-strong)}ax-file-viewer-container .ax-file-viewer__thumb.swiper-slide-thumb-active,ax-file-viewer-container .ax-file-viewer__thumb.ax-file-viewer__thumb--active{border-color:var(--ax-fv-image)}ax-file-viewer-container .ax-file-viewer__thumb.swiper-slide-thumb-active .ax-file-viewer__thumb-index,ax-file-viewer-container .ax-file-viewer__thumb.ax-file-viewer__thumb--active .ax-file-viewer__thumb-index{background:var(--ax-fv-image);color:var(--ax-fv-on-accent)}ax-file-viewer-container .ax-file-viewer__thumb[data-type=video].ax-file-viewer__thumb--active,ax-file-viewer-container .ax-file-viewer__thumb[data-type=video].swiper-slide-thumb-active{border-color:var(--ax-fv-video)}ax-file-viewer-container .ax-file-viewer__thumb[data-type=video].ax-file-viewer__thumb--active .ax-file-viewer__thumb-index,ax-file-viewer-container .ax-file-viewer__thumb[data-type=video].swiper-slide-thumb-active .ax-file-viewer__thumb-index{background:var(--ax-fv-video)}ax-file-viewer-container .ax-file-viewer__thumb[data-type=audio].ax-file-viewer__thumb--active,ax-file-viewer-container .ax-file-viewer__thumb[data-type=audio].swiper-slide-thumb-active{border-color:var(--ax-fv-audio)}ax-file-viewer-container .ax-file-viewer__thumb[data-type=audio].ax-file-viewer__thumb--active .ax-file-viewer__thumb-index,ax-file-viewer-container .ax-file-viewer__thumb[data-type=audio].swiper-slide-thumb-active .ax-file-viewer__thumb-index{background:var(--ax-fv-audio)}ax-file-viewer-container .ax-file-viewer__thumb[data-type=document].ax-file-viewer__thumb--active,ax-file-viewer-container .ax-file-viewer__thumb[data-type=document].swiper-slide-thumb-active{border-color:var(--ax-fv-document)}ax-file-viewer-container .ax-file-viewer__thumb[data-type=document].ax-file-viewer__thumb--active .ax-file-viewer__thumb-index,ax-file-viewer-container .ax-file-viewer__thumb[data-type=document].swiper-slide-thumb-active .ax-file-viewer__thumb-index{background:var(--ax-fv-document)}ax-file-viewer-container .ax-file-viewer__thumb[data-type=file].ax-file-viewer__thumb--active,ax-file-viewer-container .ax-file-viewer__thumb[data-type=file].swiper-slide-thumb-active{border-color:var(--ax-fv-file)}ax-file-viewer-container .ax-file-viewer__thumb[data-type=file].ax-file-viewer__thumb--active .ax-file-viewer__thumb-index,ax-file-viewer-container .ax-file-viewer__thumb[data-type=file].swiper-slide-thumb-active .ax-file-viewer__thumb-index{background:var(--ax-fv-file)}ax-file-viewer-container .ax-file-viewer__thumb-preview{width:100%;max-width:100%;min-width:0;aspect-ratio:1.4;display:flex;align-items:center;justify-content:center;background:var(--ax-fv-thumb-preview);box-sizing:border-box;overflow:hidden}ax-file-viewer-container .ax-file-viewer__thumb-preview i{font-size:1.45rem;color:var(--ax-fv-muted)}ax-file-viewer-container .ax-file-viewer__thumb-preview img{width:100%;height:100%;object-fit:cover;display:block}ax-file-viewer-container .ax-file-viewer__thumb[data-type=image] .ax-file-viewer__thumb-preview i{color:var(--ax-fv-image)}ax-file-viewer-container .ax-file-viewer__thumb[data-type=video] .ax-file-viewer__thumb-preview i{color:var(--ax-fv-video)}ax-file-viewer-container .ax-file-viewer__thumb[data-type=audio] .ax-file-viewer__thumb-preview i{color:var(--ax-fv-audio)}ax-file-viewer-container .ax-file-viewer__thumb[data-type=document] .ax-file-viewer__thumb-preview i{color:var(--ax-fv-document)}ax-file-viewer-container .ax-file-viewer__thumb[data-type=file] .ax-file-viewer__thumb-preview i{color:var(--ax-fv-file)}ax-file-viewer-container .ax-file-viewer__thumb-footer{width:100%;max-width:100%;min-width:0;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:.3rem;align-items:center;padding:.4rem .45rem;border-top:1px solid var(--ax-fv-border);font-size:.65rem;color:var(--ax-fv-muted);box-sizing:border-box}ax-file-viewer-container .ax-file-viewer__thumb-index{display:inline-flex;align-items:center;justify-content:center;min-width:1.15rem;height:1.15rem;padding-inline:.2rem;border-radius:.3rem;background:var(--ax-fv-surface-2);color:var(--ax-fv-muted);font-weight:700}ax-file-viewer-container .ax-file-viewer__thumb-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--ax-fv-text);font-weight:500}ax-file-viewer-container .ax-file-viewer__thumb-size{white-space:nowrap}ax-file-viewer-container .ax-carousel-pagination{display:none}@media (max-width: 768px){ax-file-viewer-container{--ax-fv-stage-pad: .5rem;--ax-fv-nav-size: 2.25rem;border-radius:1rem}ax-file-viewer-container .ax-file-viewer__header{gap:.5rem .75rem;padding:.65rem .75rem;min-width:0}ax-file-viewer-container .ax-file-viewer__name{font-size:.85rem}ax-file-viewer-container .ax-file-viewer__action-btn{width:2rem!important;height:2rem!important;min-width:2rem!important}ax-file-viewer-container .ax-file-viewer__stage--nav{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:minmax(14rem,1fr) auto;grid-template-areas:\"canvas canvas\" \"prev next\";gap:.5rem;align-items:stretch}ax-file-viewer-container .ax-file-viewer__nav--prev{justify-self:end}ax-file-viewer-container .ax-file-viewer__nav--next{justify-self:start}ax-file-viewer-container .ax-file-viewer__canvas{min-height:14rem}ax-file-viewer-container .ax-file-viewer__thumbs{padding:.6rem .75rem .85rem}ax-file-viewer-container .ax-file-viewer__thumbs-track .ax-carousel-slide,ax-file-viewer-container .ax-file-viewer__thumbs-track .swiper-slide{width:5.75rem;max-width:5.75rem}ax-file-viewer-container .ax-file-viewer__thumb{width:5.75rem;max-width:5.75rem}ax-file-viewer-container .ax-file-viewer__thumb-footer{grid-template-columns:auto minmax(0,1fr)}ax-file-viewer-container .ax-file-viewer__thumb-size{display:none}}@media (max-width: 480px){ax-file-viewer-container{--ax-fv-nav-size: 2rem;border-radius:.75rem}ax-file-viewer-container .ax-file-viewer__type-badge{display:none}ax-file-viewer-container .ax-file-viewer__thumbs{padding:.5rem}ax-file-viewer-container .ax-file-viewer__thumbs-track .ax-carousel-slide,ax-file-viewer-container .ax-file-viewer__thumbs-track .swiper-slide{width:5.25rem;max-width:5.25rem}ax-file-viewer-container .ax-file-viewer__thumb{width:5.25rem;max-width:5.25rem}}ax-file-viewer-slide{display:flex;width:100%;height:100%;min-width:0;min-height:0;align-items:stretch;justify-content:stretch;padding:0;box-sizing:border-box;-webkit-user-select:none;user-select:none}ax-file-viewer-image,ax-file-viewer-video,ax-file-viewer-audio,ax-file-viewer-pdf,ax-file-viewer-fallback{display:flex!important;width:100%!important;height:100%!important;min-width:0;min-height:0;box-sizing:border-box}\n"] }]
470
+ }] });
471
+
472
+ const TYPE_ICON_MAP = {
473
+ image: 'fa-light fa-image',
474
+ video: 'fa-light fa-video',
475
+ audio: 'fa-light fa-music',
476
+ document: 'fa-light fa-file-lines',
477
+ file: 'fa-light fa-file',
478
+ };
479
+ class AXFileViewerThumbnailsComponent {
480
+ constructor() {
481
+ this.service = inject(AXFileViewerService);
482
+ this.thumbnails = computed(() => this.service.items().map((item, index) => {
483
+ const type = resolveFileViewerFileType(item);
484
+ return {
485
+ id: item.id,
486
+ index,
487
+ type,
488
+ icon: TYPE_ICON_MAP[type] ?? TYPE_ICON_MAP['file'],
489
+ };
490
+ }), ...(ngDevMode ? [{ debugName: "thumbnails" }] : []));
491
+ }
492
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXFileViewerThumbnailsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
493
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.3", type: AXFileViewerThumbnailsComponent, isStandalone: true, selector: "ax-file-viewer-thumbnails", ngImport: i0, template: `
494
+ <div class="ax-file-viewer-thumbnails">
495
+ @for (thumb of thumbnails(); track thumb.id) {
496
+ <button
497
+ class="ax-file-viewer-thumb"
498
+ [class.ax-file-viewer-thumb--active]="thumb.index === service.selectedIndex()"
499
+ (click)="service.selectedIndex.set(thumb.index)"
500
+ >
501
+ <i [class]="thumb.icon"></i>
502
+ </button>
503
+ }
504
+ </div>
505
+ `, isInline: true, styles: [":host{display:block}.ax-file-viewer-thumbnails{display:flex;gap:.5rem;justify-content:center;padding:.5rem;flex-wrap:wrap}.ax-file-viewer-thumb{display:flex;align-items:center;justify-content:center;width:3rem;height:3rem;border-radius:var(--ax-sys-border-radius, .25rem);border:1px solid rgb(var(--ax-sys-color-border-lightest-surface));background:transparent;cursor:pointer;opacity:.5;transition:opacity .2s;font-size:1.25rem;color:rgb(var(--ax-sys-color-on-surface))}.ax-file-viewer-thumb--active{opacity:1;border-color:rgb(var(--ax-sys-color-primary))}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
506
+ }
507
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXFileViewerThumbnailsComponent, decorators: [{
508
+ type: Component,
509
+ args: [{ selector: 'ax-file-viewer-thumbnails', changeDetection: ChangeDetectionStrategy.OnPush, template: `
510
+ <div class="ax-file-viewer-thumbnails">
511
+ @for (thumb of thumbnails(); track thumb.id) {
512
+ <button
513
+ class="ax-file-viewer-thumb"
514
+ [class.ax-file-viewer-thumb--active]="thumb.index === service.selectedIndex()"
515
+ (click)="service.selectedIndex.set(thumb.index)"
516
+ >
517
+ <i [class]="thumb.icon"></i>
518
+ </button>
519
+ }
520
+ </div>
521
+ `, styles: [":host{display:block}.ax-file-viewer-thumbnails{display:flex;gap:.5rem;justify-content:center;padding:.5rem;flex-wrap:wrap}.ax-file-viewer-thumb{display:flex;align-items:center;justify-content:center;width:3rem;height:3rem;border-radius:var(--ax-sys-border-radius, .25rem);border:1px solid rgb(var(--ax-sys-color-border-lightest-surface));background:transparent;cursor:pointer;opacity:.5;transition:opacity .2s;font-size:1.25rem;color:rgb(var(--ax-sys-color-on-surface))}.ax-file-viewer-thumb--active{opacity:1;border-color:rgb(var(--ax-sys-color-primary))}\n"] }]
522
+ }] });
523
+
524
+ class AXFileViewerImageComponent {
525
+ constructor() {
526
+ this.payload = input.required(...(ngDevMode ? [{ debugName: "payload" }] : []));
527
+ this.service = inject(AXFileViewerService);
528
+ this.src = signal(null, ...(ngDevMode ? [{ debugName: "src" }] : []));
529
+ this.loading = signal(false, ...(ngDevMode ? [{ debugName: "loading" }] : []));
530
+ this.#resolve = effect(() => {
531
+ const p = this.payload();
532
+ if (p.active) {
533
+ this.loading.set(true);
534
+ void this.service
535
+ .resolveUrl(p.item, 'url')
536
+ .then((url) => this.src.set(url ?? null))
537
+ .finally(() => this.loading.set(false));
538
+ }
539
+ }, ...(ngDevMode ? [{ debugName: "#resolve" }] : []));
540
+ }
541
+ #resolve;
542
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXFileViewerImageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
543
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.3", type: AXFileViewerImageComponent, isStandalone: true, selector: "ax-file-viewer-image", inputs: { payload: { classPropertyName: "payload", publicName: "payload", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: `
544
+ @if (loading()) {
545
+ <ax-loading></ax-loading>
546
+ } @else if (src()) {
547
+ <img [src]="src()" [alt]="payload().item.name ?? 'Image'" />
548
+ }
549
+ `, isInline: true, styles: [":host{display:flex;justify-content:center;align-items:center;width:100%;height:100%;min-width:0;min-height:0;padding:.75rem;box-sizing:border-box}img{width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;border-radius:.75rem}\n"], dependencies: [{ kind: "component", type: AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
550
+ }
551
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXFileViewerImageComponent, decorators: [{
552
+ type: Component,
553
+ args: [{ selector: 'ax-file-viewer-image', changeDetection: ChangeDetectionStrategy.OnPush, imports: [AXLoadingComponent], template: `
554
+ @if (loading()) {
555
+ <ax-loading></ax-loading>
556
+ } @else if (src()) {
557
+ <img [src]="src()" [alt]="payload().item.name ?? 'Image'" />
558
+ }
559
+ `, styles: [":host{display:flex;justify-content:center;align-items:center;width:100%;height:100%;min-width:0;min-height:0;padding:.75rem;box-sizing:border-box}img{width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;border-radius:.75rem}\n"] }]
560
+ }] });
561
+
562
+ var imageViewer_component = /*#__PURE__*/Object.freeze({
563
+ __proto__: null,
564
+ AXFileViewerImageComponent: AXFileViewerImageComponent
565
+ });
566
+
567
+ class AXFileViewerVideoComponent {
568
+ constructor() {
569
+ this.payload = input.required(...(ngDevMode ? [{ debugName: "payload" }] : []));
570
+ this.service = inject(AXFileViewerService);
571
+ this.src = signal(null, ...(ngDevMode ? [{ debugName: "src" }] : []));
572
+ this.loading = signal(false, ...(ngDevMode ? [{ debugName: "loading" }] : []));
573
+ this.#resolve = effect(() => {
574
+ const p = this.payload();
575
+ if (p.active) {
576
+ this.loading.set(true);
577
+ void this.service
578
+ .resolveUrl(p.item, 'url')
579
+ .then((url) => this.src.set(url ?? null))
580
+ .finally(() => this.loading.set(false));
581
+ }
582
+ }, ...(ngDevMode ? [{ debugName: "#resolve" }] : []));
583
+ }
584
+ #resolve;
585
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXFileViewerVideoComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
586
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.3", type: AXFileViewerVideoComponent, isStandalone: true, selector: "ax-file-viewer-video", inputs: { payload: { classPropertyName: "payload", publicName: "payload", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: `
587
+ @if (loading()) {
588
+ <ax-loading></ax-loading>
589
+ } @else if (src()) {
590
+ <video controls [src]="src()"></video>
591
+ }
592
+ `, isInline: true, styles: [":host{display:flex;justify-content:center;align-items:center;width:100%;height:100%;min-width:0;min-height:0;padding:.75rem;box-sizing:border-box}video{width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;border-radius:.75rem;background:rgb(var(--ax-sys-color-dark))}\n"], dependencies: [{ kind: "component", type: AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
593
+ }
594
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXFileViewerVideoComponent, decorators: [{
595
+ type: Component,
596
+ args: [{ selector: 'ax-file-viewer-video', changeDetection: ChangeDetectionStrategy.OnPush, imports: [AXLoadingComponent], template: `
597
+ @if (loading()) {
598
+ <ax-loading></ax-loading>
599
+ } @else if (src()) {
600
+ <video controls [src]="src()"></video>
601
+ }
602
+ `, styles: [":host{display:flex;justify-content:center;align-items:center;width:100%;height:100%;min-width:0;min-height:0;padding:.75rem;box-sizing:border-box}video{width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;border-radius:.75rem;background:rgb(var(--ax-sys-color-dark))}\n"] }]
603
+ }] });
604
+
605
+ var videoViewer_component = /*#__PURE__*/Object.freeze({
606
+ __proto__: null,
607
+ AXFileViewerVideoComponent: AXFileViewerVideoComponent
608
+ });
609
+
610
+ class AXFileViewerAudioComponent {
611
+ constructor() {
612
+ this.payload = input.required(...(ngDevMode ? [{ debugName: "payload" }] : []));
613
+ this.service = inject(AXFileViewerService);
614
+ this.src = signal(null, ...(ngDevMode ? [{ debugName: "src" }] : []));
615
+ this.loading = signal(false, ...(ngDevMode ? [{ debugName: "loading" }] : []));
616
+ this.#resolve = effect(() => {
617
+ const p = this.payload();
618
+ if (p.active) {
619
+ this.loading.set(true);
620
+ void this.service
621
+ .resolveUrl(p.item, 'url')
622
+ .then((url) => this.src.set(url ?? null))
623
+ .finally(() => this.loading.set(false));
624
+ }
625
+ }, ...(ngDevMode ? [{ debugName: "#resolve" }] : []));
626
+ }
627
+ #resolve;
628
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXFileViewerAudioComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
629
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.3", type: AXFileViewerAudioComponent, isStandalone: true, selector: "ax-file-viewer-audio", inputs: { payload: { classPropertyName: "payload", publicName: "payload", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: `
630
+ @if (loading()) {
631
+ <ax-loading></ax-loading>
632
+ } @else if (src()) {
633
+ <audio controls [src]="src()"></audio>
634
+ }
635
+ `, isInline: true, styles: [":host{display:flex;justify-content:center;align-items:center;width:100%;height:100%;min-width:0;min-height:0;padding:1rem;box-sizing:border-box}audio{width:100%;max-width:min(40rem,100%);min-width:0}\n"], dependencies: [{ kind: "component", type: AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
636
+ }
637
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXFileViewerAudioComponent, decorators: [{
638
+ type: Component,
639
+ args: [{ selector: 'ax-file-viewer-audio', changeDetection: ChangeDetectionStrategy.OnPush, imports: [AXLoadingComponent], template: `
640
+ @if (loading()) {
641
+ <ax-loading></ax-loading>
642
+ } @else if (src()) {
643
+ <audio controls [src]="src()"></audio>
644
+ }
645
+ `, styles: [":host{display:flex;justify-content:center;align-items:center;width:100%;height:100%;min-width:0;min-height:0;padding:1rem;box-sizing:border-box}audio{width:100%;max-width:min(40rem,100%);min-width:0}\n"] }]
646
+ }] });
647
+
648
+ var audioViewer_component = /*#__PURE__*/Object.freeze({
649
+ __proto__: null,
650
+ AXFileViewerAudioComponent: AXFileViewerAudioComponent
651
+ });
652
+
653
+ class AXFileViewerPdfComponent {
654
+ constructor() {
655
+ this.payload = input.required(...(ngDevMode ? [{ debugName: "payload" }] : []));
656
+ this.service = inject(AXFileViewerService);
657
+ this.sanitizer = inject(DomSanitizer);
658
+ this.safeSrc = signal(null, ...(ngDevMode ? [{ debugName: "safeSrc" }] : []));
659
+ this.loading = signal(false, ...(ngDevMode ? [{ debugName: "loading" }] : []));
660
+ this.#resolve = effect(() => {
661
+ const p = this.payload();
662
+ if (p.active) {
663
+ this.loading.set(true);
664
+ void this.service
665
+ .resolveUrl(p.item, 'url')
666
+ .then((url) => {
667
+ this.safeSrc.set(url ? this.sanitizer.bypassSecurityTrustResourceUrl(url) : null);
668
+ })
669
+ .finally(() => this.loading.set(false));
670
+ }
671
+ }, ...(ngDevMode ? [{ debugName: "#resolve" }] : []));
672
+ }
673
+ #resolve;
674
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXFileViewerPdfComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
675
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.3", type: AXFileViewerPdfComponent, isStandalone: true, selector: "ax-file-viewer-pdf", inputs: { payload: { classPropertyName: "payload", publicName: "payload", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: `
676
+ @if (loading()) {
677
+ <ax-loading></ax-loading>
678
+ } @else if (safeSrc()) {
679
+ <ax-pdf-reader [src]="safeSrc()"></ax-pdf-reader>
680
+ }
681
+ `, isInline: true, styles: [":host{display:flex;width:100%;height:100%;min-width:0;min-height:0;padding:.5rem;box-sizing:border-box}ax-pdf-reader{display:block;width:100%;height:100%}\n"], dependencies: [{ kind: "component", type: AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }, { kind: "component", type: AXPdfReaderComponent, selector: "ax-pdf-reader", inputs: ["src"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
682
+ }
683
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXFileViewerPdfComponent, decorators: [{
684
+ type: Component,
685
+ args: [{ selector: 'ax-file-viewer-pdf', changeDetection: ChangeDetectionStrategy.OnPush, imports: [AXLoadingComponent, AXPdfReaderComponent], template: `
686
+ @if (loading()) {
687
+ <ax-loading></ax-loading>
688
+ } @else if (safeSrc()) {
689
+ <ax-pdf-reader [src]="safeSrc()"></ax-pdf-reader>
690
+ }
691
+ `, styles: [":host{display:flex;width:100%;height:100%;min-width:0;min-height:0;padding:.5rem;box-sizing:border-box}ax-pdf-reader{display:block;width:100%;height:100%}\n"] }]
692
+ }] });
693
+
694
+ var pdfViewer_component = /*#__PURE__*/Object.freeze({
695
+ __proto__: null,
696
+ AXFileViewerPdfComponent: AXFileViewerPdfComponent
697
+ });
698
+
699
+ class AXFileViewerFileFallbackComponent {
700
+ constructor() {
701
+ this.payload = input.required(...(ngDevMode ? [{ debugName: "payload" }] : []));
702
+ this.name = computed(() => this.payload().item.name, ...(ngDevMode ? [{ debugName: "name" }] : []));
703
+ }
704
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXFileViewerFileFallbackComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
705
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.3", type: AXFileViewerFileFallbackComponent, isStandalone: true, selector: "ax-file-viewer-fallback", inputs: { payload: { classPropertyName: "payload", publicName: "payload", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: `
706
+ <div class="ax-file-viewer-fallback">
707
+ <i class="fa-light fa-file ax-file-viewer-fallback__icon"></i>
708
+ @if (name()) {
709
+ <span class="ax-file-viewer-fallback__name">{{ name() }}</span>
710
+ }
711
+ </div>
712
+ `, isInline: true, styles: [":host{display:flex;justify-content:center;align-items:center;width:100%;height:100%;min-width:0;min-height:0;box-sizing:border-box}.ax-file-viewer-fallback{display:flex;flex-direction:column;align-items:center;gap:.5rem;color:inherit;opacity:.85}.ax-file-viewer-fallback__icon{font-size:3rem;opacity:.55}.ax-file-viewer-fallback__name{font-size:.875rem;opacity:.75;max-width:min(20rem,80vw);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
713
+ }
714
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXFileViewerFileFallbackComponent, decorators: [{
715
+ type: Component,
716
+ args: [{ selector: 'ax-file-viewer-fallback', changeDetection: ChangeDetectionStrategy.OnPush, template: `
717
+ <div class="ax-file-viewer-fallback">
718
+ <i class="fa-light fa-file ax-file-viewer-fallback__icon"></i>
719
+ @if (name()) {
720
+ <span class="ax-file-viewer-fallback__name">{{ name() }}</span>
721
+ }
722
+ </div>
723
+ `, styles: [":host{display:flex;justify-content:center;align-items:center;width:100%;height:100%;min-width:0;min-height:0;box-sizing:border-box}.ax-file-viewer-fallback{display:flex;flex-direction:column;align-items:center;gap:.5rem;color:inherit;opacity:.85}.ax-file-viewer-fallback__icon{font-size:3rem;opacity:.55}.ax-file-viewer-fallback__name{font-size:.875rem;opacity:.75;max-width:min(20rem,80vw);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n"] }]
724
+ }] });
725
+
726
+ var fileFallbackViewer_component = /*#__PURE__*/Object.freeze({
727
+ __proto__: null,
728
+ AXFileViewerFileFallbackComponent: AXFileViewerFileFallbackComponent
729
+ });
730
+
731
+ /**
732
+ * Generated bundle index. Do not edit.
733
+ */
734
+
735
+ export { AXFileViewerAudioComponent, AXFileViewerContainerComponent, AXFileViewerFileFallbackComponent, AXFileViewerImageComponent, AXFileViewerPdfComponent, AXFileViewerService, AXFileViewerSlideComponent, AXFileViewerThumbPreviewComponent, AXFileViewerThumbnailsComponent, AXFileViewerVideoComponent, buildFileViewerExtensionHint, createFileViewerFileTypes, provideFileViewer, resolveFileViewerFileType };
736
+ //# sourceMappingURL=acorex-components-file-viewer.mjs.map