@oat-sa/tao-core-ui 3.23.0 → 3.24.0

package/dist/resourcemgr.js

@@ -1,13 +1,17 @@
-define(['jquery', 'lodash', 'core/pluginifier', 'ui/resourcemgr/fileBrowser', 'ui/resourcemgr/filePreview', 'ui/resourcemgr/fileSelector', 'handlebars', 'lib/handlebars/helpers', 'ui/modal', 'css!ui/resourcemgr/css/resourcemgr.css'], function ($$1, _, Pluginifier, fileBrowser, filePreview, fileSelector, Handlebars, Helpers0, modal, resourcemgr_css) { 'use strict';
+define(['jquery', 'lodash', 'core/pluginifier', 'ui/resourcemgr/assetSearch', 'ui/resourcemgr/fileBrowser', 'ui/resourcemgr/filePreview', 'ui/resourcemgr/fileSelector', 'ui/feedback', 'handlebars', 'lib/handlebars/helpers', 'util/url', 'i18n', 'ui/modal', 'css!ui/resourcemgr/css/resourcemgr.css'], function ($$1, _, Pluginifier, assetSearch, fileBrowser, filePreview, fileSelector, feedback, Handlebars, Helpers0, urlUtil, __, modal, resourcemgr_css) { 'use strict';
 
     $$1 = $$1 && Object.prototype.hasOwnProperty.call($$1, 'default') ? $$1['default'] : $$1;
     _ = _ && Object.prototype.hasOwnProperty.call(_, 'default') ? _['default'] : _;
     Pluginifier = Pluginifier && Object.prototype.hasOwnProperty.call(Pluginifier, 'default') ? Pluginifier['default'] : Pluginifier;
+    assetSearch = assetSearch && Object.prototype.hasOwnProperty.call(assetSearch, 'default') ? assetSearch['default'] : assetSearch;
     fileBrowser = fileBrowser && Object.prototype.hasOwnProperty.call(fileBrowser, 'default') ? fileBrowser['default'] : fileBrowser;
     filePreview = filePreview && Object.prototype.hasOwnProperty.call(filePreview, 'default') ? filePreview['default'] : filePreview;
     fileSelector = fileSelector && Object.prototype.hasOwnProperty.call(fileSelector, 'default') ? fileSelector['default'] : fileSelector;
+    feedback = feedback && Object.prototype.hasOwnProperty.call(feedback, 'default') ? feedback['default'] : feedback;
     Handlebars = Handlebars && Object.prototype.hasOwnProperty.call(Handlebars, 'default') ? Handlebars['default'] : Handlebars;
     Helpers0 = Helpers0 && Object.prototype.hasOwnProperty.call(Helpers0, 'default') ? Helpers0['default'] : Helpers0;
+    urlUtil = urlUtil && Object.prototype.hasOwnProperty.call(urlUtil, 'default') ? urlUtil['default'] : urlUtil;
+    __ = __ && Object.prototype.hasOwnProperty.call(__, 'default') ? __['default'] : __;
 
     if (!Helpers0.__initialized) {
       Helpers0(Handlebars);
@@ -33,31 +37,67 @@ define(['jquery', 'lodash', 'core/pluginifier', 'ui/resourcemgr/fileBrowser', 'u
       if (helper = helpers.title) { stack1 = helper.call(depth0, {hash:{},data:data}); }
       else { helper = (depth0 && depth0.title); stack1 = typeof helper === functionType ? helper.call(depth0, {hash:{},data:data}) : helper; }
       if(stack1 || stack1 === 0) { buffer += stack1; }
-      buffer += "</h2>\n\n    <div class=\"file-wrapper\">\n\n        <!-- left section: items selection -->\n        <section class=\"file-browser\">\n            <h1>"
-        + escapeExpression((helper = helpers.__ || (depth0 && depth0.__),options={hash:{},data:data},helper ? helper.call(depth0, "Browse resources", options) : helperMissing.call(depth0, "__", "Browse resources", options)))
-        + "</h1>\n            <div class=\"file-browser-wrapper\"></div>\n        </section>\n\n        <!-- test editor  -->\n        <section class=\"file-selector\">\n\n            <h1>\n                <div class=\"title lft\"></div>\n                <div class=\"upload-switcher rgt\">\n                    <a href=\"#\" class=\"btn-info small upload hidden\"><span class=\"icon-add\"></span>"
+      buffer += "</h2>\n\n    <div class=\"file-wrapper\">\n\n        <div class=\"file-panels\">\n            <!-- left section: search, filters, folder tree -->\n            <section class=\"file-browser\">\n                <div class=\"asset-search hidden\" hidden>\n                    <div class=\"asset-search-header\">\n                        <button\n                            type=\"button\"\n                            class=\"asset-search-toggle\"\n                            aria-expanded=\"true\"\n                            aria-controls=\"";
+      if (helper = helpers.assetSearchBodyId) { stack1 = helper.call(depth0, {hash:{},data:data}); }
+      else { helper = (depth0 && depth0.assetSearchBodyId); stack1 = typeof helper === functionType ? helper.call(depth0, {hash:{},data:data}) : helper; }
+      buffer += escapeExpression(stack1)
+        + "\"\n                        >\n                            <span class=\"asset-search-title\">"
+        + escapeExpression((helper = helpers.__ || (depth0 && depth0.__),options={hash:{},data:data},helper ? helper.call(depth0, "Search", options) : helperMissing.call(depth0, "__", "Search", options)))
+        + "</span>\n                            <span class=\"asset-search-applied-count hidden\" hidden></span>\n                            <span class=\"asset-search-scope\" aria-live=\"polite\">\n                                <span class=\"asset-search-scope-prefix\">"
+        + escapeExpression((helper = helpers.__ || (depth0 && depth0.__),options={hash:{},data:data},helper ? helper.call(depth0, "Searching in:", options) : helperMissing.call(depth0, "__", "Searching in:", options)))
+        + "</span>\n                                <span class=\"asset-search-scope-name\"></span>\n                                <span class=\"asset-search-scope-subfolders hidden\" hidden>"
+        + escapeExpression((helper = helpers.__ || (depth0 && depth0.__),options={hash:{},data:data},helper ? helper.call(depth0, "and its subfolders", options) : helperMissing.call(depth0, "__", "and its subfolders", options)))
+        + "</span>\n                            </span>\n                            <span class=\"asset-search-chevron icon-up\" aria-hidden=\"true\"></span>\n                        </button>\n                    </div>\n                    <div class=\"asset-search-body\" id=\"";
+      if (helper = helpers.assetSearchBodyId) { stack1 = helper.call(depth0, {hash:{},data:data}); }
+      else { helper = (depth0 && depth0.assetSearchBodyId); stack1 = typeof helper === functionType ? helper.call(depth0, {hash:{},data:data}) : helper; }
+      buffer += escapeExpression(stack1)
+        + "\">\n                        <div class=\"asset-search-field\">\n                            <span class=\"icon-find\" aria-hidden=\"true\"></span>\n                            <label class=\"asset-search-label\" for=\"";
+      if (helper = helpers.assetSearchInputId) { stack1 = helper.call(depth0, {hash:{},data:data}); }
+      else { helper = (depth0 && depth0.assetSearchInputId); stack1 = typeof helper === functionType ? helper.call(depth0, {hash:{},data:data}) : helper; }
+      buffer += escapeExpression(stack1)
+        + "\">"
+        + escapeExpression((helper = helpers.__ || (depth0 && depth0.__),options={hash:{},data:data},helper ? helper.call(depth0, "Search by name or label", options) : helperMissing.call(depth0, "__", "Search by name or label", options)))
+        + "</label>\n                            <input\n                                id=\"";
+      if (helper = helpers.assetSearchInputId) { stack1 = helper.call(depth0, {hash:{},data:data}); }
+      else { helper = (depth0 && depth0.assetSearchInputId); stack1 = typeof helper === functionType ? helper.call(depth0, {hash:{},data:data}) : helper; }
+      buffer += escapeExpression(stack1)
+        + "\"\n                                type=\"search\"\n                                class=\"asset-search-input\"\n                                placeholder=\""
+        + escapeExpression((helper = helpers.__ || (depth0 && depth0.__),options={hash:{},data:data},helper ? helper.call(depth0, "Search by name or label", options) : helperMissing.call(depth0, "__", "Search by name or label", options)))
+        + "\"\n                                autocomplete=\"off\"\n                            />\n                        </div>\n                        <div class=\"asset-search-filters\"></div>\n                        <div class=\"asset-search-actions\">\n                            <button type=\"button\" class=\"asset-search-clear hidden\" hidden>"
+        + escapeExpression((helper = helpers.__ || (depth0 && depth0.__),options={hash:{},data:data},helper ? helper.call(depth0, "Clear all", options) : helperMissing.call(depth0, "__", "Clear all", options)))
+        + "</button>\n                            <button type=\"button\" class=\"btn-info small asset-search-submit\" disabled>\n                                <span class=\"asset-search-submit-spinner icon-loop\" aria-hidden=\"true\" hidden></span>\n                                <span class=\"asset-search-submit-label\">"
+        + escapeExpression((helper = helpers.__ || (depth0 && depth0.__),options={hash:{},data:data},helper ? helper.call(depth0, "Search", options) : helperMissing.call(depth0, "__", "Search", options)))
+        + "</span>\n                            </button>\n                        </div>\n                    </div>\n                </div>\n\n                <h1 class=\"resources-title\">"
+        + escapeExpression((helper = helpers.__ || (depth0 && depth0.__),options={hash:{},data:data},helper ? helper.call(depth0, "Resources", options) : helperMissing.call(depth0, "__", "Resources", options)))
+        + "</h1>\n                <div class=\"file-browser-wrapper\"></div>\n            </section>\n\n            <!-- center: asset listing -->\n            <section class=\"file-selector\">\n\n                <h1>\n                    <div class=\"title lft\">"
+        + escapeExpression((helper = helpers.__ || (depth0 && depth0.__),options={hash:{},data:data},helper ? helper.call(depth0, "Assets", options) : helperMissing.call(depth0, "__", "Assets", options)))
+        + "</div>\n                    <div class=\"upload-switcher rgt\">\n                        <a href=\"#\" class=\"btn-info small upload hidden\"><span class=\"icon-add\"></span>"
         + escapeExpression((helper = helpers.__ || (depth0 && depth0.__),options={hash:{},data:data},helper ? helper.call(depth0, "Add file(s)", options) : helperMissing.call(depth0, "__", "Add file(s)", options)))
-        + "</a>\n                    <a href=\"#\" class=\"btn-info small listing\"><span class=\"icon-undo\"></span>"
+        + "</a>\n                        <a href=\"#\" class=\"btn-info small listing\"><span class=\"icon-undo\"></span>"
         + escapeExpression((helper = helpers.__ || (depth0 && depth0.__),options={hash:{},data:data},helper ? helper.call(depth0, "Back to listing", options) : helperMissing.call(depth0, "__", "Back to listing", options)))
-        + "</a>\n                </div>\n            </h1>\n\n            <div class=\"empty\">\n                "
+        + "</a>\n                    </div>\n                </h1>\n\n                <div class=\"asset-search-error hidden\" hidden role=\"alert\">\n                    <p class=\"asset-search-error-message\"></p>\n                    <button type=\"button\" class=\"btn-info small asset-search-retry\">"
+        + escapeExpression((helper = helpers.__ || (depth0 && depth0.__),options={hash:{},data:data},helper ? helper.call(depth0, "Retry", options) : helperMissing.call(depth0, "__", "Retry", options)))
+        + "</button>\n                </div>\n\n                <div class=\"empty\">\n                    "
         + escapeExpression((helper = helpers.__ || (depth0 && depth0.__),options={hash:{},data:data},helper ? helper.call(depth0, "No files", options) : helperMissing.call(depth0, "__", "No files", options)))
-        + "\n            </div>\n\n            <ul class=\"files\"></ul>\n\n            <div class=\"file-upload-container\"></div>\n\n            <div class=\"pagination-bottom\"></div>\n\n        </section>\n\n        <section class=\"file-preview\">\n\n            <h1>"
+        + "\n                </div>\n\n                <div class=\"files-wrapper\" aria-busy=\"false\">\n                    <table class=\"files\">\n                        <thead>\n                            <tr>\n                                <th class=\"files-label sortable sorted sorted_asc\" data-sort-by=\"label\" aria-sort=\"ascending\" tabindex=\"0\">\n                                    <span class=\"sort-label\">"
+        + escapeExpression((helper = helpers.__ || (depth0 && depth0.__),options={hash:{},data:data},helper ? helper.call(depth0, "Label", options) : helperMissing.call(depth0, "__", "Label", options)))
+        + "</span>\n                                </th>\n                                <th class=\"files-location sortable\" data-sort-by=\"location\" aria-sort=\"none\" tabindex=\"0\">\n                                    <span class=\"sort-label\">"
+        + escapeExpression((helper = helpers.__ || (depth0 && depth0.__),options={hash:{},data:data},helper ? helper.call(depth0, "Location", options) : helperMissing.call(depth0, "__", "Location", options)))
+        + "</span>\n                                </th>\n                                <th class=\"files-updated sortable\" data-sort-by=\"updatedAt\" aria-sort=\"none\" tabindex=\"0\">\n                                    <span class=\"sort-label\">"
+        + escapeExpression((helper = helpers.__ || (depth0 && depth0.__),options={hash:{},data:data},helper ? helper.call(depth0, "Last modified on", options) : helperMissing.call(depth0, "__", "Last modified on", options)))
+        + "</span>\n                                </th>\n                            </tr>\n                        </thead>\n                        <tbody class=\"files-list\"></tbody>\n                    </table>\n                </div>\n\n                <div class=\"file-upload-container\"></div>\n\n                <div class=\"pagination-bottom\"></div>\n\n            </section>\n\n            <section class=\"file-preview\">\n\n                <h1>"
         + escapeExpression((helper = helpers.__ || (depth0 && depth0.__),options={hash:{},data:data},helper ? helper.call(depth0, "Preview", options) : helperMissing.call(depth0, "__", "Preview", options)))
-        + "</h1>\n\n            <div class=\"previewer\">\n                <p class=\"nopreview\"></p>\n            </div>\n\n            <h2 class=\"toggler\" data-toggle=\"~ .file-properties\">"
-        + escapeExpression((helper = helpers.__ || (depth0 && depth0.__),options={hash:{},data:data},helper ? helper.call(depth0, "File Properties", options) : helperMissing.call(depth0, "__", "File Properties", options)))
-        + "</h2>\n\n            <div class=\"file-properties\">\n\n                <div class=\"grid-row\">\n                    <div class=\"col-2\">\n                        "
+        + "</h1>\n\n                <div class=\"previewer\">\n                    <p class=\"nopreview\"></p>\n                </div>\n\n                <div class=\"file-properties\">\n\n                    <div class=\"grid-row\">\n                        <div class=\"col-2\">\n                            "
         + escapeExpression((helper = helpers.__ || (depth0 && depth0.__),options={hash:{},data:data},helper ? helper.call(depth0, "Type", options) : helperMissing.call(depth0, "__", "Type", options)))
-        + "\n                    </div>\n                    <div class=\"col-10 prop-type\"></div>\n                </div>\n\n                <div class=\"grid-row\">\n                    <div class=\"col-2\">\n                        "
+        + "\n                        </div>\n                        <div class=\"col-10 prop-type\">—</div>\n                    </div>\n\n                    <div class=\"grid-row\">\n                        <div class=\"col-2\">\n                            "
         + escapeExpression((helper = helpers.__ || (depth0 && depth0.__),options={hash:{},data:data},helper ? helper.call(depth0, "Size", options) : helperMissing.call(depth0, "__", "Size", options)))
-        + "\n                    </div>\n                    <div class=\"col-10 prop-size\"></div>\n                </div>\n\n                <div class=\"grid-row prop-url\">\n                    <div class=\"actions\">\n                        <a href=\"#\" download=\"\" target=\"_blank\" class=\"tlb-button-off download hidden\" title=\""
+        + "\n                        </div>\n                        <div class=\"col-10 prop-size\">—</div>\n                    </div>\n\n                    <div class=\"grid-row prop-url\">\n                        <div class=\"actions\">\n                            <a href=\"#\" download=\"\" target=\"_blank\" class=\"tlb-button-off download hidden\" title=\""
         + escapeExpression((helper = helpers.__ || (depth0 && depth0.__),options={hash:{},data:data},helper ? helper.call(depth0, "Download this file", options) : helperMissing.call(depth0, "__", "Download this file", options)))
-        + "\">\n                            <button class=\"btn-info small\">\n                                <span class=\"icon-download\"></span>"
+        + "\">\n                                <span class=\"icon-download\"></span>"
         + escapeExpression((helper = helpers.__ || (depth0 && depth0.__),options={hash:{},data:data},helper ? helper.call(depth0, "Download this file", options) : helperMissing.call(depth0, "__", "Download this file", options)))
-        + "\n                            </button>\n                        </a>\n                    </div>\n                </div>\n            </div>\n\n            <h2 class=\"toggler\" data-toggle=\"~ .actions\">"
-        + escapeExpression((helper = helpers.__ || (depth0 && depth0.__),options={hash:{},data:data},helper ? helper.call(depth0, "Actions", options) : helperMissing.call(depth0, "__", "Actions", options)))
-        + "</h2>\n\n            <div class=\"actions\">\n                <button class=\"btn-success select-action small\" disabled>\n                    <span class=\"icon-move-item\"></span>"
+        + "\n                            </a>\n                        </div>\n                    </div>\n                </div>\n\n                <div class=\"actions select-actions\">\n                    <button class=\"btn-success select-action small\" disabled>\n                        <span class=\"icon-move-item\"></span>"
         + escapeExpression((helper = helpers.__ || (depth0 && depth0.__),options={hash:{},data:data},helper ? helper.call(depth0, "Select", options) : helperMissing.call(depth0, "__", "Select", options)))
-        + "\n                </button>\n            </div>\n\n        </section>\n\n    </div>\n</div>\n";
+        + "\n                    </button>\n                </div>\n\n            </section>\n        </div>\n\n    </div>\n</div>\n";
       return buffer;
       });
     function layout(data, options, asString) {
@@ -74,7 +114,13 @@ define(['jquery', 'lodash', 'core/pluginifier', 'ui/resourcemgr/fileBrowser', 'u
       }],
       open: true,
       appendContainer: '.tao-scope:first',
-      title: ''
+      title: '',
+      pathParam: 'path',
+      // Advanced Search metadata filters (same endpoints as ui/searchModal)
+      rootClassUri: 'http://www.tao.lu/Ontologies/TAOMedia.rdf#Media',
+      classMappingUrl: urlUtil.route('getWithMapping', 'ClassMetadata', 'tao'),
+      statusUrl: urlUtil.route('status', 'AdvancedSearch', 'tao'),
+      maxListSize: 5
     };
 
     /**
@@ -93,7 +139,18 @@ define(['jquery', 'lodash', 'core/pluginifier', 'ui/resourcemgr/fileBrowser', 'u
        * @constructor
        * @param {Object} options - the plugin options
        * @param {Sring|Boolean} [options.bindEvent = 'click'] - the event that trigger the toggling
-       * @param {String} options.url - the URL of the service used to retrieve the resources.
+       * @param {String} [options.browseUrl] - folder browse endpoint (legacy alias: options.url)
+       * @param {String} [options.url] - legacy alias for browseUrl
+       * @param {String} [options.searchUrl] - scoped asset-search endpoint; omit for browse-only
+       * @param {Boolean} [options.browseSearchFallback=false] - client filter when searchUrl returns browse-shaped `{ children }`
+       * @param {String} [options.initialPath] - folder to open on start (within the media source tree)
+       * @param {String} [options.initialSelection] - asset URI to preselect when present in results
+       * @param {String} [options.currentAsset] - asset URI/path to resolve to parent folder + selection
+       * @param {String} [options.pathParam='path'] - query parameter name for folder/asset path
+       * @param {String} [options.rootClassUri=TAOMedia#Media] - Assets class URI for Advanced Search criteria (metadata filters)
+       * @param {String} [options.classMappingUrl] - ClassMetadata mapping endpoint for criteria list
+       * @param {String} [options.statusUrl] - Advanced Search status endpoint
+       * @param {Number} [options.maxListSize=5] - max list values per criterion in filters UI
        * @fires ResourceMgr#create.resourcemgr
        * @returns {jQueryElement} for chaining
        */
@@ -102,6 +159,9 @@ define(['jquery', 'lodash', 'core/pluginifier', 'ui/resourcemgr/fileBrowser', 'u
 
         //get options using default
         options = _.defaults(options, defaults);
+        if (!options.browseUrl && options.url) {
+          options.browseUrl = options.url;
+        }
         return this.each(function () {
           var $elt = $$1(this);
           var $target;
@@ -112,7 +172,10 @@ define(['jquery', 'lodash', 'core/pluginifier', 'ui/resourcemgr/fileBrowser', 'u
             //auto bind events configured in options
             _.functions(options).forEach(function (eventName) {
               $elt.on(eventName + '.' + ns, function () {
-                options[eventName].apply($elt, arguments);
+                const live = $elt.data(dataNs);
+                if (live && typeof live[eventName] === 'function') {
+                  live[eventName].apply($elt, arguments);
+                }
               });
             });
             $target = options.$target || that._createTarget($elt);
@@ -129,49 +192,236 @@ define(['jquery', 'lodash', 'core/pluginifier', 'ui/resourcemgr/fileBrowser', 'u
             $target.on('closed.modal', function () {
               $elt.trigger('close.' + ns);
             });
-            //initialize the components
-            const $fileBrowser = $$1('.file-browser .file-browser-wrapper', $target);
-            if (options.mediaSourcesUrl) {
-              $$1.getJSON(options.mediaSourcesUrl).done(function (data) {
-                const mediaSources = data || defaults.mediaSources;
-                for (let i = 0; i < mediaSources.length; i++) {
-                  options.root = mediaSources[i].root;
-                  options.path = mediaSources[i].path;
-                  $fileBrowser.append('<div class="' + options.root + '"><ul class="folders"></ul></div>');
-                  fileBrowser(options);
+            options.contextToken = 1;
+            const initToken = options.contextToken;
+            $elt.data(dataNs, options);
+            that._resolveCurrentAssetContext(options, initToken).always(function (resolvedOptions) {
+              const current = $elt.data(dataNs);
+              if (!current) {
+                return;
+              }
+              const ownsOpen = current.contextToken === initToken;
+              if (!ownsOpen) {
+                return;
+              }
+              $elt.data(dataNs, resolvedOptions);
+              that._ensureBrowsersStarted($elt, resolvedOptions).always(function () {
+                const latest = $elt.data(dataNs) || resolvedOptions;
+                if (!latest._createEventEmitted) {
+                  latest._createEventEmitted = true;
+                  $elt.data(dataNs, latest);
+                  /**
+                   * The plugin have been created.
+                   * @event ResourceMgr#create.resourcemgr
+                   */
+                  $elt.trigger('create.' + ns, [latest.$target[0]]);
                 }
-              }).fail(function () {
-                for (let i = 0; i < defaults.mediaSources.length; i++) {
-                  options.root = defaults.mediaSources[i].root;
-                  options.path = defaults.mediaSources[i].path;
-                  $fileBrowser.append('<div class="' + options.root + '"><ul class="folders"></ul></div>');
-                  fileBrowser(options);
+                if (ownsOpen && latest.open) {
+                  that._open($elt);
                 }
               });
-            } else if (options.path && options.root) {
-              $fileBrowser.append('<div class="' + options.root + '"><ul class="folders"></ul></div>');
-              fileBrowser(options);
-            }
-            $fileBrowser.find('li.root:last').addClass('active');
-            fileSelector(options);
-            filePreview(options);
-
-            /**
-             * The plugin have been created.
-             * @event ResourceMgr#create.resourcemgr
-             */
-            $elt.trigger('create.' + ns, [$target[0]]);
-            if (options.open) {
-              that._open($elt);
-            }
+            });
           } else {
-            options = $elt.data(dataNs);
-            if (options.open) {
-              that._open($elt);
-            }
+            // Reopen: consumer may pass a new currentAsset (edit/change after create).
+            that._reopenWithContext($elt, options);
           }
         });
       },
+      /**
+       * Merge reopen options, re-resolve currentAsset, re-apply folder/selection, then open.
+       * @param {jQuery} $elt
+       * @param {Object} incoming - options from the latest .resourcemgr(…) call
+       */
+      _reopenWithContext: function ($elt, incoming) {
+        const that = resourceMgr;
+        const stored = $elt.data(dataNs);
+        if (!stored) {
+          return;
+        }
+        if (Object.prototype.hasOwnProperty.call(incoming, 'currentAsset')) {
+          stored.currentAsset = incoming.currentAsset;
+          stored.initialPath = null;
+          stored.initialSelection = null;
+          stored.currentAssetItem = null;
+        }
+        if (incoming.params && typeof incoming.params === 'object') {
+          stored.params = Object.assign({}, stored.params || {}, incoming.params);
+        }
+        ['select', 'open', 'close'].forEach(function (key) {
+          if (typeof incoming[key] === 'function') {
+            stored[key] = incoming[key];
+          }
+        });
+        stored.contextToken = (stored.contextToken || 0) + 1;
+        const token = stored.contextToken;
+        $elt.data(dataNs, stored);
+        that._resolveCurrentAssetContext(stored, token).always(function (resolved) {
+          const current = $elt.data(dataNs);
+          if (!current || current.contextToken !== token) {
+            return;
+          }
+          $elt.data(dataNs, resolved);
+          that._ensureBrowsersStarted($elt, resolved).always(function () {
+            that._applyResolvedContext($elt, resolved);
+            that._open($elt);
+          });
+        });
+      },
+      /**
+       * Notify mounted browser/selector to open parent folder and (re)preselect.
+       * @param {jQuery} $elt
+       * @param {Object} options
+       */
+      _applyResolvedContext: function ($elt, options) {
+        if (!options || !options.$target) {
+          return;
+        }
+        options.$target.trigger('applycontext.' + ns, [{
+          path: options.initialPath || options.path || '/',
+          selection: options.initialSelection || null,
+          currentAssetItem: options.currentAssetItem || null
+        }]);
+      },
+      /**
+       * Resolve currentAsset via browse/search endpoint into initialPath/initialSelection.
+       * @param {Object} options
+       * @param {number} [expectedToken] - contextToken that must still match before mutating options
+       * @returns {Promise}
+       */
+      _resolveCurrentAssetContext: function (options, expectedToken) {
+        const deferred = $$1.Deferred();
+        const isStale = function () {
+          return typeof expectedToken !== 'undefined' && expectedToken !== null && options.contextToken !== expectedToken;
+        };
+        if (!options.currentAsset || !options.browseUrl && !options.searchUrl) {
+          deferred.resolve(options);
+          return deferred.promise();
+        }
+        const endpoint = options.browseUrl || options.searchUrl;
+        const pathParam = options.pathParam || 'path';
+        const params = Object.assign({}, options.params || {}, {
+          currentAsset: options.currentAsset
+        });
+        params[pathParam] = options.path || '/';
+        $$1.ajax({
+          url: endpoint,
+          method: 'GET',
+          dataType: 'json',
+          timeout: Number(options.ajaxTimeoutMs) > 0 ? Number(options.ajaxTimeoutMs) : 10000,
+          data: params
+        }).done(function (response) {
+          if (isStale()) {
+            deferred.resolve(options);
+            return;
+          }
+          const payload = response && response.data ? response.data : response;
+          if (payload && payload.parentPath) {
+            options.initialPath = payload.parentPath;
+          }
+          if (payload && payload.currentAsset && payload.currentAsset.uri) {
+            options.initialSelection = payload.currentAsset.uri;
+            options.currentAssetItem = payload.currentAsset;
+          } else {
+            options.initialSelection = null;
+            options.currentAssetItem = null;
+          }
+          deferred.resolve(options);
+        }).fail(function () {
+          if (isStale()) {
+            deferred.resolve(options);
+            return;
+          }
+          // AC6: keep RM usable without selection; surface recoverable feedback.
+          options.initialSelection = null;
+          options.currentAssetItem = null;
+          if (options.$target && options.$target.length) {
+            feedback(options.$target).warning(__('Unable to resolve the current asset. You can still browse and select another file.'));
+          }
+          deferred.resolve(options);
+        });
+        return deferred.promise();
+      },
+      /**
+       * Start browsers once and resolve when the tree wrapper is mounted.
+       * @param {jQuery} $elt
+       * @param {Object} options
+       * @returns {Promise}
+       */
+      _ensureBrowsersStarted: function ($elt, options) {
+        const stored = $elt.data(dataNs) || options;
+        if (stored._browsersStartPromise) {
+          return stored._browsersStartPromise;
+        }
+        stored._browsersStartPromise = this._startBrowsers($elt, stored);
+        $elt.data(dataNs, stored);
+        return stored._browsersStartPromise;
+      },
+      /**
+       * Mount file browser / selector / search after options are ready.
+       * @param {jQuery} $elt
+       * @param {Object} options
+       */
+      _startBrowsers: function ($elt, options) {
+        const $fileBrowser = $$1('.file-browser .file-browser-wrapper', options.$target);
+        const waitForTreeWrapper = function () {
+          const deferred = $$1.Deferred();
+          const isMounted = function () {
+            return $fileBrowser.children().length > 0;
+          };
+          if (isMounted()) {
+            deferred.resolve();
+            return deferred.promise();
+          }
+          let attempts = 200;
+          const poll = function () {
+            if (isMounted()) {
+              deferred.resolve();
+              return;
+            }
+            attempts -= 1;
+            if (attempts <= 0) {
+              deferred.reject();
+              return;
+            }
+            window.setTimeout(poll, 50);
+          };
+          poll();
+          return deferred.promise();
+        };
+        const finishMount = function () {
+          $fileBrowser.find('li.root:last').addClass('active');
+          fileSelector(options);
+          filePreview(options);
+          assetSearch(options);
+        };
+        const mountFromSources = function (mediaSources) {
+          const sources = mediaSources || defaults.mediaSources;
+          for (let i = 0; i < sources.length; i++) {
+            options.root = sources[i].root;
+            options.path = sources[i].path;
+            $fileBrowser.append('<div class="' + options.root + '"><ul class="folders"></ul></div>');
+            fileBrowser(options);
+          }
+        };
+        const afterComponentsMounted = function () {
+          finishMount();
+          return waitForTreeWrapper();
+        };
+        if (options.mediaSourcesUrl) {
+          return $$1.getJSON(options.mediaSourcesUrl).then(function (data) {
+            mountFromSources(data || defaults.mediaSources);
+            return afterComponentsMounted();
+          }, function () {
+            mountFromSources(defaults.mediaSources);
+            return afterComponentsMounted();
+          });
+        }
+        if (options.path && options.root) {
+          $fileBrowser.append('<div class="' + options.root + '"><ul class="folders"></ul></div>');
+          fileBrowser(options);
+        }
+        return afterComponentsMounted();
+      },
       _createTarget: function ($elt) {
         var options = $elt.data(dataNs);
         if (options) {
@@ -181,7 +431,9 @@ define(['jquery', 'lodash', 'core/pluginifier', 'ui/resourcemgr/fileBrowser', 'u
           //generate
           options.$target = $$1(layout({
             title: options.title || '',
-            className: options.className || ''
+            className: options.className || '',
+            assetSearchInputId: options.targetId + '-asset-search',
+            assetSearchBodyId: options.targetId + '-asset-search-body'
           }));
           options.$target.attr('id', options.targetId).css('display', 'none').appendTo(options.appendContainer);
           $elt.data(dataNs, options);