diff --git a/bundle/Controller/Configuration.php b/bundle/Controller/Configuration.php
new file mode 100644
index 00000000..9dbe4b99
--- /dev/null
+++ b/bundle/Controller/Configuration.php
@@ -0,0 +1,176 @@
+<?php
+
+declare(strict_types=1);
+
+namespace Netgen\Bundle\RemoteMediaBundle\Controller;
+
+use Netgen\RemoteMedia\Core\Resolver\Variation as VariationResolver;
+use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
+use Symfony\Component\HttpFoundation\JsonResponse;
+use Symfony\Component\HttpFoundation\Request;
+use Symfony\Component\Routing\RouterInterface;
+use Symfony\Contracts\Translation\TranslatorInterface;
+
+final class Configuration extends AbstractController
+{
+    public function __construct(
+        private readonly RouterInterface $router,
+        private readonly TranslatorInterface $translator,
+        private readonly VariationResolver $variationResolver,
+    ) {
+    }
+
+    public function __invoke(Request $request): JsonResponse
+    {
+        return new JsonResponse([
+            'paths' => $this->resolvePaths(),
+            'translations' => $this->resolveTranslations(),
+            'availableVariations' => $this->resolveAvailableVariations($request),
+            'allVariations' => $this->resolveAllVariations($request),
+            'uploadContext' => $this->resolveUploadContext($request),
+        ]);
+    }
+
+    private function resolvePaths(): array
+    {
+        return [
+            'browse_resources' => $this->router->generate('netgen_remote_media_ajax_resource_browse'),
+            'upload_resources' => $this->router->generate('netgen_remote_media_ajax_resource_upload'),
+            'load_facets' => $this->router->generate('netgen_remote_media_ajax_facets_load'),
+            'load_folders' => $this->router->generate('netgen_remote_media_ajax_folder_load'),
+            'create_folder' => $this->router->generate('netgen_remote_media_ajax_folder_create'),
+        ];
+    }
+
+    private function resolveTranslations(): array
+    {
+        return [
+            'browse_title' => $this->translator->trans('ngrm.edit.vue.browse.title', [], 'ngremotemedia'),
+            'browse_select_type' => $this->translator->trans('ngrm.edit.vue.browse.facets.select_type', [], 'ngremotemedia'),
+            'browse_loading_types' => $this->translator->trans('ngrm.edit.vue.browse.facets.loading_types', [], 'ngremotemedia'),
+            'browse_all_types' => $this->translator->trans('ngrm.edit.vue.browse.facets.all_types', [], 'ngremotemedia'),
+            'browse_select_folder' => $this->translator->trans('ngrm.edit.vue.browse.facets.select_folder', [], 'ngremotemedia'),
+            'browse_loading_folders' => $this->translator->trans('ngrm.edit.vue.browse.facets.loading_folders', [], 'ngremotemedia'),
+            'browse_all_folders' => $this->translator->trans('ngrm.edit.vue.browse.facets.all_folders', [], 'ngremotemedia'),
+            'browse_select_tag' => $this->translator->trans('ngrm.edit.vue.browse.facets.select_tag', [], 'ngremotemedia'),
+            'browse_loading_tags' => $this->translator->trans('ngrm.edit.vue.browse.facets.loading_tags', [], 'ngremotemedia'),
+            'browse_all_tags' => $this->translator->trans('ngrm.edit.vue.browse.facets.all_tags', [], 'ngremotemedia'),
+            'browse_select_visibility' => $this->translator->trans('ngrm.edit.vue.browse.facets.select_visibility', [], 'ngremotemedia'),
+            'browse_loading_visibilities' => $this->translator->trans('ngrm.edit.vue.browse.facets.loading_visibilities', [], 'ngremotemedia'),
+            'browse_all_visibilities' => $this->translator->trans('ngrm.edit.vue.browse.facets.all_visibilities', [], 'ngremotemedia'),
+            'search' => $this->translator->trans('ngrm.edit.vue.browse.facets.search', [], 'ngremotemedia'),
+            'search_placeholder' => $this->translator->trans('ngrm.edit.vue.browse.facets.search_placeholder', [], 'ngremotemedia'),
+            'browse_empty_folder' => $this->translator->trans('ngrm.edit.vue.browse.empty_folder', [], 'ngremotemedia'),
+            'browse_empty_folder_hint' => $this->translator->trans('ngrm.edit.vue.browse.empty_folder_hint', [], 'ngremotemedia'),
+            'browse_select' => $this->translator->trans('ngrm.edit.vue.browse.select', [], 'ngremotemedia'),
+            'load_more' => $this->translator->trans('ngrm.edit.vue.browse.load_more', [], 'ngremotemedia'),
+            'crop_modal_title' => $this->translator->trans('ngrm.edit.vue.crop.modal_title', [], 'ngremotemedia'),
+            'crop_reset' => $this->translator->trans('ngrm.edit.vue.crop.reset', [], 'ngremotemedia'),
+            'crop_apply' => $this->translator->trans('ngrm.edit.vue.crop.apply', [], 'ngremotemedia'),
+            'crop_cancel' => $this->translator->trans('ngrm.edit.vue.crop.cancel', [], 'ngremotemedia'),
+            'crop_add' => $this->translator->trans('ngrm.edit.vue.crop.add', [], 'ngremotemedia'),
+            'crop_preview' => $this->translator->trans('ngrm.edit.vue.crop.preview', [], 'ngremotemedia'),
+            'crop_save_sizes' => $this->translator->trans('ngrm.edit.vue.crop.save_sizes', [], 'ngremotemedia'),
+            'crop_add_size' => $this->translator->trans('ngrm.edit.vue.crop.add_size', [], 'ngremotemedia'),
+            'crop_added_for_confirmation' => $this->translator->trans('ngrm.edit.vue.crop.added_for_confirmation', [], 'ngremotemedia'),
+            'crop_media_too_small' => $this->translator->trans('ngrm.edit.vue.crop.media_too_small', [], 'ngremotemedia'),
+            'media_gallery_empty_folder' => $this->translator->trans('ngrm.edit.vue.media_gallery.empty_folder', [], 'ngremotemedia'),
+            'media_gallery_upload_media' => $this->translator->trans('ngrm.edit.vue.media_gallery.upload_media', [], 'ngremotemedia'),
+            'media_gallery_select' => $this->translator->trans('ngrm.edit.vue.media_gallery.select', [], 'ngremotemedia'),
+            'media_gallery_load_more' => $this->translator->trans('ngrm.edit.vue.media_gallery.load_more', [], 'ngremotemedia'),
+            'Search for media' => $this->translator->trans("Search for media", [], 'ngremotemedia'),
+            'Load more' => $this->translator->trans("Load more", [], 'ngremotemedia'),
+            'Upload new media' => $this->translator->trans('Upload new media', [], 'ngremotemedia'),
+            'No results' => $this->translator->trans('No results', [], 'ngremotemedia'),
+            'Alternate text' => $this->translator->trans('Alternate text', [], 'ngremotemedia'),
+            'Class' => $this->translator->trans('CSS class', [], 'ngremotemedia'),
+            'Create new folder?' => $this->translator->trans('Create new folder?', [], 'ngremotemedia'),
+            'Folder' => $this->translator->trans('Folder', [], 'ngremotemedia'),
+            'All' => $this->translator->trans('All', [], 'ngremotemedia'),
+            'Add tag' => $this->translator->trans('Add tag', [], 'ngremotemedia'),
+            'Media type' => $this->translator->trans('Media type', [], 'ngremotemedia'),
+            'Image' => $this->translator->trans('Image and documents', [], 'ngremotemedia'),
+            'Video' => $this->translator->trans('Video', [], 'ngremotemedia'),
+            'Loading...' => $this->translator->trans('Loading...', [], 'ngremotemedia'),
+            'Cancel' => $this->translator->trans('Cancel', [], 'ngremotemedia'),
+            'Save all' => $this->translator->trans('Save all', [], 'ngremotemedia'),
+            'Generate' => $this->translator->trans('Generate', [], 'ngremotemedia'),
+            'Caption' => $this->translator->trans('Caption', [], 'ngremotemedia'),
+            'by' => $this->translator->trans('by', [], 'ngremotemedia'),
+            'name' => $this->translator->trans('name', [], 'ngremotemedia'),
+            'tag' => $this->translator->trans('tag', [], 'ngremotemedia'),
+            'Image is to small for this version' => $this->translator->trans('Image is to small for this version', [], 'ngremotemedia'),
+            'close' => $this->translator->trans('Close', [], 'ngremotemedia'),
+            'next' => $this->translator->trans('Next 25 &gt;', [], 'ngremotemedia'),
+            'prev' => $this->translator->trans('&lt; Previous 25', [], 'ngremotemedia'),
+            'interactions_scale' => $this->translator->trans('ngrm.edit.vue.interactions.scale', [], 'ngremotemedia'),
+            'interactions_no_media_selected' => $this->translator->trans('ngrm.edit.vue.interactions.no_media_selected', [], 'ngremotemedia'),
+            'interactions_remove_media' => $this->translator->trans('ngrm.edit.vue.interactions.remove_media', [], 'ngremotemedia'),
+            'interactions_select_media' => $this->translator->trans('ngrm.edit.vue.interactions.select_media', [], 'ngremotemedia'),
+            'interactions_manage_media' => $this->translator->trans('ngrm.edit.vue.interactions.manage_media', [], 'ngremotemedia'),
+            'interactions_quick_upload' => $this->translator->trans('ngrm.edit.vue.interactions.quick_upload', [], 'ngremotemedia'),
+            'preview_alternate_text' => $this->translator->trans('ngrm.edit.vue.preview.alternate_text', [], 'ngremotemedia'),
+            'preview_alternate_text_info' => $this->translator->trans('ngrm.edit.vue.preview.alternate_text_info', [], 'ngremotemedia'),
+            'preview_caption' => $this->translator->trans('ngrm.edit.vue.preview.caption', [], 'ngremotemedia'),
+            'preview_caption_info' => $this->translator->trans('ngrm.edit.vue.preview.caption_info', [], 'ngremotemedia'),
+            'preview_tags' => $this->translator->trans('ngrm.edit.vue.preview.tags', [], 'ngremotemedia'),
+            'preview_tags_info' => $this->translator->trans('ngrm.edit.vue.preview.tags_info', [], 'ngremotemedia'),
+            'preview_watermark_text' => $this->translator->trans('ngrm.edit.vue.preview.watermark_text', [], 'ngremotemedia'),
+            'preview_watermark_text_info' => $this->translator->trans('ngrm.edit.vue.preview.watermark_text_info', [], 'ngremotemedia'),
+            'preview_css_class' => $this->translator->trans('ngrm.edit.vue.preview.css_class', [], 'ngremotemedia'),
+            'preview_css_class_info' => $this->translator->trans('ngrm.edit.vue.preview.css_class_info', [], 'ngremotemedia'),
+            'preview_selected_variation' => $this->translator->trans('ngrm.edit.vue.preview.selected_variation', [], 'ngremotemedia'),
+            'preview_selected_variation_info' => $this->translator->trans('ngrm.edit.vue.preview.selected_variation_info', [], 'ngremotemedia'),
+            'preview_size' => $this->translator->trans('ngrm.edit.vue.preview.size', [], 'ngremotemedia'),
+            'upload_modal_title' => $this->translator->trans('ngrm.edit.vue.upload.modal_title', [], 'ngremotemedia'),
+            'upload_breadcrumbs_info' => $this->translator->trans('ngrm.edit.vue.upload.breadcrumbs_info', [], 'ngremotemedia'),
+            'upload_root_folder' => $this->translator->trans('ngrm.edit.vue.upload.root_folder', [], 'ngremotemedia'),
+            'upload_info_text' => $this->translator->trans('ngrm.edit.vue.upload.info_text', [], 'ngremotemedia'),
+            'upload_button_select' => $this->translator->trans('ngrm.edit.vue.upload.button.select', [], 'ngremotemedia'),
+            'upload_button_create' => $this->translator->trans('ngrm.edit.vue.upload.button.create', [], 'ngremotemedia'),
+            'upload_button_upload' => $this->translator->trans('ngrm.edit.vue.upload.button.upload', [], 'ngremotemedia'),
+            'upload_button_use_existing_resource' => $this->translator->trans('ngrm.edit.vue.upload.button.use_existing_resource', [], 'ngremotemedia'),
+            'upload_checkbox_overwrite' => $this->translator->trans('ngrm.edit.vue.upload.checkbox.overwrite', [], 'ngremotemedia'),
+            'upload_placeholder_new_folder' => $this->translator->trans('ngrm.edit.vue.upload.placeholder.new_folder', [], 'ngremotemedia'),
+            'upload_error_existing_resource' => $this->translator->trans('ngrm.edit.vue.upload.error.existing_resource', [], 'ngremotemedia'),
+            'upload_error_unsupported_resource_type' => $this->translator->trans('ngrm.edit.vue.upload.error.unsupported_resource_type', [], 'ngremotemedia'),
+        ];
+    }
+
+    private function resolveAvailableVariations(Request $request): array
+    {
+        $variationGroup = $request->query->get('variationGroup');
+
+        $variations = $this->variationResolver->getAvailableCroppableVariations($variationGroup);
+
+        $availableVariations = [];
+        foreach ($variations as $variationName => $variationConfig) {
+            foreach ($variationConfig['transformations'] as $name => $config) {
+                if ($name !== 'crop') {
+                    continue;
+                }
+
+                $availableVariations[$variationName] = $config;
+            }
+        }
+
+        return $availableVariations;
+    }
+
+    private function resolveAllVariations(Request $request): array
+    {
+        $variationGroup = $request->query->get('variationGroup');
+
+        $variations = $this->variationResolver->getAvailableVariations($variationGroup);
+
+        return array_keys($variations);;
+    }
+
+    /**
+     * @return array<string, string>
+     */
+    private function resolveUploadContext(Request $request): array
+    {
+        return $request->query->get('uploadContext');
+    }
+}
diff --git a/bundle/Controller/Location/Create.php b/bundle/Controller/Location/Create.php
new file mode 100644
index 00000000..7e3ecf11
--- /dev/null
+++ b/bundle/Controller/Location/Create.php
@@ -0,0 +1,53 @@
+<?php
+
+declare(strict_types=1);
+
+namespace Netgen\Bundle\RemoteMediaBundle\Controller\Location;
+
+use InvalidArgumentException;
+use Netgen\RemoteMedia\API\ProviderInterface;
+use Netgen\RemoteMedia\API\Values\RemoteResourceLocation;
+use Netgen\RemoteMedia\Exception\RemoteResourceNotFoundException;
+use Netgen\RemoteMedia\Service\RemoteResourceService;
+use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
+use Symfony\Component\HttpFoundation\JsonResponse;
+use Symfony\Component\HttpFoundation\Request;
+use Symfony\Component\HttpFoundation\Response;
+
+final class Create extends AbstractController
+{
+    public function __construct(
+        private ProviderInterface $provider,
+        private RemoteResourceService $service,
+    ) {}
+
+    public function __invoke(Request $request): Response
+    {
+        $selectedImage = json_decode($request->getContent(), true);
+        
+        if ($selectedImage['id'] === null) {
+            throw new InvalidArgumentException('No image selected.');
+        }
+        
+        try {
+            $remoteResource = $this->provider->loadByRemoteId($selectedImage['id']);
+        } catch (RemoteResourceNotFoundException $e) {
+            $remoteResource = $this->provider->loadFromRemote($selectedImage['id']);
+        }
+
+        $this->service->handleRemoteUpdate(
+            $remoteResource,
+            [
+                'altText' => $selectedImage['alternateText'],
+                'caption' => $selectedImage['caption'],
+                'tags' => $selectedImage['tags'],
+            ],
+            true,
+        );
+
+        $remoteResourceLocation = new RemoteResourceLocation($remoteResource);
+        $this->service->handleLocationUpdate($remoteResourceLocation, $selectedImage, true);
+
+        return new JsonResponse([ 'locationId' => $remoteResourceLocation->getId() ]);
+    }
+}
diff --git a/bundle/Controller/Location/Delete.php b/bundle/Controller/Location/Delete.php
new file mode 100644
index 00000000..9211fa27
--- /dev/null
+++ b/bundle/Controller/Location/Delete.php
@@ -0,0 +1,23 @@
+<?php
+
+declare(strict_types=1);
+
+namespace Netgen\Bundle\RemoteMediaBundle\Controller\Location;
+
+use Netgen\RemoteMedia\API\ProviderInterface;
+use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
+use Symfony\Component\HttpFoundation\Response;
+
+final class Delete extends AbstractController
+{
+    public function __construct(
+        private ProviderInterface $provider,
+    ) {}
+
+    public function __invoke(int $locationId): Response
+    {
+        $this->provider->removeLocation($this->provider->loadLocation($locationId));
+
+        return new Response();
+    }
+}
diff --git a/bundle/Controller/Location/SelectedImage.php b/bundle/Controller/Location/SelectedImage.php
new file mode 100644
index 00000000..8d9c0c2d
--- /dev/null
+++ b/bundle/Controller/Location/SelectedImage.php
@@ -0,0 +1,65 @@
+<?php
+
+declare(strict_types=1);
+
+namespace Netgen\Bundle\RemoteMediaBundle\Controller\Location;
+
+use Netgen\RemoteMedia\API\Values\AuthToken;
+use Netgen\RemoteMedia\API\ProviderInterface;
+use Netgen\RemoteMedia\Service\RemoteResourceService;
+use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
+use Symfony\Component\HttpFoundation\JsonResponse;
+
+final class SelectedImage extends AbstractController
+{
+    public function __construct(
+        private ProviderInterface $provider,
+        private RemoteResourceService $service,
+    ) {}
+
+    public function __invoke(int $locationId): JsonResponse
+    {
+        $remoteResourceLocation = $this->provider->loadLocation($locationId);
+        $remoteResource = $remoteResourceLocation->getRemoteResource();
+
+        $authenticatedLocation = $remoteResourceLocation;
+        $variationGroup = 'ngrm_interface';
+        $browseVariationName = 'browse';
+        $previewVariationName = 'preview';
+
+        if ($remoteResource->isProtected()) {
+            $token = AuthToken::fromDuration(600);
+            $authenticatedLocation =  $this->provider->authenticateRemoteResourceLocation($remoteResourceLocation, $token);
+            $browseVariationName = 'browse_protected';
+            $previewVariationName = 'preview_protected';
+        }
+        
+        $browseUrl = null;
+        $previewUrl = null;
+        if ($remoteResource->getType() === 'image') {
+            $browseUrl = $this->provider->buildVariation($authenticatedLocation, $variationGroup, $browseVariationName);
+            $previewUrl = $this->provider->buildVariation($authenticatedLocation, $variationGroup, $previewVariationName);
+        } else if ($remoteResource->getType() === 'video') {
+            $browseUrl = $this->provider->buildVideoThumbnailVariation($authenticatedLocation, $variationGroup, $browseVariationName);
+            $previewUrl = $this->provider->buildVideoThumbnailVariation($authenticatedLocation, $variationGroup, $previewVariationName);
+        }
+
+        return new JsonResponse([
+            'id' => $remoteResource->getRemoteId() ?? '',
+            'name' => $remoteResource->getName() ?? '',
+            'type' => $remoteResource->getType() ?? '',
+            'format' => $remoteResource->getMetadataProperty('format') ?? '',
+            'url' => $remoteResource->getUrl(),
+            'browse_url' => $browseUrl?->getUrl() ?? '',
+            'previewUrl' => $previewUrl?->getUrl() ?? '',
+            'alternateText' => $remoteResource->getAltText(),
+            'caption' => $remoteResource->getCaption(),
+            'watermarkText' => $remoteResourceLocation->getWatermarkText(),
+            'tags' => $remoteResource->getTags(),
+            'size' => $remoteResource->getSize(),
+            'variations' => $this->service->resolveCropSettingsJson($remoteResourceLocation),
+            'height' => $remoteResource->getMetadataProperty('height') ?? 0,
+            'width' => $remoteResource->getMetadataProperty('width') ?? 0,
+        ]);
+    }
+}
diff --git a/bundle/Controller/Location/Update.php b/bundle/Controller/Location/Update.php
new file mode 100644
index 00000000..e32e3e3a
--- /dev/null
+++ b/bundle/Controller/Location/Update.php
@@ -0,0 +1,48 @@
+<?php
+
+declare(strict_types=1);
+
+namespace Netgen\Bundle\RemoteMediaBundle\Controller\Location;
+
+use InvalidArgumentException;
+use Netgen\RemoteMedia\API\ProviderInterface;
+use Netgen\RemoteMedia\Service\RemoteResourceService;
+use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
+use Symfony\Component\HttpFoundation\Request;
+use Symfony\Component\HttpFoundation\Response;
+
+final class Update extends AbstractController
+{
+    public function __construct(
+        private ProviderInterface $provider,
+        private RemoteResourceService $service,
+    ) {}
+
+    public function __invoke(int $locationId, Request $request): Response
+    {
+        $selectedImage = json_decode($request->getContent(), true);
+        
+        if ($selectedImage['id'] === null) {
+            throw new InvalidArgumentException('No selected image data.');
+        }
+
+        $remoteResourceLocation = $this->provider->loadLocation($locationId);
+        if ($remoteResourceLocation->getRemoteResource()->getRemoteId() !== $selectedImage['id']) {
+            throw new InvalidArgumentException('Trying to update location with new resource. Instead, delete this location and create a new one.');
+        }
+
+        $this->service->handleRemoteUpdate(
+            $remoteResourceLocation->getRemoteResource(),
+            [
+                'altText' => $selectedImage['alternateText'],
+                'caption' => $selectedImage['caption'],
+                'tags' => $selectedImage['tags'],
+            ],
+            true,
+        );
+
+        $this->service->handleLocationUpdate($remoteResourceLocation, $selectedImage, true);
+
+        return new Response();
+    }
+}
diff --git a/bundle/Controller/Resource/View.php b/bundle/Controller/Resource/View.php
new file mode 100644
index 00000000..11a66daf
--- /dev/null
+++ b/bundle/Controller/Resource/View.php
@@ -0,0 +1,31 @@
+<?php
+
+declare(strict_types=1);
+
+namespace Netgen\Bundle\RemoteMediaBundle\Controller\Resource;
+
+use Netgen\RemoteMedia\API\ProviderInterface;
+use Symfony\Component\HttpFoundation\Request;
+use Symfony\Component\HttpFoundation\Response;
+use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
+
+final class View extends AbstractController
+{
+    public function __construct(
+        private ProviderInterface $provider,
+    ) {}
+
+    public function __invoke(int $locationId, Request $request): Response
+    {
+        return new Response($this->renderView(
+            $this->container->getParameter('netgen_remote_media.templates.view_resource'),
+            [
+                'location' => $this->provider->loadLocation($locationId),
+                'css_class' => $request->query->get('css_class'),
+                'variation_name' => $request->query->get('variation_name'),
+                'variation_group' => $request->query->get('variation_group'),
+                'alignment' => $request->query->get('alignment'),
+            ]
+        ));
+    }
+}
diff --git a/bundle/DependencyInjection/Configuration.php b/bundle/DependencyInjection/Configuration.php
index 71388e6c..843f0ce8 100644
--- a/bundle/DependencyInjection/Configuration.php
+++ b/bundle/DependencyInjection/Configuration.php
@@ -24,6 +24,7 @@ public function getConfigTreeBuilder(): TreeBuilder
         $this->addCacheConfiguration($treeBuilder->getRootNode());
         $this->addCloudinaryConfiguration($treeBuilder->getRootNode());
         $this->addNamedObjectsConfiguration($treeBuilder->getRootNode());
+        $this->addTemplateConfiguration($treeBuilder->getRootNode());
 
         return $treeBuilder;
     }
@@ -226,4 +227,17 @@ private function addNamedObjectsConfiguration(ArrayNodeDefinition $rootNode): vo
                 ->end()
             ->end();
     }
+
+    private function addTemplateConfiguration(ArrayNodeDefinition $rootNode): void
+    {
+        $rootNode
+            ->children()
+                ->arrayNode('templates')
+                    ->children()
+                        ->scalarNode('view_resource')
+                            ->cannotBeEmpty()
+                        ->end()
+                ->end()
+            ->end();
+    }
 }
diff --git a/bundle/DependencyInjection/NetgenRemoteMediaExtension.php b/bundle/DependencyInjection/NetgenRemoteMediaExtension.php
index 54adb22e..94d98bc0 100644
--- a/bundle/DependencyInjection/NetgenRemoteMediaExtension.php
+++ b/bundle/DependencyInjection/NetgenRemoteMediaExtension.php
@@ -44,6 +44,8 @@ public function load(array $configs, ContainerBuilder $container): void
             throw new InvalidArgumentException('The "provider" option must be set');
         }
 
+        $loader->load('templates.yaml');
+
         $container->setParameter('netgen_remote_media.remove_unused_resources', $config['remove_unused']);
         $container->setAlias('netgen_remote_media.provider', 'netgen_remote_media.provider.' . $config['provider']);
 
@@ -100,6 +102,16 @@ public function load(array $configs, ContainerBuilder $container): void
 
         $container->setAlias('netgen_remote_media.provider.cloudinary.gateway', $cloudinaryGatewayAlias);
 
+        if (isset($config['templates'])) {
+            if (isset($config['templates']['view_resource'])) {
+                $container->setParameter(
+                    'netgen_remote_media.templates.view_resource',
+                    $config['templates']['view_resource'],
+                );
+
+            }
+        }
+
         $loader->load('default_parameters.yaml');
         $loader->load('services/**/*.yaml', 'glob');
     }
diff --git a/bundle/Resources/config/routing/ajax.yaml b/bundle/Resources/config/routing/ajax.yaml
index 5bfcdbe7..3f40bd1a 100644
--- a/bundle/Resources/config/routing/ajax.yaml
+++ b/bundle/Resources/config/routing/ajax.yaml
@@ -27,3 +27,39 @@ netgen_remote_media_ajax_resource_upload:
     defaults:
         _controller: netgen_remote_media.controller.resource.upload
     methods: [POST]
+
+netgen_remote_media_ajax_location_create:
+    path: /location/create
+    defaults:
+        _controller: netgen_remote_media.controller.location.create
+    methods: [POST]
+
+netgen_remote_media_ajax_location_update:
+    path: /location/update/{locationId}
+    defaults:
+        _controller: netgen_remote_media.controller.location.update
+    methods: [PUT]
+
+netgen_remote_media_ajax_location_delete:
+    path: /location/delete/{locationId}
+    defaults:
+        _controller: netgen_remote_media.controller.location.delete
+    methods: [DELETE]
+
+netgen_remote_media_ajax_location_selected_image:
+    path: /location/{locationId}/selected-image
+    defaults:
+        _controller: netgen_remote_media.controller.location.selected_image
+    methods: [GET]
+
+netgen_remote_media_ajax_resource_view:
+    path: /resource/view/{locationId}
+    defaults:
+        _controller: netgen_remote_media.controller.resource.view
+    methods: [GET]
+
+netgen_remote_media_ajax_configuration:
+    path: /configuration
+    defaults:
+        _controller: netgen_remote_media.controller.configuration
+    methods: [GET]
diff --git a/bundle/Resources/config/services/controllers.yaml b/bundle/Resources/config/services/controllers.yaml
index 50d94b92..34c2308b 100644
--- a/bundle/Resources/config/services/controllers.yaml
+++ b/bundle/Resources/config/services/controllers.yaml
@@ -32,6 +32,49 @@ services:
             - '@netgen_remote_media.factory.md5_file_hash'
             - '@translator'
 
+    netgen_remote_media.controller.resource.view:
+        class: Netgen\Bundle\RemoteMediaBundle\Controller\Resource\View
+        public: true
+        arguments:
+            - '@netgen_remote_media.provider'
+        calls:
+            - [setContainer, ['@service_container']]
+
+    netgen_remote_media.controller.location.create:
+        class: Netgen\Bundle\RemoteMediaBundle\Controller\Location\Create
+        public: true
+        arguments:
+            - '@netgen_remote_media.provider'
+            - '@netgen_remote_media.service.remote_resource_service'
+        calls:
+            - [setContainer, ['@service_container']]
+
+    netgen_remote_media.controller.location.delete:
+        class: Netgen\Bundle\RemoteMediaBundle\Controller\Location\Delete
+        public: true
+        arguments:
+            - '@netgen_remote_media.provider'
+        calls:
+            - [setContainer, ['@service_container']]
+
+    netgen_remote_media.controller.location.update:
+        class: Netgen\Bundle\RemoteMediaBundle\Controller\Location\Update
+        public: true
+        arguments:
+            - '@netgen_remote_media.provider'
+            - '@netgen_remote_media.service.remote_resource_service'
+        calls:
+            - [setContainer, ['@service_container']]
+
+    netgen_remote_media.controller.location.selected_image:
+        class: Netgen\Bundle\RemoteMediaBundle\Controller\Location\SelectedImage
+        public: true
+        arguments:
+            - '@netgen_remote_media.provider'
+            - '@netgen_remote_media.service.remote_resource_service'
+        calls:
+            - [setContainer, ['@service_container']]
+
     netgen_remote_media.controller.callback.cloudinary.notify:
         class: Netgen\Bundle\RemoteMediaBundle\Controller\Callback\Cloudinary\Notify
         public: true
@@ -43,3 +86,13 @@ services:
             - '@event_dispatcher'
         calls:
             - [setContainer, ['@service_container']]
+
+    netgen_remote_media.controller.configuration:
+        class: Netgen\Bundle\RemoteMediaBundle\Controller\Configuration
+        public: true
+        arguments:
+            - '@router'
+            - '@translator'
+            - '@netgen_remote_media.resolver.variation'
+        calls:
+            - [setContainer, ['@service_container']]
diff --git a/bundle/Resources/config/services/form.yaml b/bundle/Resources/config/services/form.yaml
index f53b1ef6..58b7b837 100644
--- a/bundle/Resources/config/services/form.yaml
+++ b/bundle/Resources/config/services/form.yaml
@@ -3,6 +3,7 @@ services:
         class: Netgen\RemoteMedia\Form\DataTransformer\RemoteMediaTransformer
         arguments:
             - "@netgen_remote_media.provider"
+            - "@netgen_remote_media.service.remote_resource_service"
 
     netgen_remote_media.form.type.remote_media:
         class: Netgen\RemoteMedia\Form\Type\RemoteMediaType
diff --git a/bundle/Resources/config/services/services.yaml b/bundle/Resources/config/services/services.yaml
new file mode 100644
index 00000000..c31cd19b
--- /dev/null
+++ b/bundle/Resources/config/services/services.yaml
@@ -0,0 +1,7 @@
+services:
+  netgen_remote_media.service.remote_resource_service:
+    class: Netgen\RemoteMedia\Service\RemoteResourceService
+    public: false
+    arguments:
+      - '@netgen_remote_media.provider'
+
diff --git a/bundle/Resources/config/templates.yaml b/bundle/Resources/config/templates.yaml
new file mode 100644
index 00000000..71fc04fb
--- /dev/null
+++ b/bundle/Resources/config/templates.yaml
@@ -0,0 +1,2 @@
+parameters:
+    netgen_remote_media.templates.view_resource: '@@NetgenRemoteMedia/app/view_resource.html.twig'
diff --git a/bundle/Resources/public/css/ckeditor-plugin/style.scss b/bundle/Resources/public/css/ckeditor-plugin/style.scss
new file mode 100644
index 00000000..bc2084c5
--- /dev/null
+++ b/bundle/Resources/public/css/ckeditor-plugin/style.scss
@@ -0,0 +1,4 @@
+.ngremotemedia-wrapper {
+    border: 1px solid black;
+    padding: 8px;
+}
\ No newline at end of file
diff --git a/bundle/Resources/public/css/remotemedia.css b/bundle/Resources/public/css/remotemedia.css
index 36de3cf5..b8390e04 100644
--- a/bundle/Resources/public/css/remotemedia.css
+++ b/bundle/Resources/public/css/remotemedia.css
@@ -1 +1 @@
-@import url(https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css);@font-face{font-family:ngri;src:url("data:application/x-font-ttf;charset=utf-8;base64,AAEAAAALAIAAAwAwT1MvMg8SBeYAAAC8AAAAYGNtYXAXVtKMAAABHAAAAFRnYXNwAAAAEAAAAXAAAAAIZ2x5ZizrtTkAAAF4AAAO7GhlYWQPi42rAAAQZAAAADZoaGVhB8IDywAAEJwAAAAkaG10eB4AAFAAABDAAAAAKGxvY2EU0g5yAAAQ6AAAABZtYXhwAA8EiQAAEQAAAAAgbmFtZXBI7ewAABEgAAABYnBvc3QAAwAAAAAShAAAACAAAwO3AZAABQAAApkCzAAAAI8CmQLMAAAB6wAzAQkAAAAAAAAAAAAAAAAAAAABEAAAAAAAAAAAAAAAAAAAAABAAADpBQPA/8AAQAPAAEAAAAABAAAAAAAAAAAAAAAgAAAAAAADAAAAAwAAABwAAQADAAAAHAADAAEAAAAcAAQAOAAAAAoACAACAAIAAQAg6QX//f//AAAAAAAg6QD//f//AAH/4xcEAAMAAQAAAAAAAAAAAAAAAQAB//8ADwABAAAAAAAAAAAAAgAANzkBAAAAAAEAAAAAAAAAAAACAAA3OQEAAAAAAQAAAAAAAAAAAAIAADc5AQAAAAAEAA7/wAPyA8AAAwAVACEALwAACQEhATUiBgcBBhYzITI2JzEBLgEjMRMUBiMiJjU0NjMyFiciJj0BNDYzMhYdARQGAgABrfymAa0RHw3+SxklMwNmMyUZ/ksNHxFAJRsbJSUbGyVAGyUlGxslJQNj/KkDV10WF/yZLEBALANnFxb8wBslJRsbJSVlJRvAGyUlG8AbJQAAAAIAAP/ABAADwAJEBIYAABMxOAExFBYVFhQVFBYVFBYVHgEXHgEXHgEXHgEXFhQXFBYXHgEXFBYVFBYVHgEXHgEXHgEXHgEXHgEVHgEXHgEXHgEXHgEXHgEXHgEXHgEXHgEXHgEXHgEXMhYXMhYzHgEXHgEXHgEzHgEzHgEzHgEXMhYzMhYzMDIzHgEzMhYzOgEzFjIzFjIzMjAxHgEzMDIzMTgBMTI2MzYyMzI2MzI2Mz4BNz4BNz4BNz4BNzYyNzI2Nz4BNzI2MTI2Mz4BNz4BNz4BNz4BNz4BMz4BNz4BNz4BNz4BNz4BNz4BNz4BNz4BNz4BNz4BNz4BNzQ2NT4BNz4BNzQ2NzQ2NT4BNzQ2NTQ2NTY0NTA0NT4BNTQ2NTwBNTY0NTY0NTwBMTI2NTA0NTE4ATE0JjUmNDU0JjU0JjUuAScuAScuAScuAScmNCc0JicuASc0JjU0JjUuAScuAScuAScuAScuATUuAScuAScuAScuAScuAScuAScuAScuAScuAScuASciJiciJiMuAScuAScuASMuASMuASMuASciJiMiJiMwIiMuASMiJiMqASMmIiMmIiMqASM0JiMwIiMxOAExIgYjBiIjIgYjIgYjDgEHDgEHDgEHDgEHBiIHIgYHDgEHIgYjIgYjDgEHDgEHDgEHDgEHDgEjDgEHDgEHDgEHDgEHDgEHDgEHDgEHDgEHDgEHDgEHFAYHFAYVDgEHDgEHDgEVDgEVDgEVDgEHFAYVFAYVMBQVDgEVFAYVHAEVBhQVBhQVHAExDgEVMBQVNzA0MTQ2NT4BNzQ2NzQ2NT4BNzQ2MTQ2NT4BNz4BNz4BNzQ2NT4BNT4BNz4BNz4BNz4BNz4BNz4BNz4BNz4BNz4BNz4BNz4BNzI2Mz4BNz4BNzI2MzYyNzI2Mz4BMzYyMzYyMzAyMTYyNzoBMzoBNzoBMzI2MzoBMzoBMzoBMxYyMzoBMxYyMzAyMTIwOQE+ATcyMBcyFhceARcyFhcyFjMeARcyFjEyFjMeATMeARceARceATMeARceARceARcyFhceARceARceARceARceARceARceARceARcUFhUeARceARcUFhUWFBcUFhUeARUWFBUyFDEcATEWFBccARUcARccARUUFhUcARUcARUcARUGFBUcARUGFBUwFDEwFDkBHgEXMBQxDgEHDgEHFAYVDgEVDgEHFAYxFAYVDgEVDgEHDgEHDgEHDgEHDgEHDgEHDgEHDgEHDgEHDgEHDgEHDgEHDgEHDgEHDgEHIgYjDgEHDgEHIgYjBiIHIgYjDgEjBiIjFCIxKgEjBiIHKgEjKgEHKgEjIgYjKgEjKgEjKgEjJiIjKgEjJiIjMCIxMCI5AQ4BByImJy4BJyImJyImIy4BJyImMSImIy4BIy4BJy4BJy4BIy4BJy4BJy4BJyImJy4BJy4BJy4BJy4BJy4BJy4BJy4BJy4BJzQmNS4BJy4BJzQmNSY0JzQmNS4BNSY0NSI0MTwBMSY0JzwBNTwBJzwBNTQmNTwBNTwBNTwBNTY0NTwBNTY0NTA0MTA0OQEuAScAAQEBAQEBAQECAQEBAQEBAQEBAQEBAgEBAQEBAQEDAQEDAgEBAQECAgQCAQQCAQIBAQMBAgQDCRUMDBkODR0ODx4PAwgEAQQCAgMCBAcEAwgDAgMCAgMCBAYEAwcDAgMBAQIBAgEDBgMCAgIBAwIDBQMDBQIBASUaAQEDBgICAgIBBAECBAIFCQUFCwUDBgMCBgQBAwIBAwIDBwMBAgECAQEEAQQHAwQHAwIDAgIDAgQHBAMHBAIDAgIDAgQHBA4cDQ0ZCwwUCgkPBwEDAgEBAQICAgEBAwEBAQEBAgECAQEBAQEBARslAQEBAQEBAQECAQEBAQEBAQEBAQEBAgEBAQEBAQEDAQEDAgEBAQECAgQCAQQCAQIBAQMBAgQDCRUMDBkODR0ODx4PAwgEAQQCAgMCBAcEAwgDAgMCAgMCBAYEAwcDAgMBAQIBAgEDBgMCAgIBAwIDBQMDBQIBAQEmGgEBAwUDAQMCAQMCAgQCBAoFBQoGAwUDAwYDAgMCAQMCAwcDAQEBAQIBAQQBBAYEAwcEAgMCAgMCBAcDBAcEAgMCAgMCBAcDDxsODRkLDBQJCRAHAQMCAgECAQMBAQIBAQEBAQECAQEBAQEBAQEBARokSgIBAQEBAQEBAgEBAQEBAQECAQEDAgIBAgIDAgEEAgEBAQECAQIEAggTCgsWDAwZDQwaDQQGAwIDAgEDAgMGBAMGAwIDAQIDAQMGAwMFAwICAgEBAQIDBQMBAwEBAwECBQMCBAMECAQEBgMBAwECAwECAwEDBQIBARcjAwEBAgUDAgYCAgICAQMBAwYCAQIBAQECAwEDBgMDBgMCAwECAwEDBwMDBgMCAwECAwIDBgMMGAwLFQoKEQgIDQUCAgEBAQECAQIBAQIBAQEBAgEBAQEBAQEBAQEBHhYBAQEBAQEBAQEBAgEBAQEBAQMBAQMBAQEBAQEBAgMBAgQBAQIBAQIBAgQCCBMKCxYMDBkMDRoNAwcDAgMBAgMCAwYDBAYDAQMCAQMCAwYDAwUDAgICAgEBAQMFAwEDAQEDAQIFAgMEAwQIBAMHAwEDAQIDAQIDAQIFAwEBFyIEAgUDAgYCAgICAQMBAwYCAQIBAQECAwEDBgMDBgMCAwECAwEDBwMDBgMCAwECAwIDBgMMGAwLFQoKEQgIDQUCAgEBAQECAQIBAQIBAQEBAgEBAQEBAQEBAQEBHxYBvgMFAwICAgEDAgIEAgUJBQUKBgMGAgMGAwIDAgEDAgMHAwEBAQECAQEEAQQHAwMHBAIDAgIDAgQHAwQHBAIDAgIDAgQHBA4cDQ0ZCwwUCgkPBwEDAgIBAgICAQECAQEBAQEBAgEBAQEBAQEBAQEaJQEBAQEBAQEBAgEBAQEBAQEBAQEBAQIBAQEBAQEBAwEBAwIBAQEBAgIEAgEEAgECAQEDAQIEAwkVDAwZDg0dDg8eDwMIBAEEAgIDAgQHBAMIAwIDAgIDAgQGBAMHAwIDAQECAQIBAwYDAgICAQMCAwUDAwUCAQEmGgEBAwUDAgICAQMCAgQCBQkFBQoGAwYCAwYDAgMCAQMCAwcDAQEBAQIBAQQBBAcDAwcEAgMCAgMCBAcDBAcEAgMCAgMCBAcEDhwNDRkLDBQKCQ8HAQMCAgECAgIBAQIBAQEBAQECAQEBAQEBAQEBARolAQEBAQEBAQECAQEBAQEBAQEBAQEBAgEBAQEBAQEDAQEDAgEBAQECAgQCAQQCAQIBAQMBAgQDCRUMDBkODR0ODx4PAwgEAQQCAgMCBAcEAwgDAgMCAgMCBAYEAwcDAgMBAQIBAgEDBgMCAgIBAwIDBQMDBQIBAQElGgEBQQECBQMCBgICAgIBAwEDBgIBAgEBAQIDAQMGAwMGAwIDAQIDAQMHAwMGAwIDAQIDAgMGAwwYDAsVCgoRCAgNBQICAQEBAQIBAgEBAgEBAQECAQEBAQEBAQEBAQEeFwEBAQEBAQEBAQECAQEBAQECAgEBAwEBAgEBAQIDAgEEAgIBAQIBAgQCCBMKCxYMDBkNDBoNBAYDAgMCAQMCAwYEAwYDAQMCAQMCAwYDAwUDAgICAgECAwUDAQMBAQMBAgUDAgQDBAgEAwcDAQMBAgMBAgMBAgUDAQEXIgQBAgUDAgYCAgICAQMBAwYCAQIBAQECAwEDBgMDBgMCAwECAwEDBwMDBgMCAwECAwIDBgMMGAwLFQoKEQgIDQUCAgEBAQECAQIBAQIBAQEBAgEBAQEBAQEBAQEBHhYBAQEBAQEBAQECAQEBAQECAgEBAwEBAgEBAQIDAgEEAgIBAQIBAgQCCBMKCxYMDBkNDBoNBAYDAgMCAQMCAwYDBAYDAQMCAQMCAwYDAwUDAgICAgECAwUDAQMBAQMBAgUDAgQDBAgEAwcDAQMBAgMBAgMBAgUDAQEXIwMAAAAAAQAC/8ID/gO+AFMAACU4ATEJATgBMT4BNzYmLwEuAQcOAQc4ATEJATgBMS4BJyYGDwEOARceARc4ATEJATgBMQ4BBwYWHwEeATc+ATc4ATEJATgBMR4BFxY2PwE+AScuAQP3/skBNwIEAQMDB5MHEgkDBgL+yf7JAgYDCRIHkwcDAwEEAgE3/skCBAEDAweTBxIJAwYCATcBNwIGAwkSB5MHAwMBBIkBNwE3AgYDCRIHkwcDAwEEAv7JATcCBAEDAweTBxIJAwYC/sn+yQIGAwkSB5MHAwMBBAIBN/7JAgQBAwMHkwcSCQMGAAABAAAAgAQAAsAAKgAAATQmJyYnLgEnJiMiBgcuASMiBhUUFhUuASMiBw4BBwYVFBceARcWMyEyNgQATDkBExNBKyoxOWEhEjcgOE4BCBEJKCQjNQ8PDw81IyQoApBIZgEuPl4OMCorPxISMSoYHE43BQoEAQIQDzQkIygoJCM1Dw9mAAAEAAAAQAQAA0AACwAXACsALwAAATQ2MzIWFRQGIyImJTQ2MzIWFRQGIyImBTU0JiMhIgYVERQWMyEyNj0BBREBITUhAYBeQkJeXkJCXv6AXkJCXl5CQl4DACYa/YAaJiYaAoAaJgEA/oD+AAIAAqBCXl5CQl5eQkJeXkJCXl7+YBomJhr+wBomJhpgoAHA/sDAAAAAAgBA/8ADwAPAABQAJgAAAREhIiY1NDYzIREhIgYVERQWMyERATE4ATEiBhUUFjM4ATkBITUhA4D9YCg4OCgCYP2ANUtLNQMA/SANExMNAmD9oANA/MA4KCg4AwBLNf0ANUsDgP1AEw0NE0AAAQAAAAEAACKXau1fDzz1AAsEAAAAAADWNiSXAAAAANY2JJcAAP/ABAADwAAAAAgAAgAAAAAAAAABAAADwP/AAAAEAAAAAAAEAAABAAAAAAAAAAAAAAAAAAAACgQAAAAAAAAAAAAAAAIAAAAEAAAOBAAAAAQAAAIEAAAABAAAAAQAAEAAAAAAAAoAFAAeAGoGPga0BvYHQAd2AAAAAQAAAAoEhwAEAAAAAAACAAAAAAAAAAAAAAAAAAAAAAAAAA4ArgABAAAAAAABAAQAAAABAAAAAAACAAcARQABAAAAAAADAAQALQABAAAAAAAEAAQAWgABAAAAAAAFAAsADAABAAAAAAAGAAQAOQABAAAAAAAKABoAZgADAAEECQABAAgABAADAAEECQACAA4ATAADAAEECQADAAgAMQADAAEECQAEAAgAXgADAAEECQAFABYAFwADAAEECQAGAAgAPQADAAEECQAKADQAgG5ncmkAbgBnAHIAaVZlcnNpb24gMS4wAFYAZQByAHMAaQBvAG4AIAAxAC4AMG5ncmkAbgBnAHIAaW5ncmkAbgBnAHIAaVJlZ3VsYXIAUgBlAGcAdQBsAGEAcm5ncmkAbgBnAHIAaUZvbnQgZ2VuZXJhdGVkIGJ5IEljb01vb24uAEYAbwBuAHQAIABnAGUAbgBlAHIAYQB0AGUAZAAgAGIAeQAgAEkAYwBvAE0AbwBvAG4ALgAAAAMAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA=") format("truetype");font-weight:400;font-style:normal}@font-face{font-family:fa-ngrm;src:url(../fonts/fa-ngrm.eot);src:url(../fonts/fa-ngrm.eot#iefix) format("embedded-opentype"),url(data:font/woff2;base64,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) format("woff2"),url(data:font/woff;base64,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) format("woff"),url(../fonts/fa-ngrm.ttf) format("truetype"),url(../img/fa-ngrm.svg#fa-ngrm) format("svg");font-weight:400;font-style:normal}[class*=" ngrm-icon-"]:before,[class^=ngrm-icon-]:before{font-family:fa-ngrm;font-style:normal;font-weight:400;speak:none;display:inline-block;text-decoration:inherit;width:1em;margin-right:.2em;text-align:center;font-variant:normal;text-transform:none;line-height:1em;margin-left:.2em;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.ngrm-icon-cancel:before{content:"\E800"}.ngrm-icon-floppy:before{content:"\E801"}.ngrm-icon-ok:before{content:"\E802"}.ngrm-icon-ccw:before{content:"\E803"}.ngrm-icon-folder:before{content:"\E804"}.ngrm-icon-upload:before{content:"\E805"}.ngrm-icon-play:before{content:"\E811"}.ngrm-icon-trash:before{content:"\F1F8"}.ngrm-icon-file-archive-o:before{content:"\F1C6"}.v-select{position:relative;font-family:inherit}.v-select,.v-select *{-webkit-box-sizing:border-box;box-sizing:border-box}@-webkit-keyframes vSelectSpinner{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes vSelectSpinner{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}.vs__fade-enter-active,.vs__fade-leave-active{-webkit-transition:opacity .15s cubic-bezier(1,.5,.8,1);transition:opacity .15s cubic-bezier(1,.5,.8,1)}.vs__fade-enter,.vs__fade-leave-to{opacity:0}.vs--disabled .vs__clear,.vs--disabled .vs__dropdown-toggle,.vs--disabled .vs__open-indicator,.vs--disabled .vs__search,.vs--disabled .vs__selected{cursor:not-allowed;background-color:#f8f8f8}.v-select[dir=rtl] .vs__actions{padding:0 3px 0 6px}.v-select[dir=rtl] .vs__clear{margin-left:6px;margin-right:0}.v-select[dir=rtl] .vs__deselect{margin-left:0;margin-right:2px}.v-select[dir=rtl] .vs__dropdown-menu{text-align:right}.vs__dropdown-toggle{-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:0 0 4px 0;background:none;border:1px solid rgba(60,60,60,.26);border-radius:4px;white-space:normal}.vs__dropdown-toggle,.vs__selected-options{display:-webkit-box;display:-ms-flexbox;display:flex}.vs__selected-options{-ms-flex-preferred-size:100%;flex-basis:100%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-ms-flex-wrap:wrap;flex-wrap:wrap;padding:0 2px;position:relative}.vs__actions{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding:4px 6px 0 3px}.vs--searchable .vs__dropdown-toggle{cursor:text}.vs--unsearchable .vs__dropdown-toggle{cursor:pointer}.vs--open .vs__dropdown-toggle{border-bottom-color:transparent;border-bottom-left-radius:0;border-bottom-right-radius:0}.vs__open-indicator{fill:rgba(60,60,60,.5);-webkit-transform:scale(1);transform:scale(1);-webkit-transition:-webkit-transform .15s cubic-bezier(1,-.115,.975,.855);transition:-webkit-transform .15s cubic-bezier(1,-.115,.975,.855);transition:transform .15s cubic-bezier(1,-.115,.975,.855);transition:transform .15s cubic-bezier(1,-.115,.975,.855),-webkit-transform .15s cubic-bezier(1,-.115,.975,.855);-webkit-transition-timing-function:cubic-bezier(1,-.115,.975,.855);transition-timing-function:cubic-bezier(1,-.115,.975,.855)}.vs--open .vs__open-indicator{-webkit-transform:rotate(180deg) scale(1);transform:rotate(180deg) scale(1)}.vs--loading .vs__open-indicator{opacity:0}.vs__clear{fill:rgba(60,60,60,.5);padding:0;border:0;background-color:transparent;cursor:pointer;margin-right:8px}.vs__dropdown-menu{display:block;position:absolute;top:calc(100% - 1px);left:0;z-index:1000;padding:5px 0;margin:0;width:100%;max-height:350px;min-width:160px;overflow-y:auto;-webkit-box-shadow:0 3px 6px 0 rgba(0,0,0,.15);box-shadow:0 3px 6px 0 rgba(0,0,0,.15);border:1px solid rgba(60,60,60,.26);border-top-style:none;border-radius:0 0 4px 4px;text-align:left;list-style:none;background:#fff}.vs__no-options{text-align:center}.vs__dropdown-option{line-height:1.42857143;display:block;padding:3px 20px;clear:both;color:#333;white-space:nowrap}.vs__dropdown-option:hover{cursor:pointer}.vs__dropdown-option--highlight{background:#5897fb;color:#fff}.vs__selected{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:#f0f0f0;border:1px solid rgba(60,60,60,.26);border-radius:4px;color:#333;line-height:1.4;margin:4px 2px 0 2px;padding:0 .25em}.vs__deselect{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-appearance:none;-moz-appearance:none;appearance:none;margin-left:4px;padding:0;border:0;cursor:pointer;background:none;fill:rgba(60,60,60,.5);text-shadow:0 1px 0 #fff}.vs--single .vs__selected{background-color:transparent;border-color:transparent}.vs--single.vs--open .vs__selected{position:absolute;opacity:.4}.vs--single.vs--searching .vs__selected{display:none}.vs__search::-ms-clear,.vs__search::-webkit-search-cancel-button,.vs__search::-webkit-search-decoration,.vs__search::-webkit-search-results-button,.vs__search::-webkit-search-results-decoration{display:none}.vs__search,.vs__search:focus{-webkit-appearance:none;-moz-appearance:none;appearance:none;line-height:1.4;font-size:1em;border:1px solid transparent;border-left:none;outline:none;margin:4px 0 0 0;padding:0 7px;background:none;-webkit-box-shadow:none;box-shadow:none;width:0;max-width:100%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}.vs__search::-webkit-input-placeholder{color:inherit}.vs__search::-moz-placeholder{color:inherit}.vs__search:-ms-input-placeholder{color:inherit}.vs__search::-ms-input-placeholder{color:inherit}.vs__search::placeholder{color:inherit}.vs--unsearchable .vs__search{opacity:1}.vs--unsearchable .vs__search:hover{cursor:pointer}.vs--single.vs--searching:not(.vs--open):not(.vs--loading) .vs__search{opacity:.2}.vs__spinner{-ms-flex-item-align:center;align-self:center;opacity:0;font-size:5px;text-indent:-9999em;overflow:hidden;border-top:.9em solid hsla(0,0%,39.2%,.1);border-right:.9em solid hsla(0,0%,39.2%,.1);border-bottom:.9em solid hsla(0,0%,39.2%,.1);border-left:.9em solid rgba(60,60,60,.45);-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-animation:vSelectSpinner 1.1s linear infinite;animation:vSelectSpinner 1.1s linear infinite;-webkit-transition:opacity .1s;transition:opacity .1s}.vs__spinner,.vs__spinner:after{border-radius:50%;width:5em;height:5em}.vs--loading .vs__spinner{opacity:1}.ngremotemedia-select-folder-container,.ngrm-model-portal+form,.ngrm-model-portal .ngrm-overlay{-webkit-box-sizing:border-box;box-sizing:border-box;font-family:Roboto,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:#333}.ngremotemedia-select-folder-container *,.ngremotemedia-select-folder-container :after,.ngremotemedia-select-folder-container :before,.ngrm-model-portal+form *,.ngrm-model-portal+form :after,.ngrm-model-portal+form :before,.ngrm-model-portal .ngrm-overlay *,.ngrm-model-portal .ngrm-overlay :after,.ngrm-model-portal .ngrm-overlay :before{-webkit-box-sizing:inherit;box-sizing:inherit}.ngremotemedia-select-folder-container .btn,.ngrm-model-portal+form .btn,.ngrm-model-portal .ngrm-overlay .btn{border-radius:4px;text-align:center;font-size:14px;line-height:18px;color:#fff;padding:8px 16px;border:1px solid #e4e4e4;background:#fff;color:#333}.ngremotemedia-select-folder-container .btn:active,.ngrm-model-portal+form .btn:active,.ngrm-model-portal .ngrm-overlay .btn:active{background:#d7d7d7}.ngremotemedia-select-folder-container .btn.btn-blue,.ngrm-model-portal+form .btn.btn-blue,.ngrm-model-portal .ngrm-overlay .btn.btn-blue{background:#009ac7;border:0;color:#fff}.ngremotemedia-select-folder-container .btn.btn-blue:active,.ngrm-model-portal+form .btn.btn-blue:active,.ngrm-model-portal .ngrm-overlay .btn.btn-blue:active{background:#007394}.ngremotemedia-select-folder-container .v-select,.ngrm-model-portal+form .v-select,.ngrm-model-portal .ngrm-overlay .v-select{font-size:14px;line-height:16px;background-color:#fff}.ngremotemedia-select-folder-container .v-select .vs__dropdown-toggle,.ngrm-model-portal+form .v-select .vs__dropdown-toggle,.ngrm-model-portal .ngrm-overlay .v-select .vs__dropdown-toggle{border-radius:0;border:1px solid #e4e4e4;padding:3px 5px 6px}.ngremotemedia-select-folder-container .v-select input::-webkit-input-placeholder,.ngrm-model-portal+form .v-select input::-webkit-input-placeholder,.ngrm-model-portal .ngrm-overlay .v-select input::-webkit-input-placeholder{color:#333;font-style:italic}.ngremotemedia-select-folder-container .v-select input::-moz-placeholder,.ngrm-model-portal+form .v-select input::-moz-placeholder,.ngrm-model-portal .ngrm-overlay .v-select input::-moz-placeholder{color:#333;font-style:italic}.ngremotemedia-select-folder-container .v-select input:-ms-input-placeholder,.ngrm-model-portal+form .v-select input:-ms-input-placeholder,.ngrm-model-portal .ngrm-overlay .v-select input:-ms-input-placeholder{color:#333;font-style:italic}.ngremotemedia-select-folder-container .v-select input::-ms-input-placeholder,.ngrm-model-portal+form .v-select input::-ms-input-placeholder,.ngrm-model-portal .ngrm-overlay .v-select input::-ms-input-placeholder{color:#333;font-style:italic}.ngremotemedia-select-folder-container .v-select input::placeholder,.ngrm-model-portal+form .v-select input::placeholder,.ngrm-model-portal .ngrm-overlay .v-select input::placeholder{color:#333;font-style:italic}.ngremotemedia-select-folder-container ::-webkit-input-placeholder,.ngrm-model-portal+form ::-webkit-input-placeholder,.ngrm-model-portal .ngrm-overlay ::-webkit-input-placeholder{color:#999}.ngremotemedia-select-folder-container :-ms-input-placeholder,.ngrm-model-portal+form :-ms-input-placeholder,.ngrm-model-portal .ngrm-overlay :-ms-input-placeholder{color:#999}.ngremotemedia-select-folder-container ::-moz-placeholder,.ngrm-model-portal+form ::-moz-placeholder,.ngrm-model-portal .ngrm-overlay ::-moz-placeholder{color:#999}.ngremotemedia-select-folder-container ::-ms-input-placeholder,.ngrm-model-portal+form ::-ms-input-placeholder,.ngrm-model-portal .ngrm-overlay ::-ms-input-placeholder{color:#999}.ngremotemedia-select-folder-container ::placeholder,.ngrm-model-portal+form ::placeholder,.ngrm-model-portal .ngrm-overlay ::placeholder{color:#999}.ngrm-model-portal .ngrm-overlay .ng-icon{font-size:4.5em;font-family:ngri;font-style:normal;font-weight:400;font-variant:normal;text-transform:none;text-align:center;line-height:80px;display:block;color:#333}.ngrm-model-portal .ngrm-overlay .ng-icon.big{font-size:64px;color:#333}.ngrm-model-portal .ngrm-overlay .ng-icon.ng-warning:before{content:"\E900"}.ngrm-model-portal .ngrm-overlay .ng-icon.ng-spinner:before{content:"\E901"}.ngrm-model-portal .ngrm-overlay .ng-icon.ng-close:before{content:"\E902"}.ngrm-model-portal .ngrm-overlay .ng-icon.ng-cloud:before{content:"\E903"}.ngrm-model-portal .ngrm-overlay .ng-icon.ng-video:before{content:"\E904"}.ngrm-model-portal .ngrm-overlay .ng-icon.ng-book:before{content:"\E905"}.ngrm-model-portal .ngrm-overlay .image-meta{overflow:visible}.ngrm-model-portal .ngrm-overlay .image-meta h3{font-weight:700}.ngrm-model-portal .ngrm-overlay .image-meta p{color:#737373}.ngrm-model-portal .ngrm-overlay .image-meta input.media-alttext,.ngrm-model-portal .ngrm-overlay .image-meta input.media-caption,.ngrm-model-portal .ngrm-overlay .image-meta input.media-watermarktext{width:100%;border-radius:0;border:1px solid #e4e4e4;padding:7px 10px 7px 10px;margin-bottom:10px}.ngrm-model-portal .ngrm-overlay .image-meta .image-meta-data{margin-top:20px}.ngrm-model-portal .ngrm-overlay .image-wrap:has(.icon-doc){position:relative;height:200px;max-width:400px;display:block;margin-bottom:4px}.ngrm-model-portal .ngrm-overlay .image-wrap:has(.icon-doc):before{position:absolute;content:""}.ngrm-model-portal .ngrm-overlay .image-wrap:has(.icon-doc):before{background-color:rgba(0,0,0,.7);top:0;bottom:0;left:0;right:0}.ngrm-model-portal .ngrm-overlay .image-wrap .icon-doc{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);color:#fff;font-size:70px}.ngrm-model-portal .ngrm-overlay .image-wrap img{max-width:100%}.ngrm-model-portal .ngrm-overlay .vue-treeselect{font-size:14px;line-height:16px}.ngrm-model-portal .ngrm-overlay .vue-treeselect .vue-treeselect__control{border-radius:0;border:1px solid #e4e4e4}.ngrm-model-portal .ngrm-overlay .vue-treeselect .vue-treeselect__placeholder{color:#333;font-style:italic}@-webkit-keyframes spinning{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes spinning{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}.ngremotemedia-buttons{margin-top:20px}.ngremotemedia-buttons .ngremotemedia-local-file-container{margin:10px 0 10px 0}.ngremotemedia-buttons .ngremotemedia-local-file.btn.upload-from-disk,.ngremotemedia-buttons input[type=button]{border-radius:4px;text-align:center;font-size:14px!important;line-height:18px;padding:8px 16px;border:1px solid #e4e4e4;background:#f1f4fa;cursor:pointer;color:#333;font-weight:400;font-family:Arial,Helvetica,sans-serif}.ngremotemedia-buttons .ngremotemedia-local-file.btn.upload-from-disk{background:#fff}.o2k7Skin .mceIcon.mce_ngremotemedia img{width:2rem}.ngremotemedia-image .image-wrap .file-placeholder[data-v-2db10e6e]{position:relative;max-width:500px;height:280px;display:block;margin-bottom:4px}.ngremotemedia-image .image-wrap .file-placeholder .icon-doc[data-v-2db10e6e]{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);color:#fff;font-size:40px}.ngremotemedia-image .image-wrap .file-placeholder[data-v-2db10e6e]:before{position:absolute;content:"";background-color:rgba(0,0,0,.7);top:0;bottom:0;left:0;right:0}.mediaFacets[data-v-278bb214]{width:362px;-ms-flex-negative:0;flex-shrink:0;-webkit-box-shadow:inset -1px 0 0 0 #e4e4e4;box-shadow:inset -1px 0 0 0 #e4e4e4}.mediaFacets .body[data-v-278bb214]{-webkit-box-shadow:inset 0 -1px 0 0 #e4e4e4,inset 0 1px 0 0 #e4e4e4,inset -1px 0 0 0 #e4e4e4;box-shadow:inset 0 -1px 0 0 #e4e4e4,inset 0 1px 0 0 #e4e4e4,inset -1px 0 0 0 #e4e4e4;background:#fff;padding:30px 15px}.mediaFacets .body .form-field+.form-field[data-v-278bb214]{margin-top:15px}.mediaFacets .body .form-field label[data-v-278bb214],.mediaFacets .body .search-wrapper .search-label[data-v-278bb214]{font-size:12px;font-weight:700;line-height:18px;color:#757575;margin-bottom:3px;display:block}.mediaFacets .body .search-wrapper[data-v-278bb214]{margin:30px 0 0}.mediaFacets .body .search-wrapper .search[data-v-278bb214]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin:5px 0}.mediaFacets .body .search-wrapper .search input[data-v-278bb214],.mediaFacets .body .search-wrapper .search ul[data-v-278bb214]{font-size:14px;line-height:16px}.mediaFacets .body .search-wrapper .search ul[data-v-278bb214]{margin:0;padding:5px;list-style:none;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;border:1px solid #e4e4e4;min-width:75px;display:none}.mediaFacets .body .search-wrapper .search ul li[data-v-278bb214]{cursor:auto;margin-right:10px;padding:4px 10px;min-width:45px}.mediaFacets .body .search-wrapper .search ul li[data-v-278bb214]:last-child,.mediaFacets .body .search-wrapper .search ul li[data-v-278bb214]:only-child{margin:0}.mediaFacets .body .search-wrapper .search ul li.active[data-v-278bb214]{background:#009ac7;color:#fff;border-radius:4px;-webkit-box-shadow:inset -1px 0 0 0 #d7d7d7,inset 1px 0 0 0 #d7d7d7,inset 0 1px 0 0 #d7d7d7,inset 0 -1px 0 0 #d7d7d7;box-shadow:inset -1px 0 0 0 #d7d7d7,inset 1px 0 0 0 #d7d7d7,inset 0 1px 0 0 #d7d7d7,inset 0 -1px 0 0 #d7d7d7}.mediaFacets .body .search-wrapper .search input[data-v-278bb214]{border:1px solid #e4e4e4;padding:9px 10px;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}.mediaFacets .ng-spinner[data-v-278bb214]{position:fixed;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.mediaFacets .ng-spinner[data-v-278bb214]:before{display:inline-block;-webkit-animation:spinning 1.5s linear infinite;animation:spinning 1.5s linear infinite}.media-gallery[data-v-5aa52c90]{position:relative;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}.media-gallery .items[data-v-5aa52c90]{padding:15px;overflow-y:auto;height:calc(100% - 50px)}.media-gallery .items.loading[data-v-5aa52c90]{opacity:.5}.media-gallery .items .media[data-v-5aa52c90]{width:190px;min-height:182px;max-height:190px;padding:8px;margin:0 15px 15px 0;background-color:#fff;display:inline-block}.media-gallery .items .media .media-container[data-v-5aa52c90]{width:100%}.media-gallery .items .media .img[data-v-5aa52c90]{display:block;margin-bottom:4px;-o-object-fit:cover;object-fit:cover;height:100px;width:100%;overflow:hidden;text-overflow:ellipsis}.media-gallery .items .media .file-placeholder[data-v-5aa52c90]{position:relative;height:95px;display:block;margin-bottom:4px}.media-gallery .items .media .file-placeholder .icon-doc[data-v-5aa52c90]{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);color:#fff;font-size:40px}.media-gallery .items .media .file-placeholder[data-v-5aa52c90]:before{position:absolute;content:"";background-color:rgba(0,0,0,.7);top:0;bottom:0;left:0;right:0}.media-gallery .items .media .filename[data-v-5aa52c90]{overflow:hidden;display:inline-block;text-overflow:ellipsis;white-space:nowrap;width:100%;text-align:center;font-size:16px;line-height:20px;margin-top:4px;margin-bottom:0}.media-gallery .items .media .size-description[data-v-5aa52c90]{font-size:12px;line-height:14px;text-align:center;color:#999}.media-gallery .items .media .size-description .format[data-v-5aa52c90]{text-transform:uppercase}.media-gallery .items .media.selected[data-v-5aa52c90]{border:1px solid #009ac7}.media-gallery .items .media .select-btn[data-v-5aa52c90]{margin-top:8px;padding:3px;width:100%}.media-gallery .folder-empty[data-v-5aa52c90]{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.media-gallery .folder-empty span[data-v-5aa52c90]{display:block;text-align:center;font-size:14px;line-height:16px}.media-gallery .folder-empty span.ngrm-icon-folder[data-v-5aa52c90]{color:#999;font-size:33px}.media-gallery .folder-empty span strong[data-v-5aa52c90]{display:block;margin:5px 0;font-size:16px;line-height:19px}.media-gallery .load-more-wrapper[data-v-5aa52c90]{padding:8px 15px;background-color:#fff;text-align:right;-webkit-box-shadow:inset 1px 0 0 0 #e4e4e4,0 -1px 0 0 #e4e4e4;box-shadow:inset 1px 0 0 0 #e4e4e4,0 -1px 0 0 #e4e4e4;position:absolute;bottom:0;left:0;right:0}.ngrm-overlay[data-v-9d33d07a]{position:fixed;top:0;bottom:0;left:0;right:0;background-color:rgba(0,0,0,.8);z-index:9999}.ngrm-overlay .media-modal[data-v-9d33d07a]{background-color:#f5f5f5;-webkit-box-shadow:0 5px 15px 0 rgba(0,0,0,.5);box-shadow:0 5px 15px 0 rgba(0,0,0,.5);margin:32px;height:calc(100vh - 64px)}.ngrm-overlay .media-modal .title[data-v-9d33d07a]{padding:15px;font-size:16px;font-weight:700;line-height:20px;color:#333;background:#fff;text-transform:uppercase;-webkit-box-shadow:inset 0 -1px 0 0 #e4e4e4;box-shadow:inset 0 -1px 0 0 #e4e4e4}.ngrm-overlay .media-modal .title .close[data-v-9d33d07a]{float:right;cursor:pointer;padding:2px 10px}.ngrm-overlay .media-modal .body[data-v-9d33d07a]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;position:relative;height:calc(100% - 50px)}.ngrm-overlay .img-placeholder img[data-v-9d33d07a]{height:100%}.ngremotemedia-buttons input[type=button]{margin-bottom:4px;margin-right:4px}.help-block.description{margin-right:6px}.btn,.sidebar-crop .buttons{font-size:14px!important;font-family:Arial,Helvetica,sans-serif}.ngremotemedia-tags .vs__selected-options input[type=search].vs__search{border:none}.ngremotemedia-tags select[hidden=hidden]{display:none}.ngremotemedia-image h3.title{word-break:break-word}.ngremotemedia-image .image-wrap img{max-width:100%}.input-file-name-wrapper{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.input-file-name-wrapper .v-select,.input-file-name-wrapper input[type=text]{margin-right:16px}.input-file-name-wrapper .v-select.vs--single.vs--searchable{margin-right:10px}.input-file-name-wrapper .v-select.vs--single.vs--searchable input.vs__search{background:transparent}.input-file-name-wrapper button.btn{margin-left:40%;font-size:14px!important;font-family:Arial}.input-file-name-wrapper .vs__dropdown-toggle{height:37px}.media-gallery .items .media{line-height:normal}.ng-spinner[data-v-751395c8]{position:fixed;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.ng-spinner[data-v-751395c8]:before{display:inline-block;-webkit-animation:spinning 1.5s linear infinite;animation:spinning 1.5s linear infinite}.sidebar-crop[data-v-ad171770]{width:264px;-ms-flex-negative:0;flex-shrink:0;-webkit-box-shadow:inset -1px 0 0 0 #e4e4e4;box-shadow:inset -1px 0 0 0 #e4e4e4}.sidebar-crop .buttons[data-v-ad171770]{background:#fff;padding:15px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-shadow:inset 0 -1px 0 0 #e4e4e4;box-shadow:inset 0 -1px 0 0 #e4e4e4;margin-right:1px}.sidebar-crop .buttons button[data-v-ad171770]{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}.sidebar-crop .buttons button.crop-btn-add[data-v-ad171770]{margin-left:10px}.sidebar-crop .buttons button[data-v-ad171770]:only-child{width:100%}.sidebar-crop-label span[data-v-ad171770]{color:#999;font-size:14px;line-height:18px;display:inline-block;padding:31px 15px 15px;width:100%;-webkit-box-shadow:inset 0 -1px 0 0 #e4e4e4;box-shadow:inset 0 -1px 0 0 #e4e4e4}.unselectedVariations[data-v-ad171770]{position:absolute;top:0;left:0;width:264px;height:100%;-webkit-transform:translateX(264px);transform:translateX(264px);background:#fff;-webkit-box-shadow:inset -1px 0 0 0 #e4e4e4;box-shadow:inset -1px 0 0 0 #e4e4e4;z-index:10}.unselectedVariations>div[data-v-ad171770]{padding:15px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;background-color:#fff;-webkit-box-shadow:inset 0 -1px 0 0 #e4e4e4,inset -1px 0 0 0 #e4e4e4;box-shadow:inset 0 -1px 0 0 #e4e4e4,inset -1px 0 0 0 #e4e4e4}.unselectedVariations>div input[data-v-ad171770],.unselectedVariations>div label[data-v-ad171770]{cursor:pointer}.unselectedVariations>div input[data-v-ad171770]{margin-right:11px}.unselectedVariations>div label[data-v-ad171770]{width:100%}.unselectedVariations>div .name[data-v-ad171770]{color:#333;font-size:14px;line-height:18px}.unselectedVariations>div .formatted-size[data-v-ad171770]{color:#999;font-size:12px;line-height:18px;display:block}.unselectedVariations>div.disabled[data-v-ad171770]{-ms-flex-wrap:wrap;flex-wrap:wrap;background-color:#f5f5f5;cursor:auto;color:#ddd;padding:15px 15px 5px}.unselectedVariations>div.disabled input[data-v-ad171770],.unselectedVariations>div.disabled label[data-v-ad171770],.unselectedVariations>div.disabled span[data-v-ad171770]{cursor:auto}.unselectedVariations>div.disabled label[data-v-ad171770]{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;width:auto;color:#999}.unselectedVariations .legend-not-selectable[data-v-ad171770]{width:100%;font-size:.75rem;color:#a41034;display:inline-block;text-align:right}.selectedVariations ul[data-v-ad171770]{list-style:none;padding:0;margin:0}.selectedVariations ul li[data-v-ad171770]{padding:15px 0 15px 15px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-shadow:inset -1px 0 0 0 #e4e4e4,inset 0 -1px 0 0 #e4e4e4;box-shadow:inset -1px 0 0 0 #e4e4e4,inset 0 -1px 0 0 #e4e4e4;background-color:#fff;cursor:pointer}.selectedVariations ul li.disabled[data-v-ad171770]{background-color:#f5f5f5;cursor:auto}.selectedVariations ul li.selected.set[data-v-ad171770]{color:#90ee90}.selectedVariations ul li span[data-v-ad171770]{display:block;color:#333;font-size:14px;line-height:18px}.selectedVariations ul li a[data-v-ad171770]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.selectedVariations ul li a span[data-v-ad171770]{padding:5px}.selectedVariations ul li a .ngrm-icon-trash[data-v-ad171770]{color:#009ac7;padding:10px}.selectedVariations ul li .formatted-size[data-v-ad171770]{color:#999;font-size:12px;line-height:18px}.selectedVariations ul li .circle-orange[data-v-ad171770]{width:8px;height:8px;background-color:orange;border-radius:50%}.selectedVariations .set .circle-orange[data-v-ad171770]{display:none}.crop .cropper[data-v-5f73791e]{position:relative;margin:0 auto}.crop .cropper button[data-v-5f73791e]{margin-left:8px}.crop .cropper .buttons[data-v-5f73791e]{position:absolute}.crop .preview[data-v-5f73791e]{width:100%;height:500px;overflow:hidden}.crop-container[data-v-45497070]{overflow-y:auto;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;margin:30px 30px 80px}.crop-container[data-v-45497070]:empty{display:none}.img-placeholder[data-v-45497070]{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:60px 60px 110px}.img-placeholder img[data-v-45497070]{max-width:100%;height:auto;margin:0 auto;display:block}.action-strip[data-v-45497070]{padding:8px 15px;background-color:#fff;text-align:right;-webkit-box-shadow:inset 1px 0 0 0 #e4e4e4,0 -1px 0 0 #e4e4e4;box-shadow:inset 1px 0 0 0 #e4e4e4,0 -1px 0 0 #e4e4e4;position:absolute;bottom:0;left:264px;right:0}.action-strip button[data-v-45497070]{margin-left:10px}.action-strip .ngrm-icon-floppy[data-v-45497070]{margin-right:5px}.folder-gallery[data-v-c53732c8]{position:relative;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;height:calc(100% - 50px);overflow-y:auto}.folder-gallery .items[data-v-c53732c8]{padding:15px}.folder-gallery .items.loading[data-v-c53732c8]{opacity:.5}.folder-gallery .items .breadcrumbs[data-v-c53732c8]{background-color:#fff;width:100%;margin-bottom:20px;padding:10px}.folder-gallery .items .breadcrumbs a[data-v-c53732c8]{color:#009ac7}.folder-gallery .items .info[data-v-c53732c8]{font-style:italic;margin-bottom:10px;margin-left:10px}.folder-gallery .items .media[data-v-c53732c8]{width:177px;min-height:182px;max-height:190px;padding:8px;margin:0 15px 15px 0;background-color:#fff;display:inline-block}.folder-gallery .items .media .media-container[data-v-c53732c8]{width:100%}.folder-gallery .items .media .img[data-v-c53732c8]{display:block;margin-bottom:4px;-o-object-fit:cover;object-fit:cover;height:92px;width:100%;overflow:hidden;text-overflow:ellipsis}.folder-gallery .items .media .file-placeholder[data-v-c53732c8]{position:relative;height:92px;display:block;margin-bottom:4px}.folder-gallery .items .media .file-placeholder .icon-doc[data-v-c53732c8]{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);color:#fff;font-size:40px}.folder-gallery .items .media .file-placeholder[data-v-c53732c8]:before{position:absolute;content:"";background-color:rgba(0,0,0,.7);top:0;bottom:0;left:0;right:0}.folder-gallery .items .media.new-folder input[data-v-c53732c8]{width:100%;margin-top:5px}.folder-gallery .items .media.new-folder .select-btn[data-v-c53732c8]{background:#2e8b57}.folder-gallery .items .media.new-folder .file-placeholder[data-v-c53732c8]:before{background-color:rgba(0,0,0,.2);top:0;bottom:0;left:0;right:0}.folder-gallery .items .media .filename[data-v-c53732c8]{overflow:hidden;display:inline-block;text-overflow:ellipsis;white-space:nowrap;width:100%;text-align:center;font-size:16px;line-height:20px;margin-top:4px;margin-bottom:0}.folder-gallery .items .media .size-description[data-v-c53732c8]{font-size:12px;line-height:14px;text-align:center;color:#999}.folder-gallery .items .media .size-description .format[data-v-c53732c8]{text-transform:uppercase}.folder-gallery .items .media.selected[data-v-c53732c8]{border:1px solid #009ac7}.folder-gallery .items .media .select-btn[data-v-c53732c8]{margin-top:10px;padding:3px;width:100%}.folder-gallery .folder-empty[data-v-c53732c8]{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.folder-gallery .folder-empty span[data-v-c53732c8]{display:block;text-align:center;font-size:14px;line-height:16px}.folder-gallery .folder-empty span.ngrm-icon-folder[data-v-c53732c8]{color:#999;font-size:33px}.folder-gallery .folder-empty span strong[data-v-c53732c8]{display:block;margin:5px 0;font-size:16px;line-height:19px}.folder-gallery .load-more-wrapper[data-v-c53732c8]{padding:8px 15px;background-color:#fff;text-align:right;-webkit-box-shadow:inset 1px 0 0 0 #e4e4e4,0 -1px 0 0 #e4e4e4;box-shadow:inset 1px 0 0 0 #e4e4e4,0 -1px 0 0 #e4e4e4;position:absolute;bottom:0;left:0;right:0}.ng-spinner[data-v-c53732c8]{position:fixed;vertical-align:center;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.ng-spinner[data-v-c53732c8]:before{display:inline-block;-webkit-animation:spinning 1.5s linear infinite;animation:spinning 1.5s linear infinite}.loading[data-v-2676fd5e]{opacity:.5}.input-file-name-wrapper[data-v-2676fd5e]{padding:8px 15px;background-color:#fff;-webkit-box-shadow:inset 1px 0 0 0 #e4e4e4,0 -1px 0 0 #e4e4e4;box-shadow:inset 1px 0 0 0 #e4e4e4,0 -1px 0 0 #e4e4e4;position:absolute;bottom:0;left:0;right:0}.input-file-name-wrapper input[type=text][data-v-2676fd5e]{width:40%;min-width:300px;border:1px solid #e4e4e4;padding:10px 10px;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;margin-right:10px}.input-file-name-wrapper input[type=text].error[data-v-2676fd5e]{border:1px solid red}.input-file-name-wrapper .v-select[data-v-2676fd5e]{width:15%;min-width:150px}.input-file-name-wrapper button[data-v-2676fd5e]{float:right}.input-file-name-wrapper div.error[data-v-2676fd5e]{color:red;margin-bottom:5px}.ng-spinner[data-v-2676fd5e]{position:fixed;vertical-align:middle;margin-top:15%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.ng-spinner[data-v-2676fd5e]:before{display:inline-block;-webkit-animation:spinning 1.5s linear infinite;animation:spinning 1.5s linear infinite}
\ No newline at end of file
+@import url(https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css);@font-face{font-family:ngri;src:url("data:application/x-font-ttf;charset=utf-8;base64,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AQECAgQCAQQCAQIBAQMBAgQDCRUMDBkODR0ODx4PAwgEAQQCAgMCBAcEAwgDAgMCAgMCBAYEAwcDAgMBAQIBAgEDBgMCAgIBAwIDBQMDBQIBASUaAQEDBgICAgIBBAECBAIFCQUFCwUDBgMCBgQBAwIBAwIDBwMBAgECAQEEAQQHAwQHAwIDAgIDAgQHBAMHBAIDAgIDAgQHBA4cDQ0ZCwwUCgkPBwEDAgEBAQICAgEBAwEBAQEBAgECAQEBAQEBARslAQEBAQEBAQECAQEBAQEBAQEBAQEBAgEBAQEBAQEDAQEDAgEBAQECAgQCAQQCAQIBAQMBAgQDCRUMDBkODR0ODx4PAwgEAQQCAgMCBAcEAwgDAgMCAgMCBAYEAwcDAgMBAQIBAgEDBgMCAgIBAwIDBQMDBQIBAQEmGgEBAwUDAQMCAQMCAgQCBAoFBQoGAwUDAwYDAgMCAQMCAwcDAQEBAQIBAQQBBAYEAwcEAgMCAgMCBAcDBAcEAgMCAgMCBAcDDxsODRkLDBQJCRAHAQMCAgECAQMBAQIBAQEBAQECAQEBAQEBAQEBARokSgIBAQEBAQEBAgEBAQEBAQECAQEDAgIBAgIDAgEEAgEBAQECAQIEAggTCgsWDAwZDQwaDQQGAwIDAgEDAgMGBAMGAwIDAQIDAQMGAwMFAwICAgEBAQIDBQMBAwEBAwECBQMCBAMECAQEBgMBAwECAwECAwEDBQIBARcjAwEBAgUDAgYCAgICAQMBAwYCAQIBAQECAwEDBgMDBgMCAwECAwEDBwMDBgMCAwECAwIDBgMMGAwLFQoKEQgIDQUCAgEBAQECAQIBAQIBAQEBAgEBAQEBAQEBAQEBHhYBAQEBAQEBAQEBAgEBAQEBAQMBAQMBAQEBAQEBAgMBAgQBAQIBAQIBAgQCCBMKCxYMDBkMDRoNAwcDAgMBAgMCAwYDBAYDAQMCAQMCAwYDAwUDAgICAgEBAQMFAwEDAQEDAQIFAgMEAwQIBAMHAwEDAQIDAQIDAQIFAwEBFyIEAgUDAgYCAgICAQMBAwYCAQIBAQECAwEDBgMDBgMCAwECAwEDBwMDBgMCAwECAwIDBgMMGAwLFQoKEQgIDQUCAgEBAQECAQIBAQIBAQEBAgEBAQEBAQEBAQEBHxYBvgMFAwICAgEDAgIEAgUJBQUKBgMGAgMGAwIDAgEDAgMHAwEBAQECAQEEAQQHAwMHBAIDAgIDAgQHAwQHBAIDAgIDAgQHBA4cDQ0ZCwwUCgkPBwEDAgIBAgICAQECAQEBAQEBAgEBAQEBAQEBAQEaJQEBAQEBAQEBAgEBAQEBAQEBAQEBAQIBAQEBAQEBAwEBAwIBAQEBAgIEAgEEAgECAQEDAQIEAwkVDAwZDg0dDg8eDwMIBAEEAgIDAgQHBAMIAwIDAgIDAgQGBAMHAwIDAQECAQIBAwYDAgICAQMCAwUDAwUCAQEmGgEBAwUDAgICAQMCAgQCBQkFBQoGAwYCAwYDAgMCAQMCAwcDAQEBAQIBAQQBBAcDAwcEAgMCAgMCBAcDBAcEAgMCAgMCBAcEDhwNDRkLDBQKCQ8HAQMCAgECAgIBAQIBAQEBAQECAQEBAQEBAQEBARolAQEBAQEBAQECAQEBAQEBAQEBAQEBAgEBAQEBAQEDAQEDAgEBAQECAgQCAQQCAQIBAQMBAgQDCRUMDBkODR0ODx4PAwgEAQQCAgMCBAcEAwgDAgMCAgMCBAYEAwcDAgMBAQIBAgEDBgMCAgIBAwIDBQMDBQIBAQElGgEBQQECBQMCBgICAgIBAwEDBgIBAgEBAQIDAQMGAwMGAwIDAQIDAQMHAwMGAwIDAQIDAgMGAwwYDAsVCgoRCAgNBQICAQEBAQIBAgEBAgEBAQECAQEBAQEBAQEBAQEeFwEBAQEBAQEBAQECAQEBAQECAgEBAwEBAgEBAQIDAgEEAgIBAQIBAgQCCBMKCxYMDBkNDBoNBAYDAgMCAQMCAwYEAwYDAQMCAQMCAwYDAwUDAgICAgECAwUDAQMBAQMBAgUDAgQDBAgEAwcDAQMBAgMBAgMBAgUDAQEXIgQBAgUDAgYCAgICAQMBAwYCAQIBAQECAwEDBgMDBgMCAwECAwEDBwMDBgMCAwECAwIDBgMMGAwLFQoKEQgIDQUCAgEBAQECAQIBAQIBAQEBAgEBAQEBAQEBAQEBHhYBAQEBAQEBAQECAQEBAQECAgEBAwEBAgEBAQIDAgEEAgIBAQIBAgQCCBMKCxYMDBkNDBoNBAYDAgMCAQMCAwYDBAYDAQMCAQMCAwYDAwUDAgICAgECAwUDAQMBAQMBAgUDAgQDBAgEAwcDAQMBAgMBAgMBAgUDAQEXIwMAAAAAAQAC/8ID/gO+AFMAACU4ATEJATgBMT4BNzYmLwEuAQcOAQc4ATEJATgBMS4BJyYGDwEOARceARc4ATEJATgBMQ4BBwYWHwEeATc+ATc4ATEJATgBMR4BFxY2PwE+AScuAQP3/skBNwIEAQMDB5MHEgkDBgL+yf7JAgYDCRIHkwcDAwEEAgE3/skCBAEDAweTBxIJAwYCATcBNwIGAwkSB5MHAwMBBIkBNwE3AgYDCRIHkwcDAwEEAv7JATcCBAEDAweTBxIJAwYC/sn+yQIGAwkSB5MHAwMBBAIBN/7JAgQBAwMHkwcSCQMGAAABAAAAgAQAAsAAKgAAATQmJyYnLgEnJiMiBgcuASMiBhUUFhUuASMiBw4BBwYVFBceARcWMyEyNgQATDkBExNBKyoxOWEhEjcgOE4BCBEJKCQjNQ8PDw81IyQoApBIZgEuPl4OMCorPxISMSoYHE43BQoEAQIQDzQkIygoJCM1Dw9mAAAEAAAAQAQAA0AACwAXACsALwAAATQ2MzIWFRQGIyImJTQ2MzIWFRQGIyImBTU0JiMhIgYVERQWMyEyNj0BBREBITUhAYBeQkJeXkJCXv6AXkJCXl5CQl4DACYa/YAaJiYaAoAaJgEA/oD+AAIAAqBCXl5CQl5eQkJeXkJCXl7+YBomJhr+wBomJhpgoAHA/sDAAAAAAgBA/8ADwAPAABQAJgAAAREhIiY1NDYzIREhIgYVERQWMyERATE4ATEiBhUUFjM4ATkBITUhA4D9YCg4OCgCYP2ANUtLNQMA/SANExMNAmD9oANA/MA4KCg4AwBLNf0ANUsDgP1AEw0NE0AAAQAAAAEAACKXau1fDzz1AAsEAAAAAADWNiSXAAAAANY2JJcAAP/ABAADwAAAAAgAAgAAAAAAAAABAAADwP/AAAAEAAAAAAAEAAABAAAAAAAAAAAAAAAAAAAACgQAAAAAAAAAAAAAAAIAAAAEAAAOBAAAAAQAAAIEAAAABAAAAAQAAEAAAAAAAAoAFAAeAGoGPga0BvYHQAd2AAAAAQAAAAoEhwAEAAAAAAACAAAAAAAAAAAAAAAAAAAAAAAAAA4ArgABAAAAAAABAAQAAAABAAAAAAACAAcARQABAAAAAAADAAQALQABAAAAAAAEAAQAWgABAAAAAAAFAAsADAABAAAAAAAGAAQAOQABAAAAAAAKABoAZgADAAEECQABAAgABAADAAEECQACAA4ATAADAAEECQADAAgAMQADAAEECQAEAAgAXgADAAEECQAFABYAFwADAAEECQAGAAgAPQADAAEECQAKADQAgG5ncmkAbgBnAHIAaVZlcnNpb24gMS4wAFYAZQByAHMAaQBvAG4AIAAxAC4AMG5ncmkAbgBnAHIAaW5ncmkAbgBnAHIAaVJlZ3VsYXIAUgBlAGcAdQBsAGEAcm5ncmkAbgBnAHIAaUZvbnQgZ2VuZXJhdGVkIGJ5IEljb01vb24uAEYAbwBuAHQAIABnAGUAbgBlAHIAYQB0AGUAZAAgAGIAeQAgAEkAYwBvAE0AbwBvAG4ALgAAAAMAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA=") format("truetype");font-weight:400;font-style:normal}@font-face{font-family:fa-ngrm;src:url(../fonts/fa-ngrm.eot);src:url(../fonts/fa-ngrm.eot#iefix) format("embedded-opentype"),url(data:font/woff2;base64,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) format("woff2"),url(data:font/woff;base64,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) format("woff"),url(../fonts/fa-ngrm.ttf) format("truetype"),url(../img/fa-ngrm.svg#fa-ngrm) format("svg");font-weight:400;font-style:normal}[class*=" ngrm-icon-"]:before,[class^=ngrm-icon-]:before{font-family:fa-ngrm;font-style:normal;font-weight:400;speak:none;display:inline-block;text-decoration:inherit;width:1em;margin-right:.2em;text-align:center;font-variant:normal;text-transform:none;line-height:1em;margin-left:.2em;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.ngrm-icon-cancel:before{content:"\E800"}.ngrm-icon-floppy:before{content:"\E801"}.ngrm-icon-ok:before{content:"\E802"}.ngrm-icon-ccw:before{content:"\E803"}.ngrm-icon-folder:before{content:"\E804"}.ngrm-icon-upload:before{content:"\E805"}.ngrm-icon-play:before{content:"\E811"}.ngrm-icon-trash:before{content:"\F1F8"}.ngrm-icon-file-archive-o:before{content:"\F1C6"}.v-select{position:relative;font-family:inherit}.v-select,.v-select *{-webkit-box-sizing:border-box;box-sizing:border-box}@-webkit-keyframes vSelectSpinner{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes vSelectSpinner{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}.vs__fade-enter-active,.vs__fade-leave-active{-webkit-transition:opacity .15s cubic-bezier(1,.5,.8,1);transition:opacity .15s cubic-bezier(1,.5,.8,1)}.vs__fade-enter,.vs__fade-leave-to{opacity:0}.vs--disabled .vs__clear,.vs--disabled .vs__dropdown-toggle,.vs--disabled .vs__open-indicator,.vs--disabled .vs__search,.vs--disabled .vs__selected{cursor:not-allowed;background-color:#f8f8f8}.v-select[dir=rtl] .vs__actions{padding:0 3px 0 6px}.v-select[dir=rtl] .vs__clear{margin-left:6px;margin-right:0}.v-select[dir=rtl] .vs__deselect{margin-left:0;margin-right:2px}.v-select[dir=rtl] .vs__dropdown-menu{text-align:right}.vs__dropdown-toggle{-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:0 0 4px 0;background:none;border:1px solid rgba(60,60,60,.26);border-radius:4px;white-space:normal}.vs__dropdown-toggle,.vs__selected-options{display:-webkit-box;display:-ms-flexbox;display:flex}.vs__selected-options{-ms-flex-preferred-size:100%;flex-basis:100%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-ms-flex-wrap:wrap;flex-wrap:wrap;padding:0 2px;position:relative}.vs__actions{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding:4px 6px 0 3px}.vs--searchable .vs__dropdown-toggle{cursor:text}.vs--unsearchable .vs__dropdown-toggle{cursor:pointer}.vs--open .vs__dropdown-toggle{border-bottom-color:transparent;border-bottom-left-radius:0;border-bottom-right-radius:0}.vs__open-indicator{fill:rgba(60,60,60,.5);-webkit-transform:scale(1);transform:scale(1);-webkit-transition:-webkit-transform .15s cubic-bezier(1,-.115,.975,.855);transition:-webkit-transform .15s cubic-bezier(1,-.115,.975,.855);transition:transform .15s cubic-bezier(1,-.115,.975,.855);transition:transform .15s cubic-bezier(1,-.115,.975,.855),-webkit-transform .15s cubic-bezier(1,-.115,.975,.855);-webkit-transition-timing-function:cubic-bezier(1,-.115,.975,.855);transition-timing-function:cubic-bezier(1,-.115,.975,.855)}.vs--open .vs__open-indicator{-webkit-transform:rotate(180deg) scale(1);transform:rotate(180deg) scale(1)}.vs--loading .vs__open-indicator{opacity:0}.vs__clear{fill:rgba(60,60,60,.5);padding:0;border:0;background-color:transparent;cursor:pointer;margin-right:8px}.vs__dropdown-menu{display:block;position:absolute;top:calc(100% - 1px);left:0;z-index:1000;padding:5px 0;margin:0;width:100%;max-height:350px;min-width:160px;overflow-y:auto;-webkit-box-shadow:0 3px 6px 0 rgba(0,0,0,.15);box-shadow:0 3px 6px 0 rgba(0,0,0,.15);border:1px solid rgba(60,60,60,.26);border-top-style:none;border-radius:0 0 4px 4px;text-align:left;list-style:none;background:#fff}.vs__no-options{text-align:center}.vs__dropdown-option{line-height:1.42857143;display:block;padding:3px 20px;clear:both;color:#333;white-space:nowrap}.vs__dropdown-option:hover{cursor:pointer}.vs__dropdown-option--highlight{background:#5897fb;color:#fff}.vs__selected{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:#f0f0f0;border:1px solid rgba(60,60,60,.26);border-radius:4px;color:#333;line-height:1.4;margin:4px 2px 0 2px;padding:0 .25em}.vs__deselect{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-appearance:none;-moz-appearance:none;appearance:none;margin-left:4px;padding:0;border:0;cursor:pointer;background:none;fill:rgba(60,60,60,.5);text-shadow:0 1px 0 #fff}.vs--single .vs__selected{background-color:transparent;border-color:transparent}.vs--single.vs--open .vs__selected{position:absolute;opacity:.4}.vs--single.vs--searching .vs__selected{display:none}.vs__search::-ms-clear,.vs__search::-webkit-search-cancel-button,.vs__search::-webkit-search-decoration,.vs__search::-webkit-search-results-button,.vs__search::-webkit-search-results-decoration{display:none}.vs__search,.vs__search:focus{-webkit-appearance:none;-moz-appearance:none;appearance:none;line-height:1.4;font-size:1em;border:1px solid transparent;border-left:none;outline:none;margin:4px 0 0 0;padding:0 7px;background:none;-webkit-box-shadow:none;box-shadow:none;width:0;max-width:100%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}.vs__search::-webkit-input-placeholder{color:inherit}.vs__search::-moz-placeholder{color:inherit}.vs__search:-ms-input-placeholder{color:inherit}.vs__search::-ms-input-placeholder{color:inherit}.vs__search::placeholder{color:inherit}.vs--unsearchable .vs__search{opacity:1}.vs--unsearchable .vs__search:hover{cursor:pointer}.vs--single.vs--searching:not(.vs--open):not(.vs--loading) .vs__search{opacity:.2}.vs__spinner{-ms-flex-item-align:center;align-self:center;opacity:0;font-size:5px;text-indent:-9999em;overflow:hidden;border-top:.9em solid hsla(0,0%,39.2%,.1);border-right:.9em solid hsla(0,0%,39.2%,.1);border-bottom:.9em solid hsla(0,0%,39.2%,.1);border-left:.9em solid rgba(60,60,60,.45);-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-animation:vSelectSpinner 1.1s linear infinite;animation:vSelectSpinner 1.1s linear infinite;-webkit-transition:opacity .1s;transition:opacity .1s}.vs__spinner,.vs__spinner:after{border-radius:50%;width:5em;height:5em}.vs--loading .vs__spinner{opacity:1}.ngremotemedia-select-folder-container,.ngrm-model-portal+form,.ngrm-model-portal .ngrm-overlay{-webkit-box-sizing:border-box;box-sizing:border-box;font-family:Roboto,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:#333}.ngremotemedia-select-folder-container *,.ngremotemedia-select-folder-container :after,.ngremotemedia-select-folder-container :before,.ngrm-model-portal+form *,.ngrm-model-portal+form :after,.ngrm-model-portal+form :before,.ngrm-model-portal .ngrm-overlay *,.ngrm-model-portal .ngrm-overlay :after,.ngrm-model-portal .ngrm-overlay :before{-webkit-box-sizing:inherit;box-sizing:inherit}.ngremotemedia-select-folder-container .btn,.ngrm-model-portal+form .btn,.ngrm-model-portal .ngrm-overlay .btn{border-radius:4px;text-align:center;font-size:14px;line-height:18px;color:#fff;padding:8px 16px;border:1px solid #e4e4e4;background:#fff;color:#333}.ngremotemedia-select-folder-container .btn:active,.ngrm-model-portal+form .btn:active,.ngrm-model-portal .ngrm-overlay .btn:active{background:#d7d7d7}.ngremotemedia-select-folder-container .btn.btn-blue,.ngrm-model-portal+form .btn.btn-blue,.ngrm-model-portal .ngrm-overlay .btn.btn-blue{background:#009ac7;border:0;color:#fff}.ngremotemedia-select-folder-container .btn.btn-blue:active,.ngrm-model-portal+form .btn.btn-blue:active,.ngrm-model-portal .ngrm-overlay .btn.btn-blue:active{background:#007394}.ngremotemedia-select-folder-container .v-select,.ngrm-model-portal+form .v-select,.ngrm-model-portal .ngrm-overlay .v-select{font-size:14px;line-height:16px;background-color:#fff}.ngremotemedia-select-folder-container .v-select .vs__dropdown-toggle,.ngrm-model-portal+form .v-select .vs__dropdown-toggle,.ngrm-model-portal .ngrm-overlay .v-select .vs__dropdown-toggle{border-radius:0;border:1px solid #e4e4e4;padding:3px 5px 6px}.ngremotemedia-select-folder-container .v-select input::-webkit-input-placeholder,.ngrm-model-portal+form .v-select input::-webkit-input-placeholder,.ngrm-model-portal .ngrm-overlay .v-select input::-webkit-input-placeholder{color:#333;font-style:italic}.ngremotemedia-select-folder-container .v-select input::-moz-placeholder,.ngrm-model-portal+form .v-select input::-moz-placeholder,.ngrm-model-portal .ngrm-overlay .v-select input::-moz-placeholder{color:#333;font-style:italic}.ngremotemedia-select-folder-container .v-select input:-ms-input-placeholder,.ngrm-model-portal+form .v-select input:-ms-input-placeholder,.ngrm-model-portal .ngrm-overlay .v-select input:-ms-input-placeholder{color:#333;font-style:italic}.ngremotemedia-select-folder-container .v-select input::-ms-input-placeholder,.ngrm-model-portal+form .v-select input::-ms-input-placeholder,.ngrm-model-portal .ngrm-overlay .v-select input::-ms-input-placeholder{color:#333;font-style:italic}.ngremotemedia-select-folder-container .v-select input::placeholder,.ngrm-model-portal+form .v-select input::placeholder,.ngrm-model-portal .ngrm-overlay .v-select input::placeholder{color:#333;font-style:italic}.ngremotemedia-select-folder-container ::-webkit-input-placeholder,.ngrm-model-portal+form ::-webkit-input-placeholder,.ngrm-model-portal .ngrm-overlay ::-webkit-input-placeholder{color:#999}.ngremotemedia-select-folder-container :-ms-input-placeholder,.ngrm-model-portal+form :-ms-input-placeholder,.ngrm-model-portal .ngrm-overlay :-ms-input-placeholder{color:#999}.ngremotemedia-select-folder-container ::-moz-placeholder,.ngrm-model-portal+form ::-moz-placeholder,.ngrm-model-portal .ngrm-overlay ::-moz-placeholder{color:#999}.ngremotemedia-select-folder-container ::-ms-input-placeholder,.ngrm-model-portal+form ::-ms-input-placeholder,.ngrm-model-portal .ngrm-overlay ::-ms-input-placeholder{color:#999}.ngremotemedia-select-folder-container ::placeholder,.ngrm-model-portal+form ::placeholder,.ngrm-model-portal .ngrm-overlay ::placeholder{color:#999}.ngremotemedia-container{text-align:start}.ngrm-model-portal .ngrm-overlay .ng-icon{font-size:4.5em;font-family:ngri;font-style:normal;font-weight:400;font-variant:normal;text-transform:none;text-align:center;line-height:80px;display:block;color:#333}.ngrm-model-portal .ngrm-overlay .ng-icon.big{font-size:64px;color:#333}.ngrm-model-portal .ngrm-overlay .ng-icon.ng-warning:before{content:"\E900"}.ngrm-model-portal .ngrm-overlay .ng-icon.ng-spinner:before{content:"\E901"}.ngrm-model-portal .ngrm-overlay .ng-icon.ng-close:before{content:"\E902"}.ngrm-model-portal .ngrm-overlay .ng-icon.ng-cloud:before{content:"\E903"}.ngrm-model-portal .ngrm-overlay .ng-icon.ng-video:before{content:"\E904"}.ngrm-model-portal .ngrm-overlay .ng-icon.ng-book:before{content:"\E905"}.ngrm-model-portal .ngrm-overlay .image-meta{overflow:visible}.ngrm-model-portal .ngrm-overlay .image-meta h3{font-weight:700}.ngrm-model-portal .ngrm-overlay .image-meta p{color:#737373}.ngrm-model-portal .ngrm-overlay .image-meta input.media-alttext,.ngrm-model-portal .ngrm-overlay .image-meta input.media-caption,.ngrm-model-portal .ngrm-overlay .image-meta input.media-css-class,.ngrm-model-portal .ngrm-overlay .image-meta input.media-watermarktext{width:100%;border-radius:0;border:1px solid #e4e4e4;padding:7px 10px 7px 10px;margin-bottom:10px}.ngrm-model-portal .ngrm-overlay .image-meta .image-meta-data{margin-top:20px}.ngrm-model-portal .ngrm-overlay .image-wrap:has(.icon-doc){position:relative;height:200px;max-width:400px;display:block;margin-bottom:4px}.ngrm-model-portal .ngrm-overlay .image-wrap:has(.icon-doc):before{position:absolute;content:""}.ngrm-model-portal .ngrm-overlay .image-wrap:has(.icon-doc):before{background-color:rgba(0,0,0,.7);top:0;bottom:0;left:0;right:0}.ngrm-model-portal .ngrm-overlay .image-wrap .icon-doc{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);color:#fff;font-size:70px}.ngrm-model-portal .ngrm-overlay .image-wrap img{max-width:100%}.ngrm-model-portal .ngrm-overlay .vue-treeselect{font-size:14px;line-height:16px}.ngrm-model-portal .ngrm-overlay .vue-treeselect .vue-treeselect__control{border-radius:0;border:1px solid #e4e4e4}.ngrm-model-portal .ngrm-overlay .vue-treeselect .vue-treeselect__placeholder{color:#333;font-style:italic}@-webkit-keyframes spinning{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes spinning{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}.ngremotemedia-buttons{margin-top:20px}.ngremotemedia-buttons .ngremotemedia-local-file-container{margin:10px 0 10px 0}.ngremotemedia-buttons .ngremotemedia-local-file.btn.upload-from-disk,.ngremotemedia-buttons input[type=button]{border-radius:4px;text-align:center;font-size:14px!important;line-height:18px;padding:8px 16px;border:1px solid #e4e4e4;background:#f1f4fa;cursor:pointer;color:#333;font-weight:400;font-family:Arial,Helvetica,sans-serif}.ngremotemedia-buttons .ngremotemedia-local-file.btn.upload-from-disk{background:#fff}.o2k7Skin .mceIcon.mce_ngremotemedia img{width:2rem}.ngremotemedia-image .image-wrap .file-placeholder[data-v-7b7e2b48]{position:relative;max-width:500px;height:280px;display:block;margin-bottom:4px}.ngremotemedia-image .image-wrap .file-placeholder .icon-doc[data-v-7b7e2b48]{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);color:#fff;font-size:40px}.ngremotemedia-image .image-wrap .file-placeholder[data-v-7b7e2b48]:before{position:absolute;content:"";background-color:rgba(0,0,0,.7);top:0;bottom:0;left:0;right:0}.mediaFacets[data-v-278bb214]{width:362px;-ms-flex-negative:0;flex-shrink:0;-webkit-box-shadow:inset -1px 0 0 0 #e4e4e4;box-shadow:inset -1px 0 0 0 #e4e4e4}.mediaFacets .body[data-v-278bb214]{-webkit-box-shadow:inset 0 -1px 0 0 #e4e4e4,inset 0 1px 0 0 #e4e4e4,inset -1px 0 0 0 #e4e4e4;box-shadow:inset 0 -1px 0 0 #e4e4e4,inset 0 1px 0 0 #e4e4e4,inset -1px 0 0 0 #e4e4e4;background:#fff;padding:30px 15px}.mediaFacets .body .form-field+.form-field[data-v-278bb214]{margin-top:15px}.mediaFacets .body .form-field label[data-v-278bb214],.mediaFacets .body .search-wrapper .search-label[data-v-278bb214]{font-size:12px;font-weight:700;line-height:18px;color:#757575;margin-bottom:3px;display:block}.mediaFacets .body .search-wrapper[data-v-278bb214]{margin:30px 0 0}.mediaFacets .body .search-wrapper .search[data-v-278bb214]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin:5px 0}.mediaFacets .body .search-wrapper .search input[data-v-278bb214],.mediaFacets .body .search-wrapper .search ul[data-v-278bb214]{font-size:14px;line-height:16px}.mediaFacets .body .search-wrapper .search ul[data-v-278bb214]{margin:0;padding:5px;list-style:none;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;border:1px solid #e4e4e4;min-width:75px;display:none}.mediaFacets .body .search-wrapper .search ul li[data-v-278bb214]{cursor:auto;margin-right:10px;padding:4px 10px;min-width:45px}.mediaFacets .body .search-wrapper .search ul li[data-v-278bb214]:last-child,.mediaFacets .body .search-wrapper .search ul li[data-v-278bb214]:only-child{margin:0}.mediaFacets .body .search-wrapper .search ul li.active[data-v-278bb214]{background:#009ac7;color:#fff;border-radius:4px;-webkit-box-shadow:inset -1px 0 0 0 #d7d7d7,inset 1px 0 0 0 #d7d7d7,inset 0 1px 0 0 #d7d7d7,inset 0 -1px 0 0 #d7d7d7;box-shadow:inset -1px 0 0 0 #d7d7d7,inset 1px 0 0 0 #d7d7d7,inset 0 1px 0 0 #d7d7d7,inset 0 -1px 0 0 #d7d7d7}.mediaFacets .body .search-wrapper .search input[data-v-278bb214]{border:1px solid #e4e4e4;padding:9px 10px;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}.mediaFacets .ng-spinner[data-v-278bb214]{position:fixed;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.mediaFacets .ng-spinner[data-v-278bb214]:before{display:inline-block;-webkit-animation:spinning 1.5s linear infinite;animation:spinning 1.5s linear infinite}.media-gallery[data-v-5aa52c90]{position:relative;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}.media-gallery .items[data-v-5aa52c90]{padding:15px;overflow-y:auto;height:calc(100% - 50px)}.media-gallery .items.loading[data-v-5aa52c90]{opacity:.5}.media-gallery .items .media[data-v-5aa52c90]{width:190px;min-height:182px;max-height:190px;padding:8px;margin:0 15px 15px 0;background-color:#fff;display:inline-block}.media-gallery .items .media .media-container[data-v-5aa52c90]{width:100%}.media-gallery .items .media .img[data-v-5aa52c90]{display:block;margin-bottom:4px;-o-object-fit:cover;object-fit:cover;height:100px;width:100%;overflow:hidden;text-overflow:ellipsis}.media-gallery .items .media .file-placeholder[data-v-5aa52c90]{position:relative;height:95px;display:block;margin-bottom:4px}.media-gallery .items .media .file-placeholder .icon-doc[data-v-5aa52c90]{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);color:#fff;font-size:40px}.media-gallery .items .media .file-placeholder[data-v-5aa52c90]:before{position:absolute;content:"";background-color:rgba(0,0,0,.7);top:0;bottom:0;left:0;right:0}.media-gallery .items .media .filename[data-v-5aa52c90]{overflow:hidden;display:inline-block;text-overflow:ellipsis;white-space:nowrap;width:100%;text-align:center;font-size:16px;line-height:20px;margin-top:4px;margin-bottom:0}.media-gallery .items .media .size-description[data-v-5aa52c90]{font-size:12px;line-height:14px;text-align:center;color:#999}.media-gallery .items .media .size-description .format[data-v-5aa52c90]{text-transform:uppercase}.media-gallery .items .media.selected[data-v-5aa52c90]{border:1px solid #009ac7}.media-gallery .items .media .select-btn[data-v-5aa52c90]{margin-top:8px;padding:3px;width:100%}.media-gallery .folder-empty[data-v-5aa52c90]{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.media-gallery .folder-empty span[data-v-5aa52c90]{display:block;text-align:center;font-size:14px;line-height:16px}.media-gallery .folder-empty span.ngrm-icon-folder[data-v-5aa52c90]{color:#999;font-size:33px}.media-gallery .folder-empty span strong[data-v-5aa52c90]{display:block;margin:5px 0;font-size:16px;line-height:19px}.media-gallery .load-more-wrapper[data-v-5aa52c90]{padding:8px 15px;background-color:#fff;text-align:right;-webkit-box-shadow:inset 1px 0 0 0 #e4e4e4,0 -1px 0 0 #e4e4e4;box-shadow:inset 1px 0 0 0 #e4e4e4,0 -1px 0 0 #e4e4e4;position:absolute;bottom:0;left:0;right:0}.ngrm-overlay[data-v-03fd1c54]{position:fixed;top:0;bottom:0;left:0;right:0;background-color:rgba(0,0,0,.8);z-index:9999}.ngrm-overlay .media-modal[data-v-03fd1c54]{background-color:#f5f5f5;-webkit-box-shadow:0 5px 15px 0 rgba(0,0,0,.5);box-shadow:0 5px 15px 0 rgba(0,0,0,.5);margin:32px;height:calc(100vh - 64px)}.ngrm-overlay .media-modal .title[data-v-03fd1c54]{padding:15px;font-size:16px;font-weight:700;line-height:20px;color:#333;background:#fff;text-transform:uppercase;-webkit-box-shadow:inset 0 -1px 0 0 #e4e4e4;box-shadow:inset 0 -1px 0 0 #e4e4e4}.ngrm-overlay .media-modal .title .close[data-v-03fd1c54]{float:right;cursor:pointer;padding:2px 10px}.ngrm-overlay .media-modal .body[data-v-03fd1c54]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;position:relative;height:calc(100% - 50px)}.ngrm-overlay .img-placeholder img[data-v-03fd1c54]{height:100%}.ngremotemedia-buttons input[type=button]{margin-bottom:4px;margin-right:4px}.help-block.description{margin-right:6px}.btn,.sidebar-crop .buttons{font-size:14px!important;font-family:Arial,Helvetica,sans-serif}.ngremotemedia-selected-variation .vs__selected-options input[type=search].vs__search,.ngremotemedia-tags .vs__selected-options input[type=search].vs__search{border:none}.ngremotemedia-selected-variation select[hidden=hidden],.ngremotemedia-tags select[hidden=hidden]{display:none}.ngremotemedia-image h3.title{word-break:break-word}.ngremotemedia-image .image-wrap img{max-width:100%}.input-file-name-wrapper{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.input-file-name-wrapper .v-select,.input-file-name-wrapper input[type=text]{margin-right:16px}.input-file-name-wrapper .v-select.vs--single.vs--searchable{margin-right:10px}.input-file-name-wrapper .v-select.vs--single.vs--searchable input.vs__search{background:transparent}.input-file-name-wrapper button.btn{margin-left:40%;font-size:14px!important;font-family:Arial}.input-file-name-wrapper .vs__dropdown-toggle{height:37px}.media-gallery .items .media{line-height:normal}.ng-spinner[data-v-751395c8]{position:fixed;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.ng-spinner[data-v-751395c8]:before{display:inline-block;-webkit-animation:spinning 1.5s linear infinite;animation:spinning 1.5s linear infinite}.sidebar-crop[data-v-ad171770]{width:264px;-ms-flex-negative:0;flex-shrink:0;-webkit-box-shadow:inset -1px 0 0 0 #e4e4e4;box-shadow:inset -1px 0 0 0 #e4e4e4}.sidebar-crop .buttons[data-v-ad171770]{background:#fff;padding:15px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-shadow:inset 0 -1px 0 0 #e4e4e4;box-shadow:inset 0 -1px 0 0 #e4e4e4;margin-right:1px}.sidebar-crop .buttons button[data-v-ad171770]{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}.sidebar-crop .buttons button.crop-btn-add[data-v-ad171770]{margin-left:10px}.sidebar-crop .buttons button[data-v-ad171770]:only-child{width:100%}.sidebar-crop-label span[data-v-ad171770]{color:#999;font-size:14px;line-height:18px;display:inline-block;padding:31px 15px 15px;width:100%;-webkit-box-shadow:inset 0 -1px 0 0 #e4e4e4;box-shadow:inset 0 -1px 0 0 #e4e4e4}.unselectedVariations[data-v-ad171770]{position:absolute;top:0;left:0;width:264px;height:100%;-webkit-transform:translateX(264px);transform:translateX(264px);background:#fff;-webkit-box-shadow:inset -1px 0 0 0 #e4e4e4;box-shadow:inset -1px 0 0 0 #e4e4e4;z-index:10}.unselectedVariations>div[data-v-ad171770]{padding:15px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;background-color:#fff;-webkit-box-shadow:inset 0 -1px 0 0 #e4e4e4,inset -1px 0 0 0 #e4e4e4;box-shadow:inset 0 -1px 0 0 #e4e4e4,inset -1px 0 0 0 #e4e4e4}.unselectedVariations>div input[data-v-ad171770],.unselectedVariations>div label[data-v-ad171770]{cursor:pointer}.unselectedVariations>div input[data-v-ad171770]{margin-right:11px}.unselectedVariations>div label[data-v-ad171770]{width:100%}.unselectedVariations>div .name[data-v-ad171770]{color:#333;font-size:14px;line-height:18px}.unselectedVariations>div .formatted-size[data-v-ad171770]{color:#999;font-size:12px;line-height:18px;display:block}.unselectedVariations>div.disabled[data-v-ad171770]{-ms-flex-wrap:wrap;flex-wrap:wrap;background-color:#f5f5f5;cursor:auto;color:#ddd;padding:15px 15px 5px}.unselectedVariations>div.disabled input[data-v-ad171770],.unselectedVariations>div.disabled label[data-v-ad171770],.unselectedVariations>div.disabled span[data-v-ad171770]{cursor:auto}.unselectedVariations>div.disabled label[data-v-ad171770]{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;width:auto;color:#999}.unselectedVariations .legend-not-selectable[data-v-ad171770]{width:100%;font-size:.75rem;color:#a41034;display:inline-block;text-align:right}.selectedVariations ul[data-v-ad171770]{list-style:none;padding:0;margin:0}.selectedVariations ul li[data-v-ad171770]{padding:15px 0 15px 15px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-shadow:inset -1px 0 0 0 #e4e4e4,inset 0 -1px 0 0 #e4e4e4;box-shadow:inset -1px 0 0 0 #e4e4e4,inset 0 -1px 0 0 #e4e4e4;background-color:#fff;cursor:pointer}.selectedVariations ul li.disabled[data-v-ad171770]{background-color:#f5f5f5;cursor:auto}.selectedVariations ul li.selected.set[data-v-ad171770]{color:#90ee90}.selectedVariations ul li span[data-v-ad171770]{display:block;color:#333;font-size:14px;line-height:18px}.selectedVariations ul li a[data-v-ad171770]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.selectedVariations ul li a span[data-v-ad171770]{padding:5px}.selectedVariations ul li a .ngrm-icon-trash[data-v-ad171770]{color:#009ac7;padding:10px}.selectedVariations ul li .formatted-size[data-v-ad171770]{color:#999;font-size:12px;line-height:18px}.selectedVariations ul li .circle-orange[data-v-ad171770]{width:8px;height:8px;background-color:orange;border-radius:50%}.selectedVariations .set .circle-orange[data-v-ad171770]{display:none}.crop .cropper[data-v-5f73791e]{position:relative;margin:0 auto}.crop .cropper button[data-v-5f73791e]{margin-left:8px}.crop .cropper .buttons[data-v-5f73791e]{position:absolute}.crop .preview[data-v-5f73791e]{width:100%;height:500px;overflow:hidden}.crop-container[data-v-45497070]{overflow-y:auto;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;margin:30px 30px 80px}.crop-container[data-v-45497070]:empty{display:none}.img-placeholder[data-v-45497070]{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:60px 60px 110px}.img-placeholder img[data-v-45497070]{max-width:100%;height:auto;margin:0 auto;display:block}.action-strip[data-v-45497070]{padding:8px 15px;background-color:#fff;text-align:right;-webkit-box-shadow:inset 1px 0 0 0 #e4e4e4,0 -1px 0 0 #e4e4e4;box-shadow:inset 1px 0 0 0 #e4e4e4,0 -1px 0 0 #e4e4e4;position:absolute;bottom:0;left:264px;right:0}.action-strip button[data-v-45497070]{margin-left:10px}.action-strip .ngrm-icon-floppy[data-v-45497070]{margin-right:5px}.folder-gallery[data-v-c53732c8]{position:relative;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;height:calc(100% - 50px);overflow-y:auto}.folder-gallery .items[data-v-c53732c8]{padding:15px}.folder-gallery .items.loading[data-v-c53732c8]{opacity:.5}.folder-gallery .items .breadcrumbs[data-v-c53732c8]{background-color:#fff;width:100%;margin-bottom:20px;padding:10px}.folder-gallery .items .breadcrumbs a[data-v-c53732c8]{color:#009ac7}.folder-gallery .items .info[data-v-c53732c8]{font-style:italic;margin-bottom:10px;margin-left:10px}.folder-gallery .items .media[data-v-c53732c8]{width:177px;min-height:182px;max-height:190px;padding:8px;margin:0 15px 15px 0;background-color:#fff;display:inline-block}.folder-gallery .items .media .media-container[data-v-c53732c8]{width:100%}.folder-gallery .items .media .img[data-v-c53732c8]{display:block;margin-bottom:4px;-o-object-fit:cover;object-fit:cover;height:92px;width:100%;overflow:hidden;text-overflow:ellipsis}.folder-gallery .items .media .file-placeholder[data-v-c53732c8]{position:relative;height:92px;display:block;margin-bottom:4px}.folder-gallery .items .media .file-placeholder .icon-doc[data-v-c53732c8]{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);color:#fff;font-size:40px}.folder-gallery .items .media .file-placeholder[data-v-c53732c8]:before{position:absolute;content:"";background-color:rgba(0,0,0,.7);top:0;bottom:0;left:0;right:0}.folder-gallery .items .media.new-folder input[data-v-c53732c8]{width:100%;margin-top:5px}.folder-gallery .items .media.new-folder .select-btn[data-v-c53732c8]{background:#2e8b57}.folder-gallery .items .media.new-folder .file-placeholder[data-v-c53732c8]:before{background-color:rgba(0,0,0,.2);top:0;bottom:0;left:0;right:0}.folder-gallery .items .media .filename[data-v-c53732c8]{overflow:hidden;display:inline-block;text-overflow:ellipsis;white-space:nowrap;width:100%;text-align:center;font-size:16px;line-height:20px;margin-top:4px;margin-bottom:0}.folder-gallery .items .media .size-description[data-v-c53732c8]{font-size:12px;line-height:14px;text-align:center;color:#999}.folder-gallery .items .media .size-description .format[data-v-c53732c8]{text-transform:uppercase}.folder-gallery .items .media.selected[data-v-c53732c8]{border:1px solid #009ac7}.folder-gallery .items .media .select-btn[data-v-c53732c8]{margin-top:10px;padding:3px;width:100%}.folder-gallery .folder-empty[data-v-c53732c8]{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.folder-gallery .folder-empty span[data-v-c53732c8]{display:block;text-align:center;font-size:14px;line-height:16px}.folder-gallery .folder-empty span.ngrm-icon-folder[data-v-c53732c8]{color:#999;font-size:33px}.folder-gallery .folder-empty span strong[data-v-c53732c8]{display:block;margin:5px 0;font-size:16px;line-height:19px}.folder-gallery .load-more-wrapper[data-v-c53732c8]{padding:8px 15px;background-color:#fff;text-align:right;-webkit-box-shadow:inset 1px 0 0 0 #e4e4e4,0 -1px 0 0 #e4e4e4;box-shadow:inset 1px 0 0 0 #e4e4e4,0 -1px 0 0 #e4e4e4;position:absolute;bottom:0;left:0;right:0}.ng-spinner[data-v-c53732c8]{position:fixed;vertical-align:center;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.ng-spinner[data-v-c53732c8]:before{display:inline-block;-webkit-animation:spinning 1.5s linear infinite;animation:spinning 1.5s linear infinite}.loading[data-v-2676fd5e]{opacity:.5}.input-file-name-wrapper[data-v-2676fd5e]{padding:8px 15px;background-color:#fff;-webkit-box-shadow:inset 1px 0 0 0 #e4e4e4,0 -1px 0 0 #e4e4e4;box-shadow:inset 1px 0 0 0 #e4e4e4,0 -1px 0 0 #e4e4e4;position:absolute;bottom:0;left:0;right:0}.input-file-name-wrapper input[type=text][data-v-2676fd5e]{width:40%;min-width:300px;border:1px solid #e4e4e4;padding:10px 10px;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;margin-right:10px}.input-file-name-wrapper input[type=text].error[data-v-2676fd5e]{border:1px solid red}.input-file-name-wrapper .v-select[data-v-2676fd5e]{width:15%;min-width:150px}.input-file-name-wrapper button[data-v-2676fd5e]{float:right}.input-file-name-wrapper div.error[data-v-2676fd5e]{color:red;margin-bottom:5px}.ng-spinner[data-v-2676fd5e]{position:fixed;vertical-align:middle;margin-top:15%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.ng-spinner[data-v-2676fd5e]:before{display:inline-block;-webkit-animation:spinning 1.5s linear infinite;animation:spinning 1.5s linear infinite}
\ No newline at end of file
diff --git a/bundle/Resources/public/js/ckeditor-plugin/button.js b/bundle/Resources/public/js/ckeditor-plugin/button.js
new file mode 100644
index 00000000..85501930
--- /dev/null
+++ b/bundle/Resources/public/js/ckeditor-plugin/button.js
@@ -0,0 +1,23 @@
+import { ButtonView } from '@ckeditor/ckeditor5-ui';
+import { pluginKey } from './constants';
+
+const getNetgenRemoteMediaToolbarButton = (editor, locale) => {
+  const button = new ButtonView(locale);
+  const command = editor.commands.get(pluginKey);
+
+  button.bind('isEnabled').to(command, 'isEnabled');
+
+  button.set({
+    tooltip: 'Netgen Remote Media',
+    icon: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 -50 640 640"><path d="M537.6 226.6c4.1-10.7 6.4-22.4 6.4-34.6 0-53-43-96-96-96-19.7 0-38.1 6-53.3 16.2C367 64.2 315.3 32 256 32c-88.4 0-160 71.6-160 160 0 2.7.1 5.4.2 8.1C40.2 219.8 0 273.2 0 336c0 79.5 64.5 144 144 144h368c70.7 0 128-57.3 128-128 0-61.9-44-113.6-102.4-125.4zM393.4 288H328v112c0 8.8-7.2 16-16 16h-48c-8.8 0-16-7.2-16-16V288h-65.4c-14.3 0-21.4-17.2-11.3-27.3l105.4-105.4c6.2-6.2 16.4-6.2 22.6 0l105.4 105.4c10.1 10.1 2.9 27.3-11.3 27.3z"/></svg>',
+  });
+
+  button.on('execute', () => {
+    command.execute();
+    editor.editing.view.focus();
+  });
+
+  return button;
+};
+
+export default getNetgenRemoteMediaToolbarButton;
diff --git a/bundle/Resources/public/js/ckeditor-plugin/command.js b/bundle/Resources/public/js/ckeditor-plugin/command.js
new file mode 100644
index 00000000..e5009717
--- /dev/null
+++ b/bundle/Resources/public/js/ckeditor-plugin/command.js
@@ -0,0 +1,57 @@
+import { Command } from '@ckeditor/ckeditor5-core';
+import { pluginKey, defaultValue, attributes } from './constants';
+import { findElementsInModel } from './utils/find-elements-in-model';
+
+class NetgenRemoteMediaCommand extends Command {
+  constructor(editor) {
+    super(editor);
+
+    this.value = 0;
+  }
+
+  refresh() {
+    const selectedElement =
+      this.editor.model.document.selection.getSelectedElement();
+    const isRemoteMedia = selectedElement?.name === pluginKey;
+
+    this.isEnabled = !this.editor.isReadOnly && !isRemoteMedia;
+
+    if (!this.value) {
+      this.value = findElementsInModel(this.editor.model.document.getRoot(), pluginKey).length;
+    }
+  }
+
+  execute() {
+    if (!this.isEnabled) {
+      return;
+    }
+
+    this.value += 1;
+
+    this.editor.model.change((writer) => {
+      const element = writer.createElement(pluginKey);
+
+      this.editor.model.insertObject(element, null, null, {
+        setSelection: 'on',
+      });
+
+      writer.setAttribute(
+        attributes.fieldId,
+        `${this.editor.config.get(pluginKey).fieldId}_${this.value}`,
+        element
+      );
+      writer.setAttribute(
+        attributes.selectedImage,
+        defaultValue.selectedImage,
+        element
+      );
+      writer.setAttribute(
+        attributes.locationId,
+        null,
+        element
+      );
+    });
+  }
+}
+
+export default NetgenRemoteMediaCommand;
diff --git a/bundle/Resources/public/js/ckeditor-plugin/constants.js b/bundle/Resources/public/js/ckeditor-plugin/constants.js
new file mode 100644
index 00000000..c4d99a37
--- /dev/null
+++ b/bundle/Resources/public/js/ckeditor-plugin/constants.js
@@ -0,0 +1,187 @@
+export const pluginKey = 'ngremotemedia';
+
+export const attributes = {
+  fieldId: 'field-id',
+  selectedImage: 'selected-image',
+  alignment: 'alignment',
+  locationId: 'location-id',
+  changedField: 'changed-field',
+};
+export const dataPrefix = 'data-ngrmcke5';
+export const viewAttributes = {
+  alignment: `${dataPrefix}-${attributes.alignment}`,
+  fieldId: `${dataPrefix}-${attributes.fieldId}`,
+  locationId: `${dataPrefix}-${attributes.locationId}`,
+  cssClass: `${dataPrefix}-css-class`,
+  variationName: `${dataPrefix}-variation-name`,
+  variationGroup: `${dataPrefix}-variation-group`,
+  viewEndpoint: `${dataPrefix}-view-endpoint`,
+};
+export const datasetAttributes = {
+  fieldId: 'fieldId',
+  selectedImage: 'selectedImage',
+  locationId: 'locationId',
+};
+
+export const editingView = {
+  name: 'div',
+  classes: 'ngremotemedia',
+};
+export const dataView = {
+  name: 'div',
+  classes: 'ngremotemedia-cke5',
+};
+export const dataModel = {
+  name: 'ngremotemedia',
+  attributes: Object.values(attributes),
+};
+
+export const defaultValue = {
+  locationId: null,
+  source: '',
+  endpoints: {
+    createLocation: '/ngremotemedia/ajax/location/create',
+    updateLocation: locationId => `/ngremotemedia/ajax/location/update/${locationId}`,
+    deleteLocation: locationId => `/ngremotemedia/ajax/location/delete/${locationId}`,
+    getSelectedImage: locationId => `/ngremotemedia/ajax/location/${locationId}/selected-image`,
+    viewResource: locationId => `/ngremotemedia/ajax/resource/view/${locationId}`,
+  },
+  config: {
+    mode: 'embed',
+    paths: {
+      browse_resources: '/ngremotemedia/ajax/resource/browse',
+      upload_resources: '/ngremotemedia/ajax/resource/upload',
+      load_facets: '/ngremotemedia/ajax/facets/load',
+      load_folders: '/ngremotemedia/ajax/folder/load',
+      create_folder: '/ngremotemedia/ajax/folder/create',
+    },
+    translations: {
+      'browse_title': 'browse_title',
+      'browse_select_type': 'browse_select_type',
+      'browse_loading_types': 'browse_loading_types',
+      'browse_all_types': 'browse_all_types',
+      'browse_select_folder': 'browse_select_folder',
+      'browse_loading_folders': 'browse_loading_folders',
+      'browse_all_folders': 'browse_all_folders',
+      'browse_select_tag': 'browse_select_tag',
+      'browse_loading_tags': 'browse_loading_tags',
+      'browse_all_tags': 'browse_all_tags',
+      'browse_select_visibility': 'browse_select_visibility',
+      'browse_loading_visibilities': 'browse_loading_visibilities',
+      'browse_all_visibilities': 'browse_all_visibilities',
+      'search': 'search',
+      'search_placeholder': 'search_placeholder',
+      'browse_empty_folder': 'browse_empty_folder',
+      'browse_empty_folder_hint': 'browse_empty_folder_hint',
+      'browse_select': 'browse_select',
+      'load_more': 'load_more',
+      'crop_modal_title': 'crop_modal_title',
+      'crop_reset': 'crop_reset',
+      'crop_apply': 'crop_apply',
+      'crop_cancel': 'crop_cancel',
+      'crop_add': 'crop_add',
+      'crop_preview': 'crop_preview',
+      'crop_save_sizes': 'crop_save_sizes',
+      'crop_add_size': 'crop_add_size',
+      'crop_added_for_confirmation': 'crop_added_for_confirmation',
+      'crop_media_too_small': 'crop_media_too_small',
+      'media_gallery_empty_folder': 'media_gallery_empty_folder',
+      'media_gallery_upload_media': 'media_gallery_upload_media',
+      'media_gallery_select': 'media_gallery_select',
+      'media_gallery_load_more': 'media_gallery_load_more',
+      'Search for media': 'Search for media',
+      'Load more': 'Load more',
+      'Upload new media': 'Upload new media',
+      'No results': 'No results',
+      'Alternate text': 'Alternate text',
+      'Class': 'Class',
+      'Create new folder?': 'Create new folder?',
+      'Folder': 'Folder',
+      'All': 'All',
+      'Add tag': 'Add tag',
+      'Media type': 'Media type',
+      'Image': 'Image',
+      'Video': 'Video',
+      'Loading...': 'Loading...',
+      'Cancel': 'Cancel',
+      'Save all': 'Save all',
+      'Generate': 'Generate',
+      'Caption': 'Caption',
+      'by': 'by',
+      'name': 'name',
+      'tag': 'tag',
+      'Image is to small for this version': 'Image is to small for this version',
+      'close': 'close',
+      'next': 'next',
+      'prev': 'prev',
+      'interactions_scale': 'interactions_scale',
+      'interactions_no_media_selected': 'interactions_no_media_selected',
+      'interactions_remove_media': 'interactions_remove_media',
+      'interactions_select_media': 'interactions_select_media',
+      'interactions_manage_media': 'interactions_manage_media',
+      'interactions_quick_upload': 'interactions_quick_upload',
+      'preview_alternate_text': 'preview_alternate_text',
+      'preview_alternate_text_info': 'preview_alternate_text_info',
+      'preview_caption': 'preview_caption',
+      'preview_caption_info': 'preview_caption_info',
+      'preview_tags': 'preview_tags',
+      'preview_tags_info': 'preview_tags_info',
+      'preview_watermark_text': 'preview_watermark_text',
+      'preview_watermark_text_info': 'preview_watermark_text_info',
+      'preview_size': 'preview_size',
+      'upload_modal_title': 'upload_modal_title',
+      'upload_breadcrumbs_info': 'upload_breadcrumbs_info',
+      'upload_root_folder': 'upload_root_folder',
+      'upload_info_text': 'upload_info_text',
+      'upload_button_select': 'upload_button_select',
+      'upload_button_create': 'upload_button_create',
+      'upload_button_upload': 'upload_button_upload',
+      'upload_button_use_existing_resource': 'upload_button_use_existing_resource',
+      'upload_checkbox_overwrite': 'upload_checkbox_overwrite',
+      'upload_placeholder_new_folder': 'upload_placeholder_new_folder',
+      'upload_error_existing_resource': 'upload_error_existing_resource',
+      'upload_error_unsupported_resource_type': 'upload_error_unsupported_resource_type',
+    },
+    inputFields: {
+      locationId: 'locationId',
+      remoteId: 'remoteId',
+      type: 'type',
+      altText: 'altText',
+      caption: 'caption',
+      tags: 'tags[]',
+      cropSettings: 'cropSettings',
+      source: 'source',
+      watermarkText: 'watermarkText',
+      cssClass: 'cssClass',
+      selectedVariation: 'selectedVariation',
+    },
+    availableVariations: [],
+    allowedVisibilities: [],
+    allowedTypes: [],
+    allowedTags: [],
+    parentFolder: null,
+    folder: null,
+    uploadContext: {},
+    disableUpload: false,
+    hideFilename: false,
+  },
+  selectedImage: {
+    id: '',
+    name: '',
+    type: 'image',
+    format: '',
+    url: '',
+    browse_url: '',
+    previewUrl: '',
+    alternateText: '',
+    caption: '',
+    watermarkText: '',
+    tags: [],
+    size: '',
+    variations: {},
+    height: 0,
+    width: 0,
+    selectedVariation: null,
+    cssClass: '',
+  },
+};
diff --git a/bundle/Resources/public/js/ckeditor-plugin/conversion.js b/bundle/Resources/public/js/ckeditor-plugin/conversion.js
new file mode 100644
index 00000000..5c9ef8ab
--- /dev/null
+++ b/bundle/Resources/public/js/ckeditor-plugin/conversion.js
@@ -0,0 +1,11 @@
+import defineUpcast from './conversion/upcast';
+import defineDataDowncast from './conversion/data-downcast';
+import defineEditingDowncast from './conversion/editing-downcast';
+
+const setupDataCasting = (editor) => {
+  defineUpcast(editor);
+  defineDataDowncast(editor);
+  defineEditingDowncast(editor);
+};
+
+export default setupDataCasting;
diff --git a/bundle/Resources/public/js/ckeditor-plugin/conversion/data-downcast-utils/html-to-view.js b/bundle/Resources/public/js/ckeditor-plugin/conversion/data-downcast-utils/html-to-view.js
new file mode 100644
index 00000000..16790896
--- /dev/null
+++ b/bundle/Resources/public/js/ckeditor-plugin/conversion/data-downcast-utils/html-to-view.js
@@ -0,0 +1,81 @@
+const findViewParent = (viewElements, childIndex) => {
+    let parentView = null;
+    childIndex.split('.').slice(0, -1).forEach((viewElementIndex) => {
+        if (parentView === null) {
+            parentView = viewElements[viewElementIndex] ?? null;
+
+            return;
+        }
+
+        parentView = parentView.getChild(viewElementIndex);
+    });
+
+    return parentView;
+};
+
+let domParser = null;
+function htmlToView(htmlString, writer) {
+  if (domParser === null) {
+    domParser = new DOMParser();
+  }
+
+  const viewElements = [];
+
+  const htmlDocument = domParser.parseFromString(htmlString, 'text/html');
+  const htmlElements = [];
+  htmlDocument.querySelectorAll('body > *').forEach((element, index) => {
+    htmlElements.push({ element, index: index.toString() });
+  });
+  while (htmlElements.length > 0) {
+    const { element, index } = htmlElements.shift();
+
+    let childIndex = 0;
+    Object.entries(element.childNodes).forEach(([_, childNode]) => {
+      if (childNode.data?.trim().length === 0) {
+        return;
+      }
+
+      htmlElements.push({
+        element: childNode,
+        index: `${index}.${childIndex}`,
+      });
+      childIndex++;
+    });
+
+    const viewAttributes = {};
+    if (element.attributes) {
+      for (const attribute of element.attributes) {
+          viewAttributes[attribute.name] = attribute.value;
+      }
+    }
+
+    let createElement = null;
+    let elementValue = null;
+    if (element.childNodes.length > 0) {
+      createElement = writer.createContainerElement;
+      elementValue = element.nodeName.toLowerCase();
+    } else if (element.nodeName === '#text') {
+      createElement = writer.createText;
+      elementValue = element.data;
+    } else {
+      createElement = writer.createEmptyElement;
+      elementValue = element.nodeName.toLowerCase();
+    }
+    const viewElement = createElement.bind(writer)(
+      elementValue,
+      viewAttributes,
+    );
+
+    const parentView = findViewParent(viewElements, index);
+
+    if (parentView !== null) {
+        parentView._appendChild(viewElement);
+    } else {
+        viewElements.push(viewElement);
+    }
+  }
+
+  return viewElements;
+};
+
+export default htmlToView;
diff --git a/bundle/Resources/public/js/ckeditor-plugin/conversion/data-downcast.js b/bundle/Resources/public/js/ckeditor-plugin/conversion/data-downcast.js
new file mode 100644
index 00000000..49dccd31
--- /dev/null
+++ b/bundle/Resources/public/js/ckeditor-plugin/conversion/data-downcast.js
@@ -0,0 +1,37 @@
+/* eslint-disable no-console, no-param-reassign */
+import { dataView, dataModel, attributes, viewAttributes, pluginKey, defaultValue } from '../constants';
+
+/**
+ * Defines the data downcast conversion.
+ * Data downcasting converts the model element to the read-only view element for saving in the database.
+ * This element is also rendered on the front web.
+ */
+const defineDataDowncast = (editor) => {
+  editor.conversion.for('dataDowncast').elementToElement({
+    model: dataModel.name,
+    view(modelElement, { writer }) {
+      const selectedImage = modelElement.getAttribute(attributes.selectedImage);
+      const locationId = modelElement.getAttribute(attributes.locationId);
+      const viewResourceEndpoint = editor.config.get(pluginKey).endpoints.viewResource ?? defaultValue.endpoints.viewResource;
+
+      const wrapper = writer.createContainerElement(
+        dataView.name,
+        {
+          class: dataView.classes,
+          style: `text-align=${modelElement.getAttribute(attributes.alignment)};`,
+          [viewAttributes.fieldId]: modelElement.getAttribute(attributes.fieldId),
+          [viewAttributes.locationId]: locationId,
+          [viewAttributes.cssClass]: selectedImage.cssClass,
+          [viewAttributes.variationName]: selectedImage.selectedVariation?.label ?? null,
+          [viewAttributes.variationGroup]: editor.config.get(pluginKey).variationGroup,
+          [viewAttributes.viewEndpoint]: viewResourceEndpoint(locationId),
+          [viewAttributes.alignment]: modelElement.getAttribute(attributes.alignment),
+        },
+      );
+
+      return wrapper;
+    },
+  });
+};
+
+export default defineDataDowncast;
diff --git a/bundle/Resources/public/js/ckeditor-plugin/conversion/editing-downcast-utils/handle-remote-resource-location.js b/bundle/Resources/public/js/ckeditor-plugin/conversion/editing-downcast-utils/handle-remote-resource-location.js
new file mode 100644
index 00000000..56b0ade4
--- /dev/null
+++ b/bundle/Resources/public/js/ckeditor-plugin/conversion/editing-downcast-utils/handle-remote-resource-location.js
@@ -0,0 +1,23 @@
+import { attributes } from '../../constants';
+import createLocation from './remote-resource-location/create';
+import deleteLocation from './remote-resource-location/delete';
+import updateLocation from './remote-resource-location/update';
+
+const handleRemoteResourceLocation = ({ editor, model, domElement, eventDetail: { selectedImage, inputFields } }) => {
+  selectedImage.cropSettings = domElement.querySelector(`[name="${inputFields.cropSettings}"]`)?.value ?? '';
+
+  const oldImage = model.getAttribute(attributes.selectedImage);
+  if (oldImage.id !== selectedImage.id) {
+    if (oldImage.id) {
+      deleteLocation({ editor, model });
+    }
+
+    if (selectedImage.id) {
+      createLocation({ editor, model, selectedImage });
+    }
+  } else {
+    updateLocation({ editor, model, selectedImage });
+  }
+};
+
+export default handleRemoteResourceLocation;
diff --git a/bundle/Resources/public/js/ckeditor-plugin/conversion/editing-downcast-utils/operation-handlers/alignment.js b/bundle/Resources/public/js/ckeditor-plugin/conversion/editing-downcast-utils/operation-handlers/alignment.js
new file mode 100644
index 00000000..08c1604e
--- /dev/null
+++ b/bundle/Resources/public/js/ckeditor-plugin/conversion/editing-downcast-utils/operation-handlers/alignment.js
@@ -0,0 +1,21 @@
+import { attributes, pluginKey } from '../../../constants';
+
+const handleAlignment = ({ event, editor, operation }) => {
+    const selectedElement = event.source.selection.getSelectedElement();
+    if (selectedElement?.name !== pluginKey) {
+        return;
+    }
+
+    const fieldId = selectedElement.getAttribute(attributes.fieldId)
+    const ngremotemediaParent = editor.sourceElement.nextElementSibling.querySelector(`[${attributes.fieldId}=${fieldId}]`);
+
+    const image = ngremotemediaParent.querySelector('img')?.parentElement;
+
+    if (image === null) {
+      return;
+    }
+
+    image.style.textAlign = operation.newValue ?? '';
+};
+
+export default handleAlignment;
diff --git a/bundle/Resources/public/js/ckeditor-plugin/conversion/editing-downcast-utils/operation-handlers/index.js b/bundle/Resources/public/js/ckeditor-plugin/conversion/editing-downcast-utils/operation-handlers/index.js
new file mode 100644
index 00000000..c346fed7
--- /dev/null
+++ b/bundle/Resources/public/js/ckeditor-plugin/conversion/editing-downcast-utils/operation-handlers/index.js
@@ -0,0 +1,4 @@
+import alignment from './alignment';
+import remove from './remove';
+
+export { alignment, remove };
diff --git a/bundle/Resources/public/js/ckeditor-plugin/conversion/editing-downcast-utils/operation-handlers/remove.js b/bundle/Resources/public/js/ckeditor-plugin/conversion/editing-downcast-utils/operation-handlers/remove.js
new file mode 100644
index 00000000..c90c4edb
--- /dev/null
+++ b/bundle/Resources/public/js/ckeditor-plugin/conversion/editing-downcast-utils/operation-handlers/remove.js
@@ -0,0 +1,17 @@
+import { attributes, pluginKey } from "../../../constants";
+import deleteLocation from "../remote-resource-location/delete";
+
+const handleRemove = ({ editor, operation }) => {
+  if (
+    operation.targetPosition.nodeAfter.name !== pluginKey ||
+    operation.batch.operations[0].type === "detach"
+  ) {
+    return;
+  }
+
+  if (operation.targetPosition.nodeAfter.getAttribute(attributes.locationId)) {
+    deleteLocation({ editor, model: operation.targetPosition.nodeAfter });
+  }
+};
+
+export default handleRemove;
diff --git a/bundle/Resources/public/js/ckeditor-plugin/conversion/editing-downcast-utils/remote-resource-location/create.js b/bundle/Resources/public/js/ckeditor-plugin/conversion/editing-downcast-utils/remote-resource-location/create.js
new file mode 100644
index 00000000..c930c747
--- /dev/null
+++ b/bundle/Resources/public/js/ckeditor-plugin/conversion/editing-downcast-utils/remote-resource-location/create.js
@@ -0,0 +1,21 @@
+import { attributes, defaultValue, pluginKey } from '../../../constants';
+
+const createLocation = ({ editor, model, selectedImage }) => {
+  const createLocationEndpoint = editor.config.get(pluginKey).endpoints.createLocation ?? defaultValue.endpoints.createLocation;
+
+  fetch(createLocationEndpoint, {
+    method: 'POST',
+    body: JSON.stringify({
+      ...selectedImage,
+      source: editor.config.get(pluginKey).source
+    }),
+  })
+    .then(response => response.json())
+    .then(({ locationId }) => {
+      editor.model.change((writer) => {
+        writer.setAttribute(attributes.locationId, locationId, model);
+      });
+    });
+};
+
+export default createLocation;
diff --git a/bundle/Resources/public/js/ckeditor-plugin/conversion/editing-downcast-utils/remote-resource-location/delete.js b/bundle/Resources/public/js/ckeditor-plugin/conversion/editing-downcast-utils/remote-resource-location/delete.js
new file mode 100644
index 00000000..2a5f443f
--- /dev/null
+++ b/bundle/Resources/public/js/ckeditor-plugin/conversion/editing-downcast-utils/remote-resource-location/delete.js
@@ -0,0 +1,11 @@
+import { attributes, defaultValue, pluginKey } from '../../../constants';
+
+const deleteLocation = ({ editor, model }) => {
+  const deleteLocationEndpoint = editor.config.get(pluginKey).endpoints.deleteLocation ?? defaultValue.endpoints.deleteLocation;
+
+  fetch(deleteLocationEndpoint(model.getAttribute(attributes.locationId)), {
+    method: 'DELETE',
+  });
+};
+
+export default deleteLocation;
diff --git a/bundle/Resources/public/js/ckeditor-plugin/conversion/editing-downcast-utils/remote-resource-location/update.js b/bundle/Resources/public/js/ckeditor-plugin/conversion/editing-downcast-utils/remote-resource-location/update.js
new file mode 100644
index 00000000..6f038538
--- /dev/null
+++ b/bundle/Resources/public/js/ckeditor-plugin/conversion/editing-downcast-utils/remote-resource-location/update.js
@@ -0,0 +1,12 @@
+import { attributes, defaultValue, pluginKey } from '../../../constants';
+
+const updateLocation = ({ editor, model, selectedImage }) => {
+  const updateLocationEndpoint = editor.config.get(pluginKey).endpoints.updateLocation ?? defaultValue.endpoints.updateLocation;
+
+  fetch(updateLocationEndpoint(model.getAttribute(attributes.locationId)), {
+    method: 'PUT',
+    body: JSON.stringify(selectedImage),
+  });
+};
+
+export default updateLocation;
diff --git a/bundle/Resources/public/js/ckeditor-plugin/conversion/editing-downcast-utils/render-field.js b/bundle/Resources/public/js/ckeditor-plugin/conversion/editing-downcast-utils/render-field.js
new file mode 100644
index 00000000..e4b5dedc
--- /dev/null
+++ b/bundle/Resources/public/js/ckeditor-plugin/conversion/editing-downcast-utils/render-field.js
@@ -0,0 +1,50 @@
+import { createElement } from '@ckeditor/ckeditor5-utils';
+import { attributes, defaultValue, pluginKey } from '../../constants';
+
+const renderField = ({ domElement, model, editor }) => {
+  // eslint-disable-next-line no-param-reassign
+  domElement.textContent = '';
+
+  const pluginConfig = editor.config.get(pluginKey);
+  const config = JSON.stringify(Object.assign({}, defaultValue.config, pluginConfig.config));
+  const fieldId = model.getAttribute(attributes.fieldId);
+  const selectedImage = JSON.stringify(model.getAttribute(attributes.selectedImage));
+  domElement.append(
+    createElement(
+      domElement.ownerDocument,
+      'div',
+      {
+        class: 'ngremotemedia-container',
+        'data-id': fieldId,
+        'v-init:selected-image': selectedImage,
+        'v-init:config': config,
+      },
+      [
+        createElement(domElement.ownerDocument, 'interactions', {
+          'field-id': fieldId,
+          ':selected-image': selectedImage,
+          ':config': config,
+        }),
+      ],
+    ),
+  );
+
+  const observer = new MutationObserver((_, observer) => {
+    const image = domElement.querySelector('img');
+    if (image !== null) {
+      image.parentElement.style.textAlign = model.getAttribute('alignment') ?? '';
+    }
+
+    const changedField = model.getAttribute(attributes.changedField);
+    if (changedField && changedField !== 'modal') {
+      const field = domElement.querySelector(`[name="${changedField}"]`);
+      field?.scrollIntoView({ behaviour: 'smooth', block: 'center' });
+      field?.focus();
+    }
+
+    observer.disconnect();
+  });
+  observer.observe(domElement, { childList: true, subtree: true });
+};
+
+export default renderField;
diff --git a/bundle/Resources/public/js/ckeditor-plugin/conversion/editing-downcast.js b/bundle/Resources/public/js/ckeditor-plugin/conversion/editing-downcast.js
new file mode 100644
index 00000000..2b91cde3
--- /dev/null
+++ b/bundle/Resources/public/js/ckeditor-plugin/conversion/editing-downcast.js
@@ -0,0 +1,86 @@
+/* eslint-disable no-console */
+import { dataModel, attributes, pluginKey, editingView, defaultValue } from '../constants';
+import { toWidget } from '@ckeditor/ckeditor5-widget';
+import renderField from './editing-downcast-utils/render-field';
+import * as operationHandlers from './editing-downcast-utils/operation-handlers';
+import createLocation from './editing-downcast-utils/remote-resource-location/create';
+import handleRemoteResourceLocation from './editing-downcast-utils/handle-remote-resource-location';
+
+/**
+ * Defines the editing downcast conversion.
+ * Editing downcasting converts the model element to the editable view element. Used when editing content.
+ */
+const defineEditingDowncast = (editor) => {
+  editor.model.document.on('change:data', (event, action) => {
+    action.operations.forEach(operation => {
+      let key = operation.type;
+      if (key === 'changeAttribute') {
+        key = operation.key;
+      }
+      operationHandlers[key]?.({ event, editor, operation });
+    });
+  });
+
+  editor.conversion.for('editingDowncast').elementToStructure({
+    model: dataModel,
+    view(modelElement, { writer }) {
+      let domContentWrapper;
+
+      const viewContentWrapper = writer.createRawElement(
+        'div',
+        {
+          class: 'ngremotemedia-wrapper',
+        },
+        (domElement) => {
+          domContentWrapper = domElement;
+          renderField({ domElement, model: modelElement, editor });
+
+          domContentWrapper.addEventListener('ngrm-change', ({ detail }) => {
+            handleRemoteResourceLocation({ editor, model: modelElement, eventDetail: detail, domElement })
+
+            editor.model.change((writer) => {
+              writer.setAttribute(attributes.selectedImage, detail.selectedImage, modelElement);
+              writer.setAttribute(attributes.changedField, detail.changedField, modelElement);
+            });
+          });
+
+          // Enable selection of widget from inside, needed due to `data-cke-ignore-events` class on raw element
+          domContentWrapper.addEventListener(
+            'mousedown',
+            () => {
+              const { model } = editor;
+              const selectedElement = model.document.selection.getSelectedElement();
+
+              // Move the selection onto the whole HTML embed widget if it's currently not selected.
+              if (selectedElement !== modelElement) {
+                model.change((writer) => writer.setSelection(modelElement, 'on'));
+              }
+            },
+            true,
+          );
+        },
+      );
+      writer.setAttribute('data-cke-ignore-events', 'true', viewContentWrapper);
+
+      const viewContainer = writer.createContainerElement(
+        editingView.name,
+        {
+          class: editingView.classes,
+          'data-label': 'Remote media file',
+          'field-id': modelElement.getAttribute(attributes.fieldId),
+          dir: editor.locale.uiLanguageDirection,
+        },
+        viewContentWrapper,
+      );
+
+      const view = toWidget(viewContainer, writer, {
+        label: 'Remote media file',
+        hasSelectionHandle: true,
+      });
+
+      return view;
+    },
+  });
+};
+
+export default defineEditingDowncast;
diff --git a/bundle/Resources/public/js/ckeditor-plugin/conversion/upcast.js b/bundle/Resources/public/js/ckeditor-plugin/conversion/upcast.js
new file mode 100644
index 00000000..e3b7806f
--- /dev/null
+++ b/bundle/Resources/public/js/ckeditor-plugin/conversion/upcast.js
@@ -0,0 +1,45 @@
+/* eslint-disable no-console */
+import { dataView, dataModel, attributes, viewAttributes, pluginKey, defaultValue } from '../constants';
+
+/**
+ * Defines the upcast conversion.
+ * Upcasting converts the saved view element (data downcast) into the model when loading the editor.
+ * The model is then used in editing downcast to render the editor field.
+ */
+const defineUpcast = (editor) => {
+  editor.conversion.for('upcast').elementToElement({
+    view: dataView,
+    model(viewElement, { writer }) {
+      const locationId = viewElement.getAttribute(viewAttributes.locationId);
+      const model = writer.createElement(dataModel.name, {
+        [attributes.fieldId]: viewElement.getAttribute(viewAttributes.fieldId),
+        [attributes.locationId]: locationId,
+        [attributes.selectedImage]: defaultValue.selectedImage,
+      });
+      const getSelectedImageEndpoint = editor.config.get(pluginKey).endpoints.getSelectedImage ?? defaultValue.endpoints.getSelectedImage;
+
+      fetch(getSelectedImageEndpoint(locationId))
+        .then(response => response.json())
+        .then((selectedImage) => {
+          editor.model.change((writer) => {
+            const selectedVariationName = viewElement.getAttribute(viewAttributes.variationName);
+            writer.setAttribute(
+              attributes.selectedImage,
+              {
+                ...selectedImage,
+                cssClass: viewElement.getAttribute(viewAttributes.cssClass),
+                selectedVariation: {
+                  label: selectedVariationName,
+                  value: selectedImage.variations[selectedVariationName]},
+              },
+              model,
+            );
+          })
+        });
+
+      return model;
+    },
+  });
+};
+
+export default defineUpcast;
diff --git a/bundle/Resources/public/js/ckeditor-plugin/index.js b/bundle/Resources/public/js/ckeditor-plugin/index.js
new file mode 100644
index 00000000..9d2fbd53
--- /dev/null
+++ b/bundle/Resources/public/js/ckeditor-plugin/index.js
@@ -0,0 +1,5 @@
+import NetgenRemoteMediaPlugin from './plugin';
+import { pluginKey } from './constants';
+import renderNgrmEditorViews from './render-views';
+
+export { NetgenRemoteMediaPlugin, pluginKey as netgenremoteMediaPluginKey, renderNgrmEditorViews };
diff --git a/bundle/Resources/public/js/ckeditor-plugin/plugin.js b/bundle/Resources/public/js/ckeditor-plugin/plugin.js
new file mode 100644
index 00000000..34991458
--- /dev/null
+++ b/bundle/Resources/public/js/ckeditor-plugin/plugin.js
@@ -0,0 +1,33 @@
+import { dataModel, defaultValue, pluginKey } from './constants';
+
+import NetgenRemoteMediaCommand from './command';
+import getNetgenRemoteMediaToolbarButton from './button';
+
+import setupDataCasting from './conversion';
+
+const NetgenRemoteMediaPlugin = (editor) => {
+  editor.config.define(pluginKey, {
+    /** Editor field */
+    fieldId: null,
+    /** Netgen Remote Media configuration */
+    config: null,
+    /** Variation group for view */
+    variationGroup: null,
+    /** Source for remote resource locations */
+    source: null,
+    /** Endpoints for handling resources */
+    endpoints: defaultValue.endpoints,
+  });
+
+  editor.commands.add(pluginKey, new NetgenRemoteMediaCommand(editor));
+  editor.ui.componentFactory.add(pluginKey, () => getNetgenRemoteMediaToolbarButton(editor));
+
+  editor.model.schema.register(pluginKey, {
+    inheritAllFrom: '$blockObject',
+    allowAttributes: dataModel.attributes,
+  });
+
+  setupDataCasting(editor);
+};
+
+export default NetgenRemoteMediaPlugin;
diff --git a/bundle/Resources/public/js/ckeditor-plugin/render-views.js b/bundle/Resources/public/js/ckeditor-plugin/render-views.js
new file mode 100644
index 00000000..d2df4641
--- /dev/null
+++ b/bundle/Resources/public/js/ckeditor-plugin/render-views.js
@@ -0,0 +1,46 @@
+import { viewAttributes, dataView } from './constants';
+
+const renderViews = () => {
+  document.querySelectorAll(`.${dataView.classes}`).forEach(async (ngrmElement) => {
+    const queryParams = [];
+    if (ngrmElement.getAttribute(viewAttributes.cssClass)) {
+      queryParams.push(`css_class=${ngrmElement.getAttribute(viewAttributes.cssClass)}`);
+    }
+    if (ngrmElement.getAttribute(viewAttributes.variationGroup)) {
+      queryParams.push(`variation_group=${ngrmElement.getAttribute(viewAttributes.variationGroup)}`);
+    }
+    if (ngrmElement.getAttribute(viewAttributes.variationName)) {
+      queryParams.push(`variation_name=${ngrmElement.getAttribute(viewAttributes.variationName)}`);
+    }
+    if (ngrmElement.getAttribute(viewAttributes.alignment)) {
+      queryParams.push(`alignment=${ngrmElement.getAttribute(viewAttributes.alignment)}`);
+    }
+
+    let url = ngrmElement.getAttribute(viewAttributes.viewEndpoint);
+    if (queryParams.length) {
+      url += `?${queryParams.join('&')}`;
+    }
+
+    const renderedView = await fetch(url).then((response) => {
+      if (!response.ok) {
+        console.error(response.error);
+      }
+
+      return response.text();
+    });
+
+    ngrmElement.outerHTML = renderedView;
+  });
+};
+
+const render = () => {
+  if (document.readyState === 'loading') {
+    document.addEventListener('DOMContentLoaded', renderViews);
+  } else {
+    renderViews();
+  }
+};
+
+render();
+
+export default render;
diff --git a/bundle/Resources/public/js/ckeditor-plugin/utils/data-param-conversion.js b/bundle/Resources/public/js/ckeditor-plugin/utils/data-param-conversion.js
new file mode 100644
index 00000000..a52daba7
--- /dev/null
+++ b/bundle/Resources/public/js/ckeditor-plugin/utils/data-param-conversion.js
@@ -0,0 +1,2 @@
+export const dataParamStringify = object => JSON.stringify(object).replace(/"/g, '&quot;');
+export const dataParamParse = string => JSON.parse(string.replace(/&quot;/g, '"'));
diff --git a/bundle/Resources/public/js/ckeditor-plugin/utils/find-elements-in-model.js b/bundle/Resources/public/js/ckeditor-plugin/utils/find-elements-in-model.js
new file mode 100644
index 00000000..690ae30c
--- /dev/null
+++ b/bundle/Resources/public/js/ckeditor-plugin/utils/find-elements-in-model.js
@@ -0,0 +1,22 @@
+export const findElementsInModel = function (root, type) {
+  const search = [...root.getChildren()];
+  const nodes = [];
+
+  while (search.length > 0) {
+    const element = search.shift();
+
+    if (element.name === type) {
+      nodes.push(element);
+    }
+
+    if (element.childCount > 0) {
+      for (const child of element.getChildren()) {
+        if (child.name !== undefined) {
+          search.push(child);
+        }
+      }
+    }
+  }
+
+  return nodes;
+};
diff --git a/bundle/Resources/public/js/remotemedia.js b/bundle/Resources/public/js/remotemedia.js
index ea7606d9..93da2f48 100644
--- a/bundle/Resources/public/js/remotemedia.js
+++ b/bundle/Resources/public/js/remotemedia.js
@@ -1,2 +1,2 @@
-(function(e){function t(t){for(var i,o,r=t[0],l=t[1],c=t[2],f=0,u=[];f<r.length;f++)o=r[f],Object.prototype.hasOwnProperty.call(n,o)&&n[o]&&u.push(n[o][0]),n[o]=0;for(i in l)Object.prototype.hasOwnProperty.call(l,i)&&(e[i]=l[i]);d&&d(t);while(u.length)u.shift()();return s.push.apply(s,c||[]),a()}function a(){for(var e,t=0;t<s.length;t++){for(var a=s[t],i=!0,r=1;r<a.length;r++){var l=a[r];0!==n[l]&&(i=!1)}i&&(s.splice(t--,1),e=o(o.s=a[0]))}return e}var i={},n={app:0},s=[];function o(t){if(i[t])return i[t].exports;var a=i[t]={i:t,l:!1,exports:{}};return e[t].call(a.exports,a,a.exports,o),a.l=!0,a.exports}o.m=e,o.c=i,o.d=function(e,t,a){o.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:a})},o.r=function(e){"undefined"!==typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},o.t=function(e,t){if(1&t&&(e=o(e)),8&t)return e;if(4&t&&"object"===typeof e&&e&&e.__esModule)return e;var a=Object.create(null);if(o.r(a),Object.defineProperty(a,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var i in e)o.d(a,i,function(t){return e[t]}.bind(null,i));return a},o.n=function(e){var t=e&&e.__esModule?function(){return e["default"]}:function(){return e};return o.d(t,"a",t),t},o.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},o.p="/";var r=window["webpackJsonp"]=window["webpackJsonp"]||[],l=r.push.bind(r);r.push=t,r=r.slice();for(var c=0;c<r.length;c++)t(r[c]);var d=l;s.push(["56d7","chunk-vendors"]),a()})({"11ef":function(e,t,a){"use strict";var i=a("56ae"),n=a.n(i);n.a},1994:function(e,t,a){},"1c87":function(e,t,a){},"2d36":function(e,t,a){},3076:function(e,t,a){},3601:function(e,t,a){},"3fb5":function(e,t,a){},"4d22":function(e,t,a){"use strict";var i=a("5450"),n=a.n(i);n.a},5450:function(e,t,a){},"56ae":function(e,t,a){},"56d7":function(e,t,a){"use strict";a.r(t);a("cadf"),a("551c"),a("f751"),a("097d");var i=a("a026"),n=a("2b88"),s=a.n(n),o=a("d1d6"),r=a.n(o),l=(a("3fb5"),a("6107"),function(){var e=this,t=e.$createElement,a=e._self._c||t;return a("div",[a("preview",{ref:"preview",attrs:{config:e.config,"field-id":e.fieldId,"selected-image":e.selectedImage},on:{"preview-change":e.dispatchVanillaChangeEvent}}),a("div",{staticClass:"ngremotemedia-buttons",attrs:{id:"ngremotemedia-buttons-"+e.fieldId,"data-id":e.fieldId}},[a("input",{directives:[{name:"model",rawName:"v-model",value:e.selectedImage.id,expression:"selectedImage.id"}],staticClass:"media-id",attrs:{name:this.config.inputFields.remoteId,type:"hidden"},domProps:{value:e.selectedImage.id},on:{input:function(t){t.target.composing||e.$set(e.selectedImage,"id",t.target.value)}}}),e.isCroppable?a("input",{staticClass:"ngremotemedia-scale hid btn",attrs:{value:this.config.translations.interactions_scale,type:"button"},on:{click:e.handleCropClicked}}):e._e(),e.selectedImage.id?a("input",{staticClass:"ngremotemedia-remove-file btn",attrs:{value:this.config.translations.interactions_remove_media,type:"button"},on:{click:e.handleRemoveMediaClicked}}):e._e(),a("input",{staticClass:"ngremotemedia-remote-file btn",attrs:{value:this.selectedImage.id?this.config.translations.interactions_manage_media:this.config.translations.interactions_select_media,type:"button"},on:{click:e.handleBrowseMediaClicked}}),this.config.disableUpload?e._e():a("div",{staticClass:"ngremotemedia-local-file-container"},[a("button",{staticClass:"btn btn-default ngremotemedia-local-file btn upload-from-disk",attrs:{type:"button"}},[a("Label",{attrs:{for:e.fieldId+"_file_upload"}},[e._v("\n                    "+e._s(this.config.translations.interactions_quick_upload)+"\n                ")]),a("input",{ref:"fileUploadInput",attrs:{id:e.fieldId+"_file_upload",name:this.config.inputFields.new_file,hidden:"",type:"file"},on:{change:e.handleFileInputChange}})],1)])]),a("input",{directives:[{name:"model",rawName:"v-model",value:e.stringifiedVariations,expression:"stringifiedVariations"}],staticClass:"media-id",attrs:{name:this.config.inputFields.cropSettings,type:"hidden"},domProps:{value:e.stringifiedVariations},on:{input:function(t){t.target.composing||(e.stringifiedVariations=t.target.value)}}}),a("portal",{attrs:{to:"ngrm-body-modal-"+e.fieldId}},[e.cropModalOpen?a("crop-modal",{attrs:{"available-variations":this.config.availableVariations,"selected-image":e.selectedImage,translations:e.config.translations},on:{change:e.handleVariationCropChange,close:e.handleCropModalClose}}):e._e(),e.mediaModalOpen?a("media-modal",{attrs:{config:e.config,paths:e.config.paths,"selected-media-id":e.selectedImage.id,tags:e.tags,types:e.types,visibilities:e.visibilities},on:{close:e.handleMediaModalClose,"media-selected":e.handleMediaSelected}}):e._e(),e.uploadModalOpen?a("upload-modal",{attrs:{config:e.config,file:e.newFile,visibilities:e.visibilities},on:{close:e.handleUploadModalClose,uploaded:e.handleResourceUploaded}}):e._e()],1),a("portal-target",{class:"ngrm-model-portal-"+e.fieldId,attrs:{name:"ngrm-body-modal-"+e.fieldId}})],1)}),c=[],d=(a("8e6e"),a("96cf"),a("3b8d")),f=a("bd86"),u=(a("ac6a"),a("456d"),function(){var e=this,t=e.$createElement,a=e._self._c||t;return e.selectedImage.id?a("div",{staticClass:"ngremotemedia-image"},[a("div",{staticClass:"image-wrap"},["image"===e.selectedImage.type||"video"===e.selectedImage.type?a("img",{ref:"image",attrs:{src:e.selectedImage.previewUrl}}):a("span",{staticClass:"file-placeholder"},[a("span",{staticClass:"icon-doc"},["pdf"===e.selectedImage.format?a("i",{staticClass:"fa fa-file-pdf-o"}):"zip"===e.selectedImage.format||"rar"===e.selectedImage.format?a("i",{staticClass:"fa fa-file-archive-o"}):"ppt"===e.selectedImage.format||"pptx"===e.selectedImage.format?a("i",{staticClass:"fa fa-file-powerpoint-o"}):"doc"===e.selectedImage.format||"docx"===e.selectedImage.format?a("i",{staticClass:"fa fa-file-word-o"}):"xls"===e.selectedImage.format||"xlsx"===e.selectedImage.format?a("i",{staticClass:"fa fa-file-excel-o"}):"aac"===e.selectedImage.format||"aiff"===e.selectedImage.format||"amr"===e.selectedImage.format||"flac"===e.selectedImage.format||"m4a"===e.selectedImage.format||"mp3"===e.selectedImage.format||"ogg"===e.selectedImage.format||"opus"===e.selectedImage.format||"wav"===e.selectedImage.format?a("i",{staticClass:"fa fa-file-audio-o"}):"txt"===e.selectedImage.format?a("i",{staticClass:"fa fa-lg fa-file-text"}):a("i",{staticClass:"fa fa-file"})])])]),a("div",{staticClass:"image-meta"},[a("input",{directives:[{name:"model",rawName:"v-model",value:e.selectedImage.type,expression:"selectedImage.type"}],attrs:{type:"hidden",name:this.config.inputFields.type},domProps:{value:e.selectedImage.type},on:{input:function(t){t.target.composing||e.$set(e.selectedImage,"type",t.target.value)}}}),a("h3",{staticClass:"title"},[e._v(e._s(e.selectedImage.name))]),a("p",[e._v(e._s(this.config.translations.preview_size)+": "+e._s(e.formattedSize))]),a("p",[e._v(e._s(e.selectedImage.type)+" / "+e._s(e.selectedImage.format))]),a("div",{staticClass:"image-meta-data"},[a("div",{staticClass:"ngremotemedia-alttext"},[a("span",{staticClass:"help-block description"},[e._v("\n            "+e._s(this.config.translations.preview_alternate_text)+"\n            "),a("i",{staticClass:"fa fa-info-circle",attrs:{"data-toggle":"tooltip","data-placement":"right",title:this.config.translations.preview_alternate_text_info}})]),a("input",{directives:[{name:"model",rawName:"v-model",value:e.selectedImage.alternateText,expression:"selectedImage.alternateText"},{name:"debounce",rawName:"v-debounce:500ms",value:e.dispatchChangeEvent,expression:"dispatchChangeEvent",arg:"500ms"}],staticClass:"media-alttext data",attrs:{type:"text",name:this.config.inputFields.altText},domProps:{value:e.selectedImage.alternateText},on:{input:function(t){t.target.composing||e.$set(e.selectedImage,"alternateText",t.target.value)}}})]),a("div",{staticClass:"ngremotemedia-caption"},[a("span",{staticClass:"help-block description"},[e._v("\n            "+e._s(this.config.translations.preview_caption)+"\n            "),a("i",{staticClass:"fa fa-info-circle",attrs:{"data-toggle":"tooltip","data-placement":"right",title:this.config.translations.preview_caption_info}})]),a("input",{directives:[{name:"model",rawName:"v-model",value:e.selectedImage.caption,expression:"selectedImage.caption"},{name:"debounce",rawName:"v-debounce:500ms",value:e.dispatchChangeEvent,expression:"dispatchChangeEvent",arg:"500ms"}],staticClass:"media-caption data",attrs:{type:"text",name:this.config.inputFields.caption},domProps:{value:e.selectedImage.caption},on:{input:function(t){t.target.composing||e.$set(e.selectedImage,"caption",t.target.value)}}})]),a("div",{staticClass:"ngremotemedia-tags"},[a("span",{staticClass:"help-block description"},[e._v("\n            "+e._s(this.config.translations.preview_tags)+"\n            "),a("i",{staticClass:"fa fa-info-circle",attrs:{"data-toggle":"tooltip","data-placement":"right",title:this.config.translations.preview_tags_info}})]),a("v-select",{attrs:{options:e.config.allowedTags.length>0?e.config.allowedTags:e.allTags,multiple:"",taggable:0===e.config.allowedTags.length},on:{input:e.handleTagsInput},model:{value:e.selectedImage.tags,callback:function(t){e.$set(e.selectedImage,"tags",t)},expression:"selectedImage.tags"}}),a("select",{directives:[{name:"model",rawName:"v-model",value:e.selectedImage.tags,expression:"selectedImage.tags"}],staticClass:"ngremotemedia-newtags",attrs:{hidden:"",name:this.config.inputFields.tags,multiple:"multiple"},on:{change:function(t){var a=Array.prototype.filter.call(t.target.options,(function(e){return e.selected})).map((function(e){var t="_value"in e?e._value:e.value;return t}));e.$set(e.selectedImage,"tags",t.target.multiple?a:a[0])}}},e._l(e.allTags,(function(t){return a("option",{key:t},[e._v(e._s(t))])})),0)],1),a("div",{staticClass:"ngremotemedia-watermark-text"},[a("span",{staticClass:"help-block description"},[e._v("\n          "+e._s(this.config.translations.preview_watermark_text)+"\n          "),a("i",{staticClass:"fa fa-info-circle",attrs:{"data-toggle":"tooltip","data-placement":"right",title:this.config.translations.preview_watermark_text_info}})]),a("input",{directives:[{name:"model",rawName:"v-model",value:e.selectedImage.watermarkText,expression:"selectedImage.watermarkText"},{name:"debounce",rawName:"v-debounce:500ms",value:e.dispatchChangeEvent,expression:"dispatchChangeEvent",arg:"500ms"}],staticClass:"media-watermarktext data",attrs:{type:"text",name:this.config.inputFields.watermarkText},domProps:{value:e.selectedImage.watermarkText},on:{input:function(t){t.target.composing||e.$set(e.selectedImage,"watermarkText",t.target.value)}}})])])])]):a("div",[a("i",[e._v(e._s(this.config.translations.interactions_no_media_selected))])])}),p=[],h=(a("5df3"),a("4f7f"),a("75fc")),m=(a("28a5"),a("01c8")),g=function(e){var t=[];for(var a in e)t.push(encodeURIComponent(a)+"="+encodeURIComponent(e[a]));return t.join("&")},v=function(e){return e[0].toUpperCase()+e.slice(1)},b=function(e){var t=e.split("-"),a=Object(m["a"])(t),i=a[0],n=a.slice(1);return[i].concat(Object(h["a"])(n.map(v))).join("")},_=function(e,t){var a=Math.pow(10,t);return parseFloat(Math.round(e*a)/a).toFixed(t)},w={B:"KB",KB:"MB",MB:"GB",GB:"TB"},y=function e(t){var a=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"B",i=w[a];return!i||t<1024?"".concat(_(t,2)," ").concat(a):e(t/1024,i)},C=a("4a7a"),x=a.n(C),O={name:"Preview",props:["config","fieldId","selectedImage"],data:function(){return{allTags:[]}},components:{"v-select":x.a},computed:{nonImagePreviewClass:function(){return"video"===this.selectedImage.type?"ng-video":"ng-book"},formattedSize:function(){return y(this.selectedImage.size)}},methods:{handleTagsInput:function(e){this.allTags=Object(h["a"])(new Set([].concat(Object(h["a"])(this.allTags),Object(h["a"])(e)))),this.dispatchChangeEvent()},dispatchChangeEvent:function(){this.$emit("preview-change")}},mounted:function(){this.allTags=Object(h["a"])(this.selectedImage.tags)},watch:{selectedImage:function(){this.allTags=Object(h["a"])(this.selectedImage.tags)}}},I=O,F=(a("fc96"),a("2877")),V=Object(F["a"])(I,u,p,!1,null,"2db10e6e",null),k=V.exports,j=function(){var e=this,t=e.$createElement,a=e._self._c||t;return a("modal",{attrs:{title:this.config.translations.browse_title},on:{close:function(t){return e.$emit("close")}}},[a("media-facets",{attrs:{config:e.config,tags:e.tags,types:e.types,visibilities:e.visibilities,facets:e.facets,"facets-loading":e.facetsLoading},on:{change:e.handleFacetsChange}}),a("media-gallery",{attrs:{translations:e.config.translations,media:e.media,canLoadMore:e.canLoadMore,selectedMediaId:e.selectedMediaId,loading:e.loading},on:{loadMore:e.handleLoadMore,"media-selected":function(t){return e.$emit("media-selected",t)}}}),e.loading?a("i",{staticClass:"ng-icon ng-spinner"}):e._e()],1)},S=[],M=a("768b"),T=(a("ffc1"),function(){var e=this,t=e.$createElement,a=e._self._c||t;return a("div",{staticClass:"mediaFacets"},[a("div",{staticClass:"body"},[e.types.length>1?a("div",{staticClass:"form-field"},[a("label",{attrs:{for:"type"}},[e._v(e._s(this.config.translations.browse_select_type))]),a("v-select",{attrs:{options:e.types,label:"name",reduce:function(e){return e.id},placeholder:e.facetsLoading?this.config.translations.browse_loading_types:this.config.translations.browse_all_types},on:{input:e.handleTypeChange},model:{value:e.selectedType,callback:function(t){e.selectedType=t},expression:"selectedType"}})],1):e._e(),e.folders&&!this.config.folder?a("div",{staticClass:"form-field"},[a("label",{attrs:{for:"folder"}},[e._v(e._s(this.config.translations.browse_select_folder))]),a("treeselect",{attrs:{multiple:!1,options:e.folders,"load-options":e.loadSubFolders,value:this.config.parentFolder?this.config.parentFolder.id:"",placeholder:e.facetsLoading?this.config.translations.browse_loading_folders:this.config.translations.browse_all_folders,disabled:e.facetsLoading,clearable:!0,beforeClearAll:e.clearFolderField,defaultExpandLevel:1},on:{input:e.handleFolderChange},model:{value:e.selectedFolder,callback:function(t){e.selectedFolder=t},expression:"selectedFolder"}})],1):e._e(),e.tags.length>1?a("div",{staticClass:"form-field"},[a("label",{attrs:{for:"tag"}},[e._v(e._s(this.config.translations.browse_select_tag))]),a("v-select",{attrs:{options:e.tags,label:"name",reduce:function(e){return e.id},placeholder:e.facetsLoading?this.config.translations.browse_loading_tags:this.config.translations.browse_all_tags,disabled:e.facetsLoading},on:{input:e.handleTagChange},model:{value:e.tag,callback:function(t){e.tag=t},expression:"tag"}})],1):e._e(),e.visibilities.length>1?a("div",{staticClass:"form-field"},[a("label",{attrs:{for:"visibilities"}},[e._v(e._s(this.config.translations.browse_select_visibility))]),a("v-select",{attrs:{options:e.visibilities,label:"name",reduce:function(e){return e.id},placeholder:e.facetsLoading?this.config.translations.browse_loading_visibilities:this.config.translations.browse_all_visibilities,disabled:e.facetsLoading},on:{input:e.handleVisibilityChange},model:{value:e.visibility,callback:function(t){e.visibility=t},expression:"visibility"}})],1):e._e(),a("div",{staticClass:"search-wrapper"},[a("span",{staticClass:"search-label"},[e._v(e._s(this.config.translations.search))]),a("div",{staticClass:"search"},[a("input",{directives:[{name:"model",rawName:"v-model",value:e.query,expression:"query"}],attrs:{type:"text",placeholder:this.config.translations.search_placeholder},domProps:{value:e.query},on:{keyup:e.handleQueryChange,keydown:function(t){return!t.type.indexOf("key")&&e._k(t.keyCode,"enter",13,t.key,"Enter")?null:(t.preventDefault(),null(t))},input:function(t){t.target.composing||(e.query=t.target.value)}}})])])])])}),$=[],E="all",P="image",z="video",R="raw",L="(all)",A="(root)",D="all",U=a("ca17"),N=a.n(U),B=(a("542c"),{name:"MediaFacets",props:["config","tags","types","visibilities","facets","facetsLoading"],data:function(){return{TYPE_ALL:E,TYPE_IMAGE:P,TYPE_VIDEO:z,TYPE_RAW:R,FOLDER_ALL:L,FOLDER_ROOT:A,TAG_ALL:D,folders:[{id:this.config.parentFolder?this.config.parentFolder.id:A,label:this.config.parentFolder?this.config.parentFolder.label:A,children:null}],selectedFolder:this.facets.folder,selectedType:this.facets.type,query:this.facets.query,tag:this.facets.tag,visibility:this.facets.visibility}},methods:{clearFolderField:function(){return!this.config.parentFolder||(this.selectedFolder=this.config.parentFolder.id,!1)},handleTypeChange:function(e){this.$emit("change",{type:e})},handleFolderChange:function(e){this.selectedFolder=e,"undefined"!==typeof e&&e||(this.selectedFolder=this.config.parentFolder?this.config.parentFolder.id:e),this.$emit("change",{folder:this.selectedFolder})},handleQueryChange:function(){this.$emit("change",{query:this.query})},handleTagChange:function(){this.$emit("change",{tag:this.tag})},handleVisibilityChange:function(){this.$emit("change",{visibility:this.visibility})},loadSubFolders:function(){var e=Object(d["a"])(regeneratorRuntime.mark((function e(t){var a,i,n;return regeneratorRuntime.wrap((function(e){while(1)switch(e.prev=e.next){case 0:return a=t.parentNode,i={folder:"(root)"===a.id?"":a.id},e.next=4,fetch(this.config.paths.load_folders+"?"+g(i));case 4:return n=e.sent,e.next=7,n.json();case 7:a.children=e.sent,t.callback();case 9:case"end":return e.stop()}}),e,this)})));function t(t){return e.apply(this,arguments)}return t}()},components:{"v-select":x.a,treeselect:N.a}}),q=B,G=(a("c345"),Object(F["a"])(q,T,$,!1,null,"278bb214",null)),W=G.exports,Y=function(){var e=this,t=e.$createElement,a=e._self._c||t;return a("div",{staticClass:"media-gallery"},[a("div",{class:e.loading?"items loading":"items"},[e.media.length?e._e():a("div",{staticClass:"folder-empty"},[a("span",{staticClass:"ngrm-icon-folder"}),a("span",[a("strong",[e._v(e._s(this.translations.media_gallery_empty_folder))]),e._v(e._s(this.translations.media_gallery_upload_media))])]),e._l(e.media,(function(t){return a("div",{key:t.id,staticClass:"media",class:{selected:t.remoteId===e.selectedMediaId}},["image"===t.type||"video"===t.type&&""!==t.browseUrl?a("div",{staticClass:"media-container"},[a("img",{staticClass:"img",attrs:{src:t.browseUrl,alt:t.filename}}),a("Label",{staticClass:"filename"},[e._v(e._s(t.filename))]),a("div",{staticClass:"size-description"},["public"===t.visibility?a("i",{staticClass:"fa fa-solid fa-globe"},[e._v("  ")]):e._e(),"private"===t.visibility?a("i",{staticClass:"fa fa-eye-slash"},[e._v("  ")]):e._e(),"protected"===t.visibility?a("i",{staticClass:"fa fa-lock"},[e._v("  ")]):e._e(),a("span",{staticClass:"format"},[e._v(e._s(t.format))]),e._v(" - "+e._s(t.width)+" x "+e._s(t.height)+" - "+e._s(e.showFilesize(t))+"\n        ")])],1):a("div",{staticClass:"media-container"},[a("span",{staticClass:"file-placeholder"},[a("span",{staticClass:"icon-doc"},["pdf"===t.format?a("i",{staticClass:"fa fa-file-pdf-o"}):"zip"===t.format||"rar"===t.format?a("i",{staticClass:"fa fa-file-archive-o"}):"ppt"===t.format||"pptx"===t.format?a("i",{staticClass:"fa fa-file-powerpoint-o"}):"doc"===t.format||"docx"===t.format?a("i",{staticClass:"fa fa-file-word-o"}):"xls"===t.format||"xlsx"===t.format?a("i",{staticClass:"fa fa-file-excel-o"}):"aac"===t.format||"aiff"===t.format||"amr"===t.format||"flac"===t.format||"m4a"===t.format||"mp3"===t.format||"ogg"===t.format||"opus"===t.format||"wav"===t.format?a("i",{staticClass:"fa fa-file-audio-o"}):"txt"===t.format?a("i",{staticClass:"fa fa-lg fa-file-text"}):a("i",{staticClass:"fa fa-file"})])]),a("Label",{staticClass:"filename"},[e._v(e._s(t.filename))]),a("div",{staticClass:"size-description"},["public"===t.visibility?a("i",{staticClass:"fa fa-solid fa-globe"},[e._v("  ")]):e._e(),"private"===t.visibility?a("i",{staticClass:"fa fa-eye-slash"},[e._v("  ")]):e._e(),"protected"===t.visibility?a("i",{staticClass:"fa fa-lock"},[e._v("  ")]):e._e(),a("span",{staticClass:"format"},[e._v(e._s(t.format))]),e._v(" - "+e._s(e.showFilesize(t))+"\n        ")])],1),a("button",{staticClass:"btn btn-blue select-btn",attrs:{type:"button"},on:{click:function(a){return e.$emit("media-selected",t)}}},[e._v(e._s(e._self.translations.media_gallery_select))])])}))],2),e.canLoadMore?a("div",{staticClass:"load-more-wrapper"},[a("button",{staticClass:"btn btn-blue",attrs:{type:"button"},on:{click:function(t){return e.$emit("loadMore")}}},[e._v(e._s(this.translations.media_gallery_load_more))])]):e._e()])},J=[],K=a("94df"),Q=a.n(K),H={name:"MediaGallery",props:["translations","media","canLoadMore","onLoadMore","selectedMediaId","loading"],methods:{showFilesize:function(e){return Q()(e.size)}}},X=H,Z=(a("bdf2"),Object(F["a"])(X,Y,J,!1,null,"5aa52c90",null)),ee=Z.exports,te=a("b012"),ae=a.n(te),ie=function(){var e=this,t=e.$createElement,a=e._self._c||t;return a("div",{staticClass:"ngrm-overlay"},[a("div",{staticClass:"media-modal"},[a("div",{staticClass:"title"},[e._v("\n      "+e._s(e.title)+"\n      "),a("span",{staticClass:"close",on:{click:e.close}},[a("span",{staticClass:"ngrm-icon-cancel"})])]),a("div",{staticClass:"body"},[e._t("default")],2)])])},ne=[],se={name:"Modal",props:["title"],methods:{close:function(){this.$emit("close")}}},oe=se,re=(a("11ef"),a("a301"),Object(F["a"])(oe,ie,ne,!1,null,"9d33d07a",null)),le=re.exports;function ce(e,t){var a=Object.keys(e);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);t&&(i=i.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),a.push.apply(a,i)}return a}function de(e){for(var t=1;t<arguments.length;t++){var a=null!=arguments[t]?arguments[t]:{};t%2?ce(a,!0).forEach((function(t){Object(f["a"])(e,t,a[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(a)):ce(a).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(a,t))}))}return e}var fe=25,ue={name:"MediaModal",props:["config","tags","types","visibilities","facetsLoading","selectedMediaId","paths"],components:{"media-facets":W,"media-gallery":ee,modal:le},data:function(){var e=null;return this.config.parentFolder&&(e=this.config.parentFolder.id),this.config.folder&&(e=this.config.folder.id),{media:[],canLoadMore:!1,nextCursor:null,loading:!0,facets:{folder:e,type:"",query:"",tag:"",visibility:""}}},methods:{debouncedLoad:ae()((function(e){this.load(e)}),500),load:function(){var e=Object(d["a"])(regeneratorRuntime.mark((function e(){var t,a,i,n,s,o,r,l,c,d,f,u,p=arguments;return regeneratorRuntime.wrap((function(e){while(1)switch(e.prev=e.next){case 0:for(t=p.length>0&&void 0!==p[0]?p[0]:{patch:!1},a=t.patch,this.loading=!0,this.abortController&&this.abortController.abort(),this.abortController=new AbortController,i={limit:fe,offset:a?this.media.length:0},this.facets.query&&(i["query"]=this.facets.query),this.config.allowedTypes.length>0&&(i["type"]=this.config.allowedTypes),this.facets.type&&(i["type"]=this.facets.type),this.facets.folder&&(i["folder"]=this.facets.folder===A?"":this.facets.folder),this.config.allowedTags.length>0&&(i["tag"]=this.config.allowedTags),this.facets.tag&&(i["tag"]=this.facets.tag),this.config.allowedVisibilities.length>0&&(i["visibility"]=this.config.allowedVisibilities),this.facets.visibility&&(i["visibility"]=this.facets.visibility),a&&this.nextCursor&&(i["next_cursor"]=this.nextCursor),n="",s=0,o=Object.entries(i);s<o.length;s++)r=Object(M["a"])(o[s],2),l=r[0],c=r[1],""!==n&&(n+="&"),c.constructor===Array?(n+=l+"[]=",n+=c.join("&"+l+"[]=")):n+=l+"="+c;return d="".concat(this.paths.browse_resources,"?").concat(encodeURI(n)),e.prev=17,e.next=20,fetch(d,{signal:this.abortController.signal});case 20:return f=e.sent,e.next=23,f.json();case 23:u=e.sent,this.media=a?this.media.concat(u.hits):u.hits,this.canLoadMore=u.load_more,this.nextCursor=u.next_cursor,this.loading=!1,e.next=34;break;case 30:if(e.prev=30,e.t0=e["catch"](17),20===e.t0.code){e.next=34;break}throw e.t0;case 34:case"end":return e.stop()}}),e,this,[[17,30]])})));function t(){return e.apply(this,arguments)}return t}(),handleLoadMore:function(){this.debouncedLoad({patch:!0})},handleFacetsChange:function(e){this.facets=de({},this.facets,{},e),this.debouncedLoad()}},mounted:function(){this.load()}},pe=ue,he=(a("ab92"),Object(F["a"])(pe,j,S,!1,null,"751395c8",null)),me=he.exports,ge=function(){var e=this,t=e.$createElement,a=e._self._c||t;return a("modal",{attrs:{title:this.translations.crop_modal_title},on:{close:function(t){return e.$emit("close")}}},[a("crop-sizes",{attrs:{translations:e.translations,availableVariations:e.availableVariations,allVariationValues:e.allVariationValues,imageSize:e.imageSize,selectedVariation:e.selectedVariation},on:{selected:e.handleVariationSelected,addedVariations:e.handleAddedVariations,removedVariation:e.handleRemovedVariation}}),e._l(e.availableVariations,(function(t,i){return a("div",{key:i,staticClass:"crop-container"},[i===e.selectedVariation?a("crop",{attrs:{translations:e.translations,value:e.allVariationValues[i],src:e.selectedImage.url,variation:e.availableVariations[i],imageSize:e.imageSize},on:{change:function(t){return e.handleVariationValueChange(i,t)}}}):e._e()],1)})),e.selectedVariation?e._e():a("div",{staticClass:"img-placeholder"},[a("img",{attrs:{src:e.selectedImage.url}})]),a("div",{staticClass:"action-strip"},[a("button",{staticClass:"btn",attrs:{type:"button"},on:{click:e.handleCancelClicked}},[e._v(e._s(this.translations.crop_cancel))]),a("button",{staticClass:"btn btn-blue",attrs:{type:"button"},on:{click:e.handleSaveClicked}},[a("span",{staticClass:"ngrm-icon-floppy"}),a("span",[e._v(e._s(this.translations.crop_save_sizes))])])])],2)},ve=[],be=function(){var e=this,t=e.$createElement,a=e._self._c||t;return a("div",{staticClass:"sidebar-crop"},[a("div",{staticClass:"buttons"},[e.addingVariations?e._e():a("button",{staticClass:"btn",attrs:{type:"button"},on:{click:e.handleAddCropSize}},[e._v(e._s(this.translations.crop_add_size))]),e.addingVariations?a("button",{staticClass:"btn",attrs:{type:"button"},on:{click:e.handleCancel}},[e._v(e._s(this.translations.crop_cancel))]):e._e(),e.addingVariations?a("button",{staticClass:"btn crop-btn-add",attrs:{type:"button"},on:{click:e.handleAdd}},[e._v(e._s(this.translations.crop_add))]):e._e()]),a("div",{staticClass:"sidebar-crop-label"},[a("span",[e._v(e._s(this.translations.crop_added_for_confirmation))])]),a("div",{directives:[{name:"show",rawName:"v-show",value:e.addingVariations,expression:"addingVariations"}],class:{unselectedVariations:e.addingVariations}},e._l(e.unselectedVariations,(function(t){return a("div",{key:t,class:{disabled:!e.isVariationSelectable(t)}},[a("input",{directives:[{name:"model",rawName:"v-model",value:e.newSelection,expression:"newSelection"}],attrs:{type:"checkbox",id:t,disabled:!e.isVariationSelectable(t)},domProps:{value:t,checked:Array.isArray(e.newSelection)?e._i(e.newSelection,t)>-1:e.newSelection},on:{change:function(a){var i=e.newSelection,n=a.target,s=!!n.checked;if(Array.isArray(i)){var o=t,r=e._i(i,o);n.checked?r<0&&(e.newSelection=i.concat([o])):r>-1&&(e.newSelection=i.slice(0,r).concat(i.slice(r+1)))}else e.newSelection=s}}}),a("label",{attrs:{for:t}},[a("span",{staticClass:"name"},[e._v(e._s(t))]),a("span",{staticClass:"formatted-size"},[e._v(e._s(e.formattedSize(t)))])]),e.isVariationSelectable(t)?e._e():a("div",{staticClass:"legend-not-selectable"},[a("span",[e._v(e._s(e._self.translations.crop_media_too_small))])])])})),0),a("div",{staticClass:"selectedVariations"},[a("ul",e._l(e.selectedVariations,(function(t){return a("li",{key:t,class:{set:!!e.allVariationValues[t],selected:e.selectedVariation===t,disabled:!e.isVariationSelectable(t)},on:{click:function(a){return e.handleVariationClicked(t)}}},[a("div",[a("span",{staticClass:"name"},[e._v(e._s(t))]),a("span",{staticClass:"formatted-size"},[e._v(e._s(e.formattedSize(t)))])]),e.addingVariations?e._e():a("a",[a("span",{staticClass:"circle-orange"}),a("span",{staticClass:"ngrm-icon-trash",on:{click:function(a){return e.removeItem(t)}}})])])})),0)])])},_e=[],we=(a("7f7f"),{name:"CropSizes",props:["translations","availableVariations","allVariationValues","imageSize","selectedVariation"],data:function(){return{newSelection:[],addingVariations:!1}},computed:{unselectedVariations:function(){var e=Object.keys(this.availableVariations),t=Object.keys(this.allVariationValues);return e.difference(t)},selectedVariations:function(){return Object.getOwnPropertyNames(this.allVariationValues)}},methods:{handleAddCropSize:function(){this.addingVariations=!0},handleCancel:function(){this.addingVariations=!1,this.newSelection=[]},handleAdd:function(){this.$emit("addedVariations",this.newSelection),this.newSelection=[],this.addingVariations=!1},removeItem:function(e){this.$emit("removedVariation",e)},formattedSize:function(e){return"".concat(this.availableVariations[e][0]," x ").concat(this.availableVariations[e][1])},isVariationSelectable:function(e){var t=Object(M["a"])(this.availableVariations[e],2),a=t[0],i=t[1];return this.imageSize.width>=a&&this.imageSize.height>=i},handleVariationClicked:function(e){this.isVariationSelectable(e)&&this.$emit("selected",e)}}}),ye=we,Ce=(a("bdd7"),Object(F["a"])(ye,be,_e,!1,null,"ad171770",null)),xe=Ce.exports,Oe=function(){var e=this,t=e.$createElement,a=e._self._c||t;return a("div",{staticClass:"crop"},[a("div",{ref:"cropper",staticClass:"cropper",style:e.cropperStyle},[a("img",{ref:"image",attrs:{src:e.src}}),a("div",{ref:"buttons",staticClass:"buttons",style:e.applyButtonStyle},[a("button",{staticClass:"btn btn-blue",attrs:{type:"button"},on:{click:e.handleReset}},[a("span",{staticClass:"ngrm-icon-ccw"}),a("span",[e._v(e._s(this.translations.crop_reset))])]),a("button",{staticClass:"btn btn-blue",attrs:{type:"button"},on:{click:e.handleApply}},[a("span",{staticClass:"ngrm-icon-ok"}),a("span",[e._v(e._s(this.translations.crop_apply))])])])]),a("div",[a("h4",[e._v(e._s(this.translations.crop_preview))]),a("div",{ref:"preview",staticClass:"preview"})])])},Ie=[],Fe=a("5435"),Ve={name:"Crop",props:["translations","value","variation","src","imageSize"],mounted:function(){this.setCropper()},beforeDestroy:function(){this.destroyCropper()},data:function(){return{crop:{},cropper:null}},methods:{setCropper:function(){var e,t=this.value||{},a=t.x,i=t.y,n=t.w,s=t.h,o={x:a,y:i,width:n,height:s},r=Object(M["a"])(this.variation,2),l=r[0],c=r[1],d=l>0&&c>0?l/c:void 0;this.destroyCropper();this.$refs.cropper.clientWidth,this.imageSize.width;this.cropper=new Fe["a"](this.$refs.image,(e={viewMode:2,dragMode:"none",autoCrop:!0,data:o,aspectRatio:d,guides:!0,movable:!1,rotatable:!1},Object(f["a"])(e,"guides",!1),Object(f["a"])(e,"center",!1),Object(f["a"])(e,"zoomable",!1),Object(f["a"])(e,"scalable",!0),Object(f["a"])(e,"minCropBoxWidth",50),Object(f["a"])(e,"minCropBoxHeight",50),Object(f["a"])(e,"crop",this.handleCrop),Object(f["a"])(e,"preview",this.$refs.preview),e)),this.cropper.setData(o)},handleCrop:function(e){this.crop=this.cropper.getData(!0)},destroyCropper:function(){this.cropper&&this.cropper.destroy()},handleReset:function(){this.cropper.reset()},handleApply:function(){var e=this.cropper.getData(!0),t=e.x,a=e.y,i=e.width,n=e.height;this.$emit("change",{x:t,y:a,w:i,h:n})}},computed:{applyButtonStyle:function(){var e=this.crop,t=e.x,a=e.y,i=e.width,n=e.height,s=this.$refs.buttons?this.$refs.buttons.clientWidth:0,o=this.$refs.cropper?this.$refs.cropper.clientWidth/this.imageSize.width:1;return{top:"".concat((a+n)*o+10,"px"),left:"".concat((t+i)*o-s-1,"px")}},cropperStyle:function(){var e=this.imageSize.height/this.imageSize.width*100;return{"padding-bottom":"".concat(e,"%"),height:"0px",width:"100%"}}}},ke=Ve,je=(a("c66d"),Object(F["a"])(ke,Oe,Ie,!1,null,"5f73791e",null)),Se=je.exports,Me=function(e){return function(t){return Object.keys(t).reduce((function(a,i){return e(t[i],i)&&(a[i]=t[i]),a}),{})}},Te=function(e){return function(t){return!e(t)}},$e=function(e){return function(t){return e===t}},Ee=function(e){return!!e},Pe=Te($e(void 0));function ze(e,t){var a=Object.keys(e);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);t&&(i=i.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),a.push.apply(a,i)}return a}function Re(e){for(var t=1;t<arguments.length;t++){var a=null!=arguments[t]?arguments[t]:{};t%2?ze(a,!0).forEach((function(t){Object(f["a"])(e,t,a[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(a)):ze(a).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(a,t))}))}return e}var Le={name:"CropModal",props:["translations","availableVariations","selectedImage"],components:{modal:le,"crop-sizes":xe,crop:Se},data:function(){return{selectedVariation:null,newVariationValues:{}}},computed:{allVariationValues:function(){return Me(Pe)(Re({},this.selectedImage.variations,{},this.newVariationValues))},imageSize:function(){return{height:this.selectedImage.height,width:this.selectedImage.width}}},methods:{handleVariationSelected:function(e){this.selectedVariation=e},handleAddedVariations:function(e){this.newVariationValues=Re({},this.newVariationValues,{},e.reduce((function(e,t){return e[t]=null,e}),{}))},handleRemovedVariation:function(e){this.newVariationValues=Re({},this.newVariationValues,Object(f["a"])({},e,void 0))},handleVariationValueChange:function(e,t){this.newVariationValues=Re({},this.newVariationValues,Object(f["a"])({},e,t))},handleCancelClicked:function(){this.newVariationValues={},this.$emit("close")},handleSaveClicked:function(){this.$emit("change",Re({},this.newVariationValues)),this.newVariationValues={},this.$emit("close")}}},Ae=Le,De=(a("4d22"),Object(F["a"])(Ae,ge,ve,!1,null,"45497070",null)),Ue=De.exports,Ne=function(){var e=this,t=e.$createElement,a=e._self._c||t;return a("modal",{attrs:{title:this.config.translations.upload_modal_title},on:{close:function(t){return e.$emit("close")}}},[a("div",{class:e.loading?"loading":""},[a("select-folder",{attrs:{config:e.config,"selected-folder":e.selectedFolder},on:{select:e.handleFolderChange,change:e.handleFolderChange}}),a("div",{staticClass:"input-file-name-wrapper"},[this.error?a("div",{staticClass:"error"},[e._v("\n        "+e._s(this.error)+"\n        "),this.existingResourceButton?a("a",{attrs:{href:"javascript:void(0);"},on:{click:function(t){return e.$emit("uploaded",e.existingResource)}}},[e._v("\n          "+e._s(this.config.translations.upload_button_use_existing_resource)+"\n        ")]):e._e()]):e._e(),a("input",{directives:[{name:"model",rawName:"v-model",value:e.filename,expression:"filename"}],class:e.error?"error":"",attrs:{type:"text"},domProps:{value:e.filename},on:{input:function(t){t.target.composing||(e.filename=t.target.value)}}}),e.visibilities.length>1?a("v-select",{attrs:{options:e.visibilities,label:"name",reduce:function(e){return e.id},clearable:!1},model:{value:e.visibility,callback:function(t){e.visibility=t},expression:"visibility"}}):e._e(),a("input",{directives:[{name:"model",rawName:"v-model",value:e.overwrite,expression:"overwrite"}],attrs:{type:"checkbox",id:"ngrm-upload-overwrite"},domProps:{checked:Array.isArray(e.overwrite)?e._i(e.overwrite,null)>-1:e.overwrite},on:{change:function(t){var a=e.overwrite,i=t.target,n=!!i.checked;if(Array.isArray(a)){var s=null,o=e._i(a,s);i.checked?o<0&&(e.overwrite=a.concat([s])):o>-1&&(e.overwrite=a.slice(0,o).concat(a.slice(o+1)))}else e.overwrite=n}}}),a("label",{attrs:{for:"ngrm-upload-overwrite"}},[e._v(e._s(this.config.translations.upload_checkbox_overwrite))]),a("button",{staticClass:"btn btn-blue",attrs:{type:"button",disabled:""===e.filename||""===e.visibility},on:{click:e.upload}},[e._v("\n        "+e._s(this.config.translations.upload_button_upload)+"\n      ")])],1)],1),e.loading?a("i",{staticClass:"ng-icon ng-spinner"}):e._e()])},Be=[],qe=function(){var e=this,t=e.$createElement,a=e._self._c||t;return a("div",{staticClass:"folder-gallery"},[a("div",{class:e.loading?"items loading":"items"},[a("div",{staticClass:"breadcrumbs"},[a("span",[e._v(e._s(this.config.translations.upload_breadcrumbs_info)+" ")]),e._l(e.breadcrumbs,(function(t,i){return a("span",{key:i},[0!==i?a("span",[e._v(" / ")]):e._e(),i!==e.breadcrumbs.length-1?a("a",{attrs:{href:"javascript:void(0);"},on:{click:function(a){return e.openFolder(t.id)}}},[e._v("\n          "+e._s(t.label)+"\n        ")]):a("span",[e._v(e._s(t.label))])])}))],2),e.folders.length>0||e.allowCreate?a("div",{staticClass:"info"},[a("i",{staticClass:"fa fa-info-circle"}),e._v("\n      "+e._s(this.config.translations.upload_info_text)+"\n    ")]):e._e(),e._l(e.folders,(function(t){return a("div",{key:t.id,staticClass:"media",class:{selected:t.id===e._self.folder}},[a("div",{staticClass:"media-container",on:{dblclick:function(a){return e.openFolder(t.id)}}},[e._m(0,!0),a("Label",{staticClass:"filename"},[e._v(e._s(t.label))])],1),a("button",{staticClass:"btn btn-blue select-btn",attrs:{type:"button"},on:{click:function(a){return e.$emit("select",t.id)}}},[e._v("\n        "+e._s(e._self.config.translations.upload_button_select)+"\n      ")])])})),e.allowCreate?a("div",{staticClass:"media new-folder"},[a("div",{staticClass:"media-container"},[e._m(1),a("input",{directives:[{name:"model",rawName:"v-model",value:e.newFolder,expression:"newFolder"}],attrs:{type:"text",placeholder:this.config.translations.upload_placeholder_new_folder},domProps:{value:e.newFolder},on:{input:function(t){t.target.composing||(e.newFolder=t.target.value)}}})]),a("button",{staticClass:"btn btn-blue select-btn",attrs:{type:"button",disabled:null===e.newFolder},on:{click:e.createNewFolder}},[e._v("\n        "+e._s(this.config.translations.upload_button_create)+"\n      ")])]):e._e()],2),e.loading?a("i",{staticClass:"ng-icon ng-spinner"}):e._e()])},Ge=[function(){var e=this,t=e.$createElement,a=e._self._c||t;return a("span",{staticClass:"file-placeholder"},[a("span",{staticClass:"icon-doc"},[a("i",{staticClass:"fa fa-folder"})])])},function(){var e=this,t=e.$createElement,a=e._self._c||t;return a("span",{staticClass:"file-placeholder"},[a("span",{staticClass:"icon-doc"},[a("i",{staticClass:"fa fa-folder"})])])}],We=a("bc3a"),Ye=a.n(We),Je={name:"SelectFolder",props:["config","selectedFolder"],data:function(){return{folders:[],newFolder:null,breadcrumbs:[],loading:!1,allowCreate:!0,folder:this.selectedFolder}},methods:{openFolder:function(e){this.folder=e,this.$emit("change",this.folder),this.loadSubFolders(e)},loadSubFolders:function(){var e=Object(d["a"])(regeneratorRuntime.mark((function e(t){var a,i,n;return regeneratorRuntime.wrap((function(e){while(1)switch(e.prev=e.next){case 0:return this.loading=!0,a=this.config.paths.load_folders,t&&(i={folder:t===A?"":t},a+="?"+g(i)),e.next=5,fetch(a);case 5:return n=e.sent,e.next=8,n.json();case 8:this.folders=e.sent,this.generateBreadcrumbs(t),this.newFolder=null,this.loading=!1;case 12:case"end":return e.stop()}}),e,this)})));function t(t){return e.apply(this,arguments)}return t}(),generateBreadcrumbs:function(e){var t=this;this.breadcrumbs=[];var a={id:null,label:this.config.translations.upload_root_folder};if(null!==e){var i=e.split("/"),n=[],s=[];this.config.parentFolder&&(s=this.config.parentFolder.id.split("/"),a={id:this.config.parentFolder.id,label:this.config.parentFolder.label}),this.config.folder&&(s=this.config.folder.id.split("/"),a={id:this.config.folder.id,label:this.config.folder.label}),this.breadcrumbs.push(a),i.forEach((function(e,a){n.push(e),s.indexOf(e)<0&&t.breadcrumbs.push({id:n.join("/"),label:e})}))}else this.breadcrumbs.push(a)},createNewFolder:function(){var e=Object(d["a"])(regeneratorRuntime.mark((function e(){var t;return regeneratorRuntime.wrap((function(e){while(1)switch(e.prev=e.next){case 0:return this.loading=!0,t=new FormData,this.folder&&t.append("parent",this.folder),t.append("folder",this.newFolder),e.next=6,Ye.a.post(this.config.paths.create_folder,t);case 6:this.folders.push({id:null!==this.folder?this.folder+"/"+this.newFolder:this.newFolder,label:this.newFolder}),this.newFolder=null,this.loading=!1;case 9:case"end":return e.stop()}}),e,this)})));function t(){return e.apply(this,arguments)}return t}()},created:function(){if(this.config.folder)return e=this.config.folder.id,this.allowCreate=!1,this.folder=e,this.$emit("change",this.folder),void this.generateBreadcrumbs(e);var e=null;this.config.parentFolder&&(e=this.config.parentFolder.id),this.openFolder(e)}},Ke=Je,Qe=(a("85ab"),Object(F["a"])(Ke,qe,Ge,!1,null,"c53732c8",null)),He=Qe.exports,Xe={name:"UploadModal",props:["config","file","visibilities"],data:function(){return{loading:!1,selectedFolder:"",filename:this.file.name,visibility:this.visibilities.length>0?this.visibilities[0].id:"",overwrite:!1,error:"",existingResourceButton:!1,existingResource:null}},components:{"select-folder":He,modal:le,"v-select":x.a},methods:{handleFolderChange:function(e){this.selectedFolder=e},upload:function(){var e=Object(d["a"])(regeneratorRuntime.mark((function e(){var t,a,i,n,s,o,r=this;return regeneratorRuntime.wrap((function(e){while(1)switch(e.prev=e.next){case 0:for(this.loading=!0,t=new FormData,t.append("file",this.file),t.append("filename",this.filename),t.append("folder",this.selectedFolder),t.append("overwrite",this.overwrite),t.append("visibility",this.visibility),t.append("hide_filename",this.config.hideFilename),a=0,i=Object.entries(this.config.uploadContext);a<i.length;a++)n=Object(M["a"])(i[a],2),s=n[0],o=n[1],t.append("upload_context[".concat(s,"]"),o);return e.next=11,Ye.a.post(this.config.paths.upload_resources,t).then((function(e){r.config.allowedTypes.length>0&&-1===r.config.allowedTypes.indexOf(e.data.type)?(r.error=r.config.translations.upload_error_unsupported_resource_type+r.config.allowedTypes.join(", "),r.loading=!1):r.$emit("uploaded",e.data)})).catch((function(e){409===e.response.status?(r.error=r.config.translations.upload_error_existing_resource,r.existingResourceButton=!0,r.existingResource=e.response.data,r.loading=!1):(r.error=e.response.data.detail?e.response.data.detail:"Error "+e.response.status+" - "+e.response.statusText,r.loading=!1)}));case 11:case"end":return e.stop()}}),e,this)})));function t(){return e.apply(this,arguments)}return t}()},watch:{visibilities:function(){this.visibility=this.visibilities.length>0?this.visibilities[0].id:""}}},Ze=Xe,et=(a("5af5"),Object(F["a"])(Ze,Ne,Be,!1,null,"2676fd5e",null)),tt=et.exports;function at(e,t){var a=Object.keys(e);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);t&&(i=i.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),a.push.apply(a,i)}return a}function it(e){for(var t=1;t<arguments.length;t++){var a=null!=arguments[t]?arguments[t]:{};t%2?at(a,!0).forEach((function(t){Object(f["a"])(e,t,a[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(a)):at(a).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(a,t))}))}return e}var nt={name:"Interactions",props:["fieldId","config","selectedImage"],components:{preview:k,"media-modal":me,"crop-modal":Ue,"upload-modal":tt},computed:{isCroppable:function(){return!!this.selectedImage.id&&"image"===this.selectedImage.type&&Object.keys(this.config.availableVariations).length>0},stringifiedVariations:function(){return JSON.stringify(Me(Ee)(this.selectedImage.variations))}},data:function(){return{mediaModalOpen:!1,cropModalOpen:!1,uploadModalOpen:!1,types:[],folders:[],tags:[],visibilities:[],facetsLoading:!0,newFile:null}},methods:{dispatchVanillaChangeEvent:function(){this.$nextTick((function(){this.$el.dispatchEvent(new CustomEvent("ngrm-change",{detail:{inputFields:this.config.inputFields,selectedImage:this.selectedImage,fieldId:this.fieldId}}))}))},prepareDomForModal:function(){var e=document.querySelector(".ez-page-builder-wrapper");e&&(e.style.transform="none")},resetDomAfterModal:function(){var e=document.querySelector(".ez-page-builder-wrapper");e&&e.removeAttribute("style")},handleMediaModalClose:function(){this.mediaModalOpen=!1,this.resetDomAfterModal(),this.dispatchVanillaChangeEvent()},handleCropModalClose:function(){this.cropModalOpen=!1,this.resetDomAfterModal(),this.dispatchVanillaChangeEvent()},handleUploadModalClose:function(){this.uploadModalOpen=!1,this.dispatchVanillaChangeEvent()},handleMediaSelected:function(e){this.selectedImage={id:e.remoteId,name:e.filename,type:e.type,format:e.format,url:e.url,previewUrl:e.previewUrl,browseUrl:e.browseUrl,alternateText:e.altText,caption:e.caption,watermarkText:this.selectedImage.watermarkText,tags:e.tags,size:e.size,variations:{},height:e.height,width:e.width},this.mediaModalOpen=!1,this.dispatchVanillaChangeEvent()},handleVariationCropChange:function(e){this.selectedImage=it({},this.selectedImage,{variations:it({},this.selectedImage.variations,{},e)}),this.dispatchVanillaChangeEvent()},handleResourceUploaded:function(e){this.selectedImage={id:e.remoteId,name:e.filename,type:e.type,format:e.format,url:e.url,previewUrl:e.previewUrl,browseUrl:e.browseUrl,alternateText:e.altText,caption:e.caption,watermarkText:this.selectedImage.watermarkText,tags:e.tags,size:e.size,variations:{},height:e.height,width:e.width},this.uploadModalOpen=!1,this.dispatchVanillaChangeEvent()},handleCropClicked:function(){this.cropModalOpen=!0,this.prepareDomForModal()},handleRemoveMediaClicked:function(){this.selectedImage={id:"",name:"",type:"image",format:"",url:"",previewUrl:"",browseUrl:"",alternateText:"",caption:"",watermarkText:this.selectedImage.watermarkText,tags:[],size:0,variations:{},height:0,width:0},this.$refs.fileUploadInput.value=null,this.dispatchVanillaChangeEvent()},fetchFacets:function(){var e=Object(d["a"])(regeneratorRuntime.mark((function e(){var t,a,i=this;return regeneratorRuntime.wrap((function(e){while(1)switch(e.prev=e.next){case 0:return e.next=2,fetch(this.config.paths.load_facets);case 2:return t=e.sent,e.next=5,t.json();case 5:a=e.sent,this.types=[],this.tags=[],this.visibilities=[],a.types.forEach((function(e){-1===i.config.allowedTypes.indexOf(e.id)&&0!==i.config.allowedTypes.length||i.types.push(e)})),a.tags.forEach((function(e){-1===i.config.allowedTags.indexOf(e.id)&&0!==i.config.allowedTags.length||i.tags.push(e)})),a.visibilities.forEach((function(e){-1===i.config.allowedVisibilities.indexOf(e.id)&&0!==i.config.allowedVisibilities.length||i.visibilities.push(e)})),this.facetsLoading=!1;case 13:case"end":return e.stop()}}),e,this)})));function t(){return e.apply(this,arguments)}return t}(),handleBrowseMediaClicked:function(){var e=Object(d["a"])(regeneratorRuntime.mark((function e(){return regeneratorRuntime.wrap((function(e){while(1)switch(e.prev=e.next){case 0:this.mediaModalOpen=!0,this.prepareDomForModal(),this.fetchFacets();case 3:case"end":return e.stop()}}),e,this)})));function t(){return e.apply(this,arguments)}return t}(),handleFileInputChange:function(){this.fetchFacets(),this.uploadModalOpen=!0,this.newFile=this.$refs.fileUploadInput.files.item(0)}},watch:{selectedImage:function(){this.$emit("selectedImageChanged",this.selectedImage)}},mounted:function(){this.$nextTick((function(){var e=document.querySelector(".ngrm-model-portal-".concat(this.fieldId));document.body.prepend(e)}))}},st=nt,ot=Object(F["a"])(st,l,c,!1,null,null,null),rt=ot.exports,lt={bind:function(e,t,a){var i=b(t.arg);a.context[i]=t.value}},ct=(a("b39d"),function(){var e=this,t=e.$createElement,a=e._self._c||t;return a("div",[a("input",{directives:[{name:"model",rawName:"v-model",value:e.selectedFolder,expression:"selectedFolder"}],attrs:{type:"hidden",name:e.config.inputFields.folder},domProps:{value:e.selectedFolder},on:{input:function(t){t.target.composing||(e.selectedFolder=t.target.value)}}}),e.selectedFolder?a("span",[a("i",{staticClass:"fa fa-folder"}),e._v(" "+e._s(this.selectedFolder))]):a("span",[a("i",[e._v(e._s(this.config.translations.select_folder_interaction_empty))])]),a("div",{staticClass:"ngremotemedia-buttons"},[e.selectedFolder?a("input",{attrs:{type:"button",value:"Remove folder"},on:{click:e.handleFolderRemove}}):e._e(),a("input",{attrs:{type:"button",value:this.config.translations.select_folder_interaction_button},on:{click:e.handleSelectFolderModalOpen}})]),e.selectFolderModalOpen?a("modal",{attrs:{title:"Select folder"},on:{close:e.handleSelectFolderModalClose}},[a("select-folder",{attrs:{config:e.config,"selected-folder":e.selectedFolder},on:{select:e.handleFolderSelect}})],1):e._e()],1)}),dt=[],ft={name:"SelectFolderInteraction",props:["config","selectedFolder"],components:{"select-folder":He,modal:le},data:function(){return{selectFolderModalOpen:!1}},methods:{handleSelectFolderModalOpen:function(){this.selectFolderModalOpen=!0},handleSelectFolderModalClose:function(){this.selectFolderModalOpen=!1},handleFolderSelect:function(e){this.selectedFolder=e,this.handleSelectFolderModalClose()},handleFolderRemove:function(){this.selectedFolder=null}}},ut=ft,pt=Object(F["a"])(ut,ct,dt,!1,null,null,null),ht=pt.exports;i["default"].config.productionTip=!1,i["default"].use(s.a),i["default"].use(r.a);var mt=function(e){window["ngrm_interactions_vue_".concat(e.dataset.id)]=new i["default"]({el:e,directives:{init:lt},data:{config:{paths:{browse_resources:"/resource/browse",upload_resources:"/resource/upload",load_facets:"/facets/load",load_folders:"/folder/load",create_folder:"/folder/create"},translations:{},inputFields:{locationId:"locationId",remoteId:"remoteId",type:"type",altText:"altText",caption:"caption",tags:"tags[]",cropSettings:"cropSettings",source:"source",watermarkText:"watermarkText"},availableVariations:[],allowedVisibilities:[],allowedTypes:[],allowedTags:[],parentFolder:null,folder:null,uploadContext:{},disableUpload:!1,hideFilename:!1},selectedImage:{id:"",name:"",type:"image",format:"",url:"",browse_url:"",previewUrl:"",alternateText:"",caption:"",watermarkText:"",tags:[],size:"",variations:{},height:0,width:0}},components:{interactions:rt}})},gt=function(e){window["ngrm_select_folder_vue_".concat(e.dataset.id)]=new i["default"]({el:e,directives:{init:lt},data:{config:{paths:{load_folders:"/folder/load",create_folder:"/folder/create"},translations:{},inputFields:{folder:"folder"}},selectedFolder:null},components:{"select-folder-interaction":ht}})},vt=function(){for(var e=document.getElementsByClassName("ngremotemedia-container"),t=0;t<e.length;t++){var a=e[t];null!==a.querySelector("interactions")&&mt(a)}for(var i=document.getElementsByClassName("ngremotemedia-select-folder-container"),n=0;n<i.length;n++){var s=i[n];null!==s.querySelector("select-folder-interaction")&&gt(s)}},bt=document.body?document.body:document,_t={attributes:!0,childList:!0,subtree:!0},wt=new MutationObserver(vt);"complete"===document.readyState||"loading"!==document.readyState&&document.documentElement.doScroll,wt.observe(bt,_t)},"5af5":function(e,t,a){"use strict";var i=a("2d36"),n=a.n(i);n.a},"85ab":function(e,t,a){"use strict";var i=a("1c87"),n=a.n(i);n.a},"8b09":function(e,t,a){},a301:function(e,t,a){"use strict";var i=a("fd05"),n=a.n(i);n.a},ab92:function(e,t,a){"use strict";var i=a("3601"),n=a.n(i);n.a},b39d:function(e,t){Array.prototype.difference||(Array.prototype.difference=function(e){return this.filter((function(t){return e.indexOf(t)<0}))})},bdd7:function(e,t,a){"use strict";var i=a("8b09"),n=a.n(i);n.a},bdf2:function(e,t,a){"use strict";var i=a("d0ba"),n=a.n(i);n.a},c345:function(e,t,a){"use strict";var i=a("1994"),n=a.n(i);n.a},c66d:function(e,t,a){"use strict";var i=a("e7f6"),n=a.n(i);n.a},d0ba:function(e,t,a){},e7f6:function(e,t,a){},fc96:function(e,t,a){"use strict";var i=a("3076"),n=a.n(i);n.a},fd05:function(e,t,a){}});
+(function(e){function t(t){for(var i,o,l=t[0],r=t[1],c=t[2],f=0,u=[];f<l.length;f++)o=l[f],Object.prototype.hasOwnProperty.call(s,o)&&s[o]&&u.push(s[o][0]),s[o]=0;for(i in r)Object.prototype.hasOwnProperty.call(r,i)&&(e[i]=r[i]);d&&d(t);while(u.length)u.shift()();return n.push.apply(n,c||[]),a()}function a(){for(var e,t=0;t<n.length;t++){for(var a=n[t],i=!0,l=1;l<a.length;l++){var r=a[l];0!==s[r]&&(i=!1)}i&&(n.splice(t--,1),e=o(o.s=a[0]))}return e}var i={},s={app:0},n=[];function o(t){if(i[t])return i[t].exports;var a=i[t]={i:t,l:!1,exports:{}};return e[t].call(a.exports,a,a.exports,o),a.l=!0,a.exports}o.m=e,o.c=i,o.d=function(e,t,a){o.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:a})},o.r=function(e){"undefined"!==typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},o.t=function(e,t){if(1&t&&(e=o(e)),8&t)return e;if(4&t&&"object"===typeof e&&e&&e.__esModule)return e;var a=Object.create(null);if(o.r(a),Object.defineProperty(a,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var i in e)o.d(a,i,function(t){return e[t]}.bind(null,i));return a},o.n=function(e){var t=e&&e.__esModule?function(){return e["default"]}:function(){return e};return o.d(t,"a",t),t},o.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},o.p="/";var l=window["webpackJsonp"]=window["webpackJsonp"]||[],r=l.push.bind(l);l.push=t,l=l.slice();for(var c=0;c<l.length;c++)t(l[c]);var d=r;n.push(["56d7","chunk-vendors"]),a()})({"0ab7":function(e,t,a){"use strict";var i=a("dca1"),s=a.n(i);s.a},1994:function(e,t,a){},"1c87":function(e,t,a){},"2d36":function(e,t,a){},3601:function(e,t,a){},"3fb5":function(e,t,a){},"4d22":function(e,t,a){"use strict";var i=a("5450"),s=a.n(i);s.a},5450:function(e,t,a){},"56d7":function(e,t,a){"use strict";a.r(t);a("cadf"),a("551c"),a("f751"),a("097d");var i=a("a026"),s=a("2b88"),n=a.n(s),o=a("d1d6"),l=a.n(o),r=(a("3fb5"),a("6107"),function(){var e=this,t=e.$createElement,a=e._self._c||t;return a("div",[a("preview",{ref:"preview",attrs:{config:e.config,"field-id":e.fieldId,"selected-image":e.selectedImage,"is-croppable":e.isCroppable},on:{"preview-change":e.dispatchVanillaChangeEvent}}),a("div",{staticClass:"ngremotemedia-buttons",attrs:{id:"ngremotemedia-buttons-"+e.fieldId,"data-id":e.fieldId}},[a("input",{directives:[{name:"model",rawName:"v-model",value:e.selectedImage.id,expression:"selectedImage.id"}],staticClass:"media-id",attrs:{name:this.config.inputFields.remoteId,type:"hidden"},domProps:{value:e.selectedImage.id},on:{input:function(t){t.target.composing||e.$set(e.selectedImage,"id",t.target.value)}}}),e.isCroppable?a("input",{staticClass:"ngremotemedia-scale hid btn",attrs:{value:this.config.translations.interactions_scale,type:"button"},on:{click:e.handleCropClicked}}):e._e(),e.selectedImage.id?a("input",{staticClass:"ngremotemedia-remove-file btn",attrs:{value:this.config.translations.interactions_remove_media,type:"button"},on:{click:e.handleRemoveMediaClicked}}):e._e(),a("input",{staticClass:"ngremotemedia-remote-file btn",attrs:{value:this.selectedImage.id?this.config.translations.interactions_manage_media:this.config.translations.interactions_select_media,type:"button"},on:{click:e.handleBrowseMediaClicked}}),this.config.disableUpload?e._e():a("div",{staticClass:"ngremotemedia-local-file-container"},[a("button",{staticClass:"btn btn-default ngremotemedia-local-file btn upload-from-disk",attrs:{type:"button"}},[a("Label",{attrs:{for:e.fieldId+"_file_upload"}},[e._v("\n                    "+e._s(this.config.translations.interactions_quick_upload)+"\n                ")]),a("input",{ref:"fileUploadInput",attrs:{id:e.fieldId+"_file_upload",name:this.config.inputFields.new_file,hidden:"",type:"file"},on:{change:e.handleFileInputChange}})],1)])]),a("input",{directives:[{name:"model",rawName:"v-model",value:e.stringifiedVariations,expression:"stringifiedVariations"}],staticClass:"media-id",attrs:{name:this.config.inputFields.cropSettings,type:"hidden"},domProps:{value:e.stringifiedVariations},on:{input:function(t){t.target.composing||(e.stringifiedVariations=t.target.value)}}}),a("portal",{attrs:{to:"ngrm-body-modal-"+e.fieldId}},[e.cropModalOpen?a("crop-modal",{attrs:{"available-variations":this.config.availableVariations,"selected-image":e.selectedImage,translations:e.config.translations},on:{change:e.handleVariationCropChange,close:e.handleCropModalClose}}):e._e(),e.mediaModalOpen?a("media-modal",{attrs:{config:e.config,paths:e.config.paths,"selected-media-id":e.selectedImage.id,tags:e.tags,types:e.types,visibilities:e.visibilities},on:{close:e.handleMediaModalClose,"media-selected":e.handleMediaSelected}}):e._e(),e.uploadModalOpen?a("upload-modal",{attrs:{config:e.config,file:e.newFile,visibilities:e.visibilities},on:{close:e.handleUploadModalClose,uploaded:e.handleResourceUploaded}}):e._e()],1),a("portal-target",{class:"ngrm-model-portal-"+e.fieldId,attrs:{name:"ngrm-body-modal-"+e.fieldId}})],1)}),c=[],d=(a("8e6e"),a("96cf"),a("3b8d")),f=a("bd86"),u=(a("ac6a"),a("456d"),function(){var e=this,t=this,a=t.$createElement,i=t._self._c||a;return t.selectedImage.id?i("div",{staticClass:"ngremotemedia-image"},[i("div",{staticClass:"image-wrap"},["image"===t.selectedImage.type||"video"===t.selectedImage.type?i("img",{ref:"image",attrs:{src:t.selectedImage.previewUrl}}):i("span",{staticClass:"file-placeholder"},[i("span",{staticClass:"icon-doc"},["pdf"===t.selectedImage.format?i("i",{staticClass:"fa fa-file-pdf-o"}):"zip"===t.selectedImage.format||"rar"===t.selectedImage.format?i("i",{staticClass:"fa fa-file-archive-o"}):"ppt"===t.selectedImage.format||"pptx"===t.selectedImage.format?i("i",{staticClass:"fa fa-file-powerpoint-o"}):"doc"===t.selectedImage.format||"docx"===t.selectedImage.format?i("i",{staticClass:"fa fa-file-word-o"}):"xls"===t.selectedImage.format||"xlsx"===t.selectedImage.format?i("i",{staticClass:"fa fa-file-excel-o"}):"aac"===t.selectedImage.format||"aiff"===t.selectedImage.format||"amr"===t.selectedImage.format||"flac"===t.selectedImage.format||"m4a"===t.selectedImage.format||"mp3"===t.selectedImage.format||"ogg"===t.selectedImage.format||"opus"===t.selectedImage.format||"wav"===t.selectedImage.format?i("i",{staticClass:"fa fa-file-audio-o"}):"txt"===t.selectedImage.format?i("i",{staticClass:"fa fa-lg fa-file-text"}):i("i",{staticClass:"fa fa-file"})])])]),i("div",{staticClass:"image-meta"},[i("input",{directives:[{name:"model",rawName:"v-model",value:t.selectedImage.type,expression:"selectedImage.type"}],attrs:{type:"hidden",name:this.config.inputFields.type},domProps:{value:t.selectedImage.type},on:{input:function(e){e.target.composing||t.$set(t.selectedImage,"type",e.target.value)}}}),i("h3",{staticClass:"title"},[t._v(t._s(t.selectedImage.name))]),i("p",[t._v(t._s(this.config.translations.preview_size)+": "+t._s(t.formattedSize))]),i("p",[t._v(t._s(t.selectedImage.type)+" / "+t._s(t.selectedImage.format))]),i("div",{staticClass:"image-meta-data"},[i("div",{staticClass:"ngremotemedia-alttext"},[i("span",{staticClass:"help-block description"},[t._v("\n            "+t._s(this.config.translations.preview_alternate_text)+"\n            "),i("i",{staticClass:"fa fa-info-circle",attrs:{"data-toggle":"tooltip","data-placement":"right",title:this.config.translations.preview_alternate_text_info}})]),i("input",{directives:[{name:"model",rawName:"v-model",value:t.selectedImage.alternateText,expression:"selectedImage.alternateText"},{name:"debounce",rawName:"v-debounce:500ms",value:function(){return t.dispatchChangeEvent(e.config.inputFields.altText)},expression:"() => dispatchChangeEvent(this.config.inputFields.altText)",arg:"500ms"}],staticClass:"media-alttext data",attrs:{type:"text",name:this.config.inputFields.altText},domProps:{value:t.selectedImage.alternateText},on:{input:function(e){e.target.composing||t.$set(t.selectedImage,"alternateText",e.target.value)}}})]),i("div",{staticClass:"ngremotemedia-caption"},[i("span",{staticClass:"help-block description"},[t._v("\n            "+t._s(this.config.translations.preview_caption)+"\n            "),i("i",{staticClass:"fa fa-info-circle",attrs:{"data-toggle":"tooltip","data-placement":"right",title:this.config.translations.preview_caption_info}})]),i("input",{directives:[{name:"model",rawName:"v-model",value:t.selectedImage.caption,expression:"selectedImage.caption"},{name:"debounce",rawName:"v-debounce:500ms",value:function(){return t.dispatchChangeEvent(e.config.inputFields.caption)},expression:"() => dispatchChangeEvent(this.config.inputFields.caption)",arg:"500ms"}],staticClass:"media-caption data",attrs:{type:"text",name:this.config.inputFields.caption},domProps:{value:t.selectedImage.caption},on:{input:function(e){e.target.composing||t.$set(t.selectedImage,"caption",e.target.value)}}})]),i("div",{staticClass:"ngremotemedia-tags"},[i("span",{staticClass:"help-block description"},[t._v("\n            "+t._s(this.config.translations.preview_tags)+"\n            "),i("i",{staticClass:"fa fa-info-circle",attrs:{"data-toggle":"tooltip","data-placement":"right",title:this.config.translations.preview_tags_info}})]),i("v-select",{attrs:{options:t.config.allowedTags.length>0?t.config.allowedTags:t.allTags,multiple:"",taggable:0===t.config.allowedTags.length},on:{input:t.handleTagsInput},model:{value:t.selectedImage.tags,callback:function(e){t.$set(t.selectedImage,"tags",e)},expression:"selectedImage.tags"}}),i("select",{directives:[{name:"model",rawName:"v-model",value:t.selectedImage.tags,expression:"selectedImage.tags"}],staticClass:"ngremotemedia-newtags",attrs:{hidden:"",name:this.config.inputFields.tags,multiple:"multiple"},on:{change:function(e){var a=Array.prototype.filter.call(e.target.options,(function(e){return e.selected})).map((function(e){var t="_value"in e?e._value:e.value;return t}));t.$set(t.selectedImage,"tags",e.target.multiple?a:a[0])}}},t._l(t.allTags,(function(e){return i("option",{key:e},[t._v(t._s(e))])})),0)],1),i("div",{staticClass:"ngremotemedia-watermark-text"},[i("span",{staticClass:"help-block description"},[t._v("\n          "+t._s(this.config.translations.preview_watermark_text)+"\n          "),i("i",{staticClass:"fa fa-info-circle",attrs:{"data-toggle":"tooltip","data-placement":"right",title:this.config.translations.preview_watermark_text_info}})]),i("input",{directives:[{name:"model",rawName:"v-model",value:t.selectedImage.watermarkText,expression:"selectedImage.watermarkText"},{name:"debounce",rawName:"v-debounce:500ms",value:function(){return t.dispatchChangeEvent(e.config.inputFields.watermarkText)},expression:"() => dispatchChangeEvent(this.config.inputFields.watermarkText)",arg:"500ms"}],staticClass:"media-watermarktext data",attrs:{type:"text",name:this.config.inputFields.watermarkText},domProps:{value:t.selectedImage.watermarkText},on:{input:function(e){e.target.composing||t.$set(t.selectedImage,"watermarkText",e.target.value)}}})]),this.isEmbed?i("div",{staticClass:"ngremotemedia-css-class"},[i("span",{staticClass:"help-block description"},[t._v("\n          "+t._s(this.config.translations.preview_css_class)+"\n          "),this.config.translations.preview_css_class_info?i("i",{staticClass:"fa fa-info-circle",attrs:{"data-toggle":"tooltip","data-placement":"right",title:this.config.translations.preview_css_class_info}}):t._e()]),i("input",{directives:[{name:"model",rawName:"v-model",value:t.selectedImage.cssClass,expression:"selectedImage.cssClass"},{name:"debounce",rawName:"v-debounce:500ms",value:function(){return t.dispatchChangeEvent(e.config.inputFields.cssClass)},expression:"() => dispatchChangeEvent(this.config.inputFields.cssClass)",arg:"500ms"}],staticClass:"media-css-class data",attrs:{type:"text",name:this.config.inputFields.cssClass},domProps:{value:t.selectedImage.cssClass},on:{input:function(e){e.target.composing||t.$set(t.selectedImage,"cssClass",e.target.value)}}})]):t._e(),this.isEmbed&&this.hasVariations?i("div",{staticClass:"ngremotemedia-selected-variation"},[i("input",{attrs:{type:"hidden",name:this.config.inputFields.selectedVariation},domProps:{value:t.selectedImage.selectedVariation}}),i("span",{staticClass:"help-block description"},[t._v("\n            "+t._s(this.config.translations.preview_selected_variation)+"\n            "),this.config.translations.preview_selected_variation_info?i("i",{staticClass:"fa fa-info-circle",attrs:{"data-toggle":"tooltip","data-placement":"right",title:this.config.translations.preview_selected_variation_info}}):t._e()]),i("v-select",{attrs:{options:this.variationOptions},on:{input:function(){return t.dispatchChangeEvent(e.config.inputFields.selectedVariation)}},model:{value:t.selectedImage.selectedVariation,callback:function(e){t.$set(t.selectedImage,"selectedVariation",e)},expression:"selectedImage.selectedVariation"}})],1):t._e()])])]):i("div",[i("i",[t._v(t._s(this.config.translations.interactions_no_media_selected))])])}),p=[],h=(a("5df3"),a("4f7f"),a("75fc")),m=(a("28a5"),a("01c8")),g=function(e){var t=[];for(var a in e)t.push(encodeURIComponent(a)+"="+encodeURIComponent(e[a]));return t.join("&")},v=function(e){return e[0].toUpperCase()+e.slice(1)},b=function(e){var t=e.split("-"),a=Object(m["a"])(t),i=a[0],s=a.slice(1);return[i].concat(Object(h["a"])(s.map(v))).join("")},_=function(e,t){var a=Math.pow(10,t);return parseFloat(Math.round(e*a)/a).toFixed(t)},w={B:"KB",KB:"MB",MB:"GB",GB:"TB"},y=function e(t){var a=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"B",i=w[a];return!i||t<1024?"".concat(_(t,2)," ").concat(a):e(t/1024,i)},C=a("4a7a"),x=a.n(C),F={name:"Preview",props:["config","fieldId","selectedImage"],data:function(){return{allTags:[]}},components:{"v-select":x.a},computed:{nonImagePreviewClass:function(){return"video"===this.selectedImage.type?"ng-video":"ng-book"},formattedSize:function(){return y(this.selectedImage.size)},isEmbed:function(){return"embed"===this.config.mode},hasVariations:function(){return this.config.allVariations.length>0},variationOptions:function(){return this.config.allVariations.map((function(e){return{label:e,value:e}}))}},methods:{handleTagsInput:function(e){this.allTags=Object(h["a"])(new Set([].concat(Object(h["a"])(this.allTags),Object(h["a"])(e)))),this.dispatchChangeEvent(this.config.inputFields.tags)},dispatchChangeEvent:function(e){this.$emit("preview-change",e)}},mounted:function(){this.allTags=Object(h["a"])(this.selectedImage.tags)},watch:{selectedImage:function(){this.allTags=Object(h["a"])(this.selectedImage.tags)}}},O=F,I=(a("0ab7"),a("2877")),V=Object(I["a"])(O,u,p,!1,null,"7b7e2b48",null),k=V.exports,j=function(){var e=this,t=e.$createElement,a=e._self._c||t;return a("modal",{attrs:{title:this.config.translations.browse_title},on:{close:function(t){return e.$emit("close")}}},[a("media-facets",{attrs:{config:e.config,tags:e.tags,types:e.types,visibilities:e.visibilities,facets:e.facets,"facets-loading":e.facetsLoading},on:{change:e.handleFacetsChange}}),a("media-gallery",{attrs:{translations:e.config.translations,media:e.media,canLoadMore:e.canLoadMore,selectedMediaId:e.selectedMediaId,loading:e.loading},on:{loadMore:e.handleLoadMore,"media-selected":function(t){return e.$emit("media-selected",t)}}}),e.loading?a("i",{staticClass:"ng-icon ng-spinner"}):e._e()],1)},S=[],M=a("768b"),T=(a("ffc1"),function(){var e=this,t=e.$createElement,a=e._self._c||t;return a("div",{staticClass:"mediaFacets"},[a("div",{staticClass:"body"},[e.types.length>1?a("div",{staticClass:"form-field"},[a("label",{attrs:{for:"type"}},[e._v(e._s(this.config.translations.browse_select_type))]),a("v-select",{attrs:{options:e.types,label:"name",reduce:function(e){return e.id},placeholder:e.facetsLoading?this.config.translations.browse_loading_types:this.config.translations.browse_all_types},on:{input:e.handleTypeChange},model:{value:e.selectedType,callback:function(t){e.selectedType=t},expression:"selectedType"}})],1):e._e(),e.folders&&!this.config.folder?a("div",{staticClass:"form-field"},[a("label",{attrs:{for:"folder"}},[e._v(e._s(this.config.translations.browse_select_folder))]),a("treeselect",{attrs:{multiple:!1,options:e.folders,"load-options":e.loadSubFolders,value:this.config.parentFolder?this.config.parentFolder.id:"",placeholder:e.facetsLoading?this.config.translations.browse_loading_folders:this.config.translations.browse_all_folders,disabled:e.facetsLoading,clearable:!0,beforeClearAll:e.clearFolderField,defaultExpandLevel:1},on:{input:e.handleFolderChange},model:{value:e.selectedFolder,callback:function(t){e.selectedFolder=t},expression:"selectedFolder"}})],1):e._e(),e.tags.length>1?a("div",{staticClass:"form-field"},[a("label",{attrs:{for:"tag"}},[e._v(e._s(this.config.translations.browse_select_tag))]),a("v-select",{attrs:{options:e.tags,label:"name",reduce:function(e){return e.id},placeholder:e.facetsLoading?this.config.translations.browse_loading_tags:this.config.translations.browse_all_tags,disabled:e.facetsLoading},on:{input:e.handleTagChange},model:{value:e.tag,callback:function(t){e.tag=t},expression:"tag"}})],1):e._e(),e.visibilities.length>1?a("div",{staticClass:"form-field"},[a("label",{attrs:{for:"visibilities"}},[e._v(e._s(this.config.translations.browse_select_visibility))]),a("v-select",{attrs:{options:e.visibilities,label:"name",reduce:function(e){return e.id},placeholder:e.facetsLoading?this.config.translations.browse_loading_visibilities:this.config.translations.browse_all_visibilities,disabled:e.facetsLoading},on:{input:e.handleVisibilityChange},model:{value:e.visibility,callback:function(t){e.visibility=t},expression:"visibility"}})],1):e._e(),a("div",{staticClass:"search-wrapper"},[a("span",{staticClass:"search-label"},[e._v(e._s(this.config.translations.search))]),a("div",{staticClass:"search"},[a("input",{directives:[{name:"model",rawName:"v-model",value:e.query,expression:"query"}],attrs:{type:"text",placeholder:this.config.translations.search_placeholder},domProps:{value:e.query},on:{keyup:e.handleQueryChange,keydown:function(t){return!t.type.indexOf("key")&&e._k(t.keyCode,"enter",13,t.key,"Enter")?null:(t.preventDefault(),null(t))},input:function(t){t.target.composing||(e.query=t.target.value)}}})])])])])}),E=[],$="all",P="image",z="video",R="raw",L="(all)",A="(root)",U="all",D=a("ca17"),N=a.n(D),B=(a("542c"),{name:"MediaFacets",props:["config","tags","types","visibilities","facets","facetsLoading"],data:function(){return{TYPE_ALL:$,TYPE_IMAGE:P,TYPE_VIDEO:z,TYPE_RAW:R,FOLDER_ALL:L,FOLDER_ROOT:A,TAG_ALL:U,folders:[{id:this.config.parentFolder?this.config.parentFolder.id:A,label:this.config.parentFolder?this.config.parentFolder.label:A,children:null}],selectedFolder:this.facets.folder,selectedType:this.facets.type,query:this.facets.query,tag:this.facets.tag,visibility:this.facets.visibility}},methods:{clearFolderField:function(){return!this.config.parentFolder||(this.selectedFolder=this.config.parentFolder.id,!1)},handleTypeChange:function(e){this.$emit("change",{type:e})},handleFolderChange:function(e){this.selectedFolder=e,"undefined"!==typeof e&&e||(this.selectedFolder=this.config.parentFolder?this.config.parentFolder.id:e),this.$emit("change",{folder:this.selectedFolder})},handleQueryChange:function(){this.$emit("change",{query:this.query})},handleTagChange:function(){this.$emit("change",{tag:this.tag})},handleVisibilityChange:function(){this.$emit("change",{visibility:this.visibility})},loadSubFolders:function(){var e=Object(d["a"])(regeneratorRuntime.mark((function e(t){var a,i,s;return regeneratorRuntime.wrap((function(e){while(1)switch(e.prev=e.next){case 0:return a=t.parentNode,i={folder:"(root)"===a.id?"":a.id},e.next=4,fetch(this.config.paths.load_folders+"?"+g(i));case 4:return s=e.sent,e.next=7,s.json();case 7:a.children=e.sent,t.callback();case 9:case"end":return e.stop()}}),e,this)})));function t(t){return e.apply(this,arguments)}return t}()},components:{"v-select":x.a,treeselect:N.a}}),q=B,G=(a("c345"),Object(I["a"])(q,T,E,!1,null,"278bb214",null)),W=G.exports,Y=function(){var e=this,t=e.$createElement,a=e._self._c||t;return a("div",{staticClass:"media-gallery"},[a("div",{class:e.loading?"items loading":"items"},[e.media.length?e._e():a("div",{staticClass:"folder-empty"},[a("span",{staticClass:"ngrm-icon-folder"}),a("span",[a("strong",[e._v(e._s(this.translations.media_gallery_empty_folder))]),e._v(e._s(this.translations.media_gallery_upload_media))])]),e._l(e.media,(function(t){return a("div",{key:t.id,staticClass:"media",class:{selected:t.remoteId===e.selectedMediaId}},["image"===t.type||"video"===t.type&&""!==t.browseUrl?a("div",{staticClass:"media-container"},[a("img",{staticClass:"img",attrs:{src:t.browseUrl,alt:t.filename}}),a("Label",{staticClass:"filename"},[e._v(e._s(t.filename))]),a("div",{staticClass:"size-description"},["public"===t.visibility?a("i",{staticClass:"fa fa-solid fa-globe"},[e._v("  ")]):e._e(),"private"===t.visibility?a("i",{staticClass:"fa fa-eye-slash"},[e._v("  ")]):e._e(),"protected"===t.visibility?a("i",{staticClass:"fa fa-lock"},[e._v("  ")]):e._e(),a("span",{staticClass:"format"},[e._v(e._s(t.format))]),e._v(" - "+e._s(t.width)+" x "+e._s(t.height)+" - "+e._s(e.showFilesize(t))+"\n        ")])],1):a("div",{staticClass:"media-container"},[a("span",{staticClass:"file-placeholder"},[a("span",{staticClass:"icon-doc"},["pdf"===t.format?a("i",{staticClass:"fa fa-file-pdf-o"}):"zip"===t.format||"rar"===t.format?a("i",{staticClass:"fa fa-file-archive-o"}):"ppt"===t.format||"pptx"===t.format?a("i",{staticClass:"fa fa-file-powerpoint-o"}):"doc"===t.format||"docx"===t.format?a("i",{staticClass:"fa fa-file-word-o"}):"xls"===t.format||"xlsx"===t.format?a("i",{staticClass:"fa fa-file-excel-o"}):"aac"===t.format||"aiff"===t.format||"amr"===t.format||"flac"===t.format||"m4a"===t.format||"mp3"===t.format||"ogg"===t.format||"opus"===t.format||"wav"===t.format?a("i",{staticClass:"fa fa-file-audio-o"}):"txt"===t.format?a("i",{staticClass:"fa fa-lg fa-file-text"}):a("i",{staticClass:"fa fa-file"})])]),a("Label",{staticClass:"filename"},[e._v(e._s(t.filename))]),a("div",{staticClass:"size-description"},["public"===t.visibility?a("i",{staticClass:"fa fa-solid fa-globe"},[e._v("  ")]):e._e(),"private"===t.visibility?a("i",{staticClass:"fa fa-eye-slash"},[e._v("  ")]):e._e(),"protected"===t.visibility?a("i",{staticClass:"fa fa-lock"},[e._v("  ")]):e._e(),a("span",{staticClass:"format"},[e._v(e._s(t.format))]),e._v(" - "+e._s(e.showFilesize(t))+"\n        ")])],1),a("button",{staticClass:"btn btn-blue select-btn",attrs:{type:"button"},on:{click:function(a){return e.$emit("media-selected",t)}}},[e._v(e._s(e._self.translations.media_gallery_select))])])}))],2),e.canLoadMore?a("div",{staticClass:"load-more-wrapper"},[a("button",{staticClass:"btn btn-blue",attrs:{type:"button"},on:{click:function(t){return e.$emit("loadMore")}}},[e._v(e._s(this.translations.media_gallery_load_more))])]):e._e()])},J=[],K=a("94df"),Q=a.n(K),H={name:"MediaGallery",props:["translations","media","canLoadMore","onLoadMore","selectedMediaId","loading"],methods:{showFilesize:function(e){return Q()(e.size)}}},X=H,Z=(a("bdf2"),Object(I["a"])(X,Y,J,!1,null,"5aa52c90",null)),ee=Z.exports,te=a("b012"),ae=a.n(te),ie=function(){var e=this,t=e.$createElement,a=e._self._c||t;return a("div",{staticClass:"ngrm-overlay"},[a("div",{staticClass:"media-modal"},[a("div",{staticClass:"title"},[e._v("\n      "+e._s(e.title)+"\n      "),a("span",{staticClass:"close",on:{click:e.close}},[a("span",{staticClass:"ngrm-icon-cancel"})])]),a("div",{staticClass:"body"},[e._t("default")],2)])])},se=[],ne={name:"Modal",props:["title"],methods:{close:function(){this.$emit("close")}}},oe=ne,le=(a("7397"),a("a301"),Object(I["a"])(oe,ie,se,!1,null,"03fd1c54",null)),re=le.exports;function ce(e,t){var a=Object.keys(e);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);t&&(i=i.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),a.push.apply(a,i)}return a}function de(e){for(var t=1;t<arguments.length;t++){var a=null!=arguments[t]?arguments[t]:{};t%2?ce(a,!0).forEach((function(t){Object(f["a"])(e,t,a[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(a)):ce(a).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(a,t))}))}return e}var fe=25,ue={name:"MediaModal",props:["config","tags","types","visibilities","facetsLoading","selectedMediaId","paths"],components:{"media-facets":W,"media-gallery":ee,modal:re},data:function(){var e=null;return this.config.parentFolder&&(e=this.config.parentFolder.id),this.config.folder&&(e=this.config.folder.id),{media:[],canLoadMore:!1,nextCursor:null,loading:!0,facets:{folder:e,type:"",query:"",tag:"",visibility:""}}},methods:{debouncedLoad:ae()((function(e){this.load(e)}),500),load:function(){var e=Object(d["a"])(regeneratorRuntime.mark((function e(){var t,a,i,s,n,o,l,r,c,d,f,u,p=arguments;return regeneratorRuntime.wrap((function(e){while(1)switch(e.prev=e.next){case 0:for(t=p.length>0&&void 0!==p[0]?p[0]:{patch:!1},a=t.patch,this.loading=!0,this.abortController&&this.abortController.abort(),this.abortController=new AbortController,i={limit:fe,offset:a?this.media.length:0},this.facets.query&&(i["query"]=this.facets.query),this.config.allowedTypes.length>0&&(i["type"]=this.config.allowedTypes),this.facets.type&&(i["type"]=this.facets.type),this.facets.folder&&(i["folder"]=this.facets.folder===A?"":this.facets.folder),this.config.allowedTags.length>0&&(i["tag"]=this.config.allowedTags),this.facets.tag&&(i["tag"]=this.facets.tag),this.config.allowedVisibilities.length>0&&(i["visibility"]=this.config.allowedVisibilities),this.facets.visibility&&(i["visibility"]=this.facets.visibility),a&&this.nextCursor&&(i["next_cursor"]=this.nextCursor),s="",n=0,o=Object.entries(i);n<o.length;n++)l=Object(M["a"])(o[n],2),r=l[0],c=l[1],""!==s&&(s+="&"),c.constructor===Array?(s+=r+"[]=",s+=c.join("&"+r+"[]=")):s+=r+"="+c;return d="".concat(this.paths.browse_resources,"?").concat(encodeURI(s)),e.prev=17,e.next=20,fetch(d,{signal:this.abortController.signal});case 20:return f=e.sent,e.next=23,f.json();case 23:u=e.sent,this.media=a?this.media.concat(u.hits):u.hits,this.canLoadMore=u.load_more,this.nextCursor=u.next_cursor,this.loading=!1,e.next=34;break;case 30:if(e.prev=30,e.t0=e["catch"](17),20===e.t0.code){e.next=34;break}throw e.t0;case 34:case"end":return e.stop()}}),e,this,[[17,30]])})));function t(){return e.apply(this,arguments)}return t}(),handleLoadMore:function(){this.debouncedLoad({patch:!0})},handleFacetsChange:function(e){this.facets=de({},this.facets,{},e),this.debouncedLoad()}},mounted:function(){this.load()}},pe=ue,he=(a("ab92"),Object(I["a"])(pe,j,S,!1,null,"751395c8",null)),me=he.exports,ge=function(){var e=this,t=e.$createElement,a=e._self._c||t;return a("modal",{attrs:{title:this.translations.crop_modal_title},on:{close:function(t){return e.$emit("close")}}},[a("crop-sizes",{attrs:{translations:e.translations,availableVariations:e.availableVariations,allVariationValues:e.allVariationValues,imageSize:e.imageSize,selectedVariation:e.selectedVariation},on:{selected:e.handleVariationSelected,addedVariations:e.handleAddedVariations,removedVariation:e.handleRemovedVariation}}),e._l(e.availableVariations,(function(t,i){return a("div",{key:i,staticClass:"crop-container"},[i===e.selectedVariation?a("crop",{attrs:{translations:e.translations,value:e.allVariationValues[i],src:e.selectedImage.url,variation:e.availableVariations[i],imageSize:e.imageSize},on:{change:function(t){return e.handleVariationValueChange(i,t)}}}):e._e()],1)})),e.selectedVariation?e._e():a("div",{staticClass:"img-placeholder"},[a("img",{attrs:{src:e.selectedImage.url}})]),a("div",{staticClass:"action-strip"},[a("button",{staticClass:"btn",attrs:{type:"button"},on:{click:e.handleCancelClicked}},[e._v(e._s(this.translations.crop_cancel))]),a("button",{staticClass:"btn btn-blue",attrs:{type:"button"},on:{click:e.handleSaveClicked}},[a("span",{staticClass:"ngrm-icon-floppy"}),a("span",[e._v(e._s(this.translations.crop_save_sizes))])])])],2)},ve=[],be=function(){var e=this,t=e.$createElement,a=e._self._c||t;return a("div",{staticClass:"sidebar-crop"},[a("div",{staticClass:"buttons"},[e.addingVariations?e._e():a("button",{staticClass:"btn",attrs:{type:"button"},on:{click:e.handleAddCropSize}},[e._v(e._s(this.translations.crop_add_size))]),e.addingVariations?a("button",{staticClass:"btn",attrs:{type:"button"},on:{click:e.handleCancel}},[e._v(e._s(this.translations.crop_cancel))]):e._e(),e.addingVariations?a("button",{staticClass:"btn crop-btn-add",attrs:{type:"button"},on:{click:e.handleAdd}},[e._v(e._s(this.translations.crop_add))]):e._e()]),a("div",{staticClass:"sidebar-crop-label"},[a("span",[e._v(e._s(this.translations.crop_added_for_confirmation))])]),a("div",{directives:[{name:"show",rawName:"v-show",value:e.addingVariations,expression:"addingVariations"}],class:{unselectedVariations:e.addingVariations}},e._l(e.unselectedVariations,(function(t){return a("div",{key:t,class:{disabled:!e.isVariationSelectable(t)}},[a("input",{directives:[{name:"model",rawName:"v-model",value:e.newSelection,expression:"newSelection"}],attrs:{type:"checkbox",id:t,disabled:!e.isVariationSelectable(t)},domProps:{value:t,checked:Array.isArray(e.newSelection)?e._i(e.newSelection,t)>-1:e.newSelection},on:{change:function(a){var i=e.newSelection,s=a.target,n=!!s.checked;if(Array.isArray(i)){var o=t,l=e._i(i,o);s.checked?l<0&&(e.newSelection=i.concat([o])):l>-1&&(e.newSelection=i.slice(0,l).concat(i.slice(l+1)))}else e.newSelection=n}}}),a("label",{attrs:{for:t}},[a("span",{staticClass:"name"},[e._v(e._s(t))]),a("span",{staticClass:"formatted-size"},[e._v(e._s(e.formattedSize(t)))])]),e.isVariationSelectable(t)?e._e():a("div",{staticClass:"legend-not-selectable"},[a("span",[e._v(e._s(e._self.translations.crop_media_too_small))])])])})),0),a("div",{staticClass:"selectedVariations"},[a("ul",e._l(e.selectedVariations,(function(t){return a("li",{key:t,class:{set:!!e.allVariationValues[t],selected:e.selectedVariation===t,disabled:!e.isVariationSelectable(t)},on:{click:function(a){return e.handleVariationClicked(t)}}},[a("div",[a("span",{staticClass:"name"},[e._v(e._s(t))]),a("span",{staticClass:"formatted-size"},[e._v(e._s(e.formattedSize(t)))])]),e.addingVariations?e._e():a("a",[a("span",{staticClass:"circle-orange"}),a("span",{staticClass:"ngrm-icon-trash",on:{click:function(a){return e.removeItem(t)}}})])])})),0)])])},_e=[],we=(a("7f7f"),{name:"CropSizes",props:["translations","availableVariations","allVariationValues","imageSize","selectedVariation"],data:function(){return{newSelection:[],addingVariations:!1}},computed:{unselectedVariations:function(){var e=Object.keys(this.availableVariations),t=Object.keys(this.allVariationValues);return e.difference(t)},selectedVariations:function(){return Object.getOwnPropertyNames(this.allVariationValues)}},methods:{handleAddCropSize:function(){this.addingVariations=!0},handleCancel:function(){this.addingVariations=!1,this.newSelection=[]},handleAdd:function(){this.$emit("addedVariations",this.newSelection),this.newSelection=[],this.addingVariations=!1},removeItem:function(e){this.$emit("removedVariation",e)},formattedSize:function(e){return"".concat(this.availableVariations[e][0]," x ").concat(this.availableVariations[e][1])},isVariationSelectable:function(e){var t=Object(M["a"])(this.availableVariations[e],2),a=t[0],i=t[1];return this.imageSize.width>=a&&this.imageSize.height>=i},handleVariationClicked:function(e){this.isVariationSelectable(e)&&this.$emit("selected",e)}}}),ye=we,Ce=(a("bdd7"),Object(I["a"])(ye,be,_e,!1,null,"ad171770",null)),xe=Ce.exports,Fe=function(){var e=this,t=e.$createElement,a=e._self._c||t;return a("div",{staticClass:"crop"},[a("div",{ref:"cropper",staticClass:"cropper",style:e.cropperStyle},[a("img",{ref:"image",attrs:{src:e.src}}),a("div",{ref:"buttons",staticClass:"buttons",style:e.applyButtonStyle},[a("button",{staticClass:"btn btn-blue",attrs:{type:"button"},on:{click:e.handleReset}},[a("span",{staticClass:"ngrm-icon-ccw"}),a("span",[e._v(e._s(this.translations.crop_reset))])]),a("button",{staticClass:"btn btn-blue",attrs:{type:"button"},on:{click:e.handleApply}},[a("span",{staticClass:"ngrm-icon-ok"}),a("span",[e._v(e._s(this.translations.crop_apply))])])])]),a("div",[a("h4",[e._v(e._s(this.translations.crop_preview))]),a("div",{ref:"preview",staticClass:"preview"})])])},Oe=[],Ie=a("5435"),Ve={name:"Crop",props:["translations","value","variation","src","imageSize"],mounted:function(){this.setCropper()},beforeDestroy:function(){this.destroyCropper()},data:function(){return{crop:{},cropper:null}},methods:{setCropper:function(){var e,t=this.value||{},a=t.x,i=t.y,s=t.w,n=t.h,o={x:a,y:i,width:s,height:n},l=Object(M["a"])(this.variation,2),r=l[0],c=l[1],d=r>0&&c>0?r/c:void 0;this.destroyCropper();this.$refs.cropper.clientWidth,this.imageSize.width;this.cropper=new Ie["a"](this.$refs.image,(e={viewMode:2,dragMode:"none",autoCrop:!0,data:o,aspectRatio:d,guides:!0,movable:!1,rotatable:!1},Object(f["a"])(e,"guides",!1),Object(f["a"])(e,"center",!1),Object(f["a"])(e,"zoomable",!1),Object(f["a"])(e,"scalable",!0),Object(f["a"])(e,"minCropBoxWidth",50),Object(f["a"])(e,"minCropBoxHeight",50),Object(f["a"])(e,"crop",this.handleCrop),Object(f["a"])(e,"preview",this.$refs.preview),e)),this.cropper.setData(o)},handleCrop:function(e){this.crop=this.cropper.getData(!0)},destroyCropper:function(){this.cropper&&this.cropper.destroy()},handleReset:function(){this.cropper.reset()},handleApply:function(){var e=this.cropper.getData(!0),t=e.x,a=e.y,i=e.width,s=e.height;this.$emit("change",{x:t,y:a,w:i,h:s})}},computed:{applyButtonStyle:function(){var e=this.crop,t=e.x,a=e.y,i=e.width,s=e.height,n=this.$refs.buttons?this.$refs.buttons.clientWidth:0,o=this.$refs.cropper?this.$refs.cropper.clientWidth/this.imageSize.width:1;return{top:"".concat((a+s)*o+10,"px"),left:"".concat((t+i)*o-n-1,"px")}},cropperStyle:function(){var e=this.imageSize.height/this.imageSize.width*100;return{"padding-bottom":"".concat(e,"%"),height:"0px",width:"100%"}}}},ke=Ve,je=(a("c66d"),Object(I["a"])(ke,Fe,Oe,!1,null,"5f73791e",null)),Se=je.exports,Me=function(e){return function(t){return Object.keys(t).reduce((function(a,i){return e(t[i],i)&&(a[i]=t[i]),a}),{})}},Te=function(e){return function(t){return!e(t)}},Ee=function(e){return function(t){return e===t}},$e=function(e){return!!e},Pe=Te(Ee(void 0));function ze(e,t){var a=Object.keys(e);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);t&&(i=i.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),a.push.apply(a,i)}return a}function Re(e){for(var t=1;t<arguments.length;t++){var a=null!=arguments[t]?arguments[t]:{};t%2?ze(a,!0).forEach((function(t){Object(f["a"])(e,t,a[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(a)):ze(a).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(a,t))}))}return e}var Le={name:"CropModal",props:["translations","availableVariations","selectedImage"],components:{modal:re,"crop-sizes":xe,crop:Se},data:function(){return{selectedVariation:null,newVariationValues:{}}},computed:{allVariationValues:function(){return Me(Pe)(Re({},this.selectedImage.variations,{},this.newVariationValues))},imageSize:function(){return{height:this.selectedImage.height,width:this.selectedImage.width}}},methods:{handleVariationSelected:function(e){this.selectedVariation=e},handleAddedVariations:function(e){this.newVariationValues=Re({},this.newVariationValues,{},e.reduce((function(e,t){return e[t]=null,e}),{}))},handleRemovedVariation:function(e){this.newVariationValues=Re({},this.newVariationValues,Object(f["a"])({},e,void 0))},handleVariationValueChange:function(e,t){this.newVariationValues=Re({},this.newVariationValues,Object(f["a"])({},e,t))},handleCancelClicked:function(){this.newVariationValues={},this.$emit("close")},handleSaveClicked:function(){this.$emit("change",Re({},this.newVariationValues)),this.newVariationValues={},this.$emit("close")}}},Ae=Le,Ue=(a("4d22"),Object(I["a"])(Ae,ge,ve,!1,null,"45497070",null)),De=Ue.exports,Ne=function(){var e=this,t=e.$createElement,a=e._self._c||t;return a("modal",{attrs:{title:this.config.translations.upload_modal_title},on:{close:function(t){return e.$emit("close")}}},[a("div",{class:e.loading?"loading":""},[a("select-folder",{attrs:{config:e.config,"selected-folder":e.selectedFolder},on:{select:e.handleFolderChange,change:e.handleFolderChange}}),a("div",{staticClass:"input-file-name-wrapper"},[this.error?a("div",{staticClass:"error"},[e._v("\n        "+e._s(this.error)+"\n        "),this.existingResourceButton?a("a",{attrs:{href:"javascript:void(0);"},on:{click:function(t){return e.$emit("uploaded",e.existingResource)}}},[e._v("\n          "+e._s(this.config.translations.upload_button_use_existing_resource)+"\n        ")]):e._e()]):e._e(),a("input",{directives:[{name:"model",rawName:"v-model",value:e.filename,expression:"filename"}],class:e.error?"error":"",attrs:{type:"text"},domProps:{value:e.filename},on:{input:function(t){t.target.composing||(e.filename=t.target.value)}}}),e.visibilities.length>1?a("v-select",{attrs:{options:e.visibilities,label:"name",reduce:function(e){return e.id},clearable:!1},model:{value:e.visibility,callback:function(t){e.visibility=t},expression:"visibility"}}):e._e(),a("input",{directives:[{name:"model",rawName:"v-model",value:e.overwrite,expression:"overwrite"}],attrs:{type:"checkbox",id:"ngrm-upload-overwrite"},domProps:{checked:Array.isArray(e.overwrite)?e._i(e.overwrite,null)>-1:e.overwrite},on:{change:function(t){var a=e.overwrite,i=t.target,s=!!i.checked;if(Array.isArray(a)){var n=null,o=e._i(a,n);i.checked?o<0&&(e.overwrite=a.concat([n])):o>-1&&(e.overwrite=a.slice(0,o).concat(a.slice(o+1)))}else e.overwrite=s}}}),a("label",{attrs:{for:"ngrm-upload-overwrite"}},[e._v(e._s(this.config.translations.upload_checkbox_overwrite))]),a("button",{staticClass:"btn btn-blue",attrs:{type:"button",disabled:""===e.filename||""===e.visibility},on:{click:e.upload}},[e._v("\n        "+e._s(this.config.translations.upload_button_upload)+"\n      ")])],1)],1),e.loading?a("i",{staticClass:"ng-icon ng-spinner"}):e._e()])},Be=[],qe=function(){var e=this,t=e.$createElement,a=e._self._c||t;return a("div",{staticClass:"folder-gallery"},[a("div",{class:e.loading?"items loading":"items"},[a("div",{staticClass:"breadcrumbs"},[a("span",[e._v(e._s(this.config.translations.upload_breadcrumbs_info)+" ")]),e._l(e.breadcrumbs,(function(t,i){return a("span",{key:i},[0!==i?a("span",[e._v(" / ")]):e._e(),i!==e.breadcrumbs.length-1?a("a",{attrs:{href:"javascript:void(0);"},on:{click:function(a){return e.openFolder(t.id)}}},[e._v("\n          "+e._s(t.label)+"\n        ")]):a("span",[e._v(e._s(t.label))])])}))],2),e.folders.length>0||e.allowCreate?a("div",{staticClass:"info"},[a("i",{staticClass:"fa fa-info-circle"}),e._v("\n      "+e._s(this.config.translations.upload_info_text)+"\n    ")]):e._e(),e._l(e.folders,(function(t){return a("div",{key:t.id,staticClass:"media",class:{selected:t.id===e._self.folder}},[a("div",{staticClass:"media-container",on:{dblclick:function(a){return e.openFolder(t.id)}}},[e._m(0,!0),a("Label",{staticClass:"filename"},[e._v(e._s(t.label))])],1),a("button",{staticClass:"btn btn-blue select-btn",attrs:{type:"button"},on:{click:function(a){return e.$emit("select",t.id)}}},[e._v("\n        "+e._s(e._self.config.translations.upload_button_select)+"\n      ")])])})),e.allowCreate?a("div",{staticClass:"media new-folder"},[a("div",{staticClass:"media-container"},[e._m(1),a("input",{directives:[{name:"model",rawName:"v-model",value:e.newFolder,expression:"newFolder"}],attrs:{type:"text",placeholder:this.config.translations.upload_placeholder_new_folder},domProps:{value:e.newFolder},on:{input:function(t){t.target.composing||(e.newFolder=t.target.value)}}})]),a("button",{staticClass:"btn btn-blue select-btn",attrs:{type:"button",disabled:null===e.newFolder},on:{click:e.createNewFolder}},[e._v("\n        "+e._s(this.config.translations.upload_button_create)+"\n      ")])]):e._e()],2),e.loading?a("i",{staticClass:"ng-icon ng-spinner"}):e._e()])},Ge=[function(){var e=this,t=e.$createElement,a=e._self._c||t;return a("span",{staticClass:"file-placeholder"},[a("span",{staticClass:"icon-doc"},[a("i",{staticClass:"fa fa-folder"})])])},function(){var e=this,t=e.$createElement,a=e._self._c||t;return a("span",{staticClass:"file-placeholder"},[a("span",{staticClass:"icon-doc"},[a("i",{staticClass:"fa fa-folder"})])])}],We=a("bc3a"),Ye=a.n(We),Je={name:"SelectFolder",props:["config","selectedFolder"],data:function(){return{folders:[],newFolder:null,breadcrumbs:[],loading:!1,allowCreate:!0,folder:this.selectedFolder}},methods:{openFolder:function(e){this.folder=e,this.$emit("change",this.folder),this.loadSubFolders(e)},loadSubFolders:function(){var e=Object(d["a"])(regeneratorRuntime.mark((function e(t){var a,i,s;return regeneratorRuntime.wrap((function(e){while(1)switch(e.prev=e.next){case 0:return this.loading=!0,a=this.config.paths.load_folders,t&&(i={folder:t===A?"":t},a+="?"+g(i)),e.next=5,fetch(a);case 5:return s=e.sent,e.next=8,s.json();case 8:this.folders=e.sent,this.generateBreadcrumbs(t),this.newFolder=null,this.loading=!1;case 12:case"end":return e.stop()}}),e,this)})));function t(t){return e.apply(this,arguments)}return t}(),generateBreadcrumbs:function(e){var t=this;this.breadcrumbs=[];var a={id:null,label:this.config.translations.upload_root_folder};if(null!==e){var i=e.split("/"),s=[],n=[];this.config.parentFolder&&(n=this.config.parentFolder.id.split("/"),a={id:this.config.parentFolder.id,label:this.config.parentFolder.label}),this.config.folder&&(n=this.config.folder.id.split("/"),a={id:this.config.folder.id,label:this.config.folder.label}),this.breadcrumbs.push(a),i.forEach((function(e,a){s.push(e),n.indexOf(e)<0&&t.breadcrumbs.push({id:s.join("/"),label:e})}))}else this.breadcrumbs.push(a)},createNewFolder:function(){var e=Object(d["a"])(regeneratorRuntime.mark((function e(){var t;return regeneratorRuntime.wrap((function(e){while(1)switch(e.prev=e.next){case 0:return this.loading=!0,t=new FormData,this.folder&&t.append("parent",this.folder),t.append("folder",this.newFolder),e.next=6,Ye.a.post(this.config.paths.create_folder,t);case 6:this.folders.push({id:null!==this.folder?this.folder+"/"+this.newFolder:this.newFolder,label:this.newFolder}),this.newFolder=null,this.loading=!1;case 9:case"end":return e.stop()}}),e,this)})));function t(){return e.apply(this,arguments)}return t}()},created:function(){if(this.config.folder)return e=this.config.folder.id,this.allowCreate=!1,this.folder=e,this.$emit("change",this.folder),void this.generateBreadcrumbs(e);var e=null;this.config.parentFolder&&(e=this.config.parentFolder.id),this.openFolder(e)}},Ke=Je,Qe=(a("85ab"),Object(I["a"])(Ke,qe,Ge,!1,null,"c53732c8",null)),He=Qe.exports,Xe={name:"UploadModal",props:["config","file","visibilities"],data:function(){return{loading:!1,selectedFolder:"",filename:this.file.name,visibility:this.visibilities.length>0?this.visibilities[0].id:"",overwrite:!1,error:"",existingResourceButton:!1,existingResource:null}},components:{"select-folder":He,modal:re,"v-select":x.a},methods:{handleFolderChange:function(e){this.selectedFolder=e},upload:function(){var e=Object(d["a"])(regeneratorRuntime.mark((function e(){var t,a,i,s,n,o,l=this;return regeneratorRuntime.wrap((function(e){while(1)switch(e.prev=e.next){case 0:for(this.loading=!0,t=new FormData,t.append("file",this.file),t.append("filename",this.filename),t.append("folder",this.selectedFolder),t.append("overwrite",this.overwrite),t.append("visibility",this.visibility),t.append("hide_filename",this.config.hideFilename),a=0,i=Object.entries(this.config.uploadContext);a<i.length;a++)s=Object(M["a"])(i[a],2),n=s[0],o=s[1],t.append("upload_context[".concat(n,"]"),o);return e.next=11,Ye.a.post(this.config.paths.upload_resources,t).then((function(e){l.config.allowedTypes.length>0&&-1===l.config.allowedTypes.indexOf(e.data.type)?(l.error=l.config.translations.upload_error_unsupported_resource_type+l.config.allowedTypes.join(", "),l.loading=!1):l.$emit("uploaded",e.data)})).catch((function(e){409===e.response.status?(l.error=l.config.translations.upload_error_existing_resource,l.existingResourceButton=!0,l.existingResource=e.response.data,l.loading=!1):(l.error=e.response.data.detail?e.response.data.detail:"Error "+e.response.status+" - "+e.response.statusText,l.loading=!1)}));case 11:case"end":return e.stop()}}),e,this)})));function t(){return e.apply(this,arguments)}return t}()},watch:{visibilities:function(){this.visibility=this.visibilities.length>0?this.visibilities[0].id:""}}},Ze=Xe,et=(a("5af5"),Object(I["a"])(Ze,Ne,Be,!1,null,"2676fd5e",null)),tt=et.exports;function at(e,t){var a=Object.keys(e);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);t&&(i=i.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),a.push.apply(a,i)}return a}function it(e){for(var t=1;t<arguments.length;t++){var a=null!=arguments[t]?arguments[t]:{};t%2?at(a,!0).forEach((function(t){Object(f["a"])(e,t,a[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(a)):at(a).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(a,t))}))}return e}var st={name:"Interactions",props:["fieldId","config","selectedImage"],components:{preview:k,"media-modal":me,"crop-modal":De,"upload-modal":tt},computed:{isCroppable:function(){return!!this.selectedImage.id&&"image"===this.selectedImage.type&&Object.keys(this.config.availableVariations).length>0},stringifiedVariations:function(){return JSON.stringify(Me($e)(this.selectedImage.variations))}},data:function(){return{mediaModalOpen:!1,cropModalOpen:!1,uploadModalOpen:!1,types:[],folders:[],tags:[],visibilities:[],facetsLoading:!0,newFile:null}},methods:{dispatchVanillaChangeEvent:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"modal";this.$nextTick((function(){this.$el.dispatchEvent(new CustomEvent("ngrm-change",{detail:{inputFields:this.config.inputFields,selectedImage:this.selectedImage,fieldId:this.fieldId,changedField:e},bubbles:!0}))}))},prepareDomForModal:function(){var e=document.querySelector(".ez-page-builder-wrapper");e&&(e.style.transform="none")},resetDomAfterModal:function(){var e=document.querySelector(".ez-page-builder-wrapper");e&&e.removeAttribute("style")},handleMediaModalClose:function(){this.mediaModalOpen=!1,this.resetDomAfterModal(),this.dispatchVanillaChangeEvent()},handleCropModalClose:function(){this.cropModalOpen=!1,this.resetDomAfterModal(),this.dispatchVanillaChangeEvent()},handleUploadModalClose:function(){this.uploadModalOpen=!1,this.dispatchVanillaChangeEvent()},handleMediaSelected:function(e){this.selectedImage={id:e.remoteId,name:e.filename,type:e.type,format:e.format,url:e.url,previewUrl:e.previewUrl,browseUrl:e.browseUrl,alternateText:e.altText,caption:e.caption,watermarkText:this.selectedImage.watermarkText,tags:e.tags,size:e.size,variations:{},height:e.height,width:e.width,selectedVariation:null,cssClass:""},this.mediaModalOpen=!1,this.dispatchVanillaChangeEvent()},handleVariationCropChange:function(e){this.selectedImage=it({},this.selectedImage,{variations:it({},this.selectedImage.variations,{},e)}),this.dispatchVanillaChangeEvent()},handleResourceUploaded:function(e){this.selectedImage={id:e.remoteId,name:e.filename,type:e.type,format:e.format,url:e.url,previewUrl:e.previewUrl,browseUrl:e.browseUrl,alternateText:e.altText,caption:e.caption,watermarkText:this.selectedImage.watermarkText,tags:e.tags,size:e.size,variations:{},height:e.height,width:e.width,selectedVariation:null,cssClass:""},this.uploadModalOpen=!1,this.dispatchVanillaChangeEvent()},handleCropClicked:function(){this.cropModalOpen=!0,this.prepareDomForModal()},handleRemoveMediaClicked:function(){this.selectedImage={id:"",name:"",type:"image",format:"",url:"",previewUrl:"",browseUrl:"",alternateText:"",caption:"",watermarkText:this.selectedImage.watermarkText,tags:[],size:0,variations:{},height:0,width:0,selectedVariation:null,cssClass:""},this.config.disableUpload||(this.$refs.fileUploadInput.value=null),this.dispatchVanillaChangeEvent()},fetchFacets:function(){var e=Object(d["a"])(regeneratorRuntime.mark((function e(){var t,a,i=this;return regeneratorRuntime.wrap((function(e){while(1)switch(e.prev=e.next){case 0:return e.next=2,fetch(this.config.paths.load_facets);case 2:return t=e.sent,e.next=5,t.json();case 5:a=e.sent,this.types=[],this.tags=[],this.visibilities=[],a.types.forEach((function(e){-1===i.config.allowedTypes.indexOf(e.id)&&0!==i.config.allowedTypes.length||i.types.push(e)})),a.tags.forEach((function(e){-1===i.config.allowedTags.indexOf(e.id)&&0!==i.config.allowedTags.length||i.tags.push(e)})),a.visibilities.forEach((function(e){-1===i.config.allowedVisibilities.indexOf(e.id)&&0!==i.config.allowedVisibilities.length||i.visibilities.push(e)})),this.facetsLoading=!1;case 13:case"end":return e.stop()}}),e,this)})));function t(){return e.apply(this,arguments)}return t}(),handleBrowseMediaClicked:function(){var e=Object(d["a"])(regeneratorRuntime.mark((function e(){return regeneratorRuntime.wrap((function(e){while(1)switch(e.prev=e.next){case 0:this.mediaModalOpen=!0,this.prepareDomForModal(),this.fetchFacets();case 3:case"end":return e.stop()}}),e,this)})));function t(){return e.apply(this,arguments)}return t}(),handleFileInputChange:function(){this.fetchFacets(),this.uploadModalOpen=!0,this.newFile=this.$refs.fileUploadInput.files.item(0)}},watch:{selectedImage:function(){this.$emit("selectedImageChanged",this.selectedImage)}},mounted:function(){this.$nextTick((function(){var e=document.querySelector(".ngrm-model-portal-".concat(this.fieldId));document.body.prepend(e)}))}},nt=st,ot=Object(I["a"])(nt,r,c,!1,null,null,null),lt=ot.exports,rt={bind:function(e,t,a){var i=b(t.arg);a.context[i]=t.value}},ct=(a("b39d"),function(){var e=this,t=e.$createElement,a=e._self._c||t;return a("div",[a("input",{directives:[{name:"model",rawName:"v-model",value:e.selectedFolder,expression:"selectedFolder"}],attrs:{type:"hidden",name:e.config.inputFields.folder},domProps:{value:e.selectedFolder},on:{input:function(t){t.target.composing||(e.selectedFolder=t.target.value)}}}),e.selectedFolder?a("span",[a("i",{staticClass:"fa fa-folder"}),e._v(" "+e._s(this.selectedFolder))]):a("span",[a("i",[e._v(e._s(this.config.translations.select_folder_interaction_empty))])]),a("div",{staticClass:"ngremotemedia-buttons"},[e.selectedFolder?a("input",{attrs:{type:"button",value:"Remove folder"},on:{click:e.handleFolderRemove}}):e._e(),a("input",{attrs:{type:"button",value:this.config.translations.select_folder_interaction_button},on:{click:e.handleSelectFolderModalOpen}})]),e.selectFolderModalOpen?a("modal",{attrs:{title:"Select folder"},on:{close:e.handleSelectFolderModalClose}},[a("select-folder",{attrs:{config:e.config,"selected-folder":e.selectedFolder},on:{select:e.handleFolderSelect}})],1):e._e()],1)}),dt=[],ft={name:"SelectFolderInteraction",props:["config","selectedFolder"],components:{"select-folder":He,modal:re},data:function(){return{selectFolderModalOpen:!1}},methods:{handleSelectFolderModalOpen:function(){this.selectFolderModalOpen=!0},handleSelectFolderModalClose:function(){this.selectFolderModalOpen=!1},handleFolderSelect:function(e){this.selectedFolder=e,this.handleSelectFolderModalClose()},handleFolderRemove:function(){this.selectedFolder=null}}},ut=ft,pt=Object(I["a"])(ut,ct,dt,!1,null,null,null),ht=pt.exports;i["default"].config.productionTip=!1,i["default"].use(n.a),i["default"].use(l.a);var mt=function(e){window["ngrm_interactions_vue_".concat(e.dataset.id)]=new i["default"]({el:e,directives:{init:rt},data:{config:{mode:"field",paths:{browse_resources:"/resource/browse",upload_resources:"/resource/upload",load_facets:"/facets/load",load_folders:"/folder/load",create_folder:"/folder/create"},translations:{},inputFields:{locationId:"locationId",remoteId:"remoteId",type:"type",altText:"altText",caption:"caption",tags:"tags[]",cropSettings:"cropSettings",source:"source",watermarkText:"watermarkText",cssClass:"cssClass",selectedVariation:"selectedVariation"},availableVariations:[],allowedVisibilities:[],allowedTypes:[],allowedTags:[],parentFolder:null,folder:null,uploadContext:{},disableUpload:!1,hideFilename:!1},selectedImage:{id:"",name:"",type:"image",format:"",url:"",browse_url:"",previewUrl:"",alternateText:"",caption:"",watermarkText:"",tags:[],size:"",variations:{},height:0,width:0,selectedVariation:null,cssClass:""}},components:{interactions:lt}})},gt=function(e){window["ngrm_select_folder_vue_".concat(e.dataset.id)]=new i["default"]({el:e,directives:{init:rt},data:{config:{paths:{load_folders:"/folder/load",create_folder:"/folder/create"},translations:{},inputFields:{folder:"folder"}},selectedFolder:null},components:{"select-folder-interaction":ht}})},vt=function(){for(var e=document.getElementsByClassName("ngremotemedia-container"),t=0;t<e.length;t++){var a=e[t];null!==a.querySelector("interactions")&&mt(a)}for(var i=document.getElementsByClassName("ngremotemedia-select-folder-container"),s=0;s<i.length;s++){var n=i[s];null!==n.querySelector("select-folder-interaction")&&gt(n)}},bt=document.body?document.body:document,_t={attributes:!0,childList:!0,subtree:!0},wt=new MutationObserver(vt);"complete"===document.readyState||"loading"!==document.readyState&&document.documentElement.doScroll,wt.observe(bt,_t)},"5af5":function(e,t,a){"use strict";var i=a("2d36"),s=a.n(i);s.a},7397:function(e,t,a){"use strict";var i=a("bff8"),s=a.n(i);s.a},"85ab":function(e,t,a){"use strict";var i=a("1c87"),s=a.n(i);s.a},"8b09":function(e,t,a){},a301:function(e,t,a){"use strict";var i=a("fd05"),s=a.n(i);s.a},ab92:function(e,t,a){"use strict";var i=a("3601"),s=a.n(i);s.a},b39d:function(e,t){Array.prototype.difference||(Array.prototype.difference=function(e){return this.filter((function(t){return e.indexOf(t)<0}))})},bdd7:function(e,t,a){"use strict";var i=a("8b09"),s=a.n(i);s.a},bdf2:function(e,t,a){"use strict";var i=a("d0ba"),s=a.n(i);s.a},bff8:function(e,t,a){},c345:function(e,t,a){"use strict";var i=a("1994"),s=a.n(i);s.a},c66d:function(e,t,a){"use strict";var i=a("e7f6"),s=a.n(i);s.a},d0ba:function(e,t,a){},dca1:function(e,t,a){},e7f6:function(e,t,a){},fd05:function(e,t,a){}});
 //# sourceMappingURL=app.js.map
\ No newline at end of file
diff --git a/bundle/Resources/translations/ngremotemedia.en.yaml b/bundle/Resources/translations/ngremotemedia.en.yaml
index cc149778..59f644ca 100644
--- a/bundle/Resources/translations/ngremotemedia.en.yaml
+++ b/bundle/Resources/translations/ngremotemedia.en.yaml
@@ -39,6 +39,10 @@ ngrm:
                 tags_info: 'Tags are stored directly in Cloudinary on a resource so updating them here will also update them on all other locations which are using that same resource.'
                 watermark_text: 'Watermark text'
                 watermark_text_info: 'In order for the watermark to appear, you have to correctly configure a variation with watermark and use it on the frontend. This is only to provide content for the watermark.'
+                css_class: 'CSS class'
+                css_class_info: 'Custom CSS class for use in the rendered template, local to this field.'
+                selected_variation: 'Variation'
+                selected_variation_info: 'Variation to use for the image rendered in this field.'
                 size: 'Size'
             browse:
                 title: 'Select media'
diff --git a/bundle/Resources/views/app/view_resource.html.twig b/bundle/Resources/views/app/view_resource.html.twig
new file mode 100644
index 00000000..1e444b2b
--- /dev/null
+++ b/bundle/Resources/views/app/view_resource.html.twig
@@ -0,0 +1,15 @@
+{% if location and location.remoteResource %}
+    {% set classes = "ngremotemedia remote-media-inline remote-" ~ location.remoteResource.type %}
+    {% if css_class %}
+        {% set classes = classes ~ " " ~ css_class %}
+    {% endif %}
+    <div class="{{ classes }}">
+    {% if variation_name %}
+        {{ ngrm_remote_resource_variation_html_tag(location, variation_group, variation_name)|raw }}
+    {% else %}
+        {{ ngrm_remote_resource_html_tag(location.remoteResource)|raw }}
+    {% endif %}
+    </div>
+{% else %}
+    <div class="ngremotemedia-error">Invalid data</div>
+{% endif %}
diff --git a/frontend/copyFiles.js b/frontend/copyFiles.js
deleted file mode 100644
index 724429a2..00000000
--- a/frontend/copyFiles.js
+++ /dev/null
@@ -1,39 +0,0 @@
-const fs = require('fs');
-
-const mappings = [
-  {
-    source: 'dist/js/app.js',
-    targets: [
-      '../bundle/Resources/public/js/remotemedia.js'
-    ]
-  },
-  {
-    source: 'dist/js/chunk-vendors.js',
-    targets: [
-      '../bundle/Resources/public/js/remotemedia-vendors.js'
-    ]
-  },
-  {
-    source: 'dist/css/app.css',
-    targets: [
-      '../bundle/Resources/public/css/remotemedia.css'
-    ]
-  },
-  {
-    source: 'dist/css/chunk-vendors.css',
-    targets: [
-      '../bundle/Resources/public/css/remotemedia-vendors.css'
-    ]
-  }
-];
-
-const copyFile = source => destination => {
-  fs.copyFile(source, destination, err => {
-    if (err) throw err;
-    console.log(`${source} copied to ${destination}`);
-  });
-};
-
-mappings.forEach(map => {
-  map.targets.forEach(copyFile(map.source));
-});
diff --git a/frontend/copyFilesDev.js b/frontend/copyFilesDev.js
deleted file mode 100644
index c2eaf93e..00000000
--- a/frontend/copyFilesDev.js
+++ /dev/null
@@ -1,48 +0,0 @@
-const fs = require('fs');
-
-const mappings = [
-  {
-    source: 'dist/app.js',
-    targets: [
-      '../bundle/Resources/public/js/remotemedia.js'
-    ]
-  }
-];
-
-const fakeFiles = [
-  {
-    targets: [
-      '../bundle/Resources/public/js/remotemedia-vendors.js'
-    ]
-  },
-  {
-    targets: [
-      '../bundle/Resources/public/css/remotemedia.css'
-    ]
-  },
-  {
-    targets: [
-      '../bundle/Resources/public/css/remotemedia-vendors.css'
-    ]
-  },
-];
-
-const copyFile = source => destination => {
-  fs.copyFile(source, destination, err => {
-    if (err) throw err;
-    console.log(`${source} copied to ${destination}`);
-  });
-};
-
-const fakeFile = path => {
-  fs.closeSync(fs.openSync(path, 'w'))
-  console.log(`Faked ${path}`);
-}
-
-mappings.forEach(map => {
-  map.targets.forEach(copyFile(map.source));
-});
-
-fakeFiles.forEach(fakes => {
-  fakes.targets.forEach(fakeFile);
-})
diff --git a/frontend/package.json b/frontend/package.json
index 052d4f96..64ef43a6 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -7,8 +7,9 @@
   },
   "scripts": {
     "serve": "vue-cli-service serve",
-    "build": "vue-cli-service build && node copyFiles.js",
-    "dev": "vue-cli-service build --mode development && node copyFilesDev.js",
+    "build": "vue-cli-service build",
+    "dev": "vue-cli-service build --mode development",
+    "watch": "yarn dev --watch",
     "lint": "vue-cli-service lint"
   },
   "dependencies": {
diff --git a/frontend/src/components/Interactions.vue b/frontend/src/components/Interactions.vue
index 0aff4ab0..78f6c6c6 100644
--- a/frontend/src/components/Interactions.vue
+++ b/frontend/src/components/Interactions.vue
@@ -5,6 +5,7 @@
                 :config="config"
                 :field-id="fieldId"
                 :selected-image="selectedImage"
+                :is-croppable="isCroppable"
                 @preview-change="dispatchVanillaChangeEvent"
         ></preview>
 
@@ -95,7 +96,7 @@ export default {
     };
   },
   methods: {
-    dispatchVanillaChangeEvent() {
+    dispatchVanillaChangeEvent(inputField = 'modal') {
       this.$nextTick(function () {
         this.$el.dispatchEvent(
           new CustomEvent(
@@ -105,7 +106,9 @@ export default {
                 inputFields: this.config.inputFields,
                 selectedImage: this.selectedImage,
                 fieldId: this.fieldId,
-              }
+                changedField: inputField
+              },
+              bubbles: true,
             }
           )
         );
@@ -153,7 +156,9 @@ export default {
         size: item.size,
         variations: {},
         height: item.height,
-        width: item.width
+        width: item.width,
+        selectedVariation: null,
+        cssClass: '',
       };
 
       this.mediaModalOpen = false;
@@ -186,7 +191,9 @@ export default {
         size: item.size,
         variations: {},
         height: item.height,
-        width: item.width
+        width: item.width,
+        selectedVariation: null,
+        cssClass: '',
       };
 
       this.uploadModalOpen = false;
@@ -212,9 +219,13 @@ export default {
         size: 0,
         variations: {},
         height: 0,
-        width: 0
+        width: 0,
+        selectedVariation: null,
+        cssClass: '',
       };
-      this.$refs.fileUploadInput.value = null;
+      if (!this.config.disableUpload) {
+        this.$refs.fileUploadInput.value = null;
+      }
 
       this.dispatchVanillaChangeEvent();
     },
diff --git a/frontend/src/components/Modal.vue b/frontend/src/components/Modal.vue
index 2e235878..573d3559 100644
--- a/frontend/src/components/Modal.vue
+++ b/frontend/src/components/Modal.vue
@@ -95,7 +95,7 @@ export default {
   font-family: Arial, Helvetica, sans-serif;
 }
 
-.ngremotemedia-tags {
+.ngremotemedia-tags, .ngremotemedia-selected-variation {
   .vs__selected-options {
     input[type="search"].vs__search {
       border: none;
diff --git a/frontend/src/components/Preview.vue b/frontend/src/components/Preview.vue
index d911dfde..a1f19fc6 100644
--- a/frontend/src/components/Preview.vue
+++ b/frontend/src/components/Preview.vue
@@ -38,7 +38,7 @@
           <input type="text"
                :name="this.config.inputFields.altText"
                v-model="selectedImage.alternateText"
-               v-debounce:500ms="dispatchChangeEvent"
+               v-debounce:500ms="() => dispatchChangeEvent(this.config.inputFields.altText)"
                class="media-alttext data"
           >
         </div>
@@ -52,7 +52,7 @@
           <input type="text"
                :name="this.config.inputFields.caption"
                v-model="selectedImage.caption"
-               v-debounce:500ms="dispatchChangeEvent"
+               v-debounce:500ms="() => dispatchChangeEvent(this.config.inputFields.caption)"
                class="media-caption data"
           >
         </div>
@@ -77,10 +77,38 @@
           <input type="text"
                  :name="this.config.inputFields.watermarkText"
                  v-model="selectedImage.watermarkText"
-                 v-debounce:500ms="dispatchChangeEvent"
+                 v-debounce:500ms="() => dispatchChangeEvent(this.config.inputFields.watermarkText)"
                  class="media-watermarktext data"
           >
         </div>
+
+        <div v-if="this.isEmbed" class="ngremotemedia-css-class">
+          <span class="help-block description">
+            {{this.config.translations.preview_css_class}}
+            <i v-if="this.config.translations.preview_css_class_info" class="fa fa-info-circle" data-toggle="tooltip" data-placement="right" :title="this.config.translations.preview_css_class_info"></i>
+          </span>
+
+          <input type="text"
+                :name="this.config.inputFields.cssClass"
+                v-model="selectedImage.cssClass"
+                v-debounce:500ms="() => dispatchChangeEvent(this.config.inputFields.cssClass)"
+                class="media-css-class data"
+          >
+        </div>
+
+        <div v-if="this.isEmbed && this.hasVariations" class="ngremotemedia-selected-variation">
+          <input type="hidden" :name="this.config.inputFields.selectedVariation" :value="selectedImage.selectedVariation">
+          <span class="help-block description">
+              {{this.config.translations.preview_selected_variation}}
+              <i v-if="this.config.translations.preview_selected_variation_info" class="fa fa-info-circle" data-toggle="tooltip" data-placement="right" :title="this.config.translations.preview_selected_variation_info"></i>
+          </span>
+
+          <v-select
+            :options="this.variationOptions"
+            v-model="selectedImage.selectedVariation"
+            @input="() => dispatchChangeEvent(this.config.inputFields.selectedVariation)"
+          />
+        </div>
       </div>
     </div>
   </div>
@@ -112,14 +140,23 @@ export default {
     formattedSize() {
       return formatByteSize(this.selectedImage.size);
     },
+    isEmbed() {
+      return this.config.mode === 'embed';
+    },
+    hasVariations() {
+      return this.config.allVariations.length > 0;
+    },
+    variationOptions() {
+      return this.config.allVariations.map((variationKey) => ({ label: variationKey, value: variationKey }));
+    },
   },
   methods: {
     handleTagsInput(value) {
       this.allTags = [...new Set([...this.allTags, ...value])];
-      this.dispatchChangeEvent();
+      this.dispatchChangeEvent(this.config.inputFields.tags);
     },
-    dispatchChangeEvent() {
-      this.$emit('preview-change');
+    dispatchChangeEvent(inputField) {
+      this.$emit('preview-change', inputField);
     }
   },
   mounted() {
diff --git a/frontend/src/main.js b/frontend/src/main.js
index 3aafbfbf..b547cbb9 100644
--- a/frontend/src/main.js
+++ b/frontend/src/main.js
@@ -20,6 +20,7 @@ const initInteractionsVue = (el) => {
         },
         data: {
             config: {
+                mode: 'field', // field | embed
                 paths: {
                     browse_resources: '/resource/browse',
                     upload_resources: '/resource/upload',
@@ -38,6 +39,8 @@ const initInteractionsVue = (el) => {
                     'cropSettings': 'cropSettings',
                     'source': 'source',
                     'watermarkText': 'watermarkText',
+                    'cssClass': 'cssClass',
+                    'selectedVariation': 'selectedVariation',
                 },
                 availableVariations: [],
                 allowedVisibilities: [],
@@ -64,7 +67,9 @@ const initInteractionsVue = (el) => {
                 size: '',
                 variations: {},
                 height: 0,
-                width: 0
+                width: 0,
+                selectedVariation: null,
+                cssClass: '',        
             },
         },
         components: {
diff --git a/frontend/src/scss/ngremotemedia.scss b/frontend/src/scss/ngremotemedia.scss
index e62b05d5..04193443 100644
--- a/frontend/src/scss/ngremotemedia.scss
+++ b/frontend/src/scss/ngremotemedia.scss
@@ -85,6 +85,9 @@
   }
 }
 
+.ngremotemedia-container {
+  text-align: start;
+}
 
 .ngrm-model-portal .ngrm-overlay {
   .ng-icon {
@@ -140,7 +143,7 @@
       color: #737373;
     }
 
-    input.media-alttext, input.media-caption, input.media-watermarktext {
+    input.media-alttext, input.media-caption, input.media-watermarktext, input.media-css-class {
       width: 100%;
       border-radius: 0;
       border: 1px solid #e4e4e4;
diff --git a/frontend/vue.config.js b/frontend/vue.config.js
index 473305d5..9104bdab 100644
--- a/frontend/vue.config.js
+++ b/frontend/vue.config.js
@@ -1,9 +1,63 @@
+const fs = require('fs-extra');
+
+const isProd = process.env.NODE_ENV === 'production';
+
+const fakeDevFiles = [
+  '../bundle/Resources/public/js/remotemedia-vendors.js',
+  '../bundle/Resources/public/css/remotemedia.css',
+  '../bundle/Resources/public/css/remotemedia-vendors.css',
+];
+
+let moveFileMap = [];
+if (isProd) {
+  moveFileMap = [
+    {
+      source: 'dist/js/app.js',
+      target: '../bundle/Resources/public/js/remotemedia.js',
+    },
+    {
+      source: 'dist/js/chunk-vendors.js',
+      target: '../bundle/Resources/public/js/remotemedia-vendors.js',
+    },
+    {
+      source: 'dist/css/app.css',
+      target: '../bundle/Resources/public/css/remotemedia.css',
+    },
+    {
+      source: 'dist/css/chunk-vendors.css',
+      target: '../bundle/Resources/public/css/remotemedia-vendors.css',
+    },
+  ];
+} else {
+  moveFileMap = [
+    {
+      source: 'dist/app.js',
+      target: '../bundle/Resources/public/js/remotemedia.js',
+    },
+  ];
+}
+
 module.exports = {
   runtimeCompiler: true,
   filenameHashing: false,
   configureWebpack: {
     entry: {
       app: './src/main.js',
-    }
+    },
+    plugins: [{
+      apply: (compiler) => {
+        compiler.hooks.afterEmit.tap('AfterEmitPlugin', (compilation) => {
+          moveFileMap.forEach(({source, target}) => {
+            fs.copySync(source, target);
+          });
+
+          if (!isProd) {
+            fakeDevFiles.forEach((filePath) => {
+              fs.closeSync(fs.openSync(filePath, 'w'));
+            })
+          }
+        });
+      }
+    }],
   }
 };
diff --git a/lib/Form/DataTransformer/RemoteMediaTransformer.php b/lib/Form/DataTransformer/RemoteMediaTransformer.php
index edc6dd73..69a23173 100644
--- a/lib/Form/DataTransformer/RemoteMediaTransformer.php
+++ b/lib/Form/DataTransformer/RemoteMediaTransformer.php
@@ -5,20 +5,17 @@
 namespace Netgen\RemoteMedia\Form\DataTransformer;
 
 use Netgen\RemoteMedia\API\ProviderInterface;
-use Netgen\RemoteMedia\API\Values\CropSettings;
-use Netgen\RemoteMedia\API\Values\RemoteResource;
 use Netgen\RemoteMedia\API\Values\RemoteResourceLocation;
 use Netgen\RemoteMedia\Exception\RemoteResourceLocationNotFoundException;
 use Netgen\RemoteMedia\Exception\RemoteResourceNotFoundException;
+use Netgen\RemoteMedia\Service\RemoteResourceService;
 use Symfony\Component\Form\DataTransformerInterface;
 
-use function json_decode;
-use function json_encode;
-
 final class RemoteMediaTransformer implements DataTransformerInterface
 {
     public function __construct(
-        private ProviderInterface $provider
+        private ProviderInterface $provider,
+        private RemoteResourceService $service,
     ) {}
 
     public function transform($value)
@@ -34,7 +31,7 @@ public function transform($value)
             'altText' => $value->getRemoteResource()->getAltText(),
             'caption' => $value->getRemoteResource()->getCaption(),
             'tags' => $value->getRemoteResource()->getTags(),
-            'cropSettings' => $this->resolveCropSettingsString($value),
+            'cropSettings' => $this->service->resolveCropSettingsString($value),
             'source' => $value->getSource(),
             'watermarkText' => $value->getWatermarkText(),
         ];
@@ -68,7 +65,7 @@ public function reverseTransform($value)
             $remoteResourceLocation = new RemoteResourceLocation($remoteResource);
         }
 
-        $needsUpdateOnRemote = $this->needsUpdateOnRemote($remoteResource, $value);
+        $needsUpdateOnRemote = $this->service->needsUpdateOnRemote($remoteResource, $value);
 
         $remoteResource->setAltText($value['altText'] ?? null);
         $remoteResource->setCaption($value['caption'] ?? null);
@@ -88,62 +85,9 @@ public function reverseTransform($value)
         $remoteResourceLocation->setWatermarkText($value['watermarkText'] ?? null);
 
         $remoteResourceLocation->setCropSettings(
-            $this->resolveCropSettings($value),
+            $this->service->resolveCropSettings($value['cropSettings']),
         );
 
         return $remoteResourceLocation;
     }
-
-    private function resolveCropSettingsString(RemoteResourceLocation $location): string
-    {
-        $cropSettings = [];
-        foreach ($location->getCropSettings() as $cropSetting) {
-            $cropSettings[$cropSetting->getVariationName()] = [
-                'x' => $cropSetting->getX(),
-                'y' => $cropSetting->getY(),
-                'w' => $cropSetting->getWidth(),
-                'h' => $cropSetting->getHeight(),
-            ];
-        }
-
-        return json_encode($cropSettings);
-    }
-
-    /**
-     * @return \Netgen\RemoteMedia\API\Values\CropSettings[]
-     */
-    private function resolveCropSettings(array $data): array
-    {
-        $cropSettingsString = $data['cropSettings'] ?? null;
-
-        if (!$cropSettingsString) {
-            return [];
-        }
-
-        $cropSettingsArray = json_decode($cropSettingsString, true);
-
-        $cropSettings = [];
-        foreach ($cropSettingsArray as $variationName => $variationCropSettings) {
-            $cropSettings[] = CropSettings::fromArray($variationName, $variationCropSettings);
-        }
-
-        return $cropSettings;
-    }
-
-    private function needsUpdateOnRemote(RemoteResource $remoteResource, array $data): bool
-    {
-        if ($remoteResource->getAltText() !== ($data['altText'] ?? null)) {
-            return true;
-        }
-
-        if ($remoteResource->getCaption() !== ($data['caption'] ?? null)) {
-            return true;
-        }
-
-        if ($remoteResource->getTags() !== ($data['tags'] ?? [])) {
-            return true;
-        }
-
-        return false;
-    }
 }
diff --git a/lib/Service/RemoteResourceService.php b/lib/Service/RemoteResourceService.php
new file mode 100644
index 00000000..7862434d
--- /dev/null
+++ b/lib/Service/RemoteResourceService.php
@@ -0,0 +1,114 @@
+<?php
+
+declare(strict_types=1);
+
+namespace Netgen\RemoteMedia\Service;
+
+use Netgen\RemoteMedia\API\ProviderInterface;
+use Netgen\RemoteMedia\API\Values\CropSettings;
+use Netgen\RemoteMedia\API\Values\RemoteResource;
+use Netgen\RemoteMedia\API\Values\RemoteResourceLocation;
+use Netgen\RemoteMedia\Exception\RemoteResourceNotFoundException;
+
+use function json_decode;
+use function json_encode;
+
+final class RemoteResourceService
+{
+    public function __construct(
+        private ProviderInterface $provider,
+    ) {}
+
+    public function handleLocationUpdate(RemoteResourceLocation $remoteResourceLocation, array $data, bool $persist = false): void
+    {
+        $remoteResourceLocation->setSource($data['source'] ?? null);
+        $remoteResourceLocation->setWatermarkText($data['watermarkText'] ?? null);
+        $remoteResourceLocation->setCropSettings(
+            $this->resolveCropSettings($data['cropSettings'] ?? null),
+        );
+
+        if ($persist) {
+            $this->provider->storeLocation($remoteResourceLocation);
+        }
+    }
+
+    public function handleRemoteUpdate(RemoteResource $remoteResource, array $data, bool $persist = false): bool
+    {
+        if (!$this->needsUpdateOnRemote($remoteResource, $data)) {
+            return true;
+        }
+
+        $remoteResource->setAltText($data['altText'] ?? null);
+        $remoteResource->setCaption($data['caption'] ?? null);
+        $remoteResource->setTags($data['tags']);
+
+        try {
+            $this->provider->updateOnRemote($remoteResource);
+            if ($persist) {
+                $this->provider->store($remoteResource);
+            }
+        } catch (RemoteResourceNotFoundException $e) {
+            $this->provider->remove($remoteResource);
+
+            return false;
+        }
+
+        return true;
+    }
+
+    public function needsUpdateOnRemote(RemoteResource $remoteResource, array $data): bool
+    {
+        if ($remoteResource->getAltText() !== ($data['altText'] ?? null)) {
+            return true;
+        }
+
+        if ($remoteResource->getCaption() !== ($data['caption'] ?? null)) {
+            return true;
+        }
+
+        if ($remoteResource->getTags() !== ($data['tags'] ?? [])) {
+            return true;
+        }
+
+        return false;
+    }
+
+    /**
+     * @return \Netgen\RemoteMedia\API\Values\CropSettings[]
+     */
+    public function resolveCropSettings(?string $cropSettingsString): array
+    {
+        if (!$cropSettingsString) {
+            return [];
+        }
+
+        $cropSettingsArray = json_decode($cropSettingsString, true);
+
+        $cropSettings = [];
+        foreach ($cropSettingsArray as $variationName => $variationCropSettings) {
+            $cropSettings[] = CropSettings::fromArray($variationName, $variationCropSettings);
+        }
+
+        return $cropSettings;
+    }
+
+    public function resolveCropSettingsString(RemoteResourceLocation $location): string
+    {
+        return json_encode($this->resolveCropSettingsJson($location));
+    }
+
+    public function resolveCropSettingsJson(RemoteResourceLocation $location): array
+    {
+        $cropSettings = [];
+        foreach ($location->getCropSettings() as $cropSetting) {
+            $cropSettings[$cropSetting->getVariationName()] = [
+                'x' => $cropSetting->getX(),
+                'y' => $cropSetting->getY(),
+                'w' => $cropSetting->getWidth(),
+                'h' => $cropSetting->getHeight(),
+            ];
+        }
+
+        return $cropSettings;
+    }
+}