diff --git a/modules/backend/behaviors/RelationController.php b/modules/backend/behaviors/RelationController.php
index 609839fe50..15c3fdb315 100644
--- a/modules/backend/behaviors/RelationController.php
+++ b/modules/backend/behaviors/RelationController.php
@@ -673,12 +673,18 @@ protected function makeViewWidget()
             $config->recordUrl = $this->getConfig('view[recordUrl]');
             $config->customViewPath = $this->getConfig('view[customViewPath]');
             $config->noRecordsMessage = $this->getConfig('view[noRecordsMessage]');
+            $config->size = $this->getConfig('manage[size]');
+            $config->cssClass = $this->getConfig('manage[cssClass]');
+            $config->allowDismiss = $this->getConfig('manage[allowDismiss]');
 
             $defaultOnClick = sprintf(
-                "$.wn.relationBehavior.clickViewListRecord(':%s', '%s', '%s')",
+                "$.wn.relationBehavior.clickViewListRecord(':%s', '%s', '%s', '%s', '%s', '%s')",
                 $this->relationModel->getKeyName(),
                 $this->relationGetId(),
-                $this->relationGetSessionKey()
+                $this->relationGetSessionKey(),
+                $config->size,
+                $config->cssClass,
+                $config->allowDismiss
             );
 
             if ($config->recordUrl) {
diff --git a/modules/backend/behaviors/relationcontroller/assets/js/winter.relation.js b/modules/backend/behaviors/relationcontroller/assets/js/winter.relation.js
index 5af54ebeed..a2c9e076c4 100644
--- a/modules/backend/behaviors/relationcontroller/assets/js/winter.relation.js
+++ b/modules/backend/behaviors/relationcontroller/assets/js/winter.relation.js
@@ -9,14 +9,20 @@
             $(el).closest('.control-list').listWidget('toggleChecked', [el])
         }
 
-        this.clickViewListRecord = function(recordId, relationId, sessionKey) {
+        this.clickViewListRecord = function(recordId, relationId, sessionKey, size, cssClass, allowDismiss) {
             var newPopup = $('<a />'),
                 $container = $('#'+relationId),
                 requestData = paramToObj('data-request-data', $container.data('request-data'))
 
+            if (!size) {
+                size = 'huge'
+            }
+
             newPopup.popup({
                 handler: 'onRelationClickViewList',
-                size: 'huge',
+                size: size,
+                cssClass: cssClass,
+                allowDismiss: allowDismiss,
                 extraData: $.extend({}, requestData, {
                     'manage_id': recordId,
                     '_session_key': sessionKey
diff --git a/modules/system/assets/ui/js/popup.js b/modules/system/assets/ui/js/popup.js
index c6b6b0ac0a..7f0bce777f 100644
--- a/modules/system/assets/ui/js/popup.js
+++ b/modules/system/assets/ui/js/popup.js
@@ -49,7 +49,9 @@
         content: null,
         size: null,
         adaptiveHeight: false,
-        zIndex: null
+        zIndex: null,
+        cssClass: null,
+        allowDismiss: false
     }
 
     Popup.prototype.init = function(){
@@ -207,8 +209,22 @@
         if (this.options.adaptiveHeight)
             modalDialog.addClass('adaptive-height')
 
+        if (this.options.cssClass)
+            modalDialog.addClass(this.options.cssClass)
+
         if (this.options.zIndex !== null)
             modal.css('z-index', this.options.zIndex + 20)
+        
+        if (this.options.allowDismiss) {
+            modal.on('mousedown', function(e) {
+                const target = e.target;
+                if (target.classList.contains('control-popup')) {
+                    modal.hide()
+                    $('.popup-backdrop').remove()
+                    $(document.body).removeClass('modal-open')
+                }
+            });
+        }
 
         return modal.append(modalDialog.append(modalContent))
     }
diff --git a/modules/system/assets/ui/storm-min.js b/modules/system/assets/ui/storm-min.js
index ba66b4d5f4..a7f4373e60 100644
--- a/modules/system/assets/ui/storm-min.js
+++ b/modules/system/assets/ui/storm-min.js
@@ -1954,7 +1954,8 @@ var selectOptions={templateResult:formatSelectOption,templateSelection:formatSel
 $('select.custom-select').each(function(){var $element=$(this),extraOptions={dropdownCssClass:'',containerCssClass:''}
 if($element.data('select2')!=null){return true;}$element.attr('data-disposable','data-disposable')
 $element.one('dispose-control',function(){if($element.data('select2')){$element.select2('destroy')}})
-if($element.hasClass('select-no-search')){extraOptions.minimumResultsForSearch=Infinity}if($element.hasClass('select-no-dropdown')){extraOptions.dropdownCssClass+=' select-no-dropdown'
+if($element.hasClass('select-no-search')){extraOptions.minimumResultsForSearch=Infinity}if($element.hasClass('select-modifiable')){extraOptions.tags=true;extraOptions.createTag=function(params){var term=$.trim(params.term);if(term===''){return null;}return{id:term,text:term,newTag:true};}
+extraOptions.templateResult=function(state){if(!state.id){return state.text;}var icon=state.newTag?'<i class="icon-plus"></i> ':'';return $('<span>'+icon+state.text+'</span>');}}if($element.hasClass('select-no-dropdown')){extraOptions.dropdownCssClass+=' select-no-dropdown'
 extraOptions.containerCssClass+=' select-no-dropdown'}if($element.hasClass('select-hide-selected')){extraOptions.dropdownCssClass+=' select-hide-selected'}var source=$element.data('handler');if(source){extraOptions.ajax={transport:function(params,success,failure){var $request=$element.request(source,{data:params.data})
 $request.done(success)
 $request.fail(failure)
@@ -2153,7 +2154,7 @@ this.initEvents()
 this.init()}
 Popup.prototype=Object.create(BaseProto)
 Popup.prototype.constructor=Popup
-Popup.DEFAULTS={ajax:null,handler:null,keyboard:true,extraData:{},content:null,size:null,adaptiveHeight:false,zIndex:null}
+Popup.DEFAULTS={ajax:null,handler:null,keyboard:true,extraData:{},content:null,size:null,adaptiveHeight:false,zIndex:null,cssClass:null,allowDismiss:false}
 Popup.prototype.init=function(){var self=this
 if(self.isOpen)return
 this.setBackdrop(true)
@@ -2197,8 +2198,11 @@ BaseProto.dispose.call(this)}
 Popup.prototype.createPopupContainer=function(){var modal=$('<div />').prop({class:'control-popup modal fade',role:'dialog',tabindex:-1}),modalDialog=$('<div />').addClass('modal-dialog'),modalContent=$('<div />').addClass('modal-content')
 if(this.options.size)modalDialog.addClass('size-'+this.options.size)
 if(this.options.adaptiveHeight)modalDialog.addClass('adaptive-height')
+if(this.options.cssClass)modalDialog.addClass(this.options.cssClass)
 if(this.options.zIndex!==null)modal.css('z-index',this.options.zIndex+20)
-return modal.append(modalDialog.append(modalContent))}
+if(this.options.allowDismiss){modal.on('mousedown',function(e){const target=e.target;if(target.classList.contains('control-popup')){modal.hide()
+$('.popup-backdrop').remove()
+$(document.body).removeClass('modal-open')}});}return modal.append(modalDialog.append(modalContent))}
 Popup.prototype.setContent=function(contents){this.$content.html(contents)
 this.setLoading(false)
 this.show()
@@ -4777,4 +4781,4 @@ data[option].apply(data,methodArguments)}}})}
 $.fn.listSortable.Constructor=ListSortable
 $.fn.listSortable.noConflict=function(){$.fn.listSortable=old
 return this}
-$(document).render(function(){$('[data-control=list-sortable]').listSortable()})}(window.jQuery);
\ No newline at end of file
+$(document).render(function(){$('[data-control=list-sortable]').listSortable()})}(window.jQuery);