pageflow 17.0.5 → 17.1.0

data/package/editor.js

@@ -1,6 +1,6 @@
 import Backbone from 'backbone';
 import _ from 'underscore';
-import { Object as Object$1, TabsView, ConfigurationEditorView, CollectionView, tooltipContainer, SelectInputView, inputView, TextInputView, TextAreaInputView, CheckBoxGroupInputView, i18nUtils, ConfigurationEditorTabView, SeparatorView, UrlDisplayView, TableView, TextTableCellView, PresenceTableCellView, SortableCollectionView, attributeBinding, DeleteRowTableCellView, CheckBoxInputView, SliderInputView, IconTableCellView } from 'pageflow/ui';
+import { Object as Object$1, ConfigurationEditorView, CollectionView, tooltipContainer, SelectInputView, TabsView, inputView, TextInputView, TextAreaInputView, CheckBoxGroupInputView, i18nUtils, ConfigurationEditorTabView, FileNameInputView, SeparatorView, UrlDisplayView, TableView, TextTableCellView, PresenceTableCellView, SortableCollectionView, attributeBinding, DeleteRowTableCellView, CheckBoxInputView, SliderInputView, IconTableCellView } from 'pageflow/ui';
 export * from 'pageflow/ui';
 import Cocktail from 'cocktail';
 import I18n$1 from 'i18n-js';
@@ -11,13 +11,11 @@ import 'jquery-ui';
 
 (function () {
   var sync = Backbone.sync;
-
   Backbone.sync = function (method, model, options) {
     if (model.paramRoot && !options.attrs) {
       options.attrs = options.queryParams || {};
       options.attrs[model.paramRoot] = model.toJSON(options);
     }
-
     return sync(method, model, options);
   };
 })();
@@ -84,7 +82,6 @@ var CommonPageConfigurationTabs = Object$1.extend({
         configureFn.call(prefixInputDecorator(name, this));
       });
     });
-
     function prefixInputDecorator(name, dsl) {
       return {
         input: function input(propertyName, view, options) {
@@ -95,6 +92,20 @@ var CommonPageConfigurationTabs = Object$1.extend({
   }
 });
 
+var DropDownMenuItems = Object$1.extend({
+  initialize: function initialize() {
+    this.menuItems = {};
+  },
+  register: function register(menuItem, _ref) {
+    var menuName = _ref.menuName;
+    this.menuItems[menuName] = this.menuItems[menuName] || [];
+    this.menuItems[menuName].push(menuItem);
+  },
+  findAllByMenuName: function findAllByMenuName(menuName) {
+    return this.menuItems[menuName] || [];
+  }
+});
+
 /**
  * Failure and subclasses are used in the failures api.
  *
@@ -104,7 +115,6 @@ var CommonPageConfigurationTabs = Object$1.extend({
  *
  * @class
  */
-
 var Failure = Object$1.extend({
   canRetry: true,
   type: 'Failure',
@@ -151,15 +161,11 @@ var OrderingFailure = Failure.extend({
  *
  * @alias Failures
  */
-
-var FailuresAPI = Object$1.extend(
-/** @lends Failures.prototype */
-{
+var FailuresAPI = Object$1.extend( /** @lends Failures.prototype */{
   initialize: function initialize() {
     this.failures = {};
     this.length = 0;
   },
-
   /**
    * Listen to the `error` and `sync` events of a collection and
    * create failure objects.
@@ -181,7 +187,6 @@ var FailuresAPI = Object$1.extend(
   isEmpty: function isEmpty() {
     return _.size(this.failures) === 0;
   },
-
   /**
    * Record that a failure occured.
    *
@@ -200,14 +205,12 @@ var FailuresAPI = Object$1.extend(
     return this.length;
   }
 });
-
 _.extend(FailuresAPI.prototype, Backbone.Events);
 
 var UploadError = Object$1.extend({
   setMessage: function setMessage(options) {
     this.upload = options.upload;
     var typeTranslation;
-
     if (options.typeTranslation) {
       typeTranslation = options.typeTranslation;
     } else if (this.upload.type !== '') {
@@ -215,7 +218,6 @@ var UploadError = Object$1.extend({
     } else {
       typeTranslation = I18n$1.t('pageflow.editor.errors.upload.type_empty');
     }
-
     var interpolations = {
       name: this.upload.name,
       type: typeTranslation,
@@ -287,26 +289,21 @@ var FileTypesCollection = Object$1.extend({
     var result = this.find(function (fileType) {
       return fileType.matchUpload(upload);
     });
-
     if (!result) {
       throw new UnmatchedUploadError(upload);
     }
-
     return result;
   },
   findByCollectionName: function findByCollectionName(collectionName) {
     var result = this.find(function (fileType) {
       return fileType.collectionName === collectionName;
     });
-
     if (!result) {
       throw 'Could not find file type by collection name "' + collectionName + '"';
     }
-
     return result;
   }
 });
-
 _.each(['each', 'map', 'reduce', 'first', 'find', 'contains', 'filter'], function (method) {
   FileTypesCollection.prototype[method] = function () {
     var args = Array.prototype.slice.call(arguments);
@@ -315,142 +312,6 @@ _.each(['each', 'map', 'reduce', 'first', 'find', 'contains', 'filter'], functio
   };
 });
 
-var app = new Marionette.Application();
-
-var dialogView = {
-  events: {
-    'click .close': function clickClose() {
-      this.close();
-    },
-    'click .box': function clickBox() {
-      return false;
-    },
-    'click': function click() {
-      this.close();
-    }
-  }
-};
-
-function template(data) {
-var __t, __p = '';
-__p += '<div class="box">\n  <div class="content">\n    <h1 class="dialog-header"></h1>\n  </div>\n\n  <div class="footer">\n    <a href="" class="close">\n      ' +
-((__t = ( I18n.t('pageflow.editor.templates.file_settings_dialog.close') )) == null ? '' : __t) +
-'\n    </a>\n  </div>\n</div>\n';
-return __p
-}
-
-var FileSettingsDialogView = Marionette.ItemView.extend({
-  template: template,
-  className: 'file_settings_dialog editor dialog',
-  mixins: [dialogView],
-  ui: {
-    content: '.content',
-    header: '.dialog-header'
-  },
-  onRender: function onRender() {
-    this.ui.header.text(this.model.title());
-    this.tabsView = new TabsView({
-      model: this.model,
-      i18n: 'pageflow.editor.files.settings_dialog_tabs',
-      defaultTab: this.options.tabName
-    });
-
-    _.each(this.model.fileType().settingsDialogTabs, function (options) {
-      this.tabsView.tab(options.name, _.bind(function () {
-        return this.subview(new options.view(_.extend({
-          model: this.model
-        }, options.viewOptions)));
-      }, this));
-    }, this);
-
-    this.ui.content.append(this.subview(this.tabsView).el);
-  }
-});
-
-FileSettingsDialogView.open = function (options) {
-  app.dialogRegion.show(new FileSettingsDialogView(options));
-};
-
-function template$1(data) {
-var __t, __p = '';
-__p += '<span class="value"></span>\n<a class="edit" href="" title="' +
-((__t = ( I18n.t('pageflow.editor.templates.file_meta_data_item_value_view.edit') )) == null ? '' : __t) +
-'">\n</a>\n\n';
-return __p
-}
-
-/**
- * Base class for views used as `valueView` for file type meta data
- * attributes.
- *
- * @param {Object} [options]
- *
- * @param {string} [options.name]
- *   Name of the meta data item used in translation keys.
- *
- * @param {string} [options.settingsDialogTabLink]
- *   Dispaly a link to open the specified tab of the file settings
- *   dialog.
- *
- * @since 12.0
- *
- * @class
- */
-
-var FileMetaDataItemValueView = Marionette.ItemView.extend({
-  template: template$1,
-  className: 'value_wrapper',
-  ui: {
-    value: '.value',
-    editLink: '.edit'
-  },
-  events: {
-    'click .edit': function clickEdit() {
-      FileSettingsDialogView.open({
-        model: this.model,
-        tabName: this.options.settingsDialogTabLink
-      });
-    }
-  },
-  modelEvents: {
-    'change': 'toggleEditLink'
-  },
-  onRender: function onRender() {
-    this.listenTo(this.model, 'change:' + this.options.name, this.update);
-    this.toggleEditLink();
-    this.update();
-  },
-  update: function update() {
-    this.ui.value.text(this.getText() || I18n$1.t('pageflow.editor.views.file_meta_data_item_value_view.blank'));
-  },
-  getText: function getText() {
-    throw new Error('Not implemented');
-  },
-  toggleEditLink: function toggleEditLink() {
-    this.ui.editLink.toggle(!!this.options.settingsDialogTabLink && !this.model.isNew());
-  }
-});
-
-var TextFileMetaDataItemValueView = FileMetaDataItemValueView.extend({
-  getText: function getText() {
-    var model;
-
-    if (this.options.fromConfiguration) {
-      model = this.model.configuration;
-    } else {
-      model = this.model;
-    }
-
-    var value = model.get(this.options.name);
-
-    if (value && this.options.formatValue) {
-      return this.options.formatValue(value);
-    }
-
-    return value;
-  }
-});
-
 var FileType = Object$1.extend({
   initialize: function initialize(options) {
     this.model = options.model;
@@ -470,7 +331,6 @@ var FileType = Object$1.extend({
     this.filters = options.filters || [];
     this.noExtendedFileRights = options.noExtendedFileRights;
     this.metaDataAttributes = options.metaDataAttributes || [];
-
     if (typeof options.matchUpload === 'function') {
       this.matchUpload = options.matchUpload;
     } else if (options.matchUpload instanceof RegExp) {
@@ -480,7 +340,6 @@ var FileType = Object$1.extend({
     } else {
       throw 'matchUpload option of FileType "' + this.collectionName + '" must either be a function or a RegExp.';
     }
-
     this.setupModelNaming();
   },
   setupModelNaming: function setupModelNaming() {
@@ -495,11 +354,9 @@ var FileType = Object$1.extend({
     var result = _(this.filters).find(function (filter) {
       return filter.name === name;
     });
-
     if (!result) {
       throw new Error('Unknown filter "' + name + '" for file type "' + this.collectionName + '".');
     }
-
     return result;
   }
 });
@@ -516,44 +373,34 @@ var FileTypes = Object$1.extend({
     if (this._setup) {
       throw 'File types already set up. Register file types before initializers run.';
     }
-
     this.clientSideConfigs[name] = config;
   },
   modify: function modify(name, config) {
     if (this._setup) {
       throw 'File types already set up. Modify file types before initializers run.';
     }
-
     this.clientSideConfigModifications[name] = this.clientSideConfigModifications[name] || [];
     this.clientSideConfigModifications[name].push(config);
   },
   setup: function setup(serverSideConfigs) {
     var _this = this;
-
     var clientSideConfigs = this.clientSideConfigs;
     this._setup = true;
-
     var configs = _.chain(serverSideConfigs).map(function (serverSideConfig) {
       var clientSideConfig = clientSideConfigs[serverSideConfig.collectionName];
-
       if (!clientSideConfig) {
         throw 'Missing client side config for file type "' + serverSideConfig.collectionName + '"';
       }
-
       _this.applyCommonConfig(clientSideConfig);
-
       _this.applyModifications(serverSideConfig, clientSideConfig);
-
       return _.extend({}, serverSideConfig, clientSideConfig);
     }).sortBy(function (config) {
       return config.priority || 10;
     }).value();
-
     this.collection = new FileTypesCollection(_.map(configs, function (config) {
       return new FileType(config);
     }));
     var those = this;
-
     _.map(serverSideConfigs, function (serverSideConfig) {
       var fileType = those.findByCollectionName(serverSideConfig.collectionName);
       fileType.setNestedFileTypes(new FileTypesCollection(_.map(serverSideConfig.nestedFileTypes, function (nestedFileType) {
@@ -573,7 +420,6 @@ var FileTypes = Object$1.extend({
   },
   lintModification: function lintModification(modification, collectionName) {
     var unmodifyableProperties = _.difference(_.keys(modification), this.modifyableProperties);
-
     if (unmodifyableProperties.length) {
       throw 'Only the following properties are allowed in FileTypes#modify: ' + this.modifyableProperties.join(', ') + '. Given in modification for ' + collectionName + ': ' + unmodifyableProperties.join(', ') + '.';
     }
@@ -584,13 +430,11 @@ var FileTypes = Object$1.extend({
     });
   }
 });
-
 _.each(['each', 'map', 'reduce', 'first', 'find', 'findByUpload', 'findByCollectionName', 'contains', 'filter'], function (method) {
   FileTypes.prototype[method] = function () {
     if (!this._setup) {
       throw 'File types are not yet set up.';
     }
-
     return this.collection[method].apply(this.collection, arguments);
   };
 });
@@ -603,7 +447,6 @@ var FileImporters = Object$1.extend({
     if (this._setup) {
       throw 'File importers setup is already finished. Register file importers before setup is finished';
     }
-
     this.importers[name] = config;
     config.key = name;
   },
@@ -624,7 +467,6 @@ var FileImporters = Object$1.extend({
     if (!this.importers[name]) {
       throw 'Could not find file importer with name "' + name + '"';
     }
-
     return this.importers[name];
   },
   keys: function keys() {
@@ -694,7 +536,6 @@ var PageTypes = Object$1.extend({
     if (this._setup) {
       throw 'Page types already set up. Register page types before initializers run.';
     }
-
     this.clientSideConfigs[name] = config;
   },
   setup: function setup(serverSideConfigs) {
@@ -709,38 +550,33 @@ var PageTypes = Object$1.extend({
     var result = this.find(function (pageType) {
       return pageType.name === name;
     });
-
     if (!result) {
       throw 'Could not find page type with name "' + name + '"';
     }
-
     return result;
   },
   findByPage: function findByPage(page) {
     return this.findByName(page.get('template'));
   }
 });
-
 _.each(['each', 'map', 'reduce', 'first', 'find', 'pluck'], function (method) {
   PageTypes.prototype[method] = function () {
     if (!this._setup) {
       throw 'Page types are not yet set up.';
     }
-
     var args = Array.prototype.slice.call(arguments);
     args.unshift(this.pageTypes);
     return _[method].apply(_, args);
   };
 });
 
+// A partial implementation of a collection that can store records of
 // different model types.  Backbone.Collection tries to merge records
 // if they have the same id.
-
 var MultiCollection = function MultiCollection() {
   this.records = {};
   this.length = 0;
 };
-
 _.extend(MultiCollection.prototype, {
   add: function add(record) {
     if (!this.records[record.cid]) {
@@ -760,9 +596,7 @@ _.extend(MultiCollection.prototype, {
     return this.length === 0;
   }
 });
-
 _.extend(MultiCollection.prototype, Backbone.Events);
-
 MultiCollection.extend = Backbone.Collection.extend;
 
 /**
@@ -770,7 +604,6 @@ MultiCollection.extend = Backbone.Collection.extend;
  * being saved. Used to update the notifications view displaying
  * saving status/failutes.
  */
-
 var SavingRecordsCollection = MultiCollection.extend({
   /**
    * Listen to events of models in collection to track when they are
@@ -793,7 +626,9 @@ var WidgetType = Object$1.extend({
   initialize: function initialize(serverSideConfig, clientSideConfig) {
     this.name = serverSideConfig.name;
     this.translationKey = serverSideConfig.translationKey;
+    this.insertPoint = serverSideConfig.insertPoint;
     this.configurationEditorView = clientSideConfig.configurationEditorView;
+    this.configurationEditorTabViewGroups = clientSideConfig.configurationEditorTabViewGroups || {};
     this.isOptional = clientSideConfig.isOptional;
   },
   hasConfiguration: function hasConfiguration() {
@@ -804,6 +639,16 @@ var WidgetType = Object$1.extend({
     return new constructor(_.extend({
       attributeTranslationKeyPrefixes: ['pageflow.editor.widgets.attributes.' + this.name, 'pageflow.editor.widgets.common_attributes']
     }, options));
+  },
+  defineStubConfigurationEditorTabViewGroups: function defineStubConfigurationEditorTabViewGroups(groups) {
+    _.each(this.configurationEditorTabViewGroups, function (fn, name) {
+      return groups.define(name, function () {});
+    });
+  },
+  defineConfigurationEditorTabViewGroups: function defineConfigurationEditorTabViewGroups(groups) {
+    _.each(this.configurationEditorTabViewGroups, function (fn, name) {
+      return groups.define(name, fn);
+    });
   }
 });
 
@@ -816,15 +661,12 @@ var WidgetTypes = Object$1.extend({
     if (this._setup) {
       throw 'Widget types already set up. Register widget types before initializers run.';
     }
-
     this._clientSideConfigs[name] = config;
   },
   setup: function setup(serverSideConfigsByRole) {
     this._setup = true;
     this._widgetTypesByName = {};
-
     var roles = _.keys(serverSideConfigsByRole);
-
     this._widgetTypesByRole = roles.reduce(_.bind(function (result, role) {
       result[role] = serverSideConfigsByRole[role].map(_.bind(function (serverSideConfig) {
         var clientSideConfig = this._clientSideConfigs[serverSideConfig.name] || {};
@@ -842,7 +684,6 @@ var WidgetTypes = Object$1.extend({
     if (!this._widgetTypesByName[name]) {
       throw 'Could not find widget type with name "' + name + '"';
     }
-
     return this._widgetTypesByName[name];
   },
   registerRole: function registerRole(role, options) {
@@ -850,19 +691,23 @@ var WidgetTypes = Object$1.extend({
   },
   isOptional: function isOptional(role) {
     return !!this._optionalRoles[role];
+  },
+  defineStubConfigurationEditorTabViewGroups: function defineStubConfigurationEditorTabViewGroups(groups) {
+    _.each(this._widgetTypesByName, function (widgetType) {
+      return widgetType.defineStubConfigurationEditorTabViewGroups(groups);
+    });
   }
 });
 
+var app = new Marionette.Application();
+
 var state = window.pageflow || {};
 
 /**
  * Interface for engines providing editor extensions.
  * @alias editor
  */
-
-var EditorApi = Object$1.extend(
-/** @lends editor */
-{
+var EditorApi = Object$1.extend( /** @lends editor */{
   initialize: function initialize(options) {
     this.router = options && options.router;
     this.entryType = {};
@@ -870,14 +715,16 @@ var EditorApi = Object$1.extend(
     this.mainMenuItems = [];
     this.initializers = [];
     this.fileSelectionHandlers = {};
+    this.appearanceInputsCallbacks = [];
+
     /**
      * Failures API
      *
      * @returns {Failures}
      * @memberof editor
      */
-
     this.failures = new FailuresAPI();
+
     /**
      * Tracking records that are currently being saved.
      *
@@ -885,40 +732,44 @@ var EditorApi = Object$1.extend(
      * @memberof editor
      * @since 15.1
      */
-
     this.savingRecords = new SavingRecordsCollection();
+
     /**
      * Set up editor integration for page types.
      * @memberof editor
      */
-
     this.pageTypes = new PageTypes();
+
     /**
      * Add tabs to the configuration editor of all pages.
      * @memberof editor
      */
-
     this.commonPageConfigurationTabs = new CommonPageConfigurationTabs();
+
     /**
      * Setup editor integration for widget types.
      * @memberof editor
      */
-
     this.widgetTypes = new WidgetTypes();
+
     /**
      * Set up editor integration for file types
      * @memberof editor
      */
-
     this.fileTypes = new FileTypes();
+
     /**
      * List of available file import plugins
      * @memberof editor
      */
-
     this.fileImporters = new FileImporters();
-  },
 
+    /**
+     * List of additional menu items for dropdown menus
+     * @memberof editor
+     */
+    this.dropDownMenuItems = new DropDownMenuItems();
+  },
   /**
    * Configure editor for entry type.
    *
@@ -946,14 +797,11 @@ var EditorApi = Object$1.extend(
   },
   createEntryModel: function createEntryModel(seed, options) {
     var entry = new this.entryType.entryModel(seed.entry, options);
-
     if (entry.setupFromEntryTypeSeed) {
       entry.setupFromEntryTypeSeed(seed.entry_type, state);
     }
-
     return entry;
   },
-
   /**
    *  Display Backbone/Marionette View inside the main panel
    *  of the editor.
@@ -961,14 +809,12 @@ var EditorApi = Object$1.extend(
   showViewInMainPanel: function showViewInMainPanel(view) {
     app.mainRegion.show(view);
   },
-
   /**
    *  Display the Pageflow-Preview inside the main panel.
    */
   showPreview: function showPreview() {
     app.mainRegion.$el.empty();
   },
-
   /**
    * Register additional router and controller for sidebar.
    *
@@ -979,7 +825,6 @@ var EditorApi = Object$1.extend(
   registerSideBarRouting: function registerSideBarRouting(options) {
     this.sideBarRoutings.push(options);
   },
-
   /**
    * Set the file that is the parent of nested files when they are
    * uploaded. This value is automatically set and unset upon
@@ -988,7 +833,6 @@ var EditorApi = Object$1.extend(
   setUploadTargetFile: function setUploadTargetFile(file) {
     this.nextUploadTargetFile = file;
   },
-
   /**
    * Set the name of the help entry that shall be selected by
    * default when the help view is opened. This value is
@@ -1001,7 +845,6 @@ var EditorApi = Object$1.extend(
     this.defaultHelpEntry = this.nextDefaultHelpEntry;
     this.nextDefaultHelpEntry = null;
   },
-
   /**
    * Register additional menu item to be displayed on the root sidebar
    * view.
@@ -1014,7 +857,16 @@ var EditorApi = Object$1.extend(
   registerMainMenuItem: function registerMainMenuItem(options) {
     this.mainMenuItems.push(options);
   },
-
+  /**
+   * Register additional inputs to show in the appearance tab under
+   * title and options. Passed callback receives tabView and options
+   * with entry.
+   *
+   * @since edge
+   */
+  registerAppearanceInputs: function registerAppearanceInputs(callback) {
+    this.appearanceInputsCallbacks.push(callback);
+  },
   /**
    * Register a custom initializer which will be run before the boot
    * initializer of the editor.
@@ -1022,7 +874,6 @@ var EditorApi = Object$1.extend(
   addInitializer: function addInitializer(fn) {
     this.initializers.push(fn);
   },
-
   /**
    * Navigate to the given path.
    */
@@ -1030,10 +881,8 @@ var EditorApi = Object$1.extend(
     if (!this.router) {
       throw 'Routing has not been initialized yet.';
     }
-
     this.router.navigate(path, options);
   },
-
   /**
    * Extend the interface of page configuration objects. This is
    * especially convenient to wrap structured data from the page
@@ -1052,7 +901,6 @@ var EditorApi = Object$1.extend(
   registerPageConfigurationMixin: function registerPageConfigurationMixin(mixin) {
     app.trigger('mixin:configuration', mixin);
   },
-
   /**
    * File selection handlers let editor extensions use the files view
    * to select files for usage in their custom models.
@@ -1076,7 +924,6 @@ var EditorApi = Object$1.extend(
   registerFileSelectionHandler: function registerFileSelectionHandler(name, handler) {
     this.fileSelectionHandlers[name] = handler;
   },
-
   /**
    * Trigger selection of the given file type with the given
    * handler. Payload hash is passed to selection handler as options.
@@ -1111,12 +958,10 @@ var EditorApi = Object$1.extend(
         name: fileType
       };
     }
-
     this.navigate('/files/' + (fileType.defaultTab ? "".concat(fileType.defaultTab, ":default") : fileType.name) + '?handler=' + handlerName + '&payload=' + encodeURIComponent(JSON.stringify(payload)) + (fileType.filter ? '&filter=' + fileType.filter : ''), {
       trigger: true
     });
   },
-
   /**
    * Returns a promise which resolves to a page selected by the
    * user.
@@ -1134,7 +979,6 @@ var EditorApi = Object$1.extend(
     if (!this.fileSelectionHandlers[handlerName]) {
       throw 'Unknown FileSelectionHandler ' + handlerName;
     }
-
     var payloadJson = JSON.parse(decodeURIComponent(encodedPayload));
     return new this.fileSelectionHandlers[handlerName](_objectSpread2(_objectSpread2({}, payloadJson), {}, {
       entry: state.entry
@@ -1150,7 +994,6 @@ var EditorApi = Object$1.extend(
   ensureBrowserSupport: function ensureBrowserSupport(start) {
     if (this.entryType.isBrowserSupported) {
       var isBrowserSupported = this.entryType.isBrowserSupported();
-
       if (isBrowserSupported) {
         start();
       } else {
@@ -1188,7 +1031,6 @@ var startEditor = function startEditor(options) {
  * specific editor controllers registered via the `editor_app` entry
  * type option.
  */
-
 var entryTypeEditorControllerUrls = {
   /**
    * Mixins for Backbone collections that defines `url` method.
@@ -1221,7 +1063,6 @@ var entryTypeEditorControllerUrls = {
       }
     };
   },
-
   /**
    * Mixins for Backbone models that defines `urlRoot` method.
    *
@@ -1251,7 +1092,6 @@ var entryTypeEditorControllerUrls = {
     };
   }
 };
-
 function entryTypeEditorControllerUrl(resources) {
   return [state.entry.url(), editor.entryType.name, resources].join('/');
 }
@@ -1275,16 +1115,13 @@ var formDataUtils = {
 var stylesheet = {
   reload: function reload(name) {
     var link = this.selectLink(name);
-
     if (!link.data('originalHref')) {
       link.data('originalHref', link.attr('href'));
     }
-
     link.attr('href', link.data('originalHref') + '&reload=' + new Date().getTime());
   },
   update: function update(name, stylesheetPath) {
     var link = this.selectLink(name);
-
     if (link.attr('href') !== stylesheetPath) {
       link.attr('href', stylesheetPath);
     }
@@ -1300,11 +1137,9 @@ var SubsetCollection = Backbone.Collection.extend({
     var sorting = false;
     var parentSorting = false;
     options = options || {};
-
-    this.filter = options.filter || function (item) {
+    this.predicate = options.filter || function (item) {
       return true;
     };
-
     this.parent = options.parent;
     this.parentModel = options.parentModel;
     delete options.filter;
@@ -1312,7 +1147,7 @@ var SubsetCollection = Backbone.Collection.extend({
     this.model = this.parent.model;
     this.comparator = options.comparator || this.parent.comparator;
     this.listenTo(this.parent, 'add', function (model, collection, options) {
-      if (!adding && this.filter(model)) {
+      if (!adding && this.predicate(model)) {
         this.add(model, options);
       }
     });
@@ -1324,39 +1159,32 @@ var SubsetCollection = Backbone.Collection.extend({
       this.parent.add(model);
       adding = false;
     });
-
     if (options.watchAttribute) {
       this.listenTo(this.parent, 'change:' + options.watchAttribute, function (model) {
-        if (this.filter(model)) {
+        if (this.predicate(model)) {
           this.add(model);
         } else {
           this.remove(model);
         }
       });
     }
-
     if (options.sortOnParentSort) {
       this.listenTo(this.parent, 'sort', function () {
         parentSorting = true;
-
         if (!sorting) {
           this.sort();
         }
-
         parentSorting = false;
       });
     }
-
     this.listenTo(this, 'sort', function () {
       sorting = true;
-
       if (!parentSorting) {
         this.parent.sort();
       }
-
       sorting = false;
     });
-    Backbone.Collection.prototype.constructor.call(this, this.parent.filter(this.filter, this), options);
+    Backbone.Collection.prototype.constructor.call(this, this.parent.filter(this.predicate, this), options);
   },
   clear: function clear() {
     this.parent.remove(this.models);
@@ -1368,9 +1196,33 @@ var SubsetCollection = Backbone.Collection.extend({
   dispose: function dispose() {
     this.stopListening();
     this.reset();
-  }
-});
-
+  },
+  updateFilter: function updateFilter(predicate) {
+    this.predicate = predicate || function () {
+      return true;
+    };
+    var modelsToRemove = [];
+    var modelsToAdd = [];
+    this.parent.each(function (model) {
+      var included = !!this.get(model);
+      var shouldBeIncluded = this.predicate(model);
+      if (shouldBeIncluded && !included) {
+        modelsToAdd.push(model);
+      }
+      if (!shouldBeIncluded && included) {
+        modelsToRemove.push(model);
+      }
+    }, this);
+    if (modelsToRemove.length) {
+      this.remove(modelsToRemove);
+    }
+    if (modelsToAdd.length) {
+      this.add(modelsToAdd);
+    }
+    return this;
+  }
+});
+
 var FilesCollection = Backbone.Collection.extend({
   initialize: function initialize(models, options) {
     options = options || {};
@@ -1434,14 +1286,12 @@ var FilesCollection = Backbone.Collection.extend({
     });
   }
 });
-
 FilesCollection.createForFileTypes = function (fileTypes, files, options) {
   return fileTypes.reduce(function (result, fileType) {
     result[fileType.collectionName] = FilesCollection.createForFileType(fileType, files[fileType.collectionName], options);
     return result;
   }, {});
 };
-
 FilesCollection.createForFileType = function (fileType, files, options) {
   return new FilesCollection(files, _.extend({
     fileType: fileType,
@@ -1463,7 +1313,6 @@ var OtherEntry = Backbone.Model.extend({
         entry: this
       });
     }
-
     return this.files[fileType.collectionName];
   },
   titleOrSlug: function titleOrSlug() {
@@ -1494,26 +1343,21 @@ var transientReferences = {
       var fileType = editor.fileTypes.findByCollectionName(collection);
       collection = state.entry.getFileCollection(fileType);
     }
-
     return this.transientReferences[attribute] || collection.getByPermaId(this.get(attribute));
   },
   setReference: function setReference(attribute, record) {
     this._cleanUpReference(attribute);
-
     this._setReference(attribute, record);
-
     this._listenForReady(attribute, record);
   },
   unsetReference: function unsetReference(attribute) {
     this._cleanUpReference(attribute);
-
     this.set(attribute, null);
   },
   _setReference: function _setReference(attribute, record) {
     if (record.isNew()) {
       this.transientReferences[attribute] = record;
       this.set(attribute, null);
-
       this._setPermaIdOnceSynced(attribute, record);
     } else {
       this.set(attribute, record.get('perma_id'));
@@ -1539,7 +1383,6 @@ var transientReferences = {
       this.listenTo(record, 'change:state', function (model, value, options) {
         if (record.isReady()) {
           this._cleanUpReadyListener(attribute);
-
           this.trigger('change', this, options);
           this.trigger('change:' + attribute + ':ready');
         }
@@ -1548,7 +1391,6 @@ var transientReferences = {
   },
   _cleanUpReference: function _cleanUpReference(attribute) {
     this._cleanUpSaveListener(attribute);
-
     this._cleanUpReadyListener(attribute);
   },
   _cleanUpSaveListener: function _cleanUpSaveListener(attribute) {
@@ -1578,7 +1420,6 @@ var Configuration = Backbone.Model.extend({
     hide_title: false,
     autoplay: true
   },
-
   /**
    * Used by views (i.e. FileInputView) to get id which can be used in
    * routes to lookup configuration via its page.
@@ -1590,15 +1431,13 @@ var Configuration = Backbone.Model.extend({
   getImageFileUrl: function getImageFileUrl(attribute, options) {
     options = options || {};
     var file = this.getImageFile(attribute);
-
     if (file && file.isReady()) {
       return file.get(options.styleGroup ? options.styleGroup + '_url' : 'url');
     }
-
     return '';
   },
   getImageFile: function getImageFile(attribute) {
-    return this.getReference(attribute, state.imageFiles);
+    return this.getReference(attribute, 'image_files');
   },
   getFilePosition: function getFilePosition(attribute, coord) {
     var propertyName = this.filePositionProperty(attribute, coord);
@@ -1619,50 +1458,41 @@ var Configuration = Backbone.Model.extend({
   },
   getVideoFileSources: function getVideoFileSources(attribute) {
     var file = this.getVideoFile(attribute);
-
     if (file && file.isReady()) {
       return file.get('sources') ? this._appendSuffix(file.get('sources')) : '';
     }
-
     return '';
   },
   getVideoFile: function getVideoFile(attribute) {
-    return this.getReference(attribute, state.videoFiles);
+    return this.getReference(attribute, 'video_files');
   },
   getAudioFileSources: function getAudioFileSources(attribute) {
     var file = this.getAudioFile(attribute);
-
     if (file && file.isReady()) {
       return file.get('sources') ? this._appendSuffix(file.get('sources')) : '';
     }
-
     return '';
   },
   getAudioFile: function getAudioFile(attribute) {
-    return this.getReference(attribute, state.audioFiles);
+    return this.getReference(attribute, 'audio_files');
   },
   getVideoPosterUrl: function getVideoPosterUrl() {
-    var posterFile = this.getReference('poster_image_id', state.imageFiles),
-        videoFile = this.getReference('video_file_id', state.videoFiles);
-
+    var posterFile = this.getReference('poster_image_id', 'image_files'),
+      videoFile = this.getReference('video_file_id', 'video_files');
     if (posterFile) {
       return posterFile.get('url');
     } else if (videoFile) {
       return videoFile.get('poster_url');
     }
-
     return null;
   },
   _appendSuffix: function _appendSuffix(sources) {
     var parent = this.parent;
-
     if (!parent || !parent.id) {
       return sources;
     }
-
     return _.map(sources, function (source) {
       var clone = _.clone(source);
-
       clone.src = clone.src + '?e=' + parent.id + '&t=' + new Date().getTime();
       return clone;
     });
@@ -1678,13 +1508,11 @@ app.on('mixin:configuration', function (mixin) {
  * by triggering a `destroying` event and adding a `isDestroying`
  * method.
  */
-
 var delayedDestroying = {
   initialize: function initialize() {
     this._destroying = false;
     this._destroyed = false;
   },
-
   /**
    * Trigger `destroying` event and send `DELETE` request. Only remove
    * model from collection once the request is done.
@@ -1704,14 +1532,12 @@ var delayedDestroying = {
       }
     });
   },
-
   /**
    * Get whether the model is currently being destroyed.
    */
   isDestroying: function isDestroying() {
     return this._destroying;
   },
-
   /**
    * Get whether the model has been destroyed.
    */
@@ -1758,11 +1584,83 @@ var failureTracking = {
     } else if (xhr.statusText === 'timeout') {
       return 'Der Server ist nicht erreichbar.';
     }
-
     return '';
   }
 };
 
+/**
+ * Mixins for models with a nested configuration model.
+ *
+ * Triggers events on the parent model of the form
+ * `change:configuration` and `change:configuration:<attribute>`, when
+ * the configuration changes.
+ *
+ * @param {Object} [options]
+ * @param {Function} [options.configurationModel] -
+ *   Backbone model to use for nested configuration model.
+ * @param {Boolean} [options.autoSave] -
+ *   Save model when configuration changes.
+ * @param {Boolean|Array<String>} [options.includeAttributesInJSON] -
+ *   Include all or specific attributes of the parent model in the
+ *   data returned by `toJSON` besides the `configuration` property.
+ * @param {Function} [options.afterInitialize] -
+ *   Callback to invoke once configuration has been set up. The
+ *   initialize method of this mixin is only invoked after the
+ *   initialize method of the class using the mixin. The callback
+ *   is invoked with `this` pointing to the model object.
+ * @returns {Object} - Mixin to be included in model.
+ *
+ * @example
+ *
+ * import {configurationContainer} from 'pageflow/editor';
+ *
+ * const Section = Backbone.Model.extend({
+ *   mixins: [configurationContainer({autoSave: true})]
+ * });
+ *
+ * const section = new Section({configuration: {some: 'value'}});
+ * section.configuration.get('some') // => 'value';
+ */
+function configurationContainer() {
+  var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
+    configurationModel = _ref.configurationModel,
+    autoSave = _ref.autoSave,
+    includeAttributesInJSON = _ref.includeAttributesInJSON,
+    afterInitialize = _ref.afterInitialize;
+  configurationModel = configurationModel || Configuration.extend({
+    defaults: {}
+  });
+  return {
+    initialize: function initialize() {
+      this.configuration = new configurationModel(this.get('configuration'));
+      this.configuration.parent = this;
+      this.listenTo(this.configuration, 'change', function (model, options) {
+        if (!this.isNew() && (!this.isDestroying || !this.isDestroying()) && (!this.isDestroyed || !this.isDestroyed()) && autoSave && options.autoSave !== false) {
+          this.save();
+        }
+        this.trigger('change:configuration', this, undefined, options);
+        _.chain(this.configuration.changed).keys().each(function (name) {
+          this.trigger('change:configuration:' + name, this, this.configuration.get(name));
+        }, this);
+      });
+      if (afterInitialize) {
+        afterInitialize.call(this);
+      }
+    },
+    toJSON: function toJSON() {
+      var attributes = {};
+      if (includeAttributesInJSON === true) {
+        attributes = _.clone(this.attributes);
+      } else if (includeAttributesInJSON) {
+        attributes = _.pick(this.attributes, includeAttributesInJSON);
+      }
+      return _.extend(attributes, {
+        configuration: this.configuration.toJSON()
+      });
+    }
+  };
+}
+
 var Page = Backbone.Model.extend({
   modelName: 'page',
   paramRoot: 'page',
@@ -1775,19 +1673,18 @@ var Page = Backbone.Model.extend({
       perma_id: ''
     };
   },
-  mixins: [failureTracking, delayedDestroying],
+  mixins: [configurationContainer({
+    autoSave: true,
+    includeAttributesInJSON: true,
+    configurationModel: Configuration,
+    afterInitialize: function afterInitialize() {
+      this.configuration.page = this;
+      this.listenTo(this.configuration, 'change:title', function () {
+        this.trigger('change:title');
+      });
+    }
+  }), failureTracking, delayedDestroying],
   initialize: function initialize() {
-    this.configuration = new Configuration(this.get('configuration') || {});
-    this.configuration.parent = this.configuration.page = this;
-    this.listenTo(this.configuration, 'change', function () {
-      this.trigger('change:configuration', this);
-    });
-    this.listenTo(this.configuration, 'change:title', function () {
-      this.trigger('change:title');
-    });
-    this.listenTo(this.configuration, 'change', function () {
-      this.save();
-    });
     this.listenTo(this, 'change:template', function () {
       this.save();
     });
@@ -1816,7 +1713,6 @@ var Page = Backbone.Model.extend({
       if (candidate.condition && !conditionMet(candidate.condition, configuration)) {
         return result;
       }
-
       return result || configuration.getReference(candidate.attribute, candidate.file_collection);
     }, null);
   },
@@ -1826,16 +1722,10 @@ var Page = Backbone.Model.extend({
   pageType: function pageType() {
     return editor.pageTypes.findByName(this.get('template'));
   },
-  toJSON: function toJSON() {
-    return _.extend(_.clone(this.attributes), {
-      configuration: this.configuration.toJSON()
-    });
-  },
   destroy: function destroy() {
     this.destroyWithDelay();
   }
 });
-
 function conditionMet(condition, configuration) {
   if (condition.negated) {
     return configuration.get(condition.attribute) != condition.value;
@@ -1843,7 +1733,6 @@ function conditionMet(condition, configuration) {
     return configuration.get(condition.attribute) == condition.value;
   }
 }
-
 Page.linkedPagesLayouts = ['default', 'hero_top_left', 'hero_top_right'];
 Page.textPositions = ['left', 'center', 'right'];
 Page.textPositionsWithoutCenterOption = ['left', 'right'];
@@ -1876,18 +1765,15 @@ var StorylineScaffold = Scaffold.extend({
   build: function build() {
     this.storyline = this.parent.buildStoryline(this.options.storylineAttributes);
     this.chapter = this.storyline.buildChapter();
-
     if (this.options.depth === 'page') {
       this.page = this.chapter.buildPage();
     }
-
     editor.trigger('scaffold:storyline', this.storyline);
     return this.storyline;
   },
   load: function load(response) {
     this.storyline.set(response.storyline);
     this.chapter.set(response.chapter);
-
     if (this.page) {
       this.page.set(response.page);
     }
@@ -1905,7 +1791,6 @@ var FileReuse = Backbone.Model.extend({
     return '/editor/entries/' + this.entry.get('id') + '/files/' + this.collectionName + '/reuse';
   }
 });
-
 FileReuse.submit = function (otherEntry, file, options) {
   new FileReuse({
     other_entry_id: otherEntry.get('id'),
@@ -1939,7 +1824,6 @@ var NestedFilesCollection = SubsetCollection.extend({
       },
       comparator: nestedFilesOrder && nestedFilesOrder.comparator
     });
-
     if (nestedFilesOrder) {
       this.listenTo(this, 'change:configuration:' + nestedFilesOrder.binding, this.sort);
     }
@@ -1956,16 +1840,13 @@ var retryable = {
     options = options ? _.clone(options) : {};
     if (options.parse === void 0) options.parse = true;
     var model = this;
-
     options.success = function (resp) {
       if (!model.set(model.parse(resp, options), options)) return false;
       model.trigger('sync', model, resp, options);
     };
-
     options.error = function (resp) {
       model.trigger('error', model, resp, options);
     };
-
     options.url = this.url() + '/retry';
     return this.sync('create', this, options);
   }
@@ -1995,7 +1876,6 @@ var FileStage = Backbone.Model.extend({
     this.set('finished', this.finishedStates.indexOf(state) >= 0);
     this.set('failed', this.failedStates.indexOf(state) >= 0);
     this.set('action_required', this.actionRequiredStates.indexOf(state) >= 0);
-
     if (this.get('active')) {
       this.set('state', 'active');
     } else if (this.get('finished')) {
@@ -2054,28 +1934,28 @@ var stageProvider = {
 };
 
 var ReusableFile = Backbone.Model.extend({
-  mixins: [stageProvider, retryable],
+  mixins: [configurationContainer({
+    autoSave: true,
+    configurationModel: FileConfiguration,
+    includeAttributesInJSON: ['file_name', 'display_name', 'rights', 'parent_file_id', 'parent_file_model_type', 'content_type', 'file_size'],
+    afterInitialize: function afterInitialize() {
+      this.configuration.i18nKey = this.i18nKey;
+    }
+  }), stageProvider, retryable],
   initialize: function initialize(attributes, options) {
     this.options = options || {};
-    this.configuration = new FileConfiguration(this.get('configuration') || {});
-    this.configuration.i18nKey = this.i18nKey;
-    this.configuration.parent = this;
-    this.listenTo(this.configuration, 'change', function () {
-      this.trigger('change:configuration', this);
-
-      _.chain(this.configuration.changed).keys().each(function (name) {
-        this.trigger('change:configuration:' + name, this, this.configuration.get(name));
-      }, this);
-
+    this.listenTo(this, 'change:rights', function () {
       if (!this.isNew()) {
         this.save();
       }
     });
-    this.listenTo(this, 'change:rights', function () {
+    this.listenTo(this, 'change:display_name', function () {
       if (!this.isNew()) {
         this.save();
       }
     });
+    this.listenTo(this, 'change:original_url change:display_name', this.updateDownloadUrl);
+    this.updateDownloadUrl();
     this.listenTo(this, 'change', function (model, options) {
       if (options.applyConfigurationUpdaters) {
         this.configuration.applyUpdaters(this.fileType().configurationUpdaters, this.attributes.configuration);
@@ -2089,7 +1969,7 @@ var ReusableFile = Backbone.Model.extend({
     return this.options.fileType;
   },
   title: function title() {
-    return this.get('file_name');
+    return this.get('display_name') || this.get('file_name');
   },
   thumbnailFile: function thumbnailFile() {
     return this;
@@ -2098,7 +1978,6 @@ var ReusableFile = Backbone.Model.extend({
     if (typeof supersetCollection === 'function') {
       supersetCollection = supersetCollection();
     }
-
     var collectionName = supersetCollection.fileType.collectionName;
     this.nestedFilesCollections = this.nestedFilesCollections || {};
     this.nestedFilesCollections[collectionName] = this.nestedFilesCollections[collectionName] || new NestedFilesCollection({
@@ -2131,11 +2010,6 @@ var ReusableFile = Backbone.Model.extend({
   isPositionable: function isPositionable() {
     return false;
   },
-  toJSON: function toJSON() {
-    return _.extend(_.pick(this.attributes, 'file_name', 'rights', 'parent_file_id', 'parent_file_model_type', 'content_type', 'file_size'), {
-      configuration: this.configuration.toJSON()
-    });
-  },
   cancelUpload: function cancelUpload() {
     if (this.get('state') === 'uploading') {
       this.trigger('uploadCancelled');
@@ -2151,6 +2025,16 @@ var ReusableFile = Backbone.Model.extend({
     this.save({}, {
       url: this.url() + '/publish'
     });
+  },
+  updateDownloadUrl: function updateDownloadUrl() {
+    var originalUrl = this.get('original_url');
+    var displayName = this.get('display_name');
+    if (originalUrl && displayName) {
+      var separator = originalUrl.includes('?') ? '&' : '?';
+      this.set('download_url', "".concat(originalUrl).concat(separator, "download=").concat(encodeURIComponent(displayName)));
+    } else {
+      this.unset('download_url');
+    }
   }
 });
 
@@ -2169,7 +2053,6 @@ var UploadableFile = ReusableFile.extend({
 var EncodedFile = UploadableFile.extend({
   processingStages: function processingStages() {
     var stages = [];
-
     if (state.config.confirmEncodingJobs) {
       stages.push({
         name: 'fetching_meta_data',
@@ -2177,7 +2060,6 @@ var EncodedFile = UploadableFile.extend({
         failedStates: ['fetching_meta_data_failed']
       });
     }
-
     stages.push({
       name: 'encoding',
       actionRequiredStates: ['waiting_for_confirmation'],
@@ -2206,11 +2088,9 @@ var VideoFile = EncodedFile.extend({
 
 var WidgetConfigurationFileSelectionHandler = function WidgetConfigurationFileSelectionHandler(options) {
   var widget = state.entry.widgets.get(options.id);
-
   this.call = function (file) {
     widget.configuration.setReference(options.attributeName, file);
   };
-
   this.getReferer = function () {
     return '/widgets/' + widget.id;
   };
@@ -2268,10 +2148,8 @@ var EncodingConfirmation = Backbone.Model.extend({
     };
   }
 });
-
 EncodingConfirmation.createWithPreselection = function (options) {
   var model = new EncodingConfirmation();
-
   if (options.fileId) {
     if (options.fileType === 'video_file') {
       model.videoFiles.add(state.videoFiles.get(options.fileId));
@@ -2279,7 +2157,6 @@ EncodingConfirmation.createWithPreselection = function (options) {
       model.audioFiles.add(state.audioFiles.get(options.fileId));
     }
   }
-
   return model;
 };
 
@@ -2318,7 +2195,6 @@ var AudioFile = EncodedFile.extend({
     if (this.isReady()) {
       return this.get('sources') ? this.get('sources') : '';
     }
-
     return '';
   }
 });
@@ -2338,6 +2214,7 @@ var EntryMetadata = Configuration.extend({
     this.configuration = new EntryMetadataConfiguration(_.clone(attributes.configuration) || {});
     this.listenTo(this.configuration, 'change', function (model, options) {
       this.trigger('change', model, options);
+      this.trigger('change:configuration', this, undefined, options);
       this.parent.save();
     });
   },
@@ -2374,7 +2251,6 @@ var TextTrackFile = UploadableFile.extend({
   readyState: 'processed',
   initialize: function initialize(attributes, options) {
     ReusableFile.prototype.initialize.apply(this, arguments);
-
     if (this.isNew() && !this.configuration.get('srclang')) {
       this.configuration.set('srclang', this.extractLanguageCodeFromFilename());
     }
@@ -2384,7 +2260,6 @@ var TextTrackFile = UploadableFile.extend({
   },
   inferredLabel: function inferredLabel() {
     var srclang = this.configuration.get('srclang');
-
     if (srclang) {
       return I18n$1.t('pageflow.languages.' + srclang, {
         defaultValue: ''
@@ -2400,7 +2275,6 @@ TextTrackFile.displayLabelBinding = 'srclang';
 
 var StorylineOrdering = function StorylineOrdering(storylines, pages) {
   var storylinesByParent;
-
   this.watch = function () {
     storylines.on('add change:configuration', function () {
       this.sort();
@@ -2409,13 +2283,11 @@ var StorylineOrdering = function StorylineOrdering(storylines, pages) {
       this.sort();
     }, this);
   };
-
   this.sort = function (options) {
     prepare();
     visit(storylinesWithoutParent(), 1, 0);
     storylines.sort(options);
   };
-
   function visit(storylines, offset, level) {
     return _(storylines).reduce(function (position, storyline, index) {
       storyline.set('position', position);
@@ -2423,53 +2295,42 @@ var StorylineOrdering = function StorylineOrdering(storylines, pages) {
       return visit(children(storyline), position + 1, level + 1);
     }, offset);
   }
-
   function storylinesWithoutParent() {
     return storylinesByParent[-1];
   }
-
   function children(storyline) {
     return storylinesByParent[storyline.cid] || [];
   }
-
   function prepare() {
     storylinesByParent = _(groupStorylinesByParentStoryline()).reduce(function (result, storylines, key) {
       result[key] = storylines.sort(compareStorylines);
       return result;
     }, {});
   }
-
   function groupStorylinesByParentStoryline() {
     return storylines.groupBy(function (storyline) {
       var parentPage = getParentPage(storyline);
       return parentPage && parentPage.chapter ? parentPage.chapter.storyline.cid : -1;
     });
   }
-
   function compareStorylines(storylineA, storylineB) {
     return compareByMainFlag(storylineA, storylineB) || compareByParentPagePosition(storylineA, storylineB) || compareByLane(storylineA, storylineB) || compareByRow(storylineA, storylineB) || compareByTitle(storylineA, storylineB);
   }
-
   function compareByMainFlag(storylineA, storylineB) {
     return compare(storylineA.isMain() ? -1 : 1, storylineB.isMain() ? -1 : 1);
   }
-
   function compareByParentPagePosition(storylineA, storylineB) {
     return compare(getParentPagePosition(storylineA), getParentPagePosition(storylineB));
   }
-
   function compareByLane(storylineA, storylineB) {
     return compare(storylineA.lane(), storylineB.lane());
   }
-
   function compareByRow(storylineA, storylineB) {
     return compare(storylineA.row(), storylineB.row());
   }
-
   function compareByTitle(storylineA, storylineB) {
     return compare(storylineA.title(), storylineB.title());
   }
-
   function compare(a, b) {
     if (a > b) {
       return 1;
@@ -2479,12 +2340,10 @@ var StorylineOrdering = function StorylineOrdering(storylines, pages) {
       return 0;
     }
   }
-
   function getParentPagePosition(storyline) {
     var parentPage = getParentPage(storyline);
     return parentPage && parentPage.get('position');
   }
-
   function getParentPage(storyline) {
     return pages.getByPermaId(storyline.parentPagePermaId());
   }
@@ -2492,11 +2351,9 @@ var StorylineOrdering = function StorylineOrdering(storylines, pages) {
 
 var PageConfigurationFileSelectionHandler = function PageConfigurationFileSelectionHandler(options) {
   var page = state.pages.get(options.id);
-
   this.call = function (file) {
     page.configuration.setReference(options.attributeName, file);
   };
-
   this.getReferer = function () {
     return '/pages/' + page.id + '/' + (options.returnToTab || 'files');
   };
@@ -2527,7 +2384,6 @@ var EntryMetadataFileSelectionHandler = function EntryMetadataFileSelectionHandl
   this.call = function (file) {
     state.entry.metadata.setReference(options.attributeName, file);
   };
-
   this.getReferer = function () {
     return '/meta_data/' + (options.returnToTab || 'general');
   };
@@ -2627,12 +2483,10 @@ var EditLockContainer = Backbone.Model.extend({
         case 409:
           container.handleConflict(xhr, settings);
           break;
-
         case 401:
         case 422:
           container.handleUnauthenticated();
           break;
-
         default:
           container.handleError();
       }
@@ -2686,6 +2540,9 @@ var Widget = Backbone.Model.extend({
   widgetType: function widgetType() {
     return this.get('type_name') && this.widgetTypes.findByName(this.get('type_name'));
   },
+  defineConfigurationEditorTabViewGroups: function defineConfigurationEditorTabViewGroups(groups) {
+    this.widgetType() && this.widgetType().defineConfigurationEditorTabViewGroups(groups);
+  },
   hasConfiguration: function hasConfiguration() {
     return !!(this.widgetType() && this.widgetType().hasConfiguration());
   },
@@ -2704,34 +2561,138 @@ var Widget = Backbone.Model.extend({
   }
 });
 
+var Search = Backbone.Model.extend({
+  defaults: {
+    term: '',
+    order: 'alphabetical'
+  },
+  initialize: function initialize(attrs) {
+    var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+    this.attribute = options.attribute;
+    this.storageKey = options.storageKey;
+    this.comparators = {
+      alphabetical: function alphabetical(file) {
+        var fileName = file.get('display_name');
+        return fileName && fileName.toLowerCase ? fileName.toLowerCase() : fileName;
+      },
+      most_recent: function most_recent(file) {
+        var date = file.get('created_at');
+        return date ? -new Date(date).getTime() : -file.id;
+      }
+    };
+    this.orderAttributes = {
+      alphabetical: 'display_name',
+      most_recent: 'created_at'
+    };
+    if (this.storageKey) {
+      var storage = this.getLocalStorage();
+      if (storage && storage[this.storageKey]) {
+        this.set('order', storage[this.storageKey]);
+      }
+      this.on('change:order', function () {
+        var storage = this.getLocalStorage();
+        if (storage) {
+          storage[this.storageKey] = this.get('order');
+        }
+      });
+    }
+  },
+  getLocalStorage: function getLocalStorage() {
+    try {
+      return window.localStorage;
+    } catch (e) {
+      return null;
+    }
+  },
+  matches: function matches(model) {
+    var term = (this.get('term') || '').toLowerCase();
+    var value = (model.get(this.attribute) || '').toLowerCase();
+    return value.indexOf(term) >= 0;
+  },
+  applyTo: function applyTo(collection) {
+    var subset = new SubsetCollection({
+      parent: collection,
+      parentModel: collection.parentModel,
+      watchAttribute: this.attribute,
+      filter: this.matches.bind(this),
+      comparator: this.comparators[this.get('order')]
+    });
+    this.listenTo(this, 'change:term', function () {
+      subset.updateFilter(this.matches.bind(this));
+    });
+    this.listenTo(this, 'change:order', function () {
+      subset.comparator = this.comparators[this.get('order')];
+      subset.sort();
+    });
+    this.listenTo(subset, 'change', function (model) {
+      var attribute = this.orderAttributes[this.get('order')];
+      if (model.hasChanged(attribute)) {
+        subset.sort();
+      }
+    });
+    return subset;
+  }
+});
+
+var ListHighlight = Backbone.Model.extend({
+  defaults: {
+    active: false
+  },
+  initialize: function initialize(attrs) {
+    var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+    this.collection = options.collection;
+  },
+  next: function next() {
+    this._move(1);
+  },
+  previous: function previous() {
+    this._move(-1);
+  },
+  triggerSelect: function triggerSelect() {
+    var id = this.get('currentId');
+    if (id != null) {
+      this.trigger("selected:".concat(id));
+    }
+  },
+  _move: function _move(delta) {
+    var collection = this.collection;
+    var length = collection.length;
+    if (!length) {
+      return;
+    }
+    var currentId = this.get('currentId');
+    var currentModel = currentId != null ? collection.get(currentId) : null;
+    var index = currentModel ? collection.indexOf(currentModel) : -1;
+    if (index === -1) {
+      index = delta > 0 ? 0 : length - 1;
+    } else {
+      index = (index + delta + length) % length;
+    }
+    this.set('currentId', collection.at(index).id);
+  }
+});
+
 var StorylineTransitiveChildPages = function StorylineTransitiveChildPages(storyline, storylines, pages) {
   var isTranstiveChildStoryline;
-
   this.contain = function (page) {
     if (!isTranstiveChildStoryline) {
       search();
     }
-
     return !!isTranstiveChildStoryline[page.chapter.storyline.id];
   };
-
   function search() {
     isTranstiveChildStoryline = storylines.reduce(function (memo, other) {
       var current = other;
-
       while (current) {
         if (current === storyline || memo[current.id]) {
           memo[other.id] = true;
           return memo;
         }
-
         current = parentStoryline(current);
       }
-
       return memo;
     }, {});
   }
-
   function parentStoryline(storyline) {
     var parentPage = pages.getByPermaId(storyline.parentPagePermaId());
     return parentPage && parentPage.chapter && parentPage.chapter.storyline;
@@ -2751,13 +2712,13 @@ var FileUploader = Object$1.extend({
     var file = new fileType.model({
       state: 'uploadable',
       file_name: upload.name,
+      display_name: upload.name,
       content_type: upload.type,
       file_size: upload.size
     }, {
       fileType: fileType
     });
     var setTargetFile = editor$1.nextUploadTargetFile;
-
     if (setTargetFile) {
       if (fileType.topLevelType || !setTargetFile.fileType().nestedFileTypes.contains(fileType)) {
         throw new InvalidNestedTypeError(upload, {
@@ -2765,7 +2726,6 @@ var FileUploader = Object$1.extend({
           fileType: fileType
         });
       }
-
       file.set({
         parent_file_id: setTargetFile.get('id'),
         parent_file_model_type: setTargetFile.fileType().typeName
@@ -2776,20 +2736,16 @@ var FileUploader = Object$1.extend({
         fileTypes: this.fileTypes
       });
     }
-
     this.entry.getFileCollection(fileType).add(file);
     var deferred = new $.Deferred();
-
     if (setTargetFile) {
       deferred.resolve();
     } else {
       this.deferreds.push(deferred);
-
       if (this.deferreds.length == 1) {
         this.trigger('new:batch');
       }
     }
-
     return deferred.promise().then(function () {
       file.set('state', 'uploading');
       return file;
@@ -2799,12 +2755,10 @@ var FileUploader = Object$1.extend({
   },
   submit: function submit() {
     _(this.deferreds).invoke('resolve');
-
     this.deferreds = [];
   },
   abort: function abort() {
     _(this.deferreds).invoke('reject');
-
     this.deferreds = [];
   }
 });
@@ -2826,11 +2780,9 @@ var orderedCollection = {
   saveOrder: function saveOrder() {
     var parentModel = this.parentModel;
     var collection = this;
-
     if (collection.isEmpty()) {
       return $.Deferred().resolve().promise();
     }
-
     return Backbone.sync('update', parentModel, {
       url: collection.url() + '/order',
       attrs: {
@@ -2882,7 +2834,11 @@ var Chapter = Backbone.Model.extend({
   modelName: 'chapter',
   paramRoot: 'chapter',
   i18nKey: 'pageflow/chapter',
-  mixins: [failureTracking, delayedDestroying],
+  mixins: [configurationContainer({
+    autoSave: true,
+    includeAttributesInJSON: true,
+    configurationModel: ChapterConfiguration
+  }), failureTracking, delayedDestroying],
   initialize: function initialize(attributes, options) {
     this.pages = new ChapterPagesCollection({
       pages: options.pages || state.pages,
@@ -2891,12 +2847,6 @@ var Chapter = Backbone.Model.extend({
     this.listenTo(this, 'change:title', function () {
       this.save();
     });
-    this.configuration = new ChapterConfiguration(this.get('configuration') || {});
-    this.listenTo(this.configuration, 'change', function () {
-      this.save();
-      this.trigger('change:configuration', this);
-    });
-    return attributes;
   },
   urlRoot: function urlRoot() {
     return this.isNew() ? this.collection.url() : '/chapters';
@@ -2958,21 +2908,16 @@ var Storyline = Backbone.Model.extend({
   modelName: 'storyline',
   paramRoot: 'storyline',
   i18nKey: 'pageflow/storyline',
-  mixins: [failureTracking, delayedDestroying],
+  mixins: [configurationContainer({
+    autoSave: true,
+    configurationModel: StorylineConfiguration
+  }), failureTracking, delayedDestroying],
   initialize: function initialize(attributes, options) {
     this.chapters = new StorylineChaptersCollection({
       chapters: options.chapters || state.chapters,
       storyline: this
     });
-    this.configuration = new StorylineConfiguration(this.get('configuration') || {});
-    this.listenTo(this.configuration, 'change', function () {
-      if (!this.isNew()) {
-        this.save();
-      }
-
-      this.trigger('change:configuration', this);
-    });
-    this.listenTo(this.configuration, 'change:main', function (model, value) {
+    this.listenTo(this, 'change:configuration:main', function (model, value) {
       this.trigger('change:main', this, value);
     });
   },
@@ -3021,11 +2966,6 @@ var Storyline = Backbone.Model.extend({
     scaffold.create();
     return scaffold;
   },
-  toJSON: function toJSON() {
-    return {
-      configuration: this.configuration.toJSON()
-    };
-  },
   destroy: function destroy() {
     this.destroyWithDelay();
   }
@@ -3063,87 +3003,15 @@ var PageLink = Backbone.Model.extend({
 var PageLinkFileSelectionHandler = function PageLinkFileSelectionHandler(options) {
   var page = state.pages.getByPermaId(options.id.split(':')[0]);
   var pageLink = page.pageLinks().get(options.id);
-
   this.call = function (file) {
     pageLink.setReference(options.attributeName, file);
   };
-
   this.getReferer = function () {
     return '/page_links/' + pageLink.id;
   };
 };
 editor.registerFileSelectionHandler('pageLink', PageLinkFileSelectionHandler);
 
-/**
- * Mixins for models with a nested configuration model.
- *
- * Triggers events on the parent model of the form
- * `change:configuration` and `change:configuration:<attribute>`, when
- * the configuration changes.
- *
- * @param {Object} [options]
- * @param {Function} [options.configurationModel] -
- *   Backbone model to use for nested configuration model.
- * @param {Boolean} [options.autoSave] -
- *   Save model when configuration changes.
- * @param {Boolean|Array<String>} [options.includeAttributesInJSON] -
- *   Include all or specific attributes of the parent model in the
- *   data returned by `toJSON` besides the `configuration` property.
- * @returns {Object} - Mixin to be included in model.
- *
- * @example
- *
- * import {configurationContainer} from 'pageflow/editor';
- *
- * const Section = Backbone.Model.extend({
- *   mixins: [configurationContainer({autoSave: true})]
- * });
- *
- * const section = new Section({configuration: {some: 'value'}});
- * section.configuration.get('some') // => 'value';
- */
-
-function configurationContainer() {
-  var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
-      configurationModel = _ref.configurationModel,
-      autoSave = _ref.autoSave,
-      includeAttributesInJSON = _ref.includeAttributesInJSON;
-
-  configurationModel = configurationModel || Configuration.extend({
-    defaults: {}
-  });
-  return {
-    initialize: function initialize() {
-      this.configuration = new configurationModel(this.get('configuration'));
-      this.configuration.parent = this;
-      this.listenTo(this.configuration, 'change', function (model, options) {
-        if (!this.isNew() && (!this.isDestroying || !this.isDestroying()) && (!this.isDestroyed || !this.isDestroyed()) && autoSave && options.autoSave !== false) {
-          this.save();
-        }
-
-        this.trigger('change:configuration', this, undefined, options);
-
-        _.chain(this.configuration.changed).keys().each(function (name) {
-          this.trigger('change:configuration:' + name, this, this.configuration.get(name));
-        }, this);
-      });
-    },
-    toJSON: function toJSON() {
-      var attributes = {};
-
-      if (includeAttributesInJSON === true) {
-        attributes = _.clone(this.attributes);
-      } else if (includeAttributesInJSON) {
-        attributes = _.pick(this.attributes, includeAttributesInJSON);
-      }
-
-      return _.extend(attributes, {
-        configuration: this.configuration.toJSON()
-      });
-    }
-  };
-}
-
 var persistedPromise = {
   persisted: function persisted() {
     var model = this;
@@ -3228,7 +3096,9 @@ var Entry = Backbone.Model.extend({
   initialize: function initialize(attributes, options) {
     options = options || {};
     this.metadata = new EntryMetadata(this.get('metadata') || {});
-    this.metadata.parent = this; // In 15.1 `entry.configuration` was turned into a new `Metadata`
+    this.metadata.parent = this;
+
+    // In 15.1 `entry.configuration` was turned into a new `Metadata`
     // model. Some of the entry type specific data (like
     // `home_button_enabled`) was extraced into
     // `entry.metadata.configuration`. Attributes like `title` or `locale`
@@ -3236,9 +3106,9 @@ var Entry = Backbone.Model.extend({
     // entry.metadata. Since some plugins (e.g. `pageflow-vr`) depend on
     // reading the locale from `entry.configuration`, this `configuration`
     // keeps backwards compatibility.
-
     this.configuration = this.metadata;
     this.themes = options.themes || state.themes;
+    this.site = options.site || state.site;
     this.files = options.files || state.files;
     this.fileTypes = options.fileTypes || editor.fileTypes;
     this.storylines = options.storylines || state.storylines;
@@ -3312,7 +3182,6 @@ var Entry = Backbone.Model.extend({
           merge: false,
           remove: false
         });
-
         entry.trigger('use:files');
       }
     });
@@ -3329,28 +3198,22 @@ var Entry = Backbone.Model.extend({
   parse: function parse(response, options) {
     if (response) {
       this.set(_.pick(response, 'published', 'published_until', 'password_protected', 'last_published_with_noindex'));
-
       this._setFiles(response, {
         add: false,
         remove: false,
         applyConfigurationUpdaters: true
       });
     }
-
     return response;
   },
   _setFiles: function _setFiles(response, options) {
     this.fileTypes.each(function (fileType) {
-      var filesAttributes = response[fileType.collectionName]; // Temporary solution until rights attributes is moved to
-      // configuration hash. If we are polling, prevent overwriting
-      // the rights attribute.
-
+      var filesAttributes = response[fileType.collectionName];
       if (options.merge !== false) {
         filesAttributes = _.map(filesAttributes, function (fileAttributes) {
-          return _.omit(fileAttributes, 'rights');
+          return _.omit(fileAttributes, 'display_name', 'rights');
         });
       }
-
       this.getFileCollection(fileType).set(filesAttributes, _.extend({
         fileType: fileType
       }, options));
@@ -3372,10 +3235,10 @@ var AuthenticationProvider = Object$1.extend({
   },
   authenticationPopup: function authenticationPopup(linkUrl, width, height) {
     var sep = linkUrl.indexOf('?') !== -1 ? '&' : '?',
-        url = linkUrl + sep + 'popup=true',
-        left = (screen.width - width) / 2 - 16,
-        top = (screen.height - height) / 2 - 50,
-        windowFeatures = 'menubar=no,toolbar=no,status=no,width=' + width + ',height=' + height + ',left=' + left + ',top=' + top;
+      url = linkUrl + sep + 'popup=true',
+      left = (screen.width - width) / 2 - 16,
+      top = (screen.height - height) / 2 - 50,
+      windowFeatures = 'menubar=no,toolbar=no,status=no,width=' + width + ',height=' + height + ',left=' + left + ',top=' + top;
     return window.open(url, 'authPopup', windowFeatures);
   },
   authenticateCallback: function authenticateCallback() {
@@ -3444,11 +3307,9 @@ var FileImport = Backbone.Model.extend({
   getFilesMetaData: function getFilesMetaData(options) {
     this.action = 'files_meta_data';
     var selectedFiles = this.get('selectedFiles');
-
     for (var i = 0; i < selectedFiles.length; i++) {
       selectedFiles[i] = selectedFiles[i].toJSON();
     }
-
     return this.fetch({
       data: {
         files: selectedFiles
@@ -3489,7 +3350,6 @@ var FileImport = Backbone.Model.extend({
           var file = selections.find(function (file) {
             return file.get('source_url') == item.source_url;
           });
-
           if (file) {
             file.set(item.attributes);
           }
@@ -3524,7 +3384,6 @@ var ChaptersCollection = Backbone.Collection.extend({
  *
  * @since 15.1
  */
-
 var ForeignKeySubsetCollection = SubsetCollection.extend({
   mixins: [orderedCollection],
   constructor: function constructor(options) {
@@ -3535,7 +3394,6 @@ var ForeignKeySubsetCollection = SubsetCollection.extend({
       if (options.parentReferenceAttribute) {
         model[options.parentReferenceAttribute] = parentModel;
       }
-
       model.set(options.foreignKeyAttribute, parentModel.id);
     });
     SubsetCollection.prototype.constructor.call(this, {
@@ -3552,7 +3410,6 @@ var ForeignKeySubsetCollection = SubsetCollection.extend({
       this.invoke('trigger', 'dependentDestroy');
       this.clear();
     });
-
     if (options.parentReferenceAttribute) {
       this.each(function (model) {
         return model[options.parentReferenceAttribute] = parentModel;
@@ -3619,7 +3476,6 @@ var PageLinksCollection = Backbone.Collection.extend({
       position: position
     };
   },
-
   /** @private */
   getUniqueId: function getUniqueId() {
     var maxId = Math.max(0, _.max(this.map(function (pageLink) {
@@ -3640,10 +3496,9 @@ var OtherEntriesCollection = Backbone.Collection.extend({
   // of the "other" entries, after all.
   parse: function parse(response) {
     var excludeEntry = this.getExcludeEntry(),
-        filteredResponse = _.filter(response, function (entry) {
-      return entry.id != excludeEntry.id;
-    });
-
+      filteredResponse = _.filter(response, function (entry) {
+        return entry.id != excludeEntry.id;
+      });
     return Backbone.Collection.prototype.parse.call(this, filteredResponse);
   },
   getExcludeEntry: function getExcludeEntry() {
@@ -3726,7 +3581,6 @@ var PagesCollection = Backbone.Collection.extend({
         }, this), 0);
       });
     }
-
     return this._persisted;
   }
 });
@@ -3737,18 +3591,17 @@ var ThemesCollection = Backbone.Collection.extend({
     var theme = this.findWhere({
       name: name
     });
-
     if (!theme) {
       throw new Error('Found no theme by name ' + name);
     }
-
     return theme;
   }
 });
 
 var WidgetsCollection = Backbone.Collection.extend({
   model: Widget,
-  initialize: function initialize() {
+  initialize: function initialize(widgets, options) {
+    this.widgetTypes = options.widgetTypes;
     this.listenTo(this, 'change:type_name change:configuration', function () {
       this.batchSave();
     });
@@ -3769,6 +3622,28 @@ var WidgetsCollection = Backbone.Collection.extend({
         subject.trigger('sync:widgets', subject, response, {});
       }
     }));
+  },
+  setupConfigurationEditorTabViewGroups: function setupConfigurationEditorTabViewGroups(groups) {
+    var _this = this;
+    this.defineConfigurationEditorTabViewGroups(groups);
+    this.listenTo(this, 'change:type_name', function () {
+      return _this.defineConfigurationEditorTabViewGroups(groups);
+    });
+  },
+  defineConfigurationEditorTabViewGroups: function defineConfigurationEditorTabViewGroups(groups) {
+    this.widgetTypes.defineStubConfigurationEditorTabViewGroups(groups);
+    this.each(function (widget) {
+      return widget.defineConfigurationEditorTabViewGroups(groups);
+    });
+  },
+  withInsertPoint: function withInsertPoint(insertPoint) {
+    return new SubsetCollection({
+      parent: this,
+      watchAttribute: 'type_name',
+      filter: function filter(widget) {
+        return widget.widgetType() && widget.widgetType().insertPoint === insertPoint;
+      }
+    });
   }
 });
 
@@ -3858,7 +3733,7 @@ function _slicedToArray(arr, i) {
   return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
 }
 
-function template$2(data) {
+function template(data) {
 var __t, __p = '';
 __p += '<a class="back">' +
 ((__t = ( I18n.t('pageflow.editor.templates.back_button_decorator.outline') )) == null ? '' : __t) +
@@ -3867,7 +3742,7 @@ return __p
 }
 
 var BackButtonDecoratorView = Marionette.Layout.extend({
-  template: template$2,
+  template: template,
   className: 'back_button_decorator',
   events: {
     'click a.back': 'goBack'
@@ -3886,7 +3761,7 @@ var BackButtonDecoratorView = Marionette.Layout.extend({
   }
 });
 
-function template$3(data) {
+function template$1(data) {
 var __t, __p = '';
 __p += '<input type="checkbox">\n<label class="file_name"></label>\n<span class="duration"></span>\n\n<div class="actions">\n  <a class="remove" title="' +
 ((__t = ( I18n.t('pageflow.editor.templates.confirmable_file_item.remove') )) == null ? '' : __t) +
@@ -3896,7 +3771,7 @@ return __p
 
 var ConfirmableFileItemView = Marionette.ItemView.extend({
   tagName: 'li',
-  template: template$3,
+  template: template$1,
   ui: {
     fileName: '.file_name',
     duration: '.duration',
@@ -3912,7 +3787,7 @@ var ConfirmableFileItemView = Marionette.ItemView.extend({
     this.ui.label.attr('for', this.cid);
     this.ui.checkBox.attr('id', this.cid);
     this.ui.checkBox.prop('checked', this.options.selectedFiles.contains(this.model));
-    this.ui.fileName.text(this.model.get('file_name') || '(Unbekannt)');
+    this.ui.fileName.text(this.model.title());
     this.ui.duration.text(this.model.get('duration') || '-');
   },
   destroy: function destroy() {
@@ -3929,7 +3804,7 @@ var ConfirmableFileItemView = Marionette.ItemView.extend({
   }
 });
 
-function template$4(data) {
+function template$2(data) {
 var __t, __p = '';
 __p += '<div class="blank_slate">\n  <p>\n      ' +
 ((__t = ( I18n.t('pageflow.editor.templates.confirm_encoding.all_released') )) == null ? '' : __t) +
@@ -3948,7 +3823,7 @@ return __p
 }
 
 var ConfirmEncodingView = Marionette.ItemView.extend({
-  template: template$4,
+  template: template$2,
   className: 'confirm_encoding',
   ui: {
     blankSlate: '.blank_slate',
@@ -4005,7 +3880,6 @@ var ConfirmEncodingView = Marionette.ItemView.extend({
     this.ui.intro.html(this.model.get('intro_html'));
     this.ui.summary.html(this.model.get('summary_html'));
     this.ui.confirmButton.toggleClass('checking', !!this.model.get('checking'));
-
     if (this.model.get('empty') || this.model.get('exceeding') || this.model.get('checking')) {
       this.ui.confirmButton.attr('disabled', true);
     } else {
@@ -4013,7 +3887,6 @@ var ConfirmEncodingView = Marionette.ItemView.extend({
     }
   }
 });
-
 ConfirmEncodingView.create = function (options) {
   return new BackButtonDecoratorView({
     view: new ConfirmEncodingView(options)
@@ -4039,7 +3912,6 @@ ConfirmEncodingView.create = function (options) {
  * @param {String} options.classNames.retryButton -
  *   Class name of the element that shall act as a retry button.
  */
-
 function modelLifecycleTrackingView(_ref) {
   var classNames = _ref.classNames;
   return {
@@ -4049,13 +3921,11 @@ function modelLifecycleTrackingView(_ref) {
     }),
     initialize: function initialize() {
       var _this = this;
-
       if (classNames.creating) {
         this.listenTo(this.model, 'change:id', function () {
           this.$el.removeClass(classNames.creating);
         });
       }
-
       if (classNames.destroying) {
         this.listenTo(this.model, 'destroying', function () {
           this.$el.addClass(classNames.destroying);
@@ -4064,7 +3934,6 @@ function modelLifecycleTrackingView(_ref) {
           this.$el.removeClass(classNames.destroying);
         });
       }
-
       if (classNames.failed || classNames.failureMessage) {
         this.listenTo(this.model, 'change:failed', function () {
           return _this.updateFailIndicator();
@@ -4075,18 +3944,15 @@ function modelLifecycleTrackingView(_ref) {
       if (this.model.isNew()) {
         this.$el.addClass(classNames.creating);
       }
-
       if (this.model.isDestroying && this.model.isDestroying()) {
         this.$el.addClass(classNames.destroying);
       }
-
       this.updateFailIndicator();
     },
     updateFailIndicator: function updateFailIndicator() {
       if (classNames.failed) {
         this.$el.toggleClass(classNames.failed, this.model.isFailed());
       }
-
       if (classNames.failureMessage) {
         this.$el.find(".".concat(classNames.failureMessage)).text(this.model.getFailureMessage());
       }
@@ -4102,7 +3968,7 @@ var failureIndicatingView = modelLifecycleTrackingView({
   }
 });
 
-function template$5(data) {
+function template$3(data) {
 var __t, __p = '';
 __p += '<a class="close" href="#">' +
 ((__t = ( I18n.t('pageflow.editor.templates.edit_entry.close') )) == null ? '' : __t) +
@@ -4119,7 +3985,7 @@ return __p
 }
 
 var EditEntryView = Marionette.Layout.extend({
-  template: template$5,
+  template: template$3,
   mixins: [failureIndicatingView, tooltipContainer],
   ui: {
     publishButton: 'a.publish',
@@ -4141,7 +4007,6 @@ var EditEntryView = Marionette.Layout.extend({
           trigger: true
         });
       }
-
       return false;
     },
     'click .menu a': function clickMenuA(event) {
@@ -4153,9 +4018,7 @@ var EditEntryView = Marionette.Layout.extend({
   },
   onRender: function onRender() {
     this._addMenuItems();
-
     this._updatePublishButton();
-
     this.outlineRegion.show(new editor.entryType.outlineView({
       entry: state.entry,
       navigatable: true,
@@ -4168,7 +4031,6 @@ var EditEntryView = Marionette.Layout.extend({
   _updatePublishButton: function _updatePublishButton() {
     var disabled = !this.model.get('publishable');
     this.ui.publishButton.toggleClass('disabled', disabled);
-
     if (disabled) {
       this.ui.publishButton.attr('data-tooltip', 'pageflow.editor.views.edit_entry_view.cannot_publish');
     } else {
@@ -4177,31 +4039,25 @@ var EditEntryView = Marionette.Layout.extend({
   },
   _addMenuItems: function _addMenuItems() {
     var view = this;
-
     _.each(editor.mainMenuItems, function (options) {
       var item = $('<li><a href="#"></a></li>');
       var link = item.find('a');
-
       if (options.path) {
         link.data('path', options.path);
       }
-
       if (options.id) {
         link.attr('data-main-menu-item', options.id);
       }
-
       link.text(I18n$1.t(options.translationKey));
-
       if (options.click) {
         $(link).click(options.click);
       }
-
       view.ui.menu.append(item);
     });
   }
 });
 
-function template$6(data) {
+function template$4(data) {
 var __t, __p = '';
 __p += '<div class="widget_type">\n</div>\n<a class="settings" title="' +
 ((__t = ( I18n.t('pageflow.editor.templates.widget_item.settings') )) == null ? '' : __t) +
@@ -4210,7 +4066,7 @@ return __p
 }
 
 var WidgetItemView = Marionette.Layout.extend({
-  template: template$6,
+  template: template$4,
   tagName: 'li',
   className: 'widget_item',
   regions: {
@@ -4247,14 +4103,14 @@ var WidgetItemView = Marionette.Layout.extend({
   }
 });
 
-function template$7(data) {
+function template$5(data) {
 var __p = '';
 __p += '<ol class="widgets">\n</ol>\n';
 return __p
 }
 
 var EditWidgetsView = Marionette.Layout.extend({
-  template: template$7,
+  template: template$5,
   ui: {
     widgets: '.widgets'
   },
@@ -4270,14 +4126,14 @@ var EditWidgetsView = Marionette.Layout.extend({
   }
 });
 
-function template$8(data) {
+function template$6(data) {
 var __p = '';
 __p += '<div class="image"></div>\n<div class="label"></div>\n';
 return __p
 }
 
 var BackgroundPositioningPreviewView = Marionette.ItemView.extend({
-  template: template$8,
+  template: template$6,
   className: 'preview',
   modelEvents: {
     change: 'update'
@@ -4308,14 +4164,14 @@ var BackgroundPositioningPreviewView = Marionette.ItemView.extend({
   }
 });
 
-function template$9(data) {
+function template$7(data) {
 var __p = '';
 __p += '<div class="container">\n  <div class="slider horizontal">\n  </div>\n  <div class="slider vertical">\n  </div>\n  <div class="percent horizontal">\n    <input type="number" min="0" max="100">\n    %\n  </div>\n  <div class="percent vertical">\n    <input type="number" min="0" max="100">\n    %\n  </div>\n</div>\n';
 return __p
 }
 
 var BackgroundPositioningSlidersView = Marionette.ItemView.extend({
-  template: template$9,
+  template: template$7,
   className: '',
   ui: {
     container: '.container',
@@ -4328,15 +4184,12 @@ var BackgroundPositioningSlidersView = Marionette.ItemView.extend({
     'mousedown img': function mousedownImg(event) {
       var view = this;
       view.saveFromEvent(event);
-
       function onMove(event) {
         view.saveFromEvent(event);
       }
-
       function onUp() {
         $('.background_positioning.dialog').off('mousemove', onMove).off('mouseup', onUp);
       }
-
       $('.background_positioning.dialog').on('mousemove', onMove).on('mouseup', onUp);
     },
     'dragstart img': function dragstartImg(event) {
@@ -4349,7 +4202,7 @@ var BackgroundPositioningSlidersView = Marionette.ItemView.extend({
   onRender: function onRender() {
     var view = this;
     var file = this.model.getReference(this.options.propertyName, this.options.filesCollection),
-        image = $('<img />').attr('src', file.getBackgroundPositioningImageUrl());
+      image = $('<img />').attr('src', file.getBackgroundPositioningImageUrl());
     this.ui.container.append(image);
     this.ui.sliderVertical.slider({
       orientation: 'vertical',
@@ -4396,7 +4249,23 @@ var BackgroundPositioningSlidersView = Marionette.ItemView.extend({
   }
 });
 
-function template$a(data) {
+var dialogView = {
+  events: {
+    'mousedown': function mousedown(event) {
+      if (!event.target.closest(".box")) {
+        this.close();
+      }
+    },
+    'click .close': function clickClose() {
+      this.close();
+    },
+    'click .box': function clickBox() {
+      return false;
+    }
+  }
+};
+
+function template$8(data) {
 var __t, __p = '';
 __p += '<div class="box">\n  <div class="content">\n    <h2 class="dialog-header">' +
 ((__t = ( I18n.t('pageflow.editor.templates.background_positioning.title') )) == null ? '' : __t) +
@@ -4413,7 +4282,7 @@ return __p
 }
 
 var BackgroundPositioningView = Marionette.ItemView.extend({
-  template: template$a,
+  template: template$8,
   className: 'background_positioning editor dialog',
   mixins: [dialogView],
   ui: {
@@ -4449,32 +4318,35 @@ var BackgroundPositioningView = Marionette.ItemView.extend({
   },
   createPreviews: function createPreviews() {
     var view = this;
-
-    _.each(view.previews, function (ratio, name) {
+    var previews = this.options.preview ? {
+      preview: this.options.preview
+    } : this.previews;
+    _.each(previews, function (ratio, name) {
       view.ui.previews.append(view.subview(new BackgroundPositioningPreviewView({
         model: view.transientModel,
         propertyName: view.options.propertyName,
         filesCollection: view.options.filesCollection,
         ratio: ratio,
         maxSize: 200,
-        label: I18n$1.t('pageflow.editor.templates.background_positioning.previews.' + name)
+        label: I18n$1.t('pageflow.editor.templates.background_positioning.previews.' + name, {
+          defaultValue: ''
+        })
       })).el);
     });
   }
 });
-
 BackgroundPositioningView.open = function (options) {
   app.dialogRegion.show(new BackgroundPositioningView(options));
 };
 
-function template$b(data) {
+function template$9(data) {
 var __p = '';
 __p += '<div class="label"></div>\n<a href="#"></a>\n';
 return __p
 }
 
 var DropDownButtonItemView = Marionette.ItemView.extend({
-  template: template$b,
+  template: template$9,
   tagName: 'li',
   className: 'drop_down_button_item',
   ui: {
@@ -4486,9 +4358,7 @@ var DropDownButtonItemView = Marionette.ItemView.extend({
       if (!this.model.get('disabled')) {
         this.model.selected();
       }
-
       event.preventDefault();
-
       if (this.model.get('kind') === 'checkBox' || this.model.get('kind') === 'radio') {
         event.stopPropagation();
       }
@@ -4499,7 +4369,6 @@ var DropDownButtonItemView = Marionette.ItemView.extend({
   },
   onRender: function onRender() {
     this.update();
-
     if (this.model.get('items')) {
       this.appendSubview(new this.options.listView({
         items: this.model.get('items')
@@ -4532,7 +4401,7 @@ var DropDownButtonItemListView = function DropDownButtonItemListView(options) {
   });
 };
 
-function template$c(data) {
+function template$a(data) {
 var __p = '';
 __p += '<button></button>\n\n<div class="drop_down_button_menu">\n</div>\n';
 return __p
@@ -4579,23 +4448,20 @@ return __p
  *
  * @class
  */
-
 var DropDownButtonView = Marionette.ItemView.extend({
-  template: template$c,
+  template: template$a,
   className: 'drop_down_button',
   ui: {
     button: '> button',
     menu: '.drop_down_button_menu'
   },
   events: function events() {
-    var _ref;
-
-    return _ref = {}, _defineProperty(_ref, this.options.openOnClick ? 'click' : 'mouseenter', function () {
+    return _defineProperty(_defineProperty({}, this.options.openOnClick ? 'click' : 'mouseenter', function () {
       this.positionMenu();
       this.showMenu();
-    }), _defineProperty(_ref, 'mouseleave', function mouseleave() {
+    }), 'mouseleave', function mouseleave() {
       this.scheduleHideMenu();
-    }), _ref;
+    });
   },
   onRender: function onRender() {
     var view = this;
@@ -4603,7 +4469,9 @@ var DropDownButtonView = Marionette.ItemView.extend({
     this.ui.button.toggleClass('has_icon_and_text', !!this.options.label);
     this.ui.button.toggleClass('has_icon_only', !this.options.label);
     this.ui.button.toggleClass('ellipsis_icon', !!this.options.ellipsisIcon);
+    this.ui.button.toggleClass('borderless', !!this.options.borderless);
     this.ui.button.text(this.options.label);
+    this.ui.button.attr('title', this.options.title);
     this.ui.button.addClass(this.options.buttonClassName);
     this.ui.menu.append(this.subview(new DropDownButtonItemListView({
       items: this.options.items
@@ -4642,12 +4510,10 @@ var DropDownButtonView = Marionette.ItemView.extend({
     if (DropDownButtonView.currentlyShowingMenu) {
       DropDownButtonView.currentlyShowingMenu.hideMenu();
     }
-
     DropDownButtonView.currentlyShowingMenu = this;
   },
   hideMenu: function hideMenu() {
     clearTimeout(this.hideMenuTimeout);
-
     if (!this.isClosed) {
       this.ui.button.removeClass('hover');
       this.ui.menu.removeClass('is_visible');
@@ -4658,7 +4524,44 @@ var DropDownButtonView = Marionette.ItemView.extend({
   }
 });
 
-function template$d(data) {
+function template$b(data) {
+var __t, __p = '';
+__p += '<div class="box">\n  <div class="content">\n    <h1 class="dialog-header"></h1>\n  </div>\n\n  <div class="footer">\n    <a href="" class="close">\n      ' +
+((__t = ( I18n.t('pageflow.editor.templates.file_settings_dialog.close') )) == null ? '' : __t) +
+'\n    </a>\n  </div>\n</div>\n';
+return __p
+}
+
+var FileSettingsDialogView = Marionette.ItemView.extend({
+  template: template$b,
+  className: 'file_settings_dialog editor dialog',
+  mixins: [dialogView],
+  ui: {
+    content: '.content',
+    header: '.dialog-header'
+  },
+  onRender: function onRender() {
+    this.ui.header.text(this.model.title());
+    this.tabsView = new TabsView({
+      model: this.model,
+      i18n: 'pageflow.editor.files.settings_dialog_tabs',
+      defaultTab: this.options.tabName
+    });
+    _.each(this.model.fileType().settingsDialogTabs, function (options) {
+      this.tabsView.tab(options.name, _.bind(function () {
+        return this.subview(new options.view(_.extend({
+          model: this.model
+        }, options.viewOptions)));
+      }, this));
+    }, this);
+    this.ui.content.append(this.subview(this.tabsView).el);
+  }
+});
+FileSettingsDialogView.open = function (options) {
+  app.dialogRegion.show(new FileSettingsDialogView(options));
+};
+
+function template$c(data) {
 var __p = '';
 __p += '<div class="pictogram"></div>\n';
 return __p
@@ -4666,7 +4569,7 @@ return __p
 
 var FileThumbnailView = Marionette.ItemView.extend({
   className: 'file_thumbnail',
-  template: template$d,
+  template: template$c,
   modelEvents: {
     'change:state': 'update'
   },
@@ -4679,7 +4582,6 @@ var FileThumbnailView = Marionette.ItemView.extend({
   update: function update() {
     if (this.model) {
       var stage = this.model.currentStage();
-
       if (stage) {
         this.setStageClassName(stage.get('name'));
         this.ui.pictogram.toggleClass('action_required', stage.get('action_required'));
@@ -4687,7 +4589,6 @@ var FileThumbnailView = Marionette.ItemView.extend({
       } else {
         this.ui.pictogram.removeClass(this.model.stages.pluck('name').join(' '));
       }
-
       this.ui.pictogram.addClass(this.model.thumbnailPictogram);
       this.$el.css('background-image', this._imageUrl() ? 'url(' + this._imageUrl() + ')' : '');
       this.$el.removeClass('empty').toggleClass('always_picogram', !!this.model.thumbnailPictogram).toggleClass('ready', this.model.isReady());
@@ -4714,7 +4615,6 @@ var FileThumbnailView = Marionette.ItemView.extend({
  *
  * @class
  */
-
 var FileInputView = Marionette.ItemView.extend({
   mixins: [inputView],
   template: function template() {
@@ -4747,19 +4647,15 @@ var FileInputView = Marionette.ItemView.extend({
       positioning: true,
       textTrackFiles: state.textTrackFiles
     }, this.options);
-
     if (typeof this.options.collection === 'string') {
       this.options.collection = state.entry.getFileCollection(editor.fileTypes.findByCollectionName(this.options.collection));
     }
-
     this.textTrackMenuItems = new Backbone.Collection();
   },
   onRender: function onRender() {
     this.update();
     this.listenTo(this.model, 'change:' + this.options.propertyName, this.update);
-
     var dropDownMenuItems = this._dropDownMenuItems();
-
     if (dropDownMenuItems.length) {
       this.appendSubview(new DropDownButtonView({
         items: dropDownMenuItems,
@@ -4767,26 +4663,27 @@ var FileInputView = Marionette.ItemView.extend({
         openOnClick: true
       }));
     }
+    this.setupBooleanAttributeBinding('positioning', this._updatePositioning);
   },
   update: function update() {
     var file = this._getFile();
-
     this._listenToNestedTextTrackFiles(file);
-
     this.$el.toggleClass('is_unset', !file);
-    this.ui.fileName.text(file ? file.get('file_name') : I18n$1.t('pageflow.ui.views.inputs.file_input_view.none'));
+    this.ui.fileName.text(file ? file.title() : I18n$1.t('pageflow.ui.views.inputs.file_input_view.none'));
     this.subview(new FileThumbnailView({
       el: this.ui.thumbnail,
       model: file
     }));
   },
+  _updatePositioning: function _updatePositioning(positioning) {
+    if (this.positioningMenuItem) {
+      this.positioningMenuItem.set('hidden', !positioning);
+    }
+  },
   _dropDownMenuItems: function _dropDownMenuItems() {
     var _this = this;
-
     var file = this._getFile(file);
-
     var items = new Backbone.Collection();
-
     if (this.options.defaultTextTrackFilePropertyName && file) {
       items.add({
         name: 'default_text_track',
@@ -4794,23 +4691,28 @@ var FileInputView = Marionette.ItemView.extend({
         items: this.textTrackMenuItems
       });
     }
-
-    if (this.options.positioning && file && file.isPositionable()) {
-      items.add(new FileInputView.EditBackgroundPositioningMenuItem({
+    if (file && file.isPositionable()) {
+      this.positioningMenuItem = new FileInputView.EditBackgroundPositioningMenuItem({
         name: 'edit_background_positioning',
         label: I18n$1.t('pageflow.editor.views.inputs.file_input.edit_background_positioning')
       }, {
         inputModel: this.model,
         propertyName: this.options.propertyName,
-        filesCollection: this.options.collection
-      }));
+        filesCollection: this.options.collection,
+        positioningOptions: this.options.positioningOptions
+      });
+      items.add(this.positioningMenuItem);
     }
-
     if (file) {
       _.each(this.options.dropDownMenuItems, function (item) {
         items.add(_this._createCustomMenuItem(file, item));
       });
-
+      if (this.options.dropDownMenuName) {
+        var customItems = editor.dropDownMenuItems.findAllByMenuName(this.options.dropDownMenuName);
+        _.each(customItems, function (item) {
+          items.add(_this._createCustomMenuItem(file, item));
+        });
+      }
       items.add(new FileInputView.EditFileSettingsMenuItem({
         name: 'edit_file_settings',
         label: I18n$1.t('pageflow.editor.views.inputs.file_input.edit_file_settings')
@@ -4818,18 +4720,15 @@ var FileInputView = Marionette.ItemView.extend({
         file: file
       }));
     }
-
     return items;
   },
   _createCustomMenuItem: function _createCustomMenuItem(file, item) {
     var _this2 = this;
-
     var options = {
       inputModel: this.model,
       propertyName: this.options.propertyName,
       file: file
     };
-
     if (typeof item === 'function') {
       return new item({}, options);
     } else {
@@ -4851,11 +4750,9 @@ var FileInputView = Marionette.ItemView.extend({
       this.stopListening(this.textTrackFiles);
       this.textTrackFiles = null;
     }
-
     if (file && this.options.defaultTextTrackFilePropertyName) {
       this.textTrackFiles = file.nestedFiles(this.options.textTrackFiles);
       this.listenTo(this.textTrackFiles, 'add remove', this._updateTextTrackMenuItems);
-
       this._updateTextTrackMenuItems();
     }
   },
@@ -4879,11 +4776,15 @@ FileInputView.EditBackgroundPositioningMenuItem = Backbone.Model.extend({
     this.options = options;
   },
   selected: function selected() {
-    BackgroundPositioningView.open({
+    var positioningOptions = this.options.positioningOptions;
+    if (typeof positioningOptions === 'function') {
+      positioningOptions = positioningOptions();
+    }
+    BackgroundPositioningView.open(_objectSpread2({
       model: this.options.inputModel,
       propertyName: this.options.propertyName,
       filesCollection: this.options.filesCollection
-    });
+    }, positioningOptions));
   }
 });
 FileInputView.CustomMenuItem = Backbone.Model.extend({
@@ -4912,11 +4813,9 @@ FileInputView.DefaultTextTrackFileMenuItem = Backbone.Model.extend({
   initialize: function initialize(attributes, options) {
     this.options = options;
     this.listenTo(this.options.inputModel, 'change:' + this.options.propertyName, this.update);
-
     if (this.options.textTrackFile) {
       this.listenTo(this.options.textTrackFile, 'change:configuration', this.update);
     }
-
     this.update();
   },
   update: function update() {
@@ -4937,14 +4836,14 @@ FileInputView.DefaultTextTrackFileMenuItem = Backbone.Model.extend({
   }
 });
 
-function template$e(data) {
+function template$d(data) {
 var __p = '';
 __p += '<div class="spinner">\n  <div class="rect1"></div>\n  <div class="rect2"></div>\n  <div class="rect3"></div>\n  <div class="rect4"></div>\n  <div class="rect5"></div>\n</div>\n';
 return __p
 }
 
 var LoadingView = Marionette.ItemView.extend({
-  template: template$e,
+  template: template$d,
   className: 'loading',
   tagName: 'li'
 });
@@ -4967,7 +4866,7 @@ var selectableView = {
   }
 };
 
-function template$f(data) {
+function template$e(data) {
 var __t, __p = '';
 __p += '<span class="theme_name"></span>\n<span class="button_or_checkmark">\n  <p class="theme_in_use"></p>\n  <a class="use_theme">' +
 ((__t = ( I18n.t('pageflow.editor.templates.theme.use') )) == null ? '' : __t) +
@@ -4977,7 +4876,7 @@ return __p
 
 var ThemeItemView = Marionette.ItemView.extend({
   tagName: 'li',
-  template: template$f,
+  template: template$e,
   className: 'theme_item',
   mixins: [selectableView],
   selectionAttribute: 'theme',
@@ -4996,11 +4895,9 @@ var ThemeItemView = Marionette.ItemView.extend({
   onRender: function onRender() {
     this.$el.data('themeName', this.model.get('name'));
     this.ui.themeName.text(this.model.title());
-
     if (this.inUse()) {
       this.ui.inUseRegion.text('✓');
     }
-
     this.ui.useButton.toggle(!this.inUse());
   },
   inUse: function inUse() {
@@ -5008,7 +4905,7 @@ var ThemeItemView = Marionette.ItemView.extend({
   }
 });
 
-function template$g(data) {
+function template$f(data) {
 var __t, __p = '';
 __p += '<div class="box">\n  <h1 class="dialog-header">\n    ' +
 ((__t = ( I18n.t('pageflow.editor.templates.change_theme_dialog.header') )) == null ? '' : __t) +
@@ -5023,7 +4920,7 @@ return __p
 }
 
 var ChangeThemeDialogView = Marionette.ItemView.extend({
-  template: template$g,
+  template: template$f,
   className: 'change_theme dialog editor',
   mixins: [dialogView],
   ui: {
@@ -5041,7 +4938,6 @@ var ChangeThemeDialogView = Marionette.ItemView.extend({
       if (!this.selection.get('theme')) {
         this.selection.set('theme', themeInUse);
       }
-
       this.update();
     });
   },
@@ -5075,14 +4971,12 @@ var ChangeThemeDialogView = Marionette.ItemView.extend({
     this.ui.previewHeaderThemeName.text(selectedTheme.title());
   }
 });
-
 ChangeThemeDialogView.changeTheme = function (options) {
   return $.Deferred(function (deferred) {
     options.onUse = function (theme) {
       deferred.resolve(theme);
       view.close();
     };
-
     var view = new ChangeThemeDialogView(options);
     view.on('close', function () {
       deferred.reject();
@@ -5091,14 +4985,14 @@ ChangeThemeDialogView.changeTheme = function (options) {
   }).promise();
 };
 
-function template$h(data) {
+function template$g(data) {
 var __p = '';
 __p += '\n';
 return __p
 }
 
 var StaticThumbnailView = Marionette.ItemView.extend({
-  template: template$h,
+  template: template$g,
   className: 'static_thumbnail',
   modelEvents: {
     'change:configuration': 'update'
@@ -5119,7 +5013,6 @@ var StaticThumbnailView = Marionette.ItemView.extend({
  *
  * @class
  */
-
 var ModelThumbnailView = Marionette.View.extend({
   className: 'model_thumbnail',
   modelEvents: {
@@ -5133,11 +5026,9 @@ var ModelThumbnailView = Marionette.View.extend({
     if (this.model) {
       if (_.isFunction(this.model.thumbnailFile)) {
         var file = this.model && this.model.thumbnailFile();
-
         if (this.thumbnailView && this.currentFileThumbnail == file) {
           return;
         }
-
         this.currentFileThumbnail = file;
         this.newThumbnailView = new FileThumbnailView({
           model: file,
@@ -5150,11 +5041,9 @@ var ModelThumbnailView = Marionette.View.extend({
         });
       }
     }
-
     if (this.thumbnailView) {
       this.thumbnailView.close();
     }
-
     if (this.model) {
       this.thumbnailView = this.subview(this.newThumbnailView);
       this.$el.append(this.thumbnailView.el);
@@ -5162,7 +5051,7 @@ var ModelThumbnailView = Marionette.View.extend({
   }
 });
 
-function template$i(data) {
+function template$h(data) {
 var __p = '';
 __p += '<label>\n  <span class="name"></span>\n  <span class="inline_help"></span>\n</label>\n<div class="title"></div>\n<button class="unset"></button>\n<button class="choose"></button>\n';
 return __p
@@ -5173,12 +5062,9 @@ return __p
  *
  * @class
  */
-
-var ReferenceInputView = Marionette.ItemView.extend(
-/** @lends ReferenceInputView.prototype */
-{
+var ReferenceInputView = Marionette.ItemView.extend( /** @lends ReferenceInputView.prototype */{
   mixins: [inputView],
-  template: template$i,
+  template: template$h,
   className: 'reference_input',
   ui: {
     title: '.title',
@@ -5206,7 +5092,6 @@ var ReferenceInputView = Marionette.ItemView.extend(
     this.update();
     this.listenTo(this.model, 'change:' + this.options.propertyName, this.update);
   },
-
   /**
    * Returns a promise for some identifying attribute.
    *
@@ -5236,18 +5121,15 @@ var ReferenceInputView = Marionette.ItemView.extend(
     if (this.isClosed) {
       return;
     }
-
     var target = this.getTarget(this.model.get(this.options.propertyName));
     this.ui.title.text(target ? target.title() : I18n$1.t('pageflow.editor.views.inputs.reference_input_view.none'));
     this.ui.unsetButton.toggle(!!target && !this.options.hideUnsetButton);
     this.ui.unsetButton.attr('title', this.options.unsetButtonTitle || I18n$1.t('pageflow.editor.views.inputs.reference_input_view.unset'));
     this.ui.chooseButton.attr('title', this.options.chooseButtonTitle || I18n$1.t('pageflow.editor.views.inputs.reference_input_view.choose'));
     this.updateDisabledAttribute(this.ui.buttons);
-
     if (this.thumbnailView) {
       this.thumbnailView.close();
     }
-
     this.thumbnailView = this.subview(this.createThumbnailView(target));
     this.ui.title.before(this.thumbnailView.el);
   }
@@ -5277,7 +5159,7 @@ var ThemeInputView = ReferenceInputView.extend({
   }
 });
 
-function template$j(data) {
+function template$i(data) {
 var __t, __p = '';
 __p += '<a class="back">' +
 ((__t = ( I18n.t('pageflow.editor.templates.edit_meta_data.outline') )) == null ? '' : __t) +
@@ -5290,7 +5172,7 @@ return __p
 }
 
 var EditMetaDataView = Marionette.Layout.extend({
-  template: template$j,
+  template: template$i,
   className: 'edit_meta_data',
   mixins: [failureIndicatingView],
   regions: {
@@ -5340,15 +5222,20 @@ var EditMetaDataView = Marionette.Layout.extend({
       });
     });
     configurationEditor.tab('widgets', function () {
+      var _this = this;
       editor.entryType.appearanceInputs && editor.entryType.appearanceInputs(this, {
         entry: entry,
         site: state.site
       });
+      editor.appearanceInputsCallbacks.forEach(function (callback) {
+        callback(_this, {
+          entry: entry
+        });
+      });
       entry.widgets && this.view(EditWidgetsView, {
         model: entry,
         widgetTypes: editor.widgetTypes
       });
-
       if (features.isEnabled && features.isEnabled('selectable_themes') && state.themes.length > 1) {
         this.view(ThemeInputView, {
           themes: state.themes,
@@ -5390,7 +5277,7 @@ var EditMetaDataView = Marionette.Layout.extend({
   }
 });
 
-function template$k(data) {
+function template$j(data) {
 var __t, __p = '';
 __p += '<a class="back">' +
 ((__t = ( I18n.t('pageflow.editor.templates.edit_widget.back') )) == null ? '' : __t) +
@@ -5399,7 +5286,7 @@ return __p
 }
 
 var EditWidgetView = Marionette.ItemView.extend({
-  template: template$k,
+  template: template$j,
   className: 'edit_widget',
   events: {
     'click a.back': function clickABack() {
@@ -5418,6 +5305,7 @@ var EditWidgetView = Marionette.ItemView.extend({
   onRender: function onRender() {
     var configurationEditor = this.model.widgetType().createConfigurationEditorView({
       model: this.model.configuration,
+      entry: this.options.entry,
       tab: this.options.tab
     });
     this.appendSubview(configurationEditor);
@@ -5431,7 +5319,7 @@ var loadable = modelLifecycleTrackingView({
   }
 });
 
-function template$l(data) {
+function template$k(data) {
 var __p = '';
 __p += '<span class="file_thumbnail"></span>\n\n<span class="file_name"></span>\n';
 return __p
@@ -5439,7 +5327,7 @@ return __p
 
 var ExplorerFileItemView = Marionette.ItemView.extend({
   tagName: 'li',
-  template: template$l,
+  template: template$k,
   mixins: [loadable, selectableView],
   selectionAttribute: 'file',
   ui: {
@@ -5467,23 +5355,22 @@ var ExplorerFileItemView = Marionette.ItemView.extend({
     if (this.isDisabled()) {
       this.$el.addClass('disabled');
     }
-
     this.$el.attr('data-id', this.model.id);
-    this.ui.fileName.text(this.model.get('file_name') || '(Unbekannt)');
+    this.ui.fileName.text(this.model.title());
   },
   isDisabled: function isDisabled() {
     return this.options.disabledIds && _.contains(this.options.disabledIds, this.model.get('id'));
   }
 });
 
-function template$m(data) {
+function template$l(data) {
 var __p = '';
 __p += '<a href="">\n  <span class="title"></span>\n</a>\n';
 return __p
 }
 
 var OtherEntryItemView = Marionette.ItemView.extend({
-  template: template$m,
+  template: template$l,
   className: 'other_entry_item',
   tagName: 'li',
   mixins: [selectableView],
@@ -5498,7 +5385,7 @@ var OtherEntryItemView = Marionette.ItemView.extend({
   }
 });
 
-function template$n(data) {
+function template$m(data) {
 var __t, __p = '';
 __p +=
 ((__t = ( I18n.t('pageflow.editor.templates.other_entries_blank_slate.none_available') )) == null ? '' : __t) +
@@ -5524,7 +5411,7 @@ var OtherEntriesCollectionView = Marionette.View.extend({
         selection: this.options.selection
       },
       blankSlateViewConstructor: Marionette.ItemView.extend({
-        template: template$n,
+        template: template$m,
         tagName: 'li',
         className: 'blank_slate'
       }),
@@ -5535,7 +5422,7 @@ var OtherEntriesCollectionView = Marionette.View.extend({
   }
 });
 
-function template$o(data) {
+function template$n(data) {
 var __t, __p = '';
 __p += '<div class="box">\n  <h1 class="dialog-header">\n    ' +
 ((__t = ( I18n.t('pageflow.editor.templates.files_explorer.reuse_files') )) == null ? '' : __t) +
@@ -5564,7 +5451,7 @@ return __p
 }
 
 var FilesExplorerView = Marionette.ItemView.extend({
-  template: template$o,
+  template: template$n,
   className: 'files_explorer editor dialog',
   mixins: [dialogView],
   ui: {
@@ -5577,7 +5464,6 @@ var FilesExplorerView = Marionette.ItemView.extend({
       if (this.options.callback) {
         this.options.callback(this.selection.get('entry'), this.selection.get('file'));
       }
-
       this.close();
     }
   },
@@ -5585,8 +5471,9 @@ var FilesExplorerView = Marionette.ItemView.extend({
     this.selection = new Backbone.Model();
     this.listenTo(this.selection, 'change:entry', function () {
       this.tabsView.refresh();
-    }); // check if the OK button should be enabled.
+    });
 
+    // check if the OK button should be enabled.
     this.listenTo(this.selection, 'change', function (selection, options) {
       this.ui.okButton.prop('disabled', !this.selection.get('file'));
     });
@@ -5612,7 +5499,6 @@ var FilesExplorerView = Marionette.ItemView.extend({
   tab: function tab(fileType) {
     this.tabsView.tab(fileType.collectionName, _.bind(function () {
       var collection = this._collection(fileType);
-
       var disabledIds = state.entry.getFileCollection(fileType).pluck('id');
       return new CollectionView({
         tagName: 'ul',
@@ -5629,15 +5515,13 @@ var FilesExplorerView = Marionette.ItemView.extend({
   },
   _collection: function _collection(fileType) {
     var collection,
-        entry = this.selection.get('entry');
-
+      entry = this.selection.get('entry');
     if (entry) {
       collection = entry.getFileCollection(fileType);
       collection.fetch();
     } else {
       collection = new Backbone.Collection();
     }
-
     return collection;
   },
   _blankSlateConstructor: function _blankSlateConstructor() {
@@ -5646,12 +5530,11 @@ var FilesExplorerView = Marionette.ItemView.extend({
     });
   }
 });
-
 FilesExplorerView.open = function (options) {
   app.dialogRegion.show(new FilesExplorerView(options));
 };
 
-function template$p(data) {
+function template$o(data) {
 var __p = '';
 __p += '<th></th>\n<td></td>';
 return __p
@@ -5659,7 +5542,7 @@ return __p
 
 var FileMetaDataItemView = Marionette.ItemView.extend({
   tagName: 'tr',
-  template: template$p,
+  template: template$o,
   ui: {
     label: 'th',
     value: 'td'
@@ -5682,7 +5565,7 @@ var FileMetaDataItemView = Marionette.ItemView.extend({
   }
 });
 
-function template$q(data) {
+function template$p(data) {
 var __p = '';
 __p += '<p class="percent"></p>\n<p class="description"></p>\n<p class="error_message"></p>';
 return __p
@@ -5691,7 +5574,7 @@ return __p
 var FileStageItemView = Marionette.ItemView.extend({
   tagName: 'li',
   className: 'file_stage_item',
-  template: template$q,
+  template: template$p,
   ui: {
     description: '.description',
     percent: '.percent',
@@ -5703,7 +5586,6 @@ var FileStageItemView = Marionette.ItemView.extend({
   onRender: function onRender() {
     this.update();
     this.$el.addClass(this.model.get('name'));
-
     if (this.options.standAlone) {
       this.$el.addClass('stand_alone');
     } else {
@@ -5712,13 +5594,11 @@ var FileStageItemView = Marionette.ItemView.extend({
   },
   update: function update() {
     this.ui.description.text(this.model.localizedDescription());
-
     if (typeof this.model.get('progress') === 'number' && this.model.get('active')) {
       this.ui.percent.text(this.model.get('progress') + '%');
     } else {
       this.ui.percent.text('');
     }
-
     this.ui.errorMessage.toggle(!!this.model.get('error_message')).text(this._translatedErrorMessage());
     this.$el.toggleClass('active', this.model.get('active'));
     this.$el.toggleClass('finished', this.model.get('finished'));
@@ -5732,21 +5612,96 @@ var FileStageItemView = Marionette.ItemView.extend({
   }
 });
 
+function template$q(data) {
+var __t, __p = '';
+__p += '<span class="value"></span>\n<button class="edit" type="button" title="' +
+((__t = ( I18n.t('pageflow.editor.templates.file_meta_data_item_value_view.edit') )) == null ? '' : __t) +
+'">\n</button>\n\n';
+return __p
+}
+
+/**
+ * Base class for views used as `valueView` for file type meta data
+ * attributes.
+ *
+ * @param {Object} [options]
+ *
+ * @param {string} [options.name]
+ *   Name of the meta data item used in translation keys.
+ *
+ * @param {string} [options.settingsDialogTabLink]
+ *   Dispaly a link to open the specified tab of the file settings
+ *   dialog.
+ *
+ * @since 12.0
+ *
+ * @class
+ */
+var FileMetaDataItemValueView = Marionette.ItemView.extend({
+  template: template$q,
+  className: 'value_wrapper',
+  ui: {
+    value: '.value',
+    editLink: '.edit'
+  },
+  events: {
+    'click .edit': function clickEdit() {
+      FileSettingsDialogView.open({
+        model: this.model,
+        tabName: this.options.settingsDialogTabLink
+      });
+    }
+  },
+  modelEvents: {
+    'change': 'toggleEditLink'
+  },
+  onRender: function onRender() {
+    this.listenTo(this.model, 'change:' + this.options.name, this.update);
+    this.toggleEditLink();
+    this.update();
+  },
+  update: function update() {
+    this.ui.value.text(this.getText() || I18n$1.t('pageflow.editor.views.file_meta_data_item_value_view.blank'));
+  },
+  getText: function getText() {
+    throw new Error('Not implemented');
+  },
+  toggleEditLink: function toggleEditLink() {
+    this.ui.editLink.toggle(!!this.options.settingsDialogTabLink && !this.model.isNew());
+  }
+});
+
+var TextFileMetaDataItemValueView = FileMetaDataItemValueView.extend({
+  getText: function getText() {
+    var model;
+    if (this.options.fromConfiguration) {
+      model = this.model.configuration;
+    } else {
+      model = this.model;
+    }
+    var value = model.get(this.options.name);
+    if (value && this.options.formatValue) {
+      return this.options.formatValue(value);
+    }
+    return value;
+  }
+});
+
 function template$r(data) {
 var __t, __p = '';
-__p += '<span class="file_thumbnail"></span>\n\n<span class="file_name"></span>\n<a class="select">' +
+__p += '<button class="file_thumbnail_button" type="button">\n  <span class="file_thumbnail"></span>\n</button>\n\n<span class="file_name"></span>\n<button class="select" type="button">' +
 ((__t = ( I18n.t('pageflow.editor.templates.file_item.select') )) == null ? '' : __t) +
-'</a>\n\n<div class="actions">\n  <a class="settings" title="' +
+'</button>\n\n<div class="actions">\n  <button class="settings" type="button" title="' +
 ((__t = ( I18n.t('pageflow.editor.templates.file_item.settings') )) == null ? '' : __t) +
-'"></a>\n  <a class="confirm" title="' +
+'"></button>\n  <button class="confirm" type="button" title="' +
 ((__t = ( I18n.t('pageflow.editor.templates.file_item.confirm') )) == null ? '' : __t) +
-'"></a>\n  <a class="retry" title="' +
+'"></button>\n  <button class="retry" type="button" title="' +
 ((__t = ( I18n.t('pageflow.editor.templates.file_item.retry') )) == null ? '' : __t) +
-'"></a>\n  <a class="remove" title="' +
+'"></button>\n  <button class="remove" type="button" title="' +
 ((__t = ( I18n.t('pageflow.editor.templates.file_item.destroy') )) == null ? '' : __t) +
-'"></a>\n  <a class="cancel" title="' +
+'"></button>\n  <button class="cancel" type="button" title="' +
 ((__t = ( I18n.t('pageflow.editor.templates.file_item.cancel') )) == null ? '' : __t) +
-'"></a>\n</div>\n\n<div class="details">\n  <ul class="file_stage_items"></ul>\n\n  <div class="file_meta_data">\n    <table cellpadding="0" cellspacing="0">\n      <tbody class="attributes">\n      </tbody>\n      <tbody class="downloads">\n        <tr>\n          <th>' +
+'"></button>\n</div>\n\n<div class="details">\n  <ul class="file_stage_items"></ul>\n\n  <div class="file_meta_data">\n    <table cellpadding="0" cellspacing="0">\n      <tbody class="attributes">\n      </tbody>\n      <tbody class="downloads">\n        <tr>\n          <th>' +
 ((__t = ( I18n.t('pageflow.editor.templates.file_item.source') )) == null ? '' : __t) +
 '</th>\n          <td><a class="original" href="#" download target="_blank">' +
 ((__t = ( I18n.t('pageflow.editor.templates.file_item.download') )) == null ? '' : __t) +
@@ -5767,23 +5722,15 @@ var FileItemView = Marionette.ItemView.extend({
     cancelButton: '.cancel',
     retryButton: '.retry',
     thumbnail: '.file_thumbnail',
+    thumbnailButton: '.file_thumbnail_button',
     stageItems: '.file_stage_items',
+    details: '.details',
     metaData: 'tbody.attributes',
     downloads: 'tbody.downloads',
     downloadLink: 'a.original'
   },
   events: {
-    'click .select': function clickSelect() {
-      var result = this.options.selectionHandler.call(this.model);
-
-      if (result !== false) {
-        editor.navigate(this.options.selectionHandler.getReferer(), {
-          trigger: true
-        });
-      }
-
-      return false;
-    },
+    'click .select': 'select',
     'click .settings': function clickSettings() {
       FileSettingsDialogView.open({
         model: this.model
@@ -5793,13 +5740,28 @@ var FileItemView = Marionette.ItemView.extend({
     'click .confirm': 'confirm',
     'click .remove': 'destroy',
     'click .retry': 'retry',
-    'click .file_thumbnail': 'toggleExpanded'
+    'click .file_thumbnail_button': 'toggleExpanded'
+  },
+  initialize: function initialize() {
+    var _this = this;
+    if (this.options.listHighlight) {
+      this.listenTo(this.options.listHighlight, 'change:currentId change:active', function () {
+        if (_this.updateHighlight()) {
+          _this.el.scrollIntoView({
+            block: 'nearest',
+            behavior: 'smooth'
+          });
+        }
+      });
+      this.listenTo(this.options.listHighlight, 'selected:' + this.model.id, this.select);
+    }
   },
   modelEvents: {
     'change': 'update'
   },
   onRender: function onRender() {
     this.update();
+    this.setupAriaAttributes();
     this.subview(new FileThumbnailView({
       el: this.ui.thumbnail,
       model: this.model
@@ -5809,20 +5771,19 @@ var FileItemView = Marionette.ItemView.extend({
       collection: this.model.stages,
       itemViewConstructor: FileStageItemView
     }));
-
     _.each(this.metaDataViews(), function (view) {
       this.ui.metaData.append(this.subview(view).el);
     }, this);
+    this.updateHighlight();
   },
   update: function update() {
     if (this.isClosed) {
       return;
     }
-
     this.$el.attr('data-id', this.model.id);
-    this.ui.fileName.text(this.model.get('file_name') || '(Unbekannt)');
-    this.ui.downloadLink.attr('href', this.model.get('original_url'));
-    this.ui.downloads.toggle(this.model.isUploaded() && !_.isEmpty(this.model.get('original_url')));
+    this.ui.fileName.text(this.model.title());
+    this.ui.downloadLink.attr('href', this.model.get('download_url'));
+    this.ui.downloads.toggle(this.model.isUploaded() && !_.isEmpty(this.model.get('download_url')));
     this.ui.selectButton.toggle(!!this.options.selectionHandler);
     this.ui.settingsButton.toggle(!this.model.isNew());
     this.ui.cancelButton.toggle(this.model.isUploading());
@@ -5840,7 +5801,6 @@ var FileItemView = Marionette.ItemView.extend({
           valueView: TextFileMetaDataItemValueView
         };
       }
-
       return new FileMetaDataItemView(_.extend({
         model: model
       }, options));
@@ -5850,34 +5810,166 @@ var FileItemView = Marionette.ItemView.extend({
     this.$el.toggleClass('expanded');
     this.updateToggleTitle();
   },
+  setupAriaAttributes: function setupAriaAttributes() {
+    var uniqueId = this.model.get('id') || this.model.cid;
+    var detailsId = 'file-details-' + uniqueId;
+    this.ui.thumbnailButton.attr('aria-controls', detailsId);
+    this.ui.details.attr('id', detailsId);
+  },
   updateToggleTitle: function updateToggleTitle() {
-    this.ui.thumbnail.attr('title', this.$el.hasClass('expanded') ? 'Details ausblenden' : 'Details einblenden');
+    var isExpanded = this.$el.hasClass('expanded');
+    var titleText = I18n$1.t(isExpanded ? 'pageflow.editor.templates.file_item.collapse_details' : 'pageflow.editor.templates.file_item.expand_details');
+    this.ui.thumbnailButton.attr('aria-expanded', isExpanded.toString());
+    this.ui.thumbnailButton.attr('title', titleText);
+    this.ui.thumbnailButton.attr('aria-label', titleText);
   },
   destroy: function destroy() {
     if (confirm("Datei wirklich wirklich löschen?")) {
       this.model.destroy();
     }
   },
-  cancel: function cancel() {
-    this.model.cancelUpload();
+  cancel: function cancel() {
+    this.model.cancelUpload();
+  },
+  confirm: function confirm() {
+    editor.navigate('/confirmable_files?type=' + this.model.modelName + '&id=' + this.model.id, {
+      trigger: true
+    });
+  },
+  retry: function retry() {
+    this.model.retry();
+  },
+  select: function select() {
+    var result = this.options.selectionHandler.call(this.model);
+    if (result !== false) {
+      editor.navigate(this.options.selectionHandler.getReferer(), {
+        trigger: true
+      });
+    }
+    return false;
+  },
+  updateHighlight: function updateHighlight() {
+    if (!this.options.listHighlight) {
+      return false;
+    }
+    var highlighted = this.options.listHighlight.get('currentId') === this.model.id && this.options.listHighlight.get('active');
+    this.$el.toggleClass('keyboard_highlight', highlighted);
+    this.$el.attr('aria-selected', highlighted ? 'true' : null);
+    return highlighted;
+  }
+});
+
+function template$s(data) {
+var __t, __p = '';
+__p += '<input type="text"\n       class="list_search_field-term"\n       aria-label="' +
+((__t = ( I18n.t('pageflow.editor.templates.list_search_field.placeholder') )) == null ? '' : __t) +
+'" />\n<span class="list_search_field-placeholder">\n  ' +
+((__t = ( I18n.t('pageflow.editor.templates.list_search_field.hint',
+             {hotkey: '<kbd>/</kbd>'}) )) == null ? '' : __t) +
+'\n</span>\n<a href=""\n   class="list_search_field-reset"\n   title="' +
+((__t = ( I18n.t('pageflow.editor.templates.list_search_field.reset') )) == null ? '' : __t) +
+'"></a>\n';
+return __p
+}
+
+var ListSearchFieldView = Marionette.ItemView.extend({
+  template: template$s,
+  className: 'list_search_field',
+  ui: {
+    input: '.list_search_field-term'
+  },
+  events: {
+    'input .list_search_field-term': 'changeTerm',
+    'click .list_search_field-reset': 'reset',
+    'keydown .list_search_field-term': 'handleInputKeyDown',
+    'focus .list_search_field-term': 'handleInputFocus',
+    'blur .list_search_field-term': 'handleInputBlur'
+  },
+  initialize: function initialize() {
+    var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    this.search = options.search;
+    this.listHighlight = options.listHighlight;
+  },
+  onRender: function onRender() {
+    var _this = this;
+    this.toggleReset();
+    if (this.options.ariaControlsId) {
+      this.ui.input.attr('aria-controls', this.options.ariaControlsId);
+    }
+    this.handleDocumentKeyDown = this.handleDocumentKeyDown.bind(this);
+    $(document).on('keydown', this.handleDocumentKeyDown);
+    if (this.options.autoFocus) {
+      setTimeout(function () {
+        return _this.ui.input.focus();
+      }, 0);
+    }
+  },
+  onClose: function onClose() {
+    $(document).off('keydown', this.handleDocumentKeyDown);
+  },
+  changeTerm: function changeTerm() {
+    this.search.set('term', this.ui.input.val());
+    this.toggleReset();
+  },
+  reset: function reset(event) {
+    this.ui.input.val('');
+    this.search.set('term', '');
+    this.toggleReset();
+    this.ui.input.focus();
+    if (event) {
+      event.preventDefault();
+    }
+  },
+  handleDocumentKeyDown: function handleDocumentKeyDown(event) {
+    var active = document.activeElement;
+    if (event.key === '/' && !/input|textarea/i.test(active.tagName)) {
+      this.ui.input.focus();
+      event.preventDefault();
+    }
+  },
+  handleInputKeyDown: function handleInputKeyDown(event) {
+    if (event.key === 'Escape') {
+      if (this.search.get('term')) {
+        this.reset();
+      } else {
+        this.ui.input.blur();
+      }
+    } else if (this.listHighlight) {
+      if (event.key === 'ArrowDown') {
+        this.listHighlight.next();
+        event.preventDefault();
+      } else if (event.key === 'ArrowUp') {
+        this.listHighlight.previous();
+        event.preventDefault();
+      } else if (event.key === 'Enter') {
+        this.listHighlight.triggerSelect();
+      }
+    }
+  },
+  handleInputFocus: function handleInputFocus() {
+    this.$el.addClass('focus');
+    if (this.listHighlight) {
+      this.listHighlight.set('active', true);
+    }
   },
-  confirm: function confirm() {
-    editor.navigate('/confirmable_files?type=' + this.model.modelName + '&id=' + this.model.id, {
-      trigger: true
-    });
+  handleInputBlur: function handleInputBlur() {
+    this.$el.removeClass('focus');
+    if (this.listHighlight) {
+      this.listHighlight.set('active', false);
+    }
   },
-  retry: function retry() {
-    this.model.retry();
+  toggleReset: function toggleReset() {
+    this.$el.toggleClass('has_value', !!this.search.get('term'));
   }
 });
 
-function template$s(data) {
+function template$t(data) {
 var __t, __p = '';
 __p += '<div class="filtered_files-banner">\n  <span class="filtered_files-banner_prefix">\n    ' +
 ((__t = ( I18n.t('pageflow.editor.views.filtered_files_view.banner_prefix') )) == null ? '' : __t) +
 '\n  </span>\n  <span class="filtered_files-filter_name"></span>\n  <a href=""\n     class="filtered_files-reset_filter"\n     title="' +
 ((__t = ( I18n.t('pageflow.editor.views.filtered_files_view.reset_filter') )) == null ? '' : __t) +
-'">\n  </a>\n</div>\n';
+'">\n  </a>\n</div>\n<div class="filtered_files-filter_bar">\n</div>\n';
 return __p
 }
 
@@ -5890,11 +5982,13 @@ return __p
 }
 
 var FilteredFilesView = Marionette.ItemView.extend({
-  template: template$s,
+  template: template$t,
   className: 'filtered_files',
   ui: {
     banner: '.filtered_files-banner',
-    filterName: '.filtered_files-filter_name'
+    filterName: '.filtered_files-filter_name',
+    filterBar: '.filtered_files-filter_bar',
+    sort: '.filtered_files-sort'
   },
   events: {
     'click .filtered_files-reset_filter': function clickFiltered_filesReset_filter() {
@@ -5904,29 +5998,72 @@ var FilteredFilesView = Marionette.ItemView.extend({
       return false;
     }
   },
-  onRender: function onRender() {
-    var entry = this.options.entry;
-    var fileType = this.options.fileType;
-    var collection = entry.getFileCollection(fileType);
-    var blankSlateText = I18n$1.t('pageflow.editor.templates.files_blank_slate.no_files');
-
+  initialize: function initialize() {
+    this.search = new Search({}, {
+      attribute: 'display_name',
+      storageKey: 'pageflow.filtered_files.sort_order'
+    });
+    var collection = this.options.entry.getFileCollection(this.options.fileType);
     if (this.options.filterName) {
-      if (this.filteredCollection) {
-        this.filteredCollection.dispose();
-      }
-
       collection = this.filteredCollection = collection.withFilter(this.options.filterName);
-      blankSlateText = this.filterTranslation('blank_slate');
     }
-
-    this.appendSubview(new CollectionView({
+    this.searchFilteredCollection = this.search.applyTo(collection);
+    if (this.options.selectionHandler) {
+      this.listHighlight = new ListHighlight({}, {
+        collection: this.searchFilteredCollection
+      });
+    }
+  },
+  onRender: function onRender() {
+    this.renderNamedFilter();
+    this.renderSearchField();
+    this.renderSortMenu();
+    this.renderCollectionView();
+  },
+  renderNamedFilter: function renderNamedFilter() {
+    this.ui.banner.toggle(!!this.options.filterName);
+    if (this.options.filterName) {
+      this.ui.filterName.text(this.filterTranslation('name'));
+    }
+  },
+  renderSearchField: function renderSearchField() {
+    this.searchFieldView = this.appendSubview(new ListSearchFieldView({
+      search: this.search,
+      listHighlight: this.listHighlight,
+      ariaControlsId: 'filtered_files',
+      autoFocus: !!this.options.selectionHandler
+    }), {
+      to: this.ui.filterBar
+    });
+  },
+  renderSortMenu: function renderSortMenu() {
+    this.appendSubview(new DropDownButtonView({
+      title: I18n$1.t('pageflow.editor.views.filtered_files_view.sort_button_label'),
+      alignMenu: 'right',
+      openOnClick: true,
+      items: new SortMenuItemsCollection([{
+        name: 'alphabetical'
+      }, {
+        name: 'most_recent'
+      }], {
+        search: this.search
+      })
+    }), {
+      to: this.ui.filterBar
+    });
+  },
+  renderCollectionView: function renderCollectionView() {
+    var blankSlateText = this.options.filterName ? this.filterTranslation('blank_slate') : I18n$1.t('pageflow.editor.templates.files_blank_slate.no_files');
+    this.appendSubview(this.subview(new CollectionView({
       tagName: 'ul',
+      id: 'filtered_files',
       className: 'files expandable',
-      collection: collection,
+      collection: this.searchFilteredCollection,
       itemViewConstructor: FileItemView,
       itemViewOptions: {
-        metaDataAttributes: fileType.metaDataAttributes,
-        selectionHandler: this.options.selectionHandler
+        metaDataAttributes: this.options.fileType.metaDataAttributes,
+        selectionHandler: this.options.selectionHandler,
+        listHighlight: this.listHighlight
       },
       blankSlateViewConstructor: Marionette.ItemView.extend({
         template: blankSlateTemplate,
@@ -5936,12 +6073,7 @@ var FilteredFilesView = Marionette.ItemView.extend({
           };
         }
       })
-    }));
-    this.ui.banner.toggle(!!this.options.filterName);
-
-    if (this.options.filterName) {
-      this.ui.filterName.text(this.filterTranslation('name'));
-    }
+    })));
   },
   filterTranslation: function filterTranslation(keyName, options) {
     var filterName = this.options.filterName;
@@ -5949,13 +6081,33 @@ var FilteredFilesView = Marionette.ItemView.extend({
     return i18nUtils.findTranslation(['pageflow.entry_types.' + entryTypeName + '.editor.files.filters.' + this.options.fileType.collectionName + '.' + filterName + '.' + keyName, 'pageflow.entry_types.' + entryTypeName + '.editor.files.common_filters.' + keyName, 'pageflow.editor.files.filters.' + this.options.fileType.collectionName + '.' + filterName + '.' + keyName, 'pageflow.editor.files.common_filters.' + keyName], options);
   },
   onClose: function onClose() {
-    if (this.filteredCollection) {
-      this.filteredCollection.dispose();
-    }
+    var _this$filteredCollect;
+    Marionette.ItemView.prototype.onClose.call(this);
+    (_this$filteredCollect = this.filteredCollection) === null || _this$filteredCollect === void 0 ? void 0 : _this$filteredCollect.dispose();
+    this.searchFilteredCollection.dispose();
+  }
+});
+var SortMenuItem = Backbone.Model.extend({
+  initialize: function initialize(attributes, options) {
+    var _this = this;
+    this.search = options.search;
+    this.set('label', I18n$1.t("pageflow.editor.views.filtered_files_view.sort.".concat(this.get('name'))));
+    this.set('kind', 'radio');
+    var updateChecked = function updateChecked() {
+      _this.set('checked', _this.search.get('order') === _this.get('name'));
+    };
+    this.listenTo(this.search, 'change:order', updateChecked);
+    updateChecked();
+  },
+  selected: function selected() {
+    this.search.set('order', this.get('name'));
   }
 });
+var SortMenuItemsCollection = Backbone.Collection.extend({
+  model: SortMenuItem
+});
 
-function template$t(data) {
+function template$u(data) {
 var __t, __p = '';
 __p += '<div class="box choose_importer_box">\n  <h1 class="dialog-header">' +
 ((__t = ( I18n.t('pageflow.editor.views.files_view.importer.heading') )) == null ? '' : __t) +
@@ -5965,7 +6117,7 @@ __p += '<div class="box choose_importer_box">\n  <h1 class="dialog-header">' +
 return __p
 }
 
-function template$u(data) {
+function template$v(data) {
 var __t, __p = '';
 __p += '<button class=\'importer\' data-key=\'' +
 ((__t = ( data.fileImporter.key )) == null ? '' : __t) +
@@ -5980,7 +6132,7 @@ return __p
 }
 
 var ImporterSelectView = Marionette.ItemView.extend({
-  template: template$u,
+  template: template$v,
   className: 'importer_select',
   tagName: 'li',
   events: {
@@ -5997,7 +6149,7 @@ var ImporterSelectView = Marionette.ItemView.extend({
 });
 
 var ChooseImporterView = Marionette.ItemView.extend({
-  template: template$t,
+  template: template$u,
   className: 'choose_importer editor dialog',
   mixins: [dialogView],
   ui: {
@@ -6013,7 +6165,6 @@ var ChooseImporterView = Marionette.ItemView.extend({
     if (this.options.callback) {
       this.options.callback(importer);
     }
-
     this.close();
   },
   onRender: function onRender() {
@@ -6027,12 +6178,11 @@ var ChooseImporterView = Marionette.ItemView.extend({
     });
   }
 });
-
 ChooseImporterView.open = function (options) {
   app.dialogRegion.show(new ChooseImporterView(options).render());
 };
 
-function template$v(data) {
+function template$w(data) {
 var __t, __p = '';
 __p += '<div class="box file_importer_box">\n  <h1 class="dialog-header">' +
 ((__t = ( I18n.t('pageflow.editor.file_importers.'+data.importerKey+'.dialog_label') )) == null ? '' : __t) +
@@ -6046,7 +6196,7 @@ __p += '<div class="box file_importer_box">\n  <h1 class="dialog-header">' +
 return __p
 }
 
-function template$w(data) {
+function template$x(data) {
 var __t, __p = '';
 __p += '<div class="box">\n  <h1 class="dialog-header">' +
 ((__t = ( I18n.t('pageflow.editor.templates.confirm_upload.header') )) == null ? '' : __t) +
@@ -6062,14 +6212,14 @@ __p += '<div class="box">\n  <h1 class="dialog-header">' +
 return __p
 }
 
-function template$x(data) {
+function template$y(data) {
 var __p = '';
 __p += '';
 return __p
 }
 
 var EditFileView = Marionette.ItemView.extend({
-  template: template$x,
+  template: template$y,
   className: 'edit_file',
   onRender: function onRender() {
     var fileType = this.model.fileType();
@@ -6079,19 +6229,14 @@ var EditFileView = Marionette.ItemView.extend({
       model: this.model.configuration,
       attributeTranslationKeyPrefixes: ['pageflow.entry_types.' + entryTypeName + '.editor.files.attributes.' + fileType.collectionName, 'pageflow.entry_types.' + entryTypeName + '.editor.files.common_attributes', 'pageflow.editor.files.attributes.' + fileType.collectionName, 'pageflow.editor.files.common_attributes', 'pageflow.editor.nested_files.' + fileType.collectionName, 'pageflow.editor.nested_files.common_attributes']
     });
-
-    if (this.options.displayFileName) {
-      tab.input('file_name', TextInputView, {
-        model: this.model,
-        disabled: true
-      });
-    }
-
+    tab.input('display_name', FileNameInputView, {
+      model: this.model,
+      required: true
+    });
     tab.input('rights', TextInputView, {
       model: this.model,
       placeholder: entry.get('default_file_rights')
     });
-
     if (editor.entryType.supportsExtendedFileRights && !fileType.noExtendedFileRights) {
       tab.input('source_url', TextInputView);
       tab.input('license', SelectInputView, {
@@ -6106,14 +6251,11 @@ var EditFileView = Marionette.ItemView.extend({
         values: ['credits', 'inline']
       });
     }
-
     tab.view(SeparatorView);
-
     _(this.fileTypeInputs()).each(function (options) {
       tab.input(options.name, options.inputView, options.inputViewOptions);
     });
-
-    tab.input('original_url', UrlDisplayView, {
+    tab.input('download_url', UrlDisplayView, {
       model: this.model
     });
     this.appendSubview(tab);
@@ -6134,7 +6276,6 @@ var UploadableFilesView = Marionette.View.extend({
   className: 'uploadable_files',
   initialize: function initialize() {
     this.uploadableFiles = this.collection.uploadable();
-
     if (!this.options.selection.has('file')) {
       this.options.selection.set('file', this.uploadableFiles.first());
     }
@@ -6159,7 +6300,7 @@ var UploadableFilesView = Marionette.View.extend({
   },
   commonColumns: function commonColumns(options) {
     return [{
-      name: 'file_name',
+      name: 'display_name',
       headerText: options.fileTypeDisplayName,
       cellView: TextTableCellView
     }, {
@@ -6177,7 +6318,7 @@ var UploadableFilesView = Marionette.View.extend({
 });
 
 var ConfirmFileImportUploadView = Marionette.Layout.extend({
-  template: template$w,
+  template: template$x,
   className: 'confirm_upload editor dialog',
   mixins: [dialogView],
   regions: {
@@ -6196,13 +6337,11 @@ var ConfirmFileImportUploadView = Marionette.Layout.extend({
   },
   getSelectedFiles: function getSelectedFiles() {
     var files = [];
-
     _.each(state.files, function (collection) {
       if (collection.length > 0) {
         files = files.concat(collection.toJSON());
       }
     });
-
     return files;
   },
   initialize: function initialize() {
@@ -6231,7 +6370,6 @@ var ConfirmFileImportUploadView = Marionette.Layout.extend({
   },
   update: function update() {
     var file = this.selection.get('file');
-
     if (file) {
       this.selectedFileRegion.show(new EditFileView({
         model: file
@@ -6241,13 +6379,12 @@ var ConfirmFileImportUploadView = Marionette.Layout.extend({
     }
   }
 });
-
 ConfirmFileImportUploadView.open = function (options) {
   app.dialogRegion.show(new ConfirmFileImportUploadView(options));
 };
 
 var FilesImporterView = Marionette.ItemView.extend({
-  template: template$v,
+  template: template$w,
   className: 'files_importer editor dialog',
   mixins: [dialogView],
   ui: {
@@ -6271,7 +6408,6 @@ var FilesImporterView = Marionette.ItemView.extend({
     });
     this.listenTo(this.model.get('importer'), "change", function (event) {
       this.updateImportButton();
-
       if (!this.isInitialized) {
         this.updateAuthenticationView();
       }
@@ -6279,7 +6415,6 @@ var FilesImporterView = Marionette.ItemView.extend({
   },
   updateAuthenticationView: function updateAuthenticationView() {
     var importer = this.model.get('importer');
-
     if (importer.get('isAuthenticated')) {
       this.ui.contentPanel.empty();
       this.ui.contentPanel.append(this.model.get('importer').createFileImportDialogView().render().el);
@@ -6294,14 +6429,14 @@ var FilesImporterView = Marionette.ItemView.extend({
     var self = this;
     this.model.get('importer').getFilesMetaData().then(function (metaData) {
       if (metaData) {
-        self.model.set('metaData', metaData); // add each selected file meta to state.files
-
+        self.model.set('metaData', metaData);
+        // add each selected file meta to state.files
         for (var i = 0; i < metaData.files.length; i++) {
           var file = metaData.files[i];
           var fileType = editor.fileTypes.findByUpload(file);
           file = new fileType.model({
             state: 'uploadable',
-            file_name: file.name,
+            display_name: file.name,
             content_type: file.type,
             file_size: -1,
             rights: file.rights,
@@ -6314,7 +6449,6 @@ var FilesImporterView = Marionette.ItemView.extend({
           });
           state.entry.getFileCollection(fileType).add(file);
         }
-
         ConfirmFileImportUploadView.open({
           fileTypes: editor.fileTypes,
           fileImportModel: self.model,
@@ -6332,12 +6466,11 @@ var FilesImporterView = Marionette.ItemView.extend({
     }
   }
 });
-
 FilesImporterView.open = function (options) {
   app.dialogRegion.show(new FilesImporterView(options).render());
 };
 
-function template$y(data) {
+function template$z(data) {
 var __t, __p = '';
 __p += '<button class="">\n  <span class="label">' +
 ((__t = ( I18n.t('pageflow.editor.templates.select_button.select') )) == null ? '' : __t) +
@@ -6346,7 +6479,7 @@ return __p
 }
 
 var SelectButtonView = Marionette.ItemView.extend({
-  template: template$y,
+  template: template$z,
   className: 'select_button',
   ui: {
     button: 'button',
@@ -6359,15 +6492,12 @@ var SelectButtonView = Marionette.ItemView.extend({
       e.preventDefault();
       var index = getClickedIndex(e.target);
       this.model.get('options')[index].handler();
-
       function getClickedIndex(target) {
         var $target = $(target),
-            index = parseInt($target.data('index'), 10);
-
+          index = parseInt($target.data('index'), 10);
         if (isNaN(index)) {
           index = parseInt($target.find('a').data('index'), 10);
         }
-
         return index;
       }
     }
@@ -6381,7 +6511,7 @@ var SelectButtonView = Marionette.ItemView.extend({
   }
 });
 
-function template$z(data) {
+function template$A(data) {
 var __t, __p = '';
 __p += '<a class="back">' +
 ((__t = ( I18n.t('pageflow.editor.templates.files.back') )) == null ? '' : __t) +
@@ -6390,7 +6520,7 @@ return __p
 }
 
 var FilesView = Marionette.ItemView.extend({
-  template: template$z,
+  template: template$A,
   className: 'manage_files',
   events: {
     'click a.back': 'goBack',
@@ -6410,7 +6540,6 @@ var FilesView = Marionette.ItemView.extend({
         });
       }
     }];
-
     if (editor.fileImporters.keys().length > 0) {
       menuOptions.push({
         label: I18n$1.t('pageflow.editor.views.files_view.import'),
@@ -6425,7 +6554,6 @@ var FilesView = Marionette.ItemView.extend({
         }
       });
     }
-
     this.addFileModel = new Backbone.Model({
       label: I18n$1.t('pageflow.editor.views.files_view.add'),
       options: menuOptions
@@ -6448,12 +6576,12 @@ var FilesView = Marionette.ItemView.extend({
   tab: function tab(fileType) {
     var selectionMode = this.options.allowSelectingAny || this.options.tabName === fileType.collectionName;
     this.tabsView.tab(fileType.collectionName, _.bind(function () {
-      return this.subview(new FilteredFilesView({
+      return new FilteredFilesView({
         entry: state.entry,
         fileType: fileType,
         selectionHandler: selectionMode && this.options.selectionHandler,
         filterName: selectionMode && this.options.filterName
-      }));
+      });
     }, this));
     this.listenTo(this.model, 'change:uploading_' + fileType.collectionName + '_count', function (model, value) {
       this.tabsView.toggleSpinnerOnTab(fileType.collectionName, value > 0);
@@ -6475,14 +6603,14 @@ var FilesView = Marionette.ItemView.extend({
   }
 });
 
-function template$A(data) {
+function template$B(data) {
 var __p = '';
 __p += '<div class="quota_state">\n</div>\n<div class="outlet">\n</div>\n<div class="exhausted_message">\n</div>\n';
 return __p
 }
 
 var EntryPublicationQuotaDecoratorView = Marionette.Layout.extend({
-  template: template$A,
+  template: template$B,
   className: 'quota_decorator',
   regions: {
     outlet: '.outlet'
@@ -6499,7 +6627,6 @@ var EntryPublicationQuotaDecoratorView = Marionette.Layout.extend({
   },
   update: function update() {
     var view = this;
-
     if (this.model.get('checking')) {
       view.ui.state.text(I18n$1.t('pageflow.editor.quotas.loading'));
       view.ui.exhaustedMessage.hide().html('');
@@ -6516,14 +6643,13 @@ var EntryPublicationQuotaDecoratorView = Marionette.Layout.extend({
         } else {
           view.ui.state.hide();
         }
-
         view.outlet.show(view.options.view);
       }
     }
   }
 });
 
-function template$B(data) {
+function template$C(data) {
 var __t, __p = '';
 __p += '<div class="files_pending notice">\n  <p>' +
 ((__t = ( I18n.t('pageflow.editor.templates.publish_entry.files_pending_notice') )) == null ? '' : __t) +
@@ -6574,7 +6700,7 @@ return __p
 }
 
 var PublishEntryView = Marionette.ItemView.extend({
-  template: template$B,
+  template: template$C,
   className: 'publish_entry',
   ui: {
     publishUntilFields: '.publish_until_fields',
@@ -6632,31 +6758,27 @@ var PublishEntryView = Marionette.ItemView.extend({
     this.ui.successLink.attr('href', this.model.get('pretty_url'));
     this.ui.successLink.text(this.model.get('pretty_url'));
     var publishedUntil = new Date(this.model.get('published_until'));
-
     if (publishedUntil > new Date()) {
       this.ui.publishUntilField.datepicker('setDate', publishedUntil);
       this.ui.publishUntilTimeField.val(timeStr(publishedUntil));
     } else {
       this.ui.publishUntilField.datepicker('setDate', this.defaultPublishedUntilDate());
     }
-
     this.ui.userNameField.val(this.options.account.get('name'));
-
     if (this.model.get('password_protected')) {
       this.ui.passwordProtectedCheckBox.prop('checked', true);
       this.togglePasswordFields();
     } else {
       this.ui.passwordField.val(this.randomPassword());
     }
-
     this.ui.noindexCheckBox.prop('checked', this.model.get('last_published_with_noindex'));
     this.ui.alreadyPublishedWithPassword.toggle(this.model.get('published') && this.model.get('password_protected'));
     this.ui.previouslyPublishedWithPassword.toggle(!this.model.get('published') && this.model.get('password_protected'));
-    this.ui.alreadyPublishedWithoutPassword.toggle(this.model.get('published') && !this.model.get('password_protected')); // Helpers
+    this.ui.alreadyPublishedWithoutPassword.toggle(this.model.get('published') && !this.model.get('password_protected'));
 
+    // Helpers
     function timeStr(date) {
       return twoDigits(date.getHours()) + ':' + twoDigits(date.getMinutes());
-
       function twoDigits(val) {
         return ("0" + val).slice(-2);
       }
@@ -6664,28 +6786,23 @@ var PublishEntryView = Marionette.ItemView.extend({
   },
   save: function save() {
     var publishedUntil = null;
-
     if (this.$el.hasClass('publishing')) {
       return;
     }
-
     if (this.ui.publishUntilRadioBox.is(':checked')) {
       publishedUntil = this.ui.publishUntilField.datepicker('getDate');
       setTime(publishedUntil, this.ui.publishUntilTimeField.val());
-
       if (!this.checkPublishUntilTime()) {
         alert('Bitte legen Sie einen gültigen Depublikationszeitpunkt fest.');
         this.ui.publishUntilTimeField.focus();
         return;
       }
-
       if (!publishedUntil || !checkDate(publishedUntil)) {
         alert('Bitte legen Sie ein Depublikationsdatum fest.');
         this.ui.publishUntilField.focus();
         return;
       }
     }
-
     var that = this;
     this.options.entryPublication.publish({
       published_until: publishedUntil,
@@ -6698,41 +6815,35 @@ var PublishEntryView = Marionette.ItemView.extend({
       if (that.isClosed) {
         return;
       }
-
       that.$el.removeClass('publishing');
       that.$el.addClass('succeeded');
       that.$('input').removeAttr('disabled');
       var publishedMessage = that.options.entryPublication.get('published_message_html');
-
       if (publishedMessage) {
         that.ui.successNotice.append(publishedMessage);
       }
-
       that.enableSave();
     });
     this.$el.addClass('publishing');
     this.$('input').attr('disabled', '1');
-    this.disableSave(); // Helpers
+    this.disableSave();
 
+    // Helpers
     function setTime(date, time) {
       date.setHours.apply(date, parseTime(time));
     }
-
     function parseTime(str) {
       return str.split(':').map(function (number) {
         return parseInt(number, 10);
       });
     }
-
     function checkDate(date) {
       if (Object.prototype.toString.call(date) === "[object Date]") {
         if (isNaN(date.getTime())) {
           return false;
         }
-
         return true;
       }
-
       return false;
     }
   },
@@ -6757,11 +6868,9 @@ var PublishEntryView = Marionette.ItemView.extend({
     this.ui.publishUntilRadioBox[0].checked = false;
     this.ui.publishUntilFields.addClass('disabled');
     this.checkForm();
-
     if (!this.checkPublishUntilTime()) {
       this.ui.publishUntilTimeField.val('00:00');
     }
-
     this.ui.publishUntilTimeField.removeClass('invalid');
     this.ui.publishUntilField.removeClass('invalid');
   },
@@ -6794,7 +6903,6 @@ var PublishEntryView = Marionette.ItemView.extend({
       this.ui.publishUntilTimeField.addClass('invalid');
       return false;
     }
-
     this.ui.publishUntilTimeField.removeClass('invalid');
     return true;
   },
@@ -6818,7 +6926,6 @@ var PublishEntryView = Marionette.ItemView.extend({
     }).join('');
   }
 });
-
 PublishEntryView.create = function (options) {
   return new BackButtonDecoratorView({
     view: new EntryPublicationQuotaDecoratorView({
@@ -6841,10 +6948,9 @@ var SidebarController = Marionette.Controller.extend({
   },
   files: function files(collectionName, handler, payload, filterName) {
     var _split = (collectionName || '').split(':'),
-        _split2 = _slicedToArray(_split, 2),
-        tabName = _split2[0],
-        suffix = _split2[1];
-
+      _split2 = _slicedToArray(_split, 2),
+      tabName = _split2[0],
+      suffix = _split2[1];
     this.region.show(new FilesView({
       model: this.entry,
       selectionHandler: handler && editor.createFileSelectionHandler(handler, payload),
@@ -6883,9 +6989,12 @@ var SidebarController = Marionette.Controller.extend({
     editor.setDefaultHelpEntry('pageflow.help_entries.publish');
   },
   widget: function widget(id) {
+    var model = this.entry.widgets.get(id);
     this.region.show(new EditWidgetView({
-      model: this.entry.widgets.get(id)
+      entry: this.entry,
+      model: model
     }));
+    this.entry.trigger('selectWidget', model);
   }
 });
 
@@ -6969,7 +7078,7 @@ var ScrollingView = Marionette.View.extend({
   }
 });
 
-function template$C(data) {
+function template$D(data) {
 var __t, __p = '';
 __p += '<div class="box">\n  <h2>' +
 ((__t = ( I18n.t('pageflow.editor.templates.help.title') )) == null ? '' : __t) +
@@ -6980,7 +7089,7 @@ return __p
 }
 
 var HelpView = Marionette.ItemView.extend({
-  template: template$C,
+  template: template$D,
   className: 'help',
   ui: {
     placeholder: '.placeholder',
@@ -6996,7 +7105,6 @@ var HelpView = Marionette.ItemView.extend({
     },
     'click a': function clickA(event) {
       var link = $(event.currentTarget);
-
       if (link.attr('href').indexOf('#') === 0) {
         this.showSection(link.attr('href').substring(1), {
           scrollIntoView: !link.parents('nav').length
@@ -7004,7 +7112,6 @@ var HelpView = Marionette.ItemView.extend({
       } else if (link.attr('href').match(/^http/)) {
         window.open(link.attr('href'), '_blank');
       }
-
       return false;
     },
     'click .box': function clickBox() {
@@ -7037,10 +7144,8 @@ var HelpView = Marionette.ItemView.extend({
       var menuItem = $(this);
       var active = menuItem.find('a').attr('href') === '#' + name;
       menuItem.toggleClass('active', active);
-
       if (active) {
         menuItem.parents('.expandable').addClass('expanded');
-
         if (options.scrollIntoView) {
           menuItem[0].scrollIntoView();
         }
@@ -7057,7 +7162,7 @@ var PageThumbnailView = ModelThumbnailView.extend({
   className: 'model_thumbnail page_thumbnail'
 });
 
-function template$D(data) {
+function template$E(data) {
 var __t, __p = '';
 __p += '<div>\n  <span class="missing_page_thumbnail"></span>\n  <span class="page_thumbnail"></span>\n  <div class="title"></div>\n  <div class="label"></div>\n  <a class="remove" title="' +
 ((__t = ( I18n.t('pageflow.editor.templates.page_link_item.remove') )) == null ? '' : __t) +
@@ -7068,7 +7173,7 @@ return __p
 }
 
 var PageLinkItemView = Marionette.ItemView.extend({
-  template: template$D,
+  template: template$E,
   tagName: 'li',
   className: 'page_link',
   ui: {
@@ -7099,7 +7204,6 @@ var PageLinkItemView = Marionette.ItemView.extend({
   },
   onRender: function onRender() {
     var page = this.model.targetPage();
-
     if (page) {
       this.subview(new PageThumbnailView({
         el: this.ui.thumbnail,
@@ -7110,7 +7214,6 @@ var PageLinkItemView = Marionette.ItemView.extend({
     } else {
       this.ui.title.text(I18n$1.t('pageflow.editor.views.page_link_item_view.no_page'));
     }
-
     this.ui.label.text(this.model.label());
     this.ui.label.toggle(!!this.model.label());
     this.ui.editButton.toggle(!!this.model.editPath());
@@ -7118,7 +7221,7 @@ var PageLinkItemView = Marionette.ItemView.extend({
   }
 });
 
-function template$E(data) {
+function template$F(data) {
 var __t, __p = '';
 __p += '<label>\n  <span class="name">' +
 ((__t = ( I18n.t('pageflow.editor.templates.page_links.label') )) == null ? '' : __t) +
@@ -7129,7 +7232,7 @@ return __p
 }
 
 var PageLinksView = Marionette.ItemView.extend({
-  template: template$E,
+  template: template$F,
   className: 'page_links',
   ui: {
     links: 'ul.links',
@@ -7165,14 +7268,14 @@ var PageLinksView = Marionette.ItemView.extend({
   }
 });
 
-function template$F(data) {
+function template$G(data) {
 var __p = '';
 __p += '<div class="emulation_mode_button-wrapper"\n     data-tooltip-align="top center">\n  <div class="emulation_mode_button-desktop_icon"/>\n  <div class="emulation_mode_button-phone_icon"/>\n  <div class="emulation_mode_button-track" />\n  <div class="emulation_mode_button-thumb" />\n</div>\n';
 return __p
 }
 
 var EmulationModeButtonView = Marionette.ItemView.extend({
-  template: template$F,
+  template: template$G,
   className: 'emulation_mode_button',
   mixins: [tooltipContainer],
   ui: {
@@ -7185,7 +7288,6 @@ var EmulationModeButtonView = Marionette.ItemView.extend({
       if (this.model.get('emulation_mode_disabled')) {
         return;
       }
-
       if (this.model.has('emulation_mode')) {
         this.model.unset('emulation_mode');
       } else {
@@ -7206,7 +7308,7 @@ var EmulationModeButtonView = Marionette.ItemView.extend({
   }
 });
 
-function template$G(data) {
+function template$H(data) {
 var __t, __p = '';
 __p +=
 ((__t = ( I18n.t('pageflow.editor.templates.help_button.open_help') )) == null ? '' : __t);
@@ -7214,7 +7316,7 @@ return __p
 }
 
 var HelpButtonView = Marionette.ItemView.extend({
-  template: template$G,
+  template: template$H,
   className: 'help_button',
   events: {
     'click': function click() {
@@ -7231,7 +7333,6 @@ var SidebarFooterView = Marionette.View.extend({
         model: this.model
       }));
     }
-
     this.appendSubview(new HelpButtonView());
     return this;
   }
@@ -7262,7 +7363,7 @@ var InfoBoxView = Marionette.View.extend({
   }
 });
 
-function template$H(data) {
+function template$I(data) {
 var __t, __p = '';
 __p += '<span class="list_item_thumbnail"></span>\n<span class="list_item_missing_thumbnail"></span>\n<span class="list_item_type_pictogram type_pictogram"></span>\n\n<div class="list_item_title"></div>\n<div class="list_item_description"></div>\n\n<div class="list_item_buttons">\n  <a class="list_item_edit_button" title="' +
 ((__t = ( I18n.t('pageflow.editor.templates.list_item.edit') )) == null ? '' : __t) +
@@ -7273,7 +7374,7 @@ return __p
 }
 
 var ListItemView = Marionette.ItemView.extend({
-  template: template$H,
+  template: template$I,
   tagName: 'li',
   className: 'list_item',
   ui: {
@@ -7312,11 +7413,9 @@ var ListItemView = Marionette.ItemView.extend({
       el: this.ui.thumbnail,
       model: this.model
     }));
-
     if (this.options.typeName) {
       this.$el.addClass(this.typeName());
     }
-
     this.ui.editButton.toggleClass('is_available', !!this.options.onEdit);
     this.ui.removeButton.toggleClass('is_available', !!this.options.onRemove);
     this.update();
@@ -7347,7 +7446,7 @@ var ListItemView = Marionette.ItemView.extend({
   }
 });
 
-function template$I(data) {
+function template$J(data) {
 var __t, __p = '';
 __p += '<div class="checking notice editor">\n  <p>' +
 ((__t = ( I18n.t('pageflow.editor.templates.locked.loading') )) == null ? '' : __t) +
@@ -7362,7 +7461,7 @@ return __p
 }
 
 var LockedView = Marionette.ItemView.extend({
-  template: template$I,
+  template: template$J,
   className: 'locked checking',
   ui: {
     breakButton: '.break',
@@ -7453,7 +7552,6 @@ var BackgroundImageEmbeddedView = Marionette.View.extend({
     } else {
       this.updateClassName();
     }
-
     if (this.options.dataSizeAttributes) {
       this.updateDataSizeAttributes();
     }
@@ -7465,7 +7563,6 @@ var BackgroundImageEmbeddedView = Marionette.View.extend({
     var prefix = this.options.backgroundImageClassNamePrefix.call ? this.options.backgroundImageClassNamePrefix() : this.options.backgroundImageClassNamePrefix;
     prefix = prefix || 'image';
     var backgroundImageClassName = id && prefix + '_' + id;
-
     if (this.currentBackgroundImageClassName !== backgroundImageClassName) {
       this.$el.removeClass(this.currentBackgroundImageClassName);
       this.$el.addClass(backgroundImageClassName);
@@ -7480,7 +7577,6 @@ var BackgroundImageEmbeddedView = Marionette.View.extend({
   },
   updateDataSizeAttributes: function updateDataSizeAttributes() {
     var imageFile = this.model.getImageFile(this.options.propertyName);
-
     if (imageFile && imageFile.isReady()) {
       this.$el.attr('data-width', imageFile.get('width'));
       this.$el.attr('data-height', imageFile.get('height'));
@@ -7488,7 +7584,6 @@ var BackgroundImageEmbeddedView = Marionette.View.extend({
       this.$el.attr('data-width', '16');
       this.$el.attr('data-height', '9');
     }
-
     this.$el.css({
       backgroundPosition: '0 0'
     });
@@ -7517,15 +7612,12 @@ var LazyVideoEmbeddedView = Marionette.View.extend({
     if (this.videoPlayer.isPresent() && this.model.hasChanged(this.options.propertyName)) {
       var paused = this.videoPlayer.paused();
       this.videoPlayer.src(this.model.getVideoFileSources(this.options.propertyName));
-
       if (!paused) {
         this.videoPlayer.play();
       }
     }
-
     if (this.options.dataSizeAttributes) {
       var videoFile = this.model.getVideoFile(this.options.propertyName);
-
       if (videoFile && videoFile.isReady()) {
         this.$el.attr('data-width', videoFile.get('width'));
         this.$el.attr('data-height', videoFile.get('height'));
@@ -7537,7 +7629,7 @@ var LazyVideoEmbeddedView = Marionette.View.extend({
   }
 });
 
-function template$J(data) {
+function template$K(data) {
 var __t, __p = '';
 __p += '<li class="uploading"><span class="count">0</span>' +
 ((__t = ( I18n.t('pageflow.editor.templates.notification.upload_pending') )) == null ? '' : __t) +
@@ -7560,7 +7652,7 @@ return __p
 var NotificationsView = Marionette.ItemView.extend({
   className: 'notifications',
   tagName: 'ul',
-  template: template$J,
+  template: template$K,
   ui: {
     failedCount: '.failed .count',
     uploadingCount: '.uploading .count',
@@ -7604,12 +7696,10 @@ var FileProcessingStateDisplayView = Marionette.View.extend({
     if (typeof this.options.collection === 'string') {
       this.options.collection = state.entry.getFileCollection(editor.fileTypes.findByCollectionName(this.options.collection));
     }
-
     this.listenTo(this.model, 'change:' + this.options.propertyName, this._update);
   },
   render: function render() {
     this._update();
-
     return this;
   },
   _update: function _update() {
@@ -7618,9 +7708,7 @@ var FileProcessingStateDisplayView = Marionette.View.extend({
       this.fileStagesView.close();
       this.fileStagesView = null;
     }
-
     this.file = this._getFile();
-
     if (this.file) {
       this.listenTo(this.file.unfinishedStages, 'add remove', this._updateClassNames);
       this.fileStagesView = new CollectionView({
@@ -7633,7 +7721,6 @@ var FileProcessingStateDisplayView = Marionette.View.extend({
       });
       this.appendSubview(this.fileStagesView);
     }
-
     this._updateClassNames();
   },
   _updateClassNames: function _updateClassNames() {
@@ -7654,7 +7741,6 @@ var NestedFilesView = Marionette.View.extend({
       this.options.selection.set('file', this.collection.first());
       this.options.selection.set('nextFile', this.collection.at(1));
     }
-
     this.listenTo(this.collection, 'add', this.selectNewFile);
     this.listenTo(this.collection, 'remove', this.selectNextFileIfSelectionDeleted);
     this.listenTo(this.options.selection, 'change', this.setNextFile);
@@ -7684,7 +7770,6 @@ var NestedFilesView = Marionette.View.extend({
         configurationAttribute: true
       });
     });
-
     nestedFilesColumns.push({
       name: 'delete',
       cellView: DeleteRowTableCellView,
@@ -7701,7 +7786,6 @@ var NestedFilesView = Marionette.View.extend({
   },
   selectNextFileIfSelectionDeleted: function selectNextFileIfSelectionDeleted() {
     var fileIndex = this.collection.indexOf(this.options.selection.get('file'));
-
     if (fileIndex === -1) {
       var nextFile = this.options.selection.get('nextFile');
       this.options.selection.set('file', nextFile);
@@ -7709,7 +7793,6 @@ var NestedFilesView = Marionette.View.extend({
   },
   setNextFile: _.debounce(function () {
     var fileIndex = this.collection.indexOf(this.options.selection.get('file'));
-
     if (typeof this.collection.at(fileIndex + 1) !== 'undefined') {
       this.options.selection.set('nextFile', this.collection.at(fileIndex + 1));
     } else if (typeof this.collection.at(fileIndex - 1) !== 'undefined') {
@@ -7720,7 +7803,7 @@ var NestedFilesView = Marionette.View.extend({
   }, 200)
 });
 
-function template$K(data) {
+function template$L(data) {
 var __t, __p = '';
 __p += '<div class="text_tracks_container">\n  <div class="files_upload_panel">\n    <div class="files_panel">\n    </div>\n    <a class="upload" href="">' +
 ((__t = ( I18n.t('pageflow.editor.templates.text_tracks.upload') )) == null ? '' : __t) +
@@ -7731,7 +7814,7 @@ return __p
 }
 
 var TextTracksView = Marionette.Layout.extend({
-  template: template$K,
+  template: template$L,
   className: 'text_tracks',
   regions: {
     selectedFileRegion: '.selected_file_region'
@@ -7765,7 +7848,6 @@ var TextTracksView = Marionette.Layout.extend({
   },
   update: function update() {
     var selectedFile = this.selection.get('file');
-
     if (selectedFile) {
       this.selectedFileRegion.show(new EditFileView({
         model: selectedFile,
@@ -7795,7 +7877,7 @@ var TextTracksFileMetaDataItemValueView = FileMetaDataItemValueView.extend({
   }
 });
 
-function template$L(data) {
+function template$M(data) {
 var __p = '';
 __p += '<label>\n  <span class="list_label"></span>\n</label>\n\n<ul class="list_items"></ul>\n';
 return __p
@@ -7840,9 +7922,8 @@ return __p
  *
  * @class
  */
-
 var ListView = Marionette.ItemView.extend({
-  template: template$L,
+  template: template$M,
   className: 'list',
   ui: {
     label: '.list_label',
@@ -7872,7 +7953,7 @@ var ListView = Marionette.ItemView.extend({
 });
 
 var ConfirmUploadView = Marionette.Layout.extend({
-  template: template$w,
+  template: template$x,
   className: 'confirm_upload editor dialog',
   mixins: [dialogView],
   regions: {
@@ -7906,7 +7987,6 @@ var ConfirmUploadView = Marionette.Layout.extend({
   },
   update: function update() {
     var file = this.selection.get('file');
-
     if (file) {
       this.selectedFileRegion.show(new EditFileView({
         model: file
@@ -7916,7 +7996,6 @@ var ConfirmUploadView = Marionette.Layout.extend({
     }
   }
 });
-
 ConfirmUploadView.watch = function (fileUploader, fileTypes, files) {
   fileUploader.on('new:batch', function () {
     ConfirmUploadView.open({
@@ -7926,7 +8005,6 @@ ConfirmUploadView.watch = function (fileUploader, fileTypes, files) {
     });
   });
 };
-
 ConfirmUploadView.open = function (options) {
   app.dialogRegion.show(new ConfirmUploadView(options));
 };
@@ -7964,6 +8042,12 @@ ConfirmUploadView.open = function (options) {
  * Override the `destroyModel` method to customize destroy behavior.
  * Calls `destroyWithDelay` by default.
  *
+ * Override the `goBackPath` property or method to customize the path
+ * that the back button navigates to. Defaults to `/`.
+ *
+ * Set the `hideDestroyButton` property to `true` to hide the destroy
+ * button.
+ *
  * @param {Object} options
  * @param {Backbone.Model} options.model -
  *   Model including the {@link configurationContainer},
@@ -7971,20 +8055,22 @@ ConfirmUploadView.open = function (options) {
  *
  * @since 15.1
  */
-
 var EditConfigurationView = Marionette.Layout.extend({
   className: 'edit_configuration_view',
   template: function template(_ref) {
-    var t = _ref.t;
-    return "\n    <a class=\"back\">".concat(t('back'), "</a>\n    <a class=\"destroy\">").concat(t('destroy'), "</a>\n\n    <div class=\"failure\">\n      <p>").concat(t('save_error'), "</p>\n      <p class=\"message\"></p>\n      <a class=\"retry\" href=\"\">").concat(t('retry'), "</a>\n    </div>\n\n    <div class=\"configuration_container\"></div>\n  ");
+    var t = _ref.t,
+      backLabel = _ref.backLabel,
+      hideDestroyButton = _ref.hideDestroyButton;
+    return "\n    <a class=\"back\">".concat(backLabel, "</a>\n    ").concat(hideDestroyButton ? '' : "<a class=\"destroy\">".concat(t('destroy'), "</a>"), "\n\n    <div class=\"failure\">\n      <p>").concat(t('save_error'), "</p>\n      <p class=\"message\"></p>\n      <a class=\"retry\" href=\"\">").concat(t('retry'), "</a>\n    </div>\n\n    <div class=\"configuration_container\"></div>\n  ");
   },
   serializeData: function serializeData() {
     var _this = this;
-
     return {
       t: function t(key) {
         return _this.t(key);
-      }
+      },
+      backLabel: this.getBackLabel(),
+      hideDestroyButton: _.result(this, 'hideDestroyButton')
     };
   },
   mixins: [failureIndicatingView],
@@ -7997,7 +8083,6 @@ var EditConfigurationView = Marionette.Layout.extend({
   },
   onRender: function onRender() {
     var translationKeyPrefix = _.result(this, 'translationKeyPrefix');
-
     this.configurationEditor = new ConfigurationEditorView({
       tabTranslationKeyPrefix: "".concat(translationKeyPrefix, ".tabs"),
       attributeTranslationKeyPrefixes: ["".concat(translationKeyPrefix, ".attributes")],
@@ -8020,13 +8105,16 @@ var EditConfigurationView = Marionette.Layout.extend({
     this.model.destroyWithDelay();
   },
   goBack: function goBack() {
-    editor.navigate('/', {
+    var path = _.result(this, 'goBackPath') || '/';
+    editor.navigate(path, {
       trigger: true
     });
   },
+  getBackLabel: function getBackLabel() {
+    return this.t(_.result(this, 'goBackPath') ? 'back' : 'outline');
+  },
   t: function t(suffix) {
     var translationKeyPrefix = _.result(this, 'translationKeyPrefix');
-
     return I18n$1.t("".concat(translationKeyPrefix, ".").concat(suffix), {
       defaultValue: I18n$1.t("pageflow.editor.views.edit_configuration.".concat(suffix))
     });
@@ -8200,7 +8288,6 @@ app.addInitializer(function (options) {
       settingsDialogTabLink: 'general'
     }
   }];
-
   if (editor.entryType.supportsExtendedFileRights) {
     editor.fileTypes.commonMetaDataAttributes = [].concat(_toConsumableArray(editor.fileTypes.commonMetaDataAttributes), [{
       name: 'source_url',
@@ -8221,7 +8308,6 @@ app.addInitializer(function (options) {
       }
     }]);
   }
-
   editor.fileTypes.commonSettingsDialogTabs = [{
     name: 'general',
     view: EditFileView
@@ -8250,33 +8336,31 @@ app.addInitializer(function (options) {
       settingsDialogTabLink: 'general'
     }
   };
+  var altConfigurationEditorInput = {
+    name: 'alt',
+    inputView: TextInputView,
+    inputViewOptions: {
+      maxLength: 5000
+    }
+  };
   editor.fileTypes.register('image_files', {
     model: ImageFile,
     metaDataAttributes: ['dimensions', altMetaDataAttribute],
     matchUpload: /^image/,
-    configurationEditorInputs: [{
-      name: 'alt',
-      inputView: TextInputView
-    }]
+    configurationEditorInputs: [altConfigurationEditorInput]
   });
   editor.fileTypes.register('video_files', {
     model: VideoFile,
     metaDataAttributes: ['format', 'dimensions', 'duration', textTracksMetaDataAttribute, altMetaDataAttribute],
     matchUpload: /^video/,
-    configurationEditorInputs: [{
-      name: 'alt',
-      inputView: TextInputView
-    }],
+    configurationEditorInputs: [altConfigurationEditorInput],
     settingsDialogTabs: [textTracksSettingsDialogTab]
   });
   editor.fileTypes.register('audio_files', {
     model: AudioFile,
     metaDataAttributes: ['format', 'duration', textTracksMetaDataAttribute, altMetaDataAttribute],
     matchUpload: /^audio/,
-    configurationEditorInputs: [{
-      name: 'alt',
-      inputView: TextInputView
-    }],
+    configurationEditorInputs: [altConfigurationEditorInput],
     settingsDialogTabs: [textTracksSettingsDialogTab]
   });
   editor.fileTypes.register('text_track_files', {
@@ -8370,12 +8454,13 @@ app.addInitializer(function (options) {
   state.pages = new PagesCollection(options.pages);
   state.chapters = new ChaptersCollection(options.chapters);
   state.storylines = new StorylinesCollection(options.storylines);
+  state.site = new Site(options.site);
   state.entry = editor.createEntryModel(options, {
     widgets: widgets
   });
-  state.site = new Site(options.site);
   state.account = new Backbone.Model(options.account);
   widgets.subject = state.entry;
+  widgets.setupConfigurationEditorTabViewGroups(ConfigurationEditorTabView.groups);
   state.storylineOrdering = new StorylineOrdering(state.storylines, state.pages);
   state.storylineOrdering.sort({
     silent: true
@@ -8428,7 +8513,6 @@ app.addInitializer(function () {
       })
     });
   });
-
   editor.router = new SidebarRouter({
     controller: new SidebarController({
       region: app.sidebarRegion,
@@ -8451,12 +8535,14 @@ app.addInitializer(function () {
   });
 });
 
-app.addInitializer(function () {
+app.addInitializer(function /* args */
+() {
   var context = this;
   var args = arguments;
-
   _.each(editor.initializers, function (fn) {
-    fn.call(context, args);
+    fn.call(context, _objectSpread2(_objectSpread2({}, args), {}, {
+      entry: state.entry
+    }));
   });
 });
 
@@ -8489,4 +8575,4 @@ app.addRegions({
   sidebarFooterRegion: 'sidebar .sidebar_footer_container'
 });
 
-export { AudioFile, BackButtonDecoratorView, BackgroundImageEmbeddedView, BackgroundPositioningPreviewView, BackgroundPositioningSlidersView, BackgroundPositioningView, ChangeThemeDialogView, Chapter, ChapterConfiguration, ChapterPagesCollection, ChapterScaffold, ChaptersCollection, ChooseImporterView, Configuration, ConfirmEncodingView, ConfirmFileImportUploadView, ConfirmUploadView, ConfirmableFileItemView, DropDownButtonItemListView, DropDownButtonItemView, DropDownButtonView, EditConfigurationView, EditEntryView, EditFileView, EditLock, EditLockContainer, EditMetaDataView, EditWidgetView, EditWidgetsView, EditorApi, EditorView, EmulationModeButtonView, EncodedFile, EncodingConfirmation, Entry, EntryMetadata, EntryMetadataFileSelectionHandler, EntryPublication, EntryPublicationQuotaDecoratorView, ExplorerFileItemView, Failure, FileConfiguration, FileImport, FileInputView, FileItemView, FileMetaDataItemValueView, FileMetaDataItemView, FileProcessingStateDisplayView, FileReuse, FileSettingsDialogView, FileStage, FileStageItemView, FileThumbnailView, FileTypes, FileTypesCollection, FileUploader, FilesCollection, FilesExplorerView, FilesImporterView, FilesView, FilteredFilesView, ForeignKeySubsetCollection, HelpButtonView, HelpImageView, HelpView, ImageFile, InfoBoxView, InvalidNestedTypeError, LazyVideoEmbeddedView, ListItemView, ListView, LoadingView, LockedView, ModelThumbnailView, NestedFilesCollection, NestedFilesView, NestedTypeError, NotificationsView, OrderedPageLinksCollection, OtherEntriesCollection, OtherEntriesCollectionView, OtherEntry, OtherEntryItemView, Page, PageConfigurationFileSelectionHandler, PageLink, PageLinkConfigurationEditorView, PageLinkFileSelectionHandler, PageLinkItemView, PageLinksCollection, PageLinksView, PageThumbnailView, PagesCollection, PublishEntryView, ReferenceInputView, ReusableFile, Scaffold, ScrollingView, SelectButtonView, SidebarController, SidebarFooterView, SidebarRouter, Site, StaticThumbnailView, Storyline, StorylineChaptersCollection, StorylineConfiguration, StorylineOrdering, StorylineScaffold, StorylineTransitiveChildPages, StorylinesCollection, SubsetCollection, TextFileMetaDataItemValueView, TextTrackFile, TextTracksFileMetaDataItemValueView, TextTracksView, Theme, ThemeInputView, ThemeItemView, ThemesCollection, UnmatchedUploadError, UploadError, UploadableFile, UploadableFilesView, UploaderView, VideoFile, Widget, WidgetConfiguration, WidgetConfigurationFileSelectionHandler, WidgetItemView, WidgetTypes, WidgetsCollection, addAndReturnModel, app, authenticationProvider, configurationContainer, delayedDestroying, dialogView, editor, entryTypeEditorControllerUrls, failureIndicatingView, failureTracking, fileWithType, filesCountWatcher, formDataUtils, loadable, modelLifecycleTrackingView, orderedCollection, persistedPromise, polling, retryable, selectableView, stageProvider, startEditor, state, stylesheet, transientReferences, validFileTypeTranslationList };
+export { AudioFile, BackButtonDecoratorView, BackgroundImageEmbeddedView, BackgroundPositioningPreviewView, BackgroundPositioningSlidersView, BackgroundPositioningView, ChangeThemeDialogView, Chapter, ChapterConfiguration, ChapterPagesCollection, ChapterScaffold, ChaptersCollection, ChooseImporterView, Configuration, ConfirmEncodingView, ConfirmFileImportUploadView, ConfirmUploadView, ConfirmableFileItemView, DropDownButtonItemListView, DropDownButtonItemView, DropDownButtonView, EditConfigurationView, EditEntryView, EditFileView, EditLock, EditLockContainer, EditMetaDataView, EditWidgetView, EditWidgetsView, EditorApi, EditorView, EmulationModeButtonView, EncodedFile, EncodingConfirmation, Entry, EntryMetadata, EntryMetadataFileSelectionHandler, EntryPublication, EntryPublicationQuotaDecoratorView, ExplorerFileItemView, Failure, FileConfiguration, FileImport, FileInputView, FileItemView, FileMetaDataItemValueView, FileMetaDataItemView, FileProcessingStateDisplayView, FileReuse, FileSettingsDialogView, FileStage, FileStageItemView, FileThumbnailView, FileTypes, FileTypesCollection, FileUploader, FilesCollection, FilesExplorerView, FilesImporterView, FilesView, FilteredFilesView, ForeignKeySubsetCollection, HelpButtonView, HelpImageView, HelpView, ImageFile, InfoBoxView, InvalidNestedTypeError, LazyVideoEmbeddedView, ListHighlight, ListItemView, ListView, LoadingView, LockedView, ModelThumbnailView, NestedFilesCollection, NestedFilesView, NestedTypeError, NotificationsView, OrderedPageLinksCollection, OtherEntriesCollection, OtherEntriesCollectionView, OtherEntry, OtherEntryItemView, Page, PageConfigurationFileSelectionHandler, PageLink, PageLinkConfigurationEditorView, PageLinkFileSelectionHandler, PageLinkItemView, PageLinksCollection, PageLinksView, PageThumbnailView, PagesCollection, PublishEntryView, ReferenceInputView, ReusableFile, Scaffold, ScrollingView, Search, SelectButtonView, SidebarController, SidebarFooterView, SidebarRouter, Site, StaticThumbnailView, Storyline, StorylineChaptersCollection, StorylineConfiguration, StorylineOrdering, StorylineScaffold, StorylineTransitiveChildPages, StorylinesCollection, SubsetCollection, TextFileMetaDataItemValueView, TextTrackFile, TextTracksFileMetaDataItemValueView, TextTracksView, Theme, ThemeInputView, ThemeItemView, ThemesCollection, UnmatchedUploadError, UploadError, UploadableFile, UploadableFilesView, UploaderView, VideoFile, Widget, WidgetConfiguration, WidgetConfigurationFileSelectionHandler, WidgetItemView, WidgetTypes, WidgetsCollection, addAndReturnModel, app, authenticationProvider, configurationContainer, delayedDestroying, dialogView, editor, entryTypeEditorControllerUrls, failureIndicatingView, failureTracking, fileWithType, filesCountWatcher, formDataUtils, loadable, modelLifecycleTrackingView, orderedCollection, persistedPromise, polling, retryable, selectableView, stageProvider, startEditor, state, stylesheet, transientReferences, validFileTypeTranslationList };