@acorex/platform 18.0.5 → 18.0.7

package/fesm2022/{acorex-platform-common-gallery-widget-edit.component-BihOIJ9T.mjs → acorex-platform-common-gallery-widget-edit.component-DB0-6pik.mjs}

@@ -69,135 +69,135 @@ class AXPGalleryWidgetEditComponent extends AXPWidgetEditBase {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPGalleryWidgetEditComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.2", type: AXPGalleryWidgetEditComponent, isStandalone: true, selector: "ng-component", inputs: { multiple: "multiple" }, usesInheritance: true, ngImport: i0, template: `
-    <div class="ax-grid ax-grid-cols-12 ax-gap-2">
-      @if(list().length){
-      <div class="ax-col-start-1 ax-col-end-13 ax-flex ax-items-center lg:ax-justify-start ax-justify-center ">
-        <div class="ax-flex ax-flex-col ax-items-center ax-gap-4 ax-w-full">
-          @switch (getMediaInfo(activeMedia()?.name||'').format) { @case ('video') {
-          <video
-            class="ax-rounded-lg ax-h-48 md:ax-h-72 ax-w-auto ax-shadow-md"
-            controls
-            [src]="activeMedia()?.url"
-          ></video>
-          } @case ('image') {
-          <ax-image class="ax-rounded-lg ax-h-48 md:ax-h-72 ax-w-auto" [src]="activeMedia()?.url">
-            <ax-loading></ax-loading>
-            <ax-placeholder>
-              <div
-                class="ax-w-96 ax-h-72 ax-gap-4 ax-flex ax-flex-col ax-items-center ax-justify-center ax-border ax-rounded-lg"
-              >
-                <ax-icon class="fa-solid fa-circle-exclamation ax-text-3xl"> </ax-icon>
-                <span>Connection Error!</span>
-              </div>
-            </ax-placeholder>
-          </ax-image>
-          } @case ('audio') {
-          <audio controls class="ax-rounded-lg">
-            <source [src]="activeMedia()?.url" type="audio/mp3" />
-          </audio>
-          } }
-          <div class="ax-flex ax-gap-4 ax-overflow-x-auto ax-max-w-[320px] lg:ax-max-w-[480px] ax-pb-2">
-            @for (media of thumbnails(); track $index) {
-            <div
-              *ngIf="getMediaInfo(media.name) as mediaInfo"
-              class="hover:ax-opacity-75 ax-transition-all ax-relative ax-cursor-pointer ax-flex ax-justify-center ax-items-center"
-              (click)="changeMediaSelected(media)"
-            >
-              <ax-image
-                class="ax-w-16 ax-brightness-50 ax-h-16 ax-rounded-lg ax-shadow-md ax-filter"
-                [src]="mediaInfo.format == 'image' ? media.url : media.posterUrl"
-              ></ax-image>
-              <div class="ax-absolute ax-text-neutral-300 ax-text-xl">
-                <ax-icon [class]="mediaInfo.icon"> </ax-icon>
-              </div>
-            </div>
-            }
-            <div axUploaderZone>
-              <div
-                axUploaderBrowseHandle
-                class="ax-flex ax-justify-center ax-items-center ax-w-16 ax-h-16 ax-border ax-rounded-lg ax-cursor-pointer"
-              >
-                <ax-icon class="fa-solid fa-plus ax-text-neutral-500"> </ax-icon>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-      } @else {
-      <div class=" ax-col-start-1 ax-col-end-13">
-        <ax-uploader-drop-zone></ax-uploader-drop-zone>
-      </div>
-
-      }
-    </div>
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.2", type: AXPGalleryWidgetEditComponent, isStandalone: true, selector: "ng-component", inputs: { multiple: "multiple" }, usesInheritance: true, ngImport: i0, template: `
+    <div class="ax-grid ax-grid-cols-12 ax-gap-2">
+      @if(list().length){
+      <div class="ax-col-start-1 ax-col-end-13 ax-flex ax-items-center lg:ax-justify-start ax-justify-center ">
+        <div class="ax-flex ax-flex-col ax-items-center ax-gap-4 ax-w-full">
+          @switch (getMediaInfo(activeMedia()?.name||'').format) { @case ('video') {
+          <video
+            class="ax-rounded-lg ax-h-48 md:ax-h-72 ax-w-auto ax-shadow-md"
+            controls
+            [src]="activeMedia()?.url"
+          ></video>
+          } @case ('image') {
+          <ax-image class="ax-rounded-lg ax-h-48 md:ax-h-72 ax-w-auto" [src]="activeMedia()?.url">
+            <ax-loading></ax-loading>
+            <ax-placeholder>
+              <div
+                class="ax-w-96 ax-h-72 ax-gap-4 ax-flex ax-flex-col ax-items-center ax-justify-center ax-border ax-rounded-lg"
+              >
+                <ax-icon class="fa-solid fa-circle-exclamation ax-text-3xl"> </ax-icon>
+                <span>Connection Error!</span>
+              </div>
+            </ax-placeholder>
+          </ax-image>
+          } @case ('audio') {
+          <audio controls class="ax-rounded-lg">
+            <source [src]="activeMedia()?.url" type="audio/mp3" />
+          </audio>
+          } }
+          <div class="ax-flex ax-gap-4 ax-overflow-x-auto ax-max-w-[320px] lg:ax-max-w-[480px] ax-pb-2">
+            @for (media of thumbnails(); track $index) {
+            <div
+              *ngIf="getMediaInfo(media.name) as mediaInfo"
+              class="hover:ax-opacity-75 ax-transition-all ax-relative ax-cursor-pointer ax-flex ax-justify-center ax-items-center"
+              (click)="changeMediaSelected(media)"
+            >
+              <ax-image
+                class="ax-w-16 ax-brightness-50 ax-h-16 ax-rounded-lg ax-shadow-md ax-filter"
+                [src]="mediaInfo.format == 'image' ? media.url : media.posterUrl"
+              ></ax-image>
+              <div class="ax-absolute ax-text-neutral-300 ax-text-xl">
+                <ax-icon [class]="mediaInfo.icon"> </ax-icon>
+              </div>
+            </div>
+            }
+            <div axUploaderZone>
+              <div
+                axUploaderBrowseHandle
+                class="ax-flex ax-justify-center ax-items-center ax-w-16 ax-h-16 ax-border ax-rounded-lg ax-cursor-pointer"
+              >
+                <ax-icon class="fa-solid fa-plus ax-text-neutral-500"> </ax-icon>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+      } @else {
+      <div class=" ax-col-start-1 ax-col-end-13">
+        <ax-uploader-drop-zone></ax-uploader-drop-zone>
+      </div>
+
+      }
+    </div>
   `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i3.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i3.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-sub-title, ax-placeholder, ax-overlay" }, { kind: "ngmodule", type: AXImageModule }, { kind: "component", type: i2.AXImageComponent, selector: "ax-image", inputs: ["overlayMode", "src", "alt", "priority", "lazy"], outputs: ["onLoad", "onError"] }, { kind: "ngmodule", type: AXLoadingModule }, { kind: "component", type: i3$1.AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }, { kind: "ngmodule", type: AXUploaderModule }, { kind: "component", type: i5.AXUploaderDropZoneComponent, selector: "ax-uploader-drop-zone" }, { kind: "directive", type: i5.AXUploaderZoneDirective, selector: "[axUploaderZone]", inputs: ["multiple"] }, { kind: "directive", type: i5.AXUploaderBrowseDirective, selector: "[axUploaderBrowseHandle]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPGalleryWidgetEditComponent, decorators: [{
             type: Component,
             args: [{
-                    template: `
-    <div class="ax-grid ax-grid-cols-12 ax-gap-2">
-      @if(list().length){
-      <div class="ax-col-start-1 ax-col-end-13 ax-flex ax-items-center lg:ax-justify-start ax-justify-center ">
-        <div class="ax-flex ax-flex-col ax-items-center ax-gap-4 ax-w-full">
-          @switch (getMediaInfo(activeMedia()?.name||'').format) { @case ('video') {
-          <video
-            class="ax-rounded-lg ax-h-48 md:ax-h-72 ax-w-auto ax-shadow-md"
-            controls
-            [src]="activeMedia()?.url"
-          ></video>
-          } @case ('image') {
-          <ax-image class="ax-rounded-lg ax-h-48 md:ax-h-72 ax-w-auto" [src]="activeMedia()?.url">
-            <ax-loading></ax-loading>
-            <ax-placeholder>
-              <div
-                class="ax-w-96 ax-h-72 ax-gap-4 ax-flex ax-flex-col ax-items-center ax-justify-center ax-border ax-rounded-lg"
-              >
-                <ax-icon class="fa-solid fa-circle-exclamation ax-text-3xl"> </ax-icon>
-                <span>Connection Error!</span>
-              </div>
-            </ax-placeholder>
-          </ax-image>
-          } @case ('audio') {
-          <audio controls class="ax-rounded-lg">
-            <source [src]="activeMedia()?.url" type="audio/mp3" />
-          </audio>
-          } }
-          <div class="ax-flex ax-gap-4 ax-overflow-x-auto ax-max-w-[320px] lg:ax-max-w-[480px] ax-pb-2">
-            @for (media of thumbnails(); track $index) {
-            <div
-              *ngIf="getMediaInfo(media.name) as mediaInfo"
-              class="hover:ax-opacity-75 ax-transition-all ax-relative ax-cursor-pointer ax-flex ax-justify-center ax-items-center"
-              (click)="changeMediaSelected(media)"
-            >
-              <ax-image
-                class="ax-w-16 ax-brightness-50 ax-h-16 ax-rounded-lg ax-shadow-md ax-filter"
-                [src]="mediaInfo.format == 'image' ? media.url : media.posterUrl"
-              ></ax-image>
-              <div class="ax-absolute ax-text-neutral-300 ax-text-xl">
-                <ax-icon [class]="mediaInfo.icon"> </ax-icon>
-              </div>
-            </div>
-            }
-            <div axUploaderZone>
-              <div
-                axUploaderBrowseHandle
-                class="ax-flex ax-justify-center ax-items-center ax-w-16 ax-h-16 ax-border ax-rounded-lg ax-cursor-pointer"
-              >
-                <ax-icon class="fa-solid fa-plus ax-text-neutral-500"> </ax-icon>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-      } @else {
-      <div class=" ax-col-start-1 ax-col-end-13">
-        <ax-uploader-drop-zone></ax-uploader-drop-zone>
-      </div>
-
-      }
-    </div>
+                    template: `
+    <div class="ax-grid ax-grid-cols-12 ax-gap-2">
+      @if(list().length){
+      <div class="ax-col-start-1 ax-col-end-13 ax-flex ax-items-center lg:ax-justify-start ax-justify-center ">
+        <div class="ax-flex ax-flex-col ax-items-center ax-gap-4 ax-w-full">
+          @switch (getMediaInfo(activeMedia()?.name||'').format) { @case ('video') {
+          <video
+            class="ax-rounded-lg ax-h-48 md:ax-h-72 ax-w-auto ax-shadow-md"
+            controls
+            [src]="activeMedia()?.url"
+          ></video>
+          } @case ('image') {
+          <ax-image class="ax-rounded-lg ax-h-48 md:ax-h-72 ax-w-auto" [src]="activeMedia()?.url">
+            <ax-loading></ax-loading>
+            <ax-placeholder>
+              <div
+                class="ax-w-96 ax-h-72 ax-gap-4 ax-flex ax-flex-col ax-items-center ax-justify-center ax-border ax-rounded-lg"
+              >
+                <ax-icon class="fa-solid fa-circle-exclamation ax-text-3xl"> </ax-icon>
+                <span>Connection Error!</span>
+              </div>
+            </ax-placeholder>
+          </ax-image>
+          } @case ('audio') {
+          <audio controls class="ax-rounded-lg">
+            <source [src]="activeMedia()?.url" type="audio/mp3" />
+          </audio>
+          } }
+          <div class="ax-flex ax-gap-4 ax-overflow-x-auto ax-max-w-[320px] lg:ax-max-w-[480px] ax-pb-2">
+            @for (media of thumbnails(); track $index) {
+            <div
+              *ngIf="getMediaInfo(media.name) as mediaInfo"
+              class="hover:ax-opacity-75 ax-transition-all ax-relative ax-cursor-pointer ax-flex ax-justify-center ax-items-center"
+              (click)="changeMediaSelected(media)"
+            >
+              <ax-image
+                class="ax-w-16 ax-brightness-50 ax-h-16 ax-rounded-lg ax-shadow-md ax-filter"
+                [src]="mediaInfo.format == 'image' ? media.url : media.posterUrl"
+              ></ax-image>
+              <div class="ax-absolute ax-text-neutral-300 ax-text-xl">
+                <ax-icon [class]="mediaInfo.icon"> </ax-icon>
+              </div>
+            </div>
+            }
+            <div axUploaderZone>
+              <div
+                axUploaderBrowseHandle
+                class="ax-flex ax-justify-center ax-items-center ax-w-16 ax-h-16 ax-border ax-rounded-lg ax-cursor-pointer"
+              >
+                <ax-icon class="fa-solid fa-plus ax-text-neutral-500"> </ax-icon>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+      } @else {
+      <div class=" ax-col-start-1 ax-col-end-13">
+        <ax-uploader-drop-zone></ax-uploader-drop-zone>
+      </div>
+
+      }
+    </div>
   `,
                     standalone: true,
                     changeDetection: ChangeDetectionStrategy.OnPush,
@@ -207,4 +207,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
         }] });
 
 export { AXPGalleryWidgetEditComponent };
-//# sourceMappingURL=acorex-platform-common-gallery-widget-edit.component-BihOIJ9T.mjs.map
+//# sourceMappingURL=acorex-platform-common-gallery-widget-edit.component-DB0-6pik.mjs.map

package/fesm2022/acorex-platform-common-gallery-widget-edit.component-DB0-6pik.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"acorex-platform-common-gallery-widget-edit.component-DB0-6pik.mjs","sources":["../../../../libs/platform/common/src/lib/schema/widgets/gallery/gallery-widget-edit.component.ts"],"sourcesContent":["import { AXButtonModule } from '@acorex/components/button';\nimport { AXDecoratorModule } from '@acorex/components/decorators';\nimport { AXImageModule } from '@acorex/components/image';\nimport { AXLoadingModule } from '@acorex/components/loading';\nimport { AXUploaderModule } from '@acorex/components/uploader';\nimport { CommonModule } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, Signal, WritableSignal, computed, signal } from '@angular/core';\nimport { AXPMediaInfo, AXPMediaItem } from './gallery-widget-types';\nimport { AXPWidgetEditBase } from '../../widget/widget-base';\n\n\n@Component({\n  template: `\n    <div class=\"ax-grid ax-grid-cols-12 ax-gap-2\">\n      @if(list().length){\n      <div class=\"ax-col-start-1 ax-col-end-13 ax-flex ax-items-center lg:ax-justify-start ax-justify-center \">\n        <div class=\"ax-flex ax-flex-col ax-items-center ax-gap-4 ax-w-full\">\n          @switch (getMediaInfo(activeMedia()?.name||'').format) { @case ('video') {\n          <video\n            class=\"ax-rounded-lg ax-h-48 md:ax-h-72 ax-w-auto ax-shadow-md\"\n            controls\n            [src]=\"activeMedia()?.url\"\n          ></video>\n          } @case ('image') {\n          <ax-image class=\"ax-rounded-lg ax-h-48 md:ax-h-72 ax-w-auto\" [src]=\"activeMedia()?.url\">\n            <ax-loading></ax-loading>\n            <ax-placeholder>\n              <div\n                class=\"ax-w-96 ax-h-72 ax-gap-4 ax-flex ax-flex-col ax-items-center ax-justify-center ax-border ax-rounded-lg\"\n              >\n                <ax-icon class=\"fa-solid fa-circle-exclamation ax-text-3xl\"> </ax-icon>\n                <span>Connection Error!</span>\n              </div>\n            </ax-placeholder>\n          </ax-image>\n          } @case ('audio') {\n          <audio controls class=\"ax-rounded-lg\">\n            <source [src]=\"activeMedia()?.url\" type=\"audio/mp3\" />\n          </audio>\n          } }\n          <div class=\"ax-flex ax-gap-4 ax-overflow-x-auto ax-max-w-[320px] lg:ax-max-w-[480px] ax-pb-2\">\n            @for (media of thumbnails(); track $index) {\n            <div\n              *ngIf=\"getMediaInfo(media.name) as mediaInfo\"\n              class=\"hover:ax-opacity-75 ax-transition-all ax-relative ax-cursor-pointer ax-flex ax-justify-center ax-items-center\"\n              (click)=\"changeMediaSelected(media)\"\n            >\n              <ax-image\n                class=\"ax-w-16 ax-brightness-50 ax-h-16 ax-rounded-lg ax-shadow-md ax-filter\"\n                [src]=\"mediaInfo.format == 'image' ? media.url : media.posterUrl\"\n              ></ax-image>\n              <div class=\"ax-absolute ax-text-neutral-300 ax-text-xl\">\n                <ax-icon [class]=\"mediaInfo.icon\"> </ax-icon>\n              </div>\n            </div>\n            }\n            <div axUploaderZone>\n              <div\n                axUploaderBrowseHandle\n                class=\"ax-flex ax-justify-center ax-items-center ax-w-16 ax-h-16 ax-border ax-rounded-lg ax-cursor-pointer\"\n              >\n                <ax-icon class=\"fa-solid fa-plus ax-text-neutral-500\"> </ax-icon>\n              </div>\n            </div>\n          </div>\n        </div>\n      </div>\n      } @else {\n      <div class=\" ax-col-start-1 ax-col-end-13\">\n        <ax-uploader-drop-zone></ax-uploader-drop-zone>\n      </div>\n\n      }\n    </div>\n  `,\n  standalone: true,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  imports: [CommonModule, AXButtonModule, AXDecoratorModule, AXImageModule, AXLoadingModule, AXUploaderModule],\n  inputs: ['multiple'],\n})\nexport class AXPGalleryWidgetEditComponent extends AXPWidgetEditBase {\n  protected multiple!: boolean;\n  protected activeMedia: WritableSignal<AXPMediaItem | null> = signal(null);\n  protected list: WritableSignal<AXPMediaItem[]> = signal([]);\n  protected thumbnails: Signal<AXPMediaItem[]> = computed(() =>\n    this.list().filter((i) => i.id !== this.activeMedia()?.id)\n  );\n\n  ngAfterViewInit(): void {\n    const parsedValue = this.value ? JSON.parse(this.value) : [];\n    this.list.set(Array.isArray(parsedValue) ? parsedValue.map((c) => c) : [parsedValue]);\n    this.activeMedia.set(this.list()[0]);\n  }\n\n  changeMediaSelected(media: AXPMediaItem) {\n    this.activeMedia.set(media);\n  }\n\n  protected getMediaInfo(mediaName: string): AXPMediaInfo {\n    const extension = mediaName.split('.').pop()?.toLowerCase();\n\n    switch (extension) {\n      case 'jpg':\n      case 'jpeg':\n      case 'png':\n      case 'gif':\n      case 'bmp':\n        return { icon: '', format: 'image' };\n\n      case 'mp4':\n      case 'avi':\n      case 'mkv':\n      case 'mov':\n        return { icon: 'fa-regular fa-play', format: 'video' };\n\n      case 'mp3':\n      case 'wav':\n      case 'ogg':\n        return { icon: 'fa-regular fa-volume-high', format: 'audio' };\n\n      default:\n        return { icon: '', format: 'image' };\n    }\n  }\n}\n"],"names":["i3","i4"],"mappings":"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"}

package/fesm2022/{acorex-platform-common-gallery-widget-filter.component-DS1PCIJp.mjs → acorex-platform-common-gallery-widget-filter.component-Btrq4HP9.mjs}

@@ -30,15 +30,15 @@ import 'rxjs/operators';
 
 class AXPGalleryWidgetFilterComponent extends AXPWidgetFilterBase {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPGalleryWidgetFilterComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: AXPGalleryWidgetFilterComponent, isStandalone: true, selector: "ng-component", usesInheritance: true, ngImport: i0, template: `
-    <ax-select-box [(ngModel)]="value" [placeholder]="'Has media'" [dataSource]="['Yes', 'No']"></ax-select-box>
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXSelectBoxModule }, { kind: "component", type: i6.AXSelectBoxComponent, selector: "ax-select-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "minValue", "maxValue", "value", "state", "name", "id", "type", "look", "multiple", "valueField", "textField", "dataSource", "caption", "itemTemplate", "selectedTemplate", "emptyTemplate", "loadingTemplate", "dropdownWidth"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: AXPGalleryWidgetFilterComponent, isStandalone: true, selector: "ng-component", usesInheritance: true, ngImport: i0, template: `
+    <ax-select-box [(ngModel)]="value" [placeholder]="'Has media'" [dataSource]="['Yes', 'No']"></ax-select-box>
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXSelectBoxModule }, { kind: "component", type: i6.AXSelectBoxComponent, selector: "ax-select-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "minValue", "maxValue", "value", "state", "name", "id", "type", "look", "multiple", "valueField", "textField", "textTemplate", "dataSource", "caption", "itemTemplate", "selectedTemplate", "emptyTemplate", "loadingTemplate", "dropdownWidth"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPGalleryWidgetFilterComponent, decorators: [{
             type: Component,
             args: [{
-                    template: `
-    <ax-select-box [(ngModel)]="value" [placeholder]="'Has media'" [dataSource]="['Yes', 'No']"></ax-select-box>
+                    template: `
+    <ax-select-box [(ngModel)]="value" [placeholder]="'Has media'" [dataSource]="['Yes', 'No']"></ax-select-box>
   `,
                     standalone: true,
                     changeDetection: ChangeDetectionStrategy.OnPush,
@@ -48,4 +48,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
         }] });
 
 export { AXPGalleryWidgetFilterComponent };
-//# sourceMappingURL=acorex-platform-common-gallery-widget-filter.component-DS1PCIJp.mjs.map
+//# sourceMappingURL=acorex-platform-common-gallery-widget-filter.component-Btrq4HP9.mjs.map

package/fesm2022/acorex-platform-common-gallery-widget-filter.component-Btrq4HP9.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"acorex-platform-common-gallery-widget-filter.component-Btrq4HP9.mjs","sources":["../../../../libs/platform/common/src/lib/schema/widgets/gallery/gallery-widget-filter.component.ts"],"sourcesContent":["import { AXSelectBoxModule } from '@acorex/components/select-box';\nimport { AXPWidgetFilterBase } from '../../widget/widget-base';\nimport { CommonModule } from '@angular/common';\nimport { ChangeDetectionStrategy, Component } from '@angular/core';\nimport { FormsModule } from '@angular/forms';\n@Component({\n  template: `\n    <ax-select-box [(ngModel)]=\"value\" [placeholder]=\"'Has media'\" [dataSource]=\"['Yes', 'No']\"></ax-select-box>\n  `,\n  standalone: true,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  imports: [CommonModule, AXSelectBoxModule, FormsModule],\n  inputs: [],\n})\nexport class AXPGalleryWidgetFilterComponent extends AXPWidgetFilterBase { }\n"],"names":["i1"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAcM,MAAO,+BAAgC,SAAQ,mBAAmB,CAAA;8GAA3D,+BAA+B,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;AAA/B,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,+BAA+B,EARhC,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,cAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAAA,CAAA;;AAET,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAGS,YAAY,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAE,iBAAiB,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAAA,EAAA,CAAA,oBAAA,EAAA,QAAA,EAAA,eAAA,EAAA,MAAA,EAAA,CAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,aAAA,EAAA,UAAA,EAAA,UAAA,EAAA,OAAA,EAAA,OAAA,EAAA,MAAA,EAAA,IAAA,EAAA,MAAA,EAAA,MAAA,EAAA,UAAA,EAAA,YAAA,EAAA,WAAA,EAAA,cAAA,EAAA,YAAA,EAAA,SAAA,EAAA,cAAA,EAAA,kBAAA,EAAA,eAAA,EAAA,iBAAA,EAAA,eAAA,CAAA,EAAA,OAAA,EAAA,CAAA,aAAA,EAAA,aAAA,EAAA,gBAAA,EAAA,QAAA,EAAA,SAAA,EAAA,gBAAA,EAAA,gBAAA,EAAA,UAAA,EAAA,UAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAE,WAAW,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,eAAA,EAAA,QAAA,EAAA,2CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,qDAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,UAAA,EAAA,SAAA,EAAA,gBAAA,CAAA,EAAA,OAAA,EAAA,CAAA,eAAA,CAAA,EAAA,QAAA,EAAA,CAAA,SAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA,EAAA;;2FAG3C,+BAA+B,EAAA,UAAA,EAAA,CAAA;kBAT3C,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,CAAA;;AAET,EAAA,CAAA;AACD,oBAAA,UAAU,EAAE,IAAI;oBAChB,eAAe,EAAE,uBAAuB,CAAC,MAAM;AAC/C,oBAAA,OAAO,EAAE,CAAC,YAAY,EAAE,iBAAiB,EAAE,WAAW,CAAC;AACvD,oBAAA,MAAM,EAAE,EAAE;AACX,iBAAA,CAAA;;;;;"}

package/fesm2022/{acorex-platform-common-gallery-widget-view.component-CnQONVdg.mjs → acorex-platform-common-gallery-widget-view.component-Bp5cEEiY.mjs}

@@ -69,119 +69,119 @@ class AXPGalleryWidgetViewComponent extends AXPWidgetBase {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPGalleryWidgetViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.2", type: AXPGalleryWidgetViewComponent, isStandalone: true, selector: "ng-component", inputs: { context: "context", multiple: "multiple" }, usesInheritance: true, ngImport: i0, template: `
-    <div class="ax-grid ax-grid-cols-12 ax-gap-2">
-      @if(list().length){
-      <div class="ax-flex ax-items-center ax-justify-between ax-rounded-lg ax-bg-surface ax-col-start-1 ax-col-end-13">
-        <div class="ax-flex ax-items-center md:ax-justify-start ax-justify-center ax-w-full ax-gap-3">
-          <div class="ax-flex ax-flex-col ax-items-center ax-gap-4">
-            @switch (getMediaInfo(activeMedia()?.name||'').format) { @case ('video') {
-            <video
-              class="ax-rounded-lg ax-h-48 md:ax-h-72 ax-w-auto ax-shadow-md"
-              controls
-              [src]="activeMedia()?.url"
-            ></video>
-            } @case ('image') {
-            <ax-image class="ax-rounded-lg ax-h-48 md:ax-h-72 ax-w-auto" [src]="activeMedia()?.url">
-              <ax-loading></ax-loading>
-              <ax-placeholder>
-                <div
-                  class="ax-w-96 ax-h-72 ax-gap-4 ax-flex ax-flex-col ax-items-center ax-justify-center ax-border ax-rounded-lg"
-                >
-                  <ax-icon class="fa-solid fa-circle-exclamation ax-text-3xl"> </ax-icon>
-                  <span>Connection Error!</span>
-                </div>
-              </ax-placeholder>
-            </ax-image>
-            } @case ('audio') {
-            <audio controls class="ax-rounded-lg">
-              <source [src]="activeMedia()?.url" type="audio/mp3" />
-            </audio>
-            } }
-            <div class="ax-flex ax-gap-4 ax-overflow-x-auto ax-max-w-[320px] lg:ax-max-w-[480px] ax-pb-2">
-              @for (media of thumbnails(); track $index) {
-              <div
-                *ngIf="getMediaInfo(media.name) as mediaInfo"
-                class="hover:ax-opacity-75 ax-transition-all ax-relative ax-cursor-pointer ax-flex ax-justify-center ax-items-center"
-                (click)="changeMediaSelected(media)"
-              >
-                <ax-image
-                  class="ax-w-16 ax-brightness-50 ax-h-16 ax-rounded-lg ax-shadow-md ax-filter"
-                  [src]="mediaInfo.format == 'image' ? media.url : media.posterUrl"
-                ></ax-image>
-                <div class="ax-absolute ax-text-neutral-300 ax-text-xl">
-                  <ax-icon [class]="mediaInfo.icon"> </ax-icon>
-                </div>
-              </div>
-              }
-            </div>
-          </div>
-        </div>
-      </div>
-      } @else {
-      <!-- ask for empty state: -->
-      <small>No Media!</small>
-      }
-    </div>
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.2", type: AXPGalleryWidgetViewComponent, isStandalone: true, selector: "ng-component", inputs: { context: "context", multiple: "multiple" }, usesInheritance: true, ngImport: i0, template: `
+    <div class="ax-grid ax-grid-cols-12 ax-gap-2">
+      @if(list().length){
+      <div class="ax-flex ax-items-center ax-justify-between ax-rounded-lg ax-bg-surface ax-col-start-1 ax-col-end-13">
+        <div class="ax-flex ax-items-center md:ax-justify-start ax-justify-center ax-w-full ax-gap-3">
+          <div class="ax-flex ax-flex-col ax-items-center ax-gap-4">
+            @switch (getMediaInfo(activeMedia()?.name||'').format) { @case ('video') {
+            <video
+              class="ax-rounded-lg ax-h-48 md:ax-h-72 ax-w-auto ax-shadow-md"
+              controls
+              [src]="activeMedia()?.url"
+            ></video>
+            } @case ('image') {
+            <ax-image class="ax-rounded-lg ax-h-48 md:ax-h-72 ax-w-auto" [src]="activeMedia()?.url">
+              <ax-loading></ax-loading>
+              <ax-placeholder>
+                <div
+                  class="ax-w-96 ax-h-72 ax-gap-4 ax-flex ax-flex-col ax-items-center ax-justify-center ax-border ax-rounded-lg"
+                >
+                  <ax-icon class="fa-solid fa-circle-exclamation ax-text-3xl"> </ax-icon>
+                  <span>Connection Error!</span>
+                </div>
+              </ax-placeholder>
+            </ax-image>
+            } @case ('audio') {
+            <audio controls class="ax-rounded-lg">
+              <source [src]="activeMedia()?.url" type="audio/mp3" />
+            </audio>
+            } }
+            <div class="ax-flex ax-gap-4 ax-overflow-x-auto ax-max-w-[320px] lg:ax-max-w-[480px] ax-pb-2">
+              @for (media of thumbnails(); track $index) {
+              <div
+                *ngIf="getMediaInfo(media.name) as mediaInfo"
+                class="hover:ax-opacity-75 ax-transition-all ax-relative ax-cursor-pointer ax-flex ax-justify-center ax-items-center"
+                (click)="changeMediaSelected(media)"
+              >
+                <ax-image
+                  class="ax-w-16 ax-brightness-50 ax-h-16 ax-rounded-lg ax-shadow-md ax-filter"
+                  [src]="mediaInfo.format == 'image' ? media.url : media.posterUrl"
+                ></ax-image>
+                <div class="ax-absolute ax-text-neutral-300 ax-text-xl">
+                  <ax-icon [class]="mediaInfo.icon"> </ax-icon>
+                </div>
+              </div>
+              }
+            </div>
+          </div>
+        </div>
+      </div>
+      } @else {
+      <!-- ask for empty state: -->
+      <small>No Media!</small>
+      }
+    </div>
   `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i3.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i3.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-sub-title, ax-placeholder, ax-overlay" }, { kind: "ngmodule", type: AXImageModule }, { kind: "component", type: i2.AXImageComponent, selector: "ax-image", inputs: ["overlayMode", "src", "alt", "priority", "lazy"], outputs: ["onLoad", "onError"] }, { kind: "ngmodule", type: AXLoadingModule }, { kind: "component", type: i3$1.AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPGalleryWidgetViewComponent, decorators: [{
             type: Component,
             args: [{
-                    template: `
-    <div class="ax-grid ax-grid-cols-12 ax-gap-2">
-      @if(list().length){
-      <div class="ax-flex ax-items-center ax-justify-between ax-rounded-lg ax-bg-surface ax-col-start-1 ax-col-end-13">
-        <div class="ax-flex ax-items-center md:ax-justify-start ax-justify-center ax-w-full ax-gap-3">
-          <div class="ax-flex ax-flex-col ax-items-center ax-gap-4">
-            @switch (getMediaInfo(activeMedia()?.name||'').format) { @case ('video') {
-            <video
-              class="ax-rounded-lg ax-h-48 md:ax-h-72 ax-w-auto ax-shadow-md"
-              controls
-              [src]="activeMedia()?.url"
-            ></video>
-            } @case ('image') {
-            <ax-image class="ax-rounded-lg ax-h-48 md:ax-h-72 ax-w-auto" [src]="activeMedia()?.url">
-              <ax-loading></ax-loading>
-              <ax-placeholder>
-                <div
-                  class="ax-w-96 ax-h-72 ax-gap-4 ax-flex ax-flex-col ax-items-center ax-justify-center ax-border ax-rounded-lg"
-                >
-                  <ax-icon class="fa-solid fa-circle-exclamation ax-text-3xl"> </ax-icon>
-                  <span>Connection Error!</span>
-                </div>
-              </ax-placeholder>
-            </ax-image>
-            } @case ('audio') {
-            <audio controls class="ax-rounded-lg">
-              <source [src]="activeMedia()?.url" type="audio/mp3" />
-            </audio>
-            } }
-            <div class="ax-flex ax-gap-4 ax-overflow-x-auto ax-max-w-[320px] lg:ax-max-w-[480px] ax-pb-2">
-              @for (media of thumbnails(); track $index) {
-              <div
-                *ngIf="getMediaInfo(media.name) as mediaInfo"
-                class="hover:ax-opacity-75 ax-transition-all ax-relative ax-cursor-pointer ax-flex ax-justify-center ax-items-center"
-                (click)="changeMediaSelected(media)"
-              >
-                <ax-image
-                  class="ax-w-16 ax-brightness-50 ax-h-16 ax-rounded-lg ax-shadow-md ax-filter"
-                  [src]="mediaInfo.format == 'image' ? media.url : media.posterUrl"
-                ></ax-image>
-                <div class="ax-absolute ax-text-neutral-300 ax-text-xl">
-                  <ax-icon [class]="mediaInfo.icon"> </ax-icon>
-                </div>
-              </div>
-              }
-            </div>
-          </div>
-        </div>
-      </div>
-      } @else {
-      <!-- ask for empty state: -->
-      <small>No Media!</small>
-      }
-    </div>
+                    template: `
+    <div class="ax-grid ax-grid-cols-12 ax-gap-2">
+      @if(list().length){
+      <div class="ax-flex ax-items-center ax-justify-between ax-rounded-lg ax-bg-surface ax-col-start-1 ax-col-end-13">
+        <div class="ax-flex ax-items-center md:ax-justify-start ax-justify-center ax-w-full ax-gap-3">
+          <div class="ax-flex ax-flex-col ax-items-center ax-gap-4">
+            @switch (getMediaInfo(activeMedia()?.name||'').format) { @case ('video') {
+            <video
+              class="ax-rounded-lg ax-h-48 md:ax-h-72 ax-w-auto ax-shadow-md"
+              controls
+              [src]="activeMedia()?.url"
+            ></video>
+            } @case ('image') {
+            <ax-image class="ax-rounded-lg ax-h-48 md:ax-h-72 ax-w-auto" [src]="activeMedia()?.url">
+              <ax-loading></ax-loading>
+              <ax-placeholder>
+                <div
+                  class="ax-w-96 ax-h-72 ax-gap-4 ax-flex ax-flex-col ax-items-center ax-justify-center ax-border ax-rounded-lg"
+                >
+                  <ax-icon class="fa-solid fa-circle-exclamation ax-text-3xl"> </ax-icon>
+                  <span>Connection Error!</span>
+                </div>
+              </ax-placeholder>
+            </ax-image>
+            } @case ('audio') {
+            <audio controls class="ax-rounded-lg">
+              <source [src]="activeMedia()?.url" type="audio/mp3" />
+            </audio>
+            } }
+            <div class="ax-flex ax-gap-4 ax-overflow-x-auto ax-max-w-[320px] lg:ax-max-w-[480px] ax-pb-2">
+              @for (media of thumbnails(); track $index) {
+              <div
+                *ngIf="getMediaInfo(media.name) as mediaInfo"
+                class="hover:ax-opacity-75 ax-transition-all ax-relative ax-cursor-pointer ax-flex ax-justify-center ax-items-center"
+                (click)="changeMediaSelected(media)"
+              >
+                <ax-image
+                  class="ax-w-16 ax-brightness-50 ax-h-16 ax-rounded-lg ax-shadow-md ax-filter"
+                  [src]="mediaInfo.format == 'image' ? media.url : media.posterUrl"
+                ></ax-image>
+                <div class="ax-absolute ax-text-neutral-300 ax-text-xl">
+                  <ax-icon [class]="mediaInfo.icon"> </ax-icon>
+                </div>
+              </div>
+              }
+            </div>
+          </div>
+        </div>
+      </div>
+      } @else {
+      <!-- ask for empty state: -->
+      <small>No Media!</small>
+      }
+    </div>
   `,
                     standalone: true,
                     changeDetection: ChangeDetectionStrategy.OnPush,
@@ -191,4 +191,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
         }] });
 
 export { AXPGalleryWidgetViewComponent };
-//# sourceMappingURL=acorex-platform-common-gallery-widget-view.component-CnQONVdg.mjs.map
+//# sourceMappingURL=acorex-platform-common-gallery-widget-view.component-Bp5cEEiY.mjs.map

package/fesm2022/acorex-platform-common-gallery-widget-view.component-Bp5cEEiY.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"acorex-platform-common-gallery-widget-view.component-Bp5cEEiY.mjs","sources":["../../../../libs/platform/common/src/lib/schema/widgets/gallery/gallery-widget-view.component.ts"],"sourcesContent":["import { AXButtonModule } from '@acorex/components/button';\nimport { AXDecoratorModule } from '@acorex/components/decorators';\nimport { AXImageModule } from '@acorex/components/image';\nimport { AXLoadingModule } from '@acorex/components/loading';\nimport { AXPWidgetBase } from '../../widget/widget-base';\nimport { CommonModule } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, Signal, WritableSignal, computed, signal } from '@angular/core';\nimport { AXPMediaInfo, AXPMediaItem } from './gallery-widget-types';\n\n@Component({\n  template: `\n    <div class=\"ax-grid ax-grid-cols-12 ax-gap-2\">\n      @if(list().length){\n      <div class=\"ax-flex ax-items-center ax-justify-between ax-rounded-lg ax-bg-surface ax-col-start-1 ax-col-end-13\">\n        <div class=\"ax-flex ax-items-center md:ax-justify-start ax-justify-center ax-w-full ax-gap-3\">\n          <div class=\"ax-flex ax-flex-col ax-items-center ax-gap-4\">\n            @switch (getMediaInfo(activeMedia()?.name||'').format) { @case ('video') {\n            <video\n              class=\"ax-rounded-lg ax-h-48 md:ax-h-72 ax-w-auto ax-shadow-md\"\n              controls\n              [src]=\"activeMedia()?.url\"\n            ></video>\n            } @case ('image') {\n            <ax-image class=\"ax-rounded-lg ax-h-48 md:ax-h-72 ax-w-auto\" [src]=\"activeMedia()?.url\">\n              <ax-loading></ax-loading>\n              <ax-placeholder>\n                <div\n                  class=\"ax-w-96 ax-h-72 ax-gap-4 ax-flex ax-flex-col ax-items-center ax-justify-center ax-border ax-rounded-lg\"\n                >\n                  <ax-icon class=\"fa-solid fa-circle-exclamation ax-text-3xl\"> </ax-icon>\n                  <span>Connection Error!</span>\n                </div>\n              </ax-placeholder>\n            </ax-image>\n            } @case ('audio') {\n            <audio controls class=\"ax-rounded-lg\">\n              <source [src]=\"activeMedia()?.url\" type=\"audio/mp3\" />\n            </audio>\n            } }\n            <div class=\"ax-flex ax-gap-4 ax-overflow-x-auto ax-max-w-[320px] lg:ax-max-w-[480px] ax-pb-2\">\n              @for (media of thumbnails(); track $index) {\n              <div\n                *ngIf=\"getMediaInfo(media.name) as mediaInfo\"\n                class=\"hover:ax-opacity-75 ax-transition-all ax-relative ax-cursor-pointer ax-flex ax-justify-center ax-items-center\"\n                (click)=\"changeMediaSelected(media)\"\n              >\n                <ax-image\n                  class=\"ax-w-16 ax-brightness-50 ax-h-16 ax-rounded-lg ax-shadow-md ax-filter\"\n                  [src]=\"mediaInfo.format == 'image' ? media.url : media.posterUrl\"\n                ></ax-image>\n                <div class=\"ax-absolute ax-text-neutral-300 ax-text-xl\">\n                  <ax-icon [class]=\"mediaInfo.icon\"> </ax-icon>\n                </div>\n              </div>\n              }\n            </div>\n          </div>\n        </div>\n      </div>\n      } @else {\n      <!-- ask for empty state: -->\n      <small>No Media!</small>\n      }\n    </div>\n  `,\n  standalone: true,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  imports: [CommonModule, AXButtonModule, AXDecoratorModule, AXImageModule, AXLoadingModule],\n  inputs: ['context', 'multiple'],\n})\nexport class AXPGalleryWidgetViewComponent extends AXPWidgetBase {\n  protected multiple!: boolean;\n  protected list: WritableSignal<AXPMediaItem[]> = signal([]);\n  protected thumbnails: Signal<AXPMediaItem[]> = computed(() =>\n    this.list().filter((i) => i.id !== this.activeMedia()?.id)\n  );\n  protected activeMedia: WritableSignal<AXPMediaItem | undefined> = signal(undefined);\n\n  override render() {\n    const rawValue: AXPMediaItem[] = this.rawValue ? JSON.parse(this.rawValue) : [];\n    this.list.set(Array.isArray(rawValue) ? rawValue.map((c) => c) : [rawValue]);\n  }\n\n  ngOnInit(): void {\n    this.activeMedia.set(this.list()[0]);\n  }\n\n  changeMediaSelected(media: AXPMediaItem) {\n    this.activeMedia.set(media);\n  }\n\n  protected getMediaInfo(mediaName: string): AXPMediaInfo {\n    const extension = mediaName.split('.').pop()?.toLowerCase();\n\n    switch (extension) {\n      case 'jpg':\n      case 'jpeg':\n      case 'png':\n      case 'gif':\n      case 'bmp':\n        return { icon: '', format: 'image' };\n\n      case 'mp4':\n      case 'avi':\n      case 'mkv':\n      case 'mov':\n        return { icon: 'fa-regular fa-play', format: 'video' };\n\n      case 'mp3':\n      case 'wav':\n      case 'ogg':\n        return { icon: 'fa-regular fa-volume-high', format: 'audio' };\n\n      default:\n        return { icon: '', format: 'image' };\n    }\n  }\n}\n"],"names":["i2","i4"],"mappings":"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"}